@vjdesigns/vjdesigns-ui 2.3.0 → 2.5.0

package/dist/components/forms/Field/Field.mjs

@@ -1,11 +1,12 @@
+"use client";
 import { cx as e } from "../../../utils/cx.mjs";
-import { VisuallyHidden as t } from "../../utilities/VisuallyHidden/VisuallyHidden.mjs";
-import { ErrorIcon as n } from "../../primitives/Icon/icons.mjs";
+import { ErrorIcon as t } from "../../primitives/Icon/icons.mjs";
+import { VisuallyHidden as n } from "../../utilities/VisuallyHidden/VisuallyHidden.mjs";
 import { FieldContext as r, useFieldContext as i } from "./FieldContext.mjs";
 import a from "./Field.module.css.mjs";
 import { createContext as o, useCallback as s, useContext as c, useId as l, useLayoutEffect as u, useMemo as d, useState as f } from "react";
 import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
-//#region src/components/forms/Field/Field.tsx
+// src/components/forms/Field/Field.tsx
 var g = o(null), _ = (e) => e != null && e !== !1 && e !== "";
 function v(e) {
 	let [t, n] = f({
@@ -79,25 +80,25 @@ function w({ className: t, children: n, ...r }) {
 		children: n
 	}) : null;
 }
-function T({ announce: t = !1, className: r, children: i, ...o }) {
+function T({ announce: n = !1, className: r, children: i, ...o }) {
 	let s = c(g), l = _(i);
 	y("error", l);
 	let u = l ? /* @__PURE__ */ h("p", {
 		id: s?.errorId,
 		...o,
 		className: e(a.error, r),
-		children: [/* @__PURE__ */ m(n, {
+		children: [/* @__PURE__ */ m(t, {
 			size: "sm",
 			className: a.errorIcon
 		}), /* @__PURE__ */ m("span", { children: i })]
 	}) : null;
-	return t ? /* @__PURE__ */ m("div", {
+	return n ? /* @__PURE__ */ m("div", {
 		role: "alert",
 		className: a.alertRegion,
 		children: u
 	}) : u;
 }
-function E({ label: n, labelVisuallyHidden: i = !1, hint: o, error: s, invalid: c, required: u = !1, disabled: f = !1, readOnly: y = !1, size: x, id: S, requiredIndicator: E, optionalIndicator: D, announceError: O = !1, orientation: k = "vertical", labelAction: A, counter: j, className: M, children: N, ...P }) {
+function E({ label: t, labelVisuallyHidden: i = !1, hint: o, error: s, invalid: c, required: u = !1, disabled: f = !1, readOnly: y = !1, size: x, id: S, requiredIndicator: E, optionalIndicator: D, announceError: O = !1, orientation: k = "vertical", labelAction: A, counter: j, className: M, children: N, ...P }) {
 	let F = l(), { parts: I, counts: L } = v(F), R = _(s), z = c ?? R, B = R && z, V = _(o), H = _(j), U = V || L.hint > 0, W = B || L.error > 0, G = d(() => ({
 		controlId: S ?? `${F}-control`,
 		labelId: `${F}-label`,
@@ -123,7 +124,7 @@ function E({ label: n, labelVisuallyHidden: i = !1, hint: o, error: s, invalid:
 	]), K = /* @__PURE__ */ m(C, {
 		requiredIndicator: E,
 		optionalIndicator: D,
-		children: n
+		children: t
 	}), q = _(A);
 	return /* @__PURE__ */ m(r.Provider, {
 		value: G,
@@ -137,7 +138,7 @@ function E({ label: n, labelVisuallyHidden: i = !1, hint: o, error: s, invalid:
 				className: e(a.field, k === "horizontal" && a.horizontal, x && b[x], M),
 				children: /* @__PURE__ */ h("div", {
 					className: a.layout,
-					children: [i ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(t, { children: K }), q && /* @__PURE__ */ m("div", {
+					children: [i ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(n, { children: K }), q && /* @__PURE__ */ m("div", {
 						className: e(a.labelRow, a.labelRowActionOnly),
 						children: /* @__PURE__ */ m("span", {
 							className: a.labelAction,
@@ -203,7 +204,7 @@ function D({ id: e, invalid: t = !1, required: n = !1, disabled: i = !1, readOnl
 		})
 	});
 }
-function O({ label: n, labelVisuallyHidden: i = !1, hint: o, error: s, invalid: c, required: u = !1, disabled: f = !1, readOnly: y = !1, size: S, requiredIndicator: C, optionalIndicator: E, requiredText: D = "required", announceError: O = !1, className: k, children: A, "aria-describedby": j, ...M }) {
+function O({ label: t, labelVisuallyHidden: i = !1, hint: o, error: s, invalid: c, required: u = !1, disabled: f = !1, readOnly: y = !1, size: S, requiredIndicator: C, optionalIndicator: E, requiredText: D = "required", announceError: O = !1, className: k, children: A, "aria-describedby": j, ...M }) {
 	let N = l(), { parts: P, counts: F } = v(N), I = _(s), L = c ?? I, R = I && L, z = _(o), B = z || F.hint > 0, V = R || F.error > 0, H = `${N}-label`, U = d(() => ({
 		controlId: `${N}-control`,
 		labelId: H,
@@ -231,13 +232,13 @@ function O({ label: n, labelVisuallyHidden: i = !1, hint: o, error: s, invalid:
 		B ? P.hintId : void 0,
 		L && V ? P.errorId : void 0
 	].filter(Boolean).join(" ") || void 0, G = /* @__PURE__ */ h(p, { children: [
-		n,
+		t,
 		/* @__PURE__ */ m(x, {
 			required: u,
 			requiredIndicator: C,
 			optionalIndicator: E
 		}),
-		u && /* @__PURE__ */ h(t, { children: [
+		u && /* @__PURE__ */ h(n, { children: [
 			" (",
 			D,
 			")"
@@ -257,7 +258,7 @@ function O({ label: n, labelVisuallyHidden: i = !1, hint: o, error: s, invalid:
 				children: [/* @__PURE__ */ m("legend", {
 					id: H,
 					className: e(a.label, a.legend, b[S ?? "md"], f && a.labelDisabled, i && a.legendHidden),
-					children: i ? /* @__PURE__ */ m(t, { children: G }) : G
+					children: i ? /* @__PURE__ */ m(n, { children: G }) : G
 				}), /* @__PURE__ */ h("div", {
 					className: a.groupBody,
 					children: [
@@ -273,5 +274,4 @@ function O({ label: n, labelVisuallyHidden: i = !1, hint: o, error: s, invalid:
 		})
 	});
 }
-//#endregion
 export { E as Field, T as FieldError, w as FieldHint, C as FieldLabel, D as FieldProvider, O as Fieldset };

package/dist/components/forms/Field/Field.module.css.mjs

@@ -1,4 +1,4 @@
-//#region src/components/forms/Field/Field.module.css
+// src/components/forms/Field/Field.module.css
 var e = "_sizeSm_ygpyp_19", t = "_sizeMd_ygpyp_27", n = "_sizeLg_ygpyp_35", r = "_field_ygpyp_47", i = "_layout_ygpyp_61", a = "_labelRow_ygpyp_77", o = "_labelRowActionOnly_ygpyp_97", s = "_label_ygpyp_77", c = "_labelDisabled_ygpyp_123", l = "_requiredIndicator_ygpyp_133", u = "_optionalIndicator_ygpyp_143", d = "_labelAction_ygpyp_167", f = "_body_ygpyp_179", p = "_hintRow_ygpyp_193", m = "_hint_ygpyp_193", h = "_counter_ygpyp_225", g = "_error_ygpyp_247", _ = "_errorIcon_ygpyp_271", v = "_alertRegion_ygpyp_285", y = "_groupBody_ygpyp_291", b = "_horizontal_ygpyp_305", x = "_fieldset_ygpyp_363", S = "_legend_ygpyp_383", C = "_legendHidden_ygpyp_393", w = {
 	sizeSm: e,
 	sizeMd: t,
@@ -25,5 +25,4 @@ var e = "_sizeSm_ygpyp_19", t = "_sizeMd_ygpyp_27", n = "_sizeLg_ygpyp_35", r =
 	legend: S,
 	legendHidden: C
 };
-//#endregion
 export { v as alertRegion, f as body, h as counter, w as default, g as error, _ as errorIcon, r as field, x as fieldset, y as groupBody, m as hint, p as hintRow, b as horizontal, s as label, d as labelAction, c as labelDisabled, a as labelRow, o as labelRowActionOnly, i as layout, S as legend, C as legendHidden, u as optionalIndicator, l as requiredIndicator, n as sizeLg, t as sizeMd, e as sizeSm };

package/dist/components/forms/Field/FieldContext.cjs.js

@@ -1 +1 @@
-let e=require("react");var t=(0,e.createContext)(null);function n(){return(0,e.useContext)(t)}function r(e={},{nativeRequired:t=!0}={}){let r=n(),i=e.invalid??r?.invalid??!1,a=e.required??r?.required??!1,o=e.disabled??r?.disabled??!1,s=e.readOnly??r?.readOnly??!1,c=e.id??(r&&!r.isGroup?r.controlId:void 0),l=[e[`aria-describedby`],r?.hintId,i?r?.errorId:void 0].filter(Boolean).join(` `)||void 0;return{id:c,invalid:i,required:a,disabled:o,readOnly:s,size:e.size??r?.size,ariaProps:{...l?{"aria-describedby":l}:null,...i?{"aria-invalid":!0}:null,...i&&r?.errorId?{"aria-errormessage":r.errorId}:null,...a&&!t?{"aria-required":!0}:null}}}exports.FieldContext=t,exports.useFieldContext=n,exports.useFieldControl=r;
+"use client";let e=require("react");var t=(0,e.createContext)(null);function n(){return(0,e.useContext)(t)}function r(e={},{nativeRequired:t=!0}={}){let r=n(),i=e.invalid??r?.invalid??!1,a=e.required??r?.required??!1,o=e.disabled??r?.disabled??!1,s=e.readOnly??r?.readOnly??!1,c=e.id??(r&&!r.isGroup?r.controlId:void 0),l=[e[`aria-describedby`],r?.hintId,i?r?.errorId:void 0].filter(Boolean).join(` `)||void 0;return{id:c,invalid:i,required:a,disabled:o,readOnly:s,size:e.size??r?.size,ariaProps:{...l?{"aria-describedby":l}:null,...i?{"aria-invalid":!0}:null,...i&&r?.errorId?{"aria-errormessage":r.errorId}:null,...a&&!t?{"aria-required":!0}:null}}}exports.FieldContext=t,exports.useFieldContext=n,exports.useFieldControl=r;

package/dist/components/forms/Field/FieldContext.mjs

@@ -1,5 +1,6 @@
+"use client";
 import { createContext as e, useContext as t } from "react";
-//#region src/components/forms/Field/FieldContext.ts
+// src/components/forms/Field/FieldContext.ts
 var n = e(null);
 function r() {
 	return t(n);
@@ -25,5 +26,4 @@ function i(e = {}, { nativeRequired: t = !0 } = {}) {
 		}
 	};
 }
-//#endregion
 export { n as FieldContext, r as useFieldContext, i as useFieldControl };

package/dist/components/forms/FileUpload/FileUpload.cjs.js

@@ -1 +1 @@
-const e=require("../../../i18n/en.cjs.js"),t=require("../../../hooks/useControllableState.cjs.js"),n=require("../../../hooks/useFormReset.cjs.js"),r=require("../../utilities/LocaleProvider/LocaleProvider.cjs.js"),i=require("../../../utils/refs.cjs.js"),a=require("../../../utils/cx.cjs.js"),o=require("../../utilities/VisuallyHidden/VisuallyHidden.cjs.js"),s=require("../../feedback/Spinner/Spinner.cjs.js"),c=require("../../primitives/Button/Button.cjs.js"),l=require("../../primitives/Icon/icons.cjs.js"),u=require("../Field/FieldContext.cjs.js"),d=require("../../feedback/Progress/Progress.cjs.js"),f=require("./FileUpload.module.css.cjs.js");let p=require("react"),m=require("react/jsx-runtime");var h={sm:f.default.sm,md:f.default.md,lg:f.default.lg},g={dropzone:f.default.variantDropzone,button:f.default.variantButton};function _(t,n=e.en.fileUpload.units,r){let i=e=>new Intl.NumberFormat(r).format(e);if(!Number.isFinite(t)||t<0)return`${i(0)} ${n.B}`;if(t<1024)return`${i(Math.round(t))} ${n.B}`;let a=[n.KB,n.MB,n.GB,n.TB],o=t/1024,s=0;for(;o>=1024&&s<a.length-1;)o/=1024,s++;return`${i(o>=10?Math.round(o):Math.round(o*10)/10)} ${a[s]}`}function v(e){return e?e.split(`,`).map(e=>e.trim().toLowerCase()).filter(Boolean):[]}function y(e,t){let n=v(t);if(n.length===0)return!0;let r=e.name.toLowerCase(),i=(e.type||``).toLowerCase();return n.some(e=>e.startsWith(`.`)?r.endsWith(e):e.endsWith(`/*`)?i.startsWith(e.slice(0,-1)):i===e)}var b={"image/jpeg":`JPG`,"image/svg+xml":`SVG`,"text/plain":`TXT`,"application/msword":`DOC`,"application/vnd.openxmlformats-officedocument.wordprocessingml.document":`DOCX`,"application/vnd.ms-excel":`XLS`,"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet":`XLSX`};function x(t,n=e.en.fileUpload){let r=n.typeGroups,i=v(t).map(e=>{if(e.startsWith(`.`))return e.slice(1).toUpperCase();if(e.endsWith(`/*`)){let t=e.slice(0,-2);return r[t]??n.typeGroup(t)}return b[e]?b[e]:(e.split(`/`)[1]??e).toUpperCase()}),a=Array.from(new Set(i));if(a.length===0)return``;let o=a.join(`, `);return o.charAt(0).toUpperCase()+o.slice(1)}var S=e=>`${e.name}::${e.size}::${e.lastModified}`,C=e=>(e.type||``).startsWith(`image/`),w=new WeakMap,T=0;function E(e){let t=w.get(e);return t||(t=`file-${++T}`,w.set(e,t)),t}function D(e,t){let n=Intl.ListFormat;return n?new n(t,{type:`conjunction`}).format(e):e.join(`, `)}function ee(){let[e,t]=(0,p.useState)(``),n=(0,p.useRef)(!1);return[e,(0,p.useCallback)(e=>{n.current=!n.current,t(n.current?`${e} `:e)},[])]}function O(e,t){let[n,r]=(0,p.useState)();return(0,p.useEffect)(()=>{if(!t||typeof URL>`u`||typeof URL.createObjectURL!=`function`)return;let n=URL.createObjectURL(e);return r(n),()=>{URL.revokeObjectURL(n),r(void 0)}},[e,t]),n}var k=(e,t)=>{if(!e?.status&&e?.progress==null)return null;if(e.message)return e.message;switch(e.status){case`done`:return t.uploaded;case`error`:return t.uploadFailed;default:return e.progress==null?t.uploading:t.uploadingPercent(Math.round(e.progress))}},te=({file:e,state:t,showThumbnails:n,disabled:i,removeLabel:a,onRemove:o,removeRef:u})=>{let{messages:h,locale:g}=r.useLocale(),v=C(e),[y,b]=(0,p.useState)(!1),x=O(e,n&&v),S=t?.status??(t?.progress==null?void 0:`uploading`),w=k(t,h.fileUpload),T=S===`uploading`&&t?.progress!=null;return(0,m.jsxs)(`li`,{className:f.default.item,"data-status":S,children:[(0,m.jsx)(`span`,{className:f.default.thumb,"aria-hidden":`true`,children:x&&!y?(0,m.jsx)(`img`,{className:f.default.thumbImage,src:x,alt:``,onError:()=>b(!0)}):v?(0,m.jsx)(l.ImageIcon,{size:`md`}):(0,m.jsx)(l.FileIcon,{size:`md`})}),(0,m.jsxs)(`div`,{className:f.default.itemBody,children:[(0,m.jsx)(`span`,{className:f.default.fileName,title:e.name,children:e.name}),(0,m.jsxs)(`span`,{className:f.default.meta,children:[(0,m.jsx)(`span`,{children:_(e.size,h.fileUpload.units,g)}),w&&(0,m.jsxs)(`span`,{className:f.default.status,"data-status":S,children:[S===`done`&&(0,m.jsx)(l.CheckIcon,{size:`sm`}),S===`error`&&(0,m.jsx)(l.ErrorIcon,{size:`sm`}),S===`uploading`&&(0,m.jsx)(s.Spinner,{decorative:!0,size:`xs`}),(0,m.jsx)(`span`,{children:w})]})]}),T&&(0,m.jsx)(d.Progress,{className:f.default.progress,size:`sm`,value:t?.progress,"aria-label":h.fileUpload.progressFor(e.name)})]}),o&&(0,m.jsx)(c.IconButton,{ref:u,className:f.default.remove,variant:`ghost`,tone:`neutral`,size:`sm`,"aria-label":a,disabled:i,onClick:o,children:S===`uploading`?(0,m.jsx)(l.CloseIcon,{size:`sm`}):(0,m.jsx)(l.TrashIcon,{size:`sm`})})]})},A=({files:e,onRemove:t,getFileState:n,showThumbnails:i=!0,disabled:s=!1,removeLabel:c,focusFallback:l,size:u=`md`,className:d,"aria-label":g,..._})=>{let{messages:v,locale:y}=r.useLocale(),b=e=>D(e,y),x=c??v.fileUpload.remove,S=g??v.fileUpload.list,C=(0,p.useRef)([]),w=(0,p.useRef)(null),[T,O]=ee(),k=(n,r)=>{w.current={index:r,length:e.length},t?.(n,r)};(0,p.useLayoutEffect)(()=>{let t=w.current;if(t&&(w.current=null,!(e.length>=t.length))){if(e.length===0){l?.()?.focus();return}C.current[Math.min(t.index,e.length-1)]?.focus()}},[e,l]);let A=e.map((e,t)=>n?.(e,t)),j=(0,p.useRef)(new WeakMap),M=A.map(e=>e?.status??``).join(`|`);return(0,p.useEffect)(()=>{let t=[],n=[];e.forEach((e,r)=>{let i=A[r]?.status,a=j.current.get(e);i!==a&&((a!==void 0||j.current.has(e))&&(i===`done`&&t.push(e.name),i===`error`&&n.push(e.name)),j.current.set(e,i))});let r=[];t.length&&r.push(v.fileUpload.announceUploaded(b(t))),n.length&&r.push(v.fileUpload.announceFailed(b(n))),r.length&&O(r.join(` `))},[e,M,O]),(0,m.jsxs)(m.Fragment,{children:[e.length>0&&(0,m.jsx)(`ul`,{..._,"aria-label":S,className:a.cx(f.default.list,h[u],d),children:e.map((e,n)=>(0,m.jsx)(te,{file:e,state:A[n],showThumbnails:i,disabled:s,removeLabel:x(e.name),onRemove:t?()=>k(e,n):void 0,removeRef:e=>{C.current[n]=e}},E(e)))}),(0,m.jsx)(o.VisuallyHidden,{role:`status`,children:T})]})};function j(e,t,n,r,i){let a=e=>_(e,r.units,i),{accept:o,multiple:s=!1,maxFiles:c,maxSize:l,minSize:u,validator:d}=n,f=[],p=[],m=new Set(s?t.map(S):[]),h=s?c??1/0:1,g=s?t.length:0,v=x(o,r);for(let t of e){let e=[];if(y(t,o)||e.push(v?r.typeNotAcceptedUse(v):r.typeNotAccepted),l!=null&&t.size>l&&e.push(r.tooLarge(a(l))),u!=null&&t.size<u&&e.push(r.tooSmall(a(u))),m.has(S(t))&&e.push(r.duplicate),e.length===0&&d){let n=d(t);n&&e.push(n)}e.length===0&&g+f.length>=h&&e.push(s?r.tooMany(h):r.onlyOne),e.length?p.push({file:t,errors:e}):(f.push(t),m.add(S(t)))}return{accepted:f,rejections:p}}var M=e=>Array.from(e.dataTransfer?.types??[]).includes(`Files`),ne=Object.assign(({accept:e,multiple:s=!1,maxFiles:d,maxSize:v,minSize:y,validator:b,value:S,defaultValue:C,onValueChange:w,onReject:T,onFileRemove:D,disabled:O,invalid:k,name:te,required:ne,size:re,variant:N=`dropzone`,children:P,prompt:ie,hint:ae,browseLabel:oe,showList:se=!0,showRejections:ce=!0,showThumbnails:le=!0,getFileState:ue,inputRef:de,buttonRef:fe,id:pe,className:me,style:he,"aria-describedby":ge,"aria-label":F,"aria-labelledby":_e,...I})=>{let{messages:L,locale:ve}=r.useLocale(),ye=e=>_(e,L.fileUpload.units,ve),R=(0,p.useId)(),z=`${R}-hint`,be=`${R}-prompt`,xe=`${R}-browse`,Se=`${R}-rejections`,Ce=`${R}-required`,we=`${R}-input`,B=u.useFieldContext(),[V,Te]=(0,p.useState)([]),H=ae===void 0?[[x(e,L.fileUpload),v==null?``:s?L.fileUpload.upToEach(ye(v)):L.fileUpload.upTo(ye(v))].filter(Boolean).join(` `),s&&d!=null?L.fileUpload.maxFiles(d):``].filter(Boolean).map(e=>`${e}.`).join(` `)||null:ae,Ee=H!==null&&H!==!1&&H!==``,De=ce&&V.length>0,U=u.useFieldControl({id:pe,invalid:k,required:ne,disabled:O,size:re,"aria-describedby":[ge,Ee&&!P?z:void 0,De?Se:void 0].filter(Boolean).join(` `)||void 0}),W=U.size??`md`,G=U.disabled,[K,q]=t.useControllableState({value:S,defaultValue:C??[],onChange:w});n.useFormReset(()=>U.id?document.getElementById(U.id):null,()=>q(C??[]),S===void 0);let J=(0,p.useRef)(K);J.current=K;let[Oe,ke]=ee(),[Ae,Y]=(0,p.useState)(!1),X=(0,p.useRef)(0),Z=(0,p.useRef)(null),Q=(0,p.useRef)(null),je=(0,p.useCallback)(e=>{Z.current=e,i.assignRef(de,e)},[de]),Me=(0,p.useCallback)(e=>{Q.current=e,i.assignRef(fe,e)},[fe]),$=(0,p.useCallback)(e=>{let t=Z.current;if(t)try{if(typeof DataTransfer>`u`)throw Error(`unsupported`);let n=new DataTransfer;e.forEach(e=>n.items.add(e)),t.files=n.files}catch{e.length===0&&(t.value=``)}},[]);(0,p.useEffect)(()=>{$(K)},[K,$]);let Ne=(0,p.useCallback)(()=>{if(G)return;let e=Z.current;e&&(e.value=``,e.click())},[G]);(0,p.useEffect)(()=>{let e=Z.current;if(!e)return;let t=()=>$(J.current);return e.addEventListener(`cancel`,t),()=>e.removeEventListener(`cancel`,t)},[$]);let Pe=t=>{if(G||t.length===0)return;let n=J.current,r=j(t,n,{accept:e,multiple:s,maxFiles:d,maxSize:v,minSize:y,validator:b},L.fileUpload,ve);r.accepted.length&&q(s?[...n,...r.accepted]:r.accepted),Te(r.rejections),r.rejections.length&&T?.(r.rejections);let i=r.accepted.length,a=r.rejections.length,o=L.fileUpload.announceAdded(i,a);a===1&&i===0&&(o+=` ${r.rejections[0].file.name}: ${r.rejections[0].errors.join(` `)}`),ke(o)},Fe=e=>{let t=Array.from(e.target.files??[]);Pe(t),requestAnimationFrame(()=>$(J.current))},Ie=e=>{let t=J.current.filter(t=>t!==e);q(t),D?.(e),ke(`${e.name} removed.`)},Le=()=>{X.current=0,Y(!1)},Re=e=>{M(e)&&(e.preventDefault(),X.current+=1,G||Y(!0))},ze=e=>{M(e)&&(e.preventDefault(),e.dataTransfer.dropEffect=G?`none`:`copy`)},Be=e=>{M(e)&&(X.current=Math.max(0,X.current-1),X.current===0&&Y(!1))},Ve=e=>{M(e)&&(e.preventDefault(),Le(),!G&&Pe(Array.from(e.dataTransfer.files??[])))},He=[xe,B&&!B.isGroup?B.labelId:void 0].filter(Boolean).join(` `),Ue=[U.ariaProps[`aria-describedby`],U.required?Ce:void 0].filter(Boolean).join(` `)||void 0,We=oe??(N===`button`?L.fileUpload.uploadFiles:L.fileUpload.browseFiles),Ge=W,Ke=(0,m.jsx)(c.Button,{ref:Me,id:U.id,className:f.default.browse,variant:N===`button`?`outline`:`solid`,size:Ge,startIcon:N===`button`?(0,m.jsx)(l.UploadIcon,{size:`sm`}):void 0,disabled:G,"aria-labelledby":He,"aria-describedby":Ue,"aria-invalid":U.ariaProps[`aria-invalid`],"aria-errormessage":U.ariaProps[`aria-errormessage`],"aria-controls":we,onClick:Ne,children:(0,m.jsx)(`span`,{id:xe,children:We})}),qe=ie??(s?L.fileUpload.dropFiles:L.fileUpload.dropFile),Je=typeof P==`function`?P({dragging:Ae,disabled:G,openPicker:Ne}):P,Ye=Ee?(0,m.jsx)(`p`,{id:z,className:f.default.hint,children:H}):null,Xe=_e??(B&&!F?B.labelId:void 0),Ze=!!(F||Xe),Qe=(0,p.useCallback)(()=>Q.current,[]),$e=(0,p.useMemo)(()=>K,[K]);return(0,m.jsxs)(`div`,{...I,role:Ze?`group`:I.role,"aria-label":F,"aria-labelledby":Xe,className:a.cx(f.default.root,h[W],g[N],U.invalid&&f.default.invalid,G&&f.default.disabled,me),style:he,"data-size":W,"data-variant":N,"data-dragging":Ae||void 0,"data-disabled":G||void 0,"aria-disabled":G||void 0,children:[(0,m.jsx)(`input`,{ref:je,id:we,className:f.default.nativeInput,type:`file`,name:te,accept:e,multiple:s,required:U.required,disabled:G,tabIndex:-1,"aria-hidden":`true`,onChange:Fe,onInvalid:()=>Q.current?.focus()}),U.required&&(0,m.jsx)(o.VisuallyHidden,{id:Ce,children:L.fileUpload.required}),N===`dropzone`?(0,m.jsxs)(`div`,{className:f.default.dropzone,onDragEnter:Re,onDragOver:ze,onDragLeave:Be,onDrop:Ve,children:[(0,m.jsx)(`span`,{className:f.default.iconBadge,"aria-hidden":`true`,children:(0,m.jsx)(l.UploadIcon,{size:W===`lg`?`xl`:W===`sm`?`sm`:`lg`})}),(0,m.jsx)(`div`,{className:f.default.text,children:Je??(0,m.jsxs)(m.Fragment,{children:[(0,m.jsx)(`p`,{id:be,className:f.default.prompt,children:qe}),Ye]})}),Ke]}):(0,m.jsxs)(`div`,{className:f.default.buttonRow,children:[Ke,Je??Ye]}),De&&(0,m.jsxs)(`div`,{id:Se,className:f.default.rejections,children:[(0,m.jsxs)(`div`,{className:f.default.rejectionsHeader,children:[(0,m.jsx)(l.ErrorIcon,{size:`sm`}),(0,m.jsx)(`p`,{className:f.default.rejectionsTitle,children:L.fileUpload.rejected(V.length)}),(0,m.jsx)(c.IconButton,{className:f.default.rejectionsDismiss,variant:`ghost`,tone:`neutral`,size:`sm`,"aria-label":L.fileUpload.dismissErrors,onClick:()=>{Te([]),Q.current?.focus()},children:(0,m.jsx)(l.CloseIcon,{size:`sm`})})]}),(0,m.jsx)(`ul`,{className:f.default.rejectionList,children:V.map(({file:e,errors:t},n)=>(0,m.jsxs)(`li`,{className:f.default.rejection,children:[(0,m.jsx)(`span`,{className:f.default.rejectionName,children:e.name}),(0,m.jsx)(`span`,{className:f.default.rejectionReason,children:t.join(` `)})]},`${E(e)}-${n}`))})]}),se&&(0,m.jsx)(A,{files:$e,size:W,disabled:G,showThumbnails:le,getFileState:ue,onRemove:Ie,focusFallback:Qe}),(0,m.jsx)(o.VisuallyHidden,{role:`status`,children:Oe})]})},{List:A});exports.FileUpload=ne,exports.FileUploadList=A,exports.describeAccept=x,exports.fileMatchesAccept=y,exports.formatFileSize=_;
+"use client";const e=require("../../../utils/cx.cjs.js"),t=require("../../../utils/intl.cjs.js"),n=require("../../../utils/refs.cjs.js"),r=require("../../../hooks/useControllableState.cjs.js"),i=require("../../../hooks/useFormReset.cjs.js"),a=require("../../primitives/Button/Button.cjs.js"),o=require("../../primitives/Icon/icons.cjs.js"),s=require("../../feedback/Progress/Progress.cjs.js"),c=require("../../feedback/Spinner/Spinner.cjs.js"),l=require("../../utilities/VisuallyHidden/VisuallyHidden.cjs.js"),u=require("../Field/FieldContext.cjs.js"),d=require("./FileUpload.module.css.cjs.js"),f=require("../../utilities/LocaleProvider/LocaleProvider.cjs.js"),p=require("../../../i18n/en.cjs.js");let m=require("react"),h=require("react/jsx-runtime");var g={sm:d.default.sm,md:d.default.md,lg:d.default.lg},_={dropzone:d.default.variantDropzone,button:d.default.variantButton};function v(e,n=p.en.fileUpload.units,r){let i=e=>t.getNumberFormat(r).format(e);if(!Number.isFinite(e)||e<0)return`${i(0)} ${n.B}`;if(e<1024)return`${i(Math.round(e))} ${n.B}`;let a=[n.KB,n.MB,n.GB,n.TB],o=e/1024,s=0;for(;o>=1024&&s<a.length-1;)o/=1024,s++;return`${i(o>=10?Math.round(o):Math.round(o*10)/10)} ${a[s]}`}function y(e){return e?e.split(`,`).map(e=>e.trim().toLowerCase()).filter(Boolean):[]}function b(e,t){let n=y(t);if(n.length===0)return!0;let r=e.name.toLowerCase(),i=(e.type||``).toLowerCase();return n.some(e=>e.startsWith(`.`)?r.endsWith(e):e.endsWith(`/*`)?i.startsWith(e.slice(0,-1)):i===e)}var x={"image/jpeg":`JPG`,"image/svg+xml":`SVG`,"text/plain":`TXT`,"application/msword":`DOC`,"application/vnd.openxmlformats-officedocument.wordprocessingml.document":`DOCX`,"application/vnd.ms-excel":`XLS`,"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet":`XLSX`};function S(e,t=p.en.fileUpload){let n=t.typeGroups,r=y(e).map(e=>{if(e.startsWith(`.`))return e.slice(1).toUpperCase();if(e.endsWith(`/*`)){let r=e.slice(0,-2);return n[r]??t.typeGroup(r)}return x[e]?x[e]:(e.split(`/`)[1]??e).toUpperCase()}),i=Array.from(new Set(r));if(i.length===0)return``;let a=i.join(`, `);return a.charAt(0).toUpperCase()+a.slice(1)}var C=e=>`${e.name}::${e.size}::${e.lastModified}`,w=e=>(e.type||``).startsWith(`image/`),T=new WeakMap,E=0;function ee(e){let t=T.get(e);return t||(t=`file-${++E}`,T.set(e,t)),t}function te(e,t){let n=Intl.ListFormat;return n?new n(t,{type:`conjunction`}).format(e):e.join(`, `)}function D(){let[e,t]=(0,m.useState)(``),n=(0,m.useRef)(!1);return[e,(0,m.useCallback)(e=>{n.current=!n.current,t(n.current?`${e} `:e)},[])]}function O(e,t){let[n,r]=(0,m.useState)();return(0,m.useEffect)(()=>{if(!t||typeof URL>`u`||typeof URL.createObjectURL!=`function`)return;let n=URL.createObjectURL(e);return r(n),()=>{URL.revokeObjectURL(n),r(void 0)}},[e,t]),n}var k=(e,t)=>{if(!e?.status&&e?.progress==null)return null;if(e.message)return e.message;switch(e.status){case`done`:return t.uploaded;case`error`:return t.uploadFailed;default:return e.progress==null?t.uploading:t.uploadingPercent(Math.round(e.progress))}},ne=({file:e,state:t,showThumbnails:n,disabled:r,removeLabel:i,onRemove:l,removeRef:u})=>{let{messages:p,locale:g}=f.useLocale(),_=w(e),[y,b]=(0,m.useState)(!1),x=O(e,n&&_),S=t?.status??(t?.progress==null?void 0:`uploading`),C=k(t,p.fileUpload),T=S===`uploading`&&t?.progress!=null;return(0,h.jsxs)(`li`,{className:d.default.item,"data-status":S,children:[(0,h.jsx)(`span`,{className:d.default.thumb,"aria-hidden":`true`,children:x&&!y?(0,h.jsx)(`img`,{className:d.default.thumbImage,src:x,alt:``,onError:()=>b(!0)}):_?(0,h.jsx)(o.ImageIcon,{size:`md`}):(0,h.jsx)(o.FileIcon,{size:`md`})}),(0,h.jsxs)(`div`,{className:d.default.itemBody,children:[(0,h.jsx)(`span`,{className:d.default.fileName,title:e.name,children:e.name}),(0,h.jsxs)(`span`,{className:d.default.meta,children:[(0,h.jsx)(`span`,{children:v(e.size,p.fileUpload.units,g)}),C&&(0,h.jsxs)(`span`,{className:d.default.status,"data-status":S,children:[S===`done`&&(0,h.jsx)(o.CheckIcon,{size:`sm`}),S===`error`&&(0,h.jsx)(o.ErrorIcon,{size:`sm`}),S===`uploading`&&(0,h.jsx)(c.Spinner,{decorative:!0,size:`xs`}),(0,h.jsx)(`span`,{children:C})]})]}),T&&(0,h.jsx)(s.Progress,{className:d.default.progress,size:`sm`,value:t?.progress,"aria-label":p.fileUpload.progressFor(e.name)})]}),l&&(0,h.jsx)(a.IconButton,{ref:u,className:d.default.remove,variant:`ghost`,tone:`neutral`,size:`sm`,"aria-label":i,disabled:r,onClick:l,children:S===`uploading`?(0,h.jsx)(o.CloseIcon,{size:`sm`}):(0,h.jsx)(o.TrashIcon,{size:`sm`})})]})},A=({files:t,onRemove:n,getFileState:r,showThumbnails:i=!0,disabled:a=!1,removeLabel:o,focusFallback:s,size:c=`md`,className:u,"aria-label":p,..._})=>{let{messages:v,locale:y}=f.useLocale(),b=e=>te(e,y),x=o??v.fileUpload.remove,S=p??v.fileUpload.list,C=(0,m.useRef)([]),w=(0,m.useRef)(null),[T,E]=D(),O=(e,r)=>{w.current={index:r,length:t.length},n?.(e,r)};(0,m.useLayoutEffect)(()=>{let e=w.current;e&&(w.current=null,t.length>=e.length||(t.length===0?s?.()?.focus():C.current[Math.min(e.index,t.length-1)]?.focus()))},[t,s]);let k=t.map((e,t)=>r?.(e,t)),A=(0,m.useRef)(new WeakMap),j=k.map(e=>e?.status??``).join(`|`);return(0,m.useEffect)(()=>{let e=[],n=[];t.forEach((t,r)=>{let i=k[r]?.status,a=A.current.get(t);i!==a&&((a!==void 0||A.current.has(t))&&(i===`done`&&e.push(t.name),i===`error`&&n.push(t.name)),A.current.set(t,i))});let r=[];e.length&&r.push(v.fileUpload.announceUploaded(b(e))),n.length&&r.push(v.fileUpload.announceFailed(b(n))),r.length&&E(r.join(` `))},[t,j,E]),(0,h.jsxs)(h.Fragment,{children:[t.length>0&&(0,h.jsx)(`ul`,{..._,"aria-label":S,className:e.cx(d.default.list,g[c],u),children:t.map((e,t)=>(0,h.jsx)(ne,{file:e,state:k[t],showThumbnails:i,disabled:a,removeLabel:x(e.name),onRemove:n?()=>O(e,t):void 0,removeRef:e=>{C.current[t]=e}},ee(e)))}),(0,h.jsx)(l.VisuallyHidden,{role:`status`,children:T})]})};function j(e,t,n,r,i){let a=e=>v(e,r.units,i),{accept:o,multiple:s=!1,maxFiles:c,maxSize:l,minSize:u,validator:d}=n,f=[],p=[],m=new Set(s?t.map(C):[]),h=s?c??1/0:1,g=s?t.length:0,_=S(o,r);for(let t of e){let e=[];if(b(t,o)||e.push(_?r.typeNotAcceptedUse(_):r.typeNotAccepted),l!=null&&t.size>l&&e.push(r.tooLarge(a(l))),u!=null&&t.size<u&&e.push(r.tooSmall(a(u))),m.has(C(t))&&e.push(r.duplicate),e.length===0&&d){let n=d(t);n&&e.push(n)}e.length===0&&g+f.length>=h&&e.push(s?r.tooMany(h):r.onlyOne),e.length?p.push({file:t,errors:e}):(f.push(t),m.add(C(t)))}return{accepted:f,rejections:p}}var M=e=>Array.from(e.dataTransfer?.types??[]).includes(`Files`),re=Object.assign(({accept:t,multiple:s=!1,maxFiles:c,maxSize:p,minSize:y,validator:b,value:x,defaultValue:C,onValueChange:w,onReject:T,onFileRemove:E,disabled:te,invalid:O,name:k,required:ne,size:re,variant:N=`dropzone`,children:P,prompt:ie,hint:ae,browseLabel:oe,showList:se=!0,showRejections:ce=!0,showThumbnails:le=!0,getFileState:ue,inputRef:de,buttonRef:fe,id:pe,className:me,style:he,"aria-describedby":ge,"aria-label":F,"aria-labelledby":_e,...I})=>{let{messages:L,locale:ve}=f.useLocale(),ye=e=>v(e,L.fileUpload.units,ve),R=(0,m.useId)(),z=`${R}-hint`,be=`${R}-prompt`,xe=`${R}-browse`,Se=`${R}-rejections`,Ce=`${R}-required`,we=`${R}-input`,B=u.useFieldContext(),[V,Te]=(0,m.useState)([]),H=ae===void 0?[[S(t,L.fileUpload),p==null?``:s?L.fileUpload.upToEach(ye(p)):L.fileUpload.upTo(ye(p))].filter(Boolean).join(` `),s&&c!=null?L.fileUpload.maxFiles(c):``].filter(Boolean).map(e=>`${e}.`).join(` `)||null:ae,Ee=H!==null&&H!==!1&&H!==``,De=ce&&V.length>0,U=u.useFieldControl({id:pe,invalid:O,required:ne,disabled:te,size:re,"aria-describedby":[ge,Ee&&!P?z:void 0,De?Se:void 0].filter(Boolean).join(` `)||void 0}),W=U.size??`md`,G=U.disabled,[K,q]=r.useControllableState({value:x,defaultValue:C??[],onChange:w});i.useFormReset(()=>U.id?document.getElementById(U.id):null,()=>q(C??[]),x===void 0);let J=(0,m.useRef)(K);J.current=K;let[Oe,ke]=D(),[Ae,Y]=(0,m.useState)(!1),X=(0,m.useRef)(0),Z=(0,m.useRef)(null),Q=(0,m.useRef)(null),je=(0,m.useCallback)(e=>{Z.current=e,n.assignRef(de,e)},[de]),Me=(0,m.useCallback)(e=>{Q.current=e,n.assignRef(fe,e)},[fe]),$=(0,m.useCallback)(e=>{let t=Z.current;if(t)try{if(typeof DataTransfer>`u`)throw Error(`unsupported`);let n=new DataTransfer;e.forEach(e=>n.items.add(e)),t.files=n.files}catch{e.length===0&&(t.value=``)}},[]);(0,m.useEffect)(()=>{$(K)},[K,$]);let Ne=(0,m.useCallback)(()=>{if(G)return;let e=Z.current;e&&(e.value=``,e.click())},[G]);(0,m.useEffect)(()=>{let e=Z.current;if(!e)return;let t=()=>$(J.current);return e.addEventListener(`cancel`,t),()=>e.removeEventListener(`cancel`,t)},[$]);let Pe=e=>{if(G||e.length===0)return;let n=J.current,r=j(e,n,{accept:t,multiple:s,maxFiles:c,maxSize:p,minSize:y,validator:b},L.fileUpload,ve);r.accepted.length&&q(s?[...n,...r.accepted]:r.accepted),Te(r.rejections),r.rejections.length&&T?.(r.rejections);let i=r.accepted.length,a=r.rejections.length,o=L.fileUpload.announceAdded(i,a);a===1&&i===0&&(o+=` ${r.rejections[0].file.name}: ${r.rejections[0].errors.join(` `)}`),ke(o)},Fe=e=>{let t=Array.from(e.target.files??[]);Pe(t),requestAnimationFrame(()=>$(J.current))},Ie=e=>{let t=J.current.filter(t=>t!==e);q(t),E?.(e),ke(`${e.name} removed.`)},Le=()=>{X.current=0,Y(!1)},Re=e=>{M(e)&&(e.preventDefault(),X.current+=1,G||Y(!0))},ze=e=>{M(e)&&(e.preventDefault(),e.dataTransfer.dropEffect=G?`none`:`copy`)},Be=e=>{M(e)&&(X.current=Math.max(0,X.current-1),X.current===0&&Y(!1))},Ve=e=>{M(e)&&(e.preventDefault(),Le(),G||Pe(Array.from(e.dataTransfer.files??[])))},He=[xe,B&&!B.isGroup?B.labelId:void 0].filter(Boolean).join(` `),Ue=[U.ariaProps[`aria-describedby`],U.required?Ce:void 0].filter(Boolean).join(` `)||void 0,We=oe??(N===`button`?L.fileUpload.uploadFiles:L.fileUpload.browseFiles),Ge=W,Ke=(0,h.jsx)(a.Button,{ref:Me,id:U.id,className:d.default.browse,variant:N===`button`?`outline`:`solid`,size:Ge,startIcon:N===`button`?(0,h.jsx)(o.UploadIcon,{size:`sm`}):void 0,disabled:G,"aria-labelledby":He,"aria-describedby":Ue,"aria-invalid":U.ariaProps[`aria-invalid`],"aria-errormessage":U.ariaProps[`aria-errormessage`],"aria-controls":we,onClick:Ne,children:(0,h.jsx)(`span`,{id:xe,children:We})}),qe=ie??(s?L.fileUpload.dropFiles:L.fileUpload.dropFile),Je=typeof P==`function`?P({dragging:Ae,disabled:G,openPicker:Ne}):P,Ye=Ee?(0,h.jsx)(`p`,{id:z,className:d.default.hint,children:H}):null,Xe=_e??(B&&!F?B.labelId:void 0),Ze=!!(F||Xe),Qe=(0,m.useCallback)(()=>Q.current,[]),$e=(0,m.useMemo)(()=>K,[K]);return(0,h.jsxs)(`div`,{...I,role:Ze?`group`:I.role,"aria-label":F,"aria-labelledby":Xe,className:e.cx(d.default.root,g[W],_[N],U.invalid&&d.default.invalid,G&&d.default.disabled,me),style:he,"data-size":W,"data-variant":N,"data-dragging":Ae||void 0,"data-disabled":G||void 0,"aria-disabled":G||void 0,children:[(0,h.jsx)(`input`,{ref:je,id:we,className:d.default.nativeInput,type:`file`,name:k,accept:t,multiple:s,required:U.required,disabled:G,tabIndex:-1,"aria-hidden":`true`,onChange:Fe,onInvalid:()=>Q.current?.focus()}),U.required&&(0,h.jsx)(l.VisuallyHidden,{id:Ce,children:L.fileUpload.required}),N===`dropzone`?(0,h.jsxs)(`div`,{className:d.default.dropzone,onDragEnter:Re,onDragOver:ze,onDragLeave:Be,onDrop:Ve,children:[(0,h.jsx)(`span`,{className:d.default.iconBadge,"aria-hidden":`true`,children:(0,h.jsx)(o.UploadIcon,{size:W===`lg`?`xl`:W===`sm`?`sm`:`lg`})}),(0,h.jsx)(`div`,{className:d.default.text,children:Je??(0,h.jsxs)(h.Fragment,{children:[(0,h.jsx)(`p`,{id:be,className:d.default.prompt,children:qe}),Ye]})}),Ke]}):(0,h.jsxs)(`div`,{className:d.default.buttonRow,children:[Ke,Je??Ye]}),De&&(0,h.jsxs)(`div`,{id:Se,className:d.default.rejections,children:[(0,h.jsxs)(`div`,{className:d.default.rejectionsHeader,children:[(0,h.jsx)(o.ErrorIcon,{size:`sm`}),(0,h.jsx)(`p`,{className:d.default.rejectionsTitle,children:L.fileUpload.rejected(V.length)}),(0,h.jsx)(a.IconButton,{className:d.default.rejectionsDismiss,variant:`ghost`,tone:`neutral`,size:`sm`,"aria-label":L.fileUpload.dismissErrors,onClick:()=>{Te([]),Q.current?.focus()},children:(0,h.jsx)(o.CloseIcon,{size:`sm`})})]}),(0,h.jsx)(`ul`,{className:d.default.rejectionList,children:V.map(({file:e,errors:t},n)=>(0,h.jsxs)(`li`,{className:d.default.rejection,children:[(0,h.jsx)(`span`,{className:d.default.rejectionName,children:e.name}),(0,h.jsx)(`span`,{className:d.default.rejectionReason,children:t.join(` `)})]},`${ee(e)}-${n}`))})]}),se&&(0,h.jsx)(A,{files:$e,size:W,disabled:G,showThumbnails:le,getFileState:ue,onRemove:Ie,focusFallback:Qe}),(0,h.jsx)(l.VisuallyHidden,{role:`status`,children:Oe})]})},{List:A});exports.FileUpload=re,exports.FileUploadList=A,exports.describeAccept=S,exports.fileMatchesAccept=b,exports.formatFileSize=v;