Countdown Timer

Countdown timer to a target date/time.

Type: "countdownTimer"

Countdown timer to a target date/time.

Props

Field	Type	Default	Keterangan
`targetDate`	string	`"2026-06-23T02:59"`	Tanggal Target
`expiredText`	string	`"Penawaran telah berakhir"`	Teks Saat Berakhir
`layout`	'boxes'\|'minimal'	`"boxes"`	Layout
`alignment`	enum	`"center"`	Alignment
`showDays`	boolean	`true`	Tampilkan Hari
`showHours`	boolean	`true`	Tampilkan Jam
`showMinutes`	boolean	`true`	Tampilkan Menit
`showSeconds`	boolean	`true`	Tampilkan Detik
`separator`	'none'\|'dash'\|'colon'\|'slash'	`"colon"`	Separator
`showLabels`	boolean	`true`	Tampilkan Label
`labelPosition`	'above'\|'below'\|'left'\|'right'	`"below"`	Posisi Label (tampil saat `showLabels = true`)
`labelPlacement`	'outside'\|'inside'	`"outside"`	Hanya berlaku saat layout = Boxes. (tampil saat `layout = boxes`)
`boxBg`	CSS color	`"#f3f4f6"`	Warna Background Box (tampil saat `layout = boxes`)
`boxBorderColor`	CSS color	`"#e5e7eb"`	Warna Border Box (tampil saat `layout = boxes`)
`boxBorderRadius`	string	`"8px"`	Border Radius Box (tampil saat `layout = boxes`)

Contoh

{
  "id": "cou01abc",
  "type": "countdownTimer",
  "props": {
    "targetDate": "2026-06-23T02:59",
    "showDays": true,
    "showHours": true,
    "showMinutes": true,
    "showSeconds": true,
    "expiredText": "Penawaran telah berakhir",
    "layout": "boxes",
    "alignment": "center",
    "showLabels": true,
    "labelPosition": "below",
    "labelPlacement": "outside",
    "separator": "colon",
    "boxBg": "#f3f4f6",
    "boxBorderColor": "#e5e7eb",
    "boxBorderRadius": "8px"
  }
}