@tedi-design-system/react 19.1.2-rc.4 → 19.2.0-rc.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tedi-design-system/react",
-  "version": "19.1.2-rc.4",
+  "version": "19.2.0-rc.2",
   "description": "TEDI Design System React component library — accessible, reusable UI components. Docs & live examples: https://storybook.tedi.ee/react/rc/",
   "type": "module",
   "sideEffects": false,

package/src/tedi/components/form/file-dropzone/file-dropzone.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),w=require("../../../../../external/classnames/index.cjs.js"),W=require("react"),E=require("../../../../../external/react-dropzone/dist/es/index.cjs.js"),G=require("../../../helpers/hooks/use-file-upload.cjs.js"),J=require("../../base/icon/icon.cjs.js"),K=require("../../buttons/button/button.cjs.js"),Q=require("../../misc/attachment/attachment.cjs.js"),X=require("../feedback-text/feedback-text.cjs.js"),Y=require("../form-label/form-label.cjs.js"),n=require("./file-dropzone.module.scss.cjs.js"),Z=require("../../../providers/label-provider/use-labels.cjs.js"),y=require("../../content/list/list.cjs.js"),F=d=>{if(!d)return;const a=d.split(",").reduce((s,u)=>{const i=u.trim();return i&&(i.startsWith(".")?(s["*/*"]=s["*/*"]??[],s["*/*"].push(i)):s[i]=s[i]??[]),s},{});return Object.keys(a).length?a:void 0},_=d=>{const{getLabel:a}=Z.useLabels(),{label:s=a("file-dropzone.label"),className:u,disabled:i=!1,helper:q,id:D,name:N,attachmentProps:p,accept:v,maxSize:m,multiple:b,validateIndividually:L,defaultFiles:I,files:$,onChange:A,onDelete:R,announcementTimeout:T,...P}=d,{innerFiles:x,uploadErrorHelper:r,onFileChange:S,onFileRemove:V,announcement:C}=G.useFileUpload({accept:v,maxSize:m,multiple:b,validateIndividually:L,defaultFiles:I,files:$,onChange:A,onDelete:R,announcementTimeout:T}),M=W.useId(),f=D??M,{getRootProps:O,getInputProps:B,isDragActive:U}=E.useDropzone({disabled:i,accept:F(v),multiple:b,maxSize:m?m*1024**2:void 0,onDrop:(t,l=[])=>{if(i)return;const z=l.filter(h=>h.errors.some(j=>j.code==="file-too-large"||j.code==="file-invalid-type")).map(h=>h.file),c=[...t,...z];if(c.length===0)return;S({target:{files:c}})}}),o=(r==null?void 0:r.type)==="error"?r:q??r,g=o?o.id??`${f}-helper`:void 0,k=w.default(n.default["tedi-file-dropzone"],{[n.default["tedi-file-dropzone--disabled"]]:i},{[n.default["tedi-file-dropzone--invalid"]]:(o==null?void 0:o.type)==="error"},{[n.default["tedi-file-dropzone--valid"]]:(o==null?void 0:o.type)==="valid"},{[n.default["tedi-file-dropzone--drop-over"]]:U},u);return e.jsxs(e.Fragment,{children:[e.jsxs("div",{...O({role:"button",tabIndex:i?-1:0,"aria-disabled":i,"aria-describedby":g}),className:k,children:[e.jsx("input",{...B(),id:f,name:N,className:n.default["tedi-file-dropzone__input"],disabled:i}),e.jsx("div",{className:n.default["tedi-file-dropzone__label-wrapper"],children:e.jsx(Y.FormLabel,{...P,id:f,label:e.jsxs(e.Fragment,{children:[e.jsx(J.Icon,{color:i?"tertiary":"secondary",size:24,name:"attach_file",display:"inline",className:n.default["tedi-file-dropzone__label-icon"]}),s]}),className:n.default["tedi-file-dropzone__label"]})})]}),o&&e.jsx(X.FeedbackText,{...o,id:g}),!!x.length&&e.jsx(y.List,{className:n.default["tedi-file-dropzone__file-list"],style:"none","aria-label":a("file-dropzone.selected-files"),children:x.map(t=>{const l=typeof p=="function"?p(t):p,{actions:z,...c}=l??{};return e.jsxs(y.List.Item,{className:n.default["tedi-file-dropzone__file-list-item"],children:[e.jsx(Q.Attachment,{...c,name:t.name??"",isValid:t.isValid??(l==null?void 0:l.isValid),isLoading:t.isLoading??(l==null?void 0:l.isLoading),actions:e.jsxs(e.Fragment,{children:[z,e.jsx(K.Button,{visualType:"neutral",icon:"delete",onClick:()=>V(t),children:`${a("remove")} ${t.name??""}`})]})}),t.isValid===!1&&e.jsx("span",{className:"sr-only",children:`${a("file-dropzone.failed")} ${t.name??""}`})]},t.id??`${t.name??"file"}-${t.size??""}-${t.lastModified??""}`)})}),e.jsx("div",{className:"sr-only",role:"status","aria-live":"polite","aria-atomic":"true",children:C})]})};_.displayName="FileDropzone";exports.FileDropzone=_;exports.toDropzoneAccept=F;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),K=require("../../../../../external/classnames/index.cjs.js"),Q=require("react"),X=require("../../../../../external/react-dropzone/dist/es/index.cjs.js"),Y=require("../../../helpers/hooks/use-file-upload.cjs.js"),Z=require("../../base/icon/icon.cjs.js"),ee=require("../../buttons/button/button.cjs.js"),ie=require("../../misc/attachment/attachment.cjs.js"),q=require("../feedback-text/feedback-text.cjs.js"),te=require("../form-label/form-label.cjs.js"),o=require("./file-dropzone.module.scss.cjs.js"),oe=require("../../../providers/label-provider/use-labels.cjs.js"),N=require("../../content/list/list.cjs.js"),D=c=>{if(!c)return;const l=c.split(",").reduce((n,f)=>{const t=f.trim();return t&&(t.startsWith(".")?(n["*/*"]=n["*/*"]??[],n["*/*"].push(t)):n[t]=n[t]??[]),n},{});return Object.keys(l).length?l:void 0},I=c=>{const{getLabel:l}=oe.useLabels(),{label:n=l("file-dropzone.label"),className:f,disabled:t=!1,helper:a,id:L,name:$,required:k,attachmentProps:m,accept:h,maxSize:b,multiple:v,validateIndividually:j,defaultFiles:R,files:T,onChange:A,onDelete:B,announcementTimeout:P,showRestrictions:S}=c,{innerFiles:g,errorHelper:V,restrictionsHint:C,onFileChange:E,onFileRemove:M,announcement:O}=Y.useFileUpload({accept:h,maxSize:b,multiple:v,validateIndividually:j,defaultFiles:R,files:T,onChange:A,onDelete:B,announcementTimeout:P,showRestrictions:S}),w=Q.useId(),u=L??w,{getRootProps:H,getInputProps:U,isDragActive:W}=X.useDropzone({disabled:t,accept:D(h),multiple:v,maxSize:b?b*1024**2:void 0,onDrop:(i,r=[])=>{if(t)return;const z=r.filter(x=>x.errors.some(F=>F.code==="file-too-large"||F.code==="file-invalid-type")).map(x=>x.file),p=[...i,...z];if(p.length===0)return;E({target:{files:p}})}}),d=(j&&v?void 0:V)??((a==null?void 0:a.type)==="error"?a:void 0),s=a&&a.type!=="error"?a:C,y=d?d.id??`${u}-error`:void 0,_=s?s.id??`${u}-helper`:void 0,G=[y,_].filter(Boolean).join(" ")||void 0,J=K.default(o.default["tedi-file-dropzone"],{[o.default["tedi-file-dropzone--disabled"]]:t},{[o.default["tedi-file-dropzone--invalid"]]:!!d},{[o.default["tedi-file-dropzone--valid"]]:!d&&(s==null?void 0:s.type)==="valid"},{[o.default["tedi-file-dropzone--drop-over"]]:W},f);return e.jsxs(e.Fragment,{children:[e.jsxs("div",{...H({role:"button",tabIndex:t?-1:0,"aria-disabled":t,"aria-describedby":G}),className:J,children:[e.jsx("input",{...U(),id:u,name:$,className:o.default["tedi-file-dropzone__input"],disabled:t}),e.jsx("div",{className:o.default["tedi-file-dropzone__label-wrapper"],children:e.jsx(te.FormLabel,{id:u,required:k,label:e.jsxs(e.Fragment,{children:[e.jsx(Z.Icon,{color:t?"inherit":"secondary",size:24,name:"attach_file",display:"inline",className:o.default["tedi-file-dropzone__label-icon"]}),n]}),className:o.default["tedi-file-dropzone__label"]})})]}),(d||s)&&e.jsxs("div",{className:o.default["tedi-file-dropzone__feedback"],children:[d&&e.jsx(q.FeedbackText,{...d,id:y}),s&&e.jsx(q.FeedbackText,{...s,id:_})]}),!!g.length&&e.jsx(N.List,{className:o.default["tedi-file-dropzone__file-list"],style:"none","aria-label":l("file-dropzone.selected-files"),children:g.map(i=>{const r=typeof m=="function"?m(i):m,{actions:z,...p}=r??{};return e.jsxs(N.List.Item,{className:o.default["tedi-file-dropzone__file-list-item"],children:[e.jsx(ie.Attachment,{...p,name:i.name??"",isValid:i.isValid??(r==null?void 0:r.isValid),isLoading:i.isLoading??(r==null?void 0:r.isLoading),actions:e.jsxs(e.Fragment,{children:[z,e.jsx(ee.Button,{visualType:"neutral",icon:"delete",onClick:()=>M(i),children:`${l("remove")} ${i.name??""}`})]})}),i.isValid===!1&&e.jsx("span",{className:"sr-only",children:`${l("file-dropzone.failed")} ${i.name??""}`})]},i.id??`${i.name??"file"}-${i.size??""}-${i.lastModified??""}`)})}),e.jsx("div",{className:"sr-only",role:"status","aria-live":"polite","aria-atomic":"true",children:O})]})};I.displayName="FileDropzone";exports.FileDropzone=I;exports.toDropzoneAccept=D;

package/src/tedi/components/form/file-dropzone/file-dropzone.d.ts

@@ -1,9 +1,12 @@
 import { FileUploadFile, UseFileUploadProps } from '../../../helpers/hooks/use-file-upload';
 import { AttachmentProps } from '../../misc/attachment/attachment';
 import { FeedbackTextProps } from '../feedback-text/feedback-text';
-import { FormLabelProps } from '../form-label/form-label';
 export type FileDropzoneAttachmentProps = Partial<Omit<AttachmentProps, 'name'>> | ((file: FileUploadFile) => Partial<Omit<AttachmentProps, 'name'>>);
-export interface FileDropzoneProps extends Omit<FormLabelProps, 'size' | 'hideLabel' | 'label'>, UseFileUploadProps {
+export interface FileDropzoneProps extends UseFileUploadProps {
+    /**
+     * Unique identifier for the underlying file input. Auto-generated when omitted.
+     */
+    id?: string;
     /**
      * Additional CSS class names to apply to the dropzone for custom styling
      */
@@ -12,10 +15,14 @@ export interface FileDropzoneProps extends Omit<FormLabelProps, 'size' | 'hideLa
      * The name attribute for the file input, used for form submission and identifying the field.
      */
     name: string;
+    /**
+     * Marks the field as required — adds the required indicator to the label.
+     */
+    required?: boolean;
     /**
      * The text label displayed for the file dropzone, providing context for users.
      * Defaults to the `LabelProvider`'s localised `file-dropzone.label` (e.g. "Lohista
-     * failid siia või klõpsa, et sirvida" in Estonian).
+     * failid siia või klõpsa failide valimiseks" in Estonian).
      */
     label?: string;
     /**

package/src/tedi/components/form/file-dropzone/file-dropzone.es.js

@@ -1,116 +1,116 @@
-import { jsxs as d, Fragment as b, jsx as n } from "react/jsx-runtime";
-import k from "../../../../../external/classnames/index.es.js";
-import q from "react";
-import { useDropzone as E } from "../../../../../external/react-dropzone/dist/es/index.es.js";
-import { useFileUpload as G } from "../../../helpers/hooks/use-file-upload.es.js";
-import { Icon as J } from "../../base/icon/icon.es.js";
-import { Button as K } from "../../buttons/button/button.es.js";
-import { Attachment as Q } from "../../misc/attachment/attachment.es.js";
-import { FeedbackText as X } from "../feedback-text/feedback-text.es.js";
-import { FormLabel as Y } from "../form-label/form-label.es.js";
+import { jsxs as c, Fragment as _, jsx as t } from "react/jsx-runtime";
+import K from "../../../../../external/classnames/index.es.js";
+import Q from "react";
+import { useDropzone as X } from "../../../../../external/react-dropzone/dist/es/index.es.js";
+import { useFileUpload as Y } from "../../../helpers/hooks/use-file-upload.es.js";
+import { Icon as Z } from "../../base/icon/icon.es.js";
+import { Button as ee } from "../../buttons/button/button.es.js";
+import { Attachment as ie } from "../../misc/attachment/attachment.es.js";
+import { FeedbackText as x } from "../feedback-text/feedback-text.es.js";
+import { FormLabel as oe } from "../form-label/form-label.es.js";
 import o from "./file-dropzone.module.scss.es.js";
-import { useLabels as Z } from "../../../providers/label-provider/use-labels.es.js";
-import { List as I } from "../../content/list/list.es.js";
-const H = (m) => {
+import { useLabels as te } from "../../../providers/label-provider/use-labels.es.js";
+import { List as L } from "../../content/list/list.es.js";
+const re = (m) => {
   if (!m) return;
-  const a = m.split(",").reduce((l, c) => {
-    const i = c.trim();
-    return i && (i.startsWith(".") ? (l["*/*"] = l["*/*"] ?? [], l["*/*"].push(i)) : l[i] = l[i] ?? []), l;
+  const a = m.split(",").reduce((r, u) => {
+    const i = u.trim();
+    return i && (i.startsWith(".") ? (r["*/*"] = r["*/*"] ?? [], r["*/*"].push(i)) : r[i] = r[i] ?? []), r;
   }, {});
   return Object.keys(a).length ? a : void 0;
-}, ee = (m) => {
-  const { getLabel: a } = Z(), {
-    label: l = a("file-dropzone.label"),
-    className: c,
+}, ne = (m) => {
+  const { getLabel: a } = te(), {
+    label: r = a("file-dropzone.label"),
+    className: u,
     disabled: i = !1,
-    helper: D,
-    id: $,
-    name: x,
-    attachmentProps: f,
-    accept: y,
-    maxSize: u,
-    multiple: g,
-    validateIndividually: L,
-    defaultFiles: j,
-    files: A,
-    onChange: R,
-    onDelete: V,
-    announcementTimeout: C,
-    ...P
-  } = m, { innerFiles: _, uploadErrorHelper: s, onFileChange: T, onFileRemove: B, announcement: M } = G({
-    accept: y,
-    maxSize: u,
-    multiple: g,
-    validateIndividually: L,
-    defaultFiles: j,
-    files: A,
-    onChange: R,
-    onDelete: V,
-    announcementTimeout: C
-  }), O = q.useId(), h = $ ?? O, { getRootProps: S, getInputProps: w, isDragActive: U } = E({
+    helper: s,
+    id: j,
+    name: R,
+    required: k,
+    attachmentProps: v,
+    accept: g,
+    maxSize: h,
+    multiple: z,
+    validateIndividually: N,
+    defaultFiles: A,
+    files: B,
+    onChange: V,
+    onDelete: C,
+    announcementTimeout: E,
+    showRestrictions: P
+  } = m, { innerFiles: F, errorHelper: T, restrictionsHint: w, onFileChange: H, onFileRemove: M, announcement: O } = Y({
+    accept: g,
+    maxSize: h,
+    multiple: z,
+    validateIndividually: N,
+    defaultFiles: A,
+    files: B,
+    onChange: V,
+    onDelete: C,
+    announcementTimeout: E,
+    showRestrictions: P
+  }), S = Q.useId(), p = j ?? S, { getRootProps: q, getInputProps: U, isDragActive: W } = X({
     disabled: i,
-    accept: H(y),
-    multiple: g,
-    maxSize: u ? u * 1024 ** 2 : void 0,
-    onDrop: (e, r = []) => {
+    accept: re(g),
+    multiple: z,
+    maxSize: h ? h * 1024 ** 2 : void 0,
+    onDrop: (e, n = []) => {
       if (i) return;
-      const v = r.filter(
-        (z) => z.errors.some((F) => F.code === "file-too-large" || F.code === "file-invalid-type")
-      ).map((z) => z.file), p = [...e, ...v];
-      if (p.length === 0) return;
-      T({
-        target: { files: p }
+      const b = n.filter(
+        (y) => y.errors.some((D) => D.code === "file-too-large" || D.code === "file-invalid-type")
+      ).map((y) => y.file), f = [...e, ...b];
+      if (f.length === 0) return;
+      H({
+        target: { files: f }
       });
     }
-  }), t = (s == null ? void 0 : s.type) === "error" ? s : D ?? s, N = t ? t.id ?? `${h}-helper` : void 0, W = k(
+  }), d = (N && z ? void 0 : T) ?? ((s == null ? void 0 : s.type) === "error" ? s : void 0), l = s && s.type !== "error" ? s : w, I = d ? d.id ?? `${p}-error` : void 0, $ = l ? l.id ?? `${p}-helper` : void 0, G = [I, $].filter(Boolean).join(" ") || void 0, J = K(
     o["tedi-file-dropzone"],
     { [o["tedi-file-dropzone--disabled"]]: i },
-    // Drive the visual state from the same `feedback` that is rendered, so the
-    // invalid/valid styling never diverges from the message shown.
-    { [o["tedi-file-dropzone--invalid"]]: (t == null ? void 0 : t.type) === "error" },
-    { [o["tedi-file-dropzone--valid"]]: (t == null ? void 0 : t.type) === "valid" },
-    { [o["tedi-file-dropzone--drop-over"]]: U },
-    c
+    { [o["tedi-file-dropzone--invalid"]]: !!d },
+    { [o["tedi-file-dropzone--valid"]]: !d && (l == null ? void 0 : l.type) === "valid" },
+    { [o["tedi-file-dropzone--drop-over"]]: W },
+    u
   );
-  return /* @__PURE__ */ d(b, { children: [
-    /* @__PURE__ */ d(
+  return /* @__PURE__ */ c(_, { children: [
+    /* @__PURE__ */ c(
       "div",
       {
-        ...S({
+        ...q({
           role: "button",
           tabIndex: i ? -1 : 0,
           "aria-disabled": i,
-          "aria-describedby": N
+          "aria-describedby": G
         }),
-        className: W,
+        className: J,
         children: [
-          /* @__PURE__ */ n(
+          /* @__PURE__ */ t(
             "input",
             {
-              ...w(),
-              id: h,
-              name: x,
+              ...U(),
+              id: p,
+              name: R,
               className: o["tedi-file-dropzone__input"],
               disabled: i
             }
           ),
-          /* @__PURE__ */ n("div", { className: o["tedi-file-dropzone__label-wrapper"], children: /* @__PURE__ */ n(
-            Y,
+          /* @__PURE__ */ t("div", { className: o["tedi-file-dropzone__label-wrapper"], children: /* @__PURE__ */ t(
+            oe,
             {
-              ...P,
-              id: h,
-              label: /* @__PURE__ */ d(b, { children: [
-                /* @__PURE__ */ n(
-                  J,
+              id: p,
+              required: k,
+              label: /* @__PURE__ */ c(_, { children: [
+                /* @__PURE__ */ t(
+                  Z,
                   {
-                    color: i ? "tertiary" : "secondary",
+                    color: i ? "inherit" : "secondary",
                     size: 24,
                     name: "attach_file",
                     display: "inline",
                     className: o["tedi-file-dropzone__label-icon"]
                   }
                 ),
-                l
+                r
               ] }),
               className: o["tedi-file-dropzone__label"]
             }
@@ -118,34 +118,37 @@ const H = (m) => {
         ]
       }
     ),
-    t && /* @__PURE__ */ n(X, { ...t, id: N }),
-    !!_.length && /* @__PURE__ */ n(
-      I,
+    (d || l) && /* @__PURE__ */ c("div", { className: o["tedi-file-dropzone__feedback"], children: [
+      d && /* @__PURE__ */ t(x, { ...d, id: I }),
+      l && /* @__PURE__ */ t(x, { ...l, id: $ })
+    ] }),
+    !!F.length && /* @__PURE__ */ t(
+      L,
       {
         className: o["tedi-file-dropzone__file-list"],
         style: "none",
         "aria-label": a("file-dropzone.selected-files"),
-        children: _.map((e) => {
-          const r = typeof f == "function" ? f(e) : f, { actions: v, ...p } = r ?? {};
-          return /* @__PURE__ */ d(
-            I.Item,
+        children: F.map((e) => {
+          const n = typeof v == "function" ? v(e) : v, { actions: b, ...f } = n ?? {};
+          return /* @__PURE__ */ c(
+            L.Item,
             {
               className: o["tedi-file-dropzone__file-list-item"],
               children: [
-                /* @__PURE__ */ n(
-                  Q,
+                /* @__PURE__ */ t(
+                  ie,
                   {
-                    ...p,
+                    ...f,
                     name: e.name ?? "",
-                    isValid: e.isValid ?? (r == null ? void 0 : r.isValid),
-                    isLoading: e.isLoading ?? (r == null ? void 0 : r.isLoading),
-                    actions: /* @__PURE__ */ d(b, { children: [
-                      v,
-                      /* @__PURE__ */ n(K, { visualType: "neutral", icon: "delete", onClick: () => B(e), children: `${a("remove")} ${e.name ?? ""}` })
+                    isValid: e.isValid ?? (n == null ? void 0 : n.isValid),
+                    isLoading: e.isLoading ?? (n == null ? void 0 : n.isLoading),
+                    actions: /* @__PURE__ */ c(_, { children: [
+                      b,
+                      /* @__PURE__ */ t(ee, { visualType: "neutral", icon: "delete", onClick: () => M(e), children: `${a("remove")} ${e.name ?? ""}` })
                     ] })
                   }
                 ),
-                e.isValid === !1 && /* @__PURE__ */ n("span", { className: "sr-only", children: `${a("file-dropzone.failed")} ${e.name ?? ""}` })
+                e.isValid === !1 && /* @__PURE__ */ t("span", { className: "sr-only", children: `${a("file-dropzone.failed")} ${e.name ?? ""}` })
               ]
             },
             e.id ?? `${e.name ?? "file"}-${e.size ?? ""}-${e.lastModified ?? ""}`
@@ -153,11 +156,11 @@ const H = (m) => {
         })
       }
     ),
-    /* @__PURE__ */ n("div", { className: "sr-only", role: "status", "aria-live": "polite", "aria-atomic": "true", children: M })
+    /* @__PURE__ */ t("div", { className: "sr-only", role: "status", "aria-live": "polite", "aria-atomic": "true", children: O })
   ] });
 };
-ee.displayName = "FileDropzone";
+ne.displayName = "FileDropzone";
 export {
-  ee as FileDropzone,
-  H as toDropzoneAccept
+  ne as FileDropzone,
+  re as toDropzoneAccept
 };

package/src/tedi/components/form/file-dropzone/file-dropzone.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-file-dropzone":"tedi-file-dropzone-70698e52","tedi-file-dropzone__label-wrapper":"tedi-file-dropzone__label-wrapper-78360685","tedi-file-dropzone__label":"tedi-file-dropzone__label-5c15bc34","tedi-file-dropzone__label-icon":"tedi-file-dropzone__label-icon-180ef5ad","tedi-file-dropzone--disabled":"tedi-file-dropzone--disabled-0e01143d","tedi-file-dropzone--invalid":"tedi-file-dropzone--invalid-159cce6d","tedi-file-dropzone--valid":"tedi-file-dropzone--valid-d2d3ef3d","tedi-file-dropzone--drop-over":"tedi-file-dropzone--drop-over-3e31af77","tedi-file-dropzone__input":"tedi-file-dropzone__input-c3c90d60","tedi-file-dropzone__file-list":"tedi-file-dropzone__file-list-c1ededa3","tedi-file-dropzone__file-list-item":"tedi-file-dropzone__file-list-item-3ad71621"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-file-dropzone":"tedi-file-dropzone-70698e52","tedi-file-dropzone--drop-over":"tedi-file-dropzone--drop-over-3e31af77","tedi-file-dropzone--invalid":"tedi-file-dropzone--invalid-159cce6d","tedi-file-dropzone--valid":"tedi-file-dropzone--valid-d2d3ef3d","tedi-file-dropzone--disabled":"tedi-file-dropzone--disabled-0e01143d","tedi-file-dropzone__label-wrapper":"tedi-file-dropzone__label-wrapper-78360685","tedi-file-dropzone__label":"tedi-file-dropzone__label-5c15bc34","tedi-file-dropzone__label-icon":"tedi-file-dropzone__label-icon-180ef5ad","tedi-file-dropzone__input":"tedi-file-dropzone__input-c3c90d60","tedi-file-dropzone__feedback":"tedi-file-dropzone__feedback-782071d4","tedi-file-dropzone__file-list":"tedi-file-dropzone__file-list-c1ededa3","tedi-file-dropzone__file-list-item":"tedi-file-dropzone__file-list-item-3ad71621"};exports.default=e;

package/src/tedi/components/form/file-dropzone/file-dropzone.module.scss.es.js

@@ -1,13 +1,14 @@
 const e = {
   "tedi-file-dropzone": "tedi-file-dropzone-70698e52",
+  "tedi-file-dropzone--drop-over": "tedi-file-dropzone--drop-over-3e31af77",
+  "tedi-file-dropzone--invalid": "tedi-file-dropzone--invalid-159cce6d",
+  "tedi-file-dropzone--valid": "tedi-file-dropzone--valid-d2d3ef3d",
+  "tedi-file-dropzone--disabled": "tedi-file-dropzone--disabled-0e01143d",
   "tedi-file-dropzone__label-wrapper": "tedi-file-dropzone__label-wrapper-78360685",
   "tedi-file-dropzone__label": "tedi-file-dropzone__label-5c15bc34",
   "tedi-file-dropzone__label-icon": "tedi-file-dropzone__label-icon-180ef5ad",
-  "tedi-file-dropzone--disabled": "tedi-file-dropzone--disabled-0e01143d",
-  "tedi-file-dropzone--invalid": "tedi-file-dropzone--invalid-159cce6d",
-  "tedi-file-dropzone--valid": "tedi-file-dropzone--valid-d2d3ef3d",
-  "tedi-file-dropzone--drop-over": "tedi-file-dropzone--drop-over-3e31af77",
   "tedi-file-dropzone__input": "tedi-file-dropzone__input-c3c90d60",
+  "tedi-file-dropzone__feedback": "tedi-file-dropzone__feedback-782071d4",
   "tedi-file-dropzone__file-list": "tedi-file-dropzone__file-list-c1ededa3",
   "tedi-file-dropzone__file-list-item": "tedi-file-dropzone__file-list-item-3ad71621"
 };

package/src/tedi/components/form/multi-value-field/multi-value-field.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),v=require("../../../../../external/classnames/index.cjs.js"),i=require("react"),T=require("../../base/icon/icon.cjs.js"),Z=require("../../buttons/closing-button/closing-button.cjs.js"),ee=require("../../misc/separator/separator.cjs.js"),z=require("../../tags/tag/tag.cjs.js"),te=require("../form-label/form-label.cjs.js"),r=require("./multi-value-field.module.scss.cjs.js"),le=require("../../../providers/label-provider/use-labels.cjs.js"),j=4,ie=44,N=i.forwardRef((F,O)=>{const{id:A,label:w,name:q,values:C,onChange:_,tagColor:y="primary",tagsDirection:P="stack",className:$,icon:o,onIconClick:V,iconButtonProps:m,isClearable:G=!0,required:S,disabled:b}=F,{getLabel:M}=le.useLabels(),[X,B]=i.useState(C??[]),E=i.useRef(null),W=i.useRef(null);i.useImperativeHandle(O,()=>({input:W.current,wrapper:E.current}),[]);const a=C??X,n=P==="row",[f,D]=i.useState(null),H=i.useCallback(e=>D(e),[]),p=i.useRef(0),[d,g]=i.useState(null);i.useEffect(()=>{n&&g(null)},[a.length,n]),i.useEffect(()=>{if(!n||!f||typeof ResizeObserver>"u")return;const e=new ResizeObserver(t=>{var c;const s=((c=t[0])==null?void 0:c.contentRect.width)??0;s>0&&s!==p.current&&g(null)});return e.observe(f),()=>e.disconnect()},[n,f]),i.useLayoutEffect(()=>{if(!n||d!==null)return;const e=f;if(!e)return;const t=e.clientWidth;if(t===0)return;const s=e.querySelectorAll("[data-tedi-tag-index]");if(s.length===0)return;let c=0;for(let u=0;u<s.length;u++)c+=s[u].offsetWidth+(u>0?j:0);if(c<=t){p.current=t,g(s.length);return}let k=0,h=0;for(let u=0;u<s.length;u++){const Q=s[u].offsetWidth,Y=u<s.length-1?ie+j:0,L=k+Q+(h>0?j:0);if(L+Y<=t)k=L,h++;else break}h===0&&(h=1),p.current=t,g(h)},[n,d,a,f]);const I=e=>{B(e),_==null||_(e)},J=e=>{const t=a.filter((s,c)=>c!==e);I(t)},x=!b&&G&&a.length>0,U=()=>{I([])},R=n&&d!==null?Math.max(0,a.length-d):0,K=()=>{if(!o)return null;const e=typeof o=="string"?{name:o}:o;return V?l.jsx("button",{...m,className:v.default(r.default["tedi-multi-value-field__icon-wrapper"],m==null?void 0:m.className),onClick:V,type:"button",children:l.jsx(T.Icon,{...e,size:18})}):l.jsx("div",{className:r.default["tedi-multi-value-field__icon-wrapper"],children:l.jsx(T.Icon,{...e,size:18})})};return l.jsxs("div",{className:v.default(r.default["tedi-multi-value-field"],$),children:[w&&l.jsx(te.FormLabel,{id:A,label:w,required:S}),l.jsxs("div",{ref:E,className:v.default(r.default["tedi-multi-value-field__inner"],{[r.default["tedi-multi-value-field__inner--row"]]:n}),children:[a.length>0&&l.jsxs("div",{ref:H,className:v.default(r.default["tedi-multi-value-field__tags"],{[r.default["tedi-multi-value-field__tags--row"]]:n}),children:[a.map((e,t)=>n&&d!==null&&t>=d?null:l.jsx(z.Tag,{color:y,"data-tedi-tag-index":t,onClose:b?void 0:()=>J(t),children:e},`${e}-${t}`)),R>0&&l.jsxs(z.Tag,{color:y,className:r.default["tedi-multi-value-field__overflow-tag"],"aria-label":M("multi-value-field.hidden-count",R),children:["+",R]})]}),(x||o)&&l.jsxs("div",{className:r.default["tedi-multi-value-field__right-area"],children:[x&&l.jsx(Z.ClosingButton,{onClick:U,title:M("clear"),className:r.default["tedi-multi-value-field__clear-button"],iconSize:18}),x&&o&&l.jsx(ee.Separator,{color:"primary",axis:"vertical",height:1.5,spacing:.25}),o&&K()]})]}),q&&l.jsx("input",{ref:W,type:"hidden",name:q,value:a.length?JSON.stringify(a):"",required:S,disabled:b})]})});N.displayName="MultiValueField";exports.MultiValueField=N;exports.default=N;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),_=require("../../../../../external/classnames/index.cjs.js"),i=require("react"),O=require("../../base/icon/icon.cjs.js"),ee=require("../../buttons/closing-button/closing-button.cjs.js"),te=require("../../misc/separator/separator.cjs.js"),T=require("../../tags/tag/tag.cjs.js"),le=require("../form-label/form-label.cjs.js"),s=require("./multi-value-field.module.scss.cjs.js"),ie=require("../../../providers/label-provider/use-labels.cjs.js"),j=4,ne=44,N=i.forwardRef((z,F)=>{const{id:A,label:w,name:C,values:q,onChange:b,tagColor:y="primary",tagsDirection:P="stack",className:$,icon:o,onIconClick:V,iconButtonProps:m,isClearable:G=!0,showClearOnInteraction:X,required:S,disabled:p}=z,{getLabel:M}=ie.useLabels(),[B,D]=i.useState(q??[]),E=i.useRef(null),I=i.useRef(null);i.useImperativeHandle(F,()=>({input:I.current,wrapper:E.current}),[]);const a=q??B,r=P==="row",[f,H]=i.useState(null),J=i.useCallback(e=>H(e),[]),x=i.useRef(0),[d,g]=i.useState(null);i.useEffect(()=>{r&&g(null)},[a.length,r]),i.useEffect(()=>{if(!r||!f||typeof ResizeObserver>"u")return;const e=new ResizeObserver(t=>{var c;const n=((c=t[0])==null?void 0:c.contentRect.width)??0;n>0&&n!==x.current&&g(null)});return e.observe(f),()=>e.disconnect()},[r,f]),i.useLayoutEffect(()=>{if(!r||d!==null)return;const e=f;if(!e)return;const t=e.clientWidth;if(t===0)return;const n=e.querySelectorAll("[data-tedi-tag-index]");if(n.length===0)return;let c=0;for(let u=0;u<n.length;u++)c+=n[u].offsetWidth+(u>0?j:0);if(c<=t){x.current=t,g(n.length);return}let k=0,h=0;for(let u=0;u<n.length;u++){const Y=n[u].offsetWidth,Z=u<n.length-1?ne+j:0,L=k+Y+(h>0?j:0);if(L+Z<=t)k=L,h++;else break}h===0&&(h=1),x.current=t,g(h)},[r,d,a,f]);const W=e=>{D(e),b==null||b(e)},U=e=>{const t=a.filter((n,c)=>c!==e);W(t)},v=!p&&G&&a.length>0,K=()=>{W([])},R=r&&d!==null?Math.max(0,a.length-d):0,Q=()=>{if(!o)return null;const e=typeof o=="string"?{name:o}:o;return V?l.jsx("button",{...m,className:_.default(s.default["tedi-multi-value-field__icon-wrapper"],m==null?void 0:m.className),onClick:V,type:"button",children:l.jsx(O.Icon,{...e,size:18})}):l.jsx("div",{className:s.default["tedi-multi-value-field__icon-wrapper"],children:l.jsx(O.Icon,{...e,size:18})})};return l.jsxs("div",{className:_.default(s.default["tedi-multi-value-field"],$,{[s.default["tedi-multi-value-field--clear-on-interaction"]]:v&&X}),children:[w&&l.jsx(le.FormLabel,{id:A,label:w,required:S}),l.jsxs("div",{ref:E,className:_.default(s.default["tedi-multi-value-field__inner"],{[s.default["tedi-multi-value-field__inner--row"]]:r}),children:[a.length>0&&l.jsxs("div",{ref:J,className:_.default(s.default["tedi-multi-value-field__tags"],{[s.default["tedi-multi-value-field__tags--row"]]:r}),children:[a.map((e,t)=>r&&d!==null&&t>=d?null:l.jsx(T.Tag,{color:y,"data-tedi-tag-index":t,onClose:p?void 0:()=>U(t),children:e},`${e}-${t}`)),R>0&&l.jsxs(T.Tag,{color:y,className:s.default["tedi-multi-value-field__overflow-tag"],"aria-label":M("multi-value-field.hidden-count",R),children:["+",R]})]}),(v||o)&&l.jsxs("div",{className:s.default["tedi-multi-value-field__right-area"],children:[v&&l.jsx(ee.ClosingButton,{onClick:K,title:M("clear"),className:s.default["tedi-multi-value-field__clear-button"],iconSize:18}),v&&o&&l.jsx(te.Separator,{color:"primary",axis:"vertical",height:1.5,spacing:.25}),o&&Q()]})]}),C&&l.jsx("input",{ref:I,type:"hidden",name:C,value:a.length?JSON.stringify(a):"",required:S,disabled:p})]})});N.displayName="MultiValueField";exports.MultiValueField=N;exports.default=N;

package/src/tedi/components/form/multi-value-field/multi-value-field.d.ts

@@ -63,6 +63,12 @@ export interface MultiValueFieldProps {
      * @default true
      */
     isClearable?: boolean;
+    /**
+     * Show the clear (×) button only while the field is hovered or focused, instead of whenever values
+     * exist. Requires `isClearable`.
+     * @default false
+     */
+    showClearOnInteraction?: boolean;
     /**
      * Marks the field as required.
      * Adds required indicator to label and applies native required validation to the hidden input.