@aquera/nile-elements 0.0.31 → 0.0.32

package/dist/src/nile-switcher/nile-switcher.d.ts

@@ -24,16 +24,14 @@ export interface switchconfig {
     toggleSwitch: boolean;
     disable?: boolean;
     confirmation?: boolean;
-    current: number;
     align: 'block' | 'inline';
     inputs: switchInputType[];
 }
 export interface switchInputType {
-    inputType: INPUT_TYPE_NAMES.DROPDOWN | INPUT_TYPE_NAMES.TEXT | INPUT_TYPE_NAMES.CHECKBOX | INPUT_TYPE_NAMES.TEXTAREA | INPUT_TYPE_NAMES.RADIO | INPUT_TYPE_NAMES.CONTENTEDITOR | INPUT_TYPE_NAMES.OBJECT_MAPPER;
+    inputType: INPUT_TYPE_NAMES.DROPDOWN | INPUT_TYPE_NAMES.TEXT | INPUT_TYPE_NAMES.CHECKBOX | INPUT_TYPE_NAMES.TEXTAREA | INPUT_TYPE_NAMES.RADIO | INPUT_TYPE_NAMES.CONTENTEDITOR | INPUT_TYPE_NAMES.OBJECT_MAPPER | INPUT_TYPE_NAMES.CODE_EDITOR;
     value?: String | boolean;
     label?: String;
     readonly?: boolean;
-    order: number;
     type?: string;
     icon: string;
     mode?: string;
@@ -46,6 +44,8 @@ export interface switchInputType {
     helperText?: string;
     multiple?: boolean;
     noborder?: boolean;
+    multiLine?: boolean;
+    expand?: boolean;
 }
 export declare enum POSITIONS {
     INLINE = "inline",
@@ -62,7 +62,8 @@ export declare enum INPUT_TYPE_NAMES {
     TEXTAREA = "text-area",
     RADIO = "radio",
     CONTENTEDITOR = "content-editor",
-    OBJECT_MAPPER = "object-mapper"
+    OBJECT_MAPPER = "object-mapper",
+    CODE_EDITOR = "code-editor"
 }
 export declare enum MODE {
     CREATE = "create",
@@ -75,8 +76,11 @@ export declare class NileSwitcher extends NileElement {
      */
     static styles: CSSResultGroup;
     nileSwitchConfig: switchconfig;
+    current: Number;
     currentInput: switchInputType;
     connectedCallback(): void;
+    handleSwitcherChange(): void;
+    setCurrentInput(): void;
     disconnectedCallback(): void;
     renderNileText(Input: switchInputType): TemplateResult<1>;
     renderDropdown(Input: switchInputType): TemplateResult<1>;
@@ -86,9 +90,11 @@ export declare class NileSwitcher extends NileElement {
     renderErrorMessage(errorMessage: string): TemplateResult<1>;
     renderContentEditor(Input: switchInputType): TemplateResult<1>;
     renderObjectMapper(): TemplateResult<1>;
+    renderCodeEditor(Input: switchInputType): TemplateResult<1>;
+    handleExpand(event: CustomEvent, inputType: string): void;
     handleChange(event: CustomEvent, inputType: string): void;
     renderIcon(): TemplateResult<1>;
-    toggleField(currentInput: switchInputType): void;
+    toggleField(currentInput: switchInputType, index: Number): void;
     singleFieldSwitcher(): TemplateResult<1>;
     render(): TemplateResult;
 }

package/dist/src/nile-switcher/nile-switcher.js

@@ -12,6 +12,7 @@ import NileElement from '../internal/nile-element';
 import { choose } from 'lit/directives/choose.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { repeat } from 'lit/directives/repeat.js';
+import { watch } from '../internal/watch';
 export var POSITIONS;
 (function (POSITIONS) {
     POSITIONS["INLINE"] = "inline";
@@ -31,6 +32,7 @@ export var INPUT_TYPE_NAMES;
     INPUT_TYPE_NAMES["RADIO"] = "radio";
     INPUT_TYPE_NAMES["CONTENTEDITOR"] = "content-editor";
     INPUT_TYPE_NAMES["OBJECT_MAPPER"] = "object-mapper";
+    INPUT_TYPE_NAMES["CODE_EDITOR"] = "code-editor";
 })(INPUT_TYPE_NAMES || (INPUT_TYPE_NAMES = {}));
 export var MODE;
 (function (MODE) {
@@ -38,11 +40,25 @@ export var MODE;
     MODE["EDIT"] = "edit";
 })(MODE || (MODE = {}));
 let NileSwitcher = class NileSwitcher extends NileElement {
+    constructor() {
+        super(...arguments);
+        this.current = 0;
+    }
     connectedCallback() {
-        this.currentInput = this.nileSwitchConfig.inputs[0];
         super.connectedCallback();
+        this.setCurrentInput();
         this.emit('nile-init');
     }
+    handleSwitcherChange() {
+        this.setCurrentInput();
+    }
+    setCurrentInput() {
+        if (this.nileSwitchConfig?.inputs) {
+            this.currentInput = this.nileSwitchConfig.inputs.filter((input, index) => {
+                return index === this.current;
+            })[0];
+        }
+    }
     disconnectedCallback() {
         super.disconnectedCallback();
         this.emit('nile-destroy');
@@ -176,6 +192,25 @@ let NileSwitcher = class NileSwitcher extends NileElement {
       </nile-icon>
     </nile-input>`;
     }
+    renderCodeEditor(Input) {
+        const { value, multiLine, options, disabled, readonly, errorMessage, error, inputType, noborder, } = Input;
+        return html `<nile-code-editor
+      class=${classMap({
+            'code-editor': true,
+            'code-editor__no-border': !!noborder,
+        })}
+      @nile-expand="${(e) => this.handleExpand(e, INPUT_TYPE_NAMES.CODE_EDITOR)}"
+      @nile-change="${(e) => this.handleChange(e, INPUT_TYPE_NAMES.CODE_EDITOR)}"
+      .multiline="${multiLine}"
+      .value="${value}"
+      .customOptions="${options}"
+      .showLineNumbers="false"
+    ></nile-code-editor> `;
+    }
+    handleExpand(event, inputType) {
+        this.currentInput.expand = event.detail.expand;
+        this.emit('nile-change', { input: this.currentInput });
+    }
     handleChange(event, inputType) {
         switch (inputType) {
             case INPUT_TYPE_NAMES.OBJECT_MAPPER:
@@ -184,6 +219,9 @@ let NileSwitcher = class NileSwitcher extends NileElement {
             case INPUT_TYPE_NAMES.CHECKBOX:
                 this.currentInput.value = event.detail.checked;
                 break;
+            case INPUT_TYPE_NAMES.CODE_EDITOR:
+                this.currentInput.value = event.detail.value;
+                break;
             default:
                 this.currentInput.value = event.detail.value;
         }
@@ -195,7 +233,7 @@ let NileSwitcher = class NileSwitcher extends NileElement {
         const toolTipPosition = this.nileSwitchConfig.align === POSITIONS.BLOCK ? 'top' : 'bottom';
         return html `
       <div class="switcher-icons-container">
-        ${repeat(inputs, input => html ` <nile-tooltip
+        ${repeat(inputs, (input, index) => html ` <nile-tooltip
             class=${classMap({
             'switcher-tooltip-container': true,
         })}
@@ -204,7 +242,7 @@ let NileSwitcher = class NileSwitcher extends NileElement {
           >
             <div  class=${classMap({
             'switcher-icon-container': true,
-            current: input.order === this.currentInput.order,
+            current: index === this.current,
         })}>
                <nile-icon
               size="16"
@@ -213,7 +251,7 @@ let NileSwitcher = class NileSwitcher extends NileElement {
         })}
               .name=${input.icon}
               color="#000000"
-              @click=${() => this.toggleField(input)}
+              @click=${() => this.toggleField(input, index)}
             ></nile-icon>
             <div>
            
@@ -221,8 +259,8 @@ let NileSwitcher = class NileSwitcher extends NileElement {
       </div>
     `;
     }
-    toggleField(currentInput) {
-        this.currentInput = currentInput;
+    toggleField(currentInput, index) {
+        this.current = index;
         this.emit('nile-switch', { input: this.currentInput });
     }
     singleFieldSwitcher() {
@@ -250,6 +288,10 @@ let NileSwitcher = class NileSwitcher extends NileElement {
                 () => this.renderContentEditor(this.currentInput),
             ],
             [INPUT_TYPE_NAMES.OBJECT_MAPPER, () => this.renderObjectMapper()],
+            [
+                INPUT_TYPE_NAMES.CODE_EDITOR,
+                () => this.renderCodeEditor(this.currentInput),
+            ],
         ], () => this.renderNileText(this.currentInput))}
     `;
     }
@@ -275,8 +317,14 @@ __decorate([
     property({ type: Object })
 ], NileSwitcher.prototype, "nileSwitchConfig", void 0);
 __decorate([
-    property()
+    property({ type: Number })
+], NileSwitcher.prototype, "current", void 0);
+__decorate([
+    property({ type: Object })
 ], NileSwitcher.prototype, "currentInput", void 0);
+__decorate([
+    watch(['current'], { waitUntilFirstUpdate: true })
+], NileSwitcher.prototype, "handleSwitcherChange", null);
 NileSwitcher = __decorate([
     customElement('nile-switcher')
 ], NileSwitcher);

package/dist/src/nile-switcher/nile-switcher.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-switcher.js","sourceRoot":"","sources":["../../../src/nile-switcher/nile-switcher.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, property, TemplateResult } from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-switcher.css';\nimport NileElement from '../internal/nile-element';\nimport { CSSResultGroup } from 'lit';\nimport { choose } from 'lit/directives/choose.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { repeat } from 'lit/directives/repeat.js';\n\n/**\n * @summary Allows you to switch between nile elements\n *\n * @dependency nile-icon\n * @dependency nile-input\n * @dependency nile-checkbox\n * @dependency nile-dropdown\n * @dependency nile-textarea\n *\n * @event nile-change - Emitted when the control's value changes.\n * @event nile-switch - Emitted when the nile component is being switched.\n */\n\nexport interface switchconfig {\n  [key: string]: any;\n  toggleSwitch: boolean;\n  disable?: boolean;\n  confirmation?: boolean;\n  current: number;\n  align: 'block' | 'inline';\n  inputs: switchInputType[];\n}\n\nexport interface switchInputType {\n  inputType:\n    | INPUT_TYPE_NAMES.DROPDOWN\n    | INPUT_TYPE_NAMES.TEXT\n    | INPUT_TYPE_NAMES.CHECKBOX\n    | INPUT_TYPE_NAMES.TEXTAREA\n    | INPUT_TYPE_NAMES.RADIO\n    | INPUT_TYPE_NAMES.CONTENTEDITOR\n    | INPUT_TYPE_NAMES.OBJECT_MAPPER;\n  value?: String | boolean;\n  label?: String;\n  readonly?: boolean;\n  order: number;\n  type?: string;\n  icon: string;\n  mode?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  required?: boolean;\n  error?: boolean;\n  errorMessage?: string;\n  options?: Array<any>;\n  helperText?: string;\n  multiple?: boolean;\n  noborder?: boolean;\n}\n\nexport enum POSITIONS {\n  INLINE = 'inline',\n  BLOCK = 'block',\n}\n\nexport enum INPUT_TYPE {\n  DEFAULT = 'defaultInput',\n  SWITCH = 'switchInput',\n}\n\nexport enum INPUT_TYPE_NAMES {\n  DROPDOWN = 'dropdown',\n  TEXT = 'text',\n  CHECKBOX = 'checkbox',\n  TEXTAREA = 'text-area',\n  RADIO = 'radio',\n  CONTENTEDITOR = 'content-editor',\n  OBJECT_MAPPER = 'object-mapper',\n}\n\nexport enum MODE {\n  CREATE = 'create',\n  EDIT = 'edit',\n}\n\n@customElement('nile-switcher')\nexport class NileSwitcher extends NileElement {\n  /**\n   * The styles for nile switcher\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n  static styles: CSSResultGroup = styles;\n\n  @property({ type: Object }) nileSwitchConfig: switchconfig;\n  @property() currentInput: switchInputType;\n\n  connectedCallback() {\n    this.currentInput = this.nileSwitchConfig.inputs[0];\n    super.connectedCallback();\n    this.emit('nile-init');\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.emit('nile-destroy');\n  }\n\n  renderNileText(Input: switchInputType) {\n    const {\n      value,\n      label,\n      placeholder,\n      disabled,\n      required,\n      error,\n      errorMessage,\n      inputType,\n      noborder,\n    } = Input;\n    return html`<nile-input\n      class=${classMap({\n        'switcher-input': true,\n        'switcher-input--noborder': !!noborder,\n      })}\n      .value=${value}\n      .label=${label}\n      .disabled=${disabled}\n      .required=${required}\n      .errorMessage=${errorMessage}\n      .placeholder=${placeholder}\n      .error=${error}\n      @nile-input=${(e: CustomEvent) => {\n        this.handleChange(e, inputType);\n      }}\n    ></nile-input>`;\n  }\n\n  renderDropdown(Input: switchInputType) {\n    const {\n      options,\n      multiple,\n      placeholder,\n      disabled,\n      value,\n      error,\n      errorMessage,\n      inputType,\n    } = Input;\n\n    return html`<nile-select\n      class=\"switcher-dropdown\"\n      .placeholder=${placeholder}\n      .disabled=\"${disabled}\"\n      .multiple=\"${multiple}\"\n      .value=\"${value}\"\n      .error=\"${error}\"\n      .errorMessage=\"${errorMessage}\"\n      @nile-change=${(e: CustomEvent) => {\n        this.handleChange(e, inputType);\n      }}\n    >\n      ${options?.map((option: any) => {\n        return html`<nile-option .value=\"${option}\">${option} </nile-option>`;\n      })}\n    </nile-select>`;\n  }\n\n  renderNileTextArea(Input: switchInputType) {\n    const { value, disabled, readonly, errorMessage, error, inputType } = Input;\n\n    return html`<nile-textarea\n      class=\"switcher-textarea\"\n      .value=${value}\n      .disabled=${disabled}\n      ?readonly=${readonly}\n      .error=${error}\n      .errorMessage=${errorMessage}\n      @nile-input=${(e: CustomEvent) => {\n        this.handleChange(e, inputType);\n      }}\n    ></nile-textarea>`;\n  }\n\n  renderNileCheckBox(Input: switchInputType) {\n    const { value, label, disabled, inputType } = Input;\n\n    return html`<nile-checkbox\n        class=\"switcher-checkbox\"\n        .checked=${value}\n        .label=${label}\n        .disabled=${disabled}\n        @valueChange=${(e: CustomEvent) => {\n          this.handleChange(e, inputType);\n        }}\n      ></nile-checkbox\n      >; `;\n  }\n\n  renderNileRadio(Input: switchInputType) {\n    const { options, value, disabled, errorMessage, inputType } = Input;\n\n    const haserrorMessage = !!errorMessage;\n\n    return html`<nile-radio-group\n      class=\"switcher-radio-group\"\n      .value=${value}\n      .disabled=${disabled}\n      @change=${(e: CustomEvent) => {\n        this.handleChange(e, inputType);\n      }}\n    >\n      ${options &&\n      options.map((option: any) => {\n        return html`<nile-radio .value=\"${option}\">${option} </nile-radio>`;\n      })}\n      ${haserrorMessage ? this.renderErrorMessage(errorMessage) : ''}\n    </nile-radio-group> `;\n  }\n\n  renderErrorMessage(errorMessage: string) {\n    return html`\n      <nile-form-error-message>${errorMessage}</nile-form-error-message>\n    `;\n  }\n\n  renderContentEditor(Input: switchInputType) {\n    let { options, inputType, errorMessage, type, readonly, noborder, value } =\n      Input;\n    return html`<nile-content-editor\n      class=\"switcher-content-editor\"\n      .value=${value}\n      .options=${options}\n      .type=${type}\n      .readonly=${readonly}\n      .noborder=${noborder}\n      .errorMessage=${errorMessage}\n      @nile-change=${(e: CustomEvent) => {\n        this.handleChange(e, inputType);\n      }}\n    >\n    </nile-content-editor>`;\n  }\n\n  renderObjectMapper() {\n    const noborder = this.currentInput.noborder;\n    const mode = this.currentInput.mode;\n    const value =\n      this.currentInput.mode === MODE.CREATE\n        ? 'Click to Create - Not Mapped'\n        : '';\n\n    return html`<nile-input\n      class=${classMap({\n        'switcher-object-mapper': true,\n        'switcher-object-mapper--noborder': !!noborder,\n      })}\n      .value=${value}\n      readonly=\"true\"\n      @click=\"${(e: CustomEvent) =>\n        this.handleChange(e, INPUT_TYPE_NAMES.OBJECT_MAPPER)}\"\n    >\n      <nile-icon\n        class=\"pointer-cursor switcher-object-mapper-icon\"\n        slot=\"suffix\"\n        name=\"collapse\"\n        color=\"#005EA6\"\n        size=\"16\"\n      >\n      </nile-icon>\n    </nile-input>`;\n  }\n\n  handleChange(event: CustomEvent, inputType: string) {\n    switch (inputType) {\n      case INPUT_TYPE_NAMES.OBJECT_MAPPER:\n        this.currentInput.value = 'clicked';\n        break;\n      case INPUT_TYPE_NAMES.CHECKBOX:\n        this.currentInput.value = event.detail.checked;\n        break;\n      default:\n        this.currentInput.value = event.detail.value;\n    }\n    event.stopPropagation();\n    this.emit('nile-change', { input: this.currentInput });\n  }\n\n  renderIcon() {\n    const inputs = this.nileSwitchConfig.inputs;\n    const toolTipPosition =\n      this.nileSwitchConfig.align === POSITIONS.BLOCK ? 'top' : 'bottom';\n\n    return html`\n      <div class=\"switcher-icons-container\">\n        ${repeat(\n          inputs,\n          input => html` <nile-tooltip\n            class=${classMap({\n              'switcher-tooltip-container': true,\n            })}\n            content=${input.helperText}\n            placement=${toolTipPosition}\n          >\n            <div  class=${classMap({\n              'switcher-icon-container': true,\n              current: input.order === this.currentInput.order,\n            })}>\n               <nile-icon\n              size=\"16\"\n              class=${classMap({\n                'pointer-cursor': true,\n              })}\n              .name=${input.icon}\n              color=\"#000000\"\n              @click=${() => this.toggleField(input)}\n            ></nile-icon>\n            <div>\n           \n          </nile-tooltip>`\n        )}\n      </div>\n    `;\n  }\n\n  toggleField(currentInput: switchInputType) {\n    this.currentInput = currentInput;\n    this.emit('nile-switch', { input: this.currentInput });\n  }\n\n  singleFieldSwitcher() {\n    return html`\n      ${choose(\n        this.currentInput.inputType,\n        [\n          [INPUT_TYPE_NAMES.TEXT, () => this.renderNileText(this.currentInput)],\n          [\n            INPUT_TYPE_NAMES.CHECKBOX,\n            () => this.renderNileCheckBox(this.currentInput),\n          ],\n          [\n            INPUT_TYPE_NAMES.TEXTAREA,\n            () => this.renderNileTextArea(this.currentInput),\n          ],\n          [\n            INPUT_TYPE_NAMES.RADIO,\n            () => this.renderNileRadio(this.currentInput),\n          ],\n          [\n            INPUT_TYPE_NAMES.DROPDOWN,\n            () => this.renderDropdown(this.currentInput),\n          ],\n          [\n            INPUT_TYPE_NAMES.CONTENTEDITOR,\n            () => this.renderContentEditor(this.currentInput),\n          ],\n          [INPUT_TYPE_NAMES.OBJECT_MAPPER, () => this.renderObjectMapper()],\n        ],\n        () => this.renderNileText(this.currentInput)\n      )}\n    `;\n  }\n\n  public render(): TemplateResult {\n    const align = this.nileSwitchConfig.align;\n    return html`<div\n      class=${classMap({\n        'switcher-block': align === POSITIONS.BLOCK,\n        'switcher-inline': align === POSITIONS.INLINE,\n        'switcher-input-container': true,\n      })}\n    >\n      ${this.renderIcon()} ${this.singleFieldSwitcher()}\n    </div>`;\n  }\n}\n\nexport default NileSwitcher;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-switcher': NileSwitcher;\n  }\n}\n"]}
+{"version":3,"file":"nile-switcher.js","sourceRoot":"","sources":["../../../src/nile-switcher/nile-switcher.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, property, TemplateResult } from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-switcher.css';\nimport NileElement from '../internal/nile-element';\nimport { CSSResultGroup } from 'lit';\nimport { choose } from 'lit/directives/choose.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { watch } from '../internal/watch';\n\n/**\n * @summary Allows you to switch between nile elements\n *\n * @dependency nile-icon\n * @dependency nile-input\n * @dependency nile-checkbox\n * @dependency nile-dropdown\n * @dependency nile-textarea\n *\n * @event nile-change - Emitted when the control's value changes.\n * @event nile-switch - Emitted when the nile component is being switched.\n */\n\nexport interface switchconfig {\n  [key: string]: any;\n  toggleSwitch: boolean;\n  disable?: boolean;\n  confirmation?: boolean;\n  align: 'block' | 'inline';\n  inputs: switchInputType[];\n}\n\nexport interface switchInputType {\n  inputType:\n    | INPUT_TYPE_NAMES.DROPDOWN\n    | INPUT_TYPE_NAMES.TEXT\n    | INPUT_TYPE_NAMES.CHECKBOX\n    | INPUT_TYPE_NAMES.TEXTAREA\n    | INPUT_TYPE_NAMES.RADIO\n    | INPUT_TYPE_NAMES.CONTENTEDITOR\n    | INPUT_TYPE_NAMES.OBJECT_MAPPER\n    | INPUT_TYPE_NAMES.CODE_EDITOR;\n  value?: String | boolean;\n  label?: String;\n  readonly?: boolean;\n  type?: string;\n  icon: string;\n  mode?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  required?: boolean;\n  error?: boolean;\n  errorMessage?: string;\n  options?: Array<any>;\n  helperText?: string;\n  multiple?: boolean;\n  noborder?: boolean;\n  multiLine?: boolean;\n  expand?: boolean;\n}\n\nexport enum POSITIONS {\n  INLINE = 'inline',\n  BLOCK = 'block',\n}\n\nexport enum INPUT_TYPE {\n  DEFAULT = 'defaultInput',\n  SWITCH = 'switchInput',\n}\n\nexport enum INPUT_TYPE_NAMES {\n  DROPDOWN = 'dropdown',\n  TEXT = 'text',\n  CHECKBOX = 'checkbox',\n  TEXTAREA = 'text-area',\n  RADIO = 'radio',\n  CONTENTEDITOR = 'content-editor',\n  OBJECT_MAPPER = 'object-mapper',\n  CODE_EDITOR = 'code-editor',\n}\n\nexport enum MODE {\n  CREATE = 'create',\n  EDIT = 'edit',\n}\n\n@customElement('nile-switcher')\nexport class NileSwitcher extends NileElement {\n  /**\n   * The styles for nile switcher\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n  static styles: CSSResultGroup = styles;\n\n  @property({ type: Object }) nileSwitchConfig: switchconfig;\n\n  @property({ type: Number }) current: Number = 0;\n\n  @property({ type: Object }) currentInput: switchInputType;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.setCurrentInput();\n    this.emit('nile-init');\n  }\n\n  @watch(['current'], { waitUntilFirstUpdate: true })\n  handleSwitcherChange() {\n    this.setCurrentInput();\n  }\n\n  setCurrentInput() {\n    if (this.nileSwitchConfig?.inputs) {\n      this.currentInput = this.nileSwitchConfig.inputs.filter(\n        (input: switchInputType, index: Number) => {\n          return index === this.current;\n        }\n      )[0];\n    }\n  }\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.emit('nile-destroy');\n  }\n\n  renderNileText(Input: switchInputType) {\n    const {\n      value,\n      label,\n      placeholder,\n      disabled,\n      required,\n      error,\n      errorMessage,\n      inputType,\n      noborder,\n    } = Input;\n    return html`<nile-input\n      class=${classMap({\n        'switcher-input': true,\n        'switcher-input--noborder': !!noborder,\n      })}\n      .value=${value}\n      .label=${label}\n      .disabled=${disabled}\n      .required=${required}\n      .errorMessage=${errorMessage}\n      .placeholder=${placeholder}\n      .error=${error}\n      @nile-input=${(e: CustomEvent) => {\n        this.handleChange(e, inputType);\n      }}\n    ></nile-input>`;\n  }\n\n  renderDropdown(Input: switchInputType) {\n    const {\n      options,\n      multiple,\n      placeholder,\n      disabled,\n      value,\n      error,\n      errorMessage,\n      inputType,\n    } = Input;\n\n    return html`<nile-select\n      class=\"switcher-dropdown\"\n      .placeholder=${placeholder}\n      .disabled=\"${disabled}\"\n      .multiple=\"${multiple}\"\n      .value=\"${value}\"\n      .error=\"${error}\"\n      .errorMessage=\"${errorMessage}\"\n      @nile-change=${(e: CustomEvent) => {\n        this.handleChange(e, inputType);\n      }}\n    >\n      ${options?.map((option: any) => {\n        return html`<nile-option .value=\"${option}\">${option} </nile-option>`;\n      })}\n    </nile-select>`;\n  }\n\n  renderNileTextArea(Input: switchInputType) {\n    const { value, disabled, readonly, errorMessage, error, inputType } = Input;\n\n    return html`<nile-textarea\n      class=\"switcher-textarea\"\n      .value=${value}\n      .disabled=${disabled}\n      ?readonly=${readonly}\n      .error=${error}\n      .errorMessage=${errorMessage}\n      @nile-input=${(e: CustomEvent) => {\n        this.handleChange(e, inputType);\n      }}\n    ></nile-textarea>`;\n  }\n\n  renderNileCheckBox(Input: switchInputType) {\n    const { value, label, disabled, inputType } = Input;\n\n    return html`<nile-checkbox\n        class=\"switcher-checkbox\"\n        .checked=${value}\n        .label=${label}\n        .disabled=${disabled}\n        @valueChange=${(e: CustomEvent) => {\n          this.handleChange(e, inputType);\n        }}\n      ></nile-checkbox\n      >; `;\n  }\n\n  renderNileRadio(Input: switchInputType) {\n    const { options, value, disabled, errorMessage, inputType } = Input;\n\n    const haserrorMessage = !!errorMessage;\n\n    return html`<nile-radio-group\n      class=\"switcher-radio-group\"\n      .value=${value}\n      .disabled=${disabled}\n      @change=${(e: CustomEvent) => {\n        this.handleChange(e, inputType);\n      }}\n    >\n      ${options &&\n      options.map((option: any) => {\n        return html`<nile-radio .value=\"${option}\">${option} </nile-radio>`;\n      })}\n      ${haserrorMessage ? this.renderErrorMessage(errorMessage) : ''}\n    </nile-radio-group> `;\n  }\n\n  renderErrorMessage(errorMessage: string) {\n    return html`\n      <nile-form-error-message>${errorMessage}</nile-form-error-message>\n    `;\n  }\n\n  renderContentEditor(Input: switchInputType) {\n    let { options, inputType, errorMessage, type, readonly, noborder, value } =\n      Input;\n    return html`<nile-content-editor\n      class=\"switcher-content-editor\"\n      .value=${value}\n      .options=${options}\n      .type=${type}\n      .readonly=${readonly}\n      .noborder=${noborder}\n      .errorMessage=${errorMessage}\n      @nile-change=${(e: CustomEvent) => {\n        this.handleChange(e, inputType);\n      }}\n    >\n    </nile-content-editor>`;\n  }\n\n  renderObjectMapper() {\n    const noborder = this.currentInput.noborder;\n    const mode = this.currentInput.mode;\n    const value =\n      this.currentInput.mode === MODE.CREATE\n        ? 'Click to Create - Not Mapped'\n        : '';\n\n    return html`<nile-input\n      class=${classMap({\n        'switcher-object-mapper': true,\n        'switcher-object-mapper--noborder': !!noborder,\n      })}\n      .value=${value}\n      readonly=\"true\"\n      @click=\"${(e: CustomEvent) =>\n        this.handleChange(e, INPUT_TYPE_NAMES.OBJECT_MAPPER)}\"\n    >\n      <nile-icon\n        class=\"pointer-cursor switcher-object-mapper-icon\"\n        slot=\"suffix\"\n        name=\"collapse\"\n        color=\"#005EA6\"\n        size=\"16\"\n      >\n      </nile-icon>\n    </nile-input>`;\n  }\n\n  renderCodeEditor(Input: switchInputType) {\n    const {\n      value,\n      multiLine,\n      options,\n      disabled,\n      readonly,\n      errorMessage,\n      error,\n      inputType,\n      noborder,\n    } = Input;\n    return html`<nile-code-editor\n      class=${classMap({\n        'code-editor': true,\n        'code-editor__no-border': !!noborder,\n      })}\n      @nile-expand=\"${(e: CustomEvent) =>\n        this.handleExpand(e, INPUT_TYPE_NAMES.CODE_EDITOR)}\"\n      @nile-change=\"${(e: CustomEvent) =>\n        this.handleChange(e, INPUT_TYPE_NAMES.CODE_EDITOR)}\"\n      .multiline=\"${multiLine}\"\n      .value=\"${value}\"\n      .customOptions=\"${options}\"\n      .showLineNumbers=\"false\"\n    ></nile-code-editor> `;\n  }\n\n  handleExpand(event: CustomEvent, inputType: string) {\n    this.currentInput.expand = event.detail.expand;\n    this.emit('nile-change', { input: this.currentInput });\n  }\n\n  handleChange(event: CustomEvent, inputType: string) {\n    switch (inputType) {\n      case INPUT_TYPE_NAMES.OBJECT_MAPPER:\n        this.currentInput.value = 'clicked';\n        break;\n      case INPUT_TYPE_NAMES.CHECKBOX:\n        this.currentInput.value = event.detail.checked;\n        break;\n      case INPUT_TYPE_NAMES.CODE_EDITOR:\n        this.currentInput.value = event.detail.value;\n        break;\n      default:\n        this.currentInput.value = event.detail.value;\n    }\n    event.stopPropagation();\n    this.emit('nile-change', { input: this.currentInput });\n  }\n\n  renderIcon() {\n    const inputs = this.nileSwitchConfig.inputs;\n    const toolTipPosition =\n      this.nileSwitchConfig.align === POSITIONS.BLOCK ? 'top' : 'bottom';\n\n    return html`\n      <div class=\"switcher-icons-container\">\n        ${repeat(\n          inputs,\n          (input: any, index: number) => html` <nile-tooltip\n            class=${classMap({\n              'switcher-tooltip-container': true,\n            })}\n            content=${input.helperText}\n            placement=${toolTipPosition}\n          >\n            <div  class=${classMap({\n              'switcher-icon-container': true,\n              current: index === this.current,\n            })}>\n               <nile-icon\n              size=\"16\"\n              class=${classMap({\n                'pointer-cursor': true,\n              })}\n              .name=${input.icon}\n              color=\"#000000\"\n              @click=${() => this.toggleField(input, index)}\n            ></nile-icon>\n            <div>\n           \n          </nile-tooltip>`\n        )}\n      </div>\n    `;\n  }\n\n  toggleField(currentInput: switchInputType, index: Number) {\n    this.current = index;\n    this.emit('nile-switch', { input: this.currentInput });\n  }\n\n  singleFieldSwitcher() {\n    return html`\n      ${choose(\n        this.currentInput.inputType,\n        [\n          [INPUT_TYPE_NAMES.TEXT, () => this.renderNileText(this.currentInput)],\n          [\n            INPUT_TYPE_NAMES.CHECKBOX,\n            () => this.renderNileCheckBox(this.currentInput),\n          ],\n          [\n            INPUT_TYPE_NAMES.TEXTAREA,\n            () => this.renderNileTextArea(this.currentInput),\n          ],\n          [\n            INPUT_TYPE_NAMES.RADIO,\n            () => this.renderNileRadio(this.currentInput),\n          ],\n          [\n            INPUT_TYPE_NAMES.DROPDOWN,\n            () => this.renderDropdown(this.currentInput),\n          ],\n          [\n            INPUT_TYPE_NAMES.CONTENTEDITOR,\n            () => this.renderContentEditor(this.currentInput),\n          ],\n          [INPUT_TYPE_NAMES.OBJECT_MAPPER, () => this.renderObjectMapper()],\n          [\n            INPUT_TYPE_NAMES.CODE_EDITOR,\n            () => this.renderCodeEditor(this.currentInput),\n          ],\n        ],\n        () => this.renderNileText(this.currentInput)\n      )}\n    `;\n  }\n\n  public render(): TemplateResult {\n    const align = this.nileSwitchConfig.align;\n    return html`<div\n      class=${classMap({\n        'switcher-block': align === POSITIONS.BLOCK,\n        'switcher-inline': align === POSITIONS.INLINE,\n        'switcher-input-container': true,\n      })}\n    >\n      ${this.renderIcon()} ${this.singleFieldSwitcher()}\n    </div>`;\n  }\n}\n\nexport default NileSwitcher;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-switcher': NileSwitcher;\n  }\n}\n"]}