@wix/patterns-fields 1.87.0 → 1.89.0

package/dist/cjs/components/image/form-image-field.js

@@ -0,0 +1,124 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.FormImageField = exports.ControlledImageInput = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _designSystem = require("@wix/design-system");
+var _react2 = require("@wix/bex-core/react");
+var _hooks = require("../../hooks");
+var _getImageUrl = require("../../utils/get-image-url");
+var _mediaConstants = require("../../utils/media-constants");
+var _utils = require("../../utils");
+var _mediaControl = require("../media-control");
+var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/fields/dist/cjs/components/image/form-image-field.tsx";
+// `invalid` is not part of this contract. ImageViewer has no error prop; it
+// takes its error styling from the enclosing WDS FormField's status context.
+// To show an error, render the field inside a FormField with status="error".
+
+const FormImageField = ({
+  data,
+  onChange: onChangeImage,
+  onClear: onClearImage,
+  onInput,
+  onBlur,
+  readOnly,
+  autoFocus,
+  dataHook,
+  inputRef: forwardedRef
+}) => {
+  const {
+    translate: t
+  } = (0, _react2.useWixPatternsContainer)();
+  const isMobile = (0, _react2.useIsMobile)();
+  const onChange = (0, _hooks.useWithCallback)(onChangeImage, onInput);
+  const onClear = (0, _hooks.useWithCallback)(onClearImage, onInput);
+  const [inputRef, setInputRef] = (0, _hooks.useMergedRef)(forwardedRef);
+  const {
+    callMedia,
+    onMediaLoad
+  } = (0, _mediaControl.useMediaControl)({
+    mediaType: _utils.MEDIA_TYPES.IMAGE,
+    value: data,
+    onChange,
+    autoFocus,
+    readOnly,
+    onBlur,
+    inputRef,
+    // The focus target is hidden behind ImageViewer's loader until the image
+    // arrives, so focusing has to wait for onImageLoad.
+    initialLoading: true
+  });
+  const canEdit = !isMobile && !readOnly;
+  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    width: "100%",
+    maxWidth: _mediaConstants.MEDIA_MAX_WIDTH,
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 68,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.ImageViewer
+  // ImageViewer keeps its focus node on whichever button is live, so
+  // one ref serves both the empty and filled states.
+  , {
+    ref: setInputRef,
+    imageUrl: data && (0, _getImageUrl.getImageUrl)(data),
+    dataHook: dataHook,
+    onImageLoad: onMediaLoad,
+    onAddImage: canEdit ? callMedia : undefined,
+    onUpdateImage: canEdit ? callMedia : undefined
+    // Empty, the only control is the add button, so anything that blocks
+    // picking disables the viewer. Filled, removal still works on mobile.
+    ,
+    disabled: data ? Boolean(readOnly) : !canEdit
+    // The buttons render whether or not a handler is given, so the states
+    // that cannot use them have to take them away explicitly.
+    ,
+    showUpdateButton: canEdit,
+    showRemoveButton: !readOnly && Boolean(onClearImage),
+    updateImageInfo: t('cairo.replace-image.tooltip'),
+    removeImageInfo: t('cairo.remove-image.tooltip'),
+    addImageInfo: t('cairo.add-image.tooltip'),
+    height: _mediaConstants.MEDIA_HEIGHT,
+    width: "100%",
+    fit: "cover",
+    onRemoveImage: onClear,
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 69,
+      columnNumber: 7
+    }
+  }));
+};
+exports.FormImageField = FormImageField;
+FormImageField.displayName = 'FormImageField';
+const ControlledImageInput = ({
+  data,
+  onChange,
+  onBlur,
+  readOnly,
+  autoFocus,
+  dataHook
+}) => /*#__PURE__*/_react.default.createElement(FormImageField, {
+  data: data,
+  onChange: onChange
+  // FormImageField reports removal through onClear, not onChange.
+  ,
+  onClear: () => onChange(undefined),
+  onBlur: onBlur,
+  readOnly: readOnly,
+  autoFocus: autoFocus,
+  dataHook: dataHook,
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 112,
+    columnNumber: 3
+  }
+});
+exports.ControlledImageInput = ControlledImageInput;
+ControlledImageInput.displayName = 'ControlledImageInput';
+//# sourceMappingURL=form-image-field.js.map

package/dist/cjs/components/image/form-image-field.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_designSystem","_react2","_hooks","_getImageUrl","_mediaConstants","_utils","_mediaControl","_jsxFileName","FormImageField","data","onChange","onChangeImage","onClear","onClearImage","onInput","onBlur","readOnly","autoFocus","dataHook","inputRef","forwardedRef","translate","t","useWixPatternsContainer","isMobile","useIsMobile","useWithCallback","setInputRef","useMergedRef","callMedia","onMediaLoad","useMediaControl","mediaType","MEDIA_TYPES","IMAGE","value","initialLoading","canEdit","default","createElement","Box","width","maxWidth","MEDIA_MAX_WIDTH","__self","__source","fileName","lineNumber","columnNumber","ImageViewer","ref","imageUrl","getImageUrl","onImageLoad","onAddImage","undefined","onUpdateImage","disabled","Boolean","showUpdateButton","showRemoveButton","updateImageInfo","removeImageInfo","addImageInfo","height","MEDIA_HEIGHT","fit","onRemoveImage","exports","displayName","ControlledImageInput"],"sources":["../../../../src/components/image/form-image-field.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport React from 'react';\n\nimport { Box, ImageViewer } from '@wix/design-system';\nimport { useIsMobile, useWixPatternsContainer } from '@wix/bex-core/react';\n\nimport type { ControlledInputProps } from '../../types/controlled-input';\nimport { useMergedRef, useWithCallback } from '../../hooks';\nimport { getImageUrl } from '../../utils/get-image-url';\nimport { MEDIA_HEIGHT, MEDIA_MAX_WIDTH } from '../../utils/media-constants';\nimport { MEDIA_TYPES } from '../../utils';\nimport type { FormMediaControlProps } from '../media-control';\nimport { useMediaControl } from '../media-control';\n\ninterface ImageViewerActions {\n  focus: () => void;\n}\n\n// `invalid` is not part of this contract. ImageViewer has no error prop; it\n// takes its error styling from the enclosing WDS FormField's status context.\n// To show an error, render the field inside a FormField with status=\"error\".\nexport interface FormImageFieldProps\n  extends Omit<FormMediaControlProps, 'invalid'> {\n  /**\n   * Fires when the media manager closes, whether or not a file was picked.\n   * A media field has no text control to blur, so the picker closing is its\n   * blur signal.\n   */\n  onBlur?: () => void;\n}\n\nexport const FormImageField: FC<FormImageFieldProps> = ({\n  data,\n  onChange: onChangeImage,\n  onClear: onClearImage,\n  onInput,\n  onBlur,\n  readOnly,\n  autoFocus,\n  dataHook,\n  inputRef: forwardedRef,\n}) => {\n  const { translate: t } = useWixPatternsContainer();\n  const isMobile = useIsMobile();\n\n  const onChange = useWithCallback(onChangeImage, onInput);\n  const onClear = useWithCallback(onClearImage, onInput);\n\n  const [inputRef, setInputRef] =\n    useMergedRef<ImageViewerActions>(forwardedRef);\n\n  const { callMedia, onMediaLoad } = useMediaControl({\n    mediaType: MEDIA_TYPES.IMAGE,\n    value: data,\n    onChange,\n    autoFocus,\n    readOnly,\n    onBlur,\n    inputRef,\n    // The focus target is hidden behind ImageViewer's loader until the image\n    // arrives, so focusing has to wait for onImageLoad.\n    initialLoading: true,\n  });\n\n  const canEdit = !isMobile && !readOnly;\n\n  return (\n    <Box width=\"100%\" maxWidth={MEDIA_MAX_WIDTH}>\n      <ImageViewer\n        // ImageViewer keeps its focus node on whichever button is live, so\n        // one ref serves both the empty and filled states.\n        ref={setInputRef}\n        imageUrl={data && getImageUrl(data)}\n        dataHook={dataHook}\n        onImageLoad={onMediaLoad}\n        onAddImage={canEdit ? callMedia : undefined}\n        onUpdateImage={canEdit ? callMedia : undefined}\n        // Empty, the only control is the add button, so anything that blocks\n        // picking disables the viewer. Filled, removal still works on mobile.\n        disabled={data ? Boolean(readOnly) : !canEdit}\n        // The buttons render whether or not a handler is given, so the states\n        // that cannot use them have to take them away explicitly.\n        showUpdateButton={canEdit}\n        showRemoveButton={!readOnly && Boolean(onClearImage)}\n        updateImageInfo={t('cairo.replace-image.tooltip')}\n        removeImageInfo={t('cairo.remove-image.tooltip')}\n        addImageInfo={t('cairo.add-image.tooltip')}\n        height={MEDIA_HEIGHT}\n        width=\"100%\"\n        fit=\"cover\"\n        onRemoveImage={onClear}\n      />\n    </Box>\n  );\n};\n\nFormImageField.displayName = 'FormImageField';\n\nexport type ControlledImageInputProps = Omit<\n  ControlledInputProps<string | undefined>,\n  'invalid'\n>;\n\nexport const ControlledImageInput: FC<ControlledImageInputProps> = ({\n  data,\n  onChange,\n  onBlur,\n  readOnly,\n  autoFocus,\n  dataHook,\n}) => (\n  <FormImageField\n    data={data}\n    onChange={onChange}\n    // FormImageField reports removal through onClear, not onChange.\n    onClear={() => onChange(undefined)}\n    onBlur={onBlur}\n    readOnly={readOnly}\n    autoFocus={autoFocus}\n    dataHook={dataHook}\n  />\n);\n\nControlledImageInput.displayName = 'ControlledImageInput';\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/image/form-image-input.js

@@ -9,9 +9,8 @@ var _mobxReactLite = require("mobx-react-lite");
 var _react2 = require("@wix/bex-core/react");
 var _form = require("@wix/bex-core/form");
 var _string = require("../../validations/string");
-var _getImageUrl = require("../../utils/get-image-url");
-var _mediaConstants = require("../../utils/media-constants");
 var _hooks = require("../../hooks");
+var _formImageField = require("./form-image-field");
 var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/fields/dist/cjs/components/image/form-image-input.tsx";
 const _FormImageInput = props => {
   var _field$validation2, _controller$fieldStat;
@@ -22,26 +21,8 @@ const _FormImageInput = props => {
     data
   } = props;
   const {
-    translate: t,
-    openMediaManager
+    translate: t
   } = (0, _react2.useWixPatternsContainer)();
-  const isMobile = (0, _react2.useIsMobile)();
-  async function openMedia() {
-    if (!openMediaManager) {
-      return;
-    }
-    try {
-      var _chosenMediaItems$ite;
-      const chosenMediaItems = await openMediaManager({
-        multiSelect: false,
-        category: 'IMAGE'
-      });
-      const newImage = chosenMediaItems == null || (_chosenMediaItems$ite = chosenMediaItems.items[0]) == null || (_chosenMediaItems$ite = _chosenMediaItems$ite.media) == null || (_chosenMediaItems$ite = _chosenMediaItems$ite.image) == null ? void 0 : _chosenMediaItems$ite.image;
-      controller.field.onChange(newImage);
-    } catch (error) {
-      console.error('Error opening Media Manager or no files selected:', error);
-    }
-  }
   const controller = (0, _form.useController)({
     name: (field == null ? void 0 : field.id) ?? '',
     control: formControl,
@@ -57,7 +38,6 @@ const _FormImageInput = props => {
     }
   });
   const setFieldRef = (0, _hooks.useFieldRef)(controller.field.ref);
-  const imageUrl = controller.field.value && (0, _getImageUrl.getImageUrl)(controller.field.value);
   return /*#__PURE__*/_react.default.createElement(_designSystem.FormField, {
     label: field.displayName,
     required: (_field$validation2 = field.validation) == null ? void 0 : _field$validation2.required,
@@ -67,42 +47,25 @@ const _FormImageInput = props => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 60,
+      lineNumber: 37,
       columnNumber: 5
     }
-  }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
-    width: "100%",
-    maxWidth: _mediaConstants.MEDIA_MAX_WIDTH,
-    __self: void 0,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 67,
-      columnNumber: 7
-    }
-  }, /*#__PURE__*/_react.default.createElement(_designSystem.ImageViewer
-  // ImageViewer keeps its focus node on whichever button is live, so
-  // one ref serves both the empty and filled states. Lets
-  // react-hook-form's shouldFocusError reach this field.
+  }, /*#__PURE__*/_react.default.createElement(_formImageField.FormImageField
+  // Hands the live button to react-hook-form so shouldFocusError can
+  // reach this field when it blocks save.
   , {
-    ref: setFieldRef,
-    imageUrl: imageUrl,
+    inputRef: setFieldRef,
+    data: controller.field.value,
+    onChange: value => controller.field.onChange(value),
+    onClear: () => controller.field.onChange(null),
     dataHook: `image-${field.id}`,
-    onAddImage: isMobile ? undefined : () => openMedia(),
-    onUpdateImage: isMobile ? undefined : () => openMedia(),
-    updateImageInfo: t('cairo.replace-image.tooltip'),
-    removeImageInfo: t('cairo.remove-image.tooltip'),
-    addImageInfo: t('cairo.add-image.tooltip'),
-    height: _mediaConstants.MEDIA_HEIGHT,
-    width: "100%",
-    fit: "cover",
-    onRemoveImage: () => controller.field.onChange(null),
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 68,
-      columnNumber: 9
+      lineNumber: 44,
+      columnNumber: 7
     }
-  })));
+  }));
 };
 const FormImageInput = exports.FormImageInput = (0, _mobxReactLite.observer)(_FormImageInput);
 //# sourceMappingURL=form-image-input.js.map

package/dist/cjs/components/image/form-image-input.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_designSystem","_mobxReactLite","_react2","_form","_string","_getImageUrl","_mediaConstants","_hooks","_jsxFileName","_FormImageInput","props","_field$validation2","_controller$fieldStat","field","dataHook","formControl","data","translate","t","openMediaManager","useWixPatternsContainer","isMobile","useIsMobile","openMedia","_chosenMediaItems$ite","chosenMediaItems","multiSelect","category","newImage","items","media","image","controller","onChange","error","console","useController","name","id","control","defaultValue","rules","validate","value","_field$validation","validation","required","isEmpty","setFieldRef","useFieldRef","ref","imageUrl","getImageUrl","default","createElement","FormField","label","displayName","status","fieldState","undefined","statusMessage","message","__self","__source","fileName","lineNumber","columnNumber","Box","width","maxWidth","MEDIA_MAX_WIDTH","ImageViewer","onAddImage","onUpdateImage","updateImageInfo","removeImageInfo","addImageInfo","height","MEDIA_HEIGHT","fit","onRemoveImage","FormImageInput","exports","observer"],"sources":["../../../../src/components/image/form-image-input.tsx"],"sourcesContent":["import React from 'react';\nimport { Box, FormField, ImageViewer } from '@wix/design-system';\nimport { observer } from 'mobx-react-lite';\nimport { useIsMobile, useWixPatternsContainer } from '@wix/bex-core/react';\nimport { useController } from '@wix/bex-core/form';\n\nimport { BaseInputProps } from '../../types/base-input';\nimport { isEmpty } from '../../validations/string';\nimport { getImageUrl } from '../../utils/get-image-url';\nimport { MEDIA_HEIGHT, MEDIA_MAX_WIDTH } from '../../utils/media-constants';\nimport { useFieldRef } from '../../hooks';\n\nexport interface FormImageInputProps extends BaseInputProps<string> {}\n\nconst _FormImageInput = (props: FormImageInputProps) => {\n  const { field, dataHook, formControl, data } = props;\n\n  const { translate: t, openMediaManager } = useWixPatternsContainer();\n  const isMobile = useIsMobile();\n\n  async function openMedia() {\n    if (!openMediaManager) {\n      return;\n    }\n    try {\n      const chosenMediaItems = await openMediaManager({\n        multiSelect: false,\n        category: 'IMAGE',\n      });\n\n      const newImage = chosenMediaItems?.items[0]?.media?.image?.image;\n\n      controller.field.onChange(newImage);\n    } catch (error) {\n      console.error('Error opening Media Manager or no files selected:', error);\n    }\n  }\n\n  const controller = useController({\n    name: field?.id ?? '',\n    control: formControl,\n    defaultValue: data?.[field?.id ?? ''],\n    rules: {\n      validate: (value) => {\n        if (field.validation?.required && isEmpty(value)) {\n          return t('cairo.fieldValidation.requiredField');\n        }\n\n        return true;\n      },\n    },\n  });\n\n  const setFieldRef = useFieldRef(controller.field.ref);\n\n  const imageUrl =\n    controller.field.value && getImageUrl(controller.field.value);\n\n  return (\n    <FormField\n      label={field.displayName}\n      required={field.validation?.required}\n      status={controller.fieldState.error ? 'error' : undefined}\n      statusMessage={controller.fieldState.error?.message}\n      dataHook={dataHook}\n    >\n      <Box width=\"100%\" maxWidth={MEDIA_MAX_WIDTH}>\n        <ImageViewer\n          // ImageViewer keeps its focus node on whichever button is live, so\n          // one ref serves both the empty and filled states. Lets\n          // react-hook-form's shouldFocusError reach this field.\n          ref={setFieldRef}\n          imageUrl={imageUrl}\n          dataHook={`image-${field.id}`}\n          onAddImage={isMobile ? undefined : () => openMedia()}\n          onUpdateImage={isMobile ? undefined : () => openMedia()}\n          updateImageInfo={t('cairo.replace-image.tooltip')}\n          removeImageInfo={t('cairo.remove-image.tooltip')}\n          addImageInfo={t('cairo.add-image.tooltip')}\n          height={MEDIA_HEIGHT}\n          width=\"100%\"\n          fit=\"cover\"\n          onRemoveImage={() => controller.field.onChange(null)}\n        />\n      </Box>\n    </FormField>\n  );\n};\n\nexport const FormImageInput = observer(_FormImageInput);\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,cAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AAGA,IAAAK,OAAA,GAAAL,OAAA;AACA,IAAAM,YAAA,GAAAN,OAAA;AACA,IAAAO,eAAA,GAAAP,OAAA;AACA,IAAAQ,MAAA,GAAAR,OAAA;AAA0C,IAAAS,YAAA;AAI1C,MAAMC,eAAe,GAAIC,KAA0B,IAAK;EAAA,IAAAC,kBAAA,EAAAC,qBAAA;EACtD,MAAM;IAAEC,KAAK;IAAEC,QAAQ;IAAEC,WAAW;IAAEC;EAAK,CAAC,GAAGN,KAAK;EAEpD,MAAM;IAAEO,SAAS,EAAEC,CAAC;IAAEC;EAAiB,CAAC,GAAG,IAAAC,+BAAuB,EAAC,CAAC;EACpE,MAAMC,QAAQ,GAAG,IAAAC,mBAAW,EAAC,CAAC;EAE9B,eAAeC,SAASA,CAAA,EAAG;IACzB,IAAI,CAACJ,gBAAgB,EAAE;MACrB;IACF;IACA,IAAI;MAAA,IAAAK,qBAAA;MACF,MAAMC,gBAAgB,GAAG,MAAMN,gBAAgB,CAAC;QAC9CO,WAAW,EAAE,KAAK;QAClBC,QAAQ,EAAE;MACZ,CAAC,CAAC;MAEF,MAAMC,QAAQ,GAAGH,gBAAgB,aAAAD,qBAAA,GAAhBC,gBAAgB,CAAEI,KAAK,CAAC,CAAC,CAAC,cAAAL,qBAAA,GAA1BA,qBAAA,CAA4BM,KAAK,cAAAN,qBAAA,GAAjCA,qBAAA,CAAmCO,KAAK,qBAAxCP,qBAAA,CAA0CO,KAAK;MAEhEC,UAAU,CAACnB,KAAK,CAACoB,QAAQ,CAACL,QAAQ,CAAC;IACrC,CAAC,CAAC,OAAOM,KAAK,EAAE;MACdC,OAAO,CAACD,KAAK,CAAC,mDAAmD,EAAEA,KAAK,CAAC;IAC3E;EACF;EAEA,MAAMF,UAAU,GAAG,IAAAI,mBAAa,EAAC;IAC/BC,IAAI,EAAE,CAAAxB,KAAK,oBAALA,KAAK,CAAEyB,EAAE,KAAI,EAAE;IACrBC,OAAO,EAAExB,WAAW;IACpByB,YAAY,EAAExB,IAAI,oBAAJA,IAAI,CAAG,CAAAH,KAAK,oBAALA,KAAK,CAAEyB,EAAE,KAAI,EAAE,CAAC;IACrCG,KAAK,EAAE;MACLC,QAAQ,EAAGC,KAAK,IAAK;QAAA,IAAAC,iBAAA;QACnB,IAAI,CAAAA,iBAAA,GAAA/B,KAAK,CAACgC,UAAU,aAAhBD,iBAAA,CAAkBE,QAAQ,IAAI,IAAAC,eAAO,EAACJ,KAAK,CAAC,EAAE;UAChD,OAAOzB,CAAC,CAAC,qCAAqC,CAAC;QACjD;QAEA,OAAO,IAAI;MACb;IACF;EACF,CAAC,CAAC;EAEF,MAAM8B,WAAW,GAAG,IAAAC,kBAAW,EAACjB,UAAU,CAACnB,KAAK,CAACqC,GAAG,CAAC;EAErD,MAAMC,QAAQ,GACZnB,UAAU,CAACnB,KAAK,CAAC8B,KAAK,IAAI,IAAAS,wBAAW,EAACpB,UAAU,CAACnB,KAAK,CAAC8B,KAAK,CAAC;EAE/D,oBACE9C,MAAA,CAAAwD,OAAA,CAAAC,aAAA,CAACtD,aAAA,CAAAuD,SAAS;IACRC,KAAK,EAAE3C,KAAK,CAAC4C,WAAY;IACzBX,QAAQ,GAAAnC,kBAAA,GAAEE,KAAK,CAACgC,UAAU,qBAAhBlC,kBAAA,CAAkBmC,QAAS;IACrCY,MAAM,EAAE1B,UAAU,CAAC2B,UAAU,CAACzB,KAAK,GAAG,OAAO,GAAG0B,SAAU;IAC1DC,aAAa,GAAAjD,qBAAA,GAAEoB,UAAU,CAAC2B,UAAU,CAACzB,KAAK,qBAA3BtB,qBAAA,CAA6BkD,OAAQ;IACpDhD,QAAQ,EAAEA,QAAS;IAAAiD,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAzD,YAAA;MAAA0D,UAAA;MAAAC,YAAA;IAAA;EAAA,gBAEnBtE,MAAA,CAAAwD,OAAA,CAAAC,aAAA,CAACtD,aAAA,CAAAoE,GAAG;IAACC,KAAK,EAAC,MAAM;IAACC,QAAQ,EAAEC,+BAAgB;IAAAR,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAzD,YAAA;MAAA0D,UAAA;MAAAC,YAAA;IAAA;EAAA,gBAC1CtE,MAAA,CAAAwD,OAAA,CAAAC,aAAA,CAACtD,aAAA,CAAAwE;EACC;EACA;EACA;EAAA;IACAtB,GAAG,EAAEF,WAAY;IACjBG,QAAQ,EAAEA,QAAS;IACnBrC,QAAQ,EAAE,SAASD,KAAK,CAACyB,EAAE,EAAG;IAC9BmC,UAAU,EAAEpD,QAAQ,GAAGuC,SAAS,GAAG,MAAMrC,SAAS,CAAC,CAAE;IACrDmD,aAAa,EAAErD,QAAQ,GAAGuC,SAAS,GAAG,MAAMrC,SAAS,CAAC,CAAE;IACxDoD,eAAe,EAAEzD,CAAC,CAAC,6BAA6B,CAAE;IAClD0D,eAAe,EAAE1D,CAAC,CAAC,4BAA4B,CAAE;IACjD2D,YAAY,EAAE3D,CAAC,CAAC,yBAAyB,CAAE;IAC3C4D,MAAM,EAAEC,4BAAa;IACrBV,KAAK,EAAC,MAAM;IACZW,GAAG,EAAC,OAAO;IACXC,aAAa,EAAEA,CAAA,KAAMjD,UAAU,CAACnB,KAAK,CAACoB,QAAQ,CAAC,IAAI,CAAE;IAAA8B,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAzD,YAAA;MAAA0D,UAAA;MAAAC,YAAA;IAAA;EAAA,CACtD,CACE,CACI,CAAC;AAEhB,CAAC;AAEM,MAAMe,cAAc,GAAAC,OAAA,CAAAD,cAAA,GAAG,IAAAE,uBAAQ,EAAC3E,eAAe,CAAC","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_designSystem","_mobxReactLite","_react2","_form","_string","_hooks","_formImageField","_jsxFileName","_FormImageInput","props","_field$validation2","_controller$fieldStat","field","dataHook","formControl","data","translate","t","useWixPatternsContainer","controller","useController","name","id","control","defaultValue","rules","validate","value","_field$validation","validation","required","isEmpty","setFieldRef","useFieldRef","ref","default","createElement","FormField","label","displayName","status","fieldState","error","undefined","statusMessage","message","__self","__source","fileName","lineNumber","columnNumber","FormImageField","inputRef","onChange","onClear","FormImageInput","exports","observer"],"sources":["../../../../src/components/image/form-image-input.tsx"],"sourcesContent":["import React from 'react';\nimport { FormField } from '@wix/design-system';\nimport { observer } from 'mobx-react-lite';\nimport { useWixPatternsContainer } from '@wix/bex-core/react';\nimport { useController } from '@wix/bex-core/form';\n\nimport { BaseInputProps } from '../../types/base-input';\nimport { isEmpty } from '../../validations/string';\nimport { useFieldRef } from '../../hooks';\nimport { FormImageField } from './form-image-field';\n\nexport interface FormImageInputProps extends BaseInputProps<string> {}\n\nconst _FormImageInput = (props: FormImageInputProps) => {\n  const { field, dataHook, formControl, data } = props;\n\n  const { translate: t } = useWixPatternsContainer();\n\n  const controller = useController({\n    name: field?.id ?? '',\n    control: formControl,\n    defaultValue: data?.[field?.id ?? ''],\n    rules: {\n      validate: (value) => {\n        if (field.validation?.required && isEmpty(value)) {\n          return t('cairo.fieldValidation.requiredField');\n        }\n\n        return true;\n      },\n    },\n  });\n\n  const setFieldRef = useFieldRef(controller.field.ref);\n\n  return (\n    <FormField\n      label={field.displayName}\n      required={field.validation?.required}\n      status={controller.fieldState.error ? 'error' : undefined}\n      statusMessage={controller.fieldState.error?.message}\n      dataHook={dataHook}\n    >\n      <FormImageField\n        // Hands the live button to react-hook-form so shouldFocusError can\n        // reach this field when it blocks save.\n        inputRef={setFieldRef}\n        data={controller.field.value}\n        onChange={(value) => controller.field.onChange(value)}\n        onClear={() => controller.field.onChange(null)}\n        dataHook={`image-${field.id}`}\n      />\n    </FormField>\n  );\n};\n\nexport const FormImageInput = observer(_FormImageInput);\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,cAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AAGA,IAAAK,OAAA,GAAAL,OAAA;AACA,IAAAM,MAAA,GAAAN,OAAA;AACA,IAAAO,eAAA,GAAAP,OAAA;AAAoD,IAAAQ,YAAA;AAIpD,MAAMC,eAAe,GAAIC,KAA0B,IAAK;EAAA,IAAAC,kBAAA,EAAAC,qBAAA;EACtD,MAAM;IAAEC,KAAK;IAAEC,QAAQ;IAAEC,WAAW;IAAEC;EAAK,CAAC,GAAGN,KAAK;EAEpD,MAAM;IAAEO,SAAS,EAAEC;EAAE,CAAC,GAAG,IAAAC,+BAAuB,EAAC,CAAC;EAElD,MAAMC,UAAU,GAAG,IAAAC,mBAAa,EAAC;IAC/BC,IAAI,EAAE,CAAAT,KAAK,oBAALA,KAAK,CAAEU,EAAE,KAAI,EAAE;IACrBC,OAAO,EAAET,WAAW;IACpBU,YAAY,EAAET,IAAI,oBAAJA,IAAI,CAAG,CAAAH,KAAK,oBAALA,KAAK,CAAEU,EAAE,KAAI,EAAE,CAAC;IACrCG,KAAK,EAAE;MACLC,QAAQ,EAAGC,KAAK,IAAK;QAAA,IAAAC,iBAAA;QACnB,IAAI,CAAAA,iBAAA,GAAAhB,KAAK,CAACiB,UAAU,aAAhBD,iBAAA,CAAkBE,QAAQ,IAAI,IAAAC,eAAO,EAACJ,KAAK,CAAC,EAAE;UAChD,OAAOV,CAAC,CAAC,qCAAqC,CAAC;QACjD;QAEA,OAAO,IAAI;MACb;IACF;EACF,CAAC,CAAC;EAEF,MAAMe,WAAW,GAAG,IAAAC,kBAAW,EAACd,UAAU,CAACP,KAAK,CAACsB,GAAG,CAAC;EAErD,oBACErC,MAAA,CAAAsC,OAAA,CAAAC,aAAA,CAACpC,aAAA,CAAAqC,SAAS;IACRC,KAAK,EAAE1B,KAAK,CAAC2B,WAAY;IACzBT,QAAQ,GAAApB,kBAAA,GAAEE,KAAK,CAACiB,UAAU,qBAAhBnB,kBAAA,CAAkBoB,QAAS;IACrCU,MAAM,EAAErB,UAAU,CAACsB,UAAU,CAACC,KAAK,GAAG,OAAO,GAAGC,SAAU;IAC1DC,aAAa,GAAAjC,qBAAA,GAAEQ,UAAU,CAACsB,UAAU,CAACC,KAAK,qBAA3B/B,qBAAA,CAA6BkC,OAAQ;IACpDhC,QAAQ,EAAEA,QAAS;IAAAiC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAzC,YAAA;MAAA0C,UAAA;MAAAC,YAAA;IAAA;EAAA,gBAEnBrD,MAAA,CAAAsC,OAAA,CAAAC,aAAA,CAAC9B,eAAA,CAAA6C;EACC;EACA;EAAA;IACAC,QAAQ,EAAEpB,WAAY;IACtBjB,IAAI,EAAEI,UAAU,CAACP,KAAK,CAACe,KAAM;IAC7B0B,QAAQ,EAAG1B,KAAK,IAAKR,UAAU,CAACP,KAAK,CAACyC,QAAQ,CAAC1B,KAAK,CAAE;IACtD2B,OAAO,EAAEA,CAAA,KAAMnC,UAAU,CAACP,KAAK,CAACyC,QAAQ,CAAC,IAAI,CAAE;IAC/CxC,QAAQ,EAAE,SAASD,KAAK,CAACU,EAAE,EAAG;IAAAwB,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAzC,YAAA;MAAA0C,UAAA;MAAAC,YAAA;IAAA;EAAA,CAC/B,CACQ,CAAC;AAEhB,CAAC;AAEM,MAAMK,cAAc,GAAAC,OAAA,CAAAD,cAAA,GAAG,IAAAE,uBAAQ,EAACjD,eAAe,CAAC","ignoreList":[]}

package/dist/cjs/components/image/index.js

@@ -25,6 +25,12 @@ Object.keys(_cellImageEdit).forEach(function (key) {
   if (key in exports && exports[key] === _cellImageEdit[key]) return;
   exports[key] = _cellImageEdit[key];
 });
+var _formImageField = require("./form-image-field");
+Object.keys(_formImageField).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _formImageField[key]) return;
+  exports[key] = _formImageField[key];
+});
 var _formImageInput = require("./form-image-input");
 Object.keys(_formImageInput).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/dist/cjs/components/image/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_imageThumbnail","require","Object","keys","forEach","key","exports","_imageView","_imageViewField","_cellImageEdit","_formImageInput"],"sources":["../../../../src/components/image/index.ts"],"sourcesContent":["export * from './image-thumbnail';\nexport * from './image-view';\nexport * from './image-view-field';\nexport * from './cell-image-edit';\nexport * from './form-image-input';\n"],"mappings":";;;AAAA,IAAAA,eAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,eAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,eAAA,CAAAK,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAL,eAAA,CAAAK,GAAA;AAAA;AACA,IAAAE,UAAA,GAAAN,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAI,UAAA,EAAAH,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAE,UAAA,CAAAF,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAE,UAAA,CAAAF,GAAA;AAAA;AACA,IAAAG,eAAA,GAAAP,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAK,eAAA,EAAAJ,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAG,eAAA,CAAAH,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAG,eAAA,CAAAH,GAAA;AAAA;AACA,IAAAI,cAAA,GAAAR,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAM,cAAA,EAAAL,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAI,cAAA,CAAAJ,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAI,cAAA,CAAAJ,GAAA;AAAA;AACA,IAAAK,eAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,eAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,eAAA,CAAAL,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAK,eAAA,CAAAL,GAAA;AAAA","ignoreList":[]}
+{"version":3,"names":["_imageThumbnail","require","Object","keys","forEach","key","exports","_imageView","_imageViewField","_cellImageEdit","_formImageField","_formImageInput"],"sources":["../../../../src/components/image/index.ts"],"sourcesContent":["export * from './image-thumbnail';\nexport * from './image-view';\nexport * from './image-view-field';\nexport * from './cell-image-edit';\nexport * from './form-image-field';\nexport * from './form-image-input';\n"],"mappings":";;;AAAA,IAAAA,eAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,eAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,eAAA,CAAAK,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAL,eAAA,CAAAK,GAAA;AAAA;AACA,IAAAE,UAAA,GAAAN,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAI,UAAA,EAAAH,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAE,UAAA,CAAAF,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAE,UAAA,CAAAF,GAAA;AAAA;AACA,IAAAG,eAAA,GAAAP,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAK,eAAA,EAAAJ,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAG,eAAA,CAAAH,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAG,eAAA,CAAAH,GAAA;AAAA;AACA,IAAAI,cAAA,GAAAR,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAM,cAAA,EAAAL,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAI,cAAA,CAAAJ,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAI,cAAA,CAAAJ,GAAA;AAAA;AACA,IAAAK,eAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,eAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,eAAA,CAAAL,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAK,eAAA,CAAAL,GAAA;AAAA;AACA,IAAAM,eAAA,GAAAV,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAQ,eAAA,EAAAP,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAM,eAAA,CAAAN,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAM,eAAA,CAAAN,GAAA;AAAA","ignoreList":[]}

package/dist/cjs/components/image/thumbnail-replace-overlay.st.css.js

@@ -5,15 +5,15 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
 
-var _namespace_ = "thumbnailreplaceoverlay1626805897";
+var _namespace_ = "thumbnailreplaceoverlay1623114284";
 var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
 var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
 var style = exports.style = _style_;
 var st = exports.st = _style_;
 var namespace = exports.namespace = _namespace_;
 var classes = exports.classes = {
-  "root": "thumbnailreplaceoverlay1626805897__root",
-  "icon": "thumbnailreplaceoverlay1626805897__icon"
+  "root": "thumbnailreplaceoverlay1623114284__root",
+  "icon": "thumbnailreplaceoverlay1623114284__icon"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/image/thumbnail-replace-overlay.st.css.js.map

@@ -1 +1 @@
-{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/image/thumbnail-replace-overlay.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"thumbnailreplaceoverlay1626805897\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style: import(\"@stylable/runtime\").STFunction = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"thumbnailreplaceoverlay1626805897__root\",\"icon\":\"thumbnailreplaceoverlay1626805897__icon\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,mCAAmC;AACrD,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAA6C,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AAC3D,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,yCAAyC;EAAC,MAAM,EAAC;AAAyC,CAAC;AACjH,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/image/thumbnail-replace-overlay.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"thumbnailreplaceoverlay1623114284\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style: import(\"@stylable/runtime\").STFunction = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"thumbnailreplaceoverlay1623114284__root\",\"icon\":\"thumbnailreplaceoverlay1623114284__icon\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,mCAAmC;AACrD,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAA6C,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AAC3D,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,yCAAyC;EAAC,MAAM,EAAC;AAAyC,CAAC;AACjH,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}

package/dist/cjs/components/media-control/cell-media-edit-shell.st.css.js

@@ -5,14 +5,14 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
 
-var _namespace_ = "cellmediaeditshell588955575";
+var _namespace_ = "cellmediaeditshell1721400213";
 var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
 var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
 var style = exports.style = _style_;
 var st = exports.st = _style_;
 var namespace = exports.namespace = _namespace_;
 var classes = exports.classes = {
-  "root": "cellmediaeditshell588955575__root"
+  "root": "cellmediaeditshell1721400213__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/media-control/cell-media-edit-shell.st.css.js.map

@@ -1 +1 @@
-{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/media-control/cell-media-edit-shell.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"cellmediaeditshell588955575\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style: import(\"@stylable/runtime\").STFunction = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"cellmediaeditshell588955575__root\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,6BAA6B;AAC/C,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAA6C,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AAC3D,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC;AAAmC,CAAC;AAC1D,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/media-control/cell-media-edit-shell.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"cellmediaeditshell1721400213\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style: import(\"@stylable/runtime\").STFunction = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"cellmediaeditshell1721400213__root\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,8BAA8B;AAChD,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAA6C,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AAC3D,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC;AAAoC,CAAC;AAC3D,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}

package/dist/cjs/components/media-control/paste-url-button.st.css.js

@@ -5,16 +5,16 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
 
-var _namespace_ = "pasteurlbutton851342683";
+var _namespace_ = "pasteurlbutton3225979476";
 var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
 var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
 var style = exports.style = _style_;
 var st = exports.st = _style_;
 var namespace = exports.namespace = _namespace_;
 var classes = exports.classes = {
-  "root": "pasteurlbutton851342683__root",
-  "iconButtonTooltip": "pasteurlbutton851342683__iconButtonTooltip",
-  "iconButton": "pasteurlbutton851342683__iconButton"
+  "root": "pasteurlbutton3225979476__root",
+  "iconButtonTooltip": "pasteurlbutton3225979476__iconButtonTooltip",
+  "iconButton": "pasteurlbutton3225979476__iconButton"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/media-control/paste-url-button.st.css.js.map

@@ -1 +1 @@
-{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/media-control/paste-url-button.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"pasteurlbutton851342683\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style: import(\"@stylable/runtime\").STFunction = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"pasteurlbutton851342683__root\",\"iconButtonTooltip\":\"pasteurlbutton851342683__iconButtonTooltip\",\"iconButton\":\"pasteurlbutton851342683__iconButton\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,yBAAyB;AAC3C,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAA6C,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AAC3D,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,+BAA+B;EAAC,mBAAmB,EAAC,4CAA4C;EAAC,YAAY,EAAC;AAAqC,CAAC;AAC1K,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/media-control/paste-url-button.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"pasteurlbutton3225979476\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style: import(\"@stylable/runtime\").STFunction = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"pasteurlbutton3225979476__root\",\"iconButtonTooltip\":\"pasteurlbutton3225979476__iconButtonTooltip\",\"iconButton\":\"pasteurlbutton3225979476__iconButton\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,0BAA0B;AAC5C,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAA6C,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AAC3D,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,gCAAgC;EAAC,mBAAmB,EAAC,6CAA6C;EAAC,YAAY,EAAC;AAAsC,CAAC;AAC7K,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}

package/dist/cjs/components/media-control/use-media-control.js

@@ -89,7 +89,10 @@ function useMediaControl({
       inputRef == null || (_inputRef$current2 = inputRef.current) == null || _inputRef$current2.focus();
     }
   }, [autoFocus, value, inputRef, viewRef]);
-  (0, _react.useEffect)(() => setActive(), [setActive]);
+
+  // `loading` is a dependency because the focus target does not exist while the
+  // loader placeholder is up — the effect has to run again once it is gone.
+  (0, _react.useEffect)(() => setActive(), [setActive, loading]);
   const onMediaLoad = (0, _react.useCallback)(() => setLoading(false), []);
   const callMedia = (0, _react.useCallback)(async index => {
     if (mediaRequested.current || readOnly) {

package/dist/cjs/components/media-control/use-media-control.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_react2","_media","_mediaUtils","_autoFieldTypes","MEDIA_TYPE_TO_CATEGORY","MEDIA_TYPES","IMAGE","VIDEO","AUDIO","extractAudioUrl","audio","_audio$assets","firstAsset","assets","url","undefined","extractMediaUri","mediaItem","media","_media$image","_media$video","_media$document","image","video","document","useMediaControl","mediaType","readOnly","autoFocus","initialLoading","inputRef","viewRef","onFocus","onBlur","params","value","multiSelect","container","useContext","WixPatternsContainerContext","openMediaManager","loading","setLoading","useState","Boolean","mediaRequested","useRef","setActive","useCallback","_viewRef$current","_inputRef$current","current","focus","_inputRef$current2","useEffect","onMediaLoad","callMedia","index","onChange","category","Error","mediaManagerData","items","files","length","newURIs","map","newValue","splice","e","console","error","downloadMedia","mediaUri","_result$downloadUrls","result","generateFileDownloadUrl","downloadUrl","downloadUrls","executeDownloading","getMediaURL"],"sources":["../../../../src/components/media-control/use-media-control.ts"],"sourcesContent":["import { useRef, useState, useEffect, useCallback, useContext } from 'react';\nimport { WixPatternsContainerContext } from '@wix/bex-core/react';\nimport { files } from '@wix/media';\n\nimport { MEDIA_TYPES } from '../../utils/media-utils';\nimport { executeDownloading } from '../../utils/media-utils';\nimport { getMediaURL } from '../../auto-field-types';\n\ntype Focusable = { focus: () => void };\ntype FocusableRef =\n  | React.RefObject<Focusable | undefined>\n  | React.MutableRefObject<Focusable | undefined>;\n\ninterface UseMediaControlBaseParams {\n  mediaType: MEDIA_TYPES;\n  autoFocus?: boolean;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  readOnly?: boolean;\n  initialLoading?: boolean;\n  inputRef?: FocusableRef;\n  viewRef?: FocusableRef;\n}\n\ninterface UseSingleMediaControlParams extends UseMediaControlBaseParams {\n  value?: string;\n  onChange?: (value: string) => void;\n  multiSelect?: false;\n}\n\ninterface UseMultiMediaControlParams extends UseMediaControlBaseParams {\n  value?: string[];\n  onChange?: (value: string[]) => void;\n  multiSelect: true;\n}\n\nexport type UseMediaControlParams =\n  | UseSingleMediaControlParams\n  | UseMultiMediaControlParams;\n\ninterface UseMediaControlBaseReturnType {\n  loading: boolean;\n  onMediaLoad: () => void;\n}\n\ninterface UseSingleMediaControlReturnType\n  extends UseMediaControlBaseReturnType {\n  callMedia(): Promise<boolean>;\n  downloadMedia(mediaUri?: string): Promise<void>;\n}\n\ninterface UseMultiMediaControlReturnType extends UseMediaControlBaseReturnType {\n  callMedia(index?: number): Promise<boolean>;\n  downloadMedia(mediaUri?: string): Promise<void>;\n}\n\nexport type UseMediaControlReturnType =\n  | UseSingleMediaControlReturnType\n  | UseMultiMediaControlReturnType;\n\nconst MEDIA_TYPE_TO_CATEGORY: Partial<Record<MEDIA_TYPES, string>> = {\n  [MEDIA_TYPES.IMAGE]: 'IMAGE',\n  [MEDIA_TYPES.VIDEO]: 'VIDEO',\n  [MEDIA_TYPES.AUDIO]: 'MUSIC',\n};\n\n/**\n * Extracts a playable URL from media.audio, which may be:\n *   - a string (wix:audio:// URI or direct URL)\n *   - an object with { audio: string } (nested URI)\n *   - an object with { assets: [{ url }] } or { assets: [string] }\n */\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst extractAudioUrl = (audio: any): string | undefined => {\n  if (audio) {\n    if (typeof audio === 'string') {\n      return audio;\n    }\n    if (typeof audio.audio === 'string') {\n      return audio.audio;\n    }\n    const firstAsset = audio.assets?.[0];\n    if (typeof firstAsset === 'string') {\n      return firstAsset;\n    }\n    if (typeof firstAsset?.url === 'string') {\n      return firstAsset.url;\n    }\n  }\n  return undefined;\n};\n\n/**\n * Extracts the Wix media URI from media manager result.\n * Media manager returns different structures for different media types.\n */\nconst extractMediaUri = (mediaItem: any): string => {\n  const { media } = mediaItem || {};\n  if (media) {\n    return (\n      // Try each media type: the URI is nested under media.[type].[type], fallback for direct string values\n      media.image?.image ||\n      (typeof media.image === 'string' && media.image) ||\n      media.video?.video ||\n      (typeof media.video === 'string' && media.video) ||\n      media.document?.document ||\n      (typeof media.document === 'string' && media.document) ||\n      extractAudioUrl(media.audio) ||\n      ''\n    );\n  }\n\n  return '';\n};\n\nexport function useMediaControl(\n  params: UseSingleMediaControlParams,\n): UseSingleMediaControlReturnType;\n\nexport function useMediaControl(\n  params: UseMultiMediaControlParams,\n): UseMultiMediaControlReturnType;\n\nexport function useMediaControl({\n  mediaType,\n  readOnly,\n  autoFocus,\n  initialLoading,\n  inputRef,\n  viewRef,\n  onFocus,\n  onBlur,\n  ...params\n}: UseMediaControlParams): UseMediaControlReturnType {\n  const { value, multiSelect } = params;\n  const container = useContext(WixPatternsContainerContext);\n  const openMediaManager = container?.openMediaManager;\n\n  const [loading, setLoading] = useState(Boolean(initialLoading && value));\n  const mediaRequested = useRef(false);\n\n  const setActive = useCallback(() => {\n    if (!autoFocus) {\n      return;\n    }\n\n    if (value) {\n      viewRef && viewRef?.current?.focus();\n      !viewRef && inputRef?.current?.focus();\n    } else {\n      inputRef?.current?.focus();\n    }\n  }, [autoFocus, value, inputRef, viewRef]);\n\n  useEffect(() => setActive(), [setActive]);\n\n  const onMediaLoad = useCallback(() => setLoading(false), []);\n\n  const callMedia = useCallback(\n    async (index?: number): Promise<boolean> => {\n      if (mediaRequested.current || readOnly) {\n        return false;\n      }\n\n      if (!params.onChange) {\n        return false;\n      }\n\n      mediaRequested.current = true;\n\n      onFocus?.();\n      setLoading(true);\n\n      try {\n        const category = MEDIA_TYPE_TO_CATEGORY[mediaType];\n        if (!openMediaManager) {\n          throw new Error(\n            'Media Control Error: openMediaManager is not available in the current context.',\n          );\n        }\n        const mediaManagerData = await openMediaManager({\n          multiSelect: Boolean(multiSelect),\n          ...(category && { category }),\n        });\n\n        onBlur?.();\n        setLoading(false);\n\n        setActive();\n\n        mediaRequested.current = false;\n\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        const items =\n          mediaManagerData?.items || (mediaManagerData as any)?.files;\n\n        if (!items?.length) {\n          return false;\n        }\n\n        if (params.multiSelect) {\n          const newURIs = items.map(extractMediaUri);\n\n          if (!newURIs.length) {\n            throw new Error(\n              `Media Control Error: Media Manager returns not-covered Multi-Document data.`,\n            );\n          }\n\n          if (typeof index === 'number') {\n            const newValue = value ? [...value] : [];\n            newValue.splice(index, 1, ...newURIs);\n            params.onChange(newValue);\n          } else {\n            params.onChange([...((value as string[]) ?? []), ...newURIs]);\n          }\n        } else {\n          params.onChange(extractMediaUri(items[0]));\n        }\n        return true;\n      } catch (e) {\n        setLoading(false);\n        mediaRequested.current = false;\n        console.error(`Media Control Error:`, e);\n        return false;\n      }\n    },\n    [\n      mediaType,\n      multiSelect,\n      onBlur,\n      onFocus,\n      openMediaManager,\n      params,\n      readOnly,\n      setActive,\n      value,\n    ],\n  );\n\n  const downloadMedia = useCallback(async (mediaUri?: string) => {\n    if (!mediaUri) {\n      return;\n    }\n\n    try {\n      const result = await files.generateFileDownloadUrl(mediaUri);\n      const downloadUrl = result.downloadUrls?.[0]?.url;\n      if (!downloadUrl) {\n        throw new Error('No download URL returned');\n      }\n      return executeDownloading(downloadUrl);\n    } catch (error) {\n      // Fallback: open the static URL in a new tab\n      console.error('Media download error, falling back to static URL:', error);\n      return executeDownloading(getMediaURL(mediaUri));\n    }\n  }, []);\n\n  return {\n    loading,\n    callMedia,\n    downloadMedia,\n    onMediaLoad,\n  };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","require","_react2","_media","_mediaUtils","_autoFieldTypes","MEDIA_TYPE_TO_CATEGORY","MEDIA_TYPES","IMAGE","VIDEO","AUDIO","extractAudioUrl","audio","_audio$assets","firstAsset","assets","url","undefined","extractMediaUri","mediaItem","media","_media$image","_media$video","_media$document","image","video","document","useMediaControl","mediaType","readOnly","autoFocus","initialLoading","inputRef","viewRef","onFocus","onBlur","params","value","multiSelect","container","useContext","WixPatternsContainerContext","openMediaManager","loading","setLoading","useState","Boolean","mediaRequested","useRef","setActive","useCallback","_viewRef$current","_inputRef$current","current","focus","_inputRef$current2","useEffect","onMediaLoad","callMedia","index","onChange","category","Error","mediaManagerData","items","files","length","newURIs","map","newValue","splice","e","console","error","downloadMedia","mediaUri","_result$downloadUrls","result","generateFileDownloadUrl","downloadUrl","downloadUrls","executeDownloading","getMediaURL"],"sources":["../../../../src/components/media-control/use-media-control.ts"],"sourcesContent":["import { useRef, useState, useEffect, useCallback, useContext } from 'react';\nimport { WixPatternsContainerContext } from '@wix/bex-core/react';\nimport { files } from '@wix/media';\n\nimport { executeDownloading, MEDIA_TYPES } from '../../utils/media-utils';\nimport { getMediaURL } from '../../auto-field-types';\n\ntype Focusable = { focus: () => void };\ntype FocusableRef =\n  | React.RefObject<Focusable | undefined>\n  | React.MutableRefObject<Focusable | undefined>;\n\ninterface UseMediaControlBaseParams {\n  mediaType: MEDIA_TYPES;\n  autoFocus?: boolean;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  readOnly?: boolean;\n  initialLoading?: boolean;\n  inputRef?: FocusableRef;\n  viewRef?: FocusableRef;\n}\n\ninterface UseSingleMediaControlParams extends UseMediaControlBaseParams {\n  value?: string;\n  onChange?: (value: string) => void;\n  multiSelect?: false;\n}\n\ninterface UseMultiMediaControlParams extends UseMediaControlBaseParams {\n  value?: string[];\n  onChange?: (value: string[]) => void;\n  multiSelect: true;\n}\n\nexport type UseMediaControlParams =\n  | UseSingleMediaControlParams\n  | UseMultiMediaControlParams;\n\ninterface UseMediaControlBaseReturnType {\n  loading: boolean;\n  onMediaLoad: () => void;\n}\n\ninterface UseSingleMediaControlReturnType\n  extends UseMediaControlBaseReturnType {\n  callMedia(): Promise<boolean>;\n  downloadMedia(mediaUri?: string): Promise<void>;\n}\n\ninterface UseMultiMediaControlReturnType extends UseMediaControlBaseReturnType {\n  callMedia(index?: number): Promise<boolean>;\n  downloadMedia(mediaUri?: string): Promise<void>;\n}\n\nexport type UseMediaControlReturnType =\n  | UseSingleMediaControlReturnType\n  | UseMultiMediaControlReturnType;\n\nconst MEDIA_TYPE_TO_CATEGORY: Partial<Record<MEDIA_TYPES, string>> = {\n  [MEDIA_TYPES.IMAGE]: 'IMAGE',\n  [MEDIA_TYPES.VIDEO]: 'VIDEO',\n  [MEDIA_TYPES.AUDIO]: 'MUSIC',\n};\n\n/**\n * Extracts a playable URL from media.audio, which may be:\n *   - a string (wix:audio:// URI or direct URL)\n *   - an object with { audio: string } (nested URI)\n *   - an object with { assets: [{ url }] } or { assets: [string] }\n */\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst extractAudioUrl = (audio: any): string | undefined => {\n  if (audio) {\n    if (typeof audio === 'string') {\n      return audio;\n    }\n    if (typeof audio.audio === 'string') {\n      return audio.audio;\n    }\n    const firstAsset = audio.assets?.[0];\n    if (typeof firstAsset === 'string') {\n      return firstAsset;\n    }\n    if (typeof firstAsset?.url === 'string') {\n      return firstAsset.url;\n    }\n  }\n  return undefined;\n};\n\n/**\n * Extracts the Wix media URI from media manager result.\n * Media manager returns different structures for different media types.\n */\nconst extractMediaUri = (mediaItem: any): string => {\n  const { media } = mediaItem || {};\n  if (media) {\n    return (\n      // Try each media type: the URI is nested under media.[type].[type], fallback for direct string values\n      media.image?.image ||\n      (typeof media.image === 'string' && media.image) ||\n      media.video?.video ||\n      (typeof media.video === 'string' && media.video) ||\n      media.document?.document ||\n      (typeof media.document === 'string' && media.document) ||\n      extractAudioUrl(media.audio) ||\n      ''\n    );\n  }\n\n  return '';\n};\n\nexport function useMediaControl(\n  params: UseSingleMediaControlParams,\n): UseSingleMediaControlReturnType;\n\nexport function useMediaControl(\n  params: UseMultiMediaControlParams,\n): UseMultiMediaControlReturnType;\n\nexport function useMediaControl({\n  mediaType,\n  readOnly,\n  autoFocus,\n  initialLoading,\n  inputRef,\n  viewRef,\n  onFocus,\n  onBlur,\n  ...params\n}: UseMediaControlParams): UseMediaControlReturnType {\n  const { value, multiSelect } = params;\n  const container = useContext(WixPatternsContainerContext);\n  const openMediaManager = container?.openMediaManager;\n\n  const [loading, setLoading] = useState(Boolean(initialLoading && value));\n  const mediaRequested = useRef(false);\n\n  const setActive = useCallback(() => {\n    if (!autoFocus) {\n      return;\n    }\n\n    if (value) {\n      viewRef && viewRef?.current?.focus();\n      !viewRef && inputRef?.current?.focus();\n    } else {\n      inputRef?.current?.focus();\n    }\n  }, [autoFocus, value, inputRef, viewRef]);\n\n  // `loading` is a dependency because the focus target does not exist while the\n  // loader placeholder is up — the effect has to run again once it is gone.\n  useEffect(() => setActive(), [setActive, loading]);\n\n  const onMediaLoad = useCallback(() => setLoading(false), []);\n\n  const callMedia = useCallback(\n    async (index?: number): Promise<boolean> => {\n      if (mediaRequested.current || readOnly) {\n        return false;\n      }\n\n      if (!params.onChange) {\n        return false;\n      }\n\n      mediaRequested.current = true;\n\n      onFocus?.();\n      setLoading(true);\n\n      try {\n        const category = MEDIA_TYPE_TO_CATEGORY[mediaType];\n        if (!openMediaManager) {\n          throw new Error(\n            'Media Control Error: openMediaManager is not available in the current context.',\n          );\n        }\n        const mediaManagerData = await openMediaManager({\n          multiSelect: Boolean(multiSelect),\n          ...(category && { category }),\n        });\n\n        onBlur?.();\n        setLoading(false);\n\n        setActive();\n\n        mediaRequested.current = false;\n\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        const items =\n          mediaManagerData?.items || (mediaManagerData as any)?.files;\n\n        if (!items?.length) {\n          return false;\n        }\n\n        if (params.multiSelect) {\n          const newURIs = items.map(extractMediaUri);\n\n          if (!newURIs.length) {\n            throw new Error(\n              `Media Control Error: Media Manager returns not-covered Multi-Document data.`,\n            );\n          }\n\n          if (typeof index === 'number') {\n            const newValue = value ? [...value] : [];\n            newValue.splice(index, 1, ...newURIs);\n            params.onChange(newValue);\n          } else {\n            params.onChange([...((value as string[]) ?? []), ...newURIs]);\n          }\n        } else {\n          params.onChange(extractMediaUri(items[0]));\n        }\n        return true;\n      } catch (e) {\n        setLoading(false);\n        mediaRequested.current = false;\n        console.error(`Media Control Error:`, e);\n        return false;\n      }\n    },\n    [\n      mediaType,\n      multiSelect,\n      onBlur,\n      onFocus,\n      openMediaManager,\n      params,\n      readOnly,\n      setActive,\n      value,\n    ],\n  );\n\n  const downloadMedia = useCallback(async (mediaUri?: string) => {\n    if (!mediaUri) {\n      return;\n    }\n\n    try {\n      const result = await files.generateFileDownloadUrl(mediaUri);\n      const downloadUrl = result.downloadUrls?.[0]?.url;\n      if (!downloadUrl) {\n        throw new Error('No download URL returned');\n      }\n      return executeDownloading(downloadUrl);\n    } catch (error) {\n      // Fallback: open the static URL in a new tab\n      console.error('Media download error, falling back to static URL:', error);\n      return executeDownloading(getMediaURL(mediaUri));\n    }\n  }, []);\n\n  return {\n    loading,\n    callMedia,\n    downloadMedia,\n    onMediaLoad,\n  };\n}\n"],"mappings":"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","ignoreList":[]}