@choco-vanille/ui 1.17.1 → 1.18.0

package/dist/components/forms/image-picker/ImagePicker.js

@@ -1,188 +1,195 @@
-import { jsxs as R, jsx as o } from "react/jsx-runtime";
-import Ce from "../_shared/components/form-label/FormLabel.js";
-import be from "../_shared/components/helper-text/HelperText.js";
-import { ImagePickerActions as De } from "./components/image-picker-actions/ImagePickerActions.js";
-import { ImagePickerCropDialog as ue } from "./components/image-picker-crop-dialog/ImagePickerCropDialog.js";
-import { ImagePickerInput as Pe } from "./components/image-picker-input/ImagePickerInput.js";
-import { ImagePickerPreview as ke } from "./components/image-picker-preview/ImagePickerPreview.js";
-import { ImagePickerRemoveButton as Ee } from "./components/image-picker-remove-button/ImagePickerRemoveButton.js";
-import { IMAGE_PICKER_DEFAULT_ACCEPT as ye } from "./constants/imagePickerDefaults.const.js";
-import { IMAGE_PICKER_SHAPES as A } from "./constants/imagePickerShapes.const.js";
-import { IMAGE_PICKER_STYLES as L } from "./styles/ImagePicker.css.js";
-import { useImagePicker as Re } from "./hooks/useImagePicker.hook.js";
-import { resolveImagePickerAspectRatio as Ae } from "./utils/imagePicker.utils.js";
-import { cn as Le } from "../../../utils/cn.js";
-import { memo as Be, useId as _e } from "react";
-const we = Be(
+import { jsxs as L, jsx as r } from "react/jsx-runtime";
+import be from "../_shared/components/form-label/FormLabel.js";
+import ue from "../_shared/components/helper-text/HelperText.js";
+import { ImagePickerActions as Pe } from "./components/image-picker-actions/ImagePickerActions.js";
+import { ImagePickerCropDialog as ye } from "./components/image-picker-crop-dialog/ImagePickerCropDialog.js";
+import { ImagePickerInput as ke } from "./components/image-picker-input/ImagePickerInput.js";
+import { ImagePickerPreview as Ee } from "./components/image-picker-preview/ImagePickerPreview.js";
+import { ImagePickerRemoveButton as Re } from "./components/image-picker-remove-button/ImagePickerRemoveButton.js";
+import { IMAGE_PICKER_DEFAULT_ACCEPT as Ae } from "./constants/imagePickerDefaults.const.js";
+import { IMAGE_PICKER_SHAPES as B } from "./constants/imagePickerShapes.const.js";
+import { IMAGE_PICKER_STYLES as _ } from "./styles/ImagePicker.css.js";
+import { useImagePicker as Le } from "./hooks/useImagePicker.hook.js";
+import { resolveImagePickerAspectRatio as Be } from "./utils/imagePicker.utils.js";
+import { cn as _e } from "../../../utils/cn.js";
+import { memo as we, useId as Se } from "react";
+const je = we(
   ({
-    value: B,
-    defaultValue: _,
-    onValueChange: w,
+    value: w,
+    defaultValue: S,
+    onValueChange: j,
     label: i,
-    alt: j,
-    helperText: m,
-    error: S,
-    accept: x,
-    maxSize: F,
-    onValidationError: G,
-    disabled: c = !1,
-    disableChange: K = !1,
-    disableRemove: N = !1,
+    alt: x,
+    helperText: c,
+    error: F,
+    accept: G,
+    maxSize: K,
+    onValidationError: N,
+    disabled: m = !1,
+    disableChange: O = !1,
+    disableRemove: T = !1,
     required: p = !1,
     clearable: v = !0,
-    isMobile: r = !1,
-    icon: O,
-    inputId: T,
-    name: $,
-    capture: H,
-    labels: U,
-    crop: V = !1,
-    cropAspectRatio: Y,
-    width: q,
+    isMobile: e = !1,
+    icon: $,
+    inputId: H,
+    name: U,
+    capture: V,
+    labels: W,
+    crop: Y = !1,
+    cropAspectRatio: q,
+    width: f,
     height: z,
-    aspectRatio: f,
-    shape: n = A.rounded,
+    aspectRatio: g,
+    shape: n = B.rounded,
     objectFit: J = "cover",
-    className: M,
-    style: Q,
-    ref: W,
-    "aria-label": g,
-    "aria-labelledby": X,
-    "aria-describedby": Z,
+    className: Q,
+    style: I,
+    ref: X,
+    "aria-label": h,
+    "aria-labelledby": Z,
+    "aria-describedby": M,
     "aria-invalid": ee,
     ...oe
   }) => {
-    const re = _e(), l = T ?? re, I = i ? `${l}-label` : void 0, h = `${l}-action`, C = `${l}-helper`, b = x ?? ye, {
+    const re = Se(), t = H ?? re, C = i ? `${t}-label` : void 0, D = `${t}-action`, b = `${t}-helper`, u = G ?? Ae, {
       inputRef: ae,
       previewUrl: ie,
-      resolvedLabels: e,
+      resolvedLabels: o,
       validationMessage: ne,
       hasValue: a,
-      isChangeDisabled: t,
-      isRemoveDisabled: D,
-      isDragging: le,
-      handleOpen: u,
-      handleInputChange: te,
+      isChangeDisabled: l,
+      isRemoveDisabled: P,
+      isDragging: te,
+      handleOpen: y,
+      handleInputChange: le,
       handleDragOver: se,
       handleDragLeave: de,
-      handleDrop: me,
-      handleClear: P,
-      pendingCropFile: k,
-      handleCropCancel: ce,
+      handleDrop: ce,
+      handleClear: k,
+      pendingCropFile: E,
+      handleCropCancel: me,
       handleCropConfirm: pe
-    } = Re({
-      value: B,
-      defaultValue: _,
-      onValueChange: w,
-      accept: b,
-      maxSize: F,
-      onValidationError: G,
-      disabled: c,
-      disableChange: K,
-      disableRemove: N,
-      isMobile: r,
-      labels: U,
-      crop: V
-    }), s = S ?? ne, d = !!s, ve = d ? !0 : ee, E = !!(s || m), y = a ? e.change : e.choose, fe = g ? void 0 : [X ?? I, h].filter(Boolean).join(" "), ge = [Z, E ? C : void 0].filter(Boolean).join(" ") || void 0, Ie = !r && a && v, he = Y ?? (n === A.circle ? 1 : Ae(f));
-    return /* @__PURE__ */ R(
+    } = Le({
+      value: w,
+      defaultValue: S,
+      onValueChange: j,
+      accept: u,
+      maxSize: K,
+      onValidationError: N,
+      disabled: m,
+      disableChange: O,
+      disableRemove: T,
+      isMobile: e,
+      labels: W,
+      crop: Y
+    }), s = F ?? ne, d = !!s, ve = d ? !0 : ee, R = !!(s || c), A = a ? o.change : o.choose, fe = h ? void 0 : [Z ?? C, D].filter(Boolean).join(" "), ge = [M, R ? b : void 0].filter(Boolean).join(" ") || void 0, Ie = !e && a && v, he = q ?? (n === B.circle ? 1 : Be(g)), Ce = e ? I : { width: f, ...I }, De = e ? { width: f } : void 0;
+    return /* @__PURE__ */ L(
       "div",
       {
-        ref: W,
-        className: Le(L.root, M),
-        style: { width: q, ...Q },
-        "data-mobile": r ? "true" : "false",
+        ref: X,
+        className: _e(_.root, Q),
+        style: Ce,
+        "data-mobile": e ? "true" : "false",
         ...oe,
         children: [
-          i && /* @__PURE__ */ o(
-            Ce,
+          i && /* @__PURE__ */ r(
+            be,
             {
-              id: I,
-              disabled: c,
+              id: C,
+              disabled: m,
               required: p,
               children: i
             }
           ),
-          /* @__PURE__ */ R("div", { className: L.wrapper, children: [
-            /* @__PURE__ */ o(
-              ke,
-              {
-                actionId: h,
-                actionLabel: y,
-                alt: j ?? i ?? e.selected,
-                ariaDescribedBy: ge,
-                ariaInvalid: ve,
-                ariaLabel: g,
-                ariaLabelledBy: fe,
-                aspectRatio: f,
-                disabled: t,
-                emptyLabel: e.empty,
-                hasError: d,
-                hasValue: a,
-                height: z,
-                icon: O,
-                isDragging: le,
-                isMobile: r,
-                objectFit: J,
-                onClick: u,
-                onDragLeave: de,
-                onDragOver: se,
-                onDrop: me,
-                previewUrl: ie,
-                shape: n
-              }
-            ),
-            Ie && /* @__PURE__ */ o(
-              Ee,
-              {
-                disabled: D,
-                label: e.remove,
-                onClick: P,
-                shape: n
-              }
-            ),
-            /* @__PURE__ */ o(
-              Pe,
-              {
-                accept: b,
-                capture: H,
-                disabled: t,
-                id: l,
-                inputRef: ae,
-                name: $,
-                required: p && !a,
-                onChange: te
-              }
-            )
-          ] }),
-          r && /* @__PURE__ */ o(
-            De,
+          /* @__PURE__ */ L(
+            "div",
+            {
+              className: _.wrapper,
+              style: De,
+              children: [
+                /* @__PURE__ */ r(
+                  Ee,
+                  {
+                    actionId: D,
+                    actionLabel: A,
+                    alt: x ?? i ?? o.selected,
+                    ariaDescribedBy: ge,
+                    ariaInvalid: ve,
+                    ariaLabel: h,
+                    ariaLabelledBy: fe,
+                    aspectRatio: g,
+                    disabled: l,
+                    emptyLabel: o.empty,
+                    hasError: d,
+                    hasValue: a,
+                    height: z,
+                    icon: $,
+                    isDragging: te,
+                    isMobile: e,
+                    objectFit: J,
+                    onClick: y,
+                    onDragLeave: de,
+                    onDragOver: se,
+                    onDrop: ce,
+                    previewUrl: ie,
+                    shape: n
+                  }
+                ),
+                Ie && /* @__PURE__ */ r(
+                  Re,
+                  {
+                    disabled: P,
+                    label: o.remove,
+                    onClick: k,
+                    shape: n
+                  }
+                ),
+                /* @__PURE__ */ r(
+                  ke,
+                  {
+                    accept: u,
+                    capture: V,
+                    disabled: l,
+                    id: t,
+                    inputRef: ae,
+                    name: U,
+                    required: p && !a,
+                    onChange: le
+                  }
+                )
+              ]
+            }
+          ),
+          e && /* @__PURE__ */ r(
+            Pe,
             {
-              actionLabel: y,
-              changeDisabled: t,
+              actionLabel: A,
+              changeDisabled: l,
               hasValue: a,
-              onChange: u,
-              onRemove: P,
-              removeDisabled: D,
-              removeLabel: e.remove,
+              onChange: y,
+              onRemove: k,
+              removeDisabled: P,
+              removeLabel: o.remove,
               showRemove: v
             }
           ),
-          E && /* @__PURE__ */ o(
-            be,
+          R && /* @__PURE__ */ r(
+            ue,
             {
-              id: C,
+              id: b,
               hasError: d,
-              children: s ?? m
+              children: s ?? c
             }
           ),
-          k && /* @__PURE__ */ o(
-            ue,
+          E && /* @__PURE__ */ r(
+            ye,
             {
-              file: k,
+              file: E,
               aspectRatio: he,
               shape: n,
-              labels: e,
-              onCancel: ce,
+              labels: o,
+              onCancel: me,
               onConfirm: pe
             }
           )
@@ -191,8 +198,8 @@ const we = Be(
     );
   }
 );
-we.displayName = "ImagePicker";
+je.displayName = "ImagePicker";
 export {
-  we as default
+  je as default
 };
 //# sourceMappingURL=ImagePicker.js.map

package/dist/components/forms/image-picker/ImagePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImagePicker.js","sources":["../../../../src/components/forms/image-picker/ImagePicker.tsx"],"sourcesContent":["import FormLabel from '@components/forms/_shared/components/form-label/FormLabel.tsx'\r\nimport HelperText from '@components/forms/_shared/components/helper-text/HelperText.tsx'\r\nimport {\r\n    ImagePickerActions,\r\n    ImagePickerCropDialog,\r\n    ImagePickerInput,\r\n    ImagePickerPreview,\r\n    ImagePickerRemoveButton,\r\n} from '@components/forms/image-picker/components'\r\nimport { IMAGE_PICKER_DEFAULT_ACCEPT } from '@components/forms/image-picker/constants/imagePickerDefaults.const.ts'\r\nimport { IMAGE_PICKER_SHAPES } from '@components/forms/image-picker/constants'\r\nimport { IMAGE_PICKER_STYLES } from '@components/forms/image-picker/styles/ImagePicker.css.ts'\r\nimport type { ImagePickerProps } from '@components/forms/image-picker/types/ImagePicker.props.ts'\r\nimport { useImagePicker } from '@components/forms/image-picker/hooks/useImagePicker.hook.ts'\r\nimport { resolveImagePickerAspectRatio } from '@components/forms/image-picker/utils/imagePicker.utils.ts'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { memo, useId } from 'react'\r\n\r\n/**\r\n * A controlled or uncontrolled single-image picker, designed first for\r\n * profile pictures. The preview is the button that opens the native chooser.\r\n * On desktop it accepts drag and drop, reveals a \"change\" hint on hover and\r\n * shows a corner remove button; with `isMobile` it renders explicit\r\n * touch-sized action buttons instead. Change and remove actions can be\r\n * disabled independently. Set `crop` to open a crop editor before a newly\r\n * selected image is committed.\r\n *\r\n * @example\r\n * ```tsx\r\n * import { useState } from 'react'\r\n * import { ImagePicker } from '@choco-vanille/ui'\r\n *\r\n * const ProfilePictureField = () => {\r\n *     const [value, setValue] = useState<File | string | null>(null)\r\n *\r\n *     return (\r\n *         <ImagePicker\r\n *             label=\"Profile picture\"\r\n *             name=\"profilePicture\"\r\n *             value={value}\r\n *             onValueChange={setValue}\r\n *             shape=\"circle\"\r\n *         />\r\n *     )\r\n * }\r\n * ```\r\n */\r\nconst ImagePicker = memo<ImagePickerProps>(\r\n    ({\r\n        value,\r\n        defaultValue,\r\n        onValueChange,\r\n        label,\r\n        alt,\r\n        helperText,\r\n        error,\r\n        accept: acceptProp,\r\n        maxSize,\r\n        onValidationError,\r\n        disabled = false,\r\n        disableChange = false,\r\n        disableRemove = false,\r\n        required = false,\r\n        clearable = true,\r\n        isMobile = false,\r\n        icon,\r\n        inputId,\r\n        name,\r\n        capture,\r\n        labels,\r\n        crop = false,\r\n        cropAspectRatio,\r\n        width,\r\n        height,\r\n        aspectRatio,\r\n        shape = IMAGE_PICKER_SHAPES.rounded,\r\n        objectFit = 'cover',\r\n        className,\r\n        style,\r\n        ref,\r\n        'aria-label': ariaLabel,\r\n        'aria-labelledby': ariaLabelledBy,\r\n        'aria-describedby': ariaDescribedBy,\r\n        'aria-invalid': ariaInvalid,\r\n        ...rootProps\r\n    }) => {\r\n        const generatedId = useId()\r\n        const resolvedInputId = inputId ?? generatedId\r\n        const labelId = label ? `${resolvedInputId}-label` : undefined\r\n        const actionId = `${resolvedInputId}-action`\r\n        const helperId = `${resolvedInputId}-helper`\r\n        const accept = acceptProp ?? IMAGE_PICKER_DEFAULT_ACCEPT\r\n        const {\r\n            inputRef,\r\n            previewUrl,\r\n            resolvedLabels,\r\n            validationMessage,\r\n            hasValue,\r\n            isChangeDisabled,\r\n            isRemoveDisabled,\r\n            isDragging,\r\n            handleOpen,\r\n            handleInputChange,\r\n            handleDragOver,\r\n            handleDragLeave,\r\n            handleDrop,\r\n            handleClear,\r\n            pendingCropFile,\r\n            handleCropCancel,\r\n            handleCropConfirm,\r\n        } = useImagePicker({\r\n            value,\r\n            defaultValue,\r\n            onValueChange,\r\n            accept,\r\n            maxSize,\r\n            onValidationError,\r\n            disabled,\r\n            disableChange,\r\n            disableRemove,\r\n            isMobile,\r\n            labels,\r\n            crop,\r\n        })\r\n        const displayedError = error ?? validationMessage\r\n        const hasError = Boolean(displayedError)\r\n        const buttonAriaInvalid = hasError ? true : ariaInvalid\r\n        const hasDescription = Boolean(displayedError || helperText)\r\n        const actionLabel = hasValue\r\n            ? resolvedLabels.change\r\n            : resolvedLabels.choose\r\n        // The picker button is named \"<label> <action>\", e.g. \"Profile picture Change image\".\r\n        const previewLabelledBy = ariaLabel\r\n            ? undefined\r\n            : [ariaLabelledBy ?? labelId, actionId].filter(Boolean).join(' ')\r\n        const describedBy =\r\n      [ariaDescribedBy, hasDescription ? helperId : undefined]\r\n          .filter(Boolean)\r\n          .join(' ') || undefined\r\n        const showDesktopRemove = !isMobile && hasValue && clearable\r\n        const resolvedCropAspectRatio = cropAspectRatio ?? (\r\n            shape === IMAGE_PICKER_SHAPES.circle\r\n                ? 1\r\n                : resolveImagePickerAspectRatio(aspectRatio)\r\n        )\r\n\r\n        return (\r\n            <div\r\n                ref={ref}\r\n                className={cn(IMAGE_PICKER_STYLES.root, className)}\r\n                style={{ width, ...style }}\r\n                data-mobile={isMobile ? 'true' : 'false'}\r\n                {...rootProps}\r\n            >\r\n                {label && (\r\n                    <FormLabel\r\n                        id={labelId}\r\n                        disabled={disabled}\r\n                        required={required}\r\n                    >\r\n                        {label}\r\n                    </FormLabel>\r\n                )}\r\n\r\n                <div className={IMAGE_PICKER_STYLES.wrapper}>\r\n                    <ImagePickerPreview\r\n                        actionId={actionId}\r\n                        actionLabel={actionLabel}\r\n                        alt={alt ?? label ?? resolvedLabels.selected}\r\n                        ariaDescribedBy={describedBy}\r\n                        ariaInvalid={buttonAriaInvalid}\r\n                        ariaLabel={ariaLabel}\r\n                        ariaLabelledBy={previewLabelledBy}\r\n                        aspectRatio={aspectRatio}\r\n                        disabled={isChangeDisabled}\r\n                        emptyLabel={resolvedLabels.empty}\r\n                        hasError={hasError}\r\n                        hasValue={hasValue}\r\n                        height={height}\r\n                        icon={icon}\r\n                        isDragging={isDragging}\r\n                        isMobile={isMobile}\r\n                        objectFit={objectFit}\r\n                        onClick={handleOpen}\r\n                        onDragLeave={handleDragLeave}\r\n                        onDragOver={handleDragOver}\r\n                        onDrop={handleDrop}\r\n                        previewUrl={previewUrl}\r\n                        shape={shape}\r\n                    />\r\n\r\n                    {showDesktopRemove && (\r\n                        <ImagePickerRemoveButton\r\n                            disabled={isRemoveDisabled}\r\n                            label={resolvedLabels.remove}\r\n                            onClick={handleClear}\r\n                            shape={shape}\r\n                        />\r\n                    )}\r\n\r\n                    <ImagePickerInput\r\n                        accept={accept}\r\n                        capture={capture}\r\n                        disabled={isChangeDisabled}\r\n                        id={resolvedInputId}\r\n                        inputRef={inputRef}\r\n                        name={name}\r\n                        required={required && !hasValue}\r\n                        onChange={handleInputChange}\r\n                    />\r\n                </div>\r\n\r\n                {isMobile && (\r\n                    <ImagePickerActions\r\n                        actionLabel={actionLabel}\r\n                        changeDisabled={isChangeDisabled}\r\n                        hasValue={hasValue}\r\n                        onChange={handleOpen}\r\n                        onRemove={handleClear}\r\n                        removeDisabled={isRemoveDisabled}\r\n                        removeLabel={resolvedLabels.remove}\r\n                        showRemove={clearable}\r\n                    />\r\n                )}\r\n\r\n                {hasDescription && (\r\n                    <HelperText\r\n                        id={helperId}\r\n                        hasError={hasError}\r\n                    >\r\n                        {displayedError ?? helperText}\r\n                    </HelperText>\r\n                )}\r\n\r\n                {pendingCropFile && (\r\n                    <ImagePickerCropDialog\r\n                        file={pendingCropFile}\r\n                        aspectRatio={resolvedCropAspectRatio}\r\n                        shape={shape}\r\n                        labels={resolvedLabels}\r\n                        onCancel={handleCropCancel}\r\n                        onConfirm={handleCropConfirm}\r\n                    />\r\n                )}\r\n            </div>\r\n        )\r\n    },\r\n)\r\n\r\nImagePicker.displayName = 'ImagePicker'\r\n\r\nexport default ImagePicker\r\n"],"names":["ImagePicker","memo","value","defaultValue","onValueChange","label","alt","helperText","error","acceptProp","maxSize","onValidationError","disabled","disableChange","disableRemove","required","clearable","isMobile","icon","inputId","name","capture","labels","crop","cropAspectRatio","width","height","aspectRatio","shape","IMAGE_PICKER_SHAPES","objectFit","className","style","ref","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaInvalid","rootProps","generatedId","useId","resolvedInputId","labelId","actionId","helperId","accept","IMAGE_PICKER_DEFAULT_ACCEPT","inputRef","previewUrl","resolvedLabels","validationMessage","hasValue","isChangeDisabled","isRemoveDisabled","isDragging","handleOpen","handleInputChange","handleDragOver","handleDragLeave","handleDrop","handleClear","pendingCropFile","handleCropCancel","handleCropConfirm","useImagePicker","displayedError","hasError","buttonAriaInvalid","hasDescription","actionLabel","previewLabelledBy","describedBy","showDesktopRemove","resolvedCropAspectRatio","resolveImagePickerAspectRatio","jsxs","cn","IMAGE_PICKER_STYLES","jsx","FormLabel","ImagePickerPreview","ImagePickerRemoveButton","ImagePickerInput","ImagePickerActions","HelperText","ImagePickerCropDialog"],"mappings":";;;;;;;;;;;;;;;AA+CA,MAAMA,KAAcC;AAAA,EAChB,CAAC;AAAA,IACG,OAAAC;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,OAAAC;AAAA,IACA,KAAAC;AAAA,IACA,YAAAC;AAAA,IACA,OAAAC;AAAA,IACA,QAAQC;AAAA,IACR,SAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,eAAAC,IAAgB;AAAA,IAChB,eAAAC,IAAgB;AAAA,IAChB,UAAAC,IAAW;AAAA,IACX,WAAAC,IAAY;AAAA,IACZ,UAAAC,IAAW;AAAA,IACX,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,QAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,iBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,QAAAC;AAAA,IACA,aAAAC;AAAA,IACA,OAAAC,IAAQC,EAAoB;AAAA,IAC5B,WAAAC,IAAY;AAAA,IACZ,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,KAAAC;AAAA,IACA,cAAcC;AAAA,IACd,mBAAmBC;AAAA,IACnB,oBAAoBC;AAAA,IACpB,gBAAgBC;AAAA,IAChB,GAAGC;AAAA,EAAA,MACD;AACF,UAAMC,KAAcC,GAAA,GACdC,IAAkBtB,KAAWoB,IAC7BG,IAAUrC,IAAQ,GAAGoC,CAAe,WAAW,QAC/CE,IAAW,GAAGF,CAAe,WAC7BG,IAAW,GAAGH,CAAe,WAC7BI,IAASpC,KAAcqC,IACvB;AAAA,MACF,UAAAC;AAAA,MACA,YAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,mBAAAC;AAAA,MACA,UAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,YAAAC;AAAA,MACA,YAAAC;AAAA,MACA,mBAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,iBAAAC;AAAA,MACA,YAAAC;AAAA,MACA,aAAAC;AAAA,MACA,iBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,mBAAAC;AAAA,IAAA,IACAC,GAAe;AAAA,MACf,OAAA9D;AAAA,MACA,cAAAC;AAAA,MACA,eAAAC;AAAA,MACA,QAAAyC;AAAA,MACA,SAAAnC;AAAA,MACA,mBAAAC;AAAA,MACA,UAAAC;AAAA,MACA,eAAAC;AAAA,MACA,eAAAC;AAAA,MACA,UAAAG;AAAA,MACA,QAAAK;AAAA,MACA,MAAAC;AAAA,IAAA,CACH,GACK0C,IAAiBzD,KAAS0C,IAC1BgB,IAAW,EAAQD,GACnBE,KAAoBD,IAAW,KAAO7B,IACtC+B,IAAiB,GAAQH,KAAkB1D,IAC3C8D,IAAclB,IACdF,EAAe,SACfA,EAAe,QAEfqB,KAAoBpC,IACpB,SACA,CAACC,KAAkBO,GAASC,CAAQ,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,GAC9D4B,KACR,CAACnC,GAAiBgC,IAAiBxB,IAAW,MAAS,EAClD,OAAO,OAAO,EACd,KAAK,GAAG,KAAK,QACV4B,KAAoB,CAACvD,KAAYkC,KAAYnC,GAC7CyD,KAA0BjD,MAC5BI,MAAUC,EAAoB,SACxB,IACA6C,GAA8B/C,CAAW;AAGnD,WACI,gBAAAgD;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAA1C;AAAA,QACA,WAAW2C,GAAGC,EAAoB,MAAM9C,CAAS;AAAA,QACjD,OAAO,EAAE,OAAAN,GAAO,GAAGO,EAAA;AAAA,QACnB,eAAaf,IAAW,SAAS;AAAA,QAChC,GAAGqB;AAAA,QAEH,UAAA;AAAA,UAAAjC,KACG,gBAAAyE;AAAA,YAACC;AAAA,YAAA;AAAA,cACG,IAAIrC;AAAA,cACJ,UAAA9B;AAAA,cACA,UAAAG;AAAA,cAEC,UAAAV;AAAA,YAAA;AAAA,UAAA;AAAA,UAIT,gBAAAsE,EAAC,OAAA,EAAI,WAAWE,EAAoB,SAChC,UAAA;AAAA,YAAA,gBAAAC;AAAA,cAACE;AAAA,cAAA;AAAA,gBACG,UAAArC;AAAA,gBACA,aAAA0B;AAAA,gBACA,KAAK/D,KAAOD,KAAS4C,EAAe;AAAA,gBACpC,iBAAiBsB;AAAA,gBACjB,aAAaJ;AAAA,gBACb,WAAAjC;AAAA,gBACA,gBAAgBoC;AAAA,gBAChB,aAAA3C;AAAA,gBACA,UAAUyB;AAAA,gBACV,YAAYH,EAAe;AAAA,gBAC3B,UAAAiB;AAAA,gBACA,UAAAf;AAAA,gBACA,QAAAzB;AAAA,gBACA,MAAAR;AAAA,gBACA,YAAAoC;AAAA,gBACA,UAAArC;AAAA,gBACA,WAAAa;AAAA,gBACA,SAASyB;AAAA,gBACT,aAAaG;AAAA,gBACb,YAAYD;AAAA,gBACZ,QAAQE;AAAA,gBACR,YAAAX;AAAA,gBACA,OAAApB;AAAA,cAAA;AAAA,YAAA;AAAA,YAGH4C,MACG,gBAAAM;AAAA,cAACG;AAAA,cAAA;AAAA,gBACG,UAAU5B;AAAA,gBACV,OAAOJ,EAAe;AAAA,gBACtB,SAASW;AAAA,gBACT,OAAAhC;AAAA,cAAA;AAAA,YAAA;AAAA,YAIR,gBAAAkD;AAAA,cAACI;AAAA,cAAA;AAAA,gBACG,QAAArC;AAAA,gBACA,SAAAxB;AAAA,gBACA,UAAU+B;AAAA,gBACV,IAAIX;AAAA,gBACJ,UAAAM;AAAA,gBACA,MAAA3B;AAAA,gBACA,UAAUL,KAAY,CAACoC;AAAA,gBACvB,UAAUK;AAAA,cAAA;AAAA,YAAA;AAAA,UACd,GACJ;AAAA,UAECvC,KACG,gBAAA6D;AAAA,YAACK;AAAA,YAAA;AAAA,cACG,aAAAd;AAAA,cACA,gBAAgBjB;AAAA,cAChB,UAAAD;AAAA,cACA,UAAUI;AAAA,cACV,UAAUK;AAAA,cACV,gBAAgBP;AAAA,cAChB,aAAaJ,EAAe;AAAA,cAC5B,YAAYjC;AAAA,YAAA;AAAA,UAAA;AAAA,UAInBoD,KACG,gBAAAU;AAAA,YAACM;AAAA,YAAA;AAAA,cACG,IAAIxC;AAAA,cACJ,UAAAsB;AAAA,cAEC,UAAAD,KAAkB1D;AAAA,YAAA;AAAA,UAAA;AAAA,UAI1BsD,KACG,gBAAAiB;AAAA,YAACO;AAAA,YAAA;AAAA,cACG,MAAMxB;AAAA,cACN,aAAaY;AAAA,cACb,OAAA7C;AAAA,cACA,QAAQqB;AAAA,cACR,UAAUa;AAAA,cACV,WAAWC;AAAA,YAAA;AAAA,UAAA;AAAA,QACf;AAAA,MAAA;AAAA,IAAA;AAAA,EAIhB;AACJ;AAEA/D,GAAY,cAAc;"}
+{"version":3,"file":"ImagePicker.js","sources":["../../../../src/components/forms/image-picker/ImagePicker.tsx"],"sourcesContent":["import FormLabel from '@components/forms/_shared/components/form-label/FormLabel.tsx'\r\nimport HelperText from '@components/forms/_shared/components/helper-text/HelperText.tsx'\r\nimport {\r\n    ImagePickerActions,\r\n    ImagePickerCropDialog,\r\n    ImagePickerInput,\r\n    ImagePickerPreview,\r\n    ImagePickerRemoveButton,\r\n} from '@components/forms/image-picker/components'\r\nimport { IMAGE_PICKER_DEFAULT_ACCEPT } from '@components/forms/image-picker/constants/imagePickerDefaults.const.ts'\r\nimport { IMAGE_PICKER_SHAPES } from '@components/forms/image-picker/constants'\r\nimport { IMAGE_PICKER_STYLES } from '@components/forms/image-picker/styles/ImagePicker.css.ts'\r\nimport type { ImagePickerProps } from '@components/forms/image-picker/types/ImagePicker.props.ts'\r\nimport { useImagePicker } from '@components/forms/image-picker/hooks/useImagePicker.hook.ts'\r\nimport { resolveImagePickerAspectRatio } from '@components/forms/image-picker/utils/imagePicker.utils.ts'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { memo, useId } from 'react'\r\n\r\n/**\r\n * A controlled or uncontrolled single-image picker, designed first for\r\n * profile pictures. The preview is the button that opens the native chooser.\r\n * On desktop it accepts drag and drop, reveals a \"change\" hint on hover and\r\n * shows a corner remove button; with `isMobile` it renders explicit\r\n * touch-sized action buttons instead. Change and remove actions can be\r\n * disabled independently. Set `crop` to open a crop editor before a newly\r\n * selected image is committed.\r\n *\r\n * @example\r\n * ```tsx\r\n * import { useState } from 'react'\r\n * import { ImagePicker } from '@choco-vanille/ui'\r\n *\r\n * const ProfilePictureField = () => {\r\n *     const [value, setValue] = useState<File | string | null>(null)\r\n *\r\n *     return (\r\n *         <ImagePicker\r\n *             label=\"Profile picture\"\r\n *             name=\"profilePicture\"\r\n *             value={value}\r\n *             onValueChange={setValue}\r\n *             shape=\"circle\"\r\n *         />\r\n *     )\r\n * }\r\n * ```\r\n */\r\nconst ImagePicker = memo<ImagePickerProps>(\r\n    ({\r\n        value,\r\n        defaultValue,\r\n        onValueChange,\r\n        label,\r\n        alt,\r\n        helperText,\r\n        error,\r\n        accept: acceptProp,\r\n        maxSize,\r\n        onValidationError,\r\n        disabled = false,\r\n        disableChange = false,\r\n        disableRemove = false,\r\n        required = false,\r\n        clearable = true,\r\n        isMobile = false,\r\n        icon,\r\n        inputId,\r\n        name,\r\n        capture,\r\n        labels,\r\n        crop = false,\r\n        cropAspectRatio,\r\n        width,\r\n        height,\r\n        aspectRatio,\r\n        shape = IMAGE_PICKER_SHAPES.rounded,\r\n        objectFit = 'cover',\r\n        className,\r\n        style,\r\n        ref,\r\n        'aria-label': ariaLabel,\r\n        'aria-labelledby': ariaLabelledBy,\r\n        'aria-describedby': ariaDescribedBy,\r\n        'aria-invalid': ariaInvalid,\r\n        ...rootProps\r\n    }) => {\r\n        const generatedId = useId()\r\n        const resolvedInputId = inputId ?? generatedId\r\n        const labelId = label ? `${resolvedInputId}-label` : undefined\r\n        const actionId = `${resolvedInputId}-action`\r\n        const helperId = `${resolvedInputId}-helper`\r\n        const accept = acceptProp ?? IMAGE_PICKER_DEFAULT_ACCEPT\r\n        const {\r\n            inputRef,\r\n            previewUrl,\r\n            resolvedLabels,\r\n            validationMessage,\r\n            hasValue,\r\n            isChangeDisabled,\r\n            isRemoveDisabled,\r\n            isDragging,\r\n            handleOpen,\r\n            handleInputChange,\r\n            handleDragOver,\r\n            handleDragLeave,\r\n            handleDrop,\r\n            handleClear,\r\n            pendingCropFile,\r\n            handleCropCancel,\r\n            handleCropConfirm,\r\n        } = useImagePicker({\r\n            value,\r\n            defaultValue,\r\n            onValueChange,\r\n            accept,\r\n            maxSize,\r\n            onValidationError,\r\n            disabled,\r\n            disableChange,\r\n            disableRemove,\r\n            isMobile,\r\n            labels,\r\n            crop,\r\n        })\r\n        const displayedError = error ?? validationMessage\r\n        const hasError = Boolean(displayedError)\r\n        const buttonAriaInvalid = hasError ? true : ariaInvalid\r\n        const hasDescription = Boolean(displayedError || helperText)\r\n        const actionLabel = hasValue\r\n            ? resolvedLabels.change\r\n            : resolvedLabels.choose\r\n        // The picker button is named \"<label> <action>\", e.g. \"Profile picture Change image\".\r\n        const previewLabelledBy = ariaLabel\r\n            ? undefined\r\n            : [ariaLabelledBy ?? labelId, actionId].filter(Boolean).join(' ')\r\n        const describedBy =\r\n      [ariaDescribedBy, hasDescription ? helperId : undefined]\r\n          .filter(Boolean)\r\n          .join(' ') || undefined\r\n        const showDesktopRemove = !isMobile && hasValue && clearable\r\n        const resolvedCropAspectRatio = cropAspectRatio ?? (\r\n            shape === IMAGE_PICKER_SHAPES.circle\r\n                ? 1\r\n                : resolveImagePickerAspectRatio(aspectRatio)\r\n        )\r\n        const rootStyle = isMobile\r\n            ? style\r\n            : { width, ...style }\r\n        const previewWrapperStyle = isMobile ? { width } : undefined\r\n\r\n        return (\r\n            <div\r\n                ref={ref}\r\n                className={cn(IMAGE_PICKER_STYLES.root, className)}\r\n                style={rootStyle}\r\n                data-mobile={isMobile ? 'true' : 'false'}\r\n                {...rootProps}\r\n            >\r\n                {label && (\r\n                    <FormLabel\r\n                        id={labelId}\r\n                        disabled={disabled}\r\n                        required={required}\r\n                    >\r\n                        {label}\r\n                    </FormLabel>\r\n                )}\r\n\r\n                <div\r\n                    className={IMAGE_PICKER_STYLES.wrapper}\r\n                    style={previewWrapperStyle}\r\n                >\r\n                    <ImagePickerPreview\r\n                        actionId={actionId}\r\n                        actionLabel={actionLabel}\r\n                        alt={alt ?? label ?? resolvedLabels.selected}\r\n                        ariaDescribedBy={describedBy}\r\n                        ariaInvalid={buttonAriaInvalid}\r\n                        ariaLabel={ariaLabel}\r\n                        ariaLabelledBy={previewLabelledBy}\r\n                        aspectRatio={aspectRatio}\r\n                        disabled={isChangeDisabled}\r\n                        emptyLabel={resolvedLabels.empty}\r\n                        hasError={hasError}\r\n                        hasValue={hasValue}\r\n                        height={height}\r\n                        icon={icon}\r\n                        isDragging={isDragging}\r\n                        isMobile={isMobile}\r\n                        objectFit={objectFit}\r\n                        onClick={handleOpen}\r\n                        onDragLeave={handleDragLeave}\r\n                        onDragOver={handleDragOver}\r\n                        onDrop={handleDrop}\r\n                        previewUrl={previewUrl}\r\n                        shape={shape}\r\n                    />\r\n\r\n                    {showDesktopRemove && (\r\n                        <ImagePickerRemoveButton\r\n                            disabled={isRemoveDisabled}\r\n                            label={resolvedLabels.remove}\r\n                            onClick={handleClear}\r\n                            shape={shape}\r\n                        />\r\n                    )}\r\n\r\n                    <ImagePickerInput\r\n                        accept={accept}\r\n                        capture={capture}\r\n                        disabled={isChangeDisabled}\r\n                        id={resolvedInputId}\r\n                        inputRef={inputRef}\r\n                        name={name}\r\n                        required={required && !hasValue}\r\n                        onChange={handleInputChange}\r\n                    />\r\n                </div>\r\n\r\n                {isMobile && (\r\n                    <ImagePickerActions\r\n                        actionLabel={actionLabel}\r\n                        changeDisabled={isChangeDisabled}\r\n                        hasValue={hasValue}\r\n                        onChange={handleOpen}\r\n                        onRemove={handleClear}\r\n                        removeDisabled={isRemoveDisabled}\r\n                        removeLabel={resolvedLabels.remove}\r\n                        showRemove={clearable}\r\n                    />\r\n                )}\r\n\r\n                {hasDescription && (\r\n                    <HelperText\r\n                        id={helperId}\r\n                        hasError={hasError}\r\n                    >\r\n                        {displayedError ?? helperText}\r\n                    </HelperText>\r\n                )}\r\n\r\n                {pendingCropFile && (\r\n                    <ImagePickerCropDialog\r\n                        file={pendingCropFile}\r\n                        aspectRatio={resolvedCropAspectRatio}\r\n                        shape={shape}\r\n                        labels={resolvedLabels}\r\n                        onCancel={handleCropCancel}\r\n                        onConfirm={handleCropConfirm}\r\n                    />\r\n                )}\r\n            </div>\r\n        )\r\n    },\r\n)\r\n\r\nImagePicker.displayName = 'ImagePicker'\r\n\r\nexport default ImagePicker\r\n"],"names":["ImagePicker","memo","value","defaultValue","onValueChange","label","alt","helperText","error","acceptProp","maxSize","onValidationError","disabled","disableChange","disableRemove","required","clearable","isMobile","icon","inputId","name","capture","labels","crop","cropAspectRatio","width","height","aspectRatio","shape","IMAGE_PICKER_SHAPES","objectFit","className","style","ref","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaInvalid","rootProps","generatedId","useId","resolvedInputId","labelId","actionId","helperId","accept","IMAGE_PICKER_DEFAULT_ACCEPT","inputRef","previewUrl","resolvedLabels","validationMessage","hasValue","isChangeDisabled","isRemoveDisabled","isDragging","handleOpen","handleInputChange","handleDragOver","handleDragLeave","handleDrop","handleClear","pendingCropFile","handleCropCancel","handleCropConfirm","useImagePicker","displayedError","hasError","buttonAriaInvalid","hasDescription","actionLabel","previewLabelledBy","describedBy","showDesktopRemove","resolvedCropAspectRatio","resolveImagePickerAspectRatio","rootStyle","previewWrapperStyle","jsxs","cn","IMAGE_PICKER_STYLES","jsx","FormLabel","ImagePickerPreview","ImagePickerRemoveButton","ImagePickerInput","ImagePickerActions","HelperText","ImagePickerCropDialog"],"mappings":"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"}

package/dist/components/forms/image-picker/components/image-picker-crop-dialog/ImagePickerCropDialog.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../ui-kit89.css');require('../../../../../ui-kit46.css');require('../../../../../ui-kit43.css');require('../../../../../ui-kit14.css');require('../../../../../ui-kit5.css');require('../../../../../ui-kit7.css');require('../../../../../ui-kit6.css');require('../../../../../ui-kit8.css');require('../../../../../ui-kit9.css');require('../../../../../ui-kit13.css');require('../../../../../ui-kit11.css');require('../../../../../ui-kit10.css');require('../../../../../ui-kit12.css');require('../../../../../ui-kit4.css');require('../../../../../ui-kit3.css');require('../../../../../ui-kit50.css');require('../../../../../ui-kit.css');const e=require("react/jsx-runtime"),Z=require("react-easy-crop"),t=require("react"),g=require("../../../../actions/button/Button.cjs");require("../../../../actions/button/styles/Button.css.cjs");const v=require("../../../slider/Slider.cjs");;/* empty css                                                 */;/* empty css                                                 */const z=require("../../../_shared/components/helper-text/HelperText.cjs"),G=require("../../../../layout/box/Box.cjs");require("../../../../layout/box/styles/Box.css.cjs");const L=require("../../../../layout/flex/Flex.cjs");require("../../../../layout/flex/styles/Flex.css.cjs");const q=require("./styles/ImagePickerCropDialog.css.cjs"),O=require("../../hooks/useImagePickerCrop.hook.cjs"),o=require("../../../../overlay/dialog/Dialog.cjs");;/* empty css                                                                   */;/* empty css                                                                    */;/* empty css                                                                            */;/* empty css                                                                         */;/* empty css                                                                          */;/* empty css                                                                       */;/* empty css                                                                        */;/* empty css                                                                          */;/* empty css                                                                           */;/* empty css                                                                         */;/* empty css                                                                          */;/* empty css                                                                          */;/* empty css                                                                      */;/* empty css                                                            */;/* empty css                                                                                           */const C=require("../../constants/imagePickerShapes.const.cjs"),h=t.memo(({file:x,aspectRatio:i,shape:c,labels:r,onCancel:P,onConfirm:I})=>{const l=t.useId(),u=t.useId(),{imageUrl:d,crop:E,setCrop:S,zoom:p,setZoom:m,croppedAreaPixels:j,handleCropComplete:_,handleMediaLoaded:A,handleMediaError:D,isProcessing:a,cropError:s,handleConfirm:b}=O.useImagePickerCrop({file:x,cropErrorLabel:r.cropError,onConfirm:I}),y=n=>{!n&&!a&&P()},k=typeof i=="number"&&Number.isFinite(i)&&i>0?i:4/3,f=c===C.IMAGE_PICKER_SHAPES.circle?"round":"rect",M=c===C.IMAGE_PICKER_SHAPES.rounded?q.IMAGE_PICKER_CROP_DIALOG_STYLES.roundedCropArea:void 0;return e.jsx(o.Dialog,{open:!0,onOpenChange:y,children:e.jsxs(o.Dialog.Content,{size:"lg","aria-labelledby":l,"aria-describedby":s?u:void 0,children:[e.jsx(o.Dialog.Header,{title:r.crop,titleProps:{id:l},showCloseButton:!1}),e.jsx(o.Dialog.Body,{padding:"lg",children:e.jsxs(L,{flexDirection:"column",gap:"md",children:[e.jsx(G,{className:q.IMAGE_PICKER_CROP_DIALOG_STYLES.viewport,children:d&&e.jsx(Z,{image:d,crop:E,zoom:p,aspect:k,minZoom:1,maxZoom:3,zoomSpeed:.1,cropShape:f,showGrid:!0,roundCropAreaPixels:!0,onCropChange:S,onZoomChange:m,onCropComplete:_,onMediaLoaded:A,mediaProps:{onError:D},cropperProps:{role:"group","aria-label":r.cropArea},classes:{cropAreaClassName:M}})}),e.jsx(v.Slider,{label:r.zoom,value:p,min:1,max:3,step:.1,showValue:!0,onValueChange:n=>{typeof n=="number"&&m(n)}}),s&&e.jsx(z,{id:u,hasError:!0,children:s})]})}),e.jsxs(o.Dialog.Footer,{children:[e.jsx(o.Dialog.Close,{children:e.jsx(g,{type:"button",label:r.cancel,variant:"outlined",color:"primary",disabled:a})}),e.jsx(g,{type:"button",label:r.apply,variant:"contained",color:"primary",disabled:!j||a,onClick:b})]})]})})});h.displayName="ImagePicker.CropDialog";exports.ImagePickerCropDialog=h;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../ui-kit99.css');require('../../../../../ui-kit66.css');require('../../../../../ui-kit65.css');require('../../../../../ui-kit8.css');require('../../../../../ui-kit14.css');require('../../../../../ui-kit3.css');require('../../../../../ui-kit10.css');require('../../../../../ui-kit9.css');require('../../../../../ui-kit12.css');require('../../../../../ui-kit11.css');require('../../../../../ui-kit13.css');require('../../../../../ui-kit7.css');require('../../../../../ui-kit5.css');require('../../../../../ui-kit6.css');require('../../../../../ui-kit4.css');require('../../../../../ui-kit74.css');require('../../../../../ui-kit.css');const e=require("react/jsx-runtime"),Z=require("react-easy-crop"),t=require("react"),g=require("../../../../actions/button/Button.cjs");require("../../../../actions/button/styles/Button.css.cjs");const v=require("../../../slider/Slider.cjs");;/* empty css                                                 */;/* empty css                                                 */const z=require("../../../_shared/components/helper-text/HelperText.cjs"),G=require("../../../../layout/box/Box.cjs");require("../../../../layout/box/styles/Box.css.cjs");const L=require("../../../../layout/flex/Flex.cjs");require("../../../../layout/flex/styles/Flex.css.cjs");const q=require("./styles/ImagePickerCropDialog.css.cjs"),O=require("../../hooks/useImagePickerCrop.hook.cjs"),o=require("../../../../overlay/dialog/Dialog.cjs");;/* empty css                                                                   */;/* empty css                                                                    */;/* empty css                                                                            */;/* empty css                                                                         */;/* empty css                                                                          */;/* empty css                                                                       */;/* empty css                                                                        */;/* empty css                                                                          */;/* empty css                                                                           */;/* empty css                                                                         */;/* empty css                                                                          */;/* empty css                                                                          */;/* empty css                                                                      */;/* empty css                                                            */;/* empty css                                                                                           */const C=require("../../constants/imagePickerShapes.const.cjs"),h=t.memo(({file:x,aspectRatio:i,shape:c,labels:r,onCancel:P,onConfirm:I})=>{const l=t.useId(),u=t.useId(),{imageUrl:d,crop:E,setCrop:S,zoom:p,setZoom:m,croppedAreaPixels:j,handleCropComplete:_,handleMediaLoaded:A,handleMediaError:D,isProcessing:a,cropError:s,handleConfirm:b}=O.useImagePickerCrop({file:x,cropErrorLabel:r.cropError,onConfirm:I}),y=n=>{!n&&!a&&P()},k=typeof i=="number"&&Number.isFinite(i)&&i>0?i:4/3,f=c===C.IMAGE_PICKER_SHAPES.circle?"round":"rect",M=c===C.IMAGE_PICKER_SHAPES.rounded?q.IMAGE_PICKER_CROP_DIALOG_STYLES.roundedCropArea:void 0;return e.jsx(o.Dialog,{open:!0,onOpenChange:y,children:e.jsxs(o.Dialog.Content,{size:"lg","aria-labelledby":l,"aria-describedby":s?u:void 0,children:[e.jsx(o.Dialog.Header,{title:r.crop,titleProps:{id:l},showCloseButton:!1}),e.jsx(o.Dialog.Body,{padding:"lg",children:e.jsxs(L,{flexDirection:"column",gap:"md",children:[e.jsx(G,{className:q.IMAGE_PICKER_CROP_DIALOG_STYLES.viewport,children:d&&e.jsx(Z,{image:d,crop:E,zoom:p,aspect:k,minZoom:1,maxZoom:3,zoomSpeed:.1,cropShape:f,showGrid:!0,roundCropAreaPixels:!0,onCropChange:S,onZoomChange:m,onCropComplete:_,onMediaLoaded:A,mediaProps:{onError:D},cropperProps:{role:"group","aria-label":r.cropArea},classes:{cropAreaClassName:M}})}),e.jsx(v.Slider,{label:r.zoom,value:p,min:1,max:3,step:.1,showValue:!0,onValueChange:n=>{typeof n=="number"&&m(n)}}),s&&e.jsx(z,{id:u,hasError:!0,children:s})]})}),e.jsxs(o.Dialog.Footer,{children:[e.jsx(o.Dialog.Close,{children:e.jsx(g,{type:"button",label:r.cancel,variant:"outlined",color:"primary",disabled:a})}),e.jsx(g,{type:"button",label:r.apply,variant:"contained",color:"primary",disabled:!j||a,onClick:b})]})]})})});h.displayName="ImagePicker.CropDialog";exports.ImagePickerCropDialog=h;
 //# sourceMappingURL=ImagePickerCropDialog.cjs.map

package/dist/components/forms/image-picker/components/image-picker-crop-dialog/ImagePickerCropDialog.js

@@ -4,7 +4,7 @@ import { memo as k, useId as u } from "react";
 import h from "../../../../actions/button/Button.js";
 import "../../../../actions/button/styles/Button.css.js";
 import { Slider as w } from "../../../slider/Slider.js";
-import '../../../../../ui-kit89.css';import '../../../../../ui-kit46.css';import '../../../../../ui-kit43.css';import '../../../../../ui-kit14.css';import '../../../../../ui-kit5.css';import '../../../../../ui-kit7.css';import '../../../../../ui-kit6.css';import '../../../../../ui-kit8.css';import '../../../../../ui-kit9.css';import '../../../../../ui-kit13.css';import '../../../../../ui-kit11.css';import '../../../../../ui-kit10.css';import '../../../../../ui-kit12.css';import '../../../../../ui-kit4.css';import '../../../../../ui-kit3.css';import '../../../../../ui-kit50.css';import '../../../../../ui-kit.css';/* empty css                                               */
+import '../../../../../ui-kit99.css';import '../../../../../ui-kit66.css';import '../../../../../ui-kit65.css';import '../../../../../ui-kit8.css';import '../../../../../ui-kit14.css';import '../../../../../ui-kit3.css';import '../../../../../ui-kit10.css';import '../../../../../ui-kit9.css';import '../../../../../ui-kit12.css';import '../../../../../ui-kit11.css';import '../../../../../ui-kit13.css';import '../../../../../ui-kit7.css';import '../../../../../ui-kit5.css';import '../../../../../ui-kit6.css';import '../../../../../ui-kit4.css';import '../../../../../ui-kit74.css';import '../../../../../ui-kit.css';/* empty css                                               */
 /* empty css                                               */
 import B from "../../../_shared/components/helper-text/HelperText.js";
 import G from "../../../../layout/box/Box.js";

package/dist/components/forms/image-picker/components/image-picker-crop-dialog/styles/ImagePickerCropDialog.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit162.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                           */var e={viewport:"_1ntw4980",roundedCropArea:"_1ntw4981"};exports.IMAGE_PICKER_CROP_DIALOG_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit168.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                           */var e={viewport:"_1ntw4980",roundedCropArea:"_1ntw4981"};exports.IMAGE_PICKER_CROP_DIALOG_STYLES=e;
 //# sourceMappingURL=ImagePickerCropDialog.css.cjs.map

package/dist/components/forms/image-picker/components/image-picker-crop-dialog/styles/ImagePickerCropDialog.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit162.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit168.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                                         */
 var t = { viewport: "_1ntw4980", roundedCropArea: "_1ntw4981" };
 export {

package/dist/components/forms/image-picker/styles/ImagePicker.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit55.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                                 */const e=require("@vanilla-extract/recipes/createRuntimeFn");var a={root:"_8x2wlj1",wrapper:"_8x2wlj2",preview:e.createRuntimeFn({defaultClassName:"_8x2wlj3",variantClassNames:{shape:{square:"_8x2wlj4",rounded:"_8x2wlj5",circle:"_8x2wlj6"}},defaultVariants:{shape:"rounded"},compoundVariants:[]}),empty:"_8x2wlj7",emptyIcon:"_8x2wlj8",emptyText:"_8x2wlj9",image:"_8x2wlja",scrim:"_8x2wljb",scrimText:"_8x2wljc",removeButton:e.createRuntimeFn({defaultClassName:"_8x2wljd",variantClassNames:{shape:{square:"_8x2wlje",rounded:"_8x2wljf",circle:"_8x2wljg"}},defaultVariants:{shape:"rounded"},compoundVariants:[]}),actions:"_8x2wljh",visuallyHidden:"_8x2wlji",input:"_8x2wljj"};exports.IMAGE_PICKER_STYLES=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit87.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                                 */const e=require("@vanilla-extract/recipes/createRuntimeFn");var a={root:"_8x2wlj1",wrapper:"_8x2wlj2",preview:e.createRuntimeFn({defaultClassName:"_8x2wlj3",variantClassNames:{shape:{square:"_8x2wlj4",rounded:"_8x2wlj5",circle:"_8x2wlj6"}},defaultVariants:{shape:"rounded"},compoundVariants:[]}),empty:"_8x2wlj7",emptyIcon:"_8x2wlj8",emptyText:"_8x2wlj9",image:"_8x2wlja",scrim:"_8x2wljb",scrimText:"_8x2wljc",removeButton:e.createRuntimeFn({defaultClassName:"_8x2wljd",variantClassNames:{shape:{square:"_8x2wlje",rounded:"_8x2wljf",circle:"_8x2wljg"}},defaultVariants:{shape:"rounded"},compoundVariants:[]}),actions:"_8x2wljh",visuallyHidden:"_8x2wlji",input:"_8x2wljj"};exports.IMAGE_PICKER_STYLES=a;
 //# sourceMappingURL=ImagePicker.css.cjs.map

package/dist/components/forms/image-picker/styles/ImagePicker.css.d.ts

@@ -37,7 +37,6 @@ export declare const IMAGE_PICKER_STYLES: {
                 top: "7%";
                 right: "7%";
                 transform: "translate(35%, -35%)";
-                borderRadius: `var(--${string})`;
             };
         };
     }>;

package/dist/components/forms/image-picker/styles/ImagePicker.css.js

@@ -1,4 +1,4 @@
-import '../../../../ui-kit55.css';import '../../../../ui-kit.css';/* empty css                                            */
+import '../../../../ui-kit87.css';import '../../../../ui-kit.css';/* empty css                                            */
 /* empty css                               */
 import { createRuntimeFn as a } from "@vanilla-extract/recipes/createRuntimeFn";
 var t = { root: "_8x2wlj1", wrapper: "_8x2wlj2", preview: a({ defaultClassName: "_8x2wlj3", variantClassNames: { shape: { square: "_8x2wlj4", rounded: "_8x2wlj5", circle: "_8x2wlj6" } }, defaultVariants: { shape: "rounded" }, compoundVariants: [] }), empty: "_8x2wlj7", emptyIcon: "_8x2wlj8", emptyText: "_8x2wlj9", image: "_8x2wlja", scrim: "_8x2wljb", scrimText: "_8x2wljc", removeButton: a({ defaultClassName: "_8x2wljd", variantClassNames: { shape: { square: "_8x2wlje", rounded: "_8x2wljf", circle: "_8x2wljg" } }, defaultVariants: { shape: "rounded" }, compoundVariants: [] }), actions: "_8x2wljh", visuallyHidden: "_8x2wlji", input: "_8x2wljj" };

package/dist/components/forms/image-picker/types/ImagePicker.props.d.ts

@@ -68,7 +68,10 @@ export type ImagePickerProps = Omit<HTMLAttributes<HTMLDivElement>, 'children' |
      * provided, or `4 / 3`.
      */
     cropAspectRatio?: number;
-    /** CSS width of the picker wrapper. @default '100%' */
+    /**
+     * CSS width of the picker preview. On mobile, action buttons use the
+     * available width of the parent container. @default '100%'
+     */
     width?: CSSProperties['width'];
     /** CSS height of the preview surface. Ignored when `shape` is `circle`. */
     height?: CSSProperties['height'];

package/dist/components/forms/number-field/components/number-field-input/styles/NumberFieldInput.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit128.css');;/* empty css                                      */var e={group:"c0w2cl0"};exports.NUMBER_FIELD_INPUT_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit146.css');;/* empty css                                      */var e={group:"c0w2cl0"};exports.NUMBER_FIELD_INPUT_STYLES=e;
 //# sourceMappingURL=NumberFieldInput.css.cjs.map

package/dist/components/forms/number-field/components/number-field-input/styles/NumberFieldInput.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit128.css';/* empty css                                    */
+import '../../../../../../ui-kit146.css';/* empty css                                    */
 var o = { group: "c0w2cl0" };
 export {
   o as NUMBER_FIELD_INPUT_STYLES

package/dist/components/forms/number-field/components/number-field-steppers/styles/NumberFieldSteppers.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit151.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                         */var e={group:"_1sbt75z0",button:"_1sbt75z1",icon:"_1sbt75z2"};exports.NUMBER_FIELD_STEPPERS_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit167.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                         */var e={group:"_1sbt75z0",button:"_1sbt75z1",icon:"_1sbt75z2"};exports.NUMBER_FIELD_STEPPERS_STYLES=e;
 //# sourceMappingURL=NumberFieldSteppers.css.cjs.map

package/dist/components/forms/number-field/components/number-field-steppers/styles/NumberFieldSteppers.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit151.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit167.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                                       */
 var _ = { group: "_1sbt75z0", button: "_1sbt75z1", icon: "_1sbt75z2" };
 export {

package/dist/components/forms/number-field/styles/NumberField.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit41.css');;/* empty css                                 */var e={root:"_1g01svz0"};exports.NUMBER_FIELD_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit79.css');;/* empty css                                 */var e={root:"_1g01svz0"};exports.NUMBER_FIELD_STYLES=e;
 //# sourceMappingURL=NumberField.css.cjs.map

package/dist/components/forms/number-field/styles/NumberField.css.js

@@ -1,4 +1,4 @@
-import '../../../../ui-kit41.css';/* empty css                               */
+import '../../../../ui-kit79.css';/* empty css                               */
 var r = { root: "_1g01svz0" };
 export {
   r as NUMBER_FIELD_STYLES

package/dist/components/forms/radio-group/components/radio-item/styles/RadioItem.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit103.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                               */var e={root:"_57s3sx0",indicator:"_57s3sx1",label:"_57s3sx2"};exports.RADIO_ITEM_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit102.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                               */var e={root:"_57s3sx0",indicator:"_57s3sx1",label:"_57s3sx2"};exports.RADIO_ITEM_STYLES=e;
 //# sourceMappingURL=RadioItem.css.cjs.map

package/dist/components/forms/radio-group/components/radio-item/styles/RadioItem.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit103.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit102.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                             */
 var s = { root: "_57s3sx0", indicator: "_57s3sx1", label: "_57s3sx2" };
 export {

package/dist/components/forms/rich-text-editor/RichTextEditor.cjs

@@ -1,2 +1,2 @@
-"use strict";require('../../../ui-kit83.css');require('../../../ui-kit15.css');require('../../../ui-kit2.css');require('../../../ui-kit.css');const G=require("react/jsx-runtime"),t=require("react"),k=require("./components/alignment-group/AlignmentGroup.cjs"),y=require("./components/block-format-group/BlockFormatGroup.cjs"),U=require("./components/editor-field/EditorField.cjs"),A=require("./components/helper-text/HelperText.cjs"),F=require("./components/history-group/HistoryGroup.cjs"),H=require("./components/history-group/Undo.cjs"),D=require("./components/history-group/Redo.cjs"),g=require("./components/image-group/ImageGroup.cjs"),C=require("./components/link-group/LinkGroup.cjs"),O=require("./components/link-group/SetLink.cjs"),f=require("./components/link-group/UnsetLink.cjs"),v=require("./components/lists-group/ListsGroup.cjs"),B=require("./components/rich-text-editor-label/RichTextEditorLabel.cjs");;/* empty css                                           */;/* empty css                                               */;/* empty css                                                                 */;/* empty css                                                                     */const N=require("./components/read-only-field/ReadOnlyField.cjs"),j=require("./components/text-appearance-group/TextAppearanceGroup.cjs"),X=require("./components/text-style-group/TextStyleGroup.cjs"),r=require("./components/text-style-group/TextStyleAction.cjs"),M=require("./components/toolbar/Toolbar.cjs"),P=require("./components/toolbar-groups/ToolbarGroups.cjs"),Y=require("./components/toolbar-group/ToolbarGroup.cjs"),J=require("./components/toolbar-separator/ToolbarSeparator.cjs"),V=require("./context/RichTextEditor.context.cjs"),z=require("../../../utils/cn.cjs"),K=require("./constants/richTextEmptyDocument.const.cjs"),Q=require("./constants/richTextEditorDefaultLabels.const.cjs"),W=require("./styles/RichTextEditor.css.cjs"),Z=require("./hooks/useRichTextEditor.hook.cjs"),e=t.memo(({value:i,defaultValue:n,onValueChange:R,onImageUpload:_,label:s,helperText:c,error:u,placeholder:m,disabled:l=!1,readOnly:T=!1,required:a=!1,width:d,className:I,name:L,labels:S,"aria-label":q,"aria-labelledby":p,children:b})=>{const x=t.useId(),E=t.useId(),o=Z.useRichTextEditor({value:i,defaultValue:n,onValueChange:R,disabled:l,readOnly:T,required:a,label:s,placeholder:m,error:u,helperText:c,labelId:x,helperId:E,ariaLabel:q,ariaLabelledBy:p}),h={editor:o,disabled:l,readOnly:T,onImageUpload:_,label:s,helperText:c,error:u,ariaLabel:q,ariaLabelledBy:p,labelId:x,helperId:E,name:L,required:a,renderedValue:o?.getJSON()??i??n??K.EMPTY_RICH_TEXT_DOCUMENT,labels:{...Q.RICH_TEXT_EDITOR_DEFAULT_LABELS,...S}};return o?G.jsx(V.RichTextEditorContext.Provider,{value:h,children:G.jsx("div",{className:z.cn(W.RICH_TEXT_EDITOR_STYLES.root,I),style:d!==void 0?{width:d}:void 0,children:b})}):null});e.displayName="RichTextEditor";e.Label=B;e.EditorField=U;e.ReadOnlyField=N;e.HelperText=A;e.Toolbar=M;e.ToolbarGroups=P;e.ToolbarGroup=Y;e.ToolbarSeparator=J;e.HistoryGroup=F;e.Undo=H;e.Redo=D;e.TextStyleGroup=X;e.Bold=r.Bold;e.Italic=r.Italic;e.Underline=r.Underline;e.Strike=r.Strike;e.TextAppearanceGroup=j;e.LinkGroup=C;e.SetLink=O;e.UnsetLink=f;e.BlockFormatGroup=y;e.ListsGroup=v;e.AlignmentGroup=k;e.ImageGroup=g;module.exports=e;
+"use strict";require('../../../ui-kit81.css');require('../../../ui-kit64.css');require('../../../ui-kit2.css');require('../../../ui-kit.css');const G=require("react/jsx-runtime"),t=require("react"),k=require("./components/alignment-group/AlignmentGroup.cjs"),y=require("./components/block-format-group/BlockFormatGroup.cjs"),U=require("./components/editor-field/EditorField.cjs"),A=require("./components/helper-text/HelperText.cjs"),F=require("./components/history-group/HistoryGroup.cjs"),H=require("./components/history-group/Undo.cjs"),D=require("./components/history-group/Redo.cjs"),g=require("./components/image-group/ImageGroup.cjs"),C=require("./components/link-group/LinkGroup.cjs"),O=require("./components/link-group/SetLink.cjs"),f=require("./components/link-group/UnsetLink.cjs"),v=require("./components/lists-group/ListsGroup.cjs"),B=require("./components/rich-text-editor-label/RichTextEditorLabel.cjs");;/* empty css                                           */;/* empty css                                               */;/* empty css                                                                 */;/* empty css                                                                     */const N=require("./components/read-only-field/ReadOnlyField.cjs"),j=require("./components/text-appearance-group/TextAppearanceGroup.cjs"),X=require("./components/text-style-group/TextStyleGroup.cjs"),r=require("./components/text-style-group/TextStyleAction.cjs"),M=require("./components/toolbar/Toolbar.cjs"),P=require("./components/toolbar-groups/ToolbarGroups.cjs"),Y=require("./components/toolbar-group/ToolbarGroup.cjs"),J=require("./components/toolbar-separator/ToolbarSeparator.cjs"),V=require("./context/RichTextEditor.context.cjs"),z=require("../../../utils/cn.cjs"),K=require("./constants/richTextEmptyDocument.const.cjs"),Q=require("./constants/richTextEditorDefaultLabels.const.cjs"),W=require("./styles/RichTextEditor.css.cjs"),Z=require("./hooks/useRichTextEditor.hook.cjs"),e=t.memo(({value:i,defaultValue:n,onValueChange:R,onImageUpload:_,label:s,helperText:c,error:u,placeholder:m,disabled:l=!1,readOnly:T=!1,required:a=!1,width:d,className:I,name:L,labels:S,"aria-label":q,"aria-labelledby":p,children:b})=>{const x=t.useId(),E=t.useId(),o=Z.useRichTextEditor({value:i,defaultValue:n,onValueChange:R,disabled:l,readOnly:T,required:a,label:s,placeholder:m,error:u,helperText:c,labelId:x,helperId:E,ariaLabel:q,ariaLabelledBy:p}),h={editor:o,disabled:l,readOnly:T,onImageUpload:_,label:s,helperText:c,error:u,ariaLabel:q,ariaLabelledBy:p,labelId:x,helperId:E,name:L,required:a,renderedValue:o?.getJSON()??i??n??K.EMPTY_RICH_TEXT_DOCUMENT,labels:{...Q.RICH_TEXT_EDITOR_DEFAULT_LABELS,...S}};return o?G.jsx(V.RichTextEditorContext.Provider,{value:h,children:G.jsx("div",{className:z.cn(W.RICH_TEXT_EDITOR_STYLES.root,I),style:d!==void 0?{width:d}:void 0,children:b})}):null});e.displayName="RichTextEditor";e.Label=B;e.EditorField=U;e.ReadOnlyField=N;e.HelperText=A;e.Toolbar=M;e.ToolbarGroups=P;e.ToolbarGroup=Y;e.ToolbarSeparator=J;e.HistoryGroup=F;e.Undo=H;e.Redo=D;e.TextStyleGroup=X;e.Bold=r.Bold;e.Italic=r.Italic;e.Underline=r.Underline;e.Strike=r.Strike;e.TextAppearanceGroup=j;e.LinkGroup=C;e.SetLink=O;e.UnsetLink=f;e.BlockFormatGroup=y;e.ListsGroup=v;e.AlignmentGroup=k;e.ImageGroup=g;module.exports=e;
 //# sourceMappingURL=RichTextEditor.cjs.map