reka-ui 2.2.1 → 2.3.1

package/dist/Presence/usePresence.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePresence.js","sources":["../../src/Presence/usePresence.ts"],"sourcesContent":["import type { Ref } from 'vue'\nimport { useStateMachine } from '@/shared'\nimport { defaultWindow } from '@vueuse/core'\nimport { isClient } from '@vueuse/shared'\nimport { computed, nextTick, onUnmounted, ref, watch } from 'vue'\n\nexport function usePresence(\n  present: Ref<boolean>,\n  node: Ref<HTMLElement | undefined>,\n) {\n  const stylesRef = ref<CSSStyleDeclaration>({} as any)\n  const prevAnimationNameRef = ref<string>('none')\n  const prevPresentRef = ref(present)\n  const initialState = present.value ? 'mounted' : 'unmounted'\n  let timeoutId: number | undefined\n  const ownerWindow = node.value?.ownerDocument.defaultView ?? defaultWindow\n\n  const { state, dispatch } = useStateMachine(initialState, {\n    mounted: {\n      UNMOUNT: 'unmounted',\n      ANIMATION_OUT: 'unmountSuspended',\n    },\n    unmountSuspended: {\n      MOUNT: 'mounted',\n      ANIMATION_END: 'unmounted',\n    },\n    unmounted: {\n      MOUNT: 'mounted',\n    },\n  })\n\n  const dispatchCustomEvent = (name: 'enter' | 'after-enter' | 'leave' | 'after-leave') => {\n    // We only dispatch this event because CustomEvent is not available in Node18\n    // https://github.com/unovue/reka-ui/issues/930\n    if (isClient) {\n      const customEvent = new CustomEvent(name, { bubbles: false, cancelable: false })\n      node.value?.dispatchEvent(customEvent)\n    }\n  }\n\n  watch(\n    present,\n    async (currentPresent, prevPresent) => {\n      const hasPresentChanged = prevPresent !== currentPresent\n      await nextTick()\n      if (hasPresentChanged) {\n        const prevAnimationName = prevAnimationNameRef.value\n        const currentAnimationName = getAnimationName(node.value)\n\n        if (currentPresent) {\n          dispatch('MOUNT')\n          dispatchCustomEvent('enter')\n          if (currentAnimationName === 'none')\n            dispatchCustomEvent('after-enter')\n        }\n        else if (\n          currentAnimationName === 'none' || currentAnimationName === 'undefined'\n          || stylesRef.value?.display === 'none'\n        ) {\n          // If there is no exit animation or the element is hidden, animations won't run\n          // so we unmount instantly rv\n          dispatch('UNMOUNT')\n          dispatchCustomEvent('leave')\n          dispatchCustomEvent('after-leave')\n        }\n        else {\n          /**\n           * When `present` changes to `false`, we check changes to animation-name to\n           * determine whether an animation has started. We chose this approach (reading\n           * computed styles) because there is no `animationrun` event and `animationstart`\n           * fires after `animation-delay` has expired which would be too late.\n           */\n          const isAnimating = prevAnimationName !== currentAnimationName\n          if (prevPresent && isAnimating) {\n            dispatch('ANIMATION_OUT')\n            dispatchCustomEvent('leave')\n          }\n          else {\n            dispatch('UNMOUNT')\n            dispatchCustomEvent('after-leave')\n          }\n        }\n      }\n    },\n    { immediate: true },\n  )\n\n  /**\n   * Triggering an ANIMATION_OUT during an ANIMATION_IN will fire an `animationcancel`\n   * event for ANIMATION_IN after we have entered `unmountSuspended` state. So, we\n   * make sure we only trigger ANIMATION_END for the currently active animation.\n   */\n  const handleAnimationEnd = (event: AnimationEvent) => {\n    const currentAnimationName = getAnimationName(node.value)\n    const isCurrentAnimation = currentAnimationName.includes(\n      event.animationName,\n    )\n    const directionName = state.value === 'mounted' ? 'enter' : 'leave'\n    if (event.target === node.value && isCurrentAnimation) {\n      dispatchCustomEvent(`after-${directionName}`)\n      dispatch('ANIMATION_END')\n\n      if (!prevPresentRef.value) {\n        const currentFillMode = node.value.style.animationFillMode\n        node.value.style.animationFillMode = 'forwards'\n        // Reset the style after the node had time to unmount (for cases\n        // where the component chooses not to unmount). Doing this any\n        // sooner than `setTimeout` (e.g. with `requestAnimationFrame`)\n        // still causes a flash.\n        timeoutId = ownerWindow?.setTimeout(() => {\n          if (node.value?.style.animationFillMode === 'forwards') {\n            node.value.style.animationFillMode = currentFillMode\n          }\n        })\n      }\n    }\n    // if no animation, immediately trigger 'ANIMATION_END'\n    if (event.target === node.value && currentAnimationName === 'none')\n      dispatch('ANIMATION_END')\n  }\n  const handleAnimationStart = (event: AnimationEvent) => {\n    if (event.target === node.value) {\n      // if animation occurred, store its name as the previous animation.\n      prevAnimationNameRef.value = getAnimationName(node.value)\n    }\n  }\n\n  const watcher = watch(\n    node,\n    (newNode, oldNode) => {\n      if (newNode) {\n        stylesRef.value = getComputedStyle(newNode)\n        newNode.addEventListener('animationstart', handleAnimationStart)\n        newNode.addEventListener('animationcancel', handleAnimationEnd)\n        newNode.addEventListener('animationend', handleAnimationEnd)\n      }\n      else {\n        // Transition to the unmounted state if the node is removed prematurely.\n        // We avoid doing so during cleanup as the node may change but still exist.\n        dispatch('ANIMATION_END')\n\n        if (timeoutId !== undefined)\n          ownerWindow?.clearTimeout(timeoutId)\n        oldNode?.removeEventListener('animationstart', handleAnimationStart)\n        oldNode?.removeEventListener('animationcancel', handleAnimationEnd)\n        oldNode?.removeEventListener('animationend', handleAnimationEnd)\n      }\n    },\n    { immediate: true },\n  )\n\n  const stateWatcher = watch(state, () => {\n    const currentAnimationName = getAnimationName(node.value)\n    prevAnimationNameRef.value\n      = state.value === 'mounted' ? currentAnimationName : 'none'\n  })\n\n  onUnmounted(() => {\n    watcher()\n    stateWatcher()\n  })\n\n  const isPresent = computed(() =>\n    ['mounted', 'unmountSuspended'].includes(state.value),\n  )\n\n  return {\n    isPresent,\n  }\n}\n\nfunction getAnimationName(node?: HTMLElement) {\n  return node ? getComputedStyle(node).animationName || 'none' : 'none'\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"usePresence.js","sources":["../../src/Presence/usePresence.ts"],"sourcesContent":["import type { Ref } from 'vue'\nimport { defaultWindow } from '@vueuse/core'\nimport { isClient } from '@vueuse/shared'\nimport { computed, nextTick, onUnmounted, ref, watch } from 'vue'\nimport { useStateMachine } from '@/shared'\n\nexport function usePresence(\n  present: Ref<boolean>,\n  node: Ref<HTMLElement | undefined>,\n) {\n  const stylesRef = ref<CSSStyleDeclaration>({} as any)\n  const prevAnimationNameRef = ref<string>('none')\n  const prevPresentRef = ref(present)\n  const initialState = present.value ? 'mounted' : 'unmounted'\n  let timeoutId: number | undefined\n  const ownerWindow = node.value?.ownerDocument.defaultView ?? defaultWindow\n\n  const { state, dispatch } = useStateMachine(initialState, {\n    mounted: {\n      UNMOUNT: 'unmounted',\n      ANIMATION_OUT: 'unmountSuspended',\n    },\n    unmountSuspended: {\n      MOUNT: 'mounted',\n      ANIMATION_END: 'unmounted',\n    },\n    unmounted: {\n      MOUNT: 'mounted',\n    },\n  })\n\n  const dispatchCustomEvent = (name: 'enter' | 'after-enter' | 'leave' | 'after-leave') => {\n    // We only dispatch this event because CustomEvent is not available in Node18\n    // https://github.com/unovue/reka-ui/issues/930\n    if (isClient) {\n      const customEvent = new CustomEvent(name, { bubbles: false, cancelable: false })\n      node.value?.dispatchEvent(customEvent)\n    }\n  }\n\n  watch(\n    present,\n    async (currentPresent, prevPresent) => {\n      const hasPresentChanged = prevPresent !== currentPresent\n      await nextTick()\n      if (hasPresentChanged) {\n        const prevAnimationName = prevAnimationNameRef.value\n        const currentAnimationName = getAnimationName(node.value)\n\n        if (currentPresent) {\n          dispatch('MOUNT')\n          dispatchCustomEvent('enter')\n          if (currentAnimationName === 'none')\n            dispatchCustomEvent('after-enter')\n        }\n        else if (\n          currentAnimationName === 'none' || currentAnimationName === 'undefined'\n          || stylesRef.value?.display === 'none'\n        ) {\n          // If there is no exit animation or the element is hidden, animations won't run\n          // so we unmount instantly rv\n          dispatch('UNMOUNT')\n          dispatchCustomEvent('leave')\n          dispatchCustomEvent('after-leave')\n        }\n        else {\n          /**\n           * When `present` changes to `false`, we check changes to animation-name to\n           * determine whether an animation has started. We chose this approach (reading\n           * computed styles) because there is no `animationrun` event and `animationstart`\n           * fires after `animation-delay` has expired which would be too late.\n           */\n          const isAnimating = prevAnimationName !== currentAnimationName\n          if (prevPresent && isAnimating) {\n            dispatch('ANIMATION_OUT')\n            dispatchCustomEvent('leave')\n          }\n          else {\n            dispatch('UNMOUNT')\n            dispatchCustomEvent('after-leave')\n          }\n        }\n      }\n    },\n    { immediate: true },\n  )\n\n  /**\n   * Triggering an ANIMATION_OUT during an ANIMATION_IN will fire an `animationcancel`\n   * event for ANIMATION_IN after we have entered `unmountSuspended` state. So, we\n   * make sure we only trigger ANIMATION_END for the currently active animation.\n   */\n  const handleAnimationEnd = (event: AnimationEvent) => {\n    const currentAnimationName = getAnimationName(node.value)\n    const isCurrentAnimation = currentAnimationName.includes(\n      event.animationName,\n    )\n    const directionName = state.value === 'mounted' ? 'enter' : 'leave'\n    if (event.target === node.value && isCurrentAnimation) {\n      dispatchCustomEvent(`after-${directionName}`)\n      dispatch('ANIMATION_END')\n\n      if (!prevPresentRef.value) {\n        const currentFillMode = node.value.style.animationFillMode\n        node.value.style.animationFillMode = 'forwards'\n        // Reset the style after the node had time to unmount (for cases\n        // where the component chooses not to unmount). Doing this any\n        // sooner than `setTimeout` (e.g. with `requestAnimationFrame`)\n        // still causes a flash.\n        timeoutId = ownerWindow?.setTimeout(() => {\n          if (node.value?.style.animationFillMode === 'forwards') {\n            node.value.style.animationFillMode = currentFillMode\n          }\n        })\n      }\n    }\n    // if no animation, immediately trigger 'ANIMATION_END'\n    if (event.target === node.value && currentAnimationName === 'none')\n      dispatch('ANIMATION_END')\n  }\n  const handleAnimationStart = (event: AnimationEvent) => {\n    if (event.target === node.value) {\n      // if animation occurred, store its name as the previous animation.\n      prevAnimationNameRef.value = getAnimationName(node.value)\n    }\n  }\n\n  const watcher = watch(\n    node,\n    (newNode, oldNode) => {\n      if (newNode) {\n        stylesRef.value = getComputedStyle(newNode)\n        newNode.addEventListener('animationstart', handleAnimationStart)\n        newNode.addEventListener('animationcancel', handleAnimationEnd)\n        newNode.addEventListener('animationend', handleAnimationEnd)\n      }\n      else {\n        // Transition to the unmounted state if the node is removed prematurely.\n        // We avoid doing so during cleanup as the node may change but still exist.\n        dispatch('ANIMATION_END')\n\n        if (timeoutId !== undefined)\n          ownerWindow?.clearTimeout(timeoutId)\n        oldNode?.removeEventListener('animationstart', handleAnimationStart)\n        oldNode?.removeEventListener('animationcancel', handleAnimationEnd)\n        oldNode?.removeEventListener('animationend', handleAnimationEnd)\n      }\n    },\n    { immediate: true },\n  )\n\n  const stateWatcher = watch(state, () => {\n    const currentAnimationName = getAnimationName(node.value)\n    prevAnimationNameRef.value\n      = state.value === 'mounted' ? currentAnimationName : 'none'\n  })\n\n  onUnmounted(() => {\n    watcher()\n    stateWatcher()\n  })\n\n  const isPresent = computed(() =>\n    ['mounted', 'unmountSuspended'].includes(state.value),\n  )\n\n  return {\n    isPresent,\n  }\n}\n\nfunction getAnimationName(node?: HTMLElement) {\n  return node ? getComputedStyle(node).animationName || 'none' : 'none'\n}\n"],"names":[],"mappings":"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"}

package/dist/Primitive/Slot.cjs

@@ -17,15 +17,7 @@ const Slot = vue.defineComponent({
       const firstNonCommentChildren = childrens[firstNonCommentChildrenIndex];
       delete firstNonCommentChildren.props?.ref;
       const mergedProps = firstNonCommentChildren.props ? vue.mergeProps(attrs, firstNonCommentChildren.props) : attrs;
-      if (attrs.class && firstNonCommentChildren.props?.class)
-        delete firstNonCommentChildren.props.class;
-      const cloned = vue.cloneVNode(firstNonCommentChildren, mergedProps);
-      for (const prop in mergedProps) {
-        if (prop.startsWith("on")) {
-          cloned.props ||= {};
-          cloned.props[prop] = mergedProps[prop];
-        }
-      }
+      const cloned = vue.cloneVNode({ ...firstNonCommentChildren, props: {} }, mergedProps);
       if (childrens.length === 1)
         return cloned;
       childrens[firstNonCommentChildrenIndex] = cloned;

package/dist/Primitive/Slot.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Slot.cjs","sources":["../../src/Primitive/Slot.ts"],"sourcesContent":["import { renderSlotFragments } from '@/shared'\nimport { cloneVNode, Comment, defineComponent, mergeProps } from 'vue'\n\nexport const Slot = defineComponent({\n  name: 'PrimitiveSlot',\n  inheritAttrs: false,\n  setup(_, { attrs, slots }) {\n    return () => {\n      if (!slots.default)\n        return null\n\n      const childrens = renderSlotFragments(slots.default())\n      const firstNonCommentChildrenIndex = childrens.findIndex(child => child.type !== Comment)\n      if (firstNonCommentChildrenIndex === -1)\n        return childrens\n\n      const firstNonCommentChildren = childrens[firstNonCommentChildrenIndex]\n\n      // Remove props ref from being inferred\n      delete firstNonCommentChildren.props?.ref\n\n      const mergedProps = firstNonCommentChildren.props\n        ? mergeProps(attrs, firstNonCommentChildren.props)\n        : attrs\n      // Remove class to prevent duplicated\n      if (attrs.class && firstNonCommentChildren.props?.class)\n        delete firstNonCommentChildren.props.class\n      const cloned = cloneVNode(firstNonCommentChildren, mergedProps)\n\n      // Explicitly override props starting with `on`.\n      // It seems cloneVNode from Vue doesn't like overriding `onXXX` props.\n      // So we have to do it manually.\n      for (const prop in mergedProps) {\n        if (prop.startsWith('on')) {\n          cloned.props ||= {}\n          cloned.props[prop] = mergedProps[prop]\n        }\n      }\n\n      if (childrens.length === 1)\n        return cloned\n\n      childrens[firstNonCommentChildrenIndex] = cloned\n      return childrens\n    }\n  },\n})\n"],"names":["defineComponent","renderSlotFragments","Comment","mergeProps","cloneVNode"],"mappings":";;;;;AAGO,MAAM,OAAOA,mBAAgB,CAAA;AAAA,EAClC,IAAM,EAAA,eAAA;AAAA,EACN,YAAc,EAAA,KAAA;AAAA,EACd,KAAM,CAAA,CAAA,EAAG,EAAE,KAAA,EAAO,OAAS,EAAA;AACzB,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,CAAC,KAAM,CAAA,OAAA;AACT,QAAO,OAAA,IAAA;AAET,MAAA,MAAM,SAAY,GAAAC,8CAAA,CAAoB,KAAM,CAAA,OAAA,EAAS,CAAA;AACrD,MAAA,MAAM,+BAA+B,SAAU,CAAA,SAAA,CAAU,CAAS,KAAA,KAAA,KAAA,CAAM,SAASC,WAAO,CAAA;AACxF,MAAA,IAAI,4BAAiC,KAAA,EAAA;AACnC,QAAO,OAAA,SAAA;AAET,MAAM,MAAA,uBAAA,GAA0B,UAAU,4BAA4B,CAAA;AAGtE,MAAA,OAAO,wBAAwB,KAAO,EAAA,GAAA;AAEtC,MAAA,MAAM,cAAc,uBAAwB,CAAA,KAAA,GACxCC,eAAW,KAAO,EAAA,uBAAA,CAAwB,KAAK,CAC/C,GAAA,KAAA;AAEJ,MAAI,IAAA,KAAA,CAAM,KAAS,IAAA,uBAAA,CAAwB,KAAO,EAAA,KAAA;AAChD,QAAA,OAAO,wBAAwB,KAAM,CAAA,KAAA;AACvC,MAAM,MAAA,MAAA,GAASC,cAAW,CAAA,uBAAA,EAAyB,WAAW,CAAA;AAK9D,MAAA,KAAA,MAAW,QAAQ,WAAa,EAAA;AAC9B,QAAI,IAAA,IAAA,CAAK,UAAW,CAAA,IAAI,CAAG,EAAA;AACzB,UAAA,MAAA,CAAO,UAAU,EAAC;AAClB,UAAA,MAAA,CAAO,KAAM,CAAA,IAAI,CAAI,GAAA,WAAA,CAAY,IAAI,CAAA;AAAA;AACvC;AAGF,MAAA,IAAI,UAAU,MAAW,KAAA,CAAA;AACvB,QAAO,OAAA,MAAA;AAET,MAAA,SAAA,CAAU,4BAA4B,CAAI,GAAA,MAAA;AAC1C,MAAO,OAAA,SAAA;AAAA,KACT;AAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Slot.cjs","sources":["../../src/Primitive/Slot.ts"],"sourcesContent":["import { cloneVNode, Comment, defineComponent, mergeProps } from 'vue'\nimport { renderSlotFragments } from '@/shared'\n\nexport const Slot = defineComponent({\n  name: 'PrimitiveSlot',\n  inheritAttrs: false,\n  setup(_, { attrs, slots }) {\n    return () => {\n      if (!slots.default)\n        return null\n\n      const childrens = renderSlotFragments(slots.default())\n      const firstNonCommentChildrenIndex = childrens.findIndex(child => child.type !== Comment)\n      if (firstNonCommentChildrenIndex === -1)\n        return childrens\n\n      const firstNonCommentChildren = childrens[firstNonCommentChildrenIndex]\n\n      // Remove props ref from being inferred\n      delete firstNonCommentChildren.props?.ref\n\n      // Manually merge props to ensure `firstNonCommentChildren.props`\n      // has higher priority than `attrs` and can override `attrs`.\n      // Otherwise `cloneVNode(firstNonCommentChildren, attrs)` will\n      // prioritize `attrs` and override `firstNonCommentChildren.props`.\n      const mergedProps = firstNonCommentChildren.props\n        ? mergeProps(attrs, firstNonCommentChildren.props)\n        : attrs\n      const cloned = cloneVNode({ ...firstNonCommentChildren, props: {} }, mergedProps)\n\n      if (childrens.length === 1)\n        return cloned\n\n      childrens[firstNonCommentChildrenIndex] = cloned\n      return childrens\n    }\n  },\n})\n"],"names":["defineComponent","renderSlotFragments","Comment","mergeProps","cloneVNode"],"mappings":";;;;;AAGO,MAAM,OAAOA,mBAAgB,CAAA;AAAA,EAClC,IAAM,EAAA,eAAA;AAAA,EACN,YAAc,EAAA,KAAA;AAAA,EACd,KAAM,CAAA,CAAA,EAAG,EAAE,KAAA,EAAO,OAAS,EAAA;AACzB,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,CAAC,KAAM,CAAA,OAAA;AACT,QAAO,OAAA,IAAA;AAET,MAAA,MAAM,SAAY,GAAAC,8CAAA,CAAoB,KAAM,CAAA,OAAA,EAAS,CAAA;AACrD,MAAA,MAAM,+BAA+B,SAAU,CAAA,SAAA,CAAU,CAAS,KAAA,KAAA,KAAA,CAAM,SAASC,WAAO,CAAA;AACxF,MAAA,IAAI,4BAAiC,KAAA,EAAA;AACnC,QAAO,OAAA,SAAA;AAET,MAAM,MAAA,uBAAA,GAA0B,UAAU,4BAA4B,CAAA;AAGtE,MAAA,OAAO,wBAAwB,KAAO,EAAA,GAAA;AAMtC,MAAA,MAAM,cAAc,uBAAwB,CAAA,KAAA,GACxCC,eAAW,KAAO,EAAA,uBAAA,CAAwB,KAAK,CAC/C,GAAA,KAAA;AACJ,MAAM,MAAA,MAAA,GAASC,eAAW,EAAE,GAAG,yBAAyB,KAAO,EAAA,EAAG,EAAA,EAAG,WAAW,CAAA;AAEhF,MAAA,IAAI,UAAU,MAAW,KAAA,CAAA;AACvB,QAAO,OAAA,MAAA;AAET,MAAA,SAAA,CAAU,4BAA4B,CAAI,GAAA,MAAA;AAC1C,MAAO,OAAA,SAAA;AAAA,KACT;AAAA;AAEJ,CAAC;;;;"}

package/dist/Primitive/Slot.js

@@ -15,15 +15,7 @@ const Slot = defineComponent({
       const firstNonCommentChildren = childrens[firstNonCommentChildrenIndex];
       delete firstNonCommentChildren.props?.ref;
       const mergedProps = firstNonCommentChildren.props ? mergeProps(attrs, firstNonCommentChildren.props) : attrs;
-      if (attrs.class && firstNonCommentChildren.props?.class)
-        delete firstNonCommentChildren.props.class;
-      const cloned = cloneVNode(firstNonCommentChildren, mergedProps);
-      for (const prop in mergedProps) {
-        if (prop.startsWith("on")) {
-          cloned.props ||= {};
-          cloned.props[prop] = mergedProps[prop];
-        }
-      }
+      const cloned = cloneVNode({ ...firstNonCommentChildren, props: {} }, mergedProps);
       if (childrens.length === 1)
         return cloned;
       childrens[firstNonCommentChildrenIndex] = cloned;

package/dist/Primitive/Slot.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slot.js","sources":["../../src/Primitive/Slot.ts"],"sourcesContent":["import { renderSlotFragments } from '@/shared'\nimport { cloneVNode, Comment, defineComponent, mergeProps } from 'vue'\n\nexport const Slot = defineComponent({\n  name: 'PrimitiveSlot',\n  inheritAttrs: false,\n  setup(_, { attrs, slots }) {\n    return () => {\n      if (!slots.default)\n        return null\n\n      const childrens = renderSlotFragments(slots.default())\n      const firstNonCommentChildrenIndex = childrens.findIndex(child => child.type !== Comment)\n      if (firstNonCommentChildrenIndex === -1)\n        return childrens\n\n      const firstNonCommentChildren = childrens[firstNonCommentChildrenIndex]\n\n      // Remove props ref from being inferred\n      delete firstNonCommentChildren.props?.ref\n\n      const mergedProps = firstNonCommentChildren.props\n        ? mergeProps(attrs, firstNonCommentChildren.props)\n        : attrs\n      // Remove class to prevent duplicated\n      if (attrs.class && firstNonCommentChildren.props?.class)\n        delete firstNonCommentChildren.props.class\n      const cloned = cloneVNode(firstNonCommentChildren, mergedProps)\n\n      // Explicitly override props starting with `on`.\n      // It seems cloneVNode from Vue doesn't like overriding `onXXX` props.\n      // So we have to do it manually.\n      for (const prop in mergedProps) {\n        if (prop.startsWith('on')) {\n          cloned.props ||= {}\n          cloned.props[prop] = mergedProps[prop]\n        }\n      }\n\n      if (childrens.length === 1)\n        return cloned\n\n      childrens[firstNonCommentChildrenIndex] = cloned\n      return childrens\n    }\n  },\n})\n"],"names":[],"mappings":";;;AAGO,MAAM,OAAO,eAAgB,CAAA;AAAA,EAClC,IAAM,EAAA,eAAA;AAAA,EACN,YAAc,EAAA,KAAA;AAAA,EACd,KAAM,CAAA,CAAA,EAAG,EAAE,KAAA,EAAO,OAAS,EAAA;AACzB,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,CAAC,KAAM,CAAA,OAAA;AACT,QAAO,OAAA,IAAA;AAET,MAAA,MAAM,SAAY,GAAA,mBAAA,CAAoB,KAAM,CAAA,OAAA,EAAS,CAAA;AACrD,MAAA,MAAM,+BAA+B,SAAU,CAAA,SAAA,CAAU,CAAS,KAAA,KAAA,KAAA,CAAM,SAAS,OAAO,CAAA;AACxF,MAAA,IAAI,4BAAiC,KAAA,EAAA;AACnC,QAAO,OAAA,SAAA;AAET,MAAM,MAAA,uBAAA,GAA0B,UAAU,4BAA4B,CAAA;AAGtE,MAAA,OAAO,wBAAwB,KAAO,EAAA,GAAA;AAEtC,MAAA,MAAM,cAAc,uBAAwB,CAAA,KAAA,GACxC,WAAW,KAAO,EAAA,uBAAA,CAAwB,KAAK,CAC/C,GAAA,KAAA;AAEJ,MAAI,IAAA,KAAA,CAAM,KAAS,IAAA,uBAAA,CAAwB,KAAO,EAAA,KAAA;AAChD,QAAA,OAAO,wBAAwB,KAAM,CAAA,KAAA;AACvC,MAAM,MAAA,MAAA,GAAS,UAAW,CAAA,uBAAA,EAAyB,WAAW,CAAA;AAK9D,MAAA,KAAA,MAAW,QAAQ,WAAa,EAAA;AAC9B,QAAI,IAAA,IAAA,CAAK,UAAW,CAAA,IAAI,CAAG,EAAA;AACzB,UAAA,MAAA,CAAO,UAAU,EAAC;AAClB,UAAA,MAAA,CAAO,KAAM,CAAA,IAAI,CAAI,GAAA,WAAA,CAAY,IAAI,CAAA;AAAA;AACvC;AAGF,MAAA,IAAI,UAAU,MAAW,KAAA,CAAA;AACvB,QAAO,OAAA,MAAA;AAET,MAAA,SAAA,CAAU,4BAA4B,CAAI,GAAA,MAAA;AAC1C,MAAO,OAAA,SAAA;AAAA,KACT;AAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Slot.js","sources":["../../src/Primitive/Slot.ts"],"sourcesContent":["import { cloneVNode, Comment, defineComponent, mergeProps } from 'vue'\nimport { renderSlotFragments } from '@/shared'\n\nexport const Slot = defineComponent({\n  name: 'PrimitiveSlot',\n  inheritAttrs: false,\n  setup(_, { attrs, slots }) {\n    return () => {\n      if (!slots.default)\n        return null\n\n      const childrens = renderSlotFragments(slots.default())\n      const firstNonCommentChildrenIndex = childrens.findIndex(child => child.type !== Comment)\n      if (firstNonCommentChildrenIndex === -1)\n        return childrens\n\n      const firstNonCommentChildren = childrens[firstNonCommentChildrenIndex]\n\n      // Remove props ref from being inferred\n      delete firstNonCommentChildren.props?.ref\n\n      // Manually merge props to ensure `firstNonCommentChildren.props`\n      // has higher priority than `attrs` and can override `attrs`.\n      // Otherwise `cloneVNode(firstNonCommentChildren, attrs)` will\n      // prioritize `attrs` and override `firstNonCommentChildren.props`.\n      const mergedProps = firstNonCommentChildren.props\n        ? mergeProps(attrs, firstNonCommentChildren.props)\n        : attrs\n      const cloned = cloneVNode({ ...firstNonCommentChildren, props: {} }, mergedProps)\n\n      if (childrens.length === 1)\n        return cloned\n\n      childrens[firstNonCommentChildrenIndex] = cloned\n      return childrens\n    }\n  },\n})\n"],"names":[],"mappings":";;;AAGO,MAAM,OAAO,eAAgB,CAAA;AAAA,EAClC,IAAM,EAAA,eAAA;AAAA,EACN,YAAc,EAAA,KAAA;AAAA,EACd,KAAM,CAAA,CAAA,EAAG,EAAE,KAAA,EAAO,OAAS,EAAA;AACzB,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,CAAC,KAAM,CAAA,OAAA;AACT,QAAO,OAAA,IAAA;AAET,MAAA,MAAM,SAAY,GAAA,mBAAA,CAAoB,KAAM,CAAA,OAAA,EAAS,CAAA;AACrD,MAAA,MAAM,+BAA+B,SAAU,CAAA,SAAA,CAAU,CAAS,KAAA,KAAA,KAAA,CAAM,SAAS,OAAO,CAAA;AACxF,MAAA,IAAI,4BAAiC,KAAA,EAAA;AACnC,QAAO,OAAA,SAAA;AAET,MAAM,MAAA,uBAAA,GAA0B,UAAU,4BAA4B,CAAA;AAGtE,MAAA,OAAO,wBAAwB,KAAO,EAAA,GAAA;AAMtC,MAAA,MAAM,cAAc,uBAAwB,CAAA,KAAA,GACxC,WAAW,KAAO,EAAA,uBAAA,CAAwB,KAAK,CAC/C,GAAA,KAAA;AACJ,MAAM,MAAA,MAAA,GAAS,WAAW,EAAE,GAAG,yBAAyB,KAAO,EAAA,EAAG,EAAA,EAAG,WAAW,CAAA;AAEhF,MAAA,IAAI,UAAU,MAAW,KAAA,CAAA;AACvB,QAAO,OAAA,MAAA;AAET,MAAA,SAAA,CAAU,4BAA4B,CAAI,GAAA,MAAA;AAC1C,MAAO,OAAA,SAAA;AAAA,KACT;AAAA;AAEJ,CAAC;;;;"}

package/dist/Progress/ProgressRoot.cjs

@@ -36,7 +36,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   props: {
     modelValue: {},
     max: { default: DEFAULT_MAX },
-    getValueLabel: { type: Function, default: (value, max) => `${Math.round(value / max * DEFAULT_MAX)}%` },
+    getValueLabel: { type: Function, default: (value, max) => isNumber(value) ? `${Math.round(value / max * DEFAULT_MAX)}%` : void 0 },
+    getValueText: {},
     asChild: { type: Boolean },
     as: {}
   },
@@ -90,7 +91,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         "aria-valuemax": vue.unref(max),
         "aria-valuemin": 0,
         "aria-valuenow": isNumber(vue.unref(modelValue)) ? vue.unref(modelValue) : void 0,
-        "aria-valuetext": _ctx.getValueLabel(vue.unref(modelValue), vue.unref(max)),
+        "aria-valuetext": _ctx.getValueText?.(vue.unref(modelValue), vue.unref(max)),
         "aria-label": _ctx.getValueLabel(vue.unref(modelValue), vue.unref(max)),
         role: "progressbar",
         "data-state": progressState.value,

package/dist/Progress/ProgressRoot.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressRoot.cjs","sources":["../../src/Progress/ProgressRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { ComputedRef, Ref } from 'vue'\nimport { createContext, isNullish, useForwardExpose } from '@/shared'\n\nexport type ProgressRootEmits = {\n  /** Event handler called when the progress value changes */\n  'update:modelValue': [value: string[] | undefined]\n  /** Event handler called when the max value changes */\n  'update:max': [value: number]\n}\n\nexport interface ProgressRootProps extends PrimitiveProps {\n  /** The progress value. Can be bind as `v-model`. */\n  modelValue?: number | null\n  /** The maximum progress value. */\n  max?: number\n  /**\n   * A function to get the accessible label text representing the current value in a human-readable format.\n   *\n   *  If not provided, the value label will be read as the numeric value as a percentage of the max value.\n   */\n  getValueLabel?: (value: number, max: number) => string\n}\n\nconst DEFAULT_MAX = 100\n\ninterface ProgressRootContext {\n  modelValue?: Readonly<Ref<ProgressRootProps['modelValue']>>\n  max: Readonly<Ref<number>>\n  progressState: ComputedRef<ProgressState>\n}\n\nexport const [injectProgressRootContext, provideProgressRootContext]\n  = createContext<ProgressRootContext>('ProgressRoot')\n\nexport type ProgressState = 'indeterminate' | 'loading' | 'complete'\n\nconst isNumber = (v: any): v is number => typeof v === 'number'\n\nfunction validateValue(value: any, max: number): number | null {\n  const isValidValueError\n    = isNullish(value)\n      || (isNumber(value) && !Number.isNaN(value) && value <= max && value >= 0)\n\n  if (isValidValueError)\n    return value as null\n\n  console.error(`Invalid prop \\`value\\` of value \\`${value}\\` supplied to \\`ProgressRoot\\`. The \\`value\\` prop must be:\n  - a positive number\n  - less than the value passed to \\`max\\` (or ${DEFAULT_MAX} if no \\`max\\` prop is set)\n  - \\`null\\`  or \\`undefined\\` if the progress is indeterminate.\n\nDefaulting to \\`null\\`.`)\n  return null\n}\n\nfunction validateMax(max: number): number {\n  const isValidMaxError = isNumber(max) && !Number.isNaN(max) && max > 0\n\n  if (isValidMaxError)\n    return max\n\n  console.error(\n    `Invalid prop \\`max\\` of value \\`${max}\\` supplied to \\`ProgressRoot\\`. Only numbers greater than 0 are valid max values. Defaulting to \\`${DEFAULT_MAX}\\`.`,\n  )\n  return DEFAULT_MAX\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useVModel } from '@vueuse/core'\nimport { computed, nextTick, watch } from 'vue'\n\nconst props = withDefaults(defineProps<ProgressRootProps>(), {\n  max: DEFAULT_MAX,\n  getValueLabel: (value: number, max: number) =>\n    `${Math.round((value / max) * DEFAULT_MAX)}%`,\n})\n\nconst emit = defineEmits<ProgressRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nuseForwardExpose()\nconst modelValue = useVModel(props, 'modelValue', emit, {\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst max = useVModel(props, 'max', emit, {\n  passive: (props.max === undefined) as false,\n})\n\n// ------- Watch for correct values -------\nwatch(\n  () => modelValue.value,\n  async (value) => {\n    const correctedValue = validateValue(value, props.max)\n    if (correctedValue !== value) {\n      await nextTick()\n      modelValue.value = correctedValue\n    }\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => props.max,\n  (newMax) => {\n    const correctedMax = validateMax(props.max)\n    if (correctedMax !== newMax)\n      max.value = correctedMax\n  },\n  { immediate: true },\n)\n// ------- End of watch for correct values -------\n\nconst progressState = computed<ProgressState>(() => {\n  if (isNullish(modelValue.value))\n    return 'indeterminate'\n  if (modelValue.value === max.value)\n    return 'complete'\n  return 'loading'\n})\n\nprovideProgressRootContext({\n  modelValue,\n  max,\n  progressState,\n})\n</script>\n\n<template>\n  <Primitive\n    :as-child=\"asChild\"\n    :as=\"as\"\n    :aria-valuemax=\"max\"\n    :aria-valuemin=\"0\"\n    :aria-valuenow=\"isNumber(modelValue) ? modelValue : undefined\"\n    :aria-valuetext=\"getValueLabel(modelValue!, max)\"\n    :aria-label=\"getValueLabel(modelValue!, max)\"\n    role=\"progressbar\"\n    :data-state=\"progressState\"\n    :data-value=\"modelValue ?? undefined\"\n    :data-max=\"max\"\n  >\n    <slot :model-value=\"modelValue\" />\n  </Primitive>\n</template>\n"],"names":["createContext","isNullish","useForwardExpose","useVModel","watch","nextTick","computed"],"mappings":";;;;;;;;;AAyBA,MAAM,WAAc,GAAA,GAAA;AAQb,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/DA,mCAAmC,cAAc;AAIrD,MAAM,QAAW,GAAA,CAAC,CAAwB,KAAA,OAAO,CAAM,KAAA,QAAA;AAEvD,SAAS,aAAA,CAAc,OAAY,GAA4B,EAAA;AAC7D,EAAA,MAAM,iBACF,GAAAC,wBAAA,CAAU,KAAK,CAAA,IACX,SAAS,KAAK,CAAA,IAAK,CAAC,MAAA,CAAO,KAAM,CAAA,KAAK,CAAK,IAAA,KAAA,IAAS,OAAO,KAAS,IAAA,CAAA;AAE5E,EAAI,IAAA,iBAAA;AACF,IAAO,OAAA,KAAA;AAET,EAAQ,OAAA,CAAA,KAAA,CAAM,qCAAqC,KAAK,CAAA;AAAA;AAAA,8CAAA,EAEV,WAAW,CAAA;AAAA;;AAAA,uBAGnC,CAAA,CAAA;AACtB,EAAO,OAAA,IAAA;AACT;AAEA,SAAS,YAAY,GAAqB,EAAA;AACxC,EAAM,MAAA,eAAA,GAAkB,SAAS,GAAG,CAAA,IAAK,CAAC,MAAO,CAAA,KAAA,CAAM,GAAG,CAAA,IAAK,GAAM,GAAA,CAAA;AAErE,EAAI,IAAA,eAAA;AACF,IAAO,OAAA,GAAA;AAET,EAAQ,OAAA,CAAA,KAAA;AAAA,IACN,CAAA,gCAAA,EAAmC,GAAG,CAAA,mGAAA,EAAsG,WAAW,CAAA,GAAA;AAAA,GACzJ;AACA,EAAO,OAAA,WAAA;AACT;;;;;;;;;;;;AAQA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAiBC,wCAAA,EAAA;AACjB,IAAA,MAAM,UAAa,GAAAC,cAAA,CAAU,KAAO,EAAA,YAAA,EAAc,IAAM,EAAA;AAAA,MACtD,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,MAAM,GAAM,GAAAA,cAAA,CAAU,KAAO,EAAA,KAAA,EAAO,IAAM,EAAA;AAAA,MACxC,OAAA,EAAU,MAAM,GAAQ,KAAA;AAAA,KACzB,CAAA;AAGD,IAAAC,SAAA;AAAA,MACE,MAAM,UAAW,CAAA,KAAA;AAAA,MACjB,OAAO,KAAU,KAAA;AACf,QAAA,MAAM,cAAiB,GAAA,aAAA,CAAc,KAAO,EAAA,KAAA,CAAM,GAAG,CAAA;AACrD,QAAA,IAAI,mBAAmB,KAAO,EAAA;AAC5B,UAAA,MAAMC,YAAS,EAAA;AACf,UAAA,UAAA,CAAW,KAAQ,GAAA,cAAA;AAAA;AACrB,OACF;AAAA,MACA,EAAE,WAAW,IAAK;AAAA,KACpB;AAEA,IAAAD,SAAA;AAAA,MACE,MAAM,KAAM,CAAA,GAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAM,MAAA,YAAA,GAAe,WAAY,CAAA,KAAA,CAAM,GAAG,CAAA;AAC1C,QAAA,IAAI,YAAiB,KAAA,MAAA;AACnB,UAAA,GAAA,CAAI,KAAQ,GAAA,YAAA;AAAA,OAChB;AAAA,MACA,EAAE,WAAW,IAAK;AAAA,KACpB;AAGA,IAAM,MAAA,aAAA,GAAgBE,aAAwB,MAAM;AAClD,MAAI,IAAAL,wBAAA,CAAU,WAAW,KAAK,CAAA;AAC5B,QAAO,OAAA,eAAA;AACT,MAAI,IAAA,UAAA,CAAW,UAAU,GAAI,CAAA,KAAA;AAC3B,QAAO,OAAA,UAAA;AACT,MAAO,OAAA,SAAA;AAAA,KACR,CAAA;AAED,IAA2B,0BAAA,CAAA;AAAA,MACzB,UAAA;AAAA,MACA,GAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ProgressRoot.cjs","sources":["../../src/Progress/ProgressRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef, Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { createContext, isNullish, useForwardExpose } from '@/shared'\n\nexport type ProgressRootEmits = {\n  /** Event handler called when the progress value changes */\n  'update:modelValue': [value: string[] | undefined]\n  /** Event handler called when the max value changes */\n  'update:max': [value: number]\n}\n\nexport interface ProgressRootProps extends PrimitiveProps {\n  /** The progress value. Can be bind as `v-model`. */\n  modelValue?: number | null\n  /** The maximum progress value. */\n  max?: number\n  /**\n   * A function to get the accessible label text in a human-readable format.\n   *\n   *  If not provided, the value label will be read as the numeric value as a percentage of the max value.\n   */\n  getValueLabel?: (value: number | null | undefined, max: number) => string | undefined\n  /**\n   * A function to get the accessible value text representing the current value in a human-readable format.\n   */\n  getValueText?: (value: number | null | undefined, max: number) => string | undefined\n}\n\nconst DEFAULT_MAX = 100\n\ninterface ProgressRootContext {\n  modelValue?: Readonly<Ref<ProgressRootProps['modelValue']>>\n  max: Readonly<Ref<number>>\n  progressState: ComputedRef<ProgressState>\n}\n\nexport const [injectProgressRootContext, provideProgressRootContext]\n  = createContext<ProgressRootContext>('ProgressRoot')\n\nexport type ProgressState = 'indeterminate' | 'loading' | 'complete'\n\nconst isNumber = (v: any): v is number => typeof v === 'number'\n\nfunction validateValue(value: any, max: number): number | null {\n  const isValidValueError\n    = isNullish(value)\n      || (isNumber(value) && !Number.isNaN(value) && value <= max && value >= 0)\n\n  if (isValidValueError)\n    return value as null\n\n  console.error(`Invalid prop \\`value\\` of value \\`${value}\\` supplied to \\`ProgressRoot\\`. The \\`value\\` prop must be:\n  - a positive number\n  - less than the value passed to \\`max\\` (or ${DEFAULT_MAX} if no \\`max\\` prop is set)\n  - \\`null\\`  or \\`undefined\\` if the progress is indeterminate.\n\nDefaulting to \\`null\\`.`)\n  return null\n}\n\nfunction validateMax(max: number): number {\n  const isValidMaxError = isNumber(max) && !Number.isNaN(max) && max > 0\n\n  if (isValidMaxError)\n    return max\n\n  console.error(\n    `Invalid prop \\`max\\` of value \\`${max}\\` supplied to \\`ProgressRoot\\`. Only numbers greater than 0 are valid max values. Defaulting to \\`${DEFAULT_MAX}\\`.`,\n  )\n  return DEFAULT_MAX\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { computed, nextTick, watch } from 'vue'\nimport { Primitive } from '@/Primitive'\n\nconst props = withDefaults(defineProps<ProgressRootProps>(), {\n  max: DEFAULT_MAX,\n  getValueLabel: (value: number | null | undefined, max: number) =>\n    isNumber(value) ? `${Math.round((value / max) * DEFAULT_MAX)}%` : undefined,\n})\n\nconst emit = defineEmits<ProgressRootEmits>()\n\ndefineSlots<{\n  default?: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nuseForwardExpose()\nconst modelValue = useVModel(props, 'modelValue', emit, {\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst max = useVModel(props, 'max', emit, {\n  passive: (props.max === undefined) as false,\n})\n\n// ------- Watch for correct values -------\nwatch(\n  () => modelValue.value,\n  async (value) => {\n    const correctedValue = validateValue(value, props.max)\n    if (correctedValue !== value) {\n      await nextTick()\n      modelValue.value = correctedValue\n    }\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => props.max,\n  (newMax) => {\n    const correctedMax = validateMax(props.max)\n    if (correctedMax !== newMax)\n      max.value = correctedMax\n  },\n  { immediate: true },\n)\n// ------- End of watch for correct values -------\n\nconst progressState = computed<ProgressState>(() => {\n  if (isNullish(modelValue.value))\n    return 'indeterminate'\n  if (modelValue.value === max.value)\n    return 'complete'\n  return 'loading'\n})\n\nprovideProgressRootContext({\n  modelValue,\n  max,\n  progressState,\n})\n</script>\n\n<template>\n  <Primitive\n    :as-child=\"asChild\"\n    :as=\"as\"\n    :aria-valuemax=\"max\"\n    :aria-valuemin=\"0\"\n    :aria-valuenow=\"isNumber(modelValue) ? modelValue : undefined\"\n    :aria-valuetext=\"getValueText?.(modelValue, max)\"\n    :aria-label=\"getValueLabel(modelValue, max)\"\n    role=\"progressbar\"\n    :data-state=\"progressState\"\n    :data-value=\"modelValue ?? undefined\"\n    :data-max=\"max\"\n  >\n    <slot :model-value=\"modelValue\" />\n  </Primitive>\n</template>\n"],"names":["createContext","isNullish","useForwardExpose","useVModel","watch","nextTick","computed"],"mappings":";;;;;;;;;AA6BA,MAAM,WAAc,GAAA,GAAA;AAQb,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/DA,mCAAmC,cAAc;AAIrD,MAAM,QAAW,GAAA,CAAC,CAAwB,KAAA,OAAO,CAAM,KAAA,QAAA;AAEvD,SAAS,aAAA,CAAc,OAAY,GAA4B,EAAA;AAC7D,EAAA,MAAM,iBACF,GAAAC,wBAAA,CAAU,KAAK,CAAA,IACX,SAAS,KAAK,CAAA,IAAK,CAAC,MAAA,CAAO,KAAM,CAAA,KAAK,CAAK,IAAA,KAAA,IAAS,OAAO,KAAS,IAAA,CAAA;AAE5E,EAAI,IAAA,iBAAA;AACF,IAAO,OAAA,KAAA;AAET,EAAQ,OAAA,CAAA,KAAA,CAAM,qCAAqC,KAAK,CAAA;AAAA;AAAA,8CAAA,EAEV,WAAW,CAAA;AAAA;;AAAA,uBAGnC,CAAA,CAAA;AACtB,EAAO,OAAA,IAAA;AACT;AAEA,SAAS,YAAY,GAAqB,EAAA;AACxC,EAAM,MAAA,eAAA,GAAkB,SAAS,GAAG,CAAA,IAAK,CAAC,MAAO,CAAA,KAAA,CAAM,GAAG,CAAA,IAAK,GAAM,GAAA,CAAA;AAErE,EAAI,IAAA,eAAA;AACF,IAAO,OAAA,GAAA;AAET,EAAQ,OAAA,CAAA,KAAA;AAAA,IACN,CAAA,gCAAA,EAAmC,GAAG,CAAA,mGAAA,EAAsG,WAAW,CAAA,GAAA;AAAA,GACzJ;AACA,EAAO,OAAA,WAAA;AACT;;;;;;;;;;;;;AAQA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAiBC,wCAAA,EAAA;AACjB,IAAA,MAAM,UAAa,GAAAC,cAAA,CAAU,KAAO,EAAA,YAAA,EAAc,IAAM,EAAA;AAAA,MACtD,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,MAAM,GAAM,GAAAA,cAAA,CAAU,KAAO,EAAA,KAAA,EAAO,IAAM,EAAA;AAAA,MACxC,OAAA,EAAU,MAAM,GAAQ,KAAA;AAAA,KACzB,CAAA;AAGD,IAAAC,SAAA;AAAA,MACE,MAAM,UAAW,CAAA,KAAA;AAAA,MACjB,OAAO,KAAU,KAAA;AACf,QAAA,MAAM,cAAiB,GAAA,aAAA,CAAc,KAAO,EAAA,KAAA,CAAM,GAAG,CAAA;AACrD,QAAA,IAAI,mBAAmB,KAAO,EAAA;AAC5B,UAAA,MAAMC,YAAS,EAAA;AACf,UAAA,UAAA,CAAW,KAAQ,GAAA,cAAA;AAAA;AACrB,OACF;AAAA,MACA,EAAE,WAAW,IAAK;AAAA,KACpB;AAEA,IAAAD,SAAA;AAAA,MACE,MAAM,KAAM,CAAA,GAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAM,MAAA,YAAA,GAAe,WAAY,CAAA,KAAA,CAAM,GAAG,CAAA;AAC1C,QAAA,IAAI,YAAiB,KAAA,MAAA;AACnB,UAAA,GAAA,CAAI,KAAQ,GAAA,YAAA;AAAA,OAChB;AAAA,MACA,EAAE,WAAW,IAAK;AAAA,KACpB;AAGA,IAAM,MAAA,aAAA,GAAgBE,aAAwB,MAAM;AAClD,MAAI,IAAAL,wBAAA,CAAU,WAAW,KAAK,CAAA;AAC5B,QAAO,OAAA,eAAA;AACT,MAAI,IAAA,UAAA,CAAW,UAAU,GAAI,CAAA,KAAA;AAC3B,QAAO,OAAA,UAAA;AACT,MAAO,OAAA,SAAA;AAAA,KACR,CAAA;AAED,IAA2B,0BAAA,CAAA;AAAA,MACzB,UAAA;AAAA,MACA,GAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Progress/ProgressRoot.js

@@ -34,7 +34,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   props: {
     modelValue: {},
     max: { default: DEFAULT_MAX },
-    getValueLabel: { type: Function, default: (value, max) => `${Math.round(value / max * DEFAULT_MAX)}%` },
+    getValueLabel: { type: Function, default: (value, max) => isNumber(value) ? `${Math.round(value / max * DEFAULT_MAX)}%` : void 0 },
+    getValueText: {},
     asChild: { type: Boolean },
     as: {}
   },
@@ -88,7 +89,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         "aria-valuemax": unref(max),
         "aria-valuemin": 0,
         "aria-valuenow": isNumber(unref(modelValue)) ? unref(modelValue) : void 0,
-        "aria-valuetext": _ctx.getValueLabel(unref(modelValue), unref(max)),
+        "aria-valuetext": _ctx.getValueText?.(unref(modelValue), unref(max)),
         "aria-label": _ctx.getValueLabel(unref(modelValue), unref(max)),
         role: "progressbar",
         "data-state": progressState.value,

package/dist/Progress/ProgressRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressRoot.js","sources":["../../src/Progress/ProgressRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { ComputedRef, Ref } from 'vue'\nimport { createContext, isNullish, useForwardExpose } from '@/shared'\n\nexport type ProgressRootEmits = {\n  /** Event handler called when the progress value changes */\n  'update:modelValue': [value: string[] | undefined]\n  /** Event handler called when the max value changes */\n  'update:max': [value: number]\n}\n\nexport interface ProgressRootProps extends PrimitiveProps {\n  /** The progress value. Can be bind as `v-model`. */\n  modelValue?: number | null\n  /** The maximum progress value. */\n  max?: number\n  /**\n   * A function to get the accessible label text representing the current value in a human-readable format.\n   *\n   *  If not provided, the value label will be read as the numeric value as a percentage of the max value.\n   */\n  getValueLabel?: (value: number, max: number) => string\n}\n\nconst DEFAULT_MAX = 100\n\ninterface ProgressRootContext {\n  modelValue?: Readonly<Ref<ProgressRootProps['modelValue']>>\n  max: Readonly<Ref<number>>\n  progressState: ComputedRef<ProgressState>\n}\n\nexport const [injectProgressRootContext, provideProgressRootContext]\n  = createContext<ProgressRootContext>('ProgressRoot')\n\nexport type ProgressState = 'indeterminate' | 'loading' | 'complete'\n\nconst isNumber = (v: any): v is number => typeof v === 'number'\n\nfunction validateValue(value: any, max: number): number | null {\n  const isValidValueError\n    = isNullish(value)\n      || (isNumber(value) && !Number.isNaN(value) && value <= max && value >= 0)\n\n  if (isValidValueError)\n    return value as null\n\n  console.error(`Invalid prop \\`value\\` of value \\`${value}\\` supplied to \\`ProgressRoot\\`. The \\`value\\` prop must be:\n  - a positive number\n  - less than the value passed to \\`max\\` (or ${DEFAULT_MAX} if no \\`max\\` prop is set)\n  - \\`null\\`  or \\`undefined\\` if the progress is indeterminate.\n\nDefaulting to \\`null\\`.`)\n  return null\n}\n\nfunction validateMax(max: number): number {\n  const isValidMaxError = isNumber(max) && !Number.isNaN(max) && max > 0\n\n  if (isValidMaxError)\n    return max\n\n  console.error(\n    `Invalid prop \\`max\\` of value \\`${max}\\` supplied to \\`ProgressRoot\\`. Only numbers greater than 0 are valid max values. Defaulting to \\`${DEFAULT_MAX}\\`.`,\n  )\n  return DEFAULT_MAX\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useVModel } from '@vueuse/core'\nimport { computed, nextTick, watch } from 'vue'\n\nconst props = withDefaults(defineProps<ProgressRootProps>(), {\n  max: DEFAULT_MAX,\n  getValueLabel: (value: number, max: number) =>\n    `${Math.round((value / max) * DEFAULT_MAX)}%`,\n})\n\nconst emit = defineEmits<ProgressRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nuseForwardExpose()\nconst modelValue = useVModel(props, 'modelValue', emit, {\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst max = useVModel(props, 'max', emit, {\n  passive: (props.max === undefined) as false,\n})\n\n// ------- Watch for correct values -------\nwatch(\n  () => modelValue.value,\n  async (value) => {\n    const correctedValue = validateValue(value, props.max)\n    if (correctedValue !== value) {\n      await nextTick()\n      modelValue.value = correctedValue\n    }\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => props.max,\n  (newMax) => {\n    const correctedMax = validateMax(props.max)\n    if (correctedMax !== newMax)\n      max.value = correctedMax\n  },\n  { immediate: true },\n)\n// ------- End of watch for correct values -------\n\nconst progressState = computed<ProgressState>(() => {\n  if (isNullish(modelValue.value))\n    return 'indeterminate'\n  if (modelValue.value === max.value)\n    return 'complete'\n  return 'loading'\n})\n\nprovideProgressRootContext({\n  modelValue,\n  max,\n  progressState,\n})\n</script>\n\n<template>\n  <Primitive\n    :as-child=\"asChild\"\n    :as=\"as\"\n    :aria-valuemax=\"max\"\n    :aria-valuemin=\"0\"\n    :aria-valuenow=\"isNumber(modelValue) ? modelValue : undefined\"\n    :aria-valuetext=\"getValueLabel(modelValue!, max)\"\n    :aria-label=\"getValueLabel(modelValue!, max)\"\n    role=\"progressbar\"\n    :data-state=\"progressState\"\n    :data-value=\"modelValue ?? undefined\"\n    :data-max=\"max\"\n  >\n    <slot :model-value=\"modelValue\" />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;AAyBA,MAAM,WAAc,GAAA,GAAA;AAQb,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/D,cAAmC,cAAc;AAIrD,MAAM,QAAW,GAAA,CAAC,CAAwB,KAAA,OAAO,CAAM,KAAA,QAAA;AAEvD,SAAS,aAAA,CAAc,OAAY,GAA4B,EAAA;AAC7D,EAAA,MAAM,iBACF,GAAA,SAAA,CAAU,KAAK,CAAA,IACX,SAAS,KAAK,CAAA,IAAK,CAAC,MAAA,CAAO,KAAM,CAAA,KAAK,CAAK,IAAA,KAAA,IAAS,OAAO,KAAS,IAAA,CAAA;AAE5E,EAAI,IAAA,iBAAA;AACF,IAAO,OAAA,KAAA;AAET,EAAQ,OAAA,CAAA,KAAA,CAAM,qCAAqC,KAAK,CAAA;AAAA;AAAA,8CAAA,EAEV,WAAW,CAAA;AAAA;;AAAA,uBAGnC,CAAA,CAAA;AACtB,EAAO,OAAA,IAAA;AACT;AAEA,SAAS,YAAY,GAAqB,EAAA;AACxC,EAAM,MAAA,eAAA,GAAkB,SAAS,GAAG,CAAA,IAAK,CAAC,MAAO,CAAA,KAAA,CAAM,GAAG,CAAA,IAAK,GAAM,GAAA,CAAA;AAErE,EAAI,IAAA,eAAA;AACF,IAAO,OAAA,GAAA;AAET,EAAQ,OAAA,CAAA,KAAA;AAAA,IACN,CAAA,gCAAA,EAAmC,GAAG,CAAA,mGAAA,EAAsG,WAAW,CAAA,GAAA;AAAA,GACzJ;AACA,EAAO,OAAA,WAAA;AACT;;;;;;;;;;;;AAQA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAiB,gBAAA,EAAA;AACjB,IAAA,MAAM,UAAa,GAAA,SAAA,CAAU,KAAO,EAAA,YAAA,EAAc,IAAM,EAAA;AAAA,MACtD,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,MAAM,GAAM,GAAA,SAAA,CAAU,KAAO,EAAA,KAAA,EAAO,IAAM,EAAA;AAAA,MACxC,OAAA,EAAU,MAAM,GAAQ,KAAA;AAAA,KACzB,CAAA;AAGD,IAAA,KAAA;AAAA,MACE,MAAM,UAAW,CAAA,KAAA;AAAA,MACjB,OAAO,KAAU,KAAA;AACf,QAAA,MAAM,cAAiB,GAAA,aAAA,CAAc,KAAO,EAAA,KAAA,CAAM,GAAG,CAAA;AACrD,QAAA,IAAI,mBAAmB,KAAO,EAAA;AAC5B,UAAA,MAAM,QAAS,EAAA;AACf,UAAA,UAAA,CAAW,KAAQ,GAAA,cAAA;AAAA;AACrB,OACF;AAAA,MACA,EAAE,WAAW,IAAK;AAAA,KACpB;AAEA,IAAA,KAAA;AAAA,MACE,MAAM,KAAM,CAAA,GAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAM,MAAA,YAAA,GAAe,WAAY,CAAA,KAAA,CAAM,GAAG,CAAA;AAC1C,QAAA,IAAI,YAAiB,KAAA,MAAA;AACnB,UAAA,GAAA,CAAI,KAAQ,GAAA,YAAA;AAAA,OAChB;AAAA,MACA,EAAE,WAAW,IAAK;AAAA,KACpB;AAGA,IAAM,MAAA,aAAA,GAAgB,SAAwB,MAAM;AAClD,MAAI,IAAA,SAAA,CAAU,WAAW,KAAK,CAAA;AAC5B,QAAO,OAAA,eAAA;AACT,MAAI,IAAA,UAAA,CAAW,UAAU,GAAI,CAAA,KAAA;AAC3B,QAAO,OAAA,UAAA;AACT,MAAO,OAAA,SAAA;AAAA,KACR,CAAA;AAED,IAA2B,0BAAA,CAAA;AAAA,MACzB,UAAA;AAAA,MACA,GAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ProgressRoot.js","sources":["../../src/Progress/ProgressRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef, Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { createContext, isNullish, useForwardExpose } from '@/shared'\n\nexport type ProgressRootEmits = {\n  /** Event handler called when the progress value changes */\n  'update:modelValue': [value: string[] | undefined]\n  /** Event handler called when the max value changes */\n  'update:max': [value: number]\n}\n\nexport interface ProgressRootProps extends PrimitiveProps {\n  /** The progress value. Can be bind as `v-model`. */\n  modelValue?: number | null\n  /** The maximum progress value. */\n  max?: number\n  /**\n   * A function to get the accessible label text in a human-readable format.\n   *\n   *  If not provided, the value label will be read as the numeric value as a percentage of the max value.\n   */\n  getValueLabel?: (value: number | null | undefined, max: number) => string | undefined\n  /**\n   * A function to get the accessible value text representing the current value in a human-readable format.\n   */\n  getValueText?: (value: number | null | undefined, max: number) => string | undefined\n}\n\nconst DEFAULT_MAX = 100\n\ninterface ProgressRootContext {\n  modelValue?: Readonly<Ref<ProgressRootProps['modelValue']>>\n  max: Readonly<Ref<number>>\n  progressState: ComputedRef<ProgressState>\n}\n\nexport const [injectProgressRootContext, provideProgressRootContext]\n  = createContext<ProgressRootContext>('ProgressRoot')\n\nexport type ProgressState = 'indeterminate' | 'loading' | 'complete'\n\nconst isNumber = (v: any): v is number => typeof v === 'number'\n\nfunction validateValue(value: any, max: number): number | null {\n  const isValidValueError\n    = isNullish(value)\n      || (isNumber(value) && !Number.isNaN(value) && value <= max && value >= 0)\n\n  if (isValidValueError)\n    return value as null\n\n  console.error(`Invalid prop \\`value\\` of value \\`${value}\\` supplied to \\`ProgressRoot\\`. The \\`value\\` prop must be:\n  - a positive number\n  - less than the value passed to \\`max\\` (or ${DEFAULT_MAX} if no \\`max\\` prop is set)\n  - \\`null\\`  or \\`undefined\\` if the progress is indeterminate.\n\nDefaulting to \\`null\\`.`)\n  return null\n}\n\nfunction validateMax(max: number): number {\n  const isValidMaxError = isNumber(max) && !Number.isNaN(max) && max > 0\n\n  if (isValidMaxError)\n    return max\n\n  console.error(\n    `Invalid prop \\`max\\` of value \\`${max}\\` supplied to \\`ProgressRoot\\`. Only numbers greater than 0 are valid max values. Defaulting to \\`${DEFAULT_MAX}\\`.`,\n  )\n  return DEFAULT_MAX\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { computed, nextTick, watch } from 'vue'\nimport { Primitive } from '@/Primitive'\n\nconst props = withDefaults(defineProps<ProgressRootProps>(), {\n  max: DEFAULT_MAX,\n  getValueLabel: (value: number | null | undefined, max: number) =>\n    isNumber(value) ? `${Math.round((value / max) * DEFAULT_MAX)}%` : undefined,\n})\n\nconst emit = defineEmits<ProgressRootEmits>()\n\ndefineSlots<{\n  default?: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nuseForwardExpose()\nconst modelValue = useVModel(props, 'modelValue', emit, {\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst max = useVModel(props, 'max', emit, {\n  passive: (props.max === undefined) as false,\n})\n\n// ------- Watch for correct values -------\nwatch(\n  () => modelValue.value,\n  async (value) => {\n    const correctedValue = validateValue(value, props.max)\n    if (correctedValue !== value) {\n      await nextTick()\n      modelValue.value = correctedValue\n    }\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => props.max,\n  (newMax) => {\n    const correctedMax = validateMax(props.max)\n    if (correctedMax !== newMax)\n      max.value = correctedMax\n  },\n  { immediate: true },\n)\n// ------- End of watch for correct values -------\n\nconst progressState = computed<ProgressState>(() => {\n  if (isNullish(modelValue.value))\n    return 'indeterminate'\n  if (modelValue.value === max.value)\n    return 'complete'\n  return 'loading'\n})\n\nprovideProgressRootContext({\n  modelValue,\n  max,\n  progressState,\n})\n</script>\n\n<template>\n  <Primitive\n    :as-child=\"asChild\"\n    :as=\"as\"\n    :aria-valuemax=\"max\"\n    :aria-valuemin=\"0\"\n    :aria-valuenow=\"isNumber(modelValue) ? modelValue : undefined\"\n    :aria-valuetext=\"getValueText?.(modelValue, max)\"\n    :aria-label=\"getValueLabel(modelValue, max)\"\n    role=\"progressbar\"\n    :data-state=\"progressState\"\n    :data-value=\"modelValue ?? undefined\"\n    :data-max=\"max\"\n  >\n    <slot :model-value=\"modelValue\" />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;AA6BA,MAAM,WAAc,GAAA,GAAA;AAQb,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/D,cAAmC,cAAc;AAIrD,MAAM,QAAW,GAAA,CAAC,CAAwB,KAAA,OAAO,CAAM,KAAA,QAAA;AAEvD,SAAS,aAAA,CAAc,OAAY,GAA4B,EAAA;AAC7D,EAAA,MAAM,iBACF,GAAA,SAAA,CAAU,KAAK,CAAA,IACX,SAAS,KAAK,CAAA,IAAK,CAAC,MAAA,CAAO,KAAM,CAAA,KAAK,CAAK,IAAA,KAAA,IAAS,OAAO,KAAS,IAAA,CAAA;AAE5E,EAAI,IAAA,iBAAA;AACF,IAAO,OAAA,KAAA;AAET,EAAQ,OAAA,CAAA,KAAA,CAAM,qCAAqC,KAAK,CAAA;AAAA;AAAA,8CAAA,EAEV,WAAW,CAAA;AAAA;;AAAA,uBAGnC,CAAA,CAAA;AACtB,EAAO,OAAA,IAAA;AACT;AAEA,SAAS,YAAY,GAAqB,EAAA;AACxC,EAAM,MAAA,eAAA,GAAkB,SAAS,GAAG,CAAA,IAAK,CAAC,MAAO,CAAA,KAAA,CAAM,GAAG,CAAA,IAAK,GAAM,GAAA,CAAA;AAErE,EAAI,IAAA,eAAA;AACF,IAAO,OAAA,GAAA;AAET,EAAQ,OAAA,CAAA,KAAA;AAAA,IACN,CAAA,gCAAA,EAAmC,GAAG,CAAA,mGAAA,EAAsG,WAAW,CAAA,GAAA;AAAA,GACzJ;AACA,EAAO,OAAA,WAAA;AACT;;;;;;;;;;;;;AAQA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAiB,gBAAA,EAAA;AACjB,IAAA,MAAM,UAAa,GAAA,SAAA,CAAU,KAAO,EAAA,YAAA,EAAc,IAAM,EAAA;AAAA,MACtD,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,MAAM,GAAM,GAAA,SAAA,CAAU,KAAO,EAAA,KAAA,EAAO,IAAM,EAAA;AAAA,MACxC,OAAA,EAAU,MAAM,GAAQ,KAAA;AAAA,KACzB,CAAA;AAGD,IAAA,KAAA;AAAA,MACE,MAAM,UAAW,CAAA,KAAA;AAAA,MACjB,OAAO,KAAU,KAAA;AACf,QAAA,MAAM,cAAiB,GAAA,aAAA,CAAc,KAAO,EAAA,KAAA,CAAM,GAAG,CAAA;AACrD,QAAA,IAAI,mBAAmB,KAAO,EAAA;AAC5B,UAAA,MAAM,QAAS,EAAA;AACf,UAAA,UAAA,CAAW,KAAQ,GAAA,cAAA;AAAA;AACrB,OACF;AAAA,MACA,EAAE,WAAW,IAAK;AAAA,KACpB;AAEA,IAAA,KAAA;AAAA,MACE,MAAM,KAAM,CAAA,GAAA;AAAA,MACZ,CAAC,MAAW,KAAA;AACV,QAAM,MAAA,YAAA,GAAe,WAAY,CAAA,KAAA,CAAM,GAAG,CAAA;AAC1C,QAAA,IAAI,YAAiB,KAAA,MAAA;AACnB,UAAA,GAAA,CAAI,KAAQ,GAAA,YAAA;AAAA,OAChB;AAAA,MACA,EAAE,WAAW,IAAK;AAAA,KACpB;AAGA,IAAM,MAAA,aAAA,GAAgB,SAAwB,MAAM;AAClD,MAAI,IAAA,SAAA,CAAU,WAAW,KAAK,CAAA;AAC5B,QAAO,OAAA,eAAA;AACT,MAAI,IAAA,UAAA,CAAW,UAAU,GAAI,CAAA,KAAA;AAC3B,QAAO,OAAA,UAAA;AACT,MAAO,OAAA,SAAA;AAAA,KACR,CAAA;AAED,IAA2B,0BAAA,CAAA;AAAA,MACzB,UAAA;AAAA,MACA,GAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RadioGroup/Radio.cjs

@@ -32,6 +32,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const isFormControl = shared_useFormControl.useFormControl(triggerElement);
     const ariaLabel = vue.computed(() => props.id && triggerElement.value ? document.querySelector(`[for="${props.id}"]`)?.innerText ?? props.value : void 0);
     function handleClick(event) {
+      if (props.disabled)
+        return;
       RadioGroup_utils.handleSelect(event, props.value, (ev) => {
         emits("select", ev);
         if (ev?.defaultPrevented)

package/dist/RadioGroup/Radio.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.cjs","sources":["../../src/RadioGroup/Radio.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, FormFieldProps } from '@/shared/types'\nimport type { SelectEvent } from './utils'\n\nexport type RadioEmits = {\n  'update:checked': [value: boolean]\n  'select': [SelectEvent]\n}\n\nexport interface RadioProps extends PrimitiveProps, FormFieldProps {\n  id?: string\n  /** The value given as data when submitted with a `name`. */\n  value?: AcceptableValue\n  /** When `true`, prevents the user from interacting with the radio item. */\n  disabled?: boolean\n  checked?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useFormControl, useForwardExpose } from '@/shared'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\nimport { useVModel } from '@vueuse/core'\nimport { computed, toRefs } from 'vue'\nimport { handleSelect } from './utils'\n\nconst props = withDefaults(defineProps<RadioProps>(), {\n  disabled: false,\n  checked: undefined,\n  as: 'button',\n})\nconst emits = defineEmits<RadioEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current checked state */\n    checked: typeof checked.value\n  }) => any\n}>()\n\nconst checked = useVModel(props, 'checked', emits, {\n  passive: (props.checked === undefined) as false,\n})\n\nconst { value } = toRefs(props)\nconst { forwardRef, currentElement: triggerElement } = useForwardExpose()\nconst isFormControl = useFormControl(triggerElement)\n\nconst ariaLabel = computed(() => props.id && triggerElement.value ? (document.querySelector(`[for=\"${props.id}\"]`) as HTMLLabelElement)?.innerText ?? props.value : undefined)\n\nfunction handleClick(event: MouseEvent) {\n  handleSelect(event, props.value, (ev) => {\n    emits('select', ev)\n    if (ev?.defaultPrevented)\n      return\n\n    checked.value = true\n    if (isFormControl.value) {\n    // if radio is in a form, stop propagation from the button so that we only propagate\n    // one click event (from the input). We propagate changes from an input so that native\n    // form validation works and form events reflect radio updates.\n      ev.stopPropagation()\n    }\n  })\n}\n</script>\n\n<template>\n  <Primitive\n    v-bind=\"$attrs\"\n    :id=\"id\"\n    :ref=\"forwardRef\"\n    role=\"radio\"\n    :type=\"as === 'button' ? 'button' : undefined\"\n    :as=\"as\"\n    :aria-checked=\"checked\"\n    :aria-label=\"ariaLabel\"\n    :as-child=\"asChild\"\n    :disabled=\"disabled ? '' : undefined\"\n    :data-state=\"checked ? 'checked' : 'unchecked'\"\n    :data-disabled=\"disabled ? '' : undefined\"\n    :value=\"value\"\n    :required=\"required\"\n    :name=\"name\"\n    @click.stop=\"handleClick\"\n  >\n    <slot :checked=\"checked\" />\n\n    <VisuallyHiddenInput\n      v-if=\"isFormControl && name\"\n      type=\"radio\"\n      tabindex=\"-1\"\n      :value=\"value\"\n      :checked=\"!!checked\"\n      :name=\"name\"\n      :disabled=\"disabled\"\n      :required=\"required\"\n    />\n  </Primitive>\n</template>\n"],"names":["useVModel","toRefs","useForwardExpose","useFormControl","computed","handleSelect"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,OAAU,GAAAA,cAAA,CAAU,KAAO,EAAA,SAAA,EAAW,KAAO,EAAA;AAAA,MACjD,OAAA,EAAU,MAAM,OAAY,KAAA;AAAA,KAC7B,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAU,GAAAC,UAAA,CAAO,KAAK,CAAA;AAC9B,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,cAAA,KAAmBC,wCAAiB,EAAA;AACxE,IAAM,MAAA,aAAA,GAAgBC,qCAAe,cAAc,CAAA;AAEnD,IAAA,MAAM,YAAYC,YAAS,CAAA,MAAM,KAAM,CAAA,EAAA,IAAM,eAAe,KAAS,GAAA,QAAA,CAAS,aAAc,CAAA,CAAA,MAAA,EAAS,MAAM,EAAE,CAAA,EAAA,CAAI,GAAwB,SAAa,IAAA,KAAA,CAAM,QAAQ,MAAS,CAAA;AAE7K,IAAA,SAAS,YAAY,KAAmB,EAAA;AACtC,MAAAC,6BAAA,CAAa,KAAO,EAAA,KAAA,CAAM,KAAO,EAAA,CAAC,EAAO,KAAA;AACvC,QAAA,KAAA,CAAM,UAAU,EAAE,CAAA;AAClB,QAAA,IAAI,EAAI,EAAA,gBAAA;AACN,UAAA;AAEF,QAAA,OAAA,CAAQ,KAAQ,GAAA,IAAA;AAChB,QAAA,IAAI,cAAc,KAAO,EAAA;AAIvB,UAAA,EAAA,CAAG,eAAgB,EAAA;AAAA;AACrB,OACD,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Radio.cjs","sources":["../../src/RadioGroup/Radio.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { SelectEvent } from './utils'\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, FormFieldProps } from '@/shared/types'\n\nexport type RadioEmits = {\n  'update:checked': [value: boolean]\n  'select': [SelectEvent]\n}\n\nexport interface RadioProps extends PrimitiveProps, FormFieldProps {\n  id?: string\n  /** The value given as data when submitted with a `name`. */\n  value?: AcceptableValue\n  /** When `true`, prevents the user from interacting with the radio item. */\n  disabled?: boolean\n  checked?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { computed, toRefs } from 'vue'\nimport { Primitive } from '@/Primitive'\nimport { useFormControl, useForwardExpose } from '@/shared'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\nimport { handleSelect } from './utils'\n\nconst props = withDefaults(defineProps<RadioProps>(), {\n  disabled: false,\n  checked: undefined,\n  as: 'button',\n})\nconst emits = defineEmits<RadioEmits>()\n\ndefineSlots<{\n  default?: (props: {\n    /** Current checked state */\n    checked: typeof checked.value\n  }) => any\n}>()\n\nconst checked = useVModel(props, 'checked', emits, {\n  passive: (props.checked === undefined) as false,\n})\n\nconst { value } = toRefs(props)\nconst { forwardRef, currentElement: triggerElement } = useForwardExpose()\nconst isFormControl = useFormControl(triggerElement)\n\nconst ariaLabel = computed(() => props.id && triggerElement.value ? (document.querySelector(`[for=\"${props.id}\"]`) as HTMLLabelElement)?.innerText ?? props.value : undefined)\n\nfunction handleClick(event: MouseEvent) {\n  if (props.disabled)\n    return\n\n  handleSelect(event, props.value, (ev) => {\n    emits('select', ev)\n    if (ev?.defaultPrevented)\n      return\n\n    checked.value = true\n    if (isFormControl.value) {\n    // if radio is in a form, stop propagation from the button so that we only propagate\n    // one click event (from the input). We propagate changes from an input so that native\n    // form validation works and form events reflect radio updates.\n      ev.stopPropagation()\n    }\n  })\n}\n</script>\n\n<template>\n  <Primitive\n    v-bind=\"$attrs\"\n    :id=\"id\"\n    :ref=\"forwardRef\"\n    role=\"radio\"\n    :type=\"as === 'button' ? 'button' : undefined\"\n    :as=\"as\"\n    :aria-checked=\"checked\"\n    :aria-label=\"ariaLabel\"\n    :as-child=\"asChild\"\n    :disabled=\"disabled ? '' : undefined\"\n    :data-state=\"checked ? 'checked' : 'unchecked'\"\n    :data-disabled=\"disabled ? '' : undefined\"\n    :value=\"value\"\n    :required=\"required\"\n    :name=\"name\"\n    @click.stop=\"handleClick\"\n  >\n    <slot :checked=\"checked\" />\n\n    <VisuallyHiddenInput\n      v-if=\"isFormControl && name\"\n      type=\"radio\"\n      tabindex=\"-1\"\n      :value=\"value\"\n      :checked=\"!!checked\"\n      :name=\"name\"\n      :disabled=\"disabled\"\n      :required=\"required\"\n    />\n  </Primitive>\n</template>\n"],"names":["useVModel","toRefs","useForwardExpose","useFormControl","computed","handleSelect"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,OAAU,GAAAA,cAAA,CAAU,KAAO,EAAA,SAAA,EAAW,KAAO,EAAA;AAAA,MACjD,OAAA,EAAU,MAAM,OAAY,KAAA;AAAA,KAC7B,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAU,GAAAC,UAAA,CAAO,KAAK,CAAA;AAC9B,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,cAAA,KAAmBC,wCAAiB,EAAA;AACxE,IAAM,MAAA,aAAA,GAAgBC,qCAAe,cAAc,CAAA;AAEnD,IAAA,MAAM,YAAYC,YAAS,CAAA,MAAM,KAAM,CAAA,EAAA,IAAM,eAAe,KAAS,GAAA,QAAA,CAAS,aAAc,CAAA,CAAA,MAAA,EAAS,MAAM,EAAE,CAAA,EAAA,CAAI,GAAwB,SAAa,IAAA,KAAA,CAAM,QAAQ,MAAS,CAAA;AAE7K,IAAA,SAAS,YAAY,KAAmB,EAAA;AACtC,MAAA,IAAI,KAAM,CAAA,QAAA;AACR,QAAA;AAEF,MAAAC,6BAAA,CAAa,KAAO,EAAA,KAAA,CAAM,KAAO,EAAA,CAAC,EAAO,KAAA;AACvC,QAAA,KAAA,CAAM,UAAU,EAAE,CAAA;AAClB,QAAA,IAAI,EAAI,EAAA,gBAAA;AACN,UAAA;AAEF,QAAA,OAAA,CAAQ,KAAQ,GAAA,IAAA;AAChB,QAAA,IAAI,cAAc,KAAO,EAAA;AAIvB,UAAA,EAAA,CAAG,eAAgB,EAAA;AAAA;AACrB,OACD,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RadioGroup/Radio.js

@@ -30,6 +30,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const isFormControl = useFormControl(triggerElement);
     const ariaLabel = computed(() => props.id && triggerElement.value ? document.querySelector(`[for="${props.id}"]`)?.innerText ?? props.value : void 0);
     function handleClick(event) {
+      if (props.disabled)
+        return;
       handleSelect(event, props.value, (ev) => {
         emits("select", ev);
         if (ev?.defaultPrevented)

package/dist/RadioGroup/Radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","sources":["../../src/RadioGroup/Radio.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, FormFieldProps } from '@/shared/types'\nimport type { SelectEvent } from './utils'\n\nexport type RadioEmits = {\n  'update:checked': [value: boolean]\n  'select': [SelectEvent]\n}\n\nexport interface RadioProps extends PrimitiveProps, FormFieldProps {\n  id?: string\n  /** The value given as data when submitted with a `name`. */\n  value?: AcceptableValue\n  /** When `true`, prevents the user from interacting with the radio item. */\n  disabled?: boolean\n  checked?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useFormControl, useForwardExpose } from '@/shared'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\nimport { useVModel } from '@vueuse/core'\nimport { computed, toRefs } from 'vue'\nimport { handleSelect } from './utils'\n\nconst props = withDefaults(defineProps<RadioProps>(), {\n  disabled: false,\n  checked: undefined,\n  as: 'button',\n})\nconst emits = defineEmits<RadioEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current checked state */\n    checked: typeof checked.value\n  }) => any\n}>()\n\nconst checked = useVModel(props, 'checked', emits, {\n  passive: (props.checked === undefined) as false,\n})\n\nconst { value } = toRefs(props)\nconst { forwardRef, currentElement: triggerElement } = useForwardExpose()\nconst isFormControl = useFormControl(triggerElement)\n\nconst ariaLabel = computed(() => props.id && triggerElement.value ? (document.querySelector(`[for=\"${props.id}\"]`) as HTMLLabelElement)?.innerText ?? props.value : undefined)\n\nfunction handleClick(event: MouseEvent) {\n  handleSelect(event, props.value, (ev) => {\n    emits('select', ev)\n    if (ev?.defaultPrevented)\n      return\n\n    checked.value = true\n    if (isFormControl.value) {\n    // if radio is in a form, stop propagation from the button so that we only propagate\n    // one click event (from the input). We propagate changes from an input so that native\n    // form validation works and form events reflect radio updates.\n      ev.stopPropagation()\n    }\n  })\n}\n</script>\n\n<template>\n  <Primitive\n    v-bind=\"$attrs\"\n    :id=\"id\"\n    :ref=\"forwardRef\"\n    role=\"radio\"\n    :type=\"as === 'button' ? 'button' : undefined\"\n    :as=\"as\"\n    :aria-checked=\"checked\"\n    :aria-label=\"ariaLabel\"\n    :as-child=\"asChild\"\n    :disabled=\"disabled ? '' : undefined\"\n    :data-state=\"checked ? 'checked' : 'unchecked'\"\n    :data-disabled=\"disabled ? '' : undefined\"\n    :value=\"value\"\n    :required=\"required\"\n    :name=\"name\"\n    @click.stop=\"handleClick\"\n  >\n    <slot :checked=\"checked\" />\n\n    <VisuallyHiddenInput\n      v-if=\"isFormControl && name\"\n      type=\"radio\"\n      tabindex=\"-1\"\n      :value=\"value\"\n      :checked=\"!!checked\"\n      :name=\"name\"\n      :disabled=\"disabled\"\n      :required=\"required\"\n    />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,OAAU,GAAA,SAAA,CAAU,KAAO,EAAA,SAAA,EAAW,KAAO,EAAA;AAAA,MACjD,OAAA,EAAU,MAAM,OAAY,KAAA;AAAA,KAC7B,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAU,GAAA,MAAA,CAAO,KAAK,CAAA;AAC9B,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,cAAA,KAAmB,gBAAiB,EAAA;AACxE,IAAM,MAAA,aAAA,GAAgB,eAAe,cAAc,CAAA;AAEnD,IAAA,MAAM,YAAY,QAAS,CAAA,MAAM,KAAM,CAAA,EAAA,IAAM,eAAe,KAAS,GAAA,QAAA,CAAS,aAAc,CAAA,CAAA,MAAA,EAAS,MAAM,EAAE,CAAA,EAAA,CAAI,GAAwB,SAAa,IAAA,KAAA,CAAM,QAAQ,MAAS,CAAA;AAE7K,IAAA,SAAS,YAAY,KAAmB,EAAA;AACtC,MAAA,YAAA,CAAa,KAAO,EAAA,KAAA,CAAM,KAAO,EAAA,CAAC,EAAO,KAAA;AACvC,QAAA,KAAA,CAAM,UAAU,EAAE,CAAA;AAClB,QAAA,IAAI,EAAI,EAAA,gBAAA;AACN,UAAA;AAEF,QAAA,OAAA,CAAQ,KAAQ,GAAA,IAAA;AAChB,QAAA,IAAI,cAAc,KAAO,EAAA;AAIvB,UAAA,EAAA,CAAG,eAAgB,EAAA;AAAA;AACrB,OACD,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Radio.js","sources":["../../src/RadioGroup/Radio.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { SelectEvent } from './utils'\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, FormFieldProps } from '@/shared/types'\n\nexport type RadioEmits = {\n  'update:checked': [value: boolean]\n  'select': [SelectEvent]\n}\n\nexport interface RadioProps extends PrimitiveProps, FormFieldProps {\n  id?: string\n  /** The value given as data when submitted with a `name`. */\n  value?: AcceptableValue\n  /** When `true`, prevents the user from interacting with the radio item. */\n  disabled?: boolean\n  checked?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { computed, toRefs } from 'vue'\nimport { Primitive } from '@/Primitive'\nimport { useFormControl, useForwardExpose } from '@/shared'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\nimport { handleSelect } from './utils'\n\nconst props = withDefaults(defineProps<RadioProps>(), {\n  disabled: false,\n  checked: undefined,\n  as: 'button',\n})\nconst emits = defineEmits<RadioEmits>()\n\ndefineSlots<{\n  default?: (props: {\n    /** Current checked state */\n    checked: typeof checked.value\n  }) => any\n}>()\n\nconst checked = useVModel(props, 'checked', emits, {\n  passive: (props.checked === undefined) as false,\n})\n\nconst { value } = toRefs(props)\nconst { forwardRef, currentElement: triggerElement } = useForwardExpose()\nconst isFormControl = useFormControl(triggerElement)\n\nconst ariaLabel = computed(() => props.id && triggerElement.value ? (document.querySelector(`[for=\"${props.id}\"]`) as HTMLLabelElement)?.innerText ?? props.value : undefined)\n\nfunction handleClick(event: MouseEvent) {\n  if (props.disabled)\n    return\n\n  handleSelect(event, props.value, (ev) => {\n    emits('select', ev)\n    if (ev?.defaultPrevented)\n      return\n\n    checked.value = true\n    if (isFormControl.value) {\n    // if radio is in a form, stop propagation from the button so that we only propagate\n    // one click event (from the input). We propagate changes from an input so that native\n    // form validation works and form events reflect radio updates.\n      ev.stopPropagation()\n    }\n  })\n}\n</script>\n\n<template>\n  <Primitive\n    v-bind=\"$attrs\"\n    :id=\"id\"\n    :ref=\"forwardRef\"\n    role=\"radio\"\n    :type=\"as === 'button' ? 'button' : undefined\"\n    :as=\"as\"\n    :aria-checked=\"checked\"\n    :aria-label=\"ariaLabel\"\n    :as-child=\"asChild\"\n    :disabled=\"disabled ? '' : undefined\"\n    :data-state=\"checked ? 'checked' : 'unchecked'\"\n    :data-disabled=\"disabled ? '' : undefined\"\n    :value=\"value\"\n    :required=\"required\"\n    :name=\"name\"\n    @click.stop=\"handleClick\"\n  >\n    <slot :checked=\"checked\" />\n\n    <VisuallyHiddenInput\n      v-if=\"isFormControl && name\"\n      type=\"radio\"\n      tabindex=\"-1\"\n      :value=\"value\"\n      :checked=\"!!checked\"\n      :name=\"name\"\n      :disabled=\"disabled\"\n      :required=\"required\"\n    />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,OAAU,GAAA,SAAA,CAAU,KAAO,EAAA,SAAA,EAAW,KAAO,EAAA;AAAA,MACjD,OAAA,EAAU,MAAM,OAAY,KAAA;AAAA,KAC7B,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAU,GAAA,MAAA,CAAO,KAAK,CAAA;AAC9B,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,cAAA,KAAmB,gBAAiB,EAAA;AACxE,IAAM,MAAA,aAAA,GAAgB,eAAe,cAAc,CAAA;AAEnD,IAAA,MAAM,YAAY,QAAS,CAAA,MAAM,KAAM,CAAA,EAAA,IAAM,eAAe,KAAS,GAAA,QAAA,CAAS,aAAc,CAAA,CAAA,MAAA,EAAS,MAAM,EAAE,CAAA,EAAA,CAAI,GAAwB,SAAa,IAAA,KAAA,CAAM,QAAQ,MAAS,CAAA;AAE7K,IAAA,SAAS,YAAY,KAAmB,EAAA;AACtC,MAAA,IAAI,KAAM,CAAA,QAAA;AACR,QAAA;AAEF,MAAA,YAAA,CAAa,KAAO,EAAA,KAAA,CAAM,KAAO,EAAA,CAAC,EAAO,KAAA;AACvC,QAAA,KAAA,CAAM,UAAU,EAAE,CAAA;AAClB,QAAA,IAAI,EAAI,EAAA,gBAAA;AACN,UAAA;AAEF,QAAA,OAAA,CAAQ,KAAQ,GAAA,IAAA;AAChB,QAAA,IAAI,cAAc,KAAO,EAAA;AAIvB,UAAA,EAAA,CAAG,eAAgB,EAAA;AAAA;AACrB,OACD,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RadioGroup/RadioGroupItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroupItem.cjs","sources":["../../src/RadioGroup/RadioGroupItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef } from 'vue'\nimport type { RadioProps } from './Radio.vue'\nimport type { SelectEvent } from './utils'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface RadioGroupItemProps extends Omit<RadioProps, 'checked'> {}\nexport type RadioGroupItemEmits = {\n  select: [event: SelectEvent]\n}\n\ninterface RadioGroupItemContext {\n  disabled: ComputedRef<boolean>\n  checked: ComputedRef<boolean>\n}\n\nexport const [injectRadioGroupItemContext, provideRadiogroupItemContext]\n  = createContext<RadioGroupItemContext>('RadioGroupItem')\n</script>\n\n<script setup lang=\"ts\">\nimport { RovingFocusItem } from '@/RovingFocus'\nimport { useEventListener } from '@vueuse/core'\nimport { isEqual } from 'ohash'\nimport { computed, ref } from 'vue'\nimport Radio from './Radio.vue'\nimport { injectRadioGroupRootContext } from './RadioGroupRoot.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<RadioGroupItemProps>(), {\n  disabled: false,\n  as: 'button',\n})\n\nconst emits = defineEmits<RadioGroupItemEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current checked state */\n    checked: typeof checked.value\n    /** Required state */\n    required: typeof required.value\n    /** Disabled state */\n    disabled: typeof disabled.value\n  }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst rootContext = injectRadioGroupRootContext()\n\nconst disabled = computed(() => rootContext.disabled.value || props.disabled)\nconst required = computed(() => rootContext.required.value || props.required)\nconst checked = computed(() => isEqual(rootContext.modelValue?.value, props.value))\n\nprovideRadiogroupItemContext({ disabled, checked })\n\nconst isArrowKeyPressed = ref(false)\nconst ARROW_KEYS = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight']\n\nuseEventListener('keydown', (event) => {\n  if (ARROW_KEYS.includes(event.key))\n    isArrowKeyPressed.value = true\n})\nuseEventListener('keyup', () => {\n  isArrowKeyPressed.value = false\n})\n\nfunction handleFocus() {\n  setTimeout(() => {\n    /**\n     * Our `RovingFocusGroup` will focus the radio when navigating with arrow keys\n     * and we need to 'check' it in that case. We click it to 'check' it (instead\n     * of updating `context.value`) so that the radio change event fires.\n     */\n    if (isArrowKeyPressed.value)\n      currentElement.value?.click()\n  }, 0)\n}\n</script>\n\n<template>\n  <RovingFocusItem\n    :checked=\"checked\"\n    :disabled=\"disabled\"\n    as-child\n    :focusable=\"!disabled\"\n    :active=\"checked\"\n  >\n    <Radio\n      v-bind=\"{ ...$attrs, ...props }\"\n      :ref=\"forwardRef\"\n      :checked=\"checked\"\n      :required=\"required\"\n      :disabled=\"disabled\"\n      @update:checked=\"rootContext.changeModelValue(value)\"\n      @select=\"emits('select', $event)\"\n      @keydown.enter.prevent\n      @focus=\"handleFocus\"\n    >\n      <slot\n        :checked=\"checked\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </Radio>\n  </RovingFocusItem>\n</template>\n"],"names":["createContext","useForwardExpose","injectRadioGroupRootContext","computed","isEqual","ref","useEventListener"],"mappings":";;;;;;;;;;;AAgBO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnEA,mCAAqC,gBAAgB;;;;;;;;;;;;;;;;;AAezD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAad,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AAExD,IAAA,MAAM,cAAcC,qDAA4B,EAAA;AAEhD,IAAA,MAAM,WAAWC,YAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAC5E,IAAA,MAAM,WAAWA,YAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAC5E,IAAM,MAAA,OAAA,GAAUA,aAAS,MAAMC,aAAA,CAAQ,YAAY,UAAY,EAAA,KAAA,EAAO,KAAM,CAAA,KAAK,CAAC,CAAA;AAElF,IAA6B,4BAAA,CAAA,EAAE,QAAU,EAAA,OAAA,EAAS,CAAA;AAElD,IAAM,MAAA,iBAAA,GAAoBC,QAAI,KAAK,CAAA;AACnC,IAAA,MAAM,UAAa,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,aAAa,YAAY,CAAA;AAErE,IAAiBC,qBAAA,CAAA,SAAA,EAAW,CAAC,KAAU,KAAA;AACrC,MAAI,IAAA,UAAA,CAAW,QAAS,CAAA,KAAA,CAAM,GAAG,CAAA;AAC/B,QAAA,iBAAA,CAAkB,KAAQ,GAAA,IAAA;AAAA,KAC7B,CAAA;AACD,IAAAA,qBAAA,CAAiB,SAAS,MAAM;AAC9B,MAAA,iBAAA,CAAkB,KAAQ,GAAA,KAAA;AAAA,KAC3B,CAAA;AAED,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,UAAA,CAAW,MAAM;AAMf,QAAA,IAAI,iBAAkB,CAAA,KAAA;AACpB,UAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA,SAC7B,CAAC,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"RadioGroupItem.cjs","sources":["../../src/RadioGroup/RadioGroupItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef } from 'vue'\nimport type { RadioProps } from './Radio.vue'\nimport type { SelectEvent } from './utils'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface RadioGroupItemProps extends Omit<RadioProps, 'checked'> {}\nexport type RadioGroupItemEmits = {\n  select: [event: SelectEvent]\n}\n\ninterface RadioGroupItemContext {\n  disabled: ComputedRef<boolean>\n  checked: ComputedRef<boolean>\n}\n\nexport const [injectRadioGroupItemContext, provideRadiogroupItemContext]\n  = createContext<RadioGroupItemContext>('RadioGroupItem')\n</script>\n\n<script setup lang=\"ts\">\nimport { useEventListener } from '@vueuse/core'\nimport { isEqual } from 'ohash'\nimport { computed, ref } from 'vue'\nimport { RovingFocusItem } from '@/RovingFocus'\nimport Radio from './Radio.vue'\nimport { injectRadioGroupRootContext } from './RadioGroupRoot.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<RadioGroupItemProps>(), {\n  disabled: false,\n  as: 'button',\n})\n\nconst emits = defineEmits<RadioGroupItemEmits>()\n\ndefineSlots<{\n  default?: (props: {\n    /** Current checked state */\n    checked: typeof checked.value\n    /** Required state */\n    required: typeof required.value\n    /** Disabled state */\n    disabled: typeof disabled.value\n  }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst rootContext = injectRadioGroupRootContext()\n\nconst disabled = computed(() => rootContext.disabled.value || props.disabled)\nconst required = computed(() => rootContext.required.value || props.required)\nconst checked = computed(() => isEqual(rootContext.modelValue?.value, props.value))\n\nprovideRadiogroupItemContext({ disabled, checked })\n\nconst isArrowKeyPressed = ref(false)\nconst ARROW_KEYS = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight']\n\nuseEventListener('keydown', (event) => {\n  if (ARROW_KEYS.includes(event.key))\n    isArrowKeyPressed.value = true\n})\nuseEventListener('keyup', () => {\n  isArrowKeyPressed.value = false\n})\n\nfunction handleFocus() {\n  setTimeout(() => {\n    /**\n     * Our `RovingFocusGroup` will focus the radio when navigating with arrow keys\n     * and we need to 'check' it in that case. We click it to 'check' it (instead\n     * of updating `context.value`) so that the radio change event fires.\n     */\n    if (isArrowKeyPressed.value)\n      currentElement.value?.click()\n  }, 0)\n}\n</script>\n\n<template>\n  <RovingFocusItem\n    :checked=\"checked\"\n    :disabled=\"disabled\"\n    as-child\n    :focusable=\"!disabled\"\n    :active=\"checked\"\n  >\n    <Radio\n      v-bind=\"{ ...$attrs, ...props }\"\n      :ref=\"forwardRef\"\n      :checked=\"checked\"\n      :required=\"required\"\n      :disabled=\"disabled\"\n      @update:checked=\"rootContext.changeModelValue(value)\"\n      @select=\"emits('select', $event)\"\n      @keydown.enter.prevent\n      @focus=\"handleFocus\"\n    >\n      <slot\n        :checked=\"checked\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </Radio>\n  </RovingFocusItem>\n</template>\n"],"names":["createContext","useForwardExpose","injectRadioGroupRootContext","computed","isEqual","ref","useEventListener"],"mappings":";;;;;;;;;;;AAgBO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnEA,mCAAqC,gBAAgB;;;;;;;;;;;;;;;;;AAezD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAad,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AAExD,IAAA,MAAM,cAAcC,qDAA4B,EAAA;AAEhD,IAAA,MAAM,WAAWC,YAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAC5E,IAAA,MAAM,WAAWA,YAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAC5E,IAAM,MAAA,OAAA,GAAUA,aAAS,MAAMC,aAAA,CAAQ,YAAY,UAAY,EAAA,KAAA,EAAO,KAAM,CAAA,KAAK,CAAC,CAAA;AAElF,IAA6B,4BAAA,CAAA,EAAE,QAAU,EAAA,OAAA,EAAS,CAAA;AAElD,IAAM,MAAA,iBAAA,GAAoBC,QAAI,KAAK,CAAA;AACnC,IAAA,MAAM,UAAa,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,aAAa,YAAY,CAAA;AAErE,IAAiBC,qBAAA,CAAA,SAAA,EAAW,CAAC,KAAU,KAAA;AACrC,MAAI,IAAA,UAAA,CAAW,QAAS,CAAA,KAAA,CAAM,GAAG,CAAA;AAC/B,QAAA,iBAAA,CAAkB,KAAQ,GAAA,IAAA;AAAA,KAC7B,CAAA;AACD,IAAAA,qBAAA,CAAiB,SAAS,MAAM;AAC9B,MAAA,iBAAA,CAAkB,KAAQ,GAAA,KAAA;AAAA,KAC3B,CAAA;AAED,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,UAAA,CAAW,MAAM;AAMf,QAAA,IAAI,iBAAkB,CAAA,KAAA;AACpB,UAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA,SAC7B,CAAC,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RadioGroup/RadioGroupItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroupItem.js","sources":["../../src/RadioGroup/RadioGroupItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef } from 'vue'\nimport type { RadioProps } from './Radio.vue'\nimport type { SelectEvent } from './utils'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface RadioGroupItemProps extends Omit<RadioProps, 'checked'> {}\nexport type RadioGroupItemEmits = {\n  select: [event: SelectEvent]\n}\n\ninterface RadioGroupItemContext {\n  disabled: ComputedRef<boolean>\n  checked: ComputedRef<boolean>\n}\n\nexport const [injectRadioGroupItemContext, provideRadiogroupItemContext]\n  = createContext<RadioGroupItemContext>('RadioGroupItem')\n</script>\n\n<script setup lang=\"ts\">\nimport { RovingFocusItem } from '@/RovingFocus'\nimport { useEventListener } from '@vueuse/core'\nimport { isEqual } from 'ohash'\nimport { computed, ref } from 'vue'\nimport Radio from './Radio.vue'\nimport { injectRadioGroupRootContext } from './RadioGroupRoot.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<RadioGroupItemProps>(), {\n  disabled: false,\n  as: 'button',\n})\n\nconst emits = defineEmits<RadioGroupItemEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current checked state */\n    checked: typeof checked.value\n    /** Required state */\n    required: typeof required.value\n    /** Disabled state */\n    disabled: typeof disabled.value\n  }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst rootContext = injectRadioGroupRootContext()\n\nconst disabled = computed(() => rootContext.disabled.value || props.disabled)\nconst required = computed(() => rootContext.required.value || props.required)\nconst checked = computed(() => isEqual(rootContext.modelValue?.value, props.value))\n\nprovideRadiogroupItemContext({ disabled, checked })\n\nconst isArrowKeyPressed = ref(false)\nconst ARROW_KEYS = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight']\n\nuseEventListener('keydown', (event) => {\n  if (ARROW_KEYS.includes(event.key))\n    isArrowKeyPressed.value = true\n})\nuseEventListener('keyup', () => {\n  isArrowKeyPressed.value = false\n})\n\nfunction handleFocus() {\n  setTimeout(() => {\n    /**\n     * Our `RovingFocusGroup` will focus the radio when navigating with arrow keys\n     * and we need to 'check' it in that case. We click it to 'check' it (instead\n     * of updating `context.value`) so that the radio change event fires.\n     */\n    if (isArrowKeyPressed.value)\n      currentElement.value?.click()\n  }, 0)\n}\n</script>\n\n<template>\n  <RovingFocusItem\n    :checked=\"checked\"\n    :disabled=\"disabled\"\n    as-child\n    :focusable=\"!disabled\"\n    :active=\"checked\"\n  >\n    <Radio\n      v-bind=\"{ ...$attrs, ...props }\"\n      :ref=\"forwardRef\"\n      :checked=\"checked\"\n      :required=\"required\"\n      :disabled=\"disabled\"\n      @update:checked=\"rootContext.changeModelValue(value)\"\n      @select=\"emits('select', $event)\"\n      @keydown.enter.prevent\n      @focus=\"handleFocus\"\n    >\n      <slot\n        :checked=\"checked\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </Radio>\n  </RovingFocusItem>\n</template>\n"],"names":[],"mappings":";;;;;;;;;AAgBO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnE,cAAqC,gBAAgB;;;;;;;;;;;;;;;;;AAezD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAad,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA;AAExD,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAC5E,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAC5E,IAAM,MAAA,OAAA,GAAU,SAAS,MAAM,OAAA,CAAQ,YAAY,UAAY,EAAA,KAAA,EAAO,KAAM,CAAA,KAAK,CAAC,CAAA;AAElF,IAA6B,4BAAA,CAAA,EAAE,QAAU,EAAA,OAAA,EAAS,CAAA;AAElD,IAAM,MAAA,iBAAA,GAAoB,IAAI,KAAK,CAAA;AACnC,IAAA,MAAM,UAAa,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,aAAa,YAAY,CAAA;AAErE,IAAiB,gBAAA,CAAA,SAAA,EAAW,CAAC,KAAU,KAAA;AACrC,MAAI,IAAA,UAAA,CAAW,QAAS,CAAA,KAAA,CAAM,GAAG,CAAA;AAC/B,QAAA,iBAAA,CAAkB,KAAQ,GAAA,IAAA;AAAA,KAC7B,CAAA;AACD,IAAA,gBAAA,CAAiB,SAAS,MAAM;AAC9B,MAAA,iBAAA,CAAkB,KAAQ,GAAA,KAAA;AAAA,KAC3B,CAAA;AAED,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,UAAA,CAAW,MAAM;AAMf,QAAA,IAAI,iBAAkB,CAAA,KAAA;AACpB,UAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA,SAC7B,CAAC,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"RadioGroupItem.js","sources":["../../src/RadioGroup/RadioGroupItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ComputedRef } from 'vue'\nimport type { RadioProps } from './Radio.vue'\nimport type { SelectEvent } from './utils'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface RadioGroupItemProps extends Omit<RadioProps, 'checked'> {}\nexport type RadioGroupItemEmits = {\n  select: [event: SelectEvent]\n}\n\ninterface RadioGroupItemContext {\n  disabled: ComputedRef<boolean>\n  checked: ComputedRef<boolean>\n}\n\nexport const [injectRadioGroupItemContext, provideRadiogroupItemContext]\n  = createContext<RadioGroupItemContext>('RadioGroupItem')\n</script>\n\n<script setup lang=\"ts\">\nimport { useEventListener } from '@vueuse/core'\nimport { isEqual } from 'ohash'\nimport { computed, ref } from 'vue'\nimport { RovingFocusItem } from '@/RovingFocus'\nimport Radio from './Radio.vue'\nimport { injectRadioGroupRootContext } from './RadioGroupRoot.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<RadioGroupItemProps>(), {\n  disabled: false,\n  as: 'button',\n})\n\nconst emits = defineEmits<RadioGroupItemEmits>()\n\ndefineSlots<{\n  default?: (props: {\n    /** Current checked state */\n    checked: typeof checked.value\n    /** Required state */\n    required: typeof required.value\n    /** Disabled state */\n    disabled: typeof disabled.value\n  }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst rootContext = injectRadioGroupRootContext()\n\nconst disabled = computed(() => rootContext.disabled.value || props.disabled)\nconst required = computed(() => rootContext.required.value || props.required)\nconst checked = computed(() => isEqual(rootContext.modelValue?.value, props.value))\n\nprovideRadiogroupItemContext({ disabled, checked })\n\nconst isArrowKeyPressed = ref(false)\nconst ARROW_KEYS = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight']\n\nuseEventListener('keydown', (event) => {\n  if (ARROW_KEYS.includes(event.key))\n    isArrowKeyPressed.value = true\n})\nuseEventListener('keyup', () => {\n  isArrowKeyPressed.value = false\n})\n\nfunction handleFocus() {\n  setTimeout(() => {\n    /**\n     * Our `RovingFocusGroup` will focus the radio when navigating with arrow keys\n     * and we need to 'check' it in that case. We click it to 'check' it (instead\n     * of updating `context.value`) so that the radio change event fires.\n     */\n    if (isArrowKeyPressed.value)\n      currentElement.value?.click()\n  }, 0)\n}\n</script>\n\n<template>\n  <RovingFocusItem\n    :checked=\"checked\"\n    :disabled=\"disabled\"\n    as-child\n    :focusable=\"!disabled\"\n    :active=\"checked\"\n  >\n    <Radio\n      v-bind=\"{ ...$attrs, ...props }\"\n      :ref=\"forwardRef\"\n      :checked=\"checked\"\n      :required=\"required\"\n      :disabled=\"disabled\"\n      @update:checked=\"rootContext.changeModelValue(value)\"\n      @select=\"emits('select', $event)\"\n      @keydown.enter.prevent\n      @focus=\"handleFocus\"\n    >\n      <slot\n        :checked=\"checked\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </Radio>\n  </RovingFocusItem>\n</template>\n"],"names":[],"mappings":";;;;;;;;;AAgBO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnE,cAAqC,gBAAgB;;;;;;;;;;;;;;;;;AAezD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAad,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA;AAExD,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAC5E,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAC5E,IAAM,MAAA,OAAA,GAAU,SAAS,MAAM,OAAA,CAAQ,YAAY,UAAY,EAAA,KAAA,EAAO,KAAM,CAAA,KAAK,CAAC,CAAA;AAElF,IAA6B,4BAAA,CAAA,EAAE,QAAU,EAAA,OAAA,EAAS,CAAA;AAElD,IAAM,MAAA,iBAAA,GAAoB,IAAI,KAAK,CAAA;AACnC,IAAA,MAAM,UAAa,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,aAAa,YAAY,CAAA;AAErE,IAAiB,gBAAA,CAAA,SAAA,EAAW,CAAC,KAAU,KAAA;AACrC,MAAI,IAAA,UAAA,CAAW,QAAS,CAAA,KAAA,CAAM,GAAG,CAAA;AAC/B,QAAA,iBAAA,CAAkB,KAAQ,GAAA,IAAA;AAAA,KAC7B,CAAA;AACD,IAAA,gBAAA,CAAiB,SAAS,MAAM;AAC9B,MAAA,iBAAA,CAAkB,KAAQ,GAAA,KAAA;AAAA,KAC3B,CAAA;AAED,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,UAAA,CAAW,MAAM;AAMf,QAAA,IAAI,iBAAkB,CAAA,KAAA;AACpB,UAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA,SAC7B,CAAC,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RadioGroup/RadioGroupRoot.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroupRoot.cjs","sources":["../../src/RadioGroup/RadioGroupRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, DataOrientation, Direction, FormFieldProps } from '@/shared/types'\nimport type { Ref } from 'vue'\nimport { createContext, useDirection, useFormControl, useForwardExpose } from '@/shared'\n\nexport interface RadioGroupRootProps extends PrimitiveProps, FormFieldProps {\n  /** The controlled value of the radio item to check. Can be binded as `v-model`. */\n  modelValue?: AcceptableValue\n  /**\n   * The value of the radio item that should be checked when initially rendered.\n   *\n   * Use when you do not need to control the state of the radio items.\n   */\n  defaultValue?: AcceptableValue\n  /** When `true`, prevents the user from interacting with radio items. */\n  disabled?: boolean\n  /** The orientation of the component. */\n  orientation?: DataOrientation\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** When `true`, keyboard navigation will loop from last item to first, and vice versa. */\n  loop?: boolean\n}\nexport type RadioGroupRootEmits = {\n  /** Event handler called when the radio group value changes */\n  'update:modelValue': [payload: string]\n}\n\ninterface RadioGroupRootContext {\n  modelValue?: Readonly<Ref<AcceptableValue | undefined>>\n  changeModelValue: (value?: AcceptableValue) => void\n  disabled: Ref<boolean>\n  loop: Ref<boolean>\n  orientation: Ref<DataOrientation | undefined>\n  name?: string\n  required: Ref<boolean>\n}\n\nexport const [injectRadioGroupRootContext, provideRadioGroupRootContext]\n  = createContext<RadioGroupRootContext>('RadioGroupRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { RovingFocusGroup } from '@/RovingFocus'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\nimport { useVModel } from '@vueuse/core'\nimport { toRefs } from 'vue'\n\nconst props = withDefaults(defineProps<RadioGroupRootProps>(), {\n  disabled: false,\n  required: false,\n  orientation: undefined,\n  loop: true,\n})\n\nconst emits = defineEmits<RadioGroupRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: props.defaultValue,\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst { disabled, loop, orientation, name, required, dir: propDir } = toRefs(props)\nconst dir = useDirection(propDir)\nconst isFormControl = useFormControl(currentElement)\n\nprovideRadioGroupRootContext({\n  modelValue,\n  changeModelValue: (value) => {\n    modelValue.value = value\n  },\n  disabled,\n  loop,\n  orientation,\n  name: name?.value,\n  required,\n})\n</script>\n\n<template>\n  <RovingFocusGroup\n    as-child\n    :orientation=\"orientation\"\n    :dir=\"dir\"\n    :loop=\"loop\"\n  >\n    <Primitive\n      :ref=\"forwardRef\"\n      role=\"radiogroup\"\n      :data-disabled=\"disabled ? '' : undefined\"\n      :as-child=\"asChild\"\n      :as=\"as\"\n      :aria-orientation=\"orientation\"\n      :aria-required=\"required\"\n      :dir=\"dir\"\n    >\n      <slot :model-value=\"modelValue\" />\n\n      <VisuallyHiddenInput\n        v-if=\"isFormControl && name\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n        :value=\"modelValue\"\n        :name=\"name\"\n      />\n    </Primitive>\n  </RovingFocusGroup>\n</template>\n"],"names":["createContext","useForwardExpose","useVModel","toRefs","useDirection","useFormControl"],"mappings":";;;;;;;;;;;;AAuCO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnEA,mCAAqC,gBAAgB;;;;;;;;;;;;;;;;;AAUzD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAOd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AACxD,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;AAAA,KAChC,CAAA;AAED,IAAM,MAAA,EAAE,QAAU,EAAA,IAAA,EAAM,WAAa,EAAA,IAAA,EAAM,UAAU,GAAK,EAAA,OAAA,EAAY,GAAAC,UAAA,CAAO,KAAK,CAAA;AAClF,IAAM,MAAA,GAAA,GAAMC,iCAAa,OAAO,CAAA;AAChC,IAAM,MAAA,aAAA,GAAgBC,qCAAe,cAAc,CAAA;AAEnD,IAA6B,4BAAA,CAAA;AAAA,MAC3B,UAAA;AAAA,MACA,gBAAA,EAAkB,CAAC,KAAU,KAAA;AAC3B,QAAA,UAAA,CAAW,KAAQ,GAAA,KAAA;AAAA,OACrB;AAAA,MACA,QAAA;AAAA,MACA,IAAA;AAAA,MACA,WAAA;AAAA,MACA,MAAM,IAAM,EAAA,KAAA;AAAA,MACZ;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"RadioGroupRoot.cjs","sources":["../../src/RadioGroup/RadioGroupRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, DataOrientation, Direction, FormFieldProps } from '@/shared/types'\nimport { createContext, useDirection, useFormControl, useForwardExpose } from '@/shared'\n\nexport interface RadioGroupRootProps extends PrimitiveProps, FormFieldProps {\n  /** The controlled value of the radio item to check. Can be binded as `v-model`. */\n  modelValue?: AcceptableValue\n  /**\n   * The value of the radio item that should be checked when initially rendered.\n   *\n   * Use when you do not need to control the state of the radio items.\n   */\n  defaultValue?: AcceptableValue\n  /** When `true`, prevents the user from interacting with radio items. */\n  disabled?: boolean\n  /** The orientation of the component. */\n  orientation?: DataOrientation\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** When `true`, keyboard navigation will loop from last item to first, and vice versa. */\n  loop?: boolean\n}\nexport type RadioGroupRootEmits = {\n  /** Event handler called when the radio group value changes */\n  'update:modelValue': [payload: string]\n}\n\ninterface RadioGroupRootContext {\n  modelValue?: Readonly<Ref<AcceptableValue | undefined>>\n  changeModelValue: (value?: AcceptableValue) => void\n  disabled: Ref<boolean>\n  loop: Ref<boolean>\n  orientation: Ref<DataOrientation | undefined>\n  name?: string\n  required: Ref<boolean>\n}\n\nexport const [injectRadioGroupRootContext, provideRadioGroupRootContext]\n  = createContext<RadioGroupRootContext>('RadioGroupRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { toRefs } from 'vue'\nimport { Primitive } from '@/Primitive'\nimport { RovingFocusGroup } from '@/RovingFocus'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\n\nconst props = withDefaults(defineProps<RadioGroupRootProps>(), {\n  disabled: false,\n  required: false,\n  orientation: undefined,\n  loop: true,\n})\n\nconst emits = defineEmits<RadioGroupRootEmits>()\n\ndefineSlots<{\n  default?: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: props.defaultValue,\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst { disabled, loop, orientation, name, required, dir: propDir } = toRefs(props)\nconst dir = useDirection(propDir)\nconst isFormControl = useFormControl(currentElement)\n\nprovideRadioGroupRootContext({\n  modelValue,\n  changeModelValue: (value) => {\n    modelValue.value = value\n  },\n  disabled,\n  loop,\n  orientation,\n  name: name?.value,\n  required,\n})\n</script>\n\n<template>\n  <RovingFocusGroup\n    as-child\n    :orientation=\"orientation\"\n    :dir=\"dir\"\n    :loop=\"loop\"\n  >\n    <Primitive\n      :ref=\"forwardRef\"\n      role=\"radiogroup\"\n      :data-disabled=\"disabled ? '' : undefined\"\n      :as-child=\"asChild\"\n      :as=\"as\"\n      :aria-orientation=\"orientation\"\n      :aria-required=\"required\"\n      :dir=\"dir\"\n    >\n      <slot :model-value=\"modelValue\" />\n\n      <VisuallyHiddenInput\n        v-if=\"isFormControl && name\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n        :value=\"modelValue\"\n        :name=\"name\"\n      />\n    </Primitive>\n  </RovingFocusGroup>\n</template>\n"],"names":["createContext","useForwardExpose","useVModel","toRefs","useDirection","useFormControl"],"mappings":";;;;;;;;;;;;AAuCO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnEA,mCAAqC,gBAAgB;;;;;;;;;;;;;;;;;AAUzD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAOd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AACxD,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;AAAA,KAChC,CAAA;AAED,IAAM,MAAA,EAAE,QAAU,EAAA,IAAA,EAAM,WAAa,EAAA,IAAA,EAAM,UAAU,GAAK,EAAA,OAAA,EAAY,GAAAC,UAAA,CAAO,KAAK,CAAA;AAClF,IAAM,MAAA,GAAA,GAAMC,iCAAa,OAAO,CAAA;AAChC,IAAM,MAAA,aAAA,GAAgBC,qCAAe,cAAc,CAAA;AAEnD,IAA6B,4BAAA,CAAA;AAAA,MAC3B,UAAA;AAAA,MACA,gBAAA,EAAkB,CAAC,KAAU,KAAA;AAC3B,QAAA,UAAA,CAAW,KAAQ,GAAA,KAAA;AAAA,OACrB;AAAA,MACA,QAAA;AAAA,MACA,IAAA;AAAA,MACA,WAAA;AAAA,MACA,MAAM,IAAM,EAAA,KAAA;AAAA,MACZ;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RadioGroup/RadioGroupRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroupRoot.js","sources":["../../src/RadioGroup/RadioGroupRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, DataOrientation, Direction, FormFieldProps } from '@/shared/types'\nimport type { Ref } from 'vue'\nimport { createContext, useDirection, useFormControl, useForwardExpose } from '@/shared'\n\nexport interface RadioGroupRootProps extends PrimitiveProps, FormFieldProps {\n  /** The controlled value of the radio item to check. Can be binded as `v-model`. */\n  modelValue?: AcceptableValue\n  /**\n   * The value of the radio item that should be checked when initially rendered.\n   *\n   * Use when you do not need to control the state of the radio items.\n   */\n  defaultValue?: AcceptableValue\n  /** When `true`, prevents the user from interacting with radio items. */\n  disabled?: boolean\n  /** The orientation of the component. */\n  orientation?: DataOrientation\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** When `true`, keyboard navigation will loop from last item to first, and vice versa. */\n  loop?: boolean\n}\nexport type RadioGroupRootEmits = {\n  /** Event handler called when the radio group value changes */\n  'update:modelValue': [payload: string]\n}\n\ninterface RadioGroupRootContext {\n  modelValue?: Readonly<Ref<AcceptableValue | undefined>>\n  changeModelValue: (value?: AcceptableValue) => void\n  disabled: Ref<boolean>\n  loop: Ref<boolean>\n  orientation: Ref<DataOrientation | undefined>\n  name?: string\n  required: Ref<boolean>\n}\n\nexport const [injectRadioGroupRootContext, provideRadioGroupRootContext]\n  = createContext<RadioGroupRootContext>('RadioGroupRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { RovingFocusGroup } from '@/RovingFocus'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\nimport { useVModel } from '@vueuse/core'\nimport { toRefs } from 'vue'\n\nconst props = withDefaults(defineProps<RadioGroupRootProps>(), {\n  disabled: false,\n  required: false,\n  orientation: undefined,\n  loop: true,\n})\n\nconst emits = defineEmits<RadioGroupRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: props.defaultValue,\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst { disabled, loop, orientation, name, required, dir: propDir } = toRefs(props)\nconst dir = useDirection(propDir)\nconst isFormControl = useFormControl(currentElement)\n\nprovideRadioGroupRootContext({\n  modelValue,\n  changeModelValue: (value) => {\n    modelValue.value = value\n  },\n  disabled,\n  loop,\n  orientation,\n  name: name?.value,\n  required,\n})\n</script>\n\n<template>\n  <RovingFocusGroup\n    as-child\n    :orientation=\"orientation\"\n    :dir=\"dir\"\n    :loop=\"loop\"\n  >\n    <Primitive\n      :ref=\"forwardRef\"\n      role=\"radiogroup\"\n      :data-disabled=\"disabled ? '' : undefined\"\n      :as-child=\"asChild\"\n      :as=\"as\"\n      :aria-orientation=\"orientation\"\n      :aria-required=\"required\"\n      :dir=\"dir\"\n    >\n      <slot :model-value=\"modelValue\" />\n\n      <VisuallyHiddenInput\n        v-if=\"isFormControl && name\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n        :value=\"modelValue\"\n        :name=\"name\"\n      />\n    </Primitive>\n  </RovingFocusGroup>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;AAuCO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnE,cAAqC,gBAAgB;;;;;;;;;;;;;;;;;AAUzD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAOd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA;AACxD,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;AAAA,KAChC,CAAA;AAED,IAAM,MAAA,EAAE,QAAU,EAAA,IAAA,EAAM,WAAa,EAAA,IAAA,EAAM,UAAU,GAAK,EAAA,OAAA,EAAY,GAAA,MAAA,CAAO,KAAK,CAAA;AAClF,IAAM,MAAA,GAAA,GAAM,aAAa,OAAO,CAAA;AAChC,IAAM,MAAA,aAAA,GAAgB,eAAe,cAAc,CAAA;AAEnD,IAA6B,4BAAA,CAAA;AAAA,MAC3B,UAAA;AAAA,MACA,gBAAA,EAAkB,CAAC,KAAU,KAAA;AAC3B,QAAA,UAAA,CAAW,KAAQ,GAAA,KAAA;AAAA,OACrB;AAAA,MACA,QAAA;AAAA,MACA,IAAA;AAAA,MACA,WAAA;AAAA,MACA,MAAM,IAAM,EAAA,KAAA;AAAA,MACZ;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"RadioGroupRoot.js","sources":["../../src/RadioGroup/RadioGroupRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { AcceptableValue, DataOrientation, Direction, FormFieldProps } from '@/shared/types'\nimport { createContext, useDirection, useFormControl, useForwardExpose } from '@/shared'\n\nexport interface RadioGroupRootProps extends PrimitiveProps, FormFieldProps {\n  /** The controlled value of the radio item to check. Can be binded as `v-model`. */\n  modelValue?: AcceptableValue\n  /**\n   * The value of the radio item that should be checked when initially rendered.\n   *\n   * Use when you do not need to control the state of the radio items.\n   */\n  defaultValue?: AcceptableValue\n  /** When `true`, prevents the user from interacting with radio items. */\n  disabled?: boolean\n  /** The orientation of the component. */\n  orientation?: DataOrientation\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** When `true`, keyboard navigation will loop from last item to first, and vice versa. */\n  loop?: boolean\n}\nexport type RadioGroupRootEmits = {\n  /** Event handler called when the radio group value changes */\n  'update:modelValue': [payload: string]\n}\n\ninterface RadioGroupRootContext {\n  modelValue?: Readonly<Ref<AcceptableValue | undefined>>\n  changeModelValue: (value?: AcceptableValue) => void\n  disabled: Ref<boolean>\n  loop: Ref<boolean>\n  orientation: Ref<DataOrientation | undefined>\n  name?: string\n  required: Ref<boolean>\n}\n\nexport const [injectRadioGroupRootContext, provideRadioGroupRootContext]\n  = createContext<RadioGroupRootContext>('RadioGroupRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { toRefs } from 'vue'\nimport { Primitive } from '@/Primitive'\nimport { RovingFocusGroup } from '@/RovingFocus'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\n\nconst props = withDefaults(defineProps<RadioGroupRootProps>(), {\n  disabled: false,\n  required: false,\n  orientation: undefined,\n  loop: true,\n})\n\nconst emits = defineEmits<RadioGroupRootEmits>()\n\ndefineSlots<{\n  default?: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nconst { forwardRef, currentElement } = useForwardExpose()\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: props.defaultValue,\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst { disabled, loop, orientation, name, required, dir: propDir } = toRefs(props)\nconst dir = useDirection(propDir)\nconst isFormControl = useFormControl(currentElement)\n\nprovideRadioGroupRootContext({\n  modelValue,\n  changeModelValue: (value) => {\n    modelValue.value = value\n  },\n  disabled,\n  loop,\n  orientation,\n  name: name?.value,\n  required,\n})\n</script>\n\n<template>\n  <RovingFocusGroup\n    as-child\n    :orientation=\"orientation\"\n    :dir=\"dir\"\n    :loop=\"loop\"\n  >\n    <Primitive\n      :ref=\"forwardRef\"\n      role=\"radiogroup\"\n      :data-disabled=\"disabled ? '' : undefined\"\n      :as-child=\"asChild\"\n      :as=\"as\"\n      :aria-orientation=\"orientation\"\n      :aria-required=\"required\"\n      :dir=\"dir\"\n    >\n      <slot :model-value=\"modelValue\" />\n\n      <VisuallyHiddenInput\n        v-if=\"isFormControl && name\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n        :value=\"modelValue\"\n        :name=\"name\"\n      />\n    </Primitive>\n  </RovingFocusGroup>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;AAuCO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnE,cAAqC,gBAAgB;;;;;;;;;;;;;;;;;AAUzD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAOd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA;AACxD,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;AAAA,KAChC,CAAA;AAED,IAAM,MAAA,EAAE,QAAU,EAAA,IAAA,EAAM,WAAa,EAAA,IAAA,EAAM,UAAU,GAAK,EAAA,OAAA,EAAY,GAAA,MAAA,CAAO,KAAK,CAAA;AAClF,IAAM,MAAA,GAAA,GAAM,aAAa,OAAO,CAAA;AAChC,IAAM,MAAA,aAAA,GAAgB,eAAe,cAAc,CAAA;AAEnD,IAA6B,4BAAA,CAAA;AAAA,MAC3B,UAAA;AAAA,MACA,gBAAA,EAAkB,CAAC,KAAU,KAAA;AAC3B,QAAA,UAAA,CAAW,KAAQ,GAAA,KAAA;AAAA,OACrB;AAAA,MACA,QAAA;AAAA,MACA,IAAA;AAAA,MACA,WAAA;AAAA,MACA,MAAM,IAAM,EAAA,KAAA;AAAA,MACZ;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RangeCalendar/RangeCalendarCell.cjs

@@ -19,8 +19,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         "as-child": _ctx.asChild,
         role: "gridcell",
         "aria-selected": vue.unref(rootContext).isSelected(_ctx.date) ? true : void 0,
-        "aria-disabled": vue.unref(rootContext).isDateDisabled(_ctx.date) || vue.unref(rootContext).isDateUnavailable?.(_ctx.date),
-        "data-disabled": vue.unref(rootContext).isDateDisabled(_ctx.date) ? "" : void 0
+        "aria-disabled": vue.unref(rootContext).isDateDisabled(_ctx.date) || vue.unref(rootContext).isDateUnavailable?.(_ctx.date) || vue.unref(rootContext).disableDaysOutsideCurrentView.value,
+        "data-disabled": vue.unref(rootContext).isDateDisabled(_ctx.date) || vue.unref(rootContext).disableDaysOutsideCurrentView.value ? "" : void 0
       }, {
         default: vue.withCtx(() => [
           vue.renderSlot(_ctx.$slots, "default")

package/dist/RangeCalendar/RangeCalendarCell.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RangeCalendarCell.cjs","sources":["../../src/RangeCalendar/RangeCalendarCell.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { DateValue } from '@internationalized/date'\n\nexport interface RangeCalendarCellProps extends PrimitiveProps {\n  date: DateValue\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { injectRangeCalendarRootContext } from './RangeCalendarRoot.vue'\n\nwithDefaults(defineProps<RangeCalendarCellProps>(), { as: 'td' })\nconst rootContext = injectRangeCalendarRootContext()\n</script>\n\n<template>\n  <Primitive\n    :as=\"as\"\n    :as-child=\"asChild\"\n    role=\"gridcell\"\n    :aria-selected=\"rootContext.isSelected(date) ? true : undefined\"\n    :aria-disabled=\"rootContext.isDateDisabled(date) || rootContext.isDateUnavailable?.(date)\"\n    :data-disabled=\"rootContext.isDateDisabled(date) ? '' : undefined\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectRangeCalendarRootContext"],"mappings":";;;;;;;;;;;;;;AAcA,IAAA,MAAM,cAAcA,8DAA+B,EAAA;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"RangeCalendarCell.cjs","sources":["../../src/RangeCalendar/RangeCalendarCell.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DateValue } from '@internationalized/date'\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface RangeCalendarCellProps extends PrimitiveProps {\n  date: DateValue\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { injectRangeCalendarRootContext } from './RangeCalendarRoot.vue'\n\nwithDefaults(defineProps<RangeCalendarCellProps>(), { as: 'td' })\nconst rootContext = injectRangeCalendarRootContext()\n</script>\n\n<template>\n  <Primitive\n    :as=\"as\"\n    :as-child=\"asChild\"\n    role=\"gridcell\"\n    :aria-selected=\"rootContext.isSelected(date) ? true : undefined\"\n    :aria-disabled=\"rootContext.isDateDisabled(date) || rootContext.isDateUnavailable?.(date) || rootContext.disableDaysOutsideCurrentView.value\"\n    :data-disabled=\"rootContext.isDateDisabled(date) || rootContext.disableDaysOutsideCurrentView.value ? '' : undefined\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectRangeCalendarRootContext"],"mappings":";;;;;;;;;;;;;;AAcA,IAAA,MAAM,cAAcA,8DAA+B,EAAA;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RangeCalendar/RangeCalendarCell.js

@@ -17,8 +17,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         "as-child": _ctx.asChild,
         role: "gridcell",
         "aria-selected": unref(rootContext).isSelected(_ctx.date) ? true : void 0,
-        "aria-disabled": unref(rootContext).isDateDisabled(_ctx.date) || unref(rootContext).isDateUnavailable?.(_ctx.date),
-        "data-disabled": unref(rootContext).isDateDisabled(_ctx.date) ? "" : void 0
+        "aria-disabled": unref(rootContext).isDateDisabled(_ctx.date) || unref(rootContext).isDateUnavailable?.(_ctx.date) || unref(rootContext).disableDaysOutsideCurrentView.value,
+        "data-disabled": unref(rootContext).isDateDisabled(_ctx.date) || unref(rootContext).disableDaysOutsideCurrentView.value ? "" : void 0
       }, {
         default: withCtx(() => [
           renderSlot(_ctx.$slots, "default")

package/dist/RangeCalendar/RangeCalendarCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"RangeCalendarCell.js","sources":["../../src/RangeCalendar/RangeCalendarCell.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { DateValue } from '@internationalized/date'\n\nexport interface RangeCalendarCellProps extends PrimitiveProps {\n  date: DateValue\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { injectRangeCalendarRootContext } from './RangeCalendarRoot.vue'\n\nwithDefaults(defineProps<RangeCalendarCellProps>(), { as: 'td' })\nconst rootContext = injectRangeCalendarRootContext()\n</script>\n\n<template>\n  <Primitive\n    :as=\"as\"\n    :as-child=\"asChild\"\n    role=\"gridcell\"\n    :aria-selected=\"rootContext.isSelected(date) ? true : undefined\"\n    :aria-disabled=\"rootContext.isDateDisabled(date) || rootContext.isDateUnavailable?.(date)\"\n    :data-disabled=\"rootContext.isDateDisabled(date) ? '' : undefined\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;AAcA,IAAA,MAAM,cAAc,8BAA+B,EAAA;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"RangeCalendarCell.js","sources":["../../src/RangeCalendar/RangeCalendarCell.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DateValue } from '@internationalized/date'\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface RangeCalendarCellProps extends PrimitiveProps {\n  date: DateValue\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { injectRangeCalendarRootContext } from './RangeCalendarRoot.vue'\n\nwithDefaults(defineProps<RangeCalendarCellProps>(), { as: 'td' })\nconst rootContext = injectRangeCalendarRootContext()\n</script>\n\n<template>\n  <Primitive\n    :as=\"as\"\n    :as-child=\"asChild\"\n    role=\"gridcell\"\n    :aria-selected=\"rootContext.isSelected(date) ? true : undefined\"\n    :aria-disabled=\"rootContext.isDateDisabled(date) || rootContext.isDateUnavailable?.(date) || rootContext.disableDaysOutsideCurrentView.value\"\n    :data-disabled=\"rootContext.isDateDisabled(date) || rootContext.disableDaysOutsideCurrentView.value ? '' : undefined\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;AAcA,IAAA,MAAM,cAAc,8BAA+B,EAAA;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RangeCalendar/RangeCalendarCellTrigger.cjs

@@ -1,9 +1,9 @@
 'use strict';
 
 const vue = require('vue');
+const date = require('@internationalized/date');
 const Calendar_utils = require('../Calendar/utils.cjs');
 const date_comparators = require('../date/comparators.cjs');
-const date = require('@internationalized/date');
 const Primitive_usePrimitiveElement = require('../Primitive/usePrimitiveElement.cjs');
 const Primitive_Primitive = require('../Primitive/Primitive.cjs');
 const shared_useKbd = require('../shared/useKbd.cjs');
@@ -28,7 +28,6 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       day: "numeric",
       year: "numeric"
     }));
-    const isDisabled = vue.computed(() => rootContext.isDateDisabled(props.day));
     const isUnavailable = vue.computed(() => rootContext.isDateUnavailable?.(props.day) ?? false);
     const isSelectedDate = vue.computed(() => rootContext.isSelected(props.day));
     const isSelectionStart = vue.computed(() => rootContext.isSelectionStart(props.day));
@@ -36,6 +35,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const isHighlightStart = vue.computed(() => rootContext.isHighlightedStart(props.day));
     const isHighlightEnd = vue.computed(() => rootContext.isHighlightedEnd(props.day));
     const isHighlighted = vue.computed(() => rootContext.highlightedRange.value ? date_comparators.isBetweenInclusive(props.day, rootContext.highlightedRange.value.start, rootContext.highlightedRange.value.end) : false);
+    const allowNonContiguousRanges = vue.computed(() => rootContext.allowNonContiguousRanges.value);
     const isDateToday = vue.computed(() => {
       return date.isToday(props.day, date.getLocalTimeZone());
     });
@@ -45,6 +45,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const isOutsideVisibleView = vue.computed(
       () => rootContext.isOutsideVisibleView(props.day)
     );
+    const isDisabled = vue.computed(() => rootContext.isDateDisabled(props.day) || rootContext.disableDaysOutsideCurrentView.value && isOutsideView.value);
     const dayValue = vue.computed(() => props.day.day.toLocaleString(rootContext.locale.value));
     const isFocusedDate = vue.computed(() => {
       return !rootContext.disabled.value && date.isSameDay(props.day, rootContext.placeholder.value);
@@ -78,19 +79,37 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       } else if (!rootContext.endValue.value) {
         rootContext.endValue.value = date$1.copy();
       } else if (rootContext.endValue.value && rootContext.startValue.value) {
-        rootContext.endValue.value = void 0;
-        rootContext.startValue.value = date$1.copy();
+        if (!rootContext.fixedDate.value) {
+          rootContext.endValue.value = void 0;
+          rootContext.startValue.value = date$1.copy();
+        } else if (rootContext.fixedDate.value === "start") {
+          if (date$1.compare(rootContext.startValue.value) < 0) {
+            rootContext.startValue.value = date$1.copy();
+          } else {
+            rootContext.endValue.value = date$1.copy();
+          }
+        } else if (rootContext.fixedDate.value === "end") {
+          if (date$1.compare(rootContext.endValue.value) > 0) {
+            rootContext.endValue.value = date$1.copy();
+          } else {
+            rootContext.startValue.value = date$1.copy();
+          }
+        }
       }
     }
     function handleClick(e) {
+      if (isDisabled.value)
+        return;
       changeDate(e, props.day);
     }
     function handleFocus() {
-      if (rootContext.isDateDisabled(props.day) || rootContext.isDateUnavailable?.(props.day))
+      if (isDisabled.value || rootContext.isDateUnavailable?.(props.day))
         return;
       rootContext.focusedValue.value = props.day.copy();
     }
     function handleArrowKey(e) {
+      if (isDisabled.value)
+        return;
       e.preventDefault();
       e.stopPropagation();
       const parentElement = rootContext.parentElement.value;
@@ -187,14 +206,14 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         role: "button",
         "aria-label": labelText.value,
         "data-reka-calendar-cell-trigger": "",
-        "aria-selected": isSelectedDate.value && !isUnavailable.value ? true : void 0,
+        "aria-selected": isSelectedDate.value && (allowNonContiguousRanges.value || !isUnavailable.value) ? true : void 0,
         "aria-disabled": isDisabled.value || isUnavailable.value ? true : void 0,
-        "data-highlighted": isHighlighted.value && !isUnavailable.value ? "" : void 0,
+        "data-highlighted": isHighlighted.value && (allowNonContiguousRanges.value || !isUnavailable.value) ? "" : void 0,
         "data-selection-start": isSelectionStart.value ? true : void 0,
         "data-selection-end": isSelectionEnd.value ? true : void 0,
         "data-highlighted-start": isHighlightStart.value ? true : void 0,
         "data-highlighted-end": isHighlightEnd.value ? true : void 0,
-        "data-selected": isSelectedDate.value && !isUnavailable.value ? true : void 0,
+        "data-selected": isSelectedDate.value && (allowNonContiguousRanges.value || !isUnavailable.value) ? true : void 0,
         "data-outside-visible-view": isOutsideVisibleView.value ? "" : void 0,
         "data-value": _ctx.day.toString(),
         "data-disabled": isDisabled.value ? "" : void 0,
@@ -217,7 +236,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             outsideView: isOutsideView.value,
             outsideVisibleView: isOutsideVisibleView.value,
             unavailable: isUnavailable.value,
-            highlighted: isHighlighted.value && !isUnavailable.value,
+            highlighted: isHighlighted.value && (allowNonContiguousRanges.value || !isUnavailable.value),
             highlightedStart: isHighlightStart.value,
             highlightedEnd: isHighlightEnd.value,
             selectionStart: isSelectionStart.value,