booking_card

Neyin rezerve edildiği, tek bir kartta. booking_card, bir seçimin ardından gelen özettir: ne, ne zaman, nerede; ayrıca sonrasında önem taşıyan ayrıntılar için sekiz adede kadar etiket/değer satırı: referans numarası, kişi, fiyat.

İsteğe bağlı görsel kartın kendi kenarına kadar uzanır; böylece bir mekân veya ders, veritabanındaki bir satır yerine gerçek bir yer gibi görünür.

reference, kopyalama düğmesine sahip rezervasyon numarasıdır; status, küçük bir hap rozettir (“Confirmed”, ton success); ofsetiyle birlikte ISO 8601 biçimindeki starts_at, ilgili zaman henüz ilerideyken when altına “2 saat içinde” ifadesini ekler. Flutter 0.40.0 ve Web 0.17.0 sürümünden itibaren.

Yürüyüş analizi ve provaNeon Kicks Amsterdam, Haarlemmerstraat 24

2 Eylül Çarşamba, 10:00 - 10:45

Deneme kabini 2, zemin kat

UzmanMeral Doğan

RezervasyonFIT-2291

Deneme randevusunu onaylayın

Ekran görüntüsü değildir; tarayıcınızda SDK'nın kendi boyut ve renkleriyle canlı olarak çizilir.

Flutter SDK ve Web SDK ile, her ikisi de 0.1.0 sürümünden itibaren yerel olarak render edilir.

Ne zaman kullanılmamalı

Zaman seçenekleri sunmak için kullanmayın. Seçim yapmak datetime_slots bileşeninin görevidir; bu blok ise sonucu kaydeder.

Ödeme özeti olarak da kullanmayın. Toplam tutar içeren parasal değerler, ara toplamı, vergiyi ve toplamı düzgün bir sütun olarak render eden receipt bileşenine aittir.

Props

Her blok ayrıca type ve 1 ila 300 karakter uzunluğunda zorunlu bir fallback_text taşır.

Prop	Tür	Zorunlu	Kısıtlamalar
`title`	string	Evet	1 ila 120 karakter.
`subtitle`	string	Hayır	En fazla 200 karakter.
`when`	string	Hayır	En fazla 80 karakter. Kullanıcının yerel ayarına göre sizin tarafınızdan biçimlendirilir.
`where`	string	Hayır	En fazla 120 karakter.
`image_url`	string	Hayır	Yalnızca https.
`lines`	array	Hayır	En fazla 8 girdi.
`lines[].label`	string	Evet	En fazla 60 karakter.
`lines[].value`	string	Evet	En fazla 120 karakter.
`cta`	object	Hayır	Yok
`cta.label`	string	Evet	1 ila 60 karakter.
`cta.action`	action	Evet	`{ kind: "reply", text }` veya `{ kind: "open_url", url }` veya `{ kind: "navigate", route }` veya `{ kind: "call", phone }` veya `{ kind: "copy", text }` veya `{ kind: "add_to_calendar", title, starts_at }`. Bkz. Actions.
`reference`	object	Hayır	Yok
`reference.label`	string	Evet	1 ila 30 karakter.
`reference.value`	string	Evet	1 ila 40 karakter.
`status`	object	Hayır	Yok
`status.label`	string	Evet	1 ila 24 karakter.
`status.tone`	`success` \| `warning` \| `error` \| `neutral`	Hayır	Yok
`starts_at`	string	Hayır	Farkıyla birlikte ISO 8601 (`2026-10-10T09:30:00+03:00`) veya `Z`.

Ağ üzerinde

{
  "id": "blk_13",
  "type": "booking_card",
  "fallback_text": "Fitting on 2 September at 10:00, Neon Kicks Amsterdam.",
  "props": {
    "title": "Gait analysis and fitting",
    "subtitle": "Neon Kicks Amsterdam, Haarlemmerstraat 24",
    "when": "Wednesday 2 September, 10:00 to 10:45",
    "where": "Fitting room 2, ground floor",
    "image_url": "https://cdn.example.com/store-amsterdam.jpg",
    "lines": [
      {
        "label": "Fitter",
        "value": "Meral Doğan"
      },
      {
        "label": "Booking",
        "value": "FIT-2291"
      }
    ],
    "cta": {
      "label": "Confirm the fitting",
      "action": {
        "kind": "reply",
        "text": "Confirm booking FIT-2291"
      }
    }
  }
}

Etkileşim

Yalnızca CTA ve referansın kopyalama düğmesi etkileşimlidir; kartın kendisine dokunulamaz. CTA, derlemenin bildirdiği herhangi bir türü taşır; yaygın olanı, zamanları sunucunun aksiyonlarınızın sonuçlarına göre denetlediği add_to_calendar türüdür.

Onay sisteminize yazma işlemi yapıyorsa, bunu bir write aksiyonu olarak kaydedin ve sunucunun bir confirm_card oluşturmasını sağlayın. CTA'yı bir onay olarak değerlendirmeyin.

Durumlar

Durum	SDK'nın çizdiği içerik
Loading	Başlık çubuğu ve ayrıntı satırının üzerinde geniş bir görsel yer tutucusu.
No image	Kart başlığından başlar. Gelmeyecek bir resim için hiçbir yer ayrılmaz.
Image broken	Görsel alanı, bozuk görsel simgesi içeren içe gömük bir dikdörtgen barındırır ve kart normal şekilde render edilir.

Erişilebilirlik

Görsel dekoratiftir ve hiçbir şey seslendirmez; çünkü hiyerarşide hemen ardından başlık gelir ve başlığı tekrarlayan bir alt metin, okuyucunun bunu iki kez duymasına neden olur. fallback_text, kullanıcının duymaya asıl ihtiyaç duyduğu üç unsur oldukları için ne, ne zaman ve nerede bilgilerini tek bir cümlede taşımalıdır.