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

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

@@ -1,200 +1,225 @@
-import React, { useCallback, useMemo } from "react";
-import { Grid, Select, Input, Button, Separator } from "@webiny/admin-ui";
+import react, { useCallback, useMemo } from "react";
+import { Button, Grid, Input, Select, Separator } from "@webiny/admin-ui";
 import { useBind } from "@webiny/form";
-import { ReactComponent as DeleteIcon } from "@webiny/icons/delete.svg";
-import { ReactComponent as AddIcon } from "@webiny/icons/add.svg";
-import { getOperatorOptions, VALUE_HIDDEN_OPERATORS } from "@webiny/app-headless-cms-common/Fields/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);
-    // Reset operator and value when field changes
-    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 ?? "";
-
-    // Auto-parse numbers for numeric field types
-    if (selectedFieldOption?.fieldType === "number" && parsed !== "") {
-      const num = Number(parsed);
-      if (!isNaN(num)) {
-        parsed = num;
-      }
+import { ReactComponent } from "@webiny/icons/delete.svg";
+import { ReactComponent as add_svg_ReactComponent } from "@webiny/icons/add.svg";
+import { VALUE_HIDDEN_OPERATORS, getOperatorOptions } from "@webiny/app-headless-cms-common/Fields/operatorOptions.js";
+const DEFAULT_ACTION_OPTIONS = [
+    {
+        value: "hide",
+        label: "Hide"
+    },
+    {
+        value: "disable",
+        label: "Disable"
     }
-
-    // Auto-parse booleans
-    if (selectedFieldOption?.fieldType === "boolean") {
-      if (parsed === "true") {
-        parsed = true;
-      } else if (parsed === "false") {
-        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]);
-
-  // For boolean fields, show a dropdown for value
-  const isBooleanField = selectedFieldOption?.fieldType === "boolean";
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Separator, {
-    className: index === 0 ? "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: rule.value != null ? 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(DeleteIcon, null),
-    onClick: () => onRemove(index),
-    variant: "ghost"
-  }))));
+];
+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"
+    }))));
 };
-export const RulesEditor = ({
-  fieldOptions,
-  actionOptions = DEFAULT_ACTION_OPTIONS
-}) => {
-  const bind = useBind({
-    name: "rules"
-  });
-  const allRules = bind.value || [];
-  const entryRules = allRules.filter(r => r.type === "condition");
-  const otherRules = allRules.filter(r => r.type !== "condition");
-  const addRule = () => {
-    const newRule = {
-      type: "condition",
-      target: "",
-      operator: "",
-      value: null,
-      action: actionOptions[0]?.value ?? "hide"
+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)
+        ]);
     };
-    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(AddIcon, null),
-    size: "sm"
-  }))));
+    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

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useMemo","Grid","Select","Input","Button","Separator","useBind","ReactComponent","DeleteIcon","AddIcon","getOperatorOptions","VALUE_HIDDEN_OPERATORS","DEFAULT_ACTION_OPTIONS","value","label","RuleRow","rule","index","fieldOptions","actionOptions","onChange","onRemove","selectedFieldOption","find","o","target","operatorOptions","fieldType","operatorSelectOptions","map","fieldSelectOptions","showValue","operator","has","handleFieldChange","newTarget","newFieldOption","newOps","currentOpValid","some","handleOperatorChange","op","handleValueChange","parsed","num","Number","isNaN","handleActionChange","action","isBooleanField","createElement","Fragment","className","variant","labelPosition","Column","span","displayResetAction","options","disabled","String","type","containerClassName","text","icon","onClick","RulesEditor","bind","name","allRules","entryRules","filter","r","otherRules","addRule","newRule","updateRule","updated","next","removeRule","_","i","key","length","size"],"sources":["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 \"@webiny/app-headless-cms-common/Fields/fieldOptions.js\";\nimport {\n    getOperatorOptions,\n    VALUE_HIDDEN_OPERATORS\n} from \"@webiny/app-headless-cms-common/Fields/operatorOptions.js\";\nimport type { Operator } from \"@webiny/app-headless-cms-common/Fields/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"],"mappings":"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","ignoreList":[]}
+{"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 \"@webiny/app-headless-cms-common/Fields/fieldOptions.js\";\nimport {\n    getOperatorOptions,\n    VALUE_HIDDEN_OPERATORS\n} from \"@webiny/app-headless-cms-common/Fields/operatorOptions.js\";\nimport type { Operator } from \"@webiny/app-headless-cms-common/Fields/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.js

@@ -1,3 +1 @@
 export { RulesEditor } from "./RulesEditor.js";
-
-//# sourceMappingURL=index.js.map

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

@@ -1,31 +1,28 @@
-import React from "react";
+import react from "react";
 import { ValidationsSection } from "./ValidationsSection.js";
 import { getFieldValidators, getListValidators } from "../getValidators.js";
 import { useModelField } from "../../../ModelFieldProvider/index.js";
 import { ValidatorsList } from "./ValidatorsList.js";
-export const ValidationTab = ({
-  field
-}) => {
-  const {
-    fieldPlugin
-  } = useModelField();
-  const individualValidation = getFieldValidators(field, fieldPlugin);
-  const hasValidators = individualValidation.validators.length > 0;
-  const listValidation = getListValidators(field, fieldPlugin);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, field.list ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ValidationsSection, {
-    validators: listValidation.validators,
-    fieldKey: "listValidators",
-    title: listValidation.title || "List validators",
-    description: listValidation.description || "These validators are applied to the entire list of values."
-  }), hasValidators ? /*#__PURE__*/React.createElement(ValidationsSection, {
-    fieldKey: "validators",
-    validators: individualValidation.validators,
-    title: individualValidation.title || "Individual value validators",
-    description: individualValidation.description || "These validators are applied to each value in the list."
-  }) : null) : null, !field.list && hasValidators ? /*#__PURE__*/React.createElement(ValidatorsList, {
-    name: "validation",
-    validators: individualValidation.validators
-  }) : null);
+const ValidationTab = ({ field })=>{
+    const { fieldPlugin } = useModelField();
+    const individualValidation = getFieldValidators(field, fieldPlugin);
+    const hasValidators = individualValidation.validators.length > 0;
+    const listValidation = getListValidators(field, fieldPlugin);
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, field.list ? /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(ValidationsSection, {
+        validators: listValidation.validators,
+        fieldKey: "listValidators",
+        title: listValidation.title || "List validators",
+        description: listValidation.description || "These validators are applied to the entire list of values."
+    }), hasValidators ? /*#__PURE__*/ react.createElement(ValidationsSection, {
+        fieldKey: "validators",
+        validators: individualValidation.validators,
+        title: individualValidation.title || "Individual value validators",
+        description: individualValidation.description || "These validators are applied to each value in the list."
+    }) : null) : null, !field.list && hasValidators ? /*#__PURE__*/ react.createElement(ValidatorsList, {
+        name: "validation",
+        validators: individualValidation.validators
+    }) : null);
 };
+export { ValidationTab };
 
 //# sourceMappingURL=ValidationTab.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","ValidationsSection","getFieldValidators","getListValidators","useModelField","ValidatorsList","ValidationTab","field","fieldPlugin","individualValidation","hasValidators","validators","length","listValidation","createElement","Fragment","list","fieldKey","title","description","name"],"sources":["ValidationTab.tsx"],"sourcesContent":["import React from \"react\";\nimport { ValidationsSection } from \"~/admin/components/FieldEditor/EditFieldDialog/ValidationTab/ValidationsSection.js\";\nimport {\n    getFieldValidators,\n    getListValidators\n} from \"~/admin/components/FieldEditor/EditFieldDialog/getValidators.js\";\nimport { useModelField } from \"~/admin/components/ModelFieldProvider/index.js\";\nimport { ValidatorsList } from \"~/admin/components/FieldEditor/EditFieldDialog/ValidationTab/ValidatorsList.js\";\nimport type { CmsModelField } from \"@webiny/app-headless-cms-common/types/index.js\";\n\ninterface ValidationTabProps {\n    field: CmsModelField;\n}\n\nexport const ValidationTab = ({ field }: ValidationTabProps) => {\n    const { fieldPlugin } = useModelField();\n\n    const individualValidation = getFieldValidators(field, fieldPlugin);\n    const hasValidators = individualValidation.validators.length > 0;\n    const listValidation = getListValidators(field, fieldPlugin);\n\n    return (\n        <>\n            {field.list ? (\n                <>\n                    <ValidationsSection\n                        validators={listValidation.validators}\n                        fieldKey={\"listValidators\"}\n                        title={listValidation.title || \"List validators\"}\n                        description={\n                            listValidation.description ||\n                            \"These validators are applied to the entire list of values.\"\n                        }\n                    />\n\n                    {hasValidators ? (\n                        <ValidationsSection\n                            fieldKey={\"validators\"}\n                            validators={individualValidation.validators}\n                            title={individualValidation.title || \"Individual value validators\"}\n                            description={\n                                individualValidation.description ||\n                                \"These validators are applied to each value in the list.\"\n                            }\n                        />\n                    ) : null}\n                </>\n            ) : null}\n\n            {!field.list && hasValidators ? (\n                <ValidatorsList name={\"validation\"} validators={individualValidation.validators} />\n            ) : null}\n        </>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,kBAAkB;AAC3B,SACIC,kBAAkB,EAClBC,iBAAiB;AAErB,SAASC,aAAa;AACtB,SAASC,cAAc;AAOvB,OAAO,MAAMC,aAAa,GAAGA,CAAC;EAAEC;AAA0B,CAAC,KAAK;EAC5D,MAAM;IAAEC;EAAY,CAAC,GAAGJ,aAAa,CAAC,CAAC;EAEvC,MAAMK,oBAAoB,GAAGP,kBAAkB,CAACK,KAAK,EAAEC,WAAW,CAAC;EACnE,MAAME,aAAa,GAAGD,oBAAoB,CAACE,UAAU,CAACC,MAAM,GAAG,CAAC;EAChE,MAAMC,cAAc,GAAGV,iBAAiB,CAACI,KAAK,EAAEC,WAAW,CAAC;EAE5D,oBACIR,KAAA,CAAAc,aAAA,CAAAd,KAAA,CAAAe,QAAA,QACKR,KAAK,CAACS,IAAI,gBACPhB,KAAA,CAAAc,aAAA,CAAAd,KAAA,CAAAe,QAAA,qBACIf,KAAA,CAAAc,aAAA,CAACb,kBAAkB;IACfU,UAAU,EAAEE,cAAc,CAACF,UAAW;IACtCM,QAAQ,EAAE,gBAAiB;IAC3BC,KAAK,EAAEL,cAAc,CAACK,KAAK,IAAI,iBAAkB;IACjDC,WAAW,EACPN,cAAc,CAACM,WAAW,IAC1B;EACH,CACJ,CAAC,EAEDT,aAAa,gBACVV,KAAA,CAAAc,aAAA,CAACb,kBAAkB;IACfgB,QAAQ,EAAE,YAAa;IACvBN,UAAU,EAAEF,oBAAoB,CAACE,UAAW;IAC5CO,KAAK,EAAET,oBAAoB,CAACS,KAAK,IAAI,6BAA8B;IACnEC,WAAW,EACPV,oBAAoB,CAACU,WAAW,IAChC;EACH,CACJ,CAAC,GACF,IACN,CAAC,GACH,IAAI,EAEP,CAACZ,KAAK,CAACS,IAAI,IAAIN,aAAa,gBACzBV,KAAA,CAAAc,aAAA,CAACT,cAAc;IAACe,IAAI,EAAE,YAAa;IAACT,UAAU,EAAEF,oBAAoB,CAACE;EAAW,CAAE,CAAC,GACnF,IACN,CAAC;AAEX,CAAC","ignoreList":[]}
+{"version":3,"file":"admin/components/FieldEditor/EditFieldDialog/ValidationTab/ValidationTab.js","sources":["../../../../../../src/admin/components/FieldEditor/EditFieldDialog/ValidationTab/ValidationTab.tsx"],"sourcesContent":["import React from \"react\";\nimport { ValidationsSection } from \"~/admin/components/FieldEditor/EditFieldDialog/ValidationTab/ValidationsSection.js\";\nimport {\n    getFieldValidators,\n    getListValidators\n} from \"~/admin/components/FieldEditor/EditFieldDialog/getValidators.js\";\nimport { useModelField } from \"~/admin/components/ModelFieldProvider/index.js\";\nimport { ValidatorsList } from \"~/admin/components/FieldEditor/EditFieldDialog/ValidationTab/ValidatorsList.js\";\nimport type { CmsModelField } from \"@webiny/app-headless-cms-common/types/index.js\";\n\ninterface ValidationTabProps {\n    field: CmsModelField;\n}\n\nexport const ValidationTab = ({ field }: ValidationTabProps) => {\n    const { fieldPlugin } = useModelField();\n\n    const individualValidation = getFieldValidators(field, fieldPlugin);\n    const hasValidators = individualValidation.validators.length > 0;\n    const listValidation = getListValidators(field, fieldPlugin);\n\n    return (\n        <>\n            {field.list ? (\n                <>\n                    <ValidationsSection\n                        validators={listValidation.validators}\n                        fieldKey={\"listValidators\"}\n                        title={listValidation.title || \"List validators\"}\n                        description={\n                            listValidation.description ||\n                            \"These validators are applied to the entire list of values.\"\n                        }\n                    />\n\n                    {hasValidators ? (\n                        <ValidationsSection\n                            fieldKey={\"validators\"}\n                            validators={individualValidation.validators}\n                            title={individualValidation.title || \"Individual value validators\"}\n                            description={\n                                individualValidation.description ||\n                                \"These validators are applied to each value in the list.\"\n                            }\n                        />\n                    ) : null}\n                </>\n            ) : null}\n\n            {!field.list && hasValidators ? (\n                <ValidatorsList name={\"validation\"} validators={individualValidation.validators} />\n            ) : null}\n        </>\n    );\n};\n"],"names":["ValidationTab","field","fieldPlugin","useModelField","individualValidation","getFieldValidators","hasValidators","listValidation","getListValidators","ValidationsSection","ValidatorsList"],"mappings":";;;;;AAcO,MAAMA,gBAAgB,CAAC,EAAEC,KAAK,EAAsB;IACvD,MAAM,EAAEC,WAAW,EAAE,GAAGC;IAExB,MAAMC,uBAAuBC,mBAAmBJ,OAAOC;IACvD,MAAMI,gBAAgBF,qBAAqB,UAAU,CAAC,MAAM,GAAG;IAC/D,MAAMG,iBAAiBC,kBAAkBP,OAAOC;IAEhD,OAAO,WAAP,GACI,0CACKD,MAAM,IAAI,GAAG,WAAH,GACP,wDACI,oBAACQ,oBAAkBA;QACf,YAAYF,eAAe,UAAU;QACrC,UAAU;QACV,OAAOA,eAAe,KAAK,IAAI;QAC/B,aACIA,eAAe,WAAW,IAC1B;QAIPD,gBAAgB,WAAhBA,GACG,oBAACG,oBAAkBA;QACf,UAAU;QACV,YAAYL,qBAAqB,UAAU;QAC3C,OAAOA,qBAAqB,KAAK,IAAI;QACrC,aACIA,qBAAqB,WAAW,IAChC;SAGR,QAER,MAEH,CAACH,MAAM,IAAI,IAAIK,gBAAgB,WAAhBA,GACZ,oBAACI,gBAAcA;QAAC,MAAM;QAAc,YAAYN,qBAAqB,UAAU;SAC/E;AAGhB"}