@aquera/nile-elements 0.0.91 → 0.0.93

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

@@ -9,7 +9,7 @@ import { html, property, } from 'lit-element';
 import { customElement, query } from 'lit/decorators.js';
 import { styles } from './nile-code-editor.css';
 import { EditorView } from 'codemirror';
-import { EditorState, Compartment } from '@codemirror/state';
+import { EditorState, Compartment, } from '@codemirror/state';
 import { lineNumbers } from '@codemirror/view';
 import { javascript, javascriptLanguage, scopeCompletionSource, } from '@codemirror/lang-javascript';
 import { sql } from '@codemirror/lang-sql';
@@ -61,21 +61,6 @@ let NileCodeEditor = class NileCodeEditor extends NileElement {
         this.view.destroy();
         this.emit('nile-destroy');
     }
-    convertToSingleLine(code) {
-        if (!code)
-            return '';
-        // Remove line breaks and unnecessary whitespace
-        return code.replace(/\s+/g, ' ').trim();
-    }
-    getLineNumbersExension() {
-        return this.lineNumbers || this.multiline ? lineNumbers() : [];
-    }
-    getReadOnlyExtension() {
-        return EditorState.readOnly.of(this.readonly);
-    }
-    getSingleLineExtension() {
-        return !this.multiline ? EditorState.transactionFilter.of(tr => tr.newDoc.lines > 1 ? [] : tr) : [];
-    }
     firstUpdated() {
         const lineNumbersExtension = this.lineNumbersComp.of(this.getLineNumbersExension());
         const readOnlyExtension = this.readOnlyComp.of(this.getReadOnlyExtension());
@@ -85,9 +70,7 @@ let NileCodeEditor = class NileCodeEditor extends NileElement {
         });
         const language = this.language == "sql" ? sql() : javascript();
         let startState = EditorState.create({
-            doc: !this.multiline
-                ? this.convertToSingleLine(this.value)
-                : this.value,
+            doc: !this.multiline ? this.convertToSingleLine(this.value) : this.value,
             extensions: [
                 basicSetup({
                     lineNumbers: this.lineNumbers || this.multiline,
@@ -116,22 +99,11 @@ let NileCodeEditor = class NileCodeEditor extends NileElement {
             state: startState,
             parent: this.codeEditor
         });
-        this.emit('nile-view-initialized', { codeMirrorInstance: this.view });
-    }
-    singleLineMultiLineToggle() {
-        this.view.dispatch({
-            changes: {
-                from: 0,
-                to: this.view.state.doc.length,
-                insert: !this.multiline
-                    ? this.convertToSingleLine(this.value)
-                    : this.value,
-            },
-        });
+        this.emit('nile-after-init', { codeMirrorInstance: this.view });
     }
     updated(changedProperties) {
         super.updated(changedProperties);
-        if (changedProperties.has('value')) {
+        if (changedProperties.has('value') && this.view.state.doc.toString() != this.value) {
             // Editor has already been initialized, update its state
             this.singleLineMultiLineToggle();
         }
@@ -159,12 +131,6 @@ let NileCodeEditor = class NileCodeEditor extends NileElement {
             });
         }
     }
-    expandCodeEditor() {
-        this.emit('nile-expand', { expand: true });
-    }
-    restrictSingleLine() {
-        return EditorState.transactionFilter.of(tr => tr.newDoc.lines > 1 ? [] : tr);
-    }
     render() {
         const hasErrorMessage = !!this.errorMessage;
         const hasError = !!this.error;
@@ -187,7 +153,7 @@ let NileCodeEditor = class NileCodeEditor extends NileElement {
             class="code-editor__icon__container"
             size="16"
             color="black"
-            @click="${(e) => this.expandCodeEditor()}"
+            @click="${(e) => this.emitNileExpand()}"
           ></nile-icon>`
             : ''}
       </div>
@@ -199,42 +165,75 @@ let NileCodeEditor = class NileCodeEditor extends NileElement {
           `
             : ``}`;
     }
+    singleLineMultiLineToggle() {
+        this.view.dispatch({
+            changes: {
+                from: 0,
+                to: this.view.state.doc.length,
+                insert: !this.multiline
+                    ? this.convertToSingleLine(this.value)
+                    : this.value,
+            },
+        });
+    }
+    convertToSingleLine(code) {
+        if (!code)
+            return '';
+        // Remove line breaks and unnecessary whitespace
+        return code.replace(/\s+/g, ' ').trim();
+    }
+    //EXTENSION CONFIGURATIONS
+    getLineNumbersExension() {
+        return this.lineNumbers || this.multiline ? lineNumbers() : [];
+    }
+    getReadOnlyExtension() {
+        return EditorState.readOnly.of(this.readonly);
+    }
+    getSingleLineExtension() {
+        return !this.multiline ? EditorState.transactionFilter.of(tr => tr.newDoc.lines > 1 ? [] : tr) : [];
+    }
+    restrictSingleLine() {
+        return EditorState.transactionFilter.of(tr => tr.newDoc.lines > 1 ? [] : tr);
+    }
+    emitNileExpand() {
+        this.emit('nile-expand', { expand: true });
+    }
 };
 __decorate([
     query('.code-mirror')
 ], NileCodeEditor.prototype, "codeEditor", void 0);
 __decorate([
-    property({ type: String, reflect: false })
+    property({ type: String, reflect: true, attribute: true })
 ], NileCodeEditor.prototype, "value", void 0);
 __decorate([
-    property({ type: String })
+    property({ type: String, reflect: true, attribute: true })
 ], NileCodeEditor.prototype, "customAutoCompletions", void 0);
 __decorate([
-    property({ type: String })
+    property({ type: String, reflect: true, attribute: true })
 ], NileCodeEditor.prototype, "language", void 0);
 __decorate([
-    property({ attribute: 'error-message' })
+    property({ type: String, reflect: true, attribute: 'error-message' })
 ], NileCodeEditor.prototype, "errorMessage", void 0);
 __decorate([
-    property({ attribute: 'error', type: Boolean })
+    property({ type: Boolean, reflect: true, attribute: 'error' })
 ], NileCodeEditor.prototype, "error", void 0);
 __decorate([
-    property({ attribute: 'noborder', type: Boolean })
+    property({ type: Boolean, reflect: true, attribute: 'noborder' })
 ], NileCodeEditor.prototype, "noborder", void 0);
 __decorate([
-    property({ type: Boolean, reflect: true })
+    property({ type: Boolean, reflect: true, attribute: true })
 ], NileCodeEditor.prototype, "multiline", void 0);
 __decorate([
-    property({ type: Boolean, reflect: true })
+    property({ type: Boolean, reflect: true, attribute: true })
 ], NileCodeEditor.prototype, "lineNumbers", void 0);
 __decorate([
-    property({ type: Boolean, reflect: true })
+    property({ type: Boolean, reflect: true, attribute: true })
 ], NileCodeEditor.prototype, "hasScroller", void 0);
 __decorate([
-    property({ type: Boolean })
+    property({ type: Boolean, reflect: true, attribute: true })
 ], NileCodeEditor.prototype, "expandable", void 0);
 __decorate([
-    property({ type: Boolean, reflect: true })
+    property({ type: Boolean, reflect: true, attribute: true })
 ], NileCodeEditor.prototype, "readonly", void 0);
 NileCodeEditor = __decorate([
     customElement('nile-code-editor')

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

@@ -1 +1 @@
-{"version":3,"file":"nile-code-editor.js","sourceRoot":"","sources":["../../../src/nile-code-editor/nile-code-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 {\n  LitElement,\n  html,\n  property,\n  CSSResultArray,\n  TemplateResult,\n  PropertyValueMap,\n} from 'lit-element';\nimport { customElement, query } from 'lit/decorators.js';\nimport { styles } from './nile-code-editor.css';\nimport { EditorView } from 'codemirror';\nimport { ViewUpdate } from '@codemirror/view';\nimport { EditorState, Compartment } from '@codemirror/state';\nimport { lineNumbers } from '@codemirror/view';\nimport {\n  javascript,\n  javascriptLanguage,\n  scopeCompletionSource,\n  completionPath,\n} from '@codemirror/lang-javascript';\nimport { sql } from '@codemirror/lang-sql';\nimport { autocompletion } from '@codemirror/autocomplete';\nimport { CompletionContext, Completion } from '@codemirror/autocomplete';\nimport NileElement from '../internal/nile-element';\nimport { basicSetup } from './extensionSetup';\nimport { watch } from '../internal/watch';\nimport { PropertyValues } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { Theme } from './theme';\n\n// Choose the appropriate mode for your use case\n\n/**\n * Nile icon component.\n *\n * @tag nile-code-editor\n *\n */\n@customElement('nile-code-editor')\nexport class NileCodeEditor extends NileElement {\n  \n  @query('.code-mirror') codeEditor: HTMLInputElement;\n\n  @property({ type: String, reflect:false }) value = '';\n\n  @property({ type: String }) customAutoCompletions: any = {};\n\n  @property({ type: String }) language: 'javascript' | 'sql' = 'javascript'\n\n  @property({ attribute: 'error-message' }) errorMessage: string = '';\n\n  @property({ attribute: 'error', type: Boolean }) error: boolean = false;\n\n  @property({ attribute: 'noborder', type: Boolean }) noborder: boolean = false;\n\n  @property({ type: Boolean, reflect: true }) multiline: boolean = false;\n\n  @property({ type: Boolean, reflect: true }) lineNumbers: boolean = false;\n\n  @property({ type: Boolean, reflect: true }) hasScroller: boolean = true;\n\n  @property({ type: Boolean }) expandable: boolean = true;\n\n  @property({ type: Boolean, reflect: true }) readonly: boolean = false;\n\n  /**\n   * The styles for CodeEditor\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  connectedCallback(): void {\n    super.connectedCallback();\n    this.emit('nile-init');\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.view.destroy()\n    this.emit('nile-destroy');\n  }\n\n  public view: EditorView;\n\n  convertToSingleLine(code: any) {\n    if (!code) return '';\n    // Remove line breaks and unnecessary whitespace\n    return code.replace(/\\s+/g, ' ').trim();\n  }\n\n  // Compartments for initialiazing and switching extensions\n  private lineNumbersComp = new Compartment();\n  private restrictSingleLineComp = new Compartment();\n  private readOnlyComp = new Compartment();\n\n  getLineNumbersExension() {\n    return  this.lineNumbers || this.multiline ? lineNumbers() : [];\n  }\n\n  getReadOnlyExtension() {\n    return EditorState.readOnly.of(this.readonly);\n  }\n\n  getSingleLineExtension() {\n    return !this.multiline ? EditorState.transactionFilter.of(tr =>\n      tr.newDoc.lines > 1 ? [] : tr\n    ) : [];\n  }\n\n  firstUpdated() {\n    const lineNumbersExtension = this.lineNumbersComp.of(this.getLineNumbersExension());\n    const readOnlyExtension = this.readOnlyComp.of(this.getReadOnlyExtension());\n    const restrictSingleLineExtension = this.restrictSingleLineComp.of(this.getSingleLineExtension())\n    const customAutoCompletions = javascriptLanguage.data.of({\n      autocomplete: scopeCompletionSource(this.customAutoCompletions),\n    });\n    const language = this.language == \"sql\" ? sql() : javascript()\n    let startState = EditorState.create({\n      doc: !this.multiline\n        ? this.convertToSingleLine(this.value)\n        : this.value,\n      extensions: [\n        basicSetup({\n          lineNumbers: this.lineNumbers || this.multiline,\n          highlightActiveLine: false,\n          foldGutter: false,\n        }),\n        lineNumbersExtension,\n        readOnlyExtension,\n        restrictSingleLineExtension,\n        customAutoCompletions,\n        autocompletion(),\n        language,\n        EditorView.theme(Theme),\n        EditorView.updateListener.of((v: ViewUpdate) => {\n          if (v.docChanged) {\n            this.emit('nile-change', { value: this.view.state.doc.toString() })\n          }\n        }),\n        EditorView.domEventHandlers({\n          focus: () => this.dispatchEvent(new Event('nile-focus')),\n          blur: () => this.dispatchEvent(new Event('nile-blur')),\n        }),\n      ],\n    });\n\n    this.view = new EditorView({\n      state: startState,\n      parent: this.codeEditor\n    });\n    this.emit('nile-view-initialized',{codeMirrorInstance:this.view})\n  }\n\n  singleLineMultiLineToggle() {\n    this.view.dispatch({\n      changes: {\n        from: 0,\n        to: this.view.state.doc.length,\n        insert: !this.multiline\n          ? this.convertToSingleLine(this.value)\n          : this.value,\n      },\n    });\n  }\n\n  protected updated(changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void{\n    super.updated(changedProperties);\n    if (changedProperties.has('value')) {\n      // Editor has already been initialized, update its state\n      this.singleLineMultiLineToggle();\n    }\n    if (changedProperties.has('multiline')) {\n      this.view.dispatch({\n        effects: [\n          this.lineNumbersComp.reconfigure(this.getLineNumbersExension()),\n          this.restrictSingleLineComp.reconfigure(this.getSingleLineExtension())\n        ],\n      })\n      this.singleLineMultiLineToggle();\n    }\n    if (changedProperties.has('readonly')) {\n      this.view.dispatch({ \n        effects: [\n          this.readOnlyComp.reconfigure(this.getReadOnlyExtension()),\n        ]\n      })\n    }\n    if (changedProperties.has('lineNumbers')) {\n      this.view.dispatch({ \n        effects: [\n          this.lineNumbersComp.reconfigure(this.getLineNumbersExension()),\n        ]\n      })\n    }\n  }\n\n  expandCodeEditor() {\n    this.emit('nile-expand', { expand: true });\n  }\n\n  restrictSingleLine() {\n    return EditorState.transactionFilter.of(tr =>\n      tr.newDoc.lines > 1 ? [] : tr\n    );\n  }\n  public render(): TemplateResult {\n    const hasErrorMessage = !!this.errorMessage;\n    const hasError = !!this.error;\n    const noborder = !!this.noborder;\n    const noScrollbar = !this.hasScroller\n    return html`<div\n        part=\"code-editor-base\"\n        class=${classMap({\n          'code-mirror': true,\n          'noborder': noborder,\n          'error': hasError || hasErrorMessage,\n          'code-mirror__singleline': !this.multiline,\n          'no-scroller': noScrollbar\n        })}\n      >\n        ${this.expandable\n        ? html` \n          <nile-icon\n            name=\"expand-2\"\n            class=\"code-editor__icon__container\"\n            size=\"16\"\n            color=\"black\"\n            @click=\"${(e: CustomEvent) => this.expandCodeEditor()}\"\n          ></nile-icon>`\n        : ''}\n      </div>\n      ${hasErrorMessage\n        ? html`\n            <nile-form-error-message\n              >${this.errorMessage}</nile-form-error-message\n            >\n          `\n        : ``}`;\n  }\n\n  /* #endregion */\n}\n\nexport default NileCodeEditor;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-code-editor': NileCodeEditor;\n  }\n}\n"]}
+{"version":3,"file":"nile-code-editor.js","sourceRoot":"","sources":["../../../src/nile-code-editor/nile-code-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 {\n  LitElement,\n  html,\n  property,\n  CSSResultArray,\n  TemplateResult,\n  PropertyValueMap,\n} from 'lit-element';\n\nimport { customElement, query } from 'lit/decorators.js';\nimport { styles } from './nile-code-editor.css';\nimport { EditorView } from 'codemirror';\nimport { ViewUpdate } from '@codemirror/view';\nimport { \n  EditorState,\n  Compartment,\n} from '@codemirror/state';\n\nimport { lineNumbers } from '@codemirror/view';\nimport {\n  javascript,\n  javascriptLanguage,\n  scopeCompletionSource,\n  completionPath,\n} from '@codemirror/lang-javascript';\nimport { sql } from '@codemirror/lang-sql';\nimport { autocompletion } from '@codemirror/autocomplete';\nimport { CompletionContext, Completion } from '@codemirror/autocomplete';\nimport NileElement from '../internal/nile-element';\nimport { basicSetup } from './extensionSetup';\nimport { watch } from '../internal/watch';\nimport { PropertyValues } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { Theme } from './theme';\n\n// Choose the appropriate mode for your use case\n\n/**\n * Nile icon component.\n *\n * @tag nile-code-editor\n *\n */\n@customElement('nile-code-editor')\nexport class NileCodeEditor extends NileElement {\n  \n  @query('.code-mirror') codeEditor: HTMLInputElement;\n\n  @property({ type: String, reflect: true , attribute: true }) value = '';\n\n  @property({ type: String, reflect: true , attribute: true }) customAutoCompletions: any = {};\n\n  @property({ type: String, reflect: true , attribute: true}) language: 'javascript' | 'sql' = 'javascript'\n\n  @property({ type: String, reflect: true , attribute: 'error-message' }) errorMessage: string = '';\n\n  @property({ type: Boolean, reflect: true , attribute: 'error' }) error: boolean = false;\n\n  @property({ type: Boolean, reflect: true , attribute: 'noborder' }) noborder: boolean = false;\n\n  @property({ type: Boolean, reflect: true , attribute: true }) multiline: boolean = false;\n\n  @property({ type: Boolean, reflect: true , attribute: true }) lineNumbers: boolean = false;\n\n  @property({ type: Boolean, reflect: true , attribute: true }) hasScroller: boolean = true;\n\n  @property({ type: Boolean, reflect: true , attribute: true }) expandable: boolean = true;\n\n  @property({ type: Boolean, reflect: true , attribute: true}) readonly: boolean = false;\n\n  public view: EditorView;\n\n  // Compartments for initialiazing and switching extensions\n  private lineNumbersComp = new Compartment();\n  private restrictSingleLineComp = new Compartment();\n  private readOnlyComp = new Compartment();\n\n  /**\n   * The styles for CodeEditor\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  connectedCallback(): void {\n    super.connectedCallback();\n    this.emit('nile-init');\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.view.destroy()\n    this.emit('nile-destroy');\n  }\n\n  firstUpdated() {\n    const lineNumbersExtension = this.lineNumbersComp.of(this.getLineNumbersExension());\n    const readOnlyExtension = this.readOnlyComp.of(this.getReadOnlyExtension());\n    const restrictSingleLineExtension = this.restrictSingleLineComp.of(this.getSingleLineExtension())\n    const customAutoCompletions = javascriptLanguage.data.of({\n      autocomplete: scopeCompletionSource(this.customAutoCompletions),\n    });\n    const language = this.language == \"sql\" ? sql() : javascript()\n    let startState = EditorState.create({\n      doc: !this.multiline ? this.convertToSingleLine(this.value) : this.value,\n      extensions: [\n        basicSetup({\n          lineNumbers: this.lineNumbers || this.multiline,\n          highlightActiveLine: false,\n          foldGutter: false,\n        }),\n        lineNumbersExtension,\n        readOnlyExtension,\n        restrictSingleLineExtension,\n        customAutoCompletions,\n        autocompletion(),\n        language,\n        EditorView.theme(Theme),\n        EditorView.updateListener.of((v: ViewUpdate) => {\n          if (v.docChanged) {\n            this.emit('nile-change', { value: this.view.state.doc.toString() })\n          }\n        }),\n        EditorView.domEventHandlers({\n          focus: () => this.dispatchEvent(new Event('nile-focus')),\n          blur: () => this.dispatchEvent(new Event('nile-blur')),\n        }),\n      ],\n    });\n\n    this.view = new EditorView({\n      state: startState,\n      parent: this.codeEditor\n    });\n\n    this.emit('nile-after-init',{ codeMirrorInstance: this.view } )\n  }\n\n  protected updated(changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void{\n    super.updated(changedProperties);\n    if (changedProperties.has('value') && this.view.state.doc.toString()!=this.value) {\n      // Editor has already been initialized, update its state\n      this.singleLineMultiLineToggle();\n    }\n    if (changedProperties.has('multiline')) {\n      this.view.dispatch({\n        effects: [\n          this.lineNumbersComp.reconfigure(this.getLineNumbersExension()),\n          this.restrictSingleLineComp.reconfigure(this.getSingleLineExtension())\n        ],\n      })\n      this.singleLineMultiLineToggle();\n    }\n    if (changedProperties.has('readonly')) {\n      this.view.dispatch({ \n        effects: [\n          this.readOnlyComp.reconfigure(this.getReadOnlyExtension()),\n        ]\n      })\n    }\n    if (changedProperties.has('lineNumbers')) {\n      this.view.dispatch({ \n        effects: [\n          this.lineNumbersComp.reconfigure(this.getLineNumbersExension()),\n        ]\n      })\n    }\n  }\n\n  public render(): TemplateResult {\n    const hasErrorMessage = !!this.errorMessage;\n    const hasError = !!this.error;\n    const noborder = !!this.noborder;\n    const noScrollbar = !this.hasScroller\n    return html`<div\n        part=\"code-editor-base\"\n        class=${classMap({\n          'code-mirror': true,\n          'noborder': noborder,\n          'error': hasError || hasErrorMessage,\n          'code-mirror__singleline': !this.multiline,\n          'no-scroller': noScrollbar\n        })}\n      >\n        ${this.expandable\n        ? html` \n          <nile-icon\n            name=\"expand-2\"\n            class=\"code-editor__icon__container\"\n            size=\"16\"\n            color=\"black\"\n            @click=\"${(e: CustomEvent) => this.emitNileExpand()}\"\n          ></nile-icon>`\n        : ''}\n      </div>\n      ${hasErrorMessage\n        ? html`\n            <nile-form-error-message\n              >${this.errorMessage}</nile-form-error-message\n            >\n          `\n        : ``}`;\n  }\n\n  singleLineMultiLineToggle() {\n    this.view.dispatch({\n      changes: {\n        from: 0,\n        to: this.view.state.doc.length,\n        insert: !this.multiline\n          ? this.convertToSingleLine(this.value)\n          : this.value,\n      },\n    });\n  }\n\n  convertToSingleLine(code: any) {\n    if (!code) return '';\n    // Remove line breaks and unnecessary whitespace\n    return code.replace(/\\s+/g, ' ').trim();\n  }\n  \n  //EXTENSION CONFIGURATIONS\n  getLineNumbersExension() {\n    return  this.lineNumbers || this.multiline ? lineNumbers() : [];\n  }\n\n  getReadOnlyExtension() {\n    return EditorState.readOnly.of(this.readonly);\n  }\n\n  getSingleLineExtension() {\n    return !this.multiline ? EditorState.transactionFilter.of(tr =>\n      tr.newDoc.lines > 1 ? [] : tr\n    ) : [];\n  }\n\n  restrictSingleLine() {\n    return EditorState.transactionFilter.of(tr =>\n      tr.newDoc.lines > 1 ? [] : tr\n    );\n  }\n\n  emitNileExpand() {\n    this.emit('nile-expand', { expand: true });\n  }\n\n  /* #endregion */\n}\n\nexport default NileCodeEditor;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-code-editor': NileCodeEditor;\n  }\n}\n"]}

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

@@ -58,7 +58,7 @@ let NileIcon = class NileIcon extends LitElement {
                 this._svg = await this.fetchSvg(this.customSvgPath);
             }
             else {
-                throw new Error(`No icon named "${this.name}"`);
+                // throw new Error(`No icon named "${this.name}"`);
             }
         }
         this.addAttributesToSvg();

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nile-icon/index.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css, PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport type { TemplateResult } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport * as Icons from './icons/svg';\n\ninterface IconPaths {\n  [key: string]: string;\n}\n\ninterface ButtonClassMap {\n  [key:string]: boolean;\n}\n\nconst iconPaths: IconPaths = Icons as IconPaths;\n\nconst SMALL_ICON_SIZE = 16;\nconst LARGE_ICON_SIZE = 24;\n\n/**\n * Nile icon component.\n *\n * @tag nile-icon\n *\n */\n@customElement('nile-icon')\nexport class NileIcon extends LitElement {\n  /**\n   * The name of the icon set\n   * @attr icon set\n   * @type {IconName | undefined}\n   */\n  @property({ type: String, reflect: true })\n  public set?: string = 'local';\n\n  /**\n   * The name of the icon\n   * @attr name\n   * @type {IconName | undefined}\n   */\n  @property({ type: String, reflect: true })\n  public name?: string;\n\n  /**\n   * A description of what the icon represents\n   * @attr description\n   */\n  @property({ type: String, reflect: true })\n  public description = '';\n\n  @property({ type: String, reflect: true })\n  public method = 'fill';\n\n  /**\n   * A path to a custom SVG file to display as the icon\n   * @attr customSvgPath\n   */\n  @property({ type: String })\n  public customSvgPath?: string;\n\n  /**\n   * A size of what the icon represents\n   * @attr size\n   */\n  @property({ type: String, reflect: true })\n  public size = SMALL_ICON_SIZE;\n\n  @state()\n  private _svg = '';\n\n  @property({ type: String }) override title = 'agents';\n\n  /**\n   * Color\n   */\n  @property({ reflect: true }) color: any ;\n\n  @property({ type: Boolean })\n  public push = false;\n\n  /**\n   * Retain Viewbox\n   */\n\n  @property({ reflect: true }) frame: any;\n\n  static override styles = css`\n    :host {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      contain: content;\n      --nile-svg-stroke-width: 1.3;\n    }\n\n    .nds-icon {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .nds-icon svg {\n      height: var(--nile-svg-height);\n      width: var(--nile-svg-width);\n      stroke: var(--nile-svg-stroke);\n    }\n\n    .nds-icon svg path {\n      fill: var(--nile-svg-fill);\n    }\n\n    .stroke svg path {\n      fill: none !important;\n      stroke: var(--nile-svg-fill) !important;\n      stroke-width: var(--nile-svg-stroke-width);\n    }\n\n    .nds-icon--push {\n      margin-right: 12px;\n    }\n  `;\n\n  private _getIconSize(): number {\n    return this.name?.endsWith('-small') ? SMALL_ICON_SIZE : LARGE_ICON_SIZE;\n  }\n\n  protected override async updated(\n    changedProperties: PropertyValues\n  ): Promise<void> {\n    if (changedProperties.has('size')) {\n      this.style.setProperty('--nile-svg-height', `${this.size}px`);\n      this.style.setProperty('--nile-svg-width', `${this.size}px`);\n    }\n    if (changedProperties.has('color')) {\n      this.style.setProperty('--nile-svg-fill', `${this.color}`);\n    }\n    if (\n      changedProperties.has('name') ||\n      changedProperties.has('customSvgPath')\n    ) {\n      let iconName = this.name ? this.removeHyphens(this.name) : undefined;\n      if (iconName && iconPaths[iconName]) {\n        this._svg = atob(iconPaths[iconName]);\n      } else if (this.customSvgPath) {\n        this._svg = await this.fetchSvg(this.customSvgPath);\n      } else {\n        throw new Error(`No icon named \"${this.name}\"`);\n      }\n    }\n    this.addAttributesToSvg();\n  }\n\n  private addAttributesToSvg(){\n    const svg = this.renderRoot.querySelector('#svg')\n    const attrs = svg?.attributes\n    if(!attrs?.getNamedItem('xmlns')){\n      svg?.setAttribute('xmlns',\"http://www.w3.org/2000/svg\");\n    }\n    if(!attrs?.getNamedItem('version')){\n      svg?.setAttribute(\"version\",\"1.1\")\n    }\n    if(this.frame){\n      svg?.setAttribute('viewBox',`0 0 ${this.frame} ${this.frame}`)\n    }\n    else if(!attrs?.getNamedItem('viewBox')){\n      const viewboxLogic = this.frame\n      ? `0 0 ${this.frame} ${this.frame}`\n      : '0 0 16 16';\n      svg?.setAttribute('viewBox',viewboxLogic)\n    }\n\n    if(!attrs?.getNamedItem('height')){\n      svg?.setAttribute('height',String(this.size));\n      svg?.setAttribute('width',String(this.size));\n    }\n\n    svg?.setAttribute('aria-hidden',`${this.description === ''}`);\n    svg?.setAttribute('aria-label',this.description || '');\n\n    const additionalClasses = Object.keys(this.buttonClassMap).filter((key:string)=> this.buttonClassMap[key])\n\n    svg?.classList.add('nds-icon',...additionalClasses)\n  }\n\n  private async fetchSvg(path: string): Promise<string> {\n    const response = await fetch(path);\n    if (!response.ok) {\n      throw new Error(`HTTP error! status: ${response.status}`);\n    }\n\n    return await response.text();\n  }\n\n  private removeHyphens(iconName: string) {\n    return iconName.replace(/-/g, '');\n  }\n\n  private getSvgTemplate(){\n    const svgTagRegexPattern =/<svg\\s[^>]*>/;\n    const regexToGetSVGAttrs = this._svg.match(svgTagRegexPattern);\n    const svgAttrs = regexToGetSVGAttrs?.[0].replace('<svg','').replace('>','')\n    const svgBody = this._svg.replace(\n     svgTagRegexPattern,\n      ''\n    )\n    .replace('</svg>', '')\n    return  `<svg\n                      id='svg'\n                      focusable='true'\n                      role='img'\n                      ${svgAttrs}\n                    >\n                      ${svgBody}\n                    </svg>`\n  }\n\n  get buttonClassMap() {\n    return {\n      'stroke': this.method != 'fill' ,\n      'nds-icon--push': this.push,\n    } as ButtonClassMap;\n  }\n\n  protected override render(): TemplateResult {\n    const size = this.size;\n    const color = this.color;\n\n    /**\n     * When icons are outside frame\n     */\n    const viewboxLogic = this.frame\n      ? `0 0 ${this.frame} ${this.frame}`\n      : '0 0 16 16';\n\n\n    if (\n      (!this._svg.includes('fill=') || this._svg.includes('fill=\"inherit\"')) &&\n      !this.color\n    ) {\n      // Case 1: _svg does not have fill color or has fill=\"inherit\" and this.color is not mentioned\n      this.style.setProperty('--nile-svg-fill', `#7F7F7F`);\n\n    } else if (this.color) {\n      // Case 2: If this.color is mentioned, use it as fill, regardless of _svg color\n      this.style.setProperty('--nile-svg-fill', `${this.color}`);\n    }\n\n    return html`\n    <span class=\"nds-icon ${classMap(this.buttonClassMap)}\">\n      ${unsafeSVG(this.getSvgTemplate())}\n      </span>\n    `\n    }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n    'nile-icon': NileIcon;\n  }\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nile-icon/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAkB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,OAAO,KAAK,KAAK,MAAM,aAAa,CAAC;AAUrC,MAAM,SAAS,GAAc,KAAkB,CAAC;AAEhD,MAAM,eAAe,GAAG,EAAE,CAAC;AAC3B,MAAM,eAAe,GAAG,EAAE,CAAC;AAE3B;;;;;GAKG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IAAjC;;QACL;;;;WAIG;QAEI,QAAG,GAAY,OAAO,CAAC;QAU9B;;;WAGG;QAEI,gBAAW,GAAG,EAAE,CAAC;QAGjB,WAAM,GAAG,MAAM,CAAC;QASvB;;;WAGG;QAEI,SAAI,GAAG,eAAe,CAAC;QAGtB,SAAI,GAAG,EAAE,CAAC;QAEmB,UAAK,GAAG,QAAQ,CAAC;QAQ/C,SAAI,GAAG,KAAK,CAAC;IA+KtB,CAAC;IAnIS,YAAY;QAClB,OAAO,IAAI,CAAC,IAAI,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,CAAC;IAC3E,CAAC;IAEkB,KAAK,CAAC,OAAO,CAC9B,iBAAiC;QAEjC,IAAI,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;YACjC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,mBAAmB,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC;YAC9D,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,kBAAkB,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC;SAC9D;QACD,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;YAClC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;SAC5D;QACD,IACE,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC;YAC7B,iBAAiB,CAAC,GAAG,CAAC,eAAe,CAAC,EACtC;YACA,IAAI,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;YACrE,IAAI,QAAQ,IAAI,SAAS,CAAC,QAAQ,CAAC,EAAE;gBACnC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC;aACvC;iBAAM,IAAI,IAAI,CAAC,aAAa,EAAE;gBAC7B,IAAI,CAAC,IAAI,GAAG,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;aACrD;iBAAM;gBACL,mDAAmD;aACpD;SACF;QACD,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC5B,CAAC;IAEO,kBAAkB;QACxB,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;QACjD,MAAM,KAAK,GAAG,GAAG,EAAE,UAAU,CAAA;QAC7B,IAAG,CAAC,KAAK,EAAE,YAAY,CAAC,OAAO,CAAC,EAAC;YAC/B,GAAG,EAAE,YAAY,CAAC,OAAO,EAAC,4BAA4B,CAAC,CAAC;SACzD;QACD,IAAG,CAAC,KAAK,EAAE,YAAY,CAAC,SAAS,CAAC,EAAC;YACjC,GAAG,EAAE,YAAY,CAAC,SAAS,EAAC,KAAK,CAAC,CAAA;SACnC;QACD,IAAG,IAAI,CAAC,KAAK,EAAC;YACZ,GAAG,EAAE,YAAY,CAAC,SAAS,EAAC,OAAO,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC,CAAA;SAC/D;aACI,IAAG,CAAC,KAAK,EAAE,YAAY,CAAC,SAAS,CAAC,EAAC;YACtC,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK;gBAC/B,CAAC,CAAC,OAAO,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,EAAE;gBACnC,CAAC,CAAC,WAAW,CAAC;YACd,GAAG,EAAE,YAAY,CAAC,SAAS,EAAC,YAAY,CAAC,CAAA;SAC1C;QAED,IAAG,CAAC,KAAK,EAAE,YAAY,CAAC,QAAQ,CAAC,EAAC;YAChC,GAAG,EAAE,YAAY,CAAC,QAAQ,EAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YAC9C,GAAG,EAAE,YAAY,CAAC,OAAO,EAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;SAC9C;QAED,GAAG,EAAE,YAAY,CAAC,aAAa,EAAC,GAAG,IAAI,CAAC,WAAW,KAAK,EAAE,EAAE,CAAC,CAAC;QAC9D,GAAG,EAAE,YAAY,CAAC,YAAY,EAAC,IAAI,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC;QAEvD,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC,GAAU,EAAC,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAAA;QAE1G,GAAG,EAAE,SAAS,CAAC,GAAG,CAAC,UAAU,EAAC,GAAG,iBAAiB,CAAC,CAAA;IACrD,CAAC;IAEO,KAAK,CAAC,QAAQ,CAAC,IAAY;QACjC,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,IAAI,CAAC,CAAC;QACnC,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE;YAChB,MAAM,IAAI,KAAK,CAAC,uBAAuB,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC;SAC3D;QAED,OAAO,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;IAC/B,CAAC;IAEO,aAAa,CAAC,QAAgB;QACpC,OAAO,QAAQ,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;IACpC,CAAC;IAEO,cAAc;QACpB,MAAM,kBAAkB,GAAE,cAAc,CAAC;QACzC,MAAM,kBAAkB,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC;QAC/D,MAAM,QAAQ,GAAG,kBAAkB,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAC,EAAE,CAAC,CAAC,OAAO,CAAC,GAAG,EAAC,EAAE,CAAC,CAAA;QAC3E,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAChC,kBAAkB,EACjB,EAAE,CACH;aACA,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAA;QACtB,OAAQ;;;;wBAIY,QAAQ;;wBAER,OAAO;2BACJ,CAAA;IACzB,CAAC;IAED,IAAI,cAAc;QAChB,OAAO;YACL,QAAQ,EAAE,IAAI,CAAC,MAAM,IAAI,MAAM;YAC/B,gBAAgB,EAAE,IAAI,CAAC,IAAI;SACV,CAAC;IACtB,CAAC;IAEkB,MAAM;QACvB,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QACvB,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QAEzB;;WAEG;QACH,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK;YAC7B,CAAC,CAAC,OAAO,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,EAAE;YACnC,CAAC,CAAC,WAAW,CAAC;QAGhB,IACE,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,CAAC;YACtE,CAAC,IAAI,CAAC,KAAK,EACX;YACA,8FAA8F;YAC9F,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,SAAS,CAAC,CAAC;SAEtD;aAAM,IAAI,IAAI,CAAC,KAAK,EAAE;YACrB,+EAA+E;YAC/E,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;SAC5D;QAED,OAAO,IAAI,CAAA;4BACa,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC;QACjD,SAAS,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;;KAEnC,CAAA;IACD,CAAC;;AAtKa,eAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkC3B,CAAC;AAvFF;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCACZ;AAQ9B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCACrB;AAOrB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAClB;AAGxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCACnB;AAOvB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CACG;AAO9B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCACZ;AAG9B;IADC,KAAK,EAAE;sCACU;AAEU;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAA2B;AAKzB;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCAAa;AAGzC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sCACR;AAMS;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCAAY;AA1D7B,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAmOpB;SAnOY,QAAQ","sourcesContent":["import { LitElement, html, css, PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport type { TemplateResult } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport * as Icons from './icons/svg';\n\ninterface IconPaths {\n  [key: string]: string;\n}\n\ninterface ButtonClassMap {\n  [key:string]: boolean;\n}\n\nconst iconPaths: IconPaths = Icons as IconPaths;\n\nconst SMALL_ICON_SIZE = 16;\nconst LARGE_ICON_SIZE = 24;\n\n/**\n * Nile icon component.\n *\n * @tag nile-icon\n *\n */\n@customElement('nile-icon')\nexport class NileIcon extends LitElement {\n  /**\n   * The name of the icon set\n   * @attr icon set\n   * @type {IconName | undefined}\n   */\n  @property({ type: String, reflect: true })\n  public set?: string = 'local';\n\n  /**\n   * The name of the icon\n   * @attr name\n   * @type {IconName | undefined}\n   */\n  @property({ type: String, reflect: true })\n  public name?: string;\n\n  /**\n   * A description of what the icon represents\n   * @attr description\n   */\n  @property({ type: String, reflect: true })\n  public description = '';\n\n  @property({ type: String, reflect: true })\n  public method = 'fill';\n\n  /**\n   * A path to a custom SVG file to display as the icon\n   * @attr customSvgPath\n   */\n  @property({ type: String })\n  public customSvgPath?: string;\n\n  /**\n   * A size of what the icon represents\n   * @attr size\n   */\n  @property({ type: String, reflect: true })\n  public size = SMALL_ICON_SIZE;\n\n  @state()\n  private _svg = '';\n\n  @property({ type: String }) override title = 'agents';\n\n  /**\n   * Color\n   */\n  @property({ reflect: true }) color: any ;\n\n  @property({ type: Boolean })\n  public push = false;\n\n  /**\n   * Retain Viewbox\n   */\n\n  @property({ reflect: true }) frame: any;\n\n  static override styles = css`\n    :host {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      contain: content;\n      --nile-svg-stroke-width: 1.3;\n    }\n\n    .nds-icon {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .nds-icon svg {\n      height: var(--nile-svg-height);\n      width: var(--nile-svg-width);\n      stroke: var(--nile-svg-stroke);\n    }\n\n    .nds-icon svg path {\n      fill: var(--nile-svg-fill);\n    }\n\n    .stroke svg path {\n      fill: none !important;\n      stroke: var(--nile-svg-fill) !important;\n      stroke-width: var(--nile-svg-stroke-width);\n    }\n\n    .nds-icon--push {\n      margin-right: 12px;\n    }\n  `;\n\n  private _getIconSize(): number {\n    return this.name?.endsWith('-small') ? SMALL_ICON_SIZE : LARGE_ICON_SIZE;\n  }\n\n  protected override async updated(\n    changedProperties: PropertyValues\n  ): Promise<void> {\n    if (changedProperties.has('size')) {\n      this.style.setProperty('--nile-svg-height', `${this.size}px`);\n      this.style.setProperty('--nile-svg-width', `${this.size}px`);\n    }\n    if (changedProperties.has('color')) {\n      this.style.setProperty('--nile-svg-fill', `${this.color}`);\n    }\n    if (\n      changedProperties.has('name') ||\n      changedProperties.has('customSvgPath')\n    ) {\n      let iconName = this.name ? this.removeHyphens(this.name) : undefined;\n      if (iconName && iconPaths[iconName]) {\n        this._svg = atob(iconPaths[iconName]);\n      } else if (this.customSvgPath) {\n        this._svg = await this.fetchSvg(this.customSvgPath);\n      } else {\n        // throw new Error(`No icon named \"${this.name}\"`);\n      }\n    }\n    this.addAttributesToSvg();\n  }\n\n  private addAttributesToSvg(){\n    const svg = this.renderRoot.querySelector('#svg')\n    const attrs = svg?.attributes\n    if(!attrs?.getNamedItem('xmlns')){\n      svg?.setAttribute('xmlns',\"http://www.w3.org/2000/svg\");\n    }\n    if(!attrs?.getNamedItem('version')){\n      svg?.setAttribute(\"version\",\"1.1\")\n    }\n    if(this.frame){\n      svg?.setAttribute('viewBox',`0 0 ${this.frame} ${this.frame}`)\n    }\n    else if(!attrs?.getNamedItem('viewBox')){\n      const viewboxLogic = this.frame\n      ? `0 0 ${this.frame} ${this.frame}`\n      : '0 0 16 16';\n      svg?.setAttribute('viewBox',viewboxLogic)\n    }\n\n    if(!attrs?.getNamedItem('height')){\n      svg?.setAttribute('height',String(this.size));\n      svg?.setAttribute('width',String(this.size));\n    }\n\n    svg?.setAttribute('aria-hidden',`${this.description === ''}`);\n    svg?.setAttribute('aria-label',this.description || '');\n\n    const additionalClasses = Object.keys(this.buttonClassMap).filter((key:string)=> this.buttonClassMap[key])\n\n    svg?.classList.add('nds-icon',...additionalClasses)\n  }\n\n  private async fetchSvg(path: string): Promise<string> {\n    const response = await fetch(path);\n    if (!response.ok) {\n      throw new Error(`HTTP error! status: ${response.status}`);\n    }\n\n    return await response.text();\n  }\n\n  private removeHyphens(iconName: string) {\n    return iconName.replace(/-/g, '');\n  }\n\n  private getSvgTemplate(){\n    const svgTagRegexPattern =/<svg\\s[^>]*>/;\n    const regexToGetSVGAttrs = this._svg.match(svgTagRegexPattern);\n    const svgAttrs = regexToGetSVGAttrs?.[0].replace('<svg','').replace('>','')\n    const svgBody = this._svg.replace(\n     svgTagRegexPattern,\n      ''\n    )\n    .replace('</svg>', '')\n    return  `<svg\n                      id='svg'\n                      focusable='true'\n                      role='img'\n                      ${svgAttrs}\n                    >\n                      ${svgBody}\n                    </svg>`\n  }\n\n  get buttonClassMap() {\n    return {\n      'stroke': this.method != 'fill' ,\n      'nds-icon--push': this.push,\n    } as ButtonClassMap;\n  }\n\n  protected override render(): TemplateResult {\n    const size = this.size;\n    const color = this.color;\n\n    /**\n     * When icons are outside frame\n     */\n    const viewboxLogic = this.frame\n      ? `0 0 ${this.frame} ${this.frame}`\n      : '0 0 16 16';\n\n\n    if (\n      (!this._svg.includes('fill=') || this._svg.includes('fill=\"inherit\"')) &&\n      !this.color\n    ) {\n      // Case 1: _svg does not have fill color or has fill=\"inherit\" and this.color is not mentioned\n      this.style.setProperty('--nile-svg-fill', `#7F7F7F`);\n\n    } else if (this.color) {\n      // Case 2: If this.color is mentioned, use it as fill, regardless of _svg color\n      this.style.setProperty('--nile-svg-fill', `${this.color}`);\n    }\n\n    return html`\n    <span class=\"nds-icon ${classMap(this.buttonClassMap)}\">\n      ${unsafeSVG(this.getSvgTemplate())}\n      </span>\n    `\n    }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n    'nile-icon': NileIcon;\n  }\n}\n"]}

package/dist/src/nile-menu/nile-menu.css.js

@@ -42,6 +42,28 @@ export const styles = css `
   ::slotted(nile-divider) {
     --spacing: 0.5rem;
   }
+
+  .menu__footer {
+    display: flex;
+    border-radius: var(--nile-radius-radius-sm);
+    align-items: stretch;
+    font-size: 1rem;
+    font-weight: var(--nile-font-weight-regular);
+    line-height: 180%;
+    letter-spacing: normal;
+    color: var(--nile-colors-primary-600);
+    min-height: 40px;
+    transition: 150ms fill;
+    user-select: none;
+    white-space: nowrap;
+    cursor: pointer;
+    padding: 0 var(--nile-spacing-spacing-xl);
+    margin: auto 0;
+  }
+
+  .menu__footer:hover {
+    background-color:var(--nile-menu-item-background-color);
+  }
 `;
 export default [styles];
 //# sourceMappingURL=nile-menu.css.js.map

package/dist/src/nile-menu/nile-menu.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-menu.css.js","sourceRoot":"","sources":["../../../src/nile-menu/nile-menu.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCxB,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 * Menu CSS\n */\nexport const styles = css`\n  :host {\n    display: block;\n    position: relative;\n    background: hsl(0, 0%, 100%);\n    border: solid 1px hsl(240 5.9% 90%);\n    border-radius: 6px;\n    overflow: hidden;\n    height: 100%;\n    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),\n      0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n    /* overscroll-behavior: none; */\n    /* -ms-overflow-style: none; */\n    /* scrollbar-width: none; */\n  }\n\n  .search__wrapper {\n    box-sizing: border-box;\n    padding: 12px 6px;\n    position: sticky;\n    z-index: 999;\n    top: 0px;\n    background: hsl(0, 0%, 100%);\n    height: 64px;\n  }\n\n  .menu__items-wrapper {\n    overflow: auto;\n    max-height: calc(100vh - 64px);\n  }\n\n  ::slotted(nile-divider) {\n    --spacing: 0.5rem;\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-menu.css.js","sourceRoot":"","sources":["../../../src/nile-menu/nile-menu.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwDxB,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 * Menu CSS\n */\nexport const styles = css`\n  :host {\n    display: block;\n    position: relative;\n    background: hsl(0, 0%, 100%);\n    border: solid 1px hsl(240 5.9% 90%);\n    border-radius: 6px;\n    overflow: hidden;\n    height: 100%;\n    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),\n      0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n    /* overscroll-behavior: none; */\n    /* -ms-overflow-style: none; */\n    /* scrollbar-width: none; */\n  }\n\n  .search__wrapper {\n    box-sizing: border-box;\n    padding: 12px 6px;\n    position: sticky;\n    z-index: 999;\n    top: 0px;\n    background: hsl(0, 0%, 100%);\n    height: 64px;\n  }\n\n  .menu__items-wrapper {\n    overflow: auto;\n    max-height: calc(100vh - 64px);\n  }\n\n  ::slotted(nile-divider) {\n    --spacing: 0.5rem;\n  }\n\n  .menu__footer {\n    display: flex;\n    border-radius: var(--nile-radius-radius-sm);\n    align-items: stretch;\n    font-size: 1rem;\n    font-weight: var(--nile-font-weight-regular);\n    line-height: 180%;\n    letter-spacing: normal;\n    color: var(--nile-colors-primary-600);\n    min-height: 40px;\n    transition: 150ms fill;\n    user-select: none;\n    white-space: nowrap;\n    cursor: pointer;\n    padding: 0 var(--nile-spacing-spacing-xl);\n    margin: auto 0;\n  }\n\n  .menu__footer:hover {\n    background-color:var(--nile-menu-item-background-color);\n  }\n`;\n\nexport default [styles];\n"]}

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

@@ -21,6 +21,7 @@ export declare class NileMenu extends NileElement {
     showNoResults: boolean;
     noResultsMessage: string;
     defaultSlot: HTMLSlotElement;
+    private readonly hasSlotController;
     connectedCallback(): void;
     private handleClick;
     private handleKeyDown;

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

@@ -4,6 +4,7 @@ import { customElement, property, state } from 'lit/decorators.js';
 import { query } from 'lit/decorators.js';
 import NileElement from '../internal/nile-element';
 import { styles } from './nile-menu.css';
+import { HasSlotController } from '../internal/slot';
 /**
  * An nile-menu element.
  * @summary Menus provide a list of options for the user to choose from.
@@ -24,6 +25,7 @@ let NileMenu = class NileMenu extends NileElement {
         this.customSearch = false;
         this.showNoResults = false;
         this.noResultsMessage = 'No results found';
+        this.hasSlotController = new HasSlotController(this, 'menu__footer', 'menu__header');
     }
     connectedCallback() {
         super.connectedCallback();
@@ -157,9 +159,6 @@ let NileMenu = class NileMenu extends NileElement {
             ? html `<div class="search__wrapper" part="search__wrapper">
             <nile-input
               size="medium"
-              style=${this.searchWidth
-                ? `width: ${this.searchWidth}px;`
-                : 'width: 100%;'}
               .value=${this.searchValue}
               placeholder="Search..."
               @nile-input=${this.handleSearchChange}
@@ -189,6 +188,13 @@ let NileMenu = class NileMenu extends NileElement {
           @keydown=${this.handleKeyDown}
           @mousedown=${this.handleMouseDown}
         ></slot>
+        ${this.hasSlotController.test('menu__footer')
+            ? html ` <slot
+              part="menu__footer"
+              name="menu__footer"
+              class="menu__footer"
+            ></slot>`
+            : null}
       </div>
     `;
     }

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

@@ -1 +1 @@
-{"version":3,"file":"nile-menu.js","sourceRoot":"","sources":["../../../src/nile-menu/nile-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { query } from 'lit/decorators.js';\nimport NileElement from '../internal/nile-element';\nimport type { CSSResultGroup } from 'lit';\nimport type NileMenuItem from '../nile-menu-item/nile-menu-item';\nimport { styles } from './nile-menu.css';\n\n/**\n * An nile-menu element.\n * @summary Menus provide a list of options for the user to choose from.\n *\n * @slot - The menu's content, including menu items, menu labels, and dividers.\n *\n * @event nile-select - Emitted when a menu item is selected.\n * @fires count-changed - Indicates when the count changes\n * @slot - This element has a slot\n * @csspart button - The button\n */\n\n@customElement('nile-menu')\nexport class NileMenu extends NileElement {\n  static styles: CSSResultGroup = styles;\n  @state() searchValue: string = '';\n  @state() searchWidth: number = 0;\n\n  @property({ type: Boolean, reflect: true }) searchEnabled = false;\n  @property({ type: Boolean, reflect: true }) customSearch = false;\n\n  @property({ type: Boolean }) showNoResults: boolean = false;\n\n  @property({ type: String }) noResultsMessage: string = 'No results found';\n\n  @query('slot:not([name])') defaultSlot!: HTMLSlotElement;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'menu');\n  }\n\n  private handleClick(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n    const item = target.closest('nile-menu-item');\n\n    if (item?.hasSubMenu) {\n      return;\n    }\n\n    // if (!item || item.disabled || item.inert) {\n    if (!item || item.disabled) {\n      return;\n    }\n\n    if (item.type === 'checkbox') {\n      item.checked = !item.checked;\n    }\n\n    this.emit('nile-select', { value: item.value });\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    // Make a selection when pressing enter\n    if (event.key === 'Enter') {\n      const item = this.getCurrentItem();\n      event.preventDefault();\n\n      // Simulate a click to support @click handlers on menu items that also work with the keyboard\n      item?.click();\n    }\n\n    // Prevent scrolling when space is pressed\n    if (event.key === ' ') {\n      event.preventDefault();\n    }\n\n    // Move the selection when pressing down or up\n    if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n      const items = this.getAllItems();\n      const activeItem = this.getCurrentItem();\n      let index = activeItem ? items.indexOf(activeItem) : 0;\n\n      if (items.length > 0) {\n        event.preventDefault();\n\n        if (event.key === 'ArrowDown') {\n          index++;\n        } else if (event.key === 'ArrowUp') {\n          index--;\n        } else if (event.key === 'Home') {\n          index = 0;\n        } else if (event.key === 'End') {\n          index = items.length - 1;\n        }\n\n        if (index < 0) {\n          index = items.length - 1;\n        }\n        if (index > items.length - 1) {\n          index = 0;\n        }\n\n        this.setCurrentItem(items[index]);\n        items[index].focus();\n      }\n    }\n  }\n\n  private handleMouseDown(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n\n    if (this.isMenuItem(target)) {\n      this.setCurrentItem(target as NileMenuItem);\n    }\n  }\n\n  private handleSlotChange() {\n    const items = this.getAllItems();\n\n    // Reset the roving tab index when the slotted items change\n    if (items.length > 0) {\n      this.setCurrentItem(items[0]);\n    }\n  }\n\n  private isMenuItem(item: HTMLElement) {\n    return (\n      item.tagName.toLowerCase() === 'nile-menu-item' ||\n      ['menuitem', 'menuitemcheckbox', 'menuitemradio'].includes(\n        item.getAttribute('role') ?? ''\n      )\n    );\n  }\n\n  /** @internal Gets all slotted menu items, ignoring dividers, headers, and other elements. */\n  getAllItems() {\n    return [...this.defaultSlot.assignedElements({ flatten: true })].filter(\n      (el: HTMLElement) => {\n        if (!this.isMenuItem(el)) {\n          // if (el.inert || !this.isMenuItem(el)) {\n          return false;\n        }\n        return true;\n      }\n    ) as NileMenuItem[];\n  }\n\n  /**\n   * @internal Gets the current menu item, which is the menu item that has `tabindex=\"0\"` within the roving tab index.\n   * The menu item may or may not have focus, but for keyboard interaction purposes it's considered the \"active\" item.\n   */\n  getCurrentItem() {\n    return this.getAllItems().find(i => i.getAttribute('tabindex') === '0');\n  }\n\n  /**\n   * @internal Sets the current menu item to the specified element. This sets `tabindex=\"0\"` on the target element and\n   * `tabindex=\"-1\"` to all other items. This method must be called prior to setting focus on a menu item.\n   */\n  setCurrentItem(item: NileMenuItem) {\n    const items = this.getAllItems();\n\n    // Update tab indexes\n    items.forEach(i => {\n      i.setAttribute('tabindex', i === item ? '0' : '-1');\n    });\n  }\n\n  private handleSearchChange(e: any) {\n    let items = this.getAllItems();\n    let searchValue = e.target.value;\n    if (this.customSearch) {\n      this.emit('nile-search-value', { value: searchValue });\n      return;\n    }\n\n    let counter = 0;\n    items.map(curr_item => {\n      this.searchWidth = Math.max(this.searchWidth, curr_item.offsetWidth);\n      if (\n        curr_item.innerText.toLowerCase().includes(e.target.value.toLowerCase())\n      ) {\n        curr_item.style.display = 'block';\n        counter++;\n      } else {\n        curr_item.style.display = 'none';\n      }\n    });\n    this.showNoResults = counter === 0;\n  }\n\n  render() {\n    return html`\n      ${this.searchEnabled\n        ? html`<div class=\"search__wrapper\" part=\"search__wrapper\">\n            <nile-input\n              size=\"medium\"\n              style=${this.searchWidth\n                ? `width: ${this.searchWidth}px;`\n                : 'width: 100%;'}\n              .value=${this.searchValue}\n              placeholder=\"Search...\"\n              @nile-input=${this.handleSearchChange}\n              part=\"menu__input\"\n              clearable\n            >\n              <nile-icon name=\"search\" slot=\"suffix\"> </nile-icon>\n            </nile-input>\n          </div>`\n        : html``}\n      <div part=\"menu__items-wrapper\" class=\"menu__items-wrapper\">\n        ${this.showNoResults\n          ? html` <nile-menu-item>${this.noResultsMessage}</nile-menu-item> `\n          : ''}\n\n        <slot\n          name=\"menu__header\"\n          part=\"menu__header\"\n          @click=${(e: Event) => {\n            e.stopPropagation();\n          }}\n        ></slot>\n        <slot\n          class=\"menu__item-wrapper\"\n          @slotchange=${this.handleSlotChange}\n          @click=${this.handleClick}\n          @keydown=${this.handleKeyDown}\n          @mousedown=${this.handleMouseDown}\n        ></slot>\n      </div>\n    `;\n  }\n}\nexport default NileMenu;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-menu': NileMenu;\n  }\n}\n"]}
+{"version":3,"file":"nile-menu.js","sourceRoot":"","sources":["../../../src/nile-menu/nile-menu.ts"],"names":[],"mappings":";AAAA,OAAO,EAAc,IAAI,EAAO,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAGnD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD;;;;;;;;;;GAUG;AAGI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,WAAW;IAAlC;;QAEI,gBAAW,GAAW,EAAE,CAAC;QACzB,gBAAW,GAAW,CAAC,CAAC;QAEW,kBAAa,GAAG,KAAK,CAAC;QACtB,iBAAY,GAAG,KAAK,CAAC;QAEpC,kBAAa,GAAY,KAAK,CAAC;QAEhC,qBAAgB,GAAW,kBAAkB,CAAC;QAIzD,sBAAiB,GAAG,IAAI,iBAAiB,CACxD,IAAI,EACJ,cAAc,EACd,cAAc,CACf,CAAC;IA0MJ,CAAC;IAxMC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACpC,CAAC;IAEO,WAAW,CAAC,KAAiB;QACnC,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;QAC3C,MAAM,IAAI,GAAG,MAAM,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC;QAE9C,IAAI,IAAI,EAAE,UAAU,EAAE;YACpB,OAAO;SACR;QAED,8CAA8C;QAC9C,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,EAAE;YAC1B,OAAO;SACR;QAED,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;YAC5B,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;SAC9B;QAED,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;IAClD,CAAC;IAEO,aAAa,CAAC,KAAoB;QACxC,uCAAuC;QACvC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE;YACzB,MAAM,IAAI,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;YACnC,KAAK,CAAC,cAAc,EAAE,CAAC;YAEvB,6FAA6F;YAC7F,IAAI,EAAE,KAAK,EAAE,CAAC;SACf;QAED,0CAA0C;QAC1C,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YACrB,KAAK,CAAC,cAAc,EAAE,CAAC;SACxB;QAED,8CAA8C;QAC9C,IAAI,CAAC,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;YAC/D,MAAM,KAAK,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;YACjC,MAAM,UAAU,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;YACzC,IAAI,KAAK,GAAG,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAEvD,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;gBACpB,KAAK,CAAC,cAAc,EAAE,CAAC;gBAEvB,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE;oBAC7B,KAAK,EAAE,CAAC;iBACT;qBAAM,IAAI,KAAK,CAAC,GAAG,KAAK,SAAS,EAAE;oBAClC,KAAK,EAAE,CAAC;iBACT;qBAAM,IAAI,KAAK,CAAC,GAAG,KAAK,MAAM,EAAE;oBAC/B,KAAK,GAAG,CAAC,CAAC;iBACX;qBAAM,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,EAAE;oBAC9B,KAAK,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;iBAC1B;gBAED,IAAI,KAAK,GAAG,CAAC,EAAE;oBACb,KAAK,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;iBAC1B;gBACD,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;oBAC5B,KAAK,GAAG,CAAC,CAAC;iBACX;gBAED,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;gBAClC,KAAK,CAAC,KAAK,CAAC,CAAC,KAAK,EAAE,CAAC;aACtB;SACF;IACH,CAAC;IAEO,eAAe,CAAC,KAAiB;QACvC,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;QAE3C,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,EAAE;YAC3B,IAAI,CAAC,cAAc,CAAC,MAAsB,CAAC,CAAC;SAC7C;IACH,CAAC;IAEO,gBAAgB;QACtB,MAAM,KAAK,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;QAEjC,2DAA2D;QAC3D,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YACpB,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;SAC/B;IACH,CAAC;IAEO,UAAU,CAAC,IAAiB;QAClC,OAAO,CACL,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,gBAAgB;YAC/C,CAAC,UAAU,EAAE,kBAAkB,EAAE,eAAe,CAAC,CAAC,QAAQ,CACxD,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,EAAE,CAChC,CACF,CAAC;IACJ,CAAC;IAED,6FAA6F;IAC7F,WAAW;QACT,OAAO,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,MAAM,CACrE,CAAC,EAAe,EAAE,EAAE;YAClB,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE;gBACxB,0CAA0C;gBAC1C,OAAO,KAAK,CAAC;aACd;YACD,OAAO,IAAI,CAAC;QACd,CAAC,CACgB,CAAC;IACtB,CAAC;IAED;;;OAGG;IACH,cAAc;QACZ,OAAO,IAAI,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC;IAC1E,CAAC;IAED;;;OAGG;IACH,cAAc,CAAC,IAAkB;QAC/B,MAAM,KAAK,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;QAEjC,qBAAqB;QACrB,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE;YAChB,CAAC,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;QACtD,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,kBAAkB,CAAC,CAAM;QAC/B,IAAI,KAAK,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;QAC/B,IAAI,WAAW,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QACjC,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,IAAI,CAAC,IAAI,CAAC,mBAAmB,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC,CAAC;YACvD,OAAO;SACR;QAED,IAAI,OAAO,GAAG,CAAC,CAAC;QAChB,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE;YACpB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;YACrE,IACE,SAAS,CAAC,SAAS,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,EACxE;gBACA,SAAS,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;gBAClC,OAAO,EAAE,CAAC;aACX;iBAAM;gBACL,SAAS,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;aAClC;QACH,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,aAAa,GAAG,OAAO,KAAK,CAAC,CAAC;IACrC,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,aAAa;YAClB,CAAC,CAAC,IAAI,CAAA;;;uBAGS,IAAI,CAAC,WAAW;;4BAEX,IAAI,CAAC,kBAAkB;;;;;;iBAMlC;YACT,CAAC,CAAC,IAAI,CAAA,EAAE;;UAEN,IAAI,CAAC,aAAa;YAClB,CAAC,CAAC,IAAI,CAAA,oBAAoB,IAAI,CAAC,gBAAgB,oBAAoB;YACnE,CAAC,CAAC,EAAE;;;;;mBAKK,CAAC,CAAQ,EAAE,EAAE;YACpB,CAAC,CAAC,eAAe,EAAE,CAAC;QACtB,CAAC;;;;wBAIa,IAAI,CAAC,gBAAgB;mBAC1B,IAAI,CAAC,WAAW;qBACd,IAAI,CAAC,aAAa;uBAChB,IAAI,CAAC,eAAe;;UAEjC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC;YAC3C,CAAC,CAAC,IAAI,CAAA;;;;qBAIK;YACX,CAAC,CAAC,IAAI;;KAEX,CAAC;IACJ,CAAC;;AA1NM,eAAM,GAAmB,MAAM,CAAC;AAC9B;IAAR,KAAK,EAAE;6CAA0B;AACzB;IAAR,KAAK,EAAE;6CAAyB;AAEW;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAAuB;AACtB;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAsB;AAEpC;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CAAgC;AAEhC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAA+C;AAE/C;IAA1B,KAAK,CAAC,kBAAkB,CAAC;6CAA+B;AAZ9C,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CA4NpB;SA5NY,QAAQ;AA6NrB,eAAe,QAAQ,CAAC","sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { query } from 'lit/decorators.js';\nimport NileElement from '../internal/nile-element';\nimport type { CSSResultGroup } from 'lit';\nimport type NileMenuItem from '../nile-menu-item/nile-menu-item';\nimport { styles } from './nile-menu.css';\nimport { HasSlotController } from '../internal/slot';\n\n/**\n * An nile-menu element.\n * @summary Menus provide a list of options for the user to choose from.\n *\n * @slot - The menu's content, including menu items, menu labels, and dividers.\n *\n * @event nile-select - Emitted when a menu item is selected.\n * @fires count-changed - Indicates when the count changes\n * @slot - This element has a slot\n * @csspart button - The button\n */\n\n@customElement('nile-menu')\nexport class NileMenu extends NileElement {\n  static styles: CSSResultGroup = styles;\n  @state() searchValue: string = '';\n  @state() searchWidth: number = 0;\n\n  @property({ type: Boolean, reflect: true }) searchEnabled = false;\n  @property({ type: Boolean, reflect: true }) customSearch = false;\n\n  @property({ type: Boolean }) showNoResults: boolean = false;\n\n  @property({ type: String }) noResultsMessage: string = 'No results found';\n\n  @query('slot:not([name])') defaultSlot!: HTMLSlotElement;\n\n  private readonly hasSlotController = new HasSlotController(\n    this,\n    'menu__footer',\n    'menu__header'\n  );\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'menu');\n  }\n\n  private handleClick(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n    const item = target.closest('nile-menu-item');\n\n    if (item?.hasSubMenu) {\n      return;\n    }\n\n    // if (!item || item.disabled || item.inert) {\n    if (!item || item.disabled) {\n      return;\n    }\n\n    if (item.type === 'checkbox') {\n      item.checked = !item.checked;\n    }\n\n    this.emit('nile-select', { value: item.value });\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    // Make a selection when pressing enter\n    if (event.key === 'Enter') {\n      const item = this.getCurrentItem();\n      event.preventDefault();\n\n      // Simulate a click to support @click handlers on menu items that also work with the keyboard\n      item?.click();\n    }\n\n    // Prevent scrolling when space is pressed\n    if (event.key === ' ') {\n      event.preventDefault();\n    }\n\n    // Move the selection when pressing down or up\n    if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n      const items = this.getAllItems();\n      const activeItem = this.getCurrentItem();\n      let index = activeItem ? items.indexOf(activeItem) : 0;\n\n      if (items.length > 0) {\n        event.preventDefault();\n\n        if (event.key === 'ArrowDown') {\n          index++;\n        } else if (event.key === 'ArrowUp') {\n          index--;\n        } else if (event.key === 'Home') {\n          index = 0;\n        } else if (event.key === 'End') {\n          index = items.length - 1;\n        }\n\n        if (index < 0) {\n          index = items.length - 1;\n        }\n        if (index > items.length - 1) {\n          index = 0;\n        }\n\n        this.setCurrentItem(items[index]);\n        items[index].focus();\n      }\n    }\n  }\n\n  private handleMouseDown(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n\n    if (this.isMenuItem(target)) {\n      this.setCurrentItem(target as NileMenuItem);\n    }\n  }\n\n  private handleSlotChange() {\n    const items = this.getAllItems();\n\n    // Reset the roving tab index when the slotted items change\n    if (items.length > 0) {\n      this.setCurrentItem(items[0]);\n    }\n  }\n\n  private isMenuItem(item: HTMLElement) {\n    return (\n      item.tagName.toLowerCase() === 'nile-menu-item' ||\n      ['menuitem', 'menuitemcheckbox', 'menuitemradio'].includes(\n        item.getAttribute('role') ?? ''\n      )\n    );\n  }\n\n  /** @internal Gets all slotted menu items, ignoring dividers, headers, and other elements. */\n  getAllItems() {\n    return [...this.defaultSlot.assignedElements({ flatten: true })].filter(\n      (el: HTMLElement) => {\n        if (!this.isMenuItem(el)) {\n          // if (el.inert || !this.isMenuItem(el)) {\n          return false;\n        }\n        return true;\n      }\n    ) as NileMenuItem[];\n  }\n\n  /**\n   * @internal Gets the current menu item, which is the menu item that has `tabindex=\"0\"` within the roving tab index.\n   * The menu item may or may not have focus, but for keyboard interaction purposes it's considered the \"active\" item.\n   */\n  getCurrentItem() {\n    return this.getAllItems().find(i => i.getAttribute('tabindex') === '0');\n  }\n\n  /**\n   * @internal Sets the current menu item to the specified element. This sets `tabindex=\"0\"` on the target element and\n   * `tabindex=\"-1\"` to all other items. This method must be called prior to setting focus on a menu item.\n   */\n  setCurrentItem(item: NileMenuItem) {\n    const items = this.getAllItems();\n\n    // Update tab indexes\n    items.forEach(i => {\n      i.setAttribute('tabindex', i === item ? '0' : '-1');\n    });\n  }\n\n  private handleSearchChange(e: any) {\n    let items = this.getAllItems();\n    let searchValue = e.target.value;\n    if (this.customSearch) {\n      this.emit('nile-search-value', { value: searchValue });\n      return;\n    }\n\n    let counter = 0;\n    items.map(curr_item => {\n      this.searchWidth = Math.max(this.searchWidth, curr_item.offsetWidth);\n      if (\n        curr_item.innerText.toLowerCase().includes(e.target.value.toLowerCase())\n      ) {\n        curr_item.style.display = 'block';\n        counter++;\n      } else {\n        curr_item.style.display = 'none';\n      }\n    });\n    this.showNoResults = counter === 0;\n  }\n\n  render() {\n    return html`\n      ${this.searchEnabled\n        ? html`<div class=\"search__wrapper\" part=\"search__wrapper\">\n            <nile-input\n              size=\"medium\"\n              .value=${this.searchValue}\n              placeholder=\"Search...\"\n              @nile-input=${this.handleSearchChange}\n              part=\"menu__input\"\n              clearable\n            >\n              <nile-icon name=\"search\" slot=\"suffix\"> </nile-icon>\n            </nile-input>\n          </div>`\n        : html``}\n      <div part=\"menu__items-wrapper\" class=\"menu__items-wrapper\">\n        ${this.showNoResults\n          ? html` <nile-menu-item>${this.noResultsMessage}</nile-menu-item> `\n          : ''}\n\n        <slot\n          name=\"menu__header\"\n          part=\"menu__header\"\n          @click=${(e: Event) => {\n            e.stopPropagation();\n          }}\n        ></slot>\n        <slot\n          class=\"menu__item-wrapper\"\n          @slotchange=${this.handleSlotChange}\n          @click=${this.handleClick}\n          @keydown=${this.handleKeyDown}\n          @mousedown=${this.handleMouseDown}\n        ></slot>\n        ${this.hasSlotController.test('menu__footer')\n          ? html` <slot\n              part=\"menu__footer\"\n              name=\"menu__footer\"\n              class=\"menu__footer\"\n            ></slot>`\n          : null}\n      </div>\n    `;\n  }\n}\nexport default NileMenu;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-menu': NileMenu;\n  }\n}\n"]}

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

@@ -152,6 +152,7 @@ export declare class NileSelect extends NileElement implements NileFormControl {
     oldMaxOptionsVisible: number;
     showNoResults: boolean;
     noResultsMessage: string;
+    hiddenItems: any;
     /** Gets the validity state object */
     get validity(): ValidityState;
     /** Gets the validation message */

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

@@ -159,6 +159,7 @@ let NileSelect = class NileSelect extends NileElement {
         this.oldMaxOptionsVisible = 1;
         this.showNoResults = false;
         this.noResultsMessage = 'No results found';
+        this.hiddenItems = [];
     }
     /** Gets the validity state object */
     get validity() {
@@ -230,8 +231,10 @@ let NileSelect = class NileSelect extends NileElement {
         this.showSelected = !this.showSelected;
         // Hide unselected options if showSelected is true
         const allOptions = this.getAllOptions();
+        this.hiddenItems = [];
         allOptions.forEach(el => {
             if (!el.selected) {
+                this.hiddenItems.push(el.value);
                 el.hidden = this.showSelected;
             }
         });
@@ -411,6 +414,9 @@ let NileSelect = class NileSelect extends NileElement {
     handleOptionClick(event) {
         const target = event.target;
         const option = target.closest('nile-option');
+        if (this.hiddenItems.includes(option?.value)) {
+            return;
+        }
         if (this.blockValueChange && option) {
             this.emit('nile-block-change', { value: option?.value, name: this.name });
             this.hide();
@@ -590,10 +596,14 @@ let NileSelect = class NileSelect extends NileElement {
             if (this.selectedOptions.length === 0) {
                 this.showSelected = false;
                 const allOptions = this.getAllOptions();
+                this.hiddenItems = [];
                 allOptions.forEach(el => {
                     if (!el.selected) {
                         el.hidden = this.showSelected;
                     }
+                    else {
+                        this.hiddenItems.push(el.value);
+                    }
                 });
                 this.requestUpdate();
             }
@@ -692,6 +702,7 @@ let NileSelect = class NileSelect extends NileElement {
         else {
             // Hide
             this.emit('nile-hide', { value: this.value, name: this.name });
+            this.showSelected = false;
             this.searchValue = '';
             this.filterOptions(this.searchValue);
             this.removeOpenListeners();
@@ -1250,6 +1261,9 @@ __decorate([
 __decorate([
     property({ type: String })
 ], NileSelect.prototype, "noResultsMessage", void 0);
+__decorate([
+    state()
+], NileSelect.prototype, "hiddenItems", void 0);
 __decorate([
     watch('disabled', { waitUntilFirstUpdate: true })
 ], NileSelect.prototype, "handleDisabledChange", null);