@codeandfunction/callaloo 3.15.3 → 3.16.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (138) hide show
  1. package/README.md +7 -3
  2. package/dist/assets/CLFormCharCounter.css +1 -0
  3. package/dist/assets/CLInputMessages.css +1 -0
  4. package/dist/chunks/CLA11yButton.vue_vue_type_style_index_0_lang-Cdx5rsou.js +45 -0
  5. package/dist/chunks/CLButton.vue_vue_type_style_index_0_lang-CrhjC50b.js +128 -0
  6. package/dist/chunks/CLCard.vue_vue_type_style_index_0_lang-DVuAcV5A.js +252 -0
  7. package/dist/chunks/CLFormCharCounter.vue_vue_type_style_index_0_lang-CJ4VrvmR.js +38 -0
  8. package/dist/chunks/CLFormLabel.vue_vue_type_script_setup_true_lang-fddy-FWI.js +43 -0
  9. package/dist/chunks/CLHeading.vue_vue_type_style_index_0_lang-DILwNSgn.js +50 -0
  10. package/dist/chunks/CLIcon.vue_vue_type_style_index_0_lang-CZB8svPf.js +83 -0
  11. package/dist/chunks/CLInputMessages.vue_vue_type_style_index_0_lang-RMOT1TQk.js +120 -0
  12. package/dist/chunks/CLLink.vue_vue_type_style_index_0_lang-BUgw8Rpy.js +59 -0
  13. package/dist/chunks/CLNavLink.vue_vue_type_script_setup_true_lang-Ckz9MEj5.js +44 -0
  14. package/dist/chunks/CLPill.vue_vue_type_style_index_0_lang-mkIKVHjg.js +88 -0
  15. package/dist/chunks/CLProgress.vue_vue_type_style_index_0_lang-CSf7WiNb.js +65 -0
  16. package/dist/chunks/CLSkeleton.vue_vue_type_style_index_0_lang-E-bZeUWT.js +33 -0
  17. package/dist/chunks/CLSpinner.vue_vue_type_style_index_0_lang-C8s8K4zb.js +53 -0
  18. package/dist/chunks/CLText.vue_vue_type_style_index_0_lang-V7LSR7DF.js +46 -0
  19. package/dist/chunks/CLToast.vue_vue_type_style_index_0_lang-DOI4DZGg.js +178 -0
  20. package/dist/chunks/base-theme-C9_Hz5HW.js +832 -0
  21. package/dist/chunks/useEsc-C9QIDZ_8.js +19 -0
  22. package/dist/chunks/useHasSlotContent-DDqs5uK9.js +14 -0
  23. package/dist/chunks/useTheme-yoEfuNvB.js +417 -0
  24. package/dist/chunks/utils-C7Yjsqk-.js +25 -0
  25. package/dist/chunks/utils-DFnkOeYP.js +72 -0
  26. package/dist/chunks/utils-DTWXs4YX.js +14 -0
  27. package/dist/chunks/utils-D_WP3vZz.js +29 -0
  28. package/dist/chunks/utils-Da9LXXQ0.js +28 -0
  29. package/dist/components/Buttons/CLA11yButton/CLA11yButton.css +1 -0
  30. package/dist/components/Buttons/CLA11yButton/CLA11yButton.js +6 -0
  31. package/dist/components/Buttons/CLA11yButton/CLA11yButton.vue.d.ts +2 -2
  32. package/dist/components/Buttons/CLButton/CLButton.css +1 -0
  33. package/dist/components/Buttons/CLButton/CLButton.js +6 -0
  34. package/dist/components/Buttons/CLButton/CLButton.vue.d.ts +7 -7
  35. package/dist/components/CLIcon/CLIcon.css +1 -0
  36. package/dist/components/CLIcon/CLIcon.js +6 -0
  37. package/dist/components/{Assets/CLIcon → CLIcon}/CLIcon.vue.d.ts +1 -1
  38. package/dist/components/CLTable/CLTable.css +1 -0
  39. package/dist/components/CLTable/CLTable.js +196 -0
  40. package/dist/components/{Table → CLTable}/index.d.ts +0 -7
  41. package/dist/components/Containers/CLCard/CLCard.css +1 -0
  42. package/dist/components/Containers/CLCard/CLCard.js +6 -0
  43. package/dist/components/Containers/CLCard/CLCard.vue.d.ts +6 -6
  44. package/dist/components/Containers/CLCarousel/CLCarousel.css +1 -0
  45. package/dist/components/Containers/CLCarousel/CLCarousel.js +436 -0
  46. package/dist/components/Containers/CLCarousel/CLCarousel.vue.d.ts +2 -2
  47. package/dist/components/Containers/CLCarousel/CLCarouselNavigation.vue.d.ts +1 -1
  48. package/dist/components/Containers/CLDisclosure/CLDisclosure.css +1 -0
  49. package/dist/components/Containers/CLDisclosure/CLDisclosure.js +137 -0
  50. package/dist/components/Containers/CLDisclosure/CLDisclosure.vue.d.ts +3 -3
  51. package/dist/components/Form/CLCheckbox/CLCheckbox.css +1 -0
  52. package/dist/components/Form/CLCheckbox/CLCheckbox.js +147 -0
  53. package/dist/components/Form/CLCheckbox/CLCheckbox.vue.d.ts +4 -4
  54. package/dist/components/Form/CLFormLabel/CLFormLabel.vue.d.ts +1 -1
  55. package/dist/components/Form/CLInput/CLInput.css +1 -0
  56. package/dist/components/Form/CLInput/CLInput.js +378 -0
  57. package/dist/components/Form/CLInput/CLInput.vue.d.ts +5 -5
  58. package/dist/components/Form/CLInput/CLInputPill.vue.d.ts +1 -1
  59. package/dist/components/Form/CLRadioButton/CLRadioButton.css +1 -0
  60. package/dist/components/Form/CLRadioButton/CLRadioButton.js +132 -0
  61. package/dist/components/Form/CLRadioButton/CLRadioButton.vue.d.ts +1 -1
  62. package/dist/components/Form/CLSelect/CLSelect.css +1 -0
  63. package/dist/components/Form/CLSelect/CLSelect.js +137 -0
  64. package/dist/components/Form/CLSelect/CLSelect.vue.d.ts +3 -3
  65. package/dist/components/Form/CLTextArea/CLTextArea.css +1 -0
  66. package/dist/components/Form/CLTextArea/CLTextArea.js +149 -0
  67. package/dist/components/Form/CLTextArea/CLTextArea.vue.d.ts +2 -2
  68. package/dist/components/Form/index.d.ts +5 -9
  69. package/dist/components/Indicators/CLBadge/CLBadge.css +1 -0
  70. package/dist/components/Indicators/CLBadge/CLBadge.js +40 -0
  71. package/dist/components/Indicators/CLBadge/CLBadge.vue.d.ts +1 -1
  72. package/dist/components/Indicators/CLBanner/CLBanner.css +1 -0
  73. package/dist/components/Indicators/CLBanner/CLBanner.js +147 -0
  74. package/dist/components/Indicators/CLBanner/CLBanner.vue.d.ts +3 -3
  75. package/dist/components/Indicators/CLPill/CLPill.css +1 -0
  76. package/dist/components/Indicators/CLPill/CLPill.js +6 -0
  77. package/dist/components/Indicators/CLPill/CLPill.vue.d.ts +3 -3
  78. package/dist/components/Indicators/CLProgress/CLProgress.css +1 -0
  79. package/dist/components/Indicators/CLProgress/CLProgress.js +6 -0
  80. package/dist/components/Indicators/CLProgress/CLProgress.vue.d.ts +2 -2
  81. package/dist/components/Loading/CLSkeleton/CLSkeleton.css +1 -0
  82. package/dist/components/Loading/CLSkeleton/CLSkeleton.js +6 -0
  83. package/dist/components/Loading/CLSkeleton/CLSkeleton.vue.d.ts +1 -1
  84. package/dist/components/Loading/CLSpinner/CLSpinner.css +1 -0
  85. package/dist/components/Loading/CLSpinner/CLSpinner.js +6 -0
  86. package/dist/components/Loading/CLSpinner/CLSpinner.vue.d.ts +1 -1
  87. package/dist/components/Modals/CLModal/CLModal.css +1 -0
  88. package/dist/components/Modals/CLModal/CLModal.js +175 -0
  89. package/dist/components/Modals/CLModal/CLModal.vue.d.ts +2 -2
  90. package/dist/components/Navigation/CLLink/CLLink.css +1 -0
  91. package/dist/components/Navigation/CLLink/CLLink.js +6 -0
  92. package/dist/components/Navigation/CLLink/CLLink.vue.d.ts +2 -2
  93. package/dist/components/Navigation/CLNavLink/CLNavLink.js +5 -0
  94. package/dist/components/Navigation/CLNavLink/CLNavLink.vue.d.ts +1 -1
  95. package/dist/components/Navigation/CLNavSection/CLNavSection.css +1 -0
  96. package/dist/components/Navigation/CLNavSection/CLNavSection.js +55 -0
  97. package/dist/components/Navigation/CLNavSection/CLNavSection.vue.d.ts +1 -1
  98. package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.css +1 -0
  99. package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.js +1233 -0
  100. package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.vue.d.ts +29 -29
  101. package/dist/components/Popups/CLToast/CLToast.css +1 -0
  102. package/dist/components/Popups/CLToast/CLToast.js +6 -0
  103. package/dist/components/Popups/CLToast/CLToast.vue.d.ts +2 -2
  104. package/dist/components/Providers/CLThemeProvider/CLThemeProvider.js +44 -0
  105. package/dist/components/Providers/CLThemeProvider/CLThemeProvider.vue.d.ts +27 -0
  106. package/dist/components/Providers/CLThemeProvider/base-theme.d.ts +22 -0
  107. package/dist/components/Providers/CLThemeProvider/index.d.ts +6 -0
  108. package/dist/components/Providers/CLToastProvider/CLToastProvider.js +45 -0
  109. package/dist/components/Providers/{Toast → CLToastProvider}/CLToastProvider.vue.d.ts +1 -7
  110. package/dist/components/Providers/CLToastProvider/index.d.ts +4 -0
  111. package/dist/components/Providers/index.d.ts +2 -6
  112. package/dist/components/Typography/CLHeading/CLHeading.css +1 -0
  113. package/dist/components/Typography/CLHeading/CLHeading.js +6 -0
  114. package/dist/components/Typography/CLText/CLText.css +1 -0
  115. package/dist/components/Typography/CLText/CLText.js +6 -0
  116. package/dist/composables/useTheme.d.ts +26 -0
  117. package/dist/index.d.ts +0 -15
  118. package/dist/index.js +27 -5899
  119. package/package.json +124 -13
  120. package/dist/assets/styles.css +0 -1
  121. package/dist/components/Assets/index.d.ts +0 -2
  122. package/dist/components/Form/CLFormCharCounter/index.d.ts +0 -5
  123. package/dist/components/Form/CLFormLabel/index.d.ts +0 -5
  124. package/dist/components/Providers/Theme/CLThemeProvider.vue.d.ts +0 -26
  125. package/dist/components/Providers/Theme/base-theme.d.ts +0 -48
  126. package/dist/constants.d.ts +0 -22
  127. package/dist/chunks/{icons.QRYZHNAf.js → icons-QRYZHNAf.js} +0 -0
  128. package/dist/components/{Assets/CLIcon → CLIcon}/index.d.ts +0 -0
  129. package/dist/components/{Assets → CLIcon}/utils.d.ts +0 -0
  130. package/dist/components/{Table → CLTable}/CLTable.vue.d.ts +1 -1
  131. /package/dist/components/{Table → CLTable}/CLTableBody.vue.d.ts +0 -0
  132. /package/dist/components/{Table → CLTable}/CLTableCell.vue.d.ts +0 -0
  133. /package/dist/components/{Table → CLTable}/CLTableFooter.vue.d.ts +0 -0
  134. /package/dist/components/{Table → CLTable}/CLTableHeader.vue.d.ts +0 -0
  135. /package/dist/components/{Table → CLTable}/CLTableNestedCell.vue.d.ts +0 -0
  136. /package/dist/components/{Table → CLTable}/CLTableRow.vue.d.ts +0 -0
  137. /package/dist/components/{Table → CLTable}/utils.d.ts +0 -0
  138. /package/dist/components/Providers/{Theme → CLThemeProvider}/utils.d.ts +0 -0
@@ -0,0 +1,83 @@
1
+ import { defineComponent as p, useCssVars as y, computed as v, onMounted as X, createElementBlock as a, openBlock as m, normalizeClass as u, unref as w, createElementVNode as B } from "vue";
2
+ import { CLMode as f, CLColors as h, CLColorVariants as I, CLIconSizes as e } from "../index.js";
3
+ import { u as x, g as z, a as S, c as M } from "./useTheme-yoEfuNvB.js";
4
+ import { i as $ } from "./base-theme-C9_Hz5HW.js";
5
+ const b = ({ color: o = h.Neutral }) => {
6
+ const { colors: i, darkMode: t } = x(), s = t.value ? f.Light : f.Dark, l = z({
7
+ color: o,
8
+ colors: i.value,
9
+ mode: s,
10
+ variant: I.Text
11
+ });
12
+ return S(M`color: ${l?.textBody};`);
13
+ }, E = ["data-testid"], N = ["height", "width"], T = ["href"], O = /* @__PURE__ */ p({
14
+ name: "CLIcon",
15
+ __name: "CLIcon",
16
+ props: {
17
+ color: { default: h.Neutral },
18
+ name: {},
19
+ size: { default: e.Small },
20
+ testId: { default: "clll-icon" }
21
+ },
22
+ setup(o) {
23
+ y((n) => ({
24
+ v18b705a2: s[n.size] + "px"
25
+ }));
26
+ const i = o, t = "clll-icon", s = {
27
+ [e.Tiny]: 20,
28
+ [e.Small]: 24,
29
+ [e.Medium]: 28,
30
+ [e.Large]: 32,
31
+ [e.XL]: 36,
32
+ [e.XXL]: 40,
33
+ [e.XXXL]: 44,
34
+ [e.XXXXL]: 48
35
+ }, l = v(() => [
36
+ t,
37
+ `${t}--${i.name}`,
38
+ `${t}--${i.size}`
39
+ ]), C = async () => {
40
+ if (!$) return;
41
+ let n = window?.document.getElementById("clll-icons");
42
+ if (!n)
43
+ try {
44
+ const r = (/* @__PURE__ */ Object.assign({
45
+ "/src/icons.svg": () => import("./icons-QRYZHNAf.js").then((g) => g.default)
46
+ }))["/src/icons.svg"];
47
+ if (!r) {
48
+ console.warn("[Callaloo] Icon sprite not found");
49
+ return;
50
+ }
51
+ const L = await r();
52
+ if (n = window?.document.getElementById("clll-icons"), n) return;
53
+ const c = window?.document.createElement("div");
54
+ c.id = "clll-icons", c.style.display = "none", c.innerHTML = L.toString(), window?.document.readyState === "loading" ? window.addEventListener("DOMContentLoaded", () => {
55
+ window?.document.body.insertBefore(c, window?.document.body.childNodes[0]);
56
+ }) : window?.document.body.insertBefore(c, window?.document.body.childNodes[0]);
57
+ } catch (d) {
58
+ console.error("[Callaloo] Failed to load icon sprite:", d);
59
+ }
60
+ };
61
+ return X(() => {
62
+ C();
63
+ }), (n, d) => (m(), a("span", {
64
+ class: u([w(l), w(b)({ color: o.color })]),
65
+ "data-testid": o.testId
66
+ }, [
67
+ (m(), a("svg", {
68
+ "aria-hidden": "true",
69
+ class: u(`${t}-sprite`),
70
+ height: s[o.size],
71
+ width: s[o.size],
72
+ viewBox: "0 0 24 24"
73
+ }, [
74
+ B("use", {
75
+ href: `#${o.name}`
76
+ }, null, 8, T)
77
+ ], 10, N))
78
+ ], 10, E));
79
+ }
80
+ });
81
+ export {
82
+ O as _
83
+ };
@@ -0,0 +1,120 @@
1
+ import { defineComponent as G, createElementBlock as W, openBlock as R, normalizeClass as O, unref as E, renderSlot as N, Fragment as A, renderList as H, createElementVNode as I, toDisplayString as j } from "vue";
2
+ import { CLOrientation as J, CLMode as x, CLColorVariants as n, CLColors as K } from "../index.js";
3
+ import { u as L, g as w, c as r, b as q, f as M, a as S } from "./useTheme-yoEfuNvB.js";
4
+ const B = "clll-form-field", Z = /* @__PURE__ */ G({
5
+ __name: "CLFormField",
6
+ props: {
7
+ fluid: { type: Boolean },
8
+ hasPill: { type: Boolean },
9
+ hasCharCounter: { type: Boolean },
10
+ orientation: {}
11
+ },
12
+ setup(e) {
13
+ return (l, s) => (R(), W("div", {
14
+ class: O([
15
+ B,
16
+ e.fluid || e.orientation === E(J).Horizontal ? `${B}--fluid` : `${B}--fixed`,
17
+ e.orientation ? `${B}--${e.orientation}` : "",
18
+ e.hasPill ? `${B}--haspill` : "",
19
+ e.hasCharCounter ? `${B}--hascharcounter` : ""
20
+ ])
21
+ }, [
22
+ N(l.$slots, "default")
23
+ ], 2));
24
+ }
25
+ }), m = ({
26
+ color: e,
27
+ component: l,
28
+ disabled: s,
29
+ variant: a
30
+ }) => {
31
+ const { borderRadius: c, colors: b, darkMode: f } = L(), h = f.value ? x.Dark : x.Light, i = w({
32
+ color: e,
33
+ colors: b.value,
34
+ mode: h,
35
+ variant: n.Solid
36
+ }), d = w({
37
+ color: e,
38
+ colors: b.value,
39
+ mode: h,
40
+ variant: n.Outline
41
+ }), t = f.value ? "black" : "white", $ = a === n.Ghost ? "transparent" : d?.border, y = d?.disabled, u = f.value ? "black" : i?.textDisabled, g = d?.focus, C = d?.focus, _ = a === n.Ghost ? "0px" : "2px", k = d?.text, v = d?.textDisabled;
42
+ let o, p, D;
43
+ c.value && (o = r`&:not([class*='clll-${l}--rounded-']){&.clll-${l}.clll-${l}--rounded .clll-${l}__${l}{border-radius:var(--clll-${c.value});}&.clll-${l}.clll-${l}--rounded{.clll-radiobutton__indicator{border-radius:var(--clll-${c.value});}}}`), s && (p = r`.clll-${l}__${l}-container{.clll-${l}__label{cursor:not-allowed;.clll-${l}__${l}{&:disabled{&:checked{background-color:${u};}}}}}&.clll-${l}--disabled{.clll-${l}__label{.clll-${l}__${l}-frame{.clll-${l}__icon{color:${v};}.clll-radiobutton__indicator{background-color:${v};}}}`);
44
+ const T = r`&.clll-${l}--haslabel{.clll-${l}__label{.clll-text{&.clll-${l}__label--required::after{${z()}}}}}.clll-${l}__${l}-container{.clll-${l}__label{.clll-${l}__${l}-frame{.clll-${l}__icon{color:${k};}.clll-radiobutton__indicator{background-color:${k};}.clll-${l}__${l}{${M({ borderColor: $, shadowColor: C, outlineWidth: _, outlineColor: g, shadowWidth: "--clll-unit-0" })}&:checked{background-color:${t};${s ? M({ borderColor: y, shadowColor: C, outlineWidth: _, outlineColor: g, shadowWidth: "--clll-unit-0" }) : ""}}}}}}.clll-${l}__${l}{${q({ backgroundColor: t, borderColor: $ })}}`;
45
+ return S(T, o, p, D);
46
+ }, ll = ({
47
+ color: e,
48
+ component: l,
49
+ disabled: s,
50
+ readonly: a,
51
+ variant: c
52
+ }) => {
53
+ const { borderRadius: b, colors: f, darkMode: h } = L(), i = h.value ? x.Dark : x.Light, d = w({
54
+ color: e,
55
+ colors: f.value,
56
+ mode: i,
57
+ variant: n.Solid
58
+ }), t = w({
59
+ color: e,
60
+ colors: f.value,
61
+ mode: i,
62
+ variant: n.Outline
63
+ }), $ = h.value ? "black" : "white", y = h.value ? "black" : d?.textDisabled, u = t?.border, g = t?.disabled, C = h.value ? "black" : d?.textDisabled, _ = t?.focus, k = t?.focus, v = t?.text, o = t?.focus;
64
+ let p, D, T, F;
65
+ b.value && (p = r`&:not([class*='clll-${l}--rounded-']){.clll-${l}.clll-${l}--rounded,.clll-${l}__input-container,&.clll-${l}.clll-${l}--rounded .clll-${l}__input{border-radius:var(--clll-${b.value})}}&.clll-${l}--hascustomprefix,&.clll-${l}--hascustomsuffix,&.clll-input--hasiconprefix,&.clll-input--hasiconsuffix,{&.clll-${l}.clll-${l}--rounded{.clll-${l}__input-container{overflow:hidden;.clll-${l}__input-border-control{.clll-${l}__input{border-radius:0}}}}}`), s && (D = r`&.clll-${l}--disabled{cursor:default;.clll-${l}__input-container{border-color:${g};.clll-${l}__input{&:disabled{border-color:${g};background-color:${C};color:${o};&::placeholder{color:${o};}}}}}`), a && (T = r`&.clll-${l}--readonly{cursor:not-allowed;.clll-${l}__input-container{border-color:${g};pointer-events:none;.clll-${l}__input{&:read-only{border-color:${g};background-color:${C};color:${o};&::placeholder{color:${o};}}}}}`), c === n.Ghost && (F = r`&.clll-${l}{&.clll-${l}--ghost,&.clll-input.clll-input--rounded.clll-${l}--ghost{.clll-${l}__input-container,.clll-${l}__input{background-color:#fff0;border:0;padding:0;border-radius:0;&:focus,&:focus-within{outline:none;}}}}&.clll-${l}--grouped{background-color:#fff0;border:0}`);
66
+ const V = r`&.clll-${l}--haslabel{.clll-${l}__label{.clll-text{&.clll-${l}__label--required::after{${z()}}}}}.clll-${l}__input-container{background-color:${$};border-color:${u};.clll-${l}__input{${q({ backgroundColor: $, borderColor: u, placeholderColor: o })}${M({ borderColor: _, shadowColor: k, outlineWidth: "2px", shadowWidth: "--clll-unit-0" })}color:${v}}}&.clll-input--hascustomprefix,&.clll-input--hascustomsuffix,&.clll-input--hasiconprefix,&.clll-input--hasiconsuffix,&.clll-input--grouped,&.clll-input--hascharcounter{.clll-${l}__input-container{border-color:${u};border-style:solid;border-width:1px;&:focus-within{outline-color:${_};outline-style:solid;outline-width:2px}.clll-input__input{border:0;outline:none;&:focus{outline:none;box-shadow:none}}}&:not(.clll-input--ghost){.clll-${l}__input-container{&:focus-within{outline-offset:-1px}}}}.clll-${l}__input-prefix,.clll-${l}__input-suffix,.clll-icon{color:${o}}&.clll-input--grouped{.clll-${l}__input-prefix,.clll-${l}__input-suffix,.clll-${l}__char-counter{background-color:${y};color:${o};.clll-icon{color:${o}}}}&.clll-input--file{.clll-input__input-container{.clll-input__input{&::file-selector-button{background-color:${y}}}}}&.clll-input--color{.clll-input__input-container{.clll-input__input-border-control{border-color:${u};border-style:solid;border-width:2px}}&.clll-input--danger{.clll-input__input-border-control{border-color:${u};border-style:solid;border-width:2px}}&.clll-input--warning{.clll-input__input-border-control{border-color:${u};border-style:solid;border-width:2px}}&.clll-input--success{.clll-input__input-border-control{border-color:${u};border-style:solid;border-width:2px}}&.clll-input--disabled{background-color:${$}}&.clll-input--readonly{background-color:${$}}}&.clll-${l}--hascharcounter{.clll-${l}__char-counter{color:${o}}}`;
67
+ return S(V, p, D, T, F);
68
+ }, Q = ({ color: e }) => {
69
+ const { colors: l, darkMode: s } = L(), a = s.value ? x.Dark : x.Light, c = w({
70
+ color: e,
71
+ colors: l.value,
72
+ mode: a,
73
+ variant: n.Outline
74
+ });
75
+ return S(r`&.clll-input__message--${e}{color:${c?.textBody};}`);
76
+ }, el = ({ color: e, disabled: l, variant: s }) => {
77
+ const { borderRadius: a, colors: c, darkMode: b } = L(), f = b.value ? x.Dark : x.Light, h = w({
78
+ color: e,
79
+ colors: c.value,
80
+ mode: f,
81
+ variant: n.Solid
82
+ }), i = w({
83
+ color: e,
84
+ colors: c.value,
85
+ mode: f,
86
+ variant: n.Outline
87
+ }), d = b.value ? "black" : "white", t = i?.border, $ = i?.disabled, y = b.value ? "black" : h?.textDisabled, u = i?.focus, g = i?.focus, C = i?.text, _ = i?.focus;
88
+ let k, v, o;
89
+ a.value && (k = r`&:not([class*='clll-select--rounded-']){&.clll-select.clll-select--rounded,.clll-select__select-container,&.clll-select.clll-select--rounded .clll-select__select{border-radius:var(--clll-${a.value});}}`), l && (v = r`&.clll-select--disabled{cursor:default;.clll-select__select-container{border-color:${$};.clll-select__select{&:disabled{border-color:${$};background-color:${y};color:${_};&::placeholder{color:${_};}}}}.clll-select__icon{.clll-icon{color:${_};}}}`), s === n.Ghost && (o = r`&.clll-select{&.clll-select--ghost,&.clll-select.clll-select--rounded.clll-select--ghost, .clll-select__select-container, &.clll-select.clll-select--rounded .clll-select__select{.clll-select__select-container,.clll-select__select{background-color:#fff0;border:0;padding-left:0;padding-top:0;padding-bottom:0;border-radius:0;&:focus{outline:none;}}}}`);
90
+ const p = r`&.clll-select--haslabel{.clll-select__label{text-align:left;.clll-text{&.clll-select__label--required::after{${z()}}}}}.clll-select__select-container{border-color:${t};.clll-select__select{${q({ backgroundColor: d, borderColor: t, placeholderColor: _ })}${M({ borderColor: u, shadowColor: g, outlineWidth: "2px", shadowWidth: "--clll-unit-0" })}color:${C};}.clll-select__icon{.clll-icon{color:${C};}}}
91
+ `;
92
+ return S(p, k, v, o);
93
+ }, z = () => {
94
+ const { colors: e, darkMode: l } = L();
95
+ return `position:relative;top:var(--clll-unit-1);content:'*';font-size:var(--clll-unit-4_5);font-weight:500;font-family:var(--clll-font-family);-webkit-font-smoothing:antialiased;color:${l.value ? e.value.danger?.["400"] : e.value.danger?.["700"]};text-decoration:unset;margin-inline-start:var(--clll-unit-0_5);box-sizing:content-box;line-height:0;`;
96
+ }, P = "clll-input__message", ol = /* @__PURE__ */ G({
97
+ __name: "CLInputMessages",
98
+ props: {
99
+ id: {},
100
+ messages: {},
101
+ messageType: { default: K.Neutral }
102
+ },
103
+ setup(e) {
104
+ return (l, s) => (R(!0), W(A, null, H(e.messages, (a, c) => (R(), W("span", {
105
+ key: `${e.id}-message-${c}`,
106
+ class: O([P, `${P}--${e.messageType}`, E(Q)({ color: e.messageType })])
107
+ }, [
108
+ I("span", {
109
+ class: O([`${P}__text`])
110
+ }, j(a), 3)
111
+ ], 2))), 128));
112
+ }
113
+ });
114
+ export {
115
+ Z as _,
116
+ ol as a,
117
+ m as c,
118
+ ll as i,
119
+ el as s
120
+ };
@@ -0,0 +1,59 @@
1
+ import { defineComponent as x, computed as C, createElementBlock as k, openBlock as d, normalizeClass as b, unref as l, renderSlot as L, createBlock as $, createCommentVNode as g } from "vue";
2
+ import { _ as h } from "./CLIcon.vue_vue_type_style_index_0_lang-CZB8svPf.js";
3
+ import { CLMode as u, CLColors as f, CLColorVariants as v, CLLinkTarget as y, CLIconSizes as B, CLIconNames as w } from "../index.js";
4
+ import { u as z, g as I, a as T, f as p, c as D } from "./useTheme-yoEfuNvB.js";
5
+ const H = ({
6
+ color: e = f.Primary,
7
+ underline: o = !0
8
+ }) => {
9
+ const { colors: r, darkMode: n } = z(), a = n.value ? u.Dark : u.Light, t = I({
10
+ color: e,
11
+ colors: r.value,
12
+ mode: a,
13
+ variant: v.Outline
14
+ }), i = t?.border, m = t?.textDisabled, c = t?.textBody, s = n.value ? t?.borderHover : t?.textDisabled;
15
+ return T(D`text-decoration-line:underline;text-decoration-color:${o ? i : "transparent"};display:inline-flex;align-items:center;transition: color 200ms linear, text-decoration-color 200ms linear;color:${c};font-weight:500;background-color:transparent;padding:0;border:0;.clll-text{color:${c};}&:hover{text-decoration-color:${o ? m : "transparent"};background-color:transparent;color:${s};.clll-text{color:${s};}}${p({ borderColor: c ?? "transparent", shadowColor: t?.shadow ?? "transparent", outlineOffset: "2px", shadowWidth: "--clll-unit-0" })}`);
16
+ }, S = ["aria-label", "data-testid", "href", "rel", "target"], O = /* @__PURE__ */ x({
17
+ name: "CLLink",
18
+ __name: "CLLink",
19
+ props: {
20
+ ariaLabel: {},
21
+ color: { default: f.Primary },
22
+ external: { type: Boolean, default: !1 },
23
+ href: {},
24
+ onClick: {},
25
+ rel: { default: "noreferrer noopener" },
26
+ target: { default: y.Self },
27
+ testId: { default: "clll-link" },
28
+ underline: { type: Boolean, default: !0 }
29
+ },
30
+ setup(e) {
31
+ const o = e, r = "clll-link", n = C(() => [
32
+ r,
33
+ `${r}--${o.color}`,
34
+ `${r}--${o.external ? "external" : "internal"}`,
35
+ o.underline ? `${r}--underline` : `${r}--nounderline`
36
+ ]);
37
+ return (a, t) => (d(), k("a", {
38
+ "aria-label": e.ariaLabel,
39
+ class: b([l(n), l(H)({ color: e.color, underline: e.underline })]),
40
+ "data-testid": e.testId,
41
+ href: e.href,
42
+ rel: e.external ? e.rel : "",
43
+ target: e.target,
44
+ onClick: t[0] || (t[0] = //@ts-ignore
45
+ (...i) => e.onClick && e.onClick(...i))
46
+ }, [
47
+ L(a.$slots, "default"),
48
+ e.external ? (d(), $(l(h), {
49
+ key: 0,
50
+ color: e.color,
51
+ name: l(w).ExternalLink,
52
+ size: l(B).Tiny
53
+ }, null, 8, ["color", "name", "size"])) : g("", !0)
54
+ ], 10, S));
55
+ }
56
+ });
57
+ export {
58
+ O as _
59
+ };
@@ -0,0 +1,44 @@
1
+ import { defineComponent as i, createBlock as o, openBlock as c, unref as d, withCtx as f, renderSlot as m } from "vue";
2
+ import { _ as u } from "./CLLink.vue_vue_type_style_index_0_lang-BUgw8Rpy.js";
3
+ import { CLColors as k } from "../index.js";
4
+ const x = /* @__PURE__ */ i({
5
+ name: "CLNavLink",
6
+ __name: "CLNavLink",
7
+ props: {
8
+ ariaLabel: {},
9
+ color: { default: k.Neutral },
10
+ external: { type: Boolean, default: !1 },
11
+ href: {},
12
+ id: {},
13
+ onClick: {},
14
+ rel: { default: "noreferrer noopener" },
15
+ target: {},
16
+ testId: { default: "clll-navlink" }
17
+ },
18
+ emits: ["click"],
19
+ setup(e, { emit: a }) {
20
+ const l = e, r = a, n = (t) => {
21
+ l.onClick && l.onClick(t), r("click", t);
22
+ };
23
+ return (t, s) => (c(), o(d(u), {
24
+ id: e.id,
25
+ "aria-label": e.ariaLabel,
26
+ color: e.color,
27
+ "data-testid": e.testId,
28
+ external: e.external,
29
+ href: e.href,
30
+ rel: e.rel,
31
+ target: e.target,
32
+ underline: !e.onClick,
33
+ onClick: n
34
+ }, {
35
+ default: f(() => [
36
+ m(t.$slots, "default")
37
+ ]),
38
+ _: 3
39
+ }, 8, ["id", "aria-label", "color", "data-testid", "external", "href", "rel", "target", "underline"]));
40
+ }
41
+ });
42
+ export {
43
+ x as _
44
+ };
@@ -0,0 +1,88 @@
1
+ import { defineComponent as v, computed as d, createElementBlock as i, openBlock as t, Fragment as y, createCommentVNode as o, createBlock as u, normalizeClass as c, unref as a, createElementVNode as s, toDisplayString as r, withCtx as h } from "vue";
2
+ import { _ as b } from "./CLButton.vue_vue_type_style_index_0_lang-CrhjC50b.js";
3
+ import { _ as m } from "./CLIcon.vue_vue_type_style_index_0_lang-CZB8svPf.js";
4
+ import { CLColorVariants as z, CLColors as B, CLIconSizes as $ } from "../index.js";
5
+ import { p as f } from "./utils-DFnkOeYP.js";
6
+ const L = ["data-testid"], E = /* @__PURE__ */ v({
7
+ name: "CLPill",
8
+ __name: "CLPill",
9
+ props: {
10
+ color: { default: B.Neutral },
11
+ count: {},
12
+ elevated: { type: Boolean, default: !1 },
13
+ icon: {},
14
+ label: {},
15
+ onClick: {},
16
+ rounded: { type: Boolean, default: !0 },
17
+ testId: { default: "clll-pill" },
18
+ variant: { default: z.Soft }
19
+ },
20
+ setup(e) {
21
+ const l = e, n = "clll-pill", C = d(() => [
22
+ n,
23
+ `${n}--${l.color}--${l.variant}`,
24
+ l.count ? `${n}--has-count` : "",
25
+ l.elevated ? `${n}--elevated` : "",
26
+ l.icon ? `${n}--has-icon` : `${n}--has-noicon`,
27
+ l.rounded ? `${n}--rounded` : ""
28
+ ]), k = d(() => [
29
+ n,
30
+ `${n}--clickable`,
31
+ `${n}--${l.color}--${l.variant}`,
32
+ l.count ? `${n}--has-count` : "",
33
+ l.icon ? `${n}--has-icon` : `${n}--has-noicon`,
34
+ l.rounded ? `${n}--rounded` : ""
35
+ ]);
36
+ return (x, I) => (t(), i(y, null, [
37
+ e.onClick ? o("", !0) : (t(), i("div", {
38
+ key: 0,
39
+ class: c([a(C), a(f)({ color: e.color, variant: e.variant })]),
40
+ "data-testid": e.testId
41
+ }, [
42
+ e.icon ? (t(), u(a(m), {
43
+ key: 0,
44
+ name: e.icon,
45
+ size: a($).Tiny
46
+ }, null, 8, ["name", "size"])) : o("", !0),
47
+ s("span", {
48
+ class: c(`${n}__label`)
49
+ }, r(e.label), 3),
50
+ e.count ? (t(), i("span", {
51
+ key: 1,
52
+ class: c(`${n}__count`)
53
+ }, r(e.count), 3)) : o("", !0)
54
+ ], 10, L)),
55
+ e.onClick ? (t(), u(a(b), {
56
+ key: 1,
57
+ color: e.color,
58
+ "on-click": e.onClick,
59
+ variant: e.variant,
60
+ pill: "",
61
+ rounded: e.rounded
62
+ }, {
63
+ default: h(() => [
64
+ s("div", {
65
+ class: c([a(k), a(f)({ color: e.color, variant: e.variant })])
66
+ }, [
67
+ e.icon ? (t(), u(a(m), {
68
+ key: 0,
69
+ name: e.icon,
70
+ size: a($).Tiny
71
+ }, null, 8, ["name", "size"])) : o("", !0),
72
+ s("span", {
73
+ class: c(`${n}__label`)
74
+ }, r(e.label), 3),
75
+ e.count ? (t(), i("span", {
76
+ key: 1,
77
+ class: c(`${n}__count`)
78
+ }, r(e.count), 3)) : o("", !0)
79
+ ], 2)
80
+ ]),
81
+ _: 1
82
+ }, 8, ["color", "on-click", "variant", "rounded"])) : o("", !0)
83
+ ], 64));
84
+ }
85
+ });
86
+ export {
87
+ E as _
88
+ };
@@ -0,0 +1,65 @@
1
+ import { defineComponent as p, mergeModels as _, useCssVars as $, useModel as C, computed as d, createElementBlock as n, openBlock as c, normalizeClass as s, unref as t, createCommentVNode as v, createElementVNode as a, createVNode as y, withCtx as g, createTextVNode as V, toDisplayString as x } from "vue";
2
+ import { _ as N } from "./CLText.vue_vue_type_style_index_0_lang-V7LSR7DF.js";
3
+ import { CLTextTypes as B, CLColors as u, CLSizes as L } from "../index.js";
4
+ import { a as b } from "./utils-DFnkOeYP.js";
5
+ const h = ["data-testid"], S = /* @__PURE__ */ p({
6
+ name: "CLProgress",
7
+ __name: "CLProgress",
8
+ props: /* @__PURE__ */ _({
9
+ color: { default: u.Primary },
10
+ inverted: { type: Boolean, default: !1 },
11
+ rounded: { type: Boolean, default: !0 },
12
+ size: { default: L.Medium },
13
+ status: { type: Boolean, default: !1 },
14
+ testId: { default: "clll-progress" }
15
+ }, {
16
+ modelValue: { type: Number, default: 0 },
17
+ modelModifiers: {}
18
+ }),
19
+ emits: ["update:modelValue"],
20
+ setup(o) {
21
+ $((f) => ({
22
+ v70fa21a0: l.value
23
+ }));
24
+ const r = o, l = C(o, "modelValue"), e = "clll-progress", i = d(() => [
25
+ e,
26
+ `${e}--${r.color}`,
27
+ `${e}--${r.size}`,
28
+ r.inverted ? `${e}--inverted` : "",
29
+ r.rounded ? `${e}--rounded` : `${e}--not-rounded`
30
+ ]), m = d(() => `${l.value}%`);
31
+ return (f, z) => (c(), n("div", {
32
+ class: s([t(i), t(b)({ color: o.color })]),
33
+ "data-testid": o.testId
34
+ }, [
35
+ o.status ? (c(), n("div", {
36
+ key: 0,
37
+ class: s(`${e}__status__container`)
38
+ }, [
39
+ a("div", {
40
+ class: s(`${e}__status__label`)
41
+ }, [
42
+ y(t(N), {
43
+ color: t(u).Neutral,
44
+ type: t(B).Summary
45
+ }, {
46
+ default: g(() => [
47
+ V(x(t(m)), 1)
48
+ ]),
49
+ _: 1
50
+ }, 8, ["color", "type"])
51
+ ], 2)
52
+ ], 2)) : v("", !0),
53
+ a("div", {
54
+ class: s(`${e}__bar-container`)
55
+ }, [
56
+ a("div", {
57
+ class: s(`${e}__bar`)
58
+ }, null, 2)
59
+ ], 2)
60
+ ], 10, h));
61
+ }
62
+ });
63
+ export {
64
+ S as _
65
+ };
@@ -0,0 +1,33 @@
1
+ import { defineComponent as a, useCssVars as r, computed as i, createElementBlock as u, openBlock as c, normalizeClass as m, unref as n, createElementVNode as f } from "vue";
2
+ import { s as p } from "./utils-C7Yjsqk-.js";
3
+ const k = ["data-testid"], _ = /* @__PURE__ */ a({
4
+ name: "CLSkeleton",
5
+ __name: "CLSkeleton",
6
+ props: {
7
+ borderRadius: {},
8
+ height: { default: "100%" },
9
+ rounded: { type: Boolean, default: !0 },
10
+ testId: { default: "clll-skeleton" },
11
+ width: { default: "100%" }
12
+ },
13
+ setup(o) {
14
+ r((s) => ({
15
+ v168f558d: s.width,
16
+ bce73b80: s.height
17
+ }));
18
+ const t = o, e = "clll-skeleton", d = i(() => [
19
+ e,
20
+ t.borderRadius ? `${e}--${t.borderRadius}` : "",
21
+ t.rounded ? `${e}--rounded` : `${e}--square`
22
+ ]);
23
+ return (s, l) => (c(), u("div", {
24
+ class: m([n(d), n(p)()]),
25
+ "data-testid": o.testId
26
+ }, [...l[0] || (l[0] = [
27
+ f("div", { class: "clll-skeleton__animation" }, null, -1)
28
+ ])], 10, k));
29
+ }
30
+ });
31
+ export {
32
+ _
33
+ };
@@ -0,0 +1,53 @@
1
+ import { defineComponent as m, computed as n, createElementBlock as r, openBlock as i, normalizeClass as c, unref as l, createElementVNode as a } from "vue";
2
+ import { CLSizes as u, CLPosition as f, CLColors as C, CLAlign as $ } from "../index.js";
3
+ import { a as z } from "./utils-C7Yjsqk-.js";
4
+ const L = ["data-testid"], h = /* @__PURE__ */ m({
5
+ name: "CLSpinner",
6
+ __name: "CLSpinner",
7
+ props: {
8
+ align: { default: $.Left },
9
+ color: { default: C.Primary },
10
+ position: { default: f.Absolute },
11
+ size: { default: u.Medium },
12
+ testId: { default: "clll-spinner" }
13
+ },
14
+ setup(o) {
15
+ const t = o, e = "clll-spinner", p = n(() => [
16
+ e,
17
+ `${e}--${t.position}`,
18
+ `${e}--${t.color}`,
19
+ `${e}--${t.size}`,
20
+ `${e}--${t.align}`
21
+ ]), d = n(() => [
22
+ `${e}__circle`,
23
+ `${e}__circle--${t.size}`
24
+ ]);
25
+ return (_, s) => (i(), r("div", {
26
+ class: c([l(p), l(z)({ color: o.color })]),
27
+ "data-testid": o.testId
28
+ }, [
29
+ (i(), r("svg", {
30
+ class: c(l(d)),
31
+ xmlns: "http://www.w3.org/2000/svg",
32
+ fill: "none",
33
+ viewBox: "0 0 24 24"
34
+ }, [...s[0] || (s[0] = [
35
+ a("circle", {
36
+ style: { opacity: "0.25" },
37
+ cx: "12",
38
+ cy: "12",
39
+ r: "10",
40
+ stroke: "currentColor",
41
+ "stroke-width": "4"
42
+ }, null, -1),
43
+ a("path", {
44
+ fill: "currentColor",
45
+ d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
46
+ }, null, -1)
47
+ ])], 2))
48
+ ], 10, L));
49
+ }
50
+ });
51
+ export {
52
+ h as _
53
+ };
@@ -0,0 +1,46 @@
1
+ import { defineComponent as s, computed as n, createBlock as r, openBlock as f, resolveDynamicComponent as c, normalizeClass as u, unref as o, withCtx as m, renderSlot as i } from "vue";
2
+ import { CLTextTypes as p, CLColors as $, CLAlign as y } from "../index.js";
3
+ import { t as C } from "./utils-DTWXs4YX.js";
4
+ const h = /* @__PURE__ */ s({
5
+ name: "CLText",
6
+ __name: "CLText",
7
+ props: {
8
+ align: { default: y.Left },
9
+ as: { default: "p" },
10
+ bold: { type: Boolean, default: !1 },
11
+ bolder: { type: Boolean, default: !1 },
12
+ color: { default: $.Secondary },
13
+ light: { type: Boolean, default: !1 },
14
+ medium: { type: Boolean, default: !1 },
15
+ testId: { default: "clll-text" },
16
+ truncate: { type: Boolean, default: !1 },
17
+ type: { default: p.Body }
18
+ },
19
+ setup(l) {
20
+ const t = l, e = "clll-text", a = n(() => [
21
+ e,
22
+ `${e}--${t.align}`,
23
+ `${e}--${t.color}`,
24
+ `${e}--${t.truncate ? "wrap" : "nowrap"}`,
25
+ `${e}--${t.type}`,
26
+ {
27
+ [`${e}--mediumbold`]: t.medium,
28
+ [`${e}--light`]: t.light,
29
+ [`${e}--bold`]: t.bold,
30
+ [`${e}--bolder`]: t.bolder
31
+ }
32
+ ]);
33
+ return (d, x) => (f(), r(c(l.as), {
34
+ class: u([o(a), o(C)({ color: l.color })]),
35
+ "data-testid": l.testId
36
+ }, {
37
+ default: m(() => [
38
+ i(d.$slots, "default")
39
+ ]),
40
+ _: 3
41
+ }, 8, ["class", "data-testid"]));
42
+ }
43
+ });
44
+ export {
45
+ h as _
46
+ };