@redvars/peacock 3.6.3 → 3.8.0

package/src/select/option.ts

@@ -6,7 +6,6 @@ import type { MenuItem } from '../menu/menu-item/menu-item.js';
  * @label Select Option
  * @tag wc-option
  * @rawTag option
- * @parentRawTag select
  *
  * @summary A declarative option element for use inside wc-select.
  *

package/src/sidebar-menu/sidebar-menu-item.ts

@@ -7,7 +7,6 @@ import styles from './sidebar-menu-item.scss';
  * @label Sidebar Menu Item
  * @tag wc-sidebar-menu-item
  * @rawTag sidebar-menu-item
- * @parentRawTag sidebar-menu
  * @summary A sidebar menu item represents a selectable leaf item in the sidebar navigation tree.
  *
  * @example

package/src/sidebar-menu/sidebar-sub-menu.ts

@@ -8,7 +8,6 @@ import styles from './sidebar-sub-menu.scss';
  * @label Sidebar Sub Menu
  * @tag wc-sidebar-sub-menu
  * @rawTag sidebar-sub-menu
- * @parentRawTag sidebar-menu
  * @summary A sidebar sub menu groups sidebar menu items and handles expand/collapse behavior.
  *
  * @example

package/src/skeleton/skeleton.scss

@@ -18,7 +18,11 @@
 .skeleton::before {
   inset: 0;
   position: absolute;
-  @include mixin.apply-container-shape(skeleton);
+  border-start-start-radius: var(--skeleton-container-shape-start-start, var(--skeleton-container-shape));
+  border-start-end-radius: var(--skeleton-container-shape-start-end, var(--skeleton-container-shape));
+  border-end-start-radius: var(--skeleton-container-shape-end-start, var(--skeleton-container-shape));
+  border-end-end-radius: var(--skeleton-container-shape-end-end, var(--skeleton-container-shape));
+  corner-shape: var(--skeleton-container-shape-variant);
 }
 
 .skeleton {

package/src/tabs/tab-panel.ts

@@ -6,7 +6,6 @@ import styles from './tab-panel.scss';
  * @label Tab Panel
  * @tag wc-tab-panel
  * @rawTag tab-panel
- * @parentRawTag tab-group
  *
  * @summary Content panel for tabs.
  * @overview

package/src/tabs/tab.ts

@@ -2,9 +2,13 @@ import { html, LitElement, nothing } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 
-import { dispatchActivationClick, isActivationClick } from '@/__utils/dispatch-event-utils.js';
+import {
+  dispatchActivationClick,
+  isActivationClick,
+} from '@/__utils/dispatch-event-utils.js';
 import { observerSlotChangesWithCallback } from '@/__utils/observe-slot-change.js';
 import { throttle } from '@/__utils/throttle.js';
+import { isLink } from '@/__utils/is-link.js';
 import { spread } from '@/__directive/spread.js';
 
 import styles from './tab.scss';
@@ -14,7 +18,6 @@ import type { Tabs } from './tabs.js';
  * @label Tab
  * @tag wc-tab
  * @rawTag tab
- * @parentRawTag tabs
  *
  * @summary A tab component for use within tabs.
  * @overview
@@ -27,13 +30,12 @@ import type { Tabs } from './tabs.js';
  * @tags navigation
  */
 export class Tab extends LitElement {
-
   #id = crypto.randomUUID();
 
   static styles = [styles];
 
   @property({ type: Boolean, reflect: true }) active = false;
-  
+
   @property({ type: Boolean, reflect: true }) disabled = false;
 
   @property({ type: String }) disabledReason = '';
@@ -43,7 +45,7 @@ export class Tab extends LitElement {
   @property({ reflect: true })
   configAria?: { [key: string]: any };
 
-   /**
+  /**
    * Sets or retrieves the window or frame at which to target content.
    */
   @property() target: string = '_self';
@@ -63,11 +65,11 @@ export class Tab extends LitElement {
 
   @state() slotHasBadge = false;
 
-   /**
-     * States
-     */
-    @state()
-    isPressed = false;
+  /**
+   * States
+   */
+  @state()
+  isPressed = false;
 
   private _tabindex = 0;
 
@@ -81,7 +83,6 @@ export class Tab extends LitElement {
     this.tabElement?.blur();
   }
 
-
   constructor() {
     super();
     this._tabindex = 0;
@@ -118,28 +119,28 @@ export class Tab extends LitElement {
   }
 
   __dispatchClickWithThrottle: (event: MouseEvent | KeyboardEvent) => void =
-      event => {
-        this.__dispatchClick(event);
-      };
-  
-    __dispatchClick = (event: MouseEvent | KeyboardEvent) => {
-      // If the button is soft-disabled or a disabled link, we need to explicitly
-      // prevent the click from propagating to other event listeners as well as
-      // prevent the default action.
-      if (this.disabled && this.href) {
-        event.stopImmediatePropagation();
-        event.preventDefault();
-        return;
-      }
-  
-      if (!isActivationClick(event) || !this.tabElement) {
-        return;
-      }
-  
-      this.focus();
-      dispatchActivationClick(this.tabElement);
+    event => {
+      this.__dispatchClick(event);
     };
 
+  __dispatchClick = (event: MouseEvent | KeyboardEvent) => {
+    // If the button is soft-disabled or a disabled link, we need to explicitly
+    // prevent the click from propagating to other event listeners as well as
+    // prevent the default action.
+    if (this.disabled && this.href) {
+      event.stopImmediatePropagation();
+      event.preventDefault();
+      return;
+    }
+
+    if (!isActivationClick(event) || !this.tabElement) {
+      return;
+    }
+
+    this.focus();
+    dispatchActivationClick(this.tabElement);
+  };
+
   __handlePress = (event: KeyboardEvent | MouseEvent) => {
     if (this.disabled) return;
     if (
@@ -155,10 +156,6 @@ export class Tab extends LitElement {
     }
   };
 
-  __isLink() {
-    return !!this.href;
-  }
-
   __getParentTabsVariant(): Tabs['variant'] {
     return (this.closest('wc-tabs') as Tabs | null)?.variant ?? 'primary';
   }
@@ -172,10 +169,7 @@ export class Tab extends LitElement {
   //   }
   // }
 
-
   render() {
-
-    const isLink = this.__isLink();
     const variant = this.__getParentTabsVariant();
 
     const cssClasses = {
@@ -190,40 +184,39 @@ export class Tab extends LitElement {
       'has-badge': this.slotHasBadge,
     };
 
-
-    if (!isLink) {
-          return html`<button
-          id="button"
-              class=${classMap(cssClasses)}
-              tabindex="0"
-              @mousedown=${this.__handlePress}
-              @keydown=${this.__handlePress}
-              @keyup=${this.__handlePress}
-              ?aria-describedby=${this.__getDisabledReasonID()}
-              aria-disabled=${`${this.disabled}`}
-              ?disabled=${this.disabled}
-              ${spread(this.configAria)}
-            >
-              ${this.renderTabContent(variant)}
-            </button>`;
-        }
-
-    return html`<a
-        class=${classMap(cssClasses)}
+    if (!isLink(this)) {
+      return html`<button
         id="button"
+        class=${classMap(cssClasses)}
         tabindex="0"
-        href=${this.href}
-        target=${this.target}
         @mousedown=${this.__handlePress}
         @keydown=${this.__handlePress}
         @keyup=${this.__handlePress}
-        role="button"
         ?aria-describedby=${this.__getDisabledReasonID()}
         aria-disabled=${`${this.disabled}`}
+        ?disabled=${this.disabled}
         ${spread(this.configAria)}
       >
         ${this.renderTabContent(variant)}
-      </a>`;
+      </button>`;
+    }
+
+    return html`<a
+      class=${classMap(cssClasses)}
+      id="button"
+      tabindex="0"
+      href=${this.href}
+      target=${this.target}
+      @mousedown=${this.__handlePress}
+      @keydown=${this.__handlePress}
+      @keyup=${this.__handlePress}
+      role="button"
+      ?aria-describedby=${this.__getDisabledReasonID()}
+      aria-disabled=${`${this.disabled}`}
+      ${spread(this.configAria)}
+    >
+      ${this.renderTabContent(variant)}
+    </a>`;
   }
 
   renderTabContent(variant: Tabs['variant']) {
@@ -242,14 +235,13 @@ export class Tab extends LitElement {
 
   renderPrimaryTabContent() {
     return html`
-      <wc-focus-ring class="focus-ring" for='button'></wc-focus-ring>
+      <wc-focus-ring class="focus-ring" for="button"></wc-focus-ring>
       <wc-elevation class="elevation"></wc-elevation>
       <div class="background"></div>
       <div class="outline"></div>
       <wc-ripple class="ripple"></wc-ripple>
-      
-      <div class="tab-content">
 
+      <div class="tab-content">
         <div class="icon-section">
           <slot name="badge"></slot>
           <slot name="icon"></slot>
@@ -259,7 +251,6 @@ export class Tab extends LitElement {
         </div>
 
         <div class="indicator"></div>
-        
       </div>
 
       ${this.__renderDisabledReason()}
@@ -268,14 +259,13 @@ export class Tab extends LitElement {
 
   renderSecondaryTabContent() {
     return html`
-      <wc-focus-ring class="focus-ring" for='button'></wc-focus-ring>
+      <wc-focus-ring class="focus-ring" for="button"></wc-focus-ring>
       <wc-elevation class="elevation"></wc-elevation>
       <div class="background"></div>
       <div class="outline"></div>
       <wc-ripple class="ripple"></wc-ripple>
-      
-      <div class="tab-content">
 
+      <div class="tab-content">
         <slot name="icon"></slot>
 
         <div class="slot-container">
@@ -301,7 +291,7 @@ export class Tab extends LitElement {
 
   renderSegmentedTabContent() {
     return html`
-      <wc-focus-ring class="focus-ring" for='button'></wc-focus-ring>
+      <wc-focus-ring class="focus-ring" for="button"></wc-focus-ring>
       <wc-elevation class="elevation"></wc-elevation>
       <div class="background"></div>
       <div class="outline"></div>

package/src/text/text.css-component.scss

@@ -1,35 +1,17 @@
 @use "../../scss/mixin";
-@use "sass:string";
 
 @include mixin.base-styles;
 
-@mixin _apply-typography($value-type) {
-  @include mixin.get-typography(#{$value-type});
-  @if string.index($value-type, "body") {
-    margin-block-end: var(--spacing-200);
-  }
-  @if string.index($value-type, "headline") {
-    margin-block-end: var(--spacing-200);
-  }
-  @if string.index($value-type, "display") {
-    margin-block-end: var(--spacing-400);
-  }
-  @if string.index($value-type, "title") {
-    margin-block-end: var(--spacing-400);
-  }
-}
-
 /// Mixin to define text classes for a specific type and value-type
 /// @param {String} $type - The type name to be used in the class name (e.g., .text-#{$type})
-/// @param {String} $value-type - The value-type name to be passed to get-typography and get-margin-end
-/// @param {Boolean} $important [true] - Whether to use !important in typography properties
+/// @param {String} $value-type - The value-type name to be passed to get-typography
 @mixin define-text-classes($type, $value-type) {
   .text-#{$type} {
-    @include _apply-typography($value-type);
+    @include mixin.get-typography(#{$value-type});
   }
 
   .text-#{$type}-emphasized {
-    @include _apply-typography(#{$value-type}-emphasized);
+    @include mixin.get-typography(#{$value-type}-emphasized);
   }
 }
 

package/src/tooltip/tooltip.scss

@@ -8,15 +8,12 @@
   position: absolute;
   top: 0;
   left: 0;
+  pointer-events: none;
+  transition: transform var(--duration-short2) ease-in-out, opacity var(--duration-short2) ease-in-out;
+  transform: scale(0);
+  opacity: 0;
 
-  .tooltip {
-    pointer-events: none;
-    transition: transform var(--duration-short2) ease-in-out, opacity var(--duration-short2) ease-in-out;
-    transform: scale(0);
-    opacity: 0;
-  }
-
-  .tooltip.open {
+  &:host([open]) {
     pointer-events: auto;
     transform: scale(1);
     opacity: 1;

package/src/tooltip/tooltip.ts

@@ -71,7 +71,7 @@ export class Tooltip extends LitElement {
   set forElement(value: HTMLElement | null) {
     if (value) {
       this._focusTarget = value;
-    } else {      
+    } else {
       this._focusTarget = undefined;
     }
   }
@@ -153,7 +153,6 @@ export class Tooltip extends LitElement {
     return html` <div
       class=${classMap({
         tooltip: true,
-        open: this.open,
         [`variant-${this.variant}`]: true,
       })}
       id="tooltip"

package/dist/BaseButton-BNFAYn-S.js

@@ -1,219 +0,0 @@
-import { A, _ as __decorate, b, i as i$1 } from './IndividualComponent-DUINtMGK.js';
-import { e, i, t } from './directive-ZPhl09Yt.js';
-import { n } from './property-1psGvXOq.js';
-import { r } from './state-DwbEjqVk.js';
-import { e as e$1 } from './query-QBcUV-L_.js';
-import { i as isActivationClick, d as dispatchActivationClick } from './dispatch-event-utils-CuEqjlPT.js';
-import { B as BaseHyperlinkMixin } from './BaseHyperlinkMixin-BNuwbiEf.js';
-
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */const o=o=>o??A;
-
-class SpreadDirective extends i {
-    constructor(partInfo) {
-        super(partInfo);
-        if (partInfo.type !== t.ELEMENT) {
-            throw new Error('spread() can only be used on elements');
-        }
-    }
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    render(_props) {
-        return '';
-    }
-    update(part, [props]) {
-        if (!props)
-            return;
-        // eslint-disable-next-line guard-for-in,no-restricted-syntax
-        for (const key in props) {
-            const value = props[key];
-            if (value === undefined || value === null) {
-                part.element.removeAttribute(key);
-            }
-            else {
-                part.element.setAttribute(key, value);
-            }
-        }
-    }
-}
-const spread = e(SpreadDirective);
-
-/**
- * 2. Apply the type annotation to the variable.
- */
-const BaseButtonMixin = (superclass) => {
-    // Naming the class (BaseButtonElement) instead of using 'Mixin' or anonymous 
-    // prevents the "__childPart" visibility error.
-    class BaseButtonElement extends superclass {
-        constructor() {
-            super(...arguments);
-            /**
-             * The type of the underlying `<button>` element. Maps to the native `type` attribute.
-             * Possible values are `"button"`, `"submit"`, `"reset"`. Defaults to `"button"`.
-             */
-            this.htmlType = 'button';
-            /**
-             * When `true`, the button is disabled and cannot be interacted with. Reflects to the `disabled` attribute. Defaults to `false`.
-             */
-            this.disabled = false;
-            /**
-             * When `true`, the button is visually styled as disabled and cannot be interacted with, but remains focusable.
-             * Use this in combination with `disabledReason` to communicate why the button is unavailable.
-             * Reflects to the `soft-disabled` attribute. Defaults to `false`.
-             */
-            this.softDisabled = false;
-            /**
-             * A human-readable explanation of why the button is disabled or soft-disabled.
-             * Rendered as a visually hidden tooltip and linked via `aria-describedby` for accessibility.
-             * Maps to the `disabled-reason` attribute.
-             */
-            this.disabledReason = '';
-            /**
-             * The `id` of the `<form>` element to associate the button with.
-             * If omitted, the button is associated with its nearest ancestor form.
-             * Maps to the native `form` attribute.
-             */
-            this.form = '';
-            /**
-             * The name of the button, submitted as part of a name/value pair when the associated form is submitted.
-             * Maps to the native `name` attribute.
-             */
-            this.name = '';
-            /**
-             * The value of the button, submitted as part of a name/value pair when the associated form is submitted.
-             * Maps to the native `value` attribute.
-             */
-            this.value = '';
-        }
-    }
-    __decorate([
-        n({ type: String })
-    ], BaseButtonElement.prototype, "htmlType", void 0);
-    __decorate([
-        n({ type: Boolean, reflect: true })
-    ], BaseButtonElement.prototype, "disabled", void 0);
-    __decorate([
-        n({ type: Boolean, reflect: true, attribute: 'soft-disabled' })
-    ], BaseButtonElement.prototype, "softDisabled", void 0);
-    __decorate([
-        n({ attribute: 'disabled-reason' })
-    ], BaseButtonElement.prototype, "disabledReason", void 0);
-    __decorate([
-        n()
-    ], BaseButtonElement.prototype, "form", void 0);
-    __decorate([
-        n()
-    ], BaseButtonElement.prototype, "name", void 0);
-    __decorate([
-        n()
-    ], BaseButtonElement.prototype, "value", void 0);
-    return BaseButtonElement;
-};
-
-class BaseButton extends BaseButtonMixin(BaseHyperlinkMixin(i$1)) {
-    constructor() {
-        super(...arguments);
-        this.skeleton = false;
-        this.toggle = false;
-        this.selected = false;
-        /**
-         * Sets the delay for throttle in milliseconds. Defaults to 200 milliseconds.
-         */
-        this.throttleDelay = 200;
-        /**
-         * States
-         */
-        this.isPressed = false;
-        this.__handlePress = (event) => {
-            if (this.disabled || this.skeleton || this.softDisabled)
-                return;
-            if (event instanceof KeyboardEvent &&
-                event.type === 'keydown' &&
-                (event.key === 'Enter' || event.key === ' ')) {
-                this.isPressed = true;
-            }
-            else if (event.type === 'mousedown') {
-                this.isPressed = true;
-            }
-            else {
-                this.isPressed = false;
-            }
-        };
-        this.__dispatchClickWithThrottle = event => {
-            this.__dispatchClick(event);
-        };
-        this.__dispatchClick = (event) => {
-            // If the button is soft-disabled or a disabled link, we need to explicitly
-            // prevent the click from propagating to other event listeners as well as
-            // prevent the default action.
-            if (this.softDisabled || (this.disabled && this.href) || this.skeleton) {
-                event.stopImmediatePropagation();
-                event.preventDefault();
-                return;
-            }
-            if (!isActivationClick(event) || !this.buttonElement) {
-                return;
-            }
-            if (this.toggle) {
-                this.selected = !this.selected;
-            }
-            this.focus();
-            dispatchActivationClick(this.buttonElement);
-        };
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        this.addEventListener('click', this.__dispatchClickWithThrottle);
-        window.addEventListener('mouseup', this.__handlePress);
-    }
-    disconnectedCallback() {
-        window.removeEventListener('mouseup', this.__handlePress);
-        this.removeEventListener('click', this.__dispatchClickWithThrottle);
-        super.disconnectedCallback();
-    }
-    __renderDisabledReason(softDisabled) {
-        if (softDisabled)
-            return b `<div
-        id=${BaseButton.DISABLED_REASON_ID}
-        role="tooltip"
-        aria-label=${this.disabledReason}
-        class="screen-reader-only"
-      >
-        ${this.disabledReason}
-      </div>`;
-        return A;
-    }
-    __renderTooltip() {
-        if (this.tooltip) {
-            return b `<wc-tooltip for="button">${this.tooltip}</wc-tooltip>`;
-        }
-        return A;
-    }
-}
-BaseButton.DISABLED_REASON_ID = 'disabled-reason';
-__decorate([
-    n({ type: Boolean, reflect: true })
-], BaseButton.prototype, "skeleton", void 0);
-__decorate([
-    n({ type: Boolean, reflect: true })
-], BaseButton.prototype, "toggle", void 0);
-__decorate([
-    n({ type: Boolean, reflect: true })
-], BaseButton.prototype, "selected", void 0);
-__decorate([
-    n()
-], BaseButton.prototype, "throttleDelay", void 0);
-__decorate([
-    n()
-], BaseButton.prototype, "tooltip", void 0);
-__decorate([
-    r()
-], BaseButton.prototype, "isPressed", void 0);
-__decorate([
-    e$1('.button')
-], BaseButton.prototype, "buttonElement", void 0);
-
-export { BaseButton as B, BaseButtonMixin as a, o, spread as s };
-//# sourceMappingURL=BaseButton-BNFAYn-S.js.map

package/dist/BaseButton-BNFAYn-S.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BaseButton-BNFAYn-S.js","sources":["../node_modules/lit-html/directives/if-defined.js","../../src/__directive/spread.ts","../../src/__mixins/BaseButtonMixin.ts","../../src/button/BaseButton.ts"],"sourcesContent":["import{nothing as t}from\"../lit-html.js\";\n/**\n * @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */const o=o=>o??t;export{o as ifDefined};\n//# sourceMappingURL=if-defined.js.map\n","import {\n  directive,\n  Directive,\n  ElementPart,\n  PartInfo,\n  PartType,\n} from 'lit/directive.js';\n\nclass SpreadDirective extends Directive {\n  constructor(partInfo: PartInfo) {\n    super(partInfo);\n    if (partInfo.type !== PartType.ELEMENT) {\n      throw new Error('spread() can only be used on elements');\n    }\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  render(_props: { [key: string]: any } | undefined) {\n    return '';\n  }\n\n  update(part: ElementPart, [props]: [{ [key: string]: any } | undefined]) {\n    if (!props) return;\n    // eslint-disable-next-line guard-for-in,no-restricted-syntax\n    for (const key in props) {\n      const value = props[key];\n      if (value === undefined || value === null) {\n        part.element.removeAttribute(key);\n      } else {\n        part.element.setAttribute(key, value);\n      }\n    }\n  }\n}\n\nexport const spread = directive(SpreadDirective);\n","import { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport type { MixinConstructor } from './MixinConstructor.js';\n\n\n/**\n * 1. Define an interface for the members the mixin adds.\n * This makes the type annotation much cleaner.\n */\nexport interface BaseButtonInterface {\n    htmlType: 'button' | 'submit' | 'reset';\n    disabled: boolean;\n    softDisabled: boolean;\n    disabledReason: string;\n    form: string;\n    name: string;\n    value: string;\n}\n\n/**\n * 2. Apply the type annotation to the variable.\n */\nconst BaseButtonMixin: <T extends MixinConstructor<LitElement>>(superclass: T) => T & MixinConstructor<BaseButtonInterface> = <T extends MixinConstructor<LitElement>>(superclass: T) => {\n    // Naming the class (BaseButtonElement) instead of using 'Mixin' or anonymous \n    // prevents the \"__childPart\" visibility error.\n    class BaseButtonElement extends superclass implements BaseButtonInterface {\n\n        /**\n         * The type of the underlying `<button>` element. Maps to the native `type` attribute.\n         * Possible values are `\"button\"`, `\"submit\"`, `\"reset\"`. Defaults to `\"button\"`.\n         */\n        @property({ type: String }) htmlType: 'button' | 'submit' | 'reset' =\n            'button';\n\n        /**\n         * When `true`, the button is disabled and cannot be interacted with. Reflects to the `disabled` attribute. Defaults to `false`.\n         */\n        @property({ type: Boolean, reflect: true })\n        disabled: boolean = false;\n\n        /**\n         * When `true`, the button is visually styled as disabled and cannot be interacted with, but remains focusable.\n         * Use this in combination with `disabledReason` to communicate why the button is unavailable.\n         * Reflects to the `soft-disabled` attribute. Defaults to `false`.\n         */\n        @property({ type: Boolean, reflect: true, attribute: 'soft-disabled' })\n        softDisabled: boolean = false;\n\n        /**\n         * A human-readable explanation of why the button is disabled or soft-disabled.\n         * Rendered as a visually hidden tooltip and linked via `aria-describedby` for accessibility.\n         * Maps to the `disabled-reason` attribute.\n         */\n        @property({ attribute: 'disabled-reason' })\n        disabledReason: string = '';\n\n        /**\n         * The `id` of the `<form>` element to associate the button with.\n         * If omitted, the button is associated with its nearest ancestor form.\n         * Maps to the native `form` attribute.\n         */\n        @property()\n        form: string = '';\n\n        /**\n         * The name of the button, submitted as part of a name/value pair when the associated form is submitted.\n         * Maps to the native `name` attribute.\n         */\n        @property()\n        name: string = '';\n\n        /**\n         * The value of the button, submitted as part of a name/value pair when the associated form is submitted.\n         * Maps to the native `value` attribute.\n         */\n        @property()\n        value: string = '';\n    }\n\n    return BaseButtonElement as T & MixinConstructor<BaseButtonInterface>;\n};\n\nexport default BaseButtonMixin;","import { html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { dispatchActivationClick, isActivationClick } from '../__utils/dispatch-event-utils.js';\nimport BaseHyperlinkMixin from '@/__mixins/BaseHyperlinkMixin.js';\nimport BaseButtonMixin from '@/__mixins/BaseButtonMixin.js';\n\n\n\nexport class BaseButton extends BaseButtonMixin(BaseHyperlinkMixin(LitElement)) {\n  protected static readonly DISABLED_REASON_ID = 'disabled-reason';\n\n  \n  color?: string;\n\n  variant?: string;\n\n  @property({ type: Boolean, reflect: true }) skeleton: boolean = false;\n  \n  @property({ type: Boolean, reflect: true }) toggle: boolean = false;\n\n  @property({ type: Boolean, reflect: true }) selected: boolean = false;\n\n  /**\n   * Sets the delay for throttle in milliseconds. Defaults to 200 milliseconds.\n   */\n  @property() throttleDelay = 200;\n\n  @property() tooltip?: string;\n\n  /**\n   * States\n   */\n  @state()\n  isPressed = false;\n\n  @query('.button') readonly buttonElement!: HTMLElement | null;\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('click', this.__dispatchClickWithThrottle);\n    window.addEventListener('mouseup', this.__handlePress);\n  }\n\n  override disconnectedCallback() {\n    window.removeEventListener('mouseup', this.__handlePress);\n    this.removeEventListener('click', this.__dispatchClickWithThrottle);\n    super.disconnectedCallback();\n  }\n\n  __handlePress = (event: KeyboardEvent | MouseEvent) => {\n    if (this.disabled || this.skeleton || this.softDisabled) return;\n    if (\n      event instanceof KeyboardEvent &&\n      event.type === 'keydown' &&\n      (event.key === 'Enter' || event.key === ' ')\n    ) {\n      this.isPressed = true;\n    } else if (event.type === 'mousedown') {\n      this.isPressed = true;\n    } else {\n      this.isPressed = false;\n    }\n  };\n\n  __dispatchClickWithThrottle: (event: MouseEvent | KeyboardEvent) => void =\n    event => {\n      this.__dispatchClick(event);\n    };\n\n  __dispatchClick = (event: MouseEvent | KeyboardEvent) => {\n    // If the button is soft-disabled or a disabled link, we need to explicitly\n    // prevent the click from propagating to other event listeners as well as\n    // prevent the default action.\n    if (this.softDisabled || (this.disabled && this.href) || this.skeleton) {\n      event.stopImmediatePropagation();\n      event.preventDefault();\n      return;\n    }\n\n    if (!isActivationClick(event) || !this.buttonElement) {\n      return;\n    }\n\n    if (this.toggle) {\n      this.selected = !this.selected;\n    }\n\n    this.focus();\n    dispatchActivationClick(this.buttonElement);\n  };\n\n  \n\n  __renderDisabledReason(softDisabled: boolean) {\n    if (softDisabled)\n      return html`<div\n        id=${BaseButton.DISABLED_REASON_ID}\n        role=\"tooltip\"\n        aria-label=${this.disabledReason}\n        class=\"screen-reader-only\"\n      >\n        ${this.disabledReason}\n      </div>`;\n    return nothing;\n  }\n\n  __renderTooltip() {\n    if (this.tooltip) {\n      return html`<wc-tooltip for=\"button\">${this.tooltip}</wc-tooltip>`;\n    }\n    return nothing;\n  }\n}\n"],"names":["t","Directive","PartType","directive","property","LitElement","html","nothing","state","query"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/BaseHyperlinkMixin-BNuwbiEf.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BaseHyperlinkMixin-BNuwbiEf.js","sources":["../../src/__utils/throttle.ts","../../src/__mixins/BaseHyperlinkMixin.ts"],"sourcesContent":["export function throttle(\n  func: Function,\n  delay: number,\n  options = { leading: true, trailing: true },\n) {\n  let timerId: any;\n  let lastExec = 0;\n\n  return function (...args: any[]) {\n    // @ts-ignore\n    const context = this;\n    const now = Date.now();\n\n    const shouldCallNow = options.leading && now - lastExec >= delay;\n\n    if (shouldCallNow) {\n      func.apply(context, args);\n      lastExec = now;\n    } else if (options.trailing && !timerId) {\n      timerId = setTimeout(() => {\n        func.apply(context, args);\n        lastExec = Date.now();\n        timerId = null;\n      }, delay);\n    }\n  };\n}","import { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport type { MixinConstructor } from './MixinConstructor.js';\n\n\n/**\n * 1. Define an interface for the members the mixin adds.\n * This makes the type annotation much cleaner.\n */\nexport interface BaseHyperlinkInterface {\n  href?: string;\n  target: '_self' | '_parent' | '_blank' | '_top' | string;\n  rel?: string;\n  download?: string;\n  __isLink(): boolean;\n}\n\n/**\n * 2. Apply the type annotation to the variable.\n */\nconst BaseHyperlinkMixin: <T extends MixinConstructor<LitElement>>(superclass: T) => T & MixinConstructor<BaseHyperlinkInterface> = <T extends MixinConstructor<LitElement>>(superclass: T) => {\n  // Naming the class (BaseHyperlinkElement) instead of using 'Mixin' or anonymous \n  // prevents the \"__childPart\" visibility error.\n  class BaseHyperlinkElement extends superclass implements BaseHyperlinkInterface {\n    /**\n     * The URL that the hyperlink points to. When set, the component renders as an `<a>` element.\n     * Maps to the native `href` attribute.\n     */\n    @property({ reflect: true })\n    href?: string;\n\n    /**\n     * Where to display the linked URL. Maps to the native `target` attribute.\n     * Possible values are `\"_self\"`, `\"_blank\"`, `\"_parent\"`, `\"_top\"`, or a custom frame name.\n     * When using `\"_blank\"`, consider setting `rel=\"noopener noreferrer\"` for security. Defaults to `\"_self\"`.\n     */\n    @property()\n    target: '_self' | '_parent' | '_blank' | '_top' | string = '_self';\n\n    /**\n     * The relationship between the current document and the linked URL.\n     * Maps to the native `rel` attribute on the rendered `<a>` element.\n     * When `target=\"_blank\"`, use `\"noopener noreferrer\"` to prevent tab-napping attacks.\n     */\n    @property()\n    rel?: string;\n\n    /**\n     * Causes the browser to download the linked URL instead of navigating to it.\n     * If a string value is provided, it is used as the suggested filename.\n     * Omit or leave undefined to preserve normal navigation behaviour.\n     * Maps to the native `download` attribute. Only applies when `href` is set.\n     */\n    @property()\n    download?: string;\n\n    /**\n     * Returns `true` when `href` is set, indicating the component should render as a link.\n     */\n    __isLink(): boolean {\n      return !!this.href;\n    }\n  }\n\n  return BaseHyperlinkElement as T & MixinConstructor<BaseHyperlinkInterface>;\n};\n\nexport default BaseHyperlinkMixin;"],"names":["property"],"mappings":";;;SAAgB,QAAQ,CACtB,IAAc,EACd,KAAa,EACb,OAAO,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAA;AAE3C,IAAA,IAAI,OAAY;IAChB,IAAI,QAAQ,GAAG,CAAC;IAEhB,OAAO,UAAU,GAAG,IAAW,EAAA;;QAE7B,MAAM,OAAO,GAAG,IAAI;AACpB,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE;QAEtB,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,IAAI,GAAG,GAAG,QAAQ,IAAI,KAAK;QAEhE,IAAI,aAAa,EAAE;AACjB,YAAA,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC;YACzB,QAAQ,GAAG,GAAG;QAChB;AAAO,aAAA,IAAI,OAAO,CAAC,QAAQ,IAAI,CAAC,OAAO,EAAE;AACvC,YAAA,OAAO,GAAG,UAAU,CAAC,MAAK;AACxB,gBAAA,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC;AACzB,gBAAA,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE;gBACrB,OAAO,GAAG,IAAI;YAChB,CAAC,EAAE,KAAK,CAAC;QACX;AACF,IAAA,CAAC;AACH;;ACTA;;AAEG;AACH,MAAM,kBAAkB,GAA4G,CAAyC,UAAa,KAAI;;;IAG5L,MAAM,oBAAqB,SAAQ,UAAU,CAAA;AAA7C,QAAA,WAAA,GAAA;;AAQE;;;;AAIG;YAEH,IAAA,CAAA,MAAM,GAAqD,OAAO;QAyBpE;AANE;;AAEG;QACH,QAAQ,GAAA;AACN,YAAA,OAAO,CAAC,CAAC,IAAI,CAAC,IAAI;QACpB;AACD;AAjCC,IAAA,UAAA,CAAA;AADC,QAAAA,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AACb,KAAA,EAAA,oBAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAQd,IAAA,UAAA,CAAA;AADC,QAAAA,CAAQ;AAC0D,KAAA,EAAA,oBAAA,CAAA,SAAA,EAAA,QAAA,EAAA,MAAA,CAAA;AAQnE,IAAA,UAAA,CAAA;AADC,QAAAA,CAAQ;AACI,KAAA,EAAA,oBAAA,CAAA,SAAA,EAAA,KAAA,EAAA,MAAA,CAAA;AASb,IAAA,UAAA,CAAA;AADC,QAAAA,CAAQ;AACS,KAAA,EAAA,oBAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAUpB,IAAA,OAAO,oBAAoE;AAC7E;;;;"}

package/dist/button-colors-Cg6oxiz-.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"button-colors-Cg6oxiz-.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}