@codeandfunction/callaloo 4.9.4 → 4.9.5

package/dist/components/Form/CLInput/CLInput.js

@@ -1,453 +1,4 @@
 import '../../../assets/core.css';
 import './CLInput.css';
 import '../../../assets/shared/form-utilities.css';
-import { defineComponent as S, computed as z, createElementBlock as $, openBlock as u, normalizeClass as y, unref as a, createBlock as b, Fragment as w, createTextVNode as M, toDisplayString as P, createVNode as K, ref as q, watch as R, createCommentVNode as v, mergeModels as N, useTemplateRef as Q, useModel as W, withCtx as Y, createElementVNode as p, normalizeStyle as Z, withDirectives as _, vModelDynamic as ee, isRef as le } from "vue";
-import { _ as ie, i as ae, a as te } from "../../../chunks/CLInputMessages.vue_vue_type_style_index_0_lang-DTWvAACK.js";
-import { _ as oe } from "../../../chunks/CLFormLabel.vue_vue_type_script_setup_true_lang-CIQxM6aH.js";
-import { _ as ne } from "../../../chunks/CLFormCharCounter.vue_vue_type_style_index_0_lang-CJ4VrvmR.js";
-import { _ as A } from "../../../chunks/CLIcon.vue_vue_type_style_index_0_lang-Dhr2tI-g.js";
-import { _ as F } from "../../../chunks/CLButton.vue_vue_type_style_index_0_lang-MvhnNzVW.js";
-import { CLSizes as o, CLColors as k, CLBorderRadius as E, CLIconSizes as s, CLColorVariants as I, CLIconNames as X, CLInputTypes as d, CLOrientation as T, CLCharCounterLayout as de } from "../../../index.js";
-import { _ as ue } from "../../../chunks/CLPill.vue_vue_type_style_index_0_lang-BQim03ge.js";
-const se = ["data-testid"], H = /* @__PURE__ */ S({
-  name: "CLInputPrefix",
-  __name: "CLInputPrefix",
-  props: {
-    ariaLabel: { default: void 0 },
-    borderRadius: { default: E.XS },
-    color: { default: k.Neutral },
-    disabled: { type: Boolean, default: !1 },
-    grouped: { type: Boolean, default: !1 },
-    onClick: { type: Function, default: void 0 },
-    prefix: {},
-    size: { default: o.Small },
-    testId: { default: "clll-input-prefix" }
-  },
-  setup(e) {
-    const t = e, c = "clll-input", l = (n) => Object.values(X).includes(n), C = (n) => n, i = (n) => n?.replace("rounded-", "") || "xs", x = {
-      [o.Tiny]: s.Tiny,
-      [o.Small]: s.Small,
-      [o.Medium]: s.Medium,
-      [o.Large]: s.Large,
-      [o.XL]: s.XL,
-      [o.XXL]: s.XXL,
-      [o.XXXL]: s.XXXL,
-      [o.XXXXL]: s.XXXXL
-    }, g = z(() => !!t.onClick && l(t.prefix)), r = z(() => [
-      `${c}__input-prefix`,
-      "form-addon-flex",
-      "form-addon-flex--left",
-      l(t.prefix) ? `${c}__input-prefix--icon form-addon-flex--icon` : `${c}__input-prefix--string form-addon-flex--string`,
-      { "--interactive": g },
-      { "--input-group": t.grouped || t.prefix },
-      { "--disabled": t.disabled },
-      t.grouped ? `form-addon-radius--left-${i(t.borderRadius)}` : ""
-    ]), L = (n) => {
-      t.onClick && n && !t.disabled && (n.stopPropagation(), t.onClick(n));
-    };
-    return (n, B) => (u(), $("div", {
-      class: y(a(r))
-    }, [
-      a(g) ? (u(), b(a(F), {
-        key: 0,
-        "aria-label": e.ariaLabel,
-        "border-radius": e.borderRadius,
-        color: e.color,
-        disabled: e.disabled,
-        "icon-before": C(e.prefix),
-        "icon-size": x[e.size],
-        "on-click": L,
-        size: e.size,
-        "test-id": e.testId,
-        variant: a(I).Text,
-        wrap: ""
-      }, null, 8, ["aria-label", "border-radius", "color", "disabled", "icon-before", "icon-size", "size", "test-id", "variant"])) : (u(), $("span", {
-        key: 1,
-        class: "icon-container",
-        "data-testid": e.testId
-      }, [
-        l(e.prefix) ? (u(), b(a(A), {
-          key: 0,
-          name: C(e.prefix),
-          size: x[e.size],
-          color: e.color
-        }, null, 8, ["name", "size", "color"])) : (u(), $(w, { key: 1 }, [
-          M(P(e.prefix), 1)
-        ], 64))
-      ], 8, se))
-    ], 2));
-  }
-}), re = ["data-testid"], O = /* @__PURE__ */ S({
-  name: "CLInputSuffix",
-  __name: "CLInputSuffix",
-  props: {
-    ariaLabel: { default: void 0 },
-    borderRadius: { default: E.XS },
-    color: { default: k.Neutral },
-    disabled: { type: Boolean, default: !1 },
-    grouped: { type: Boolean, default: !1 },
-    onClick: { type: Function, default: void 0 },
-    suffix: {},
-    size: { default: o.Small },
-    testId: { default: "clll-input-suffix" }
-  },
-  setup(e) {
-    const t = e, c = "clll-input", l = (n) => Object.values(X).includes(n), C = (n) => n, i = (n) => n?.replace("rounded-", "") || "xs", x = {
-      [o.Tiny]: s.Tiny,
-      [o.Small]: s.Small,
-      [o.Medium]: s.Medium,
-      [o.Large]: s.Large,
-      [o.XL]: s.XL,
-      [o.XXL]: s.XXL,
-      [o.XXXL]: s.XXXL,
-      [o.XXXXL]: s.XXXXL
-    }, g = z(() => !!t.onClick && l(t.suffix)), r = z(() => [
-      `${c}__input-suffix`,
-      "form-addon-flex",
-      "form-addon-flex--right",
-      l(t.suffix) ? `${c}__input-suffix--icon form-addon-flex--icon` : `${c}__input-suffix--string form-addon-flex--string`,
-      { "--interactive": g },
-      { "--input-group": t.grouped || t.suffix },
-      { "--disabled": t.disabled },
-      t.grouped ? `form-addon-radius--right-${i(t.borderRadius)}` : ""
-    ]), L = (n) => {
-      t.onClick && n && !t.disabled && (n.stopPropagation(), t.onClick(n));
-    };
-    return (n, B) => (u(), $("div", {
-      class: y(a(r))
-    }, [
-      a(g) ? (u(), b(a(F), {
-        key: 0,
-        "aria-label": e.ariaLabel,
-        "border-radius": e.borderRadius,
-        color: e.color,
-        disabled: e.disabled,
-        "icon-before": C(e.suffix),
-        "icon-size": x[e.size],
-        "on-click": L,
-        size: e.size,
-        "test-id": e.testId,
-        variant: a(I).Text,
-        wrap: ""
-      }, null, 8, ["aria-label", "border-radius", "color", "disabled", "icon-before", "icon-size", "size", "test-id", "variant"])) : (u(), $("span", {
-        key: 1,
-        class: "icon-container",
-        "data-testid": e.testId
-      }, [
-        l(e.suffix) ? (u(), b(a(A), {
-          key: 0,
-          name: C(e.suffix),
-          size: x[e.size],
-          color: e.color
-        }, null, 8, ["name", "size", "color"])) : (u(), $(w, { key: 1 }, [
-          M(P(e.suffix), 1)
-        ], 64))
-      ], 8, re))
-    ], 2));
-  }
-}), ce = ["data-testid"], U = /* @__PURE__ */ S({
-  name: "CLInputPill",
-  __name: "CLInputPill",
-  props: {
-    color: { default: k.Neutral },
-    label: {},
-    testId: { default: "clll-input-pill" }
-  },
-  setup(e) {
-    const t = "clll-input";
-    return (c, l) => (u(), $("span", {
-      class: y(`${t}__pill`),
-      "data-testid": e.testId
-    }, [
-      K(a(ue), {
-        color: e.color,
-        label: e.label,
-        variant: a(I).Soft
-      }, null, 8, ["color", "label", "variant"])
-    ], 10, ce));
-  }
-}), fe = ["data-testid"], j = /* @__PURE__ */ S({
-  name: "CLInputColorTools",
-  __name: "CLInputColorTools",
-  props: {
-    copied: { type: Boolean, default: !1 },
-    initialValue: { default: void 0 },
-    modelValue: { default: void 0 },
-    size: { default: o.Small },
-    testId: { default: "clll-input-color-tools" }
-  },
-  emits: ["copy", "reset", "update:copied"],
-  setup(e, { emit: t }) {
-    const c = e, l = t, C = "clll-input", i = q(c.copied), x = {
-      [o.Tiny]: s.Tiny,
-      [o.Small]: s.Small,
-      [o.Medium]: s.Medium,
-      [o.Large]: s.Large,
-      [o.XL]: s.XL,
-      [o.XXL]: s.XXL,
-      [o.XXXL]: s.XXXL,
-      [o.XXXXL]: s.XXXXL
-    }, g = async () => {
-      try {
-        c.modelValue && (await navigator.clipboard.writeText(c.modelValue.toString()), i.value = !0, l("update:copied", !0), l("copy"));
-      } catch (L) {
-        console.error(L);
-      }
-    }, r = () => {
-      l("reset", c.initialValue);
-    };
-    return R(() => c.copied, (L) => {
-      i.value = L;
-    }), R(() => c.modelValue, () => {
-      i.value = !1, l("update:copied", !1);
-    }), (L, n) => (u(), $("span", {
-      class: y(`${C}__selected-color-tools`),
-      "data-testid": e.testId
-    }, [
-      e.modelValue ? (u(), b(a(F), {
-        key: 0,
-        "aria-label": "Copy color to clipboard",
-        class: y(`${C}__copy-to-clipboard`),
-        color: a(k).Neutral,
-        "icon-before": a(i) ? a(X).Check : a(X).Copy,
-        "icon-size": x[e.size],
-        "on-click": g,
-        size: e.size,
-        title: a(i) ? "Color copied to clipboard" : "Copy color to clipboard",
-        variant: a(I).Ghost,
-        wrap: ""
-      }, null, 8, ["class", "color", "icon-before", "icon-size", "size", "title", "variant"])) : v("", !0),
-      e.modelValue ? (u(), b(a(F), {
-        key: 1,
-        "aria-label": "Reset selected color",
-        class: y(`${C}__reset-selected-color`),
-        color: a(k).Neutral,
-        "on-click": r,
-        "icon-before": a(X).Restore,
-        "icon-size": x[e.size],
-        size: e.size,
-        title: "Reset selected color",
-        variant: a(I).Ghost,
-        wrap: ""
-      }, null, 8, ["class", "color", "icon-before", "icon-size", "size", "variant"])) : v("", !0)
-    ], 10, fe));
-  }
-}), me = ["data-testid"], be = ["id", "name", "aria-label", "autocomplete", "disabled", "form", "maxlength", "minlength", "pattern", "placeholder", "readonly", "required", "spellcheck", "type"], xe = /* @__PURE__ */ S({
-  name: "CLInput",
-  __name: "CLInput",
-  props: /* @__PURE__ */ N({
-    ariaLabel: { default: void 0 },
-    autoComplete: { type: Boolean, default: void 0 },
-    borderRadius: { default: void 0 },
-    busy: { type: Boolean, default: !1 },
-    charCounter: { type: Boolean, default: !1 },
-    color: { default: k.Neutral },
-    disabled: { type: Boolean, default: !1 },
-    fluid: { type: Boolean, default: !1 },
-    form: { default: void 0 },
-    grouped: { type: Boolean, default: !1 },
-    id: {},
-    label: { default: void 0 },
-    maxLength: { default: void 0 },
-    messages: { default: () => [] },
-    messageType: { default: void 0 },
-    minLength: { default: void 0 },
-    name: {},
-    onBlur: { type: Function, default: void 0 },
-    onChange: { type: Function, default: void 0 },
-    onFocus: { type: Function, default: void 0 },
-    onInput: { type: Function, default: void 0 },
-    onPrefixClick: { type: Function, default: void 0 },
-    onSuffixClick: { type: Function, default: void 0 },
-    orientation: { default: T.Vertical },
-    pattern: { default: void 0 },
-    pill: { default: void 0 },
-    placeholder: { default: void 0 },
-    prefix: { default: void 0 },
-    prefixAriaLabel: { default: void 0 },
-    readonly: { type: Boolean, default: !1 },
-    required: { type: Boolean, default: !1 },
-    rounded: { type: Boolean, default: !0 },
-    size: { default: o.Small },
-    spellCheck: { type: Boolean, default: void 0 },
-    suffix: { default: void 0 },
-    suffixAriaLabel: { default: void 0 },
-    testId: { default: "clll-input" },
-    type: { default: d.Text },
-    variant: { default: I.Outline }
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
-  emits: /* @__PURE__ */ N(["reset"], ["update:modelValue"]),
-  setup(e, { expose: t, emit: c }) {
-    const l = e, C = c, i = "clll-input", x = q(!1), g = Q("input-elem"), r = W(e, "modelValue");
-    l.type === d.Color && !r.value && (r.value = "#FFFFFF");
-    const L = r.value?.toString(), n = (h) => Object.values(X).includes(h), B = z(() => [
-      i,
-      l.borderRadius ? `${i}--${l.borderRadius}` : "",
-      l.busy ? `${i}--busy` : `${i}--ready`,
-      `${i}--${l.color}`,
-      `${i}--${l.size}`,
-      `${i}--${l.type}`,
-      `${i}--${l.variant}`,
-      l.disabled || l.busy ? `${i}--disabled` : `${i}--active`,
-      l.fluid || l.orientation === T.Horizontal ? `${i}--fluid` : `${i}--fixed`,
-      l.grouped ? `${i}--grouped` : "",
-      l.label ? `${i}--haslabel` : "",
-      l.messageType ? `${i}--${l.messageType}` : "",
-      l.orientation ? `${i}--${l.orientation}` : "",
-      l.pill ? `${i}--haspill` : "",
-      l.charCounter && l.maxLength && [d.Email, d.None, d.Text, d.Url].includes(l.type) ? `${i}--hascharcounter` : "",
-      l.prefix && ![d.Color, d.File].includes(l.type) ? `${i}--hasprefix` : "",
-      l.prefix && ![d.Color, d.File].includes(l.type) ? n(l.prefix) ? `${i}--hasiconprefix` : `${i}--hascustomprefix` : "",
-      l.readonly ? `${i}--readonly` : `${i}--writeable`,
-      l.rounded ? `${i}--rounded` : `${i}--box`,
-      l.required ? `${i}--required` : `${i}--optional`,
-      l.suffix && ![d.Color, d.File].includes(l.type) ? `${i}--hassuffix` : "",
-      l.suffix && ![d.Color, d.File].includes(l.type) ? n(l.suffix) ? `${i}--hasiconsuffix` : `${i}--hascustomsuffix` : ""
-    ]), D = z(() => [
-      `${i}__input`,
-      { "--nocolor": l.type === d.Color && !r.value },
-      { "--input-group": l.grouped || l.prefix || l.suffix }
-    ]), G = (h) => {
-      r.value = h, C("reset", r.value);
-    }, J = (h) => {
-      !h.target.closest('button, a, [role="button"]') && g.value && g.value.focus();
-    };
-    return R(r, () => {
-      x.value = !1;
-    }), t({
-      inputRef: g
-    }), (h, f) => (u(), b(ie, {
-      fluid: e.fluid,
-      "has-pill": !!e.pill,
-      "has-char-counter": !!(e.charCounter && e.maxLength),
-      orientation: e.orientation
-    }, {
-      default: Y(() => [
-        p("span", {
-          class: y(a(B)),
-          style: Z(a(ae)({ color: e.color, variant: e.variant })),
-          "data-testid": e.testId
-        }, [
-          e.label ? (u(), b(oe, {
-            key: 0,
-            "css-prefix": i,
-            "html-for": e.id,
-            label: e.label,
-            required: e.required,
-            size: e.size
-          }, null, 8, ["html-for", "label", "required", "size"])) : v("", !0),
-          p("span", {
-            class: y([`${i}__input-container`, "--focus-within"]),
-            onClick: J
-          }, [
-            e.prefix && ![a(d).Color, a(d).File].includes(e.type) ? (u(), b(H, {
-              key: 0,
-              prefix: e.prefix,
-              size: e.size,
-              grouped: e.grouped,
-              "border-radius": e.borderRadius,
-              color: e.color,
-              "on-click": e.onPrefixClick,
-              "aria-label": e.prefixAriaLabel,
-              disabled: e.disabled || e.busy
-            }, null, 8, ["prefix", "size", "grouped", "border-radius", "color", "on-click", "aria-label", "disabled"])) : v("", !0),
-            p("span", {
-              class: y(`${i}__input-border-control`)
-            }, [
-              _(p("input", {
-                id: e.id,
-                ref: "input-elem",
-                "onUpdate:modelValue": f[0] || (f[0] = (m) => r.value = m),
-                name: e.name,
-                "aria-label": e.ariaLabel,
-                autocomplete: e.autoComplete ? "on" : "off",
-                class: y(a(D)),
-                disabled: e.disabled || e.busy,
-                form: e.form,
-                maxlength: e.maxLength,
-                minlength: e.minLength,
-                pattern: e.pattern,
-                placeholder: e.placeholder,
-                readonly: e.readonly,
-                required: e.required,
-                spellcheck: e.spellCheck,
-                type: e.type,
-                onBlur: f[1] || (f[1] = //@ts-ignore
-                (...m) => e.onBlur && e.onBlur(...m)),
-                onChange: f[2] || (f[2] = //@ts-ignore
-                (...m) => e.onChange && e.onChange(...m)),
-                onFocus: f[3] || (f[3] = //@ts-ignore
-                (...m) => e.onFocus && e.onFocus(...m)),
-                onInput: f[4] || (f[4] = //@ts-ignore
-                (...m) => e.onInput && e.onInput(...m))
-              }, null, 42, be), [
-                [ee, r.value]
-              ])
-            ], 2),
-            e.type === a(d).Color ? (u(), $("span", {
-              key: 1,
-              class: y(`${i}__selected-color`)
-            }, P(r.value || "none"), 3)) : v("", !0),
-            e.type === a(d).Color ? (u(), b(j, {
-              key: 2,
-              modelValue: r.value,
-              "onUpdate:modelValue": f[5] || (f[5] = (m) => r.value = m),
-              copied: a(x),
-              "onUpdate:copied": f[6] || (f[6] = (m) => le(x) ? x.value = m : null),
-              "initial-value": a(L),
-              size: e.size,
-              onReset: G
-            }, null, 8, ["modelValue", "copied", "initial-value", "size"])) : v("", !0),
-            e.suffix && ![a(d).Color, a(d).File].includes(e.type) ? (u(), b(O, {
-              key: 3,
-              suffix: e.suffix,
-              size: e.size,
-              grouped: e.grouped,
-              "border-radius": e.borderRadius,
-              color: e.color,
-              "on-click": e.onSuffixClick,
-              "aria-label": e.suffixAriaLabel,
-              disabled: e.disabled || e.busy
-            }, null, 8, ["suffix", "size", "grouped", "border-radius", "color", "on-click", "aria-label", "disabled"])) : v("", !0),
-            e.charCounter && e.maxLength && [a(d).Email, a(d).None, a(d).Text, a(d).Url].includes(e.type) ? (u(), b(ne, {
-              key: 4,
-              color: e.color,
-              "css-prefix": i,
-              "current-length": r.value ? r.value.toString().length : 0,
-              "max-length": e.maxLength,
-              layout: a(de).Inline,
-              size: e.size
-            }, null, 8, ["color", "current-length", "max-length", "layout", "size"])) : v("", !0)
-          ], 2)
-        ], 14, me),
-        e.pill && e.label && e.orientation === a(T).Horizontal ? (u(), $("span", {
-          key: 0,
-          class: y(`${i}__spacer`)
-        }, null, 2)) : v("", !0),
-        e.pill ? (u(), b(U, {
-          key: 1,
-          label: e.pill,
-          color: e.color
-        }, null, 8, ["label", "color"])) : v("", !0),
-        e.id ? (u(), b(te, {
-          key: 2,
-          id: e.id,
-          messages: e.messages,
-          "message-type": e.messageType
-        }, null, 8, ["id", "messages", "message-type"])) : v("", !0)
-      ]),
-      _: 1
-    }, 8, ["fluid", "has-pill", "has-char-counter", "orientation"]));
-  }
-}), V = xe;
-V.Prefix = H;
-V.Suffix = O;
-V.Pill = U;
-V.ColorTools = j;
-export {
-  V as CLInput,
-  V as default
-};
+import{defineComponent as e,computed as l,createElementBlock as a,openBlock as o,normalizeClass as i,unref as t,createBlock as r,Fragment as d,createTextVNode as n,toDisplayString as u,createVNode as s,ref as p,watch as c,createCommentVNode as f,mergeModels as m,useTemplateRef as b,useModel as y,withCtx as x,createElementVNode as v,normalizeStyle as _,withDirectives as g,vModelDynamic as h,isRef as L}from"vue";import{_ as X,i as C,a as z}from"../../../chunks/CLInputMessages.vue_vue_type_style_index_0_lang-DCByJ7MB.js";import{_ as $}from"../../../chunks/CLFormLabel.vue_vue_type_script_setup_true_lang-BPwFZq94.js";import{_ as k}from"../../../chunks/CLFormCharCounter.vue_vue_type_style_index_0_lang-BYHbqaf0.js";import{_ as I}from"../../../chunks/CLIcon.vue_vue_type_style_index_0_lang-yF4CdZbV.js";import{_ as F}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-3vGTMU-k.js";import{CLSizes as S,CLColors as B,CLBorderRadius as T,CLIconSizes as R,CLColorVariants as V,CLIconNames as P,CLInputTypes as j,CLOrientation as q,CLCharCounterLayout as w}from"../../../index.js";import{_ as M}from"../../../chunks/CLPill.vue_vue_type_style_index_0_lang-BVsLNnfE.js";const N=["data-testid"],U=/* @__PURE__ */e({name:"CLInputPrefix",__name:"CLInputPrefix",props:{ariaLabel:{default:void 0},borderRadius:{default:T.XS},color:{default:B.Neutral},disabled:{type:Boolean,default:!1},grouped:{type:Boolean,default:!1},onClick:{type:Function,default:void 0},prefix:{},size:{default:S.Small},testId:{default:"clll-input-prefix"}},setup(e){const s=e,p="clll-input",c=e=>Object.values(P).includes(e),f={[S.Tiny]:R.Tiny,[S.Small]:R.Small,[S.Medium]:R.Medium,[S.Large]:R.Large,[S.XL]:R.XL,[S.XXL]:R.XXL,[S.XXXL]:R.XXXL,[S.XXXXL]:R.XXXXL},m=l(()=>!!s.onClick&&c(s.prefix)),b=l(()=>{return[`${p}__input-prefix`,"form-addon-flex","form-addon-flex--left",c(s.prefix)?`${p}__input-prefix--icon form-addon-flex--icon`:`${p}__input-prefix--string form-addon-flex--string`,{"--interactive":m},{"--input-group":s.grouped||s.prefix},{"--disabled":s.disabled},s.grouped?`form-addon-radius--left-${e=s.borderRadius,e?.replace("rounded-","")||"xs"}`:""];var e}),y=e=>{s.onClick&&e&&!s.disabled&&(e.stopPropagation(),s.onClick(e))};return(l,s)=>(o(),a("div",{class:i(t(b))},[t(m)?(o(),r(t(F),{key:0,"aria-label":e.ariaLabel,"border-radius":e.borderRadius,color:e.color,disabled:e.disabled,"icon-before":e.prefix,"icon-size":f[e.size],"on-click":y,size:e.size,"test-id":e.testId,variant:t(V).Text,wrap:""},null,8,["aria-label","border-radius","color","disabled","icon-before","icon-size","size","test-id","variant"])):(o(),a("span",{key:1,class:"icon-container","data-testid":e.testId},[c(e.prefix)?(o(),r(t(I),{key:0,name:e.prefix,size:f[e.size],color:e.color},null,8,["name","size","color"])):(o(),a(d,{key:1},[n(u(e.prefix),1)],64))],8,N))],2))}}),A=["data-testid"],O=/* @__PURE__ */e({name:"CLInputSuffix",__name:"CLInputSuffix",props:{ariaLabel:{default:void 0},borderRadius:{default:T.XS},color:{default:B.Neutral},disabled:{type:Boolean,default:!1},grouped:{type:Boolean,default:!1},onClick:{type:Function,default:void 0},suffix:{},size:{default:S.Small},testId:{default:"clll-input-suffix"}},setup(e){const s=e,p="clll-input",c=e=>Object.values(P).includes(e),f={[S.Tiny]:R.Tiny,[S.Small]:R.Small,[S.Medium]:R.Medium,[S.Large]:R.Large,[S.XL]:R.XL,[S.XXL]:R.XXL,[S.XXXL]:R.XXXL,[S.XXXXL]:R.XXXXL},m=l(()=>!!s.onClick&&c(s.suffix)),b=l(()=>{return[`${p}__input-suffix`,"form-addon-flex","form-addon-flex--right",c(s.suffix)?`${p}__input-suffix--icon form-addon-flex--icon`:`${p}__input-suffix--string form-addon-flex--string`,{"--interactive":m},{"--input-group":s.grouped||s.suffix},{"--disabled":s.disabled},s.grouped?`form-addon-radius--right-${e=s.borderRadius,e?.replace("rounded-","")||"xs"}`:""];var e}),y=e=>{s.onClick&&e&&!s.disabled&&(e.stopPropagation(),s.onClick(e))};return(l,s)=>(o(),a("div",{class:i(t(b))},[t(m)?(o(),r(t(F),{key:0,"aria-label":e.ariaLabel,"border-radius":e.borderRadius,color:e.color,disabled:e.disabled,"icon-before":e.suffix,"icon-size":f[e.size],"on-click":y,size:e.size,"test-id":e.testId,variant:t(V).Text,wrap:""},null,8,["aria-label","border-radius","color","disabled","icon-before","icon-size","size","test-id","variant"])):(o(),a("span",{key:1,class:"icon-container","data-testid":e.testId},[c(e.suffix)?(o(),r(t(I),{key:0,name:e.suffix,size:f[e.size],color:e.color},null,8,["name","size","color"])):(o(),a(d,{key:1},[n(u(e.suffix),1)],64))],8,A))],2))}}),E=["data-testid"],G=/* @__PURE__ */e({name:"CLInputPill",__name:"CLInputPill",props:{color:{default:B.Neutral},label:{},testId:{default:"clll-input-pill"}},setup:e=>(l,r)=>(o(),a("span",{class:i("clll-input__pill"),"data-testid":e.testId},[s(t(M),{color:e.color,label:e.label,variant:t(V).Soft},null,8,["color","label","variant"])],10,E))}),H=["data-testid"],D=/* @__PURE__ */e({name:"CLInputColorTools",__name:"CLInputColorTools",props:{copied:{type:Boolean,default:!1},initialValue:{default:void 0},modelValue:{default:void 0},size:{default:S.Small},testId:{default:"clll-input-color-tools"}},emits:["copy","reset","update:copied"],setup(e,{emit:l}){const d=e,n=l,u="clll-input",s=p(d.copied),m={[S.Tiny]:R.Tiny,[S.Small]:R.Small,[S.Medium]:R.Medium,[S.Large]:R.Large,[S.XL]:R.XL,[S.XXL]:R.XXL,[S.XXXL]:R.XXXL,[S.XXXXL]:R.XXXXL},b=async()=>{try{d.modelValue&&(await navigator.clipboard.writeText(d.modelValue.toString()),s.value=!0,n("update:copied",!0),n("copy"))}catch(e){console.error(e)}},y=()=>{n("reset",d.initialValue)};return c(()=>d.copied,e=>{s.value=e}),c(()=>d.modelValue,()=>{s.value=!1,n("update:copied",!1)}),(l,d)=>(o(),a("span",{class:i(`${u}__selected-color-tools`),"data-testid":e.testId},[e.modelValue?(o(),r(t(F),{key:0,"aria-label":"Copy color to clipboard",class:i(`${u}__copy-to-clipboard`),color:t(B).Neutral,"icon-before":t(s)?t(P).Check:t(P).Copy,"icon-size":m[e.size],"on-click":b,size:e.size,title:t(s)?"Color copied to clipboard":"Copy color to clipboard",variant:t(V).Ghost,wrap:""},null,8,["class","color","icon-before","icon-size","size","title","variant"])):f("",!0),e.modelValue?(o(),r(t(F),{key:1,"aria-label":"Reset selected color",class:i(`${u}__reset-selected-color`),color:t(B).Neutral,"on-click":y,"icon-before":t(P).Restore,"icon-size":m[e.size],size:e.size,title:"Reset selected color",variant:t(V).Ghost,wrap:""},null,8,["class","color","icon-before","icon-size","size","variant"])):f("",!0)],10,H))}}),J=["data-testid"],K=["id","name","aria-label","autocomplete","disabled","form","maxlength","minlength","pattern","placeholder","readonly","required","spellcheck","type"],Q=/* @__PURE__ */e({name:"CLInput",__name:"CLInput",props:/* @__PURE__ */m({ariaLabel:{default:void 0},autoComplete:{type:Boolean,default:void 0},borderRadius:{default:void 0},busy:{type:Boolean,default:!1},charCounter:{type:Boolean,default:!1},color:{default:B.Neutral},disabled:{type:Boolean,default:!1},fluid:{type:Boolean,default:!1},form:{default:void 0},grouped:{type:Boolean,default:!1},id:{},label:{default:void 0},maxLength:{default:void 0},messages:{default:()=>[]},messageType:{default:void 0},minLength:{default:void 0},name:{},onBlur:{type:Function,default:void 0},onChange:{type:Function,default:void 0},onFocus:{type:Function,default:void 0},onInput:{type:Function,default:void 0},onPrefixClick:{type:Function,default:void 0},onSuffixClick:{type:Function,default:void 0},orientation:{default:q.Vertical},pattern:{default:void 0},pill:{default:void 0},placeholder:{default:void 0},prefix:{default:void 0},prefixAriaLabel:{default:void 0},readonly:{type:Boolean,default:!1},required:{type:Boolean,default:!1},rounded:{type:Boolean,default:!0},size:{default:S.Small},spellCheck:{type:Boolean,default:void 0},suffix:{default:void 0},suffixAriaLabel:{default:void 0},testId:{default:"clll-input"},type:{default:j.Text},variant:{default:V.Outline}},{modelValue:{},modelModifiers:{}}),emits:/* @__PURE__ */m(["reset"],["update:modelValue"]),setup(e,{expose:d,emit:n}){const s=e,m=n,I="clll-input",F=p(!1),S=b("input-elem"),B=y(e,"modelValue");s.type!==j.Color||B.value||(B.value="#FFFFFF");const T=B.value?.toString(),R=e=>Object.values(P).includes(e),V=l(()=>[I,s.borderRadius?`${I}--${s.borderRadius}`:"",s.busy?`${I}--busy`:`${I}--ready`,`${I}--${s.color}`,`${I}--${s.size}`,`${I}--${s.type}`,`${I}--${s.variant}`,s.disabled||s.busy?`${I}--disabled`:`${I}--active`,s.fluid||s.orientation===q.Horizontal?`${I}--fluid`:`${I}--fixed`,s.grouped?`${I}--grouped`:"",s.label?`${I}--haslabel`:"",s.messageType?`${I}--${s.messageType}`:"",s.orientation?`${I}--${s.orientation}`:"",s.pill?`${I}--haspill`:"",s.charCounter&&s.maxLength&&[j.Email,j.None,j.Text,j.Url].includes(s.type)?`${I}--hascharcounter`:"",s.prefix&&![j.Color,j.File].includes(s.type)?`${I}--hasprefix`:"",s.prefix&&![j.Color,j.File].includes(s.type)?R(s.prefix)?`${I}--hasiconprefix`:`${I}--hascustomprefix`:"",s.readonly?`${I}--readonly`:`${I}--writeable`,s.rounded?`${I}--rounded`:`${I}--box`,s.required?`${I}--required`:`${I}--optional`,s.suffix&&![j.Color,j.File].includes(s.type)?`${I}--hassuffix`:"",s.suffix&&![j.Color,j.File].includes(s.type)?R(s.suffix)?`${I}--hasiconsuffix`:`${I}--hascustomsuffix`:""]),M=l(()=>[`${I}__input`,{"--nocolor":s.type===j.Color&&!B.value},{"--input-group":s.grouped||s.prefix||s.suffix}]),N=e=>{B.value=e,m("reset",B.value)},A=e=>{!e.target.closest('button, a, [role="button"]')&&S.value&&S.value.focus()};return c(B,()=>{F.value=!1}),d({inputRef:S}),(l,d)=>(o(),r(X,{fluid:e.fluid,"has-pill":!!e.pill,"has-char-counter":!(!e.charCounter||!e.maxLength),orientation:e.orientation},{default:x(()=>[v("span",{class:i(t(V)),style:_(t(C)({color:e.color,variant:e.variant})),"data-testid":e.testId},[e.label?(o(),r($,{key:0,"css-prefix":I,"html-for":e.id,label:e.label,required:e.required,size:e.size},null,8,["html-for","label","required","size"])):f("",!0),v("span",{class:i([`${I}__input-container`,"--focus-within"]),onClick:A},[e.prefix&&![t(j).Color,t(j).File].includes(e.type)?(o(),r(U,{key:0,prefix:e.prefix,size:e.size,grouped:e.grouped,"border-radius":e.borderRadius,color:e.color,"on-click":e.onPrefixClick,"aria-label":e.prefixAriaLabel,disabled:e.disabled||e.busy},null,8,["prefix","size","grouped","border-radius","color","on-click","aria-label","disabled"])):f("",!0),v("span",{class:i(`${I}__input-border-control`)},[g(v("input",{id:e.id,ref:"input-elem","onUpdate:modelValue":d[0]||(d[0]=e=>B.value=e),name:e.name,"aria-label":e.ariaLabel,autocomplete:e.autoComplete?"on":"off",class:i(t(M)),disabled:e.disabled||e.busy,form:e.form,maxlength:e.maxLength,minlength:e.minLength,pattern:e.pattern,placeholder:e.placeholder,readonly:e.readonly,required:e.required,spellcheck:e.spellCheck,type:e.type,onBlur:d[1]||(d[1]=(...l)=>e.onBlur&&e.onBlur(...l)),onChange:d[2]||(d[2]=(...l)=>e.onChange&&e.onChange(...l)),onFocus:d[3]||(d[3]=(...l)=>e.onFocus&&e.onFocus(...l)),onInput:d[4]||(d[4]=(...l)=>e.onInput&&e.onInput(...l))},null,42,K),[[h,B.value]])],2),e.type===t(j).Color?(o(),a("span",{key:1,class:i(`${I}__selected-color`)},u(B.value||"none"),3)):f("",!0),e.type===t(j).Color?(o(),r(D,{key:2,modelValue:B.value,"onUpdate:modelValue":d[5]||(d[5]=e=>B.value=e),copied:t(F),"onUpdate:copied":d[6]||(d[6]=e=>L(F)?F.value=e:null),"initial-value":t(T),size:e.size,onReset:N},null,8,["modelValue","copied","initial-value","size"])):f("",!0),e.suffix&&![t(j).Color,t(j).File].includes(e.type)?(o(),r(O,{key:3,suffix:e.suffix,size:e.size,grouped:e.grouped,"border-radius":e.borderRadius,color:e.color,"on-click":e.onSuffixClick,"aria-label":e.suffixAriaLabel,disabled:e.disabled||e.busy},null,8,["suffix","size","grouped","border-radius","color","on-click","aria-label","disabled"])):f("",!0),e.charCounter&&e.maxLength&&[t(j).Email,t(j).None,t(j).Text,t(j).Url].includes(e.type)?(o(),r(k,{key:4,color:e.color,"css-prefix":I,"current-length":B.value?B.value.toString().length:0,"max-length":e.maxLength,layout:t(w).Inline,size:e.size},null,8,["color","current-length","max-length","layout","size"])):f("",!0)],2)],14,J),e.pill&&e.label&&e.orientation===t(q).Horizontal?(o(),a("span",{key:0,class:i(`${I}__spacer`)},null,2)):f("",!0),e.pill?(o(),r(G,{key:1,label:e.pill,color:e.color},null,8,["label","color"])):f("",!0),e.id?(o(),r(z,{key:2,id:e.id,messages:e.messages,"message-type":e.messageType},null,8,["id","messages","message-type"])):f("",!0)]),_:1},8,["fluid","has-pill","has-char-counter","orientation"]))}});Q.Prefix=U,Q.Suffix=O,Q.Pill=G,Q.ColorTools=D;export{Q as CLInput,Q as default};

package/dist/components/Form/CLInputDatePicker/CLInputDatePicker.js

@@ -1,180 +1,3 @@
 import '../../../assets/core.css';
 import './CLInputDatePicker.css';
-import { defineComponent as N, mergeModels as U, ref as r, useModel as q, watch as T, computed as R, onMounted as A, onBeforeUnmount as G, createElementBlock as I, openBlock as k, normalizeClass as p, createVNode as y, createCommentVNode as H, unref as d, isRef as j, normalizeStyle as J, withCtx as K, createElementVNode as Q } from "vue";
-import { u as W, a as X, o as Z, f as _, s as ee } from "../../../chunks/floating-ui.vue-Fx4CxKut.js";
-import { _ as ae } from "../../../chunks/CLCard.vue_vue_type_style_index_0_lang-Sre7UYZd.js";
-import { CLInput as te } from "../CLInput/CLInput.js";
-import { _ as le } from "../../../chunks/CLCalendar.vue_vue_type_style_index_0_lang-Bz1JdT1A.js";
-import { CLIconNames as ne, CLColorVariants as D, CLPlacement as oe, CLOrientation as ie, CLSizes as ue, CLColors as de } from "../../../index.js";
-import { i as Y } from "../../../chunks/helper-qUkciePY.js";
-import { useEsc as re } from "../../../composables/useEsc.js";
-import { useDateInputMask as se } from "../../../composables/useDateInputMask.js";
-const he = /* @__PURE__ */ N({
-  name: "CLInputDatePicker",
-  __name: "CLInputDatePicker",
-  props: /* @__PURE__ */ U({
-    ariaLabel: { default: void 0 },
-    borderRadius: { default: void 0 },
-    color: { default: de.Neutral },
-    size: { default: ue.Small },
-    variant: { default: D.Outline },
-    busy: { type: Boolean, default: !1 },
-    disabled: { type: Boolean, default: !1 },
-    fluid: { type: Boolean, default: !1 },
-    form: { default: void 0 },
-    id: {},
-    isRange: { type: Boolean, default: !0 },
-    label: { default: void 0 },
-    messages: { default: () => [] },
-    messageType: { default: void 0 },
-    name: {},
-    onBlur: { type: Function, default: void 0 },
-    onChange: { type: Function, default: void 0 },
-    onFocus: { type: Function, default: void 0 },
-    orientation: { default: ie.Vertical },
-    placement: { default: oe.BottomStart },
-    placeholder: { default: void 0 },
-    required: { type: Boolean, default: !1 },
-    rounded: { type: Boolean, default: !0 },
-    testId: { default: "clll-input-date-picker" }
-  }, {
-    modelValue: {
-      default: () => ({ end: null, start: null })
-    },
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
-  setup(e) {
-    const n = e, f = "clll-input-date-picker", o = r(!1), c = r(), s = r(), v = r(), i = q(e, "modelValue"), u = r(""), { handleDateInput: L, isoToSlash: C, slashToISO: b, validateDate: B } = se();
-    T(i, () => {
-      const a = C(i.value?.start ?? null), t = C(i.value?.end ?? null);
-      if (!a) {
-        u.value = "";
-        return;
-      }
-      if (!n.isRange || !t) {
-        u.value = a;
-        return;
-      }
-      u.value = `${a} - ${t}`;
-    }, { immediate: !0, deep: !0 });
-    const E = R(() => c.value?.$el), { floatingStyles: M } = W(E, v, {
-      middleware: [Z(8), _(), ee()],
-      placement: r(n.placement),
-      whileElementsMounted: X,
-      open: o
-    }), S = () => {
-      n.disabled || n.busy || (o.value = !o.value, o.value ? (n.onFocus?.(new FocusEvent("focus")), s.value?.initializeDraft()) : n.onBlur?.(new FocusEvent("blur")));
-    }, x = R(() => {
-      const a = s.value?.draftStart, t = s.value?.draftEnd;
-      return n.isRange ? !!a && !!t : !!a;
-    }), g = () => {
-      o.value && (o.value = !1, n.onBlur?.(new FocusEvent("blur")));
-    };
-    re({ escHandler: g });
-    const V = (a) => {
-      const t = a.target, l = c.value?.$el, m = v.value;
-      o.value && l && m && !l.contains(t) && !m.contains(t) && g();
-    }, z = () => {
-      x.value && (s.value?.apply(), g(), n.onChange?.());
-    }, h = (a) => {
-      const t = B(a, n.isRange), l = c.value?.inputRef;
-      return l && (a && !t ? l.setCustomValidity("Invalid date format. Use YYYY/MM/DD") : l.setCustomValidity("")), t;
-    }, F = (a) => {
-      a && L(a, u, n.isRange, () => {
-        h(u.value);
-      });
-    }, $ = (a) => {
-      if (!a) return;
-      const l = a.target.value, m = h(l);
-      if (!l.trim()) {
-        i.value = { start: null, end: null }, n.onChange?.();
-        return;
-      }
-      if (m) {
-        if (n.isRange) {
-          const [w, P] = l.split("-").map((O) => O.trim());
-          i.value = { start: b(w), end: b(P) };
-        } else
-          i.value = { start: b(l.trim()), end: null };
-        n.onChange?.();
-      }
-    };
-    return A(() => {
-      Y && document.addEventListener("click", V);
-    }), G(() => {
-      Y && document.removeEventListener("click", V);
-    }), (a, t) => (k(), I("div", {
-      class: p([f, e.fluid ? `${f}--fluid` : ""])
-    }, [
-      y(d(te), {
-        ref_key: "inputRef",
-        ref: c,
-        modelValue: d(u),
-        "onUpdate:modelValue": t[0] || (t[0] = (l) => j(u) ? u.value = l : null),
-        "aria-label": e.ariaLabel,
-        "border-radius": e.borderRadius,
-        busy: e.busy,
-        color: e.color,
-        disabled: e.disabled,
-        fluid: e.fluid,
-        form: e.form,
-        id: e.id,
-        label: e.label,
-        messages: e.messages,
-        "message-type": e.messageType,
-        name: e.name,
-        orientation: e.orientation,
-        placeholder: e.placeholder || (e.isRange ? "YYYY/MM/DD - YYYY/MM/DD" : "YYYY/MM/DD"),
-        required: e.required,
-        rounded: e.rounded,
-        size: e.size,
-        suffix: d(ne).Calendar,
-        "suffix-aria-label": e.ariaLabel || "Open calendar",
-        "test-id": e.testId,
-        variant: e.variant,
-        onInput: F,
-        onChange: $,
-        onSuffixClick: S
-      }, null, 8, ["modelValue", "aria-label", "border-radius", "busy", "color", "disabled", "fluid", "form", "id", "label", "messages", "message-type", "name", "orientation", "placeholder", "required", "rounded", "size", "suffix", "suffix-aria-label", "test-id", "variant"]),
-      d(o) ? (k(), I("div", {
-        key: 0,
-        ref_key: "popoverRef",
-        ref: v,
-        class: p(`${f}__popover`),
-        style: J({ ...d(M), zIndex: 100 })
-      }, [
-        y(d(ae), {
-          "border-radius": e.borderRadius,
-          variant: d(D).Ghost,
-          padded: !1,
-          rounded: e.rounded,
-          elevated: ""
-        }, {
-          default: K(() => [
-            Q("div", {
-              class: p(`${f}__calendar-container`)
-            }, [
-              y(d(le), {
-                ref_key: "calendarRef",
-                ref: s,
-                modelValue: i.value,
-                "onUpdate:modelValue": t[1] || (t[1] = (l) => i.value = l),
-                disabled: e.disabled,
-                busy: e.busy,
-                "is-range": e.isRange,
-                onDateSelect: z,
-                fluid: ""
-              }, null, 8, ["modelValue", "disabled", "busy", "is-range"])
-            ], 2)
-          ]),
-          _: 1
-        }, 8, ["border-radius", "variant", "rounded"])
-      ], 6)) : H("", !0)
-    ], 2));
-  }
-});
-export {
-  he as CLInputDatePicker,
-  he as default
-};
+import{defineComponent as e,mergeModels as a,ref as l,useModel as t,watch as u,computed as d,onMounted as n,onBeforeUnmount as o,createElementBlock as s,openBlock as i,normalizeClass as r,createVNode as f,createCommentVNode as m,unref as p,isRef as v,normalizeStyle as c,withCtx as b,createElementVNode as y}from"vue";import{u as g,a as _,o as h,f as k,s as C}from"../../../chunks/floating-ui.vue-C0JWy0Dz.js";import{_ as D}from"../../../chunks/CLCard.vue_vue_type_style_index_0_lang-DPQxSLkQ.js";import{CLInput as Y}from"../CLInput/CLInput.js";import{_ as R}from"../../../chunks/CLCalendar.vue_vue_type_style_index_0_lang-BAfGE35e.js";import{CLIconNames as I,CLColorVariants as L,CLPlacement as V,CLOrientation as M,CLSizes as x,CLColors as B}from"../../../index.js";import{i as j}from"../../../chunks/helper-C542dSLs.js";import{useEsc as E}from"../../../composables/useEsc.js";import{useDateInputMask as F}from"../../../composables/useDateInputMask.js";const S=/* @__PURE__ */e({name:"CLInputDatePicker",__name:"CLInputDatePicker",props:/* @__PURE__ */a({ariaLabel:{default:void 0},borderRadius:{default:void 0},color:{default:B.Neutral},size:{default:x.Small},variant:{default:L.Outline},busy:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},fluid:{type:Boolean,default:!1},form:{default:void 0},id:{},isRange:{type:Boolean,default:!0},label:{default:void 0},messages:{default:()=>[]},messageType:{default:void 0},name:{},onBlur:{type:Function,default:void 0},onChange:{type:Function,default:void 0},onFocus:{type:Function,default:void 0},orientation:{default:M.Vertical},placement:{default:V.BottomStart},placeholder:{default:void 0},required:{type:Boolean,default:!1},rounded:{type:Boolean,default:!0},testId:{default:"clll-input-date-picker"}},{modelValue:{default:()=>({end:null,start:null})},modelModifiers:{}}),emits:["update:modelValue"],setup(e){const a=e,V="clll-input-date-picker",M=l(!1),x=l(),B=l(),S=l(),$=t(e,"modelValue"),z=l(""),{handleDateInput:w,isoToSlash:q,slashToISO:T,validateDate:O}=F();u($,()=>{const e=q($.value?.start??null),l=q($.value?.end??null);e?a.isRange&&l?z.value=`${e} - ${l}`:z.value=e:z.value=""},{immediate:!0,deep:!0});const P=d(()=>x.value?.$el),{floatingStyles:U}=g(P,S,{middleware:[h(8),k(),C()],placement:l(a.placement),whileElementsMounted:_,open:M}),G=()=>{a.disabled||a.busy||(M.value=!M.value,M.value?(a.onFocus?.(new FocusEvent("focus")),B.value?.initializeDraft()):a.onBlur?.(new FocusEvent("blur")))},H=d(()=>{const e=B.value?.draftStart,l=B.value?.draftEnd;return a.isRange?!!e&&!!l:!!e}),N=()=>{M.value&&(M.value=!1,a.onBlur?.(new FocusEvent("blur")))};E({escHandler:N});const A=e=>{const a=e.target,l=x.value?.$el,t=S.value;M.value&&l&&t&&!l.contains(a)&&!t.contains(a)&&N()},J=()=>{H.value&&(B.value?.apply(),N(),a.onChange?.())},K=e=>{const l=O(e,a.isRange),t=x.value?.inputRef;return t&&(e&&!l?t.setCustomValidity("Invalid date format. Use YYYY/MM/DD"):t.setCustomValidity("")),l},Q=e=>{e&&w(e,z,a.isRange,()=>{K(z.value)})},W=e=>{if(!e)return;const l=e.target.value,t=K(l);if(!l.trim())return $.value={start:null,end:null},void a.onChange?.();if(t){if(a.isRange){const[e,a]=l.split("-").map(e=>e.trim());$.value={start:T(e),end:T(a)}}else $.value={start:T(l.trim()),end:null};a.onChange?.()}};return n(()=>{j&&document.addEventListener("click",A)}),o(()=>{j&&document.removeEventListener("click",A)}),(a,l)=>(i(),s("div",{class:r([V,e.fluid?`${V}--fluid`:""])},[f(p(Y),{ref_key:"inputRef",ref:x,modelValue:p(z),"onUpdate:modelValue":l[0]||(l[0]=e=>v(z)?z.value=e:null),"aria-label":e.ariaLabel,"border-radius":e.borderRadius,busy:e.busy,color:e.color,disabled:e.disabled,fluid:e.fluid,form:e.form,id:e.id,label:e.label,messages:e.messages,"message-type":e.messageType,name:e.name,orientation:e.orientation,placeholder:e.placeholder||(e.isRange?"YYYY/MM/DD - YYYY/MM/DD":"YYYY/MM/DD"),required:e.required,rounded:e.rounded,size:e.size,suffix:p(I).Calendar,"suffix-aria-label":e.ariaLabel||"Open calendar","test-id":e.testId,variant:e.variant,onInput:Q,onChange:W,onSuffixClick:G},null,8,["modelValue","aria-label","border-radius","busy","color","disabled","fluid","form","id","label","messages","message-type","name","orientation","placeholder","required","rounded","size","suffix","suffix-aria-label","test-id","variant"]),p(M)?(i(),s("div",{key:0,ref_key:"popoverRef",ref:S,class:r(`${V}__popover`),style:c({...p(U),zIndex:100})},[f(p(D),{"border-radius":e.borderRadius,variant:p(L).Ghost,padded:!1,rounded:e.rounded,elevated:""},{default:b(()=>[y("div",{class:r(`${V}__calendar-container`)},[f(p(R),{ref_key:"calendarRef",ref:B,modelValue:$.value,"onUpdate:modelValue":l[1]||(l[1]=e=>$.value=e),disabled:e.disabled,busy:e.busy,"is-range":e.isRange,onDateSelect:J,fluid:""},null,8,["modelValue","disabled","busy","is-range"])],2)]),_:1},8,["border-radius","variant","rounded"])],6)):m("",!0)],2))}});export{S as CLInputDatePicker,S as default};