QuietHoursPicker

Usage

Components are auto-discovered. Use the component directly in any .wrn view:

<QuietHoursPicker
  label="Quiet hours"
  startName="quietStart"
  endName="quietEnd"
  start="22:00"
  end="08:00"
/>

Legacy mount name: data-component="QuietHoursPicker".

Props and attributes

Slots

This component does not declare a slot.

Events

This component does not declare a custom event.

Source contract

Installed source: components/QuietHoursPicker.wrn

component QuietHoursPicker {
  props {
    label = "Quiet hours"
    startName = "quietStart"
    endName = "quietEnd"
    start = "22:00"
    end = "08:00"
    timezone = "UTC"
    disabled = false
    class = ""
  }
  view {
        <fieldset class="wire-fieldset {class}" disabled="{disabled}">
        <legend class="wire-label">{label}</legend>
        <div class="wire-form-row">
        <label class="wire-field">
        <span class="wire-label">From</span>
        <input type="time" name="{startName}" value="{start}" class="wire-input" />
        </label>
        <label class="wire-field">
        <span class="wire-label">Until</span>
        <input type="time" name="{endName}" value="{end}" class="wire-input" />
        </label>
        </div>
        <p class="wire-field-message wire-field-message--help">Timezone: {timezone}</p>
        </fieldset>
    }
}