cck-ui 0.0.1 → 0.0.2

package/es/packages/components/button/src/button-custom.mjs

@@ -1,6 +1,6 @@
 import { generateColorShades, setColorAlpha } from "../../../utils/colors.mjs";
-import { vue_runtime_esm_bundler_exports } from "../../../../node_modules/.pnpm/vue@3.5.35_typescript@6.0.3/node_modules/vue/dist/vue.runtime.esm-bundler.mjs";
 import { useColorScheme } from "../../../hooks/use-theme/index.mjs";
+import { computed } from "vue";
 //#region ../../packages/components/button/src/button-custom.ts
 const PRESET_COLORS = [
 	"red",
@@ -40,7 +40,7 @@ const getShadeIndexes = (scheme) => {
 };
 function useButtonCustomStyle(props) {
 	const colorScheme = useColorScheme();
-	return (0, vue_runtime_esm_bundler_exports.computed)(() => {
+	return computed(() => {
 		const styles = {};
 		const { color, gradient, justify, variant } = props;
 		const scheme = colorScheme.value;

package/es/packages/components/button/src/button-custom.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button-custom.mjs","names":[],"sources":["../../../../../../../packages/components/button/src/button-custom.ts"],"sourcesContent":["import { ColorScheme, useColorScheme } from '@cck-ui/hooks'\nimport { generateColorShades, setColorAlpha } from '@cck-ui/utils'\nimport { computed } from 'vue'\nimport { ButtonProps } from './button.types'\n\nconst PRESET_COLORS = [\n  'red',\n  'pink',\n  'grape',\n  'violet',\n  'indigo',\n  'blue',\n  'cyan',\n  'teal',\n  'green',\n  'lime',\n  'yellow',\n  'orange',\n  'gray',\n  'dark'\n]\n\nconst getShadeIndexes = (scheme: ColorScheme) => {\n  if (scheme === 'light') {\n    return {\n      bg: 6,\n      hover: 7,\n      lightBg: 1,\n      lightHover: 2,\n      lightColor: 9,\n      outlineColor: 6,\n      outlineHoverBgAlpha: 0.05\n    }\n  } else {\n    return {\n      bg: 8,\n      hover: 9,\n      lightBg: 1,\n      lightHover: 2,\n      lightColor: 9,\n      outlineColor: 4,\n      outlineHoverBgAlpha: 0.05\n    }\n  }\n}\n\nexport function useButtonCustomStyle(props: ButtonProps) {\n  const colorScheme = useColorScheme()\n\n  return computed(() => {\n    const styles: Record<string, string> = {}\n\n    const { color, gradient, justify, variant } = props\n    const scheme = colorScheme.value\n    const idx = getShadeIndexes(scheme)\n\n    if (justify) {\n      styles['--button-justify'] = justify\n    }\n\n    switch (variant) {\n      case 'default':\n        break\n      case 'filled':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-bg'] = `var(--c-color-${color}-filled)`\n            styles['--button-hover'] = `var(--c-color-${color}-filled-hover)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-bg'] = shades[idx.bg]\n            styles['--button-hover'] = shades[idx.hover]\n          }\n        }\n        break\n      case 'light':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-bg'] = `var(--c-color-${color}-light)`\n            styles['--button-hover'] = `var(--c-color-${color}-light-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-light-color)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-bg'] = shades[idx.lightBg]\n            styles['--button-hover'] = shades[idx.lightHover]\n            styles['--button-color'] = shades[idx.lightColor]\n          }\n        }\n        break\n      case 'outline':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-hover'] = `var(--c-color-${color}-outline-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-outline)`\n            styles['--button-bd'] =\n              `calc(0.0625rem * var(--c-scale)) solid var(--c-color-${color}-outline)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-hover'] = setColorAlpha(\n              shades[idx.outlineColor],\n              idx.outlineHoverBgAlpha\n            )\n            styles['--button-color'] = shades[idx.outlineColor]\n            styles['--button-bd'] =\n              `calc(0.0625rem * var(--c-scale)) solid ${shades[idx.outlineColor]}`\n          }\n        }\n        break\n      case 'subtle':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-hover'] = `var(--c-color-${color}-outline-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-outline)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-hover'] = setColorAlpha(\n              shades[idx.outlineColor],\n              idx.outlineHoverBgAlpha\n            )\n            styles['--button-color'] = shades[idx.outlineColor]\n          }\n        }\n        break\n      case 'transparent':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-color'] = `var(--c-color-${color}-light-color)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-color'] = shades[idx.lightColor]\n          }\n        }\n        break\n      case 'white':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-color'] = `var(--c-color-${color}-filled)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-color'] = shades[idx.bg]\n          }\n        }\n        break\n      case 'gradient':\n        const from = gradient?.from || 'blue'\n        const to = gradient?.to || 'cyan'\n        const deg = gradient?.deg || '45'\n\n        let finalFrom: string = from\n        let finalTo: string = to\n        if (PRESET_COLORS.includes(from)) {\n          finalFrom = `var(--c-color-${from}-filled)`\n        }\n        if (PRESET_COLORS.includes(to)) {\n          finalTo = `var(--c-color-${to}-filled)`\n        }\n\n        styles['--button-bg'] =\n          `linear-gradient(${deg}deg, ${finalFrom} 0%, ${finalTo} 100%)`\n        break\n      default:\n        break\n    }\n\n    return styles\n  })\n}\n"],"mappings":"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"}
+{"version":3,"file":"button-custom.mjs","names":[],"sources":["../../../../../../../packages/components/button/src/button-custom.ts"],"sourcesContent":["import { ColorScheme, useColorScheme } from '@cck-ui/hooks'\nimport { generateColorShades, setColorAlpha } from '@cck-ui/utils'\nimport { computed } from 'vue'\nimport { ButtonProps } from './button.types'\n\nconst PRESET_COLORS = [\n  'red',\n  'pink',\n  'grape',\n  'violet',\n  'indigo',\n  'blue',\n  'cyan',\n  'teal',\n  'green',\n  'lime',\n  'yellow',\n  'orange',\n  'gray',\n  'dark'\n]\n\nconst getShadeIndexes = (scheme: ColorScheme) => {\n  if (scheme === 'light') {\n    return {\n      bg: 6,\n      hover: 7,\n      lightBg: 1,\n      lightHover: 2,\n      lightColor: 9,\n      outlineColor: 6,\n      outlineHoverBgAlpha: 0.05\n    }\n  } else {\n    return {\n      bg: 8,\n      hover: 9,\n      lightBg: 1,\n      lightHover: 2,\n      lightColor: 9,\n      outlineColor: 4,\n      outlineHoverBgAlpha: 0.05\n    }\n  }\n}\n\nexport function useButtonCustomStyle(props: ButtonProps) {\n  const colorScheme = useColorScheme()\n\n  return computed(() => {\n    const styles: Record<string, string> = {}\n\n    const { color, gradient, justify, variant } = props\n    const scheme = colorScheme.value\n    const idx = getShadeIndexes(scheme)\n\n    if (justify) {\n      styles['--button-justify'] = justify\n    }\n\n    switch (variant) {\n      case 'default':\n        break\n      case 'filled':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-bg'] = `var(--c-color-${color}-filled)`\n            styles['--button-hover'] = `var(--c-color-${color}-filled-hover)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-bg'] = shades[idx.bg]\n            styles['--button-hover'] = shades[idx.hover]\n          }\n        }\n        break\n      case 'light':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-bg'] = `var(--c-color-${color}-light)`\n            styles['--button-hover'] = `var(--c-color-${color}-light-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-light-color)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-bg'] = shades[idx.lightBg]\n            styles['--button-hover'] = shades[idx.lightHover]\n            styles['--button-color'] = shades[idx.lightColor]\n          }\n        }\n        break\n      case 'outline':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-hover'] = `var(--c-color-${color}-outline-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-outline)`\n            styles['--button-bd'] =\n              `calc(0.0625rem * var(--c-scale)) solid var(--c-color-${color}-outline)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-hover'] = setColorAlpha(\n              shades[idx.outlineColor],\n              idx.outlineHoverBgAlpha\n            )\n            styles['--button-color'] = shades[idx.outlineColor]\n            styles['--button-bd'] =\n              `calc(0.0625rem * var(--c-scale)) solid ${shades[idx.outlineColor]}`\n          }\n        }\n        break\n      case 'subtle':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-hover'] = `var(--c-color-${color}-outline-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-outline)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-hover'] = setColorAlpha(\n              shades[idx.outlineColor],\n              idx.outlineHoverBgAlpha\n            )\n            styles['--button-color'] = shades[idx.outlineColor]\n          }\n        }\n        break\n      case 'transparent':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-color'] = `var(--c-color-${color}-light-color)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-color'] = shades[idx.lightColor]\n          }\n        }\n        break\n      case 'white':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-color'] = `var(--c-color-${color}-filled)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-color'] = shades[idx.bg]\n          }\n        }\n        break\n      case 'gradient':\n        const from = gradient?.from || 'blue'\n        const to = gradient?.to || 'cyan'\n        const deg = gradient?.deg || '45'\n\n        let finalFrom: string = from\n        let finalTo: string = to\n        if (PRESET_COLORS.includes(from)) {\n          finalFrom = `var(--c-color-${from}-filled)`\n        }\n        if (PRESET_COLORS.includes(to)) {\n          finalTo = `var(--c-color-${to}-filled)`\n        }\n\n        styles['--button-bg'] =\n          `linear-gradient(${deg}deg, ${finalFrom} 0%, ${finalTo} 100%)`\n        break\n      default:\n        break\n    }\n\n    return styles\n  })\n}\n"],"mappings":"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"}

package/es/packages/components/button/src/button.vue_vue_type_script_setup_true_lang.mjs

@@ -1,7 +1,7 @@
-import { vue_runtime_esm_bundler_exports } from "../../../../node_modules/.pnpm/vue@3.5.35_typescript@6.0.3/node_modules/vue/dist/vue.runtime.esm-bundler.mjs";
 import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
 import { useButton } from "./use-button.mjs";
 import { useButtonCustomStyle } from "./button-custom.mjs";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeProps, normalizeClass, openBlock, renderSlot, resolveDynamicComponent, unref, useSlots, withCtx } from "vue";
 //#region ../../packages/components/button/src/button.vue?vue&type=script&setup=true&lang.ts
 const _hoisted_1 = {
 	key: 0,
@@ -19,7 +19,7 @@ const _hoisted_4 = {
 	key: 3,
 	"data-position": "right"
 };
-var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue_runtime_esm_bundler_exports.defineComponent)({
+var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "CButton",
 	__name: "button",
 	props: {
@@ -85,9 +85,9 @@ var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue_r
 		}
 	},
 	setup(__props, { expose: __expose }) {
-		const slots = (0, vue_runtime_esm_bundler_exports.useSlots)();
-		const hasLeftSlot = (0, vue_runtime_esm_bundler_exports.computed)(() => !!slots["left-section"]);
-		const hasRightSlot = (0, vue_runtime_esm_bundler_exports.computed)(() => !!slots["right-section"]);
+		const slots = useSlots();
+		const hasLeftSlot = computed(() => !!slots["left-section"]);
+		const hasRightSlot = computed(() => !!slots["right-section"]);
 		const props = __props;
 		const { _disabled, _props, _ref, handleClick } = useButton(props, {
 			hasLeftSlot: hasLeftSlot.value,
@@ -95,14 +95,14 @@ var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue_r
 		});
 		const buttonStyle = useButtonCustomStyle(props);
 		const ns = useNamespace("button");
-		const buttonClass = (0, vue_runtime_esm_bundler_exports.computed)(() => [
+		const buttonClass = computed(() => [
 			useNamespace("focus").b("auto"),
 			!_disabled.value && useNamespace("active").b(),
 			ns.e("root"),
 			ns.is("loading", props.loading)
 		]);
-		const innerClass = (0, vue_runtime_esm_bundler_exports.computed)(() => [ns.e("inner")]);
-		const labelClass = (0, vue_runtime_esm_bundler_exports.computed)(() => [ns.e("label")]);
+		const innerClass = computed(() => [ns.e("inner")]);
+		const labelClass = computed(() => [ns.e("label")]);
 		__expose({
 			/** @description if button is disabled */
 			disabled: _disabled.value,
@@ -114,15 +114,15 @@ var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue_r
 			variant: props.variant
 		});
 		return (_ctx, _cache) => {
-			return (0, vue_runtime_esm_bundler_exports.openBlock)(), (0, vue_runtime_esm_bundler_exports.createBlock)((0, vue_runtime_esm_bundler_exports.resolveDynamicComponent)(__props.tag), (0, vue_runtime_esm_bundler_exports.mergeProps)((0, vue_runtime_esm_bundler_exports.unref)(_props), {
+			return openBlock(), createBlock(resolveDynamicComponent(__props.tag), mergeProps(unref(_props), {
 				class: buttonClass.value,
-				style: (0, vue_runtime_esm_bundler_exports.unref)(buttonStyle),
-				onClick: (0, vue_runtime_esm_bundler_exports.unref)(handleClick)
+				style: unref(buttonStyle),
+				onClick: unref(handleClick)
 			}), {
-				default: (0, vue_runtime_esm_bundler_exports.withCtx)(() => [(0, vue_runtime_esm_bundler_exports.createElementVNode)("span", { class: (0, vue_runtime_esm_bundler_exports.normalizeClass)(innerClass.value) }, [
-					_ctx.$slots["left-section"] ? ((0, vue_runtime_esm_bundler_exports.openBlock)(), (0, vue_runtime_esm_bundler_exports.createElementBlock)("span", _hoisted_1, [(0, vue_runtime_esm_bundler_exports.renderSlot)(_ctx.$slots, "left-section")])) : __props.leftSection ? ((0, vue_runtime_esm_bundler_exports.openBlock)(), (0, vue_runtime_esm_bundler_exports.createElementBlock)("span", _hoisted_2, [((0, vue_runtime_esm_bundler_exports.openBlock)(), (0, vue_runtime_esm_bundler_exports.createBlock)((0, vue_runtime_esm_bundler_exports.resolveDynamicComponent)(__props.leftSection)))])) : (0, vue_runtime_esm_bundler_exports.createCommentVNode)("v-if", true),
-					(0, vue_runtime_esm_bundler_exports.createElementVNode)("span", { class: (0, vue_runtime_esm_bundler_exports.normalizeClass)(labelClass.value) }, [(0, vue_runtime_esm_bundler_exports.renderSlot)(_ctx.$slots, "default")], 2),
-					_ctx.$slots["right-section"] ? ((0, vue_runtime_esm_bundler_exports.openBlock)(), (0, vue_runtime_esm_bundler_exports.createElementBlock)("span", _hoisted_3, [(0, vue_runtime_esm_bundler_exports.renderSlot)(_ctx.$slots, "right-section")])) : __props.rightSection ? ((0, vue_runtime_esm_bundler_exports.openBlock)(), (0, vue_runtime_esm_bundler_exports.createElementBlock)("span", _hoisted_4, [((0, vue_runtime_esm_bundler_exports.openBlock)(), (0, vue_runtime_esm_bundler_exports.createBlock)((0, vue_runtime_esm_bundler_exports.resolveDynamicComponent)(__props.rightSection)))])) : (0, vue_runtime_esm_bundler_exports.createCommentVNode)("v-if", true)
+				default: withCtx(() => [createElementVNode("span", { class: normalizeClass(innerClass.value) }, [
+					_ctx.$slots["left-section"] ? (openBlock(), createElementBlock("span", _hoisted_1, [renderSlot(_ctx.$slots, "left-section")])) : __props.leftSection ? (openBlock(), createElementBlock("span", _hoisted_2, [(openBlock(), createBlock(resolveDynamicComponent(__props.leftSection)))])) : createCommentVNode("v-if", true),
+					createElementVNode("span", { class: normalizeClass(labelClass.value) }, [renderSlot(_ctx.$slots, "default")], 2),
+					_ctx.$slots["right-section"] ? (openBlock(), createElementBlock("span", _hoisted_3, [renderSlot(_ctx.$slots, "right-section")])) : __props.rightSection ? (openBlock(), createElementBlock("span", _hoisted_4, [(openBlock(), createBlock(resolveDynamicComponent(__props.rightSection)))])) : createCommentVNode("v-if", true)
 				], 2)]),
 				_: 3
 			}, 16, [

package/es/packages/components/button/src/button.vue_vue_type_script_setup_true_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button.vue_vue_type_script_setup_true_lang.mjs","names":["$slots"],"sources":["../../../../../../../packages/components/button/src/button.vue","../../../../../../../packages/components/button/src/button.vue"],"sourcesContent":["<template>\n  <component\n    v-bind=\"_props\"\n    :class=\"buttonClass\"\n    :is=\"tag\"\n    :style=\"buttonStyle\"\n    @click=\"handleClick\"\n  >\n    <span :class=\"innerClass\">\n      <span data-position=\"left\" v-if=\"$slots['left-section']\">\n        <slot name=\"left-section\"></slot>\n      </span>\n      <span data-position=\"left\" v-else-if=\"leftSection\">\n        <component :is=\"leftSection\" />\n      </span>\n      <span :class=\"labelClass\">\n        <slot />\n      </span>\n      <span data-position=\"right\" v-if=\"$slots['right-section']\">\n        <slot name=\"right-section\"></slot>\n      </span>\n      <span data-position=\"right\" v-else-if=\"rightSection\">\n        <component :is=\"rightSection\" />\n      </span>\n    </span>\n  </component>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, useSlots } from 'vue'\nimport type { ButtonProps } from './button.types'\nimport { useNamespace } from '@cck-ui/hooks'\nimport { useButton } from './use-button'\nimport { useButtonCustomStyle } from './button-custom'\n\ndefineOptions({\n  name: 'CButton'\n})\n\ndefineSlots<{\n  'left-section': any\n  'right-section': any\n  default: any\n}>()\n\nconst slots = useSlots()\n\nconst hasLeftSlot = computed(() => !!slots['left-section'])\nconst hasRightSlot = computed(() => !!slots['right-section'])\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n  radius: '4px',\n  size: 'sm',\n  tag: 'button',\n  variant: 'default'\n})\n\nconst { _disabled, _props, _ref, handleClick } = useButton(props, {\n  hasLeftSlot: hasLeftSlot.value,\n  hasRightSlot: hasRightSlot.value\n})\n\nconst buttonStyle = useButtonCustomStyle(props)\nconst ns = useNamespace('button')\nconst buttonClass = computed(() => [\n  useNamespace('focus').b('auto'),\n  !_disabled.value && useNamespace('active').b(),\n  ns.e('root'),\n  ns.is('loading', props.loading)\n])\nconst innerClass = computed(() => [ns.e('inner')])\nconst labelClass = computed(() => [ns.e('label')])\n\ndefineExpose({\n  /** @description if button is disabled */\n  disabled: _disabled.value,\n  /** @description button html element */\n  ref: _ref,\n  /** @description button size */\n  size: props.size,\n  /** @description button variant */\n  variant: props.variant\n})\n</script>\n","<template>\n  <component\n    v-bind=\"_props\"\n    :class=\"buttonClass\"\n    :is=\"tag\"\n    :style=\"buttonStyle\"\n    @click=\"handleClick\"\n  >\n    <span :class=\"innerClass\">\n      <span data-position=\"left\" v-if=\"$slots['left-section']\">\n        <slot name=\"left-section\"></slot>\n      </span>\n      <span data-position=\"left\" v-else-if=\"leftSection\">\n        <component :is=\"leftSection\" />\n      </span>\n      <span :class=\"labelClass\">\n        <slot />\n      </span>\n      <span data-position=\"right\" v-if=\"$slots['right-section']\">\n        <slot name=\"right-section\"></slot>\n      </span>\n      <span data-position=\"right\" v-else-if=\"rightSection\">\n        <component :is=\"rightSection\" />\n      </span>\n    </span>\n  </component>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, useSlots } from 'vue'\nimport type { ButtonProps } from './button.types'\nimport { useNamespace } from '@cck-ui/hooks'\nimport { useButton } from './use-button'\nimport { useButtonCustomStyle } from './button-custom'\n\ndefineOptions({\n  name: 'CButton'\n})\n\ndefineSlots<{\n  'left-section': any\n  'right-section': any\n  default: any\n}>()\n\nconst slots = useSlots()\n\nconst hasLeftSlot = computed(() => !!slots['left-section'])\nconst hasRightSlot = computed(() => !!slots['right-section'])\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n  radius: '4px',\n  size: 'sm',\n  tag: 'button',\n  variant: 'default'\n})\n\nconst { _disabled, _props, _ref, handleClick } = useButton(props, {\n  hasLeftSlot: hasLeftSlot.value,\n  hasRightSlot: hasRightSlot.value\n})\n\nconst buttonStyle = useButtonCustomStyle(props)\nconst ns = useNamespace('button')\nconst buttonClass = computed(() => [\n  useNamespace('focus').b('auto'),\n  !_disabled.value && useNamespace('active').b(),\n  ns.e('root'),\n  ns.is('loading', props.loading)\n])\nconst innerClass = computed(() => [ns.e('inner')])\nconst labelClass = computed(() => [ns.e('label')])\n\ndefineExpose({\n  /** @description if button is disabled */\n  disabled: _disabled.value,\n  /** @description button html element */\n  ref: _ref,\n  /** @description button size */\n  size: props.size,\n  /** @description button variant */\n  variant: props.variant\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6CA,MAAM,SAAA,GAAA,gCAAA,SAAA,CAAiB;EAEvB,MAAM,eAAA,GAAA,gCAAA,SAAA,OAA6B,CAAC,CAAC,MAAM,eAAe;EAC1D,MAAM,gBAAA,GAAA,gCAAA,SAAA,OAA8B,CAAC,CAAC,MAAM,gBAAgB;EAE5D,MAAM,QAAQ;EAOd,MAAM,EAAE,WAAW,QAAQ,MAAM,gBAAgB,UAAU,OAAO;GAChE,aAAa,YAAY;GACzB,cAAc,aAAa;EAC7B,CAAC;EAED,MAAM,cAAc,qBAAqB,KAAK;EAC9C,MAAM,KAAK,aAAa,QAAQ;EAChC,MAAM,eAAA,GAAA,gCAAA,SAAA,OAA6B;GACjC,aAAa,OAAO,CAAC,CAAC,EAAE,MAAM;GAC9B,CAAC,UAAU,SAAS,aAAa,QAAQ,CAAC,CAAC,EAAE;GAC7C,GAAG,EAAE,MAAM;GACX,GAAG,GAAG,WAAW,MAAM,OAAO;EAChC,CAAC;EACD,MAAM,cAAA,GAAA,gCAAA,SAAA,OAA4B,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;EACjD,MAAM,cAAA,GAAA,gCAAA,SAAA,OAA4B,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;EAEjD,SAAa;;GAEX,UAAU,UAAU;;GAEpB,KAAK;;GAEL,MAAM,MAAM;;GAEZ,SAAS,MAAM;EACjB,CAAC;;0KC9EQ,QAAA,GAAG,IAAA,GAAA,gCAAA,WAAA,EAAA,GAAA,gCAAA,MAAA,CAqBE,MAAA,GAvBI;IACb,OAAO,YAAA;IAEP,QAAA,GAAA,gCAAA,MAAA,CAAO,WAAA;IACP,UAAA,GAAA,gCAAA,MAAA,CAAO,WAAA;;gEAkBD,EAAA,GAAA,gCAAA,mBAAA,CAAA,QAAA,EAhBA,QAAA,GAAA,gCAAA,eAAA,CAAO,WAAA,KAAU,EAAA,GAAA;KACWA,KAAAA,OAAM,oBAAA,GAAA,gCAAA,UAAA,CAAA,IAAA,GAAA,gCAAA,mBAAA,CAEhC,QAFP,YAEO,EAAA,GAAA,gCAAA,WAAA,CAD4B,KAAA,QAAA,cAAA,CAAA,CAAA,KAEG,QAAA,gBAAA,GAAA,gCAAA,UAAA,CAAA,IAAA,GAAA,gCAAA,mBAAA,CAE/B,QAFP,YAEO,GAAA,GAAA,gCAAA,UAAA,CAAA,IAAA,GAAA,gCAAA,YAAA,EAAA,GAAA,gCAAA,wBAAA,CADW,QAAA,WAAW,CAAA,EAAA,CAAA,MAAA,GAAA,gCAAA,mBAAA,CAAA,QAAA,IAAA;6DAItB,QAAA,EAFA,QAAA,GAAA,gCAAA,eAAA,CAAO,WAAA,KAAU,EAAA,GAAA,EAAA,GAAA,gCAAA,WAAA,CACd,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA;KAEwBA,KAAAA,OAAM,qBAAA,GAAA,gCAAA,UAAA,CAAA,IAAA,GAAA,gCAAA,mBAAA,CAEjC,QAFP,YAEO,EAAA,GAAA,gCAAA,WAAA,CAD6B,KAAA,QAAA,eAAA,CAAA,CAAA,KAEG,QAAA,iBAAA,GAAA,gCAAA,UAAA,CAAA,IAAA,GAAA,gCAAA,mBAAA,CAEhC,QAFP,YAEO,GAAA,GAAA,gCAAA,UAAA,CAAA,IAAA,GAAA,gCAAA,YAAA,EAAA,GAAA,gCAAA,wBAAA,CADW,QAAA,YAAY,CAAA,EAAA,CAAA,MAAA,GAAA,gCAAA,mBAAA,CAAA,QAAA,IAAA"}
+{"version":3,"file":"button.vue_vue_type_script_setup_true_lang.mjs","names":["$slots"],"sources":["../../../../../../../packages/components/button/src/button.vue"],"sourcesContent":["<template>\n  <component\n    v-bind=\"_props\"\n    :class=\"buttonClass\"\n    :is=\"tag\"\n    :style=\"buttonStyle\"\n    @click=\"handleClick\"\n  >\n    <span :class=\"innerClass\">\n      <span data-position=\"left\" v-if=\"$slots['left-section']\">\n        <slot name=\"left-section\"></slot>\n      </span>\n      <span data-position=\"left\" v-else-if=\"leftSection\">\n        <component :is=\"leftSection\" />\n      </span>\n      <span :class=\"labelClass\">\n        <slot />\n      </span>\n      <span data-position=\"right\" v-if=\"$slots['right-section']\">\n        <slot name=\"right-section\"></slot>\n      </span>\n      <span data-position=\"right\" v-else-if=\"rightSection\">\n        <component :is=\"rightSection\" />\n      </span>\n    </span>\n  </component>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, useSlots } from 'vue'\nimport type { ButtonProps } from './button.types'\nimport { useNamespace } from '@cck-ui/hooks'\nimport { useButton } from './use-button'\nimport { useButtonCustomStyle } from './button-custom'\n\ndefineOptions({\n  name: 'CButton'\n})\n\ndefineSlots<{\n  'left-section': any\n  'right-section': any\n  default: any\n}>()\n\nconst slots = useSlots()\n\nconst hasLeftSlot = computed(() => !!slots['left-section'])\nconst hasRightSlot = computed(() => !!slots['right-section'])\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n  radius: '4px',\n  size: 'sm',\n  tag: 'button',\n  variant: 'default'\n})\n\nconst { _disabled, _props, _ref, handleClick } = useButton(props, {\n  hasLeftSlot: hasLeftSlot.value,\n  hasRightSlot: hasRightSlot.value\n})\n\nconst buttonStyle = useButtonCustomStyle(props)\nconst ns = useNamespace('button')\nconst buttonClass = computed(() => [\n  useNamespace('focus').b('auto'),\n  !_disabled.value && useNamespace('active').b(),\n  ns.e('root'),\n  ns.is('loading', props.loading)\n])\nconst innerClass = computed(() => [ns.e('inner')])\nconst labelClass = computed(() => [ns.e('label')])\n\ndefineExpose({\n  /** @description if button is disabled */\n  disabled: _disabled.value,\n  /** @description button html element */\n  ref: _ref,\n  /** @description button size */\n  size: props.size,\n  /** @description button variant */\n  variant: props.variant\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6CA,MAAM,QAAQ,SAAS;EAEvB,MAAM,cAAc,eAAe,CAAC,CAAC,MAAM,eAAe;EAC1D,MAAM,eAAe,eAAe,CAAC,CAAC,MAAM,gBAAgB;EAE5D,MAAM,QAAQ;EAOd,MAAM,EAAE,WAAW,QAAQ,MAAM,gBAAgB,UAAU,OAAO;GAChE,aAAa,YAAY;GACzB,cAAc,aAAa;EAC7B,CAAC;EAED,MAAM,cAAc,qBAAqB,KAAK;EAC9C,MAAM,KAAK,aAAa,QAAQ;EAChC,MAAM,cAAc,eAAe;GACjC,aAAa,OAAO,CAAC,CAAC,EAAE,MAAM;GAC9B,CAAC,UAAU,SAAS,aAAa,QAAQ,CAAC,CAAC,EAAE;GAC7C,GAAG,EAAE,MAAM;GACX,GAAG,GAAG,WAAW,MAAM,OAAO;EAChC,CAAC;EACD,MAAM,aAAa,eAAe,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;EACjD,MAAM,aAAa,eAAe,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;EAEjD,SAAa;;GAEX,UAAU,UAAU;;GAEpB,KAAK;;GAEL,MAAM,MAAM;;GAEZ,SAAS,MAAM;EACjB,CAAC;;uBAjFC,YAwBY,wBArBL,QAAA,GAAG,GAHV,WACU,MAuBE,MAAA,GAvBI;IACb,OAAO,YAAA;IAEP,OAAO,MAAA,WAAA;IACP,SAAO,MAAA,WAAA;;2BAkBD,CAhBP,mBAgBO,QAAA,EAhBA,OAAK,eAAE,WAAA,KAAU,EAAA,GAAA;KACWA,KAAAA,OAAM,mBAAA,UAAA,GAAvC,mBAEO,QAFP,YAEO,CADL,WAAiC,KAAA,QAAA,cAAA,CAAA,CAAA,KAEG,QAAA,eAAA,UAAA,GAAtC,mBAEO,QAFP,YAEO,EAAA,UAAA,GADL,YAA+B,wBAAf,QAAA,WAAW,CAAA,EAAA,CAAA,KAAA,mBAAA,QAAA,IAAA;KAE7B,mBAEO,QAAA,EAFA,OAAK,eAAE,WAAA,KAAU,EAAA,GAAA,CACtB,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA;KAEwBA,KAAAA,OAAM,oBAAA,UAAA,GAAxC,mBAEO,QAFP,YAEO,CADL,WAAkC,KAAA,QAAA,eAAA,CAAA,CAAA,KAEG,QAAA,gBAAA,UAAA,GAAvC,mBAEO,QAFP,YAEO,EAAA,UAAA,GADL,YAAgC,wBAAhB,QAAA,YAAY,CAAA,EAAA,CAAA,KAAA,mBAAA,QAAA,IAAA"}

package/es/packages/components/button/src/use-button.mjs

@@ -1,13 +1,13 @@
-import { vue_runtime_esm_bundler_exports } from "../../../../node_modules/.pnpm/vue@3.5.35_typescript@6.0.3/node_modules/vue/dist/vue.runtime.esm-bundler.mjs";
 import { useFormDisabled } from "../../form/src/hooks/use-form-common-props.mjs";
+import { computed, ref } from "vue";
 //#region ../../packages/components/button/src/use-button.ts
 const useButton = (props, slots) => {
 	const _disabled = useFormDisabled();
-	const _ref = (0, vue_runtime_esm_bundler_exports.ref)();
+	const _ref = ref();
 	const { hasLeftSlot, hasRightSlot } = slots;
 	const hasLeftSection = hasLeftSlot || !!props.leftSection;
 	const hasRightSection = hasRightSlot || !!props.rightSection;
-	const _props = (0, vue_runtime_esm_bundler_exports.computed)(() => {
+	const _props = computed(() => {
 		const _attrs = {
 			"data-disabled": _disabled.value || props.loading || void 0,
 			"data-block": props.fullWidth || void 0,

package/es/packages/components/button/src/use-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-button.mjs","names":[],"sources":["../../../../../../../packages/components/button/src/use-button.ts"],"sourcesContent":["import {} from '@cck-ui/components'\nimport { computed, ref } from 'vue'\nimport { ButtonProps } from './button.types'\nimport { useFormDisabled } from '@cck-ui/components/form'\n\nexport const useButton = (\n  props: ButtonProps,\n  slots: {\n    hasLeftSlot: boolean\n    hasRightSlot: boolean\n  }\n) => {\n  const _disabled = useFormDisabled()\n  const _ref = ref<HTMLButtonElement>()\n\n  const { hasLeftSlot, hasRightSlot } = slots\n\n  const hasLeftSection = hasLeftSlot || !!props.leftSection\n  const hasRightSection = hasRightSlot || !!props.rightSection\n\n  const _props = computed(() => {\n    const _attrs: Record<string, any> = {\n      'data-disabled': _disabled.value || props.loading || undefined,\n      'data-block': props.fullWidth || undefined,\n      'data-size': props.size && props.size !== 'sm' ? props.size : undefined,\n      'data-with-left-section': hasLeftSection || undefined,\n      'data-with-right-section': hasRightSection || undefined,\n      'data-variant': props.variant || 'default'\n    }\n    if (props.tag === 'button') {\n      _attrs['aria-disabled'] = _disabled.value || props.loading || undefined\n      _attrs['disabled'] = _disabled.value || props.loading\n    }\n    return _attrs\n  })\n\n  const handleClick = (evt: MouseEvent) => {\n    if (_disabled.value || props.loading) {\n      evt.stopPropagation()\n      return\n    }\n  }\n\n  return {\n    _disabled,\n    _ref,\n    _props,\n    handleClick\n  }\n}\n"],"mappings":";;;AAKA,MAAa,aACX,OACA,UAIG;CACH,MAAM,YAAY,gBAAgB;CAClC,MAAM,QAAA,GAAA,gCAAA,IAAA,CAA8B;CAEpC,MAAM,EAAE,aAAa,iBAAiB;CAEtC,MAAM,iBAAiB,eAAe,CAAC,CAAC,MAAM;CAC9C,MAAM,kBAAkB,gBAAgB,CAAC,CAAC,MAAM;CAEhD,MAAM,UAAA,GAAA,gCAAA,SAAA,OAAwB;EAC5B,MAAM,SAA8B;GAClC,iBAAiB,UAAU,SAAS,MAAM,WAAW,KAAA;GACrD,cAAc,MAAM,aAAa,KAAA;GACjC,aAAa,MAAM,QAAQ,MAAM,SAAS,OAAO,MAAM,OAAO,KAAA;GAC9D,0BAA0B,kBAAkB,KAAA;GAC5C,2BAA2B,mBAAmB,KAAA;GAC9C,gBAAgB,MAAM,WAAW;EACnC;EACA,IAAI,MAAM,QAAQ,UAAU;GAC1B,OAAO,mBAAmB,UAAU,SAAS,MAAM,WAAW,KAAA;GAC9D,OAAO,cAAc,UAAU,SAAS,MAAM;EAChD;EACA,OAAO;CACT,CAAC;CAED,MAAM,eAAe,QAAoB;EACvC,IAAI,UAAU,SAAS,MAAM,SAAS;GACpC,IAAI,gBAAgB;GACpB;EACF;CACF;CAEA,OAAO;EACL;EACA;EACA;EACA;CACF;AACF"}
+{"version":3,"file":"use-button.mjs","names":[],"sources":["../../../../../../../packages/components/button/src/use-button.ts"],"sourcesContent":["import {} from '@cck-ui/components'\nimport { computed, ref } from 'vue'\nimport { ButtonProps } from './button.types'\nimport { useFormDisabled } from '@cck-ui/components/form'\n\nexport const useButton = (\n  props: ButtonProps,\n  slots: {\n    hasLeftSlot: boolean\n    hasRightSlot: boolean\n  }\n) => {\n  const _disabled = useFormDisabled()\n  const _ref = ref<HTMLButtonElement>()\n\n  const { hasLeftSlot, hasRightSlot } = slots\n\n  const hasLeftSection = hasLeftSlot || !!props.leftSection\n  const hasRightSection = hasRightSlot || !!props.rightSection\n\n  const _props = computed(() => {\n    const _attrs: Record<string, any> = {\n      'data-disabled': _disabled.value || props.loading || undefined,\n      'data-block': props.fullWidth || undefined,\n      'data-size': props.size && props.size !== 'sm' ? props.size : undefined,\n      'data-with-left-section': hasLeftSection || undefined,\n      'data-with-right-section': hasRightSection || undefined,\n      'data-variant': props.variant || 'default'\n    }\n    if (props.tag === 'button') {\n      _attrs['aria-disabled'] = _disabled.value || props.loading || undefined\n      _attrs['disabled'] = _disabled.value || props.loading\n    }\n    return _attrs\n  })\n\n  const handleClick = (evt: MouseEvent) => {\n    if (_disabled.value || props.loading) {\n      evt.stopPropagation()\n      return\n    }\n  }\n\n  return {\n    _disabled,\n    _ref,\n    _props,\n    handleClick\n  }\n}\n"],"mappings":";;;AAKA,MAAa,aACX,OACA,UAIG;CACH,MAAM,YAAY,gBAAgB;CAClC,MAAM,OAAO,IAAuB;CAEpC,MAAM,EAAE,aAAa,iBAAiB;CAEtC,MAAM,iBAAiB,eAAe,CAAC,CAAC,MAAM;CAC9C,MAAM,kBAAkB,gBAAgB,CAAC,CAAC,MAAM;CAEhD,MAAM,SAAS,eAAe;EAC5B,MAAM,SAA8B;GAClC,iBAAiB,UAAU,SAAS,MAAM,WAAW,KAAA;GACrD,cAAc,MAAM,aAAa,KAAA;GACjC,aAAa,MAAM,QAAQ,MAAM,SAAS,OAAO,MAAM,OAAO,KAAA;GAC9D,0BAA0B,kBAAkB,KAAA;GAC5C,2BAA2B,mBAAmB,KAAA;GAC9C,gBAAgB,MAAM,WAAW;EACnC;EACA,IAAI,MAAM,QAAQ,UAAU;GAC1B,OAAO,mBAAmB,UAAU,SAAS,MAAM,WAAW,KAAA;GAC9D,OAAO,cAAc,UAAU,SAAS,MAAM;EAChD;EACA,OAAO;CACT,CAAC;CAED,MAAM,eAAe,QAAoB;EACvC,IAAI,UAAU,SAAS,MAAM,SAAS;GACpC,IAAI,gBAAgB;GACpB;EACF;CACF;CAEA,OAAO;EACL;EACA;EACA;EACA;CACF;AACF"}

package/es/packages/components/form/src/hooks/use-form-common-props.mjs

@@ -1,12 +1,12 @@
-import { vue_runtime_esm_bundler_exports } from "../../../../../node_modules/.pnpm/vue@3.5.35_typescript@6.0.3/node_modules/vue/dist/vue.runtime.esm-bundler.mjs";
 import { useProp } from "../../../../hooks/use-prop/index.mjs";
 import { formContextKey } from "../constants.mjs";
+import { computed, inject, unref } from "vue";
 //#region ../../packages/components/form/src/hooks/use-form-common-props.ts
 const useFormDisabled = (fallback) => {
 	const disabled = useProp("disabled");
-	const form = (0, vue_runtime_esm_bundler_exports.inject)(formContextKey, void 0);
-	return (0, vue_runtime_esm_bundler_exports.computed)(() => {
-		return disabled.value ?? (0, vue_runtime_esm_bundler_exports.unref)(fallback) ?? form?.disabled ?? false;
+	const form = inject(formContextKey, void 0);
+	return computed(() => {
+		return disabled.value ?? unref(fallback) ?? form?.disabled ?? false;
 	});
 };
 const useDisabled = useFormDisabled;

package/es/packages/components/form/src/hooks/use-form-common-props.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-form-common-props.mjs","names":[],"sources":["../../../../../../../../packages/components/form/src/hooks/use-form-common-props.ts"],"sourcesContent":["import { useProp } from '@cck-ui/hooks'\nimport { computed, inject, MaybeRef, unref } from 'vue'\nimport { formContextKey } from '../constants'\n\nexport const useFormDisabled = (fallback?: MaybeRef<boolean | undefined>) => {\n  const disabled = useProp<boolean>('disabled')\n  const form = inject(formContextKey, undefined)\n\n  return computed(() => {\n    return disabled.value ?? unref(fallback) ?? form?.disabled ?? false\n  })\n}\n\nexport const useDisabled = useFormDisabled\n"],"mappings":";;;;AAIA,MAAa,mBAAmB,aAA6C;CAC3E,MAAM,WAAW,QAAiB,UAAU;CAC5C,MAAM,QAAA,GAAA,gCAAA,OAAA,CAAc,gBAAgB,KAAA,CAAS;CAE7C,QAAA,GAAA,gCAAA,SAAA,OAAsB;EACpB,OAAO,SAAS,UAAA,GAAA,gCAAA,MAAA,CAAe,QAAQ,KAAK,MAAM,YAAY;CAChE,CAAC;AACH;AAEA,MAAa,cAAc"}
+{"version":3,"file":"use-form-common-props.mjs","names":[],"sources":["../../../../../../../../packages/components/form/src/hooks/use-form-common-props.ts"],"sourcesContent":["import { useProp } from '@cck-ui/hooks'\nimport { computed, inject, MaybeRef, unref } from 'vue'\nimport { formContextKey } from '../constants'\n\nexport const useFormDisabled = (fallback?: MaybeRef<boolean | undefined>) => {\n  const disabled = useProp<boolean>('disabled')\n  const form = inject(formContextKey, undefined)\n\n  return computed(() => {\n    return disabled.value ?? unref(fallback) ?? form?.disabled ?? false\n  })\n}\n\nexport const useDisabled = useFormDisabled\n"],"mappings":";;;;AAIA,MAAa,mBAAmB,aAA6C;CAC3E,MAAM,WAAW,QAAiB,UAAU;CAC5C,MAAM,OAAO,OAAO,gBAAgB,KAAA,CAAS;CAE7C,OAAO,eAAe;EACpB,OAAO,SAAS,SAAS,MAAM,QAAQ,KAAK,MAAM,YAAY;CAChE,CAAC;AACH;AAEA,MAAa,cAAc"}

package/es/packages/components/icon/src/icon.vue_vue_type_script_setup_true_lang.mjs

@@ -1,9 +1,9 @@
 import { isUndefined } from "../../../utils/types.mjs";
 import { addUnit } from "../../../utils/dom/style.mjs";
-import { vue_runtime_esm_bundler_exports } from "../../../../node_modules/.pnpm/vue@3.5.35_typescript@6.0.3/node_modules/vue/dist/vue.runtime.esm-bundler.mjs";
 import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
+import { computed, createElementBlock, defineComponent, mergeProps, openBlock, renderSlot, unref } from "vue";
 //#region ../../packages/components/icon/src/icon.vue?vue&type=script&setup=true&lang.ts
-var icon_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue_runtime_esm_bundler_exports.defineComponent)({
+var icon_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "CIcon",
 	inheritAttrs: false,
 	__name: "icon",
@@ -20,7 +20,7 @@ var icon_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue_run
 	setup(__props) {
 		const props = __props;
 		const ns = useNamespace("icon");
-		const style = (0, vue_runtime_esm_bundler_exports.computed)(() => {
+		const style = computed(() => {
 			const { size, color } = props;
 			if (!size && !color) return {};
 			return {
@@ -29,10 +29,10 @@ var icon_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue_run
 			};
 		});
 		return (_ctx, _cache) => {
-			return (0, vue_runtime_esm_bundler_exports.openBlock)(), (0, vue_runtime_esm_bundler_exports.createElementBlock)("i", (0, vue_runtime_esm_bundler_exports.mergeProps)({
-				class: (0, vue_runtime_esm_bundler_exports.unref)(ns).b(),
+			return openBlock(), createElementBlock("i", mergeProps({
+				class: unref(ns).b(),
 				style: style.value
-			}, _ctx.$attrs), [(0, vue_runtime_esm_bundler_exports.renderSlot)(_ctx.$slots, "default")], 16);
+			}, _ctx.$attrs), [renderSlot(_ctx.$slots, "default")], 16);
 		};
 	}
 });

package/es/packages/components/icon/src/icon.vue_vue_type_script_setup_true_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"icon.vue_vue_type_script_setup_true_lang.mjs","names":["$attrs"],"sources":["../../../../../../../packages/components/icon/src/icon.vue","../../../../../../../packages/components/icon/src/icon.vue"],"sourcesContent":["<template>\n  <i :class=\"ns.b()\" :style=\"style\" v-bind=\"$attrs\">\n    <slot />\n  </i>\n</template>\n\n<script setup lang=\"ts\">\nimport { type CSSProperties, computed } from 'vue'\nimport { useNamespace } from '@cck-ui/hooks'\nimport { addUnit, isUndefined } from '@cck-ui/utils'\nimport { type IconProps } from './icon.types'\n\ndefineOptions({\n  name: 'CIcon',\n  inheritAttrs: false\n})\nconst props = defineProps<IconProps>()\nconst ns = useNamespace('icon')\n\nconst style = computed<CSSProperties>(() => {\n  const { size, color } = props\n  if (!size && !color) return {}\n\n  return {\n    fontSize: isUndefined(size) ? undefined : addUnit(size),\n    '--color': color\n  }\n})\n</script>\n","<template>\n  <i :class=\"ns.b()\" :style=\"style\" v-bind=\"$attrs\">\n    <slot />\n  </i>\n</template>\n\n<script setup lang=\"ts\">\nimport { type CSSProperties, computed } from 'vue'\nimport { useNamespace } from '@cck-ui/hooks'\nimport { addUnit, isUndefined } from '@cck-ui/utils'\nimport { type IconProps } from './icon.types'\n\ndefineOptions({\n  name: 'CIcon',\n  inheritAttrs: false\n})\nconst props = defineProps<IconProps>()\nconst ns = useNamespace('icon')\n\nconst style = computed<CSSProperties>(() => {\n  const { size, color } = props\n  if (!size && !color) return {}\n\n  return {\n    fontSize: isUndefined(size) ? undefined : addUnit(size),\n    '--color': color\n  }\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;EAgBA,MAAM,QAAQ;EACd,MAAM,KAAK,aAAa,MAAM;EAE9B,MAAM,SAAA,GAAA,gCAAA,SAAA,OAAsC;GAC1C,MAAM,EAAE,MAAM,UAAU;GACxB,IAAI,CAAC,QAAQ,CAAC,OAAO,OAAO,CAAC;GAE7B,OAAO;IACL,UAAU,YAAY,IAAI,IAAI,KAAA,IAAY,QAAQ,IAAI;IACtD,WAAW;GACb;EACF,CAAC;;oHCxBK,MAAA,GAAA,gCAAA,WAAA,CAAA;IAFA,QAAA,GAAA,gCAAA,MAAA,CAAO,EAAA,CAAE,CAAC,EAAC;IAAK,OAAO,MAAA;MAAeA,KAAAA,MAAM,GAAA,EAAA,GAAA,gCAAA,WAAA,CACtC,KAAA,QAAA,SAAA,CAAA,GAAA,EAAA"}
+{"version":3,"file":"icon.vue_vue_type_script_setup_true_lang.mjs","names":["$attrs"],"sources":["../../../../../../../packages/components/icon/src/icon.vue"],"sourcesContent":["<template>\n  <i :class=\"ns.b()\" :style=\"style\" v-bind=\"$attrs\">\n    <slot />\n  </i>\n</template>\n\n<script setup lang=\"ts\">\nimport { type CSSProperties, computed } from 'vue'\nimport { useNamespace } from '@cck-ui/hooks'\nimport { addUnit, isUndefined } from '@cck-ui/utils'\nimport { type IconProps } from './icon.types'\n\ndefineOptions({\n  name: 'CIcon',\n  inheritAttrs: false\n})\nconst props = defineProps<IconProps>()\nconst ns = useNamespace('icon')\n\nconst style = computed<CSSProperties>(() => {\n  const { size, color } = props\n  if (!size && !color) return {}\n\n  return {\n    fontSize: isUndefined(size) ? undefined : addUnit(size),\n    '--color': color\n  }\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;EAgBA,MAAM,QAAQ;EACd,MAAM,KAAK,aAAa,MAAM;EAE9B,MAAM,QAAQ,eAA8B;GAC1C,MAAM,EAAE,MAAM,UAAU;GACxB,IAAI,CAAC,QAAQ,CAAC,OAAO,OAAO,CAAC;GAE7B,OAAO;IACL,UAAU,YAAY,IAAI,IAAI,KAAA,IAAY,QAAQ,IAAI;IACtD,WAAW;GACb;EACF,CAAC;;uBA1BC,mBAEI,KAFJ,WAEI;IAFA,OAAO,MAAA,EAAA,CAAE,CAAC,EAAC;IAAK,OAAO,MAAA;MAAeA,KAAAA,MAAM,GAAA,CAC9C,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,EAAA"}

package/es/packages/hooks/use-namespace/index.mjs

@@ -1,4 +1,4 @@
-import { vue_runtime_esm_bundler_exports } from "../../../node_modules/.pnpm/vue@3.5.35_typescript@6.0.3/node_modules/vue/dist/vue.runtime.esm-bundler.mjs";
+import { computed, getCurrentInstance, inject, ref, unref } from "vue";
 //#region ../../packages/hooks/use-namespace/index.ts
 const defaultNamespace = "c";
 const statePrefix = "is-";
@@ -11,9 +11,9 @@ const _bem = (namespace, block, blockSuffix, element, modifier) => {
 };
 const namespaceContextKey = Symbol("namespaceContextKey");
 const useGetDerivedNamespace = (namespaceOverrides) => {
-	const derivedNamespace = namespaceOverrides || ((0, vue_runtime_esm_bundler_exports.getCurrentInstance)() ? (0, vue_runtime_esm_bundler_exports.inject)(namespaceContextKey, (0, vue_runtime_esm_bundler_exports.ref)("c")) : (0, vue_runtime_esm_bundler_exports.ref)("c"));
-	return (0, vue_runtime_esm_bundler_exports.computed)(() => {
-		return (0, vue_runtime_esm_bundler_exports.unref)(derivedNamespace) || "c";
+	const derivedNamespace = namespaceOverrides || (getCurrentInstance() ? inject(namespaceContextKey, ref("c")) : ref("c"));
+	return computed(() => {
+		return unref(derivedNamespace) || "c";
 	});
 };
 const useNamespace = (block, namespaceOverrides) => {

package/es/packages/hooks/use-namespace/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../../packages/hooks/use-namespace/index.ts"],"sourcesContent":["import { computed, getCurrentInstance, inject, ref, unref } from 'vue'\n\nimport type { InjectionKey, Ref } from 'vue'\n\nexport const defaultNamespace = 'c'\nconst statePrefix = 'is-'\n\nconst _bem = (\n  namespace: string,\n  block: string,\n  blockSuffix: string,\n  element: string,\n  modifier: string\n) => {\n  let cls = `${namespace}-${block}`\n  if (blockSuffix) {\n    cls += `-${blockSuffix}`\n  }\n  if (element) {\n    cls += `__${element}`\n  }\n  if (modifier) {\n    cls += `--${modifier}`\n  }\n  return cls\n}\n\nexport const namespaceContextKey: InjectionKey<Ref<string | undefined>> =\n  Symbol('namespaceContextKey')\n\nexport const useGetDerivedNamespace = (\n  namespaceOverrides?: Ref<string | undefined>\n) => {\n  const derivedNamespace =\n    namespaceOverrides ||\n    (getCurrentInstance()\n      ? inject(namespaceContextKey, ref(defaultNamespace))\n      : ref(defaultNamespace))\n  const namespace = computed(() => {\n    return unref(derivedNamespace) || defaultNamespace\n  })\n  return namespace\n}\n\nexport const useNamespace = (\n  block: string,\n  namespaceOverrides?: Ref<string | undefined>\n) => {\n  const namespace = useGetDerivedNamespace(namespaceOverrides)\n  const b = (blockSuffix = '') =>\n    _bem(namespace.value, block, blockSuffix, '', '')\n  const e = (element?: string) =>\n    element ? _bem(namespace.value, block, '', element, '') : ''\n  const m = (modifier?: string) =>\n    modifier ? _bem(namespace.value, block, '', '', modifier) : ''\n  const be = (blockSuffix?: string, element?: string) =>\n    blockSuffix && element\n      ? _bem(namespace.value, block, blockSuffix, element, '')\n      : ''\n  const em = (element?: string, modifier?: string) =>\n    element && modifier\n      ? _bem(namespace.value, block, '', element, modifier)\n      : ''\n  const bm = (blockSuffix?: string, modifier?: string) =>\n    blockSuffix && modifier\n      ? _bem(namespace.value, block, blockSuffix, '', modifier)\n      : ''\n  const bem = (blockSuffix?: string, element?: string, modifier?: string) =>\n    blockSuffix && element && modifier\n      ? _bem(namespace.value, block, blockSuffix, element, modifier)\n      : ''\n  const is: {\n    (name: string, state: boolean | undefined): string\n    (name: string): string\n  } = (name: string, ...args: [boolean | undefined] | []) => {\n    const state = args.length >= 1 ? args[0]! : true\n    return name && state ? `${statePrefix}${name}` : ''\n  }\n\n  // for css var\n  // --el-xxx: value;\n  const cssVar = (object: Record<string, string>) => {\n    const styles: Record<string, string> = {}\n    for (const key in object) {\n      if (object[key]) {\n        styles[`--${namespace.value}-${key}`] = object[key]\n      }\n    }\n    return styles\n  }\n  // with block\n  const cssVarBlock = (object: Record<string, string>) => {\n    const styles: Record<string, string> = {}\n    for (const key in object) {\n      if (object[key]) {\n        styles[`--${namespace.value}-${block}-${key}`] = object[key]\n      }\n    }\n    return styles\n  }\n\n  const cssVarName = (name: string) => `--${namespace.value}-${name}`\n  const cssVarBlockName = (name: string) =>\n    `--${namespace.value}-${block}-${name}`\n\n  return {\n    namespace,\n    b,\n    e,\n    m,\n    be,\n    em,\n    bm,\n    bem,\n    is,\n    // css\n    cssVar,\n    cssVarName,\n    cssVarBlock,\n    cssVarBlockName\n  }\n}\n\nexport type UseNamespaceReturn = ReturnType<typeof useNamespace>\n"],"mappings":";;AAIA,MAAa,mBAAmB;AAChC,MAAM,cAAc;AAEpB,MAAM,QACJ,WACA,OACA,aACA,SACA,aACG;CACH,IAAI,MAAM,GAAG,UAAU,GAAG;CAC1B,IAAI,aACF,OAAO,IAAI;CAEb,IAAI,SACF,OAAO,KAAK;CAEd,IAAI,UACF,OAAO,KAAK;CAEd,OAAO;AACT;AAEA,MAAa,sBACX,OAAO,qBAAqB;AAE9B,MAAa,0BACX,uBACG;CACH,MAAM,mBACJ,wBAAA,GAAA,gCAAA,mBAAA,CACoB,KAAA,GAAA,gCAAA,OAAA,CACT,sBAAA,GAAA,gCAAA,IAAA,CAAA,GAAyC,CAAC,KAAA,GAAA,gCAAA,IAAA,CAAA,GAC7B;CAI1B,QAAA,GAAA,gCAAA,SAAA,OAHiC;EAC/B,QAAA,GAAA,gCAAA,MAAA,CAAa,gBAAgB,KAAA;CAC/B,CACe;AACjB;AAEA,MAAa,gBACX,OACA,uBACG;CACH,MAAM,YAAY,uBAAuB,kBAAkB;CAC3D,MAAM,KAAK,cAAc,OACvB,KAAK,UAAU,OAAO,OAAO,aAAa,IAAI,EAAE;CAClD,MAAM,KAAK,YACT,UAAU,KAAK,UAAU,OAAO,OAAO,IAAI,SAAS,EAAE,IAAI;CAC5D,MAAM,KAAK,aACT,WAAW,KAAK,UAAU,OAAO,OAAO,IAAI,IAAI,QAAQ,IAAI;CAC9D,MAAM,MAAM,aAAsB,YAChC,eAAe,UACX,KAAK,UAAU,OAAO,OAAO,aAAa,SAAS,EAAE,IACrD;CACN,MAAM,MAAM,SAAkB,aAC5B,WAAW,WACP,KAAK,UAAU,OAAO,OAAO,IAAI,SAAS,QAAQ,IAClD;CACN,MAAM,MAAM,aAAsB,aAChC,eAAe,WACX,KAAK,UAAU,OAAO,OAAO,aAAa,IAAI,QAAQ,IACtD;CACN,MAAM,OAAO,aAAsB,SAAkB,aACnD,eAAe,WAAW,WACtB,KAAK,UAAU,OAAO,OAAO,aAAa,SAAS,QAAQ,IAC3D;CACN,MAAM,MAGD,MAAc,GAAG,SAAqC;EACzD,MAAM,QAAQ,KAAK,UAAU,IAAI,KAAK,KAAM;EAC5C,OAAO,QAAQ,QAAQ,GAAG,cAAc,SAAS;CACnD;CAIA,MAAM,UAAU,WAAmC;EACjD,MAAM,SAAiC,CAAC;EACxC,KAAK,MAAM,OAAO,QAChB,IAAI,OAAO,MACT,OAAO,KAAK,UAAU,MAAM,GAAG,SAAS,OAAO;EAGnD,OAAO;CACT;CAEA,MAAM,eAAe,WAAmC;EACtD,MAAM,SAAiC,CAAC;EACxC,KAAK,MAAM,OAAO,QAChB,IAAI,OAAO,MACT,OAAO,KAAK,UAAU,MAAM,GAAG,MAAM,GAAG,SAAS,OAAO;EAG5D,OAAO;CACT;CAEA,MAAM,cAAc,SAAiB,KAAK,UAAU,MAAM,GAAG;CAC7D,MAAM,mBAAmB,SACvB,KAAK,UAAU,MAAM,GAAG,MAAM,GAAG;CAEnC,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;CACF;AACF"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../../packages/hooks/use-namespace/index.ts"],"sourcesContent":["import { computed, getCurrentInstance, inject, ref, unref } from 'vue'\n\nimport type { InjectionKey, Ref } from 'vue'\n\nexport const defaultNamespace = 'c'\nconst statePrefix = 'is-'\n\nconst _bem = (\n  namespace: string,\n  block: string,\n  blockSuffix: string,\n  element: string,\n  modifier: string\n) => {\n  let cls = `${namespace}-${block}`\n  if (blockSuffix) {\n    cls += `-${blockSuffix}`\n  }\n  if (element) {\n    cls += `__${element}`\n  }\n  if (modifier) {\n    cls += `--${modifier}`\n  }\n  return cls\n}\n\nexport const namespaceContextKey: InjectionKey<Ref<string | undefined>> =\n  Symbol('namespaceContextKey')\n\nexport const useGetDerivedNamespace = (\n  namespaceOverrides?: Ref<string | undefined>\n) => {\n  const derivedNamespace =\n    namespaceOverrides ||\n    (getCurrentInstance()\n      ? inject(namespaceContextKey, ref(defaultNamespace))\n      : ref(defaultNamespace))\n  const namespace = computed(() => {\n    return unref(derivedNamespace) || defaultNamespace\n  })\n  return namespace\n}\n\nexport const useNamespace = (\n  block: string,\n  namespaceOverrides?: Ref<string | undefined>\n) => {\n  const namespace = useGetDerivedNamespace(namespaceOverrides)\n  const b = (blockSuffix = '') =>\n    _bem(namespace.value, block, blockSuffix, '', '')\n  const e = (element?: string) =>\n    element ? _bem(namespace.value, block, '', element, '') : ''\n  const m = (modifier?: string) =>\n    modifier ? _bem(namespace.value, block, '', '', modifier) : ''\n  const be = (blockSuffix?: string, element?: string) =>\n    blockSuffix && element\n      ? _bem(namespace.value, block, blockSuffix, element, '')\n      : ''\n  const em = (element?: string, modifier?: string) =>\n    element && modifier\n      ? _bem(namespace.value, block, '', element, modifier)\n      : ''\n  const bm = (blockSuffix?: string, modifier?: string) =>\n    blockSuffix && modifier\n      ? _bem(namespace.value, block, blockSuffix, '', modifier)\n      : ''\n  const bem = (blockSuffix?: string, element?: string, modifier?: string) =>\n    blockSuffix && element && modifier\n      ? _bem(namespace.value, block, blockSuffix, element, modifier)\n      : ''\n  const is: {\n    (name: string, state: boolean | undefined): string\n    (name: string): string\n  } = (name: string, ...args: [boolean | undefined] | []) => {\n    const state = args.length >= 1 ? args[0]! : true\n    return name && state ? `${statePrefix}${name}` : ''\n  }\n\n  // for css var\n  // --el-xxx: value;\n  const cssVar = (object: Record<string, string>) => {\n    const styles: Record<string, string> = {}\n    for (const key in object) {\n      if (object[key]) {\n        styles[`--${namespace.value}-${key}`] = object[key]\n      }\n    }\n    return styles\n  }\n  // with block\n  const cssVarBlock = (object: Record<string, string>) => {\n    const styles: Record<string, string> = {}\n    for (const key in object) {\n      if (object[key]) {\n        styles[`--${namespace.value}-${block}-${key}`] = object[key]\n      }\n    }\n    return styles\n  }\n\n  const cssVarName = (name: string) => `--${namespace.value}-${name}`\n  const cssVarBlockName = (name: string) =>\n    `--${namespace.value}-${block}-${name}`\n\n  return {\n    namespace,\n    b,\n    e,\n    m,\n    be,\n    em,\n    bm,\n    bem,\n    is,\n    // css\n    cssVar,\n    cssVarName,\n    cssVarBlock,\n    cssVarBlockName\n  }\n}\n\nexport type UseNamespaceReturn = ReturnType<typeof useNamespace>\n"],"mappings":";;AAIA,MAAa,mBAAmB;AAChC,MAAM,cAAc;AAEpB,MAAM,QACJ,WACA,OACA,aACA,SACA,aACG;CACH,IAAI,MAAM,GAAG,UAAU,GAAG;CAC1B,IAAI,aACF,OAAO,IAAI;CAEb,IAAI,SACF,OAAO,KAAK;CAEd,IAAI,UACF,OAAO,KAAK;CAEd,OAAO;AACT;AAEA,MAAa,sBACX,OAAO,qBAAqB;AAE9B,MAAa,0BACX,uBACG;CACH,MAAM,mBACJ,uBACC,mBAAmB,IAChB,OAAO,qBAAqB,IAAA,GAAoB,CAAC,IACjD,IAAA,GAAoB;CAI1B,OAHkB,eAAe;EAC/B,OAAO,MAAM,gBAAgB,KAAA;CAC/B,CACe;AACjB;AAEA,MAAa,gBACX,OACA,uBACG;CACH,MAAM,YAAY,uBAAuB,kBAAkB;CAC3D,MAAM,KAAK,cAAc,OACvB,KAAK,UAAU,OAAO,OAAO,aAAa,IAAI,EAAE;CAClD,MAAM,KAAK,YACT,UAAU,KAAK,UAAU,OAAO,OAAO,IAAI,SAAS,EAAE,IAAI;CAC5D,MAAM,KAAK,aACT,WAAW,KAAK,UAAU,OAAO,OAAO,IAAI,IAAI,QAAQ,IAAI;CAC9D,MAAM,MAAM,aAAsB,YAChC,eAAe,UACX,KAAK,UAAU,OAAO,OAAO,aAAa,SAAS,EAAE,IACrD;CACN,MAAM,MAAM,SAAkB,aAC5B,WAAW,WACP,KAAK,UAAU,OAAO,OAAO,IAAI,SAAS,QAAQ,IAClD;CACN,MAAM,MAAM,aAAsB,aAChC,eAAe,WACX,KAAK,UAAU,OAAO,OAAO,aAAa,IAAI,QAAQ,IACtD;CACN,MAAM,OAAO,aAAsB,SAAkB,aACnD,eAAe,WAAW,WACtB,KAAK,UAAU,OAAO,OAAO,aAAa,SAAS,QAAQ,IAC3D;CACN,MAAM,MAGD,MAAc,GAAG,SAAqC;EACzD,MAAM,QAAQ,KAAK,UAAU,IAAI,KAAK,KAAM;EAC5C,OAAO,QAAQ,QAAQ,GAAG,cAAc,SAAS;CACnD;CAIA,MAAM,UAAU,WAAmC;EACjD,MAAM,SAAiC,CAAC;EACxC,KAAK,MAAM,OAAO,QAChB,IAAI,OAAO,MACT,OAAO,KAAK,UAAU,MAAM,GAAG,SAAS,OAAO;EAGnD,OAAO;CACT;CAEA,MAAM,eAAe,WAAmC;EACtD,MAAM,SAAiC,CAAC;EACxC,KAAK,MAAM,OAAO,QAChB,IAAI,OAAO,MACT,OAAO,KAAK,UAAU,MAAM,GAAG,MAAM,GAAG,SAAS,OAAO;EAG5D,OAAO;CACT;CAEA,MAAM,cAAc,SAAiB,KAAK,UAAU,MAAM,GAAG;CAC7D,MAAM,mBAAmB,SACvB,KAAK,UAAU,MAAM,GAAG,MAAM,GAAG;CAEnC,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;CACF;AACF"}

package/es/packages/hooks/use-prop/index.mjs

@@ -1,8 +1,8 @@
-import { vue_runtime_esm_bundler_exports } from "../../../node_modules/.pnpm/vue@3.5.35_typescript@6.0.3/node_modules/vue/dist/vue.runtime.esm-bundler.mjs";
+import { computed, getCurrentInstance } from "vue";
 //#region ../../packages/hooks/use-prop/index.ts
 const useProp = (name) => {
-	const vm = (0, vue_runtime_esm_bundler_exports.getCurrentInstance)();
-	return (0, vue_runtime_esm_bundler_exports.computed)(() => (vm?.proxy?.$props)?.[name]);
+	const vm = getCurrentInstance();
+	return computed(() => (vm?.proxy?.$props)?.[name]);
 };
 //#endregion
 export { useProp };

package/es/packages/hooks/use-prop/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../../packages/hooks/use-prop/index.ts"],"sourcesContent":["import { computed, getCurrentInstance } from 'vue'\nimport type { ComputedRef } from 'vue'\n\nexport const useProp = <T>(name: string): ComputedRef<T | undefined> => {\n  const vm = getCurrentInstance()\n  return computed(() => (vm?.proxy?.$props as any)?.[name])\n}\n"],"mappings":";;AAGA,MAAa,WAAc,SAA6C;CACtE,MAAM,MAAA,GAAA,gCAAA,mBAAA,CAAwB;CAC9B,QAAA,GAAA,gCAAA,SAAA,QAAuB,IAAI,OAAO,OAAA,GAAiB,KAAK;AAC1D"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../../packages/hooks/use-prop/index.ts"],"sourcesContent":["import { computed, getCurrentInstance } from 'vue'\nimport type { ComputedRef } from 'vue'\n\nexport const useProp = <T>(name: string): ComputedRef<T | undefined> => {\n  const vm = getCurrentInstance()\n  return computed(() => (vm?.proxy?.$props as any)?.[name])\n}\n"],"mappings":";;AAGA,MAAa,WAAc,SAA6C;CACtE,MAAM,KAAK,mBAAmB;CAC9B,OAAO,gBAAgB,IAAI,OAAO,OAAA,GAAiB,KAAK;AAC1D"}

package/es/packages/hooks/use-theme/index.mjs

@@ -1,10 +1,10 @@
-import { vue_runtime_esm_bundler_exports } from "../../../node_modules/.pnpm/vue@3.5.35_typescript@6.0.3/node_modules/vue/dist/vue.runtime.esm-bundler.mjs";
+import { readonly, ref } from "vue";
 //#region ../../packages/hooks/use-theme/index.ts
 const getCurrentScheme = () => {
 	if (typeof document === "undefined") return "light";
 	return document.documentElement.dataset.cColorScheme === "dark" ? "dark" : "light";
 };
-const colorScheme = (0, vue_runtime_esm_bundler_exports.ref)(getCurrentScheme());
+const colorScheme = ref(getCurrentScheme());
 if (typeof window !== "undefined") new MutationObserver(() => {
 	const newScheme = getCurrentScheme();
 	if (newScheme !== colorScheme.value) colorScheme.value = newScheme;
@@ -12,7 +12,7 @@ if (typeof window !== "undefined") new MutationObserver(() => {
 	attributes: true,
 	attributeFilter: ["data-c-color-scheme"]
 });
-const useColorScheme = () => (0, vue_runtime_esm_bundler_exports.readonly)(colorScheme);
+const useColorScheme = () => readonly(colorScheme);
 //#endregion
 export { useColorScheme };
 

package/es/packages/hooks/use-theme/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../../packages/hooks/use-theme/index.ts"],"sourcesContent":["import { readonly, ref } from 'vue'\n\nexport type ColorScheme = 'light' | 'dark'\n\nconst getCurrentScheme = (): ColorScheme => {\n  if (typeof document === 'undefined') return 'light'\n  const scheme = document.documentElement.dataset.cColorScheme\n  return scheme === 'dark' ? 'dark' : 'light'\n}\n\nconst colorScheme = ref<ColorScheme>(getCurrentScheme())\n\nif (typeof window !== 'undefined') {\n  const observer = new MutationObserver(() => {\n    const newScheme = getCurrentScheme()\n    if (newScheme !== colorScheme.value) {\n      colorScheme.value = newScheme\n    }\n  })\n  observer.observe(document.documentElement, {\n    attributes: true,\n    attributeFilter: ['data-c-color-scheme']\n  })\n}\n\nexport const useColorScheme = () => readonly(colorScheme)\n"],"mappings":";;AAIA,MAAM,yBAAsC;CAC1C,IAAI,OAAO,aAAa,aAAa,OAAO;CAE5C,OADe,SAAS,gBAAgB,QAAQ,iBAC9B,SAAS,SAAS;AACtC;AAEA,MAAM,eAAA,GAAA,gCAAA,IAAA,CAA+B,iBAAiB,CAAC;AAEvD,IAAI,OAAO,WAAW,aAOpB,IANqB,uBAAuB;CAC1C,MAAM,YAAY,iBAAiB;CACnC,IAAI,cAAc,YAAY,OAC5B,YAAY,QAAQ;AAExB,CACO,CAAC,CAAC,QAAQ,SAAS,iBAAiB;CACzC,YAAY;CACZ,iBAAiB,CAAC,qBAAqB;AACzC,CAAC;AAGH,MAAa,wBAAA,GAAA,gCAAA,SAAA,CAAgC,WAAW"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../../packages/hooks/use-theme/index.ts"],"sourcesContent":["import { readonly, ref } from 'vue'\n\nexport type ColorScheme = 'light' | 'dark'\n\nconst getCurrentScheme = (): ColorScheme => {\n  if (typeof document === 'undefined') return 'light'\n  const scheme = document.documentElement.dataset.cColorScheme\n  return scheme === 'dark' ? 'dark' : 'light'\n}\n\nconst colorScheme = ref<ColorScheme>(getCurrentScheme())\n\nif (typeof window !== 'undefined') {\n  const observer = new MutationObserver(() => {\n    const newScheme = getCurrentScheme()\n    if (newScheme !== colorScheme.value) {\n      colorScheme.value = newScheme\n    }\n  })\n  observer.observe(document.documentElement, {\n    attributes: true,\n    attributeFilter: ['data-c-color-scheme']\n  })\n}\n\nexport const useColorScheme = () => readonly(colorScheme)\n"],"mappings":";;AAIA,MAAM,yBAAsC;CAC1C,IAAI,OAAO,aAAa,aAAa,OAAO;CAE5C,OADe,SAAS,gBAAgB,QAAQ,iBAC9B,SAAS,SAAS;AACtC;AAEA,MAAM,cAAc,IAAiB,iBAAiB,CAAC;AAEvD,IAAI,OAAO,WAAW,aAOpB,IANqB,uBAAuB;CAC1C,MAAM,YAAY,iBAAiB;CACnC,IAAI,cAAc,YAAY,OAC5B,YAAY,QAAQ;AAExB,CACO,CAAC,CAAC,QAAQ,SAAS,iBAAiB;CACzC,YAAY;CACZ,iBAAiB,CAAC,qBAAqB;AACzC,CAAC;AAGH,MAAa,uBAAuB,SAAS,WAAW"}

package/lib/_virtual/_rolldown/runtime.js

@@ -1,37 +1,4 @@
 //#region \0rolldown/runtime.js
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __commonJSMin = (cb, mod) => () => (mod || (cb((mod = { exports: {} }).exports, mod), cb = null), mod.exports);
-var __exportAll = (all, no_symbols) => {
-	let target = {};
-	for (var name in all) __defProp(target, name, {
-		get: all[name],
-		enumerable: true
-	});
-	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
-	return target;
-};
-var __copyProps = (to, from, except, desc) => {
-	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
-		key = keys[i];
-		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-			get: ((k) => from[k]).bind(null, key),
-			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-		});
-	}
-	return to;
-};
-var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
-	value: mod,
-	enumerable: true
-}) : target, mod));
 //#endregion
 exports.__commonJSMin = __commonJSMin;
-exports.__exportAll = __exportAll;
-exports.__reExport = __reExport;
-exports.__toESM = __toESM;

package/lib/packages/components/button/src/button-custom.js

@@ -1,7 +1,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_colors = require("../../../utils/colors.js");
-const require_index = require("../../../../node_modules/.pnpm/vue@3.5.35_typescript@6.0.3/node_modules/vue/index2.js");
-const require_index$1 = require("../../../hooks/use-theme/index.js");
+const require_index = require("../../../hooks/use-theme/index.js");
+let vue = require("vue");
 //#region ../../packages/components/button/src/button-custom.ts
 const PRESET_COLORS = [
 	"red",
@@ -40,8 +40,8 @@ const getShadeIndexes = (scheme) => {
 	};
 };
 function useButtonCustomStyle(props) {
-	const colorScheme = require_index$1.useColorScheme();
-	return (0, require_index.vue_exports.computed)(() => {
+	const colorScheme = require_index.useColorScheme();
+	return (0, vue.computed)(() => {
 		const styles = {};
 		const { color, gradient, justify, variant } = props;
 		const scheme = colorScheme.value;

package/lib/packages/components/button/src/button-custom.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-custom.js","names":["useColorScheme","generateColorShades","setColorAlpha"],"sources":["../../../../../../../packages/components/button/src/button-custom.ts"],"sourcesContent":["import { ColorScheme, useColorScheme } from '@cck-ui/hooks'\nimport { generateColorShades, setColorAlpha } from '@cck-ui/utils'\nimport { computed } from 'vue'\nimport { ButtonProps } from './button.types'\n\nconst PRESET_COLORS = [\n  'red',\n  'pink',\n  'grape',\n  'violet',\n  'indigo',\n  'blue',\n  'cyan',\n  'teal',\n  'green',\n  'lime',\n  'yellow',\n  'orange',\n  'gray',\n  'dark'\n]\n\nconst getShadeIndexes = (scheme: ColorScheme) => {\n  if (scheme === 'light') {\n    return {\n      bg: 6,\n      hover: 7,\n      lightBg: 1,\n      lightHover: 2,\n      lightColor: 9,\n      outlineColor: 6,\n      outlineHoverBgAlpha: 0.05\n    }\n  } else {\n    return {\n      bg: 8,\n      hover: 9,\n      lightBg: 1,\n      lightHover: 2,\n      lightColor: 9,\n      outlineColor: 4,\n      outlineHoverBgAlpha: 0.05\n    }\n  }\n}\n\nexport function useButtonCustomStyle(props: ButtonProps) {\n  const colorScheme = useColorScheme()\n\n  return computed(() => {\n    const styles: Record<string, string> = {}\n\n    const { color, gradient, justify, variant } = props\n    const scheme = colorScheme.value\n    const idx = getShadeIndexes(scheme)\n\n    if (justify) {\n      styles['--button-justify'] = justify\n    }\n\n    switch (variant) {\n      case 'default':\n        break\n      case 'filled':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-bg'] = `var(--c-color-${color}-filled)`\n            styles['--button-hover'] = `var(--c-color-${color}-filled-hover)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-bg'] = shades[idx.bg]\n            styles['--button-hover'] = shades[idx.hover]\n          }\n        }\n        break\n      case 'light':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-bg'] = `var(--c-color-${color}-light)`\n            styles['--button-hover'] = `var(--c-color-${color}-light-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-light-color)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-bg'] = shades[idx.lightBg]\n            styles['--button-hover'] = shades[idx.lightHover]\n            styles['--button-color'] = shades[idx.lightColor]\n          }\n        }\n        break\n      case 'outline':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-hover'] = `var(--c-color-${color}-outline-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-outline)`\n            styles['--button-bd'] =\n              `calc(0.0625rem * var(--c-scale)) solid var(--c-color-${color}-outline)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-hover'] = setColorAlpha(\n              shades[idx.outlineColor],\n              idx.outlineHoverBgAlpha\n            )\n            styles['--button-color'] = shades[idx.outlineColor]\n            styles['--button-bd'] =\n              `calc(0.0625rem * var(--c-scale)) solid ${shades[idx.outlineColor]}`\n          }\n        }\n        break\n      case 'subtle':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-hover'] = `var(--c-color-${color}-outline-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-outline)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-hover'] = setColorAlpha(\n              shades[idx.outlineColor],\n              idx.outlineHoverBgAlpha\n            )\n            styles['--button-color'] = shades[idx.outlineColor]\n          }\n        }\n        break\n      case 'transparent':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-color'] = `var(--c-color-${color}-light-color)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-color'] = shades[idx.lightColor]\n          }\n        }\n        break\n      case 'white':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-color'] = `var(--c-color-${color}-filled)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-color'] = shades[idx.bg]\n          }\n        }\n        break\n      case 'gradient':\n        const from = gradient?.from || 'blue'\n        const to = gradient?.to || 'cyan'\n        const deg = gradient?.deg || '45'\n\n        let finalFrom: string = from\n        let finalTo: string = to\n        if (PRESET_COLORS.includes(from)) {\n          finalFrom = `var(--c-color-${from}-filled)`\n        }\n        if (PRESET_COLORS.includes(to)) {\n          finalTo = `var(--c-color-${to}-filled)`\n        }\n\n        styles['--button-bg'] =\n          `linear-gradient(${deg}deg, ${finalFrom} 0%, ${finalTo} 100%)`\n        break\n      default:\n        break\n    }\n\n    return styles\n  })\n}\n"],"mappings":"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"}
+{"version":3,"file":"button-custom.js","names":["useColorScheme","generateColorShades","setColorAlpha"],"sources":["../../../../../../../packages/components/button/src/button-custom.ts"],"sourcesContent":["import { ColorScheme, useColorScheme } from '@cck-ui/hooks'\nimport { generateColorShades, setColorAlpha } from '@cck-ui/utils'\nimport { computed } from 'vue'\nimport { ButtonProps } from './button.types'\n\nconst PRESET_COLORS = [\n  'red',\n  'pink',\n  'grape',\n  'violet',\n  'indigo',\n  'blue',\n  'cyan',\n  'teal',\n  'green',\n  'lime',\n  'yellow',\n  'orange',\n  'gray',\n  'dark'\n]\n\nconst getShadeIndexes = (scheme: ColorScheme) => {\n  if (scheme === 'light') {\n    return {\n      bg: 6,\n      hover: 7,\n      lightBg: 1,\n      lightHover: 2,\n      lightColor: 9,\n      outlineColor: 6,\n      outlineHoverBgAlpha: 0.05\n    }\n  } else {\n    return {\n      bg: 8,\n      hover: 9,\n      lightBg: 1,\n      lightHover: 2,\n      lightColor: 9,\n      outlineColor: 4,\n      outlineHoverBgAlpha: 0.05\n    }\n  }\n}\n\nexport function useButtonCustomStyle(props: ButtonProps) {\n  const colorScheme = useColorScheme()\n\n  return computed(() => {\n    const styles: Record<string, string> = {}\n\n    const { color, gradient, justify, variant } = props\n    const scheme = colorScheme.value\n    const idx = getShadeIndexes(scheme)\n\n    if (justify) {\n      styles['--button-justify'] = justify\n    }\n\n    switch (variant) {\n      case 'default':\n        break\n      case 'filled':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-bg'] = `var(--c-color-${color}-filled)`\n            styles['--button-hover'] = `var(--c-color-${color}-filled-hover)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-bg'] = shades[idx.bg]\n            styles['--button-hover'] = shades[idx.hover]\n          }\n        }\n        break\n      case 'light':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-bg'] = `var(--c-color-${color}-light)`\n            styles['--button-hover'] = `var(--c-color-${color}-light-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-light-color)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-bg'] = shades[idx.lightBg]\n            styles['--button-hover'] = shades[idx.lightHover]\n            styles['--button-color'] = shades[idx.lightColor]\n          }\n        }\n        break\n      case 'outline':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-hover'] = `var(--c-color-${color}-outline-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-outline)`\n            styles['--button-bd'] =\n              `calc(0.0625rem * var(--c-scale)) solid var(--c-color-${color}-outline)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-hover'] = setColorAlpha(\n              shades[idx.outlineColor],\n              idx.outlineHoverBgAlpha\n            )\n            styles['--button-color'] = shades[idx.outlineColor]\n            styles['--button-bd'] =\n              `calc(0.0625rem * var(--c-scale)) solid ${shades[idx.outlineColor]}`\n          }\n        }\n        break\n      case 'subtle':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-hover'] = `var(--c-color-${color}-outline-hover)`\n            styles['--button-color'] = `var(--c-color-${color}-outline)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-hover'] = setColorAlpha(\n              shades[idx.outlineColor],\n              idx.outlineHoverBgAlpha\n            )\n            styles['--button-color'] = shades[idx.outlineColor]\n          }\n        }\n        break\n      case 'transparent':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-color'] = `var(--c-color-${color}-light-color)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-color'] = shades[idx.lightColor]\n          }\n        }\n        break\n      case 'white':\n        if (color) {\n          if (PRESET_COLORS.includes(color)) {\n            styles['--button-color'] = `var(--c-color-${color}-filled)`\n          } else {\n            const shades = generateColorShades(color)\n            styles['--button-color'] = shades[idx.bg]\n          }\n        }\n        break\n      case 'gradient':\n        const from = gradient?.from || 'blue'\n        const to = gradient?.to || 'cyan'\n        const deg = gradient?.deg || '45'\n\n        let finalFrom: string = from\n        let finalTo: string = to\n        if (PRESET_COLORS.includes(from)) {\n          finalFrom = `var(--c-color-${from}-filled)`\n        }\n        if (PRESET_COLORS.includes(to)) {\n          finalTo = `var(--c-color-${to}-filled)`\n        }\n\n        styles['--button-bg'] =\n          `linear-gradient(${deg}deg, ${finalFrom} 0%, ${finalTo} 100%)`\n        break\n      default:\n        break\n    }\n\n    return styles\n  })\n}\n"],"mappings":"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"}

package/lib/packages/components/button/src/button.vue_vue_type_script_setup_true_lang.js

@@ -1,7 +1,7 @@
-const require_index = require("../../../../node_modules/.pnpm/vue@3.5.35_typescript@6.0.3/node_modules/vue/index2.js");
-const require_index$1 = require("../../../hooks/use-namespace/index.js");
+const require_index = require("../../../hooks/use-namespace/index.js");
 const require_use_button = require("./use-button.js");
 const require_button_custom = require("./button-custom.js");
+let vue = require("vue");
 //#region ../../packages/components/button/src/button.vue?vue&type=script&setup=true&lang.ts
 const _hoisted_1 = {
 	key: 0,
@@ -19,7 +19,7 @@ const _hoisted_4 = {
 	key: 3,
 	"data-position": "right"
 };
-var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, require_index.vue_exports.defineComponent)({
+var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
 	name: "CButton",
 	__name: "button",
 	props: {
@@ -85,24 +85,24 @@ var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, requi
 		}
 	},
 	setup(__props, { expose: __expose }) {
-		const slots = (0, require_index.vue_exports.useSlots)();
-		const hasLeftSlot = (0, require_index.vue_exports.computed)(() => !!slots["left-section"]);
-		const hasRightSlot = (0, require_index.vue_exports.computed)(() => !!slots["right-section"]);
+		const slots = (0, vue.useSlots)();
+		const hasLeftSlot = (0, vue.computed)(() => !!slots["left-section"]);
+		const hasRightSlot = (0, vue.computed)(() => !!slots["right-section"]);
 		const props = __props;
 		const { _disabled, _props, _ref, handleClick } = require_use_button.useButton(props, {
 			hasLeftSlot: hasLeftSlot.value,
 			hasRightSlot: hasRightSlot.value
 		});
 		const buttonStyle = require_button_custom.useButtonCustomStyle(props);
-		const ns = require_index$1.useNamespace("button");
-		const buttonClass = (0, require_index.vue_exports.computed)(() => [
-			require_index$1.useNamespace("focus").b("auto"),
-			!_disabled.value && require_index$1.useNamespace("active").b(),
+		const ns = require_index.useNamespace("button");
+		const buttonClass = (0, vue.computed)(() => [
+			require_index.useNamespace("focus").b("auto"),
+			!_disabled.value && require_index.useNamespace("active").b(),
 			ns.e("root"),
 			ns.is("loading", props.loading)
 		]);
-		const innerClass = (0, require_index.vue_exports.computed)(() => [ns.e("inner")]);
-		const labelClass = (0, require_index.vue_exports.computed)(() => [ns.e("label")]);
+		const innerClass = (0, vue.computed)(() => [ns.e("inner")]);
+		const labelClass = (0, vue.computed)(() => [ns.e("label")]);
 		__expose({
 			/** @description if button is disabled */
 			disabled: _disabled.value,
@@ -114,15 +114,15 @@ var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, requi
 			variant: props.variant
 		});
 		return (_ctx, _cache) => {
-			return (0, require_index.vue_exports.openBlock)(), (0, require_index.vue_exports.createBlock)((0, require_index.vue_exports.resolveDynamicComponent)(__props.tag), (0, require_index.vue_exports.mergeProps)((0, require_index.vue_exports.unref)(_props), {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.tag), (0, vue.mergeProps)((0, vue.unref)(_props), {
 				class: buttonClass.value,
-				style: (0, require_index.vue_exports.unref)(buttonStyle),
-				onClick: (0, require_index.vue_exports.unref)(handleClick)
+				style: (0, vue.unref)(buttonStyle),
+				onClick: (0, vue.unref)(handleClick)
 			}), {
-				default: (0, require_index.vue_exports.withCtx)(() => [(0, require_index.vue_exports.createElementVNode)("span", { class: (0, require_index.vue_exports.normalizeClass)(innerClass.value) }, [
-					_ctx.$slots["left-section"] ? ((0, require_index.vue_exports.openBlock)(), (0, require_index.vue_exports.createElementBlock)("span", _hoisted_1, [(0, require_index.vue_exports.renderSlot)(_ctx.$slots, "left-section")])) : __props.leftSection ? ((0, require_index.vue_exports.openBlock)(), (0, require_index.vue_exports.createElementBlock)("span", _hoisted_2, [((0, require_index.vue_exports.openBlock)(), (0, require_index.vue_exports.createBlock)((0, require_index.vue_exports.resolveDynamicComponent)(__props.leftSection)))])) : (0, require_index.vue_exports.createCommentVNode)("v-if", true),
-					(0, require_index.vue_exports.createElementVNode)("span", { class: (0, require_index.vue_exports.normalizeClass)(labelClass.value) }, [(0, require_index.vue_exports.renderSlot)(_ctx.$slots, "default")], 2),
-					_ctx.$slots["right-section"] ? ((0, require_index.vue_exports.openBlock)(), (0, require_index.vue_exports.createElementBlock)("span", _hoisted_3, [(0, require_index.vue_exports.renderSlot)(_ctx.$slots, "right-section")])) : __props.rightSection ? ((0, require_index.vue_exports.openBlock)(), (0, require_index.vue_exports.createElementBlock)("span", _hoisted_4, [((0, require_index.vue_exports.openBlock)(), (0, require_index.vue_exports.createBlock)((0, require_index.vue_exports.resolveDynamicComponent)(__props.rightSection)))])) : (0, require_index.vue_exports.createCommentVNode)("v-if", true)
+				default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(innerClass.value) }, [
+					_ctx.$slots["left-section"] ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_1, [(0, vue.renderSlot)(_ctx.$slots, "left-section")])) : __props.leftSection ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_2, [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.leftSection)))])) : (0, vue.createCommentVNode)("v-if", true),
+					(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(labelClass.value) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2),
+					_ctx.$slots["right-section"] ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_3, [(0, vue.renderSlot)(_ctx.$slots, "right-section")])) : __props.rightSection ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_4, [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.rightSection)))])) : (0, vue.createCommentVNode)("v-if", true)
 				], 2)]),
 				_: 3
 			}, 16, [