@studiolxd/brand 47.1.0 → 48.1.0

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 (59) hide show
  1. package/CHANGELOG.md +161 -0
  2. package/dist/_shared/progressbar.js +19 -18
  3. package/dist/_shared/tokens.js +0 -1
  4. package/dist/_types/atoms/CopyableValue/CopyableValue.d.ts +4 -4
  5. package/dist/_types/atoms/DescriptionList/DescriptionList.d.ts +5 -4
  6. package/dist/_types/atoms/DotsButton/DotsButton.d.ts +15 -0
  7. package/dist/_types/atoms/ProgressBar/ProgressBar.d.ts +12 -2
  8. package/dist/_types/atoms/Slider/Slider.d.ts +19 -2
  9. package/dist/_types/atoms/Spinner/Spinner.d.ts +15 -1
  10. package/dist/_types/constants/copy-to-clipboard.d.ts +22 -0
  11. package/dist/_types/messages/BrandMessages.d.ts +35 -1
  12. package/dist/_types/messages/index.d.ts +1 -1
  13. package/dist/_types/molecules/CalendarPlanner/CalendarPlanner.d.ts +13 -3
  14. package/dist/_types/molecules/CalendarRoster/CalendarRoster.d.ts +38 -5
  15. package/dist/_types/molecules/Carousel/Carousel.d.ts +65 -13
  16. package/dist/_types/molecules/CodeBlock/CodeBlock.d.ts +20 -6
  17. package/dist/_types/molecules/ContextMenu/ContextMenu.d.ts +5 -1
  18. package/dist/_types/molecules/CopyButton/CopyButton.d.ts +5 -6
  19. package/dist/_types/molecules/FilterBar/FilterBar.d.ts +4 -3
  20. package/dist/_types/molecules/LanguageSwitcher/LanguageSwitcher.d.ts +13 -1
  21. package/dist/_types/molecules/NotificationList/NotificationList.d.ts +33 -3
  22. package/dist/_types/molecules/Pagination/Pagination.d.ts +16 -2
  23. package/dist/_types/molecules/ProjectCard/ProjectCard.d.ts +14 -1
  24. package/dist/_types/molecules/Stepper/Stepper.d.ts +32 -7
  25. package/dist/_types/molecules/TreeView/TreeView.d.ts +11 -2
  26. package/dist/_types/molecules/UptimeBars/UptimeBars.d.ts +20 -2
  27. package/dist/_types/organisms/Chart/Chart.d.ts +46 -8
  28. package/dist/_types/sections/LegalFooter/LegalFooter.d.ts +13 -1
  29. package/dist/_types/templates/PublicPageShell/PublicPageShell.d.ts +15 -1
  30. package/dist/brand.css +2 -4
  31. package/dist/calendar-planner.js +47 -47
  32. package/dist/calendar-roster.js +28 -25
  33. package/dist/carousel.js +69 -67
  34. package/dist/chart.js +250 -249
  35. package/dist/code-block.js +34 -34
  36. package/dist/context-menu.js +1 -1
  37. package/dist/copy-button.js +35 -34
  38. package/dist/copyable-value.js +43 -42
  39. package/dist/description-list.js +1 -1
  40. package/dist/dots-button.js +18 -17
  41. package/dist/filter-bar.css +1 -1
  42. package/dist/language-switcher.js +43 -41
  43. package/dist/legal-footer.js +21 -18
  44. package/dist/notification-list.js +40 -38
  45. package/dist/pagination.js +12 -12
  46. package/dist/progress-bar.js +1 -0
  47. package/dist/project-card.js +31 -30
  48. package/dist/public-page-shell.js +12 -11
  49. package/dist/slider.js +24 -23
  50. package/dist/spinner.js +19 -14
  51. package/dist/stepper.js +35 -38
  52. package/dist/tokens.css +2 -4
  53. package/dist/tree-view.js +86 -85
  54. package/dist/uptime-bars.js +54 -53
  55. package/package.json +1 -1
  56. package/src/tokens/molecules/filter-bar.css +1 -2
  57. package/src/tokens/scss/molecules/_filter-bar.scss +1 -2
  58. package/src/tokens/surface-public.css +0 -1
  59. package/src/tokens/tokens.json +0 -1
@@ -1,69 +1,69 @@
1
1
  'use client';
2
2
  import './code-block.css';
3
- import { Icon as e } from "./icon.js";
4
- import { VisuallyHidden as t } from "./visually-hidden.js";
5
- import { Button as n } from "./button.js";
6
- import { n as r } from "./_shared/copy-to-clipboard.js";
7
- import { Tag as i } from "./tag.js";
8
- import { useRef as a } from "react";
9
- import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
3
+ import { n as e } from "./_shared/brandmessagescontext.js";
4
+ import { Icon as t } from "./icon.js";
5
+ import { VisuallyHidden as n } from "./visually-hidden.js";
6
+ import { Button as r } from "./button.js";
7
+ import { n as i } from "./_shared/copy-to-clipboard.js";
8
+ import { Tag as a } from "./tag.js";
9
+ import { useRef as o } from "react";
10
+ import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
10
11
  //#region src/stories/molecules/CodeBlock/CodeBlock.tsx
11
- var l = (e) => e ? `Bloque de código ${e}` : "Bloque de código";
12
- function u({ children: u, language: d, copyable: f = !1, singleLine: p, copyLabel: m = "Copiar código", copiedLabel: h = "Copiado", codeLabel: g = l, className: _, ...v }) {
13
- let y = a(null), { status: b, copy: x } = r(), S = b === "copied", C = () => x(() => y.current?.textContent ?? ""), w = typeof u == "string" && !u.includes("\n"), T = p ?? w, E = !!d || f, D = [
12
+ function u({ children: u, language: d, copyable: f = !1, singleLine: p, copyLabel: m, copiedLabel: h, codeLabel: g, className: _, ...v }) {
13
+ let y = e("codeBlock"), b = e("copy"), x = o(null), { status: S, copy: C } = i(), w = S === "copied", T = () => C(() => x.current?.textContent ?? ""), E = typeof u == "string" && !u.includes("\n"), D = p ?? E, O = !!d || f, k = [
14
14
  "code-block",
15
- T ? "code-block--single-line" : "",
15
+ D ? "code-block--single-line" : "",
16
16
  _ ?? ""
17
- ].filter(Boolean).join(" "), O = d && /* @__PURE__ */ s(i, {
17
+ ].filter(Boolean).join(" "), A = d && /* @__PURE__ */ c(a, {
18
18
  variant: "neutral",
19
19
  className: "code-block__language",
20
20
  children: d
21
- }), k = f && /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s(n, {
21
+ }), j = f && /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(r, {
22
22
  iconOnly: !0,
23
23
  variant: "ghost",
24
24
  size: "sm",
25
- "aria-label": m,
26
- onClick: C,
25
+ "aria-label": y("copy", m),
26
+ onClick: T,
27
27
  className: "code-block__copy",
28
- children: /* @__PURE__ */ s(e, {
29
- name: S ? "check" : "copy",
28
+ children: /* @__PURE__ */ c(t, {
29
+ name: w ? "check" : "copy",
30
30
  size: "sm"
31
31
  })
32
- }), /* @__PURE__ */ s(t, {
32
+ }), /* @__PURE__ */ c(n, {
33
33
  role: "status",
34
- children: S ? h : ""
35
- })] }), A = /* @__PURE__ */ s("pre", {
34
+ children: w ? b("copied", h) : ""
35
+ })] }), M = /* @__PURE__ */ c("pre", {
36
36
  className: "code-block__pre",
37
37
  tabIndex: 0,
38
38
  role: "region",
39
- "aria-label": g(d),
40
- children: /* @__PURE__ */ s("code", {
41
- ref: y,
39
+ "aria-label": y("region", g)(d),
40
+ children: /* @__PURE__ */ c("code", {
41
+ ref: x,
42
42
  className: "code-block__code",
43
43
  children: u
44
44
  })
45
45
  });
46
- return T ? /* @__PURE__ */ s("div", {
47
- className: D,
46
+ return D ? /* @__PURE__ */ c("div", {
47
+ className: k,
48
48
  ...v,
49
- children: /* @__PURE__ */ c("div", {
49
+ children: /* @__PURE__ */ l("div", {
50
50
  className: "code-block__row",
51
- children: [A, E && /* @__PURE__ */ c("div", {
51
+ children: [M, O && /* @__PURE__ */ l("div", {
52
52
  className: "code-block__controls",
53
- children: [O, k]
53
+ children: [A, j]
54
54
  })]
55
55
  })
56
- }) : /* @__PURE__ */ c("div", {
57
- className: D,
56
+ }) : /* @__PURE__ */ l("div", {
57
+ className: k,
58
58
  ...v,
59
- children: [E && /* @__PURE__ */ c("div", {
59
+ children: [O && /* @__PURE__ */ l("div", {
60
60
  className: "code-block__header",
61
- children: [O, k]
62
- }), A]
61
+ children: [A, j]
62
+ }), M]
63
63
  });
64
64
  }
65
65
  function d({ type: e, className: t, children: n, ...r }) {
66
- return /* @__PURE__ */ s("span", {
66
+ return /* @__PURE__ */ c("span", {
67
67
  className: [
68
68
  "code-block__token",
69
69
  `code-block__token--${e}`,
@@ -3,7 +3,7 @@ import { DotsButton as e } from "./dots-button.js";
3
3
  import { Menu as t } from "./menu.js";
4
4
  import { jsx as n } from "react/jsx-runtime";
5
5
  //#region src/stories/molecules/ContextMenu/ContextMenu.tsx
6
- function r({ items: r, renderLink: i, onOpenChange: a, side: o = "bottom", align: s = "end", minWidth: c, maxWidth: l, triggerSize: u = "md", triggerOrientation: d = "horizontal", label: f = "Más opciones" }) {
6
+ function r({ items: r, renderLink: i, onOpenChange: a, side: o = "bottom", align: s = "end", minWidth: c, maxWidth: l, triggerSize: u = "md", triggerOrientation: d = "horizontal", label: f }) {
7
7
  return /* @__PURE__ */ n(t, {
8
8
  items: r,
9
9
  renderLink: i,
@@ -1,45 +1,46 @@
1
1
  'use client';
2
2
  import './copy-button.css';
3
- import { Icon as e } from "./icon.js";
4
- import { VisuallyHidden as t } from "./visually-hidden.js";
5
- import { Button as n } from "./button.js";
6
- import { n as r, t as i } from "./_shared/copy-to-clipboard.js";
7
- import { forwardRef as a } from "react";
8
- import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
3
+ import { n as e } from "./_shared/brandmessagescontext.js";
4
+ import { Icon as t } from "./icon.js";
5
+ import { VisuallyHidden as n } from "./visually-hidden.js";
6
+ import { Button as r } from "./button.js";
7
+ import { n as i, t as a } from "./_shared/copy-to-clipboard.js";
8
+ import { forwardRef as o } from "react";
9
+ import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
9
10
  //#region src/stories/molecules/CopyButton/CopyButton.tsx
10
- var l = a(function({ value: a, children: l, label: u = "Copiar", copiedLabel: d = "Copiado", errorLabel: f = "No se pudo copiar", variant: p = "ghost", size: m, feedbackDuration: h = i, onCopy: g, onCopyError: _, className: v, ...y }, b) {
11
- let { status: x, copy: S } = r(h), C = async () => {
12
- let e = await S(a);
13
- e.ok ? g?.(e.text) : _?.(e.error);
14
- }, w = x === "copied" ? d : x === "error" ? f : "", T = l == null ? null : x === "copied" ? d : x === "error" ? f : l;
15
- return /* @__PURE__ */ c(o, { children: [l == null ? /* @__PURE__ */ s(n, {
16
- ...y,
17
- ref: b,
18
- variant: p,
19
- ...m ? { size: m } : {},
11
+ var u = o(function({ value: o, children: u, label: d, copiedLabel: f, errorLabel: p, variant: m = "ghost", size: h, feedbackDuration: g = a, onCopy: _, onCopyError: v, className: y, ...b }, x) {
12
+ let S = e("copy"), { status: C, copy: w } = i(g), T = async () => {
13
+ let e = await w(o);
14
+ e.ok ? _?.(e.text) : v?.(e.error);
15
+ }, E = C === "copied" ? S("copied", f) : C === "error" ? S("error", p) : "", D = u == null ? null : C === "copied" ? S("copied", f) : C === "error" ? S("error", p) : u;
16
+ return /* @__PURE__ */ l(s, { children: [u == null ? /* @__PURE__ */ c(r, {
17
+ ...b,
18
+ ref: x,
19
+ variant: m,
20
+ ...h ? { size: h } : {},
20
21
  iconOnly: !0,
21
- "aria-label": u,
22
- onClick: C,
23
- className: ["copy-button", v].filter(Boolean).join(" "),
24
- children: /* @__PURE__ */ s(e, {
25
- name: x === "copied" ? "check" : "copy",
22
+ "aria-label": S("label", d),
23
+ onClick: T,
24
+ className: ["copy-button", y].filter(Boolean).join(" "),
25
+ children: /* @__PURE__ */ c(t, {
26
+ name: C === "copied" ? "check" : "copy",
26
27
  size: "sm"
27
28
  })
28
- }) : /* @__PURE__ */ c(n, {
29
- ...y,
30
- ref: b,
31
- variant: p,
32
- ...m ? { size: m } : {},
33
- onClick: C,
34
- className: ["copy-button", v].filter(Boolean).join(" "),
35
- children: [/* @__PURE__ */ s(e, {
36
- name: x === "copied" ? "check" : "copy",
29
+ }) : /* @__PURE__ */ l(r, {
30
+ ...b,
31
+ ref: x,
32
+ variant: m,
33
+ ...h ? { size: h } : {},
34
+ onClick: T,
35
+ className: ["copy-button", y].filter(Boolean).join(" "),
36
+ children: [/* @__PURE__ */ c(t, {
37
+ name: C === "copied" ? "check" : "copy",
37
38
  size: "sm"
38
- }), T]
39
- }), /* @__PURE__ */ s(t, {
39
+ }), D]
40
+ }), /* @__PURE__ */ c(n, {
40
41
  role: "status",
41
- children: w
42
+ children: E
42
43
  })] });
43
44
  });
44
45
  //#endregion
45
- export { l as CopyButton };
46
+ export { u as CopyButton };
@@ -1,100 +1,101 @@
1
1
  'use client';
2
2
  import './copyable-value.css';
3
- import { Icon as e } from "./icon.js";
4
- import { VisuallyHidden as t } from "./visually-hidden.js";
5
- import { Button as n } from "./button.js";
6
- import { n as r } from "./_shared/copy-to-clipboard.js";
7
- import { forwardRef as i, isValidElement as a } from "react";
8
- import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
3
+ import { n as e } from "./_shared/brandmessagescontext.js";
4
+ import { Icon as t } from "./icon.js";
5
+ import { VisuallyHidden as n } from "./visually-hidden.js";
6
+ import { Button as r } from "./button.js";
7
+ import { n as i } from "./_shared/copy-to-clipboard.js";
8
+ import { forwardRef as a, isValidElement as o } from "react";
9
+ import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
9
10
  //#region src/stories/atoms/CopyableValue/CopyableValue.tsx
10
- var l = 6, u = 12, d = new Set([
11
+ var u = 6, d = 12, f = new Set([
11
12
  "/",
12
13
  "-",
13
14
  "_",
14
15
  "."
15
16
  ]);
16
- function f(e) {
17
- if (e.length <= l) return {
17
+ function p(e) {
18
+ if (e.length <= u) return {
18
19
  head: "",
19
20
  tail: e
20
21
  };
21
- let t = Math.max(0, e.length - u);
22
- for (let n = e.length - 2; n >= t; n--) if (d.has(e[n])) return {
22
+ let t = Math.max(0, e.length - d);
23
+ for (let n = e.length - 2; n >= t; n--) if (f.has(e[n])) return {
23
24
  head: e.slice(0, n),
24
25
  tail: e.slice(n)
25
26
  };
26
27
  return {
27
- head: e.slice(0, e.length - l),
28
- tail: e.slice(e.length - l)
28
+ head: e.slice(0, e.length - u),
29
+ tail: e.slice(e.length - u)
29
30
  };
30
31
  }
31
- function p(e) {
32
+ function m(e) {
32
33
  if (e == null || typeof e == "boolean") return "";
33
34
  if (typeof e == "string") return e;
34
35
  if (typeof e == "number") return String(e);
35
36
  if (Array.isArray(e)) {
36
37
  let t = "";
37
38
  for (let n of e) {
38
- let e = p(n);
39
+ let e = m(n);
39
40
  if (e === null) return null;
40
41
  t += e;
41
42
  }
42
43
  return t;
43
44
  }
44
- return a(e) ? p(e.props.children) : null;
45
+ return o(e) ? m(e.props.children) : null;
45
46
  }
46
- var m = 24, h = i(function({ children: i, copyText: a, copyLabel: l = "Copiar", copiedLabel: u = "Copiado", className: d }, h) {
47
- let { status: g, copy: _ } = r(), v = g === "copied", y = ["copyable-value", d].filter(Boolean).join(" "), b = typeof i == "string", x = b ? f(i) : null, S = b ? null : p(i), C = b ? i : S ?? "", w = !b && S !== null && !/\s/.test(S) && S.length <= m, T = /* @__PURE__ */ s(n, {
47
+ var h = 24, g = a(function({ children: a, copyText: o, copyLabel: u, copiedLabel: d, className: f }, g) {
48
+ let _ = e("copy"), { status: v, copy: y } = i(), b = v === "copied", x = ["copyable-value", f].filter(Boolean).join(" "), S = typeof a == "string", C = S ? p(a) : null, w = S ? null : m(a), T = S ? a : w ?? "", E = !S && w !== null && !/\s/.test(w) && w.length <= h, D = /* @__PURE__ */ c(r, {
48
49
  iconOnly: !0,
49
50
  variant: "ghost",
50
51
  size: "sm",
51
- "aria-label": l,
52
- onClick: () => _(() => a ?? C),
52
+ "aria-label": _("label", u),
53
+ onClick: () => y(() => o ?? T),
53
54
  className: "copyable-value__copy",
54
- children: /* @__PURE__ */ s(e, {
55
- name: v ? "check" : "copy",
55
+ children: /* @__PURE__ */ c(t, {
56
+ name: b ? "check" : "copy",
56
57
  size: "sm"
57
58
  })
58
- }), E;
59
- if (b) {
60
- let { head: e, tail: t } = x;
61
- E = /* @__PURE__ */ c("span", {
59
+ }), O;
60
+ if (S) {
61
+ let { head: e, tail: t } = C;
62
+ O = /* @__PURE__ */ l("span", {
62
63
  className: "copyable-value__value",
63
- children: [e, /* @__PURE__ */ c("span", {
64
+ children: [e, /* @__PURE__ */ l("span", {
64
65
  className: "copyable-value__tail",
65
66
  children: [
66
67
  t,
67
68
  "⁠",
68
- T
69
+ D
69
70
  ]
70
71
  })]
71
72
  });
72
- } else E = w ? /* @__PURE__ */ c("span", {
73
+ } else O = E ? /* @__PURE__ */ l("span", {
73
74
  className: "copyable-value__tail",
74
75
  children: [
75
- /* @__PURE__ */ s("span", {
76
+ /* @__PURE__ */ c("span", {
76
77
  className: "copyable-value__value",
77
- children: i
78
+ children: a
78
79
  }),
79
80
  "⁠",
80
- T
81
+ D
81
82
  ]
82
- }) : /* @__PURE__ */ c(o, { children: [
83
- /* @__PURE__ */ s("span", {
83
+ }) : /* @__PURE__ */ l(s, { children: [
84
+ /* @__PURE__ */ c("span", {
84
85
  className: "copyable-value__value",
85
- children: i
86
+ children: a
86
87
  }),
87
88
  "⁠",
88
- T
89
+ D
89
90
  ] });
90
- return /* @__PURE__ */ c("span", {
91
- ref: h,
92
- className: y,
93
- children: [E, /* @__PURE__ */ s(t, {
91
+ return /* @__PURE__ */ l("span", {
92
+ ref: g,
93
+ className: x,
94
+ children: [O, /* @__PURE__ */ c(n, {
94
95
  role: "status",
95
- children: v ? u : ""
96
+ children: b ? _("copied", d) : ""
96
97
  })]
97
98
  });
98
99
  });
99
100
  //#endregion
100
- export { h as CopyableValue };
101
+ export { g as CopyableValue };
@@ -18,7 +18,7 @@ var r = t(function({ className: e, children: t, ...r }, i) {
18
18
  ...i,
19
19
  children: r
20
20
  });
21
- }), a = t(function({ as: t = "dd", className: r, children: i, copyable: a = !1, copyText: o, copyLabel: s = "Copiar", copiedLabel: c = "Copiado", ...l }, u) {
21
+ }), a = t(function({ as: t = "dd", className: r, children: i, copyable: a = !1, copyText: o, copyLabel: s, copiedLabel: c, ...l }, u) {
22
22
  let d = [
23
23
  "description-list__details",
24
24
  a ? "description-list__details--copyable" : "",
@@ -1,29 +1,30 @@
1
1
  'use client';
2
2
  import './dots-button.css';
3
- import { Icon as e } from "./icon.js";
4
- import { Button as t } from "./button.js";
5
- import { forwardRef as n } from "react";
6
- import { jsx as r } from "react/jsx-runtime";
3
+ import { n as e } from "./_shared/brandmessagescontext.js";
4
+ import { Icon as t } from "./icon.js";
5
+ import { Button as n } from "./button.js";
6
+ import { forwardRef as r } from "react";
7
+ import { jsx as i } from "react/jsx-runtime";
7
8
  //#region src/stories/atoms/DotsButton/DotsButton.tsx
8
- var i = n(function({ size: n = "md", orientation: i = "horizontal", "aria-label": a = "Más opciones", className: o, ...s }, c) {
9
- let l = [
9
+ var a = r(function({ size: r = "md", orientation: a = "horizontal", "aria-label": o, className: s, ...c }, l) {
10
+ let u = e("dotsButton"), d = [
10
11
  "dots-button",
11
- i === "vertical" ? "dots-button--vertical" : "",
12
- o
12
+ a === "vertical" ? "dots-button--vertical" : "",
13
+ s
13
14
  ].filter(Boolean).join(" ");
14
- return /* @__PURE__ */ r(t, {
15
- ref: c,
15
+ return /* @__PURE__ */ i(n, {
16
+ ref: l,
16
17
  variant: "ghost",
17
18
  iconOnly: !0,
18
- size: n,
19
- "aria-label": a,
20
- className: l,
21
- ...s,
22
- children: /* @__PURE__ */ r(e, {
19
+ size: r,
20
+ "aria-label": u("label", o),
21
+ className: d,
22
+ ...c,
23
+ children: /* @__PURE__ */ i(t, {
23
24
  name: "dots",
24
- size: n === "lg" ? "md" : "sm"
25
+ size: r === "lg" ? "md" : "sm"
25
26
  })
26
27
  });
27
28
  });
28
29
  //#endregion
29
- export { i as DotsButton };
30
+ export { a as DotsButton };
@@ -1 +1 @@
1
- .filter-bar{gap:var(--filter-bar-gap);flex-direction:column;display:flex}.filter-bar__search{inline-size:100%}.filter-bar__row{column-gap:var(--filter-bar-column-gap);row-gap:var(--filter-bar-row-gap);grid-template-columns:1fr;display:grid}.filter-bar__filters{display:contents}.filter-bar__filter{min-inline-size:0}.filter-bar__actions{align-items:stretch;gap:var(--filter-bar-actions-gap);flex-direction:column;min-inline-size:0;display:flex}.filter-bar__actions>*{inline-size:100%}@media (width>=768px){.filter-bar__row{grid-template-columns:repeat(auto-fill, minmax(min(var(--filter-bar-column-min-inline-size), 100%), 1fr))}.filter-bar__actions{flex-flow:wrap;align-items:center}.filter-bar__actions>*{inline-size:auto}:is(.filter-bar__row:has(.label:not(.visually-hidden)) .filter-bar__filter:not(:has(.label:not(.visually-hidden))),.filter-bar__row:has(.label:not(.visually-hidden))>.filter-bar__actions){align-self:start;padding-block-start:var(--filter-bar-label-offset)}.filter-bar__row:has(.label:not(.visually-hidden)) .filter-bar__filter:not(:has(.label:not(.visually-hidden))){block-size:calc(var(--filter-bar-label-offset) + var(--filter-bar-control-block-size));flex-direction:column;justify-content:center;display:flex}.filter-bar__row:has(.label:not(.visually-hidden))>.filter-bar__actions{min-block-size:calc(var(--filter-bar-label-offset) + var(--filter-bar-control-block-size))}}
1
+ .filter-bar{gap:var(--filter-bar-gap);flex-direction:column;display:flex}.filter-bar__search{inline-size:100%}.filter-bar__row{column-gap:var(--filter-bar-column-gap);row-gap:var(--filter-bar-row-gap);grid-template-columns:1fr;display:grid}.filter-bar__filters{display:contents}.filter-bar__filter{min-inline-size:0}.filter-bar__actions{align-items:stretch;gap:var(--filter-bar-actions-gap);flex-direction:column;min-inline-size:0;display:flex}.filter-bar__actions>*{inline-size:100%}@media (width>=768px){.filter-bar__row{grid-template-columns:repeat(auto-fit, minmax(calc((100% - var(--filter-bar-column-gap)) / 2), 1fr))}.filter-bar__actions{flex-flow:wrap;align-items:center}.filter-bar__actions>*{inline-size:auto}:is(.filter-bar__row:has(.label:not(.visually-hidden)) .filter-bar__filter:not(:has(.label:not(.visually-hidden))),.filter-bar__row:has(.label:not(.visually-hidden))>.filter-bar__actions){align-self:start;padding-block-start:var(--filter-bar-label-offset)}.filter-bar__row:has(.label:not(.visually-hidden)) .filter-bar__filter:not(:has(.label:not(.visually-hidden))){block-size:calc(var(--filter-bar-label-offset) + var(--filter-bar-control-block-size));flex-direction:column;justify-content:center;display:flex}.filter-bar__row:has(.label:not(.visually-hidden))>.filter-bar__actions{min-block-size:calc(var(--filter-bar-label-offset) + var(--filter-bar-control-block-size))}}@media (width>=1024px){.filter-bar__row{grid-template-columns:repeat(auto-fit, minmax(calc((100% - 3 * var(--filter-bar-column-gap)) / 4), 1fr))}}
@@ -1,77 +1,79 @@
1
1
  'use client';
2
2
  import './language-switcher.css';
3
- import { DropdownField as e } from "./dropdown-field.js";
4
- import { jsx as t } from "react/jsx-runtime";
3
+ import { n as e } from "./_shared/brandmessagescontext.js";
4
+ import { DropdownField as t } from "./dropdown-field.js";
5
+ import { jsx as n } from "react/jsx-runtime";
5
6
  //#region src/stories/molecules/LanguageSwitcher/LanguageSwitcher.tsx
6
- function n({ href: e, lang: n, children: r, className: i, "aria-current": a }) {
7
- return /* @__PURE__ */ t("a", {
7
+ function r({ href: e, lang: t, children: r, className: i, "aria-current": a }) {
8
+ return /* @__PURE__ */ n("a", {
8
9
  href: e,
9
- lang: n,
10
+ lang: t,
10
11
  className: i,
11
12
  "aria-current": a,
12
13
  children: r
13
14
  });
14
15
  }
15
- function r({ languages: r, value: i, onChange: a, label: o = "Idioma", id: s = "language-switcher", labelHidden: c, variant: l = "compact", layout: u = "inline", size: d = "md", hrefFor: f, renderLink: p = n, className: m }) {
16
- if (l === "list") return /* @__PURE__ */ t("nav", {
16
+ function i({ languages: i, value: a, onChange: o, label: s, id: c = "language-switcher", labelHidden: l, variant: u = "compact", layout: d = "inline", size: f = "md", hrefFor: p, renderLink: m = r, className: h }) {
17
+ let g = e("languageSwitcher")("label", s);
18
+ if (u === "list") return /* @__PURE__ */ n("nav", {
17
19
  className: [
18
20
  "language-switcher",
19
21
  "language-switcher--list",
20
- m
22
+ h
21
23
  ].filter(Boolean).join(" "),
22
- "aria-label": o,
23
- children: /* @__PURE__ */ t("ul", {
24
+ "aria-label": g,
25
+ children: /* @__PURE__ */ n("ul", {
24
26
  className: "language-switcher__list",
25
- children: r.map(({ code: e, label: n }) => {
26
- let r = e === i, o = ["language-switcher__option", r ? "language-switcher__option--current" : ""].filter(Boolean).join(" ");
27
- return /* @__PURE__ */ t("li", { children: r ? /* @__PURE__ */ t("span", {
27
+ children: i.map(({ code: e, label: t }) => {
28
+ let r = e === a, i = ["language-switcher__option", r ? "language-switcher__option--current" : ""].filter(Boolean).join(" ");
29
+ return /* @__PURE__ */ n("li", { children: r ? /* @__PURE__ */ n("span", {
28
30
  lang: e,
29
- className: o,
31
+ className: i,
30
32
  "aria-current": "true",
31
- children: n
32
- }) : f ? p({
33
- href: f(e),
33
+ children: t
34
+ }) : p ? m({
35
+ href: p(e),
34
36
  lang: e,
35
- className: o,
36
- children: n
37
- }) : /* @__PURE__ */ t("button", {
37
+ className: i,
38
+ children: t
39
+ }) : /* @__PURE__ */ n("button", {
38
40
  type: "button",
39
41
  lang: e,
40
- className: o,
41
- onClick: () => a?.(e),
42
- children: n
42
+ className: i,
43
+ onClick: () => o?.(e),
44
+ children: t
43
45
  }) }, e);
44
46
  })
45
47
  })
46
48
  });
47
- let h = [
49
+ let _ = [
48
50
  "language-switcher",
49
51
  "language-switcher--compact",
50
- m
52
+ h
51
53
  ].filter(Boolean).join(" ");
52
- return /* @__PURE__ */ t(e, {
53
- id: s,
54
- label: o,
55
- labelHidden: c,
56
- inline: u === "inline",
57
- size: d,
54
+ return /* @__PURE__ */ n(t, {
55
+ id: c,
56
+ label: g,
57
+ labelHidden: l,
58
+ inline: d === "inline",
59
+ size: f,
58
60
  align: "end",
59
- className: h,
60
- value: i,
61
- onValueChange: (e) => a?.(e),
62
- items: r.map(({ code: e, label: n }) => ({
61
+ className: _,
62
+ value: a,
63
+ onValueChange: (e) => o?.(e),
64
+ items: i.map(({ code: e, label: t }) => ({
63
65
  type: "radio",
64
66
  value: e,
65
- label: /* @__PURE__ */ t("span", {
67
+ label: /* @__PURE__ */ n("span", {
66
68
  lang: e,
67
- children: n
69
+ children: t
68
70
  })
69
71
  })),
70
- children: /* @__PURE__ */ t("span", {
71
- lang: i,
72
- children: r.find((e) => e.code === i)?.label ?? i
72
+ children: /* @__PURE__ */ n("span", {
73
+ lang: a,
74
+ children: i.find((e) => e.code === a)?.label ?? a
73
75
  })
74
76
  });
75
77
  }
76
78
  //#endregion
77
- export { r as LanguageSwitcher };
79
+ export { i as LanguageSwitcher };
@@ -1,34 +1,37 @@
1
+ 'use client';
1
2
  import './legal-footer.css';
2
- import { Container as e } from "./container.js";
3
- import { Heading as t } from "./heading.js";
4
- import { jsx as n, jsxs as r } from "react/jsx-runtime";
3
+ import { n as e } from "./_shared/brandmessagescontext.js";
4
+ import { Container as t } from "./container.js";
5
+ import { Heading as n } from "./heading.js";
6
+ import { jsx as r, jsxs as i } from "react/jsx-runtime";
5
7
  //#region src/stories/sections/LegalFooter/LegalFooter.tsx
6
- function i({ children: e, ...t }) {
7
- return /* @__PURE__ */ n("a", {
8
+ function a({ children: e, ...t }) {
9
+ return /* @__PURE__ */ r("a", {
8
10
  ...t,
9
11
  children: e
10
12
  });
11
13
  }
12
- function a({ label: a = "Legal", title: o, links: s, renderLink: c = i, width: l = "xl", surface: u, className: d }) {
13
- return /* @__PURE__ */ n("footer", {
14
+ function o({ label: o, title: s, links: c, renderLink: l = a, width: u = "xl", surface: d, className: f }) {
15
+ let p = e("legalFooter");
16
+ return /* @__PURE__ */ r("footer", {
14
17
  className: [
15
18
  "legal-footer",
16
- u === "dark" && "surface-dark",
17
- d
19
+ d === "dark" && "surface-dark",
20
+ f
18
21
  ].filter(Boolean).join(" "),
19
- children: /* @__PURE__ */ r(e, {
20
- width: l,
22
+ children: /* @__PURE__ */ i(t, {
23
+ width: u,
21
24
  innerClassName: "legal-footer__inner",
22
- children: [o && /* @__PURE__ */ n(t, {
25
+ children: [s && /* @__PURE__ */ r(n, {
23
26
  level: 2,
24
27
  size: 6,
25
28
  className: "legal-footer__title",
26
- children: o
27
- }), /* @__PURE__ */ n("nav", {
28
- "aria-label": a,
29
- children: /* @__PURE__ */ n("ul", {
29
+ children: s
30
+ }), /* @__PURE__ */ r("nav", {
31
+ "aria-label": p("label", o),
32
+ children: /* @__PURE__ */ r("ul", {
30
33
  className: "legal-footer__links",
31
- children: s.map((e) => /* @__PURE__ */ n("li", { children: c({
34
+ children: c.map((e) => /* @__PURE__ */ r("li", { children: l({
32
35
  href: e.href,
33
36
  className: "legal-footer__link link--ink",
34
37
  children: e.label
@@ -39,4 +42,4 @@ function a({ label: a = "Legal", title: o, links: s, renderLink: c = i, width: l
39
42
  });
40
43
  }
41
44
  //#endregion
42
- export { a as LegalFooter };
45
+ export { o as LegalFooter };