reka-ui 1.0.0-alpha.7 → 1.0.0-alpha.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (151) hide show
  1. package/README.md +0 -6
  2. package/dist/Accordion/AccordionContent.cjs +1 -1
  3. package/dist/Accordion/AccordionContent.js +1 -1
  4. package/dist/Accordion/AccordionItem.cjs +6 -1
  5. package/dist/Accordion/AccordionItem.cjs.map +1 -1
  6. package/dist/Accordion/AccordionItem.js +6 -1
  7. package/dist/Accordion/AccordionItem.js.map +1 -1
  8. package/dist/Accordion/AccordionRoot.cjs.map +1 -1
  9. package/dist/Accordion/AccordionRoot.js.map +1 -1
  10. package/dist/Accordion/AccordionTrigger.cjs +2 -1
  11. package/dist/Accordion/AccordionTrigger.cjs.map +1 -1
  12. package/dist/Accordion/AccordionTrigger.js +2 -1
  13. package/dist/Accordion/AccordionTrigger.js.map +1 -1
  14. package/dist/Calendar/CalendarRoot.cjs.map +1 -1
  15. package/dist/Calendar/CalendarRoot.js.map +1 -1
  16. package/dist/Checkbox/CheckboxRoot.cjs +4 -3
  17. package/dist/Checkbox/CheckboxRoot.cjs.map +1 -1
  18. package/dist/Checkbox/CheckboxRoot.js +4 -3
  19. package/dist/Checkbox/CheckboxRoot.js.map +1 -1
  20. package/dist/Combobox/ComboboxRoot.cjs +2 -1
  21. package/dist/Combobox/ComboboxRoot.cjs.map +1 -1
  22. package/dist/Combobox/ComboboxRoot.js +2 -1
  23. package/dist/Combobox/ComboboxRoot.js.map +1 -1
  24. package/dist/Combobox/ComboboxVirtualizer.cjs.map +1 -1
  25. package/dist/Combobox/ComboboxVirtualizer.js.map +1 -1
  26. package/dist/DateField/DateFieldRoot.cjs +2 -2
  27. package/dist/DateField/DateFieldRoot.cjs.map +1 -1
  28. package/dist/DateField/DateFieldRoot.js +2 -2
  29. package/dist/DateField/DateFieldRoot.js.map +1 -1
  30. package/dist/DateRangeField/DateRangeFieldRoot.cjs +11 -11
  31. package/dist/DateRangeField/DateRangeFieldRoot.cjs.map +1 -1
  32. package/dist/DateRangeField/DateRangeFieldRoot.js +11 -11
  33. package/dist/DateRangeField/DateRangeFieldRoot.js.map +1 -1
  34. package/dist/DateRangePicker/DateRangePickerCalendar.cjs +1 -1
  35. package/dist/DateRangePicker/DateRangePickerCalendar.cjs.map +1 -1
  36. package/dist/DateRangePicker/DateRangePickerCalendar.js +1 -1
  37. package/dist/DateRangePicker/DateRangePickerCalendar.js.map +1 -1
  38. package/dist/DateRangePicker/DateRangePickerRoot.cjs +1 -1
  39. package/dist/DateRangePicker/DateRangePickerRoot.cjs.map +1 -1
  40. package/dist/DateRangePicker/DateRangePickerRoot.js +1 -1
  41. package/dist/DateRangePicker/DateRangePickerRoot.js.map +1 -1
  42. package/dist/Editable/EditableRoot.cjs.map +1 -1
  43. package/dist/Editable/EditableRoot.js.map +1 -1
  44. package/dist/Listbox/ListboxRoot.cjs +4 -4
  45. package/dist/Listbox/ListboxRoot.cjs.map +1 -1
  46. package/dist/Listbox/ListboxRoot.js +4 -4
  47. package/dist/Listbox/ListboxRoot.js.map +1 -1
  48. package/dist/Listbox/ListboxVirtualizer.cjs +2 -2
  49. package/dist/Listbox/ListboxVirtualizer.cjs.map +1 -1
  50. package/dist/Listbox/ListboxVirtualizer.js +2 -2
  51. package/dist/Listbox/ListboxVirtualizer.js.map +1 -1
  52. package/dist/Menu/MenuContentImpl.cjs +2 -2
  53. package/dist/Menu/MenuContentImpl.cjs.map +1 -1
  54. package/dist/Menu/MenuContentImpl.js +2 -2
  55. package/dist/Menu/MenuContentImpl.js.map +1 -1
  56. package/dist/Menu/MenuItemImpl.cjs +4 -3
  57. package/dist/Menu/MenuItemImpl.cjs.map +1 -1
  58. package/dist/Menu/MenuItemImpl.js +4 -3
  59. package/dist/Menu/MenuItemImpl.js.map +1 -1
  60. package/dist/NumberField/NumberFieldInput.cjs +17 -3
  61. package/dist/NumberField/NumberFieldInput.cjs.map +1 -1
  62. package/dist/NumberField/NumberFieldInput.js +18 -4
  63. package/dist/NumberField/NumberFieldInput.js.map +1 -1
  64. package/dist/NumberField/NumberFieldRoot.cjs.map +1 -1
  65. package/dist/NumberField/NumberFieldRoot.js.map +1 -1
  66. package/dist/PinInput/PinInputInput.cjs +17 -8
  67. package/dist/PinInput/PinInputInput.cjs.map +1 -1
  68. package/dist/PinInput/PinInputInput.js +18 -9
  69. package/dist/PinInput/PinInputInput.js.map +1 -1
  70. package/dist/PinInput/PinInputRoot.cjs +4 -2
  71. package/dist/PinInput/PinInputRoot.cjs.map +1 -1
  72. package/dist/PinInput/PinInputRoot.js +5 -3
  73. package/dist/PinInput/PinInputRoot.js.map +1 -1
  74. package/dist/Progress/ProgressRoot.cjs.map +1 -1
  75. package/dist/Progress/ProgressRoot.js.map +1 -1
  76. package/dist/RangeCalendar/RangeCalendarRoot.cjs +8 -6
  77. package/dist/RangeCalendar/RangeCalendarRoot.cjs.map +1 -1
  78. package/dist/RangeCalendar/RangeCalendarRoot.js +9 -7
  79. package/dist/RangeCalendar/RangeCalendarRoot.js.map +1 -1
  80. package/dist/Select/SelectContentImpl.cjs +2 -2
  81. package/dist/Select/SelectContentImpl.cjs.map +1 -1
  82. package/dist/Select/SelectContentImpl.js +2 -2
  83. package/dist/Select/SelectContentImpl.js.map +1 -1
  84. package/dist/Select/SelectItem.cjs +4 -2
  85. package/dist/Select/SelectItem.cjs.map +1 -1
  86. package/dist/Select/SelectItem.js +4 -2
  87. package/dist/Select/SelectItem.js.map +1 -1
  88. package/dist/Select/SelectItemText.cjs +1 -1
  89. package/dist/Select/SelectItemText.cjs.map +1 -1
  90. package/dist/Select/SelectItemText.js +1 -1
  91. package/dist/Select/SelectItemText.js.map +1 -1
  92. package/dist/Select/SelectRoot.cjs +8 -7
  93. package/dist/Select/SelectRoot.cjs.map +1 -1
  94. package/dist/Select/SelectRoot.js +8 -7
  95. package/dist/Select/SelectRoot.js.map +1 -1
  96. package/dist/Select/SelectTrigger.cjs +1 -2
  97. package/dist/Select/SelectTrigger.cjs.map +1 -1
  98. package/dist/Select/SelectTrigger.js +1 -2
  99. package/dist/Select/SelectTrigger.js.map +1 -1
  100. package/dist/Slider/SliderRange.cjs +3 -3
  101. package/dist/Slider/SliderRange.cjs.map +1 -1
  102. package/dist/Slider/SliderRange.js +3 -3
  103. package/dist/Slider/SliderRange.js.map +1 -1
  104. package/dist/Slider/SliderRoot.cjs +10 -8
  105. package/dist/Slider/SliderRoot.cjs.map +1 -1
  106. package/dist/Slider/SliderRoot.js +11 -9
  107. package/dist/Slider/SliderRoot.js.map +1 -1
  108. package/dist/Slider/SliderThumbImpl.cjs +0 -1
  109. package/dist/Slider/SliderThumbImpl.cjs.map +1 -1
  110. package/dist/Slider/SliderThumbImpl.js +0 -1
  111. package/dist/Slider/SliderThumbImpl.js.map +1 -1
  112. package/dist/Switch/SwitchRoot.cjs +1 -1
  113. package/dist/Switch/SwitchRoot.cjs.map +1 -1
  114. package/dist/Switch/SwitchRoot.js +1 -1
  115. package/dist/Switch/SwitchRoot.js.map +1 -1
  116. package/dist/TagsInput/TagsInputRoot.cjs +9 -7
  117. package/dist/TagsInput/TagsInputRoot.cjs.map +1 -1
  118. package/dist/TagsInput/TagsInputRoot.js +10 -8
  119. package/dist/TagsInput/TagsInputRoot.js.map +1 -1
  120. package/dist/TimeField/TimeFieldRoot.cjs.map +1 -1
  121. package/dist/TimeField/TimeFieldRoot.js.map +1 -1
  122. package/dist/Toggle/Toggle.cjs +1 -1
  123. package/dist/Toggle/Toggle.cjs.map +1 -1
  124. package/dist/Toggle/Toggle.js +1 -1
  125. package/dist/Toggle/Toggle.js.map +1 -1
  126. package/dist/ToggleGroup/ToggleGroupItem.cjs +1 -1
  127. package/dist/ToggleGroup/ToggleGroupItem.js +1 -1
  128. package/dist/ToggleGroup/ToggleGroupRoot.cjs.map +1 -1
  129. package/dist/ToggleGroup/ToggleGroupRoot.js.map +1 -1
  130. package/dist/Toolbar/ToolbarToggleItem.cjs +1 -1
  131. package/dist/Toolbar/ToolbarToggleItem.js +1 -1
  132. package/dist/Tree/TreeRoot.cjs +1 -1
  133. package/dist/Tree/TreeRoot.cjs.map +1 -1
  134. package/dist/Tree/TreeRoot.js +1 -1
  135. package/dist/Tree/TreeRoot.js.map +1 -1
  136. package/dist/index.d.ts +73 -63
  137. package/dist/shared/nullish.cjs.map +1 -1
  138. package/dist/shared/nullish.js.map +1 -1
  139. package/dist/shared/useBodyScrollLock.cjs +1 -2
  140. package/dist/shared/useBodyScrollLock.cjs.map +1 -1
  141. package/dist/shared/useBodyScrollLock.js +1 -2
  142. package/dist/shared/useBodyScrollLock.js.map +1 -1
  143. package/dist/shared/useSingleOrMultipleValue.cjs +2 -33
  144. package/dist/shared/useSingleOrMultipleValue.cjs.map +1 -1
  145. package/dist/shared/useSingleOrMultipleValue.js +3 -34
  146. package/dist/shared/useSingleOrMultipleValue.js.map +1 -1
  147. package/dist/shared/useTypeahead.cjs +16 -15
  148. package/dist/shared/useTypeahead.cjs.map +1 -1
  149. package/dist/shared/useTypeahead.js +16 -15
  150. package/dist/shared/useTypeahead.js.map +1 -1
  151. package/package.json +2 -3
package/README.md CHANGED
@@ -70,12 +70,6 @@ We would love to have your contributions! All PRs all welcomed! We need help bui
70
70
  4. Open `http://localhost:6006`
71
71
  5. Run `pnpm test` to test changes
72
72
 
73
- ## Core Team
74
-
75
- - [Zernonia](https://github.com/zernonia)
76
- - [Khairul Haaziq](https://github.com/k11q)
77
- - [Mujahid Anuar](https://github.com/mujahidfa)
78
-
79
73
  ## Credits
80
74
 
81
75
  All credits go to these open-source works and resources
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
- const vue = require('vue');
4
3
  require('@vueuse/core');
4
+ const vue = require('vue');
5
5
  const Accordion_AccordionItem = require('./AccordionItem.cjs');
6
6
  const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
7
7
  const Collapsible_CollapsibleContent = require('../Collapsible/CollapsibleContent.cjs');
@@ -1,5 +1,5 @@
1
- import { defineComponent, openBlock, createBlock, unref, withCtx, renderSlot } from 'vue';
2
1
  import '@vueuse/core';
2
+ import { defineComponent, openBlock, createBlock, unref, withCtx, renderSlot } from 'vue';
3
3
  import { i as injectAccordionItemContext } from './AccordionItem.js';
4
4
  import { u as useForwardExpose } from '../shared/useForwardExpose.js';
5
5
  import { _ as _sfc_main$1 } from '../Collapsible/CollapsibleContent.js';
@@ -24,7 +24,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
24
24
  () => rootContext.isSingle.value ? props.value === rootContext.modelValue.value : Array.isArray(rootContext.modelValue.value) && rootContext.modelValue.value.includes(props.value)
25
25
  );
26
26
  const disabled = vue.computed(() => {
27
- return rootContext.disabled.value || props.disabled || rootContext.isSingle.value && open.value && !rootContext.collapsible;
27
+ return rootContext.disabled.value || props.disabled;
28
28
  });
29
29
  const dataDisabled = vue.computed(() => disabled.value ? "" : void 0);
30
30
  const dataState = vue.computed(
@@ -43,6 +43,11 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
43
43
  value: vue.computed(() => props.value)
44
44
  });
45
45
  function handleArrowKey(e) {
46
+ const target = e.target;
47
+ const allCollectionItems = Array.from(rootContext.parentElement.value?.querySelectorAll("[data-reka-collection-item]") ?? []);
48
+ const collectionItemIndex = allCollectionItems.findIndex((item) => item === target);
49
+ if (collectionItemIndex === -1)
50
+ return null;
46
51
  shared_useArrowNavigation.useArrowNavigation(
47
52
  e,
48
53
  currentElement.value,
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionItem.cjs","sources":["../../src/Accordion/AccordionItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef, VNodeRef } from 'vue'\nimport type { CollapsibleRootProps } from '../Collapsible'\nimport { injectAccordionRootContext } from './AccordionRoot.vue'\nimport { createContext, useArrowNavigation, useForwardExpose } from '@/shared'\n\nenum AccordionItemState {\n Open = 'open',\n Closed = 'closed',\n}\n\nexport interface AccordionItemProps\n extends Omit<CollapsibleRootProps, 'open' | 'defaultOpen' | 'onOpenChange'> {\n /**\n * Whether or not an accordion item is disabled from user interaction.\n * When `true`, prevents the user from interacting with the item.\n *\n * @defaultValue false\n */\n disabled?: boolean\n /**\n * A string value for the accordion item. All items within an accordion should use a unique value.\n */\n value: string\n}\n\ninterface AccordionItemContext {\n open: ComputedRef<boolean>\n dataState: ComputedRef<AccordionItemState>\n disabled: ComputedRef<boolean>\n dataDisabled: ComputedRef<'' | undefined>\n triggerId: string\n currentRef: VNodeRef\n currentElement: ComputedRef<HTMLElement | undefined>\n value: ComputedRef<string>\n}\n\nexport const [injectAccordionItemContext, provideAccordionItemContext]\n = createContext<AccordionItemContext>('AccordionItem')\n</script>\n\n<script setup lang=\"ts\">\nimport { CollapsibleRoot } from '@/Collapsible'\nimport { computed } from 'vue'\n\nconst props = defineProps<AccordionItemProps>()\n\ndefineSlots<{\n default: (props: {\n /** Current open state */\n open: typeof open.value\n }) => any\n}>()\n\nconst rootContext = injectAccordionRootContext()\n\nconst open = computed(() =>\n rootContext.isSingle.value\n ? props.value === rootContext.modelValue.value\n : Array.isArray(rootContext.modelValue.value)\n && rootContext.modelValue.value.includes(props.value),\n)\n\nconst disabled = computed(() => {\n return (\n rootContext.disabled.value\n || props.disabled\n || (rootContext.isSingle.value && open.value && !rootContext.collapsible)\n )\n})\n\nconst dataDisabled = computed(() => (disabled.value ? '' : undefined))\n\nconst dataState = computed(() =>\n open.value ? AccordionItemState.Open : AccordionItemState.Closed,\n)\n\ndefineExpose({ open, dataDisabled })\nconst { currentRef, currentElement } = useForwardExpose()\n\nprovideAccordionItemContext({\n open,\n dataState,\n disabled,\n dataDisabled,\n triggerId: '',\n currentRef,\n currentElement,\n value: computed(() => props.value),\n})\n\nfunction handleArrowKey(e: KeyboardEvent) {\n useArrowNavigation(\n e,\n currentElement.value,\n rootContext.parentElement.value!,\n {\n arrowKeyOptions: rootContext.orientation,\n dir: rootContext.direction.value,\n focus: true,\n },\n )\n}\n</script>\n\n<template>\n <CollapsibleRoot\n :data-orientation=\"rootContext.orientation\"\n :data-disabled=\"dataDisabled\"\n :data-state=\"dataState\"\n :disabled=\"disabled\"\n :open=\"open\"\n :as=\"props.as\"\n :as-child=\"props.asChild\"\n :unmount-on-hide=\"rootContext.unmountOnHide.value\"\n @keydown.up.down.left.right.home.end=\"handleArrowKey\"\n >\n <slot :open=\"open\" />\n </CollapsibleRoot>\n</template>\n"],"names":["createContext","injectAccordionRootContext","computed","useForwardExpose","useArrowNavigation"],"mappings":";;;;;;;;;AAqCO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjEA,mCAAoC,eAAe,EAAA;;;;;;;;;;;AAOvD,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AASd,IAAA,MAAM,cAAcC,kDAA2B,EAAA,CAAA;AAE/C,IAAA,MAAM,IAAO,GAAAC,YAAA;AAAA,MAAS,MACpB,YAAY,QAAS,CAAA,KAAA,GACjB,MAAM,KAAU,KAAA,WAAA,CAAY,WAAW,KACvC,GAAA,KAAA,CAAM,QAAQ,WAAY,CAAA,UAAA,CAAW,KAAK,CACvC,IAAA,WAAA,CAAY,WAAW,KAAM,CAAA,QAAA,CAAS,MAAM,KAAK,CAAA;AAAA,KAC1D,CAAA;AAEA,IAAM,MAAA,QAAA,GAAWA,aAAS,MAAM;AAC9B,MACE,OAAA,WAAA,CAAY,QAAS,CAAA,KAAA,IAClB,KAAM,CAAA,QAAA,IACL,WAAY,CAAA,QAAA,CAAS,KAAS,IAAA,IAAA,CAAK,KAAS,IAAA,CAAC,WAAY,CAAA,WAAA,CAAA;AAAA,KAEhE,CAAA,CAAA;AAED,IAAA,MAAM,eAAeA,YAAS,CAAA,MAAO,QAAS,CAAA,KAAA,GAAQ,KAAK,KAAU,CAAA,CAAA,CAAA;AAErE,IAAA,MAAM,SAAY,GAAAA,YAAA;AAAA,MAAS,MACzB,IAAK,CAAA,KAAA,GAAQ,MAA0B,cAAA,QAAA;AAAA,KACzC,CAAA;AAEA,IAAa,QAAA,CAAA,EAAE,IAAM,EAAA,YAAA,EAAc,CAAA,CAAA;AACnC,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA,CAAA;AAExD,IAA4B,2BAAA,CAAA;AAAA,MAC1B,IAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,YAAA;AAAA,MACA,SAAW,EAAA,EAAA;AAAA,MACX,UAAA;AAAA,MACA,cAAA;AAAA,MACA,KAAO,EAAAD,YAAA,CAAS,MAAM,KAAA,CAAM,KAAK,CAAA;AAAA,KAClC,CAAA,CAAA;AAED,IAAA,SAAS,eAAe,CAAkB,EAAA;AACxC,MAAAE,4CAAA;AAAA,QACE,CAAA;AAAA,QACA,cAAe,CAAA,KAAA;AAAA,QACf,YAAY,aAAc,CAAA,KAAA;AAAA,QAC1B;AAAA,UACE,iBAAiB,WAAY,CAAA,WAAA;AAAA,UAC7B,GAAA,EAAK,YAAY,SAAU,CAAA,KAAA;AAAA,UAC3B,KAAO,EAAA,IAAA;AAAA,SACT;AAAA,OACF,CAAA;AAAA,KACF;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AccordionItem.cjs","sources":["../../src/Accordion/AccordionItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef, VNodeRef } from 'vue'\nimport type { CollapsibleRootProps } from '../Collapsible'\nimport { injectAccordionRootContext } from './AccordionRoot.vue'\nimport { createContext, useArrowNavigation, useForwardExpose } from '@/shared'\n\nenum AccordionItemState {\n Open = 'open',\n Closed = 'closed',\n}\n\nexport interface AccordionItemProps\n extends Omit<CollapsibleRootProps, 'open' | 'defaultOpen' | 'onOpenChange'> {\n /**\n * Whether or not an accordion item is disabled from user interaction.\n * When `true`, prevents the user from interacting with the item.\n *\n * @defaultValue false\n */\n disabled?: boolean\n /**\n * A string value for the accordion item. All items within an accordion should use a unique value.\n */\n value: string\n}\n\ninterface AccordionItemContext {\n open: ComputedRef<boolean>\n dataState: ComputedRef<AccordionItemState>\n disabled: ComputedRef<boolean>\n dataDisabled: ComputedRef<'' | undefined>\n triggerId: string\n currentRef: VNodeRef\n currentElement: ComputedRef<HTMLElement | undefined>\n value: ComputedRef<string>\n}\n\nexport const [injectAccordionItemContext, provideAccordionItemContext]\n = createContext<AccordionItemContext>('AccordionItem')\n</script>\n\n<script setup lang=\"ts\">\nimport { CollapsibleRoot } from '@/Collapsible'\nimport { computed } from 'vue'\n\nconst props = defineProps<AccordionItemProps>()\n\ndefineSlots<{\n default: (props: {\n /** Current open state */\n open: typeof open.value\n }) => any\n}>()\n\nconst rootContext = injectAccordionRootContext()\n\nconst open = computed(() =>\n rootContext.isSingle.value\n ? props.value === rootContext.modelValue.value\n : Array.isArray(rootContext.modelValue.value)\n && rootContext.modelValue.value.includes(props.value),\n)\n\nconst disabled = computed(() => {\n return (rootContext.disabled.value || props.disabled)\n})\n\nconst dataDisabled = computed(() => (disabled.value ? '' : undefined))\n\nconst dataState = computed(() =>\n open.value ? AccordionItemState.Open : AccordionItemState.Closed,\n)\n\ndefineExpose({ open, dataDisabled })\nconst { currentRef, currentElement } = useForwardExpose()\n\nprovideAccordionItemContext({\n open,\n dataState,\n disabled,\n dataDisabled,\n triggerId: '',\n currentRef,\n currentElement,\n value: computed(() => props.value),\n})\n\nfunction handleArrowKey(e: KeyboardEvent) {\n const target = e.target as HTMLElement\n const allCollectionItems: HTMLElement[] = Array.from(rootContext.parentElement.value?.querySelectorAll('[data-reka-collection-item]') ?? [])\n\n const collectionItemIndex = allCollectionItems.findIndex(item => item === target)\n if (collectionItemIndex === -1)\n return null\n\n useArrowNavigation(\n e,\n currentElement.value,\n rootContext.parentElement.value!,\n {\n arrowKeyOptions: rootContext.orientation,\n dir: rootContext.direction.value,\n focus: true,\n },\n )\n}\n</script>\n\n<template>\n <CollapsibleRoot\n :data-orientation=\"rootContext.orientation\"\n :data-disabled=\"dataDisabled\"\n :data-state=\"dataState\"\n :disabled=\"disabled\"\n :open=\"open\"\n :as=\"props.as\"\n :as-child=\"props.asChild\"\n :unmount-on-hide=\"rootContext.unmountOnHide.value\"\n @keydown.up.down.left.right.home.end=\"handleArrowKey\"\n >\n <slot :open=\"open\" />\n </CollapsibleRoot>\n</template>\n"],"names":["createContext","injectAccordionRootContext","computed","useForwardExpose","useArrowNavigation"],"mappings":";;;;;;;;;AAqCO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjEA,mCAAoC,eAAe,EAAA;;;;;;;;;;;AAOvD,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AASd,IAAA,MAAM,cAAcC,kDAA2B,EAAA,CAAA;AAE/C,IAAA,MAAM,IAAO,GAAAC,YAAA;AAAA,MAAS,MACpB,YAAY,QAAS,CAAA,KAAA,GACjB,MAAM,KAAU,KAAA,WAAA,CAAY,WAAW,KACvC,GAAA,KAAA,CAAM,QAAQ,WAAY,CAAA,UAAA,CAAW,KAAK,CACvC,IAAA,WAAA,CAAY,WAAW,KAAM,CAAA,QAAA,CAAS,MAAM,KAAK,CAAA;AAAA,KAC1D,CAAA;AAEA,IAAM,MAAA,QAAA,GAAWA,aAAS,MAAM;AAC9B,MAAQ,OAAA,WAAA,CAAY,QAAS,CAAA,KAAA,IAAS,KAAM,CAAA,QAAA,CAAA;AAAA,KAC7C,CAAA,CAAA;AAED,IAAA,MAAM,eAAeA,YAAS,CAAA,MAAO,QAAS,CAAA,KAAA,GAAQ,KAAK,KAAU,CAAA,CAAA,CAAA;AAErE,IAAA,MAAM,SAAY,GAAAA,YAAA;AAAA,MAAS,MACzB,IAAK,CAAA,KAAA,GAAQ,MAA0B,cAAA,QAAA;AAAA,KACzC,CAAA;AAEA,IAAa,QAAA,CAAA,EAAE,IAAM,EAAA,YAAA,EAAc,CAAA,CAAA;AACnC,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA,CAAA;AAExD,IAA4B,2BAAA,CAAA;AAAA,MAC1B,IAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,YAAA;AAAA,MACA,SAAW,EAAA,EAAA;AAAA,MACX,UAAA;AAAA,MACA,cAAA;AAAA,MACA,KAAO,EAAAD,YAAA,CAAS,MAAM,KAAA,CAAM,KAAK,CAAA;AAAA,KAClC,CAAA,CAAA;AAED,IAAA,SAAS,eAAe,CAAkB,EAAA;AACxC,MAAA,MAAM,SAAS,CAAE,CAAA,MAAA,CAAA;AACjB,MAAM,MAAA,kBAAA,GAAoC,KAAM,CAAA,IAAA,CAAK,WAAY,CAAA,aAAA,CAAc,OAAO,gBAAiB,CAAA,6BAA6B,CAAK,IAAA,EAAE,CAAA,CAAA;AAE3I,MAAA,MAAM,mBAAsB,GAAA,kBAAA,CAAmB,SAAU,CAAA,CAAA,IAAA,KAAQ,SAAS,MAAM,CAAA,CAAA;AAChF,MAAA,IAAI,mBAAwB,KAAA,CAAA,CAAA;AAC1B,QAAO,OAAA,IAAA,CAAA;AAET,MAAAE,4CAAA;AAAA,QACE,CAAA;AAAA,QACA,cAAe,CAAA,KAAA;AAAA,QACf,YAAY,aAAc,CAAA,KAAA;AAAA,QAC1B;AAAA,UACE,iBAAiB,WAAY,CAAA,WAAA;AAAA,UAC7B,GAAA,EAAK,YAAY,SAAU,CAAA,KAAA;AAAA,UAC3B,KAAO,EAAA,IAAA;AAAA,SACT;AAAA,OACF,CAAA;AAAA,KACF;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -22,7 +22,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
22
22
  () => rootContext.isSingle.value ? props.value === rootContext.modelValue.value : Array.isArray(rootContext.modelValue.value) && rootContext.modelValue.value.includes(props.value)
23
23
  );
24
24
  const disabled = computed(() => {
25
- return rootContext.disabled.value || props.disabled || rootContext.isSingle.value && open.value && !rootContext.collapsible;
25
+ return rootContext.disabled.value || props.disabled;
26
26
  });
27
27
  const dataDisabled = computed(() => disabled.value ? "" : void 0);
28
28
  const dataState = computed(
@@ -41,6 +41,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
41
41
  value: computed(() => props.value)
42
42
  });
43
43
  function handleArrowKey(e) {
44
+ const target = e.target;
45
+ const allCollectionItems = Array.from(rootContext.parentElement.value?.querySelectorAll("[data-reka-collection-item]") ?? []);
46
+ const collectionItemIndex = allCollectionItems.findIndex((item) => item === target);
47
+ if (collectionItemIndex === -1)
48
+ return null;
44
49
  useArrowNavigation(
45
50
  e,
46
51
  currentElement.value,
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionItem.js","sources":["../../src/Accordion/AccordionItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef, VNodeRef } from 'vue'\nimport type { CollapsibleRootProps } from '../Collapsible'\nimport { injectAccordionRootContext } from './AccordionRoot.vue'\nimport { createContext, useArrowNavigation, useForwardExpose } from '@/shared'\n\nenum AccordionItemState {\n Open = 'open',\n Closed = 'closed',\n}\n\nexport interface AccordionItemProps\n extends Omit<CollapsibleRootProps, 'open' | 'defaultOpen' | 'onOpenChange'> {\n /**\n * Whether or not an accordion item is disabled from user interaction.\n * When `true`, prevents the user from interacting with the item.\n *\n * @defaultValue false\n */\n disabled?: boolean\n /**\n * A string value for the accordion item. All items within an accordion should use a unique value.\n */\n value: string\n}\n\ninterface AccordionItemContext {\n open: ComputedRef<boolean>\n dataState: ComputedRef<AccordionItemState>\n disabled: ComputedRef<boolean>\n dataDisabled: ComputedRef<'' | undefined>\n triggerId: string\n currentRef: VNodeRef\n currentElement: ComputedRef<HTMLElement | undefined>\n value: ComputedRef<string>\n}\n\nexport const [injectAccordionItemContext, provideAccordionItemContext]\n = createContext<AccordionItemContext>('AccordionItem')\n</script>\n\n<script setup lang=\"ts\">\nimport { CollapsibleRoot } from '@/Collapsible'\nimport { computed } from 'vue'\n\nconst props = defineProps<AccordionItemProps>()\n\ndefineSlots<{\n default: (props: {\n /** Current open state */\n open: typeof open.value\n }) => any\n}>()\n\nconst rootContext = injectAccordionRootContext()\n\nconst open = computed(() =>\n rootContext.isSingle.value\n ? props.value === rootContext.modelValue.value\n : Array.isArray(rootContext.modelValue.value)\n && rootContext.modelValue.value.includes(props.value),\n)\n\nconst disabled = computed(() => {\n return (\n rootContext.disabled.value\n || props.disabled\n || (rootContext.isSingle.value && open.value && !rootContext.collapsible)\n )\n})\n\nconst dataDisabled = computed(() => (disabled.value ? '' : undefined))\n\nconst dataState = computed(() =>\n open.value ? AccordionItemState.Open : AccordionItemState.Closed,\n)\n\ndefineExpose({ open, dataDisabled })\nconst { currentRef, currentElement } = useForwardExpose()\n\nprovideAccordionItemContext({\n open,\n dataState,\n disabled,\n dataDisabled,\n triggerId: '',\n currentRef,\n currentElement,\n value: computed(() => props.value),\n})\n\nfunction handleArrowKey(e: KeyboardEvent) {\n useArrowNavigation(\n e,\n currentElement.value,\n rootContext.parentElement.value!,\n {\n arrowKeyOptions: rootContext.orientation,\n dir: rootContext.direction.value,\n focus: true,\n },\n )\n}\n</script>\n\n<template>\n <CollapsibleRoot\n :data-orientation=\"rootContext.orientation\"\n :data-disabled=\"dataDisabled\"\n :data-state=\"dataState\"\n :disabled=\"disabled\"\n :open=\"open\"\n :as=\"props.as\"\n :as-child=\"props.asChild\"\n :unmount-on-hide=\"rootContext.unmountOnHide.value\"\n @keydown.up.down.left.right.home.end=\"handleArrowKey\"\n >\n <slot :open=\"open\" />\n </CollapsibleRoot>\n</template>\n"],"names":[],"mappings":";;;;;;;AAqCO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjE,cAAoC,eAAe,EAAA;;;;;;;;;;;AAOvD,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AASd,IAAA,MAAM,cAAc,0BAA2B,EAAA,CAAA;AAE/C,IAAA,MAAM,IAAO,GAAA,QAAA;AAAA,MAAS,MACpB,YAAY,QAAS,CAAA,KAAA,GACjB,MAAM,KAAU,KAAA,WAAA,CAAY,WAAW,KACvC,GAAA,KAAA,CAAM,QAAQ,WAAY,CAAA,UAAA,CAAW,KAAK,CACvC,IAAA,WAAA,CAAY,WAAW,KAAM,CAAA,QAAA,CAAS,MAAM,KAAK,CAAA;AAAA,KAC1D,CAAA;AAEA,IAAM,MAAA,QAAA,GAAW,SAAS,MAAM;AAC9B,MACE,OAAA,WAAA,CAAY,QAAS,CAAA,KAAA,IAClB,KAAM,CAAA,QAAA,IACL,WAAY,CAAA,QAAA,CAAS,KAAS,IAAA,IAAA,CAAK,KAAS,IAAA,CAAC,WAAY,CAAA,WAAA,CAAA;AAAA,KAEhE,CAAA,CAAA;AAED,IAAA,MAAM,eAAe,QAAS,CAAA,MAAO,QAAS,CAAA,KAAA,GAAQ,KAAK,KAAU,CAAA,CAAA,CAAA;AAErE,IAAA,MAAM,SAAY,GAAA,QAAA;AAAA,MAAS,MACzB,IAAK,CAAA,KAAA,GAAQ,MAA0B,cAAA,QAAA;AAAA,KACzC,CAAA;AAEA,IAAa,QAAA,CAAA,EAAE,IAAM,EAAA,YAAA,EAAc,CAAA,CAAA;AACnC,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAExD,IAA4B,2BAAA,CAAA;AAAA,MAC1B,IAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,YAAA;AAAA,MACA,SAAW,EAAA,EAAA;AAAA,MACX,UAAA;AAAA,MACA,cAAA;AAAA,MACA,KAAO,EAAA,QAAA,CAAS,MAAM,KAAA,CAAM,KAAK,CAAA;AAAA,KAClC,CAAA,CAAA;AAED,IAAA,SAAS,eAAe,CAAkB,EAAA;AACxC,MAAA,kBAAA;AAAA,QACE,CAAA;AAAA,QACA,cAAe,CAAA,KAAA;AAAA,QACf,YAAY,aAAc,CAAA,KAAA;AAAA,QAC1B;AAAA,UACE,iBAAiB,WAAY,CAAA,WAAA;AAAA,UAC7B,GAAA,EAAK,YAAY,SAAU,CAAA,KAAA;AAAA,UAC3B,KAAO,EAAA,IAAA;AAAA,SACT;AAAA,OACF,CAAA;AAAA,KACF;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AccordionItem.js","sources":["../../src/Accordion/AccordionItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef, VNodeRef } from 'vue'\nimport type { CollapsibleRootProps } from '../Collapsible'\nimport { injectAccordionRootContext } from './AccordionRoot.vue'\nimport { createContext, useArrowNavigation, useForwardExpose } from '@/shared'\n\nenum AccordionItemState {\n Open = 'open',\n Closed = 'closed',\n}\n\nexport interface AccordionItemProps\n extends Omit<CollapsibleRootProps, 'open' | 'defaultOpen' | 'onOpenChange'> {\n /**\n * Whether or not an accordion item is disabled from user interaction.\n * When `true`, prevents the user from interacting with the item.\n *\n * @defaultValue false\n */\n disabled?: boolean\n /**\n * A string value for the accordion item. All items within an accordion should use a unique value.\n */\n value: string\n}\n\ninterface AccordionItemContext {\n open: ComputedRef<boolean>\n dataState: ComputedRef<AccordionItemState>\n disabled: ComputedRef<boolean>\n dataDisabled: ComputedRef<'' | undefined>\n triggerId: string\n currentRef: VNodeRef\n currentElement: ComputedRef<HTMLElement | undefined>\n value: ComputedRef<string>\n}\n\nexport const [injectAccordionItemContext, provideAccordionItemContext]\n = createContext<AccordionItemContext>('AccordionItem')\n</script>\n\n<script setup lang=\"ts\">\nimport { CollapsibleRoot } from '@/Collapsible'\nimport { computed } from 'vue'\n\nconst props = defineProps<AccordionItemProps>()\n\ndefineSlots<{\n default: (props: {\n /** Current open state */\n open: typeof open.value\n }) => any\n}>()\n\nconst rootContext = injectAccordionRootContext()\n\nconst open = computed(() =>\n rootContext.isSingle.value\n ? props.value === rootContext.modelValue.value\n : Array.isArray(rootContext.modelValue.value)\n && rootContext.modelValue.value.includes(props.value),\n)\n\nconst disabled = computed(() => {\n return (rootContext.disabled.value || props.disabled)\n})\n\nconst dataDisabled = computed(() => (disabled.value ? '' : undefined))\n\nconst dataState = computed(() =>\n open.value ? AccordionItemState.Open : AccordionItemState.Closed,\n)\n\ndefineExpose({ open, dataDisabled })\nconst { currentRef, currentElement } = useForwardExpose()\n\nprovideAccordionItemContext({\n open,\n dataState,\n disabled,\n dataDisabled,\n triggerId: '',\n currentRef,\n currentElement,\n value: computed(() => props.value),\n})\n\nfunction handleArrowKey(e: KeyboardEvent) {\n const target = e.target as HTMLElement\n const allCollectionItems: HTMLElement[] = Array.from(rootContext.parentElement.value?.querySelectorAll('[data-reka-collection-item]') ?? [])\n\n const collectionItemIndex = allCollectionItems.findIndex(item => item === target)\n if (collectionItemIndex === -1)\n return null\n\n useArrowNavigation(\n e,\n currentElement.value,\n rootContext.parentElement.value!,\n {\n arrowKeyOptions: rootContext.orientation,\n dir: rootContext.direction.value,\n focus: true,\n },\n )\n}\n</script>\n\n<template>\n <CollapsibleRoot\n :data-orientation=\"rootContext.orientation\"\n :data-disabled=\"dataDisabled\"\n :data-state=\"dataState\"\n :disabled=\"disabled\"\n :open=\"open\"\n :as=\"props.as\"\n :as-child=\"props.asChild\"\n :unmount-on-hide=\"rootContext.unmountOnHide.value\"\n @keydown.up.down.left.right.home.end=\"handleArrowKey\"\n >\n <slot :open=\"open\" />\n </CollapsibleRoot>\n</template>\n"],"names":[],"mappings":";;;;;;;AAqCO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjE,cAAoC,eAAe,EAAA;;;;;;;;;;;AAOvD,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AASd,IAAA,MAAM,cAAc,0BAA2B,EAAA,CAAA;AAE/C,IAAA,MAAM,IAAO,GAAA,QAAA;AAAA,MAAS,MACpB,YAAY,QAAS,CAAA,KAAA,GACjB,MAAM,KAAU,KAAA,WAAA,CAAY,WAAW,KACvC,GAAA,KAAA,CAAM,QAAQ,WAAY,CAAA,UAAA,CAAW,KAAK,CACvC,IAAA,WAAA,CAAY,WAAW,KAAM,CAAA,QAAA,CAAS,MAAM,KAAK,CAAA;AAAA,KAC1D,CAAA;AAEA,IAAM,MAAA,QAAA,GAAW,SAAS,MAAM;AAC9B,MAAQ,OAAA,WAAA,CAAY,QAAS,CAAA,KAAA,IAAS,KAAM,CAAA,QAAA,CAAA;AAAA,KAC7C,CAAA,CAAA;AAED,IAAA,MAAM,eAAe,QAAS,CAAA,MAAO,QAAS,CAAA,KAAA,GAAQ,KAAK,KAAU,CAAA,CAAA,CAAA;AAErE,IAAA,MAAM,SAAY,GAAA,QAAA;AAAA,MAAS,MACzB,IAAK,CAAA,KAAA,GAAQ,MAA0B,cAAA,QAAA;AAAA,KACzC,CAAA;AAEA,IAAa,QAAA,CAAA,EAAE,IAAM,EAAA,YAAA,EAAc,CAAA,CAAA;AACnC,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAExD,IAA4B,2BAAA,CAAA;AAAA,MAC1B,IAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,YAAA;AAAA,MACA,SAAW,EAAA,EAAA;AAAA,MACX,UAAA;AAAA,MACA,cAAA;AAAA,MACA,KAAO,EAAA,QAAA,CAAS,MAAM,KAAA,CAAM,KAAK,CAAA;AAAA,KAClC,CAAA,CAAA;AAED,IAAA,SAAS,eAAe,CAAkB,EAAA;AACxC,MAAA,MAAM,SAAS,CAAE,CAAA,MAAA,CAAA;AACjB,MAAM,MAAA,kBAAA,GAAoC,KAAM,CAAA,IAAA,CAAK,WAAY,CAAA,aAAA,CAAc,OAAO,gBAAiB,CAAA,6BAA6B,CAAK,IAAA,EAAE,CAAA,CAAA;AAE3I,MAAA,MAAM,mBAAsB,GAAA,kBAAA,CAAmB,SAAU,CAAA,CAAA,IAAA,KAAQ,SAAS,MAAM,CAAA,CAAA;AAChF,MAAA,IAAI,mBAAwB,KAAA,CAAA,CAAA;AAC1B,QAAO,OAAA,IAAA,CAAA;AAET,MAAA,kBAAA;AAAA,QACE,CAAA;AAAA,QACA,cAAe,CAAA,KAAA;AAAA,QACf,YAAY,aAAc,CAAA,KAAA;AAAA,QAC1B;AAAA,UACE,iBAAiB,WAAY,CAAA,WAAA;AAAA,UAC7B,GAAA,EAAK,YAAY,SAAU,CAAA,KAAA;AAAA,UAC3B,KAAO,EAAA,IAAA;AAAA,SACT;AAAA,OACF,CAAA;AAAA,KACF;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionRoot.cjs","sources":["../../src/Accordion/AccordionRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef, Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, DataOrientation, Direction, SingleOrMultipleProps, SingleOrMultipleType } from '@/shared/types'\nimport { createContext, useDirection, useForwardExpose } from '@/shared'\n\nexport interface AccordionRootProps<ValidValue = string | string[], ExplicitType = SingleOrMultipleType>\n extends PrimitiveProps, SingleOrMultipleProps<ValidValue, ExplicitType> {\n /**\n * When type is \"single\", allows closing content when clicking trigger for an open item.\n * When type is \"multiple\", this prop has no effect.\n *\n * @defaultValue false\n */\n collapsible?: boolean\n\n /**\n * When `true`, prevents the user from interacting with the accordion and all its items\n *\n * @defaultValue false\n */\n disabled?: boolean\n\n /**\n * The reading direction of the accordion when applicable. If omitted, assumes LTR (left-to-right) reading mode.\n *\n * @defaultValue \"ltr\"\n */\n dir?: Direction\n\n /**\n * The orientation of the accordion.\n *\n * @defaultValue \"vertical\"\n */\n orientation?: DataOrientation\n\n /**\n * When `true`, the element will be unmounted on closed state.\n *\n * @defaultValue `true`\n */\n unmountOnHide?: boolean\n}\n\nexport type AccordionRootEmits<T extends SingleOrMultipleType = SingleOrMultipleType> = {\n /**\n * Event handler called when the expanded state of an item changes\n */\n 'update:modelValue': [value: (T extends 'single' ? string : string[]) | undefined]\n}\n\nexport type AccordionRootContext<P extends AccordionRootProps> = {\n disabled: Ref<P['disabled']>\n direction: Ref<P['dir']>\n orientation: P['orientation']\n parentElement: Ref<HTMLElement | undefined>\n changeModelValue: (value: string) => void\n isSingle: ComputedRef<boolean>\n modelValue: Ref<AcceptableValue | AcceptableValue[] | undefined>\n collapsible: boolean\n unmountOnHide: Ref<boolean>\n}\n\nexport const [injectAccordionRootContext, provideAccordionRootContext]\n = createContext<AccordionRootContext<AccordionRootProps>>('AccordionRoot')\n</script>\n\n<script setup lang=\"ts\" generic=\"ValidValue extends (AcceptableValue | AcceptableValue[]), ExplicitType extends SingleOrMultipleType\">\nimport { Primitive } from '@/Primitive'\nimport { useSingleOrMultipleValue } from '@/shared/useSingleOrMultipleValue'\nimport { toRefs } from 'vue'\n\nconst props = withDefaults(defineProps<AccordionRootProps<ValidValue, ExplicitType>>(), {\n disabled: false,\n orientation: 'vertical',\n collapsible: false,\n unmountOnHide: true,\n})\n\nconst emits = defineEmits<AccordionRootEmits<ExplicitType>>()\n\ndefineSlots<{\n default: (props: {\n /** Current active value */\n modelValue: typeof modelValue.value\n }) => any\n}>()\n\nconst { dir, disabled, unmountOnHide } = toRefs(props)\nconst direction = useDirection(dir)\n\nconst { modelValue, changeModelValue, isSingle } = useSingleOrMultipleValue(props, emits)\n\nconst { forwardRef, currentElement: parentElement } = useForwardExpose()\n\nprovideAccordionRootContext({\n disabled,\n direction,\n orientation: props.orientation,\n parentElement,\n isSingle,\n collapsible: props.collapsible,\n modelValue,\n changeModelValue,\n unmountOnHide,\n})\n</script>\n\n<template>\n <Primitive\n :ref=\"forwardRef\"\n :as-child=\"asChild\"\n :as=\"as\"\n >\n <slot :model-value=\"modelValue\" />\n </Primitive>\n</template>\n"],"names":["createContext","toRefs","useDirection","useSingleOrMultipleValue","useForwardExpose"],"mappings":";;;;;;;;;AAgEO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjEA,mCAAwD,eAAe,EAAA;;;;;;;;;;;;;;;;;AAQ3E,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAOd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AASd,IAAA,MAAM,EAAE,GAAK,EAAA,QAAA,EAAU,aAAc,EAAA,GAAIC,WAAO,KAAK,CAAA,CAAA;AACrD,IAAM,MAAA,SAAA,GAAYC,iCAAa,GAAG,CAAA,CAAA;AAElC,IAAA,MAAM,EAAE,UAAY,EAAA,gBAAA,EAAkB,UAAa,GAAAC,wDAAA,CAAyB,OAAO,KAAK,CAAA,CAAA;AAExF,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,aAAA,KAAkBC,wCAAiB,EAAA,CAAA;AAEvE,IAA4B,2BAAA,CAAA;AAAA,MAC1B,QAAA;AAAA,MACA,SAAA;AAAA,MACA,aAAa,KAAM,CAAA,WAAA;AAAA,MACnB,aAAA;AAAA,MACA,QAAA;AAAA,MACA,aAAa,KAAM,CAAA,WAAA;AAAA,MACnB,UAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AccordionRoot.cjs","sources":["../../src/Accordion/AccordionRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef, Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, DataOrientation, Direction, SingleOrMultipleProps, SingleOrMultipleType } from '@/shared/types'\nimport { createContext, useDirection, useForwardExpose } from '@/shared'\n\nexport interface AccordionRootProps<T = string | string[]>\n extends PrimitiveProps, SingleOrMultipleProps<T> {\n /**\n * When type is \"single\", allows closing content when clicking trigger for an open item.\n * When type is \"multiple\", this prop has no effect.\n *\n * @defaultValue false\n */\n collapsible?: boolean\n\n /**\n * When `true`, prevents the user from interacting with the accordion and all its items\n *\n * @defaultValue false\n */\n disabled?: boolean\n\n /**\n * The reading direction of the accordion when applicable. If omitted, assumes LTR (left-to-right) reading mode.\n *\n * @defaultValue \"ltr\"\n */\n dir?: Direction\n\n /**\n * The orientation of the accordion.\n *\n * @defaultValue \"vertical\"\n */\n orientation?: DataOrientation\n\n /**\n * When `true`, the element will be unmounted on closed state.\n *\n * @defaultValue `true`\n */\n unmountOnHide?: boolean\n}\n\nexport type AccordionRootEmits<T extends SingleOrMultipleType = SingleOrMultipleType> = {\n /**\n * Event handler called when the expanded state of an item changes\n */\n 'update:modelValue': [value: (T extends 'single' ? string : string[]) | undefined]\n}\n\nexport type AccordionRootContext<P extends AccordionRootProps> = {\n disabled: Ref<P['disabled']>\n direction: Ref<P['dir']>\n orientation: P['orientation']\n parentElement: Ref<HTMLElement | undefined>\n changeModelValue: (value: string) => void\n isSingle: ComputedRef<boolean>\n modelValue: Ref<AcceptableValue | AcceptableValue[] | undefined>\n collapsible: boolean\n unmountOnHide: Ref<boolean>\n}\n\nexport const [injectAccordionRootContext, provideAccordionRootContext]\n = createContext<AccordionRootContext<AccordionRootProps>>('AccordionRoot')\n</script>\n\n<script setup lang=\"ts\" generic=\"T extends (string | string[]), ExplicitType extends SingleOrMultipleType\">\nimport { Primitive } from '@/Primitive'\nimport { useSingleOrMultipleValue } from '@/shared/useSingleOrMultipleValue'\nimport { toRefs } from 'vue'\n\nconst props = withDefaults(defineProps<AccordionRootProps<T>>(), {\n disabled: false,\n orientation: 'vertical',\n collapsible: false,\n unmountOnHide: true,\n})\n\nconst emits = defineEmits<AccordionRootEmits<ExplicitType>>()\n\ndefineSlots<{\n default: (props: {\n /** Current active value */\n modelValue: typeof modelValue.value\n }) => any\n}>()\n\nconst { dir, disabled, unmountOnHide } = toRefs(props)\nconst direction = useDirection(dir)\n\nconst { modelValue, changeModelValue, isSingle } = useSingleOrMultipleValue(props, emits)\n\nconst { forwardRef, currentElement: parentElement } = useForwardExpose()\n\nprovideAccordionRootContext({\n disabled,\n direction,\n orientation: props.orientation,\n parentElement,\n isSingle,\n collapsible: props.collapsible,\n modelValue,\n changeModelValue,\n unmountOnHide,\n})\n</script>\n\n<template>\n <Primitive\n :ref=\"forwardRef\"\n :as-child=\"asChild\"\n :as=\"as\"\n >\n <slot :model-value=\"modelValue\" />\n </Primitive>\n</template>\n"],"names":["createContext","toRefs","useDirection","useSingleOrMultipleValue","useForwardExpose"],"mappings":";;;;;;;;;AAgEO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjEA,mCAAwD,eAAe,EAAA;;;;;;;;;;;;;;;;;AAQ3E,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAOd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AASd,IAAA,MAAM,EAAE,GAAK,EAAA,QAAA,EAAU,aAAc,EAAA,GAAIC,WAAO,KAAK,CAAA,CAAA;AACrD,IAAM,MAAA,SAAA,GAAYC,iCAAa,GAAG,CAAA,CAAA;AAElC,IAAA,MAAM,EAAE,UAAY,EAAA,gBAAA,EAAkB,UAAa,GAAAC,wDAAA,CAAyB,OAAO,KAAK,CAAA,CAAA;AAExF,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,aAAA,KAAkBC,wCAAiB,EAAA,CAAA;AAEvE,IAA4B,2BAAA,CAAA;AAAA,MAC1B,QAAA;AAAA,MACA,SAAA;AAAA,MACA,aAAa,KAAM,CAAA,WAAA;AAAA,MACnB,aAAA;AAAA,MACA,QAAA;AAAA,MACA,aAAa,KAAM,CAAA,WAAA;AAAA,MACnB,UAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionRoot.js","sources":["../../src/Accordion/AccordionRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef, Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, DataOrientation, Direction, SingleOrMultipleProps, SingleOrMultipleType } from '@/shared/types'\nimport { createContext, useDirection, useForwardExpose } from '@/shared'\n\nexport interface AccordionRootProps<ValidValue = string | string[], ExplicitType = SingleOrMultipleType>\n extends PrimitiveProps, SingleOrMultipleProps<ValidValue, ExplicitType> {\n /**\n * When type is \"single\", allows closing content when clicking trigger for an open item.\n * When type is \"multiple\", this prop has no effect.\n *\n * @defaultValue false\n */\n collapsible?: boolean\n\n /**\n * When `true`, prevents the user from interacting with the accordion and all its items\n *\n * @defaultValue false\n */\n disabled?: boolean\n\n /**\n * The reading direction of the accordion when applicable. If omitted, assumes LTR (left-to-right) reading mode.\n *\n * @defaultValue \"ltr\"\n */\n dir?: Direction\n\n /**\n * The orientation of the accordion.\n *\n * @defaultValue \"vertical\"\n */\n orientation?: DataOrientation\n\n /**\n * When `true`, the element will be unmounted on closed state.\n *\n * @defaultValue `true`\n */\n unmountOnHide?: boolean\n}\n\nexport type AccordionRootEmits<T extends SingleOrMultipleType = SingleOrMultipleType> = {\n /**\n * Event handler called when the expanded state of an item changes\n */\n 'update:modelValue': [value: (T extends 'single' ? string : string[]) | undefined]\n}\n\nexport type AccordionRootContext<P extends AccordionRootProps> = {\n disabled: Ref<P['disabled']>\n direction: Ref<P['dir']>\n orientation: P['orientation']\n parentElement: Ref<HTMLElement | undefined>\n changeModelValue: (value: string) => void\n isSingle: ComputedRef<boolean>\n modelValue: Ref<AcceptableValue | AcceptableValue[] | undefined>\n collapsible: boolean\n unmountOnHide: Ref<boolean>\n}\n\nexport const [injectAccordionRootContext, provideAccordionRootContext]\n = createContext<AccordionRootContext<AccordionRootProps>>('AccordionRoot')\n</script>\n\n<script setup lang=\"ts\" generic=\"ValidValue extends (AcceptableValue | AcceptableValue[]), ExplicitType extends SingleOrMultipleType\">\nimport { Primitive } from '@/Primitive'\nimport { useSingleOrMultipleValue } from '@/shared/useSingleOrMultipleValue'\nimport { toRefs } from 'vue'\n\nconst props = withDefaults(defineProps<AccordionRootProps<ValidValue, ExplicitType>>(), {\n disabled: false,\n orientation: 'vertical',\n collapsible: false,\n unmountOnHide: true,\n})\n\nconst emits = defineEmits<AccordionRootEmits<ExplicitType>>()\n\ndefineSlots<{\n default: (props: {\n /** Current active value */\n modelValue: typeof modelValue.value\n }) => any\n}>()\n\nconst { dir, disabled, unmountOnHide } = toRefs(props)\nconst direction = useDirection(dir)\n\nconst { modelValue, changeModelValue, isSingle } = useSingleOrMultipleValue(props, emits)\n\nconst { forwardRef, currentElement: parentElement } = useForwardExpose()\n\nprovideAccordionRootContext({\n disabled,\n direction,\n orientation: props.orientation,\n parentElement,\n isSingle,\n collapsible: props.collapsible,\n modelValue,\n changeModelValue,\n unmountOnHide,\n})\n</script>\n\n<template>\n <Primitive\n :ref=\"forwardRef\"\n :as-child=\"asChild\"\n :as=\"as\"\n >\n <slot :model-value=\"modelValue\" />\n </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;AAgEO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjE,cAAwD,eAAe,EAAA;;;;;;;;;;;;;;;;;AAQ3E,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAOd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AASd,IAAA,MAAM,EAAE,GAAK,EAAA,QAAA,EAAU,aAAc,EAAA,GAAI,OAAO,KAAK,CAAA,CAAA;AACrD,IAAM,MAAA,SAAA,GAAY,aAAa,GAAG,CAAA,CAAA;AAElC,IAAA,MAAM,EAAE,UAAY,EAAA,gBAAA,EAAkB,UAAa,GAAA,wBAAA,CAAyB,OAAO,KAAK,CAAA,CAAA;AAExF,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,aAAA,KAAkB,gBAAiB,EAAA,CAAA;AAEvE,IAA4B,2BAAA,CAAA;AAAA,MAC1B,QAAA;AAAA,MACA,SAAA;AAAA,MACA,aAAa,KAAM,CAAA,WAAA;AAAA,MACnB,aAAA;AAAA,MACA,QAAA;AAAA,MACA,aAAa,KAAM,CAAA,WAAA;AAAA,MACnB,UAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AccordionRoot.js","sources":["../../src/Accordion/AccordionRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef, Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, DataOrientation, Direction, SingleOrMultipleProps, SingleOrMultipleType } from '@/shared/types'\nimport { createContext, useDirection, useForwardExpose } from '@/shared'\n\nexport interface AccordionRootProps<T = string | string[]>\n extends PrimitiveProps, SingleOrMultipleProps<T> {\n /**\n * When type is \"single\", allows closing content when clicking trigger for an open item.\n * When type is \"multiple\", this prop has no effect.\n *\n * @defaultValue false\n */\n collapsible?: boolean\n\n /**\n * When `true`, prevents the user from interacting with the accordion and all its items\n *\n * @defaultValue false\n */\n disabled?: boolean\n\n /**\n * The reading direction of the accordion when applicable. If omitted, assumes LTR (left-to-right) reading mode.\n *\n * @defaultValue \"ltr\"\n */\n dir?: Direction\n\n /**\n * The orientation of the accordion.\n *\n * @defaultValue \"vertical\"\n */\n orientation?: DataOrientation\n\n /**\n * When `true`, the element will be unmounted on closed state.\n *\n * @defaultValue `true`\n */\n unmountOnHide?: boolean\n}\n\nexport type AccordionRootEmits<T extends SingleOrMultipleType = SingleOrMultipleType> = {\n /**\n * Event handler called when the expanded state of an item changes\n */\n 'update:modelValue': [value: (T extends 'single' ? string : string[]) | undefined]\n}\n\nexport type AccordionRootContext<P extends AccordionRootProps> = {\n disabled: Ref<P['disabled']>\n direction: Ref<P['dir']>\n orientation: P['orientation']\n parentElement: Ref<HTMLElement | undefined>\n changeModelValue: (value: string) => void\n isSingle: ComputedRef<boolean>\n modelValue: Ref<AcceptableValue | AcceptableValue[] | undefined>\n collapsible: boolean\n unmountOnHide: Ref<boolean>\n}\n\nexport const [injectAccordionRootContext, provideAccordionRootContext]\n = createContext<AccordionRootContext<AccordionRootProps>>('AccordionRoot')\n</script>\n\n<script setup lang=\"ts\" generic=\"T extends (string | string[]), ExplicitType extends SingleOrMultipleType\">\nimport { Primitive } from '@/Primitive'\nimport { useSingleOrMultipleValue } from '@/shared/useSingleOrMultipleValue'\nimport { toRefs } from 'vue'\n\nconst props = withDefaults(defineProps<AccordionRootProps<T>>(), {\n disabled: false,\n orientation: 'vertical',\n collapsible: false,\n unmountOnHide: true,\n})\n\nconst emits = defineEmits<AccordionRootEmits<ExplicitType>>()\n\ndefineSlots<{\n default: (props: {\n /** Current active value */\n modelValue: typeof modelValue.value\n }) => any\n}>()\n\nconst { dir, disabled, unmountOnHide } = toRefs(props)\nconst direction = useDirection(dir)\n\nconst { modelValue, changeModelValue, isSingle } = useSingleOrMultipleValue(props, emits)\n\nconst { forwardRef, currentElement: parentElement } = useForwardExpose()\n\nprovideAccordionRootContext({\n disabled,\n direction,\n orientation: props.orientation,\n parentElement,\n isSingle,\n collapsible: props.collapsible,\n modelValue,\n changeModelValue,\n unmountOnHide,\n})\n</script>\n\n<template>\n <Primitive\n :ref=\"forwardRef\"\n :as-child=\"asChild\"\n :as=\"as\"\n >\n <slot :model-value=\"modelValue\" />\n </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;AAgEO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjE,cAAwD,eAAe,EAAA;;;;;;;;;;;;;;;;;AAQ3E,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAOd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AASd,IAAA,MAAM,EAAE,GAAK,EAAA,QAAA,EAAU,aAAc,EAAA,GAAI,OAAO,KAAK,CAAA,CAAA;AACrD,IAAM,MAAA,SAAA,GAAY,aAAa,GAAG,CAAA,CAAA;AAElC,IAAA,MAAM,EAAE,UAAY,EAAA,gBAAA,EAAkB,UAAa,GAAA,wBAAA,CAAyB,OAAO,KAAK,CAAA,CAAA;AAExF,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,aAAA,KAAkB,gBAAiB,EAAA,CAAA;AAEvE,IAA4B,2BAAA,CAAA;AAAA,MAC1B,QAAA;AAAA,MACA,SAAA;AAAA,MACA,aAAa,KAAM,CAAA,WAAA;AAAA,MACnB,aAAA;AAAA,MACA,QAAA;AAAA,MACA,aAAa,KAAM,CAAA,WAAA;AAAA,MACnB,UAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;"}
@@ -18,7 +18,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
18
18
  const itemContext = Accordion_AccordionItem.injectAccordionItemContext();
19
19
  itemContext.triggerId ||= shared_useId.useId(void 0, "reka-accordion-trigger");
20
20
  function changeItem() {
21
- if (itemContext.disabled.value)
21
+ const triggerDisabled = rootContext.isSingle.value && itemContext.open.value && !rootContext.collapsible;
22
+ if (itemContext.disabled.value || triggerDisabled)
22
23
  return;
23
24
  rootContext.changeModelValue(itemContext.value.value);
24
25
  }
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionTrigger.cjs","sources":["../../src/Accordion/AccordionTrigger.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface AccordionTriggerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { useId } from '@/shared'\nimport { injectAccordionItemContext } from './AccordionItem.vue'\nimport { injectAccordionRootContext } from './AccordionRoot.vue'\n\nimport { CollapsibleTrigger } from '@/Collapsible'\n\nconst props = defineProps<AccordionTriggerProps>()\n\nconst rootContext = injectAccordionRootContext()\nconst itemContext = injectAccordionItemContext()\n\nitemContext.triggerId ||= useId(undefined, 'reka-accordion-trigger')\nfunction changeItem() {\n if (itemContext.disabled.value)\n return\n rootContext.changeModelValue(itemContext.value.value)\n}\n</script>\n\n<template>\n <CollapsibleTrigger\n :id=\"itemContext.triggerId\"\n :ref=\"itemContext.currentRef\"\n data-reka-collection-item\n :as=\"props.as\"\n :as-child=\"props.asChild\"\n :aria-disabled=\"itemContext.disabled.value || undefined\"\n :aria-expanded=\"itemContext.open.value || false\"\n :data-disabled=\"itemContext.dataDisabled.value\"\n :data-orientation=\"rootContext.orientation\"\n :data-state=\"itemContext.dataState.value\"\n :disabled=\"itemContext.disabled.value\"\n @click=\"changeItem\"\n >\n <slot />\n </CollapsibleTrigger>\n</template>\n"],"names":["injectAccordionRootContext","injectAccordionItemContext","useId"],"mappings":";;;;;;;;;;;;;;;AAaA,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAEd,IAAA,MAAM,cAAcA,kDAA2B,EAAA,CAAA;AAC/C,IAAA,MAAM,cAAcC,kDAA2B,EAAA,CAAA;AAE/C,IAAY,WAAA,CAAA,SAAA,KAAcC,kBAAM,CAAA,KAAA,CAAA,EAAW,wBAAwB,CAAA,CAAA;AACnE,IAAA,SAAS,UAAa,GAAA;AACpB,MAAA,IAAI,YAAY,QAAS,CAAA,KAAA;AACvB,QAAA,OAAA;AACF,MAAY,WAAA,CAAA,gBAAA,CAAiB,WAAY,CAAA,KAAA,CAAM,KAAK,CAAA,CAAA;AAAA,KACtD;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AccordionTrigger.cjs","sources":["../../src/Accordion/AccordionTrigger.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface AccordionTriggerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { useId } from '@/shared'\nimport { injectAccordionItemContext } from './AccordionItem.vue'\nimport { injectAccordionRootContext } from './AccordionRoot.vue'\n\nimport { CollapsibleTrigger } from '@/Collapsible'\n\nconst props = defineProps<AccordionTriggerProps>()\n\nconst rootContext = injectAccordionRootContext()\nconst itemContext = injectAccordionItemContext()\n\nitemContext.triggerId ||= useId(undefined, 'reka-accordion-trigger')\nfunction changeItem() {\n const triggerDisabled = rootContext.isSingle.value && itemContext.open.value && !rootContext.collapsible\n if (itemContext.disabled.value || triggerDisabled)\n return\n\n rootContext.changeModelValue(itemContext.value.value)\n}\n</script>\n\n<template>\n <CollapsibleTrigger\n :id=\"itemContext.triggerId\"\n :ref=\"itemContext.currentRef\"\n data-reka-collection-item\n :as=\"props.as\"\n :as-child=\"props.asChild\"\n :aria-disabled=\"itemContext.disabled.value || undefined\"\n :aria-expanded=\"itemContext.open.value || false\"\n :data-disabled=\"itemContext.dataDisabled.value\"\n :data-orientation=\"rootContext.orientation\"\n :data-state=\"itemContext.dataState.value\"\n :disabled=\"itemContext.disabled.value\"\n @click=\"changeItem\"\n >\n <slot />\n </CollapsibleTrigger>\n</template>\n"],"names":["injectAccordionRootContext","injectAccordionItemContext","useId"],"mappings":";;;;;;;;;;;;;;;AAaA,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAEd,IAAA,MAAM,cAAcA,kDAA2B,EAAA,CAAA;AAC/C,IAAA,MAAM,cAAcC,kDAA2B,EAAA,CAAA;AAE/C,IAAY,WAAA,CAAA,SAAA,KAAcC,kBAAM,CAAA,KAAA,CAAA,EAAW,wBAAwB,CAAA,CAAA;AACnE,IAAA,SAAS,UAAa,GAAA;AACpB,MAAM,MAAA,eAAA,GAAkB,YAAY,QAAS,CAAA,KAAA,IAAS,YAAY,IAAK,CAAA,KAAA,IAAS,CAAC,WAAY,CAAA,WAAA,CAAA;AAC7F,MAAI,IAAA,WAAA,CAAY,SAAS,KAAS,IAAA,eAAA;AAChC,QAAA,OAAA;AAEF,MAAY,WAAA,CAAA,gBAAA,CAAiB,WAAY,CAAA,KAAA,CAAM,KAAK,CAAA,CAAA;AAAA,KACtD;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -16,7 +16,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
16
16
  const itemContext = injectAccordionItemContext();
17
17
  itemContext.triggerId ||= useId(void 0, "reka-accordion-trigger");
18
18
  function changeItem() {
19
- if (itemContext.disabled.value)
19
+ const triggerDisabled = rootContext.isSingle.value && itemContext.open.value && !rootContext.collapsible;
20
+ if (itemContext.disabled.value || triggerDisabled)
20
21
  return;
21
22
  rootContext.changeModelValue(itemContext.value.value);
22
23
  }
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionTrigger.js","sources":["../../src/Accordion/AccordionTrigger.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface AccordionTriggerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { useId } from '@/shared'\nimport { injectAccordionItemContext } from './AccordionItem.vue'\nimport { injectAccordionRootContext } from './AccordionRoot.vue'\n\nimport { CollapsibleTrigger } from '@/Collapsible'\n\nconst props = defineProps<AccordionTriggerProps>()\n\nconst rootContext = injectAccordionRootContext()\nconst itemContext = injectAccordionItemContext()\n\nitemContext.triggerId ||= useId(undefined, 'reka-accordion-trigger')\nfunction changeItem() {\n if (itemContext.disabled.value)\n return\n rootContext.changeModelValue(itemContext.value.value)\n}\n</script>\n\n<template>\n <CollapsibleTrigger\n :id=\"itemContext.triggerId\"\n :ref=\"itemContext.currentRef\"\n data-reka-collection-item\n :as=\"props.as\"\n :as-child=\"props.asChild\"\n :aria-disabled=\"itemContext.disabled.value || undefined\"\n :aria-expanded=\"itemContext.open.value || false\"\n :data-disabled=\"itemContext.dataDisabled.value\"\n :data-orientation=\"rootContext.orientation\"\n :data-state=\"itemContext.dataState.value\"\n :disabled=\"itemContext.disabled.value\"\n @click=\"changeItem\"\n >\n <slot />\n </CollapsibleTrigger>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;AAaA,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAEd,IAAA,MAAM,cAAc,0BAA2B,EAAA,CAAA;AAC/C,IAAA,MAAM,cAAc,0BAA2B,EAAA,CAAA;AAE/C,IAAY,WAAA,CAAA,SAAA,KAAc,KAAM,CAAA,KAAA,CAAA,EAAW,wBAAwB,CAAA,CAAA;AACnE,IAAA,SAAS,UAAa,GAAA;AACpB,MAAA,IAAI,YAAY,QAAS,CAAA,KAAA;AACvB,QAAA,OAAA;AACF,MAAY,WAAA,CAAA,gBAAA,CAAiB,WAAY,CAAA,KAAA,CAAM,KAAK,CAAA,CAAA;AAAA,KACtD;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AccordionTrigger.js","sources":["../../src/Accordion/AccordionTrigger.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface AccordionTriggerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { useId } from '@/shared'\nimport { injectAccordionItemContext } from './AccordionItem.vue'\nimport { injectAccordionRootContext } from './AccordionRoot.vue'\n\nimport { CollapsibleTrigger } from '@/Collapsible'\n\nconst props = defineProps<AccordionTriggerProps>()\n\nconst rootContext = injectAccordionRootContext()\nconst itemContext = injectAccordionItemContext()\n\nitemContext.triggerId ||= useId(undefined, 'reka-accordion-trigger')\nfunction changeItem() {\n const triggerDisabled = rootContext.isSingle.value && itemContext.open.value && !rootContext.collapsible\n if (itemContext.disabled.value || triggerDisabled)\n return\n\n rootContext.changeModelValue(itemContext.value.value)\n}\n</script>\n\n<template>\n <CollapsibleTrigger\n :id=\"itemContext.triggerId\"\n :ref=\"itemContext.currentRef\"\n data-reka-collection-item\n :as=\"props.as\"\n :as-child=\"props.asChild\"\n :aria-disabled=\"itemContext.disabled.value || undefined\"\n :aria-expanded=\"itemContext.open.value || false\"\n :data-disabled=\"itemContext.dataDisabled.value\"\n :data-orientation=\"rootContext.orientation\"\n :data-state=\"itemContext.dataState.value\"\n :disabled=\"itemContext.disabled.value\"\n @click=\"changeItem\"\n >\n <slot />\n </CollapsibleTrigger>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;AAaA,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAEd,IAAA,MAAM,cAAc,0BAA2B,EAAA,CAAA;AAC/C,IAAA,MAAM,cAAc,0BAA2B,EAAA,CAAA;AAE/C,IAAY,WAAA,CAAA,SAAA,KAAc,KAAM,CAAA,KAAA,CAAA,EAAW,wBAAwB,CAAA,CAAA;AACnE,IAAA,SAAS,UAAa,GAAA;AACpB,MAAM,MAAA,eAAA,GAAkB,YAAY,QAAS,CAAA,KAAA,IAAS,YAAY,IAAK,CAAA,KAAA,IAAS,CAAC,WAAY,CAAA,WAAA,CAAA;AAC7F,MAAI,IAAA,WAAA,CAAY,SAAS,KAAS,IAAA,eAAA;AAChC,QAAA,OAAA;AAEF,MAAY,WAAA,CAAA,gBAAA,CAAiB,WAAY,CAAA,KAAA,CAAM,KAAK,CAAA,CAAA;AAAA,KACtD;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"CalendarRoot.cjs","sources":["../../src/Calendar/CalendarRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { type DateValue, isEqualDay, isSameDay } from '@internationalized/date'\n\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { type Formatter, createContext, useDirection, useLocale } from '@/shared'\n\nimport { useCalendar, useCalendarState } from './useCalendar'\nimport { getDefaultDate, handleCalendarInitialFocus } from '@/shared/date'\nimport type { Grid, Matcher, WeekDayFormat } from '@/date'\nimport type { Direction } from '@/shared/types'\n\ntype CalendarRootContext = {\n locale: Ref<string>\n modelValue: Ref<DateValue | DateValue[] | undefined>\n placeholder: Ref<DateValue>\n pagedNavigation: Ref<boolean>\n preventDeselect: Ref<boolean>\n weekStartsOn: Ref<0 | 1 | 2 | 3 | 4 | 5 | 6>\n weekdayFormat: Ref<WeekDayFormat>\n fixedWeeks: Ref<boolean>\n multiple: Ref<boolean>\n numberOfMonths: Ref<number>\n disabled: Ref<boolean>\n readonly: Ref<boolean>\n initialFocus: Ref<boolean>\n onDateChange: (date: DateValue) => void\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 isDateSelected: Matcher\n isDateUnavailable?: Matcher\n isOutsideVisibleView: (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\ninterface BaseCalendarRootProps extends PrimitiveProps {\n /** The default value for the calendar */\n defaultValue?: DateValue\n /** The default placeholder date */\n defaultPlaceholder?: DateValue\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 /** 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 interface MultipleCalendarRootProps extends BaseCalendarRootProps {\n /** The controlled checked state of the calendar. Can be bound as `v-model`. */\n modelValue?: DateValue[] | undefined\n /** Whether or not multiple dates can be selected */\n multiple: true\n}\n\nexport interface SingleCalendarRootProps extends BaseCalendarRootProps {\n /** The controlled checked state of the calendar. Can be bound as `v-model`. */\n modelValue?: DateValue | undefined\n /** Whether or not multiple dates can be selected */\n multiple?: false\n}\n\nexport type CalendarRootProps = MultipleCalendarRootProps | SingleCalendarRootProps\n\nexport type CalendarRootEmits = {\n /** Event handler called whenever the model value changes */\n 'update:modelValue': [date: DateValue | undefined]\n /** Event handler called whenever the placeholder value changes */\n 'update:placeholder': [date: DateValue]\n}\n\nexport const [injectCalendarRootContext, provideCalendarRootContext]\n = createContext<CalendarRootContext>('CalendarRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, toRefs, watch } from 'vue'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\nimport { useVModel } from '@vueuse/core'\n\nconst props = withDefaults(defineProps<CalendarRootProps>(), {\n defaultValue: undefined,\n as: 'div',\n pagedNavigation: false,\n preventDeselect: false,\n weekStartsOn: 0,\n weekdayFormat: 'narrow',\n fixedWeeks: false,\n multiple: false,\n numberOfMonths: 1,\n disabled: false,\n readonly: false,\n initialFocus: false,\n placeholder: undefined,\n isDateDisabled: undefined,\n isDateUnavailable: undefined,\n})\nconst emits = defineEmits<CalendarRootEmits>()\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 }) => any\n}>()\n\nconst {\n disabled,\n readonly,\n initialFocus,\n pagedNavigation,\n weekStartsOn,\n weekdayFormat,\n fixedWeeks,\n multiple,\n minValue,\n maxValue,\n numberOfMonths,\n preventDeselect,\n isDateDisabled: propsIsDateDisabled,\n isDateUnavailable: propsIsDateUnavailable,\n calendarLabel,\n defaultValue,\n nextPage: propsNextPage,\n prevPage: propsPrevPage,\n dir: propDir,\n locale: propLocale,\n} = toRefs(props)\n\nconst { primitiveElement, currentElement: parentElement }\n = usePrimitiveElement()\nconst locale = useLocale(propLocale)\nconst dir = useDirection(propDir)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: defaultValue.value,\n passive: (props.modelValue === undefined) as false,\n}) as Ref<DateValue | DateValue[] | undefined>\n\nconst defaultDate = getDefaultDate({\n defaultPlaceholder: props.placeholder,\n defaultValue: modelValue.value,\n locale: props.locale,\n})\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 weekdays,\n isOutsideVisibleView,\n nextPage,\n prevPage,\n formatter,\n grid,\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 isDateSelected,\n} = useCalendarState({\n date: modelValue,\n isDateDisabled,\n isDateUnavailable,\n})\n\nwatch(modelValue, (_modelValue) => {\n if (Array.isArray(_modelValue) && _modelValue.length) {\n const lastValue = _modelValue[_modelValue.length - 1]\n if (lastValue && !isEqualDay(placeholder.value, lastValue))\n onPlaceholderChange(lastValue)\n }\n else if (!Array.isArray(_modelValue) && _modelValue && !isEqualDay(placeholder.value, _modelValue)) {\n onPlaceholderChange(_modelValue)\n }\n})\n\nfunction onDateChange(value: DateValue) {\n if (!multiple.value) {\n if (!modelValue.value) {\n modelValue.value = value.copy()\n return\n }\n\n if (!preventDeselect.value && isEqualDay(modelValue.value as DateValue, value)) {\n placeholder.value = value.copy()\n modelValue.value = undefined\n }\n else { modelValue.value = value.copy() }\n }\n else if (!modelValue.value) {\n modelValue.value = [value.copy()]\n }\n else if (Array.isArray(modelValue.value)) {\n const index = modelValue.value.findIndex(date => isSameDay(date, value))\n if (index === -1) {\n modelValue.value = [...modelValue.value, value]\n }\n else if (!preventDeselect.value) {\n const next = modelValue.value.filter(date => !isSameDay(date, value))\n if (!next.length) {\n placeholder.value = value.copy()\n modelValue.value = undefined\n return\n }\n modelValue.value = next.map(date => date.copy())\n }\n }\n}\n\nonMounted(() => {\n if (initialFocus.value)\n handleCalendarInitialFocus(parentElement.value)\n})\n\nprovideCalendarRootContext({\n isDateUnavailable,\n dir,\n isDateDisabled,\n locale,\n formatter,\n modelValue,\n placeholder,\n disabled,\n initialFocus,\n pagedNavigation,\n weekStartsOn,\n weekdayFormat,\n fixedWeeks,\n multiple,\n numberOfMonths,\n readonly,\n preventDeselect,\n fullCalendarLabel,\n headingValue,\n isInvalid,\n isDateSelected,\n isNextButtonDisabled,\n isPrevButtonDisabled,\n isOutsideVisibleView,\n nextPage,\n prevPage,\n parentElement,\n onPlaceholderChange,\n onDateChange,\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 <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 <div\n 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 >\n <div\n role=\"heading\"\n aria-level=\"2\"\n >\n {{ fullCalendarLabel }}\n </div>\n </div>\n </Primitive>\n</template>\n"],"names":["createContext","toRefs","usePrimitiveElement","useLocale","useDirection","useVModel","getDefaultDate","useCalendar","useCalendarState","watch","isEqualDay","isSameDay","date","onMounted","handleCalendarInitialFocus"],"mappings":"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"}
1
+ {"version":3,"file":"CalendarRoot.cjs","sources":["../../src/Calendar/CalendarRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { type DateValue, isEqualDay, isSameDay } from '@internationalized/date'\n\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { type Formatter, createContext, useDirection, useLocale } from '@/shared'\n\nimport { useCalendar, useCalendarState } from './useCalendar'\nimport { getDefaultDate, handleCalendarInitialFocus } from '@/shared/date'\nimport type { Grid, Matcher, WeekDayFormat } from '@/date'\nimport type { Direction } from '@/shared/types'\n\ntype CalendarRootContext = {\n locale: Ref<string>\n modelValue: Ref<DateValue | DateValue[] | undefined>\n placeholder: Ref<DateValue>\n pagedNavigation: Ref<boolean>\n preventDeselect: Ref<boolean>\n weekStartsOn: Ref<0 | 1 | 2 | 3 | 4 | 5 | 6>\n weekdayFormat: Ref<WeekDayFormat>\n fixedWeeks: Ref<boolean>\n multiple: Ref<boolean>\n numberOfMonths: Ref<number>\n disabled: Ref<boolean>\n readonly: Ref<boolean>\n initialFocus: Ref<boolean>\n onDateChange: (date: DateValue) => void\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 isDateSelected: Matcher\n isDateUnavailable?: Matcher\n isOutsideVisibleView: (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\ninterface BaseCalendarRootProps extends PrimitiveProps {\n /** The default value for the calendar */\n defaultValue?: DateValue\n /** The default placeholder date */\n defaultPlaceholder?: DateValue\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 /** 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 interface MultipleCalendarRootProps extends BaseCalendarRootProps {\n /** The controlled checked state of the calendar. Can be bound as `v-model`. */\n modelValue?: DateValue[] | undefined\n /** Whether or not multiple dates can be selected */\n multiple: true\n}\n\nexport interface SingleCalendarRootProps extends BaseCalendarRootProps {\n /** The controlled checked state of the calendar. Can be bound as `v-model`. */\n modelValue?: DateValue | undefined\n /** Whether or not multiple dates can be selected */\n multiple?: false\n}\n\nexport type CalendarRootProps = MultipleCalendarRootProps | SingleCalendarRootProps\n\nexport type CalendarRootEmits = {\n /** Event handler called whenever the model value changes */\n 'update:modelValue': [date: DateValue | undefined]\n /** Event handler called whenever the placeholder value changes */\n 'update:placeholder': [date: DateValue]\n}\n\nexport const [injectCalendarRootContext, provideCalendarRootContext]\n = createContext<CalendarRootContext>('CalendarRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, toRefs, watch } from 'vue'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\nimport { useVModel } from '@vueuse/core'\n\nconst props = withDefaults(defineProps<CalendarRootProps>(), {\n defaultValue: undefined,\n as: 'div',\n pagedNavigation: false,\n preventDeselect: false,\n weekStartsOn: 0,\n weekdayFormat: 'narrow',\n fixedWeeks: false,\n multiple: false,\n numberOfMonths: 1,\n disabled: false,\n readonly: false,\n initialFocus: false,\n placeholder: undefined,\n isDateDisabled: undefined,\n isDateUnavailable: undefined,\n})\nconst emits = defineEmits<CalendarRootEmits>()\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 of the calendar */\n modelValue: DateValue | undefined\n }) => any\n}>()\n\nconst {\n disabled,\n readonly,\n initialFocus,\n pagedNavigation,\n weekStartsOn,\n weekdayFormat,\n fixedWeeks,\n multiple,\n minValue,\n maxValue,\n numberOfMonths,\n preventDeselect,\n isDateDisabled: propsIsDateDisabled,\n isDateUnavailable: propsIsDateUnavailable,\n calendarLabel,\n defaultValue,\n nextPage: propsNextPage,\n prevPage: propsPrevPage,\n dir: propDir,\n locale: propLocale,\n} = toRefs(props)\n\nconst { primitiveElement, currentElement: parentElement }\n = usePrimitiveElement()\nconst locale = useLocale(propLocale)\nconst dir = useDirection(propDir)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: defaultValue.value,\n passive: (props.modelValue === undefined) as false,\n}) as Ref<DateValue | DateValue[] | undefined>\n\nconst defaultDate = getDefaultDate({\n defaultPlaceholder: props.placeholder,\n defaultValue: modelValue.value,\n locale: props.locale,\n})\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 weekdays,\n isOutsideVisibleView,\n nextPage,\n prevPage,\n formatter,\n grid,\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 isDateSelected,\n} = useCalendarState({\n date: modelValue,\n isDateDisabled,\n isDateUnavailable,\n})\n\nwatch(modelValue, (_modelValue) => {\n if (Array.isArray(_modelValue) && _modelValue.length) {\n const lastValue = _modelValue[_modelValue.length - 1]\n if (lastValue && !isEqualDay(placeholder.value, lastValue))\n onPlaceholderChange(lastValue)\n }\n else if (!Array.isArray(_modelValue) && _modelValue && !isEqualDay(placeholder.value, _modelValue)) {\n onPlaceholderChange(_modelValue)\n }\n})\n\nfunction onDateChange(value: DateValue) {\n if (!multiple.value) {\n if (!modelValue.value) {\n modelValue.value = value.copy()\n return\n }\n\n if (!preventDeselect.value && isEqualDay(modelValue.value as DateValue, value)) {\n placeholder.value = value.copy()\n modelValue.value = undefined\n }\n else { modelValue.value = value.copy() }\n }\n else if (!modelValue.value) {\n modelValue.value = [value.copy()]\n }\n else if (Array.isArray(modelValue.value)) {\n const index = modelValue.value.findIndex(date => isSameDay(date, value))\n if (index === -1) {\n modelValue.value = [...modelValue.value, value]\n }\n else if (!preventDeselect.value) {\n const next = modelValue.value.filter(date => !isSameDay(date, value))\n if (!next.length) {\n placeholder.value = value.copy()\n modelValue.value = undefined\n return\n }\n modelValue.value = next.map(date => date.copy())\n }\n }\n}\n\nonMounted(() => {\n if (initialFocus.value)\n handleCalendarInitialFocus(parentElement.value)\n})\n\nprovideCalendarRootContext({\n isDateUnavailable,\n dir,\n isDateDisabled,\n locale,\n formatter,\n modelValue,\n placeholder,\n disabled,\n initialFocus,\n pagedNavigation,\n weekStartsOn,\n weekdayFormat,\n fixedWeeks,\n multiple,\n numberOfMonths,\n readonly,\n preventDeselect,\n fullCalendarLabel,\n headingValue,\n isInvalid,\n isDateSelected,\n isNextButtonDisabled,\n isPrevButtonDisabled,\n isOutsideVisibleView,\n nextPage,\n prevPage,\n parentElement,\n onPlaceholderChange,\n onDateChange,\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 <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 <div\n 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 >\n <div\n role=\"heading\"\n aria-level=\"2\"\n >\n {{ fullCalendarLabel }}\n </div>\n </div>\n </Primitive>\n</template>\n"],"names":["createContext","toRefs","usePrimitiveElement","useLocale","useDirection","useVModel","getDefaultDate","useCalendar","useCalendarState","watch","isEqualDay","isSameDay","date","onMounted","handleCalendarInitialFocus"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"CalendarRoot.js","sources":["../../src/Calendar/CalendarRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { type DateValue, isEqualDay, isSameDay } from '@internationalized/date'\n\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { type Formatter, createContext, useDirection, useLocale } from '@/shared'\n\nimport { useCalendar, useCalendarState } from './useCalendar'\nimport { getDefaultDate, handleCalendarInitialFocus } from '@/shared/date'\nimport type { Grid, Matcher, WeekDayFormat } from '@/date'\nimport type { Direction } from '@/shared/types'\n\ntype CalendarRootContext = {\n locale: Ref<string>\n modelValue: Ref<DateValue | DateValue[] | undefined>\n placeholder: Ref<DateValue>\n pagedNavigation: Ref<boolean>\n preventDeselect: Ref<boolean>\n weekStartsOn: Ref<0 | 1 | 2 | 3 | 4 | 5 | 6>\n weekdayFormat: Ref<WeekDayFormat>\n fixedWeeks: Ref<boolean>\n multiple: Ref<boolean>\n numberOfMonths: Ref<number>\n disabled: Ref<boolean>\n readonly: Ref<boolean>\n initialFocus: Ref<boolean>\n onDateChange: (date: DateValue) => void\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 isDateSelected: Matcher\n isDateUnavailable?: Matcher\n isOutsideVisibleView: (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\ninterface BaseCalendarRootProps extends PrimitiveProps {\n /** The default value for the calendar */\n defaultValue?: DateValue\n /** The default placeholder date */\n defaultPlaceholder?: DateValue\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 /** 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 interface MultipleCalendarRootProps extends BaseCalendarRootProps {\n /** The controlled checked state of the calendar. Can be bound as `v-model`. */\n modelValue?: DateValue[] | undefined\n /** Whether or not multiple dates can be selected */\n multiple: true\n}\n\nexport interface SingleCalendarRootProps extends BaseCalendarRootProps {\n /** The controlled checked state of the calendar. Can be bound as `v-model`. */\n modelValue?: DateValue | undefined\n /** Whether or not multiple dates can be selected */\n multiple?: false\n}\n\nexport type CalendarRootProps = MultipleCalendarRootProps | SingleCalendarRootProps\n\nexport type CalendarRootEmits = {\n /** Event handler called whenever the model value changes */\n 'update:modelValue': [date: DateValue | undefined]\n /** Event handler called whenever the placeholder value changes */\n 'update:placeholder': [date: DateValue]\n}\n\nexport const [injectCalendarRootContext, provideCalendarRootContext]\n = createContext<CalendarRootContext>('CalendarRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, toRefs, watch } from 'vue'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\nimport { useVModel } from '@vueuse/core'\n\nconst props = withDefaults(defineProps<CalendarRootProps>(), {\n defaultValue: undefined,\n as: 'div',\n pagedNavigation: false,\n preventDeselect: false,\n weekStartsOn: 0,\n weekdayFormat: 'narrow',\n fixedWeeks: false,\n multiple: false,\n numberOfMonths: 1,\n disabled: false,\n readonly: false,\n initialFocus: false,\n placeholder: undefined,\n isDateDisabled: undefined,\n isDateUnavailable: undefined,\n})\nconst emits = defineEmits<CalendarRootEmits>()\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 }) => any\n}>()\n\nconst {\n disabled,\n readonly,\n initialFocus,\n pagedNavigation,\n weekStartsOn,\n weekdayFormat,\n fixedWeeks,\n multiple,\n minValue,\n maxValue,\n numberOfMonths,\n preventDeselect,\n isDateDisabled: propsIsDateDisabled,\n isDateUnavailable: propsIsDateUnavailable,\n calendarLabel,\n defaultValue,\n nextPage: propsNextPage,\n prevPage: propsPrevPage,\n dir: propDir,\n locale: propLocale,\n} = toRefs(props)\n\nconst { primitiveElement, currentElement: parentElement }\n = usePrimitiveElement()\nconst locale = useLocale(propLocale)\nconst dir = useDirection(propDir)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: defaultValue.value,\n passive: (props.modelValue === undefined) as false,\n}) as Ref<DateValue | DateValue[] | undefined>\n\nconst defaultDate = getDefaultDate({\n defaultPlaceholder: props.placeholder,\n defaultValue: modelValue.value,\n locale: props.locale,\n})\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 weekdays,\n isOutsideVisibleView,\n nextPage,\n prevPage,\n formatter,\n grid,\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 isDateSelected,\n} = useCalendarState({\n date: modelValue,\n isDateDisabled,\n isDateUnavailable,\n})\n\nwatch(modelValue, (_modelValue) => {\n if (Array.isArray(_modelValue) && _modelValue.length) {\n const lastValue = _modelValue[_modelValue.length - 1]\n if (lastValue && !isEqualDay(placeholder.value, lastValue))\n onPlaceholderChange(lastValue)\n }\n else if (!Array.isArray(_modelValue) && _modelValue && !isEqualDay(placeholder.value, _modelValue)) {\n onPlaceholderChange(_modelValue)\n }\n})\n\nfunction onDateChange(value: DateValue) {\n if (!multiple.value) {\n if (!modelValue.value) {\n modelValue.value = value.copy()\n return\n }\n\n if (!preventDeselect.value && isEqualDay(modelValue.value as DateValue, value)) {\n placeholder.value = value.copy()\n modelValue.value = undefined\n }\n else { modelValue.value = value.copy() }\n }\n else if (!modelValue.value) {\n modelValue.value = [value.copy()]\n }\n else if (Array.isArray(modelValue.value)) {\n const index = modelValue.value.findIndex(date => isSameDay(date, value))\n if (index === -1) {\n modelValue.value = [...modelValue.value, value]\n }\n else if (!preventDeselect.value) {\n const next = modelValue.value.filter(date => !isSameDay(date, value))\n if (!next.length) {\n placeholder.value = value.copy()\n modelValue.value = undefined\n return\n }\n modelValue.value = next.map(date => date.copy())\n }\n }\n}\n\nonMounted(() => {\n if (initialFocus.value)\n handleCalendarInitialFocus(parentElement.value)\n})\n\nprovideCalendarRootContext({\n isDateUnavailable,\n dir,\n isDateDisabled,\n locale,\n formatter,\n modelValue,\n placeholder,\n disabled,\n initialFocus,\n pagedNavigation,\n weekStartsOn,\n weekdayFormat,\n fixedWeeks,\n multiple,\n numberOfMonths,\n readonly,\n preventDeselect,\n fullCalendarLabel,\n headingValue,\n isInvalid,\n isDateSelected,\n isNextButtonDisabled,\n isPrevButtonDisabled,\n isOutsideVisibleView,\n nextPage,\n prevPage,\n parentElement,\n onPlaceholderChange,\n onDateChange,\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 <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 <div\n 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 >\n <div\n role=\"heading\"\n aria-level=\"2\"\n >\n {{ fullCalendarLabel }}\n </div>\n </div>\n </Primitive>\n</template>\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"CalendarRoot.js","sources":["../../src/Calendar/CalendarRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { type DateValue, isEqualDay, isSameDay } from '@internationalized/date'\n\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { type Formatter, createContext, useDirection, useLocale } from '@/shared'\n\nimport { useCalendar, useCalendarState } from './useCalendar'\nimport { getDefaultDate, handleCalendarInitialFocus } from '@/shared/date'\nimport type { Grid, Matcher, WeekDayFormat } from '@/date'\nimport type { Direction } from '@/shared/types'\n\ntype CalendarRootContext = {\n locale: Ref<string>\n modelValue: Ref<DateValue | DateValue[] | undefined>\n placeholder: Ref<DateValue>\n pagedNavigation: Ref<boolean>\n preventDeselect: Ref<boolean>\n weekStartsOn: Ref<0 | 1 | 2 | 3 | 4 | 5 | 6>\n weekdayFormat: Ref<WeekDayFormat>\n fixedWeeks: Ref<boolean>\n multiple: Ref<boolean>\n numberOfMonths: Ref<number>\n disabled: Ref<boolean>\n readonly: Ref<boolean>\n initialFocus: Ref<boolean>\n onDateChange: (date: DateValue) => void\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 isDateSelected: Matcher\n isDateUnavailable?: Matcher\n isOutsideVisibleView: (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\ninterface BaseCalendarRootProps extends PrimitiveProps {\n /** The default value for the calendar */\n defaultValue?: DateValue\n /** The default placeholder date */\n defaultPlaceholder?: DateValue\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 /** 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 interface MultipleCalendarRootProps extends BaseCalendarRootProps {\n /** The controlled checked state of the calendar. Can be bound as `v-model`. */\n modelValue?: DateValue[] | undefined\n /** Whether or not multiple dates can be selected */\n multiple: true\n}\n\nexport interface SingleCalendarRootProps extends BaseCalendarRootProps {\n /** The controlled checked state of the calendar. Can be bound as `v-model`. */\n modelValue?: DateValue | undefined\n /** Whether or not multiple dates can be selected */\n multiple?: false\n}\n\nexport type CalendarRootProps = MultipleCalendarRootProps | SingleCalendarRootProps\n\nexport type CalendarRootEmits = {\n /** Event handler called whenever the model value changes */\n 'update:modelValue': [date: DateValue | undefined]\n /** Event handler called whenever the placeholder value changes */\n 'update:placeholder': [date: DateValue]\n}\n\nexport const [injectCalendarRootContext, provideCalendarRootContext]\n = createContext<CalendarRootContext>('CalendarRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, toRefs, watch } from 'vue'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\nimport { useVModel } from '@vueuse/core'\n\nconst props = withDefaults(defineProps<CalendarRootProps>(), {\n defaultValue: undefined,\n as: 'div',\n pagedNavigation: false,\n preventDeselect: false,\n weekStartsOn: 0,\n weekdayFormat: 'narrow',\n fixedWeeks: false,\n multiple: false,\n numberOfMonths: 1,\n disabled: false,\n readonly: false,\n initialFocus: false,\n placeholder: undefined,\n isDateDisabled: undefined,\n isDateUnavailable: undefined,\n})\nconst emits = defineEmits<CalendarRootEmits>()\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 of the calendar */\n modelValue: DateValue | undefined\n }) => any\n}>()\n\nconst {\n disabled,\n readonly,\n initialFocus,\n pagedNavigation,\n weekStartsOn,\n weekdayFormat,\n fixedWeeks,\n multiple,\n minValue,\n maxValue,\n numberOfMonths,\n preventDeselect,\n isDateDisabled: propsIsDateDisabled,\n isDateUnavailable: propsIsDateUnavailable,\n calendarLabel,\n defaultValue,\n nextPage: propsNextPage,\n prevPage: propsPrevPage,\n dir: propDir,\n locale: propLocale,\n} = toRefs(props)\n\nconst { primitiveElement, currentElement: parentElement }\n = usePrimitiveElement()\nconst locale = useLocale(propLocale)\nconst dir = useDirection(propDir)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: defaultValue.value,\n passive: (props.modelValue === undefined) as false,\n}) as Ref<DateValue | DateValue[] | undefined>\n\nconst defaultDate = getDefaultDate({\n defaultPlaceholder: props.placeholder,\n defaultValue: modelValue.value,\n locale: props.locale,\n})\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 weekdays,\n isOutsideVisibleView,\n nextPage,\n prevPage,\n formatter,\n grid,\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 isDateSelected,\n} = useCalendarState({\n date: modelValue,\n isDateDisabled,\n isDateUnavailable,\n})\n\nwatch(modelValue, (_modelValue) => {\n if (Array.isArray(_modelValue) && _modelValue.length) {\n const lastValue = _modelValue[_modelValue.length - 1]\n if (lastValue && !isEqualDay(placeholder.value, lastValue))\n onPlaceholderChange(lastValue)\n }\n else if (!Array.isArray(_modelValue) && _modelValue && !isEqualDay(placeholder.value, _modelValue)) {\n onPlaceholderChange(_modelValue)\n }\n})\n\nfunction onDateChange(value: DateValue) {\n if (!multiple.value) {\n if (!modelValue.value) {\n modelValue.value = value.copy()\n return\n }\n\n if (!preventDeselect.value && isEqualDay(modelValue.value as DateValue, value)) {\n placeholder.value = value.copy()\n modelValue.value = undefined\n }\n else { modelValue.value = value.copy() }\n }\n else if (!modelValue.value) {\n modelValue.value = [value.copy()]\n }\n else if (Array.isArray(modelValue.value)) {\n const index = modelValue.value.findIndex(date => isSameDay(date, value))\n if (index === -1) {\n modelValue.value = [...modelValue.value, value]\n }\n else if (!preventDeselect.value) {\n const next = modelValue.value.filter(date => !isSameDay(date, value))\n if (!next.length) {\n placeholder.value = value.copy()\n modelValue.value = undefined\n return\n }\n modelValue.value = next.map(date => date.copy())\n }\n }\n}\n\nonMounted(() => {\n if (initialFocus.value)\n handleCalendarInitialFocus(parentElement.value)\n})\n\nprovideCalendarRootContext({\n isDateUnavailable,\n dir,\n isDateDisabled,\n locale,\n formatter,\n modelValue,\n placeholder,\n disabled,\n initialFocus,\n pagedNavigation,\n weekStartsOn,\n weekdayFormat,\n fixedWeeks,\n multiple,\n numberOfMonths,\n readonly,\n preventDeselect,\n fullCalendarLabel,\n headingValue,\n isInvalid,\n isDateSelected,\n isNextButtonDisabled,\n isPrevButtonDisabled,\n isOutsideVisibleView,\n nextPage,\n prevPage,\n parentElement,\n onPlaceholderChange,\n onDateChange,\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 <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 <div\n 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 >\n <div\n role=\"heading\"\n aria-level=\"2\"\n >\n {{ fullCalendarLabel }}\n </div>\n </div>\n </Primitive>\n</template>\n"],"names":[],"mappings":"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"}
@@ -7,6 +7,7 @@ const ohash = require('ohash');
7
7
  const core = require('@vueuse/core');
8
8
  const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
9
9
  const Checkbox_CheckboxGroupRoot = require('./CheckboxGroupRoot.cjs');
10
+ const shared_nullish = require('../shared/nullish.cjs');
10
11
  const shared_isValueEqualOrExist = require('../shared/isValueEqualOrExist.cjs');
11
12
  const shared_useFormControl = require('../shared/useFormControl.cjs');
12
13
  const Primitive_Primitive = require('../Primitive/Primitive.cjs');
@@ -21,7 +22,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
21
22
  __name: "CheckboxRoot",
22
23
  props: {
23
24
  defaultValue: { type: [Boolean, String] },
24
- modelValue: { type: [Boolean, String], default: void 0 },
25
+ modelValue: { type: [Boolean, String, null], default: void 0 },
25
26
  disabled: { type: Boolean },
26
27
  value: { default: "on" },
27
28
  id: {},
@@ -42,14 +43,14 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
42
43
  });
43
44
  const disabled = vue.computed(() => checkboxGroupContext?.disabled.value || props.disabled);
44
45
  const checkboxState = vue.computed(() => {
45
- if (checkboxGroupContext?.modelValue.value !== void 0) {
46
+ if (!shared_nullish.isNullish(checkboxGroupContext?.modelValue.value)) {
46
47
  return shared_isValueEqualOrExist.isValueEqualOrExist(checkboxGroupContext.modelValue.value, props.value);
47
48
  } else {
48
49
  return modelValue.value === "indeterminate" ? "indeterminate" : modelValue.value;
49
50
  }
50
51
  });
51
52
  function handleClick() {
52
- if (checkboxGroupContext?.modelValue.value !== void 0) {
53
+ if (!shared_nullish.isNullish(checkboxGroupContext?.modelValue.value)) {
53
54
  const modelValueArray = [...checkboxGroupContext.modelValue.value || []];
54
55
  if (shared_isValueEqualOrExist.isValueEqualOrExist(modelValueArray, props.value)) {
55
56
  const index = modelValueArray.findIndex((i) => ohash.isEqual(i, props.value));
@@ -1 +1 @@
1
- {"version":3,"file":"CheckboxRoot.cjs","sources":["../../src/Checkbox/CheckboxRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\nimport { createContext, isValueEqualOrExist, useFormControl, useForwardExpose } from '@/shared'\nimport type { CheckedState } from './utils'\nimport type { AcceptableValue, FormFieldProps } from '@/shared/types'\nimport { useVModel } from '@vueuse/core'\nimport { injectCheckboxGroupRootContext } from './CheckboxGroupRoot.vue'\n\nexport interface CheckboxRootProps extends PrimitiveProps, FormFieldProps {\n /** The value of the checkbox when it is initially rendered. Use when you do not need to control its value. */\n defaultValue?: boolean | 'indeterminate'\n /** The controlled value of the checkbox. Can be binded with v-model. */\n modelValue?: boolean | 'indeterminate'\n /** When `true`, prevents the user from interacting with the checkbox */\n disabled?: boolean\n /**\n * The value given as data when submitted with a `name`.\n * @defaultValue \"on\"\n */\n value?: AcceptableValue\n /** Id of the element */\n id?: string\n}\n\nexport type CheckboxRootEmits = {\n /** Event handler called when the value of the checkbox changes. */\n 'update:modelValue': [value: boolean | 'indeterminate']\n}\n\ninterface CheckboxRootContext {\n disabled: Ref<boolean>\n state: Ref<CheckedState>\n}\n\nexport const [injectCheckboxRootContext, provideCheckboxRootContext]\n = createContext<CheckboxRootContext>('CheckboxRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { Primitive } from '@/Primitive'\nimport { RovingFocusItem } from '@/RovingFocus'\nimport { getState, isIndeterminate } from './utils'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\nimport { isEqual } from 'ohash'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<CheckboxRootProps>(), {\n modelValue: undefined,\n value: 'on',\n as: 'button',\n})\nconst emits = defineEmits<CheckboxRootEmits>()\n\ndefineSlots<{\n default: (props: {\n /** Current value */\n modelValue: typeof modelValue.value\n /** Current state */\n state: typeof checkboxState.value\n }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst checkboxGroupContext = injectCheckboxGroupRootContext(null)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: props.defaultValue,\n passive: (props.modelValue === undefined) as false,\n}) as Ref<CheckedState>\n\nconst disabled = computed(() => checkboxGroupContext?.disabled.value || props.disabled)\n\nconst checkboxState = computed<CheckedState>(() => {\n if (checkboxGroupContext?.modelValue.value !== undefined) {\n return isValueEqualOrExist(checkboxGroupContext.modelValue.value, props.value)\n }\n else {\n return modelValue.value === 'indeterminate' ? 'indeterminate' : modelValue.value\n }\n})\n\nfunction handleClick() {\n if (checkboxGroupContext?.modelValue.value !== undefined) {\n const modelValueArray = [...(checkboxGroupContext.modelValue.value || [])]\n if (isValueEqualOrExist(modelValueArray, props.value)) {\n const index = modelValueArray.findIndex(i => isEqual(i, props.value))\n modelValueArray.splice(index, 1)\n }\n else {\n modelValueArray.push(props.value)\n }\n checkboxGroupContext.modelValue.value = modelValueArray\n }\n else {\n modelValue.value = isIndeterminate(modelValue.value) ? true : !modelValue.value\n }\n}\n\nconst isFormControl = useFormControl(currentElement)\nconst ariaLabel = computed(() => props.id && currentElement.value\n ? (document.querySelector(`[for=\"${props.id}\"]`) as HTMLLabelElement)?.innerText\n : undefined)\n\nprovideCheckboxRootContext({\n disabled,\n state: checkboxState,\n})\n</script>\n\n<template>\n <component\n v-bind=\"$attrs\"\n :is=\"checkboxGroupContext?.rovingFocus.value ? RovingFocusItem : Primitive\"\n :id=\"id\"\n :ref=\"forwardRef\"\n role=\"checkbox\"\n :as-child=\"asChild\"\n :as=\"as\"\n :type=\"as === 'button' ? 'button' : undefined\"\n :aria-checked=\"isIndeterminate(checkboxState) ? 'mixed' : checkboxState\"\n :aria-required=\"required\"\n :aria-label=\"$attrs['aria-label'] || ariaLabel\"\n :data-state=\"getState(checkboxState)\"\n :data-disabled=\"disabled ? '' : undefined\"\n :disabled=\"disabled\"\n :focusable=\"checkboxGroupContext?.rovingFocus.value ? !disabled : undefined\"\n @keydown.enter.prevent=\"() => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n }\"\n @click=\"handleClick\"\n >\n <slot\n :model-value=\"modelValue\"\n :state=\"checkboxState\"\n />\n\n <VisuallyHiddenInput\n v-if=\"isFormControl && name && !checkboxGroupContext\"\n type=\"checkbox\"\n :checked=\"!!checkboxState\"\n :name=\"name\"\n :value=\"value\"\n :disabled=\"disabled\"\n :required=\"required\"\n />\n </component>\n</template>\n"],"names":["createContext","useForwardExpose","injectCheckboxGroupRootContext","useVModel","computed","isValueEqualOrExist","isEqual","isIndeterminate","useFormControl"],"mappings":";;;;;;;;;;;;;;;AAmCO,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/DA,mCAAmC,cAAc,EAAA;;;;;;;;;;;;;;;;;;;AAerD,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AAWd,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA,CAAA;AAExD,IAAM,MAAA,oBAAA,GAAuBC,0DAA+B,IAAI,CAAA,CAAA;AAEhE,IAAA,MAAM,UAAa,GAAAC,cAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,cAAc,KAAM,CAAA,YAAA;AAAA,MACpB,OAAA,EAAU,MAAM,UAAe,KAAA,KAAA,CAAA;AAAA,KAChC,CAAA,CAAA;AAED,IAAA,MAAM,WAAWC,YAAS,CAAA,MAAM,sBAAsB,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA,CAAA;AAEtF,IAAM,MAAA,aAAA,GAAgBA,aAAuB,MAAM;AACjD,MAAI,IAAA,oBAAA,EAAsB,UAAW,CAAA,KAAA,KAAU,KAAW,CAAA,EAAA;AACxD,QAAA,OAAOC,8CAAoB,CAAA,oBAAA,CAAqB,UAAW,CAAA,KAAA,EAAO,MAAM,KAAK,CAAA,CAAA;AAAA,OAE1E,MAAA;AACH,QAAA,OAAO,UAAW,CAAA,KAAA,KAAU,eAAkB,GAAA,eAAA,GAAkB,UAAW,CAAA,KAAA,CAAA;AAAA,OAC7E;AAAA,KACD,CAAA,CAAA;AAED,IAAA,SAAS,WAAc,GAAA;AACrB,MAAI,IAAA,oBAAA,EAAsB,UAAW,CAAA,KAAA,KAAU,KAAW,CAAA,EAAA;AACxD,QAAA,MAAM,kBAAkB,CAAC,GAAI,qBAAqB,UAAW,CAAA,KAAA,IAAS,EAAG,CAAA,CAAA;AACzE,QAAA,IAAIA,8CAAoB,CAAA,eAAA,EAAiB,KAAM,CAAA,KAAK,CAAG,EAAA;AACrD,UAAM,MAAA,KAAA,GAAQ,gBAAgB,SAAU,CAAA,CAAA,CAAA,KAAKC,cAAQ,CAAG,EAAA,KAAA,CAAM,KAAK,CAAC,CAAA,CAAA;AACpE,UAAgB,eAAA,CAAA,MAAA,CAAO,OAAO,CAAC,CAAA,CAAA;AAAA,SAE5B,MAAA;AACH,UAAgB,eAAA,CAAA,IAAA,CAAK,MAAM,KAAK,CAAA,CAAA;AAAA,SAClC;AACA,QAAA,oBAAA,CAAqB,WAAW,KAAQ,GAAA,eAAA,CAAA;AAAA,OAErC,MAAA;AACH,QAAA,UAAA,CAAW,QAAQC,8BAAgB,CAAA,UAAA,CAAW,KAAK,CAAI,GAAA,IAAA,GAAO,CAAC,UAAW,CAAA,KAAA,CAAA;AAAA,OAC5E;AAAA,KACF;AAEA,IAAM,MAAA,aAAA,GAAgBC,qCAAe,cAAc,CAAA,CAAA;AACnD,IAAA,MAAM,SAAY,GAAAJ,YAAA,CAAS,MAAM,KAAA,CAAM,MAAM,cAAe,CAAA,KAAA,GACvD,QAAS,CAAA,aAAA,CAAc,SAAS,KAAM,CAAA,EAAE,CAAI,EAAA,CAAA,CAAA,EAAwB,YACrE,KAAS,CAAA,CAAA,CAAA;AAEb,IAA2B,0BAAA,CAAA;AAAA,MACzB,QAAA;AAAA,MACA,KAAO,EAAA,aAAA;AAAA,KACR,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"CheckboxRoot.cjs","sources":["../../src/Checkbox/CheckboxRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\nimport { createContext, isNullish, isValueEqualOrExist, useFormControl, useForwardExpose } from '@/shared'\nimport type { CheckedState } from './utils'\nimport type { AcceptableValue, FormFieldProps } from '@/shared/types'\nimport { useVModel } from '@vueuse/core'\nimport { injectCheckboxGroupRootContext } from './CheckboxGroupRoot.vue'\n\nexport interface CheckboxRootProps extends PrimitiveProps, FormFieldProps {\n /** The value of the checkbox when it is initially rendered. Use when you do not need to control its value. */\n defaultValue?: boolean | 'indeterminate'\n /** The controlled value of the checkbox. Can be binded with v-model. */\n modelValue?: boolean | 'indeterminate' | null\n /** When `true`, prevents the user from interacting with the checkbox */\n disabled?: boolean\n /**\n * The value given as data when submitted with a `name`.\n * @defaultValue \"on\"\n */\n value?: AcceptableValue\n /** Id of the element */\n id?: string\n}\n\nexport type CheckboxRootEmits = {\n /** Event handler called when the value of the checkbox changes. */\n 'update:modelValue': [value: boolean | 'indeterminate']\n}\n\ninterface CheckboxRootContext {\n disabled: Ref<boolean>\n state: Ref<CheckedState>\n}\n\nexport const [injectCheckboxRootContext, provideCheckboxRootContext]\n = createContext<CheckboxRootContext>('CheckboxRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { Primitive } from '@/Primitive'\nimport { RovingFocusItem } from '@/RovingFocus'\nimport { getState, isIndeterminate } from './utils'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\nimport { isEqual } from 'ohash'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<CheckboxRootProps>(), {\n modelValue: undefined,\n value: 'on',\n as: 'button',\n})\nconst emits = defineEmits<CheckboxRootEmits>()\n\ndefineSlots<{\n default: (props: {\n /** Current value */\n modelValue: typeof modelValue.value\n /** Current state */\n state: typeof checkboxState.value\n }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst checkboxGroupContext = injectCheckboxGroupRootContext(null)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: props.defaultValue,\n passive: (props.modelValue === undefined) as false,\n}) as Ref<CheckedState>\n\nconst disabled = computed(() => checkboxGroupContext?.disabled.value || props.disabled)\n\nconst checkboxState = computed<CheckedState>(() => {\n if (!isNullish(checkboxGroupContext?.modelValue.value)) {\n return isValueEqualOrExist(checkboxGroupContext.modelValue.value, props.value)\n }\n else {\n return modelValue.value === 'indeterminate' ? 'indeterminate' : modelValue.value\n }\n})\n\nfunction handleClick() {\n if (!isNullish(checkboxGroupContext?.modelValue.value)) {\n const modelValueArray = [...(checkboxGroupContext.modelValue.value || [])]\n if (isValueEqualOrExist(modelValueArray, props.value)) {\n const index = modelValueArray.findIndex(i => isEqual(i, props.value))\n modelValueArray.splice(index, 1)\n }\n else {\n modelValueArray.push(props.value)\n }\n checkboxGroupContext.modelValue.value = modelValueArray\n }\n else {\n modelValue.value = isIndeterminate(modelValue.value) ? true : !modelValue.value\n }\n}\n\nconst isFormControl = useFormControl(currentElement)\nconst ariaLabel = computed(() => props.id && currentElement.value\n ? (document.querySelector(`[for=\"${props.id}\"]`) as HTMLLabelElement)?.innerText\n : undefined)\n\nprovideCheckboxRootContext({\n disabled,\n state: checkboxState,\n})\n</script>\n\n<template>\n <component\n v-bind=\"$attrs\"\n :is=\"checkboxGroupContext?.rovingFocus.value ? RovingFocusItem : Primitive\"\n :id=\"id\"\n :ref=\"forwardRef\"\n role=\"checkbox\"\n :as-child=\"asChild\"\n :as=\"as\"\n :type=\"as === 'button' ? 'button' : undefined\"\n :aria-checked=\"isIndeterminate(checkboxState) ? 'mixed' : checkboxState\"\n :aria-required=\"required\"\n :aria-label=\"$attrs['aria-label'] || ariaLabel\"\n :data-state=\"getState(checkboxState)\"\n :data-disabled=\"disabled ? '' : undefined\"\n :disabled=\"disabled\"\n :focusable=\"checkboxGroupContext?.rovingFocus.value ? !disabled : undefined\"\n @keydown.enter.prevent=\"() => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n }\"\n @click=\"handleClick\"\n >\n <slot\n :model-value=\"modelValue\"\n :state=\"checkboxState\"\n />\n\n <VisuallyHiddenInput\n v-if=\"isFormControl && name && !checkboxGroupContext\"\n type=\"checkbox\"\n :checked=\"!!checkboxState\"\n :name=\"name\"\n :value=\"value\"\n :disabled=\"disabled\"\n :required=\"required\"\n />\n </component>\n</template>\n"],"names":["createContext","useForwardExpose","injectCheckboxGroupRootContext","useVModel","computed","isNullish","isValueEqualOrExist","isEqual","isIndeterminate","useFormControl"],"mappings":";;;;;;;;;;;;;;;;AAmCO,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/DA,mCAAmC,cAAc,EAAA;;;;;;;;;;;;;;;;;;;AAerD,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AAWd,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA,CAAA;AAExD,IAAM,MAAA,oBAAA,GAAuBC,0DAA+B,IAAI,CAAA,CAAA;AAEhE,IAAA,MAAM,UAAa,GAAAC,cAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,cAAc,KAAM,CAAA,YAAA;AAAA,MACpB,OAAA,EAAU,MAAM,UAAe,KAAA,KAAA,CAAA;AAAA,KAChC,CAAA,CAAA;AAED,IAAA,MAAM,WAAWC,YAAS,CAAA,MAAM,sBAAsB,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA,CAAA;AAEtF,IAAM,MAAA,aAAA,GAAgBA,aAAuB,MAAM;AACjD,MAAA,IAAI,CAACC,wBAAA,CAAU,oBAAsB,EAAA,UAAA,CAAW,KAAK,CAAG,EAAA;AACtD,QAAA,OAAOC,8CAAoB,CAAA,oBAAA,CAAqB,UAAW,CAAA,KAAA,EAAO,MAAM,KAAK,CAAA,CAAA;AAAA,OAE1E,MAAA;AACH,QAAA,OAAO,UAAW,CAAA,KAAA,KAAU,eAAkB,GAAA,eAAA,GAAkB,UAAW,CAAA,KAAA,CAAA;AAAA,OAC7E;AAAA,KACD,CAAA,CAAA;AAED,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,IAAI,CAACD,wBAAA,CAAU,oBAAsB,EAAA,UAAA,CAAW,KAAK,CAAG,EAAA;AACtD,QAAA,MAAM,kBAAkB,CAAC,GAAI,qBAAqB,UAAW,CAAA,KAAA,IAAS,EAAG,CAAA,CAAA;AACzE,QAAA,IAAIC,8CAAoB,CAAA,eAAA,EAAiB,KAAM,CAAA,KAAK,CAAG,EAAA;AACrD,UAAM,MAAA,KAAA,GAAQ,gBAAgB,SAAU,CAAA,CAAA,CAAA,KAAKC,cAAQ,CAAG,EAAA,KAAA,CAAM,KAAK,CAAC,CAAA,CAAA;AACpE,UAAgB,eAAA,CAAA,MAAA,CAAO,OAAO,CAAC,CAAA,CAAA;AAAA,SAE5B,MAAA;AACH,UAAgB,eAAA,CAAA,IAAA,CAAK,MAAM,KAAK,CAAA,CAAA;AAAA,SAClC;AACA,QAAA,oBAAA,CAAqB,WAAW,KAAQ,GAAA,eAAA,CAAA;AAAA,OAErC,MAAA;AACH,QAAA,UAAA,CAAW,QAAQC,8BAAgB,CAAA,UAAA,CAAW,KAAK,CAAI,GAAA,IAAA,GAAO,CAAC,UAAW,CAAA,KAAA,CAAA;AAAA,OAC5E;AAAA,KACF;AAEA,IAAM,MAAA,aAAA,GAAgBC,qCAAe,cAAc,CAAA,CAAA;AACnD,IAAA,MAAM,SAAY,GAAAL,YAAA,CAAS,MAAM,KAAA,CAAM,MAAM,cAAe,CAAA,KAAA,GACvD,QAAS,CAAA,aAAA,CAAc,SAAS,KAAM,CAAA,EAAE,CAAI,EAAA,CAAA,CAAA,EAAwB,YACrE,KAAS,CAAA,CAAA,CAAA;AAEb,IAA2B,0BAAA,CAAA;AAAA,MACzB,QAAA;AAAA,MACA,KAAO,EAAA,aAAA;AAAA,KACR,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -5,6 +5,7 @@ import { isEqual } from 'ohash';
5
5
  import { useVModel } from '@vueuse/core';
6
6
  import { u as useForwardExpose } from '../shared/useForwardExpose.js';
7
7
  import { i as injectCheckboxGroupRootContext } from './CheckboxGroupRoot.js';
8
+ import { i as isNullish } from '../shared/nullish.js';
8
9
  import { i as isValueEqualOrExist } from '../shared/isValueEqualOrExist.js';
9
10
  import { u as useFormControl } from '../shared/useFormControl.js';
10
11
  import { P as Primitive } from '../Primitive/Primitive.js';
@@ -19,7 +20,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
19
20
  __name: "CheckboxRoot",
20
21
  props: {
21
22
  defaultValue: { type: [Boolean, String] },
22
- modelValue: { type: [Boolean, String], default: void 0 },
23
+ modelValue: { type: [Boolean, String, null], default: void 0 },
23
24
  disabled: { type: Boolean },
24
25
  value: { default: "on" },
25
26
  id: {},
@@ -40,14 +41,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
40
41
  });
41
42
  const disabled = computed(() => checkboxGroupContext?.disabled.value || props.disabled);
42
43
  const checkboxState = computed(() => {
43
- if (checkboxGroupContext?.modelValue.value !== void 0) {
44
+ if (!isNullish(checkboxGroupContext?.modelValue.value)) {
44
45
  return isValueEqualOrExist(checkboxGroupContext.modelValue.value, props.value);
45
46
  } else {
46
47
  return modelValue.value === "indeterminate" ? "indeterminate" : modelValue.value;
47
48
  }
48
49
  });
49
50
  function handleClick() {
50
- if (checkboxGroupContext?.modelValue.value !== void 0) {
51
+ if (!isNullish(checkboxGroupContext?.modelValue.value)) {
51
52
  const modelValueArray = [...checkboxGroupContext.modelValue.value || []];
52
53
  if (isValueEqualOrExist(modelValueArray, props.value)) {
53
54
  const index = modelValueArray.findIndex((i) => isEqual(i, props.value));
@@ -1 +1 @@
1
- {"version":3,"file":"CheckboxRoot.js","sources":["../../src/Checkbox/CheckboxRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\nimport { createContext, isValueEqualOrExist, useFormControl, useForwardExpose } from '@/shared'\nimport type { CheckedState } from './utils'\nimport type { AcceptableValue, FormFieldProps } from '@/shared/types'\nimport { useVModel } from '@vueuse/core'\nimport { injectCheckboxGroupRootContext } from './CheckboxGroupRoot.vue'\n\nexport interface CheckboxRootProps extends PrimitiveProps, FormFieldProps {\n /** The value of the checkbox when it is initially rendered. Use when you do not need to control its value. */\n defaultValue?: boolean | 'indeterminate'\n /** The controlled value of the checkbox. Can be binded with v-model. */\n modelValue?: boolean | 'indeterminate'\n /** When `true`, prevents the user from interacting with the checkbox */\n disabled?: boolean\n /**\n * The value given as data when submitted with a `name`.\n * @defaultValue \"on\"\n */\n value?: AcceptableValue\n /** Id of the element */\n id?: string\n}\n\nexport type CheckboxRootEmits = {\n /** Event handler called when the value of the checkbox changes. */\n 'update:modelValue': [value: boolean | 'indeterminate']\n}\n\ninterface CheckboxRootContext {\n disabled: Ref<boolean>\n state: Ref<CheckedState>\n}\n\nexport const [injectCheckboxRootContext, provideCheckboxRootContext]\n = createContext<CheckboxRootContext>('CheckboxRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { Primitive } from '@/Primitive'\nimport { RovingFocusItem } from '@/RovingFocus'\nimport { getState, isIndeterminate } from './utils'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\nimport { isEqual } from 'ohash'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<CheckboxRootProps>(), {\n modelValue: undefined,\n value: 'on',\n as: 'button',\n})\nconst emits = defineEmits<CheckboxRootEmits>()\n\ndefineSlots<{\n default: (props: {\n /** Current value */\n modelValue: typeof modelValue.value\n /** Current state */\n state: typeof checkboxState.value\n }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst checkboxGroupContext = injectCheckboxGroupRootContext(null)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: props.defaultValue,\n passive: (props.modelValue === undefined) as false,\n}) as Ref<CheckedState>\n\nconst disabled = computed(() => checkboxGroupContext?.disabled.value || props.disabled)\n\nconst checkboxState = computed<CheckedState>(() => {\n if (checkboxGroupContext?.modelValue.value !== undefined) {\n return isValueEqualOrExist(checkboxGroupContext.modelValue.value, props.value)\n }\n else {\n return modelValue.value === 'indeterminate' ? 'indeterminate' : modelValue.value\n }\n})\n\nfunction handleClick() {\n if (checkboxGroupContext?.modelValue.value !== undefined) {\n const modelValueArray = [...(checkboxGroupContext.modelValue.value || [])]\n if (isValueEqualOrExist(modelValueArray, props.value)) {\n const index = modelValueArray.findIndex(i => isEqual(i, props.value))\n modelValueArray.splice(index, 1)\n }\n else {\n modelValueArray.push(props.value)\n }\n checkboxGroupContext.modelValue.value = modelValueArray\n }\n else {\n modelValue.value = isIndeterminate(modelValue.value) ? true : !modelValue.value\n }\n}\n\nconst isFormControl = useFormControl(currentElement)\nconst ariaLabel = computed(() => props.id && currentElement.value\n ? (document.querySelector(`[for=\"${props.id}\"]`) as HTMLLabelElement)?.innerText\n : undefined)\n\nprovideCheckboxRootContext({\n disabled,\n state: checkboxState,\n})\n</script>\n\n<template>\n <component\n v-bind=\"$attrs\"\n :is=\"checkboxGroupContext?.rovingFocus.value ? RovingFocusItem : Primitive\"\n :id=\"id\"\n :ref=\"forwardRef\"\n role=\"checkbox\"\n :as-child=\"asChild\"\n :as=\"as\"\n :type=\"as === 'button' ? 'button' : undefined\"\n :aria-checked=\"isIndeterminate(checkboxState) ? 'mixed' : checkboxState\"\n :aria-required=\"required\"\n :aria-label=\"$attrs['aria-label'] || ariaLabel\"\n :data-state=\"getState(checkboxState)\"\n :data-disabled=\"disabled ? '' : undefined\"\n :disabled=\"disabled\"\n :focusable=\"checkboxGroupContext?.rovingFocus.value ? !disabled : undefined\"\n @keydown.enter.prevent=\"() => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n }\"\n @click=\"handleClick\"\n >\n <slot\n :model-value=\"modelValue\"\n :state=\"checkboxState\"\n />\n\n <VisuallyHiddenInput\n v-if=\"isFormControl && name && !checkboxGroupContext\"\n type=\"checkbox\"\n :checked=\"!!checkboxState\"\n :name=\"name\"\n :value=\"value\"\n :disabled=\"disabled\"\n :required=\"required\"\n />\n </component>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;AAmCO,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/D,cAAmC,cAAc,EAAA;;;;;;;;;;;;;;;;;;;AAerD,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AAWd,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAExD,IAAM,MAAA,oBAAA,GAAuB,+BAA+B,IAAI,CAAA,CAAA;AAEhE,IAAA,MAAM,UAAa,GAAA,SAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,cAAc,KAAM,CAAA,YAAA;AAAA,MACpB,OAAA,EAAU,MAAM,UAAe,KAAA,KAAA,CAAA;AAAA,KAChC,CAAA,CAAA;AAED,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,sBAAsB,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA,CAAA;AAEtF,IAAM,MAAA,aAAA,GAAgB,SAAuB,MAAM;AACjD,MAAI,IAAA,oBAAA,EAAsB,UAAW,CAAA,KAAA,KAAU,KAAW,CAAA,EAAA;AACxD,QAAA,OAAO,mBAAoB,CAAA,oBAAA,CAAqB,UAAW,CAAA,KAAA,EAAO,MAAM,KAAK,CAAA,CAAA;AAAA,OAE1E,MAAA;AACH,QAAA,OAAO,UAAW,CAAA,KAAA,KAAU,eAAkB,GAAA,eAAA,GAAkB,UAAW,CAAA,KAAA,CAAA;AAAA,OAC7E;AAAA,KACD,CAAA,CAAA;AAED,IAAA,SAAS,WAAc,GAAA;AACrB,MAAI,IAAA,oBAAA,EAAsB,UAAW,CAAA,KAAA,KAAU,KAAW,CAAA,EAAA;AACxD,QAAA,MAAM,kBAAkB,CAAC,GAAI,qBAAqB,UAAW,CAAA,KAAA,IAAS,EAAG,CAAA,CAAA;AACzE,QAAA,IAAI,mBAAoB,CAAA,eAAA,EAAiB,KAAM,CAAA,KAAK,CAAG,EAAA;AACrD,UAAM,MAAA,KAAA,GAAQ,gBAAgB,SAAU,CAAA,CAAA,CAAA,KAAK,QAAQ,CAAG,EAAA,KAAA,CAAM,KAAK,CAAC,CAAA,CAAA;AACpE,UAAgB,eAAA,CAAA,MAAA,CAAO,OAAO,CAAC,CAAA,CAAA;AAAA,SAE5B,MAAA;AACH,UAAgB,eAAA,CAAA,IAAA,CAAK,MAAM,KAAK,CAAA,CAAA;AAAA,SAClC;AACA,QAAA,oBAAA,CAAqB,WAAW,KAAQ,GAAA,eAAA,CAAA;AAAA,OAErC,MAAA;AACH,QAAA,UAAA,CAAW,QAAQ,eAAgB,CAAA,UAAA,CAAW,KAAK,CAAI,GAAA,IAAA,GAAO,CAAC,UAAW,CAAA,KAAA,CAAA;AAAA,OAC5E;AAAA,KACF;AAEA,IAAM,MAAA,aAAA,GAAgB,eAAe,cAAc,CAAA,CAAA;AACnD,IAAA,MAAM,SAAY,GAAA,QAAA,CAAS,MAAM,KAAA,CAAM,MAAM,cAAe,CAAA,KAAA,GACvD,QAAS,CAAA,aAAA,CAAc,SAAS,KAAM,CAAA,EAAE,CAAI,EAAA,CAAA,CAAA,EAAwB,YACrE,KAAS,CAAA,CAAA,CAAA;AAEb,IAA2B,0BAAA,CAAA;AAAA,MACzB,QAAA;AAAA,MACA,KAAO,EAAA,aAAA;AAAA,KACR,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"CheckboxRoot.js","sources":["../../src/Checkbox/CheckboxRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\nimport { createContext, isNullish, isValueEqualOrExist, useFormControl, useForwardExpose } from '@/shared'\nimport type { CheckedState } from './utils'\nimport type { AcceptableValue, FormFieldProps } from '@/shared/types'\nimport { useVModel } from '@vueuse/core'\nimport { injectCheckboxGroupRootContext } from './CheckboxGroupRoot.vue'\n\nexport interface CheckboxRootProps extends PrimitiveProps, FormFieldProps {\n /** The value of the checkbox when it is initially rendered. Use when you do not need to control its value. */\n defaultValue?: boolean | 'indeterminate'\n /** The controlled value of the checkbox. Can be binded with v-model. */\n modelValue?: boolean | 'indeterminate' | null\n /** When `true`, prevents the user from interacting with the checkbox */\n disabled?: boolean\n /**\n * The value given as data when submitted with a `name`.\n * @defaultValue \"on\"\n */\n value?: AcceptableValue\n /** Id of the element */\n id?: string\n}\n\nexport type CheckboxRootEmits = {\n /** Event handler called when the value of the checkbox changes. */\n 'update:modelValue': [value: boolean | 'indeterminate']\n}\n\ninterface CheckboxRootContext {\n disabled: Ref<boolean>\n state: Ref<CheckedState>\n}\n\nexport const [injectCheckboxRootContext, provideCheckboxRootContext]\n = createContext<CheckboxRootContext>('CheckboxRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { Primitive } from '@/Primitive'\nimport { RovingFocusItem } from '@/RovingFocus'\nimport { getState, isIndeterminate } from './utils'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\nimport { isEqual } from 'ohash'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<CheckboxRootProps>(), {\n modelValue: undefined,\n value: 'on',\n as: 'button',\n})\nconst emits = defineEmits<CheckboxRootEmits>()\n\ndefineSlots<{\n default: (props: {\n /** Current value */\n modelValue: typeof modelValue.value\n /** Current state */\n state: typeof checkboxState.value\n }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst checkboxGroupContext = injectCheckboxGroupRootContext(null)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: props.defaultValue,\n passive: (props.modelValue === undefined) as false,\n}) as Ref<CheckedState>\n\nconst disabled = computed(() => checkboxGroupContext?.disabled.value || props.disabled)\n\nconst checkboxState = computed<CheckedState>(() => {\n if (!isNullish(checkboxGroupContext?.modelValue.value)) {\n return isValueEqualOrExist(checkboxGroupContext.modelValue.value, props.value)\n }\n else {\n return modelValue.value === 'indeterminate' ? 'indeterminate' : modelValue.value\n }\n})\n\nfunction handleClick() {\n if (!isNullish(checkboxGroupContext?.modelValue.value)) {\n const modelValueArray = [...(checkboxGroupContext.modelValue.value || [])]\n if (isValueEqualOrExist(modelValueArray, props.value)) {\n const index = modelValueArray.findIndex(i => isEqual(i, props.value))\n modelValueArray.splice(index, 1)\n }\n else {\n modelValueArray.push(props.value)\n }\n checkboxGroupContext.modelValue.value = modelValueArray\n }\n else {\n modelValue.value = isIndeterminate(modelValue.value) ? true : !modelValue.value\n }\n}\n\nconst isFormControl = useFormControl(currentElement)\nconst ariaLabel = computed(() => props.id && currentElement.value\n ? (document.querySelector(`[for=\"${props.id}\"]`) as HTMLLabelElement)?.innerText\n : undefined)\n\nprovideCheckboxRootContext({\n disabled,\n state: checkboxState,\n})\n</script>\n\n<template>\n <component\n v-bind=\"$attrs\"\n :is=\"checkboxGroupContext?.rovingFocus.value ? RovingFocusItem : Primitive\"\n :id=\"id\"\n :ref=\"forwardRef\"\n role=\"checkbox\"\n :as-child=\"asChild\"\n :as=\"as\"\n :type=\"as === 'button' ? 'button' : undefined\"\n :aria-checked=\"isIndeterminate(checkboxState) ? 'mixed' : checkboxState\"\n :aria-required=\"required\"\n :aria-label=\"$attrs['aria-label'] || ariaLabel\"\n :data-state=\"getState(checkboxState)\"\n :data-disabled=\"disabled ? '' : undefined\"\n :disabled=\"disabled\"\n :focusable=\"checkboxGroupContext?.rovingFocus.value ? !disabled : undefined\"\n @keydown.enter.prevent=\"() => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n }\"\n @click=\"handleClick\"\n >\n <slot\n :model-value=\"modelValue\"\n :state=\"checkboxState\"\n />\n\n <VisuallyHiddenInput\n v-if=\"isFormControl && name && !checkboxGroupContext\"\n type=\"checkbox\"\n :checked=\"!!checkboxState\"\n :name=\"name\"\n :value=\"value\"\n :disabled=\"disabled\"\n :required=\"required\"\n />\n </component>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAmCO,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/D,cAAmC,cAAc,EAAA;;;;;;;;;;;;;;;;;;;AAerD,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AAWd,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAExD,IAAM,MAAA,oBAAA,GAAuB,+BAA+B,IAAI,CAAA,CAAA;AAEhE,IAAA,MAAM,UAAa,GAAA,SAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,cAAc,KAAM,CAAA,YAAA;AAAA,MACpB,OAAA,EAAU,MAAM,UAAe,KAAA,KAAA,CAAA;AAAA,KAChC,CAAA,CAAA;AAED,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,sBAAsB,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA,CAAA;AAEtF,IAAM,MAAA,aAAA,GAAgB,SAAuB,MAAM;AACjD,MAAA,IAAI,CAAC,SAAA,CAAU,oBAAsB,EAAA,UAAA,CAAW,KAAK,CAAG,EAAA;AACtD,QAAA,OAAO,mBAAoB,CAAA,oBAAA,CAAqB,UAAW,CAAA,KAAA,EAAO,MAAM,KAAK,CAAA,CAAA;AAAA,OAE1E,MAAA;AACH,QAAA,OAAO,UAAW,CAAA,KAAA,KAAU,eAAkB,GAAA,eAAA,GAAkB,UAAW,CAAA,KAAA,CAAA;AAAA,OAC7E;AAAA,KACD,CAAA,CAAA;AAED,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,IAAI,CAAC,SAAA,CAAU,oBAAsB,EAAA,UAAA,CAAW,KAAK,CAAG,EAAA;AACtD,QAAA,MAAM,kBAAkB,CAAC,GAAI,qBAAqB,UAAW,CAAA,KAAA,IAAS,EAAG,CAAA,CAAA;AACzE,QAAA,IAAI,mBAAoB,CAAA,eAAA,EAAiB,KAAM,CAAA,KAAK,CAAG,EAAA;AACrD,UAAM,MAAA,KAAA,GAAQ,gBAAgB,SAAU,CAAA,CAAA,CAAA,KAAK,QAAQ,CAAG,EAAA,KAAA,CAAM,KAAK,CAAC,CAAA,CAAA;AACpE,UAAgB,eAAA,CAAA,MAAA,CAAO,OAAO,CAAC,CAAA,CAAA;AAAA,SAE5B,MAAA;AACH,UAAgB,eAAA,CAAA,IAAA,CAAK,MAAM,KAAK,CAAA,CAAA;AAAA,SAClC;AACA,QAAA,oBAAA,CAAqB,WAAW,KAAQ,GAAA,eAAA,CAAA;AAAA,OAErC,MAAA;AACH,QAAA,UAAA,CAAW,QAAQ,eAAgB,CAAA,UAAA,CAAW,KAAK,CAAI,GAAA,IAAA,GAAO,CAAC,UAAW,CAAA,KAAA,CAAA;AAAA,OAC5E;AAAA,KACF;AAEA,IAAM,MAAA,aAAA,GAAgB,eAAe,cAAc,CAAA,CAAA;AACnD,IAAA,MAAM,SAAY,GAAA,QAAA,CAAS,MAAM,KAAA,CAAM,MAAM,cAAe,CAAA,KAAA,GACvD,QAAS,CAAA,aAAA,CAAc,SAAS,KAAM,CAAA,EAAE,CAAI,EAAA,CAAA,CAAA,EAAwB,YACrE,KAAS,CAAA,CAAA,CAAA;AAEb,IAA2B,0BAAA,CAAA;AAAA,MACzB,QAAA;AAAA,MACA,KAAO,EAAA,aAAA;AAAA,KACR,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -162,6 +162,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
162
162
  required: _ctx.required,
163
163
  disabled: vue.unref(disabled),
164
164
  "highlight-on-hover": true,
165
+ by: props.by,
165
166
  onHighlight: _cache[1] || (_cache[1] = ($event) => emits("highlight", $event))
166
167
  }), {
167
168
  default: vue.withCtx(() => [
@@ -171,7 +172,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
171
172
  })
172
173
  ]),
173
174
  _: 3
174
- }, 16, ["modelValue", "style", "as", "as-child", "dir", "multiple", "name", "required", "disabled"])
175
+ }, 16, ["modelValue", "style", "as", "as-child", "dir", "multiple", "name", "required", "disabled", "by"])
175
176
  ]),
176
177
  _: 3
177
178
  });