@aquera/nile-elements 0.0.28 → 0.0.30

package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-content-editor/nile-content-editor.css.js

@@ -12,6 +12,7 @@ export const styles = css `
   :host {
     box-sizing: border-box;
     font-size: 14px;
+    overflow: hidden;
   }
 
   .content-editable-wrapper {

package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-content-editor/nile-content-editor.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-content-editor.css.js","sourceRoot":"","sources":["../../../src/nile-content-editor/nile-content-editor.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4FxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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 { css } from 'lit-element';\n\n/**\n * AttributeExpression CSS\n */\nexport const styles = css`\n  :host {\n    box-sizing: border-box;\n    font-size: 14px;\n  }\n\n  .content-editable-wrapper {\n    position: relative;\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  .dropdown-position {\n    position: relative;\n    bottom: 1px;\n  }\n  .content-editable-input {\n    box-sizing: border-box;\n    width: 100%;\n    padding: 9px;\n    border: 1px solid #c7ced4;\n    border-radius: 4px;\n    overflow: auto;\n    overflow-x: auto;\n    overflow-anchor: none;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n    cursor: text;\n    white-space: nowrap;\n    background-color: #ffffff;\n    height: 38px;\n  }\n  .content-editable-input:focus {\n    outline: none;\n  }\n\n  .error {\n    border-color: #e5434d;\n  }\n\n  .read-only {\n    background-color: hsl(240 4.8% 95.9%);\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .chips {\n    display: inline;\n    background: #e5e9eb;\n    color: #000;\n    border-radius: 4px;\n    padding: 6px;\n    height: 24px;\n    line-height: 10px;\n    margin-left: 3px;\n    letter-spacing: 0.2px;\n  }\n\n  .text-area {\n    height: 120px;\n    overflow: scroll;\n    line-height: 26px;\n  }\n\n  .text-area .chips {\n    padding: 4px 8px;\n  }\n\n  .chip-error {\n    background: #f3a5aa;\n  }\n  .nile-options-container {\n    box-sizing: border-box;\n    background-color: #ffffff;\n    border: 1px solid #c7ced4;\n    overflow: auto;\n    max-height: 150px;\n  }\n\n  label {\n    display: inline-block;\n    margin-bottom: 6px;\n    font-family: 'colfax-medium';\n  }\n\n  .asterik {\n    color: #e5434d;\n  }\n\n  .no-border {\n    border: none;\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-content-editor.css.js","sourceRoot":"","sources":["../../../src/nile-content-editor/nile-content-editor.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6FxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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 { css } from 'lit-element';\n\n/**\n * AttributeExpression CSS\n */\nexport const styles = css`\n  :host {\n    box-sizing: border-box;\n    font-size: 14px;\n    overflow: hidden;\n  }\n\n  .content-editable-wrapper {\n    position: relative;\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  .dropdown-position {\n    position: relative;\n    bottom: 1px;\n  }\n  .content-editable-input {\n    box-sizing: border-box;\n    width: 100%;\n    padding: 9px;\n    border: 1px solid #c7ced4;\n    border-radius: 4px;\n    overflow: auto;\n    overflow-x: auto;\n    overflow-anchor: none;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n    cursor: text;\n    white-space: nowrap;\n    background-color: #ffffff;\n    height: 38px;\n  }\n  .content-editable-input:focus {\n    outline: none;\n  }\n\n  .error {\n    border-color: #e5434d;\n  }\n\n  .read-only {\n    background-color: hsl(240 4.8% 95.9%);\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .chips {\n    display: inline;\n    background: #e5e9eb;\n    color: #000;\n    border-radius: 4px;\n    padding: 6px;\n    height: 24px;\n    line-height: 10px;\n    margin-left: 3px;\n    letter-spacing: 0.2px;\n  }\n\n  .text-area {\n    height: 120px;\n    overflow: scroll;\n    line-height: 26px;\n  }\n\n  .text-area .chips {\n    padding: 4px 8px;\n  }\n\n  .chip-error {\n    background: #f3a5aa;\n  }\n  .nile-options-container {\n    box-sizing: border-box;\n    background-color: #ffffff;\n    border: 1px solid #c7ced4;\n    overflow: auto;\n    max-height: 150px;\n  }\n\n  label {\n    display: inline-block;\n    margin-bottom: 6px;\n    font-family: 'colfax-medium';\n  }\n\n  .asterik {\n    color: #e5434d;\n  }\n\n  .no-border {\n    border: none;\n  }\n`;\n\nexport default [styles];\n"]}

package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-error-message/nile-error-message.js

@@ -42,7 +42,7 @@ let NileErrorMessage = class NileErrorMessage extends LitElement {
           size="14"
           class="nile-error-message__icon"
           part="icon"
-          color="#E5434D"
+          color="#A4121C"
         ></nile-icon>
         <span class="nile-error-message__error">${this.errorMessage}</span>
 

package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-error-message/nile-error-message.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-error-message.js","sourceRoot":"","sources":["../../../src/nile-error-message/nile-error-message.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EACV,IAAI,EACJ,QAAQ,GAGT,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD;;;GAGG;AAEI,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAAzC;;QAKL,4DAA4D;QAE5D,iBAAY,GAAW,EAAE,CAAC;QAW1B,eAAU,GAAY,KAAK,CAAC;QAE5B,wCAAwC;QACvB,eAAU,GAAW,GAAG,CAAC;IA0D5C,CAAC;IA9EQ,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAoBD;;;OAGG;IACH,oBAAoB;QAClB,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,IAAI,CAAC,UAAU,EAAE;YAC/C,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC;SACjE;QACD,OAAO,IAAI,CAAC,aAAa,CAAC;IAC5B,CAAC;IAED;;OAEG;IACH,cAAc;QACZ,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;IACrC,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;;;;;;;;;kDASmC,IAAI,CAAC,YAAY;;;UAGzD,IAAI,CAAC,aAAa;YACpB,CAAC,CAAC,IAAI,CAAA;;cAEA,IAAI,CAAC,aAAa;cAClB,IAAI,CAAC,iBAAiB;gBACpB,CAAC,CAAC,IAAI,CAAA;;;uBAGC,IAAI,CAAC,cAAc;iBACzB,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW;cAC9C,CAAA,CAAC,CAAA,EAAE;;aAEJ;YACL,CAAC,CAAC,EAAE;;;yDAG6C,IAAI,CAAC,UAAU;YAC5D,CAAC,CAAC,UAAU;YACZ,CAAC,CAAC,WAAW;;YAEb,IAAI,CAAC,iBAAiB;;;KAG7B,CAAC;IACJ,CAAC;CACF,CAAA;AAxEC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDACD;AAI1B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDACL;AAItB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2DACD;AAG1B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;oDACA;AAlBjB,gBAAgB;IAD5B,aAAa,CAAC,oBAAoB,CAAC;GACvB,gBAAgB,CA+E5B;SA/EY,gBAAgB","sourcesContent":["import {\n  LitElement,\n  html,\n  property,\n  CSSResultArray,\n  TemplateResult,\n} from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-error-message.css';\n\n/**\n * A custom error message component that displays error information to the user.\n * @customElement nile-error-message\n */\n@customElement('nile-error-message')\nexport class NileErrorMessage extends LitElement {\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  // Represents the error message to be displayed to the user.\n  @property({ type: String })\n  errorMessage: string = '';\n\n  // Represents additional details about the error, like stack trace or other info.\n  @property({ type: String })\n  errorResponse: string;\n\n  // Extended error information\n  @property({ type: String })\n  errorResponseLong: string;\n\n  @property({ type: Boolean })\n  isExpanded: boolean = false;\n\n  // The maximum length before truncation.\n  private readonly MAX_LENGTH: number = 100;\n\n  /**\n   * Get a truncated version of the errorResponse if it's too long.\n   * @returns {string}\n   */\n  getTruncatedResponse(): string {\n    if (this.errorResponse.length > this.MAX_LENGTH) {\n      return `${this.errorResponse.substring(0, this.MAX_LENGTH)}...`;\n    }\n    return this.errorResponse;\n  }\n\n  /**\n   * Toggle the expanded state of the error response.\n   */\n  toggleExpanded() {\n    this.isExpanded = !this.isExpanded;\n  }\n\n  public render(): TemplateResult {\n    return html`\n      <div class=\"nile-error-message\" part=\"base\">\n        <nile-icon\n          name=\"info2\"\n          size=\"14\"\n          class=\"nile-error-message__icon\"\n          part=\"icon\"\n          color=\"#E5434D\"\n        ></nile-icon>\n        <span class=\"nile-error-message__error\">${this.errorMessage}</span>\n\n\n        ${this.errorResponse\n        ? html`\n            <div class=\"nile-error-message__response\">\n            ${this.errorResponse}\n            ${this.errorResponseLong\n                ? html`\n              <span\n              class=\"nile-error-message__more-button\"\n              @click=${this.toggleExpanded}\n              >${this.isExpanded ? 'View Less' : 'View More'}</span\n            >`:``}\n            </div>\n            `\n        : ``}\n\n        <div\n          class=\"nile-error-message__response-expanded ${this.isExpanded\n            ? 'expanded'\n            : 'collapsed'}\"\n        >\n          ${this.errorResponseLong}\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-error-message': NileErrorMessage;\n  }\n}\n"]}
+{"version":3,"file":"nile-error-message.js","sourceRoot":"","sources":["../../../src/nile-error-message/nile-error-message.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EACV,IAAI,EACJ,QAAQ,GAGT,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD;;;GAGG;AAEI,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAAzC;;QAKL,4DAA4D;QAE5D,iBAAY,GAAW,EAAE,CAAC;QAW1B,eAAU,GAAY,KAAK,CAAC;QAE5B,wCAAwC;QACvB,eAAU,GAAW,GAAG,CAAC;IA0D5C,CAAC;IA9EQ,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAoBD;;;OAGG;IACH,oBAAoB;QAClB,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,IAAI,CAAC,UAAU,EAAE;YAC/C,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC;SACjE;QACD,OAAO,IAAI,CAAC,aAAa,CAAC;IAC5B,CAAC;IAED;;OAEG;IACH,cAAc;QACZ,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;IACrC,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;;;;;;;;;kDASmC,IAAI,CAAC,YAAY;;;UAGzD,IAAI,CAAC,aAAa;YACpB,CAAC,CAAC,IAAI,CAAA;;cAEA,IAAI,CAAC,aAAa;cAClB,IAAI,CAAC,iBAAiB;gBACpB,CAAC,CAAC,IAAI,CAAA;;;uBAGC,IAAI,CAAC,cAAc;iBACzB,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW;cAC9C,CAAA,CAAC,CAAA,EAAE;;aAEJ;YACL,CAAC,CAAC,EAAE;;;yDAG6C,IAAI,CAAC,UAAU;YAC5D,CAAC,CAAC,UAAU;YACZ,CAAC,CAAC,WAAW;;YAEb,IAAI,CAAC,iBAAiB;;;KAG7B,CAAC;IACJ,CAAC;CACF,CAAA;AAxEC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDACD;AAI1B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDACL;AAItB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2DACD;AAG1B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;oDACA;AAlBjB,gBAAgB;IAD5B,aAAa,CAAC,oBAAoB,CAAC;GACvB,gBAAgB,CA+E5B;SA/EY,gBAAgB","sourcesContent":["import {\n  LitElement,\n  html,\n  property,\n  CSSResultArray,\n  TemplateResult,\n} from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-error-message.css';\n\n/**\n * A custom error message component that displays error information to the user.\n * @customElement nile-error-message\n */\n@customElement('nile-error-message')\nexport class NileErrorMessage extends LitElement {\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  // Represents the error message to be displayed to the user.\n  @property({ type: String })\n  errorMessage: string = '';\n\n  // Represents additional details about the error, like stack trace or other info.\n  @property({ type: String })\n  errorResponse: string;\n\n  // Extended error information\n  @property({ type: String })\n  errorResponseLong: string;\n\n  @property({ type: Boolean })\n  isExpanded: boolean = false;\n\n  // The maximum length before truncation.\n  private readonly MAX_LENGTH: number = 100;\n\n  /**\n   * Get a truncated version of the errorResponse if it's too long.\n   * @returns {string}\n   */\n  getTruncatedResponse(): string {\n    if (this.errorResponse.length > this.MAX_LENGTH) {\n      return `${this.errorResponse.substring(0, this.MAX_LENGTH)}...`;\n    }\n    return this.errorResponse;\n  }\n\n  /**\n   * Toggle the expanded state of the error response.\n   */\n  toggleExpanded() {\n    this.isExpanded = !this.isExpanded;\n  }\n\n  public render(): TemplateResult {\n    return html`\n      <div class=\"nile-error-message\" part=\"base\">\n        <nile-icon\n          name=\"info2\"\n          size=\"14\"\n          class=\"nile-error-message__icon\"\n          part=\"icon\"\n          color=\"#A4121C\"\n        ></nile-icon>\n        <span class=\"nile-error-message__error\">${this.errorMessage}</span>\n\n\n        ${this.errorResponse\n        ? html`\n            <div class=\"nile-error-message__response\">\n            ${this.errorResponse}\n            ${this.errorResponseLong\n                ? html`\n              <span\n              class=\"nile-error-message__more-button\"\n              @click=${this.toggleExpanded}\n              >${this.isExpanded ? 'View Less' : 'View More'}</span\n            >`:``}\n            </div>\n            `\n        : ``}\n\n        <div\n          class=\"nile-error-message__response-expanded ${this.isExpanded\n            ? 'expanded'\n            : 'collapsed'}\"\n        >\n          ${this.errorResponseLong}\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-error-message': NileErrorMessage;\n  }\n}\n"]}

package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-switcher/nile-switcher.css.js

@@ -14,27 +14,64 @@ export const styles = css `
     box-sizing: border-box;
   }
 
-  .pointer-cursor {
+  .switcher-icon-container {
     cursor: pointer;
+    justify-content: center;
+    display: flex;
+    align-items: center;
+    margin-bottom: 6px;
+    height: 28px;
+    width: 28px;
+    border-radius: 4px;
+  }
+
+  .switcher-icon-container.current {
+    background: var(--nile-colors-blue-400);
   }
-  .input-container {
+
+  .switcher-input-container {
     display: flex;
+  }
+
+  .switcher-inline {
     gap: 0.5rem;
   }
 
-  .input-container > :first-child {
-    max-width: 98%;
-    min-width: 98%;
+  .switcher-block {
+    flex-direction: column;
+  }
+
+  .switcher-block > :first-child {
+    align-self: end;
+  }
+
+  .switcher-inline > :nth-child(2) {
+    flex: 1;
   }
 
-  nile-icon {
+  .switcher-input-container > :first-child {
+    display: flex;
+    gap: 0.5rem;
     max-height: 38px;
+    align-items: center;
   }
 
   nile-radio {
     display: inline-block;
     padding-right: 10px;
   }
+
+  .switcher-object-mapper::part(input) {
+    color: var(--nile-colors-primary-600);
+    cursor: pointer;
+  }
+
+  .switcher-input--noborder::part(base) {
+    border: none;
+  }
+  .switcher-object-mapper--noborder::part(base) {
+    border: none;
+  }
 `;
 export default [styles];
 //# sourceMappingURL=nile-switcher.css.js.map

package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-switcher/nile-switcher.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-switcher.css.js","sourceRoot":"","sources":["../../../src/nile-switcher/nile-switcher.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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 { css } from 'lit-element';\n\n/**\n * FieldGenerator CSS\n */\nexport const styles = css`\n  :host {\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  .pointer-cursor {\n    cursor: pointer;\n  }\n  .input-container {\n    display: flex;\n    gap: 0.5rem;\n  }\n\n  .input-container > :first-child {\n    max-width: 98%;\n    min-width: 98%;\n  }\n\n  nile-icon {\n    max-height: 38px;\n  }\n\n  nile-radio {\n    display: inline-block;\n    padding-right: 10px;\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-switcher.css.js","sourceRoot":"","sources":["../../../src/nile-switcher/nile-switcher.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgExB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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 { css } from 'lit-element';\n\n/**\n * FieldGenerator CSS\n */\nexport const styles = css`\n  :host {\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  .switcher-icon-container {\n    cursor: pointer;\n    justify-content: center;\n    display: flex;\n    align-items: center;\n    margin-bottom: 6px;\n    height: 28px;\n    width: 28px;\n    border-radius: 4px;\n  }\n\n  .switcher-icon-container.current {\n    background: var(--nile-colors-blue-400);\n  }\n\n  .switcher-input-container {\n    display: flex;\n  }\n\n  .switcher-inline {\n    gap: 0.5rem;\n  }\n\n  .switcher-block {\n    flex-direction: column;\n  }\n\n  .switcher-block > :first-child {\n    align-self: end;\n  }\n\n  .switcher-inline > :nth-child(2) {\n    flex: 1;\n  }\n\n  .switcher-input-container > :first-child {\n    display: flex;\n    gap: 0.5rem;\n    max-height: 38px;\n    align-items: center;\n  }\n\n  nile-radio {\n    display: inline-block;\n    padding-right: 10px;\n  }\n\n  .switcher-object-mapper::part(input) {\n    color: var(--nile-colors-primary-600);\n    cursor: pointer;\n  }\n\n  .switcher-input--noborder::part(base) {\n    border: none;\n  }\n  .switcher-object-mapper--noborder::part(base) {\n    border: none;\n  }\n`;\n\nexport default [styles];\n"]}

package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-switcher/nile-switcher.d.ts

@@ -9,32 +9,34 @@ import NileElement from '../internal/nile-element';
 import { CSSResultGroup } from 'lit';
 /**
  * @summary Allows you to switch between nile elements
-
+ *
  * @dependency nile-icon
  * @dependency nile-input
  * @dependency nile-checkbox
  * @dependency nile-dropdown
  * @dependency nile-textarea
  *
- 
  * @event nile-change - Emitted when the control's value changes.
  * @event nile-switch - Emitted when the nile component is being switched.
-  
  */
 export interface switchconfig {
     [key: string]: any;
     toggleSwitch: boolean;
     disable?: boolean;
     confirmation?: boolean;
-    defaultInput: switchInputType;
-    switchInput: switchInputType;
+    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;
+    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;
     value?: String | boolean;
     label?: String;
     readonly?: boolean;
+    order: number;
     type?: string;
+    icon: string;
+    mode?: string;
     placeholder?: string;
     disabled?: boolean;
     required?: boolean;
@@ -45,6 +47,10 @@ export interface switchInputType {
     multiple?: boolean;
     noborder?: boolean;
 }
+export declare enum POSITIONS {
+    INLINE = "inline",
+    BLOCK = "block"
+}
 export declare enum INPUT_TYPE {
     DEFAULT = "defaultInput",
     SWITCH = "switchInput"
@@ -55,7 +61,12 @@ export declare enum INPUT_TYPE_NAMES {
     CHECKBOX = "checkbox",
     TEXTAREA = "text-area",
     RADIO = "radio",
-    CONTENTEDITOR = "content-editor"
+    CONTENTEDITOR = "content-editor",
+    OBJECT_MAPPER = "object-mapper"
+}
+export declare enum MODE {
+    CREATE = "create",
+    EDIT = "edit"
 }
 export declare class NileSwitcher extends NileElement {
     /**
@@ -64,19 +75,21 @@ export declare class NileSwitcher extends NileElement {
      */
     static styles: CSSResultGroup;
     nileSwitchConfig: switchconfig;
+    currentInput: switchInputType;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    renderNileText(Input: switchInputType, inputType: string): TemplateResult<1>;
-    renderDropdown(Input: switchInputType, inputType: string): TemplateResult<1>;
-    renderNileTextArea(Input: switchInputType, inputType: string): TemplateResult<1>;
-    renderNileCheckBox(Input: switchInputType, inputType: string): TemplateResult<1>;
-    renderNileRadio(Input: switchInputType, inputType: string): TemplateResult<1>;
+    renderNileText(Input: switchInputType): TemplateResult<1>;
+    renderDropdown(Input: switchInputType): TemplateResult<1>;
+    renderNileTextArea(Input: switchInputType): TemplateResult<1>;
+    renderNileCheckBox(Input: switchInputType): TemplateResult<1>;
+    renderNileRadio(Input: switchInputType): TemplateResult<1>;
     renderErrorMessage(errorMessage: string): TemplateResult<1>;
-    renderContentEditor(Input: switchInputType, inputType: string): TemplateResult<1>;
-    handleChange(event: CustomEvent, inputType: string, inputTypeName: string): void;
-    renderIcon(defaultInput: switchInputType, switchInput: switchInputType): TemplateResult<1>;
-    toggleField(): void;
-    singleFieldSwitcher(defaultInput: switchInputType, switchInput: switchInputType, toggleField: boolean, disable: boolean): TemplateResult<1>;
+    renderContentEditor(Input: switchInputType): TemplateResult<1>;
+    renderObjectMapper(): TemplateResult<1>;
+    handleChange(event: CustomEvent, inputType: string): void;
+    renderIcon(): TemplateResult<1>;
+    toggleField(currentInput: switchInputType): void;
+    singleFieldSwitcher(): TemplateResult<1>;
     render(): TemplateResult;
 }
 export default NileSwitcher;

package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-switcher/nile-switcher.js

@@ -11,6 +11,12 @@ import { styles } from './nile-switcher.css';
 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';
+export var POSITIONS;
+(function (POSITIONS) {
+    POSITIONS["INLINE"] = "inline";
+    POSITIONS["BLOCK"] = "block";
+})(POSITIONS || (POSITIONS = {}));
 export var INPUT_TYPE;
 (function (INPUT_TYPE) {
     INPUT_TYPE["DEFAULT"] = "defaultInput";
@@ -24,9 +30,16 @@ export var INPUT_TYPE_NAMES;
     INPUT_TYPE_NAMES["TEXTAREA"] = "text-area";
     INPUT_TYPE_NAMES["RADIO"] = "radio";
     INPUT_TYPE_NAMES["CONTENTEDITOR"] = "content-editor";
+    INPUT_TYPE_NAMES["OBJECT_MAPPER"] = "object-mapper";
 })(INPUT_TYPE_NAMES || (INPUT_TYPE_NAMES = {}));
+export var MODE;
+(function (MODE) {
+    MODE["CREATE"] = "create";
+    MODE["EDIT"] = "edit";
+})(MODE || (MODE = {}));
 let NileSwitcher = class NileSwitcher extends NileElement {
     connectedCallback() {
+        this.currentInput = this.nileSwitchConfig.inputs[0];
         super.connectedCallback();
         this.emit('nile-init');
     }
@@ -34,9 +47,13 @@ let NileSwitcher = class NileSwitcher extends NileElement {
         super.disconnectedCallback();
         this.emit('nile-destroy');
     }
-    renderNileText(Input, inputType) {
-        const { value, label, placeholder, disabled, required, error, errorMessage, inputType: inputTypeName, } = Input;
+    renderNileText(Input) {
+        const { value, label, placeholder, disabled, required, error, errorMessage, inputType, noborder, } = Input;
         return html `<nile-input
+      class=${classMap({
+            'switcher-input': true,
+            'switcher-input--noborder': !!noborder,
+        })}
       .value=${value}
       .label=${label}
       .disabled=${disabled}
@@ -45,13 +62,14 @@ let NileSwitcher = class NileSwitcher extends NileElement {
       .placeholder=${placeholder}
       .error=${error}
       @nile-input=${(e) => {
-            this.handleChange(e, inputType, inputTypeName);
+            this.handleChange(e, inputType);
         }}
     ></nile-input>`;
     }
-    renderDropdown(Input, inputType) {
-        const { options, multiple, placeholder, disabled, value, error, errorMessage, inputType: inputTypeName, } = Input;
+    renderDropdown(Input) {
+        const { options, multiple, placeholder, disabled, value, error, errorMessage, inputType, } = Input;
         return html `<nile-select
+      class="switcher-dropdown"
       .placeholder=${placeholder}
       .disabled="${disabled}"
       .multiple="${multiple}"
@@ -59,7 +77,7 @@ let NileSwitcher = class NileSwitcher extends NileElement {
       .error="${error}"
       .errorMessage="${errorMessage}"
       @nile-change=${(e) => {
-            this.handleChange(e, inputType, inputTypeName);
+            this.handleChange(e, inputType);
         }}
     >
       ${options?.map((option) => {
@@ -67,39 +85,42 @@ let NileSwitcher = class NileSwitcher extends NileElement {
         })}
     </nile-select>`;
     }
-    renderNileTextArea(Input, inputType) {
-        const { value, disabled, readonly, errorMessage, error, inputType: inputTypeName, } = Input;
+    renderNileTextArea(Input) {
+        const { value, disabled, readonly, errorMessage, error, inputType } = Input;
         return html `<nile-textarea
+      class="switcher-textarea"
       .value=${value}
       .disabled=${disabled}
       ?readonly=${readonly}
       .error=${error}
       .errorMessage=${errorMessage}
       @nile-input=${(e) => {
-            this.handleChange(e, inputType, inputTypeName);
+            this.handleChange(e, inputType);
         }}
     ></nile-textarea>`;
     }
-    renderNileCheckBox(Input, inputType) {
-        const { value, label, disabled, inputType: inputTypeName } = Input;
+    renderNileCheckBox(Input) {
+        const { value, label, disabled, inputType } = Input;
         return html `<nile-checkbox
+        class="switcher-checkbox"
         .checked=${value}
         .label=${label}
         .disabled=${disabled}
         @valueChange=${(e) => {
-            this.handleChange(e, inputType, inputTypeName);
+            this.handleChange(e, inputType);
         }}
       ></nile-checkbox
       >; `;
     }
-    renderNileRadio(Input, inputType) {
-        const { options, value, disabled, inputType: inputTypeName, errorMessage, } = Input;
+    renderNileRadio(Input) {
+        const { options, value, disabled, errorMessage, inputType } = Input;
         const haserrorMessage = !!errorMessage;
         return html `<nile-radio-group
+      class="switcher-radio-group"
       .value=${value}
       .disabled=${disabled}
       @change=${(e) => {
-            this.handleChange(e, inputType, inputTypeName);
+            this.handleChange(e, inputType);
         }}
     >
       ${options &&
@@ -114,9 +135,10 @@ let NileSwitcher = class NileSwitcher extends NileElement {
       <nile-form-error-message>${errorMessage}</nile-form-error-message>
     `;
     }
-    renderContentEditor(Input, inputType) {
-        let { options, inputType: inputTypeName, errorMessage, type, readonly, noborder, value, } = Input;
+    renderContentEditor(Input) {
+        let { options, inputType, errorMessage, type, readonly, noborder, value } = Input;
         return html `<nile-content-editor
+      class="switcher-content-editor"
       .value=${value}
       .options=${options}
       .type=${type}
@@ -124,115 +146,123 @@ let NileSwitcher = class NileSwitcher extends NileElement {
       .noborder=${noborder}
       .errorMessage=${errorMessage}
       @nile-change=${(e) => {
-            this.handleChange(e, inputType, inputTypeName);
+            this.handleChange(e, inputType);
         }}
     >
     </nile-content-editor>`;
     }
-    handleChange(event, inputType, inputTypeName) {
-        if (inputTypeName === INPUT_TYPE_NAMES.CHECKBOX) {
-            this.nileSwitchConfig[inputType].value =
-                event.detail.checked;
-        }
-        else {
-            this.nileSwitchConfig[inputType].value =
-                event.detail.value;
-        }
-        event.stopPropagation();
-        this.emit('nile-change', { config: this.nileSwitchConfig });
-    }
-    renderIcon(defaultInput, switchInput) {
-        const defaultHelperText = defaultInput.helperText;
-        const switchHelperText = switchInput.helperText;
-        const icon = !this.nileSwitchConfig.toggleSwitch
-            ? 'header-functions'
-            : 'stringinput';
-        const helperText = !this.nileSwitchConfig.toggleSwitch
-            ? !!switchHelperText
-                ? switchHelperText
-                : `switch to ${switchInput.inputType}`
-            : !!defaultHelperText
-                ? defaultHelperText
-                : `switch to ${defaultInput.inputType}`;
-        return html ` <nile-tooltip
+    renderObjectMapper() {
+        const noborder = this.currentInput.noborder;
+        const mode = this.currentInput.mode;
+        const value = this.currentInput.mode === MODE.CREATE
+            ? 'Click to Create - Not Mapped'
+            : '';
+        return html `<nile-input
       class=${classMap({
-            'tooltip-container': true,
+            'switcher-object-mapper': true,
+            'switcher-object-mapper--noborder': !!noborder,
         })}
-      content=${helperText}
-      placement="bottom"
+      .value=${value}
+      readonly="true"
+      @click="${(e) => this.handleChange(e, INPUT_TYPE_NAMES.OBJECT_MAPPER)}"
     >
       <nile-icon
-        size="14"
-        class=${classMap({
-            'pointer-cursor': true,
-        })}
-        .name=${icon}
+        class="pointer-cursor switcher-object-mapper-icon"
+        slot="suffix"
+        name="collapse"
         color="#005EA6"
-        @click=${this.toggleField}
-      ></nile-icon>
-    </nile-tooltip>`;
+        size="16"
+      >
+      </nile-icon>
+    </nile-input>`;
     }
-    toggleField() {
-        if (!this.nileSwitchConfig.confirmation) {
-            this.nileSwitchConfig = {
-                ...this.nileSwitchConfig,
-                toggleSwitch: !this.nileSwitchConfig.toggleSwitch,
-            };
+    handleChange(event, inputType) {
+        switch (inputType) {
+            case INPUT_TYPE_NAMES.OBJECT_MAPPER:
+                this.currentInput.value = 'clicked';
+                break;
+            case INPUT_TYPE_NAMES.CHECKBOX:
+                this.currentInput.value = event.detail.checked;
+                break;
+            default:
+                this.currentInput.value = event.detail.value;
         }
-        this.emit('nile-switch', { config: this.nileSwitchConfig });
+        event.stopPropagation();
+        this.emit('nile-change', { input: this.currentInput });
     }
-    singleFieldSwitcher(defaultInput, switchInput, toggleField, disable) {
-        const defaultInputType = defaultInput.inputType;
-        const switchInputType = switchInput.inputType;
+    renderIcon() {
+        const inputs = this.nileSwitchConfig.inputs;
+        const toolTipPosition = this.nileSwitchConfig.align === POSITIONS.BLOCK ? 'top' : 'bottom';
         return html `
-      ${!toggleField
-            ? choose(defaultInputType, [
-                [
-                    INPUT_TYPE_NAMES.TEXT,
-                    () => this.renderNileText(defaultInput, INPUT_TYPE.DEFAULT),
-                ],
-                [
-                    INPUT_TYPE_NAMES.CHECKBOX,
-                    () => this.renderNileCheckBox(defaultInput, INPUT_TYPE.DEFAULT),
-                ],
-                [
-                    INPUT_TYPE_NAMES.TEXTAREA,
-                    () => this.renderNileTextArea(defaultInput, INPUT_TYPE.DEFAULT),
-                ],
-                [
-                    INPUT_TYPE_NAMES.RADIO,
-                    () => this.renderNileRadio(defaultInput, INPUT_TYPE.DEFAULT),
-                ],
-                [
-                    INPUT_TYPE_NAMES.DROPDOWN,
-                    () => this.renderDropdown(this.nileSwitchConfig.defaultInput, INPUT_TYPE.DEFAULT),
-                ],
-                [
-                    INPUT_TYPE_NAMES.CONTENTEDITOR,
-                    () => this.renderContentEditor(this.nileSwitchConfig.defaultInput, INPUT_TYPE.DEFAULT),
-                ],
-            ], () => this.renderNileText(defaultInput, INPUT_TYPE.DEFAULT))
-            : choose(switchInputType, [
-                [
-                    INPUT_TYPE_NAMES.TEXTAREA,
-                    () => this.renderNileTextArea(switchInput, INPUT_TYPE.SWITCH),
-                ],
-                [
-                    INPUT_TYPE_NAMES.TEXT,
-                    () => this.renderNileText(switchInput, INPUT_TYPE.SWITCH),
-                ],
-                [
-                    INPUT_TYPE_NAMES.CONTENTEDITOR,
-                    () => this.renderContentEditor(switchInput, INPUT_TYPE.SWITCH),
-                ],
-            ], () => this.renderNileTextArea(switchInput, INPUT_TYPE.SWITCH))}
-      ${!disable ? this.renderIcon(defaultInput, switchInput) : ''}
+      <div class="switcher-icons-container">
+        ${repeat(inputs, input => html ` <nile-tooltip
+            class=${classMap({
+            'switcher-tooltip-container': true,
+        })}
+            content=${input.helperText}
+            placement=${toolTipPosition}
+          >
+            <div  class=${classMap({
+            'switcher-icon-container': true,
+            current: input.order === this.currentInput.order,
+        })}>
+               <nile-icon
+              size="16"
+              class=${classMap({
+            'pointer-cursor': true,
+        })}
+              .name=${input.icon}
+              color="#000000"
+              @click=${() => this.toggleField(input)}
+            ></nile-icon>
+            <div>
+           
+          </nile-tooltip>`)}
+      </div>
+    `;
+    }
+    toggleField(currentInput) {
+        this.currentInput = currentInput;
+        this.emit('nile-switch', { input: this.currentInput });
+    }
+    singleFieldSwitcher() {
+        return html `
+      ${choose(this.currentInput.inputType, [
+            [INPUT_TYPE_NAMES.TEXT, () => this.renderNileText(this.currentInput)],
+            [
+                INPUT_TYPE_NAMES.CHECKBOX,
+                () => this.renderNileCheckBox(this.currentInput),
+            ],
+            [
+                INPUT_TYPE_NAMES.TEXTAREA,
+                () => this.renderNileTextArea(this.currentInput),
+            ],
+            [
+                INPUT_TYPE_NAMES.RADIO,
+                () => this.renderNileRadio(this.currentInput),
+            ],
+            [
+                INPUT_TYPE_NAMES.DROPDOWN,
+                () => this.renderDropdown(this.currentInput),
+            ],
+            [
+                INPUT_TYPE_NAMES.CONTENTEDITOR,
+                () => this.renderContentEditor(this.currentInput),
+            ],
+            [INPUT_TYPE_NAMES.OBJECT_MAPPER, () => this.renderObjectMapper()],
+        ], () => this.renderNileText(this.currentInput))}
     `;
     }
     render() {
-        const { toggleSwitch: toggleField, defaultInput, switchInput, disable, } = this.nileSwitchConfig;
-        return html `<div class="input-container">
-      ${this.singleFieldSwitcher(defaultInput, switchInput, toggleField, !!disable)}
+        const align = this.nileSwitchConfig.align;
+        return html `<div
+      class=${classMap({
+            'switcher-block': align === POSITIONS.BLOCK,
+            'switcher-inline': align === POSITIONS.INLINE,
+            'switcher-input-container': true,
+        })}
+    >
+      ${this.renderIcon()} ${this.singleFieldSwitcher()}
     </div>`;
     }
 };
@@ -244,6 +274,9 @@ NileSwitcher.styles = styles;
 __decorate([
     property({ type: Object })
 ], NileSwitcher.prototype, "nileSwitchConfig", void 0);
+__decorate([
+    property()
+], NileSwitcher.prototype, "currentInput", void 0);
 NileSwitcher = __decorate([
     customElement('nile-switcher')
 ], NileSwitcher);