@aquera/nile-elements 0.0.74 → 0.0.76

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

@@ -1 +1 @@
-{"version":3,"file":"nile-drawer.js","sourceRoot":"","sources":["../../../src/nile-drawer/nile-drawer.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 '../nile-icon-button/nile-icon-button';\nimport { animateTo, stopAnimations } from '../internal/animate';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { getAnimation, setDefaultAnimation } from '../utilities/animation-registry';\nimport { HasSlotController } from '../internal/slot';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../internal/scroll';\nimport { uppercaseFirstLetter } from '../internal/string';\nimport { waitForEvent } from '../internal/event';\nimport { watch } from '../internal/watch';\nimport Modal from '../internal/modal';\nimport NileElement from '../internal/nile-element';\nimport styles from './nile-drawer.css';\nimport type { CSSResultGroup, TemplateResult } from 'lit';\n\n/**\n * Nile drawer component.\n *\n * @tag nile-drawer\n *\n * @summary Drawers slide in from a container to expose additional options and information.\n *\n * @dependency nile-icon-button\n *\n * @slot - The drawer's main content.\n * @slot label - The drawer's label. Alternatively, you can use the `label` attribute.\n * @slot header-actions - Optional actions to add to the header. Works best with `<nile-icon-button>`.\n * @slot footer - The drawer's footer, usually one or more buttons representing various options.\n *\n * @event nile-show - Emitted when the drawer opens.\n * @event nile-after-show - Emitted after the drawer opens and all animations are complete.\n * @event nile-hide - Emitted when the drawer closes.\n * @event nile-after-hide - Emitted after the drawer closes and all animations are complete.\n * @event nile-initial-focus - Emitted when the drawer opens and is ready to receive focus. Calling\n *   `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n * @event {{ source: 'close-button' | 'keyboard' | 'overlay' }} nile-request-close - Emitted when the user attempts to\n *   close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling\n *   `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in\n *   destructive behavior such as data loss.\n *\n * @csspart base - The component's base wrapper.\n * @csspart overlay - The overlay that covers the screen behind the drawer.\n * @csspart panel - The drawer's panel (where the drawer and its content are rendered).\n * @csspart header - The drawer's header. This element wraps the title and header actions.\n * @csspart header-actions - Optional actions to add to the header. Works best with `<nile-icon-button>`.\n * @csspart title - The drawer's title.\n * @csspart close-button - The close button, an `<nile-icon-button>`.\n * @csspart close-button__base - The close button's exported `base` part.\n * @csspart body - The drawer's body.\n * @csspart footer - The drawer's footer.\n *\n * @cssproperty --size - The preferred size of the drawer. This will be applied to the drawer's width or height\n *   depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens.\n * @cssproperty --header-spacing - The amount of padding to use for the header.\n * @cssproperty --body-spacing - The amount of padding to use for the body.\n * @cssproperty --footer-spacing - The amount of padding to use for the footer.\n *\n * @animation drawer.showTop - The animation to use when showing a drawer with `top` placement.\n * @animation drawer.showEnd - The animation to use when showing a drawer with `end` placement.\n * @animation drawer.showBottom - The animation to use when showing a drawer with `bottom` placement.\n * @animation drawer.showStart - The animation to use when showing a drawer with `start` placement.\n * @animation drawer.hideTop - The animation to use when hiding a drawer with `top` placement.\n * @animation drawer.hideEnd - The animation to use when hiding a drawer with `end` placement.\n * @animation drawer.hideBottom - The animation to use when hiding a drawer with `bottom` placement.\n * @animation drawer.hideStart - The animation to use when hiding a drawer with `start` placement.\n * @animation drawer.denyClose - The animation to use when a request to close the drawer is denied.\n * @animation drawer.overlay.show - The animation to use when showing the drawer's overlay.\n * @animation drawer.overlay.hide - The animation to use when hiding the drawer's overlay.\n */\n@customElement('nile-drawer')\nexport class NileDrawer extends NileElement {\n\n\tstatic styles: CSSResultGroup = styles;\n\n  private readonly hasSlotController = new HasSlotController(this, 'footer');\n  private modal: Modal;\n  private originalTrigger: HTMLElement | null;\n\n  @query('.drawer') drawer: HTMLElement;\n  @query('.drawer__panel') panel: HTMLElement;\n  @query('.drawer__overlay') overlay: HTMLElement;\n\n  /**\n   * Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\n   * use the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.\n   */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /**\n   * The drawer's label as displayed in the header. You should always include a relevant label even when using\n   * `no-header`, as it is required for proper accessibility. If you need to display HTML, use the `label` slot instead.\n   */\n  @property({ reflect: true }) label = '';\n\n  /** The direction from which the drawer will open. */\n  @property({ reflect: true }) placement: 'top' | 'end' | 'bottom' | 'start' = 'end';\n\n  /**\n   * By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of\n   * its parent element, set this attribute and add `position: relative` to the parent.\n   */\n  @property({ type: Boolean, reflect: true }) contained = false;\n\n  /**\n   * Removes the header. This will also remove the default close button, so please ensure you provide an easy,\n   * accessible way for users to dismiss the drawer.\n   */\n  @property({ attribute: 'no-header', type: Boolean, reflect: true }) noHeader = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n    this.modal = new Modal(this);\n  }\n\n  firstUpdated() {\n    this.drawer.hidden = !this.open;\n\n    if (this.open) {\n      this.addOpenListeners();\n\n      if (!this.contained) {\n        this.modal.activate();\n        lockBodyScrolling(this);\n      }\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    unlockBodyScrolling(this);\n  }\n\n  private requestClose(source: 'close-button' | 'keyboard' | 'overlay') {\n    const slRequestClose = this.emit('nile-request-close', {\n      cancelable: true,\n      detail: { source }\n    });\n\n    if (slRequestClose.defaultPrevented) {\n      const animation = getAnimation(this, 'drawer.denyClose', { dir: '' });\n      animateTo(this.panel, animation.keyframes, animation.options);\n      return;\n    }\n\n    this.hide();\n  }\n\n  private addOpenListeners() {\n    document.addEventListener('keydown', this.handleDocumentKeyDown);\n  }\n\n  private removeOpenListeners() {\n    document.removeEventListener('keydown', this.handleDocumentKeyDown);\n  }\n\n  private handleDocumentKeyDown(event: KeyboardEvent) {\n    if (this.open && !this.contained && event.key === 'Escape') {\n      event.stopPropagation();\n      this.requestClose('keyboard');\n    }\n  }\n\n  @watch('open', { waitUntilFirstUpdate: true })\n  async handleOpenChange() {\n    if (this.open) {\n      // Show\n      this.emit('nile-show');\n      this.addOpenListeners();\n      this.originalTrigger = document.activeElement as HTMLElement;\n\n      // Lock body scrolling only if the drawer isn't contained\n      if (!this.contained) {\n        this.modal.activate();\n        lockBodyScrolling(this);\n      }\n\n      // When the drawer is shown, Safari will attempt to set focus on whatever element has autofocus. This causes the\n      // drawer's animation to jitter, so we'll temporarily remove the attribute, call `focus({ preventScroll: true })`\n      // ourselves, and add the attribute back afterwards.\n      //\n      //\n      const autoFocusTarget = this.querySelector('[autofocus]');\n      if (autoFocusTarget) {\n        autoFocusTarget.removeAttribute('autofocus');\n      }\n\n      await Promise.all([stopAnimations(this.drawer), stopAnimations(this.overlay)]);\n      this.drawer.hidden = false;\n\n      // Set initial focus\n      requestAnimationFrame(() => {\n        const slInitialFocus = this.emit('nile-initial-focus', { cancelable: true });\n\n        if (!slInitialFocus.defaultPrevented) {\n          // Set focus to the autofocus target and restore the attribute\n          if (autoFocusTarget) {\n            (autoFocusTarget as HTMLInputElement).focus({ preventScroll: true });\n          } else {\n            this.panel.focus({ preventScroll: true });\n          }\n        }\n\n        // Restore the autofocus attribute\n        if (autoFocusTarget) {\n          autoFocusTarget.setAttribute('autofocus', '');\n        }\n      });\n\n      const panelAnimation = getAnimation(this, `drawer.show${uppercaseFirstLetter(this.placement)}`, {\n        dir: ''\n      });\n      const overlayAnimation = getAnimation(this, 'drawer.overlay.show', { dir: '' });\n      await Promise.all([\n        animateTo(this.panel, panelAnimation.keyframes, panelAnimation.options),\n        animateTo(this.overlay, overlayAnimation.keyframes, overlayAnimation.options)\n      ]);\n\n      this.emit('nile-after-show');\n    } else {\n      // Hide\n      this.emit('nile-hide');\n      this.removeOpenListeners();\n\n      if (!this.contained) {\n        this.modal.deactivate();\n        unlockBodyScrolling(this);\n      }\n\n      await Promise.all([stopAnimations(this.drawer), stopAnimations(this.overlay)]);\n      const panelAnimation = getAnimation(this, `drawer.hide${uppercaseFirstLetter(this.placement)}`, {\n        dir: ''\n      });\n      const overlayAnimation = getAnimation(this, 'drawer.overlay.hide', { dir: '' });\n\n      // Animate the overlay and the panel at the same time. Because animation durations might be different, we need to\n      // hide each one individually when the animation finishes, otherwise the first one that finishes will reappear\n      // unexpectedly. We'll unhide them after all animations have completed.\n      await Promise.all([\n        animateTo(this.overlay, overlayAnimation.keyframes, overlayAnimation.options).then(() => {\n          this.overlay.hidden = true;\n        }),\n        animateTo(this.panel, panelAnimation.keyframes, panelAnimation.options).then(() => {\n          this.panel.hidden = true;\n        })\n      ]);\n\n      this.drawer.hidden = true;\n\n      // Now that the dialog is hidden, restore the overlay and panel for next time\n      this.overlay.hidden = false;\n      this.panel.hidden = false;\n\n      // Restore focus to the original trigger\n      const trigger = this.originalTrigger;\n      if (typeof trigger?.focus === 'function') {\n        setTimeout(() => trigger.focus());\n      }\n\n      this.emit('nile-after-hide');\n    }\n  }\n\n  @watch('contained', { waitUntilFirstUpdate: true })\n  handleNoModalChange() {\n    if (this.open && !this.contained) {\n      this.modal.activate();\n      lockBodyScrolling(this);\n    }\n\n    if (this.open && this.contained) {\n      this.modal.deactivate();\n      unlockBodyScrolling(this);\n    }\n  }\n\n  /** Shows the drawer. */\n  async show() {\n    if (this.open) {\n      return undefined;\n    }\n\n    this.open = true;\n    return waitForEvent(this, 'nile-after-show');\n  }\n\n  /** Hides the drawer */\n  async hide() {\n    if (!this.open) {\n      return undefined;\n    }\n\n    this.open = false;\n    return waitForEvent(this, 'nile-after-hide');\n  }\n\n  render() {\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          drawer: true,\n          'drawer--open': this.open,\n          'drawer--top': this.placement === 'top',\n          'drawer--end': this.placement === 'end',\n          'drawer--bottom': this.placement === 'bottom',\n          'drawer--start': this.placement === 'start',\n          'drawer--contained': this.contained,\n          'drawer--fixed': !this.contained,\n          'drawer--rtl': 'rtl',\n          'drawer--has-footer': this.hasSlotController.test('footer')\n        })}\n      >\n        <div part=\"overlay\" class=\"drawer__overlay\" @click=${() => this.requestClose('overlay')} tabindex=\"-1\"></div>\n\n        <div\n          part=\"panel\"\n          class=\"drawer__panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden=${this.open ? 'false' : 'true'}\n          aria-label=${ifDefined(this.noHeader ? this.label : undefined)}\n          aria-labelledby=${ifDefined(!this.noHeader ? 'title' : undefined)}\n          tabindex=\"0\"\n        >\n          ${!this.noHeader\n            ? html`\n                <header part=\"header\" class=\"drawer__header\">\n                  <h2 part=\"title\" class=\"drawer__title\" id=\"title\">\n                    <!-- If there's no label, use an invisible character to prevent the header from collapsing -->\n                    <slot name=\"label\"> ${this.label.length > 0 ? this.label : String.fromCharCode(65279)} </slot>\n                  </h2>\n                  <div part=\"header-actions\" class=\"drawer__header-actions\">\n                    <slot name=\"header-actions\"></slot>\n                    <nile-icon-button\n                      part=\"close-button\"\n                      exportparts=\"base:close-button__base\"\n                      class=\"drawer__close\"\n                      name=\"close\"\n                      label='close'\n                      library=\"system\"\n                      @click=${() => this.requestClose('close-button')}\n                    ></nile-icon-button>\n                  </div>\n                </header>\n              `\n            : ''}\n\n          <slot part=\"body\" class=\"drawer__body\"></slot>\n\n          <footer part=\"footer\" class=\"drawer__footer\">\n            <slot name=\"footer\"></slot>\n          </footer>\n        </div>\n      </div>\n    `;\n  }\n}\n\n// Top\nsetDefaultAnimation('drawer.showTop', {\n  keyframes: [\n    { opacity: 0, translate: '0 -100%' },\n    { opacity: 1, translate: '0 0' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\nsetDefaultAnimation('drawer.hideTop', {\n  keyframes: [\n    { opacity: 1, translate: '0 0' },\n    { opacity: 0, translate: '0 -100%' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\n// End\nsetDefaultAnimation('drawer.showEnd', {\n  keyframes: [\n    { opacity: 0, translate: '100%' },\n    { opacity: 1, translate: '0' }\n  ],\n  rtlKeyframes: [\n    { opacity: 0, translate: '-100%' },\n    { opacity: 1, translate: '0' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\nsetDefaultAnimation('drawer.hideEnd', {\n  keyframes: [\n    { opacity: 1, translate: '0' },\n    { opacity: 0, translate: '100%' }\n  ],\n  rtlKeyframes: [\n    { opacity: 1, translate: '0' },\n    { opacity: 0, translate: '-100%' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\n// Bottom\nsetDefaultAnimation('drawer.showBottom', {\n  keyframes: [\n    { opacity: 0, translate: '0 100%' },\n    { opacity: 1, translate: '0 0' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\nsetDefaultAnimation('drawer.hideBottom', {\n  keyframes: [\n    { opacity: 1, translate: '0 0' },\n    { opacity: 0, translate: '0 100%' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\n// Start\nsetDefaultAnimation('drawer.showStart', {\n  keyframes: [\n    { opacity: 0, translate: '-100%' },\n    { opacity: 1, translate: '0' }\n  ],\n  rtlKeyframes: [\n    { opacity: 0, translate: '100%' },\n    { opacity: 1, translate: '0' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\nsetDefaultAnimation('drawer.hideStart', {\n  keyframes: [\n    { opacity: 1, translate: '0' },\n    { opacity: 0, translate: '-100%' }\n  ],\n  rtlKeyframes: [\n    { opacity: 1, translate: '0' },\n    { opacity: 0, translate: '100%' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\n// Deny close\nsetDefaultAnimation('drawer.denyClose', {\n  keyframes: [{ scale: 1 }, { scale: 1.01 }, { scale: 1 }],\n  options: { duration: 250 }\n});\n\n// Overlay\nsetDefaultAnimation('drawer.overlay.show', {\n  keyframes: [{ opacity: 0 }, { opacity: 1 }],\n  options: { duration: 250 }\n});\n\nsetDefaultAnimation('drawer.overlay.hide', {\n  keyframes: [{ opacity: 1 }, { opacity: 0 }],\n  options: { duration: 250 }\n});\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-drawer': NileDrawer;\n  }\n}\n"]}
+{"version":3,"file":"nile-drawer.js","sourceRoot":"","sources":["../../../src/nile-drawer/nile-drawer.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 '../nile-icon-button/nile-icon-button';\nimport { animateTo, stopAnimations } from '../internal/animate';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { getAnimation, setDefaultAnimation } from '../utilities/animation-registry';\nimport { HasSlotController } from '../internal/slot';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../internal/scroll';\nimport { uppercaseFirstLetter } from '../internal/string';\nimport { waitForEvent } from '../internal/event';\nimport { watch } from '../internal/watch';\nimport Modal from '../internal/modal';\nimport NileElement from '../internal/nile-element';\nimport styles from './nile-drawer.css';\nimport type { CSSResultGroup, TemplateResult } from 'lit';\n\n/**\n * Nile drawer component.\n *\n * @tag nile-drawer\n *\n * @summary Drawers slide in from a container to expose additional options and information.\n *\n * @dependency nile-icon-button\n *\n * @slot - The drawer's main content.\n * @slot label - The drawer's label. Alternatively, you can use the `label` attribute.\n * @slot header-actions - Optional actions to add to the header. Works best with `<nile-icon-button>`.\n * @slot footer - The drawer's footer, usually one or more buttons representing various options.\n *\n * @event nile-show - Emitted when the drawer opens.\n * @event nile-after-show - Emitted after the drawer opens and all animations are complete.\n * @event nile-hide - Emitted when the drawer closes.\n * @event nile-after-hide - Emitted after the drawer closes and all animations are complete.\n * @event nile-initial-focus - Emitted when the drawer opens and is ready to receive focus. Calling\n *   `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n * @event {{ source: 'close-button' | 'keyboard' | 'overlay' }} nile-request-close - Emitted when the user attempts to\n *   close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling\n *   `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in\n *   destructive behavior such as data loss.\n *\n * @csspart base - The component's base wrapper.\n * @csspart overlay - The overlay that covers the screen behind the drawer.\n * @csspart panel - The drawer's panel (where the drawer and its content are rendered).\n * @csspart header - The drawer's header. This element wraps the title and header actions.\n * @csspart header-actions - Optional actions to add to the header. Works best with `<nile-icon-button>`.\n * @csspart title - The drawer's title.\n * @csspart close-button - The close button, an `<nile-icon-button>`.\n * @csspart close-button__base - The close button's exported `base` part.\n * @csspart body - The drawer's body.\n * @csspart footer - The drawer's footer.\n *\n * @cssproperty --size - The preferred size of the drawer. This will be applied to the drawer's width or height\n *   depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens.\n * @cssproperty --header-spacing - The amount of padding to use for the header.\n * @cssproperty --body-spacing - The amount of padding to use for the body.\n * @cssproperty --footer-spacing - The amount of padding to use for the footer.\n *\n * @animation drawer.showTop - The animation to use when showing a drawer with `top` placement.\n * @animation drawer.showEnd - The animation to use when showing a drawer with `end` placement.\n * @animation drawer.showBottom - The animation to use when showing a drawer with `bottom` placement.\n * @animation drawer.showStart - The animation to use when showing a drawer with `start` placement.\n * @animation drawer.hideTop - The animation to use when hiding a drawer with `top` placement.\n * @animation drawer.hideEnd - The animation to use when hiding a drawer with `end` placement.\n * @animation drawer.hideBottom - The animation to use when hiding a drawer with `bottom` placement.\n * @animation drawer.hideStart - The animation to use when hiding a drawer with `start` placement.\n * @animation drawer.denyClose - The animation to use when a request to close the drawer is denied.\n * @animation drawer.overlay.show - The animation to use when showing the drawer's overlay.\n * @animation drawer.overlay.hide - The animation to use when hiding the drawer's overlay.\n */\n@customElement('nile-drawer')\nexport class NileDrawer extends NileElement {\n\n\tstatic styles: CSSResultGroup = styles;\n\n  private readonly hasSlotController = new HasSlotController(this, 'footer');\n  private modal: Modal;\n  private originalTrigger: HTMLElement | null;\n\n  @query('.drawer') drawer: HTMLElement;\n  @query('.drawer__panel') panel: HTMLElement;\n  @query('.drawer__overlay') overlay: HTMLElement;\n\n  /**\n   * Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\n   * use the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.\n   */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /**\n   * The drawer's label as displayed in the header. You should always include a relevant label even when using\n   * `no-header`, as it is required for proper accessibility. If you need to display HTML, use the `label` slot instead.\n   */\n  @property({ reflect: true }) label = '';\n\n  /** The direction from which the drawer will open. */\n  @property({ reflect: true }) placement: 'top' | 'end' | 'bottom' | 'start' = 'end';\n\n  /**\n   * By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of\n   * its parent element, set this attribute and add `position: relative` to the parent.\n   */\n  @property({ type: Boolean, reflect: true }) contained = false;\n\n  /**\n   * Removes the header. This will also remove the default close button, so please ensure you provide an easy,\n   * accessible way for users to dismiss the drawer.\n   */\n  @property({ attribute: 'no-header', type: Boolean, reflect: true }) noHeader = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n    this.modal = new Modal(this);\n  }\n\n  firstUpdated() {\n    this.drawer.hidden = !this.open;\n\n    if (this.open) {\n      this.addOpenListeners();\n\n      if (!this.contained) {\n        this.modal.activate();\n        lockBodyScrolling(this);\n      }\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    unlockBodyScrolling(this);\n  }\n\n  private requestClose(source: 'close-button' | 'keyboard' | 'overlay') {\n    const slRequestClose = this.emit('nile-request-close', {\n      cancelable: true,\n      detail: { source }\n    });\n\n    if (slRequestClose.defaultPrevented) {\n      const animation = getAnimation(this, 'drawer.denyClose', { dir: '' });\n      animateTo(this.panel, animation.keyframes, animation.options);\n      return;\n    }\n\n    this.hide();\n  }\n\n  private addOpenListeners() {\n    document.addEventListener('keydown', this.handleDocumentKeyDown);\n  }\n\n  private removeOpenListeners() {\n    document.removeEventListener('keydown', this.handleDocumentKeyDown);\n  }\n\n  private handleDocumentKeyDown(event: KeyboardEvent) {\n    if (this.open && !this.contained && event.key === 'Escape') {\n      event.stopPropagation();\n      this.requestClose('keyboard');\n    }\n  }\n\n  @watch('open', { waitUntilFirstUpdate: true })\n  async handleOpenChange() {\n    if (this.open) {\n      // Show\n      this.emit('nile-show');\n      this.addOpenListeners();\n      this.originalTrigger = document.activeElement as HTMLElement;\n\n      // Lock body scrolling only if the drawer isn't contained\n      if (!this.contained) {\n        this.modal.activate();\n        lockBodyScrolling(this);\n      }\n\n      // When the drawer is shown, Safari will attempt to set focus on whatever element has autofocus. This causes the\n      // drawer's animation to jitter, so we'll temporarily remove the attribute, call `focus({ preventScroll: true })`\n      // ourselves, and add the attribute back afterwards.\n      //\n      //\n      const autoFocusTarget = this.querySelector('[autofocus]');\n      if (autoFocusTarget) {\n        autoFocusTarget.removeAttribute('autofocus');\n      }\n\n      await Promise.all([stopAnimations(this.drawer), stopAnimations(this.overlay)]);\n      this.drawer.hidden = false;\n\n      // Set initial focus\n      requestAnimationFrame(() => {\n        const slInitialFocus = this.emit('nile-initial-focus', { cancelable: true });\n\n        if (!slInitialFocus.defaultPrevented) {\n          // Set focus to the autofocus target and restore the attribute\n          if (autoFocusTarget) {\n            (autoFocusTarget as HTMLInputElement).focus({ preventScroll: true });\n          } else {\n            this.panel.focus({ preventScroll: true });\n          }\n        }\n\n        // Restore the autofocus attribute\n        if (autoFocusTarget) {\n          autoFocusTarget.setAttribute('autofocus', '');\n        }\n      });\n\n      const panelAnimation = getAnimation(this, `drawer.show${uppercaseFirstLetter(this.placement)}`, {\n        dir: ''\n      });\n      const overlayAnimation = getAnimation(this, 'drawer.overlay.show', { dir: '' });\n      await Promise.all([\n        animateTo(this.panel, panelAnimation.keyframes, panelAnimation.options),\n        animateTo(this.overlay, overlayAnimation.keyframes, overlayAnimation.options)\n      ]);\n\n      this.emit('nile-after-show');\n    } else {\n      // Hide\n      this.emit('nile-hide');\n      this.removeOpenListeners();\n\n      if (!this.contained) {\n        this.modal.deactivate();\n        unlockBodyScrolling(this);\n      }\n\n      await Promise.all([stopAnimations(this.drawer), stopAnimations(this.overlay)]);\n      const panelAnimation = getAnimation(this, `drawer.hide${uppercaseFirstLetter(this.placement)}`, {\n        dir: ''\n      });\n      const overlayAnimation = getAnimation(this, 'drawer.overlay.hide', { dir: '' });\n\n      // Animate the overlay and the panel at the same time. Because animation durations might be different, we need to\n      // hide each one individually when the animation finishes, otherwise the first one that finishes will reappear\n      // unexpectedly. We'll unhide them after all animations have completed.\n      await Promise.all([\n        animateTo(this.overlay, overlayAnimation.keyframes, overlayAnimation.options).then(() => {\n          this.overlay.hidden = true;\n        }),\n        animateTo(this.panel, panelAnimation.keyframes, panelAnimation.options).then(() => {\n          this.panel.hidden = true;\n        })\n      ]);\n\n      this.drawer.hidden = true;\n\n      // Now that the dialog is hidden, restore the overlay and panel for next time\n      this.overlay.hidden = false;\n      this.panel.hidden = false;\n\n      // Restore focus to the original trigger\n      const trigger = this.originalTrigger;\n      if (typeof trigger?.focus === 'function') {\n        setTimeout(() => trigger.focus());\n      }\n\n      this.emit('nile-after-hide');\n    }\n  }\n\n  @watch('contained', { waitUntilFirstUpdate: true })\n  handleNoModalChange() {\n    if (this.open && !this.contained) {\n      this.modal.activate();\n      lockBodyScrolling(this);\n    }\n\n    if (this.open && this.contained) {\n      this.modal.deactivate();\n      unlockBodyScrolling(this);\n    }\n  }\n\n  /** Shows the drawer. */\n  async show() {\n    if (this.open) {\n      return undefined;\n    }\n\n    this.open = true;\n    return waitForEvent(this, 'nile-after-show');\n  }\n\n  /** Hides the drawer */\n  async hide() {\n    if (!this.open) {\n      return undefined;\n    }\n\n    this.open = false;\n    return waitForEvent(this, 'nile-after-hide');\n  }\n\n  render() {\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          drawer: true,\n          'drawer--open': this.open,\n          'drawer--top': this.placement === 'top',\n          'drawer--end': this.placement === 'end',\n          'drawer--bottom': this.placement === 'bottom',\n          'drawer--start': this.placement === 'start',\n          'drawer--contained': this.contained,\n          'drawer--fixed': !this.contained,\n          'drawer--rtl': 'rtl',\n          'drawer--has-footer': this.hasSlotController.test('footer'),\n        })}\n      >\n        <div\n          part=\"overlay\"\n          class=\"drawer__overlay\"\n          @click=${() => this.requestClose('overlay')}\n          tabindex=\"-1\"\n        ></div>\n\n        <div\n          part=\"panel\"\n          class=\"drawer__panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden=${this.open ? 'false' : 'true'}\n          aria-label=${ifDefined(this.noHeader ? this.label : undefined)}\n          aria-labelledby=${ifDefined(!this.noHeader ? 'title' : undefined)}\n          tabindex=\"0\"\n        >\n          ${!this.noHeader\n            ? html`\n                <header part=\"header\" class=\"drawer__header\">\n                  <h2 part=\"title\" class=\"drawer__title\" id=\"title\">\n                    <!-- If there's no label, use an invisible character to prevent the header from collapsing -->\n                    <slot name=\"label\">\n                      ${this.label.length > 0\n                        ? this.label\n                        : String.fromCharCode(65279)}\n                    </slot>\n                  </h2>\n                  <div part=\"header-actions\" class=\"drawer__header-actions\">\n                    <slot name=\"header-actions\"></slot>\n                    <nile-icon\n                      class=\"drawer__close\"\n                      name=\"close\"\n                      label=\"close\"\n                      part=\"close-button\"\n                      exportparts=\"base:close-button__base\"\n                      color=\"var(--nile-drawer-remove-icon-color)\"\n                      @click=${() => this.requestClose('close-button')}\n                    ></nile-icon>\n                  </div>\n                </header>\n              `\n            : ''}\n\n          <slot part=\"body\" class=\"drawer__body\"></slot>\n\n          <footer part=\"footer\" class=\"drawer__footer\">\n            <slot name=\"footer\"></slot>\n          </footer>\n        </div>\n      </div>\n    `;\n  }\n}\n\n// Top\nsetDefaultAnimation('drawer.showTop', {\n  keyframes: [\n    { opacity: 0, translate: '0 -100%' },\n    { opacity: 1, translate: '0 0' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\nsetDefaultAnimation('drawer.hideTop', {\n  keyframes: [\n    { opacity: 1, translate: '0 0' },\n    { opacity: 0, translate: '0 -100%' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\n// End\nsetDefaultAnimation('drawer.showEnd', {\n  keyframes: [\n    { opacity: 0, translate: '100%' },\n    { opacity: 1, translate: '0' }\n  ],\n  rtlKeyframes: [\n    { opacity: 0, translate: '-100%' },\n    { opacity: 1, translate: '0' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\nsetDefaultAnimation('drawer.hideEnd', {\n  keyframes: [\n    { opacity: 1, translate: '0' },\n    { opacity: 0, translate: '100%' }\n  ],\n  rtlKeyframes: [\n    { opacity: 1, translate: '0' },\n    { opacity: 0, translate: '-100%' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\n// Bottom\nsetDefaultAnimation('drawer.showBottom', {\n  keyframes: [\n    { opacity: 0, translate: '0 100%' },\n    { opacity: 1, translate: '0 0' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\nsetDefaultAnimation('drawer.hideBottom', {\n  keyframes: [\n    { opacity: 1, translate: '0 0' },\n    { opacity: 0, translate: '0 100%' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\n// Start\nsetDefaultAnimation('drawer.showStart', {\n  keyframes: [\n    { opacity: 0, translate: '-100%' },\n    { opacity: 1, translate: '0' }\n  ],\n  rtlKeyframes: [\n    { opacity: 0, translate: '100%' },\n    { opacity: 1, translate: '0' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\nsetDefaultAnimation('drawer.hideStart', {\n  keyframes: [\n    { opacity: 1, translate: '0' },\n    { opacity: 0, translate: '-100%' }\n  ],\n  rtlKeyframes: [\n    { opacity: 1, translate: '0' },\n    { opacity: 0, translate: '100%' }\n  ],\n  options: { duration: 250, easing: 'ease' }\n});\n\n// Deny close\nsetDefaultAnimation('drawer.denyClose', {\n  keyframes: [{ scale: 1 }, { scale: 1.01 }, { scale: 1 }],\n  options: { duration: 250 }\n});\n\n// Overlay\nsetDefaultAnimation('drawer.overlay.show', {\n  keyframes: [{ opacity: 0 }, { opacity: 1 }],\n  options: { duration: 250 }\n});\n\nsetDefaultAnimation('drawer.overlay.hide', {\n  keyframes: [{ opacity: 1 }, { opacity: 0 }],\n  options: { duration: 250 }\n});\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-drawer': NileDrawer;\n  }\n}\n"]}

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

@@ -11,21 +11,22 @@ import { css } from 'lit-element';
 export const styles = css `
   :host {
     display: inline-block;
-    --nile-remove-icon-color: var(--nile-colors-blue-500);
   }
 
   .tag {
     display: flex;
     align-items: center;
-    justify-items: center;
-    text-align: center;
-    gap: 3px;
+    border: solid 2px;
+    line-height: 1;
     white-space: nowrap;
     user-select: none;
     border-radius: 4px;
-    box-sizing: border-box;
-    color: var(--colors-text-text-secondary-700, #344054);
-    font-family: var(--nile-font-family-serif);
+    gap: 6px;
+  }
+
+  .tag__remove::part(base) {
+    color: inherit;
+    padding: 0;
   }
 
   /*
@@ -33,120 +34,101 @@ export const styles = css `
    */
 
   .tag--primary {
-    background: #005ea6;
-    color: #fff;
-    --nile-remove-icon-color: var(--nile-colors-blue-500);
+    background: #005EA6;
+    border-color: #005EA6;
+    border: 2px solid  #005EA6;
+    color: #FFF;
   }
 
   .tag--primary:hover {
-    outline: 2px solid rgba(0, 94, 166, 0.5);
+    border: 2px solid rgba(0, 94, 166, 0.50);
   }
 
-  .tag--primary:active > nile-icon {
+  .tag--primary:active > nile-icon-button {
     color: hsl(200.4 98% 39.4%);
   }
 
   .tag--success {
-    background: #a5f3e1;
+    background: #A5F3E1;
+    border: 2px solid #A5F3E1;
     color: #000;
-    --nile-remove-icon-color: var(--nile-colors-green-500);
   }
 
   .tag--success:hover {
-    outline: 2px solid #43e5c0;
+    border: 2px solid #43E5C0;
   }
 
-  .tag--success:active > nile-icon {
+  .tag--success:active > nile-icon-button {
     color: hsl(142.1 76.2% 36.3%);
   }
 
   .tag--normal {
-    background: #e5e9eb;
+    background: #E5E9EB;
+    border: 2px solid #E5E9EB;
     color: #000;
-    --nile-remove-icon-color: var(--nile-colors-dark-500);
   }
 
   .tag--normal:hover {
-    outline: 2px solid #c7ced4;
+    border: 2px solid #C7CED4;
   }
 
-  .tag--normal:active > nile-icon {
+
+  .tag--normal:active > nile-icon-button {
     color: hsl(240 5.2% 33.9%);
   }
 
   .tag--warning {
-    background: #f3e0a5;
+    background: #F3E0A5;
+    border: 2px solid #F3E0A5;
     color: #000;
-    --nile-remove-icon-color: var(--nile-colors-yellow-500);
   }
 
   .tag--warning:hover {
-    outline: 2px solid #e5bf43;
+    border: 2px solid #E5BF43;
   }
 
-  .tag--warning:active > nile-icon {
+  .tag--warning:active > nile-icon-button {
     color: hsl(32.1 94.6% 43.7%);
   }
 
+
   .tag--error {
-    background: #f3a5aa;
+    background: #F3A5AA;
+    border: 2px solid #F3A5AA;
     color: #000;
-    --nile-remove-icon-color: var(--nile-colors-red-500);
   }
 
   .tag--error:hover {
-    outline: 2px solid #e5434d;
+    border: 2px solid #E5434D;
   }
 
-  .tag--error:active > nile-icon {
+  .tag--error:active > nile-icon-button {
     color: hsl(0 72.2% 50.6%);
   }
 
   .tag--info {
-    background: #a5d3f3;
+    background: #A5D3F3;
+    border: 2px solid #A5D3F3;
     color: #000000;
-    --nile-remove-icon-color: var(--nile-colors-blue-500);
   }
 
   .tag--info:hover {
-    outline: 2px solid #42a3e5;
+    border: 2px solid #42A3E5;
   }
 
-  .tag--info:active > nile-icon {
+  .tag--info:active > nile-icon-button {
     color: hsl(0 72.2% 50.6%);
   }
 
-  .tag--gray {
-    background: var(--nile-tag-gray-background-color);
-    border: 1px solid var(--nile-colors-gray-light-mode-300);
-    color: var(--nile-tag-gray-color);
-    --nile-remove-icon-color: var(--nile-tag-gray-x-color);
-  }
-
-  .tag--gray:hover {
-    background-color: var(--nile-tag-gray-hover-background-color);
-  }
-
-  /* .tag--gray:active > nile-icon {
-    color: #101828;
-  } */
-
-  .tag--small {
-    height: 24px;
-    padding: 3px 8px;
-    font-size: 12px;
-    font-style: normal;
-    font-weight: 500;
-    line-height: 18px;
-  }
 
   .tag--medium {
-    height: 24px;
-    padding: 2px 9px;
     font-size: 14px;
-    font-style: normal;
-    font-weight: 500;
-    line-height: 20px;
+    height: 26px;
+    padding: 0 0.75rem;
+  }
+
+  .tag__remove {
+    margin-inline-start: 0.5rem;
   }
 
   /*
@@ -157,37 +139,14 @@ export const styles = css `
     border-radius: 9999px;
   }
 
-  .tag__content {
-    display: inline-block;
-  }
-
-  .tag--medium .tag__remove-wrapper {
-    display: inline-flex;
-    justify-content: centre;
-    box-sizing: border-box;
-    height: 16px;
-    width: 16px;
-    padding: 2px;
-  }
+  .tag__prefix {
+  padding: 3px 6px;
+}
 
-  .tag--small .tag__remove-wrapper {
-    display: inline-flex;
-    justify-content: centre;
-    box-sizing: border-box;
-    height: 14px;
-    width: 14px;
-    padding: 2px;
-  }
+ .tag__content {
+  font-size: 14px;
+}
 
-  .tag--removable {
-    padding: 2px 2px 2px 9px;
-  }
-
-  .tag__remove:hover {
-    cursor: pointer;
-    --nile-remove-icon-color: #101828;
-    color: red;
-  }
 `;
 export default [styles];
 //# sourceMappingURL=nile-tag.css.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"nile-tag.css.js","sourceRoot":"","sources":["../../../src/nile-tag/nile-tag.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoLxB,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 * Tag CSS\n */\nexport const styles = css`\n  :host {\n    display: inline-block;\n    --nile-remove-icon-color: var(--nile-colors-blue-500);\n  }\n\n  .tag {\n    display: flex;\n    align-items: center;\n    justify-items: center;\n    text-align: center;\n    gap: 3px;\n    white-space: nowrap;\n    user-select: none;\n    border-radius: 4px;\n    box-sizing: border-box;\n    color: var(--colors-text-text-secondary-700, #344054);\n    font-family: var(--nile-font-family-serif);\n  }\n\n  /*\n   * Variant modifiers\n   */\n\n  .tag--primary {\n    background: #005ea6;\n    color: #fff;\n    --nile-remove-icon-color: var(--nile-colors-blue-500);\n  }\n\n  .tag--primary:hover {\n    outline: 2px solid rgba(0, 94, 166, 0.5);\n  }\n\n  .tag--primary:active > nile-icon {\n    color: hsl(200.4 98% 39.4%);\n  }\n\n  .tag--success {\n    background: #a5f3e1;\n    color: #000;\n    --nile-remove-icon-color: var(--nile-colors-green-500);\n  }\n\n  .tag--success:hover {\n    outline: 2px solid #43e5c0;\n  }\n\n  .tag--success:active > nile-icon {\n    color: hsl(142.1 76.2% 36.3%);\n  }\n\n  .tag--normal {\n    background: #e5e9eb;\n    color: #000;\n    --nile-remove-icon-color: var(--nile-colors-dark-500);\n  }\n\n  .tag--normal:hover {\n    outline: 2px solid #c7ced4;\n  }\n\n  .tag--normal:active > nile-icon {\n    color: hsl(240 5.2% 33.9%);\n  }\n\n  .tag--warning {\n    background: #f3e0a5;\n    color: #000;\n    --nile-remove-icon-color: var(--nile-colors-yellow-500);\n  }\n\n  .tag--warning:hover {\n    outline: 2px solid #e5bf43;\n  }\n\n  .tag--warning:active > nile-icon {\n    color: hsl(32.1 94.6% 43.7%);\n  }\n\n  .tag--error {\n    background: #f3a5aa;\n    color: #000;\n    --nile-remove-icon-color: var(--nile-colors-red-500);\n  }\n\n  .tag--error:hover {\n    outline: 2px solid #e5434d;\n  }\n\n  .tag--error:active > nile-icon {\n    color: hsl(0 72.2% 50.6%);\n  }\n\n  .tag--info {\n    background: #a5d3f3;\n    color: #000000;\n    --nile-remove-icon-color: var(--nile-colors-blue-500);\n  }\n\n  .tag--info:hover {\n    outline: 2px solid #42a3e5;\n  }\n\n  .tag--info:active > nile-icon {\n    color: hsl(0 72.2% 50.6%);\n  }\n\n  .tag--gray {\n    background: var(--nile-tag-gray-background-color);\n    border: 1px solid var(--nile-colors-gray-light-mode-300);\n    color: var(--nile-tag-gray-color);\n    --nile-remove-icon-color: var(--nile-tag-gray-x-color);\n  }\n\n  .tag--gray:hover {\n    background-color: var(--nile-tag-gray-hover-background-color);\n  }\n\n  /* .tag--gray:active > nile-icon {\n    color: #101828;\n  } */\n\n  .tag--small {\n    height: 24px;\n    padding: 3px 8px;\n    font-size: 12px;\n    font-style: normal;\n    font-weight: 500;\n    line-height: 18px;\n  }\n\n  .tag--medium {\n    height: 24px;\n    padding: 2px 9px;\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 500;\n    line-height: 20px;\n  }\n\n  /*\n   * Pill modifier\n   */\n\n  .tag--pill {\n    border-radius: 9999px;\n  }\n\n  .tag__content {\n    display: inline-block;\n  }\n\n  .tag--medium .tag__remove-wrapper {\n    display: inline-flex;\n    justify-content: centre;\n    box-sizing: border-box;\n    height: 16px;\n    width: 16px;\n    padding: 2px;\n  }\n\n  .tag--small .tag__remove-wrapper {\n    display: inline-flex;\n    justify-content: centre;\n    box-sizing: border-box;\n    height: 14px;\n    width: 14px;\n    padding: 2px;\n  }\n\n  .tag--removable {\n    padding: 2px 2px 2px 9px;\n  }\n\n  .tag__remove:hover {\n    cursor: pointer;\n    --nile-remove-icon-color: #101828;\n    color: red;\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-tag.css.js","sourceRoot":"","sources":["../../../src/nile-tag/nile-tag.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2IxB,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 * Tag CSS\n */\nexport const styles = css`\n  :host {\n    display: inline-block;\n  }\n\n  .tag {\n    display: flex;\n    align-items: center;\n    border: solid 2px;\n    line-height: 1;\n    white-space: nowrap;\n    user-select: none;\n    border-radius: 4px;\n    gap: 6px;\n  }\n\n  .tag__remove::part(base) {\n    color: inherit;\n    padding: 0;\n  }\n\n  /*\n   * Variant modifiers\n   */\n\n  .tag--primary {\n    background: #005EA6;\n    border-color: #005EA6;\n    border: 2px solid  #005EA6;\n    color: #FFF;\n  }\n\n  .tag--primary:hover {\n    border: 2px solid rgba(0, 94, 166, 0.50);\n  }\n\n  .tag--primary:active > nile-icon-button {\n    color: hsl(200.4 98% 39.4%);\n  }\n\n  .tag--success {\n    background: #A5F3E1;\n    border: 2px solid #A5F3E1;\n    color: #000;\n  }\n\n  .tag--success:hover {\n    border: 2px solid #43E5C0;\n  }\n\n  .tag--success:active > nile-icon-button {\n    color: hsl(142.1 76.2% 36.3%);\n  }\n\n  .tag--normal {\n    background: #E5E9EB;\n    border: 2px solid #E5E9EB;\n    color: #000;\n  }\n\n  .tag--normal:hover {\n    border: 2px solid #C7CED4;\n  }\n\n\n  .tag--normal:active > nile-icon-button {\n    color: hsl(240 5.2% 33.9%);\n  }\n\n  .tag--warning {\n    background: #F3E0A5;\n    border: 2px solid #F3E0A5;\n    color: #000;\n  }\n\n  .tag--warning:hover {\n    border: 2px solid #E5BF43;\n  }\n\n  .tag--warning:active > nile-icon-button {\n    color: hsl(32.1 94.6% 43.7%);\n  }\n\n\n  .tag--error {\n    background: #F3A5AA;\n    border: 2px solid #F3A5AA;\n    color: #000;\n  }\n\n  .tag--error:hover {\n    border: 2px solid #E5434D;\n  }\n\n  .tag--error:active > nile-icon-button {\n    color: hsl(0 72.2% 50.6%);\n  }\n\n  .tag--info {\n    background: #A5D3F3;\n    border: 2px solid #A5D3F3;\n    color: #000000;\n  }\n\n  .tag--info:hover {\n    border: 2px solid #42A3E5;\n  }\n\n  .tag--info:active > nile-icon-button {\n    color: hsl(0 72.2% 50.6%);\n  }\n\n\n  .tag--medium {\n    font-size: 14px;\n    height: 26px;\n    padding: 0 0.75rem;\n  }\n\n  .tag__remove {\n    margin-inline-start: 0.5rem;\n  }\n\n  /*\n   * Pill modifier\n   */\n\n  .tag--pill {\n    border-radius: 9999px;\n  }\n\n  .tag__prefix {\n  padding: 3px 6px;\n}\n\n .tag__content {\n  font-size: 14px;\n}\n\n`;\n\nexport default [styles];\n"]}

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

@@ -32,7 +32,7 @@ import type { CSSResultGroup } from 'lit';
 export declare class NileTag extends NileElement {
     static styles: CSSResultGroup;
     /** The tag's theme variant. */
-    variant: 'primary' | 'success' | 'normal' | 'warning' | 'error' | 'info' | 'gray';
+    variant: 'primary' | 'success' | 'normal' | 'warning' | 'error' | 'info';
     /** The tag's size. */
     size: 'small' | 'medium' | 'large';
     /** Draws a pill-style tag with rounded edges. */
@@ -40,6 +40,7 @@ export declare class NileTag extends NileElement {
     /** Makes the tag removable and shows a remove button. */
     removable: boolean;
     private handleRemoveClick;
+    getCloseButtonColor(): "--nile-colors-blue-500" | "--nile-colors-green-500" | "--nile-colors-dark-500" | "--nile-colors-yellow-500" | "--nile-colors-red-500";
     render(): TemplateResult<1>;
 }
 export default NileTag;

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

@@ -47,7 +47,26 @@ let NileTag = class NileTag extends NileElement {
     handleRemoveClick() {
         this.emit('nile-remove');
     }
+    getCloseButtonColor() {
+        switch (this.variant) {
+            case 'primary':
+                return '--nile-colors-blue-500';
+            case 'success':
+                return '--nile-colors-green-500';
+            case 'normal':
+                return '--nile-colors-dark-500';
+            case 'warning':
+                return '--nile-colors-yellow-500';
+            case 'error':
+                return '--nile-colors-red-500';
+            case 'info':
+                return '--nile-colors-blue-500';
+            default:
+                return '--nile-colors-dark-500';
+        }
+    }
     render() {
+        const colorVariable = this.getCloseButtonColor();
         return html `
       <span
         part="base"
@@ -60,7 +79,6 @@ let NileTag = class NileTag extends NileElement {
             'tag--warning': this.variant === 'warning',
             'tag--error': this.variant === 'error',
             'tag--info': this.variant === 'info',
-            'tag--gray': this.variant === 'gray',
             // Sizes
             'tag--small': this.size === 'small',
             'tag--medium': this.size === 'medium',
@@ -76,18 +94,17 @@ let NileTag = class NileTag extends NileElement {
 
         ${this.removable
             ? html `
-          <span class="tag__remove-wrapper">
-              <nile-icon 
-              name="close"
-              part="remove-button"
-              exportparts="base:remove-button__base"
-              class="tag__remove"
-              @click=${this.handleRemoveClick}
-              tabindex="-1"
-              color="var(--nile-remove-icon-color)"
-              size="${this.size === 'small' ? '10' : '12'}"
-              /> </nile-icon>
-          </span>
+              <nile-icon-button
+                part="remove-button"
+                exportparts="base:remove-button__base"
+                name="close"
+                library="system"
+                label="remove"
+                class="tag__remove"
+                @click=${this.handleRemoveClick}
+                tabindex="-1"
+                color="var(${colorVariable})"
+              ></nile-icon-button>
             `
             : ''}
       </span>

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

@@ -1 +1 @@
-{"version":3,"file":"nile-tag.js","sourceRoot":"","sources":["../../../src/nile-tag/nile-tag.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,EACJ,QAAQ,GAGT,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AACxC,OAAO,sCAAsC,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAEnD;;;;;GAKG;AAEH;;;;;;;;;;;;;;GAcG;AAGI,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,WAAW;IAAjC;;QAGL,+BAA+B;QACF,YAAO,GAOvB,QAAQ,CAAC;QAEtB,sBAAsB;QACO,SAAI,GAAiC,QAAQ,CAAC;QAE3E,iDAAiD;QACL,SAAI,GAAG,KAAK,CAAC;QAEzD,yDAAyD;QAC5B,cAAS,GAAG,KAAK,CAAC;IAuDjD,CAAC;IArDS,iBAAiB;QACvB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IAC3B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;gBAGC,QAAQ,CAAC;YACf,GAAG,EAAE,IAAI;YAET,QAAQ;YACR,cAAc,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YAC1C,cAAc,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YAC1C,aAAa,EAAE,IAAI,CAAC,OAAO,KAAK,QAAQ;YACxC,cAAc,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YAC1C,YAAY,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO;YACtC,WAAW,EAAE,IAAI,CAAC,OAAO,KAAK,MAAM;YACpC,WAAW,EAAE,IAAI,CAAC,OAAO,KAAK,MAAM;YAEpC,QAAQ;YACR,YAAY,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;YACnC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;YACrC,YAAY,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;YAEnC,YAAY;YACZ,WAAW,EAAE,IAAI,CAAC,IAAI;YACtB,gBAAgB,EAAE,IAAI,CAAC,SAAS;SACjC,CAAC;;;;;;UAMA,IAAI,CAAC,SAAS;YACd,CAAC,CAAC,IAAI,CAAA;;;;;;;uBAOO,IAAI,CAAC,iBAAiB;;;sBAGvB,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI;;;aAG5C;YACH,CAAC,CAAC,EAAE;;KAET,CAAC;IACJ,CAAC;;AAzEM,cAAM,GAAmB,MAAM,CAAC;AAGV;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCAON;AAGO;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCAA+C;AAG/B;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCAAc;AAG5B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CAAmB;AApBpC,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CA2EnB;SA3EY,OAAO;AA6EpB,eAAe,OAAO,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  LitElement,\n  html,\n  property,\n  CSSResultArray,\n  TemplateResult,\n} from 'lit-element';\nimport { styles } from './nile-tag.css';\nimport '../nile-icon-button/nile-icon-button';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement } from 'lit/decorators.js';\nimport NileElement from '../internal/nile-element';\nimport type { CSSResultGroup } from 'lit';\n/**\n * Nile icon component.\n *\n * @tag nile-tag\n *\n */\n\n/**\n * @summary Tags are used as labels to organize things or to indicate a selection.\n * @status stable\n *\n * @dependency nile-icon-button\n *\n * @slot - The tag's content.\n *\n * @event nile-remove - Emitted when the remove button is activated.\n *\n * @csspart base - The component's base wrapper.\n * @csspart content - The tag's content.\n * @csspart remove-button - The tag's remove button, an `<nile-icon-button>`.\n * @csspart remove-button__base - The remove button's exported `base` part.\n */\n\n@customElement('nile-tag')\nexport class NileTag extends NileElement {\n  static styles: CSSResultGroup = styles;\n\n  /** The tag's theme variant. */\n  @property({ reflect: true }) variant:\n    | 'primary'\n    | 'success'\n    | 'normal'\n    | 'warning'\n    | 'error'\n    | 'info'\n    | 'gray' = 'normal';\n\n  /** The tag's size. */\n  @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /** Draws a pill-style tag with rounded edges. */\n  @property({ type: Boolean, reflect: true }) pill = false;\n\n  /** Makes the tag removable and shows a remove button. */\n  @property({ type: Boolean }) removable = false;\n\n  private handleRemoveClick() {\n    this.emit('nile-remove');\n  }\n  \n  render() {\n    return html`\n      <span\n        part=\"base\"\n        class=${classMap({\n          tag: true,\n\n          // Types\n          'tag--primary': this.variant === 'primary',\n          'tag--success': this.variant === 'success',\n          'tag--normal': this.variant === 'normal',\n          'tag--warning': this.variant === 'warning',\n          'tag--error': this.variant === 'error',\n          'tag--info': this.variant === 'info',\n          'tag--gray': this.variant === 'gray',\n\n          // Sizes\n          'tag--small': this.size === 'small',\n          'tag--medium': this.size === 'medium',\n          'tag--large': this.size === 'large',\n\n          // Modifiers\n          'tag--pill': this.pill,\n          'tag--removable': this.removable,\n        })}\n      >\n        <slot name=\"prefix\" part=\"prefix\" class=\"tag__prefix\"></slot>\n\n        <slot part=\"content\" class=\"tag__content\"></slot>\n\n        ${this.removable\n          ? html`\n          <span class=\"tag__remove-wrapper\">\n              <nile-icon \n              name=\"close\"\n              part=\"remove-button\"\n              exportparts=\"base:remove-button__base\"\n              class=\"tag__remove\"\n              @click=${this.handleRemoveClick}\n              tabindex=\"-1\"\n              color=\"var(--nile-remove-icon-color)\"\n              size=\"${this.size === 'small' ? '10' : '12'}\"\n              /> </nile-icon>\n          </span>\n            `\n          : ''}\n      </span>\n    `;\n  }\n}\n\nexport default NileTag;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-tag': NileTag;\n  }\n}\n"]}
+{"version":3,"file":"nile-tag.js","sourceRoot":"","sources":["../../../src/nile-tag/nile-tag.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,EACJ,QAAQ,GAGT,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AACxC,OAAO,sCAAsC,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAEnD;;;;;GAKG;AAEH;;;;;;;;;;;;;;GAcG;AAGI,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,WAAW;IAAjC;;QAGL,+BAA+B;QACF,YAAO,GAMvB,QAAQ,CAAC;QAEtB,sBAAsB;QACO,SAAI,GAAiC,QAAQ,CAAC;QAE3E,iDAAiD;QACL,SAAI,GAAG,KAAK,CAAC;QAEzD,yDAAyD;QAC5B,cAAS,GAAG,KAAK,CAAC;IA2EjD,CAAC;IAzES,iBAAiB;QACvB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IAC3B,CAAC;IAED,mBAAmB;QACjB,QAAQ,IAAI,CAAC,OAAO,EAAE;YACpB,KAAK,SAAS;gBACZ,OAAQ,wBAAwB,CAAC;YACnC,KAAK,SAAS;gBACZ,OAAO,yBAAyB,CAAC;YACnC,KAAK,QAAQ;gBACX,OAAO,wBAAwB,CAAC;YAClC,KAAK,SAAS;gBACZ,OAAO,0BAA0B,CAAC;YACpC,KAAK,OAAO;gBACV,OAAO,uBAAuB,CAAC;YACjC,KAAK,MAAM;gBACT,OAAO,wBAAwB,CAAC;YAClC;gBACE,OAAO,wBAAwB,CAAC;SACnC;IACH,CAAC;IAGD,MAAM;QACJ,MAAM,aAAa,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC;QACjD,OAAO,IAAI,CAAA;;;gBAGC,QAAQ,CAAC;YACf,GAAG,EAAE,IAAI;YAET,QAAQ;YACR,cAAc,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YAC1C,cAAc,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YAC1C,aAAa,EAAE,IAAI,CAAC,OAAO,KAAK,QAAQ;YACxC,cAAc,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;YAC1C,YAAY,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO;YACtC,WAAW,EAAE,IAAI,CAAC,OAAO,KAAK,MAAM;YAEpC,QAAQ;YACR,YAAY,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;YACnC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;YACrC,YAAY,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;YAEnC,YAAY;YACZ,WAAW,EAAE,IAAI,CAAC,IAAI;YACtB,gBAAgB,EAAE,IAAI,CAAC,SAAS;SAEjC,CAAC;;;;;;UAMA,IAAI,CAAC,SAAS;YACd,CAAC,CAAC,IAAI,CAAA;;;;;;;;yBAQS,IAAI,CAAC,iBAAiB;;6BAElB,aAAa;;aAE7B;YACH,CAAC,CAAC,EAAE;;KAET,CAAC;IACJ,CAAC;;AA5FM,cAAM,GAAmB,MAAM,CAAC;AAGV;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCAMN;AAGO;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCAA+C;AAG/B;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCAAc;AAG5B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CAAmB;AAnBpC,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CA8FnB;SA9FY,OAAO;AAgGpB,eAAe,OAAO,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  LitElement,\n  html,\n  property,\n  CSSResultArray,\n  TemplateResult,\n} from 'lit-element';\nimport { styles } from './nile-tag.css';\nimport '../nile-icon-button/nile-icon-button';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement } from 'lit/decorators.js';\nimport NileElement from '../internal/nile-element';\nimport type { CSSResultGroup } from 'lit';\n/**\n * Nile icon component.\n *\n * @tag nile-tag\n *\n */\n\n/**\n * @summary Tags are used as labels to organize things or to indicate a selection.\n * @status stable\n *\n * @dependency nile-icon-button\n *\n * @slot - The tag's content.\n *\n * @event nile-remove - Emitted when the remove button is activated.\n *\n * @csspart base - The component's base wrapper.\n * @csspart content - The tag's content.\n * @csspart remove-button - The tag's remove button, an `<nile-icon-button>`.\n * @csspart remove-button__base - The remove button's exported `base` part.\n */\n\n@customElement('nile-tag')\nexport class NileTag extends NileElement {\n  static styles: CSSResultGroup = styles;\n\n  /** The tag's theme variant. */\n  @property({ reflect: true }) variant:\n    | 'primary'\n    | 'success'\n    | 'normal'\n    | 'warning'\n    | 'error'\n    | 'info' = 'normal';\n\n  /** The tag's size. */\n  @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /** Draws a pill-style tag with rounded edges. */\n  @property({ type: Boolean, reflect: true }) pill = false;\n\n  /** Makes the tag removable and shows a remove button. */\n  @property({ type: Boolean }) removable = false;\n\n  private handleRemoveClick() {\n    this.emit('nile-remove');\n  }\n\n  getCloseButtonColor() {\n    switch (this.variant) {\n      case 'primary':\n        return  '--nile-colors-blue-500'; \n      case 'success':\n        return '--nile-colors-green-500'; \n      case 'normal':\n        return '--nile-colors-dark-500'; \n      case 'warning':\n        return '--nile-colors-yellow-500';\n      case 'error':\n        return '--nile-colors-red-500';\n      case 'info':\n        return '--nile-colors-blue-500';\n      default:\n        return '--nile-colors-dark-500'; \n    }\n  }\n  \n\n  render() {\n    const colorVariable = this.getCloseButtonColor();\n    return html`\n      <span\n        part=\"base\"\n        class=${classMap({\n          tag: true,\n\n          // Types\n          'tag--primary': this.variant === 'primary',\n          'tag--success': this.variant === 'success',\n          'tag--normal': this.variant === 'normal',\n          'tag--warning': this.variant === 'warning',\n          'tag--error': this.variant === 'error',\n          'tag--info': this.variant === 'info',\n\n          // Sizes\n          'tag--small': this.size === 'small',\n          'tag--medium': this.size === 'medium',\n          'tag--large': this.size === 'large',\n\n          // Modifiers\n          'tag--pill': this.pill,\n          'tag--removable': this.removable,\n\n        })}\n      >\n        <slot name=\"prefix\" part=\"prefix\" class=\"tag__prefix\"></slot>\n\n        <slot part=\"content\" class=\"tag__content\"></slot>\n\n        ${this.removable\n          ? html`\n              <nile-icon-button\n                part=\"remove-button\"\n                exportparts=\"base:remove-button__base\"\n                name=\"close\"\n                library=\"system\"\n                label=\"remove\"\n                class=\"tag__remove\"\n                @click=${this.handleRemoveClick}\n                tabindex=\"-1\"\n                color=\"var(${colorVariable})\"\n              ></nile-icon-button>\n            `\n          : ''}\n      </span>\n    `;\n  }\n}\n\nexport default NileTag;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-tag': NileTag;\n  }\n}\n"]}