@codeandfunction/callaloo 5.16.0 → 5.17.1

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

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLInputDatePicker.css';
-import{defineComponent as e,mergeModels as a,ref as l,useModel as t,watch as u,computed as n,onMounted as d,onBeforeUnmount as s,createElementBlock as o,openBlock as i,normalizeClass as r,createVNode as f,createCommentVNode as m,unref as p,isRef as c,normalizeStyle as v,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-CY-Qr_CV.js";import{CLInput as Y}from"../CLInput/CLInput.js";import{_ as R}from"../../../chunks/CLCalendar.vue_vue_type_style_index_0_lang-PiGGhTHo.js";import{f as I,a as L,n as V,c as x,b as M}from"../../../chunks/index-DsloP0ml.js";import{a as B}from"../../../chunks/index-wkMXT2wB.js";import{i as j}from"../../../chunks/helper-BlxFN3eF.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:M.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:B.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",x=l(!1),M=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=n(()=>M.value?.$el),{floatingStyles:U}=g(P,S,{middleware:[h(8),k(),C()],placement:l(a.placement),whileElementsMounted:_,open:x}),G=()=>{a.disabled||a.busy||(x.value=!x.value,x.value?(a.onFocus?.(new FocusEvent("focus")),B.value?.initializeDraft()):a.onBlur?.(new FocusEvent("blur")))},H=n(()=>{const e=B.value?.draftStart,l=B.value?.draftEnd;return a.isRange?!!e&&!!l:!!e}),N=()=>{x.value&&(x.value=!1,a.onBlur?.(new FocusEvent("blur")))};E({escHandler:N});const A=e=>{const a=e.target,l=M.value?.$el,t=S.value;x.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=M.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 d(()=>{j&&document.addEventListener("click",A)}),s(()=>{j&&document.removeEventListener("click",A)}),(a,l)=>(i(),o("div",{class:r([V,e.fluid?`${V}--fluid`:""])},[f(p(Y),{id:e.id,ref_key:"inputRef",ref:M,modelValue:p(z),"onUpdate:modelValue":l[0]||(l[0]=e=>c(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,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,["id","modelValue","aria-label","border-radius","busy","color","disabled","fluid","form","label","messages","message-type","name","orientation","placeholder","required","rounded","size","suffix","suffix-aria-label","test-id","variant"]),p(x)?(i(),o("div",{key:0,ref_key:"popoverRef",ref:S,class:r(`${V}__popover`),style:v({...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,fluid:"",onDateSelect:J},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};
+import{defineComponent as e,mergeModels as a,ref as l,useModel as t,watch as u,computed as n,onMounted as d,onBeforeUnmount as s,createElementBlock as o,openBlock as i,normalizeClass as r,createVNode as f,createCommentVNode as m,unref as p,isRef as c,normalizeStyle as v,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-CAg8Jmzv.js";import{CLInput as Y}from"../CLInput/CLInput.js";import{_ as R}from"../../../chunks/CLCalendar.vue_vue_type_style_index_0_lang-D35OH5qI.js";import{f as I,a as L,n as V,c as x,b as M}from"../../../chunks/index-DsloP0ml.js";import{a as B}from"../../../chunks/index-wkMXT2wB.js";import{i as j}from"../../../chunks/helper-BlxFN3eF.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:M.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:B.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",x=l(!1),M=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=n(()=>M.value?.$el),{floatingStyles:U}=g(P,S,{middleware:[h(8),k(),C()],placement:l(a.placement),whileElementsMounted:_,open:x}),G=()=>{a.disabled||a.busy||(x.value=!x.value,x.value?(a.onFocus?.(new FocusEvent("focus")),B.value?.initializeDraft()):a.onBlur?.(new FocusEvent("blur")))},H=n(()=>{const e=B.value?.draftStart,l=B.value?.draftEnd;return a.isRange?!!e&&!!l:!!e}),N=()=>{x.value&&(x.value=!1,a.onBlur?.(new FocusEvent("blur")))};E({escHandler:N});const A=e=>{const a=e.target,l=M.value?.$el,t=S.value;x.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=M.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 d(()=>{j&&document.addEventListener("click",A)}),s(()=>{j&&document.removeEventListener("click",A)}),(a,l)=>(i(),o("div",{class:r([V,e.fluid?`${V}--fluid`:""])},[f(p(Y),{id:e.id,ref_key:"inputRef",ref:M,modelValue:p(z),"onUpdate:modelValue":l[0]||(l[0]=e=>c(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,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,["id","modelValue","aria-label","border-radius","busy","color","disabled","fluid","form","label","messages","message-type","name","orientation","placeholder","required","rounded","size","suffix","suffix-aria-label","test-id","variant"]),p(x)?(i(),o("div",{key:0,ref_key:"popoverRef",ref:S,class:r(`${V}__popover`),style:v({...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,fluid:"",onDateSelect:J},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};

package/dist/components/Form/CLInputDatePicker/CLInputDatePicker.vue.d.ts

@@ -70,14 +70,15 @@ declare const _default: import('vue').DefineComponent<{
         start: string | null;
     } | null) => any) | undefined;
 }>, {
+    form: string;
+    label: string;
+    isRange: boolean;
     size: CLSizes;
     color: CLColors;
     variant: CLColorVariants.Outline | CLColorVariants.Ghost;
     fluid: boolean;
     rounded: boolean;
     testId: string;
-    form: string;
-    label: string;
     onFocus: CLGenericFocusFunction;
     onBlur: CLGenericFocusFunction;
     onChange: CLGenericFunction;
@@ -87,7 +88,6 @@ declare const _default: import('vue').DefineComponent<{
     busy: boolean;
     disabled: boolean;
     placeholder: string;
-    isRange: boolean;
     orientation: CLOrientation;
     messages: string[];
     messageType: CLColors;
@@ -104,6 +104,9 @@ declare const _default: import('vue').DefineComponent<{
         reset: (...args: any[]) => void;
         "update:modelValue": (value: string | number) => void;
     }, import('vue').PublicProps, {
+        form: string;
+        label: string;
+        pattern: string;
         size: CLSizes;
         color: CLColors;
         variant: CLColorVariants.Outline | CLColorVariants.Ghost;
@@ -111,9 +114,6 @@ declare const _default: import('vue').DefineComponent<{
         rounded: boolean;
         testId: string;
         type: import('@codeandfunction/callaloo-types').CLInputTypes;
-        form: string;
-        label: string;
-        pattern: string;
         onFocus: CLGenericFocusFunction;
         onBlur: CLGenericFocusFunction;
         onChange: CLGenericFunction;
@@ -158,6 +158,9 @@ declare const _default: import('vue').DefineComponent<{
     }>, {
         inputRef: Readonly<globalThis.ShallowRef<HTMLInputElement | null>>;
     }, {}, {}, {}, {
+        form: string;
+        label: string;
+        pattern: string;
         size: CLSizes;
         color: CLColors;
         variant: CLColorVariants.Outline | CLColorVariants.Ghost;
@@ -165,9 +168,6 @@ declare const _default: import('vue').DefineComponent<{
         rounded: boolean;
         testId: string;
         type: import('@codeandfunction/callaloo-types').CLInputTypes;
-        form: string;
-        label: string;
-        pattern: string;
         onFocus: CLGenericFocusFunction;
         onBlur: CLGenericFocusFunction;
         onChange: CLGenericFunction;
@@ -199,13 +199,13 @@ declare const _default: import('vue').DefineComponent<{
     popoverRef: HTMLDivElement;
     calendarRef: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
         modelValue?: {
-            end: import('../../../composables/useDatePicker').ISODate | null;
-            start: import('../../../composables/useDatePicker').ISODate | null;
+            end: import('../../../index.ts').CLISODate | null;
+            start: import('../../../index.ts').CLISODate | null;
         } | null;
     } & import('../CLCalendar/CLCalendar.vue').CLCalendarProps> & Readonly<{
         "onUpdate:modelValue"?: ((value: {
-            end: import('../../../composables/useDatePicker').ISODate | null;
-            start: import('../../../composables/useDatePicker').ISODate | null;
+            end: import('../../../index.ts').CLISODate | null;
+            start: import('../../../index.ts').CLISODate | null;
         } | null) => any) | undefined;
         "onDate-select"?: ((date: string) => any) | undefined;
     }>, {
@@ -217,18 +217,19 @@ declare const _default: import('vue').DefineComponent<{
         reset: () => void;
     }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
         "update:modelValue": (value: {
-            end: import('../../../composables/useDatePicker').ISODate | null;
-            start: import('../../../composables/useDatePicker').ISODate | null;
+            end: import('../../../index.ts').CLISODate | null;
+            start: import('../../../index.ts').CLISODate | null;
         } | null) => any;
         "date-select": (date: string) => any;
     }, import('vue').PublicProps, {
+        width: string;
+        allowedDates: import('../../../index.ts').CLAllowedDates;
+        isRange: boolean;
         color: CLColors;
         fluid: boolean;
         testId: string;
-        width: string;
         busy: boolean;
         disabled: boolean;
-        isRange: boolean;
     }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, HTMLDivElement, import('vue').ComponentProvideOptions, {
         P: {};
         B: {};
@@ -238,13 +239,13 @@ declare const _default: import('vue').DefineComponent<{
         Defaults: {};
     }, Readonly<{
         modelValue?: {
-            end: import('../../../composables/useDatePicker').ISODate | null;
-            start: import('../../../composables/useDatePicker').ISODate | null;
+            end: import('../../../index.ts').CLISODate | null;
+            start: import('../../../index.ts').CLISODate | null;
         } | null;
     } & import('../CLCalendar/CLCalendar.vue').CLCalendarProps> & Readonly<{
         "onUpdate:modelValue"?: ((value: {
-            end: import('../../../composables/useDatePicker').ISODate | null;
-            start: import('../../../composables/useDatePicker').ISODate | null;
+            end: import('../../../index.ts').CLISODate | null;
+            start: import('../../../index.ts').CLISODate | null;
         } | null) => any) | undefined;
         "onDate-select"?: ((date: string) => any) | undefined;
     }>, {
@@ -255,13 +256,14 @@ declare const _default: import('vue').DefineComponent<{
         initializeDraft: () => void;
         reset: () => void;
     }, {}, {}, {}, {
+        width: string;
+        allowedDates: import('../../../index.ts').CLAllowedDates;
+        isRange: boolean;
         color: CLColors;
         fluid: boolean;
         testId: string;
-        width: string;
         busy: boolean;
         disabled: boolean;
-        isRange: boolean;
     }> | null;
 }, HTMLDivElement>;
 export default _default;

package/dist/components/Form/CLInputTimePicker/CLInputTimePicker.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLInputTimePicker.css';
-import{defineComponent as e,mergeModels as a,ref as l,useModel as t,watch as o,computed as u,onMounted as i,onBeforeUnmount as s,createElementBlock as r,openBlock as d,normalizeClass as n,createVNode as m,createCommentVNode as f,unref as c,normalizeStyle as v,withCtx as p,createElementVNode as b,createTextVNode as y}from"vue";import{u as _,a as h,o as k,f as C,s as g}from"../../../chunks/floating-ui.vue-C0JWy0Dz.js";import{_ as I}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-pE0JrYmS.js";import{_ as L}from"../../../chunks/CLCard.vue_vue_type_style_index_0_lang-CY-Qr_CV.js";import{CLInput as z}from"../CLInput/CLInput.js";import{CLTimePicker as V}from"../CLTimePicker/CLTimePicker.js";import{f as x,a as B,c as H,b as j,n as R}from"../../../chunks/index-DsloP0ml.js";import{a as F}from"../../../chunks/index-wkMXT2wB.js";import{useEsc as T}from"../../../composables/useEsc.js";import{useTimeInputMask as P}from"../../../composables/useTimeInputMask.js";import{i as $}from"../../../chunks/helper-BlxFN3eF.js";const E=["data-testid"],M=/* @__PURE__ */e({name:"CLInputTimePicker",__name:"CLInputTimePicker",props:/* @__PURE__ */a({ariaLabel:{default:void 0},borderRadius:{default:void 0},color:{default:j.Neutral},size:{default:H.Small},variant:{default:B.Outline},busy:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},fluid:{type:Boolean,default:!1},form:{default:void 0},id:{},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},onReset:{type:Function,default:void 0},orientation:{default:F.Vertical},placement:{default:R.BottomStart},placeholder:{default:void 0},required:{type:Boolean,default:!1},rounded:{type:Boolean,default:!0},testId:{default:"clll-input-time-picker"},use24Hour:{type:Boolean,default:!1}},{modelValue:{default:null},modelModifiers:{}}),emits:["update:modelValue"],setup(e){const a=e,R="clll-input-time-picker",F=l(!1),M=l(),S=l(),w=l(),q=t(e,"modelValue"),U=l(""),{handleTimeInput:A,validateTime:G}=P();o(q,()=>{U.value=q.value??""},{immediate:!0});const N=u(()=>M.value?.$el),{floatingStyles:O}=_(N,w,{middleware:[k(8),C(),g()],placement:l(a.placement),whileElementsMounted:h,open:F}),D=()=>{a.disabled||a.busy||(F.value=!F.value,F.value?(a.onFocus?.(new FocusEvent("focus")),S.value?.initializeDraft()):a.onBlur?.(new FocusEvent("blur")))},J=()=>{F.value&&(F.value=!1,S.value?.cancel(),a.onBlur?.(new FocusEvent("blur")))};T({escHandler:J});const K=e=>{const a=e.target,l=M.value?.$el,t=w.value;F.value&&l&&t&&!l.contains(a)&&!t.contains(a)&&J()},Q=()=>{S.value?.apply(),F.value=!1,a.onChange?.()},W=()=>{S.value?.reset(),a.onReset?.(),a.onChange?.()},X=()=>{J()},Y=e=>{const l=G(e,a.use24Hour),t=M.value?.inputRef;return t&&(e&&!l?t.setCustomValidity(a.use24Hour?"Invalid format. Use HH:mm":"Invalid format. Use hh:mm AM/PM"):t.setCustomValidity("")),l},Z=e=>{e&&A(e,U,a.use24Hour,()=>{Y(U.value)})},ee=e=>{if(!e)return;const l=e.target.value,t=Y(l);if(!l.trim())return q.value=null,void a.onChange?.();t&&(q.value=l.trim(),a.onChange?.())};return i(()=>{$&&document.addEventListener("click",K)}),s(()=>{$&&document.removeEventListener("click",K)}),(a,l)=>(d(),r("div",{class:n([R,e.fluid?`${R}--fluid`:""]),"data-testid":e.testId},[m(c(z),{id:e.id,ref_key:"inputRef",ref:M,modelValue:U.value,"onUpdate:modelValue":l[0]||(l[0]=e=>U.value=e),"aria-label":e.ariaLabel,"border-radius":e.borderRadius,busy:e.busy,color:e.color,disabled:e.disabled,fluid:e.fluid,form:e.form,label:e.label,messages:e.messages,"message-type":e.messageType,name:e.name,orientation:e.orientation,placeholder:e.placeholder||(e.use24Hour?"HH:mm":"hh:mm AM/PM"),required:e.required,rounded:e.rounded,size:e.size,suffix:c(x).Clock,"suffix-aria-label":e.ariaLabel||"Open time picker","test-id":`${e.testId}__input`,variant:e.variant,onInput:Z,onChange:ee,onSuffixClick:D},null,8,["id","modelValue","aria-label","border-radius","busy","color","disabled","fluid","form","label","messages","message-type","name","orientation","placeholder","required","rounded","size","suffix","suffix-aria-label","test-id","variant"]),F.value?(d(),r("div",{key:0,ref_key:"popoverRef",ref:w,class:n(`${R}__popover`),style:v({...c(O),zIndex:100})},[m(c(L),{"border-radius":e.borderRadius,variant:c(B).Ghost,padded:!1,rounded:e.rounded,elevated:""},{default:p(()=>[b("div",{class:n(`${R}__container`)},[m(c(V),{ref_key:"timePickerRef",ref:S,modelValue:q.value,"onUpdate:modelValue":l[1]||(l[1]=e=>q.value=e),disabled:e.disabled,busy:e.busy,"use24-hour":e.use24Hour,fluid:""},null,8,["modelValue","disabled","busy","use24-hour"]),b("div",{class:n(`${R}__footer`)},[m(c(I),{color:c(j).Neutral,variant:c(B).Ghost,size:c(H).Small,onClick:X},{default:p(()=>[...l[2]||(l[2]=[y(" Cancel ",-1)])]),_:1},8,["color","variant","size"]),b("div",{class:n(`${R}__footer-right`)},[m(c(I),{color:c(j).Neutral,variant:c(B).Ghost,size:c(H).Small,onClick:W},{default:p(()=>[...l[3]||(l[3]=[y(" Reset ",-1)])]),_:1},8,["color","variant","size"]),m(c(I),{color:c(j).Primary,size:c(H).Small,onClick:Q},{default:p(()=>[...l[4]||(l[4]=[y(" Apply ",-1)])]),_:1},8,["color","size"])],2)],2)],2)]),_:1},8,["border-radius","variant","rounded"])],6)):f("",!0)],10,E))}});export{M as CLInputTimePicker,M as default};
+import{defineComponent as e,mergeModels as a,ref as l,useModel as t,watch as o,computed as u,onMounted as i,onBeforeUnmount as s,createElementBlock as r,openBlock as d,normalizeClass as n,createVNode as m,createCommentVNode as f,unref as c,normalizeStyle as v,withCtx as p,createElementVNode as b,createTextVNode as y}from"vue";import{u as _,a as h,o as k,f as C,s as g}from"../../../chunks/floating-ui.vue-C0JWy0Dz.js";import{_ as I}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-pE0JrYmS.js";import{_ as L}from"../../../chunks/CLCard.vue_vue_type_style_index_0_lang-CAg8Jmzv.js";import{CLInput as z}from"../CLInput/CLInput.js";import{CLTimePicker as V}from"../CLTimePicker/CLTimePicker.js";import{f as x,a as B,c as H,b as j,n as R}from"../../../chunks/index-DsloP0ml.js";import{a as F}from"../../../chunks/index-wkMXT2wB.js";import{useEsc as T}from"../../../composables/useEsc.js";import{useTimeInputMask as P}from"../../../composables/useTimeInputMask.js";import{i as $}from"../../../chunks/helper-BlxFN3eF.js";const E=["data-testid"],M=/* @__PURE__ */e({name:"CLInputTimePicker",__name:"CLInputTimePicker",props:/* @__PURE__ */a({ariaLabel:{default:void 0},borderRadius:{default:void 0},color:{default:j.Neutral},size:{default:H.Small},variant:{default:B.Outline},busy:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},fluid:{type:Boolean,default:!1},form:{default:void 0},id:{},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},onReset:{type:Function,default:void 0},orientation:{default:F.Vertical},placement:{default:R.BottomStart},placeholder:{default:void 0},required:{type:Boolean,default:!1},rounded:{type:Boolean,default:!0},testId:{default:"clll-input-time-picker"},use24Hour:{type:Boolean,default:!1}},{modelValue:{default:null},modelModifiers:{}}),emits:["update:modelValue"],setup(e){const a=e,R="clll-input-time-picker",F=l(!1),M=l(),S=l(),w=l(),q=t(e,"modelValue"),U=l(""),{handleTimeInput:A,validateTime:G}=P();o(q,()=>{U.value=q.value??""},{immediate:!0});const N=u(()=>M.value?.$el),{floatingStyles:O}=_(N,w,{middleware:[k(8),C(),g()],placement:l(a.placement),whileElementsMounted:h,open:F}),D=()=>{a.disabled||a.busy||(F.value=!F.value,F.value?(a.onFocus?.(new FocusEvent("focus")),S.value?.initializeDraft()):a.onBlur?.(new FocusEvent("blur")))},J=()=>{F.value&&(F.value=!1,S.value?.cancel(),a.onBlur?.(new FocusEvent("blur")))};T({escHandler:J});const K=e=>{const a=e.target,l=M.value?.$el,t=w.value;F.value&&l&&t&&!l.contains(a)&&!t.contains(a)&&J()},Q=()=>{S.value?.apply(),F.value=!1,a.onChange?.()},W=()=>{S.value?.reset(),a.onReset?.(),a.onChange?.()},X=()=>{J()},Y=e=>{const l=G(e,a.use24Hour),t=M.value?.inputRef;return t&&(e&&!l?t.setCustomValidity(a.use24Hour?"Invalid format. Use HH:mm":"Invalid format. Use hh:mm AM/PM"):t.setCustomValidity("")),l},Z=e=>{e&&A(e,U,a.use24Hour,()=>{Y(U.value)})},ee=e=>{if(!e)return;const l=e.target.value,t=Y(l);if(!l.trim())return q.value=null,void a.onChange?.();t&&(q.value=l.trim(),a.onChange?.())};return i(()=>{$&&document.addEventListener("click",K)}),s(()=>{$&&document.removeEventListener("click",K)}),(a,l)=>(d(),r("div",{class:n([R,e.fluid?`${R}--fluid`:""]),"data-testid":e.testId},[m(c(z),{id:e.id,ref_key:"inputRef",ref:M,modelValue:U.value,"onUpdate:modelValue":l[0]||(l[0]=e=>U.value=e),"aria-label":e.ariaLabel,"border-radius":e.borderRadius,busy:e.busy,color:e.color,disabled:e.disabled,fluid:e.fluid,form:e.form,label:e.label,messages:e.messages,"message-type":e.messageType,name:e.name,orientation:e.orientation,placeholder:e.placeholder||(e.use24Hour?"HH:mm":"hh:mm AM/PM"),required:e.required,rounded:e.rounded,size:e.size,suffix:c(x).Clock,"suffix-aria-label":e.ariaLabel||"Open time picker","test-id":`${e.testId}__input`,variant:e.variant,onInput:Z,onChange:ee,onSuffixClick:D},null,8,["id","modelValue","aria-label","border-radius","busy","color","disabled","fluid","form","label","messages","message-type","name","orientation","placeholder","required","rounded","size","suffix","suffix-aria-label","test-id","variant"]),F.value?(d(),r("div",{key:0,ref_key:"popoverRef",ref:w,class:n(`${R}__popover`),style:v({...c(O),zIndex:100})},[m(c(L),{"border-radius":e.borderRadius,variant:c(B).Ghost,padded:!1,rounded:e.rounded,elevated:""},{default:p(()=>[b("div",{class:n(`${R}__container`)},[m(c(V),{ref_key:"timePickerRef",ref:S,modelValue:q.value,"onUpdate:modelValue":l[1]||(l[1]=e=>q.value=e),disabled:e.disabled,busy:e.busy,"use24-hour":e.use24Hour,fluid:""},null,8,["modelValue","disabled","busy","use24-hour"]),b("div",{class:n(`${R}__footer`)},[m(c(I),{color:c(j).Neutral,variant:c(B).Ghost,size:c(H).Small,onClick:X},{default:p(()=>[...l[2]||(l[2]=[y(" Cancel ",-1)])]),_:1},8,["color","variant","size"]),b("div",{class:n(`${R}__footer-right`)},[m(c(I),{color:c(j).Neutral,variant:c(B).Ghost,size:c(H).Small,onClick:W},{default:p(()=>[...l[3]||(l[3]=[y(" Reset ",-1)])]),_:1},8,["color","variant","size"]),m(c(I),{color:c(j).Primary,size:c(H).Small,onClick:Q},{default:p(()=>[...l[4]||(l[4]=[y(" Apply ",-1)])]),_:1},8,["color","size"])],2)],2)],2)]),_:1},8,["border-radius","variant","rounded"])],6)):f("",!0)],10,E))}});export{M as CLInputTimePicker,M as default};

package/dist/components/Form/CLInputTimePicker/CLInputTimePicker.vue.d.ts

@@ -60,14 +60,14 @@ declare const _default: import('vue').DefineComponent<{
 } & CLInputTimePickerProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: string | null) => any) | undefined;
 }>, {
+    form: string;
+    label: string;
     size: CLSizes;
     color: CLColors;
     variant: CLColorVariants.Outline | CLColorVariants.Ghost;
     fluid: boolean;
     rounded: boolean;
     testId: string;
-    form: string;
-    label: string;
     onFocus: CLGenericFocusFunction;
     onBlur: CLGenericFocusFunction;
     onChange: CLGenericFunction;
@@ -95,6 +95,9 @@ declare const _default: import('vue').DefineComponent<{
         reset: (...args: any[]) => void;
         "update:modelValue": (value: string | number) => void;
     }, import('vue').PublicProps, {
+        form: string;
+        label: string;
+        pattern: string;
         size: CLSizes;
         color: CLColors;
         variant: CLColorVariants.Outline | CLColorVariants.Ghost;
@@ -102,9 +105,6 @@ declare const _default: import('vue').DefineComponent<{
         rounded: boolean;
         testId: string;
         type: import('@codeandfunction/callaloo-types').CLInputTypes;
-        form: string;
-        label: string;
-        pattern: string;
         onFocus: CLGenericFocusFunction;
         onBlur: CLGenericFocusFunction;
         onChange: CLGenericFunction;
@@ -149,6 +149,9 @@ declare const _default: import('vue').DefineComponent<{
     }>, {
         inputRef: Readonly<globalThis.ShallowRef<HTMLInputElement | null>>;
     }, {}, {}, {}, {
+        form: string;
+        label: string;
+        pattern: string;
         size: CLSizes;
         color: CLColors;
         variant: CLColorVariants.Outline | CLColorVariants.Ghost;
@@ -156,9 +159,6 @@ declare const _default: import('vue').DefineComponent<{
         rounded: boolean;
         testId: string;
         type: import('@codeandfunction/callaloo-types').CLInputTypes;
-        form: string;
-        label: string;
-        pattern: string;
         onFocus: CLGenericFocusFunction;
         onBlur: CLGenericFocusFunction;
         onChange: CLGenericFunction;
@@ -206,10 +206,10 @@ declare const _default: import('vue').DefineComponent<{
         "update:modelValue": (value: string | null) => any;
         "time-select": (time: string) => any;
     }, import('vue').PublicProps, {
+        width: string;
         color: CLColors;
         fluid: boolean;
         testId: string;
-        width: string;
         use24Hour: boolean;
         busy: boolean;
         disabled: boolean;
@@ -236,10 +236,10 @@ declare const _default: import('vue').DefineComponent<{
         initializeDraft: () => void;
         reset: () => void;
     }, {}, {}, {}, {
+        width: string;
         color: CLColors;
         fluid: boolean;
         testId: string;
-        width: string;
         use24Hour: boolean;
         busy: boolean;
         disabled: boolean;

package/dist/components/Form/CLInputTimePicker/index.d.ts

@@ -8,14 +8,14 @@ export declare const CLInputTimePicker: import('vue').DefineComponent<{
 } & import('./CLInputTimePicker.vue').CLInputTimePickerProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: string | null) => any) | undefined;
 }>, {
+    form: string;
+    label: string;
     size: import('@codeandfunction/callaloo-tokens').CLSizes;
     color: import('@codeandfunction/callaloo-tokens').CLColors;
     variant: import("@codeandfunction/callaloo-tokens").CLColorVariants.Outline | import("@codeandfunction/callaloo-tokens").CLColorVariants.Ghost;
     fluid: boolean;
     rounded: boolean;
     testId: string;
-    form: string;
-    label: string;
     onFocus: import('../../..').CLGenericFocusFunction;
     onBlur: import('../../..').CLGenericFocusFunction;
     onChange: import('../../..').CLGenericFunction;
@@ -43,6 +43,9 @@ export declare const CLInputTimePicker: import('vue').DefineComponent<{
         reset: (...args: any[]) => void;
         "update:modelValue": (value: string | number) => void;
     }, import('vue').PublicProps, {
+        form: string;
+        label: string;
+        pattern: string;
         size: import('@codeandfunction/callaloo-tokens').CLSizes;
         color: import('@codeandfunction/callaloo-tokens').CLColors;
         variant: import("@codeandfunction/callaloo-tokens").CLColorVariants.Outline | import("@codeandfunction/callaloo-tokens").CLColorVariants.Ghost;
@@ -50,9 +53,6 @@ export declare const CLInputTimePicker: import('vue').DefineComponent<{
         rounded: boolean;
         testId: string;
         type: import('@codeandfunction/callaloo-types').CLInputTypes;
-        form: string;
-        label: string;
-        pattern: string;
         onFocus: import('../../..').CLGenericFocusFunction;
         onBlur: import('../../..').CLGenericFocusFunction;
         onChange: import('../../..').CLGenericFunction;
@@ -97,6 +97,9 @@ export declare const CLInputTimePicker: import('vue').DefineComponent<{
     }>, {
         inputRef: Readonly<globalThis.ShallowRef<HTMLInputElement | null>>;
     }, {}, {}, {}, {
+        form: string;
+        label: string;
+        pattern: string;
         size: import('@codeandfunction/callaloo-tokens').CLSizes;
         color: import('@codeandfunction/callaloo-tokens').CLColors;
         variant: import("@codeandfunction/callaloo-tokens").CLColorVariants.Outline | import("@codeandfunction/callaloo-tokens").CLColorVariants.Ghost;
@@ -104,9 +107,6 @@ export declare const CLInputTimePicker: import('vue').DefineComponent<{
         rounded: boolean;
         testId: string;
         type: import('@codeandfunction/callaloo-types').CLInputTypes;
-        form: string;
-        label: string;
-        pattern: string;
         onFocus: import('../../..').CLGenericFocusFunction;
         onBlur: import('../../..').CLGenericFocusFunction;
         onChange: import('../../..').CLGenericFunction;
@@ -154,10 +154,10 @@ export declare const CLInputTimePicker: import('vue').DefineComponent<{
         "update:modelValue": (value: string | null) => any;
         "time-select": (time: string) => any;
     }, import('vue').PublicProps, {
+        width: string;
         color: import('@codeandfunction/callaloo-tokens').CLColors;
         fluid: boolean;
         testId: string;
-        width: string;
         use24Hour: boolean;
         busy: boolean;
         disabled: boolean;
@@ -184,10 +184,10 @@ export declare const CLInputTimePicker: import('vue').DefineComponent<{
         initializeDraft: () => void;
         reset: () => void;
     }, {}, {}, {}, {
+        width: string;
         color: import('@codeandfunction/callaloo-tokens').CLColors;
         fluid: boolean;
         testId: string;
-        width: string;
         use24Hour: boolean;
         busy: boolean;
         disabled: boolean;

package/dist/components/Form/CLRadioButton/CLRadioButton.js

@@ -1,4 +1,4 @@
 import '../../../assets/core.css';
 import './CLRadioButton.css';
 import '../../../assets/shared/form-utilities.css';
-import{defineComponent as e,mergeModels as a,useModel as l,useTemplateRef as s,computed as o,createBlock as d,openBlock as t,withCtx as u,createElementVNode as r,createCommentVNode as n,normalizeStyle as i,normalizeClass as m,unref as c,withDirectives as p,vModelRadio as b,createTextVNode as _,toDisplayString as y}from"vue";import{_ as f}from"../../../chunks/CLFormField.vue_vue_type_style_index_0_lang-Rf_Mo_VS.js";import{_ as $}from"../../../chunks/CLInputMessages.vue_vue_type_style_index_0_lang-gkHODA90.js";import{_ as g}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-CdA4TW0N.js";import{c as v,d as X,a as L,b as h}from"../../../chunks/index-DsloP0ml.js";import{a as B}from"../../../chunks/utils-jYeghjKF.js";import{useTheme as k}from"../../../composables/useTheme.js";const C=["data-testid"],x=["for"],q=["id","aria-label","checked","disabled","name","value","required"],R=/* @__PURE__ */e({name:"CLRadioButton",__name:"CLRadioButton",props:/* @__PURE__ */a({ariaLabel:{},borderRadius:{},busy:{type:Boolean},checked:{type:Boolean},color:{default:h.Neutral},disabled:{type:Boolean},form:{},id:{},label:{},messages:{},messageType:{},name:{},required:{type:Boolean},rounded:{type:Boolean,default:!0},size:{default:v.Small},testId:{default:"clll-radiobutton"},value:{type:[String,Number,Boolean]},variant:{default:L.Outline},onBlur:{},onChange:{},onFocus:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(e,{expose:a}){const L={[v.Tiny]:X.Small,[v.Small]:X.Medium,[v.Medium]:X.Medium,[v.Large]:X.Large,[v.XL]:X.XL,[v.XXL]:X.XXL,[v.XXXL]:X.XXXL,[v.XXXXL]:X.XXXXL},h=e,R=k(),T="clll-radiobutton",j=l(e,"modelValue"),F=s("radiobutton-ref"),M=()=>{F.value&&F.value.focus()},S=o(()=>[T,h.borderRadius?`${T}--${h.borderRadius}`:"",h.busy?`${T}--busy`:`${T}--ready`,`${T}--${h.color}`,`${T}--${h.size}`,h.disabled?`${T}--disabled`:`${T}--active`,h.label?`${T}--haslabel`:"",h.messageType?`${T}--${h.messageType}`:"",h.rounded?`${T}--rounded`:`${T}--box`,h.required?`${T}--required`:`${T}--optional`]),V=o(()=>[`${T}__radiobutton-container`,`${T}--${h.variant}`]);return a({radiobuttonRef:F}),(a,l)=>(t(),d(f,null,{default:u(()=>[r("span",{class:m(c(S)),style:i(c(B)({color:e.color,variant:e.variant,theme:c(R)})),"data-testid":e.testId},[r("span",{class:m(c(V)),onClick:M},[r("label",{for:e.id,class:m(`${T}__label`)},[r("span",{class:m([`${T}__radiobutton-frame`,"form-control-flex"])},[p(r("input",{id:e.id,ref:"radiobutton-ref","onUpdate:modelValue":l[0]||(l[0]=e=>j.value=e),"aria-label":e.ariaLabel,class:m(`${T}__radiobutton`),checked:e.checked,disabled:e.disabled||e.busy,name:e.name,value:e.value,required:e.required,type:"radio",onBlur:l[1]||(l[1]=(...a)=>e.onBlur&&e.onBlur(...a)),onChange:l[2]||(l[2]=(...a)=>e.onChange&&e.onChange(...a)),onFocus:l[3]||(l[3]=(...a)=>e.onFocus&&e.onFocus(...a))},null,42,q),[[b,j.value]]),r("span",{class:m(`${T}__indicator`)},null,2)],2),e.label?(t(),d(c(g),{key:0,as:"span",type:L[e.size],class:m(e.required?`${T}__label--required`:"")},{default:u(()=>[_(y(e.label),1)]),_:1},8,["type","class"])):n("",!0)],10,x)],2)],14,C),e.id?(t(),d($,{key:0,id:e.id,messages:e.messages,"message-type":e.messageType},null,8,["id","messages","message-type"])):n("",!0)]),_:1}))}});export{R as CLRadioButton,R as default};
+import{defineComponent as e,mergeModels as a,useModel as l,useTemplateRef as s,computed as o,createBlock as d,openBlock as t,withCtx as u,createElementVNode as r,createCommentVNode as n,normalizeStyle as i,normalizeClass as m,unref as c,withDirectives as p,vModelRadio as b,createTextVNode as _,toDisplayString as y}from"vue";import{_ as f}from"../../../chunks/CLFormField.vue_vue_type_style_index_0_lang-Rf_Mo_VS.js";import{_ as $}from"../../../chunks/CLInputMessages.vue_vue_type_style_index_0_lang-gkHODA90.js";import{_ as g}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-DR2zoTEJ.js";import{c as v,d as X,a as L,b as h}from"../../../chunks/index-DsloP0ml.js";import{a as B}from"../../../chunks/utils-jYeghjKF.js";import{useTheme as k}from"../../../composables/useTheme.js";const C=["data-testid"],x=["for"],q=["id","aria-label","checked","disabled","name","value","required"],R=/* @__PURE__ */e({name:"CLRadioButton",__name:"CLRadioButton",props:/* @__PURE__ */a({ariaLabel:{},borderRadius:{},busy:{type:Boolean},checked:{type:Boolean},color:{default:h.Neutral},disabled:{type:Boolean},form:{},id:{},label:{},messages:{},messageType:{},name:{},required:{type:Boolean},rounded:{type:Boolean,default:!0},size:{default:v.Small},testId:{default:"clll-radiobutton"},value:{type:[String,Number,Boolean]},variant:{default:L.Outline},onBlur:{},onChange:{},onFocus:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(e,{expose:a}){const L={[v.Tiny]:X.Small,[v.Small]:X.Medium,[v.Medium]:X.Medium,[v.Large]:X.Large,[v.XL]:X.XL,[v.XXL]:X.XXL,[v.XXXL]:X.XXXL,[v.XXXXL]:X.XXXXL},h=e,R=k(),T="clll-radiobutton",j=l(e,"modelValue"),F=s("radiobutton-ref"),M=()=>{F.value&&F.value.focus()},S=o(()=>[T,h.borderRadius?`${T}--${h.borderRadius}`:"",h.busy?`${T}--busy`:`${T}--ready`,`${T}--${h.color}`,`${T}--${h.size}`,h.disabled?`${T}--disabled`:`${T}--active`,h.label?`${T}--haslabel`:"",h.messageType?`${T}--${h.messageType}`:"",h.rounded?`${T}--rounded`:`${T}--box`,h.required?`${T}--required`:`${T}--optional`]),V=o(()=>[`${T}__radiobutton-container`,`${T}--${h.variant}`]);return a({radiobuttonRef:F}),(a,l)=>(t(),d(f,null,{default:u(()=>[r("span",{class:m(c(S)),style:i(c(B)({color:e.color,variant:e.variant,theme:c(R)})),"data-testid":e.testId},[r("span",{class:m(c(V)),onClick:M},[r("label",{for:e.id,class:m(`${T}__label`)},[r("span",{class:m([`${T}__radiobutton-frame`,"form-control-flex"])},[p(r("input",{id:e.id,ref:"radiobutton-ref","onUpdate:modelValue":l[0]||(l[0]=e=>j.value=e),"aria-label":e.ariaLabel,class:m(`${T}__radiobutton`),checked:e.checked,disabled:e.disabled||e.busy,name:e.name,value:e.value,required:e.required,type:"radio",onBlur:l[1]||(l[1]=(...a)=>e.onBlur&&e.onBlur(...a)),onChange:l[2]||(l[2]=(...a)=>e.onChange&&e.onChange(...a)),onFocus:l[3]||(l[3]=(...a)=>e.onFocus&&e.onFocus(...a))},null,42,q),[[b,j.value]]),r("span",{class:m(`${T}__indicator`)},null,2)],2),e.label?(t(),d(c(g),{key:0,as:"span",type:L[e.size],class:m(e.required?`${T}__label--required`:"")},{default:u(()=>[_(y(e.label),1)]),_:1},8,["type","class"])):n("",!0)],10,x)],2)],14,C),e.id?(t(),d($,{key:0,id:e.id,messages:e.messages,"message-type":e.messageType},null,8,["id","messages","message-type"])):n("",!0)]),_:1}))}});export{R as CLRadioButton,R as default};

package/dist/components/Form/CLSelect/CLSelect.js

@@ -1,4 +1,4 @@
 import '../../../assets/core.css';
 import './CLSelect.css';
 import '../../../assets/shared/form-utilities.css';
-import{defineComponent as e,mergeModels as a,useModel as l,useTemplateRef as s,computed as o,createBlock as i,openBlock as t,withCtx as r,createElementVNode as n,createCommentVNode as d,normalizeStyle as u,normalizeClass as m,unref as c,withDirectives as p,createElementBlock as f,Fragment as _,renderList as b,toDisplayString as y,vModelSelect as $,createVNode as v}from"vue";import{_ as g}from"../../../chunks/CLFormField.vue_vue_type_style_index_0_lang-Rf_Mo_VS.js";import{_ as h}from"../../../chunks/CLInputMessages.vue_vue_type_style_index_0_lang-gkHODA90.js";import{_ as L}from"../../../chunks/CLFormLabel.vue_vue_type_script_setup_true_lang-DoM5X-sA.js";import{_ as C}from"../../../chunks/CLIcon.vue_vue_type_style_index_0_lang-BmRKmzSl.js";import{c as k,e as x,f as X,a as q,b as z}from"../../../chunks/index-DsloP0ml.js";import{a as B}from"../../../chunks/index-wkMXT2wB.js";import{s as j}from"../../../chunks/utils-jYeghjKF.js";import{useTheme as T}from"../../../composables/useTheme.js";const F=["data-testid"],S=["id","aria-label","disabled","name","placeholder","form","required"],M=["value","selected","disabled"],V=/* @__PURE__ */e({name:"CLSelect",__name:"CLSelect",props:/* @__PURE__ */a({ariaLabel:{},borderRadius:{},busy:{type:Boolean},color:{default:z.Neutral},disabled:{type:Boolean},fluid:{type:Boolean,default:!1},form:{},id:{},label:{},messages:{},messageType:{},name:{},onBlur:{},onChange:{},onFocus:{},orientation:{default:B.Vertical},options:{},placeholder:{},required:{type:Boolean},rounded:{type:Boolean,default:!0},size:{default:k.Small},testId:{default:"clll-select"},variant:{default:q.Outline}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(e,{expose:a}){const q={[k.Tiny]:x.Tiny,[k.Small]:x.Tiny,[k.Medium]:x.Small,[k.Large]:x.Medium,[k.XL]:x.Medium,[k.XXL]:x.Large,[k.XXXL]:x.Large,[k.XXXXL]:x.XL},z=e,V=T(),I="clll-select",R=l(e,"modelValue"),w=s("select-ref"),D=()=>{w.value&&w.value.focus()},H=o(()=>[I,z.borderRadius?`${I}--${z.borderRadius}`:"",z.busy?`${I}--busy`:`${I}--ready`,`${I}--${z.color}`,`${I}--${z.size}`,`${I}--${z.variant}`,z.disabled||z.busy?`${I}--disabled`:`${I}--active`,z.fluid||z.orientation===B.Horizontal?`${I}--fluid`:`${I}--fixed`,z.label?`${I}--haslabel`:"",z.messageType?`${I}--${z.messageType}`:"",z.orientation?`${I}--${z.orientation}`:"",z.rounded?`${I}--rounded`:`${I}--box`,z.required?`${I}--required`:`${I}--optional`]);return a({selectRef:w}),(a,l)=>(t(),i(g,{fluid:e.fluid,orientation:e.orientation},{default:r(()=>[n("span",{class:m(c(H)),style:u(c(j)({color:e.color,variant:e.variant,theme:c(V)})),"data-testid":e.testId},[e.label?(t(),i(L,{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"])):d("",!0),n("span",{class:m(`${I}__select-container`),onClick:D},[p(n("select",{id:e.id,ref:"select-ref","onUpdate:modelValue":l[0]||(l[0]=e=>R.value=e),"aria-label":e.ariaLabel,class:m(`${I}__select`),disabled:e.disabled||e.busy,name:e.name,placeholder:e.placeholder,form:e.form,required:e.required,onBlur:l[1]||(l[1]=(...a)=>e.onBlur&&e.onBlur(...a)),onChange:l[2]||(l[2]=(...a)=>e.onChange&&e.onChange(...a)),onFocus:l[3]||(l[3]=(...a)=>e.onFocus&&e.onFocus(...a))},[e.options?(t(!0),f(_,{key:0},b(e.options,(a,l)=>(t(),f("option",{key:`${e.id}-option-${l}`,value:a.value,selected:a.value===R.value,disabled:a.disabled},y(a.label),9,M))),128)):d("",!0)],42,S),[[$,R.value]]),n("span",{class:m([`${I}__icon`,"form-select-icon-flex"])},[v(c(C),{name:c(X).ChevronDown,size:q[e.size]},null,8,["name","size"])],2)],2)],14,F),e.id?(t(),i(h,{key:0,id:e.id,messages:e.messages,"message-type":e.messageType},null,8,["id","messages","message-type"])):d("",!0)]),_:1},8,["fluid","orientation"]))}});export{V as CLSelect,V as default};
+import{defineComponent as e,mergeModels as a,useModel as l,useTemplateRef as s,computed as o,createBlock as i,openBlock as t,withCtx as r,createElementVNode as n,createCommentVNode as d,normalizeStyle as u,normalizeClass as m,unref as c,withDirectives as p,createElementBlock as f,Fragment as _,renderList as b,toDisplayString as y,vModelSelect as $,createVNode as v}from"vue";import{_ as g}from"../../../chunks/CLFormField.vue_vue_type_style_index_0_lang-Rf_Mo_VS.js";import{_ as h}from"../../../chunks/CLInputMessages.vue_vue_type_style_index_0_lang-gkHODA90.js";import{_ as L}from"../../../chunks/CLFormLabel.vue_vue_type_script_setup_true_lang-Cv4WHr_X.js";import{_ as C}from"../../../chunks/CLIcon.vue_vue_type_style_index_0_lang-BmRKmzSl.js";import{c as k,e as x,f as X,a as q,b as z}from"../../../chunks/index-DsloP0ml.js";import{a as B}from"../../../chunks/index-wkMXT2wB.js";import{s as j}from"../../../chunks/utils-jYeghjKF.js";import{useTheme as T}from"../../../composables/useTheme.js";const F=["data-testid"],S=["id","aria-label","disabled","name","placeholder","form","required"],M=["value","selected","disabled"],V=/* @__PURE__ */e({name:"CLSelect",__name:"CLSelect",props:/* @__PURE__ */a({ariaLabel:{},borderRadius:{},busy:{type:Boolean},color:{default:z.Neutral},disabled:{type:Boolean},fluid:{type:Boolean,default:!1},form:{},id:{},label:{},messages:{},messageType:{},name:{},onBlur:{},onChange:{},onFocus:{},orientation:{default:B.Vertical},options:{},placeholder:{},required:{type:Boolean},rounded:{type:Boolean,default:!0},size:{default:k.Small},testId:{default:"clll-select"},variant:{default:q.Outline}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(e,{expose:a}){const q={[k.Tiny]:x.Tiny,[k.Small]:x.Tiny,[k.Medium]:x.Small,[k.Large]:x.Medium,[k.XL]:x.Medium,[k.XXL]:x.Large,[k.XXXL]:x.Large,[k.XXXXL]:x.XL},z=e,V=T(),I="clll-select",R=l(e,"modelValue"),w=s("select-ref"),D=()=>{w.value&&w.value.focus()},H=o(()=>[I,z.borderRadius?`${I}--${z.borderRadius}`:"",z.busy?`${I}--busy`:`${I}--ready`,`${I}--${z.color}`,`${I}--${z.size}`,`${I}--${z.variant}`,z.disabled||z.busy?`${I}--disabled`:`${I}--active`,z.fluid||z.orientation===B.Horizontal?`${I}--fluid`:`${I}--fixed`,z.label?`${I}--haslabel`:"",z.messageType?`${I}--${z.messageType}`:"",z.orientation?`${I}--${z.orientation}`:"",z.rounded?`${I}--rounded`:`${I}--box`,z.required?`${I}--required`:`${I}--optional`]);return a({selectRef:w}),(a,l)=>(t(),i(g,{fluid:e.fluid,orientation:e.orientation},{default:r(()=>[n("span",{class:m(c(H)),style:u(c(j)({color:e.color,variant:e.variant,theme:c(V)})),"data-testid":e.testId},[e.label?(t(),i(L,{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"])):d("",!0),n("span",{class:m(`${I}__select-container`),onClick:D},[p(n("select",{id:e.id,ref:"select-ref","onUpdate:modelValue":l[0]||(l[0]=e=>R.value=e),"aria-label":e.ariaLabel,class:m(`${I}__select`),disabled:e.disabled||e.busy,name:e.name,placeholder:e.placeholder,form:e.form,required:e.required,onBlur:l[1]||(l[1]=(...a)=>e.onBlur&&e.onBlur(...a)),onChange:l[2]||(l[2]=(...a)=>e.onChange&&e.onChange(...a)),onFocus:l[3]||(l[3]=(...a)=>e.onFocus&&e.onFocus(...a))},[e.options?(t(!0),f(_,{key:0},b(e.options,(a,l)=>(t(),f("option",{key:`${e.id}-option-${l}`,value:a.value,selected:a.value===R.value,disabled:a.disabled},y(a.label),9,M))),128)):d("",!0)],42,S),[[$,R.value]]),n("span",{class:m([`${I}__icon`,"form-select-icon-flex"])},[v(c(C),{name:c(X).ChevronDown,size:q[e.size]},null,8,["name","size"])],2)],2)],14,F),e.id?(t(),i(h,{key:0,id:e.id,messages:e.messages,"message-type":e.messageType},null,8,["id","messages","message-type"])):d("",!0)]),_:1},8,["fluid","orientation"]))}});export{V as CLSelect,V as default};

package/dist/components/Form/CLTextArea/CLTextArea.js

@@ -1,4 +1,4 @@
 import '../../../assets/core.css';
 import './CLTextArea.css';
 import '../../../assets/shared/form-utilities.css';
-import{defineComponent as e,mergeModels as a,useTemplateRef as l,useModel as o,computed as t,createBlock as r,openBlock as n,withCtx as s,createElementVNode as u,createCommentVNode as i,normalizeStyle as d,normalizeClass as m,unref as p,withDirectives as c,vModelText as h}from"vue";import{_ as f}from"../../../chunks/CLFormField.vue_vue_type_style_index_0_lang-Rf_Mo_VS.js";import{_ as y}from"../../../chunks/CLInputMessages.vue_vue_type_style_index_0_lang-gkHODA90.js";import{_ as g}from"../../../chunks/CLFormLabel.vue_vue_type_script_setup_true_lang-DoM5X-sA.js";import{_}from"../../../chunks/CLFormCharCounter.vue_vue_type_style_index_0_lang-D3Ao581E.js";import{a as b,c as x,b as $}from"../../../chunks/index-DsloP0ml.js";import{a as C,C as v}from"../../../chunks/index-wkMXT2wB.js";import{b as L}from"../../../chunks/utils-jYeghjKF.js";import{useTheme as k}from"../../../composables/useTheme.js";const B=["data-testid"],z=["id","aria-label","autocomplete","cols","disabled","form","maxlength","minlength","name","pattern","placeholder","readonly","required","spellcheck","rows"],q=/* @__PURE__ */e({name:"CLTextArea",__name:"CLTextArea",props:/* @__PURE__ */a({ariaLabel:{},autoComplete:{type:Boolean},borderRadius:{},busy:{type:Boolean},charCounter:{type:Boolean},color:{default:$.Neutral},cols:{},disabled:{type:Boolean},fluid:{type:Boolean,default:!1},form:{},id:{},label:{},maxLength:{},messages:{},messageType:{},minLength:{},name:{},onBlur:{},onChange:{},onFocus:{},onInput:{},orientation:{default:C.Vertical},pattern:{},placeholder:{},readonly:{type:Boolean},required:{type:Boolean},resizable:{type:Boolean,default:!1},rounded:{type:Boolean,default:!0},rows:{},size:{default:x.Small},spellCheck:{type:Boolean},testId:{default:"clll-textarea"},variant:{default:b.Outline}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(e,{expose:a}){const b=e,x=k(),$="clll-textarea",q=l("textarea-ref"),j=o(e,"modelValue"),F=()=>{q.value&&q.value.focus()},T=t(()=>[$,b.borderRadius?`${$}--${b.borderRadius}`:"",b.busy?`${$}--busy`:`${$}--ready`,`${$}--${b.color}`,`${$}--${b.size}`,`${$}--${b.variant}`,b.disabled||b.busy?`${$}--disabled`:`${$}--active`,b.charCounter&&b.maxLength?`${$}--hascharcounter`:"",b.fluid||b.orientation===C.Horizontal?`${$}--fluid`:`${$}--fixed`,b.label?`${$}--haslabel`:"",b.messageType?`${$}--${b.messageType}`:"",b.orientation?`${$}--${b.orientation}`:"",b.resizable?`${$}--resizable`:"",b.readonly?`${$}--readonly`:`${$}--writeable`,b.rounded?`${$}--rounded`:`${$}--box`,b.required?`${$}--required`:`${$}--optional`]);return a({textareaRef:q}),(a,l)=>(n(),r(f,{fluid:e.fluid,"has-char-counter":!(!e.charCounter||!e.maxLength),orientation:e.orientation},{default:s(()=>[u("span",{class:m(p(T)),style:d(p(L)({color:e.color,variant:e.variant,theme:p(x)})),"data-testid":e.testId},[e.label?(n(),r(g,{key:0,"css-prefix":$,"html-for":e.id,label:e.label,required:e.required,size:e.size},null,8,["html-for","label","required","size"])):i("",!0),u("span",{class:m(`${$}__input-container`),onClick:F},[c(u("textarea",{id:e.id,ref:"textarea-ref","onUpdate:modelValue":l[0]||(l[0]=e=>j.value=e),"aria-label":e.ariaLabel,autocomplete:e.autoComplete?"on":"off",class:m(`${$}__input`),cols:e.cols,disabled:e.disabled||e.busy,form:e.form,maxlength:e.maxLength,minlength:e.minLength,name:e.name,pattern:e.pattern,placeholder:e.placeholder,readonly:e.readonly,required:e.required,spellcheck:e.spellCheck,rows:e.rows,onBlur:l[1]||(l[1]=(...a)=>e.onBlur&&e.onBlur(...a)),onChange:l[2]||(l[2]=(...a)=>e.onChange&&e.onChange(...a)),onFocus:l[3]||(l[3]=(...a)=>e.onFocus&&e.onFocus(...a)),onInput:l[4]||(l[4]=(...a)=>e.onInput&&e.onInput(...a))},null,42,z),[[h,j.value]])],2),e.charCounter&&e.maxLength?(n(),r(_,{key:1,"css-prefix":$,"current-length":j.value?j.value.toString().length:0,"max-length":e.maxLength,color:e.color,size:e.size,layout:p(v).Block},null,8,["current-length","max-length","color","size","layout"])):i("",!0)],14,B),e.id?(n(),r(y,{key:0,id:e.id,messages:e.messages,"message-type":e.messageType},null,8,["id","messages","message-type"])):i("",!0)]),_:1},8,["fluid","has-char-counter","orientation"]))}});export{q as CLTextArea,q as default};
+import{defineComponent as e,mergeModels as a,useTemplateRef as l,useModel as o,computed as t,createBlock as r,openBlock as n,withCtx as s,createElementVNode as u,createCommentVNode as i,normalizeStyle as d,normalizeClass as m,unref as p,withDirectives as c,vModelText as h}from"vue";import{_ as f}from"../../../chunks/CLFormField.vue_vue_type_style_index_0_lang-Rf_Mo_VS.js";import{_ as y}from"../../../chunks/CLInputMessages.vue_vue_type_style_index_0_lang-gkHODA90.js";import{_ as g}from"../../../chunks/CLFormLabel.vue_vue_type_script_setup_true_lang-Cv4WHr_X.js";import{_}from"../../../chunks/CLFormCharCounter.vue_vue_type_style_index_0_lang-D3Ao581E.js";import{a as b,c as x,b as $}from"../../../chunks/index-DsloP0ml.js";import{a as C,C as v}from"../../../chunks/index-wkMXT2wB.js";import{b as L}from"../../../chunks/utils-jYeghjKF.js";import{useTheme as k}from"../../../composables/useTheme.js";const B=["data-testid"],z=["id","aria-label","autocomplete","cols","disabled","form","maxlength","minlength","name","pattern","placeholder","readonly","required","spellcheck","rows"],q=/* @__PURE__ */e({name:"CLTextArea",__name:"CLTextArea",props:/* @__PURE__ */a({ariaLabel:{},autoComplete:{type:Boolean},borderRadius:{},busy:{type:Boolean},charCounter:{type:Boolean},color:{default:$.Neutral},cols:{},disabled:{type:Boolean},fluid:{type:Boolean,default:!1},form:{},id:{},label:{},maxLength:{},messages:{},messageType:{},minLength:{},name:{},onBlur:{},onChange:{},onFocus:{},onInput:{},orientation:{default:C.Vertical},pattern:{},placeholder:{},readonly:{type:Boolean},required:{type:Boolean},resizable:{type:Boolean,default:!1},rounded:{type:Boolean,default:!0},rows:{},size:{default:x.Small},spellCheck:{type:Boolean},testId:{default:"clll-textarea"},variant:{default:b.Outline}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(e,{expose:a}){const b=e,x=k(),$="clll-textarea",q=l("textarea-ref"),j=o(e,"modelValue"),F=()=>{q.value&&q.value.focus()},T=t(()=>[$,b.borderRadius?`${$}--${b.borderRadius}`:"",b.busy?`${$}--busy`:`${$}--ready`,`${$}--${b.color}`,`${$}--${b.size}`,`${$}--${b.variant}`,b.disabled||b.busy?`${$}--disabled`:`${$}--active`,b.charCounter&&b.maxLength?`${$}--hascharcounter`:"",b.fluid||b.orientation===C.Horizontal?`${$}--fluid`:`${$}--fixed`,b.label?`${$}--haslabel`:"",b.messageType?`${$}--${b.messageType}`:"",b.orientation?`${$}--${b.orientation}`:"",b.resizable?`${$}--resizable`:"",b.readonly?`${$}--readonly`:`${$}--writeable`,b.rounded?`${$}--rounded`:`${$}--box`,b.required?`${$}--required`:`${$}--optional`]);return a({textareaRef:q}),(a,l)=>(n(),r(f,{fluid:e.fluid,"has-char-counter":!(!e.charCounter||!e.maxLength),orientation:e.orientation},{default:s(()=>[u("span",{class:m(p(T)),style:d(p(L)({color:e.color,variant:e.variant,theme:p(x)})),"data-testid":e.testId},[e.label?(n(),r(g,{key:0,"css-prefix":$,"html-for":e.id,label:e.label,required:e.required,size:e.size},null,8,["html-for","label","required","size"])):i("",!0),u("span",{class:m(`${$}__input-container`),onClick:F},[c(u("textarea",{id:e.id,ref:"textarea-ref","onUpdate:modelValue":l[0]||(l[0]=e=>j.value=e),"aria-label":e.ariaLabel,autocomplete:e.autoComplete?"on":"off",class:m(`${$}__input`),cols:e.cols,disabled:e.disabled||e.busy,form:e.form,maxlength:e.maxLength,minlength:e.minLength,name:e.name,pattern:e.pattern,placeholder:e.placeholder,readonly:e.readonly,required:e.required,spellcheck:e.spellCheck,rows:e.rows,onBlur:l[1]||(l[1]=(...a)=>e.onBlur&&e.onBlur(...a)),onChange:l[2]||(l[2]=(...a)=>e.onChange&&e.onChange(...a)),onFocus:l[3]||(l[3]=(...a)=>e.onFocus&&e.onFocus(...a)),onInput:l[4]||(l[4]=(...a)=>e.onInput&&e.onInput(...a))},null,42,z),[[h,j.value]])],2),e.charCounter&&e.maxLength?(n(),r(_,{key:1,"css-prefix":$,"current-length":j.value?j.value.toString().length:0,"max-length":e.maxLength,color:e.color,size:e.size,layout:p(v).Block},null,8,["current-length","max-length","color","size","layout"])):i("",!0)],14,B),e.id?(n(),r(y,{key:0,id:e.id,messages:e.messages,"message-type":e.messageType},null,8,["id","messages","message-type"])):i("",!0)]),_:1},8,["fluid","has-char-counter","orientation"]))}});export{q as CLTextArea,q as default};

package/dist/components/Form/CLTimePicker/CLTimePicker.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLTimePicker.css';
-import{defineComponent as e,mergeModels as l,useCssVars as t,ref as a,useModel as u,toRef as i,watch as s,createElementBlock as o,openBlock as r,normalizeStyle as d,normalizeClass as n,unref as c,createCommentVNode as p,createElementVNode as m,createVNode as v,withCtx as _,createTextVNode as b,toDisplayString as f,withDirectives as y,isRef as g,vModelText as h}from"vue";import{_ as $}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-CdA4TW0N.js";import{b as x,d as M}from"../../../chunks/index-DsloP0ml.js";import{t as S}from"../../../chunks/utils-jYeghjKF.js";import{useTimePicker as k}from"../../../composables/useTimePicker.js";import{useTheme as H}from"../../../composables/useTheme.js";const P=["data-testid"],D=["disabled"],I=["disabled"],T=["disabled"],j=["disabled"],B=/* @__PURE__ */e({name:"CLTimePicker",__name:"CLTimePicker",props:/* @__PURE__ */l({color:{default:x.Primary},disabled:{type:Boolean,default:!1},busy:{type:Boolean,default:!1},fluid:{type:Boolean,default:!1},headerLabel:{default:"Enter time"},testId:{default:"clll-time-picker"},use24Hour:{type:Boolean,default:!1},width:{default:"auto"}},{modelValue:{},modelModifiers:{}}),emits:/* @__PURE__ */l(["time-select"],["update:modelValue"]),setup(e,{expose:l,emit:B}){t(e=>({v6249f3d5:e.width}));const L=e,C=B,V=H(),A="clll-time-picker",F=a(null),N=u(e,"modelValue"),w=a(N.value??null),{cancelDraft:z,clearDraft:U,draftHour:E,draftMinute:O,draftPeriod:q,formatTimeObject:G,getFormattedDraft:J,initializeDraft:K,parseTime:Q}=k({appliedTime:w,use24Hour:i(L,"use24Hour")});s(N,e=>{w.value=e??null,K()},{immediate:!0});const R=e=>{let l=e.target.value.replace(/\D/g,"");if(!l)return void(E.value="");let t=parseInt(l,10);L.use24Hour?t>23&&(t=23):(t>12&&(t=12),t<1&&l.length>=2&&(t=1)),E.value=String(t).padStart(l.length>=2?2:l.length,"0")},W=()=>{F.value="hour"},X=()=>{if(F.value=null,E.value&&"0"!==E.value&&"00"!==E.value){const e=parseInt(E.value,10);E.value=String(e).padStart(2,"0")}else E.value=L.use24Hour?"00":"12";te()},Y=e=>{let l=e.target.value.replace(/\D/g,"");if(!l)return void(O.value="");let t=parseInt(l,10);t>59&&(t=59),O.value=String(t).padStart(l.length>=2?2:l.length,"0")},Z=()=>{F.value="minute"},ee=()=>{if(F.value=null,O.value){const e=parseInt(O.value,10);O.value=String(e).padStart(2,"0")}else O.value="00";te()},le=e=>{L.disabled||L.busy||(q.value=e,te())},te=()=>{const e=J();C("time-select",e)};return l({apply:()=>{const e=J();w.value=e,N.value=e},cancel:()=>{z()},draftHour:E,draftMinute:O,draftPeriod:q,getFormattedDraft:J,initializeDraft:K,reset:()=>{U(),w.value=null,N.value=null}}),(l,t)=>(r(),o("div",{class:n([A,e.fluid?`${A}--fluid`:""]),"data-testid":e.testId,style:d(c(S)({color:e.color,theme:c(V)}))},[e.headerLabel?(r(),o("div",{key:0,class:n(`${A}__header`)},[v(c($),{type:c(M).Small,color:c(x).Neutral,medium:""},{default:_(()=>[b(f(e.headerLabel),1)]),_:1},8,["type","color"])],2)):p("",!0),m("div",{class:n(`${A}__controls`)},[m("div",{class:n(`${A}__unit-container`)},[m("div",{class:n([`${A}__box`,"hour"===F.value?`${A}__box--active`:""])},[y(m("input",{"onUpdate:modelValue":t[0]||(t[0]=e=>g(E)?E.value=e:null),type:"text",inputmode:"numeric",maxlength:"2",disabled:e.disabled||e.busy,class:n(`${A}__input`),"aria-label":"Hour input",onInput:R,onFocus:W,onBlur:X},null,42,D),[[h,c(E)]])],2),v(c($),{type:c(M).Small,color:c(x).Neutral,class:n(`${A}__sublabel`)},{default:_(()=>[...t[4]||(t[4]=[b(" Hour ",-1)])]),_:1},8,["type","color","class"])],2),m("div",{class:n(`${A}__separator`)},":",2),m("div",{class:n(`${A}__unit-container`)},[m("div",{class:n([`${A}__box`,"minute"===F.value?`${A}__box--active`:""])},[y(m("input",{"onUpdate:modelValue":t[1]||(t[1]=e=>g(O)?O.value=e:null),type:"text",inputmode:"numeric",maxlength:"2",disabled:e.disabled||e.busy,class:n(`${A}__input`),"aria-label":"Minute input",onInput:Y,onFocus:Z,onBlur:ee},null,42,I),[[h,c(O)]])],2),v(c($),{type:c(M).Small,color:c(x).Neutral,class:n(`${A}__sublabel`)},{default:_(()=>[...t[5]||(t[5]=[b(" Minute ",-1)])]),_:1},8,["type","color","class"])],2),e.use24Hour?p("",!0):(r(),o("div",{key:0,class:n(`${A}__period-toggle`)},[m("button",{type:"button",class:n([`${A}__period-btn`,"AM"===c(q)?`${A}__period-btn--active`:""]),disabled:e.disabled||e.busy,"aria-label":"Select AM",onClick:t[2]||(t[2]=e=>le("AM"))}," AM ",10,T),m("button",{type:"button",class:n([`${A}__period-btn`,"PM"===c(q)?`${A}__period-btn--active`:""]),disabled:e.disabled||e.busy,"aria-label":"Select PM",onClick:t[3]||(t[3]=e=>le("PM"))}," PM ",10,j)],2))],2)],14,P))}});export{B as CLTimePicker,B as default};
+import{defineComponent as e,mergeModels as l,useCssVars as t,ref as a,useModel as u,toRef as i,watch as s,createElementBlock as o,openBlock as r,normalizeStyle as d,normalizeClass as n,unref as c,createCommentVNode as p,createElementVNode as m,createVNode as v,withCtx as _,createTextVNode as b,toDisplayString as f,withDirectives as y,isRef as g,vModelText as h}from"vue";import{_ as $}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-DR2zoTEJ.js";import{b as x,d as M}from"../../../chunks/index-DsloP0ml.js";import{t as S}from"../../../chunks/utils-jYeghjKF.js";import{useTimePicker as k}from"../../../composables/useTimePicker.js";import{useTheme as H}from"../../../composables/useTheme.js";const P=["data-testid"],D=["disabled"],I=["disabled"],T=["disabled"],j=["disabled"],B=/* @__PURE__ */e({name:"CLTimePicker",__name:"CLTimePicker",props:/* @__PURE__ */l({color:{default:x.Primary},disabled:{type:Boolean,default:!1},busy:{type:Boolean,default:!1},fluid:{type:Boolean,default:!1},headerLabel:{default:"Enter time"},testId:{default:"clll-time-picker"},use24Hour:{type:Boolean,default:!1},width:{default:"auto"}},{modelValue:{},modelModifiers:{}}),emits:/* @__PURE__ */l(["time-select"],["update:modelValue"]),setup(e,{expose:l,emit:B}){t(e=>({v6249f3d5:e.width}));const L=e,C=B,V=H(),A="clll-time-picker",F=a(null),N=u(e,"modelValue"),w=a(N.value??null),{cancelDraft:z,clearDraft:U,draftHour:E,draftMinute:O,draftPeriod:q,formatTimeObject:G,getFormattedDraft:J,initializeDraft:K,parseTime:Q}=k({appliedTime:w,use24Hour:i(L,"use24Hour")});s(N,e=>{w.value=e??null,K()},{immediate:!0});const R=e=>{let l=e.target.value.replace(/\D/g,"");if(!l)return void(E.value="");let t=parseInt(l,10);L.use24Hour?t>23&&(t=23):(t>12&&(t=12),t<1&&l.length>=2&&(t=1)),E.value=String(t).padStart(l.length>=2?2:l.length,"0")},W=()=>{F.value="hour"},X=()=>{if(F.value=null,E.value&&"0"!==E.value&&"00"!==E.value){const e=parseInt(E.value,10);E.value=String(e).padStart(2,"0")}else E.value=L.use24Hour?"00":"12";te()},Y=e=>{let l=e.target.value.replace(/\D/g,"");if(!l)return void(O.value="");let t=parseInt(l,10);t>59&&(t=59),O.value=String(t).padStart(l.length>=2?2:l.length,"0")},Z=()=>{F.value="minute"},ee=()=>{if(F.value=null,O.value){const e=parseInt(O.value,10);O.value=String(e).padStart(2,"0")}else O.value="00";te()},le=e=>{L.disabled||L.busy||(q.value=e,te())},te=()=>{const e=J();C("time-select",e)};return l({apply:()=>{const e=J();w.value=e,N.value=e},cancel:()=>{z()},draftHour:E,draftMinute:O,draftPeriod:q,getFormattedDraft:J,initializeDraft:K,reset:()=>{U(),w.value=null,N.value=null}}),(l,t)=>(r(),o("div",{class:n([A,e.fluid?`${A}--fluid`:""]),"data-testid":e.testId,style:d(c(S)({color:e.color,theme:c(V)}))},[e.headerLabel?(r(),o("div",{key:0,class:n(`${A}__header`)},[v(c($),{type:c(M).Small,color:c(x).Neutral,medium:""},{default:_(()=>[b(f(e.headerLabel),1)]),_:1},8,["type","color"])],2)):p("",!0),m("div",{class:n(`${A}__controls`)},[m("div",{class:n(`${A}__unit-container`)},[m("div",{class:n([`${A}__box`,"hour"===F.value?`${A}__box--active`:""])},[y(m("input",{"onUpdate:modelValue":t[0]||(t[0]=e=>g(E)?E.value=e:null),type:"text",inputmode:"numeric",maxlength:"2",disabled:e.disabled||e.busy,class:n(`${A}__input`),"aria-label":"Hour input",onInput:R,onFocus:W,onBlur:X},null,42,D),[[h,c(E)]])],2),v(c($),{type:c(M).Small,color:c(x).Neutral,class:n(`${A}__sublabel`)},{default:_(()=>[...t[4]||(t[4]=[b(" Hour ",-1)])]),_:1},8,["type","color","class"])],2),m("div",{class:n(`${A}__separator`)},":",2),m("div",{class:n(`${A}__unit-container`)},[m("div",{class:n([`${A}__box`,"minute"===F.value?`${A}__box--active`:""])},[y(m("input",{"onUpdate:modelValue":t[1]||(t[1]=e=>g(O)?O.value=e:null),type:"text",inputmode:"numeric",maxlength:"2",disabled:e.disabled||e.busy,class:n(`${A}__input`),"aria-label":"Minute input",onInput:Y,onFocus:Z,onBlur:ee},null,42,I),[[h,c(O)]])],2),v(c($),{type:c(M).Small,color:c(x).Neutral,class:n(`${A}__sublabel`)},{default:_(()=>[...t[5]||(t[5]=[b(" Minute ",-1)])]),_:1},8,["type","color","class"])],2),e.use24Hour?p("",!0):(r(),o("div",{key:0,class:n(`${A}__period-toggle`)},[m("button",{type:"button",class:n([`${A}__period-btn`,"AM"===c(q)?`${A}__period-btn--active`:""]),disabled:e.disabled||e.busy,"aria-label":"Select AM",onClick:t[2]||(t[2]=e=>le("AM"))}," AM ",10,T),m("button",{type:"button",class:n([`${A}__period-btn`,"PM"===c(q)?`${A}__period-btn--active`:""]),disabled:e.disabled||e.busy,"aria-label":"Select PM",onClick:t[3]||(t[3]=e=>le("PM"))}," PM ",10,j)],2))],2)],14,P))}});export{B as CLTimePicker,B as default};

package/dist/components/Form/CLTimePicker/CLTimePicker.vue.d.ts

@@ -38,10 +38,10 @@ declare const _default: import('vue').DefineComponent<{
     "onUpdate:modelValue"?: ((value: string | null) => any) | undefined;
     "onTime-select"?: ((time: string) => any) | undefined;
 }>, {
+    width: string;
     color: CLColors;
     fluid: boolean;
     testId: string;
-    width: string;
     use24Hour: boolean;
     busy: boolean;
     disabled: boolean;

package/dist/components/Form/CLTimePicker/index.d.ts

@@ -19,10 +19,10 @@ export declare const CLTimePicker: import('vue').DefineComponent<{
     "onUpdate:modelValue"?: ((value: string | null) => any) | undefined;
     "onTime-select"?: ((time: string) => any) | undefined;
 }>, {
+    width: string;
     color: import('@codeandfunction/callaloo-tokens').CLColors;
     fluid: boolean;
     testId: string;
-    width: string;
     use24Hour: boolean;
     busy: boolean;
     disabled: boolean;

package/dist/components/Indicators/CLBanner/CLBanner.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLBanner.css';
-import{defineComponent as e,computed as a,createBlock as t,openBlock as o,unref as i,withCtx as s,createElementVNode as n,normalizeStyle as l,normalizeClass as r,createElementBlock as d,createCommentVNode as u,createTextVNode as c,toDisplayString as _,createVNode as b}from"vue";import{_ as y}from"../../../chunks/CLA11yButton.vue_vue_type_style_index_0_lang-BQBmDfM8.js";import{_ as m}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-pE0JrYmS.js";import{_ as f}from"../../../chunks/CLHeading.vue_vue_type_style_index_0_lang-PCOhAZkN.js";import{_ as k}from"../../../chunks/CLSkeleton.vue_vue_type_style_index_0_lang-DAHFJ7wZ.js";import{_ as p}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-CdA4TW0N.js";import{a as v,b as g,i as h,l as $,d as L,c as C,e as x,f as B}from"../../../chunks/index-DsloP0ml.js";import{a as j}from"../../../chunks/utils-D0LERx2k.js";const S=["data-testid"],D=/* @__PURE__ */e({name:"CLBanner",__name:"CLBanner",props:{actionLabel:{},align:{default:h.Left},ariaLabel:{},bordered:{type:Boolean,default:!0},borderRadius:{},busy:{type:Boolean,default:!1},color:{default:g.Neutral},height:{default:"auto"},message:{},onAction:{},onClick:{},onDismiss:{},rounded:{type:Boolean,default:!0},testId:{default:"clll-banner"},title:{},width:{default:"100%"},variant:{default:v.Soft}},setup(e){const g=e,h="clll-banner",D=a(()=>[h,g.actionLabel?`${h}--actionable`:"",g.busy?`${h}--busy`:`${h}--ready`,g.bordered&&g.variant!==v.Ghost?`${h}--bordered`:"",g.borderRadius?`${h}--${g.borderRadius}`:"",g.onDismiss?`${h}--dismissable`:"",`${h}--${g.color}--${g.variant}`,`${h}--align-${g.align}`,g.rounded?`${h}--rounded`:`${h}--box`]);return(a,g)=>(o(),t(i(y),{color:e.color,enabled:!(!e.onClick||!e.ariaLabel),rounded:e.rounded},{default:s(()=>[n("div",{class:r(i(D)),"data-testid":e.testId,style:l({...i(j)({color:e.color,variant:e.variant}),width:e.width,height:e.height})},[n("div",{class:r(`${h}__content`)},[n("div",{class:r(`${h}__nested_content`)},[e.busy?(o(),t(i(k),{key:0,"border-radius":e.borderRadius,height:"28px","test-id":`${h}__skeleton-title`},null,8,["border-radius","test-id"])):u("",!0),e.busy?(o(),t(i(k),{key:1,"border-radius":e.borderRadius,width:"70%",height:"20px","test-id":`${h}__skeleton-message`},null,8,["border-radius","test-id"])):u("",!0),e.title&&!e.busy?(o(),t(i(f),{key:2,align:e.align,color:e.color,type:i($).Section},{default:s(()=>[c(_(e.title),1)]),_:1},8,["align","color","type"])):u("",!0),e.message&&!e.busy?(o(),t(i(p),{key:3,align:e.align,color:e.color,type:i(L).Summary},{default:s(()=>[c(_(e.message),1)]),_:1},8,["align","color","type"])):u("",!0)],2),e.onAction&&e.actionLabel?(o(),d("div",{key:0,class:r(`${h}__action-button`)},[b(i(m),{color:e.color,"border-radius":e.borderRadius,"on-click":e.onAction,"test-id":`${h}__action-button`,variant:e.variant===i(v).Solid?i(v).Soft:i(v).Solid},{default:s(()=>[c(_(e.actionLabel),1)]),_:1},8,["color","border-radius","on-click","test-id","variant"])],2)):u("",!0)],2),e.onDismiss?(o(),d("div",{key:0,class:r(`${h}__dismiss-button`)},[b(i(m),{"aria-label":"Dismiss banner",color:e.color,"icon-before":i(B).Delete,"icon-size":i(x).Tiny,"on-click":e.onDismiss,size:i(C).Tiny,"test-id":`${h}__dismiss-button`,variant:e.variant},null,8,["color","icon-before","icon-size","on-click","size","test-id","variant"])],2)):u("",!0),e.onClick&&e.ariaLabel?(o(),d("button",{key:1,class:"sr-only","data-expand-click-area":"",onClick:g[0]||(g[0]=(...a)=>e.onClick&&e.onClick(...a))},_(e.ariaLabel),1)):u("",!0)],14,S)]),_:1},8,["color","enabled","rounded"]))}});export{D as CLBanner,D as default};
+import{defineComponent as e,computed as a,createBlock as t,openBlock as o,unref as i,withCtx as s,createElementVNode as n,normalizeStyle as l,normalizeClass as r,createElementBlock as d,createCommentVNode as u,createTextVNode as c,toDisplayString as _,createVNode as b}from"vue";import{_ as y}from"../../../chunks/CLA11yButton.vue_vue_type_style_index_0_lang-BQBmDfM8.js";import{_ as m}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-pE0JrYmS.js";import{_ as f}from"../../../chunks/CLHeading.vue_vue_type_style_index_0_lang-CYgxrrIE.js";import{_ as k}from"../../../chunks/CLSkeleton.vue_vue_type_style_index_0_lang-DAHFJ7wZ.js";import{_ as p}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-DR2zoTEJ.js";import{a as v,b as g,i as h,l as $,d as L,c as C,e as x,f as B}from"../../../chunks/index-DsloP0ml.js";import{a as j}from"../../../chunks/utils-D0LERx2k.js";const S=["data-testid"],D=/* @__PURE__ */e({name:"CLBanner",__name:"CLBanner",props:{actionLabel:{},align:{default:h.Left},ariaLabel:{},bordered:{type:Boolean,default:!0},borderRadius:{},busy:{type:Boolean,default:!1},color:{default:g.Neutral},height:{default:"auto"},message:{},onAction:{},onClick:{},onDismiss:{},rounded:{type:Boolean,default:!0},testId:{default:"clll-banner"},title:{},width:{default:"100%"},variant:{default:v.Soft}},setup(e){const g=e,h="clll-banner",D=a(()=>[h,g.actionLabel?`${h}--actionable`:"",g.busy?`${h}--busy`:`${h}--ready`,g.bordered&&g.variant!==v.Ghost?`${h}--bordered`:"",g.borderRadius?`${h}--${g.borderRadius}`:"",g.onDismiss?`${h}--dismissable`:"",`${h}--${g.color}--${g.variant}`,`${h}--align-${g.align}`,g.rounded?`${h}--rounded`:`${h}--box`]);return(a,g)=>(o(),t(i(y),{color:e.color,enabled:!(!e.onClick||!e.ariaLabel),rounded:e.rounded},{default:s(()=>[n("div",{class:r(i(D)),"data-testid":e.testId,style:l({...i(j)({color:e.color,variant:e.variant}),width:e.width,height:e.height})},[n("div",{class:r(`${h}__content`)},[n("div",{class:r(`${h}__nested_content`)},[e.busy?(o(),t(i(k),{key:0,"border-radius":e.borderRadius,height:"28px","test-id":`${h}__skeleton-title`},null,8,["border-radius","test-id"])):u("",!0),e.busy?(o(),t(i(k),{key:1,"border-radius":e.borderRadius,width:"70%",height:"20px","test-id":`${h}__skeleton-message`},null,8,["border-radius","test-id"])):u("",!0),e.title&&!e.busy?(o(),t(i(f),{key:2,align:e.align,color:e.color,type:i($).Section},{default:s(()=>[c(_(e.title),1)]),_:1},8,["align","color","type"])):u("",!0),e.message&&!e.busy?(o(),t(i(p),{key:3,align:e.align,color:e.color,type:i(L).Summary},{default:s(()=>[c(_(e.message),1)]),_:1},8,["align","color","type"])):u("",!0)],2),e.onAction&&e.actionLabel?(o(),d("div",{key:0,class:r(`${h}__action-button`)},[b(i(m),{color:e.color,"border-radius":e.borderRadius,"on-click":e.onAction,"test-id":`${h}__action-button`,variant:e.variant===i(v).Solid?i(v).Soft:i(v).Solid},{default:s(()=>[c(_(e.actionLabel),1)]),_:1},8,["color","border-radius","on-click","test-id","variant"])],2)):u("",!0)],2),e.onDismiss?(o(),d("div",{key:0,class:r(`${h}__dismiss-button`)},[b(i(m),{"aria-label":"Dismiss banner",color:e.color,"icon-before":i(B).Delete,"icon-size":i(x).Tiny,"on-click":e.onDismiss,size:i(C).Tiny,"test-id":`${h}__dismiss-button`,variant:e.variant},null,8,["color","icon-before","icon-size","on-click","size","test-id","variant"])],2)):u("",!0),e.onClick&&e.ariaLabel?(o(),d("button",{key:1,class:"sr-only","data-expand-click-area":"",onClick:g[0]||(g[0]=(...a)=>e.onClick&&e.onClick(...a))},_(e.ariaLabel),1)):u("",!0)],14,S)]),_:1},8,["color","enabled","rounded"]))}});export{D as CLBanner,D as default};

package/dist/components/Indicators/CLBanner/CLBanner.vue.d.ts

@@ -36,12 +36,12 @@ export interface CLBannerProps {
     variant?: CLColorVariants.Ghost | CLColorVariants.Outline | CLColorVariants.Soft | CLColorVariants.Solid;
 }
 declare const _default: import('vue').DefineComponent<CLBannerProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<CLBannerProps> & Readonly<{}>, {
+    width: string;
+    height: string;
     color: CLColors;
     variant: CLColorVariants.Ghost | CLColorVariants.Outline | CLColorVariants.Soft | CLColorVariants.Solid;
     rounded: boolean;
     testId: string;
-    width: string;
-    height: string;
     align: CLAlign;
     busy: boolean;
     bordered: boolean;

package/dist/components/Indicators/CLPill/CLPill.css

@@ -1 +1 @@
-.clll-pill{position:relative;border-radius:0;flex:none;display:inline-flex;align-items:center;box-sizing:border-box;background-color:var(--clll-pill-bg-color, transparent);border-color:var(--clll-pill-border-color, transparent);border-style:var(--clll-pill-border-style, none);border-width:var(--clll-pill-border-width, 0);width:fit-content;overflow:hidden}.clll-pill.clll-pill--rounded .clll-pill__container,.clll-pill.clll-pill--rounded .clll-pill__button{position:relative;overflow:hidden;border-radius:0;flex:none;display:inline-flex;align-items:center;box-sizing:border-box}.clll-pill.clll-pill--rounded{border-radius:var(--clll-pill-theme-radius, var(--clll-rounded-xs))}.clll-pill:not(.clll-pill--rounded){position:relative;overflow:hidden;border-radius:0;flex:none;display:inline-flex;align-items:center;box-sizing:border-box}.clll-pill:not(.clll-pill--rounded) .clll-pill__container,.clll-pill:not(.clll-pill--rounded) .clll-pill__button{position:relative;overflow:hidden;border-radius:0;flex:none;display:inline-flex;align-items:center;box-sizing:border-box}.clll-pill .clll-pill__count{font-family:var(--clll-font-family);-webkit-font-smoothing:antialiased;margin:0;font-size:var(--clll-unit-3);line-height:var(--clll-unit-5);display:block;font-weight:400;padding:var(--clll-py-xs) var(--clll-px-lg);color:var(--clll-pill-text-color, inherit);background-color:var(--clll-pill-count-bg, transparent);border-left-style:var(--clll-pill-count-border-style, none);border-left-color:var(--clll-pill-count-border-color, transparent);border-left-width:var(--clll-pill-count-border-width, 0)}.clll-pill .clll-text{padding:var(--clll-py-xs) var(--clll-px-lg);color:var(--clll-pill-text-color, inherit);background-color:var(--clll-pill-bg-color, transparent)}.clll-pill .clll-icon{color:var(--clll-pill-text-color, inherit);background-color:var(--clll-pill-bg-color, transparent)}.clll-pill.clll-pill--has-count .clll-pill__container>:not([hidden])~:not([hidden]),.clll-pill.clll-pill--has-count .clll-pill__button>:not([hidden])~:not([hidden]){margin-left:var(--clll-unit-1)}.clll-pill.clll-pill--has-count .clll-pill__container .clll-text,.clll-pill.clll-pill--has-count .clll-pill__button .clll-text{padding-right:var(--clll-px-sm)}.clll-pill.clll-pill--has-icon .clll-pill__container,.clll-pill.clll-pill--has-icon .clll-pill__button,.clll-pill.clll-pill--has-icon .clll-pill__container .clll-text,.clll-pill.clll-pill--has-icon .clll-pill__button .clll-text{padding-left:var(--clll-px-xs)}.clll-pill.clll-pill--dismissable .clll-pill__button{padding-right:var(--clll-px-sm)}.clll-pill .clll-pill__button .clll-text,.clll-pill .clll-pill__button .clll-icon{background-color:transparent}.clll-pill.clll-pill--elevated{box-shadow:0 0 var(--clll-unit-3) var(--clll-unit-0_5) #0000001f,0 0 var(--clll-unit-1) var(--clll-unit-0_5) #00000005}
+.clll-pill{position:relative;border-radius:0;flex:none;display:inline-flex;align-items:center;box-sizing:border-box;background-color:var(--clll-pill-bg-color, transparent);border-color:var(--clll-pill-border-color, transparent);border-style:var(--clll-pill-border-style, none);border-width:var(--clll-pill-border-width, 0);width:fit-content;overflow:hidden}.clll-pill.clll-pill--rounded .clll-pill__container,.clll-pill.clll-pill--rounded .clll-pill__button{position:relative;overflow:hidden;border-radius:0;flex:none;display:inline-flex;align-items:center;box-sizing:border-box}.clll-pill.clll-pill--rounded{border-radius:var(--clll-pill-theme-radius, var(--clll-rounded-xs))}.clll-pill:not(.clll-pill--rounded){position:relative;overflow:hidden;border-radius:0;flex:none;display:inline-flex;align-items:center;box-sizing:border-box}.clll-pill:not(.clll-pill--rounded) .clll-pill__container,.clll-pill:not(.clll-pill--rounded) .clll-pill__button{position:relative;overflow:hidden;border-radius:0;flex:none;display:inline-flex;align-items:center;box-sizing:border-box}.clll-pill .clll-pill__count{font-family:var(--clll-font-family);-webkit-font-smoothing:antialiased;margin:0;font-size:var(--clll-unit-3);line-height:var(--clll-unit-5);display:block;font-weight:400;padding:var(--clll-py-xs) var(--clll-px-lg);color:var(--clll-pill-text-color, inherit);background-color:var(--clll-pill-count-bg, transparent);border-left-style:var(--clll-pill-count-border-style, none);border-left-color:var(--clll-pill-count-border-color, transparent);border-left-width:var(--clll-pill-count-border-width, 0)}.clll-pill .clll-text{padding:var(--clll-py-xs) var(--clll-px-lg);color:var(--clll-pill-text-color, inherit);background-color:var(--clll-pill-bg-color, transparent)}.clll-pill .clll-icon{color:var(--clll-pill-text-color, inherit);background-color:var(--clll-pill-bg-color, transparent)}.clll-pill.clll-pill--has-count .clll-pill__container>:not([hidden])~:not([hidden]),.clll-pill.clll-pill--has-count .clll-pill__button>:not([hidden])~:not([hidden]){margin-left:var(--clll-unit-1)}.clll-pill.clll-pill--has-count .clll-pill__container .clll-text,.clll-pill.clll-pill--has-count .clll-pill__button .clll-text{padding-right:var(--clll-px-sm)}.clll-pill.clll-pill--has-icon .clll-pill__container,.clll-pill.clll-pill--has-icon .clll-pill__button,.clll-pill.clll-pill--has-icon .clll-pill__container .clll-text,.clll-pill.clll-pill--has-icon .clll-pill__button .clll-text{padding-left:var(--clll-px-xs)}.clll-pill.clll-pill--dismissable .clll-pill__button{padding-right:var(--clll-px-sm)}.clll-pill.clll-pill--dismissable .clll-pill__button .clll-text{padding-right:var(--clll-px-xs)}.clll-pill .clll-pill__button .clll-text,.clll-pill .clll-pill__button .clll-icon{background-color:transparent}.clll-pill.clll-pill--elevated{box-shadow:0 0 var(--clll-unit-3) var(--clll-unit-0_5) #0000001f,0 0 var(--clll-unit-1) var(--clll-unit-0_5) #00000005}

package/dist/components/Indicators/CLPill/CLPill.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLPill.css';
-import{_ as e}from"../../../chunks/CLPill.vue_vue_type_style_index_0_lang-BjrbTAI3.js";export{e as CLPill,e as default};
+import{_ as e}from"../../../chunks/CLPill.vue_vue_type_style_index_0_lang-CY8F0FJJ.js";export{e as CLPill,e as default};

package/dist/components/Indicators/CLProgress/CLProgress.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLProgress.css';
-import{defineComponent as e,mergeModels as s,useModel as t,computed as l,createElementBlock as o,openBlock as a,normalizeStyle as r,normalizeClass as d,unref as u,createCommentVNode as i,createElementVNode as n,createVNode as m,withCtx as c,createTextVNode as _,toDisplayString as p}from"vue";import{_ as f}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-CdA4TW0N.js";import{d as v,b as y,c as $}from"../../../chunks/index-DsloP0ml.js";import{c as g}from"../../../chunks/utils-D0LERx2k.js";import{useTheme as b}from"../../../composables/useTheme.js";const h=["data-testid"],j=/* @__PURE__ */e({name:"CLProgress",__name:"CLProgress",props:/* @__PURE__ */s({color:{default:y.Primary},inverted:{type:Boolean,default:!1},rounded:{type:Boolean,default:!0},size:{default:$.Medium},status:{type:Boolean,default:!1},testId:{default:"clll-progress"}},{modelValue:{type:Number,default:0},modelModifiers:{}}),emits:["update:modelValue"],setup(e){const s=e,$=b(),j=t(e,"modelValue"),k="clll-progress",x=l(()=>[k,`${k}--${s.color}`,`${k}--${s.size}`,s.inverted?`${k}--inverted`:"",s.rounded?`${k}--rounded`:`${k}--not-rounded`]),C=l(()=>`${j.value}%`);return(s,t)=>(a(),o("div",{class:d(u(x)),"data-testid":e.testId,style:r({...u(g)({color:e.color,theme:u($)}),"--clll-progress-value":j.value})},[e.status?(a(),o("div",{key:0,class:d(`${k}__status__container`)},[n("div",{class:d(`${k}__status__label`)},[m(u(f),{color:u(y).Neutral,type:u(v).Summary},{default:c(()=>[_(p(u(C)),1)]),_:1},8,["color","type"])],2)],2)):i("",!0),n("div",{class:d(`${k}__bar-container`)},[n("div",{class:d(`${k}__bar`)},null,2)],2)],14,h))}});export{j as CLProgress,j as default};
+import{defineComponent as e,mergeModels as s,useModel as t,computed as l,createElementBlock as o,openBlock as a,normalizeStyle as r,normalizeClass as d,unref as u,createCommentVNode as i,createElementVNode as n,createVNode as m,withCtx as c,createTextVNode as _,toDisplayString as p}from"vue";import{_ as f}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-DR2zoTEJ.js";import{d as v,b as y,c as $}from"../../../chunks/index-DsloP0ml.js";import{c as g}from"../../../chunks/utils-D0LERx2k.js";import{useTheme as b}from"../../../composables/useTheme.js";const h=["data-testid"],j=/* @__PURE__ */e({name:"CLProgress",__name:"CLProgress",props:/* @__PURE__ */s({color:{default:y.Primary},inverted:{type:Boolean,default:!1},rounded:{type:Boolean,default:!0},size:{default:$.Medium},status:{type:Boolean,default:!1},testId:{default:"clll-progress"}},{modelValue:{type:Number,default:0},modelModifiers:{}}),emits:["update:modelValue"],setup(e){const s=e,$=b(),j=t(e,"modelValue"),k="clll-progress",x=l(()=>[k,`${k}--${s.color}`,`${k}--${s.size}`,s.inverted?`${k}--inverted`:"",s.rounded?`${k}--rounded`:`${k}--not-rounded`]),C=l(()=>`${j.value}%`);return(s,t)=>(a(),o("div",{class:d(u(x)),"data-testid":e.testId,style:r({...u(g)({color:e.color,theme:u($)}),"--clll-progress-value":j.value})},[e.status?(a(),o("div",{key:0,class:d(`${k}__status__container`)},[n("div",{class:d(`${k}__status__label`)},[m(u(f),{color:u(y).Neutral,type:u(v).Summary},{default:c(()=>[_(p(u(C)),1)]),_:1},8,["color","type"])],2)],2)):i("",!0),n("div",{class:d(`${k}__bar-container`)},[n("div",{class:d(`${k}__bar`)},null,2)],2)],14,h))}});export{j as CLProgress,j as default};

package/dist/components/Loading/CLSkeleton/CLSkeleton.vue.d.ts

@@ -12,9 +12,9 @@ export interface CLSkeletonProps {
     width?: string;
 }
 declare const _default: import('vue').DefineComponent<CLSkeletonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<CLSkeletonProps> & Readonly<{}>, {
-    rounded: boolean;
-    testId: string;
     width: string;
     height: string;
+    rounded: boolean;
+    testId: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

package/dist/components/Modals/CLModal/CLModal.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLModal.css';
-import{_ as a}from"../../../chunks/CLModal.vue_vue_type_style_index_0_lang-DLUfvRC_.js";export{a as CLModal,a as default};
+import{_ as a}from"../../../chunks/CLModal.vue_vue_type_style_index_0_lang-DFQqYIGs.js";export{a as CLModal,a as default};

package/dist/components/Modals/CLModal/CLModal.vue.d.ts

@@ -38,9 +38,9 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<CL
     "onModal-open"?: (() => any) | undefined;
     "onModal-close"?: (() => any) | undefined;
 }>, {
+    title: string;
     close: boolean;
     testId: string;
-    title: string;
     borderRadius: CLBorderRadius;
     overlay: boolean;
     dismissible: boolean;