@rotki/ui-library 3.0.0-beta.3 → 3.0.0-beta.5

package/dist/components/date-time-picker/RuiDateTimePicker.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiDateTimePicker.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots"],"sources":["../../../src/components/date-time-picker/RuiDateTimePicker.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ComponentPublicInstance } from 'vue';\nimport type { DateTimePickerAction, DateTimeSegmentType } from '@/components/date-time-picker/types';\nimport type { TimePickerSelection } from '@/components/time-picker/RuiTimePicker.vue';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport { dateTimePickerStyles } from '@/components/date-time-picker/date-time-picker-styles';\nimport RuiDateTimePickerMenu from '@/components/date-time-picker/RuiDateTimePickerMenu.vue';\nimport { useDateTimeSelection } from '@/components/date-time-picker/use-date-time-selection';\nimport { useInputHandler } from '@/components/date-time-picker/use-input-handler';\nimport { useKeyboardHandler } from '@/components/date-time-picker/use-keyboard-handler';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport { activatorHandlers } from '@/components/overlays/menu/activator-handlers';\nimport RuiMenu from '@/components/overlays/menu/RuiMenu.vue';\nimport { type LabelPlacement, useLabelPlacement } from '@/composables/defaults/field';\nimport { type FloatingOptions, Placement } from '@/composables/floating';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\ntype DateFormat = 'year-first' | 'month-first' | 'day-first';\n\ntype DateTimeModelType = 'date' | 'epoch-ms' | 'epoch';\n\ntype ModelValueType<T extends DateTimeModelType> = T extends 'date'\n  ? Date | undefined\n  : T extends 'epoch-ms'\n    ? number | undefined\n    : T extends 'epoch'\n      ? number | undefined\n      : Date | number | undefined;\n\nexport interface RuiDateTimePickerProps {\n  minDate?: Date | number;\n  maxDate?: Date | number | 'now';\n  format?: DateFormat;\n  type?: DateTimeModelType;\n  accuracy?: 'minute' | 'second' | 'millisecond';\n  disabled?: boolean;\n  allowEmpty?: boolean;\n  readonly?: boolean;\n  dense?: boolean;\n  label?: string;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  required?: boolean;\n  /**\n   * Renders the timezone selector in the menu. Off by default: the value is\n   * emitted as a date or an epoch, so the picked timezone does not survive a\n   * round trip and most consumers work in local time.\n   */\n  showTimezone?: boolean;\n  /**\n   * Actions rendered in the menu footer. `clear` is only rendered when the\n   * picker is `allowEmpty`. Pass an empty array to drop the footer entirely.\n   */\n  actions?: DateTimePickerAction[];\n  /**\n   * Focuses the field once it is mounted. The native attribute is ignored for\n   * an input inserted into an already loaded document, which is the usual case\n   * for a picker revealed by an editor or a dialog.\n   */\n  autofocus?: boolean;\n  /**\n   * Accepts an entry that stops short of the full format, filling the segments\n   * it never reached from one end of the day: `start` gives a bare date\n   * 00:00:00.000 and `end` gives it 23:59:59.999. Meant for a range, where the\n   * two bounds want opposite ends. Left unset, an entry missing its time is not\n   * a value and nothing is emitted.\n   *\n   * The fill runs when the user is done with the field - leaving it, pressing\n   * enter, or closing the calendar - and is written back into the segments, so\n   * what it decided on is on screen.\n   *\n   * Spelled out rather than written as `PartialTimeMode`: a consumer that hands\n   * this whole interface to its own `defineProps` needs every member resolvable\n   * by the SFC compiler, which does not follow the type into the package.\n   */\n  partialTime?: 'start' | 'end';\n}\n\ndefineOptions({\n  name: 'RuiDateTimePicker',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<ModelValueType<DateTimeModelType>>({ required: true });\nconst menuOpen = defineModel<boolean>('menuOpen', { default: false });\n\nconst {\n  disabled = false,\n  readonly = false,\n  allowEmpty = false,\n  dense = false,\n  type = 'epoch-ms',\n  hideDetails = false,\n  label,\n  labelPlacement = undefined,\n  hint,\n  maxDate,\n  minDate,\n  format = 'day-first',\n  accuracy = 'minute',\n  errorMessages = [],\n  successMessages = [],\n  required = false,\n  showTimezone = false,\n  actions = ['now'],\n  autofocus = false,\n  partialTime,\n} = defineProps<RuiDateTimePickerProps>();\n\ndefineSlots<{\n  'menu-content': () => any;\n}>();\n\nconst MENU_OPTIONS: FloatingOptions = { placement: Placement.bottomStart };\n\nconst baseFormats: Record<DateFormat, string> = {\n  'day-first': 'DD/MM/YYYY HH:mm',\n  'month-first': 'MM/DD/YYYY HH:mm',\n  'year-first': 'YYYY/MM/DD HH:mm',\n};\n\nconst isOpen = ref<boolean>(false);\nconst isHovered = ref<boolean>(false);\nconst cursorPosition = ref<number>(0);\nconst currentValue = ref<number>();\n\nconst { t } = useRuiI8n();\n\nconst keys = RUI_I18N_KEYS.dateTimePicker;\n\nconst fieldLabel = computed<string>(() => label ?? t(keys.label, 'Pick a date'));\nconst inputId = useId();\nconst placement = useLabelPlacement(() => labelPlacement);\nconst clearLabel = computed<string>(() => t(keys.clearValue, 'Clear the date'));\nconst toggleLabel = computed<string>(() => (get(isOpen)\n  ? t(keys.closeCalendar, 'Close the calendar')\n  : t(keys.openCalendar, 'Open the calendar')));\n\nconst textInput = useTemplateRef<HTMLInputElement>('textInput');\nconst activator = useTemplateRef<HTMLDivElement>('activator');\nconst menuWrapperRef = useTemplateRef<ComponentPublicInstance>('menuWrapperRef');\nconst calendarMenuOpen = ref<boolean>(false);\n\nconst { focused: activatorFocusedWithin } = useFocusWithin(activator);\nconst { focused: menuWrapperFocusedWithin } = useFocusWithin(menuWrapperRef);\nconst { focused: searchInputFocused } = useFocus(textInput);\n\nconst anyFocused = computed<boolean>(() => get(activatorFocusedWithin) || get(menuWrapperFocusedWithin));\n\nconst dateFormat = computed<string>(() => {\n  const fmt = baseFormats[format];\n  if (accuracy === 'second') {\n    return fmt.replace('HH:mm', 'HH:mm:ss');\n  }\n  else if (accuracy === 'millisecond') {\n    return fmt.replace('HH:mm', 'HH:mm:ss.SSS');\n  }\n  return fmt;\n});\n\nconst {\n  clear: clearSelection,\n  commitPartialTime,\n  getDateTime,\n  internalErrorMessages,\n  maxAllowedDate,\n  minAllowedDate,\n  segmentData,\n  selectedDate,\n  modelDay,\n  modelHour,\n  modelMillisecond,\n  modelMinute,\n  modelMonth,\n  modelSecond,\n  selectedTime,\n  modelTimezone,\n  modelYear,\n  setNow,\n  setToday,\n  valueSet,\n} = useDateTimeSelection({\n  accuracy,\n  allowEmpty,\n  dateFormat,\n  maxDate,\n  minDate,\n  modelValue,\n  partialTime,\n  type,\n});\n\nconst { setValue, getCurrent } = useInputHandler(segmentData, currentValue);\n\nconst {\n  clear: clearSegment,\n  getCurrentSegment,\n  handleBlur,\n  handleClick,\n  handleFocus,\n  handleInput,\n  handleInputSelection,\n  handleKeyDown,\n  handleMouseDown,\n  handlePaste,\n  pasteRejected,\n  selectFirstSegment,\n  setSegment,\n} = useKeyboardHandler({\n  accuracy,\n  currentValue,\n  cursorPosition,\n  dateFormat,\n  disabled,\n  getCurrent,\n  getDateTime,\n  readonly,\n  setValue,\n  textInput,\n  timezone: modelTimezone,\n});\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\n/** True once any segment holds a digit, even a partially typed date. */\nconst anySegmentSet = computed<boolean>(() => [\n  modelYear,\n  modelMonth,\n  modelDay,\n  modelHour,\n  modelMinute,\n  modelSecond,\n  modelMillisecond,\n].some(segment => isDefined(segment)));\n\n/**\n * The field's text.\n *\n * An untouched field shows its format through the placeholder rather than\n * holding the tokens as its value, where a screen reader reads them as content\n * and select-all copies them. The tokens stay while the field is focused: that\n * is when the segment machinery highlights them, and collapsing the value\n * mid-edit would blank the field under the cursor. The guard is \"no segment\n * set\" rather than `valueSet`, so blurring a half-typed date keeps what was\n * entered on screen.\n */\nconst formattedDisplay = computed<string>(() => {\n  if (!get(anySegmentSet) && !get(searchInputFocused)) {\n    return '';\n  }\n\n  let result = get(dateFormat);\n\n  const replacements = [\n    { pattern: 'YYYY', value: getDisplayValue(modelYear, 4) },\n    { pattern: 'MM', value: getDisplayValue(modelMonth, 2) },\n    { pattern: 'DD', value: getDisplayValue(modelDay, 2) },\n    { pattern: 'HH', value: getDisplayValue(modelHour, 2) },\n    { pattern: 'mm', value: getDisplayValue(modelMinute, 2) },\n    { pattern: 'ss', value: getDisplayValue(modelSecond, 2) },\n    { pattern: 'SSS', value: getDisplayValue(modelMillisecond, 3) },\n  ];\n\n  for (const { pattern, value } of replacements) {\n    if (value !== undefined) {\n      result = result.replace(pattern, value);\n    }\n  }\n\n  return result;\n});\n\n/**\n * An untouched field holds no value until focus expands the format tokens into\n * it. That patch overwrites the input's value, and writing a value drops any\n * selection with it, so the highlight `handleFocus` just set is gone by the\n * time the tokens are on screen and the caret ends up after them. Re-select\n * the first segment once the tokens have actually landed.\n */\nwatch(formattedDisplay, (value, previous) => {\n  if (previous === '' && value !== '' && get(searchInputFocused))\n    selectFirstSegment();\n}, { flush: 'post' });\n\nconst timeSelection = computed<TimePickerSelection>({\n  get() {\n    const type = getCurrentSegment()?.type;\n\n    if (type === 'mm') {\n      return 'minute';\n    }\n    else if (type === 'ss') {\n      return 'second';\n    }\n    else if (type === 'SSS') {\n      return 'millisecond';\n    }\n    return 'hour';\n  },\n  set(value: TimePickerSelection) {\n    let segmentType: DateTimeSegmentType = 'HH';\n    if (value === 'minute') {\n      segmentType = 'mm';\n    }\n    else if (value === 'second') {\n      segmentType = 'ss';\n    }\n    else if (value === 'millisecond') {\n      segmentType = 'SSS';\n    }\n\n    setSegment(segmentType);\n  },\n});\n\nconst ui = computed<ReturnType<typeof dateTimePickerStyles>>(() => dateTimePickerStyles({\n  opened: get(isOpen),\n  hovered: get(isHovered),\n  dense,\n  disabled,\n  readonly,\n  hasError: get(hasError),\n  hasSuccess: get(hasSuccess) && !get(hasError),\n}));\n\nconst pasteMessage = computed<string>(() => (get(pasteRejected)\n  ? t(keys.pasteUnreadable, 'Could not read a date from the pasted text')\n  : ''));\n\n/**\n * The paste message goes first: the details show one message, and it answers\n * what the user just did, which a standing validation error does not.\n */\nconst combinedErrorMessages = computed<string[]>(() => {\n  const paste = get(pasteMessage) ? [get(pasteMessage)] : [];\n  if (!errorMessages)\n    return [...paste, ...get(internalErrorMessages)];\n\n  const propErrors = Array.isArray(errorMessages) ? errorMessages : [errorMessages];\n  return [...paste, ...propErrors, ...get(internalErrorMessages)];\n});\n\nfunction getDisplayValue(digit: Ref<number | undefined>, padding: number): string | undefined {\n  return isDefined(digit) ? get(digit).toString().padStart(padding, '0') : undefined;\n}\n\nasync function setInputFocus(): Promise<void> {\n  await nextTick(() => {\n    set(searchInputFocused, true);\n  });\n}\n\nfunction clear(segmentType?: string): void {\n  if (!segmentType) {\n    clearSelection();\n    set(currentValue, undefined);\n    return;\n  }\n\n  clearSegment(segmentType);\n}\n\n/**\n * An entry left incomplete is completed once the user is done with the field,\n * never while they are still filling it in: a half typed hour is not a segment\n * they left out. Leaving the field counts, unless the calendar is open, since\n * then the focus is only moving into it and the menu closing covers that.\n */\nfunction onBlur(): void {\n  handleBlur();\n  if (!get(isOpen))\n    commitPartialTime();\n}\n\nwatch(isOpen, (open) => {\n  if (!open && !get(searchInputFocused))\n    commitPartialTime();\n});\n\n/**\n * Selects the clicked segment before opening the menu, so the selection is not\n * lost to the DOM changes that opening brings.\n */\nfunction handleInputClick(event: MouseEvent): void {\n  handleClick(event);\n  if (!get(isOpen)) {\n    set(isOpen, true);\n  }\n}\n\n/**\n * The menu is teleported to the body, so it never sits next to the field in\n * the tab sequence. Opening it from the keyboard therefore moves focus into\n * the calendar; opening it with the mouse leaves focus in the field, which is\n * what `disable-auto-focus` on the menu is there for.\n */\nconst focusCalendarOnOpen = ref<boolean>(false);\n\n/**\n * Asks for focus to move into the calendar. The menu is teleported and mounts\n * a frame later, so the watcher below waits for the wrapper to appear rather\n * than guessing at a number of ticks.\n */\nfunction focusCalendar(): void {\n  set(focusCalendarOnOpen, true);\n}\n\nwatch(menuWrapperRef, (menu) => {\n  if (!menu || !get(focusCalendarOnOpen))\n    return;\n\n  set(focusCalendarOnOpen, false);\n  nextTick(() => {\n    const el = menu.$el as HTMLElement | undefined;\n    el?.querySelector<HTMLButtonElement>('[role=\"gridcell\"][tabindex=\"0\"]')?.focus({ preventScroll: true });\n  });\n});\n\n/** Moves focus to the field. Exposed so a consumer can drive it from a ref. */\nfunction focus(): void {\n  get(textInput)?.focus({ preventScroll: true });\n}\n\nfunction focusField(): void {\n  nextTick(focus);\n}\n\nonMounted(() => {\n  if (autofocus && !disabled)\n    focusField();\n});\n\n/** Escape inside the calendar closes it and hands focus back to the field. */\nfunction closeFromMenu(): void {\n  set(isOpen, false);\n  focusField();\n}\n\n/**\n * The menu used to be mouse-only: the activator carried no key handlers, so\n * there was no way to reach the calendar from the keyboard. Alt+ArrowDown\n * opens it and Escape closes it, following the combobox convention, and the\n * append chevron is a real button for anyone who tabs to it instead.\n *\n * Enter and Escape are the other ways to be done with the field, and the keys\n * a consumer tends to close its editor on. Escape reaches that point only once\n * the calendar is already shut, and discards nothing, since the segments stay\n * on screen either way, so it commits what was entered rather than dropping it\n * when the field goes. Both write the value before the key carries on\n * bubbling, so it survives that close.\n */\nfunction onKeyDown(event: KeyboardEvent): void {\n  if (disabled || readonly)\n    return;\n\n  if (event.altKey && event.key === 'ArrowDown') {\n    event.preventDefault();\n    set(isOpen, true);\n    focusCalendar();\n    return;\n  }\n\n  if (event.key === 'Escape' && get(isOpen)) {\n    set(isOpen, false);\n    return;\n  }\n\n  if (event.key === 'Enter' || event.key === 'Escape')\n    commitPartialTime();\n\n  handleKeyDown(event);\n}\n\nfunction arrowClicked(event: MouseEvent): void {\n  if (get(isOpen)) {\n    set(isOpen, false);\n    event.stopPropagation();\n  }\n}\n\nconst menuActions = computed<DateTimePickerAction[]>(\n  () => actions.filter(action => action !== 'clear' || allowEmpty),\n);\n\nconst anyMenuOpen = computed<boolean>(() => get(isOpen) || get(calendarMenuOpen));\n\nwatch(anyMenuOpen, (value) => {\n  set(menuOpen, value);\n});\n\ndefineExpose({\n  focus,\n});\n</script>\n\n<template>\n  <RuiMenu\n    v-model=\"isOpen\"\n    v-bind=\"getRootAttrs($attrs, [])\"\n    :class=\"ui.wrapper({ class: cn($attrs.class) })\"\n    :class-names=\"{ details: 'px-0', content: 'p-0' }\"\n    :options=\"MENU_OPTIONS\"\n    :dense=\"dense\"\n    :hint=\"hint\"\n    :disabled=\"disabled\"\n    :success-messages=\"successMessages\"\n    :error-messages=\"combinedErrorMessages\"\n    :close-on-content-click=\"false\"\n    :show-details=\"!hideDetails\"\n    :persistent=\"calendarMenuOpen\"\n    :menu-label=\"fieldLabel\"\n    role=\"dialog\"\n    full-width\n    disable-auto-focus\n  >\n    <template #label>\n      <RuiFieldLabel\n        :for=\"inputId\"\n        :text=\"fieldLabel\"\n        :hidden=\"placement === 'hidden'\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </template>\n    <template #activator=\"{ attrs }\">\n      <div\n        ref=\"activator\"\n        :class=\"ui.activator()\"\n        v-bind=\"{\n          ...getNonRootAttrs($attrs, ['onClick', 'class']),\n          ...(readonly ? {} : activatorHandlers(attrs)),\n        }\"\n        data-id=\"activator\"\n        :aria-invalid=\"hasError\"\n        @mouseenter=\"isHovered = true\"\n        @mouseleave=\"isHovered = false\"\n        @click=\"setInputFocus()\"\n      >\n        <span :class=\"ui.iconPrepend()\">\n          <RuiIcon\n            class=\"text-rui-neutral-500 dark:text-rui-neutral-400 transition\"\n            :size=\"dense ? 16 : 20\"\n            name=\"lu-calendar-days\"\n          />\n        </span>\n\n        <div :class=\"ui.value()\">\n          <input\n            :id=\"inputId\"\n            ref=\"textInput\"\n            :disabled=\"disabled\"\n            :value=\"formattedDisplay\"\n            class=\"bg-transparent outline-hidden flex-1 min-w-0\"\n            type=\"text\"\n            inputmode=\"numeric\"\n            spellcheck=\"false\"\n            autocomplete=\"off\"\n            autocorrect=\"off\"\n            autocapitalize=\"off\"\n            :placeholder=\"dateFormat\"\n            :readonly=\"readonly\"\n            :aria-invalid=\"hasError\"\n            :aria-required=\"required || undefined\"\n            @mousedown=\"handleMouseDown($event)\"\n            @focus=\"handleFocus()\"\n            @blur=\"onBlur()\"\n            @select=\"handleInputSelection($event)\"\n            @click.stop=\"handleInputClick($event)\"\n            @keydown=\"onKeyDown($event)\"\n            @paste=\"handlePaste($event)\"\n            @input=\"handleInput($event)\"\n          />\n          <!-- The details line is not a live region, so a rejected paste is announced from here -->\n          <span\n            class=\"sr-only\"\n            aria-live=\"polite\"\n            data-id=\"paste-status\"\n          >\n            {{ pasteMessage }}\n          </span>\n        </div>\n\n        <RuiButton\n          v-if=\"allowEmpty && valueSet && !disabled && !readonly\"\n          variant=\"text\"\n          icon\n          data-id=\"clear-button\"\n          size=\"sm\"\n          :aria-label=\"clearLabel\"\n          :class=\"[\n            ui.clear(),\n            anyFocused && 'visible!',\n            { 'mr-2': !dense },\n          ]\"\n          @click.stop.prevent=\"clear()\"\n        >\n          <RuiIcon\n            name=\"lu-x\"\n            size=\"16\"\n          />\n        </RuiButton>\n\n        <!-- Out of the tab sequence, following the combobox pattern: the button only duplicates\n             Alt+ArrowDown on the field, so leaving it in cost two stops to cross one date field\n             and four to cross a from/to pair, for nothing a keyboard user could not already do.\n             It stays a real button, so it keeps its label and its expanded state for anyone\n             reaching it by any other means. -->\n        <button\n          v-if=\"!disabled && !readonly\"\n          type=\"button\"\n          tabindex=\"-1\"\n          :class=\"ui.iconWrapper()\"\n          data-id=\"append\"\n          :aria-label=\"toggleLabel\"\n          :aria-expanded=\"isOpen\"\n          aria-haspopup=\"dialog\"\n          @click=\"arrowClicked($event)\"\n        >\n          <RuiIcon\n            :class=\"ui.icon()\"\n            :size=\"dense ? 16 : 20\"\n            name=\"lu-chevron-down\"\n          />\n        </button>\n        <span\n          v-else\n          :class=\"ui.iconWrapper()\"\n          data-id=\"append\"\n        >\n          <RuiIcon\n            :class=\"ui.icon()\"\n            :size=\"dense ? 16 : 20\"\n            name=\"lu-chevron-down\"\n          />\n        </span>\n      </div>\n      <fieldset :class=\"ui.fieldset()\" />\n    </template>\n    <template #default>\n      <RuiDateTimePickerMenu\n        ref=\"menuWrapperRef\"\n        v-model:selected-date=\"selectedDate\"\n        v-model:selected-time=\"selectedTime\"\n        v-model:selected-hour=\"modelHour\"\n        v-model:selected-minute=\"modelMinute\"\n        v-model:selected-second=\"modelSecond\"\n        v-model:selected-millisecond=\"modelMillisecond\"\n        v-model:time-selection=\"timeSelection\"\n        v-model:selected-timezone=\"modelTimezone\"\n        v-model:calendar-menu-open=\"calendarMenuOpen\"\n        :accuracy=\"accuracy\"\n        :max-date=\"maxAllowedDate\"\n        :min-date=\"minAllowedDate\"\n        :show-timezone=\"showTimezone\"\n        :actions=\"menuActions\"\n        @keydown.escape=\"closeFromMenu()\"\n        @set-now=\"setNow()\"\n        @set-today=\"setToday()\"\n        @clear=\"clear()\"\n      >\n        <!-- only when given, or the panel draws an empty third column with its divider -->\n        <template\n          v-if=\"$slots['menu-content']\"\n          #default\n        >\n          <slot name=\"menu-content\" />\n        </template>\n      </RuiDateTimePickerMenu>\n    </template>\n  </RuiMenu>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"RuiDateTimePicker.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots","_useModel","_openBlock","_createBlock","RuiMenu","_mergeProps","_unref","_isRef","_withCtx","_createVNode","RuiFieldLabel","_createElementVNode","_normalizeClass","RuiIcon","_withModifiers","_toDisplayString","RuiButton","_createCommentVNode","_createElementBlock","RuiDateTimePickerMenu","_withKeys","_createSlots","_renderSlot"],"sources":["../../../src/components/date-time-picker/RuiDateTimePicker.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ComponentPublicInstance } from 'vue';\nimport type { DateTimePickerAction, DateTimeSegmentType } from '@/components/date-time-picker/types';\nimport type { TimePickerSelection } from '@/components/time-picker/RuiTimePicker.vue';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport { dateTimePickerStyles } from '@/components/date-time-picker/date-time-picker-styles';\nimport RuiDateTimePickerMenu from '@/components/date-time-picker/RuiDateTimePickerMenu.vue';\nimport { useDateTimeSelection } from '@/components/date-time-picker/use-date-time-selection';\nimport { useInputHandler } from '@/components/date-time-picker/use-input-handler';\nimport { useKeyboardHandler } from '@/components/date-time-picker/use-keyboard-handler';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport { activatorHandlers } from '@/components/overlays/menu/activator-handlers';\nimport RuiMenu from '@/components/overlays/menu/RuiMenu.vue';\nimport { type LabelPlacement, useLabelPlacement } from '@/composables/defaults/field';\nimport { type FloatingOptions, Placement } from '@/composables/floating';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\ntype DateFormat = 'year-first' | 'month-first' | 'day-first';\n\ntype DateTimeModelType = 'date' | 'epoch-ms' | 'epoch';\n\ntype ModelValueType<T extends DateTimeModelType> = T extends 'date'\n  ? Date | undefined\n  : T extends 'epoch-ms'\n    ? number | undefined\n    : T extends 'epoch'\n      ? number | undefined\n      : Date | number | undefined;\n\nexport interface RuiDateTimePickerProps {\n  minDate?: Date | number;\n  maxDate?: Date | number | 'now';\n  format?: DateFormat;\n  type?: DateTimeModelType;\n  accuracy?: 'minute' | 'second' | 'millisecond';\n  disabled?: boolean;\n  allowEmpty?: boolean;\n  readonly?: boolean;\n  dense?: boolean;\n  label?: string;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  required?: boolean;\n  /**\n   * Renders the timezone selector in the menu. Off by default: the value is\n   * emitted as a date or an epoch, so the picked timezone does not survive a\n   * round trip and most consumers work in local time.\n   */\n  showTimezone?: boolean;\n  /**\n   * Actions rendered in the menu footer. `clear` is only rendered when the\n   * picker is `allowEmpty`. Pass an empty array to drop the footer entirely.\n   */\n  actions?: DateTimePickerAction[];\n  /**\n   * Focuses the field once it is mounted. The native attribute is ignored for\n   * an input inserted into an already loaded document, which is the usual case\n   * for a picker revealed by an editor or a dialog.\n   */\n  autofocus?: boolean;\n  /**\n   * Accepts an entry that stops short of the full format, filling the segments\n   * it never reached from one end of the day: `start` gives a bare date\n   * 00:00:00.000 and `end` gives it 23:59:59.999. Meant for a range, where the\n   * two bounds want opposite ends. Left unset, an entry missing its time is not\n   * a value and nothing is emitted.\n   *\n   * The fill runs when the user is done with the field - leaving it, pressing\n   * enter, or closing the calendar - and is written back into the segments, so\n   * what it decided on is on screen.\n   *\n   * Spelled out rather than written as `PartialTimeMode`: a consumer that hands\n   * this whole interface to its own `defineProps` needs every member resolvable\n   * by the SFC compiler, which does not follow the type into the package.\n   */\n  partialTime?: 'start' | 'end';\n}\n\ndefineOptions({\n  name: 'RuiDateTimePicker',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<ModelValueType<DateTimeModelType>>({ required: true });\nconst menuOpen = defineModel<boolean>('menuOpen', { default: false });\n\nconst {\n  disabled = false,\n  readonly = false,\n  allowEmpty = false,\n  dense = false,\n  type = 'epoch-ms',\n  hideDetails = false,\n  label,\n  labelPlacement = undefined,\n  hint,\n  maxDate,\n  minDate,\n  format = 'day-first',\n  accuracy = 'minute',\n  errorMessages = [],\n  successMessages = [],\n  required = false,\n  showTimezone = false,\n  actions = ['now'],\n  autofocus = false,\n  partialTime,\n} = defineProps<RuiDateTimePickerProps>();\n\ndefineSlots<{\n  'menu-content': () => any;\n}>();\n\nconst MENU_OPTIONS: FloatingOptions = { placement: Placement.bottomStart };\n\nconst baseFormats: Record<DateFormat, string> = {\n  'day-first': 'DD/MM/YYYY HH:mm',\n  'month-first': 'MM/DD/YYYY HH:mm',\n  'year-first': 'YYYY/MM/DD HH:mm',\n};\n\nconst isOpen = ref<boolean>(false);\nconst isHovered = ref<boolean>(false);\nconst cursorPosition = ref<number>(0);\nconst currentValue = ref<number>();\n\nconst { t } = useRuiI8n();\n\nconst keys = RUI_I18N_KEYS.dateTimePicker;\n\nconst fieldLabel = computed<string>(() => label ?? t(keys.label, 'Pick a date'));\nconst inputId = useId();\nconst placement = useLabelPlacement(() => labelPlacement);\nconst clearLabel = computed<string>(() => t(keys.clearValue, 'Clear the date'));\nconst toggleLabel = computed<string>(() => (get(isOpen)\n  ? t(keys.closeCalendar, 'Close the calendar')\n  : t(keys.openCalendar, 'Open the calendar')));\n\nconst textInput = useTemplateRef<HTMLInputElement>('textInput');\nconst activator = useTemplateRef<HTMLDivElement>('activator');\nconst menuWrapperRef = useTemplateRef<ComponentPublicInstance>('menuWrapperRef');\nconst calendarMenuOpen = ref<boolean>(false);\n\nconst { focused: activatorFocusedWithin } = useFocusWithin(activator);\nconst { focused: menuWrapperFocusedWithin } = useFocusWithin(menuWrapperRef);\nconst { focused: searchInputFocused } = useFocus(textInput);\n\nconst anyFocused = computed<boolean>(() => get(activatorFocusedWithin) || get(menuWrapperFocusedWithin));\n\nconst dateFormat = computed<string>(() => {\n  const fmt = baseFormats[format];\n  if (accuracy === 'second') {\n    return fmt.replace('HH:mm', 'HH:mm:ss');\n  }\n  else if (accuracy === 'millisecond') {\n    return fmt.replace('HH:mm', 'HH:mm:ss.SSS');\n  }\n  return fmt;\n});\n\nconst {\n  clear: clearSelection,\n  commitPartialTime,\n  getDateTime,\n  internalErrorMessages,\n  maxAllowedDate,\n  minAllowedDate,\n  segmentData,\n  selectedDate,\n  modelDay,\n  modelHour,\n  modelMillisecond,\n  modelMinute,\n  modelMonth,\n  modelSecond,\n  selectedTime,\n  modelTimezone,\n  modelYear,\n  setNow,\n  setToday,\n  valueSet,\n} = useDateTimeSelection({\n  accuracy,\n  allowEmpty,\n  dateFormat,\n  maxDate,\n  minDate,\n  modelValue,\n  partialTime,\n  type,\n});\n\nconst { setValue, getCurrent } = useInputHandler(segmentData, currentValue);\n\nconst {\n  clear: clearSegment,\n  getCurrentSegment,\n  handleBlur,\n  handleClick,\n  handleFocus,\n  handleInput,\n  handleInputSelection,\n  handleKeyDown,\n  handleMouseDown,\n  handlePaste,\n  pasteRejected,\n  selectFirstSegment,\n  setSegment,\n} = useKeyboardHandler({\n  accuracy,\n  currentValue,\n  cursorPosition,\n  dateFormat,\n  disabled,\n  getCurrent,\n  getDateTime,\n  readonly,\n  setValue,\n  textInput,\n  timezone: modelTimezone,\n});\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\n/** True once any segment holds a digit, even a partially typed date. */\nconst anySegmentSet = computed<boolean>(() => [\n  modelYear,\n  modelMonth,\n  modelDay,\n  modelHour,\n  modelMinute,\n  modelSecond,\n  modelMillisecond,\n].some(segment => isDefined(segment)));\n\n/**\n * The field's text.\n *\n * An untouched field shows its format through the placeholder rather than\n * holding the tokens as its value, where a screen reader reads them as content\n * and select-all copies them. The tokens stay while the field is focused: that\n * is when the segment machinery highlights them, and collapsing the value\n * mid-edit would blank the field under the cursor. The guard is \"no segment\n * set\" rather than `valueSet`, so blurring a half-typed date keeps what was\n * entered on screen.\n */\nconst formattedDisplay = computed<string>(() => {\n  if (!get(anySegmentSet) && !get(searchInputFocused)) {\n    return '';\n  }\n\n  let result = get(dateFormat);\n\n  const replacements = [\n    { pattern: 'YYYY', value: getDisplayValue(modelYear, 4) },\n    { pattern: 'MM', value: getDisplayValue(modelMonth, 2) },\n    { pattern: 'DD', value: getDisplayValue(modelDay, 2) },\n    { pattern: 'HH', value: getDisplayValue(modelHour, 2) },\n    { pattern: 'mm', value: getDisplayValue(modelMinute, 2) },\n    { pattern: 'ss', value: getDisplayValue(modelSecond, 2) },\n    { pattern: 'SSS', value: getDisplayValue(modelMillisecond, 3) },\n  ];\n\n  for (const { pattern, value } of replacements) {\n    if (value !== undefined) {\n      result = result.replace(pattern, value);\n    }\n  }\n\n  return result;\n});\n\n/**\n * An untouched field holds no value until focus expands the format tokens into\n * it. That patch overwrites the input's value, and writing a value drops any\n * selection with it, so the highlight `handleFocus` just set is gone by the\n * time the tokens are on screen and the caret ends up after them. Re-select\n * the first segment once the tokens have actually landed.\n */\nwatch(formattedDisplay, (value, previous) => {\n  if (previous === '' && value !== '' && get(searchInputFocused))\n    selectFirstSegment();\n}, { flush: 'post' });\n\nconst timeSelection = computed<TimePickerSelection>({\n  get() {\n    const type = getCurrentSegment()?.type;\n\n    if (type === 'mm') {\n      return 'minute';\n    }\n    else if (type === 'ss') {\n      return 'second';\n    }\n    else if (type === 'SSS') {\n      return 'millisecond';\n    }\n    return 'hour';\n  },\n  set(value: TimePickerSelection) {\n    let segmentType: DateTimeSegmentType = 'HH';\n    if (value === 'minute') {\n      segmentType = 'mm';\n    }\n    else if (value === 'second') {\n      segmentType = 'ss';\n    }\n    else if (value === 'millisecond') {\n      segmentType = 'SSS';\n    }\n\n    setSegment(segmentType);\n  },\n});\n\nconst ui = computed<ReturnType<typeof dateTimePickerStyles>>(() => dateTimePickerStyles({\n  opened: get(isOpen),\n  hovered: get(isHovered),\n  dense,\n  disabled,\n  readonly,\n  hasError: get(hasError),\n  hasSuccess: get(hasSuccess) && !get(hasError),\n}));\n\nconst pasteMessage = computed<string>(() => (get(pasteRejected)\n  ? t(keys.pasteUnreadable, 'Could not read a date from the pasted text')\n  : ''));\n\n/**\n * The paste message goes first: the details show one message, and it answers\n * what the user just did, which a standing validation error does not.\n */\nconst combinedErrorMessages = computed<string[]>(() => {\n  const paste = get(pasteMessage) ? [get(pasteMessage)] : [];\n  if (!errorMessages)\n    return [...paste, ...get(internalErrorMessages)];\n\n  const propErrors = Array.isArray(errorMessages) ? errorMessages : [errorMessages];\n  return [...paste, ...propErrors, ...get(internalErrorMessages)];\n});\n\nfunction getDisplayValue(digit: Ref<number | undefined>, padding: number): string | undefined {\n  return isDefined(digit) ? get(digit).toString().padStart(padding, '0') : undefined;\n}\n\nasync function setInputFocus(): Promise<void> {\n  await nextTick(() => {\n    set(searchInputFocused, true);\n  });\n}\n\nfunction clear(segmentType?: string): void {\n  if (!segmentType) {\n    clearSelection();\n    set(currentValue, undefined);\n    return;\n  }\n\n  clearSegment(segmentType);\n}\n\n/**\n * An entry left incomplete is completed once the user is done with the field,\n * never while they are still filling it in: a half typed hour is not a segment\n * they left out. Leaving the field counts, unless the calendar is open, since\n * then the focus is only moving into it and the menu closing covers that.\n */\nfunction onBlur(): void {\n  handleBlur();\n  if (!get(isOpen))\n    commitPartialTime();\n}\n\nwatch(isOpen, (open) => {\n  if (!open && !get(searchInputFocused))\n    commitPartialTime();\n});\n\n/**\n * Selects the clicked segment before opening the menu, so the selection is not\n * lost to the DOM changes that opening brings.\n */\nfunction handleInputClick(event: MouseEvent): void {\n  handleClick(event);\n  if (!get(isOpen)) {\n    set(isOpen, true);\n  }\n}\n\n/**\n * The menu is teleported to the body, so it never sits next to the field in\n * the tab sequence. Opening it from the keyboard therefore moves focus into\n * the calendar; opening it with the mouse leaves focus in the field, which is\n * what `disable-auto-focus` on the menu is there for.\n */\nconst focusCalendarOnOpen = ref<boolean>(false);\n\n/**\n * Asks for focus to move into the calendar. The menu is teleported and mounts\n * a frame later, so the watcher below waits for the wrapper to appear rather\n * than guessing at a number of ticks.\n */\nfunction focusCalendar(): void {\n  set(focusCalendarOnOpen, true);\n}\n\nwatch(menuWrapperRef, (menu) => {\n  if (!menu || !get(focusCalendarOnOpen))\n    return;\n\n  set(focusCalendarOnOpen, false);\n  nextTick(() => {\n    const el = menu.$el as HTMLElement | undefined;\n    el?.querySelector<HTMLButtonElement>('[role=\"gridcell\"][tabindex=\"0\"]')?.focus({ preventScroll: true });\n  });\n});\n\n/** Moves focus to the field. Exposed so a consumer can drive it from a ref. */\nfunction focus(): void {\n  get(textInput)?.focus({ preventScroll: true });\n}\n\nfunction focusField(): void {\n  nextTick(focus);\n}\n\nonMounted(() => {\n  if (autofocus && !disabled)\n    focusField();\n});\n\n/** Escape inside the calendar closes it and hands focus back to the field. */\nfunction closeFromMenu(): void {\n  set(isOpen, false);\n  focusField();\n}\n\n/**\n * The menu used to be mouse-only: the activator carried no key handlers, so\n * there was no way to reach the calendar from the keyboard. Alt+ArrowDown\n * opens it and Escape closes it, following the combobox convention, and the\n * append chevron is a real button for anyone who tabs to it instead.\n *\n * Enter and Escape are the other ways to be done with the field, and the keys\n * a consumer tends to close its editor on. Escape reaches that point only once\n * the calendar is already shut, and discards nothing, since the segments stay\n * on screen either way, so it commits what was entered rather than dropping it\n * when the field goes. Both write the value before the key carries on\n * bubbling, so it survives that close.\n */\nfunction onKeyDown(event: KeyboardEvent): void {\n  if (disabled || readonly)\n    return;\n\n  if (event.altKey && event.key === 'ArrowDown') {\n    event.preventDefault();\n    set(isOpen, true);\n    focusCalendar();\n    return;\n  }\n\n  if (event.key === 'Escape' && get(isOpen)) {\n    set(isOpen, false);\n    return;\n  }\n\n  if (event.key === 'Enter' || event.key === 'Escape')\n    commitPartialTime();\n\n  handleKeyDown(event);\n}\n\nfunction arrowClicked(event: MouseEvent): void {\n  if (get(isOpen)) {\n    set(isOpen, false);\n    event.stopPropagation();\n  }\n}\n\nconst menuActions = computed<DateTimePickerAction[]>(\n  () => actions.filter(action => action !== 'clear' || allowEmpty),\n);\n\nconst anyMenuOpen = computed<boolean>(() => get(isOpen) || get(calendarMenuOpen));\n\nwatch(anyMenuOpen, (value) => {\n  set(menuOpen, value);\n});\n\ndefineExpose({\n  focus,\n});\n</script>\n\n<template>\n  <RuiMenu\n    v-model=\"isOpen\"\n    v-bind=\"getRootAttrs($attrs, [])\"\n    :class=\"ui.wrapper({ class: cn($attrs.class) })\"\n    :class-names=\"{ details: 'px-0', content: 'p-0' }\"\n    :options=\"MENU_OPTIONS\"\n    :dense=\"dense\"\n    :hint=\"hint\"\n    :disabled=\"disabled\"\n    :success-messages=\"successMessages\"\n    :error-messages=\"combinedErrorMessages\"\n    :close-on-content-click=\"false\"\n    :show-details=\"!hideDetails\"\n    :persistent=\"calendarMenuOpen\"\n    :menu-label=\"fieldLabel\"\n    role=\"dialog\"\n    full-width\n    disable-auto-focus\n  >\n    <template #label>\n      <RuiFieldLabel\n        :for=\"inputId\"\n        :text=\"fieldLabel\"\n        :hidden=\"placement === 'hidden'\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </template>\n    <template #activator=\"{ attrs }\">\n      <div\n        ref=\"activator\"\n        :class=\"ui.activator()\"\n        v-bind=\"{\n          ...getNonRootAttrs($attrs, ['onClick', 'class']),\n          ...(readonly ? {} : activatorHandlers(attrs)),\n        }\"\n        data-id=\"activator\"\n        :aria-invalid=\"hasError\"\n        @mouseenter=\"isHovered = true\"\n        @mouseleave=\"isHovered = false\"\n        @click=\"setInputFocus()\"\n      >\n        <span :class=\"ui.iconPrepend()\">\n          <RuiIcon\n            class=\"text-rui-neutral-500 dark:text-rui-neutral-400 transition\"\n            :size=\"dense ? 16 : 20\"\n            name=\"lu-calendar-days\"\n          />\n        </span>\n\n        <div :class=\"ui.value()\">\n          <input\n            :id=\"inputId\"\n            ref=\"textInput\"\n            :disabled=\"disabled\"\n            :value=\"formattedDisplay\"\n            class=\"bg-transparent outline-hidden flex-1 min-w-0\"\n            type=\"text\"\n            inputmode=\"numeric\"\n            spellcheck=\"false\"\n            autocomplete=\"off\"\n            autocorrect=\"off\"\n            autocapitalize=\"off\"\n            :placeholder=\"dateFormat\"\n            :readonly=\"readonly\"\n            :aria-invalid=\"hasError\"\n            :aria-required=\"required || undefined\"\n            @mousedown=\"handleMouseDown($event)\"\n            @focus=\"handleFocus()\"\n            @blur=\"onBlur()\"\n            @select=\"handleInputSelection($event)\"\n            @click.stop=\"handleInputClick($event)\"\n            @keydown=\"onKeyDown($event)\"\n            @paste=\"handlePaste($event)\"\n            @input=\"handleInput($event)\"\n          />\n          <!-- The details line is not a live region, so a rejected paste is announced from here -->\n          <span\n            class=\"sr-only\"\n            aria-live=\"polite\"\n            data-id=\"paste-status\"\n          >\n            {{ pasteMessage }}\n          </span>\n        </div>\n\n        <RuiButton\n          v-if=\"allowEmpty && valueSet && !disabled && !readonly\"\n          variant=\"text\"\n          icon\n          data-id=\"clear-button\"\n          size=\"sm\"\n          :aria-label=\"clearLabel\"\n          :class=\"[\n            ui.clear(),\n            anyFocused && 'visible!',\n            { 'mr-2': !dense },\n          ]\"\n          @click.stop.prevent=\"clear()\"\n        >\n          <RuiIcon\n            name=\"lu-x\"\n            size=\"16\"\n          />\n        </RuiButton>\n\n        <!-- Out of the tab sequence, following the combobox pattern: the button only duplicates\n             Alt+ArrowDown on the field, so leaving it in cost two stops to cross one date field\n             and four to cross a from/to pair, for nothing a keyboard user could not already do.\n             It stays a real button, so it keeps its label and its expanded state for anyone\n             reaching it by any other means. -->\n        <button\n          v-if=\"!disabled && !readonly\"\n          type=\"button\"\n          tabindex=\"-1\"\n          :class=\"ui.iconWrapper()\"\n          data-id=\"append\"\n          :aria-label=\"toggleLabel\"\n          :aria-expanded=\"isOpen\"\n          aria-haspopup=\"dialog\"\n          @click=\"arrowClicked($event)\"\n        >\n          <RuiIcon\n            :class=\"ui.icon()\"\n            :size=\"dense ? 16 : 20\"\n            name=\"lu-chevron-down\"\n          />\n        </button>\n        <span\n          v-else\n          :class=\"ui.iconWrapper()\"\n          data-id=\"append\"\n        >\n          <RuiIcon\n            :class=\"ui.icon()\"\n            :size=\"dense ? 16 : 20\"\n            name=\"lu-chevron-down\"\n          />\n        </span>\n      </div>\n      <fieldset :class=\"ui.fieldset()\" />\n    </template>\n    <template #default>\n      <RuiDateTimePickerMenu\n        ref=\"menuWrapperRef\"\n        v-model:selected-date=\"selectedDate\"\n        v-model:selected-time=\"selectedTime\"\n        v-model:selected-hour=\"modelHour\"\n        v-model:selected-minute=\"modelMinute\"\n        v-model:selected-second=\"modelSecond\"\n        v-model:selected-millisecond=\"modelMillisecond\"\n        v-model:time-selection=\"timeSelection\"\n        v-model:selected-timezone=\"modelTimezone\"\n        v-model:calendar-menu-open=\"calendarMenuOpen\"\n        :accuracy=\"accuracy\"\n        :max-date=\"maxAllowedDate\"\n        :min-date=\"minAllowedDate\"\n        :show-timezone=\"showTimezone\"\n        :actions=\"menuActions\"\n        @keydown.escape=\"closeFromMenu()\"\n        @set-now=\"setNow()\"\n        @set-today=\"setToday()\"\n        @clear=\"clear()\"\n      >\n        <!-- only when given, or the panel draws an empty third column with its divider -->\n        <template\n          v-if=\"$slots['menu-content']\"\n          #default\n        >\n          <slot name=\"menu-content\" />\n        </template>\n      </RuiDateTimePickerMenu>\n    </template>\n  </RuiMenu>\n</template>\n"],"mappings":"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"}

package/dist/components/date-time-picker/RuiDateTimePickerMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiDateTimePickerMenu.js","names":[],"sources":["../../../src/components/date-time-picker/RuiDateTimePickerMenu.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { DateTimePickerAction } from '@/components/date-time-picker/types';\nimport type { TimeAccuracy } from '@/consts/time-accuracy';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiCalendar from '@/components/calendar/RuiCalendar.vue';\nimport RuiTimezoneSelect from '@/components/date-time-picker/RuiTimezoneSelect.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiTimePicker, { type TimePickerSelection } from '@/components/time-picker/RuiTimePicker.vue';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\n\ndefineOptions({\n  name: 'RuiDateTimePickerMenu',\n});\n\nconst selectedDate = defineModel<Date | undefined>('selectedDate', { required: true });\nconst selectedTime = defineModel<Date | undefined>('selectedTime', { required: true });\nconst selectedHour = defineModel<number | undefined>('selectedHour', { required: true });\nconst selectedMinute = defineModel<number | undefined>('selectedMinute', { required: true });\nconst selectedSecond = defineModel<number | undefined>('selectedSecond', { required: true });\nconst selectedMillisecond = defineModel<number | undefined>('selectedMillisecond', { required: true });\nconst timeSelection = defineModel<TimePickerSelection>('timeSelection', { required: true });\nconst selectedTimezone = defineModel<string | undefined>('selectedTimezone', { required: true });\nconst calendarMenuOpen = defineModel<boolean>('calendarMenuOpen', { required: true });\n\nconst { actions = [] } = defineProps<{\n  accuracy: TimeAccuracy;\n  actions?: DateTimePickerAction[];\n  maxDate?: Date | number;\n  minDate?: Date | number;\n  showTimezone?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  'set-now': [];\n  'set-today': [];\n  'clear': [];\n}>();\n\ndefineSlots<{\n  default: () => any;\n}>();\n\nconst { t } = useRuiI8n();\n\nconst keys = RUI_I18N_KEYS.dateTimePicker;\n\ninterface ActionConfig {\n  id: DateTimePickerAction;\n  icon: 'lu-clock' | 'lu-calendar-days' | 'lu-x';\n  label: string;\n  handler: () => void;\n}\n\nconst actionConfig = computed<ActionConfig[]>(() => {\n  const available: Record<DateTimePickerAction, ActionConfig> = {\n    clear: {\n      handler: () => emit('clear'),\n      icon: 'lu-x',\n      id: 'clear',\n      label: t(keys.clear, 'Clear'),\n    },\n    now: {\n      handler: () => emit('set-now'),\n      icon: 'lu-clock',\n      id: 'now',\n      label: t(keys.now, 'Now'),\n    },\n    today: {\n      handler: () => emit('set-today'),\n      icon: 'lu-calendar-days',\n      id: 'today',\n      label: t(keys.today, 'Today'),\n    },\n  };\n\n  return actions.map(action => available[action]).filter(Boolean);\n});\n</script>\n\n<template>\n  <div class=\"flex flex-col\">\n    <div class=\"flex between:border-l between:border-r-0 between:border-rui-divider\">\n      <RuiCalendar\n        v-model=\"selectedDate\"\n        v-model:menu-open=\"calendarMenuOpen\"\n        borderless\n        :max-date=\"maxDate\"\n        :min-date=\"minDate\"\n      />\n      <RuiTimePicker\n        v-model=\"selectedTime\"\n        v-model:hour=\"selectedHour\"\n        v-model:minute=\"selectedMinute\"\n        v-model:second=\"selectedSecond\"\n        v-model:millisecond=\"selectedMillisecond\"\n        v-model:selection=\"timeSelection\"\n        :accuracy=\"accuracy\"\n        borderless\n      />\n      <div v-if=\"showTimezone || $slots.default\">\n        <div\n          v-if=\"showTimezone\"\n          class=\"p-4 pl-3\"\n        >\n          <RuiTimezoneSelect\n            v-model=\"selectedTimezone\"\n            data-id=\"timezone-select\"\n            hide-details\n            class=\"pt-0 pr-0\"\n          />\n        </div>\n        <slot />\n      </div>\n    </div>\n    <div\n      v-if=\"actionConfig.length > 0\"\n      data-id=\"actions\"\n      class=\"flex justify-end gap-1 px-3 py-2 border-t border-rui-divider\"\n    >\n      <RuiButton\n        v-for=\"action in actionConfig\"\n        :key=\"action.id\"\n        variant=\"text\"\n        size=\"sm\"\n        color=\"primary\"\n        :data-id=\"`action-${action.id}`\"\n        @click=\"action.handler()\"\n      >\n        <template #prepend>\n          <RuiIcon\n            :name=\"action.icon\"\n            size=\"16\"\n          />\n        </template>\n        {{ action.label }}\n      </RuiButton>\n    </div>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDateTimePickerMenu.js","names":["_sfc_main"],"sources":["../../../src/components/date-time-picker/RuiDateTimePickerMenu.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { DateTimePickerAction } from '@/components/date-time-picker/types';\nimport type { TimeAccuracy } from '@/consts/time-accuracy';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiCalendar from '@/components/calendar/RuiCalendar.vue';\nimport RuiTimezoneSelect from '@/components/date-time-picker/RuiTimezoneSelect.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiTimePicker, { type TimePickerSelection } from '@/components/time-picker/RuiTimePicker.vue';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\n\ndefineOptions({\n  name: 'RuiDateTimePickerMenu',\n});\n\nconst selectedDate = defineModel<Date | undefined>('selectedDate', { required: true });\nconst selectedTime = defineModel<Date | undefined>('selectedTime', { required: true });\nconst selectedHour = defineModel<number | undefined>('selectedHour', { required: true });\nconst selectedMinute = defineModel<number | undefined>('selectedMinute', { required: true });\nconst selectedSecond = defineModel<number | undefined>('selectedSecond', { required: true });\nconst selectedMillisecond = defineModel<number | undefined>('selectedMillisecond', { required: true });\nconst timeSelection = defineModel<TimePickerSelection>('timeSelection', { required: true });\nconst selectedTimezone = defineModel<string | undefined>('selectedTimezone', { required: true });\nconst calendarMenuOpen = defineModel<boolean>('calendarMenuOpen', { required: true });\n\nconst { actions = [] } = defineProps<{\n  accuracy: TimeAccuracy;\n  actions?: DateTimePickerAction[];\n  maxDate?: Date | number;\n  minDate?: Date | number;\n  showTimezone?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  'set-now': [];\n  'set-today': [];\n  'clear': [];\n}>();\n\ndefineSlots<{\n  default: () => any;\n}>();\n\nconst { t } = useRuiI8n();\n\nconst keys = RUI_I18N_KEYS.dateTimePicker;\n\ninterface ActionConfig {\n  id: DateTimePickerAction;\n  icon: 'lu-clock' | 'lu-calendar-days' | 'lu-x';\n  label: string;\n  handler: () => void;\n}\n\nconst actionConfig = computed<ActionConfig[]>(() => {\n  const available: Record<DateTimePickerAction, ActionConfig> = {\n    clear: {\n      handler: () => emit('clear'),\n      icon: 'lu-x',\n      id: 'clear',\n      label: t(keys.clear, 'Clear'),\n    },\n    now: {\n      handler: () => emit('set-now'),\n      icon: 'lu-clock',\n      id: 'now',\n      label: t(keys.now, 'Now'),\n    },\n    today: {\n      handler: () => emit('set-today'),\n      icon: 'lu-calendar-days',\n      id: 'today',\n      label: t(keys.today, 'Today'),\n    },\n  };\n\n  return actions.map(action => available[action]).filter(Boolean);\n});\n</script>\n\n<template>\n  <div class=\"flex flex-col\">\n    <div class=\"flex between:border-l between:border-r-0 between:border-rui-divider\">\n      <RuiCalendar\n        v-model=\"selectedDate\"\n        v-model:menu-open=\"calendarMenuOpen\"\n        borderless\n        :max-date=\"maxDate\"\n        :min-date=\"minDate\"\n      />\n      <RuiTimePicker\n        v-model=\"selectedTime\"\n        v-model:hour=\"selectedHour\"\n        v-model:minute=\"selectedMinute\"\n        v-model:second=\"selectedSecond\"\n        v-model:millisecond=\"selectedMillisecond\"\n        v-model:selection=\"timeSelection\"\n        :accuracy=\"accuracy\"\n        borderless\n      />\n      <div v-if=\"showTimezone || $slots.default\">\n        <div\n          v-if=\"showTimezone\"\n          class=\"p-4 pl-3\"\n        >\n          <RuiTimezoneSelect\n            v-model=\"selectedTimezone\"\n            data-id=\"timezone-select\"\n            hide-details\n            class=\"pt-0 pr-0\"\n          />\n        </div>\n        <slot />\n      </div>\n    </div>\n    <div\n      v-if=\"actionConfig.length > 0\"\n      data-id=\"actions\"\n      class=\"flex justify-end gap-1 px-3 py-2 border-t border-rui-divider\"\n    >\n      <RuiButton\n        v-for=\"action in actionConfig\"\n        :key=\"action.id\"\n        variant=\"text\"\n        size=\"sm\"\n        color=\"primary\"\n        :data-id=\"`action-${action.id}`\"\n        @click=\"action.handler()\"\n      >\n        <template #prepend>\n          <RuiIcon\n            :name=\"action.icon\"\n            size=\"16\"\n          />\n        </template>\n        {{ action.label }}\n      </RuiButton>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/date-time-picker/RuiDateTimePickerMenu.vue.d.ts

@@ -1,6 +1,6 @@
 import type { DateTimePickerAction } from './types.js';
 import type { TimeAccuracy } from '../../consts/time-accuracy.js';
-import { type TimePickerSelection } from '../time-picker/RuiTimePicker.vue';
+import { type TimePickerSelection } from '../time-picker/RuiTimePicker.vue.js';
 type __VLS_Props = {
     accuracy: TimeAccuracy;
     actions?: DateTimePickerAction[];

package/dist/components/date-time-picker/RuiDateTimePickerMenu.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiDateTimePickerMenu.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../src/components/date-time-picker/RuiDateTimePickerMenu.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { DateTimePickerAction } from '@/components/date-time-picker/types';\nimport type { TimeAccuracy } from '@/consts/time-accuracy';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiCalendar from '@/components/calendar/RuiCalendar.vue';\nimport RuiTimezoneSelect from '@/components/date-time-picker/RuiTimezoneSelect.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiTimePicker, { type TimePickerSelection } from '@/components/time-picker/RuiTimePicker.vue';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\n\ndefineOptions({\n  name: 'RuiDateTimePickerMenu',\n});\n\nconst selectedDate = defineModel<Date | undefined>('selectedDate', { required: true });\nconst selectedTime = defineModel<Date | undefined>('selectedTime', { required: true });\nconst selectedHour = defineModel<number | undefined>('selectedHour', { required: true });\nconst selectedMinute = defineModel<number | undefined>('selectedMinute', { required: true });\nconst selectedSecond = defineModel<number | undefined>('selectedSecond', { required: true });\nconst selectedMillisecond = defineModel<number | undefined>('selectedMillisecond', { required: true });\nconst timeSelection = defineModel<TimePickerSelection>('timeSelection', { required: true });\nconst selectedTimezone = defineModel<string | undefined>('selectedTimezone', { required: true });\nconst calendarMenuOpen = defineModel<boolean>('calendarMenuOpen', { required: true });\n\nconst { actions = [] } = defineProps<{\n  accuracy: TimeAccuracy;\n  actions?: DateTimePickerAction[];\n  maxDate?: Date | number;\n  minDate?: Date | number;\n  showTimezone?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  'set-now': [];\n  'set-today': [];\n  'clear': [];\n}>();\n\ndefineSlots<{\n  default: () => any;\n}>();\n\nconst { t } = useRuiI8n();\n\nconst keys = RUI_I18N_KEYS.dateTimePicker;\n\ninterface ActionConfig {\n  id: DateTimePickerAction;\n  icon: 'lu-clock' | 'lu-calendar-days' | 'lu-x';\n  label: string;\n  handler: () => void;\n}\n\nconst actionConfig = computed<ActionConfig[]>(() => {\n  const available: Record<DateTimePickerAction, ActionConfig> = {\n    clear: {\n      handler: () => emit('clear'),\n      icon: 'lu-x',\n      id: 'clear',\n      label: t(keys.clear, 'Clear'),\n    },\n    now: {\n      handler: () => emit('set-now'),\n      icon: 'lu-clock',\n      id: 'now',\n      label: t(keys.now, 'Now'),\n    },\n    today: {\n      handler: () => emit('set-today'),\n      icon: 'lu-calendar-days',\n      id: 'today',\n      label: t(keys.today, 'Today'),\n    },\n  };\n\n  return actions.map(action => available[action]).filter(Boolean);\n});\n</script>\n\n<template>\n  <div class=\"flex flex-col\">\n    <div class=\"flex between:border-l between:border-r-0 between:border-rui-divider\">\n      <RuiCalendar\n        v-model=\"selectedDate\"\n        v-model:menu-open=\"calendarMenuOpen\"\n        borderless\n        :max-date=\"maxDate\"\n        :min-date=\"minDate\"\n      />\n      <RuiTimePicker\n        v-model=\"selectedTime\"\n        v-model:hour=\"selectedHour\"\n        v-model:minute=\"selectedMinute\"\n        v-model:second=\"selectedSecond\"\n        v-model:millisecond=\"selectedMillisecond\"\n        v-model:selection=\"timeSelection\"\n        :accuracy=\"accuracy\"\n        borderless\n      />\n      <div v-if=\"showTimezone || $slots.default\">\n        <div\n          v-if=\"showTimezone\"\n          class=\"p-4 pl-3\"\n        >\n          <RuiTimezoneSelect\n            v-model=\"selectedTimezone\"\n            data-id=\"timezone-select\"\n            hide-details\n            class=\"pt-0 pr-0\"\n          />\n        </div>\n        <slot />\n      </div>\n    </div>\n    <div\n      v-if=\"actionConfig.length > 0\"\n      data-id=\"actions\"\n      class=\"flex justify-end gap-1 px-3 py-2 border-t border-rui-divider\"\n    >\n      <RuiButton\n        v-for=\"action in actionConfig\"\n        :key=\"action.id\"\n        variant=\"text\"\n        size=\"sm\"\n        color=\"primary\"\n        :data-id=\"`action-${action.id}`\"\n        @click=\"action.handler()\"\n      >\n        <template #prepend>\n          <RuiIcon\n            :name=\"action.icon\"\n            size=\"16\"\n          />\n        </template>\n        {{ action.label }}\n      </RuiButton>\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"RuiDateTimePickerMenu.vue_vue_type_script_setup_true_lang.js","names":["$slots","_useModel","_openBlock","_createElementBlock","_createElementVNode","_createVNode","RuiCalendar","RuiTimePicker","RuiTimezoneSelect","_createCommentVNode","_renderSlot","_unref","_Fragment","_renderList","_createBlock","RuiButton","_withCtx","RuiIcon","_createTextVNode","_toDisplayString"],"sources":["../../../src/components/date-time-picker/RuiDateTimePickerMenu.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { DateTimePickerAction } from '@/components/date-time-picker/types';\nimport type { TimeAccuracy } from '@/consts/time-accuracy';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiCalendar from '@/components/calendar/RuiCalendar.vue';\nimport RuiTimezoneSelect from '@/components/date-time-picker/RuiTimezoneSelect.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiTimePicker, { type TimePickerSelection } from '@/components/time-picker/RuiTimePicker.vue';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\n\ndefineOptions({\n  name: 'RuiDateTimePickerMenu',\n});\n\nconst selectedDate = defineModel<Date | undefined>('selectedDate', { required: true });\nconst selectedTime = defineModel<Date | undefined>('selectedTime', { required: true });\nconst selectedHour = defineModel<number | undefined>('selectedHour', { required: true });\nconst selectedMinute = defineModel<number | undefined>('selectedMinute', { required: true });\nconst selectedSecond = defineModel<number | undefined>('selectedSecond', { required: true });\nconst selectedMillisecond = defineModel<number | undefined>('selectedMillisecond', { required: true });\nconst timeSelection = defineModel<TimePickerSelection>('timeSelection', { required: true });\nconst selectedTimezone = defineModel<string | undefined>('selectedTimezone', { required: true });\nconst calendarMenuOpen = defineModel<boolean>('calendarMenuOpen', { required: true });\n\nconst { actions = [] } = defineProps<{\n  accuracy: TimeAccuracy;\n  actions?: DateTimePickerAction[];\n  maxDate?: Date | number;\n  minDate?: Date | number;\n  showTimezone?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  'set-now': [];\n  'set-today': [];\n  'clear': [];\n}>();\n\ndefineSlots<{\n  default: () => any;\n}>();\n\nconst { t } = useRuiI8n();\n\nconst keys = RUI_I18N_KEYS.dateTimePicker;\n\ninterface ActionConfig {\n  id: DateTimePickerAction;\n  icon: 'lu-clock' | 'lu-calendar-days' | 'lu-x';\n  label: string;\n  handler: () => void;\n}\n\nconst actionConfig = computed<ActionConfig[]>(() => {\n  const available: Record<DateTimePickerAction, ActionConfig> = {\n    clear: {\n      handler: () => emit('clear'),\n      icon: 'lu-x',\n      id: 'clear',\n      label: t(keys.clear, 'Clear'),\n    },\n    now: {\n      handler: () => emit('set-now'),\n      icon: 'lu-clock',\n      id: 'now',\n      label: t(keys.now, 'Now'),\n    },\n    today: {\n      handler: () => emit('set-today'),\n      icon: 'lu-calendar-days',\n      id: 'today',\n      label: t(keys.today, 'Today'),\n    },\n  };\n\n  return actions.map(action => available[action]).filter(Boolean);\n});\n</script>\n\n<template>\n  <div class=\"flex flex-col\">\n    <div class=\"flex between:border-l between:border-r-0 between:border-rui-divider\">\n      <RuiCalendar\n        v-model=\"selectedDate\"\n        v-model:menu-open=\"calendarMenuOpen\"\n        borderless\n        :max-date=\"maxDate\"\n        :min-date=\"minDate\"\n      />\n      <RuiTimePicker\n        v-model=\"selectedTime\"\n        v-model:hour=\"selectedHour\"\n        v-model:minute=\"selectedMinute\"\n        v-model:second=\"selectedSecond\"\n        v-model:millisecond=\"selectedMillisecond\"\n        v-model:selection=\"timeSelection\"\n        :accuracy=\"accuracy\"\n        borderless\n      />\n      <div v-if=\"showTimezone || $slots.default\">\n        <div\n          v-if=\"showTimezone\"\n          class=\"p-4 pl-3\"\n        >\n          <RuiTimezoneSelect\n            v-model=\"selectedTimezone\"\n            data-id=\"timezone-select\"\n            hide-details\n            class=\"pt-0 pr-0\"\n          />\n        </div>\n        <slot />\n      </div>\n    </div>\n    <div\n      v-if=\"actionConfig.length > 0\"\n      data-id=\"actions\"\n      class=\"flex justify-end gap-1 px-3 py-2 border-t border-rui-divider\"\n    >\n      <RuiButton\n        v-for=\"action in actionConfig\"\n        :key=\"action.id\"\n        variant=\"text\"\n        size=\"sm\"\n        color=\"primary\"\n        :data-id=\"`action-${action.id}`\"\n        @click=\"action.handler()\"\n      >\n        <template #prepend>\n          <RuiIcon\n            :name=\"action.icon\"\n            size=\"16\"\n          />\n        </template>\n        {{ action.label }}\n      </RuiButton>\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/date-time-picker/RuiTimezoneSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiTimezoneSelect.js","names":[],"sources":["../../../src/components/date-time-picker/RuiTimezoneSelect.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { RuiAutoCompleteClassNames } from '@/components/forms/auto-complete/auto-complete-props';\nimport type { MenuProps } from '@/components/overlays/menu/RuiMenu.vue';\nimport type { LabelPlacement } from '@/composables/defaults/field';\nimport { timezones } from '@/components/date-time-picker/timezones';\nimport RuiAutoComplete from '@/components/forms/auto-complete/RuiAutoComplete.vue';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\n\nexport interface RuiTimezoneSelectProps {\n  disabled?: boolean;\n  readOnly?: boolean;\n  dense?: boolean;\n  clearable?: boolean;\n  label?: string;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  placeholder?: string;\n  required?: boolean;\n  classNames?: RuiAutoCompleteClassNames;\n  menuOptions?: MenuProps;\n}\n\ndefineOptions({\n  name: 'RuiTimezoneSelect',\n});\n\nconst modelValue = defineModel<string | undefined>({ required: true });\n\nconst {\n  disabled = false,\n  readOnly = false,\n  dense = false,\n  clearable = false,\n  label,\n  labelPlacement = undefined,\n  hint,\n  errorMessages,\n  successMessages,\n  hideDetails = false,\n  placeholder,\n  required = false,\n  classNames,\n  menuOptions,\n} = defineProps<RuiTimezoneSelectProps>();\n\nconst { t } = useRuiI8n();\n\nconst fieldLabel = computed<string>(() => label ?? t(RUI_I18N_KEYS.timezoneSelect.label, 'Timezone'));\n\ninterface TimezoneOption {\n  value: string;\n  label: string;\n}\n\nconst options: TimezoneOption[] = timezones.map(value => ({\n  value,\n  label: value.replace(/_/g, ' '),\n}));\n</script>\n\n<template>\n  <RuiAutoComplete\n    v-model=\"modelValue\"\n    key-attr=\"value\"\n    text-attr=\"label\"\n    auto-select-first\n    :options=\"options\"\n    :label=\"fieldLabel\"\n    :label-placement=\"labelPlacement\"\n    :disabled=\"disabled\"\n    :read-only=\"readOnly\"\n    :dense=\"dense\"\n    :clearable=\"clearable\"\n    :hint=\"hint\"\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hide-details=\"hideDetails\"\n    :placeholder=\"placeholder\"\n    :required=\"required\"\n    :class-names=\"classNames\"\n    :menu-options=\"menuOptions\"\n  />\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiTimezoneSelect.js","names":["_sfc_main"],"sources":["../../../src/components/date-time-picker/RuiTimezoneSelect.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { RuiAutoCompleteClassNames } from '@/components/forms/auto-complete/auto-complete-props';\nimport type { MenuProps } from '@/components/overlays/menu/RuiMenu.vue';\nimport type { LabelPlacement } from '@/composables/defaults/field';\nimport { timezones } from '@/components/date-time-picker/timezones';\nimport RuiAutoComplete from '@/components/forms/auto-complete/RuiAutoComplete.vue';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\n\nexport interface RuiTimezoneSelectProps {\n  disabled?: boolean;\n  readOnly?: boolean;\n  dense?: boolean;\n  clearable?: boolean;\n  label?: string;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  placeholder?: string;\n  required?: boolean;\n  classNames?: RuiAutoCompleteClassNames;\n  menuOptions?: MenuProps;\n}\n\ndefineOptions({\n  name: 'RuiTimezoneSelect',\n});\n\nconst modelValue = defineModel<string | undefined>({ required: true });\n\nconst {\n  disabled = false,\n  readOnly = false,\n  dense = false,\n  clearable = false,\n  label,\n  labelPlacement = undefined,\n  hint,\n  errorMessages,\n  successMessages,\n  hideDetails = false,\n  placeholder,\n  required = false,\n  classNames,\n  menuOptions,\n} = defineProps<RuiTimezoneSelectProps>();\n\nconst { t } = useRuiI8n();\n\nconst fieldLabel = computed<string>(() => label ?? t(RUI_I18N_KEYS.timezoneSelect.label, 'Timezone'));\n\ninterface TimezoneOption {\n  value: string;\n  label: string;\n}\n\nconst options: TimezoneOption[] = timezones.map(value => ({\n  value,\n  label: value.replace(/_/g, ' '),\n}));\n</script>\n\n<template>\n  <RuiAutoComplete\n    v-model=\"modelValue\"\n    key-attr=\"value\"\n    text-attr=\"label\"\n    auto-select-first\n    :options=\"options\"\n    :label=\"fieldLabel\"\n    :label-placement=\"labelPlacement\"\n    :disabled=\"disabled\"\n    :read-only=\"readOnly\"\n    :dense=\"dense\"\n    :clearable=\"clearable\"\n    :hint=\"hint\"\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hide-details=\"hideDetails\"\n    :placeholder=\"placeholder\"\n    :required=\"required\"\n    :class-names=\"classNames\"\n    :menu-options=\"menuOptions\"\n  />\n</template>\n"],"mappings":""}

package/dist/components/date-time-picker/RuiTimezoneSelect.vue.d.ts

@@ -1,5 +1,5 @@
-import type { RuiAutoCompleteClassNames } from '../forms/auto-complete/auto-complete-props';
-import type { MenuProps } from '../overlays/menu/RuiMenu.vue';
+import type { RuiAutoCompleteClassNames } from '../forms/auto-complete/auto-complete-props.js';
+import type { MenuProps } from '../overlays/menu/RuiMenu.vue.js';
 import type { LabelPlacement } from '../../composables/defaults/field.js';
 export interface RuiTimezoneSelectProps {
     disabled?: boolean;

package/dist/components/date-time-picker/RuiTimezoneSelect.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiTimezoneSelect.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/date-time-picker/RuiTimezoneSelect.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { RuiAutoCompleteClassNames } from '@/components/forms/auto-complete/auto-complete-props';\nimport type { MenuProps } from '@/components/overlays/menu/RuiMenu.vue';\nimport type { LabelPlacement } from '@/composables/defaults/field';\nimport { timezones } from '@/components/date-time-picker/timezones';\nimport RuiAutoComplete from '@/components/forms/auto-complete/RuiAutoComplete.vue';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\n\nexport interface RuiTimezoneSelectProps {\n  disabled?: boolean;\n  readOnly?: boolean;\n  dense?: boolean;\n  clearable?: boolean;\n  label?: string;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  placeholder?: string;\n  required?: boolean;\n  classNames?: RuiAutoCompleteClassNames;\n  menuOptions?: MenuProps;\n}\n\ndefineOptions({\n  name: 'RuiTimezoneSelect',\n});\n\nconst modelValue = defineModel<string | undefined>({ required: true });\n\nconst {\n  disabled = false,\n  readOnly = false,\n  dense = false,\n  clearable = false,\n  label,\n  labelPlacement = undefined,\n  hint,\n  errorMessages,\n  successMessages,\n  hideDetails = false,\n  placeholder,\n  required = false,\n  classNames,\n  menuOptions,\n} = defineProps<RuiTimezoneSelectProps>();\n\nconst { t } = useRuiI8n();\n\nconst fieldLabel = computed<string>(() => label ?? t(RUI_I18N_KEYS.timezoneSelect.label, 'Timezone'));\n\ninterface TimezoneOption {\n  value: string;\n  label: string;\n}\n\nconst options: TimezoneOption[] = timezones.map(value => ({\n  value,\n  label: value.replace(/_/g, ' '),\n}));\n</script>\n\n<template>\n  <RuiAutoComplete\n    v-model=\"modelValue\"\n    key-attr=\"value\"\n    text-attr=\"label\"\n    auto-select-first\n    :options=\"options\"\n    :label=\"fieldLabel\"\n    :label-placement=\"labelPlacement\"\n    :disabled=\"disabled\"\n    :read-only=\"readOnly\"\n    :dense=\"dense\"\n    :clearable=\"clearable\"\n    :hint=\"hint\"\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hide-details=\"hideDetails\"\n    :placeholder=\"placeholder\"\n    :required=\"required\"\n    :class-names=\"classNames\"\n    :menu-options=\"menuOptions\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+BA,MAAM,aAAa,SAA+B,SAAA,YAAmB;EAmBrE,MAAM,EAAE,MAAM,UAAU;EAExB,MAAM,aAAa,eAAuB,QAAA,SAAS,EAAE,cAAc,eAAe,OAAO,UAAU,CAAC;EAOpG,MAAM,UAA4B,UAAU,KAAI,WAAU;GACxD;GACA,OAAO,MAAM,QAAQ,MAAM,GAAG;EAChC,EAAE;;GAIA,OAAA,UAAA,GAAA,YAoBE,yBAAA;IAnBS,YAAA,WAAA;IAAA,uBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,WAAU,QAAA;IACnB,YAAS;IACT,aAAU;IACV,qBAAA;IACC,SAAS,MAAA,OAAA;IACT,OAAO,MAAA,UAAA;IACP,mBAAiB,QAAA;IACjB,UAAU,QAAA;IACV,aAAW,QAAA;IACX,OAAO,QAAA;IACP,WAAW,QAAA;IACX,MAAM,QAAA;IACN,kBAAgB,QAAA;IAChB,oBAAkB,QAAA;IAClB,gBAAc,QAAA;IACd,aAAa,QAAA;IACb,UAAU,QAAA;IACV,eAAa,QAAA;IACb,gBAAc,QAAA"}
+{"version":3,"file":"RuiTimezoneSelect.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createBlock","RuiAutoComplete","_unref"],"sources":["../../../src/components/date-time-picker/RuiTimezoneSelect.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { RuiAutoCompleteClassNames } from '@/components/forms/auto-complete/auto-complete-props';\nimport type { MenuProps } from '@/components/overlays/menu/RuiMenu.vue';\nimport type { LabelPlacement } from '@/composables/defaults/field';\nimport { timezones } from '@/components/date-time-picker/timezones';\nimport RuiAutoComplete from '@/components/forms/auto-complete/RuiAutoComplete.vue';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\n\nexport interface RuiTimezoneSelectProps {\n  disabled?: boolean;\n  readOnly?: boolean;\n  dense?: boolean;\n  clearable?: boolean;\n  label?: string;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  placeholder?: string;\n  required?: boolean;\n  classNames?: RuiAutoCompleteClassNames;\n  menuOptions?: MenuProps;\n}\n\ndefineOptions({\n  name: 'RuiTimezoneSelect',\n});\n\nconst modelValue = defineModel<string | undefined>({ required: true });\n\nconst {\n  disabled = false,\n  readOnly = false,\n  dense = false,\n  clearable = false,\n  label,\n  labelPlacement = undefined,\n  hint,\n  errorMessages,\n  successMessages,\n  hideDetails = false,\n  placeholder,\n  required = false,\n  classNames,\n  menuOptions,\n} = defineProps<RuiTimezoneSelectProps>();\n\nconst { t } = useRuiI8n();\n\nconst fieldLabel = computed<string>(() => label ?? t(RUI_I18N_KEYS.timezoneSelect.label, 'Timezone'));\n\ninterface TimezoneOption {\n  value: string;\n  label: string;\n}\n\nconst options: TimezoneOption[] = timezones.map(value => ({\n  value,\n  label: value.replace(/_/g, ' '),\n}));\n</script>\n\n<template>\n  <RuiAutoComplete\n    v-model=\"modelValue\"\n    key-attr=\"value\"\n    text-attr=\"label\"\n    auto-select-first\n    :options=\"options\"\n    :label=\"fieldLabel\"\n    :label-placement=\"labelPlacement\"\n    :disabled=\"disabled\"\n    :read-only=\"readOnly\"\n    :dense=\"dense\"\n    :clearable=\"clearable\"\n    :hint=\"hint\"\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hide-details=\"hideDetails\"\n    :placeholder=\"placeholder\"\n    :required=\"required\"\n    :class-names=\"classNames\"\n    :menu-options=\"menuOptions\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+BA,MAAM,aAAaA,SAA+B,SAAA,YAAmB;EAmBrE,MAAM,EAAE,MAAM,UAAU;EAExB,MAAM,aAAa,eAAuB,QAAA,SAAS,EAAE,cAAc,eAAe,OAAO,UAAU,CAAC;EAOpG,MAAM,UAA4B,UAAU,KAAI,WAAU;GACxD;GACA,OAAO,MAAM,QAAQ,MAAM,GAAG;EAChC,EAAE;;GAIA,OAAAC,UAAA,GAAAC,YAoBEC,yBAAA;IAnBS,YAAA,WAAA;IAAA,uBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,WAAU,QAAA;IACnB,YAAS;IACT,aAAU;IACV,qBAAA;IACC,SAASC,MAAA,OAAA;IACT,OAAOA,MAAA,UAAA;IACP,mBAAiB,QAAA;IACjB,UAAU,QAAA;IACV,aAAW,QAAA;IACX,OAAO,QAAA;IACP,WAAW,QAAA;IACX,MAAM,QAAA;IACN,kBAAgB,QAAA;IAChB,oBAAkB,QAAA;IAClB,gBAAc,QAAA;IACd,aAAa,QAAA;IACb,UAAU,QAAA;IACV,eAAa,QAAA;IACb,gBAAc,QAAA"}

package/dist/components/divider/RuiDivider.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiDivider.js","names":[],"sources":["../../../src/components/divider/RuiDivider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nexport interface Props {\n  vertical?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiDivider',\n  inheritAttrs: false,\n});\n\nconst { vertical = false } = defineProps<Props>();\n</script>\n\n<template>\n  <div\n    :class=\"vertical ? 'border-l' : 'border-t'\"\n    class=\"border-default\"\n    role=\"separator\"\n    :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n    v-bind=\"$attrs\"\n  />\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDivider.js","names":["_sfc_main"],"sources":["../../../src/components/divider/RuiDivider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nexport interface Props {\n  vertical?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiDivider',\n  inheritAttrs: false,\n});\n\nconst { vertical = false } = defineProps<Props>();\n</script>\n\n<template>\n  <div\n    :class=\"vertical ? 'border-l' : 'border-t'\"\n    class=\"border-default\"\n    role=\"separator\"\n    :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n    v-bind=\"$attrs\"\n  />\n</template>\n"],"mappings":""}

package/dist/components/divider/RuiDivider.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiDivider.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../../src/components/divider/RuiDivider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nexport interface Props {\n  vertical?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiDivider',\n  inheritAttrs: false,\n});\n\nconst { vertical = false } = defineProps<Props>();\n</script>\n\n<template>\n  <div\n    :class=\"vertical ? 'border-l' : 'border-t'\"\n    class=\"border-default\"\n    role=\"separator\"\n    :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n    v-bind=\"$attrs\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;GAcE,OAAA,UAAA,GAAA,mBAME,OANF,WAME;IALC,OAAK,CAAE,QAAA,WAAQ,aAAA,YACV,gBAAgB;IACtB,MAAK;IACJ,oBAAkB,QAAA,WAAQ,aAAA;GACnBA,GAAAA,KAAAA,MAAM,GAAA,MAAA,IAAA,UAAA"}
+{"version":3,"file":"RuiDivider.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_openBlock","_createElementBlock","_mergeProps"],"sources":["../../../src/components/divider/RuiDivider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nexport interface Props {\n  vertical?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiDivider',\n  inheritAttrs: false,\n});\n\nconst { vertical = false } = defineProps<Props>();\n</script>\n\n<template>\n  <div\n    :class=\"vertical ? 'border-l' : 'border-t'\"\n    class=\"border-default\"\n    role=\"separator\"\n    :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n    v-bind=\"$attrs\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;GAcE,OAAAC,UAAA,GAAAC,mBAME,OANFC,WAME;IALC,OAAK,CAAE,QAAA,WAAQ,aAAA,YACV,gBAAgB;IACtB,MAAK;IACJ,oBAAkB,QAAA,WAAQ,aAAA;GACnBH,GAAAA,KAAAA,MAAM,GAAA,MAAA,IAAA,UAAA"}

package/dist/components/forms/auto-complete/RuiAutoComplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiAutoComplete.js","names":[],"sources":["../../../../src/components/forms/auto-complete/RuiAutoComplete.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue, TItem\">\nimport type { AutoCompleteModelValue, AutoCompleteProps } from '@/components/forms/auto-complete/auto-complete-props';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport { autoCompleteStyles } from '@/components/forms/auto-complete/auto-complete-styles';\nimport RuiAutoCompleteOptionList from '@/components/forms/auto-complete/RuiAutoCompleteOptionList.vue';\nimport RuiAutoCompleteSelection from '@/components/forms/auto-complete/RuiAutoCompleteSelection.vue';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport { activatorHandlers } from '@/components/overlays/menu/activator-handlers';\nimport RuiMenu from '@/components/overlays/menu/RuiMenu.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { useLabelPlacement } from '@/composables/defaults/field';\nimport { getOptionHeight, useDropdownMenu, useDropdownOptionProperty } from '@/composables/dropdown-menu';\nimport { type FloatingOptions, Placement } from '@/composables/floating';\nimport {\n  splitAriaAttrs,\n  useAutoCompleteChips,\n  useAutoCompleteCombobox,\n  useAutoCompleteFocus,\n  useAutoCompleteKeyboardNavigation,\n  useAutoCompleteSearch,\n  useAutoCompleteSelection,\n  useAutoCompleteValue,\n} from '@/composables/forms/auto-complete';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\ndefineOptions({\n  name: 'RuiAutoComplete',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<AutoCompleteModelValue<TValue>>({ required: true });\n\nconst searchInputModel = defineModel<string>('searchInput', { default: '' });\n\nconst {\n  options = [],\n  disabled = false,\n  loading = false,\n  readOnly = false,\n  dense = false,\n  clearable = false,\n  hideDetails = false,\n  chips = false,\n  label = 'Select',\n  labelPlacement = undefined,\n  menuOptions,\n  classNames,\n  prependIcon,\n  hideArrow = false,\n  hint,\n  keyAttr,\n  textAttr,\n  itemHeight,\n  prependWidth,\n  appendWidth,\n  errorMessages = [],\n  successMessages = [],\n  autoSelectFirst = false,\n  noFilter = false,\n  hideNoData = false,\n  noDataText = 'No data available',\n  filter,\n  hideSelected = false,\n  placeholder = '',\n  returnObject = false,\n  customValue = false,\n  hideCustomValue = false,\n  required = false,\n  hideSearchInput = false,\n  hideSelectionWrapper = false,\n  groupBy,\n  itemDisabled,\n  searchIncludesGroupLabel = false,\n} = defineProps<AutoCompleteProps<TValue, TItem>>();\n\nconst slots = defineSlots<{\n  'activator'?: (props: {\n    disabled: boolean;\n    value: TItem[];\n    readOnly: boolean;\n    attrs: Record<string, unknown>;\n    open: boolean;\n    hasError: boolean;\n    hasSuccess: boolean;\n  }) => any;\n  'selection.prepend'?: (props: { index: number; item: TItem }) => any;\n  'selection'?: (props: { index: number; item: TItem; chipAttrs: Record<string, unknown> }) => any;\n  'item.prepend'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item.append'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'group-header'?: (props: { group: string; items: TItem[] }) => any;\n  'no-data'?: () => any;\n  'placeholder'?: (props: { disabled: boolean; readOnly: boolean }) => any;\n  'footer'?: () => any;\n}>();\n\nconst { getText, getIdentifier } = useDropdownOptionProperty<TValue, TItem>({\n  keyAttr,\n  textAttr,\n});\n\nconst textInput = useTemplateRef<HTMLInputElement>('textInput');\nconst activator = useTemplateRef<HTMLDivElement>('activator');\n// Owned by the option list, so it arrives through a ref callback rather than this template\nconst menuRef = shallowRef<HTMLElement | null>(null);\n\nfunction setMenuRef(element: Element | ComponentPublicInstance | null): void {\n  set(menuRef, element instanceof HTMLElement ? element : null);\n}\nconst menuWrapperRef = useTemplateRef<HTMLDivElement>('menuWrapperRef');\n\nconst { focused: activatorFocusedWithin } = useFocusWithin(activator);\nconst { focused: menuWrapperFocusedWithin } = useFocusWithin(menuWrapperRef);\nconst { focused: searchInputFocused } = useFocus(textInput);\n\nconst {\n  internalSearch,\n  filteredOptions,\n  justOpened,\n  updateInternalSearch,\n  textValueToProperValue,\n} = useAutoCompleteSearch<TItem>(\n  () => options,\n  searchInputModel,\n  {\n    keyAttr: () => keyAttr,\n    textAttr: () => textAttr,\n    noFilter: () => noFilter,\n    filter: () => filter,\n    customValue: () => customValue,\n    hideCustomValue: () => hideCustomValue,\n    returnObject: () => returnObject,\n    groupBy: () => groupBy,\n    searchIncludesGroupLabel: () => searchIncludesGroupLabel,\n  },\n);\n\nconst isOpen = ref<boolean>(false);\nconst isHovered = ref<boolean>(false);\n\n// Calculate multiple from modelValue directly to avoid circular dependency\nconst multiple = computed<boolean>(() => Array.isArray(get(modelValue)));\n\nconst shouldApplyValueAsSearch = computed<boolean>(\n  () => !(slots.selection || get(multiple) || chips),\n);\n\nconst { value } = useAutoCompleteValue<AutoCompleteModelValue<TValue>, TItem>(\n  modelValue,\n  () => options,\n  {\n    keyAttr: () => keyAttr,\n    returnObject: () => returnObject,\n    customValue: () => customValue,\n  },\n  {\n    getIdentifier,\n    getText,\n    textValueToProperValue,\n    shouldApplyValueAsSearch,\n    isOpen,\n    multiple,\n    updateInternalSearch,\n  },\n);\n\nconst resolvedItemHeight = itemHeight ?? getOptionHeight(dense);\n\n/* eslint-disable @typescript-eslint/no-use-before-define -- these call the selection composable below, which needs their helpers; the calls run after setup */\nconst {\n  containerProps,\n  wrapperProps,\n  renderedData,\n  menuWidth,\n  isActiveItem,\n  itemIndexInValue,\n  modelHighlightedIndex,\n  moveHighlight,\n  applyHighlighted,\n  optionsWithSelectedHidden,\n  modelUserNavigated,\n  groupedOptions,\n  isGrouped,\n  isItemDisabled,\n} = useDropdownMenu<TValue, TItem>({\n  itemHeight: resolvedItemHeight,\n  keyAttr,\n  textAttr,\n  options: filteredOptions,\n  dense: () => dense,\n  value,\n  menuRef,\n  setValue: (item: TItem): void => { setValue(item); },\n  autoSelectFirst,\n  hideSelected,\n  isOpen,\n  getText,\n  getIdentifier,\n  groupBy: () => groupBy,\n  itemDisabled: () => itemDisabled,\n  prependWidth,\n  appendWidth,\n});\n\nconst {\n  focusedValueIndex,\n  moveSelectedValueHighlight,\n  onEnter,\n  onInputDeletePressed,\n  onInputKeydown,\n  onTab,\n  setValueFocus,\n} = useAutoCompleteKeyboardNavigation<TItem>(\n  {\n    chips: () => chips,\n    customValue: () => customValue,\n    multiple,\n  },\n  {\n    activator,\n    applyHighlighted,\n    clear: (): void => clear(),\n    filteredOptions,\n    getText,\n    highlightedIndex: modelHighlightedIndex,\n    internalSearch,\n    isOpen,\n    removeValue: (item: TItem): void => { setValue(item); },\n    searchInputFocused,\n    setSearchAsValue: (): void => setSearchAsValue(),\n    updateInternalSearch,\n    userNavigated: modelUserNavigated,\n    value,\n  },\n);\n\nconst { chipAttrs, selectChip } = useAutoCompleteChips<TItem>({\n  focusInput: (): void => get(textInput)?.focus(),\n  getIdentifier,\n  setValue: (item: TItem): void => { setValue(item); },\n  setValueFocus,\n});\n\n/** The selected chip's text, read out by the live region so the selection is heard, not only seen. */\nconst selectedChipAnnouncement = computed<string>(() => {\n  const item = get(value)[get(focusedValueIndex)];\n  return chips && item !== undefined ? `${getText(item) ?? ''}, press Backspace to remove` : '';\n});\n\nconst {\n  anyFocused: focusAnyFocused,\n  editing,\n  inputClass: focusInputClass,\n  onInputFocused: focusOnInputFocused,\n  onSettledKeydown,\n  setInputFocus: focusSetInputFocus,\n  settleOnInput,\n  unsettle,\n} = useAutoCompleteFocus(\n  {\n    customValue: () => customValue,\n    disabled: () => disabled,\n    shouldApplyValueAsSearch,\n  },\n  {\n    activatorFocusedWithin,\n    focusedValueIndex,\n    internalSearch,\n    isOpen,\n    justOpened,\n    menuWrapperFocusedWithin,\n    searchInputFocused,\n    setSearchAsValue: (): void => setSearchAsValue(),\n    textInput,\n    updateInternalSearch,\n  },\n);\n\n/* eslint-enable @typescript-eslint/no-use-before-define -- the wiring above ends here */\n\nconst { clear, setSearchAsValue, setValue } = useAutoCompleteSelection<TItem>({\n  getText,\n  internalSearch,\n  isOpen,\n  itemIndexInValue,\n  multiple,\n  resetModel: (): void => set(modelValue, (Array.isArray(get(modelValue)) ? [] : undefined) as AutoCompleteModelValue<TValue>),\n  searchInputFocused,\n  settleOnInput,\n  shouldApplyValueAsSearch,\n  textValueToProperValue,\n  updateInternalSearch,\n  value,\n});\n\nconst menuMinHeight = computed<number>(\n  () => Math.min(5, get(optionsWithSelectedHidden).length) * resolvedItemHeight,\n);\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst valueSet = computed<boolean>(() => get(value).length > 0);\n\nconst usedPlaceholder = computed<string>(() => {\n  if (get(editing))\n    return placeholder;\n  return '';\n});\n\nconst labelId = useId();\nconst placement = useLabelPlacement(() => labelPlacement);\nconst { activeDescendant, optionIdPrefix } = useAutoCompleteCombobox(isOpen, modelHighlightedIndex);\n\n// An empty, unfocused field shows the placeholder where the collapsed search input sits\nconst restingPlaceholder = computed<boolean>(() =>\n  !!placeholder && !get(valueSet) && !get(editing) && !slots.placeholder,\n);\n\nconst ui = computed<ReturnType<typeof autoCompleteStyles>>(() => autoCompleteStyles({\n  opened: get(isOpen),\n  hovered: get(isHovered),\n  dense,\n  disabled,\n  readonly: readOnly,\n  multiple: get(multiple),\n  hasError: get(hasError),\n  hasSuccess: get(hasSuccess) && !get(hasError),\n}));\n\nconst highlightedClass = autoCompleteStyles({}).highlighted();\n\nfunction updateSearchInput(event: Event): void {\n  const target = event.target;\n  if (!(target instanceof HTMLInputElement))\n    return;\n\n  const value = target.value;\n  unsettle();\n  set(isOpen, true);\n  updateInternalSearch(value);\n  set(justOpened, false);\n}\n\n/**\n * Moves the highlight through the options, which also leaves the picked-value display for a search.\n *\n * @param up - whether to move towards the first option\n */\nfunction onArrow(up: boolean): void {\n  unsettle();\n  moveHighlight(up);\n}\n\nfunction setSelectionRange(start: number, end: number): void {\n  set(searchInputFocused, true);\n  get(textInput)?.setSelectionRange?.(start, end);\n}\n\nfunction arrowClicked(event: MouseEvent): void {\n  if (get(isOpen)) {\n    set(isOpen, false);\n    event.stopPropagation();\n  }\n}\n\nfunction openMenu(): void {\n  set(isOpen, true);\n}\n\nfunction closeMenu(): void {\n  set(isOpen, false);\n}\n\nconst menuFloatingOptions = computed<FloatingOptions>(() => ({\n  placement: Placement.bottomStart,\n  ...menuOptions?.options,\n}));\n\ndefineExpose({\n  closeMenu,\n  focus: focusSetInputFocus,\n  openMenu,\n  setSelectionRange,\n});\n</script>\n\n<template>\n  <RuiMenu\n    v-model=\"isOpen\"\n    v-bind=\"{ ...getRootAttrs($attrs, []), ...menuOptions }\"\n    :class=\"ui.wrapper({ class: cn($attrs.class) })\"\n    :class-names=\"{\n      ...menuOptions?.classNames,\n      details: ['px-0', cn(menuOptions?.classNames?.details) ?? ''],\n      menu: [\n        { hidden: optionsWithSelectedHidden.length === 0 && customValue && !slots['no-data'] },\n        cn(menuOptions?.classNames?.menu) ?? '',\n      ],\n    }\"\n    :options=\"menuFloatingOptions\"\n    :close-on-content-click=\"false\"\n    full-width\n    persist-on-activator-click\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hint=\"hint\"\n    :dense=\"dense\"\n    :show-details=\"!hideDetails\"\n    :disabled=\"disabled\"\n    disable-auto-focus\n    role=\"listbox\"\n  >\n    <template\n      v-if=\"label\"\n      #label\n    >\n      <RuiFieldLabel\n        :id=\"labelId\"\n        :text=\"label\"\n        :hidden=\"placement === 'hidden'\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </template>\n    <template #activator=\"{ attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\">\n      <slot\n        name=\"activator\"\n        v-bind=\"{ disabled, value, readOnly, attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\"\n      >\n        <!--\n          The visual box: it takes clicks and the keys that bubble from the input and the chips, but\n          is no tab stop and carries no role. The input inside is the combobox (ARIA 1.2), so the\n          chips sit beside it rather than nested in it.\n        -->\n        <div\n          ref=\"activator\"\n          :class=\"ui.activator({ class: cn([hideArrow && 'pr-3', classNames?.label]) })\"\n          v-bind=\"{\n            ...splitAriaAttrs(getNonRootAttrs($attrs, ['onClick', 'class']), false),\n            ...(readOnly ? {} : activatorHandlers(attrs)),\n          }\"\n          data-id=\"activator\"\n          @mouseenter=\"isHovered = true\"\n          @mouseleave=\"isHovered = false\"\n          @click=\"focusSetInputFocus()\"\n          @keydown.enter=\"onEnter($event)\"\n          @keydown.tab=\"onTab($event)\"\n          @keydown.left=\"moveSelectedValueHighlight($event, false)\"\n          @keydown.right=\"moveSelectedValueHighlight($event, true)\"\n          @keydown.up.prevent=\"onArrow(true)\"\n          @keydown.down.prevent=\"onArrow(false)\"\n          @keydown.home.prevent=\"modelHighlightedIndex = 0\"\n          @keydown.end.prevent=\"modelHighlightedIndex = optionsWithSelectedHidden.length - 1\"\n        >\n          <span\n            v-if=\"prependIcon\"\n            :class=\"ui.prepend()\"\n            data-id=\"prepend\"\n          >\n            <RuiIcon\n              :name=\"prependIcon\"\n              :size=\"dense ? 16 : 18\"\n            />\n          </span>\n          <div\n            data-id=\"value\"\n            :class=\"ui.value()\"\n          >\n            <!--\n              Placeholder slot occupies the same flex space the input takes\n              when focused, so transitioning into the focused state doesn't\n              shift the activator's content. pointer-events-none is required\n              so clicks pass through to the activator (otherwise the slot\n              swallows the first click and the menu needs two taps to open).\n            -->\n            <span\n              v-if=\"restingPlaceholder\"\n              data-id=\"resting-placeholder\"\n              class=\"truncate text-rui-text-secondary pointer-events-none\"\n            >\n              {{ placeholder }}\n            </span>\n            <div\n              v-if=\"!valueSet && !editing && slots.placeholder\"\n              data-id=\"placeholder\"\n              class=\"flex-1 min-w-0 pointer-events-none\"\n            >\n              <slot\n                name=\"placeholder\"\n                v-bind=\"{ disabled, readOnly }\"\n              />\n            </div>\n            <RuiAutoCompleteSelection\n              :items=\"value\"\n              :chips=\"chips\"\n              :dense=\"dense\"\n              :multiple=\"multiple\"\n              :search-input-focused=\"editing\"\n              :hide-selection-wrapper=\"hideSelectionWrapper\"\n              :get-identifier=\"getIdentifier\"\n              :get-text=\"getText\"\n              :chip-attrs=\"chipAttrs\"\n              :selected-index=\"focusedValueIndex\"\n              :select-chip=\"selectChip\"\n            >\n              <template\n                v-if=\"slots['selection.prepend']\"\n                #prepend=\"slotProps\"\n              >\n                <slot\n                  name=\"selection.prepend\"\n                  v-bind=\"slotProps\"\n                />\n              </template>\n              <template\n                v-if=\"slots.selection\"\n                #default=\"slotProps\"\n              >\n                <slot\n                  name=\"selection\"\n                  v-bind=\"slotProps\"\n                />\n              </template>\n            </RuiAutoCompleteSelection>\n            <!-- with hideSearchInput the input stays as a collapsed, read-only combobox, so the field keeps a focus target -->\n            <input\n              ref=\"textInput\"\n              :disabled=\"disabled\"\n              :readonly=\"readOnly || hideSearchInput\"\n              :value=\"internalSearch\"\n              class=\"bg-transparent outline-hidden\"\n              type=\"text\"\n              :placeholder=\"usedPlaceholder\"\n              :class=\"hideSearchInput ? 'w-0 h-0 min-w-0 opacity-0' : focusInputClass\"\n              role=\"combobox\"\n              :tabindex=\"readOnly ? -1 : undefined\"\n              :aria-labelledby=\"label ? labelId : undefined\"\n              :aria-expanded=\"open\"\n              aria-haspopup=\"listbox\"\n              :aria-controls=\"attrs['aria-controls']\"\n              :aria-activedescendant=\"activeDescendant\"\n              :aria-readonly=\"readOnly || undefined\"\n              :aria-required=\"required || undefined\"\n              :aria-busy=\"loading || undefined\"\n              :aria-invalid=\"hasError\"\n              aria-autocomplete=\"list\"\n              data-id=\"search-input\"\n              v-bind=\"splitAriaAttrs(getNonRootAttrs($attrs, ['onClick', 'class']), true)\"\n              @keydown=\"onSettledKeydown($event); onInputKeydown($event)\"\n              @keydown.delete=\"onInputDeletePressed($event)\"\n              @input.stop=\"updateSearchInput($event)\"\n              @focus=\"focusOnInputFocused()\"\n            />\n            <span\n              class=\"sr-only\"\n              aria-live=\"polite\"\n            >\n              {{ selectedChipAnnouncement }}\n            </span>\n          </div>\n\n          <RuiButton\n            v-if=\"clearable && valueSet && !disabled && !readOnly\"\n            variant=\"text\"\n            icon\n            size=\"sm\"\n            tabindex=\"-1\"\n            data-id=\"clear\"\n            aria-label=\"Clear\"\n            :class=\"[\n              ui.clear(),\n              focusAnyFocused && 'visible!',\n              { 'mr-2': !dense },\n            ]\"\n            @click.stop.prevent=\"clear()\"\n          >\n            <RuiIcon\n              name=\"lu-x\"\n              size=\"16\"\n            />\n          </RuiButton>\n\n          <span\n            v-if=\"!hideArrow\"\n            :class=\"ui.iconWrapper()\"\n            @click=\"arrowClicked($event)\"\n          >\n            <RuiIcon\n              :class=\"ui.icon()\"\n              :size=\"dense ? 16 : 20\"\n              name=\"lu-chevron-down\"\n            />\n          </span>\n\n          <RuiProgress\n            v-if=\"loading\"\n            :class=\"ui.progress()\"\n            color=\"primary\"\n            thickness=\"2\"\n            variant=\"indeterminate\"\n          />\n        </div>\n        <fieldset :class=\"ui.fieldset()\" />\n      </slot>\n    </template>\n    <template #default=\"{ width }\">\n      <div ref=\"menuWrapperRef\">\n        <RuiAutoCompleteOptionList\n          v-if=\"optionsWithSelectedHidden.length > 0\"\n          :container-props=\"containerProps\"\n          :wrapper-props=\"wrapperProps\"\n          :set-menu-ref=\"setMenuRef\"\n          :is-grouped=\"isGrouped\"\n          :grouped-options=\"groupedOptions\"\n          :rendered-data=\"renderedData\"\n          :options=\"optionsWithSelectedHidden\"\n          :highlighted-index=\"modelHighlightedIndex\"\n          :highlighted-class=\"highlightedClass\"\n          :dense=\"dense\"\n          :menu-class=\"ui.menu({ class: cn(classNames?.menu) })\"\n          :menu-style=\"{ width: `${width}px`, minWidth: menuWidth, minHeight: `${menuMinHeight}px` }\"\n          :get-identifier=\"getIdentifier\"\n          :get-text=\"getText\"\n          :is-active-item=\"isActiveItem\"\n          :is-item-disabled=\"isItemDisabled\"\n          :option-id-prefix=\"optionIdPrefix\"\n          @select=\"setValue($event)\"\n          @move-highlight=\"moveHighlight($event)\"\n        >\n          <template\n            v-if=\"slots['group-header']\"\n            #group-header=\"slotProps\"\n          >\n            <slot\n              name=\"group-header\"\n              v-bind=\"slotProps\"\n            />\n          </template>\n          <template\n            v-if=\"slots['item.prepend']\"\n            #item.prepend=\"slotProps\"\n          >\n            <slot\n              name=\"item.prepend\"\n              v-bind=\"slotProps\"\n            />\n          </template>\n          <template\n            v-if=\"slots.item\"\n            #item=\"slotProps\"\n          >\n            <slot\n              name=\"item\"\n              v-bind=\"slotProps\"\n            />\n          </template>\n          <template\n            v-if=\"slots['item.append']\"\n            #item.append=\"slotProps\"\n          >\n            <slot\n              name=\"item.append\"\n              v-bind=\"slotProps\"\n            />\n          </template>\n        </RuiAutoCompleteOptionList>\n\n        <div\n          v-else-if=\"!hideNoData\"\n          :style=\"{ width: `${width}px`, minWidth: menuWidth }\"\n          :class=\"classNames?.menu\"\n        >\n          <slot name=\"no-data\">\n            <div\n              v-if=\"!customValue\"\n              class=\"p-4\"\n              data-id=\"no-data\"\n            >\n              {{ noDataText }}\n            </div>\n          </slot>\n        </div>\n        <!--\n          The scroll container above reserves ~15px on the right for the\n          scrollbar gutter. We render an equivalent right-padding here so the\n          footer's content aligns with the option rows' content rather than\n          the menu's outer edge. `pr-(--rui-scrollbar-gutter,15px)`\n          lets consumers override if their theme reserves a different width.\n        -->\n        <div\n          v-if=\"slots.footer\"\n          class=\"bg-rui-menu border-t border-rui-divider pr-(--rui-scrollbar-gutter,15px) -mb-2\"\n          data-id=\"footer\"\n        >\n          <slot name=\"footer\" />\n        </div>\n      </div>\n    </template>\n  </RuiMenu>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiAutoComplete.js","names":["_sfc_main"],"sources":["../../../../src/components/forms/auto-complete/RuiAutoComplete.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue, TItem\">\nimport type { AutoCompleteModelValue, AutoCompleteProps } from '@/components/forms/auto-complete/auto-complete-props';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport { autoCompleteStyles } from '@/components/forms/auto-complete/auto-complete-styles';\nimport RuiAutoCompleteOptionList from '@/components/forms/auto-complete/RuiAutoCompleteOptionList.vue';\nimport RuiAutoCompleteSelection from '@/components/forms/auto-complete/RuiAutoCompleteSelection.vue';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport { activatorHandlers } from '@/components/overlays/menu/activator-handlers';\nimport RuiMenu from '@/components/overlays/menu/RuiMenu.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { useLabelPlacement } from '@/composables/defaults/field';\nimport { getOptionHeight, useDropdownMenu, useDropdownOptionProperty } from '@/composables/dropdown-menu';\nimport { type FloatingOptions, Placement } from '@/composables/floating';\nimport {\n  splitAriaAttrs,\n  useAutoCompleteChips,\n  useAutoCompleteCombobox,\n  useAutoCompleteFocus,\n  useAutoCompleteKeyboardNavigation,\n  useAutoCompleteSearch,\n  useAutoCompleteSelection,\n  useAutoCompleteValue,\n} from '@/composables/forms/auto-complete';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\ndefineOptions({\n  name: 'RuiAutoComplete',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<AutoCompleteModelValue<TValue>>({ required: true });\n\nconst searchInputModel = defineModel<string>('searchInput', { default: '' });\n\nconst {\n  options = [],\n  disabled = false,\n  loading = false,\n  readOnly = false,\n  dense = false,\n  clearable = false,\n  hideDetails = false,\n  chips = false,\n  label = 'Select',\n  labelPlacement = undefined,\n  menuOptions,\n  classNames,\n  prependIcon,\n  hideArrow = false,\n  hint,\n  keyAttr,\n  textAttr,\n  itemHeight,\n  prependWidth,\n  appendWidth,\n  errorMessages = [],\n  successMessages = [],\n  autoSelectFirst = false,\n  noFilter = false,\n  hideNoData = false,\n  noDataText = 'No data available',\n  filter,\n  hideSelected = false,\n  placeholder = '',\n  returnObject = false,\n  customValue = false,\n  hideCustomValue = false,\n  required = false,\n  hideSearchInput = false,\n  hideSelectionWrapper = false,\n  groupBy,\n  itemDisabled,\n  searchIncludesGroupLabel = false,\n} = defineProps<AutoCompleteProps<TValue, TItem>>();\n\nconst slots = defineSlots<{\n  'activator'?: (props: {\n    disabled: boolean;\n    value: TItem[];\n    readOnly: boolean;\n    attrs: Record<string, unknown>;\n    open: boolean;\n    hasError: boolean;\n    hasSuccess: boolean;\n  }) => any;\n  'selection.prepend'?: (props: { index: number; item: TItem }) => any;\n  'selection'?: (props: { index: number; item: TItem; chipAttrs: Record<string, unknown> }) => any;\n  'item.prepend'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item.append'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'group-header'?: (props: { group: string; items: TItem[] }) => any;\n  'no-data'?: () => any;\n  'placeholder'?: (props: { disabled: boolean; readOnly: boolean }) => any;\n  'footer'?: () => any;\n}>();\n\nconst { getText, getIdentifier } = useDropdownOptionProperty<TValue, TItem>({\n  keyAttr,\n  textAttr,\n});\n\nconst textInput = useTemplateRef<HTMLInputElement>('textInput');\nconst activator = useTemplateRef<HTMLDivElement>('activator');\n// Owned by the option list, so it arrives through a ref callback rather than this template\nconst menuRef = shallowRef<HTMLElement | null>(null);\n\nfunction setMenuRef(element: Element | ComponentPublicInstance | null): void {\n  set(menuRef, element instanceof HTMLElement ? element : null);\n}\nconst menuWrapperRef = useTemplateRef<HTMLDivElement>('menuWrapperRef');\n\nconst { focused: activatorFocusedWithin } = useFocusWithin(activator);\nconst { focused: menuWrapperFocusedWithin } = useFocusWithin(menuWrapperRef);\nconst { focused: searchInputFocused } = useFocus(textInput);\n\nconst {\n  internalSearch,\n  filteredOptions,\n  justOpened,\n  updateInternalSearch,\n  textValueToProperValue,\n} = useAutoCompleteSearch<TItem>(\n  () => options,\n  searchInputModel,\n  {\n    keyAttr: () => keyAttr,\n    textAttr: () => textAttr,\n    noFilter: () => noFilter,\n    filter: () => filter,\n    customValue: () => customValue,\n    hideCustomValue: () => hideCustomValue,\n    returnObject: () => returnObject,\n    groupBy: () => groupBy,\n    searchIncludesGroupLabel: () => searchIncludesGroupLabel,\n  },\n);\n\nconst isOpen = ref<boolean>(false);\nconst isHovered = ref<boolean>(false);\n\n// Calculate multiple from modelValue directly to avoid circular dependency\nconst multiple = computed<boolean>(() => Array.isArray(get(modelValue)));\n\nconst shouldApplyValueAsSearch = computed<boolean>(\n  () => !(slots.selection || get(multiple) || chips),\n);\n\nconst { value } = useAutoCompleteValue<AutoCompleteModelValue<TValue>, TItem>(\n  modelValue,\n  () => options,\n  {\n    keyAttr: () => keyAttr,\n    returnObject: () => returnObject,\n    customValue: () => customValue,\n  },\n  {\n    getIdentifier,\n    getText,\n    textValueToProperValue,\n    shouldApplyValueAsSearch,\n    isOpen,\n    multiple,\n    updateInternalSearch,\n  },\n);\n\nconst resolvedItemHeight = itemHeight ?? getOptionHeight(dense);\n\n/* eslint-disable @typescript-eslint/no-use-before-define -- these call the selection composable below, which needs their helpers; the calls run after setup */\nconst {\n  containerProps,\n  wrapperProps,\n  renderedData,\n  menuWidth,\n  isActiveItem,\n  itemIndexInValue,\n  modelHighlightedIndex,\n  moveHighlight,\n  applyHighlighted,\n  optionsWithSelectedHidden,\n  modelUserNavigated,\n  groupedOptions,\n  isGrouped,\n  isItemDisabled,\n} = useDropdownMenu<TValue, TItem>({\n  itemHeight: resolvedItemHeight,\n  keyAttr,\n  textAttr,\n  options: filteredOptions,\n  dense: () => dense,\n  value,\n  menuRef,\n  setValue: (item: TItem): void => { setValue(item); },\n  autoSelectFirst,\n  hideSelected,\n  isOpen,\n  getText,\n  getIdentifier,\n  groupBy: () => groupBy,\n  itemDisabled: () => itemDisabled,\n  prependWidth,\n  appendWidth,\n});\n\nconst {\n  focusedValueIndex,\n  moveSelectedValueHighlight,\n  onEnter,\n  onInputDeletePressed,\n  onInputKeydown,\n  onTab,\n  setValueFocus,\n} = useAutoCompleteKeyboardNavigation<TItem>(\n  {\n    chips: () => chips,\n    customValue: () => customValue,\n    multiple,\n  },\n  {\n    activator,\n    applyHighlighted,\n    clear: (): void => clear(),\n    filteredOptions,\n    getText,\n    highlightedIndex: modelHighlightedIndex,\n    internalSearch,\n    isOpen,\n    removeValue: (item: TItem): void => { setValue(item); },\n    searchInputFocused,\n    setSearchAsValue: (): void => setSearchAsValue(),\n    updateInternalSearch,\n    userNavigated: modelUserNavigated,\n    value,\n  },\n);\n\nconst { chipAttrs, selectChip } = useAutoCompleteChips<TItem>({\n  focusInput: (): void => get(textInput)?.focus(),\n  getIdentifier,\n  setValue: (item: TItem): void => { setValue(item); },\n  setValueFocus,\n});\n\n/** The selected chip's text, read out by the live region so the selection is heard, not only seen. */\nconst selectedChipAnnouncement = computed<string>(() => {\n  const item = get(value)[get(focusedValueIndex)];\n  return chips && item !== undefined ? `${getText(item) ?? ''}, press Backspace to remove` : '';\n});\n\nconst {\n  anyFocused: focusAnyFocused,\n  editing,\n  inputClass: focusInputClass,\n  onInputFocused: focusOnInputFocused,\n  onSettledKeydown,\n  setInputFocus: focusSetInputFocus,\n  settleOnInput,\n  unsettle,\n} = useAutoCompleteFocus(\n  {\n    customValue: () => customValue,\n    disabled: () => disabled,\n    shouldApplyValueAsSearch,\n  },\n  {\n    activatorFocusedWithin,\n    focusedValueIndex,\n    internalSearch,\n    isOpen,\n    justOpened,\n    menuWrapperFocusedWithin,\n    searchInputFocused,\n    setSearchAsValue: (): void => setSearchAsValue(),\n    textInput,\n    updateInternalSearch,\n  },\n);\n\n/* eslint-enable @typescript-eslint/no-use-before-define -- the wiring above ends here */\n\nconst { clear, setSearchAsValue, setValue } = useAutoCompleteSelection<TItem>({\n  getText,\n  internalSearch,\n  isOpen,\n  itemIndexInValue,\n  multiple,\n  resetModel: (): void => set(modelValue, (Array.isArray(get(modelValue)) ? [] : undefined) as AutoCompleteModelValue<TValue>),\n  searchInputFocused,\n  settleOnInput,\n  shouldApplyValueAsSearch,\n  textValueToProperValue,\n  updateInternalSearch,\n  value,\n});\n\nconst menuMinHeight = computed<number>(\n  () => Math.min(5, get(optionsWithSelectedHidden).length) * resolvedItemHeight,\n);\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst valueSet = computed<boolean>(() => get(value).length > 0);\n\nconst usedPlaceholder = computed<string>(() => {\n  if (get(editing))\n    return placeholder;\n  return '';\n});\n\nconst labelId = useId();\nconst placement = useLabelPlacement(() => labelPlacement);\nconst { activeDescendant, optionIdPrefix } = useAutoCompleteCombobox(isOpen, modelHighlightedIndex);\n\n// An empty, unfocused field shows the placeholder where the collapsed search input sits\nconst restingPlaceholder = computed<boolean>(() =>\n  !!placeholder && !get(valueSet) && !get(editing) && !slots.placeholder,\n);\n\nconst ui = computed<ReturnType<typeof autoCompleteStyles>>(() => autoCompleteStyles({\n  opened: get(isOpen),\n  hovered: get(isHovered),\n  dense,\n  disabled,\n  readonly: readOnly,\n  multiple: get(multiple),\n  hasError: get(hasError),\n  hasSuccess: get(hasSuccess) && !get(hasError),\n}));\n\nconst highlightedClass = autoCompleteStyles({}).highlighted();\n\nfunction updateSearchInput(event: Event): void {\n  const target = event.target;\n  if (!(target instanceof HTMLInputElement))\n    return;\n\n  const value = target.value;\n  unsettle();\n  set(isOpen, true);\n  updateInternalSearch(value);\n  set(justOpened, false);\n}\n\n/**\n * Moves the highlight through the options, which also leaves the picked-value display for a search.\n *\n * @param up - whether to move towards the first option\n */\nfunction onArrow(up: boolean): void {\n  unsettle();\n  moveHighlight(up);\n}\n\nfunction setSelectionRange(start: number, end: number): void {\n  set(searchInputFocused, true);\n  get(textInput)?.setSelectionRange?.(start, end);\n}\n\nfunction arrowClicked(event: MouseEvent): void {\n  if (get(isOpen)) {\n    set(isOpen, false);\n    event.stopPropagation();\n  }\n}\n\nfunction openMenu(): void {\n  set(isOpen, true);\n}\n\nfunction closeMenu(): void {\n  set(isOpen, false);\n}\n\nconst menuFloatingOptions = computed<FloatingOptions>(() => ({\n  placement: Placement.bottomStart,\n  ...menuOptions?.options,\n}));\n\ndefineExpose({\n  closeMenu,\n  focus: focusSetInputFocus,\n  openMenu,\n  setSelectionRange,\n});\n</script>\n\n<template>\n  <RuiMenu\n    v-model=\"isOpen\"\n    v-bind=\"{ ...getRootAttrs($attrs, []), ...menuOptions }\"\n    :class=\"ui.wrapper({ class: cn($attrs.class) })\"\n    :class-names=\"{\n      ...menuOptions?.classNames,\n      details: ['px-0', cn(menuOptions?.classNames?.details) ?? ''],\n      menu: [\n        { hidden: optionsWithSelectedHidden.length === 0 && customValue && !slots['no-data'] },\n        cn(menuOptions?.classNames?.menu) ?? '',\n      ],\n    }\"\n    :options=\"menuFloatingOptions\"\n    :close-on-content-click=\"false\"\n    full-width\n    persist-on-activator-click\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hint=\"hint\"\n    :dense=\"dense\"\n    :show-details=\"!hideDetails\"\n    :disabled=\"disabled\"\n    disable-auto-focus\n    role=\"listbox\"\n  >\n    <template\n      v-if=\"label\"\n      #label\n    >\n      <RuiFieldLabel\n        :id=\"labelId\"\n        :text=\"label\"\n        :hidden=\"placement === 'hidden'\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </template>\n    <template #activator=\"{ attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\">\n      <slot\n        name=\"activator\"\n        v-bind=\"{ disabled, value, readOnly, attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\"\n      >\n        <!--\n          The visual box: it takes clicks and the keys that bubble from the input and the chips, but\n          is no tab stop and carries no role. The input inside is the combobox (ARIA 1.2), so the\n          chips sit beside it rather than nested in it.\n        -->\n        <div\n          ref=\"activator\"\n          :class=\"ui.activator({ class: cn([hideArrow && 'pr-3', classNames?.label]) })\"\n          v-bind=\"{\n            ...splitAriaAttrs(getNonRootAttrs($attrs, ['onClick', 'class']), false),\n            ...(readOnly ? {} : activatorHandlers(attrs)),\n          }\"\n          data-id=\"activator\"\n          @mouseenter=\"isHovered = true\"\n          @mouseleave=\"isHovered = false\"\n          @click=\"focusSetInputFocus()\"\n          @keydown.enter=\"onEnter($event)\"\n          @keydown.tab=\"onTab($event)\"\n          @keydown.left=\"moveSelectedValueHighlight($event, false)\"\n          @keydown.right=\"moveSelectedValueHighlight($event, true)\"\n          @keydown.up.prevent=\"onArrow(true)\"\n          @keydown.down.prevent=\"onArrow(false)\"\n          @keydown.home.prevent=\"modelHighlightedIndex = 0\"\n          @keydown.end.prevent=\"modelHighlightedIndex = optionsWithSelectedHidden.length - 1\"\n        >\n          <span\n            v-if=\"prependIcon\"\n            :class=\"ui.prepend()\"\n            data-id=\"prepend\"\n          >\n            <RuiIcon\n              :name=\"prependIcon\"\n              :size=\"dense ? 16 : 18\"\n            />\n          </span>\n          <div\n            data-id=\"value\"\n            :class=\"ui.value()\"\n          >\n            <!--\n              Placeholder slot occupies the same flex space the input takes\n              when focused, so transitioning into the focused state doesn't\n              shift the activator's content. pointer-events-none is required\n              so clicks pass through to the activator (otherwise the slot\n              swallows the first click and the menu needs two taps to open).\n            -->\n            <span\n              v-if=\"restingPlaceholder\"\n              data-id=\"resting-placeholder\"\n              class=\"truncate text-rui-text-secondary pointer-events-none\"\n            >\n              {{ placeholder }}\n            </span>\n            <div\n              v-if=\"!valueSet && !editing && slots.placeholder\"\n              data-id=\"placeholder\"\n              class=\"flex-1 min-w-0 pointer-events-none\"\n            >\n              <slot\n                name=\"placeholder\"\n                v-bind=\"{ disabled, readOnly }\"\n              />\n            </div>\n            <RuiAutoCompleteSelection\n              :items=\"value\"\n              :chips=\"chips\"\n              :dense=\"dense\"\n              :multiple=\"multiple\"\n              :search-input-focused=\"editing\"\n              :hide-selection-wrapper=\"hideSelectionWrapper\"\n              :get-identifier=\"getIdentifier\"\n              :get-text=\"getText\"\n              :chip-attrs=\"chipAttrs\"\n              :selected-index=\"focusedValueIndex\"\n              :select-chip=\"selectChip\"\n            >\n              <template\n                v-if=\"slots['selection.prepend']\"\n                #prepend=\"slotProps\"\n              >\n                <slot\n                  name=\"selection.prepend\"\n                  v-bind=\"slotProps\"\n                />\n              </template>\n              <template\n                v-if=\"slots.selection\"\n                #default=\"slotProps\"\n              >\n                <slot\n                  name=\"selection\"\n                  v-bind=\"slotProps\"\n                />\n              </template>\n            </RuiAutoCompleteSelection>\n            <!-- with hideSearchInput the input stays as a collapsed, read-only combobox, so the field keeps a focus target -->\n            <input\n              ref=\"textInput\"\n              :disabled=\"disabled\"\n              :readonly=\"readOnly || hideSearchInput\"\n              :value=\"internalSearch\"\n              class=\"bg-transparent outline-hidden\"\n              type=\"text\"\n              :placeholder=\"usedPlaceholder\"\n              :class=\"hideSearchInput ? 'w-0 h-0 min-w-0 opacity-0' : focusInputClass\"\n              role=\"combobox\"\n              :tabindex=\"readOnly ? -1 : undefined\"\n              :aria-labelledby=\"label ? labelId : undefined\"\n              :aria-expanded=\"open\"\n              aria-haspopup=\"listbox\"\n              :aria-controls=\"attrs['aria-controls']\"\n              :aria-activedescendant=\"activeDescendant\"\n              :aria-readonly=\"readOnly || undefined\"\n              :aria-required=\"required || undefined\"\n              :aria-busy=\"loading || undefined\"\n              :aria-invalid=\"hasError\"\n              aria-autocomplete=\"list\"\n              data-id=\"search-input\"\n              v-bind=\"splitAriaAttrs(getNonRootAttrs($attrs, ['onClick', 'class']), true)\"\n              @keydown=\"onSettledKeydown($event); onInputKeydown($event)\"\n              @keydown.delete=\"onInputDeletePressed($event)\"\n              @input.stop=\"updateSearchInput($event)\"\n              @focus=\"focusOnInputFocused()\"\n            />\n            <span\n              class=\"sr-only\"\n              aria-live=\"polite\"\n            >\n              {{ selectedChipAnnouncement }}\n            </span>\n          </div>\n\n          <RuiButton\n            v-if=\"clearable && valueSet && !disabled && !readOnly\"\n            variant=\"text\"\n            icon\n            size=\"sm\"\n            tabindex=\"-1\"\n            data-id=\"clear\"\n            aria-label=\"Clear\"\n            :class=\"[\n              ui.clear(),\n              focusAnyFocused && 'visible!',\n              { 'mr-2': !dense },\n            ]\"\n            @click.stop.prevent=\"clear()\"\n          >\n            <RuiIcon\n              name=\"lu-x\"\n              size=\"16\"\n            />\n          </RuiButton>\n\n          <span\n            v-if=\"!hideArrow\"\n            :class=\"ui.iconWrapper()\"\n            @click=\"arrowClicked($event)\"\n          >\n            <RuiIcon\n              :class=\"ui.icon()\"\n              :size=\"dense ? 16 : 20\"\n              name=\"lu-chevron-down\"\n            />\n          </span>\n\n          <RuiProgress\n            v-if=\"loading\"\n            :class=\"ui.progress()\"\n            color=\"primary\"\n            thickness=\"2\"\n            variant=\"indeterminate\"\n          />\n        </div>\n        <fieldset :class=\"ui.fieldset()\" />\n      </slot>\n    </template>\n    <template #default=\"{ width }\">\n      <div ref=\"menuWrapperRef\">\n        <RuiAutoCompleteOptionList\n          v-if=\"optionsWithSelectedHidden.length > 0\"\n          :container-props=\"containerProps\"\n          :wrapper-props=\"wrapperProps\"\n          :set-menu-ref=\"setMenuRef\"\n          :is-grouped=\"isGrouped\"\n          :grouped-options=\"groupedOptions\"\n          :rendered-data=\"renderedData\"\n          :options=\"optionsWithSelectedHidden\"\n          :highlighted-index=\"modelHighlightedIndex\"\n          :highlighted-class=\"highlightedClass\"\n          :dense=\"dense\"\n          :menu-class=\"ui.menu({ class: cn(classNames?.menu) })\"\n          :menu-style=\"{ width: `${width}px`, minWidth: menuWidth, minHeight: `${menuMinHeight}px` }\"\n          :get-identifier=\"getIdentifier\"\n          :get-text=\"getText\"\n          :is-active-item=\"isActiveItem\"\n          :is-item-disabled=\"isItemDisabled\"\n          :option-id-prefix=\"optionIdPrefix\"\n          @select=\"setValue($event)\"\n          @move-highlight=\"moveHighlight($event)\"\n        >\n          <template\n            v-if=\"slots['group-header']\"\n            #group-header=\"slotProps\"\n          >\n            <slot\n              name=\"group-header\"\n              v-bind=\"slotProps\"\n            />\n          </template>\n          <template\n            v-if=\"slots['item.prepend']\"\n            #item.prepend=\"slotProps\"\n          >\n            <slot\n              name=\"item.prepend\"\n              v-bind=\"slotProps\"\n            />\n          </template>\n          <template\n            v-if=\"slots.item\"\n            #item=\"slotProps\"\n          >\n            <slot\n              name=\"item\"\n              v-bind=\"slotProps\"\n            />\n          </template>\n          <template\n            v-if=\"slots['item.append']\"\n            #item.append=\"slotProps\"\n          >\n            <slot\n              name=\"item.append\"\n              v-bind=\"slotProps\"\n            />\n          </template>\n        </RuiAutoCompleteOptionList>\n\n        <div\n          v-else-if=\"!hideNoData\"\n          :style=\"{ width: `${width}px`, minWidth: menuWidth }\"\n          :class=\"classNames?.menu\"\n        >\n          <slot name=\"no-data\">\n            <div\n              v-if=\"!customValue\"\n              class=\"p-4\"\n              data-id=\"no-data\"\n            >\n              {{ noDataText }}\n            </div>\n          </slot>\n        </div>\n        <!--\n          The scroll container above reserves ~15px on the right for the\n          scrollbar gutter. We render an equivalent right-padding here so the\n          footer's content aligns with the option rows' content rather than\n          the menu's outer edge. `pr-(--rui-scrollbar-gutter,15px)`\n          lets consumers override if their theme reserves a different width.\n        -->\n        <div\n          v-if=\"slots.footer\"\n          class=\"bg-rui-menu border-t border-rui-divider pr-(--rui-scrollbar-gutter,15px) -mb-2\"\n          data-id=\"footer\"\n        >\n          <slot name=\"footer\" />\n        </div>\n      </div>\n    </template>\n  </RuiMenu>\n</template>\n"],"mappings":""}

package/dist/components/forms/auto-complete/RuiAutoComplete.vue.d.ts

@@ -1,4 +1,4 @@
-import type { AutoCompleteModelValue, AutoCompleteProps } from './auto-complete-props';
+import type { AutoCompleteModelValue, AutoCompleteProps } from './auto-complete-props.js';
 declare const __VLS_export: <TValue, TItem>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: import("vue").PublicProps & __VLS_PrettifyLocal<(AutoCompleteProps<TValue, TItem> & {
         modelValue: AutoCompleteModelValue<TValue>;