@aquera/nile-elements 0.0.6-9 → 0.0.7-1

package/dist/src/nile-button-toggle-group/nile-button-toggle-group.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { CSSResultArray, TemplateResult } from 'lit-element';
+import NileElement from '../internal/nile-element';
+/**
+ * Nile icon component.
+ *
+ * @tag nile-button-toggle-group
+ *
+ */
+export declare class NileButtonToggleGroup extends NileElement {
+    /**
+     * The styles for ButtonToggleGroup
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles(): CSSResultArray;
+    private toggles;
+    private defaultSlot;
+    disabled: boolean;
+    connectedCallback(): void;
+    firstUpdated(): void;
+    updated(changedProperties: Map<string | number | symbol, unknown>): void;
+    private updateDisabledState;
+    updateTogglePositions(): void;
+    handleToggle(event: CustomEvent): void;
+    /**
+     * Render method
+     * @slot This is a slot test
+     */
+    render(): TemplateResult;
+}
+export default NileButtonToggleGroup;
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-button-toggle-group': NileButtonToggleGroup;
+    }
+}

package/dist/src/nile-button-toggle-group/nile-button-toggle-group.js

@@ -0,0 +1,99 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { __decorate } from "tslib";
+import { html, property } from 'lit-element';
+import { customElement, query, queryAll } from 'lit/decorators.js';
+import { styles } from './nile-button-toggle-group.css';
+import NileButtonToggle from '../nile-button-toggle/nile-button-toggle';
+import NileElement from '../internal/nile-element';
+/**
+ * Nile icon component.
+ *
+ * @tag nile-button-toggle-group
+ *
+ */
+let NileButtonToggleGroup = class NileButtonToggleGroup extends NileElement {
+    constructor() {
+        super(...arguments);
+        this.disabled = false;
+        /* #endregion */
+    }
+    /**
+     * The styles for ButtonToggleGroup
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles() {
+        return [styles];
+    }
+    connectedCallback() {
+        super.connectedCallback();
+    }
+    firstUpdated() {
+        this.defaultSlot.addEventListener('slotchange', () => this.updateTogglePositions());
+        this.addEventListener('nile-toggle-changed', this.handleToggle);
+        this.updateTogglePositions();
+    }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        if (changedProperties.has('disabled')) {
+            this.updateDisabledState();
+        }
+    }
+    updateDisabledState() {
+        const assignedNodes = this.defaultSlot.assignedNodes({ flatten: true });
+        const toggles = assignedNodes.filter(node => node instanceof NileButtonToggle);
+        toggles.forEach(toggle => {
+            if (!toggle.disabled) {
+                toggle.disabled = this.disabled;
+            }
+        });
+    }
+    updateTogglePositions() {
+        const assignedNodes = this.defaultSlot.assignedNodes({ flatten: true });
+        const toggles = assignedNodes.filter(node => node instanceof NileButtonToggle);
+        toggles.forEach((toggle, index) => {
+            toggle.initial = index === 0;
+            toggle.middle = index > 0 && index < toggles.length - 1;
+            toggle.end = index === toggles.length - 1;
+        });
+    }
+    handleToggle(event) {
+        if (this.disabled)
+            return;
+        const toggles = this.querySelectorAll('nile-button-toggle');
+        if (toggles && event.detail.active) {
+            toggles.forEach((toggle) => {
+                if (toggle !== event.target) {
+                    toggle.active = false;
+                }
+            });
+            this.emit('nile-change', { value: event.detail.value });
+        }
+    }
+    /**
+     * Render method
+     * @slot This is a slot test
+     */
+    render() {
+        return html ` <slot> </slot> `;
+    }
+};
+__decorate([
+    queryAll('nile-button-toggle')
+], NileButtonToggleGroup.prototype, "toggles", void 0);
+__decorate([
+    query('slot:not([name])')
+], NileButtonToggleGroup.prototype, "defaultSlot", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NileButtonToggleGroup.prototype, "disabled", void 0);
+NileButtonToggleGroup = __decorate([
+    customElement('nile-button-toggle-group')
+], NileButtonToggleGroup);
+export { NileButtonToggleGroup };
+export default NileButtonToggleGroup;
+//# sourceMappingURL=nile-button-toggle-group.js.map

package/dist/src/nile-button-toggle-group/nile-button-toggle-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-button-toggle-group.js","sourceRoot":"","sources":["../../../src/nile-button-toggle-group/nile-button-toggle-group.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 {LitElement, html, property, CSSResultArray, TemplateResult} from 'lit-element';\nimport { customElement, query, queryAll } from 'lit/decorators.js';\nimport {styles} from './nile-button-toggle-group.css';\nimport NileButtonToggle from '../nile-button-toggle/nile-button-toggle';\nimport NileElement from '../internal/nile-element';\n/**\n * Nile icon component.\n *\n * @tag nile-button-toggle-group\n *\n */\n@customElement('nile-button-toggle-group')\nexport class NileButtonToggleGroup extends NileElement {\n  /**\n   * The styles for ButtonToggleGroup\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  @queryAll('nile-button-toggle')\n  private toggles!: NodeListOf<NileButtonToggle>;\n\n  @query('slot:not([name])')\n  private defaultSlot!: HTMLSlotElement;\n\n  @property({ type: Boolean, reflect: true })\n  public disabled: boolean = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n  }\n\n  firstUpdated() {\n    this.defaultSlot.addEventListener('slotchange', () =>\n      this.updateTogglePositions()\n    );\n    this.addEventListener('nile-toggle-changed', this.handleToggle);\n    this.updateTogglePositions();\n  }\n\n  updated(changedProperties: Map<string | number | symbol, unknown>) {\n    super.updated(changedProperties);\n    if (changedProperties.has('disabled')) {\n      this.updateDisabledState();\n    }\n  }\n\n  private updateDisabledState() {\n    const assignedNodes = this.defaultSlot.assignedNodes({ flatten: true });\n    const toggles = assignedNodes.filter(\n      node => node instanceof NileButtonToggle\n    ) as NileButtonToggle[];\n\n    toggles.forEach(toggle => {\n      if (!toggle.disabled) {\n        toggle.disabled = this.disabled;\n      }\n    });\n  }\n\n  updateTogglePositions() {\n    const assignedNodes = this.defaultSlot.assignedNodes({ flatten: true });\n    const toggles = assignedNodes.filter(\n      node => node instanceof NileButtonToggle\n    ) as NileButtonToggle[];\n\n    toggles.forEach((toggle, index) => {\n      toggle.initial = index === 0;\n      toggle.middle = index > 0 && index < toggles.length - 1;\n      toggle.end = index === toggles.length - 1;\n    });\n  }\n\n  handleToggle(event: CustomEvent) {\n    if (this.disabled) return;\n    const toggles = this.querySelectorAll('nile-button-toggle');\n\n    if (toggles && event.detail.active) {\n      toggles.forEach((toggle: any) => {\n        if (toggle !== event.target) {\n          toggle.active = false;\n        }\n      });\n\n      this.emit('nile-change', { value: event.detail.value });\n    }\n  }\n\n  /**\n   * Render method\n   * @slot This is a slot test\n   */\n  public render(): TemplateResult {\n    return html` <slot> </slot> `;\n  }\n\n  /* #endregion */\n}\n\nexport default NileButtonToggleGroup;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-button-toggle-group': NileButtonToggleGroup;\n  }\n}\n"]}

package/dist/src/nile-content-editor/nile-content-editor.css.js

@@ -19,6 +19,11 @@ export const styles = css `
     width: 100%;
     box-sizing: border-box;
   }
+
+  .dropdown-position {
+    position: relative;
+    bottom: 60px;
+  }
   .content-editable-input {
     box-sizing: border-box;
     width: 100%;
@@ -38,8 +43,8 @@ export const styles = css `
     outline: none;
   }
 
-  .content-editable-input::-webkit-scrollbar {
-    display: none;
+  .error {
+    border-color: #e5434d;
   }
 
   .chips {
@@ -52,6 +57,16 @@ export const styles = css `
     letter-spacing: 0.2px;
   }
 
+  .text-area {
+    height: 120px;
+    white-space: pre-wrap;
+    overflow: scroll;
+    line-height: 24px;
+  }
+
+  .chip-error {
+    background: #f3a5aa;
+  }
   .nile-options-container {
     box-sizing: border-box;
     background-color: #ffffff;
@@ -59,10 +74,6 @@ export const styles = css `
     overflow: auto;
   }
 
-  nile-popup::part(popup) {
-    top: 91px;
-  }
-
   label {
     display: inline-block;
     margin-bottom: 6px;

package/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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;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 * AttributeExpression CSS\n */\nexport const styles = css`\n  :host {\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  .content-editable-wrapper {\n    position: relative;\n    width: 100%;\n    box-sizing: border-box;\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-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  .content-editable-input::-webkit-scrollbar {\n    display: none;\n  }\n\n  .chips {\n    background: #e5e9eb;\n    color: #000;\n    border-radius: 4px;\n    padding: 6px;\n    margin-left: 3px;\n    display: inline;\n    letter-spacing: 0.2px;\n  }\n\n  .nile-options-container {\n    box-sizing: border-box;\n    background-color: #ffffff;\n    border: 1px solid #c7ced4;\n    overflow: auto;\n  }\n\n  nile-popup::part(popup) {\n    top: 91px;\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\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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2ExB,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    width: 100%;\n    box-sizing: border-box;\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: 60px;\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-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  .chips {\n    background: #e5e9eb;\n    color: #000;\n    border-radius: 4px;\n    padding: 6px;\n    margin-left: 3px;\n    display: inline;\n    letter-spacing: 0.2px;\n  }\n\n  .text-area {\n    height: 120px;\n    white-space: pre-wrap;\n    overflow: scroll;\n    line-height: 24px;\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  }\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\nexport default [styles];\n"]}

package/dist/src/nile-content-editor/nile-content-editor.d.ts

@@ -22,22 +22,26 @@ export declare class NileContentEditor extends NileElement {
    * @event nile-change - Emitted when the control's value changes.
    */
     value: string;
-    dropdownOptions: Array<any>;
+    options: Array<any>;
     showLabel: boolean;
     labelText: string;
+    type: string;
     required: boolean;
     input: HTMLInputElement;
+    autoOptions: HTMLInputElement;
     private openDropdown;
     helpText: string;
     errorMessage: string;
     static styles: CSSResultGroup;
     connectedCallback(): void;
+    handleTypeChange(): void;
     disconnectedCallback(): void;
     afterFirstRender(): Promise<boolean>;
-    private handleChange;
+    private handlekeyDown;
     generateValuesFromHTMLTags(string: any): string;
     generateHTMLTagsWithValues(string: any): string;
     emitInputChange(): void;
+    moveCursorToEnd: () => void;
     handleOptions(option: any): void;
     renderAutoOptions(): TemplateResult;
     render(): TemplateResult;

package/dist/src/nile-content-editor/nile-content-editor.js

@@ -10,6 +10,7 @@ import { customElement, query, state } from 'lit/decorators.js';
 import { styles } from './nile-content-editor.css';
 import { classMap } from 'lit/directives/class-map.js';
 import NileElement from '../internal/nile-element';
+import { watch } from '../internal/watch';
 /**
  * Nile icon component.
  *
@@ -29,10 +30,20 @@ let NileContentEditor = class NileContentEditor extends NileElement {
         this.value = '';
         this.showLabel = true;
         this.labelText = '';
+        this.type = 'text|text-area';
         this.required = true;
         this.openDropdown = false;
         this.helpText = '';
         this.errorMessage = '';
+        this.moveCursorToEnd = () => {
+            const range = document.createRange();
+            const selection = window.getSelection();
+            range.setStart(this.input, this.input.childNodes.length);
+            range.collapse(true);
+            selection?.removeAllRanges();
+            selection?.addRange(range);
+            this.input.focus();
+        };
     }
     connectedCallback() {
         super.connectedCallback();
@@ -42,6 +53,9 @@ let NileContentEditor = class NileContentEditor extends NileElement {
                 this.input.innerHTML = this.generateHTMLTagsWithValues(this.value);
         });
     }
+    handleTypeChange() {
+        this.input.innerHTML = this.generateHTMLTagsWithValues(this.value);
+    }
     disconnectedCallback() {
         super.disconnectedCallback();
         this.emit('nile-destroy');
@@ -49,12 +63,17 @@ let NileContentEditor = class NileContentEditor extends NileElement {
     async afterFirstRender() {
         return await this.updateComplete;
     }
-    handleChange(event) {
-        const value = this.input.innerText;
-        this.emitInputChange();
-        if (value.includes('$')) {
-            this.openDropdown = true;
+    handlekeyDown(event) {
+        if (event.code === 'Enter' && this.type === 'text') {
+            event.preventDefault();
         }
+        setTimeout(() => {
+            const value = this.input.innerText;
+            this.emitInputChange();
+            if (value.includes('$')) {
+                this.openDropdown = true;
+            }
+        });
     }
     generateValuesFromHTMLTags(string) {
         var pattern = /<span class="chips(?: chip-error)?" contenteditable="false">(.*?)<\/span>/g;
@@ -66,30 +85,54 @@ let NileContentEditor = class NileContentEditor extends NileElement {
     generateHTMLTagsWithValues(string) {
         var pattern = /{{(.*?)}}/g;
         var result = string.replace(pattern, (match, option) => {
-            if (this.dropdownOptions.includes(option)) {
-                return ('<span class="chips" contenteditable="false">' + option + '</span>');
-            }
+            return this.options.includes(option)
+                ? '<span class="chips" contenteditable="false">' + option + '</span>'
+                : '<span class="chips chip-error" contenteditable="false">' +
+                    option +
+                    '</span>';
         });
         return result;
     }
     emitInputChange() {
-        this.emit('nile-change', this.generateValuesFromHTMLTags(this.input.innerHTML));
+        let fieldValue = this.input.innerHTML;
+        if (this.input.innerText !== '') {
+            fieldValue = this.generateValuesFromHTMLTags(fieldValue);
+        }
+        fieldValue = fieldValue.replace(/&nbsp;/g, ' ');
+        fieldValue = fieldValue === '<br>' ? '' : fieldValue?.trim();
+        this.emit('nile-change', {
+            value: this.generateValuesFromHTMLTags(fieldValue),
+        });
     }
     handleOptions(option) {
         this.openDropdown = !this.openDropdown;
         // not appending Native element as it replaces all existing child nodes with new node
         const autoOptionsTag = '<span class="chips" contenteditable="false">' + option + '</span>';
-        this.input.innerHTML = this.input.innerHTML + autoOptionsTag;
-        // removing '$' from innerText  after option is being selected
-        if (this.input.lastChild?.previousSibling)
-            this.input.lastChild.previousSibling.nodeValue =
-                this.input.lastChild.previousSibling.nodeValue.replace('$', '');
+        // text editor adds div when pressing enter , so before appending have to check if its parent node is div else append it to content editable parent
+        if (this.input?.lastElementChild?.tagName === 'DIV') {
+            this.input.lastElementChild.insertAdjacentHTML('beforeend', autoOptionsTag);
+            if (this.input.lastElementChild.lastChild?.previousSibling)
+                this.input.lastElementChild.lastChild.previousSibling.nodeValue =
+                    this.input.lastElementChild.lastChild.previousSibling.nodeValue.replace('$', '');
+        }
+        else {
+            this.input.insertAdjacentHTML('beforeend', autoOptionsTag);
+            if (this.input.lastChild?.previousSibling) {
+                this.input.lastChild.previousSibling.nodeValue =
+                    this.input.lastChild.previousSibling.nodeValue.replace('$', '');
+            }
+        }
         this.emitInputChange();
     }
     renderAutoOptions() {
-        return html `<div class="nile-options-container">
-      ${this.dropdownOptions &&
-            this.dropdownOptions.map((option) => {
+        return html `<div
+      class="${classMap({
+            'nile-options-container': true,
+            'dropdown-position': this.type === 'text-area',
+        })}class"
+    >
+      ${this.options &&
+            this.options.map((option) => {
                 return html ` <nile-option
           .value="${option}"
           @click="${(event) => {
@@ -102,7 +145,8 @@ let NileContentEditor = class NileContentEditor extends NileElement {
     }
     render() {
         const hasHelpText = this.helpText ? true : false;
-        const hasErrorMessage = this.errorMessage ? true : false;
+        const hasErrorMessage = !!this.errorMessage;
+        const type = this.type;
         return html `
       <nile-popup
         .active="${this.openDropdown}"
@@ -111,6 +155,7 @@ let NileContentEditor = class NileContentEditor extends NileElement {
         class=${classMap({
             dropdown: true,
             'dropdown--open': true,
+            popup: true,
         })}
       >
         <div class="content-editable-wrapper" slot="anchor">
@@ -121,9 +166,13 @@ let NileContentEditor = class NileContentEditor extends NileElement {
                 : ''}`
             : ''}
           <div
-            class="content-editable-input"
             contenteditable="true"
-            @input=${this.handleChange}
+            class=${classMap({
+            'content-editable-input': true,
+            error: hasErrorMessage,
+            'text-area': type === 'text-area' ? true : false,
+        })}
+            @keydown=${this.handlekeyDown}
           ></div>
           ${hasHelpText
             ? html `
@@ -150,19 +199,25 @@ __decorate([
 ], NileContentEditor.prototype, "value", void 0);
 __decorate([
     property()
-], NileContentEditor.prototype, "dropdownOptions", void 0);
+], NileContentEditor.prototype, "options", void 0);
 __decorate([
     property()
 ], NileContentEditor.prototype, "showLabel", void 0);
 __decorate([
     property()
 ], NileContentEditor.prototype, "labelText", void 0);
+__decorate([
+    property()
+], NileContentEditor.prototype, "type", void 0);
 __decorate([
     property()
 ], NileContentEditor.prototype, "required", void 0);
 __decorate([
     query('.content-editable-input')
 ], NileContentEditor.prototype, "input", void 0);
+__decorate([
+    query('.nile-options-container')
+], NileContentEditor.prototype, "autoOptions", void 0);
 __decorate([
     state()
 ], NileContentEditor.prototype, "openDropdown", void 0);
@@ -172,6 +227,9 @@ __decorate([
 __decorate([
     property({ attribute: 'error-message' })
 ], NileContentEditor.prototype, "errorMessage", void 0);
+__decorate([
+    watch('type', { waitUntilFirstUpdate: true })
+], NileContentEditor.prototype, "handleTypeChange", null);
 NileContentEditor = __decorate([
     customElement('nile-content-editor')
 ], NileContentEditor);

package/dist/src/nile-content-editor/nile-content-editor.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-content-editor.js","sourceRoot":"","sources":["../../../src/nile-content-editor/nile-content-editor.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAkB,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAEnD;;;;;GAKG;AAEI,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,WAAW;IAA3C;QACL;;;;;;SAMC;;QAEW,UAAK,GAAW,EAAE,CAAC;QAInB,cAAS,GAAY,IAAI,CAAC;QAE1B,cAAS,GAAG,EAAE,CAAC;QAEf,aAAQ,GAAY,IAAI,CAAC;QAIpB,iBAAY,GAAY,KAAK,CAAC;QAET,aAAQ,GAAG,EAAE,CAAC;QAEV,iBAAY,GAAG,EAAE,CAAC;IAmI9D,CAAC;IA/HC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QACvB,IAAI,CAAC,gBAAgB,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE;YACjC,IAAI,GAAG,IAAI,IAAI,CAAC,KAAK,KAAK,EAAE;gBAC1B,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACvE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IAC5B,CAAC;IAED,KAAK,CAAC,gBAAgB;QACpB,OAAO,MAAM,IAAI,CAAC,cAAc,CAAC;IACnC,CAAC;IAEO,YAAY,CAAC,KAAU;QAC7B,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;QACnC,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;YACvB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;SAC1B;IACH,CAAC;IAED,0BAA0B,CAAC,MAAW;QACpC,IAAI,OAAO,GACT,4EAA4E,CAAC;QAC/E,IAAI,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC,KAAU,EAAE,MAAW,EAAE,EAAE;YAC/D,OAAO,IAAI,GAAG,MAAM,GAAG,IAAI,CAAC;QAC9B,CAAC,CAAC,CAAC;QACH,OAAO,MAAM,CAAC;IAChB,CAAC;IAED,0BAA0B,CAAC,MAAW;QACpC,IAAI,OAAO,GAAG,YAAY,CAAC;QAC3B,IAAI,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC,KAAU,EAAE,MAAW,EAAE,EAAE;YAC/D,IAAI,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;gBACzC,OAAO,CACL,8CAA8C,GAAG,MAAM,GAAG,SAAS,CACpE,CAAC;aACH;QACH,CAAC,CAAC,CAAC;QACH,OAAO,MAAM,CAAC;IAChB,CAAC;IAED,eAAe;QACb,IAAI,CAAC,IAAI,CACP,aAAa,EACb,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CACtD,CAAC;IACJ,CAAC;IAED,aAAa,CAAC,MAAW;QACvB,IAAI,CAAC,YAAY,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC;QAEvC,qFAAqF;QACrF,MAAM,cAAc,GAClB,8CAA8C,GAAG,MAAM,GAAG,SAAS,CAAC;QACtE,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,cAAc,CAAC;QAE7D,8DAA8D;QAC9D,IAAI,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,eAAe;YACvC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,SAAS;gBAC5C,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,SAAU,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QACrE,IAAI,CAAC,eAAe,EAAE,CAAC;IACzB,CAAC;IAEM,iBAAiB;QACtB,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,eAAe;YACtB,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,MAAW,EAAE,EAAE;gBACvC,OAAO,IAAI,CAAA;oBACC,MAAM;oBACN,CAAC,KAAY,EAAE,EAAE;oBACzB,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;gBAC7B,CAAC;aACE,MAAM;uBACI,CAAC;YAClB,CAAC,CAAC;WACG,CAAC;IACV,CAAC;IAEM,MAAM;QACX,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;QACjD,MAAM,eAAe,GAAG,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;QACzD,OAAO,IAAI,CAAA;;mBAEI,IAAI,CAAC,YAAY;;;gBAGpB,QAAQ,CAAC;YACf,QAAQ,EAAE,IAAI;YACd,gBAAgB,EAAE,IAAI;SACvB,CAAC;;;YAGE,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS;YAChC,CAAC,CAAC,IAAI,CAAA,4BAA4B,IAAI,CAAC,SAAS,aAAa,IAAI;iBAC1D,QAAQ;gBACT,CAAC,CAAC,IAAI,CAAA,gCAAgC;gBACtC,CAAC,CAAC,EAAE,EAAE;YACZ,CAAC,CAAC,EAAE;;;;qBAIK,IAAI,CAAC,YAAY;;YAE1B,WAAW;YACX,CAAC,CAAC,IAAI,CAAA;uCACqB,IAAI,CAAC,QAAQ;eACrC;YACH,CAAC,CAAC,EAAE;YACJ,eAAe;YACf,CAAC,CAAC,IAAI,CAAA;;qBAEG,IAAI,CAAC,YAAY;;eAEvB;YACH,CAAC,CAAC,EAAE;;;UAGN,IAAI,CAAC,iBAAiB,EAAE;;KAE7B,CAAC;IACJ,CAAC;;AAhIM,wBAAM,GAAmB,MAAM,CAAC;AAlB3B;IAAX,QAAQ,EAAE;gDAAoB;AAEnB;IAAX,QAAQ,EAAE;0DAA6B;AAE5B;IAAX,QAAQ,EAAE;oDAA2B;AAE1B;IAAX,QAAQ,EAAE;oDAAgB;AAEf;IAAX,QAAQ,EAAE;mDAA0B;AAEH;IAAjC,KAAK,CAAC,yBAAyB,CAAC;gDAAyB;AAEjD;IAAR,KAAK,EAAE;uDAAuC;AAET;IAArC,QAAQ,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;mDAAe;AAEV;IAAzC,QAAQ,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;uDAAmB;AAzBjD,iBAAiB;IAD7B,aAAa,CAAC,qBAAqB,CAAC;GACxB,iBAAiB,CA4J7B;SA5JY,iBAAiB;AA8J9B,eAAe,iBAAiB,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 { html, property, TemplateResult } from 'lit-element';\nimport { customElement, query, state } from 'lit/decorators.js';\nimport { styles } from './nile-content-editor.css';\nimport { CSSResultGroup } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport NileElement from '../internal/nile-element';\n\n/**\n * Nile icon component.\n *\n * @tag nile-attribute-expression\n *\n */\n@customElement('nile-content-editor')\nexport class NileContentEditor extends NileElement {\n  /**\n * @summary Allows you to handle both input and dropdown selection\n\n * @dependency nile-option\n \n * @event nile-change - Emitted when the control's value changes.  \n */\n\n  @property() value: string = '';\n\n  @property() dropdownOptions: Array<any>;\n\n  @property() showLabel: boolean = true;\n\n  @property() labelText = '';\n\n  @property() required: boolean = true;\n\n  @query('.content-editable-input') input: HTMLInputElement;\n\n  @state() private openDropdown: boolean = false;\n\n  @property({ attribute: 'help-text' }) helpText = '';\n\n  @property({ attribute: 'error-message' }) errorMessage = '';\n\n  static styles: CSSResultGroup = styles;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.emit('nile-init');\n    this.afterFirstRender().then(res => {\n      if (res && this.value !== '')\n        this.input.innerHTML = this.generateHTMLTagsWithValues(this.value);\n    });\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.emit('nile-destroy');\n  }\n\n  async afterFirstRender(): Promise<boolean> {\n    return await this.updateComplete;\n  }\n\n  private handleChange(event: any) {\n    const value = this.input.innerText;\n    this.emitInputChange();\n    if (value.includes('$')) {\n      this.openDropdown = true;\n    }\n  }\n\n  generateValuesFromHTMLTags(string: any): string {\n    var pattern =\n      /<span class=\"chips(?: chip-error)?\" contenteditable=\"false\">(.*?)<\\/span>/g;\n    var result = string.replace(pattern, (match: any, option: any) => {\n      return '{{' + option + '}}';\n    });\n    return result;\n  }\n\n  generateHTMLTagsWithValues(string: any): string {\n    var pattern = /{{(.*?)}}/g;\n    var result = string.replace(pattern, (match: any, option: any) => {\n      if (this.dropdownOptions.includes(option)) {\n        return (\n          '<span class=\"chips\" contenteditable=\"false\">' + option + '</span>'\n        );\n      }\n    });\n    return result;\n  }\n\n  emitInputChange(): void {\n    this.emit(\n      'nile-change',\n      this.generateValuesFromHTMLTags(this.input.innerHTML)\n    );\n  }\n\n  handleOptions(option: any): void {\n    this.openDropdown = !this.openDropdown;\n\n    // not appending Native element as it replaces all existing child nodes with new node\n    const autoOptionsTag =\n      '<span class=\"chips\" contenteditable=\"false\">' + option + '</span>';\n    this.input.innerHTML = this.input.innerHTML + autoOptionsTag;\n\n    // removing '$' from innerText  after option is being selected\n    if (this.input.lastChild?.previousSibling)\n      this.input.lastChild.previousSibling.nodeValue =\n        this.input.lastChild.previousSibling.nodeValue!.replace('$', '');\n    this.emitInputChange();\n  }\n\n  public renderAutoOptions(): TemplateResult {\n    return html`<div class=\"nile-options-container\">\n      ${this.dropdownOptions &&\n      this.dropdownOptions.map((option: any) => {\n        return html` <nile-option\n          .value=\"${option}\"\n          @click=\"${(event: Event) => {\n            this.handleOptions(option);\n          }}\"\n          >${option}\n        </nile-option>`;\n      })}\n    </div>`;\n  }\n\n  public render(): TemplateResult {\n    const hasHelpText = this.helpText ? true : false;\n    const hasErrorMessage = this.errorMessage ? true : false;\n    return html`\n      <nile-popup\n        .active=\"${this.openDropdown}\"\n        sync=\"width\"\n        placement=\"bottom\"\n        class=${classMap({\n          dropdown: true,\n          'dropdown--open': true,\n        })}\n      >\n        <div class=\"content-editable-wrapper\" slot=\"anchor\">\n          ${this.showLabel && this.labelText\n            ? html`<label class=\"ods-label\">${this.labelText} </label> ${this\n                  .required\n                  ? html`<span class=\"asterik\">*</span>`\n                  : ''}`\n            : ''}\n          <div\n            class=\"content-editable-input\"\n            contenteditable=\"true\"\n            @input=${this.handleChange}\n          ></div>\n          ${hasHelpText\n            ? html`\n                <nile-form-help-text>${this.helpText}</nile-form-help-text>\n              `\n            : ``}\n          ${hasErrorMessage\n            ? html`\n                <nile-form-error-message\n                  >${this.errorMessage}</nile-form-error-message\n                >\n              `\n            : ``}\n        </div>\n\n        ${this.renderAutoOptions()}\n      </nile-popup>\n    `;\n  }\n}\n\nexport default NileContentEditor;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-content-editor': NileContentEditor;\n  }\n}\n"]}
+{"version":3,"file":"nile-content-editor.js","sourceRoot":"","sources":["../../../src/nile-content-editor/nile-content-editor.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, query, state } from 'lit/decorators.js';\nimport { styles } from './nile-content-editor.css';\nimport { CSSResultGroup } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport NileElement from '../internal/nile-element';\nimport { watch } from '../internal/watch';\n\n/**\n * Nile icon component.\n *\n * @tag nile-attribute-expression\n *\n */\n@customElement('nile-content-editor')\nexport class NileContentEditor extends NileElement {\n  /**\n * @summary Allows you to handle both input and dropdown selection\n\n * @dependency nile-option\n \n * @event nile-change - Emitted when the control's value changes.  \n */\n\n  @property() value: string = '';\n\n  @property() options: Array<any>;\n\n  @property() showLabel: boolean = true;\n\n  @property() labelText = '';\n\n  @property() type = 'text|text-area';\n\n  @property() required: boolean = true;\n\n  @query('.content-editable-input') input: HTMLInputElement;\n  @query('.nile-options-container') autoOptions: HTMLInputElement;\n\n  @state() private openDropdown: boolean = false;\n\n  @property({ attribute: 'help-text' }) helpText = '';\n\n  @property({ attribute: 'error-message' }) errorMessage = '';\n\n  static styles: CSSResultGroup = styles;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.emit('nile-init');\n    this.afterFirstRender().then(res => {\n      if (res && this.value !== '')\n        this.input.innerHTML = this.generateHTMLTagsWithValues(this.value);\n    });\n  }\n\n  @watch('type', { waitUntilFirstUpdate: true })\n  handleTypeChange() {\n    this.input.innerHTML = this.generateHTMLTagsWithValues(this.value);\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.emit('nile-destroy');\n  }\n\n  async afterFirstRender(): Promise<boolean> {\n    return await this.updateComplete;\n  }\n\n  private handlekeyDown(event: any) {\n    if (event.code === 'Enter' && this.type === 'text') {\n      event.preventDefault();\n    }\n    setTimeout(() => {\n      const value = this.input.innerText;\n      this.emitInputChange();\n      if (value.includes('$')) {\n        this.openDropdown = true;\n      }\n    });\n  }\n\n  generateValuesFromHTMLTags(string: any): string {\n    var pattern =\n      /<span class=\"chips(?: chip-error)?\" contenteditable=\"false\">(.*?)<\\/span>/g;\n    var result = string.replace(pattern, (match: any, option: any) => {\n      return '{{' + option + '}}';\n    });\n    return result;\n  }\n\n  generateHTMLTagsWithValues(string: any): string {\n    var pattern = /{{(.*?)}}/g;\n    var result = string.replace(pattern, (match: any, option: any) => {\n      return this.options.includes(option)\n        ? '<span class=\"chips\" contenteditable=\"false\">' + option + '</span>'\n        : '<span class=\"chips chip-error\" contenteditable=\"false\">' +\n            option +\n            '</span>';\n    });\n    return result;\n  }\n\n  emitInputChange(): void {\n    let fieldValue = this.input.innerHTML;\n\n    if (this.input.innerText !== '') {\n      fieldValue = this.generateValuesFromHTMLTags(fieldValue);\n    }\n    fieldValue = fieldValue.replace(/&nbsp;/g, ' ');\n    fieldValue = fieldValue === '<br>' ? '' : fieldValue?.trim();\n    this.emit('nile-change', {\n      value: this.generateValuesFromHTMLTags(fieldValue),\n    });\n  }\n\n  moveCursorToEnd = () => {\n    const range = document.createRange();\n    const selection = window.getSelection();\n    range.setStart(this.input, this.input.childNodes.length);\n    range.collapse(true);\n    selection?.removeAllRanges();\n    selection?.addRange(range);\n    this.input.focus();\n  };\n\n  handleOptions(option: any): void {\n    this.openDropdown = !this.openDropdown;\n\n    // not appending Native element as it replaces all existing child nodes with new node\n    const autoOptionsTag =\n      '<span class=\"chips\" contenteditable=\"false\">' + option + '</span>';\n    // text editor adds div when pressing enter , so before appending have to check if its parent node is div else append it to content editable parent\n    if (this.input?.lastElementChild?.tagName === 'DIV') {\n      this.input.lastElementChild.insertAdjacentHTML(\n        'beforeend',\n        autoOptionsTag\n      );\n      if (this.input.lastElementChild.lastChild?.previousSibling)\n        this.input.lastElementChild.lastChild.previousSibling.nodeValue =\n          this.input.lastElementChild.lastChild.previousSibling.nodeValue!.replace(\n            '$',\n            ''\n          );\n    } else {\n      this.input.insertAdjacentHTML('beforeend', autoOptionsTag);\n      if (this.input.lastChild?.previousSibling) {\n        this.input.lastChild.previousSibling.nodeValue =\n          this.input.lastChild.previousSibling.nodeValue!.replace('$', '');\n      }\n    }\n    this.emitInputChange();\n  }\n\n  public renderAutoOptions(): TemplateResult {\n    return html`<div\n      class=\"${classMap({\n        'nile-options-container': true,\n        'dropdown-position': this.type === 'text-area',\n      })}class\"\n    >\n      ${this.options &&\n      this.options.map((option: any) => {\n        return html` <nile-option\n          .value=\"${option}\"\n          @click=\"${(event: Event) => {\n            this.handleOptions(option);\n          }}\"\n          >${option}\n        </nile-option>`;\n      })}\n    </div>`;\n  }\n\n  public render(): TemplateResult {\n    const hasHelpText = this.helpText ? true : false;\n    const hasErrorMessage = !!this.errorMessage;\n    const type = this.type;\n    return html`\n      <nile-popup\n        .active=\"${this.openDropdown}\"\n        sync=\"width\"\n        placement=\"bottom\"\n        class=${classMap({\n          dropdown: true,\n          'dropdown--open': true,\n          popup: true,\n        })}\n      >\n        <div class=\"content-editable-wrapper\" slot=\"anchor\">\n          ${this.showLabel && this.labelText\n            ? html`<label class=\"ods-label\">${this.labelText} </label> ${this\n                  .required\n                  ? html`<span class=\"asterik\">*</span>`\n                  : ''}`\n            : ''}\n          <div\n            contenteditable=\"true\"\n            class=${classMap({\n              'content-editable-input': true,\n              error: hasErrorMessage,\n              'text-area': type === 'text-area' ? true : false,\n            })}\n            @keydown=${this.handlekeyDown}\n          ></div>\n          ${hasHelpText\n            ? html`\n                <nile-form-help-text>${this.helpText}</nile-form-help-text>\n              `\n            : ``}\n          ${hasErrorMessage\n            ? html`\n                <nile-form-error-message\n                  >${this.errorMessage}</nile-form-error-message\n                >\n              `\n            : ``}\n        </div>\n\n        ${this.renderAutoOptions()}\n      </nile-popup>\n    `;\n  }\n}\n\nexport default NileContentEditor;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-content-editor': NileContentEditor;\n  }\n}\n"]}

package/dist/src/nile-date-picker/nile-date-picker.js

@@ -33,7 +33,7 @@ let NileDatePicker = class NileDatePicker extends NileElement {
      */
     render() {
         return html `
-      <nile-dropdown .hoist="${true}">
+      <nile-dropdown .hoist="${true}" distance="6">
         <slot
         slot="trigger"
         part="trigger"

package/dist/src/nile-date-picker/nile-date-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-date-picker.js","sourceRoot":"","sources":["../../../src/nile-date-picker/nile-date-picker.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,EACJ,QAAQ,GAGT,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAGnD;;;;;GAKG;AAEI,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,WAAW;IAAxC;;QASwB,UAAK,GAAG,KAAK,CAAC;IAwC7C,CAAC;IAhDC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IASD;;;OAGG;IACH,MAAM;QACJ,OAAO,IAAI,CAAA;+BACgB,IAAI;;;;;;8BAML,IAAI,CAAC,KAAK,aAAa,IAAI,CAAC,KAAK,oBAAoB,IAAI,CAAC,aAAa;;KAEhG,CAAC;IACJ,CAAC;IAED,aAAa,CAAC,KAAU;QACtB,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;QACxC,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;SACtB;IACH,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IACzB,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IAC5B,CAAC;CACF,CAAA;AAxC8B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAe;AAE/B;IAAX,QAAQ,EAAE;6CAAY;AAEC;IAAvB,KAAK,CAAC,eAAe,CAAC;gDAAwB;AAbpC,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CAiD1B;SAjDY,cAAc;AAmD3B,eAAe,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 {\n  LitElement,\n  html,\n  property,\n  CSSResultArray,\n  TemplateResult,\n} from 'lit-element';\nimport { customElement, query } from 'lit/decorators.js';\nimport { styles } from './nile-date-picker.css';\nimport NileElement from '../internal/nile-element';\nimport { NileDropdown } from '../nile-dropdown';\n\n/**\n * Nile icon component.\n *\n * @tag nile-date-picker\n *\n */\n@customElement('nile-date-picker')\nexport class NileDatePicker extends NileElement {\n  /**\n   * The styles for DatePicker\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  @property({ type: Boolean }) range = false;\n\n  @property() value: any;\n\n  @query('nile-dropdown') dropdown: NileDropdown;\n\n\n  /**\n   * Render method\n   * @slot This is a slot test\n   */\n  render(): TemplateResult {\n    return html`\n      <nile-dropdown .hoist=\"${true}\">\n        <slot\n        slot=\"trigger\"\n        part=\"trigger\"\n        name=\"trigger\"\n      ></slot>\n      <nile-calendar value=\"${this.value}\" .range=\"${this.range}\" @nile-changed=\"${this.handleChanged}\"></nile-calendar>\n      </nile-dropdown>\n    `;\n  }\n\n  handleChanged(event: any) {\n    this.emit('nile-changed', event.detail);\n    if (this.dropdown) {\n      this.dropdown.hide();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.emit('nile-init');\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.emit('nile-destroy');\n  }\n}\n\nexport default NileDatePicker;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-date-picker': NileDatePicker;\n  }\n}\n"]}
+{"version":3,"file":"nile-date-picker.js","sourceRoot":"","sources":["../../../src/nile-date-picker/nile-date-picker.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,EACJ,QAAQ,GAGT,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAGnD;;;;;GAKG;AAEI,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,WAAW;IAAxC;;QASwB,UAAK,GAAG,KAAK,CAAC;IAwC7C,CAAC;IAhDC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IASD;;;OAGG;IACH,MAAM;QACJ,OAAO,IAAI,CAAA;+BACgB,IAAI;;;;;;8BAML,IAAI,CAAC,KAAK,aAAa,IAAI,CAAC,KAAK,oBAAoB,IAAI,CAAC,aAAa;;KAEhG,CAAC;IACJ,CAAC;IAED,aAAa,CAAC,KAAU;QACtB,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;QACxC,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;SACtB;IACH,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IACzB,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IAC5B,CAAC;CACF,CAAA;AAxC8B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAe;AAE/B;IAAX,QAAQ,EAAE;6CAAY;AAEC;IAAvB,KAAK,CAAC,eAAe,CAAC;gDAAwB;AAbpC,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CAiD1B;SAjDY,cAAc;AAmD3B,eAAe,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 {\n  LitElement,\n  html,\n  property,\n  CSSResultArray,\n  TemplateResult,\n} from 'lit-element';\nimport { customElement, query } from 'lit/decorators.js';\nimport { styles } from './nile-date-picker.css';\nimport NileElement from '../internal/nile-element';\nimport { NileDropdown } from '../nile-dropdown';\n\n/**\n * Nile icon component.\n *\n * @tag nile-date-picker\n *\n */\n@customElement('nile-date-picker')\nexport class NileDatePicker extends NileElement {\n  /**\n   * The styles for DatePicker\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  @property({ type: Boolean }) range = false;\n\n  @property() value: any;\n\n  @query('nile-dropdown') dropdown: NileDropdown;\n\n\n  /**\n   * Render method\n   * @slot This is a slot test\n   */\n  render(): TemplateResult {\n    return html`\n      <nile-dropdown .hoist=\"${true}\" distance=\"6\">\n        <slot\n        slot=\"trigger\"\n        part=\"trigger\"\n        name=\"trigger\"\n      ></slot>\n      <nile-calendar value=\"${this.value}\" .range=\"${this.range}\" @nile-changed=\"${this.handleChanged}\"></nile-calendar>\n      </nile-dropdown>\n    `;\n  }\n\n  handleChanged(event: any) {\n    this.emit('nile-changed', event.detail);\n    if (this.dropdown) {\n      this.dropdown.hide();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.emit('nile-init');\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.emit('nile-destroy');\n  }\n}\n\nexport default NileDatePicker;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-date-picker': NileDatePicker;\n  }\n}\n"]}

package/dist/src/nile-dialog/index.d.ts

@@ -0,0 +1 @@
+export { NileDialog } from './nile-dialog';

package/dist/src/nile-dialog/index.js

@@ -0,0 +1,2 @@
+export { NileDialog } from './nile-dialog';
+//# sourceMappingURL=index.js.map

package/dist/src/nile-dialog/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nile-dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC","sourcesContent":["export { NileDialog } from './nile-dialog';\n"]}

package/dist/src/{nile-radio-button/nile-radio-button.css.d.ts → nile-dialog/nile-dialog.css.d.ts}

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 /**
- * RadioButton CSS
+ * Modal CSS
  */
 export declare const styles: import("lit-element").CSSResult;
 declare const _default: import("lit-element").CSSResult[];