@codeandfunction/callaloo 3.16.4 → 3.16.5

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 (101) hide show
  1. package/dist/assets/CLInputMessages.css +1 -1
  2. package/dist/chunks/{CLA11yButton.vue_vue_type_style_index_0_lang-C9OzrJ6Y.js → CLA11yButton.vue_vue_type_style_index_0_lang-Drw6jsX_.js} +13 -12
  3. package/dist/chunks/{CLButton.vue_vue_type_style_index_0_lang--MP4S4D4.js → CLButton.vue_vue_type_style_index_0_lang-B4xTt-xw.js} +5 -5
  4. package/dist/chunks/{CLCard.vue_vue_type_style_index_0_lang-Ba1c7ZNn.js → CLCard.vue_vue_type_style_index_0_lang-Bj9WF_mX.js} +44 -43
  5. package/dist/chunks/{CLFormLabel.vue_vue_type_script_setup_true_lang-DNZdlItJ.js → CLFormLabel.vue_vue_type_script_setup_true_lang-CaHCD2xF.js} +1 -1
  6. package/dist/chunks/{CLHeading.vue_vue_type_style_index_0_lang-BO5OiCE-.js → CLHeading.vue_vue_type_style_index_0_lang-nUnSpm32.js} +11 -10
  7. package/dist/chunks/CLIcon.vue_vue_type_style_index_0_lang--1FTkRVd.js +87 -0
  8. package/dist/chunks/CLInputMessages.vue_vue_type_style_index_0_lang-Bt5xgOT4.js +153 -0
  9. package/dist/chunks/CLLink.vue_vue_type_style_index_0_lang-BDL4xcfJ.js +68 -0
  10. package/dist/chunks/{CLNavLink.vue_vue_type_script_setup_true_lang-DtzSW2Tr.js → CLNavLink.vue_vue_type_script_setup_true_lang-C_BQCWeg.js} +1 -1
  11. package/dist/chunks/CLPill.vue_vue_type_style_index_0_lang-DwNvvX0v.js +90 -0
  12. package/dist/chunks/{CLProgress.vue_vue_type_style_index_0_lang-BMozy0NJ.js → CLProgress.vue_vue_type_style_index_0_lang-Mikbgpn2.js} +16 -15
  13. package/dist/chunks/{CLSkeleton.vue_vue_type_style_index_0_lang-C82FyxKt.js → CLSkeleton.vue_vue_type_style_index_0_lang-Csb9YnTI.js} +11 -10
  14. package/dist/chunks/{CLSpinner.vue_vue_type_style_index_0_lang-DyT8L74M.js → CLSpinner.vue_vue_type_style_index_0_lang-BQ1w9Ik9.js} +17 -16
  15. package/dist/chunks/{CLText.vue_vue_type_style_index_0_lang-CG6043pv.js → CLText.vue_vue_type_style_index_0_lang-BJoS9z9q.js} +14 -13
  16. package/dist/chunks/CLToast.vue_vue_type_style_index_0_lang-C6gOJx7A.js +185 -0
  17. package/dist/chunks/utils-CAV1sBee.js +24 -0
  18. package/dist/chunks/utils-CS9Gz4oX.js +25 -0
  19. package/dist/chunks/utils-C_e2F4X7.js +17 -0
  20. package/dist/chunks/utils-Sqgt8Fa4.js +85 -0
  21. package/dist/chunks/utils-cOhtsyeB.js +41 -0
  22. package/dist/chunks/utils-zJwcNHl4.js +37 -0
  23. package/dist/components/Buttons/CLA11yButton/CLA11yButton.css +1 -1
  24. package/dist/components/Buttons/CLA11yButton/CLA11yButton.js +1 -1
  25. package/dist/components/Buttons/CLButton/CLButton.css +1 -1
  26. package/dist/components/Buttons/CLButton/CLButton.js +1 -1
  27. package/dist/components/Buttons/CLButton/CLButton.vue.d.ts +1 -1
  28. package/dist/components/Buttons/utils.d.ts +16 -2
  29. package/dist/components/CLIcon/CLIcon.css +1 -1
  30. package/dist/components/CLIcon/CLIcon.js +1 -1
  31. package/dist/components/CLIcon/utils.d.ts +3 -1
  32. package/dist/components/CLTable/CLTable.css +1 -1
  33. package/dist/components/CLTable/CLTable.js +113 -115
  34. package/dist/components/CLTable/utils.d.ts +5 -1
  35. package/dist/components/Containers/CLCard/CLCard.css +1 -1
  36. package/dist/components/Containers/CLCard/CLCard.js +1 -1
  37. package/dist/components/Containers/CLCarousel/CLCarousel.js +2 -2
  38. package/dist/components/Containers/CLDisclosure/CLDisclosure.css +1 -1
  39. package/dist/components/Containers/CLDisclosure/CLDisclosure.js +32 -31
  40. package/dist/components/Containers/utils.d.ts +15 -2
  41. package/dist/components/Form/CLCheckbox/CLCheckbox.css +1 -1
  42. package/dist/components/Form/CLCheckbox/CLCheckbox.js +33 -35
  43. package/dist/components/Form/CLCheckbox/CLCheckbox.vue.d.ts +2 -2
  44. package/dist/components/Form/CLInput/CLInput.css +1 -1
  45. package/dist/components/Form/CLInput/CLInput.js +31 -33
  46. package/dist/components/Form/CLInput/CLInput.vue.d.ts +3 -3
  47. package/dist/components/Form/CLRadioButton/CLRadioButton.css +1 -1
  48. package/dist/components/Form/CLRadioButton/CLRadioButton.js +35 -34
  49. package/dist/components/Form/CLSelect/CLSelect.css +1 -1
  50. package/dist/components/Form/CLSelect/CLSelect.js +32 -31
  51. package/dist/components/Form/CLTextArea/CLTextArea.css +1 -1
  52. package/dist/components/Form/CLTextArea/CLTextArea.js +21 -20
  53. package/dist/components/Form/utils.d.ts +51 -4
  54. package/dist/components/Indicators/CLBadge/CLBadge.css +1 -1
  55. package/dist/components/Indicators/CLBadge/CLBadge.js +12 -11
  56. package/dist/components/Indicators/CLBanner/CLBanner.css +1 -1
  57. package/dist/components/Indicators/CLBanner/CLBanner.js +27 -26
  58. package/dist/components/Indicators/CLPill/CLPill.css +1 -1
  59. package/dist/components/Indicators/CLPill/CLPill.js +1 -1
  60. package/dist/components/Indicators/CLProgress/CLProgress.css +1 -1
  61. package/dist/components/Indicators/CLProgress/CLProgress.js +1 -1
  62. package/dist/components/Indicators/utils.d.ts +31 -4
  63. package/dist/components/Loading/CLSkeleton/CLSkeleton.css +1 -1
  64. package/dist/components/Loading/CLSkeleton/CLSkeleton.js +1 -1
  65. package/dist/components/Loading/CLSpinner/CLSpinner.css +1 -1
  66. package/dist/components/Loading/CLSpinner/CLSpinner.js +1 -1
  67. package/dist/components/Loading/utils.d.ts +7 -2
  68. package/dist/components/Modals/CLModal/CLModal.css +1 -1
  69. package/dist/components/Modals/CLModal/CLModal.js +82 -78
  70. package/dist/components/Modals/utils.d.ts +5 -1
  71. package/dist/components/Navigation/CLLink/CLLink.css +1 -1
  72. package/dist/components/Navigation/CLLink/CLLink.js +1 -1
  73. package/dist/components/Navigation/CLNavLink/CLNavLink.js +1 -1
  74. package/dist/components/Navigation/CLNavSection/CLNavSection.js +2 -2
  75. package/dist/components/Navigation/utils.d.ts +8 -1
  76. package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.css +1 -1
  77. package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.js +6 -6
  78. package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.vue.d.ts +3 -3
  79. package/dist/components/Popups/CLToast/CLToast.css +1 -1
  80. package/dist/components/Popups/CLToast/CLToast.js +1 -1
  81. package/dist/components/Popups/utils.d.ts +8 -1
  82. package/dist/components/Providers/CLThemeProvider/utils.d.ts +0 -1
  83. package/dist/components/Providers/CLToastProvider/CLToastProvider.js +1 -1
  84. package/dist/components/Typography/CLHeading/CLHeading.css +1 -1
  85. package/dist/components/Typography/CLHeading/CLHeading.js +1 -1
  86. package/dist/components/Typography/CLText/CLText.css +1 -1
  87. package/dist/components/Typography/CLText/CLText.js +1 -1
  88. package/dist/components/Typography/utils.d.ts +3 -1
  89. package/dist/composables/useTheme.js +17 -16
  90. package/package.json +1 -4
  91. package/dist/chunks/CLIcon.vue_vue_type_style_index_0_lang-B_341q_b.js +0 -84
  92. package/dist/chunks/CLInputMessages.vue_vue_type_style_index_0_lang-DZEfoinY.js +0 -121
  93. package/dist/chunks/CLLink.vue_vue_type_style_index_0_lang-RAFpWIR2.js +0 -60
  94. package/dist/chunks/CLPill.vue_vue_type_style_index_0_lang-UKMQXfI-.js +0 -88
  95. package/dist/chunks/CLToast.vue_vue_type_style_index_0_lang-LiL8p_1M.js +0 -179
  96. package/dist/chunks/utils-B_htczw5.js +0 -30
  97. package/dist/chunks/utils-Bf54TEIp.js +0 -387
  98. package/dist/chunks/utils-CPp2QUlb.js +0 -15
  99. package/dist/chunks/utils-Cm9XP0Vu.js +0 -29
  100. package/dist/chunks/utils-DPwEOLZc.js +0 -26
  101. package/dist/chunks/utils-_aITYXfA.js +0 -73
@@ -1,84 +0,0 @@
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 { g as x, a as z, c as S } from "./utils-Bf54TEIp.js";
4
- import { useTheme as M } from "../composables/useTheme.js";
5
- import { i as $ } from "./helper--hRjZVm6.js";
6
- const b = ({ color: o = h.Neutral }) => {
7
- const { colors: c, darkMode: t } = M(), s = t.value ? f.Light : f.Dark, r = x({
8
- color: o,
9
- colors: c.value,
10
- mode: s,
11
- variant: I.Text
12
- });
13
- return z(S`color: ${r?.textBody};`);
14
- }, E = ["data-testid"], N = ["height", "width"], T = ["href"], j = /* @__PURE__ */ p({
15
- name: "CLIcon",
16
- __name: "CLIcon",
17
- props: {
18
- color: { default: h.Neutral },
19
- name: {},
20
- size: { default: e.Small },
21
- testId: { default: "clll-icon" }
22
- },
23
- setup(o) {
24
- y((n) => ({
25
- v18b705a2: s[n.size] + "px"
26
- }));
27
- const c = o, t = "clll-icon", s = {
28
- [e.Tiny]: 20,
29
- [e.Small]: 24,
30
- [e.Medium]: 28,
31
- [e.Large]: 32,
32
- [e.XL]: 36,
33
- [e.XXL]: 40,
34
- [e.XXXL]: 44,
35
- [e.XXXXL]: 48
36
- }, r = v(() => [
37
- t,
38
- `${t}--${c.name}`,
39
- `${t}--${c.size}`
40
- ]), C = async () => {
41
- if (!$) return;
42
- let n = window?.document.getElementById("clll-icons");
43
- if (!n)
44
- try {
45
- const d = (/* @__PURE__ */ Object.assign({
46
- "/src/icons.svg": () => import("./icons-QRYZHNAf.js").then((g) => g.default)
47
- }))["/src/icons.svg"];
48
- if (!d) {
49
- console.warn("[Callaloo] Icon sprite not found");
50
- return;
51
- }
52
- const L = await d();
53
- if (n = window?.document.getElementById("clll-icons"), n) return;
54
- const i = window?.document.createElement("div");
55
- i.id = "clll-icons", i.style.display = "none", i.innerHTML = L.toString(), window?.document.readyState === "loading" ? window.addEventListener("DOMContentLoaded", () => {
56
- window?.document.body.insertBefore(i, window?.document.body.childNodes[0]);
57
- }) : window?.document.body.insertBefore(i, window?.document.body.childNodes[0]);
58
- } catch (l) {
59
- console.error("[Callaloo] Failed to load icon sprite:", l);
60
- }
61
- };
62
- return X(() => {
63
- C();
64
- }), (n, l) => (m(), a("span", {
65
- class: u([w(r), w(b)({ color: o.color })]),
66
- "data-testid": o.testId
67
- }, [
68
- (m(), a("svg", {
69
- "aria-hidden": "true",
70
- class: u(`${t}-sprite`),
71
- height: s[o.size],
72
- width: s[o.size],
73
- viewBox: "0 0 24 24"
74
- }, [
75
- B("use", {
76
- href: `#${o.name}`
77
- }, null, 8, T)
78
- ], 10, N))
79
- ], 10, E));
80
- }
81
- });
82
- export {
83
- j as _
84
- };
@@ -1,121 +0,0 @@
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 { useTheme as L } from "../composables/useTheme.js";
4
- import { g as w, c as r, b as q, f as M, a as S } from "./utils-Bf54TEIp.js";
5
- const B = "clll-form-field", m = /* @__PURE__ */ G({
6
- __name: "CLFormField",
7
- props: {
8
- fluid: { type: Boolean },
9
- hasPill: { type: Boolean },
10
- hasCharCounter: { type: Boolean },
11
- orientation: {}
12
- },
13
- setup(e) {
14
- return (l, s) => (R(), W("div", {
15
- class: O([
16
- B,
17
- e.fluid || e.orientation === E(J).Horizontal ? `${B}--fluid` : `${B}--fixed`,
18
- e.orientation ? `${B}--${e.orientation}` : "",
19
- e.hasPill ? `${B}--haspill` : "",
20
- e.hasCharCounter ? `${B}--hascharcounter` : ""
21
- ])
22
- }, [
23
- N(l.$slots, "default")
24
- ], 2));
25
- }
26
- }), ll = ({
27
- color: e,
28
- component: l,
29
- disabled: s,
30
- variant: a
31
- }) => {
32
- const { borderRadius: c, colors: b, darkMode: f } = L(), h = f.value ? x.Dark : x.Light, i = w({
33
- color: e,
34
- colors: b.value,
35
- mode: h,
36
- variant: n.Solid
37
- }), d = w({
38
- color: e,
39
- colors: b.value,
40
- mode: h,
41
- variant: n.Outline
42
- }), 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;
43
- let o, p, D;
44
- 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};}}}`);
45
- 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: $ })}}`;
46
- return S(T, o, p, D);
47
- }, el = ({
48
- color: e,
49
- component: l,
50
- disabled: s,
51
- readonly: a,
52
- variant: c
53
- }) => {
54
- const { borderRadius: b, colors: f, darkMode: h } = L(), i = h.value ? x.Dark : x.Light, d = w({
55
- color: e,
56
- colors: f.value,
57
- mode: i,
58
- variant: n.Solid
59
- }), t = w({
60
- color: e,
61
- colors: f.value,
62
- mode: i,
63
- variant: n.Outline
64
- }), $ = 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;
65
- let p, D, T, F;
66
- 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}`);
67
- 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}}}`;
68
- return S(V, p, D, T, F);
69
- }, Q = ({ color: e }) => {
70
- const { colors: l, darkMode: s } = L(), a = s.value ? x.Dark : x.Light, c = w({
71
- color: e,
72
- colors: l.value,
73
- mode: a,
74
- variant: n.Outline
75
- });
76
- return S(r`&.clll-input__message--${e}{color:${c?.textBody};}`);
77
- }, ol = ({ color: e, disabled: l, variant: s }) => {
78
- const { borderRadius: a, colors: c, darkMode: b } = L(), f = b.value ? x.Dark : x.Light, h = w({
79
- color: e,
80
- colors: c.value,
81
- mode: f,
82
- variant: n.Solid
83
- }), i = w({
84
- color: e,
85
- colors: c.value,
86
- mode: f,
87
- variant: n.Outline
88
- }), 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;
89
- let k, v, o;
90
- 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;}}}}`);
91
- 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};}}}
92
- `;
93
- return S(p, k, v, o);
94
- }, z = () => {
95
- const { colors: e, darkMode: l } = L();
96
- 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;`;
97
- }, P = "clll-input__message", rl = /* @__PURE__ */ G({
98
- __name: "CLInputMessages",
99
- props: {
100
- id: {},
101
- messages: {},
102
- messageType: { default: K.Neutral }
103
- },
104
- setup(e) {
105
- return (l, s) => (R(!0), W(A, null, H(e.messages, (a, c) => (R(), W("span", {
106
- key: `${e.id}-message-${c}`,
107
- class: O([P, `${P}--${e.messageType}`, E(Q)({ color: e.messageType })])
108
- }, [
109
- I("span", {
110
- class: O([`${P}__text`])
111
- }, j(a), 3)
112
- ], 2))), 128));
113
- }
114
- });
115
- export {
116
- m as _,
117
- rl as a,
118
- ll as c,
119
- el as i,
120
- ol as s
121
- };
@@ -1,60 +0,0 @@
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-B_341q_b.js";
3
- import { CLMode as u, CLColors as m, CLColorVariants as v, CLLinkTarget as y, CLIconSizes as B, CLIconNames as p } from "../index.js";
4
- import { g as w, a as z, f as I, c as T } from "./utils-Bf54TEIp.js";
5
- import { useTheme as D } from "../composables/useTheme.js";
6
- const H = ({
7
- color: e = m.Primary,
8
- underline: o = !0
9
- }) => {
10
- const { colors: r, darkMode: n } = D(), a = n.value ? u.Dark : u.Light, t = w({
11
- color: e,
12
- colors: r.value,
13
- mode: a,
14
- variant: v.Outline
15
- }), i = t?.border, f = t?.textDisabled, c = t?.textBody, s = n.value ? t?.borderHover : t?.textDisabled;
16
- return z(T`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 ? f : "transparent"};background-color:transparent;color:${s};.clll-text{color:${s};}}${I({ borderColor: c ?? "transparent", shadowColor: t?.shadow ?? "transparent", outlineOffset: "2px", shadowWidth: "--clll-unit-0" })}`);
17
- }, S = ["aria-label", "data-testid", "href", "rel", "target"], P = /* @__PURE__ */ x({
18
- name: "CLLink",
19
- __name: "CLLink",
20
- props: {
21
- ariaLabel: {},
22
- color: { default: m.Primary },
23
- external: { type: Boolean, default: !1 },
24
- href: {},
25
- onClick: {},
26
- rel: { default: "noreferrer noopener" },
27
- target: { default: y.Self },
28
- testId: { default: "clll-link" },
29
- underline: { type: Boolean, default: !0 }
30
- },
31
- setup(e) {
32
- const o = e, r = "clll-link", n = C(() => [
33
- r,
34
- `${r}--${o.color}`,
35
- `${r}--${o.external ? "external" : "internal"}`,
36
- o.underline ? `${r}--underline` : `${r}--nounderline`
37
- ]);
38
- return (a, t) => (d(), k("a", {
39
- "aria-label": e.ariaLabel,
40
- class: b([l(n), l(H)({ color: e.color, underline: e.underline })]),
41
- "data-testid": e.testId,
42
- href: e.href,
43
- rel: e.external ? e.rel : "",
44
- target: e.target,
45
- onClick: t[0] || (t[0] = //@ts-ignore
46
- (...i) => e.onClick && e.onClick(...i))
47
- }, [
48
- L(a.$slots, "default"),
49
- e.external ? (d(), $(l(h), {
50
- key: 0,
51
- color: e.color,
52
- name: l(p).ExternalLink,
53
- size: l(B).Tiny
54
- }, null, 8, ["color", "name", "size"])) : g("", !0)
55
- ], 10, S));
56
- }
57
- });
58
- export {
59
- P as _
60
- };
@@ -1,88 +0,0 @@
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--MP4S4D4.js";
3
- import { _ as m } from "./CLIcon.vue_vue_type_style_index_0_lang-B_341q_b.js";
4
- import { CLColorVariants as z, CLColors as B, CLIconSizes as $ } from "../index.js";
5
- import { p as f } from "./utils-_aITYXfA.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
- };
@@ -1,179 +0,0 @@
1
- import { defineComponent as U, useCssVars as F, ref as b, computed as P, watch as X, onMounted as Z, onUnmounted as j, onBeforeUnmount as p, createElementBlock as k, openBlock as u, normalizeStyle as q, normalizeClass as c, unref as a, createElementVNode as g, createBlock as x, createCommentVNode as $, createVNode as L, withCtx as z, createTextVNode as S, toDisplayString as _, isRef as G } from "vue";
2
- import { _ as M } from "./CLButton.vue_vue_type_style_index_0_lang--MP4S4D4.js";
3
- import { _ as J } from "./CLIcon.vue_vue_type_style_index_0_lang-B_341q_b.js";
4
- import { _ as K } from "./CLProgress.vue_vue_type_style_index_0_lang-BMozy0NJ.js";
5
- import { _ as O } from "./CLText.vue_vue_type_style_index_0_lang-CG6043pv.js";
6
- import { _ as Q } from "./CLHeading.vue_vue_type_style_index_0_lang-BO5OiCE-.js";
7
- import { CLMode as R, CLColorVariants as N, CLToastPosition as W, CLIconSizes as B, CLColors as C, CLHeadingTypes as Y, CLTextTypes as I, CLSizes as w, CLIconNames as ee } from "../index.js";
8
- import { i as A, g as te, a as oe } from "./helper--hRjZVm6.js";
9
- import { useEsc as ae } from "../composables/useEsc.js";
10
- import { g as se, c as E, a as ie } from "./utils-Bf54TEIp.js";
11
- import { useTheme as le } from "../composables/useTheme.js";
12
- const ne = ({ color: e, variant: t }) => {
13
- const { borderRadius: y, colors: d, darkMode: n } = le(), s = n.value ? R.Dark : R.Light, r = se({
14
- color: e,
15
- colors: d.value,
16
- mode: s,
17
- variant: t
18
- }), T = n.value ? "black" : "white";
19
- let m;
20
- return y.value && (m = E`&:not([class*='clll-toast--rounded-']){&.clll-toast.clll-toast--rounded{border-radius:var(--clll-${y.value});}}`), ie(E`background-color:${T};color:${r?.text};.clll-toast__body{.clll-toast__content{.clll-toast__icon{background-color:${r?.bg ?? "transparent"};.clll-icon{color:${r?.text};}}}}.clll-toast__timer-bar{background-color:${r?.textDisabled};}`, m);
21
- }, re = ["data-testid"], f = 300, o = "clll-toast", Te = /* @__PURE__ */ U({
22
- name: "CLToast",
23
- __name: "CLToast",
24
- props: {
25
- actionLabel: {},
26
- borderRadius: {},
27
- color: { default: C.Secondary },
28
- dismissTimer: { default: 5 },
29
- icon: {},
30
- iconSize: { default: B.Small },
31
- message: {},
32
- onAction: {},
33
- onDismiss: {},
34
- position: { default: W.TopRight },
35
- rounded: { type: Boolean, default: !0 },
36
- testId: { default: "clll-toast" },
37
- title: {},
38
- variant: { default: N.Soft },
39
- width: { default: "24rem" }
40
- },
41
- setup(e) {
42
- F((i) => ({
43
- v1fbbc974: i.width
44
- }));
45
- const t = e, y = b(), d = b(100), n = b(!1), s = b(), r = b(0), T = P(() => [
46
- o,
47
- t.borderRadius ? `${o}--${t.borderRadius}` : "",
48
- t.dismissTimer ? `${o}--has-timer` : "",
49
- t.icon ? `${o}--has-icon` : "",
50
- t.message && !t.title ? `${o}--has-messageonly` : "",
51
- n.value ? `${o}--mounted` : "",
52
- t.onAction && t.actionLabel ? `${o}--has-action` : "",
53
- t.rounded ? `${o}--rounded` : `${o}--box`,
54
- t.title && !t.message ? `${o}--has-titleonly` : "",
55
- t.title && t.message ? `${o}--has-titleandmessage` : "",
56
- `${o}--${t.position}`
57
- ]), m = () => {
58
- n.value = !1, s.value && (s.value.stop(), s.value.start(f, (i) => {
59
- Math.min(i, f) === f && (s.value?.stop(), t.onDismiss?.());
60
- })), V();
61
- }, H = () => {
62
- const i = t.dismissTimer * 1e3, l = i / 100;
63
- s.value?.start(i, (v) => {
64
- const h = Math.min(v / 100, l);
65
- d.value = 100 - h / l * 100, h === l && m();
66
- });
67
- }, D = () => {
68
- s.value || (s.value = oe(), s.value.start(100, (i) => {
69
- Math.min(i, 100) === 100 && (s.value?.stop(), n.value = !0, t?.dismissTimer && s.value?.start(f, (v) => {
70
- Math.min(v, f) === f && (s.value?.stop(), H());
71
- }));
72
- }));
73
- };
74
- X(t, () => {
75
- s.value && (s.value.stop(), s.value = void 0), t?.dismissTimer && D();
76
- }), Z(() => {
77
- A && (r.value = te() + 1, D());
78
- }), j(() => {
79
- A && t?.dismissTimer && s.value && (s.value.stop(), s.value = void 0), n.value = !1, t.onDismiss?.();
80
- });
81
- const { clearEventListeners: V } = ae({ escHandler: m });
82
- return p(() => {
83
- V();
84
- }), (i, l) => (u(), k("output", {
85
- ref_key: "elem",
86
- ref: y,
87
- class: c([a(T), a(ne)({ color: e.color, variant: e.variant })]),
88
- "data-testid": e.testId,
89
- style: q({ zIndex: a(r) })
90
- }, [
91
- g("div", {
92
- class: c(`${o}__body`)
93
- }, [
94
- g("div", {
95
- class: c(`${o}__content`)
96
- }, [
97
- e.icon ? (u(), k("div", {
98
- key: 0,
99
- class: c(`${o}__icon`)
100
- }, [
101
- L(a(J), {
102
- name: e.icon,
103
- size: e.iconSize
104
- }, null, 8, ["name", "size"])
105
- ], 2)) : $("", !0),
106
- g("div", {
107
- class: c(`${o}__text`)
108
- }, [
109
- e.title ? (u(), x(a(Q), {
110
- key: 0,
111
- color: a(C).Neutral,
112
- "test-id": `${o}__title`,
113
- type: a(Y).Section
114
- }, {
115
- default: z(() => [
116
- S(_(e.title), 1)
117
- ]),
118
- _: 1
119
- }, 8, ["color", "test-id", "type"])) : $("", !0),
120
- e.message ? (u(), x(a(O), {
121
- key: 1,
122
- color: a(C).Neutral,
123
- "test-id": `${o}__message`,
124
- type: e.title ? a(I).Medium : a(I).Body
125
- }, {
126
- default: z(() => [
127
- S(_(e.message), 1)
128
- ]),
129
- _: 1
130
- }, 8, ["color", "test-id", "type"])) : $("", !0)
131
- ], 2),
132
- e.onAction && e.actionLabel ? (u(), k("div", {
133
- key: 1,
134
- class: c(`${o}__action-button`)
135
- }, [
136
- L(a(M), {
137
- color: e.color,
138
- "border-radius": e.borderRadius,
139
- "on-click": e.onAction,
140
- "test-id": `${o}__action-button`,
141
- variant: e.variant
142
- }, {
143
- default: z(() => [
144
- S(_(e.actionLabel), 1)
145
- ]),
146
- _: 1
147
- }, 8, ["color", "border-radius", "on-click", "test-id", "variant"])
148
- ], 2)) : $("", !0)
149
- ], 2),
150
- g("div", {
151
- class: c(`${o}__dismiss-button`)
152
- }, [
153
- L(a(M), {
154
- "aria-label": "Dismiss toast",
155
- color: a(C).Neutral,
156
- "border-radius": e.borderRadius,
157
- "icon-before": a(ee).Delete,
158
- "icon-size": a(B).Tiny,
159
- "on-click": m,
160
- size: a(w).Tiny,
161
- "test-id": `${o}__dismiss-button`,
162
- variant: a(N).Text
163
- }, null, 8, ["color", "border-radius", "icon-before", "icon-size", "size", "test-id", "variant"])
164
- ], 2)
165
- ], 2),
166
- e.dismissTimer ? (u(), x(a(K), {
167
- key: 0,
168
- modelValue: a(d),
169
- "onUpdate:modelValue": l[0] || (l[0] = (v) => G(d) ? d.value = v : null),
170
- color: e.color,
171
- rounded: !1,
172
- size: a(w).Small
173
- }, null, 8, ["modelValue", "color", "size"])) : $("", !0)
174
- ], 14, re));
175
- }
176
- });
177
- export {
178
- Te as _
179
- };
@@ -1,30 +0,0 @@
1
- import { CLMode as c, CLColorVariants as n } from "../index.js";
2
- import { g as b, c as d, a as h, f as p } from "./utils-Bf54TEIp.js";
3
- import { useTheme as g } from "../composables/useTheme.js";
4
- const $ = ({ color: t, variant: r }) => {
5
- const { borderRadius: o, colors: a, darkMode: u } = g(), i = u.value ? c.Dark : c.Light, s = r === n.Ghost, l = b({
6
- color: t,
7
- colors: a.value,
8
- mode: i,
9
- variant: r
10
- });
11
- let e;
12
- return o.value && (e = d`&:not([class*='clll-card--rounded-']){&.clll-card.clll-card--rounded{border-radius:var(--clll-${o.value})}}`), h(
13
- d`border-color:${s ? "transparent" : l?.border};background-color:${l?.bg};&.clll-card--has-link{${p({ borderColor: l?.focus, shadowColor: l?.shadow, outlineOffset: "2px", shadowWidth: "--clll-unit-0" })}}.clll-card__image{background-color:${l?.bg}}.clll-card__heading,.clll-card__byline{color:${l?.text}}`,
14
- e
15
- );
16
- }, v = ({ color: t, variant: r }) => {
17
- const { borderRadius: o, colors: a, darkMode: u } = g(), i = u.value ? c.Dark : c.Light, s = r === n.Ghost, l = b({
18
- color: t,
19
- colors: a.value,
20
- mode: i,
21
- variant: r
22
- });
23
- let e;
24
- return o.value && (e = d`&:not([class*='clll-disclosure--rounded-']){&.clll-disclosure.clll-disclosure--rounded{border-radius:var(--clll-${o.value});.clll-disclosure__trigger{.clll-button.clll-button--rounded{border-radius:var(--clll-${o.value})}}}}
25
- `), h(d`border-color:${s ? "transparent" : l?.focus};border-style:solid;border-width:1px;.clll-disclosure__heading{.clll-heading,.clll-text{color:${l?.text};}}.clll-disclosure__content{border-top-width:1px;border-top-style:solid;border-top-color:${s ? "transparent" : l?.focus};}.clll-disclosure__trigger{.clll-button{border:0;}}`, e);
26
- };
27
- export {
28
- $ as c,
29
- v as d
30
- };