@codeandfunction/callaloo 4.9.4 → 4.9.6

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 (106) hide show
  1. package/dist/callaloo.global.js +1 -1
  2. package/dist/chunks/CLA11yButton.vue_vue_type_style_index_0_lang-BHF3fJsf.js +2 -0
  3. package/dist/chunks/CLButton.vue_vue_type_style_index_0_lang-hEXnJ7H1.js +2 -0
  4. package/dist/chunks/CLCalendar.vue_vue_type_style_index_0_lang-BqrGuMVB.js +2 -0
  5. package/dist/chunks/CLCard.vue_vue_type_style_index_0_lang-BGKjh5vA.js +2 -0
  6. package/dist/chunks/CLFormCharCounter.vue_vue_type_style_index_0_lang-BYHbqaf0.js +2 -0
  7. package/dist/chunks/CLFormLabel.vue_vue_type_script_setup_true_lang-BPwFZq94.js +1 -0
  8. package/dist/chunks/CLHeading.vue_vue_type_style_index_0_lang-CsmrsD6c.js +2 -0
  9. package/dist/chunks/CLIcon.vue_vue_type_style_index_0_lang-Cjt6fX90.js +2 -0
  10. package/dist/chunks/CLInputMessages.vue_vue_type_style_index_0_lang-DCByJ7MB.js +2 -0
  11. package/dist/chunks/CLLink.vue_vue_type_style_index_0_lang-C9_EwMBi.js +2 -0
  12. package/dist/chunks/CLModal.vue_vue_type_style_index_0_lang-DroQPRWC.js +2 -0
  13. package/dist/chunks/CLNavLink.vue_vue_type_script_setup_true_lang-Dqr8A_2Z.js +1 -0
  14. package/dist/chunks/CLPill.vue_vue_type_style_index_0_lang-DCtH-u0_.js +2 -0
  15. package/dist/chunks/CLSkeleton.vue_vue_type_style_index_0_lang-BmjT9fQ_.js +2 -0
  16. package/dist/chunks/CLSpinner.vue_vue_type_style_index_0_lang-DgZLt9T1.js +2 -0
  17. package/dist/chunks/CLText.vue_vue_type_style_index_0_lang-CMXJdE-D.js +2 -0
  18. package/dist/chunks/CLToast.vue_vue_type_style_index_0_lang-CtXJMlF9.js +2 -0
  19. package/dist/chunks/context-CRxE5KWX.js +1 -0
  20. package/dist/chunks/context-JmPivI9V.js +1 -0
  21. package/dist/chunks/floating-ui.vue-C0JWy0Dz.js +1 -0
  22. package/dist/chunks/helper-C542dSLs.js +1 -0
  23. package/dist/chunks/icons-6SVrmx7c.js +1 -0
  24. package/dist/chunks/utils-C1iUBPIL.js +1 -0
  25. package/dist/chunks/utils-CCWSWRuR.js +1 -0
  26. package/dist/chunks/utils-CYywa195.js +1 -0
  27. package/dist/chunks/utils-DVxwAjJ4.js +1 -0
  28. package/dist/chunks/utils-Dst7nzvj.js +1 -0
  29. package/dist/chunks/utils-MElq6rY3.js +1 -0
  30. package/dist/components/Buttons/CLA11yButton/CLA11yButton.js +1 -5
  31. package/dist/components/Buttons/CLButton/CLButton.js +1 -5
  32. package/dist/components/CLIcon/CLIcon.js +1 -5
  33. package/dist/components/CLTable/CLTable.js +1 -192
  34. package/dist/components/Containers/CLCard/CLCard.js +1 -5
  35. package/dist/components/Containers/CLCarousel/CLCarousel.js +1 -544
  36. package/dist/components/Containers/CLDisclosure/CLDisclosure.js +1 -139
  37. package/dist/components/Containers/CLDrawer/CLDrawer.js +1 -119
  38. package/dist/components/Form/CLCalendar/CLCalendar.js +1 -5
  39. package/dist/components/Form/CLCheckbox/CLCheckbox.js +1 -150
  40. package/dist/components/Form/CLInput/CLInput.js +1 -450
  41. package/dist/components/Form/CLInputDatePicker/CLInputDatePicker.js +1 -178
  42. package/dist/components/Form/CLRadioButton/CLRadioButton.js +1 -135
  43. package/dist/components/Form/CLSelect/CLSelect.js +1 -140
  44. package/dist/components/Form/CLTextArea/CLTextArea.js +1 -149
  45. package/dist/components/Indicators/CLBadge/CLBadge.js +1 -40
  46. package/dist/components/Indicators/CLBanner/CLBanner.js +1 -145
  47. package/dist/components/Indicators/CLPill/CLPill.js +1 -5
  48. package/dist/components/Indicators/CLProgress/CLProgress.js +1 -64
  49. package/dist/components/Loading/CLSkeleton/CLSkeleton.js +1 -5
  50. package/dist/components/Loading/CLSpinner/CLSpinner.js +1 -5
  51. package/dist/components/Modals/CLModal/CLModal.js +1 -5
  52. package/dist/components/Modals/CLModalDatePicker/CLModalDatePicker.js +1 -182
  53. package/dist/components/Navigation/CLLink/CLLink.js +1 -5
  54. package/dist/components/Navigation/CLNavLink/CLNavLink.js +1 -5
  55. package/dist/components/Navigation/CLNavSection/CLNavSection.js +1 -54
  56. package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.js +1 -150
  57. package/dist/components/Popups/CLToast/CLToast.js +1 -5
  58. package/dist/components/Providers/CLThemeProvider/CLThemeProvider.js +1 -8
  59. package/dist/components/Providers/CLToastProvider/CLToastProvider.js +1 -7
  60. package/dist/components/Typography/CLHeading/CLHeading.js +1 -5
  61. package/dist/components/Typography/CLText/CLText.js +1 -5
  62. package/dist/composables/useDateInputMask.js +1 -38
  63. package/dist/composables/useDatePicker.js +1 -140
  64. package/dist/composables/useDropdown.js +1 -49
  65. package/dist/composables/useElementSize.js +1 -73
  66. package/dist/composables/useEsc.js +1 -19
  67. package/dist/composables/useHasSlotContent.js +1 -14
  68. package/dist/composables/useTheme.js +1 -40
  69. package/dist/composables/useToast.js +1 -17
  70. package/dist/index.js +1 -30
  71. package/package.json +20 -20
  72. package/dist/chunks/CLA11yButton.vue_vue_type_style_index_0_lang-zGLnnSIW.js +0 -47
  73. package/dist/chunks/CLButton.vue_vue_type_style_index_0_lang-MvhnNzVW.js +0 -136
  74. package/dist/chunks/CLCalendar.vue_vue_type_style_index_0_lang-Bz1JdT1A.js +0 -163
  75. package/dist/chunks/CLCard.vue_vue_type_style_index_0_lang-Sre7UYZd.js +0 -263
  76. package/dist/chunks/CLFormCharCounter.vue_vue_type_style_index_0_lang-CJ4VrvmR.js +0 -39
  77. package/dist/chunks/CLFormLabel.vue_vue_type_script_setup_true_lang-CIQxM6aH.js +0 -46
  78. package/dist/chunks/CLHeading.vue_vue_type_style_index_0_lang-DH5oJc1C.js +0 -52
  79. package/dist/chunks/CLIcon.vue_vue_type_style_index_0_lang-Dhr2tI-g.js +0 -113
  80. package/dist/chunks/CLInputMessages.vue_vue_type_style_index_0_lang-DTWvAACK.js +0 -149
  81. package/dist/chunks/CLLink.vue_vue_type_style_index_0_lang-BXysZqLn.js +0 -69
  82. package/dist/chunks/CLModal.vue_vue_type_style_index_0_lang-BDyONfaQ.js +0 -176
  83. package/dist/chunks/CLNavLink.vue_vue_type_script_setup_true_lang-Dhnmfa9W.js +0 -44
  84. package/dist/chunks/CLPill.vue_vue_type_style_index_0_lang-BQim03ge.js +0 -94
  85. package/dist/chunks/CLSkeleton.vue_vue_type_style_index_0_lang-DduoX6Cu.js +0 -31
  86. package/dist/chunks/CLSpinner.vue_vue_type_style_index_0_lang-DlXqnsi8.js +0 -55
  87. package/dist/chunks/CLText.vue_vue_type_style_index_0_lang-B-L8ECJL.js +0 -48
  88. package/dist/chunks/CLThemeProvider.vue_vue_type_script_setup_true_lang-jaJYKZL8.js +0 -59
  89. package/dist/chunks/CLToast.vue_vue_type_style_index_0_lang-CzSDeL_X.js +0 -202
  90. package/dist/chunks/CLToastProvider.vue_vue_type_script_setup_true_lang-DkGK0H4Z.js +0 -35
  91. package/dist/chunks/context-CEvx70FY.js +0 -264
  92. package/dist/chunks/context-dkA4VoF7.js +0 -4
  93. package/dist/chunks/floating-ui.vue-Fx4CxKut.js +0 -1057
  94. package/dist/chunks/helper-qUkciePY.js +0 -81
  95. package/dist/chunks/icons-DllZKtC2.js +0 -4
  96. package/dist/chunks/magic-string.es-uPKorP4O.js +0 -663
  97. package/dist/chunks/utils-BfOa9ckr.js +0 -24
  98. package/dist/chunks/utils-BjZURPWx.js +0 -51
  99. package/dist/chunks/utils-C1xiySYN.js +0 -41
  100. package/dist/chunks/utils-D00IXMTR.js +0 -25
  101. package/dist/chunks/utils-eBt2zUZl.js +0 -17
  102. package/dist/chunks/utils-nD3K7jh9.js +0 -85
  103. package/dist/chunks/vue-test-utils.esm-bundler-BeQTU4qG.js +0 -18679
  104. package/dist/composables/useDatePicker.spec.js +0 -232
  105. package/dist/composables/useTheme.spec.js +0 -88
  106. package/dist/composables/useToast.spec.js +0 -45
@@ -1,136 +0,0 @@
1
- import '../components/Buttons/CLButton/CLButton.css';
2
- import { defineComponent as $, useSlots as C, ref as h, computed as L, onMounted as B, nextTick as z, createBlock as n, openBlock as o, resolveDynamicComponent as S, normalizeStyle as g, normalizeClass as s, unref as i, withCtx as k, createCommentVNode as d, createElementBlock as X, renderSlot as w } from "vue";
3
- import { _ as c } from "./CLIcon.vue_vue_type_style_index_0_lang-Dhr2tI-g.js";
4
- import { _ as R } from "./CLSpinner.vue_vue_type_style_index_0_lang-DlXqnsi8.js";
5
- import { CLColorVariants as A, CLButtonTypes as T, CLLinkTarget as F, CLSizes as l, CLIconSizes as I, CLColors as x, CLAlign as m, CLPosition as M } from "../index.js";
6
- import { b as N } from "./utils-C1xiySYN.js";
7
- import { useHasSlotContent as V } from "../composables/useHasSlotContent.js";
8
- const J = /* @__PURE__ */ $({
9
- name: "CLButton",
10
- __name: "CLButton",
11
- props: {
12
- active: { type: Boolean, default: !1 },
13
- alignContent: { default: m.Center },
14
- ariaLabel: { default: void 0 },
15
- as: { default: "button" },
16
- borderRadius: { default: void 0 },
17
- busy: { type: Boolean, default: !1 },
18
- color: { default: x.Neutral },
19
- disabled: { type: Boolean, default: !1 },
20
- elevated: { type: Boolean, default: !1 },
21
- form: { default: void 0 },
22
- forwardRef: { type: Function, default: void 0 },
23
- height: { default: "auto" },
24
- href: { default: void 0 },
25
- iconAfter: { default: void 0 },
26
- iconBefore: { default: void 0 },
27
- iconFilled: { type: Boolean, default: !1 },
28
- iconSize: { default: I.Small },
29
- onClick: { type: Function, default: void 0 },
30
- pill: { type: Boolean, default: !1 },
31
- rounded: { type: Boolean, default: !0 },
32
- size: { default: l.Small },
33
- target: { default: F.Self },
34
- testId: { default: "clll-button" },
35
- title: { default: void 0 },
36
- type: { default: T.Button },
37
- variant: { default: A.Soft },
38
- width: { default: "auto" },
39
- wrap: { type: Boolean, default: !1 }
40
- },
41
- setup(e) {
42
- const t = e, r = V();
43
- C();
44
- const u = h(), a = "clll-button", b = L(() => [
45
- a,
46
- `${a}--${t.type}`,
47
- `${a}--${t.color}--${t.variant}`,
48
- `${a}--${t.size}`,
49
- `${a}--${t.alignContent}`,
50
- t.active ? `${a}--active` : "",
51
- t.busy ? `${a}--busy` : "",
52
- t.disabled ? `${a}--disabled` : "",
53
- t.wrap ? `${a}--wrapped` : "",
54
- t.rounded ? `${a}--rounded` : "",
55
- t.borderRadius ? `${a}--${t.borderRadius}` : "",
56
- r.value ? `${a}--has-content` : `${a}--no-content`,
57
- t.iconBefore ? `${a}--icon-before` : "",
58
- t.iconAfter ? `${a}--icon-after` : "",
59
- t.elevated ? `${a}--elevated` : "",
60
- t.pill ? `${a}--pill` : ""
61
- ]), y = () => {
62
- switch (t.size) {
63
- case l.Medium:
64
- case l.Large:
65
- return l.Small;
66
- case l.XL:
67
- case l.XXL:
68
- return l.Medium;
69
- case l.XXXL:
70
- return l.Large;
71
- case l.XXXXL:
72
- return l.XL;
73
- case l.Tiny:
74
- default:
75
- return l.Tiny;
76
- }
77
- };
78
- B(() => {
79
- z(() => {
80
- u.value && t.forwardRef?.(u.value);
81
- });
82
- });
83
- const v = (f) => {
84
- t.onClick?.(f);
85
- };
86
- return (f, D) => (o(), n(S(e.as), {
87
- ref_key: "buttonRef",
88
- ref: u,
89
- "aria-label": e.ariaLabel,
90
- class: s(i(b)),
91
- "data-testid": e.testId,
92
- disabled: e.as === "button" ? e.busy || e.disabled : void 0,
93
- form: e.as === "button" ? e.form : void 0,
94
- href: e.as === "a" ? e.href : void 0,
95
- target: e.as === "a" ? e.target : void 0,
96
- title: e.title,
97
- type: e.as === "button" ? e.type : void 0,
98
- style: g({ width: e.width, height: e.height, ...i(N)({ color: e.color, variant: e.variant }) }),
99
- onClick: v
100
- }, {
101
- default: k(() => [
102
- e.iconBefore ? (o(), n(i(c), {
103
- key: 0,
104
- filled: e.iconFilled,
105
- name: e.iconBefore,
106
- size: e.iconSize,
107
- "test-id": `${e.testId}-icon-before`
108
- }, null, 8, ["filled", "name", "size", "test-id"])) : d("", !0),
109
- i(r) ? (o(), X("span", {
110
- key: 1,
111
- class: s(`${a}__content`)
112
- }, [
113
- w(f.$slots, "default")
114
- ], 2)) : d("", !0),
115
- e.iconAfter ? (o(), n(i(c), {
116
- key: 2,
117
- filled: e.iconFilled,
118
- name: e.iconAfter,
119
- size: e.iconSize,
120
- "test-id": `${e.testId}-icon-after`
121
- }, null, 8, ["filled", "name", "size", "test-id"])) : d("", !0),
122
- e.busy ? (o(), n(i(R), {
123
- key: 3,
124
- align: i(m).Center,
125
- position: i(M).Absolute,
126
- size: y(),
127
- color: e.color
128
- }, null, 8, ["align", "position", "size", "color"])) : d("", !0)
129
- ]),
130
- _: 3
131
- }, 8, ["aria-label", "class", "data-testid", "disabled", "form", "href", "target", "title", "type", "style"]));
132
- }
133
- });
134
- export {
135
- J as _
136
- };
@@ -1,163 +0,0 @@
1
- import '../components/Form/CLCalendar/CLCalendar.css';
2
- import { defineComponent as Y, mergeModels as w, useCssVars as Z, useModel as ee, ref as S, toRef as ae, watch as te, onMounted as le, createElementBlock as s, openBlock as r, normalizeClass as u, createElementVNode as M, createVNode as f, unref as e, withCtx as h, createTextVNode as v, toDisplayString as C, Fragment as V, renderList as $, createBlock as ie, createCommentVNode as re } from "vue";
3
- import { _ as b } from "./CLButton.vue_vue_type_style_index_0_lang-MvhnNzVW.js";
4
- import { _ as B } from "./CLText.vue_vue_type_style_index_0_lang-B-L8ECJL.js";
5
- import { CLColorVariants as c, CLSizes as k, CLIconSizes as N, CLIconNames as P, CLBorderRadius as _, CLTextTypes as R, CLColors as g, CLAlign as ne } from "../index.js";
6
- import { useDatePicker as oe } from "../composables/useDatePicker.js";
7
- const de = ["data-testid"], ve = /* @__PURE__ */ Y({
8
- name: "CLCalendar",
9
- __name: "CLCalendar",
10
- props: /* @__PURE__ */ w({
11
- color: { default: g.Primary },
12
- disabled: { type: Boolean, default: !1 },
13
- busy: { type: Boolean, default: !1 },
14
- isRange: { type: Boolean, default: !0 },
15
- fluid: { type: Boolean, default: !1 },
16
- testId: { default: "clll-calendar" },
17
- width: { default: "280px" }
18
- }, {
19
- modelValue: {},
20
- modelModifiers: {}
21
- }),
22
- emits: /* @__PURE__ */ w(["date-select"], ["update:modelValue"]),
23
- setup(l, { expose: T, emit: E }) {
24
- Z((t) => ({
25
- v63768322: t.width
26
- }));
27
- const m = l, I = E, i = "clll-calendar", n = ee(l, "modelValue"), o = S(n.value?.end ?? null), d = S(n.value?.start ?? null), {
28
- calendarGrid: F,
29
- cancelDraft: G,
30
- clearDraft: A,
31
- currentMonthLabel: O,
32
- draftEnd: D,
33
- draftStart: x,
34
- getDayAriaLabel: j,
35
- handleNextMonth: q,
36
- handlePrevMonth: H,
37
- initializeDraft: p,
38
- isDraftEnd: z,
39
- isDraftStart: L,
40
- isInDraftRange: J,
41
- onDayClick: K,
42
- weekDays: Q
43
- } = oe({
44
- appliedEnd: o,
45
- appliedStart: d,
46
- isRange: ae(m, "isRange")
47
- });
48
- te(n, (t) => {
49
- d.value = t?.start ?? null, o.value = t?.end ?? null, p();
50
- }, { deep: !0 }), le(() => {
51
- p();
52
- });
53
- const U = (t, y) => {
54
- y?.preventDefault(), y?.stopPropagation(), !(m.disabled || m.busy || !t) && (K(t), I("date-select", t));
55
- };
56
- return T({
57
- apply: () => {
58
- d.value = x.value, o.value = D.value, n.value = {
59
- end: o.value,
60
- start: d.value
61
- };
62
- },
63
- cancel: () => {
64
- G();
65
- },
66
- draftEnd: D,
67
- draftStart: x,
68
- initializeDraft: p,
69
- reset: () => {
70
- A(), d.value = null, o.value = null, n.value = null;
71
- }
72
- }), (t, y) => (r(), s("div", {
73
- class: u([i, l.fluid ? `${i}__fluid` : ""]),
74
- "data-testid": l.testId
75
- }, [
76
- M("div", {
77
- class: u(`${i}__header`)
78
- }, [
79
- f(e(b), {
80
- "aria-label": "Previous month",
81
- "border-radius": e(_).Full,
82
- "icon-before": e(P).ChevronLeft,
83
- "icon-size": e(N).Tiny,
84
- "on-click": e(H),
85
- size: e(k).Tiny,
86
- variant: e(c).Ghost,
87
- height: "32px",
88
- width: "32px",
89
- wrap: ""
90
- }, null, 8, ["border-radius", "icon-before", "icon-size", "on-click", "size", "variant"]),
91
- f(e(B), {
92
- type: e(R).Medium,
93
- medium: ""
94
- }, {
95
- default: h(() => [
96
- v(C(e(O)), 1)
97
- ]),
98
- _: 1
99
- }, 8, ["type"]),
100
- f(e(b), {
101
- "aria-label": "Next month",
102
- "border-radius": e(_).Full,
103
- "icon-before": e(P).ChevronRight,
104
- "icon-size": e(N).Tiny,
105
- "on-click": e(q),
106
- size: e(k).Tiny,
107
- variant: e(c).Ghost,
108
- height: "32px",
109
- width: "32px",
110
- wrap: ""
111
- }, null, 8, ["border-radius", "icon-before", "icon-size", "on-click", "size", "variant"])
112
- ], 2),
113
- M("div", {
114
- class: u(`${i}__grid`)
115
- }, [
116
- (r(!0), s(V, null, $(e(Q), (a) => (r(), s("div", {
117
- key: a,
118
- class: u(`${i}__weekday`)
119
- }, [
120
- f(e(B), {
121
- align: e(ne).Center,
122
- color: e(g).Neutral,
123
- type: e(R).Small
124
- }, {
125
- default: h(() => [
126
- v(C(a), 1)
127
- ]),
128
- _: 2
129
- }, 1032, ["align", "color", "type"])
130
- ], 2))), 128)),
131
- (r(!0), s(V, null, $(e(F), (a, W) => (r(), s("div", {
132
- key: a.date ?? `pad-${W}`,
133
- class: u([
134
- `${i}__cell`,
135
- a.isOutsideMonth ? `${i}__cell--outside` : ""
136
- ])
137
- }, [
138
- a.day && a.date ? (r(), ie(e(b), {
139
- key: 0,
140
- "aria-label": e(j)(a.date),
141
- "border-radius": e(_).Full,
142
- color: e(L)(a.date) || e(z)(a.date) ? l.color : e(g).Secondary,
143
- disabled: l.disabled || l.busy,
144
- size: e(k).Small,
145
- height: "100%",
146
- width: "100%",
147
- "on-click": (X) => U(a.date, X),
148
- variant: e(L)(a.date) || e(z)(a.date) ? e(c).Solid : e(J)(a.date) ? e(c).Soft : e(c).Ghost,
149
- wrap: ""
150
- }, {
151
- default: h(() => [
152
- v(C(a.day), 1)
153
- ]),
154
- _: 2
155
- }, 1032, ["aria-label", "border-radius", "color", "disabled", "size", "on-click", "variant"])) : re("", !0)
156
- ], 2))), 128))
157
- ], 2)
158
- ], 10, de));
159
- }
160
- });
161
- export {
162
- ve as _
163
- };
@@ -1,263 +0,0 @@
1
- import '../components/Containers/CLCard/CLCard.css';
2
- import { defineComponent as W, useSlots as V, ref as k, computed as I, onMounted as z, nextTick as F, createElementBlock as c, openBlock as i, withKeys as K, normalizeStyle as v, normalizeClass as n, unref as l, createCommentVNode as d, createElementVNode as u, createBlock as r, renderSlot as s, Fragment as M, withCtx as b, createTextVNode as C, toDisplayString as L } from "vue";
3
- import { _ as S } from "./CLHeading.vue_vue_type_style_index_0_lang-DH5oJc1C.js";
4
- import { _ as q } from "./CLLink.vue_vue_type_style_index_0_lang-BXysZqLn.js";
5
- import { _ as g } from "./CLSkeleton.vue_vue_type_style_index_0_lang-DduoX6Cu.js";
6
- import { _ as D } from "./CLText.vue_vue_type_style_index_0_lang-B-L8ECJL.js";
7
- import { CLColorVariants as R, CLCardTypes as G, CLHeadingTypes as j, CLHeadingLevels as J, CLLinkTarget as P, CLOverflow as Q, CLLoading as U, CLColors as X, CLAlign as Y, CLOrder as A, CLTextTypes as Z } from "../index.js";
8
- import { c as p } from "./utils-BjZURPWx.js";
9
- import { useHasSlotContent as _ } from "../composables/useHasSlotContent.js";
10
- const ee = ["data-testid", "tabindex"], ae = ["alt", "loading", "src"], te = {
11
- key: 0,
12
- class: "clll-card__header-skeleton"
13
- }, le = ["alt", "loading", "src"], ie = ["aria-label", "href", "target"], he = /* @__PURE__ */ W({
14
- name: "CLCard",
15
- __name: "CLCard",
16
- props: {
17
- active: { type: Boolean, default: !1 },
18
- align: { default: Y.Left },
19
- ariaLabel: {},
20
- borderRadius: {},
21
- bordered: { type: Boolean, default: !0 },
22
- busy: { type: Boolean, default: !1 },
23
- byline: {},
24
- color: { default: X.Neutral },
25
- compact: { type: Boolean, default: !1 },
26
- elevated: { type: Boolean, default: !1 },
27
- forwardRef: {},
28
- height: { default: "auto" },
29
- href: {},
30
- image: {},
31
- imageAltText: { default: "" },
32
- imageHeight: { default: "auto" },
33
- imageLoading: { default: U.Eager },
34
- imageOrder: {},
35
- imageWidth: { default: "auto" },
36
- onClick: {},
37
- overflow: { default: Q.Hidden },
38
- padded: { type: Boolean, default: !0 },
39
- rounded: { type: Boolean, default: !0 },
40
- target: { default: P.Self },
41
- testId: { default: "clll-card" },
42
- title: {},
43
- titleHLevel: { default: J.H2 },
44
- titleType: { default: j.SubSection },
45
- truncateTitle: { type: Boolean, default: !1 },
46
- type: { default: G.Medium },
47
- variant: { default: R.Soft },
48
- width: { default: "auto" }
49
- },
50
- setup(e) {
51
- const a = "clll-card", t = e, w = _(), T = V(), f = k(), $ = k(), E = ["a", "button"], y = k(), O = I(() => [
52
- a,
53
- `${a}--${t.type}`,
54
- `${a}--${t.color}-${t.variant}`,
55
- `${a}--${t.variant}`,
56
- `${a}--align-${t.align}`,
57
- t.rounded ? `${a}--rounded` : `${a}--box`,
58
- t.bordered ? `${a}--bordered` : "",
59
- t.borderRadius ? `${a}--${t.borderRadius}` : "",
60
- t.busy ? `${a}--busy` : `${a}--ready`,
61
- t.compact ? `${a}--compact` : `${a}--no-compact`,
62
- t.title || t.byline ? `${a}--has-header` : `${a}--no-header`,
63
- f.value ? `${a}--has-heading` : `${a}--no-heading`,
64
- w.value ? `${a}--has-content` : `${a}--no-content`,
65
- $.value ? `${a}--has-footer` : `${a}--no-footer`,
66
- t.image ? `${a}--has-image` : `${a}--has-no-image`,
67
- t.imageOrder ? `${a}--image-${t.imageOrder}` : "",
68
- t.active ? `${a}--active` : `${a}--inactive`,
69
- t.onClick ? `${a}--has-link` : "",
70
- t.truncateTitle ? `${a}--has-truncated-title` : "",
71
- t.elevated ? `${a}--elevated` : "",
72
- t.overflow ? `${a}--overflow-${t.overflow}` : "",
73
- t.padded ? "" : `${a}--no-padding`
74
- ]), x = (o) => {
75
- if (t.busy || !t.onClick) return;
76
- const { target: h } = o, m = h ? h.closest("a,button") : void 0, H = [
77
- ...y.value?.querySelectorAll("[data-expand-click-area]") ?? []
78
- ];
79
- if (H.length) {
80
- const B = H[0], N = m ? E.includes(m.tagName.toLowerCase()) : null;
81
- !m && B !== o.target && !N && B.click();
82
- }
83
- };
84
- return z(async () => {
85
- await F(), y.value && t.forwardRef?.(y.value), f.value = T?.heading, $.value = T?.footer;
86
- }), (o, h) => (i(), c("div", {
87
- ref_key: "refExpandedArea",
88
- ref: y,
89
- class: n(l(O)),
90
- style: v({ ...l(p)({ color: e.color, variant: e.variant }), width: e.width, height: e.height, overflow: e.overflow }),
91
- "data-testid": e.testId,
92
- tabindex: e.onClick ? 0 : void 0,
93
- onClick: x,
94
- onKeyup: K(x, ["enter"])
95
- }, [
96
- e.image && (e.imageOrder === l(A).Before || !e.imageOrder) ? (i(), c("div", {
97
- key: 0,
98
- class: n(["clll-card__image", { busy: e.busy }]),
99
- style: v({ width: e.imageWidth, height: e.imageHeight })
100
- }, [
101
- e.busy ? (i(), r(l(g), {
102
- key: 0,
103
- "border-radius": e.borderRadius,
104
- width: e.imageWidth,
105
- height: e.imageHeight,
106
- rounded: !1
107
- }, null, 8, ["border-radius", "width", "height"])) : d("", !0),
108
- e.image ? (i(), c("img", {
109
- key: 1,
110
- alt: e.imageAltText,
111
- class: n(`${a}__image__elem`),
112
- loading: e.imageLoading,
113
- src: e.image
114
- }, null, 10, ae)) : d("", !0)
115
- ], 6)) : d("", !0),
116
- u("div", {
117
- class: n(`${a}__content`)
118
- }, [
119
- u("div", {
120
- class: n(["clll-card__header", { busy: e.busy }])
121
- }, [
122
- e.busy && (l(f) || e.title || e.byline) ? (i(), c("div", te, [
123
- l(f) || e.title ? (i(), r(l(g), {
124
- key: 0,
125
- "border-radius": e.borderRadius,
126
- height: "27px"
127
- }, null, 8, ["border-radius"])) : d("", !0),
128
- e.byline ? (i(), r(l(g), {
129
- key: 1,
130
- "border-radius": e.borderRadius,
131
- width: "70%",
132
- height: "20px"
133
- }, null, 8, ["border-radius"])) : d("", !0)
134
- ])) : d("", !0),
135
- !e.onClick && !e.href ? (i(), c(M, { key: 1 }, [
136
- s(o.$slots, "heading"),
137
- e.title ? (i(), r(l(S), {
138
- key: 0,
139
- align: e.align,
140
- class: n(`${a}__heading`),
141
- color: e.color,
142
- level: e.titleHLevel,
143
- truncate: e.truncateTitle,
144
- type: e.titleType
145
- }, {
146
- default: b(() => [
147
- C(L(e.title), 1)
148
- ]),
149
- _: 1
150
- }, 8, ["align", "class", "color", "level", "truncate", "type"])) : d("", !0)
151
- ], 64)) : e.title || l(f) && (e.onClick || e.href) ? (i(), r(l(q), {
152
- key: 2,
153
- "aria-label": e.ariaLabel,
154
- color: e.color,
155
- href: e.href,
156
- target: e.target,
157
- "on-click": e.onClick,
158
- "data-expand-click-area": ""
159
- }, {
160
- default: b(() => [
161
- s(o.$slots, "heading"),
162
- e.title ? (i(), r(l(S), {
163
- key: 0,
164
- align: e.align,
165
- class: n(`${a}__heading`),
166
- color: e.color,
167
- level: e.titleHLevel,
168
- truncate: e.truncateTitle,
169
- type: e.titleType
170
- }, {
171
- default: b(() => [
172
- C(L(e.title), 1)
173
- ]),
174
- _: 1
175
- }, 8, ["align", "class", "color", "level", "truncate", "type"])) : d("", !0)
176
- ]),
177
- _: 3
178
- }, 8, ["aria-label", "color", "href", "target", "on-click"])) : d("", !0),
179
- s(o.$slots, "byline"),
180
- e.byline ? (i(), r(l(D), {
181
- key: 3,
182
- align: e.align,
183
- class: n(`${a}__byline`),
184
- color: e.color,
185
- type: l(Z).Small
186
- }, {
187
- default: b(() => [
188
- C(L(e.byline), 1)
189
- ]),
190
- _: 1
191
- }, 8, ["align", "class", "color", "type"])) : d("", !0)
192
- ], 2),
193
- u("div", {
194
- class: n(`${a}__slot`)
195
- }, [
196
- u("div", {
197
- ref: "slot-content",
198
- class: n([`${a}__slot-content`, { busy: e.busy }])
199
- }, [
200
- l(w) && e.busy ? (i(), r(l(g), {
201
- key: 0,
202
- "border-radius": e.borderRadius,
203
- width: "100%",
204
- height: "100%"
205
- }, null, 8, ["border-radius"])) : d("", !0),
206
- u("div", null, [
207
- s(o.$slots, "default")
208
- ])
209
- ], 2)
210
- ], 2),
211
- u("div", {
212
- class: n(["clll-card__footer", { busy: e.busy }])
213
- }, [
214
- l($) && e.busy ? (i(), r(l(g), {
215
- key: 0,
216
- "border-radius": e.borderRadius,
217
- width: "100%",
218
- height: "20px"
219
- }, null, 8, ["border-radius"])) : d("", !0),
220
- s(o.$slots, "footer")
221
- ], 2)
222
- ], 2),
223
- e.image && e.imageOrder === l(A).After ? (i(), c("div", {
224
- key: 1,
225
- class: n(["clll-card__image", { busy: e.busy }]),
226
- style: v({ width: e.imageWidth, height: e.imageHeight })
227
- }, [
228
- e.busy ? (i(), r(l(g), {
229
- key: 0,
230
- "border-radius": e.borderRadius,
231
- width: e.imageWidth,
232
- height: e.imageHeight,
233
- rounded: !1
234
- }, null, 8, ["border-radius", "width", "height"])) : d("", !0),
235
- s(o.$slots, "image"),
236
- e.image ? (i(), c("img", {
237
- key: 1,
238
- alt: e.imageAltText,
239
- class: n(`${a}__image__elem`),
240
- loading: e.imageLoading,
241
- src: e.image
242
- }, null, 10, le)) : d("", !0)
243
- ], 6)) : d("", !0),
244
- !e.title && (e.onClick || e.href) ? (i(), c("a", {
245
- key: 2,
246
- "aria-label": e.ariaLabel,
247
- class: "sr-only",
248
- href: e.href,
249
- target: e.target,
250
- "data-expand-click-area": "",
251
- onClick: h[0] || (h[0] = //@ts-ignore
252
- (...m) => e.onClick && e.onClick(...m))
253
- }, null, 8, ie)) : d("", !0),
254
- e.onClick && e.variant !== l(R).Ghost ? (i(), c("div", {
255
- key: 3,
256
- class: n(`${a}__hover-elem`)
257
- }, null, 2)) : d("", !0)
258
- ], 46, ee));
259
- }
260
- });
261
- export {
262
- he as _
263
- };
@@ -1,39 +0,0 @@
1
- import '../assets/CLFormCharCounter.css';
2
- import { defineComponent as l, computed as a, createElementBlock as n, openBlock as s, normalizeClass as u, unref as m, createElementVNode as i, toDisplayString as r } from "vue";
3
- import { CLSizes as f, CLCharCounterLayout as o, CLColors as h } from "../index.js";
4
- const d = ["data-testid"], C = {
5
- "aria-live": "polite",
6
- class: "clll-form-char-counter__char-counter__text",
7
- role: "status"
8
- }, g = /* @__PURE__ */ l({
9
- name: "CLFormCharCounter",
10
- __name: "CLFormCharCounter",
11
- props: {
12
- color: { default: h.Neutral },
13
- cssPrefix: {},
14
- currentLength: {},
15
- layout: { default: o.Block },
16
- maxLength: {},
17
- size: { default: f.Small },
18
- testId: { default: "clll-form-char-counter" }
19
- },
20
- setup(t) {
21
- const e = t, c = a(() => [
22
- `${e.cssPrefix}__char-counter`,
23
- "clll-form-char-counter",
24
- `clll-form-char-counter--${e.layout}`,
25
- `clll-form-char-counter--${e.size}`,
26
- `clll-form-char-counter--${e.color}`,
27
- e.layout === o.Inline ? "form-counter-flex" : ""
28
- ]);
29
- return (_, L) => (s(), n("span", {
30
- class: u(m(c)),
31
- "data-testid": t.testId
32
- }, [
33
- i("div", C, r(t.currentLength) + "/" + r(t.maxLength), 1)
34
- ], 10, d));
35
- }
36
- });
37
- export {
38
- g as _
39
- };
@@ -1,46 +0,0 @@
1
- import { defineComponent as r, createElementBlock as i, openBlock as o, normalizeClass as a, createVNode as m, unref as n, withCtx as c, createTextVNode as d, toDisplayString as f } from "vue";
2
- import { _ as X } from "./CLText.vue_vue_type_style_index_0_lang-B-L8ECJL.js";
3
- import { CLSizes as e, CLTextTypes as l } from "../index.js";
4
- const L = ["for", "data-testid"], S = /* @__PURE__ */ r({
5
- name: "CLFormLabel",
6
- __name: "CLFormLabel",
7
- props: {
8
- cssPrefix: { default: "clll-form" },
9
- htmlFor: {},
10
- label: {},
11
- required: { type: Boolean, default: !1 },
12
- size: { default: e.Small },
13
- testId: { default: "clll-form-label" }
14
- },
15
- setup(t) {
16
- const s = {
17
- [e.Tiny]: l.Tiny,
18
- [e.Small]: l.Small,
19
- [e.Medium]: l.Medium,
20
- [e.Large]: l.Body,
21
- [e.XL]: l.XL,
22
- [e.XXL]: l.XXL,
23
- [e.XXXL]: l.XXXL,
24
- [e.XXXXL]: l.XXXXL
25
- };
26
- return (u, b) => (o(), i("label", {
27
- for: t.htmlFor,
28
- class: a(`${t.cssPrefix}__label`),
29
- "data-testid": t.testId
30
- }, [
31
- m(n(X), {
32
- as: "span",
33
- type: s[t.size],
34
- class: a(t.required ? `${t.cssPrefix}__label--required` : "")
35
- }, {
36
- default: c(() => [
37
- d(f(t.label), 1)
38
- ]),
39
- _: 1
40
- }, 8, ["type", "class"])
41
- ], 10, L));
42
- }
43
- });
44
- export {
45
- S as _
46
- };