@tedi-design-system/react 14.4.0-rc.1 → 14.4.0-rc.10

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 (53) hide show
  1. package/README.md +30 -14
  2. package/_virtual/index.es13.js +2 -2
  3. package/_virtual/index.es14.js +2 -2
  4. package/bundle-stats.html +1 -1
  5. package/external/react-is/index.cjs.js +1 -1
  6. package/external/react-is/index.es.js +1 -1
  7. package/external/toposort/index.cjs.js +1 -1
  8. package/external/toposort/index.es.js +1 -1
  9. package/index.css +1 -1
  10. package/package.json +1 -1
  11. package/src/tedi/components/buttons/collapse/collapse.cjs.js +1 -1
  12. package/src/tedi/components/buttons/collapse/collapse.d.ts +13 -8
  13. package/src/tedi/components/buttons/collapse/collapse.es.js +90 -66
  14. package/src/tedi/components/buttons/collapse/collapse.module.scss.cjs.js +1 -1
  15. package/src/tedi/components/buttons/collapse/collapse.module.scss.es.js +9 -2
  16. package/src/tedi/components/buttons/info-button/info-button.cjs.js +1 -1
  17. package/src/tedi/components/buttons/info-button/info-button.d.ts +5 -1
  18. package/src/tedi/components/buttons/info-button/info-button.es.js +14 -14
  19. package/src/tedi/components/content/label/label.cjs.js +1 -1
  20. package/src/tedi/components/content/label/label.es.js +24 -23
  21. package/src/tedi/components/form/checkbox/checkbox.cjs.js +1 -1
  22. package/src/tedi/components/form/checkbox/checkbox.es.js +40 -40
  23. package/src/tedi/components/form/file-dropzone/file-dropzone.cjs.js +1 -1
  24. package/src/tedi/components/form/file-dropzone/file-dropzone.es.js +69 -59
  25. package/src/tedi/components/form/file-dropzone/file-dropzone.module.scss.cjs.js +1 -1
  26. package/src/tedi/components/form/file-dropzone/file-dropzone.module.scss.es.js +1 -0
  27. package/src/tedi/components/form/file-upload/file-upload.cjs.js +1 -1
  28. package/src/tedi/components/form/file-upload/file-upload.es.js +109 -90
  29. package/src/tedi/components/form/file-upload/file-upload.module.scss.cjs.js +1 -1
  30. package/src/tedi/components/form/file-upload/file-upload.module.scss.es.js +3 -1
  31. package/src/tedi/components/form/search/search.cjs.js +1 -1
  32. package/src/tedi/components/form/search/search.d.ts +5 -0
  33. package/src/tedi/components/form/search/search.es.js +30 -28
  34. package/src/tedi/components/form/select/select.cjs.js +1 -1
  35. package/src/tedi/components/form/select/select.es.js +134 -131
  36. package/src/tedi/components/overlays/overlay/overlay-content.cjs.js +1 -1
  37. package/src/tedi/components/overlays/overlay/overlay-content.d.ts +27 -2
  38. package/src/tedi/components/overlays/overlay/overlay-content.es.js +37 -34
  39. package/src/tedi/components/overlays/overlay/overlay.cjs.js +1 -1
  40. package/src/tedi/components/overlays/overlay/overlay.es.js +72 -71
  41. package/src/tedi/components/overlays/popover/popover-content.cjs.js +1 -1
  42. package/src/tedi/components/overlays/popover/popover-content.es.js +31 -29
  43. package/src/tedi/components/overlays/popover/popover.cjs.js +1 -1
  44. package/src/tedi/components/overlays/popover/popover.es.js +1 -0
  45. package/src/tedi/helpers/hooks/use-file-upload.cjs.js +1 -1
  46. package/src/tedi/helpers/hooks/use-file-upload.d.ts +6 -0
  47. package/src/tedi/helpers/hooks/use-file-upload.es.js +67 -50
  48. package/src/tedi/providers/label-provider/labels-map.cjs.js +1 -1
  49. package/src/tedi/providers/label-provider/labels-map.d.ts +49 -0
  50. package/src/tedi/providers/label-provider/labels-map.es.js +56 -4
  51. package/src/tedi/providers/theme-provider/theme-provider.cjs.js +1 -1
  52. package/src/tedi/providers/theme-provider/theme-provider.d.ts +1 -2
  53. package/src/tedi/providers/theme-provider/theme-provider.es.js +26 -17
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tedi-design-system/react",
3
- "version": "14.4.0-rc.1",
3
+ "version": "14.4.0-rc.10",
4
4
  "type": "module",
5
5
  "sideEffects": false,
6
6
  "exports": {
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),n=require("../../../../../external/classnames/index.cjs.js"),o=require("react"),R=require("../../../../../external/react-animate-height/dist/esm/index.cjs.js"),w=require("../../base/icon/icon.cjs.js"),T=require("../../base/typography/text/text.cjs.js"),D=require("../../misc/print/print.cjs.js"),t=require("./collapse.module.scss.cjs.js"),L=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),$=require("../../../providers/label-provider/use-labels.cjs.js"),E=require("../../../helpers/hooks/use-print.cjs.js"),b=require("../../layout/grid/row.cjs.js"),i=require("../../layout/grid/col.cjs.js"),q=u=>{const{getCurrentBreakpointProps:C}=L.useBreakpointProps(u.defaultServerBreakpoint),{getLabel:p}=$.useLabels(),{id:a,children:x,className:m,openText:y=p("open"),closeText:v=p("close"),hideCollapseText:N=!1,title:h,titleRowProps:P,defaultOpen:g,open:r,onToggle:c,arrowType:k="neutral",underline:M=!0,...O}=C(u),[f,S]=o.useState(()=>g),d=E.usePrint(),s=o.useMemo(()=>d||(r!==void 0?r:f),[d,r,f]),B=o.useMemo(()=>n.default(t.default["tedi-collapse"],m,{[t.default["tedi-collapse--is-open"]]:s}),[m,s]),_=()=>{const l=!s;S(l),c==null||c(l)},I=l=>{(l.key==="Enter"||l.key===" ")&&!l.repeat&&(l.preventDefault(),_())},j=o.useMemo(()=>e.jsx("div",{className:t.default["tedi-collapse__content"],children:x}),[x]);return e.jsxs("div",{"data-name":"collapse",...O,className:B,children:[e.jsx("button",{type:"button","data-name":"collapse-trigger",className:t.default["tedi-collapse__title"],"aria-labelledby":`${a}-collapse-label`,"aria-expanded":s,"aria-controls":a,onKeyDown:I,onClick:_,children:e.jsxs(b.Row,{justifyContent:"between",alignItems:"center",wrap:"nowrap",...P,element:"span",children:[h&&e.jsx(i.Col,{"aria-hidden":"true",children:h}),e.jsx(i.Col,{width:"auto",children:e.jsxs(b.Row,{element:"span",alignItems:"center",gutter:1,children:[e.jsx(D.Print,{visibility:"hide",children:e.jsx(i.Col,{width:"auto",className:n.default({"visually-hidden":N}),children:e.jsx(T.Text,{element:"span",color:"brand",className:n.default(t.default["tedi-collapse__text"],{[t.default["tedi-collapse__text--underline"]]:M}),id:`${a}-collapse-label`,children:s?v:y})})}),e.jsx(i.Col,{width:"auto",children:k==="secondary"?e.jsx("div",{className:t.default["tedi-collapse__icon-wrapper"],children:e.jsx(w.Icon,{className:n.default(t.default["tedi-collapse__icon"]),name:"expand_more"})}):e.jsx(w.Icon,{className:n.default(t.default["tedi-collapse__icon"]),name:"expand_more"})})]})})]})}),d?j:e.jsx(R.default,{duration:300,id:a,height:s?"auto":0,"data-testid":"collapse-inner",children:j})]})};exports.Collapse=q;exports.default=q;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),s=require("../../../../../external/classnames/index.cjs.js"),_=require("react"),L=require("../../../../../external/react-animate-height/dist/esm/index.cjs.js"),z=require("../../base/icon/icon.cjs.js"),E=require("../../base/typography/text/text.cjs.js"),K=require("../../misc/print/print.cjs.js"),e=require("./collapse.module.scss.cjs.js"),A=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),F=require("../../../providers/label-provider/use-labels.cjs.js"),G=require("../../../helpers/hooks/use-print.cjs.js"),C=require("../../layout/grid/row.cjs.js"),r=require("../../layout/grid/col.cjs.js"),g=f=>{const{getCurrentBreakpointProps:v}=A.useBreakpointProps(f.defaultServerBreakpoint),{getLabel:m}=F.useLabels(),{id:n,children:x,className:P,openText:k=m("open"),closeText:I=m("close"),hideCollapseText:h=!1,title:w,titleRowProps:N,defaultOpen:$,open:d,onToggle:c,arrowType:i="default",size:o="default",underline:O=!0,...S}=v(f),B=`${n}__trigger`,j=`${n}__label`,u=`${n}__content`,M=`${n}__animate`,[b,R]=_.useState(()=>$),p=G.usePrint(),a=_.useMemo(()=>p||(d!==void 0?d:b),[p,d,b]),T=s.default(e.default["tedi-collapse"],o==="small"&&e.default["tedi-collapse--small"],a&&e.default["tedi-collapse--is-open"],h&&e.default["tedi-collapse--icon-only"],e.default[`tedi-collapse--arrow-${i}`],P),q=()=>{const l=!a;R(l),c==null||c(l)},D=l=>{(l.key==="Enter"||l.key===" ")&&!l.repeat&&(l.preventDefault(),q())},y=_.useMemo(()=>t.jsx("div",{id:u,className:e.default["tedi-collapse__content"],children:x}),[x,u]);return t.jsxs("div",{"data-name":"collapse",...S,className:T,children:[t.jsx("button",{id:B,type:"button","data-name":"collapse-trigger",className:e.default["tedi-collapse__title"],"aria-labelledby":j,"aria-expanded":a,"aria-controls":u,onKeyDown:D,onClick:q,children:t.jsxs(C.Row,{justifyContent:"between",alignItems:"center",wrap:"nowrap",...N,element:"span",children:[w&&t.jsx(r.Col,{"aria-hidden":"true",children:w}),t.jsx(r.Col,{width:"auto",children:t.jsxs(C.Row,{element:"span",alignItems:"center",gutter:0,wrap:"nowrap",children:[t.jsx(K.Print,{visibility:"hide",children:t.jsx(r.Col,{width:"auto",className:s.default({"visually-hidden":h}),children:t.jsx(E.Text,{element:"span",className:s.default(e.default["tedi-collapse__text"],{[e.default["tedi-collapse__text--underline"]]:O}),id:j,children:a?I:k})})}),t.jsx(r.Col,{width:"auto",children:t.jsx("div",{className:s.default(e.default["tedi-collapse__icon-wrapper"],e.default[`tedi-collapse__icon-wrapper--${i}`],o==="small"&&e.default["tedi-collapse__icon-wrapper--small"]),children:t.jsx(z.Icon,{className:s.default(e.default["tedi-collapse__icon"],e.default[`tedi-collapse__icon--${i}`],o==="small"&&e.default["tedi-collapse__icon--small"]),name:"expand_more",size:o==="small"||i==="secondary"?18:24})})})]})})]})}),p?y:t.jsx(L.default,{id:M,duration:300,height:a?"auto":0,"data-testid":"collapse-inner",children:y})]})};exports.Collapse=g;exports.default=g;
@@ -3,31 +3,36 @@ import { BreakpointSupport } from '../../../helpers';
3
3
  import { RowProps } from '../../layout/grid';
4
4
  type CollapseBreakpointProps = {
5
5
  /**
6
- * Whether the collapse should be initially open (uncontrolled mode).
7
- * This is ignored when `open` and `onToggle` are provided.
6
+ * Whether the collapse should be initially open (uncontrolled mode)
7
+ * This is ignored when `open` and `onToggle` are provided
8
8
  * @default false
9
9
  */
10
10
  defaultOpen?: boolean;
11
11
  /**
12
- * Controls the open/closed state of the collapse (controlled mode).
13
- * Should be used together with `onToggle`.
12
+ * Controls the open/closed state of the collapse (controlled mode)
13
+ * Should be used together with `onToggle`
14
14
  */
15
15
  open?: boolean;
16
16
  /**
17
- * Whether to visually hide the open/close text on the toggle button.
18
- * Useful for icon-only toggles.
17
+ * Whether to visually hide the open/close text on the toggle button
18
+ * Useful for icon-only toggles
19
19
  * @default false
20
20
  */
21
21
  hideCollapseText?: boolean;
22
22
  /**
23
- * Additional props to pass to the `Row` component used in the title area.
23
+ * Additional props to pass to the `Row` component used in the title area
24
24
  */
25
25
  titleRowProps?: RowProps;
26
26
  /**
27
- * Custom class name for the root element.
27
+ * Custom class name for the root element
28
28
  */
29
29
  className?: string;
30
30
  arrowType?: 'default' | 'secondary';
31
+ /**
32
+ * Collapse text & icon size
33
+ * @default default
34
+ */
35
+ size?: 'default' | 'small';
31
36
  underline?: boolean;
32
37
  };
33
38
  export interface CollapseProps extends BreakpointSupport<CollapseBreakpointProps> {
@@ -1,85 +1,109 @@
1
- import { jsx as e, jsxs as p } from "react/jsx-runtime";
2
- import n from "../../../../../external/classnames/index.es.js";
3
- import i from "react";
4
- import D from "../../../../../external/react-animate-height/dist/esm/index.es.js";
5
- import { Icon as b } from "../../base/icon/icon.es.js";
6
- import { Text as R } from "../../base/typography/text/text.es.js";
7
- import { Print as E } from "../../misc/print/print.es.js";
8
- import t from "./collapse.module.scss.es.js";
9
- import { useBreakpointProps as K } from "../../../helpers/hooks/use-breakpoint-props.es.js";
10
- import { useLabels as L } from "../../../providers/label-provider/use-labels.es.js";
11
- import { usePrint as $ } from "../../../helpers/hooks/use-print.es.js";
12
- import { Row as N } from "../../layout/grid/row.es.js";
1
+ import { jsx as t, jsxs as _ } from "react/jsx-runtime";
2
+ import o from "../../../../../external/classnames/index.es.js";
3
+ import u from "react";
4
+ import E from "../../../../../external/react-animate-height/dist/esm/index.es.js";
5
+ import { Icon as K } from "../../base/icon/icon.es.js";
6
+ import { Text as L } from "../../base/typography/text/text.es.js";
7
+ import { Print as A } from "../../misc/print/print.es.js";
8
+ import e from "./collapse.module.scss.es.js";
9
+ import { useBreakpointProps as H } from "../../../helpers/hooks/use-breakpoint-props.es.js";
10
+ import { useLabels as q } from "../../../providers/label-provider/use-labels.es.js";
11
+ import { usePrint as F } from "../../../helpers/hooks/use-print.es.js";
12
+ import { Row as v } from "../../layout/grid/row.es.js";
13
13
  import { Col as r } from "../../layout/grid/col.es.js";
14
- const Z = (m) => {
15
- const { getCurrentBreakpointProps: C } = K(m.defaultServerBreakpoint), { getLabel: u } = L(), {
16
- id: l,
17
- children: h,
18
- className: f,
19
- openText: v = u("open"),
20
- closeText: g = u("close"),
21
- hideCollapseText: k = !1,
22
- title: _,
23
- titleRowProps: P,
24
- defaultOpen: O,
25
- open: s,
26
- onToggle: c,
27
- arrowType: B = "neutral",
28
- underline: I = !0,
29
- ...M
30
- } = C(m), [w, S] = i.useState(() => O), d = $(), o = i.useMemo(
31
- () => d || (s !== void 0 ? s : w),
32
- [d, s, w]
33
- ), T = i.useMemo(
34
- () => n(t["tedi-collapse"], f, {
35
- [t["tedi-collapse--is-open"]]: o
36
- }),
37
- [f, o]
38
- ), x = () => {
39
- const a = !o;
40
- S(a), c == null || c(a);
41
- }, j = (a) => {
42
- (a.key === "Enter" || a.key === " ") && !a.repeat && (a.preventDefault(), x());
43
- }, y = i.useMemo(
44
- () => /* @__PURE__ */ e("div", { className: t["tedi-collapse__content"], children: h }),
45
- [h]
14
+ const oe = (h) => {
15
+ const { getCurrentBreakpointProps: I } = H(h.defaultServerBreakpoint), { getLabel: f } = q(), {
16
+ id: n,
17
+ children: w,
18
+ className: k,
19
+ openText: $ = f("open"),
20
+ closeText: P = f("close"),
21
+ hideCollapseText: y = !1,
22
+ title: g,
23
+ titleRowProps: O,
24
+ defaultOpen: B,
25
+ open: c,
26
+ onToggle: d,
27
+ arrowType: i = "default",
28
+ size: s = "default",
29
+ underline: S = !0,
30
+ ...T
31
+ } = I(h), j = `${n}__trigger`, x = `${n}__label`, p = `${n}__content`, D = `${n}__animate`, [b, M] = u.useState(() => B), m = F(), a = u.useMemo(
32
+ () => m || (c !== void 0 ? c : b),
33
+ [m, c, b]
34
+ ), R = o(
35
+ e["tedi-collapse"],
36
+ s === "small" && e["tedi-collapse--small"],
37
+ a && e["tedi-collapse--is-open"],
38
+ y && e["tedi-collapse--icon-only"],
39
+ e[`tedi-collapse--arrow-${i}`],
40
+ k
41
+ ), C = () => {
42
+ const l = !a;
43
+ M(l), d == null || d(l);
44
+ }, z = (l) => {
45
+ (l.key === "Enter" || l.key === " ") && !l.repeat && (l.preventDefault(), C());
46
+ }, N = u.useMemo(
47
+ () => /* @__PURE__ */ t("div", { id: p, className: e["tedi-collapse__content"], children: w }),
48
+ [w, p]
46
49
  );
47
- return /* @__PURE__ */ p("div", { "data-name": "collapse", ...M, className: T, children: [
48
- /* @__PURE__ */ e(
50
+ return /* @__PURE__ */ _("div", { "data-name": "collapse", ...T, className: R, children: [
51
+ /* @__PURE__ */ t(
49
52
  "button",
50
53
  {
54
+ id: j,
51
55
  type: "button",
52
56
  "data-name": "collapse-trigger",
53
- className: t["tedi-collapse__title"],
54
- "aria-labelledby": `${l}-collapse-label`,
55
- "aria-expanded": o,
56
- "aria-controls": l,
57
- onKeyDown: j,
58
- onClick: x,
59
- children: /* @__PURE__ */ p(N, { justifyContent: "between", alignItems: "center", wrap: "nowrap", ...P, element: "span", children: [
60
- _ && /* @__PURE__ */ e(r, { "aria-hidden": "true", children: _ }),
61
- /* @__PURE__ */ e(r, { width: "auto", children: /* @__PURE__ */ p(N, { element: "span", alignItems: "center", gutter: 1, children: [
62
- /* @__PURE__ */ e(E, { visibility: "hide", children: /* @__PURE__ */ e(r, { width: "auto", className: n({ "visually-hidden": k }), children: /* @__PURE__ */ e(
63
- R,
57
+ className: e["tedi-collapse__title"],
58
+ "aria-labelledby": x,
59
+ "aria-expanded": a,
60
+ "aria-controls": p,
61
+ onKeyDown: z,
62
+ onClick: C,
63
+ children: /* @__PURE__ */ _(v, { justifyContent: "between", alignItems: "center", wrap: "nowrap", ...O, element: "span", children: [
64
+ g && /* @__PURE__ */ t(r, { "aria-hidden": "true", children: g }),
65
+ /* @__PURE__ */ t(r, { width: "auto", children: /* @__PURE__ */ _(v, { element: "span", alignItems: "center", gutter: 0, wrap: "nowrap", children: [
66
+ /* @__PURE__ */ t(A, { visibility: "hide", children: /* @__PURE__ */ t(r, { width: "auto", className: o({ "visually-hidden": y }), children: /* @__PURE__ */ t(
67
+ L,
64
68
  {
65
69
  element: "span",
66
- color: "brand",
67
- className: n(t["tedi-collapse__text"], {
68
- [t["tedi-collapse__text--underline"]]: I
70
+ className: o(e["tedi-collapse__text"], {
71
+ [e["tedi-collapse__text--underline"]]: S
69
72
  }),
70
- id: `${l}-collapse-label`,
71
- children: o ? g : v
73
+ id: x,
74
+ children: a ? P : $
72
75
  }
73
76
  ) }) }),
74
- /* @__PURE__ */ e(r, { width: "auto", children: B === "secondary" ? /* @__PURE__ */ e("div", { className: t["tedi-collapse__icon-wrapper"], children: /* @__PURE__ */ e(b, { className: n(t["tedi-collapse__icon"]), name: "expand_more" }) }) : /* @__PURE__ */ e(b, { className: n(t["tedi-collapse__icon"]), name: "expand_more" }) })
77
+ /* @__PURE__ */ t(r, { width: "auto", children: /* @__PURE__ */ t(
78
+ "div",
79
+ {
80
+ className: o(
81
+ e["tedi-collapse__icon-wrapper"],
82
+ e[`tedi-collapse__icon-wrapper--${i}`],
83
+ s === "small" && e["tedi-collapse__icon-wrapper--small"]
84
+ ),
85
+ children: /* @__PURE__ */ t(
86
+ K,
87
+ {
88
+ className: o(
89
+ e["tedi-collapse__icon"],
90
+ e[`tedi-collapse__icon--${i}`],
91
+ s === "small" && e["tedi-collapse__icon--small"]
92
+ ),
93
+ name: "expand_more",
94
+ size: s === "small" || i === "secondary" ? 18 : 24
95
+ }
96
+ )
97
+ }
98
+ ) })
75
99
  ] }) })
76
100
  ] })
77
101
  }
78
102
  ),
79
- d ? y : /* @__PURE__ */ e(D, { duration: 300, id: l, height: o ? "auto" : 0, "data-testid": "collapse-inner", children: y })
103
+ m ? N : /* @__PURE__ */ t(E, { id: D, duration: 300, height: a ? "auto" : 0, "data-testid": "collapse-inner", children: N })
80
104
  ] });
81
105
  };
82
106
  export {
83
- Z as Collapse,
84
- Z as default
107
+ oe as Collapse,
108
+ oe as default
85
109
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-collapse__title":"tedi-collapse__title-3e140e5c","tedi-collapse__text--underline":"tedi-collapse__text--underline-73ca86bd","tedi-collapse__icon-wrapper":"tedi-collapse__icon-wrapper-d2b036ea","tedi-collapse__icon":"tedi-collapse__icon-5156e480","tedi-collapse--is-open":"tedi-collapse--is-open-b34b11c3","tedi-collapse__content":"tedi-collapse__content-350b91f8"};exports.default=e;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-collapse__title":"tedi-collapse__title-3e140e5c","tedi-collapse__text":"tedi-collapse__text-d150fea1","tedi-collapse__text--underline":"tedi-collapse__text--underline-73ca86bd","tedi-collapse__icon-wrapper":"tedi-collapse__icon-wrapper-d2b036ea","tedi-collapse__icon":"tedi-collapse__icon-5156e480","tedi-collapse__icon-wrapper--secondary":"tedi-collapse__icon-wrapper--secondary-3321348a","tedi-collapse__icon--secondary":"tedi-collapse__icon--secondary-f0f3125f","tedi-collapse__icon--default":"tedi-collapse__icon--default-9c7e19e4","tedi-collapse__icon-wrapper--default":"tedi-collapse__icon-wrapper--default-450808b2","tedi-collapse__icon-wrapper--small":"tedi-collapse__icon-wrapper--small-65e6d09a","tedi-collapse--icon-only":"tedi-collapse--icon-only-335962f8","tedi-collapse__content":"tedi-collapse__content-350b91f8","tedi-collapse--is-open":"tedi-collapse--is-open-b34b11c3"};exports.default=e;
@@ -1,10 +1,17 @@
1
1
  const e = {
2
2
  "tedi-collapse__title": "tedi-collapse__title-3e140e5c",
3
+ "tedi-collapse__text": "tedi-collapse__text-d150fea1",
3
4
  "tedi-collapse__text--underline": "tedi-collapse__text--underline-73ca86bd",
4
5
  "tedi-collapse__icon-wrapper": "tedi-collapse__icon-wrapper-d2b036ea",
5
6
  "tedi-collapse__icon": "tedi-collapse__icon-5156e480",
6
- "tedi-collapse--is-open": "tedi-collapse--is-open-b34b11c3",
7
- "tedi-collapse__content": "tedi-collapse__content-350b91f8"
7
+ "tedi-collapse__icon-wrapper--secondary": "tedi-collapse__icon-wrapper--secondary-3321348a",
8
+ "tedi-collapse__icon--secondary": "tedi-collapse__icon--secondary-f0f3125f",
9
+ "tedi-collapse__icon--default": "tedi-collapse__icon--default-9c7e19e4",
10
+ "tedi-collapse__icon-wrapper--default": "tedi-collapse__icon-wrapper--default-450808b2",
11
+ "tedi-collapse__icon-wrapper--small": "tedi-collapse__icon-wrapper--small-65e6d09a",
12
+ "tedi-collapse--icon-only": "tedi-collapse--icon-only-335962f8",
13
+ "tedi-collapse__content": "tedi-collapse__content-350b91f8",
14
+ "tedi-collapse--is-open": "tedi-collapse--is-open-b34b11c3"
8
15
  };
9
16
  export {
10
17
  e as default
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("react/jsx-runtime"),i=require("../../../../../external/classnames/index.cjs.js"),r=require("react"),a=require("../button/button.cjs.js"),s=require("./info-button.module.scss.cjs.js"),e=r.forwardRef(({isSmall:n,...t},o)=>u.jsx(a.Button,{className:i.default(s.default["tedi-info-button"]),"data-name":"info-button",...t,type:"button",icon:{name:"info",size:n?16:18},visualType:"neutral",ref:o,children:t.children}));e.displayName="InfoButton";exports.InfoButton=e;exports.default=e;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),a=require("../../../../../external/classnames/index.cjs.js"),r=require("react"),s=require("../button/button.cjs.js"),f=require("./info-button.module.scss.cjs.js"),t=r.forwardRef(({isSmall:e,children:n,...o},u)=>i.jsx(s.Button,{className:a.default(f.default["tedi-info-button"]),"data-name":"info-button",...o,type:"button",icon:{name:"info",size:e?16:18},visualType:"neutral",ref:u,children:n}));t.displayName="InfoButton";exports.InfoButton=t;exports.default=t;
@@ -1,11 +1,15 @@
1
1
  import { default as React } from 'react';
2
2
  import { ButtonProps } from '../button/button';
3
- export interface InfoButtonProps extends Omit<ButtonProps, 'size'> {
3
+ export interface InfoButtonProps extends Omit<ButtonProps, 'size' | 'children'> {
4
4
  /**
5
5
  * If true, applies a small size to the InfoButton.
6
6
  * @default false
7
7
  */
8
8
  isSmall?: boolean;
9
+ /**
10
+ * Children elements to be rendered inside the InfoButton.
11
+ */
12
+ children?: React.ReactNode;
9
13
  }
10
14
  export declare const InfoButton: React.ForwardRefExoticComponent<Omit<InfoButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
11
15
  export default InfoButton;
@@ -1,25 +1,25 @@
1
1
  import { jsx as n } from "react/jsx-runtime";
2
- import a from "../../../../../external/classnames/index.es.js";
3
- import i from "react";
4
- import { Button as m } from "../button/button.es.js";
5
- import r from "./info-button.module.scss.es.js";
6
- const f = i.forwardRef(
7
- ({ isSmall: o, ...t }, e) => /* @__PURE__ */ n(
8
- m,
2
+ import m from "../../../../../external/classnames/index.es.js";
3
+ import f from "react";
4
+ import { Button as r } from "../button/button.es.js";
5
+ import i from "./info-button.module.scss.es.js";
6
+ const s = f.forwardRef(
7
+ ({ isSmall: t, children: o, ...a }, e) => /* @__PURE__ */ n(
8
+ r,
9
9
  {
10
- className: a(r["tedi-info-button"]),
10
+ className: m(i["tedi-info-button"]),
11
11
  "data-name": "info-button",
12
- ...t,
12
+ ...a,
13
13
  type: "button",
14
- icon: { name: "info", size: o ? 16 : 18 },
14
+ icon: { name: "info", size: t ? 16 : 18 },
15
15
  visualType: "neutral",
16
16
  ref: e,
17
- children: t.children
17
+ children: o
18
18
  }
19
19
  )
20
20
  );
21
- f.displayName = "InfoButton";
21
+ s.displayName = "InfoButton";
22
22
  export {
23
- f as InfoButton,
24
- f as default
23
+ s as InfoButton,
24
+ s as default
25
25
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),q=require("../../../../../external/classnames/index.cjs.js"),h=require("react"),j=require("../../buttons/info-button/info-button.cjs.js"),r=require("../../overlays/tooltip/tooltip.cjs.js"),t=require("./label.module.scss.cjs.js"),x=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),s=h.forwardRef((i,a)=>{const{getCurrentBreakpointProps:n}=x.useBreakpointProps(i.defaultServerBreakpoint),{as:d="label",children:u,className:c,isBold:p,isSmall:o,required:b,tooltip:l,...f}=n(i),m=q.default(t.default["tedi-label"],p&&t.default["tedi-label--bold"],o&&t.default["tedi-label--small"],c);return e.jsxs(d,{ref:a,className:m,...f,children:[u,b&&e.jsx("span",{className:t.default["tedi-label__required"],"aria-hidden":"true",children:"*"}),l&&e.jsxs(r.Tooltip,{children:[e.jsx(r.Tooltip.Trigger,{children:e.jsx(j.InfoButton,{isSmall:o,children:l})}),e.jsx(r.Tooltip.Content,{children:l})]})]})});s.displayName="Label";exports.Label=s;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),h=require("../../../../../external/classnames/index.cjs.js"),j=require("react"),x=require("../../buttons/info-button/info-button.cjs.js"),l=require("../../overlays/tooltip/tooltip.cjs.js"),t=require("./label.module.scss.cjs.js"),B=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),g=require("../../../providers/label-provider/use-labels.cjs.js"),i=j.forwardRef((r,s)=>{const{getCurrentBreakpointProps:n}=B.useBreakpointProps(r.defaultServerBreakpoint),{as:u="label",children:d,className:c,isBold:b,isSmall:o,required:p,tooltip:a,...f}=n(r),{getLabel:m}=g.useLabels(),q=h.default(t.default["tedi-label"],b&&t.default["tedi-label--bold"],o&&t.default["tedi-label--small"],c);return e.jsxs(u,{ref:s,className:q,...f,children:[d,p&&e.jsx("span",{className:t.default["tedi-label__required"],"aria-hidden":"true",children:"*"}),a&&e.jsx("span",{"aria-hidden":"true",children:e.jsxs(l.Tooltip,{children:[e.jsx(l.Tooltip.Trigger,{children:e.jsx(x.InfoButton,{isSmall:o,"aria-label":m("infoButton.moreInformation")})}),e.jsx(l.Tooltip.Content,{children:a})]})})]})});i.displayName="Label";exports.Label=i;
@@ -1,36 +1,37 @@
1
- import { jsxs as a, jsx as e } from "react/jsx-runtime";
2
- import u from "../../../../../external/classnames/index.es.js";
3
- import { forwardRef as B } from "react";
4
- import { InfoButton as N } from "../../buttons/info-button/info-button.es.js";
5
- import { Tooltip as t } from "../../overlays/tooltip/tooltip.es.js";
1
+ import { jsxs as i, jsx as e } from "react/jsx-runtime";
2
+ import B from "../../../../../external/classnames/index.es.js";
3
+ import { forwardRef as N } from "react";
4
+ import { InfoButton as g } from "../../buttons/info-button/info-button.es.js";
5
+ import { Tooltip as l } from "../../overlays/tooltip/tooltip.es.js";
6
6
  import r from "./label.module.scss.es.js";
7
- import { useBreakpointProps as g } from "../../../helpers/hooks/use-breakpoint-props.es.js";
8
- const k = B((o, s) => {
9
- const { getCurrentBreakpointProps: n } = g(o.defaultServerBreakpoint), {
7
+ import { useBreakpointProps as L } from "../../../helpers/hooks/use-breakpoint-props.es.js";
8
+ import { useLabels as k } from "../../../providers/label-provider/use-labels.es.js";
9
+ const x = N((o, s) => {
10
+ const { getCurrentBreakpointProps: n } = L(o.defaultServerBreakpoint), {
10
11
  as: m = "label",
11
12
  children: d,
12
- className: c,
13
- isBold: p,
14
- isSmall: i,
13
+ className: p,
14
+ isBold: c,
15
+ isSmall: t,
15
16
  required: f,
16
- tooltip: l,
17
+ tooltip: a,
17
18
  ...b
18
- } = n(o), h = u(
19
+ } = n(o), { getLabel: u } = k(), h = B(
19
20
  r["tedi-label"],
20
- p && r["tedi-label--bold"],
21
- i && r["tedi-label--small"],
22
- c
21
+ c && r["tedi-label--bold"],
22
+ t && r["tedi-label--small"],
23
+ p
23
24
  );
24
- return /* @__PURE__ */ a(m, { ref: s, className: h, ...b, children: [
25
+ return /* @__PURE__ */ i(m, { ref: s, className: h, ...b, children: [
25
26
  d,
26
27
  f && /* @__PURE__ */ e("span", { className: r["tedi-label__required"], "aria-hidden": "true", children: "*" }),
27
- l && /* @__PURE__ */ a(t, { children: [
28
- /* @__PURE__ */ e(t.Trigger, { children: /* @__PURE__ */ e(N, { isSmall: i, children: l }) }),
29
- /* @__PURE__ */ e(t.Content, { children: l })
30
- ] })
28
+ a && /* @__PURE__ */ e("span", { "aria-hidden": "true", children: /* @__PURE__ */ i(l, { children: [
29
+ /* @__PURE__ */ e(l.Trigger, { children: /* @__PURE__ */ e(g, { isSmall: t, "aria-label": u("infoButton.moreInformation") }) }),
30
+ /* @__PURE__ */ e(l.Content, { children: a })
31
+ ] }) })
31
32
  ] });
32
33
  });
33
- k.displayName = "Label";
34
+ x.displayName = "Label";
34
35
  export {
35
- k as Label
36
+ x as Label
36
37
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react/jsx-runtime"),i=require("../../../../../external/classnames/index.cjs.js"),f=require("react"),j=require("../../base/icon/icon.cjs.js"),F=require("../feedback-text/feedback-text.cjs.js"),S=require("../form-label/form-label.cjs.js"),e=require("./checkbox.module.scss.cjs.js"),T=require("../../layout/grid/row.cjs.js"),p=require("../../layout/grid/col.cjs.js"),C=N=>{const{id:l,label:o,value:x,className:q,disabled:b=!1,onChange:a,hideLabel:g=!1,helper:d,checked:s,defaultChecked:y,indeterminate:n,hover:R,name:w,tooltip:z,invalid:I,size:r="default",...L}=N,[k,M]=f.useState(y||!1),u=f.useRef(null),h=f.useMemo(()=>n?"mixed":a&&typeof s<"u"?s:k,[n,a,s,k]),v=t=>{typeof s>"u"&&M(t==null?void 0:t.target.checked),a==null||a(x,t==null?void 0:t.target.checked)},m=d?(d==null?void 0:d.id)??`${l}-helper`:void 0,_=i.default(e.default["tedi-checkbox"],{[e.default["tedi-checkbox--disabled"]]:b});return c.jsxs("div",{"data-name":"check",...L,children:[c.jsxs(T.Row,{gutter:0,children:[c.jsx(p.Col,{width:"auto",children:c.jsxs("div",{className:e.default["tedi-checkbox__outer-indicator-wrapper"],children:[c.jsx("input",{id:l,value:x,name:w,type:"checkbox",disabled:b,checked:h!=="mixed"?h:!1,"aria-checked":h,onChange:v,className:e.default["tedi-checkbox__input"],"aria-describedby":m}),c.jsxs("div",{"aria-hidden":"true",onClick:()=>{var t;return(t=u.current)==null?void 0:t.click()},className:i.default(e.default["tedi-checkbox__indicator"],{[e.default["tedi-checkbox__indicator--hover"]]:R,[e.default["tedi-checkbox__indicator--indeterminate"]]:n,[e.default[`tedi-checkbox__indicator--size-${r}`]]:r,[e.default["tedi-checkbox__indicator--invalid"]]:I},q),"data-testid":"checkbox-indicator",children:[c.jsx(j.Icon,{size:r==="default"?16:18,name:"remove",className:i.default(e.default["tedi-checkbox__icon"],e.default["tedi-checkbox__icon--indeterminate"])}),c.jsx(j.Icon,{size:r==="default"?16:18,name:"check",className:i.default(e.default["tedi-checkbox__icon"],e.default["tedi-checkbox__icon--check"])})]})]})}),c.jsx(p.Col,{children:o&&typeof o=="string"?c.jsx(S.FormLabel,{ref:u,className:_,id:l,"data-testid":"checkbox-label",hideLabel:g,label:o,tooltip:z}):c.jsx("label",{ref:u,htmlFor:l,className:_,"data-testid":"checkbox-label",children:o})})]}),d&&c.jsx(F.FeedbackText,{id:m,...d,className:i.default(e.default["tedi-checkbox__helper"],d.className)})]})};exports.Checkbox=C;exports.default=C;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react/jsx-runtime"),o=require("../../../../../external/classnames/index.cjs.js"),f=require("react"),j=require("../../base/icon/icon.cjs.js"),S=require("../feedback-text/feedback-text.cjs.js"),T=require("../form-label/form-label.cjs.js"),e=require("./checkbox.module.scss.cjs.js"),$=require("../../layout/grid/row.cjs.js"),C=require("../../layout/grid/col.cjs.js"),N=q=>{const{id:d,label:l,value:x,className:g,disabled:b=!1,onChange:i,hideLabel:y=!1,helper:a,checked:s,defaultChecked:I,indeterminate:n,hover:R,name:v,tooltip:k,invalid:w,size:r="default",...z}=q,[m,L]=f.useState(I||!1),u=f.useRef(null),h=f.useMemo(()=>n?"mixed":i&&typeof s<"u"?s:m,[n,i,s,m]),M=t=>{typeof s>"u"&&L(t==null?void 0:t.target.checked),i==null||i(x,t==null?void 0:t.target.checked)},_=a?a.id??`${d}-helper`:void 0,F=k?`${d}-tooltip`:void 0,p=o.default(e.default["tedi-checkbox"],{[e.default["tedi-checkbox--disabled"]]:b});return c.jsxs("div",{"data-name":"check",...z,children:[c.jsxs($.Row,{gutter:0,children:[c.jsx(C.Col,{width:"auto",children:c.jsxs("div",{className:e.default["tedi-checkbox__outer-indicator-wrapper"],children:[c.jsx("input",{id:d,value:x,name:v,type:"checkbox",disabled:b,checked:h!=="mixed"?h:!1,"aria-checked":h,onChange:M,className:e.default["tedi-checkbox__input"],"aria-describedby":[_,F].filter(Boolean).join(" ")}),c.jsxs("div",{"aria-hidden":"true",onClick:()=>{var t;return(t=u.current)==null?void 0:t.click()},className:o.default(e.default["tedi-checkbox__indicator"],{[e.default["tedi-checkbox__indicator--hover"]]:R,[e.default["tedi-checkbox__indicator--indeterminate"]]:n,[e.default[`tedi-checkbox__indicator--size-${r}`]]:r,[e.default["tedi-checkbox__indicator--invalid"]]:w},g),"data-testid":"checkbox-indicator",children:[c.jsx(j.Icon,{size:r==="default"?16:18,name:"remove",className:o.default(e.default["tedi-checkbox__icon"],e.default["tedi-checkbox__icon--indeterminate"])}),c.jsx(j.Icon,{size:r==="default"?16:18,name:"check",className:o.default(e.default["tedi-checkbox__icon"],e.default["tedi-checkbox__icon--check"])})]})]})}),c.jsx(C.Col,{children:l&&typeof l=="string"?c.jsx(T.FormLabel,{ref:u,className:p,id:d,"data-testid":"checkbox-label",hideLabel:y,label:l,tooltip:k}):c.jsx("label",{ref:u,htmlFor:d,className:p,"data-testid":"checkbox-label",children:l})})]}),a&&c.jsx(S.FeedbackText,{id:_,...a,className:o.default(e.default["tedi-checkbox__helper"],a.className)})]})};exports.Checkbox=N;exports.default=N;
@@ -1,50 +1,50 @@
1
1
  import { jsxs as n, jsx as i } from "react/jsx-runtime";
2
2
  import d from "../../../../../external/classnames/index.es.js";
3
3
  import b from "react";
4
- import { Icon as N } from "../../base/icon/icon.es.js";
5
- import { FeedbackText as v } from "../feedback-text/feedback-text.es.js";
6
- import { FormLabel as B } from "../form-label/form-label.es.js";
4
+ import { Icon as C } from "../../base/icon/icon.es.js";
5
+ import { FeedbackText as M } from "../feedback-text/feedback-text.es.js";
6
+ import { FormLabel as E } from "../form-label/form-label.es.js";
7
7
  import e from "./checkbox.module.scss.es.js";
8
- import { Row as E } from "../../layout/grid/row.es.js";
9
- import { Col as C } from "../../layout/grid/col.es.js";
10
- const O = (g) => {
8
+ import { Row as H } from "../../layout/grid/row.es.js";
9
+ import { Col as g } from "../../layout/grid/col.es.js";
10
+ const P = (y) => {
11
11
  const {
12
- id: o,
12
+ id: t,
13
13
  label: r,
14
14
  value: f,
15
- className: y,
15
+ className: z,
16
16
  disabled: _ = !1,
17
- onChange: t,
18
- hideLabel: z = !1,
17
+ onChange: o,
18
+ hideLabel: I = !1,
19
19
  helper: a,
20
20
  checked: l,
21
21
  defaultChecked: R,
22
22
  indeterminate: h,
23
- hover: w,
24
- name: F,
25
- tooltip: I,
26
- invalid: L,
23
+ hover: j,
24
+ name: w,
25
+ tooltip: p,
26
+ invalid: F,
27
27
  size: s = "default",
28
- ...j
29
- } = g, [x, M] = b.useState(R || !1), m = b.useRef(null), k = b.useMemo(() => h ? "mixed" : t && typeof l < "u" ? l : x, [h, t, l, x]), $ = (c) => {
30
- typeof l > "u" && M(c == null ? void 0 : c.target.checked), t == null || t(f, c == null ? void 0 : c.target.checked);
31
- }, u = a ? (a == null ? void 0 : a.id) ?? `${o}-helper` : void 0, p = d(e["tedi-checkbox"], { [e["tedi-checkbox--disabled"]]: _ });
32
- return /* @__PURE__ */ n("div", { "data-name": "check", ...j, children: [
33
- /* @__PURE__ */ n(E, { gutter: 0, children: [
34
- /* @__PURE__ */ i(C, { width: "auto", children: /* @__PURE__ */ n("div", { className: e["tedi-checkbox__outer-indicator-wrapper"], children: [
28
+ ...L
29
+ } = y, [x, $] = b.useState(R || !1), m = b.useRef(null), k = b.useMemo(() => h ? "mixed" : o && typeof l < "u" ? l : x, [h, o, l, x]), v = (c) => {
30
+ typeof l > "u" && $(c == null ? void 0 : c.target.checked), o == null || o(f, c == null ? void 0 : c.target.checked);
31
+ }, u = a ? a.id ?? `${t}-helper` : void 0, B = p ? `${t}-tooltip` : void 0, N = d(e["tedi-checkbox"], { [e["tedi-checkbox--disabled"]]: _ });
32
+ return /* @__PURE__ */ n("div", { "data-name": "check", ...L, children: [
33
+ /* @__PURE__ */ n(H, { gutter: 0, children: [
34
+ /* @__PURE__ */ i(g, { width: "auto", children: /* @__PURE__ */ n("div", { className: e["tedi-checkbox__outer-indicator-wrapper"], children: [
35
35
  /* @__PURE__ */ i(
36
36
  "input",
37
37
  {
38
- id: o,
38
+ id: t,
39
39
  value: f,
40
- name: F,
40
+ name: w,
41
41
  type: "checkbox",
42
42
  disabled: _,
43
43
  checked: k !== "mixed" ? k : !1,
44
44
  "aria-checked": k,
45
- onChange: $,
45
+ onChange: v,
46
46
  className: e["tedi-checkbox__input"],
47
- "aria-describedby": u
47
+ "aria-describedby": [u, B].filter(Boolean).join(" ")
48
48
  }
49
49
  ),
50
50
  /* @__PURE__ */ n(
@@ -58,17 +58,17 @@ const O = (g) => {
58
58
  className: d(
59
59
  e["tedi-checkbox__indicator"],
60
60
  {
61
- [e["tedi-checkbox__indicator--hover"]]: w,
61
+ [e["tedi-checkbox__indicator--hover"]]: j,
62
62
  [e["tedi-checkbox__indicator--indeterminate"]]: h,
63
63
  [e[`tedi-checkbox__indicator--size-${s}`]]: s,
64
- [e["tedi-checkbox__indicator--invalid"]]: L
64
+ [e["tedi-checkbox__indicator--invalid"]]: F
65
65
  },
66
- y
66
+ z
67
67
  ),
68
68
  "data-testid": "checkbox-indicator",
69
69
  children: [
70
70
  /* @__PURE__ */ i(
71
- N,
71
+ C,
72
72
  {
73
73
  size: s === "default" ? 16 : 18,
74
74
  name: "remove",
@@ -76,7 +76,7 @@ const O = (g) => {
76
76
  }
77
77
  ),
78
78
  /* @__PURE__ */ i(
79
- N,
79
+ C,
80
80
  {
81
81
  size: s === "default" ? 16 : 18,
82
82
  name: "check",
@@ -87,23 +87,23 @@ const O = (g) => {
87
87
  }
88
88
  )
89
89
  ] }) }),
90
- /* @__PURE__ */ i(C, { children: r && typeof r == "string" ? /* @__PURE__ */ i(
91
- B,
90
+ /* @__PURE__ */ i(g, { children: r && typeof r == "string" ? /* @__PURE__ */ i(
91
+ E,
92
92
  {
93
93
  ref: m,
94
- className: p,
95
- id: o,
94
+ className: N,
95
+ id: t,
96
96
  "data-testid": "checkbox-label",
97
- hideLabel: z,
97
+ hideLabel: I,
98
98
  label: r,
99
- tooltip: I
99
+ tooltip: p
100
100
  }
101
- ) : /* @__PURE__ */ i("label", { ref: m, htmlFor: o, className: p, "data-testid": "checkbox-label", children: r }) })
101
+ ) : /* @__PURE__ */ i("label", { ref: m, htmlFor: t, className: N, "data-testid": "checkbox-label", children: r }) })
102
102
  ] }),
103
- a && /* @__PURE__ */ i(v, { id: u, ...a, className: d(e["tedi-checkbox__helper"], a.className) })
103
+ a && /* @__PURE__ */ i(M, { id: u, ...a, className: d(e["tedi-checkbox__helper"], a.className) })
104
104
  ] });
105
105
  };
106
106
  export {
107
- O as Checkbox,
108
- O as default
107
+ P as Checkbox,
108
+ P as default
109
109
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),h=require("../../../../../external/classnames/index.cjs.js"),F=require("../../../../../external/react-dropzone/dist/es/index.cjs.js"),y=require("../../../helpers/hooks/use-file-upload.cjs.js"),u=require("../../base/icon/icon.cjs.js"),C=require("../../buttons/closing-button/closing-button.cjs.js"),f=require("../feedback-text/feedback-text.cjs.js"),D=require("../form-label/form-label.cjs.js"),t=require("./file-dropzone.module.scss.cjs.js"),N=require("../../cards/card/card.cjs.js"),S=require("../../cards/card/card-content/card-content.cjs.js"),k=require("../../../providers/label-provider/use-labels.cjs.js"),I=require("../../layout/vertical-spacing/vertical-spacing.cjs.js"),L=require("../../layout/grid/row.cjs.js"),m=require("../../layout/grid/col.cjs.js"),x=o=>{const{getLabel:a}=k.useLabels(),{label:p=a("file-dropzone.label"),className:z,disabled:s=!1,helper:i,id:d}=o,{innerFiles:r,uploadErrorHelper:n,onFileChange:g,onFileRemove:b}=y.useFileUpload(o),{getRootProps:j,getInputProps:v,isDragActive:q}=F.useDropzone({accept:o.accept?{"application/*":[o.accept]}:void 0,multiple:o.multiple,maxSize:o.maxSize?o.maxSize*1024**2:void 0,onDrop:l=>{g({target:{files:l}})}}),_=h.default(t.default["tedi-file-dropzone"],{[t.default["tedi-file-dropzone--disabled"]]:s},{[t.default["tedi-file-dropzone--invalid"]]:((n==null?void 0:n.type)||(i==null?void 0:i.type))==="error"},{[t.default["tedi-file-dropzone--valid"]]:((n==null?void 0:n.type)||(i==null?void 0:i.type))==="valid"},{[t.default["tedi-file-dropzone--drop-over"]]:q},z),c=i?(i==null?void 0:i.id)??`${d}-helper`:void 0;return e.jsxs(e.Fragment,{children:[e.jsxs("div",{...j(),className:_,children:[e.jsx("input",{...v()}),e.jsxs("div",{className:t.default["tedi-file-dropzone__label-wrapper"],children:[e.jsx(u.Icon,{color:s?"tertiary":"secondary",size:24,name:"attach_file"}),e.jsx(D.FormLabel,{id:d,label:p,className:t.default["tedi-file-dropzone__label"]})]})]}),i?e.jsx(f.FeedbackText,{...i,id:c}):n?e.jsx(f.FeedbackText,{...n,id:c}):null,!!r.length&&e.jsx(I.VerticalSpacing,{size:.5,className:t.default["tedi-file-dropzone__file-list"],children:r.map(l=>e.jsx(N.Card,{background:l.isValid===!1?"danger-primary":"tertiary",borderless:!0,className:t.default["tedi-file-dropzone__file-item"],children:e.jsx(S.CardContent,{padding:{bottom:.5,left:.5,right:.5,top:.5},children:e.jsxs(L.Row,{alignItems:"center",children:[e.jsxs(m.Col,{className:t.default["tedi-file-dropzone__file-name"],children:[l.name," ",l.isValid===!1&&e.jsx(u.Icon,{name:"info",color:"danger",display:"inline",size:18})]}),e.jsx(m.Col,{width:"auto",children:e.jsx(C.ClosingButton,{title:a("clear"),onClick:()=>b(l)})})]})})},l.id||l.name))})]})};exports.FileDropzone=x;exports.default=x;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),y=require("../../../../../external/classnames/index.cjs.js"),F=require("../../../../../external/react-dropzone/dist/es/index.cjs.js"),C=require("../../../helpers/hooks/use-file-upload.cjs.js"),u=require("../../base/icon/icon.cjs.js"),N=require("../../buttons/closing-button/closing-button.cjs.js"),f=require("../feedback-text/feedback-text.cjs.js"),D=require("../form-label/form-label.cjs.js"),t=require("./file-dropzone.module.scss.cjs.js"),I=require("../../cards/card/card.cjs.js"),L=require("../../cards/card/card-content/card-content.cjs.js"),k=require("../../../providers/label-provider/use-labels.cjs.js"),m=require("../../content/list/list.cjs.js"),S=require("../../layout/grid/row.cjs.js"),x=require("../../layout/grid/col.cjs.js"),p=o=>{const{getLabel:s}=k.useLabels(),{label:z=s("file-dropzone.label"),className:b,disabled:a=!1,helper:i,id:c}=o,{innerFiles:d,uploadErrorHelper:n,onFileChange:j,onFileRemove:g}=C.useFileUpload(o),{getRootProps:v,getInputProps:_,isDragActive:q}=F.useDropzone({disabled:a,accept:o.accept?{"application/*":[o.accept]}:void 0,multiple:o.multiple,maxSize:o.maxSize?o.maxSize*1024**2:void 0,onDrop:l=>{if(a)return;j({target:{files:l}})}}),h=y.default(t.default["tedi-file-dropzone"],{[t.default["tedi-file-dropzone--disabled"]]:a},{[t.default["tedi-file-dropzone--invalid"]]:((n==null?void 0:n.type)||(i==null?void 0:i.type))==="error"},{[t.default["tedi-file-dropzone--valid"]]:((n==null?void 0:n.type)||(i==null?void 0:i.type))==="valid"},{[t.default["tedi-file-dropzone--drop-over"]]:q},b),r=i?(i==null?void 0:i.id)??`${c}-helper`:void 0;return e.jsxs(e.Fragment,{children:[e.jsxs("div",{...v({tabIndex:a?-1:0,"aria-disabled":a,"aria-describedby":r}),className:h,children:[e.jsx("input",{..._(),disabled:a}),e.jsxs("div",{className:t.default["tedi-file-dropzone__label-wrapper"],children:[e.jsx(u.Icon,{color:a?"tertiary":"secondary",size:24,name:"attach_file"}),e.jsx(D.FormLabel,{id:c,label:z,className:t.default["tedi-file-dropzone__label"]})]})]}),i?e.jsx(f.FeedbackText,{...i,id:r}):n?e.jsx(f.FeedbackText,{...n,id:r}):null,!!d.length&&e.jsx(m.List,{className:t.default["tedi-file-dropzone__file-list"],style:"none","aria-label":s("file-dropzone.selected-files"),children:d.map(l=>e.jsx(m.List.Item,{className:t.default["tedi-file-dropzone__file-list-item"],children:e.jsx(I.Card,{background:l.isValid===!1?"danger-primary":"tertiary",borderless:!0,className:t.default["tedi-file-dropzone__file-item"],children:e.jsx(L.CardContent,{padding:.5,children:e.jsxs(S.Row,{alignItems:"center",children:[e.jsxs(x.Col,{className:t.default["tedi-file-dropzone__file-name"],children:[l.name," ",l.isValid===!1&&e.jsx(u.Icon,{name:"info",color:"danger",display:"inline",size:18})]}),e.jsx(x.Col,{width:"auto",children:e.jsx(N.ClosingButton,{title:s("remove")+" "+l.name,onClick:()=>g(l)})})]})})})},l.id||l.name))}),e.jsx("div",{className:"sr-only",role:"status","aria-live":"polite","aria-atomic":"true",children:d.length===0?s("file-dropzone.no-file"):s("file-dropzone.files-selected",d.length)})]})};exports.FileDropzone=p;exports.default=p;