@scalar/components 0.27.10 → 0.27.11

package/dist/components/ScalarButton/ScalarButton.vue.script.js

@@ -7,7 +7,7 @@ var _hoisted_1 = {
 	key: 3,
 	class: "centered"
 };
-var ScalarButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarButton_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarButton",
 	props: {
@@ -80,7 +80,7 @@ var ScalarButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 					__props.loader ? (openBlock(), createElementBlock("span", {
 						key: 1,
 						class: normalizeClass({ invisible: __props.loader?.isActive })
-					}, [renderSlot(_ctx.$slots, "default")], 2)) : renderSlot(_ctx.$slots, "default", { key: 2 }),
+					}, [renderSlot(_ctx.$slots, "default")], 2)) : renderSlot(_ctx.$slots, "default", {}, void 0, void 0, 2),
 					__props.loader?.isActive ? (openBlock(), createElementBlock("div", _hoisted_1, [createVNode(unref(ScalarLoading_default), {
 						class: normalizeClass(unref(loadingVariants)({ size: __props.size })),
 						loader: __props.loader

package/dist/components/ScalarButton/ScalarButton.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarButton.vue.script.js","names":["$slots"],"sources":["../../../src/components/ScalarButton/ScalarButton.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Button Component\n *\n * Provides a styled button, if you are looking for\n * an icon only button, use ScalarIconButton instead,\n * it's a helpful wrapper around this component\n *\n * @example\n * <ScalarButton>\n *   <!-- Button label -->\n * </ScalarButton>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { cva, useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport { ScalarLoading } from '../ScalarLoading'\nimport { BUTTON_VARIANT_STYLES } from './constants'\nimport type { ButtonSize, ClassList, ScalarButtonProps } from './types'\n\nconst {\n  is = 'button',\n  size = 'md',\n  variant = 'solid',\n} = defineProps<ScalarButtonProps>()\n\n/** Variant styles for the button (wrapper) */\nconst buttonVariants = cva({\n  base: 'scalar-button flex cursor-pointer items-center justify-center rounded font-medium -outline-offset-1',\n  variants: {\n    disabled: { true: 'bg-b-2 text-color-3 shadow-none' },\n    size: {\n      xs: 'px-2 py-1 text-xs/4',\n      sm: 'px-3.5 py-2 text-sm/4',\n      md: 'px-5 py-3 text-sm/4',\n    } satisfies Record<ButtonSize, ClassList>,\n    variant: BUTTON_VARIANT_STYLES,\n  },\n  compoundVariants: [\n    {\n      disabled: true,\n      variant: ['solid', 'outlined', 'ghost', 'gradient', 'danger'],\n      class:\n        'bg-b-2 text-c-3 shadow-none hover:bg-b-[_] cursor-not-allowed active:bg-b-[_] hover:text-c-[_] active:text-c-[_]',\n    },\n    {\n      disabled: true,\n      variant: ['gradient'],\n      class:\n        'to-b-1.5 bg-linear-to-b hover:bg-linear-to-b dark:hover:bg-linear-to-t',\n    },\n  ],\n})\n\n/** Variant styles for the button icon */\nconst iconVariants = cva({\n  base: 'shrink-0',\n  variants: {\n    size: {\n      xs: 'size-2.75 -ml-0.25 mr-1',\n      sm: 'size-3.5 -ml-0.25 mr-1',\n      md: 'size-3.5 -ml-0.5 mr-1.5',\n    } satisfies Record<ButtonSize, ClassList>,\n  },\n})\n\n/** Variant styles for the loading icon */\nconst loadingVariants = cva({\n  variants: {\n    size: {\n      xs: 'size-4',\n      sm: 'size-5',\n      md: 'size-6',\n    } satisfies Record<ButtonSize, ClassList>,\n  },\n})\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    :aria-disabled=\"disabled || undefined\"\n    :type=\"is === 'button' ? 'button' : undefined\"\n    v-bind=\"\n      cx(buttonVariants({ disabled, size, variant }), {\n        relative: loader?.isActive,\n      })\n    \">\n    <div\n      v-if=\"$slots.icon || icon\"\n      :class=\"[iconVariants({ size }), { invisible: loader?.isActive }]\">\n      <slot name=\"icon\">\n        <component\n          :is=\"icon\"\n          class=\"size-full\" />\n      </slot>\n    </div>\n    <span\n      v-if=\"loader\"\n      :class=\"{ invisible: loader?.isActive }\">\n      <slot />\n    </span>\n    <slot v-else />\n    <div\n      v-if=\"loader?.isActive\"\n      class=\"centered\">\n      <ScalarLoading\n        :class=\"loadingVariants({ size })\"\n        :loader />\n    </div>\n  </component>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EA6BA,MAAM,iBAAiB,IAAI;GACzB,MAAM;GACN,UAAU;IACR,UAAU,EAAE,MAAM,mCAAmC;IACrD,MAAM;KACJ,IAAI;KACJ,IAAI;KACJ,IAAI;KACL;IACD,SAAS;IACV;GACD,kBAAkB,CAChB;IACE,UAAU;IACV,SAAS;KAAC;KAAS;KAAY;KAAS;KAAY;KAAS;IAC7D,OACE;IACH,EACD;IACE,UAAU;IACV,SAAS,CAAC,WAAW;IACrB,OACE;IACH,CACF;GACF,CAAA;;EAGD,MAAM,eAAe,IAAI;GACvB,MAAM;GACN,UAAU,EACR,MAAM;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACL,EACF;GACF,CAAA;;EAGD,MAAM,kBAAkB,IAAI,EAC1B,UAAU,EACR,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,EACF,EACF,CAAA;EAGD,MAAM,EAAE,OAAO,WAAU;;uBAGvB,YA+BY,wBA9BL,QAAA,GAAE,EADT,WA+BY;IA7BT,iBAAe,QAAA,YAAY,KAAA;IAC3B,MAAM,QAAA,OAAE,WAAA,WAA2B,KAAA;MACrB,MAAA,GAAE,CAAC,MAAA,eAAc,CAAA;IAAA,UAAG,QAAA;IAAQ,MAAE,QAAA;IAAI,SAAE,QAAA;IAAO,CAAA,EAAA,EAAA,UAAyB,QAAA,QAAQ,UAAA,CAAA,CAAA,EAAA;2BAarF;KAPEA,KAAAA,OAAO,QAAQ,QAAA,QAAA,WAAA,EADvB,mBAQM,OAAA;;MANH,OAAK,eAAA,CAAG,MAAA,aAAY,CAAA,EAAA,MAAG,QAAA,MAAI,CAAA,EAAA,EAAA,WAAkB,QAAA,QAAQ,UAAQ,CAAA,CAAA;SAC9D,WAIO,KAAA,QAAA,QAAA,EAAA,QAAA,EAAA,WAAA,EAHL,YAEsB,wBADf,QAAA,KAAI,EAAA,EACT,OAAM,aAAW,CAAA,EAAA,CAAA,CAAA,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;KAIf,QAAA,UAAA,WAAA,EADR,mBAIO,QAAA;;MAFJ,OAAK,eAAA,EAAA,WAAe,QAAA,QAAQ,UAAQ,CAAA;SACrC,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA,IAEV,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA;KAEP,QAAA,QAAQ,YAAA,WAAA,EADhB,mBAMM,OANN,YAMM,CAHJ,YAEY,MAAA,sBAAA,EAAA;MADT,OAAK,eAAE,MAAA,gBAAe,CAAA,EAAA,MAAG,QAAA,MAAI,CAAA,CAAA;MAC7B,QAAA,QAAA"}
+{"version":3,"file":"ScalarButton.vue.script.js","names":["$slots"],"sources":["../../../src/components/ScalarButton/ScalarButton.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Button Component\n *\n * Provides a styled button, if you are looking for\n * an icon only button, use ScalarIconButton instead,\n * it's a helpful wrapper around this component\n *\n * @example\n * <ScalarButton>\n *   <!-- Button label -->\n * </ScalarButton>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { cva, useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport { ScalarLoading } from '../ScalarLoading'\nimport { BUTTON_VARIANT_STYLES } from './constants'\nimport type { ButtonSize, ClassList, ScalarButtonProps } from './types'\n\nconst {\n  is = 'button',\n  size = 'md',\n  variant = 'solid',\n} = defineProps<ScalarButtonProps>()\n\n/** Variant styles for the button (wrapper) */\nconst buttonVariants = cva({\n  base: 'scalar-button flex cursor-pointer items-center justify-center rounded font-medium -outline-offset-1',\n  variants: {\n    disabled: { true: 'bg-b-2 text-color-3 shadow-none' },\n    size: {\n      xs: 'px-2 py-1 text-xs/4',\n      sm: 'px-3.5 py-2 text-sm/4',\n      md: 'px-5 py-3 text-sm/4',\n    } satisfies Record<ButtonSize, ClassList>,\n    variant: BUTTON_VARIANT_STYLES,\n  },\n  compoundVariants: [\n    {\n      disabled: true,\n      variant: ['solid', 'outlined', 'ghost', 'gradient', 'danger'],\n      class:\n        'bg-b-2 text-c-3 shadow-none hover:bg-b-[_] cursor-not-allowed active:bg-b-[_] hover:text-c-[_] active:text-c-[_]',\n    },\n    {\n      disabled: true,\n      variant: ['gradient'],\n      class:\n        'to-b-1.5 bg-linear-to-b hover:bg-linear-to-b dark:hover:bg-linear-to-t',\n    },\n  ],\n})\n\n/** Variant styles for the button icon */\nconst iconVariants = cva({\n  base: 'shrink-0',\n  variants: {\n    size: {\n      xs: 'size-2.75 -ml-0.25 mr-1',\n      sm: 'size-3.5 -ml-0.25 mr-1',\n      md: 'size-3.5 -ml-0.5 mr-1.5',\n    } satisfies Record<ButtonSize, ClassList>,\n  },\n})\n\n/** Variant styles for the loading icon */\nconst loadingVariants = cva({\n  variants: {\n    size: {\n      xs: 'size-4',\n      sm: 'size-5',\n      md: 'size-6',\n    } satisfies Record<ButtonSize, ClassList>,\n  },\n})\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    :aria-disabled=\"disabled || undefined\"\n    :type=\"is === 'button' ? 'button' : undefined\"\n    v-bind=\"\n      cx(buttonVariants({ disabled, size, variant }), {\n        relative: loader?.isActive,\n      })\n    \">\n    <div\n      v-if=\"$slots.icon || icon\"\n      :class=\"[iconVariants({ size }), { invisible: loader?.isActive }]\">\n      <slot name=\"icon\">\n        <component\n          :is=\"icon\"\n          class=\"size-full\" />\n      </slot>\n    </div>\n    <span\n      v-if=\"loader\"\n      :class=\"{ invisible: loader?.isActive }\">\n      <slot />\n    </span>\n    <slot v-else />\n    <div\n      v-if=\"loader?.isActive\"\n      class=\"centered\">\n      <ScalarLoading\n        :class=\"loadingVariants({ size })\"\n        :loader />\n    </div>\n  </component>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EA6BA,MAAM,iBAAiB,IAAI;GACzB,MAAM;GACN,UAAU;IACR,UAAU,EAAE,MAAM,kCAAkC;IACpD,MAAM;KACJ,IAAI;KACJ,IAAI;KACJ,IAAI;IACN;IACA,SAAS;GACX;GACA,kBAAkB,CAChB;IACE,UAAU;IACV,SAAS;KAAC;KAAS;KAAY;KAAS;KAAY;IAAQ;IAC5D,OACE;GACJ,GACA;IACE,UAAU;IACV,SAAS,CAAC,UAAU;IACpB,OACE;GACJ,CACF;EACF,CAAC;;EAGD,MAAM,eAAe,IAAI;GACvB,MAAM;GACN,UAAU,EACR,MAAM;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;GACN,EACF;EACF,CAAC;;EAGD,MAAM,kBAAkB,IAAI,EAC1B,UAAU,EACR,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,EACF,EACF,CAAC;EAGD,MAAM,EAAE,OAAO,UAAU;;uBAGvB,YA+BY,wBA9BL,QAAA,EAAE,GADT,WA+BY;IA7BT,iBAAe,QAAA,YAAY,KAAA;IAC3B,MAAM,QAAA,OAAE,WAAA,WAA2B,KAAA;MACrB,MAAA,EAAA,CAAE,CAAC,MAAA,cAAA,CAAc,CAAA;IAAA,UAAG,QAAA;IAAQ,MAAE,QAAA;IAAI,SAAE,QAAA;GAAO,CAAA,GAAA,EAAA,UAAyB,QAAA,QAAQ,SAAA,CAAA,CAAA,GAAA;2BAarF;KAPEA,KAAAA,OAAO,QAAQ,QAAA,QAAA,UAAA,GADvB,mBAQM,OAAA;;MANH,OAAK,eAAA,CAAG,MAAA,YAAA,CAAY,CAAA,EAAA,MAAG,QAAA,KAAI,CAAA,GAAA,EAAA,WAAkB,QAAA,QAAQ,SAAQ,CAAA,CAAA;SAC9D,WAIO,KAAA,QAAA,QAAA,CAAA,SAAA,EAAA,UAAA,GAHL,YAEsB,wBADf,QAAA,IAAI,GAAA,EACT,OAAM,YAAW,CAAA,EAAA,CAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;KAIf,QAAA,UAAA,UAAA,GADR,mBAIO,QAAA;;MAFJ,OAAK,eAAA,EAAA,WAAe,QAAA,QAAQ,SAAQ,CAAA;SACrC,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,KAEV,WAAe,KAAA,QAAA,WAAA,CAAA,GAAA,KAAA,GAAA,KAAA,GAAA,CAAA;KAEP,QAAA,QAAQ,YAAA,UAAA,GADhB,mBAMM,OANN,YAMM,CAHJ,YAEY,MAAA,qBAAA,GAAA;MADT,OAAK,eAAE,MAAA,eAAA,CAAe,CAAA,EAAA,MAAG,QAAA,KAAI,CAAA,CAAA;MAC7B,QAAA,QAAA"}

package/dist/components/ScalarButton/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","names":[],"sources":["../../../src/components/ScalarButton/constants.ts"],"sourcesContent":["import type { ButtonVariant, ClassList } from './types'\n\n/** Styles for the different button variants */\nexport const BUTTON_VARIANT_STYLES = {\n  solid: [\n    'scalar-button-solid',\n    'bg-b-btn text-c-btn focus-visible:border-c-btn active:bg-b-btn hover:bg-h-btn outline-offset-1',\n  ],\n  outlined: ['scalar-button-outlined', 'active:bg-btn-1 shadow-border bg-b-1 text-c-1 hover:bg-b-2'],\n  ghost: ['scalar-button-ghost', 'bg-transparent text-c-2 active:text-c-1 hover:text-c-1'],\n  gradient: [\n    'scalar-button-gradient',\n    'shadow-border bg-b-1.5 bg-linear-to-b from-b-1 to-b-2 hover:bg-linear-to-t',\n    // in dark mode we want to reverse the gradient direction\n    'dark:bg-linear-to-t dark:hover:bg-linear-to-b',\n  ],\n  danger: ['scalar-button-danger', 'bg-c-danger text-white active:brightness-90 hover:brightness-90'],\n} as const satisfies Record<ButtonVariant, ClassList>\n"],"mappings":";;AAGA,IAAa,wBAAwB;CACnC,OAAO,CACL,uBACA,iGACD;CACD,UAAU,CAAC,0BAA0B,6DAA6D;CAClG,OAAO,CAAC,uBAAuB,yDAAyD;CACxF,UAAU;EACR;EACA;EAEA;EACD;CACD,QAAQ,CAAC,wBAAwB,kEAAkE;CACpG"}
+{"version":3,"file":"constants.js","names":[],"sources":["../../../src/components/ScalarButton/constants.ts"],"sourcesContent":["import type { ButtonVariant, ClassList } from './types'\n\n/** Styles for the different button variants */\nexport const BUTTON_VARIANT_STYLES = {\n  solid: [\n    'scalar-button-solid',\n    'bg-b-btn text-c-btn focus-visible:border-c-btn active:bg-b-btn hover:bg-h-btn outline-offset-1',\n  ],\n  outlined: ['scalar-button-outlined', 'active:bg-btn-1 shadow-border bg-b-1 text-c-1 hover:bg-b-2'],\n  ghost: ['scalar-button-ghost', 'bg-transparent text-c-2 active:text-c-1 hover:text-c-1'],\n  gradient: [\n    'scalar-button-gradient',\n    'shadow-border bg-b-1.5 bg-linear-to-b from-b-1 to-b-2 hover:bg-linear-to-t',\n    // in dark mode we want to reverse the gradient direction\n    'dark:bg-linear-to-t dark:hover:bg-linear-to-b',\n  ],\n  danger: ['scalar-button-danger', 'bg-c-danger text-white active:brightness-90 hover:brightness-90'],\n} as const satisfies Record<ButtonVariant, ClassList>\n"],"mappings":";;AAGA,IAAa,wBAAwB;CACnC,OAAO,CACL,uBACA,gGACF;CACA,UAAU,CAAC,0BAA0B,4DAA4D;CACjG,OAAO,CAAC,uBAAuB,wDAAwD;CACvF,UAAU;EACR;EACA;EAEA;CACF;CACA,QAAQ,CAAC,wBAAwB,iEAAiE;AACpG"}

package/dist/components/ScalarCard/ScalarCard.vue.script.js

@@ -1,7 +1,7 @@
 import { useCardRegion } from "./useCardHeading.js";
 import { useBindCx } from "@scalar/use-hooks/useBindCx";
 import { computed, createElementBlock, defineComponent, mergeProps, openBlock, renderSlot, unref } from "vue";
-var ScalarCard_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCard_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarCard",
 	props: { label: {} },

package/dist/components/ScalarCard/ScalarCard.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCard.vue.script.js","names":[],"sources":["../../../src/components/ScalarCard/ScalarCard.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar card component\n *\n * Creates an aria region using the nearest ScalarCardHeader as the label\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/region_role\n *\n * @example\n * <ScalarCard>\n *   <ScalarCardHeader>Header</ScalarCardHeader>\n *   <ScalarCardSection>Content</ScalarCardSection>\n *   <ScalarCardFooter>Footer</ScalarCardFooter>\n * </ScalarCard>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { computed } from 'vue'\n\nimport { useCardRegion } from './useCardHeading'\n\nconst { label } = defineProps<{\n  /** The a11y label for the card region */\n  label?: string\n}>()\n\n// Get the id for the nearest ScalarCardHeader if it exists\nconst { id } = useCardRegion()\n\nconst labelAttrs = computed(() => {\n  if (label) {\n    // If a label is provided, use it\n    return { 'aria-label': label }\n  }\n  if (id.value) {\n    // If no label is provided, use the heading id\n    return { 'aria-labelledby': id.value }\n  }\n  // If no label or heading id is provided, don't add any aria attributes\n  return {}\n})\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    role=\"group\"\n    v-bind=\"{\n      ...labelAttrs,\n      ...cx('scalar-card bg-b-2 flex flex-col divide-y rounded-xl border'),\n    }\">\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;;;;;;EA6BA,MAAM,EAAE,OAAO,eAAc;EAE7B,MAAM,aAAa,eAAe;AAChC,OAAI,QAAA,MAEF,QAAO,EAAE,cAAc,QAAA,OAAM;AAE/B,OAAI,GAAG,MAEL,QAAO,EAAE,mBAAmB,GAAG,OAAM;AAGvC,UAAO,EAAC;IACT;EAGD,MAAM,EAAE,OAAO,WAAU;;uBAGvB,mBAOM,OAPN,WAOM,EANJ,MAAK,SAAO,EAAA;OACO,WAAA;OAAqB,MAAA,GAAE,CAAA,8DAAA;QAI1C,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,GAAA"}
+{"version":3,"file":"ScalarCard.vue.script.js","names":[],"sources":["../../../src/components/ScalarCard/ScalarCard.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar card component\n *\n * Creates an aria region using the nearest ScalarCardHeader as the label\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/region_role\n *\n * @example\n * <ScalarCard>\n *   <ScalarCardHeader>Header</ScalarCardHeader>\n *   <ScalarCardSection>Content</ScalarCardSection>\n *   <ScalarCardFooter>Footer</ScalarCardFooter>\n * </ScalarCard>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { computed } from 'vue'\n\nimport { useCardRegion } from './useCardHeading'\n\nconst { label } = defineProps<{\n  /** The a11y label for the card region */\n  label?: string\n}>()\n\n// Get the id for the nearest ScalarCardHeader if it exists\nconst { id } = useCardRegion()\n\nconst labelAttrs = computed(() => {\n  if (label) {\n    // If a label is provided, use it\n    return { 'aria-label': label }\n  }\n  if (id.value) {\n    // If no label is provided, use the heading id\n    return { 'aria-labelledby': id.value }\n  }\n  // If no label or heading id is provided, don't add any aria attributes\n  return {}\n})\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    role=\"group\"\n    v-bind=\"{\n      ...labelAttrs,\n      ...cx('scalar-card bg-b-2 flex flex-col divide-y rounded-xl border'),\n    }\">\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;;;;;;EA6BA,MAAM,EAAE,OAAO,cAAc;EAE7B,MAAM,aAAa,eAAe;GAChC,IAAI,QAAA,OAEF,OAAO,EAAE,cAAc,QAAA,MAAM;GAE/B,IAAI,GAAG,OAEL,OAAO,EAAE,mBAAmB,GAAG,MAAM;GAGvC,OAAO,CAAC;EACV,CAAC;EAGD,MAAM,EAAE,OAAO,UAAU;;uBAGvB,mBAOM,OAPN,WAOM,EANJ,MAAK,QAAO,GAAA;OACO,WAAA;OAAqB,MAAA,EAAA,CAAE,CAAA,6DAAA;QAI1C,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,EAAA"}

package/dist/components/ScalarCard/ScalarCardFooter.vue.script.js

@@ -1,7 +1,7 @@
 import ScalarCardSection_default from "./ScalarCardSection.vue.js";
 import { useBindCx } from "@scalar/use-hooks/useBindCx";
 import { createBlock, defineComponent, guardReactiveProps, normalizeProps, openBlock, renderSlot, unref, withCtx } from "vue";
-var ScalarCardFooter_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCardFooter_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarCardFooter",
 	setup(__props) {

package/dist/components/ScalarCard/ScalarCardFooter.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCardFooter.vue.script.js","names":[],"sources":["../../../src/components/ScalarCard/ScalarCardFooter.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar card footer component\n *\n * @example\n * <ScalarCard>\n *   ...\n *   <ScalarCardFooter>Footer</ScalarCardFooter>\n * </ScalarCard>\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport ScalarCardSection from './ScalarCardSection.vue'\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <ScalarCardSection v-bind=\"cx('scalar-card-footer')\">\n    <slot />\n  </ScalarCardSection>\n</template>\n"],"mappings":";;;;;;;EAkBA,MAAM,EAAE,OAAO,WAAU;;uBAGvB,YAEoB,2BAAA,eAAA,mBAFO,MAAA,GAAE,CAAA,qBAAA,CAAA,CAAA,EAAA;2BACnB,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ScalarCardFooter.vue.script.js","names":[],"sources":["../../../src/components/ScalarCard/ScalarCardFooter.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar card footer component\n *\n * @example\n * <ScalarCard>\n *   ...\n *   <ScalarCardFooter>Footer</ScalarCardFooter>\n * </ScalarCard>\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport ScalarCardSection from './ScalarCardSection.vue'\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <ScalarCardSection v-bind=\"cx('scalar-card-footer')\">\n    <slot />\n  </ScalarCardSection>\n</template>\n"],"mappings":";;;;;;;EAkBA,MAAM,EAAE,OAAO,UAAU;;uBAGvB,YAEoB,2BAAA,eAAA,mBAFO,MAAA,EAAA,CAAE,CAAA,oBAAA,CAAA,CAAA,GAAA;2BACnB,CAAR,WAAQ,KAAA,QAAA,SAAA,CAAA,CAAA"}

package/dist/components/ScalarCard/ScalarCardHeader.vue.script.js

@@ -8,7 +8,7 @@ var _hoisted_2 = {
 	key: 0,
 	class: "flex"
 };
-var ScalarCardHeader_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCardHeader_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarCardHeader",
 	setup(__props) {

package/dist/components/ScalarCard/ScalarCardHeader.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCardHeader.vue.script.js","names":["$slots"],"sources":["../../../src/components/ScalarCard/ScalarCardHeader.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar card header component\n *\n * Will automatically be used as the aria-labelledby for the parent ScalarCard component\n *\n * @example\n * <ScalarCard>\n *   <ScalarCardHeader>Header</ScalarCardHeader>\n *   ...\n * </ScalarCard>\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { useId } from 'vue'\n\nimport ScalarCardSection from './ScalarCardSection.vue'\nimport { useCardHeading } from './useCardHeading'\n\n/**\n * Scalar Card Header - Header section for cards with automatic accessibility setup\n */\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n\n// Get a unique id for the heading\nconst id = useId()\n\n// Set the heading id for the card\nuseCardHeading(id)\n</script>\n<template>\n  <ScalarCardSection\n    v-bind=\"\n      cx(\n        'scalar-card-header leading-[22px] font-medium py-[6.75px] px-3 shrink-0',\n      )\n    \">\n    <div\n      :id=\"id\"\n      class=\"scalar-card-header-title min-w-0 flex-1 truncate\">\n      <slot />\n    </div>\n    <div\n      v-if=\"$slots.actions\"\n      class=\"flex\">\n      <slot name=\"actions\" />\n    </div>\n  </ScalarCardSection>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAyBA,MAAM,EAAE,OAAO,WAAU;EAGzB,MAAM,KAAK,OAAM;AAGjB,iBAAe,GAAE;;uBAGf,YAgBoB,2BAAA,eAAA,mBAfH,MAAA,GAAE,CAAA,0EAAA,CAAA,CAAA,EAAA;2BASX,CAJN,mBAIM,OAAA;KAHH,IAAI,MAAA,GAAE;KACP,OAAM;QACN,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,GAAA,WAAA,EAGFA,KAAAA,OAAO,WAAA,WAAA,EADf,mBAIM,OAJN,YAIM,CADJ,WAAuB,KAAA,QAAA,UAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,CAAA,CAAA"}
+{"version":3,"file":"ScalarCardHeader.vue.script.js","names":["$slots"],"sources":["../../../src/components/ScalarCard/ScalarCardHeader.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar card header component\n *\n * Will automatically be used as the aria-labelledby for the parent ScalarCard component\n *\n * @example\n * <ScalarCard>\n *   <ScalarCardHeader>Header</ScalarCardHeader>\n *   ...\n * </ScalarCard>\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { useId } from 'vue'\n\nimport ScalarCardSection from './ScalarCardSection.vue'\nimport { useCardHeading } from './useCardHeading'\n\n/**\n * Scalar Card Header - Header section for cards with automatic accessibility setup\n */\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n\n// Get a unique id for the heading\nconst id = useId()\n\n// Set the heading id for the card\nuseCardHeading(id)\n</script>\n<template>\n  <ScalarCardSection\n    v-bind=\"\n      cx(\n        'scalar-card-header leading-[22px] font-medium py-[6.75px] px-3 shrink-0',\n      )\n    \">\n    <div\n      :id=\"id\"\n      class=\"scalar-card-header-title min-w-0 flex-1 truncate\">\n      <slot />\n    </div>\n    <div\n      v-if=\"$slots.actions\"\n      class=\"flex\">\n      <slot name=\"actions\" />\n    </div>\n  </ScalarCardSection>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAyBA,MAAM,EAAE,OAAO,UAAU;EAGzB,MAAM,KAAK,MAAM;EAGjB,eAAe,EAAE;;uBAGf,YAgBoB,2BAAA,eAAA,mBAfH,MAAA,EAAA,CAAE,CAAA,yEAAA,CAAA,CAAA,GAAA;2BASX,CAJN,mBAIM,OAAA;KAHH,IAAI,MAAA,EAAA;KACL,OAAM;QACN,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,GAAA,UAAA,GAGFA,KAAAA,OAAO,WAAA,UAAA,GADf,mBAIM,OAJN,YAIM,CADJ,WAAuB,KAAA,QAAA,SAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,CAAA"}

package/dist/components/ScalarCard/ScalarCardSection.vue.script.js

@@ -1,6 +1,6 @@
 import { useBindCx } from "@scalar/use-hooks/useBindCx";
 import { createElementBlock, defineComponent, guardReactiveProps, normalizeProps, openBlock, renderSlot, unref } from "vue";
-var ScalarCardSection_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCardSection_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarCardSection",
 	setup(__props) {

package/dist/components/ScalarCard/ScalarCardSection.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCardSection.vue.script.js","names":[],"sources":["../../../src/components/ScalarCard/ScalarCardSection.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar card section component\n *\n * A generic section of a ScalarCard component, provides the base for ScalarCardHeader and ScalarCardFooter\n *\n * @example\n * <ScalarCard>\n *   ...\n *   <ScalarCardSection>Content</ScalarCardSection>\n *   ...\n * </ScalarCard>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    v-bind=\"\n      cx(\n        'scalar-card-content flex overflow-auto first:rounded-t-[inherit] last:rounded-b-[inherit]',\n      )\n    \">\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;;;;EAmBA,MAAM,EAAE,OAAO,WAAU;;uBAGvB,mBAOM,OAAA,eAAA,mBANW,MAAA,GAAE,CAAA,4FAAA,CAAA,CAAA,EAAA,CAKjB,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,GAAA"}
+{"version":3,"file":"ScalarCardSection.vue.script.js","names":[],"sources":["../../../src/components/ScalarCard/ScalarCardSection.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar card section component\n *\n * A generic section of a ScalarCard component, provides the base for ScalarCardHeader and ScalarCardFooter\n *\n * @example\n * <ScalarCard>\n *   ...\n *   <ScalarCardSection>Content</ScalarCardSection>\n *   ...\n * </ScalarCard>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    v-bind=\"\n      cx(\n        'scalar-card-content flex overflow-auto first:rounded-t-[inherit] last:rounded-b-[inherit]',\n      )\n    \">\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;;;;EAmBA,MAAM,EAAE,OAAO,UAAU;;uBAGvB,mBAOM,OAAA,eAAA,mBANW,MAAA,EAAA,CAAE,CAAA,2FAAA,CAAA,CAAA,GAAA,CAKjB,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,EAAA"}

package/dist/components/ScalarCard/useCardHeading.js

@@ -21,7 +21,9 @@ var useCardHeading = (id) => {
 var useCardRegion = () => {
 	const id = ref();
 	provide(CARD_Heading_SYMBOL, id);
-	return { id };
+	return { 
+	/** The region heading id ref */
+id };
 };
 //#endregion
 export { useCardHeading, useCardRegion };

package/dist/components/ScalarCard/useCardHeading.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCardHeading.js","names":[],"sources":["../../../src/components/ScalarCard/useCardHeading.ts"],"sourcesContent":["import { type InjectionKey, type Ref, inject, provide, ref } from 'vue'\n\n/**\n * Tracks the region heading id for card accessibility\n */\nconst CARD_Heading_SYMBOL = Symbol() as InjectionKey<Ref<string | undefined>>\n\n/**\n * Set the region heading id for a ScalarCardHeader component.\n *\n * This should be called from ScalarCardHeader components.\n */\nexport const useCardHeading = (id: string) => {\n  const region = inject(CARD_Heading_SYMBOL, undefined)\n  if (region) {\n    region.value = id\n  }\n}\n\n/**\n * Get the region heading id if set.\n *\n * This should be called from ScalarCard components.\n */\nexport const useCardRegion = () => {\n  // Create a new ref for any child nested items to update\n  const id = ref<string>()\n  provide(CARD_Heading_SYMBOL, id)\n\n  return {\n    /** The region heading id ref */\n    id,\n  }\n}\n"],"mappings":";;;;;AAKA,IAAM,sBAAsB,QAAQ;;;;;;AAOpC,IAAa,kBAAkB,OAAe;CAC5C,MAAM,SAAS,OAAO,qBAAqB,KAAA,EAAU;AACrD,KAAI,OACF,QAAO,QAAQ;;;;;;;AASnB,IAAa,sBAAsB;CAEjC,MAAM,KAAK,KAAa;AACxB,SAAQ,qBAAqB,GAAG;AAEhC,QAAO,EAEL,IACD"}
+{"version":3,"file":"useCardHeading.js","names":[],"sources":["../../../src/components/ScalarCard/useCardHeading.ts"],"sourcesContent":["import { type InjectionKey, type Ref, inject, provide, ref } from 'vue'\n\n/**\n * Tracks the region heading id for card accessibility\n */\nconst CARD_Heading_SYMBOL = Symbol() as InjectionKey<Ref<string | undefined>>\n\n/**\n * Set the region heading id for a ScalarCardHeader component.\n *\n * This should be called from ScalarCardHeader components.\n */\nexport const useCardHeading = (id: string) => {\n  const region = inject(CARD_Heading_SYMBOL, undefined)\n  if (region) {\n    region.value = id\n  }\n}\n\n/**\n * Get the region heading id if set.\n *\n * This should be called from ScalarCard components.\n */\nexport const useCardRegion = () => {\n  // Create a new ref for any child nested items to update\n  const id = ref<string>()\n  provide(CARD_Heading_SYMBOL, id)\n\n  return {\n    /** The region heading id ref */\n    id,\n  }\n}\n"],"mappings":";;;;;AAKA,IAAM,sBAAsB,OAAO;;;;;;AAOnC,IAAa,kBAAkB,OAAe;CAC5C,MAAM,SAAS,OAAO,qBAAqB,KAAA,CAAS;CACpD,IAAI,QACF,OAAO,QAAQ;AAEnB;;;;;;AAOA,IAAa,sBAAsB;CAEjC,MAAM,KAAK,IAAY;CACvB,QAAQ,qBAAqB,EAAE;CAE/B,OAAO;;AAEL,GACF;AACF"}

package/dist/components/ScalarCheckboxInput/ScalarCheckbox.vue.script.js

@@ -1,6 +1,6 @@
 import { createBlock, createCommentVNode, createElementBlock, defineComponent, normalizeClass, openBlock, unref } from "vue";
 import { ScalarIconCheck, ScalarIconMinus } from "@scalar/icons";
-var ScalarCheckbox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCheckbox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "ScalarCheckbox",
 	props: {
 		selected: { type: Boolean },

package/dist/components/ScalarCheckboxInput/ScalarCheckbox.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCheckbox.vue.script.js","names":[],"sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckbox.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar checkbox base component\n *\n * Provides a styled visual checkbox but not the underlying input element.\n *\n * This is used internally by the ScalarCheckboxInput component.\n *\n * If you're looking to create an interactive checkbox you\n * probably want the ScalarCheckboxInput component.\n *\n * @example\n * <ScalarCheckbox :selected=\"state\" type=\"radio\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { ScalarIconCheck, ScalarIconMinus } from '@scalar/icons'\n\nimport type { ScalarCheckboxType } from './types'\n\nconst props = withDefaults(\n  defineProps<{\n    selected?: boolean\n    /** Checkbox only: shows a minus icon when true and `selected` is false (partial selection). */\n    indeterminate?: boolean\n    type?: ScalarCheckboxType\n  }>(),\n  {\n    type: 'checkbox',\n    indeterminate: false,\n  },\n)\n</script>\n<template>\n  <div\n    class=\"flex size-4 items-center justify-center p-0.75\"\n    :class=\"[\n      props.selected\n        ? 'bg-c-accent text-b-1'\n        : props.indeterminate && props.type === 'checkbox'\n          ? 'bg-c-accent text-b-1'\n          : 'text-transparent shadow-border',\n      props.type === 'checkbox' ? 'rounded' : 'rounded-full',\n    ]\">\n    <ScalarIconCheck\n      v-if=\"props.selected\"\n      class=\"size-3\"\n      weight=\"bold\" />\n    <ScalarIconMinus\n      v-else-if=\"props.indeterminate && props.type === 'checkbox'\"\n      aria-hidden=\"true\"\n      class=\"size-3\"\n      weight=\"bold\" />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;EAqBA,MAAM,QAAQ;;uBAcZ,mBAmBM,OAAA,EAlBJ,OAAK,eAAA,CAAC,kDAAgD,CACtC,MAAM,WAAA,yBAAoD,MAAM,iBAAiB,MAAM,SAAI,aAAA,yBAAA,kCAAuG,MAAM,SAAI,aAAA,YAAA,eAAA,CAAA,CAAA,EAAA,EAAA,CASpN,MAAM,YAAA,WAAA,EADd,YAGkB,MAAA,gBAAA,EAAA;;IADhB,OAAM;IACN,QAAO;SAEI,MAAM,iBAAiB,MAAM,SAAI,cAAA,WAAA,EAD9C,YAIkB,MAAA,gBAAA,EAAA;;IAFhB,eAAY;IACZ,OAAM;IACN,QAAO"}
+{"version":3,"file":"ScalarCheckbox.vue.script.js","names":[],"sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckbox.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar checkbox base component\n *\n * Provides a styled visual checkbox but not the underlying input element.\n *\n * This is used internally by the ScalarCheckboxInput component.\n *\n * If you're looking to create an interactive checkbox you\n * probably want the ScalarCheckboxInput component.\n *\n * @example\n * <ScalarCheckbox :selected=\"state\" type=\"radio\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { ScalarIconCheck, ScalarIconMinus } from '@scalar/icons'\n\nimport type { ScalarCheckboxType } from './types'\n\nconst props = withDefaults(\n  defineProps<{\n    selected?: boolean\n    /** Checkbox only: shows a minus icon when true and `selected` is false (partial selection). */\n    indeterminate?: boolean\n    type?: ScalarCheckboxType\n  }>(),\n  {\n    type: 'checkbox',\n    indeterminate: false,\n  },\n)\n</script>\n<template>\n  <div\n    class=\"flex size-4 items-center justify-center p-0.75\"\n    :class=\"[\n      props.selected\n        ? 'bg-c-accent text-b-1'\n        : props.indeterminate && props.type === 'checkbox'\n          ? 'bg-c-accent text-b-1'\n          : 'text-transparent shadow-border',\n      props.type === 'checkbox' ? 'rounded' : 'rounded-full',\n    ]\">\n    <ScalarIconCheck\n      v-if=\"props.selected\"\n      class=\"size-3\"\n      weight=\"bold\" />\n    <ScalarIconMinus\n      v-else-if=\"props.indeterminate && props.type === 'checkbox'\"\n      aria-hidden=\"true\"\n      class=\"size-3\"\n      weight=\"bold\" />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;EAqBA,MAAM,QAAQ;;uBAcZ,mBAmBM,OAAA,EAlBJ,OAAK,eAAA,CAAC,kDAAgD,CACtC,MAAM,WAAA,yBAAoD,MAAM,iBAAiB,MAAM,SAAI,aAAA,yBAAA,kCAAuG,MAAM,SAAI,aAAA,YAAA,cAAA,CAAA,CAAA,EAAA,GAAA,CASpN,MAAM,YAAA,UAAA,GADd,YAGkB,MAAA,eAAA,GAAA;;IADhB,OAAM;IACN,QAAO;SAEI,MAAM,iBAAiB,MAAM,SAAI,cAAA,UAAA,GAD9C,YAIkB,MAAA,eAAA,GAAA;;IAFhB,eAAY;IACZ,OAAM;IACN,QAAO"}

package/dist/components/ScalarCheckboxInput/ScalarCheckboxGroup.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCheckboxGroup.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxGroup.vue"],"names":[],"mappings":"AAgDA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAGnD;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;cAEN,oBAAoB,EAAE;;iBAcrB,oBAAoB,EAAE;;;;cAdvB,oBAAoB,EAAE;;iBAcrB,oBAAoB,EAAE;;;kFAkF/B,CAAC"}
+{"version":3,"file":"ScalarCheckboxGroup.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxGroup.vue"],"names":[],"mappings":"AAgDA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAGnD;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;cAEN,oBAAoB,EAAE;;iBAcrB,oBAAoB,EAAE;;;;cAdvB,oBAAoB,EAAE;;iBAcrB,oBAAoB,EAAE;;;kFAmF/B,CAAC"}

package/dist/components/ScalarCheckboxInput/ScalarCheckboxGroup.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCheckboxGroup.vue.js","names":[],"sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Checkbox Group component\n *\n * A group of checkbox inputs allowing for multiple selections.\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useId } from 'vue'\n\nimport { ScalarFormInputGroup } from '../ScalarForm'\nimport ScalarCheckboxInput from './ScalarCheckboxInput.vue'\nimport type { ScalarCheckboxOption } from './types'\n\nconst { options = [] } = defineProps<{\n  options?: ScalarCheckboxOption[]\n}>()\n\nconst model = defineModel<ScalarCheckboxOption[]>({ default: [] })\n\nconst name = useId()\n</script>\n<template>\n  <ScalarFormInputGroup>\n    <ScalarCheckboxInput\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      :modelValue=\"model?.some(({ value }) => value === option.value)\"\n      :name\n      :value=\"option.value\"\n      @update:modelValue=\"\n        (checked) =>\n          (model = checked\n            ? [...model, option]\n            : model.filter(({ value }) => value !== option.value))\n      \">\n      {{ option.label }}\n    </ScalarCheckboxInput>\n  </ScalarFormInputGroup>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ScalarCheckboxGroup.vue.js","names":[],"sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Checkbox Group component\n *\n * A group of checkbox inputs allowing for multiple selections.\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useId } from 'vue'\n\nimport { ScalarFormInputGroup } from '../ScalarForm'\nimport ScalarCheckboxInput from './ScalarCheckboxInput.vue'\nimport type { ScalarCheckboxOption } from './types'\n\nconst { options = [] } = defineProps<{\n  options?: ScalarCheckboxOption[]\n}>()\n\nconst model = defineModel<ScalarCheckboxOption[]>({ default: () => [] })\n\nconst name = useId()\n</script>\n<template>\n  <ScalarFormInputGroup>\n    <ScalarCheckboxInput\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      :modelValue=\"model?.some(({ value }) => value === option.value)\"\n      :name\n      :value=\"option.value\"\n      @update:modelValue=\"\n        (checked) =>\n          (model = checked\n            ? [...model, option]\n            : model.filter(({ value }) => value !== option.value))\n      \">\n      {{ option.label }}\n    </ScalarCheckboxInput>\n  </ScalarFormInputGroup>\n</template>\n"],"mappings":""}

package/dist/components/ScalarCheckboxInput/ScalarCheckboxGroup.vue.script.js

@@ -1,10 +1,10 @@
 import ScalarFormInputGroup_default from "../ScalarForm/ScalarFormInputGroup.vue.js";
 import ScalarCheckboxInput_default from "./ScalarCheckboxInput.vue.js";
 import { Fragment, createBlock, createElementBlock, createTextVNode, defineComponent, mergeModels, openBlock, renderList, toDisplayString, unref, useId, useModel, withCtx } from "vue";
-var ScalarCheckboxGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCheckboxGroup_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "ScalarCheckboxGroup",
-	props: /* @__PURE__ */ mergeModels({ options: { default: () => [] } }, {
-		"modelValue": { default: [] },
+	props: /*@__PURE__*/ mergeModels({ options: { default: () => [] } }, {
+		"modelValue": { default: () => [] },
 		"modelModifiers": {}
 	}),
 	emits: ["update:modelValue"],

package/dist/components/ScalarCheckboxInput/ScalarCheckboxGroup.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCheckboxGroup.vue.script.js","names":[],"sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Checkbox Group component\n *\n * A group of checkbox inputs allowing for multiple selections.\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useId } from 'vue'\n\nimport { ScalarFormInputGroup } from '../ScalarForm'\nimport ScalarCheckboxInput from './ScalarCheckboxInput.vue'\nimport type { ScalarCheckboxOption } from './types'\n\nconst { options = [] } = defineProps<{\n  options?: ScalarCheckboxOption[]\n}>()\n\nconst model = defineModel<ScalarCheckboxOption[]>({ default: [] })\n\nconst name = useId()\n</script>\n<template>\n  <ScalarFormInputGroup>\n    <ScalarCheckboxInput\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      :modelValue=\"model?.some(({ value }) => value === option.value)\"\n      :name\n      :value=\"option.value\"\n      @update:modelValue=\"\n        (checked) =>\n          (model = checked\n            ? [...model, option]\n            : model.filter(({ value }) => value !== option.value))\n      \">\n      {{ option.label }}\n    </ScalarCheckboxInput>\n  </ScalarFormInputGroup>\n</template>\n"],"mappings":";;;;;;;;;;;EAmBA,MAAM,QAAQ,SAAmC,SAAA,aAAgB;EAEjE,MAAM,OAAO,OAAM;;uBAGjB,YAeuB,MAAA,6BAAA,EAAA,MAAA;2BAbM,EAAA,UAAA,KAAA,EAD3B,mBAasB,UAAA,MAAA,WAZH,QAAA,UAAV,WAAM;yBADf,YAasB,6BAAA;MAXnB,KAAK,OAAO;MACZ,YAAY,MAAA,OAAO,MAAI,EAAI,YAAY,UAAU,OAAO,MAAK;MAC7D,MAAA,MAAA,KAAI;MACJ,OAAO,OAAO;MACd,wBAA6B,YAAuB,MAAA,QAAQ,UAAA,CAAA,GAA0B,MAAA,OAAO,OAAM,GAAgB,MAAA,MAAM,QAAM,EAAI,YAAY,UAAU,OAAO,MAAK;;6BAMpJ,CAAA,gBAAA,gBAAf,OAAO,MAAK,EAAA,EAAA,CAAA,CAAA"}
+{"version":3,"file":"ScalarCheckboxGroup.vue.script.js","names":[],"sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Checkbox Group component\n *\n * A group of checkbox inputs allowing for multiple selections.\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useId } from 'vue'\n\nimport { ScalarFormInputGroup } from '../ScalarForm'\nimport ScalarCheckboxInput from './ScalarCheckboxInput.vue'\nimport type { ScalarCheckboxOption } from './types'\n\nconst { options = [] } = defineProps<{\n  options?: ScalarCheckboxOption[]\n}>()\n\nconst model = defineModel<ScalarCheckboxOption[]>({ default: () => [] })\n\nconst name = useId()\n</script>\n<template>\n  <ScalarFormInputGroup>\n    <ScalarCheckboxInput\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      :modelValue=\"model?.some(({ value }) => value === option.value)\"\n      :name\n      :value=\"option.value\"\n      @update:modelValue=\"\n        (checked) =>\n          (model = checked\n            ? [...model, option]\n            : model.filter(({ value }) => value !== option.value))\n      \">\n      {{ option.label }}\n    </ScalarCheckboxInput>\n  </ScalarFormInputGroup>\n</template>\n"],"mappings":";;;;;;;;;;;EAmBA,MAAM,QAAQ,SAAmC,SAAA,YAAsB;EAEvE,MAAM,OAAO,MAAM;;uBAGjB,YAeuB,MAAA,4BAAA,GAAA,MAAA;2BAbM,EAAA,UAAA,IAAA,GAD3B,mBAasB,UAAA,MAAA,WAZH,QAAA,UAAV,WAAM;yBADf,YAasB,6BAAA;MAXnB,KAAK,OAAO;MACZ,YAAY,MAAA,OAAO,MAAI,EAAI,YAAY,UAAU,OAAO,KAAK;MAC7D,MAAA,MAAA,IAAA;MACA,OAAO,OAAO;MACd,wBAA6B,YAAuB,MAAA,QAAQ,UAAA,CAAA,GAA0B,MAAA,OAAO,MAAM,IAAgB,MAAA,MAAM,QAAM,EAAI,YAAY,UAAU,OAAO,KAAK;;6BAMpJ,CAAA,gBAAA,gBAAf,OAAO,KAAK,GAAA,CAAA,CAAA,CAAA"}

package/dist/components/ScalarCheckboxInput/ScalarCheckboxInput.vue.script.js

@@ -5,10 +5,10 @@ import { createBlock, createElementVNode, createVNode, defineComponent, mergeMod
 //#region src/components/ScalarCheckboxInput/ScalarCheckboxInput.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "flex-1 text-left min-w-0 truncate" };
 var _hoisted_2 = ["type"];
-var ScalarCheckboxInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCheckboxInput_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarCheckboxInput",
-	props: /* @__PURE__ */ mergeModels({
+	props: /*@__PURE__*/ mergeModels({
 		type: { default: "checkbox" },
 		indeterminate: {
 			type: Boolean,

package/dist/components/ScalarCheckboxInput/ScalarCheckboxInput.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCheckboxInput.vue.script.js","names":[],"sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxInput.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Checkbox Input component\n *\n * A wrapper around the HTML input element for either checkboxes or radio buttons.\n *\n * @example\n *  <ScalarCheckboxInput v-model=\"model\" type=\"checkbox\">\n *    Option Label\n *  </ScalarCheckboxInput>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport { ScalarFormInput } from '../ScalarForm'\nimport ScalarCheckbox from './ScalarCheckbox.vue'\nimport type { ScalarCheckboxType } from './types'\n\nconst props = withDefaults(\n  defineProps<{\n    type?: ScalarCheckboxType\n    /** When true and the control is unchecked, the native checkbox is indeterminate (partial selection). */\n    indeterminate?: boolean\n  }>(),\n  {\n    type: 'checkbox',\n    indeterminate: false,\n  },\n)\n\nconst model = defineModel<boolean>()\n\ndefineOptions({ inheritAttrs: false })\nconst { stylingAttrsCx, otherAttrs } = useBindCx()\n</script>\n<template>\n  <ScalarFormInput\n    is=\"label\"\n    v-bind=\"\n      stylingAttrsCx('cursor-pointer gap-2 hover:bg-b-2', { 'text-c-1': model })\n    \">\n    <ScalarCheckbox\n      class=\"shrink-0\"\n      :indeterminate=\"props.indeterminate && props.type === 'checkbox'\"\n      :selected=\"model\"\n      :type=\"props.type\" />\n    <div class=\"flex-1 text-left min-w-0 truncate\"><slot /></div>\n    <input\n      ref=\"inputEl\"\n      v-model=\"model\"\n      class=\"sr-only\"\n      :type=\"props.type\"\n      v-bind=\"otherAttrs\" />\n  </ScalarFormInput>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAoBA,MAAM,QAAQ;EAYd,MAAM,QAAQ,SAAoB,SAAA,aAAC;EAGnC,MAAM,EAAE,gBAAgB,eAAe,WAAU;;uBAG/C,YAiBkB,MAAA,wBAAA,EAjBlB,WAiBkB,EAhBhB,IAAG,SAAO,EACK,MAAA,eAAc,CAAA,qCAAA,EAAA,YAAoD,MAAA,OAAK,CAAA,CAAA,EAAA;2BAO/D;KAJvB,YAIuB,wBAAA;MAHrB,OAAM;MACL,eAAe,MAAM,iBAAiB,MAAM,SAAI;MAChD,UAAU,MAAA;MACV,MAAM,MAAM;;;;;;KACf,mBAA6D,OAA7D,YAA6D,CAAd,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;oBACvD,mBAKwB,SALxB,WAKwB;MAJtB,KAAI;yEACU,QAAA;MACd,OAAM;MACL,MAAM,MAAM;QACL,MAAA,WAAU,CAAA,EAAA,MAAA,IAAA,WAAA,EAAA,CAAA,CAAA,eAHT,MAAA,MAAK,CAAA,CAAA"}
+{"version":3,"file":"ScalarCheckboxInput.vue.script.js","names":[],"sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxInput.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Checkbox Input component\n *\n * A wrapper around the HTML input element for either checkboxes or radio buttons.\n *\n * @example\n *  <ScalarCheckboxInput v-model=\"model\" type=\"checkbox\">\n *    Option Label\n *  </ScalarCheckboxInput>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport { ScalarFormInput } from '../ScalarForm'\nimport ScalarCheckbox from './ScalarCheckbox.vue'\nimport type { ScalarCheckboxType } from './types'\n\nconst props = withDefaults(\n  defineProps<{\n    type?: ScalarCheckboxType\n    /** When true and the control is unchecked, the native checkbox is indeterminate (partial selection). */\n    indeterminate?: boolean\n  }>(),\n  {\n    type: 'checkbox',\n    indeterminate: false,\n  },\n)\n\nconst model = defineModel<boolean>()\n\ndefineOptions({ inheritAttrs: false })\nconst { stylingAttrsCx, otherAttrs } = useBindCx()\n</script>\n<template>\n  <ScalarFormInput\n    is=\"label\"\n    v-bind=\"\n      stylingAttrsCx('cursor-pointer gap-2 hover:bg-b-2', { 'text-c-1': model })\n    \">\n    <ScalarCheckbox\n      class=\"shrink-0\"\n      :indeterminate=\"props.indeterminate && props.type === 'checkbox'\"\n      :selected=\"model\"\n      :type=\"props.type\" />\n    <div class=\"flex-1 text-left min-w-0 truncate\"><slot /></div>\n    <input\n      ref=\"inputEl\"\n      v-model=\"model\"\n      class=\"sr-only\"\n      :type=\"props.type\"\n      v-bind=\"otherAttrs\" />\n  </ScalarFormInput>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAoBA,MAAM,QAAQ;EAYd,MAAM,QAAQ,SAAoB,SAAA,YAAC;EAGnC,MAAM,EAAE,gBAAgB,eAAe,UAAU;;uBAG/C,YAiBkB,MAAA,uBAAA,GAjBlB,WAiBkB,EAhBhB,IAAG,QAAO,GACK,MAAA,cAAA,CAAc,CAAA,qCAAA,EAAA,YAAoD,MAAA,MAAK,CAAA,CAAA,GAAA;2BAO/D;KAJvB,YAIuB,wBAAA;MAHrB,OAAM;MACL,eAAe,MAAM,iBAAiB,MAAM,SAAI;MAChD,UAAU,MAAA;MACV,MAAM,MAAM;;;;;;KACf,mBAA6D,OAA7D,YAA6D,CAAd,WAAQ,KAAA,QAAA,SAAA,CAAA,CAAA;oBACvD,mBAKwB,SALxB,WAKwB;MAJtB,KAAI;yEACU,QAAA;MACd,OAAM;MACL,MAAM,MAAM;QACL,MAAA,UAAA,CAAU,GAAA,MAAA,IAAA,UAAA,GAAA,CAAA,CAAA,eAHT,MAAA,KAAK,CAAA,CAAA"}

package/dist/components/ScalarCheckboxInput/ScalarCheckboxRadioGroup.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCheckboxRadioGroup.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxRadioGroup.vue"],"names":[],"mappings":"AA4CA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAGnD;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;cAEN,oBAAoB,EAAE;;iBAWrB,oBAAoB;;;;cAXrB,oBAAoB,EAAE;;iBAWrB,oBAAoB;;;kFA+E7B,CAAC"}
+{"version":3,"file":"ScalarCheckboxRadioGroup.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxRadioGroup.vue"],"names":[],"mappings":"AA4CA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAGnD;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;cAEN,oBAAoB,EAAE;;iBAWrB,oBAAoB;;;;cAXrB,oBAAoB,EAAE;;iBAWrB,oBAAoB;;;kFAgF7B,CAAC"}

package/dist/components/ScalarCheckboxInput/ScalarCheckboxRadioGroup.vue.script.js

@@ -1,9 +1,9 @@
 import ScalarFormInputGroup_default from "../ScalarForm/ScalarFormInputGroup.vue.js";
 import ScalarCheckboxInput_default from "./ScalarCheckboxInput.vue.js";
 import { Fragment, createBlock, createElementBlock, createTextVNode, defineComponent, mergeModels, openBlock, renderList, toDisplayString, unref, useId, useModel, withCtx } from "vue";
-var ScalarCheckboxRadioGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCheckboxRadioGroup_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "ScalarCheckboxRadioGroup",
-	props: /* @__PURE__ */ mergeModels({ options: { default: () => [] } }, {
+	props: /*@__PURE__*/ mergeModels({ options: { default: () => [] } }, {
 		"modelValue": {},
 		"modelModifiers": {}
 	}),

package/dist/components/ScalarCheckboxInput/ScalarCheckboxRadioGroup.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCheckboxRadioGroup.vue.script.js","names":[],"sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxRadioGroup.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Checkbox Radio Group component\n *\n * A group of radio inputs allowing for single selection.\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useId } from 'vue'\n\nimport { ScalarFormInputGroup } from '../ScalarForm'\nimport ScalarCheckboxInput from './ScalarCheckboxInput.vue'\nimport type { ScalarCheckboxOption } from './types'\n\nconst { options = [] } = defineProps<{\n  options?: ScalarCheckboxOption[]\n}>()\n\nconst model = defineModel<ScalarCheckboxOption>()\n\nconst name = useId()\n</script>\n<template>\n  <ScalarFormInputGroup>\n    <ScalarCheckboxInput\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      :modelValue=\"model?.value === option.value\"\n      :name\n      type=\"radio\"\n      :value=\"option.value\"\n      @update:modelValue=\"(checked) => (model = checked ? option : undefined)\">\n      {{ option.label }}\n    </ScalarCheckboxInput>\n  </ScalarFormInputGroup>\n</template>\n"],"mappings":";;;;;;;;;;;EAmBA,MAAM,QAAQ,SAAiC,SAAA,aAAC;EAEhD,MAAM,OAAO,OAAM;;uBAGjB,YAWuB,MAAA,6BAAA,EAAA,MAAA;2BATM,EAAA,UAAA,KAAA,EAD3B,mBASsB,UAAA,MAAA,WARH,QAAA,UAAV,WAAM;yBADf,YASsB,6BAAA;MAPnB,KAAK,OAAO;MACZ,YAAY,MAAA,OAAO,UAAU,OAAO;MACpC,MAAA,MAAA,KAAI;MACL,MAAK;MACJ,OAAO,OAAO;MACd,wBAAoB,YAAa,MAAA,QAAQ,UAAU,SAAS,KAAA;;6BAC3C,CAAA,gBAAA,gBAAf,OAAO,MAAK,EAAA,EAAA,CAAA,CAAA"}
+{"version":3,"file":"ScalarCheckboxRadioGroup.vue.script.js","names":[],"sources":["../../../src/components/ScalarCheckboxInput/ScalarCheckboxRadioGroup.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Checkbox Radio Group component\n *\n * A group of radio inputs allowing for single selection.\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useId } from 'vue'\n\nimport { ScalarFormInputGroup } from '../ScalarForm'\nimport ScalarCheckboxInput from './ScalarCheckboxInput.vue'\nimport type { ScalarCheckboxOption } from './types'\n\nconst { options = [] } = defineProps<{\n  options?: ScalarCheckboxOption[]\n}>()\n\nconst model = defineModel<ScalarCheckboxOption>()\n\nconst name = useId()\n</script>\n<template>\n  <ScalarFormInputGroup>\n    <ScalarCheckboxInput\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      :modelValue=\"model?.value === option.value\"\n      :name\n      type=\"radio\"\n      :value=\"option.value\"\n      @update:modelValue=\"(checked) => (model = checked ? option : undefined)\">\n      {{ option.label }}\n    </ScalarCheckboxInput>\n  </ScalarFormInputGroup>\n</template>\n"],"mappings":";;;;;;;;;;;EAmBA,MAAM,QAAQ,SAAiC,SAAA,YAAC;EAEhD,MAAM,OAAO,MAAM;;uBAGjB,YAWuB,MAAA,4BAAA,GAAA,MAAA;2BATM,EAAA,UAAA,IAAA,GAD3B,mBASsB,UAAA,MAAA,WARH,QAAA,UAAV,WAAM;yBADf,YASsB,6BAAA;MAPnB,KAAK,OAAO;MACZ,YAAY,MAAA,OAAO,UAAU,OAAO;MACpC,MAAA,MAAA,IAAA;MACD,MAAK;MACJ,OAAO,OAAO;MACd,wBAAoB,YAAa,MAAA,QAAQ,UAAU,SAAS,KAAA;;6BAC3C,CAAA,gBAAA,gBAAf,OAAO,KAAK,GAAA,CAAA,CAAA,CAAA"}

package/dist/components/ScalarCodeBlock/ScalarCodeBlock.vue.script.js

@@ -10,7 +10,7 @@ var _hoisted_1 = {
 	class: "custom-scroll overflow-x-auto p-2 -outline-offset-2 rounded-[inherit] min-h-0 min-w-0 flex-1"
 };
 var _hoisted_2 = ["id", "innerHTML"];
-var ScalarCodeBlock_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCodeBlock_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarCodeBlock",
 	props: {

package/dist/components/ScalarCodeBlock/ScalarCodeBlock.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCodeBlock.vue.script.js","names":[],"sources":["../../../src/components/ScalarCodeBlock/ScalarCodeBlock.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Code Block component\n *\n * Renders syntax-highlighted code using highlight.js.\n * Supports line numbers, credential masking, and an optional copy button.\n *\n * @example\n * <ScalarCodeBlock content=\"const x = 1\" lang=\"javascript\" />\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nimport ScalarCopyBackdrop from '@/components/ScalarCopy/ScalarCopyBackdrop.vue'\nimport { standardLanguages, syntaxHighlight } from '@scalar/code-highlight'\nimport { prettyPrintJson } from '@scalar/helpers/json/pretty-print-json'\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { computed, useId } from 'vue'\n\nimport { ScalarCodeBlockCopy } from '../ScalarCodeBlock'\nimport type { StandardLanguageKey } from './types'\n\ntype BaseProps = {\n  content?: string | object\n  prettyPrintedContent?: string\n  lang?: StandardLanguageKey | string\n  lineNumbers?: boolean\n  hideCredentials?: string | string[]\n  copy?: 'always' | 'hover' | false\n}\n\n/**\n * Uses highlight.js for syntax highlighting\n *\n * Requires at least one of content or prettyPrintedContent\n */\nconst {\n  lang = 'plaintext',\n  lineNumbers = false,\n  copy = 'hover',\n  content,\n  prettyPrintedContent,\n  hideCredentials,\n} = defineProps<\n  BaseProps &\n    (\n      | {\n          /** Raw unformatted object or string content */\n          content: string | object\n        }\n      | {\n          /**\n           * Pre-pretty printed content string for better performance\n           *\n           * Avoids unnecessary costly re-serialization of large content\n           */\n          prettyPrintedContent: string\n        }\n    )\n>()\n\n/** Base id for the code block */\nconst id = useId()\n\n/** Formatted the content into an indented json string */\nconst prettyContent = computed(\n  () => prettyPrintedContent || prettyPrintJson(content ?? ''),\n)\n\nconst highlightedCode = computed(() => {\n  const html = syntaxHighlight(prettyContent.value, {\n    lang: lang.trim(),\n    languages: standardLanguages,\n    lineNumbers: lineNumbers,\n    maskCredentials: hideCredentials,\n  })\n\n  // Need to remove the wrapping <pre> element so we can use v-html without another wrapper\n  return html.slice(5, -6)\n})\n\n/** Determine if the content is a single line */\nconst isOneLine = computed(() => !prettyContent.value.includes('\\n'))\n\nconst isContentValid = computed(() => {\n  return (\n    prettyContent.value !== null &&\n    prettyContent.value !== 'null' &&\n    prettyContent.value !== '404 Not Found'\n  )\n})\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    v-bind=\"\n      cx(\n        'scalar-code-block group/code-block flex flex-col',\n        'relative bg-b-1 min-h-0 min-w-0 focus-visible:outline',\n      )\n    \">\n    <!-- Inherits the corners so the inset focus ring follows a rounded code block -->\n    <div\n      tabindex=\"0\"\n      class=\"custom-scroll overflow-x-auto p-2 -outline-offset-2 rounded-[inherit] min-h-0 min-w-0 flex-1\">\n      <pre\n        :id=\"id\"\n        class=\"m-0 bg-transparent text-nowrap whitespace-pre w-fit\"\n        v-html=\"highlightedCode\" />\n    </div>\n    <ScalarCodeBlockCopy\n      v-if=\"copy && isContentValid\"\n      class=\"scalar-code-copy absolute\"\n      :class=\"[\n        isOneLine\n          ? 'top-1/2 -translate-y-1/2 m-0 right-1'\n          : 'top-2.5 right-2.5',\n        { 'opacity-100': copy === 'always' },\n      ]\"\n      :content=\"prettyContent\"\n      :showLang=\"!isOneLine\"\n      :lang=\"lang\"\n      :aria-controls=\"id\">\n      <template #backdrop>\n        <ScalarCopyBackdrop\n          class=\"scalar-code-copy-backdrop\"\n          :class=\"[\n            isOneLine\n              ? '-inset-y-0.75 -right-1 group-hocus-within/code-block:-left-0.5 left-3'\n              : '-right-1.5 -top-1',\n          ]\" />\n      </template>\n    </ScalarCodeBlockCopy>\n  </div>\n</template>\n<style>\n@reference '../../style.css';\n@import '@scalar/code-highlight/css/code.css';\n\n/** Disable font ligatures so code renders with literal characters */\n.scalar-code-block pre {\n  font-variant-ligatures: none;\n}\n\n/** Make the copy button label backdrop match the background */\n.scalar-code-block.bg-b-1 .scalar-code-copy-backdrop {\n  @apply bg-b-1;\n}\n.scalar-code-block.bg-b-2 .scalar-code-copy-backdrop {\n  @apply bg-b-2;\n}\n/** Make the copy button one shade darker than the background */\n.scalar-code-block.bg-b-2 .scalar-code-copy {\n  @apply bg-b-3;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8DA,MAAM,KAAK,OAAM;;EAGjB,MAAM,gBAAgB,eACd,QAAA,wBAAwB,gBAAgB,QAAA,WAAW,GAAG,CAC9D;EAEA,MAAM,kBAAkB,eAAe;AASrC,UARa,gBAAgB,cAAc,OAAO;IAChD,MAAM,QAAA,KAAK,MAAM;IACjB,WAAW;IACX,aAAa,QAAA;IACb,iBAAiB,QAAA;IAClB,CAAA,CAGW,MAAM,GAAG,GAAE;IACxB;;EAGD,MAAM,YAAY,eAAe,CAAC,cAAc,MAAM,SAAS,KAAK,CAAA;EAEpE,MAAM,iBAAiB,eAAe;AACpC,UACE,cAAc,UAAU,QACxB,cAAc,UAAU,UACxB,cAAc,UAAU;IAE3B;EAGD,MAAM,EAAE,OAAO,WAAU;;uBAGvB,mBAuCM,OAAA,eAAA,mBAtCW,MAAA,GAAE,CAAA,oDAAA,wDAAA,CAAA,CAAA,EAAA,CAOjB,mBAOM,OAPN,YAOM,CAJJ,mBAG6B,OAAA;IAF1B,IAAI,MAAA,GAAE;IACP,OAAM;IACN,WAAQ,gBAAA;8BAGJ,QAAA,QAAQ,eAAA,SAAA,WAAA,EADhB,YAsBsB,MAAA,4BAAA,EAAA;;IApBpB,OAAK,eAAA,CAAC,6BAA2B,CACf,UAAA,QAAA,yCAAA,qBAAA,EAAA,eAAuH,QAAA,SAAI,UAAA,CAAA,CAAA,CAAA;IAM5I,SAAS,cAAA;IACT,UAAQ,CAAG,UAAA;IACX,MAAM,QAAA;IACN,iBAAe,MAAA,GAAE;;IACP,UAAQ,cAOV,CANP,YAMO,4BAAA,EALL,OAAK,eAAA,CAAC,6BAA2B,CACX,UAAA,QAAA,0EAAA,oBAAA,CAAA,CAAA,EAAA,EAAA,MAAA,GAAA,CAAA,QAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"ScalarCodeBlock.vue.script.js","names":[],"sources":["../../../src/components/ScalarCodeBlock/ScalarCodeBlock.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Code Block component\n *\n * Renders syntax-highlighted code using highlight.js.\n * Supports line numbers, credential masking, and an optional copy button.\n *\n * @example\n * <ScalarCodeBlock content=\"const x = 1\" lang=\"javascript\" />\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nimport ScalarCopyBackdrop from '@/components/ScalarCopy/ScalarCopyBackdrop.vue'\nimport { standardLanguages, syntaxHighlight } from '@scalar/code-highlight'\nimport { prettyPrintJson } from '@scalar/helpers/json/pretty-print-json'\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { computed, useId } from 'vue'\n\nimport { ScalarCodeBlockCopy } from '../ScalarCodeBlock'\nimport type { StandardLanguageKey } from './types'\n\ntype BaseProps = {\n  content?: string | object\n  prettyPrintedContent?: string\n  lang?: StandardLanguageKey | string\n  lineNumbers?: boolean\n  hideCredentials?: string | string[]\n  copy?: 'always' | 'hover' | false\n}\n\n/**\n * Uses highlight.js for syntax highlighting\n *\n * Requires at least one of content or prettyPrintedContent\n */\nconst {\n  lang = 'plaintext',\n  lineNumbers = false,\n  copy = 'hover',\n  content,\n  prettyPrintedContent,\n  hideCredentials,\n} = defineProps<\n  BaseProps &\n    (\n      | {\n          /** Raw unformatted object or string content */\n          content: string | object\n        }\n      | {\n          /**\n           * Pre-pretty printed content string for better performance\n           *\n           * Avoids unnecessary costly re-serialization of large content\n           */\n          prettyPrintedContent: string\n        }\n    )\n>()\n\n/** Base id for the code block */\nconst id = useId()\n\n/** Formatted the content into an indented json string */\nconst prettyContent = computed(\n  () => prettyPrintedContent || prettyPrintJson(content ?? ''),\n)\n\nconst highlightedCode = computed(() => {\n  const html = syntaxHighlight(prettyContent.value, {\n    lang: lang.trim(),\n    languages: standardLanguages,\n    lineNumbers: lineNumbers,\n    maskCredentials: hideCredentials,\n  })\n\n  // Need to remove the wrapping <pre> element so we can use v-html without another wrapper\n  return html.slice(5, -6)\n})\n\n/** Determine if the content is a single line */\nconst isOneLine = computed(() => !prettyContent.value.includes('\\n'))\n\nconst isContentValid = computed(() => {\n  return (\n    prettyContent.value !== null &&\n    prettyContent.value !== 'null' &&\n    prettyContent.value !== '404 Not Found'\n  )\n})\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    v-bind=\"\n      cx(\n        'scalar-code-block group/code-block flex flex-col',\n        'relative bg-b-1 min-h-0 min-w-0 focus-visible:outline',\n      )\n    \">\n    <!-- Inherits the corners so the inset focus ring follows a rounded code block -->\n    <div\n      tabindex=\"0\"\n      class=\"custom-scroll overflow-x-auto p-2 -outline-offset-2 rounded-[inherit] min-h-0 min-w-0 flex-1\">\n      <pre\n        :id=\"id\"\n        class=\"m-0 bg-transparent text-nowrap whitespace-pre w-fit\"\n        v-html=\"highlightedCode\" />\n    </div>\n    <ScalarCodeBlockCopy\n      v-if=\"copy && isContentValid\"\n      class=\"scalar-code-copy absolute\"\n      :class=\"[\n        isOneLine\n          ? 'top-1/2 -translate-y-1/2 m-0 right-1'\n          : 'top-2.5 right-2.5',\n        { 'opacity-100': copy === 'always' },\n      ]\"\n      :content=\"prettyContent\"\n      :showLang=\"!isOneLine\"\n      :lang=\"lang\"\n      :aria-controls=\"id\">\n      <template #backdrop>\n        <ScalarCopyBackdrop\n          class=\"scalar-code-copy-backdrop\"\n          :class=\"[\n            isOneLine\n              ? '-inset-y-0.75 -right-1 group-hocus-within/code-block:-left-0.5 left-3'\n              : '-right-1.5 -top-1',\n          ]\" />\n      </template>\n    </ScalarCodeBlockCopy>\n  </div>\n</template>\n<style>\n@reference '../../style.css';\n@import '@scalar/code-highlight/css/code.css';\n\n/** Disable font ligatures so code renders with literal characters */\n.scalar-code-block pre {\n  font-variant-ligatures: none;\n}\n\n/** Make the copy button label backdrop match the background */\n.scalar-code-block.bg-b-1 .scalar-code-copy-backdrop {\n  @apply bg-b-1;\n}\n.scalar-code-block.bg-b-2 .scalar-code-copy-backdrop {\n  @apply bg-b-2;\n}\n/** Make the copy button one shade darker than the background */\n.scalar-code-block.bg-b-2 .scalar-code-copy {\n  @apply bg-b-3;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8DA,MAAM,KAAK,MAAM;;EAGjB,MAAM,gBAAgB,eACd,QAAA,wBAAwB,gBAAgB,QAAA,WAAW,EAAE,CAC7D;EAEA,MAAM,kBAAkB,eAAe;GASrC,OARa,gBAAgB,cAAc,OAAO;IAChD,MAAM,QAAA,KAAK,KAAK;IAChB,WAAW;IACX,aAAa,QAAA;IACb,iBAAiB,QAAA;GACnB,CAGO,CAAA,CAAK,MAAM,GAAG,EAAE;EACzB,CAAC;;EAGD,MAAM,YAAY,eAAe,CAAC,cAAc,MAAM,SAAS,IAAI,CAAC;EAEpE,MAAM,iBAAiB,eAAe;GACpC,OACE,cAAc,UAAU,QACxB,cAAc,UAAU,UACxB,cAAc,UAAU;EAE5B,CAAC;EAGD,MAAM,EAAE,OAAO,UAAU;;uBAGvB,mBAuCM,OAAA,eAAA,mBAtCW,MAAA,EAAA,CAAE,CAAA,oDAAA,uDAAA,CAAA,CAAA,GAAA,CAOjB,mBAOM,OAPN,YAOM,CAJJ,mBAG6B,OAAA;IAF1B,IAAI,MAAA,EAAA;IACL,OAAM;IACN,WAAQ,gBAAA;8BAGJ,QAAA,QAAQ,eAAA,SAAA,UAAA,GADhB,YAsBsB,MAAA,2BAAA,GAAA;;IApBpB,OAAK,eAAA,CAAC,6BAA2B,CACf,UAAA,QAAA,yCAAA,qBAAA,EAAA,eAAuH,QAAA,SAAI,SAAA,CAAA,CAAA,CAAA;IAM5I,SAAS,cAAA;IACT,UAAQ,CAAG,UAAA;IACX,MAAM,QAAA;IACN,iBAAe,MAAA,EAAA;;IACL,UAAQ,cAOV,CANP,YAMO,4BAAA,EALL,OAAK,eAAA,CAAC,6BAA2B,CACX,UAAA,QAAA,0EAAA,mBAAA,CAAA,CAAA,EAAA,GAAA,MAAA,GAAA,CAAA,OAAA,CAAA,CAAA,CAAA"}

package/dist/components/ScalarCodeBlock/ScalarCodeBlockCopy.vue.script.js

@@ -4,10 +4,10 @@ import { useBindCx } from "@scalar/use-hooks/useBindCx";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, defineComponent, mergeModels, mergeProps, normalizeClass, openBlock, renderSlot, toDisplayString, unref, useModel, withCtx } from "vue";
 //#region src/components/ScalarCodeBlock/ScalarCodeBlockCopy.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "hidden group-hocus-within/code-block:inline" };
-var ScalarCodeBlockCopy_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCodeBlockCopy_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarCodeBlockCopy",
-	props: /* @__PURE__ */ mergeModels({
+	props: /*@__PURE__*/ mergeModels({
 		showLang: { type: Boolean },
 		content: {},
 		lang: {}

package/dist/components/ScalarCodeBlock/ScalarCodeBlockCopy.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCodeBlockCopy.vue.script.js","names":[],"sources":["../../../src/components/ScalarCodeBlock/ScalarCodeBlockCopy.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Code Block Copy button\n *\n * Displays a copy-to-clipboard button with an optional language label.\n * Used internally by ScalarCodeBlock.\n *\n * @example\n * <ScalarCodeBlockCopy content=\"const x = 1\" lang=\"javascript\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { ScalarCopy } from '@/components/ScalarCopy'\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { computed } from 'vue'\n\nimport { LANGUAGE_LABELS } from './constants'\nimport type { StandardLanguageKey } from './types'\n\nconst { content } = defineProps<{\n  /** Whether to show the language label */\n  showLang?: boolean\n  /** Content to copy to clipboard */\n  content: string | object\n  /** Language of the code block */\n  lang?: StandardLanguageKey | string\n}>()\n\nconst copied = defineModel<boolean>('copied', { default: false })\n\n/** Handles the copy button click */\nconst contentToCopy = computed<string>(() => {\n  return typeof content === 'string'\n    ? content\n    : JSON.stringify(content, null, 2)\n})\n\n/** Type guard to check if the language is a standard language */\nconst isStandardLanguage = (lang: string): lang is StandardLanguageKey =>\n  lang in LANGUAGE_LABELS\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n\n<template>\n  <ScalarCopy\n    :content=\"contentToCopy\"\n    showLabel\n    v-model:copied=\"copied\"\n    placement=\"left\"\n    v-bind=\"{\n      ...cx(\n        copied\n          ? 'opacity-100'\n          : 'opacity-0 group-hocus-within/code-block:opacity-100',\n      ),\n    }\">\n    <template\n      v-if=\"lang\"\n      #copy>\n      <span class=\"hidden group-hocus-within/code-block:inline\">\n        <span\n          v-if=\"showLang\"\n          class=\"group-hocus/copy-button:sr-only\"\n          :class=\"{ capitalize: !isStandardLanguage(lang) }\">\n          {{ isStandardLanguage(lang) ? LANGUAGE_LABELS[lang] : lang }}\n        </span>\n        <span\n          :class=\"{\n            'group-hocus/copy-button:not-sr-only sr-only': showLang,\n          }\"\n          >Copy</span\n        >\n      </span>\n    </template>\n    <template #backdrop>\n      <slot name=\"backdrop\" />\n    </template>\n  </ScalarCopy>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EA6BA,MAAM,SAAS,SAAoB,SAAC,SAA4B;;EAGhE,MAAM,gBAAgB,eAAuB;AAC3C,UAAO,OAAO,QAAA,YAAY,WACtB,QAAA,UACA,KAAK,UAAU,QAAA,SAAS,MAAM,EAAC;IACpC;;EAGD,MAAM,sBAAsB,SAC1B,QAAQ;EAGV,MAAM,EAAE,OAAO,WAAU;;uBAIvB,YAiCa,MAAA,mBAAA,EAjCb,WAiCa;IAhCV,SAAS,cAAA;IACV,WAAA;IACQ,QAAQ,OAAA;oEAAM,QAAA;IACtB,WAAU;WACS,MAAA,GAAE,CAAU,OAAA,QAAA,gBAAA,sDAAA,EAAA,CAAA,EAAA,YAAA;IAyBpB,UAAQ,cACO,CAAxB,WAAwB,KAAA,QAAA,WAAA,CAAA,CAAA;;OAlBlB,QAAA,OAAA;UACL;sBAcM,CAbP,mBAaO,QAbP,YAaO,CAXG,QAAA,YAAA,WAAA,EADR,mBAKO,QAAA;;KAHL,OAAK,eAAA,CAAC,mCAAiC,EAAA,YAAA,CAChB,mBAAmB,QAAA,KAAI,EAAA,CAAA,CAAA;uBAC3C,mBAAmB,QAAA,KAAI,GAAI,MAAA,gBAAe,CAAC,QAAA,QAAQ,QAAA,KAAI,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA,EAE5D,mBAKC,QAAA,EAJE,OAAK,eAAA,EAAA,+CAA+D,QAAA,UAAA,CAAA,EAAA,EAGpE,QAAI,EAAA,CAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"ScalarCodeBlockCopy.vue.script.js","names":[],"sources":["../../../src/components/ScalarCodeBlock/ScalarCodeBlockCopy.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Code Block Copy button\n *\n * Displays a copy-to-clipboard button with an optional language label.\n * Used internally by ScalarCodeBlock.\n *\n * @example\n * <ScalarCodeBlockCopy content=\"const x = 1\" lang=\"javascript\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { ScalarCopy } from '@/components/ScalarCopy'\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { computed } from 'vue'\n\nimport { LANGUAGE_LABELS } from './constants'\nimport type { StandardLanguageKey } from './types'\n\nconst { content } = defineProps<{\n  /** Whether to show the language label */\n  showLang?: boolean\n  /** Content to copy to clipboard */\n  content: string | object\n  /** Language of the code block */\n  lang?: StandardLanguageKey | string\n}>()\n\nconst copied = defineModel<boolean>('copied', { default: false })\n\n/** Handles the copy button click */\nconst contentToCopy = computed<string>(() => {\n  return typeof content === 'string'\n    ? content\n    : JSON.stringify(content, null, 2)\n})\n\n/** Type guard to check if the language is a standard language */\nconst isStandardLanguage = (lang: string): lang is StandardLanguageKey =>\n  lang in LANGUAGE_LABELS\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n\n<template>\n  <ScalarCopy\n    :content=\"contentToCopy\"\n    showLabel\n    v-model:copied=\"copied\"\n    placement=\"left\"\n    v-bind=\"{\n      ...cx(\n        copied\n          ? 'opacity-100'\n          : 'opacity-0 group-hocus-within/code-block:opacity-100',\n      ),\n    }\">\n    <template\n      v-if=\"lang\"\n      #copy>\n      <span class=\"hidden group-hocus-within/code-block:inline\">\n        <span\n          v-if=\"showLang\"\n          class=\"group-hocus/copy-button:sr-only\"\n          :class=\"{ capitalize: !isStandardLanguage(lang) }\">\n          {{ isStandardLanguage(lang) ? LANGUAGE_LABELS[lang] : lang }}\n        </span>\n        <span\n          :class=\"{\n            'group-hocus/copy-button:not-sr-only sr-only': showLang,\n          }\"\n          >Copy</span\n        >\n      </span>\n    </template>\n    <template #backdrop>\n      <slot name=\"backdrop\" />\n    </template>\n  </ScalarCopy>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EA6BA,MAAM,SAAS,SAAoB,SAAC,QAA4B;;EAGhE,MAAM,gBAAgB,eAAuB;GAC3C,OAAO,OAAO,QAAA,YAAY,WACtB,QAAA,UACA,KAAK,UAAU,QAAA,SAAS,MAAM,CAAC;EACrC,CAAC;;EAGD,MAAM,sBAAsB,SAC1B,QAAQ;EAGV,MAAM,EAAE,OAAO,UAAU;;uBAIvB,YAiCa,MAAA,kBAAA,GAjCb,WAiCa;IAhCV,SAAS,cAAA;IACV,WAAA;IACQ,QAAQ,OAAA;oEAAM,QAAA;IACtB,WAAU;WACS,MAAA,EAAA,CAAE,CAAU,OAAA,QAAA,gBAAA,qDAAA,EAAA,CAAA,GAAA,YAAA;IAyBpB,UAAQ,cACO,CAAxB,WAAwB,KAAA,QAAA,UAAA,CAAA,CAAA;;OAlBlB,QAAA,OAAA;UACL;sBAcM,CAbP,mBAaO,QAbP,YAaO,CAXG,QAAA,YAAA,UAAA,GADR,mBAKO,QAAA;;KAHL,OAAK,eAAA,CAAC,mCAAiC,EAAA,YAAA,CAChB,mBAAmB,QAAA,IAAI,EAAA,CAAA,CAAA;uBAC3C,mBAAmB,QAAA,IAAI,IAAI,MAAA,eAAA,CAAe,CAAC,QAAA,QAAQ,QAAA,IAAI,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAE5D,mBAKC,QAAA,EAJE,OAAK,eAAA,EAAA,+CAA+D,QAAA,SAAA,CAAA,EAAA,GAGpE,QAAI,CAAA,CAAA,CAAA,CAAA,CAAA"}

package/dist/components/ScalarCodeBlock/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","names":[],"sources":["../../../src/components/ScalarCodeBlock/constants.ts"],"sourcesContent":["import type { StandardLanguageKey } from './types'\n\n/** Labels for the standard languages */\nexport const LANGUAGE_LABELS = {\n  bash: 'Bash',\n  c: 'C',\n  clojure: 'Clojure',\n  cpp: 'C++',\n  csharp: 'C#',\n  css: 'CSS',\n  curl: 'cURL',\n  dart: 'Dart',\n  diff: 'Diff',\n  docker: 'Docker',\n  dockerfile: 'Dockerfile',\n  elixir: 'Elixir',\n  fsharp: 'F#',\n  go: 'Go',\n  graphql: 'GraphQL',\n  haskell: 'Haskell',\n  html: 'HTML',\n  http: 'HTTP',\n  ini: 'INI',\n  java: 'Java',\n  javascript: 'JavaScript',\n  json: 'JSON',\n  kotlin: 'Kotlin',\n  less: 'Less',\n  lua: 'Lua',\n  makefile: 'Makefile',\n  markdown: 'Markdown',\n  matlab: 'MATLAB',\n  mojo: 'Mojo',\n  nginx: 'Nginx',\n  objectivec: 'Objective-C',\n  ocaml: 'OCaml',\n  perl: 'Perl',\n  php: 'PHP',\n  plaintext: 'Plain Text',\n  powershell: 'PowerShell',\n  properties: 'Properties',\n  python: 'Python',\n  r: 'R',\n  ruby: 'Ruby',\n  rust: 'Rust',\n  scala: 'Scala',\n  scss: 'SCSS',\n  shell: 'Shell',\n  sql: 'SQL',\n  swift: 'Swift',\n  toml: 'TOML',\n  typescript: 'TypeScript',\n  xml: 'XML',\n  yaml: 'YAML',\n} as const satisfies Record<StandardLanguageKey, string>\n"],"mappings":";;AAGA,IAAa,kBAAkB;CAC7B,MAAM;CACN,GAAG;CACH,SAAS;CACT,KAAK;CACL,QAAQ;CACR,KAAK;CACL,MAAM;CACN,MAAM;CACN,MAAM;CACN,QAAQ;CACR,YAAY;CACZ,QAAQ;CACR,QAAQ;CACR,IAAI;CACJ,SAAS;CACT,SAAS;CACT,MAAM;CACN,MAAM;CACN,KAAK;CACL,MAAM;CACN,YAAY;CACZ,MAAM;CACN,QAAQ;CACR,MAAM;CACN,KAAK;CACL,UAAU;CACV,UAAU;CACV,QAAQ;CACR,MAAM;CACN,OAAO;CACP,YAAY;CACZ,OAAO;CACP,MAAM;CACN,KAAK;CACL,WAAW;CACX,YAAY;CACZ,YAAY;CACZ,QAAQ;CACR,GAAG;CACH,MAAM;CACN,MAAM;CACN,OAAO;CACP,MAAM;CACN,OAAO;CACP,KAAK;CACL,OAAO;CACP,MAAM;CACN,YAAY;CACZ,KAAK;CACL,MAAM;CACP"}
+{"version":3,"file":"constants.js","names":[],"sources":["../../../src/components/ScalarCodeBlock/constants.ts"],"sourcesContent":["import type { StandardLanguageKey } from './types'\n\n/** Labels for the standard languages */\nexport const LANGUAGE_LABELS = {\n  bash: 'Bash',\n  c: 'C',\n  clojure: 'Clojure',\n  cpp: 'C++',\n  csharp: 'C#',\n  css: 'CSS',\n  curl: 'cURL',\n  dart: 'Dart',\n  diff: 'Diff',\n  docker: 'Docker',\n  dockerfile: 'Dockerfile',\n  elixir: 'Elixir',\n  fsharp: 'F#',\n  go: 'Go',\n  graphql: 'GraphQL',\n  haskell: 'Haskell',\n  html: 'HTML',\n  http: 'HTTP',\n  ini: 'INI',\n  java: 'Java',\n  javascript: 'JavaScript',\n  json: 'JSON',\n  kotlin: 'Kotlin',\n  less: 'Less',\n  lua: 'Lua',\n  makefile: 'Makefile',\n  markdown: 'Markdown',\n  matlab: 'MATLAB',\n  mojo: 'Mojo',\n  nginx: 'Nginx',\n  objectivec: 'Objective-C',\n  ocaml: 'OCaml',\n  perl: 'Perl',\n  php: 'PHP',\n  plaintext: 'Plain Text',\n  powershell: 'PowerShell',\n  properties: 'Properties',\n  python: 'Python',\n  r: 'R',\n  ruby: 'Ruby',\n  rust: 'Rust',\n  scala: 'Scala',\n  scss: 'SCSS',\n  shell: 'Shell',\n  sql: 'SQL',\n  swift: 'Swift',\n  toml: 'TOML',\n  typescript: 'TypeScript',\n  xml: 'XML',\n  yaml: 'YAML',\n} as const satisfies Record<StandardLanguageKey, string>\n"],"mappings":";;AAGA,IAAa,kBAAkB;CAC7B,MAAM;CACN,GAAG;CACH,SAAS;CACT,KAAK;CACL,QAAQ;CACR,KAAK;CACL,MAAM;CACN,MAAM;CACN,MAAM;CACN,QAAQ;CACR,YAAY;CACZ,QAAQ;CACR,QAAQ;CACR,IAAI;CACJ,SAAS;CACT,SAAS;CACT,MAAM;CACN,MAAM;CACN,KAAK;CACL,MAAM;CACN,YAAY;CACZ,MAAM;CACN,QAAQ;CACR,MAAM;CACN,KAAK;CACL,UAAU;CACV,UAAU;CACV,QAAQ;CACR,MAAM;CACN,OAAO;CACP,YAAY;CACZ,OAAO;CACP,MAAM;CACN,KAAK;CACL,WAAW;CACX,YAAY;CACZ,YAAY;CACZ,QAAQ;CACR,GAAG;CACH,MAAM;CACN,MAAM;CACN,OAAO;CACP,MAAM;CACN,OAAO;CACP,KAAK;CACL,OAAO;CACP,MAAM;CACN,YAAY;CACZ,KAAK;CACL,MAAM;AACR"}

package/dist/components/ScalarColorModeToggle/ScalarColorModeToggle.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarColorModeToggle.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarColorModeToggle/ScalarColorModeToggle.vue"],"names":[],"mappings":"AAsDA;;;;;;;;GAQG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;IAEhB;;;OAGG;cACO,QAAQ,GAAG,MAAM;;IAJ3B;;;OAGG;cACO,QAAQ,GAAG,MAAM;iGA0EzB,CAAC"}
+{"version":3,"file":"ScalarColorModeToggle.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarColorModeToggle/ScalarColorModeToggle.vue"],"names":[],"mappings":"AAsDA;;;;;;;;GAQG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;IAEhB;;;OAGG;cACO,QAAQ,GAAG,MAAM;;IAJ3B;;;OAGG;cACO,QAAQ,GAAG,MAAM;iGA2EzB,CAAC"}

package/dist/components/ScalarColorModeToggle/ScalarColorModeToggle.vue.script.js

@@ -2,7 +2,7 @@ import ScalarColorModeToggleIcon_default from "./ScalarColorModeToggleIcon.vue.j
 import ScalarColorModeToggleButton_default from "./ScalarColorModeToggleButton.vue.js";
 import { computed, createBlock, defineComponent, isRef, openBlock, unref } from "vue";
 import { useColorMode } from "@scalar/use-hooks/useColorMode";
-var ScalarColorModeToggle_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarColorModeToggle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "ScalarColorModeToggle",
 	props: { variant: { default: "switch" } },
 	setup(__props) {

package/dist/components/ScalarColorModeToggle/ScalarColorModeToggle.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarColorModeToggle.vue.script.js","names":[],"sources":["../../../src/components/ScalarColorModeToggle/ScalarColorModeToggle.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { useColorMode } from '@scalar/use-hooks/useColorMode'\nimport { computed } from 'vue'\n\nimport ScalarColorModeToggleButton from './ScalarColorModeToggleButton.vue'\nimport ScalarColorModeToggleIcon from './ScalarColorModeToggleIcon.vue'\n\n/**\n * Scalar Color Mode Toggle component\n *\n * A toggle that toggles between light and dark mode\n * using the {@link useColorMode} hook.\n *\n * @example\n *   <ScalarColorModeToggle />\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nconst { variant = 'switch' } = defineProps<{\n  /**\n   * The style of the toggle.\n   * @default 'switch'\n   */\n  variant?: 'switch' | 'icon'\n}>()\n\nconst { isDarkMode, toggleColorMode, darkLightMode } = useColorMode()\n\nconst ariaLabel = computed<string>(() =>\n  isDarkMode.value ? 'Set light mode' : 'Set dark mode',\n)\n</script>\n<template>\n  <ScalarColorModeToggleButton\n    v-if=\"variant === 'switch'\"\n    v-model=\"isDarkMode\"\n    :aria-label=\"ariaLabel\" />\n  <ScalarColorModeToggleIcon\n    v-else\n    :aria-label=\"ariaLabel\"\n    :mode=\"darkLightMode\"\n    @click=\"toggleColorMode\" />\n</template>\n"],"mappings":";;;;;;;;EA2BA,MAAM,EAAE,YAAY,iBAAiB,kBAAkB,cAAa;EAEpE,MAAM,YAAY,eAChB,WAAW,QAAQ,mBAAmB,gBACxC;;UAIU,QAAA,YAAO,YAAA,WAAA,EADf,YAG4B,qCAAA;;gBADjB,MAAA,WAAU;gGAAA,QAAA,SAAA;IAClB,cAAY,UAAA;8DACf,YAI6B,mCAAA;;IAF1B,cAAY,UAAA;IACZ,MAAM,MAAA,cAAa;IACnB,SAAO,MAAA,gBAAe"}
+{"version":3,"file":"ScalarColorModeToggle.vue.script.js","names":[],"sources":["../../../src/components/ScalarColorModeToggle/ScalarColorModeToggle.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { useColorMode } from '@scalar/use-hooks/useColorMode'\nimport { computed } from 'vue'\n\nimport ScalarColorModeToggleButton from './ScalarColorModeToggleButton.vue'\nimport ScalarColorModeToggleIcon from './ScalarColorModeToggleIcon.vue'\n\n/**\n * Scalar Color Mode Toggle component\n *\n * A toggle that toggles between light and dark mode\n * using the {@link useColorMode} hook.\n *\n * @example\n *   <ScalarColorModeToggle />\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nconst { variant = 'switch' } = defineProps<{\n  /**\n   * The style of the toggle.\n   * @default 'switch'\n   */\n  variant?: 'switch' | 'icon'\n}>()\n\nconst { isDarkMode, toggleColorMode, darkLightMode } = useColorMode()\n\nconst ariaLabel = computed<string>(() =>\n  isDarkMode.value ? 'Set light mode' : 'Set dark mode',\n)\n</script>\n<template>\n  <ScalarColorModeToggleButton\n    v-if=\"variant === 'switch'\"\n    v-model=\"isDarkMode\"\n    :aria-label=\"ariaLabel\" />\n  <ScalarColorModeToggleIcon\n    v-else\n    :aria-label=\"ariaLabel\"\n    :mode=\"darkLightMode\"\n    @click=\"toggleColorMode\" />\n</template>\n"],"mappings":";;;;;;;;EA2BA,MAAM,EAAE,YAAY,iBAAiB,kBAAkB,aAAa;EAEpE,MAAM,YAAY,eAChB,WAAW,QAAQ,mBAAmB,eACxC;;UAIU,QAAA,YAAO,YAAA,UAAA,GADf,YAG4B,qCAAA;;gBADjB,MAAA,UAAA;gGAAU,QAAA,SAAA;IAClB,cAAY,UAAA;8DACf,YAI6B,mCAAA;;IAF1B,cAAY,UAAA;IACZ,MAAM,MAAA,aAAA;IACN,SAAO,MAAA,eAAA"}

package/dist/components/ScalarColorModeToggle/ScalarColorModeToggleButton.vue.script.js

@@ -3,7 +3,7 @@ import { useBindCx } from "@scalar/use-hooks/useBindCx";
 import { createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, unref, useModel } from "vue";
 //#region src/components/ScalarColorModeToggle/ScalarColorModeToggleButton.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["aria-pressed"];
-var ScalarColorModeToggleButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarColorModeToggleButton_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarColorModeToggleButton",
 	props: {

package/dist/components/ScalarColorModeToggle/ScalarColorModeToggleButton.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarColorModeToggleButton.vue.script.js","names":[],"sources":["../../../src/components/ScalarColorModeToggle/ScalarColorModeToggleButton.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport type ScalarColorModeToggle from './ScalarColorModeToggle.vue'\nimport ScalarColorModeToggleIcon from './ScalarColorModeToggleIcon.vue'\n\n/**\n * Scalar Color Mode Toggle Button component\n *\n * A dumb button that toggles between a sun and moon icon.\n *\n * If you need a toggle that is aware of and sets color mode,\n * you want {@link ScalarColorModeToggle} instead.\n *\n * @example\n *   <ScalarColorModeToggleButton v-model=\"isDarkMode\" />\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n\n/** Whether the toggle is in dark mode */\nconst model = defineModel<boolean>()\n</script>\n<template>\n  <button\n    :aria-pressed=\"model\"\n    type=\"button\"\n    v-bind=\"\n      cx(\n        'group/toggle flex h-6 w-[38px] brightness-lifted -mx-px items-center py-1.5 -my-1.5 relative outline-none',\n      )\n    \"\n    @click=\"model = !model\">\n    <!-- Background -->\n    <div\n      class=\"h-3 w-full bg-border mx-px rounded-xl group-focus-visible/toggle:outline -outline-offset-1\" />\n    <!-- Slider -->\n    <div\n      class=\"size-[23px] left-border absolute border rounded-full flex items-center justify-center bg-b-1 group-focus-visible/toggle:outline -outline-offset-1 transition-transform duration-300 ease-in-out\"\n      :class=\"{ 'translate-x-[14px]': model }\">\n      <!-- Icon -->\n      <ScalarColorModeToggleIcon\n        is=\"div\"\n        :mode=\"model ? 'dark' : 'light'\" />\n    </div>\n  </button>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAsBA,MAAM,EAAE,OAAO,WAAU;;EAGzB,MAAM,QAAQ,SAAoB,SAAA,aAAC;;uBAGjC,mBAqBS,UArBT,WAqBS;IApBN,gBAAc,MAAA;IACf,MAAK;MACU,MAAA,GAAE,CAAA,4GAAA,EAAA,EAKhB,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAA,QAAK,CAAI,MAAA,QAAA,CAAA,EAAA,CAAA,OAAA,OAAA,OAAA,KAEjB,mBACuG,OAAA,EAArG,OAAM,8FAA4F,EAAA,MAAA,GAAA,GAEpG,mBAOM,OAAA,EANJ,OAAK,eAAA,CAAC,mMAAiM,EAAA,sBACvK,MAAA,OAAK,CAAA,CAAA,EAAA,EAAA,CAErC,YAEqC,mCAAA;IADnC,IAAG;IACF,MAAM,MAAA,QAAK,SAAA"}
+{"version":3,"file":"ScalarColorModeToggleButton.vue.script.js","names":[],"sources":["../../../src/components/ScalarColorModeToggle/ScalarColorModeToggleButton.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport type ScalarColorModeToggle from './ScalarColorModeToggle.vue'\nimport ScalarColorModeToggleIcon from './ScalarColorModeToggleIcon.vue'\n\n/**\n * Scalar Color Mode Toggle Button component\n *\n * A dumb button that toggles between a sun and moon icon.\n *\n * If you need a toggle that is aware of and sets color mode,\n * you want {@link ScalarColorModeToggle} instead.\n *\n * @example\n *   <ScalarColorModeToggleButton v-model=\"isDarkMode\" />\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n\n/** Whether the toggle is in dark mode */\nconst model = defineModel<boolean>()\n</script>\n<template>\n  <button\n    :aria-pressed=\"model\"\n    type=\"button\"\n    v-bind=\"\n      cx(\n        'group/toggle flex h-6 w-[38px] brightness-lifted -mx-px items-center py-1.5 -my-1.5 relative outline-none',\n      )\n    \"\n    @click=\"model = !model\">\n    <!-- Background -->\n    <div\n      class=\"h-3 w-full bg-border mx-px rounded-xl group-focus-visible/toggle:outline -outline-offset-1\" />\n    <!-- Slider -->\n    <div\n      class=\"size-[23px] left-border absolute border rounded-full flex items-center justify-center bg-b-1 group-focus-visible/toggle:outline -outline-offset-1 transition-transform duration-300 ease-in-out\"\n      :class=\"{ 'translate-x-[14px]': model }\">\n      <!-- Icon -->\n      <ScalarColorModeToggleIcon\n        is=\"div\"\n        :mode=\"model ? 'dark' : 'light'\" />\n    </div>\n  </button>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAsBA,MAAM,EAAE,OAAO,UAAU;;EAGzB,MAAM,QAAQ,SAAoB,SAAA,YAAC;;uBAGjC,mBAqBS,UArBT,WAqBS;IApBN,gBAAc,MAAA;IACf,MAAK;MACU,MAAA,EAAA,CAAE,CAAA,2GAAA,GAAA,EAKhB,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAA,QAAK,CAAI,MAAA,OAAA,CAAA,GAAA,CAAA,OAAA,OAAA,OAAA,KAEjB,mBACuG,OAAA,EAArG,OAAM,6FAA4F,GAAA,MAAA,EAAA,IAEpG,mBAOM,OAAA,EANJ,OAAK,eAAA,CAAC,mMAAiM,EAAA,sBACvK,MAAA,MAAK,CAAA,CAAA,EAAA,GAAA,CAErC,YAEqC,mCAAA;IADnC,IAAG;IACF,MAAM,MAAA,QAAK,SAAA"}

package/dist/components/ScalarColorModeToggle/ScalarColorModeToggleIcon.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export
 import ScalarColorModeToggleIcon_vue_vue_type_script_setup_true_lang_default from "./ScalarColorModeToggleIcon.vue.script.js";
 /* empty css                                        */
 //#region src/components/ScalarColorModeToggle/ScalarColorModeToggleIcon.vue
-var ScalarColorModeToggleIcon_default = /* @__PURE__ */ _plugin_vue_export_helper_default(ScalarColorModeToggleIcon_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-60be8692"]]);
+var ScalarColorModeToggleIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(ScalarColorModeToggleIcon_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-60be8692"]]);
 //#endregion
 export { ScalarColorModeToggleIcon_default as default };
 

package/dist/components/ScalarColorModeToggle/ScalarColorModeToggleIcon.vue.script.js

@@ -1,6 +1,6 @@
 import { useBindCx } from "@scalar/use-hooks/useBindCx";
 import { computed, createBlock, createElementVNode, defineComponent, mergeProps, openBlock, resolveDynamicComponent, unref, withCtx } from "vue";
-var ScalarColorModeToggleIcon_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarColorModeToggleIcon_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarColorModeToggleIcon",
 	props: {

package/dist/components/ScalarColorModeToggle/ScalarColorModeToggleIcon.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarColorModeToggleIcon.vue.script.js","names":[],"sources":["../../../src/components/ScalarColorModeToggle/ScalarColorModeToggleIcon.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { type Component, computed } from 'vue'\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport type ScalarColorModeToggle from './ScalarColorModeToggle.vue'\n\n/**\n * Scalar Color Mode Toggle Icon component\n *\n * An icon that toggles between a sun and moon.\n *\n * If you need a toggle that is aware of and sets color mode,\n * you want {@link ScalarColorModeToggle} instead.\n *\n * @example\n *   <ScalarColorModeToggleIcon v-model=\"isDarkMode\" />\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nconst { is = 'button', mode = 'light' } = defineProps<{\n  /** The element or component this component should render as. */\n  is?: string | Component\n  /** Whether the toggle is a sun or moon icon */\n  mode?: 'light' | 'dark'\n}>()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n\nconst ariaLabel = computed<string>(() =>\n  mode === 'dark' ? 'Set light mode' : 'Set dark mode',\n)\n</script>\n<template>\n  <!-- Icon -->\n  <component\n    :is=\"is\"\n    :aria-label=\"ariaLabel\"\n    :class=\"`toggle-icon-${mode}`\"\n    :type=\"is === 'button' ? 'button' : undefined\"\n    v-bind=\"cx('size-3 flex items-center justify-center text-c-1')\">\n    <span class=\"toggle-icon-sun-ray\" />\n    <span class=\"toggle-icon-sun-ray\" />\n    <span class=\"toggle-icon-sun-ray\" />\n    <span class=\"toggle-icon-sun-ray\" />\n    <span class=\"toggle-icon-ellipse\">\n      <span class=\"toggle-icon-moon-mask\" />\n    </span>\n  </component>\n</template>\n<style scoped>\n.toggle-icon-ellipse {\n  width: 7px;\n  height: 7px;\n  border-radius: 50%;\n  box-shadow: inset 0 0 0 1px currentColor;\n  overflow: hidden;\n  position: relative;\n  background: var(--scalar-background-1);\n  display: inline-block;\n  transition:\n    width 0.3s ease-in-out,\n    height 0.3s ease-in-out;\n}\n.toggle-icon-moon-mask {\n  width: 100%;\n  height: 100%;\n  border: 1px solid currentColor;\n  display: block;\n  left: 2.5px;\n  bottom: 2.5px;\n  position: absolute;\n  border-radius: 50%;\n  background: var(--scalar-background-1);\n  transition: transform 0.3s ease-in-out;\n  transform: translate3d(4px, -4px, 0);\n}\n.toggle-icon-sun-ray {\n  width: 12px;\n  height: 1px;\n  border-radius: 8px;\n  background: currentColor;\n  position: absolute;\n  transition: transform 0.3s ease-in-out;\n}\n.toggle-icon-sun-ray:nth-of-type(2) {\n  transform: rotate(90deg);\n}\n.toggle-icon-sun-ray:nth-of-type(3) {\n  transform: rotate(45deg);\n}\n.toggle-icon-sun-ray:nth-of-type(4) {\n  transform: rotate(-45deg);\n}\n.toggle-icon-dark .toggle-icon-ellipse {\n  width: 10px;\n  height: 10px;\n  mask-image: radial-gradient(\n    circle at bottom left,\n    pink 10px,\n    transparent 12px\n  );\n}\n.toggle-icon-dark .toggle-icon-sun-ray {\n  transform: scale(0);\n}\n.toggle-icon-dark .toggle-icon-moon-mask {\n  transform: translate3d(0, 0, 0);\n}\n</style>\n"],"mappings":";;;;;;;;;;EA6BA,MAAM,EAAE,OAAO,WAAU;EAEzB,MAAM,YAAY,eAChB,QAAA,SAAS,SAAS,mBAAmB,gBACvC;;uBAIE,YAaY,wBAZL,QAAA,GAAE,EADT,WAaY;IAXT,cAAY,UAAA;IACZ,OAAK,eAAiB,QAAA;IACtB,MAAM,QAAA,OAAE,WAAA,WAA2B,KAAA;MAC5B,MAAA,GAAE,CAAA,mDAAA,CAAA,EAAA;2BAC0B,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA;KAApC,mBAAoC,QAAA,EAA9B,OAAM,uBAAqB,EAAA,MAAA,GAAA;KACjC,mBAAoC,QAAA,EAA9B,OAAM,uBAAqB,EAAA,MAAA,GAAA;KACjC,mBAAoC,QAAA,EAA9B,OAAM,uBAAqB,EAAA,MAAA,GAAA;KACjC,mBAAoC,QAAA,EAA9B,OAAM,uBAAqB,EAAA,MAAA,GAAA;KACjC,mBAEO,QAAA,EAFD,OAAM,uBAAqB,EAAA,CAC/B,mBAAsC,QAAA,EAAhC,OAAM,yBAAuB,CAAA,CAAA,EAAA,GAAA"}
+{"version":3,"file":"ScalarColorModeToggleIcon.vue.script.js","names":[],"sources":["../../../src/components/ScalarColorModeToggle/ScalarColorModeToggleIcon.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { type Component, computed } from 'vue'\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport type ScalarColorModeToggle from './ScalarColorModeToggle.vue'\n\n/**\n * Scalar Color Mode Toggle Icon component\n *\n * An icon that toggles between a sun and moon.\n *\n * If you need a toggle that is aware of and sets color mode,\n * you want {@link ScalarColorModeToggle} instead.\n *\n * @example\n *   <ScalarColorModeToggleIcon v-model=\"isDarkMode\" />\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nconst { is = 'button', mode = 'light' } = defineProps<{\n  /** The element or component this component should render as. */\n  is?: string | Component\n  /** Whether the toggle is a sun or moon icon */\n  mode?: 'light' | 'dark'\n}>()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n\nconst ariaLabel = computed<string>(() =>\n  mode === 'dark' ? 'Set light mode' : 'Set dark mode',\n)\n</script>\n<template>\n  <!-- Icon -->\n  <component\n    :is=\"is\"\n    :aria-label=\"ariaLabel\"\n    :class=\"`toggle-icon-${mode}`\"\n    :type=\"is === 'button' ? 'button' : undefined\"\n    v-bind=\"cx('size-3 flex items-center justify-center text-c-1')\">\n    <span class=\"toggle-icon-sun-ray\" />\n    <span class=\"toggle-icon-sun-ray\" />\n    <span class=\"toggle-icon-sun-ray\" />\n    <span class=\"toggle-icon-sun-ray\" />\n    <span class=\"toggle-icon-ellipse\">\n      <span class=\"toggle-icon-moon-mask\" />\n    </span>\n  </component>\n</template>\n<style scoped>\n.toggle-icon-ellipse {\n  width: 7px;\n  height: 7px;\n  border-radius: 50%;\n  box-shadow: inset 0 0 0 1px currentColor;\n  overflow: hidden;\n  position: relative;\n  background: var(--scalar-background-1);\n  display: inline-block;\n  transition:\n    width 0.3s ease-in-out,\n    height 0.3s ease-in-out;\n}\n.toggle-icon-moon-mask {\n  width: 100%;\n  height: 100%;\n  border: 1px solid currentColor;\n  display: block;\n  left: 2.5px;\n  bottom: 2.5px;\n  position: absolute;\n  border-radius: 50%;\n  background: var(--scalar-background-1);\n  transition: transform 0.3s ease-in-out;\n  transform: translate3d(4px, -4px, 0);\n}\n.toggle-icon-sun-ray {\n  width: 12px;\n  height: 1px;\n  border-radius: 8px;\n  background: currentColor;\n  position: absolute;\n  transition: transform 0.3s ease-in-out;\n}\n.toggle-icon-sun-ray:nth-of-type(2) {\n  transform: rotate(90deg);\n}\n.toggle-icon-sun-ray:nth-of-type(3) {\n  transform: rotate(45deg);\n}\n.toggle-icon-sun-ray:nth-of-type(4) {\n  transform: rotate(-45deg);\n}\n.toggle-icon-dark .toggle-icon-ellipse {\n  width: 10px;\n  height: 10px;\n  mask-image: radial-gradient(\n    circle at bottom left,\n    pink 10px,\n    transparent 12px\n  );\n}\n.toggle-icon-dark .toggle-icon-sun-ray {\n  transform: scale(0);\n}\n.toggle-icon-dark .toggle-icon-moon-mask {\n  transform: translate3d(0, 0, 0);\n}\n</style>\n"],"mappings":";;;;;;;;;;EA6BA,MAAM,EAAE,OAAO,UAAU;EAEzB,MAAM,YAAY,eAChB,QAAA,SAAS,SAAS,mBAAmB,eACvC;;uBAIE,YAaY,wBAZL,QAAA,EAAE,GADT,WAaY;IAXT,cAAY,UAAA;IACZ,OAAK,eAAiB,QAAA;IACtB,MAAM,QAAA,OAAE,WAAA,WAA2B,KAAA;MAC5B,MAAA,EAAA,CAAE,CAAA,kDAAA,CAAA,GAAA;2BAC0B,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA;KAApC,mBAAoC,QAAA,EAA9B,OAAM,sBAAqB,GAAA,MAAA,EAAA;KACjC,mBAAoC,QAAA,EAA9B,OAAM,sBAAqB,GAAA,MAAA,EAAA;KACjC,mBAAoC,QAAA,EAA9B,OAAM,sBAAqB,GAAA,MAAA,EAAA;KACjC,mBAAoC,QAAA,EAA9B,OAAM,sBAAqB,GAAA,MAAA,EAAA;KACjC,mBAEO,QAAA,EAFD,OAAM,sBAAqB,GAAA,CAC/B,mBAAsC,QAAA,EAAhC,OAAM,wBAAuB,CAAA,CAAA,GAAA,EAAA"}

package/dist/components/ScalarCombobox/ScalarCombobox.vue.d.ts

@@ -38,7 +38,7 @@ declare const __VLS_export: <O extends Option = Option, G extends OptionGroup<O>
     slots: ComboboxSlots<O, G>;
     emit: ((evt: "add") => void) & ((event: "update:modelValue", value: O | undefined) => void);
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

package/dist/components/ScalarCombobox/ScalarCombobox.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCombobox.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCombobox/ScalarCombobox.vue"],"names":[],"mappings":"AAsGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAA;AAG9D,OAAO,KAAK,EAEV,aAAa,EACb,cAAc,EACd,MAAM,EACN,WAAW,EACX,eAAe,EAChB,MAAM,SAAS,CAAA;AAGhB;;;;;;;;;;GAUG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY,GAAK,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,CAAC,SAAS,WAAW,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,EAC1F,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,gBAAgB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EAClE;WAgKO,OAAO,KAAK,EAAE,WAAW,GAAG,mBAAmB,CAAC;QA9JpD,6CAA6C;iBACpC,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC;QAC9B,sDAAsD;sBACxC,MAAM;QACpB;;;;WAIG;mBACQ,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC;;qBAgBtB,CAAC;;;;KAqI6E,CAAC,GAAG,CAAC,OAAO,UAAU,SAAS;QAAE,oBAAoB,EAAE,MAAM,CAAC,CAAA;KAAE,GAAG,CAAC,GAAG,EAAE,CAAC;YAC5J,CAAC,OAAO,EAAE,EAAE,KAAK,IAAI;WACtB,GAAG;;UAEJ,qFAAoC;EAEvC,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAI,CAAC;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,CAAC,GAAG,EAAE,CAAC"}
+{"version":3,"file":"ScalarCombobox.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCombobox/ScalarCombobox.vue"],"names":[],"mappings":"AAsGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAA;AAG9D,OAAO,KAAK,EAEV,aAAa,EACb,cAAc,EACd,MAAM,EACN,WAAW,EACX,eAAe,EAChB,MAAM,SAAS,CAAA;AAGhB;;;;;;;;;;GAUG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY,GAAK,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,CAAC,SAAS,WAAW,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,EAC1F,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,gBAAgB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EAClE;WAkKO,OAAO,KAAK,EAAE,WAAW,GAAG,mBAAmB,CAAC;QAhKpD,6CAA6C;iBACpC,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC;QAC9B,sDAAsD;sBACxC,MAAM;QACpB;;;;WAIG;mBACQ,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC;;qBAgBtB,CAAC;;;;KAuI6E,CAAC,GAAG,CAAC,OAAO,UAAU,SAAS;QAAE,oBAAoB,EAAE,MAAM,CAAC,CAAA;KAAE,GAAG,CAAC,GAAG,EAAE,CAAC;YAC5J,CAAC,OAAO,EAAE,EAAE,KAAK,IAAI;WACtB,GAAG;;UAEJ,qFAAoC;EAEvC,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAA;CAAI,CAAC;AACzF,KAAK,mBAAmB,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,CAAC,GAAG,EAAE,CAAC"}

package/dist/components/ScalarCombobox/ScalarCombobox.vue.script.js

@@ -1,9 +1,9 @@
 import ScalarComboboxOptions_default from "./ScalarComboboxOptions.vue.js";
 import ScalarComboboxPopover_default from "./ScalarComboboxPopover.vue.js";
 import { createBlock, createSlots, createVNode, defineComponent, guardReactiveProps, mergeModels, normalizeProps, openBlock, renderSlot, useModel, withCtx } from "vue";
-var ScalarCombobox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var ScalarCombobox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "ScalarCombobox",
-	props: /* @__PURE__ */ mergeModels({
+	props: /*@__PURE__*/ mergeModels({
 		options: {},
 		placeholder: {},
 		filterFn: { type: Function },
@@ -21,7 +21,7 @@ var ScalarCombobox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		"modelValue": {},
 		"modelModifiers": {}
 	}),
-	emits: /* @__PURE__ */ mergeModels(["add"], ["update:modelValue"]),
+	emits: /*@__PURE__*/ mergeModels(["add"], ["update:modelValue"]),
 	setup(__props, { emit: __emit }) {
 		const emit = __emit;
 		const model = useModel(__props, "modelValue");

package/dist/components/ScalarCombobox/ScalarCombobox.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarCombobox.vue.script.js","names":["$slots"],"sources":["../../../src/components/ScalarCombobox/ScalarCombobox.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Combobox component\n *\n * A searchable select input with support for filtering, option groups,\n * and custom option rendering.\n *\n * @example\n * <ScalarCombobox v-model=\"selected\" :options=\"options\">\n *   <ScalarButton>{{ selected?.label ?? 'Select' }}</ScalarButton>\n * </ScalarCombobox>\n */\nexport default {}\n</script>\n\n<!-- prettier-ignore-attribute generic -->\n<script\n  setup\n  lang=\"ts\"\n  generic=\"O extends Option = Option, G extends OptionGroup<O> = OptionGroup<O>\">\nimport type { ScalarFloatingOptions } from '../ScalarFloating'\nimport ComboboxOptions from './ScalarComboboxOptions.vue'\nimport ComboboxPopover from './ScalarComboboxPopover.vue'\nimport type {\n  ComboboxEmits,\n  ComboboxSlots,\n  FilterFunction,\n  Option,\n  OptionGroup,\n  OptionsOrGroups,\n} from './types'\n\ndefineProps<\n  {\n    /** The options to display in the combobox */\n    options: OptionsOrGroups<O, G>\n    /** The placeholder text to display in the combobox */\n    placeholder?: string\n    /** A function to filter the options based on a query,\n     * if not provided, the options will be filtered by option label\n     *\n     * @see {@link FilterFunction} for more information\n     */\n    filterFn?: FilterFunction<O, G>\n  } & ScalarFloatingOptions\n>()\n\nconst emit = defineEmits<ComboboxEmits>()\n\nconst model = defineModel<O>()\n\ndefineSlots<ComboboxSlots<O, G>>()\n</script>\n<template>\n  <ComboboxPopover\n    :middleware\n    :offset\n    :placement=\"placement ?? 'bottom-start'\"\n    :resize\n    :target\n    :teleport>\n    <template #default=\"{ open }\">\n      <slot :open />\n    </template>\n    <template #popover=\"{ open, close }\">\n      <ComboboxOptions\n        :filterFn\n        :modelValue=\"model ? [model] : []\"\n        :open\n        :options\n        :placeholder\n        @add=\"() => (close(), emit('add'))\"\n        @update:modelValue=\"(v) => (close(), (model = v[0]))\">\n        <!-- Pass through the combobox slots -->\n        <template\n          v-if=\"$slots.option\"\n          #option=\"props\">\n          <slot\n            name=\"option\"\n            v-bind=\"props\" />\n        </template>\n        <template\n          v-if=\"$slots.group\"\n          #group=\"props\">\n          <slot\n            name=\"group\"\n            v-bind=\"props\" />\n        </template>\n        <template\n          v-if=\"$slots.add\"\n          #add=\"props\">\n          <slot\n            name=\"add\"\n            v-bind=\"props\" />\n        </template>\n      </ComboboxOptions>\n    </template>\n  </ComboboxPopover>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EA+CA,MAAM,OAAO;EAEb,MAAM,QAAQ,SAAc,SAAA,aAAC;;uBAK3B,YA2CkB,+BAAA;IA1Cf,YAAA,QAAA;IACA,QAAA,QAAA;IACA,WAAW,QAAA,aAAS;IACpB,QAAA,QAAA;IACA,QAAA,QAAA;IACA,UAAA,QAAA;;IACU,SAAO,SACF,EADM,WAAI,CACxB,WAAc,KAAA,QAAA,WAAA,EAAP,MAAI,CAAA,CAAA,CAAA;IAEF,SAAO,SA+BE,EA/BE,MAAM,YAAK,CAC/B,YA8BkB,+BAAA;KA7Bf,UAAA,QAAA;KACA,YAAY,MAAA,QAAK,CAAI,MAAA,MAAK,GAAA,EAAA;KAC1B;KACA,SAAA,QAAA;KACA,aAAA,QAAA;KACA,cAAY,OAAK,EAAI,KAAI,MAAA;KACzB,wBAAoB,OAAO,OAAK,EAAK,MAAA,QAAQ,EAAC;;KAGvCA,KAAAA,OAAO,SAAA;YACZ;mBAAQ,UAAK,CACd,WAEmB,KAAA,QAAA,UAAA,eAAA,mBAAT,MAAK,CAAA,CAAA,CAAA,CAAA;;;KAGTA,KAAAA,OAAO,QAAA;YACZ;mBAAO,UAAK,CACb,WAEmB,KAAA,QAAA,SAAA,eAAA,mBAAT,MAAK,CAAA,CAAA,CAAA,CAAA;;;KAGTA,KAAAA,OAAO,MAAA;YACZ;mBAAK,UAAK,CACX,WAEmB,KAAA,QAAA,OAAA,eAAA,mBAAT,MAAK,CAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"ScalarCombobox.vue.script.js","names":["$slots"],"sources":["../../../src/components/ScalarCombobox/ScalarCombobox.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Combobox component\n *\n * A searchable select input with support for filtering, option groups,\n * and custom option rendering.\n *\n * @example\n * <ScalarCombobox v-model=\"selected\" :options=\"options\">\n *   <ScalarButton>{{ selected?.label ?? 'Select' }}</ScalarButton>\n * </ScalarCombobox>\n */\nexport default {}\n</script>\n\n<!-- prettier-ignore-attribute generic -->\n<script\n  setup\n  lang=\"ts\"\n  generic=\"O extends Option = Option, G extends OptionGroup<O> = OptionGroup<O>\">\nimport type { ScalarFloatingOptions } from '../ScalarFloating'\nimport ComboboxOptions from './ScalarComboboxOptions.vue'\nimport ComboboxPopover from './ScalarComboboxPopover.vue'\nimport type {\n  ComboboxEmits,\n  ComboboxSlots,\n  FilterFunction,\n  Option,\n  OptionGroup,\n  OptionsOrGroups,\n} from './types'\n\ndefineProps<\n  {\n    /** The options to display in the combobox */\n    options: OptionsOrGroups<O, G>\n    /** The placeholder text to display in the combobox */\n    placeholder?: string\n    /** A function to filter the options based on a query,\n     * if not provided, the options will be filtered by option label\n     *\n     * @see {@link FilterFunction} for more information\n     */\n    filterFn?: FilterFunction<O, G>\n  } & ScalarFloatingOptions\n>()\n\nconst emit = defineEmits<ComboboxEmits>()\n\nconst model = defineModel<O>()\n\ndefineSlots<ComboboxSlots<O, G>>()\n</script>\n<template>\n  <ComboboxPopover\n    :middleware\n    :offset\n    :placement=\"placement ?? 'bottom-start'\"\n    :resize\n    :target\n    :teleport>\n    <template #default=\"{ open }\">\n      <slot :open />\n    </template>\n    <template #popover=\"{ open, close }\">\n      <ComboboxOptions\n        :filterFn\n        :modelValue=\"model ? [model] : []\"\n        :open\n        :options\n        :placeholder\n        @add=\"() => (close(), emit('add'))\"\n        @update:modelValue=\"(v) => (close(), (model = v[0]))\">\n        <!-- Pass through the combobox slots -->\n        <template\n          v-if=\"$slots.option\"\n          #option=\"props\">\n          <slot\n            name=\"option\"\n            v-bind=\"props\" />\n        </template>\n        <template\n          v-if=\"$slots.group\"\n          #group=\"props\">\n          <slot\n            name=\"group\"\n            v-bind=\"props\" />\n        </template>\n        <template\n          v-if=\"$slots.add\"\n          #add=\"props\">\n          <slot\n            name=\"add\"\n            v-bind=\"props\" />\n        </template>\n      </ComboboxOptions>\n    </template>\n  </ComboboxPopover>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EA+CA,MAAM,OAAO;EAEb,MAAM,QAAQ,SAAc,SAAA,YAAC;;uBAK3B,YA2CkB,+BAAA;IA1Cf,YAAA,QAAA;IACA,QAAA,QAAA;IACA,WAAW,QAAA,aAAS;IACpB,QAAA,QAAA;IACA,QAAA,QAAA;IACA,UAAA,QAAA;;IACU,SAAO,SACF,EADM,WAAI,CACxB,WAAc,KAAA,QAAA,WAAA,EAAP,KAAI,CAAA,CAAA,CAAA;IAEF,SAAO,SA+BE,EA/BE,MAAM,YAAK,CAC/B,YA8BkB,+BAAA;KA7Bf,UAAA,QAAA;KACA,YAAY,MAAA,QAAK,CAAI,MAAA,KAAK,IAAA,CAAA;KAC1B;KACA,SAAA,QAAA;KACA,aAAA,QAAA;KACA,cAAY,MAAK,GAAI,KAAI,KAAA;KACzB,wBAAoB,OAAO,MAAK,GAAK,MAAA,QAAQ,EAAC;;KAGvCA,KAAAA,OAAO,SAAA;YACZ;mBAAQ,UAAK,CACd,WAEmB,KAAA,QAAA,UAAA,eAAA,mBAAT,KAAK,CAAA,CAAA,CAAA,CAAA;;;KAGTA,KAAAA,OAAO,QAAA;YACZ;mBAAO,UAAK,CACb,WAEmB,KAAA,QAAA,SAAA,eAAA,mBAAT,KAAK,CAAA,CAAA,CAAA,CAAA;;;KAGTA,KAAAA,OAAO,MAAA;YACZ;mBAAK,UAAK,CACX,WAEmB,KAAA,QAAA,OAAA,eAAA,mBAAT,KAAK,CAAA,CAAA,CAAA,CAAA"}