@redvars/peacock 3.6.2 → 3.7.0

package/dist/icon-button-DJ0kZXYr.js

@@ -0,0 +1,318 @@
+import { a as i, i as i$1, b, A, _ as __decorate } from './IndividualComponent-DUINtMGK.js';
+import { n as n$1 } from './property-1psGvXOq.js';
+import { e as e$1 } from './query-QBcUV-L_.js';
+import { e } from './class-map-YU7g0o3B.js';
+import { N as NativeButtonMixin, D as DISABLED_REASON_ID, o, s as spread } from './ButtonConstants-D06bY4uy.js';
+import { n, c as css_248z$1, a as css_248z$2, b as css_248z$3 } from './button-colors-Dwnez1tR.js';
+import { N as NativeHyperlinkMixin, t as throttle, i as isLink } from './NativeHyperlinkMixin-DrYXyfMQ.js';
+import { i as isActivationClick, d as dispatchActivationClick } from './dispatch-event-utils-CuEqjlPT.js';
+
+var css_248z = i`.button .icon-slot {
+  overflow: initial;
+}
+
+.button {
+  width: var(--button-height);
+  --private-button-container-padding: 0.75rem;
+  --private-button-container-padding: 0;
+}
+
+:host([size=xs]),
+:host([size=extra-small]) {
+  --button-height: 2rem;
+  --private-button-icon-size: 1rem;
+}
+
+:host([size=sm]),
+:host([size=small]) {
+  --button-height: 2.5rem;
+  --private-button-icon-size: 1.25rem;
+}
+
+:host([size=md]),
+:host([size=medium]) {
+  --button-height: 3.5rem;
+  --private-button-icon-size: 1.5rem;
+}
+
+:host([size=lg]),
+:host([size=large]) {
+  --button-height: 6rem;
+  --private-button-icon-size: 2rem;
+}
+
+:host([size=xl]) {
+  --button-height: 8.5rem;
+  --private-button-icon-size: 2.5rem;
+}`;
+
+/**
+ * @label Icon Button
+ * @tag wc-icon-button
+ * @rawTag icon-button
+ *
+ * @summary Icon buttons allow users to take actions, and make choices, with a single tap.
+ *
+ * @overview
+ * <p>Icon buttons are clickable elements that are used to trigger actions. They communicate calls to action to the user and allow users to interact with pages in a variety of ways. IconButton labels express what action will occur when the user interacts with it.</p>
+ *
+ * @cssprop --button-container-shape: Defines the border radius of the button container shape.
+ *
+ * @cssprop --button-container-shape-start-start: Defines the start position of the button container shape.
+ * @cssprop --button-container-shape-start-end: Defines the end position of the button container shape.
+ * @cssprop --button-container-shape-end-start: Defines the start position of the button container shape.
+ * @cssprop --button-container-shape-end-end: Defines the end position of the button container shape.
+ *
+ *
+ * @cssprop --filled-button-container-color: Color of the filled button container.
+ * @cssprop --filled-button-label-text-color: Text color of the filled button label.
+ *
+ * @cssprop --outlined-button-container-color: Color of the outlined button container.
+ * @cssprop --outlined-button-label-text-color: Text color of the outlined button label.
+ *
+ * @cssprop --text-button-label-text-color: Text color of the text button label.
+ *
+ * @cssprop --tonal-button-container-color: Color of the tonal button container.
+ * @cssprop --tonal-button-label-text-color: Text color of the tonal button label.
+ *
+ * @cssprop --elevated-button-container-color: Color of the elevated button container.
+ * @cssprop --elevated-button-label-text-color: Text color of the elevated button label.
+ *
+ * @cssprop --neo-button-container-color: Color of the neo button container.
+ * @cssprop --neo-button-label-text-color: Text color of the neo button label.
+ *
+ * @fires {CustomEvent} button:click - Dispatched when the button is clicked.
+ *
+ * @example
+ * ```html
+ * <wc-icon-button><wc-icon name="home"></wc-icon></wc-icon-button>
+ * ```
+ * @tags display
+ */
+class IconButton extends NativeButtonMixin(NativeHyperlinkMixin(i$1)) {
+    constructor() {
+        super(...arguments);
+        /**
+         * Button size.
+         * Possible values are `"xs"`, `"sm"`, `"md"`, `"lg"`, `"xl"`. Defaults to `"sm"`.
+         */
+        this.size = 'sm';
+        /**
+         * The visual style of the button.
+         *
+         *  Possible variant values:
+         * `"filled"` is a filled button.
+         * `"outlined"` is an outlined button.
+         * `"text"` is a transparent button.
+         * `"tonal"` is a light color button.
+         * `"elevated"` is elevated button
+         */
+        this.variant = 'filled';
+        /**
+         * Defines the primary color of the button. This can be set to predefined color names to apply specific color themes.
+         */
+        this.color = 'primary';
+        this.skeleton = false;
+        this.toggle = false;
+        this.selected = false;
+        /**
+         * Sets the delay for throttle in milliseconds. Defaults to 200 milliseconds.
+         */
+        this.throttleDelay = 200;
+        this.pressed = false;
+        this.__handlePress = (event) => {
+            if (this.disabled || this.skeleton || this.softDisabled)
+                return;
+            this.pressed =
+                (event instanceof KeyboardEvent &&
+                    event.type === 'keydown' &&
+                    (event.key === 'Enter' || event.key === ' ')) ||
+                    event.type === 'mousedown';
+        };
+        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=${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 class="tooltip" for="button">${this.tooltip}</wc-tooltip>`;
+        }
+        return A;
+    }
+    focus() {
+        this.buttonElement?.focus();
+    }
+    blur() {
+        this.buttonElement?.blur();
+    }
+    firstUpdated() {
+        this.__dispatchClickWithThrottle = throttle(this.__dispatchClick, this.throttleDelay);
+        this.__convertTypeToVariantAndColor();
+    }
+    __convertTypeToVariantAndColor() {
+        if (this.type === 'primary') {
+            this.color = 'primary';
+            this.variant = 'filled';
+        }
+        else if (this.type === 'secondary') {
+            this.color = 'surface';
+            this.variant = 'filled';
+        }
+        else if (this.type === 'tertiary') {
+            this.color = 'primary';
+            this.variant = 'text';
+        }
+        else if (this.type === 'danger') {
+            this.color = 'danger';
+            this.variant = 'filled';
+        }
+    }
+    render() {
+        return b `
+      <wc-focus-ring class="focus-ring" for="button"></wc-focus-ring>
+      <wc-elevation class="elevation"></wc-elevation>
+      ${n(this.variant === 'neo', () => b `<div class="neo-background"></div>`)}
+      <div class="background"></div>
+      ${n(this.variant === 'outlined' || this.variant === 'neo', () => b `<div class="outline"></div>`)}
+      <wc-ripple class="ripple" for="button"></wc-ripple>
+      <wc-skeleton class="skeleton"></wc-skeleton>
+
+      ${this.renderButtonElement()} ${this.__renderTooltip()}
+    `;
+    }
+    renderButtonElement() {
+        const cssClasses = {
+            button: true,
+            'button-element': true,
+            [`size-${this.size}`]: true,
+            [`variant-${this.variant}`]: true,
+            [`color-${this.color}`]: true,
+            disabled: this.disabled || this.softDisabled,
+            pressed: this.pressed,
+            skeleton: this.skeleton,
+        };
+        if (!isLink(this)) {
+            cssClasses['native-button'] = true;
+            return b `<button
+        class=${e(cssClasses)}
+        id="button"
+        type=${this.htmlType}
+        @click=${this.__dispatchClickWithThrottle}
+        @mousedown=${this.__handlePress}
+        @keydown=${this.__handlePress}
+        @keyup=${this.__handlePress}
+        aria-describedby=${o(this.softDisabled ? DISABLED_REASON_ID : undefined)}
+        ?aria-disabled=${this.softDisabled}
+        ?disabled=${this.disabled}
+        ${spread(this.configAria)}
+      >
+        ${this.renderButtonContent()}
+      </button>`;
+        }
+        cssClasses['native-link'] = true;
+        return b `<a
+      class=${e(cssClasses)}
+      id="button"
+      href=${this.href}
+      target=${this.target}
+      tabindex=${this.disabled ? '-1' : '0'}
+      @click=${this.__dispatchClick}
+      @mousedown=${this.__handlePress}
+      @keydown=${this.__handlePress}
+      @keyup=${this.__handlePress}
+      role="button"
+      aria-describedby=${o(this.softDisabled ? DISABLED_REASON_ID : undefined)}
+      ?aria-disabled=${this.softDisabled}
+      ${spread(this.configAria)}
+    >
+      ${this.renderButtonContent()}
+    </a>`;
+    }
+    renderButtonContent() {
+        return b `
+      <slot class="icon-slot"></slot>
+      <div class="touch"></div>
+      ${this.__renderDisabledReason(this.softDisabled)}
+    `;
+    }
+}
+IconButton.styles = [css_248z$1, css_248z$2, css_248z$3, css_248z];
+__decorate([
+    n$1({ reflect: true })
+], IconButton.prototype, "size", void 0);
+__decorate([
+    n$1({ type: String })
+], IconButton.prototype, "type", void 0);
+__decorate([
+    n$1({ reflect: true })
+], IconButton.prototype, "variant", void 0);
+__decorate([
+    n$1({ reflect: true })
+], IconButton.prototype, "color", void 0);
+__decorate([
+    n$1({ reflect: true })
+], IconButton.prototype, "configAria", void 0);
+__decorate([
+    n$1({ type: Boolean, reflect: true })
+], IconButton.prototype, "skeleton", void 0);
+__decorate([
+    n$1({ type: Boolean, reflect: true })
+], IconButton.prototype, "toggle", void 0);
+__decorate([
+    n$1({ type: Boolean, reflect: true })
+], IconButton.prototype, "selected", void 0);
+__decorate([
+    n$1()
+], IconButton.prototype, "throttleDelay", void 0);
+__decorate([
+    n$1()
+], IconButton.prototype, "tooltip", void 0);
+__decorate([
+    n$1({ type: Boolean, reflect: true })
+], IconButton.prototype, "pressed", void 0);
+__decorate([
+    e$1('.button')
+], IconButton.prototype, "buttonElement", void 0);
+
+export { IconButton as I };
+//# sourceMappingURL=icon-button-DJ0kZXYr.js.map

package/dist/icon-button-DJ0kZXYr.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-button-DJ0kZXYr.js","sources":["../../src/button/icon-button/icon-button.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { when } from 'lit/directives/when.js';\nimport buttonLayers from '../button/button-layers.scss';\nimport styles from '../button/button.scss';\nimport colorStyles from '../button/button-colors.scss';\nimport sizeStyles from './icon-button-sizes.scss';\nimport { spread } from '@/__directive/spread.js';\nimport { throttle } from '@/__utils/throttle.js';\nimport { isLink } from '@/__utils/is-link.js';\nimport { observerSlotChangesWithCallback } from '@/__utils/observe-slot-change.js';\nimport {\n  dispatchActivationClick,\n  isActivationClick,\n} from '@/__utils/dispatch-event-utils.js';\nimport NativeButtonMixin from '@/__mixins/NativeButtonMixin.js';\nimport NativeHyperlinkMixin from '@/__mixins/NativeHyperlinkMixin.js';\nimport { GroupButtonInterface } from '@/button/GroupButtonInterface.js';\nimport { DISABLED_REASON_ID } from '@/button/ButtonConstants.js';\n\n/**\n * @label Icon Button\n * @tag wc-icon-button\n * @rawTag icon-button\n *\n * @summary Icon buttons allow users to take actions, and make choices, with a single tap.\n *\n * @overview\n * <p>Icon buttons are clickable elements that are used to trigger actions. They communicate calls to action to the user and allow users to interact with pages in a variety of ways. IconButton labels express what action will occur when the user interacts with it.</p>\n *\n * @cssprop --button-container-shape: Defines the border radius of the button container shape.\n *\n * @cssprop --button-container-shape-start-start: Defines the start position of the button container shape.\n * @cssprop --button-container-shape-start-end: Defines the end position of the button container shape.\n * @cssprop --button-container-shape-end-start: Defines the start position of the button container shape.\n * @cssprop --button-container-shape-end-end: Defines the end position of the button container shape.\n *\n *\n * @cssprop --filled-button-container-color: Color of the filled button container.\n * @cssprop --filled-button-label-text-color: Text color of the filled button label.\n *\n * @cssprop --outlined-button-container-color: Color of the outlined button container.\n * @cssprop --outlined-button-label-text-color: Text color of the outlined button label.\n *\n * @cssprop --text-button-label-text-color: Text color of the text button label.\n *\n * @cssprop --tonal-button-container-color: Color of the tonal button container.\n * @cssprop --tonal-button-label-text-color: Text color of the tonal button label.\n *\n * @cssprop --elevated-button-container-color: Color of the elevated button container.\n * @cssprop --elevated-button-label-text-color: Text color of the elevated button label.\n *\n * @cssprop --neo-button-container-color: Color of the neo button container.\n * @cssprop --neo-button-label-text-color: Text color of the neo button label.\n *\n * @fires {CustomEvent} button:click - Dispatched when the button is clicked.\n *\n * @example\n * ```html\n * <wc-icon-button><wc-icon name=\"home\"></wc-icon></wc-icon-button>\n * ```\n * @tags display\n */\nexport class IconButton\n  extends NativeButtonMixin(NativeHyperlinkMixin(LitElement))\n  implements GroupButtonInterface\n{\n  static override styles = [buttonLayers, styles, colorStyles, sizeStyles];\n\n  /**\n   * Button size.\n   * Possible values are `\"xs\"`, `\"sm\"`, `\"md\"`, `\"lg\"`, `\"xl\"`. Defaults to `\"sm\"`.\n   */\n  @property({ reflect: true }) size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n\n  /**\n   * Type is preset of color and variant. Type will be only applied.\n   *\n   */\n  @property({ type: String }) type?: 'primary' | 'secondary' | 'tertiary';\n\n  /**\n   * The visual style of the button.\n   *\n   *  Possible variant values:\n   * `\"filled\"` is a filled button.\n   * `\"outlined\"` is an outlined button.\n   * `\"text\"` is a transparent button.\n   * `\"tonal\"` is a light color button.\n   * `\"elevated\"` is elevated button\n   */\n  @property({ reflect: true }) variant:\n    | 'elevated'\n    | 'filled'\n    | 'tonal'\n    | 'outlined'\n    | 'text'\n    | 'neo' = 'filled';\n\n  /**\n   * Defines the primary color of the button. This can be set to predefined color names to apply specific color themes.\n   */\n  @property({ reflect: true }) color:\n    | 'primary'\n    | 'success'\n    | 'danger'\n    | 'warning'\n    | 'surface'\n    | 'on-surface' = 'primary';\n\n  /**\n   * Additional ARIA attributes to pass to the inner button/anchor element.\n   */\n  @property({ reflect: true })\n  configAria?: { [key: string]: any };\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  @property({ type: Boolean, reflect: true })\n  pressed = 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    this.pressed =\n      (event instanceof KeyboardEvent &&\n        event.type === 'keydown' &&\n        (event.key === 'Enter' || event.key === ' ')) ||\n      event.type === 'mousedown';\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  __renderDisabledReason(softDisabled: boolean) {\n    if (softDisabled)\n      return html`<div\n        id=${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 class=\"tooltip\" for=\"button\">${this.tooltip}</wc-tooltip>`;\n    }\n    return nothing;\n  }\n\n  override focus() {\n    this.buttonElement?.focus();\n  }\n\n  override blur() {\n    this.buttonElement?.blur();\n  }\n\n  override firstUpdated() {\n    this.__dispatchClickWithThrottle = throttle(\n      this.__dispatchClick,\n      this.throttleDelay,\n    );\n    this.__convertTypeToVariantAndColor();\n  }\n\n  __convertTypeToVariantAndColor() {\n    if (this.type === 'primary') {\n      this.color = 'primary';\n      this.variant = 'filled';\n    } else if (this.type === 'secondary') {\n      this.color = 'surface';\n      this.variant = 'filled';\n    } else if (this.type === 'tertiary') {\n      this.color = 'primary';\n      this.variant = 'text';\n    } else if (this.type === 'danger') {\n      this.color = 'danger';\n      this.variant = 'filled';\n    }\n  }\n\n  override render() {\n    return html`\n      <wc-focus-ring class=\"focus-ring\" for=\"button\"></wc-focus-ring>\n      <wc-elevation class=\"elevation\"></wc-elevation>\n      ${when(\n        this.variant === 'neo',\n        () => html`<div class=\"neo-background\"></div>`,\n      )}\n      <div class=\"background\"></div>\n      ${when(\n        this.variant === 'outlined' || this.variant === 'neo',\n        () => html`<div class=\"outline\"></div>`,\n      )}\n      <wc-ripple class=\"ripple\" for=\"button\"></wc-ripple>\n      <wc-skeleton class=\"skeleton\"></wc-skeleton>\n\n      ${this.renderButtonElement()} ${this.__renderTooltip()}\n    `;\n  }\n\n  renderButtonElement() {\n    const cssClasses = {\n      button: true,\n      'button-element': true,\n      [`size-${this.size}`]: true,\n      [`variant-${this.variant}`]: true,\n      [`color-${this.color}`]: true,\n      disabled: this.disabled || this.softDisabled,\n      pressed: this.pressed,\n      skeleton: this.skeleton,\n    };\n\n    if (!isLink(this)) {\n      cssClasses['native-button'] = true;\n      return html`<button\n        class=${classMap(cssClasses)}\n        id=\"button\"\n        type=${this.htmlType}\n        @click=${this.__dispatchClickWithThrottle}\n        @mousedown=${this.__handlePress}\n        @keydown=${this.__handlePress}\n        @keyup=${this.__handlePress}\n        aria-describedby=${ifDefined(\n          this.softDisabled ? DISABLED_REASON_ID : undefined,\n        )}\n        ?aria-disabled=${this.softDisabled}\n        ?disabled=${this.disabled}\n        ${spread(this.configAria)}\n      >\n        ${this.renderButtonContent()}\n      </button>`;\n    }\n    cssClasses['native-link'] = true;\n    return html`<a\n      class=${classMap(cssClasses)}\n      id=\"button\"\n      href=${this.href}\n      target=${this.target}\n      tabindex=${this.disabled ? '-1' : '0'}\n      @click=${this.__dispatchClick}\n      @mousedown=${this.__handlePress}\n      @keydown=${this.__handlePress}\n      @keyup=${this.__handlePress}\n      role=\"button\"\n      aria-describedby=${ifDefined(\n        this.softDisabled ? DISABLED_REASON_ID : undefined,\n      )}\n      ?aria-disabled=${this.softDisabled}\n      ${spread(this.configAria)}\n    >\n      ${this.renderButtonContent()}\n    </a>`;\n  }\n\n  renderButtonContent() {\n    return html`\n      <slot class=\"icon-slot\"></slot>\n      <div class=\"touch\"></div>\n      ${this.__renderDisabledReason(this.softDisabled)}\n    `;\n  }\n}\n"],"names":["LitElement","html","nothing","when","classMap","ifDefined","buttonLayers","styles","colorStyles","sizeStyles","property","query"],"mappings":"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"}

package/dist/index.js

@@ -1,9 +1,9 @@
 export { I as Icon } from './icon-CueRR7wx.js';
-export { A as Accordion, a as Avatar, B as Badge, b as Breadcrumb, c as BreadcrumbItem, C as Checkbox, d as Chip, e as ChipSet, f as CircularProgress, g as Container, D as DatePicker, h as Divider, E as Elevation, i as EmptyState, F as Field, j as FocusRing, I as Image, k as Input, L as LinearProgress, l as Link, m as List, n as ListItem, M as Menu, o as MenuItem, N as NavigationRail, p as NavigationRailItem, q as NumberField, P as Pagination, R as Radio, r as Ripple, S as SegmentedButton, s as SegmentedButtonGroup, t as Select, u as SelectOptionElement, v as SidebarMenu, w as SidebarMenuItem, x as SidebarSubMenu, y as Skeleton, z as Slider, G as Snackbar, H as Spinner, J as SubMenu, K as Svg, O as Switch, T as Tab, Q as TabGroup, U as TabPanel, V as Table, W as Tabs, X as Tag, Y as Textarea, Z as TimePicker, _ as Tooltip, $ as UrlField } from './navigation-rail-CD7IrqbN.js';
+export { A as Accordion, a as Avatar, B as Badge, b as Breadcrumb, c as BreadcrumbItem, C as Checkbox, d as Chip, e as ChipSet, f as CircularProgress, g as Container, D as DatePicker, h as Divider, E as Elevation, i as EmptyState, F as Field, j as FocusRing, I as Image, k as Input, l as Item, L as LinearProgress, m as Link, n as List, o as ListItem, M as Menu, p as MenuItem, N as NavigationRail, q as NavigationRailItem, r as NumberField, P as Pagination, R as Radio, s as Ripple, S as SegmentedButton, t as SegmentedButtonGroup, u as Select, v as SelectOptionElement, w as SidebarMenu, x as SidebarMenuItem, y as SidebarSubMenu, z as Skeleton, G as Slider, H as Snackbar, J as Spinner, K as SubMenu, O as Svg, Q as Switch, T as Tab, U as TabGroup, V as TabPanel, W as Table, X as Tabs, Y as Tag, Z as Textarea, _ as TimePicker, $ as Tooltip, a0 as UrlField } from './navigation-rail-CM_svs5_.js';
 export { Clock } from './clock.js';
 export { Button } from './button.js';
-export { ButtonGroup } from './button-group.js';
-export { I as IconButton } from './icon-button-ohxHhy4t.js';
+export { default as ButtonGroup } from './button-group.js';
+export { I as IconButton } from './icon-button-DJ0kZXYr.js';
 export { Fab } from './fab.js';
 export { SplitButton } from './split-button.js';
 export { DropdownButton } from './dropdown-button.js';
@@ -44,15 +44,15 @@ import './state-DwbEjqVk.js';
 import './directive-ZPhl09Yt.js';
 import './unsafe-html-BsGUjx94.js';
 import './class-map-YU7g0o3B.js';
-import './observe-slot-change-BGJfgg2E.js';
+import './observe-slot-change-D8Xg-kSS.js';
 import './query-QBcUV-L_.js';
-import './BaseHyperlinkMixin-BNuwbiEf.js';
-import './BaseButton-BNFAYn-S.js';
+import './NativeHyperlinkMixin-DrYXyfMQ.js';
+import './ButtonConstants-D06bY4uy.js';
 import './dispatch-event-utils-CuEqjlPT.js';
 import './style-map-DVmWOuYy.js';
 import './BaseInput-14YmcfK7.js';
 import './is-dark-mode-DOcaw4Yq.js';
-import './button-colors-AvGh22Zn.js';
+import './button-colors-Dwnez1tR.js';
 import './transform-DSwFSqzD.js';
 import './pie-Dz0IDiPt.js';
 import './array-D5vjT2Xm.js';