@aquera/nile-elements 0.0.49 → 0.0.51

package/dist/nile-textarea/nile-textarea.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-textarea.cjs.js","sources":["../../../src/nile-textarea/nile-textarea.ts"],"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 } from 'lit/decorators.js';\nimport {styles} from './nile-textarea.css';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { query, state } from 'lit/decorators.js';\nimport { defaultValue } from '../internal/default-value';\nimport { FormControlController } from '../internal/form';\nimport { HasSlotController } from '../internal/slot';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { watch } from '../internal/watch';\nimport NileElement from '../internal/nile-element';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Textareas collect data from the user and allow multiple lines of text.\n * @tag nile-text-area\n\n *\n * @slot label - The textarea's label. Alternatively, you can use the `label` attribute.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event nile-blur - Emitted when the control loses focus.\n * @event nile-change - Emitted when an alteration to the control's value is committed by the user.\n * @event nile-focus - Emitted when the control gains focus.\n * @event nile-input - Emitted when the control receives input.\n *\n * @csspart form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The input's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart base - The component's base wrapper.\n * @csspart textarea - The internal `<textarea>` control.\n */\n\n@customElement('nile-textarea')\nexport class NileTextarea extends NileElement  {\n  static styles: CSSResultGroup = styles;\n\n  private readonly hasSlotController = new HasSlotController(this, 'help-text', 'label');\n  private resizeObserver: ResizeObserver;\n\n  @query('.textarea__control') input: HTMLTextAreaElement;\n\n  @state() private hasFocus = false;\n  @property() title = ''; // make reactive to pass through\n\n  /** The name of the textarea, submitted as a name/value pair with form data. */\n  @property() name = '';\n\n  /** The current value of the textarea, submitted as a name/value pair with form data. */\n  @property() value = '';\n\n  /** The textarea's size. */\n  @property({ reflect: true }) size = 'medium';\n\n  /** Draws a filled textarea. */\n  @property({ type: Boolean, reflect: true }) filled = false;\n\n  /** The textarea's label. If you need to display HTML, use the `label` slot instead. */\n  @property() label = '';\n\n  /** The textarea's help text. If you need to display HTML, use the `help-text` slot instead. */\n  @property({ attribute: 'help-text' }) helpText = '';\n\n  /** The input's error message. If you need to display HTML, use the `error-message` slot instead. */\n  @property({ attribute: 'error-message' }) errorMessage = '';\n\n  /** Placeholder text to show as a hint when the input is empty. */\n  @property() placeholder = '';\n\n  /** The number of rows to display by default. */\n  @property({ type: Number }) rows = 4;\n\n  /** Controls how the textarea can be resized. */\n  @property() resize: 'none' | 'vertical' | 'auto' = 'vertical';\n\n  /** Disables the textarea. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** Makes the textarea readonly. */\n  @property({ type: Boolean, reflect: true }) readonly = false;\n\n  /**\n   * By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\n   * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in\n   * the same document or shadow root for this to work.\n   */\n  @property({ reflect: true }) form = '';\n\n  /** Makes the textarea a required field. */\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  @property({ type: Number }) minlength: number;\n\n  @property({ type: Number }) maxlength: number;\n\n  /** Sets the input to a warning state, changing its visual appearance. */\n  @property({ type: Boolean }) warning = false;\n\n  /** Sets the input to an error state, changing its visual appearance. */\n  @property({ type: Boolean }) error = false;\n\n  /** Sets the input to a success state, changing its visual appearance. */\n  @property({ type: Boolean }) success = false;\n\n  /** Controls whether and how text input is automatically capitalized as it is entered by the user. */\n  @property() autocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';\n\n  /** Indicates whether the browser's autocorrect feature is on or off. */\n  @property() autocorrect: string;\n\n  /**\n   * Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n   * [this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.\n   */\n  @property() autocomplete: string;\n\n  /** Indicates that the input should receive focus on page load. */\n  @property({ type: Boolean }) autofocus: boolean;\n\n  /** Used to customize the label or icon of the Enter key on virtual keyboards. */\n  @property() enterkeyhint: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';\n\n  /** Enables spell checking on the textarea. */\n  @property({\n    type: Boolean,\n    converter: {\n      // Allow \"true|false\" attribute values but keep the property boolean\n      fromAttribute: value => (!value || value === 'false' ? false : true),\n      toAttribute: value => (value ? 'true' : 'false')\n    }\n  })\n  spellcheck = true;\n\n  /**\n   * Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\n   * keyboard on supportive devices.\n   */\n  @property() inputmode: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';\n\n  /** The default value of the form control. Primarily used for resetting the form control. */\n  @defaultValue() defaultValue = '';\n\n  @property({ type: Boolean, reflect: true }) fullHeight = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.resizeObserver = new ResizeObserver(() => this.setTextareaHeight());\n\n    this.updateComplete.then(() => {\n      this.setTextareaHeight();\n      this.resizeObserver.observe(this.input);\n    });\n\n\n    if(this.fullHeight){\n    requestAnimationFrame(() => {\n      let parentHeight = this.parentElement?.getBoundingClientRect().height;\n      if (parentHeight) {\n        parentHeight = parentHeight - 65;\n        if (parentHeight<12) {\n          parentHeight=12;\n        }\n        this.shadowRoot?.querySelector('textarea')?.style.setProperty('height', `${parentHeight}px`);\n      }\n    });\n    }\n\n    this.emit('nile-init');\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    if(this.input) {\n          this.resizeObserver.unobserve(this.input);\n    }\n    this.emit('nile-destroy');\n  }\n\n  private handleBlur() {\n    this.hasFocus = false;\n    this.emit('nile-blur', { value: this.value });\n  }\n\n  private handleChange() {\n    this.value = this.input.value;\n    this.setTextareaHeight();\n    this.emit('nile-change', { value: this.value });\n  }\n\n  private handleFocus() {\n    this.hasFocus = true;\n    this.emit('nile-focus', { value: this.value });\n  }\n\n  private handleInput() {\n    this.value = this.input.value;\n    this.emit('nile-input', { value: this.value });\n  }\n\n  private setTextareaHeight() {\n    if (this.resize === 'auto') {\n      this.input.style.height = 'auto';\n      this.input.style.height = `${this.input.scrollHeight}px`;\n    } else {\n      (this.input.style.height as string | undefined) = undefined;\n    }\n  }\n\n  @watch('rows', { waitUntilFirstUpdate: true })\n  handleRowsChange() {\n    this.setTextareaHeight();\n  }\n\n  @watch('value', { waitUntilFirstUpdate: true })\n  async handleValueChange() {\n    await this.updateComplete;\n    this.setTextareaHeight();\n  }\n\n  /** Sets focus on the textarea. */\n  focus(options?: FocusOptions) {\n    this.input.focus(options);\n  }\n\n  /** Removes focus from the textarea. */\n  blur() {\n    this.input.blur();\n  }\n\n  /** Selects all the text in the textarea. */\n  select() {\n    this.input.select();\n  }\n\n  /** Gets or sets the textarea's scroll position. */\n  scrollPosition(position?: { top?: number; left?: number }): { top: number; left: number } | undefined {\n    if (position) {\n      if (typeof position.top === 'number') this.input.scrollTop = position.top;\n      if (typeof position.left === 'number') this.input.scrollLeft = position.left;\n      return undefined;\n    }\n\n    return {\n      top: this.input.scrollTop,\n      left: this.input.scrollTop\n    };\n  }\n\n  /** Sets the start and end positions of the text selection (0-based). */\n  setSelectionRange(\n    selectionStart: number,\n    selectionEnd: number,\n    selectionDirection: 'forward' | 'backward' | 'none' = 'none'\n  ) {\n    this.input.setSelectionRange(selectionStart, selectionEnd, selectionDirection);\n  }\n\n  /** Replaces a range of text with a new string. */\n  setRangeText(\n    replacement: string,\n    start?: number,\n    end?: number,\n    selectMode?: 'select' | 'start' | 'end' | 'preserve'\n  ) {\n    // @ts-expect-error - start, end, and selectMode are optional\n    this.input.setRangeText(replacement, start, end, selectMode);\n\n    if (this.value !== this.input.value) {\n      this.value = this.input.value;\n    }\n\n    if (this.value !== this.input.value) {\n      this.value = this.input.value;\n      this.setTextareaHeight();\n    }\n  }\n\n  render() {\n    const hasLabelSlot = this.hasSlotController.test('label');\n    const hasHelpTextSlot = this.hasSlotController.test('help-text');\n    const hasLabel = this.label ? true : !!hasLabelSlot;\n\n    const hasHelpText = this.helpText ? true : false;\n    const hasErrorMessage = this.errorMessage ? true : false;\n\n    return html`\n      <div\n        part=\"form-control\"\n        class=${classMap({\n          'form-control': true,\n          'form-control--medium': this.size === 'medium',\n          'form-control--has-label': hasLabel,\n          'form-control--has-help-text': hasHelpText\n        })}\n      >\n        <label\n          part=\"form-control-label\"\n          class=\"form-control__label\"\n          for=\"input\"\n          aria-hidden=${hasLabel ? 'false' : 'true'}\n        >\n          <slot name=\"label\">${this.label}</slot>\n        </label>\n\n        <div part=\"form-control-input\" class=\"form-control-input\">\n          <div\n            part=\"base\"\n            class=${classMap({\n              textarea: true,\n              'textarea--medium': this.size === 'medium',\n              'textarea--warning': this.warning,\n              'textarea--error': this.error,\n              'textarea--success': this.success,\n              'textarea--standard': !this.filled,\n              'textarea--disabled': this.disabled,\n              'textarea--focused': this.hasFocus,\n              'textarea--empty': !this.value,\n              'textarea--resize-none': this.resize === 'none',\n              'textarea--resize-vertical': this.resize === 'vertical',\n              'textarea--resize-auto': this.resize === 'auto'\n            })}\n          >\n            <textarea\n              part=\"textarea\"\n              id=\"input\"\n              class=\"textarea__control\"\n              title=${this.title /* An empty title prevents browser validation tooltips from appearing on hover */}\n              name=${ifDefined(this.name)}\n              .value=${live(this.value)}\n              ?disabled=${this.disabled}\n              ?readonly=${this.readonly}\n              ?required=${this.required}\n              placeholder=${ifDefined(this.placeholder)}\n              rows=${ifDefined(this.rows)}\n              minlength=${ifDefined(this.minlength)}\n              maxlength=${ifDefined(this.maxlength)}\n              autocapitalize=${ifDefined(this.autocapitalize)}\n              autocorrect=${ifDefined(this.autocorrect)}\n              ?autofocus=${this.autofocus}\n              spellcheck=${ifDefined(this.spellcheck)}\n              enterkeyhint=${ifDefined(this.enterkeyhint)}\n              inputmode=${ifDefined(this.inputmode)}\n              aria-describedby=\"help-text\"\n              @change=${this.handleChange}\n              @input=${this.handleInput}\n              @focus=${this.handleFocus}\n              @blur=${this.handleBlur}\n\n              \n            ></textarea>\n          </div>\n        </div>\n\n        ${\n          hasHelpText\n            ? html`\n                <nile-form-help-text>${this.helpText}</nile-form-help-text>\n              `\n            : ``\n        }\n\n        ${\n          hasErrorMessage\n            ? html`\n                <nile-form-error-message\n                  >${this.errorMessage}</nile-form-error-message\n                >\n              `\n            : ``\n        }\n      </div>\n    `;\n  }\n}\n\nexport default NileTextarea;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-textarea': NileTextarea;\n  }\n}\n"],"names":["NileTextarea","p","this","hasSlotController","HasSlotController","hasFocus","title","name","value","size","filled","label","helpText","errorMessage","placeholder","rows","resize","disabled","readonly","form","required","warning","error","success","spellcheck","defaultValue","fullHeight","_this","_createClass","key","connectedCallback","super","resizeObserver","ResizeObserver","setTextareaHeight","updateComplete","then","observe","input","requestAnimationFrame","parentHeight","parentElement","getBoundingClientRect","height","shadowRoot","querySelector","style","setProperty","concat","emit","disconnectedCallback","unobserve","handleBlur","handleChange","handleFocus","handleInput","scrollHeight","undefined","handleRowsChange","_handleValueChange","_asyncToGenerator","_regeneratorRuntime","mark","_callee","wrap","_callee$","_context2","prev","next","stop","handleValueChange","apply","arguments","focus","options","blur","select","scrollPosition","position","top","scrollTop","left","scrollLeft","setSelectionRange","selectionStart","selectionEnd","selectionDirection","length","setRangeText","replacement","start","end","selectMode","render","hasLabelSlot","test","hasLabel","hasHelpText","hasErrorMessage","html","_templateObject","_taggedTemplateLiteral","classMap","textarea","ifDefined","live","minlength","maxlength","autocapitalize","autocorrect","autofocus","enterkeyhint","inputmode","_templateObject2","_templateObject3","NileElement","styles","__decorate","query","prototype","state","property","reflect","type","Boolean","attribute","Number","converter","fromAttribute","toAttribute","watch","waitUntilFirstUpdate","customElement"],"mappings":"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"}
+{"version":3,"file":"nile-textarea.cjs.js","sources":["../../../src/nile-textarea/nile-textarea.ts"],"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 } from 'lit/decorators.js';\nimport {styles} from './nile-textarea.css';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { query, state } from 'lit/decorators.js';\nimport { defaultValue } from '../internal/default-value';\nimport { FormControlController } from '../internal/form';\nimport { HasSlotController } from '../internal/slot';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { watch } from '../internal/watch';\nimport NileElement from '../internal/nile-element';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Textareas collect data from the user and allow multiple lines of text.\n * @tag nile-text-area\n\n *\n * @slot label - The textarea's label. Alternatively, you can use the `label` attribute.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event nile-blur - Emitted when the control loses focus.\n * @event nile-change - Emitted when an alteration to the control's value is committed by the user.\n * @event nile-focus - Emitted when the control gains focus.\n * @event nile-input - Emitted when the control receives input.\n *\n * @csspart form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The input's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart base - The component's base wrapper.\n * @csspart textarea - The internal `<textarea>` control.\n */\n\n@customElement('nile-textarea')\nexport class NileTextarea extends NileElement  {\n  static styles: CSSResultGroup = styles;\n\n  private readonly hasSlotController = new HasSlotController(this, 'help-text', 'label');\n  private resizeObserver: ResizeObserver;\n\n  @query('.textarea__control') input: HTMLTextAreaElement;\n\n  @state() private hasFocus = false;\n  @property() title = ''; // make reactive to pass through\n\n  /** The name of the textarea, submitted as a name/value pair with form data. */\n  @property() name = '';\n\n  /** The current value of the textarea, submitted as a name/value pair with form data. */\n  @property() value = '';\n\n  /** The textarea's size. */\n  @property({ reflect: true }) size = 'medium';\n\n  /** Draws a filled textarea. */\n  @property({ type: Boolean, reflect: true }) filled = false;\n\n  /** The textarea's label. If you need to display HTML, use the `label` slot instead. */\n  @property() label = '';\n\n  /** The textarea's help text. If you need to display HTML, use the `help-text` slot instead. */\n  @property({ attribute: 'help-text' }) helpText = '';\n\n  /** The input's error message. If you need to display HTML, use the `error-message` slot instead. */\n  @property({ attribute: 'error-message' }) errorMessage = '';\n\n  /** Placeholder text to show as a hint when the input is empty. */\n  @property() placeholder = '';\n\n  /** The number of rows to display by default. */\n  @property({ type: Number }) rows = 4;\n\n  /** Controls how the textarea can be resized. */\n  @property() resize: 'none' | 'vertical' | 'auto' = 'vertical';\n\n  /** Disables the textarea. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** Makes the textarea readonly. */\n  @property({ type: Boolean, reflect: true }) readonly = false;\n\n  /**\n   * By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\n   * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in\n   * the same document or shadow root for this to work.\n   */\n  @property({ reflect: true }) form = '';\n\n  /** Makes the textarea a required field. */\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  @property({ type: Number }) minlength: number;\n\n  @property({ type: Number }) maxlength: number;\n\n  /** Sets the input to a warning state, changing its visual appearance. */\n  @property({ type: Boolean }) warning = false;\n\n  /** Sets the input to an error state, changing its visual appearance. */\n  @property({ type: Boolean }) error = false;\n\n  /** Sets the input to a success state, changing its visual appearance. */\n  @property({ type: Boolean }) success = false;\n\n   /** Sets the input to a destructive state, changing its visual appearance. */\n   @property({ type: Boolean }) destructive = false;\n\n  /** Controls whether and how text input is automatically capitalized as it is entered by the user. */\n  @property() autocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';\n\n  /** Indicates whether the browser's autocorrect feature is on or off. */\n  @property() autocorrect: string;\n\n  /**\n   * Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n   * [this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.\n   */\n  @property() autocomplete: string;\n\n  /** Indicates that the input should receive focus on page load. */\n  @property({ type: Boolean }) autofocus: boolean;\n\n  /** Used to customize the label or icon of the Enter key on virtual keyboards. */\n  @property() enterkeyhint: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';\n\n  /** Enables spell checking on the textarea. */\n  @property({\n    type: Boolean,\n    converter: {\n      // Allow \"true|false\" attribute values but keep the property boolean\n      fromAttribute: value => (!value || value === 'false' ? false : true),\n      toAttribute: value => (value ? 'true' : 'false')\n    }\n  })\n  spellcheck = true;\n\n  /**\n   * Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\n   * keyboard on supportive devices.\n   */\n  @property() inputmode: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';\n\n  /** The default value of the form control. Primarily used for resetting the form control. */\n  @defaultValue() defaultValue = '';\n\n  @property({ type: Boolean, reflect: true }) fullHeight = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.resizeObserver = new ResizeObserver(() => this.setTextareaHeight());\n\n    this.updateComplete.then(() => {\n      this.setTextareaHeight();\n      this.resizeObserver.observe(this.input);\n    });\n\n\n    if(this.fullHeight){\n    requestAnimationFrame(() => {\n      let parentHeight = this.parentElement?.getBoundingClientRect().height;\n      if (parentHeight) {\n        parentHeight = parentHeight - 65;\n        if (parentHeight<12) {\n          parentHeight=12;\n        }\n        this.shadowRoot?.querySelector('textarea')?.style.setProperty('height', `${parentHeight}px`);\n      }\n    });\n    }\n\n    this.emit('nile-init');\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    if(this.input) {\n          this.resizeObserver.unobserve(this.input);\n    }\n    this.emit('nile-destroy');\n  }\n\n  private handleBlur() {\n    this.hasFocus = false;\n    this.emit('nile-blur', { value: this.value });\n  }\n\n  private handleChange() {\n    this.value = this.input.value;\n    this.setTextareaHeight();\n    this.emit('nile-change', { value: this.value });\n  }\n\n  private handleFocus() {\n    this.hasFocus = true;\n    this.emit('nile-focus', { value: this.value });\n  }\n\n  private handleInput() {\n    this.value = this.input.value;\n    this.emit('nile-input', { value: this.value });\n  }\n\n  private setTextareaHeight() {\n    if (this.resize === 'auto') {\n      this.input.style.height = 'auto';\n      this.input.style.height = `${this.input.scrollHeight}px`;\n    } else {\n      (this.input.style.height as string | undefined) = undefined;\n    }\n  }\n\n  @watch('rows', { waitUntilFirstUpdate: true })\n  handleRowsChange() {\n    this.setTextareaHeight();\n  }\n\n  @watch('value', { waitUntilFirstUpdate: true })\n  async handleValueChange() {\n    await this.updateComplete;\n    this.setTextareaHeight();\n  }\n\n  /** Sets focus on the textarea. */\n  focus(options?: FocusOptions) {\n    this.input.focus(options);\n  }\n\n  /** Removes focus from the textarea. */\n  blur() {\n    this.input.blur();\n  }\n\n  /** Selects all the text in the textarea. */\n  select() {\n    this.input.select();\n  }\n\n  /** Gets or sets the textarea's scroll position. */\n  scrollPosition(position?: { top?: number; left?: number }): { top: number; left: number } | undefined {\n    if (position) {\n      if (typeof position.top === 'number') this.input.scrollTop = position.top;\n      if (typeof position.left === 'number') this.input.scrollLeft = position.left;\n      return undefined;\n    }\n\n    return {\n      top: this.input.scrollTop,\n      left: this.input.scrollTop\n    };\n  }\n\n  /** Sets the start and end positions of the text selection (0-based). */\n  setSelectionRange(\n    selectionStart: number,\n    selectionEnd: number,\n    selectionDirection: 'forward' | 'backward' | 'none' = 'none'\n  ) {\n    this.input.setSelectionRange(selectionStart, selectionEnd, selectionDirection);\n  }\n\n  /** Replaces a range of text with a new string. */\n  setRangeText(\n    replacement: string,\n    start?: number,\n    end?: number,\n    selectMode?: 'select' | 'start' | 'end' | 'preserve'\n  ) {\n    // @ts-expect-error - start, end, and selectMode are optional\n    this.input.setRangeText(replacement, start, end, selectMode);\n\n    if (this.value !== this.input.value) {\n      this.value = this.input.value;\n    }\n\n    if (this.value !== this.input.value) {\n      this.value = this.input.value;\n      this.setTextareaHeight();\n    }\n  }\n\n  render() {\n    const hasLabelSlot = this.hasSlotController.test('label');\n    const hasHelpTextSlot = this.hasSlotController.test('help-text');\n    const hasLabel = this.label ? true : !!hasLabelSlot;\n\n    const hasHelpText = this.helpText ? true : false;\n    const hasErrorMessage = this.errorMessage ? true : false;\n\n    return html`\n      <div\n        part=\"form-control\"\n        class=${classMap({\n          'form-control': true,\n          'form-control--medium': this.size === 'medium',\n          'form-control--has-label': hasLabel,\n          'form-control--has-help-text': hasHelpText\n        })}\n      >\n        <label\n          part=\"form-control-label\"\n          class=\"form-control__label\"\n          for=\"input\"\n          aria-hidden=${hasLabel ? 'false' : 'true'}\n        >\n          <slot name=\"label\">${this.label}</slot>\n        </label>\n\n        <div part=\"form-control-input\" class=\"form-control-input\">\n          <div\n            part=\"base\"\n            class=${classMap({\n              textarea: true,\n              'textarea--medium': this.size === 'medium',\n              'textarea--warning': this.warning,\n              'textarea--error': this.error,\n              'textarea--success': this.success,\n              'textarea--destructive': this.destructive,\n              'textarea--standard': !this.filled,\n              'textarea--disabled': this.disabled,\n              'textarea--focused': this.hasFocus,\n              'textarea--empty': !this.value,\n              'textarea--resize-none': this.resize === 'none',\n              'textarea--resize-vertical': this.resize === 'vertical',\n              'textarea--resize-auto': this.resize === 'auto'\n            })}\n          >\n            <textarea\n              part=\"textarea\"\n              id=\"input\"\n              class=\"textarea__control\"\n              title=${this.title /* An empty title prevents browser validation tooltips from appearing on hover */}\n              name=${ifDefined(this.name)}\n              .value=${live(this.value)}\n              ?disabled=${this.disabled}\n              ?readonly=${this.readonly}\n              ?required=${this.required}\n              placeholder=${ifDefined(this.placeholder)}\n              rows=${ifDefined(this.rows)}\n              minlength=${ifDefined(this.minlength)}\n              maxlength=${ifDefined(this.maxlength)}\n              autocapitalize=${ifDefined(this.autocapitalize)}\n              autocorrect=${ifDefined(this.autocorrect)}\n              ?autofocus=${this.autofocus}\n              spellcheck=${ifDefined(this.spellcheck)}\n              enterkeyhint=${ifDefined(this.enterkeyhint)}\n              inputmode=${ifDefined(this.inputmode)}\n              aria-describedby=\"help-text\"\n              @change=${this.handleChange}\n              @input=${this.handleInput}\n              @focus=${this.handleFocus}\n              @blur=${this.handleBlur}\n\n              \n            ></textarea>\n          </div>\n        </div>\n\n        ${\n          hasHelpText\n            ? html`\n                <nile-form-help-text>${this.helpText}</nile-form-help-text>\n              `\n            : ``\n        }\n\n        ${\n          hasErrorMessage\n            ? html`\n                <nile-form-error-message\n                  >${this.errorMessage}</nile-form-error-message\n                >\n              `\n            : ``\n        }\n      </div>\n    `;\n  }\n}\n\nexport default NileTextarea;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-textarea': NileTextarea;\n  }\n}\n"],"names":["NileTextarea","_u","_inherits","p","_super","_createSuper","constructor","this","hasSlotController","HasSlotController","hasFocus","title","name","value","size","filled","label","helpText","errorMessage","placeholder","rows","resize","disabled","readonly","form","required","warning","error","success","destructive","spellcheck","defaultValue","fullHeight","_this","_createClass","key","connectedCallback","super","resizeObserver","ResizeObserver","setTextareaHeight","updateComplete","then","observe","input","requestAnimationFrame","_this2$parentElement","_this2$shadowRoot","parentHeight","parentElement","getBoundingClientRect","height","shadowRoot","querySelector","style","setProperty","emit","disconnectedCallback","unobserve","handleBlur","handleChange","handleFocus","handleInput","scrollHeight","undefined","handleRowsChange","_handleValueChange","_asyncToGenerator","_regeneratorRuntime","mark","_callee","wrap","_callee$","_context2","prev","next","stop","handleValueChange","apply","arguments","focus","options","blur","select","scrollPosition","position","top","scrollTop","left","scrollLeft","setSelectionRange","selectionStart","selectionEnd","selectionDirection","setRangeText","replacement","start","end","selectMode","render","hasLabelSlot","test","hasLabel","hasHelpText","hasErrorMessage","html","_templateObject","_taggedTemplateLiteral","classMap","textarea","ifDefined","live","minlength","maxlength","autocapitalize","autocorrect","autofocus","enterkeyhint","inputmode","_templateObject2","_templateObject3","NileElement","styles","__decorate","query","prototype","state","property","reflect","type","Boolean","attribute","Number","converter","fromAttribute","toAttribute","watch","waitUntilFirstUpdate","customElement"],"mappings":"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"}

package/dist/nile-textarea/nile-textarea.css.cjs.js

@@ -1,2 +1,2 @@
-System.register(["../index-cd83c5c8.cjs.js"],function(_export,_context){"use strict";var e,_templateObject,r;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}return{setters:[function(_index001CjsJs){e=_index001CjsJs.i;}],execute:function(){_export("s",r=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  .form-control .form-control__label {\n    display: none;\n  }\n\n  .form-control .form-control__help-text {\n    display: none;\n  }\n\n  /* Label */\n  .form-control--has-label .form-control__label {\n    display: inline-block;\n    margin-bottom: 12px;\n    color: var(--nile-colors-dark-900);\n    font-family:var(--nile-font-family-serif);\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 14px;\n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-label.form-control--medium .form-control__label {\n    font-size: var(--nile-font-size-base);\n  }\n\n  :host([required]) .form-control--has-label .form-control__label::after {\n    content: '*';\n    margin-inline-start: -2px;\n    color: #A4121C;\n  }\n\n  /* Help text */\n  .form-control--has-help-text .form-control__help-text {\n    display: block;\n    color: var(--nile-colors-dark-500);\n    margin-top: 6px;\n  }\n\n  /* Error message */\n  .form-control__error-message {\n    display: block;\n    color: var(--nile-colors-red-700);\n    margin-top: 12px;\n    font-size: 12px;\n    font-style: normal;\n    line-height: 12px;\n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-help-text.form-control--medium .form-control__help-text {\n    font-size: 10.24px;\n  }\n\n  /* Host styles */\n  :host {\n    display: block;\n  }\n\n  /* Textarea styles */\n  .textarea {\n    display: flex;\n    align-items: center;\n    position: relative;\n    width: 100%;\n    letter-spacing: 0.5px;\n    vertical-align: middle;\n    border-radius: var(--nile-radius-base-standard);\n    transition: 0.3s color, 0.3s border, 0.3s box-shadow, 0.3s background-color;\n    cursor: text;\n    min-height:12px;\n  }\n\n  /* Standard textareas */\n  .textarea--standard {\n    background-color: var(\n      --nile-colors-white-base\n    );\n    border: solid 1px var(--nile-colors-neutral-500);\n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) {\n    background-color: var(\n      --nile-colors-white-base\n    );\n    border-color: var(\n      --nile-colors-dark-900\n    );\n    border-radius: var(--nile-radius-base-standard);\n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) .textarea__control {\n    border-color: var(--nile-colors-dark-900);\n    border-radius: var(--nile-radius-base-standard);\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled) {\n    background-color: var(\n      --nile-colors-white-base\n    );\n    border-color: var(\n      --nile-colors-primary-600\n    );\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled)\n    .textarea__control {\n      color: #000000;\n  }\n\n  .textarea--standard.textarea--disabled {\n    border-color: var(\n      --nile-colors-neutral-500\n    );\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .textarea--standard.textarea--disabled .textarea__control {\n    color: var(\n      --nile-colors-neutral-500\n    );\n  }\n\n  .textarea--standard.textarea--disabled .textarea__control::placeholder {\n    color: var(\n      --nile-colors-neutral-500\n    );\n  }\n\n  /* Textarea control styles */\n  .textarea__control {\n    flex: 1 1 auto;\n    font-family: Colfax-regular;\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 14px; /* 100% */\n    letter-spacing: 0.2px;\n    color: var(--nile-colors-dark-900);\n    border: none;\n    background: none;\n    box-shadow: none;\n    cursor: inherit;\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::-webkit-search-decoration,\n  .textarea__control::-webkit-search-cancel-button,\n  .textarea__control::-webkit-search-results-button,\n  .textarea__control::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::placeholder {\n    color: var(\n      --nile-colors-dark-500\n    );\n    user-select: none;\n  }\n\n  .textarea__control:focus {\n    outline: none;\n  }\n\n  .textarea--medium .textarea__control {\n    padding: 0.5em 10px;\n  }\n\n  /* Resize types */\n  .textarea--resize-none .textarea__control {\n    resize: none;\n    min-height:12px;\n  }\n\n  .textarea--resize-vertical .textarea__control {\n    resize: vertical;\n    min-height:12px;\n  }\n\n  .textarea--resize-auto .textarea__control {\n    resize: none;\n    overflow-y: hidden;\n    min-height:12px;\n  }\n\n  .textarea--standard.textarea--warning {\n    border-color: var(--nile-colors-yellow-500);\n  }\n\n  .textarea--standard.textarea--error {\n    border-color: var(--nile-colors-red-500);\n  }\n\n  .textarea--standard.textarea--success {\n    border-color: var(--nile-colors-green-500);\n  }\n"]))));}};});
+System.register(["../index-cd83c5c8.cjs.js"],function(_export,_context){"use strict";var e,_templateObject,r;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}return{setters:[function(_index001CjsJs){e=_index001CjsJs.i;}],execute:function(){_export("s",r=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  .form-control .form-control__label {\n    display: none;\n  }\n\n  .form-control .form-control__help-text {\n    display: none;\n  }\n\n  /* Label */\n  .form-control--has-label .form-control__label {\n    display: inline-block;\n    margin-bottom: 12px;\n    color: var(--nile-textarea-label-color);\n    font-family: var(--nile-font-family-serif);\n    font-size: 14px;\n    font-style: normal;\n    font-weight: var(--nile-textarea-label-font-weight); \n    line-height: var(--nile-textarea-label-line-height); \n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-label.form-control--medium .form-control__label {\n    font-size: var(--nile-font-size-base);\n  }\n\n  :host([required]) .form-control--has-label .form-control__label::after {\n    content: '*';\n    margin-inline-start: -2px;\n    color: #a4121c;\n  }\n\n  /* Help text */\n  .form-control--has-help-text .form-control__help-text {\n    display: block;\n    color: var(--nile-colors-dark-500);\n    margin-top: 6px;\n  }\n\n  /* Error message */\n  .form-control__error-message {\n    display: block;\n    color: var(--nile-colors-red-700);\n    margin-top: 12px;\n    font-size: 12px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 12px;\n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-help-text.form-control--medium .form-control__help-text {\n    font-size: 10.24px;\n  }\n\n  /* Host styles */\n  :host {\n    display: block;\n  }\n\n  /* Textarea styles */\n  .textarea {\n    display: flex;\n    align-items: center;\n    position: relative;\n    width: 100%;\n    letter-spacing: 0.5px;\n    vertical-align: middle;\n    border-radius: var(--nile-radius-base-standard);\n    transition: 0.3s color, 0.3s border, 0.3s box-shadow, 0.3s background-color;\n    cursor: text;\n    min-height: 12px;\n  }\n\n  /* Standard textareas */\n  .textarea--standard {\n    background-color: var(--nile-colors-white-base);\n    border: 1px solid var(--nile-textarea-standard-border-color); \n    box-shadow:var(--nile-textarea-standard-box-shadow); \n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) {\n    background-color: var(--nile-colors-white-base);\n    border-color: var(--nile-textarea-standard-hover-border-color); \n    border-radius: var(--nile-radius-base-standard);\n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) .textarea__control {\n    border-color: var(--nile-colors-dark-900);\n    border-radius: var(--nile-radius-base-standard);\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled) {\n    background-color: var(--nile-colors-white-base);\n    border-color: var(--nile-textarea-standard-focused-border-color); \n    box-shadow:var(--nile-textarea-standard-focused-box-shadow);\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled)\n    .textarea__control {\n    color: #000000;\n  }\n\n  .textarea--standard.textarea--disabled {\n    border-color: var(--nile-textarea-standard-disabled-border-color); \n    background: var(--nile-textarea-standard-disabled-background-color);\n    opacity: 0.5;\n    cursor: not-allowed;\n    box-shadow:var(--nile-textarea-standard-disabled-box-shadow); \n  }\n\n  .textarea--standard.textarea--disabled .textarea__control {\n    color: var(--nile-colors-neutral-500);\n  }\n\n  .textarea--standard.textarea--disabled .textarea__control::placeholder {\n    color: var(--nile-colors-neutral-500);\n  }\n\n  /* Textarea control styles */\n  .textarea__control {\n    flex: 1 1 auto;\n    font-family: Colfax-regular;\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 14px; /* 100% */\n    letter-spacing: 0.2px;\n    color: var(--nile-colors-dark-900);\n    border: none;\n    background: none;\n    box-shadow: none;\n    cursor: inherit;\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::-webkit-search-decoration,\n  .textarea__control::-webkit-search-cancel-button,\n  .textarea__control::-webkit-search-results-button,\n  .textarea__control::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::placeholder {\n    color: var(--nile-colors-dark-500);\n    user-select: none;\n  }\n\n  .textarea__control:focus {\n    outline: none;\n  }\n\n  .textarea--medium .textarea__control {\n    padding:var(--nile-textarea-padding);\n  }\n\n  /* Resize types */\n  .textarea--resize-none .textarea__control {\n    resize: none;\n    min-height: 12px;\n  }\n\n  .textarea--resize-vertical .textarea__control {\n    resize: vertical;\n    min-height: 12px;\n  }\n\n  .textarea--resize-auto .textarea__control {\n    resize: none;\n    overflow-y: hidden;\n    min-height: 12px;\n  }\n\n  .textarea--standard.textarea--warning {\n    border-color: var(--nile-colors-yellow-500);\n  }\n\n  .textarea--standard.textarea--error {\n    border-color: var(--nile-colors-red-500);\n  }\n\n  .textarea--standard.textarea--success {\n    border-color: var(--nile-colors-green-500);\n  }\n\n  .textarea--standard.textarea--destructive {\n    border-color: #fda29b;\n    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n  }\n\n  .textarea--standard.textarea--destructive.textarea--focused {\n    border-color: #fda29b;\n    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n      0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n  }\n"]))));}};});
 //# sourceMappingURL=nile-textarea.css.cjs.js.map

package/dist/nile-textarea/nile-textarea.css.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-textarea.css.cjs.js","sources":["../../../src/nile-textarea/nile-textarea.css.ts"],"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 * TextArea CSS\n */\nexport const styles = css`\n  .form-control .form-control__label {\n    display: none;\n  }\n\n  .form-control .form-control__help-text {\n    display: none;\n  }\n\n  /* Label */\n  .form-control--has-label .form-control__label {\n    display: inline-block;\n    margin-bottom: 12px;\n    color: var(--nile-colors-dark-900);\n    font-family:var(--nile-font-family-serif);\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 14px;\n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-label.form-control--medium .form-control__label {\n    font-size: var(--nile-font-size-base);\n  }\n\n  :host([required]) .form-control--has-label .form-control__label::after {\n    content: '*';\n    margin-inline-start: -2px;\n    color: #A4121C;\n  }\n\n  /* Help text */\n  .form-control--has-help-text .form-control__help-text {\n    display: block;\n    color: var(--nile-colors-dark-500);\n    margin-top: 6px;\n  }\n\n  /* Error message */\n  .form-control__error-message {\n    display: block;\n    color: var(--nile-colors-red-700);\n    margin-top: 12px;\n    font-size: 12px;\n    font-style: normal;\n    line-height: 12px;\n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-help-text.form-control--medium .form-control__help-text {\n    font-size: 10.24px;\n  }\n\n  /* Host styles */\n  :host {\n    display: block;\n  }\n\n  /* Textarea styles */\n  .textarea {\n    display: flex;\n    align-items: center;\n    position: relative;\n    width: 100%;\n    letter-spacing: 0.5px;\n    vertical-align: middle;\n    border-radius: var(--nile-radius-base-standard);\n    transition: 0.3s color, 0.3s border, 0.3s box-shadow, 0.3s background-color;\n    cursor: text;\n    min-height:12px;\n  }\n\n  /* Standard textareas */\n  .textarea--standard {\n    background-color: var(\n      --nile-colors-white-base\n    );\n    border: solid 1px var(--nile-colors-neutral-500);\n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) {\n    background-color: var(\n      --nile-colors-white-base\n    );\n    border-color: var(\n      --nile-colors-dark-900\n    );\n    border-radius: var(--nile-radius-base-standard);\n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) .textarea__control {\n    border-color: var(--nile-colors-dark-900);\n    border-radius: var(--nile-radius-base-standard);\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled) {\n    background-color: var(\n      --nile-colors-white-base\n    );\n    border-color: var(\n      --nile-colors-primary-600\n    );\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled)\n    .textarea__control {\n      color: #000000;\n  }\n\n  .textarea--standard.textarea--disabled {\n    border-color: var(\n      --nile-colors-neutral-500\n    );\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .textarea--standard.textarea--disabled .textarea__control {\n    color: var(\n      --nile-colors-neutral-500\n    );\n  }\n\n  .textarea--standard.textarea--disabled .textarea__control::placeholder {\n    color: var(\n      --nile-colors-neutral-500\n    );\n  }\n\n  /* Textarea control styles */\n  .textarea__control {\n    flex: 1 1 auto;\n    font-family: Colfax-regular;\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 14px; /* 100% */\n    letter-spacing: 0.2px;\n    color: var(--nile-colors-dark-900);\n    border: none;\n    background: none;\n    box-shadow: none;\n    cursor: inherit;\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::-webkit-search-decoration,\n  .textarea__control::-webkit-search-cancel-button,\n  .textarea__control::-webkit-search-results-button,\n  .textarea__control::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::placeholder {\n    color: var(\n      --nile-colors-dark-500\n    );\n    user-select: none;\n  }\n\n  .textarea__control:focus {\n    outline: none;\n  }\n\n  .textarea--medium .textarea__control {\n    padding: 0.5em 10px;\n  }\n\n  /* Resize types */\n  .textarea--resize-none .textarea__control {\n    resize: none;\n    min-height:12px;\n  }\n\n  .textarea--resize-vertical .textarea__control {\n    resize: vertical;\n    min-height:12px;\n  }\n\n  .textarea--resize-auto .textarea__control {\n    resize: none;\n    overflow-y: hidden;\n    min-height:12px;\n  }\n\n  .textarea--standard.textarea--warning {\n    border-color: var(--nile-colors-yellow-500);\n  }\n\n  .textarea--standard.textarea--error {\n    border-color: var(--nile-colors-red-500);\n  }\n\n  .textarea--standard.textarea--success {\n    border-color: var(--nile-colors-green-500);\n  }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"gXAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
+{"version":3,"file":"nile-textarea.css.cjs.js","sources":["../../../src/nile-textarea/nile-textarea.css.ts"],"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 * TextArea CSS\n */\nexport const styles = css`\n  .form-control .form-control__label {\n    display: none;\n  }\n\n  .form-control .form-control__help-text {\n    display: none;\n  }\n\n  /* Label */\n  .form-control--has-label .form-control__label {\n    display: inline-block;\n    margin-bottom: 12px;\n    color: var(--nile-textarea-label-color);\n    font-family: var(--nile-font-family-serif);\n    font-size: 14px;\n    font-style: normal;\n    font-weight: var(--nile-textarea-label-font-weight); \n    line-height: var(--nile-textarea-label-line-height); \n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-label.form-control--medium .form-control__label {\n    font-size: var(--nile-font-size-base);\n  }\n\n  :host([required]) .form-control--has-label .form-control__label::after {\n    content: '*';\n    margin-inline-start: -2px;\n    color: #a4121c;\n  }\n\n  /* Help text */\n  .form-control--has-help-text .form-control__help-text {\n    display: block;\n    color: var(--nile-colors-dark-500);\n    margin-top: 6px;\n  }\n\n  /* Error message */\n  .form-control__error-message {\n    display: block;\n    color: var(--nile-colors-red-700);\n    margin-top: 12px;\n    font-size: 12px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 12px;\n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-help-text.form-control--medium .form-control__help-text {\n    font-size: 10.24px;\n  }\n\n  /* Host styles */\n  :host {\n    display: block;\n  }\n\n  /* Textarea styles */\n  .textarea {\n    display: flex;\n    align-items: center;\n    position: relative;\n    width: 100%;\n    letter-spacing: 0.5px;\n    vertical-align: middle;\n    border-radius: var(--nile-radius-base-standard);\n    transition: 0.3s color, 0.3s border, 0.3s box-shadow, 0.3s background-color;\n    cursor: text;\n    min-height: 12px;\n  }\n\n  /* Standard textareas */\n  .textarea--standard {\n    background-color: var(--nile-colors-white-base);\n    border: 1px solid var(--nile-textarea-standard-border-color); \n    box-shadow:var(--nile-textarea-standard-box-shadow); \n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) {\n    background-color: var(--nile-colors-white-base);\n    border-color: var(--nile-textarea-standard-hover-border-color); \n    border-radius: var(--nile-radius-base-standard);\n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) .textarea__control {\n    border-color: var(--nile-colors-dark-900);\n    border-radius: var(--nile-radius-base-standard);\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled) {\n    background-color: var(--nile-colors-white-base);\n    border-color: var(--nile-textarea-standard-focused-border-color); \n    box-shadow:var(--nile-textarea-standard-focused-box-shadow);\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled)\n    .textarea__control {\n    color: #000000;\n  }\n\n  .textarea--standard.textarea--disabled {\n    border-color: var(--nile-textarea-standard-disabled-border-color); \n    background: var(--nile-textarea-standard-disabled-background-color);\n    opacity: 0.5;\n    cursor: not-allowed;\n    box-shadow:var(--nile-textarea-standard-disabled-box-shadow); \n  }\n\n  .textarea--standard.textarea--disabled .textarea__control {\n    color: var(--nile-colors-neutral-500);\n  }\n\n  .textarea--standard.textarea--disabled .textarea__control::placeholder {\n    color: var(--nile-colors-neutral-500);\n  }\n\n  /* Textarea control styles */\n  .textarea__control {\n    flex: 1 1 auto;\n    font-family: Colfax-regular;\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 14px; /* 100% */\n    letter-spacing: 0.2px;\n    color: var(--nile-colors-dark-900);\n    border: none;\n    background: none;\n    box-shadow: none;\n    cursor: inherit;\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::-webkit-search-decoration,\n  .textarea__control::-webkit-search-cancel-button,\n  .textarea__control::-webkit-search-results-button,\n  .textarea__control::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::placeholder {\n    color: var(--nile-colors-dark-500);\n    user-select: none;\n  }\n\n  .textarea__control:focus {\n    outline: none;\n  }\n\n  .textarea--medium .textarea__control {\n    padding:var(--nile-textarea-padding);\n  }\n\n  /* Resize types */\n  .textarea--resize-none .textarea__control {\n    resize: none;\n    min-height: 12px;\n  }\n\n  .textarea--resize-vertical .textarea__control {\n    resize: vertical;\n    min-height: 12px;\n  }\n\n  .textarea--resize-auto .textarea__control {\n    resize: none;\n    overflow-y: hidden;\n    min-height: 12px;\n  }\n\n  .textarea--standard.textarea--warning {\n    border-color: var(--nile-colors-yellow-500);\n  }\n\n  .textarea--standard.textarea--error {\n    border-color: var(--nile-colors-red-500);\n  }\n\n  .textarea--standard.textarea--success {\n    border-color: var(--nile-colors-green-500);\n  }\n\n  .textarea--standard.textarea--destructive {\n    border-color: #fda29b;\n    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n  }\n\n  .textarea--standard.textarea--destructive.textarea--focused {\n    border-color: #fda29b;\n    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n      0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n  }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"gXAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}

package/dist/nile-textarea/nile-textarea.css.esm.js

@@ -11,12 +11,12 @@ import{i as e}from"../index-cd2f9c12.esm.js";const r=e`
   .form-control--has-label .form-control__label {
     display: inline-block;
     margin-bottom: 12px;
-    color: var(--nile-colors-dark-900);
-    font-family:var(--nile-font-family-serif);
+    color: var(--nile-textarea-label-color);
+    font-family: var(--nile-font-family-serif);
     font-size: 14px;
     font-style: normal;
-    font-weight: 400;
-    line-height: 14px;
+    font-weight: var(--nile-textarea-label-font-weight); 
+    line-height: var(--nile-textarea-label-line-height); 
     letter-spacing: 0.2px;
   }
 
@@ -27,7 +27,7 @@ import{i as e}from"../index-cd2f9c12.esm.js";const r=e`
   :host([required]) .form-control--has-label .form-control__label::after {
     content: '*';
     margin-inline-start: -2px;
-    color: #A4121C;
+    color: #a4121c;
   }
 
   /* Help text */
@@ -44,6 +44,7 @@ import{i as e}from"../index-cd2f9c12.esm.js";const r=e`
     margin-top: 12px;
     font-size: 12px;
     font-style: normal;
+    font-weight: 400;
     line-height: 12px;
     letter-spacing: 0.2px;
   }
@@ -68,24 +69,19 @@ import{i as e}from"../index-cd2f9c12.esm.js";const r=e`
     border-radius: var(--nile-radius-base-standard);
     transition: 0.3s color, 0.3s border, 0.3s box-shadow, 0.3s background-color;
     cursor: text;
-    min-height:12px;
+    min-height: 12px;
   }
 
   /* Standard textareas */
   .textarea--standard {
-    background-color: var(
-      --nile-colors-white-base
-    );
-    border: solid 1px var(--nile-colors-neutral-500);
+    background-color: var(--nile-colors-white-base);
+    border: 1px solid var(--nile-textarea-standard-border-color); 
+    box-shadow:var(--nile-textarea-standard-box-shadow); 
   }
 
   .textarea--standard:hover:not(.textarea--disabled) {
-    background-color: var(
-      --nile-colors-white-base
-    );
-    border-color: var(
-      --nile-colors-dark-900
-    );
+    background-color: var(--nile-colors-white-base);
+    border-color: var(--nile-textarea-standard-hover-border-color); 
     border-radius: var(--nile-radius-base-standard);
   }
 
@@ -95,37 +91,30 @@ import{i as e}from"../index-cd2f9c12.esm.js";const r=e`
   }
 
   .textarea--standard.textarea--focused:not(.textarea--disabled) {
-    background-color: var(
-      --nile-colors-white-base
-    );
-    border-color: var(
-      --nile-colors-primary-600
-    );
+    background-color: var(--nile-colors-white-base);
+    border-color: var(--nile-textarea-standard-focused-border-color); 
+    box-shadow:var(--nile-textarea-standard-focused-box-shadow);
   }
 
   .textarea--standard.textarea--focused:not(.textarea--disabled)
     .textarea__control {
-      color: #000000;
+    color: #000000;
   }
 
   .textarea--standard.textarea--disabled {
-    border-color: var(
-      --nile-colors-neutral-500
-    );
+    border-color: var(--nile-textarea-standard-disabled-border-color); 
+    background: var(--nile-textarea-standard-disabled-background-color);
     opacity: 0.5;
     cursor: not-allowed;
+    box-shadow:var(--nile-textarea-standard-disabled-box-shadow); 
   }
 
   .textarea--standard.textarea--disabled .textarea__control {
-    color: var(
-      --nile-colors-neutral-500
-    );
+    color: var(--nile-colors-neutral-500);
   }
 
   .textarea--standard.textarea--disabled .textarea__control::placeholder {
-    color: var(
-      --nile-colors-neutral-500
-    );
+    color: var(--nile-colors-neutral-500);
   }
 
   /* Textarea control styles */
@@ -153,9 +142,7 @@ import{i as e}from"../index-cd2f9c12.esm.js";const r=e`
   }
 
   .textarea__control::placeholder {
-    color: var(
-      --nile-colors-dark-500
-    );
+    color: var(--nile-colors-dark-500);
     user-select: none;
   }
 
@@ -164,24 +151,24 @@ import{i as e}from"../index-cd2f9c12.esm.js";const r=e`
   }
 
   .textarea--medium .textarea__control {
-    padding: 0.5em 10px;
+    padding:var(--nile-textarea-padding);
   }
 
   /* Resize types */
   .textarea--resize-none .textarea__control {
     resize: none;
-    min-height:12px;
+    min-height: 12px;
   }
 
   .textarea--resize-vertical .textarea__control {
     resize: vertical;
-    min-height:12px;
+    min-height: 12px;
   }
 
   .textarea--resize-auto .textarea__control {
     resize: none;
     overflow-y: hidden;
-    min-height:12px;
+    min-height: 12px;
   }
 
   .textarea--standard.textarea--warning {
@@ -195,4 +182,15 @@ import{i as e}from"../index-cd2f9c12.esm.js";const r=e`
   .textarea--standard.textarea--success {
     border-color: var(--nile-colors-green-500);
   }
+
+  .textarea--standard.textarea--destructive {
+    border-color: #fda29b;
+    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
+  }
+
+  .textarea--standard.textarea--destructive.textarea--focused {
+    border-color: #fda29b;
+    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),
+      0px 0px 0px 4px rgba(240, 68, 56, 0.24);
+  }
 `;export{r as s};

package/dist/nile-textarea/nile-textarea.esm.js

@@ -1,4 +1,4 @@
-import{__decorate as t}from"tslib";import{x as e}from"../index-cd2f9c12.esm.js";import{query as i,state as s,customElement as o}from"lit/decorators.js";import{s as r}from"./nile-textarea.css.esm.js";import{classMap as a}from"lit/directives/class-map.js";import{d as l}from"../internal/default-value.esm.js";import{H as h}from"../internal/slot.esm.js";import{ifDefined as n}from"lit/directives/if-defined.js";import{live as d}from"lit/directives/live.js";import{w as m}from"../internal/watch.esm.js";import{N as c}from"../internal/nile-element.esm.js";import{n as u}from"../property-09139d3c.esm.js";import"lit";let p=class extends c{constructor(){super(...arguments),this.hasSlotController=new h(this,"help-text","label"),this.hasFocus=!1,this.title="",this.name="",this.value="",this.size="medium",this.filled=!1,this.label="",this.helpText="",this.errorMessage="",this.placeholder="",this.rows=4,this.resize="vertical",this.disabled=!1,this.readonly=!1,this.form="",this.required=!1,this.warning=!1,this.error=!1,this.success=!1,this.spellcheck=!0,this.defaultValue="",this.fullHeight=!1}connectedCallback(){super.connectedCallback(),this.resizeObserver=new ResizeObserver((()=>this.setTextareaHeight())),this.updateComplete.then((()=>{this.setTextareaHeight(),this.resizeObserver.observe(this.input)})),this.fullHeight&&requestAnimationFrame((()=>{let t=this.parentElement?.getBoundingClientRect().height;t&&(t-=65,t<12&&(t=12),this.shadowRoot?.querySelector("textarea")?.style.setProperty("height",`${t}px`))})),this.emit("nile-init")}disconnectedCallback(){super.disconnectedCallback(),this.input&&this.resizeObserver.unobserve(this.input),this.emit("nile-destroy")}handleBlur(){this.hasFocus=!1,this.emit("nile-blur",{value:this.value})}handleChange(){this.value=this.input.value,this.setTextareaHeight(),this.emit("nile-change",{value:this.value})}handleFocus(){this.hasFocus=!0,this.emit("nile-focus",{value:this.value})}handleInput(){this.value=this.input.value,this.emit("nile-input",{value:this.value})}setTextareaHeight(){"auto"===this.resize?(this.input.style.height="auto",this.input.style.height=`${this.input.scrollHeight}px`):this.input.style.height=void 0}handleRowsChange(){this.setTextareaHeight()}async handleValueChange(){await this.updateComplete,this.setTextareaHeight()}focus(t){this.input.focus(t)}blur(){this.input.blur()}select(){this.input.select()}scrollPosition(t){return t?("number"==typeof t.top&&(this.input.scrollTop=t.top),void("number"==typeof t.left&&(this.input.scrollLeft=t.left))):{top:this.input.scrollTop,left:this.input.scrollTop}}setSelectionRange(t,e,i="none"){this.input.setSelectionRange(t,e,i)}setRangeText(t,e,i,s){this.input.setRangeText(t,e,i,s),this.value!==this.input.value&&(this.value=this.input.value),this.value!==this.input.value&&(this.value=this.input.value,this.setTextareaHeight())}render(){const t=this.hasSlotController.test("label");this.hasSlotController.test("help-text");const i=!!this.label||!!t,s=!!this.helpText,o=!!this.errorMessage;return e`
+import{__decorate as t}from"tslib";import{x as e}from"../index-cd2f9c12.esm.js";import{query as i,state as s,customElement as o}from"lit/decorators.js";import{s as r}from"./nile-textarea.css.esm.js";import{classMap as a}from"lit/directives/class-map.js";import{d as l}from"../internal/default-value.esm.js";import{H as h}from"../internal/slot.esm.js";import{ifDefined as n}from"lit/directives/if-defined.js";import{live as d}from"lit/directives/live.js";import{w as m}from"../internal/watch.esm.js";import{N as c}from"../internal/nile-element.esm.js";import{n as u}from"../property-09139d3c.esm.js";import"lit";let p=class extends c{constructor(){super(...arguments),this.hasSlotController=new h(this,"help-text","label"),this.hasFocus=!1,this.title="",this.name="",this.value="",this.size="medium",this.filled=!1,this.label="",this.helpText="",this.errorMessage="",this.placeholder="",this.rows=4,this.resize="vertical",this.disabled=!1,this.readonly=!1,this.form="",this.required=!1,this.warning=!1,this.error=!1,this.success=!1,this.destructive=!1,this.spellcheck=!0,this.defaultValue="",this.fullHeight=!1}connectedCallback(){super.connectedCallback(),this.resizeObserver=new ResizeObserver((()=>this.setTextareaHeight())),this.updateComplete.then((()=>{this.setTextareaHeight(),this.resizeObserver.observe(this.input)})),this.fullHeight&&requestAnimationFrame((()=>{let t=this.parentElement?.getBoundingClientRect().height;t&&(t-=65,t<12&&(t=12),this.shadowRoot?.querySelector("textarea")?.style.setProperty("height",`${t}px`))})),this.emit("nile-init")}disconnectedCallback(){super.disconnectedCallback(),this.input&&this.resizeObserver.unobserve(this.input),this.emit("nile-destroy")}handleBlur(){this.hasFocus=!1,this.emit("nile-blur",{value:this.value})}handleChange(){this.value=this.input.value,this.setTextareaHeight(),this.emit("nile-change",{value:this.value})}handleFocus(){this.hasFocus=!0,this.emit("nile-focus",{value:this.value})}handleInput(){this.value=this.input.value,this.emit("nile-input",{value:this.value})}setTextareaHeight(){"auto"===this.resize?(this.input.style.height="auto",this.input.style.height=`${this.input.scrollHeight}px`):this.input.style.height=void 0}handleRowsChange(){this.setTextareaHeight()}async handleValueChange(){await this.updateComplete,this.setTextareaHeight()}focus(t){this.input.focus(t)}blur(){this.input.blur()}select(){this.input.select()}scrollPosition(t){return t?("number"==typeof t.top&&(this.input.scrollTop=t.top),void("number"==typeof t.left&&(this.input.scrollLeft=t.left))):{top:this.input.scrollTop,left:this.input.scrollTop}}setSelectionRange(t,e,i="none"){this.input.setSelectionRange(t,e,i)}setRangeText(t,e,i,s){this.input.setRangeText(t,e,i,s),this.value!==this.input.value&&(this.value=this.input.value),this.value!==this.input.value&&(this.value=this.input.value,this.setTextareaHeight())}render(){const t=this.hasSlotController.test("label");this.hasSlotController.test("help-text");const i=!!this.label||!!t,s=!!this.helpText,o=!!this.errorMessage;return e`
       <div
         part="form-control"
         class=${a({"form-control":!0,"form-control--medium":"medium"===this.size,"form-control--has-label":i,"form-control--has-help-text":s})}
@@ -15,7 +15,7 @@ import{__decorate as t}from"tslib";import{x as e}from"../index-cd2f9c12.esm.js";
         <div part="form-control-input" class="form-control-input">
           <div
             part="base"
-            class=${a({textarea:!0,"textarea--medium":"medium"===this.size,"textarea--warning":this.warning,"textarea--error":this.error,"textarea--success":this.success,"textarea--standard":!this.filled,"textarea--disabled":this.disabled,"textarea--focused":this.hasFocus,"textarea--empty":!this.value,"textarea--resize-none":"none"===this.resize,"textarea--resize-vertical":"vertical"===this.resize,"textarea--resize-auto":"auto"===this.resize})}
+            class=${a({textarea:!0,"textarea--medium":"medium"===this.size,"textarea--warning":this.warning,"textarea--error":this.error,"textarea--success":this.success,"textarea--destructive":this.destructive,"textarea--standard":!this.filled,"textarea--disabled":this.disabled,"textarea--focused":this.hasFocus,"textarea--empty":!this.value,"textarea--resize-none":"none"===this.resize,"textarea--resize-vertical":"vertical"===this.resize,"textarea--resize-auto":"auto"===this.resize})}
           >
             <textarea
               part="textarea"
@@ -58,4 +58,4 @@ import{__decorate as t}from"tslib";import{x as e}from"../index-cd2f9c12.esm.js";
                 >
               `:""}
       </div>
-    `}};p.styles=r,t([i(".textarea__control")],p.prototype,"input",void 0),t([s()],p.prototype,"hasFocus",void 0),t([u()],p.prototype,"title",void 0),t([u()],p.prototype,"name",void 0),t([u()],p.prototype,"value",void 0),t([u({reflect:!0})],p.prototype,"size",void 0),t([u({type:Boolean,reflect:!0})],p.prototype,"filled",void 0),t([u()],p.prototype,"label",void 0),t([u({attribute:"help-text"})],p.prototype,"helpText",void 0),t([u({attribute:"error-message"})],p.prototype,"errorMessage",void 0),t([u()],p.prototype,"placeholder",void 0),t([u({type:Number})],p.prototype,"rows",void 0),t([u()],p.prototype,"resize",void 0),t([u({type:Boolean,reflect:!0})],p.prototype,"disabled",void 0),t([u({type:Boolean,reflect:!0})],p.prototype,"readonly",void 0),t([u({reflect:!0})],p.prototype,"form",void 0),t([u({type:Boolean,reflect:!0})],p.prototype,"required",void 0),t([u({type:Number})],p.prototype,"minlength",void 0),t([u({type:Number})],p.prototype,"maxlength",void 0),t([u({type:Boolean})],p.prototype,"warning",void 0),t([u({type:Boolean})],p.prototype,"error",void 0),t([u({type:Boolean})],p.prototype,"success",void 0),t([u()],p.prototype,"autocapitalize",void 0),t([u()],p.prototype,"autocorrect",void 0),t([u()],p.prototype,"autocomplete",void 0),t([u({type:Boolean})],p.prototype,"autofocus",void 0),t([u()],p.prototype,"enterkeyhint",void 0),t([u({type:Boolean,converter:{fromAttribute:t=>!(!t||"false"===t),toAttribute:t=>t?"true":"false"}})],p.prototype,"spellcheck",void 0),t([u()],p.prototype,"inputmode",void 0),t([l()],p.prototype,"defaultValue",void 0),t([u({type:Boolean,reflect:!0})],p.prototype,"fullHeight",void 0),t([m("rows",{waitUntilFirstUpdate:!0})],p.prototype,"handleRowsChange",null),t([m("value",{waitUntilFirstUpdate:!0})],p.prototype,"handleValueChange",null),p=t([o("nile-textarea")],p);export{p as N};
+    `}};p.styles=r,t([i(".textarea__control")],p.prototype,"input",void 0),t([s()],p.prototype,"hasFocus",void 0),t([u()],p.prototype,"title",void 0),t([u()],p.prototype,"name",void 0),t([u()],p.prototype,"value",void 0),t([u({reflect:!0})],p.prototype,"size",void 0),t([u({type:Boolean,reflect:!0})],p.prototype,"filled",void 0),t([u()],p.prototype,"label",void 0),t([u({attribute:"help-text"})],p.prototype,"helpText",void 0),t([u({attribute:"error-message"})],p.prototype,"errorMessage",void 0),t([u()],p.prototype,"placeholder",void 0),t([u({type:Number})],p.prototype,"rows",void 0),t([u()],p.prototype,"resize",void 0),t([u({type:Boolean,reflect:!0})],p.prototype,"disabled",void 0),t([u({type:Boolean,reflect:!0})],p.prototype,"readonly",void 0),t([u({reflect:!0})],p.prototype,"form",void 0),t([u({type:Boolean,reflect:!0})],p.prototype,"required",void 0),t([u({type:Number})],p.prototype,"minlength",void 0),t([u({type:Number})],p.prototype,"maxlength",void 0),t([u({type:Boolean})],p.prototype,"warning",void 0),t([u({type:Boolean})],p.prototype,"error",void 0),t([u({type:Boolean})],p.prototype,"success",void 0),t([u({type:Boolean})],p.prototype,"destructive",void 0),t([u()],p.prototype,"autocapitalize",void 0),t([u()],p.prototype,"autocorrect",void 0),t([u()],p.prototype,"autocomplete",void 0),t([u({type:Boolean})],p.prototype,"autofocus",void 0),t([u()],p.prototype,"enterkeyhint",void 0),t([u({type:Boolean,converter:{fromAttribute:t=>!(!t||"false"===t),toAttribute:t=>t?"true":"false"}})],p.prototype,"spellcheck",void 0),t([u()],p.prototype,"inputmode",void 0),t([l()],p.prototype,"defaultValue",void 0),t([u({type:Boolean,reflect:!0})],p.prototype,"fullHeight",void 0),t([m("rows",{waitUntilFirstUpdate:!0})],p.prototype,"handleRowsChange",null),t([m("value",{waitUntilFirstUpdate:!0})],p.prototype,"handleValueChange",null),p=t([o("nile-textarea")],p);export{p as N};

package/dist/src/index.d.ts

@@ -45,6 +45,14 @@ export { NileBreadcrumb } from './nile-breadcrumb';
 export { NileBreadcrumbItem } from './nile-breadcrumb-item';
 export { NileFormGroup } from './nile-form-group';
 export { NileCard } from './nile-card';
-export { NileAvatar } from './nile-avatar';
 export { NilePopover } from './nile-popover';
 export { NileButtonFilter } from './nile-button-filter';
+export { NileCircularProgressbar } from './nile-circular-progressbar';
+export { NileSidebarMenu } from './nile-sidebar-menu';
+export { NileSidebarMenuItems } from './nile-sidebar-menu-items';
+export { NileSidebarWrapper } from './nile-sidebar-wrapper';
+export { NileTableCellItem } from './nile-table-cell-item';
+export { NileTableRow } from './nile-table-row';
+export { NileTableBody } from './nile-table-body';
+export { NileTableHeaderItem } from './nile-table-header-item';
+export { NileAvatar } from './nile-avatar';

package/dist/src/index.js

@@ -45,7 +45,15 @@ export { NileBreadcrumb } from './nile-breadcrumb';
 export { NileBreadcrumbItem } from './nile-breadcrumb-item';
 export { NileFormGroup } from './nile-form-group';
 export { NileCard } from './nile-card';
-export { NileAvatar } from './nile-avatar';
 export { NilePopover } from './nile-popover';
 export { NileButtonFilter } from './nile-button-filter';
+export { NileCircularProgressbar } from './nile-circular-progressbar';
+export { NileSidebarMenu } from './nile-sidebar-menu';
+export { NileSidebarMenuItems } from './nile-sidebar-menu-items';
+export { NileSidebarWrapper } from './nile-sidebar-wrapper';
+export { NileTableCellItem } from './nile-table-cell-item';
+export { NileTableRow } from './nile-table-row';
+export { NileTableBody } from './nile-table-body';
+export { NileTableHeaderItem } from './nile-table-header-item';
+export { NileAvatar } from './nile-avatar';
 //# sourceMappingURL=index.js.map

package/dist/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC","sourcesContent":["export { NileButton } from './nile-button';\nexport { NileHeading } from './nile-heading';\nexport { NileIcon } from './nile-icon';\nexport { NileInput } from './nile-input';\nexport { NileSidebar } from './nile-sidebar';\nexport { NileMenu } from './nile-menu';\nexport { NileBadge } from './nile-badge';\nexport { NileDrawer } from './nile-drawer';\nexport { NileCheckbox } from './nile-checkbox';\nexport { NileRadio } from './nile-radio';\nexport { NileRadioGroup } from './nile-radio-group';\nexport { NilePopup } from './nile-popup';\nexport { NileTooltip } from './nile-tooltip';\nexport { NileSlideToggle } from './nile-slide-toggle';\nexport { NileLoader } from './nile-loader';\nexport { NileProgressBar } from './nile-progress-bar';\nexport { NileSpinner } from './nile-spinner';\nexport { NileSelect } from './nile-select';\nexport { NileOption } from './nile-option';\nexport { NileTag } from './nile-tag';\nexport { NileIconButton } from './nile-icon-button';\nexport { NileMenuItem } from './nile-menu-item';\nexport { NileDropdown } from './nile-dropdown';\nexport { NileAutoComplete } from './nile-auto-complete';\nexport { NileChip } from './nile-chip';\nexport { NileTextarea } from './nile-textarea';\nexport { NileDatePicker } from './nile-date-picker';\nexport { NileErrorMessage } from './nile-error-message';\nexport { NileFormErrorMessage } from './nile-form-error-message';\nexport { NileFormHelpText } from './nile-form-help-text';\nexport { NileCalendar } from './nile-calendar';\nexport { NileLink } from './nile-link';\nexport { NileButtonToggleGroup } from './nile-button-toggle-group';\nexport { NileButtonToggle } from './nile-button-toggle';\nexport { NileSwitcher } from './nile-switcher';\nexport { NileContentEditor } from './nile-content-editor';\nexport { NileDialog } from './nile-dialog';\nexport { NileErrorNotification } from './nile-error-notification';\nexport { NileTabGroup } from './nile-tab-group';\nexport { NileTab } from './nile-tab';\nexport { NileTabPanel } from './nile-tab-panel';\nexport { NileCodeEditor } from './nile-code-editor';\nexport { NileToast } from './nile-toast';\nexport { NileBreadcrumb } from './nile-breadcrumb';\nexport { NileBreadcrumbItem } from './nile-breadcrumb-item';\nexport { NileFormGroup } from './nile-form-group';\nexport { NileCard } from './nile-card';\nexport { NileAvatar } from './nile-avatar';\nexport { NilePopover } from './nile-popover';\nexport { NileButtonFilter } from './nile-button-filter';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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","sourcesContent":["export { NileButton } from './nile-button';\nexport { NileHeading } from './nile-heading';\nexport { NileIcon } from './nile-icon';\nexport { NileInput } from './nile-input';\nexport { NileSidebar } from './nile-sidebar';\nexport { NileMenu } from './nile-menu';\nexport { NileBadge } from './nile-badge';\nexport { NileDrawer } from './nile-drawer';\nexport { NileCheckbox } from './nile-checkbox';\nexport { NileRadio } from './nile-radio';\nexport { NileRadioGroup } from './nile-radio-group';\nexport { NilePopup } from './nile-popup';\nexport { NileTooltip } from './nile-tooltip';\nexport { NileSlideToggle } from './nile-slide-toggle';\nexport { NileLoader } from './nile-loader';\nexport { NileProgressBar } from './nile-progress-bar';\nexport { NileSpinner } from './nile-spinner';\nexport { NileSelect } from './nile-select';\nexport { NileOption } from './nile-option';\nexport { NileTag } from './nile-tag';\nexport { NileIconButton } from './nile-icon-button';\nexport { NileMenuItem } from './nile-menu-item';\nexport { NileDropdown } from './nile-dropdown';\nexport { NileAutoComplete } from './nile-auto-complete';\nexport { NileChip } from './nile-chip';\nexport { NileTextarea } from './nile-textarea';\nexport { NileDatePicker } from './nile-date-picker';\nexport { NileErrorMessage } from './nile-error-message';\nexport { NileFormErrorMessage } from './nile-form-error-message';\nexport { NileFormHelpText } from './nile-form-help-text';\nexport { NileCalendar } from './nile-calendar';\nexport { NileLink } from './nile-link';\nexport { NileButtonToggleGroup } from './nile-button-toggle-group';\nexport { NileButtonToggle } from './nile-button-toggle';\nexport { NileSwitcher } from './nile-switcher';\nexport { NileContentEditor } from './nile-content-editor';\nexport { NileDialog } from './nile-dialog';\nexport { NileErrorNotification } from './nile-error-notification';\nexport { NileTabGroup } from './nile-tab-group';\nexport { NileTab } from './nile-tab';\nexport { NileTabPanel } from './nile-tab-panel';\nexport { NileCodeEditor } from './nile-code-editor';\nexport { NileToast } from './nile-toast';\nexport { NileBreadcrumb } from './nile-breadcrumb';\nexport { NileBreadcrumbItem } from './nile-breadcrumb-item';\nexport { NileFormGroup } from './nile-form-group';\nexport { NileCard } from './nile-card';\nexport { NilePopover } from './nile-popover';\nexport { NileButtonFilter } from './nile-button-filter';\nexport { NileCircularProgressbar } from './nile-circular-progressbar';\nexport { NileSidebarMenu } from './nile-sidebar-menu';\nexport { NileSidebarMenuItems } from './nile-sidebar-menu-items';\nexport { NileSidebarWrapper } from './nile-sidebar-wrapper';\nexport { NileTableCellItem } from './nile-table-cell-item';\nexport { NileTableRow } from './nile-table-row';\nexport { NileTableBody } from './nile-table-body';\nexport { NileTableHeaderItem } from './nile-table-header-item';\nexport { NileAvatar } from './nile-avatar';\n"]}

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

@@ -17,6 +17,7 @@ export const styles = css `
     font-family: var(--nile-font-family-serif);
     font-style: normal;
     font-weight: 500;
+    color:var(--nile-colors-white-base);
     text-transform: uppercase;
     display: flex;
     flex-direction: column;

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

@@ -1 +1 @@
-{"version":3,"file":"nile-avatar.css.js","sourceRoot":"","sources":["../../../src/nile-avatar/nile-avatar.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwFxB,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 * Avatar CSS\n */\nexport const styles = css`\n  :host {\n  }\n  .text__avatar {\n    box-sizing: border-box;\n    font-feature-settings: 'clig' off, 'liga' off;\n    font-family: var(--nile-font-family-serif);\n    font-style: normal;\n    font-weight: 500;\n    text-transform: uppercase;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    box-sizing: border-box;\n    border: 1px solid;\n    border-color: var(--nile-colors-neutral-500);\n  }\n\n  .avatar {\n    box-sizing: border-box;\n    border: 1px solid var(--nile-colors-neutral-500);\n    background-position: 50% 50%;\n    background-size: cover;\n    background-repeat: no-repeat;\n  }\n\n  .avatar__small {\n    width: var(--nile-type-scale-4);\n    height: var(--nile-type-scale-4);\n    font-size: 6.516px;\n    line-height: 6.516px;\n  }\n\n  .avatar__medium {\n    width: var(--nile-spacing-3-x);\n    height: var(--nile-spacing-3-x);\n    font-size: var(--nile-type-scale-1);\n    line-height: var(--nile-type-scale-1);\n  }\n\n  .avatar__large {\n    width: 32px;\n    height: 32px;\n    font-size: 12.8px;\n    line-height: 12.8px;\n  }\n\n  .avatar__extralarge {\n    height: 40px;\n    width: 40px;\n    font-size: var(--nile-type-scale-3);\n    line-height: var(--nile-type-scale-3);\n  }\n\n  .avatar__rounded {\n    border-radius: 50%;\n  }\n\n  .variant__yellow {\n    color: var(--nile-colors-yellow-700);\n    border-color: var(--nile-colors-yellow-500);\n    background: var(--nile-colors-yellow-400);\n  }\n\n  .variant__blue {\n    color: var(--nile-colors-blue-700);\n    border-color: var(--nile-colors-blue-500);\n    background: var(--nile-colors-blue-400);\n  }\n\n  .variant__red {\n    color: var(--nile-colors-button-caution-pressed-border);\n    border-color: var(--nile-colors-red-500);\n    background: var(--nile-colors-red-400);\n  }\n\n  .variant__green {\n    color: var(--nile-colors-green-700);\n    border-color: var(--nile-colors-green-500);\n    background: var(--nile-colors-green-400);\n  }\n\n  .variant__neutral {\n    color: var(--nile-colors-neutral-700);\n    border-color: var(--nile-colors-neutral-500);\n    background: var(--nile-colors-dark-200);\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-avatar.css.js","sourceRoot":"","sources":["../../../src/nile-avatar/nile-avatar.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyFxB,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 * Avatar CSS\n */\nexport const styles = css`\n  :host {\n  }\n  .text__avatar {\n    box-sizing: border-box;\n    font-feature-settings: 'clig' off, 'liga' off;\n    font-family: var(--nile-font-family-serif);\n    font-style: normal;\n    font-weight: 500;\n    color:var(--nile-colors-white-base);\n    text-transform: uppercase;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    box-sizing: border-box;\n    border: 1px solid;\n    border-color: var(--nile-colors-neutral-500);\n  }\n\n  .avatar {\n    box-sizing: border-box;\n    border: 1px solid var(--nile-colors-neutral-500);\n    background-position: 50% 50%;\n    background-size: cover;\n    background-repeat: no-repeat;\n  }\n\n  .avatar__small {\n    width: var(--nile-type-scale-4);\n    height: var(--nile-type-scale-4);\n    font-size: 6.516px;\n    line-height: 6.516px;\n  }\n\n  .avatar__medium {\n    width: var(--nile-spacing-3-x);\n    height: var(--nile-spacing-3-x);\n    font-size: var(--nile-type-scale-1);\n    line-height: var(--nile-type-scale-1);\n  }\n\n  .avatar__large {\n    width: 32px;\n    height: 32px;\n    font-size: 12.8px;\n    line-height: 12.8px;\n  }\n\n  .avatar__extralarge {\n    height: 40px;\n    width: 40px;\n    font-size: var(--nile-type-scale-3);\n    line-height: var(--nile-type-scale-3);\n  }\n\n  .avatar__rounded {\n    border-radius: 50%;\n  }\n\n  .variant__yellow {\n    color: var(--nile-colors-yellow-700);\n    border-color: var(--nile-colors-yellow-500);\n    background: var(--nile-colors-yellow-400);\n  }\n\n  .variant__blue {\n    color: var(--nile-colors-blue-700);\n    border-color: var(--nile-colors-blue-500);\n    background: var(--nile-colors-blue-400);\n  }\n\n  .variant__red {\n    color: var(--nile-colors-button-caution-pressed-border);\n    border-color: var(--nile-colors-red-500);\n    background: var(--nile-colors-red-400);\n  }\n\n  .variant__green {\n    color: var(--nile-colors-green-700);\n    border-color: var(--nile-colors-green-500);\n    background: var(--nile-colors-green-400);\n  }\n\n  .variant__neutral {\n    color: var(--nile-colors-neutral-700);\n    border-color: var(--nile-colors-neutral-500);\n    background: var(--nile-colors-dark-200);\n  }\n`;\n\nexport default [styles];\n"]}

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

@@ -22,6 +22,12 @@ export declare class NileAvatar extends NileElement {
     src: string;
     /** Gives the default Image Letters to the Avatar */
     name: string;
+    /** Gives the default bg color  to the Avatar */
+    color: string;
+    /** Gives the default text color  to the Avatar */
+    textColor: string;
+    /** Gives the default bg color  to the Avatar */
+    borderColor: string;
     /** Size of the Avatar */
     size: 'small' | 'medium' | 'large' | 'extralarge';
     /** Gives a border radius of 50% to the Avatar */

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

@@ -23,6 +23,12 @@ let NileAvatar = class NileAvatar extends NileElement {
         this.src = '';
         /** Gives the default Image Letters to the Avatar */
         this.name = '';
+        /** Gives the default bg color  to the Avatar */
+        this.color = '';
+        /** Gives the default text color  to the Avatar */
+        this.textColor = '#fff';
+        /** Gives the default bg color  to the Avatar */
+        this.borderColor = 'transparent';
         /** Size of the Avatar */
         this.size = 'medium';
         /** Gives a border radius of 50% to the Avatar */
@@ -72,12 +78,14 @@ let NileAvatar = class NileAvatar extends NileElement {
             avatar__large: this.size === 'large',
             avatar__extralarge: this.size === 'extralarge',
             avatar__rounded: this.isRounded,
-            variant__yellow: variant__code === 0,
-            variant__blue: variant__code === 1,
-            variant__red: variant__code === 2,
-            variant__green: variant__code === 3,
-            variant__neutral: variant__code === 4,
+            variant__yellow: variant__code === 0 && !this.color,
+            variant__blue: variant__code === 1 && !this.color,
+            variant__red: variant__code === 2 && !this.color,
+            variant__green: variant__code === 3 && !this.color,
+            variant__neutral: variant__code === 4 && !this.color,
         })}
+      style="background-color: ${this.color}; border-color: ${this
+            .borderColor}; color:${this.textColor}"
     >
       ${defaultInitials
             ? defaultInitials
@@ -113,6 +121,15 @@ __decorate([
 __decorate([
     property({ type: String, reflect: true })
 ], NileAvatar.prototype, "name", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], NileAvatar.prototype, "color", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: 'text-color' })
+], NileAvatar.prototype, "textColor", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: 'border-color' })
+], NileAvatar.prototype, "borderColor", void 0);
 __decorate([
     property({ reflect: true })
 ], NileAvatar.prototype, "size", void 0);

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

@@ -1 +1 @@
-{"version":3,"file":"nile-avatar.js","sourceRoot":"","sources":["../../../src/nile-avatar/nile-avatar.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} from 'lit-element';\nimport { customElement, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { styles } from './nile-avatar.css';\nimport NileElement from '../internal/nile-element';\nimport { string } from '../nile-icon/icons/svg';\n\n/**\n * Nile icon component.\n *\n * @tag nile-avatar\n *\n */\n@customElement('nile-avatar')\nexport class NileAvatar extends NileElement {\n  /**\n   * The styles for Avatar\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  /** Gives the url to the Avatar */\n  @property({ type: String, reflect: true }) src = '';\n\n  /** Gives the default Image Letters to the Avatar */\n  @property({ type: String, reflect: true }) name = '';\n\n  /** Size of the Avatar */\n  @property({ reflect: true }) size:\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'extralarge' = 'medium';\n\n  /** Gives a border radius of 50% to the Avatar */\n  @property({ type: Boolean, reflect: true }) isRounded = false;\n\n  /* #endregion */\n\n  /* #region Methods */\n\n  /**\n   * Render method\n   * @slot This is a slot test\n   */\n  @state() private isDefaultAvatar = true;\n\n  @state() private defaultAvatarContent = html``;\n\n  private generateInitials(name: String): string {\n    if (!name) {\n      return '';\n    }\n    const nameParts = name\n      .split(' ')\n      .filter(part => part.length > 0)\n      .map(part => part.charAt(0).toUpperCase())\n      .slice(0, 2);\n    return nameParts.length > 1 ? nameParts[0] + nameParts[1] : nameParts[0];\n  }\n\n  private generateVariantCode(initials: string): number {\n    const char1 = initials.charCodeAt(0);\n    const char2 = initials.length == 1 ? char1 : initials.charCodeAt(1);\n    const multifactor = char1 * char2 + (char1 % 23) + (char2 % 23);\n    return multifactor % 5;\n  }\n\n  private handleImageError(event: Event): void {\n    const defaultInitials = this.generateInitials(this.name);\n    const variant__code = this.generateVariantCode(defaultInitials);\n    this.defaultAvatarContent = html`<div\n      class=${classMap({\n        text__avatar: true,\n        avatar__small: this.size === 'small',\n        avatar__medium: this.size === 'medium',\n        avatar__large: this.size === 'large',\n        avatar__extralarge: this.size === 'extralarge',\n        avatar__rounded: this.isRounded,\n        variant__yellow: variant__code === 0,\n        variant__blue: variant__code === 1,\n        variant__red: variant__code === 2,\n        variant__green: variant__code === 3,\n        variant__neutral: variant__code === 4,\n      })}\n    >\n      ${defaultInitials\n        ? defaultInitials\n        : html`<nile-icon name=\"user\" color=\"grey\" size=\"14\"></nile-icon>`}\n    </div>`;\n\n    this.isDefaultAvatar = false;\n  }\n\n  public render(): TemplateResult {\n    return html`\n      ${this.isDefaultAvatar\n        ? html` <img\n            src=\"${this.src}\"\n            class=\"avatar\"\n            class=${classMap({\n              avatar: true,\n              avatar__small: this.size === 'small',\n              avatar__medium: this.size === 'medium',\n              avatar__large: this.size === 'large',\n              avatar__extralarge: this.size === 'extralarge',\n              avatar__rounded: this.isRounded,\n            })}\n            style=\"\tbackground-image: url(${this\n              .src}), linear-gradient(lightgray, lightgray);\"\n            @error=\"${this.handleImageError}\"\n          />`\n        : html`${this.defaultAvatarContent}`}\n    `;\n  }\n\n  /* #endregion */\n}\n// onerror=\"this.onerror=null;this.src='${defaultimg}';\"\n\nexport default NileAvatar;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-avatar': NileAvatar;\n  }\n}\n"]}
+{"version":3,"file":"nile-avatar.js","sourceRoot":"","sources":["../../../src/nile-avatar/nile-avatar.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} from 'lit-element';\nimport { customElement, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { styles } from './nile-avatar.css';\nimport NileElement from '../internal/nile-element';\nimport { string } from '../nile-icon/icons/svg';\n\n/**\n * Nile icon component.\n *\n * @tag nile-avatar\n *\n */\n@customElement('nile-avatar')\nexport class NileAvatar extends NileElement {\n  /**\n   * The styles for Avatar\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  /** Gives the url to the Avatar */\n  @property({ type: String, reflect: true }) src = '';\n\n  /** Gives the default Image Letters to the Avatar */\n  @property({ type: String, reflect: true }) name = '';\n\n  /** Gives the default bg color  to the Avatar */\n  @property({ type: String, reflect: true }) color = '';\n\n    /** Gives the default text color  to the Avatar */\n  @property({ type: String, reflect: true ,attribute:'text-color' }) textColor = '#fff';\n\n  /** Gives the default bg color  to the Avatar */\n  @property({ type: String, reflect: true ,attribute:'border-color'}) borderColor = 'transparent';\n\n  /** Size of the Avatar */\n  @property({ reflect: true }) size:\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'extralarge' = 'medium';\n\n  /** Gives a border radius of 50% to the Avatar */\n  @property({ type: Boolean, reflect: true }) isRounded = false;\n\n  /* #endregion */\n\n  /* #region Methods */\n\n  /**\n   * Render method\n   * @slot This is a slot test\n   */\n  @state() private isDefaultAvatar = true;\n\n  @state() private defaultAvatarContent = html``;\n\n  private generateInitials(name: String): string {\n    if (!name) {\n      return '';\n    }\n    const nameParts = name\n      .split(' ')\n      .filter(part => part.length > 0)\n      .map(part => part.charAt(0).toUpperCase())\n      .slice(0, 2);\n    return nameParts.length > 1 ? nameParts[0] + nameParts[1] : nameParts[0];\n  }\n\n  private generateVariantCode(initials: string): number {\n    const char1 = initials.charCodeAt(0);\n    const char2 = initials.length == 1 ? char1 : initials.charCodeAt(1);\n    const multifactor = char1 * char2 + (char1 % 23) + (char2 % 23);\n    return multifactor % 5;\n  }\n\n  private handleImageError(event: Event): void {\n    const defaultInitials = this.generateInitials(this.name);\n    const variant__code = this.generateVariantCode(defaultInitials);\n    this.defaultAvatarContent = html`<div\n      class=${classMap({\n        text__avatar: true,\n        avatar__small: this.size === 'small',\n        avatar__medium: this.size === 'medium',\n        avatar__large: this.size === 'large',\n        avatar__extralarge: this.size === 'extralarge',\n        avatar__rounded: this.isRounded,\n        variant__yellow: variant__code === 0 && !this.color,\n        variant__blue: variant__code === 1 && !this.color ,\n        variant__red: variant__code === 2 && !this.color ,\n        variant__green: variant__code === 3 && !this.color,\n        variant__neutral: variant__code === 4 && !this.color,\n      })}\n      style=\"background-color: ${this.color}; border-color: ${this\n        .borderColor}; color:${this.textColor}\"\n    >\n      ${defaultInitials\n        ? defaultInitials\n        : html`<nile-icon name=\"user\" color=\"grey\" size=\"14\"></nile-icon>`}\n    </div>`;\n\n    this.isDefaultAvatar = false;\n  }\n\n  public render(): TemplateResult {\n    return html`\n      ${this.isDefaultAvatar\n        ? html` <img\n            src=\"${this.src}\"\n            class=\"avatar\"\n            class=${classMap({\n              avatar: true,\n              avatar__small: this.size === 'small',\n              avatar__medium: this.size === 'medium',\n              avatar__large: this.size === 'large',\n              avatar__extralarge: this.size === 'extralarge',\n              avatar__rounded: this.isRounded,\n            })}\n            style=\"\tbackground-image: url(${this\n              .src}), linear-gradient(lightgray, lightgray);\"\n            @error=\"${this.handleImageError}\"\n          />`\n        : html`${this.defaultAvatarContent}`}\n    `;\n  }\n\n  /* #endregion */\n}\n// onerror=\"this.onerror=null;this.src='${defaultimg}';\"\n\nexport default NileAvatar;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-avatar': NileAvatar;\n  }\n}\n"]}