@api-client/ui 0.0.3 → 0.0.5

package/dist/elements/code/HttpSnippets.js.map

@@ -1 +1 @@
-{"version":3,"file":"HttpSnippets.js","sourceRoot":"","sources":["../../../src/elements/code/HttpSnippets.ts"],"names":[],"mappings":"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","sourcesContent":["import { IHttpRequest } from \"@api-client/core/build/browser.js\";\nimport { LitElement, TemplateResult, html, PropertyValues } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport CodeSnippet from \"../../code-snippets/CodeSnippet.js\";\nimport CurlSnippet from '../../code-snippets/Bash/CurlSnippet.js';\nimport CcurlSnippet from '../../code-snippets/C/CcurlSnippet.js';\nimport RawSnippet from '../../code-snippets/HTTP/RawSnippet.js';\nimport FetchSnippet from '../../code-snippets/JavaScript/FetchSnippet.js';\nimport AsyncFetchSnippet from '../../code-snippets/JavaScript/AsyncFetchSnippet.js';\nimport NodeSnippet from '../../code-snippets/JavaScript/NodeSnippet.js';\nimport XhrSnippet from '../../code-snippets/JavaScript/XhrSnippet.js';\nimport JQuerySnippet from '../../code-snippets/JavaScript/jQuerySnippet.js';\nimport AxiosSnippet from '../../code-snippets/JavaScript/AxiosSnippet.js';\nimport Python27Snippet from '../../code-snippets/Python/Python27Snippet.js';\nimport Python31Snippet from '../../code-snippets/Python/Python31Snippet.js';\nimport RequestsSnippet from '../../code-snippets/Python/RequestsSnippet.js';\nimport PlatformSnippet from '../../code-snippets/Java/PlatformSnippet.js';\nimport SpringSnippet from '../../code-snippets/Java/SpringSnippet.js';\nimport DartSnippet from '../../code-snippets/Dart/DartSnippet.js';\nimport '../../define/ui/ui-dropdown-list.js';\nimport '../../define/ui/ui-list.js';\nimport '../../define/ui/ui-list-item.js';\nimport '../../define/ui/ui-button.js';\nimport '../../define/ui/ui-icon.js';\n\ninterface CodeGroup {\n  label: string;\n  parent?: string;\n  snippet?: CodeSnippet;\n  id: string;\n}\n\nconst commands: CodeGroup[] = [\n  {\n    id: 'bash-curl',\n    label: 'cURL',\n    snippet: new CurlSnippet,\n  },\n  {\n    id: 'http-raw',\n    label: 'HTTP',\n    snippet: new RawSnippet,\n  },\n  {\n    id: 'javascript',\n    label: 'JavaScript',\n  },\n  {\n    label: 'Async',\n    id: 'javascript-async',\n    parent: 'javascript',\n    snippet: new AsyncFetchSnippet,\n  },\n  {\n    label: 'Fetch',\n    id: 'javascript-fetch',\n    parent: 'javascript',\n    snippet: new FetchSnippet,\n  },\n  {\n    label: 'Node',\n    id: 'javascript-node',\n    parent: 'javascript',\n    snippet: new NodeSnippet,\n  },\n  {\n    label: 'XHR',\n    id: 'javascript-xhr',\n    parent: 'javascript',\n    snippet: new XhrSnippet,\n  },\n  {\n    label: 'jQuery',\n    id: 'javascript-jquery',\n    parent: 'javascript',\n    snippet: new JQuerySnippet,\n  },\n  {\n    label: 'Axios',\n    id: 'javascript-axios',\n    parent: 'javascript',\n    snippet: new AxiosSnippet,\n  },\n  {\n    label: 'Python',\n    id: 'python',\n  },\n  {\n    label: 'Requests',\n    id: 'python-requests',\n    parent: 'python',\n    snippet: new RequestsSnippet,\n  },\n  {\n    label: 'Python 2.7',\n    id: 'python-2.7',\n    parent: 'python',\n    snippet: new Python27Snippet,\n  },\n  {\n    label: 'Python 3.1',\n    id: 'python-3.1',\n    parent: 'python',\n    snippet: new Python31Snippet,\n  },\n  {\n    label: 'C',\n    id: 'c-curl',\n    snippet: new CcurlSnippet,\n  },\n  {\n    label: 'Java',\n    id: 'java',\n  },\n  {\n    label: 'Spring',\n    id: 'java-spring',\n    parent: 'java',\n    snippet: new SpringSnippet,\n  },\n  {\n    label: 'Native',\n    id: 'java-platform',\n    parent: 'java',\n    snippet: new PlatformSnippet,\n  },\n  {\n    label: 'Dart',\n    id: 'dart',\n    snippet: new DartSnippet,\n  }\n];\n\nconst topTabs = commands.filter(i => !i.parent);\n\n/**\n * An element that renders various code snippets from a basic definition of an HTTP request.\n */\nexport default class HttpSnippets extends LitElement {\n  /**\n   * The currently selected snippet.\n   * @attribute\n   */\n  @property({ type: String }) selected = 'bash-curl';\n\n  protected parentLanguage = 'bash-curl';\n\n  @property({ type: Object }) request?: IHttpRequest;\n\n  @state() protected code?: string;\n\n  /**\n   * The list of tab names to render in the view.\n   */\n  protected get groupTabs(): CodeGroup[] {\n    const result: CodeGroup[] = [];\n    commands.forEach(i => {\n      if (i.parent === this.parentLanguage) {\n        result.push(i);\n      }\n    });\n    return result;\n  }\n\n  protected override update(cp: PropertyValues<this>): void {\n    if (cp.has('request') || cp.has('selected')) {\n      this.triggerCommand();\n    }\n    super.update(cp);\n  }\n\n  protected triggerCommand(): void {\n    const { selected = 'bash-curl', request } = this;\n    if (!request) {\n      return;\n    }\n    const instance = commands.find(i => i.id === selected);\n    if (!instance || !instance.snippet) {\n      return;\n    }\n    this.code = instance.snippet.tokenize(request);\n  }\n\n  protected handleGroupSelect(e: CustomEvent): void {\n    const target = e.detail.item as HTMLElement | undefined;\n    if (!target) {\n      return;\n    }\n    const { id } = target.dataset\n    if (!id) {\n      return;\n    }\n    if (this.parentLanguage === id) {\n      return;\n    }\n    const item = commands.find(i => i.id === id);\n    if (!item) {\n      return;\n    }\n    if (!item.snippet) {\n      const firstChild = commands.find(i => i.parent === id) as CodeGroup;\n      this.selected = firstChild.id;\n      this.parentLanguage = id;\n    } else {\n      this.selected = id;\n      this.parentLanguage = id;\n    }\n  }\n\n  protected handleSubGroup(e: CustomEvent): void {\n    const target = e.detail.item as HTMLElement | undefined;\n    if (!target) {\n      return;\n    }\n    const { id } = target.dataset\n    if (!id) {\n      return;\n    }\n    this.selected = id;\n  }\n\n  protected override render(): TemplateResult {\n    return html`\n    ${this.renderSelectionOptions()}\n    ${this.renderCode()}\n    `;\n  }\n\n  protected renderSelectionOptions(): TemplateResult {\n    return html`\n    <div class=\"selection-options\">\n      ${this.renderLanguageOptions()}\n      ${this.renderFrameworkOptions()}\n    </div>\n    `;\n  }\n\n  protected renderLanguageOptions(): TemplateResult {\n    const selectedKey = this.parentLanguage;\n    const selectedItem = topTabs.find(i => i.id === selectedKey);\n    const label = selectedItem ? selectedItem.label : 'Language';\n\n    return html`\n    <ui-dropdown-list\n      verticalAlign=\"top\"\n      class=\"group-dropdown\"\n      closeOnOutsideClick\n       @select=\"${this.handleGroupSelect}\"\n    >\n      <ui-button \n        type=\"tonal\" \n        title=\"Select language\" \n        aria-label=\"Opens a menu to select the language\"\n      >\n        <ui-icon icon=\"arrowDropDown\" slot=\"icon\" role=\"presentation\"></ui-icon>\n        ${label}\n      </ui-button>\n      <ui-list slot=\"dropdown\" role=\"menu\">\n        ${topTabs.map(tab => html`<ui-list-item role=\"menuitem\" data-id=\"${tab.id}\">${tab.label}</ui-list-item>`)}\n      </ui-list>\n    </ui-dropdown-list>\n    `;\n  }\n\n  protected renderFrameworkOptions(): TemplateResult | string {\n    const { groupTabs, selected } = this;\n    if (!groupTabs.length) {\n      return '';\n    }\n    const selectedItem = groupTabs.find(i => i.id === selected);\n    const label = selectedItem ? selectedItem.label : 'Framework';\n    return html`\n\n    <ui-dropdown-list\n      verticalAlign=\"top\"\n      class=\"group-dropdown\"\n      closeOnOutsideClick\n       @select=\"${this.handleSubGroup}\"\n    >\n      <ui-button \n        type=\"tonal\" \n        title=\"Select a framework\" \n        aria-label=\"Opens a menu to select the framework\"\n      >\n        <ui-icon icon=\"arrowDropDown\" slot=\"icon\" role=\"presentation\"></ui-icon>\n        ${label}\n      </ui-button>\n      <ui-list slot=\"dropdown\" role=\"menu\">\n        ${groupTabs.map(tab => html`<ui-list-item role=\"menuitem\" data-id=\"${tab.id}\">${tab.label}</ui-list-item>`)}\n      </ui-list>\n    </ui-dropdown-list>\n    `;\n  }\n\n  protected renderCode(): TemplateResult | string {\n    if (!this.code) {\n      return '';\n    }\n    return html`\n    <code class=\"code language-snippet\"><pre>${unsafeHTML(this.code)}</pre></code>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"HttpSnippets.js","sourceRoot":"","sources":["../../../src/elements/code/HttpSnippets.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAkB,IAAI,EAAkB,MAAM,KAAK,CAAC;AACvE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAE3D,OAAO,WAAW,MAAM,yCAAyC,CAAC;AAClE,OAAO,YAAY,MAAM,uCAAuC,CAAC;AACjE,OAAO,UAAU,MAAM,wCAAwC,CAAC;AAChE,OAAO,YAAY,MAAM,gDAAgD,CAAC;AAC1E,OAAO,iBAAiB,MAAM,qDAAqD,CAAC;AACpF,OAAO,WAAW,MAAM,+CAA+C,CAAC;AACxE,OAAO,UAAU,MAAM,8CAA8C,CAAC;AACtE,OAAO,aAAa,MAAM,iDAAiD,CAAC;AAC5E,OAAO,YAAY,MAAM,gDAAgD,CAAC;AAC1E,OAAO,eAAe,MAAM,+CAA+C,CAAC;AAC5E,OAAO,eAAe,MAAM,+CAA+C,CAAC;AAC5E,OAAO,eAAe,MAAM,+CAA+C,CAAC;AAC5E,OAAO,eAAe,MAAM,6CAA6C,CAAC;AAC1E,OAAO,aAAa,MAAM,2CAA2C,CAAC;AACtE,OAAO,WAAW,MAAM,yCAAyC,CAAC;AAClE,OAAO,qCAAqC,CAAC;AAC7C,OAAO,4BAA4B,CAAC;AACpC,OAAO,iCAAiC,CAAC;AACzC,OAAO,8BAA8B,CAAC;AACtC,OAAO,4BAA4B,CAAC;AASpC,MAAM,QAAQ,GAAgB;IAC5B;QACE,EAAE,EAAE,WAAW;QACf,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,IAAI,WAAW;KACzB;IACD;QACE,EAAE,EAAE,UAAU;QACd,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,IAAI,UAAU;KACxB;IACD;QACE,EAAE,EAAE,YAAY;QAChB,KAAK,EAAE,YAAY;KACpB;IACD;QACE,KAAK,EAAE,OAAO;QACd,EAAE,EAAE,kBAAkB;QACtB,MAAM,EAAE,YAAY;QACpB,OAAO,EAAE,IAAI,iBAAiB;KAC/B;IACD;QACE,KAAK,EAAE,OAAO;QACd,EAAE,EAAE,kBAAkB;QACtB,MAAM,EAAE,YAAY;QACpB,OAAO,EAAE,IAAI,YAAY;KAC1B;IACD;QACE,KAAK,EAAE,MAAM;QACb,EAAE,EAAE,iBAAiB;QACrB,MAAM,EAAE,YAAY;QACpB,OAAO,EAAE,IAAI,WAAW;KACzB;IACD;QACE,KAAK,EAAE,KAAK;QACZ,EAAE,EAAE,gBAAgB;QACpB,MAAM,EAAE,YAAY;QACpB,OAAO,EAAE,IAAI,UAAU;KACxB;IACD;QACE,KAAK,EAAE,QAAQ;QACf,EAAE,EAAE,mBAAmB;QACvB,MAAM,EAAE,YAAY;QACpB,OAAO,EAAE,IAAI,aAAa;KAC3B;IACD;QACE,KAAK,EAAE,OAAO;QACd,EAAE,EAAE,kBAAkB;QACtB,MAAM,EAAE,YAAY;QACpB,OAAO,EAAE,IAAI,YAAY;KAC1B;IACD;QACE,KAAK,EAAE,QAAQ;QACf,EAAE,EAAE,QAAQ;KACb;IACD;QACE,KAAK,EAAE,UAAU;QACjB,EAAE,EAAE,iBAAiB;QACrB,MAAM,EAAE,QAAQ;QAChB,OAAO,EAAE,IAAI,eAAe;KAC7B;IACD;QACE,KAAK,EAAE,YAAY;QACnB,EAAE,EAAE,YAAY;QAChB,MAAM,EAAE,QAAQ;QAChB,OAAO,EAAE,IAAI,eAAe;KAC7B;IACD;QACE,KAAK,EAAE,YAAY;QACnB,EAAE,EAAE,YAAY;QAChB,MAAM,EAAE,QAAQ;QAChB,OAAO,EAAE,IAAI,eAAe;KAC7B;IACD;QACE,KAAK,EAAE,GAAG;QACV,EAAE,EAAE,QAAQ;QACZ,OAAO,EAAE,IAAI,YAAY;KAC1B;IACD;QACE,KAAK,EAAE,MAAM;QACb,EAAE,EAAE,MAAM;KACX;IACD;QACE,KAAK,EAAE,QAAQ;QACf,EAAE,EAAE,aAAa;QACjB,MAAM,EAAE,MAAM;QACd,OAAO,EAAE,IAAI,aAAa;KAC3B;IACD;QACE,KAAK,EAAE,QAAQ;QACf,EAAE,EAAE,eAAe;QACnB,MAAM,EAAE,MAAM;QACd,OAAO,EAAE,IAAI,eAAe;KAC7B;IACD;QACE,KAAK,EAAE,MAAM;QACb,EAAE,EAAE,MAAM;QACV,OAAO,EAAE,IAAI,WAAW;KACzB;CACF,CAAC;AAEF,MAAM,OAAO,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;AAEhD;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,UAAU;IAApD;;QACE;;;WAGG;QACyB,aAAQ,GAAG,WAAW,CAAC;QAEzC,mBAAc,GAAG,WAAW,CAAC;IA6JzC,CAAC;IAvJC;;OAEG;IACH,IAAc,SAAS;QACrB,MAAM,MAAM,GAAgB,EAAE,CAAC;QAC/B,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE;YACnB,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,cAAc,EAAE;gBACpC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;aAChB;QACH,CAAC,CAAC,CAAC;QACH,OAAO,MAAM,CAAC;IAChB,CAAC;IAEkB,MAAM,CAAC,EAAwB;QAChD,IAAI,EAAE,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE;YAC3C,IAAI,CAAC,cAAc,EAAE,CAAC;SACvB;QACD,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACnB,CAAC;IAES,cAAc;QACtB,MAAM,EAAE,QAAQ,GAAG,WAAW,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC;QACjD,IAAI,CAAC,OAAO,EAAE;YACZ,OAAO;SACR;QACD,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;QACvD,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;YAClC,OAAO;SACR;QACD,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;IACjD,CAAC;IAES,iBAAiB,CAAC,CAAc;QACxC,MAAM,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,IAA+B,CAAC;QACxD,IAAI,CAAC,MAAM,EAAE;YACX,OAAO;SACR;QACD,MAAM,EAAE,EAAE,EAAE,GAAG,MAAM,CAAC,OAAO,CAAA;QAC7B,IAAI,CAAC,EAAE,EAAE;YACP,OAAO;SACR;QACD,IAAI,IAAI,CAAC,cAAc,KAAK,EAAE,EAAE;YAC9B,OAAO;SACR;QACD,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;QAC7C,IAAI,CAAC,IAAI,EAAE;YACT,OAAO;SACR;QACD,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;YACjB,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,KAAK,EAAE,CAAc,CAAC;YACpE,IAAI,CAAC,QAAQ,GAAG,UAAU,CAAC,EAAE,CAAC;YAC9B,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;SAC1B;aAAM;YACL,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;YACnB,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;SAC1B;IACH,CAAC;IAES,cAAc,CAAC,CAAc;QACrC,MAAM,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,IAA+B,CAAC;QACxD,IAAI,CAAC,MAAM,EAAE;YACX,OAAO;SACR;QACD,MAAM,EAAE,EAAE,EAAE,GAAG,MAAM,CAAC,OAAO,CAAA;QAC7B,IAAI,CAAC,EAAE,EAAE;YACP,OAAO;SACR;QACD,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;IACrB,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;MACT,IAAI,CAAC,sBAAsB,EAAE;MAC7B,IAAI,CAAC,UAAU,EAAE;KAClB,CAAC;IACJ,CAAC;IAES,sBAAsB;QAC9B,OAAO,IAAI,CAAA;;QAEP,IAAI,CAAC,qBAAqB,EAAE;QAC5B,IAAI,CAAC,sBAAsB,EAAE;;KAEhC,CAAC;IACJ,CAAC;IAES,qBAAqB;QAC7B,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,CAAC;QACxC,MAAM,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,WAAW,CAAC,CAAC;QAC7D,MAAM,KAAK,GAAG,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC;QAE7D,OAAO,IAAI,CAAA;;;;;kBAKG,IAAI,CAAC,iBAAiB;;;;;;;;UAQ9B,KAAK;;;UAGL,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA,0CAA0C,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,KAAK,iBAAiB,CAAC;;;KAG5G,CAAC;IACJ,CAAC;IAES,sBAAsB;QAC9B,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QACrC,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE;YACrB,OAAO,EAAE,CAAC;SACX;QACD,MAAM,YAAY,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;QAC5D,MAAM,KAAK,GAAG,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC;QAC9D,OAAO,IAAI,CAAA;;;;;;kBAMG,IAAI,CAAC,cAAc;;;;;;;;UAQ3B,KAAK;;;UAGL,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA,0CAA0C,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,KAAK,iBAAiB,CAAC;;;KAG9G,CAAC;IACJ,CAAC;IAES,UAAU;QAClB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACd,OAAO,EAAE,CAAC;SACX;QACD,OAAO,IAAI,CAAA;+CACgC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;KAC/D,CAAC;IACJ,CAAC;CACF;AA/J6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAwB;AAIvB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAwB;AAE1C;IAAR,KAAK,EAAE;0CAAyB","sourcesContent":["import { IHttpRequest } from \"@api-client/core/build/browser.js\";\nimport { LitElement, TemplateResult, html, PropertyValues } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport CodeSnippet from \"../../code-snippets/CodeSnippet.js\";\nimport CurlSnippet from '../../code-snippets/Bash/CurlSnippet.js';\nimport CcurlSnippet from '../../code-snippets/C/CcurlSnippet.js';\nimport RawSnippet from '../../code-snippets/HTTP/RawSnippet.js';\nimport FetchSnippet from '../../code-snippets/JavaScript/FetchSnippet.js';\nimport AsyncFetchSnippet from '../../code-snippets/JavaScript/AsyncFetchSnippet.js';\nimport NodeSnippet from '../../code-snippets/JavaScript/NodeSnippet.js';\nimport XhrSnippet from '../../code-snippets/JavaScript/XhrSnippet.js';\nimport JQuerySnippet from '../../code-snippets/JavaScript/jQuerySnippet.js';\nimport AxiosSnippet from '../../code-snippets/JavaScript/AxiosSnippet.js';\nimport Python27Snippet from '../../code-snippets/Python/Python27Snippet.js';\nimport Python31Snippet from '../../code-snippets/Python/Python31Snippet.js';\nimport RequestsSnippet from '../../code-snippets/Python/RequestsSnippet.js';\nimport PlatformSnippet from '../../code-snippets/Java/PlatformSnippet.js';\nimport SpringSnippet from '../../code-snippets/Java/SpringSnippet.js';\nimport DartSnippet from '../../code-snippets/Dart/DartSnippet.js';\nimport '../../define/ui/ui-dropdown-list.js';\nimport '../../define/ui/ui-list.js';\nimport '../../define/ui/ui-list-item.js';\nimport '../../define/ui/ui-button.js';\nimport '../../define/ui/ui-icon.js';\n\ninterface CodeGroup {\n  label: string;\n  parent?: string;\n  snippet?: CodeSnippet;\n  id: string;\n}\n\nconst commands: CodeGroup[] = [\n  {\n    id: 'bash-curl',\n    label: 'cURL',\n    snippet: new CurlSnippet,\n  },\n  {\n    id: 'http-raw',\n    label: 'HTTP',\n    snippet: new RawSnippet,\n  },\n  {\n    id: 'javascript',\n    label: 'JavaScript',\n  },\n  {\n    label: 'Async',\n    id: 'javascript-async',\n    parent: 'javascript',\n    snippet: new AsyncFetchSnippet,\n  },\n  {\n    label: 'Fetch',\n    id: 'javascript-fetch',\n    parent: 'javascript',\n    snippet: new FetchSnippet,\n  },\n  {\n    label: 'Node',\n    id: 'javascript-node',\n    parent: 'javascript',\n    snippet: new NodeSnippet,\n  },\n  {\n    label: 'XHR',\n    id: 'javascript-xhr',\n    parent: 'javascript',\n    snippet: new XhrSnippet,\n  },\n  {\n    label: 'jQuery',\n    id: 'javascript-jquery',\n    parent: 'javascript',\n    snippet: new JQuerySnippet,\n  },\n  {\n    label: 'Axios',\n    id: 'javascript-axios',\n    parent: 'javascript',\n    snippet: new AxiosSnippet,\n  },\n  {\n    label: 'Python',\n    id: 'python',\n  },\n  {\n    label: 'Requests',\n    id: 'python-requests',\n    parent: 'python',\n    snippet: new RequestsSnippet,\n  },\n  {\n    label: 'Python 2.7',\n    id: 'python-2.7',\n    parent: 'python',\n    snippet: new Python27Snippet,\n  },\n  {\n    label: 'Python 3.1',\n    id: 'python-3.1',\n    parent: 'python',\n    snippet: new Python31Snippet,\n  },\n  {\n    label: 'C',\n    id: 'c-curl',\n    snippet: new CcurlSnippet,\n  },\n  {\n    label: 'Java',\n    id: 'java',\n  },\n  {\n    label: 'Spring',\n    id: 'java-spring',\n    parent: 'java',\n    snippet: new SpringSnippet,\n  },\n  {\n    label: 'Native',\n    id: 'java-platform',\n    parent: 'java',\n    snippet: new PlatformSnippet,\n  },\n  {\n    label: 'Dart',\n    id: 'dart',\n    snippet: new DartSnippet,\n  }\n];\n\nconst topTabs = commands.filter(i => !i.parent);\n\n/**\n * An element that renders various code snippets from a basic definition of an HTTP request.\n */\nexport default class HttpSnippets extends LitElement {\n  /**\n   * The currently selected snippet.\n   * @attribute\n   */\n  @property({ type: String }) selected = 'bash-curl';\n\n  protected parentLanguage = 'bash-curl';\n\n  @property({ type: Object }) request?: IHttpRequest;\n\n  @state() protected code?: string;\n\n  /**\n   * The list of tab names to render in the view.\n   */\n  protected get groupTabs(): CodeGroup[] {\n    const result: CodeGroup[] = [];\n    commands.forEach(i => {\n      if (i.parent === this.parentLanguage) {\n        result.push(i);\n      }\n    });\n    return result;\n  }\n\n  protected override update(cp: PropertyValues<this>): void {\n    if (cp.has('request') || cp.has('selected')) {\n      this.triggerCommand();\n    }\n    super.update(cp);\n  }\n\n  protected triggerCommand(): void {\n    const { selected = 'bash-curl', request } = this;\n    if (!request) {\n      return;\n    }\n    const instance = commands.find(i => i.id === selected);\n    if (!instance || !instance.snippet) {\n      return;\n    }\n    this.code = instance.snippet.tokenize(request);\n  }\n\n  protected handleGroupSelect(e: CustomEvent): void {\n    const target = e.detail.item as HTMLElement | undefined;\n    if (!target) {\n      return;\n    }\n    const { id } = target.dataset\n    if (!id) {\n      return;\n    }\n    if (this.parentLanguage === id) {\n      return;\n    }\n    const item = commands.find(i => i.id === id);\n    if (!item) {\n      return;\n    }\n    if (!item.snippet) {\n      const firstChild = commands.find(i => i.parent === id) as CodeGroup;\n      this.selected = firstChild.id;\n      this.parentLanguage = id;\n    } else {\n      this.selected = id;\n      this.parentLanguage = id;\n    }\n  }\n\n  protected handleSubGroup(e: CustomEvent): void {\n    const target = e.detail.item as HTMLElement | undefined;\n    if (!target) {\n      return;\n    }\n    const { id } = target.dataset\n    if (!id) {\n      return;\n    }\n    this.selected = id;\n  }\n\n  protected override render(): TemplateResult {\n    return html`\n    ${this.renderSelectionOptions()}\n    ${this.renderCode()}\n    `;\n  }\n\n  protected renderSelectionOptions(): TemplateResult {\n    return html`\n    <div class=\"selection-options\">\n      ${this.renderLanguageOptions()}\n      ${this.renderFrameworkOptions()}\n    </div>\n    `;\n  }\n\n  protected renderLanguageOptions(): TemplateResult {\n    const selectedKey = this.parentLanguage;\n    const selectedItem = topTabs.find(i => i.id === selectedKey);\n    const label = selectedItem ? selectedItem.label : 'Language';\n\n    return html`\n    <ui-dropdown-list\n      verticalAlign=\"top\"\n      class=\"group-dropdown\"\n      closeOnOutsideClick\n       @select=\"${this.handleGroupSelect}\"\n    >\n      <ui-button \n        type=\"tonal\" \n        title=\"Select language\" \n        aria-label=\"Opens a menu to select the language\"\n      >\n        <ui-icon icon=\"arrowDropDown\" slot=\"icon\" role=\"presentation\"></ui-icon>\n        ${label}\n      </ui-button>\n      <ui-list slot=\"dropdown\" role=\"menu\">\n        ${topTabs.map(tab => html`<ui-list-item role=\"menuitem\" data-id=\"${tab.id}\">${tab.label}</ui-list-item>`)}\n      </ui-list>\n    </ui-dropdown-list>\n    `;\n  }\n\n  protected renderFrameworkOptions(): TemplateResult | string {\n    const { groupTabs, selected } = this;\n    if (!groupTabs.length) {\n      return '';\n    }\n    const selectedItem = groupTabs.find(i => i.id === selected);\n    const label = selectedItem ? selectedItem.label : 'Framework';\n    return html`\n\n    <ui-dropdown-list\n      verticalAlign=\"top\"\n      class=\"group-dropdown\"\n      closeOnOutsideClick\n       @select=\"${this.handleSubGroup}\"\n    >\n      <ui-button \n        type=\"tonal\" \n        title=\"Select a framework\" \n        aria-label=\"Opens a menu to select the framework\"\n      >\n        <ui-icon icon=\"arrowDropDown\" slot=\"icon\" role=\"presentation\"></ui-icon>\n        ${label}\n      </ui-button>\n      <ui-list slot=\"dropdown\" role=\"menu\">\n        ${groupTabs.map(tab => html`<ui-list-item role=\"menuitem\" data-id=\"${tab.id}\">${tab.label}</ui-list-item>`)}\n      </ui-list>\n    </ui-dropdown-list>\n    `;\n  }\n\n  protected renderCode(): TemplateResult | string {\n    if (!this.code) {\n      return '';\n    }\n    return html`\n    <code class=\"code language-snippet\"><pre>${unsafeHTML(this.code)}</pre></code>\n    `;\n  }\n}\n"]}

package/dist/elements/dialog/ConfirmDelete.js

@@ -30,18 +30,6 @@ import '../../define/ui/ui-icon.js';
  * ```
  */
 export default class ConfirmDelete extends UiDialog {
-    /**
-     * The type of the delete dialog. Renders a specialized view for the deleting type.
-     */
-    type;
-    /**
-     * General purpose name of the objects to list as to delete.
-     */
-    names;
-    /**
-     * General purpose name of the object to delete.
-     */
-    name;
     renderIcon() {
         const classes = {
             icon: true,

package/dist/elements/dialog/ConfirmDelete.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmDelete.js","sourceRoot":"","sources":["../../../src/elements/dialog/ConfirmDelete.ts"],"names":[],"mappings":"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","sourcesContent":["import { TemplateResult, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\nimport UiDialog from '../../ui/dialog/UiDialog.js';\nimport '../../define/ui/ui-button.js';\nimport '../../define/ui/ui-icon.js';\n\nexport type IDialogType = 'files' | 'project';\n\n/**\n * A dialog that requests the user to confirm a delete action.\n * \n * Listen to the `closed` on the dialog. The CustomEvent has the `detail`\n * object with the `closingReason` retails:\n * - canceled: whether the dialog was cancelled (ESC, outside click, dismiss button)\n * - confirmed: whether the dialog was confirmed by the user\n * \n * The application should handle the event and trigger delete flow.\n * \n * ```javascript\n * const dialog = document.createElement('confirm-delete-dialog');\n * dialog.opened = true;\n * document.body.appendChild(dialog);\n * dialog.addEventListener('closed', (ev: Event) => {\n *   document.body.removeChild(dialog);\n *   const event = ev as CustomEvent;\n *   const { canceled, confirmed } = event.detail;\n *   if (!canceled && confirmed) {\n *     // trigger the flow\n *   }\n * });\n * ```\n */\nexport default class ConfirmDelete extends UiDialog {\n  /**\n   * The type of the delete dialog. Renders a specialized view for the deleting type.\n   */\n  @property({ type: String, reflect: true }) type?: IDialogType;\n\n  /**\n   * General purpose name of the objects to list as to delete.\n   */\n  @property({ type: Array }) names?: string[];\n\n  /**\n   * General purpose name of the object to delete.\n   */\n  @property({ type: Array }) name?: string;\n\n  override renderIcon(): TemplateResult {\n    const classes: ClassInfo = {\n      icon: true,\n      'with-icon': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"icon\"><ui-icon icon=\"deleteOutline\"></ui-icon></div>\n    `;\n  }\n\n  override renderTitle(): TemplateResult {\n    const classes: ClassInfo = {\n      title: true,\n      'with-title': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"title\"><span>Confirm delete</span></div>\n    `;\n  }\n\n  override renderBody(): TemplateResult {\n    return html`\n    <div class=\"content\">${this.renderContent()}</div>\n    `;\n  }\n\n  override renderButtons(): TemplateResult {\n    const { confirmLabel = 'Delete', dismissLabel = 'Cancel' } = this;\n    const classes: ClassInfo = {\n      buttons: true,\n      'with-buttons': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"button\">\n      <ui-button value=\"dismiss\" type=\"text\" class=\"internal-button\" @click=\"${this.handleDismiss}\">${dismissLabel}</ui-button>\n      <ui-button value=\"confirm\" type=\"text\" class=\"internal-button\" @click=\"${this.handleConfirm}\">${confirmLabel}</ui-button>\n    </div>\n    `;\n  }\n\n  protected renderContent(): TemplateResult {\n    switch (this.type) {\n      case 'files': return this.renderFiles();\n      case 'project': return this.renderProject();\n      default: return this._fallbackTemplate();\n    }\n  }\n\n  protected renderFiles(): TemplateResult {\n    const { names=[] } = this;\n    if (!names.length) {\n      return html`<slot><p>Are you sure you want to delete these files?</p></slot>`;\n    }\n    if (names.length === 1) {\n      return html`\n      <p>Confirm moving <b>${names[0]}</b> to trash.</p>\n      `;\n    }\n    return html`\n    <p>Files to be moved to thrash:</p>\n    <ul>\n      ${names.map(n => html`<li>${n}</li>`)}\n    </ul>\n    `;\n  }\n\n  protected renderProject(): TemplateResult {\n    const { name } = this;\n    if (!name) {\n      return html`<slot><p>Are you sure you want to delete this project?</p></slot>`;\n    }\n    return html`<slot><p>Are you sure you want to delete <b>${name}</b> project?</p></slot>`;\n  }\n\n  protected _fallbackTemplate(): TemplateResult {\n    return html`<slot><p>Are you sure you want to delete this?</p></slot>`;\n  }\n}\n"]}
+{"version":3,"file":"ConfirmDelete.js","sourceRoot":"","sources":["../../../src/elements/dialog/ConfirmDelete.ts"],"names":[],"mappings":";AAAA,OAAO,EAAkB,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAa,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,QAAQ,MAAM,6BAA6B,CAAC;AACnD,OAAO,8BAA8B,CAAC;AACtC,OAAO,4BAA4B,CAAC;AAIpC;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,QAAQ;IAgBxC,UAAU;QACjB,MAAM,OAAO,GAAc;YACzB,IAAI,EAAE,IAAI;YACV,WAAW,EAAE,IAAI;SAClB,CAAC;QACF,OAAO,IAAI,CAAA;kBACG,QAAQ,CAAC,OAAO,CAAC;KAC9B,CAAC;IACJ,CAAC;IAEQ,WAAW;QAClB,MAAM,OAAO,GAAc;YACzB,KAAK,EAAE,IAAI;YACX,YAAY,EAAE,IAAI;SACnB,CAAC;QACF,OAAO,IAAI,CAAA;kBACG,QAAQ,CAAC,OAAO,CAAC;KAC9B,CAAC;IACJ,CAAC;IAEQ,UAAU;QACjB,OAAO,IAAI,CAAA;2BACY,IAAI,CAAC,aAAa,EAAE;KAC1C,CAAC;IACJ,CAAC;IAEQ,aAAa;QACpB,MAAM,EAAE,YAAY,GAAG,QAAQ,EAAE,YAAY,GAAG,QAAQ,EAAE,GAAG,IAAI,CAAC;QAClE,MAAM,OAAO,GAAc;YACzB,OAAO,EAAE,IAAI;YACb,cAAc,EAAE,IAAI;SACrB,CAAC;QACF,OAAO,IAAI,CAAA;kBACG,QAAQ,CAAC,OAAO,CAAC;+EAC4C,IAAI,CAAC,aAAa,KAAK,YAAY;+EACnC,IAAI,CAAC,aAAa,KAAK,YAAY;;KAE7G,CAAC;IACJ,CAAC;IAES,aAAa;QACrB,QAAQ,IAAI,CAAC,IAAI,EAAE;YACjB,KAAK,OAAO,CAAC,CAAC,OAAO,IAAI,CAAC,WAAW,EAAE,CAAC;YACxC,KAAK,SAAS,CAAC,CAAC,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC;YAC5C,OAAO,CAAC,CAAC,OAAO,IAAI,CAAC,iBAAiB,EAAE,CAAC;SAC1C;IACH,CAAC;IAES,WAAW;QACnB,MAAM,EAAE,KAAK,GAAC,EAAE,EAAE,GAAG,IAAI,CAAC;QAC1B,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACjB,OAAO,IAAI,CAAA,kEAAkE,CAAC;SAC/E;QACD,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;YACtB,OAAO,IAAI,CAAA;6BACY,KAAK,CAAC,CAAC,CAAC;OAC9B,CAAC;SACH;QACD,OAAO,IAAI,CAAA;;;QAGP,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAA,OAAO,CAAC,OAAO,CAAC;;KAEtC,CAAC;IACJ,CAAC;IAES,aAAa;QACrB,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;QACtB,IAAI,CAAC,IAAI,EAAE;YACT,OAAO,IAAI,CAAA,mEAAmE,CAAC;SAChF;QACD,OAAO,IAAI,CAAA,+CAA+C,IAAI,0BAA0B,CAAC;IAC3F,CAAC;IAES,iBAAiB;QACzB,OAAO,IAAI,CAAA,2DAA2D,CAAC;IACzE,CAAC;CACF;AAzF4C;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2CAAoB;AAKnC;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;4CAAkB;AAKjB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;2CAAe","sourcesContent":["import { TemplateResult, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\nimport UiDialog from '../../ui/dialog/UiDialog.js';\nimport '../../define/ui/ui-button.js';\nimport '../../define/ui/ui-icon.js';\n\nexport type IDialogType = 'files' | 'project';\n\n/**\n * A dialog that requests the user to confirm a delete action.\n * \n * Listen to the `closed` on the dialog. The CustomEvent has the `detail`\n * object with the `closingReason` retails:\n * - canceled: whether the dialog was cancelled (ESC, outside click, dismiss button)\n * - confirmed: whether the dialog was confirmed by the user\n * \n * The application should handle the event and trigger delete flow.\n * \n * ```javascript\n * const dialog = document.createElement('confirm-delete-dialog');\n * dialog.opened = true;\n * document.body.appendChild(dialog);\n * dialog.addEventListener('closed', (ev: Event) => {\n *   document.body.removeChild(dialog);\n *   const event = ev as CustomEvent;\n *   const { canceled, confirmed } = event.detail;\n *   if (!canceled && confirmed) {\n *     // trigger the flow\n *   }\n * });\n * ```\n */\nexport default class ConfirmDelete extends UiDialog {\n  /**\n   * The type of the delete dialog. Renders a specialized view for the deleting type.\n   */\n  @property({ type: String, reflect: true }) type?: IDialogType;\n\n  /**\n   * General purpose name of the objects to list as to delete.\n   */\n  @property({ type: Array }) names?: string[];\n\n  /**\n   * General purpose name of the object to delete.\n   */\n  @property({ type: Array }) name?: string;\n\n  override renderIcon(): TemplateResult {\n    const classes: ClassInfo = {\n      icon: true,\n      'with-icon': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"icon\"><ui-icon icon=\"deleteOutline\"></ui-icon></div>\n    `;\n  }\n\n  override renderTitle(): TemplateResult {\n    const classes: ClassInfo = {\n      title: true,\n      'with-title': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"title\"><span>Confirm delete</span></div>\n    `;\n  }\n\n  override renderBody(): TemplateResult {\n    return html`\n    <div class=\"content\">${this.renderContent()}</div>\n    `;\n  }\n\n  override renderButtons(): TemplateResult {\n    const { confirmLabel = 'Delete', dismissLabel = 'Cancel' } = this;\n    const classes: ClassInfo = {\n      buttons: true,\n      'with-buttons': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"button\">\n      <ui-button value=\"dismiss\" type=\"text\" class=\"internal-button\" @click=\"${this.handleDismiss}\">${dismissLabel}</ui-button>\n      <ui-button value=\"confirm\" type=\"text\" class=\"internal-button\" @click=\"${this.handleConfirm}\">${confirmLabel}</ui-button>\n    </div>\n    `;\n  }\n\n  protected renderContent(): TemplateResult {\n    switch (this.type) {\n      case 'files': return this.renderFiles();\n      case 'project': return this.renderProject();\n      default: return this._fallbackTemplate();\n    }\n  }\n\n  protected renderFiles(): TemplateResult {\n    const { names=[] } = this;\n    if (!names.length) {\n      return html`<slot><p>Are you sure you want to delete these files?</p></slot>`;\n    }\n    if (names.length === 1) {\n      return html`\n      <p>Confirm moving <b>${names[0]}</b> to trash.</p>\n      `;\n    }\n    return html`\n    <p>Files to be moved to thrash:</p>\n    <ul>\n      ${names.map(n => html`<li>${n}</li>`)}\n    </ul>\n    `;\n  }\n\n  protected renderProject(): TemplateResult {\n    const { name } = this;\n    if (!name) {\n      return html`<slot><p>Are you sure you want to delete this project?</p></slot>`;\n    }\n    return html`<slot><p>Are you sure you want to delete <b>${name}</b> project?</p></slot>`;\n  }\n\n  protected _fallbackTemplate(): TemplateResult {\n    return html`<slot><p>Are you sure you want to delete this?</p></slot>`;\n  }\n}\n"]}

package/dist/elements/dialog/Rename.js

@@ -33,12 +33,6 @@ import '../../define/ui/ui-text-field.js';
  * ```
  */
 export default class RenameDialogElement extends UiDialog {
-    /**
-     * The previous name
-     * @attribute
-     */
-    name;
-    newValue;
     get hasValue() {
         const { newValue } = this;
         if (!newValue) {

package/dist/elements/dialog/Rename.js.map

@@ -1 +1 @@
-{"version":3,"file":"Rename.js","sourceRoot":"","sources":["../../../src/elements/dialog/Rename.ts"],"names":[],"mappings":"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","sourcesContent":["import { TemplateResult, html} from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\nimport { live } from 'lit/directives/live.js';\nimport UiDialog from '../../ui/dialog/UiDialog.js';\nimport '../../define/ui/ui-button.js';\nimport '../../define/ui/ui-icon.js';\nimport '../../define/ui/ui-text-field.js';\nimport Input from '../../ui/input/Input.js';\n\n/**\n * A dialog that requests the user for the new name.\n * \n * Listen to the `closed` on the dialog. The CustomEvent has the `detail`\n * object with the `closingReason` retails:\n * - canceled: whether the dialog was cancelled (ESC, outside click, dismiss button)\n * - confirmed: whether the dialog was confirmed by the user\n * - value: The entered name value\n * \n * The application should handle the event and trigger name change flow.\n * \n * ```javascript\n * const dialog = document.createElement('rename-file-dialog');\n * dialog.opened = true;\n * document.body.appendChild(dialog);\n * dialog.addEventListener('closed', (ev: Event) => {\n *   document.body.removeChild(dialog);\n *   const event = ev as CustomEvent;\n *   const { canceled, confirmed, value } = event.detail;\n *   if (!canceled && confirmed && value) {\n *     // trigger the flow\n *   }\n * });\n * ```\n */\nexport default class RenameDialogElement extends UiDialog {\n  /**\n   * The previous name\n   * @attribute\n   */\n  @property({ type: String }) name?: string;\n\n  @state() newValue?: string;\n\n  private get hasValue(): boolean {\n    const { newValue } = this;\n    if (!newValue) {\n      return false;\n    }\n    return newValue.trim().length > 0;\n  }\n\n  protected handleInput(e: Event): void {\n    const input = e.target as Input;\n    this.newValue = input.value;\n  }\n\n  protected handleInputKeyDown(e: KeyboardEvent): void {\n    const confirm = (e.ctrlKey || e.metaKey) && e.key === 'Enter';\n    if (!confirm || !this.hasValue) {\n      return;\n    }\n    this.handleInteraction('confirm');\n  }\n\n  protected override handleInteraction(value: 'dismiss' | 'confirm'): void {\n    if (value === 'confirm') {\n      this.dialogValue = this.newValue;\n    } else {\n      this.dialogValue = undefined;\n    }\n    super.handleInteraction(value);\n  }\n\n  override renderIcon(): TemplateResult {\n    const classes: ClassInfo = {\n      icon: true,\n      'with-icon': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"icon\"><ui-icon icon=\"rename\"></ui-icon></div>\n    `;\n  }\n\n  override renderTitle(): TemplateResult {\n    const classes: ClassInfo = {\n      title: true,\n      'with-title': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"title\"><span>Rename</span></div>\n    `;\n  }\n\n  override renderBody(): TemplateResult {\n    const value = this.newValue || this.name || '';\n    return html`\n    <div class=\"content\">\n      <ui-text-field\n        class=\"file-name\" \n        type=\"text\" \n        name=\"name\"\n        required\n        invalidText=\"The name is required. Please, enter the name.\"\n        @input=\"${this.handleInput}\"\n        @keydown=\"${this.handleInputKeyDown}\"\n        .value=\"${live(value)}\"\n        label=\"Enter new name\"\n      ></ui-text-field>\n    </div>\n    `;\n  }\n\n  override renderButtons(): TemplateResult {\n    const { confirmLabel = 'Rename', dismissLabel = 'Cancel' } = this;\n    const classes: ClassInfo = {\n      buttons: true,\n      'with-buttons': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"button\">\n      <ui-button value=\"dismiss\" type=\"text\" class=\"internal-button\" @click=\"${this.handleDismiss}\">${dismissLabel}</ui-button>\n      <ui-button value=\"confirm\" type=\"text\" class=\"internal-button\" ?disabled=\"${!this.hasValue}\" @click=\"${this.handleConfirm}\">${confirmLabel}</ui-button>\n    </div>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"Rename.js","sourceRoot":"","sources":["../../../src/elements/dialog/Rename.ts"],"names":[],"mappings":"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","sourcesContent":["import { TemplateResult, html} from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\nimport { live } from 'lit/directives/live.js';\nimport UiDialog from '../../ui/dialog/UiDialog.js';\nimport '../../define/ui/ui-button.js';\nimport '../../define/ui/ui-icon.js';\nimport '../../define/ui/ui-text-field.js';\nimport Input from '../../ui/input/Input.js';\n\n/**\n * A dialog that requests the user for the new name.\n * \n * Listen to the `closed` on the dialog. The CustomEvent has the `detail`\n * object with the `closingReason` retails:\n * - canceled: whether the dialog was cancelled (ESC, outside click, dismiss button)\n * - confirmed: whether the dialog was confirmed by the user\n * - value: The entered name value\n * \n * The application should handle the event and trigger name change flow.\n * \n * ```javascript\n * const dialog = document.createElement('rename-file-dialog');\n * dialog.opened = true;\n * document.body.appendChild(dialog);\n * dialog.addEventListener('closed', (ev: Event) => {\n *   document.body.removeChild(dialog);\n *   const event = ev as CustomEvent;\n *   const { canceled, confirmed, value } = event.detail;\n *   if (!canceled && confirmed && value) {\n *     // trigger the flow\n *   }\n * });\n * ```\n */\nexport default class RenameDialogElement extends UiDialog {\n  /**\n   * The previous name\n   * @attribute\n   */\n  @property({ type: String }) name?: string;\n\n  @state() newValue?: string;\n\n  private get hasValue(): boolean {\n    const { newValue } = this;\n    if (!newValue) {\n      return false;\n    }\n    return newValue.trim().length > 0;\n  }\n\n  protected handleInput(e: Event): void {\n    const input = e.target as Input;\n    this.newValue = input.value;\n  }\n\n  protected handleInputKeyDown(e: KeyboardEvent): void {\n    const confirm = (e.ctrlKey || e.metaKey) && e.key === 'Enter';\n    if (!confirm || !this.hasValue) {\n      return;\n    }\n    this.handleInteraction('confirm');\n  }\n\n  protected override handleInteraction(value: 'dismiss' | 'confirm'): void {\n    if (value === 'confirm') {\n      this.dialogValue = this.newValue;\n    } else {\n      this.dialogValue = undefined;\n    }\n    super.handleInteraction(value);\n  }\n\n  override renderIcon(): TemplateResult {\n    const classes: ClassInfo = {\n      icon: true,\n      'with-icon': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"icon\"><ui-icon icon=\"rename\"></ui-icon></div>\n    `;\n  }\n\n  override renderTitle(): TemplateResult {\n    const classes: ClassInfo = {\n      title: true,\n      'with-title': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"title\"><span>Rename</span></div>\n    `;\n  }\n\n  override renderBody(): TemplateResult {\n    const value = this.newValue || this.name || '';\n    return html`\n    <div class=\"content\">\n      <ui-text-field\n        class=\"file-name\" \n        type=\"text\" \n        name=\"name\"\n        required\n        invalidText=\"The name is required. Please, enter the name.\"\n        @input=\"${this.handleInput}\"\n        @keydown=\"${this.handleInputKeyDown}\"\n        .value=\"${live(value)}\"\n        label=\"Enter new name\"\n      ></ui-text-field>\n    </div>\n    `;\n  }\n\n  override renderButtons(): TemplateResult {\n    const { confirmLabel = 'Rename', dismissLabel = 'Cancel' } = this;\n    const classes: ClassInfo = {\n      buttons: true,\n      'with-buttons': true,\n    };\n    return html`\n    <div class=\"${classMap(classes)}\" part=\"button\">\n      <ui-button value=\"dismiss\" type=\"text\" class=\"internal-button\" @click=\"${this.handleDismiss}\">${dismissLabel}</ui-button>\n      <ui-button value=\"confirm\" type=\"text\" class=\"internal-button\" ?disabled=\"${!this.hasValue}\" @click=\"${this.handleConfirm}\">${confirmLabel}</ui-button>\n    </div>\n    `;\n  }\n}\n"]}

package/dist/elements/environment/EnvironmentEditor.js

@@ -19,20 +19,17 @@ import { authTypeToLabel } from '../authorization/AuthLabels.js';
  * An element that renders a form to set up an environment.
  */
 export default class EnvironmentEditor extends LitElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * The environment schema to edit.
+         */
+        this.environment = new Environment().toJSON();
+        this.encapsulateHelp = false;
+    }
     static get styles() {
         return [elementStyles];
     }
-    /**
-     * The environment schema to edit.
-     */
-    environment = new Environment().toJSON();
-    /**
-     * Redirect URL for the OAuth2 authorization.
-     * If can be also set by dispatching `oauth2-redirect-url-changed`
-     * with `value` property on the `detail` object.
-     */
-    oauth2RedirectUri;
-    encapsulateHelp = false;
     updateName(value) {
         this.environment.info.name = value;
         this.notifyChange();

package/dist/elements/environment/EnvironmentEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnvironmentEditor.js","sourceRoot":"","sources":["../../../src/elements/environment/EnvironmentEditor.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable class-methods-use-this */\nimport { LitElement, html, TemplateResult, CSSResult } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { IEnvironment, Environment, IServer, Server, IProperty, IRequestAuthorization, AuthorizationType, RequestAuthorization } from '@api-client/core/build/browser.js';\nimport { live } from 'lit/directives/live.js';\nimport ServerEditor from './ServerEditor.js';\nimport VariablesEditor from './VariablesEditor.js';\nimport { Events } from '../../events/Events.js';\nimport Input from '../../ui/input/Input.js';\nimport elementStyles from './EnvironmentEditor.styles.js';\nimport SwitchElement from '../../ui/input/SwitchElement.js';\nimport '../../define/environment/server-editor.js';\nimport '../../define/environment/variables-editor.js';\nimport '../../define/ui/ui-icon.js';\nimport '../../define/ui/ui-text-field.js';\nimport '../../define/ui/ui-switch.js';\nimport '../../define/ui/ui-icon-button.js';\nimport '../../define/ui/ui-button.js';\nimport '../../define/ui/ui-divider.js';\nimport { authTypeToLabel } from '../authorization/AuthLabels.js';\nimport { Authorization } from '../authorization/ui/Authorization.js';\n\n/**\n * An element that renders a form to set up an environment.\n */\nexport default class EnvironmentEditor extends LitElement {\n  static override get styles(): CSSResult[] {\n    return [elementStyles];\n  }\n\n  /**\n   * The environment schema to edit.\n   */\n  @property({ type: Object }) environment: IEnvironment = new Environment().toJSON();\n\n  /**\n   * Redirect URL for the OAuth2 authorization.\n   * If can be also set by dispatching `oauth2-redirect-url-changed`\n   * with `value` property on the `detail` object.\n   */\n  @property({ type: String }) oauth2RedirectUri?: string;\n\n  @state() encapsulateHelp = false;\n\n  updateName(value: string): void {\n    this.environment.info.name = value;\n    this.notifyChange();\n    Events.HttpProject.State.nameChanged(this.environment.key, this.environment.kind, this);\n  }\n\n  updateEncapsulated(value: boolean): void {\n    this.environment.encapsulated = value;\n    this.notifyChange();\n  }\n\n  deleteServer(): void {\n    this.environment.server = undefined;\n    this.requestUpdate();\n    this.notifyChange();\n  }\n\n  updateVariables(value?: IProperty[]): void {\n    if (value) {\n      this.environment.variables = value;\n    }\n    this.notifyChange();\n    // when modifying variables they won't be reflected in the server editor.\n    const node = this.shadowRoot?.querySelector('server-editor');\n    if (node) {\n      node.generateValue();\n    }\n  }\n\n  protected notifyChange(): void {\n    this.dispatchEvent(new Event('change'));\n  }\n\n  protected handleServerChange(e: Event): void {\n    const editor = e.target as ServerEditor;\n    const value = editor.getSchema();\n    this.environment.server = value;\n    this.notifyChange();\n  }\n\n  protected handleVariableChange(e: Event): void {\n    const editor = e.target as VariablesEditor;\n    const { variables } = editor;\n    this.updateVariables(variables);\n  }\n\n  protected _createServerHandler(): void {\n    const server = new Server();\n    this.environment.server = server.toJSON();\n    this.requestUpdate();\n  }\n\n  protected handleEncapsulatedChange(e: Event): void {\n    const input = e.target as SwitchElement;\n    this.updateEncapsulated(input.checked);\n  }\n\n  protected handleNameChange(e: Event): void {\n    const input = e.target as Input;\n    this.updateName(input.value);\n    input.checkValidity();\n  }\n\n  protected handleToggleHelp(): void {\n    this.encapsulateHelp = !this.encapsulateHelp;\n  }\n\n  protected handleServerDelete(): void {\n    this.deleteServer();\n  }\n\n  protected handleAuthAdd(e: CustomEvent): void {\n    const target = e.detail.item as HTMLElement | undefined;\n    if (!target) {\n      return;\n    }\n    const selected = target.dataset.type as AuthorizationType | undefined;\n    if (!selected) {\n      return;\n    }\n    this.addAuthorization(selected);\n  }\n\n  /**\n   * Adds a new authorization object to the request for the given type.\n   * \n   * @returns The created instance of the authorization.\n   */\n  addAuthorization(type: AuthorizationType): RequestAuthorization {\n    const cnf = RequestAuthorization.fromTypedConfig(type, {}, false);\n    cnf.enabled = true;\n    if (!this.environment.authorization) {\n      this.environment.authorization = [];\n    }\n    this.environment.authorization.push(cnf.toJSON());\n    this.notifyChange();\n    this.requestUpdate();\n    return cnf;\n  }\n\n  protected handleAuthChange(e: Event): void {\n    const editor = e.target as Authorization;\n    const { authorization } = editor;\n    this.updateAuthorization(authorization as IRequestAuthorization, editor.checkValidity());\n  }\n\n  protected handleAuthDelete(e: Event): void {\n    const editor = e.target as Authorization;\n    const { authorization } = editor;\n    if (!authorization) {\n      return;\n    }\n    this.removeAuthorization(authorization.type)\n  }\n\n  /**\n   * Updates authorization schema on the editor.\n   * @param schema The new schema to replace the old one\n   * @param isValid Whether the schema is valid.\n   */\n  updateAuthorization(schema: IRequestAuthorization, isValid: boolean): void {\n    const { authorization } = this.environment;\n    if (!authorization) {\n      return;\n    }\n    const index = authorization.findIndex(i => i.type === schema.type);\n    if (index === -1) {\n      return;\n    }\n    // eslint-disable-next-line no-param-reassign\n    schema.valid = isValid;\n    authorization[index] = schema;\n    this.notifyChange();\n  }\n\n  /**\n   * Removes authorization schema from the editor.\n   * @param type The authorization type to remove.\n   */\n  removeAuthorization(type: string): void {\n    const { authorization } = this.environment;\n    if (!authorization) {\n      return;\n    }\n    const index = authorization.findIndex(i => i.type === type);\n    if (index === -1) {\n      return;\n    }\n    authorization.splice(index, 1);\n    this.notifyChange();\n    this.requestUpdate();\n  }\n\n  protected override render(): TemplateResult {\n    return html`\n    ${this.renderHeader()}\n    ${this.renderEnvironmentEditor()}\n    <ui-divider></ui-divider>\n    ${this.renderServerTemplate()}\n    <ui-divider></ui-divider>\n    ${this.renderVariables()}\n    <ui-divider></ui-divider>\n    ${this.renderAuthorization()}\n    `;\n  }\n\n  protected renderHeader(): TemplateResult {\n    return html`<div class=\"section-title\">Environment</div>`;\n  }\n\n  protected renderEnvironmentEditor(): TemplateResult {\n    return html`\n    <section aria-label=\"Environment configuration\">\n    ${this.renderNameInput()}\n    ${this.renderEncapsulate()}\n    </section>\n    `;\n  }\n\n  protected renderNameInput(): TemplateResult {\n    const { environment } = this;\n    return html`\n    <div class=\"form-item\">\n      <ui-text-field\n        name=\"name\"\n        label=\"Environment name\"\n        required\n        .value=\"${live(environment.info.name || '')}\"\n        @change=\"${this.handleNameChange}\"\n      ></ui-text-field>\n    </div>`;\n  }\n\n  protected renderEncapsulate(): TemplateResult {\n    const { encapsulateHelp } = this;\n    return html`\n    <div class=\"encapsulate-item\">\n      ${this.renderEncapsulateInput()}\n      ${this.renderEncapsulateInfoToggle()}\n    </div>\n    ${encapsulateHelp ? html`\n    <div class=\"help-banner\">\n      By default when running requests in a folder the application reads all environments\n      up to the project root. The variables are then combined into a single object.\n      When <i>encapsulated</i> is enabled, the program stops reading environments above the folder\n      the environment is defined.\n    </div>\n    ` : ''}\n    `;\n  }\n\n  protected renderEncapsulateInput(): TemplateResult {\n    const { environment } = this;\n    return html`\n    <label>\n      <ui-switch\n        name=\"encapsulated\"\n        .checked=\"${environment.encapsulated || false}\"\n        @change=\"${this.handleEncapsulatedChange}\"\n        aria-label=\"Encapsulate the environment\"\n      ></ui-switch>\n      Encapsulate the environment\n    </label>\n    `;\n  }\n\n  protected renderEncapsulateInfoToggle(): TemplateResult {\n    return html`\n    <ui-icon-button aria-label=\"Show or hide help topic\" @click=\"${this.handleToggleHelp}\">\n      <ui-icon icon=\"info\" role=\"presentation\"></ui-icon>\n    </ui-icon-button>\n    `;\n  }\n\n  protected renderServerTemplate(): TemplateResult {\n    const { server } = this.environment;\n    return html`\n    <section aria-label=\"Server information\">\n      ${server ? this.renderServerEditor(server) : this.renderNoServer()}\n    </section>\n    `;\n  }\n\n  protected renderNoServer(): TemplateResult {\n    return html`\n    <div class=\"section-title\">Server</div>\n    <p class=\"empty-info\">No server defined.</p>\n    <ui-button type=\"tonal\" @click=\"${this._createServerHandler}\">Create server</ui-button>\n    `;\n  }\n\n  protected renderServerEditor(server: IServer): TemplateResult {\n    const { uri, basePath, description, protocol } = server;\n    return html`\n    <server-editor \n      .uri=\"${uri}\" \n      .basePath=\"${basePath}\" \n      .description=\"${description}\" \n      .protocol=\"${protocol}\" \n      .variables=\"${this.environment.variables}\"\n      @change=\"${this.handleServerChange}\"\n      @delete=\"${this.handleServerDelete}\"\n    ></server-editor>\n    `;\n  }\n\n  protected renderVariables(): TemplateResult {\n    return html`\n    <section aria-label=\"Variables\">\n      ${this.renderVariablesEditor()}\n    </section>\n    `;\n  }\n\n  protected renderVariablesEditor(): TemplateResult {\n    const { variables } = this.environment;\n    return html`<variables-editor .variables=\"${variables}\" @change=\"${this.handleVariableChange}\"></variables-editor>`;\n  }\n\n  protected renderAuthorization(): TemplateResult {\n    const { authorization = [] } = this.environment;\n    return html`\n    <div class=\"section-title\">Authorization</div>\n    <p class=\"auth-info\">The authorization is applied to all requests in the current folder when the request is executed.</p>\n    ${this.renderAuthorizationActions(authorization)}\n    ${this.renderAuthorizationList(authorization)}\n    `;\n  }\n\n  protected renderAuthorizationActions(current: IRequestAuthorization[] = []): TemplateResult {\n    const all = ['basic', 'oauth 2', 'open id', 'bearer', 'api key', 'ntlm', 'client certificate'];\n    const toRender: string[] = all.filter(type => !current.some(i => i.type === type));\n    return html`\n    <ui-dropdown-list\n      verticalAlign=\"top\"\n      @select=\"${this.handleAuthAdd}\"\n      class=\"auth-dropdown\"\n      closeOnOutsideClick\n    >\n      <ui-button \n        type=\"tonal\" \n        title=\"Add authorization option\" \n        aria-label=\"Opens a menu to select authorization option\"\n        ?disabled=\"${!toRender.length}\"\n      >\n        <ui-icon icon=\"arrowDropDown\" slot=\"icon\" role=\"presentation\"></ui-icon>\n        Add\n      </ui-button>\n      <ui-list slot=\"dropdown\" role=\"menu\">\n        ${this.renderAuthorizationOptions(toRender)}\n      </ui-list>\n    </ui-dropdown-list>\n    `;\n  }\n\n  protected renderAuthorizationOptions(available: string[]): TemplateResult {\n    return html`\n    ${available.map(type => html`\n    <ui-list-item role=\"menuitem\" data-type=\"${type}\">\n      ${authTypeToLabel(type)}\n    </ui-list-item>\n    `)}\n    `;\n  }\n\n  protected renderAuthorizationList(authorization: IRequestAuthorization[] = []): TemplateResult[] {\n    if (!Array.isArray(authorization) || !authorization.length) {\n      return [this.renderEmptyAuthorization()];\n    }\n    return authorization.map((item, index) => {\n      let content: TemplateResult | undefined;\n      switch (item.type) {\n        case 'basic': content = this.renderBasicAuthorization(item); break;\n        case 'bearer': content = this.renderBearerAuthorization(item); break;\n        case 'ntlm': content = this.renderNtlmAuthorization(item); break;\n        case 'oauth 2': content = this.renderOauthAuthorization(item); break;\n        case 'open id': content = this.renderOidcAuthorization(item); break;\n        case 'client certificate': content = this.renderCCAuthorization(item); break;\n        case 'api key': content = this.renderApiKeyAuthorization(item); break;\n        default:\n      }\n      if (content) {\n        const isLast = authorization.length === index + 1;\n        return html`\n        ${content}\n        ${!isLast ? html`<ui-divider></ui-divider>` : ''}\n        `;\n      }\n      return html``;\n    });\n  }\n\n  protected renderEmptyAuthorization(): TemplateResult {\n    return html``;\n  }\n\n  protected renderBasicAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <basic-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n    ></basic-authorization>\n    `;\n  }\n\n  protected renderBearerAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <bearer-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n    ></bearer-authorization>\n    `;\n  }\n\n  protected renderNtlmAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <ntlm-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n    ></ntlm-authorization>\n    `;\n  }\n\n  protected renderOauthAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <oauth2-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n      .defaultRedirectUri=\"${this.oauth2RedirectUri}\"\n    ></oauth2-authorization>\n    `;\n  }\n\n  protected renderOidcAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <oidc-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n      .defaultRedirectUri=\"${this.oauth2RedirectUri}\"\n    ></oidc-authorization>\n    `;\n  }\n\n  protected renderCCAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <cc-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n    ></cc-authorization>\n    `;\n  }\n\n  protected renderApiKeyAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <apikey-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n    ></apikey-authorization>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"EnvironmentEditor.js","sourceRoot":"","sources":["../../../src/elements/environment/EnvironmentEditor.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable class-methods-use-this */\nimport { LitElement, html, TemplateResult, CSSResult } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { IEnvironment, Environment, IServer, Server, IProperty, IRequestAuthorization, AuthorizationType, RequestAuthorization } from '@api-client/core/build/browser.js';\nimport { live } from 'lit/directives/live.js';\nimport ServerEditor from './ServerEditor.js';\nimport VariablesEditor from './VariablesEditor.js';\nimport { Events } from '../../events/Events.js';\nimport Input from '../../ui/input/Input.js';\nimport elementStyles from './EnvironmentEditor.styles.js';\nimport SwitchElement from '../../ui/input/SwitchElement.js';\nimport '../../define/environment/server-editor.js';\nimport '../../define/environment/variables-editor.js';\nimport '../../define/ui/ui-icon.js';\nimport '../../define/ui/ui-text-field.js';\nimport '../../define/ui/ui-switch.js';\nimport '../../define/ui/ui-icon-button.js';\nimport '../../define/ui/ui-button.js';\nimport '../../define/ui/ui-divider.js';\nimport { authTypeToLabel } from '../authorization/AuthLabels.js';\nimport { Authorization } from '../authorization/ui/Authorization.js';\n\n/**\n * An element that renders a form to set up an environment.\n */\nexport default class EnvironmentEditor extends LitElement {\n  static override get styles(): CSSResult[] {\n    return [elementStyles];\n  }\n\n  /**\n   * The environment schema to edit.\n   */\n  @property({ type: Object }) environment: IEnvironment = new Environment().toJSON();\n\n  /**\n   * Redirect URL for the OAuth2 authorization.\n   * If can be also set by dispatching `oauth2-redirect-url-changed`\n   * with `value` property on the `detail` object.\n   */\n  @property({ type: String }) oauth2RedirectUri?: string;\n\n  @state() encapsulateHelp = false;\n\n  updateName(value: string): void {\n    this.environment.info.name = value;\n    this.notifyChange();\n    Events.HttpProject.State.nameChanged(this.environment.key, this.environment.kind, this);\n  }\n\n  updateEncapsulated(value: boolean): void {\n    this.environment.encapsulated = value;\n    this.notifyChange();\n  }\n\n  deleteServer(): void {\n    this.environment.server = undefined;\n    this.requestUpdate();\n    this.notifyChange();\n  }\n\n  updateVariables(value?: IProperty[]): void {\n    if (value) {\n      this.environment.variables = value;\n    }\n    this.notifyChange();\n    // when modifying variables they won't be reflected in the server editor.\n    const node = this.shadowRoot?.querySelector('server-editor');\n    if (node) {\n      node.generateValue();\n    }\n  }\n\n  protected notifyChange(): void {\n    this.dispatchEvent(new Event('change'));\n  }\n\n  protected handleServerChange(e: Event): void {\n    const editor = e.target as ServerEditor;\n    const value = editor.getSchema();\n    this.environment.server = value;\n    this.notifyChange();\n  }\n\n  protected handleVariableChange(e: Event): void {\n    const editor = e.target as VariablesEditor;\n    const { variables } = editor;\n    this.updateVariables(variables);\n  }\n\n  protected _createServerHandler(): void {\n    const server = new Server();\n    this.environment.server = server.toJSON();\n    this.requestUpdate();\n  }\n\n  protected handleEncapsulatedChange(e: Event): void {\n    const input = e.target as SwitchElement;\n    this.updateEncapsulated(input.checked);\n  }\n\n  protected handleNameChange(e: Event): void {\n    const input = e.target as Input;\n    this.updateName(input.value);\n    input.checkValidity();\n  }\n\n  protected handleToggleHelp(): void {\n    this.encapsulateHelp = !this.encapsulateHelp;\n  }\n\n  protected handleServerDelete(): void {\n    this.deleteServer();\n  }\n\n  protected handleAuthAdd(e: CustomEvent): void {\n    const target = e.detail.item as HTMLElement | undefined;\n    if (!target) {\n      return;\n    }\n    const selected = target.dataset.type as AuthorizationType | undefined;\n    if (!selected) {\n      return;\n    }\n    this.addAuthorization(selected);\n  }\n\n  /**\n   * Adds a new authorization object to the request for the given type.\n   * \n   * @returns The created instance of the authorization.\n   */\n  addAuthorization(type: AuthorizationType): RequestAuthorization {\n    const cnf = RequestAuthorization.fromTypedConfig(type, {}, false);\n    cnf.enabled = true;\n    if (!this.environment.authorization) {\n      this.environment.authorization = [];\n    }\n    this.environment.authorization.push(cnf.toJSON());\n    this.notifyChange();\n    this.requestUpdate();\n    return cnf;\n  }\n\n  protected handleAuthChange(e: Event): void {\n    const editor = e.target as Authorization;\n    const { authorization } = editor;\n    this.updateAuthorization(authorization as IRequestAuthorization, editor.checkValidity());\n  }\n\n  protected handleAuthDelete(e: Event): void {\n    const editor = e.target as Authorization;\n    const { authorization } = editor;\n    if (!authorization) {\n      return;\n    }\n    this.removeAuthorization(authorization.type)\n  }\n\n  /**\n   * Updates authorization schema on the editor.\n   * @param schema The new schema to replace the old one\n   * @param isValid Whether the schema is valid.\n   */\n  updateAuthorization(schema: IRequestAuthorization, isValid: boolean): void {\n    const { authorization } = this.environment;\n    if (!authorization) {\n      return;\n    }\n    const index = authorization.findIndex(i => i.type === schema.type);\n    if (index === -1) {\n      return;\n    }\n    // eslint-disable-next-line no-param-reassign\n    schema.valid = isValid;\n    authorization[index] = schema;\n    this.notifyChange();\n  }\n\n  /**\n   * Removes authorization schema from the editor.\n   * @param type The authorization type to remove.\n   */\n  removeAuthorization(type: string): void {\n    const { authorization } = this.environment;\n    if (!authorization) {\n      return;\n    }\n    const index = authorization.findIndex(i => i.type === type);\n    if (index === -1) {\n      return;\n    }\n    authorization.splice(index, 1);\n    this.notifyChange();\n    this.requestUpdate();\n  }\n\n  protected override render(): TemplateResult {\n    return html`\n    ${this.renderHeader()}\n    ${this.renderEnvironmentEditor()}\n    <ui-divider></ui-divider>\n    ${this.renderServerTemplate()}\n    <ui-divider></ui-divider>\n    ${this.renderVariables()}\n    <ui-divider></ui-divider>\n    ${this.renderAuthorization()}\n    `;\n  }\n\n  protected renderHeader(): TemplateResult {\n    return html`<div class=\"section-title\">Environment</div>`;\n  }\n\n  protected renderEnvironmentEditor(): TemplateResult {\n    return html`\n    <section aria-label=\"Environment configuration\">\n    ${this.renderNameInput()}\n    ${this.renderEncapsulate()}\n    </section>\n    `;\n  }\n\n  protected renderNameInput(): TemplateResult {\n    const { environment } = this;\n    return html`\n    <div class=\"form-item\">\n      <ui-text-field\n        name=\"name\"\n        label=\"Environment name\"\n        required\n        .value=\"${live(environment.info.name || '')}\"\n        @change=\"${this.handleNameChange}\"\n      ></ui-text-field>\n    </div>`;\n  }\n\n  protected renderEncapsulate(): TemplateResult {\n    const { encapsulateHelp } = this;\n    return html`\n    <div class=\"encapsulate-item\">\n      ${this.renderEncapsulateInput()}\n      ${this.renderEncapsulateInfoToggle()}\n    </div>\n    ${encapsulateHelp ? html`\n    <div class=\"help-banner\">\n      By default when running requests in a folder the application reads all environments\n      up to the project root. The variables are then combined into a single object.\n      When <i>encapsulated</i> is enabled, the program stops reading environments above the folder\n      the environment is defined.\n    </div>\n    ` : ''}\n    `;\n  }\n\n  protected renderEncapsulateInput(): TemplateResult {\n    const { environment } = this;\n    return html`\n    <label>\n      <ui-switch\n        name=\"encapsulated\"\n        .checked=\"${environment.encapsulated || false}\"\n        @change=\"${this.handleEncapsulatedChange}\"\n        aria-label=\"Encapsulate the environment\"\n      ></ui-switch>\n      Encapsulate the environment\n    </label>\n    `;\n  }\n\n  protected renderEncapsulateInfoToggle(): TemplateResult {\n    return html`\n    <ui-icon-button aria-label=\"Show or hide help topic\" @click=\"${this.handleToggleHelp}\">\n      <ui-icon icon=\"info\" role=\"presentation\"></ui-icon>\n    </ui-icon-button>\n    `;\n  }\n\n  protected renderServerTemplate(): TemplateResult {\n    const { server } = this.environment;\n    return html`\n    <section aria-label=\"Server information\">\n      ${server ? this.renderServerEditor(server) : this.renderNoServer()}\n    </section>\n    `;\n  }\n\n  protected renderNoServer(): TemplateResult {\n    return html`\n    <div class=\"section-title\">Server</div>\n    <p class=\"empty-info\">No server defined.</p>\n    <ui-button type=\"tonal\" @click=\"${this._createServerHandler}\">Create server</ui-button>\n    `;\n  }\n\n  protected renderServerEditor(server: IServer): TemplateResult {\n    const { uri, basePath, description, protocol } = server;\n    return html`\n    <server-editor \n      .uri=\"${uri}\" \n      .basePath=\"${basePath}\" \n      .description=\"${description}\" \n      .protocol=\"${protocol}\" \n      .variables=\"${this.environment.variables}\"\n      @change=\"${this.handleServerChange}\"\n      @delete=\"${this.handleServerDelete}\"\n    ></server-editor>\n    `;\n  }\n\n  protected renderVariables(): TemplateResult {\n    return html`\n    <section aria-label=\"Variables\">\n      ${this.renderVariablesEditor()}\n    </section>\n    `;\n  }\n\n  protected renderVariablesEditor(): TemplateResult {\n    const { variables } = this.environment;\n    return html`<variables-editor .variables=\"${variables}\" @change=\"${this.handleVariableChange}\"></variables-editor>`;\n  }\n\n  protected renderAuthorization(): TemplateResult {\n    const { authorization = [] } = this.environment;\n    return html`\n    <div class=\"section-title\">Authorization</div>\n    <p class=\"auth-info\">The authorization is applied to all requests in the current folder when the request is executed.</p>\n    ${this.renderAuthorizationActions(authorization)}\n    ${this.renderAuthorizationList(authorization)}\n    `;\n  }\n\n  protected renderAuthorizationActions(current: IRequestAuthorization[] = []): TemplateResult {\n    const all = ['basic', 'oauth 2', 'open id', 'bearer', 'api key', 'ntlm', 'client certificate'];\n    const toRender: string[] = all.filter(type => !current.some(i => i.type === type));\n    return html`\n    <ui-dropdown-list\n      verticalAlign=\"top\"\n      @select=\"${this.handleAuthAdd}\"\n      class=\"auth-dropdown\"\n      closeOnOutsideClick\n    >\n      <ui-button \n        type=\"tonal\" \n        title=\"Add authorization option\" \n        aria-label=\"Opens a menu to select authorization option\"\n        ?disabled=\"${!toRender.length}\"\n      >\n        <ui-icon icon=\"arrowDropDown\" slot=\"icon\" role=\"presentation\"></ui-icon>\n        Add\n      </ui-button>\n      <ui-list slot=\"dropdown\" role=\"menu\">\n        ${this.renderAuthorizationOptions(toRender)}\n      </ui-list>\n    </ui-dropdown-list>\n    `;\n  }\n\n  protected renderAuthorizationOptions(available: string[]): TemplateResult {\n    return html`\n    ${available.map(type => html`\n    <ui-list-item role=\"menuitem\" data-type=\"${type}\">\n      ${authTypeToLabel(type)}\n    </ui-list-item>\n    `)}\n    `;\n  }\n\n  protected renderAuthorizationList(authorization: IRequestAuthorization[] = []): TemplateResult[] {\n    if (!Array.isArray(authorization) || !authorization.length) {\n      return [this.renderEmptyAuthorization()];\n    }\n    return authorization.map((item, index) => {\n      let content: TemplateResult | undefined;\n      switch (item.type) {\n        case 'basic': content = this.renderBasicAuthorization(item); break;\n        case 'bearer': content = this.renderBearerAuthorization(item); break;\n        case 'ntlm': content = this.renderNtlmAuthorization(item); break;\n        case 'oauth 2': content = this.renderOauthAuthorization(item); break;\n        case 'open id': content = this.renderOidcAuthorization(item); break;\n        case 'client certificate': content = this.renderCCAuthorization(item); break;\n        case 'api key': content = this.renderApiKeyAuthorization(item); break;\n        default:\n      }\n      if (content) {\n        const isLast = authorization.length === index + 1;\n        return html`\n        ${content}\n        ${!isLast ? html`<ui-divider></ui-divider>` : ''}\n        `;\n      }\n      return html``;\n    });\n  }\n\n  protected renderEmptyAuthorization(): TemplateResult {\n    return html``;\n  }\n\n  protected renderBasicAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <basic-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n    ></basic-authorization>\n    `;\n  }\n\n  protected renderBearerAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <bearer-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n    ></bearer-authorization>\n    `;\n  }\n\n  protected renderNtlmAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <ntlm-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n    ></ntlm-authorization>\n    `;\n  }\n\n  protected renderOauthAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <oauth2-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n      .defaultRedirectUri=\"${this.oauth2RedirectUri}\"\n    ></oauth2-authorization>\n    `;\n  }\n\n  protected renderOidcAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <oidc-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n      .defaultRedirectUri=\"${this.oauth2RedirectUri}\"\n    ></oidc-authorization>\n    `;\n  }\n\n  protected renderCCAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <cc-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n    ></cc-authorization>\n    `;\n  }\n\n  protected renderApiKeyAuthorization(auth: IRequestAuthorization): TemplateResult {\n    return html`\n    <apikey-authorization\n      .authorization=\"${auth}\"\n      class=\"auth-panel\"\n      @change=\"${this.handleAuthChange}\"\n      @delete=\"${this.handleAuthDelete}\"\n    ></apikey-authorization>\n    `;\n  }\n}\n"]}

package/dist/elements/environment/ServerEditor.js

@@ -16,54 +16,16 @@ export const DefaultProtocols = ['http:', 'https:'];
  * @fires delete - When the user requested server definition delete.
  */
 export default class ServerEditor extends LitElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * The server logic used with computations.
+         */
+        this.serverInternal = new Server();
+    }
     static get styles() {
         return [elementStyles];
     }
-    /**
-     * The base URI of the server.
-     *
-     * Note, the URL can contain URI templates (e.g. `http://{host}.api.com/v1`)
-     * In this case the variable is replaced with the system or project variables.
-     *
-     * For simplicity, the `uri` can be the full base URI with protocol, host, and the `basePath`
-     *
-     * @attribute
-     */
-    uri;
-    /**
-     * Usually included in the `uri`. When the `uri` is missing a protocol
-     * this is then used.
-     *
-     * @attribute
-     */
-    protocol;
-    /**
-     * The base path for the server. It starts with the `/`.
-     * When set, it is appended to the `uri` value.
-     *
-     * @attribute
-     */
-    basePath;
-    /**
-     * Optional description of the server.
-     *
-     * @attribute
-     */
-    description;
-    /**
-     * Optional list of variables to set on the environment.
-     * When set it evaluates the final URI value against these properties.
-     */
-    variables;
-    /**
-     * The computed value of the full URI from the values.
-     */
-    valueInternal;
-    /**
-     * The server logic used with computations.
-     */
-    serverInternal = new Server();
-    protocolInput;
     willUpdate(cp) {
         if (cp.has('uri') || cp.has('protocol') || cp.has('basePath') || cp.has('description')) {
             this.setupValue();

package/dist/elements/environment/ServerEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"ServerEditor.js","sourceRoot":"","sources":["../../../src/elements/environment/ServerEditor.ts"],"names":[],"mappings":";AAAA,2CAA2C;AAC3C,OAAO,EAAE,UAAU,EAAE,IAAI,EAA6C,MAAM,KAAK,CAAC;AAClF,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAW,MAAM,EAAa,MAAM,mCAAmC,CAAC;AAC/E,OAAO,aAAa,MAAM,0BAA0B,CAAC;AAErD,OAAO,kCAAkC,CAAC;AAC1C,OAAO,4BAA4B,CAAC;AACpC,OAAO,mCAAmC,CAAC;AAE3C,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;AAEpD;;;;;GAKG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,UAAU;IAClD,MAAM,KAAc,MAAM;QACxB,OAAO,CAAC,aAAa,CAAC,CAAC;IACzB,CAAC;IAED;;;;;;;;;OASG;IACyB,GAAG,CAAU;IAEzC;;;;;OAKG;IACyB,QAAQ,CAAU;IAE9C;;;;;OAKG;IACyB,QAAQ,CAAU;IAE9C;;;;OAIG;IACyB,WAAW,CAAU;IAEjD;;;OAGG;IACwB,SAAS,CAAe;IAEnD;;OAEG;IACO,aAAa,CAAU;IAEjC;;OAEG;IACO,cAAc,GAAG,IAAI,MAAM,EAAE,CAAC;IAEE,aAAa,CAAoB;IAExD,UAAU,CAAC,EAAwB;QACpD,IAAI,EAAE,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE;YACtF,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB;QACD,KAAK,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IACvB,CAAC;IAED;;;;OAIG;IACH,aAAa;QACX,IAAI,CAAC,UAAU,EAAE,CAAC;QAClB,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAES,UAAU;QAClB,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC;QAChC,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,aAAa,GAAG,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAC9D,CAAC;IAES,YAAY;QACpB,MAAM,EAAE,cAAc,EAAE,GAAG,GAAG,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC;QAC3E,cAAc,CAAC,GAAG,GAAG,GAAG,CAAC;QACzB,cAAc,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACnC,cAAc,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACnC,cAAc,CAAC,WAAW,GAAG,WAAW,CAAC;IAC3C,CAAC;IAED;;OAEG;IACH,SAAS;QACP,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC;IACtC,CAAC;IAED;;OAEG;IACH,cAAc,CAAC,KAAsC,EAAE,KAAa;QAClE,IAAI,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAES,eAAe,CAAC,CAAQ;QAChC,MAAM,KAAK,GAAG,CAAC,CAAC,MAAe,CAAC;QAChC,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;QACxC,KAAK,CAAC,aAAa,EAAE,CAAC;IACxB,CAAC;IAES,oBAAoB,CAAC,CAAQ;QACrC,MAAM,KAAK,GAAG,CAAC,CAAC,MAAe,CAAC;QAChC,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;QAC7C,KAAK,CAAC,aAAa,EAAE,CAAC;IACxB,CAAC;IAES,oBAAoB,CAAC,CAAQ;QACrC,MAAM,KAAK,GAAG,CAAC,CAAC,MAAe,CAAC;QAChC,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;QAC7C,KAAK,CAAC,aAAa,EAAE,CAAC;IACxB,CAAC;IAES,YAAY;QACpB,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IAC1C,CAAC;IAES,YAAY;QACpB,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IAC1C,CAAC;IAEQ,MAAM;QACb,OAAO,IAAI,CAAA;MACT,IAAI,CAAC,YAAY,EAAE;;QAEjB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,mBAAmB,EAAE;QAC1B,IAAI,CAAC,mBAAmB,EAAE;;MAE5B,IAAI,CAAC,WAAW,EAAE;KACnB,CAAC;IACJ,CAAC;IAES,YAAY;QACpB,OAAO,IAAI,CAAA;;;QAGP,IAAI,CAAC,kBAAkB,EAAE;;KAE5B,CAAC;IACJ,CAAC;IAES,cAAc;QACtB,OAAO,IAAI,CAAA;;;;;kBAKG,IAAI,CAAC,IAAI,CAAC,GAAG,IAAI,EAAE,CAAC;;mBAEnB,IAAI,CAAC,eAAe;;;KAGlC,CAAC;IACJ,CAAC;IAES,mBAAmB;QAC3B,OAAO,IAAI,CAAA;;;;kBAIG,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAC;iBAC1B,gBAAgB;;mBAEd,IAAI,CAAC,oBAAoB;;WAEjC,CAAC;IACV,CAAC;IAES,mBAAmB;QAC3B,OAAO,IAAI,CAAA;;;;kBAIG,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAC;;mBAExB,IAAI,CAAC,oBAAoB;;WAEjC,CAAC;IACV,CAAC;IAES,WAAW;QACnB,MAAM,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC;QAC/B,IAAI,CAAC,aAAa,EAAE;YAClB,OAAO,EAAE,CAAC;SACX;QACD,OAAO,IAAI,CAAA;;;QAGP,aAAa;;KAEhB,CAAC;IACJ,CAAC;IAES,kBAAkB;QAC1B,OAAO,IAAI,CAAA;8DAC+C,IAAI,CAAC,YAAY;;;KAG1E,CAAC;IACJ,CAAC;CACF;AApM6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCAAc;AAQb;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAmB;AAQlB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAmB;AAOlB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iDAAsB;AAMtB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;+CAAyB;AAYnB;IAA/B,KAAK,CAAC,gBAAgB,EAAE,KAAK,CAAC;mDAA4C","sourcesContent":["/* eslint-disable class-methods-use-this */\nimport { LitElement, html, TemplateResult, CSSResult, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { live } from 'lit/directives/live.js';\nimport { IServer, Server, IProperty } from '@api-client/core/build/browser.js';\nimport elementStyles from './ServerEditor.styles.js';\nimport Input from '../../ui/input/Input.js';\nimport '../../define/ui/ui-text-field.js';\nimport '../../define/ui/ui-icon.js';\nimport '../../define/ui/ui-icon-button.js';\n\nexport const DefaultProtocols = ['http:', 'https:'];\n\n/**\n * An element to render a view for a server definition with a form to edit it.\n * \n * @fires change - When a value change.\n * @fires delete - When the user requested server definition delete.\n */\nexport default class ServerEditor extends LitElement {\n  static override get styles(): CSSResult[] {\n    return [elementStyles];\n  }\n\n  /**\n   * The base URI of the server.\n   * \n   * Note, the URL can contain URI templates (e.g. `http://{host}.api.com/v1`)\n   * In this case the variable is replaced with the system or project variables.\n   * \n   * For simplicity, the `uri` can be the full base URI with protocol, host, and the `basePath`\n   * \n   * @attribute\n   */\n  @property({ type: String }) uri?: string;\n\n  /**\n   * Usually included in the `uri`. When the `uri` is missing a protocol \n   * this is then used.\n   * \n   * @attribute\n   */\n  @property({ type: String }) protocol?: string;\n\n  /**\n   * The base path for the server. It starts with the `/`.\n   * When set, it is appended to the `uri` value.\n   * \n   * @attribute\n   */\n  @property({ type: String }) basePath?: string;\n\n  /**\n   * Optional description of the server.\n   * \n   * @attribute\n   */\n  @property({ type: String }) description?: string;\n\n  /**\n   * Optional list of variables to set on the environment.\n   * When set it evaluates the final URI value against these properties.\n   */\n  @property({ type: Array }) variables?: IProperty[];\n\n  /**\n   * The computed value of the full URI from the values.\n   */\n  protected valueInternal?: string;\n\n  /**\n   * The server logic used with computations.\n   */\n  protected serverInternal = new Server();\n\n  @query('#protocolInput', false) protected protocolInput?: HTMLInputElement;\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    if (cp.has('uri') || cp.has('protocol') || cp.has('basePath') || cp.has('description')) {\n      this.setupValue();\n    }\n    super.willUpdate(cp);\n  }\n\n  /**\n   * Updates the value of the generated base URI.\n   * This can be called from the outside of the component to force computation.\n   * This is helpful when deep-updating variables.\n   */\n  generateValue(): void {\n    this.setupValue();\n    this.requestUpdate();\n  }\n\n  protected setupValue(): void {\n    const { serverInternal } = this;\n    this.updateServer();\n    this.valueInternal = serverInternal.readUri(this.variables);\n  }\n\n  protected updateServer(): void {\n    const { serverInternal, uri = '', protocol, basePath, description } = this;\n    serverInternal.uri = uri;\n    serverInternal.protocol = protocol;\n    serverInternal.basePath = basePath;\n    serverInternal.description = description;\n  }\n\n  /**\n   * Creates a schema for the current values.\n   */\n  getSchema(): IServer {\n    this.updateServer();\n    return this.serverInternal.toJSON();\n  }\n\n  /**\n   * Updates name/value of a parameter on a specific index.\n   */\n  updateProperty(field: 'uri' | 'basePath' | 'protocol', value: string): void {\n    this[field] = value;\n    this.notifyChange();\n  }\n\n  protected handleUriChange(e: Event): void {\n    const input = e.target as Input;\n    this.updateProperty('uri', input.value);\n    input.checkValidity();\n  }\n\n  protected handleBasePathChange(e: Event): void {\n    const input = e.target as Input;\n    this.updateProperty('basePath', input.value);\n    input.checkValidity();\n  }\n\n  protected handleProtocolChange(e: Event): void {\n    const input = e.target as Input;\n    this.updateProperty('protocol', input.value);\n    input.checkValidity();\n  }\n\n  protected notifyChange(): void {\n    this.dispatchEvent(new Event('change'));\n  }\n\n  protected handleDelete(): void {\n    this.dispatchEvent(new Event('delete'));\n  }\n\n  override render(): TemplateResult {\n    return html`\n    ${this.renderHeader()}\n    <form>\n      ${this.renderUriInput()}\n      ${this.renderProtocolInput()}\n      ${this.renderBasePathInput()}\n    </form>\n    ${this.renderValue()}\n    `;\n  }\n\n  protected renderHeader(): TemplateResult {\n    return html`\n    <div class=\"header\">\n      <div class=\"section-title\">Server</div>\n      ${this.renderDeleteButton()}\n    </div>\n    `;\n  }\n\n  protected renderUriInput(): TemplateResult {\n    return html`\n    <div class=\"form-item\">\n      <ui-text-field\n        required\n        name=\"uri\" \n        .value=\"${live(this.uri || '')}\"\n        label=\"URI\"\n        @change=\"${this.handleUriChange}\"\n      ></ui-text-field>\n    </div>\n    `;\n  }\n\n  protected renderProtocolInput(): TemplateResult {\n    return html`\n    <div class=\"form-item\">\n      <ui-text-field\n        name=\"protocol\"\n        .value=\"${live(this.protocol || '')}\"\n        .list=\"${DefaultProtocols}\"\n        label=\"Protocol (optional)\"\n        @change=\"${this.handleProtocolChange}\"\n      ></ui-text-field>\n    </div>`;\n  }\n\n  protected renderBasePathInput(): TemplateResult {\n    return html`\n    <div class=\"form-item\">\n      <ui-text-field\n        name=\"basePath\"\n        .value=\"${live(this.basePath || '')}\"\n        label=\"Base path (optional)\"\n        @change=\"${this.handleBasePathChange}\"\n      ></ui-text-field>\n    </div>`;\n  }\n\n  protected renderValue(): TemplateResult | string {\n    const { valueInternal } = this;\n    if (!valueInternal) {\n      return '';\n    }\n    return html`\n    <div class=\"uri-label\">Server URI</div>\n    <div class=\"value-preview\">\n      ${valueInternal}\n    </div>\n    `;\n  }\n\n  protected renderDeleteButton(): TemplateResult {\n    return html`\n    <ui-icon-button aria-label=\"Remove this server\" @click=\"${this.handleDelete}\">\n      <ui-icon icon=\"deleteOutline\" role=\"presentation\"></ui-icon>\n    </ui-icon-button>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"ServerEditor.js","sourceRoot":"","sources":["../../../src/elements/environment/ServerEditor.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable class-methods-use-this */\nimport { LitElement, html, TemplateResult, CSSResult, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { live } from 'lit/directives/live.js';\nimport { IServer, Server, IProperty } from '@api-client/core/build/browser.js';\nimport elementStyles from './ServerEditor.styles.js';\nimport Input from '../../ui/input/Input.js';\nimport '../../define/ui/ui-text-field.js';\nimport '../../define/ui/ui-icon.js';\nimport '../../define/ui/ui-icon-button.js';\n\nexport const DefaultProtocols = ['http:', 'https:'];\n\n/**\n * An element to render a view for a server definition with a form to edit it.\n * \n * @fires change - When a value change.\n * @fires delete - When the user requested server definition delete.\n */\nexport default class ServerEditor extends LitElement {\n  static override get styles(): CSSResult[] {\n    return [elementStyles];\n  }\n\n  /**\n   * The base URI of the server.\n   * \n   * Note, the URL can contain URI templates (e.g. `http://{host}.api.com/v1`)\n   * In this case the variable is replaced with the system or project variables.\n   * \n   * For simplicity, the `uri` can be the full base URI with protocol, host, and the `basePath`\n   * \n   * @attribute\n   */\n  @property({ type: String }) uri?: string;\n\n  /**\n   * Usually included in the `uri`. When the `uri` is missing a protocol \n   * this is then used.\n   * \n   * @attribute\n   */\n  @property({ type: String }) protocol?: string;\n\n  /**\n   * The base path for the server. It starts with the `/`.\n   * When set, it is appended to the `uri` value.\n   * \n   * @attribute\n   */\n  @property({ type: String }) basePath?: string;\n\n  /**\n   * Optional description of the server.\n   * \n   * @attribute\n   */\n  @property({ type: String }) description?: string;\n\n  /**\n   * Optional list of variables to set on the environment.\n   * When set it evaluates the final URI value against these properties.\n   */\n  @property({ type: Array }) variables?: IProperty[];\n\n  /**\n   * The computed value of the full URI from the values.\n   */\n  protected valueInternal?: string;\n\n  /**\n   * The server logic used with computations.\n   */\n  protected serverInternal = new Server();\n\n  @query('#protocolInput', false) protected protocolInput?: HTMLInputElement;\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    if (cp.has('uri') || cp.has('protocol') || cp.has('basePath') || cp.has('description')) {\n      this.setupValue();\n    }\n    super.willUpdate(cp);\n  }\n\n  /**\n   * Updates the value of the generated base URI.\n   * This can be called from the outside of the component to force computation.\n   * This is helpful when deep-updating variables.\n   */\n  generateValue(): void {\n    this.setupValue();\n    this.requestUpdate();\n  }\n\n  protected setupValue(): void {\n    const { serverInternal } = this;\n    this.updateServer();\n    this.valueInternal = serverInternal.readUri(this.variables);\n  }\n\n  protected updateServer(): void {\n    const { serverInternal, uri = '', protocol, basePath, description } = this;\n    serverInternal.uri = uri;\n    serverInternal.protocol = protocol;\n    serverInternal.basePath = basePath;\n    serverInternal.description = description;\n  }\n\n  /**\n   * Creates a schema for the current values.\n   */\n  getSchema(): IServer {\n    this.updateServer();\n    return this.serverInternal.toJSON();\n  }\n\n  /**\n   * Updates name/value of a parameter on a specific index.\n   */\n  updateProperty(field: 'uri' | 'basePath' | 'protocol', value: string): void {\n    this[field] = value;\n    this.notifyChange();\n  }\n\n  protected handleUriChange(e: Event): void {\n    const input = e.target as Input;\n    this.updateProperty('uri', input.value);\n    input.checkValidity();\n  }\n\n  protected handleBasePathChange(e: Event): void {\n    const input = e.target as Input;\n    this.updateProperty('basePath', input.value);\n    input.checkValidity();\n  }\n\n  protected handleProtocolChange(e: Event): void {\n    const input = e.target as Input;\n    this.updateProperty('protocol', input.value);\n    input.checkValidity();\n  }\n\n  protected notifyChange(): void {\n    this.dispatchEvent(new Event('change'));\n  }\n\n  protected handleDelete(): void {\n    this.dispatchEvent(new Event('delete'));\n  }\n\n  override render(): TemplateResult {\n    return html`\n    ${this.renderHeader()}\n    <form>\n      ${this.renderUriInput()}\n      ${this.renderProtocolInput()}\n      ${this.renderBasePathInput()}\n    </form>\n    ${this.renderValue()}\n    `;\n  }\n\n  protected renderHeader(): TemplateResult {\n    return html`\n    <div class=\"header\">\n      <div class=\"section-title\">Server</div>\n      ${this.renderDeleteButton()}\n    </div>\n    `;\n  }\n\n  protected renderUriInput(): TemplateResult {\n    return html`\n    <div class=\"form-item\">\n      <ui-text-field\n        required\n        name=\"uri\" \n        .value=\"${live(this.uri || '')}\"\n        label=\"URI\"\n        @change=\"${this.handleUriChange}\"\n      ></ui-text-field>\n    </div>\n    `;\n  }\n\n  protected renderProtocolInput(): TemplateResult {\n    return html`\n    <div class=\"form-item\">\n      <ui-text-field\n        name=\"protocol\"\n        .value=\"${live(this.protocol || '')}\"\n        .list=\"${DefaultProtocols}\"\n        label=\"Protocol (optional)\"\n        @change=\"${this.handleProtocolChange}\"\n      ></ui-text-field>\n    </div>`;\n  }\n\n  protected renderBasePathInput(): TemplateResult {\n    return html`\n    <div class=\"form-item\">\n      <ui-text-field\n        name=\"basePath\"\n        .value=\"${live(this.basePath || '')}\"\n        label=\"Base path (optional)\"\n        @change=\"${this.handleBasePathChange}\"\n      ></ui-text-field>\n    </div>`;\n  }\n\n  protected renderValue(): TemplateResult | string {\n    const { valueInternal } = this;\n    if (!valueInternal) {\n      return '';\n    }\n    return html`\n    <div class=\"uri-label\">Server URI</div>\n    <div class=\"value-preview\">\n      ${valueInternal}\n    </div>\n    `;\n  }\n\n  protected renderDeleteButton(): TemplateResult {\n    return html`\n    <ui-icon-button aria-label=\"Remove this server\" @click=\"${this.handleDelete}\">\n      <ui-icon icon=\"deleteOutline\" role=\"presentation\"></ui-icon>\n    </ui-icon-button>\n    `;\n  }\n}\n"]}

package/dist/elements/environment/VariablesEditor.js

@@ -17,21 +17,16 @@ import '../../define/ui/ui-icon-button.js';
  * An element to render a list of variables with an ability to edit them.
  */
 export default class VariablesEditor extends ApiElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * By default all values are masked. When this is set it renders all values visible.
+         */
+        this.renderValues = false;
+    }
     static get styles() {
         return [elementStyles];
     }
-    /**
-     * The list of variables to render or edit.
-     * This list is mutated. If you don't want this to mutate changes
-     * make a copy first.
-     */
-    variables;
-    /**
-     * By default all values are masked. When this is set it renders all values visible.
-     */
-    renderValues = false;
-    editedVariable;
-    editor;
     /**
      * Updates name/value of a parameter on a specific index.
      */

package/dist/elements/environment/VariablesEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"VariablesEditor.js","sourceRoot":"","sources":["../../../src/elements/environment/VariablesEditor.ts"],"names":[],"mappings":";AAAA,2CAA2C;AAC3C,OAAO,EAAE,IAAI,EAA6B,MAAM,KAAK,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAa,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAErE,OAAO,UAAU,MAAM,kBAAkB,CAAC;AAC1C,OAAO,aAAa,MAAM,6BAA6B,CAAC;AAGxD,OAAO,4BAA4B,CAAC;AACpC,OAAO,4BAA4B,CAAC;AACpC,OAAO,iCAAiC,CAAC;AACzC,OAAO,8BAA8B,CAAC;AACtC,OAAO,mCAAmC,CAAC;AAE3C;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,eAAgB,SAAQ,UAAU;IACrD,MAAM,KAAc,MAAM;QACxB,OAAO,CAAC,aAAa,CAAC,CAAC;IACzB,CAAC;IAED;;;;OAIG;IACwB,SAAS,CAAe;IAEnD;;OAEG;IAC0B,YAAY,GAAG,KAAK,CAAC;IAE/B,cAAc,CAAU;IAEf,MAAM,CAAe;IAEjD;;OAEG;IACH,cAAc,CAAC,KAAa,EAAE,KAAuB,EAAE,KAAa;QAClE,MAAM,EAAE,SAAS,GAAG,EAAE,EAAE,GAAG,IAAI,CAAC;QAChC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;YACrB,OAAO;SACR;QACD,SAAS,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC;QAChC,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED;;OAEG;IACH,cAAc,CAAC,KAAa;QAC1B,MAAM,EAAE,SAAS,GAAG,EAAE,EAAE,GAAG,IAAI,CAAC;QAChC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;YACrB,OAAO;SACR;QACD,SAAS,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAC3B,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED;;OAEG;IACH,cAAc,CAAC,KAAa,EAAE,OAAgB;QAC5C,MAAM,EAAE,SAAS,GAAG,EAAE,EAAE,GAAG,IAAI,CAAC;QAChC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;YACrB,OAAO;SACR;QACD,MAAM,QAAQ,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;QAClC,IAAI,QAAQ,CAAC,OAAO,KAAK,OAAO,EAAE;YAChC,OAAO;SACR;QACD,QAAQ,CAAC,OAAO,GAAG,OAAO,CAAC;QAC3B,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAES,aAAa;QACrB,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IAC1C,CAAC;IAES,iBAAiB;QACzB,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;YACnB,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;SACrB;QACD,MAAM,IAAI,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC;QAC/B,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;QACjD,IAAI,CAAC,cAAc,GAAG,KAAK,GAAG,CAAC,CAAC;QAChC,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC5B,CAAC;IAES,KAAK,CAAC,kBAAkB;QAChC,MAAM,IAAI,CAAC,cAAc,CAAC;QAC1B,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;QACxB,IAAI,MAAM,EAAE;YACV,MAAM,CAAC,cAAc,EAAE,CAAC;SACzB;IACH,CAAC;IAED;;OAEG;IACO,sBAAsB;QAC9B,IAAI,CAAC,YAAY,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC;IACzC,CAAC;IAED;;;OAGG;IACO,kBAAkB,CAAC,CAAQ;QACnC,MAAM,IAAI,GAAG,CAAC,CAAC,aAA4B,CAAC;QAC5C,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACzC,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;YACvB,OAAO;SACR;QACD,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;IAC9B,CAAC;IAES,gBAAgB,CAAC,CAAQ;QACjC,MAAM,KAAK,GAAG,CAAC,CAAC,MAAe,CAAC;QAChC,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QAC1C,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;YACvB,OAAO;SACR;QACD,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;QAChD,KAAK,CAAC,aAAa,EAAE,CAAC;IACxB,CAAC;IAES,iBAAiB,CAAC,CAAQ;QAClC,MAAM,KAAK,GAAG,CAAC,CAAC,MAAe,CAAC;QAChC,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QAC1C,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;YACvB,OAAO;SACR;QACD,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;QACjD,KAAK,CAAC,aAAa,EAAE,CAAC;IACxB,CAAC;IAED;;OAEG;IACO,oBAAoB,CAAC,CAAQ;QACrC,MAAM,IAAI,GAAG,CAAC,CAAC,aAA4B,CAAC;QAC5C,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACzC,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;YACvB,OAAO;SACR;QACD,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC7B,CAAC;IAES,YAAY,CAAC,CAAQ;QAC7B,MAAM,IAAI,GAAG,CAAC,CAAC,aAA4B,CAAC;QAC5C,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACzC,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;YACvB,OAAO;SACR;QACD,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC7B,CAAC;IAES,YAAY,CAAC,CAAQ;QAC7B,MAAM,IAAI,GAAG,CAAC,CAAC,aAA8B,CAAC;QAC9C,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACzC,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;YACvB,OAAO;SACR;QACD,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;IAC3C,CAAC;IAED;;OAEG;IACO,iBAAiB;QACzB,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;QAChC,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;MACT,IAAI,CAAC,YAAY,EAAE;MACnB,IAAI,CAAC,UAAU,EAAE;KAClB,CAAC;IACJ,CAAC;IAES,YAAY;QACpB,OAAO,IAAI,CAAA;;;QAGP,IAAI,CAAC,eAAe,EAAE;QACtB,IAAI,CAAC,4BAA4B,EAAE;;KAEtC,CAAC;IACJ,CAAC;IAES,eAAe;QACvB,OAAO,IAAI,CAAA;;;;gBAIC,IAAI,CAAC,iBAAiB;;;KAGjC,CAAC;IACJ,CAAC;IAES,4BAA4B;QACpC,MAAM,IAAI,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,YAAY,CAAa,CAAC;QAC9E,OAAO,IAAI,CAAA;;;;gBAIC,IAAI,CAAC,sBAAsB;;sBAErB,IAAI;KACrB,CAAC;IACJ,CAAC;IAES,UAAU;QAClB,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;QAC3B,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE;YAClD,OAAO,IAAI,CAAC,eAAe,EAAE,CAAC;SAC/B;QAED,OAAO,IAAI,CAAA;;MAET,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;;KAEjE,CAAC;IACJ,CAAC;IAES,eAAe;QACvB,OAAO,IAAI,CAAA,iEAAiE,CAAC;IAC/E,CAAC;IAED;;;OAGG;IACO,cAAc,CAAC,IAA0B,EAAE,KAAa;QAChE,IAAI,IAAI,CAAC,cAAc,KAAK,KAAK,EAAE;YACjC,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;SACvC;QACD,MAAM,OAAO,GAAG;YACd,QAAQ,EAAE,CAAC,IAAI,CAAC,OAAO;YACvB,eAAe,EAAE,IAAI;SACtB,CAAC;QACF,OAAO,IAAI,CAAA;gBACC,QAAQ,CAAC,OAAO,CAAC;oCACG,IAAI,CAAC,IAAI;qCACR,kBAAkB,CAAC,IAAI,CAAC,KAAe,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC;QAC/F,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC;UAC3B,CAAC;IACT,CAAC;IAED;;;OAGG;IACO,iBAAiB,CAAC,KAAa;QACvC,OAAO,IAAI,CAAA;;QAEP,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC;QAC5B,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC;WAC3B,CAAC;IACV,CAAC;IAED;;;OAGG;IACO,YAAY,CAAC,IAA0B,EAAE,KAAa;QAC9D,OAAO,IAAI,CAAA;;;UAGL,IAAI,CAAC,kBAAkB,CAAC,IAAI,EAAE,KAAK,CAAC;UACpC,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,KAAK,CAAC;UACjC,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE,KAAK,CAAC;UAClC,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC;;;KAGlC,CAAC;IACJ,CAAC;IAES,kBAAkB,CAAC,IAA0B,EAAE,KAAa;QACpE,OAAO,IAAI,CAAA;;kBAEG,CAAC,CAAC,IAAI,CAAC,OAAO;iBACf,IAAI,CAAC,YAAY;;;oBAGd,KAAK;;KAEpB,CAAC;IACJ,CAAC;IAES,kBAAkB,CAAC,KAAa;QACxC,OAAO,IAAI,CAAA;;;;oBAIK,KAAK;gBACT,IAAI,CAAC,YAAY;;;;;KAK5B,CAAC;IACJ,CAAC;IAES,gBAAgB,CAAC,KAAa;QACtC,OAAO,IAAI,CAAA;;;;oBAIK,KAAK;gBACT,IAAI,CAAC,kBAAkB;;;;;KAKlC,CAAC;IACJ,CAAC;IAES,iBAAiB,CAAC,KAAa;QACvC,OAAO,IAAI,CAAA;;;;oBAIK,KAAK;gBACT,IAAI,CAAC,iBAAiB;;;;;KAKjC,CAAC;IACJ,CAAC;IAES,eAAe,CAAC,IAA0B,EAAE,KAAa;QACjE,OAAO,IAAI,CAAA;;;;;;;;kBAQG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;sBACX,KAAK;;;;mBAIR,IAAI,CAAC,gBAAgB;;;KAGnC,CAAC;IACJ,CAAC;IAES,gBAAgB,CAAC,IAA0B,EAAE,KAAa;QAClE,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC;QACrD,OAAO,IAAI,CAAA;;;;;gBAKC,IAAI;;kBAEF,IAAI,CAAC,IAAI,CAAC,KAAe,CAAC;sBACtB,KAAK;;mBAER,IAAI,CAAC,iBAAiB;;;KAGpC,CAAC;IACJ,CAAC;CACF;AA9V4B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;kDAAyB;AAKtB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;qDAAsB;AAEzC;IAAR,KAAK,EAAE;uDAAmC;AAEzB;IAAjB,KAAK,CAAC,SAAS,CAAC;+CAAgC","sourcesContent":["/* eslint-disable class-methods-use-this */\nimport { html, TemplateResult, CSSResult } from 'lit';\nimport { live } from 'lit/directives/live.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { IProperty, Property } from '@api-client/core/build/browser.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { variableValueLabel } from '../../lib/environments/Utils.js';\nimport { IconType } from '../../ui/icons/Icons.js';\nimport ApiElement from '../ApiElement.js';\nimport elementStyles from './VariablesEditor.styles.js';\nimport Input from '../../ui/input/Input.js';\nimport SwitchElement from '../../ui/input/SwitchElement.js';\nimport '../../define/ui/ui-icon.js';\nimport '../../define/ui/ui-list.js';\nimport '../../define/ui/ui-list-item.js';\nimport '../../define/ui/ui-switch.js';\nimport '../../define/ui/ui-icon-button.js';\n\n/**\n * An element to render a list of variables with an ability to edit them.\n */\nexport default class VariablesEditor extends ApiElement {\n  static override get styles(): CSSResult[] {\n    return [elementStyles];\n  }\n\n  /**\n   * The list of variables to render or edit.\n   * This list is mutated. If you don't want this to mutate changes \n   * make a copy first. \n   */\n  @property({ type: Array }) variables?: IProperty[];\n\n  /**\n   * By default all values are masked. When this is set it renders all values visible.\n   */\n  @property({ type: Boolean }) renderValues = false;\n\n  @state() protected editedVariable?: number;\n\n  @query('.editor') protected editor?: HTMLElement;\n\n  /**\n   * Updates name/value of a parameter on a specific index.\n   */\n  updateProperty(index: number, field: 'name' | 'value', value: string): void {\n    const { variables = [] } = this;\n    if (!variables[index]) {\n      return;\n    }\n    variables[index][field] = value;\n    this.notifyChanged();\n  }\n\n  /**\n   * Removes a parameter from an index.\n   */\n  removeProperty(index: number): void {\n    const { variables = [] } = this;\n    if (!variables[index]) {\n      return;\n    }\n    variables.splice(index, 1);\n    this.notifyChanged();\n    this.requestUpdate();\n  }\n\n  /**\n   * Toggles enabled state of a parameter.\n   */\n  toggleProperty(index: number, enabled: boolean): void {\n    const { variables = [] } = this;\n    if (!variables[index]) {\n      return;\n    }\n    const variable = variables[index];\n    if (variable.enabled === enabled) {\n      return;\n    }\n    variable.enabled = enabled;\n    this.notifyChanged();\n  }\n  \n  protected notifyChanged(): void {\n    this.dispatchEvent(new Event('change'));\n  }\n\n  protected handleAddVariable(): void {\n    if (!this.variables) {\n      this.variables = [];\n    }\n    const item = Property.String();\n    const index = this.variables.push(item.toJSON());\n    this.editedVariable = index - 1;\n    this.requestUpdate();\n    this.ensureEditorInView();\n  }\n\n  protected async ensureEditorInView(): Promise<void> {\n    await this.updateComplete;\n    const { editor } = this;\n    if (editor) {\n      editor.scrollIntoView();\n    }\n  }\n\n  /**\n   * Toggles visibility of the variable values.\n   */\n  protected handleVisibilityToggle(): void {\n    this.renderValues = !this.renderValues;\n  }\n\n  /**\n   * A handler for the click event on the variable edit icon.\n   * Sets state to edit this variable\n   */\n  protected handleEditVariable(e: Event): void {\n    const node = e.currentTarget as HTMLElement;\n    const index = Number(node.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.editedVariable = index;\n  }\n\n  protected handleNameChange(e: Event): void {\n    const input = e.target as Input;\n    const index = Number(input.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.updateProperty(index, 'name', input.value);\n    input.checkValidity();\n  }\n\n  protected handleValueChange(e: Event): void {\n    const input = e.target as Input;\n    const index = Number(input.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.updateProperty(index, 'value', input.value);\n    input.checkValidity();\n  }\n\n  /**\n   * Removes the variable from the environment\n   */\n  protected handleVariableDelete(e: Event): void {\n    const node = e.currentTarget as HTMLElement;\n    const index = Number(node.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.removeProperty(index);\n  }\n\n  protected handleRemove(e: Event): void {\n    const node = e.currentTarget as HTMLElement;\n    const index = Number(node.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.removeProperty(index);\n  }\n\n  protected handleToggle(e: Event): void {\n    const node = e.currentTarget as SwitchElement;\n    const index = Number(node.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.toggleProperty(index, node.checked);\n  }\n\n  /**\n   * A handler for the variable editor close button click.\n   */\n  protected handleEditorClose(): void {\n    this.editedVariable = undefined;\n    this.requestUpdate();\n  }\n\n  protected override render(): TemplateResult {\n    return html`\n    ${this.renderHeader()}\n    ${this.renderList()}\n    `;\n  }\n\n  protected renderHeader(): TemplateResult {\n    return html`\n    <div class=\"header\">\n      <div class=\"section-title\">Variables</div>\n      ${this.renderAddButton()}\n      ${this.renderToggleVisibilityButton()}\n    </div>\n    `;\n  }\n\n  protected renderAddButton(): TemplateResult {\n    return html`\n    <ui-icon-button\n      title=\"Add a variable\"\n      aria-label=\"Activate to add a new variable\"\n      @click=\"${this.handleAddVariable}\"\n      data-action=\"add-variables\"\n    ><ui-icon icon=\"add\"></ui-icon></ui-icon-button>\n    `;\n  }\n\n  protected renderToggleVisibilityButton(): TemplateResult {\n    const icon = (this.renderValues ? 'visibilityOff' : 'visibility') as IconType;\n    return html`\n    <ui-icon-button\n      title=\"Toggle values visibility\"\n      aria-label=\"Activate to toggle variables visibility\"\n      @click=\"${this.handleVisibilityToggle}\"\n      data-action=\"toggle-visibility\"\n    ><ui-icon icon=\"${icon}\"></ui-icon></ui-icon-button>\n    `;\n  }\n\n  protected renderList(): TemplateResult {\n    const { variables } = this;\n    if (!Array.isArray(variables) || !variables.length) {\n      return this.renderEmptyInfo();\n    }\n\n    return html`\n    <ul class=\"variables-list\">\n    ${variables.map((item, index) => this.renderListItem(item, index))}\n    </ul>\n    `;\n  }\n\n  protected renderEmptyInfo(): TemplateResult {\n    return html`<p class=\"empty-message\">This environment has no variables.</p>`;\n  }\n\n  /**\n   * @param item The variable to render.\n   * @returns The template for the variable line or variable editor\n   */\n  protected renderListItem(item: IProperty | Property, index: number): TemplateResult {\n    if (this.editedVariable === index) {\n      return this.renderEditor(item, index);\n    }\n    const classes = {\n      disabled: !item.enabled,\n      'variable-item': true,\n    };\n    return html`\n    <li class=${classMap(classes)}>\n      <span class=\"variable-name\">${item.name}</span>\n      <span class=\"variable-value\">${variableValueLabel(item.value as string || '', !this.renderValues)}</span>\n      ${this.renderListActions(index)}\n    </li>`;\n  }\n\n  /**\n   * @param index The index of the property on the list\n   * @returns The template for list item actions\n   */\n  protected renderListActions(index: number): TemplateResult {\n    return html`\n    <div class=\"list-actions\">\n      ${this.renderEditButton(index)}\n      ${this.renderDeleteButton(index)}\n    </div>`;\n  }\n\n  /**\n   * @param item The variable to render.\n   * @returns The template for the variables editor\n   */\n  protected renderEditor(item: IProperty | Property, index: number): TemplateResult {\n    return html`\n    <li class=\"editor\">\n      <div class=\"param-row\">\n        ${this.renderToggleButton(item, index)}\n        ${this.renderNameField(item, index)}\n        ${this.renderValueField(item, index)}\n        ${this.renderCloseEditor(index)}\n      </div>\n    </li>\n    `;\n  }\n\n  protected renderToggleButton(item: IProperty | Property, index: number): TemplateResult {\n    return html`\n    <ui-switch \n      .checked=\"${!!item.enabled}\" \n      @change=\"${this.handleToggle}\" \n      title=\"Toggle variable enabled\"\n      aria-label=\"Toggle variable enabled state\"\n      data-index=\"${index}\"\n    ></ui-switch>\n    `;\n  }\n\n  protected renderDeleteButton(index: number): TemplateResult {\n    return html`\n    <ui-icon-button \n      aria-label=\"Deletes this variable\" \n      title=\"Deletes this variable\" \n      data-index=\"${index}\" \n      @click=\"${this.handleRemove}\"\n      data-action=\"delete-editor\"\n    >\n      <ui-icon icon=\"deleteOutline\" role=\"presentation\"></ui-icon>\n    </ui-icon-button>\n    `;\n  }\n\n  protected renderEditButton(index: number): TemplateResult {\n    return html`\n    <ui-icon-button \n      aria-label=\"Edits this variable\" \n      title=\"Edits this variable\" \n      data-index=\"${index}\" \n      @click=\"${this.handleEditVariable}\"\n      data-action=\"edit\"\n    >\n      <ui-icon icon=\"edit\" role=\"presentation\"></ui-icon>\n    </ui-icon-button>\n    `;\n  }\n\n  protected renderCloseEditor(index: number): TemplateResult {\n    return html`\n    <ui-icon-button \n      aria-label=\"Closes the editor\" \n      title=\"Closes the editor\" \n      data-index=\"${index}\" \n      @click=\"${this.handleEditorClose}\"\n      data-action=\"close-editor\"\n    >\n      <ui-icon icon=\"close\" role=\"presentation\"></ui-icon>\n    </ui-icon-button>\n    `;\n  }\n\n  protected renderNameField(item: IProperty | Property, index: number): TemplateResult {\n    return html`\n    <div class=\"input-wrapper name-input\">\n      <div class=\"error\" role=\"presentation\">Invalid character</div>\n      <div class=\"state\"></div>\n      <input\n        type=\"text\"\n        name=\"name\"\n        autocomplete=\"off\"\n        .value=\"${live(item.name)}\" \n        data-index=\"${index}\"\n        pattern=\"[a-zA-Z0-9_]+\" \n        required\n        aria-label=\"Variable name\"\n        @change=\"${this.handleNameChange}\"\n      />\n    </div>\n    `;\n  }\n\n  protected renderValueField(item: IProperty | Property, index: number): TemplateResult {\n    const type = this.renderValues ? 'text' : 'password';\n    return html`\n    <div class=\"input-wrapper value-input\">\n      <div class=\"error\" role=\"presentation\">Invalid character</div>\n      <div class=\"state\"></div>\n      <input\n        type=\"${type}\"\n        name=\"value\"\n        .value=\"${live(item.value as string)}\" \n        data-index=\"${index}\"\n        aria-label=\"Variable value\"\n        @change=\"${this.handleValueChange}\"\n      />\n    </div>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"VariablesEditor.js","sourceRoot":"","sources":["../../../src/elements/environment/VariablesEditor.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable class-methods-use-this */\nimport { html, TemplateResult, CSSResult } from 'lit';\nimport { live } from 'lit/directives/live.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { IProperty, Property } from '@api-client/core/build/browser.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { variableValueLabel } from '../../lib/environments/Utils.js';\nimport { IconType } from '../../ui/icons/Icons.js';\nimport ApiElement from '../ApiElement.js';\nimport elementStyles from './VariablesEditor.styles.js';\nimport Input from '../../ui/input/Input.js';\nimport SwitchElement from '../../ui/input/SwitchElement.js';\nimport '../../define/ui/ui-icon.js';\nimport '../../define/ui/ui-list.js';\nimport '../../define/ui/ui-list-item.js';\nimport '../../define/ui/ui-switch.js';\nimport '../../define/ui/ui-icon-button.js';\n\n/**\n * An element to render a list of variables with an ability to edit them.\n */\nexport default class VariablesEditor extends ApiElement {\n  static override get styles(): CSSResult[] {\n    return [elementStyles];\n  }\n\n  /**\n   * The list of variables to render or edit.\n   * This list is mutated. If you don't want this to mutate changes \n   * make a copy first. \n   */\n  @property({ type: Array }) variables?: IProperty[];\n\n  /**\n   * By default all values are masked. When this is set it renders all values visible.\n   */\n  @property({ type: Boolean }) renderValues = false;\n\n  @state() protected editedVariable?: number;\n\n  @query('.editor') protected editor?: HTMLElement;\n\n  /**\n   * Updates name/value of a parameter on a specific index.\n   */\n  updateProperty(index: number, field: 'name' | 'value', value: string): void {\n    const { variables = [] } = this;\n    if (!variables[index]) {\n      return;\n    }\n    variables[index][field] = value;\n    this.notifyChanged();\n  }\n\n  /**\n   * Removes a parameter from an index.\n   */\n  removeProperty(index: number): void {\n    const { variables = [] } = this;\n    if (!variables[index]) {\n      return;\n    }\n    variables.splice(index, 1);\n    this.notifyChanged();\n    this.requestUpdate();\n  }\n\n  /**\n   * Toggles enabled state of a parameter.\n   */\n  toggleProperty(index: number, enabled: boolean): void {\n    const { variables = [] } = this;\n    if (!variables[index]) {\n      return;\n    }\n    const variable = variables[index];\n    if (variable.enabled === enabled) {\n      return;\n    }\n    variable.enabled = enabled;\n    this.notifyChanged();\n  }\n  \n  protected notifyChanged(): void {\n    this.dispatchEvent(new Event('change'));\n  }\n\n  protected handleAddVariable(): void {\n    if (!this.variables) {\n      this.variables = [];\n    }\n    const item = Property.String();\n    const index = this.variables.push(item.toJSON());\n    this.editedVariable = index - 1;\n    this.requestUpdate();\n    this.ensureEditorInView();\n  }\n\n  protected async ensureEditorInView(): Promise<void> {\n    await this.updateComplete;\n    const { editor } = this;\n    if (editor) {\n      editor.scrollIntoView();\n    }\n  }\n\n  /**\n   * Toggles visibility of the variable values.\n   */\n  protected handleVisibilityToggle(): void {\n    this.renderValues = !this.renderValues;\n  }\n\n  /**\n   * A handler for the click event on the variable edit icon.\n   * Sets state to edit this variable\n   */\n  protected handleEditVariable(e: Event): void {\n    const node = e.currentTarget as HTMLElement;\n    const index = Number(node.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.editedVariable = index;\n  }\n\n  protected handleNameChange(e: Event): void {\n    const input = e.target as Input;\n    const index = Number(input.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.updateProperty(index, 'name', input.value);\n    input.checkValidity();\n  }\n\n  protected handleValueChange(e: Event): void {\n    const input = e.target as Input;\n    const index = Number(input.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.updateProperty(index, 'value', input.value);\n    input.checkValidity();\n  }\n\n  /**\n   * Removes the variable from the environment\n   */\n  protected handleVariableDelete(e: Event): void {\n    const node = e.currentTarget as HTMLElement;\n    const index = Number(node.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.removeProperty(index);\n  }\n\n  protected handleRemove(e: Event): void {\n    const node = e.currentTarget as HTMLElement;\n    const index = Number(node.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.removeProperty(index);\n  }\n\n  protected handleToggle(e: Event): void {\n    const node = e.currentTarget as SwitchElement;\n    const index = Number(node.dataset.index);\n    if (Number.isNaN(index)) {\n      return;\n    }\n    this.toggleProperty(index, node.checked);\n  }\n\n  /**\n   * A handler for the variable editor close button click.\n   */\n  protected handleEditorClose(): void {\n    this.editedVariable = undefined;\n    this.requestUpdate();\n  }\n\n  protected override render(): TemplateResult {\n    return html`\n    ${this.renderHeader()}\n    ${this.renderList()}\n    `;\n  }\n\n  protected renderHeader(): TemplateResult {\n    return html`\n    <div class=\"header\">\n      <div class=\"section-title\">Variables</div>\n      ${this.renderAddButton()}\n      ${this.renderToggleVisibilityButton()}\n    </div>\n    `;\n  }\n\n  protected renderAddButton(): TemplateResult {\n    return html`\n    <ui-icon-button\n      title=\"Add a variable\"\n      aria-label=\"Activate to add a new variable\"\n      @click=\"${this.handleAddVariable}\"\n      data-action=\"add-variables\"\n    ><ui-icon icon=\"add\"></ui-icon></ui-icon-button>\n    `;\n  }\n\n  protected renderToggleVisibilityButton(): TemplateResult {\n    const icon = (this.renderValues ? 'visibilityOff' : 'visibility') as IconType;\n    return html`\n    <ui-icon-button\n      title=\"Toggle values visibility\"\n      aria-label=\"Activate to toggle variables visibility\"\n      @click=\"${this.handleVisibilityToggle}\"\n      data-action=\"toggle-visibility\"\n    ><ui-icon icon=\"${icon}\"></ui-icon></ui-icon-button>\n    `;\n  }\n\n  protected renderList(): TemplateResult {\n    const { variables } = this;\n    if (!Array.isArray(variables) || !variables.length) {\n      return this.renderEmptyInfo();\n    }\n\n    return html`\n    <ul class=\"variables-list\">\n    ${variables.map((item, index) => this.renderListItem(item, index))}\n    </ul>\n    `;\n  }\n\n  protected renderEmptyInfo(): TemplateResult {\n    return html`<p class=\"empty-message\">This environment has no variables.</p>`;\n  }\n\n  /**\n   * @param item The variable to render.\n   * @returns The template for the variable line or variable editor\n   */\n  protected renderListItem(item: IProperty | Property, index: number): TemplateResult {\n    if (this.editedVariable === index) {\n      return this.renderEditor(item, index);\n    }\n    const classes = {\n      disabled: !item.enabled,\n      'variable-item': true,\n    };\n    return html`\n    <li class=${classMap(classes)}>\n      <span class=\"variable-name\">${item.name}</span>\n      <span class=\"variable-value\">${variableValueLabel(item.value as string || '', !this.renderValues)}</span>\n      ${this.renderListActions(index)}\n    </li>`;\n  }\n\n  /**\n   * @param index The index of the property on the list\n   * @returns The template for list item actions\n   */\n  protected renderListActions(index: number): TemplateResult {\n    return html`\n    <div class=\"list-actions\">\n      ${this.renderEditButton(index)}\n      ${this.renderDeleteButton(index)}\n    </div>`;\n  }\n\n  /**\n   * @param item The variable to render.\n   * @returns The template for the variables editor\n   */\n  protected renderEditor(item: IProperty | Property, index: number): TemplateResult {\n    return html`\n    <li class=\"editor\">\n      <div class=\"param-row\">\n        ${this.renderToggleButton(item, index)}\n        ${this.renderNameField(item, index)}\n        ${this.renderValueField(item, index)}\n        ${this.renderCloseEditor(index)}\n      </div>\n    </li>\n    `;\n  }\n\n  protected renderToggleButton(item: IProperty | Property, index: number): TemplateResult {\n    return html`\n    <ui-switch \n      .checked=\"${!!item.enabled}\" \n      @change=\"${this.handleToggle}\" \n      title=\"Toggle variable enabled\"\n      aria-label=\"Toggle variable enabled state\"\n      data-index=\"${index}\"\n    ></ui-switch>\n    `;\n  }\n\n  protected renderDeleteButton(index: number): TemplateResult {\n    return html`\n    <ui-icon-button \n      aria-label=\"Deletes this variable\" \n      title=\"Deletes this variable\" \n      data-index=\"${index}\" \n      @click=\"${this.handleRemove}\"\n      data-action=\"delete-editor\"\n    >\n      <ui-icon icon=\"deleteOutline\" role=\"presentation\"></ui-icon>\n    </ui-icon-button>\n    `;\n  }\n\n  protected renderEditButton(index: number): TemplateResult {\n    return html`\n    <ui-icon-button \n      aria-label=\"Edits this variable\" \n      title=\"Edits this variable\" \n      data-index=\"${index}\" \n      @click=\"${this.handleEditVariable}\"\n      data-action=\"edit\"\n    >\n      <ui-icon icon=\"edit\" role=\"presentation\"></ui-icon>\n    </ui-icon-button>\n    `;\n  }\n\n  protected renderCloseEditor(index: number): TemplateResult {\n    return html`\n    <ui-icon-button \n      aria-label=\"Closes the editor\" \n      title=\"Closes the editor\" \n      data-index=\"${index}\" \n      @click=\"${this.handleEditorClose}\"\n      data-action=\"close-editor\"\n    >\n      <ui-icon icon=\"close\" role=\"presentation\"></ui-icon>\n    </ui-icon-button>\n    `;\n  }\n\n  protected renderNameField(item: IProperty | Property, index: number): TemplateResult {\n    return html`\n    <div class=\"input-wrapper name-input\">\n      <div class=\"error\" role=\"presentation\">Invalid character</div>\n      <div class=\"state\"></div>\n      <input\n        type=\"text\"\n        name=\"name\"\n        autocomplete=\"off\"\n        .value=\"${live(item.name)}\" \n        data-index=\"${index}\"\n        pattern=\"[a-zA-Z0-9_]+\" \n        required\n        aria-label=\"Variable name\"\n        @change=\"${this.handleNameChange}\"\n      />\n    </div>\n    `;\n  }\n\n  protected renderValueField(item: IProperty | Property, index: number): TemplateResult {\n    const type = this.renderValues ? 'text' : 'password';\n    return html`\n    <div class=\"input-wrapper value-input\">\n      <div class=\"error\" role=\"presentation\">Invalid character</div>\n      <div class=\"state\"></div>\n      <input\n        type=\"${type}\"\n        name=\"value\"\n        .value=\"${live(item.value as string)}\" \n        data-index=\"${index}\"\n        aria-label=\"Variable value\"\n        @change=\"${this.handleValueChange}\"\n      />\n    </div>\n    `;\n  }\n}\n"]}