@ogcio/design-system-react 1.11.3 → 1.12.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/dist/accordion/accordion-item.js +1 -1
  2. package/dist/alert/alert.js +1 -1
  3. package/dist/autocomplete/autocomplete.js +4 -4
  4. package/dist/button-group/button-group.js +44 -44
  5. package/dist/card/card-next.js +28 -28
  6. package/dist/combo-box/dropdown-item.js +30 -30
  7. package/dist/drawer/drawer.content.js +6 -6
  8. package/dist/drawer/drawer.js +8 -8
  9. package/dist/error-text/error-text.js +1 -1
  10. package/dist/forms/form-field/form-field.d.ts +18 -0
  11. package/dist/forms/form-field/form-field.js +85 -0
  12. package/dist/forms/form-field/types.d.ts +13 -0
  13. package/dist/forms/form-field/types.js +1 -0
  14. package/dist/forms/form-field-with-tag/form-field-with-tag.js +1 -1
  15. package/dist/heading/heading.js +1 -1
  16. package/dist/hint-text/hint-text.js +1 -1
  17. package/dist/icon/icon.js +32 -32
  18. package/dist/index-2sRBqKFV.js +78 -0
  19. package/dist/{index-DNkhmzZp.js → index-CB-zPpNk.js} +44 -44
  20. package/dist/index.d.ts +3 -1
  21. package/dist/index.js +162 -155
  22. package/dist/input-checkbox/input-checkbox.js +13 -13
  23. package/dist/input-radio/input-radio.js +15 -15
  24. package/dist/label/label.js +1 -1
  25. package/dist/link/link.js +1 -1
  26. package/dist/list/list.js +2 -2
  27. package/dist/modal/modal.content.js +1 -1
  28. package/dist/modal/modal.js +3 -3
  29. package/dist/popover/popover.js +471 -467
  30. package/dist/primitives/anchor.js +1 -1
  31. package/dist/progress-bar/progress-bar.js +8 -8
  32. package/dist/progress-stepper/progress-stepper.js +10 -10
  33. package/dist/score-select/score-select.js +29 -29
  34. package/dist/select/select-menu.js +1 -0
  35. package/dist/select/select-next.js +11 -10
  36. package/dist/side-nav/side-nav.js +23 -23
  37. package/dist/spinner/spinner.js +1 -1
  38. package/dist/stack/stack.js +2 -2
  39. package/dist/styles.css +1 -1
  40. package/dist/table/table.js +1 -1
  41. package/dist/textarea/textarea.js +7 -7
  42. package/dist/toast/ds-toast.js +1 -1
  43. package/dist/tooltip/tooltip.js +1 -1
  44. package/package.json +2 -2
  45. package/dist/forms/form-field.d.ts +0 -11
  46. package/dist/forms/form-field.js +0 -41
  47. package/dist/index-ntYL1VRC.js +0 -64
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { jsxs as d, Fragment as u, jsx as i } from "react/jsx-runtime";
3
3
  import { useState as y, useRef as b } from "react";
4
- import { c as h } from "../index-DNkhmzZp.js";
4
+ import { c as h } from "../index-CB-zPpNk.js";
5
5
  import { cn as r } from "../cn.js";
6
6
  import { Icon as w } from "../icon/icon.js";
7
7
  const I = h({
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { jsxs as n, jsx as r } from "react/jsx-runtime";
3
3
  import { useState as D } from "react";
4
- import { c as h } from "../index-DNkhmzZp.js";
4
+ import { c as h } from "../index-CB-zPpNk.js";
5
5
  import { cn as v } from "../cn.js";
6
6
  import { translate as k } from "../i18n/utility.js";
7
7
  import { Icon as w } from "../icon/icon.js";
@@ -1,6 +1,6 @@
1
1
  "use client";
2
2
  import { jsxs as G, jsx as E } from "react/jsx-runtime";
3
- import { useRef as C, useReducer as H, useEffect as m, createElement as j, isValidElement as K, Children as X } from "react";
3
+ import { useRef as C, useReducer as H, Children as j, useEffect as m, createElement as K, isValidElement as X } from "react";
4
4
  import { cn as N } from "../cn.js";
5
5
  import { InputText as $ } from "../input-text/input-text.js";
6
6
  import { Popover as q } from "../popover/popover.js";
@@ -58,8 +58,8 @@ const {
58
58
  }, _ = (t) => {
59
59
  var r, s;
60
60
  const o = ((r = t == null ? void 0 : t.type) == null ? void 0 : r.componentType) || ((s = t == null ? void 0 : t.props) == null ? void 0 : s.__mdxType);
61
- return K(t) && o === "AutocompleteItem";
62
- }, S = (t) => X.toArray(t).filter((o) => _(o)) || [], I = (t, o) => {
61
+ return X(t) && o === "AutocompleteItem";
62
+ }, S = (t) => j.toArray(t).filter((o) => _(o)) || [], I = (t, o) => {
63
63
  var r;
64
64
  return (((r = S(t).find((s) => s.props.value === o)) == null ? void 0 : r.props.children) || "").toString();
65
65
  }, re = ({
@@ -225,7 +225,7 @@ const {
225
225
  ]
226
226
  },
227
227
  children: /* @__PURE__ */ E(z, { onChange: w, children: f.map(
228
- (e, p) => _(e) ? /* @__PURE__ */ j(
228
+ (e, p) => _(e) ? /* @__PURE__ */ K(
229
229
  F,
230
230
  {
231
231
  ...e.props,
@@ -1,85 +1,85 @@
1
1
  "use client";
2
2
  import { jsx as p } from "react/jsx-runtime";
3
- import { createContext as x, useContext as B, useState as I } from "react";
3
+ import { createContext as B, useState as I, useContext as f } from "react";
4
4
  import { Button as G } from "../button/button.js";
5
5
  import { useDomId as g } from "../hooks/use-dom-id.js";
6
- const b = x(
6
+ const b = B(
7
7
  void 0
8
- ), w = ({
8
+ ), v = ({
9
9
  value: e,
10
10
  children: a,
11
- role: n,
12
- "aria-checked": r,
13
- "aria-label": i
11
+ role: i,
12
+ "aria-checked": o,
13
+ "aria-label": n
14
14
  }) => {
15
- const o = B(b);
16
- if (!o)
15
+ const r = f(b);
16
+ if (!r)
17
17
  throw new Error("ButtonGroupItem must be used within a ButtonGroup");
18
18
  const {
19
- selectedValue: d,
20
- setSelectedValue: c,
21
- size: u,
19
+ selectedValue: c,
20
+ setSelectedValue: d,
21
+ size: s,
22
22
  onChange: t,
23
- groupId: s,
24
- appearance: l
25
- } = o, m = d === e, f = () => {
26
- c(e), t == null || t(e);
27
- }, y = `${s}-${e}`;
23
+ groupId: l,
24
+ appearance: u
25
+ } = r, m = c === e, y = () => {
26
+ d(e), t == null || t(e);
27
+ }, x = `${l}-${e}`;
28
28
  return /* @__PURE__ */ p(
29
29
  G,
30
30
  {
31
31
  variant: m ? "primary" : "secondary",
32
- size: u,
33
- appearance: l,
34
- onClick: f,
35
- id: y,
36
- role: n || "radio",
37
- "aria-checked": r === void 0 ? m : r,
38
- "aria-label": i,
32
+ size: s,
33
+ appearance: u,
34
+ onClick: y,
35
+ id: x,
36
+ role: i || "radio",
37
+ "aria-checked": o === void 0 ? m : o,
38
+ "aria-label": n,
39
39
  type: "button",
40
40
  children: a
41
41
  }
42
42
  );
43
- }, C = ({
43
+ }, w = ({
44
44
  name: e,
45
45
  size: a = "medium",
46
- appearance: n = "dark",
47
- onChange: r,
48
- defaultValue: i,
49
- children: o,
50
- role: d,
51
- "aria-labelledby": c,
52
- "aria-describedby": u
46
+ appearance: i = "dark",
47
+ onChange: o,
48
+ defaultValue: n,
49
+ children: r,
50
+ role: c,
51
+ "aria-labelledby": d,
52
+ "aria-describedby": s
53
53
  }) => {
54
- const [t, s] = I(
55
- i
56
- ), l = g();
54
+ const [t, l] = I(
55
+ n
56
+ ), u = g();
57
57
  return /* @__PURE__ */ p(
58
58
  b.Provider,
59
59
  {
60
60
  value: {
61
61
  selectedValue: t,
62
- setSelectedValue: s,
62
+ setSelectedValue: l,
63
63
  name: e,
64
64
  size: a,
65
- onChange: r,
66
- groupId: l,
67
- appearance: n
65
+ onChange: o,
66
+ groupId: u,
67
+ appearance: i
68
68
  },
69
69
  children: /* @__PURE__ */ p(
70
70
  "div",
71
71
  {
72
72
  className: "gi-btn-group",
73
- role: d || "radiogroup",
74
- "aria-labelledby": c,
75
- "aria-describedby": u,
76
- children: o
73
+ role: c || "radiogroup",
74
+ "aria-labelledby": d,
75
+ "aria-describedby": s,
76
+ children: r
77
77
  }
78
78
  )
79
79
  }
80
80
  );
81
81
  };
82
82
  export {
83
- C as ButtonGroup,
84
- w as ButtonGroupItem
83
+ w as ButtonGroup,
84
+ v as ButtonGroupItem
85
85
  };
@@ -1,39 +1,39 @@
1
1
  "use client";
2
2
  import { jsx as r, jsxs as g } from "react/jsx-runtime";
3
- import { createContext as l, useContext as m, useMemo as f, Children as p, isValidElement as v } from "react";
3
+ import { createContext as l, Children as m, isValidElement as f, useContext as p, useMemo as v } from "react";
4
4
  import { Icon as N } from "../icon/icon.js";
5
5
  import { Paragraph as h } from "../paragraph/paragraph.js";
6
6
  import { Tag as x } from "../tag/tag.js";
7
- const u = l(!1), c = l(!1), o = l(!1);
8
- function i(e, a, t) {
9
- if (!m(e))
10
- throw new Error(`${a} must be used inside <${t}>`);
7
+ const u = l(!1), o = l(!1), c = l(!1);
8
+ function i(e, a, n) {
9
+ if (!p(e))
10
+ throw new Error(`${a} must be used inside <${n}>`);
11
11
  return !0;
12
12
  }
13
13
  const P = ({
14
14
  children: e,
15
15
  inset: a,
16
- type: t = "vertical",
17
- dataTestid: n
16
+ type: n = "vertical",
17
+ dataTestid: t
18
18
  }) => {
19
- const d = f(() => {
20
- const s = `gi-card-inset-${a || "none"}`;
21
- return `gi-card gi-card-${t} ${s} gi-not-prose`;
22
- }, [t, a]);
23
- return /* @__PURE__ */ r(u.Provider, { value: !0, children: /* @__PURE__ */ r("div", { className: d, "data-testid": n, children: e }) });
19
+ const s = v(() => {
20
+ const d = `gi-card-inset-${a || "none"}`;
21
+ return `gi-card gi-card-${n} ${d} gi-not-prose`;
22
+ }, [n, a]);
23
+ return /* @__PURE__ */ r(u.Provider, { value: !0, children: /* @__PURE__ */ r("div", { className: s, "data-testid": t, children: e }) });
24
24
  }, j = ({ media: e, href: a }) => {
25
25
  if (i(u, "CardMedia", "Card"), !e)
26
26
  return null;
27
27
  switch (e.type) {
28
28
  case "image": {
29
- const { src: t, alt: n, aspectRatio: d } = e.config;
29
+ const { src: n, alt: t, aspectRatio: s } = e.config;
30
30
  return /* @__PURE__ */ r("div", { className: "gi-card-image", children: /* @__PURE__ */ r("a", { href: a, children: /* @__PURE__ */ r(
31
31
  "img",
32
32
  {
33
- src: t,
34
- alt: n,
35
- style: d ? { aspectRatio: d } : void 0,
36
- className: d ? "gi-w-full" : void 0
33
+ src: n,
34
+ alt: t,
35
+ style: s ? { aspectRatio: s } : void 0,
36
+ className: s ? "gi-w-full" : void 0
37
37
  }
38
38
  ) }) });
39
39
  }
@@ -47,29 +47,29 @@ const P = ({
47
47
  }, E = ({
48
48
  children: e,
49
49
  inset: a = "none"
50
- }) => (i(u, "CardContainer", "Card"), /* @__PURE__ */ r(o.Provider, { value: !0, children: /* @__PURE__ */ r("div", { className: `gi-card-content gi-card-inset-${a || "none"}`, children: e }) })), M = ({ children: e }) => (i(c, "CardTitle", "CardHeader"), e ? /* @__PURE__ */ r("div", { className: "gi-card-title", children: e }) : null), A = ({ children: e }) => (i(c, "CardSubtitle", "CardHeader"), e ? /* @__PURE__ */ r("div", { className: "gi-card-subheading", children: e }) : null), T = ({ text: e, type: a }) => (i(c, "CardTag", "CardHeader"), /* @__PURE__ */ r("div", { className: "gi-card-tag", children: /* @__PURE__ */ r(x, { text: e, type: a }) }));
50
+ }) => (i(u, "CardContainer", "Card"), /* @__PURE__ */ r(c.Provider, { value: !0, children: /* @__PURE__ */ r("div", { className: `gi-card-content gi-card-inset-${a || "none"}`, children: e }) })), M = ({ children: e }) => (i(o, "CardTitle", "CardHeader"), e ? /* @__PURE__ */ r("div", { className: "gi-card-title", children: e }) : null), A = ({ children: e }) => (i(o, "CardSubtitle", "CardHeader"), e ? /* @__PURE__ */ r("div", { className: "gi-card-subheading", children: e }) : null), T = ({ text: e, type: a }) => (i(o, "CardTag", "CardHeader"), /* @__PURE__ */ r("div", { className: "gi-card-tag", children: /* @__PURE__ */ r(x, { text: e, type: a }) }));
51
51
  Object.defineProperty(T, "componentType", {
52
52
  value: "CardTag",
53
53
  writable: !1,
54
54
  enumerable: !1
55
55
  });
56
56
  const D = ({ children: e }) => {
57
- i(o, "CardHeader", "CardContainer");
58
- const a = [], t = [];
59
- return p.forEach(e, (n) => {
60
- var s, C;
61
- if (!v(n))
57
+ i(c, "CardHeader", "CardContainer");
58
+ const a = [], n = [];
59
+ return m.forEach(e, (t) => {
60
+ var d, C;
61
+ if (!f(t))
62
62
  return;
63
- (((s = n == null ? void 0 : n.type) == null ? void 0 : s.componentType) || ((C = n.props) == null ? void 0 : C.__mdxType)) === "CardTag" ? t.push(n) : a.push(n);
64
- }), /* @__PURE__ */ r(c.Provider, { value: !0, children: /* @__PURE__ */ g("div", { className: "gi-card-header", children: [
63
+ (((d = t == null ? void 0 : t.type) == null ? void 0 : d.componentType) || ((C = t.props) == null ? void 0 : C.__mdxType)) === "CardTag" ? n.push(t) : a.push(t);
64
+ }), /* @__PURE__ */ r(o.Provider, { value: !0, children: /* @__PURE__ */ g("div", { className: "gi-card-header", children: [
65
65
  /* @__PURE__ */ r("div", { className: "gi-card-heading", children: a }),
66
- t
66
+ n
67
67
  ] }) });
68
68
  }, R = ({
69
69
  children: e
70
- }) => (i(o, "CardDescription", "CardContainer"), e ? /* @__PURE__ */ r("div", { className: "gi-card-paragraph", children: /* @__PURE__ */ r(h, { size: "sm", children: e }) }) : null), S = ({
70
+ }) => (i(c, "CardDescription", "CardContainer"), e ? /* @__PURE__ */ r("div", { className: "gi-card-paragraph", children: /* @__PURE__ */ r(h, { size: "sm", children: e }) }) : null), S = ({
71
71
  children: e
72
- }) => (i(o, "CardAction", "CardContainer"), /* @__PURE__ */ r("div", { className: "gi-card-action", children: e }));
72
+ }) => (i(c, "CardAction", "CardContainer"), /* @__PURE__ */ r("div", { className: "gi-card-action", children: e }));
73
73
  export {
74
74
  S as CardAction,
75
75
  E as CardContainer,
@@ -1,5 +1,5 @@
1
1
  "use client";
2
- import { jsxs as i, jsx as s } from "react/jsx-runtime";
2
+ import { jsxs as n, jsx as s } from "react/jsx-runtime";
3
3
  import { useState as u, useId as j, useEffect as q } from "react";
4
4
  import { Button as B } from "../button/button.js";
5
5
  import { cn as x } from "../cn.js";
@@ -11,7 +11,7 @@ import { InputText as O } from "../input-text/input-text.js";
11
11
  import { Paragraph as y } from "../paragraph/paragraph.js";
12
12
  import { Tag as A, TagTypeEnum as F } from "../tag/tag.js";
13
13
  import { slugify as P } from "../utilities.js";
14
- const ee = ({
14
+ const oo = ({
15
15
  children: c,
16
16
  noSearch: h,
17
17
  options: p,
@@ -26,40 +26,40 @@ const ee = ({
26
26
  )
27
27
  ];
28
28
  q(() => {
29
- var a, n;
30
- let e = 0;
31
- const o = z();
32
- for (const b of o) {
29
+ var a, i;
30
+ let o = 0;
31
+ const e = z();
32
+ for (const b of e) {
33
33
  const f = (a = b.querySelector("label")) == null ? void 0 : a.textContent;
34
- (n = f == null ? void 0 : f.toLowerCase()) != null && n.includes(d.toLowerCase()) ? b.style.display = "flex" : (b.style.display = "none", e++);
34
+ (i = f == null ? void 0 : f.toLowerCase()) != null && i.includes(d.toLowerCase()) ? b.style.display = "flex" : (b.style.display = "none", o++);
35
35
  }
36
- _(e === p.length);
36
+ _(o === p.length);
37
37
  }, [d, p.length]);
38
- const R = (e, o) => {
39
- const a = o ? [...t || [], e] : (t || []).filter((n) => n !== e);
38
+ const R = (o, e) => {
39
+ const a = e ? [...t || [], o] : (t || []).filter((i) => i !== o);
40
40
  w || V(a), g == null || g(a);
41
41
  };
42
- return /* @__PURE__ */ i(
42
+ return /* @__PURE__ */ n(
43
43
  "div",
44
44
  {
45
45
  role: "group",
46
46
  "aria-label": `${c} dropdown`,
47
47
  className: "gi-combobox-dropdown-item",
48
48
  children: [
49
- /* @__PURE__ */ i(
49
+ /* @__PURE__ */ n(
50
50
  B,
51
51
  {
52
52
  variant: "flat",
53
53
  appearance: "dark",
54
54
  size: "large",
55
- onClick: (e) => {
56
- e.preventDefault(), C(!m);
55
+ onClick: (o) => {
56
+ o.preventDefault(), C(!m);
57
57
  },
58
58
  className: x("gi-combobox-toggle", {
59
59
  "gi-combobox-toggle-open": m
60
60
  }),
61
61
  children: [
62
- /* @__PURE__ */ i("div", { className: "gi-combobox-toggle-content", children: [
62
+ /* @__PURE__ */ n("div", { className: "gi-combobox-toggle-content", children: [
63
63
  /* @__PURE__ */ s(y, { size: "md", children: c }),
64
64
  (t == null ? void 0 : t.length) > 0 && /* @__PURE__ */ s(A, { type: F.Counter, text: t.length.toString() })
65
65
  ] }),
@@ -73,22 +73,22 @@ const ee = ({
73
73
  ]
74
74
  }
75
75
  ),
76
- /* @__PURE__ */ i(
76
+ /* @__PURE__ */ n(
77
77
  "div",
78
78
  {
79
79
  className: m ? "gi-combobox-dropdown-container-open" : "gi-hidden",
80
80
  id: `${r}-search`,
81
81
  children: [
82
- !h && /* @__PURE__ */ i("div", { className: "gi-combobox-search", children: [
82
+ !h && /* @__PURE__ */ n("div", { className: "gi-combobox-search", children: [
83
83
  /* @__PURE__ */ s(
84
84
  O,
85
85
  {
86
86
  placeholder: N("dropdownItem.search", { defaultValue: "Search" }),
87
87
  className: "gi-combobox-search-input",
88
88
  value: d,
89
- onChange: (e) => {
90
- const o = e.target.value;
91
- $(o), l == null || l(o);
89
+ onChange: (o) => {
90
+ const e = o.target.value;
91
+ $(e), l == null || l(e);
92
92
  }
93
93
  }
94
94
  ),
@@ -108,7 +108,7 @@ const ee = ({
108
108
  }
109
109
  )
110
110
  ] }),
111
- /* @__PURE__ */ i(
111
+ /* @__PURE__ */ n(
112
112
  "div",
113
113
  {
114
114
  className: x("gi-combobox-checkbox-container", {
@@ -118,8 +118,8 @@ const ee = ({
118
118
  I && /* @__PURE__ */ s(y, { className: "gi-combobox-checkbox-paragraph", children: N("dropdownItem.noResultFound", {
119
119
  defaultValue: "No results found."
120
120
  }) }),
121
- p.map((e, o) => {
122
- const a = t == null ? void 0 : t.includes(e.value);
121
+ p.map((o, e) => {
122
+ const a = t == null ? void 0 : t.includes(o.value);
123
123
  return /* @__PURE__ */ s(
124
124
  "div",
125
125
  {
@@ -127,16 +127,16 @@ const ee = ({
127
127
  children: /* @__PURE__ */ s(
128
128
  L,
129
129
  {
130
- onChange: (n) => R(e.value, n.target.checked),
130
+ onChange: (i) => R(o.value, i.target.checked),
131
131
  checked: a,
132
- id: `${o}_${r}_${e.value}`,
133
- label: e.label,
134
- name: `${o}_${e.label}_${r}`,
135
- value: e.value
132
+ id: `${e}_${r}_${o.value}`,
133
+ label: o.label,
134
+ name: `${e}_${o.label}_${r}`,
135
+ value: o.value
136
136
  }
137
137
  )
138
138
  },
139
- `${o}_${r}_${e.value}`
139
+ `${e}_${r}_${o.value}`
140
140
  );
141
141
  })
142
142
  ]
@@ -150,5 +150,5 @@ const ee = ({
150
150
  );
151
151
  };
152
152
  export {
153
- ee as DropdownItem
153
+ oo as DropdownItem
154
154
  };
@@ -1,11 +1,11 @@
1
- import { jsxs as s, Fragment as m, jsx as e } from "react/jsx-runtime";
1
+ import { jsxs as s, jsx as e, Fragment as d } from "react/jsx-runtime";
2
2
  import { MenuItemAccordion as p } from "../header/components/header-menu.js";
3
3
  import { HeaderSearch as g } from "../header/components/header-search.js";
4
4
  import { ListItem as o } from "../list-item/list-item.js";
5
5
  import { DrawerBody as b, DrawerFooter as f } from "./drawer.js";
6
- const D = /* @__PURE__ */ s(m, { children: [
6
+ const D = /* @__PURE__ */ s(d, { children: [
7
7
  /* @__PURE__ */ e(b, { children: /* @__PURE__ */ e("p", { className: "gi-paragraph-md", children: "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aperiam molestias error accusantium non nobis excepturi doloremque dolorem possimus corrupti. Nostrum quisquam est voluptate! Iure suscipit, commodi cupiditate sit minima veritatis." }) }),
8
- /* @__PURE__ */ e(f, { className: "gi-flex gi-gap-6 gi-justify-end", children: /* @__PURE__ */ s(m, { children: [
8
+ /* @__PURE__ */ e(f, { className: "gi-flex gi-gap-6 gi-justify-end", children: /* @__PURE__ */ s(d, { children: [
9
9
  /* @__PURE__ */ e("button", { className: "gi-btn gi-btn-secondary gi-btn-secondary-dark gi-btn-regular", children: "Cancel" }),
10
10
  /* @__PURE__ */ e("button", { className: "gi-btn gi-btn-primary gi-btn-regular", children: "Primary" })
11
11
  ] }) })
@@ -44,7 +44,7 @@ const D = /* @__PURE__ */ s(m, { children: [
44
44
  href: "#",
45
45
  label: "Gaeilge"
46
46
  }
47
- ], d = {};
47
+ ], c = {};
48
48
  return /* @__PURE__ */ s("ul", { children: [
49
49
  i == null ? void 0 : i.map((r, t) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
50
50
  o,
@@ -55,10 +55,10 @@ const D = /* @__PURE__ */ s(m, { children: [
55
55
  }
56
56
  ) }, `navLink-${r.label}-${t}`)),
57
57
  a == null ? void 0 : a.map(
58
- ({ href: r, label: t, slot: l, keepOnMobile: u, external: h }, c) => l && !u ? null : /* @__PURE__ */ e("li", { children: l ? /* @__PURE__ */ e(p, { index: c, item: { label: t, slot: l } }) : /* @__PURE__ */ e(o, { href: r, label: t, external: h }) }, `toolItems-${t}-${c}`)
58
+ ({ href: r, label: t, slot: l, keepOnMobile: u, external: h }, m) => l && !u ? null : /* @__PURE__ */ e("li", { children: l ? /* @__PURE__ */ e(p, { index: m, item: { label: t, slot: l } }) : /* @__PURE__ */ e(o, { href: r, label: t, external: h }) }, `toolItems-${t}-${m}`)
59
59
  ),
60
60
  n == null ? void 0 : n.map((r, t) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(o, { href: r.href, label: r.label, bold: !1 }) }, `secondary-${r.label}-${t}`)),
61
- /* @__PURE__ */ e("li", { className: "gi-mt-8 sm:gi-hidden", children: /* @__PURE__ */ e(g, { ...d }) })
61
+ c && /* @__PURE__ */ e("li", { className: "gi-mt-8 sm:gi-hidden", children: /* @__PURE__ */ e(g, { ...c }) })
62
62
  ] });
63
63
  };
64
64
  export {
@@ -1,13 +1,13 @@
1
1
  "use client";
2
2
  import { jsx as r, jsxs as x, Fragment as y } from "react/jsx-runtime";
3
3
  import { useState as D, cloneElement as O } from "react";
4
- import { cn as n } from "../cn.js";
5
- import { ModalWrapper as F, ModalBody as M, ModalFooter as N } from "../modal/modal.js";
4
+ import { cn as a } from "../cn.js";
5
+ import { ModalBody as F, ModalFooter as M, ModalWrapper as N } from "../modal/modal.js";
6
6
  const b = ({
7
7
  children: o,
8
8
  className: e,
9
9
  ...s
10
- }) => /* @__PURE__ */ r(F, { className: n("gi-drawer-container", e), ...s, children: o }), S = ({
10
+ }) => /* @__PURE__ */ r(N, { className: a("gi-drawer-container", e), ...s, children: o }), I = ({
11
11
  children: o,
12
12
  triggerButton: e,
13
13
  startsOpen: s,
@@ -16,7 +16,7 @@ const b = ({
16
16
  className: m,
17
17
  closeButtonSize: f
18
18
  }) => {
19
- const [t, a] = D(!!s), w = () => a(!0), C = () => a(!1), h = O(e, {
19
+ const [t, n] = D(!!s), w = () => n(!0), C = () => n(!1), h = O(e, {
20
20
  "data-testid": "drawer-trigger-button-container",
21
21
  onClick: (k) => {
22
22
  var l, d;
@@ -39,10 +39,10 @@ const b = ({
39
39
  }
40
40
  )
41
41
  ] });
42
- }, T = ({ children: o, className: e }) => /* @__PURE__ */ r(M, { className: n("gi-drawer-body", e), children: o }), q = ({ children: o, className: e }) => /* @__PURE__ */ r(N, { className: n("gi-drawer-footer", e), children: o });
42
+ }, S = ({ children: o, className: e }) => /* @__PURE__ */ r(F, { className: a("gi-drawer-body", e), children: o }), T = ({ children: o, className: e }) => /* @__PURE__ */ r(M, { className: a("gi-drawer-footer", e), children: o });
43
43
  export {
44
- S as Drawer,
45
- T as DrawerBody,
46
- q as DrawerFooter,
44
+ I as Drawer,
45
+ S as DrawerBody,
46
+ T as DrawerFooter,
47
47
  b as DrawerWrapper
48
48
  };
@@ -1,5 +1,5 @@
1
1
  import { jsx as a } from "react/jsx-runtime";
2
- import { c as m } from "../index-DNkhmzZp.js";
2
+ import { c as m } from "../index-CB-zPpNk.js";
3
3
  const d = {
4
4
  Small: "sm",
5
5
  Medium: "md",
@@ -0,0 +1,18 @@
1
+ import { ErrorTextProps } from '../../error-text/types.js';
2
+ import { HintTextProps } from '../../hint-text/types.js';
3
+ import { LabelTextProps } from '../../label/types.js';
4
+ import { FormFieldProps } from './types.js';
5
+ declare const FormField: (props: FormFieldProps) => import("react/jsx-runtime").JSX.Element;
6
+ declare const FormFieldLabel: {
7
+ ({ children, text, size, htmlFor, className, }: LabelTextProps): import("react/jsx-runtime").JSX.Element;
8
+ displayName: string;
9
+ };
10
+ declare const FormFieldHint: {
11
+ ({ children, text, size, className }: HintTextProps): import("react/jsx-runtime").JSX.Element;
12
+ displayName: string;
13
+ };
14
+ declare const FormFieldError: {
15
+ ({ children, text, size, className, }: ErrorTextProps): import("react/jsx-runtime").JSX.Element;
16
+ displayName: string;
17
+ };
18
+ export { FormField, FormFieldLabel, FormFieldHint, FormFieldError };
@@ -0,0 +1,85 @@
1
+ "use client";
2
+ import { jsx as i, jsxs as a } from "react/jsx-runtime";
3
+ import { S as y } from "../../index-2sRBqKFV.js";
4
+ import { createContext as N, Children as p, isValidElement as l, useContext as C } from "react";
5
+ import { cn as m } from "../../cn.js";
6
+ import { ErrorText as v } from "../../error-text/error-text.js";
7
+ import { HintText as L } from "../../hint-text/hint-text.js";
8
+ import { Label as E } from "../../label/label.js";
9
+ const f = N(null);
10
+ function u(e) {
11
+ C(f) || console.error(`[${e}] must be used within a <FormField>.`);
12
+ }
13
+ function H(e) {
14
+ return e === s || e === c || e === d;
15
+ }
16
+ const B = (e) => ["error", "hint", "label"].some((r) => r in e) ? (console.warn(
17
+ "[FormField] Using legacy props. Please migrate to the new composable API."
18
+ ), /* @__PURE__ */ i(f.Provider, { value: !0, children: /* @__PURE__ */ a(g, { children: [
19
+ e.label && /* @__PURE__ */ i(s, { ...e.label }),
20
+ e.hint && /* @__PURE__ */ i(c, { ...e.hint }),
21
+ e.error && /* @__PURE__ */ i(d, { ...e.error }),
22
+ e.children
23
+ ] }) })) : /* @__PURE__ */ i(f.Provider, { value: !0, children: /* @__PURE__ */ i(g, { children: e.children }) }), g = ({
24
+ children: e,
25
+ className: o,
26
+ ...n
27
+ }) => {
28
+ const r = p.toArray(e), F = r.find(
29
+ (t) => l(t) && t.type === s
30
+ ), h = r.find(
31
+ (t) => l(t) && t.type === c
32
+ ), b = r.find(
33
+ (t) => l(t) && t.type === d
34
+ ), x = r.filter(
35
+ (t) => !l(t) || !H(t.type)
36
+ );
37
+ return /* @__PURE__ */ a(
38
+ "fieldset",
39
+ {
40
+ className: m({ "gi-error-state": !!b }, o),
41
+ ...n,
42
+ children: [
43
+ /* @__PURE__ */ a("div", { className: "gi-pb-3 gi-flex gi-flex-col gi-gap-1", children: [
44
+ /* @__PURE__ */ a("div", { children: [
45
+ F,
46
+ h
47
+ ] }),
48
+ b
49
+ ] }),
50
+ /* @__PURE__ */ i(y, { children: x })
51
+ ]
52
+ }
53
+ );
54
+ }, s = ({
55
+ children: e,
56
+ text: o,
57
+ size: n,
58
+ htmlFor: r,
59
+ className: F
60
+ }) => (u("FormFieldLabel"), /* @__PURE__ */ i(
61
+ E,
62
+ {
63
+ text: o,
64
+ size: n,
65
+ htmlFor: r,
66
+ className: m("gi-font-bold", F),
67
+ children: e
68
+ }
69
+ ));
70
+ s.displayName = "FormFieldLabel";
71
+ const c = ({ children: e, text: o, size: n, className: r }) => (u("FormFieldHint"), /* @__PURE__ */ i(L, { text: o, size: n, className: m("gi-mb-1", r), children: e }));
72
+ c.displayName = "FormFieldHint";
73
+ const d = ({
74
+ children: e,
75
+ text: o,
76
+ size: n,
77
+ className: r
78
+ }) => (u("FormFieldError"), /* @__PURE__ */ i(v, { text: o, size: n, className: m("gi-mb-1", r), children: e }));
79
+ d.displayName = "FormFieldError";
80
+ export {
81
+ B as FormField,
82
+ d as FormFieldError,
83
+ c as FormFieldHint,
84
+ s as FormFieldLabel
85
+ };
@@ -0,0 +1,13 @@
1
+ import { FieldsetHTMLAttributes } from 'react';
2
+ import { ErrorTextProps } from '../../error-text/types.js';
3
+ import { HintTextProps } from '../../hint-text/types.js';
4
+ import { LabelTextProps } from '../../label/types.js';
5
+ export type FormFieldProps = {
6
+ /** @deprecated Use <FormFieldError> instead */
7
+ error?: ErrorTextProps;
8
+ /** @deprecated Use <FormFieldHint> instead */
9
+ hint?: HintTextProps;
10
+ /** @deprecated Use <FormFieldLabel> instead */
11
+ label?: LabelTextProps;
12
+ className?: string;
13
+ } & Omit<FieldsetHTMLAttributes<HTMLFieldSetElement>, 'style'>;
@@ -0,0 +1 @@
1
+
@@ -1,5 +1,5 @@
1
1
  import { jsxs as o, jsx as m } from "react/jsx-runtime";
2
- import { S as d } from "../../index-ntYL1VRC.js";
2
+ import { S as d } from "../../index-2sRBqKFV.js";
3
3
  import { cn as c } from "../../cn.js";
4
4
  import { ErrorText as l } from "../../error-text/error-text.js";
5
5
  import { HintText as f } from "../../hint-text/hint-text.js";
@@ -1,5 +1,5 @@
1
1
  import { jsxs as x, Fragment as o, jsx as s } from "react/jsx-runtime";
2
- import { c as l } from "../index-DNkhmzZp.js";
2
+ import { c as l } from "../index-CB-zPpNk.js";
3
3
  import { cn as e } from "../cn.js";
4
4
  const c = {
5
5
  xl: "gi-heading-xl",