@payloadcms/ui 3.0.0-beta.85 → 3.0.0-beta.86

package/dist/elements/FileDetails/FileMeta/index.js

@@ -1,4 +1,6 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { formatFilesize } from 'payload/shared';
 import React, { useState } from 'react';
@@ -8,67 +10,96 @@ import { useDocumentDrawer } from '../../DocumentDrawer/index.js';
 import { Tooltip } from '../../Tooltip/index.js';
 import './index.scss';
 const baseClass = 'file-meta';
-export const FileMeta = (props)=>{
-    const { id, collection, filename, filesize, height, mimeType, url: fileURL, width } = props;
-    const [hovered, setHovered] = useState(false);
-    const openInDrawer = Boolean(id && collection);
-    const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({
-        id,
-        collectionSlug: collection
-    });
-    return /*#__PURE__*/ _jsxs("div", {
-        className: baseClass,
-        children: [
-            /*#__PURE__*/ _jsxs("div", {
-                className: `${baseClass}__url`,
-                children: [
-                    openInDrawer && /*#__PURE__*/ _jsx(DocumentDrawer, {}),
-                    /*#__PURE__*/ _jsx("a", {
-                        href: fileURL,
-                        rel: "noopener noreferrer",
-                        target: "_blank",
-                        children: filename
-                    }),
-                    /*#__PURE__*/ _jsx(CopyToClipboard, {
-                        defaultMessage: "Copy URL",
-                        value: fileURL
-                    }),
-                    openInDrawer && /*#__PURE__*/ _jsxs(DocumentDrawerToggler, {
-                        className: `${baseClass}__edit`,
-                        onMouseEnter: ()=>setHovered(true),
-                        onMouseLeave: ()=>setHovered(false),
-                        children: [
-                            /*#__PURE__*/ _jsx(EditIcon, {}),
-                            /*#__PURE__*/ _jsx(Tooltip, {
-                                show: hovered,
-                                children: "Edit"
-                            })
-                        ]
-                    })
-                ]
-            }),
-            /*#__PURE__*/ _jsxs("div", {
-                className: `${baseClass}__size-type`,
-                children: [
-                    formatFilesize(filesize),
-                    width && height && /*#__PURE__*/ _jsxs(React.Fragment, {
-                        children: [
-                            " - ",
-                            width,
-                            "x",
-                            height
-                        ]
-                    }),
-                    mimeType && /*#__PURE__*/ _jsxs(React.Fragment, {
-                        children: [
-                            " - ",
-                            mimeType
-                        ]
-                    })
-                ]
-            })
-        ]
+export const FileMeta = props => {
+  const $ = _c(19);
+  const {
+    id,
+    collection,
+    filename,
+    filesize,
+    height,
+    mimeType,
+    url: fileURL,
+    width
+  } = props;
+  const [hovered, setHovered] = useState(false);
+  const openInDrawer = Boolean(id && collection);
+  let t0;
+  if ($[0] !== id || $[1] !== collection) {
+    t0 = {
+      id,
+      collectionSlug: collection
+    };
+    $[0] = id;
+    $[1] = collection;
+    $[2] = t0;
+  } else {
+    t0 = $[2];
+  }
+  const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer(t0);
+  let t1;
+  if ($[3] !== openInDrawer || $[4] !== DocumentDrawer || $[5] !== fileURL || $[6] !== filename || $[7] !== hovered || $[8] !== DocumentDrawerToggler || $[9] !== filesize || $[10] !== width || $[11] !== height || $[12] !== mimeType) {
+    let t2;
+    if ($[14] !== width || $[15] !== height) {
+      t2 = width && height && _jsxs(React.Fragment, {
+        children: ["\xA0-\xA0", width, "x", height]
+      });
+      $[14] = width;
+      $[15] = height;
+      $[16] = t2;
+    } else {
+      t2 = $[16];
+    }
+    let t3;
+    if ($[17] !== mimeType) {
+      t3 = mimeType && _jsxs(React.Fragment, {
+        children: ["\xA0-\xA0", mimeType]
+      });
+      $[17] = mimeType;
+      $[18] = t3;
+    } else {
+      t3 = $[18];
+    }
+    t1 = _jsxs("div", {
+      className: baseClass,
+      children: [_jsxs("div", {
+        className: `${baseClass}__url`,
+        children: [openInDrawer && _jsx(DocumentDrawer, {}), _jsx("a", {
+          href: fileURL,
+          rel: "noopener noreferrer",
+          target: "_blank",
+          children: filename
+        }), _jsx(CopyToClipboard, {
+          defaultMessage: "Copy URL",
+          value: fileURL
+        }), openInDrawer && _jsxs(DocumentDrawerToggler, {
+          className: `${baseClass}__edit`,
+          onMouseEnter: () => setHovered(true),
+          onMouseLeave: () => setHovered(false),
+          children: [_jsx(EditIcon, {}), _jsx(Tooltip, {
+            show: hovered,
+            children: "Edit"
+          })]
+        })]
+      }), _jsxs("div", {
+        className: `${baseClass}__size-type`,
+        children: [formatFilesize(filesize), t2, t3]
+      })]
     });
+    $[3] = openInDrawer;
+    $[4] = DocumentDrawer;
+    $[5] = fileURL;
+    $[6] = filename;
+    $[7] = hovered;
+    $[8] = DocumentDrawerToggler;
+    $[9] = filesize;
+    $[10] = width;
+    $[11] = height;
+    $[12] = mimeType;
+    $[13] = t1;
+  } else {
+    t1 = $[13];
+  }
+  return t1;
 };
-
 //# sourceMappingURL=index.js.map

package/dist/elements/FileDetails/FileMeta/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/FileDetails/FileMeta/index.tsx"],"sourcesContent":["'use client'\nimport { formatFilesize } from 'payload/shared'\nimport React, { useState } from 'react'\n\nexport type FileMetaProps = {\n  collection?: string\n  filename: string\n  filesize: number\n  height?: number\n  id?: string\n  mimeType: string\n  sizes?: unknown\n  url: string\n  width?: number\n}\n\nimport { EditIcon } from '../../../icons/Edit/index.js'\nimport { CopyToClipboard } from '../../CopyToClipboard/index.js'\nimport { useDocumentDrawer } from '../../DocumentDrawer/index.js'\nimport { Tooltip } from '../../Tooltip/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-meta'\n\nexport const FileMeta: React.FC<FileMetaProps> = (props) => {\n  const { id, collection, filename, filesize, height, mimeType, url: fileURL, width } = props\n\n  const [hovered, setHovered] = useState(false)\n  const openInDrawer = Boolean(id && collection)\n\n  const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({\n    id,\n    collectionSlug: collection,\n  })\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__url`}>\n        {openInDrawer && <DocumentDrawer />}\n        <a href={fileURL} rel=\"noopener noreferrer\" target=\"_blank\">\n          {filename}\n        </a>\n        <CopyToClipboard defaultMessage=\"Copy URL\" value={fileURL} />\n        {openInDrawer && (\n          <DocumentDrawerToggler\n            className={`${baseClass}__edit`}\n            onMouseEnter={() => setHovered(true)}\n            onMouseLeave={() => setHovered(false)}\n          >\n            <EditIcon />\n            <Tooltip show={hovered}>Edit</Tooltip>\n          </DocumentDrawerToggler>\n        )}\n      </div>\n      <div className={`${baseClass}__size-type`}>\n        {formatFilesize(filesize)}\n        {width && height && (\n          <React.Fragment>\n            &nbsp;-&nbsp;\n            {width}x{height}\n          </React.Fragment>\n        )}\n        {mimeType && (\n          <React.Fragment>\n            &nbsp;-&nbsp;\n            {mimeType}\n          </React.Fragment>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"names":["formatFilesize","React","useState","EditIcon","CopyToClipboard","useDocumentDrawer","Tooltip","baseClass","FileMeta","props","id","collection","filename","filesize","height","mimeType","url","fileURL","width","hovered","setHovered","openInDrawer","Boolean","DocumentDrawer","DocumentDrawerToggler","collectionSlug","div","className","a","href","rel","target","defaultMessage","value","onMouseEnter","onMouseLeave","show","Fragment"],"mappings":"AAAA;;AACA,SAASA,cAAc,QAAQ,iBAAgB;AAC/C,OAAOC,SAASC,QAAQ,QAAQ,QAAO;AAcvC,SAASC,QAAQ,QAAQ,+BAA8B;AACvD,SAASC,eAAe,QAAQ,iCAAgC;AAChE,SAASC,iBAAiB,QAAQ,gCAA+B;AACjE,SAASC,OAAO,QAAQ,yBAAwB;AAChD,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,OAAO,MAAMC,WAAoC,CAACC;IAChD,MAAM,EAAEC,EAAE,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,KAAKC,OAAO,EAAEC,KAAK,EAAE,GAAGT;IAEtF,MAAM,CAACU,SAASC,WAAW,GAAGlB,SAAS;IACvC,MAAMmB,eAAeC,QAAQZ,MAAMC;IAEnC,MAAM,CAACY,gBAAgBC,sBAAsB,GAAGnB,kBAAkB;QAChEK;QACAe,gBAAgBd;IAClB;IAEA,qBACE,MAACe;QAAIC,WAAWpB;;0BACd,MAACmB;gBAAIC,WAAW,CAAC,EAAEpB,UAAU,KAAK,CAAC;;oBAChCc,8BAAgB,KAACE;kCAClB,KAACK;wBAAEC,MAAMZ;wBAASa,KAAI;wBAAsBC,QAAO;kCAChDnB;;kCAEH,KAACR;wBAAgB4B,gBAAe;wBAAWC,OAAOhB;;oBACjDI,8BACC,MAACG;wBACCG,WAAW,CAAC,EAAEpB,UAAU,MAAM,CAAC;wBAC/B2B,cAAc,IAAMd,WAAW;wBAC/Be,cAAc,IAAMf,WAAW;;0CAE/B,KAACjB;0CACD,KAACG;gCAAQ8B,MAAMjB;0CAAS;;;;;;0BAI9B,MAACO;gBAAIC,WAAW,CAAC,EAAEpB,UAAU,WAAW,CAAC;;oBACtCP,eAAea;oBACfK,SAASJ,wBACR,MAACb,MAAMoC,QAAQ;;4BAAC;4BAEbnB;4BAAM;4BAAEJ;;;oBAGZC,0BACC,MAACd,MAAMoC,QAAQ;;4BAAC;4BAEbtB;;;;;;;AAMb,EAAC"}
+{"version":3,"file":"index.js","names":["c","_c","formatFilesize","React","useState","EditIcon","CopyToClipboard","useDocumentDrawer","Tooltip","baseClass","FileMeta","props","$","id","collection","filename","filesize","height","mimeType","url","fileURL","width","hovered","setHovered","openInDrawer","Boolean","t0","collectionSlug","DocumentDrawer","DocumentDrawerToggler","t1","t2","_jsxs","Fragment","children","t3","className","_jsx","href","rel","target","defaultMessage","value","onMouseEnter","onMouseLeave","show"],"sources":["../../../../src/elements/FileDetails/FileMeta/index.tsx"],"sourcesContent":["'use client'\nimport { formatFilesize } from 'payload/shared'\nimport React, { useState } from 'react'\n\nexport type FileMetaProps = {\n  collection?: string\n  filename: string\n  filesize: number\n  height?: number\n  id?: string\n  mimeType: string\n  sizes?: unknown\n  url: string\n  width?: number\n}\n\nimport { EditIcon } from '../../../icons/Edit/index.js'\nimport { CopyToClipboard } from '../../CopyToClipboard/index.js'\nimport { useDocumentDrawer } from '../../DocumentDrawer/index.js'\nimport { Tooltip } from '../../Tooltip/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-meta'\n\nexport const FileMeta: React.FC<FileMetaProps> = (props) => {\n  const { id, collection, filename, filesize, height, mimeType, url: fileURL, width } = props\n\n  const [hovered, setHovered] = useState(false)\n  const openInDrawer = Boolean(id && collection)\n\n  const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({\n    id,\n    collectionSlug: collection,\n  })\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__url`}>\n        {openInDrawer && <DocumentDrawer />}\n        <a href={fileURL} rel=\"noopener noreferrer\" target=\"_blank\">\n          {filename}\n        </a>\n        <CopyToClipboard defaultMessage=\"Copy URL\" value={fileURL} />\n        {openInDrawer && (\n          <DocumentDrawerToggler\n            className={`${baseClass}__edit`}\n            onMouseEnter={() => setHovered(true)}\n            onMouseLeave={() => setHovered(false)}\n          >\n            <EditIcon />\n            <Tooltip show={hovered}>Edit</Tooltip>\n          </DocumentDrawerToggler>\n        )}\n      </div>\n      <div className={`${baseClass}__size-type`}>\n        {formatFilesize(filesize)}\n        {width && height && (\n          <React.Fragment>\n            &nbsp;-&nbsp;\n            {width}x{height}\n          </React.Fragment>\n        )}\n        {mimeType && (\n          <React.Fragment>\n            &nbsp;-&nbsp;\n            {mimeType}\n          </React.Fragment>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,SAASC,cAAc,QAAQ;AAC/B,OAAOC,KAAA,IAASC,QAAQ,QAAQ;AAchC,SAASC,QAAQ,QAAQ;AACzB,SAASC,eAAe,QAAQ;AAChC,SAASC,iBAAiB,QAAQ;AAClC,SAASC,OAAO,QAAQ;AACxB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,QAAA,GAAoCC,KAAA;EAAA,MAAAC,CAAA,GAAAX,EAAA;EAC/C;IAAAY,EAAA;IAAAC,UAAA;IAAAC,QAAA;IAAAC,QAAA;IAAAC,MAAA;IAAAC,QAAA;IAAAC,GAAA,EAAAC,OAAA;IAAAC;EAAA,IAAsFV,KAAA;EAEtF,OAAAW,OAAA,EAAAC,UAAA,IAA8BnB,QAAA,MAAS;EACvC,MAAAoB,YAAA,GAAqBC,OAAA,CAAQZ,EAAA,IAAMC,UAAA;EAAA,IAAAY,EAAA;EAAA,IAAAd,CAAA,QAAAC,EAAA,IAAAD,CAAA,QAAAE,UAAA;IAE+BY,EAAA;MAAAb,EAAA;MAAAc,cAAA,EAEhDb;IAAA;IAClBF,CAAA,MAAAC,EAAA;IAAAD,CAAA,MAAAE,UAAA;IAAAF,CAAA,MAAAc,EAAA;EAAA;IAAAA,EAAA,GAAAd,CAAA;EAAA;EAHA,OAAAgB,cAAA,EAAAC,qBAAA,IAAgDtB,iBAAA,CAAkBmB,EAGlE;EAAA,IAAAI,EAAA;EAAA,IAAAlB,CAAA,QAAAY,YAAA,IAAAZ,CAAA,QAAAgB,cAAA,IAAAhB,CAAA,QAAAQ,OAAA,IAAAR,CAAA,QAAAG,QAAA,IAAAH,CAAA,QAAAU,OAAA,IAAAV,CAAA,QAAAiB,qBAAA,IAAAjB,CAAA,QAAAI,QAAA,IAAAJ,CAAA,SAAAS,KAAA,IAAAT,CAAA,SAAAK,MAAA,IAAAL,CAAA,SAAAM,QAAA;IAAA,IAAAa,EAAA;IAAA,IAAAnB,CAAA,SAAAS,KAAA,IAAAT,CAAA,SAAAK,MAAA;MAuBOc,EAAA,GAAAV,KAAA,IAASJ,MAAA,IACRe,KAAA,CAAA7B,KAAA,CAAA8B,QAAA;QAAAC,QAAA,GAAgB,aAEbb,KAAA,EAAM,KAAEJ,MAAA;MAAA,C;;;;;;;;;MAGZkB,EAAA,GAAAjB,QAAA,IACCc,KAAA,CAAA7B,KAAA,CAAA8B,QAAA;QAAAC,QAAA,GAAgB,aAEbhB,QAAA;MAAA,C;;;;;;IA7BTY,EAAA,GAAAE,KAAA,CAAC;MAAAI,SAAA,EAAA3B,SAAA;MAAAyB,QAAA,GACCF,KAAA,CAAC;QAAAI,SAAA,EAAe,GAAA3B,SAAA,OAAmB;QAAAyB,QAAA,GAChCV,YAAA,IAAgBa,IAAA,CAACT,cAAA,OAClBS,IAAA,CAAC;UAAAC,IAAA,EAAQlB,OAAA;UAAAmB,GAAA,EAAa;UAAAC,MAAA,EAA6B;UAAAN,QAAA,EAChDnB;QAAA,C,GAEHsB,IAAA,CAAA/B,eAAA;UAAAmC,cAAA,EAAgC;UAAAC,KAAA,EAAkBtB;QAAA,C,GACjDI,YAAA,IACCQ,KAAA,CAACH,qBAAA;UAAAO,SAAA,EACY,GAAA3B,SAAA,QAAoB;UAAAkC,YAAA,EAAAA,CAAA,KACXpB,UAAA,KAAW;UAAAqB,YAAA,EAAAA,CAAA,KACXrB,UAAA,MAAW;UAAAW,QAAA,GAE/BG,IAAA,CAAAhC,QAAA,IAAC,GACDgC,IAAA,CAAA7B,OAAA;YAAAqC,IAAA,EAAevB,OAAA;YAAAY,QAAA,EAAS;UAAA,C;;UAI9BF,KAAA,CAAC;QAAAI,SAAA,EAAe,GAAA3B,SAAA,aAAyB;QAAAyB,QAAA,GACtChC,cAAA,CAAec,QAAA,GACfe,E,EAMAI,E;;;;;;;;;;;;;;;;;SA1BLL,E;CAmCJ","ignoreList":[]}

package/dist/elements/FileDetails/index.js

@@ -1,4 +1,5 @@
 'use client';
+
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { UploadActions } from '../../elements/Upload/index.js';
@@ -7,54 +8,64 @@ import { Thumbnail } from '../Thumbnail/index.js';
 import { FileMeta } from './FileMeta/index.js';
 import './index.scss';
 const baseClass = 'file-details';
-export const FileDetails = (props)=>{
-    const { collectionSlug, customUploadActions, doc, enableAdjustments, handleRemove, hasImageSizes, imageCacheTag, uploadConfig } = props;
-    const { id, filename, filesize, height, mimeType, thumbnailURL, url, width } = doc;
-    return /*#__PURE__*/ _jsx("div", {
-        className: baseClass,
-        children: /*#__PURE__*/ _jsxs("header", {
-            children: [
-                /*#__PURE__*/ _jsx(Thumbnail, {
-                    // size="small"
-                    className: `${baseClass}__thumbnail`,
-                    collectionSlug: collectionSlug,
-                    doc: doc,
-                    fileSrc: thumbnailURL || url,
-                    imageCacheTag: imageCacheTag,
-                    uploadConfig: uploadConfig
-                }),
-                /*#__PURE__*/ _jsxs("div", {
-                    className: `${baseClass}__main-detail`,
-                    children: [
-                        /*#__PURE__*/ _jsx(FileMeta, {
-                            collection: collectionSlug,
-                            filename: filename,
-                            filesize: filesize,
-                            height: height,
-                            id: id,
-                            mimeType: mimeType,
-                            url: url,
-                            width: width
-                        }),
-                        (enableAdjustments || customUploadActions) && /*#__PURE__*/ _jsx(UploadActions, {
-                            customActions: customUploadActions,
-                            enableAdjustments: enableAdjustments,
-                            enablePreviewSizes: hasImageSizes && doc.filename,
-                            mimeType: mimeType
-                        })
-                    ]
-                }),
-                handleRemove && /*#__PURE__*/ _jsx(Button, {
-                    buttonStyle: "icon-label",
-                    className: `${baseClass}__remove`,
-                    icon: "x",
-                    iconStyle: "with-border",
-                    onClick: handleRemove,
-                    round: true
-                })
-            ]
-        })
-    });
+export const FileDetails = props => {
+  const {
+    collectionSlug,
+    customUploadActions,
+    doc,
+    enableAdjustments,
+    handleRemove,
+    hasImageSizes,
+    imageCacheTag,
+    uploadConfig
+  } = props;
+  const {
+    id,
+    filename,
+    filesize,
+    height,
+    mimeType,
+    thumbnailURL,
+    url,
+    width
+  } = doc;
+  return /*#__PURE__*/_jsx("div", {
+    className: baseClass,
+    children: /*#__PURE__*/_jsxs("header", {
+      children: [/*#__PURE__*/_jsx(Thumbnail, {
+        // size="small"
+        className: `${baseClass}__thumbnail`,
+        collectionSlug: collectionSlug,
+        doc: doc,
+        fileSrc: thumbnailURL || url,
+        imageCacheTag: imageCacheTag,
+        uploadConfig: uploadConfig
+      }), /*#__PURE__*/_jsxs("div", {
+        className: `${baseClass}__main-detail`,
+        children: [/*#__PURE__*/_jsx(FileMeta, {
+          collection: collectionSlug,
+          filename: filename,
+          filesize: filesize,
+          height: height,
+          id: id,
+          mimeType: mimeType,
+          url: url,
+          width: width
+        }), (enableAdjustments || customUploadActions) && /*#__PURE__*/_jsx(UploadActions, {
+          customActions: customUploadActions,
+          enableAdjustments: enableAdjustments,
+          enablePreviewSizes: hasImageSizes && doc.filename,
+          mimeType: mimeType
+        })]
+      }), handleRemove && /*#__PURE__*/_jsx(Button, {
+        buttonStyle: "icon-label",
+        className: `${baseClass}__remove`,
+        icon: "x",
+        iconStyle: "with-border",
+        onClick: handleRemove,
+        round: true
+      })]
+    })
+  });
 };
-
 //# sourceMappingURL=index.js.map

package/dist/elements/FileDetails/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/FileDetails/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { UploadActions } from '../../elements/Upload/index.js'\nimport { Button } from '../Button/index.js'\nimport { Thumbnail } from '../Thumbnail/index.js'\nimport { FileMeta } from './FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-details'\n\nimport type { Data, FileSizes, SanitizedCollectionConfig } from 'payload'\n\nexport type FileDetailsProps = {\n  collectionSlug: string\n  customUploadActions?: React.ReactNode[]\n  doc: {\n    sizes?: FileSizes\n  } & Data\n  enableAdjustments?: boolean\n  handleRemove?: () => void\n  hasImageSizes?: boolean\n  imageCacheTag?: string\n  uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const FileDetails: React.FC<FileDetailsProps> = (props) => {\n  const {\n    collectionSlug,\n    customUploadActions,\n    doc,\n    enableAdjustments,\n    handleRemove,\n    hasImageSizes,\n    imageCacheTag,\n    uploadConfig,\n  } = props\n\n  const { id, filename, filesize, height, mimeType, thumbnailURL, url, width } = doc\n\n  return (\n    <div className={baseClass}>\n      <header>\n        <Thumbnail\n          // size=\"small\"\n          className={`${baseClass}__thumbnail`}\n          collectionSlug={collectionSlug}\n          doc={doc}\n          fileSrc={thumbnailURL || url}\n          imageCacheTag={imageCacheTag}\n          uploadConfig={uploadConfig}\n        />\n        <div className={`${baseClass}__main-detail`}>\n          <FileMeta\n            collection={collectionSlug}\n            filename={filename as string}\n            filesize={filesize as number}\n            height={height as number}\n            id={id as string}\n            mimeType={mimeType as string}\n            url={url as string}\n            width={width as number}\n          />\n\n          {(enableAdjustments || customUploadActions) && (\n            <UploadActions\n              customActions={customUploadActions}\n              enableAdjustments={enableAdjustments}\n              enablePreviewSizes={hasImageSizes && doc.filename}\n              mimeType={mimeType}\n            />\n          )}\n        </div>\n        {handleRemove && (\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__remove`}\n            icon=\"x\"\n            iconStyle=\"with-border\"\n            onClick={handleRemove}\n            round\n          />\n        )}\n      </header>\n    </div>\n  )\n}\n"],"names":["React","UploadActions","Button","Thumbnail","FileMeta","baseClass","FileDetails","props","collectionSlug","customUploadActions","doc","enableAdjustments","handleRemove","hasImageSizes","imageCacheTag","uploadConfig","id","filename","filesize","height","mimeType","thumbnailURL","url","width","div","className","header","fileSrc","collection","customActions","enablePreviewSizes","buttonStyle","icon","iconStyle","onClick","round"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,aAAa,QAAQ,iCAAgC;AAC9D,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,SAAS,QAAQ,wBAAuB;AACjD,SAASC,QAAQ,QAAQ,sBAAqB;AAC9C,OAAO,eAAc;AAErB,MAAMC,YAAY;AAiBlB,OAAO,MAAMC,cAA0C,CAACC;IACtD,MAAM,EACJC,cAAc,EACdC,mBAAmB,EACnBC,GAAG,EACHC,iBAAiB,EACjBC,YAAY,EACZC,aAAa,EACbC,aAAa,EACbC,YAAY,EACb,GAAGR;IAEJ,MAAM,EAAES,EAAE,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,YAAY,EAAEC,GAAG,EAAEC,KAAK,EAAE,GAAGb;IAE/E,qBACE,KAACc;QAAIC,WAAWpB;kBACd,cAAA,MAACqB;;8BACC,KAACvB;oBACC,eAAe;oBACfsB,WAAW,CAAC,EAAEpB,UAAU,WAAW,CAAC;oBACpCG,gBAAgBA;oBAChBE,KAAKA;oBACLiB,SAASN,gBAAgBC;oBACzBR,eAAeA;oBACfC,cAAcA;;8BAEhB,MAACS;oBAAIC,WAAW,CAAC,EAAEpB,UAAU,aAAa,CAAC;;sCACzC,KAACD;4BACCwB,YAAYpB;4BACZS,UAAUA;4BACVC,UAAUA;4BACVC,QAAQA;4BACRH,IAAIA;4BACJI,UAAUA;4BACVE,KAAKA;4BACLC,OAAOA;;wBAGPZ,CAAAA,qBAAqBF,mBAAkB,mBACvC,KAACR;4BACC4B,eAAepB;4BACfE,mBAAmBA;4BACnBmB,oBAAoBjB,iBAAiBH,IAAIO,QAAQ;4BACjDG,UAAUA;;;;gBAIfR,8BACC,KAACV;oBACC6B,aAAY;oBACZN,WAAW,CAAC,EAAEpB,UAAU,QAAQ,CAAC;oBACjC2B,MAAK;oBACLC,WAAU;oBACVC,SAAStB;oBACTuB,KAAK;;;;;AAMjB,EAAC"}
+{"version":3,"file":"index.js","names":["React","UploadActions","Button","Thumbnail","FileMeta","baseClass","FileDetails","props","collectionSlug","customUploadActions","doc","enableAdjustments","handleRemove","hasImageSizes","imageCacheTag","uploadConfig","id","filename","filesize","height","mimeType","thumbnailURL","url","width","_jsx","className","_jsxs","fileSrc","collection","customActions","enablePreviewSizes","buttonStyle","icon","iconStyle","onClick","round"],"sources":["../../../src/elements/FileDetails/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { UploadActions } from '../../elements/Upload/index.js'\nimport { Button } from '../Button/index.js'\nimport { Thumbnail } from '../Thumbnail/index.js'\nimport { FileMeta } from './FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-details'\n\nimport type { Data, FileSizes, SanitizedCollectionConfig } from 'payload'\n\nexport type FileDetailsProps = {\n  collectionSlug: string\n  customUploadActions?: React.ReactNode[]\n  doc: {\n    sizes?: FileSizes\n  } & Data\n  enableAdjustments?: boolean\n  handleRemove?: () => void\n  hasImageSizes?: boolean\n  imageCacheTag?: string\n  uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const FileDetails: React.FC<FileDetailsProps> = (props) => {\n  const {\n    collectionSlug,\n    customUploadActions,\n    doc,\n    enableAdjustments,\n    handleRemove,\n    hasImageSizes,\n    imageCacheTag,\n    uploadConfig,\n  } = props\n\n  const { id, filename, filesize, height, mimeType, thumbnailURL, url, width } = doc\n\n  return (\n    <div className={baseClass}>\n      <header>\n        <Thumbnail\n          // size=\"small\"\n          className={`${baseClass}__thumbnail`}\n          collectionSlug={collectionSlug}\n          doc={doc}\n          fileSrc={thumbnailURL || url}\n          imageCacheTag={imageCacheTag}\n          uploadConfig={uploadConfig}\n        />\n        <div className={`${baseClass}__main-detail`}>\n          <FileMeta\n            collection={collectionSlug}\n            filename={filename as string}\n            filesize={filesize as number}\n            height={height as number}\n            id={id as string}\n            mimeType={mimeType as string}\n            url={url as string}\n            width={width as number}\n          />\n\n          {(enableAdjustments || customUploadActions) && (\n            <UploadActions\n              customActions={customUploadActions}\n              enableAdjustments={enableAdjustments}\n              enablePreviewSizes={hasImageSizes && doc.filename}\n              mimeType={mimeType}\n            />\n          )}\n        </div>\n        {handleRemove && (\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__remove`}\n            icon=\"x\"\n            iconStyle=\"with-border\"\n            onClick={handleRemove}\n            round\n          />\n        )}\n      </header>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,MAAW;AAElB,SAASC,aAAa,QAAQ;AAC9B,SAASC,MAAM,QAAQ;AACvB,SAASC,SAAS,QAAQ;AAC1B,SAASC,QAAQ,QAAQ;AACzB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAiBlB,OAAO,MAAMC,WAAA,GAA2CC,KAAA;EACtD,MAAM;IACJC,cAAc;IACdC,mBAAmB;IACnBC,GAAG;IACHC,iBAAiB;IACjBC,YAAY;IACZC,aAAa;IACbC,aAAa;IACbC;EAAY,CACb,GAAGR,KAAA;EAEJ,MAAM;IAAES,EAAE;IAAEC,QAAQ;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,QAAQ;IAAEC,YAAY;IAAEC,GAAG;IAAEC;EAAK,CAAE,GAAGb,GAAA;EAE/E,oBACEc,IAAA,CAAC;IAAIC,SAAA,EAAWpB,SAAA;cACd,aAAAqB,KAAA,CAAC;8BACCF,IAAA,CAACrB,SAAA;QACC;QACAsB,SAAA,EAAW,GAAGpB,SAAA,aAAsB;QACpCG,cAAA,EAAgBA,cAAA;QAChBE,GAAA,EAAKA,GAAA;QACLiB,OAAA,EAASN,YAAA,IAAgBC,GAAA;QACzBR,aAAA,EAAeA,aAAA;QACfC,YAAA,EAAcA;uBAEhBW,KAAA,CAAC;QAAID,SAAA,EAAW,GAAGpB,SAAA,eAAwB;gCACzCmB,IAAA,CAACpB,QAAA;UACCwB,UAAA,EAAYpB,cAAA;UACZS,QAAA,EAAUA,QAAA;UACVC,QAAA,EAAUA,QAAA;UACVC,MAAA,EAAQA,MAAA;UACRH,EAAA,EAAIA,EAAA;UACJI,QAAA,EAAUA,QAAA;UACVE,GAAA,EAAKA,GAAA;UACLC,KAAA,EAAOA;YAGP,CAAAZ,iBAAA,IAAqBF,mBAAkB,kBACvCe,IAAA,CAACvB,aAAA;UACC4B,aAAA,EAAepB,mBAAA;UACfE,iBAAA,EAAmBA,iBAAA;UACnBmB,kBAAA,EAAoBjB,aAAA,IAAiBH,GAAA,CAAIO,QAAQ;UACjDG,QAAA,EAAUA;;UAIfR,YAAA,iBACCY,IAAA,CAACtB,MAAA;QACC6B,WAAA,EAAY;QACZN,SAAA,EAAW,GAAGpB,SAAA,UAAmB;QACjC2B,IAAA,EAAK;QACLC,SAAA,EAAU;QACVC,OAAA,EAAStB,YAAA;QACTuB,KAAK;;;;AAMjB","ignoreList":[]}

package/dist/elements/GenerateConfirmation/index.js

@@ -1,4 +1,5 @@
 'use client';
+
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Modal, useModal } from '@faceless-ui/modal';
 import React from 'react';
@@ -9,65 +10,67 @@ import { Button } from '../Button/index.js';
 import { Translation } from '../Translation/index.js';
 import './index.scss';
 const baseClass = 'generate-confirmation';
-export const GenerateConfirmation = (props)=>{
-    const { highlightField, setKey } = props;
-    const { id } = useDocumentInfo();
-    const { toggleModal } = useModal();
-    const { t } = useTranslation();
-    const modalSlug = `generate-confirmation-${id}`;
-    const handleGenerate = ()=>{
-        setKey();
+export const GenerateConfirmation = props => {
+  const {
+    highlightField,
+    setKey
+  } = props;
+  const {
+    id
+  } = useDocumentInfo();
+  const {
+    toggleModal
+  } = useModal();
+  const {
+    t
+  } = useTranslation();
+  const modalSlug = `generate-confirmation-${id}`;
+  const handleGenerate = () => {
+    setKey();
+    toggleModal(modalSlug);
+    toast.success(t('authentication:newAPIKeyGenerated'));
+    highlightField(true);
+  };
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [/*#__PURE__*/_jsx(Button, {
+      buttonStyle: "secondary",
+      onClick: () => {
         toggleModal(modalSlug);
-        toast.success(t('authentication:newAPIKeyGenerated'));
-        highlightField(true);
-    };
-    return /*#__PURE__*/ _jsxs(React.Fragment, {
-        children: [
-            /*#__PURE__*/ _jsx(Button, {
-                buttonStyle: "secondary",
-                onClick: ()=>{
-                    toggleModal(modalSlug);
-                },
-                size: "small",
-                children: t('authentication:generateNewAPIKey')
-            }),
-            /*#__PURE__*/ _jsx(Modal, {
-                className: baseClass,
-                slug: modalSlug,
-                children: /*#__PURE__*/ _jsxs("div", {
-                    className: `${baseClass}__template`,
-                    children: [
-                        /*#__PURE__*/ _jsx("h1", {
-                            children: t('authentication:confirmGeneration')
-                        }),
-                        /*#__PURE__*/ _jsx("p", {
-                            children: /*#__PURE__*/ _jsx(Translation, {
-                                elements: {
-                                    1: ({ children })=>/*#__PURE__*/ _jsx("strong", {
-                                            children: children
-                                        })
-                                },
-                                i18nKey: "authentication:generatingNewAPIKeyWillInvalidate",
-                                t: t
-                            })
-                        }),
-                        /*#__PURE__*/ _jsx(Button, {
-                            buttonStyle: "secondary",
-                            onClick: ()=>{
-                                toggleModal(modalSlug);
-                            },
-                            type: "button",
-                            children: t('general:cancel')
-                        }),
-                        /*#__PURE__*/ _jsx(Button, {
-                            onClick: handleGenerate,
-                            children: t('authentication:generate')
-                        })
-                    ]
-                })
-            })
-        ]
-    });
+      },
+      size: "small",
+      children: t('authentication:generateNewAPIKey')
+    }), /*#__PURE__*/_jsx(Modal, {
+      className: baseClass,
+      slug: modalSlug,
+      children: /*#__PURE__*/_jsxs("div", {
+        className: `${baseClass}__template`,
+        children: [/*#__PURE__*/_jsx("h1", {
+          children: t('authentication:confirmGeneration')
+        }), /*#__PURE__*/_jsx("p", {
+          children: /*#__PURE__*/_jsx(Translation, {
+            elements: {
+              1: ({
+                children
+              }) => /*#__PURE__*/_jsx("strong", {
+                children: children
+              })
+            },
+            i18nKey: "authentication:generatingNewAPIKeyWillInvalidate",
+            t: t
+          })
+        }), /*#__PURE__*/_jsx(Button, {
+          buttonStyle: "secondary",
+          onClick: () => {
+            toggleModal(modalSlug);
+          },
+          type: "button",
+          children: t('general:cancel')
+        }), /*#__PURE__*/_jsx(Button, {
+          onClick: handleGenerate,
+          children: t('authentication:generate')
+        })]
+      })
+    })]
+  });
 };
-
 //# sourceMappingURL=index.js.map

package/dist/elements/GenerateConfirmation/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/GenerateConfirmation/index.tsx"],"sourcesContent":["'use client'\nimport { Modal, useModal } from '@faceless-ui/modal'\nimport React from 'react'\nimport { toast } from 'sonner'\n\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport { Translation } from '../Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'generate-confirmation'\n\nexport type GenerateConfirmationProps = {\n  highlightField: (Boolean) => void\n  setKey: () => void\n}\n\nexport const GenerateConfirmation: React.FC<GenerateConfirmationProps> = (props) => {\n  const { highlightField, setKey } = props\n\n  const { id } = useDocumentInfo()\n  const { toggleModal } = useModal()\n  const { t } = useTranslation()\n\n  const modalSlug = `generate-confirmation-${id}`\n\n  const handleGenerate = () => {\n    setKey()\n    toggleModal(modalSlug)\n    toast.success(t('authentication:newAPIKeyGenerated'))\n    highlightField(true)\n  }\n\n  return (\n    <React.Fragment>\n      <Button\n        buttonStyle=\"secondary\"\n        onClick={() => {\n          toggleModal(modalSlug)\n        }}\n        size=\"small\"\n      >\n        {t('authentication:generateNewAPIKey')}\n      </Button>\n      <Modal className={baseClass} slug={modalSlug}>\n        <div className={`${baseClass}__template`}>\n          <h1>{t('authentication:confirmGeneration')}</h1>\n          <p>\n            <Translation\n              elements={{\n                1: ({ children }) => <strong>{children}</strong>,\n              }}\n              i18nKey=\"authentication:generatingNewAPIKeyWillInvalidate\"\n              t={t}\n            />\n          </p>\n\n          <Button\n            buttonStyle=\"secondary\"\n            onClick={() => {\n              toggleModal(modalSlug)\n            }}\n            type=\"button\"\n          >\n            {t('general:cancel')}\n          </Button>\n          <Button onClick={handleGenerate}>{t('authentication:generate')}</Button>\n        </div>\n      </Modal>\n    </React.Fragment>\n  )\n}\n"],"names":["Modal","useModal","React","toast","useDocumentInfo","useTranslation","Button","Translation","baseClass","GenerateConfirmation","props","highlightField","setKey","id","toggleModal","t","modalSlug","handleGenerate","success","Fragment","buttonStyle","onClick","size","className","slug","div","h1","p","elements","children","strong","i18nKey","type"],"mappings":"AAAA;;AACA,SAASA,KAAK,EAAEC,QAAQ,QAAQ,qBAAoB;AACpD,OAAOC,WAAW,QAAO;AACzB,SAASC,KAAK,QAAQ,SAAQ;AAE9B,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,WAAW,QAAQ,0BAAyB;AACrD,OAAO,eAAc;AAErB,MAAMC,YAAY;AAOlB,OAAO,MAAMC,uBAA4D,CAACC;IACxE,MAAM,EAAEC,cAAc,EAAEC,MAAM,EAAE,GAAGF;IAEnC,MAAM,EAAEG,EAAE,EAAE,GAAGT;IACf,MAAM,EAAEU,WAAW,EAAE,GAAGb;IACxB,MAAM,EAAEc,CAAC,EAAE,GAAGV;IAEd,MAAMW,YAAY,CAAC,sBAAsB,EAAEH,GAAG,CAAC;IAE/C,MAAMI,iBAAiB;QACrBL;QACAE,YAAYE;QACZb,MAAMe,OAAO,CAACH,EAAE;QAChBJ,eAAe;IACjB;IAEA,qBACE,MAACT,MAAMiB,QAAQ;;0BACb,KAACb;gBACCc,aAAY;gBACZC,SAAS;oBACPP,YAAYE;gBACd;gBACAM,MAAK;0BAEJP,EAAE;;0BAEL,KAACf;gBAAMuB,WAAWf;gBAAWgB,MAAMR;0BACjC,cAAA,MAACS;oBAAIF,WAAW,CAAC,EAAEf,UAAU,UAAU,CAAC;;sCACtC,KAACkB;sCAAIX,EAAE;;sCACP,KAACY;sCACC,cAAA,KAACpB;gCACCqB,UAAU;oCACR,GAAG,CAAC,EAAEC,QAAQ,EAAE,iBAAK,KAACC;sDAAQD;;gCAChC;gCACAE,SAAQ;gCACRhB,GAAGA;;;sCAIP,KAACT;4BACCc,aAAY;4BACZC,SAAS;gCACPP,YAAYE;4BACd;4BACAgB,MAAK;sCAEJjB,EAAE;;sCAEL,KAACT;4BAAOe,SAASJ;sCAAiBF,EAAE;;;;;;;AAK9C,EAAC"}
+{"version":3,"file":"index.js","names":["Modal","useModal","React","toast","useDocumentInfo","useTranslation","Button","Translation","baseClass","GenerateConfirmation","props","highlightField","setKey","id","toggleModal","t","modalSlug","handleGenerate","success","_jsxs","Fragment","_jsx","buttonStyle","onClick","size","className","slug","elements","children","i18nKey","type"],"sources":["../../../src/elements/GenerateConfirmation/index.tsx"],"sourcesContent":["'use client'\nimport { Modal, useModal } from '@faceless-ui/modal'\nimport React from 'react'\nimport { toast } from 'sonner'\n\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport { Translation } from '../Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'generate-confirmation'\n\nexport type GenerateConfirmationProps = {\n  highlightField: (Boolean) => void\n  setKey: () => void\n}\n\nexport const GenerateConfirmation: React.FC<GenerateConfirmationProps> = (props) => {\n  const { highlightField, setKey } = props\n\n  const { id } = useDocumentInfo()\n  const { toggleModal } = useModal()\n  const { t } = useTranslation()\n\n  const modalSlug = `generate-confirmation-${id}`\n\n  const handleGenerate = () => {\n    setKey()\n    toggleModal(modalSlug)\n    toast.success(t('authentication:newAPIKeyGenerated'))\n    highlightField(true)\n  }\n\n  return (\n    <React.Fragment>\n      <Button\n        buttonStyle=\"secondary\"\n        onClick={() => {\n          toggleModal(modalSlug)\n        }}\n        size=\"small\"\n      >\n        {t('authentication:generateNewAPIKey')}\n      </Button>\n      <Modal className={baseClass} slug={modalSlug}>\n        <div className={`${baseClass}__template`}>\n          <h1>{t('authentication:confirmGeneration')}</h1>\n          <p>\n            <Translation\n              elements={{\n                1: ({ children }) => <strong>{children}</strong>,\n              }}\n              i18nKey=\"authentication:generatingNewAPIKeyWillInvalidate\"\n              t={t}\n            />\n          </p>\n\n          <Button\n            buttonStyle=\"secondary\"\n            onClick={() => {\n              toggleModal(modalSlug)\n            }}\n            type=\"button\"\n          >\n            {t('general:cancel')}\n          </Button>\n          <Button onClick={handleGenerate}>{t('authentication:generate')}</Button>\n        </div>\n      </Modal>\n    </React.Fragment>\n  )\n}\n"],"mappings":"AAAA;;;AACA,SAASA,KAAK,EAAEC,QAAQ,QAAQ;AAChC,OAAOC,KAAA,MAAW;AAClB,SAASC,KAAK,QAAQ;AAEtB,SAASC,eAAe,QAAQ;AAChC,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,QAAQ;AACvB,SAASC,WAAW,QAAQ;AAC5B,OAAO;AAEP,MAAMC,SAAA,GAAY;AAOlB,OAAO,MAAMC,oBAAA,GAA6DC,KAAA;EACxE,MAAM;IAAEC,cAAc;IAAEC;EAAM,CAAE,GAAGF,KAAA;EAEnC,MAAM;IAAEG;EAAE,CAAE,GAAGT,eAAA;EACf,MAAM;IAAEU;EAAW,CAAE,GAAGb,QAAA;EACxB,MAAM;IAAEc;EAAC,CAAE,GAAGV,cAAA;EAEd,MAAMW,SAAA,GAAY,yBAAyBH,EAAA,EAAI;EAE/C,MAAMI,cAAA,GAAiBA,CAAA;IACrBL,MAAA;IACAE,WAAA,CAAYE,SAAA;IACZb,KAAA,CAAMe,OAAO,CAACH,CAAA,CAAE;IAChBJ,cAAA,CAAe;EACjB;EAEA,oBACEQ,KAAA,CAACjB,KAAA,CAAMkB,QAAQ;4BACbC,IAAA,CAACf,MAAA;MACCgB,WAAA,EAAY;MACZC,OAAA,EAASA,CAAA;QACPT,WAAA,CAAYE,SAAA;MACd;MACAQ,IAAA,EAAK;gBAEJT,CAAA,CAAE;qBAELM,IAAA,CAACrB,KAAA;MAAMyB,SAAA,EAAWjB,SAAA;MAAWkB,IAAA,EAAMV,SAAA;gBACjC,aAAAG,KAAA,CAAC;QAAIM,SAAA,EAAW,GAAGjB,SAAA,YAAqB;gCACtCa,IAAA,CAAC;oBAAIN,CAAA,CAAE;yBACPM,IAAA,CAAC;oBACC,aAAAA,IAAA,CAACd,WAAA;YACCoB,QAAA,EAAU;cACR,GAAG,CAAC;gBAAEC;cAAQ,CAAE,kBAAKP,IAAA,CAAC;0BAAQO;;YAChC;YACAC,OAAA,EAAQ;YACRd,CAAA,EAAGA;;yBAIPM,IAAA,CAACf,MAAA;UACCgB,WAAA,EAAY;UACZC,OAAA,EAASA,CAAA;YACPT,WAAA,CAAYE,SAAA;UACd;UACAc,IAAA,EAAK;oBAEJf,CAAA,CAAE;yBAELM,IAAA,CAACf,MAAA;UAAOiB,OAAA,EAASN,cAAA;oBAAiBF,CAAA,CAAE;;;;;AAK9C","ignoreList":[]}

package/dist/elements/Gutter/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Gutter/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAA;AAEzC,OAAO,cAAc,CAAA;AAErB,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAID,eAAO,MAAM,MAAM,oFA6BjB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Gutter/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,MAAM,OAAO,CAAA;AAEzC,OAAO,cAAc,CAAA;AAErB,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAID,eAAO,MAAM,MAAM,oFA6BjB,CAAA"}

package/dist/elements/Gutter/index.js

@@ -1,23 +1,25 @@
+'use client';
+
 import { jsx as _jsx } from "react/jsx-runtime";
 import React, { forwardRef } from 'react';
 import './index.scss';
 const baseClass = 'gutter';
-export const Gutter = /*#__PURE__*/ forwardRef((props, ref)=>{
-    const { children, className, left = true, negativeLeft = false, negativeRight = false, right = true } = props;
-    const shouldPadLeft = left && !negativeLeft;
-    const shouldPadRight = right && !negativeRight;
-    return /*#__PURE__*/ _jsx("div", {
-        className: [
-            shouldPadLeft && `${baseClass}--left`,
-            shouldPadRight && `${baseClass}--right`,
-            negativeLeft && `${baseClass}--negative-left`,
-            negativeRight && `${baseClass}--negative-right`,
-            className
-        ].filter(Boolean).join(' '),
-        ref: ref,
-        children: children
-    });
+export const Gutter = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+    children,
+    className,
+    left = true,
+    negativeLeft = false,
+    negativeRight = false,
+    right = true
+  } = props;
+  const shouldPadLeft = left && !negativeLeft;
+  const shouldPadRight = right && !negativeRight;
+  return /*#__PURE__*/_jsx("div", {
+    className: [shouldPadLeft && `${baseClass}--left`, shouldPadRight && `${baseClass}--right`, negativeLeft && `${baseClass}--negative-left`, negativeRight && `${baseClass}--negative-right`, className].filter(Boolean).join(' '),
+    ref: ref,
+    children: children
+  });
 });
 Gutter.displayName = 'Gutter';
-
 //# sourceMappingURL=index.js.map

package/dist/elements/Gutter/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Gutter/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport './index.scss'\n\nexport type GutterProps = {\n  children: React.ReactNode\n  className?: string\n  left?: boolean\n  negativeLeft?: boolean\n  negativeRight?: boolean\n  right?: boolean\n}\n\nconst baseClass = 'gutter'\n\nexport const Gutter = forwardRef<HTMLDivElement, GutterProps>((props, ref) => {\n  const {\n    children,\n    className,\n    left = true,\n    negativeLeft = false,\n    negativeRight = false,\n    right = true,\n  } = props\n\n  const shouldPadLeft = left && !negativeLeft\n  const shouldPadRight = right && !negativeRight\n\n  return (\n    <div\n      className={[\n        shouldPadLeft && `${baseClass}--left`,\n        shouldPadRight && `${baseClass}--right`,\n        negativeLeft && `${baseClass}--negative-left`,\n        negativeRight && `${baseClass}--negative-right`,\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      ref={ref}\n    >\n      {children}\n    </div>\n  )\n})\n\nGutter.displayName = 'Gutter'\n"],"names":["React","forwardRef","baseClass","Gutter","props","ref","children","className","left","negativeLeft","negativeRight","right","shouldPadLeft","shouldPadRight","div","filter","Boolean","join","displayName"],"mappings":";AAAA,OAAOA,SAASC,UAAU,QAAQ,QAAO;AAEzC,OAAO,eAAc;AAWrB,MAAMC,YAAY;AAElB,OAAO,MAAMC,uBAASF,WAAwC,CAACG,OAAOC;IACpE,MAAM,EACJC,QAAQ,EACRC,SAAS,EACTC,OAAO,IAAI,EACXC,eAAe,KAAK,EACpBC,gBAAgB,KAAK,EACrBC,QAAQ,IAAI,EACb,GAAGP;IAEJ,MAAMQ,gBAAgBJ,QAAQ,CAACC;IAC/B,MAAMI,iBAAiBF,SAAS,CAACD;IAEjC,qBACE,KAACI;QACCP,WAAW;YACTK,iBAAiB,CAAC,EAAEV,UAAU,MAAM,CAAC;YACrCW,kBAAkB,CAAC,EAAEX,UAAU,OAAO,CAAC;YACvCO,gBAAgB,CAAC,EAAEP,UAAU,eAAe,CAAC;YAC7CQ,iBAAiB,CAAC,EAAER,UAAU,gBAAgB,CAAC;YAC/CK;SACD,CACEQ,MAAM,CAACC,SACPC,IAAI,CAAC;QACRZ,KAAKA;kBAEJC;;AAGP,GAAE;AAEFH,OAAOe,WAAW,GAAG"}
+{"version":3,"file":"index.js","names":["React","forwardRef","baseClass","Gutter","props","ref","children","className","left","negativeLeft","negativeRight","right","shouldPadLeft","shouldPadRight","_jsx","filter","Boolean","join","displayName"],"sources":["../../../src/elements/Gutter/index.tsx"],"sourcesContent":["'use client'\nimport React, { forwardRef } from 'react'\n\nimport './index.scss'\n\nexport type GutterProps = {\n  children: React.ReactNode\n  className?: string\n  left?: boolean\n  negativeLeft?: boolean\n  negativeRight?: boolean\n  right?: boolean\n}\n\nconst baseClass = 'gutter'\n\nexport const Gutter = forwardRef<HTMLDivElement, GutterProps>((props, ref) => {\n  const {\n    children,\n    className,\n    left = true,\n    negativeLeft = false,\n    negativeRight = false,\n    right = true,\n  } = props\n\n  const shouldPadLeft = left && !negativeLeft\n  const shouldPadRight = right && !negativeRight\n\n  return (\n    <div\n      className={[\n        shouldPadLeft && `${baseClass}--left`,\n        shouldPadRight && `${baseClass}--right`,\n        negativeLeft && `${baseClass}--negative-left`,\n        negativeRight && `${baseClass}--negative-right`,\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      ref={ref}\n    >\n      {children}\n    </div>\n  )\n})\n\nGutter.displayName = 'Gutter'\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,IAASC,UAAU,QAAQ;AAElC,OAAO;AAWP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,MAAA,gBAASF,UAAA,CAAwC,CAACG,KAAA,EAAOC,GAAA;EACpE,MAAM;IACJC,QAAQ;IACRC,SAAS;IACTC,IAAA,GAAO,IAAI;IACXC,YAAA,GAAe,KAAK;IACpBC,aAAA,GAAgB,KAAK;IACrBC,KAAA,GAAQ;EAAI,CACb,GAAGP,KAAA;EAEJ,MAAMQ,aAAA,GAAgBJ,IAAA,IAAQ,CAACC,YAAA;EAC/B,MAAMI,cAAA,GAAiBF,KAAA,IAAS,CAACD,aAAA;EAEjC,oBACEI,IAAA,CAAC;IACCP,SAAA,EAAW,CACTK,aAAA,IAAiB,GAAGV,SAAA,QAAiB,EACrCW,cAAA,IAAkB,GAAGX,SAAA,SAAkB,EACvCO,YAAA,IAAgB,GAAGP,SAAA,iBAA0B,EAC7CQ,aAAA,IAAiB,GAAGR,SAAA,kBAA2B,EAC/CK,SAAA,CACD,CACEQ,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;IACRZ,GAAA,EAAKA,GAAA;cAEJC;;AAGP;AAEAH,MAAA,CAAOe,WAAW,GAAG","ignoreList":[]}