@nyaruka/temba-components 0.129.9 → 0.129.11

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

@@ -1,94 +0,0 @@
-import { html, fixture, expect } from '@open-wc/testing';
-import { assertScreenshot, getClip } from './utils.test';
-describe('temba-field', () => {
-    it('renders field with plain text errors', async () => {
-        const formField = await fixture(html `
-      <temba-field
-        label="Test Field"
-        name="test"
-        .errors=${['This is a plain text error', 'Another error message']}
-      >
-        <input type="text" />
-      </temba-field>
-    `);
-        await formField.updateComplete;
-        // Check that errors are rendered
-        const errorElements = formField.shadowRoot.querySelectorAll('.alert-error');
-        expect(errorElements.length).to.equal(2);
-        expect(errorElements[0].textContent.trim()).to.equal('This is a plain text error');
-        expect(errorElements[1].textContent.trim()).to.equal('Another error message');
-        await assertScreenshot('formfield/plain-text-errors', getClip(formField));
-    });
-    it('renders field with markdown errors', async () => {
-        const formField = await fixture(html `
-      <temba-field
-        label="Test Field"
-        name="test"
-        .errors=${[
-            'This is **bold** text',
-            'This has a [link](https://example.com)',
-            'This is *italic* and **bold** with a [link](https://example.com)'
-        ]}
-      >
-        <input type="text" />
-      </temba-field>
-    `);
-        await formField.updateComplete;
-        // Check that errors are rendered
-        const errorElements = formField.shadowRoot.querySelectorAll('.alert-error');
-        expect(errorElements.length).to.equal(3);
-        // First error should have bold text
-        const firstError = errorElements[0];
-        const boldElement = firstError.querySelector('strong');
-        expect(boldElement).to.not.be.null;
-        expect(boldElement.textContent).to.equal('bold');
-        // Second error should have a link
-        const secondError = errorElements[1];
-        const linkElement = secondError.querySelector('a');
-        expect(linkElement).to.not.be.null;
-        expect(linkElement.getAttribute('href')).to.equal('https://example.com');
-        expect(linkElement.textContent).to.equal('link');
-        // Third error should have both bold, italic, and link
-        const thirdError = errorElements[2];
-        const thirdBoldElement = thirdError.querySelector('strong');
-        const thirdItalicElement = thirdError.querySelector('em');
-        const thirdLinkElement = thirdError.querySelector('a');
-        expect(thirdBoldElement).to.not.be.null;
-        expect(thirdItalicElement).to.not.be.null;
-        expect(thirdLinkElement).to.not.be.null;
-        await assertScreenshot('formfield/markdown-errors', getClip(formField));
-    });
-    it('renders field without errors', async () => {
-        const formField = await fixture(html `
-      <temba-field label="Test Field" name="test">
-        <input type="text" />
-      </temba-field>
-    `);
-        await formField.updateComplete;
-        // Check that no errors are rendered
-        const errorElements = formField.shadowRoot.querySelectorAll('.alert-error');
-        expect(errorElements.length).to.equal(0);
-        await assertScreenshot('formfield/no-errors', getClip(formField));
-    });
-    it('renders in widget-only mode with errors', async () => {
-        const formField = await fixture(html `
-      <temba-field
-        widget_only
-        .errors=${['Widget only **error** with [link](https://example.com)']}
-      >
-        <input type="text" />
-      </temba-field>
-    `);
-        await formField.updateComplete;
-        // Check that error is rendered in widget-only mode
-        const errorElements = formField.shadowRoot.querySelectorAll('.alert-error');
-        expect(errorElements.length).to.equal(1);
-        const errorElement = errorElements[0];
-        const boldElement = errorElement.querySelector('strong');
-        const linkElement = errorElement.querySelector('a');
-        expect(boldElement).to.not.be.null;
-        expect(linkElement).to.not.be.null;
-        await assertScreenshot('formfield/widget-only-markdown-errors', getClip(formField));
-    });
-});
-//# sourceMappingURL=temba-formfield.test.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"temba-formfield.test.js","sourceRoot":"","sources":["../../test/temba-formfield.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, fixture, expect } from '@open-wc/testing';\nimport { FormField } from '../src/form/FormField';\nimport { assertScreenshot, getClip } from './utils.test';\n\ndescribe('temba-field', () => {\n  it('renders field with plain text errors', async () => {\n    const formField: FormField = await fixture(html`\n      <temba-field\n        label=\"Test Field\"\n        name=\"test\"\n        .errors=${['This is a plain text error', 'Another error message']}\n      >\n        <input type=\"text\" />\n      </temba-field>\n    `);\n\n    await formField.updateComplete;\n\n    // Check that errors are rendered\n    const errorElements = formField.shadowRoot.querySelectorAll('.alert-error');\n    expect(errorElements.length).to.equal(2);\n    expect(errorElements[0].textContent.trim()).to.equal(\n      'This is a plain text error'\n    );\n    expect(errorElements[1].textContent.trim()).to.equal(\n      'Another error message'\n    );\n\n    await assertScreenshot('formfield/plain-text-errors', getClip(formField));\n  });\n\n  it('renders field with markdown errors', async () => {\n    const formField: FormField = await fixture(html`\n      <temba-field\n        label=\"Test Field\"\n        name=\"test\"\n        .errors=${[\n          'This is **bold** text',\n          'This has a [link](https://example.com)',\n          'This is *italic* and **bold** with a [link](https://example.com)'\n        ]}\n      >\n        <input type=\"text\" />\n      </temba-field>\n    `);\n\n    await formField.updateComplete;\n\n    // Check that errors are rendered\n    const errorElements = formField.shadowRoot.querySelectorAll('.alert-error');\n    expect(errorElements.length).to.equal(3);\n\n    // First error should have bold text\n    const firstError = errorElements[0];\n    const boldElement = firstError.querySelector('strong');\n    expect(boldElement).to.not.be.null;\n    expect(boldElement.textContent).to.equal('bold');\n\n    // Second error should have a link\n    const secondError = errorElements[1];\n    const linkElement = secondError.querySelector('a');\n    expect(linkElement).to.not.be.null;\n    expect(linkElement.getAttribute('href')).to.equal('https://example.com');\n    expect(linkElement.textContent).to.equal('link');\n\n    // Third error should have both bold, italic, and link\n    const thirdError = errorElements[2];\n    const thirdBoldElement = thirdError.querySelector('strong');\n    const thirdItalicElement = thirdError.querySelector('em');\n    const thirdLinkElement = thirdError.querySelector('a');\n    expect(thirdBoldElement).to.not.be.null;\n    expect(thirdItalicElement).to.not.be.null;\n    expect(thirdLinkElement).to.not.be.null;\n\n    await assertScreenshot('formfield/markdown-errors', getClip(formField));\n  });\n\n  it('renders field without errors', async () => {\n    const formField: FormField = await fixture(html`\n      <temba-field label=\"Test Field\" name=\"test\">\n        <input type=\"text\" />\n      </temba-field>\n    `);\n\n    await formField.updateComplete;\n\n    // Check that no errors are rendered\n    const errorElements = formField.shadowRoot.querySelectorAll('.alert-error');\n    expect(errorElements.length).to.equal(0);\n\n    await assertScreenshot('formfield/no-errors', getClip(formField));\n  });\n\n  it('renders in widget-only mode with errors', async () => {\n    const formField: FormField = await fixture(html`\n      <temba-field\n        widget_only\n        .errors=${['Widget only **error** with [link](https://example.com)']}\n      >\n        <input type=\"text\" />\n      </temba-field>\n    `);\n\n    await formField.updateComplete;\n\n    // Check that error is rendered in widget-only mode\n    const errorElements = formField.shadowRoot.querySelectorAll('.alert-error');\n    expect(errorElements.length).to.equal(1);\n\n    const errorElement = errorElements[0];\n    const boldElement = errorElement.querySelector('strong');\n    const linkElement = errorElement.querySelector('a');\n    expect(boldElement).to.not.be.null;\n    expect(linkElement).to.not.be.null;\n\n    await assertScreenshot(\n      'formfield/widget-only-markdown-errors',\n      getClip(formField)\n    );\n  });\n});\n"]}

package/src/flow/actions/call_llm.ts

@@ -1,66 +0,0 @@
-import { html } from 'lit-html';
-import { ActionConfig, COLORS } from '../types';
-import { Node, CallLLM } from '../../store/flow-definition';
-
-export const call_llm: ActionConfig = {
-  name: 'Call AI',
-  color: COLORS.call,
-  render: (_node: Node, action: CallLLM) => {
-    return html`<div
-      style="word-wrap: break-word; overflow-wrap: break-word; hyphens: auto; max-width: 180px; max-height: 100px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical;"
-    >
-      ${action.instructions}
-    </div>`;
-  },
-  form: {
-    llm: {
-      type: 'select',
-      required: true,
-      options: [],
-      endpoint: '/test-assets/select/llms.json',
-      searchable: true,
-      valueKey: 'uuid',
-      nameKey: 'name'
-    },
-    input: {
-      type: 'text',
-      required: true,
-      label: 'The input the AI will process',
-      evaluated: true,
-      placeholder: '@input'
-    },
-    instructions: {
-      type: 'textarea',
-      required: true,
-      label: 'Tell the AI what to do with the input',
-      evaluated: true,
-      placeholder: 'Enter instructions for the AI model...',
-      minHeight: 130,
-      helpText: 'The result can be referenced as **`@locals._llm_output`**'
-    }
-  },
-  layout: ['llm', 'input', 'instructions'],
-  toFormData: (action: CallLLM) => {
-    return {
-      uuid: action.uuid,
-      llm: action.llm
-        ? [{ value: action.llm.uuid, name: action.llm.name }]
-        : [],
-      input: action.input || '@input',
-      instructions: action.instructions || ''
-    };
-  },
-  fromFormData: (data: Record<string, any>) => {
-    const llmSelection =
-      Array.isArray(data.llm) && data.llm.length > 0 ? data.llm[0] : null;
-    return {
-      uuid: data.uuid,
-      type: 'call_llm',
-      input: data.input || '@input',
-      llm: llmSelection
-        ? { uuid: llmSelection.value, name: llmSelection.name }
-        : { uuid: '', name: '' },
-      instructions: data.instructions || ''
-    } as CallLLM;
-  }
-};

package/src/flow/actions/call_webhook.ts

@@ -1,143 +0,0 @@
-import { html } from 'lit-html';
-import { ActionConfig, COLORS } from '../types';
-import { Node, CallWebhook } from '../../store/flow-definition';
-
-const defaultPost = `@(json(object(
-  "contact", object(
-    "uuid", contact.uuid, 
-    "name", contact.name, 
-    "urn", contact.urn
-  ),
-  "flow", object(
-    "uuid", run.flow.uuid, 
-    "name", run.flow.name
-  ),
-  "results", foreach_value(results, extract_object, "value", "category")
-)))`;
-
-export const call_webhook: ActionConfig = {
-  name: 'Call Webhook',
-  color: COLORS.call,
-  render: (_node: Node, action: CallWebhook) => {
-    return html`<div
-      style="word-wrap: break-word; overflow-wrap: break-word; hyphens: auto;"
-    >
-      ${action.url}
-    </div>`;
-  },
-  evaluated: ['url', 'headers', 'body'], // keep for backward compatibility
-  form: {
-    method: {
-      type: 'select',
-      required: true,
-      options: ['GET', 'POST', 'PUT', 'DELETE', 'HEAD', 'PATCH'],
-      maxWidth: '120px',
-      searchable: false
-    },
-    url: {
-      type: 'text',
-      required: true,
-      evaluated: true,
-      placeholder: 'https://example.com/webhook'
-    },
-    headers: {
-      type: 'key-value',
-      sortable: true,
-      keyPlaceholder: 'Header name',
-      valuePlaceholder: 'Header value',
-      minRows: 0
-    },
-    body: {
-      type: 'textarea',
-      evaluated: true,
-      placeholder: 'Request body content (JSON, XML, etc.)',
-      minHeight: 200,
-      dependsOn: ['method'],
-      computeValue: (
-        values: Record<string, any>,
-        currentValue: any,
-        originalValues?: Record<string, any>
-      ) => {
-        // Check if method is POST (handle both string and select object formats)
-        const method =
-          Array.isArray(values.method) && values.method.length > 0
-            ? values.method[0].value || values.method[0].name
-            : values.method;
-
-        if (method === 'POST') {
-          // For POST, provide the template if body is empty or was never set by user
-          if (!currentValue || currentValue.trim() === '') {
-            return defaultPost;
-          }
-        } else {
-          // For non-POST methods, clear the body if it was auto-generated or empty
-          // Check if the original body was empty (user never specified a body)
-          const originalBody = originalValues?.body || '';
-          const isOriginallyEmpty = !originalBody || originalBody.trim() === '';
-
-          // Clear if: originally empty, contains default template, or is currently empty
-          if (
-            isOriginallyEmpty ||
-            !currentValue ||
-            currentValue.trim() === '' ||
-            currentValue.trim() === defaultPost.trim()
-          ) {
-            return '';
-          }
-        }
-
-        return currentValue; // Keep existing value if user has customized it
-      }
-    }
-  },
-  layout: [
-    // Row with method and URL side by side
-    { type: 'row', items: ['method', 'url'] },
-    // Advanced group with nested layouts
-    {
-      type: 'group',
-      label: 'Headers',
-      items: ['headers'],
-      collapsible: true,
-      collapsed: true,
-      helpText: 'Configure authentication or custom headers',
-      getGroupValueCount: (formData: any) => {
-        return formData.headers?.length || 0;
-      }
-    },
-    {
-      type: 'group',
-      label: 'Body',
-      items: ['body'],
-      collapsible: true,
-      collapsed: true,
-      helpText: 'Configure the request payload',
-      getGroupValueCount: (formData: any) => {
-        return !!(
-          formData.body &&
-          formData.body.trim() !== '' &&
-          formData.body !== defaultPost
-        );
-      }
-    }
-  ],
-  toFormData: (action: CallWebhook) => {
-    return {
-      uuid: action.uuid,
-      url: action.url || '',
-      method: [{ value: action.method, name: action.method }],
-      headers: action.headers || [],
-      body: action.body || ''
-    };
-  },
-  fromFormData: (data: Record<string, any>) => {
-    return {
-      uuid: data.uuid,
-      type: 'call_webhook',
-      url: data.url,
-      method: data.method[0].value,
-      headers: data.headers || [],
-      body: data.body || ''
-    } as CallWebhook;
-  }
-};

package/src/flow/actions/enter_flow.ts

@@ -1,15 +0,0 @@
-import { html } from 'lit-html';
-import { ActionConfig, COLORS } from '../types';
-import { Node, EnterFlow } from '../../store/flow-definition';
-
-export const enter_flow: ActionConfig = {
-  name: 'Enter a Flow',
-  color: COLORS.execute,
-  render: (_node: Node, action: EnterFlow) => {
-    return html`<div
-      style="word-wrap: break-word; overflow-wrap: break-word; hyphens: auto;"
-    >
-      Enter <b>${action.flow.name}</b>
-    </div>`;
-  }
-};

package/src/flow/actions/open_ticket.ts

@@ -1,83 +0,0 @@
-import { html } from 'lit-html';
-import { ActionConfig, COLORS } from '../types';
-import { Node, OpenTicket } from '../../store/flow-definition';
-
-export const open_ticket: ActionConfig = {
-  name: 'Open Ticket',
-  color: COLORS.create,
-  render: (_node: Node, action: OpenTicket) => {
-    return html`<div>${action.topic.name}</div>`;
-  },
-  form: {
-    topic: {
-      type: 'select',
-      required: true,
-      placeholder: 'Select a topic',
-      options: [],
-      endpoint: '/api/v2/topics.json',
-      valueKey: 'uuid',
-      nameKey: 'name',
-      maxWidth: '200px'
-    },
-    assignee: {
-      type: 'select',
-      required: false,
-      placeholder: 'Select an agent (optional)',
-      options: [],
-      endpoint: '/api/v2/users.json',
-      valueKey: 'uuid',
-      getName: (item: {
-        first_name?: string;
-        last_name?: string;
-        name?: string;
-      }) => {
-        return item.name || [item.first_name, item.last_name].join(' ');
-      },
-      clearable: true
-    },
-    note: {
-      type: 'textarea',
-      required: false,
-      placeholder: 'Enter a note for the ticket (optional)',
-      minHeight: 100
-    }
-  },
-  layout: [{ type: 'row', items: ['topic', 'assignee'] }, 'note'],
-  toFormData: (action: OpenTicket) => {
-    return {
-      uuid: action.uuid,
-      topic: action.topic
-        ? [{ uuid: action.topic.uuid, name: action.topic.name }]
-        : [],
-      assignee: action.assignee
-        ? [{ uuid: action.assignee.uuid, name: action.assignee.name }]
-        : [],
-      note: action.note || ''
-    };
-  },
-  fromFormData: (data: Record<string, any>) => {
-    return {
-      uuid: data.uuid,
-      type: 'open_ticket',
-      topic:
-        data.topic && data.topic.length > 0
-          ? {
-              uuid: data.topic[0].uuid,
-              name: data.topic[0].name
-            }
-          : undefined,
-      assignee:
-        data.assignee && data.assignee.length > 0
-          ? {
-              uuid: data.assignee[0].uuid,
-              name:
-                data.assignee[0].name ||
-                [data.assignee[0].first_name, data.assignee[0].last_name].join(
-                  ' '
-                )
-            }
-          : undefined,
-      note: data.note || ''
-    } as OpenTicket;
-  }
-};

package/src/form/FormElement.ts

@@ -1,69 +0,0 @@
-import { RapidElement } from '../RapidElement';
-import { property } from 'lit/decorators.js';
-
-/**
- * FormElement is a component that appends a hidden input (outside of
- * its own shadow) with its value to be included in forms.
- */
-export class FormElement extends RapidElement {
-  @property({ type: String })
-  name = '';
-
-  @property({ type: String, attribute: 'help_text' })
-  helpText: string;
-
-  @property({ type: Boolean, attribute: 'help_always' })
-  helpAlways: boolean;
-
-  @property({ type: Boolean, attribute: 'widget_only' })
-  widgetOnly: boolean;
-
-  @property({ type: Boolean, attribute: 'hide_label' })
-  hideLabel: boolean;
-
-  @property({ type: String })
-  label: string;
-
-  @property({ type: Array })
-  errors: string[];
-
-  @property({ type: String })
-  value = null;
-
-  @property({ attribute: false })
-  inputRoot: HTMLElement = this;
-
-  @property({ type: Boolean })
-  disabled = false;
-  static formAssociated = true;
-
-  protected internals: ElementInternals;
-
-  constructor() {
-    super();
-    this.internals = this.attachInternals();
-  }
-
-  public updated(changedProperties: Map<string, any>) {
-    super.updated(changedProperties);
-    if (changedProperties.has('value')) {
-      this.internals.setFormValue(this.value);
-    }
-  }
-
-  get form() {
-    return this.internals.form;
-  }
-
-  public setValue(value: any) {
-    this.value = this.serializeValue(value);
-  }
-
-  public getDeserializedValue(): any {
-    return JSON.parse(this.value);
-  }
-
-  public serializeValue(value: any): string {
-    return JSON.stringify(value);
-  }
-}

package/test/actions/call_llm.test.ts

@@ -1,137 +0,0 @@
-import { expect } from '@open-wc/testing';
-import { call_llm } from '../../src/flow/actions/call_llm';
-import { CallLLM } from '../../src/store/flow-definition';
-import { ActionTest } from '../ActionHelper';
-
-/**
- * Test suite for the call_llm action configuration.
- */
-describe('call_llm action config', () => {
-  const helper = new ActionTest(call_llm, 'call_llm');
-
-  describe('basic properties', () => {
-    helper.testBasicProperties();
-
-    it('has correct name', () => {
-      expect(call_llm.name).to.equal('Call AI');
-    });
-
-    it('has form configuration', () => {
-      expect(call_llm.form).to.exist;
-      expect(call_llm.form.llm).to.exist;
-      expect(call_llm.form.instructions).to.exist;
-      expect(call_llm.form.input).to.exist;
-    });
-
-    it('has layout configuration', () => {
-      expect(call_llm.layout).to.exist;
-      expect(call_llm.layout).to.deep.equal(['llm', 'input', 'instructions']);
-    });
-
-    it('has data transformation functions', () => {
-      expect(call_llm.toFormData).to.be.a('function');
-      expect(call_llm.fromFormData).to.be.a('function');
-    });
-  });
-
-  describe('data transformations', () => {
-    it('converts action to form data correctly', () => {
-      const action: CallLLM = {
-        uuid: 'test-llm-1',
-        type: 'call_llm',
-        input: '@input',
-        llm: { uuid: 'gpt-4', name: 'GPT 4.1' },
-        instructions: 'Translate to French',
-        result_name: 'translated_text'
-      };
-
-      const formData = call_llm.toFormData(action);
-
-      expect(formData.uuid).to.equal('test-llm-1');
-      expect(formData.llm).to.deep.equal([{ value: 'gpt-4', name: 'GPT 4.1' }]);
-      expect(formData.instructions).to.equal('Translate to French');
-      expect(formData.input).to.equal('@input');
-    });
-
-    it('converts form data to action correctly', () => {
-      const formData = {
-        uuid: 'test-llm-2',
-        llm: [{ value: 'gpt-5', name: 'GPT 5' }],
-        instructions: 'Summarize the following text',
-        input: '@input'
-      };
-
-      const action = call_llm.fromFormData(formData) as CallLLM;
-
-      expect(action.uuid).to.equal('test-llm-2');
-      expect(action.type).to.equal('call_llm');
-      expect(action.llm).to.deep.equal({ uuid: 'gpt-5', name: 'GPT 5' });
-      expect(action.instructions).to.equal('Summarize the following text');
-      expect(action.input).to.equal('@input');
-    });
-
-    it('handles empty form data', () => {
-      const formData = {
-        uuid: 'test-llm-3',
-        llm: [],
-        instructions: '',
-        input: ''
-      };
-
-      const action = call_llm.fromFormData(formData) as CallLLM;
-
-      expect(action.llm).to.deep.equal({ uuid: '', name: '' });
-      expect(action.instructions).to.equal('');
-      expect(action.input).to.equal('@input');
-    });
-  });
-
-  describe('action scenarios', () => {
-    helper.testAction(
-      {
-        uuid: 'test-action-1',
-        type: 'call_llm',
-        llm: { uuid: 'gpt-4', name: 'GPT 4.1' },
-        instructions: 'Translate to French',
-        input: '@input'
-      } as CallLLM,
-      'translation-task'
-    );
-
-    helper.testAction(
-      {
-        uuid: 'test-action-2',
-        type: 'call_llm',
-        llm: { uuid: 'gpt-5', name: 'GPT 5' },
-        instructions:
-          'Analyze the sentiment of the following message and classify it as positive, negative, or neutral. Provide a brief explanation for your classification.',
-        input: '@input'
-      } as CallLLM,
-      'sentiment-analysis'
-    );
-
-    helper.testAction(
-      {
-        uuid: 'test-action-3',
-        type: 'call_llm',
-        llm: { uuid: 'gpt-4', name: 'GPT 4.1' },
-        instructions:
-          'Summarize the key points from the conversation above in bullet format.',
-        input: '@input'
-      } as CallLLM,
-      'summarization'
-    );
-
-    helper.testAction(
-      {
-        uuid: 'test-action-4',
-        type: 'call_llm',
-        llm: { uuid: 'gpt-5', name: 'GPT 5' },
-        instructions:
-          'Extract any contact information (phone numbers, email addresses) from the text and format them as a JSON object.',
-        input: '@input'
-      } as CallLLM,
-      'information-extraction'
-    );
-  });
-});