@nyaruka/temba-components 0.129.2 → 0.129.4

package/out-tsc/test/temba-node-editor.test.js

@@ -0,0 +1,283 @@
+import '../temba-modules';
+import { html, fixture, expect } from '@open-wc/testing';
+import { assertScreenshot, getClip } from './utils.test';
+const assertDialogScreenshot = async (el, screenshotName) => {
+    const dialog = el.shadowRoot
+        .querySelector('temba-dialog')
+        .shadowRoot.querySelector('.dialog-container');
+    await assertScreenshot(screenshotName, getClip(dialog));
+};
+describe('temba-node-editor', () => {
+    it('can be created', async () => {
+        const el = (await fixture(html `
+      <temba-node-editor .isOpen=${true}></temba-node-editor>
+    `));
+        expect(el).to.exist;
+        expect(el.tagName).to.equal('TEMBA-NODE-EDITOR');
+    });
+    it('renders send_msg action', async () => {
+        const action = {
+            uuid: 'test-action-uuid',
+            type: 'send_msg',
+            text: 'Hello world',
+            quick_replies: []
+        };
+        const el = (await fixture(html `
+      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>
+    `));
+        await el.updateComplete;
+        expect(el.shadowRoot).to.not.be.null;
+        expect(el.action).to.equal(action);
+    });
+    it('renders set_run_result action', async () => {
+        const action = {
+            uuid: 'test-action-uuid',
+            type: 'set_run_result',
+            name: 'result_name',
+            value: 'result_value'
+        };
+        const el = (await fixture(html `
+      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>
+    `));
+        await el.updateComplete;
+        expect(el.shadowRoot).to.not.be.null;
+        expect(el.action).to.equal(action);
+    });
+    it('renders set_contact_field action', async () => {
+        const action = {
+            uuid: 'test-action-uuid',
+            type: 'set_contact_field',
+            field: { key: 'age', name: 'Age' },
+            value: '25'
+        };
+        const el = (await fixture(html `
+      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>
+    `));
+        await el.updateComplete;
+        expect(el.shadowRoot).to.not.be.null;
+        expect(el.action).to.equal(action);
+    });
+    it('renders add_contact_groups action', async () => {
+        const action = {
+            uuid: 'test-action-uuid',
+            type: 'add_contact_groups',
+            groups: [{ uuid: 'group-1', name: 'Test Group' }]
+        };
+        const el = (await fixture(html `
+      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>
+    `));
+        await el.updateComplete;
+        expect(el.shadowRoot).to.not.be.null;
+        expect(el.action).to.equal(action);
+    });
+    it('renders enter_flow action', async () => {
+        const action = {
+            uuid: 'test-action-uuid',
+            type: 'enter_flow',
+            flow: { uuid: 'flow-1', name: 'Sub Flow' }
+        };
+        const el = (await fixture(html `
+      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>
+    `));
+        await el.updateComplete;
+        expect(el.shadowRoot).to.not.be.null;
+        expect(el.action).to.equal(action);
+    });
+    it('renders node with router configuration', async () => {
+        const node = {
+            uuid: 'test-node-uuid',
+            actions: [],
+            exits: [{ uuid: 'exit-1', name: 'Default' }],
+            router: {
+                type: 'switch',
+                result_name: 'result',
+                categories: [{ uuid: 'cat-1', name: 'Category 1', exit_uuid: 'exit-1' }]
+            }
+        };
+        const nodeUI = {
+            type: 'split_by_expression',
+            position: { left: 100, top: 100 }
+        };
+        const el = (await fixture(html `
+      <temba-node-editor
+        .node=${node}
+        .nodeUI=${nodeUI}
+        .isOpen=${true}
+      ></temba-node-editor>
+    `));
+        await el.updateComplete;
+        expect(el.shadowRoot).to.not.be.null;
+        expect(el.node).to.equal(node);
+        expect(el.nodeUI).to.equal(nodeUI);
+        await assertDialogScreenshot(el, 'editor/router');
+    });
+    it('renders node with wait configuration', async () => {
+        const node = {
+            uuid: 'test-node-uuid',
+            actions: [],
+            exits: [{ uuid: 'exit-1', name: 'Default' }],
+            wait: {
+                type: 'msg'
+            }
+        };
+        const nodeUI = {
+            type: 'wait_for_response',
+            position: { left: 100, top: 100 }
+        };
+        const el = (await fixture(html `
+      <temba-node-editor
+        .node=${node}
+        .nodeUI=${nodeUI}
+        .isOpen=${true}
+      ></temba-node-editor>
+    `));
+        await el.updateComplete;
+        expect(el.shadowRoot).to.not.be.null;
+        expect(el.node).to.equal(node);
+        expect(el.nodeUI).to.equal(nodeUI);
+        await assertDialogScreenshot(el, 'editor/wait');
+    });
+    it('handles different button actions', async () => {
+        const action = {
+            uuid: 'test-action-uuid',
+            type: 'send_msg',
+            text: 'Hello world',
+            quick_replies: []
+        };
+        const el = (await fixture(html `
+      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>
+    `));
+        await el.updateComplete;
+        let saveEventFired = false;
+        let cancelEventFired = false;
+        el.addEventListener('temba-action-saved', () => {
+            saveEventFired = true;
+        });
+        el.addEventListener('temba-node-edit-cancelled', () => {
+            cancelEventFired = true;
+        });
+        // Get the dialog element inside the node editor
+        const dialog = el.shadowRoot.querySelector('temba-dialog');
+        expect(dialog).to.not.be.null;
+        // Test Save button by dispatching event on the dialog
+        const saveEvent = new CustomEvent('temba-button-clicked', {
+            detail: { button: { name: 'Save' } },
+            bubbles: true
+        });
+        dialog.dispatchEvent(saveEvent);
+        expect(saveEventFired).to.equal(true);
+        // Reset for cancel test
+        saveEventFired = false;
+        // Test Cancel button
+        const cancelEvent = new CustomEvent('temba-button-clicked', {
+            detail: { button: { name: 'Cancel' } },
+            bubbles: true
+        });
+        dialog.dispatchEvent(cancelEvent);
+        expect(cancelEventFired).to.equal(true);
+    });
+    it('handles property updates', async () => {
+        const el = (await fixture(html `
+      <temba-node-editor .isOpen=${true}></temba-node-editor>
+    `));
+        // Test action property update
+        const action = {
+            uuid: 'test-action-uuid',
+            type: 'send_msg',
+            text: 'Hello world',
+            quick_replies: []
+        };
+        el.action = action;
+        await el.updateComplete;
+        expect(el.action).to.equal(action);
+        // Test node property update
+        const node = {
+            uuid: 'test-node-uuid',
+            actions: [],
+            exits: []
+        };
+        el.node = node;
+        await el.updateComplete;
+        expect(el.node).to.equal(node);
+        // Test nodeUI property update
+        const nodeUI = {
+            type: 'execute_actions',
+            position: { left: 100, top: 100 }
+        };
+        el.nodeUI = nodeUI;
+        await el.updateComplete;
+        expect(el.nodeUI).to.equal(nodeUI);
+    });
+    it('handles form submission events', async () => {
+        const action = {
+            uuid: 'test-action-uuid',
+            type: 'send_msg',
+            text: 'Hello world',
+            quick_replies: []
+        };
+        const el = (await fixture(html `
+      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>
+    `));
+        await el.updateComplete;
+        // Since the form submission handling is complex and involves internal components,
+        // we'll just verify the component renders without errors and has the expected structure
+        const shadowRoot = el.shadowRoot;
+        expect(shadowRoot).to.not.be.null;
+        // Verify dialog is present
+        const dialog = shadowRoot.querySelector('temba-dialog');
+        expect(dialog).to.not.be.null;
+    });
+    it('handles form validation', async () => {
+        const action = {
+            uuid: 'test-action-uuid',
+            type: 'send_msg',
+            text: 'Hello world',
+            quick_replies: []
+        };
+        const el = (await fixture(html `
+      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>
+    `));
+        await el.updateComplete;
+        // Test that the component renders form elements
+        const shadowRoot = el.shadowRoot;
+        expect(shadowRoot).to.not.be.null;
+    });
+    it('renders different action types correctly', async () => {
+        const actionTypes = [
+            {
+                type: 'send_msg',
+                data: { text: 'Message', quick_replies: [] }
+            },
+            {
+                type: 'set_run_result',
+                data: { name: 'result', value: 'value' }
+            },
+            {
+                type: 'set_contact_name',
+                data: { name: 'John Doe' }
+            },
+            {
+                type: 'set_contact_language',
+                data: { language: 'eng' }
+            }
+        ];
+        for (const actionType of actionTypes) {
+            const action = {
+                uuid: `test-${actionType.type}`,
+                type: actionType.type,
+                ...actionType.data
+            };
+            const el = (await fixture(html `
+        <temba-node-editor
+          .action=${action}
+          .isOpen=${true}
+        ></temba-node-editor>
+      `));
+            await el.updateComplete;
+            expect(el.shadowRoot).to.not.be.null;
+            expect(el.action.type).to.equal(actionType.type);
+            await assertDialogScreenshot(el, `editor/${actionType.type}`);
+        }
+    });
+});
+//# sourceMappingURL=temba-node-editor.test.js.map

package/out-tsc/test/temba-node-editor.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"temba-node-editor.test.js","sourceRoot":"","sources":["../../test/temba-node-editor.test.ts"],"names":[],"mappings":"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","sourcesContent":["import '../temba-modules';\nimport { html, fixture, expect } from '@open-wc/testing';\nimport { assertScreenshot, getClip } from './utils.test';\n\n// Define interface for NodeEditor component\ninterface NodeEditorElement extends HTMLElement {\n  action?: any;\n  node?: any;\n  nodeUI?: any;\n  isOpen?: boolean;\n  updateComplete: Promise<boolean>;\n}\n\nconst assertDialogScreenshot = async (\n  el: NodeEditorElement,\n  screenshotName: string\n) => {\n  const dialog = el.shadowRoot\n    .querySelector('temba-dialog')\n    .shadowRoot.querySelector('.dialog-container') as HTMLElement;\n  await assertScreenshot(screenshotName, getClip(dialog));\n};\n\ndescribe('temba-node-editor', () => {\n  it('can be created', async () => {\n    const el = (await fixture(html`\n      <temba-node-editor .isOpen=${true}></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    expect(el).to.exist;\n    expect(el.tagName).to.equal('TEMBA-NODE-EDITOR');\n  });\n\n  it('renders send_msg action', async () => {\n    const action = {\n      uuid: 'test-action-uuid',\n      type: 'send_msg',\n      text: 'Hello world',\n      quick_replies: []\n    };\n\n    const el = (await fixture(html`\n      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    await el.updateComplete;\n    expect(el.shadowRoot).to.not.be.null;\n    expect(el.action).to.equal(action);\n  });\n\n  it('renders set_run_result action', async () => {\n    const action = {\n      uuid: 'test-action-uuid',\n      type: 'set_run_result',\n      name: 'result_name',\n      value: 'result_value'\n    };\n\n    const el = (await fixture(html`\n      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    await el.updateComplete;\n    expect(el.shadowRoot).to.not.be.null;\n    expect(el.action).to.equal(action);\n  });\n\n  it('renders set_contact_field action', async () => {\n    const action = {\n      uuid: 'test-action-uuid',\n      type: 'set_contact_field',\n      field: { key: 'age', name: 'Age' },\n      value: '25'\n    };\n\n    const el = (await fixture(html`\n      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    await el.updateComplete;\n    expect(el.shadowRoot).to.not.be.null;\n    expect(el.action).to.equal(action);\n  });\n\n  it('renders add_contact_groups action', async () => {\n    const action = {\n      uuid: 'test-action-uuid',\n      type: 'add_contact_groups',\n      groups: [{ uuid: 'group-1', name: 'Test Group' }]\n    };\n\n    const el = (await fixture(html`\n      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    await el.updateComplete;\n    expect(el.shadowRoot).to.not.be.null;\n    expect(el.action).to.equal(action);\n  });\n\n  it('renders enter_flow action', async () => {\n    const action = {\n      uuid: 'test-action-uuid',\n      type: 'enter_flow',\n      flow: { uuid: 'flow-1', name: 'Sub Flow' }\n    };\n\n    const el = (await fixture(html`\n      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    await el.updateComplete;\n    expect(el.shadowRoot).to.not.be.null;\n    expect(el.action).to.equal(action);\n  });\n\n  it('renders node with router configuration', async () => {\n    const node = {\n      uuid: 'test-node-uuid',\n      actions: [],\n      exits: [{ uuid: 'exit-1', name: 'Default' }],\n      router: {\n        type: 'switch',\n        result_name: 'result',\n        categories: [{ uuid: 'cat-1', name: 'Category 1', exit_uuid: 'exit-1' }]\n      }\n    };\n\n    const nodeUI = {\n      type: 'split_by_expression',\n      position: { left: 100, top: 100 }\n    };\n\n    const el = (await fixture(html`\n      <temba-node-editor\n        .node=${node}\n        .nodeUI=${nodeUI}\n        .isOpen=${true}\n      ></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    await el.updateComplete;\n    expect(el.shadowRoot).to.not.be.null;\n    expect(el.node).to.equal(node);\n    expect(el.nodeUI).to.equal(nodeUI);\n\n    await assertDialogScreenshot(el, 'editor/router');\n  });\n\n  it('renders node with wait configuration', async () => {\n    const node = {\n      uuid: 'test-node-uuid',\n      actions: [],\n      exits: [{ uuid: 'exit-1', name: 'Default' }],\n      wait: {\n        type: 'msg'\n      }\n    };\n\n    const nodeUI = {\n      type: 'wait_for_response',\n      position: { left: 100, top: 100 }\n    };\n\n    const el = (await fixture(html`\n      <temba-node-editor\n        .node=${node}\n        .nodeUI=${nodeUI}\n        .isOpen=${true}\n      ></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    await el.updateComplete;\n    expect(el.shadowRoot).to.not.be.null;\n    expect(el.node).to.equal(node);\n    expect(el.nodeUI).to.equal(nodeUI);\n\n    await assertDialogScreenshot(el, 'editor/wait');\n  });\n\n  it('handles different button actions', async () => {\n    const action = {\n      uuid: 'test-action-uuid',\n      type: 'send_msg',\n      text: 'Hello world',\n      quick_replies: []\n    };\n\n    const el = (await fixture(html`\n      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    await el.updateComplete;\n\n    let saveEventFired = false;\n    let cancelEventFired = false;\n\n    el.addEventListener('temba-action-saved', () => {\n      saveEventFired = true;\n    });\n\n    el.addEventListener('temba-node-edit-cancelled', () => {\n      cancelEventFired = true;\n    });\n\n    // Get the dialog element inside the node editor\n    const dialog = el.shadowRoot!.querySelector('temba-dialog');\n    expect(dialog).to.not.be.null;\n\n    // Test Save button by dispatching event on the dialog\n    const saveEvent = new CustomEvent('temba-button-clicked', {\n      detail: { button: { name: 'Save' } },\n      bubbles: true\n    });\n    dialog!.dispatchEvent(saveEvent);\n    expect(saveEventFired).to.equal(true);\n\n    // Reset for cancel test\n    saveEventFired = false;\n\n    // Test Cancel button\n    const cancelEvent = new CustomEvent('temba-button-clicked', {\n      detail: { button: { name: 'Cancel' } },\n      bubbles: true\n    });\n    dialog!.dispatchEvent(cancelEvent);\n    expect(cancelEventFired).to.equal(true);\n  });\n\n  it('handles property updates', async () => {\n    const el = (await fixture(html`\n      <temba-node-editor .isOpen=${true}></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    // Test action property update\n    const action = {\n      uuid: 'test-action-uuid',\n      type: 'send_msg',\n      text: 'Hello world',\n      quick_replies: []\n    };\n\n    el.action = action;\n    await el.updateComplete;\n    expect(el.action).to.equal(action);\n\n    // Test node property update\n    const node = {\n      uuid: 'test-node-uuid',\n      actions: [],\n      exits: []\n    };\n\n    el.node = node;\n    await el.updateComplete;\n    expect(el.node).to.equal(node);\n\n    // Test nodeUI property update\n    const nodeUI = {\n      type: 'execute_actions',\n      position: { left: 100, top: 100 }\n    };\n\n    el.nodeUI = nodeUI;\n    await el.updateComplete;\n    expect(el.nodeUI).to.equal(nodeUI);\n  });\n\n  it('handles form submission events', async () => {\n    const action = {\n      uuid: 'test-action-uuid',\n      type: 'send_msg',\n      text: 'Hello world',\n      quick_replies: []\n    };\n\n    const el = (await fixture(html`\n      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    await el.updateComplete;\n\n    // Since the form submission handling is complex and involves internal components,\n    // we'll just verify the component renders without errors and has the expected structure\n    const shadowRoot = el.shadowRoot;\n    expect(shadowRoot).to.not.be.null;\n\n    // Verify dialog is present\n    const dialog = shadowRoot!.querySelector('temba-dialog');\n    expect(dialog).to.not.be.null;\n  });\n\n  it('handles form validation', async () => {\n    const action = {\n      uuid: 'test-action-uuid',\n      type: 'send_msg',\n      text: 'Hello world',\n      quick_replies: []\n    };\n\n    const el = (await fixture(html`\n      <temba-node-editor .action=${action} .isOpen=${true}></temba-node-editor>\n    `)) as NodeEditorElement;\n\n    await el.updateComplete;\n\n    // Test that the component renders form elements\n    const shadowRoot = el.shadowRoot;\n    expect(shadowRoot).to.not.be.null;\n  });\n\n  it('renders different action types correctly', async () => {\n    const actionTypes = [\n      {\n        type: 'send_msg',\n        data: { text: 'Message', quick_replies: [] }\n      },\n      {\n        type: 'set_run_result',\n        data: { name: 'result', value: 'value' }\n      },\n      {\n        type: 'set_contact_name',\n        data: { name: 'John Doe' }\n      },\n      {\n        type: 'set_contact_language',\n        data: { language: 'eng' }\n      }\n    ];\n\n    for (const actionType of actionTypes) {\n      const action = {\n        uuid: `test-${actionType.type}`,\n        type: actionType.type,\n        ...actionType.data\n      };\n\n      const el = (await fixture(html`\n        <temba-node-editor\n          .action=${action}\n          .isOpen=${true}\n        ></temba-node-editor>\n      `)) as NodeEditorElement;\n\n      await el.updateComplete;\n      expect(el.shadowRoot).to.not.be.null;\n      expect(el.action.type).to.equal(actionType.type);\n\n      await assertDialogScreenshot(el, `editor/${actionType.type}`);\n    }\n  });\n});\n"]}

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

@@ -1,5 +1,5 @@
 import { fixture, assert } from '@open-wc/testing';
-import { Omnibox } from '../src/omnibox/Omnibox';
+import { Omnibox } from '../src/form/select/Omnibox';
 import { assertScreenshot, getClip, openAndClick } from './utils.test';
 import { useFakeTimers, spy } from 'sinon';
 export const getHTML = (attrs = { name: 'recipients' }) => {

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

@@ -1 +1 @@
-{"version":3,"file":"temba-omnibox.test.js","sourceRoot":"","sources":["../../test/temba-omnibox.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { fixture, assert } from '@open-wc/testing';\nimport { Omnibox } from '../src/omnibox/Omnibox';\nimport { assertScreenshot, getClip, openAndClick } from './utils.test';\nimport { useFakeTimers, spy } from 'sinon';\n\nexport const getHTML = (attrs: any = { name: 'recipients' }): string => {\n  const selectHTML = `\n  <temba-omnibox${Object.keys(attrs)\n    .map((name: string) => {\n      // check if it's a string attribute\n      if (typeof attrs[name] === 'string') {\n        return ` ${name}=\"${attrs[name].replace(/\"/g, '&quot;')}\"`;\n      }\n      return ` ${name}=\"${attrs[name]}\"`;\n    })\n    .join(' ')}>\n  </temba-select>`;\n  return selectHTML;\n};\n\nexport const createOmnibox = async (\n  clock: any,\n  attrs: any = {}\n): Promise<Omnibox> => {\n  const parentNode = document.createElement('div');\n  parentNode.setAttribute('style', 'width: 400px;');\n\n  const omnibox: Omnibox = await fixture(getHTML(attrs), { parentNode });\n  clock.runAll();\n  await omnibox.updateComplete;\n  return omnibox;\n};\n\ndescribe('temba-omnibox', () => {\n  let clock: any;\n  beforeEach(function () {\n    clock = useFakeTimers();\n    setViewport({ width: 500, height: 1000, deviceScaleFactor: 2 });\n  });\n\n  afterEach(function () {\n    clock.restore();\n  });\n\n  it('can be created', async () => {\n    const omnibox: Omnibox = await fixture(\n      getHTML({ endpoint: '/test-assets/select/omnibox.json' })\n    );\n    assert.instanceOf(omnibox, Omnibox);\n  });\n\n  it('fires change events on selection', async () => {\n    const omnibox: Omnibox = await createOmnibox(clock, {\n      endpoint: '/test-assets/select/omnibox.json'\n    });\n\n    const changeEvent = spy();\n    omnibox.addEventListener('change', changeEvent);\n\n    clock.runAll();\n    await omnibox.updateComplete;\n    clock.runAll();\n\n    await openAndClick(clock, omnibox, 0);\n    clock.runAll();\n    assert(changeEvent.called, 'change event not fired');\n\n    await assertScreenshot('omnibox/selected', getClip(omnibox));\n  });\n});\n"]}
+{"version":3,"file":"temba-omnibox.test.js","sourceRoot":"","sources":["../../test/temba-omnibox.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { fixture, assert } from '@open-wc/testing';\nimport { Omnibox } from '../src/form/select/Omnibox';\nimport { assertScreenshot, getClip, openAndClick } from './utils.test';\nimport { useFakeTimers, spy } from 'sinon';\n\nexport const getHTML = (attrs: any = { name: 'recipients' }): string => {\n  const selectHTML = `\n  <temba-omnibox${Object.keys(attrs)\n    .map((name: string) => {\n      // check if it's a string attribute\n      if (typeof attrs[name] === 'string') {\n        return ` ${name}=\"${attrs[name].replace(/\"/g, '&quot;')}\"`;\n      }\n      return ` ${name}=\"${attrs[name]}\"`;\n    })\n    .join(' ')}>\n  </temba-select>`;\n  return selectHTML;\n};\n\nexport const createOmnibox = async (\n  clock: any,\n  attrs: any = {}\n): Promise<Omnibox> => {\n  const parentNode = document.createElement('div');\n  parentNode.setAttribute('style', 'width: 400px;');\n\n  const omnibox: Omnibox = await fixture(getHTML(attrs), { parentNode });\n  clock.runAll();\n  await omnibox.updateComplete;\n  return omnibox;\n};\n\ndescribe('temba-omnibox', () => {\n  let clock: any;\n  beforeEach(function () {\n    clock = useFakeTimers();\n    setViewport({ width: 500, height: 1000, deviceScaleFactor: 2 });\n  });\n\n  afterEach(function () {\n    clock.restore();\n  });\n\n  it('can be created', async () => {\n    const omnibox: Omnibox = await fixture(\n      getHTML({ endpoint: '/test-assets/select/omnibox.json' })\n    );\n    assert.instanceOf(omnibox, Omnibox);\n  });\n\n  it('fires change events on selection', async () => {\n    const omnibox: Omnibox = await createOmnibox(clock, {\n      endpoint: '/test-assets/select/omnibox.json'\n    });\n\n    const changeEvent = spy();\n    omnibox.addEventListener('change', changeEvent);\n\n    clock.runAll();\n    await omnibox.updateComplete;\n    clock.runAll();\n\n    await openAndClick(clock, omnibox, 0);\n    clock.runAll();\n    assert(changeEvent.called, 'change event not fired');\n\n    await assertScreenshot('omnibox/selected', getClip(omnibox));\n  });\n});\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"temba-options.test.js","sourceRoot":"","sources":["../../test/temba-options.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAE3C,OAAO,EAAE,gBAAgB,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAElE,MAAM,MAAM,GAAG;IACb,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE;IAC3B,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,EAAE;IAC7B,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE;CAC7B,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,QAAa,EAAE,EAAU,EAAE;IACxD,OAAO,OAAO,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC;AACzC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,EAAE,GAAW,EAAE,EAAE;IACjD,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACjD,UAAU,CAAC,YAAY,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;IAClD,OAAO,CAAC,MAAM,OAAO,CAAC,GAAG,EAAE,EAAE,UAAU,EAAE,CAAC,CAAY,CAAC;AACzD,CAAC,CAAC;AAEF,QAAQ,CAAC,2BAA2B,EAAE,GAAG,EAAE;IACzC,EAAE,CAAC,oBAAoB,EAAE,KAAK,IAAI,EAAE;QAClC,MAAM,OAAO,GAAY,MAAM,aAAa,CAC1C,cAAc,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAC/C,CAAC;QACF,OAAO,CAAC,OAAO,GAAG,MAAM,CAAC;QACzB,MAAM,OAAO,CAAC,cAAc,CAAC;QAC7B,MAAM,gBAAgB,CAAC,eAAe,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IAC5D,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { fixture } from '@open-wc/testing';\nimport { Options } from '../src/options/Options';\nimport { assertScreenshot, getClip, getHTML } from './utils.test';\n\nconst colors = [\n  { name: 'Red', value: '0' },\n  { name: 'Green', value: '1' },\n  { name: 'Blue', value: '2' }\n];\n\nexport const getOptionsHTML = (attrs: any = {}): string => {\n  return getHTML('temba-options', attrs);\n};\n\nexport const createOptions = async (def: string) => {\n  const parentNode = document.createElement('div');\n  parentNode.setAttribute('style', 'width: 250px;');\n  return (await fixture(def, { parentNode })) as Options;\n};\n\ndescribe('temba-options-screenshots', () => {\n  it('renders block mode', async () => {\n    const options: Options = await createOptions(\n      getOptionsHTML({ block: true, visible: true })\n    );\n    options.options = colors;\n    await options.updateComplete;\n    await assertScreenshot('options/block', getClip(options));\n  });\n});\n"]}
+{"version":3,"file":"temba-options.test.js","sourceRoot":"","sources":["../../test/temba-options.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAE3C,OAAO,EAAE,gBAAgB,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAElE,MAAM,MAAM,GAAG;IACb,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE;IAC3B,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,EAAE;IAC7B,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE;CAC7B,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,QAAa,EAAE,EAAU,EAAE;IACxD,OAAO,OAAO,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC;AACzC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,EAAE,GAAW,EAAE,EAAE;IACjD,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACjD,UAAU,CAAC,YAAY,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;IAClD,OAAO,CAAC,MAAM,OAAO,CAAC,GAAG,EAAE,EAAE,UAAU,EAAE,CAAC,CAAY,CAAC;AACzD,CAAC,CAAC;AAEF,QAAQ,CAAC,2BAA2B,EAAE,GAAG,EAAE;IACzC,EAAE,CAAC,oBAAoB,EAAE,KAAK,IAAI,EAAE;QAClC,MAAM,OAAO,GAAY,MAAM,aAAa,CAC1C,cAAc,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAC/C,CAAC;QACF,OAAO,CAAC,OAAO,GAAG,MAAM,CAAC;QACzB,MAAM,OAAO,CAAC,cAAc,CAAC;QAC7B,MAAM,gBAAgB,CAAC,eAAe,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IAC5D,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { fixture } from '@open-wc/testing';\nimport { Options } from '../src/display/Options';\nimport { assertScreenshot, getClip, getHTML } from './utils.test';\n\nconst colors = [\n  { name: 'Red', value: '0' },\n  { name: 'Green', value: '1' },\n  { name: 'Blue', value: '2' }\n];\n\nexport const getOptionsHTML = (attrs: any = {}): string => {\n  return getHTML('temba-options', attrs);\n};\n\nexport const createOptions = async (def: string) => {\n  const parentNode = document.createElement('div');\n  parentNode.setAttribute('style', 'width: 250px;');\n  return (await fixture(def, { parentNode })) as Options;\n};\n\ndescribe('temba-options-screenshots', () => {\n  it('renders block mode', async () => {\n    const options: Options = await createOptions(\n      getOptionsHTML({ block: true, visible: true })\n    );\n    options.options = colors;\n    await options.updateComplete;\n    await assertScreenshot('options/block', getClip(options));\n  });\n});\n"]}

package/out-tsc/test/temba-range-picker.test.js

@@ -1,6 +1,6 @@
 import { fixture, expect, assert } from '@open-wc/testing';
-import { RangePicker } from '../src/datepicker/RangePicker';
-import { assertScreenshot, getAttributes, getClip } from './utils.test';
+import { RangePicker } from '../src/form/RangePicker';
+import { assertScreenshot, getAttributes, getClip, mockNow } from './utils.test';
 import { DateTime } from 'luxon';
 export const getRangePickerHTML = (attrs = {}) => {
     return `<temba-range-picker ${getAttributes(attrs)}></temba-range-picker>`;
@@ -13,6 +13,13 @@ export const createRangePicker = async (def) => {
     return picker;
 };
 describe('temba-range-picker', () => {
+    let mockedNow;
+    beforeEach(() => {
+        mockedNow = mockNow('2022-12-02T21:00:00.000000');
+    });
+    afterEach(() => {
+        mockedNow.restore();
+    });
     it('can create a range picker', async () => {
         const picker = await createRangePicker(getRangePickerHTML());
         assert.instanceOf(picker, RangePicker);

package/out-tsc/test/temba-range-picker.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"temba-range-picker.test.js","sourceRoot":"","sources":["../../test/temba-range-picker.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { fixture, expect, assert } from '@open-wc/testing';\nimport { RangePicker } from '../src/datepicker/RangePicker';\nimport { assertScreenshot, getAttributes, getClip } from './utils.test';\nimport { DateTime } from 'luxon';\n\nexport const getRangePickerHTML = (attrs: any = {}) => {\n  return `<temba-range-picker ${getAttributes(attrs)}></temba-range-picker>`;\n};\n\nexport const createRangePicker = async (def: string) => {\n  const parentNode = document.createElement('div');\n  parentNode.setAttribute('style', 'width: 600px;');\n  parentNode.id = 'parent';\n  const picker: RangePicker = await fixture(def, { parentNode });\n  return picker;\n};\n\ndescribe('temba-range-picker', () => {\n  it('can create a range picker', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n    assert.instanceOf(picker, RangePicker);\n\n    // Should have default range (last month)\n    expect(picker.selectedRange).to.equal('M');\n    expect(picker.startDate).to.not.be.empty;\n    expect(picker.endDate).to.not.be.empty;\n\n    await assertScreenshot('datepicker/range-picker-default', getClip(picker));\n  });\n\n  it('can be initialized with start and end dates', async () => {\n    const picker: RangePicker = await createRangePicker(\n      getRangePickerHTML({ start: '2024-01-01', end: '2024-01-31' })\n    );\n\n    expect(picker.startDate).to.equal('2024-01-01');\n    expect(picker.endDate).to.equal('2024-01-31');\n    expect(picker.selectedRange).to.equal('');\n\n    await assertScreenshot(\n      'datepicker/range-picker-initial-values',\n      getClip(picker)\n    );\n  });\n\n  it('can set min and max dates', async () => {\n    const picker: RangePicker = await createRangePicker(\n      getRangePickerHTML({\n        start: '2024-06-01',\n        end: '2024-06-30',\n        min: '2024-01-01',\n        max: '2024-12-31'\n      })\n    );\n\n    expect(picker.minDate).to.equal('2024-01-01');\n    expect(picker.maxDate).to.equal('2024-12-31');\n\n    await assertScreenshot('datepicker/range-picker-min-max', getClip(picker));\n  });\n\n  it('can set range using buttons', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n\n    // Click Week button\n    const weekBtn = picker.shadowRoot?.querySelector(\n      '.range-btn'\n    ) as HTMLButtonElement;\n    weekBtn.click();\n    await picker.updateComplete;\n\n    expect(picker.selectedRange).to.equal('W');\n    expect(picker.startDate).to.equal(\n      DateTime.now().minus({ days: 6 }).toISODate()\n    );\n    expect(picker.endDate).to.equal(DateTime.now().toISODate());\n\n    await assertScreenshot('datepicker/range-picker-week', getClip(picker));\n  });\n\n  it('can set year range using button', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n\n    // Click Year button (3rd button)\n    const yearBtn = picker.shadowRoot?.querySelectorAll(\n      '.range-btn'\n    )[2] as HTMLButtonElement;\n    yearBtn.click();\n    await picker.updateComplete;\n\n    expect(picker.selectedRange).to.equal('Y');\n    expect(picker.startDate).to.equal(\n      DateTime.now().minus({ years: 1 }).plus({ days: 1 }).toISODate()\n    );\n    expect(picker.endDate).to.equal(DateTime.now().toISODate());\n\n    await assertScreenshot('datepicker/range-picker-year', getClip(picker));\n  });\n\n  it('can set all range using button', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n\n    // Click All button (4th button)\n    const allBtn = picker.shadowRoot?.querySelectorAll(\n      '.range-btn'\n    )[3] as HTMLButtonElement;\n    allBtn.click();\n    await picker.updateComplete;\n\n    expect(picker.selectedRange).to.equal('ALL');\n    expect(picker.startDate).to.equal('2012-01-01');\n    expect(picker.endDate).to.equal(DateTime.now().toISODate());\n\n    await assertScreenshot('datepicker/range-picker-all', getClip(picker));\n  });\n\n  it('enforces valid date ranges', async () => {\n    const picker: RangePicker = await createRangePicker(\n      getRangePickerHTML({ start: '2024-06-01', end: '2024-06-30' })\n    );\n\n    // Verify initial state is valid\n    expect(\n      DateTime.fromISO(picker.endDate) >= DateTime.fromISO(picker.startDate)\n    ).to.be.true;\n\n    // The validation logic is internal and triggered through user interaction\n    // We can verify the component has the correct min/max constraints\n    expect(picker.startDate).to.equal('2024-06-01');\n    expect(picker.endDate).to.equal('2024-06-30');\n  });\n\n  it('enforces min/max date constraints', async () => {\n    const picker: RangePicker = await createRangePicker(\n      getRangePickerHTML({ min: '2024-01-01', max: '2024-12-31' })\n    );\n\n    expect(picker.minDate).to.equal('2024-01-01');\n    expect(picker.maxDate).to.equal('2024-12-31');\n\n    // Min/max are enforced through the temba-datepicker components\n    // when user interacts with the date inputs\n  });\n\n  it('shows correct button selection states', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n\n    // Initially should have M selected\n    const monthBtn = picker.shadowRoot?.querySelectorAll(\n      '.range-btn'\n    )[1] as HTMLButtonElement;\n    expect(monthBtn.classList.contains('selected')).to.be.true;\n\n    // Click week button\n    const weekBtn = picker.shadowRoot?.querySelector(\n      '.range-btn'\n    ) as HTMLButtonElement;\n    weekBtn.click();\n    await picker.updateComplete;\n\n    expect(weekBtn.classList.contains('selected')).to.be.true;\n    expect(monthBtn.classList.contains('selected')).to.be.false;\n\n    await assertScreenshot(\n      'datepicker/range-picker-button-states',\n      getClip(picker)\n    );\n  });\n\n  it('can click to edit dates', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n\n    // Click on start date display\n    const startDisplay = picker.shadowRoot?.querySelector(\n      '.date-display'\n    ) as HTMLElement;\n    startDisplay.click();\n    await picker.updateComplete;\n\n    expect(picker.editingStart).to.be.true;\n\n    // Should show temba-datepicker for start\n    const startPicker = picker.shadowRoot?.querySelector(\n      'temba-datepicker.start-picker'\n    );\n    expect(startPicker).to.not.be.null;\n\n    await assertScreenshot(\n      'datepicker/range-picker-editing-start',\n      getClip(picker)\n    );\n  });\n});\n"]}
+{"version":3,"file":"temba-range-picker.test.js","sourceRoot":"","sources":["../../test/temba-range-picker.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { fixture, expect, assert } from '@open-wc/testing';\nimport { RangePicker } from '../src/form/RangePicker';\nimport {\n  assertScreenshot,\n  getAttributes,\n  getClip,\n  mockNow\n} from './utils.test';\nimport { DateTime } from 'luxon';\nimport { SinonStub } from 'sinon';\n\nexport const getRangePickerHTML = (attrs: any = {}) => {\n  return `<temba-range-picker ${getAttributes(attrs)}></temba-range-picker>`;\n};\n\nexport const createRangePicker = async (def: string) => {\n  const parentNode = document.createElement('div');\n  parentNode.setAttribute('style', 'width: 600px;');\n  parentNode.id = 'parent';\n  const picker: RangePicker = await fixture(def, { parentNode });\n  return picker;\n};\n\ndescribe('temba-range-picker', () => {\n  let mockedNow: SinonStub;\n  beforeEach(() => {\n    mockedNow = mockNow('2022-12-02T21:00:00.000000');\n  });\n\n  afterEach(() => {\n    mockedNow.restore();\n  });\n\n  it('can create a range picker', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n    assert.instanceOf(picker, RangePicker);\n\n    // Should have default range (last month)\n    expect(picker.selectedRange).to.equal('M');\n    expect(picker.startDate).to.not.be.empty;\n    expect(picker.endDate).to.not.be.empty;\n\n    await assertScreenshot('datepicker/range-picker-default', getClip(picker));\n  });\n\n  it('can be initialized with start and end dates', async () => {\n    const picker: RangePicker = await createRangePicker(\n      getRangePickerHTML({ start: '2024-01-01', end: '2024-01-31' })\n    );\n\n    expect(picker.startDate).to.equal('2024-01-01');\n    expect(picker.endDate).to.equal('2024-01-31');\n    expect(picker.selectedRange).to.equal('');\n\n    await assertScreenshot(\n      'datepicker/range-picker-initial-values',\n      getClip(picker)\n    );\n  });\n\n  it('can set min and max dates', async () => {\n    const picker: RangePicker = await createRangePicker(\n      getRangePickerHTML({\n        start: '2024-06-01',\n        end: '2024-06-30',\n        min: '2024-01-01',\n        max: '2024-12-31'\n      })\n    );\n\n    expect(picker.minDate).to.equal('2024-01-01');\n    expect(picker.maxDate).to.equal('2024-12-31');\n\n    await assertScreenshot('datepicker/range-picker-min-max', getClip(picker));\n  });\n\n  it('can set range using buttons', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n\n    // Click Week button\n    const weekBtn = picker.shadowRoot?.querySelector(\n      '.range-btn'\n    ) as HTMLButtonElement;\n    weekBtn.click();\n    await picker.updateComplete;\n\n    expect(picker.selectedRange).to.equal('W');\n    expect(picker.startDate).to.equal(\n      DateTime.now().minus({ days: 6 }).toISODate()\n    );\n    expect(picker.endDate).to.equal(DateTime.now().toISODate());\n\n    await assertScreenshot('datepicker/range-picker-week', getClip(picker));\n  });\n\n  it('can set year range using button', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n\n    // Click Year button (3rd button)\n    const yearBtn = picker.shadowRoot?.querySelectorAll(\n      '.range-btn'\n    )[2] as HTMLButtonElement;\n    yearBtn.click();\n    await picker.updateComplete;\n\n    expect(picker.selectedRange).to.equal('Y');\n    expect(picker.startDate).to.equal(\n      DateTime.now().minus({ years: 1 }).plus({ days: 1 }).toISODate()\n    );\n    expect(picker.endDate).to.equal(DateTime.now().toISODate());\n\n    await assertScreenshot('datepicker/range-picker-year', getClip(picker));\n  });\n\n  it('can set all range using button', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n\n    // Click All button (4th button)\n    const allBtn = picker.shadowRoot?.querySelectorAll(\n      '.range-btn'\n    )[3] as HTMLButtonElement;\n    allBtn.click();\n    await picker.updateComplete;\n\n    expect(picker.selectedRange).to.equal('ALL');\n    expect(picker.startDate).to.equal('2012-01-01');\n    expect(picker.endDate).to.equal(DateTime.now().toISODate());\n\n    await assertScreenshot('datepicker/range-picker-all', getClip(picker));\n  });\n\n  it('enforces valid date ranges', async () => {\n    const picker: RangePicker = await createRangePicker(\n      getRangePickerHTML({ start: '2024-06-01', end: '2024-06-30' })\n    );\n\n    // Verify initial state is valid\n    expect(\n      DateTime.fromISO(picker.endDate) >= DateTime.fromISO(picker.startDate)\n    ).to.be.true;\n\n    // The validation logic is internal and triggered through user interaction\n    // We can verify the component has the correct min/max constraints\n    expect(picker.startDate).to.equal('2024-06-01');\n    expect(picker.endDate).to.equal('2024-06-30');\n  });\n\n  it('enforces min/max date constraints', async () => {\n    const picker: RangePicker = await createRangePicker(\n      getRangePickerHTML({ min: '2024-01-01', max: '2024-12-31' })\n    );\n\n    expect(picker.minDate).to.equal('2024-01-01');\n    expect(picker.maxDate).to.equal('2024-12-31');\n\n    // Min/max are enforced through the temba-datepicker components\n    // when user interacts with the date inputs\n  });\n\n  it('shows correct button selection states', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n\n    // Initially should have M selected\n    const monthBtn = picker.shadowRoot?.querySelectorAll(\n      '.range-btn'\n    )[1] as HTMLButtonElement;\n    expect(monthBtn.classList.contains('selected')).to.be.true;\n\n    // Click week button\n    const weekBtn = picker.shadowRoot?.querySelector(\n      '.range-btn'\n    ) as HTMLButtonElement;\n    weekBtn.click();\n    await picker.updateComplete;\n\n    expect(weekBtn.classList.contains('selected')).to.be.true;\n    expect(monthBtn.classList.contains('selected')).to.be.false;\n\n    await assertScreenshot(\n      'datepicker/range-picker-button-states',\n      getClip(picker)\n    );\n  });\n\n  it('can click to edit dates', async () => {\n    const picker: RangePicker = await createRangePicker(getRangePickerHTML());\n\n    // Click on start date display\n    const startDisplay = picker.shadowRoot?.querySelector(\n      '.date-display'\n    ) as HTMLElement;\n    startDisplay.click();\n    await picker.updateComplete;\n\n    expect(picker.editingStart).to.be.true;\n\n    // Should show temba-datepicker for start\n    const startPicker = picker.shadowRoot?.querySelector(\n      'temba-datepicker.start-picker'\n    );\n    expect(startPicker).to.not.be.null;\n\n    await assertScreenshot(\n      'datepicker/range-picker-editing-start',\n      getClip(picker)\n    );\n  });\n});\n"]}