reka-ui 2.2.0 → 2.2.1

package/dist/RangeCalendar/RangeCalendarRoot.js

@@ -1,14 +1,14 @@
 import { defineComponent, toRefs, ref, computed, watch, onMounted, createBlock, openBlock, unref, withCtx, createElementVNode, renderSlot, toDisplayString } from 'vue';
 import { useVModel, useEventListener } from '@vueuse/core';
-import { isEqualDay } from '@internationalized/date';
+import { u as useCalendar } from '../Calendar/useCalendar.js';
 import { n as getDefaultDate, b as isBefore } from '../date/comparators.js';
+import { isEqualDay } from '@internationalized/date';
 import { u as useRangeCalendarState } from './useRangeCalendar.js';
-import { u as useCalendar } from '../Calendar/useCalendar.js';
-import { c as createContext } from '../shared/createContext.js';
 import { u as usePrimitiveElement } from '../Primitive/usePrimitiveElement.js';
 import { u as useDirection } from '../shared/useDirection.js';
 import { u as useLocale } from '../shared/useLocale.js';
 import { u as useKbd } from '../shared/useKbd.js';
+import { c as createContext } from '../shared/createContext.js';
 import { P as Primitive } from '../Primitive/Primitive.js';
 import { i as isNullish } from '../shared/nullish.js';
 import { h as handleCalendarInitialFocus } from '../date/utils.js';
@@ -42,6 +42,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     initialFocus: { type: Boolean, default: false },
     isDateDisabled: { type: Function, default: void 0 },
     isDateUnavailable: { type: Function, default: void 0 },
+    isDateHighlightable: { type: Function, default: void 0 },
     dir: {},
     nextPage: {},
     prevPage: {},
@@ -63,6 +64,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       numberOfMonths,
       preventDeselect,
       isDateUnavailable: propsIsDateUnavailable,
+      isDateHighlightable: propsIsDateHighlightable,
       isDateDisabled: propsIsDateDisabled,
       calendarLabel,
       maxValue,
@@ -131,6 +133,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const {
       isInvalid,
       isSelected,
+      isDateHighlightable,
       highlightedRange,
       isSelectionStart,
       isSelectionEnd,
@@ -141,6 +144,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       end: endValue,
       isDateDisabled,
       isDateUnavailable,
+      isDateHighlightable: propsIsDateHighlightable.value,
       focusedValue,
       allowNonContiguousRanges
     });
@@ -188,6 +192,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     provideRangeCalendarRootContext({
       isDateUnavailable,
+      isDateHighlightable,
       startValue,
       endValue,
       formatter,

package/dist/RangeCalendar/RangeCalendarRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"RangeCalendarRoot.js","sources":["../../src/RangeCalendar/RangeCalendarRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { type DateValue, isEqualDay } from '@internationalized/date'\n\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { type Formatter, createContext, isNullish, useDirection, useKbd, useLocale } from '@/shared'\nimport { getDefaultDate, handleCalendarInitialFocus } from '@/shared/date'\nimport { type Grid, type Matcher, type WeekDayFormat, isBefore } from '@/date'\nimport type { DateRange } from '@/shared/date'\nimport { useRangeCalendarState } from './useRangeCalendar'\nimport { useCalendar } from '@/Calendar/useCalendar'\nimport type { Direction } from '@/shared/types'\n\ntype RangeCalendarRootContext = {\n  modelValue: Ref<DateRange>\n  startValue: Ref<DateValue | undefined>\n  endValue: Ref<DateValue | undefined>\n  locale: Ref<string>\n  placeholder: Ref<DateValue>\n  pagedNavigation: Ref<boolean>\n  preventDeselect: Ref<boolean>\n  grid: Ref< Grid<DateValue>[]>\n  weekDays: Ref<string[]>\n  weekStartsOn: Ref<0 | 1 | 2 | 3 | 4 | 5 | 6>\n  weekdayFormat: Ref<WeekDayFormat>\n  fixedWeeks: Ref<boolean>\n  numberOfMonths: Ref<number>\n  disabled: Ref<boolean>\n  readonly: Ref<boolean>\n  initialFocus: Ref<boolean>\n  onPlaceholderChange: (date: DateValue) => void\n  fullCalendarLabel: Ref<string>\n  parentElement: Ref<HTMLElement | undefined>\n  headingValue: Ref<string>\n  isInvalid: Ref<boolean>\n  isDateDisabled: Matcher\n  isDateUnavailable?: Matcher\n  isOutsideVisibleView: (date: DateValue) => boolean\n  highlightedRange: Ref<{ start: DateValue, end: DateValue } | null>\n  focusedValue: Ref<DateValue | undefined>\n  lastPressedDateValue: Ref<DateValue | undefined>\n  isSelected: (date: DateValue) => boolean\n  isSelectionEnd: (date: DateValue) => boolean\n  isSelectionStart: (date: DateValue) => boolean\n  isHighlightedStart: (date: DateValue) => boolean\n  isHighlightedEnd: (date: DateValue) => boolean\n  prevPage: (prevPageFunc?: (date: DateValue) => DateValue) => void\n  nextPage: (nextPageFunc?: (date: DateValue) => DateValue) => void\n  isNextButtonDisabled: (nextPageFunc?: (date: DateValue) => DateValue) => boolean\n  isPrevButtonDisabled: (prevPageFunc?: (date: DateValue) => DateValue) => boolean\n  formatter: Formatter\n  dir: Ref<Direction>\n}\n\nexport interface RangeCalendarRootProps extends PrimitiveProps {\n  /** The default placeholder date */\n  defaultPlaceholder?: DateValue\n  /** The default value for the calendar */\n  defaultValue?: DateRange\n  /** The controlled checked state of the calendar. Can be bound as `v-model`. */\n  modelValue?: DateRange | null\n  /** The placeholder date, which is used to determine what month to display when no date is selected. This updates as the user navigates the calendar and can be used to programmatically control the calendar view */\n  placeholder?: DateValue\n  /** When combined with `isDateUnavailable`, determines whether non-contiguous ranges, i.e. ranges containing unavailable dates, may be selected. */\n  allowNonContiguousRanges?: boolean\n  /** This property causes the previous and next buttons to navigate by the number of months displayed at once, rather than one month */\n  pagedNavigation?: boolean\n  /** Whether or not to prevent the user from deselecting a date without selecting another date first */\n  preventDeselect?: boolean\n  /** The day of the week to start the calendar on */\n  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6\n  /** The format to use for the weekday strings provided via the weekdays slot prop */\n  weekdayFormat?: WeekDayFormat\n  /** The accessible label for the calendar */\n  calendarLabel?: string\n  /** Whether or not to always display 6 weeks in the calendar */\n  fixedWeeks?: boolean\n  /** The maximum date that can be selected */\n  maxValue?: DateValue\n  /** The minimum date that can be selected */\n  minValue?: DateValue\n  /** The locale to use for formatting dates */\n  locale?: string\n  /** The number of months to display at once */\n  numberOfMonths?: number\n  /** Whether or not the calendar is disabled */\n  disabled?: boolean\n  /** Whether or not the calendar is readonly */\n  readonly?: boolean\n  /** If true, the calendar will focus the selected day, today, or the first day of the month depending on what is visible when the calendar is mounted */\n  initialFocus?: boolean\n  /** A function that returns whether or not a date is disabled */\n  isDateDisabled?: Matcher\n  /** A function that returns whether or not a date is unavailable */\n  isDateUnavailable?: Matcher\n  /** The reading direction of the calendar when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** A function that returns the next page of the calendar. It receives the current placeholder as an argument inside the component. */\n  nextPage?: (placeholder: DateValue) => DateValue\n  /** A function that returns the previous page of the calendar. It receives the current placeholder as an argument inside the component. */\n  prevPage?: (placeholder: DateValue) => DateValue\n}\n\nexport type RangeCalendarRootEmits = {\n  /** Event handler called whenever the model value changes */\n  'update:modelValue': [date: DateRange]\n  /** Event handler called whenever the placeholder value changes */\n  'update:placeholder': [date: DateValue]\n  /** Event handler called whenever the start value changes */\n  'update:startValue': [date: DateValue | undefined]\n}\n\nexport const [injectRangeCalendarRootContext, provideRangeCalendarRootContext]\n  = createContext<RangeCalendarRootContext>('RangeCalendarRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, onMounted, ref, toRefs, watch } from 'vue'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\nimport { useEventListener, useVModel } from '@vueuse/core'\n\nconst props = withDefaults(defineProps<RangeCalendarRootProps>(), {\n  defaultValue: () => ({ start: undefined, end: undefined }),\n  as: 'div',\n  pagedNavigation: false,\n  preventDeselect: false,\n  weekStartsOn: 0,\n  weekdayFormat: 'narrow',\n  fixedWeeks: false,\n  numberOfMonths: 1,\n  disabled: false,\n  readonly: false,\n  initialFocus: false,\n  placeholder: undefined,\n  isDateDisabled: undefined,\n  isDateUnavailable: undefined,\n  allowNonContiguousRanges: false,\n})\nconst emits = defineEmits<RangeCalendarRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** The current date of the placeholder */\n    date: DateValue\n    /** The grid of dates */\n    grid: Grid<DateValue>[]\n    /** The days of the week */\n    weekDays: string[]\n    /** The start of the week */\n    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6\n    /** The calendar locale */\n    locale: string\n    /** Whether or not to always display 6 weeks in the calendar */\n    fixedWeeks: boolean\n    /** The current date range */\n    modelValue: DateRange\n  }) => any\n}>()\n\nconst {\n  disabled,\n  readonly,\n  initialFocus,\n  pagedNavigation,\n  weekStartsOn,\n  weekdayFormat,\n  fixedWeeks,\n  numberOfMonths,\n  preventDeselect,\n  isDateUnavailable: propsIsDateUnavailable,\n  isDateDisabled: propsIsDateDisabled,\n  calendarLabel,\n  maxValue,\n  minValue,\n  dir: propDir,\n  locale: propLocale,\n  nextPage: propsNextPage,\n  prevPage: propsPrevPage,\n  allowNonContiguousRanges,\n} = toRefs(props)\n\nconst { primitiveElement, currentElement: parentElement }\n  = usePrimitiveElement()\nconst dir = useDirection(propDir)\nconst locale = useLocale(propLocale)\n\nconst lastPressedDateValue = ref() as Ref<DateValue | undefined>\nconst focusedValue = ref() as Ref<DateValue | undefined>\nconst isEditing = ref(false)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: props.defaultValue ?? { start: undefined, end: undefined },\n  passive: (props.modelValue === undefined) as false,\n}) as Ref<DateRange>\n\nconst currentModelValue = computed(() => isNullish(modelValue.value) ? { start: undefined, end: undefined } : modelValue.value)\n\nconst defaultDate = getDefaultDate({\n  defaultPlaceholder: props.placeholder,\n  defaultValue: currentModelValue.value.start,\n  locale: props.locale,\n})\n\nconst startValue = ref(currentModelValue.value.start) as Ref<DateValue | undefined>\nconst endValue = ref(currentModelValue.value.end) as Ref<DateValue | undefined>\n\nconst placeholder = useVModel(props, 'placeholder', emits, {\n  defaultValue: props.defaultPlaceholder ?? defaultDate.copy(),\n  passive: (props.placeholder === undefined) as false,\n}) as Ref<DateValue>\n\nfunction onPlaceholderChange(value: DateValue) {\n  placeholder.value = value.copy()\n}\n\nconst {\n  fullCalendarLabel,\n  headingValue,\n  isDateDisabled,\n  isDateUnavailable,\n  isNextButtonDisabled,\n  isPrevButtonDisabled,\n  grid,\n  weekdays,\n  isOutsideVisibleView,\n  nextPage,\n  prevPage,\n  formatter,\n} = useCalendar({\n  locale,\n  placeholder,\n  weekStartsOn,\n  fixedWeeks,\n  numberOfMonths,\n  minValue,\n  maxValue,\n  disabled,\n  weekdayFormat,\n  pagedNavigation,\n  isDateDisabled: propsIsDateDisabled.value,\n  isDateUnavailable: propsIsDateUnavailable.value,\n  calendarLabel,\n  nextPage: propsNextPage,\n  prevPage: propsPrevPage,\n})\n\nconst {\n  isInvalid,\n  isSelected,\n  highlightedRange,\n  isSelectionStart,\n  isSelectionEnd,\n  isHighlightedStart,\n  isHighlightedEnd,\n} = useRangeCalendarState({\n  start: startValue,\n  end: endValue,\n  isDateDisabled,\n  isDateUnavailable,\n  focusedValue,\n  allowNonContiguousRanges,\n})\n\nwatch(modelValue, (_modelValue, _prevValue) => {\n  if ((!_prevValue?.start && _modelValue?.start)\n    || !_modelValue\n    || !_modelValue.start\n    || (startValue.value && !isEqualDay(_modelValue.start, startValue.value))\n  ) {\n    startValue.value = _modelValue?.start?.copy?.()\n  }\n\n  if ((!_prevValue?.end && _modelValue.end)\n    || !_modelValue\n    || !_modelValue.end\n    || (endValue.value && !isEqualDay(_modelValue.end, endValue.value))\n  ) {\n    endValue.value = _modelValue?.end?.copy?.()\n  }\n})\n\nwatch(startValue, (_startValue) => {\n  if (_startValue && !isEqualDay(_startValue, placeholder.value))\n    onPlaceholderChange(_startValue)\n\n  emits('update:startValue', _startValue)\n})\n\nwatch([startValue, endValue], ([_startValue, _endValue]) => {\n  const value = currentModelValue.value\n\n  if (value && value.start && value.end && _startValue && _endValue && isEqualDay(value.start, _startValue) && isEqualDay(value.end, _endValue))\n    return\n\n  isEditing.value = true\n  if (_startValue && _endValue) {\n    isEditing.value = false\n    if (value.start && value.end && isEqualDay(value.start, _startValue) && isEqualDay(value.end, _endValue))\n      return\n    if (isBefore(_endValue, _startValue)) {\n      modelValue.value = {\n        start: _endValue.copy(),\n        end: _startValue.copy(),\n      }\n    }\n    else {\n      modelValue.value = {\n        start: _startValue.copy(),\n        end: _endValue.copy(),\n      }\n    }\n  }\n})\n\nconst kbd = useKbd()\nuseEventListener('keydown', (ev) => {\n  if (ev.key === kbd.ESCAPE && isEditing.value) {\n    // Abort start and end selection\n    startValue.value = modelValue.value.start?.copy()\n    endValue.value = modelValue.value.end?.copy()\n  }\n})\n\nprovideRangeCalendarRootContext({\n  isDateUnavailable,\n  startValue,\n  endValue,\n  formatter,\n  modelValue,\n  placeholder,\n  disabled,\n  initialFocus,\n  pagedNavigation,\n  grid,\n  weekDays: weekdays,\n  weekStartsOn,\n  weekdayFormat,\n  fixedWeeks,\n  numberOfMonths,\n  readonly,\n  preventDeselect,\n  fullCalendarLabel,\n  headingValue,\n  isInvalid,\n  isDateDisabled,\n  highlightedRange,\n  focusedValue,\n  lastPressedDateValue,\n  isSelected,\n  isSelectionEnd,\n  isSelectionStart,\n  isNextButtonDisabled,\n  isPrevButtonDisabled,\n  isOutsideVisibleView,\n  nextPage,\n  prevPage,\n  parentElement,\n  onPlaceholderChange,\n  locale,\n  dir,\n  isHighlightedStart,\n  isHighlightedEnd,\n})\n\nonMounted(() => {\n  if (initialFocus.value)\n    handleCalendarInitialFocus(parentElement.value)\n})\n</script>\n\n<template>\n  <Primitive\n    ref=\"primitiveElement\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    role=\"application\"\n    :aria-label=\"fullCalendarLabel\"\n    :data-readonly=\"readonly ? '' : undefined\"\n    :data-disabled=\"disabled ? '' : undefined\"\n    :data-invalid=\"isInvalid ? '' : undefined\"\n    :dir=\"dir\"\n  >\n    <div style=\"border: 0px; clip: rect(0px, 0px, 0px, 0px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; white-space: nowrap; width: 1px;\">\n      <div\n        role=\"heading\"\n        aria-level=\"2\"\n      >\n        {{ fullCalendarLabel }}\n      </div>\n    </div>\n\n    <slot\n      :date=\"placeholder\"\n      :grid=\"grid\"\n      :week-days=\"weekdays\"\n      :week-starts-on=\"weekStartsOn\"\n      :locale=\"locale\"\n      :fixed-weeks=\"fixedWeeks\"\n      :model-value=\"modelValue\"\n    />\n  </Primitive>\n</template>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"RangeCalendarRoot.js","sources":["../../src/RangeCalendar/RangeCalendarRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Grid, Matcher, WeekDayFormat } from '@/date'\n\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Formatter } from '@/shared'\nimport type { DateRange } from '@/shared/date'\nimport type { Direction } from '@/shared/types'\nimport type { DateValue } from '@internationalized/date'\nimport type { Ref } from 'vue'\nimport { useCalendar } from '@/Calendar/useCalendar'\nimport { isBefore } from '@/date'\nimport { createContext, isNullish, useDirection, useKbd, useLocale } from '@/shared'\nimport { getDefaultDate, handleCalendarInitialFocus } from '@/shared/date'\nimport { isEqualDay } from '@internationalized/date'\nimport { useRangeCalendarState } from './useRangeCalendar'\n\ntype RangeCalendarRootContext = {\n  modelValue: Ref<DateRange>\n  startValue: Ref<DateValue | undefined>\n  endValue: Ref<DateValue | undefined>\n  locale: Ref<string>\n  placeholder: Ref<DateValue>\n  pagedNavigation: Ref<boolean>\n  preventDeselect: Ref<boolean>\n  grid: Ref<Grid<DateValue>[]>\n  weekDays: Ref<string[]>\n  weekStartsOn: Ref<0 | 1 | 2 | 3 | 4 | 5 | 6>\n  weekdayFormat: Ref<WeekDayFormat>\n  fixedWeeks: Ref<boolean>\n  numberOfMonths: Ref<number>\n  disabled: Ref<boolean>\n  readonly: Ref<boolean>\n  initialFocus: Ref<boolean>\n  onPlaceholderChange: (date: DateValue) => void\n  fullCalendarLabel: Ref<string>\n  parentElement: Ref<HTMLElement | undefined>\n  headingValue: Ref<string>\n  isInvalid: Ref<boolean>\n  isDateDisabled: Matcher\n  isDateUnavailable?: Matcher\n  isDateHighlightable?: Matcher\n  isOutsideVisibleView: (date: DateValue) => boolean\n  highlightedRange: Ref<{ start: DateValue, end: DateValue } | null>\n  focusedValue: Ref<DateValue | undefined>\n  lastPressedDateValue: Ref<DateValue | undefined>\n  isSelected: (date: DateValue) => boolean\n  isSelectionEnd: (date: DateValue) => boolean\n  isSelectionStart: (date: DateValue) => boolean\n  isHighlightedStart: (date: DateValue) => boolean\n  isHighlightedEnd: (date: DateValue) => boolean\n  prevPage: (prevPageFunc?: (date: DateValue) => DateValue) => void\n  nextPage: (nextPageFunc?: (date: DateValue) => DateValue) => void\n  isNextButtonDisabled: (nextPageFunc?: (date: DateValue) => DateValue) => boolean\n  isPrevButtonDisabled: (prevPageFunc?: (date: DateValue) => DateValue) => boolean\n  formatter: Formatter\n  dir: Ref<Direction>\n}\n\nexport interface RangeCalendarRootProps extends PrimitiveProps {\n  /** The default placeholder date */\n  defaultPlaceholder?: DateValue\n  /** The default value for the calendar */\n  defaultValue?: DateRange\n  /** The controlled checked state of the calendar. Can be bound as `v-model`. */\n  modelValue?: DateRange | null\n  /** The placeholder date, which is used to determine what month to display when no date is selected. This updates as the user navigates the calendar and can be used to programmatically control the calendar view */\n  placeholder?: DateValue\n  /** When combined with `isDateUnavailable`, determines whether non-contiguous ranges, i.e. ranges containing unavailable dates, may be selected. */\n  allowNonContiguousRanges?: boolean\n  /** This property causes the previous and next buttons to navigate by the number of months displayed at once, rather than one month */\n  pagedNavigation?: boolean\n  /** Whether or not to prevent the user from deselecting a date without selecting another date first */\n  preventDeselect?: boolean\n  /** The day of the week to start the calendar on */\n  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6\n  /** The format to use for the weekday strings provided via the weekdays slot prop */\n  weekdayFormat?: WeekDayFormat\n  /** The accessible label for the calendar */\n  calendarLabel?: string\n  /** Whether or not to always display 6 weeks in the calendar */\n  fixedWeeks?: boolean\n  /** The maximum date that can be selected */\n  maxValue?: DateValue\n  /** The minimum date that can be selected */\n  minValue?: DateValue\n  /** The locale to use for formatting dates */\n  locale?: string\n  /** The number of months to display at once */\n  numberOfMonths?: number\n  /** Whether or not the calendar is disabled */\n  disabled?: boolean\n  /** Whether or not the calendar is readonly */\n  readonly?: boolean\n  /** If true, the calendar will focus the selected day, today, or the first day of the month depending on what is visible when the calendar is mounted */\n  initialFocus?: boolean\n  /** A function that returns whether or not a date is disabled */\n  isDateDisabled?: Matcher\n  /** A function that returns whether or not a date is unavailable */\n  isDateUnavailable?: Matcher\n  /** A function that returns whether or not a date is hightable */\n  isDateHighlightable?: Matcher\n  /** The reading direction of the calendar when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** A function that returns the next page of the calendar. It receives the current placeholder as an argument inside the component. */\n  nextPage?: (placeholder: DateValue) => DateValue\n  /** A function that returns the previous page of the calendar. It receives the current placeholder as an argument inside the component. */\n  prevPage?: (placeholder: DateValue) => DateValue\n}\n\nexport type RangeCalendarRootEmits = {\n  /** Event handler called whenever the model value changes */\n  'update:modelValue': [date: DateRange]\n  /** Event handler called whenever the placeholder value changes */\n  'update:placeholder': [date: DateValue]\n  /** Event handler called whenever the start value changes */\n  'update:startValue': [date: DateValue | undefined]\n}\n\nexport const [injectRangeCalendarRootContext, provideRangeCalendarRootContext]\n  = createContext<RangeCalendarRootContext>('RangeCalendarRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\nimport { useEventListener, useVModel } from '@vueuse/core'\nimport { computed, onMounted, ref, toRefs, watch } from 'vue'\n\nconst props = withDefaults(defineProps<RangeCalendarRootProps>(), {\n  defaultValue: () => ({ start: undefined, end: undefined }),\n  as: 'div',\n  pagedNavigation: false,\n  preventDeselect: false,\n  weekStartsOn: 0,\n  weekdayFormat: 'narrow',\n  fixedWeeks: false,\n  numberOfMonths: 1,\n  disabled: false,\n  readonly: false,\n  initialFocus: false,\n  placeholder: undefined,\n  isDateDisabled: undefined,\n  isDateUnavailable: undefined,\n  isDateHighlightable: undefined,\n  allowNonContiguousRanges: false,\n})\nconst emits = defineEmits<RangeCalendarRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** The current date of the placeholder */\n    date: DateValue\n    /** The grid of dates */\n    grid: Grid<DateValue>[]\n    /** The days of the week */\n    weekDays: string[]\n    /** The start of the week */\n    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6\n    /** The calendar locale */\n    locale: string\n    /** Whether or not to always display 6 weeks in the calendar */\n    fixedWeeks: boolean\n    /** The current date range */\n    modelValue: DateRange\n  }) => any\n}>()\n\nconst {\n  disabled,\n  readonly,\n  initialFocus,\n  pagedNavigation,\n  weekStartsOn,\n  weekdayFormat,\n  fixedWeeks,\n  numberOfMonths,\n  preventDeselect,\n  isDateUnavailable: propsIsDateUnavailable,\n  isDateHighlightable: propsIsDateHighlightable,\n  isDateDisabled: propsIsDateDisabled,\n  calendarLabel,\n  maxValue,\n  minValue,\n  dir: propDir,\n  locale: propLocale,\n  nextPage: propsNextPage,\n  prevPage: propsPrevPage,\n  allowNonContiguousRanges,\n} = toRefs(props)\n\nconst { primitiveElement, currentElement: parentElement }\n  = usePrimitiveElement()\nconst dir = useDirection(propDir)\nconst locale = useLocale(propLocale)\n\nconst lastPressedDateValue = ref() as Ref<DateValue | undefined>\nconst focusedValue = ref() as Ref<DateValue | undefined>\nconst isEditing = ref(false)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: props.defaultValue ?? { start: undefined, end: undefined },\n  passive: (props.modelValue === undefined) as false,\n}) as Ref<DateRange>\n\nconst currentModelValue = computed(() => isNullish(modelValue.value) ? { start: undefined, end: undefined } : modelValue.value)\n\nconst defaultDate = getDefaultDate({\n  defaultPlaceholder: props.placeholder,\n  defaultValue: currentModelValue.value.start,\n  locale: props.locale,\n})\n\nconst startValue = ref(currentModelValue.value.start) as Ref<DateValue | undefined>\nconst endValue = ref(currentModelValue.value.end) as Ref<DateValue | undefined>\n\nconst placeholder = useVModel(props, 'placeholder', emits, {\n  defaultValue: props.defaultPlaceholder ?? defaultDate.copy(),\n  passive: (props.placeholder === undefined) as false,\n}) as Ref<DateValue>\n\nfunction onPlaceholderChange(value: DateValue) {\n  placeholder.value = value.copy()\n}\n\nconst {\n  fullCalendarLabel,\n  headingValue,\n  isDateDisabled,\n  isDateUnavailable,\n  isNextButtonDisabled,\n  isPrevButtonDisabled,\n  grid,\n  weekdays,\n  isOutsideVisibleView,\n  nextPage,\n  prevPage,\n  formatter,\n} = useCalendar({\n  locale,\n  placeholder,\n  weekStartsOn,\n  fixedWeeks,\n  numberOfMonths,\n  minValue,\n  maxValue,\n  disabled,\n  weekdayFormat,\n  pagedNavigation,\n  isDateDisabled: propsIsDateDisabled.value,\n  isDateUnavailable: propsIsDateUnavailable.value,\n  calendarLabel,\n  nextPage: propsNextPage,\n  prevPage: propsPrevPage,\n})\n\nconst {\n  isInvalid,\n  isSelected,\n  isDateHighlightable,\n  highlightedRange,\n  isSelectionStart,\n  isSelectionEnd,\n  isHighlightedStart,\n  isHighlightedEnd,\n} = useRangeCalendarState({\n  start: startValue,\n  end: endValue,\n  isDateDisabled,\n  isDateUnavailable,\n  isDateHighlightable: propsIsDateHighlightable.value,\n  focusedValue,\n  allowNonContiguousRanges,\n})\n\nwatch(modelValue, (_modelValue, _prevValue) => {\n  if ((!_prevValue?.start && _modelValue?.start)\n    || !_modelValue\n    || !_modelValue.start\n    || (startValue.value && !isEqualDay(_modelValue.start, startValue.value))\n  ) {\n    startValue.value = _modelValue?.start?.copy?.()\n  }\n\n  if ((!_prevValue?.end && _modelValue.end)\n    || !_modelValue\n    || !_modelValue.end\n    || (endValue.value && !isEqualDay(_modelValue.end, endValue.value))\n  ) {\n    endValue.value = _modelValue?.end?.copy?.()\n  }\n})\n\nwatch(startValue, (_startValue) => {\n  if (_startValue && !isEqualDay(_startValue, placeholder.value))\n    onPlaceholderChange(_startValue)\n\n  emits('update:startValue', _startValue)\n})\n\nwatch([startValue, endValue], ([_startValue, _endValue]) => {\n  const value = currentModelValue.value\n\n  if (value && value.start && value.end && _startValue && _endValue && isEqualDay(value.start, _startValue) && isEqualDay(value.end, _endValue))\n    return\n\n  isEditing.value = true\n  if (_startValue && _endValue) {\n    isEditing.value = false\n    if (value.start && value.end && isEqualDay(value.start, _startValue) && isEqualDay(value.end, _endValue))\n      return\n    if (isBefore(_endValue, _startValue)) {\n      modelValue.value = {\n        start: _endValue.copy(),\n        end: _startValue.copy(),\n      }\n    }\n    else {\n      modelValue.value = {\n        start: _startValue.copy(),\n        end: _endValue.copy(),\n      }\n    }\n  }\n})\n\nconst kbd = useKbd()\nuseEventListener('keydown', (ev) => {\n  if (ev.key === kbd.ESCAPE && isEditing.value) {\n    // Abort start and end selection\n    startValue.value = modelValue.value.start?.copy()\n    endValue.value = modelValue.value.end?.copy()\n  }\n})\n\nprovideRangeCalendarRootContext({\n  isDateUnavailable,\n  isDateHighlightable,\n  startValue,\n  endValue,\n  formatter,\n  modelValue,\n  placeholder,\n  disabled,\n  initialFocus,\n  pagedNavigation,\n  grid,\n  weekDays: weekdays,\n  weekStartsOn,\n  weekdayFormat,\n  fixedWeeks,\n  numberOfMonths,\n  readonly,\n  preventDeselect,\n  fullCalendarLabel,\n  headingValue,\n  isInvalid,\n  isDateDisabled,\n  highlightedRange,\n  focusedValue,\n  lastPressedDateValue,\n  isSelected,\n  isSelectionEnd,\n  isSelectionStart,\n  isNextButtonDisabled,\n  isPrevButtonDisabled,\n  isOutsideVisibleView,\n  nextPage,\n  prevPage,\n  parentElement,\n  onPlaceholderChange,\n  locale,\n  dir,\n  isHighlightedStart,\n  isHighlightedEnd,\n})\n\nonMounted(() => {\n  if (initialFocus.value)\n    handleCalendarInitialFocus(parentElement.value)\n})\n</script>\n\n<template>\n  <Primitive\n    ref=\"primitiveElement\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    role=\"application\"\n    :aria-label=\"fullCalendarLabel\"\n    :data-readonly=\"readonly ? '' : undefined\"\n    :data-disabled=\"disabled ? '' : undefined\"\n    :data-invalid=\"isInvalid ? '' : undefined\"\n    :dir=\"dir\"\n  >\n    <div style=\"border: 0px; clip: rect(0px, 0px, 0px, 0px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; white-space: nowrap; width: 1px;\">\n      <div\n        role=\"heading\"\n        aria-level=\"2\"\n      >\n        {{ fullCalendarLabel }}\n      </div>\n    </div>\n\n    <slot\n      :date=\"placeholder\"\n      :grid=\"grid\"\n      :week-days=\"weekdays\"\n      :week-starts-on=\"weekStartsOn\"\n      :locale=\"locale\"\n      :fixed-weeks=\"fixedWeeks\"\n      :model-value=\"modelValue\"\n    />\n  </Primitive>\n</template>\n"],"names":[],"mappings":"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"}

package/dist/RangeCalendar/useRangeCalendar.cjs

@@ -1,8 +1,8 @@
 'use strict';
 
+const date_comparators = require('../date/comparators.cjs');
 const date = require('@internationalized/date');
 const vue = require('vue');
-const date_comparators = require('../date/comparators.cjs');
 
 function useRangeCalendarState(props) {
   const isStartInvalid = vue.computed(() => {
@@ -47,6 +47,11 @@ function useRangeCalendarState(props) {
       return date_comparators.isBetween(date$1, props.start.value, props.end.value);
     return false;
   };
+  const isDateHighlightable = (date) => {
+    if (props.isDateHighlightable?.(date))
+      return true;
+    return false;
+  };
   const highlightedRange = vue.computed(() => {
     if (props.start.value && props.end.value)
       return null;
@@ -61,7 +66,7 @@ function useRangeCalendarState(props) {
         end
       };
     }
-    const isValid = props.allowNonContiguousRanges.value || date_comparators.areAllDaysBetweenValid(start, end, props.isDateUnavailable, props.isDateDisabled);
+    const isValid = date_comparators.areAllDaysBetweenValid(start, end, props.allowNonContiguousRanges.value ? () => false : props.isDateUnavailable, props.isDateDisabled, props.isDateHighlightable);
     if (isValid) {
       return {
         start,
@@ -83,6 +88,7 @@ function useRangeCalendarState(props) {
   return {
     isInvalid,
     isSelected,
+    isDateHighlightable,
     highlightedRange,
     isSelectionStart,
     isSelectionEnd,

package/dist/RangeCalendar/useRangeCalendar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useRangeCalendar.cjs","sources":["../../src/RangeCalendar/useRangeCalendar.ts"],"sourcesContent":["/*\n  * Adapted from https://github.com/melt-ui/melt-ui/blob/develop/src/lib/builders/range-calendar/create.ts\n*/\n\nimport { type DateValue, isSameDay } from '@internationalized/date'\nimport { type Ref, computed } from 'vue'\nimport { type Matcher, areAllDaysBetweenValid, isBefore, isBetween } from '@/date'\n\nexport type UseRangeCalendarProps = {\n  start: Ref<DateValue | undefined>\n  end: Ref<DateValue | undefined>\n  isDateDisabled: Matcher\n  isDateUnavailable: Matcher\n  focusedValue: Ref<DateValue | undefined>\n  allowNonContiguousRanges: Ref<boolean>\n}\n\nexport function useRangeCalendarState(props: UseRangeCalendarProps) {\n  const isStartInvalid = computed(() => {\n    if (!props.start.value)\n      return false\n    if (props.isDateDisabled(props.start.value))\n      return true\n    return false\n  })\n\n  const isEndInvalid = computed(() => {\n    if (!props.end.value)\n      return false\n    if (props.isDateDisabled(props.end.value))\n      return true\n    return false\n  })\n\n  const isInvalid = computed(\n    () => {\n      if (isStartInvalid.value || isEndInvalid.value)\n        return false\n      if (props.start.value && props.end.value && isBefore(props.end.value, props.start.value))\n        return true\n      return false\n    },\n  )\n\n  const isSelectionStart = (date: DateValue) => {\n    if (!props.start.value)\n      return false\n    return isSameDay(props.start.value, date)\n  }\n\n  const isSelectionEnd = (date: DateValue) => {\n    if (!props.end.value)\n      return false\n    return isSameDay(props.end.value, date)\n  }\n\n  const isSelected = (date: DateValue) => {\n    if (props.start.value && isSameDay(props.start.value, date))\n      return true\n    if (props.end.value && isSameDay(props.end.value, date))\n      return true\n    if (props.end.value && props.start.value)\n      return isBetween(date, props.start.value, props.end.value)\n\n    return false\n  }\n\n  const highlightedRange = computed(() => {\n    if (props.start.value && props.end.value)\n      return null\n    if (!props.start.value || !props.focusedValue.value)\n      return null\n\n    const isStartBeforeFocused = isBefore(props.start.value, props.focusedValue.value)\n    const start = isStartBeforeFocused ? props.start.value : props.focusedValue.value\n    const end = isStartBeforeFocused ? props.focusedValue.value : props.start.value\n\n    if (isSameDay(start, end)) {\n      return {\n        start,\n        end,\n      }\n    }\n\n    const isValid = props.allowNonContiguousRanges.value || areAllDaysBetweenValid(start, end, props.isDateUnavailable, props.isDateDisabled)\n    if (isValid) {\n      return {\n        start,\n        end,\n      }\n    }\n    return null\n  })\n\n  const isHighlightedStart = (date: DateValue) => {\n    if (!highlightedRange.value || !highlightedRange.value.start)\n      return false\n    return isSameDay(highlightedRange.value.start, date)\n  }\n\n  const isHighlightedEnd = (date: DateValue) => {\n    if (!highlightedRange.value || !highlightedRange.value.end)\n      return false\n    return isSameDay(highlightedRange.value.end, date)\n  }\n\n  return {\n    isInvalid,\n    isSelected,\n    highlightedRange,\n    isSelectionStart,\n    isSelectionEnd,\n    isHighlightedStart,\n    isHighlightedEnd,\n  }\n}\n"],"names":["computed","isBefore","date","isSameDay","isBetween","areAllDaysBetweenValid"],"mappings":"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"}
+{"version":3,"file":"useRangeCalendar.cjs","sources":["../../src/RangeCalendar/useRangeCalendar.ts"],"sourcesContent":["/*\n  * Adapted from https://github.com/melt-ui/melt-ui/blob/develop/src/lib/builders/range-calendar/create.ts\n*/\n\nimport type { Matcher } from '@/date'\nimport type { DateValue } from '@internationalized/date'\nimport type { Ref } from 'vue'\nimport { areAllDaysBetweenValid, isBefore, isBetween } from '@/date'\nimport { isSameDay } from '@internationalized/date'\nimport { computed } from 'vue'\n\nexport type UseRangeCalendarProps = {\n  start: Ref<DateValue | undefined>\n  end: Ref<DateValue | undefined>\n  isDateDisabled: Matcher\n  isDateUnavailable: Matcher\n  isDateHighlightable?: Matcher\n  focusedValue: Ref<DateValue | undefined>\n  allowNonContiguousRanges: Ref<boolean>\n}\n\nexport function useRangeCalendarState(props: UseRangeCalendarProps) {\n  const isStartInvalid = computed(() => {\n    if (!props.start.value)\n      return false\n    if (props.isDateDisabled(props.start.value))\n      return true\n    return false\n  })\n\n  const isEndInvalid = computed(() => {\n    if (!props.end.value)\n      return false\n    if (props.isDateDisabled(props.end.value))\n      return true\n    return false\n  })\n\n  const isInvalid = computed(\n    () => {\n      if (isStartInvalid.value || isEndInvalid.value)\n        return false\n      if (props.start.value && props.end.value && isBefore(props.end.value, props.start.value))\n        return true\n      return false\n    },\n  )\n\n  const isSelectionStart = (date: DateValue) => {\n    if (!props.start.value)\n      return false\n    return isSameDay(props.start.value, date)\n  }\n\n  const isSelectionEnd = (date: DateValue) => {\n    if (!props.end.value)\n      return false\n    return isSameDay(props.end.value, date)\n  }\n\n  const isSelected = (date: DateValue) => {\n    if (props.start.value && isSameDay(props.start.value, date))\n      return true\n    if (props.end.value && isSameDay(props.end.value, date))\n      return true\n    if (props.end.value && props.start.value)\n      return isBetween(date, props.start.value, props.end.value)\n\n    return false\n  }\n\n  const isDateHighlightable = (date: DateValue) => {\n    if (props.isDateHighlightable?.(date))\n      return true\n    return false\n  }\n\n  const highlightedRange = computed(() => {\n    if (props.start.value && props.end.value)\n      return null\n    if (!props.start.value || !props.focusedValue.value)\n      return null\n\n    const isStartBeforeFocused = isBefore(props.start.value, props.focusedValue.value)\n    const start = isStartBeforeFocused ? props.start.value : props.focusedValue.value\n    const end = isStartBeforeFocused ? props.focusedValue.value : props.start.value\n\n    if (isSameDay(start, end)) {\n      return {\n        start,\n        end,\n      }\n    }\n\n    const isValid = areAllDaysBetweenValid(start, end, props.allowNonContiguousRanges.value ? () => false : props.isDateUnavailable, props.isDateDisabled, props.isDateHighlightable)\n    if (isValid) {\n      return {\n        start,\n        end,\n      }\n    }\n    return null\n  })\n\n  const isHighlightedStart = (date: DateValue) => {\n    if (!highlightedRange.value || !highlightedRange.value.start)\n      return false\n    return isSameDay(highlightedRange.value.start, date)\n  }\n\n  const isHighlightedEnd = (date: DateValue) => {\n    if (!highlightedRange.value || !highlightedRange.value.end)\n      return false\n    return isSameDay(highlightedRange.value.end, date)\n  }\n\n  return {\n    isInvalid,\n    isSelected,\n    isDateHighlightable,\n    highlightedRange,\n    isSelectionStart,\n    isSelectionEnd,\n    isHighlightedStart,\n    isHighlightedEnd,\n  }\n}\n"],"names":["computed","isBefore","date","isSameDay","isBetween","areAllDaysBetweenValid"],"mappings":";;;;;;AAqBO,SAAS,sBAAsB,KAA8B,EAAA;AAClE,EAAM,MAAA,cAAA,GAAiBA,aAAS,MAAM;AACpC,IAAI,IAAA,CAAC,MAAM,KAAM,CAAA,KAAA;AACf,MAAO,OAAA,KAAA;AACT,IAAA,IAAI,KAAM,CAAA,cAAA,CAAe,KAAM,CAAA,KAAA,CAAM,KAAK,CAAA;AACxC,MAAO,OAAA,IAAA;AACT,IAAO,OAAA,KAAA;AAAA,GACR,CAAA;AAED,EAAM,MAAA,YAAA,GAAeA,aAAS,MAAM;AAClC,IAAI,IAAA,CAAC,MAAM,GAAI,CAAA,KAAA;AACb,MAAO,OAAA,KAAA;AACT,IAAA,IAAI,KAAM,CAAA,cAAA,CAAe,KAAM,CAAA,GAAA,CAAI,KAAK,CAAA;AACtC,MAAO,OAAA,IAAA;AACT,IAAO,OAAA,KAAA;AAAA,GACR,CAAA;AAED,EAAA,MAAM,SAAY,GAAAA,YAAA;AAAA,IAChB,MAAM;AACJ,MAAI,IAAA,cAAA,CAAe,SAAS,YAAa,CAAA,KAAA;AACvC,QAAO,OAAA,KAAA;AACT,MAAA,IAAI,KAAM,CAAA,KAAA,CAAM,KAAS,IAAA,KAAA,CAAM,GAAI,CAAA,KAAA,IAASC,yBAAS,CAAA,KAAA,CAAM,GAAI,CAAA,KAAA,EAAO,KAAM,CAAA,KAAA,CAAM,KAAK,CAAA;AACrF,QAAO,OAAA,IAAA;AACT,MAAO,OAAA,KAAA;AAAA;AACT,GACF;AAEA,EAAM,MAAA,gBAAA,GAAmB,CAACC,MAAoB,KAAA;AAC5C,IAAI,IAAA,CAAC,MAAM,KAAM,CAAA,KAAA;AACf,MAAO,OAAA,KAAA;AACT,IAAA,OAAOC,cAAU,CAAA,KAAA,CAAM,KAAM,CAAA,KAAA,EAAOD,MAAI,CAAA;AAAA,GAC1C;AAEA,EAAM,MAAA,cAAA,GAAiB,CAACA,MAAoB,KAAA;AAC1C,IAAI,IAAA,CAAC,MAAM,GAAI,CAAA,KAAA;AACb,MAAO,OAAA,KAAA;AACT,IAAA,OAAOC,cAAU,CAAA,KAAA,CAAM,GAAI,CAAA,KAAA,EAAOD,MAAI,CAAA;AAAA,GACxC;AAEA,EAAM,MAAA,UAAA,GAAa,CAACA,MAAoB,KAAA;AACtC,IAAA,IAAI,MAAM,KAAM,CAAA,KAAA,IAASC,eAAU,KAAM,CAAA,KAAA,CAAM,OAAOD,MAAI,CAAA;AACxD,MAAO,OAAA,IAAA;AACT,IAAA,IAAI,MAAM,GAAI,CAAA,KAAA,IAASC,eAAU,KAAM,CAAA,GAAA,CAAI,OAAOD,MAAI,CAAA;AACpD,MAAO,OAAA,IAAA;AACT,IAAA,IAAI,KAAM,CAAA,GAAA,CAAI,KAAS,IAAA,KAAA,CAAM,KAAM,CAAA,KAAA;AACjC,MAAA,OAAOE,2BAAUF,MAAM,EAAA,KAAA,CAAM,MAAM,KAAO,EAAA,KAAA,CAAM,IAAI,KAAK,CAAA;AAE3D,IAAO,OAAA,KAAA;AAAA,GACT;AAEA,EAAM,MAAA,mBAAA,GAAsB,CAAC,IAAoB,KAAA;AAC/C,IAAI,IAAA,KAAA,CAAM,sBAAsB,IAAI,CAAA;AAClC,MAAO,OAAA,IAAA;AACT,IAAO,OAAA,KAAA;AAAA,GACT;AAEA,EAAM,MAAA,gBAAA,GAAmBF,aAAS,MAAM;AACtC,IAAA,IAAI,KAAM,CAAA,KAAA,CAAM,KAAS,IAAA,KAAA,CAAM,GAAI,CAAA,KAAA;AACjC,MAAO,OAAA,IAAA;AACT,IAAA,IAAI,CAAC,KAAM,CAAA,KAAA,CAAM,KAAS,IAAA,CAAC,MAAM,YAAa,CAAA,KAAA;AAC5C,MAAO,OAAA,IAAA;AAET,IAAA,MAAM,uBAAuBC,yBAAS,CAAA,KAAA,CAAM,MAAM,KAAO,EAAA,KAAA,CAAM,aAAa,KAAK,CAAA;AACjF,IAAA,MAAM,QAAQ,oBAAuB,GAAA,KAAA,CAAM,KAAM,CAAA,KAAA,GAAQ,MAAM,YAAa,CAAA,KAAA;AAC5E,IAAA,MAAM,MAAM,oBAAuB,GAAA,KAAA,CAAM,YAAa,CAAA,KAAA,GAAQ,MAAM,KAAM,CAAA,KAAA;AAE1E,IAAI,IAAAE,cAAA,CAAU,KAAO,EAAA,GAAG,CAAG,EAAA;AACzB,MAAO,OAAA;AAAA,QACL,KAAA;AAAA,QACA;AAAA,OACF;AAAA;AAGF,IAAA,MAAM,OAAU,GAAAE,uCAAA,CAAuB,KAAO,EAAA,GAAA,EAAK,MAAM,wBAAyB,CAAA,KAAA,GAAQ,MAAM,KAAA,GAAQ,KAAM,CAAA,iBAAA,EAAmB,KAAM,CAAA,cAAA,EAAgB,MAAM,mBAAmB,CAAA;AAChL,IAAA,IAAI,OAAS,EAAA;AACX,MAAO,OAAA;AAAA,QACL,KAAA;AAAA,QACA;AAAA,OACF;AAAA;AAEF,IAAO,OAAA,IAAA;AAAA,GACR,CAAA;AAED,EAAM,MAAA,kBAAA,GAAqB,CAACH,MAAoB,KAAA;AAC9C,IAAA,IAAI,CAAC,gBAAA,CAAiB,KAAS,IAAA,CAAC,iBAAiB,KAAM,CAAA,KAAA;AACrD,MAAO,OAAA,KAAA;AACT,IAAA,OAAOC,cAAU,CAAA,gBAAA,CAAiB,KAAM,CAAA,KAAA,EAAOD,MAAI,CAAA;AAAA,GACrD;AAEA,EAAM,MAAA,gBAAA,GAAmB,CAACA,MAAoB,KAAA;AAC5C,IAAA,IAAI,CAAC,gBAAA,CAAiB,KAAS,IAAA,CAAC,iBAAiB,KAAM,CAAA,GAAA;AACrD,MAAO,OAAA,KAAA;AACT,IAAA,OAAOC,cAAU,CAAA,gBAAA,CAAiB,KAAM,CAAA,GAAA,EAAKD,MAAI,CAAA;AAAA,GACnD;AAEA,EAAO,OAAA;AAAA,IACL,SAAA;AAAA,IACA,UAAA;AAAA,IACA,mBAAA;AAAA,IACA,gBAAA;AAAA,IACA,gBAAA;AAAA,IACA,cAAA;AAAA,IACA,kBAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}

package/dist/RangeCalendar/useRangeCalendar.js

@@ -1,6 +1,6 @@
+import { b as isBefore, m as areAllDaysBetweenValid, j as isBetween } from '../date/comparators.js';
 import { isSameDay } from '@internationalized/date';
 import { computed } from 'vue';
-import { b as isBefore, m as areAllDaysBetweenValid, j as isBetween } from '../date/comparators.js';
 
 function useRangeCalendarState(props) {
   const isStartInvalid = computed(() => {
@@ -45,6 +45,11 @@ function useRangeCalendarState(props) {
       return isBetween(date, props.start.value, props.end.value);
     return false;
   };
+  const isDateHighlightable = (date) => {
+    if (props.isDateHighlightable?.(date))
+      return true;
+    return false;
+  };
   const highlightedRange = computed(() => {
     if (props.start.value && props.end.value)
       return null;
@@ -59,7 +64,7 @@ function useRangeCalendarState(props) {
         end
       };
     }
-    const isValid = props.allowNonContiguousRanges.value || areAllDaysBetweenValid(start, end, props.isDateUnavailable, props.isDateDisabled);
+    const isValid = areAllDaysBetweenValid(start, end, props.allowNonContiguousRanges.value ? () => false : props.isDateUnavailable, props.isDateDisabled, props.isDateHighlightable);
     if (isValid) {
       return {
         start,
@@ -81,6 +86,7 @@ function useRangeCalendarState(props) {
   return {
     isInvalid,
     isSelected,
+    isDateHighlightable,
     highlightedRange,
     isSelectionStart,
     isSelectionEnd,

package/dist/RangeCalendar/useRangeCalendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRangeCalendar.js","sources":["../../src/RangeCalendar/useRangeCalendar.ts"],"sourcesContent":["/*\n  * Adapted from https://github.com/melt-ui/melt-ui/blob/develop/src/lib/builders/range-calendar/create.ts\n*/\n\nimport { type DateValue, isSameDay } from '@internationalized/date'\nimport { type Ref, computed } from 'vue'\nimport { type Matcher, areAllDaysBetweenValid, isBefore, isBetween } from '@/date'\n\nexport type UseRangeCalendarProps = {\n  start: Ref<DateValue | undefined>\n  end: Ref<DateValue | undefined>\n  isDateDisabled: Matcher\n  isDateUnavailable: Matcher\n  focusedValue: Ref<DateValue | undefined>\n  allowNonContiguousRanges: Ref<boolean>\n}\n\nexport function useRangeCalendarState(props: UseRangeCalendarProps) {\n  const isStartInvalid = computed(() => {\n    if (!props.start.value)\n      return false\n    if (props.isDateDisabled(props.start.value))\n      return true\n    return false\n  })\n\n  const isEndInvalid = computed(() => {\n    if (!props.end.value)\n      return false\n    if (props.isDateDisabled(props.end.value))\n      return true\n    return false\n  })\n\n  const isInvalid = computed(\n    () => {\n      if (isStartInvalid.value || isEndInvalid.value)\n        return false\n      if (props.start.value && props.end.value && isBefore(props.end.value, props.start.value))\n        return true\n      return false\n    },\n  )\n\n  const isSelectionStart = (date: DateValue) => {\n    if (!props.start.value)\n      return false\n    return isSameDay(props.start.value, date)\n  }\n\n  const isSelectionEnd = (date: DateValue) => {\n    if (!props.end.value)\n      return false\n    return isSameDay(props.end.value, date)\n  }\n\n  const isSelected = (date: DateValue) => {\n    if (props.start.value && isSameDay(props.start.value, date))\n      return true\n    if (props.end.value && isSameDay(props.end.value, date))\n      return true\n    if (props.end.value && props.start.value)\n      return isBetween(date, props.start.value, props.end.value)\n\n    return false\n  }\n\n  const highlightedRange = computed(() => {\n    if (props.start.value && props.end.value)\n      return null\n    if (!props.start.value || !props.focusedValue.value)\n      return null\n\n    const isStartBeforeFocused = isBefore(props.start.value, props.focusedValue.value)\n    const start = isStartBeforeFocused ? props.start.value : props.focusedValue.value\n    const end = isStartBeforeFocused ? props.focusedValue.value : props.start.value\n\n    if (isSameDay(start, end)) {\n      return {\n        start,\n        end,\n      }\n    }\n\n    const isValid = props.allowNonContiguousRanges.value || areAllDaysBetweenValid(start, end, props.isDateUnavailable, props.isDateDisabled)\n    if (isValid) {\n      return {\n        start,\n        end,\n      }\n    }\n    return null\n  })\n\n  const isHighlightedStart = (date: DateValue) => {\n    if (!highlightedRange.value || !highlightedRange.value.start)\n      return false\n    return isSameDay(highlightedRange.value.start, date)\n  }\n\n  const isHighlightedEnd = (date: DateValue) => {\n    if (!highlightedRange.value || !highlightedRange.value.end)\n      return false\n    return isSameDay(highlightedRange.value.end, date)\n  }\n\n  return {\n    isInvalid,\n    isSelected,\n    highlightedRange,\n    isSelectionStart,\n    isSelectionEnd,\n    isHighlightedStart,\n    isHighlightedEnd,\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useRangeCalendar.js","sources":["../../src/RangeCalendar/useRangeCalendar.ts"],"sourcesContent":["/*\n  * Adapted from https://github.com/melt-ui/melt-ui/blob/develop/src/lib/builders/range-calendar/create.ts\n*/\n\nimport type { Matcher } from '@/date'\nimport type { DateValue } from '@internationalized/date'\nimport type { Ref } from 'vue'\nimport { areAllDaysBetweenValid, isBefore, isBetween } from '@/date'\nimport { isSameDay } from '@internationalized/date'\nimport { computed } from 'vue'\n\nexport type UseRangeCalendarProps = {\n  start: Ref<DateValue | undefined>\n  end: Ref<DateValue | undefined>\n  isDateDisabled: Matcher\n  isDateUnavailable: Matcher\n  isDateHighlightable?: Matcher\n  focusedValue: Ref<DateValue | undefined>\n  allowNonContiguousRanges: Ref<boolean>\n}\n\nexport function useRangeCalendarState(props: UseRangeCalendarProps) {\n  const isStartInvalid = computed(() => {\n    if (!props.start.value)\n      return false\n    if (props.isDateDisabled(props.start.value))\n      return true\n    return false\n  })\n\n  const isEndInvalid = computed(() => {\n    if (!props.end.value)\n      return false\n    if (props.isDateDisabled(props.end.value))\n      return true\n    return false\n  })\n\n  const isInvalid = computed(\n    () => {\n      if (isStartInvalid.value || isEndInvalid.value)\n        return false\n      if (props.start.value && props.end.value && isBefore(props.end.value, props.start.value))\n        return true\n      return false\n    },\n  )\n\n  const isSelectionStart = (date: DateValue) => {\n    if (!props.start.value)\n      return false\n    return isSameDay(props.start.value, date)\n  }\n\n  const isSelectionEnd = (date: DateValue) => {\n    if (!props.end.value)\n      return false\n    return isSameDay(props.end.value, date)\n  }\n\n  const isSelected = (date: DateValue) => {\n    if (props.start.value && isSameDay(props.start.value, date))\n      return true\n    if (props.end.value && isSameDay(props.end.value, date))\n      return true\n    if (props.end.value && props.start.value)\n      return isBetween(date, props.start.value, props.end.value)\n\n    return false\n  }\n\n  const isDateHighlightable = (date: DateValue) => {\n    if (props.isDateHighlightable?.(date))\n      return true\n    return false\n  }\n\n  const highlightedRange = computed(() => {\n    if (props.start.value && props.end.value)\n      return null\n    if (!props.start.value || !props.focusedValue.value)\n      return null\n\n    const isStartBeforeFocused = isBefore(props.start.value, props.focusedValue.value)\n    const start = isStartBeforeFocused ? props.start.value : props.focusedValue.value\n    const end = isStartBeforeFocused ? props.focusedValue.value : props.start.value\n\n    if (isSameDay(start, end)) {\n      return {\n        start,\n        end,\n      }\n    }\n\n    const isValid = areAllDaysBetweenValid(start, end, props.allowNonContiguousRanges.value ? () => false : props.isDateUnavailable, props.isDateDisabled, props.isDateHighlightable)\n    if (isValid) {\n      return {\n        start,\n        end,\n      }\n    }\n    return null\n  })\n\n  const isHighlightedStart = (date: DateValue) => {\n    if (!highlightedRange.value || !highlightedRange.value.start)\n      return false\n    return isSameDay(highlightedRange.value.start, date)\n  }\n\n  const isHighlightedEnd = (date: DateValue) => {\n    if (!highlightedRange.value || !highlightedRange.value.end)\n      return false\n    return isSameDay(highlightedRange.value.end, date)\n  }\n\n  return {\n    isInvalid,\n    isSelected,\n    isDateHighlightable,\n    highlightedRange,\n    isSelectionStart,\n    isSelectionEnd,\n    isHighlightedStart,\n    isHighlightedEnd,\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/RovingFocus/RovingFocusGroup.cjs

@@ -1,9 +1,9 @@
 'use strict';
 
 const vue = require('vue');
+const Collection_Collection = require('../Collection/Collection.cjs');
 const core = require('@vueuse/core');
 const RovingFocus_utils = require('./utils.cjs');
-const Collection_Collection = require('../Collection/Collection.cjs');
 const shared_useDirection = require('../shared/useDirection.cjs');
 const shared_createContext = require('../shared/createContext.cjs');
 const Primitive_Primitive = require('../Primitive/Primitive.cjs');

package/dist/RovingFocus/RovingFocusGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RovingFocusGroup.cjs","sources":["../../src/RovingFocus/RovingFocusGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { createContext, useDirection } from '@/shared'\nimport type {\n  Direction,\n  Orientation,\n} from './utils'\n\nexport interface RovingFocusGroupProps extends PrimitiveProps {\n  /**\n   * The orientation of the group.\n   * Mainly so arrow navigation is done accordingly (left & right vs. up & down)\n   */\n  orientation?: Orientation\n  /**\n   * The direction of navigation between items.\n   */\n  dir?: Direction\n  /**\n   * Whether keyboard navigation should loop around\n   * @defaultValue false\n   */\n  loop?: boolean\n  /** The controlled value of the current stop item. Can be binded as `v-model`. */\n  currentTabStopId?: string | null\n  /**\n   * The value of the current stop item.\n   *\n   * Use when you do not need to control the state of the stop item.\n   */\n  defaultCurrentTabStopId?: string\n  /**\n   * When `true`, will prevent scrolling to the focus item when focused.\n   */\n  preventScrollOnEntryFocus?: boolean\n}\n\nexport type RovingFocusGroupEmits = {\n  'entryFocus': [event: Event]\n  'update:currentTabStopId': [value: string | null | undefined]\n}\n\ninterface RovingContext {\n  orientation: Ref<Orientation | undefined>\n  dir: Ref<Direction>\n  loop: Ref<boolean>\n  currentTabStopId: Ref<string | null | undefined>\n  onItemFocus: (tabStopId: string) => void\n  onItemShiftTab: () => void\n  onFocusableItemAdd: () => void\n  onFocusableItemRemove: () => void\n}\n\nexport const [injectRovingFocusGroupContext, provideRovingFocusGroupContext]\n  = createContext<RovingContext>('RovingFocusGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, toRefs } from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { Primitive } from '@/Primitive'\nimport { ENTRY_FOCUS, EVENT_OPTIONS, focusFirst } from './utils'\nimport { useCollection } from '@/Collection'\n\nconst props = withDefaults(defineProps<RovingFocusGroupProps>(), {\n  loop: false,\n  orientation: undefined,\n  preventScrollOnEntryFocus: false,\n})\nconst emits = defineEmits<RovingFocusGroupEmits>()\n\nconst { loop, orientation, dir: propDir } = toRefs(props)\nconst dir = useDirection(propDir)\nconst currentTabStopId = useVModel(props, 'currentTabStopId', emits, {\n  defaultValue: props.defaultCurrentTabStopId,\n  passive: (props.currentTabStopId === undefined) as false,\n})\nconst isTabbingBackOut = ref(false)\nconst isClickFocus = ref(false)\nconst focusableItemsCount = ref(0)\n\nconst { getItems, CollectionSlot } = useCollection({ isProvider: true })\n\nfunction handleFocus(event: FocusEvent) {\n  // We normally wouldn't need this check, because we already check\n  // that the focus is on the current target and not bubbling to it.\n  // We do this because Safari doesn't focus buttons when clicked, and\n  // instead, the wrapper will get focused and not through a bubbling event.\n  const isKeyboardFocus = !isClickFocus.value\n\n  if (\n    event.currentTarget\n    && event.target === event.currentTarget\n    && isKeyboardFocus\n    && !isTabbingBackOut.value\n  ) {\n    const entryFocusEvent = new CustomEvent(ENTRY_FOCUS, EVENT_OPTIONS)\n    event.currentTarget.dispatchEvent(entryFocusEvent)\n    emits('entryFocus', entryFocusEvent)\n\n    if (!entryFocusEvent.defaultPrevented) {\n      const items = getItems().map(i => i.ref).filter(i => i.dataset.disabled !== '')\n      const activeItem = items.find(item => item.getAttribute('data-active') === '')\n      const currentItem = items.find(\n        item => item.id === currentTabStopId.value,\n      )\n      const candidateItems = [activeItem, currentItem, ...items].filter(\n        Boolean,\n      ) as typeof items\n      focusFirst(candidateItems, props.preventScrollOnEntryFocus)\n    }\n  }\n  isClickFocus.value = false\n}\n\nfunction handleMouseUp() {\n  // reset `isClickFocus` after 1 tick because handleFocus might not triggered due to focused element\n  setTimeout(() => {\n    isClickFocus.value = false\n  }, 1)\n}\n\ndefineExpose({\n  getItems,\n})\n\nprovideRovingFocusGroupContext({\n  loop,\n  dir,\n  orientation,\n  currentTabStopId,\n  onItemFocus: (tabStopId) => {\n    currentTabStopId.value = tabStopId\n  },\n  onItemShiftTab: () => {\n    isTabbingBackOut.value = true\n  },\n  onFocusableItemAdd: () => {\n    focusableItemsCount.value++\n  },\n  onFocusableItemRemove: () => {\n    focusableItemsCount.value--\n  },\n})\n</script>\n\n<template>\n  <CollectionSlot>\n    <Primitive\n      :tabindex=\"isTabbingBackOut || focusableItemsCount === 0 ? -1 : 0\"\n      :data-orientation=\"orientation\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      :dir=\"dir\"\n      style=\"outline: none\"\n      @mousedown=\"isClickFocus = true\"\n      @mouseup=\"handleMouseUp\"\n      @focus=\"handleFocus\"\n      @blur=\"isTabbingBackOut = false\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionSlot>\n</template>\n"],"names":["createContext","toRefs","useDirection","useVModel","ref","useCollection","ENTRY_FOCUS","EVENT_OPTIONS","focusFirst"],"mappings":"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"}
+{"version":3,"file":"RovingFocusGroup.cjs","sources":["../../src/RovingFocus/RovingFocusGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\nimport type {\n  Direction,\n  Orientation,\n} from './utils'\nimport { createContext, useDirection } from '@/shared'\n\nexport interface RovingFocusGroupProps extends PrimitiveProps {\n  /**\n   * The orientation of the group.\n   * Mainly so arrow navigation is done accordingly (left & right vs. up & down)\n   */\n  orientation?: Orientation\n  /**\n   * The direction of navigation between items.\n   */\n  dir?: Direction\n  /**\n   * Whether keyboard navigation should loop around\n   * @defaultValue false\n   */\n  loop?: boolean\n  /** The controlled value of the current stop item. Can be binded as `v-model`. */\n  currentTabStopId?: string | null\n  /**\n   * The value of the current stop item.\n   *\n   * Use when you do not need to control the state of the stop item.\n   */\n  defaultCurrentTabStopId?: string\n  /**\n   * When `true`, will prevent scrolling to the focus item when focused.\n   */\n  preventScrollOnEntryFocus?: boolean\n}\n\nexport type RovingFocusGroupEmits = {\n  'entryFocus': [event: Event]\n  'update:currentTabStopId': [value: string | null | undefined]\n}\n\ninterface RovingContext {\n  orientation: Ref<Orientation | undefined>\n  dir: Ref<Direction>\n  loop: Ref<boolean>\n  currentTabStopId: Ref<string | null | undefined>\n  onItemFocus: (tabStopId: string) => void\n  onItemShiftTab: () => void\n  onFocusableItemAdd: () => void\n  onFocusableItemRemove: () => void\n}\n\nexport const [injectRovingFocusGroupContext, provideRovingFocusGroupContext]\n  = createContext<RovingContext>('RovingFocusGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { useCollection } from '@/Collection'\nimport { Primitive } from '@/Primitive'\nimport { useVModel } from '@vueuse/core'\nimport { ref, toRefs } from 'vue'\nimport { ENTRY_FOCUS, EVENT_OPTIONS, focusFirst } from './utils'\n\nconst props = withDefaults(defineProps<RovingFocusGroupProps>(), {\n  loop: false,\n  orientation: undefined,\n  preventScrollOnEntryFocus: false,\n})\nconst emits = defineEmits<RovingFocusGroupEmits>()\n\nconst { loop, orientation, dir: propDir } = toRefs(props)\nconst dir = useDirection(propDir)\nconst currentTabStopId = useVModel(props, 'currentTabStopId', emits, {\n  defaultValue: props.defaultCurrentTabStopId,\n  passive: (props.currentTabStopId === undefined) as false,\n})\nconst isTabbingBackOut = ref(false)\nconst isClickFocus = ref(false)\nconst focusableItemsCount = ref(0)\n\nconst { getItems, CollectionSlot } = useCollection({ isProvider: true })\n\nfunction handleFocus(event: FocusEvent) {\n  // We normally wouldn't need this check, because we already check\n  // that the focus is on the current target and not bubbling to it.\n  // We do this because Safari doesn't focus buttons when clicked, and\n  // instead, the wrapper will get focused and not through a bubbling event.\n  const isKeyboardFocus = !isClickFocus.value\n\n  if (\n    event.currentTarget\n    && event.target === event.currentTarget\n    && isKeyboardFocus\n    && !isTabbingBackOut.value\n  ) {\n    const entryFocusEvent = new CustomEvent(ENTRY_FOCUS, EVENT_OPTIONS)\n    event.currentTarget.dispatchEvent(entryFocusEvent)\n    emits('entryFocus', entryFocusEvent)\n\n    if (!entryFocusEvent.defaultPrevented) {\n      const items = getItems().map(i => i.ref).filter(i => i.dataset.disabled !== '')\n      const activeItem = items.find(item => item.getAttribute('data-active') === '')\n      const currentItem = items.find(\n        item => item.id === currentTabStopId.value,\n      )\n      const candidateItems = [activeItem, currentItem, ...items].filter(\n        Boolean,\n      ) as typeof items\n      focusFirst(candidateItems, props.preventScrollOnEntryFocus)\n    }\n  }\n  isClickFocus.value = false\n}\n\nfunction handleMouseUp() {\n  // reset `isClickFocus` after 1 tick because handleFocus might not triggered due to focused element\n  setTimeout(() => {\n    isClickFocus.value = false\n  }, 1)\n}\n\ndefineExpose({\n  getItems,\n})\n\nprovideRovingFocusGroupContext({\n  loop,\n  dir,\n  orientation,\n  currentTabStopId,\n  onItemFocus: (tabStopId) => {\n    currentTabStopId.value = tabStopId\n  },\n  onItemShiftTab: () => {\n    isTabbingBackOut.value = true\n  },\n  onFocusableItemAdd: () => {\n    focusableItemsCount.value++\n  },\n  onFocusableItemRemove: () => {\n    focusableItemsCount.value--\n  },\n})\n</script>\n\n<template>\n  <CollectionSlot>\n    <Primitive\n      :tabindex=\"isTabbingBackOut || focusableItemsCount === 0 ? -1 : 0\"\n      :data-orientation=\"orientation\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      :dir=\"dir\"\n      style=\"outline: none\"\n      @mousedown=\"isClickFocus = true\"\n      @mouseup=\"handleMouseUp\"\n      @focus=\"handleFocus\"\n      @blur=\"isTabbingBackOut = false\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionSlot>\n</template>\n"],"names":["createContext","toRefs","useDirection","useVModel","ref","useCollection","ENTRY_FOCUS","EVENT_OPTIONS","focusFirst"],"mappings":"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"}

package/dist/RovingFocus/RovingFocusGroup.js

@@ -1,7 +1,7 @@
 import { defineComponent, toRefs, ref, createBlock, openBlock, unref, withCtx, createVNode, renderSlot } from 'vue';
+import { u as useCollection } from '../Collection/Collection.js';
 import { useVModel } from '@vueuse/core';
 import { f as focusFirst, E as ENTRY_FOCUS, a as EVENT_OPTIONS } from './utils.js';
-import { u as useCollection } from '../Collection/Collection.js';
 import { u as useDirection } from '../shared/useDirection.js';
 import { c as createContext } from '../shared/createContext.js';
 import { P as Primitive } from '../Primitive/Primitive.js';

package/dist/RovingFocus/RovingFocusGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RovingFocusGroup.js","sources":["../../src/RovingFocus/RovingFocusGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { createContext, useDirection } from '@/shared'\nimport type {\n  Direction,\n  Orientation,\n} from './utils'\n\nexport interface RovingFocusGroupProps extends PrimitiveProps {\n  /**\n   * The orientation of the group.\n   * Mainly so arrow navigation is done accordingly (left & right vs. up & down)\n   */\n  orientation?: Orientation\n  /**\n   * The direction of navigation between items.\n   */\n  dir?: Direction\n  /**\n   * Whether keyboard navigation should loop around\n   * @defaultValue false\n   */\n  loop?: boolean\n  /** The controlled value of the current stop item. Can be binded as `v-model`. */\n  currentTabStopId?: string | null\n  /**\n   * The value of the current stop item.\n   *\n   * Use when you do not need to control the state of the stop item.\n   */\n  defaultCurrentTabStopId?: string\n  /**\n   * When `true`, will prevent scrolling to the focus item when focused.\n   */\n  preventScrollOnEntryFocus?: boolean\n}\n\nexport type RovingFocusGroupEmits = {\n  'entryFocus': [event: Event]\n  'update:currentTabStopId': [value: string | null | undefined]\n}\n\ninterface RovingContext {\n  orientation: Ref<Orientation | undefined>\n  dir: Ref<Direction>\n  loop: Ref<boolean>\n  currentTabStopId: Ref<string | null | undefined>\n  onItemFocus: (tabStopId: string) => void\n  onItemShiftTab: () => void\n  onFocusableItemAdd: () => void\n  onFocusableItemRemove: () => void\n}\n\nexport const [injectRovingFocusGroupContext, provideRovingFocusGroupContext]\n  = createContext<RovingContext>('RovingFocusGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, toRefs } from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { Primitive } from '@/Primitive'\nimport { ENTRY_FOCUS, EVENT_OPTIONS, focusFirst } from './utils'\nimport { useCollection } from '@/Collection'\n\nconst props = withDefaults(defineProps<RovingFocusGroupProps>(), {\n  loop: false,\n  orientation: undefined,\n  preventScrollOnEntryFocus: false,\n})\nconst emits = defineEmits<RovingFocusGroupEmits>()\n\nconst { loop, orientation, dir: propDir } = toRefs(props)\nconst dir = useDirection(propDir)\nconst currentTabStopId = useVModel(props, 'currentTabStopId', emits, {\n  defaultValue: props.defaultCurrentTabStopId,\n  passive: (props.currentTabStopId === undefined) as false,\n})\nconst isTabbingBackOut = ref(false)\nconst isClickFocus = ref(false)\nconst focusableItemsCount = ref(0)\n\nconst { getItems, CollectionSlot } = useCollection({ isProvider: true })\n\nfunction handleFocus(event: FocusEvent) {\n  // We normally wouldn't need this check, because we already check\n  // that the focus is on the current target and not bubbling to it.\n  // We do this because Safari doesn't focus buttons when clicked, and\n  // instead, the wrapper will get focused and not through a bubbling event.\n  const isKeyboardFocus = !isClickFocus.value\n\n  if (\n    event.currentTarget\n    && event.target === event.currentTarget\n    && isKeyboardFocus\n    && !isTabbingBackOut.value\n  ) {\n    const entryFocusEvent = new CustomEvent(ENTRY_FOCUS, EVENT_OPTIONS)\n    event.currentTarget.dispatchEvent(entryFocusEvent)\n    emits('entryFocus', entryFocusEvent)\n\n    if (!entryFocusEvent.defaultPrevented) {\n      const items = getItems().map(i => i.ref).filter(i => i.dataset.disabled !== '')\n      const activeItem = items.find(item => item.getAttribute('data-active') === '')\n      const currentItem = items.find(\n        item => item.id === currentTabStopId.value,\n      )\n      const candidateItems = [activeItem, currentItem, ...items].filter(\n        Boolean,\n      ) as typeof items\n      focusFirst(candidateItems, props.preventScrollOnEntryFocus)\n    }\n  }\n  isClickFocus.value = false\n}\n\nfunction handleMouseUp() {\n  // reset `isClickFocus` after 1 tick because handleFocus might not triggered due to focused element\n  setTimeout(() => {\n    isClickFocus.value = false\n  }, 1)\n}\n\ndefineExpose({\n  getItems,\n})\n\nprovideRovingFocusGroupContext({\n  loop,\n  dir,\n  orientation,\n  currentTabStopId,\n  onItemFocus: (tabStopId) => {\n    currentTabStopId.value = tabStopId\n  },\n  onItemShiftTab: () => {\n    isTabbingBackOut.value = true\n  },\n  onFocusableItemAdd: () => {\n    focusableItemsCount.value++\n  },\n  onFocusableItemRemove: () => {\n    focusableItemsCount.value--\n  },\n})\n</script>\n\n<template>\n  <CollectionSlot>\n    <Primitive\n      :tabindex=\"isTabbingBackOut || focusableItemsCount === 0 ? -1 : 0\"\n      :data-orientation=\"orientation\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      :dir=\"dir\"\n      style=\"outline: none\"\n      @mousedown=\"isClickFocus = true\"\n      @mouseup=\"handleMouseUp\"\n      @focus=\"handleFocus\"\n      @blur=\"isTabbingBackOut = false\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionSlot>\n</template>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"RovingFocusGroup.js","sources":["../../src/RovingFocus/RovingFocusGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\nimport type {\n  Direction,\n  Orientation,\n} from './utils'\nimport { createContext, useDirection } from '@/shared'\n\nexport interface RovingFocusGroupProps extends PrimitiveProps {\n  /**\n   * The orientation of the group.\n   * Mainly so arrow navigation is done accordingly (left & right vs. up & down)\n   */\n  orientation?: Orientation\n  /**\n   * The direction of navigation between items.\n   */\n  dir?: Direction\n  /**\n   * Whether keyboard navigation should loop around\n   * @defaultValue false\n   */\n  loop?: boolean\n  /** The controlled value of the current stop item. Can be binded as `v-model`. */\n  currentTabStopId?: string | null\n  /**\n   * The value of the current stop item.\n   *\n   * Use when you do not need to control the state of the stop item.\n   */\n  defaultCurrentTabStopId?: string\n  /**\n   * When `true`, will prevent scrolling to the focus item when focused.\n   */\n  preventScrollOnEntryFocus?: boolean\n}\n\nexport type RovingFocusGroupEmits = {\n  'entryFocus': [event: Event]\n  'update:currentTabStopId': [value: string | null | undefined]\n}\n\ninterface RovingContext {\n  orientation: Ref<Orientation | undefined>\n  dir: Ref<Direction>\n  loop: Ref<boolean>\n  currentTabStopId: Ref<string | null | undefined>\n  onItemFocus: (tabStopId: string) => void\n  onItemShiftTab: () => void\n  onFocusableItemAdd: () => void\n  onFocusableItemRemove: () => void\n}\n\nexport const [injectRovingFocusGroupContext, provideRovingFocusGroupContext]\n  = createContext<RovingContext>('RovingFocusGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { useCollection } from '@/Collection'\nimport { Primitive } from '@/Primitive'\nimport { useVModel } from '@vueuse/core'\nimport { ref, toRefs } from 'vue'\nimport { ENTRY_FOCUS, EVENT_OPTIONS, focusFirst } from './utils'\n\nconst props = withDefaults(defineProps<RovingFocusGroupProps>(), {\n  loop: false,\n  orientation: undefined,\n  preventScrollOnEntryFocus: false,\n})\nconst emits = defineEmits<RovingFocusGroupEmits>()\n\nconst { loop, orientation, dir: propDir } = toRefs(props)\nconst dir = useDirection(propDir)\nconst currentTabStopId = useVModel(props, 'currentTabStopId', emits, {\n  defaultValue: props.defaultCurrentTabStopId,\n  passive: (props.currentTabStopId === undefined) as false,\n})\nconst isTabbingBackOut = ref(false)\nconst isClickFocus = ref(false)\nconst focusableItemsCount = ref(0)\n\nconst { getItems, CollectionSlot } = useCollection({ isProvider: true })\n\nfunction handleFocus(event: FocusEvent) {\n  // We normally wouldn't need this check, because we already check\n  // that the focus is on the current target and not bubbling to it.\n  // We do this because Safari doesn't focus buttons when clicked, and\n  // instead, the wrapper will get focused and not through a bubbling event.\n  const isKeyboardFocus = !isClickFocus.value\n\n  if (\n    event.currentTarget\n    && event.target === event.currentTarget\n    && isKeyboardFocus\n    && !isTabbingBackOut.value\n  ) {\n    const entryFocusEvent = new CustomEvent(ENTRY_FOCUS, EVENT_OPTIONS)\n    event.currentTarget.dispatchEvent(entryFocusEvent)\n    emits('entryFocus', entryFocusEvent)\n\n    if (!entryFocusEvent.defaultPrevented) {\n      const items = getItems().map(i => i.ref).filter(i => i.dataset.disabled !== '')\n      const activeItem = items.find(item => item.getAttribute('data-active') === '')\n      const currentItem = items.find(\n        item => item.id === currentTabStopId.value,\n      )\n      const candidateItems = [activeItem, currentItem, ...items].filter(\n        Boolean,\n      ) as typeof items\n      focusFirst(candidateItems, props.preventScrollOnEntryFocus)\n    }\n  }\n  isClickFocus.value = false\n}\n\nfunction handleMouseUp() {\n  // reset `isClickFocus` after 1 tick because handleFocus might not triggered due to focused element\n  setTimeout(() => {\n    isClickFocus.value = false\n  }, 1)\n}\n\ndefineExpose({\n  getItems,\n})\n\nprovideRovingFocusGroupContext({\n  loop,\n  dir,\n  orientation,\n  currentTabStopId,\n  onItemFocus: (tabStopId) => {\n    currentTabStopId.value = tabStopId\n  },\n  onItemShiftTab: () => {\n    isTabbingBackOut.value = true\n  },\n  onFocusableItemAdd: () => {\n    focusableItemsCount.value++\n  },\n  onFocusableItemRemove: () => {\n    focusableItemsCount.value--\n  },\n})\n</script>\n\n<template>\n  <CollectionSlot>\n    <Primitive\n      :tabindex=\"isTabbingBackOut || focusableItemsCount === 0 ? -1 : 0\"\n      :data-orientation=\"orientation\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      :dir=\"dir\"\n      style=\"outline: none\"\n      @mousedown=\"isClickFocus = true\"\n      @mouseup=\"handleMouseUp\"\n      @focus=\"handleFocus\"\n      @blur=\"isTabbingBackOut = false\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionSlot>\n</template>\n"],"names":[],"mappings":"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"}

package/dist/RovingFocus/RovingFocusItem.cjs

@@ -1,8 +1,8 @@
 'use strict';
 
 const vue = require('vue');
-const RovingFocus_utils = require('./utils.cjs');
 const Collection_Collection = require('../Collection/Collection.cjs');
+const RovingFocus_utils = require('./utils.cjs');
 const RovingFocus_RovingFocusGroup = require('./RovingFocusGroup.cjs');
 const shared_useId = require('../shared/useId.cjs');
 const Primitive_Primitive = require('../Primitive/Primitive.cjs');

package/dist/RovingFocus/RovingFocusItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RovingFocusItem.cjs","sources":["../../src/RovingFocus/RovingFocusItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface RovingFocusItemProps extends PrimitiveProps {\n  tabStopId?: string\n  /**\n   * When `false`, item wil be not be focusable.\n   * @defaultValue `true`\n   */\n  focusable?: boolean\n  /** When `true`, item wil be initially focused. */\n  active?: boolean\n  /** When `true`, shift + arrow key will allow focusing on next/previous item. */\n  allowShiftKey?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, nextTick, onMounted, onUnmounted } from 'vue'\nimport { injectRovingFocusGroupContext } from './RovingFocusGroup.vue'\nimport { Primitive } from '@/Primitive'\nimport { focusFirst, getFocusIntent, wrapArray } from './utils'\nimport { useId } from '@/shared'\nimport { useCollection } from '@/Collection'\n\nconst props = withDefaults(defineProps<RovingFocusItemProps>(), {\n  focusable: true,\n  as: 'span',\n})\n\nconst context = injectRovingFocusGroupContext()\nconst randomId = useId()\nconst id = computed(() => props.tabStopId || randomId)\nconst isCurrentTabStop = computed(\n  () => context.currentTabStopId.value === id.value,\n)\n\nconst { getItems, CollectionItem } = useCollection()\n\nonMounted(() => {\n  if (props.focusable)\n    context.onFocusableItemAdd()\n})\nonUnmounted(() => {\n  if (props.focusable)\n    context.onFocusableItemRemove()\n})\n\nfunction handleKeydown(event: KeyboardEvent) {\n  if (event.key === 'Tab' && event.shiftKey) {\n    context.onItemShiftTab()\n    return\n  }\n\n  if (event.target !== event.currentTarget)\n    return\n\n  const focusIntent = getFocusIntent(\n    event,\n    context.orientation.value,\n    context.dir.value,\n  )\n\n  if (focusIntent !== undefined) {\n    if (event.metaKey || event.ctrlKey || event.altKey || (props.allowShiftKey ? false : event.shiftKey))\n      return\n    event.preventDefault()\n    let candidateNodes = [...getItems().map(i => i.ref).filter(i => i.dataset.disabled !== '')]\n\n    if (focusIntent === 'last') {\n      candidateNodes.reverse()\n    }\n    else if (focusIntent === 'prev' || focusIntent === 'next') {\n      if (focusIntent === 'prev')\n        candidateNodes.reverse()\n      const currentIndex = candidateNodes.indexOf(\n        event.currentTarget as HTMLElement,\n      )\n\n      candidateNodes = context.loop.value\n        ? wrapArray(candidateNodes, currentIndex + 1)\n        : candidateNodes.slice(currentIndex + 1)\n    }\n\n    nextTick(() => focusFirst(candidateNodes))\n  }\n}\n</script>\n\n<template>\n  <CollectionItem>\n    <Primitive\n      :tabindex=\"isCurrentTabStop ? 0 : -1\"\n      :data-orientation=\"context.orientation.value\"\n      :data-active=\"active ? '' : undefined\"\n      :data-disabled=\"!focusable ? '' : undefined\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      @mousedown=\"\n        (event) => {\n          // We prevent focusing non-focusable items on `mousedown`.\n          // Even though the item has tabIndex={-1}, that only means take it out of the tab order.\n          if (!focusable) event.preventDefault();\n          // Safari doesn't focus a button when clicked so we run our logic on mousedown also\n          else context.onItemFocus(id);\n        }\n      \"\n      @focus=\"context.onItemFocus(id)\"\n      @keydown=\"handleKeydown\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":["injectRovingFocusGroupContext","useId","computed","useCollection","onMounted","onUnmounted","getFocusIntent","wrapArray","nextTick","focusFirst"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,UAAUA,0DAA8B,EAAA;AAC9C,IAAA,MAAM,WAAWC,kBAAM,EAAA;AACvB,IAAA,MAAM,EAAK,GAAAC,YAAA,CAAS,MAAM,KAAA,CAAM,aAAa,QAAQ,CAAA;AACrD,IAAA,MAAM,gBAAmB,GAAAA,YAAA;AAAA,MACvB,MAAM,OAAA,CAAQ,gBAAiB,CAAA,KAAA,KAAU,EAAG,CAAA;AAAA,KAC9C;AAEA,IAAA,MAAM,EAAE,QAAA,EAAU,cAAe,EAAA,GAAIC,mCAAc,EAAA;AAEnD,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,kBAAmB,EAAA;AAAA,KAC9B,CAAA;AACD,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,qBAAsB,EAAA;AAAA,KACjC,CAAA;AAED,IAAA,SAAS,cAAc,KAAsB,EAAA;AAC3C,MAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,KAAS,IAAA,KAAA,CAAM,QAAU,EAAA;AACzC,QAAA,OAAA,CAAQ,cAAe,EAAA;AACvB,QAAA;AAAA;AAGF,MAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,aAAA;AACzB,QAAA;AAEF,MAAA,MAAM,WAAc,GAAAC,gCAAA;AAAA,QAClB,KAAA;AAAA,QACA,QAAQ,WAAY,CAAA,KAAA;AAAA,QACpB,QAAQ,GAAI,CAAA;AAAA,OACd;AAEA,MAAA,IAAI,gBAAgB,MAAW,EAAA;AAC7B,QAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,OAAA,IAAW,MAAM,MAAW,KAAA,KAAA,CAAM,aAAgB,GAAA,KAAA,GAAQ,KAAM,CAAA,QAAA,CAAA;AACzF,UAAA;AACF,QAAA,KAAA,CAAM,cAAe,EAAA;AACrB,QAAA,IAAI,iBAAiB,CAAC,GAAG,QAAS,EAAA,CAAE,IAAI,CAAK,CAAA,KAAA,CAAA,CAAE,GAAG,CAAA,CAAE,OAAO,CAAK,CAAA,KAAA,CAAA,CAAE,OAAQ,CAAA,QAAA,KAAa,EAAE,CAAC,CAAA;AAE1F,QAAA,IAAI,gBAAgB,MAAQ,EAAA;AAC1B,UAAA,cAAA,CAAe,OAAQ,EAAA;AAAA,SAEhB,MAAA,IAAA,WAAA,KAAgB,MAAU,IAAA,WAAA,KAAgB,MAAQ,EAAA;AACzD,UAAA,IAAI,WAAgB,KAAA,MAAA;AAClB,YAAA,cAAA,CAAe,OAAQ,EAAA;AACzB,UAAA,MAAM,eAAe,cAAe,CAAA,OAAA;AAAA,YAClC,KAAM,CAAA;AAAA,WACR;AAEA,UAAiB,cAAA,GAAA,OAAA,CAAQ,IAAK,CAAA,KAAA,GAC1BC,2BAAU,CAAA,cAAA,EAAgB,YAAe,GAAA,CAAC,CAC1C,GAAA,cAAA,CAAe,KAAM,CAAA,YAAA,GAAe,CAAC,CAAA;AAAA;AAG3C,QAASC,YAAA,CAAA,MAAMC,4BAAW,CAAA,cAAc,CAAC,CAAA;AAAA;AAC3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"RovingFocusItem.cjs","sources":["../../src/RovingFocus/RovingFocusItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface RovingFocusItemProps extends PrimitiveProps {\n  tabStopId?: string\n  /**\n   * When `false`, item will not be focusable.\n   * @defaultValue `true`\n   */\n  focusable?: boolean\n  /** When `true`, item will be initially focused. */\n  active?: boolean\n  /** When `true`, shift + arrow key will allow focusing on next/previous item. */\n  allowShiftKey?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { useCollection } from '@/Collection'\nimport { Primitive } from '@/Primitive'\nimport { useId } from '@/shared'\nimport { computed, nextTick, onMounted, onUnmounted } from 'vue'\nimport { injectRovingFocusGroupContext } from './RovingFocusGroup.vue'\nimport { focusFirst, getFocusIntent, wrapArray } from './utils'\n\nconst props = withDefaults(defineProps<RovingFocusItemProps>(), {\n  focusable: true,\n  as: 'span',\n})\n\nconst context = injectRovingFocusGroupContext()\nconst randomId = useId()\nconst id = computed(() => props.tabStopId || randomId)\nconst isCurrentTabStop = computed(\n  () => context.currentTabStopId.value === id.value,\n)\n\nconst { getItems, CollectionItem } = useCollection()\n\nonMounted(() => {\n  if (props.focusable)\n    context.onFocusableItemAdd()\n})\nonUnmounted(() => {\n  if (props.focusable)\n    context.onFocusableItemRemove()\n})\n\nfunction handleKeydown(event: KeyboardEvent) {\n  if (event.key === 'Tab' && event.shiftKey) {\n    context.onItemShiftTab()\n    return\n  }\n\n  if (event.target !== event.currentTarget)\n    return\n\n  const focusIntent = getFocusIntent(\n    event,\n    context.orientation.value,\n    context.dir.value,\n  )\n\n  if (focusIntent !== undefined) {\n    if (event.metaKey || event.ctrlKey || event.altKey || (props.allowShiftKey ? false : event.shiftKey))\n      return\n    event.preventDefault()\n    let candidateNodes = [...getItems().map(i => i.ref).filter(i => i.dataset.disabled !== '')]\n\n    if (focusIntent === 'last') {\n      candidateNodes.reverse()\n    }\n    else if (focusIntent === 'prev' || focusIntent === 'next') {\n      if (focusIntent === 'prev')\n        candidateNodes.reverse()\n      const currentIndex = candidateNodes.indexOf(\n        event.currentTarget as HTMLElement,\n      )\n\n      candidateNodes = context.loop.value\n        ? wrapArray(candidateNodes, currentIndex + 1)\n        : candidateNodes.slice(currentIndex + 1)\n    }\n\n    nextTick(() => focusFirst(candidateNodes))\n  }\n}\n</script>\n\n<template>\n  <CollectionItem>\n    <Primitive\n      :tabindex=\"isCurrentTabStop ? 0 : -1\"\n      :data-orientation=\"context.orientation.value\"\n      :data-active=\"active ? '' : undefined\"\n      :data-disabled=\"!focusable ? '' : undefined\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      @mousedown=\"\n        (event) => {\n          // We prevent focusing non-focusable items on `mousedown`.\n          // Even though the item has tabIndex={-1}, that only means take it out of the tab order.\n          if (!focusable) event.preventDefault();\n          // Safari doesn't focus a button when clicked so we run our logic on mousedown also\n          else context.onItemFocus(id);\n        }\n      \"\n      @focus=\"context.onItemFocus(id)\"\n      @keydown=\"handleKeydown\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":["injectRovingFocusGroupContext","useId","computed","useCollection","onMounted","onUnmounted","getFocusIntent","wrapArray","nextTick","focusFirst"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,UAAUA,0DAA8B,EAAA;AAC9C,IAAA,MAAM,WAAWC,kBAAM,EAAA;AACvB,IAAA,MAAM,EAAK,GAAAC,YAAA,CAAS,MAAM,KAAA,CAAM,aAAa,QAAQ,CAAA;AACrD,IAAA,MAAM,gBAAmB,GAAAA,YAAA;AAAA,MACvB,MAAM,OAAA,CAAQ,gBAAiB,CAAA,KAAA,KAAU,EAAG,CAAA;AAAA,KAC9C;AAEA,IAAA,MAAM,EAAE,QAAA,EAAU,cAAe,EAAA,GAAIC,mCAAc,EAAA;AAEnD,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,kBAAmB,EAAA;AAAA,KAC9B,CAAA;AACD,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,qBAAsB,EAAA;AAAA,KACjC,CAAA;AAED,IAAA,SAAS,cAAc,KAAsB,EAAA;AAC3C,MAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,KAAS,IAAA,KAAA,CAAM,QAAU,EAAA;AACzC,QAAA,OAAA,CAAQ,cAAe,EAAA;AACvB,QAAA;AAAA;AAGF,MAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,aAAA;AACzB,QAAA;AAEF,MAAA,MAAM,WAAc,GAAAC,gCAAA;AAAA,QAClB,KAAA;AAAA,QACA,QAAQ,WAAY,CAAA,KAAA;AAAA,QACpB,QAAQ,GAAI,CAAA;AAAA,OACd;AAEA,MAAA,IAAI,gBAAgB,MAAW,EAAA;AAC7B,QAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,OAAA,IAAW,MAAM,MAAW,KAAA,KAAA,CAAM,aAAgB,GAAA,KAAA,GAAQ,KAAM,CAAA,QAAA,CAAA;AACzF,UAAA;AACF,QAAA,KAAA,CAAM,cAAe,EAAA;AACrB,QAAA,IAAI,iBAAiB,CAAC,GAAG,QAAS,EAAA,CAAE,IAAI,CAAK,CAAA,KAAA,CAAA,CAAE,GAAG,CAAA,CAAE,OAAO,CAAK,CAAA,KAAA,CAAA,CAAE,OAAQ,CAAA,QAAA,KAAa,EAAE,CAAC,CAAA;AAE1F,QAAA,IAAI,gBAAgB,MAAQ,EAAA;AAC1B,UAAA,cAAA,CAAe,OAAQ,EAAA;AAAA,SAEhB,MAAA,IAAA,WAAA,KAAgB,MAAU,IAAA,WAAA,KAAgB,MAAQ,EAAA;AACzD,UAAA,IAAI,WAAgB,KAAA,MAAA;AAClB,YAAA,cAAA,CAAe,OAAQ,EAAA;AACzB,UAAA,MAAM,eAAe,cAAe,CAAA,OAAA;AAAA,YAClC,KAAM,CAAA;AAAA,WACR;AAEA,UAAiB,cAAA,GAAA,OAAA,CAAQ,IAAK,CAAA,KAAA,GAC1BC,2BAAU,CAAA,cAAA,EAAgB,YAAe,GAAA,CAAC,CAC1C,GAAA,cAAA,CAAe,KAAM,CAAA,YAAA,GAAe,CAAC,CAAA;AAAA;AAG3C,QAASC,YAAA,CAAA,MAAMC,4BAAW,CAAA,cAAc,CAAC,CAAA;AAAA;AAC3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RovingFocus/RovingFocusItem.js

@@ -1,6 +1,6 @@
 import { defineComponent, computed, onMounted, onUnmounted, createBlock, openBlock, unref, withCtx, createVNode, renderSlot, nextTick } from 'vue';
-import { g as getFocusIntent, w as wrapArray, f as focusFirst } from './utils.js';
 import { u as useCollection } from '../Collection/Collection.js';
+import { g as getFocusIntent, w as wrapArray, f as focusFirst } from './utils.js';
 import { i as injectRovingFocusGroupContext } from './RovingFocusGroup.js';
 import { u as useId } from '../shared/useId.js';
 import { P as Primitive } from '../Primitive/Primitive.js';

package/dist/RovingFocus/RovingFocusItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"RovingFocusItem.js","sources":["../../src/RovingFocus/RovingFocusItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface RovingFocusItemProps extends PrimitiveProps {\n  tabStopId?: string\n  /**\n   * When `false`, item wil be not be focusable.\n   * @defaultValue `true`\n   */\n  focusable?: boolean\n  /** When `true`, item wil be initially focused. */\n  active?: boolean\n  /** When `true`, shift + arrow key will allow focusing on next/previous item. */\n  allowShiftKey?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, nextTick, onMounted, onUnmounted } from 'vue'\nimport { injectRovingFocusGroupContext } from './RovingFocusGroup.vue'\nimport { Primitive } from '@/Primitive'\nimport { focusFirst, getFocusIntent, wrapArray } from './utils'\nimport { useId } from '@/shared'\nimport { useCollection } from '@/Collection'\n\nconst props = withDefaults(defineProps<RovingFocusItemProps>(), {\n  focusable: true,\n  as: 'span',\n})\n\nconst context = injectRovingFocusGroupContext()\nconst randomId = useId()\nconst id = computed(() => props.tabStopId || randomId)\nconst isCurrentTabStop = computed(\n  () => context.currentTabStopId.value === id.value,\n)\n\nconst { getItems, CollectionItem } = useCollection()\n\nonMounted(() => {\n  if (props.focusable)\n    context.onFocusableItemAdd()\n})\nonUnmounted(() => {\n  if (props.focusable)\n    context.onFocusableItemRemove()\n})\n\nfunction handleKeydown(event: KeyboardEvent) {\n  if (event.key === 'Tab' && event.shiftKey) {\n    context.onItemShiftTab()\n    return\n  }\n\n  if (event.target !== event.currentTarget)\n    return\n\n  const focusIntent = getFocusIntent(\n    event,\n    context.orientation.value,\n    context.dir.value,\n  )\n\n  if (focusIntent !== undefined) {\n    if (event.metaKey || event.ctrlKey || event.altKey || (props.allowShiftKey ? false : event.shiftKey))\n      return\n    event.preventDefault()\n    let candidateNodes = [...getItems().map(i => i.ref).filter(i => i.dataset.disabled !== '')]\n\n    if (focusIntent === 'last') {\n      candidateNodes.reverse()\n    }\n    else if (focusIntent === 'prev' || focusIntent === 'next') {\n      if (focusIntent === 'prev')\n        candidateNodes.reverse()\n      const currentIndex = candidateNodes.indexOf(\n        event.currentTarget as HTMLElement,\n      )\n\n      candidateNodes = context.loop.value\n        ? wrapArray(candidateNodes, currentIndex + 1)\n        : candidateNodes.slice(currentIndex + 1)\n    }\n\n    nextTick(() => focusFirst(candidateNodes))\n  }\n}\n</script>\n\n<template>\n  <CollectionItem>\n    <Primitive\n      :tabindex=\"isCurrentTabStop ? 0 : -1\"\n      :data-orientation=\"context.orientation.value\"\n      :data-active=\"active ? '' : undefined\"\n      :data-disabled=\"!focusable ? '' : undefined\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      @mousedown=\"\n        (event) => {\n          // We prevent focusing non-focusable items on `mousedown`.\n          // Even though the item has tabIndex={-1}, that only means take it out of the tab order.\n          if (!focusable) event.preventDefault();\n          // Safari doesn't focus a button when clicked so we run our logic on mousedown also\n          else context.onItemFocus(id);\n        }\n      \"\n      @focus=\"context.onItemFocus(id)\"\n      @keydown=\"handleKeydown\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAyBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,UAAU,6BAA8B,EAAA;AAC9C,IAAA,MAAM,WAAW,KAAM,EAAA;AACvB,IAAA,MAAM,EAAK,GAAA,QAAA,CAAS,MAAM,KAAA,CAAM,aAAa,QAAQ,CAAA;AACrD,IAAA,MAAM,gBAAmB,GAAA,QAAA;AAAA,MACvB,MAAM,OAAA,CAAQ,gBAAiB,CAAA,KAAA,KAAU,EAAG,CAAA;AAAA,KAC9C;AAEA,IAAA,MAAM,EAAE,QAAA,EAAU,cAAe,EAAA,GAAI,aAAc,EAAA;AAEnD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,kBAAmB,EAAA;AAAA,KAC9B,CAAA;AACD,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,qBAAsB,EAAA;AAAA,KACjC,CAAA;AAED,IAAA,SAAS,cAAc,KAAsB,EAAA;AAC3C,MAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,KAAS,IAAA,KAAA,CAAM,QAAU,EAAA;AACzC,QAAA,OAAA,CAAQ,cAAe,EAAA;AACvB,QAAA;AAAA;AAGF,MAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,aAAA;AACzB,QAAA;AAEF,MAAA,MAAM,WAAc,GAAA,cAAA;AAAA,QAClB,KAAA;AAAA,QACA,QAAQ,WAAY,CAAA,KAAA;AAAA,QACpB,QAAQ,GAAI,CAAA;AAAA,OACd;AAEA,MAAA,IAAI,gBAAgB,MAAW,EAAA;AAC7B,QAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,OAAA,IAAW,MAAM,MAAW,KAAA,KAAA,CAAM,aAAgB,GAAA,KAAA,GAAQ,KAAM,CAAA,QAAA,CAAA;AACzF,UAAA;AACF,QAAA,KAAA,CAAM,cAAe,EAAA;AACrB,QAAA,IAAI,iBAAiB,CAAC,GAAG,QAAS,EAAA,CAAE,IAAI,CAAK,CAAA,KAAA,CAAA,CAAE,GAAG,CAAA,CAAE,OAAO,CAAK,CAAA,KAAA,CAAA,CAAE,OAAQ,CAAA,QAAA,KAAa,EAAE,CAAC,CAAA;AAE1F,QAAA,IAAI,gBAAgB,MAAQ,EAAA;AAC1B,UAAA,cAAA,CAAe,OAAQ,EAAA;AAAA,SAEhB,MAAA,IAAA,WAAA,KAAgB,MAAU,IAAA,WAAA,KAAgB,MAAQ,EAAA;AACzD,UAAA,IAAI,WAAgB,KAAA,MAAA;AAClB,YAAA,cAAA,CAAe,OAAQ,EAAA;AACzB,UAAA,MAAM,eAAe,cAAe,CAAA,OAAA;AAAA,YAClC,KAAM,CAAA;AAAA,WACR;AAEA,UAAiB,cAAA,GAAA,OAAA,CAAQ,IAAK,CAAA,KAAA,GAC1B,SAAU,CAAA,cAAA,EAAgB,YAAe,GAAA,CAAC,CAC1C,GAAA,cAAA,CAAe,KAAM,CAAA,YAAA,GAAe,CAAC,CAAA;AAAA;AAG3C,QAAS,QAAA,CAAA,MAAM,UAAW,CAAA,cAAc,CAAC,CAAA;AAAA;AAC3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"RovingFocusItem.js","sources":["../../src/RovingFocus/RovingFocusItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface RovingFocusItemProps extends PrimitiveProps {\n  tabStopId?: string\n  /**\n   * When `false`, item will not be focusable.\n   * @defaultValue `true`\n   */\n  focusable?: boolean\n  /** When `true`, item will be initially focused. */\n  active?: boolean\n  /** When `true`, shift + arrow key will allow focusing on next/previous item. */\n  allowShiftKey?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { useCollection } from '@/Collection'\nimport { Primitive } from '@/Primitive'\nimport { useId } from '@/shared'\nimport { computed, nextTick, onMounted, onUnmounted } from 'vue'\nimport { injectRovingFocusGroupContext } from './RovingFocusGroup.vue'\nimport { focusFirst, getFocusIntent, wrapArray } from './utils'\n\nconst props = withDefaults(defineProps<RovingFocusItemProps>(), {\n  focusable: true,\n  as: 'span',\n})\n\nconst context = injectRovingFocusGroupContext()\nconst randomId = useId()\nconst id = computed(() => props.tabStopId || randomId)\nconst isCurrentTabStop = computed(\n  () => context.currentTabStopId.value === id.value,\n)\n\nconst { getItems, CollectionItem } = useCollection()\n\nonMounted(() => {\n  if (props.focusable)\n    context.onFocusableItemAdd()\n})\nonUnmounted(() => {\n  if (props.focusable)\n    context.onFocusableItemRemove()\n})\n\nfunction handleKeydown(event: KeyboardEvent) {\n  if (event.key === 'Tab' && event.shiftKey) {\n    context.onItemShiftTab()\n    return\n  }\n\n  if (event.target !== event.currentTarget)\n    return\n\n  const focusIntent = getFocusIntent(\n    event,\n    context.orientation.value,\n    context.dir.value,\n  )\n\n  if (focusIntent !== undefined) {\n    if (event.metaKey || event.ctrlKey || event.altKey || (props.allowShiftKey ? false : event.shiftKey))\n      return\n    event.preventDefault()\n    let candidateNodes = [...getItems().map(i => i.ref).filter(i => i.dataset.disabled !== '')]\n\n    if (focusIntent === 'last') {\n      candidateNodes.reverse()\n    }\n    else if (focusIntent === 'prev' || focusIntent === 'next') {\n      if (focusIntent === 'prev')\n        candidateNodes.reverse()\n      const currentIndex = candidateNodes.indexOf(\n        event.currentTarget as HTMLElement,\n      )\n\n      candidateNodes = context.loop.value\n        ? wrapArray(candidateNodes, currentIndex + 1)\n        : candidateNodes.slice(currentIndex + 1)\n    }\n\n    nextTick(() => focusFirst(candidateNodes))\n  }\n}\n</script>\n\n<template>\n  <CollectionItem>\n    <Primitive\n      :tabindex=\"isCurrentTabStop ? 0 : -1\"\n      :data-orientation=\"context.orientation.value\"\n      :data-active=\"active ? '' : undefined\"\n      :data-disabled=\"!focusable ? '' : undefined\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      @mousedown=\"\n        (event) => {\n          // We prevent focusing non-focusable items on `mousedown`.\n          // Even though the item has tabIndex={-1}, that only means take it out of the tab order.\n          if (!focusable) event.preventDefault();\n          // Safari doesn't focus a button when clicked so we run our logic on mousedown also\n          else context.onItemFocus(id);\n        }\n      \"\n      @focus=\"context.onItemFocus(id)\"\n      @keydown=\"handleKeydown\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAyBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,UAAU,6BAA8B,EAAA;AAC9C,IAAA,MAAM,WAAW,KAAM,EAAA;AACvB,IAAA,MAAM,EAAK,GAAA,QAAA,CAAS,MAAM,KAAA,CAAM,aAAa,QAAQ,CAAA;AACrD,IAAA,MAAM,gBAAmB,GAAA,QAAA;AAAA,MACvB,MAAM,OAAA,CAAQ,gBAAiB,CAAA,KAAA,KAAU,EAAG,CAAA;AAAA,KAC9C;AAEA,IAAA,MAAM,EAAE,QAAA,EAAU,cAAe,EAAA,GAAI,aAAc,EAAA;AAEnD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,kBAAmB,EAAA;AAAA,KAC9B,CAAA;AACD,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,qBAAsB,EAAA;AAAA,KACjC,CAAA;AAED,IAAA,SAAS,cAAc,KAAsB,EAAA;AAC3C,MAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,KAAS,IAAA,KAAA,CAAM,QAAU,EAAA;AACzC,QAAA,OAAA,CAAQ,cAAe,EAAA;AACvB,QAAA;AAAA;AAGF,MAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,aAAA;AACzB,QAAA;AAEF,MAAA,MAAM,WAAc,GAAA,cAAA;AAAA,QAClB,KAAA;AAAA,QACA,QAAQ,WAAY,CAAA,KAAA;AAAA,QACpB,QAAQ,GAAI,CAAA;AAAA,OACd;AAEA,MAAA,IAAI,gBAAgB,MAAW,EAAA;AAC7B,QAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,OAAA,IAAW,MAAM,MAAW,KAAA,KAAA,CAAM,aAAgB,GAAA,KAAA,GAAQ,KAAM,CAAA,QAAA,CAAA;AACzF,UAAA;AACF,QAAA,KAAA,CAAM,cAAe,EAAA;AACrB,QAAA,IAAI,iBAAiB,CAAC,GAAG,QAAS,EAAA,CAAE,IAAI,CAAK,CAAA,KAAA,CAAA,CAAE,GAAG,CAAA,CAAE,OAAO,CAAK,CAAA,KAAA,CAAA,CAAE,OAAQ,CAAA,QAAA,KAAa,EAAE,CAAC,CAAA;AAE1F,QAAA,IAAI,gBAAgB,MAAQ,EAAA;AAC1B,UAAA,cAAA,CAAe,OAAQ,EAAA;AAAA,SAEhB,MAAA,IAAA,WAAA,KAAgB,MAAU,IAAA,WAAA,KAAgB,MAAQ,EAAA;AACzD,UAAA,IAAI,WAAgB,KAAA,MAAA;AAClB,YAAA,cAAA,CAAe,OAAQ,EAAA;AACzB,UAAA,MAAM,eAAe,cAAe,CAAA,OAAA;AAAA,YAClC,KAAM,CAAA;AAAA,WACR;AAEA,UAAiB,cAAA,GAAA,OAAA,CAAQ,IAAK,CAAA,KAAA,GAC1B,SAAU,CAAA,cAAA,EAAgB,YAAe,GAAA,CAAC,CAC1C,GAAA,cAAA,CAAe,KAAM,CAAA,YAAA,GAAe,CAAC,CAAA;AAAA;AAG3C,QAAS,QAAA,CAAA,MAAM,UAAW,CAAA,cAAc,CAAC,CAAA;AAAA;AAC3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaCorner.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaCorner.cjs","sources":["../../src/ScrollArea/ScrollAreaCorner.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaCornerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport ScrollAreaCornerImpl from './ScrollAreaCornerImpl.vue'\n\nconst props = defineProps<ScrollAreaCornerProps>()\n\nconst { forwardRef } = useForwardExpose()\nconst rootContext = injectScrollAreaRootContext()\n\nconst hasBothScrollbarsVisible = computed(\n  () => !!rootContext.scrollbarX.value && !!rootContext.scrollbarY.value,\n)\nconst hasCorner = computed(\n  () => rootContext.type.value !== 'scroll' && hasBothScrollbarsVisible.value,\n)\n</script>\n\n<template>\n  <ScrollAreaCornerImpl\n    v-if=\"hasCorner\"\n    v-bind=\"props\"\n    :ref=\"forwardRef\"\n  >\n    <slot />\n  </ScrollAreaCornerImpl>\n</template>\n"],"names":["useForwardExpose","injectScrollAreaRootContext","computed"],"mappings":";;;;;;;;;;;;;;AAYA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIA,wCAAiB,EAAA;AACxC,IAAA,MAAM,cAAcC,qDAA4B,EAAA;AAEhD,IAAA,MAAM,wBAA2B,GAAAC,YAAA;AAAA,MAC/B,MAAM,CAAC,CAAC,WAAA,CAAY,WAAW,KAAS,IAAA,CAAC,CAAC,WAAA,CAAY,UAAW,CAAA;AAAA,KACnE;AACA,IAAA,MAAM,SAAY,GAAAA,YAAA;AAAA,MAChB,MAAM,WAAA,CAAY,IAAK,CAAA,KAAA,KAAU,YAAY,wBAAyB,CAAA;AAAA,KACxE;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaCorner.cjs","sources":["../../src/ScrollArea/ScrollAreaCorner.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaCornerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport ScrollAreaCornerImpl from './ScrollAreaCornerImpl.vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\n\nconst props = defineProps<ScrollAreaCornerProps>()\n\nconst { forwardRef } = useForwardExpose()\nconst rootContext = injectScrollAreaRootContext()\n\nconst hasBothScrollbarsVisible = computed(\n  () => !!rootContext.scrollbarX.value && !!rootContext.scrollbarY.value,\n)\nconst hasCorner = computed(\n  () => rootContext.type.value !== 'scroll' && hasBothScrollbarsVisible.value,\n)\n</script>\n\n<template>\n  <ScrollAreaCornerImpl\n    v-if=\"hasCorner\"\n    v-bind=\"props\"\n    :ref=\"forwardRef\"\n  >\n    <slot />\n  </ScrollAreaCornerImpl>\n</template>\n"],"names":["useForwardExpose","injectScrollAreaRootContext","computed"],"mappings":";;;;;;;;;;;;;;AAYA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIA,wCAAiB,EAAA;AACxC,IAAA,MAAM,cAAcC,qDAA4B,EAAA;AAEhD,IAAA,MAAM,wBAA2B,GAAAC,YAAA;AAAA,MAC/B,MAAM,CAAC,CAAC,WAAA,CAAY,WAAW,KAAS,IAAA,CAAC,CAAC,WAAA,CAAY,UAAW,CAAA;AAAA,KACnE;AACA,IAAA,MAAM,SAAY,GAAAA,YAAA;AAAA,MAChB,MAAM,WAAA,CAAY,IAAK,CAAA,KAAA,KAAU,YAAY,wBAAyB,CAAA;AAAA,KACxE;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaCorner.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaCorner.js","sources":["../../src/ScrollArea/ScrollAreaCorner.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaCornerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport ScrollAreaCornerImpl from './ScrollAreaCornerImpl.vue'\n\nconst props = defineProps<ScrollAreaCornerProps>()\n\nconst { forwardRef } = useForwardExpose()\nconst rootContext = injectScrollAreaRootContext()\n\nconst hasBothScrollbarsVisible = computed(\n  () => !!rootContext.scrollbarX.value && !!rootContext.scrollbarY.value,\n)\nconst hasCorner = computed(\n  () => rootContext.type.value !== 'scroll' && hasBothScrollbarsVisible.value,\n)\n</script>\n\n<template>\n  <ScrollAreaCornerImpl\n    v-if=\"hasCorner\"\n    v-bind=\"props\"\n    :ref=\"forwardRef\"\n  >\n    <slot />\n  </ScrollAreaCornerImpl>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;AAYA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAI,gBAAiB,EAAA;AACxC,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAA,MAAM,wBAA2B,GAAA,QAAA;AAAA,MAC/B,MAAM,CAAC,CAAC,WAAA,CAAY,WAAW,KAAS,IAAA,CAAC,CAAC,WAAA,CAAY,UAAW,CAAA;AAAA,KACnE;AACA,IAAA,MAAM,SAAY,GAAA,QAAA;AAAA,MAChB,MAAM,WAAA,CAAY,IAAK,CAAA,KAAA,KAAU,YAAY,wBAAyB,CAAA;AAAA,KACxE;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaCorner.js","sources":["../../src/ScrollArea/ScrollAreaCorner.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaCornerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport ScrollAreaCornerImpl from './ScrollAreaCornerImpl.vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\n\nconst props = defineProps<ScrollAreaCornerProps>()\n\nconst { forwardRef } = useForwardExpose()\nconst rootContext = injectScrollAreaRootContext()\n\nconst hasBothScrollbarsVisible = computed(\n  () => !!rootContext.scrollbarX.value && !!rootContext.scrollbarY.value,\n)\nconst hasCorner = computed(\n  () => rootContext.type.value !== 'scroll' && hasBothScrollbarsVisible.value,\n)\n</script>\n\n<template>\n  <ScrollAreaCornerImpl\n    v-if=\"hasCorner\"\n    v-bind=\"props\"\n    :ref=\"forwardRef\"\n  >\n    <slot />\n  </ScrollAreaCornerImpl>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;AAYA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAI,gBAAiB,EAAA;AACxC,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAA,MAAM,wBAA2B,GAAA,QAAA;AAAA,MAC/B,MAAM,CAAC,CAAC,WAAA,CAAY,WAAW,KAAS,IAAA,CAAC,CAAC,WAAA,CAAY,UAAW,CAAA;AAAA,KACnE;AACA,IAAA,MAAM,SAAY,GAAA,QAAA;AAAA,MAChB,MAAM,WAAA,CAAY,IAAK,CAAA,KAAA,KAAU,YAAY,wBAAyB,CAAA;AAAA,KACxE;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaCornerImpl.cjs

@@ -2,8 +2,8 @@
 
 const vue = require('vue');
 const core = require('@vueuse/core');
-const Primitive_Primitive = require('../Primitive/Primitive.cjs');
 const ScrollArea_ScrollAreaRoot = require('./ScrollAreaRoot.cjs');
+const Primitive_Primitive = require('../Primitive/Primitive.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "ScrollAreaCornerImpl",

package/dist/ScrollArea/ScrollAreaCornerImpl.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaCornerImpl.cjs","sources":["../../src/ScrollArea/ScrollAreaCornerImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { Primitive } from '@/Primitive'\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst width = ref(0)\nconst height = ref(0)\n\nconst hasSize = computed(() => !!width.value && !!height.value)\n\nfunction setCornerHeight() {\n  const offsetHeight = rootContext.scrollbarX.value?.offsetHeight || 0\n  rootContext.onCornerHeightChange(offsetHeight)\n  height.value = offsetHeight\n}\nfunction setCornerWidth() {\n  const offsetWidth = rootContext.scrollbarY.value?.offsetWidth || 0\n  rootContext.onCornerWidthChange(offsetWidth)\n  width.value = offsetWidth\n}\n\nuseResizeObserver(rootContext.scrollbarX.value, setCornerHeight)\nuseResizeObserver(rootContext.scrollbarY.value, setCornerWidth)\n\n// because we are not remounting the component, useResizeObserver doesn't trigger, thus using watcher here\nwatch(() => rootContext.scrollbarX.value, setCornerHeight)\nwatch(() => rootContext.scrollbarY.value, setCornerWidth)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"hasSize\"\n    :style=\"{\n      width: `${width}px`,\n      height: `${height}px`,\n      position: 'absolute',\n      right: rootContext.dir.value === 'ltr' ? 0 : undefined,\n      left: rootContext.dir.value === 'rtl' ? 0 : undefined,\n      bottom: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectScrollAreaRootContext","ref","computed","useResizeObserver","watch"],"mappings":";;;;;;;;;;AAMA,IAAA,MAAM,cAAcA,qDAA4B,EAAA;AAEhD,IAAM,MAAA,KAAA,GAAQC,QAAI,CAAC,CAAA;AACnB,IAAM,MAAA,MAAA,GAASA,QAAI,CAAC,CAAA;AAEpB,IAAM,MAAA,OAAA,GAAUC,YAAS,CAAA,MAAM,CAAC,CAAC,MAAM,KAAS,IAAA,CAAC,CAAC,MAAA,CAAO,KAAK,CAAA;AAE9D,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAA,MAAM,YAAe,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AACnE,MAAA,WAAA,CAAY,qBAAqB,YAAY,CAAA;AAC7C,MAAA,MAAA,CAAO,KAAQ,GAAA,YAAA;AAAA;AAEjB,IAAA,SAAS,cAAiB,GAAA;AACxB,MAAA,MAAM,WAAc,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AACjE,MAAA,WAAA,CAAY,oBAAoB,WAAW,CAAA;AAC3C,MAAA,KAAA,CAAM,KAAQ,GAAA,WAAA;AAAA;AAGhB,IAAkBC,sBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AAC/D,IAAkBA,sBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;AAG9D,IAAAC,SAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AACzD,IAAAA,SAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaCornerImpl.cjs","sources":["../../src/ScrollArea/ScrollAreaCornerImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useResizeObserver } from '@vueuse/core'\nimport { computed, ref, watch } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst width = ref(0)\nconst height = ref(0)\n\nconst hasSize = computed(() => !!width.value && !!height.value)\n\nfunction setCornerHeight() {\n  const offsetHeight = rootContext.scrollbarX.value?.offsetHeight || 0\n  rootContext.onCornerHeightChange(offsetHeight)\n  height.value = offsetHeight\n}\nfunction setCornerWidth() {\n  const offsetWidth = rootContext.scrollbarY.value?.offsetWidth || 0\n  rootContext.onCornerWidthChange(offsetWidth)\n  width.value = offsetWidth\n}\n\nuseResizeObserver(rootContext.scrollbarX.value, setCornerHeight)\nuseResizeObserver(rootContext.scrollbarY.value, setCornerWidth)\n\n// because we are not remounting the component, useResizeObserver doesn't trigger, thus using watcher here\nwatch(() => rootContext.scrollbarX.value, setCornerHeight)\nwatch(() => rootContext.scrollbarY.value, setCornerWidth)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"hasSize\"\n    :style=\"{\n      width: `${width}px`,\n      height: `${height}px`,\n      position: 'absolute',\n      right: rootContext.dir.value === 'ltr' ? 0 : undefined,\n      left: rootContext.dir.value === 'rtl' ? 0 : undefined,\n      bottom: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectScrollAreaRootContext","ref","computed","useResizeObserver","watch"],"mappings":";;;;;;;;;;AAMA,IAAA,MAAM,cAAcA,qDAA4B,EAAA;AAEhD,IAAM,MAAA,KAAA,GAAQC,QAAI,CAAC,CAAA;AACnB,IAAM,MAAA,MAAA,GAASA,QAAI,CAAC,CAAA;AAEpB,IAAM,MAAA,OAAA,GAAUC,YAAS,CAAA,MAAM,CAAC,CAAC,MAAM,KAAS,IAAA,CAAC,CAAC,MAAA,CAAO,KAAK,CAAA;AAE9D,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAA,MAAM,YAAe,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AACnE,MAAA,WAAA,CAAY,qBAAqB,YAAY,CAAA;AAC7C,MAAA,MAAA,CAAO,KAAQ,GAAA,YAAA;AAAA;AAEjB,IAAA,SAAS,cAAiB,GAAA;AACxB,MAAA,MAAM,WAAc,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AACjE,MAAA,WAAA,CAAY,oBAAoB,WAAW,CAAA;AAC3C,MAAA,KAAA,CAAM,KAAQ,GAAA,WAAA;AAAA;AAGhB,IAAkBC,sBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AAC/D,IAAkBA,sBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;AAG9D,IAAAC,SAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AACzD,IAAAA,SAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaCornerImpl.js

@@ -1,7 +1,7 @@
 import { defineComponent, ref, computed, watch, createBlock, createCommentVNode, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { useResizeObserver } from '@vueuse/core';
-import { P as Primitive } from '../Primitive/Primitive.js';
 import { i as injectScrollAreaRootContext } from './ScrollAreaRoot.js';
+import { P as Primitive } from '../Primitive/Primitive.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "ScrollAreaCornerImpl",

package/dist/ScrollArea/ScrollAreaCornerImpl.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaCornerImpl.js","sources":["../../src/ScrollArea/ScrollAreaCornerImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { Primitive } from '@/Primitive'\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst width = ref(0)\nconst height = ref(0)\n\nconst hasSize = computed(() => !!width.value && !!height.value)\n\nfunction setCornerHeight() {\n  const offsetHeight = rootContext.scrollbarX.value?.offsetHeight || 0\n  rootContext.onCornerHeightChange(offsetHeight)\n  height.value = offsetHeight\n}\nfunction setCornerWidth() {\n  const offsetWidth = rootContext.scrollbarY.value?.offsetWidth || 0\n  rootContext.onCornerWidthChange(offsetWidth)\n  width.value = offsetWidth\n}\n\nuseResizeObserver(rootContext.scrollbarX.value, setCornerHeight)\nuseResizeObserver(rootContext.scrollbarY.value, setCornerWidth)\n\n// because we are not remounting the component, useResizeObserver doesn't trigger, thus using watcher here\nwatch(() => rootContext.scrollbarX.value, setCornerHeight)\nwatch(() => rootContext.scrollbarY.value, setCornerWidth)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"hasSize\"\n    :style=\"{\n      width: `${width}px`,\n      height: `${height}px`,\n      position: 'absolute',\n      right: rootContext.dir.value === 'ltr' ? 0 : undefined,\n      left: rootContext.dir.value === 'rtl' ? 0 : undefined,\n      bottom: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;AAMA,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAM,MAAA,KAAA,GAAQ,IAAI,CAAC,CAAA;AACnB,IAAM,MAAA,MAAA,GAAS,IAAI,CAAC,CAAA;AAEpB,IAAM,MAAA,OAAA,GAAU,QAAS,CAAA,MAAM,CAAC,CAAC,MAAM,KAAS,IAAA,CAAC,CAAC,MAAA,CAAO,KAAK,CAAA;AAE9D,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAA,MAAM,YAAe,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AACnE,MAAA,WAAA,CAAY,qBAAqB,YAAY,CAAA;AAC7C,MAAA,MAAA,CAAO,KAAQ,GAAA,YAAA;AAAA;AAEjB,IAAA,SAAS,cAAiB,GAAA;AACxB,MAAA,MAAM,WAAc,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AACjE,MAAA,WAAA,CAAY,oBAAoB,WAAW,CAAA;AAC3C,MAAA,KAAA,CAAM,KAAQ,GAAA,WAAA;AAAA;AAGhB,IAAkB,iBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AAC/D,IAAkB,iBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;AAG9D,IAAA,KAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AACzD,IAAA,KAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaCornerImpl.js","sources":["../../src/ScrollArea/ScrollAreaCornerImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useResizeObserver } from '@vueuse/core'\nimport { computed, ref, watch } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst width = ref(0)\nconst height = ref(0)\n\nconst hasSize = computed(() => !!width.value && !!height.value)\n\nfunction setCornerHeight() {\n  const offsetHeight = rootContext.scrollbarX.value?.offsetHeight || 0\n  rootContext.onCornerHeightChange(offsetHeight)\n  height.value = offsetHeight\n}\nfunction setCornerWidth() {\n  const offsetWidth = rootContext.scrollbarY.value?.offsetWidth || 0\n  rootContext.onCornerWidthChange(offsetWidth)\n  width.value = offsetWidth\n}\n\nuseResizeObserver(rootContext.scrollbarX.value, setCornerHeight)\nuseResizeObserver(rootContext.scrollbarY.value, setCornerWidth)\n\n// because we are not remounting the component, useResizeObserver doesn't trigger, thus using watcher here\nwatch(() => rootContext.scrollbarX.value, setCornerHeight)\nwatch(() => rootContext.scrollbarY.value, setCornerWidth)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"hasSize\"\n    :style=\"{\n      width: `${width}px`,\n      height: `${height}px`,\n      position: 'absolute',\n      right: rootContext.dir.value === 'ltr' ? 0 : undefined,\n      left: rootContext.dir.value === 'rtl' ? 0 : undefined,\n      bottom: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;AAMA,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAM,MAAA,KAAA,GAAQ,IAAI,CAAC,CAAA;AACnB,IAAM,MAAA,MAAA,GAAS,IAAI,CAAC,CAAA;AAEpB,IAAM,MAAA,OAAA,GAAU,QAAS,CAAA,MAAM,CAAC,CAAC,MAAM,KAAS,IAAA,CAAC,CAAC,MAAA,CAAO,KAAK,CAAA;AAE9D,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAA,MAAM,YAAe,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AACnE,MAAA,WAAA,CAAY,qBAAqB,YAAY,CAAA;AAC7C,MAAA,MAAA,CAAO,KAAQ,GAAA,YAAA;AAAA;AAEjB,IAAA,SAAS,cAAiB,GAAA;AACxB,MAAA,MAAM,WAAc,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AACjE,MAAA,WAAA,CAAY,oBAAoB,WAAW,CAAA;AAC3C,MAAA,KAAA,CAAM,KAAQ,GAAA,WAAA;AAAA;AAGhB,IAAkB,iBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AAC/D,IAAkB,iBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;AAG9D,IAAA,KAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AACzD,IAAA,KAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}