@wix/auto-patterns 1.48.0 → 1.49.0

package/dist/esm/cms-fields/components/audio/audio-player/audio-player.js

@@ -0,0 +1,41 @@
+import React, { useEffect, useState } from 'react';
+import { getMediaURL } from '../../../auto-cms-field-types';
+import { Box, AudioPlayer, Card, Text, CloseButton } from '@wix/design-system';
+import { getMediaTitle } from '../../../utils';
+import { classes } from './audio-player.st.css.js';
+export const FloatingAudioPlayer = _ref => {
+  let {
+    source,
+    onClose
+  } = _ref;
+  const [audioSrc, setAudioSrc] = useState(source);
+  useEffect(() => {
+    setAudioSrc(null);
+    onClose == null || onClose();
+  }, [onClose]);
+  if (!audioSrc) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(Card, {
+    className: classes.root,
+    showShadow: true,
+    controls: /*#__PURE__*/React.createElement(CloseButton, {
+      size: "medium",
+      onClick: onClose
+    })
+  }, /*#__PURE__*/React.createElement(Box, {
+    direction: "vertical",
+    paddingLeft: "SP6",
+    paddingRight: "SP6",
+    paddingTop: "SP5",
+    paddingBottom: "SP5",
+    width: "369px",
+    gap: "SP3"
+  }, /*#__PURE__*/React.createElement(Text, {
+    secondary: true
+  }, getMediaTitle(audioSrc)), /*#__PURE__*/React.createElement(AudioPlayer, {
+    autoplay: true,
+    src: getMediaURL(audioSrc)
+  })));
+};
+//# sourceMappingURL=audio-player.js.map

package/dist/esm/cms-fields/components/audio/audio-player/audio-player.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useState","getMediaURL","Box","AudioPlayer","Card","Text","CloseButton","getMediaTitle","classes","FloatingAudioPlayer","_ref","source","onClose","audioSrc","setAudioSrc","createElement","className","root","showShadow","controls","size","onClick","direction","paddingLeft","paddingRight","paddingTop","paddingBottom","width","gap","secondary","autoplay","src"],"sources":["../../../../../../src/cms-fields/components/audio/audio-player/audio-player.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport React, { useEffect, useState } from 'react';\n\nimport { getMediaURL } from '../../../auto-cms-field-types';\nimport { Box, AudioPlayer, Card, Text, CloseButton } from '@wix/design-system';\n\nimport { getMediaTitle } from '../../../utils';\nimport { classes } from './audio-player.st.css.js';\n\ninterface FloatingAudioPlayerProps {\n  source: string | null;\n  onClose: () => void;\n}\nexport const FloatingAudioPlayer: FC<FloatingAudioPlayerProps> = ({\n  source,\n  onClose,\n}) => {\n  const [audioSrc, setAudioSrc] = useState(source);\n\n  useEffect(() => {\n    setAudioSrc(null);\n    onClose?.();\n  }, [onClose]);\n\n  if (!audioSrc) {\n    return null;\n  }\n\n  return (\n    <Card\n      className={classes.root}\n      showShadow\n      controls={<CloseButton size=\"medium\" onClick={onClose} />}\n    >\n      <Box\n        direction=\"vertical\"\n        paddingLeft=\"SP6\"\n        paddingRight=\"SP6\"\n        paddingTop=\"SP5\"\n        paddingBottom=\"SP5\"\n        width=\"369px\"\n        gap=\"SP3\"\n      >\n        <Text secondary>{getMediaTitle(audioSrc)}</Text>\n        <AudioPlayer autoplay src={getMediaURL(audioSrc)} />\n      </Box>\n    </Card>\n  );\n};\n"],"mappings":"AACA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAElD,SAASC,WAAW,QAAQ,+BAA+B;AAC3D,SAASC,GAAG,EAAEC,WAAW,EAAEC,IAAI,EAAEC,IAAI,EAAEC,WAAW,QAAQ,oBAAoB;AAE9E,SAASC,aAAa,QAAQ,gBAAgB;AAC9C,SAASC,OAAO,QAAQ,0BAA0B;AAMlD,OAAO,MAAMC,mBAAiD,GAAGC,IAAA,IAG3D;EAAA,IAH4D;IAChEC,MAAM;IACNC;EACF,CAAC,GAAAF,IAAA;EACC,MAAM,CAACG,QAAQ,EAAEC,WAAW,CAAC,GAAGd,QAAQ,CAACW,MAAM,CAAC;EAEhDZ,SAAS,CAAC,MAAM;IACde,WAAW,CAAC,IAAI,CAAC;IACjBF,OAAO,YAAPA,OAAO,CAAG,CAAC;EACb,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,IAAI,CAACC,QAAQ,EAAE;IACb,OAAO,IAAI;EACb;EAEA,oBACEf,KAAA,CAAAiB,aAAA,CAACX,IAAI;IACHY,SAAS,EAAER,OAAO,CAACS,IAAK;IACxBC,UAAU;IACVC,QAAQ,eAAErB,KAAA,CAAAiB,aAAA,CAACT,WAAW;MAACc,IAAI,EAAC,QAAQ;MAACC,OAAO,EAAET;IAAQ,CAAE;EAAE,gBAE1Dd,KAAA,CAAAiB,aAAA,CAACb,GAAG;IACFoB,SAAS,EAAC,UAAU;IACpBC,WAAW,EAAC,KAAK;IACjBC,YAAY,EAAC,KAAK;IAClBC,UAAU,EAAC,KAAK;IAChBC,aAAa,EAAC,KAAK;IACnBC,KAAK,EAAC,OAAO;IACbC,GAAG,EAAC;EAAK,gBAET9B,KAAA,CAAAiB,aAAA,CAACV,IAAI;IAACwB,SAAS;EAAA,GAAEtB,aAAa,CAACM,QAAQ,CAAQ,CAAC,eAChDf,KAAA,CAAAiB,aAAA,CAACZ,WAAW;IAAC2B,QAAQ;IAACC,GAAG,EAAE9B,WAAW,CAACY,QAAQ;EAAE,CAAE,CAChD,CACD,CAAC;AAEX,CAAC","ignoreList":[]}

package/dist/esm/cms-fields/components/audio/audio-player/audio-player.st.css.js

@@ -0,0 +1,18 @@
+// @ts-nocheck
+
+import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.js";
+var _namespace_ = "audioplayer1393447092";
+var _style_ = classesRuntime.bind(null, _namespace_);
+export var cssStates = statesRuntime.bind(null, _namespace_);
+export var style = _style_;
+export var st = _style_;
+export var namespace = _namespace_;
+export var classes = {
+  "root": "audioplayer1393447092__root"
+};
+export var keyframes = {};
+export var layers = {};
+export var containers = {};
+export var stVars = {};
+export var vars = {};
+//# sourceMappingURL=audio-player.st.css.js.map

package/dist/esm/cms-fields/components/audio/audio-player/audio-player.st.css.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["classesRuntime","statesRuntime","_namespace_","_style_","bind","cssStates","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../../../src/cms-fields/components/audio/audio-player/audio-player.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"audioplayer1393447092\";\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\":\"audioplayer1393447092__root\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":"AAAA;;AAGA,SAASA,cAAc,EAAEC,aAAa,QAAQ,qCAAqC;AAInF,IAAIC,WAAW,GAAG,uBAAuB;AACzC,IAAIC,OAAO,GAAGH,cAAc,CAACI,IAAI,CAAC,IAAI,EAAEF,WAAW,CAAC;AAEpD,OAAO,IAAIG,SAAS,GAAGJ,aAAa,CAACG,IAAI,CAAC,IAAI,EAAEF,WAAW,CAAC;AAC5D,OAAO,IAAII,KAA6C,GAAGH,OAAO;AAClE,OAAO,IAAII,EAA0C,GAAGJ,OAAO;AAE/D,OAAO,IAAIK,SAAS,GAAGN,WAAW;AAClC,OAAO,IAAIO,OAAO,GAAG;EAAC,MAAM,EAAC;AAA6B,CAAC;AAC3D,OAAO,IAAIC,SAAS,GAAG,CAAC,CAAC;AACzB,OAAO,IAAIC,MAAM,GAAG,CAAC,CAAC;AACtB,OAAO,IAAIC,UAAU,GAAG,CAAC,CAAC;AAC1B,OAAO,IAAIC,MAAM,GAAG,CAAC,CAAC;AACtB,OAAO,IAAIC,IAAI,GAAG,CAAC,CAAC","ignoreList":[]}

package/dist/esm/cms-fields/components/audio/audio-player/index.js

@@ -0,0 +1,2 @@
+export * from './audio-player';
+//# sourceMappingURL=index.js.map

package/dist/esm/cms-fields/components/audio/audio-player/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["../../../../../../src/cms-fields/components/audio/audio-player/index.ts"],"sourcesContent":["export * from './audio-player';\n"],"mappings":"AAAA,cAAc,gBAAgB","ignoreList":[]}

package/dist/esm/cms-fields/components/audio/index.js

@@ -0,0 +1,3 @@
+export * from './audio-player';
+export * from './audio-field';
+//# sourceMappingURL=index.js.map

package/dist/esm/cms-fields/components/audio/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["../../../../../src/cms-fields/components/audio/index.ts"],"sourcesContent":["export * from './audio-player';\nexport * from './audio-field';\n"],"mappings":"AAAA,cAAc,gBAAgB;AAC9B,cAAc,eAAe","ignoreList":[]}

package/dist/esm/cms-fields/components/delete-dialog/delete-dialog.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { CustomModalLayout, Modal } from '@wix/design-system';
+import { useTranslations } from '../../hooks';
+import { style, classes } from './delete-dialog.st.css.js';
+export const DeleteDialog = _ref => {
+  let {
+    open,
+    onDelete,
+    className,
+    title,
+    children,
+    primaryButtonText,
+    secondaryButtonText,
+    onClose
+  } = _ref;
+  const {
+    t
+  } = useTranslations();
+  return /*#__PURE__*/React.createElement(Modal, {
+    isOpen: open,
+    dataHook: "delete-dialog-modal",
+    onRequestClose: onClose
+  }, /*#__PURE__*/React.createElement(CustomModalLayout, {
+    dataHook: "delete-dialog-layout",
+    className: style(classes.layout, className),
+    title: title,
+    onCloseButtonClick: onClose,
+    primaryButtonText: primaryButtonText ?? t('CMS.document.delete.confirm'),
+    secondaryButtonText: secondaryButtonText ?? t('CMS.document.delete.cancel'),
+    primaryButtonOnClick: onDelete,
+    secondaryButtonOnClick: onClose,
+    primaryButtonProps: {
+      skin: 'destructive'
+    },
+    secondaryButtonProps: {
+      skin: 'destructive',
+      priority: 'secondary'
+    }
+  }, children));
+};
+//# sourceMappingURL=delete-dialog.js.map

package/dist/esm/cms-fields/components/delete-dialog/delete-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","CustomModalLayout","Modal","useTranslations","style","classes","DeleteDialog","_ref","open","onDelete","className","title","children","primaryButtonText","secondaryButtonText","onClose","t","createElement","isOpen","dataHook","onRequestClose","layout","onCloseButtonClick","primaryButtonOnClick","secondaryButtonOnClick","primaryButtonProps","skin","secondaryButtonProps","priority"],"sources":["../../../../../src/cms-fields/components/delete-dialog/delete-dialog.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CustomModalLayout, Modal } from '@wix/design-system';\n\nimport { useTranslations } from '../../hooks';\nimport { style, classes } from './delete-dialog.st.css.js';\nimport type { DeleteDialogProps } from './types';\n\nexport const DeleteDialog: React.FC<DeleteDialogProps> = ({\n  open,\n  onDelete,\n  className,\n  title,\n  children,\n  primaryButtonText,\n  secondaryButtonText,\n  onClose,\n}) => {\n  const { t } = useTranslations();\n\n  return (\n    <Modal\n      isOpen={open}\n      dataHook=\"delete-dialog-modal\"\n      onRequestClose={onClose}\n    >\n      <CustomModalLayout\n        dataHook=\"delete-dialog-layout\"\n        className={style(classes.layout, className)}\n        title={title}\n        onCloseButtonClick={onClose}\n        primaryButtonText={\n          primaryButtonText ?? t('CMS.document.delete.confirm')\n        }\n        secondaryButtonText={\n          secondaryButtonText ?? t('CMS.document.delete.cancel')\n        }\n        primaryButtonOnClick={onDelete}\n        secondaryButtonOnClick={onClose}\n        primaryButtonProps={{\n          skin: 'destructive',\n        }}\n        secondaryButtonProps={{\n          skin: 'destructive',\n          priority: 'secondary',\n        }}\n      >\n        {children}\n      </CustomModalLayout>\n    </Modal>\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,iBAAiB,EAAEC,KAAK,QAAQ,oBAAoB;AAE7D,SAASC,eAAe,QAAQ,aAAa;AAC7C,SAASC,KAAK,EAAEC,OAAO,QAAQ,2BAA2B;AAG1D,OAAO,MAAMC,YAAyC,GAAGC,IAAA,IASnD;EAAA,IAToD;IACxDC,IAAI;IACJC,QAAQ;IACRC,SAAS;IACTC,KAAK;IACLC,QAAQ;IACRC,iBAAiB;IACjBC,mBAAmB;IACnBC;EACF,CAAC,GAAAR,IAAA;EACC,MAAM;IAAES;EAAE,CAAC,GAAGb,eAAe,CAAC,CAAC;EAE/B,oBACEH,KAAA,CAAAiB,aAAA,CAACf,KAAK;IACJgB,MAAM,EAAEV,IAAK;IACbW,QAAQ,EAAC,qBAAqB;IAC9BC,cAAc,EAAEL;EAAQ,gBAExBf,KAAA,CAAAiB,aAAA,CAAChB,iBAAiB;IAChBkB,QAAQ,EAAC,sBAAsB;IAC/BT,SAAS,EAAEN,KAAK,CAACC,OAAO,CAACgB,MAAM,EAAEX,SAAS,CAAE;IAC5CC,KAAK,EAAEA,KAAM;IACbW,kBAAkB,EAAEP,OAAQ;IAC5BF,iBAAiB,EACfA,iBAAiB,IAAIG,CAAC,CAAC,6BAA6B,CACrD;IACDF,mBAAmB,EACjBA,mBAAmB,IAAIE,CAAC,CAAC,4BAA4B,CACtD;IACDO,oBAAoB,EAAEd,QAAS;IAC/Be,sBAAsB,EAAET,OAAQ;IAChCU,kBAAkB,EAAE;MAClBC,IAAI,EAAE;IACR,CAAE;IACFC,oBAAoB,EAAE;MACpBD,IAAI,EAAE,aAAa;MACnBE,QAAQ,EAAE;IACZ;EAAE,GAEDhB,QACgB,CACd,CAAC;AAEZ,CAAC","ignoreList":[]}

package/dist/esm/cms-fields/components/delete-dialog/delete-dialog.st.css.js

@@ -0,0 +1,19 @@
+// @ts-nocheck
+
+import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js";
+var _namespace_ = "deletedialog130352157";
+var _style_ = classesRuntime.bind(null, _namespace_);
+export var cssStates = statesRuntime.bind(null, _namespace_);
+export var style = _style_;
+export var st = _style_;
+export var namespace = _namespace_;
+export var classes = {
+  "root": "deletedialog130352157__root",
+  "layout": "deletedialog130352157__layout"
+};
+export var keyframes = {};
+export var layers = {};
+export var containers = {};
+export var stVars = {};
+export var vars = {};
+//# sourceMappingURL=delete-dialog.st.css.js.map

package/dist/esm/cms-fields/components/delete-dialog/delete-dialog.st.css.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["classesRuntime","statesRuntime","_namespace_","_style_","bind","cssStates","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../../src/cms-fields/components/delete-dialog/delete-dialog.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"deletedialog130352157\";\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\":\"deletedialog130352157__root\",\"layout\":\"deletedialog130352157__layout\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":"AAAA;;AAGA,SAASA,cAAc,EAAEC,aAAa,QAAQ,kCAAkC;AAIhF,IAAIC,WAAW,GAAG,uBAAuB;AACzC,IAAIC,OAAO,GAAGH,cAAc,CAACI,IAAI,CAAC,IAAI,EAAEF,WAAW,CAAC;AAEpD,OAAO,IAAIG,SAAS,GAAGJ,aAAa,CAACG,IAAI,CAAC,IAAI,EAAEF,WAAW,CAAC;AAC5D,OAAO,IAAII,KAA6C,GAAGH,OAAO;AAClE,OAAO,IAAII,EAA0C,GAAGJ,OAAO;AAE/D,OAAO,IAAIK,SAAS,GAAGN,WAAW;AAClC,OAAO,IAAIO,OAAO,GAAG;EAAC,MAAM,EAAC,6BAA6B;EAAC,QAAQ,EAAC;AAA+B,CAAC;AACpG,OAAO,IAAIC,SAAS,GAAG,CAAC,CAAC;AACzB,OAAO,IAAIC,MAAM,GAAG,CAAC,CAAC;AACtB,OAAO,IAAIC,UAAU,GAAG,CAAC,CAAC;AAC1B,OAAO,IAAIC,MAAM,GAAG,CAAC,CAAC;AACtB,OAAO,IAAIC,IAAI,GAAG,CAAC,CAAC","ignoreList":[]}

package/dist/esm/cms-fields/components/delete-dialog/index.js

@@ -0,0 +1,3 @@
+export * from './delete-dialog';
+export * from './types';
+//# sourceMappingURL=index.js.map

package/dist/esm/cms-fields/components/delete-dialog/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["../../../../../src/cms-fields/components/delete-dialog/index.ts"],"sourcesContent":["export * from './delete-dialog';\nexport * from './types';\n"],"mappings":"AAAA,cAAc,iBAAiB;AAC/B,cAAc,SAAS","ignoreList":[]}

package/dist/esm/cms-fields/components/delete-dialog/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/esm/cms-fields/components/delete-dialog/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["../../../../../src/cms-fields/components/delete-dialog/types.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nexport interface DeleteDialogProps {\n  className?: string;\n  open: boolean;\n  onClose: () => void;\n  onDelete: () => void;\n  title?: string;\n  primaryButtonText?: string;\n  secondaryButtonText?: string;\n  children?: ReactNode;\n}\n"],"mappings":"","ignoreList":[]}

package/dist/esm/cms-fields/components/document/add-document-button.js

@@ -0,0 +1,31 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { AddItem, Box } from '@wix/design-system';
+import { DocumentLoader } from './document-loader';
+import { style, classes } from './form-document-field.st.css.js';
+import { useTranslations } from '../../hooks';
+export const AddDocumentButton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    loading,
+    error,
+    loaderBorderStyle,
+    className,
+    ...props
+  } = _ref;
+  const {
+    t
+  } = useTranslations();
+  return loading ? /*#__PURE__*/React.createElement(DocumentLoader, {
+    borderStyle: loaderBorderStyle
+  }) : /*#__PURE__*/React.createElement(Box, {
+    className: style(classes.addItemWrapper, className),
+    dataHook: "add-document-button"
+  }, /*#__PURE__*/React.createElement(AddItem, _extends({}, props, {
+    ref: ref,
+    className: style(classes.addDocument, {
+      error
+    }, className)
+  }), t('CMS.document.add.button.text')));
+});
+AddDocumentButton.displayName = 'AddDocumentButton';
+//# sourceMappingURL=add-document-button.js.map

package/dist/esm/cms-fields/components/document/add-document-button.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","AddItem","Box","DocumentLoader","style","classes","useTranslations","AddDocumentButton","forwardRef","_ref","ref","loading","error","loaderBorderStyle","className","props","t","createElement","borderStyle","addItemWrapper","dataHook","_extends","addDocument","displayName"],"sources":["../../../../../src/cms-fields/components/document/add-document-button.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { AddItemProps, AddItemActions } from '@wix/design-system';\nimport { AddItem, Box } from '@wix/design-system';\n\nimport { DocumentLoader } from './document-loader';\nimport { style, classes } from './form-document-field.st.css.js';\nimport { useTranslations } from '../../hooks';\n\nexport interface AddDocumentButtonProps extends AddItemProps {\n  loading?: boolean;\n  error?: boolean;\n  loaderBorderStyle?: 'solid' | 'dashed';\n}\n\nexport const AddDocumentButton = React.forwardRef<\n  AddItemActions,\n  AddDocumentButtonProps\n>(({ loading, error, loaderBorderStyle, className, ...props }, ref) => {\n  const { t } = useTranslations();\n\n  return loading ? (\n    <DocumentLoader borderStyle={loaderBorderStyle} />\n  ) : (\n    <Box\n      className={style(classes.addItemWrapper, className)}\n      dataHook=\"add-document-button\"\n    >\n      <AddItem\n        {...props}\n        ref={ref}\n        className={style(classes.addDocument, { error }, className)}\n      >\n        {t('CMS.document.add.button.text')}\n      </AddItem>\n    </Box>\n  );\n});\n\nAddDocumentButton.displayName = 'AddDocumentButton';\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAGzB,SAASC,OAAO,EAAEC,GAAG,QAAQ,oBAAoB;AAEjD,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,KAAK,EAAEC,OAAO,QAAQ,iCAAiC;AAChE,SAASC,eAAe,QAAQ,aAAa;AAQ7C,OAAO,MAAMC,iBAAiB,gBAAGP,KAAK,CAACQ,UAAU,CAG/C,CAAAC,IAAA,EAA6DC,GAAG,KAAK;EAAA,IAApE;IAAEC,OAAO;IAAEC,KAAK;IAAEC,iBAAiB;IAAEC,SAAS;IAAE,GAAGC;EAAM,CAAC,GAAAN,IAAA;EAC3D,MAAM;IAAEO;EAAE,CAAC,GAAGV,eAAe,CAAC,CAAC;EAE/B,OAAOK,OAAO,gBACZX,KAAA,CAAAiB,aAAA,CAACd,cAAc;IAACe,WAAW,EAAEL;EAAkB,CAAE,CAAC,gBAElDb,KAAA,CAAAiB,aAAA,CAACf,GAAG;IACFY,SAAS,EAAEV,KAAK,CAACC,OAAO,CAACc,cAAc,EAAEL,SAAS,CAAE;IACpDM,QAAQ,EAAC;EAAqB,gBAE9BpB,KAAA,CAAAiB,aAAA,CAAChB,OAAO,EAAAoB,QAAA,KACFN,KAAK;IACTL,GAAG,EAAEA,GAAI;IACTI,SAAS,EAAEV,KAAK,CAACC,OAAO,CAACiB,WAAW,EAAE;MAAEV;IAAM,CAAC,EAAEE,SAAS;EAAE,IAE3DE,CAAC,CAAC,8BAA8B,CAC1B,CACN,CACN;AACH,CAAC,CAAC;AAEFT,iBAAiB,CAACgB,WAAW,GAAG,mBAAmB","ignoreList":[]}

package/dist/esm/cms-fields/components/document/document-control.js

@@ -0,0 +1,134 @@
+import React, { useCallback, useRef } from 'react';
+import { getMediaTitle } from '../../utils/media-utils';
+import { getMediaURL } from '../../auto-cms-field-types';
+import { Text, Box, TableListItem, TableActionCell } from '@wix/design-system';
+import { Delete, Replace, Document, Link, Download } from '@wix/wix-ui-icons-common';
+import { useTranslations } from '../../hooks';
+import { classes } from './form-document-field.st.css.js';
+import { DocumentLoader } from './document-loader';
+import { openDocument } from './utils';
+import { useWixPatternsContainer } from '@wix/patterns';
+const DOCUMENT_VIEW_ACTIONS_WIDTH = '196px';
+const DocumentComponent = _ref => {
+  let {
+    mediaURI
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Box, {
+    gap: "SP2",
+    verticalAlign: "middle",
+    className: classes.textWidth
+  }, /*#__PURE__*/React.createElement(Box, {
+    width: "24px",
+    height: "24px",
+    children: /*#__PURE__*/React.createElement(Document, null)
+  }), /*#__PURE__*/React.createElement(Text, {
+    dataHook: "document-view-name",
+    secondary: true,
+    ellipsis: true,
+    children: getMediaTitle(mediaURI)
+  }));
+};
+export const DocumentControl = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
+  let {
+    mediaURI,
+    readOnly,
+    onReplace,
+    onDelete,
+    onDownload,
+    dataHook,
+    className,
+    loading,
+    loaderBorderStyle,
+    loaderClassName,
+    onOpenPasteURLForm
+  } = _ref2;
+  const {
+    t
+  } = useTranslations();
+  const {
+    environment
+  } = useWixPatternsContainer();
+  const metaSiteId = environment.msid;
+  const handleOpenDocument = useCallback(() => {
+    openDocument(getMediaURL(mediaURI, metaSiteId));
+  }, [mediaURI, metaSiteId]);
+  const handleDownload = useCallback(() => {
+    onDownload(mediaURI);
+  }, [mediaURI, onDownload]);
+  const containerRef = useRef(null);
+  const handleOnKeydown = useCallback(event => {
+    var _containerRef$current;
+    const actions = containerRef == null || (_containerRef$current = containerRef.current) == null ? void 0 : _containerRef$current.querySelector(`[data-hook="document-view-actions-button"]`);
+    if (actions != null && actions.contains(document.activeElement)) {
+      return;
+    }
+    if (event.key === 'Enter') {
+      handleOpenDocument();
+    }
+  }, [handleOpenDocument, containerRef]);
+  return loading ? /*#__PURE__*/React.createElement(DocumentLoader, {
+    borderStyle: loaderBorderStyle,
+    className: loaderClassName
+  }) : /*#__PURE__*/React.createElement("div", {
+    ref: containerRef,
+    onKeyDown: handleOnKeydown
+  }, /*#__PURE__*/React.createElement(TableListItem, {
+    dataHook: dataHook,
+    ref: ref,
+    className: className,
+    onClick: handleOpenDocument,
+    verticalPadding: "tiny",
+    options: [{
+      value: /*#__PURE__*/React.createElement(DocumentComponent, {
+        mediaURI: mediaURI
+      }),
+      width: '75%'
+    }, {
+      value: /*#__PURE__*/React.createElement(TableActionCell, {
+        dataHook: "document-view-actions-button",
+        alwaysShowSecondaryActions: true,
+        numOfVisibleSecondaryActions: 1,
+        primaryAction: {
+          onClick: handleOpenDocument,
+          skin: 'standard',
+          text: t('CMS.document.action.open'),
+          dataHook: 'document-view-open-action'
+        },
+        popoverMenuProps: {
+          textSize: 'medium',
+          minWidth: '232px'
+        },
+        secondaryActions: [{
+          icon: /*#__PURE__*/React.createElement(Download, null),
+          onClick: handleDownload,
+          disabled: readOnly,
+          dataHook: 'document-view-download-action',
+          text: t('CMS.document.action.download')
+        }, {
+          icon: /*#__PURE__*/React.createElement(Replace, null),
+          onClick: onReplace,
+          text: t('CMS.document.action.replace'),
+          dataHook: 'document-view-replace-action',
+          disabled: readOnly
+        }, {
+          icon: /*#__PURE__*/React.createElement(Link, null),
+          onClick: onOpenPasteURLForm,
+          text: t('CMS.document.action.replaceWithUrl'),
+          dataHook: 'document-view-replace-with-url-action',
+          disabled: readOnly
+        }, {
+          divider: true
+        }, {
+          icon: /*#__PURE__*/React.createElement(Delete, null),
+          onClick: onDelete,
+          text: t('CMS.document.action.delete'),
+          dataHook: 'document-view-delete-action',
+          disabled: readOnly
+        }]
+      }),
+      width: DOCUMENT_VIEW_ACTIONS_WIDTH,
+      align: 'right'
+    }]
+  }));
+});
+//# sourceMappingURL=document-control.js.map

package/dist/esm/cms-fields/components/document/document-control.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useRef","getMediaTitle","getMediaURL","Text","Box","TableListItem","TableActionCell","Delete","Replace","Document","Link","Download","useTranslations","classes","DocumentLoader","openDocument","useWixPatternsContainer","DOCUMENT_VIEW_ACTIONS_WIDTH","DocumentComponent","_ref","mediaURI","createElement","gap","verticalAlign","className","textWidth","width","height","children","dataHook","secondary","ellipsis","DocumentControl","forwardRef","_ref2","ref","readOnly","onReplace","onDelete","onDownload","loading","loaderBorderStyle","loaderClassName","onOpenPasteURLForm","t","environment","metaSiteId","msid","handleOpenDocument","handleDownload","containerRef","handleOnKeydown","event","_containerRef$current","actions","current","querySelector","contains","document","activeElement","key","borderStyle","onKeyDown","onClick","verticalPadding","options","value","alwaysShowSecondaryActions","numOfVisibleSecondaryActions","primaryAction","skin","text","popoverMenuProps","textSize","minWidth","secondaryActions","icon","disabled","divider","align"],"sources":["../../../../../src/cms-fields/components/document/document-control.tsx"],"sourcesContent":["import React, { useCallback, useRef } from 'react';\n\nimport { getMediaTitle } from '../../utils/media-utils';\nimport { getMediaURL } from '../../auto-cms-field-types';\nimport type { TableListItemImperativeActions } from '@wix/design-system';\nimport { Text, Box, TableListItem, TableActionCell } from '@wix/design-system';\nimport {\n  Delete,\n  Replace,\n  Document,\n  Link,\n  Download,\n} from '@wix/wix-ui-icons-common';\nimport { useTranslations } from '../../hooks';\n\nimport { classes } from './form-document-field.st.css.js';\nimport { DocumentLoader } from './document-loader';\nimport { openDocument } from './utils';\nimport { useWixPatternsContainer } from '@wix/patterns';\n\nconst DOCUMENT_VIEW_ACTIONS_WIDTH = '196px';\n\nconst DocumentComponent = ({ mediaURI }: { mediaURI: string }) => {\n  return (\n    <Box gap=\"SP2\" verticalAlign=\"middle\" className={classes.textWidth}>\n      <Box width=\"24px\" height=\"24px\" children={<Document />} />\n      <Text\n        dataHook=\"document-view-name\"\n        secondary\n        ellipsis\n        children={getMediaTitle(mediaURI)}\n      />\n    </Box>\n  );\n};\ninterface DocumentControl {\n  mediaURI: string;\n  readOnly?: boolean;\n  onReplace: () => void;\n  onDelete: () => void;\n  onDownload: (mediaURI: string) => void;\n  className?: string;\n  loading: boolean;\n  loaderBorderStyle?: 'solid' | 'dashed';\n  loaderClassName?: string;\n  dataHook?: string;\n  onOpenPasteURLForm: () => void;\n}\n\nexport const DocumentControl = React.forwardRef<\n  TableListItemImperativeActions,\n  DocumentControl\n>(\n  (\n    {\n      mediaURI,\n      readOnly,\n      onReplace,\n      onDelete,\n      onDownload,\n      dataHook,\n      className,\n      loading,\n      loaderBorderStyle,\n      loaderClassName,\n      onOpenPasteURLForm,\n    },\n    ref,\n  ) => {\n    const { t } = useTranslations();\n    const { environment } = useWixPatternsContainer();\n    const metaSiteId = environment.msid;\n\n    const handleOpenDocument = useCallback(() => {\n      openDocument(getMediaURL(mediaURI, metaSiteId));\n    }, [mediaURI, metaSiteId]);\n\n    const handleDownload = useCallback(() => {\n      onDownload(mediaURI);\n    }, [mediaURI, onDownload]);\n\n    const containerRef = useRef<HTMLDivElement>(null);\n\n    const handleOnKeydown = useCallback<React.KeyboardEventHandler>(\n      (event) => {\n        const actions = containerRef?.current?.querySelector(\n          `[data-hook=\"document-view-actions-button\"]`,\n        );\n\n        if (actions?.contains(document.activeElement)) {\n          return;\n        }\n\n        if (event.key === 'Enter') {\n          handleOpenDocument();\n        }\n      },\n      [handleOpenDocument, containerRef],\n    );\n\n    return loading ? (\n      <DocumentLoader\n        borderStyle={loaderBorderStyle}\n        className={loaderClassName}\n      />\n    ) : (\n      <div ref={containerRef} onKeyDown={handleOnKeydown}>\n        <TableListItem\n          dataHook={dataHook}\n          ref={ref}\n          className={className}\n          onClick={handleOpenDocument}\n          verticalPadding=\"tiny\"\n          options={[\n            {\n              value: <DocumentComponent mediaURI={mediaURI} />,\n              width: '75%',\n            },\n            {\n              value: (\n                <TableActionCell\n                  dataHook=\"document-view-actions-button\"\n                  alwaysShowSecondaryActions\n                  numOfVisibleSecondaryActions={1}\n                  primaryAction={{\n                    onClick: handleOpenDocument,\n                    skin: 'standard',\n                    text: t('CMS.document.action.open'),\n                    dataHook: 'document-view-open-action',\n                  }}\n                  popoverMenuProps={{\n                    textSize: 'medium',\n                    minWidth: '232px',\n                  }}\n                  secondaryActions={[\n                    {\n                      icon: <Download />,\n                      onClick: handleDownload,\n                      disabled: readOnly,\n                      dataHook: 'document-view-download-action',\n                      text: t('CMS.document.action.download'),\n                    },\n                    {\n                      icon: <Replace />,\n                      onClick: onReplace,\n                      text: t('CMS.document.action.replace'),\n                      dataHook: 'document-view-replace-action',\n                      disabled: readOnly,\n                    },\n                    {\n                      icon: <Link />,\n                      onClick: onOpenPasteURLForm,\n                      text: t('CMS.document.action.replaceWithUrl'),\n                      dataHook: 'document-view-replace-with-url-action',\n                      disabled: readOnly,\n                    },\n                    {\n                      divider: true,\n                    },\n                    {\n                      icon: <Delete />,\n                      onClick: onDelete,\n                      text: t('CMS.document.action.delete'),\n                      dataHook: 'document-view-delete-action',\n                      disabled: readOnly,\n                    },\n                  ]}\n                />\n              ),\n              width: DOCUMENT_VIEW_ACTIONS_WIDTH,\n              align: 'right',\n            },\n          ]}\n        />\n      </div>\n    );\n  },\n);\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/cms-fields/components/document/document-loader.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import { Box, Loader } from '@wix/design-system';
+import { style, classes } from './form-document-field.st.css.js';
+export const DocumentLoader = _ref => {
+  let {
+    className,
+    borderStyle: _borderStyle
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Box, {
+    align: "center",
+    verticalAlign: "middle",
+    className: style(classes.documentLoader, className)
+  }, /*#__PURE__*/React.createElement(Loader, {
+    size: "tiny"
+  }));
+};
+//# sourceMappingURL=document-loader.js.map

package/dist/esm/cms-fields/components/document/document-loader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Box","Loader","style","classes","DocumentLoader","_ref","className","borderStyle","_borderStyle","createElement","align","verticalAlign","documentLoader","size"],"sources":["../../../../../src/cms-fields/components/document/document-loader.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport React from 'react';\nimport { Box, Loader } from '@wix/design-system';\n\nimport { style, classes } from './form-document-field.st.css.js';\n\nexport interface DocumentLoaderProps {\n  borderStyle?: 'solid' | 'dashed';\n  className?: string;\n}\n\nexport const DocumentLoader: FC<DocumentLoaderProps> = ({\n  className,\n  borderStyle: _borderStyle,\n}) => (\n  <Box\n    align=\"center\"\n    verticalAlign=\"middle\"\n    className={style(classes.documentLoader, className)}\n  >\n    <Loader size=\"tiny\" />\n  </Box>\n);\n"],"mappings":"AACA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,GAAG,EAAEC,MAAM,QAAQ,oBAAoB;AAEhD,SAASC,KAAK,EAAEC,OAAO,QAAQ,iCAAiC;AAOhE,OAAO,MAAMC,cAAuC,GAAGC,IAAA;EAAA,IAAC;IACtDC,SAAS;IACTC,WAAW,EAAEC;EACf,CAAC,GAAAH,IAAA;EAAA,oBACCN,KAAA,CAAAU,aAAA,CAACT,GAAG;IACFU,KAAK,EAAC,QAAQ;IACdC,aAAa,EAAC,QAAQ;IACtBL,SAAS,EAAEJ,KAAK,CAACC,OAAO,CAACS,cAAc,EAAEN,SAAS;EAAE,gBAEpDP,KAAA,CAAAU,aAAA,CAACR,MAAM;IAACY,IAAI,EAAC;EAAM,CAAE,CAClB,CAAC;AAAA,CACP","ignoreList":[]}

package/dist/esm/cms-fields/components/document/document-view.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import { Badge, Box } from '@wix/design-system';
+import { DocumentSmall } from '@wix/wix-ui-icons-common';
+import { getMediaTitle } from '../../utils/media-utils';
+export const DocumentView = _ref => {
+  let {
+    data
+  } = _ref;
+  return data ? /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Badge, {
+    prefixIcon: /*#__PURE__*/React.createElement(DocumentSmall, null),
+    size: "small",
+    skin: "neutralStandard"
+  }, getMediaTitle(data))) : null;
+};
+//# sourceMappingURL=document-view.js.map

package/dist/esm/cms-fields/components/document/document-view.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Badge","Box","DocumentSmall","getMediaTitle","DocumentView","_ref","data","createElement","prefixIcon","size","skin"],"sources":["../../../../../src/cms-fields/components/document/document-view.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Badge, Box } from '@wix/design-system';\nimport { DocumentSmall } from '@wix/wix-ui-icons-common';\n\nimport { getMediaTitle } from '../../utils/media-utils';\n\nexport interface DocumentViewProps {\n  data: string;\n}\n\nexport const DocumentView: React.FC<DocumentViewProps> = ({ data }) => {\n  return data ? (\n    <Box>\n      <Badge prefixIcon={<DocumentSmall />} size=\"small\" skin=\"neutralStandard\">\n        {getMediaTitle(data)}\n      </Badge>\n    </Box>\n  ) : null;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,KAAK,EAAEC,GAAG,QAAQ,oBAAoB;AAC/C,SAASC,aAAa,QAAQ,0BAA0B;AAExD,SAASC,aAAa,QAAQ,yBAAyB;AAMvD,OAAO,MAAMC,YAAyC,GAAGC,IAAA,IAAc;EAAA,IAAb;IAAEC;EAAK,CAAC,GAAAD,IAAA;EAChE,OAAOC,IAAI,gBACTP,KAAA,CAAAQ,aAAA,CAACN,GAAG,qBACFF,KAAA,CAAAQ,aAAA,CAACP,KAAK;IAACQ,UAAU,eAAET,KAAA,CAAAQ,aAAA,CAACL,aAAa,MAAE,CAAE;IAACO,IAAI,EAAC,OAAO;IAACC,IAAI,EAAC;EAAiB,GACtEP,aAAa,CAACG,IAAI,CACd,CACJ,CAAC,GACJ,IAAI;AACV,CAAC","ignoreList":[]}

package/dist/esm/cms-fields/components/document/form/index.js

@@ -0,0 +1,6 @@
+export * from '../form-document-field';
+export * from '../document-control';
+export * from '../add-document-button';
+export * from '../form-document-input';
+export * from '../utils';
+//# sourceMappingURL=index.js.map

package/dist/esm/cms-fields/components/document/form/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["../../../../../../src/cms-fields/components/document/form/index.ts"],"sourcesContent":["export * from '../form-document-field';\nexport * from '../document-control';\nexport * from '../add-document-button';\nexport * from '../form-document-input';\nexport * from '../utils';\n"],"mappings":"AAAA,cAAc,wBAAwB;AACtC,cAAc,qBAAqB;AACnC,cAAc,wBAAwB;AACtC,cAAc,wBAAwB;AACtC,cAAc,UAAU","ignoreList":[]}

package/dist/esm/cms-fields/components/document/form-document-field.js

@@ -0,0 +1,83 @@
+import React, { useRef } from 'react';
+import { MEDIA_TYPES } from '../../utils/media-utils';
+import { useTranslations, useWithCallback } from '../../hooks';
+import { PasteURLForm, useMediaControl, usePasteURLForm } from '../media-control';
+import { DocumentControl } from './document-control';
+import { classes } from './form-document-field.st.css.js';
+import { FormDocumentInput } from './form-document-input';
+export { classes as documentClasses } from './form-document-field.st.css.js';
+export const FormDocumentField = _ref => {
+  let {
+    data,
+    onChange: onChangeDocument,
+    onClear: onClearDocument,
+    onInput,
+    autoFocus,
+    readOnly,
+    invalid,
+    dataHook
+  } = _ref;
+  const {
+    t
+  } = useTranslations();
+  const onChange = useWithCallback(onChangeDocument, onInput);
+  const onClear = useWithCallback(onClearDocument, onInput);
+  const inputRef = useRef(null);
+  const viewRef = useRef(null);
+  const {
+    callMedia,
+    loading,
+    downloadMedia
+  } = useMediaControl({
+    mediaType: MEDIA_TYPES.ALL_MEDIA,
+    value: data,
+    onChange,
+    autoFocus,
+    readOnly,
+    inputRef,
+    viewRef
+  });
+  const {
+    isOpen,
+    title,
+    onOpen,
+    onClose,
+    onSave
+  } = usePasteURLForm({
+    onChange
+  });
+  return /*#__PURE__*/React.createElement(React.Fragment, null, !data ? /*#__PURE__*/React.createElement(FormDocumentInput, {
+    dataHook: dataHook,
+    ref: inputRef,
+    theme: "dashes",
+    disabled: readOnly,
+    loading: loading,
+    error: invalid,
+    loaderBorderStyle: "dashed",
+    onAddButtonClick: callMedia,
+    onPasteURLButtonClick: onOpen({
+      title: t('CMS.document.pasteUrl.title')
+    })
+  }) : /*#__PURE__*/React.createElement(DocumentControl, {
+    dataHook: dataHook,
+    ref: viewRef,
+    mediaURI: data,
+    readOnly: readOnly,
+    onReplace: callMedia,
+    onDelete: onClear,
+    onDownload: downloadMedia,
+    className: classes.viewWrapper,
+    loading: loading,
+    loaderBorderStyle: "solid",
+    onOpenPasteURLForm: onOpen({
+      title: t('CMS.document.replaceWithUrl.title')
+    })
+  }), /*#__PURE__*/React.createElement(PasteURLForm, {
+    title: title,
+    value: data,
+    show: isOpen,
+    closeModal: onClose,
+    onSave: onSave
+  }));
+};
+//# sourceMappingURL=form-document-field.js.map

package/dist/esm/cms-fields/components/document/form-document-field.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useRef","MEDIA_TYPES","useTranslations","useWithCallback","PasteURLForm","useMediaControl","usePasteURLForm","DocumentControl","classes","FormDocumentInput","documentClasses","FormDocumentField","_ref","data","onChange","onChangeDocument","onClear","onClearDocument","onInput","autoFocus","readOnly","invalid","dataHook","t","inputRef","viewRef","callMedia","loading","downloadMedia","mediaType","ALL_MEDIA","value","isOpen","title","onOpen","onClose","onSave","createElement","Fragment","ref","theme","disabled","error","loaderBorderStyle","onAddButtonClick","onPasteURLButtonClick","mediaURI","onReplace","onDelete","onDownload","className","viewWrapper","onOpenPasteURLForm","show","closeModal"],"sources":["../../../../../src/cms-fields/components/document/form-document-field.tsx"],"sourcesContent":["import React, { useRef } from 'react';\n\nimport { MEDIA_TYPES } from '../../utils/media-utils';\nimport { useTranslations, useWithCallback } from '../../hooks';\nimport type { AddItemActions } from '@wix/design-system';\n\nimport type { FormMediaControlProps } from '../media-control';\nimport {\n  PasteURLForm,\n  useMediaControl,\n  usePasteURLForm,\n} from '../media-control';\n\nimport { DocumentControl } from './document-control';\nimport { classes } from './form-document-field.st.css.js';\nimport { FormDocumentInput } from './form-document-input';\n\nexport { classes as documentClasses } from './form-document-field.st.css.js';\n\nexport const FormDocumentField: React.FC<FormMediaControlProps> = ({\n  data,\n  onChange: onChangeDocument,\n  onClear: onClearDocument,\n  onInput,\n  autoFocus,\n  readOnly,\n  invalid,\n  dataHook,\n}) => {\n  const { t } = useTranslations();\n\n  const onChange = useWithCallback(onChangeDocument, onInput);\n  const onClear = useWithCallback(onClearDocument, onInput);\n\n  const inputRef = useRef<AddItemActions>(null);\n  const viewRef = useRef<HTMLDivElement>(null);\n\n  const { callMedia, loading, downloadMedia } = useMediaControl({\n    mediaType: MEDIA_TYPES.ALL_MEDIA,\n    value: data,\n    onChange,\n    autoFocus,\n    readOnly,\n    inputRef,\n    viewRef,\n  });\n\n  const { isOpen, title, onOpen, onClose, onSave } = usePasteURLForm({\n    onChange,\n  });\n\n  return (\n    <>\n      {!data ? (\n        <FormDocumentInput\n          dataHook={dataHook}\n          ref={inputRef}\n          theme=\"dashes\"\n          disabled={readOnly}\n          loading={loading}\n          error={invalid}\n          loaderBorderStyle=\"dashed\"\n          onAddButtonClick={callMedia}\n          onPasteURLButtonClick={onOpen({\n            title: t('CMS.document.pasteUrl.title'),\n          })}\n        />\n      ) : (\n        <DocumentControl\n          dataHook={dataHook}\n          ref={viewRef}\n          mediaURI={data}\n          readOnly={readOnly}\n          onReplace={callMedia}\n          onDelete={onClear}\n          onDownload={downloadMedia}\n          className={classes.viewWrapper}\n          loading={loading}\n          loaderBorderStyle=\"solid\"\n          onOpenPasteURLForm={onOpen({\n            title: t('CMS.document.replaceWithUrl.title'),\n          })}\n        />\n      )}\n      <PasteURLForm\n        title={title}\n        value={data}\n        show={isOpen}\n        closeModal={onClose}\n        onSave={onSave}\n      />\n    </>\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,MAAM,QAAQ,OAAO;AAErC,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,eAAe,EAAEC,eAAe,QAAQ,aAAa;AAI9D,SACEC,YAAY,EACZC,eAAe,EACfC,eAAe,QACV,kBAAkB;AAEzB,SAASC,eAAe,QAAQ,oBAAoB;AACpD,SAASC,OAAO,QAAQ,iCAAiC;AACzD,SAASC,iBAAiB,QAAQ,uBAAuB;AAEzD,SAASD,OAAO,IAAIE,eAAe,QAAQ,iCAAiC;AAE5E,OAAO,MAAMC,iBAAkD,GAAGC,IAAA,IAS5D;EAAA,IAT6D;IACjEC,IAAI;IACJC,QAAQ,EAAEC,gBAAgB;IAC1BC,OAAO,EAAEC,eAAe;IACxBC,OAAO;IACPC,SAAS;IACTC,QAAQ;IACRC,OAAO;IACPC;EACF,CAAC,GAAAV,IAAA;EACC,MAAM;IAAEW;EAAE,CAAC,GAAGrB,eAAe,CAAC,CAAC;EAE/B,MAAMY,QAAQ,GAAGX,eAAe,CAACY,gBAAgB,EAAEG,OAAO,CAAC;EAC3D,MAAMF,OAAO,GAAGb,eAAe,CAACc,eAAe,EAAEC,OAAO,CAAC;EAEzD,MAAMM,QAAQ,GAAGxB,MAAM,CAAiB,IAAI,CAAC;EAC7C,MAAMyB,OAAO,GAAGzB,MAAM,CAAiB,IAAI,CAAC;EAE5C,MAAM;IAAE0B,SAAS;IAAEC,OAAO;IAAEC;EAAc,CAAC,GAAGvB,eAAe,CAAC;IAC5DwB,SAAS,EAAE5B,WAAW,CAAC6B,SAAS;IAChCC,KAAK,EAAElB,IAAI;IACXC,QAAQ;IACRK,SAAS;IACTC,QAAQ;IACRI,QAAQ;IACRC;EACF,CAAC,CAAC;EAEF,MAAM;IAAEO,MAAM;IAAEC,KAAK;IAAEC,MAAM;IAAEC,OAAO;IAAEC;EAAO,CAAC,GAAG9B,eAAe,CAAC;IACjEQ;EACF,CAAC,CAAC;EAEF,oBACEf,KAAA,CAAAsC,aAAA,CAAAtC,KAAA,CAAAuC,QAAA,QACG,CAACzB,IAAI,gBACJd,KAAA,CAAAsC,aAAA,CAAC5B,iBAAiB;IAChBa,QAAQ,EAAEA,QAAS;IACnBiB,GAAG,EAAEf,QAAS;IACdgB,KAAK,EAAC,QAAQ;IACdC,QAAQ,EAAErB,QAAS;IACnBO,OAAO,EAAEA,OAAQ;IACjBe,KAAK,EAAErB,OAAQ;IACfsB,iBAAiB,EAAC,QAAQ;IAC1BC,gBAAgB,EAAElB,SAAU;IAC5BmB,qBAAqB,EAAEX,MAAM,CAAC;MAC5BD,KAAK,EAAEV,CAAC,CAAC,6BAA6B;IACxC,CAAC;EAAE,CACJ,CAAC,gBAEFxB,KAAA,CAAAsC,aAAA,CAAC9B,eAAe;IACde,QAAQ,EAAEA,QAAS;IACnBiB,GAAG,EAAEd,OAAQ;IACbqB,QAAQ,EAAEjC,IAAK;IACfO,QAAQ,EAAEA,QAAS;IACnB2B,SAAS,EAAErB,SAAU;IACrBsB,QAAQ,EAAEhC,OAAQ;IAClBiC,UAAU,EAAErB,aAAc;IAC1BsB,SAAS,EAAE1C,OAAO,CAAC2C,WAAY;IAC/BxB,OAAO,EAAEA,OAAQ;IACjBgB,iBAAiB,EAAC,OAAO;IACzBS,kBAAkB,EAAElB,MAAM,CAAC;MACzBD,KAAK,EAAEV,CAAC,CAAC,mCAAmC;IAC9C,CAAC;EAAE,CACJ,CACF,eACDxB,KAAA,CAAAsC,aAAA,CAACjC,YAAY;IACX6B,KAAK,EAAEA,KAAM;IACbF,KAAK,EAAElB,IAAK;IACZwC,IAAI,EAAErB,MAAO;IACbsB,UAAU,EAAEnB,OAAQ;IACpBC,MAAM,EAAEA;EAAO,CAChB,CACD,CAAC;AAEP,CAAC","ignoreList":[]}

package/dist/esm/cms-fields/components/document/form-document-field.st.css.js

@@ -0,0 +1,40 @@
+// @ts-nocheck
+
+import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js";
+var _namespace_ = "formdocumentfield4207312351";
+var _style_ = classesRuntime.bind(null, _namespace_);
+export var cssStates = statesRuntime.bind(null, _namespace_);
+export var style = _style_;
+export var st = _style_;
+export var namespace = _namespace_;
+export var classes = {
+  "root": "formdocumentfield4207312351__root",
+  "viewWrapper": "formdocumentfield4207312351__viewWrapper",
+  "textWidth": "formdocumentfield4207312351__textWidth",
+  "documentLoader": "formdocumentfield4207312351__documentLoader",
+  "addDocument": "formdocumentfield4207312351__addDocument",
+  "addItemWrapper": "formdocumentfield4207312351__addItemWrapper"
+};
+export var keyframes = {};
+export var layers = {};
+export var containers = {};
+export var stVars = {
+  "BorderRadius": "2px",
+  "documentViewBorderRadius": "var(--wds-border-radius-300, calc(2px * 3))",
+  "documentActionsWidth": "196px",
+  "addItemWSRBorderRadius": "var(--wds-border-radius-400, calc(2px * 4))",
+  "documentLoaderPadding": "21px",
+  "addDocumentPadding": "17px"
+};
+export var vars = {
+  "wds-border-radius-400": "--wds-border-radius-400",
+  "wds-border-radius-300": "--wds-border-radius-300",
+  "wds-color-blue-300": "--wds-color-blue-300",
+  "wds-color-blue-500": "--wds-color-blue-500",
+  "wsr-color-B30": "--wsr-color-B30",
+  "wsr-color-B50": "--wsr-color-B50",
+  "wds-input-shadow-focus-standard": "--wds-input-shadow-focus-standard",
+  "wsr-color-R10": "--wsr-color-R10",
+  "wds-color-red-100": "--wds-color-red-100"
+};
+//# sourceMappingURL=form-document-field.st.css.js.map

package/dist/esm/cms-fields/components/document/form-document-field.st.css.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["classesRuntime","statesRuntime","_namespace_","_style_","bind","cssStates","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../../src/cms-fields/components/document/form-document-field.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"formdocumentfield4207312351\";\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\":\"formdocumentfield4207312351__root\",\"viewWrapper\":\"formdocumentfield4207312351__viewWrapper\",\"textWidth\":\"formdocumentfield4207312351__textWidth\",\"documentLoader\":\"formdocumentfield4207312351__documentLoader\",\"addDocument\":\"formdocumentfield4207312351__addDocument\",\"addItemWrapper\":\"formdocumentfield4207312351__addItemWrapper\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {\"BorderRadius\":\"2px\",\"documentViewBorderRadius\":\"var(--wds-border-radius-300, calc(2px * 3))\",\"documentActionsWidth\":\"196px\",\"addItemWSRBorderRadius\":\"var(--wds-border-radius-400, calc(2px * 4))\",\"documentLoaderPadding\":\"21px\",\"addDocumentPadding\":\"17px\"}; \nexport var vars = {\"wds-border-radius-400\":\"--wds-border-radius-400\",\"wds-border-radius-300\":\"--wds-border-radius-300\",\"wds-color-blue-300\":\"--wds-color-blue-300\",\"wds-color-blue-500\":\"--wds-color-blue-500\",\"wsr-color-B30\":\"--wsr-color-B30\",\"wsr-color-B50\":\"--wsr-color-B50\",\"wds-input-shadow-focus-standard\":\"--wds-input-shadow-focus-standard\",\"wsr-color-R10\":\"--wsr-color-R10\",\"wds-color-red-100\":\"--wds-color-red-100\"}; \n\n\n\n\n"],"mappings":"AAAA;;AAGA,SAASA,cAAc,EAAEC,aAAa,QAAQ,kCAAkC;AAIhF,IAAIC,WAAW,GAAG,6BAA6B;AAC/C,IAAIC,OAAO,GAAGH,cAAc,CAACI,IAAI,CAAC,IAAI,EAAEF,WAAW,CAAC;AAEpD,OAAO,IAAIG,SAAS,GAAGJ,aAAa,CAACG,IAAI,CAAC,IAAI,EAAEF,WAAW,CAAC;AAC5D,OAAO,IAAII,KAA6C,GAAGH,OAAO;AAClE,OAAO,IAAII,EAA0C,GAAGJ,OAAO;AAE/D,OAAO,IAAIK,SAAS,GAAGN,WAAW;AAClC,OAAO,IAAIO,OAAO,GAAG;EAAC,MAAM,EAAC,mCAAmC;EAAC,aAAa,EAAC,0CAA0C;EAAC,WAAW,EAAC,wCAAwC;EAAC,gBAAgB,EAAC,6CAA6C;EAAC,aAAa,EAAC,0CAA0C;EAAC,gBAAgB,EAAC;AAA6C,CAAC;AACtW,OAAO,IAAIC,SAAS,GAAG,CAAC,CAAC;AACzB,OAAO,IAAIC,MAAM,GAAG,CAAC,CAAC;AACtB,OAAO,IAAIC,UAAU,GAAG,CAAC,CAAC;AAC1B,OAAO,IAAIC,MAAM,GAAG;EAAC,cAAc,EAAC,KAAK;EAAC,0BAA0B,EAAC,6CAA6C;EAAC,sBAAsB,EAAC,OAAO;EAAC,wBAAwB,EAAC,6CAA6C;EAAC,uBAAuB,EAAC,MAAM;EAAC,oBAAoB,EAAC;AAAM,CAAC;AACpR,OAAO,IAAIC,IAAI,GAAG;EAAC,uBAAuB,EAAC,yBAAyB;EAAC,uBAAuB,EAAC,yBAAyB;EAAC,oBAAoB,EAAC,sBAAsB;EAAC,oBAAoB,EAAC,sBAAsB;EAAC,eAAe,EAAC,iBAAiB;EAAC,eAAe,EAAC,iBAAiB;EAAC,iCAAiC,EAAC,mCAAmC;EAAC,eAAe,EAAC,iBAAiB;EAAC,mBAAmB,EAAC;AAAqB,CAAC","ignoreList":[]}

package/dist/esm/cms-fields/components/document/form-document-input.js

@@ -0,0 +1,28 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { useTranslations } from '../../hooks';
+import { AddDocumentButton } from './add-document-button';
+import { PasteURLButton } from '../media-control';
+export const FormDocumentInput = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    dataHook,
+    disabled,
+    onPasteURLButtonClick,
+    onAddButtonClick,
+    ...addDocumentProps
+  } = _ref;
+  const {
+    t
+  } = useTranslations();
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AddDocumentButton, _extends({
+    ref: ref,
+    disabled: disabled,
+    dataHook: dataHook,
+    onClick: onAddButtonClick
+  }, addDocumentProps)), /*#__PURE__*/React.createElement(PasteURLButton, {
+    title: t('CMS.document.pasteUrl.button'),
+    disabled: disabled,
+    onClick: onPasteURLButtonClick
+  }));
+});
+//# sourceMappingURL=form-document-input.js.map