@itguy614/clean-ui 0.3.1 → 1.0.0

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

@@ -1 +1 @@
-{"version":3,"file":"CuiIcon.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiIcon.vue"],"names":[],"mappings":"AA0HA,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;AACpF,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAEjE,MAAM,WAAW,YAAY;IAC3B,qFAAqF;IACrF,IAAI,EAAE,MAAM,CAAC;IACb,wBAAwB;IACxB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,+DAA+D;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gDAAgD;IAChD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,yBAAyB;IACzB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;;YAXU,UAAU;UAEZ,QAAQ;WAEP,MAAM;oBAIG,MAAM;YAEd,OAAO;;AA+HlB,wBAOG"}
+{"version":3,"file":"CuiIcon.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiIcon.vue"],"names":[],"mappings":"AAoJA,OAAO,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAG7E,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;AACpF,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAE/C,MAAM,WAAW,YAAa,SAAQ,aAAa;IACjD,qFAAqF;IACrF,IAAI,EAAE,MAAM,CAAC;IACb,wBAAwB;IACxB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,0DAA0D;IAC1D,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,uEAAuE;IACvE,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gDAAgD;IAChD,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;;;YATU,UAAU;UAEZ,QAAQ;WAEP,aAAa;oBAIJ,MAAM;;AAwJzB,wBAOG"}

package/dist/components/CuiIcon.vue.js

@@ -0,0 +1,7 @@
+import o from "./CuiIcon.vue2.js";
+/* empty css             */
+import t from "../_virtual/_plugin-vue_export-helper.js";
+const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-9be9ff93"]]);
+export {
+  p as default
+};

package/dist/components/CuiIcon.vue2.js

@@ -0,0 +1,72 @@
+import { defineComponent as w, computed as d, ref as C, onMounted as y, watch as g, withDirectives as z, openBlock as r, createElementBlock as m, normalizeStyle as h, normalizeClass as k, createBlock as I, resolveDynamicComponent as S, unref as x, vShow as B } from "vue";
+import { resolveColor as M } from "../utils/color.js";
+const D = /* @__PURE__ */ w({
+  __name: "CuiIcon",
+  props: {
+    name: {},
+    weight: { default: "regular" },
+    size: { default: "md" },
+    color: { default: "currentColor" },
+    duotoneColor: {},
+    duotoneOpacity: { default: 0.2 },
+    hidden: { type: Boolean, default: !1 }
+  },
+  setup(n) {
+    const o = n, p = {
+      xs: "0.875rem",
+      // 14px
+      sm: "1rem",
+      // 16px
+      md: "1.25rem",
+      // 20px
+      lg: "1.5rem",
+      // 24px
+      xl: "2rem"
+      // 32px
+    }, a = d(() => p[o.size] ?? o.size);
+    function f(e) {
+      return "Ph" + e.split("-").map((t) => t.charAt(0).toUpperCase() + t.slice(1)).join("");
+    }
+    const i = /* @__PURE__ */ new Map(), l = C(null);
+    async function s(e) {
+      const t = f(e);
+      if (i.has(t)) {
+        l.value = i.get(t);
+        return;
+      }
+      try {
+        const u = await import("@phosphor-icons/vue");
+        let c = u[t];
+        c || (console.warn(`[CuiIcon] Icon "${e}" (${t}) not found in @phosphor-icons/vue`), c = u.PhQuestion), i.set(t, c), o.name === e && (l.value = c);
+      } catch {
+        console.warn(`[CuiIcon] Failed to load icon "${e}"`);
+      }
+    }
+    y(() => s(o.name)), g(() => o.name, (e) => s(e));
+    const v = d(() => {
+      const e = {};
+      return o.weight === "duotone" && (o.duotoneColor && (e["--_duotone-color"] = o.duotoneColor), e["--_duotone-opacity"] = String(o.duotoneOpacity)), e;
+    });
+    return (e, t) => z((r(), m("span", {
+      class: k(["cui-icon", { "cui-icon--duotone": n.weight === "duotone" }]),
+      style: h(v.value)
+    }, [
+      l.value ? (r(), I(S(l.value), {
+        key: 0,
+        weight: n.weight,
+        size: a.value,
+        color: x(M)(n.color)
+      }, null, 8, ["weight", "size", "color"])) : (r(), m("span", {
+        key: 1,
+        class: "cui-icon__placeholder",
+        style: h({ width: a.value, height: a.value }),
+        "aria-hidden": "true"
+      }, null, 4))
+    ], 6)), [
+      [B, !n.hidden]
+    ]);
+  }
+});
+export {
+  D as default
+};

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

@@ -1,29 +1,22 @@
-import type { ButtonColor } from "./CuiButton.vue";
-export type InputSize = "xs" | "sm" | "md" | "lg" | "xl";
+import type { HideableProps, ColorableProps, SizeableProps, DisableableProps, CuiRounded } from "../types/common";
 export type InputType = "text" | "password" | "email" | "url" | "tel" | "search";
-export interface CuiInputProps {
+export interface CuiInputProps extends HideableProps, ColorableProps, SizeableProps, DisableableProps {
     /** v-model binding */
     modelValue?: string;
     /** Input type */
     type?: InputType;
     /** Placeholder text */
     placeholder?: string;
-    /** Color role — affects focus border */
-    color?: ButtonColor;
-    /** Size */
-    size?: InputSize;
     /** Show clear button when input has value */
     clearable?: boolean;
     /** Show error state (red border + message) */
     error?: boolean;
     /** Error message displayed below the input */
     errorMessage?: string;
-    /** Disabled state */
-    disabled?: boolean;
     /** Readonly state */
     readonly?: boolean;
-    /** Hide the component */
-    hidden?: boolean;
+    /** Border radius */
+    rounded?: CuiRounded;
 }
 declare function focus(opts?: FocusOptions): void;
 declare function blur(): void;
@@ -48,14 +41,15 @@ declare const __VLS_component: import("vue").DefineComponent<CuiInputProps, {
     onClear?: (() => any) | undefined;
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {
-    size: InputSize;
-    color: ButtonColor;
+    error: boolean;
+    readonly: boolean;
     hidden: boolean;
+    size: import("..").CuiSize;
+    color: import("..").CuiColor;
     type: InputType;
-    error: boolean;
+    rounded: CuiRounded;
     disabled: boolean;
     modelValue: string;
-    readonly: boolean;
     clearable: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

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

@@ -1 +1 @@
-{"version":3,"file":"CuiInput.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiInput.vue"],"names":[],"mappings":"AA+WA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAInD,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACzD,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,KAAK,GAAG,KAAK,GAAG,QAAQ,CAAC;AAEjF,MAAM,WAAW,aAAa;IAC5B,sBAAsB;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,uBAAuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wCAAwC;IACxC,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,WAAW;IACX,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,8CAA8C;IAC9C,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8CAA8C;IAC9C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yBAAyB;IACzB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AA6CD,iBAAS,KAAK,CAAC,IAAI,CAAC,EAAE,YAAY,QAEjC;AAED,iBAAS,IAAI,SAEZ;AAiND,QAAA,IAAI,OAAO,IAAU,EAAE,OAAO,IAAU,EAAE,QAAQ,IAAW,EAAE,QAAQ,IAAY,CAAE;AACrF,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GACpD;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC3C;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AA8BxD,QAAA,MAAM,eAAe;;;;;;;;;;;UApTZ,SAAS;WAFR,WAAW;YAcV,OAAO;UAlBT,SAAS;WAUR,OAAO;cAIJ,OAAO;gBAhBL,MAAM;cAkBR,OAAO;eARN,OAAO;6EA2TnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAa1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"CuiInput.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiInput.vue"],"names":[],"mappings":"AAmXA,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,aAAa,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAalH,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,KAAK,GAAG,KAAK,GAAG,QAAQ,CAAC;AAEjF,MAAM,WAAW,aAAc,SAAQ,aAAa,EAAE,cAAc,EAAE,aAAa,EAAE,gBAAgB;IACnG,sBAAsB;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,uBAAuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,8CAA8C;IAC9C,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8CAA8C;IAC9C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oBAAoB;IACpB,OAAO,CAAC,EAAE,UAAU,CAAC;CACtB;AA8CD,iBAAS,KAAK,CAAC,IAAI,CAAC,EAAE,YAAY,QAEjC;AAED,iBAAS,IAAI,SAEZ;AAoND,QAAA,IAAI,OAAO,IAAU,EAAE,OAAO,IAAU,EAAE,QAAQ,IAAW,EAAE,QAAQ,IAAY,CAAE;AACrF,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GACpD;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC3C;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAgCxD,QAAA,MAAM,eAAe;;;;;;;;;;;WApTX,OAAO;cAIJ,OAAO;;;;UAVX,SAAS;aAYN,UAAU;;gBAdP,MAAM;eAMP,OAAO;6EA+TnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAa1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/CuiInput.vue.js

@@ -0,0 +1,7 @@
+import o from "./CuiInput.vue2.js";
+/* empty css              */
+import t from "../_virtual/_plugin-vue_export-helper.js";
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-30a3b85f"]]);
+export {
+  f as default
+};

package/dist/components/CuiInput.vue2.js

@@ -0,0 +1,148 @@
+import { defineComponent as S, ref as _, computed as n, useTemplateRef as E, withDirectives as I, openBlock as i, createElementBlock as u, createElementVNode as m, normalizeStyle as M, normalizeClass as N, renderSlot as d, createCommentVNode as a, unref as v, createVNode as P, createBlock as h, toDisplayString as R, vShow as T } from "vue";
+import b from "./CuiIcon.vue.js";
+import { INPUT_SIZE_SCALE as D } from "../utils/sizing.js";
+import { useMessages as A } from "../composables/useMessages.js";
+const L = { class: "cui-input-wrapper" }, U = {
+  key: 0,
+  class: "cui-input__prefix-button"
+}, Z = { class: "cui-input__inner" }, j = {
+  key: 0,
+  class: "cui-input__prefix"
+}, q = ["type", "value", "placeholder", "disabled", "readonly", "aria-invalid"], F = ["aria-label"], G = ["aria-label"], H = {
+  key: 3,
+  class: "cui-input__suffix"
+}, J = {
+  key: 1,
+  class: "cui-input__suffix-button"
+}, K = {
+  key: 0,
+  class: "cui-input__error"
+}, ee = /* @__PURE__ */ S({
+  __name: "CuiInput",
+  props: {
+    modelValue: { default: "" },
+    type: { default: "text" },
+    placeholder: {},
+    clearable: { type: Boolean, default: !1 },
+    error: { type: Boolean, default: !1 },
+    errorMessage: {},
+    readonly: { type: Boolean, default: !1 },
+    rounded: { default: "md" },
+    hidden: { type: Boolean, default: !1 },
+    color: { default: "primary" },
+    size: { default: "md" },
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "clear"],
+  setup(t, { expose: x, emit: g }) {
+    const k = {
+      none: "0",
+      sm: "0.25rem",
+      md: "var(--cui-button-radius, 0.375rem)",
+      lg: "0.5rem",
+      full: "9999px"
+    }, o = t, c = g, l = _(!1), y = n(() => o.type === "password"), $ = n(() => y.value && l.value ? "text" : o.type), w = n(() => o.clearable && o.modelValue && !o.disabled && !o.readonly);
+    function V() {
+      var e;
+      c("update:modelValue", ""), c("clear"), (e = r.value) == null || e.focus();
+    }
+    function z(e) {
+      c("update:modelValue", e.target.value);
+    }
+    const r = E("inputEl");
+    function C(e) {
+      var s;
+      (s = r.value) == null || s.focus(e);
+    }
+    function B() {
+      var e;
+      (e = r.value) == null || e.blur();
+    }
+    x({ el: r, focus: C, blur: B });
+    const f = n(() => D[o.size]), p = A();
+    return (e, s) => I((i(), u("div", L, [
+      m("div", {
+        class: N(["cui-input", {
+          "cui-input--error": t.error,
+          "cui-input--disabled": t.disabled,
+          "cui-input--focused": !1,
+          "cui-input--has-prefix-button": e.$slots["prefix-button"],
+          "cui-input--has-suffix-button": e.$slots["suffix-button"]
+        }]),
+        style: M({
+          borderRadius: k[t.rounded],
+          "--_input-height": f.value.height,
+          "--_input-font-size": f.value.fontSize,
+          "--_input-px": f.value.px,
+          "--_input-color": `var(--cui-${t.color})`,
+          "--_input-focus-ring": `var(--cui-${t.color}-focus-ring)`,
+          "--_input-border": t.error ? "var(--cui-error)" : "var(--cui-border-strong)",
+          "--_input-focus-border": t.error ? "var(--cui-error)" : `var(--cui-${t.color})`
+        })
+      }, [
+        e.$slots["prefix-button"] ? (i(), u("div", U, [
+          d(e.$slots, "prefix-button", {}, void 0, !0)
+        ])) : a("", !0),
+        m("div", Z, [
+          e.$slots.prefix ? (i(), u("span", j, [
+            d(e.$slots, "prefix", {}, void 0, !0)
+          ])) : a("", !0),
+          m("input", {
+            ref: "inputEl",
+            type: $.value,
+            value: t.modelValue,
+            placeholder: t.placeholder,
+            disabled: t.disabled,
+            readonly: t.readonly,
+            "aria-invalid": t.error || void 0,
+            class: "cui-input__native",
+            onInput: z
+          }, null, 40, q),
+          w.value ? (i(), u("button", {
+            key: 1,
+            type: "button",
+            class: "cui-input__clear",
+            tabindex: "-1",
+            "aria-label": v(p).input.clear,
+            onClick: V
+          }, [
+            P(b, {
+              name: "x",
+              size: "0.75rem"
+            })
+          ], 8, F)) : a("", !0),
+          y.value ? (i(), u("button", {
+            key: 2,
+            type: "button",
+            class: "cui-input__password-toggle",
+            tabindex: "-1",
+            "aria-label": l.value ? v(p).input.hidePassword : v(p).input.showPassword,
+            onClick: s[0] || (s[0] = (O) => l.value = !l.value)
+          }, [
+            l.value ? (i(), h(b, {
+              key: 1,
+              name: "eye-slash",
+              size: "1rem"
+            })) : (i(), h(b, {
+              key: 0,
+              name: "eye",
+              size: "1rem"
+            }))
+          ], 8, G)) : a("", !0),
+          e.$slots.suffix ? (i(), u("span", H, [
+            d(e.$slots, "suffix", {}, void 0, !0)
+          ])) : a("", !0)
+        ]),
+        e.$slots["suffix-button"] ? (i(), u("div", J, [
+          d(e.$slots, "suffix-button", {}, void 0, !0)
+        ])) : a("", !0)
+      ], 6),
+      t.error && t.errorMessage ? (i(), u("div", K, R(t.errorMessage), 1)) : a("", !0)
+    ], 512)), [
+      [T, !t.hidden]
+    ]);
+  }
+});
+export {
+  ee as default
+};

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

@@ -1,7 +1,6 @@
-import type { ButtonColor } from "./CuiButton.vue";
-export type InputStepperSize = "sm" | "md" | "lg";
+import type { CuiColor, CuiSize, HideableProps, ColorableProps, SizeableProps, DisableableProps } from "../types/common";
 export type InputStepperOrientation = "horizontal" | "vertical";
-export interface CuiInputStepperProps {
+export interface CuiInputStepperProps extends HideableProps, ColorableProps, SizeableProps, DisableableProps {
     /** Current value */
     modelValue?: number;
     /** Minimum value */
@@ -10,32 +9,30 @@ export interface CuiInputStepperProps {
     max?: number;
     /** Step increment */
     step?: number;
-    /** Size */
-    size?: InputStepperSize;
     /** Orientation */
     orientation?: InputStepperOrientation;
-    /** Color role */
-    color?: ButtonColor;
-    /** Disabled state */
-    disabled?: boolean;
     /** Label displayed above */
     label?: string;
     /** Pad value with leading zeros to this width */
     pad?: number;
     /** Wrap around from max to min and vice versa */
     wrap?: boolean;
-    /** Hide the component */
-    hidden?: boolean;
 }
-declare const _default: import("vue").DefineComponent<CuiInputStepperProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare function focus(opts?: FocusOptions): void;
+declare function blur(): void;
+declare const _default: import("vue").DefineComponent<CuiInputStepperProps, {
+    el: Readonly<import("vue").ShallowRef<HTMLElement | null>>;
+    focus: typeof focus;
+    blur: typeof blur;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: number) => any;
 }, string, import("vue").PublicProps, Readonly<CuiInputStepperProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: number) => any) | undefined;
 }>, {
     wrap: boolean;
-    size: InputStepperSize;
-    color: ButtonColor;
     hidden: boolean;
+    size: CuiSize;
+    color: CuiColor;
     disabled: boolean;
     orientation: InputStepperOrientation;
     modelValue: number;

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

@@ -1 +1 @@
-{"version":3,"file":"CuiInputStepper.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiInputStepper.vue"],"names":[],"mappings":"AAoLA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAInD,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAElD,MAAM,MAAM,uBAAuB,GAAG,YAAY,GAAG,UAAU,CAAC;AAEhE,MAAM,WAAW,oBAAoB;IACnC,oBAAoB;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,oBAAoB;IACpB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,oBAAoB;IACpB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,qBAAqB;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW;IACX,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,kBAAkB;IAClB,WAAW,CAAC,EAAE,uBAAuB,CAAC;IACtC,iBAAiB;IACjB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iDAAiD;IACjD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,iDAAiD;IACjD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,yBAAyB;IACzB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;;;;;;UAHQ,OAAO;UAZP,gBAAgB;WAIf,WAAW;YAUV,OAAO;cARL,OAAO;iBAJJ,uBAAuB;gBAVxB,MAAM;UAMZ,MAAM;;AA8Uf,wBAQG"}
+{"version":3,"file":"CuiInputStepper.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiInputStepper.vue"],"names":[],"mappings":"AA8LA,OAAO,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAKzH,MAAM,MAAM,uBAAuB,GAAG,YAAY,GAAG,UAAU,CAAC;AAEhE,MAAM,WAAW,oBAAqB,SAAQ,aAAa,EAAE,cAAc,EAAE,aAAa,EAAE,gBAAgB;IAC1G,oBAAoB;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,oBAAoB;IACpB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,oBAAoB;IACpB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,qBAAqB;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kBAAkB;IAClB,WAAW,CAAC,EAAE,uBAAuB,CAAC;IACtC,4BAA4B;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iDAAiD;IACjD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,iDAAiD;IACjD,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AA8ED,iBAAS,KAAK,CAAC,IAAI,CAAC,EAAE,YAAY,QAIjC;AAED,iBAAS,IAAI,SAEZ;;;;;;;;;;UAvFQ,OAAO;;;;;iBANA,uBAAuB;gBARxB,MAAM;UAMZ,MAAM;;AAsWf,wBASG"}

package/dist/components/CuiInputStepper.vue.js

@@ -0,0 +1,189 @@
+import { defineComponent as N, computed as u, useTemplateRef as y, withDirectives as A, openBlock as s, createElementBlock as c, normalizeStyle as r, toDisplayString as F, createCommentVNode as H, createVNode as a, withCtx as m, createElementVNode as W, vShow as T } from "vue";
+import { clampSize as P } from "../utils/sizing.js";
+import v from "./CuiButton.vue.js";
+import b from "./CuiIcon.vue.js";
+const L = ["value", "disabled"], O = ["value", "disabled"], G = /* @__PURE__ */ N({
+  __name: "CuiInputStepper",
+  props: {
+    modelValue: { default: 0 },
+    min: {},
+    max: {},
+    step: { default: 1 },
+    orientation: { default: "horizontal" },
+    label: {},
+    pad: {},
+    wrap: { type: Boolean, default: !1 },
+    hidden: { type: Boolean, default: !1 },
+    color: { default: "primary" },
+    size: { default: "md" },
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue"],
+  setup(t, { expose: R, emit: B }) {
+    const e = t, f = B, h = u(() => e.wrap || e.min === void 0 || e.modelValue - e.step >= e.min), p = u(() => e.wrap || e.max === void 0 || e.modelValue + e.step <= e.max);
+    function S() {
+      if (e.disabled || !h.value) return;
+      let i = Math.round((e.modelValue - e.step) * 1e10) / 1e10;
+      if (e.wrap && e.min !== void 0 && e.max !== void 0 && i < e.min) {
+        const n = e.max - e.min + 1;
+        i = e.min + Math.floor((n - 1) / e.step) * e.step;
+      } else e.min !== void 0 && (i = Math.max(i, e.min));
+      f("update:modelValue", i);
+    }
+    function V() {
+      if (e.disabled || !p.value) return;
+      let i = Math.round((e.modelValue + e.step) * 1e10) / 1e10;
+      e.wrap && e.min !== void 0 && e.max !== void 0 && i > e.max ? i = e.min : e.max !== void 0 && (i = Math.min(i, e.max)), f("update:modelValue", i);
+    }
+    const w = u(() => e.pad && e.pad > 0 ? String(e.modelValue).padStart(e.pad, "0") : String(e.modelValue)), k = u(() => e.orientation === "vertical");
+    function C(i) {
+      const n = i.target.value, l = parseFloat(n);
+      if (isNaN(l)) return;
+      let d = l;
+      e.min !== void 0 && (d = Math.max(d, e.min)), e.max !== void 0 && (d = Math.min(d, e.max)), f("update:modelValue", d);
+    }
+    const E = ["sm", "md", "lg"], I = {
+      sm: { height: "1.75rem", inputWidth: "2.5rem", font: "0.8125rem", buttonSize: "xs", iconSize: "0.75rem" },
+      md: { height: "2.25rem", inputWidth: "3rem", font: "0.875rem", buttonSize: "sm", iconSize: "0.875rem" },
+      lg: { height: "2.75rem", inputWidth: "3.5rem", font: "1rem", buttonSize: "md", iconSize: "1rem" }
+    }, o = u(() => I[P(e.size, E)]), g = y("rootEl"), z = y("inputH"), x = y("inputV");
+    function M(i) {
+      var l;
+      const n = z.value ?? x.value;
+      n ? n.focus(i) : (l = g.value) == null || l.focus(i);
+    }
+    function D() {
+      var i;
+      (i = z.value ?? x.value) == null || i.blur();
+    }
+    return R({ el: g, focus: M, blur: D }), (i, n) => A((s(), c("div", {
+      ref_key: "rootEl",
+      ref: g
+    }, [
+      t.label ? (s(), c("label", {
+        key: 0,
+        style: r({
+          display: "block",
+          marginBottom: "calc(0.25rem * var(--cui-density-scale, 1))",
+          fontWeight: "500",
+          color: "var(--cui-text-secondary)",
+          fontSize: o.value.font,
+          textAlign: k.value ? "center" : void 0
+        })
+      }, F(t.label), 5)) : H("", !0),
+      k.value ? (s(), c("div", {
+        key: 2,
+        style: r({
+          display: "inline-flex",
+          flexDirection: "column",
+          alignItems: "center",
+          borderRadius: "var(--cui-button-radius, 0.375rem)",
+          border: "1px solid var(--cui-border-strong, var(--cui-border))",
+          opacity: t.disabled ? "0.5" : "1",
+          overflow: "hidden"
+        })
+      }, [
+        a(v, {
+          variant: "ghost",
+          size: o.value.buttonSize,
+          disabled: t.disabled || !p.value,
+          color: t.color,
+          style: r({ border: "none", borderRadius: "0", width: "100%", minWidth: o.value.inputWidth }),
+          onClick: V
+        }, {
+          default: m(() => [
+            a(b, {
+              name: "caret-up",
+              size: o.value.iconSize
+            }, null, 8, ["size"])
+          ]),
+          _: 1
+        }, 8, ["size", "disabled", "color", "style"]),
+        W("input", {
+          ref_key: "inputV",
+          ref: x,
+          type: "text",
+          inputmode: "numeric",
+          value: w.value,
+          disabled: t.disabled,
+          style: r({ width: o.value.inputWidth, textAlign: "center", border: "none", borderTop: "1px solid var(--cui-border-strong, var(--cui-border))", borderBottom: "1px solid var(--cui-border-strong, var(--cui-border))", background: "var(--cui-surface-base, white)", color: "var(--cui-text-body)", fontSize: o.value.font, fontWeight: "600", outline: "none", padding: "calc(0.25rem * var(--cui-density-scale, 1)) 0", fontFamily: "inherit" }),
+          onInput: C
+        }, null, 44, O),
+        a(v, {
+          variant: "ghost",
+          size: o.value.buttonSize,
+          disabled: t.disabled || !h.value,
+          color: t.color,
+          style: { border: "none", borderRadius: "0", width: "100%" },
+          onClick: S
+        }, {
+          default: m(() => [
+            a(b, {
+              name: "caret-down",
+              size: o.value.iconSize
+            }, null, 8, ["size"])
+          ]),
+          _: 1
+        }, 8, ["size", "disabled", "color"])
+      ], 4)) : (s(), c("div", {
+        key: 1,
+        style: r({
+          display: "inline-flex",
+          alignItems: "center",
+          borderRadius: "var(--cui-button-radius, 0.375rem)",
+          border: "1px solid var(--cui-border-strong, var(--cui-border))",
+          opacity: t.disabled ? "0.5" : "1",
+          height: o.value.height
+        })
+      }, [
+        a(v, {
+          variant: "ghost",
+          size: o.value.buttonSize,
+          disabled: t.disabled || !h.value,
+          color: t.color,
+          style: { borderRadius: "var(--cui-button-radius, 0.375rem) 0 0 var(--cui-button-radius, 0.375rem)", border: "none", height: "100%" },
+          onClick: S
+        }, {
+          default: m(() => [
+            a(b, {
+              name: "minus",
+              size: o.value.iconSize
+            }, null, 8, ["size"])
+          ]),
+          _: 1
+        }, 8, ["size", "disabled", "color"]),
+        W("input", {
+          ref_key: "inputH",
+          ref: z,
+          type: "text",
+          inputmode: "numeric",
+          value: w.value,
+          disabled: t.disabled,
+          style: r({ width: o.value.inputWidth, height: "100%", textAlign: "center", border: "none", borderLeft: "1px solid var(--cui-border-strong, var(--cui-border))", borderRight: "1px solid var(--cui-border-strong, var(--cui-border))", background: "var(--cui-surface-base, white)", color: "var(--cui-text-body)", fontSize: o.value.font, fontWeight: "600", outline: "none", padding: "0", fontFamily: "inherit" }),
+          onInput: C
+        }, null, 44, L),
+        a(v, {
+          variant: "ghost",
+          size: o.value.buttonSize,
+          disabled: t.disabled || !p.value,
+          color: t.color,
+          style: { borderRadius: "0 var(--cui-button-radius, 0.375rem) var(--cui-button-radius, 0.375rem) 0", border: "none", height: "100%" },
+          onClick: V
+        }, {
+          default: m(() => [
+            a(b, {
+              name: "plus",
+              size: o.value.iconSize
+            }, null, 8, ["size"])
+          ]),
+          _: 1
+        }, 8, ["size", "disabled", "color"])
+      ], 4))
+    ], 512)), [
+      [T, !t.hidden]
+    ]);
+  }
+});
+export {
+  G as default
+};

package/dist/components/CuiInputStepper.vue2.js

@@ -0,0 +1,4 @@
+import f from "./CuiInputStepper.vue.js";
+export {
+  f as default
+};

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

@@ -1,17 +1,13 @@
-export type KbdSize = "sm" | "md" | "lg";
-export interface CuiKbdProps {
-    /** Size */
-    size?: KbdSize;
-    /** Hide the component */
-    hidden?: boolean;
+import type { HideableProps, SizeableProps } from "../types/common";
+export interface CuiKbdProps extends HideableProps, SizeableProps {
 }
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<CuiKbdProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CuiKbdProps> & Readonly<{}>, {
-    size: KbdSize;
     hidden: boolean;
+    size: import("..").CuiSize;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

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

@@ -1 +1 @@
-{"version":3,"file":"CuiKbd.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiKbd.vue"],"names":[],"mappings":"AAkDA,MAAM,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzC,MAAM,WAAW,WAAW;IAC1B,WAAW;IACX,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,yBAAyB;IACzB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAmDD,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAqB/C,QAAA,MAAM,eAAe;UA7EZ,OAAO;YAEL,OAAO;6EAkFhB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAa1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"CuiKbd.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiKbd.vue"],"names":[],"mappings":"AAqDA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGpE,MAAM,WAAW,WAAY,SAAQ,aAAa,EAAE,aAAa;CAChE;AAuDD,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAsB/C,QAAA,MAAM,eAAe;;;6EAOnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAa1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/CuiKbd.vue.js

@@ -0,0 +1,44 @@
+import { defineComponent as a, computed as m, withDirectives as s, openBlock as l, createElementBlock as c, normalizeStyle as p, renderSlot as u, vShow as f } from "vue";
+import { clampSize as h, scaleDensity as e } from "../utils/sizing.js";
+const b = /* @__PURE__ */ a({
+  __name: "CuiKbd",
+  props: {
+    hidden: { type: Boolean, default: !1 },
+    size: { default: "md" }
+  },
+  setup(r) {
+    const n = r, o = ["sm", "md", "lg"], i = {
+      sm: { fontSize: "0.6875rem", padding: `${e("0.0625rem")} ${e("0.3125rem")}`, minWidth: "1.125rem" },
+      md: { fontSize: "0.75rem", padding: `${e("0.125rem")} ${e("0.375rem")}`, minWidth: "1.375rem" },
+      lg: { fontSize: "0.8125rem", padding: `${e("0.1875rem")} ${e("0.4375rem")}`, minWidth: "1.5rem" }
+    }, t = m(() => h(n.size, o));
+    return (d, S) => s((l(), c("kbd", {
+      style: p({
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        fontSize: i[t.value].fontSize,
+        padding: i[t.value].padding,
+        minWidth: i[t.value].minWidth,
+        fontFamily: "var(--cui-font-sans, system-ui, sans-serif)",
+        fontWeight: "500",
+        lineHeight: "1.4",
+        color: "var(--cui-text-secondary)",
+        background: "var(--cui-surface-base, white)",
+        border: "1px solid var(--cui-border)",
+        borderBottom: "2px solid var(--cui-border)",
+        borderRadius: "0.25rem",
+        boxShadow: "0 1px 0 var(--cui-border)",
+        whiteSpace: "nowrap",
+        verticalAlign: "middle"
+      })
+    }, [
+      u(d.$slots, "default")
+    ], 4)), [
+      [f, !r.hidden]
+    ]);
+  }
+});
+export {
+  b as default
+};

package/dist/components/CuiKbd.vue2.js

@@ -0,0 +1,4 @@
+import f from "./CuiKbd.vue.js";
+export {
+  f as default
+};