@antdv-next/mobile 0.0.0-stage → 0.1.0

package/dist/collapse/style/index.css

@@ -0,0 +1,206 @@
+.am-collapse {
+  /* component tokens */
+  --am-collapse-header-padding: var(--am-padding-sm) var(--am-padding);
+  --am-collapse-header-min-height: 48px;
+  --am-collapse-header-font-size: var(--am-font-size-lg);
+  --am-collapse-header-color: var(--am-color-text);
+  --am-collapse-header-background: var(--am-color-bg-container);
+  --am-collapse-content-padding: var(--am-padding-sm) var(--am-padding);
+  --am-collapse-content-font-size: var(--am-font-size);
+  --am-collapse-content-color: var(--am-color-text-secondary);
+  --am-collapse-content-background: var(--am-color-bg-container);
+  --am-collapse-icon-size: 14px;
+  --am-collapse-icon-color: var(--am-color-text-tertiary);
+  --am-collapse-border-color: var(--am-color-split);
+
+  position: relative;
+  box-sizing: border-box;
+  color: var(--am-collapse-header-color);
+  font-size: var(--am-font-size);
+  font-family: var(--am-font-family);
+  line-height: var(--am-line-height);
+}
+
+.am-collapse-sm {
+  --am-collapse-header-padding: var(--am-padding-xs) var(--am-padding-sm);
+  --am-collapse-header-min-height: 40px;
+  --am-collapse-header-font-size: var(--am-font-size);
+  --am-collapse-content-padding: var(--am-padding-xs) var(--am-padding-sm);
+  --am-collapse-icon-size: 12px;
+}
+
+.am-collapse-lg {
+  --am-collapse-header-padding: var(--am-padding) var(--am-padding-md);
+  --am-collapse-header-min-height: 56px;
+  --am-collapse-header-font-size: var(--am-font-size-xl);
+  --am-collapse-content-padding: var(--am-padding) var(--am-padding-md);
+  --am-collapse-content-font-size: var(--am-font-size-lg);
+}
+
+.am-collapse-item {
+  position: relative;
+  box-sizing: border-box;
+  color: var(--am-collapse-header-color);
+  font-family: var(--am-font-family);
+}
+
+/* ---------- hairlines ---------- */
+.am-collapse-bordered::before,
+.am-collapse-bordered::after,
+.am-collapse-bordered > .am-collapse-item + .am-collapse-item::before,
+.am-collapse-bordered > .am-collapse-item > .am-collapse-panel::before {
+  position: absolute;
+  right: 0;
+  left: 0;
+  z-index: 1;
+  border-top: var(--am-line-width) var(--am-line-type) var(--am-collapse-border-color);
+  transform: scaleY(0.5);
+  content: '';
+  pointer-events: none;
+}
+
+.am-collapse-bordered::before,
+.am-collapse-bordered > .am-collapse-item + .am-collapse-item::before,
+.am-collapse-bordered > .am-collapse-item > .am-collapse-panel::before {
+  top: 0;
+  transform-origin: top;
+}
+
+.am-collapse-bordered::after {
+  bottom: 0;
+  transform-origin: bottom;
+}
+
+/* ---------- header ---------- */
+.am-collapse-header {
+  display: flex;
+  gap: var(--am-padding-xs);
+  align-items: center;
+  box-sizing: border-box;
+  min-height: var(--am-collapse-header-min-height, 48px);
+  padding: var(--am-collapse-header-padding, 12px 16px);
+  font-size: var(--am-collapse-header-font-size, 16px);
+  line-height: var(--am-line-height-lg);
+  background: var(--am-collapse-header-background, var(--am-color-bg-container));
+  outline: none;
+  cursor: pointer;
+  transition: background-color var(--am-motion-duration-mid);
+  user-select: none;
+  -webkit-tap-highlight-color: transparent;
+  touch-action: manipulation;
+}
+
+.am-collapse-header:active {
+  background: color-mix(
+    in srgb,
+    var(--am-collapse-header-background, var(--am-color-bg-container)),
+    var(--am-color-text-base) 4%
+  );
+}
+
+.am-collapse-header:focus-visible {
+  outline: 2px solid var(--am-color-primary-border);
+  outline-offset: -2px;
+}
+
+.am-collapse-title {
+  flex: 1 1 auto;
+  min-width: 0;
+  word-break: break-word;
+}
+
+.am-collapse-extra {
+  flex: none;
+  color: var(--am-color-text-tertiary);
+  font-size: var(--am-font-size);
+}
+
+.am-collapse-expand-icon {
+  display: inline-flex;
+  flex: none;
+  align-items: center;
+  color: var(--am-collapse-icon-color, var(--am-color-text-tertiary));
+  font-size: var(--am-collapse-icon-size, 14px);
+}
+
+.am-collapse-icon-end .am-collapse-expand-icon {
+  order: 3;
+}
+
+.am-collapse-arrow {
+  transition: transform var(--am-motion-duration-slow) var(--am-motion-ease-out);
+}
+
+[dir='rtl'] .am-collapse-arrow {
+  transform: rotate(180deg);
+}
+
+.am-collapse-item-active > .am-collapse-header .am-collapse-arrow,
+[dir='rtl'] .am-collapse-item-active > .am-collapse-header .am-collapse-arrow {
+  transform: rotate(90deg);
+}
+
+/* only a part of the header toggles */
+.am-collapse-item-collapsible-header > .am-collapse-header,
+.am-collapse-item-collapsible-icon > .am-collapse-header {
+  cursor: default;
+}
+
+.am-collapse-item-collapsible-header > .am-collapse-header:active,
+.am-collapse-item-collapsible-icon > .am-collapse-header:active,
+.am-collapse-item-disabled > .am-collapse-header:active {
+  background: var(--am-collapse-header-background, var(--am-color-bg-container));
+}
+
+.am-collapse-item-collapsible-header > .am-collapse-header > .am-collapse-title {
+  flex: 0 1 auto;
+  margin-inline-end: auto;
+  cursor: pointer;
+}
+
+.am-collapse-item-collapsible-icon > .am-collapse-header > .am-collapse-expand-icon {
+  /* larger touch target */
+  margin: -8px;
+  padding: 8px;
+  cursor: pointer;
+}
+
+.am-collapse-item-disabled > .am-collapse-header {
+  color: var(--am-color-text-disabled);
+  cursor: not-allowed;
+}
+
+.am-collapse-item-disabled > .am-collapse-header .am-collapse-expand-icon {
+  color: inherit;
+}
+
+/* ---------- content ---------- */
+.am-collapse-panel {
+  position: relative;
+  box-sizing: border-box;
+  overflow: hidden;
+  color: var(--am-collapse-content-color, var(--am-color-text-secondary));
+  font-size: var(--am-collapse-content-font-size, 14px);
+  background: var(--am-collapse-content-background, var(--am-color-bg-container));
+}
+
+.am-collapse-body {
+  box-sizing: border-box;
+  padding: var(--am-collapse-content-padding, 12px 16px);
+}
+
+/* ---------- ghost ---------- */
+.am-collapse-ghost {
+  --am-collapse-header-background: transparent;
+  --am-collapse-content-background: transparent;
+}
+
+.am-collapse-ghost .am-collapse-header:active {
+  background: var(--am-color-fill-tertiary);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .am-collapse-arrow {
+    transition-duration: 0.01s;
+  }
+}

package/dist/collapse-transition/CollapseTransition.js

@@ -0,0 +1,4 @@
+import CollapseTransition_vue_vue_type_script_setup_true_lang_default from "./CollapseTransition.vue_vue_type_script_setup_true_lang.js";
+// src/collapse-transition/CollapseTransition.vue
+var CollapseTransition_default = CollapseTransition_vue_vue_type_script_setup_true_lang_default;
+export { CollapseTransition_default as default };

package/dist/collapse-transition/CollapseTransition.vue.d.ts

@@ -0,0 +1,23 @@
+import type { CollapseTransitionProps, CollapseTransitionSlots } from './interface';
+import '../style';
+import './style/index.css';
+type __VLS_Slots = CollapseTransitionSlots;
+declare const __VLS_base: import("vue").DefineComponent<CollapseTransitionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    afterOpenChange: (open: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<CollapseTransitionProps> & Readonly<{
+    onAfterOpenChange?: ((open: boolean) => any) | undefined;
+}>, {
+    open: boolean;
+    destroyOnHidden: boolean;
+    appear: boolean;
+    forceRender: boolean;
+    tag: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/collapse-transition/CollapseTransition.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,95 @@
+import "../style/index2.js";
+import './style/index.css';/* empty css            */
+import { Transition, computed, createBlock, createCommentVNode, defineComponent, mergeProps, openBlock, ref, renderSlot, resolveDynamicComponent, vShow, watch, withCtx, withDirectives } from "vue";
+// src/collapse-transition/CollapseTransition.vue?vue&type=script&setup=true&lang.ts
+var CollapseTransition_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "AmCollapseTransition",
+	inheritAttrs: false,
+	__name: "CollapseTransition",
+	props: {
+		open: {
+			type: Boolean,
+			default: false
+		},
+		forceRender: {
+			type: Boolean,
+			default: false
+		},
+		destroyOnHidden: {
+			type: Boolean,
+			default: false
+		},
+		appear: {
+			type: Boolean,
+			default: false
+		},
+		tag: { default: "div" },
+		rootClass: {},
+		classes: {},
+		styles: {}
+	},
+	emits: ["afterOpenChange"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const visited = ref(props.open);
+		watch(() => props.open, (open) => {
+			if (open) visited.value = true;
+		});
+		const shouldRender = computed(() => props.open || props.forceRender || visited.value && !props.destroyOnHidden);
+		function onBeforeEnter(el) {
+			el.style.height = "0px";
+		}
+		function onEnter(el) {
+			const node = el;
+			node.offsetHeight;
+			node.style.height = `${node.scrollHeight}px`;
+		}
+		function onBeforeLeave(el) {
+			const node = el;
+			node.style.height = `${node.offsetHeight}px`;
+		}
+		function onLeave(el) {
+			const node = el;
+			node.offsetHeight;
+			node.style.height = "0px";
+		}
+		function clearHeight(el) {
+			el.style.height = "";
+		}
+		let settled;
+		function settle(el, open) {
+			clearHeight(el);
+			if (settled !== open) {
+				settled = open;
+				emit("afterOpenChange", open);
+			}
+		}
+		const onAfterEnter = (el) => settle(el, true);
+		const onAfterLeave = (el) => settle(el, false);
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(Transition, {
+				name: "am-collapse-transition",
+				appear: __props.appear,
+				onBeforeEnter,
+				onEnter,
+				onAfterEnter,
+				onEnterCancelled: clearHeight,
+				onBeforeLeave,
+				onLeave,
+				onAfterLeave,
+				onLeaveCancelled: clearHeight
+			}, {
+				default: withCtx(() => [shouldRender.value ? withDirectives((openBlock(), createBlock(resolveDynamicComponent(__props.tag), mergeProps({ key: 0 }, _ctx.$attrs, {
+					class: ["am-collapse-transition", [__props.rootClass, __props.classes?.root]],
+					style: __props.styles?.root
+				}), {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+					_: 3
+				}, 16, ["class", "style"])), [[vShow, __props.open]]) : createCommentVNode("", true)]),
+				_: 3
+			}, 8, ["appear"]);
+		};
+	}
+});
+export { CollapseTransition_vue_vue_type_script_setup_true_lang_default as default };

package/dist/collapse-transition/index.d.ts

@@ -0,0 +1,45 @@
+export type * from './interface';
+declare const CollapseTransition: import("../_util/withInstall").WithInstall<{
+    new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("./interface").CollapseTransitionProps> & Readonly<{
+        onAfterOpenChange?: ((open: boolean) => any) | undefined;
+    }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        afterOpenChange: (open: boolean) => any;
+    }, import("vue").PublicProps, {
+        open: boolean;
+        destroyOnHidden: boolean;
+        appear: boolean;
+        forceRender: boolean;
+        tag: string;
+    }, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import("./interface").CollapseTransitionProps> & Readonly<{
+        onAfterOpenChange?: ((open: boolean) => any) | undefined;
+    }>, {}, {}, {}, {}, {
+        open: boolean;
+        destroyOnHidden: boolean;
+        appear: boolean;
+        forceRender: boolean;
+        tag: string;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("./interface").CollapseTransitionProps> & Readonly<{
+    onAfterOpenChange?: ((open: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    afterOpenChange: (open: boolean) => any;
+}, string, {
+    open: boolean;
+    destroyOnHidden: boolean;
+    appear: boolean;
+    forceRender: boolean;
+    tag: string;
+}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+    $slots: import("./interface").CollapseTransitionSlots;
+}), object>;
+export default CollapseTransition;

package/dist/collapse-transition/index.js

@@ -0,0 +1,5 @@
+import { withInstall } from "../_util/withInstall.js";
+import CollapseTransition_default from "./CollapseTransition.js";
+// src/collapse-transition/index.ts
+var CollapseTransition = withInstall(CollapseTransition_default, "AmCollapseTransition");
+export { CollapseTransition as default };

package/dist/collapse-transition/interface.d.ts

@@ -0,0 +1,29 @@
+import type { CSSProperties } from 'vue';
+export interface CollapseTransitionSemanticClassNames {
+    root?: string;
+}
+export interface CollapseTransitionSemanticStyles {
+    root?: CSSProperties;
+}
+export interface CollapseTransitionProps {
+    /** Whether the content is expanded */
+    open?: boolean;
+    /** Render the content before it was expanded for the first time */
+    forceRender?: boolean;
+    /** Remove the content from the DOM while collapsed */
+    destroyOnHidden?: boolean;
+    /** Play the expand animation when first rendered expanded */
+    appear?: boolean;
+    /** Root tag */
+    tag?: string;
+    rootClass?: string;
+    classes?: CollapseTransitionSemanticClassNames;
+    styles?: CollapseTransitionSemanticStyles;
+}
+export interface CollapseTransitionEmits {
+    /** The expand / collapse animation finished */
+    afterOpenChange: [open: boolean];
+}
+export interface CollapseTransitionSlots {
+    default?: () => any;
+}

package/dist/collapse-transition/style/index.css

@@ -0,0 +1,25 @@
+/*
+ * A pure motion wrapper: it inherits font and color from its context. The height is animated on the
+ * root, so paddings belong to the content inside (a padded root could not collapse to 0).
+ */
+.am-collapse-transition {
+  /* component tokens */
+  --am-collapse-transition-duration: var(--am-motion-duration-slow);
+  --am-collapse-transition-timing-function: var(--am-motion-ease-in-out);
+
+  box-sizing: border-box;
+}
+
+.am-collapse-transition-enter-active,
+.am-collapse-transition-leave-active {
+  overflow: hidden;
+  transition: height var(--am-collapse-transition-duration) var(--am-collapse-transition-timing-function);
+  will-change: height;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .am-collapse-transition-enter-active,
+  .am-collapse-transition-leave-active {
+    transition-duration: 0.01s;
+  }
+}

package/dist/color-picker/ColorBlock.js

@@ -0,0 +1,4 @@
+import ColorBlock_vue_vue_type_script_setup_true_lang_default from "./ColorBlock.vue_vue_type_script_setup_true_lang.js";
+// src/color-picker/ColorBlock.vue
+var ColorBlock_default = ColorBlock_vue_vue_type_script_setup_true_lang_default;
+export { ColorBlock_default as default };

package/dist/color-picker/ColorBlock.vue.d.ts

@@ -0,0 +1,12 @@
+import type { CSSProperties } from 'vue';
+type __VLS_Props = {
+    /** css color */
+    color?: string;
+    /** show the "no color" mark instead of the color */
+    cleared?: boolean;
+    innerClass?: string;
+    innerStyle?: CSSProperties;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/color-picker/ColorBlock.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,23 @@
+import { createCommentVNode, createElementBlock, defineComponent, normalizeClass, normalizeStyle, openBlock } from "vue";
+// src/color-picker/ColorBlock.vue?vue&type=script&setup=true&lang.ts
+/** Internal: a color swatch on a checkerboard, or the "no color" mark. */
+var ColorBlock_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "AmColorPickerBlock",
+	__name: "ColorBlock",
+	props: {
+		color: {},
+		cleared: { type: Boolean },
+		innerClass: {},
+		innerStyle: {}
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", { class: normalizeClass(["am-color-picker-block", { "am-color-picker-block-cleared": __props.cleared }]) }, [!__props.cleared ? (openBlock(), createElementBlock("span", {
+				key: 0,
+				class: normalizeClass(["am-color-picker-block-inner", __props.innerClass]),
+				style: normalizeStyle([{ background: __props.color }, __props.innerStyle])
+			}, null, 6)) : createCommentVNode("", true)], 2);
+		};
+	}
+});
+export { ColorBlock_vue_vue_type_script_setup_true_lang_default as default };

package/dist/color-picker/ColorInput.js

@@ -0,0 +1,4 @@
+import ColorInput_vue_vue_type_script_setup_true_lang_default from "./ColorInput.vue_vue_type_script_setup_true_lang.js";
+// src/color-picker/ColorInput.vue
+var ColorInput_default = ColorInput_vue_vue_type_script_setup_true_lang_default;
+export { ColorInput_default as default };

package/dist/color-picker/ColorInput.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/color-picker/ColorInput.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,162 @@
+import InputNumber_default from "../input-number/InputNumber.js";
+import Input_default from "../input/Input.js";
+import Segmented_default from "../segmented/Segmented.js";
+import { generateColor, getColorAlpha, getRoundNumber, toHexFormat } from "./color.js";
+import { useColorPickerPanelContext } from "./context.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, ref, renderList, unref, watch } from "vue";
+// src/color-picker/ColorInput.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "am-color-picker-input-row" };
+/** Internal: format switch + value inputs. */
+var ColorInput_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "AmColorPickerInput",
+	__name: "ColorInput",
+	setup(__props) {
+		const ctx = useColorPickerPanelContext();
+		const formatOptions = [
+			"hex",
+			"hsb",
+			"rgb"
+		].map((value) => ({
+			value,
+			label: value.toUpperCase()
+		}));
+		const rgb = computed(() => ctx.color.value.toRgb());
+		const hsb = computed(() => ctx.color.value.toHsb());
+		const alpha = computed(() => getColorAlpha(ctx.color.value));
+		const hexReg = /^#(?:[\da-f]{6}|[\da-f]{8})$/i;
+		const hexValue = ref("");
+		watch(() => ctx.color.value, (color) => {
+			hexValue.value = toHexFormat(color.toHexString());
+		}, { immediate: true });
+		function onHexChange(text) {
+			hexValue.value = toHexFormat(text);
+			if (hexReg.test(`#${toHexFormat(text, true)}`)) ctx.change(generateColor(text));
+		}
+		/** An emptied field keeps the color; it shows the current value again on blur. */
+		const isNumber = (value) => typeof value === "number" && !Number.isNaN(value);
+		function onRgbChange(value, key) {
+			if (isNumber(value)) ctx.change(generateColor({
+				...rgb.value,
+				[key]: value
+			}));
+		}
+		function onHsbChange(value, key) {
+			if (isNumber(value)) ctx.change(generateColor({
+				...hsb.value,
+				[key]: key === "h" ? value : value / 100
+			}));
+		}
+		function onAlphaChange(value) {
+			if (isNumber(value)) ctx.change(generateColor({
+				...hsb.value,
+				a: value / 100
+			}));
+		}
+		function onFormatChange(value) {
+			ctx.setFormat(value);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: normalizeClass(["am-color-picker-input-container", unref(ctx).classes.value?.input]),
+				style: normalizeStyle(unref(ctx).styles.value?.input)
+			}, [!unref(ctx).disabledFormat.value ? (openBlock(), createBlock(Segmented_default, {
+				key: 0,
+				class: "am-color-picker-format",
+				block: "",
+				size: "large",
+				options: unref(formatOptions),
+				value: unref(ctx).format.value,
+				disabled: unref(ctx).disabled.value,
+				onChange: onFormatChange
+			}, null, 8, [
+				"options",
+				"value",
+				"disabled"
+			])) : createCommentVNode("", true), createElementVNode("div", _hoisted_1, [createElementVNode("div", { class: normalizeClass(["am-color-picker-input", `am-color-picker-${unref(ctx).format.value}-input`]) }, [unref(ctx).format.value === "rgb" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, renderList([
+				"r",
+				"g",
+				"b"
+			], (key) => {
+				return createVNode(InputNumber_default, {
+					key,
+					mode: "input",
+					size: "middle",
+					variant: "outlined",
+					inputmode: "numeric",
+					min: 0,
+					max: 255,
+					precision: 0,
+					value: rgb.value[key],
+					disabled: unref(ctx).disabled.value,
+					"aria-label": key,
+					onChange: ($event) => onRgbChange($event, key)
+				}, null, 8, [
+					"value",
+					"disabled",
+					"aria-label",
+					"onChange"
+				]);
+			}), 64)) : unref(ctx).format.value === "hsb" ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [createVNode(InputNumber_default, {
+				mode: "input",
+				size: "middle",
+				variant: "outlined",
+				inputmode: "numeric",
+				min: 0,
+				max: 360,
+				precision: 0,
+				value: unref(getRoundNumber)(hsb.value.h),
+				disabled: unref(ctx).disabled.value,
+				"aria-label": "h",
+				onChange: _cache[0] || (_cache[0] = ($event) => onHsbChange($event, "h"))
+			}, null, 8, ["value", "disabled"]), (openBlock(), createElementBlock(Fragment, null, renderList(["s", "b"], (key) => {
+				return createVNode(InputNumber_default, {
+					key,
+					mode: "input",
+					size: "middle",
+					variant: "outlined",
+					inputmode: "numeric",
+					suffix: "%",
+					min: 0,
+					max: 100,
+					precision: 0,
+					value: unref(getRoundNumber)(hsb.value[key] * 100),
+					disabled: unref(ctx).disabled.value,
+					"aria-label": key,
+					onChange: ($event) => onHsbChange($event, key)
+				}, null, 8, [
+					"value",
+					"disabled",
+					"aria-label",
+					"onChange"
+				]);
+			}), 64))], 64)) : (openBlock(), createBlock(Input_default, {
+				key: 2,
+				size: "middle",
+				variant: "outlined",
+				prefix: "#",
+				autocomplete: "off",
+				maxlength: 9,
+				value: hexValue.value,
+				disabled: unref(ctx).disabled.value,
+				"aria-label": "hex",
+				"onUpdate:value": onHexChange
+			}, null, 8, ["value", "disabled"]))], 2), !unref(ctx).disabledAlpha.value ? (openBlock(), createBlock(InputNumber_default, {
+				key: 0,
+				class: "am-color-picker-alpha-input",
+				mode: "input",
+				size: "middle",
+				variant: "outlined",
+				inputmode: "numeric",
+				suffix: "%",
+				min: 0,
+				max: 100,
+				precision: 0,
+				value: alpha.value,
+				disabled: unref(ctx).disabled.value,
+				"aria-label": "alpha",
+				onChange: onAlphaChange
+			}, null, 8, ["value", "disabled"])) : createCommentVNode("", true)])], 6);
+		};
+	}
+});
+export { ColorInput_vue_vue_type_script_setup_true_lang_default as default };

package/dist/color-picker/ColorPalette.js

@@ -0,0 +1,4 @@
+import ColorPalette_vue_vue_type_script_setup_true_lang_default from "./ColorPalette.vue_vue_type_script_setup_true_lang.js";
+// src/color-picker/ColorPalette.vue
+var ColorPalette_default = ColorPalette_vue_vue_type_script_setup_true_lang_default;
+export { ColorPalette_default as default };

package/dist/color-picker/ColorPalette.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;