title: Home
views:
  - title: dev
    path: dev
    cards:
      - type: vertical-stack
        cards:
          - type: markdown
            content: '# 🕰 Time Picker Card dev'
          - type: entities
            entities:
              - input_datetime.test_date_time
          - type: horizontal-stack
            cards:
              - type: custom:time-picker-card
                entity: input_datetime.test_date_time
                name: With tap actions
                hour_mode: 24
                hour_step: 2
                tap_action:
                  action: call-service
                  service: logbook.log
                  service_data:
                    name: 'Time picker card · Tap Action'
                    message: 'Debug'
                double_tap_action:
                  action: call-service
                  service: logbook.log
                  service_data:
                    name: 'Time picker card · Double Tap Action'
                    message: 'Debug'
                hold_action:
                  action: call-service
                  service: logbook.log
                  service_data:
                    name: 'Time picker card · Hold action'
                    message: 'Debug'
              - type: custom:time-picker-card
                name: Hour mode 12, thin, single, hidden name
                entity: input_datetime.test_date_time
                hour_mode: 12
                layout:
                  hour_mode: single
                  thin: true
                hide:
                  name: true
          - type: custom:time-picker-card
            name: delayed
            entity: input_datetime.test_date_time
            delay: 1000
            hour_mode: 12
            layout:
              hour_mode: single
              thin: true

          - type: custom:time-picker-card
            entity: input_datetime.test_date_time
            name: Thin
            layout:
              thin: true
          - type: custom:time-picker-card
            entity: input_datetime.test_date_time
            name: Shown seconds
            hide:
              seconds: false

          - type: horizontal-stack
            cards:
              - type: custom:time-picker-card
                entity: input_datetime.test_date_time
                name: Hidden name
                hour_mode: 12
                hide:
                  name: true
              - type: custom:time-picker-card
                entity: input_datetime.test_date_time
                name: Linked, single hour mode, hidden name
                link_values: true
                hour_mode: 12
                hour_step: 2
                minute_step: 3
                layout:
                  hour_mode: single
                hide:
                  name: false

          - type: custom:time-picker-card
            entity: input_datetime.test_date
            name: Error

  - title: name inside
    path: name-inside
    cards:
      - type: custom:time-picker-card
        entity: input_datetime.test_date_time
        name: Inside, controls right
        hour_mode: 12
        layout:
          name: inside
          align_controls: right
      - type: horizontal-stack
        cards:
          - type: custom:time-picker-card
            entity: input_datetime.test_date_time
            name: Inside, hidden name
            layout:
              name: inside
            hide:
              name: true
          - type: custom:time-picker-card
            entity: input_datetime.test_date_time
            name: Inside, hidden icon
            layout:
              name: inside
            hide:
              icon: true

  - title: embedded
    path: embedded
    cards:
      - type: vertical-stack
        cards:
          - type: entities
            entities:
              - input_datetime.test_date_time
              - type: custom:time-picker-card
                entity: input_datetime.test_date_time
                name: Embedded thin
                hour_mode: 24
                hour_step: 2
                layout:
                  embedded: true
                  thin: true

              - type: custom:time-picker-card
                entity: input_datetime.test_date_time
                name: Inside
                hour_mode: 24
                hour_step: 2
                layout:
                  name: inside

              - type: custom:time-picker-card
                entity: input_datetime.test_date_time
                hour_mode: 12
                layout:
                  hour_mode: single
                hide:
                  name: true
              - type: custom:time-picker-card
                entity: input_datetime.test_date_time
                hour_mode: 12
                layout:
                  hour_mode: single