@webiny/app-headless-cms 0.0.0-unstable.496cf268ac → 0.0.0-unstable.5387e5f7c8

package/admin/components/Droppable.js.map

@@ -1 +1 @@
-{"version":3,"names":["DroppableComponent","props","children","onDrop","isVisible","useDrop","accept","collect","monitor","isOver","shallow","item","getItem","drop","isDroppable","isDragging","Boolean","Droppable","React","memo"],"sources":["Droppable.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ConnectDropTarget, useDrop } from \"react-dnd\";\nimport { DragSource } from \"~/admin/components/FieldEditor/FieldEditorContext\";\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: \"row\" | \"field\" | \"newField\";\n    item: any;\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: any) => boolean;\n    isVisible?: IsVisibleCallable;\n    onDrop?: OnDropCallable;\n}\n\nconst DroppableComponent: React.FC<DroppableProps> = props => {\n    const { children, onDrop, isVisible = () => true } = props;\n\n    const [{ item, isOver }, drop] = useDrop({\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.FC<DroppableProps> = React.memo(DroppableComponent);\n"],"mappings":";;;;;;;;;AAAA;AACA;AAkCA,IAAMA,kBAA4C,GAAG,SAA/CA,kBAA4C,CAAGC,KAAK,EAAI;EAC1D,IAAQC,QAAQ,GAAqCD,KAAK,CAAlDC,QAAQ;IAAEC,MAAM,GAA6BF,KAAK,CAAxCE,MAAM;IAAA,mBAA6BF,KAAK,CAAhCG,SAAS;IAATA,SAAS,iCAAG;MAAA,OAAM,IAAI;IAAA;EAEhD,eAAiC,IAAAC,iBAAO,EAAC;MACrCC,MAAM,EAAE,SAAS;MACjBC,OAAO,EAAE,iBAAAC,OAAO;QAAA,OAAK;UACjBC,MAAM,EAAED,OAAO,CAACC,MAAM,EAAE,IAAID,OAAO,CAACC,MAAM,CAAC;YAAEC,OAAO,EAAE;UAAK,CAAC,CAAC;UAC7DC,IAAI,EAAEH,OAAO,CAACI,OAAO;QACzB,CAAC;MAAA,CAAC;MACFC,IAAI,gBAACF,IAAI,EAAEH,OAAO,EAAE;QAChB,IAAI,OAAOP,KAAK,CAACa,WAAW,KAAK,UAAU,IAAI,CAACb,KAAK,CAACa,WAAW,CAACH,IAAI,CAAC,EAAE;UACrE;QACJ;QAEA,IAAI,OAAOR,MAAM,KAAK,UAAU,EAAE;UAC9B,OAAOA,MAAM,CAACK,OAAO,CAACI,OAAO,EAAE,CAAC;QACpC;MACJ;IACJ,CAAC,CAAC;IAAA;IAAA;IAfOD,IAAI,cAAJA,IAAI;IAAEF,MAAM,cAANA,MAAM;IAAII,IAAI;EAiB7B,IAAIF,IAAI,IAAI,CAACP,SAAS,CAACO,IAAI,CAAC,EAAE;IAC1B,OAAO,IAAI;EACf;EAEA,IAAIG,WAAW,GAAG,IAAI;EACtB,IAAIH,IAAI,EAAE;IACNG,WAAW,GAAGb,KAAK,CAACa,WAAW,GAAGb,KAAK,CAACa,WAAW,CAACH,IAAI,CAAC,GAAGF,MAAM;EACtE;EAEA,OAAOP,QAAQ,CAAC;IAAEa,UAAU,EAAEC,OAAO,CAACL,IAAI,CAAC;IAAEF,MAAM,EAANA,MAAM;IAAEK,WAAW,EAAXA,WAAW;IAAEH,IAAI,EAAJA,IAAI;IAAEE,IAAI,EAAJA;EAAK,CAAC,CAAC;AACnF,CAAC;AAEM,IAAMI,SAAmC,gBAAGC,KAAK,CAACC,IAAI,CAACnB,kBAAkB,CAAC;AAAC"}
+{"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.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const CannotUsePermissions: () => React.JSX.Element;

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

@@ -0,0 +1,13 @@
+import react from "react";
+import { Alert } from "@webiny/admin-ui";
+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

@@ -0,0 +1 @@
+{"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.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import type { FolderLevelPermissionsTarget } from "@webiny/app-aco";
+import type { FieldRule } from "../../../../../types.js";
+interface FieldPermissionsSelectionProps {
+    targetsList: FolderLevelPermissionsTarget[];
+    rules: FieldRule[];
+    onRemoveAccess: (params: {
+        rule: FieldRule;
+    }) => void;
+    onUpdatePermission: (params: {
+        rule: FieldRule;
+    }) => void;
+}
+export declare const FieldPermissionsSelection: ({ rules, targetsList, onRemoveAccess, onUpdatePermission }: FieldPermissionsSelectionProps) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,113 @@
+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))
+    });
+};
+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);
+};
+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"
+    }));
+};
+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

@@ -0,0 +1 @@
+{"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.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const PermissionsEditor: () => React.JSX.Element;

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

@@ -0,0 +1,75 @@
+import react, { useEffect, useState } from "react";
+import { useFeature } from "@webiny/app";
+import { Grid } from "@webiny/admin-ui";
+import { useBind } from "@webiny/form";
+import { useFeatureFlags } from "@webiny/app-admin";
+import { UsersTeamsMultiAutocomplete } from "@webiny/app-aco";
+import { ListFolderPermissionsTargetsFeature } from "../../../../../features/listFolderPermissionsTargets/feature.js";
+import { FieldPermissionsSelection } from "./FieldPermissionsSelection.js";
+import { CannotUsePermissions } from "./CannotUsePermissions.js";
+const PermissionsEditor = ()=>{
+    const featureFlags = useFeatureFlags();
+    const { useCase } = useFeature(ListFolderPermissionsTargetsFeature);
+    const bind = useBind({
+        name: "rules"
+    });
+    const allRules = bind.value || [];
+    const accessRules = allRules.filter((r)=>"accessControl" === r.type);
+    const otherRules = allRules.filter((r)=>"accessControl" !== r.type);
+    const [targetsList, setTargetsList] = useState([]);
+    useEffect(()=>{
+        useCase.execute().then(setTargetsList).catch(console.error);
+    }, []);
+    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 (!featureFlags.isEnabled("advancedAccessControlLayer.hcmsFieldPermissions")) 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

@@ -0,0 +1 @@
+{"version":3,"file":"admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/PermissionsEditor.js","sources":["../../../../../../src/admin/components/FieldEditor/EditFieldDialog/PermissionsEditor/PermissionsEditor.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { useFeature } from \"@webiny/app\";\nimport { Grid } from \"@webiny/admin-ui\";\nimport { useBind } from \"@webiny/form\";\nimport { useFeatureFlags } from \"@webiny/app-admin\";\nimport { UsersTeamsMultiAutocomplete } from \"@webiny/app-aco\";\nimport type { FolderLevelPermissionsTarget } from \"@webiny/app-aco\";\nimport { ListFolderPermissionsTargetsFeature } from \"~/features/listFolderPermissionsTargets/feature.js\";\nimport type { FieldRule } from \"~/types.js\";\nimport { FieldPermissionsSelection } from \"./FieldPermissionsSelection.js\";\nimport { CannotUsePermissions } from \"./CannotUsePermissions.js\";\n\nexport const PermissionsEditor = () => {\n    const featureFlags = useFeatureFlags();\n    const { useCase } = useFeature(ListFolderPermissionsTargetsFeature);\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 [targetsList, setTargetsList] = useState<FolderLevelPermissionsTarget[]>([]);\n\n    useEffect(() => {\n        useCase.execute().then(setTargetsList).catch(console.error);\n    }, []);\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 (!featureFlags.isEnabled(\"advancedAccessControlLayer.hcmsFieldPermissions\")) {\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","featureFlags","useFeatureFlags","useCase","useFeature","ListFolderPermissionsTargetsFeature","bind","useBind","allRules","accessRules","r","otherRules","targetsList","setTargetsList","useState","useEffect","console","addPermission","value","selectedUserOrTeam","newRule","updatePermission","updatedRule","updatedAccessRules","rule","removeUserTeam","removedRule","Grid","CannotUsePermissions","UsersTeamsMultiAutocomplete","String","FieldPermissionsSelection"],"mappings":";;;;;;;;;AAYO,MAAMA,oBAAoB;IAC7B,MAAMC,eAAeC;IACrB,MAAM,EAAEC,OAAO,EAAE,GAAGC,WAAWC;IAC/B,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,MAAM,CAACE,aAAaC,eAAe,GAAGC,SAAyC,EAAE;IAEjFC,UAAU;QACNZ,QAAQ,OAAO,GAAG,IAAI,CAACU,gBAAgB,KAAK,CAACG,QAAQ,KAAK;IAC9D,GAAG,EAAE;IAEL,MAAMC,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;QAEAb,KAAK,QAAQ,CAAC;eAAIK;eAAeF;YAAaW;SAAQ;IAC1D;IAEA,MAAMC,mBAAmB,CAAC,EAAE,MAAMC,WAAW,EAAuB;QAChE,MAAMC,qBAAqBd,YAAY,GAAG,CAACe,CAAAA;YACvC,IAAIA,KAAK,KAAK,KAAKF,YAAY,KAAK,EAChC,OAAOA;YAEX,OAAOE;QACX;QACAlB,KAAK,QAAQ,CAAC;eAAIK;eAAeY;SAAmB;IACxD;IAEA,MAAME,iBAAiB,CAAC,EAAE,MAAMC,WAAW,EAAuB;QAC9D,MAAMH,qBAAqBd,YAAY,MAAM,CAACe,CAAAA,OAAQA,KAAK,KAAK,KAAKE,YAAY,KAAK;QACtFpB,KAAK,QAAQ,CAAC;eAAIK;eAAeY;SAAmB;IACxD;IAEA,IAAI,CAACtB,aAAa,SAAS,CAAC,oDACxB,OAAO,WAAP,GACI,oBAAC0B,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,SAASjB;QACT,OAAOH,YAAY,GAAG,CAClBe,CAAAA,OAAQM,OAAON,KAAK,KAAK;QAE7B,UAAUP;uBAGlB,oBAACU,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACI,2BAAyBA;QACtB,OAAOtB;QACP,aAAaG;QACb,gBAAgBa;QAChB,oBAAoBJ;;AAKxC"}

package/admin/components/FieldEditor/EditFieldDialog/RulesEditor/RulesEditor.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import type { FieldOption } from "../../../../../admin/components/ContentModelEditor/fieldOptions.js";
+interface ActionOption {
+    value: string;
+    label: string;
+}
+interface RulesTabProps {
+    fieldOptions: FieldOption[];
+    actionOptions?: ActionOption[];
+}
+export declare const RulesEditor: ({ fieldOptions, actionOptions }: RulesTabProps) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,225 @@
+import react, { useCallback, useMemo } from "react";
+import { Button, Grid, Input, Select, Separator } from "@webiny/admin-ui";
+import { useBind } from "@webiny/form";
+import { ReactComponent } from "@webiny/icons/delete.svg";
+import { ReactComponent as add_svg_ReactComponent } from "@webiny/icons/add.svg";
+import { VALUE_HIDDEN_OPERATORS, getOperatorOptions } from "../../../ContentModelEditor/operatorOptions.js";
+const DEFAULT_ACTION_OPTIONS = [
+    {
+        value: "hide",
+        label: "Hide"
+    },
+    {
+        value: "disable",
+        label: "Disable"
+    }
+];
+const RuleRow = ({ rule, index, fieldOptions, actionOptions, onChange, onRemove })=>{
+    const selectedFieldOption = useMemo(()=>fieldOptions.find((o)=>o.value === rule.target), [
+        fieldOptions,
+        rule.target
+    ]);
+    const operatorOptions = useMemo(()=>selectedFieldOption ? getOperatorOptions(selectedFieldOption.fieldType) : [], [
+        selectedFieldOption
+    ]);
+    const operatorSelectOptions = useMemo(()=>operatorOptions.map((o)=>({
+                value: o.value,
+                label: o.label
+            })), [
+        operatorOptions
+    ]);
+    const fieldSelectOptions = useMemo(()=>fieldOptions.map((o)=>({
+                value: o.value,
+                label: o.label
+            })), [
+        fieldOptions
+    ]);
+    const showValue = rule.operator && !VALUE_HIDDEN_OPERATORS.has(rule.operator);
+    const handleFieldChange = useCallback((value)=>{
+        const newTarget = value ?? "";
+        const newFieldOption = fieldOptions.find((o)=>o.value === newTarget);
+        const newOps = newFieldOption ? getOperatorOptions(newFieldOption.fieldType) : [];
+        const currentOpValid = newOps.some((o)=>o.value === rule.operator);
+        onChange(index, {
+            ...rule,
+            target: newTarget,
+            operator: currentOpValid ? rule.operator : "",
+            value: currentOpValid ? rule.value : null
+        });
+    }, [
+        fieldOptions,
+        rule,
+        index,
+        onChange
+    ]);
+    const handleOperatorChange = useCallback((value)=>{
+        const op = value ?? "";
+        onChange(index, {
+            ...rule,
+            operator: op,
+            value: VALUE_HIDDEN_OPERATORS.has(op) ? null : rule.value
+        });
+    }, [
+        rule,
+        index,
+        onChange
+    ]);
+    const handleValueChange = useCallback((value)=>{
+        let parsed = value ?? "";
+        if (selectedFieldOption?.fieldType === "number" && "" !== parsed) {
+            const num = Number(parsed);
+            if (!isNaN(num)) parsed = num;
+        }
+        if (selectedFieldOption?.fieldType === "boolean") {
+            if ("true" === parsed) parsed = true;
+            else if ("false" === parsed) parsed = false;
+        }
+        onChange(index, {
+            ...rule,
+            value: parsed
+        });
+    }, [
+        rule,
+        index,
+        onChange,
+        selectedFieldOption
+    ]);
+    const handleActionChange = useCallback((value)=>{
+        onChange(index, {
+            ...rule,
+            action: value ?? actionOptions[0]?.value ?? "hide"
+        });
+    }, [
+        rule,
+        index,
+        onChange,
+        actionOptions
+    ]);
+    const isBooleanField = selectedFieldOption?.fieldType === "boolean";
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(Separator, {
+        className: 0 === index ? "mb-lg" : "my-lg",
+        variant: "accent",
+        labelPosition: "start"
+    }, "Rule #", index + 1), /*#__PURE__*/ react.createElement(Grid, null, /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Select, {
+        displayResetAction: false,
+        label: "Field",
+        value: rule.target,
+        options: fieldSelectOptions,
+        onChange: handleFieldChange
+    })), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 6
+    }, /*#__PURE__*/ react.createElement(Select, {
+        displayResetAction: false,
+        label: "Operator",
+        value: rule.operator,
+        options: operatorSelectOptions,
+        onChange: handleOperatorChange,
+        disabled: !rule.target
+    })), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 6
+    }, isBooleanField ? /*#__PURE__*/ react.createElement(Select, {
+        disabled: !showValue,
+        displayResetAction: false,
+        label: "Value",
+        value: String(rule.value ?? ""),
+        options: [
+            {
+                value: "true",
+                label: "True"
+            },
+            {
+                value: "false",
+                label: "False"
+            }
+        ],
+        onChange: handleValueChange
+    }) : /*#__PURE__*/ react.createElement(Input, {
+        disabled: !showValue,
+        label: "Value",
+        value: null != rule.value ? String(rule.value) : "",
+        type: selectedFieldOption?.fieldType === "number" ? "number" : "text",
+        onChange: handleValueChange
+    })), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Select, {
+        label: "Action",
+        displayResetAction: false,
+        value: rule.action,
+        options: actionOptions,
+        onChange: handleActionChange
+    })), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12,
+        className: "flex justify-between"
+    }, /*#__PURE__*/ react.createElement(Button, {
+        className: "[&_svg]:fill-destructive text-destructive-primary",
+        containerClassName: "flex ml-auto",
+        text: "Remove rule",
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        onClick: ()=>onRemove(index),
+        variant: "ghost"
+    }))));
+};
+const RulesEditor = ({ fieldOptions, actionOptions = DEFAULT_ACTION_OPTIONS })=>{
+    const bind = useBind({
+        name: "rules"
+    });
+    const allRules = bind.value || [];
+    const entryRules = allRules.filter((r)=>"condition" === r.type);
+    const otherRules = allRules.filter((r)=>"condition" !== r.type);
+    const addRule = ()=>{
+        const newRule = {
+            type: "condition",
+            target: "",
+            operator: "",
+            value: null,
+            action: actionOptions[0]?.value ?? "hide"
+        };
+        bind.onChange([
+            ...otherRules,
+            ...entryRules,
+            newRule
+        ]);
+    };
+    const updateRule = (index, updated)=>{
+        const next = [
+            ...entryRules
+        ];
+        next[index] = updated;
+        bind.onChange([
+            ...otherRules,
+            ...next
+        ]);
+    };
+    const removeRule = (index)=>{
+        bind.onChange([
+            ...otherRules,
+            ...entryRules.filter((_, i)=>i !== index)
+        ]);
+    };
+    return /*#__PURE__*/ react.createElement(Grid, null, /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, entryRules.map((rule, index)=>/*#__PURE__*/ react.createElement(RuleRow, {
+            key: index,
+            rule: rule,
+            index: index,
+            fieldOptions: fieldOptions,
+            actionOptions: actionOptions,
+            onChange: updateRule,
+            onRemove: removeRule
+        })), entryRules.length > 0 ? /*#__PURE__*/ react.createElement(Separator, {
+        variant: "accent",
+        className: "mt-lg"
+    }) : null, /*#__PURE__*/ react.createElement("div", {
+        className: "flex justify-center mt-md"
+    }, /*#__PURE__*/ react.createElement(Button, {
+        onClick: addRule,
+        text: "Add Rule",
+        icon: /*#__PURE__*/ react.createElement(add_svg_ReactComponent, null),
+        size: "sm"
+    }))));
+};
+export { RulesEditor };
+
+//# sourceMappingURL=RulesEditor.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"admin/components/FieldEditor/EditFieldDialog/RulesEditor/RulesEditor.js","sources":["../../../../../../src/admin/components/FieldEditor/EditFieldDialog/RulesEditor/RulesEditor.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { Grid, Select, Input, Button, Separator } from \"@webiny/admin-ui\";\nimport { useBind } from \"@webiny/form\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete.svg\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\nimport type { FieldRule, FieldRuleAction } from \"~/types.js\";\nimport type { FieldOption } from \"~/admin/components/ContentModelEditor/fieldOptions.js\";\nimport {\n    getOperatorOptions,\n    VALUE_HIDDEN_OPERATORS\n} from \"~/admin/components/ContentModelEditor/operatorOptions.js\";\nimport type { Operator } from \"~/admin/components/ContentModelEditor/evaluateExpression.js\";\n\nconst DEFAULT_ACTION_OPTIONS = [\n    { value: \"hide\", label: \"Hide\" },\n    { value: \"disable\", label: \"Disable\" }\n];\n\ninterface ActionOption {\n    value: string;\n    label: string;\n}\n\ninterface RuleRowProps {\n    rule: FieldRule;\n    index: number;\n    fieldOptions: FieldOption[];\n    actionOptions: ActionOption[];\n    onChange: (index: number, updated: FieldRule) => void;\n    onRemove: (index: number) => void;\n}\n\nconst RuleRow = ({\n    rule,\n    index,\n    fieldOptions,\n    actionOptions,\n    onChange,\n    onRemove\n}: RuleRowProps) => {\n    const selectedFieldOption = useMemo(\n        () => fieldOptions.find(o => o.value === rule.target),\n        [fieldOptions, rule.target]\n    );\n\n    const operatorOptions = useMemo(\n        () => (selectedFieldOption ? getOperatorOptions(selectedFieldOption.fieldType) : []),\n        [selectedFieldOption]\n    );\n\n    const operatorSelectOptions = useMemo(\n        () => operatorOptions.map(o => ({ value: o.value, label: o.label })),\n        [operatorOptions]\n    );\n\n    const fieldSelectOptions = useMemo(\n        () => fieldOptions.map(o => ({ value: o.value, label: o.label })),\n        [fieldOptions]\n    );\n\n    const showValue = rule.operator && !VALUE_HIDDEN_OPERATORS.has(rule.operator as Operator);\n\n    const handleFieldChange = useCallback(\n        (value: string | null) => {\n            const newTarget = value ?? \"\";\n            const newFieldOption = fieldOptions.find(o => o.value === newTarget);\n            // Reset operator and value when field changes\n            const newOps = newFieldOption ? getOperatorOptions(newFieldOption.fieldType) : [];\n            const currentOpValid = newOps.some(o => o.value === rule.operator);\n            onChange(index, {\n                ...rule,\n                target: newTarget,\n                operator: currentOpValid ? rule.operator : \"\",\n                value: currentOpValid ? rule.value : null\n            });\n        },\n        [fieldOptions, rule, index, onChange]\n    );\n\n    const handleOperatorChange = useCallback(\n        (value: string | null) => {\n            const op = value ?? \"\";\n            onChange(index, {\n                ...rule,\n                operator: op,\n                value: VALUE_HIDDEN_OPERATORS.has(op as Operator) ? null : rule.value\n            });\n        },\n        [rule, index, onChange]\n    );\n\n    const handleValueChange = useCallback(\n        (value: string | null) => {\n            let parsed: string | number | boolean | null = value ?? \"\";\n\n            // Auto-parse numbers for numeric field types\n            if (selectedFieldOption?.fieldType === \"number\" && parsed !== \"\") {\n                const num = Number(parsed);\n                if (!isNaN(num)) {\n                    parsed = num;\n                }\n            }\n\n            // Auto-parse booleans\n            if (selectedFieldOption?.fieldType === \"boolean\") {\n                if (parsed === \"true\") {\n                    parsed = true;\n                } else if (parsed === \"false\") {\n                    parsed = false;\n                }\n            }\n\n            onChange(index, { ...rule, value: parsed });\n        },\n        [rule, index, onChange, selectedFieldOption]\n    );\n\n    const handleActionChange = useCallback(\n        (value: string | null) => {\n            onChange(index, {\n                ...rule,\n                action: (value ?? actionOptions[0]?.value ?? \"hide\") as FieldRuleAction\n            });\n        },\n        [rule, index, onChange, actionOptions]\n    );\n\n    // For boolean fields, show a dropdown for value\n    const isBooleanField = selectedFieldOption?.fieldType === \"boolean\";\n\n    return (\n        <>\n            <Separator\n                className={index === 0 ? \"mb-lg\" : \"my-lg\"}\n                variant={\"accent\"}\n                labelPosition={\"start\"}\n            >\n                Rule #{index + 1}\n            </Separator>\n            <Grid>\n                <Grid.Column span={12}>\n                    <Select\n                        displayResetAction={false}\n                        label={\"Field\"}\n                        value={rule.target}\n                        options={fieldSelectOptions}\n                        onChange={handleFieldChange}\n                    />\n                </Grid.Column>\n                <Grid.Column span={6}>\n                    <Select\n                        displayResetAction={false}\n                        label={\"Operator\"}\n                        value={rule.operator}\n                        options={operatorSelectOptions}\n                        onChange={handleOperatorChange}\n                        disabled={!rule.target}\n                    />\n                </Grid.Column>\n                <Grid.Column span={6}>\n                    {isBooleanField ? (\n                        <Select\n                            disabled={!showValue}\n                            displayResetAction={false}\n                            label={\"Value\"}\n                            value={String(rule.value ?? \"\")}\n                            options={[\n                                { value: \"true\", label: \"True\" },\n                                { value: \"false\", label: \"False\" }\n                            ]}\n                            onChange={handleValueChange}\n                        />\n                    ) : (\n                        <Input\n                            disabled={!showValue}\n                            label={\"Value\"}\n                            value={rule.value != null ? String(rule.value) : \"\"}\n                            type={selectedFieldOption?.fieldType === \"number\" ? \"number\" : \"text\"}\n                            onChange={handleValueChange}\n                        />\n                    )}\n                </Grid.Column>\n                <Grid.Column span={12}>\n                    <Select\n                        label={\"Action\"}\n                        displayResetAction={false}\n                        value={rule.action}\n                        options={actionOptions}\n                        onChange={handleActionChange}\n                    />\n                </Grid.Column>\n                <Grid.Column span={12} className={\"flex justify-between\"}>\n                    <Button\n                        className={\"[&_svg]:fill-destructive text-destructive-primary\"}\n                        containerClassName={\"flex ml-auto\"}\n                        text={\"Remove rule\"}\n                        icon={<DeleteIcon />}\n                        onClick={() => onRemove(index)}\n                        variant={\"ghost\"}\n                    />\n                </Grid.Column>\n            </Grid>\n        </>\n    );\n};\n\ninterface RulesTabProps {\n    fieldOptions: FieldOption[];\n    actionOptions?: ActionOption[];\n}\n\nexport const RulesEditor = ({\n    fieldOptions,\n    actionOptions = DEFAULT_ACTION_OPTIONS\n}: RulesTabProps) => {\n    const bind = useBind({ name: \"rules\" });\n    const allRules: FieldRule[] = bind.value || [];\n    const entryRules = allRules.filter(r => r.type === \"condition\");\n    const otherRules = allRules.filter(r => r.type !== \"condition\");\n\n    const addRule = () => {\n        const newRule: FieldRule = {\n            type: \"condition\",\n            target: \"\",\n            operator: \"\",\n            value: null,\n            action: (actionOptions[0]?.value ?? \"hide\") as FieldRuleAction\n        };\n        bind.onChange([...otherRules, ...entryRules, newRule]);\n    };\n\n    const updateRule = (index: number, updated: FieldRule) => {\n        const next = [...entryRules];\n        next[index] = updated;\n        bind.onChange([...otherRules, ...next]);\n    };\n\n    const removeRule = (index: number) => {\n        bind.onChange([...otherRules, ...entryRules.filter((_, i) => i !== index)]);\n    };\n\n    return (\n        <Grid>\n            <Grid.Column span={12}>\n                {entryRules.map((rule, index) => (\n                    <RuleRow\n                        key={index}\n                        rule={rule}\n                        index={index}\n                        fieldOptions={fieldOptions}\n                        actionOptions={actionOptions}\n                        onChange={updateRule}\n                        onRemove={removeRule}\n                    />\n                ))}\n                {entryRules.length > 0 ? (\n                    <Separator variant={\"accent\"} className={\"mt-lg\"} />\n                ) : null}\n                <div className={\"flex justify-center mt-md\"}>\n                    <Button onClick={addRule} text={\"Add Rule\"} icon={<AddIcon />} size={\"sm\"} />\n                </div>\n            </Grid.Column>\n        </Grid>\n    );\n};\n"],"names":["DEFAULT_ACTION_OPTIONS","RuleRow","rule","index","fieldOptions","actionOptions","onChange","onRemove","selectedFieldOption","useMemo","o","operatorOptions","getOperatorOptions","operatorSelectOptions","fieldSelectOptions","showValue","VALUE_HIDDEN_OPERATORS","handleFieldChange","useCallback","value","newTarget","newFieldOption","newOps","currentOpValid","handleOperatorChange","op","handleValueChange","parsed","num","Number","isNaN","handleActionChange","isBooleanField","Separator","Grid","Select","String","Input","Button","DeleteIcon","RulesEditor","bind","useBind","allRules","entryRules","r","otherRules","addRule","newRule","updateRule","updated","next","removeRule","_","i","AddIcon"],"mappings":"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"}

package/admin/components/FieldEditor/EditFieldDialog/RulesEditor/index.d.ts

@@ -0,0 +1 @@
+export { RulesEditor } from "./RulesEditor.js";

package/admin/components/FieldEditor/EditFieldDialog/RulesEditor/index.js

@@ -0,0 +1 @@
+export { RulesEditor } from "./RulesEditor.js";

package/admin/components/FieldEditor/EditFieldDialog.d.ts

@@ -1,9 +1,10 @@
 import React from "react";
-import { FormOnSubmit } from "@webiny/form";
-import { CmsModelField } from "../../../types";
+import type { CmsModelField } from "../../../types.js";
 interface EditFieldDialogProps {
     onClose: () => void;
-    onSubmit: FormOnSubmit<CmsModelField>;
+    onSubmit: (data: CmsModelField) => void;
 }
-declare const EditFieldDialog: React.FC<EditFieldDialogProps>;
+declare const EditFieldDialog: ((props: EditFieldDialogProps) => React.JSX.Element) & React.NamedExoticComponent<EditFieldDialogProps> & {
+    readonly type: (props: EditFieldDialogProps) => React.JSX.Element;
+};
 export default EditFieldDialog;