@codeandfunction/callaloo 4.11.0 → 4.12.0

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

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLBanner.css';
-import{defineComponent as e,computed as t,createBlock as o,openBlock as a,unref as i,withCtx as n,createElementVNode as s,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-BHF3fJsf.js";import{_ as m}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-CqwRXex5.js";import{_ as f}from"../../../chunks/CLHeading.vue_vue_type_style_index_0_lang-CsmrsD6c.js";import{_ as k}from"../../../chunks/CLSkeleton.vue_vue_type_style_index_0_lang-BmjT9fQ_.js";import{_ as p}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-CMXJdE-D.js";import{CLColorVariants as v,CLColors as g,CLAlign as $,CLHeadingTypes as h,CLTextTypes as L,CLSizes as C,CLIconSizes as x,CLIconNames as B}from"../../../index.js";import{a as j}from"../../../chunks/utils-CCWSWRuR.js";const S=["data-testid"],D=/* @__PURE__ */e({name:"CLBanner",__name:"CLBanner",props:{actionLabel:{},align:{default:$.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,$="clll-banner",D=t(()=>[$,g.actionLabel?`${$}--actionable`:"",g.busy?`${$}--busy`:`${$}--ready`,g.bordered&&g.variant!==v.Ghost?`${$}--bordered`:"",g.borderRadius?`${$}--${g.borderRadius}`:"",g.onDismiss?`${$}--dismissable`:"",`${$}--${g.color}--${g.variant}`,`${$}--align-${g.align}`,g.rounded?`${$}--rounded`:`${$}--box`]);return(t,g)=>(a(),o(i(y),{color:e.color,enabled:!(!e.onClick||!e.ariaLabel),rounded:e.rounded},{default:n(()=>[s("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})},[s("div",{class:r(`${$}__content`)},[s("div",{class:r(`${$}__nested_content`)},[e.busy?(a(),o(i(k),{key:0,"border-radius":e.borderRadius,height:"28px","test-id":`${$}__skeleton-title`},null,8,["border-radius","test-id"])):u("",!0),e.busy?(a(),o(i(k),{key:1,"border-radius":e.borderRadius,width:"70%",height:"20px","test-id":`${$}__skeleton-message`},null,8,["border-radius","test-id"])):u("",!0),e.title&&!e.busy?(a(),o(i(f),{key:2,align:e.align,color:e.color,type:i(h).Section},{default:n(()=>[c(_(e.title),1)]),_:1},8,["align","color","type"])):u("",!0),e.message&&!e.busy?(a(),o(i(p),{key:3,align:e.align,color:e.color,type:i(L).Summary},{default:n(()=>[c(_(e.message),1)]),_:1},8,["align","color","type"])):u("",!0)],2),e.onAction&&e.actionLabel?(a(),d("div",{key:0,class:r(`${$}__action-button`)},[b(i(m),{color:e.color,"border-radius":e.borderRadius,"on-click":e.onAction,"test-id":`${$}__action-button`,variant:e.variant===i(v).Solid?i(v).Soft:i(v).Solid},{default:n(()=>[c(_(e.actionLabel),1)]),_:1},8,["color","border-radius","on-click","test-id","variant"])],2)):u("",!0)],2),e.onDismiss?(a(),d("div",{key:0,class:r(`${$}__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":`${$}__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?(a(),d("button",{key:1,class:"sr-only","data-expand-click-area":"",onClick:g[0]||(g[0]=(...t)=>e.onClick&&e.onClick(...t))},_(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 t,createBlock as o,openBlock as a,unref as i,withCtx as n,createElementVNode as s,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-RwSPgx8U.js";import{_ as m}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-Bi7GC71m.js";import{_ as p}from"../../../chunks/CLHeading.vue_vue_type_style_index_0_lang-C7RHX0J4.js";import{_ as f}from"../../../chunks/CLSkeleton.vue_vue_type_style_index_0_lang-BtFHeFjp.js";import{_ as k}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-Tv0xzrRz.js";import{CLColorVariants as v,CLColors as g,CLAlign as $,CLHeadingTypes as h,CLTextTypes as L,CLSizes as C,CLIconSizes as x,CLIconNames as B}from"../../../index.js";import{a as j}from"../../../chunks/utils-DfgurNgA.js";const S=["data-testid"],D=/* @__PURE__ */e({name:"CLBanner",__name:"CLBanner",props:{actionLabel:{},align:{default:$.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,$="clll-banner",D=t(()=>[$,g.actionLabel?`${$}--actionable`:"",g.busy?`${$}--busy`:`${$}--ready`,g.bordered&&g.variant!==v.Ghost?`${$}--bordered`:"",g.borderRadius?`${$}--${g.borderRadius}`:"",g.onDismiss?`${$}--dismissable`:"",`${$}--${g.color}--${g.variant}`,`${$}--align-${g.align}`,g.rounded?`${$}--rounded`:`${$}--box`]);return(t,g)=>(a(),o(i(y),{color:e.color,enabled:!(!e.onClick||!e.ariaLabel),rounded:e.rounded},{default:n(()=>[s("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})},[s("div",{class:r(`${$}__content`)},[s("div",{class:r(`${$}__nested_content`)},[e.busy?(a(),o(i(f),{key:0,"border-radius":e.borderRadius,height:"28px","test-id":`${$}__skeleton-title`},null,8,["border-radius","test-id"])):u("",!0),e.busy?(a(),o(i(f),{key:1,"border-radius":e.borderRadius,width:"70%",height:"20px","test-id":`${$}__skeleton-message`},null,8,["border-radius","test-id"])):u("",!0),e.title&&!e.busy?(a(),o(i(p),{key:2,align:e.align,color:e.color,type:i(h).Section},{default:n(()=>[c(_(e.title),1)]),_:1},8,["align","color","type"])):u("",!0),e.message&&!e.busy?(a(),o(i(k),{key:3,align:e.align,color:e.color,type:i(L).Summary},{default:n(()=>[c(_(e.message),1)]),_:1},8,["align","color","type"])):u("",!0)],2),e.onAction&&e.actionLabel?(a(),d("div",{key:0,class:r(`${$}__action-button`)},[b(i(m),{color:e.color,"border-radius":e.borderRadius,"on-click":e.onAction,"test-id":`${$}__action-button`,variant:e.variant===i(v).Solid?i(v).Soft:i(v).Solid},{default:n(()=>[c(_(e.actionLabel),1)]),_:1},8,["color","border-radius","on-click","test-id","variant"])],2)):u("",!0)],2),e.onDismiss?(a(),d("div",{key:0,class:r(`${$}__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":`${$}__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?(a(),d("button",{key:1,class:"sr-only","data-expand-click-area":"",onClick:g[0]||(g[0]=(...t)=>e.onClick&&e.onClick(...t))},_(e.ariaLabel),1)):u("",!0)],14,S)]),_:1},8,["color","enabled","rounded"]))}});export{D as CLBanner,D as default};

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-md);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-sm) 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-s-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{transition-property:all;transition-duration:.3s;transition-timing-function:ease}.clll-pill .clll-pill__button:hover{background-color:var(--clll-pill-hover-bg, 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-sm) 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-sm) 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}

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-B7EJOOmg.js";export{e as CLPill,e as default};
+import{_ as e}from"../../../chunks/CLPill.vue_vue_type_style_index_0_lang-BSi1ljPG.js";export{e as CLPill,e as default};

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

@@ -30,7 +30,7 @@ declare const _default: import('vue').DefineComponent<CLPillProps, {}, {}, {}, {
     variant: CLColorVariants;
     rounded: boolean;
     testId: string;
-    elevated: boolean;
     iconFilled: boolean;
+    elevated: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _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 t,useModel as s,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 _,withCtx as c,createTextVNode as m,toDisplayString as p}from"vue";import{_ as f}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-CMXJdE-D.js";import{CLTextTypes as v,CLColors as y,CLSizes as $}from"../../../index.js";import{c as g}from"../../../chunks/utils-CCWSWRuR.js";const b=["data-testid"],x=/* @__PURE__ */e({name:"CLProgress",__name:"CLProgress",props:/* @__PURE__ */t({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 t=e,$=s(e,"modelValue"),x="clll-progress",C=l(()=>[x,`${x}--${t.color}`,`${x}--${t.size}`,t.inverted?`${x}--inverted`:"",t.rounded?`${x}--rounded`:`${x}--not-rounded`]),L=l(()=>`${$.value}%`);return(t,s)=>(a(),o("div",{class:d(u(C)),"data-testid":e.testId,style:r({...u(g)({color:e.color}),"--clll-progress-value":$.value})},[e.status?(a(),o("div",{key:0,class:d(`${x}__status__container`)},[n("div",{class:d(`${x}__status__label`)},[_(u(f),{color:u(y).Neutral,type:u(v).Summary},{default:c(()=>[m(p(u(L)),1)]),_:1},8,["color","type"])],2)],2)):i("",!0),n("div",{class:d(`${x}__bar-container`)},[n("div",{class:d(`${x}__bar`)},null,2)],2)],14,b))}});export{x as CLProgress,x as default};
+import{defineComponent as e,mergeModels as s,useModel as t,computed as l,createElementBlock as o,openBlock as r,normalizeStyle as a,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-Tv0xzrRz.js";import{CLTextTypes as v,CLColors as y,CLSizes as $}from"../../../index.js";import{c as g}from"../../../chunks/utils-DfgurNgA.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"),x="clll-progress",C=l(()=>[x,`${x}--${s.color}`,`${x}--${s.size}`,s.inverted?`${x}--inverted`:"",s.rounded?`${x}--rounded`:`${x}--not-rounded`]),L=l(()=>`${j.value}%`);return(s,t)=>(r(),o("div",{class:d(u(C)),"data-testid":e.testId,style:a({...u(g)({color:e.color,theme:u($)}),"--clll-progress-value":j.value})},[e.status?(r(),o("div",{key:0,class:d(`${x}__status__container`)},[n("div",{class:d(`${x}__status__label`)},[m(u(f),{color:u(y).Neutral,type:u(v).Summary},{default:c(()=>[_(p(u(L)),1)]),_:1},8,["color","type"])],2)],2)):i("",!0),n("div",{class:d(`${x}__bar-container`)},[n("div",{class:d(`${x}__bar`)},null,2)],2)],14,h))}});export{j as CLProgress,j as default};

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

@@ -23,9 +23,9 @@ declare const _default: import('vue').DefineComponent<{
     "onUpdate:modelValue"?: ((value: number) => any) | undefined;
 }>, {
     color: CLColors;
+    size: CLSizes;
     rounded: boolean;
     testId: string;
-    size: CLSizes;
     status: boolean;
     inverted: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;

package/dist/components/Indicators/utils.d.ts

@@ -1,7 +1,13 @@
-import { CLColors, CLColorVariants } from '../../index.ts';
+import { Ref } from 'vue';
+import { CLColors, CLColorVariants, CLPalette } from '../../index.ts';
+interface ThemeContext {
+    colors: Ref<CLPalette>;
+    darkMode: Ref<boolean | undefined>;
+}
 interface ThemeProps {
     color: CLColors;
     variant: CLColorVariants;
+    theme?: ThemeContext;
 }
 export declare const badgeTheme: ({ color, variant }: ThemeProps) => {
     '--clll-badge-bg-color': string;
@@ -30,7 +36,7 @@ export declare const pillTheme: ({ color, variant }: ThemeProps) => {
     '--clll-pill-count-border-width': string;
     '--clll-pill-theme-radius': string;
 };
-export declare const progressTheme: ({ color }: Omit<ThemeProps, "variant">) => {
+export declare const progressTheme: ({ color, theme }: Omit<ThemeProps, "variant">) => {
     '--clll-progress-container-bg': string;
     '--clll-progress-bar-bg': string;
 };

package/dist/components/Loading/CLSkeleton/CLSkeleton.js

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

package/dist/components/Loading/CLSpinner/CLSpinner.js

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

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

@@ -13,9 +13,9 @@ export interface CLSpinnerProps {
 }
 declare const _default: import('vue').DefineComponent<CLSpinnerProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<CLSpinnerProps> & Readonly<{}>, {
     color: CLColors;
-    testId: string;
     size: CLSizes;
-    align: CLAlign;
+    testId: string;
     position: CLPosition;
+    align: CLAlign;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

package/dist/components/Loading/utils.d.ts

@@ -1,12 +1,18 @@
-import { CLColors } from '../../index.ts';
+import { Ref } from 'vue';
+import { CLColors, CLPalette } from '../../index.ts';
+interface ThemeContext {
+    colors: Ref<CLPalette>;
+    darkMode: Ref<boolean | undefined>;
+}
 interface ThemeProps {
     color: CLColors;
+    theme?: ThemeContext;
 }
-export declare const skeletonTheme: () => {
+export declare const skeletonTheme: (theme?: ThemeContext) => {
     '--clll-skeleton-bg-color': string;
     '--clll-skeleton-theme-radius': string;
 };
-export declare const spinnerTheme: ({ color }: ThemeProps) => {
+export declare const spinnerTheme: ({ color, theme }: ThemeProps) => {
     '--clll-spinner-color': string;
 };
 export {};

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-wrr29HDF.js";export{a as CLModal,a as default};
+import{_ as a}from"../../../chunks/CLModal.vue_vue_type_style_index_0_lang-CWceRHGW.js";export{a as CLModal,a as default};

package/dist/components/Modals/CLModalDatePicker/CLModalDatePicker.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLModalDatePicker.css';
-import{defineComponent as e,mergeModels as a,ref as t,computed as l,useModel as o,onMounted as d,onBeforeUnmount as i,createElementBlock as u,openBlock as n,normalizeClass as r,unref as s,createVNode as b,withCtx as c,createTextVNode as f,toDisplayString as p,createElementVNode as v,nextTick as m}from"vue";import{_ as y}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-CqwRXex5.js";import{_}from"../../../chunks/CLModal.vue_vue_type_style_index_0_lang-wrr29HDF.js";import{_ as L}from"../../../chunks/CLCalendar.vue_vue_type_style_index_0_lang-US_3N22Q.js";import{CLSizes as X,CLIconSizes as g,CLIconNames as k,CLBorderRadius as $,CLColorVariants as h,CLColors as C}from"../../../index.js";import{i as w}from"../../../chunks/helper-C542dSLs.js";import{useDatePicker as R}from"../../../composables/useDatePicker.js";const S=["data-testid"],B=/* @__PURE__ */e({name:"CLModalDatePicker",__name:"CLModalDatePicker",props:/* @__PURE__ */a({buttonAriaLabel:{default:void 0},buttonBorderRadius:{default:void 0},buttonColor:{default:C.Primary},buttonLabel:{default:"Select dates"},buttonSize:{default:X.Small},buttonVariant:{default:h.Soft},buttonWidth:{default:"auto"},buttonWrapped:{type:Boolean,default:!1},busy:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},fluid:{type:Boolean,default:!1},id:{},isRange:{type:Boolean,default:!0},onBlur:{type:Function,default:void 0},onChange:{type:Function,default:void 0},onFocus:{type:Function,default:void 0},onReset:{},testId:{default:"clll-date-picker-modal"},title:{default:"Select dates"}},{modelValue:{default:()=>({end:null,start:null})},modelModifiers:{}}),emits:["update:modelValue"],setup(e){const a=e,B="clll-date-picker-modal",z=t(!1),V=l(()=>`date-picker-modal-${a.id}`),x=t(),M=o(e,"modelValue"),{rangeLabel:E}=R({appliedStart:l(()=>M.value?.start??null),appliedEnd:l(()=>M.value?.end??null),isRange:a.isRange}),F=t(!1),j=()=>{w&&(F.value=window.innerWidth<480)},P=()=>{if(a.disabled||a.busy)return;j(),z.value=!0,m(()=>{x.value?.initializeDraft()});const e=new FocusEvent("focus",{bubbles:!0,cancelable:!0});a.onFocus?.(e)},D=()=>{z.value=!1,x.value?.cancel();const e=new FocusEvent("blur",{bubbles:!0,cancelable:!0});a.onBlur?.(e)},W=()=>{x.value?.apply(),z.value=!1,a.onChange?.()},A=()=>{x.value?.reset(),a.onReset?.()},I=l(()=>F.value);d(()=>{w&&(j(),window.addEventListener("resize",j))}),i(()=>{w&&window.removeEventListener("resize",j)});const N={[X.Tiny]:g.Tiny,[X.Small]:g.Small,[X.Medium]:g.Medium,[X.Large]:g.Large,[X.XL]:g.XL,[X.XXL]:g.XXL,[X.XXXL]:g.XXXL,[X.XXXXL]:g.XXXXL},G=l(()=>[B,a.buttonBorderRadius?`${B}--${a.buttonBorderRadius}`:"",a.busy?`${B}--busy`:`${B}--ready`,`${B}--${a.buttonColor}`,`${B}--${a.buttonSize}`,`${B}--${a.buttonVariant}`,a.disabled||a.busy?`${B}--disabled`:`${B}--active`,a.fluid?`${B}--fluid`:`${B}--fixed`]),T=l(()=>{const e=x.value?.draftStart,t=x.value?.draftEnd;return a.isRange?!!e&&!!t:!!e});return(a,t)=>(n(),u("div",{class:r(s(G)),"data-testid":e.testId},[b(s(y),{"aria-label":e.buttonAriaLabel||"Open date picker","border-radius":e.buttonBorderRadius,busy:e.busy,color:e.buttonColor,disabled:e.disabled||e.busy,"icon-before":s(k).Calendar,"icon-size":N[e.buttonSize],"on-click":P,"test-id":`${e.testId}__trigger`,size:e.buttonSize,variant:e.buttonVariant,width:e.buttonWidth,wrap:e.buttonWrapped},{default:c(()=>[f(p(s(E)||e.buttonLabel),1)]),_:1},8,["aria-label","border-radius","busy","color","disabled","icon-before","icon-size","test-id","size","variant","width","wrap"]),b(s(_),{"border-radius":s(I)?s($).None:s($).Medium,fullscreen:s(I),"is-open":s(z),"max-width":"336px","modal-id":s(V),"on-close":D,title:e.title},{body:c(()=>[b(s(L),{ref_key:"calendarRef",ref:x,modelValue:M.value,"onUpdate:modelValue":t[0]||(t[0]=e=>M.value=e),busy:e.busy,disabled:e.disabled,fluid:s(I),"is-range":e.isRange},null,8,["modelValue","busy","disabled","fluid","is-range"])]),footer:c(()=>[v("div",{class:r(`${B}__footer-actions`)},[b(s(y),{color:s(C).Neutral,"on-click":D,variant:s(h).Ghost},{default:c(()=>[...t[1]||(t[1]=[f(" Cancel ",-1)])]),_:1},8,["color","variant"]),v("div",{class:r(`${B}__footer-right`)},[b(s(y),{color:s(C).Neutral,disabled:!s(x)?.draftStart&&!s(x)?.draftEnd,"on-click":A,variant:s(h).Ghost},{default:c(()=>[...t[2]||(t[2]=[f(" Reset ",-1)])]),_:1},8,["color","disabled","variant"]),b(s(y),{color:s(C).Primary,disabled:!s(T),"on-click":W},{default:c(()=>[...t[3]||(t[3]=[f(" Apply ",-1)])]),_:1},8,["color","disabled"])],2)],2)]),_:1},8,["border-radius","fullscreen","is-open","modal-id","title"])],10,S))}});export{B as CLModalDatePicker,B as default};
+import{defineComponent as e,mergeModels as a,ref as t,computed as l,useModel as o,onMounted as d,onBeforeUnmount as i,createElementBlock as u,openBlock as n,normalizeClass as r,unref as s,createVNode as b,withCtx as c,createTextVNode as f,toDisplayString as p,createElementVNode as v,nextTick as m}from"vue";import{_ as y}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-Bi7GC71m.js";import{_}from"../../../chunks/CLModal.vue_vue_type_style_index_0_lang-CWceRHGW.js";import{_ as L}from"../../../chunks/CLCalendar.vue_vue_type_style_index_0_lang-BxZBofc_.js";import{CLSizes as X,CLIconSizes as g,CLIconNames as $,CLBorderRadius as k,CLColorVariants as h,CLColors as C}from"../../../index.js";import{i as w}from"../../../chunks/helper-C542dSLs.js";import{useDatePicker as R}from"../../../composables/useDatePicker.js";const S=["data-testid"],B=/* @__PURE__ */e({name:"CLModalDatePicker",__name:"CLModalDatePicker",props:/* @__PURE__ */a({buttonAriaLabel:{default:void 0},buttonBorderRadius:{default:void 0},buttonColor:{default:C.Primary},buttonLabel:{default:"Select dates"},buttonSize:{default:X.Small},buttonVariant:{default:h.Soft},buttonWidth:{default:"auto"},buttonWrapped:{type:Boolean,default:!1},busy:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},fluid:{type:Boolean,default:!1},id:{},isRange:{type:Boolean,default:!0},onBlur:{type:Function,default:void 0},onChange:{type:Function,default:void 0},onFocus:{type:Function,default:void 0},onReset:{},testId:{default:"clll-date-picker-modal"},title:{default:"Select dates"}},{modelValue:{default:()=>({end:null,start:null})},modelModifiers:{}}),emits:["update:modelValue"],setup(e){const a=e,B="clll-date-picker-modal",z=t(!1),V=l(()=>`date-picker-modal-${a.id}`),x=t(),M=o(e,"modelValue"),{rangeLabel:E}=R({appliedStart:l(()=>M.value?.start??null),appliedEnd:l(()=>M.value?.end??null),isRange:a.isRange}),F=t(!1),j=()=>{w&&(F.value=window.innerWidth<480)},P=()=>{if(a.disabled||a.busy)return;j(),z.value=!0,m(()=>{x.value?.initializeDraft()});const e=new FocusEvent("focus",{bubbles:!0,cancelable:!0});a.onFocus?.(e)},D=()=>{z.value=!1,x.value?.cancel();const e=new FocusEvent("blur",{bubbles:!0,cancelable:!0});a.onBlur?.(e)},W=()=>{x.value?.apply(),z.value=!1,a.onChange?.()},A=()=>{x.value?.reset(),a.onReset?.()},I=l(()=>F.value);d(()=>{w&&(j(),window.addEventListener("resize",j))}),i(()=>{w&&window.removeEventListener("resize",j)});const N={[X.Tiny]:g.Tiny,[X.Small]:g.Small,[X.Medium]:g.Medium,[X.Large]:g.Large,[X.XL]:g.XL,[X.XXL]:g.XXL,[X.XXXL]:g.XXXL,[X.XXXXL]:g.XXXXL},G=l(()=>[B,a.buttonBorderRadius?`${B}--${a.buttonBorderRadius}`:"",a.busy?`${B}--busy`:`${B}--ready`,`${B}--${a.buttonColor}`,`${B}--${a.buttonSize}`,`${B}--${a.buttonVariant}`,a.disabled||a.busy?`${B}--disabled`:`${B}--active`,a.fluid?`${B}--fluid`:`${B}--fixed`]),T=l(()=>{const e=x.value?.draftStart,t=x.value?.draftEnd;return a.isRange?!!e&&!!t:!!e});return(a,t)=>(n(),u("div",{class:r(s(G)),"data-testid":e.testId},[b(s(y),{"aria-label":e.buttonAriaLabel||"Open date picker","border-radius":e.buttonBorderRadius,busy:e.busy,color:e.buttonColor,disabled:e.disabled||e.busy,"icon-before":s($).Calendar,"icon-size":N[e.buttonSize],"on-click":P,"test-id":`${e.testId}__trigger`,size:e.buttonSize,variant:e.buttonVariant,width:e.buttonWidth,wrap:e.buttonWrapped},{default:c(()=>[f(p(s(E)||e.buttonLabel),1)]),_:1},8,["aria-label","border-radius","busy","color","disabled","icon-before","icon-size","test-id","size","variant","width","wrap"]),b(s(_),{"border-radius":s(I)?s(k).None:s(k).Medium,fullscreen:s(I),"is-open":s(z),"max-width":"336px","modal-id":s(V),"on-close":D,title:e.title},{body:c(()=>[b(s(L),{ref_key:"calendarRef",ref:x,modelValue:M.value,"onUpdate:modelValue":t[0]||(t[0]=e=>M.value=e),busy:e.busy,disabled:e.disabled,fluid:s(I),"is-range":e.isRange},null,8,["modelValue","busy","disabled","fluid","is-range"])]),footer:c(()=>[v("div",{class:r(`${B}__footer-actions`)},[b(s(y),{color:s(C).Neutral,"on-click":D,variant:s(h).Ghost},{default:c(()=>[...t[1]||(t[1]=[f(" Cancel ",-1)])]),_:1},8,["color","variant"]),v("div",{class:r(`${B}__footer-right`)},[b(s(y),{color:s(C).Neutral,disabled:!s(x)?.draftStart&&!s(x)?.draftEnd,"on-click":A,variant:s(h).Ghost},{default:c(()=>[...t[2]||(t[2]=[f(" Reset ",-1)])]),_:1},8,["color","disabled","variant"]),b(s(y),{color:s(C).Primary,disabled:!s(T),"on-click":W},{default:c(()=>[...t[3]||(t[3]=[f(" Apply ",-1)])]),_:1},8,["color","disabled"])],2)],2)]),_:1},8,["border-radius","fullscreen","is-open","modal-id","title"])],10,S))}});export{B as CLModalDatePicker,B as default};

package/dist/components/Modals/utils.d.ts

@@ -1,5 +1,12 @@
-export declare const modalTheme: () => {
+import { Ref } from 'vue';
+import { CLPalette } from '../../index.ts';
+interface ThemeContext {
+    colors: Ref<CLPalette>;
+    darkMode: Ref<boolean | undefined>;
+}
+export declare const modalTheme: (theme?: ThemeContext) => {
     '--clll-modal-overlay-bg': string;
     '--clll-modal-content-bg': string;
     '--clll-modal-theme-radius': string;
 };
+export {};

package/dist/components/Navigation/CLLink/CLLink.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLLink.css';
-import{_ as e}from"../../../chunks/CLLink.vue_vue_type_style_index_0_lang-DDtyvg4a.js";export{e as CLLink,e as default};
+import{_ as e}from"../../../chunks/CLLink.vue_vue_type_style_index_0_lang-7e7xSEg0.js";export{e as CLLink,e as default};

package/dist/components/Navigation/CLNavLink/CLNavLink.js

@@ -1,2 +1,2 @@
 import '../../../assets/core.css';
-import{_ as a}from"../../../chunks/CLNavLink.vue_vue_type_script_setup_true_lang-Dm81o6kG.js";export{a as CLNavLink,a as default};
+import{_ as a}from"../../../chunks/CLNavLink.vue_vue_type_script_setup_true_lang-I-qjKZJQ.js";export{a as CLNavLink,a as default};

package/dist/components/Navigation/CLNavSection/CLNavSection.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLNavSection.css';
-import{defineComponent as e,computed as t,createElementBlock as a,openBlock as l,normalizeClass as r,unref as n,Fragment as i,renderList as o,createVNode as s,withCtx as c,createTextVNode as _,toDisplayString as u}from"vue";import{_ as d}from"../../../chunks/CLNavLink.vue_vue_type_script_setup_true_lang-Dm81o6kG.js";import{_ as p}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-CMXJdE-D.js";import{CLOrientation as f,CLColors as m}from"../../../index.js";const v=["data-testid"],k=/* @__PURE__ */e({name:"CLNavSection",__name:"CLNavSection",props:{color:{default:m.Primary},navItems:{},testId:{default:"clll-nav-section"},type:{default:f.Horizontal}},setup(e){const f=e,m="clll-nav-section",k=t(()=>[m,`${m}--${f.type}`]);return(t,f)=>(l(),a("ul",{class:r(n(k)),"data-testid":e.testId},[(l(!0),a(i,null,o(e.navItems,(t,r)=>(l(),a("li",{key:`link-${t.id}-${r}`,class:"clll-nav-section__item"},[s(n(d),{id:t.id,"aria-label":t.ariaLabel,color:e.color,external:t.external,href:t.href,rel:t.rel,target:t.target,"on-click":t.onClick},{default:c(()=>[s(n(p),{as:"span"},{default:c(()=>[_(u(t.label),1)]),_:2},1024)]),_:2},1032,["id","aria-label","color","external","href","rel","target","on-click"])]))),128))],10,v))}});export{k as CLNavSection,k as default};
+import{defineComponent as e,computed as t,createElementBlock as a,openBlock as l,normalizeClass as r,unref as n,Fragment as i,renderList as o,createVNode as s,withCtx as c,createTextVNode as _,toDisplayString as u}from"vue";import{_ as d}from"../../../chunks/CLNavLink.vue_vue_type_script_setup_true_lang-I-qjKZJQ.js";import{_ as p}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-Tv0xzrRz.js";import{CLOrientation as m,CLColors as v}from"../../../index.js";const f=["data-testid"],k=/* @__PURE__ */e({name:"CLNavSection",__name:"CLNavSection",props:{color:{default:v.Primary},navItems:{},testId:{default:"clll-nav-section"},type:{default:m.Horizontal}},setup(e){const m=e,v="clll-nav-section",k=t(()=>[v,`${v}--${m.type}`]);return(t,m)=>(l(),a("ul",{class:r(n(k)),"data-testid":e.testId},[(l(!0),a(i,null,o(e.navItems,(t,r)=>(l(),a("li",{key:`link-${t.id}-${r}`,class:"clll-nav-section__item"},[s(n(d),{id:t.id,"aria-label":t.ariaLabel,color:e.color,external:t.external,href:t.href,rel:t.rel,target:t.target,"on-click":t.onClick},{default:c(()=>[s(n(p),{as:"span"},{default:c(()=>[_(u(t.label),1)]),_:2},1024)]),_:2},1032,["id","aria-label","color","external","href","rel","target","on-click"])]))),128))],10,f))}});export{k as CLNavSection,k as default};

package/dist/components/Navigation/utils.d.ts

@@ -1,9 +1,15 @@
-import { CLColors } from '../../index.ts';
+import { Ref } from 'vue';
+import { CLColors, CLPalette } from '../../index.ts';
+interface ThemeContext {
+    colors: Ref<CLPalette>;
+    darkMode: Ref<boolean | undefined>;
+}
 interface BaseLinkProps {
     color: CLColors;
     underline?: boolean;
+    theme?: ThemeContext;
 }
-export declare const base_link: ({ color, underline }: BaseLinkProps) => {
+export declare const base_link: ({ color, underline, theme }: BaseLinkProps) => {
     '--clll-link-text-color': string;
     '--clll-link-text-hover': string;
     '--clll-link-underline-color': string;

package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLDropdownMenu.css';
-import{defineComponent as e,ref as o,computed as t,onBeforeUnmount as n,createElementBlock as a,openBlock as d,normalizeClass as r,createVNode as l,createCommentVNode as i,unref as s,withCtx as u,createTextVNode as c,toDisplayString as p,normalizeStyle as b,renderSlot as f}from"vue";import{u as m,a as _,f as v,o as w,s as h}from"../../../chunks/floating-ui.vue-C0JWy0Dz.js";import{_ as y}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-CqwRXex5.js";import{_ as g}from"../../../chunks/CLCard.vue_vue_type_style_index_0_lang-CMQi_nx9.js";import{c as B,i as $}from"../../../chunks/helper-C542dSLs.js";import{useDropdown as z}from"../../../composables/useDropdown.js";import{useEsc as x}from"../../../composables/useEsc.js";import{CLPlacement as I,CLIconSizes as k,CLIconNames as E,CLColorVariants as L,CLSizes as C,CLColors as D}from"../../../index.js";const S=["data-testid"],H=["id","aria-labelledby","aria-hidden"],j=/* @__PURE__ */e({name:"CLDropdownMenu",__name:"CLDropdownMenu",props:{buttonAriaLabel:{},buttonBorderRadius:{},buttonBusy:{type:Boolean},buttonColor:{default:D.Secondary},buttonDisabled:{type:Boolean},buttonHeight:{default:"auto"},buttonSize:{default:C.Small},buttonVariant:{default:L.Soft},buttonWidth:{default:"auto"},buttonWrapped:{type:Boolean},containerBordered:{type:Boolean,default:!0},containerBorderRadius:{},containerElevated:{type:Boolean,default:!1},contentWidth:{default:"auto"},dropdownId:{},iconAfter:{default:E.ChevronDown},iconBefore:{},iconSize:{default:k.Tiny},isOpen:{type:Boolean,default:!1},label:{},onCloseHandler:{},onOpenHandler:{},placement:{default:I.BottomStart},testId:{default:"clll-dropdown-menu"},zIndex:{default:30}},setup(e,{expose:I}){const k=e;let E=o(),C=o();const j=o(),O=o(),W=o(k.isOpen),R=o(k.placement),A="clll-dropdown-menu",M=t(()=>"auto"===k.zIndex||B(k.zIndex)?k.zIndex:k.zIndex.toString()),V=e=>{e&&(E.value=e)},G=e=>{e&&(C.value=e)},N=()=>{T.value?F():q()},{open:T,openDropdown:q,closeDropdown:F,clearEventListeners:J}=z({triggerElem:E,dropdownRef:O,openDropdownHandler:()=>{W.value=!0,k?.onOpenHandler?.(),P(),$&&document.addEventListener("click",Q)},closeDropdownHandler:()=>{W.value=!1,k?.onCloseHandler?.(),$&&document.removeEventListener("click",Q),U(),J()}});I({close:()=>{F(),J(),U()},open:()=>{q()}});const{floatingStyles:K,update:P}=m(j,O,{middleware:[v(),w(10),h()],placement:R,open:W,whileElementsMounted:_}),Q=e=>{W.value&&O.value?.contains(e?.target)&&F()},{clearEventListeners:U}=x({escHandler:F,triggerElem:E});return n(()=>{$&&document.removeEventListener("click",Q),U(),J()}),(o,t)=>(d(),a("div",{class:r([`${A}__menu`]),"data-testid":e.testId},[l(s(y),{id:`${A}__toggle--${e.dropdownId}`,ref_key:"anchor",ref:j,"aria-controls":`${A}--${e.dropdownId}`,"aria-expanded":s(W)||e.isOpen,"aria-label":e.buttonAriaLabel,busy:e.buttonBusy,disabled:e.buttonDisabled||e.buttonBusy,class:r(`${A}__toggle`),color:e.buttonColor,"border-radius":e.buttonBorderRadius,"forward-ref":V,height:e.buttonHeight,"icon-after":e.iconAfter,"icon-before":e.iconBefore,"icon-size":e.iconSize,size:e.buttonSize,"test-id":`${A}__toggle`,variant:e.buttonVariant,width:e.buttonWidth,wrap:e.buttonWrapped,"on-click":N},{default:u(()=>[c(p(e.label),1)]),_:1},8,["id","aria-controls","aria-expanded","aria-label","busy","disabled","class","color","border-radius","height","icon-after","icon-before","icon-size","size","test-id","variant","width","wrap"]),s(W)||e.isOpen?(d(),a("div",{key:0,id:`${A}--${e.dropdownId}`,ref_key:"dropdownElem",ref:O,"aria-labelledby":`${A}__toggle--${e.dropdownId}`,"aria-hidden":!(s(W)||e.isOpen),class:r([`${A}__dropdown`,`${A}__dropdown--${s(R)}`]),style:b({...s(K),zIndex:s(M)})},[l(s(g),{bordered:e.containerBordered,"border-radius":e.containerBorderRadius,color:s(D).Neutral,elevated:e.containerElevated,"forward-ref":G,padded:!1,"test-id":`${A}__content`,variant:s(L).Ghost,width:e.contentWidth},{default:u(()=>[f(o.$slots,"content")]),_:3},8,["bordered","border-radius","color","elevated","test-id","variant","width"])],14,H)):i("",!0)],10,S))}});export{j as CLDropdownMenu,j as default};
+import{defineComponent as e,ref as o,computed as t,onBeforeUnmount as n,createElementBlock as a,openBlock as d,normalizeClass as r,createVNode as l,createCommentVNode as i,unref as s,withCtx as u,createTextVNode as c,toDisplayString as p,normalizeStyle as b,renderSlot as f}from"vue";import{u as m,a as _,f as v,o as w,s as h}from"../../../chunks/floating-ui.vue-C0JWy0Dz.js";import{_ as y}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-Bi7GC71m.js";import{_ as g}from"../../../chunks/CLCard.vue_vue_type_style_index_0_lang-Lb49WiaW.js";import{c as B,i as $}from"../../../chunks/helper-C542dSLs.js";import{useDropdown as z}from"../../../composables/useDropdown.js";import{useEsc as x}from"../../../composables/useEsc.js";import{CLPlacement as I,CLIconSizes as E,CLIconNames as L,CLColorVariants as k,CLSizes as C,CLColors as D}from"../../../index.js";const S=["data-testid"],H=["id","aria-labelledby","aria-hidden"],j=/* @__PURE__ */e({name:"CLDropdownMenu",__name:"CLDropdownMenu",props:{buttonAriaLabel:{},buttonBorderRadius:{},buttonBusy:{type:Boolean},buttonColor:{default:D.Secondary},buttonDisabled:{type:Boolean},buttonHeight:{default:"auto"},buttonSize:{default:C.Small},buttonVariant:{default:k.Soft},buttonWidth:{default:"auto"},buttonWrapped:{type:Boolean},containerBordered:{type:Boolean,default:!0},containerBorderRadius:{},containerElevated:{type:Boolean,default:!1},contentWidth:{default:"auto"},dropdownId:{},iconAfter:{default:L.ChevronDown},iconBefore:{},iconSize:{default:E.Tiny},isOpen:{type:Boolean,default:!1},label:{},onCloseHandler:{},onOpenHandler:{},placement:{default:I.BottomStart},testId:{default:"clll-dropdown-menu"},zIndex:{default:30}},setup(e,{expose:I}){const E=e;let L=o(),C=o();const j=o(),O=o(),W=o(E.isOpen),R=o(E.placement),A="clll-dropdown-menu",M=t(()=>"auto"===E.zIndex||B(E.zIndex)?E.zIndex:E.zIndex.toString()),V=e=>{e&&(L.value=e)},G=e=>{e&&(C.value=e)},N=()=>{T.value?F():q()},{open:T,openDropdown:q,closeDropdown:F,clearEventListeners:J}=z({triggerElem:L,dropdownRef:O,openDropdownHandler:()=>{W.value=!0,E?.onOpenHandler?.(),P(),$&&document.addEventListener("click",Q)},closeDropdownHandler:()=>{W.value=!1,E?.onCloseHandler?.(),$&&document.removeEventListener("click",Q),U(),J()}});I({close:()=>{F(),J(),U()},open:()=>{q()}});const{floatingStyles:K,update:P}=m(j,O,{middleware:[v(),w(10),h()],placement:R,open:W,whileElementsMounted:_}),Q=e=>{W.value&&O.value?.contains(e?.target)&&F()},{clearEventListeners:U}=x({escHandler:F,triggerElem:L});return n(()=>{$&&document.removeEventListener("click",Q),U(),J()}),(o,t)=>(d(),a("div",{class:r([`${A}__menu`]),"data-testid":e.testId},[l(s(y),{id:`${A}__toggle--${e.dropdownId}`,ref_key:"anchor",ref:j,"aria-controls":`${A}--${e.dropdownId}`,"aria-expanded":s(W)||e.isOpen,"aria-label":e.buttonAriaLabel,busy:e.buttonBusy,disabled:e.buttonDisabled||e.buttonBusy,class:r(`${A}__toggle`),color:e.buttonColor,"border-radius":e.buttonBorderRadius,"forward-ref":V,height:e.buttonHeight,"icon-after":e.iconAfter,"icon-before":e.iconBefore,"icon-size":e.iconSize,size:e.buttonSize,"test-id":`${A}__toggle`,variant:e.buttonVariant,width:e.buttonWidth,wrap:e.buttonWrapped,"on-click":N},{default:u(()=>[c(p(e.label),1)]),_:1},8,["id","aria-controls","aria-expanded","aria-label","busy","disabled","class","color","border-radius","height","icon-after","icon-before","icon-size","size","test-id","variant","width","wrap"]),s(W)||e.isOpen?(d(),a("div",{key:0,id:`${A}--${e.dropdownId}`,ref_key:"dropdownElem",ref:O,"aria-labelledby":`${A}__toggle--${e.dropdownId}`,"aria-hidden":!(s(W)||e.isOpen),class:r([`${A}__dropdown`,`${A}__dropdown--${s(R)}`]),style:b({...s(K),zIndex:s(M)})},[l(s(g),{bordered:e.containerBordered,"border-radius":e.containerBorderRadius,color:s(D).Neutral,elevated:e.containerElevated,"forward-ref":G,padded:!1,"test-id":`${A}__content`,variant:s(k).Ghost,width:e.contentWidth},{default:u(()=>[f(o.$slots,"content")]),_:3},8,["bordered","border-radius","color","elevated","test-id","variant","width"])],14,H)):i("",!0)],10,S))}});export{j as CLDropdownMenu,j as default};

package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.vue.d.ts

@@ -56,8 +56,8 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<CL
     open: () => void;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<CLDropdownMenuProps> & Readonly<{}>, {
     testId: string;
-    iconAfter: CLIconNames;
     iconSize: CLIconSizes;
+    iconAfter: CLIconNames;
     isOpen: boolean;
     zIndex: number | string;
     placement: CLPlacement;
@@ -123,6 +123,7 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<CL
             title: string;
             color: CLColors;
             variant: CLColorVariants;
+            size: CLSizes;
             rounded: boolean;
             testId: string;
             type: import('../../../types').CLButtonTypes;
@@ -131,21 +132,20 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<CL
             target: import('../../../types').CLLinkTarget;
             width: string;
             height: string;
-            size: CLSizes;
+            borderRadius: CLBorderRadius;
+            iconSize: CLIconSizes;
+            iconFilled: boolean;
             href: string;
             active: boolean;
             alignContent: import('../../../types').CLAlign;
             ariaLabel: string;
             as: import('../../../types').CLButtonTags;
-            borderRadius: CLBorderRadius;
             busy: boolean;
             disabled: boolean;
             elevated: boolean;
             forwardRef: import('../../../types').CLButtonForwardRefFunction;
             iconAfter: CLIconNames;
             iconBefore: CLIconNames;
-            iconFilled: boolean;
-            iconSize: CLIconSizes;
             pill: boolean;
             wrap: boolean;
         }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
@@ -172,6 +172,7 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<CL
         title: string;
         color: CLColors;
         variant: CLColorVariants;
+        size: CLSizes;
         rounded: boolean;
         testId: string;
         type: import('../../../types').CLButtonTypes;
@@ -180,24 +181,23 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<CL
         target: import('../../../types').CLLinkTarget;
         width: string;
         height: string;
-        size: CLSizes;
+        borderRadius: CLBorderRadius;
+        iconSize: CLIconSizes;
+        iconFilled: boolean;
         href: string;
         active: boolean;
         alignContent: import('../../../types').CLAlign;
         ariaLabel: string;
         as: import('../../../types').CLButtonTags;
-        borderRadius: CLBorderRadius;
         busy: boolean;
         disabled: boolean;
         elevated: boolean;
         forwardRef: import('../../../types').CLButtonForwardRefFunction;
         iconAfter: CLIconNames;
         iconBefore: CLIconNames;
-        iconFilled: boolean;
-        iconSize: CLIconSizes;
         pill: boolean;
         wrap: boolean;
-    }> & Omit<Readonly<import('../../Buttons/CLButton/CLButton.vue').CLButtonProps> & Readonly<{}>, "title" | "color" | "variant" | "rounded" | "testId" | "type" | "form" | "onClick" | "target" | "width" | "height" | "size" | "href" | "active" | "alignContent" | "ariaLabel" | "as" | "borderRadius" | "busy" | "disabled" | "elevated" | "forwardRef" | "iconAfter" | "iconBefore" | "iconFilled" | "iconSize" | "pill" | "wrap"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
+    }> & Omit<Readonly<import('../../Buttons/CLButton/CLButton.vue').CLButtonProps> & Readonly<{}>, "title" | "color" | "variant" | "size" | "rounded" | "testId" | "type" | "form" | "onClick" | "target" | "width" | "height" | "borderRadius" | "iconSize" | "iconFilled" | "href" | "active" | "alignContent" | "ariaLabel" | "as" | "busy" | "disabled" | "elevated" | "forwardRef" | "iconAfter" | "iconBefore" | "pill" | "wrap"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
         $slots: {
             default?(_: {}): any;
         };

package/dist/components/Popups/CLToast/CLToast.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLToast.css';
-import{_ as s}from"../../../chunks/CLToast.vue_vue_type_style_index_0_lang-BTKkG8MZ.js";export{s as CLToast,s as default};
+import{_ as s}from"../../../chunks/CLToast.vue_vue_type_style_index_0_lang-zgtfLRPh.js";export{s as CLToast,s as default};

package/dist/components/Popups/CLToast/CLToast.vue.d.ts

@@ -4,10 +4,10 @@ declare const _default: import('vue').DefineComponent<CLToastProps, {}, {}, {},
     rounded: boolean;
     testId: string;
     width: string;
-    position: CLToastPosition;
-    iconFilled: boolean;
-    iconSize: CLIconSizes;
     dismissTimer: number;
+    iconSize: CLIconSizes;
+    iconFilled: boolean;
+    position: CLToastPosition;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     elem: HTMLOutputElement;
 }, HTMLOutputElement>;

package/dist/components/Popups/utils.d.ts

@@ -1,8 +1,14 @@
-import { CLColors } from '../../index.ts';
+import { Ref } from 'vue';
+import { CLColors, CLPalette } from '../../index.ts';
+interface ThemeContext {
+    colors: Ref<CLPalette>;
+    darkMode: Ref<boolean | undefined>;
+}
 interface ThemeProps {
     color: CLColors;
+    theme?: ThemeContext;
 }
-export declare const toastTheme: ({ color }: ThemeProps) => {
+export declare const toastTheme: ({ color, theme }: ThemeProps) => {
     '--clll-toast-bg-color': string;
     '--clll-toast-text-color': string | undefined;
     '--clll-toast-action-button-text-color': string | undefined;

package/dist/components/Providers/CLThemeProvider/CLThemeProvider.js

@@ -1,2 +1,2 @@
 import '../../../assets/core.css';
-import{defineComponent as e,provide as t,onMounted as o,onBeforeUnmount as a,watch as r,createBlock as s,openBlock as l,resolveDynamicComponent as i,normalizeStyle as d,unref as n,withCtx as m,renderSlot as f}from"vue";import{s as c,T as u,D as h}from"../../../chunks/context-CRxE5KWX.js";import{i as g,b as C}from"../../../chunks/helper-C542dSLs.js";const p=/* @__PURE__ */e({__name:"CLThemeProvider",props:{tag:{default:"div"},themeConfig:{},autoDetectDarkMode:{type:Boolean,default:!0}},setup(e){const p=e,v=c(p.themeConfig);t(u,v);const{setBorderRadius:k,setColors:D,setDarkMode:y,setFontFamily:M}=v;let F=null;const b=()=>{if(p.autoDetectDarkMode&&g){const e=C();y(e)}};return o(()=>{p.autoDetectDarkMode&&g&&(b(),F=window.matchMedia("(prefers-color-scheme: dark)"),F.addEventListener("change",b))}),a(()=>{F&&g&&F.removeEventListener("change",b)}),r(()=>p.themeConfig?.borderRadius,e=>{k(e)}),r(()=>p.themeConfig?.colors,e=>{e&&D(e)}),r(()=>p.themeConfig?.darkMode,e=>{void 0===e||p.autoDetectDarkMode||y(e)}),r(()=>p.themeConfig?.fontFamily,e=>{M(e)}),(t,o)=>(l(),s(i(e.tag),{class:"clll-theme-provider",style:d({"--clll-font-family":e.themeConfig?.fontFamily||n(h).fontFamily,"--clll-default-radius":e.themeConfig?.borderRadius?`var(--clll-${e.themeConfig.borderRadius})`:void 0})},{default:m(()=>[f(t.$slots,"default")]),_:3},8,["style"]))}});export{p as CLThemeProvider,h as DEFAULT_THEME,u as ThemeInjectionKey,p as default};
+import{defineComponent as e,provide as t,onMounted as o,onBeforeUnmount as a,watch as r,createBlock as s,openBlock as l,resolveDynamicComponent as d,normalizeStyle as n,normalizeClass as i,unref as c,withCtx as m,renderSlot as f}from"vue";import{s as u,T as h}from"../../../chunks/context-CRxE5KWX.js";export{D as DEFAULT_THEME}from"../../../chunks/context-CRxE5KWX.js";import{i as k,b as p}from"../../../chunks/helper-C542dSLs.js";const g=/* @__PURE__ */e({__name:"CLThemeProvider",props:{tag:{default:"div"},themeConfig:{},autoDetectDarkMode:{type:Boolean,default:!0}},setup(e){const g=e,v=u(g.themeConfig);t(h,v);const{borderRadius:D,darkMode:C,fontFamily:M,setBorderRadius:y,setColors:E,setDarkMode:F,setFontFamily:L}=v;let T=null;const x=()=>{if(g.autoDetectDarkMode&&k){const e=p();F(e)}};return o(()=>{g.autoDetectDarkMode&&k&&(x(),T=window.matchMedia("(prefers-color-scheme: dark)"),T.addEventListener("change",x))}),a(()=>{T&&k&&T.removeEventListener("change",x)}),r(()=>g.themeConfig?.borderRadius,e=>{y(e)}),r(()=>g.themeConfig?.colors,e=>{e&&E(e)}),r(()=>g.themeConfig?.darkMode,e=>{void 0===e||g.autoDetectDarkMode||F(e)}),r(()=>g.themeConfig?.fontFamily,e=>{L(e)}),(t,o)=>(l(),s(d(e.tag),{class:i(["clll-theme-provider","--clll-color-theme-"+(c(C)?"dark":"light")]),style:n({"--clll-font-family":c(M),"--clll-default-radius":c(D)?`var(--clll-${c(D)})`:void 0})},{default:m(()=>[f(t.$slots,"default")]),_:3},8,["class","style"]))}});export{g as CLThemeProvider,h as ThemeInjectionKey,g as default};

package/dist/components/Providers/CLToastProvider/CLToastProvider.js

@@ -1,2 +1,2 @@
 import '../../../assets/core.css';
-import{defineComponent as s,ref as i,provide as o,createElementBlock as e,openBlock as r,createBlock as a,createCommentVNode as t,renderSlot as d,unref as u,mergeProps as l}from"vue";import{_ as m}from"../../../chunks/CLToast.vue_vue_type_style_index_0_lang-BTKkG8MZ.js";import{T as n}from"../../../chunks/context-JmPivI9V.js";const v={class:"clll-toast-provider"},p=/* @__PURE__ */s({name:"CLToastProvider",__name:"CLToastProvider",props:{borderRadius:{},dismissTimer:{},position:{}},setup(s){const p=s,T=i({}),_=i(!1),c=()=>{_.value=!1,T.value={}};return o(n,{visible:_,showToast:s=>{T.value={...s,borderRadius:s.borderRadius??p.borderRadius,dismissTimer:s.dismissTimer??p.dismissTimer,position:s.position??p.position},_.value=!0},hideToast:c}),(s,i)=>(r(),e("div",v,[_.value?(r(),a(u(m),l({key:0},T.value,{"on-dismiss":c}),null,16)):t("",!0),d(s.$slots,"default")]))}});export{p as CLToastProvider,n as ToastInjectionKey,p as default};
+import{defineComponent as s,ref as i,provide as o,createElementBlock as e,openBlock as r,createBlock as a,createCommentVNode as t,renderSlot as d,unref as u,mergeProps as l}from"vue";import{_ as m}from"../../../chunks/CLToast.vue_vue_type_style_index_0_lang-zgtfLRPh.js";import{T as n}from"../../../chunks/context-JmPivI9V.js";const v={class:"clll-toast-provider"},p=/* @__PURE__ */s({name:"CLToastProvider",__name:"CLToastProvider",props:{borderRadius:{},dismissTimer:{},position:{}},setup(s){const p=s,T=i({}),_=i(!1),c=()=>{_.value=!1,T.value={}};return o(n,{visible:_,showToast:s=>{T.value={...s,borderRadius:s.borderRadius??p.borderRadius,dismissTimer:s.dismissTimer??p.dismissTimer,position:s.position??p.position},_.value=!0},hideToast:c}),(s,i)=>(r(),e("div",v,[_.value?(r(),a(u(m),l({key:0},T.value,{"on-dismiss":c}),null,16)):t("",!0),d(s.$slots,"default")]))}});export{p as CLToastProvider,n as ToastInjectionKey,p as default};

package/dist/components/Typography/CLHeading/CLHeading.js

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

package/dist/components/Typography/CLText/CLText.js

@@ -1,3 +1,3 @@
 import '../../../assets/core.css';
 import './CLText.css';
-import{_ as e}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-CMXJdE-D.js";export{e as CLText,e as default};
+import{_ as e}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-Tv0xzrRz.js";export{e as CLText,e as default};

package/dist/components/Typography/utils.d.ts

@@ -1,8 +1,14 @@
-import { CLColors } from '../../index.ts';
+import { Ref } from 'vue';
+import { CLColors, CLPalette } from '../../index.ts';
+interface ThemeContext {
+    colors: Ref<CLPalette>;
+    darkMode: Ref<boolean | undefined>;
+}
 interface TextThemeProps {
     color?: CLColors;
+    theme?: ThemeContext;
 }
-export declare const textTheme: ({ color }: TextThemeProps) => {
+export declare const textTheme: ({ color, theme }: TextThemeProps) => {
     '--clll-text-color': string;
 };
 export {};

package/dist/composables/useTheme.js

@@ -1,2 +1,2 @@
 import '../assets/core.css';
-import{ref as e,inject as o}from"vue";import{D as r,T as a}from"../chunks/context-CRxE5KWX.js";const s=e(r.borderRadius),l=e(r.darkMode),n=e(r.fontFamily),t=e(r.colors||{primary:{},secondary:{},neutral:{},danger:{},warning:{},success:{},info:{}}),u=()=>{const e=o(a,null);return e||(console.warn("[Callaloo]: useTheme() must be used within a <CLThemeProvider />."),{borderRadius:s,colors:t,darkMode:l,fontFamily:n,setBorderRadius:e=>{s.value=e},setColors:e=>{t.value={...t.value,...e}},setDarkMode:e=>{l.value=e},setFontFamily:e=>{n.value=e}})};export{u as useTheme};
+import{D as e,T as o}from"../chunks/context-CRxE5KWX.js";import{ref as r,getCurrentInstance as a,inject as n}from"vue";const s=r(e.borderRadius),t=r(e.darkMode),l=r(e.fontFamily),u=r(e.colors||{primary:{},secondary:{},neutral:{},danger:{},warning:{},success:{},info:{}}),d=()=>{const e=a(),r=e?.type.name||"(anonymous component)",d=n(o,null);return d||(console.warn(`[Callaloo]: useTheme() must be used within a <CLThemeProvider />. Called from component: ${r}`,(new Error).stack),{borderRadius:s,colors:u,darkMode:t,fontFamily:l,setBorderRadius:e=>{s.value=e},setColors:e=>{u.value={...u.value,...e}},setDarkMode:e=>{t.value=e},setFontFamily:e=>{l.value=e}})};export{d as useTheme};

package/dist/composables/useToast.d.ts

@@ -1,6 +1,31 @@
+import { ComputedRef } from 'vue';
 import { CLToastProps } from '../index.ts';
-export declare const useToast: () => {
-    visible: globalThis.ComputedRef<boolean>;
-    showToast: (input: Omit<CLToastProps, "onDismiss">) => void;
-    hideToast: () => void | undefined;
-};
+interface UseToastReturn {
+    /**
+     * Whether a toast is currently visible.
+     *
+     * This value is always a boolean. When used without a `<CLToastProvider />`,
+     * it will remain `false` and `showToast` / `hideToast` will be safe no-ops.
+     */
+    visible: ComputedRef<boolean>;
+    /**
+     * Show a toast using the configured provider.
+     *
+     * When called without a `<CLToastProvider />`, this function is a no-op
+     * and will not throw, but a console warning will have been emitted when
+     * the composable was first used.
+     */
+    showToast: (input: Omit<CLToastProps, 'onDismiss'>) => void;
+    /**
+     * Hide the current toast using the configured provider.
+     *
+     * When called without a `<CLToastProvider />`, this function is a no-op.
+     */
+    hideToast: () => void;
+}
+/**
+ * Composable to control toasts via the `CLToastProvider`.
+ * Must be used within a `CLToastProvider` component for full functionality.
+ */
+export declare const useToast: () => UseToastReturn;
+export {};

package/dist/composables/useToast.js

@@ -1,2 +1,2 @@
 import '../assets/core.css';
-import{inject as o,computed as s}from"vue";import{T as t}from"../chunks/context-JmPivI9V.js";const e=()=>{const e=o(t,null);e||console.warn("[Callaloo]: useToast() must be used within a <CLToastProvider />.");return{visible:s(()=>e?.visible.value??!1),showToast:o=>{e?.showToast?.(o)},hideToast:()=>e?.hideToast()}};export{e as useToast};
+import{T as o}from"../chunks/context-JmPivI9V.js";import{getCurrentInstance as s,inject as e,computed as t}from"vue";const n=()=>{const n=s(),a=n?.type.name||"(anonymous component)",r=e(o,null);r||console.warn(`[Callaloo]: useToast() must be used within a <CLToastProvider />. Called from component: ${a}`,(new Error).stack);return{visible:t(()=>r?.visible.value??!1),showToast:o=>{r?.showToast?.(o)},hideToast:()=>r?.hideToast()}};export{n as useToast};