@webiny/app-headless-cms 0.0.0-unstable.e6f0dc8ca7 → 0.0.0-unstable.eb81deee7e

package/admin/components/DropZone/Vertical.js

@@ -1,50 +1,29 @@
-import React from "react";
+import react from "react";
 import { Droppable } from "../Droppable.js";
-import { cn } from "@webiny/admin-ui";
-const OuterDivVertical = ({
-  isOver,
-  last,
-  isDragging
-}) => /*#__PURE__*/React.createElement("div", {
-  className: cn("absolute top-0 h-full w-[30%] z-10 bg-transparent", last ? "text-right -right-sm" : "text-left -left-sm")
-}, /*#__PURE__*/React.createElement("div", {
-  className: cn("absolute w-md h-full z-3 border-dashed border-sm hidden", isOver ? "border-accent-default" : "border-success-default", last ? "-right-sm" : "-left-sm", isDragging && "block")
-}, /*#__PURE__*/React.createElement("div", {
-  className: cn("w-full h-full opacity-50", isOver ? "bg-primary-muted" : "bg-success-muted")
-})));
-const Vertical = ({
-  depth,
-  last,
-  onDrop,
-  isVisible
-}) => {
-  return /*#__PURE__*/React.createElement(Droppable, {
-    onDrop: onDrop,
-    isVisible: isVisible
-  }, ({
-    isOver,
-    isDragging,
-    drop
-  }) => /*#__PURE__*/React.createElement("div", {
-    ref: element => {
-      drop(element);
-    },
-    style: {
-      /* For dropzone debugging: border: "1px solid blue",*/
-      width: "30%",
-      maxWidth: "100px",
-      height: "100%",
-      position: "absolute",
-      top: 0,
-      [last ? "right" : "left"]: 0,
-      zIndex: isDragging ? 1000 + (depth || 0) : -1
-    }
-  }, /*#__PURE__*/React.createElement(OuterDivVertical, {
-    isOver: isOver,
-    isDragging: isDragging,
-    last: last
-  })));
-};
-export default Vertical;
+import { Icon, cn } from "@webiny/admin-ui";
+import { ReactComponent } from "@webiny/icons/add.svg";
+const Vertical = ({ depth, last, onDrop, isVisible })=>/*#__PURE__*/ react.createElement(Droppable, {
+        onDrop: onDrop,
+        isVisible: isVisible
+    }, ({ isOver, isDragging, drop })=>/*#__PURE__*/ react.createElement("div", {
+            ref: (element)=>{
+                drop(element);
+            },
+            className: cn("w-sm-extra h-full absolute top-0", last ? "right-0" : "left-0"),
+            style: {
+                zIndex: isDragging ? 1000 + (depth || 0) : -1
+            }
+        }, isDragging && /*#__PURE__*/ react.createElement("div", {
+            className: cn("absolute top-0 h-full flex items-center rounded-xs", last ? "right-0" : "left-0")
+        }, /*#__PURE__*/ react.createElement("div", {
+            className: cn("h-full w-sm-extra rounded-xs p-xxs transition-colors relative flex items-center justify-center", isOver ? "bg-warning-muted" : "bg-warning-muted/60")
+        }, /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            label: "Add",
+            size: "xs",
+            className: "fill-warning-600"
+        })))));
+const DropZone_Vertical = Vertical;
+export default DropZone_Vertical;
 
 //# sourceMappingURL=Vertical.js.map

package/admin/components/DropZone/Vertical.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Droppable","cn","OuterDivVertical","isOver","last","isDragging","createElement","className","Vertical","depth","onDrop","isVisible","drop","ref","element","style","width","maxWidth","height","position","top","zIndex"],"sources":["Vertical.tsx"],"sourcesContent":["import React from \"react\";\nimport type { IsVisibleCallable } from \"../Droppable.js\";\nimport { Droppable } from \"../Droppable.js\";\nimport type { DragSource } from \"~/types.js\";\nimport { cn } from \"@webiny/admin-ui\";\n\ninterface OuterDivVerticalProps {\n    isOver: boolean;\n    last?: boolean;\n    isDragging?: boolean;\n}\n\nconst OuterDivVertical = ({ isOver, last, isDragging }: OuterDivVerticalProps) => (\n    <div\n        className={cn(\n            \"absolute top-0 h-full w-[30%] z-10 bg-transparent\",\n            last ? \"text-right -right-sm\" : \"text-left -left-sm\"\n        )}\n    >\n        <div\n            className={cn(\n                \"absolute w-md h-full z-3 border-dashed border-sm hidden\",\n                isOver ? \"border-accent-default\" : \"border-success-default\",\n                last ? \"-right-sm\" : \"-left-sm\",\n                isDragging && \"block\"\n            )}\n        >\n            <div\n                className={cn(\n                    \"w-full h-full opacity-50\",\n                    isOver ? \"bg-primary-muted\" : \"bg-success-muted\"\n                )}\n            />\n        </div>\n    </div>\n);\n\ninterface VerticalProps {\n    depth?: number;\n    onDrop(item: DragSource): void;\n    last?: boolean;\n    isVisible?: IsVisibleCallable;\n}\n\nconst Vertical = ({ depth, last, onDrop, isVisible }: VerticalProps) => {\n    return (\n        <Droppable onDrop={onDrop} isVisible={isVisible}>\n            {({ isOver, isDragging, drop }) => (\n                <div\n                    ref={element => {\n                        drop(element);\n                    }}\n                    style={{\n                        /* For dropzone debugging: border: \"1px solid blue\",*/\n                        width: \"30%\",\n                        maxWidth: \"100px\",\n                        height: \"100%\",\n                        position: \"absolute\",\n                        top: 0,\n                        [last ? \"right\" : \"left\"]: 0,\n                        zIndex: isDragging ? 1000 + (depth || 0) : -1\n                    }}\n                >\n                    <OuterDivVertical isOver={isOver} isDragging={isDragging} last={last} />\n                </div>\n            )}\n        </Droppable>\n    );\n};\n\nexport default Vertical;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,SAAS;AAElB,SAASC,EAAE,QAAQ,kBAAkB;AAQrC,MAAMC,gBAAgB,GAAGA,CAAC;EAAEC,MAAM;EAAEC,IAAI;EAAEC;AAAkC,CAAC,kBACzEN,KAAA,CAAAO,aAAA;EACIC,SAAS,EAAEN,EAAE,CACT,mDAAmD,EACnDG,IAAI,GAAG,sBAAsB,GAAG,oBACpC;AAAE,gBAEFL,KAAA,CAAAO,aAAA;EACIC,SAAS,EAAEN,EAAE,CACT,yDAAyD,EACzDE,MAAM,GAAG,uBAAuB,GAAG,wBAAwB,EAC3DC,IAAI,GAAG,WAAW,GAAG,UAAU,EAC/BC,UAAU,IAAI,OAClB;AAAE,gBAEFN,KAAA,CAAAO,aAAA;EACIC,SAAS,EAAEN,EAAE,CACT,0BAA0B,EAC1BE,MAAM,GAAG,kBAAkB,GAAG,kBAClC;AAAE,CACL,CACA,CACJ,CACR;AASD,MAAMK,QAAQ,GAAGA,CAAC;EAAEC,KAAK;EAAEL,IAAI;EAAEM,MAAM;EAAEC;AAAyB,CAAC,KAAK;EACpE,oBACIZ,KAAA,CAAAO,aAAA,CAACN,SAAS;IAACU,MAAM,EAAEA,MAAO;IAACC,SAAS,EAAEA;EAAU,GAC3C,CAAC;IAAER,MAAM;IAAEE,UAAU;IAAEO;EAAK,CAAC,kBAC1Bb,KAAA,CAAAO,aAAA;IACIO,GAAG,EAAEC,OAAO,IAAI;MACZF,IAAI,CAACE,OAAO,CAAC;IACjB,CAAE;IACFC,KAAK,EAAE;MACH;MACAC,KAAK,EAAE,KAAK;MACZC,QAAQ,EAAE,OAAO;MACjBC,MAAM,EAAE,MAAM;MACdC,QAAQ,EAAE,UAAU;MACpBC,GAAG,EAAE,CAAC;MACN,CAAChB,IAAI,GAAG,OAAO,GAAG,MAAM,GAAG,CAAC;MAC5BiB,MAAM,EAAEhB,UAAU,GAAG,IAAI,IAAII,KAAK,IAAI,CAAC,CAAC,GAAG,CAAC;IAChD;EAAE,gBAEFV,KAAA,CAAAO,aAAA,CAACJ,gBAAgB;IAACC,MAAM,EAAEA,MAAO;IAACE,UAAU,EAAEA,UAAW;IAACD,IAAI,EAAEA;EAAK,CAAE,CACtE,CAEF,CAAC;AAEpB,CAAC;AAED,eAAeI,QAAQ","ignoreList":[]}
+{"version":3,"file":"admin/components/DropZone/Vertical.js","sources":["../../../../src/admin/components/DropZone/Vertical.tsx"],"sourcesContent":["import React from \"react\";\nimport type { IsVisibleCallable } from \"../Droppable.js\";\nimport { Droppable } from \"../Droppable.js\";\nimport type { DragSource } from \"~/types.js\";\nimport { cn, Icon } from \"@webiny/admin-ui\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\n\ninterface VerticalProps {\n    depth?: number;\n    onDrop(item: DragSource): void;\n    last?: boolean;\n    isVisible?: IsVisibleCallable;\n}\n\nconst Vertical = ({ depth, last, onDrop, isVisible }: VerticalProps) => {\n    return (\n        <Droppable onDrop={onDrop} isVisible={isVisible}>\n            {({ isOver, isDragging, drop }) => (\n                <div\n                    ref={element => {\n                        drop(element);\n                    }}\n                    className={cn(\"w-sm-extra h-full absolute top-0\", last ? \"right-0\" : \"left-0\")}\n                    style={{ zIndex: isDragging ? 1000 + (depth || 0) : -1 }}\n                >\n                    {isDragging && (\n                        <div\n                            className={cn(\n                                \"absolute top-0 h-full flex items-center rounded-xs\",\n                                last ? \"right-0\" : \"left-0\"\n                            )}\n                        >\n                            <div\n                                className={cn(\n                                    \"h-full w-sm-extra rounded-xs p-xxs transition-colors relative flex items-center justify-center\",\n                                    isOver ? \"bg-warning-muted\" : \"bg-warning-muted/60\"\n                                )}\n                            >\n                                <Icon\n                                    icon={<AddIcon />}\n                                    label=\"Add\"\n                                    size=\"xs\"\n                                    className={\"fill-warning-600\"}\n                                />\n                            </div>\n                        </div>\n                    )}\n                </div>\n            )}\n        </Droppable>\n    );\n};\n\nexport default Vertical;\n"],"names":["Vertical","depth","last","onDrop","isVisible","Droppable","isOver","isDragging","drop","element","cn","Icon","AddIcon"],"mappings":";;;;AAcA,MAAMA,WAAW,CAAC,EAAEC,KAAK,EAAEC,IAAI,EAAEC,MAAM,EAAEC,SAAS,EAAiB,GACxD,WAAP,GACI,oBAACC,WAASA;QAAC,QAAQF;QAAQ,WAAWC;OACjC,CAAC,EAAEE,MAAM,EAAEC,UAAU,EAAEC,IAAI,EAAE,iBAC1B,oBAAC;YACG,KAAKC,CAAAA;gBACDD,KAAKC;YACT;YACA,WAAWC,GAAG,oCAAoCR,OAAO,YAAY;YACrE,OAAO;gBAAE,QAAQK,aAAa,OAAQN,CAAAA,SAAS,KAAK;YAAG;WAEtDM,cAAc,WAAdA,GACG,oBAAC;YACG,WAAWG,GACP,sDACAR,OAAO,YAAY;yBAGvB,oBAAC;YACG,WAAWQ,GACP,kGACAJ,SAAS,qBAAqB;yBAGlC,oBAACK,MAAIA;YACD,oBAAM,oBAACC,gBAAOA;YACd,OAAM;YACN,MAAK;YACL,WAAW;;AAW/C,0BAAeZ"}

package/admin/components/DropZone/index.js

@@ -1,6 +1,3 @@
-import Center from "./Center.js";
-import Horizontal from "./Horizontal.js";
-import Vertical from "./Vertical.js";
-export { Center, Horizontal, Vertical };
-
-//# sourceMappingURL=index.js.map
+export { default as Center } from "./Center.js";
+export { default as Horizontal } from "./Horizontal.js";
+export { default as Vertical } from "./Vertical.js";

package/admin/components/Droppable.js

@@ -1,46 +1,47 @@
-import * as React from "react";
 import { useDrop } from "react-dnd";
-const DroppableComponent = props => {
-  const {
-    children,
-    onDrop,
-    isVisible = () => true
-  } = props;
-  const [{
-    item,
-    isOver
-  }, drop] = useDrop({
-    accept: "element",
-    collect: monitor => ({
-      isOver: monitor.isOver() && monitor.isOver({
-        shallow: true
-      }),
-      item: monitor.getItem()
-    }),
-    drop(item, monitor) {
-      if (typeof props.isDroppable === "function" && !props.isDroppable(item)) {
-        return;
-      }
-      if (typeof onDrop === "function") {
-        return onDrop(monitor.getItem());
-      }
-    }
-  });
-  if (item && !isVisible(item)) {
-    return null;
-  }
-  let isDroppable = true;
-  if (item) {
-    isDroppable = props.isDroppable ? props.isDroppable(item) : isOver;
-  }
-  return children({
-    isDragging: Boolean(item),
-    isOver,
-    isDroppable,
-    item,
-    drop
-  });
+import { dropZoneOverState } from "./dropZoneOverState.js";
+import * as __rspack_external_react from "react";
+const DroppableComponent = (props)=>{
+    const { children, onDrop, isVisible = ()=>true } = props;
+    const [{ item, isOver }, drop] = useDrop({
+        accept: "element",
+        collect: (monitor)=>({
+                isOver: monitor.isOver() && monitor.isOver({
+                    shallow: true
+                }),
+                item: monitor.getItem()
+            }),
+        drop (item, monitor) {
+            if ("function" == typeof props.isDroppable && !props.isDroppable(item)) return;
+            if ("function" == typeof onDrop) return onDrop(monitor.getItem());
+        }
+    });
+    const prevIsOverRef = __rspack_external_react.useRef(false);
+    __rspack_external_react.useEffect(()=>{
+        if (isOver === prevIsOverRef.current) return;
+        dropZoneOverState.notify(isOver);
+        prevIsOverRef.current = isOver;
+        return ()=>{
+            if (prevIsOverRef.current) {
+                dropZoneOverState.notify(false);
+                prevIsOverRef.current = false;
+            }
+        };
+    }, [
+        isOver
+    ]);
+    if (item && !isVisible(item)) return null;
+    let isDroppable = true;
+    if (item) isDroppable = props.isDroppable ? props.isDroppable(item) : isOver;
+    return children({
+        isDragging: Boolean(item),
+        isOver,
+        isDroppable,
+        item,
+        drop
+    });
 };
-export const Droppable = /*#__PURE__*/React.memo(DroppableComponent);
+const Droppable = /*#__PURE__*/ __rspack_external_react.memo(DroppableComponent);
+export { Droppable };
 
 //# sourceMappingURL=Droppable.js.map

package/admin/components/Droppable.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useDrop","DroppableComponent","props","children","onDrop","isVisible","item","isOver","drop","accept","collect","monitor","shallow","getItem","isDroppable","isDragging","Boolean","Droppable","memo"],"sources":["Droppable.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { ConnectDropTarget } from \"react-dnd\";\nimport { useDrop } from \"react-dnd\";\nimport type { DragSource } from \"~/types.js\";\n\nexport interface DroppableChildrenFunctionParams {\n    isDragging: boolean;\n    isDroppable: boolean;\n    isOver: boolean;\n    item: any;\n    drop: ConnectDropTarget;\n}\nexport interface DroppableChildrenFunction {\n    (params: DroppableChildrenFunctionParams): React.ReactElement;\n}\n\ninterface IsVisibleParams {\n    type: DragSource[\"type\"];\n    item: DragSource;\n    isDragging: boolean;\n}\nexport interface IsVisibleCallable {\n    (params: IsVisibleParams): boolean;\n}\nexport interface OnDropCallable {\n    (item: DragSource): void;\n}\nexport interface DroppableProps {\n    type?: string;\n    children: DroppableChildrenFunction;\n    isDragging?: boolean;\n    isDroppable?: (item: DragSource) => boolean;\n    isVisible?: IsVisibleCallable;\n    onDrop?: OnDropCallable;\n}\n\nexport type DragObject = {\n    item: IsVisibleParams;\n    isOver: boolean;\n};\n\nconst DroppableComponent = (props: DroppableProps) => {\n    const { children, onDrop, isVisible = () => true } = props;\n\n    const [{ item, isOver }, drop] = useDrop<DragSource, void, DragObject>({\n        accept: \"element\",\n        collect: monitor => ({\n            isOver: monitor.isOver() && monitor.isOver({ shallow: true }),\n            item: monitor.getItem()\n        }),\n        drop(item, monitor) {\n            if (typeof props.isDroppable === \"function\" && !props.isDroppable(item)) {\n                return;\n            }\n\n            if (typeof onDrop === \"function\") {\n                return onDrop(monitor.getItem());\n            }\n        }\n    });\n\n    if (item && !isVisible(item)) {\n        return null;\n    }\n\n    let isDroppable = true;\n    if (item) {\n        isDroppable = props.isDroppable ? props.isDroppable(item) : isOver;\n    }\n\n    return children({ isDragging: Boolean(item), isOver, isDroppable, item, drop });\n};\n\nexport const Droppable: React.ComponentType<DroppableProps> = React.memo(DroppableComponent);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,OAAO,QAAQ,WAAW;AAuCnC,MAAMC,kBAAkB,GAAIC,KAAqB,IAAK;EAClD,MAAM;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,SAAS,GAAGA,CAAA,KAAM;EAAK,CAAC,GAAGH,KAAK;EAE1D,MAAM,CAAC;IAAEI,IAAI;IAAEC;EAAO,CAAC,EAAEC,IAAI,CAAC,GAAGR,OAAO,CAA+B;IACnES,MAAM,EAAE,SAAS;IACjBC,OAAO,EAAEC,OAAO,KAAK;MACjBJ,MAAM,EAAEI,OAAO,CAACJ,MAAM,CAAC,CAAC,IAAII,OAAO,CAACJ,MAAM,CAAC;QAAEK,OAAO,EAAE;MAAK,CAAC,CAAC;MAC7DN,IAAI,EAAEK,OAAO,CAACE,OAAO,CAAC;IAC1B,CAAC,CAAC;IACFL,IAAIA,CAACF,IAAI,EAAEK,OAAO,EAAE;MAChB,IAAI,OAAOT,KAAK,CAACY,WAAW,KAAK,UAAU,IAAI,CAACZ,KAAK,CAACY,WAAW,CAACR,IAAI,CAAC,EAAE;QACrE;MACJ;MAEA,IAAI,OAAOF,MAAM,KAAK,UAAU,EAAE;QAC9B,OAAOA,MAAM,CAACO,OAAO,CAACE,OAAO,CAAC,CAAC,CAAC;MACpC;IACJ;EACJ,CAAC,CAAC;EAEF,IAAIP,IAAI,IAAI,CAACD,SAAS,CAACC,IAAI,CAAC,EAAE;IAC1B,OAAO,IAAI;EACf;EAEA,IAAIQ,WAAW,GAAG,IAAI;EACtB,IAAIR,IAAI,EAAE;IACNQ,WAAW,GAAGZ,KAAK,CAACY,WAAW,GAAGZ,KAAK,CAACY,WAAW,CAACR,IAAI,CAAC,GAAGC,MAAM;EACtE;EAEA,OAAOJ,QAAQ,CAAC;IAAEY,UAAU,EAAEC,OAAO,CAACV,IAAI,CAAC;IAAEC,MAAM;IAAEO,WAAW;IAAER,IAAI;IAAEE;EAAK,CAAC,CAAC;AACnF,CAAC;AAED,OAAO,MAAMS,SAA8C,gBAAGlB,KAAK,CAACmB,IAAI,CAACjB,kBAAkB,CAAC","ignoreList":[]}
+{"version":3,"file":"admin/components/Droppable.js","sources":["../../../src/admin/components/Droppable.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { ConnectDropTarget } from \"react-dnd\";\nimport { useDrop } from \"react-dnd\";\nimport type { DragSource } from \"~/types.js\";\nimport { dropZoneOverState } from \"./dropZoneOverState.js\";\n\nexport interface DroppableChildrenFunctionParams {\n    isDragging: boolean;\n    isDroppable: boolean;\n    isOver: boolean;\n    item: any;\n    drop: ConnectDropTarget;\n}\nexport interface DroppableChildrenFunction {\n    (params: DroppableChildrenFunctionParams): React.ReactElement;\n}\n\ninterface IsVisibleParams {\n    type: DragSource[\"type\"];\n    item: DragSource;\n    isDragging: boolean;\n}\nexport interface IsVisibleCallable {\n    (params: IsVisibleParams): boolean;\n}\nexport interface OnDropCallable {\n    (item: DragSource): void;\n}\nexport interface DroppableProps {\n    type?: string;\n    children: DroppableChildrenFunction;\n    isDragging?: boolean;\n    isDroppable?: (item: DragSource) => boolean;\n    isVisible?: IsVisibleCallable;\n    onDrop?: OnDropCallable;\n}\n\nexport type DragObject = {\n    item: IsVisibleParams;\n    isOver: boolean;\n};\n\nconst DroppableComponent = (props: DroppableProps) => {\n    const { children, onDrop, isVisible = () => true } = props;\n\n    const [{ item, isOver }, drop] = useDrop<DragSource, void, DragObject>({\n        accept: \"element\",\n        collect: monitor => ({\n            isOver: monitor.isOver() && monitor.isOver({ shallow: true }),\n            item: monitor.getItem()\n        }),\n        drop(item, monitor) {\n            if (typeof props.isDroppable === \"function\" && !props.isDroppable(item)) {\n                return;\n            }\n\n            if (typeof onDrop === \"function\") {\n                return onDrop(monitor.getItem());\n            }\n        }\n    });\n\n    const prevIsOverRef = React.useRef(false);\n    React.useEffect(() => {\n        if (isOver === prevIsOverRef.current) {\n            return;\n        }\n        dropZoneOverState.notify(isOver);\n        prevIsOverRef.current = isOver;\n        return () => {\n            if (prevIsOverRef.current) {\n                dropZoneOverState.notify(false);\n                prevIsOverRef.current = false;\n            }\n        };\n    }, [isOver]);\n\n    if (item && !isVisible(item)) {\n        return null;\n    }\n\n    let isDroppable = true;\n    if (item) {\n        isDroppable = props.isDroppable ? props.isDroppable(item) : isOver;\n    }\n\n    return children({ isDragging: Boolean(item), isOver, isDroppable, item, drop });\n};\n\nexport const Droppable: React.ComponentType<DroppableProps> = React.memo(DroppableComponent);\n"],"names":["DroppableComponent","props","children","onDrop","isVisible","item","isOver","drop","useDrop","monitor","prevIsOverRef","React","dropZoneOverState","isDroppable","Boolean","Droppable"],"mappings":";;;AA0CA,MAAMA,qBAAqB,CAACC;IACxB,MAAM,EAAEC,QAAQ,EAAEC,MAAM,EAAEC,YAAY,IAAM,IAAI,EAAE,GAAGH;IAErD,MAAM,CAAC,EAAEI,IAAI,EAAEC,MAAM,EAAE,EAAEC,KAAK,GAAGC,QAAsC;QACnE,QAAQ;QACR,SAASC,CAAAA,UAAY;gBACjB,QAAQA,QAAQ,MAAM,MAAMA,QAAQ,MAAM,CAAC;oBAAE,SAAS;gBAAK;gBAC3D,MAAMA,QAAQ,OAAO;YACzB;QACA,MAAKJ,IAAI,EAAEI,OAAO;YACd,IAAI,AAA6B,cAA7B,OAAOR,MAAM,WAAW,IAAmB,CAACA,MAAM,WAAW,CAACI,OAC9D;YAGJ,IAAI,AAAkB,cAAlB,OAAOF,QACP,OAAOA,OAAOM,QAAQ,OAAO;QAErC;IACJ;IAEA,MAAMC,gBAAgBC,wBAAAA,MAAY,CAAC;IACnCA,wBAAAA,SAAe,CAAC;QACZ,IAAIL,WAAWI,cAAc,OAAO,EAChC;QAEJE,kBAAkB,MAAM,CAACN;QACzBI,cAAc,OAAO,GAAGJ;QACxB,OAAO;YACH,IAAII,cAAc,OAAO,EAAE;gBACvBE,kBAAkB,MAAM,CAAC;gBACzBF,cAAc,OAAO,GAAG;YAC5B;QACJ;IACJ,GAAG;QAACJ;KAAO;IAEX,IAAID,QAAQ,CAACD,UAAUC,OACnB,OAAO;IAGX,IAAIQ,cAAc;IAClB,IAAIR,MACAQ,cAAcZ,MAAM,WAAW,GAAGA,MAAM,WAAW,CAACI,QAAQC;IAGhE,OAAOJ,SAAS;QAAE,YAAYY,QAAQT;QAAOC;QAAQO;QAAaR;QAAME;IAAK;AACjF;AAEO,MAAMQ,YAASA,WAAAA,GAAwCJ,wBAAAA,IAAU,CAACX"}

package/admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/CannotUsePermissions.js

@@ -1,14 +1,13 @@
-import React from "react";
+import react from "react";
 import { Alert } from "@webiny/admin-ui";
-export const CannotUsePermissions = () => {
-  return /*#__PURE__*/React.createElement(Alert, {
-    title: "Field Permissions feature is not activated",
-    type: "warning"
-  }, /*#__PURE__*/React.createElement("strong", null, "Field Permissions"), " feature is not activated.", /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), "To learn more, please visit the official\xA0", /*#__PURE__*/React.createElement("a", {
-    href: "https://webiny.link/aacl",
-    target: "_blank",
-    rel: "noreferrer"
-  }, "documentation"), ".");
-};
+const CannotUsePermissions = ()=>/*#__PURE__*/ react.createElement(Alert, {
+        title: "Field Permissions feature is not activated",
+        type: "warning"
+    }, /*#__PURE__*/ react.createElement("strong", null, "Field Permissions"), " feature is not activated.", /*#__PURE__*/ react.createElement("br", null), /*#__PURE__*/ react.createElement("br", null), "To learn more, please visit the official\xa0", /*#__PURE__*/ react.createElement("a", {
+        href: "https://webiny.link/aacl",
+        target: "_blank",
+        rel: "noreferrer"
+    }, "documentation"), ".");
+export { CannotUsePermissions };
 
 //# sourceMappingURL=CannotUsePermissions.js.map

package/admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/CannotUsePermissions.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Alert","CannotUsePermissions","createElement","title","type","href","target","rel"],"sources":["CannotUsePermissions.tsx"],"sourcesContent":["import React from \"react\";\nimport { Alert } from \"@webiny/admin-ui\";\n\nexport const CannotUsePermissions = () => {\n    return (\n        <Alert title={\"Field Permissions feature is not activated\"} type={\"warning\"}>\n            <strong>Field Permissions</strong> feature is not activated.\n            <br />\n            <br />\n            To learn more, please visit the official&nbsp;\n            <a href={\"https://webiny.link/aacl\"} target={\"_blank\"} rel={\"noreferrer\"}>\n                documentation\n            </a>\n            .\n        </Alert>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,KAAK,QAAQ,kBAAkB;AAExC,OAAO,MAAMC,oBAAoB,GAAGA,CAAA,KAAM;EACtC,oBACIF,KAAA,CAAAG,aAAA,CAACF,KAAK;IAACG,KAAK,EAAE,4CAA6C;IAACC,IAAI,EAAE;EAAU,gBACxEL,KAAA,CAAAG,aAAA,iBAAQ,mBAAyB,CAAC,8BAClC,eAAAH,KAAA,CAAAG,aAAA,WAAK,CAAC,eACNH,KAAA,CAAAG,aAAA,WAAK,CAAC,gDAEN,eAAAH,KAAA,CAAAG,aAAA;IAAGG,IAAI,EAAE,0BAA2B;IAACC,MAAM,EAAE,QAAS;IAACC,GAAG,EAAE;EAAa,GAAC,eAEvE,CAAC,KAED,CAAC;AAEhB,CAAC","ignoreList":[]}
+{"version":3,"file":"admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/CannotUsePermissions.js","sources":["../../../../../../src/admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/CannotUsePermissions.tsx"],"sourcesContent":["import React from \"react\";\nimport { Alert } from \"@webiny/admin-ui\";\n\nexport const CannotUsePermissions = () => {\n    return (\n        <Alert title={\"Field Permissions feature is not activated\"} type={\"warning\"}>\n            <strong>Field Permissions</strong> feature is not activated.\n            <br />\n            <br />\n            To learn more, please visit the official&nbsp;\n            <a href={\"https://webiny.link/aacl\"} target={\"_blank\"} rel={\"noreferrer\"}>\n                documentation\n            </a>\n            .\n        </Alert>\n    );\n};\n"],"names":["CannotUsePermissions","Alert"],"mappings":";;AAGO,MAAMA,uBAAuB,IACzB,WAAP,GACI,oBAACC,OAAKA;QAAC,OAAO;QAA8C,MAAM;qBAC9D,oBAAC,gBAAO,sBAA0B,4CAClC,oBAAC,2BACD,oBAAC,aAAK,8DAEN,oBAAC;QAAE,MAAM;QAA4B,QAAQ;QAAU,KAAK;OAAc,kBAEtE"}

package/admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/FieldPermissionsSelection.js

@@ -1,128 +1,113 @@
-import React, { useMemo } from "react";
-import { ReactComponent as More } from "@webiny/icons/arrow_drop_down.svg";
-import { Button, DropdownMenu, List, Text, Avatar } from "@webiny/admin-ui";
-const FIELD_ACCESS_LEVELS = [{
-  id: "hide",
-  label: "No Access",
-  description: "Hide this field from the user."
-}, {
-  id: "disable",
-  label: "Viewer (Read-only)",
-  description: "Allow the user to read, but not edit, this field."
-}];
-const ListItemGraphic = ({
-  target
-}) => {
-  if (target.type === "admin") {
-    return /*#__PURE__*/React.createElement(Avatar, {
-      size: "md",
-      image: /*#__PURE__*/React.createElement(Avatar.Image, {
-        src: target.meta.image,
-        alt: "User's avatar."
-      }),
-      fallback: /*#__PURE__*/React.createElement(Avatar.Fallback, {
-        delayMs: 0
-      }, target.name.charAt(0))
+import react, { useMemo } from "react";
+import { ReactComponent } from "@webiny/icons/arrow_drop_down.svg";
+import { Avatar, Button, DropdownMenu, List, Text } from "@webiny/admin-ui";
+const FIELD_ACCESS_LEVELS = [
+    {
+        id: "hide",
+        label: "No Access",
+        description: "Hide this field from the user."
+    },
+    {
+        id: "disable",
+        label: "Viewer (Read-only)",
+        description: "Allow the user to read, but not edit, this field."
+    }
+];
+const ListItemGraphic = ({ target })=>{
+    if ("admin" === target.type) return /*#__PURE__*/ react.createElement(Avatar, {
+        size: "md",
+        image: /*#__PURE__*/ react.createElement(Avatar.Image, {
+            src: target.meta.image,
+            alt: "User's avatar."
+        }),
+        fallback: /*#__PURE__*/ react.createElement(Avatar.Fallback, {
+            delayMs: 0
+        }, target.name.charAt(0))
+    });
+    return /*#__PURE__*/ react.createElement(Avatar, {
+        size: "md",
+        fallback: /*#__PURE__*/ react.createElement(Avatar.Fallback, {
+            delayMs: 0
+        }, target.name.charAt(0))
     });
-  }
-  return /*#__PURE__*/React.createElement(Avatar, {
-    size: "md",
-    fallback: /*#__PURE__*/React.createElement(Avatar.Fallback, {
-      delayMs: 0
-    }, target.name.charAt(0))
-  });
 };
-const ListItemText = ({
-  target
-}) => {
-  if (target.type === "admin") {
-    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Text, {
-      as: "div"
-    }, target.name), /*#__PURE__*/React.createElement(Text, {
-      as: "div",
-      size: "sm",
-      className: "text-neutral-strong font-normal"
+const ListItemText = ({ target })=>{
+    if ("admin" === target.type) return /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement(Text, {
+        as: "div"
+    }, target.name), /*#__PURE__*/ react.createElement(Text, {
+        as: "div",
+        size: "sm",
+        className: "text-neutral-strong font-normal"
     }, target.meta.email || "E-mail not available."));
-  }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, target.name);
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, target.name);
 };
-const ListItemMeta = ({
-  rule,
-  onRemoveAccess,
-  onUpdatePermission
-}) => {
-  const currentLevel = useMemo(() => {
-    return FIELD_ACCESS_LEVELS.find(level => level.id === rule.action);
-  }, [rule.action]);
-  const handle = /*#__PURE__*/React.createElement(Button, {
-    variant: "ghost",
-    text: currentLevel.label,
-    icon: /*#__PURE__*/React.createElement(More, null),
-    iconPosition: "end"
-  });
-  return /*#__PURE__*/React.createElement(DropdownMenu, {
-    trigger: handle
-  }, FIELD_ACCESS_LEVELS.map(level => /*#__PURE__*/React.createElement(DropdownMenu.CheckboxItem, {
-    key: level.id,
-    checked: currentLevel.id === level.id,
-    text: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Text, {
-      as: "div"
-    }, level.label), /*#__PURE__*/React.createElement(Text, {
-      as: "div",
-      size: "sm",
-      className: "text-neutral-strong"
-    }, level.description)),
-    onClick: () => {
-      setTimeout(() => {
-        onUpdatePermission({
-          rule: {
-            ...rule,
-            action: level.id
-          }
-        });
-      }, 75);
-    }
-  })), /*#__PURE__*/React.createElement(DropdownMenu.Separator, null), /*#__PURE__*/React.createElement(DropdownMenu.Item, {
-    onClick: () => onRemoveAccess({
-      rule
-    }),
-    text: "Remove permission"
-  }));
+const ListItemMeta = ({ rule, onRemoveAccess, onUpdatePermission })=>{
+    const currentLevel = useMemo(()=>FIELD_ACCESS_LEVELS.find((level)=>level.id === rule.action), [
+        rule.action
+    ]);
+    const handle = /*#__PURE__*/ react.createElement(Button, {
+        variant: "ghost",
+        text: currentLevel.label,
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        iconPosition: "end"
+    });
+    return /*#__PURE__*/ react.createElement(DropdownMenu, {
+        trigger: handle
+    }, FIELD_ACCESS_LEVELS.map((level)=>/*#__PURE__*/ react.createElement(DropdownMenu.CheckboxItem, {
+            key: level.id,
+            checked: currentLevel.id === level.id,
+            text: /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement(Text, {
+                as: "div"
+            }, level.label), /*#__PURE__*/ react.createElement(Text, {
+                as: "div",
+                size: "sm",
+                className: "text-neutral-strong"
+            }, level.description)),
+            onClick: ()=>{
+                setTimeout(()=>{
+                    onUpdatePermission({
+                        rule: {
+                            ...rule,
+                            action: level.id
+                        }
+                    });
+                }, 75);
+            }
+        })), /*#__PURE__*/ react.createElement(DropdownMenu.Separator, null), /*#__PURE__*/ react.createElement(DropdownMenu.Item, {
+        onClick: ()=>onRemoveAccess({
+                rule
+            }),
+        text: "Remove permission"
+    }));
 };
-export const FieldPermissionsSelection = ({
-  rules = [],
-  targetsList,
-  onRemoveAccess,
-  onUpdatePermission
-}) => {
-  const selection = rules.map(rule => {
-    const target = targetsList.find(u => u.target === String(rule.value));
-    if (target) {
-      return {
-        rule,
-        target
-      };
-    }
-    return null;
-  }).filter(Boolean);
-  const hasRules = selection.length > 0;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, hasRules ? /*#__PURE__*/React.createElement(Text, {
-    as: "div",
-    className: "mb-md"
-  }, "People and teams with access") : null, /*#__PURE__*/React.createElement(List, null, selection?.map(item => /*#__PURE__*/React.createElement(List.Item, {
-    key: String(item.rule.value),
-    title: /*#__PURE__*/React.createElement(ListItemText, {
-      target: item.target
-    }),
-    icon: /*#__PURE__*/React.createElement(ListItemGraphic, {
-      target: item.target
-    }),
-    actions: /*#__PURE__*/React.createElement(ListItemMeta, {
-      rule: item.rule,
-      onRemoveAccess: onRemoveAccess,
-      onUpdatePermission: onUpdatePermission
-    })
-  }))));
+const FieldPermissionsSelection = ({ rules = [], targetsList, onRemoveAccess, onUpdatePermission })=>{
+    const selection = rules.map((rule)=>{
+        const target = targetsList.find((u)=>u.target === String(rule.value));
+        if (target) return {
+            rule,
+            target
+        };
+        return null;
+    }).filter(Boolean);
+    const hasRules = selection.length > 0;
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, hasRules ? /*#__PURE__*/ react.createElement(Text, {
+        as: "div",
+        className: "mb-md"
+    }, "People and teams with access") : null, /*#__PURE__*/ react.createElement(List, null, selection?.map((item)=>/*#__PURE__*/ react.createElement(List.Item, {
+            key: String(item.rule.value),
+            title: /*#__PURE__*/ react.createElement(ListItemText, {
+                target: item.target
+            }),
+            icon: /*#__PURE__*/ react.createElement(ListItemGraphic, {
+                target: item.target
+            }),
+            actions: /*#__PURE__*/ react.createElement(ListItemMeta, {
+                rule: item.rule,
+                onRemoveAccess: onRemoveAccess,
+                onUpdatePermission: onUpdatePermission
+            })
+        }))));
 };
+export { FieldPermissionsSelection };
 
 //# sourceMappingURL=FieldPermissionsSelection.js.map

package/admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/FieldPermissionsSelection.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","ReactComponent","More","Button","DropdownMenu","List","Text","Avatar","FIELD_ACCESS_LEVELS","id","label","description","ListItemGraphic","target","type","createElement","size","image","Image","src","meta","alt","fallback","Fallback","delayMs","name","charAt","ListItemText","as","className","email","Fragment","ListItemMeta","rule","onRemoveAccess","onUpdatePermission","currentLevel","find","level","action","handle","variant","text","icon","iconPosition","trigger","map","CheckboxItem","key","checked","onClick","setTimeout","Separator","Item","FieldPermissionsSelection","rules","targetsList","selection","u","String","value","filter","Boolean","hasRules","length","item","title","actions"],"sources":["FieldPermissionsSelection.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { ReactComponent as More } from \"@webiny/icons/arrow_drop_down.svg\";\nimport { Button, DropdownMenu, List, Text, Avatar } from \"@webiny/admin-ui\";\nimport type { FolderLevelPermissionsTarget } from \"@webiny/app-aco\";\nimport type { FieldRule } from \"~/types.js\";\n\nconst FIELD_ACCESS_LEVELS = [\n    {\n        id: \"hide\",\n        label: \"No Access\",\n        description: \"Hide this field from the user.\"\n    },\n    {\n        id: \"disable\",\n        label: \"Viewer (Read-only)\",\n        description: \"Allow the user to read, but not edit, this field.\"\n    }\n];\n\ninterface FieldPermissionsSelectionProps {\n    targetsList: FolderLevelPermissionsTarget[];\n    rules: FieldRule[];\n    onRemoveAccess: (params: { rule: FieldRule }) => void;\n    onUpdatePermission: (params: { rule: FieldRule }) => void;\n}\n\ntype Selection = Array<{ rule: FieldRule; target: FolderLevelPermissionsTarget }>;\n\ninterface ListItemGraphicProps {\n    target: FolderLevelPermissionsTarget;\n}\n\nconst ListItemGraphic = ({ target }: ListItemGraphicProps) => {\n    if (target.type === \"admin\") {\n        return (\n            <Avatar\n                size={\"md\"}\n                image={<Avatar.Image src={target.meta.image} alt={\"User's avatar.\"} />}\n                fallback={<Avatar.Fallback delayMs={0}>{target.name.charAt(0)}</Avatar.Fallback>}\n            />\n        );\n    }\n\n    return (\n        <Avatar\n            size={\"md\"}\n            fallback={<Avatar.Fallback delayMs={0}>{target.name.charAt(0)}</Avatar.Fallback>}\n        />\n    );\n};\n\ninterface ListItemTextProps {\n    target: FolderLevelPermissionsTarget;\n}\n\nconst ListItemText = ({ target }: ListItemTextProps) => {\n    if (target.type === \"admin\") {\n        return (\n            <div>\n                <Text as=\"div\">{target.name}</Text>\n                <Text as={\"div\"} size={\"sm\"} className={\"text-neutral-strong font-normal\"}>\n                    {target.meta.email || \"E-mail not available.\"}\n                </Text>\n            </div>\n        );\n    }\n\n    return <>{target.name}</>;\n};\n\ninterface ListItemMetaProps {\n    rule: FieldRule;\n    onRemoveAccess: (params: { rule: FieldRule }) => void;\n    onUpdatePermission: (params: { rule: FieldRule }) => void;\n}\n\nconst ListItemMeta = ({ rule, onRemoveAccess, onUpdatePermission }: ListItemMetaProps) => {\n    const currentLevel = useMemo(() => {\n        return FIELD_ACCESS_LEVELS.find(level => level.id === rule.action)!;\n    }, [rule.action]);\n\n    const handle = (\n        <Button variant={\"ghost\"} text={currentLevel.label} icon={<More />} iconPosition={\"end\"} />\n    );\n\n    return (\n        <DropdownMenu trigger={handle}>\n            {FIELD_ACCESS_LEVELS.map(level => (\n                <DropdownMenu.CheckboxItem\n                    key={level.id}\n                    checked={currentLevel.id === level.id}\n                    text={\n                        <div>\n                            <Text as={\"div\"}>{level.label}</Text>\n                            <Text as={\"div\"} size={\"sm\"} className={\"text-neutral-strong\"}>\n                                {level.description}\n                            </Text>\n                        </div>\n                    }\n                    onClick={() => {\n                        setTimeout(() => {\n                            onUpdatePermission({\n                                rule: {\n                                    ...rule,\n                                    action: level.id\n                                }\n                            });\n                        }, 75);\n                    }}\n                />\n            ))}\n            <DropdownMenu.Separator />\n            <DropdownMenu.Item\n                onClick={() => onRemoveAccess({ rule })}\n                text={\"Remove permission\"}\n            />\n        </DropdownMenu>\n    );\n};\n\nexport const FieldPermissionsSelection = ({\n    rules = [],\n    targetsList,\n    onRemoveAccess,\n    onUpdatePermission\n}: FieldPermissionsSelectionProps) => {\n    const selection = rules\n        .map(rule => {\n            const target = targetsList.find(u => u.target === String(rule.value));\n            if (target) {\n                return { rule, target };\n            }\n\n            return null;\n        })\n        .filter(Boolean) as Selection;\n\n    const hasRules = selection.length > 0;\n\n    return (\n        <>\n            {hasRules ? (\n                <Text as={\"div\"} className={\"mb-md\"}>\n                    People and teams with access\n                </Text>\n            ) : null}\n            <List>\n                {selection?.map(item => (\n                    <List.Item\n                        key={String(item.rule.value)}\n                        title={<ListItemText target={item.target} />}\n                        icon={<ListItemGraphic target={item.target} />}\n                        actions={\n                            <ListItemMeta\n                                rule={item.rule}\n                                onRemoveAccess={onRemoveAccess}\n                                onUpdatePermission={onUpdatePermission}\n                            />\n                        }\n                    />\n                ))}\n            </List>\n        </>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/FieldPermissionsSelection.js","sources":["../../../../../../src/admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/FieldPermissionsSelection.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { ReactComponent as More } from \"@webiny/icons/arrow_drop_down.svg\";\nimport { Button, DropdownMenu, List, Text, Avatar } from \"@webiny/admin-ui\";\nimport type { FolderLevelPermissionsTarget } from \"@webiny/app-aco\";\nimport type { FieldRule } from \"~/types.js\";\n\nconst FIELD_ACCESS_LEVELS = [\n    {\n        id: \"hide\",\n        label: \"No Access\",\n        description: \"Hide this field from the user.\"\n    },\n    {\n        id: \"disable\",\n        label: \"Viewer (Read-only)\",\n        description: \"Allow the user to read, but not edit, this field.\"\n    }\n];\n\ninterface FieldPermissionsSelectionProps {\n    targetsList: FolderLevelPermissionsTarget[];\n    rules: FieldRule[];\n    onRemoveAccess: (params: { rule: FieldRule }) => void;\n    onUpdatePermission: (params: { rule: FieldRule }) => void;\n}\n\ntype Selection = Array<{ rule: FieldRule; target: FolderLevelPermissionsTarget }>;\n\ninterface ListItemGraphicProps {\n    target: FolderLevelPermissionsTarget;\n}\n\nconst ListItemGraphic = ({ target }: ListItemGraphicProps) => {\n    if (target.type === \"admin\") {\n        return (\n            <Avatar\n                size={\"md\"}\n                image={<Avatar.Image src={target.meta.image} alt={\"User's avatar.\"} />}\n                fallback={<Avatar.Fallback delayMs={0}>{target.name.charAt(0)}</Avatar.Fallback>}\n            />\n        );\n    }\n\n    return (\n        <Avatar\n            size={\"md\"}\n            fallback={<Avatar.Fallback delayMs={0}>{target.name.charAt(0)}</Avatar.Fallback>}\n        />\n    );\n};\n\ninterface ListItemTextProps {\n    target: FolderLevelPermissionsTarget;\n}\n\nconst ListItemText = ({ target }: ListItemTextProps) => {\n    if (target.type === \"admin\") {\n        return (\n            <div>\n                <Text as=\"div\">{target.name}</Text>\n                <Text as={\"div\"} size={\"sm\"} className={\"text-neutral-strong font-normal\"}>\n                    {target.meta.email || \"E-mail not available.\"}\n                </Text>\n            </div>\n        );\n    }\n\n    return <>{target.name}</>;\n};\n\ninterface ListItemMetaProps {\n    rule: FieldRule;\n    onRemoveAccess: (params: { rule: FieldRule }) => void;\n    onUpdatePermission: (params: { rule: FieldRule }) => void;\n}\n\nconst ListItemMeta = ({ rule, onRemoveAccess, onUpdatePermission }: ListItemMetaProps) => {\n    const currentLevel = useMemo(() => {\n        return FIELD_ACCESS_LEVELS.find(level => level.id === rule.action)!;\n    }, [rule.action]);\n\n    const handle = (\n        <Button variant={\"ghost\"} text={currentLevel.label} icon={<More />} iconPosition={\"end\"} />\n    );\n\n    return (\n        <DropdownMenu trigger={handle}>\n            {FIELD_ACCESS_LEVELS.map(level => (\n                <DropdownMenu.CheckboxItem\n                    key={level.id}\n                    checked={currentLevel.id === level.id}\n                    text={\n                        <div>\n                            <Text as={\"div\"}>{level.label}</Text>\n                            <Text as={\"div\"} size={\"sm\"} className={\"text-neutral-strong\"}>\n                                {level.description}\n                            </Text>\n                        </div>\n                    }\n                    onClick={() => {\n                        setTimeout(() => {\n                            onUpdatePermission({\n                                rule: {\n                                    ...rule,\n                                    action: level.id\n                                }\n                            });\n                        }, 75);\n                    }}\n                />\n            ))}\n            <DropdownMenu.Separator />\n            <DropdownMenu.Item\n                onClick={() => onRemoveAccess({ rule })}\n                text={\"Remove permission\"}\n            />\n        </DropdownMenu>\n    );\n};\n\nexport const FieldPermissionsSelection = ({\n    rules = [],\n    targetsList,\n    onRemoveAccess,\n    onUpdatePermission\n}: FieldPermissionsSelectionProps) => {\n    const selection = rules\n        .map(rule => {\n            const target = targetsList.find(u => u.target === String(rule.value));\n            if (target) {\n                return { rule, target };\n            }\n\n            return null;\n        })\n        .filter(Boolean) as Selection;\n\n    const hasRules = selection.length > 0;\n\n    return (\n        <>\n            {hasRules ? (\n                <Text as={\"div\"} className={\"mb-md\"}>\n                    People and teams with access\n                </Text>\n            ) : null}\n            <List>\n                {selection?.map(item => (\n                    <List.Item\n                        key={String(item.rule.value)}\n                        title={<ListItemText target={item.target} />}\n                        icon={<ListItemGraphic target={item.target} />}\n                        actions={\n                            <ListItemMeta\n                                rule={item.rule}\n                                onRemoveAccess={onRemoveAccess}\n                                onUpdatePermission={onUpdatePermission}\n                            />\n                        }\n                    />\n                ))}\n            </List>\n        </>\n    );\n};\n"],"names":["FIELD_ACCESS_LEVELS","ListItemGraphic","target","Avatar","ListItemText","Text","ListItemMeta","rule","onRemoveAccess","onUpdatePermission","currentLevel","useMemo","level","handle","Button","More","DropdownMenu","setTimeout","FieldPermissionsSelection","rules","targetsList","selection","u","String","Boolean","hasRules","List","item"],"mappings":"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"}