@wix/patterns-fields 1.0.0

package/dist/cjs/components/document/document-control.js

@@ -0,0 +1,221 @@
+"use strict";
+
+exports.__esModule = true;
+exports.DocumentControl = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _mediaUtils = require("../../utils/media-utils");
+var _autoFieldTypes = require("../../auto-field-types");
+var _designSystem = require("@wix/design-system");
+var _wixUiIconsCommon = require("@wix/wix-ui-icons-common");
+var _hooks = require("../../hooks");
+var _formDocumentFieldStCss = require("./form-document-field.st.css.js");
+var _documentLoader = require("./document-loader");
+var _utils = require("./utils");
+var _patterns = require("@wix/patterns");
+var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/fields/dist/cjs/components/document/document-control.tsx";
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const DOCUMENT_VIEW_ACTIONS_WIDTH = '196px';
+const DocumentComponent = ({
+  mediaURI
+}) => {
+  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    gap: "SP2",
+    verticalAlign: "middle",
+    className: _formDocumentFieldStCss.classes.textWidth,
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 25,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    width: "24px",
+    height: "24px",
+    children: /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.Document, {
+      __self: void 0,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 26,
+        columnNumber: 49
+      }
+    }),
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 26,
+      columnNumber: 7
+    }
+  }), /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
+    dataHook: "document-view-name",
+    secondary: true,
+    ellipsis: true,
+    children: (0, _mediaUtils.getMediaTitle)(mediaURI),
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 27,
+      columnNumber: 7
+    }
+  }));
+};
+const DocumentControl = exports.DocumentControl = /*#__PURE__*/_react.default.forwardRef(({
+  mediaURI,
+  readOnly,
+  onReplace,
+  onDelete,
+  onDownload,
+  dataHook,
+  className,
+  loading,
+  loaderBorderStyle,
+  loaderClassName,
+  onOpenPasteURLForm
+}, ref) => {
+  const {
+    t
+  } = (0, _hooks.useTranslations)();
+  const {
+    environment
+  } = (0, _patterns.useWixPatternsContainer)();
+  const metaSiteId = environment.msid;
+  const handleOpenDocument = (0, _react.useCallback)(() => {
+    (0, _utils.openDocument)((0, _autoFieldTypes.getMediaURL)(mediaURI, metaSiteId));
+  }, [mediaURI, metaSiteId]);
+  const handleDownload = (0, _react.useCallback)(() => {
+    onDownload(mediaURI);
+  }, [mediaURI, onDownload]);
+  const containerRef = (0, _react.useRef)(null);
+  const handleOnKeydown = (0, _react.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.default.createElement(_documentLoader.DocumentLoader, {
+    borderStyle: loaderBorderStyle,
+    className: loaderClassName,
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 102,
+      columnNumber: 7
+    }
+  }) : /*#__PURE__*/_react.default.createElement("div", {
+    ref: containerRef,
+    onKeyDown: handleOnKeydown,
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 107,
+      columnNumber: 7
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.TableListItem, {
+    dataHook: dataHook,
+    ref: ref,
+    className: className,
+    onClick: handleOpenDocument,
+    verticalPadding: "tiny",
+    options: [{
+      value: /*#__PURE__*/_react.default.createElement(DocumentComponent, {
+        mediaURI: mediaURI,
+        __self: void 0,
+        __source: {
+          fileName: _jsxFileName,
+          lineNumber: 116,
+          columnNumber: 22
+        }
+      }),
+      width: '75%'
+    }, {
+      value: /*#__PURE__*/_react.default.createElement(_designSystem.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.default.createElement(_wixUiIconsCommon.Download, {
+            __self: void 0,
+            __source: {
+              fileName: _jsxFileName,
+              lineNumber: 137,
+              columnNumber: 29
+            }
+          }),
+          onClick: handleDownload,
+          disabled: readOnly,
+          dataHook: 'document-view-download-action',
+          text: t('CMS.document.action.download')
+        }, {
+          icon: /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.Replace, {
+            __self: void 0,
+            __source: {
+              fileName: _jsxFileName,
+              lineNumber: 144,
+              columnNumber: 29
+            }
+          }),
+          onClick: onReplace,
+          text: t('CMS.document.action.replace'),
+          dataHook: 'document-view-replace-action',
+          disabled: readOnly
+        }, {
+          icon: /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.Link, {
+            __self: void 0,
+            __source: {
+              fileName: _jsxFileName,
+              lineNumber: 151,
+              columnNumber: 29
+            }
+          }),
+          onClick: onOpenPasteURLForm,
+          text: t('CMS.document.action.replaceWithUrl'),
+          dataHook: 'document-view-replace-with-url-action',
+          disabled: readOnly
+        }, {
+          divider: true
+        }, {
+          icon: /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.Delete, {
+            __self: void 0,
+            __source: {
+              fileName: _jsxFileName,
+              lineNumber: 161,
+              columnNumber: 29
+            }
+          }),
+          onClick: onDelete,
+          text: t('CMS.document.action.delete'),
+          dataHook: 'document-view-delete-action',
+          disabled: readOnly
+        }],
+        __self: void 0,
+        __source: {
+          fileName: _jsxFileName,
+          lineNumber: 121,
+          columnNumber: 17
+        }
+      }),
+      width: DOCUMENT_VIEW_ACTIONS_WIDTH,
+      align: 'right'
+    }],
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 108,
+      columnNumber: 9
+    }
+  }));
+});
+//# sourceMappingURL=document-control.js.map

package/dist/cjs/components/document/document-control.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_mediaUtils","_autoFieldTypes","_designSystem","_wixUiIconsCommon","_hooks","_formDocumentFieldStCss","_documentLoader","_utils","_patterns","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DOCUMENT_VIEW_ACTIONS_WIDTH","DocumentComponent","mediaURI","createElement","Box","gap","verticalAlign","className","classes","textWidth","__self","__source","fileName","lineNumber","columnNumber","width","height","children","Document","Text","dataHook","secondary","ellipsis","getMediaTitle","DocumentControl","exports","React","forwardRef","readOnly","onReplace","onDelete","onDownload","loading","loaderBorderStyle","loaderClassName","onOpenPasteURLForm","ref","useTranslations","environment","useWixPatternsContainer","metaSiteId","msid","handleOpenDocument","useCallback","openDocument","getMediaURL","handleDownload","containerRef","useRef","handleOnKeydown","event","_containerRef$current","actions","current","querySelector","contains","document","activeElement","key","DocumentLoader","borderStyle","onKeyDown","TableListItem","onClick","verticalPadding","options","value","TableActionCell","alwaysShowSecondaryActions","numOfVisibleSecondaryActions","primaryAction","skin","text","popoverMenuProps","textSize","minWidth","secondaryActions","icon","Download","disabled","Replace","Link","divider","Delete","align"],"sources":["../../../../src/components/document/document-control.tsx"],"sourcesContent":["import React, { useCallback, useRef } from 'react';\n\nimport { getMediaTitle } from '../../utils/media-utils';\nimport { getMediaURL } from '../../auto-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/cjs/components/document/document-loader.js

@@ -0,0 +1,33 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.DocumentLoader = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _designSystem = require("@wix/design-system");
+var _formDocumentFieldStCss = require("./form-document-field.st.css.js");
+var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/fields/dist/cjs/components/document/document-loader.tsx";
+const DocumentLoader = ({
+  className,
+  borderStyle: _borderStyle
+}) => /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+  align: "center",
+  verticalAlign: "middle",
+  className: (0, _formDocumentFieldStCss.style)(_formDocumentFieldStCss.classes.documentLoader, className),
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 16,
+    columnNumber: 3
+  }
+}, /*#__PURE__*/_react.default.createElement(_designSystem.Loader, {
+  size: "tiny",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 21,
+    columnNumber: 5
+  }
+}));
+exports.DocumentLoader = DocumentLoader;
+//# sourceMappingURL=document-loader.js.map

package/dist/cjs/components/document/document-loader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_designSystem","_formDocumentFieldStCss","_jsxFileName","DocumentLoader","className","borderStyle","_borderStyle","default","createElement","Box","align","verticalAlign","style","classes","documentLoader","__self","__source","fileName","lineNumber","columnNumber","Loader","size","exports"],"sources":["../../../../src/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,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AAEA,IAAAE,uBAAA,GAAAF,OAAA;AAAiE,IAAAG,YAAA;AAO1D,MAAMC,cAAuC,GAAGA,CAAC;EACtDC,SAAS;EACTC,WAAW,EAAEC;AACf,CAAC,kBACCT,MAAA,CAAAU,OAAA,CAAAC,aAAA,CAACR,aAAA,CAAAS,GAAG;EACFC,KAAK,EAAC,QAAQ;EACdC,aAAa,EAAC,QAAQ;EACtBP,SAAS,EAAE,IAAAQ,6BAAK,EAACC,+BAAO,CAACC,cAAc,EAAEV,SAAS,CAAE;EAAAW,MAAA;EAAAC,QAAA;IAAAC,QAAA,EAAAf,YAAA;IAAAgB,UAAA;IAAAC,YAAA;EAAA;AAAA,gBAEpDtB,MAAA,CAAAU,OAAA,CAAAC,aAAA,CAACR,aAAA,CAAAoB,MAAM;EAACC,IAAI,EAAC,MAAM;EAAAN,MAAA;EAAAC,QAAA;IAAAC,QAAA,EAAAf,YAAA;IAAAgB,UAAA;IAAAC,YAAA;EAAA;AAAA,CAAE,CAClB,CACN;AAACG,OAAA,CAAAnB,cAAA,GAAAA,cAAA","ignoreList":[]}

package/dist/cjs/components/document/document-view.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.DocumentView = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _designSystem = require("@wix/design-system");
+var _wixUiIconsCommon = require("@wix/wix-ui-icons-common");
+var _mediaUtils = require("../../utils/media-utils");
+var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/fields/dist/cjs/components/document/document-view.tsx";
+const DocumentView = ({
+  data
+}) => {
+  return data ? /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 14,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Badge, {
+    prefixIcon: /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.DocumentSmall, {
+      __self: void 0,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 15,
+        columnNumber: 26
+      }
+    }),
+    size: "small",
+    skin: "neutralStandard",
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 15,
+      columnNumber: 7
+    }
+  }, (0, _mediaUtils.getMediaTitle)(data))) : null;
+};
+exports.DocumentView = DocumentView;
+//# sourceMappingURL=document-view.js.map

package/dist/cjs/components/document/document-view.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_designSystem","_wixUiIconsCommon","_mediaUtils","_jsxFileName","DocumentView","data","default","createElement","Box","__self","__source","fileName","lineNumber","columnNumber","Badge","prefixIcon","DocumentSmall","size","skin","getMediaTitle","exports"],"sources":["../../../../src/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,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AAEA,IAAAG,WAAA,GAAAH,OAAA;AAAwD,IAAAI,YAAA;AAMjD,MAAMC,YAAyC,GAAGA,CAAC;EAAEC;AAAK,CAAC,KAAK;EACrE,OAAOA,IAAI,gBACTR,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACP,aAAA,CAAAQ,GAAG;IAAAC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAR,YAAA;MAAAS,UAAA;MAAAC,YAAA;IAAA;EAAA,gBACFhB,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACP,aAAA,CAAAc,KAAK;IAACC,UAAU,eAAElB,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACN,iBAAA,CAAAe,aAAa;MAAAP,MAAA;MAAAC,QAAA;QAAAC,QAAA,EAAAR,YAAA;QAAAS,UAAA;QAAAC,YAAA;MAAA;IAAA,CAAE,CAAE;IAACI,IAAI,EAAC,OAAO;IAACC,IAAI,EAAC,iBAAiB;IAAAT,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAR,YAAA;MAAAS,UAAA;MAAAC,YAAA;IAAA;EAAA,GACtE,IAAAM,yBAAa,EAACd,IAAI,CACd,CACJ,CAAC,GACJ,IAAI;AACV,CAAC;AAACe,OAAA,CAAAhB,YAAA,GAAAA,YAAA","ignoreList":[]}

package/dist/cjs/components/document/form/index.js

@@ -0,0 +1,34 @@
+"use strict";
+
+exports.__esModule = true;
+var _formDocumentField = require("../form-document-field");
+Object.keys(_formDocumentField).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _formDocumentField[key]) return;
+  exports[key] = _formDocumentField[key];
+});
+var _documentControl = require("../document-control");
+Object.keys(_documentControl).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _documentControl[key]) return;
+  exports[key] = _documentControl[key];
+});
+var _addDocumentButton = require("../add-document-button");
+Object.keys(_addDocumentButton).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _addDocumentButton[key]) return;
+  exports[key] = _addDocumentButton[key];
+});
+var _formDocumentInput = require("../form-document-input");
+Object.keys(_formDocumentInput).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _formDocumentInput[key]) return;
+  exports[key] = _formDocumentInput[key];
+});
+var _utils = require("../utils");
+Object.keys(_utils).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _utils[key]) return;
+  exports[key] = _utils[key];
+});
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/document/form/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_formDocumentField","require","Object","keys","forEach","key","exports","_documentControl","_addDocumentButton","_formDocumentInput","_utils"],"sources":["../../../../../src/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,IAAAA,kBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,kBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,kBAAA,CAAAK,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAL,kBAAA,CAAAK,GAAA;AAAA;AACA,IAAAE,gBAAA,GAAAN,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAI,gBAAA,EAAAH,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAE,gBAAA,CAAAF,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAE,gBAAA,CAAAF,GAAA;AAAA;AACA,IAAAG,kBAAA,GAAAP,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAK,kBAAA,EAAAJ,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAG,kBAAA,CAAAH,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAG,kBAAA,CAAAH,GAAA;AAAA;AACA,IAAAI,kBAAA,GAAAR,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAM,kBAAA,EAAAL,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAI,kBAAA,CAAAJ,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAI,kBAAA,CAAAJ,GAAA;AAAA;AACA,IAAAK,MAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,MAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,MAAA,CAAAL,GAAA;EAAAC,OAAA,CAAAD,GAAA,IAAAK,MAAA,CAAAL,GAAA;AAAA","ignoreList":[]}

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

@@ -0,0 +1,107 @@
+"use strict";
+
+exports.__esModule = true;
+exports.FormDocumentField = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _mediaUtils = require("../../utils/media-utils");
+var _hooks = require("../../hooks");
+var _mediaControl = require("../media-control");
+var _documentControl = require("./document-control");
+var _formDocumentFieldStCss = require("./form-document-field.st.css.js");
+exports.documentClasses = _formDocumentFieldStCss.classes;
+var _formDocumentInput = require("./form-document-input");
+var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/fields/dist/cjs/components/document/form-document-field.tsx";
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const FormDocumentField = ({
+  data,
+  onChange: onChangeDocument,
+  onClear: onClearDocument,
+  onInput,
+  autoFocus,
+  readOnly,
+  invalid,
+  dataHook
+}) => {
+  const {
+    t
+  } = (0, _hooks.useTranslations)();
+  const onChange = (0, _hooks.useWithCallback)(onChangeDocument, onInput);
+  const onClear = (0, _hooks.useWithCallback)(onClearDocument, onInput);
+  const inputRef = (0, _react.useRef)(null);
+  const viewRef = (0, _react.useRef)(null);
+  const {
+    callMedia,
+    loading,
+    downloadMedia
+  } = (0, _mediaControl.useMediaControl)({
+    mediaType: _mediaUtils.MEDIA_TYPES.ALL_MEDIA,
+    value: data,
+    onChange,
+    autoFocus,
+    readOnly,
+    inputRef,
+    viewRef
+  });
+  const {
+    isOpen,
+    title,
+    onOpen,
+    onClose,
+    onSave
+  } = (0, _mediaControl.usePasteURLForm)({
+    onChange
+  });
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !data ? /*#__PURE__*/_react.default.createElement(_formDocumentInput.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')
+    }),
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 55,
+      columnNumber: 9
+    }
+  }) : /*#__PURE__*/_react.default.createElement(_documentControl.DocumentControl, {
+    dataHook: dataHook,
+    ref: viewRef,
+    mediaURI: data,
+    readOnly: readOnly,
+    onReplace: callMedia,
+    onDelete: onClear,
+    onDownload: downloadMedia,
+    className: _formDocumentFieldStCss.classes.viewWrapper,
+    loading: loading,
+    loaderBorderStyle: "solid",
+    onOpenPasteURLForm: onOpen({
+      title: t('CMS.document.replaceWithUrl.title')
+    }),
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 69,
+      columnNumber: 9
+    }
+  }), /*#__PURE__*/_react.default.createElement(_mediaControl.PasteURLForm, {
+    title: title,
+    value: data,
+    show: isOpen,
+    closeModal: onClose,
+    onSave: onSave,
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 85,
+      columnNumber: 7
+    }
+  }));
+};
+exports.FormDocumentField = FormDocumentField;
+//# sourceMappingURL=form-document-field.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_mediaUtils","_hooks","_mediaControl","_documentControl","_formDocumentFieldStCss","exports","documentClasses","classes","_formDocumentInput","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FormDocumentField","data","onChange","onChangeDocument","onClear","onClearDocument","onInput","autoFocus","readOnly","invalid","dataHook","useTranslations","useWithCallback","inputRef","useRef","viewRef","callMedia","loading","downloadMedia","useMediaControl","mediaType","MEDIA_TYPES","ALL_MEDIA","value","isOpen","title","onOpen","onClose","onSave","usePasteURLForm","createElement","Fragment","FormDocumentInput","ref","theme","disabled","error","loaderBorderStyle","onAddButtonClick","onPasteURLButtonClick","__self","__source","fileName","lineNumber","columnNumber","DocumentControl","mediaURI","onReplace","onDelete","onDownload","className","viewWrapper","onOpenPasteURLForm","PasteURLForm","show","closeModal"],"sources":["../../../../src/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":"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","ignoreList":[]}

package/dist/cjs/components/document/form-document-field.st.css

@@ -0,0 +1,54 @@
+@property st-global(--wds-border-radius-400);
+@property st-global(--wds-border-radius-300);
+@property st-global(--wds-color-blue-300);
+@property st-global(--wds-color-blue-500);
+@property st-global(--wsr-color-B30);
+@property st-global(--wsr-color-B50);
+@property st-global(--wds-input-shadow-focus-standard);
+@property st-global(--wsr-color-R10);
+@property st-global(--wds-color-red-100);
+
+:vars {
+    BorderRadius: 2px;
+    documentViewBorderRadius: var(--wds-border-radius-300, calc(value(BorderRadius) * 3));
+    documentActionsWidth: 196px;
+
+    addItemWSRBorderRadius: var(--wds-border-radius-400, calc(value(BorderRadius) * 4));
+
+    /* single document view has height of 62px, these paddings are calculated based on this value */
+    documentLoaderPadding: 21px;
+    addDocumentPadding: 17px;
+}
+
+.viewWrapper {
+    border-radius: value(documentViewBorderRadius);
+    border: 1px solid var(--wds-color-blue-300, var(--wsr-color-B30));
+}
+
+.viewWrapper:hover {
+    background: var(--wds-color-blue-500, var(--wsr-color-B50));
+    cursor: pointer;
+}
+
+.textWidth {
+    max-width: calc(100% - value(documentActionsWidth));
+}
+
+.documentLoader {
+    padding-top: value(documentLoaderPadding);
+    padding-bottom: value(documentLoaderPadding);
+}
+
+.addDocument {
+    -st-states: error;
+    padding-top: value(addDocumentPadding) !important;
+    padding-bottom: value(addDocumentPadding) !important;
+}
+.addDocument:error {
+    border: 1px solid var(--wds-color-red-100, var(--wsr-color-R10)) !important;
+}
+
+.addItemWrapper:focus-within {
+    box-shadow: var(--wds-input-shadow-focus-standard, 0 0 0 3px var(--wds-color-blue-300, var(--wsr-color-B30)));
+    border-radius: value(addItemWSRBorderRadius);
+}

package/dist/cjs/components/document/form-document-field.st.css.js

@@ -0,0 +1,44 @@
+"use strict";
+
+exports.__esModule = true;
+exports.vars = exports.style = exports.stVars = exports.st = exports.namespace = exports.layers = exports.keyframes = exports.cssStates = exports.containers = exports.classes = void 0;
+var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
+// @ts-nocheck
+
+var _namespace_ = "formdocumentfield1269230364";
+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": "formdocumentfield1269230364__root",
+  "viewWrapper": "formdocumentfield1269230364__viewWrapper",
+  "textWidth": "formdocumentfield1269230364__textWidth",
+  "documentLoader": "formdocumentfield1269230364__documentLoader",
+  "addDocument": "formdocumentfield1269230364__addDocument",
+  "addItemWrapper": "formdocumentfield1269230364__addItemWrapper"
+};
+var keyframes = exports.keyframes = {};
+var layers = exports.layers = {};
+var containers = exports.containers = {};
+var stVars = exports.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"
+};
+var vars = exports.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/cjs/components/document/form-document-field.st.css.js.map

@@ -0,0 +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/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_ = \"formdocumentfield1269230364\";\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\":\"formdocumentfield1269230364__root\",\"viewWrapper\":\"formdocumentfield1269230364__viewWrapper\",\"textWidth\":\"formdocumentfield1269230364__textWidth\",\"documentLoader\":\"formdocumentfield1269230364__documentLoader\",\"addDocument\":\"formdocumentfield1269230364__addDocument\",\"addItemWrapper\":\"formdocumentfield1269230364__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":";;;;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,mCAAmC;EAAC,aAAa,EAAC,0CAA0C;EAAC,WAAW,EAAC,wCAAwC;EAAC,gBAAgB,EAAC,6CAA6C;EAAC,aAAa,EAAC,0CAA0C;EAAC,gBAAgB,EAAC;AAA6C,CAAC;AAC/V,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;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;AAC7Q,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,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":[]}