@mhmo91/schmancy 0.9.27 → 0.10.1

package/dist/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","names":[],"sources":["../src/button/button.ts","../src/button/icon-button.ts"],"sourcesContent":["import { $LitElement } from '@mixins/index'\nimport { provide } from '@lit/context'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query, queryAssignedElements } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { when } from 'lit/directives/when.js'\nimport { magnetic } from '../directives/magnetic'\nimport { SchmancyButtonSizeContext, type SchmancyButtonSize } from './context'\n\nexport interface SchmancyButtonEventMap {\n\tSchmancyFocus: CustomEvent<void>\n\tSchmancyBlur: CustomEvent<void>\n}\n\nexport type ButtonVariant = 'elevated' | 'filled' | 'filled tonal' | 'tonal' | 'outlined' | 'text'\nexport type ButtonColor = 'primary' | 'secondary' | 'success' | 'error' | 'warning' | 'info' | 'neutral'\n\n/**\n * Material Design button — primary interactive surface for triggering actions or navigation.\n * @element schmancy-button\n * @summary Trigger actions or navigate. Form-associated; participates in native form submission.\n * @example\n * <schmancy-button variant=\"filled\" @click=${() => save()}>Save</schmancy-button>\n * <schmancy-button variant=\"outlined\" href=\"/next\">Continue</schmancy-button>\n * @platform button click - Schmancy-skinned native `<button type=\"submit\">`. When `href` is set, degrades to `<a href=\"…\">`. Falls back to plain `<button>` styled with Tailwind if the tag never registers.\n * @slot - The default slot.\n * @slot prefix - The prefix slot.\n * @slot suffix - The suffix slot.\n * @csspart base - The underlying native `<button>` (or `<a>` when `href` is set).\n */\n@customElement('schmancy-button')\nexport class SchmancyButton extends $LitElement(\n\tcss`:host{\n\t\tdisplay: inline-block;\n\t\tmin-width: fit-content;\n\t\toverflow: hidden;\n\t\tposition: relative;\n\t\ttouch-action: manipulation;\n\t\tborder-radius: 1rem;\n\t\ttransition:\n\t\t\tbox-shadow 300ms cubic-bezier(0.34, 1.56, 0.64, 1),\n\t\t\ttransform 200ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\t}\n\t:host(:hover:not([disabled])) {\n\t\tbox-shadow: 0 4px 16px -4px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 20%, transparent);\n\t}\n\t:host(:active:not([disabled])) {\n\t\ttransform: scale(0.97);\n\t\tbox-shadow: 0 1px 4px -2px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 10%, transparent);\n\t\ttransition-duration: 100ms;\n\t}\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host { transition: none; }\n\t\t:host(:hover:not([disabled])) { box-shadow: none; }\n\t\t:host(:active:not([disabled])) { transform: none; box-shadow: none; }\n\t}\n\t:host *,\n\t* {\n\t\ttouch-action: manipulation;\n\t}`\n) {\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\tstatic formAssociated = true\n\tprivate internals: ElementInternals | undefined\n\n\tconstructor() {\n\t\tsuper()\n\t\ttry {\n\t\t\tthis.internals = this.attachInternals()\n\t\t} catch {\n\t\t\tthis.internals = undefined\n\t\t}\n\t\t// Translate clicks into native form semantics so the button works\n\t\t// inside any <form>, not just inside <schmancy-form>.\n\t\tthis.addEventListener('click', (e: MouseEvent) => {\n\t\t\tif (this.disabled) {\n\t\t\t\te.preventDefault()\n\t\t\t\te.stopImmediatePropagation()\n\t\t\t\treturn\n\t\t\t}\n\t\t\tconst form = this.internals?.form\n\t\t\tif (!form) return\n\t\t\tif (this.type === 'submit') {\n\t\t\t\te.preventDefault()\n\t\t\t\tform.requestSubmit()\n\t\t\t} else if (this.type === 'reset') {\n\t\t\t\te.preventDefault()\n\t\t\t\tform.reset()\n\t\t\t}\n\t\t})\n\t}\n\n\t/** Associated form, when placed inside a <form>. */\n\tget form(): HTMLFormElement | null {\n\t\treturn this.internals?.form ?? null\n\t}\n\n\tformDisabledCallback(disabled: boolean): void {\n\t\tthis.disabled = disabled\n\t}\n\n\t@query('[part=\"base\"]', true)\n\tprivate nativeElement!: HTMLElement\n\n\tprivate _ariaLabel!: string\n\n\t/**\n\t * The variant of the button.\n\t * @attr\n\t * @default 'text'\n\t * @public\n\t */\n\t@property({ reflect: true, type: String })\n\tpublic variant: ButtonVariant = 'text'\n\n\t/**\n\t * The color of the button.\n\t * @attr\n\t * @default Depends on variant: 'primary' for filled/elevated/outlined/text, 'secondary' for tonal\n\t * @public\n\t */\n\t@property({ reflect: true, type: String })\n\tpublic color?: ButtonColor\n\n\t/**\n\t * The width of the button.\n\t * @attr\n\t * @type {'full' | 'auto'}\n\t * @default 'auto'\n\t * @public\n\t */\n\t@property()\n\tpublic width: 'full' | 'auto' = 'auto'\n\n\t/**\n\t * The size of the button.\n\t * Provided as `SchmancyButtonSizeContext` to descendant elements so children\n\t * (e.g. `<schmancy-icon>`) can auto-size against the enclosing button.\n\t * @attr\n\t * @type {'xxs' | 'xs' | 'sm' | 'md' | 'lg'}\n\t * @default 'md'\n\t * @public\n\t */\n\t@provide({ context: SchmancyButtonSizeContext })\n\t@property({ type: String })\n\tpublic size: SchmancyButtonSize = 'md'\n\n\t/**\n\t * The type of the button.\n\t * Defaults to 'button' (preventing accidental form submissions).\n\t * @attr\n\t */\n\t@property({ reflect: true, type: String })\n\tpublic type: 'button' | 'reset' | 'submit' = 'button'\n\n\t/**\n\t * The URL the button points to.\n\t * If provided, the component will render as an anchor element.\n\t * @attr\n\t */\n\t@property()\n\tpublic href?: string\n\n\t/**\n\t * Determines whether the button is disabled.\n\t * @attr\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tpublic disabled = false\n\n\tpublic override set ariaLabel(value: string) {\n\t\tconst oldVal = this._ariaLabel\n\t\tthis._ariaLabel = value\n\n\t\tif (this.hasAttribute('aria-label')) {\n\t\t\tthis.removeAttribute('aria-label')\n\t\t}\n\t\tthis.requestUpdate('ariaLabel', oldVal)\n\t}\n\n\t@property({ attribute: 'aria-label' })\n\tpublic override get ariaLabel() {\n\t\treturn this._ariaLabel\n\t}\n\n\t@queryAssignedElements({\n\t\tslot: 'prefix',\n\t\tflatten: true,\n\t\tselector: 'img',\n\t})\n\tprivate prefixImgs!: HTMLImageElement[]\n\n\t@queryAssignedElements({\n\t\tslot: 'suffix',\n\t\tflatten: true,\n\t\tselector: 'img',\n\t})\n\tprivate suffixImgs!: HTMLImageElement[]\n\n\t/** Sets focus in the button. */\n\tpublic override focus(options?: FocusOptions) {\n\t\tthis.nativeElement.focus(options)\n\t}\n\n\t/** Removes focus from the button. */\n\tpublic override blur() {\n\t\tthis.nativeElement.blur()\n\t}\n\n\t/**\n\t * Get the effective color based on variant if not explicitly set\n\t * M3 spec: filled = primary, tonal = secondary, others = primary\n\t */\n\tprotected get effectiveColor(): ButtonColor {\n\t\tif (this.color) return this.color\n\n\t\t// Map 'tonal' to 'filled tonal' for checking\n\t\tconst effectiveVariant = this.variant === 'tonal' ? 'filled tonal' : this.variant\n\n\t\t// M3 defaults: tonal uses secondary, others use primary\n\t\treturn effectiveVariant === 'filled tonal' ? 'secondary' : 'primary'\n\t}\n\n\tprotected get imgClasses(): string[] {\n\t\t// M3 spec: icon sizes scale with button size\n\t\tconst sizeMap = {\n\t\t\txxs: 'w-3 h-3',    // 12px for 24px button (ultra-compact)\n\t\t\txs: 'w-4 h-4',     // 16px for 32px button (M3 dense)\n\t\t\tsm: 'w-5 h-5',     // 20px for 40px button (M3 default)\n\t\t\tmd: 'w-6 h-6',     // 24px for 48px button (M3 large)\n\t\t\tlg: 'w-7 h-7'      // 28px for 56px button (M3 extra large)\n\t\t}\n\t\treturn [sizeMap[this.size], 'object-contain']\n\t}\n\n\tfirstUpdated() {\n\t\t// Add image classes and ensure decorative images have an empty alt.\n\t\tthis.prefixImgs?.forEach(img => {\n\t\t\timg.classList.add(...this.imgClasses)\n\t\t\tif (!img.hasAttribute('alt')) {\n\t\t\t\timg.setAttribute('alt', '')\n\t\t\t}\n\t\t})\n\t\tthis.suffixImgs?.forEach(img => {\n\t\t\timg.classList.add(...this.imgClasses)\n\t\t\tif (!img.hasAttribute('alt')) {\n\t\t\t\timg.setAttribute('alt', '')\n\t\t\t}\n\t\t})\n\t}\n\n\tclick(): void {\n\t\tthis.dispatchEvent(new Event('click', { bubbles: true, composed: true }))\n\t}\n\n\t// Prevent default behavior when the component is disabled.\n\tprivate _preventDefault(event: Event) {\n\t\tevent.preventDefault()\n\t\tevent.stopPropagation()\n\t}\n\n\trender() {\n\t\t// Map 'tonal' variant to 'filled tonal' for backwards compatibility\n\t\tconst effectiveVariant = this.variant === 'tonal' ? 'filled tonal' : this.variant;\n\n\t\t// Compute classes for the interactive element.\n\t\tconst classes = {\n\t\t\t'z-0 transition-all duration-200 relative rounded-2xl inline-flex justify-center items-center outline-secondary-default focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-offset-2 outline-hidden w-[inherit] overflow-hidden':\n\t\t\t\ttrue,\n\t\t\t// Height - M3 spec: 24dp (xxs) → 32dp (dense) → 40dp (default) → 48dp (large) → 56dp (XL)\n\t\t\t'h-6': this.size === 'xxs',   // 24px - Ultra-compact\n\t\t\t'h-8': this.size === 'xs',    // 32px - M3 dense/compact\n\t\t\t'h-10': this.size === 'sm',   // 40px - M3 default\n\t\t\t'h-12': this.size === 'md',   // 48px - M3 large\n\t\t\t'h-14': this.size === 'lg',   // 56px - M3 extra large\n\t\t\t// Padding - M3 spec: horizontal padding 24dp default, scaled proportionally\n\t\t\t'py-1 px-2': this.size === 'xxs',    // 4px/8px for 24px height\n\t\t\t'py-2 px-4': this.size === 'xs',     // 8px/16px for 32px height\n\t\t\t'py-2.5 px-5': this.size === 'sm',   // 10px/20px for 40px height\n\t\t\t'py-3 px-6': this.size === 'md',     // 12px/24px for 48px height (M3 default)\n\t\t\t'py-4 px-7': this.size === 'lg',     // 16px/28px for 56px height\n\t\t\t// Typography - M3 spec: label-large (14px) default, scaled\n\t\t\t'text-[10px] font-medium leading-3': this.size === 'xxs', // 10px\n\t\t\t'text-xs font-medium leading-4': this.size === 'xs',   // 12px\n\t\t\t'text-sm font-medium leading-5': this.size === 'sm' || this.size === 'md',   // 14px - M3 label-large\n\t\t\t'text-base font-medium leading-6': this.size === 'lg', // 16px\n\t\t\t// Letter spacing - M3 spec\n\t\t\t'tracking-[0.1px]': true,\n\t\t\t// Gap - Scaled with size\n\t\t\t'gap-0.5': this.size === 'xxs', // 2px\n\t\t\t'gap-1': this.size === 'xs',    // 4px\n\t\t\t'gap-1.5': this.size === 'sm',  // 6px\n\t\t\t'gap-2': this.size === 'md',    // 8px\n\t\t\t'gap-2.5': this.size === 'lg',  // 10px\n\t\t\t'cursor-pointer': !this.disabled,\n\t\t\t'opacity-[0.38]': this.disabled,\n\t\t\t'hover:shadow-sm': !this.disabled && effectiveVariant === 'elevated',\n\t\t\t'w-full tex-center': this.width === 'full',\n\t\t\t// Elevated variant\n\t\t\t'bg-surface-low shadow-xs': effectiveVariant === 'elevated',\n\t\t\t// Outlined variant\n\t\t\t'bg-transparent border-1 border-solid': effectiveVariant === 'outlined',\n\t\t\t'border-outline': effectiveVariant === 'outlined' && this.effectiveColor === 'primary',\n\t\t\t'border-success-default': effectiveVariant === 'outlined' && this.effectiveColor === 'success',\n\t\t\t'border-error-default': effectiveVariant === 'outlined' && this.effectiveColor === 'error',\n\t\t\t'border-warning-default': effectiveVariant === 'outlined' && this.effectiveColor === 'warning',\n\t\t\t'border-info-default': effectiveVariant === 'outlined' && this.effectiveColor === 'info',\n\t\t\t'border-secondary-default': effectiveVariant === 'outlined' && this.effectiveColor === 'secondary',\n\t\t\t'border-outline-variant': effectiveVariant === 'outlined' && this.effectiveColor === 'neutral',\n\t\t\t// Filled variant - background colors\n\t\t\t'bg-primary-default': effectiveVariant === 'filled' && this.effectiveColor === 'primary',\n\t\t\t'bg-secondary-default': effectiveVariant === 'filled' && this.effectiveColor === 'secondary',\n\t\t\t'bg-success-default': effectiveVariant === 'filled' && this.effectiveColor === 'success',\n\t\t\t'bg-error-default': effectiveVariant === 'filled' && this.effectiveColor === 'error',\n\t\t\t'bg-warning-default': effectiveVariant === 'filled' && this.effectiveColor === 'warning',\n\t\t\t'bg-info-default': effectiveVariant === 'filled' && this.effectiveColor === 'info',\n\t\t\t'bg-surface-containerHighest': effectiveVariant === 'filled' && this.effectiveColor === 'neutral',\n\t\t\t// Filled variant - text colors\n\t\t\t'text-primary-on': effectiveVariant === 'filled' && this.effectiveColor === 'primary',\n\t\t\t'text-secondary-on': effectiveVariant === 'filled' && this.effectiveColor === 'secondary',\n\t\t\t'text-success-on': effectiveVariant === 'filled' && this.effectiveColor === 'success',\n\t\t\t'text-error-on': effectiveVariant === 'filled' && this.effectiveColor === 'error',\n\t\t\t'text-warning-on': effectiveVariant === 'filled' && this.effectiveColor === 'warning',\n\t\t\t'text-info-on': effectiveVariant === 'filled' && this.effectiveColor === 'info',\n\t\t\t'text-surface-on': effectiveVariant === 'filled' && this.effectiveColor === 'neutral',\n\t\t\t// Filled tonal variant - background colors\n\t\t\t'bg-primary-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'primary',\n\t\t\t'bg-secondary-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'secondary',\n\t\t\t'bg-success-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'success',\n\t\t\t'bg-error-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'error',\n\t\t\t'bg-warning-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'warning',\n\t\t\t'bg-info-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'info',\n\t\t\t'bg-surface-containerLow': effectiveVariant === 'filled tonal' && this.effectiveColor === 'neutral',\n\t\t\t// Filled tonal variant - text colors\n\t\t\t'text-primary-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'primary',\n\t\t\t'text-secondary-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'secondary',\n\t\t\t'text-success-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'success',\n\t\t\t'text-error-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'error',\n\t\t\t'text-warning-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'warning',\n\t\t\t'text-info-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'info',\n\t\t\t// Text and elevated variants - text colors\n\t\t\t'text-primary-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'primary',\n\t\t\t'text-secondary-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'secondary',\n\t\t\t'text-success-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'success',\n\t\t\t'text-error-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'error',\n\t\t\t'text-warning-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'warning',\n\t\t\t'text-info-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'info',\n\t\t\t'text-surface-onVariant': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined' || effectiveVariant === 'filled tonal') && this.effectiveColor === 'neutral',\n\t\t}\n\n\t\tconst stateLayerClasses = {\n\t\t\t'absolute inset-0 hover:opacity-[0.08] z-0 rounded-2xl': true,\n\t\t\t// M3 focus and pressed states\n\t\t\t'focus-visible:opacity-[0.10]': true,  // M3 focus state\n\t\t\t'active:opacity-[0.10]': true,         // M3 pressed state\n\t\t\t// Filled variant hover\n\t\t\t'hover:bg-primary-on': effectiveVariant === 'filled' && this.effectiveColor === 'primary',\n\t\t\t'hover:bg-secondary-on': effectiveVariant === 'filled' && this.effectiveColor === 'secondary',\n\t\t\t'hover:bg-success-on': effectiveVariant === 'filled' && this.effectiveColor === 'success',\n\t\t\t'hover:bg-error-on': effectiveVariant === 'filled' && this.effectiveColor === 'error',\n\t\t\t'hover:bg-warning-on': effectiveVariant === 'filled' && this.effectiveColor === 'warning',\n\t\t\t'hover:bg-info-on': effectiveVariant === 'filled' && this.effectiveColor === 'info',\n\t\t\t'hover:bg-surface-on': effectiveVariant === 'filled' && this.effectiveColor === 'neutral',\n\t\t\t// Outlined, elevated, text variants hover\n\t\t\t'hover:bg-primary-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'primary',\n\t\t\t'hover:bg-secondary-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'secondary',\n\t\t\t'hover:bg-success-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'success',\n\t\t\t'hover:bg-error-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'error',\n\t\t\t'hover:bg-warning-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'warning',\n\t\t\t'hover:bg-info-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'info',\n\t\t\t'hover:bg-surface-onVariant': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'neutral',\n\t\t\t// Filled tonal hover\n\t\t\t'hover:bg-primary-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'primary',\n\t\t\t'hover:bg-secondary-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'secondary',\n\t\t\t'hover:bg-success-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'success',\n\t\t\t'hover:bg-error-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'error',\n\t\t\t'hover:bg-warning-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'warning',\n\t\t\t'hover:bg-info-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'info',\n\t\t\t'hover:bg-surface-containerLow': effectiveVariant === 'filled tonal' && this.effectiveColor === 'neutral',\n\t\t}\n\n\t\t// If href is provided, render an anchor element.\n\t\tif (this.href) {\n\t\t\treturn html`\n\t\t\t\t<a\n\t\t\t\t\t${magnetic({ strength: 3, radius: 60 })}\n\t\t\t\t\tpart=\"base\"\n\t\t\t\t\thref=${ifDefined(this.disabled ? undefined : this.href)}\n\t\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\t\tclass=\"${this.classMap(classes)}\"\n\t\t\t\t\ttabindex=${this.disabled ? '-1' : '0'}\n\t\t\t\t\taria-disabled=${this.disabled}\n\t\t\t\t\t@click=${this.disabled ? this._preventDefault : undefined}\n\t\t\t\t>\n\t\t\t\t\t${when(!this.disabled, () => html`<div class=\"${this.classMap(stateLayerClasses)}\"></div>`)}\n\t\t\t\t\t<slot name=\"prefix\"></slot>\n\t\t\t\t\t<slot></slot>\n\t\t\t\t\t<slot name=\"suffix\"></slot>\n\t\t\t\t</a>\n\t\t\t`\n\t\t}\n\n\t\t// Otherwise, render a native button element.\n\t\treturn html`\n\t\t\t<button\n\t\t\t\t${magnetic({ strength: 3, radius: 60 })}\n\t\t\t\tpart=\"base\"\n\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\t?disabled=${this.disabled}\n\t\t\t\tclass=\"${this.classMap(classes)}\"\n\t\t\t\ttype=${ifDefined(this.type)}\n\t\t\t\ttabindex=${ifDefined(this.disabled ? '-1' : undefined)}\n\t\t\t>\n\t\t\t\t${when(!this.disabled, () => html`<div class=\"${this.classMap(stateLayerClasses)}\"></div>`)}\n\t\t\t\t<slot name=\"prefix\"></slot>\n\t\t\t\t<slot></slot>\n\t\t\t\t<slot name=\"suffix\"></slot>\n\t\t\t</button>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-button': SchmancyButton\n\t}\n}\n","import { $LitElement } from '@mixins/index'\nimport { css, html, LitElement, PropertyValueMap } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { when } from 'lit/directives/when.js'\nimport { magnetic } from '../directives/magnetic'\nimport { ButtonVariant } from './button'\n\n/**\n * Icon-only button for toolbar actions, close affordances, or overflow menus.\n * @element schmancy-icon-button\n * @summary Compact round/square button wrapping a single icon glyph. Form-associated like schmancy-button.\n * @example\n * <schmancy-icon-button aria-label=\"Close\" @click=${() => close()}>\n *   <schmancy-icon>close</schmancy-icon>\n * </schmancy-icon-button>\n * @platform button click - Schmancy-skinned native `<button>` (or `<a>` when `href` is set). aria-label is required for a11y because there's no text content.\n * @slot - The default slot (usually an icon or glyph).\n * @csspart base - The underlying native `<button>` (or `<a>` when `href` is set).\n */\n@customElement('schmancy-icon-button')\nexport class SchmnacyIconButton extends $LitElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tborder-radius: 9999px;\n\t\ttransition:\n\t\t\tbox-shadow 300ms cubic-bezier(0.34, 1.56, 0.64, 1),\n\t\t\ttransform 200ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\t}\n\t:host(:hover:not([disabled])) {\n\t\tbox-shadow: 0 2px 12px -4px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 18%, transparent);\n\t}\n\t:host(:active:not([disabled])) {\n\t\ttransform: scale(0.92);\n\t\tbox-shadow: none;\n\t\ttransition-duration: 100ms;\n\t}\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host { transition: none; }\n\t\t:host(:hover:not([disabled])) { box-shadow: none; }\n\t\t:host(:active:not([disabled])) { transform: none; box-shadow: none; }\n\t}\n`) {\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\t@query('[part=\"base\"]', true)\n\tprivate nativeElement!: HTMLElement\n\n\tprivate _ariaLabel!: string\n\n\t/**\n\t * The size of the icon.\n\t * @attr\n\t * @default 'md'\n\t */\n\t@property({ type: String })\n\tpublic size: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'md'\n\n\t/**\n\t * The variant of the button.\n\t * @attr\n\t * @default 'text'\n\t */\n\t@property({ reflect: true, type: String })\n\tpublic variant: ButtonVariant = 'text'\n\n\t/**\n\t * The width of the button.\n\t * @attr\n\t * @type {'full' | 'auto'}\n\t * @default 'auto'\n\t */\n\t@property()\n\tpublic width: 'full' | 'auto' = 'auto'\n\n\t/**\n\t * The type of the button.\n\t * Defaults to 'button' (preventing accidental form submissions).\n\t * @attr\n\t */\n\t@property({ reflect: true, type: String })\n\tpublic type: 'button' | 'reset' | 'submit' = 'button'\n\n\t/**\n\t * The URL the button points to.\n\t * If provided, the component will render as an anchor element.\n\t * @attr\n\t */\n\t@property()\n\tpublic href?: string\n\n\t/**\n\t * Determines whether the button is disabled.\n\t * @attr\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tpublic disabled = false\n\n\t/**\n\t * Render slot content as text instead of wrapping in schmancy-icon.\n\t * Use this when you want to display text labels in the button.\n\t * @attr\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tpublic text = false\n\n\t/**\n\t * Icon name - use this instead of slot content to prevent translation breaking icons.\n\t * Example: <schmancy-icon-button icon=\"add\"></schmancy-icon-button>\n\t * @attr\n\t */\n\t@property({ type: String })\n\tpublic icon?: string\n\n\t// Reactively captured icon name from slot content (translation-proof)\n\t@state()\n\tprivate _capturedIcon?: string\n\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\t// Pre-capture icon from children to avoid double render flash\n\t\tthis._captureIconFromChildren()\n\t}\n\n\t// Capture icon from direct children (for initial render)\n\tprivate _captureIconFromChildren(): void {\n\t\tif (this.icon || this.text) return\n\t\tfor (const node of this.childNodes) {\n\t\t\tif (node.nodeType === Node.TEXT_NODE) {\n\t\t\t\tconst text = node.textContent?.trim()\n\t\t\t\tif (text) {\n\t\t\t\t\tthis._capturedIcon = text\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// Handle slot content changes reactively (for dynamic updates)\n\tprivate _handleSlotChange(e: Event): void {\n\t\tif (this.icon || this.text) return\n\t\tconst slot = e.target as HTMLSlotElement\n\t\tconst nodes = slot.assignedNodes({ flatten: true })\n\t\tfor (const node of nodes) {\n\t\t\tif (node.nodeType === Node.TEXT_NODE) {\n\t\t\t\tconst text = node.textContent?.trim()\n\t\t\t\tif (text) {\n\t\t\t\t\tthis._capturedIcon = text\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// Manage aria-label manually so that we can always use our internal property.\n\tpublic override set ariaLabel(value: string) {\n\t\tconst oldVal = this._ariaLabel\n\t\tthis._ariaLabel = value\n\n\t\tif (this.hasAttribute('aria-label')) {\n\t\t\tthis.removeAttribute('aria-label')\n\t\t}\n\t\tthis.requestUpdate('ariaLabel', oldVal)\n\t}\n\n\t@property({ attribute: 'aria-label' })\n\tpublic override get ariaLabel() {\n\t\treturn this._ariaLabel\n\t}\n\n\t/** Sets focus in the button. */\n\tpublic override focus(options?: FocusOptions) {\n\t\tthis.nativeElement.focus(options)\n\t}\n\n\t/** Removes focus from the button. */\n\tpublic override blur() {\n\t\tthis.nativeElement.blur()\n\t}\n\n\tclick(): void {\n\t\tthis.dispatchEvent(new Event('click', { bubbles: true, composed: true }))\n\t}\n\n\t// Prevent default behavior when the component is disabled.\n\tprivate _preventDefault(event: Event) {\n\t\tevent.preventDefault()\n\t\tevent.stopPropagation()\n\t}\n\n\tprotected firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void {\n\t\t// Add any first-update logic here if needed.\n\t}\n\n\trender() {\n\t\t// Map 'tonal' variant to 'filled tonal' for backwards compatibility\n\t\tconst effectiveVariant = this.variant === 'tonal' ? 'filled tonal' : this.variant;\n\n\t\t// Compute classes for the interactive element.\n\t\tconst classes = {\n\t\t\t'z-0 h-full transition-all duration-200 relative rounded-full inline-flex justify-center items-center gap-[8px] outline-secondary-default focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-offset-2 outline-hidden':\n\t\t\t\ttrue,\n\t\t\t'opacity-[0.38]': this.disabled,\n\t\t\t'cursor-pointer': !this.disabled,\n\t\t\t'hover:shadow-xs':\n\t\t\t\t!this.disabled &&\n\t\t\t\t(effectiveVariant === 'outlined' ||\n\t\t\t\t\teffectiveVariant === 'text' ||\n\t\t\t\t\teffectiveVariant === 'filled' ||\n\t\t\t\t\teffectiveVariant === 'filled tonal'),\n\t\t\t'hover:shadow-sm': !this.disabled && effectiveVariant === 'elevated',\n\t\t\t'w-full text-center': this.width === 'full',\n\t\t\t'bg-surface-low text-primary-default shadow-xs': effectiveVariant === 'elevated',\n\t\t\t'bg-transparent text-primary-default border-1 border-outline': effectiveVariant === 'outlined',\n\t\t\t'bg-primary-default text-primary-on': effectiveVariant === 'filled',\n\t\t\t'bg-secondary-container text-secondary-onContainer': effectiveVariant === 'filled tonal',\n\t\t\t'text-primary-default': effectiveVariant === 'text',\n\t\t\t// M3 spec: 24dp (xxs) → 32dp (dense) → 40dp (default) → 48dp (standard) → 56dp (large)\n\t\t\t'p-1.5': this.size === 'xxs',    // 6px padding  = 24px total (12px icon) - Ultra-compact\n\t\t\t'p-2': this.size === 'xs',       // 8px padding  = 32px total (16px icon) - M3 dense\n\t\t\t'p-2.5': this.size === 'sm',     // 10px padding = 40px total (20px icon) - M3 default\n\t\t\t'p-3': this.size === 'md',       // 12px padding = 48px total (24px icon) - M3 standard\n\t\t\t'p-4': this.size === 'lg',       // 16px padding = 56px total (24px icon) - M3 large\n\t\t\t'p-5': this.size === 'xl',       // 20px padding = 80px total (40px icon) - custom XL\n\t\t}\n\n\t\tconst stateLayerClasses = {\n\t\t\t'hover:opacity-[0.08] rounded-full z-0': true,\n\t\t\t'hover:bg-primary-on': effectiveVariant === 'filled',\n\t\t\t'hover:bg-primary-default': effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text',\n\t\t\t'hover:bg-secondary-container': effectiveVariant === 'filled tonal',\n\t\t}\n\n\t\t// Icon size mapping - M3 spec: 24dp standard, scaled for density\n\t\tconst iconSize = this.size === 'xxs' ? '12px' : this.size === 'xs' ? '16px' : this.size === 'sm' ? '20px' : this.size === 'md' ? '24px' : this.size === 'lg' ? '24px' : '40px';\n\n\t\t// If href is provided, render an anchor element.\n\t\tif (this.href) {\n\t\t\treturn html`\n\t\t\t\t<a\n\t\t\t\t\t${magnetic({ strength: 3, radius: 50 })}\n\t\t\t\t\tpart=\"base\"\n\t\t\t\t\thref=${ifDefined(this.disabled ? undefined : this.href)}\n\t\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\t\tclass=\"${this.classMap(classes)}\"\n\t\t\t\t\ttabindex=${this.disabled ? '-1' : '0'}\n\t\t\t\t\taria-disabled=${this.disabled}\n\t\t\t\t\t@click=${this.disabled ? this._preventDefault : undefined}\n\t\t\t\t>\n\t\t\t\t\t${when(!this.disabled, () => html`<div class=\"absolute inset-0 ${this.classMap(stateLayerClasses)}\"></div>`)}\n\t\t\t\t\t${this.text\n\t\t\t\t\t\t? html`<slot></slot>`\n\t\t\t\t\t\t: html`\n\t\t\t\t\t\t\t<slot style=\"display:none\" @slotchange=${this._handleSlotChange}></slot>\n\t\t\t\t\t\t\t<schmancy-icon size=${iconSize} icon=${this.icon || this._capturedIcon}></schmancy-icon>\n\t\t\t\t\t\t`\n\t\t\t\t\t}\n\t\t\t\t</a>\n\t\t\t`\n\t\t}\n\n\t\t// Otherwise, render a native button element.\n\t\treturn html`\n\t\t\t<button\n\t\t\t\t${magnetic({ strength: 3, radius: 50 })}\n\t\t\t\tpart=\"base\"\n\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\t?disabled=${this.disabled}\n\t\t\t\tclass=\"${this.classMap(classes)}\"\n\t\t\t\ttype=${ifDefined(this.type)}\n\t\t\t\ttabindex=${ifDefined(this.disabled ? '-1' : undefined)}\n\t\t\t>\n\t\t\t\t${when(!this.disabled, () => html`<div class=\"absolute inset-0 ${this.classMap(stateLayerClasses)}\"></div>`)}\n\t\t\t\t${this.text\n\t\t\t\t\t? html`<slot></slot>`\n\t\t\t\t\t: html`\n\t\t\t\t\t\t<slot style=\"display:none\" @slotchange=${this._handleSlotChange}></slot>\n\t\t\t\t\t\t<schmancy-icon size=${iconSize} icon=${this.icon || this._capturedIcon}></schmancy-icon>\n\t\t\t\t\t`\n\t\t\t\t}\n\t\t\t</button>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-icon-button': SchmnacyIconButton\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"file":"button.js","names":[],"sources":["../src/button/button.ts","../src/button/icon-button.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { provide } from '@lit/context'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query, queryAssignedElements } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { when } from 'lit/directives/when.js'\nimport { magnetic } from '../directives/magnetic'\nimport { SchmancyButtonSizeContext, type SchmancyButtonSize } from './context'\n\nexport interface SchmancyButtonEventMap {\n\tSchmancyFocus: CustomEvent<void>\n\tSchmancyBlur: CustomEvent<void>\n}\n\nexport type ButtonVariant = 'elevated' | 'filled' | 'filled tonal' | 'tonal' | 'outlined' | 'text'\nexport type ButtonColor = 'primary' | 'secondary' | 'success' | 'error' | 'warning' | 'info' | 'neutral'\n\n/**\n * A button component.\n * @element schmancy-button\n * @slot - The default slot.\n * @slot prefix - The prefix slot.\n * @slot suffix - The suffix slot.\n * @csspart base - The underlying native `<button>` (or `<a>` when `href` is set).\n */\n@customElement('schmancy-button')\nexport class SchmancyButton extends SchmancyElement {\n\tstatic styles = [css`:host{\n\t\tdisplay: inline-block;\n\t\tmin-width: fit-content;\n\t\toverflow: hidden;\n\t\tposition: relative;\n\t\ttouch-action: manipulation;\n\t\tborder-radius: 1rem;\n\t\ttransition:\n\t\t\tbox-shadow 300ms cubic-bezier(0.34, 1.56, 0.64, 1),\n\t\t\ttransform 200ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\t}\n\t:host(:hover:not([disabled])) {\n\t\tbox-shadow: 0 4px 16px -4px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 20%, transparent);\n\t}\n\t:host(:active:not([disabled])) {\n\t\ttransform: scale(0.97);\n\t\tbox-shadow: 0 1px 4px -2px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 10%, transparent);\n\t\ttransition-duration: 100ms;\n\t}\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host { transition: none; }\n\t\t:host(:hover:not([disabled])) { box-shadow: none; }\n\t\t:host(:active:not([disabled])) { transform: none; box-shadow: none; }\n\t}\n\t:host *,\n\t* {\n\t\ttouch-action: manipulation;\n\t}`]\n\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\tstatic formAssociated = true\n\tprivate internals: ElementInternals | undefined\n\n\tconstructor() {\n\t\tsuper()\n\t\ttry {\n\t\t\tthis.internals = this.attachInternals()\n\t\t} catch {\n\t\t\tthis.internals = undefined\n\t\t}\n\t\t// Translate clicks into native form semantics so the button works\n\t\t// inside any <form>, not just inside <schmancy-form>.\n\t\tthis.addEventListener('click', (e: MouseEvent) => {\n\t\t\tif (this.disabled) {\n\t\t\t\te.preventDefault()\n\t\t\t\te.stopImmediatePropagation()\n\t\t\t\treturn\n\t\t\t}\n\t\t\tconst form = this.internals?.form\n\t\t\tif (!form) return\n\t\t\tif (this.type === 'submit') {\n\t\t\t\te.preventDefault()\n\t\t\t\tform.requestSubmit()\n\t\t\t} else if (this.type === 'reset') {\n\t\t\t\te.preventDefault()\n\t\t\t\tform.reset()\n\t\t\t}\n\t\t})\n\t}\n\n\t/** Associated form, when placed inside a <form>. */\n\tget form(): HTMLFormElement | null {\n\t\treturn this.internals?.form ?? null\n\t}\n\n\tformDisabledCallback(disabled: boolean): void {\n\t\tthis.disabled = disabled\n\t}\n\n\t@query('[part=\"base\"]', true)\n\tprivate nativeElement!: HTMLElement\n\n\tprivate _ariaLabel!: string\n\n\t/**\n\t * The variant of the button.\n\t * @attr\n\t * @default 'text'\n\t * @public\n\t */\n\t@property({ reflect: true, type: String })\n\tpublic variant: ButtonVariant = 'text'\n\n\t/**\n\t * The color of the button.\n\t * @attr\n\t * @default Depends on variant: 'primary' for filled/elevated/outlined/text, 'secondary' for tonal\n\t * @public\n\t */\n\t@property({ reflect: true, type: String })\n\tpublic color?: ButtonColor\n\n\t/**\n\t * The width of the button.\n\t * @attr\n\t * @type {'full' | 'auto'}\n\t * @default 'auto'\n\t * @public\n\t */\n\t@property()\n\tpublic width: 'full' | 'auto' = 'auto'\n\n\t/**\n\t * The size of the button.\n\t * Provided as `SchmancyButtonSizeContext` to descendant elements so children\n\t * (e.g. `<schmancy-icon>`) can auto-size against the enclosing button.\n\t * @attr\n\t * @type {'xxs' | 'xs' | 'sm' | 'md' | 'lg'}\n\t * @default 'md'\n\t * @public\n\t */\n\t@provide({ context: SchmancyButtonSizeContext })\n\t@property({ type: String })\n\tpublic size: SchmancyButtonSize = 'md'\n\n\t/**\n\t * The type of the button.\n\t * Defaults to 'button' (preventing accidental form submissions).\n\t * @attr\n\t */\n\t@property({ reflect: true, type: String })\n\tpublic type: 'button' | 'reset' | 'submit' = 'button'\n\n\t/**\n\t * The URL the button points to.\n\t * If provided, the component will render as an anchor element.\n\t * @attr\n\t */\n\t@property()\n\tpublic href?: string\n\n\t/**\n\t * Determines whether the button is disabled.\n\t * @attr\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tpublic disabled = false\n\n\tpublic override set ariaLabel(value: string) {\n\t\tconst oldVal = this._ariaLabel\n\t\tthis._ariaLabel = value\n\n\t\tif (this.hasAttribute('aria-label')) {\n\t\t\tthis.removeAttribute('aria-label')\n\t\t}\n\t\tthis.requestUpdate('ariaLabel', oldVal)\n\t}\n\n\t@property({ attribute: 'aria-label' })\n\tpublic override get ariaLabel() {\n\t\treturn this._ariaLabel\n\t}\n\n\t@queryAssignedElements({\n\t\tslot: 'prefix',\n\t\tflatten: true,\n\t\tselector: 'img',\n\t})\n\tprivate prefixImgs!: HTMLImageElement[]\n\n\t@queryAssignedElements({\n\t\tslot: 'suffix',\n\t\tflatten: true,\n\t\tselector: 'img',\n\t})\n\tprivate suffixImgs!: HTMLImageElement[]\n\n\t/** Sets focus in the button. */\n\tpublic override focus(options?: FocusOptions) {\n\t\tthis.nativeElement.focus(options)\n\t}\n\n\t/** Removes focus from the button. */\n\tpublic override blur() {\n\t\tthis.nativeElement.blur()\n\t}\n\n\t/**\n\t * Get the effective color based on variant if not explicitly set\n\t * M3 spec: filled = primary, tonal = secondary, others = primary\n\t */\n\tprotected get effectiveColor(): ButtonColor {\n\t\tif (this.color) return this.color\n\n\t\t// Map 'tonal' to 'filled tonal' for checking\n\t\tconst effectiveVariant = this.variant === 'tonal' ? 'filled tonal' : this.variant\n\n\t\t// M3 defaults: tonal uses secondary, others use primary\n\t\treturn effectiveVariant === 'filled tonal' ? 'secondary' : 'primary'\n\t}\n\n\tprotected get imgClasses(): string[] {\n\t\t// M3 spec: icon sizes scale with button size\n\t\tconst sizeMap = {\n\t\t\txxs: 'w-3 h-3',    // 12px for 24px button (ultra-compact)\n\t\t\txs: 'w-4 h-4',     // 16px for 32px button (M3 dense)\n\t\t\tsm: 'w-5 h-5',     // 20px for 40px button (M3 default)\n\t\t\tmd: 'w-6 h-6',     // 24px for 48px button (M3 large)\n\t\t\tlg: 'w-7 h-7'      // 28px for 56px button (M3 extra large)\n\t\t}\n\t\treturn [sizeMap[this.size], 'object-contain']\n\t}\n\n\tfirstUpdated() {\n\t\t// Add image classes and ensure decorative images have an empty alt.\n\t\tthis.prefixImgs?.forEach(img => {\n\t\t\timg.classList.add(...this.imgClasses)\n\t\t\tif (!img.hasAttribute('alt')) {\n\t\t\t\timg.setAttribute('alt', '')\n\t\t\t}\n\t\t})\n\t\tthis.suffixImgs?.forEach(img => {\n\t\t\timg.classList.add(...this.imgClasses)\n\t\t\tif (!img.hasAttribute('alt')) {\n\t\t\t\timg.setAttribute('alt', '')\n\t\t\t}\n\t\t})\n\t}\n\n\tclick(): void {\n\t\tthis.dispatchEvent(new Event('click', { bubbles: true, composed: true }))\n\t}\n\n\t// Prevent default behavior when the component is disabled.\n\tprivate _preventDefault(event: Event) {\n\t\tevent.preventDefault()\n\t\tevent.stopPropagation()\n\t}\n\n\trender() {\n\t\t// Map 'tonal' variant to 'filled tonal' for backwards compatibility\n\t\tconst effectiveVariant = this.variant === 'tonal' ? 'filled tonal' : this.variant;\n\n\t\t// Compute classes for the interactive element.\n\t\tconst classes = {\n\t\t\t'z-0 transition-all duration-200 relative rounded-2xl inline-flex justify-center items-center outline-secondary-default focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-offset-2 outline-hidden w-[inherit] overflow-hidden':\n\t\t\t\ttrue,\n\t\t\t// Height - M3 spec: 24dp (xxs) → 32dp (dense) → 40dp (default) → 48dp (large) → 56dp (XL)\n\t\t\t'h-6': this.size === 'xxs',   // 24px - Ultra-compact\n\t\t\t'h-8': this.size === 'xs',    // 32px - M3 dense/compact\n\t\t\t'h-10': this.size === 'sm',   // 40px - M3 default\n\t\t\t'h-12': this.size === 'md',   // 48px - M3 large\n\t\t\t'h-14': this.size === 'lg',   // 56px - M3 extra large\n\t\t\t// Padding - M3 spec: horizontal padding 24dp default, scaled proportionally\n\t\t\t'py-1 px-2': this.size === 'xxs',    // 4px/8px for 24px height\n\t\t\t'py-2 px-4': this.size === 'xs',     // 8px/16px for 32px height\n\t\t\t'py-2.5 px-5': this.size === 'sm',   // 10px/20px for 40px height\n\t\t\t'py-3 px-6': this.size === 'md',     // 12px/24px for 48px height (M3 default)\n\t\t\t'py-4 px-7': this.size === 'lg',     // 16px/28px for 56px height\n\t\t\t// Typography - M3 spec: label-large (14px) default, scaled\n\t\t\t'text-[10px] font-medium leading-3': this.size === 'xxs', // 10px\n\t\t\t'text-xs font-medium leading-4': this.size === 'xs',   // 12px\n\t\t\t'text-sm font-medium leading-5': this.size === 'sm' || this.size === 'md',   // 14px - M3 label-large\n\t\t\t'text-base font-medium leading-6': this.size === 'lg', // 16px\n\t\t\t// Letter spacing - M3 spec\n\t\t\t'tracking-[0.1px]': true,\n\t\t\t// Gap - Scaled with size\n\t\t\t'gap-0.5': this.size === 'xxs', // 2px\n\t\t\t'gap-1': this.size === 'xs',    // 4px\n\t\t\t'gap-1.5': this.size === 'sm',  // 6px\n\t\t\t'gap-2': this.size === 'md',    // 8px\n\t\t\t'gap-2.5': this.size === 'lg',  // 10px\n\t\t\t'cursor-pointer': !this.disabled,\n\t\t\t'opacity-[0.38]': this.disabled,\n\t\t\t'hover:shadow-sm': !this.disabled && effectiveVariant === 'elevated',\n\t\t\t'w-full tex-center': this.width === 'full',\n\t\t\t// Elevated variant\n\t\t\t'bg-surface-low shadow-xs': effectiveVariant === 'elevated',\n\t\t\t// Outlined variant\n\t\t\t'bg-transparent border-1 border-solid': effectiveVariant === 'outlined',\n\t\t\t'border-outline': effectiveVariant === 'outlined' && this.effectiveColor === 'primary',\n\t\t\t'border-success-default': effectiveVariant === 'outlined' && this.effectiveColor === 'success',\n\t\t\t'border-error-default': effectiveVariant === 'outlined' && this.effectiveColor === 'error',\n\t\t\t'border-warning-default': effectiveVariant === 'outlined' && this.effectiveColor === 'warning',\n\t\t\t'border-info-default': effectiveVariant === 'outlined' && this.effectiveColor === 'info',\n\t\t\t'border-secondary-default': effectiveVariant === 'outlined' && this.effectiveColor === 'secondary',\n\t\t\t'border-outline-variant': effectiveVariant === 'outlined' && this.effectiveColor === 'neutral',\n\t\t\t// Filled variant - background colors\n\t\t\t'bg-primary-default': effectiveVariant === 'filled' && this.effectiveColor === 'primary',\n\t\t\t'bg-secondary-default': effectiveVariant === 'filled' && this.effectiveColor === 'secondary',\n\t\t\t'bg-success-default': effectiveVariant === 'filled' && this.effectiveColor === 'success',\n\t\t\t'bg-error-default': effectiveVariant === 'filled' && this.effectiveColor === 'error',\n\t\t\t'bg-warning-default': effectiveVariant === 'filled' && this.effectiveColor === 'warning',\n\t\t\t'bg-info-default': effectiveVariant === 'filled' && this.effectiveColor === 'info',\n\t\t\t'bg-surface-containerHighest': effectiveVariant === 'filled' && this.effectiveColor === 'neutral',\n\t\t\t// Filled variant - text colors\n\t\t\t'text-primary-on': effectiveVariant === 'filled' && this.effectiveColor === 'primary',\n\t\t\t'text-secondary-on': effectiveVariant === 'filled' && this.effectiveColor === 'secondary',\n\t\t\t'text-success-on': effectiveVariant === 'filled' && this.effectiveColor === 'success',\n\t\t\t'text-error-on': effectiveVariant === 'filled' && this.effectiveColor === 'error',\n\t\t\t'text-warning-on': effectiveVariant === 'filled' && this.effectiveColor === 'warning',\n\t\t\t'text-info-on': effectiveVariant === 'filled' && this.effectiveColor === 'info',\n\t\t\t'text-surface-on': effectiveVariant === 'filled' && this.effectiveColor === 'neutral',\n\t\t\t// Filled tonal variant - background colors\n\t\t\t'bg-primary-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'primary',\n\t\t\t'bg-secondary-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'secondary',\n\t\t\t'bg-success-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'success',\n\t\t\t'bg-error-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'error',\n\t\t\t'bg-warning-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'warning',\n\t\t\t'bg-info-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'info',\n\t\t\t'bg-surface-containerLow': effectiveVariant === 'filled tonal' && this.effectiveColor === 'neutral',\n\t\t\t// Filled tonal variant - text colors\n\t\t\t'text-primary-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'primary',\n\t\t\t'text-secondary-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'secondary',\n\t\t\t'text-success-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'success',\n\t\t\t'text-error-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'error',\n\t\t\t'text-warning-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'warning',\n\t\t\t'text-info-onContainer': effectiveVariant === 'filled tonal' && this.effectiveColor === 'info',\n\t\t\t// Text and elevated variants - text colors\n\t\t\t'text-primary-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'primary',\n\t\t\t'text-secondary-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'secondary',\n\t\t\t'text-success-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'success',\n\t\t\t'text-error-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'error',\n\t\t\t'text-warning-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'warning',\n\t\t\t'text-info-default': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined') && this.effectiveColor === 'info',\n\t\t\t'text-surface-onVariant': (effectiveVariant === 'text' || effectiveVariant === 'elevated' || effectiveVariant === 'outlined' || effectiveVariant === 'filled tonal') && this.effectiveColor === 'neutral',\n\t\t}\n\n\t\tconst stateLayerClasses = {\n\t\t\t'absolute inset-0 hover:opacity-[0.08] z-0 rounded-2xl': true,\n\t\t\t// M3 focus and pressed states\n\t\t\t'focus-visible:opacity-[0.10]': true,  // M3 focus state\n\t\t\t'active:opacity-[0.10]': true,         // M3 pressed state\n\t\t\t// Filled variant hover\n\t\t\t'hover:bg-primary-on': effectiveVariant === 'filled' && this.effectiveColor === 'primary',\n\t\t\t'hover:bg-secondary-on': effectiveVariant === 'filled' && this.effectiveColor === 'secondary',\n\t\t\t'hover:bg-success-on': effectiveVariant === 'filled' && this.effectiveColor === 'success',\n\t\t\t'hover:bg-error-on': effectiveVariant === 'filled' && this.effectiveColor === 'error',\n\t\t\t'hover:bg-warning-on': effectiveVariant === 'filled' && this.effectiveColor === 'warning',\n\t\t\t'hover:bg-info-on': effectiveVariant === 'filled' && this.effectiveColor === 'info',\n\t\t\t'hover:bg-surface-on': effectiveVariant === 'filled' && this.effectiveColor === 'neutral',\n\t\t\t// Outlined, elevated, text variants hover\n\t\t\t'hover:bg-primary-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'primary',\n\t\t\t'hover:bg-secondary-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'secondary',\n\t\t\t'hover:bg-success-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'success',\n\t\t\t'hover:bg-error-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'error',\n\t\t\t'hover:bg-warning-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'warning',\n\t\t\t'hover:bg-info-default': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'info',\n\t\t\t'hover:bg-surface-onVariant': (effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text') && this.effectiveColor === 'neutral',\n\t\t\t// Filled tonal hover\n\t\t\t'hover:bg-primary-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'primary',\n\t\t\t'hover:bg-secondary-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'secondary',\n\t\t\t'hover:bg-success-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'success',\n\t\t\t'hover:bg-error-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'error',\n\t\t\t'hover:bg-warning-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'warning',\n\t\t\t'hover:bg-info-container': effectiveVariant === 'filled tonal' && this.effectiveColor === 'info',\n\t\t\t'hover:bg-surface-containerLow': effectiveVariant === 'filled tonal' && this.effectiveColor === 'neutral',\n\t\t}\n\n\t\t// If href is provided, render an anchor element.\n\t\tif (this.href) {\n\t\t\treturn html`\n\t\t\t\t<a\n\t\t\t\t\t${magnetic({ strength: 3, radius: 60 })}\n\t\t\t\t\tpart=\"base\"\n\t\t\t\t\thref=${ifDefined(this.disabled ? undefined : this.href)}\n\t\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\t\tclass=\"${this.classMap(classes)}\"\n\t\t\t\t\ttabindex=${this.disabled ? '-1' : '0'}\n\t\t\t\t\taria-disabled=${this.disabled}\n\t\t\t\t\t@click=${this.disabled ? this._preventDefault : undefined}\n\t\t\t\t>\n\t\t\t\t\t${when(!this.disabled, () => html`<div class=\"${this.classMap(stateLayerClasses)}\"></div>`)}\n\t\t\t\t\t<slot name=\"prefix\"></slot>\n\t\t\t\t\t<slot></slot>\n\t\t\t\t\t<slot name=\"suffix\"></slot>\n\t\t\t\t</a>\n\t\t\t`\n\t\t}\n\n\t\t// Otherwise, render a native button element.\n\t\treturn html`\n\t\t\t<button\n\t\t\t\t${magnetic({ strength: 3, radius: 60 })}\n\t\t\t\tpart=\"base\"\n\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\t?disabled=${this.disabled}\n\t\t\t\tclass=\"${this.classMap(classes)}\"\n\t\t\t\ttype=${ifDefined(this.type)}\n\t\t\t\ttabindex=${ifDefined(this.disabled ? '-1' : undefined)}\n\t\t\t>\n\t\t\t\t${when(!this.disabled, () => html`<div class=\"${this.classMap(stateLayerClasses)}\"></div>`)}\n\t\t\t\t<slot name=\"prefix\"></slot>\n\t\t\t\t<slot></slot>\n\t\t\t\t<slot name=\"suffix\"></slot>\n\t\t\t</button>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-button': SchmancyButton\n\t}\n}\n","import { SchmancyElement } from '@mixins/index'\nimport { css, html, LitElement, PropertyValueMap } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { when } from 'lit/directives/when.js'\nimport { magnetic } from '../directives/magnetic'\nimport { ButtonVariant } from './button'\n\n/**\n * An icon button component.\n * @element schmancy-icon-button\n * @slot - The default slot (usually an icon or glyph).\n * @csspart base - The underlying native `<button>` (or `<a>` when `href` is set).\n */\n@customElement('schmancy-icon-button')\nexport class SchmnacyIconButton extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tborder-radius: 9999px;\n\t\ttransition:\n\t\t\tbox-shadow 300ms cubic-bezier(0.34, 1.56, 0.64, 1),\n\t\t\ttransform 200ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\t}\n\t:host(:hover:not([disabled])) {\n\t\tbox-shadow: 0 2px 12px -4px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 18%, transparent);\n\t}\n\t:host(:active:not([disabled])) {\n\t\ttransform: scale(0.92);\n\t\tbox-shadow: none;\n\t\ttransition-duration: 100ms;\n\t}\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host { transition: none; }\n\t\t:host(:hover:not([disabled])) { box-shadow: none; }\n\t\t:host(:active:not([disabled])) { transform: none; box-shadow: none; }\n\t}\n`]\n\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\t@query('[part=\"base\"]', true)\n\tprivate nativeElement!: HTMLElement\n\n\tprivate _ariaLabel!: string\n\n\t/**\n\t * The size of the icon.\n\t * @attr\n\t * @default 'md'\n\t */\n\t@property({ type: String })\n\tpublic size: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'md'\n\n\t/**\n\t * The variant of the button.\n\t * @attr\n\t * @default 'text'\n\t */\n\t@property({ reflect: true, type: String })\n\tpublic variant: ButtonVariant = 'text'\n\n\t/**\n\t * The width of the button.\n\t * @attr\n\t * @type {'full' | 'auto'}\n\t * @default 'auto'\n\t */\n\t@property()\n\tpublic width: 'full' | 'auto' = 'auto'\n\n\t/**\n\t * The type of the button.\n\t * Defaults to 'button' (preventing accidental form submissions).\n\t * @attr\n\t */\n\t@property({ reflect: true, type: String })\n\tpublic type: 'button' | 'reset' | 'submit' = 'button'\n\n\t/**\n\t * The URL the button points to.\n\t * If provided, the component will render as an anchor element.\n\t * @attr\n\t */\n\t@property()\n\tpublic href?: string\n\n\t/**\n\t * Determines whether the button is disabled.\n\t * @attr\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tpublic disabled = false\n\n\t/**\n\t * Render slot content as text instead of wrapping in schmancy-icon.\n\t * Use this when you want to display text labels in the button.\n\t * @attr\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tpublic text = false\n\n\t/**\n\t * Icon name - use this instead of slot content to prevent translation breaking icons.\n\t * Example: <schmancy-icon-button icon=\"add\"></schmancy-icon-button>\n\t * @attr\n\t */\n\t@property({ type: String })\n\tpublic icon?: string\n\n\t// Reactively captured icon name from slot content (translation-proof)\n\t@state()\n\tprivate _capturedIcon?: string\n\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\t// Pre-capture icon from children to avoid double render flash\n\t\tthis._captureIconFromChildren()\n\t}\n\n\t// Capture icon from direct children (for initial render)\n\tprivate _captureIconFromChildren(): void {\n\t\tif (this.icon || this.text) return\n\t\tfor (const node of this.childNodes) {\n\t\t\tif (node.nodeType === Node.TEXT_NODE) {\n\t\t\t\tconst text = node.textContent?.trim()\n\t\t\t\tif (text) {\n\t\t\t\t\tthis._capturedIcon = text\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// Handle slot content changes reactively (for dynamic updates)\n\tprivate _handleSlotChange(e: Event): void {\n\t\tif (this.icon || this.text) return\n\t\tconst slot = e.target as HTMLSlotElement\n\t\tconst nodes = slot.assignedNodes({ flatten: true })\n\t\tfor (const node of nodes) {\n\t\t\tif (node.nodeType === Node.TEXT_NODE) {\n\t\t\t\tconst text = node.textContent?.trim()\n\t\t\t\tif (text) {\n\t\t\t\t\tthis._capturedIcon = text\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// Manage aria-label manually so that we can always use our internal property.\n\tpublic override set ariaLabel(value: string) {\n\t\tconst oldVal = this._ariaLabel\n\t\tthis._ariaLabel = value\n\n\t\tif (this.hasAttribute('aria-label')) {\n\t\t\tthis.removeAttribute('aria-label')\n\t\t}\n\t\tthis.requestUpdate('ariaLabel', oldVal)\n\t}\n\n\t@property({ attribute: 'aria-label' })\n\tpublic override get ariaLabel() {\n\t\treturn this._ariaLabel\n\t}\n\n\t/** Sets focus in the button. */\n\tpublic override focus(options?: FocusOptions) {\n\t\tthis.nativeElement.focus(options)\n\t}\n\n\t/** Removes focus from the button. */\n\tpublic override blur() {\n\t\tthis.nativeElement.blur()\n\t}\n\n\tclick(): void {\n\t\tthis.dispatchEvent(new Event('click', { bubbles: true, composed: true }))\n\t}\n\n\t// Prevent default behavior when the component is disabled.\n\tprivate _preventDefault(event: Event) {\n\t\tevent.preventDefault()\n\t\tevent.stopPropagation()\n\t}\n\n\tprotected firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void {\n\t\t// Add any first-update logic here if needed.\n\t}\n\n\trender() {\n\t\t// Map 'tonal' variant to 'filled tonal' for backwards compatibility\n\t\tconst effectiveVariant = this.variant === 'tonal' ? 'filled tonal' : this.variant;\n\n\t\t// Compute classes for the interactive element.\n\t\tconst classes = {\n\t\t\t'z-0 h-full transition-all duration-200 relative rounded-full inline-flex justify-center items-center gap-[8px] outline-secondary-default focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-offset-2 outline-hidden':\n\t\t\t\ttrue,\n\t\t\t'opacity-[0.38]': this.disabled,\n\t\t\t'cursor-pointer': !this.disabled,\n\t\t\t'hover:shadow-xs':\n\t\t\t\t!this.disabled &&\n\t\t\t\t(effectiveVariant === 'outlined' ||\n\t\t\t\t\teffectiveVariant === 'text' ||\n\t\t\t\t\teffectiveVariant === 'filled' ||\n\t\t\t\t\teffectiveVariant === 'filled tonal'),\n\t\t\t'hover:shadow-sm': !this.disabled && effectiveVariant === 'elevated',\n\t\t\t'w-full text-center': this.width === 'full',\n\t\t\t'bg-surface-low text-primary-default shadow-xs': effectiveVariant === 'elevated',\n\t\t\t'bg-transparent text-primary-default border-1 border-outline': effectiveVariant === 'outlined',\n\t\t\t'bg-primary-default text-primary-on': effectiveVariant === 'filled',\n\t\t\t'bg-secondary-container text-secondary-onContainer': effectiveVariant === 'filled tonal',\n\t\t\t'text-primary-default': effectiveVariant === 'text',\n\t\t\t// M3 spec: 24dp (xxs) → 32dp (dense) → 40dp (default) → 48dp (standard) → 56dp (large)\n\t\t\t'p-1.5': this.size === 'xxs',    // 6px padding  = 24px total (12px icon) - Ultra-compact\n\t\t\t'p-2': this.size === 'xs',       // 8px padding  = 32px total (16px icon) - M3 dense\n\t\t\t'p-2.5': this.size === 'sm',     // 10px padding = 40px total (20px icon) - M3 default\n\t\t\t'p-3': this.size === 'md',       // 12px padding = 48px total (24px icon) - M3 standard\n\t\t\t'p-4': this.size === 'lg',       // 16px padding = 56px total (24px icon) - M3 large\n\t\t\t'p-5': this.size === 'xl',       // 20px padding = 80px total (40px icon) - custom XL\n\t\t}\n\n\t\tconst stateLayerClasses = {\n\t\t\t'hover:opacity-[0.08] rounded-full z-0': true,\n\t\t\t'hover:bg-primary-on': effectiveVariant === 'filled',\n\t\t\t'hover:bg-primary-default': effectiveVariant === 'outlined' || effectiveVariant === 'elevated' || effectiveVariant === 'text',\n\t\t\t'hover:bg-secondary-container': effectiveVariant === 'filled tonal',\n\t\t}\n\n\t\t// Icon size mapping - M3 spec: 24dp standard, scaled for density\n\t\tconst iconSize = this.size === 'xxs' ? '12px' : this.size === 'xs' ? '16px' : this.size === 'sm' ? '20px' : this.size === 'md' ? '24px' : this.size === 'lg' ? '24px' : '40px';\n\n\t\t// If href is provided, render an anchor element.\n\t\tif (this.href) {\n\t\t\treturn html`\n\t\t\t\t<a\n\t\t\t\t\t${magnetic({ strength: 3, radius: 50 })}\n\t\t\t\t\tpart=\"base\"\n\t\t\t\t\thref=${ifDefined(this.disabled ? undefined : this.href)}\n\t\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\t\tclass=\"${this.classMap(classes)}\"\n\t\t\t\t\ttabindex=${this.disabled ? '-1' : '0'}\n\t\t\t\t\taria-disabled=${this.disabled}\n\t\t\t\t\t@click=${this.disabled ? this._preventDefault : undefined}\n\t\t\t\t>\n\t\t\t\t\t${when(!this.disabled, () => html`<div class=\"absolute inset-0 ${this.classMap(stateLayerClasses)}\"></div>`)}\n\t\t\t\t\t${this.text\n\t\t\t\t\t\t? html`<slot></slot>`\n\t\t\t\t\t\t: html`\n\t\t\t\t\t\t\t<slot style=\"display:none\" @slotchange=${this._handleSlotChange}></slot>\n\t\t\t\t\t\t\t<schmancy-icon size=${iconSize} icon=${ifDefined(this.icon || this._capturedIcon)}></schmancy-icon>\n\t\t\t\t\t\t`\n\t\t\t\t\t}\n\t\t\t\t</a>\n\t\t\t`\n\t\t}\n\n\t\t// Otherwise, render a native button element.\n\t\treturn html`\n\t\t\t<button\n\t\t\t\t${magnetic({ strength: 3, radius: 50 })}\n\t\t\t\tpart=\"base\"\n\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\t?disabled=${this.disabled}\n\t\t\t\tclass=\"${this.classMap(classes)}\"\n\t\t\t\ttype=${ifDefined(this.type)}\n\t\t\t\ttabindex=${ifDefined(this.disabled ? '-1' : undefined)}\n\t\t\t>\n\t\t\t\t${when(!this.disabled, () => html`<div class=\"absolute inset-0 ${this.classMap(stateLayerClasses)}\"></div>`)}\n\t\t\t\t${this.text\n\t\t\t\t\t? html`<slot></slot>`\n\t\t\t\t\t: html`\n\t\t\t\t\t\t<slot style=\"display:none\" @slotchange=${this._handleSlotChange}></slot>\n\t\t\t\t\t\t<schmancy-icon size=${iconSize} icon=${ifDefined(this.icon || this._capturedIcon)}></schmancy-icon>\n\t\t\t\t\t`\n\t\t\t\t}\n\t\t\t</button>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-icon-button': SchmnacyIconButton\n\t}\n}\n"],"mappings":"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"}

package/dist/{card-wUTjx0EC.js → card-Bv--HeGO.js}

@@ -1,11 +1,12 @@
-import { t as e } from "./tailwind.mixin-mdQR3BEO.js";
-import { t } from "./decorate-D_utPUsC.js";
-import "./mixins.js";
-import { t as n } from "./cursor-glow-BydlDInj.js";
+import { s as e } from "./mixins-CL1krSOE.js";
+import { t } from "./decorate-23nYs4Le.js";
+import { t as n } from "./cursor-glow-Ah7VXSj7.js";
 import { customElement as r, property as i, state as a } from "lit/decorators.js";
 import { LitElement as o, css as s, html as c } from "lit";
 import { ifDefined as l } from "lit/directives/if-defined.js";
-var u = class extends e(s`
+var u = class extends e {
+	static {
+		this.styles = [s`
 	:host {
 		display: flex;
 		gap: 0.5rem;
@@ -13,13 +14,33 @@ var u = class extends e(s`
 		align-items: center;
 		justify-content: flex-end;
 	}
-`) {
+`];
+	}
 	render() {
 		return c`<slot></slot>`;
 	}
 };
 u = t([r("schmancy-card-action")], u);
-var d = class extends e(s`
+var d = class extends e {
+	constructor(...e) {
+		super(...e), this.type = "elevated", this.interactive = !1, this.disabled = !1, this.dragged = !1, this.role = "article", this.ariaLabel = "", this.pressed = !1, this.ripples = [], this.nextRippleId = 0, this.handleClick = (e) => {
+			if (this.disabled || !this.interactive) return;
+			let t = this.getBoundingClientRect();
+			this._triggerAction(e.clientX - t.left, e.clientY - t.top);
+		}, this.handleKeyDown = (e) => {
+			if (!this.disabled && this.interactive && (e.key === "Enter" || e.key === " ")) {
+				e.preventDefault(), this._setPressed(!0);
+				let t = this.getBoundingClientRect();
+				this._triggerAction(t.width / 2, t.height / 2);
+			}
+		}, this.handleKeyUp = (e) => {
+			e.key !== "Enter" && e.key !== " " || this._setPressed(!1);
+		}, this.handleMouseDown = () => {
+			!this.disabled && this.interactive && this._setPressed(!0);
+		}, this.handleMouseUp = () => this._setPressed(!1), this.handleMouseLeave = () => this._setPressed(!1);
+	}
+	static {
+		this.styles = [s`
 	:host {
 		display: block;
 		position: relative;
@@ -102,23 +123,7 @@ var d = class extends e(s`
 			opacity: 0;
 		}
 	}
-`) {
-	constructor(...e) {
-		super(...e), this.type = "elevated", this.interactive = !1, this.disabled = !1, this.dragged = !1, this.role = "article", this.ariaLabel = "", this.pressed = !1, this.ripples = [], this.nextRippleId = 0, this.handleClick = (e) => {
-			if (this.disabled || !this.interactive) return;
-			let t = this.getBoundingClientRect();
-			this._triggerAction(e.clientX - t.left, e.clientY - t.top);
-		}, this.handleKeyDown = (e) => {
-			if (!this.disabled && this.interactive && (e.key === "Enter" || e.key === " ")) {
-				e.preventDefault(), this._setPressed(!0);
-				let t = this.getBoundingClientRect();
-				this._triggerAction(t.width / 2, t.height / 2);
-			}
-		}, this.handleKeyUp = (e) => {
-			e.key !== "Enter" && e.key !== " " || this._setPressed(!1);
-		}, this.handleMouseDown = () => {
-			!this.disabled && this.interactive && this._setPressed(!0);
-		}, this.handleMouseUp = () => this._setPressed(!1), this.handleMouseLeave = () => this._setPressed(!1);
+`];
 	}
 	static {
 		this.shadowRootOptions = {
@@ -212,18 +217,26 @@ t([i({ reflect: !0 })], d.prototype, "type", void 0), t([i({
 	type: Boolean,
 	reflect: !0
 })], d.prototype, "dragged", void 0), t([i()], d.prototype, "href", void 0), t([i()], d.prototype, "target", void 0), t([i({ attribute: "role" })], d.prototype, "role", void 0), t([i({ attribute: "aria-label" })], d.prototype, "ariaLabel", void 0), t([a()], d.prototype, "pressed", void 0), t([a()], d.prototype, "ripples", void 0), d = t([r("schmancy-card")], d);
-var f = class extends e(s`
+var f = class extends e {
+	static {
+		this.styles = [s`
 	:host {
 		display: block;
 		padding: 1rem;
 	}
-`) {
+`];
+	}
 	render() {
 		return c`<slot></slot>`;
 	}
 };
 f = t([r("schmancy-card-content")], f);
-var p = class extends e(s`
+var p = class extends e {
+	constructor(...e) {
+		super(...e), this.src = "", this.fit = "contain", this.alt = "";
+	}
+	static {
+		this.styles = [s`
 	:host {
 		display: block;
 		position: relative;
@@ -268,9 +281,7 @@ var p = class extends e(s`
 	:host([fit="scale-down"]) ::slotted(img) {
 		object-fit: scale-down;
 	}
-`) {
-	constructor(...e) {
-		super(...e), this.src = "", this.fit = "contain", this.alt = "";
+`];
 	}
 	render() {
 		return this.src ? c`<img src="${this.src}" alt="${this.alt}" />` : c`<slot></slot>`;

package/dist/card-Bv--HeGO.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-Bv--HeGO.js","names":[],"sources":["../src/card/actions.ts","../src/card/card.ts","../src/card/content.ts","../src/card/media.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-action\n * @slot - The content of the action\n */\n@customElement('schmancy-card-action')\nexport default class SchmancyCardAction extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: flex;\n\t\tgap: 0.5rem;\n\t\tpadding: 0.5rem 1rem;\n\t\talign-items: center;\n\t\tjustify-content: flex-end;\n\t}\n`];\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-action': SchmancyCardAction\n\t}\n}\n","import { SchmancyElement } from '@mixins/index'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { cursorGlow } from '../directives/cursor-glow'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\n@customElement('schmancy-card')\nexport default class SchmancyCard extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tborder-radius: var(--schmancy-sys-shape-corner-medium);\n\t\ttransition:\n\t\t\tbox-shadow var(--schmancy-sys-motion-duration-short4) var(--schmancy-sys-motion-easing-standard),\n\t\t\ttransform 300ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\t\toutline: none;\n\t}\n\n\t/* Type variants */\n\t:host([type='elevated']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-low);\n\t\tbox-shadow: var(--schmancy-sys-elevation-1);\n\t}\n\t:host([type='filled']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-highest);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\t:host([type='outlined']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-default);\n\t\tborder: 1px solid var(--schmancy-sys-color-outlineVariant);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\n\t/* Interactive states */\n\t:host([interactive]) {\n\t\tcursor: pointer;\n\t\t-webkit-tap-highlight-color: transparent;\n\t}\n\t:host([interactive]:focus-visible:not([disabled])) {\n\t\toutline: 2px solid var(--schmancy-sys-color-primary-default);\n\t\toutline-offset: 2px;\n\t}\n\t:host([disabled]) {\n\t\tpointer-events: none;\n\t\topacity: var(--schmancy-sys-state-disabled-opacity);\n\t}\n\n\t/* Hover elevations — luminous glow + lift */\n\t:host([type='elevated'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-2),\n\t\t\t0 4px 24px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 12%, transparent);\n\t\ttransform: translateY(-2px);\n\t}\n\t:host([type='filled'][interactive]:hover:not([disabled])),\n\t:host([type='outlined'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-1),\n\t\t\t0 4px 20px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 10%, transparent);\n\t\ttransform: translateY(-1px);\n\t}\n\n\t/* Active state — kinetic compress */\n\t:host([interactive]:active:not([disabled])) {\n\t\ttransform: scale(0.98);\n\t\ttransition-duration: 100ms;\n\t}\n\n\t/* Dragged state */\n\t:host([dragged]) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-3),\n\t\t\t0 8px 32px -4px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t\ttransform: translateY(-4px);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host([interactive]:hover:not([disabled])),\n\t\t:host([interactive]:active:not([disabled])),\n\t\t:host([dragged]) {\n\t\t\ttransform: none;\n\t\t}\n\t}\n\n\t@keyframes ripple {\n\t\tto {\n\t\t\ttransform: scale(4);\n\t\t\topacity: 0;\n\t\t}\n\t}\n`];\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\t/**\n\t * The visual style of the card.\n\t * @default 'elevated'\n\t */\n\t@property({ reflect: true })\n\ttype: 'elevated' | 'filled' | 'outlined' = 'elevated'\n\n\t/**\n\t * Makes the card interactive (clickable).\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tinteractive = false\n\n\t/**\n\t * Disables the card.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled = false\n\n\t/**\n\t * Indicates the card is being dragged.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdragged = false\n\n\t/**\n\t * URL to navigate to when card is clicked (makes it act like a link).\n\t */\n\t@property()\n\thref?: string\n\n\t/**\n\t * Target for the link navigation.\n\t */\n\t@property()\n\ttarget?: string\n\n\t/**\n\t * ARIA role for accessibility.\n\t */\n\t@property({ attribute: 'role' })\n\toverride role = 'article'\n\n\t/**\n\t * ARIA label for accessibility.\n\t */\n\t@property({ attribute: 'aria-label' })\n\toverride ariaLabel: string = ''\n\n\t// Internal state for interaction feedback\n\t@state() pressed = false\n\t@state() private ripples: Array<{ x: number; y: number; id: number }> = []\n\n\tprivate nextRippleId = 0\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis._updateAriaAttributes()\n\t}\n\n\tupdated(changedProperties: Map<string, unknown>) {\n\t\tsuper.updated(changedProperties)\n\t\tif (changedProperties.has('interactive') || changedProperties.has('disabled')) {\n\t\t\tthis._updateAriaAttributes()\n\t\t}\n\t}\n\n\t// Consolidate ARIA attribute updates\n\tprivate _updateAriaAttributes() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\tif (isInteractive) {\n\t\t\tthis.setAttribute('tabindex', '0')\n\t\t\tif (!this.role || this.role === 'article') {\n\t\t\t\tthis.role = this.href ? 'link' : 'button'\n\t\t\t}\n\t\t} else {\n\t\t\tthis.removeAttribute('tabindex')\n\t\t\tif (this.role === 'button' || this.role === 'link') {\n\t\t\t\tthis.role = 'article'\n\t\t\t}\n\t\t}\n\t}\n\n\t// Shared ripple creation logic\n\tprivate _addRipple(x: number, y: number) {\n\t\tconst id = this.nextRippleId++\n\t\tthis.ripples = [...this.ripples, { x, y, id }]\n\n\t\t// Remove ripple after animation completes\n\t\tsetTimeout(() => {\n\t\t\tthis.ripples = this.ripples.filter(r => r.id !== id)\n\t\t}, 600) // M3 medium duration\n\t}\n\n\t// Shared navigation logic\n\tprivate _navigate() {\n\t\tif (!this.href) return\n\n\t\tif (this.target === '_blank') {\n\t\t\twindow.open(this.href, '_blank')\n\t\t} else {\n\t\t\twindow.location.href = this.href\n\t\t}\n\t}\n\n\t// Combined action trigger (ripple + navigate + event)\n\tprivate _triggerAction(x: number, y: number) {\n\t\tthis._addRipple(x, y)\n\t\tthis._navigate()\n\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('schmancy-click', {\n\t\t\t\tdetail: { value: this.type },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate handleClick = (e: MouseEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tconst rect = this.getBoundingClientRect()\n\t\tthis._triggerAction(e.clientX - rect.left, e.clientY - rect.top)\n\t}\n\n\tprivate handleKeyDown = (e: KeyboardEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\te.preventDefault()\n\t\t\tthis._setPressed(true)\n\n\t\t\t// Simulate click at center\n\t\t\tconst rect = this.getBoundingClientRect()\n\t\t\tthis._triggerAction(rect.width / 2, rect.height / 2)\n\t\t}\n\t}\n\n\tprivate handleKeyUp = (e: KeyboardEvent) => {\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\tthis._setPressed(false)\n\t\t}\n\t}\n\n\t// Consolidate pressed state management\n\tprivate _setPressed(pressed: boolean) {\n\t\tthis.pressed = pressed\n\t\tif (pressed) {\n\t\t\tthis.setAttribute('pressed', '')\n\t\t} else {\n\t\t\tthis.removeAttribute('pressed')\n\t\t}\n\t}\n\n\tprivate handleMouseDown = () => {\n\t\tif (this.disabled || !this.interactive) return\n\t\tthis._setPressed(true)\n\t}\n\n\tprivate handleMouseUp = () => this._setPressed(false)\n\tprivate handleMouseLeave = () => this._setPressed(false)\n\n\tprotected render() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\t${isInteractive ? cursorGlow({ radius: 200, intensity: 0.1 }) : ''}\n\t\t\t\tclass=\"relative w-full h-full rounded-xl ${isInteractive ? 'cursor-pointer' : ''}\"\n\t\t\t\t@click=${this.handleClick}\n\t\t\t\t@keydown=${this.handleKeyDown}\n\t\t\t\t@keyup=${this.handleKeyUp}\n\t\t\t\t@mousedown=${this.handleMouseDown}\n\t\t\t\t@mouseup=${this.handleMouseUp}\n\t\t\t\t@mouseleave=${this.handleMouseLeave}\n\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\taria-disabled=${this.disabled ? 'true' : 'false'}\n\t\t\t>\n\t\t\t\t<!-- State layer -->\n\t\t\t\t<div\n\t\t\t\t\tclass=\"absolute inset-0 rounded-xl pointer-events-none transition-opacity duration-200 bg-surface-on ${!isInteractive\n\t\t\t\t\t\t? 'opacity-0'\n\t\t\t\t\t\t: this.pressed\n\t\t\t\t\t\t\t? 'opacity-[var(--schmancy-sys-state-pressed-opacity)]'\n\t\t\t\t\t\t\t: 'opacity-0 hover:opacity-[var(--schmancy-sys-state-hover-opacity)] focus-visible:opacity-[var(--schmancy-sys-state-focus-opacity)]'}\"\n\t\t\t\t></div>\n\n\t\t\t\t<!-- Ripples -->\n\t\t\t\t${this.interactive && this.ripples.length\n\t\t\t\t\t? html`\n\t\t\t\t\t\t\t<div class=\"absolute inset-0 rounded-xl overflow-hidden pointer-events-none\">\n\t\t\t\t\t\t\t\t${this.ripples.map(\n\t\t\t\t\t\t\t\t\tr => html`\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclass=\"absolute rounded-full scale-0 animate-[ripple_600ms_linear] bg-surface-on opacity-[0.12] w-5 h-5 -ml-2.5 -mt-2.5\"\n\t\t\t\t\t\t\t\t\t\t\tstyle=\"left: ${r.x}px; top: ${r.y}px\"\n\t\t\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t`\n\t\t\t\t\t: ''}\n\n\t\t\t\t<!-- Content -->\n\t\t\t\t<div class=\"relative h-full w-full rounded-xl\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card': SchmancyCard\n\t}\n}\n","import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-content\n */\n@customElement('schmancy-card-content')\nexport default class SchmancyCardContent extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tpadding: 1rem;\n\t}\n`];\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-content': SchmancyCardContent\n\t}\n}\n","import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-media\n */\n@customElement('schmancy-card-media')\nexport default class SchmancyCardMedia extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\theight: 200px;\n\t\toverflow: hidden;\n\t}\n\t\n\t/* Allow height to be overridden when used in flex/grid layouts */\n\t:host-context(.h-full) {\n\t\theight: 100%;\n\t}\n\t\n\t::slotted(img),\n\timg {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tobject-position: center;\n\t}\n\t\n\t/* Object fit styles based on fit attribute */\n\t:host([fit=\"contain\"]) img,\n\t:host([fit=\"contain\"]) ::slotted(img) {\n\t\tobject-fit: contain;\n\t}\n\t\n\t:host([fit=\"cover\"]) img,\n\t:host([fit=\"cover\"]) ::slotted(img) {\n\t\tobject-fit: cover;\n\t}\n\t\n\t:host([fit=\"fill\"]) img,\n\t:host([fit=\"fill\"]) ::slotted(img) {\n\t\tobject-fit: fill;\n\t}\n\t\n\t:host([fit=\"none\"]) img,\n\t:host([fit=\"none\"]) ::slotted(img) {\n\t\tobject-fit: none;\n\t}\n\t\n\t:host([fit=\"scale-down\"]) img,\n\t:host([fit=\"scale-down\"]) ::slotted(img) {\n\t\tobject-fit: scale-down;\n\t}\n`];\n\t@property({ type: String, reflect: true })\n\tsrc: string = ''\n\n\t@property({ type: String, reflect: true })\n\tfit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' = 'contain'\n\t\n\t@property({ type: String })\n\talt: string = ''\n\n\tprotected render(): unknown {\n\t\t// If src is provided, render an img element\n\t\t// Otherwise, allow users to slot their own content\n\t\treturn this.src \n\t\t\t? html`<img src=\"${this.src}\" alt=\"${this.alt}\" />` \n\t\t\t: html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-media': SchmancyCardMedia\n\t}\n}\n"],"mappings":"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"}

package/dist/{card-DjYnCckw.cjs → card-ClroODSK.cjs}

@@ -1,4 +1,4 @@
-require(`./chunk-CncqDLb2.cjs`);const e=require(`./tailwind.mixin-DRI1oTYQ.cjs`),t=require(`./decorate-F9CuyeHg.cjs`);require(`./mixins.cjs`);const n=require(`./cursor-glow-Duw9jHmh.cjs`);let r=require(`lit/decorators.js`),i=require(`lit`),a=require(`lit/directives/if-defined.js`);var o=class extends e.t(i.css`
+require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-BIXF7xkF.cjs`),t=require(`./decorate-DpFmy0nm.cjs`),n=require(`./cursor-glow-Bulq-38P.cjs`);let r=require(`lit/decorators.js`),i=require(`lit`),a=require(`lit/directives/if-defined.js`);var o=class extends e.s{static{this.styles=[i.css`
 	:host {
 		display: flex;
 		gap: 0.5rem;
@@ -6,7 +6,7 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./tailwind.mixin-DRI1oTYQ.cjs`)
 		align-items: center;
 		justify-content: flex-end;
 	}
-`){render(){return i.html`<slot></slot>`}};o=t.t([(0,r.customElement)(`schmancy-card-action`)],o);var s=class extends e.t(i.css`
+`]}render(){return i.html`<slot></slot>`}};o=t.t([(0,r.customElement)(`schmancy-card-action`)],o);var s=class extends e.s{constructor(...e){super(...e),this.type=`elevated`,this.interactive=!1,this.disabled=!1,this.dragged=!1,this.role=`article`,this.ariaLabel=``,this.pressed=!1,this.ripples=[],this.nextRippleId=0,this.handleClick=e=>{if(this.disabled||!this.interactive)return;let t=this.getBoundingClientRect();this._triggerAction(e.clientX-t.left,e.clientY-t.top)},this.handleKeyDown=e=>{if(!this.disabled&&this.interactive&&(e.key===`Enter`||e.key===` `)){e.preventDefault(),this._setPressed(!0);let t=this.getBoundingClientRect();this._triggerAction(t.width/2,t.height/2)}},this.handleKeyUp=e=>{e.key!==`Enter`&&e.key!==` `||this._setPressed(!1)},this.handleMouseDown=()=>{!this.disabled&&this.interactive&&this._setPressed(!0)},this.handleMouseUp=()=>this._setPressed(!1),this.handleMouseLeave=()=>this._setPressed(!1)}static{this.styles=[i.css`
 	:host {
 		display: block;
 		position: relative;
@@ -89,7 +89,7 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./tailwind.mixin-DRI1oTYQ.cjs`)
 			opacity: 0;
 		}
 	}
-`){constructor(...e){super(...e),this.type=`elevated`,this.interactive=!1,this.disabled=!1,this.dragged=!1,this.role=`article`,this.ariaLabel=``,this.pressed=!1,this.ripples=[],this.nextRippleId=0,this.handleClick=e=>{if(this.disabled||!this.interactive)return;let t=this.getBoundingClientRect();this._triggerAction(e.clientX-t.left,e.clientY-t.top)},this.handleKeyDown=e=>{if(!this.disabled&&this.interactive&&(e.key===`Enter`||e.key===` `)){e.preventDefault(),this._setPressed(!0);let t=this.getBoundingClientRect();this._triggerAction(t.width/2,t.height/2)}},this.handleKeyUp=e=>{e.key!==`Enter`&&e.key!==` `||this._setPressed(!1)},this.handleMouseDown=()=>{!this.disabled&&this.interactive&&this._setPressed(!0)},this.handleMouseUp=()=>this._setPressed(!1),this.handleMouseLeave=()=>this._setPressed(!1)}static{this.shadowRootOptions={...i.LitElement.shadowRootOptions,mode:`open`,delegatesFocus:!0}}connectedCallback(){super.connectedCallback(),this._updateAriaAttributes()}updated(e){super.updated(e),(e.has(`interactive`)||e.has(`disabled`))&&this._updateAriaAttributes()}_updateAriaAttributes(){this.interactive&&!this.disabled?(this.setAttribute(`tabindex`,`0`),this.role&&this.role!==`article`||(this.role=this.href?`link`:`button`)):(this.removeAttribute(`tabindex`),this.role!==`button`&&this.role!==`link`||(this.role=`article`))}_addRipple(e,t){let n=this.nextRippleId++;this.ripples=[...this.ripples,{x:e,y:t,id:n}],setTimeout(()=>{this.ripples=this.ripples.filter(e=>e.id!==n)},600)}_navigate(){this.href&&(this.target===`_blank`?window.open(this.href,`_blank`):window.location.href=this.href)}_triggerAction(e,t){this._addRipple(e,t),this._navigate(),this.dispatchEvent(new CustomEvent(`schmancy-click`,{detail:{value:this.type},bubbles:!0,composed:!0}))}_setPressed(e){this.pressed=e,e?this.setAttribute(`pressed`,``):this.removeAttribute(`pressed`)}render(){let e=this.interactive&&!this.disabled;return i.html`
+`]}static{this.shadowRootOptions={...i.LitElement.shadowRootOptions,mode:`open`,delegatesFocus:!0}}connectedCallback(){super.connectedCallback(),this._updateAriaAttributes()}updated(e){super.updated(e),(e.has(`interactive`)||e.has(`disabled`))&&this._updateAriaAttributes()}_updateAriaAttributes(){this.interactive&&!this.disabled?(this.setAttribute(`tabindex`,`0`),this.role&&this.role!==`article`||(this.role=this.href?`link`:`button`)):(this.removeAttribute(`tabindex`),this.role!==`button`&&this.role!==`link`||(this.role=`article`))}_addRipple(e,t){let n=this.nextRippleId++;this.ripples=[...this.ripples,{x:e,y:t,id:n}],setTimeout(()=>{this.ripples=this.ripples.filter(e=>e.id!==n)},600)}_navigate(){this.href&&(this.target===`_blank`?window.open(this.href,`_blank`):window.location.href=this.href)}_triggerAction(e,t){this._addRipple(e,t),this._navigate(),this.dispatchEvent(new CustomEvent(`schmancy-click`,{detail:{value:this.type},bubbles:!0,composed:!0}))}_setPressed(e){this.pressed=e,e?this.setAttribute(`pressed`,``):this.removeAttribute(`pressed`)}render(){let e=this.interactive&&!this.disabled;return i.html`
 			<div
 				${e?n.t({radius:200,intensity:.1}):``}
 				class="relative w-full h-full rounded-xl ${e?`cursor-pointer`:``}"
@@ -124,12 +124,12 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./tailwind.mixin-DRI1oTYQ.cjs`)
 					<slot></slot>
 				</div>
 			</div>
-		`}};t.t([(0,r.property)({reflect:!0})],s.prototype,`type`,void 0),t.t([(0,r.property)({type:Boolean,reflect:!0})],s.prototype,`interactive`,void 0),t.t([(0,r.property)({type:Boolean,reflect:!0})],s.prototype,`disabled`,void 0),t.t([(0,r.property)({type:Boolean,reflect:!0})],s.prototype,`dragged`,void 0),t.t([(0,r.property)()],s.prototype,`href`,void 0),t.t([(0,r.property)()],s.prototype,`target`,void 0),t.t([(0,r.property)({attribute:`role`})],s.prototype,`role`,void 0),t.t([(0,r.property)({attribute:`aria-label`})],s.prototype,`ariaLabel`,void 0),t.t([(0,r.state)()],s.prototype,`pressed`,void 0),t.t([(0,r.state)()],s.prototype,`ripples`,void 0),s=t.t([(0,r.customElement)(`schmancy-card`)],s);var c=class extends e.t(i.css`
+		`}};t.t([(0,r.property)({reflect:!0})],s.prototype,`type`,void 0),t.t([(0,r.property)({type:Boolean,reflect:!0})],s.prototype,`interactive`,void 0),t.t([(0,r.property)({type:Boolean,reflect:!0})],s.prototype,`disabled`,void 0),t.t([(0,r.property)({type:Boolean,reflect:!0})],s.prototype,`dragged`,void 0),t.t([(0,r.property)()],s.prototype,`href`,void 0),t.t([(0,r.property)()],s.prototype,`target`,void 0),t.t([(0,r.property)({attribute:`role`})],s.prototype,`role`,void 0),t.t([(0,r.property)({attribute:`aria-label`})],s.prototype,`ariaLabel`,void 0),t.t([(0,r.state)()],s.prototype,`pressed`,void 0),t.t([(0,r.state)()],s.prototype,`ripples`,void 0),s=t.t([(0,r.customElement)(`schmancy-card`)],s);var c=class extends e.s{static{this.styles=[i.css`
 	:host {
 		display: block;
 		padding: 1rem;
 	}
-`){render(){return i.html`<slot></slot>`}};c=t.t([(0,r.customElement)(`schmancy-card-content`)],c);var l=class extends e.t(i.css`
+`]}render(){return i.html`<slot></slot>`}};c=t.t([(0,r.customElement)(`schmancy-card-content`)],c);var l=class extends e.s{constructor(...e){super(...e),this.src=``,this.fit=`contain`,this.alt=``}static{this.styles=[i.css`
 	:host {
 		display: block;
 		position: relative;
@@ -174,4 +174,4 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./tailwind.mixin-DRI1oTYQ.cjs`)
 	:host([fit="scale-down"]) ::slotted(img) {
 		object-fit: scale-down;
 	}
-`){constructor(...e){super(...e),this.src=``,this.fit=`contain`,this.alt=``}render(){return this.src?i.html`<img src="${this.src}" alt="${this.alt}" />`:i.html`<slot></slot>`}};t.t([(0,r.property)({type:String,reflect:!0})],l.prototype,`src`,void 0),t.t([(0,r.property)({type:String,reflect:!0})],l.prototype,`fit`,void 0),t.t([(0,r.property)({type:String})],l.prototype,`alt`,void 0),l=t.t([(0,r.customElement)(`schmancy-card-media`)],l);
+`]}render(){return this.src?i.html`<img src="${this.src}" alt="${this.alt}" />`:i.html`<slot></slot>`}};t.t([(0,r.property)({type:String,reflect:!0})],l.prototype,`src`,void 0),t.t([(0,r.property)({type:String,reflect:!0})],l.prototype,`fit`,void 0),t.t([(0,r.property)({type:String})],l.prototype,`alt`,void 0),l=t.t([(0,r.customElement)(`schmancy-card-media`)],l);

package/dist/card-ClroODSK.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-ClroODSK.cjs","names":[],"sources":["../src/card/actions.ts","../src/card/card.ts","../src/card/content.ts","../src/card/media.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-action\n * @slot - The content of the action\n */\n@customElement('schmancy-card-action')\nexport default class SchmancyCardAction extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: flex;\n\t\tgap: 0.5rem;\n\t\tpadding: 0.5rem 1rem;\n\t\talign-items: center;\n\t\tjustify-content: flex-end;\n\t}\n`];\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-action': SchmancyCardAction\n\t}\n}\n","import { SchmancyElement } from '@mixins/index'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { cursorGlow } from '../directives/cursor-glow'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\n@customElement('schmancy-card')\nexport default class SchmancyCard extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tborder-radius: var(--schmancy-sys-shape-corner-medium);\n\t\ttransition:\n\t\t\tbox-shadow var(--schmancy-sys-motion-duration-short4) var(--schmancy-sys-motion-easing-standard),\n\t\t\ttransform 300ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\t\toutline: none;\n\t}\n\n\t/* Type variants */\n\t:host([type='elevated']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-low);\n\t\tbox-shadow: var(--schmancy-sys-elevation-1);\n\t}\n\t:host([type='filled']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-highest);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\t:host([type='outlined']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-default);\n\t\tborder: 1px solid var(--schmancy-sys-color-outlineVariant);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\n\t/* Interactive states */\n\t:host([interactive]) {\n\t\tcursor: pointer;\n\t\t-webkit-tap-highlight-color: transparent;\n\t}\n\t:host([interactive]:focus-visible:not([disabled])) {\n\t\toutline: 2px solid var(--schmancy-sys-color-primary-default);\n\t\toutline-offset: 2px;\n\t}\n\t:host([disabled]) {\n\t\tpointer-events: none;\n\t\topacity: var(--schmancy-sys-state-disabled-opacity);\n\t}\n\n\t/* Hover elevations — luminous glow + lift */\n\t:host([type='elevated'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-2),\n\t\t\t0 4px 24px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 12%, transparent);\n\t\ttransform: translateY(-2px);\n\t}\n\t:host([type='filled'][interactive]:hover:not([disabled])),\n\t:host([type='outlined'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-1),\n\t\t\t0 4px 20px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 10%, transparent);\n\t\ttransform: translateY(-1px);\n\t}\n\n\t/* Active state — kinetic compress */\n\t:host([interactive]:active:not([disabled])) {\n\t\ttransform: scale(0.98);\n\t\ttransition-duration: 100ms;\n\t}\n\n\t/* Dragged state */\n\t:host([dragged]) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-3),\n\t\t\t0 8px 32px -4px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t\ttransform: translateY(-4px);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host([interactive]:hover:not([disabled])),\n\t\t:host([interactive]:active:not([disabled])),\n\t\t:host([dragged]) {\n\t\t\ttransform: none;\n\t\t}\n\t}\n\n\t@keyframes ripple {\n\t\tto {\n\t\t\ttransform: scale(4);\n\t\t\topacity: 0;\n\t\t}\n\t}\n`];\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\t/**\n\t * The visual style of the card.\n\t * @default 'elevated'\n\t */\n\t@property({ reflect: true })\n\ttype: 'elevated' | 'filled' | 'outlined' = 'elevated'\n\n\t/**\n\t * Makes the card interactive (clickable).\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tinteractive = false\n\n\t/**\n\t * Disables the card.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled = false\n\n\t/**\n\t * Indicates the card is being dragged.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdragged = false\n\n\t/**\n\t * URL to navigate to when card is clicked (makes it act like a link).\n\t */\n\t@property()\n\thref?: string\n\n\t/**\n\t * Target for the link navigation.\n\t */\n\t@property()\n\ttarget?: string\n\n\t/**\n\t * ARIA role for accessibility.\n\t */\n\t@property({ attribute: 'role' })\n\toverride role = 'article'\n\n\t/**\n\t * ARIA label for accessibility.\n\t */\n\t@property({ attribute: 'aria-label' })\n\toverride ariaLabel: string = ''\n\n\t// Internal state for interaction feedback\n\t@state() pressed = false\n\t@state() private ripples: Array<{ x: number; y: number; id: number }> = []\n\n\tprivate nextRippleId = 0\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis._updateAriaAttributes()\n\t}\n\n\tupdated(changedProperties: Map<string, unknown>) {\n\t\tsuper.updated(changedProperties)\n\t\tif (changedProperties.has('interactive') || changedProperties.has('disabled')) {\n\t\t\tthis._updateAriaAttributes()\n\t\t}\n\t}\n\n\t// Consolidate ARIA attribute updates\n\tprivate _updateAriaAttributes() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\tif (isInteractive) {\n\t\t\tthis.setAttribute('tabindex', '0')\n\t\t\tif (!this.role || this.role === 'article') {\n\t\t\t\tthis.role = this.href ? 'link' : 'button'\n\t\t\t}\n\t\t} else {\n\t\t\tthis.removeAttribute('tabindex')\n\t\t\tif (this.role === 'button' || this.role === 'link') {\n\t\t\t\tthis.role = 'article'\n\t\t\t}\n\t\t}\n\t}\n\n\t// Shared ripple creation logic\n\tprivate _addRipple(x: number, y: number) {\n\t\tconst id = this.nextRippleId++\n\t\tthis.ripples = [...this.ripples, { x, y, id }]\n\n\t\t// Remove ripple after animation completes\n\t\tsetTimeout(() => {\n\t\t\tthis.ripples = this.ripples.filter(r => r.id !== id)\n\t\t}, 600) // M3 medium duration\n\t}\n\n\t// Shared navigation logic\n\tprivate _navigate() {\n\t\tif (!this.href) return\n\n\t\tif (this.target === '_blank') {\n\t\t\twindow.open(this.href, '_blank')\n\t\t} else {\n\t\t\twindow.location.href = this.href\n\t\t}\n\t}\n\n\t// Combined action trigger (ripple + navigate + event)\n\tprivate _triggerAction(x: number, y: number) {\n\t\tthis._addRipple(x, y)\n\t\tthis._navigate()\n\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('schmancy-click', {\n\t\t\t\tdetail: { value: this.type },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate handleClick = (e: MouseEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tconst rect = this.getBoundingClientRect()\n\t\tthis._triggerAction(e.clientX - rect.left, e.clientY - rect.top)\n\t}\n\n\tprivate handleKeyDown = (e: KeyboardEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\te.preventDefault()\n\t\t\tthis._setPressed(true)\n\n\t\t\t// Simulate click at center\n\t\t\tconst rect = this.getBoundingClientRect()\n\t\t\tthis._triggerAction(rect.width / 2, rect.height / 2)\n\t\t}\n\t}\n\n\tprivate handleKeyUp = (e: KeyboardEvent) => {\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\tthis._setPressed(false)\n\t\t}\n\t}\n\n\t// Consolidate pressed state management\n\tprivate _setPressed(pressed: boolean) {\n\t\tthis.pressed = pressed\n\t\tif (pressed) {\n\t\t\tthis.setAttribute('pressed', '')\n\t\t} else {\n\t\t\tthis.removeAttribute('pressed')\n\t\t}\n\t}\n\n\tprivate handleMouseDown = () => {\n\t\tif (this.disabled || !this.interactive) return\n\t\tthis._setPressed(true)\n\t}\n\n\tprivate handleMouseUp = () => this._setPressed(false)\n\tprivate handleMouseLeave = () => this._setPressed(false)\n\n\tprotected render() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\t${isInteractive ? cursorGlow({ radius: 200, intensity: 0.1 }) : ''}\n\t\t\t\tclass=\"relative w-full h-full rounded-xl ${isInteractive ? 'cursor-pointer' : ''}\"\n\t\t\t\t@click=${this.handleClick}\n\t\t\t\t@keydown=${this.handleKeyDown}\n\t\t\t\t@keyup=${this.handleKeyUp}\n\t\t\t\t@mousedown=${this.handleMouseDown}\n\t\t\t\t@mouseup=${this.handleMouseUp}\n\t\t\t\t@mouseleave=${this.handleMouseLeave}\n\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\taria-disabled=${this.disabled ? 'true' : 'false'}\n\t\t\t>\n\t\t\t\t<!-- State layer -->\n\t\t\t\t<div\n\t\t\t\t\tclass=\"absolute inset-0 rounded-xl pointer-events-none transition-opacity duration-200 bg-surface-on ${!isInteractive\n\t\t\t\t\t\t? 'opacity-0'\n\t\t\t\t\t\t: this.pressed\n\t\t\t\t\t\t\t? 'opacity-[var(--schmancy-sys-state-pressed-opacity)]'\n\t\t\t\t\t\t\t: 'opacity-0 hover:opacity-[var(--schmancy-sys-state-hover-opacity)] focus-visible:opacity-[var(--schmancy-sys-state-focus-opacity)]'}\"\n\t\t\t\t></div>\n\n\t\t\t\t<!-- Ripples -->\n\t\t\t\t${this.interactive && this.ripples.length\n\t\t\t\t\t? html`\n\t\t\t\t\t\t\t<div class=\"absolute inset-0 rounded-xl overflow-hidden pointer-events-none\">\n\t\t\t\t\t\t\t\t${this.ripples.map(\n\t\t\t\t\t\t\t\t\tr => html`\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclass=\"absolute rounded-full scale-0 animate-[ripple_600ms_linear] bg-surface-on opacity-[0.12] w-5 h-5 -ml-2.5 -mt-2.5\"\n\t\t\t\t\t\t\t\t\t\t\tstyle=\"left: ${r.x}px; top: ${r.y}px\"\n\t\t\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t`\n\t\t\t\t\t: ''}\n\n\t\t\t\t<!-- Content -->\n\t\t\t\t<div class=\"relative h-full w-full rounded-xl\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card': SchmancyCard\n\t}\n}\n","import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-content\n */\n@customElement('schmancy-card-content')\nexport default class SchmancyCardContent extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tpadding: 1rem;\n\t}\n`];\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-content': SchmancyCardContent\n\t}\n}\n","import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-media\n */\n@customElement('schmancy-card-media')\nexport default class SchmancyCardMedia extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\theight: 200px;\n\t\toverflow: hidden;\n\t}\n\t\n\t/* Allow height to be overridden when used in flex/grid layouts */\n\t:host-context(.h-full) {\n\t\theight: 100%;\n\t}\n\t\n\t::slotted(img),\n\timg {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tobject-position: center;\n\t}\n\t\n\t/* Object fit styles based on fit attribute */\n\t:host([fit=\"contain\"]) img,\n\t:host([fit=\"contain\"]) ::slotted(img) {\n\t\tobject-fit: contain;\n\t}\n\t\n\t:host([fit=\"cover\"]) img,\n\t:host([fit=\"cover\"]) ::slotted(img) {\n\t\tobject-fit: cover;\n\t}\n\t\n\t:host([fit=\"fill\"]) img,\n\t:host([fit=\"fill\"]) ::slotted(img) {\n\t\tobject-fit: fill;\n\t}\n\t\n\t:host([fit=\"none\"]) img,\n\t:host([fit=\"none\"]) ::slotted(img) {\n\t\tobject-fit: none;\n\t}\n\t\n\t:host([fit=\"scale-down\"]) img,\n\t:host([fit=\"scale-down\"]) ::slotted(img) {\n\t\tobject-fit: scale-down;\n\t}\n`];\n\t@property({ type: String, reflect: true })\n\tsrc: string = ''\n\n\t@property({ type: String, reflect: true })\n\tfit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' = 'contain'\n\t\n\t@property({ type: String })\n\talt: string = ''\n\n\tprotected render(): unknown {\n\t\t// If src is provided, render an img element\n\t\t// Otherwise, allow users to slot their own content\n\t\treturn this.src \n\t\t\t? html`<img src=\"${this.src}\" alt=\"${this.alt}\" />` \n\t\t\t: html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-media': SchmancyCardMedia\n\t}\n}\n"],"mappings":"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"}

package/dist/card.cjs

@@ -1 +1 @@
-require(`./card-DjYnCckw.cjs`);
+require(`./card-ClroODSK.cjs`);

package/dist/card.js

@@ -1 +1 @@
-import "./card-wUTjx0EC.js";
+import "./card-Bv--HeGO.js";

package/dist/charts.cjs

@@ -1,8 +1,8 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-CncqDLb2.cjs`);const e=require(`./decorate-F9CuyeHg.cjs`),t=require(`./litElement.mixin-qh5-IIUq.cjs`);require(`./mixins.cjs`);let n=require(`lit/decorators.js`),r=require(`lit`),i=require(`lit/directives/ref.js`),a=require(`lit/directives/repeat.js`);function o(e,t,n,r,i){let a=i*i,o=a*i;return{x:.5*(2*t.x+(-e.x+n.x)*i+(2*e.x-5*t.x+4*n.x-r.x)*a+(-e.x+3*t.x-3*n.x+r.x)*o),y:.5*(2*t.y+(-e.y+n.y)*i+(2*e.y-5*t.y+4*n.y-r.y)*a+(-e.y+3*t.y-3*n.y+r.y)*o)}}function s(e,t){if(e.startsWith(`rgb`)){let n=e.match(/[\d.]+/g);if(n&&n.length>=3)return`rgba(${n[0]}, ${n[1]}, ${n[2]}, ${t})`}let n=e.replace(`#`,``);return n.length===3&&(n=n.split(``).map(e=>e+e).join(``)),`rgba(${parseInt(n.substring(0,2),16)}, ${parseInt(n.substring(2,4),16)}, ${parseInt(n.substring(4,6),16)}, ${t})`}function c(e){return 1-(1-e)**3}var l=class extends t.t(r.css`
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-BIXF7xkF.cjs`),t=require(`./decorate-DpFmy0nm.cjs`);let n=require(`lit/decorators.js`),r=require(`lit`),i=require(`lit/directives/ref.js`),a=require(`lit/directives/repeat.js`);function o(e,t,n,r,i){let a=i*i,o=a*i;return{x:.5*(2*t.x+(-e.x+n.x)*i+(2*e.x-5*t.x+4*n.x-r.x)*a+(-e.x+3*t.x-3*n.x+r.x)*o),y:.5*(2*t.y+(-e.y+n.y)*i+(2*e.y-5*t.y+4*n.y-r.y)*a+(-e.y+3*t.y-3*n.y+r.y)*o)}}function s(e,t){if(e.startsWith(`rgb`)){let n=e.match(/[\d.]+/g);if(n&&n.length>=3)return`rgba(${n[0]}, ${n[1]}, ${n[2]}, ${t})`}let n=e.replace(`#`,``);return n.length===3&&(n=n.split(``).map(e=>e+e).join(``)),`rgba(${parseInt(n.substring(0,2),16)}, ${parseInt(n.substring(2,4),16)}, ${parseInt(n.substring(4,6),16)}, ${t})`}function c(e){return 1-(1-e)**3}var l=class extends e.s{constructor(...e){super(...e),this.data=[],this.height=200,this.showGrid=!0,this.showLabels=!0,this.showTooltip=!0,this.peakCount=3,this.animationDuration=800,this.animated=!0,this.valuePrefix=``,this.valueSuffix=``,this.valueDecimals=2,this.theme={},this.tooltipData={visible:!1,x:0,y:0,label:``,value:0},this.animationProgress=0,this.isVisible=!1,this.canvasRef=(0,i.createRef)(),this.containerRef=(0,i.createRef)(),this.animationFrameId=null,this.observer=null,this.processedData=[],this.resizeObserver=null,this.handlePointerMove=e=>{if(this.processedData.length===0||!this.showTooltip)return;let t=this.canvasRef.value;if(!t)return;let n=t.getBoundingClientRect(),r=e.clientX-n.left,i=null,a=1/0;this.processedData.forEach(e=>{let t=Math.abs(e.x-r);t<a&&(a=t,i=e)}),this.tooltipData=i&&a<30?{visible:!0,x:i.x,y:i.y,label:i.label,value:i.value,metadata:i.metadata}:{...this.tooltipData,visible:!1}},this.handlePointerLeave=()=>{this.tooltipData={...this.tooltipData,visible:!1}}}static{this.styles=[r.css`
 	:host {
 		display: block;
 	}
-`){constructor(...e){super(...e),this.data=[],this.height=200,this.showGrid=!0,this.showLabels=!0,this.showTooltip=!0,this.peakCount=3,this.animationDuration=800,this.animated=!0,this.valuePrefix=``,this.valueSuffix=``,this.valueDecimals=2,this.theme={},this.tooltipData={visible:!1,x:0,y:0,label:``,value:0},this.animationProgress=0,this.isVisible=!1,this.canvasRef=(0,i.createRef)(),this.containerRef=(0,i.createRef)(),this.animationFrameId=null,this.observer=null,this.processedData=[],this.resizeObserver=null,this.handlePointerMove=e=>{if(this.processedData.length===0||!this.showTooltip)return;let t=this.canvasRef.value;if(!t)return;let n=t.getBoundingClientRect(),r=e.clientX-n.left,i=null,a=1/0;this.processedData.forEach(e=>{let t=Math.abs(e.x-r);t<a&&(a=t,i=e)}),this.tooltipData=i&&a<30?{visible:!0,x:i.x,y:i.y,label:i.label,value:i.value,metadata:i.metadata}:{...this.tooltipData,visible:!1}},this.handlePointerLeave=()=>{this.tooltipData={...this.tooltipData,visible:!1}}}connectedCallback(){super.connectedCallback(),this.setupIntersectionObserver()}disconnectedCallback(){super.disconnectedCallback(),this.cleanup()}cleanup(){this.animationFrameId!==null&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null),this.observer&&=(this.observer.disconnect(),null),this.resizeObserver&&=(this.resizeObserver.disconnect(),null)}setupIntersectionObserver(){this.observer=new IntersectionObserver(e=>{let t=e[0];t.isIntersecting&&!this.isVisible?(this.isVisible=!0,this.animated?this.startAnimation():(this.animationProgress=1,this.drawChart())):t.isIntersecting||(this.isVisible=!1,this.animationFrameId!==null&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null))},{threshold:.1})}updated(e){super.updated(e),this.containerRef.value&&this.observer&&this.observer.observe(this.containerRef.value),this.canvasRef.value&&!this.resizeObserver&&(this.resizeObserver=new ResizeObserver(()=>{this.drawChart()}),this.resizeObserver.observe(this.canvasRef.value)),e.has(`data`)&&this.isVisible&&(this.animated?(this.animationProgress=0,this.startAnimation()):(this.animationProgress=1,this.drawChart())),(e.has(`theme`)||e.has(`showGrid`)||e.has(`showLabels`)||e.has(`peakCount`))&&this.isVisible&&this.drawChart()}startAnimation(){let e=performance.now(),t=this.animationDuration,n=r=>{let i=r-e,a=Math.min(i/t,1);this.animationProgress=c(a),this.drawChart(),a<1&&this.isVisible&&(this.animationFrameId=requestAnimationFrame(n))};this.animationFrameId=requestAnimationFrame(n)}processData(){if(!this.data||this.data.length===0)return[];let e=[...this.data].sort((e,t)=>t.value-e.value),t=new Set(e.slice(0,this.peakCount).map(e=>e.label));return this.data.map(e=>({...e,x:0,y:0,isPeak:t.has(e.label)}))}getThemeValue(e,t){return this.theme[e]??t}drawChart(){let e=this.canvasRef.value;if(!e)return;let t=e.getContext(`2d`);if(!t)return;let n=window.devicePixelRatio||1,r=e.getBoundingClientRect(),i=r.width,a=r.height;e.width=i*n,e.height=a*n,t.scale(n,n),t.clearRect(0,0,i,a);let c=this.processData();if(c.length===0)return;let l=this.showLabels?40:20,u=i-20-20,d=a-20-l,f=Math.max(...c.map(e=>e.value),1),p=c.map((e,t)=>({...e,x:20+(c.length>1?t/(c.length-1)*u:u/2),y:20+d-e.value/f*d}));this.processedData=p;let m=getComputedStyle(this).getPropertyValue(`--schmancy-sys-color-primary`).trim()||`#6750A4`,h=this.getThemeValue(`primaryColor`,m),[g,_]=this.getThemeValue(`gradientOpacity`,[.4,.05]),v=this.getThemeValue(`strokeWidth`,2),y=this.getThemeValue(`pointRadius`,4),b=this.getThemeValue(`peakRadius`,6);if(this.showGrid){t.strokeStyle=`rgba(128, 128, 128, 0.15)`,t.lineWidth=1,t.setLineDash([4,4]);for(let e=1;e<=3;e++){let n=20+d*e/4;t.beginPath(),t.moveTo(20,n),t.lineTo(i-20,n),t.stroke()}t.setLineDash([])}let x=new Path2D,S=new Path2D;if(p.length>=2){S.moveTo(p[0].x,20+d),x.moveTo(p[0].x,p[0].y),S.lineTo(p[0].x,p[0].y);for(let e=0;e<p.length-1;e++){let t=p[Math.max(0,e-1)],n=p[e],r=p[Math.min(p.length-1,e+1)],i=p[Math.min(p.length-1,e+2)];for(let e=1;e<=16;e++){let a=o(t,n,r,i,e/16);x.lineTo(a.x,a.y),S.lineTo(a.x,a.y)}}S.lineTo(p[p.length-1].x,20+d),S.closePath()}else p.length===1&&x.arc(p[0].x,p[0].y,y,0,2*Math.PI);if(t.save(),t.beginPath(),t.rect(0,0,20+u*this.animationProgress,a),t.clip(),p.length>=2){let e=t.createLinearGradient(0,20,0,20+d);e.addColorStop(0,s(h,g)),e.addColorStop(1,s(h,_)),t.fillStyle=e,t.fill(S)}if(t.strokeStyle=h,t.lineWidth=v,t.lineCap=`round`,t.lineJoin=`round`,t.stroke(x),p.forEach((e,n)=>{if(n/(p.length-1||1)*this.animationProgress<n/(p.length||1))return;let r=e.isPeak?b-1:y-1,i=e.isPeak?b+4:y+2;e.isPeak&&(t.beginPath(),t.arc(e.x,e.y,i,0,2*Math.PI),t.fillStyle=s(h,.2),t.fill()),t.beginPath(),t.arc(e.x,e.y,r,0,2*Math.PI),t.fillStyle=h,t.fill(),e.isPeak&&(t.beginPath(),t.arc(e.x,e.y,2,0,2*Math.PI),t.fillStyle=`white`,t.fill())}),t.restore(),this.showLabels&&p.length>0){t.fillStyle=`rgba(128, 128, 128, 0.8)`,t.font=`11px system-ui, sans-serif`,t.textAlign=`center`,t.textBaseline=`top`;let e=i<400?3:i<600?2:1;p.forEach((n,r)=>{r%e===0&&t.fillText(n.label,n.x,a-l+8)})}}formatValue(e){let t=e.toFixed(this.valueDecimals);return`${this.valuePrefix}${t}${this.valueSuffix}`}renderMetadata(){return this.tooltipData.metadata?Object.entries(this.tooltipData.metadata).map(([e,t])=>r.html`
+`]}connectedCallback(){super.connectedCallback(),this.setupIntersectionObserver()}disconnectedCallback(){super.disconnectedCallback(),this.cleanup()}cleanup(){this.animationFrameId!==null&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null),this.observer&&=(this.observer.disconnect(),null),this.resizeObserver&&=(this.resizeObserver.disconnect(),null)}setupIntersectionObserver(){this.observer=new IntersectionObserver(e=>{let t=e[0];t.isIntersecting&&!this.isVisible?(this.isVisible=!0,this.animated?this.startAnimation():(this.animationProgress=1,this.drawChart())):t.isIntersecting||(this.isVisible=!1,this.animationFrameId!==null&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null))},{threshold:.1})}updated(e){super.updated(e),this.containerRef.value&&this.observer&&this.observer.observe(this.containerRef.value),this.canvasRef.value&&!this.resizeObserver&&(this.resizeObserver=new ResizeObserver(()=>{this.drawChart()}),this.resizeObserver.observe(this.canvasRef.value)),e.has(`data`)&&this.isVisible&&(this.animated?(this.animationProgress=0,this.startAnimation()):(this.animationProgress=1,this.drawChart())),(e.has(`theme`)||e.has(`showGrid`)||e.has(`showLabels`)||e.has(`peakCount`))&&this.isVisible&&this.drawChart()}startAnimation(){let e=performance.now(),t=this.animationDuration,n=r=>{let i=r-e,a=Math.min(i/t,1);this.animationProgress=c(a),this.drawChart(),a<1&&this.isVisible&&(this.animationFrameId=requestAnimationFrame(n))};this.animationFrameId=requestAnimationFrame(n)}processData(){if(!this.data||this.data.length===0)return[];let e=[...this.data].toSorted((e,t)=>t.value-e.value),t=new Set(e.slice(0,this.peakCount).map(e=>e.label));return this.data.map(e=>({...e,x:0,y:0,isPeak:t.has(e.label)}))}getThemeValue(e,t){return this.theme[e]??t}drawChart(){let e=this.canvasRef.value;if(!e)return;let t=e.getContext(`2d`);if(!t)return;let n=window.devicePixelRatio||1,r=e.getBoundingClientRect(),i=r.width,a=r.height;e.width=i*n,e.height=a*n,t.scale(n,n),t.clearRect(0,0,i,a);let c=this.processData();if(c.length===0)return;let l=this.showLabels?40:20,u=i-20-20,d=a-20-l,f=Math.max(...c.map(e=>e.value),1),p=c.map((e,t)=>({...e,x:20+(c.length>1?t/(c.length-1)*u:u/2),y:20+d-e.value/f*d}));this.processedData=p;let m=getComputedStyle(this).getPropertyValue(`--schmancy-sys-color-primary`).trim()||`#6750A4`,h=this.getThemeValue(`primaryColor`,m),[g,_]=this.getThemeValue(`gradientOpacity`,[.4,.05]),v=this.getThemeValue(`strokeWidth`,2),y=this.getThemeValue(`pointRadius`,4),b=this.getThemeValue(`peakRadius`,6);if(this.showGrid){t.strokeStyle=`rgba(128, 128, 128, 0.15)`,t.lineWidth=1,t.setLineDash([4,4]);for(let e=1;e<=3;e++){let n=20+d*e/4;t.beginPath(),t.moveTo(20,n),t.lineTo(i-20,n),t.stroke()}t.setLineDash([])}let x=new Path2D,S=new Path2D;if(p.length>=2){S.moveTo(p[0].x,20+d),x.moveTo(p[0].x,p[0].y),S.lineTo(p[0].x,p[0].y);for(let e=0;e<p.length-1;e++){let t=p[Math.max(0,e-1)],n=p[e],r=p[Math.min(p.length-1,e+1)],i=p[Math.min(p.length-1,e+2)];for(let e=1;e<=16;e++){let a=o(t,n,r,i,e/16);x.lineTo(a.x,a.y),S.lineTo(a.x,a.y)}}S.lineTo(p[p.length-1].x,20+d),S.closePath()}else p.length===1&&x.arc(p[0].x,p[0].y,y,0,2*Math.PI);if(t.save(),t.beginPath(),t.rect(0,0,20+u*this.animationProgress,a),t.clip(),p.length>=2){let e=t.createLinearGradient(0,20,0,20+d);e.addColorStop(0,s(h,g)),e.addColorStop(1,s(h,_)),t.fillStyle=e,t.fill(S)}if(t.strokeStyle=h,t.lineWidth=v,t.lineCap=`round`,t.lineJoin=`round`,t.stroke(x),p.forEach((e,n)=>{if(n/(p.length-1||1)*this.animationProgress<n/(p.length||1))return;let r=e.isPeak?b-1:y-1,i=e.isPeak?b+4:y+2;e.isPeak&&(t.beginPath(),t.arc(e.x,e.y,i,0,2*Math.PI),t.fillStyle=s(h,.2),t.fill()),t.beginPath(),t.arc(e.x,e.y,r,0,2*Math.PI),t.fillStyle=h,t.fill(),e.isPeak&&(t.beginPath(),t.arc(e.x,e.y,2,0,2*Math.PI),t.fillStyle=`white`,t.fill())}),t.restore(),this.showLabels&&p.length>0){t.fillStyle=`rgba(128, 128, 128, 0.8)`,t.font=`11px system-ui, sans-serif`,t.textAlign=`center`,t.textBaseline=`top`;let e=i<400?3:i<600?2:1;p.forEach((n,r)=>{r%e===0&&t.fillText(n.label,n.x,a-l+8)})}}formatValue(e){let t=e.toFixed(this.valueDecimals);return`${this.valuePrefix}${t}${this.valueSuffix}`}renderMetadata(){return this.tooltipData.metadata?Object.entries(this.tooltipData.metadata).map(([e,t])=>r.html`
 				<schmancy-typography type="body" token="sm" class="text-surface-onVariant">
 					${e}: ${String(t)}
 				</schmancy-typography>
@@ -40,11 +40,11 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./ch
 						  `:``}
 				</div>
 			</div>
-		`:r.html``}};e.t([(0,n.property)({type:Array})],l.prototype,`data`,void 0),e.t([(0,n.property)({type:Number})],l.prototype,`height`,void 0),e.t([(0,n.property)({type:Boolean})],l.prototype,`showGrid`,void 0),e.t([(0,n.property)({type:Boolean})],l.prototype,`showLabels`,void 0),e.t([(0,n.property)({type:Boolean})],l.prototype,`showTooltip`,void 0),e.t([(0,n.property)({type:Number})],l.prototype,`peakCount`,void 0),e.t([(0,n.property)({type:Number})],l.prototype,`animationDuration`,void 0),e.t([(0,n.property)({type:Boolean})],l.prototype,`animated`,void 0),e.t([(0,n.property)({type:String})],l.prototype,`valuePrefix`,void 0),e.t([(0,n.property)({type:String})],l.prototype,`valueSuffix`,void 0),e.t([(0,n.property)({type:Number})],l.prototype,`valueDecimals`,void 0),e.t([(0,n.property)({type:Object})],l.prototype,`theme`,void 0),e.t([(0,n.state)()],l.prototype,`tooltipData`,void 0),e.t([(0,n.state)()],l.prototype,`animationProgress`,void 0),e.t([(0,n.state)()],l.prototype,`isVisible`,void 0),l=e.t([(0,n.customElement)(`schmancy-area-chart`)],l);var u=[`bg-primary`,`bg-secondary`,`bg-tertiary`,`bg-success`,`bg-warning`,`bg-error`,`bg-primary/70`,`bg-secondary/70`,`bg-tertiary/70`,`bg-success/70`,`bg-warning/70`,`bg-error/70`,`bg-primary/40`,`bg-secondary/40`,`bg-tertiary/40`],d=class extends t.t(r.css`
+		`:r.html``}};t.t([(0,n.property)({type:Array})],l.prototype,`data`,void 0),t.t([(0,n.property)({type:Number})],l.prototype,`height`,void 0),t.t([(0,n.property)({type:Boolean})],l.prototype,`showGrid`,void 0),t.t([(0,n.property)({type:Boolean})],l.prototype,`showLabels`,void 0),t.t([(0,n.property)({type:Boolean})],l.prototype,`showTooltip`,void 0),t.t([(0,n.property)({type:Number})],l.prototype,`peakCount`,void 0),t.t([(0,n.property)({type:Number})],l.prototype,`animationDuration`,void 0),t.t([(0,n.property)({type:Boolean})],l.prototype,`animated`,void 0),t.t([(0,n.property)({type:String})],l.prototype,`valuePrefix`,void 0),t.t([(0,n.property)({type:String})],l.prototype,`valueSuffix`,void 0),t.t([(0,n.property)({type:Number})],l.prototype,`valueDecimals`,void 0),t.t([(0,n.property)({type:Object})],l.prototype,`theme`,void 0),t.t([(0,n.state)()],l.prototype,`tooltipData`,void 0),t.t([(0,n.state)()],l.prototype,`animationProgress`,void 0),t.t([(0,n.state)()],l.prototype,`isVisible`,void 0),l=t.t([(0,n.customElement)(`schmancy-area-chart`)],l);var u=[`bg-primary`,`bg-secondary`,`bg-tertiary`,`bg-success`,`bg-warning`,`bg-error`,`bg-primary/70`,`bg-secondary/70`,`bg-tertiary/70`,`bg-success/70`,`bg-warning/70`,`bg-error/70`,`bg-primary/40`,`bg-secondary/40`,`bg-tertiary/40`],d=class extends e.s{constructor(...e){super(...e),this.data=[],this.valuePrefix=``,this.valueSuffix=``,this.valueDecimals=2,this.showMedals=!0,this.showLegend=!0,this.animationDuration=500,this.animated=!0,this.labelWidth=`w-14`,this.valueWidth=`w-20`,this.animationProgress=0,this.isVisible=!1,this.categoryColorMap=new Map,this.observer=null,this.animationFrameId=null}static{this.styles=[r.css`
 	:host {
 		display: block;
 	}
-`){constructor(...e){super(...e),this.data=[],this.valuePrefix=``,this.valueSuffix=``,this.valueDecimals=2,this.showMedals=!0,this.showLegend=!0,this.animationDuration=500,this.animated=!0,this.labelWidth=`w-14`,this.valueWidth=`w-20`,this.animationProgress=0,this.isVisible=!1,this.categoryColorMap=new Map,this.observer=null,this.animationFrameId=null}connectedCallback(){super.connectedCallback(),this.setupIntersectionObserver()}disconnectedCallback(){super.disconnectedCallback(),this.cleanup()}cleanup(){this.animationFrameId!==null&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null),this.observer&&=(this.observer.disconnect(),null)}setupIntersectionObserver(){this.observer=new IntersectionObserver(e=>{e[0].isIntersecting&&!this.isVisible&&(this.isVisible=!0,this.animated?this.startAnimation():this.animationProgress=1)},{threshold:.1})}firstUpdated(){this.observer&&this.observer.observe(this)}updated(e){super.updated(e),e.has(`data`)&&this.isVisible&&this.animated&&(this.animationProgress=0,this.startAnimation())}startAnimation(){let e=performance.now(),t=this.animationDuration,n=r=>{let i=r-e,a=Math.min(i/t,1);this.animationProgress=1-(1-a)**3,a<1&&this.isVisible&&(this.animationFrameId=requestAnimationFrame(n))};this.animationFrameId=requestAnimationFrame(n)}initializeCategoryColors(){let e=new Map,t=new Map;this.data.forEach(n=>{n.segments&&n.segments.forEach(n=>{e.set(n.label,(e.get(n.label)||0)+n.value),n.color&&!t.has(n.label)&&t.set(n.label,n.color)})});let n=Array.from(e.entries()).sort((e,t)=>t[1]-e[1]).map(([e])=>e);this.categoryColorMap.clear();let r=0;n.forEach(e=>{t.has(e)?this.categoryColorMap.set(e,t.get(e)):(this.categoryColorMap.set(e,u[r%u.length]),r++)})}getSegmentColor(e){return e.color?e.color:this.categoryColorMap.get(e.label)||`bg-primary`}formatValue(e){let t=e.toFixed(this.valueDecimals);return`${this.valuePrefix}${t}${this.valueSuffix}`}getMedalEmoji(e){return this.showMedals&&e?e===1?`🥇`:e===2?`🥈`:e===3?`🥉`:``:``}getMaxValue(){return this.data.length===0?0:Math.max(...this.data.map(e=>e.value),1)}renderBar(e,t){let n=(t>0?e.value/t*100:0)*this.animationProgress;return e.segments&&e.segments.length!==0?r.html`
+`]}connectedCallback(){super.connectedCallback(),this.setupIntersectionObserver()}disconnectedCallback(){super.disconnectedCallback(),this.cleanup()}cleanup(){this.animationFrameId!==null&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null),this.observer&&=(this.observer.disconnect(),null)}setupIntersectionObserver(){this.observer=new IntersectionObserver(e=>{e[0].isIntersecting&&!this.isVisible&&(this.isVisible=!0,this.animated?this.startAnimation():this.animationProgress=1)},{threshold:.1})}firstUpdated(){this.observer&&this.observer.observe(this)}updated(e){super.updated(e),e.has(`data`)&&this.isVisible&&this.animated&&(this.animationProgress=0,this.startAnimation())}startAnimation(){let e=performance.now(),t=this.animationDuration,n=r=>{let i=r-e,a=Math.min(i/t,1);this.animationProgress=1-(1-a)**3,a<1&&this.isVisible&&(this.animationFrameId=requestAnimationFrame(n))};this.animationFrameId=requestAnimationFrame(n)}initializeCategoryColors(){let e=new Map,t=new Map;this.data.forEach(n=>{n.segments&&n.segments.forEach(n=>{e.set(n.label,(e.get(n.label)||0)+n.value),n.color&&!t.has(n.label)&&t.set(n.label,n.color)})});let n=Array.from(e.entries()).toSorted((e,t)=>t[1]-e[1]).map(([e])=>e);this.categoryColorMap.clear();let r=0;n.forEach(e=>{t.has(e)?this.categoryColorMap.set(e,t.get(e)):(this.categoryColorMap.set(e,u[r%u.length]),r++)})}getSegmentColor(e){return e.color?e.color:this.categoryColorMap.get(e.label)||`bg-primary`}formatValue(e){let t=e.toFixed(this.valueDecimals);return`${this.valuePrefix}${t}${this.valueSuffix}`}getMedalEmoji(e){return this.showMedals&&e?e===1?`🥇`:e===2?`🥈`:e===3?`🥉`:``:``}getMaxValue(){return this.data.length===0?0:Math.max(...this.data.map(e=>e.value),1)}renderBar(e,t){let n=(t>0?e.value/t*100:0)*this.animationProgress;return e.segments&&e.segments.length!==0?r.html`
 			<div
 				class="h-full flex"
 				style="width: ${Math.max(n,2)}%; transition-duration: ${this.animated?`0ms`:`300ms`}"
@@ -109,4 +109,4 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./ch
 
 			<!-- Legend -->
 			${this.renderLegend()}
-		`}};e.t([(0,n.property)({type:Array})],d.prototype,`data`,void 0),e.t([(0,n.property)({type:String})],d.prototype,`valuePrefix`,void 0),e.t([(0,n.property)({type:String})],d.prototype,`valueSuffix`,void 0),e.t([(0,n.property)({type:Number})],d.prototype,`valueDecimals`,void 0),e.t([(0,n.property)({type:Boolean})],d.prototype,`showMedals`,void 0),e.t([(0,n.property)({type:Boolean})],d.prototype,`showLegend`,void 0),e.t([(0,n.property)({type:Number})],d.prototype,`animationDuration`,void 0),e.t([(0,n.property)({type:Boolean})],d.prototype,`animated`,void 0),e.t([(0,n.property)({type:String})],d.prototype,`labelWidth`,void 0),e.t([(0,n.property)({type:String})],d.prototype,`valueWidth`,void 0),e.t([(0,n.state)()],d.prototype,`animationProgress`,void 0),e.t([(0,n.state)()],d.prototype,`isVisible`,void 0),e.t([(0,n.state)()],d.prototype,`categoryColorMap`,void 0),d=e.t([(0,n.customElement)(`schmancy-pills`)],d),Object.defineProperty(exports,`SchmancyAreaChart`,{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,`SchmancyPills`,{enumerable:!0,get:function(){return d}}),exports.catmullRomSpline=o,exports.easeOutCubic=c,exports.hexToRgba=s;
+		`}};t.t([(0,n.property)({type:Array})],d.prototype,`data`,void 0),t.t([(0,n.property)({type:String})],d.prototype,`valuePrefix`,void 0),t.t([(0,n.property)({type:String})],d.prototype,`valueSuffix`,void 0),t.t([(0,n.property)({type:Number})],d.prototype,`valueDecimals`,void 0),t.t([(0,n.property)({type:Boolean})],d.prototype,`showMedals`,void 0),t.t([(0,n.property)({type:Boolean})],d.prototype,`showLegend`,void 0),t.t([(0,n.property)({type:Number})],d.prototype,`animationDuration`,void 0),t.t([(0,n.property)({type:Boolean})],d.prototype,`animated`,void 0),t.t([(0,n.property)({type:String})],d.prototype,`labelWidth`,void 0),t.t([(0,n.property)({type:String})],d.prototype,`valueWidth`,void 0),t.t([(0,n.state)()],d.prototype,`animationProgress`,void 0),t.t([(0,n.state)()],d.prototype,`isVisible`,void 0),t.t([(0,n.state)()],d.prototype,`categoryColorMap`,void 0),d=t.t([(0,n.customElement)(`schmancy-pills`)],d),Object.defineProperty(exports,`SchmancyAreaChart`,{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,`SchmancyPills`,{enumerable:!0,get:function(){return d}}),exports.catmullRomSpline=o,exports.easeOutCubic=c,exports.hexToRgba=s;