solid-ui 3.1.3-0 → 3.1.3-10

package/dist/chunks/button-znE29yDV.js

@@ -1,348 +0,0 @@
-import { i as e, n as t, s as n, t as r } from "./lit-CC2G_f_C.js";
-//#region src/v2/components/actions/button/Button.ts
-var i = class extends r {
-	static properties = {
-		label: {
-			type: String,
-			reflect: !0
-		},
-		type: {
-			type: String,
-			reflect: !0
-		},
-		disabled: {
-			type: Boolean,
-			reflect: !0
-		},
-		selected: {
-			type: Boolean,
-			reflect: !0
-		},
-		ariaLabel: {
-			type: String,
-			attribute: "aria-label"
-		},
-		name: {
-			type: String,
-			reflect: !0
-		},
-		value: {
-			type: String,
-			reflect: !0
-		},
-		variant: {
-			type: String,
-			reflect: !0
-		},
-		size: {
-			type: String,
-			reflect: !0
-		},
-		theme: {
-			type: String,
-			reflect: !0
-		},
-		fullWidth: {
-			type: Boolean,
-			attribute: "full-width",
-			reflect: !0
-		},
-		icon: {
-			type: String,
-			reflect: !0
-		},
-		iconPosition: {
-			type: String,
-			attribute: "icon-position",
-			reflect: !0
-		},
-		contentAlign: {
-			type: String,
-			attribute: "content-align",
-			reflect: !0
-		},
-		handleClick: { attribute: !1 },
-		_hasSlottedIcon: { state: !0 }
-	};
-	static styles = n`
-    :host {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      --button-background: var(--color-background, #f8f9fb);
-      --button-text: var(--color-text-subheading, #101828);
-      --button-border: var(--color-border-button, var(--gray-300, #D1D5DC));
-      --button-hover-background: var(--color-surface-subtle, rgba(15, 23, 43, 0.04));
-      --button-hover-border: var(--color-border-button-hover, var(--gray-400, #99A1AF));
-      --button-hover-text: var(--color-text-subheading, #101828);
-      --button-selected-background: var(--color-surface-selected, var(--color-surface-action, var(--color-primary, #7C4DFF)));
-      --button-selected-text: var(--color-text-selected, var(--color-text-on-action, var(--white, #FFF)));
-      --button-selected-border: var(--color-border-selected, var(--color-border-action, var(--color-primary, #7C4DFF)));
-      --button-icon-color: currentColor;
-      --button-focus-ring: var(--color-focus-ring, var(--color-primary, #7C4DFF));
-      --button-height-sm: 1.875rem;
-      --button-height-md: var(--min-touch-target, 44px);
-      --button-height-lg: calc(var(--min-touch-target, 44px) + 0.5rem);
-      --button-padding-x-sm: var(--spacing-xs, 0.75rem);
-      --button-padding-x-md: var(--spacing-sm, 0.9375rem);
-      --button-padding-x-lg: var(--spacing-md, 1.25rem);
-      --button-font-size-sm: var(--font-size-sm, 0.875rem);
-      --button-font-size-md: var(--font-size-md, 1rem);
-      --button-font-size-lg: var(--font-size-lg, 1.125rem);
-      --button-icon-size-sm: var(--icon-xxxs, 0.75rem);
-      --button-icon-size-md: var(--icon-xxs, 1rem);
-      --button-icon-size-lg: var(--icon-xxs, 1rem);
-      --button-padding-sm: 0 var(--button-padding-x-sm);
-      --button-padding-md: 0 var(--button-padding-x-md);
-      --button-padding-lg: 0 var(--button-padding-x-lg);
-      --button-border-width: 1px;
-      --button-border-radius: var(--border-radius-base, 0.3125rem);
-      --button-font-weight: var(--font-weight-bold, 600);
-      --button-line-height: 1;
-      --button-justify-content: center;
-      --button-content-justify-content: var(--button-justify-content);
-      --button-label-text-align: center;
-      --button-box-shadow: none;
-      --button-hover-box-shadow: var(--button-box-shadow);
-      --button-active-box-shadow: var(--button-hover-box-shadow);
-      --button-active-transform: translateY(1px);
-      --button-focus-outline: 2px solid var(--button-focus-ring);
-      --button-focus-outline-offset: 2px;
-      --button-focus-box-shadow: none;
-      --button-transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
-    }
-
-    :host([hidden]) {
-      display: none;
-    }
-
-    :host([theme='dark']) {
-      --button-background: var(--color-background, #242a31);
-      --button-text: var(--color-text-subheading, #f8f9fb);
-      --button-border: var(--color-border, #46515b);
-      --button-hover-background: var(--color-surface-subtle, rgba(15, 23, 43, 0.04));
-      --button-hover-border: var(--color-border, #46515b);
-      --button-hover-text: var(--color-text-subheading, #f8f9fb);
-    }
-
-    :host([variant='primary']) {
-      --button-background: var(--color-surface-action, var(--color-primary, #7C4DFF));
-      --button-text: var(--color-text-on-action, var(--white, #FFF));
-      --button-border: var(--color-border-action, var(--color-primary, #7C4DFF));
-      --button-hover-background: var(--color-surface-action-hover, #6d3cf2);
-      --button-hover-border: var(--color-border-action, var(--color-primary, #7C4DFF));
-      --button-hover-text: var(--color-text-on-action, var(--white, #FFF));
-    }
-
-    :host([variant='icon']) {
-      --button-padding-x-sm: var(--spacing-xxs, 0.3125rem);
-      --button-padding-x-md: var(--spacing-base, 0.5rem);
-      --button-padding-x-lg: var(--spacing-2xs, 0.625rem);
-    }
-
-    :host([full-width]) {
-      width: 100%;
-    }
-
-    :host([content-align='start']) {
-      --button-justify-content: flex-start;
-      --button-content-justify-content: flex-start;
-      --button-label-text-align: left;
-    }
-
-    :host([content-align='end']) {
-      --button-justify-content: flex-end;
-      --button-content-justify-content: flex-end;
-      --button-label-text-align: right;
-    }
-
-    :host([selected]) {
-      --button-background: var(--button-selected-background);
-      --button-text: var(--button-selected-text);
-      --button-border: var(--button-selected-border);
-    }
-
-    .button {
-      display: inline-flex;
-      width: 100%;
-      min-height: var(--button-height-md);
-      padding: var(--button-padding-md);
-      align-items: center;
-      justify-content: var(--button-justify-content);
-      gap: var(--spacing-xxs, 0.375rem);
-      border-radius: var(--button-border-radius);
-      background: var(--button-background);
-      border: var(--button-border-width) solid var(--button-border);
-      box-shadow: var(--button-box-shadow);
-      color: var(--button-text);
-      cursor: pointer;
-      font: inherit;
-      font-size: var(--button-font-size-md);
-      font-weight: var(--button-font-weight);
-      line-height: var(--button-line-height);
-      white-space: nowrap;
-      text-decoration: none;
-      box-sizing: border-box;
-      transition: var(--button-transition);
-    }
-
-    :host([size='sm']) .button {
-      min-height: var(--button-height-sm);
-      padding: var(--button-padding-sm);
-      font-size: var(--button-font-size-sm);
-    }
-
-    :host([size='lg']) .button {
-      min-height: var(--button-height-lg);
-      padding: var(--button-padding-lg);
-      font-size: var(--button-font-size-lg);
-    }
-
-    .button:hover:not(:disabled) {
-      background: var(--button-hover-background);
-      border-color: var(--button-hover-border, var(--button-border));
-      box-shadow: var(--button-hover-box-shadow, var(--button-box-shadow));
-      color: var(--button-hover-text);
-    }
-
-    :host([selected]) .button:hover:not(:disabled) {
-      background: var(--button-hover-background);
-      border-color: var(--button-selected-border);
-      color: var(--button-selected-text);
-    }
-      
-    .button:focus-visible {
-      outline: var(--button-focus-outline);
-      outline-offset: var(--button-focus-outline-offset);
-      box-shadow: var(--button-focus-box-shadow);
-    }
-
-    .button:disabled {
-      opacity: 0.6;
-      cursor: not-allowed;
-      transform: none;
-    }
-
-    .button__content {
-      display: inline-flex;
-      align-items: center;
-      justify-content: var(--button-content-justify-content);
-      gap: inherit;
-      width: 100%;
-    }
-
-    :host([icon-position='end']) .button__content {
-      flex-direction: row-reverse;
-    }
-
-    .button__icon {
-      width: var(--button-icon-size-md);
-      height: var(--button-icon-size-md);
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      color: var(--button-icon-color);
-      flex-shrink: 0;
-    }
-
-    :host([size='sm']) .button__icon {
-      width: var(--button-icon-size-sm);
-      height: var(--button-icon-size-sm);
-    }
-
-    :host([size='lg']) .button__icon {
-      width: var(--button-icon-size-lg);
-      height: var(--button-icon-size-lg);
-    }
-
-    .button__icon ::slotted(*) {
-      width: 100%;
-      height: 100%;
-      display: block;
-    }
-
-    .button__icon-image {
-      width: 100%;
-      height: 100%;
-      object-fit: contain;
-    }
-
-    .button__label {
-      display: inline-flex;
-      align-items: center;
-      justify-content: var(--button-content-justify-content);
-      min-width: 0;
-      width: 100%;
-      text-align: var(--button-label-text-align);
-    }
-
-    :host([variant='icon']) .button__label {
-      display: none;
-    }
-
-    .button:active {
-      transform: var(--button-active-transform);
-      box-shadow: var(--button-active-box-shadow, var(--button-hover-box-shadow, var(--button-box-shadow)));
-    }
-  `;
-	_iconSlotObserver;
-	constructor() {
-		super(), this.label = "", this.type = "button", this.disabled = !1, this.selected = !1, this.ariaLabel = "", this.name = "", this.value = "", this.variant = "secondary", this.size = "md", this.theme = "light", this.fullWidth = !1, this.icon = "", this.iconPosition = "start", this.contentAlign = "center", this.handleClick = void 0, this._hasSlottedIcon = !1;
-	}
-	connectedCallback() {
-		super.connectedCallback(), this._syncSlottedIconPresence(), this._iconSlotObserver = new MutationObserver(() => {
-			this._syncSlottedIconPresence();
-		}), this._iconSlotObserver.observe(this, {
-			childList: !0,
-			attributes: !0,
-			attributeFilter: ["slot"]
-		});
-	}
-	disconnectedCallback() {
-		this._iconSlotObserver?.disconnect(), this._iconSlotObserver = void 0, super.disconnectedCallback();
-	}
-	_handleButtonClick(e) {
-		this.handleClick?.(e);
-	}
-	_handleIconSlotChange(e) {
-		let t = e.target;
-		this._hasSlottedIcon = t.assignedNodes({ flatten: !0 }).length > 0;
-	}
-	_syncSlottedIconPresence() {
-		this._hasSlottedIcon = this.querySelector("[slot=\"icon\"]") !== null;
-	}
-	_renderIcon() {
-		return !this._hasSlottedIcon && !this.icon ? t : e`
-      <span class="button__icon" part="icon">
-        <slot name="icon" @slotchange=${this._handleIconSlotChange}></slot>
-        ${!this._hasSlottedIcon && this.icon ? e`<img class="button__icon-image" src=${this.icon} alt="" aria-hidden="true" />` : t}
-      </span>
-    `;
-	}
-	render() {
-		return e`
-      <button
-        class="button"
-        type=${this.type}
-        ?disabled=${this.disabled}
-        aria-label=${this.ariaLabel || t}
-        name=${this.name || t}
-        value=${this.value || t}
-        part="button"
-        @click=${this._handleButtonClick}
-      >
-        <span class="button__content">
-          ${this._renderIcon()}
-          <span class="button__label" part="label">
-            <slot>${this.label}</slot>
-          </span>
-        </span>
-      </button>
-    `;
-	}
-}, a = "solid-ui-button";
-customElements.get(a) || customElements.define(a, i);
-//#endregion
-export { i as t };
-
-//# sourceMappingURL=button-znE29yDV.js.map

package/dist/chunks/button-znE29yDV.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"button-znE29yDV.js","names":["LitElement","html","css","nothing","Button","properties","label","type","String","reflect","disabled","Boolean","selected","ariaLabel","attribute","name","value","variant","size","theme","fullWidth","icon","iconPosition","contentAlign","handleClick","_hasSlottedIcon","state","styles","_iconSlotObserver","constructor","undefined","connectedCallback","_syncSlottedIconPresence","MutationObserver","observe","childList","attributes","attributeFilter","disconnectedCallback","disconnect","_handleButtonClick","event","_handleIconSlotChange","slot","target","assignedNodes","flatten","length","querySelector","_renderIcon","render","Button","BUTTON_TAG_NAME","customElements","get","define"],"sources":["../../src/v2/components/actions/button/Button.ts","../../src/v2/components/actions/button/index.ts"],"sourcesContent":["import { LitElement, html, css, nothing } from 'lit'\n\nexport class Button extends LitElement {\n  static properties = {\n    label: { type: String, reflect: true },\n    type: { type: String, reflect: true },\n    disabled: { type: Boolean, reflect: true },\n    selected: { type: Boolean, reflect: true },\n    ariaLabel: { type: String, attribute: 'aria-label' },\n    name: { type: String, reflect: true },\n    value: { type: String, reflect: true },\n    variant: { type: String, reflect: true },\n    size: { type: String, reflect: true },\n    theme: { type: String, reflect: true },\n    fullWidth: { type: Boolean, attribute: 'full-width', reflect: true },\n    icon: { type: String, reflect: true },\n    iconPosition: { type: String, attribute: 'icon-position', reflect: true },\n    contentAlign: { type: String, attribute: 'content-align', reflect: true },\n    handleClick: { attribute: false },\n    _hasSlottedIcon: { state: true }\n  }\n\n  static styles = css`\n    :host {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      --button-background: var(--color-background, #f8f9fb);\n      --button-text: var(--color-text-subheading, #101828);\n      --button-border: var(--color-border-button, var(--gray-300, #D1D5DC));\n      --button-hover-background: var(--color-surface-subtle, rgba(15, 23, 43, 0.04));\n      --button-hover-border: var(--color-border-button-hover, var(--gray-400, #99A1AF));\n      --button-hover-text: var(--color-text-subheading, #101828);\n      --button-selected-background: var(--color-surface-selected, var(--color-surface-action, var(--color-primary, #7C4DFF)));\n      --button-selected-text: var(--color-text-selected, var(--color-text-on-action, var(--white, #FFF)));\n      --button-selected-border: var(--color-border-selected, var(--color-border-action, var(--color-primary, #7C4DFF)));\n      --button-icon-color: currentColor;\n      --button-focus-ring: var(--color-focus-ring, var(--color-primary, #7C4DFF));\n      --button-height-sm: 1.875rem;\n      --button-height-md: var(--min-touch-target, 44px);\n      --button-height-lg: calc(var(--min-touch-target, 44px) + 0.5rem);\n      --button-padding-x-sm: var(--spacing-xs, 0.75rem);\n      --button-padding-x-md: var(--spacing-sm, 0.9375rem);\n      --button-padding-x-lg: var(--spacing-md, 1.25rem);\n      --button-font-size-sm: var(--font-size-sm, 0.875rem);\n      --button-font-size-md: var(--font-size-md, 1rem);\n      --button-font-size-lg: var(--font-size-lg, 1.125rem);\n      --button-icon-size-sm: var(--icon-xxxs, 0.75rem);\n      --button-icon-size-md: var(--icon-xxs, 1rem);\n      --button-icon-size-lg: var(--icon-xxs, 1rem);\n      --button-padding-sm: 0 var(--button-padding-x-sm);\n      --button-padding-md: 0 var(--button-padding-x-md);\n      --button-padding-lg: 0 var(--button-padding-x-lg);\n      --button-border-width: 1px;\n      --button-border-radius: var(--border-radius-base, 0.3125rem);\n      --button-font-weight: var(--font-weight-bold, 600);\n      --button-line-height: 1;\n      --button-justify-content: center;\n      --button-content-justify-content: var(--button-justify-content);\n      --button-label-text-align: center;\n      --button-box-shadow: none;\n      --button-hover-box-shadow: var(--button-box-shadow);\n      --button-active-box-shadow: var(--button-hover-box-shadow);\n      --button-active-transform: translateY(1px);\n      --button-focus-outline: 2px solid var(--button-focus-ring);\n      --button-focus-outline-offset: 2px;\n      --button-focus-box-shadow: none;\n      --button-transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;\n    }\n\n    :host([hidden]) {\n      display: none;\n    }\n\n    :host([theme='dark']) {\n      --button-background: var(--color-background, #242a31);\n      --button-text: var(--color-text-subheading, #f8f9fb);\n      --button-border: var(--color-border, #46515b);\n      --button-hover-background: var(--color-surface-subtle, rgba(15, 23, 43, 0.04));\n      --button-hover-border: var(--color-border, #46515b);\n      --button-hover-text: var(--color-text-subheading, #f8f9fb);\n    }\n\n    :host([variant='primary']) {\n      --button-background: var(--color-surface-action, var(--color-primary, #7C4DFF));\n      --button-text: var(--color-text-on-action, var(--white, #FFF));\n      --button-border: var(--color-border-action, var(--color-primary, #7C4DFF));\n      --button-hover-background: var(--color-surface-action-hover, #6d3cf2);\n      --button-hover-border: var(--color-border-action, var(--color-primary, #7C4DFF));\n      --button-hover-text: var(--color-text-on-action, var(--white, #FFF));\n    }\n\n    :host([variant='icon']) {\n      --button-padding-x-sm: var(--spacing-xxs, 0.3125rem);\n      --button-padding-x-md: var(--spacing-base, 0.5rem);\n      --button-padding-x-lg: var(--spacing-2xs, 0.625rem);\n    }\n\n    :host([full-width]) {\n      width: 100%;\n    }\n\n    :host([content-align='start']) {\n      --button-justify-content: flex-start;\n      --button-content-justify-content: flex-start;\n      --button-label-text-align: left;\n    }\n\n    :host([content-align='end']) {\n      --button-justify-content: flex-end;\n      --button-content-justify-content: flex-end;\n      --button-label-text-align: right;\n    }\n\n    :host([selected]) {\n      --button-background: var(--button-selected-background);\n      --button-text: var(--button-selected-text);\n      --button-border: var(--button-selected-border);\n    }\n\n    .button {\n      display: inline-flex;\n      width: 100%;\n      min-height: var(--button-height-md);\n      padding: var(--button-padding-md);\n      align-items: center;\n      justify-content: var(--button-justify-content);\n      gap: var(--spacing-xxs, 0.375rem);\n      border-radius: var(--button-border-radius);\n      background: var(--button-background);\n      border: var(--button-border-width) solid var(--button-border);\n      box-shadow: var(--button-box-shadow);\n      color: var(--button-text);\n      cursor: pointer;\n      font: inherit;\n      font-size: var(--button-font-size-md);\n      font-weight: var(--button-font-weight);\n      line-height: var(--button-line-height);\n      white-space: nowrap;\n      text-decoration: none;\n      box-sizing: border-box;\n      transition: var(--button-transition);\n    }\n\n    :host([size='sm']) .button {\n      min-height: var(--button-height-sm);\n      padding: var(--button-padding-sm);\n      font-size: var(--button-font-size-sm);\n    }\n\n    :host([size='lg']) .button {\n      min-height: var(--button-height-lg);\n      padding: var(--button-padding-lg);\n      font-size: var(--button-font-size-lg);\n    }\n\n    .button:hover:not(:disabled) {\n      background: var(--button-hover-background);\n      border-color: var(--button-hover-border, var(--button-border));\n      box-shadow: var(--button-hover-box-shadow, var(--button-box-shadow));\n      color: var(--button-hover-text);\n    }\n\n    :host([selected]) .button:hover:not(:disabled) {\n      background: var(--button-hover-background);\n      border-color: var(--button-selected-border);\n      color: var(--button-selected-text);\n    }\n      \n    .button:focus-visible {\n      outline: var(--button-focus-outline);\n      outline-offset: var(--button-focus-outline-offset);\n      box-shadow: var(--button-focus-box-shadow);\n    }\n\n    .button:disabled {\n      opacity: 0.6;\n      cursor: not-allowed;\n      transform: none;\n    }\n\n    .button__content {\n      display: inline-flex;\n      align-items: center;\n      justify-content: var(--button-content-justify-content);\n      gap: inherit;\n      width: 100%;\n    }\n\n    :host([icon-position='end']) .button__content {\n      flex-direction: row-reverse;\n    }\n\n    .button__icon {\n      width: var(--button-icon-size-md);\n      height: var(--button-icon-size-md);\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      color: var(--button-icon-color);\n      flex-shrink: 0;\n    }\n\n    :host([size='sm']) .button__icon {\n      width: var(--button-icon-size-sm);\n      height: var(--button-icon-size-sm);\n    }\n\n    :host([size='lg']) .button__icon {\n      width: var(--button-icon-size-lg);\n      height: var(--button-icon-size-lg);\n    }\n\n    .button__icon ::slotted(*) {\n      width: 100%;\n      height: 100%;\n      display: block;\n    }\n\n    .button__icon-image {\n      width: 100%;\n      height: 100%;\n      object-fit: contain;\n    }\n\n    .button__label {\n      display: inline-flex;\n      align-items: center;\n      justify-content: var(--button-content-justify-content);\n      min-width: 0;\n      width: 100%;\n      text-align: var(--button-label-text-align);\n    }\n\n    :host([variant='icon']) .button__label {\n      display: none;\n    }\n\n    .button:active {\n      transform: var(--button-active-transform);\n      box-shadow: var(--button-active-box-shadow, var(--button-hover-box-shadow, var(--button-box-shadow)));\n    }\n  `\n\n  declare label: string\n  declare type: 'button' | 'submit' | 'reset'\n  declare disabled: boolean\n  declare selected: boolean\n  declare ariaLabel: string\n  declare name: string\n  declare value: string\n  declare variant: 'primary' | 'secondary' | 'icon'\n  declare size: 'sm' | 'md' | 'lg'\n  declare theme: 'light' | 'dark'\n  declare fullWidth: boolean\n  declare icon: string\n  declare iconPosition: 'start' | 'end'\n  declare contentAlign: 'start' | 'center' | 'end'\n  declare handleClick?: (event: MouseEvent) => void\n  declare _hasSlottedIcon: boolean\n  private _iconSlotObserver?: MutationObserver\n\n  constructor () {\n    super()\n    this.label = ''\n    this.type = 'button'\n    this.disabled = false\n    this.selected = false\n    this.ariaLabel = ''\n    this.name = ''\n    this.value = ''\n    this.variant = 'secondary'\n    this.size = 'md'\n    this.theme = 'light'\n    this.fullWidth = false\n    this.icon = ''\n    this.iconPosition = 'start'\n    this.contentAlign = 'center'\n    this.handleClick = undefined\n    this._hasSlottedIcon = false\n  }\n\n  connectedCallback () {\n    super.connectedCallback()\n    this._syncSlottedIconPresence()\n\n    this._iconSlotObserver = new MutationObserver(() => {\n      this._syncSlottedIconPresence()\n    })\n\n    this._iconSlotObserver.observe(this, {\n      childList: true,\n      attributes: true,\n      attributeFilter: ['slot']\n    })\n  }\n\n  disconnectedCallback () {\n    this._iconSlotObserver?.disconnect()\n    this._iconSlotObserver = undefined\n    super.disconnectedCallback()\n  }\n\n  private _handleButtonClick (event: MouseEvent) {\n    this.handleClick?.(event)\n  }\n\n  private _handleIconSlotChange (event: Event) {\n    const slot = event.target as HTMLSlotElement\n    this._hasSlottedIcon = slot.assignedNodes({ flatten: true }).length > 0\n  }\n\n  private _syncSlottedIconPresence () {\n    this._hasSlottedIcon = this.querySelector('[slot=\"icon\"]') !== null\n  }\n\n  private _renderIcon () {\n    if (!this._hasSlottedIcon && !this.icon) {\n      return nothing\n    }\n\n    return html`\n      <span class=\"button__icon\" part=\"icon\">\n        <slot name=\"icon\" @slotchange=${this._handleIconSlotChange}></slot>\n        ${!this._hasSlottedIcon && this.icon\n          ? html`<img class=\"button__icon-image\" src=${this.icon} alt=\"\" aria-hidden=\"true\" />`\n          : nothing}\n      </span>\n    `\n  }\n\n  render () {\n    return html`\n      <button\n        class=\"button\"\n        type=${this.type}\n        ?disabled=${this.disabled}\n        aria-label=${this.ariaLabel || nothing}\n        name=${this.name || nothing}\n        value=${this.value || nothing}\n        part=\"button\"\n        @click=${this._handleButtonClick}\n      >\n        <span class=\"button__content\">\n          ${this._renderIcon()}\n          <span class=\"button__label\" part=\"label\">\n            <slot>${this.label}</slot>\n          </span>\n        </span>\n      </button>\n    `\n  }\n}\n","import { Button } from './Button'\n\nexport { Button }\n\nconst BUTTON_TAG_NAME = 'solid-ui-button'\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'solid-ui-button': Button\n  }\n}\n\nif (!customElements.get(BUTTON_TAG_NAME)) {\n  customElements.define(BUTTON_TAG_NAME, Button)\n}\n"],"mappings":"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"}