@mhmo91/schmancy 0.9.5 → 0.9.7

package/dist/input-chip-BhjGVpc3.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-chip-BhjGVpc3.cjs","names":[],"sources":["../src/chips/input-chip.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/tailwind.mixin'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { BehaviorSubject, combineLatest } from 'rxjs'\nimport { map, takeUntil, tap } from 'rxjs/operators'\n\n/**\n * Input chip component - represents user-provided information that can be removed.\n *\n * IMPORTANT: Per Material Design 3 specification, input chips do NOT have selected state.\n * They represent discrete pieces of user input (like entered tags, selections from lists, etc.)\n * that can only be removed, not toggled on/off.\n *\n * Use cases:\n * - Displaying selected recipients in an email\n * - Showing applied filters that can be removed\n * - Tags or keywords entered by the user\n * - Selected items from a multi-select dropdown\n *\n * @fires click - Optional click event on chip body (value)\n * @fires remove - Dispatched when remove button is clicked (value)\n *\n * @example\n * ```html\n * <schmancy-input-chip value=\"john@example.com\" avatar=\"/avatars/john.jpg\">\n *   John Doe\n * </schmancy-input-chip>\n * ```\n */\n@customElement('schmancy-input-chip')\nexport class SchmancyInputChip extends TailwindElement(css`\n\t:host {\n\t\tdisplay: inline-block;\n\t\toutline: none;\n\t\tmin-width:fit-content\n\n\t}\n\n\t:host([disabled]) {\n\t\tpointer-events: none;\n\t}\n\n\tbutton {\n\t\tfont-family: inherit;\n\t}\n\n\t.avatar-img {\n\t\twidth: 20px;\n\t\theight: 20px;\n\t\tobject-fit: cover;\n\t}\n\n\t/* Material Symbols font for icons */\n\t.material-symbols-outlined {\n\t\tfont-family: 'Material Symbols Outlined';\n\t\tfont-weight: normal;\n\t\tfont-style: normal;\n\t\tfont-size: 18px;\n\t\tline-height: 1;\n\t\tletter-spacing: normal;\n\t\ttext-transform: none;\n\t\tdisplay: inline-block;\n\t\twhite-space: nowrap;\n\t\tword-wrap: normal;\n\t\tdirection: ltr;\n\t\t-webkit-font-smoothing: antialiased;\n\t\ttext-rendering: optimizeLegibility;\n\t\t-moz-osx-font-smoothing: grayscale;\n\t\tfont-feature-settings: 'liga';\n\t\tvertical-align: middle;\n\t}\n\n\t.ripple {\n\t\tposition: absolute;\n\t\tborder-radius: 50%;\n\t\ttransform: scale(0);\n\t\tanimation: ripple 600ms linear;\n\t\tbackground-color: rgba(0, 0, 0, 0.08);\n\t\tpointer-events: none;\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\t/* State layer for M3 hover/focus/pressed states */\n\t.state-layer {\n\t\tposition: absolute;\n\t\tinset: 0;\n\t\tborder-radius: inherit;\n\t\tpointer-events: none;\n\t\tbackground-color: currentColor;\n\t\topacity: 0;\n\t\ttransition: opacity 200ms ease;\n\t}\n\n\t:host(:not([disabled])) .chip-container:hover .state-layer {\n\t\topacity: 0.08;\n\t}\n\n\t:host(:not([disabled])) .chip-container:focus-visible .state-layer {\n\t\topacity: 0.1;\n\t}\n\n\t:host(:not([disabled])) .chip-container:active .state-layer {\n\t\topacity: 0.1;\n\t}\n`) {\n\t/** Value identifier for the chip */\n\t@property({ type: String, reflect: true })\n\tvalue: string = ''\n\n\t/** Optional icon name (Material Symbols) */\n\t@property({ type: String, reflect: true })\n\ticon: string = ''\n\n\t/** Optional avatar image URL */\n\t@property({ type: String, reflect: true })\n\tavatar: string = ''\n\n\t/** Whether to show remove button (default true for input chips) */\n\t@property({ type: Boolean, reflect: true })\n\tremovable: boolean = true\n\n\t/** Disable the chip */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled: boolean = false\n\n\t/** Elevated style variant */\n\t@property({ type: Boolean, reflect: true })\n\televated: boolean = false\n\n\t// RxJS state streams\n\tprivate chipHover$ = new BehaviorSubject<boolean>(false)\n\tprivate removeHover$ = new BehaviorSubject<boolean>(false)\n\tprivate focused$ = new BehaviorSubject<boolean>(false)\n\tprivate pressed$ = new BehaviorSubject<boolean>(false)\n\n\t// UI state from combined streams\n\t@state()  uiState = {\n\t\tchipHover: false,\n\t\tremoveHover: false,\n\t\tfocused: false,\n\t\tpressed: false\n\t}\n\n\t// Ripple effects\n\t@state() private ripples: Array<{ x: number; y: number; id: number }> = []\n\tprivate nextRippleId = 0\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}\n\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tdelegatesFocus: true,\n\t}\n\n\tstatic formAssociated = true\n\tinternals: ElementInternals | undefined\n\tget form() {\n\t\treturn this.internals?.form\n\t}\n\n\tprotected updated(changed: Map<string, unknown>) {\n\t\tsuper.updated?.(changed)\n\t\tif (changed.has('value')) {\n\t\t\tthis.internals?.setFormValue(this.value || null)\n\t\t}\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\t// Combine all UI state streams\n\t\tcombineLatest([\n\t\t\tthis.chipHover$,\n\t\t\tthis.removeHover$,\n\t\t\tthis.focused$,\n\t\t\tthis.pressed$\n\t\t]).pipe(\n\t\t\tmap(([chipHover, removeHover, focused, pressed]) => ({\n\t\t\t\tchipHover,\n\t\t\t\tremoveHover,\n\t\t\t\tfocused,\n\t\t\t\tpressed\n\t\t\t})),\n\t\t\ttap(state => {\n\t\t\t\tthis.uiState = state\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting)\n\t\t).subscribe()\n\t}\n\n\tprivate handleChipClick = (e: MouseEvent) => {\n\t\tif (this.disabled) return\n\n\t\t// Add ripple effect\n\t\tconst chip = this.shadowRoot?.querySelector('.chip-container') as HTMLElement\n\t\tif (chip) {\n\t\t\tconst rect = chip.getBoundingClientRect()\n\t\t\tconst x = e.clientX - rect.left\n\t\t\tconst y = e.clientY - rect.top\n\t\t\tconst id = this.nextRippleId++\n\n\t\t\tthis.ripples = [...this.ripples, { x, y, id }]\n\n\t\t\t// Remove ripple after animation\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.ripples = this.ripples.filter(r => r.id !== id)\n\t\t\t}, 600)\n\t\t}\n\n\t\t// Dispatch optional click event (for custom handling if needed)\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('click', {\n\t\t\t\tdetail: { value: this.value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t)\n\t}\n\n\tprivate handleRemove = (e: Event) => {\n\t\tif (this.disabled) return\n\n\t\te.stopPropagation()\n\n\t\t// Dispatch remove event\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('remove', {\n\t\t\t\tdetail: { value: this.value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t)\n\t}\n\n\tprivate handleKeyDown = (e: KeyboardEvent) => {\n\t\tif (this.disabled) return\n\n\t\t// Delete or Backspace removes the chip\n\t\tif ((e.key === 'Delete' || e.key === 'Backspace') && this.removable) {\n\t\t\te.preventDefault()\n\t\t\tthis.handleRemove(e)\n\t\t}\n\t\t// Enter can optionally trigger click\n\t\telse if (e.key === 'Enter') {\n\t\t\te.preventDefault()\n\t\t\tconst clickEvent = new MouseEvent('click', {\n\t\t\t\tbubbles: true,\n\t\t\t\tcancelable: true,\n\t\t\t\tclientX: 0,\n\t\t\t\tclientY: 0\n\t\t\t})\n\t\t\tthis.handleChipClick(clickEvent)\n\t\t}\n\t}\n\n\tprivate handleFocus = () => {\n\t\tthis.focused$.next(true)\n\t}\n\n\tprivate handleBlur = () => {\n\t\tthis.focused$.next(false)\n\t}\n\n\tprotected render(): unknown {\n\t\tconst hasLeadingIcon = this.avatar || this.icon;\n\n\t\tconst chipClasses = {\n\t\t\t'chip-container': true,\n\t\t\t'inline-flex': true,\n\t\t\t'items-center': true,\n\t\t\t'gap-2': true,\n\t\t\t'h-8': true, // M3: 32px height\n\t\t\t'min-h-[32px]': true,\n\t\t\t'rounded-full': true,\n\t\t\t'cursor-default': true,\n\t\t\t'transition-all': true,\n\t\t\t'duration-200': true,\n\t\t\t'select-none': true,\n\t\t\t'text-sm': true, // M3: 14px Label Large\n\t\t\t'font-medium': true, // M3: 500 weight\n\t\t\t'relative': true,\n\t\t\t'overflow-hidden': true,\n\t\t\t'border': true,\n\n\t\t\t// M3 Padding: 8px with icon, 16px without (leading), 8px with trailing icon\n\t\t\t'pl-2': hasLeadingIcon, // 8px with avatar/icon\n\t\t\t'pl-4': !hasLeadingIcon, // 16px without\n\t\t\t'pr-2': this.removable, // 8px with remove button\n\t\t\t'pr-4': !this.removable, // 16px without\n\n\t\t\t// M3 Colors for input chips\n\t\t\t'bg-surface-containerLow': true,\n\t\t\t'text-surface-onVariant': true,\n\t\t\t'border-outline': true,\n\t\t\t'border-solid':true,\n\t\t\t// Input chips are flat (no elevation) per M3\n\n\t\t\t// Focus-visible state\n\t\t\t'focus-visible:outline': !this.disabled,\n\t\t\t'focus-visible:outline-2': !this.disabled,\n\t\t\t'focus-visible:outline-primary': !this.disabled,\n\t\t\t'focus-visible:outline-offset-2': !this.disabled,\n\n\t\t\t// Disabled state\n\t\t\t'opacity-38': this.disabled, // M3 disabled opacity\n\t\t\t'cursor-not-allowed': this.disabled\n\t\t}\n\n\t\tconst removeButtonClasses = {\n\t\t\t'size-[18px]': true, // M3: 18px icon size\n\t\t\t'flex': true,\n\t\t\t'items-center': true,\n\t\t\t'justify-center': true,\n\t\t\t'rounded-full': true,\n\t\t\t'transition-all': true,\n\t\t\t'duration-200': true,\n\t\t\t'cursor-pointer': !this.disabled,\n\t\t\t'-mr-1': true, // Adjust for visual balance\n\n\t\t\t// Hover state for remove button\n\t\t\t'hover:bg-surface-containerHighest': !this.disabled,\n\t\t\t'opacity-50': this.disabled\n\t\t}\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=${classMap(chipClasses)}\n\t\t\t\t@click=${this.handleChipClick}\n\t\t\t\t@keydown=${this.handleKeyDown}\n\t\t\t\t@mouseenter=${() => this.chipHover$.next(true)}\n\t\t\t\t@mouseleave=${() => this.chipHover$.next(false)}\n\t\t\t\t@mousedown=${() => this.pressed$.next(true)}\n\t\t\t\t@mouseup=${() => this.pressed$.next(false)}\n\t\t\t\t@focus=${this.handleFocus}\n\t\t\t\t@blur=${this.handleBlur}\n\t\t\t\trole=\"button\"\n\t\t\t\ttabindex=${this.disabled ? '-1' : '0'}\n\t\t\t\taria-disabled=${this.disabled}\n\t\t\t\taria-label=${this.value}\n\t\t\t>\n\t\t\t\t<!-- Avatar image (if provided) -->\n\t\t\t\t${this.avatar ? html`\n\t\t\t\t\t<img\n\t\t\t\t\t\tsrc=${this.avatar}\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tclass=\"avatar-img rounded-full size-5\"\n\t\t\t\t\t/>\n\t\t\t\t` : ''}\n\n\t\t\t\t<!-- Icon (if provided and no avatar) -->\n\t\t\t\t${this.icon && !this.avatar ? html`\n\t\t\t\t\t<span class=\"material-symbols-outlined text-[18px] shrink-0\">\n\t\t\t\t\t\t${this.icon}\n\t\t\t\t\t</span>\n\t\t\t\t` : ''}\n\n\t\t\t\t<!-- Chip content -->\n\t\t\t\t<span class=\"text-sm font-medium leading-5\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</span>\n\n\t\t\t\t<!-- Remove button (shown by default for input chips) -->\n\t\t\t\t${this.removable ? html`\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=${classMap(removeButtonClasses)}\n\t\t\t\t\t\t@click=${this.handleRemove}\n\t\t\t\t\t\t@mouseenter=${() => this.removeHover$.next(true)}\n\t\t\t\t\t\t@mouseleave=${() => this.removeHover$.next(false)}\n\t\t\t\t\t\taria-label=\"Remove\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\t?disabled=${this.disabled}\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"material-symbols-outlined text-[18px]\">\n\t\t\t\t\t\t\tclose\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</button>\n\t\t\t\t` : ''}\n\n\t\t\t\t<!-- Ripple effects -->\n\t\t\t\t${this.ripples.map(ripple => html`\n\t\t\t\t\t<span\n\t\t\t\t\t\tclass=\"ripple\"\n\t\t\t\t\t\tstyle=\"left: ${ripple.x}px; top: ${ripple.y}px;\"\n\t\t\t\t\t></span>\n\t\t\t\t`)}\n\n\t\t\t\t<!-- State layer for M3 hover/focus/pressed states -->\n\t\t\t\t<div class=\"state-layer\"></div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-input-chip': SchmancyInputChip\n\t}\n}\n\nexport type InputChipClickEvent = { value: string }\nexport type InputChipRemoveEvent = { value: string }"],"mappings":"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"}

package/dist/{input-chip-QejNcRnS.js → input-chip-CI4__N8w.js}

@@ -1,10 +1,11 @@
-import { i as e, t } from "./tailwind.mixin-BCJOOX1_.js";
+import { t as e } from "./tailwind.mixin-DufHBjmb.js";
+import { t } from "./decorate-D_utPUsC.js";
 import { BehaviorSubject as n, combineLatest as r } from "rxjs";
 import { map as i, takeUntil as a, tap as o } from "rxjs/operators";
 import { classMap as s } from "lit/directives/class-map.js";
 import { customElement as c, property as l, state as u } from "lit/decorators.js";
 import { LitElement as d, css as f, html as p } from "lit";
-var m = class extends t(f`
+var m = class extends e(f`
 	:host {
 		display: inline-block;
 		outline: none;
@@ -151,6 +152,9 @@ var m = class extends t(f`
 	get form() {
 		return this.internals?.form;
 	}
+	updated(e) {
+		super.updated?.(e), e.has("value") && this.internals?.setFormValue(this.value || null);
+	}
 	connectedCallback() {
 		super.connectedCallback(), r([
 			this.chipHover$,
@@ -279,23 +283,23 @@ var m = class extends t(f`
 		`;
 	}
 };
-e([l({
+t([l({
 	type: String,
 	reflect: !0
-})], m.prototype, "value", void 0), e([l({
+})], m.prototype, "value", void 0), t([l({
 	type: String,
 	reflect: !0
-})], m.prototype, "icon", void 0), e([l({
+})], m.prototype, "icon", void 0), t([l({
 	type: String,
 	reflect: !0
-})], m.prototype, "avatar", void 0), e([l({
+})], m.prototype, "avatar", void 0), t([l({
 	type: Boolean,
 	reflect: !0
-})], m.prototype, "removable", void 0), e([l({
+})], m.prototype, "removable", void 0), t([l({
 	type: Boolean,
 	reflect: !0
-})], m.prototype, "disabled", void 0), e([l({
+})], m.prototype, "disabled", void 0), t([l({
 	type: Boolean,
 	reflect: !0
-})], m.prototype, "elevated", void 0), e([u()], m.prototype, "uiState", void 0), e([u()], m.prototype, "ripples", void 0), m = e([c("schmancy-input-chip")], m);
+})], m.prototype, "elevated", void 0), t([u()], m.prototype, "uiState", void 0), t([u()], m.prototype, "ripples", void 0), m = t([c("schmancy-input-chip")], m);
 export { m as t };

package/dist/input-chip-CI4__N8w.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-chip-CI4__N8w.js","names":[],"sources":["../src/chips/input-chip.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/tailwind.mixin'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { BehaviorSubject, combineLatest } from 'rxjs'\nimport { map, takeUntil, tap } from 'rxjs/operators'\n\n/**\n * Input chip component - represents user-provided information that can be removed.\n *\n * IMPORTANT: Per Material Design 3 specification, input chips do NOT have selected state.\n * They represent discrete pieces of user input (like entered tags, selections from lists, etc.)\n * that can only be removed, not toggled on/off.\n *\n * Use cases:\n * - Displaying selected recipients in an email\n * - Showing applied filters that can be removed\n * - Tags or keywords entered by the user\n * - Selected items from a multi-select dropdown\n *\n * @fires click - Optional click event on chip body (value)\n * @fires remove - Dispatched when remove button is clicked (value)\n *\n * @example\n * ```html\n * <schmancy-input-chip value=\"john@example.com\" avatar=\"/avatars/john.jpg\">\n *   John Doe\n * </schmancy-input-chip>\n * ```\n */\n@customElement('schmancy-input-chip')\nexport class SchmancyInputChip extends TailwindElement(css`\n\t:host {\n\t\tdisplay: inline-block;\n\t\toutline: none;\n\t\tmin-width:fit-content\n\n\t}\n\n\t:host([disabled]) {\n\t\tpointer-events: none;\n\t}\n\n\tbutton {\n\t\tfont-family: inherit;\n\t}\n\n\t.avatar-img {\n\t\twidth: 20px;\n\t\theight: 20px;\n\t\tobject-fit: cover;\n\t}\n\n\t/* Material Symbols font for icons */\n\t.material-symbols-outlined {\n\t\tfont-family: 'Material Symbols Outlined';\n\t\tfont-weight: normal;\n\t\tfont-style: normal;\n\t\tfont-size: 18px;\n\t\tline-height: 1;\n\t\tletter-spacing: normal;\n\t\ttext-transform: none;\n\t\tdisplay: inline-block;\n\t\twhite-space: nowrap;\n\t\tword-wrap: normal;\n\t\tdirection: ltr;\n\t\t-webkit-font-smoothing: antialiased;\n\t\ttext-rendering: optimizeLegibility;\n\t\t-moz-osx-font-smoothing: grayscale;\n\t\tfont-feature-settings: 'liga';\n\t\tvertical-align: middle;\n\t}\n\n\t.ripple {\n\t\tposition: absolute;\n\t\tborder-radius: 50%;\n\t\ttransform: scale(0);\n\t\tanimation: ripple 600ms linear;\n\t\tbackground-color: rgba(0, 0, 0, 0.08);\n\t\tpointer-events: none;\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\t/* State layer for M3 hover/focus/pressed states */\n\t.state-layer {\n\t\tposition: absolute;\n\t\tinset: 0;\n\t\tborder-radius: inherit;\n\t\tpointer-events: none;\n\t\tbackground-color: currentColor;\n\t\topacity: 0;\n\t\ttransition: opacity 200ms ease;\n\t}\n\n\t:host(:not([disabled])) .chip-container:hover .state-layer {\n\t\topacity: 0.08;\n\t}\n\n\t:host(:not([disabled])) .chip-container:focus-visible .state-layer {\n\t\topacity: 0.1;\n\t}\n\n\t:host(:not([disabled])) .chip-container:active .state-layer {\n\t\topacity: 0.1;\n\t}\n`) {\n\t/** Value identifier for the chip */\n\t@property({ type: String, reflect: true })\n\tvalue: string = ''\n\n\t/** Optional icon name (Material Symbols) */\n\t@property({ type: String, reflect: true })\n\ticon: string = ''\n\n\t/** Optional avatar image URL */\n\t@property({ type: String, reflect: true })\n\tavatar: string = ''\n\n\t/** Whether to show remove button (default true for input chips) */\n\t@property({ type: Boolean, reflect: true })\n\tremovable: boolean = true\n\n\t/** Disable the chip */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled: boolean = false\n\n\t/** Elevated style variant */\n\t@property({ type: Boolean, reflect: true })\n\televated: boolean = false\n\n\t// RxJS state streams\n\tprivate chipHover$ = new BehaviorSubject<boolean>(false)\n\tprivate removeHover$ = new BehaviorSubject<boolean>(false)\n\tprivate focused$ = new BehaviorSubject<boolean>(false)\n\tprivate pressed$ = new BehaviorSubject<boolean>(false)\n\n\t// UI state from combined streams\n\t@state()  uiState = {\n\t\tchipHover: false,\n\t\tremoveHover: false,\n\t\tfocused: false,\n\t\tpressed: false\n\t}\n\n\t// Ripple effects\n\t@state() private ripples: Array<{ x: number; y: number; id: number }> = []\n\tprivate nextRippleId = 0\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}\n\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tdelegatesFocus: true,\n\t}\n\n\tstatic formAssociated = true\n\tinternals: ElementInternals | undefined\n\tget form() {\n\t\treturn this.internals?.form\n\t}\n\n\tprotected updated(changed: Map<string, unknown>) {\n\t\tsuper.updated?.(changed)\n\t\tif (changed.has('value')) {\n\t\t\tthis.internals?.setFormValue(this.value || null)\n\t\t}\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\t// Combine all UI state streams\n\t\tcombineLatest([\n\t\t\tthis.chipHover$,\n\t\t\tthis.removeHover$,\n\t\t\tthis.focused$,\n\t\t\tthis.pressed$\n\t\t]).pipe(\n\t\t\tmap(([chipHover, removeHover, focused, pressed]) => ({\n\t\t\t\tchipHover,\n\t\t\t\tremoveHover,\n\t\t\t\tfocused,\n\t\t\t\tpressed\n\t\t\t})),\n\t\t\ttap(state => {\n\t\t\t\tthis.uiState = state\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting)\n\t\t).subscribe()\n\t}\n\n\tprivate handleChipClick = (e: MouseEvent) => {\n\t\tif (this.disabled) return\n\n\t\t// Add ripple effect\n\t\tconst chip = this.shadowRoot?.querySelector('.chip-container') as HTMLElement\n\t\tif (chip) {\n\t\t\tconst rect = chip.getBoundingClientRect()\n\t\t\tconst x = e.clientX - rect.left\n\t\t\tconst y = e.clientY - rect.top\n\t\t\tconst id = this.nextRippleId++\n\n\t\t\tthis.ripples = [...this.ripples, { x, y, id }]\n\n\t\t\t// Remove ripple after animation\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.ripples = this.ripples.filter(r => r.id !== id)\n\t\t\t}, 600)\n\t\t}\n\n\t\t// Dispatch optional click event (for custom handling if needed)\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('click', {\n\t\t\t\tdetail: { value: this.value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t)\n\t}\n\n\tprivate handleRemove = (e: Event) => {\n\t\tif (this.disabled) return\n\n\t\te.stopPropagation()\n\n\t\t// Dispatch remove event\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('remove', {\n\t\t\t\tdetail: { value: this.value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t)\n\t}\n\n\tprivate handleKeyDown = (e: KeyboardEvent) => {\n\t\tif (this.disabled) return\n\n\t\t// Delete or Backspace removes the chip\n\t\tif ((e.key === 'Delete' || e.key === 'Backspace') && this.removable) {\n\t\t\te.preventDefault()\n\t\t\tthis.handleRemove(e)\n\t\t}\n\t\t// Enter can optionally trigger click\n\t\telse if (e.key === 'Enter') {\n\t\t\te.preventDefault()\n\t\t\tconst clickEvent = new MouseEvent('click', {\n\t\t\t\tbubbles: true,\n\t\t\t\tcancelable: true,\n\t\t\t\tclientX: 0,\n\t\t\t\tclientY: 0\n\t\t\t})\n\t\t\tthis.handleChipClick(clickEvent)\n\t\t}\n\t}\n\n\tprivate handleFocus = () => {\n\t\tthis.focused$.next(true)\n\t}\n\n\tprivate handleBlur = () => {\n\t\tthis.focused$.next(false)\n\t}\n\n\tprotected render(): unknown {\n\t\tconst hasLeadingIcon = this.avatar || this.icon;\n\n\t\tconst chipClasses = {\n\t\t\t'chip-container': true,\n\t\t\t'inline-flex': true,\n\t\t\t'items-center': true,\n\t\t\t'gap-2': true,\n\t\t\t'h-8': true, // M3: 32px height\n\t\t\t'min-h-[32px]': true,\n\t\t\t'rounded-full': true,\n\t\t\t'cursor-default': true,\n\t\t\t'transition-all': true,\n\t\t\t'duration-200': true,\n\t\t\t'select-none': true,\n\t\t\t'text-sm': true, // M3: 14px Label Large\n\t\t\t'font-medium': true, // M3: 500 weight\n\t\t\t'relative': true,\n\t\t\t'overflow-hidden': true,\n\t\t\t'border': true,\n\n\t\t\t// M3 Padding: 8px with icon, 16px without (leading), 8px with trailing icon\n\t\t\t'pl-2': hasLeadingIcon, // 8px with avatar/icon\n\t\t\t'pl-4': !hasLeadingIcon, // 16px without\n\t\t\t'pr-2': this.removable, // 8px with remove button\n\t\t\t'pr-4': !this.removable, // 16px without\n\n\t\t\t// M3 Colors for input chips\n\t\t\t'bg-surface-containerLow': true,\n\t\t\t'text-surface-onVariant': true,\n\t\t\t'border-outline': true,\n\t\t\t'border-solid':true,\n\t\t\t// Input chips are flat (no elevation) per M3\n\n\t\t\t// Focus-visible state\n\t\t\t'focus-visible:outline': !this.disabled,\n\t\t\t'focus-visible:outline-2': !this.disabled,\n\t\t\t'focus-visible:outline-primary': !this.disabled,\n\t\t\t'focus-visible:outline-offset-2': !this.disabled,\n\n\t\t\t// Disabled state\n\t\t\t'opacity-38': this.disabled, // M3 disabled opacity\n\t\t\t'cursor-not-allowed': this.disabled\n\t\t}\n\n\t\tconst removeButtonClasses = {\n\t\t\t'size-[18px]': true, // M3: 18px icon size\n\t\t\t'flex': true,\n\t\t\t'items-center': true,\n\t\t\t'justify-center': true,\n\t\t\t'rounded-full': true,\n\t\t\t'transition-all': true,\n\t\t\t'duration-200': true,\n\t\t\t'cursor-pointer': !this.disabled,\n\t\t\t'-mr-1': true, // Adjust for visual balance\n\n\t\t\t// Hover state for remove button\n\t\t\t'hover:bg-surface-containerHighest': !this.disabled,\n\t\t\t'opacity-50': this.disabled\n\t\t}\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=${classMap(chipClasses)}\n\t\t\t\t@click=${this.handleChipClick}\n\t\t\t\t@keydown=${this.handleKeyDown}\n\t\t\t\t@mouseenter=${() => this.chipHover$.next(true)}\n\t\t\t\t@mouseleave=${() => this.chipHover$.next(false)}\n\t\t\t\t@mousedown=${() => this.pressed$.next(true)}\n\t\t\t\t@mouseup=${() => this.pressed$.next(false)}\n\t\t\t\t@focus=${this.handleFocus}\n\t\t\t\t@blur=${this.handleBlur}\n\t\t\t\trole=\"button\"\n\t\t\t\ttabindex=${this.disabled ? '-1' : '0'}\n\t\t\t\taria-disabled=${this.disabled}\n\t\t\t\taria-label=${this.value}\n\t\t\t>\n\t\t\t\t<!-- Avatar image (if provided) -->\n\t\t\t\t${this.avatar ? html`\n\t\t\t\t\t<img\n\t\t\t\t\t\tsrc=${this.avatar}\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tclass=\"avatar-img rounded-full size-5\"\n\t\t\t\t\t/>\n\t\t\t\t` : ''}\n\n\t\t\t\t<!-- Icon (if provided and no avatar) -->\n\t\t\t\t${this.icon && !this.avatar ? html`\n\t\t\t\t\t<span class=\"material-symbols-outlined text-[18px] shrink-0\">\n\t\t\t\t\t\t${this.icon}\n\t\t\t\t\t</span>\n\t\t\t\t` : ''}\n\n\t\t\t\t<!-- Chip content -->\n\t\t\t\t<span class=\"text-sm font-medium leading-5\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</span>\n\n\t\t\t\t<!-- Remove button (shown by default for input chips) -->\n\t\t\t\t${this.removable ? html`\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=${classMap(removeButtonClasses)}\n\t\t\t\t\t\t@click=${this.handleRemove}\n\t\t\t\t\t\t@mouseenter=${() => this.removeHover$.next(true)}\n\t\t\t\t\t\t@mouseleave=${() => this.removeHover$.next(false)}\n\t\t\t\t\t\taria-label=\"Remove\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\t?disabled=${this.disabled}\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"material-symbols-outlined text-[18px]\">\n\t\t\t\t\t\t\tclose\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</button>\n\t\t\t\t` : ''}\n\n\t\t\t\t<!-- Ripple effects -->\n\t\t\t\t${this.ripples.map(ripple => html`\n\t\t\t\t\t<span\n\t\t\t\t\t\tclass=\"ripple\"\n\t\t\t\t\t\tstyle=\"left: ${ripple.x}px; top: ${ripple.y}px;\"\n\t\t\t\t\t></span>\n\t\t\t\t`)}\n\n\t\t\t\t<!-- State layer for M3 hover/focus/pressed states -->\n\t\t\t\t<div class=\"state-layer\"></div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-input-chip': SchmancyInputChip\n\t}\n}\n\nexport type InputChipClickEvent = { value: string }\nexport type InputChipRemoveEvent = { value: string }"],"mappings":"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"}

package/dist/input.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./input-BiSrTcrR.cjs`);exports.SchmancyInput=e.n,Object.defineProperty(exports,`SchmancyInputCompat`,{enumerable:!0,get:function(){return e.t}});
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./input-DMjpf6V8.cjs`);exports.SchmancyInput=e.n,Object.defineProperty(exports,`SchmancyInputCompat`,{enumerable:!0,get:function(){return e.t}});

package/dist/input.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "./input-VaXHFrRn.js";
+import { n as e, t } from "./input-Ri72dn5t.js";
 export { e as SchmancyInput, t as SchmancyInputCompat };

package/dist/{intersection-CZpaIHeT.cjs.map → intersection-D1v1UCVv.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"intersection-CZpaIHeT.cjs","names":[],"sources":["../src/utils/intersection.ts"],"sourcesContent":["import { Observable } from 'rxjs'\n\nexport function intersection$(\n\telement: Element | Element[],\n\toptions = {\n\t\tthreshold: 0.5,\n\t},\n) {\n\treturn new Observable(subscriber => {\n\t\tconst observer = new IntersectionObserver(entries => {\n\t\t\tsubscriber.next(entries) // Emit the entries array\n\t\t}, options)\n\n\t\t// Observe each element\n\t\tArray.isArray(element) ? element.forEach(el => observer.observe(el)) : observer.observe(element)\n\n\t\t// Cleanup on unsubscription\n\t\treturn () => {\n\t\t\tobserver.disconnect()\n\t\t}\n\t})\n}\n"],"mappings":"sDAEA,SAAgB,EACf,EACA,EAAU,CACT,UAAW,GAAA,CAAA,CAGZ,OAAO,IAAI,EAAA,WAAW,GAAA,CACrB,IAAM,EAAW,IAAI,qBAAqB,GAAA,CACzC,EAAW,KAAK,EAAA,EACd,EAAA,CAMH,OAHA,MAAM,QAAQ,EAAA,CAAW,EAAQ,QAAQ,GAAM,EAAS,QAAQ,EAAA,CAAA,CAAO,EAAS,QAAQ,EAAA,KAGxF,CACC,EAAS,YAAA,GAAA,CAAA,OAAA,eAAA,QAAA,IAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,GAAA,CAAA"}
+{"version":3,"file":"intersection-D1v1UCVv.cjs","names":[],"sources":["../src/utils/intersection.ts"],"sourcesContent":["import { Observable } from 'rxjs'\n\nexport function intersection$(\n\telement: Element | Element[],\n\toptions = {\n\t\tthreshold: 0.5,\n\t},\n) {\n\treturn new Observable(subscriber => {\n\t\tconst observer = new IntersectionObserver(entries => {\n\t\t\tsubscriber.next(entries) // Emit the entries array\n\t\t}, options)\n\n\t\t// Observe each element\n\t\tArray.isArray(element) ? element.forEach(el => observer.observe(el)) : observer.observe(element)\n\n\t\t// Cleanup on unsubscription\n\t\treturn () => {\n\t\t\tobserver.disconnect()\n\t\t}\n\t})\n}\n"],"mappings":"sDAEA,SAAgB,EACf,EACA,EAAU,CACT,UAAW,GAAA,CAAA,CAGZ,OAAO,IAAI,EAAA,WAAW,GAAA,CACrB,IAAM,EAAW,IAAI,qBAAqB,GAAA,CACzC,EAAW,KAAK,EAAA,EACd,EAAA,CAMH,OAHA,MAAM,QAAQ,EAAA,CAAW,EAAQ,QAAQ,GAAM,EAAS,QAAQ,EAAA,CAAA,CAAO,EAAS,QAAQ,EAAA,KAGxF,CACC,EAAS,YAAA,GAAA,CAAA,OAAA,eAAA,QAAA,IAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,GAAA,CAAA"}

package/dist/{intersection-BPLpqYEd.js.map → intersection-LfEsy29T.js.map}

@@ -1 +1 @@
-{"version":3,"file":"intersection-BPLpqYEd.js","names":[],"sources":["../src/utils/intersection.ts"],"sourcesContent":["import { Observable } from 'rxjs'\n\nexport function intersection$(\n\telement: Element | Element[],\n\toptions = {\n\t\tthreshold: 0.5,\n\t},\n) {\n\treturn new Observable(subscriber => {\n\t\tconst observer = new IntersectionObserver(entries => {\n\t\t\tsubscriber.next(entries) // Emit the entries array\n\t\t}, options)\n\n\t\t// Observe each element\n\t\tArray.isArray(element) ? element.forEach(el => observer.observe(el)) : observer.observe(element)\n\n\t\t// Cleanup on unsubscription\n\t\treturn () => {\n\t\t\tobserver.disconnect()\n\t\t}\n\t})\n}\n"],"mappings":";AAEA,SAAgB,EACf,GACA,IAAU,EACT,WAAW,IAAA,EAAA;AAGZ,QAAO,IAAI,GAAW,MAAA;EACrB,IAAM,IAAW,IAAI,sBAAqB,MAAA;AACzC,KAAW,KAAK,EAAA;KACd,EAAA;AAMH,SAHA,MAAM,QAAQ,EAAA,GAAW,EAAQ,SAAQ,MAAM,EAAS,QAAQ,EAAA,CAAA,GAAO,EAAS,QAAQ,EAAA,QAGxF;AACC,KAAS,YAAA;;GAAA;;AAAA,SAAA"}
+{"version":3,"file":"intersection-LfEsy29T.js","names":[],"sources":["../src/utils/intersection.ts"],"sourcesContent":["import { Observable } from 'rxjs'\n\nexport function intersection$(\n\telement: Element | Element[],\n\toptions = {\n\t\tthreshold: 0.5,\n\t},\n) {\n\treturn new Observable(subscriber => {\n\t\tconst observer = new IntersectionObserver(entries => {\n\t\t\tsubscriber.next(entries) // Emit the entries array\n\t\t}, options)\n\n\t\t// Observe each element\n\t\tArray.isArray(element) ? element.forEach(el => observer.observe(el)) : observer.observe(element)\n\n\t\t// Cleanup on unsubscription\n\t\treturn () => {\n\t\t\tobserver.disconnect()\n\t\t}\n\t})\n}\n"],"mappings":";AAEA,SAAgB,EACf,GACA,IAAU,EACT,WAAW,IAAA,EAAA;AAGZ,QAAO,IAAI,GAAW,MAAA;EACrB,IAAM,IAAW,IAAI,sBAAqB,MAAA;AACzC,KAAW,KAAK,EAAA;KACd,EAAA;AAMH,SAHA,MAAM,QAAQ,EAAA,GAAW,EAAQ,SAAQ,MAAM,EAAS,QAAQ,EAAA,CAAA,GAAO,EAAS,QAAQ,EAAA,QAGxF;AACC,KAAS,YAAA;;GAAA;;AAAA,SAAA"}

package/dist/json.cjs

@@ -1,4 +1,4 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-BCfY8kxB.cjs`);const e=require(`./tailwind.mixin-BF1Huas7.cjs`);require(`./mixins.cjs`);const t=require(`./notification-CZFEhWxc.cjs`);let n=require(`lit/decorators.js`),r=require(`lit`),i=require(`lit/directives/unsafe-html.js`);var a=class extends e.t(r.css`:host { display: block }`){constructor(...e){super(...e),this.data={},this.highlightKeys=[],this.compact=!1}highlightChanges(e,t){let n=e;return t.forEach(e=>{let t=RegExp(`("${e}":\\s*)([^,\\n}]+)`,`g`);n=n.replace(t,(e,t,n)=>`${t}<span class="text-warning-default font-bold">${n}</span>`)}),n}async copyJSON(){try{await navigator.clipboard.writeText(JSON.stringify(this.data,null,2)),t.r.success(`JSON copied to clipboard`)}catch{t.r.error(`Failed to copy JSON`)}}render(){let e=JSON.stringify(this.data,null,this.compact?0:2),t=this.highlightKeys.length>0?this.highlightChanges(e,this.highlightKeys):e;return r.html`
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-BCfY8kxB.cjs`);const e=require(`./tailwind.mixin-Cpa-VnnX.cjs`),t=require(`./decorate-F9CuyeHg.cjs`);require(`./mixins.cjs`);const n=require(`./notification-DKVWYhqs.cjs`);let r=require(`lit/decorators.js`),i=require(`lit`),a=require(`lit/directives/unsafe-html.js`);var o=class extends e.t(i.css`:host { display: block }`){constructor(...e){super(...e),this.data={},this.highlightKeys=[],this.compact=!1}highlightChanges(e,t){let n=e;return t.forEach(e=>{let t=RegExp(`("${e}":\\s*)([^,\\n}]+)`,`g`);n=n.replace(t,(e,t,n)=>`${t}<span class="text-warning-default font-bold">${n}</span>`)}),n}async copyJSON(){try{await navigator.clipboard.writeText(JSON.stringify(this.data,null,2)),n.r.success(`JSON copied to clipboard`)}catch{n.r.error(`Failed to copy JSON`)}}render(){let e=JSON.stringify(this.data,null,this.compact?0:2),t=this.highlightKeys.length>0?this.highlightChanges(e,this.highlightKeys):e;return i.html`
 			<div
 				class="bg-surface-container rounded-lg p-2 font-mono overflow-auto cursor-pointer hover:bg-surface-container-high transition-colors"
 				@click=${this.copyJSON}
@@ -6,6 +6,6 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./ch
 				<div class="flex items-center justify-between mb-1">
 					<schmancy-icon size="12px" class="text-on-surface-variant">content_copy</schmancy-icon>
 				</div>
-				<pre class="text-[10px] leading-tight">${(0,i.unsafeHTML)(t)}</pre>
+				<pre class="text-[10px] leading-tight">${(0,a.unsafeHTML)(t)}</pre>
 			</div>
-		`}};e.i([(0,n.property)({type:Object})],a.prototype,`data`,void 0),e.i([(0,n.property)({type:Array})],a.prototype,`highlightKeys`,void 0),e.i([(0,n.property)({type:Boolean})],a.prototype,`compact`,void 0),a=e.i([(0,n.customElement)(`schmancy-json`)],a),Object.defineProperty(exports,`SchmancyJson`,{enumerable:!0,get:function(){return a}});
+		`}};t.t([(0,r.property)({type:Object})],o.prototype,`data`,void 0),t.t([(0,r.property)({type:Array})],o.prototype,`highlightKeys`,void 0),t.t([(0,r.property)({type:Boolean})],o.prototype,`compact`,void 0),o=t.t([(0,r.customElement)(`schmancy-json`)],o),Object.defineProperty(exports,`SchmancyJson`,{enumerable:!0,get:function(){return o}});

package/dist/json.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"json.cjs","names":[],"sources":["../src/json/json.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js'\nimport { $notify } from '@schmancy/notification'\n\n@customElement('schmancy-json')\nexport class SchmancyJson extends TailwindElement(css`:host { display: block }`) {\n\t@property({ type: Object }) data: Record<string, any> = {}\n\t@property({ type: Array }) highlightKeys: string[] = []\n\t@property({ type: Boolean }) compact = false\n\n\tprivate highlightChanges(json: string, changedKeys: string[]): string {\n\t\tlet highlighted = json\n\t\tchangedKeys.forEach(key => {\n\t\t\tconst regex = new RegExp(`(\"${key}\":\\\\s*)([^,\\\\n}]+)`, 'g')\n\t\t\thighlighted = highlighted.replace(regex, (_match, keyPart, valuePart) => {\n\t\t\t\treturn `${keyPart}<span class=\"text-warning-default font-bold\">${valuePart}</span>`\n\t\t\t})\n\t\t})\n\t\treturn highlighted\n\t}\n\n\tprivate async copyJSON() {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(JSON.stringify(this.data, null, 2))\n\t\t\t$notify.success('JSON copied to clipboard')\n\t\t} catch (error) {\n\t\t\t$notify.error('Failed to copy JSON')\n\t\t}\n\t}\n\n\trender() {\n\t\tconst jsonString = JSON.stringify(this.data, null, this.compact ? 0 : 2)\n\t\tconst highlighted = this.highlightKeys.length > 0 ? this.highlightChanges(jsonString, this.highlightKeys) : jsonString\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"bg-surface-container rounded-lg p-2 font-mono overflow-auto cursor-pointer hover:bg-surface-container-high transition-colors\"\n\t\t\t\t@click=${this.copyJSON}\n\t\t\t>\n\t\t\t\t<div class=\"flex items-center justify-between mb-1\">\n\t\t\t\t\t<schmancy-icon size=\"12px\" class=\"text-on-surface-variant\">content_copy</schmancy-icon>\n\t\t\t\t</div>\n\t\t\t\t<pre class=\"text-[10px] leading-tight\">${unsafeHTML(highlighted)}</pre>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-json': SchmancyJson\n\t}\n}\n"],"mappings":"0TAOO,IAAA,EAAA,cAA2B,EAAA,EAAgB,EAAA,GAAG,2BAAA,AAAA,CAAA,YAAA,GAAA,EAAA,CAAA,MAAA,GAAA,EAAA,CAAA,KAAA,KACI,EAAA,CAAA,KAAA,cACH,EAAA,CAAA,KAAA,QAAA,CACd,EAEvC,iBAAyB,EAAc,EAAA,CACtC,IAAI,EAAc,EAOlB,OANA,EAAY,QAAQ,GAAA,CACnB,IAAM,EAAY,OAAO,KAAK,EAAA,oBAAyB,IAAA,CACvD,EAAc,EAAY,QAAQ,GAAQ,EAAQ,EAAS,IACnD,GAAG,EAAA,+CAAuD,EAAA,SAAA,EAAA,CAG5D,EAGR,MAAA,UAAc,CACb,GAAA,CAAA,MACO,UAAU,UAAU,UAAU,KAAK,UAAU,KAAK,KAAM,KAAM,EAAA,CAAA,CACpE,EAAA,EAAQ,QAAQ,2BAAA,MACR,CACR,EAAA,EAAQ,MAAM,sBAAA,EAIhB,QAAA,CACC,IAAM,EAAa,KAAK,UAAU,KAAK,KAAM,KAAM,KAAK,QAAU,EAAI,EAAA,CAChE,EAAc,KAAK,cAAc,OAAS,EAAI,KAAK,iBAAiB,EAAY,KAAK,cAAA,CAAiB,EAE5G,MAAO,GAAA,IAAI;;;aAGA,KAAK,SAAA;;;;;8DAKsC,EAAA,CAAA;;0BApC7C,CAAE,KAAM,OAAA,CAAA,CAAA,CAAS,EAAA,UAAA,OAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UACjB,CAAE,KAAM,MAAA,CAAA,CAAA,CAAQ,EAAA,UAAA,gBAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAChB,CAAE,KAAM,QAAA,CAAA,CAAA,CAAU,EAAA,UAAA,UAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eAJd,gBAAA,CAAA,CAAgB,EAAA,CAAA,OAAA,eAAA,QAAA,eAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,GAAA,CAAA"}
+{"version":3,"file":"json.cjs","names":[],"sources":["../src/json/json.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js'\nimport { $notify } from '@schmancy/notification'\n\n@customElement('schmancy-json')\nexport class SchmancyJson extends TailwindElement(css`:host { display: block }`) {\n\t@property({ type: Object }) data: Record<string, any> = {}\n\t@property({ type: Array }) highlightKeys: string[] = []\n\t@property({ type: Boolean }) compact = false\n\n\tprivate highlightChanges(json: string, changedKeys: string[]): string {\n\t\tlet highlighted = json\n\t\tchangedKeys.forEach(key => {\n\t\t\tconst regex = new RegExp(`(\"${key}\":\\\\s*)([^,\\\\n}]+)`, 'g')\n\t\t\thighlighted = highlighted.replace(regex, (_match, keyPart, valuePart) => {\n\t\t\t\treturn `${keyPart}<span class=\"text-warning-default font-bold\">${valuePart}</span>`\n\t\t\t})\n\t\t})\n\t\treturn highlighted\n\t}\n\n\tprivate async copyJSON() {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(JSON.stringify(this.data, null, 2))\n\t\t\t$notify.success('JSON copied to clipboard')\n\t\t} catch (error) {\n\t\t\t$notify.error('Failed to copy JSON')\n\t\t}\n\t}\n\n\trender() {\n\t\tconst jsonString = JSON.stringify(this.data, null, this.compact ? 0 : 2)\n\t\tconst highlighted = this.highlightKeys.length > 0 ? this.highlightChanges(jsonString, this.highlightKeys) : jsonString\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"bg-surface-container rounded-lg p-2 font-mono overflow-auto cursor-pointer hover:bg-surface-container-high transition-colors\"\n\t\t\t\t@click=${this.copyJSON}\n\t\t\t>\n\t\t\t\t<div class=\"flex items-center justify-between mb-1\">\n\t\t\t\t\t<schmancy-icon size=\"12px\" class=\"text-on-surface-variant\">content_copy</schmancy-icon>\n\t\t\t\t</div>\n\t\t\t\t<pre class=\"text-[10px] leading-tight\">${unsafeHTML(highlighted)}</pre>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-json': SchmancyJson\n\t}\n}\n"],"mappings":"+VAOO,IAAA,EAAA,cAA2B,EAAA,EAAgB,EAAA,GAAG,2BAAA,AAAA,CAAA,YAAA,GAAA,EAAA,CAAA,MAAA,GAAA,EAAA,CAAA,KAAA,KACI,EAAA,CAAA,KAAA,cACH,EAAA,CAAA,KAAA,QAAA,CACd,EAEvC,iBAAyB,EAAc,EAAA,CACtC,IAAI,EAAc,EAOlB,OANA,EAAY,QAAQ,GAAA,CACnB,IAAM,EAAY,OAAO,KAAK,EAAA,oBAAyB,IAAA,CACvD,EAAc,EAAY,QAAQ,GAAQ,EAAQ,EAAS,IACnD,GAAG,EAAA,+CAAuD,EAAA,SAAA,EAAA,CAG5D,EAGR,MAAA,UAAc,CACb,GAAA,CAAA,MACO,UAAU,UAAU,UAAU,KAAK,UAAU,KAAK,KAAM,KAAM,EAAA,CAAA,CACpE,EAAA,EAAQ,QAAQ,2BAAA,MACR,CACR,EAAA,EAAQ,MAAM,sBAAA,EAIhB,QAAA,CACC,IAAM,EAAa,KAAK,UAAU,KAAK,KAAM,KAAM,KAAK,QAAU,EAAI,EAAA,CAChE,EAAc,KAAK,cAAc,OAAS,EAAI,KAAK,iBAAiB,EAAY,KAAK,cAAA,CAAiB,EAE5G,MAAO,GAAA,IAAI;;;aAGA,KAAK,SAAA;;;;;8DAKsC,EAAA,CAAA;;0BApC7C,CAAE,KAAM,OAAA,CAAA,CAAA,CAAS,EAAA,UAAA,OAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UACjB,CAAE,KAAM,MAAA,CAAA,CAAA,CAAQ,EAAA,UAAA,gBAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAChB,CAAE,KAAM,QAAA,CAAA,CAAA,CAAU,EAAA,UAAA,UAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eAJd,gBAAA,CAAA,CAAgB,EAAA,CAAA,OAAA,eAAA,QAAA,eAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,GAAA,CAAA"}

package/dist/json.js

@@ -1,10 +1,11 @@
-import { i as e, t } from "./tailwind.mixin-BCJOOX1_.js";
+import { t as e } from "./tailwind.mixin-DufHBjmb.js";
+import { t } from "./decorate-D_utPUsC.js";
 import "./mixins.js";
-import { r as n } from "./notification-BnBgxjF-.js";
+import { r as n } from "./notification-DGpv8g2H.js";
 import { customElement as r, property as i } from "lit/decorators.js";
 import { css as a, html as o } from "lit";
 import { unsafeHTML as s } from "lit/directives/unsafe-html.js";
-var c = class extends t(a`:host { display: block }`) {
+var c = class extends e(a`:host { display: block }`) {
 	constructor(...e) {
 		super(...e), this.data = {}, this.highlightKeys = [], this.compact = !1;
 	}
@@ -37,5 +38,5 @@ var c = class extends t(a`:host { display: block }`) {
 		`;
 	}
 };
-e([i({ type: Object })], c.prototype, "data", void 0), e([i({ type: Array })], c.prototype, "highlightKeys", void 0), e([i({ type: Boolean })], c.prototype, "compact", void 0), c = e([r("schmancy-json")], c);
+t([i({ type: Object })], c.prototype, "data", void 0), t([i({ type: Array })], c.prototype, "highlightKeys", void 0), t([i({ type: Boolean })], c.prototype, "compact", void 0), c = t([r("schmancy-json")], c);
 export { c as SchmancyJson };

package/dist/json.js.map

@@ -1 +1 @@
-{"version":3,"file":"json.js","names":[],"sources":["../src/json/json.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js'\nimport { $notify } from '@schmancy/notification'\n\n@customElement('schmancy-json')\nexport class SchmancyJson extends TailwindElement(css`:host { display: block }`) {\n\t@property({ type: Object }) data: Record<string, any> = {}\n\t@property({ type: Array }) highlightKeys: string[] = []\n\t@property({ type: Boolean }) compact = false\n\n\tprivate highlightChanges(json: string, changedKeys: string[]): string {\n\t\tlet highlighted = json\n\t\tchangedKeys.forEach(key => {\n\t\t\tconst regex = new RegExp(`(\"${key}\":\\\\s*)([^,\\\\n}]+)`, 'g')\n\t\t\thighlighted = highlighted.replace(regex, (_match, keyPart, valuePart) => {\n\t\t\t\treturn `${keyPart}<span class=\"text-warning-default font-bold\">${valuePart}</span>`\n\t\t\t})\n\t\t})\n\t\treturn highlighted\n\t}\n\n\tprivate async copyJSON() {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(JSON.stringify(this.data, null, 2))\n\t\t\t$notify.success('JSON copied to clipboard')\n\t\t} catch (error) {\n\t\t\t$notify.error('Failed to copy JSON')\n\t\t}\n\t}\n\n\trender() {\n\t\tconst jsonString = JSON.stringify(this.data, null, this.compact ? 0 : 2)\n\t\tconst highlighted = this.highlightKeys.length > 0 ? this.highlightChanges(jsonString, this.highlightKeys) : jsonString\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"bg-surface-container rounded-lg p-2 font-mono overflow-auto cursor-pointer hover:bg-surface-container-high transition-colors\"\n\t\t\t\t@click=${this.copyJSON}\n\t\t\t>\n\t\t\t\t<div class=\"flex items-center justify-between mb-1\">\n\t\t\t\t\t<schmancy-icon size=\"12px\" class=\"text-on-surface-variant\">content_copy</schmancy-icon>\n\t\t\t\t</div>\n\t\t\t\t<pre class=\"text-[10px] leading-tight\">${unsafeHTML(highlighted)}</pre>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-json': SchmancyJson\n\t}\n}\n"],"mappings":";;;;;;AAOO,IAAA,IAAA,cAA2B,EAAgB,CAAG,2BAAA,CAAA;CAAA,YAAA,GAAA,GAAA;AAAA,QAAA,GAAA,EAAA,EAAA,KAAA,OACI,EAAA,EAAA,KAAA,gBACH,EAAA,EAAA,KAAA,UAAA,CACd;;CAEvC,iBAAyB,GAAc,GAAA;EACtC,IAAI,IAAc;AAOlB,SANA,EAAY,SAAQ,MAAA;GACnB,IAAM,IAAY,OAAO,KAAK,EAAA,qBAAyB,IAAA;AACvD,OAAc,EAAY,QAAQ,IAAQ,GAAQ,GAAS,MACnD,GAAG,EAAA,+CAAuD,EAAA,SAAA;IAAA,EAG5D;;CAGR,MAAA,WAAc;AACb,MAAA;AAAA,SACO,UAAU,UAAU,UAAU,KAAK,UAAU,KAAK,MAAM,MAAM,EAAA,CAAA,EACpE,EAAQ,QAAQ,2BAAA;UACR;AACR,KAAQ,MAAM,sBAAA;;;CAIhB,SAAA;EACC,IAAM,IAAa,KAAK,UAAU,KAAK,MAAM,MAAM,KAAK,UAAU,IAAI,EAAA,EAChE,IAAc,KAAK,cAAc,SAAS,IAAI,KAAK,iBAAiB,GAAY,KAAK,cAAA,GAAiB;AAE5G,SAAO,CAAI;;;aAGA,KAAK,SAAA;;;;;6CAK2B,EAAW,EAAA,CAAA;;;;;GApCtD,EAAS,EAAE,MAAM,QAAA,CAAA,CAAA,EAAS,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAC1B,EAAS,EAAE,MAAM,OAAA,CAAA,CAAA,EAAQ,EAAA,WAAA,iBAAA,KAAA,EAAA,EAAA,EAAA,CACzB,EAAS,EAAE,MAAM,SAAA,CAAA,CAAA,EAAU,EAAA,WAAA,WAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CAJ5B,EAAc,gBAAA,CAAA,EAAgB,EAAA;AAAA,SAAA,KAAA"}
+{"version":3,"file":"json.js","names":[],"sources":["../src/json/json.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js'\nimport { $notify } from '@schmancy/notification'\n\n@customElement('schmancy-json')\nexport class SchmancyJson extends TailwindElement(css`:host { display: block }`) {\n\t@property({ type: Object }) data: Record<string, any> = {}\n\t@property({ type: Array }) highlightKeys: string[] = []\n\t@property({ type: Boolean }) compact = false\n\n\tprivate highlightChanges(json: string, changedKeys: string[]): string {\n\t\tlet highlighted = json\n\t\tchangedKeys.forEach(key => {\n\t\t\tconst regex = new RegExp(`(\"${key}\":\\\\s*)([^,\\\\n}]+)`, 'g')\n\t\t\thighlighted = highlighted.replace(regex, (_match, keyPart, valuePart) => {\n\t\t\t\treturn `${keyPart}<span class=\"text-warning-default font-bold\">${valuePart}</span>`\n\t\t\t})\n\t\t})\n\t\treturn highlighted\n\t}\n\n\tprivate async copyJSON() {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(JSON.stringify(this.data, null, 2))\n\t\t\t$notify.success('JSON copied to clipboard')\n\t\t} catch (error) {\n\t\t\t$notify.error('Failed to copy JSON')\n\t\t}\n\t}\n\n\trender() {\n\t\tconst jsonString = JSON.stringify(this.data, null, this.compact ? 0 : 2)\n\t\tconst highlighted = this.highlightKeys.length > 0 ? this.highlightChanges(jsonString, this.highlightKeys) : jsonString\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"bg-surface-container rounded-lg p-2 font-mono overflow-auto cursor-pointer hover:bg-surface-container-high transition-colors\"\n\t\t\t\t@click=${this.copyJSON}\n\t\t\t>\n\t\t\t\t<div class=\"flex items-center justify-between mb-1\">\n\t\t\t\t\t<schmancy-icon size=\"12px\" class=\"text-on-surface-variant\">content_copy</schmancy-icon>\n\t\t\t\t</div>\n\t\t\t\t<pre class=\"text-[10px] leading-tight\">${unsafeHTML(highlighted)}</pre>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-json': SchmancyJson\n\t}\n}\n"],"mappings":";;;;;;;AAOO,IAAA,IAAA,cAA2B,EAAgB,CAAG,2BAAA,CAAA;CAAA,YAAA,GAAA,GAAA;AAAA,QAAA,GAAA,EAAA,EAAA,KAAA,OACI,EAAA,EAAA,KAAA,gBACH,EAAA,EAAA,KAAA,UAAA,CACd;;CAEvC,iBAAyB,GAAc,GAAA;EACtC,IAAI,IAAc;AAOlB,SANA,EAAY,SAAQ,MAAA;GACnB,IAAM,IAAY,OAAO,KAAK,EAAA,qBAAyB,IAAA;AACvD,OAAc,EAAY,QAAQ,IAAQ,GAAQ,GAAS,MACnD,GAAG,EAAA,+CAAuD,EAAA,SAAA;IAAA,EAG5D;;CAGR,MAAA,WAAc;AACb,MAAA;AAAA,SACO,UAAU,UAAU,UAAU,KAAK,UAAU,KAAK,MAAM,MAAM,EAAA,CAAA,EACpE,EAAQ,QAAQ,2BAAA;UACR;AACR,KAAQ,MAAM,sBAAA;;;CAIhB,SAAA;EACC,IAAM,IAAa,KAAK,UAAU,KAAK,MAAM,MAAM,KAAK,UAAU,IAAI,EAAA,EAChE,IAAc,KAAK,cAAc,SAAS,IAAI,KAAK,iBAAiB,GAAY,KAAK,cAAA,GAAiB;AAE5G,SAAO,CAAI;;;aAGA,KAAK,SAAA;;;;;6CAK2B,EAAW,EAAA,CAAA;;;;;GApCtD,EAAS,EAAE,MAAM,QAAA,CAAA,CAAA,EAAS,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAC1B,EAAS,EAAE,MAAM,OAAA,CAAA,CAAA,EAAQ,EAAA,WAAA,iBAAA,KAAA,EAAA,EAAA,EAAA,CACzB,EAAS,EAAE,MAAM,SAAA,CAAA,CAAA,EAAU,EAAA,WAAA,WAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CAJ5B,EAAc,gBAAA,CAAA,EAAgB,EAAA;AAAA,SAAA,KAAA"}

package/dist/kbd.cjs

@@ -0,0 +1,28 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-BCfY8kxB.cjs`);const e=require(`./tailwind.mixin-Cpa-VnnX.cjs`),t=require(`./decorate-F9CuyeHg.cjs`);require(`./mixins.cjs`);let n=require(`lit/decorators.js`),r=require(`lit`);var i=class extends e.t(r.css`
+	:host {
+		display: inline-block;
+		vertical-align: middle;
+	}
+	kbd {
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		min-width: var(--_ksize, 1.5rem);
+		height: var(--_ksize, 1.5rem);
+		padding: 0 0.375rem;
+		font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+		font-size: var(--_kfont, 0.75rem);
+		font-weight: 500;
+		line-height: 1;
+		color: var(--schmancy-sys-color-surface-on, #1d1b20);
+		background: var(--schmancy-sys-color-surface-container, #f3f0f7);
+		border: 1px solid var(--schmancy-sys-color-outline-variant, #cac4d0);
+		border-radius: 0.375rem;
+		box-shadow: inset 0 -1px 0 var(--schmancy-sys-color-outline-variant, #cac4d0);
+		white-space: nowrap;
+	}
+	:host([size='sm']) kbd {
+		--_ksize: 1.25rem;
+		--_kfont: 0.6875rem;
+	}
+`){constructor(...e){super(...e),this.size=`md`}render(){return r.html`<kbd part="base"><slot></slot></kbd>`}};t.t([(0,n.property)({type:String,reflect:!0})],i.prototype,`size`,void 0),i=t.t([(0,n.customElement)(`schmancy-kbd`)],i),Object.defineProperty(exports,`SchmancyKbd`,{enumerable:!0,get:function(){return i}});

package/dist/kbd.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"kbd.cjs","names":[],"sources":["../src/kbd/kbd.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * Renders a keyboard shortcut hint (e.g. `⌘ K`, `Ctrl+C`). Semantically a\n * `<kbd>` element for screen readers; visually styled as a pressed key.\n *\n * Compose multiple instances for combinations:\n * ```html\n * <schmancy-kbd>⌘</schmancy-kbd> + <schmancy-kbd>K</schmancy-kbd>\n * ```\n *\n * @element schmancy-kbd\n * @slot - The key label (e.g. `⌘`, `Shift`, `K`).\n * @attr size - 'sm' | 'md'. Default 'md'.\n * @csspart base - The inner native `<kbd>` element.\n */\n@customElement('schmancy-kbd')\nexport class SchmancyKbd extends TailwindElement(css`\n\t:host {\n\t\tdisplay: inline-block;\n\t\tvertical-align: middle;\n\t}\n\tkbd {\n\t\tdisplay: inline-flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tmin-width: var(--_ksize, 1.5rem);\n\t\theight: var(--_ksize, 1.5rem);\n\t\tpadding: 0 0.375rem;\n\t\tfont-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n\t\tfont-size: var(--_kfont, 0.75rem);\n\t\tfont-weight: 500;\n\t\tline-height: 1;\n\t\tcolor: var(--schmancy-sys-color-surface-on, #1d1b20);\n\t\tbackground: var(--schmancy-sys-color-surface-container, #f3f0f7);\n\t\tborder: 1px solid var(--schmancy-sys-color-outline-variant, #cac4d0);\n\t\tborder-radius: 0.375rem;\n\t\tbox-shadow: inset 0 -1px 0 var(--schmancy-sys-color-outline-variant, #cac4d0);\n\t\twhite-space: nowrap;\n\t}\n\t:host([size='sm']) kbd {\n\t\t--_ksize: 1.25rem;\n\t\t--_kfont: 0.6875rem;\n\t}\n`) {\n\t@property({ type: String, reflect: true }) size: 'sm' | 'md' = 'md'\n\n\trender() {\n\t\treturn html`<kbd part=\"base\"><slot></slot></kbd>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-kbd': SchmancyKbd\n\t}\n}\n"],"mappings":"qQAmBO,IAAA,EAAA,cAA0B,EAAA,EAAgB,EAAA,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;2CA4BY,KAE/D,QAAA,CACC,MAAO,GAAA,IAAI,yCAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAHF,CAAE,KAAM,OAAQ,QAAA,CAAS,EAAA,CAAA,CAAA,CAAO,EAAA,UAAA,OAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eA7B5B,eAAA,CAAA,CAAe,EAAA,CAAA,OAAA,eAAA,QAAA,cAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,GAAA,CAAA"}

package/dist/kbd.js

@@ -0,0 +1,45 @@
+import { t as e } from "./tailwind.mixin-DufHBjmb.js";
+import { t } from "./decorate-D_utPUsC.js";
+import "./mixins.js";
+import { customElement as n, property as r } from "lit/decorators.js";
+import { css as i, html as a } from "lit";
+var o = class extends e(i`
+	:host {
+		display: inline-block;
+		vertical-align: middle;
+	}
+	kbd {
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		min-width: var(--_ksize, 1.5rem);
+		height: var(--_ksize, 1.5rem);
+		padding: 0 0.375rem;
+		font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+		font-size: var(--_kfont, 0.75rem);
+		font-weight: 500;
+		line-height: 1;
+		color: var(--schmancy-sys-color-surface-on, #1d1b20);
+		background: var(--schmancy-sys-color-surface-container, #f3f0f7);
+		border: 1px solid var(--schmancy-sys-color-outline-variant, #cac4d0);
+		border-radius: 0.375rem;
+		box-shadow: inset 0 -1px 0 var(--schmancy-sys-color-outline-variant, #cac4d0);
+		white-space: nowrap;
+	}
+	:host([size='sm']) kbd {
+		--_ksize: 1.25rem;
+		--_kfont: 0.6875rem;
+	}
+`) {
+	constructor(...e) {
+		super(...e), this.size = "md";
+	}
+	render() {
+		return a`<kbd part="base"><slot></slot></kbd>`;
+	}
+};
+t([r({
+	type: String,
+	reflect: !0
+})], o.prototype, "size", void 0), o = t([n("schmancy-kbd")], o);
+export { o as SchmancyKbd };

package/dist/kbd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kbd.js","names":[],"sources":["../src/kbd/kbd.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * Renders a keyboard shortcut hint (e.g. `⌘ K`, `Ctrl+C`). Semantically a\n * `<kbd>` element for screen readers; visually styled as a pressed key.\n *\n * Compose multiple instances for combinations:\n * ```html\n * <schmancy-kbd>⌘</schmancy-kbd> + <schmancy-kbd>K</schmancy-kbd>\n * ```\n *\n * @element schmancy-kbd\n * @slot - The key label (e.g. `⌘`, `Shift`, `K`).\n * @attr size - 'sm' | 'md'. Default 'md'.\n * @csspart base - The inner native `<kbd>` element.\n */\n@customElement('schmancy-kbd')\nexport class SchmancyKbd extends TailwindElement(css`\n\t:host {\n\t\tdisplay: inline-block;\n\t\tvertical-align: middle;\n\t}\n\tkbd {\n\t\tdisplay: inline-flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tmin-width: var(--_ksize, 1.5rem);\n\t\theight: var(--_ksize, 1.5rem);\n\t\tpadding: 0 0.375rem;\n\t\tfont-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n\t\tfont-size: var(--_kfont, 0.75rem);\n\t\tfont-weight: 500;\n\t\tline-height: 1;\n\t\tcolor: var(--schmancy-sys-color-surface-on, #1d1b20);\n\t\tbackground: var(--schmancy-sys-color-surface-container, #f3f0f7);\n\t\tborder: 1px solid var(--schmancy-sys-color-outline-variant, #cac4d0);\n\t\tborder-radius: 0.375rem;\n\t\tbox-shadow: inset 0 -1px 0 var(--schmancy-sys-color-outline-variant, #cac4d0);\n\t\twhite-space: nowrap;\n\t}\n\t:host([size='sm']) kbd {\n\t\t--_ksize: 1.25rem;\n\t\t--_kfont: 0.6875rem;\n\t}\n`) {\n\t@property({ type: String, reflect: true }) size: 'sm' | 'md' = 'md'\n\n\trender() {\n\t\treturn html`<kbd part=\"base\"><slot></slot></kbd>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-kbd': SchmancyKbd\n\t}\n}\n"],"mappings":";;;;;AAmBO,IAAA,IAAA,cAA0B,EAAgB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BA4BY;;CAE/D,SAAA;AACC,SAAO,CAAI;;;AAAA,EAAA,CAHX,EAAS;CAAE,MAAM;CAAQ,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CA7B1C,EAAc,eAAA,CAAA,EAAe,EAAA;AAAA,SAAA,KAAA"}

package/dist/{layout-yxSlLybo.js → layout-BE2ld1IY.js}

@@ -1,4 +1,4 @@
-import { n as e } from "./theme.service-D9lEas89.js";
+import { n as e } from "./theme.service-_qP5WvB9.js";
 import { EMPTY as t, Observable as n, Subject as r, combineLatest as i, fromEvent as a, merge as o, timer as s } from "rxjs";
 import { debounceTime as c, distinctUntilChanged as l, filter as u, map as d, startWith as f, switchMap as p, takeUntil as m, tap as h } from "rxjs/operators";
 import { AsyncDirective as g } from "lit/async-directive.js";

package/dist/{layout-yxSlLybo.js.map → layout-BE2ld1IY.js.map}

@@ -1 +1 @@
-{"version":3,"file":"layout-yxSlLybo.js","names":[],"sources":["../src/directives/layout.ts"],"sourcesContent":["import { directive, ElementPart, PartType } from 'lit/directive.js'\nimport { AsyncDirective } from 'lit/async-directive.js'\nimport { Subject, fromEvent, merge, Observable, EMPTY, timer, combineLatest } from 'rxjs'\nimport { debounceTime, switchMap, takeUntil, distinctUntilChanged, map, tap, startWith, filter } from 'rxjs/operators'\n\n/** Returns true if user is pinch-zoomed (scale !== 1) */\nfunction isZoomed(): boolean {\n\tconst vv = window.visualViewport\n\treturn vv ? Math.abs(vv.scale - 1) > 0.01 : false\n}\nimport { theme } from '../theme/theme.service'\n\n// Shared global update stream (lazy-initialized, cleaned up when no elements use it)\nlet update$: Subject<void> | null = null\nlet updateSub: { unsubscribe: () => void } | null = null\nlet elementCount = 0\n\nfunction getUpdateStream(): Subject<void> {\n\tif (!update$) {\n\t\tupdate$ = new Subject<void>()\n\n\t\tconst windowResize$ = fromEvent(window, 'resize', { passive: true })\n\n\t\tconst viewportEvents$ = window.visualViewport\n\t\t\t? merge(\n\t\t\t\t\tfromEvent(window.visualViewport, 'resize', { passive: true }),\n\t\t\t\t\tfromEvent(window.visualViewport, 'scroll', { passive: true })\n\t\t\t\t)\n\t\t\t: windowResize$\n\n\t\tconst orientation$ = fromEvent(window, 'orientationchange')\n\n\t\t// iOS Safari: force recalc after keyboard dismissal\n\t\tconst focusOut$ = fromEvent(document, 'focusout', { passive: true }).pipe(\n\t\t\tswitchMap(() => timer(100))\n\t\t)\n\n\t\tupdateSub = merge(windowResize$, viewportEvents$, orientation$, focusOut$)\n\t\t\t.pipe(debounceTime(16))\n\t\t\t.subscribe(() => update$!.next())\n\t}\n\treturn update$\n}\n\nfunction cleanup() {\n\tif (elementCount === 0 && updateSub) {\n\t\tupdateSub.unsubscribe()\n\t\tupdateSub = null\n\t\tupdate$ = null\n\t}\n}\n\n\n/**\n * RxJS wrapper for ResizeObserver - auto-cleans on unsubscribe\n */\nexport function fromResizeObserver(element: Element): Observable<ResizeObserverEntry[]> {\n\treturn new Observable(subscriber => {\n\t\tconst observer = new ResizeObserver(entries => subscriber.next(entries))\n\t\tobserver.observe(element)\n\t\treturn () => observer.disconnect()\n\t})\n}\n\n/**\n * fullHeight directive - fills remaining viewport space\n *\n * Reactive sources:\n * - Parent ResizeObserver (layout shifts)\n * - Window resize / visualViewport (viewport changes)\n * - Orientation change (device rotation)\n * - Focus out (mobile keyboard dismiss)\n * - Theme fullscreen toggle\n *\n * Performance:\n * - distinctUntilChanged prevents redundant style writes\n * - debounceTime(16) batches rapid events (~60fps)\n * - Single shared stream for global events\n */\nclass FullHeight extends AsyncDirective {\n\tprivate element: HTMLElement | null = null\n\tprivate disconnecting$ = new Subject<void>()\n\n\tprivate calculateHeight(): number {\n\t\tif (!this.element) return 0\n\t\tconst viewportHeight = window.visualViewport?.height ?? window.innerHeight\n\t\tconst topOffset = this.element.getBoundingClientRect().top\n\t\treturn Math.max(0, viewportHeight - topOffset)\n\t}\n\n\tprivate applyStyles(height: number, bottomPadding: number) {\n\t\tif (this.element) {\n\t\t\tthis.element.style.boxSizing = 'border-box'\n\t\t\tthis.element.style.height = `${height}px`\n\t\t\tthis.element.style.paddingBottom = `${bottomPadding}px`\n\t\t}\n\t}\n\n\tprivate setupHeightStream() {\n\t\tif (!this.element) return\n\n\t\tconst element = this.element\n\n\t\t// Parent resize detects layout shifts (e.g., header rendering after load)\n\t\tconst parentResize$ = element.parentElement\n\t\t\t? fromResizeObserver(element.parentElement)\n\t\t\t: EMPTY\n\n\t\t// Global events (resize, viewport, orientation, fullscreen)\n\t\tconst globalEvents$ = getUpdateStream()\n\n\t\t// Combine all sources, calculate height and padding, dedupe, apply\n\t\t// Skip updates while pinch-zoomed to prevent layout thrashing\n\t\tcombineLatest([\n\t\t\tmerge(parentResize$, globalEvents$).pipe(startWith(null)),\n\t\t\ttheme.bottomOffset$,\n\t\t\ttheme.fullscreen$\n\t\t]).pipe(\n\t\t\tfilter(() => !isZoomed()),\n\t\t\tmap(([, bottomOffset, isFullscreen]) => ({\n\t\t\t\theight: this.calculateHeight(),\n\t\t\t\tpadding: isFullscreen ? 0 : bottomOffset\n\t\t\t})),\n\t\t\tdistinctUntilChanged((a, b) => a.height === b.height && a.padding === b.padding),\n\t\t\ttap(({ height, padding }) => this.applyStyles(height, padding)),\n\t\t\ttakeUntil(this.disconnecting$)\n\t\t).subscribe()\n\n\t}\n\n\trender() {\n\t\treturn\n\t}\n\n\tupdate(part: ElementPart) {\n\t\tif (part.type !== PartType.ELEMENT) {\n\t\t\tthrow new Error('fullHeight directive can only be used on elements')\n\t\t}\n\t\tconst el = part.element as HTMLElement\n\t\tif (this.element !== el) {\n\t\t\tthis.element = el\n\t\t\telementCount++\n\t\t\tthis.setupHeightStream()\n\t\t}\n\t}\n\n\tdisconnected() {\n\t\tthis.disconnecting$.next()\n\t\telementCount--\n\t\tcleanup()\n\t\tthis.element = null\n\t}\n\n\treconnected() {\n\t\tif (this.element) {\n\t\t\telementCount++\n\t\t\tthis.disconnecting$ = new Subject<void>()\n\t\t\tthis.setupHeightStream()\n\t\t}\n\t}\n}\n\nexport const fullHeight = directive(FullHeight)\n\n/**\n * fullWidth directive - fills remaining horizontal viewport space\n *\n * Reactive sources:\n * - Element ResizeObserver (detects when element moves/resizes)\n * - Parent ResizeObserver (layout shifts, e.g., sidebar)\n * - Window resize / visualViewport (viewport changes)\n * - Orientation change (device rotation)\n * - Theme fullscreen toggle (sidebar visibility)\n *\n * Performance:\n * - distinctUntilChanged prevents redundant style writes\n * - debounceTime(16) batches rapid events (~60fps)\n * - Single shared stream for global events\n */\nclass FullWidth extends AsyncDirective {\n\tprivate element: HTMLElement | null = null\n\tprivate disconnecting$ = new Subject<void>()\n\n\tprivate calculateWidth(): number {\n\t\tif (!this.element) return 0\n\t\tconst viewportWidth = window.visualViewport?.width ?? window.innerWidth\n\t\tconst leftOffset = this.element.getBoundingClientRect().left\n\t\treturn Math.max(0, viewportWidth - leftOffset)\n\t}\n\n\tprivate applyStyles(width: number) {\n\t\tif (this.element) {\n\t\t\tthis.element.style.boxSizing = 'border-box'\n\t\t\tthis.element.style.maxWidth = `${width}px`\n\t\t}\n\t}\n\n\tprivate setupWidthStream() {\n\t\tif (!this.element) return\n\n\t\tconst element = this.element\n\n\t\t// Element resize detects when element itself moves (e.g., after layout settles)\n\t\tconst elementResize$ = fromResizeObserver(element)\n\n\t\t// Parent resize detects layout shifts (e.g., sidebar opening/closing)\n\t\tconst parentResize$ = element.parentElement\n\t\t\t? fromResizeObserver(element.parentElement)\n\t\t\t: EMPTY\n\n\t\t// Global events (resize, viewport, orientation)\n\t\tconst globalEvents$ = getUpdateStream()\n\n\t\t// Combine all sources with theme observables for synchronous initial emission\n\t\t// theme.fullscreen$ has shareReplay(1) ensuring immediate emission on subscribe\n\t\t// Skip updates while pinch-zoomed to prevent layout thrashing\n\t\tcombineLatest([\n\t\t\tmerge(elementResize$, parentResize$, globalEvents$).pipe(startWith(null)),\n\t\t\ttheme.fullscreen$\n\t\t]).pipe(\n\t\t\tfilter(() => !isZoomed()),\n\t\t\tmap(() => this.calculateWidth()),\n\t\t\tdistinctUntilChanged(),\n\t\t\ttap(width => this.applyStyles(width)),\n\t\t\ttakeUntil(this.disconnecting$)\n\t\t).subscribe()\n\t}\n\n\trender() {\n\t\treturn\n\t}\n\n\tupdate(part: ElementPart) {\n\t\tif (part.type !== PartType.ELEMENT) {\n\t\t\tthrow new Error('fullWidth directive can only be used on elements')\n\t\t}\n\t\tconst el = part.element as HTMLElement\n\t\tif (this.element !== el) {\n\t\t\tthis.element = el\n\t\t\telementCount++\n\t\t\tthis.setupWidthStream()\n\t\t}\n\t}\n\n\tdisconnected() {\n\t\tthis.disconnecting$.next()\n\t\telementCount--\n\t\tcleanup()\n\t\tthis.element = null\n\t}\n\n\treconnected() {\n\t\tif (this.element) {\n\t\t\telementCount++\n\t\t\tthis.disconnecting$ = new Subject<void>()\n\t\t\tthis.setupWidthStream()\n\t\t}\n\t}\n}\n\nexport const fullWidth = directive(FullWidth)\n"],"mappings":"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"}
+{"version":3,"file":"layout-BE2ld1IY.js","names":[],"sources":["../src/directives/layout.ts"],"sourcesContent":["import { directive, ElementPart, PartType } from 'lit/directive.js'\nimport { AsyncDirective } from 'lit/async-directive.js'\nimport { Subject, fromEvent, merge, Observable, EMPTY, timer, combineLatest } from 'rxjs'\nimport { debounceTime, switchMap, takeUntil, distinctUntilChanged, map, tap, startWith, filter } from 'rxjs/operators'\n\n/** Returns true if user is pinch-zoomed (scale !== 1) */\nfunction isZoomed(): boolean {\n\tconst vv = window.visualViewport\n\treturn vv ? Math.abs(vv.scale - 1) > 0.01 : false\n}\nimport { theme } from '../theme/theme.service'\n\n// Shared global update stream (lazy-initialized, cleaned up when no elements use it)\nlet update$: Subject<void> | null = null\nlet updateSub: { unsubscribe: () => void } | null = null\nlet elementCount = 0\n\nfunction getUpdateStream(): Subject<void> {\n\tif (!update$) {\n\t\tupdate$ = new Subject<void>()\n\n\t\tconst windowResize$ = fromEvent(window, 'resize', { passive: true })\n\n\t\tconst viewportEvents$ = window.visualViewport\n\t\t\t? merge(\n\t\t\t\t\tfromEvent(window.visualViewport, 'resize', { passive: true }),\n\t\t\t\t\tfromEvent(window.visualViewport, 'scroll', { passive: true })\n\t\t\t\t)\n\t\t\t: windowResize$\n\n\t\tconst orientation$ = fromEvent(window, 'orientationchange')\n\n\t\t// iOS Safari: force recalc after keyboard dismissal\n\t\tconst focusOut$ = fromEvent(document, 'focusout', { passive: true }).pipe(\n\t\t\tswitchMap(() => timer(100))\n\t\t)\n\n\t\tupdateSub = merge(windowResize$, viewportEvents$, orientation$, focusOut$)\n\t\t\t.pipe(debounceTime(16))\n\t\t\t.subscribe(() => update$!.next())\n\t}\n\treturn update$\n}\n\nfunction cleanup() {\n\tif (elementCount === 0 && updateSub) {\n\t\tupdateSub.unsubscribe()\n\t\tupdateSub = null\n\t\tupdate$ = null\n\t}\n}\n\n\n/**\n * RxJS wrapper for ResizeObserver - auto-cleans on unsubscribe\n */\nexport function fromResizeObserver(element: Element): Observable<ResizeObserverEntry[]> {\n\treturn new Observable(subscriber => {\n\t\tconst observer = new ResizeObserver(entries => subscriber.next(entries))\n\t\tobserver.observe(element)\n\t\treturn () => observer.disconnect()\n\t})\n}\n\n/**\n * fullHeight directive - fills remaining viewport space\n *\n * Reactive sources:\n * - Parent ResizeObserver (layout shifts)\n * - Window resize / visualViewport (viewport changes)\n * - Orientation change (device rotation)\n * - Focus out (mobile keyboard dismiss)\n * - Theme fullscreen toggle\n *\n * Performance:\n * - distinctUntilChanged prevents redundant style writes\n * - debounceTime(16) batches rapid events (~60fps)\n * - Single shared stream for global events\n */\nclass FullHeight extends AsyncDirective {\n\tprivate element: HTMLElement | null = null\n\tprivate disconnecting$ = new Subject<void>()\n\n\tprivate calculateHeight(): number {\n\t\tif (!this.element) return 0\n\t\tconst viewportHeight = window.visualViewport?.height ?? window.innerHeight\n\t\tconst topOffset = this.element.getBoundingClientRect().top\n\t\treturn Math.max(0, viewportHeight - topOffset)\n\t}\n\n\tprivate applyStyles(height: number, bottomPadding: number) {\n\t\tif (this.element) {\n\t\t\tthis.element.style.boxSizing = 'border-box'\n\t\t\tthis.element.style.height = `${height}px`\n\t\t\tthis.element.style.paddingBottom = `${bottomPadding}px`\n\t\t}\n\t}\n\n\tprivate setupHeightStream() {\n\t\tif (!this.element) return\n\n\t\tconst element = this.element\n\n\t\t// Parent resize detects layout shifts (e.g., header rendering after load)\n\t\tconst parentResize$ = element.parentElement\n\t\t\t? fromResizeObserver(element.parentElement)\n\t\t\t: EMPTY\n\n\t\t// Global events (resize, viewport, orientation, fullscreen)\n\t\tconst globalEvents$ = getUpdateStream()\n\n\t\t// Combine all sources, calculate height and padding, dedupe, apply\n\t\t// Skip updates while pinch-zoomed to prevent layout thrashing\n\t\tcombineLatest([\n\t\t\tmerge(parentResize$, globalEvents$).pipe(startWith(null)),\n\t\t\ttheme.bottomOffset$,\n\t\t\ttheme.fullscreen$\n\t\t]).pipe(\n\t\t\tfilter(() => !isZoomed()),\n\t\t\tmap(([, bottomOffset, isFullscreen]) => ({\n\t\t\t\theight: this.calculateHeight(),\n\t\t\t\tpadding: isFullscreen ? 0 : bottomOffset\n\t\t\t})),\n\t\t\tdistinctUntilChanged((a, b) => a.height === b.height && a.padding === b.padding),\n\t\t\ttap(({ height, padding }) => this.applyStyles(height, padding)),\n\t\t\ttakeUntil(this.disconnecting$)\n\t\t).subscribe()\n\n\t}\n\n\trender() {\n\t\treturn\n\t}\n\n\tupdate(part: ElementPart) {\n\t\tif (part.type !== PartType.ELEMENT) {\n\t\t\tthrow new Error('fullHeight directive can only be used on elements')\n\t\t}\n\t\tconst el = part.element as HTMLElement\n\t\tif (this.element !== el) {\n\t\t\tthis.element = el\n\t\t\telementCount++\n\t\t\tthis.setupHeightStream()\n\t\t}\n\t}\n\n\tdisconnected() {\n\t\tthis.disconnecting$.next()\n\t\telementCount--\n\t\tcleanup()\n\t\tthis.element = null\n\t}\n\n\treconnected() {\n\t\tif (this.element) {\n\t\t\telementCount++\n\t\t\tthis.disconnecting$ = new Subject<void>()\n\t\t\tthis.setupHeightStream()\n\t\t}\n\t}\n}\n\nexport const fullHeight = directive(FullHeight)\n\n/**\n * fullWidth directive - fills remaining horizontal viewport space\n *\n * Reactive sources:\n * - Element ResizeObserver (detects when element moves/resizes)\n * - Parent ResizeObserver (layout shifts, e.g., sidebar)\n * - Window resize / visualViewport (viewport changes)\n * - Orientation change (device rotation)\n * - Theme fullscreen toggle (sidebar visibility)\n *\n * Performance:\n * - distinctUntilChanged prevents redundant style writes\n * - debounceTime(16) batches rapid events (~60fps)\n * - Single shared stream for global events\n */\nclass FullWidth extends AsyncDirective {\n\tprivate element: HTMLElement | null = null\n\tprivate disconnecting$ = new Subject<void>()\n\n\tprivate calculateWidth(): number {\n\t\tif (!this.element) return 0\n\t\tconst viewportWidth = window.visualViewport?.width ?? window.innerWidth\n\t\tconst leftOffset = this.element.getBoundingClientRect().left\n\t\treturn Math.max(0, viewportWidth - leftOffset)\n\t}\n\n\tprivate applyStyles(width: number) {\n\t\tif (this.element) {\n\t\t\tthis.element.style.boxSizing = 'border-box'\n\t\t\tthis.element.style.maxWidth = `${width}px`\n\t\t}\n\t}\n\n\tprivate setupWidthStream() {\n\t\tif (!this.element) return\n\n\t\tconst element = this.element\n\n\t\t// Element resize detects when element itself moves (e.g., after layout settles)\n\t\tconst elementResize$ = fromResizeObserver(element)\n\n\t\t// Parent resize detects layout shifts (e.g., sidebar opening/closing)\n\t\tconst parentResize$ = element.parentElement\n\t\t\t? fromResizeObserver(element.parentElement)\n\t\t\t: EMPTY\n\n\t\t// Global events (resize, viewport, orientation)\n\t\tconst globalEvents$ = getUpdateStream()\n\n\t\t// Combine all sources with theme observables for synchronous initial emission\n\t\t// theme.fullscreen$ has shareReplay(1) ensuring immediate emission on subscribe\n\t\t// Skip updates while pinch-zoomed to prevent layout thrashing\n\t\tcombineLatest([\n\t\t\tmerge(elementResize$, parentResize$, globalEvents$).pipe(startWith(null)),\n\t\t\ttheme.fullscreen$\n\t\t]).pipe(\n\t\t\tfilter(() => !isZoomed()),\n\t\t\tmap(() => this.calculateWidth()),\n\t\t\tdistinctUntilChanged(),\n\t\t\ttap(width => this.applyStyles(width)),\n\t\t\ttakeUntil(this.disconnecting$)\n\t\t).subscribe()\n\t}\n\n\trender() {\n\t\treturn\n\t}\n\n\tupdate(part: ElementPart) {\n\t\tif (part.type !== PartType.ELEMENT) {\n\t\t\tthrow new Error('fullWidth directive can only be used on elements')\n\t\t}\n\t\tconst el = part.element as HTMLElement\n\t\tif (this.element !== el) {\n\t\t\tthis.element = el\n\t\t\telementCount++\n\t\t\tthis.setupWidthStream()\n\t\t}\n\t}\n\n\tdisconnected() {\n\t\tthis.disconnecting$.next()\n\t\telementCount--\n\t\tcleanup()\n\t\tthis.element = null\n\t}\n\n\treconnected() {\n\t\tif (this.element) {\n\t\t\telementCount++\n\t\t\tthis.disconnecting$ = new Subject<void>()\n\t\t\tthis.setupWidthStream()\n\t\t}\n\t}\n}\n\nexport const fullWidth = directive(FullWidth)\n"],"mappings":"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"}

package/dist/layout-D7xOqMkJ.cjs

@@ -0,0 +1,17 @@
+require(`./chunk-BCfY8kxB.cjs`);const e=require(`./tailwind.mixin-Cpa-VnnX.cjs`),t=require(`./decorate-F9CuyeHg.cjs`);require(`./mixins.cjs`),require(`./scroll-C_iNOi7E.cjs`);let n=require(`rxjs`),r=require(`lit/directives/class-map.js`),i=require(`lit/directives/style-map.js`),a=require(`lit/decorators.js`),o=require(`lit`);var s=class extends e.t(){constructor(...e){super(...e),this.layout=!0,this.center=void 0,this.display=void 0,this.overflow=void 0,this.overflowX=void 0,this.overflowY=void 0,this.position=void 0}static{this.styles=[this.styles]}connectedCallback(){super.connectedCallback(),this.style.setProperty(`padding`,this.padding??``),this.style.setProperty(`margin`,this.margin??``),this.style.setProperty(`width`,this.width??``),this.style.setProperty(`height`,this.height??``),this.style.setProperty(`min-width`,this.minWidth??``),this.style.setProperty(`min-height`,this.minHeight??``),this.style.setProperty(`max-width`,this.maxWidth??``),this.style.setProperty(`max-height`,this.maxHeight??``),this.style.setProperty(`display`,this.display??``),this.style.setProperty(`overflow`,this.overflow??``),this.style.setProperty(`overflow-x`,this.overflowX??``),this.style.setProperty(`overflow-y`,this.overflowY??``),this.style.setProperty(`position`,this.position??``),this.style.setProperty(`top`,this.top??``),this.style.setProperty(`right`,this.right??``),this.style.setProperty(`bottom`,this.bottom??``),this.style.setProperty(`left`,this.left??``),this.style.setProperty(`inset`,this.inset??``),this.style.setProperty(`z-index`,this.zIndex??``),this.style.setProperty(`border`,this.border??``),this.style.setProperty(`border-top`,this.borderTop??``),this.style.setProperty(`border-right`,this.borderRight??``),this.style.setProperty(`border-bottom`,this.borderBottom??``),this.style.setProperty(`border-left`,this.borderLeft??``),this.style.setProperty(`border-color`,this.borderColor??``),this.style.setProperty(`border-radius`,this.borderRadius??``),this.style.setProperty(`border-width`,this.borderWidth??``),this.style.setProperty(`box-shadow`,this.boxShadow??``),this.style.setProperty(`opacity`,this.opacity??``),this.style.setProperty(`background`,this.background??``),this.style.setProperty(`background-image`,this.backgroundImage??``),this.style.setProperty(`background-position`,this.backgroundPosition??``),this.style.setProperty(`background-size`,this.backgroundSize??``),this.style.setProperty(`background-repeat`,this.backgroundRepeat??``),this.style.setProperty(`background-attachment`,this.backgroundAttachment??``),this.style.setProperty(`background-color`,this.backgroundColor??``),this.style.setProperty(`background-clip`,this.backgroundClip??``),this.style.setProperty(`background-origin`,this.backgroundOrigin??``),this.style.setProperty(`background-blend-mode`,this.backgroundBlendMode??``),this.style.setProperty(`filter`,this.filter??``),this.style.setProperty(`backdrop-filter`,this.backdropFilter??``),this.center&&(this.style.setProperty(`margin-left`,`auto`),this.style.setProperty(`margin-right`,`auto`))}};t.t([(0,a.property)({type:Boolean})],s.prototype,`center`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`padding`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`margin`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`width`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`height`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`minWidth`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`minHeight`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`maxWidth`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`maxHeight`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`display`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`overflow`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`overflowX`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`overflowY`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`position`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`top`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`right`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`bottom`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`left`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`inset`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`zIndex`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`border`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`borderTop`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`borderRight`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`borderBottom`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`borderLeft`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`borderColor`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`borderRadius`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`borderWidth`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`boxShadow`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`opacity`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`background`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`backgroundImage`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`backgroundPosition`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`backgroundSize`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`backgroundRepeat`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`backgroundAttachment`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`backgroundColor`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`backgroundClip`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`backgroundOrigin`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`backgroundBlendMode`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`filter`,void 0),t.t([(0,a.property)({type:String})],s.prototype,`backdropFilter`,void 0);var c=class extends s{constructor(...e){super(...e),this.layout=!0,this.flow=`col`,this.wrap=`wrap`,this.align=`start`,this.justify=`start`,this.gap=`none`}static{this.styles=[s.styles,(0,o.unsafeCSS)(`:host{background-color:inherit;display:block}`)]}render(){return o.html`
+			<section class=${(0,r.classMap)({flex:!0,"flex-col":this.flow===`row`,"flex-col-reverse":this.flow===`row-reverse`,"flex-row":this.flow===`col`,"flex-row-reverse":this.flow===`col-reverse`,"flex-wrap":this.wrap===`wrap`,"flex-wrap-reverse":this.wrap===`wrap-reverse`,"flex-nowrap":this.wrap===`nowrap`,"items-start":this.align===`start`,"items-center":this.align===`center`,"items-end":this.align===`end`,"items-stretch":this.align===`stretch`,"justify-baseline":this.align===`baseline`,"justify-center":this.justify===`center`,"justify-end":this.justify===`end`,"justify-start":this.justify===`start`,"justify-stretch":this.justify===`stretch`,"justify-between":this.justify===`between`,"gap-0":this.gap===`none`,"gap-2":this.gap===`sm`,"gap-4":this.gap===`md`,"gap-8":this.gap===`lg`})} style=${(0,i.styleMap)({})}>
+				<slot></slot>
+			</section>
+		`}};t.t([(0,a.property)({type:String,reflect:!0})],c.prototype,`flow`,void 0),t.t([(0,a.property)({type:String,reflect:!0})],c.prototype,`wrap`,void 0),t.t([(0,a.property)({type:String,reflect:!0})],c.prototype,`align`,void 0),t.t([(0,a.property)({type:String,reflect:!0})],c.prototype,`justify`,void 0),t.t([(0,a.property)({type:String,reflect:!0})],c.prototype,`gap`,void 0),c=t.t([(0,a.customElement)(`schmancy-flex`)],c);var l=class extends s{constructor(...e){super(...e),this.layout=!0,this.flow=`row`,this.align=`stretch`,this.justify=`stretch`,this.content=`stretch`,this.gap=`none`,this.wrap=!1}static{this.styles=[s.styles,(0,o.unsafeCSS)(`:host{width:-webkit-fill-available;height:max-content;display:block}`)]}firstUpdated(){this.rcols&&(0,n.fromEvent)(window,`resize`).pipe((0,n.map)(e=>e.target),(0,n.startWith)(1),(0,n.map)(()=>this.clientWidth?this.clientWidth:window.innerWidth),(0,n.distinctUntilChanged)(),(0,n.takeUntil)(this.disconnecting),(0,n.debounceTime)(10),(0,n.map)(e=>{let t;return this.rcols?.[`2xl`]&&e>=1536?t=this.rcols?.[`2xl`]:this.rcols?.xl&&e>=1280?t=this.rcols?.xl:this.rcols?.lg&&e>=1024?t=this.rcols?.lg:this.rcols?.md&&e>=768?t=this.rcols?.md:this.rcols?.sm&&e>=640?t=this.rcols?.sm:this.rcols?.xs&&e<640&&(t=this.rcols?.xs),t})).subscribe(e=>{this.cols=e})}render(){let e={"h-full":!0,"grid flex-1":!0,"grid-flow-row auto-rows-max":this.flow===`row`,"grid-flow-col auto-cols-max":this.flow===`col`,"grid-flow-row-dense":this.flow===`row-dense`,"grid-flow-col-dense":this.flow===`col-dense`,"grid-flow-dense":this.flow===`dense`,"justify-center":this.content===`center`,"justify-end":this.content===`end`,"justify-start":this.content===`start`,"justify-stretch":this.content===`stretch`,"justify-between":this.content===`between`,"justify-around":this.content===`around`,"justify-evenly":this.content===`evenly`,"justify-items-center":this.justify===`center`,"justify-items-end":this.justify===`end`,"justify-items-start":this.justify===`start`,"justify-items-stretch":this.justify===`stretch`,"items-center":this.align===`center`,"items-end":this.align===`end`,"items-start":this.align===`start`,"items-stretch":this.align===`stretch`,"items-baseline":this.align===`baseline`,"gap-0":this.gap===`none`,"gap-1":this.gap===`xs`,"gap-2":this.gap===`sm`,"gap-4":this.gap===`md`,"gap-8":this.gap===`lg`,"flex-nowrap":this.wrap,"flex-wrap":!this.wrap},t={gridTemplateRows:this.rows?this.rows:void 0,gridTemplateColumns:this.cols?this.cols:void 0};return o.html`
+			<section class="${this.classMap(e)}" style=${this.styleMap(t)}>
+				<slot> </slot>
+			</section>
+		`}};t.t([(0,a.property)({type:String})],l.prototype,`flow`,void 0),t.t([(0,a.property)({type:String})],l.prototype,`align`,void 0),t.t([(0,a.property)({type:String})],l.prototype,`justify`,void 0),t.t([(0,a.property)({type:String})],l.prototype,`content`,void 0),t.t([(0,a.property)({type:String})],l.prototype,`gap`,void 0),t.t([(0,a.property)({type:String})],l.prototype,`cols`,void 0),t.t([(0,a.property)({type:String})],l.prototype,`rows`,void 0),t.t([(0,a.property)({type:Object})],l.prototype,`rcols`,void 0),t.t([(0,a.property)({type:Boolean})],l.prototype,`wrap`,void 0),t.t([(0,a.queryAssignedElements)()],l.prototype,`assignedElements`,void 0),l=t.t([(0,a.customElement)(`schmancy-grid`)],l);var u=class extends s{constructor(...e){super(...e),this.inline=!1,this.flow=`row`,this.wrap=`wrap`,this.align=`stretch`,this.justify=`start`,this.gap=`none`}static{this.styles=[s.styles,o.css`
+			:host {
+				display: block;
+			}
+		`]}render(){let e=this.inline?`inline-flex`:`flex`,t=``;switch(this.flow){case`row`:case`row-dense`:default:t=`flex-row`;break;case`row-reverse`:t=`flex-row-reverse`;break;case`col`:case`col-dense`:t=`flex-col`;break;case`col-reverse`:t=`flex-col-reverse`}let n=``;switch(this.flow===`row-dense`||this.flow===`col-dense`?`wrap`:this.wrap){case`wrap`:default:n=`flex-wrap`;break;case`nowrap`:n=`flex-nowrap`;break;case`wrap-reverse`:n=`flex-wrap-reverse`}let r=``;switch(this.align){case`start`:r=`items-start`;break;case`center`:r=`items-center`;break;case`end`:r=`items-end`;break;case`stretch`:default:r=`items-stretch`;break;case`baseline`:r=`items-baseline`}let i=``;switch(this.justify){case`start`:default:i=`justify-start`;break;case`center`:i=`justify-center`;break;case`end`:i=`justify-end`;break;case`between`:i=`justify-between`;break;case`around`:i=`justify-around`;break;case`evenly`:i=`justify-evenly`}let a=``;if(this.content)switch(this.content){case`start`:a=`content-start`;break;case`center`:a=`content-center`;break;case`end`:a=`content-end`;break;case`between`:a=`content-between`;break;case`around`:a=`content-around`;break;case`evenly`:a=`content-evenly`}let s=this.gap===`none`?`gap-0`:`gap-${this.gap}`;return o.html`
+			<section class=${[e,t,n,r,i,a,s].filter(Boolean).join(` `)}>
+				<slot></slot>
+			</section>
+		`}};t.t([(0,a.property)({type:Boolean,reflect:!0})],u.prototype,`inline`,void 0),t.t([(0,a.property)({type:String,reflect:!0})],u.prototype,`flow`,void 0),t.t([(0,a.property)({type:String,reflect:!0})],u.prototype,`wrap`,void 0),t.t([(0,a.property)({type:String,reflect:!0})],u.prototype,`align`,void 0),t.t([(0,a.property)({type:String,reflect:!0})],u.prototype,`justify`,void 0),t.t([(0,a.property)({type:String,reflect:!0})],u.prototype,`content`,void 0),t.t([(0,a.property)({type:String,reflect:!0})],u.prototype,`gap`,void 0),u=t.t([(0,a.customElement)(`sch-flex`)],u),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return u}});