@nyaruka/temba-components 0.129.3 → 0.129.5

package/out-tsc/test/actions/send_msg.test.js

@@ -0,0 +1,95 @@
+import { expect } from '@open-wc/testing';
+import { send_msg } from '../../src/flow/actions/send_msg';
+import { ActionTest } from '../ActionHelper';
+/**
+ * Test suite for the send_msg action configuration.
+ */
+describe('send_msg action config', () => {
+    const helper = new ActionTest(send_msg, 'send_msg');
+    describe('basic properties', () => {
+        helper.testBasicProperties();
+        it('has correct name', () => {
+            expect(send_msg.name).to.equal('Send Message');
+        });
+    });
+    describe('action scenarios', () => {
+        helper.testAction({
+            uuid: 'test-action-1',
+            type: 'send_msg',
+            text: 'Hello world!',
+            quick_replies: []
+        }, 'simple-text');
+        helper.testAction({
+            uuid: 'test-action-2',
+            type: 'send_msg',
+            text: 'Hello\nworld!\nHow are you?',
+            quick_replies: []
+        }, 'text-with-linebreaks');
+        helper.testAction({
+            uuid: 'test-action-3',
+            type: 'send_msg',
+            text: 'Choose an option:',
+            quick_replies: ['Yes', 'No', 'Maybe']
+        }, 'text-with-quick-replies');
+        helper.testAction({
+            uuid: 'test-action-4',
+            type: 'send_msg',
+            text: 'Rate our service:',
+            quick_replies: [
+                '⭐',
+                '⭐⭐',
+                '⭐⭐⭐',
+                '⭐⭐⭐⭐',
+                '⭐⭐⭐⭐⭐',
+                'Not applicable'
+            ]
+        }, 'text-with-many-quick-replies');
+        helper.testAction({
+            uuid: 'test-action-5',
+            type: 'send_msg',
+            text: 'Welcome to our service!\n\nPlease choose from the following options:\n- Option A: Basic plan\n- Option B: Premium plan\n- Option C: Enterprise plan',
+            quick_replies: ['Basic', 'Premium', 'Enterprise']
+        }, 'multiline-text-with-replies');
+        helper.testAction({
+            uuid: 'test-action-6',
+            type: 'send_msg',
+            text: 'Which department would you like to contact?',
+            quick_replies: [
+                'Customer Support Department',
+                'Technical Support Team',
+                'Billing and Accounts Department',
+                'Sales and Marketing Division'
+            ]
+        }, 'long-quick-replies');
+        helper.testAction({
+            uuid: 'test-action-7',
+            type: 'send_msg',
+            text: 'This action definition is missing quick_replies altogether.'
+        }, 'text-without-quick-replies');
+    });
+    describe('validation edge cases', () => {
+        it('fails validation for empty text', () => {
+            const action = {
+                uuid: 'test-action',
+                type: 'send_msg',
+                text: '',
+                quick_replies: []
+            };
+            const result = send_msg.validate(action);
+            expect(result.valid).to.be.false;
+            expect(result.errors.text).to.equal('Message text is required');
+        });
+        it('fails validation for whitespace-only text', () => {
+            const action = {
+                uuid: 'test-action',
+                type: 'send_msg',
+                text: '   \n\t  ',
+                quick_replies: []
+            };
+            const result = send_msg.validate(action);
+            expect(result.valid).to.be.false;
+            expect(result.errors.text).to.equal('Message text is required');
+        });
+    });
+});
+//# sourceMappingURL=send_msg.test.js.map

package/out-tsc/test/actions/send_msg.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"send_msg.test.js","sourceRoot":"","sources":["../../../test/actions/send_msg.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect } from '@open-wc/testing';\nimport { send_msg } from '../../src/flow/actions/send_msg';\nimport { SendMsg } from '../../src/store/flow-definition';\nimport { ActionTest } from '../ActionHelper';\n\n/**\n * Test suite for the send_msg action configuration.\n */\ndescribe('send_msg action config', () => {\n  const helper = new ActionTest(send_msg, 'send_msg');\n\n  describe('basic properties', () => {\n    helper.testBasicProperties();\n\n    it('has correct name', () => {\n      expect(send_msg.name).to.equal('Send Message');\n    });\n  });\n\n  describe('action scenarios', () => {\n    helper.testAction(\n      {\n        uuid: 'test-action-1',\n        type: 'send_msg',\n        text: 'Hello world!',\n        quick_replies: []\n      } as SendMsg,\n      'simple-text'\n    );\n\n    helper.testAction(\n      {\n        uuid: 'test-action-2',\n        type: 'send_msg',\n        text: 'Hello\\nworld!\\nHow are you?',\n        quick_replies: []\n      } as SendMsg,\n      'text-with-linebreaks'\n    );\n\n    helper.testAction(\n      {\n        uuid: 'test-action-3',\n        type: 'send_msg',\n        text: 'Choose an option:',\n        quick_replies: ['Yes', 'No', 'Maybe']\n      } as SendMsg,\n      'text-with-quick-replies'\n    );\n\n    helper.testAction(\n      {\n        uuid: 'test-action-4',\n        type: 'send_msg',\n        text: 'Rate our service:',\n        quick_replies: [\n          '⭐',\n          '⭐⭐',\n          '⭐⭐⭐',\n          '⭐⭐⭐⭐',\n          '⭐⭐⭐⭐⭐',\n          'Not applicable'\n        ]\n      } as SendMsg,\n      'text-with-many-quick-replies'\n    );\n\n    helper.testAction(\n      {\n        uuid: 'test-action-5',\n        type: 'send_msg',\n        text: 'Welcome to our service!\\n\\nPlease choose from the following options:\\n- Option A: Basic plan\\n- Option B: Premium plan\\n- Option C: Enterprise plan',\n        quick_replies: ['Basic', 'Premium', 'Enterprise']\n      } as SendMsg,\n      'multiline-text-with-replies'\n    );\n\n    helper.testAction(\n      {\n        uuid: 'test-action-6',\n        type: 'send_msg',\n        text: 'Which department would you like to contact?',\n        quick_replies: [\n          'Customer Support Department',\n          'Technical Support Team',\n          'Billing and Accounts Department',\n          'Sales and Marketing Division'\n        ]\n      } as SendMsg,\n      'long-quick-replies'\n    );\n\n    helper.testAction(\n      {\n        uuid: 'test-action-7',\n        type: 'send_msg',\n        text: 'This action definition is missing quick_replies altogether.'\n      } as SendMsg,\n      'text-without-quick-replies'\n    );\n  });\n\n  describe('validation edge cases', () => {\n    it('fails validation for empty text', () => {\n      const action: SendMsg = {\n        uuid: 'test-action',\n        type: 'send_msg',\n        text: '',\n        quick_replies: []\n      };\n\n      const result = send_msg.validate(action);\n      expect(result.valid).to.be.false;\n      expect(result.errors.text).to.equal('Message text is required');\n    });\n\n    it('fails validation for whitespace-only text', () => {\n      const action: SendMsg = {\n        uuid: 'test-action',\n        type: 'send_msg',\n        text: '   \\n\\t  ',\n        quick_replies: []\n      };\n\n      const result = send_msg.validate(action);\n      expect(result.valid).to.be.false;\n      expect(result.errors.text).to.equal('Message text is required');\n    });\n  });\n});\n"]}

package/out-tsc/test/temba-action-editing-integration.test.js

@@ -0,0 +1,183 @@
+import { expect, fixture, html } from '@open-wc/testing';
+import { CustomEventType } from '../src/interfaces';
+import '../temba-modules';
+describe('Action Editing Integration', () => {
+    it('should handle complete action editing workflow', async () => {
+        // Create a test node with a send_msg action
+        const testNode = {
+            uuid: 'test-node',
+            actions: [
+                {
+                    type: 'send_msg',
+                    uuid: 'test-action',
+                    text: 'Hello world',
+                    quick_replies: []
+                }
+            ],
+            exits: []
+        };
+        // Create EditorNode
+        const editorNode = await fixture(html `
+      <temba-flow-node
+        .node=${testNode}
+        .ui=${{ position: { left: 0, top: 0 } }}
+      ></temba-flow-node>
+    `);
+        await editorNode.updateComplete;
+        // Verify action is rendered
+        const actionElement = editorNode.querySelector('.action');
+        expect(actionElement).to.exist;
+        // Set up event listener to catch ActionEditRequested event
+        let editRequestedEvent = null;
+        editorNode.addEventListener(CustomEventType.ActionEditRequested, (event) => {
+            editRequestedEvent = event;
+        });
+        // Simulate clicking on the action content (not the remove button)
+        const actionContent = editorNode.querySelector('.action-content');
+        expect(actionContent).to.exist;
+        // Simulate a click (mousedown followed by mouseup at same position)
+        const mouseDownEvent = new MouseEvent('mousedown', {
+            clientX: 100,
+            clientY: 100,
+            bubbles: true
+        });
+        const mouseUpEvent = new MouseEvent('mouseup', {
+            clientX: 100,
+            clientY: 100,
+            bubbles: true
+        });
+        actionContent.dispatchEvent(mouseDownEvent);
+        actionContent.dispatchEvent(mouseUpEvent);
+        // Verify event was fired
+        expect(editRequestedEvent).to.exist;
+        expect(editRequestedEvent.detail.action).to.deep.equal(testNode.actions[0]);
+        expect(editRequestedEvent.detail.nodeUuid).to.equal('test-node');
+    });
+    it('should ignore clicks on remove button', async () => {
+        // Create a test node with a send_msg action
+        const testNode = {
+            uuid: 'test-node',
+            actions: [
+                {
+                    type: 'send_msg',
+                    uuid: 'test-action',
+                    text: 'Hello world',
+                    quick_replies: []
+                }
+            ],
+            exits: []
+        };
+        // Create EditorNode
+        const editorNode = await fixture(html `
+      <temba-flow-node
+        .node=${testNode}
+        .ui=${{ position: { left: 0, top: 0 } }}
+      ></temba-flow-node>
+    `);
+        await editorNode.updateComplete;
+        // Set up event listener to catch ActionEditRequested event
+        let editRequestedEvent = null;
+        editorNode.addEventListener(CustomEventType.ActionEditRequested, (event) => {
+            editRequestedEvent = event;
+        });
+        // Simulate clicking on the remove button
+        const removeButton = editorNode.querySelector('.remove-button');
+        expect(removeButton).to.exist;
+        removeButton.click();
+        // Verify NO ActionEditRequested event was fired (only remove action handling)
+        expect(editRequestedEvent).to.be.null;
+    });
+    it('should not open action editor when dragging beyond threshold', async () => {
+        // Create a test node with a send_msg action
+        const testNode = {
+            uuid: 'test-node',
+            actions: [
+                {
+                    type: 'send_msg',
+                    uuid: 'test-action',
+                    text: 'Hello world',
+                    quick_replies: []
+                }
+            ],
+            exits: []
+        };
+        // Create EditorNode
+        const editorNode = await fixture(html `
+      <temba-flow-node
+        .node=${testNode}
+        .ui=${{ position: { left: 0, top: 0 } }}
+      ></temba-flow-node>
+    `);
+        await editorNode.updateComplete;
+        // Set up event listener to catch ActionEditRequested event
+        let editRequestedEvent = null;
+        editorNode.addEventListener(CustomEventType.ActionEditRequested, (event) => {
+            editRequestedEvent = event;
+        });
+        // Simulate a drag operation (mousedown followed by mouseup at different position beyond threshold)
+        const actionContent = editorNode.querySelector('.action-content');
+        expect(actionContent).to.exist;
+        const mouseDownEvent = new MouseEvent('mousedown', {
+            clientX: 100,
+            clientY: 100,
+            bubbles: true
+        });
+        const mouseUpEvent = new MouseEvent('mouseup', {
+            clientX: 110, // 10 pixels away, beyond the 5 pixel threshold
+            clientY: 100,
+            bubbles: true
+        });
+        actionContent.dispatchEvent(mouseDownEvent);
+        actionContent.dispatchEvent(mouseUpEvent);
+        // Verify NO ActionEditRequested event was fired because we dragged beyond threshold
+        expect(editRequestedEvent).to.be.null;
+    });
+    it('should open action editor when clicking within threshold', async () => {
+        // Create a test node with a send_msg action
+        const testNode = {
+            uuid: 'test-node',
+            actions: [
+                {
+                    type: 'send_msg',
+                    uuid: 'test-action',
+                    text: 'Hello world',
+                    quick_replies: []
+                }
+            ],
+            exits: []
+        };
+        // Create EditorNode
+        const editorNode = await fixture(html `
+      <temba-flow-node
+        .node=${testNode}
+        .ui=${{ position: { left: 0, top: 0 } }}
+      ></temba-flow-node>
+    `);
+        await editorNode.updateComplete;
+        // Set up event listener to catch ActionEditRequested event
+        let editRequestedEvent = null;
+        editorNode.addEventListener(CustomEventType.ActionEditRequested, (event) => {
+            editRequestedEvent = event;
+        });
+        // Simulate a small movement (mousedown followed by mouseup at position within threshold)
+        const actionContent = editorNode.querySelector('.action-content');
+        expect(actionContent).to.exist;
+        const mouseDownEvent = new MouseEvent('mousedown', {
+            clientX: 100,
+            clientY: 100,
+            bubbles: true
+        });
+        const mouseUpEvent = new MouseEvent('mouseup', {
+            clientX: 103, // 3 pixels away, within the 5 pixel threshold
+            clientY: 102, // 2 pixels away
+            bubbles: true
+        });
+        actionContent.dispatchEvent(mouseDownEvent);
+        actionContent.dispatchEvent(mouseUpEvent);
+        // Verify ActionEditRequested event was fired because we stayed within threshold
+        expect(editRequestedEvent).to.exist;
+        expect(editRequestedEvent.detail.action).to.deep.equal(testNode.actions[0]);
+        expect(editRequestedEvent.detail.nodeUuid).to.equal('test-node');
+    });
+});
+//# sourceMappingURL=temba-action-editing-integration.test.js.map

package/out-tsc/test/temba-action-editing-integration.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"temba-action-editing-integration.test.js","sourceRoot":"","sources":["../../test/temba-action-editing-integration.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect, fixture, html } from '@open-wc/testing';\nimport { CanvasNode } from '../src/flow/CanvasNode';\nimport { SendMsg, Node } from '../src/store/flow-definition';\nimport { CustomEventType } from '../src/interfaces';\nimport '../temba-modules';\n\ndescribe('Action Editing Integration', () => {\n  it('should handle complete action editing workflow', async () => {\n    // Create a test node with a send_msg action\n    const testNode: Node = {\n      uuid: 'test-node',\n      actions: [\n        {\n          type: 'send_msg',\n          uuid: 'test-action',\n          text: 'Hello world',\n          quick_replies: []\n        } as SendMsg\n      ],\n      exits: []\n    };\n\n    // Create EditorNode\n    const editorNode: CanvasNode = await fixture(html`\n      <temba-flow-node\n        .node=${testNode}\n        .ui=${{ position: { left: 0, top: 0 } }}\n      ></temba-flow-node>\n    `);\n\n    await editorNode.updateComplete;\n\n    // Verify action is rendered\n    const actionElement = editorNode.querySelector('.action');\n    expect(actionElement).to.exist;\n\n    // Set up event listener to catch ActionEditRequested event\n    let editRequestedEvent: CustomEvent | null = null;\n    editorNode.addEventListener(\n      CustomEventType.ActionEditRequested,\n      (event: CustomEvent) => {\n        editRequestedEvent = event;\n      }\n    );\n\n    // Simulate clicking on the action content (not the remove button)\n    const actionContent = editorNode.querySelector(\n      '.action-content'\n    ) as HTMLElement;\n    expect(actionContent).to.exist;\n\n    // Simulate a click (mousedown followed by mouseup at same position)\n    const mouseDownEvent = new MouseEvent('mousedown', {\n      clientX: 100,\n      clientY: 100,\n      bubbles: true\n    });\n    const mouseUpEvent = new MouseEvent('mouseup', {\n      clientX: 100,\n      clientY: 100,\n      bubbles: true\n    });\n\n    actionContent.dispatchEvent(mouseDownEvent);\n    actionContent.dispatchEvent(mouseUpEvent);\n\n    // Verify event was fired\n    expect(editRequestedEvent).to.exist;\n    expect(editRequestedEvent!.detail.action).to.deep.equal(\n      testNode.actions[0]\n    );\n    expect(editRequestedEvent!.detail.nodeUuid).to.equal('test-node');\n  });\n\n  it('should ignore clicks on remove button', async () => {\n    // Create a test node with a send_msg action\n    const testNode: Node = {\n      uuid: 'test-node',\n      actions: [\n        {\n          type: 'send_msg',\n          uuid: 'test-action',\n          text: 'Hello world',\n          quick_replies: []\n        } as SendMsg\n      ],\n      exits: []\n    };\n\n    // Create EditorNode\n    const editorNode: CanvasNode = await fixture(html`\n      <temba-flow-node\n        .node=${testNode}\n        .ui=${{ position: { left: 0, top: 0 } }}\n      ></temba-flow-node>\n    `);\n\n    await editorNode.updateComplete;\n\n    // Set up event listener to catch ActionEditRequested event\n    let editRequestedEvent: CustomEvent | null = null;\n    editorNode.addEventListener(\n      CustomEventType.ActionEditRequested,\n      (event: CustomEvent) => {\n        editRequestedEvent = event;\n      }\n    );\n\n    // Simulate clicking on the remove button\n    const removeButton = editorNode.querySelector(\n      '.remove-button'\n    ) as HTMLElement;\n    expect(removeButton).to.exist;\n\n    removeButton.click();\n\n    // Verify NO ActionEditRequested event was fired (only remove action handling)\n    expect(editRequestedEvent).to.be.null;\n  });\n\n  it('should not open action editor when dragging beyond threshold', async () => {\n    // Create a test node with a send_msg action\n    const testNode: Node = {\n      uuid: 'test-node',\n      actions: [\n        {\n          type: 'send_msg',\n          uuid: 'test-action',\n          text: 'Hello world',\n          quick_replies: []\n        } as SendMsg\n      ],\n      exits: []\n    };\n\n    // Create EditorNode\n    const editorNode: CanvasNode = await fixture(html`\n      <temba-flow-node\n        .node=${testNode}\n        .ui=${{ position: { left: 0, top: 0 } }}\n      ></temba-flow-node>\n    `);\n\n    await editorNode.updateComplete;\n\n    // Set up event listener to catch ActionEditRequested event\n    let editRequestedEvent: CustomEvent | null = null;\n    editorNode.addEventListener(\n      CustomEventType.ActionEditRequested,\n      (event: CustomEvent) => {\n        editRequestedEvent = event;\n      }\n    );\n\n    // Simulate a drag operation (mousedown followed by mouseup at different position beyond threshold)\n    const actionContent = editorNode.querySelector(\n      '.action-content'\n    ) as HTMLElement;\n    expect(actionContent).to.exist;\n\n    const mouseDownEvent = new MouseEvent('mousedown', {\n      clientX: 100,\n      clientY: 100,\n      bubbles: true\n    });\n    const mouseUpEvent = new MouseEvent('mouseup', {\n      clientX: 110, // 10 pixels away, beyond the 5 pixel threshold\n      clientY: 100,\n      bubbles: true\n    });\n\n    actionContent.dispatchEvent(mouseDownEvent);\n    actionContent.dispatchEvent(mouseUpEvent);\n\n    // Verify NO ActionEditRequested event was fired because we dragged beyond threshold\n    expect(editRequestedEvent).to.be.null;\n  });\n\n  it('should open action editor when clicking within threshold', async () => {\n    // Create a test node with a send_msg action\n    const testNode: Node = {\n      uuid: 'test-node',\n      actions: [\n        {\n          type: 'send_msg',\n          uuid: 'test-action',\n          text: 'Hello world',\n          quick_replies: []\n        } as SendMsg\n      ],\n      exits: []\n    };\n\n    // Create EditorNode\n    const editorNode: CanvasNode = await fixture(html`\n      <temba-flow-node\n        .node=${testNode}\n        .ui=${{ position: { left: 0, top: 0 } }}\n      ></temba-flow-node>\n    `);\n\n    await editorNode.updateComplete;\n\n    // Set up event listener to catch ActionEditRequested event\n    let editRequestedEvent: CustomEvent | null = null;\n    editorNode.addEventListener(\n      CustomEventType.ActionEditRequested,\n      (event: CustomEvent) => {\n        editRequestedEvent = event;\n      }\n    );\n\n    // Simulate a small movement (mousedown followed by mouseup at position within threshold)\n    const actionContent = editorNode.querySelector(\n      '.action-content'\n    ) as HTMLElement;\n    expect(actionContent).to.exist;\n\n    const mouseDownEvent = new MouseEvent('mousedown', {\n      clientX: 100,\n      clientY: 100,\n      bubbles: true\n    });\n    const mouseUpEvent = new MouseEvent('mouseup', {\n      clientX: 103, // 3 pixels away, within the 5 pixel threshold\n      clientY: 102, // 2 pixels away\n      bubbles: true\n    });\n\n    actionContent.dispatchEvent(mouseDownEvent);\n    actionContent.dispatchEvent(mouseUpEvent);\n\n    // Verify ActionEditRequested event was fired because we stayed within threshold\n    expect(editRequestedEvent).to.exist;\n    expect(editRequestedEvent!.detail.action).to.deep.equal(\n      testNode.actions[0]\n    );\n    expect(editRequestedEvent!.detail.nodeUuid).to.equal('test-node');\n  });\n});\n"]}

package/out-tsc/test/temba-checkbox.test.js

@@ -55,7 +55,7 @@ describe('temba-checkbox', () => {
         const el = await fixture(html `
       <temba-checkbox name="My Checkbox"></temba-checkbox>
     `);
-        expect(el.label).to.equal(null);
+        expect(el.label).to.equal(undefined);
         //the ".wrapper.label" style results in the background hover effect
         const wrapperDivEl = el.shadowRoot.querySelector('div.wrapper.label');
         expect(wrapperDivEl).to.equal(null);

package/out-tsc/test/temba-checkbox.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"temba-checkbox.test.js","sourceRoot":"","sources":["../../test/temba-checkbox.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, fixture, expect } from '@open-wc/testing';\nimport { Checkbox } from '../src/form/Checkbox';\nimport { assertScreenshot, getClip } from './utils.test';\n\ndescribe('temba-checkbox', () => {\n  it('renders default checkbox', async () => {\n    const el: Checkbox = await fixture(html`\n      <temba-checkbox label=\"My Checkbox\"></temba-checkbox>\n    `);\n\n    expect(el.label).to.equal('My Checkbox');\n    await assertScreenshot('checkbox/default', getClip(el));\n  });\n\n  it('can select by clicking on the label', async () => {\n    const el: Checkbox = await fixture(html`\n      <temba-checkbox\n        label=\"My Checkbox\"\n        animatechange=\"false\"\n      ></temba-checkbox>\n    `);\n\n    (el.shadowRoot.querySelector('.checkbox-label') as HTMLDivElement).click();\n    expect(el.checked).to.equal(true);\n    await assertScreenshot('checkbox/checked', getClip(el));\n  });\n\n  it('fires change event on click', async () => {\n    // eslint-disable-next-line no-async-promise-executor\n    return new Promise<void>(async (resolve) => {\n      const checkbox: Checkbox = await fixture(html`\n        <temba-checkbox label=\"My Checkbox\"></temba-checkbox>\n      `);\n\n      checkbox.addEventListener('change', () => {\n        resolve();\n      });\n\n      click('temba-checkbox');\n    });\n  });\n\n  it('checks via click method', async () => {\n    const checkbox: Checkbox = await fixture(html`\n      <temba-checkbox label=\"My Checkbox\"></temba-checkbox>\n    `);\n    checkbox.click();\n    expect(checkbox.checked).to.equal(true);\n  });\n\n  it('has background hover effect when label is set', async () => {\n    const el: Checkbox = await fixture(html`\n      <temba-checkbox name=\"My Checkbox\" label=\"My Label\"></temba-checkbox>\n    `);\n    expect(el.label).to.equal('My Label');\n    //the \".wrapper.label\" style results in the background hover effect\n    const wrapperDivEl = el.shadowRoot.querySelector(\n      'div.wrapper.label'\n    ) as HTMLDivElement;\n    expect(wrapperDivEl).to.not.equal(null);\n    await assertScreenshot(\n      'checkbox/checkbox-label-background-hover',\n      getClip(el)\n    );\n  });\n\n  //note: sometimes upstream logic sets an empty checkbox label to the name value,\n  //but this is the expected behavior if the label value is still empty,\n  //upon rendering the component\n  it('has no background hover effect when label is empty', async () => {\n    const el: Checkbox = await fixture(html`\n      <temba-checkbox name=\"My Checkbox\"></temba-checkbox>\n    `);\n    expect(el.label).to.equal(null);\n    //the \".wrapper.label\" style results in the background hover effect\n    const wrapperDivEl = el.shadowRoot.querySelector(\n      'div.wrapper.label'\n    ) as HTMLDivElement;\n    expect(wrapperDivEl).to.equal(null);\n    await assertScreenshot(\n      'checkbox/checkbox-no-label-no-background-hover',\n      getClip(el)\n    );\n  });\n\n  it('has no background hover effect when label is whitespace', async () => {\n    const el: Checkbox = await fixture(html`\n      <temba-checkbox name=\"My Checkbox\" label=\" \"></temba-checkbox>\n    `);\n    expect(el.label).to.equal('');\n    //the \".wrapper.label\" style results in the background hover effect\n    const wrapperDivEl = el.shadowRoot.querySelector(\n      'div.wrapper.label'\n    ) as HTMLDivElement;\n    expect(wrapperDivEl).to.equal(null);\n    await assertScreenshot(\n      'checkbox/checkbox-whitespace-label-no-background-hover',\n      getClip(el)\n    );\n  });\n\n  it('submits as boolean without value', async () => {\n    const form = (await fixture(html`\n      <form>\n        <temba-checkbox name=\"my-cb\"></temba-checkbox>\n      </form>\n    `)) as HTMLFormElement;\n\n    // if we didn't click it, it shouldn't be in the form data\n    let data = new FormData(form);\n    expect(data.get('my-cb')).to.equal(null);\n\n    // click our checkbox\n    const checkbox = form.querySelector('temba-checkbox') as Checkbox;\n    await click('temba-checkbox');\n    expect(checkbox.checked).to.equal(true);\n\n    // clicking a non-value checkbox should set it to 1\n    data = new FormData(form);\n    expect(data.get('my-cb')).to.equal('1');\n  });\n\n  it('supports custom values', async () => {\n    const form = (await fixture(html`\n      <form>\n        <temba-checkbox name=\"my-cb\" value=\"3\"></temba-checkbox>\n      </form>\n    `)) as HTMLFormElement;\n\n    // if we didn't click it, it shouldn't be in the form data\n    let data = new FormData(form);\n    expect(data.get('my-cb')).to.equal(null);\n\n    // click our checkbox\n    const checkbox = form.querySelector('temba-checkbox') as Checkbox;\n    await click('temba-checkbox');\n    expect(checkbox.checked).to.equal(true);\n\n    // clicking a non-value checkbox should set it to 1\n    data = new FormData(form);\n    expect(data.get('my-cb')).to.equal('3');\n  });\n\n  it('supports programmtically updated values', async () => {\n    // start with empty value\n    const form = (await fixture(html`\n      <form>\n        <temba-checkbox name=\"my-cb\"></temba-checkbox>\n      </form>\n    `)) as HTMLFormElement;\n\n    // update our value directly\n    const checkbox = form.querySelector('temba-checkbox') as Checkbox;\n    checkbox.value = '5';\n\n    // we set a custom value, but we still aren't checked\n    let data = new FormData(form);\n    expect(data.get('my-cb')).to.equal(null);\n\n    // click our checkbox\n    await click('temba-checkbox');\n    expect(checkbox.checked).to.equal(true);\n\n    // clicking a non-value checkbox should set it to 1\n    data = new FormData(form);\n    expect(data.get('my-cb')).to.equal('5');\n  });\n});\n"]}
+{"version":3,"file":"temba-checkbox.test.js","sourceRoot":"","sources":["../../test/temba-checkbox.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, fixture, expect } from '@open-wc/testing';\nimport { Checkbox } from '../src/form/Checkbox';\nimport { assertScreenshot, getClip } from './utils.test';\n\ndescribe('temba-checkbox', () => {\n  it('renders default checkbox', async () => {\n    const el: Checkbox = await fixture(html`\n      <temba-checkbox label=\"My Checkbox\"></temba-checkbox>\n    `);\n\n    expect(el.label).to.equal('My Checkbox');\n    await assertScreenshot('checkbox/default', getClip(el));\n  });\n\n  it('can select by clicking on the label', async () => {\n    const el: Checkbox = await fixture(html`\n      <temba-checkbox\n        label=\"My Checkbox\"\n        animatechange=\"false\"\n      ></temba-checkbox>\n    `);\n\n    (el.shadowRoot.querySelector('.checkbox-label') as HTMLDivElement).click();\n    expect(el.checked).to.equal(true);\n    await assertScreenshot('checkbox/checked', getClip(el));\n  });\n\n  it('fires change event on click', async () => {\n    // eslint-disable-next-line no-async-promise-executor\n    return new Promise<void>(async (resolve) => {\n      const checkbox: Checkbox = await fixture(html`\n        <temba-checkbox label=\"My Checkbox\"></temba-checkbox>\n      `);\n\n      checkbox.addEventListener('change', () => {\n        resolve();\n      });\n\n      click('temba-checkbox');\n    });\n  });\n\n  it('checks via click method', async () => {\n    const checkbox: Checkbox = await fixture(html`\n      <temba-checkbox label=\"My Checkbox\"></temba-checkbox>\n    `);\n    checkbox.click();\n    expect(checkbox.checked).to.equal(true);\n  });\n\n  it('has background hover effect when label is set', async () => {\n    const el: Checkbox = await fixture(html`\n      <temba-checkbox name=\"My Checkbox\" label=\"My Label\"></temba-checkbox>\n    `);\n    expect(el.label).to.equal('My Label');\n    //the \".wrapper.label\" style results in the background hover effect\n    const wrapperDivEl = el.shadowRoot.querySelector(\n      'div.wrapper.label'\n    ) as HTMLDivElement;\n    expect(wrapperDivEl).to.not.equal(null);\n    await assertScreenshot(\n      'checkbox/checkbox-label-background-hover',\n      getClip(el)\n    );\n  });\n\n  //note: sometimes upstream logic sets an empty checkbox label to the name value,\n  //but this is the expected behavior if the label value is still empty,\n  //upon rendering the component\n  it('has no background hover effect when label is empty', async () => {\n    const el: Checkbox = await fixture(html`\n      <temba-checkbox name=\"My Checkbox\"></temba-checkbox>\n    `);\n    expect(el.label).to.equal(undefined);\n    //the \".wrapper.label\" style results in the background hover effect\n    const wrapperDivEl = el.shadowRoot.querySelector(\n      'div.wrapper.label'\n    ) as HTMLDivElement;\n    expect(wrapperDivEl).to.equal(null);\n    await assertScreenshot(\n      'checkbox/checkbox-no-label-no-background-hover',\n      getClip(el)\n    );\n  });\n\n  it('has no background hover effect when label is whitespace', async () => {\n    const el: Checkbox = await fixture(html`\n      <temba-checkbox name=\"My Checkbox\" label=\" \"></temba-checkbox>\n    `);\n    expect(el.label).to.equal('');\n    //the \".wrapper.label\" style results in the background hover effect\n    const wrapperDivEl = el.shadowRoot.querySelector(\n      'div.wrapper.label'\n    ) as HTMLDivElement;\n    expect(wrapperDivEl).to.equal(null);\n    await assertScreenshot(\n      'checkbox/checkbox-whitespace-label-no-background-hover',\n      getClip(el)\n    );\n  });\n\n  it('submits as boolean without value', async () => {\n    const form = (await fixture(html`\n      <form>\n        <temba-checkbox name=\"my-cb\"></temba-checkbox>\n      </form>\n    `)) as HTMLFormElement;\n\n    // if we didn't click it, it shouldn't be in the form data\n    let data = new FormData(form);\n    expect(data.get('my-cb')).to.equal(null);\n\n    // click our checkbox\n    const checkbox = form.querySelector('temba-checkbox') as Checkbox;\n    await click('temba-checkbox');\n    expect(checkbox.checked).to.equal(true);\n\n    // clicking a non-value checkbox should set it to 1\n    data = new FormData(form);\n    expect(data.get('my-cb')).to.equal('1');\n  });\n\n  it('supports custom values', async () => {\n    const form = (await fixture(html`\n      <form>\n        <temba-checkbox name=\"my-cb\" value=\"3\"></temba-checkbox>\n      </form>\n    `)) as HTMLFormElement;\n\n    // if we didn't click it, it shouldn't be in the form data\n    let data = new FormData(form);\n    expect(data.get('my-cb')).to.equal(null);\n\n    // click our checkbox\n    const checkbox = form.querySelector('temba-checkbox') as Checkbox;\n    await click('temba-checkbox');\n    expect(checkbox.checked).to.equal(true);\n\n    // clicking a non-value checkbox should set it to 1\n    data = new FormData(form);\n    expect(data.get('my-cb')).to.equal('3');\n  });\n\n  it('supports programmtically updated values', async () => {\n    // start with empty value\n    const form = (await fixture(html`\n      <form>\n        <temba-checkbox name=\"my-cb\"></temba-checkbox>\n      </form>\n    `)) as HTMLFormElement;\n\n    // update our value directly\n    const checkbox = form.querySelector('temba-checkbox') as Checkbox;\n    checkbox.value = '5';\n\n    // we set a custom value, but we still aren't checked\n    let data = new FormData(form);\n    expect(data.get('my-cb')).to.equal(null);\n\n    // click our checkbox\n    await click('temba-checkbox');\n    expect(checkbox.checked).to.equal(true);\n\n    // clicking a non-value checkbox should set it to 1\n    data = new FormData(form);\n    expect(data.get('my-cb')).to.equal('5');\n  });\n});\n"]}

package/out-tsc/test/temba-field-config.test.js

@@ -0,0 +1,133 @@
+import { html, fixture, expect } from '@open-wc/testing';
+import '../src/form/KeyValueEditor';
+import '../src/form/ArrayEditor';
+describe('Field Configuration System', () => {
+    describe('KeyValueEditor', () => {
+        it('should render with empty value and always show one empty row', async () => {
+            var _a, _b;
+            const el = await fixture(html `
+        <temba-key-value-editor></temba-key-value-editor>
+      `);
+            expect(el).to.exist;
+            // Should always have at least one row (empty row)
+            const rows = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.row');
+            expect(rows === null || rows === void 0 ? void 0 : rows.length).to.equal(1);
+            // Should not have add button anymore
+            expect((_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.add-btn')).to.not.exist;
+        });
+        it('should render with initial values and maintain empty row', async () => {
+            var _a;
+            const initialValue = {
+                'Content-Type': 'application/json',
+                Authorization: 'Bearer token123'
+            };
+            const el = await fixture(html `
+        <temba-key-value-editor .value=${initialValue}></temba-key-value-editor>
+      `);
+            expect(el).to.exist;
+            // Should have 2 data rows + 1 empty row = 3 total
+            const rows = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.row');
+            expect(rows === null || rows === void 0 ? void 0 : rows.length).to.equal(3);
+        });
+        it('should emit clean values without empty rows', async () => {
+            var _a;
+            const el = await fixture(html `
+        <temba-key-value-editor></temba-key-value-editor>
+      `);
+            let changeEvent = null;
+            el.addEventListener('change', (e) => {
+                changeEvent = e;
+            });
+            // Trigger a field change that should cause an update
+            const keyInput = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('temba-textinput');
+            if (keyInput) {
+                keyInput.value = 'test-key';
+                keyInput.dispatchEvent(new Event('change'));
+            }
+            await el.updateComplete;
+            expect(changeEvent).to.exist;
+            // Should emit the array format with key-value pairs
+            expect(changeEvent.detail.value).to.be.an('array');
+            expect(changeEvent.detail.value).to.deep.include({
+                key: 'test-key',
+                value: ''
+            });
+        });
+        it('should hide remove button for empty rows', async () => {
+            var _a, _b, _c, _d;
+            const initialValue = {
+                'Content-Type': 'application/json'
+            };
+            const el = await fixture(html `
+        <temba-key-value-editor .value=${initialValue}></temba-key-value-editor>
+      `);
+            expect(el).to.exist;
+            const rows = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.row');
+            expect(rows === null || rows === void 0 ? void 0 : rows.length).to.equal(2); // 1 data row + 1 empty row
+            // First row (with data) should have remove button
+            const firstRowRemoveBtn = (_b = rows === null || rows === void 0 ? void 0 : rows[0]) === null || _b === void 0 ? void 0 : _b.querySelector('.remove-btn');
+            expect(firstRowRemoveBtn).to.exist;
+            // Second row (empty) should have spacer instead of remove button
+            const secondRowRemoveBtn = (_c = rows === null || rows === void 0 ? void 0 : rows[1]) === null || _c === void 0 ? void 0 : _c.querySelector('.remove-btn');
+            const secondRowSpacer = (_d = rows === null || rows === void 0 ? void 0 : rows[1]) === null || _d === void 0 ? void 0 : _d.querySelector('.remove-btn-spacer');
+            expect(secondRowRemoveBtn).to.not.exist;
+            expect(secondRowSpacer).to.exist;
+        });
+        it('should show remove button when empty row gets content', async () => {
+            var _a, _b, _c, _d, _e, _f;
+            const el = await fixture(html `
+        <temba-key-value-editor></temba-key-value-editor>
+      `);
+            // Initially should have no remove button (empty row)
+            let rows = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.row');
+            expect((_b = rows === null || rows === void 0 ? void 0 : rows[0]) === null || _b === void 0 ? void 0 : _b.querySelector('.remove-btn')).to.not.exist;
+            expect((_c = rows === null || rows === void 0 ? void 0 : rows[0]) === null || _c === void 0 ? void 0 : _c.querySelector('.remove-btn-spacer')).to.exist;
+            // Simulate adding content by setting value and triggering update
+            el.value = { 'test-key': '' };
+            el.requestUpdate();
+            await el.updateComplete;
+            // Now should have remove button for the row with content
+            rows = (_d = el.shadowRoot) === null || _d === void 0 ? void 0 : _d.querySelectorAll('.row');
+            expect(rows === null || rows === void 0 ? void 0 : rows.length).to.equal(2); // row with content + empty row
+            expect((_e = rows === null || rows === void 0 ? void 0 : rows[0]) === null || _e === void 0 ? void 0 : _e.querySelector('.remove-btn')).to.exist;
+            expect((_f = rows === null || rows === void 0 ? void 0 : rows[1]) === null || _f === void 0 ? void 0 : _f.querySelector('.remove-btn-spacer')).to.exist;
+        });
+    });
+    describe('ArrayEditor', () => {
+        it('should render with empty array', async () => {
+            var _a;
+            const itemConfig = {
+                name: { type: 'text', label: 'Name', required: true },
+                value: { type: 'text', label: 'Value' }
+            };
+            const el = await fixture(html `
+        <temba-array-editor .itemConfig=${itemConfig}></temba-array-editor>
+      `);
+            await el.updateComplete;
+            expect(el).to.exist;
+            expect((_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.add-btn')).to.exist;
+        });
+        it('should render with initial items', async () => {
+            var _a;
+            const itemConfig = {
+                operator: { type: 'text', label: 'Operator' },
+                value: { type: 'text', label: 'Value' }
+            };
+            const initialValue = [
+                { operator: 'equals', value: 'test' },
+                { operator: 'contains', value: 'example' }
+            ];
+            const el = await fixture(html `
+        <temba-array-editor
+          .value=${initialValue}
+          .itemConfig=${itemConfig}
+          itemLabel="Rule"
+        ></temba-array-editor>
+      `);
+            expect(el).to.exist;
+            const items = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.array-item');
+            expect(items === null || items === void 0 ? void 0 : items.length).to.equal(2);
+        });
+    });
+});
+//# sourceMappingURL=temba-field-config.test.js.map

package/out-tsc/test/temba-field-config.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"temba-field-config.test.js","sourceRoot":"","sources":["../../test/temba-field-config.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, fixture, expect } from '@open-wc/testing';\nimport '../src/form/KeyValueEditor';\nimport '../src/form/ArrayEditor';\n\ndescribe('Field Configuration System', () => {\n  describe('KeyValueEditor', () => {\n    it('should render with empty value and always show one empty row', async () => {\n      const el = await fixture(html`\n        <temba-key-value-editor></temba-key-value-editor>\n      `);\n\n      expect(el).to.exist;\n      // Should always have at least one row (empty row)\n      const rows = el.shadowRoot?.querySelectorAll('.row');\n      expect(rows?.length).to.equal(1);\n      // Should not have add button anymore\n      expect(el.shadowRoot?.querySelector('.add-btn')).to.not.exist;\n    });\n\n    it('should render with initial values and maintain empty row', async () => {\n      const initialValue = {\n        'Content-Type': 'application/json',\n        Authorization: 'Bearer token123'\n      };\n\n      const el = await fixture(html`\n        <temba-key-value-editor .value=${initialValue}></temba-key-value-editor>\n      `);\n\n      expect(el).to.exist;\n      // Should have 2 data rows + 1 empty row = 3 total\n      const rows = el.shadowRoot?.querySelectorAll('.row');\n      expect(rows?.length).to.equal(3);\n    });\n\n    it('should emit clean values without empty rows', async () => {\n      const el = await fixture(html`\n        <temba-key-value-editor></temba-key-value-editor>\n      `);\n\n      let changeEvent: any = null;\n      el.addEventListener('change', (e) => {\n        changeEvent = e;\n      });\n\n      // Trigger a field change that should cause an update\n      const keyInput = el.shadowRoot?.querySelector('temba-textinput') as any;\n      if (keyInput) {\n        keyInput.value = 'test-key';\n        keyInput.dispatchEvent(new Event('change'));\n      }\n\n      await (el as any).updateComplete;\n\n      expect(changeEvent).to.exist;\n      // Should emit the array format with key-value pairs\n      expect(changeEvent.detail.value).to.be.an('array');\n      expect(changeEvent.detail.value).to.deep.include({\n        key: 'test-key',\n        value: ''\n      });\n    });\n\n    it('should hide remove button for empty rows', async () => {\n      const initialValue = {\n        'Content-Type': 'application/json'\n      };\n\n      const el = await fixture(html`\n        <temba-key-value-editor .value=${initialValue}></temba-key-value-editor>\n      `);\n\n      expect(el).to.exist;\n      const rows = el.shadowRoot?.querySelectorAll('.row');\n      expect(rows?.length).to.equal(2); // 1 data row + 1 empty row\n\n      // First row (with data) should have remove button\n      const firstRowRemoveBtn = rows?.[0]?.querySelector('.remove-btn');\n      expect(firstRowRemoveBtn).to.exist;\n\n      // Second row (empty) should have spacer instead of remove button\n      const secondRowRemoveBtn = rows?.[1]?.querySelector('.remove-btn');\n      const secondRowSpacer = rows?.[1]?.querySelector('.remove-btn-spacer');\n      expect(secondRowRemoveBtn).to.not.exist;\n      expect(secondRowSpacer).to.exist;\n    });\n\n    it('should show remove button when empty row gets content', async () => {\n      const el = await fixture(html`\n        <temba-key-value-editor></temba-key-value-editor>\n      `);\n\n      // Initially should have no remove button (empty row)\n      let rows = el.shadowRoot?.querySelectorAll('.row');\n      expect(rows?.[0]?.querySelector('.remove-btn')).to.not.exist;\n      expect(rows?.[0]?.querySelector('.remove-btn-spacer')).to.exist;\n\n      // Simulate adding content by setting value and triggering update\n      (el as any).value = { 'test-key': '' };\n      (el as any).requestUpdate();\n      await (el as any).updateComplete;\n\n      // Now should have remove button for the row with content\n      rows = el.shadowRoot?.querySelectorAll('.row');\n      expect(rows?.length).to.equal(2); // row with content + empty row\n      expect(rows?.[0]?.querySelector('.remove-btn')).to.exist;\n      expect(rows?.[1]?.querySelector('.remove-btn-spacer')).to.exist;\n    });\n  });\n\n  describe('ArrayEditor', () => {\n    it('should render with empty array', async () => {\n      const itemConfig = {\n        name: { type: 'text', label: 'Name', required: true },\n        value: { type: 'text', label: 'Value' }\n      };\n\n      const el = await fixture(html`\n        <temba-array-editor .itemConfig=${itemConfig}></temba-array-editor>\n      `);\n\n      await (el as any).updateComplete;\n\n      expect(el).to.exist;\n      expect(el.shadowRoot?.querySelector('.add-btn')).to.exist;\n    });\n\n    it('should render with initial items', async () => {\n      const itemConfig = {\n        operator: { type: 'text', label: 'Operator' },\n        value: { type: 'text', label: 'Value' }\n      };\n\n      const initialValue = [\n        { operator: 'equals', value: 'test' },\n        { operator: 'contains', value: 'example' }\n      ];\n\n      const el = await fixture(html`\n        <temba-array-editor\n          .value=${initialValue}\n          .itemConfig=${itemConfig}\n          itemLabel=\"Rule\"\n        ></temba-array-editor>\n      `);\n\n      expect(el).to.exist;\n      const items = el.shadowRoot?.querySelectorAll('.array-item');\n      expect(items?.length).to.equal(2);\n    });\n  });\n});\n"]}