@auronui/vue 1.0.17 → 1.0.18

package/dist/components/switch/SwitchGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"SwitchGroup.js","names":[],"sources":["../../../src/components/switch/SwitchGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { switchGroupVariants, type SwitchGroupVariants, type SwitchVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useSwitchGroupProvide } from './switch-group.context'\n\nconst props = withDefaults(defineProps<{\n  size?: SwitchVariants['size']\n  disabled?: boolean\n  modelValue?: string[]\n  defaultValue?: string[]\n  name?: string\n  orientation?: SwitchGroupVariants['orientation']\n  label?: string\n  description?: string\n  class?: string\n}>(), {\n  size: 'md',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string[]]\n}>()\n\n// Internal state for uncontrolled mode\nconst internalValues = ref<string[]>(props.defaultValue ?? [])\n\n// Current values: controlled (modelValue) or uncontrolled (internalValues)\nconst currentValues = computed(() => props.modelValue ?? internalValues.value)\n\n// Toggle value in the selection list\nfunction toggleValue(value: string) {\n  const next = currentValues.value.includes(value)\n    ? currentValues.value.filter(v => v !== value)\n    : [...currentValues.value, value]\n  internalValues.value = next\n  emit('update:modelValue', next)\n}\n\n// Provide context to child Switches\nuseSwitchGroupProvide({\n  size: toRef(props, 'size'),\n  disabled: toRef(props, 'disabled'),\n  selectedValues: currentValues,\n  toggleValue,\n  name: toRef(props, 'name'),\n})\n\nconst labelId = `switch-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupSlots = computed(() =>\n  switchGroupVariants({ orientation: props.orientation })\n)\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :data-orientation=\"props.orientation\"\n    :class=\"composeClassName(groupSlots.base(), props.class)\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"switch-group__label\"\n    >{{ props.label }}</span>\n    <div :class=\"groupSlots.items()\">\n      <slot />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"switch-group__description\"\n    >{{ props.description }}</span>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"SwitchGroup.js","names":[],"sources":["../../../src/components/switch/SwitchGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { switchGroupVariants, type SwitchGroupVariants, type SwitchVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useSwitchGroupProvide } from './switch-group.context'\nimport SwitchInput from './Switch.vue'\n\ntype SwitchShorthandItem = { value: string; label?: string; disabled?: boolean }\n\nconst props = withDefaults(defineProps<{\n  size?: SwitchVariants['size']\n  disabled?: boolean\n  modelValue?: string[]\n  defaultValue?: string[]\n  name?: string\n  orientation?: SwitchGroupVariants['orientation']\n  label?: string\n  description?: string\n  class?: string\n  /** Shorthand API: render switches from an array instead of the compound slot API */\n  items?: SwitchShorthandItem[]\n}>(), {\n  size: 'md',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string[]]\n}>()\n\n// Internal state for uncontrolled mode\nconst internalValues = ref<string[]>(props.defaultValue ?? [])\n\n// Current values: controlled (modelValue) or uncontrolled (internalValues)\nconst currentValues = computed(() => props.modelValue ?? internalValues.value)\n\n// Toggle value in the selection list\nfunction toggleValue(value: string) {\n  const next = currentValues.value.includes(value)\n    ? currentValues.value.filter(v => v !== value)\n    : [...currentValues.value, value]\n  internalValues.value = next\n  emit('update:modelValue', next)\n}\n\n// Provide context to child Switches\nuseSwitchGroupProvide({\n  size: toRef(props, 'size'),\n  disabled: toRef(props, 'disabled'),\n  selectedValues: currentValues,\n  toggleValue,\n  name: toRef(props, 'name'),\n})\n\nconst labelId = `switch-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupSlots = computed(() =>\n  switchGroupVariants({ orientation: props.orientation })\n)\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :data-orientation=\"props.orientation\"\n    :class=\"composeClassName(groupSlots.base(), props.class)\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"switch-group__label\"\n    >{{ props.label }}</span>\n    <div :class=\"groupSlots.items()\">\n      <template v-if=\"props.items\">\n        <SwitchInput\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :disabled=\"item.disabled\"\n        >{{ item.label ?? item.value }}</SwitchInput>\n      </template>\n      <slot v-else />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"switch-group__description\"\n    >{{ props.description }}</span>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/switch/SwitchGroup.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,7 @@
 import { composeClassName } from "../../utils/composeClassName.js";
 import { useSwitchGroupProvide } from "./switch-group.context.js";
-import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, ref, renderSlot, toDisplayString, toRef, unref } from "vue";
+import Switch_default from "./Switch.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, toRef, unref, withCtx } from "vue";
 import { switchGroupVariants } from "@auronui/styles";
 //#region src/components/switch/SwitchGroup.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["aria-labelledby", "data-orientation"];
@@ -22,7 +23,8 @@ var SwitchGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 		orientation: { default: "vertical" },
 		label: { default: void 0 },
 		description: { default: void 0 },
-		class: {}
+		class: {},
+		items: {}
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
@@ -56,7 +58,16 @@ var SwitchGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 					id: labelId,
 					class: "switch-group__label"
 				}, toDisplayString(props.label), 1)) : createCommentVNode("", true),
-				createElementVNode("div", { class: normalizeClass(groupSlots.value.items()) }, [renderSlot(_ctx.$slots, "default")], 2),
+				createElementVNode("div", { class: normalizeClass(groupSlots.value.items()) }, [props.items ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(props.items, (item) => {
+					return openBlock(), createBlock(Switch_default, {
+						key: item.value,
+						value: item.value,
+						disabled: item.disabled
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(item.label ?? item.value), 1)]),
+						_: 2
+					}, 1032, ["value", "disabled"]);
+				}), 128)) : renderSlot(_ctx.$slots, "default", { key: 1 })], 2),
 				props.description ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(props.description), 1)) : createCommentVNode("", true)
 			], 10, _hoisted_1);
 		};

package/dist/components/switch/SwitchGroup.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"SwitchGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/switch/SwitchGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { switchGroupVariants, type SwitchGroupVariants, type SwitchVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useSwitchGroupProvide } from './switch-group.context'\n\nconst props = withDefaults(defineProps<{\n  size?: SwitchVariants['size']\n  disabled?: boolean\n  modelValue?: string[]\n  defaultValue?: string[]\n  name?: string\n  orientation?: SwitchGroupVariants['orientation']\n  label?: string\n  description?: string\n  class?: string\n}>(), {\n  size: 'md',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string[]]\n}>()\n\n// Internal state for uncontrolled mode\nconst internalValues = ref<string[]>(props.defaultValue ?? [])\n\n// Current values: controlled (modelValue) or uncontrolled (internalValues)\nconst currentValues = computed(() => props.modelValue ?? internalValues.value)\n\n// Toggle value in the selection list\nfunction toggleValue(value: string) {\n  const next = currentValues.value.includes(value)\n    ? currentValues.value.filter(v => v !== value)\n    : [...currentValues.value, value]\n  internalValues.value = next\n  emit('update:modelValue', next)\n}\n\n// Provide context to child Switches\nuseSwitchGroupProvide({\n  size: toRef(props, 'size'),\n  disabled: toRef(props, 'disabled'),\n  selectedValues: currentValues,\n  toggleValue,\n  name: toRef(props, 'name'),\n})\n\nconst labelId = `switch-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupSlots = computed(() =>\n  switchGroupVariants({ orientation: props.orientation })\n)\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :data-orientation=\"props.orientation\"\n    :class=\"composeClassName(groupSlots.base(), props.class)\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"switch-group__label\"\n    >{{ props.label }}</span>\n    <div :class=\"groupSlots.items()\">\n      <slot />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"switch-group__description\"\n    >{{ props.description }}</span>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAqBd,MAAM,OAAO;EAKb,MAAM,iBAAiB,IAAc,MAAM,gBAAgB,EAAE,CAAA;EAG7D,MAAM,gBAAgB,eAAe,MAAM,cAAc,eAAe,MAAK;EAG7E,SAAS,YAAY,OAAe;GAClC,MAAM,OAAO,cAAc,MAAM,SAAS,MAAK,GAC3C,cAAc,MAAM,QAAO,MAAK,MAAM,MAAK,GAC3C,CAAC,GAAG,cAAc,OAAO,MAAK;AAClC,kBAAe,QAAQ;AACvB,QAAK,qBAAqB,KAAI;;AAIhC,wBAAsB;GACpB,MAAM,MAAM,OAAO,OAAO;GAC1B,UAAU,MAAM,OAAO,WAAW;GAClC,gBAAgB;GAChB;GACA,MAAM,MAAM,OAAO,OAAO;GAC3B,CAAA;EAED,MAAM,UAAU,sBAAsB,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,MAAM,GAAG,EAAE;EAE5E,MAAM,aAAa,eACjB,oBAAoB,EAAE,aAAa,MAAM,aAAa,CAAA,CACxD;;uBAIE,mBAkBM,OAAA;IAjBJ,MAAK;IACJ,mBAAiB,MAAM,QAAQ,UAAU,KAAA;IACzC,oBAAkB,MAAM;IACxB,OAAK,eAAE,MAAA,iBAAgB,CAAC,WAAA,MAAW,MAAI,EAAI,MAAM,MAAK,CAAA;;IAG/C,MAAM,SAAA,WAAA,EADd,mBAIyB,QAAA;;KAFtB,IAAI;KACL,OAAM;uBACJ,MAAM,MAAK,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;IACf,mBAEM,OAAA,EAFA,OAAK,eAAE,WAAA,MAAW,OAAK,CAAA,EAAA,EAAA,CAC3B,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA;IAGF,MAAM,eAAA,WAAA,EADd,mBAG+B,QAH/B,YAG+B,gBAA3B,MAAM,YAAW,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA"}
+{"version":3,"file":"SwitchGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/switch/SwitchGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { switchGroupVariants, type SwitchGroupVariants, type SwitchVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useSwitchGroupProvide } from './switch-group.context'\nimport SwitchInput from './Switch.vue'\n\ntype SwitchShorthandItem = { value: string; label?: string; disabled?: boolean }\n\nconst props = withDefaults(defineProps<{\n  size?: SwitchVariants['size']\n  disabled?: boolean\n  modelValue?: string[]\n  defaultValue?: string[]\n  name?: string\n  orientation?: SwitchGroupVariants['orientation']\n  label?: string\n  description?: string\n  class?: string\n  /** Shorthand API: render switches from an array instead of the compound slot API */\n  items?: SwitchShorthandItem[]\n}>(), {\n  size: 'md',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string[]]\n}>()\n\n// Internal state for uncontrolled mode\nconst internalValues = ref<string[]>(props.defaultValue ?? [])\n\n// Current values: controlled (modelValue) or uncontrolled (internalValues)\nconst currentValues = computed(() => props.modelValue ?? internalValues.value)\n\n// Toggle value in the selection list\nfunction toggleValue(value: string) {\n  const next = currentValues.value.includes(value)\n    ? currentValues.value.filter(v => v !== value)\n    : [...currentValues.value, value]\n  internalValues.value = next\n  emit('update:modelValue', next)\n}\n\n// Provide context to child Switches\nuseSwitchGroupProvide({\n  size: toRef(props, 'size'),\n  disabled: toRef(props, 'disabled'),\n  selectedValues: currentValues,\n  toggleValue,\n  name: toRef(props, 'name'),\n})\n\nconst labelId = `switch-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupSlots = computed(() =>\n  switchGroupVariants({ orientation: props.orientation })\n)\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :data-orientation=\"props.orientation\"\n    :class=\"composeClassName(groupSlots.base(), props.class)\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"switch-group__label\"\n    >{{ props.label }}</span>\n    <div :class=\"groupSlots.items()\">\n      <template v-if=\"props.items\">\n        <SwitchInput\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :disabled=\"item.disabled\"\n        >{{ item.label ?? item.value }}</SwitchInput>\n      </template>\n      <slot v-else />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"switch-group__description\"\n    >{{ props.description }}</span>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASA,MAAM,QAAQ;EAuBd,MAAM,OAAO;EAKb,MAAM,iBAAiB,IAAc,MAAM,gBAAgB,EAAE,CAAA;EAG7D,MAAM,gBAAgB,eAAe,MAAM,cAAc,eAAe,MAAK;EAG7E,SAAS,YAAY,OAAe;GAClC,MAAM,OAAO,cAAc,MAAM,SAAS,MAAK,GAC3C,cAAc,MAAM,QAAO,MAAK,MAAM,MAAK,GAC3C,CAAC,GAAG,cAAc,OAAO,MAAK;AAClC,kBAAe,QAAQ;AACvB,QAAK,qBAAqB,KAAI;;AAIhC,wBAAsB;GACpB,MAAM,MAAM,OAAO,OAAO;GAC1B,UAAU,MAAM,OAAO,WAAW;GAClC,gBAAgB;GAChB;GACA,MAAM,MAAM,OAAO,OAAO;GAC3B,CAAA;EAED,MAAM,UAAU,sBAAsB,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,MAAM,GAAG,EAAE;EAE5E,MAAM,aAAa,eACjB,oBAAoB,EAAE,aAAa,MAAM,aAAa,CAAA,CACxD;;uBAIE,mBA0BM,OAAA;IAzBJ,MAAK;IACJ,mBAAiB,MAAM,QAAQ,UAAU,KAAA;IACzC,oBAAkB,MAAM;IACxB,OAAK,eAAE,MAAA,iBAAgB,CAAC,WAAA,MAAW,MAAI,EAAI,MAAM,MAAK,CAAA;;IAG/C,MAAM,SAAA,WAAA,EADd,mBAIyB,QAAA;;KAFtB,IAAI;KACL,OAAM;uBACJ,MAAM,MAAK,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;IACf,mBAUM,OAAA,EAVA,OAAK,eAAE,WAAA,MAAW,OAAK,CAAA,EAAA,EAAA,CACX,MAAM,SAAA,UAAA,KAAA,EACpB,mBAK6C,UAAA,EAAA,KAAA,GAAA,EAAA,WAJ5B,MAAM,QAAd,SAAI;yBADb,YAK6C,gBAAA;MAH1C,KAAK,KAAK;MACV,OAAO,KAAK;MACZ,UAAU,KAAK;;6BACa,CAAA,gBAAA,gBAA3B,KAAK,SAAS,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;;gBAE9B,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,EAAA,EAAA;IAGT,MAAM,eAAA,WAAA,EADd,mBAG+B,QAH/B,YAG+B,gBAA3B,MAAM,YAAW,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA"}

package/dist/components/tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","names":[],"sources":["../../../src/components/tabs/Tabs.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef, watch } from 'vue'\nimport { TabsRoot } from 'reka-ui'\nimport { tabsVariants, type TabsVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useTabsProvide } from './tabs.context'\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string\n  defaultValue?: string\n  orientation?: 'horizontal' | 'vertical'\n  variant?: TabsVariants['variant']\n  activationMode?: 'automatic' | 'manual'\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n}>(), {\n  orientation: 'horizontal',\n  variant: 'primary',\n  activationMode: 'automatic',\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n}>()\n\nconst internalValue = ref<string | undefined>(props.modelValue ?? props.defaultValue)\n\nwatch(() => props.modelValue, (v) => {\n  if (v !== undefined) internalValue.value = v\n})\n\nfunction changeTab(value: string) {\n  internalValue.value = value\n  emit('update:modelValue', value)\n}\n\nconst slotFns = computed(() => tabsVariants({ variant: props.variant }))\n\nuseTabsProvide({\n  slotFns,\n  orientation: toRef(props, 'orientation'),\n  currentValue: internalValue,\n  changeTab,\n})\n</script>\n\n<template>\n  <TabsRoot\n    :model-value=\"internalValue\"\n    :orientation=\"props.orientation\"\n    :activation-mode=\"props.activationMode\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :data-orientation=\"props.orientation\"\n    @update:model-value=\"changeTab\"\n  >\n    <slot />\n  </TabsRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"Tabs.js","names":[],"sources":["../../../src/components/tabs/Tabs.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef, watch } from 'vue'\nimport { TabsRoot } from 'reka-ui'\nimport { tabsVariants, type TabsVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useTabsProvide } from './tabs.context'\nimport TabList from './TabList.vue'\nimport Tab from './Tab.vue'\nimport TabPanel from './TabPanel.vue'\n\ntype TabShorthandItem = { value: string; label: string; content?: string; disabled?: boolean }\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string\n  defaultValue?: string\n  orientation?: 'horizontal' | 'vertical'\n  variant?: TabsVariants['variant']\n  activationMode?: 'automatic' | 'manual'\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render tabs from an array instead of the compound slot API */\n  items?: TabShorthandItem[]\n}>(), {\n  orientation: 'horizontal',\n  variant: 'primary',\n  activationMode: 'automatic',\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n}>()\n\nconst internalValue = ref<string | undefined>(props.modelValue ?? props.defaultValue)\n\nwatch(() => props.modelValue, (v) => {\n  if (v !== undefined) internalValue.value = v\n})\n\nwatch(\n  () => props.items,\n  (items) => {\n    if (items && items.length > 0 && !props.modelValue && !props.defaultValue && internalValue.value === undefined) {\n      internalValue.value = items[0].value\n    }\n  },\n  { immediate: true },\n)\n\nfunction changeTab(value: string) {\n  internalValue.value = value\n  emit('update:modelValue', value)\n}\n\nconst slotFns = computed(() => tabsVariants({ variant: props.variant }))\n\nuseTabsProvide({\n  slotFns,\n  orientation: toRef(props, 'orientation'),\n  currentValue: internalValue,\n  changeTab,\n})\n</script>\n\n<template>\n  <TabsRoot\n    :model-value=\"internalValue\"\n    :orientation=\"props.orientation\"\n    :activation-mode=\"props.activationMode\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :data-orientation=\"props.orientation\"\n    @update:model-value=\"changeTab\"\n  >\n    <template v-if=\"props.items\">\n      <TabList>\n        <Tab\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :disabled=\"item.disabled\"\n        >{{ item.label }}</Tab>\n      </TabList>\n      <TabPanel\n        v-for=\"item in props.items\"\n        :key=\"item.value\"\n        :value=\"item.value\"\n      >{{ item.content }}</TabPanel>\n    </template>\n    <slot v-else />\n  </TabsRoot>\n</template>\n"],"mappings":""}

package/dist/components/tabs/Tabs.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,9 @@
 import { composeClassName } from "../../utils/composeClassName.js";
 import { useTabsProvide } from "./tabs.context.js";
-import { computed, createBlock, defineComponent, normalizeClass, openBlock, ref, renderSlot, toRef, unref, watch, withCtx } from "vue";
+import TabList_default from "./TabList.js";
+import Tab_default from "./Tab.js";
+import TabPanel_default from "./TabPanel.js";
+import { Fragment, computed, createBlock, createElementBlock, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, toRef, unref, watch, withCtx } from "vue";
 import { tabsVariants } from "@auronui/styles";
 import { TabsRoot } from "reka-ui";
 //#region src/components/tabs/Tabs.vue?vue&type=script&setup=true&lang.ts
@@ -19,7 +22,8 @@ var Tabs_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
 			Object,
 			Array
 		] },
-		classNames: {}
+		classNames: {},
+		items: {}
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
@@ -29,6 +33,9 @@ var Tabs_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
 		watch(() => props.modelValue, (v) => {
 			if (v !== void 0) internalValue.value = v;
 		});
+		watch(() => props.items, (items) => {
+			if (items && items.length > 0 && !props.modelValue && !props.defaultValue && internalValue.value === void 0) internalValue.value = items[0].value;
+		}, { immediate: true });
 		function changeTab(value) {
 			internalValue.value = value;
 			emit("update:modelValue", value);
@@ -49,7 +56,27 @@ var Tabs_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
 				"data-orientation": props.orientation,
 				"onUpdate:modelValue": changeTab
 			}, {
-				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				default: withCtx(() => [props.items ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createVNode(TabList_default, null, {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(props.items, (item) => {
+						return openBlock(), createBlock(Tab_default, {
+							key: item.value,
+							value: item.value,
+							disabled: item.disabled
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(item.label), 1)]),
+							_: 2
+						}, 1032, ["value", "disabled"]);
+					}), 128))]),
+					_: 1
+				}), (openBlock(true), createElementBlock(Fragment, null, renderList(props.items, (item) => {
+					return openBlock(), createBlock(TabPanel_default, {
+						key: item.value,
+						value: item.value
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(item.content), 1)]),
+						_: 2
+					}, 1032, ["value"]);
+				}), 128))], 64)) : renderSlot(_ctx.$slots, "default", { key: 1 })]),
 				_: 3
 			}, 8, [
 				"model-value",

package/dist/components/tabs/Tabs.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/tabs/Tabs.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef, watch } from 'vue'\nimport { TabsRoot } from 'reka-ui'\nimport { tabsVariants, type TabsVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useTabsProvide } from './tabs.context'\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string\n  defaultValue?: string\n  orientation?: 'horizontal' | 'vertical'\n  variant?: TabsVariants['variant']\n  activationMode?: 'automatic' | 'manual'\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n}>(), {\n  orientation: 'horizontal',\n  variant: 'primary',\n  activationMode: 'automatic',\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n}>()\n\nconst internalValue = ref<string | undefined>(props.modelValue ?? props.defaultValue)\n\nwatch(() => props.modelValue, (v) => {\n  if (v !== undefined) internalValue.value = v\n})\n\nfunction changeTab(value: string) {\n  internalValue.value = value\n  emit('update:modelValue', value)\n}\n\nconst slotFns = computed(() => tabsVariants({ variant: props.variant }))\n\nuseTabsProvide({\n  slotFns,\n  orientation: toRef(props, 'orientation'),\n  currentValue: internalValue,\n  changeTab,\n})\n</script>\n\n<template>\n  <TabsRoot\n    :model-value=\"internalValue\"\n    :orientation=\"props.orientation\"\n    :activation-mode=\"props.activationMode\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :data-orientation=\"props.orientation\"\n    @update:model-value=\"changeTab\"\n  >\n    <slot />\n  </TabsRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAOA,MAAM,QAAQ;EAiBd,MAAM,OAAO;EAIb,MAAM,gBAAgB,IAAwB,MAAM,cAAc,MAAM,aAAY;AAEpF,cAAY,MAAM,aAAa,MAAM;AACnC,OAAI,MAAM,KAAA,EAAW,eAAc,QAAQ;IAC5C;EAED,SAAS,UAAU,OAAe;AAChC,iBAAc,QAAQ;AACtB,QAAK,qBAAqB,MAAK;;EAGjC,MAAM,UAAU,eAAe,aAAa,EAAE,SAAS,MAAM,SAAS,CAAC,CAAA;AAEvE,iBAAe;GACb;GACA,aAAa,MAAM,OAAO,cAAc;GACxC,cAAc;GACd;GACD,CAAA;;uBAIC,YASW,MAAA,SAAA,EAAA;IARR,eAAa,cAAA;IACb,aAAa,MAAM;IACnB,mBAAiB,MAAM;IACvB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,OAAO,MAAM,YAAY,KAAI,CAAA;IAC3E,oBAAkB,MAAM;IACxB,uBAAoB;;2BAEb,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"Tabs.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/tabs/Tabs.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef, watch } from 'vue'\nimport { TabsRoot } from 'reka-ui'\nimport { tabsVariants, type TabsVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useTabsProvide } from './tabs.context'\nimport TabList from './TabList.vue'\nimport Tab from './Tab.vue'\nimport TabPanel from './TabPanel.vue'\n\ntype TabShorthandItem = { value: string; label: string; content?: string; disabled?: boolean }\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string\n  defaultValue?: string\n  orientation?: 'horizontal' | 'vertical'\n  variant?: TabsVariants['variant']\n  activationMode?: 'automatic' | 'manual'\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render tabs from an array instead of the compound slot API */\n  items?: TabShorthandItem[]\n}>(), {\n  orientation: 'horizontal',\n  variant: 'primary',\n  activationMode: 'automatic',\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n}>()\n\nconst internalValue = ref<string | undefined>(props.modelValue ?? props.defaultValue)\n\nwatch(() => props.modelValue, (v) => {\n  if (v !== undefined) internalValue.value = v\n})\n\nwatch(\n  () => props.items,\n  (items) => {\n    if (items && items.length > 0 && !props.modelValue && !props.defaultValue && internalValue.value === undefined) {\n      internalValue.value = items[0].value\n    }\n  },\n  { immediate: true },\n)\n\nfunction changeTab(value: string) {\n  internalValue.value = value\n  emit('update:modelValue', value)\n}\n\nconst slotFns = computed(() => tabsVariants({ variant: props.variant }))\n\nuseTabsProvide({\n  slotFns,\n  orientation: toRef(props, 'orientation'),\n  currentValue: internalValue,\n  changeTab,\n})\n</script>\n\n<template>\n  <TabsRoot\n    :model-value=\"internalValue\"\n    :orientation=\"props.orientation\"\n    :activation-mode=\"props.activationMode\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :data-orientation=\"props.orientation\"\n    @update:model-value=\"changeTab\"\n  >\n    <template v-if=\"props.items\">\n      <TabList>\n        <Tab\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :disabled=\"item.disabled\"\n        >{{ item.label }}</Tab>\n      </TabList>\n      <TabPanel\n        v-for=\"item in props.items\"\n        :key=\"item.value\"\n        :value=\"item.value\"\n      >{{ item.content }}</TabPanel>\n    </template>\n    <slot v-else />\n  </TabsRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYA,MAAM,QAAQ;EAmBd,MAAM,OAAO;EAIb,MAAM,gBAAgB,IAAwB,MAAM,cAAc,MAAM,aAAY;AAEpF,cAAY,MAAM,aAAa,MAAM;AACnC,OAAI,MAAM,KAAA,EAAW,eAAc,QAAQ;IAC5C;AAED,cACQ,MAAM,QACX,UAAU;AACT,OAAI,SAAS,MAAM,SAAS,KAAK,CAAC,MAAM,cAAc,CAAC,MAAM,gBAAgB,cAAc,UAAU,KAAA,EACnG,eAAc,QAAQ,MAAM,GAAG;KAGnC,EAAE,WAAW,MAAM,CACrB;EAEA,SAAS,UAAU,OAAe;AAChC,iBAAc,QAAQ;AACtB,QAAK,qBAAqB,MAAK;;EAGjC,MAAM,UAAU,eAAe,aAAa,EAAE,SAAS,MAAM,SAAS,CAAC,CAAA;AAEvE,iBAAe;GACb;GACA,aAAa,MAAM,OAAO,cAAc;GACxC,cAAc;GACd;GACD,CAAA;;uBAIC,YAwBW,MAAA,SAAA,EAAA;IAvBR,eAAa,cAAA;IACb,aAAa,MAAM;IACnB,mBAAiB,MAAM;IACvB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,OAAO,MAAM,YAAY,KAAI,CAAA;IAC3E,oBAAkB,MAAM;IACxB,uBAAoB;;2BAgBV,CAdK,MAAM,SAAA,WAAA,EAAtB,mBAcW,UAAA,EAAA,KAAA,GAAA,EAAA,CAbT,YAOU,iBAAA,MAAA;4BALqB,EAAA,UAAA,KAAA,EAD7B,mBAKuB,UAAA,MAAA,WAJN,MAAM,QAAd,SAAI;0BADb,YAKuB,aAAA;OAHpB,KAAK,KAAK;OACV,OAAO,KAAK;OACZ,UAAU,KAAK;;8BACD,CAAA,gBAAA,gBAAb,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;;;;0BAEhB,mBAI8B,UAAA,MAAA,WAHb,MAAM,QAAd,SAAI;yBADb,YAI8B,kBAAA;MAF3B,KAAK,KAAK;MACV,OAAO,KAAK;;6BACI,CAAA,gBAAA,gBAAf,KAAK,QAAO,EAAA,EAAA,CAAA,CAAA;;;uBAElB,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA"}

package/dist/components/toolbar/ToolbarToggleGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarToggleGroup.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleGroup as RekaToolbarToggleGroup } from 'reka-ui'\nimport { toggleButtonGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarInject } from './toolbar.context'\n\ntype Single = string\ntype Multi = string[]\n\nconst props = defineProps<{\n  type: 'single' | 'multiple'\n  modelValue?: Single | Multi\n  defaultValue?: Single | Multi\n  disabled?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  isDetached?: boolean\n  class?: string\n}>()\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: Single | Multi]\n}>()\n\nconst ctx = useToolbarInject({ orientation: computed(() => 'horizontal' as const) })\nconst orientation = computed(() => props.orientation ?? ctx.orientation.value)\n\nconst classes = computed(() =>\n  toggleButtonGroupVariants({ orientation: orientation.value, isDetached: props.isDetached ?? false }).base()\n)\n</script>\n\n<template>\n  <RekaToolbarToggleGroup\n    :type=\"props.type\"\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"props.disabled\"\n    :class=\"composeClassName(classes, props.class)\"\n    @update:model-value=\"(v) => emit('update:modelValue', v as Single | Multi)\"\n  >\n    <slot />\n  </RekaToolbarToggleGroup>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToolbarToggleGroup.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleGroup as RekaToolbarToggleGroup } from 'reka-ui'\nimport { toggleButtonGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarInject } from './toolbar.context'\nimport ToolbarToggleItem from './ToolbarToggleItem.vue'\n\ntype Single = string\ntype Multi = string[]\ntype ToolbarToggleShorthandItem = { value: string; label?: string; variant?: string; size?: string; isIconOnly?: boolean; disabled?: boolean; class?: string }\n\nconst props = defineProps<{\n  type: 'single' | 'multiple'\n  modelValue?: Single | Multi\n  defaultValue?: Single | Multi\n  disabled?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  isDetached?: boolean\n  class?: string\n  /** Shorthand API: render toggle items from an array instead of the compound slot API */\n  items?: ToolbarToggleShorthandItem[]\n}>()\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: Single | Multi]\n}>()\n\nconst ctx = useToolbarInject({ orientation: computed(() => 'horizontal' as const) })\nconst orientation = computed(() => props.orientation ?? ctx.orientation.value)\n\nconst classes = computed(() =>\n  toggleButtonGroupVariants({ orientation: orientation.value, isDetached: props.isDetached ?? false }).base()\n)\n</script>\n\n<template>\n  <RekaToolbarToggleGroup\n    :type=\"props.type\"\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"props.disabled\"\n    :class=\"composeClassName(classes, props.class)\"\n    @update:model-value=\"(v) => emit('update:modelValue', v as Single | Multi)\"\n  >\n    <template v-if=\"props.items\">\n      <ToolbarToggleItem\n        v-for=\"item in props.items\"\n        :key=\"item.value\"\n        :value=\"item.value\"\n        :variant=\"item.variant\"\n        :size=\"item.size\"\n        :is-icon-only=\"item.isIconOnly\"\n        :disabled=\"item.disabled\"\n        :class=\"item.class\"\n      >{{ item.label }}</ToolbarToggleItem>\n    </template>\n    <slot v-else />\n  </RekaToolbarToggleGroup>\n</template>\n"],"mappings":""}

package/dist/components/toolbar/ToolbarToggleGroup.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,7 @@
 import { composeClassName } from "../../utils/composeClassName.js";
 import { useToolbarInject } from "./toolbar.context.js";
-import { computed, createBlock, defineComponent, normalizeClass, openBlock, renderSlot, unref, withCtx } from "vue";
+import ToolbarToggleItem_default from "./ToolbarToggleItem.js";
+import { Fragment, computed, createBlock, createElementBlock, createTextVNode, defineComponent, normalizeClass, openBlock, renderList, renderSlot, toDisplayString, unref, withCtx } from "vue";
 import { toggleButtonGroupVariants } from "@auronui/styles";
 import { ToolbarToggleGroup } from "reka-ui";
 //#region src/components/toolbar/ToolbarToggleGroup.vue?vue&type=script&setup=true&lang.ts
@@ -13,7 +14,8 @@ var ToolbarToggleGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 		disabled: { type: Boolean },
 		orientation: {},
 		isDetached: { type: Boolean },
-		class: {}
+		class: {},
+		items: {}
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
@@ -34,7 +36,27 @@ var ToolbarToggleGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 				class: normalizeClass(unref(composeClassName)(classes.value, props.class)),
 				"onUpdate:modelValue": _cache[0] || (_cache[0] = (v) => emit("update:modelValue", v))
 			}, {
-				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				default: withCtx(() => [props.items ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(props.items, (item) => {
+					return openBlock(), createBlock(ToolbarToggleItem_default, {
+						key: item.value,
+						value: item.value,
+						variant: item.variant,
+						size: item.size,
+						"is-icon-only": item.isIconOnly,
+						disabled: item.disabled,
+						class: normalizeClass(item.class)
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(item.label), 1)]),
+						_: 2
+					}, 1032, [
+						"value",
+						"variant",
+						"size",
+						"is-icon-only",
+						"disabled",
+						"class"
+					]);
+				}), 128)) : renderSlot(_ctx.$slots, "default", { key: 1 })]),
 				_: 3
 			}, 8, [
 				"type",

package/dist/components/toolbar/ToolbarToggleGroup.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarToggleGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleGroup as RekaToolbarToggleGroup } from 'reka-ui'\nimport { toggleButtonGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarInject } from './toolbar.context'\n\ntype Single = string\ntype Multi = string[]\n\nconst props = defineProps<{\n  type: 'single' | 'multiple'\n  modelValue?: Single | Multi\n  defaultValue?: Single | Multi\n  disabled?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  isDetached?: boolean\n  class?: string\n}>()\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: Single | Multi]\n}>()\n\nconst ctx = useToolbarInject({ orientation: computed(() => 'horizontal' as const) })\nconst orientation = computed(() => props.orientation ?? ctx.orientation.value)\n\nconst classes = computed(() =>\n  toggleButtonGroupVariants({ orientation: orientation.value, isDetached: props.isDetached ?? false }).base()\n)\n</script>\n\n<template>\n  <RekaToolbarToggleGroup\n    :type=\"props.type\"\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"props.disabled\"\n    :class=\"composeClassName(classes, props.class)\"\n    @update:model-value=\"(v) => emit('update:modelValue', v as Single | Multi)\"\n  >\n    <slot />\n  </RekaToolbarToggleGroup>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EAUA,MAAM,QAAQ;EAUd,MAAM,OAAO;EAIb,MAAM,MAAM,iBAAiB,EAAE,aAAa,eAAe,aAAsB,EAAE,CAAA;EACnF,MAAM,cAAc,eAAe,MAAM,eAAe,IAAI,YAAY,MAAK;EAE7E,MAAM,UAAU,eACd,0BAA0B;GAAE,aAAa,YAAY;GAAO,YAAY,MAAM,cAAc;GAAO,CAAC,CAAC,MAAK,CAC5G;;uBAIE,YASyB,MAAA,mBAAA,EAAA;IARtB,MAAM,MAAM;IACZ,eAAa,MAAM;IACnB,iBAAe,MAAM;IACrB,UAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,MAAK,CAAA;IAC5C,uBAAkB,OAAA,OAAA,OAAA,MAAG,MAAM,KAAI,qBAAsB,EAAC;;2BAE/C,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ToolbarToggleGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleGroup as RekaToolbarToggleGroup } from 'reka-ui'\nimport { toggleButtonGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarInject } from './toolbar.context'\nimport ToolbarToggleItem from './ToolbarToggleItem.vue'\n\ntype Single = string\ntype Multi = string[]\ntype ToolbarToggleShorthandItem = { value: string; label?: string; variant?: string; size?: string; isIconOnly?: boolean; disabled?: boolean; class?: string }\n\nconst props = defineProps<{\n  type: 'single' | 'multiple'\n  modelValue?: Single | Multi\n  defaultValue?: Single | Multi\n  disabled?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  isDetached?: boolean\n  class?: string\n  /** Shorthand API: render toggle items from an array instead of the compound slot API */\n  items?: ToolbarToggleShorthandItem[]\n}>()\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: Single | Multi]\n}>()\n\nconst ctx = useToolbarInject({ orientation: computed(() => 'horizontal' as const) })\nconst orientation = computed(() => props.orientation ?? ctx.orientation.value)\n\nconst classes = computed(() =>\n  toggleButtonGroupVariants({ orientation: orientation.value, isDetached: props.isDetached ?? false }).base()\n)\n</script>\n\n<template>\n  <RekaToolbarToggleGroup\n    :type=\"props.type\"\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"props.disabled\"\n    :class=\"composeClassName(classes, props.class)\"\n    @update:model-value=\"(v) => emit('update:modelValue', v as Single | Multi)\"\n  >\n    <template v-if=\"props.items\">\n      <ToolbarToggleItem\n        v-for=\"item in props.items\"\n        :key=\"item.value\"\n        :value=\"item.value\"\n        :variant=\"item.variant\"\n        :size=\"item.size\"\n        :is-icon-only=\"item.isIconOnly\"\n        :disabled=\"item.disabled\"\n        :class=\"item.class\"\n      >{{ item.label }}</ToolbarToggleItem>\n    </template>\n    <slot v-else />\n  </RekaToolbarToggleGroup>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAYA,MAAM,QAAQ;EAYd,MAAM,OAAO;EAIb,MAAM,MAAM,iBAAiB,EAAE,aAAa,eAAe,aAAsB,EAAE,CAAA;EACnF,MAAM,cAAc,eAAe,MAAM,eAAe,IAAI,YAAY,MAAK;EAE7E,MAAM,UAAU,eACd,0BAA0B;GAAE,aAAa,YAAY;GAAO,YAAY,MAAM,cAAc;GAAO,CAAC,CAAC,MAAK,CAC5G;;uBAIE,YAqByB,MAAA,mBAAA,EAAA;IApBtB,MAAM,MAAM;IACZ,eAAa,MAAM;IACnB,iBAAe,MAAM;IACrB,UAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,MAAK,CAAA;IAC5C,uBAAkB,OAAA,OAAA,OAAA,MAAG,MAAM,KAAI,qBAAsB,EAAC;;2BAa5C,CAXK,MAAM,SAAA,UAAA,KAAA,EACpB,mBASqC,UAAA,EAAA,KAAA,GAAA,EAAA,WARpB,MAAM,QAAd,SAAI;yBADb,YASqC,2BAAA;MAPlC,KAAK,KAAK;MACV,OAAO,KAAK;MACZ,SAAS,KAAK;MACd,MAAM,KAAK;MACX,gBAAc,KAAK;MACnB,UAAU,KAAK;MACf,OAAK,eAAE,KAAK,MAAK;;6BACH,CAAA,gBAAA,gBAAb,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;;;;;;;;;gBAEhB,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA"}

package/dist/index.d.ts

@@ -1141,7 +1141,8 @@ format: ColorFormat;
 
 declare const __VLS_component_17: DefineComponent<__VLS_Props_18, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_18> & Readonly<{}>, {
 size: "md" | "sm" | "lg" | "xs" | "xl";
-variant: "danger" | "success" | "warning" | "primary" | "secondary" | "danger-soft" | "ghost" | "outline" | "success-soft" | "tertiary" | "warning-soft";
+variant: "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "soft" | "solid" | "outline" | "ghost" | "tertiary" | "danger-soft" | "success-soft" | "warning-soft";
+color: "default" | "danger" | "success" | "warning" | "primary";
 fullWidth: boolean;
 isIconOnly: boolean;
 isLoading: boolean;
@@ -1157,7 +1158,8 @@ declare const __VLS_component_18: DefineComponent<__VLS_Props_19, {}, {}, {}, {}
 "onUpdate:modelValue"?: ((value: ButtonGroupValue) => any) | undefined;
 }>, {
 size: "md" | "sm" | "lg" | "xs" | "xl";
-variant: "danger" | "success" | "warning" | "primary" | "secondary" | "danger-soft" | "ghost" | "outline" | "success-soft" | "tertiary" | "warning-soft";
+variant: "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "soft" | "solid" | "outline" | "ghost" | "tertiary" | "danger-soft" | "success-soft" | "warning-soft";
+color: "default" | "danger" | "success" | "warning" | "primary";
 fullWidth: boolean;
 orientation: "horizontal" | "vertical";
 disabled: boolean;
@@ -1903,6 +1905,8 @@ declare type __VLS_Props_106 = {
     classNames?: Partial<{
         base: ClassValue;
     }>;
+    /** Shorthand API: render list items from an array instead of the compound slot API */
+    items?: ListBoxShorthandItem[];
 };
 
 declare type __VLS_Props_107 = {
@@ -2259,6 +2263,8 @@ declare type __VLS_Props_142 = {
     total?: number;
     renderCount?: (count: number) => string;
     class?: string;
+    /** Shorthand API: render avatars from an array instead of the compound slot API */
+    avatars?: AvatarShorthandItem[];
 };
 
 declare type __VLS_Props_143 = {
@@ -2319,6 +2325,8 @@ declare type __VLS_Props_147 = {
     classNames?: Partial<{
         base: ClassValue;
     }>;
+    /** Shorthand API: render steps from an array instead of the compound slot API */
+    items?: StepperShorthandItem[];
 };
 
 declare type __VLS_Props_148 = {
@@ -2849,6 +2857,7 @@ declare type __VLS_Props_176 = {
 
 declare type __VLS_Props_18 = {
     variant?: ButtonVariants['variant'];
+    color?: ButtonVariants['color'];
     size?: ButtonVariants['size'];
     radius?: ButtonVariants['radius'];
     isIconOnly?: boolean;
@@ -2870,6 +2879,7 @@ declare type __VLS_Props_18 = {
 
 declare type __VLS_Props_19 = {
     variant?: ButtonVariants['variant'];
+    color?: ButtonVariants['color'];
     size?: ButtonVariants['size'];
     disabled?: boolean;
     fullWidth?: boolean;
@@ -2881,6 +2891,8 @@ declare type __VLS_Props_19 = {
     }>;
     selectionMode?: ButtonGroupSelectionMode;
     modelValue?: ButtonGroupValue;
+    /** Shorthand API: render buttons from an array instead of the compound slot API */
+    buttons?: ButtonShorthandItem[];
 };
 
 declare type __VLS_Props_2 = {
@@ -2923,6 +2935,8 @@ declare type __VLS_Props_22 = {
     classNames?: Partial<{
         base: ClassValue;
     }>;
+    /** Shorthand API: render toggle buttons from an array instead of the compound slot API */
+    buttons?: ToggleButtonShorthandItem[];
 };
 
 declare type __VLS_Props_23 = {
@@ -3054,6 +3068,8 @@ declare type __VLS_Props_31 = {
     label?: string;
     description?: string;
     class?: string;
+    /** Shorthand API: render checkboxes from an array instead of the compound slot API */
+    items?: CheckboxShorthandItem[];
 };
 
 declare type __VLS_Props_32 = {
@@ -3080,6 +3096,8 @@ declare type __VLS_Props_33 = {
     label?: string;
     description?: string;
     class?: string;
+    /** Shorthand API: render radio options from an array instead of the compound slot API */
+    items?: RadioShorthandItem[];
 };
 
 declare type __VLS_Props_34 = {
@@ -3109,6 +3127,8 @@ declare type __VLS_Props_35 = {
     label?: string;
     description?: string;
     class?: string;
+    /** Shorthand API: render switches from an array instead of the compound slot API */
+    items?: SwitchShorthandItem[];
 };
 
 declare type __VLS_Props_36 = {
@@ -3372,6 +3392,8 @@ declare type __VLS_Props_73 = {
     classNames?: Partial<{
         base: ClassValue;
     }>;
+    /** Shorthand API: render tabs from an array instead of the compound slot API */
+    items?: TabShorthandItem[];
 };
 
 declare type __VLS_Props_74 = {
@@ -3425,6 +3447,8 @@ declare type __VLS_Props_78 = {
     classNames?: Partial<{
         base: ClassValue;
     }>;
+    /** Shorthand API: render items from an array instead of the compound slot API */
+    items?: AccordionShorthandItem[];
 };
 
 declare type __VLS_Props_79 = {
@@ -3511,6 +3535,8 @@ declare type __VLS_Props_86 = {
     classNames?: Partial<{
         base: ClassValue;
     }>;
+    /** Shorthand API: render collapsibles from an array instead of the compound slot API */
+    items?: CollapsibleShorthandItem[];
 };
 
 declare type __VLS_Props_87 = {
@@ -3521,6 +3547,8 @@ declare type __VLS_Props_87 = {
         base: ClassValue;
         item: ClassValue;
     }>;
+    /** Shorthand API: render breadcrumb items from an array instead of the compound slot API */
+    items?: BreadcrumbShorthandItem[];
 };
 
 declare type __VLS_Props_88 = {
@@ -3584,6 +3612,8 @@ declare type __VLS_Props_93 = {
     orientation?: 'horizontal' | 'vertical';
     isDetached?: boolean;
     class?: string;
+    /** Shorthand API: render toggle items from an array instead of the compound slot API */
+    items?: ToolbarToggleShorthandItem[];
 };
 
 declare type __VLS_Props_94 = {
@@ -7059,6 +7089,13 @@ export declare const AccordionHeader: __VLS_WithTemplateSlots_71<typeof __VLS_co
 
 export declare const AccordionItem: __VLS_WithTemplateSlots_70<typeof __VLS_component_70, __VLS_TemplateResult_70["slots"]>;
 
+declare type AccordionShorthandItem = {
+    value: string;
+    title: string;
+    content?: string;
+    disabled?: boolean;
+};
+
 export declare const AccordionTrigger: __VLS_WithTemplateSlots_72<typeof __VLS_component_72, __VLS_TemplateResult_72["slots"]>;
 
 export declare const Alert: __VLS_WithTemplateSlots_85<typeof __VLS_component_85, __VLS_TemplateResult_85["slots"]>;
@@ -7249,6 +7286,17 @@ export declare interface AvatarGroupContext {
     isInGroup: Ref<boolean>;
 }
 
+declare type AvatarShorthandItem = {
+    src?: string;
+    alt?: string;
+    name?: string;
+    color?: string;
+    variant?: string;
+    isBordered?: boolean;
+    isDisabled?: boolean;
+    showFallback?: boolean;
+};
+
 export declare const Badge: __VLS_WithTemplateSlots_8<typeof __VLS_component_8, __VLS_TemplateResult_8["slots"]>;
 
 export { BadgeVariants }
@@ -7257,12 +7305,18 @@ export declare const BreadcrumbItem: __VLS_WithTemplateSlots_79<typeof __VLS_com
 
 export declare const Breadcrumbs: __VLS_WithTemplateSlots_78<typeof __VLS_component_78, __VLS_TemplateResult_78["slots"]>;
 
+declare type BreadcrumbShorthandItem = {
+    label: string;
+    href?: string;
+};
+
 export declare const Button: __VLS_WithTemplateSlots_17<typeof __VLS_component_17, __VLS_TemplateResult_17["slots"]>;
 
 export declare const ButtonGroup: __VLS_WithTemplateSlots_18<typeof __VLS_component_18, __VLS_TemplateResult_18["slots"]>;
 
 export declare interface ButtonGroupContext {
     variant: Ref<ButtonVariants['variant']>;
+    color: Ref<ButtonVariants['color']>;
     size: Ref<ButtonVariants['size']>;
     disabled: Ref<boolean>;
     fullWidth: Ref<boolean>;
@@ -7277,6 +7331,16 @@ declare type ButtonGroupSelectionMode = 'single' | 'multiple';
 
 declare type ButtonGroupValue = string | number | null | Array<string | number>;
 
+declare type ButtonShorthandItem = {
+    label: string;
+    value?: string | number;
+    disabled?: boolean;
+    isLoading?: boolean;
+    variant?: ButtonVariants['variant'];
+    color?: ButtonVariants['color'];
+    class?: string;
+};
+
 export { ButtonVariants }
 
 export declare const Calendar: DefineComponent<__VLS_PublicProps_7, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
@@ -7331,6 +7395,12 @@ export declare interface CheckboxGroupContext {
 
 export declare const checkboxGroupContextKey: InjectionKey<CheckboxGroupContext>;
 
+declare type CheckboxShorthandItem = {
+    value: string;
+    label?: string;
+    disabled?: boolean;
+};
+
 export { ChipVariants }
 export { ChipVariants as TagVariants }
 
@@ -7356,6 +7426,13 @@ export declare const CollapsibleContent: __VLS_WithTemplateSlots_76<typeof __VLS
 
 export declare const CollapsibleGroup: __VLS_WithTemplateSlots_77<typeof __VLS_component_77, __VLS_TemplateResult_77["slots"]>;
 
+declare type CollapsibleShorthandItem = {
+    title: string;
+    content?: string;
+    defaultOpen?: boolean;
+    disabled?: boolean;
+};
+
 export declare const CollapsibleTrigger: __VLS_WithTemplateSlots_75<typeof __VLS_component_75, __VLS_TemplateResult_75["slots"]>;
 
 export declare const ColorArea: DefineComponent<__VLS_Props_170, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
@@ -7806,6 +7883,13 @@ export declare function composeSlotClassName<V extends Record<string, unknown>>(
 
  export { ListBoxSectionVariants }
 
+ declare type ListBoxShorthandItem = {
+     value: string;
+     label?: string;
+     disabled?: boolean;
+     textValue?: string;
+ };
+
  export { ListBoxVariants }
 
  export declare interface ListData<T> {
@@ -8602,6 +8686,12 @@ export declare function composeSlotClassName<V extends Record<string, unknown>>(
 
  export declare const radioGroupContextKey: InjectionKey<RadioGroupContext>;
 
+ declare type RadioShorthandItem = {
+     value: string;
+     label?: string;
+     disabled?: boolean;
+ };
+
  export declare const RangeCalendar: DefineComponent<__VLS_PublicProps_8, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
  "update:modelValue": (value: DateRange | null) => any;
  }, string, PublicProps, Readonly<__VLS_PublicProps_8> & Readonly<{
@@ -8759,6 +8849,11 @@ export declare function composeSlotClassName<V extends Record<string, unknown>>(
  }>;
  }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
+ declare type StepperShorthandItem = {
+     title?: string;
+     description?: string;
+ };
+
  export declare const StepperTitle: __VLS_WithTemplateSlots_146<typeof __VLS_component_146, __VLS_TemplateResult_146["slots"]>;
 
  export { StepperVariants }
@@ -8802,6 +8897,12 @@ export declare function composeSlotClassName<V extends Record<string, unknown>>(
 
  export declare const switchGroupContextKey: InjectionKey<SwitchGroupContext>;
 
+ declare type SwitchShorthandItem = {
+     value: string;
+     label?: string;
+     disabled?: boolean;
+ };
+
  export declare const Tab: __VLS_WithTemplateSlots_67<typeof __VLS_component_67, __VLS_TemplateResult_67["slots"]>;
 
  export declare const TabIndicator: DefineComponent<__VLS_Props_77, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_77> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
@@ -8879,6 +8980,13 @@ export declare function composeSlotClassName<V extends Record<string, unknown>>(
 
  export declare const Tabs: __VLS_WithTemplateSlots_65<typeof __VLS_component_65, __VLS_TemplateResult_65["slots"]>;
 
+ declare type TabShorthandItem = {
+     value: string;
+     label: string;
+     content?: string;
+     disabled?: boolean;
+ };
+
  declare const Text_2: __VLS_WithTemplateSlots_3<typeof __VLS_component_3, __VLS_TemplateResult_3["slots"]>;
  export { Text_2 as Text }
 
@@ -8965,6 +9073,14 @@ export declare function composeSlotClassName<V extends Record<string, unknown>>(
      toggleValue: (value: string) => void;
  }
 
+ declare type ToggleButtonShorthandItem = {
+     value: string;
+     label?: string;
+     isIconOnly?: boolean;
+     disabled?: boolean;
+     class?: string;
+ };
+
  export declare const Toolbar: __VLS_WithTemplateSlots_80<typeof __VLS_component_80, __VLS_TemplateResult_80["slots"]>;
 
  export declare const ToolbarButton: __VLS_WithTemplateSlots_81<typeof __VLS_component_81, __VLS_TemplateResult_81["slots"]>;
@@ -8977,6 +9093,16 @@ export declare function composeSlotClassName<V extends Record<string, unknown>>(
 
  export declare const ToolbarToggleItem: __VLS_WithTemplateSlots_84<typeof __VLS_component_84, __VLS_TemplateResult_84["slots"]>;
 
+ declare type ToolbarToggleShorthandItem = {
+     value: string;
+     label?: string;
+     variant?: string;
+     size?: string;
+     isIconOnly?: boolean;
+     disabled?: boolean;
+     class?: string;
+ };
+
  /**
   * Tooltip root component. Wraps Reka UI's TooltipRoot.
   *