@webiny/app-headless-cms 6.3.0 → 6.4.0-beta.1

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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"}

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

@@ -1,4 +1,4 @@
-import React from "react";
+import react from "react";
 import { useQuery } from "@apollo/react-hooks";
 import { Grid } from "@webiny/admin-ui";
 import { useBind } from "@webiny/form";
@@ -6,63 +6,66 @@ import { useWcp } from "@webiny/app-admin";
 import { LIST_FOLDER_LEVEL_PERMISSIONS_TARGETS, UsersTeamsMultiAutocomplete } from "@webiny/app-aco";
 import { FieldPermissionsSelection } from "./FieldPermissionsSelection.js";
 import { CannotUsePermissions } from "./CannotUsePermissions.js";
-export const PermissionsEditor = () => {
-  const wcp = useWcp();
-  const bind = useBind({
-    name: "rules"
-  });
-  const allRules = bind.value || [];
-  const accessRules = allRules.filter(r => r.type === "accessControl");
-  const otherRules = allRules.filter(r => r.type !== "accessControl");
-  const listTargetsQuery = useQuery(LIST_FOLDER_LEVEL_PERMISSIONS_TARGETS);
-  const targetsList = listTargetsQuery.data?.aco.listFolderLevelPermissionsTargets.data || [];
-  const addPermission = value => {
-    const selectedUserOrTeam = value[value.length - 1];
-    const newRule = {
-      type: "accessControl",
-      target: "identity",
-      operator: "matches",
-      value: selectedUserOrTeam,
-      action: "disable"
-    };
-    bind.onChange([...otherRules, ...accessRules, newRule]);
-  };
-  const updatePermission = ({
-    rule: updatedRule
-  }) => {
-    const updatedAccessRules = accessRules.map(rule => {
-      if (rule.value === updatedRule.value) {
-        return updatedRule;
-      }
-      return rule;
+const PermissionsEditor = ()=>{
+    const wcp = useWcp();
+    const bind = useBind({
+        name: "rules"
     });
-    bind.onChange([...otherRules, ...updatedAccessRules]);
-  };
-  const removeUserTeam = ({
-    rule: removedRule
-  }) => {
-    const updatedAccessRules = accessRules.filter(rule => rule.value !== removedRule.value);
-    bind.onChange([...otherRules, ...updatedAccessRules]);
-  };
-  if (!wcp.canUseHcmsFieldPermissions()) {
-    return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Grid.Column, {
-      span: 12
-    }, /*#__PURE__*/React.createElement(CannotUsePermissions, null)));
-  }
-  return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Grid.Column, {
-    span: 12
-  }, /*#__PURE__*/React.createElement(UsersTeamsMultiAutocomplete, {
-    options: targetsList,
-    value: accessRules.map(rule => String(rule.value)),
-    onChange: addPermission
-  })), /*#__PURE__*/React.createElement(Grid.Column, {
-    span: 12
-  }, /*#__PURE__*/React.createElement(FieldPermissionsSelection, {
-    rules: accessRules,
-    targetsList: targetsList,
-    onRemoveAccess: removeUserTeam,
-    onUpdatePermission: updatePermission
-  })));
+    const allRules = bind.value || [];
+    const accessRules = allRules.filter((r)=>"accessControl" === r.type);
+    const otherRules = allRules.filter((r)=>"accessControl" !== r.type);
+    const listTargetsQuery = useQuery(LIST_FOLDER_LEVEL_PERMISSIONS_TARGETS);
+    const targetsList = listTargetsQuery.data?.aco.listFolderLevelPermissionsTargets.data || [];
+    const addPermission = (value)=>{
+        const selectedUserOrTeam = value[value.length - 1];
+        const newRule = {
+            type: "accessControl",
+            target: "identity",
+            operator: "matches",
+            value: selectedUserOrTeam,
+            action: "disable"
+        };
+        bind.onChange([
+            ...otherRules,
+            ...accessRules,
+            newRule
+        ]);
+    };
+    const updatePermission = ({ rule: updatedRule })=>{
+        const updatedAccessRules = accessRules.map((rule)=>{
+            if (rule.value === updatedRule.value) return updatedRule;
+            return rule;
+        });
+        bind.onChange([
+            ...otherRules,
+            ...updatedAccessRules
+        ]);
+    };
+    const removeUserTeam = ({ rule: removedRule })=>{
+        const updatedAccessRules = accessRules.filter((rule)=>rule.value !== removedRule.value);
+        bind.onChange([
+            ...otherRules,
+            ...updatedAccessRules
+        ]);
+    };
+    if (!wcp.canUseHcmsFieldPermissions()) return /*#__PURE__*/ react.createElement(Grid, null, /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(CannotUsePermissions, null)));
+    return /*#__PURE__*/ react.createElement(Grid, null, /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(UsersTeamsMultiAutocomplete, {
+        options: targetsList,
+        value: accessRules.map((rule)=>String(rule.value)),
+        onChange: addPermission
+    })), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(FieldPermissionsSelection, {
+        rules: accessRules,
+        targetsList: targetsList,
+        onRemoveAccess: removeUserTeam,
+        onUpdatePermission: updatePermission
+    })));
 };
+export { PermissionsEditor };
 
 //# sourceMappingURL=PermissionsEditor.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","useQuery","Grid","useBind","useWcp","LIST_FOLDER_LEVEL_PERMISSIONS_TARGETS","UsersTeamsMultiAutocomplete","FieldPermissionsSelection","CannotUsePermissions","PermissionsEditor","wcp","bind","name","allRules","value","accessRules","filter","r","type","otherRules","listTargetsQuery","targetsList","data","aco","listFolderLevelPermissionsTargets","addPermission","selectedUserOrTeam","length","newRule","target","operator","action","onChange","updatePermission","rule","updatedRule","updatedAccessRules","map","removeUserTeam","removedRule","canUseHcmsFieldPermissions","createElement","Column","span","options","String","rules","onRemoveAccess","onUpdatePermission"],"sources":["PermissionsEditor.tsx"],"sourcesContent":["import React from \"react\";\nimport { useQuery } from \"@apollo/react-hooks\";\nimport { Grid } from \"@webiny/admin-ui\";\nimport { useBind } from \"@webiny/form\";\nimport { useWcp } from \"@webiny/app-admin\";\nimport {\n    LIST_FOLDER_LEVEL_PERMISSIONS_TARGETS,\n    UsersTeamsMultiAutocomplete\n} from \"@webiny/app-aco\";\nimport type { FolderLevelPermissionsTarget } from \"@webiny/app-aco\";\nimport type { FieldRule } from \"~/types.js\";\nimport { FieldPermissionsSelection } from \"./FieldPermissionsSelection.js\";\nimport { CannotUsePermissions } from \"./CannotUsePermissions.js\";\n\nexport const PermissionsEditor = () => {\n    const wcp = useWcp();\n    const bind = useBind({ name: \"rules\" });\n    const allRules: FieldRule[] = bind.value || [];\n    const accessRules = allRules.filter(r => r.type === \"accessControl\");\n    const otherRules = allRules.filter(r => r.type !== \"accessControl\");\n\n    const listTargetsQuery = useQuery(LIST_FOLDER_LEVEL_PERMISSIONS_TARGETS);\n    const targetsList: FolderLevelPermissionsTarget[] =\n        listTargetsQuery.data?.aco.listFolderLevelPermissionsTargets.data || [];\n\n    const addPermission = (value: string[]) => {\n        const selectedUserOrTeam = value[value.length - 1];\n        const newRule: FieldRule = {\n            type: \"accessControl\",\n            target: \"identity\",\n            operator: \"matches\",\n            value: selectedUserOrTeam,\n            action: \"disable\"\n        };\n\n        bind.onChange([...otherRules, ...accessRules, newRule]);\n    };\n\n    const updatePermission = ({ rule: updatedRule }: { rule: FieldRule }) => {\n        const updatedAccessRules = accessRules.map(rule => {\n            if (rule.value === updatedRule.value) {\n                return updatedRule;\n            }\n            return rule;\n        });\n        bind.onChange([...otherRules, ...updatedAccessRules]);\n    };\n\n    const removeUserTeam = ({ rule: removedRule }: { rule: FieldRule }) => {\n        const updatedAccessRules = accessRules.filter(rule => rule.value !== removedRule.value);\n        bind.onChange([...otherRules, ...updatedAccessRules]);\n    };\n\n    if (!wcp.canUseHcmsFieldPermissions()) {\n        return (\n            <Grid>\n                <Grid.Column span={12}>\n                    <CannotUsePermissions />\n                </Grid.Column>\n            </Grid>\n        );\n    }\n\n    return (\n        <Grid>\n            <Grid.Column span={12}>\n                <UsersTeamsMultiAutocomplete\n                    options={targetsList}\n                    value={accessRules.map(\n                        rule => String(rule.value) as `admin:${string}` | `team:${string}`\n                    )}\n                    onChange={addPermission}\n                />\n            </Grid.Column>\n            <Grid.Column span={12}>\n                <FieldPermissionsSelection\n                    rules={accessRules}\n                    targetsList={targetsList}\n                    onRemoveAccess={removeUserTeam}\n                    onUpdatePermission={updatePermission}\n                />\n            </Grid.Column>\n        </Grid>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,OAAO,QAAQ,cAAc;AACtC,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SACIC,qCAAqC,EACrCC,2BAA2B,QACxB,iBAAiB;AAGxB,SAASC,yBAAyB;AAClC,SAASC,oBAAoB;AAE7B,OAAO,MAAMC,iBAAiB,GAAGA,CAAA,KAAM;EACnC,MAAMC,GAAG,GAAGN,MAAM,CAAC,CAAC;EACpB,MAAMO,IAAI,GAAGR,OAAO,CAAC;IAAES,IAAI,EAAE;EAAQ,CAAC,CAAC;EACvC,MAAMC,QAAqB,GAAGF,IAAI,CAACG,KAAK,IAAI,EAAE;EAC9C,MAAMC,WAAW,GAAGF,QAAQ,CAACG,MAAM,CAACC,CAAC,IAAIA,CAAC,CAACC,IAAI,KAAK,eAAe,CAAC;EACpE,MAAMC,UAAU,GAAGN,QAAQ,CAACG,MAAM,CAACC,CAAC,IAAIA,CAAC,CAACC,IAAI,KAAK,eAAe,CAAC;EAEnE,MAAME,gBAAgB,GAAGnB,QAAQ,CAACI,qCAAqC,CAAC;EACxE,MAAMgB,WAA2C,GAC7CD,gBAAgB,CAACE,IAAI,EAAEC,GAAG,CAACC,iCAAiC,CAACF,IAAI,IAAI,EAAE;EAE3E,MAAMG,aAAa,GAAIX,KAAe,IAAK;IACvC,MAAMY,kBAAkB,GAAGZ,KAAK,CAACA,KAAK,CAACa,MAAM,GAAG,CAAC,CAAC;IAClD,MAAMC,OAAkB,GAAG;MACvBV,IAAI,EAAE,eAAe;MACrBW,MAAM,EAAE,UAAU;MAClBC,QAAQ,EAAE,SAAS;MACnBhB,KAAK,EAAEY,kBAAkB;MACzBK,MAAM,EAAE;IACZ,CAAC;IAEDpB,IAAI,CAACqB,QAAQ,CAAC,CAAC,GAAGb,UAAU,EAAE,GAAGJ,WAAW,EAAEa,OAAO,CAAC,CAAC;EAC3D,CAAC;EAED,MAAMK,gBAAgB,GAAGA,CAAC;IAAEC,IAAI,EAAEC;EAAiC,CAAC,KAAK;IACrE,MAAMC,kBAAkB,GAAGrB,WAAW,CAACsB,GAAG,CAACH,IAAI,IAAI;MAC/C,IAAIA,IAAI,CAACpB,KAAK,KAAKqB,WAAW,CAACrB,KAAK,EAAE;QAClC,OAAOqB,WAAW;MACtB;MACA,OAAOD,IAAI;IACf,CAAC,CAAC;IACFvB,IAAI,CAACqB,QAAQ,CAAC,CAAC,GAAGb,UAAU,EAAE,GAAGiB,kBAAkB,CAAC,CAAC;EACzD,CAAC;EAED,MAAME,cAAc,GAAGA,CAAC;IAAEJ,IAAI,EAAEK;EAAiC,CAAC,KAAK;IACnE,MAAMH,kBAAkB,GAAGrB,WAAW,CAACC,MAAM,CAACkB,IAAI,IAAIA,IAAI,CAACpB,KAAK,KAAKyB,WAAW,CAACzB,KAAK,CAAC;IACvFH,IAAI,CAACqB,QAAQ,CAAC,CAAC,GAAGb,UAAU,EAAE,GAAGiB,kBAAkB,CAAC,CAAC;EACzD,CAAC;EAED,IAAI,CAAC1B,GAAG,CAAC8B,0BAA0B,CAAC,CAAC,EAAE;IACnC,oBACIxC,KAAA,CAAAyC,aAAA,CAACvC,IAAI,qBACDF,KAAA,CAAAyC,aAAA,CAACvC,IAAI,CAACwC,MAAM;MAACC,IAAI,EAAE;IAAG,gBAClB3C,KAAA,CAAAyC,aAAA,CAACjC,oBAAoB,MAAE,CACd,CACX,CAAC;EAEf;EAEA,oBACIR,KAAA,CAAAyC,aAAA,CAACvC,IAAI,qBACDF,KAAA,CAAAyC,aAAA,CAACvC,IAAI,CAACwC,MAAM;IAACC,IAAI,EAAE;EAAG,gBAClB3C,KAAA,CAAAyC,aAAA,CAACnC,2BAA2B;IACxBsC,OAAO,EAAEvB,WAAY;IACrBP,KAAK,EAAEC,WAAW,CAACsB,GAAG,CAClBH,IAAI,IAAIW,MAAM,CAACX,IAAI,CAACpB,KAAK,CAC7B,CAAE;IACFkB,QAAQ,EAAEP;EAAc,CAC3B,CACQ,CAAC,eACdzB,KAAA,CAAAyC,aAAA,CAACvC,IAAI,CAACwC,MAAM;IAACC,IAAI,EAAE;EAAG,gBAClB3C,KAAA,CAAAyC,aAAA,CAAClC,yBAAyB;IACtBuC,KAAK,EAAE/B,WAAY;IACnBM,WAAW,EAAEA,WAAY;IACzB0B,cAAc,EAAET,cAAe;IAC/BU,kBAAkB,EAAEf;EAAiB,CACxC,CACQ,CACX,CAAC;AAEf,CAAC","ignoreList":[]}
+{"version":3,"file":"admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/PermissionsEditor.js","sources":["../../../../../../src/admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/PermissionsEditor.tsx"],"sourcesContent":["import React from \"react\";\nimport { useQuery } from \"@apollo/react-hooks\";\nimport { Grid } from \"@webiny/admin-ui\";\nimport { useBind } from \"@webiny/form\";\nimport { useWcp } from \"@webiny/app-admin\";\nimport {\n    LIST_FOLDER_LEVEL_PERMISSIONS_TARGETS,\n    UsersTeamsMultiAutocomplete\n} from \"@webiny/app-aco\";\nimport type { FolderLevelPermissionsTarget } from \"@webiny/app-aco\";\nimport type { FieldRule } from \"~/types.js\";\nimport { FieldPermissionsSelection } from \"./FieldPermissionsSelection.js\";\nimport { CannotUsePermissions } from \"./CannotUsePermissions.js\";\n\nexport const PermissionsEditor = () => {\n    const wcp = useWcp();\n    const bind = useBind({ name: \"rules\" });\n    const allRules: FieldRule[] = bind.value || [];\n    const accessRules = allRules.filter(r => r.type === \"accessControl\");\n    const otherRules = allRules.filter(r => r.type !== \"accessControl\");\n\n    const listTargetsQuery = useQuery(LIST_FOLDER_LEVEL_PERMISSIONS_TARGETS);\n    const targetsList: FolderLevelPermissionsTarget[] =\n        listTargetsQuery.data?.aco.listFolderLevelPermissionsTargets.data || [];\n\n    const addPermission = (value: string[]) => {\n        const selectedUserOrTeam = value[value.length - 1];\n        const newRule: FieldRule = {\n            type: \"accessControl\",\n            target: \"identity\",\n            operator: \"matches\",\n            value: selectedUserOrTeam,\n            action: \"disable\"\n        };\n\n        bind.onChange([...otherRules, ...accessRules, newRule]);\n    };\n\n    const updatePermission = ({ rule: updatedRule }: { rule: FieldRule }) => {\n        const updatedAccessRules = accessRules.map(rule => {\n            if (rule.value === updatedRule.value) {\n                return updatedRule;\n            }\n            return rule;\n        });\n        bind.onChange([...otherRules, ...updatedAccessRules]);\n    };\n\n    const removeUserTeam = ({ rule: removedRule }: { rule: FieldRule }) => {\n        const updatedAccessRules = accessRules.filter(rule => rule.value !== removedRule.value);\n        bind.onChange([...otherRules, ...updatedAccessRules]);\n    };\n\n    if (!wcp.canUseHcmsFieldPermissions()) {\n        return (\n            <Grid>\n                <Grid.Column span={12}>\n                    <CannotUsePermissions />\n                </Grid.Column>\n            </Grid>\n        );\n    }\n\n    return (\n        <Grid>\n            <Grid.Column span={12}>\n                <UsersTeamsMultiAutocomplete\n                    options={targetsList}\n                    value={accessRules.map(\n                        rule => String(rule.value) as `admin:${string}` | `team:${string}`\n                    )}\n                    onChange={addPermission}\n                />\n            </Grid.Column>\n            <Grid.Column span={12}>\n                <FieldPermissionsSelection\n                    rules={accessRules}\n                    targetsList={targetsList}\n                    onRemoveAccess={removeUserTeam}\n                    onUpdatePermission={updatePermission}\n                />\n            </Grid.Column>\n        </Grid>\n    );\n};\n"],"names":["PermissionsEditor","wcp","useWcp","bind","useBind","allRules","accessRules","r","otherRules","listTargetsQuery","useQuery","LIST_FOLDER_LEVEL_PERMISSIONS_TARGETS","targetsList","addPermission","value","selectedUserOrTeam","newRule","updatePermission","updatedRule","updatedAccessRules","rule","removeUserTeam","removedRule","Grid","CannotUsePermissions","UsersTeamsMultiAutocomplete","String","FieldPermissionsSelection"],"mappings":";;;;;;;;AAcO,MAAMA,oBAAoB;IAC7B,MAAMC,MAAMC;IACZ,MAAMC,OAAOC,QAAQ;QAAE,MAAM;IAAQ;IACrC,MAAMC,WAAwBF,KAAK,KAAK,IAAI,EAAE;IAC9C,MAAMG,cAAcD,SAAS,MAAM,CAACE,CAAAA,IAAKA,AAAW,oBAAXA,EAAE,IAAI;IAC/C,MAAMC,aAAaH,SAAS,MAAM,CAACE,CAAAA,IAAKA,AAAW,oBAAXA,EAAE,IAAI;IAE9C,MAAME,mBAAmBC,SAASC;IAClC,MAAMC,cACFH,iBAAiB,IAAI,EAAE,IAAI,kCAAkC,QAAQ,EAAE;IAE3E,MAAMI,gBAAgB,CAACC;QACnB,MAAMC,qBAAqBD,KAAK,CAACA,MAAM,MAAM,GAAG,EAAE;QAClD,MAAME,UAAqB;YACvB,MAAM;YACN,QAAQ;YACR,UAAU;YACV,OAAOD;YACP,QAAQ;QACZ;QAEAZ,KAAK,QAAQ,CAAC;eAAIK;eAAeF;YAAaU;SAAQ;IAC1D;IAEA,MAAMC,mBAAmB,CAAC,EAAE,MAAMC,WAAW,EAAuB;QAChE,MAAMC,qBAAqBb,YAAY,GAAG,CAACc,CAAAA;YACvC,IAAIA,KAAK,KAAK,KAAKF,YAAY,KAAK,EAChC,OAAOA;YAEX,OAAOE;QACX;QACAjB,KAAK,QAAQ,CAAC;eAAIK;eAAeW;SAAmB;IACxD;IAEA,MAAME,iBAAiB,CAAC,EAAE,MAAMC,WAAW,EAAuB;QAC9D,MAAMH,qBAAqBb,YAAY,MAAM,CAACc,CAAAA,OAAQA,KAAK,KAAK,KAAKE,YAAY,KAAK;QACtFnB,KAAK,QAAQ,CAAC;eAAIK;eAAeW;SAAmB;IACxD;IAEA,IAAI,CAAClB,IAAI,0BAA0B,IAC/B,OAAO,WAAP,GACI,oBAACsB,MAAIA,MAAAA,WAAAA,GACD,oBAACA,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,sBAAoBA;IAMrC,OAAO,WAAP,GACI,oBAACD,MAAIA,MAAAA,WAAAA,GACD,oBAACA,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACE,6BAA2BA;QACxB,SAASb;QACT,OAAON,YAAY,GAAG,CAClBc,CAAAA,OAAQM,OAAON,KAAK,KAAK;QAE7B,UAAUP;uBAGlB,oBAACU,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACI,2BAAyBA;QACtB,OAAOrB;QACP,aAAaM;QACb,gBAAgBS;QAChB,oBAAoBJ;;AAKxC"}

package/admin/components/FieldEditor/EditFieldDialog/PredefinedValues.js

@@ -1,58 +1,45 @@
-import React, { useCallback, useRef, cloneElement } from "react";
+import react, { cloneElement, useCallback, useRef } from "react";
 import { getValue } from "./functions/getValue.js";
 import { setValue } from "./functions/setValue.js";
-import { Bind as BaseFormBind } from "@webiny/form";
+import { Bind as form_Bind } from "@webiny/form";
 import { useModelField } from "../../../hooks/index.js";
-const PredefinedValues = () => {
-  const {
-    field,
-    fieldPlugin
-  } = useModelField();
-  const memoizedBindComponents = useRef({});
-  const getBind = useCallback((index = -1) => {
-    const memoKey = index;
-    if (memoizedBindComponents.current[memoKey]) {
-      return memoizedBindComponents.current[memoKey];
-    }
-    const Bind = ({
-      children,
-      name
-    }) => {
-      return /*#__PURE__*/React.createElement(BaseFormBind, {
-        name: "predefinedValues.values"
-      }, bind => {
-        const props = {
-          ...bind,
-          value: getValue({
-            bind,
-            index,
-            name
-          }),
-          onChange: value => {
-            setValue({
-              value,
-              bind,
-              index,
-              name
+const PredefinedValues = ()=>{
+    const { field, fieldPlugin } = useModelField();
+    const memoizedBindComponents = useRef({});
+    const getBind = useCallback((index = -1)=>{
+        const memoKey = index;
+        if (memoizedBindComponents.current[memoKey]) return memoizedBindComponents.current[memoKey];
+        const Bind = ({ children, name })=>/*#__PURE__*/ react.createElement(form_Bind, {
+                name: "predefinedValues.values"
+            }, (bind)=>{
+                const props = {
+                    ...bind,
+                    value: getValue({
+                        bind,
+                        index,
+                        name
+                    }),
+                    onChange: (value)=>{
+                        setValue({
+                            value,
+                            bind,
+                            index,
+                            name
+                        });
+                    }
+                };
+                if ("function" == typeof children) return children(props);
+                return /*#__PURE__*/ cloneElement(children, props);
             });
-          }
-        };
-        if (typeof children === "function") {
-          return children(props);
-        }
-        return /*#__PURE__*/cloneElement(children, props);
-      });
-    };
-    memoizedBindComponents.current[memoKey] = Bind;
-    return memoizedBindComponents.current[memoKey];
-  }, []);
-  if (!fieldPlugin.field.renderPredefinedValues) {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, `Missing "field.renderPredefinedValues" method in field type plugin: "${field.type}".`);
-  }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, fieldPlugin.field.renderPredefinedValues({
-    getBind
-  }));
+        memoizedBindComponents.current[memoKey] = Bind;
+        return memoizedBindComponents.current[memoKey];
+    }, []);
+    if (!fieldPlugin.field.renderPredefinedValues) return /*#__PURE__*/ react.createElement(react.Fragment, null, `Missing "field.renderPredefinedValues" method in field type plugin: "${field.type}".`);
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, fieldPlugin.field.renderPredefinedValues({
+        getBind
+    }));
 };
-export default PredefinedValues;
+const EditFieldDialog_PredefinedValues = PredefinedValues;
+export default EditFieldDialog_PredefinedValues;
 
 //# sourceMappingURL=PredefinedValues.js.map

package/admin/components/FieldEditor/EditFieldDialog/PredefinedValues.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useRef","cloneElement","getValue","setValue","Bind","BaseFormBind","useModelField","PredefinedValues","field","fieldPlugin","memoizedBindComponents","getBind","index","memoKey","current","children","name","createElement","bind","props","value","onChange","renderPredefinedValues","Fragment","type"],"sources":["PredefinedValues.tsx"],"sourcesContent":["import React, { useCallback, useRef, cloneElement } from \"react\";\nimport { getValue } from \"./functions/getValue.js\";\nimport { setValue } from \"./functions/setValue.js\";\nimport type { BindComponent } from \"@webiny/form\";\nimport { Bind as BaseFormBind } from \"@webiny/form\";\nimport { useModelField } from \"~/admin/hooks/index.js\";\n\ninterface MemoizedBindComponents {\n    [key: string]: BindComponent;\n}\n\nconst PredefinedValues = () => {\n    const { field, fieldPlugin } = useModelField();\n    const memoizedBindComponents = useRef<MemoizedBindComponents>({});\n\n    const getBind = useCallback((index = -1) => {\n        const memoKey = index;\n        if (memoizedBindComponents.current[memoKey]) {\n            return memoizedBindComponents.current[memoKey];\n        }\n\n        const Bind: BindComponent = ({ children, name }) => {\n            return (\n                <BaseFormBind name={\"predefinedValues.values\"}>\n                    {bind => {\n                        const props = {\n                            ...bind,\n                            value: getValue({ bind, index, name }),\n                            onChange: (value: string[]) => {\n                                setValue({ value, bind, index, name });\n                            }\n                        };\n\n                        if (typeof children === \"function\") {\n                            return children(props);\n                        }\n\n                        return cloneElement(children as unknown as React.ReactElement, props);\n                    }}\n                </BaseFormBind>\n            );\n        };\n\n        memoizedBindComponents.current[memoKey] = Bind;\n\n        return memoizedBindComponents.current[memoKey];\n    }, []);\n    if (!fieldPlugin.field.renderPredefinedValues) {\n        return (\n            <>{`Missing \"field.renderPredefinedValues\" method in field type plugin: \"${field.type}\".`}</>\n        );\n    }\n\n    return <>{fieldPlugin.field.renderPredefinedValues({ getBind })}</>;\n};\n\nexport default PredefinedValues;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,MAAM,EAAEC,YAAY,QAAQ,OAAO;AAChE,SAASC,QAAQ;AACjB,SAASC,QAAQ;AAEjB,SAASC,IAAI,IAAIC,YAAY,QAAQ,cAAc;AACnD,SAASC,aAAa;AAMtB,MAAMC,gBAAgB,GAAGA,CAAA,KAAM;EAC3B,MAAM;IAAEC,KAAK;IAAEC;EAAY,CAAC,GAAGH,aAAa,CAAC,CAAC;EAC9C,MAAMI,sBAAsB,GAAGV,MAAM,CAAyB,CAAC,CAAC,CAAC;EAEjE,MAAMW,OAAO,GAAGZ,WAAW,CAAC,CAACa,KAAK,GAAG,CAAC,CAAC,KAAK;IACxC,MAAMC,OAAO,GAAGD,KAAK;IACrB,IAAIF,sBAAsB,CAACI,OAAO,CAACD,OAAO,CAAC,EAAE;MACzC,OAAOH,sBAAsB,CAACI,OAAO,CAACD,OAAO,CAAC;IAClD;IAEA,MAAMT,IAAmB,GAAGA,CAAC;MAAEW,QAAQ;MAAEC;IAAK,CAAC,KAAK;MAChD,oBACIlB,KAAA,CAAAmB,aAAA,CAACZ,YAAY;QAACW,IAAI,EAAE;MAA0B,GACzCE,IAAI,IAAI;QACL,MAAMC,KAAK,GAAG;UACV,GAAGD,IAAI;UACPE,KAAK,EAAElB,QAAQ,CAAC;YAAEgB,IAAI;YAAEN,KAAK;YAAEI;UAAK,CAAC,CAAC;UACtCK,QAAQ,EAAGD,KAAe,IAAK;YAC3BjB,QAAQ,CAAC;cAAEiB,KAAK;cAAEF,IAAI;cAAEN,KAAK;cAAEI;YAAK,CAAC,CAAC;UAC1C;QACJ,CAAC;QAED,IAAI,OAAOD,QAAQ,KAAK,UAAU,EAAE;UAChC,OAAOA,QAAQ,CAACI,KAAK,CAAC;QAC1B;QAEA,oBAAOlB,YAAY,CAACc,QAAQ,EAAmCI,KAAK,CAAC;MACzE,CACU,CAAC;IAEvB,CAAC;IAEDT,sBAAsB,CAACI,OAAO,CAACD,OAAO,CAAC,GAAGT,IAAI;IAE9C,OAAOM,sBAAsB,CAACI,OAAO,CAACD,OAAO,CAAC;EAClD,CAAC,EAAE,EAAE,CAAC;EACN,IAAI,CAACJ,WAAW,CAACD,KAAK,CAACc,sBAAsB,EAAE;IAC3C,oBACIxB,KAAA,CAAAmB,aAAA,CAAAnB,KAAA,CAAAyB,QAAA,QAAG,wEAAwEf,KAAK,CAACgB,IAAI,IAAO,CAAC;EAErG;EAEA,oBAAO1B,KAAA,CAAAmB,aAAA,CAAAnB,KAAA,CAAAyB,QAAA,QAAGd,WAAW,CAACD,KAAK,CAACc,sBAAsB,CAAC;IAAEX;EAAQ,CAAC,CAAI,CAAC;AACvE,CAAC;AAED,eAAeJ,gBAAgB","ignoreList":[]}
+{"version":3,"file":"admin/components/FieldEditor/EditFieldDialog/PredefinedValues.js","sources":["../../../../../src/admin/components/FieldEditor/EditFieldDialog/PredefinedValues.tsx"],"sourcesContent":["import React, { useCallback, useRef, cloneElement } from \"react\";\nimport { getValue } from \"./functions/getValue.js\";\nimport { setValue } from \"./functions/setValue.js\";\nimport type { BindComponent } from \"@webiny/form\";\nimport { Bind as BaseFormBind } from \"@webiny/form\";\nimport { useModelField } from \"~/admin/hooks/index.js\";\n\ninterface MemoizedBindComponents {\n    [key: string]: BindComponent;\n}\n\nconst PredefinedValues = () => {\n    const { field, fieldPlugin } = useModelField();\n    const memoizedBindComponents = useRef<MemoizedBindComponents>({});\n\n    const getBind = useCallback((index = -1) => {\n        const memoKey = index;\n        if (memoizedBindComponents.current[memoKey]) {\n            return memoizedBindComponents.current[memoKey];\n        }\n\n        const Bind: BindComponent = ({ children, name }) => {\n            return (\n                <BaseFormBind name={\"predefinedValues.values\"}>\n                    {bind => {\n                        const props = {\n                            ...bind,\n                            value: getValue({ bind, index, name }),\n                            onChange: (value: string[]) => {\n                                setValue({ value, bind, index, name });\n                            }\n                        };\n\n                        if (typeof children === \"function\") {\n                            return children(props);\n                        }\n\n                        return cloneElement(children as unknown as React.ReactElement, props);\n                    }}\n                </BaseFormBind>\n            );\n        };\n\n        memoizedBindComponents.current[memoKey] = Bind;\n\n        return memoizedBindComponents.current[memoKey];\n    }, []);\n    if (!fieldPlugin.field.renderPredefinedValues) {\n        return (\n            <>{`Missing \"field.renderPredefinedValues\" method in field type plugin: \"${field.type}\".`}</>\n        );\n    }\n\n    return <>{fieldPlugin.field.renderPredefinedValues({ getBind })}</>;\n};\n\nexport default PredefinedValues;\n"],"names":["PredefinedValues","field","fieldPlugin","useModelField","memoizedBindComponents","useRef","getBind","useCallback","index","memoKey","Bind","children","name","BaseFormBind","bind","props","getValue","value","setValue","cloneElement"],"mappings":";;;;;AAWA,MAAMA,mBAAmB;IACrB,MAAM,EAAEC,KAAK,EAAEC,WAAW,EAAE,GAAGC;IAC/B,MAAMC,yBAAyBC,OAA+B,CAAC;IAE/D,MAAMC,UAAUC,YAAY,CAACC,QAAQ,EAAE;QACnC,MAAMC,UAAUD;QAChB,IAAIJ,uBAAuB,OAAO,CAACK,QAAQ,EACvC,OAAOL,uBAAuB,OAAO,CAACK,QAAQ;QAGlD,MAAMC,OAAsB,CAAC,EAAEC,QAAQ,EAAEC,IAAI,EAAE,GACpC,WAAP,GACI,oBAACC,WAAYA;gBAAC,MAAM;eACfC,CAAAA;gBACG,MAAMC,QAAQ;oBACV,GAAGD,IAAI;oBACP,OAAOE,SAAS;wBAAEF;wBAAMN;wBAAOI;oBAAK;oBACpC,UAAU,CAACK;wBACPC,SAAS;4BAAED;4BAAOH;4BAAMN;4BAAOI;wBAAK;oBACxC;gBACJ;gBAEA,IAAI,AAAoB,cAApB,OAAOD,UACP,OAAOA,SAASI;gBAGpB,OAAO,WAAP,GAAOI,aAAaR,UAA2CI;YACnE;QAKZX,uBAAuB,OAAO,CAACK,QAAQ,GAAGC;QAE1C,OAAON,uBAAuB,OAAO,CAACK,QAAQ;IAClD,GAAG,EAAE;IACL,IAAI,CAACP,YAAY,KAAK,CAAC,sBAAsB,EACzC,OAAO,WAAP,GACI,0CAAG,CAAC,qEAAqE,EAAED,MAAM,IAAI,CAAC,EAAE,CAAC;IAIjG,OAAO,WAAP,GAAO,0CAAGC,YAAY,KAAK,CAAC,sBAAsB,CAAC;QAAEI;IAAQ;AACjE;AAEA,yCAAeN"}