@servicetitan/dte-unlayer 0.111.0 → 0.112.0

package/dist/display-conditions/ConditionGroup.d.ts

@@ -1,12 +1,9 @@
 import { ConditionGroup as ConditionGroupType } from './types';
 import type { DataPointOption } from './types';
 export interface ConditionGroupProps {
-    canDelete: boolean;
     dataPointOptions: DataPointOption[];
     group: ConditionGroupType;
-    onDelete: () => void;
     onUpdate: (g: ConditionGroupType) => void;
-    ruleIndex: number;
 }
-export declare function ConditionGroup({ canDelete, dataPointOptions, group, onDelete, onUpdate, ruleIndex, }: Readonly<ConditionGroupProps>): import("react/jsx-runtime").JSX.Element;
+export declare function ConditionGroup({ dataPointOptions, group, onUpdate, }: Readonly<ConditionGroupProps>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ConditionGroup.d.ts.map

package/dist/display-conditions/ConditionGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConditionGroup.d.ts","sourceRoot":"","sources":["../../src/display-conditions/ConditionGroup.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,IAAI,kBAAkB,EAAoC,MAAM,SAAS,CAAC;AACjG,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,MAAM,WAAW,mBAAmB;IAChC,SAAS,EAAE,OAAO,CAAC;IACnB,gBAAgB,EAAE,eAAe,EAAE,CAAC;IACpC,KAAK,EAAE,kBAAkB,CAAC;IAC1B,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,CAAC,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC1C,SAAS,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,cAAc,CAAC,EAC3B,SAAS,EACT,gBAAgB,EAChB,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,SAAS,GACZ,EAAE,QAAQ,CAAC,mBAAmB,CAAC,2CAuH/B"}
+{"version":3,"file":"ConditionGroup.d.ts","sourceRoot":"","sources":["../../src/display-conditions/ConditionGroup.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,cAAc,IAAI,kBAAkB,EAAmB,MAAM,SAAS,CAAC;AAChF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,MAAM,WAAW,mBAAmB;IAChC,gBAAgB,EAAE,eAAe,EAAE,CAAC;IACpC,KAAK,EAAE,kBAAkB,CAAC;IAC1B,QAAQ,EAAE,CAAC,CAAC,EAAE,kBAAkB,KAAK,IAAI,CAAC;CAC7C;AAED,wBAAgB,cAAc,CAAC,EAC3B,gBAAgB,EAChB,KAAK,EACL,QAAQ,GACX,EAAE,QAAQ,CAAC,mBAAmB,CAAC,2CA+D/B"}

package/dist/display-conditions/ConditionGroup.js

@@ -1,11 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Flex, SegmentedControl, Text } from '@servicetitan/anvil2';
+import { Button, Flex } from '@servicetitan/anvil2';
 import PlusIcon from '@servicetitan/anvil2/assets/icons/material/round/add.svg';
-import TrashIcon from '@servicetitan/anvil2/assets/icons/material/round/delete.svg';
 import { useCallback } from 'react';
 import { ConditionRow } from './ConditionRow';
 import { defaultCondition } from './constants';
-export function ConditionGroup({ canDelete, dataPointOptions, group, onDelete, onUpdate, ruleIndex }) {
+export function ConditionGroup({ dataPointOptions, group, onUpdate }) {
     const addCondition = useCallback(()=>{
         const newCondition = {
             ...defaultCondition(),
@@ -37,9 +36,8 @@ export function ConditionGroup({ canDelete, dataPointOptions, group, onDelete, o
     ]);
     const removeCondition = useCallback((index)=>{
         let next = group.conditions.filter((_, i)=>i !== index);
-        // If we removed the first condition, clear logicalOperator on the new first
         if (index === 0 && next.length > 0) {
-            const { logicalOperator: unusedOp, ...rest } = next[0];
+            const { logicalOperator: _unusedOp, ...rest } = next[0];
             next = [
                 rest,
                 ...next.slice(1)
@@ -55,126 +53,51 @@ export function ConditionGroup({ canDelete, dataPointOptions, group, onDelete, o
         group,
         onUpdate
     ]);
-    const handleLogicalOperatorChange = useCallback((conditionIndex, value)=>{
-        const next = [
-            ...group.conditions
-        ];
-        next[conditionIndex] = {
-            ...next[conditionIndex],
-            logicalOperator: value
-        };
-        onUpdate({
-            ...group,
-            conditions: next
-        });
-    }, [
-        group,
-        onUpdate
-    ]);
-    return /*#__PURE__*/ _jsxs(Flex, {
+    return /*#__PURE__*/ _jsx(Flex, {
         direction: "column",
         gap: "2",
         style: {
             width: '100%'
         },
-        children: [
-            /*#__PURE__*/ _jsxs(Flex, {
-                direction: "row",
-                alignItems: "center",
-                justifyContent: "space-between",
-                style: {
-                    width: '100%'
-                },
-                children: [
-                    /*#__PURE__*/ _jsxs(Text, {
-                        size: "medium",
-                        variant: "body",
+        children: /*#__PURE__*/ _jsxs(Flex, {
+            direction: "column",
+            gap: "3",
+            style: {
+                width: '100%'
+            },
+            children: [
+                group.conditions.map((c, i)=>/*#__PURE__*/ _jsx(Flex, {
+                        direction: "column",
+                        gap: "3",
                         style: {
-                            fontWeight: 'bold'
+                            padding: '8px 0'
                         },
-                        children: [
-                            "Rule ",
-                            ruleIndex + 1
-                        ]
-                    }),
-                    canDelete && /*#__PURE__*/ _jsx(Button, {
-                        appearance: "ghost",
-                        "aria-label": "Delete rule",
+                        children: /*#__PURE__*/ _jsx(ConditionRow, {
+                            canRemove: true,
+                            condition: c,
+                            dataPointOptions: dataPointOptions,
+                            onChange: (next)=>updateCondition(i, next),
+                            onRemove: ()=>removeCondition(i)
+                        })
+                    }, c.id)),
+                /*#__PURE__*/ _jsx(Flex, {
+                    justifyContent: "center",
+                    style: {
+                        paddingTop: 8,
+                        width: '100%'
+                    },
+                    children: /*#__PURE__*/ _jsx(Button, {
+                        appearance: "secondary",
                         icon: {
-                            before: TrashIcon
+                            before: PlusIcon
                         },
-                        size: "large",
-                        onClick: onDelete
+                        size: "small",
+                        onClick: addCondition,
+                        children: "Add Condition"
                     })
-                ]
-            }),
-            /*#__PURE__*/ _jsxs(Flex, {
-                direction: "column",
-                gap: "3",
-                style: {
-                    backgroundColor: '#fff',
-                    border: '1px solid #e0e0e0',
-                    borderRadius: 8,
-                    padding: 12,
-                    width: '100%'
-                },
-                children: [
-                    group.conditions.map((c, i)=>{
-                        var _c_logicalOperator;
-                        return /*#__PURE__*/ _jsxs(Flex, {
-                            direction: "column",
-                            gap: "3",
-                            style: {
-                                padding: '8px 0'
-                            },
-                            children: [
-                                i > 0 && /*#__PURE__*/ _jsx(Flex, {
-                                    justifyContent: "center",
-                                    alignItems: "center",
-                                    gap: "2",
-                                    children: /*#__PURE__*/ _jsxs(SegmentedControl, {
-                                        selected: (_c_logicalOperator = c.logicalOperator) !== null && _c_logicalOperator !== void 0 ? _c_logicalOperator : 'and',
-                                        onChange: (v)=>handleLogicalOperatorChange(i, v),
-                                        children: [
-                                            /*#__PURE__*/ _jsx(SegmentedControl.Segment, {
-                                                value: "and",
-                                                children: "And"
-                                            }),
-                                            /*#__PURE__*/ _jsx(SegmentedControl.Segment, {
-                                                value: "or",
-                                                children: "Or"
-                                            })
-                                        ]
-                                    })
-                                }),
-                                /*#__PURE__*/ _jsx(ConditionRow, {
-                                    canRemove: true,
-                                    condition: c,
-                                    dataPointOptions: dataPointOptions,
-                                    onChange: (next)=>updateCondition(i, next),
-                                    onRemove: ()=>removeCondition(i)
-                                })
-                            ]
-                        }, c.id);
-                    }),
-                    /*#__PURE__*/ _jsx(Flex, {
-                        justifyContent: "center",
-                        style: {
-                            paddingTop: 8,
-                            width: '100%'
-                        },
-                        children: /*#__PURE__*/ _jsx(Button, {
-                            appearance: "secondary",
-                            icon: {
-                                before: PlusIcon
-                            },
-                            onClick: addCondition,
-                            children: "Add Condition"
-                        })
-                    })
-                ]
-            })
-        ]
+                })
+            ]
+        })
     });
 }
 

package/dist/display-conditions/ConditionGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/display-conditions/ConditionGroup.tsx"],"sourcesContent":["import { Button, Flex, SegmentedControl, Text } from '@servicetitan/anvil2';\nimport PlusIcon from '@servicetitan/anvil2/assets/icons/material/round/add.svg';\nimport TrashIcon from '@servicetitan/anvil2/assets/icons/material/round/delete.svg';\nimport { useCallback } from 'react';\nimport { ConditionRow } from './ConditionRow';\nimport { defaultCondition } from './constants';\nimport { ConditionGroup as ConditionGroupType, LogicalOperator, SingleCondition } from './types';\nimport type { DataPointOption } from './types';\n\nexport interface ConditionGroupProps {\n    canDelete: boolean;\n    dataPointOptions: DataPointOption[];\n    group: ConditionGroupType;\n    onDelete: () => void;\n    onUpdate: (g: ConditionGroupType) => void;\n    ruleIndex: number;\n}\n\nexport function ConditionGroup({\n    canDelete,\n    dataPointOptions,\n    group,\n    onDelete,\n    onUpdate,\n    ruleIndex,\n}: Readonly<ConditionGroupProps>) {\n    const addCondition = useCallback(() => {\n        const newCondition: SingleCondition = {\n            ...defaultCondition(),\n            logicalOperator: 'and',\n        };\n        onUpdate({\n            ...group,\n            conditions: [...group.conditions, newCondition],\n        });\n    }, [group, onUpdate]);\n\n    const updateCondition = useCallback(\n        (index: number, c: SingleCondition) => {\n            const next = [...group.conditions];\n            next[index] = c;\n            onUpdate({ ...group, conditions: next });\n        },\n        [group, onUpdate],\n    );\n\n    const removeCondition = useCallback(\n        (index: number) => {\n            let next = group.conditions.filter((_, i) => i !== index);\n            // If we removed the first condition, clear logicalOperator on the new first\n            if (index === 0 && next.length > 0) {\n                const { logicalOperator: unusedOp, ...rest } = next[0];\n                next = [rest as SingleCondition, ...next.slice(1)];\n            }\n            onUpdate({\n                ...group,\n                conditions: next.length ? next : [defaultCondition()],\n            });\n        },\n        [group, onUpdate],\n    );\n\n    const handleLogicalOperatorChange = useCallback(\n        (conditionIndex: number, value: string) => {\n            const next = [...group.conditions];\n            next[conditionIndex] = {\n                ...next[conditionIndex],\n                logicalOperator: value as LogicalOperator,\n            };\n            onUpdate({ ...group, conditions: next });\n        },\n        [group, onUpdate],\n    );\n\n    return (\n        <Flex direction=\"column\" gap=\"2\" style={{ width: '100%' }}>\n            <Flex\n                direction=\"row\"\n                alignItems=\"center\"\n                justifyContent=\"space-between\"\n                style={{ width: '100%' }}\n            >\n                <Text size=\"medium\" variant=\"body\" style={{ fontWeight: 'bold' }}>\n                    Rule {ruleIndex + 1}\n                </Text>\n                {canDelete && (\n                    <Button\n                        appearance=\"ghost\"\n                        aria-label=\"Delete rule\"\n                        icon={{ before: TrashIcon }}\n                        size=\"large\"\n                        onClick={onDelete}\n                    />\n                )}\n            </Flex>\n            <Flex\n                direction=\"column\"\n                gap=\"3\"\n                style={{\n                    backgroundColor: '#fff',\n                    border: '1px solid #e0e0e0',\n                    borderRadius: 8,\n                    padding: 12,\n                    width: '100%',\n                }}\n            >\n                {group.conditions.map((c, i) => (\n                    <Flex key={c.id} direction=\"column\" gap=\"3\" style={{ padding: '8px 0' }}>\n                        {i > 0 && (\n                            <Flex justifyContent=\"center\" alignItems=\"center\" gap=\"2\">\n                                <SegmentedControl\n                                    selected={c.logicalOperator ?? 'and'}\n                                    onChange={(v: string) => handleLogicalOperatorChange(i, v)}\n                                >\n                                    <SegmentedControl.Segment value=\"and\">\n                                        And\n                                    </SegmentedControl.Segment>\n                                    <SegmentedControl.Segment value=\"or\">\n                                        Or\n                                    </SegmentedControl.Segment>\n                                </SegmentedControl>\n                            </Flex>\n                        )}\n                        <ConditionRow\n                            canRemove\n                            condition={c}\n                            dataPointOptions={dataPointOptions}\n                            onChange={next => updateCondition(i, next)}\n                            onRemove={() => removeCondition(i)}\n                        />\n                    </Flex>\n                ))}\n                <Flex justifyContent=\"center\" style={{ paddingTop: 8, width: '100%' }}>\n                    <Button\n                        appearance=\"secondary\"\n                        icon={{ before: PlusIcon }}\n                        onClick={addCondition}\n                    >\n                        Add Condition\n                    </Button>\n                </Flex>\n            </Flex>\n        </Flex>\n    );\n}\n"],"names":["Button","Flex","SegmentedControl","Text","PlusIcon","TrashIcon","useCallback","ConditionRow","defaultCondition","ConditionGroup","canDelete","dataPointOptions","group","onDelete","onUpdate","ruleIndex","addCondition","newCondition","logicalOperator","conditions","updateCondition","index","c","next","removeCondition","filter","_","i","length","unusedOp","rest","slice","handleLogicalOperatorChange","conditionIndex","value","direction","gap","style","width","alignItems","justifyContent","size","variant","fontWeight","appearance","aria-label","icon","before","onClick","backgroundColor","border","borderRadius","padding","map","selected","onChange","v","Segment","canRemove","condition","onRemove","id","paddingTop"],"mappings":";AAAA,SAASA,MAAM,EAAEC,IAAI,EAAEC,gBAAgB,EAAEC,IAAI,QAAQ,uBAAuB;AAC5E,OAAOC,cAAc,2DAA2D;AAChF,OAAOC,eAAe,8DAA8D;AACpF,SAASC,WAAW,QAAQ,QAAQ;AACpC,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,gBAAgB,QAAQ,cAAc;AAa/C,OAAO,SAASC,eAAe,EAC3BC,SAAS,EACTC,gBAAgB,EAChBC,KAAK,EACLC,QAAQ,EACRC,QAAQ,EACRC,SAAS,EACmB;IAC5B,MAAMC,eAAeV,YAAY;QAC7B,MAAMW,eAAgC;YAClC,GAAGT,kBAAkB;YACrBU,iBAAiB;QACrB;QACAJ,SAAS;YACL,GAAGF,KAAK;YACRO,YAAY;mBAAIP,MAAMO,UAAU;gBAAEF;aAAa;QACnD;IACJ,GAAG;QAACL;QAAOE;KAAS;IAEpB,MAAMM,kBAAkBd,YACpB,CAACe,OAAeC;QACZ,MAAMC,OAAO;eAAIX,MAAMO,UAAU;SAAC;QAClCI,IAAI,CAACF,MAAM,GAAGC;QACdR,SAAS;YAAE,GAAGF,KAAK;YAAEO,YAAYI;QAAK;IAC1C,GACA;QAACX;QAAOE;KAAS;IAGrB,MAAMU,kBAAkBlB,YACpB,CAACe;QACG,IAAIE,OAAOX,MAAMO,UAAU,CAACM,MAAM,CAAC,CAACC,GAAGC,IAAMA,MAAMN;QACnD,4EAA4E;QAC5E,IAAIA,UAAU,KAAKE,KAAKK,MAAM,GAAG,GAAG;YAChC,MAAM,EAAEV,iBAAiBW,QAAQ,EAAE,GAAGC,MAAM,GAAGP,IAAI,CAAC,EAAE;YACtDA,OAAO;gBAACO;mBAA4BP,KAAKQ,KAAK,CAAC;aAAG;QACtD;QACAjB,SAAS;YACL,GAAGF,KAAK;YACRO,YAAYI,KAAKK,MAAM,GAAGL,OAAO;gBAACf;aAAmB;QACzD;IACJ,GACA;QAACI;QAAOE;KAAS;IAGrB,MAAMkB,8BAA8B1B,YAChC,CAAC2B,gBAAwBC;QACrB,MAAMX,OAAO;eAAIX,MAAMO,UAAU;SAAC;QAClCI,IAAI,CAACU,eAAe,GAAG;YACnB,GAAGV,IAAI,CAACU,eAAe;YACvBf,iBAAiBgB;QACrB;QACApB,SAAS;YAAE,GAAGF,KAAK;YAAEO,YAAYI;QAAK;IAC1C,GACA;QAACX;QAAOE;KAAS;IAGrB,qBACI,MAACb;QAAKkC,WAAU;QAASC,KAAI;QAAIC,OAAO;YAAEC,OAAO;QAAO;;0BACpD,MAACrC;gBACGkC,WAAU;gBACVI,YAAW;gBACXC,gBAAe;gBACfH,OAAO;oBAAEC,OAAO;gBAAO;;kCAEvB,MAACnC;wBAAKsC,MAAK;wBAASC,SAAQ;wBAAOL,OAAO;4BAAEM,YAAY;wBAAO;;4BAAG;4BACxD5B,YAAY;;;oBAErBL,2BACG,KAACV;wBACG4C,YAAW;wBACXC,cAAW;wBACXC,MAAM;4BAAEC,QAAQ1C;wBAAU;wBAC1BoC,MAAK;wBACLO,SAASnC;;;;0BAIrB,MAACZ;gBACGkC,WAAU;gBACVC,KAAI;gBACJC,OAAO;oBACHY,iBAAiB;oBACjBC,QAAQ;oBACRC,cAAc;oBACdC,SAAS;oBACTd,OAAO;gBACX;;oBAEC1B,MAAMO,UAAU,CAACkC,GAAG,CAAC,CAAC/B,GAAGK;4BAKIL;6CAJ1B,MAACrB;4BAAgBkC,WAAU;4BAASC,KAAI;4BAAIC,OAAO;gCAAEe,SAAS;4BAAQ;;gCACjEzB,IAAI,mBACD,KAAC1B;oCAAKuC,gBAAe;oCAASD,YAAW;oCAASH,KAAI;8CAClD,cAAA,MAAClC;wCACGoD,UAAUhC,CAAAA,qBAAAA,EAAEJ,eAAe,cAAjBI,gCAAAA,qBAAqB;wCAC/BiC,UAAU,CAACC,IAAcxB,4BAA4BL,GAAG6B;;0DAExD,KAACtD,iBAAiBuD,OAAO;gDAACvB,OAAM;0DAAM;;0DAGtC,KAAChC,iBAAiBuD,OAAO;gDAACvB,OAAM;0DAAK;;;;;8CAMjD,KAAC3B;oCACGmD,SAAS;oCACTC,WAAWrC;oCACXX,kBAAkBA;oCAClB4C,UAAUhC,CAAAA,OAAQH,gBAAgBO,GAAGJ;oCACrCqC,UAAU,IAAMpC,gBAAgBG;;;2BArB7BL,EAAEuC,EAAE;;kCAyBnB,KAAC5D;wBAAKuC,gBAAe;wBAASH,OAAO;4BAAEyB,YAAY;4BAAGxB,OAAO;wBAAO;kCAChE,cAAA,KAACtC;4BACG4C,YAAW;4BACXE,MAAM;gCAAEC,QAAQ3C;4BAAS;4BACzB4C,SAAShC;sCACZ;;;;;;;AAOrB"}
+{"version":3,"sources":["../../src/display-conditions/ConditionGroup.tsx"],"sourcesContent":["import { Button, Flex } from '@servicetitan/anvil2';\nimport PlusIcon from '@servicetitan/anvil2/assets/icons/material/round/add.svg';\nimport { useCallback } from 'react';\nimport { ConditionRow } from './ConditionRow';\nimport { defaultCondition } from './constants';\nimport { ConditionGroup as ConditionGroupType, SingleCondition } from './types';\nimport type { DataPointOption } from './types';\n\nexport interface ConditionGroupProps {\n    dataPointOptions: DataPointOption[];\n    group: ConditionGroupType;\n    onUpdate: (g: ConditionGroupType) => void;\n}\n\nexport function ConditionGroup({\n    dataPointOptions,\n    group,\n    onUpdate,\n}: Readonly<ConditionGroupProps>) {\n    const addCondition = useCallback(() => {\n        const newCondition: SingleCondition = {\n            ...defaultCondition(),\n            logicalOperator: 'and',\n        };\n        onUpdate({\n            ...group,\n            conditions: [...group.conditions, newCondition],\n        });\n    }, [group, onUpdate]);\n\n    const updateCondition = useCallback(\n        (index: number, c: SingleCondition) => {\n            const next = [...group.conditions];\n            next[index] = c;\n            onUpdate({ ...group, conditions: next });\n        },\n        [group, onUpdate],\n    );\n\n    const removeCondition = useCallback(\n        (index: number) => {\n            let next = group.conditions.filter((_, i) => i !== index);\n            if (index === 0 && next.length > 0) {\n                const { logicalOperator: _unusedOp, ...rest } = next[0];\n                next = [rest as SingleCondition, ...next.slice(1)];\n            }\n            onUpdate({\n                ...group,\n                conditions: next.length ? next : [defaultCondition()],\n            });\n        },\n        [group, onUpdate],\n    );\n\n    return (\n        <Flex direction=\"column\" gap=\"2\" style={{ width: '100%' }}>\n            <Flex direction=\"column\" gap=\"3\" style={{ width: '100%' }}>\n                {group.conditions.map((c, i) => (\n                    <Flex key={c.id} direction=\"column\" gap=\"3\" style={{ padding: '8px 0' }}>\n                        <ConditionRow\n                            canRemove\n                            condition={c}\n                            dataPointOptions={dataPointOptions}\n                            onChange={next => updateCondition(i, next)}\n                            onRemove={() => removeCondition(i)}\n                        />\n                    </Flex>\n                ))}\n                <Flex justifyContent=\"center\" style={{ paddingTop: 8, width: '100%' }}>\n                    <Button\n                        appearance=\"secondary\"\n                        icon={{ before: PlusIcon }}\n                        size=\"small\"\n                        onClick={addCondition}\n                    >\n                        Add Condition\n                    </Button>\n                </Flex>\n            </Flex>\n        </Flex>\n    );\n}\n"],"names":["Button","Flex","PlusIcon","useCallback","ConditionRow","defaultCondition","ConditionGroup","dataPointOptions","group","onUpdate","addCondition","newCondition","logicalOperator","conditions","updateCondition","index","c","next","removeCondition","filter","_","i","length","_unusedOp","rest","slice","direction","gap","style","width","map","padding","canRemove","condition","onChange","onRemove","id","justifyContent","paddingTop","appearance","icon","before","size","onClick"],"mappings":";AAAA,SAASA,MAAM,EAAEC,IAAI,QAAQ,uBAAuB;AACpD,OAAOC,cAAc,2DAA2D;AAChF,SAASC,WAAW,QAAQ,QAAQ;AACpC,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,gBAAgB,QAAQ,cAAc;AAU/C,OAAO,SAASC,eAAe,EAC3BC,gBAAgB,EAChBC,KAAK,EACLC,QAAQ,EACoB;IAC5B,MAAMC,eAAeP,YAAY;QAC7B,MAAMQ,eAAgC;YAClC,GAAGN,kBAAkB;YACrBO,iBAAiB;QACrB;QACAH,SAAS;YACL,GAAGD,KAAK;YACRK,YAAY;mBAAIL,MAAMK,UAAU;gBAAEF;aAAa;QACnD;IACJ,GAAG;QAACH;QAAOC;KAAS;IAEpB,MAAMK,kBAAkBX,YACpB,CAACY,OAAeC;QACZ,MAAMC,OAAO;eAAIT,MAAMK,UAAU;SAAC;QAClCI,IAAI,CAACF,MAAM,GAAGC;QACdP,SAAS;YAAE,GAAGD,KAAK;YAAEK,YAAYI;QAAK;IAC1C,GACA;QAACT;QAAOC;KAAS;IAGrB,MAAMS,kBAAkBf,YACpB,CAACY;QACG,IAAIE,OAAOT,MAAMK,UAAU,CAACM,MAAM,CAAC,CAACC,GAAGC,IAAMA,MAAMN;QACnD,IAAIA,UAAU,KAAKE,KAAKK,MAAM,GAAG,GAAG;YAChC,MAAM,EAAEV,iBAAiBW,SAAS,EAAE,GAAGC,MAAM,GAAGP,IAAI,CAAC,EAAE;YACvDA,OAAO;gBAACO;mBAA4BP,KAAKQ,KAAK,CAAC;aAAG;QACtD;QACAhB,SAAS;YACL,GAAGD,KAAK;YACRK,YAAYI,KAAKK,MAAM,GAAGL,OAAO;gBAACZ;aAAmB;QACzD;IACJ,GACA;QAACG;QAAOC;KAAS;IAGrB,qBACI,KAACR;QAAKyB,WAAU;QAASC,KAAI;QAAIC,OAAO;YAAEC,OAAO;QAAO;kBACpD,cAAA,MAAC5B;YAAKyB,WAAU;YAASC,KAAI;YAAIC,OAAO;gBAAEC,OAAO;YAAO;;gBACnDrB,MAAMK,UAAU,CAACiB,GAAG,CAAC,CAACd,GAAGK,kBACtB,KAACpB;wBAAgByB,WAAU;wBAASC,KAAI;wBAAIC,OAAO;4BAAEG,SAAS;wBAAQ;kCAClE,cAAA,KAAC3B;4BACG4B,SAAS;4BACTC,WAAWjB;4BACXT,kBAAkBA;4BAClB2B,UAAUjB,CAAAA,OAAQH,gBAAgBO,GAAGJ;4BACrCkB,UAAU,IAAMjB,gBAAgBG;;uBAN7BL,EAAEoB,EAAE;8BAUnB,KAACnC;oBAAKoC,gBAAe;oBAAST,OAAO;wBAAEU,YAAY;wBAAGT,OAAO;oBAAO;8BAChE,cAAA,KAAC7B;wBACGuC,YAAW;wBACXC,MAAM;4BAAEC,QAAQvC;wBAAS;wBACzBwC,MAAK;wBACLC,SAASjC;kCACZ;;;;;;AAOrB"}

package/dist/display-conditions/ConditionGroupsSection.d.ts

@@ -1,11 +1,14 @@
+import type { ReactNode } from 'react';
 import { ConditionGroup as ConditionGroupType } from './types';
 import type { DataPointOption } from './types';
+export type MatchType = 'all' | 'any';
 export interface ConditionGroupsSectionProps {
+    behaviorSection?: ReactNode;
     dataPointOptions: DataPointOption[];
     groups: ConditionGroupType[];
-    onAddGroup: () => void;
-    onRemoveGroup: (index: number) => void;
+    matchType: MatchType;
+    onMatchTypeChange: (matchType: MatchType) => void;
     onUpdateGroup: (index: number, group: ConditionGroupType) => void;
 }
-export declare function ConditionGroupsSection({ dataPointOptions, groups, onAddGroup, onRemoveGroup, onUpdateGroup, }: Readonly<ConditionGroupsSectionProps>): import("react/jsx-runtime").JSX.Element;
+export declare function ConditionGroupsSection({ behaviorSection, dataPointOptions, groups, matchType, onMatchTypeChange, onUpdateGroup, }: Readonly<ConditionGroupsSectionProps>): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=ConditionGroupsSection.d.ts.map

package/dist/display-conditions/ConditionGroupsSection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConditionGroupsSection.d.ts","sourceRoot":"","sources":["../../src/display-conditions/ConditionGroupsSection.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,IAAI,kBAAkB,EAAmB,MAAM,SAAS,CAAC;AAChF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,MAAM,WAAW,2BAA2B;IACxC,gBAAgB,EAAE,eAAe,EAAE,CAAC;IACpC,MAAM,EAAE,kBAAkB,EAAE,CAAC;IAC7B,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;CACrE;AAED,wBAAgB,sBAAsB,CAAC,EACnC,gBAAgB,EAChB,MAAM,EACN,UAAU,EACV,aAAa,EACb,aAAa,GAChB,EAAE,QAAQ,CAAC,2BAA2B,CAAC,2CA2CvC"}
+{"version":3,"file":"ConditionGroupsSection.d.ts","sourceRoot":"","sources":["../../src/display-conditions/ConditionGroupsSection.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,cAAc,IAAI,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC/D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,MAAM,MAAM,SAAS,GAAG,KAAK,GAAG,KAAK,CAAC;AAEtC,MAAM,WAAW,2BAA2B;IACxC,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,gBAAgB,EAAE,eAAe,EAAE,CAAC;IACpC,MAAM,EAAE,kBAAkB,EAAE,CAAC;IAC7B,SAAS,EAAE,SAAS,CAAC;IACrB,iBAAiB,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IAClD,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;CACrE;AAED,wBAAgB,sBAAsB,CAAC,EACnC,eAAe,EACf,gBAAgB,EAChB,MAAM,EACN,SAAS,EACT,iBAAiB,EACjB,aAAa,GAChB,EAAE,QAAQ,CAAC,2BAA2B,CAAC,kDAoCvC"}

package/dist/display-conditions/ConditionGroupsSection.js

@@ -1,68 +1,73 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Flex, SegmentedControl } from '@servicetitan/anvil2';
-import PlusIcon from '@servicetitan/anvil2/assets/icons/material/round/add.svg';
+import { Chip, Flex, SegmentedControl, Text } from '@servicetitan/anvil2';
 import { ConditionGroup } from './ConditionGroup';
-export function ConditionGroupsSection({ dataPointOptions, groups, onAddGroup, onRemoveGroup, onUpdateGroup }) {
+export function ConditionGroupsSection({ behaviorSection, dataPointOptions, groups, matchType, onMatchTypeChange, onUpdateGroup }) {
+    const firstGroup = groups[0];
+    if (!firstGroup) {
+        return null;
+    }
     return /*#__PURE__*/ _jsxs(Flex, {
         direction: "column",
         gap: "4",
         children: [
-            groups.map((group, index)=>{
-                var _group_logicalOperator;
-                return /*#__PURE__*/ _jsxs(Flex, {
-                    direction: "column",
-                    gap: "3",
-                    children: [
-                        index > 0 && /*#__PURE__*/ _jsx(Flex, {
-                            justifyContent: "center",
-                            alignItems: "center",
-                            gap: "2",
-                            style: {
-                                padding: '12px'
-                            },
-                            children: /*#__PURE__*/ _jsxs(SegmentedControl, {
-                                selected: (_group_logicalOperator = group.logicalOperator) !== null && _group_logicalOperator !== void 0 ? _group_logicalOperator : 'and',
-                                onChange: (value)=>onUpdateGroup(index, {
-                                        ...group,
-                                        logicalOperator: value
-                                    }),
-                                children: [
-                                    /*#__PURE__*/ _jsx(SegmentedControl.Segment, {
-                                        value: "and",
-                                        children: "And"
-                                    }),
-                                    /*#__PURE__*/ _jsx(SegmentedControl.Segment, {
-                                        value: "or",
-                                        children: "Or"
-                                    })
-                                ]
-                            })
-                        }),
-                        /*#__PURE__*/ _jsx(ConditionGroup, {
-                            canDelete: groups.length > 1,
-                            dataPointOptions: dataPointOptions,
-                            group: group,
-                            onDelete: ()=>onRemoveGroup(index),
-                            onUpdate: (g)=>onUpdateGroup(index, g),
-                            ruleIndex: index
-                        })
-                    ]
-                }, group.id);
-            }),
-            /*#__PURE__*/ _jsx(Flex, {
-                justifyContent: "center",
+            /*#__PURE__*/ _jsxs(Flex, {
+                direction: "row",
+                alignItems: "center",
+                gap: "1",
                 style: {
-                    paddingTop: 8,
-                    width: '100%'
+                    flexWrap: 'wrap'
                 },
-                children: /*#__PURE__*/ _jsx(Button, {
-                    appearance: "secondary",
-                    icon: {
-                        before: PlusIcon
-                    },
-                    onClick: onAddGroup,
-                    children: "Add Rule"
-                })
+                children: [
+                    /*#__PURE__*/ _jsx(Text, {
+                        size: "small",
+                        variant: "body",
+                        style: {
+                            fontWeight: 'bold'
+                        },
+                        children: "When"
+                    }),
+                    /*#__PURE__*/ _jsxs(SegmentedControl, {
+                        selected: matchType,
+                        size: "small",
+                        onChange: (value)=>onMatchTypeChange(value),
+                        children: [
+                            /*#__PURE__*/ _jsx(SegmentedControl.Segment, {
+                                value: "all",
+                                children: "All"
+                            }),
+                            /*#__PURE__*/ _jsx(SegmentedControl.Segment, {
+                                value: "any",
+                                children: "Any"
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsx(Text, {
+                        size: "small",
+                        variant: "body",
+                        style: {
+                            fontWeight: 'bold'
+                        },
+                        children: "of the"
+                    }),
+                    /*#__PURE__*/ _jsx(Chip, {
+                        label: "IF",
+                        size: "small"
+                    }),
+                    /*#__PURE__*/ _jsx(Text, {
+                        size: "small",
+                        variant: "body",
+                        style: {
+                            fontWeight: 'bold'
+                        },
+                        children: "conditions are met"
+                    })
+                ]
+            }),
+            behaviorSection,
+            /*#__PURE__*/ _jsx(ConditionGroup, {
+                dataPointOptions: dataPointOptions,
+                group: firstGroup,
+                onUpdate: (g)=>onUpdateGroup(0, g)
             })
         ]
     });

package/dist/display-conditions/ConditionGroupsSection.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/display-conditions/ConditionGroupsSection.tsx"],"sourcesContent":["import { Button, Flex, SegmentedControl } from '@servicetitan/anvil2';\nimport PlusIcon from '@servicetitan/anvil2/assets/icons/material/round/add.svg';\nimport { ConditionGroup } from './ConditionGroup';\nimport { ConditionGroup as ConditionGroupType, LogicalOperator } from './types';\nimport type { DataPointOption } from './types';\n\nexport interface ConditionGroupsSectionProps {\n    dataPointOptions: DataPointOption[];\n    groups: ConditionGroupType[];\n    onAddGroup: () => void;\n    onRemoveGroup: (index: number) => void;\n    onUpdateGroup: (index: number, group: ConditionGroupType) => void;\n}\n\nexport function ConditionGroupsSection({\n    dataPointOptions,\n    groups,\n    onAddGroup,\n    onRemoveGroup,\n    onUpdateGroup,\n}: Readonly<ConditionGroupsSectionProps>) {\n    return (\n        <Flex direction=\"column\" gap=\"4\">\n            {groups.map((group, index) => (\n                <Flex key={group.id} direction=\"column\" gap=\"3\">\n                    {index > 0 && (\n                        <Flex\n                            justifyContent=\"center\"\n                            alignItems=\"center\"\n                            gap=\"2\"\n                            style={{ padding: '12px' }}\n                        >\n                            <SegmentedControl\n                                selected={group.logicalOperator ?? 'and'}\n                                onChange={(value: string) =>\n                                    onUpdateGroup(index, {\n                                        ...group,\n                                        logicalOperator: value as LogicalOperator,\n                                    })\n                                }\n                            >\n                                <SegmentedControl.Segment value=\"and\">And</SegmentedControl.Segment>\n                                <SegmentedControl.Segment value=\"or\">Or</SegmentedControl.Segment>\n                            </SegmentedControl>\n                        </Flex>\n                    )}\n                    <ConditionGroup\n                        canDelete={groups.length > 1}\n                        dataPointOptions={dataPointOptions}\n                        group={group}\n                        onDelete={() => onRemoveGroup(index)}\n                        onUpdate={g => onUpdateGroup(index, g)}\n                        ruleIndex={index}\n                    />\n                </Flex>\n            ))}\n            <Flex justifyContent=\"center\" style={{ paddingTop: 8, width: '100%' }}>\n                <Button appearance=\"secondary\" icon={{ before: PlusIcon }} onClick={onAddGroup}>\n                    Add Rule\n                </Button>\n            </Flex>\n        </Flex>\n    );\n}\n"],"names":["Button","Flex","SegmentedControl","PlusIcon","ConditionGroup","ConditionGroupsSection","dataPointOptions","groups","onAddGroup","onRemoveGroup","onUpdateGroup","direction","gap","map","group","index","justifyContent","alignItems","style","padding","selected","logicalOperator","onChange","value","Segment","canDelete","length","onDelete","onUpdate","g","ruleIndex","id","paddingTop","width","appearance","icon","before","onClick"],"mappings":";AAAA,SAASA,MAAM,EAAEC,IAAI,EAAEC,gBAAgB,QAAQ,uBAAuB;AACtE,OAAOC,cAAc,2DAA2D;AAChF,SAASC,cAAc,QAAQ,mBAAmB;AAYlD,OAAO,SAASC,uBAAuB,EACnCC,gBAAgB,EAChBC,MAAM,EACNC,UAAU,EACVC,aAAa,EACbC,aAAa,EACuB;IACpC,qBACI,MAACT;QAAKU,WAAU;QAASC,KAAI;;YACxBL,OAAOM,GAAG,CAAC,CAACC,OAAOC;oBAUUD;qCAT1B,MAACb;oBAAoBU,WAAU;oBAASC,KAAI;;wBACvCG,QAAQ,mBACL,KAACd;4BACGe,gBAAe;4BACfC,YAAW;4BACXL,KAAI;4BACJM,OAAO;gCAAEC,SAAS;4BAAO;sCAEzB,cAAA,MAACjB;gCACGkB,UAAUN,CAAAA,yBAAAA,MAAMO,eAAe,cAArBP,oCAAAA,yBAAyB;gCACnCQ,UAAU,CAACC,QACPb,cAAcK,OAAO;wCACjB,GAAGD,KAAK;wCACRO,iBAAiBE;oCACrB;;kDAGJ,KAACrB,iBAAiBsB,OAAO;wCAACD,OAAM;kDAAM;;kDACtC,KAACrB,iBAAiBsB,OAAO;wCAACD,OAAM;kDAAK;;;;;sCAIjD,KAACnB;4BACGqB,WAAWlB,OAAOmB,MAAM,GAAG;4BAC3BpB,kBAAkBA;4BAClBQ,OAAOA;4BACPa,UAAU,IAAMlB,cAAcM;4BAC9Ba,UAAUC,CAAAA,IAAKnB,cAAcK,OAAOc;4BACpCC,WAAWf;;;mBA5BRD,MAAMiB,EAAE;;0BAgCvB,KAAC9B;gBAAKe,gBAAe;gBAASE,OAAO;oBAAEc,YAAY;oBAAGC,OAAO;gBAAO;0BAChE,cAAA,KAACjC;oBAAOkC,YAAW;oBAAYC,MAAM;wBAAEC,QAAQjC;oBAAS;oBAAGkC,SAAS7B;8BAAY;;;;;AAMhG"}
+{"version":3,"sources":["../../src/display-conditions/ConditionGroupsSection.tsx"],"sourcesContent":["import { Chip, Flex, SegmentedControl, Text } from '@servicetitan/anvil2';\nimport type { ReactNode } from 'react';\nimport { ConditionGroup } from './ConditionGroup';\nimport { ConditionGroup as ConditionGroupType } from './types';\nimport type { DataPointOption } from './types';\n\nexport type MatchType = 'all' | 'any';\n\nexport interface ConditionGroupsSectionProps {\n    behaviorSection?: ReactNode;\n    dataPointOptions: DataPointOption[];\n    groups: ConditionGroupType[];\n    matchType: MatchType;\n    onMatchTypeChange: (matchType: MatchType) => void;\n    onUpdateGroup: (index: number, group: ConditionGroupType) => void;\n}\n\nexport function ConditionGroupsSection({\n    behaviorSection,\n    dataPointOptions,\n    groups,\n    matchType,\n    onMatchTypeChange,\n    onUpdateGroup,\n}: Readonly<ConditionGroupsSectionProps>) {\n    const firstGroup = groups[0];\n    if (!firstGroup) {\n        return null;\n    }\n\n    return (\n        <Flex direction=\"column\" gap=\"4\">\n            <Flex direction=\"row\" alignItems=\"center\" gap=\"1\" style={{ flexWrap: 'wrap' }}>\n                <Text size=\"small\" variant=\"body\" style={{ fontWeight: 'bold' }}>\n                    When\n                </Text>\n                <SegmentedControl\n                    selected={matchType}\n                    size=\"small\"\n                    onChange={(value: string) => onMatchTypeChange(value as MatchType)}\n                >\n                    <SegmentedControl.Segment value=\"all\">All</SegmentedControl.Segment>\n                    <SegmentedControl.Segment value=\"any\">Any</SegmentedControl.Segment>\n                </SegmentedControl>\n                <Text size=\"small\" variant=\"body\" style={{ fontWeight: 'bold' }}>\n                    of the\n                </Text>\n                <Chip label=\"IF\" size=\"small\" />\n                <Text size=\"small\" variant=\"body\" style={{ fontWeight: 'bold' }}>\n                    conditions are met\n                </Text>\n            </Flex>\n            {behaviorSection}\n            <ConditionGroup\n                dataPointOptions={dataPointOptions}\n                group={firstGroup}\n                onUpdate={g => onUpdateGroup(0, g)}\n            />\n        </Flex>\n    );\n}\n"],"names":["Chip","Flex","SegmentedControl","Text","ConditionGroup","ConditionGroupsSection","behaviorSection","dataPointOptions","groups","matchType","onMatchTypeChange","onUpdateGroup","firstGroup","direction","gap","alignItems","style","flexWrap","size","variant","fontWeight","selected","onChange","value","Segment","label","group","onUpdate","g"],"mappings":";AAAA,SAASA,IAAI,EAAEC,IAAI,EAAEC,gBAAgB,EAAEC,IAAI,QAAQ,uBAAuB;AAE1E,SAASC,cAAc,QAAQ,mBAAmB;AAelD,OAAO,SAASC,uBAAuB,EACnCC,eAAe,EACfC,gBAAgB,EAChBC,MAAM,EACNC,SAAS,EACTC,iBAAiB,EACjBC,aAAa,EACuB;IACpC,MAAMC,aAAaJ,MAAM,CAAC,EAAE;IAC5B,IAAI,CAACI,YAAY;QACb,OAAO;IACX;IAEA,qBACI,MAACX;QAAKY,WAAU;QAASC,KAAI;;0BACzB,MAACb;gBAAKY,WAAU;gBAAME,YAAW;gBAASD,KAAI;gBAAIE,OAAO;oBAAEC,UAAU;gBAAO;;kCACxE,KAACd;wBAAKe,MAAK;wBAAQC,SAAQ;wBAAOH,OAAO;4BAAEI,YAAY;wBAAO;kCAAG;;kCAGjE,MAAClB;wBACGmB,UAAUZ;wBACVS,MAAK;wBACLI,UAAU,CAACC,QAAkBb,kBAAkBa;;0CAE/C,KAACrB,iBAAiBsB,OAAO;gCAACD,OAAM;0CAAM;;0CACtC,KAACrB,iBAAiBsB,OAAO;gCAACD,OAAM;0CAAM;;;;kCAE1C,KAACpB;wBAAKe,MAAK;wBAAQC,SAAQ;wBAAOH,OAAO;4BAAEI,YAAY;wBAAO;kCAAG;;kCAGjE,KAACpB;wBAAKyB,OAAM;wBAAKP,MAAK;;kCACtB,KAACf;wBAAKe,MAAK;wBAAQC,SAAQ;wBAAOH,OAAO;4BAAEI,YAAY;wBAAO;kCAAG;;;;YAIpEd;0BACD,KAACF;gBACGG,kBAAkBA;gBAClBmB,OAAOd;gBACPe,UAAUC,CAAAA,IAAKjB,cAAc,GAAGiB;;;;AAIhD"}

package/dist/display-conditions/ConditionRow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConditionRow.d.ts","sourceRoot":"","sources":["../../src/display-conditions/ConditionRow.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAoB,eAAe,EAA0C,MAAM,SAAS,CAAC;AACpG,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,MAAM,WAAW,iBAAiB;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,eAAe,CAAC;IAC3B,gBAAgB,EAAE,eAAe,EAAE,CAAC;IACpC,QAAQ,EAAE,CAAC,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;IACvC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAsBD,wBAAgB,YAAY,CAAC,EACzB,SAAS,EACT,SAAS,EACT,gBAAgB,EAChB,QAAQ,EACR,QAAQ,GACX,EAAE,QAAQ,CAAC,iBAAiB,CAAC,2CAiJ7B"}
+{"version":3,"file":"ConditionRow.d.ts","sourceRoot":"","sources":["../../src/display-conditions/ConditionRow.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAoB,eAAe,EAA0C,MAAM,SAAS,CAAC;AACpG,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,MAAM,WAAW,iBAAiB;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,eAAe,CAAC;IAC3B,gBAAgB,EAAE,eAAe,EAAE,CAAC;IACpC,QAAQ,EAAE,CAAC,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;IACvC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAsBD,wBAAgB,YAAY,CAAC,EACzB,SAAS,EACT,SAAS,EACT,gBAAgB,EAChB,QAAQ,EACR,QAAQ,GACX,EAAE,QAAQ,CAAC,iBAAiB,CAAC,2CA2J7B"}

package/dist/display-conditions/ConditionRow.js

@@ -77,17 +77,17 @@ export function ConditionRow({ canRemove, condition, dataPointOptions, onChange,
                     display: 'flex',
                     alignItems: 'flex-end',
                     flexShrink: 0,
-                    padding: '6px 12px'
+                    padding: '4px 8px'
                 },
                 children: /*#__PURE__*/ _jsx(Chip, {
                     label: "IF",
-                    size: "medium"
+                    size: "small"
                 })
             }),
             /*#__PURE__*/ _jsx("div", {
                 style: {
-                    flex: '2 1 280px',
-                    minWidth: 240
+                    flex: '2 1 240px',
+                    minWidth: 200
                 },
                 children: /*#__PURE__*/ _jsxs(Combobox, {
                     ...{
@@ -108,7 +108,8 @@ export function ConditionRow({ canRemove, condition, dataPointOptions, onChange,
                     children: [
                         /*#__PURE__*/ _jsx(Combobox.SelectTrigger, {
                             label: "Data point",
-                            placeholder: "Select data point..."
+                            placeholder: "Select data point...",
+                            size: "small"
                         }),
                         /*#__PURE__*/ _jsx(Combobox.Content, {
                             children: ({ items })=>/*#__PURE__*/ _jsx(Combobox.List, {
@@ -124,8 +125,8 @@ export function ConditionRow({ canRemove, condition, dataPointOptions, onChange,
             }),
             /*#__PURE__*/ _jsx("div", {
                 style: {
-                    flex: '1 1 220px',
-                    minWidth: 180
+                    flex: '1 1 180px',
+                    minWidth: 150
                 },
                 children: /*#__PURE__*/ _jsxs(Combobox, {
                     ...{
@@ -151,7 +152,8 @@ export function ConditionRow({ canRemove, condition, dataPointOptions, onChange,
                     children: [
                         /*#__PURE__*/ _jsx(Combobox.SelectTrigger, {
                             label: "Condition",
-                            placeholder: "Select..."
+                            placeholder: "Select...",
+                            size: "small"
                         }),
                         /*#__PURE__*/ _jsx(Combobox.Content, {
                             children: ({ items })=>/*#__PURE__*/ _jsx(Combobox.List, {
@@ -167,11 +169,12 @@ export function ConditionRow({ canRemove, condition, dataPointOptions, onChange,
             }),
             !isValueLess && /*#__PURE__*/ _jsx("div", {
                 style: {
-                    flex: '1 1 220px',
-                    minWidth: 180
+                    flex: '1 1 180px',
+                    minWidth: 150
                 },
                 children: /*#__PURE__*/ _jsx(TextField, {
                     label: "Value",
+                    size: "small",
                     value: condition.value,
                     onChange: (e)=>handleValueChange(e.target.value),
                     placeholder: fieldType === 'number' ? 'e.g. 1.5' : 'Enter value...',
@@ -189,7 +192,7 @@ export function ConditionRow({ canRemove, condition, dataPointOptions, onChange,
                     display: 'flex',
                     alignItems: 'flex-end',
                     flexShrink: 0,
-                    padding: '6px 12px'
+                    padding: '4px 8px'
                 },
                 children: /*#__PURE__*/ _jsx(Button, {
                     appearance: "secondary",
@@ -197,6 +200,7 @@ export function ConditionRow({ canRemove, condition, dataPointOptions, onChange,
                     icon: {
                         before: TrashIcon
                     },
+                    size: "small",
                     onClick: onRemove
                 })
             })

package/dist/display-conditions/ConditionRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/display-conditions/ConditionRow.tsx"],"sourcesContent":["import { Button, Chip, Combobox, Flex, TextField } from '@servicetitan/anvil2';\nimport TrashIcon from '@servicetitan/anvil2/assets/icons/material/round/delete.svg';\nimport { useMemo } from 'react';\nimport { NUMBER_OPERATORS, SingleCondition, STRING_OPERATORS, VALUE_LESS_OPERATORS } from './types';\nimport type { DataPointOption } from './types';\n\nexport interface ConditionRowProps {\n    canRemove: boolean;\n    condition: SingleCondition;\n    dataPointOptions: DataPointOption[];\n    onChange: (c: SingleCondition) => void;\n    onRemove: () => void;\n}\n\ninterface OperatorOption {\n    label: string;\n    value: string;\n}\n\nfunction sanitizeNumericInput(raw: string): string {\n    // Allow only a single leading minus and one decimal separator.\n    let value = raw.replaceAll(/[^0-9.-]/g, '');\n    const isNegative = value.startsWith('-');\n    value = value.replaceAll('-', '');\n    if (isNegative) {\n        value = `-${value}`;\n    }\n    const firstDot = value.indexOf('.');\n    if (firstDot >= 0) {\n        value = `${value.slice(0, firstDot + 1)}${value.slice(firstDot + 1).replaceAll('.', '')}`;\n    }\n    return value;\n}\n\nexport function ConditionRow({\n    canRemove,\n    condition,\n    dataPointOptions,\n    onChange,\n    onRemove,\n}: Readonly<ConditionRowProps>) {\n    const selectedDataPoint = useMemo(\n        () => dataPointOptions.find(opt => opt.fullKey === condition.dataPointKey) ?? null,\n        [dataPointOptions, condition.dataPointKey],\n    );\n\n    const fieldType = selectedDataPoint?.fieldType ?? 'string';\n\n    const operatorItems: OperatorOption[] = useMemo(\n        () =>\n            fieldType === 'number'\n                ? ([...NUMBER_OPERATORS] as OperatorOption[])\n                : ([...STRING_OPERATORS] as OperatorOption[]),\n        [fieldType],\n    );\n\n    const selectedOperator = useMemo(\n        () => operatorItems.find(op => op.value === condition.operator) ?? null,\n        [operatorItems, condition.operator],\n    );\n\n    const isValueLess = VALUE_LESS_OPERATORS.includes(condition.operator);\n\n    const handleValueChange = (raw: string) => {\n        const value = fieldType === 'number' ? sanitizeNumericInput(raw) : raw;\n        onChange({ ...condition, value });\n    };\n\n    const handleDataPointChange = (item: DataPointOption | null) => {\n        const nextFieldType = item?.fieldType ?? 'string';\n        const nextIsNumber = nextFieldType === 'number';\n        const nextOperatorItems = nextIsNumber ? NUMBER_OPERATORS : STRING_OPERATORS;\n        const operatorReset = !nextOperatorItems.some(op => op.value === condition.operator);\n        onChange({\n            ...condition,\n            dataPointKey: item?.fullKey ?? '',\n            operator: operatorReset\n                ? nextIsNumber\n                    ? 'num_eq'\n                    : 'is_equal_to'\n                : condition.operator,\n        });\n    };\n\n    return (\n        <Flex\n            direction=\"row\"\n            alignItems=\"flex-end\"\n            gap=\"2\"\n            style={{ flexWrap: 'wrap', rowGap: 8, width: '100%' }}\n        >\n            <div\n                style={{\n                    display: 'flex',\n                    alignItems: 'flex-end',\n                    flexShrink: 0,\n                    padding: '6px 12px',\n                }}\n            >\n                <Chip label=\"IF\" size=\"medium\" />\n            </div>\n            <div style={{ flex: '2 1 280px', minWidth: 240 }}>\n                <Combobox\n                    {...({ disableClearSelection: true } as object)}\n                    groupBy=\"group\"\n                    itemToKey={(item: DataPointOption | null) => item?.fullKey ?? ''}\n                    itemToString={(item: DataPointOption | null) => item?.title ?? ''}\n                    items={dataPointOptions}\n                    selectedItem={selectedDataPoint}\n                    onChange={handleDataPointChange}\n                >\n                    <Combobox.SelectTrigger label=\"Data point\" placeholder=\"Select data point...\" />\n                    <Combobox.Content>\n                        {({ items }: { items: DataPointOption[] }) => (\n                            <Combobox.List>\n                                {items.map((item, i) => (\n                                    <Combobox.Item index={i} item={item} key={item.fullKey}>\n                                        {item.title}\n                                    </Combobox.Item>\n                                ))}\n                            </Combobox.List>\n                        )}\n                    </Combobox.Content>\n                </Combobox>\n            </div>\n            <div style={{ flex: '1 1 220px', minWidth: 180 }}>\n                <Combobox\n                    {...({ disableClearSelection: true } as object)}\n                    itemToKey={(item: OperatorOption | null) => item?.value ?? ''}\n                    itemToString={(item: OperatorOption | null) => item?.label ?? ''}\n                    items={operatorItems}\n                    selectedItem={selectedOperator}\n                    onChange={(item: OperatorOption | null) =>\n                        onChange({\n                            ...condition,\n                            operator: (item?.value ?? 'is_equal_to') as SingleCondition['operator'],\n                        })\n                    }\n                >\n                    <Combobox.SelectTrigger label=\"Condition\" placeholder=\"Select...\" />\n                    <Combobox.Content>\n                        {({ items }: { items: OperatorOption[] }) => (\n                            <Combobox.List>\n                                {items.map((item, i) => (\n                                    <Combobox.Item index={i} item={item} key={item.value}>\n                                        {item.label}\n                                    </Combobox.Item>\n                                ))}\n                            </Combobox.List>\n                        )}\n                    </Combobox.Content>\n                </Combobox>\n            </div>\n            {!isValueLess && (\n                <div style={{ flex: '1 1 220px', minWidth: 180 }}>\n                    <TextField\n                        label=\"Value\"\n                        value={condition.value}\n                        onChange={e => handleValueChange(e.target.value)}\n                        placeholder={fieldType === 'number' ? 'e.g. 1.5' : 'Enter value...'}\n                        style={{ width: '100%' }}\n                        aria-label=\"Value\"\n                        {...(fieldType === 'number' && { inputMode: 'decimal' })}\n                    />\n                </div>\n            )}\n            {canRemove && (\n                <div\n                    style={{\n                        display: 'flex',\n                        alignItems: 'flex-end',\n                        flexShrink: 0,\n                        padding: '6px 12px',\n                    }}\n                >\n                    <Button\n                        appearance=\"secondary\"\n                        aria-label=\"Remove condition\"\n                        icon={{ before: TrashIcon }}\n                        onClick={onRemove}\n                    />\n                </div>\n            )}\n        </Flex>\n    );\n}\n"],"names":["Button","Chip","Combobox","Flex","TextField","TrashIcon","useMemo","NUMBER_OPERATORS","STRING_OPERATORS","VALUE_LESS_OPERATORS","sanitizeNumericInput","raw","value","replaceAll","isNegative","startsWith","firstDot","indexOf","slice","ConditionRow","canRemove","condition","dataPointOptions","onChange","onRemove","selectedDataPoint","find","opt","fullKey","dataPointKey","fieldType","operatorItems","selectedOperator","op","operator","isValueLess","includes","handleValueChange","handleDataPointChange","item","nextFieldType","nextIsNumber","nextOperatorItems","operatorReset","some","direction","alignItems","gap","style","flexWrap","rowGap","width","div","display","flexShrink","padding","label","size","flex","minWidth","disableClearSelection","groupBy","itemToKey","itemToString","title","items","selectedItem","SelectTrigger","placeholder","Content","List","map","i","Item","index","e","target","aria-label","inputMode","appearance","icon","before","onClick"],"mappings":"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"}
+{"version":3,"sources":["../../src/display-conditions/ConditionRow.tsx"],"sourcesContent":["import { Button, Chip, Combobox, Flex, TextField } from '@servicetitan/anvil2';\nimport TrashIcon from '@servicetitan/anvil2/assets/icons/material/round/delete.svg';\nimport { useMemo } from 'react';\nimport { NUMBER_OPERATORS, SingleCondition, STRING_OPERATORS, VALUE_LESS_OPERATORS } from './types';\nimport type { DataPointOption } from './types';\n\nexport interface ConditionRowProps {\n    canRemove: boolean;\n    condition: SingleCondition;\n    dataPointOptions: DataPointOption[];\n    onChange: (c: SingleCondition) => void;\n    onRemove: () => void;\n}\n\ninterface OperatorOption {\n    label: string;\n    value: string;\n}\n\nfunction sanitizeNumericInput(raw: string): string {\n    // Allow only a single leading minus and one decimal separator.\n    let value = raw.replaceAll(/[^0-9.-]/g, '');\n    const isNegative = value.startsWith('-');\n    value = value.replaceAll('-', '');\n    if (isNegative) {\n        value = `-${value}`;\n    }\n    const firstDot = value.indexOf('.');\n    if (firstDot >= 0) {\n        value = `${value.slice(0, firstDot + 1)}${value.slice(firstDot + 1).replaceAll('.', '')}`;\n    }\n    return value;\n}\n\nexport function ConditionRow({\n    canRemove,\n    condition,\n    dataPointOptions,\n    onChange,\n    onRemove,\n}: Readonly<ConditionRowProps>) {\n    const selectedDataPoint = useMemo(\n        () => dataPointOptions.find(opt => opt.fullKey === condition.dataPointKey) ?? null,\n        [dataPointOptions, condition.dataPointKey],\n    );\n\n    const fieldType = selectedDataPoint?.fieldType ?? 'string';\n\n    const operatorItems: OperatorOption[] = useMemo(\n        () =>\n            fieldType === 'number'\n                ? ([...NUMBER_OPERATORS] as OperatorOption[])\n                : ([...STRING_OPERATORS] as OperatorOption[]),\n        [fieldType],\n    );\n\n    const selectedOperator = useMemo(\n        () => operatorItems.find(op => op.value === condition.operator) ?? null,\n        [operatorItems, condition.operator],\n    );\n\n    const isValueLess = VALUE_LESS_OPERATORS.includes(condition.operator);\n\n    const handleValueChange = (raw: string) => {\n        const value = fieldType === 'number' ? sanitizeNumericInput(raw) : raw;\n        onChange({ ...condition, value });\n    };\n\n    const handleDataPointChange = (item: DataPointOption | null) => {\n        const nextFieldType = item?.fieldType ?? 'string';\n        const nextIsNumber = nextFieldType === 'number';\n        const nextOperatorItems = nextIsNumber ? NUMBER_OPERATORS : STRING_OPERATORS;\n        const operatorReset = !nextOperatorItems.some(op => op.value === condition.operator);\n        onChange({\n            ...condition,\n            dataPointKey: item?.fullKey ?? '',\n            operator: operatorReset\n                ? nextIsNumber\n                    ? 'num_eq'\n                    : 'is_equal_to'\n                : condition.operator,\n        });\n    };\n\n    return (\n        <Flex\n            direction=\"row\"\n            alignItems=\"flex-end\"\n            gap=\"2\"\n            style={{ flexWrap: 'wrap', rowGap: 8, width: '100%' }}\n        >\n            <div\n                style={{\n                    display: 'flex',\n                    alignItems: 'flex-end',\n                    flexShrink: 0,\n                    padding: '4px 8px',\n                }}\n            >\n                <Chip label=\"IF\" size=\"small\" />\n            </div>\n            <div style={{ flex: '2 1 240px', minWidth: 200 }}>\n                <Combobox\n                    {...({ disableClearSelection: true } as object)}\n                    groupBy=\"group\"\n                    itemToKey={(item: DataPointOption | null) => item?.fullKey ?? ''}\n                    itemToString={(item: DataPointOption | null) => item?.title ?? ''}\n                    items={dataPointOptions}\n                    selectedItem={selectedDataPoint}\n                    onChange={handleDataPointChange}\n                >\n                    <Combobox.SelectTrigger\n                        label=\"Data point\"\n                        placeholder=\"Select data point...\"\n                        size=\"small\"\n                    />\n                    <Combobox.Content>\n                        {({ items }: { items: DataPointOption[] }) => (\n                            <Combobox.List>\n                                {items.map((item, i) => (\n                                    <Combobox.Item index={i} item={item} key={item.fullKey}>\n                                        {item.title}\n                                    </Combobox.Item>\n                                ))}\n                            </Combobox.List>\n                        )}\n                    </Combobox.Content>\n                </Combobox>\n            </div>\n            <div style={{ flex: '1 1 180px', minWidth: 150 }}>\n                <Combobox\n                    {...({ disableClearSelection: true } as object)}\n                    itemToKey={(item: OperatorOption | null) => item?.value ?? ''}\n                    itemToString={(item: OperatorOption | null) => item?.label ?? ''}\n                    items={operatorItems}\n                    selectedItem={selectedOperator}\n                    onChange={(item: OperatorOption | null) =>\n                        onChange({\n                            ...condition,\n                            operator: (item?.value ?? 'is_equal_to') as SingleCondition['operator'],\n                        })\n                    }\n                >\n                    <Combobox.SelectTrigger\n                        label=\"Condition\"\n                        placeholder=\"Select...\"\n                        size=\"small\"\n                    />\n                    <Combobox.Content>\n                        {({ items }: { items: OperatorOption[] }) => (\n                            <Combobox.List>\n                                {items.map((item, i) => (\n                                    <Combobox.Item index={i} item={item} key={item.value}>\n                                        {item.label}\n                                    </Combobox.Item>\n                                ))}\n                            </Combobox.List>\n                        )}\n                    </Combobox.Content>\n                </Combobox>\n            </div>\n            {!isValueLess && (\n                <div style={{ flex: '1 1 180px', minWidth: 150 }}>\n                    <TextField\n                        label=\"Value\"\n                        size=\"small\"\n                        value={condition.value}\n                        onChange={e => handleValueChange(e.target.value)}\n                        placeholder={fieldType === 'number' ? 'e.g. 1.5' : 'Enter value...'}\n                        style={{ width: '100%' }}\n                        aria-label=\"Value\"\n                        {...(fieldType === 'number' && { inputMode: 'decimal' })}\n                    />\n                </div>\n            )}\n            {canRemove && (\n                <div\n                    style={{\n                        display: 'flex',\n                        alignItems: 'flex-end',\n                        flexShrink: 0,\n                        padding: '4px 8px',\n                    }}\n                >\n                    <Button\n                        appearance=\"secondary\"\n                        aria-label=\"Remove condition\"\n                        icon={{ before: TrashIcon }}\n                        size=\"small\"\n                        onClick={onRemove}\n                    />\n                </div>\n            )}\n        </Flex>\n    );\n}\n"],"names":["Button","Chip","Combobox","Flex","TextField","TrashIcon","useMemo","NUMBER_OPERATORS","STRING_OPERATORS","VALUE_LESS_OPERATORS","sanitizeNumericInput","raw","value","replaceAll","isNegative","startsWith","firstDot","indexOf","slice","ConditionRow","canRemove","condition","dataPointOptions","onChange","onRemove","selectedDataPoint","find","opt","fullKey","dataPointKey","fieldType","operatorItems","selectedOperator","op","operator","isValueLess","includes","handleValueChange","handleDataPointChange","item","nextFieldType","nextIsNumber","nextOperatorItems","operatorReset","some","direction","alignItems","gap","style","flexWrap","rowGap","width","div","display","flexShrink","padding","label","size","flex","minWidth","disableClearSelection","groupBy","itemToKey","itemToString","title","items","selectedItem","SelectTrigger","placeholder","Content","List","map","i","Item","index","e","target","aria-label","inputMode","appearance","icon","before","onClick"],"mappings":"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"}

package/dist/display-conditions/DisplayConditionModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DisplayConditionModal.d.ts","sourceRoot":"","sources":["../../src/display-conditions/DisplayConditionModal.tsx"],"names":[],"mappings":"AAiBA,MAAM,WAAW,0BAA0B;IACvC,MAAM,CAAC,EAAE,OAAO,kBAAkB,EAAE,YAAY,CAAC;CACpD;AAED,eAAO,MAAM,qBAAqB,GAAI,OAAO,0BAA0B,uCAgNtE,CAAC"}
+{"version":3,"file":"DisplayConditionModal.d.ts","sourceRoot":"","sources":["../../src/display-conditions/DisplayConditionModal.tsx"],"names":[],"mappings":"AAoDA,MAAM,WAAW,0BAA0B;IACvC,MAAM,CAAC,EAAE,OAAO,kBAAkB,EAAE,YAAY,CAAC;CACpD;AAED,eAAO,MAAM,qBAAqB,GAAI,OAAO,0BAA0B,uCAsLtE,CAAC"}