@mhmo91/schmancy 0.7.7 → 0.8.3

package/dist/{input-chip-DVE4_1wn.js.map → input-chip-tbrw56ix.js.map}

@@ -1 +1 @@
-{"version":3,"file":"input-chip-DVE4_1wn.js","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\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 }"],"names":["SchmancyInputChip","TailwindElement","css","super","this","value","icon","avatar","removable","disabled","elevated","chipHover$","BehaviorSubject","removeHover$","focused$","pressed$","uiState","chipHover","removeHover","focused","pressed","ripples","nextRippleId","handleChipClick","e","chip","shadowRoot","querySelector","rect","getBoundingClientRect","x","clientX","left","y","clientY","top","id","setTimeout","filter","r","dispatchEvent","CustomEvent","detail","bubbles","composed","handleRemove","stopPropagation","handleKeyDown","key","preventDefault","clickEvent","MouseEvent","cancelable","handleFocus","next","handleBlur","internals","attachInternals","form","connectedCallback","combineLatest","pipe","map","tap","state","takeUntil","disconnecting","subscribe","render","hasLeadingIcon","chipClasses","relative","border","removeButtonClasses","flex","html","classMap","ripple","shadowRootOptions","LitElement","delegatesFocus","formAssociated","__decorateClass","property","type","String","reflect","prototype","Boolean","customElement"],"mappings":";;;;;;;;;;AA+BO,IAAMA,IAAN,cAAgCC,EAAgBC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,CA2HtD,EAAA;AAAA,EAAA;AACCC,UAAAA,GAzCDC,KAAAC,QAAgB,IAIhBD,KAAAE,OAAe,IAIfF,KAAAG,SAAiB,IAIjBH,KAAAI,gBAIAJ,KAAAK,eAIAL,KAAAM,eAGAN,KAAQO,aAAa,IAAIC,IAAyB,GAClDR,KAAQS,eAAe,IAAID,EAAAA,KAC3BR,KAAQU,WAAW,IAAIF,EAAAA,EAAyB,GAChDR,KAAQW,WAAW,IAAIH,IAAyB,GAGtCR,KAAAY,UAAU,EACnBC,WAAAA,IACAC,aAAAA,IACAC,SAAAA,IACAC,YAAS,GAIDhB,KAAQiB,UAAuD,CAAA,GACxEjB,KAAQkB,eAAe,GA6CvBlB,KAAQmB,kBAAmBC,CAAAA,MAAAA;AAC1B,UAAIpB,KAAKK,SAAU;AAGnB,YAAMgB,IAAOrB,KAAKsB,YAAYC,cAAc,iBAAA;AAC5C,UAAIF,GAAM;AACT,cAAMG,IAAOH,EAAKI,yBACZC,IAAIN,EAAEO,UAAUH,EAAKI,MACrBC,IAAIT,EAAEU,UAAUN,EAAKO,KACrBC,IAAKhC,KAAKkB;AAEhBlB,aAAKiB,UAAU,CAAA,GAAIjB,KAAKiB,SAAS,EAAES,MAAGG,GAAAA,GAAGG,IAAAA,EAAAA,CAAAA,GAGzCC,WAAW,MAAA;AACVjC,eAAKiB,UAAUjB,KAAKiB,QAAQiB,OAAOC,CAAAA,MAAKA,EAAEH,OAAOA,CAAAA;AAAAA,QAAAA,GAC/C,GAAA;AAAA,MACJ;AAGAhC,WAAKoC,cACJ,IAAIC,YAAY,SAAS,EACxBC,QAAQ,EAAErC,OAAOD,KAAKC,SACtBsC,SAAAA,IACAC,aAAU,CAAA,CAAA;AAAA,IAAA,GAKbxC,KAAQyC,eAAgBrB,CAAAA,MAAAA;AACnBpB,WAAKK,aAETe,EAAEsB,gBAAAA,GAGF1C,KAAKoC,cACJ,IAAIC,YAAY,UAAU,EACzBC,QAAQ,EAAErC,OAAOD,KAAKC,MAAAA,GACtBsC,aACAC,UAAAA;OAKHxC,KAAQ2C,gBAAiBvB,CAAAA;AACxB,UAAA,CAAIpB,KAAKK,SAGT,KAAKe,EAAEwB,QAAQ,YAAYxB,EAAEwB,QAAQ,eAARA,CAAwB5C,KAAKI;AAG1D,YAESgB,EAAEwB,QAAQ,SAAS;AAC3BxB,UAAAA,EAAEyB,eAAAA;AACF,gBAAMC,IAAa,IAAIC,WAAW,SAAS,EAC1CR,SAAAA,IACAS,YAAAA,IACArB,SAAS,GACTG,SAAS,EAAA,CAAA;AAEV9B,eAAKmB,gBAAgB2B,CAAAA;AAAAA,QACtB;AAAA,YAbC1B,CAAAA,EAAEyB,eAAAA,GACF7C,KAAKyC,aAAarB,CAAAA;AAAAA,IAAAA,GAepBpB,KAAQiD,cAAc,MAAA;AACrBjD,WAAKU,SAASwC,KAAAA,EAAK;AAAA,IAAA,GAGpBlD,KAAQmD,aAAa,MAAA;AACpBnD,WAAKU,SAASwC,KAAAA,EAAK;AAAA,IAAA;AA/GnB,QAAA;AACClD,WAAKoD,YAAYpD,KAAKqD;IACvB,QAAA;AACCrD,WAAKoD,YAAAA;AAAAA,IACN;AAAA,EACD;AAAA,EASA,IAAA;AACC,WAAOpD,KAAKoD,WAAWE;AAAAA,EACxB;AAAA,EAEA,oBAAAC;AACCxD,UAAMwD,kBAAAA,GAGNC,EAAc,CACbxD,KAAKO,YACLP,KAAKS,cACLT,KAAKU,UACLV,KAAKW,QAAAA,CAAAA,EACH8C,KACFC,EAAI,CAAA,CAAE7C,GAAWC,GAAaC,GAASC,QAAO,EAC7CH,WAAAA,GACAC,gBACAC,SAAAA,GACAC,SAAAA,EAAAA,EAAAA,GAED2C,EAAIC,CAAAA,MAAAA;AACH5D,WAAKY,UAAUgD;AAAAA,IAAAA,CAAAA,GAEhBC,EAAU7D,KAAK8D,aAAAA,CAAAA,EACdC,UAAAA;AAAAA,EACH;AAAA,EA2EU,SAAAC;AACT,UAAMC,IAAiBjE,KAAKG,UAAUH,KAAKE,MAErCgE,IAAc,EACnB,kBAAA,IACA,eAAA,IACA,gBAAA,IACA,aACA,OAAA,IACA,gBAAA,IACA,oBACA,kBAAA,IACA,kBAAA,IACA,oBACA,eAAA,IACA,WAAA,IACA,mBACAC,UAAAA,IACA,mBAAA,IACAC,YAGA,QAAQH,GACR,QAAA,CAASA,GACT,QAAQjE,KAAKI,WACb,SAASJ,KAAKI,WAGd,+BACA,0BAAA,IACA,kBAAA,IACA,oBAIA,yBAAA,CAA0BJ,KAAKK,UAC/B,4BAA4BL,KAAKK,UACjC,kCAAkCL,KAAKK,UACvC,mCAAmCL,KAAKK,UAGxC,cAAcL,KAAKK,UACnB,sBAAsBL,KAAKK,SAAAA,GAGtBgE,IAAsB,EAC3B,eAAA,IACAC,MAAAA,IACA,oBACA,kBAAA,IACA,gBAAA,IACA,sBACA,gBAAA,IACA,kBAAA,CAAmBtE,KAAKK,UACxB,SAAA,IAGA,sCAAsCL,KAAKK,UAC3C,cAAcL,KAAKK,SAAAA;AAGpB,WAAOkE;AAAAA;AAAAA,YAEGC,EAASN,CAAAA,CAAAA;AAAAA,aACRlE,KAAKmB,eAAAA;AAAAA,eACHnB,KAAK2C,aAAAA;AAAAA,kBACF,MAAM3C,KAAKO,WAAW2C,KAAAA,EAAK,CAAA;AAAA,kBAC3B,MAAMlD,KAAKO,WAAW2C,KAAAA,EAAK,CAAA;AAAA,iBAC5B,MAAMlD,KAAKW,SAASuC,KAAAA,EAAK,CAAA;AAAA,eAC3B,MAAMlD,KAAKW,SAASuC,KAAAA,EAAK,CAAA;AAAA,aAC3BlD,KAAKiD,WAAAA;AAAAA,YACNjD,KAAKmD,UAAAA;AAAAA;AAAAA,eAEFnD,KAAKK,WAAW,OAAO,GAAA;AAAA,oBAClBL,KAAKK,QAAAA;AAAAA,iBACRL,KAAKC,KAAAA;AAAAA;AAAAA;AAAAA,MAGhBD,KAAKG,SAASoE;AAAAA;AAAAA,YAERvE,KAAKG,MAAAA;AAAAA;AAAAA;AAAAA;AAAAA,QAIT,EAAA;AAAA;AAAA;AAAA,MAGFH,KAAKE,QAAAA,CAASF,KAAKG,SAASoE;AAAAA;AAAAA,QAE1BvE,KAAKE,IAAAA;AAAAA;AAAAA,QAEL,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAQFF,KAAKI,YAAYmE;AAAAA;AAAAA,cAETC,EAASH,CAAAA,CAAAA;AAAAA,eACRrE,KAAKyC,YAAAA;AAAAA,oBACA,MAAMzC,KAAKS,aAAayC,KAAAA,EAAK,CAAA;AAAA,oBAC7B,MAAMlD,KAAKS,aAAayC,KAAAA,EAAK,CAAA;AAAA;AAAA;AAAA,kBAG/BlD,KAAKK,QAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,QAMf,EAAA;AAAA;AAAA;AAAA,MAGFL,KAAKiB,QAAQyC,IAAIe,CAAAA,MAAUF;AAAAA;AAAAA;AAAAA,qBAGZE,EAAO/C,aAAa+C,EAAO5C,CAAAA;AAAAA;AAAAA;;;;;;EAQ/C;AAAA;AA9WYjC,EAoIK8E,oBAAoB,EAAA,GACjCC,EAAWD,mBACdE,gBAAAA,GAAgB,GAtILhF,EAyILiF,iBAAAA,IAtDPC,EAAA,CADCC,EAAS,EAAEC,MAAMC,QAAQC,SAAAA,QAlFdtF,EAmFZuF,WAAA,SAAA,CAAA,GAIAL,EAAA,CADCC,EAAS,EAAEC,MAAMC,QAAQC,SAAAA,GAAS,CAAA,CAAA,GAtFvBtF,EAuFZuF,WAAA,QAAA,CAAA,GAIAL,EAAA,CADCC,EAAS,EAAEC,MAAMC,QAAQC,YAAS,CAAA,CAAA,GA1FvBtF,EA2FZuF,WAAA,UAAA,CAAA,GAIAL,EAAA,CADCC,EAAS,EAAEC,MAAMI,SAASF,SAAAA,QA9FftF,EA+FZuF,WAAA,aAAA,CAAA,GAIAL,EAAA,CADCC,EAAS,EAAEC,MAAMI,SAASF,SAAAA,GAAS,CAAA,CAAA,GAlGxBtF,EAmGZuF,WAAA,YAAA,IAIAL,EAAA,CADCC,EAAS,EAAEC,MAAMI,SAASF,YAAS,CAAA,CAAA,GAtGxBtF,EAuGZuF,WAAA,YAAA,CAAA,GASUL,EAAA,CAATlB,EAAAA,CAAAA,GAhHWhE,EAgHFuF,WAAA,WAAA,CAAA,GAQOL,EAAA,CAAhBlB,EAAAA,CAAAA,GAxHWhE,EAwHKuF,WAAA,WAAA,CAAA,GAxHLvF,IAANkF,EAAA,CADNO,EAAc,qBAAA,CAAA,GACFzF,CAAAA;"}
+{"version":3,"file":"input-chip-tbrw56ix.js","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\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 }"],"names":["SchmancyInputChip","TailwindElement","css","super","this","value","icon","avatar","removable","disabled","elevated","chipHover$","BehaviorSubject","removeHover$","focused$","pressed$","uiState","chipHover","removeHover","focused","pressed","ripples","nextRippleId","handleChipClick","e","chip","shadowRoot","querySelector","rect","getBoundingClientRect","x","clientX","left","y","clientY","top","id","setTimeout","filter","r","dispatchEvent","CustomEvent","detail","bubbles","composed","handleRemove","stopPropagation","handleKeyDown","key","preventDefault","clickEvent","MouseEvent","cancelable","handleFocus","next","handleBlur","internals","attachInternals","form","connectedCallback","combineLatest","pipe","map","tap","state","takeUntil","disconnecting","subscribe","render","hasLeadingIcon","chipClasses","relative","border","removeButtonClasses","flex","html","classMap","ripple","shadowRootOptions","LitElement","delegatesFocus","formAssociated","__decorateClass","property","type","String","reflect","prototype","Boolean","customElement"],"mappings":"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"}

package/dist/input.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./input-UyknNHNr.cjs");Object.defineProperty(exports,"SchmancyInput",{enumerable:!0,get:()=>e.SchmancyInput}),Object.defineProperty(exports,"SchmancyInputCompat",{enumerable:!0,get:()=>e.SchmancyInputCompat});
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./input-8G9YY9qv.cjs");Object.defineProperty(exports,"SchmancyInput",{enumerable:!0,get:()=>e.SchmancyInput}),Object.defineProperty(exports,"SchmancyInputCompat",{enumerable:!0,get:()=>e.SchmancyInputCompat});
 //# sourceMappingURL=input.cjs.map

package/dist/input.js

@@ -1,4 +1,4 @@
-import { S as m, a as n } from "./input-DDCFZ3cr.js";
+import { S as m, a as n } from "./input-BJMF5Fyk.js";
 export {
   m as SchmancyInput,
   n as SchmancyInputCompat

package/dist/json-CvcloKQv.js

@@ -0,0 +1,51 @@
+import "rxjs";
+import "rxjs/operators";
+import "lit/directives/class-map.js";
+import "lit/directives/style-map.js";
+import { property as p, customElement as g } from "lit/decorators.js";
+import { T as m } from "./tailwind.mixin-Ddt05Frc.js";
+import { css as y, html as d } from "lit";
+import { unsafeHTML as f } from "lit/directives/unsafe-html.js";
+import { $ as h } from "./notification-service-B5ljba4P.js";
+var u = Object.defineProperty, b = Object.getOwnPropertyDescriptor, n = (t, r, s, e) => {
+  for (var i, o = e > 1 ? void 0 : e ? b(r, s) : r, a = t.length - 1; a >= 0; a--) (i = t[a]) && (o = (e ? i(r, s, o) : i(o)) || o);
+  return e && o && u(r, s, o), o;
+};
+let c = class extends m(y`:host { display: block }`) {
+  constructor() {
+    super(...arguments), this.data = {}, this.highlightKeys = [], this.compact = !1;
+  }
+  highlightChanges(t, r) {
+    let s = t;
+    return r.forEach((e) => {
+      const i = new RegExp(`("${e}":\\s*)([^,\\n}]+)`, "g");
+      s = s.replace(i, (o, a, l) => `${a}<span class="text-warning-default font-bold">${l}</span>`);
+    }), s;
+  }
+  async copyJSON() {
+    try {
+      await navigator.clipboard.writeText(JSON.stringify(this.data, null, 2)), h.success("JSON copied to clipboard");
+    } catch {
+      h.error("Failed to copy JSON");
+    }
+  }
+  render() {
+    const t = JSON.stringify(this.data, null, this.compact ? 0 : 2), r = this.highlightKeys.length > 0 ? this.highlightChanges(t, this.highlightKeys) : t;
+    return d`
+			<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}
+			>
+				<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">${f(r)}</pre>
+			</div>
+		`;
+  }
+};
+n([p({ type: Object })], c.prototype, "data", 2), n([p({ type: Array })], c.prototype, "highlightKeys", 2), n([p({ type: Boolean })], c.prototype, "compact", 2), c = n([g("schmancy-json")], c);
+export {
+  c as S
+};
+//# sourceMappingURL=json-CvcloKQv.js.map

package/dist/json-CvcloKQv.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"json-CvcloKQv.js","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"],"names":["SchmancyJson","TailwindElement","css","super","arguments","this","data","highlightKeys","compact","json","changedKeys","highlighted","forEach","key","regex","RegExp","replace","_match","keyPart","valuePart","navigator","clipboard","writeText","JSON","stringify","$notify","success","error","render","jsonString","length","highlightChanges","html","copyJSON","unsafeHTML","__decorateClass","property","type","Object","prototype","Array","Boolean","customElement"],"mappings":";;;;;;;;;;;;;AAOO,IAAMA,IAAN,cAA2BC,EAAgBC,2BAAA,EAAA;AAAA,EAA3C;AAAAC,UAAAA,GAAAC,SAAAA,GACsBC,KAAAC,OAA4B,CAAA,GAC7BD,KAAAE,gBAA0B,CAAA,GACxBF,KAAAG;EAAU;AAAA,EAE/B,iBAAiBC,GAAcC,GAAAA;AACtC,QAAIC,IAAcF;AAOlB,WANAC,EAAYE,QAAQC,CAAAA;AACnB,YAAMC,IAAQ,IAAIC,OAAO,KAAKF,CAAAA,sBAAyB,GAAA;AACvDF,UAAcA,EAAYK,QAAQF,GAAO,CAACG,GAAQC,GAASC,MACnD,GAAGD,CAAAA,gDAAuDC,CAAAA,SAAAA;AAAAA,IAAAA,CAAAA,GAG5DR;AAAAA,EACR;AAAA,EAEA,MAAA;AACC,QAAA;AAAA,YACOS,UAAUC,UAAUC,UAAUC,KAAKC,UAAUnB,KAAKC,MAAM,MAAM,CAAA,CAAA,GACpEmB,EAAQC,QAAQ;IACjB,QAASC;AACRF,MAAAA,EAAQE,MAAM,qBAAA;AAAA,IACf;AAAA,EACD;AAAA,EAEA,SAAAC;AACC,UAAMC,IAAaN,KAAKC,UAAUnB,KAAKC,MAAM,MAAMD,KAAKG,UAAU,IAAI,CAAA,GAChEG,IAAcN,KAAKE,cAAcuB,SAAS,IAAIzB,KAAK0B,iBAAiBF,GAAYxB,KAAKE,aAAAA,IAAiBsB;AAE5G,WAAOG;AAAAA;AAAAA;AAAAA,aAGI3B,KAAK4B,QAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,6CAK2BC,EAAWvB,CAAAA,CAAAA;AAAAA;AAAAA;AAAAA,EAGvD;AAAA;AAvC4BwB,EAAA,CAA3BC,EAAS,EAAEC,MAAMC,OAAAA,CAAAA,CAAAA,GADNtC,EACgBuC,WAAA,QAAA,IACDJ,EAAA,CAA1BC,EAAS,EAAEC,MAAMG,MAAAA,CAAAA,CAAAA,GAFNxC,EAEeuC,WAAA,iBAAA,IACEJ,EAAA,CAA5BC,EAAS,EAAEC,MAAMI,QAAAA,CAAAA,CAAAA,GAHNzC,EAGiBuC,WAAA,WAAA,IAHjBvC,IAANmC,EAAA,CADNO,EAAc,mBACF1C,CAAAA;"}

package/dist/json-DPnyOA3K.cjs

@@ -0,0 +1,12 @@
+"use strict";require("rxjs"),require("rxjs/operators"),require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const n=require("lit/decorators.js"),y=require("./tailwind.mixin-UijsBrYW.cjs"),h=require("lit"),g=require("lit/directives/unsafe-html.js"),p=require("./notification-service-ICRT05L0.cjs");var u=Object.defineProperty,d=Object.getOwnPropertyDescriptor,a=(e,t,s,c)=>{for(var i,r=c>1?void 0:c?d(t,s):t,o=e.length-1;o>=0;o--)(i=e[o])&&(r=(c?i(t,s,r):i(r))||r);return c&&r&&u(t,s,r),r};exports.SchmancyJson=class extends y.TailwindElement(h.css`:host { display: block }`){constructor(){super(...arguments),this.data={},this.highlightKeys=[],this.compact=!1}highlightChanges(e,t){let s=e;return t.forEach(c=>{const i=new RegExp(`("${c}":\\s*)([^,\\n}]+)`,"g");s=s.replace(i,(r,o,l)=>`${o}<span class="text-warning-default font-bold">${l}</span>`)}),s}async copyJSON(){try{await navigator.clipboard.writeText(JSON.stringify(this.data,null,2)),p.$notify.success("JSON copied to clipboard")}catch{p.$notify.error("Failed to copy JSON")}}render(){const e=JSON.stringify(this.data,null,this.compact?0:2),t=this.highlightKeys.length>0?this.highlightChanges(e,this.highlightKeys):e;return h.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}
+			>
+				<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">${g.unsafeHTML(t)}</pre>
+			</div>
+		`}},a([n.property({type:Object})],exports.SchmancyJson.prototype,"data",2),a([n.property({type:Array})],exports.SchmancyJson.prototype,"highlightKeys",2),a([n.property({type:Boolean})],exports.SchmancyJson.prototype,"compact",2),exports.SchmancyJson=a([n.customElement("schmancy-json")],exports.SchmancyJson);
+//# sourceMappingURL=json-DPnyOA3K.cjs.map

package/dist/json-DPnyOA3K.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"json-DPnyOA3K.cjs","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"],"names":["SchmancyJson","TailwindElement","css","constructor","super","arguments","this","data","highlightKeys","compact","json","changedKeys","highlighted","forEach","key","regex","RegExp","replace","_match","keyPart","valuePart","copyJSON","navigator","clipboard","writeText","JSON","stringify","$notify","success","error","jsonString","length","highlightChanges","html","unsafeHTML","__decorateClass","property","type","Object","prototype","Array","Boolean","customElement"],"mappings":"kgBAOaA,QAAAA,aAAN,cAA2BC,EAAAA,gBAAgBC,+BAAA,CAAA,CAA3C,aAAAC,CAAAC,MAAAA,GAAAC,WACsBC,KAAAC,KAA4B,CAAA,EAC7BD,KAAAE,cAA0B,CAAA,EACxBF,KAAAG,QAAAA,EAAU,CAE/B,iBAAiBC,EAAcC,EAAAA,CACtC,IAAIC,EAAcF,EAOlB,OANAC,EAAYE,QAAQC,GAAAA,CACnB,MAAMC,EAAQ,IAAIC,OAAO,KAAKF,sBAAyB,GAAA,EACvDF,EAAcA,EAAYK,QAAQF,EAAO,CAACG,EAAQC,EAASC,IACnD,GAAGD,CAAAA,gDAAuDC,cAG5DR,CACR,CAEA,gBAAcS,CACb,GAAA,CAAA,MACOC,UAAUC,UAAUC,UAAUC,KAAKC,UAAUpB,KAAKC,KAAM,KAAM,IACpEoB,EAAAA,QAAQC,QAAQ,0BAAA,CACjB,MAASC,CACRF,EAAAA,QAAQE,MAAM,qBAAA,CACf,CACD,CAEA,SACC,MAAMC,EAAaL,KAAKC,UAAUpB,KAAKC,KAAM,KAAMD,KAAKG,QAAU,EAAI,CAAA,EAChEG,EAAcN,KAAKE,cAAcuB,OAAS,EAAIzB,KAAK0B,iBAAiBF,EAAYxB,KAAKE,eAAiBsB,EAE5G,OAAOG,EAAAA;AAAAA;AAAAA;AAAAA,aAGI3B,KAAKe,QAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,6CAK2Ba,EAAAA,WAAWtB,CAAAA,CAAAA;AAAAA;AAAAA,GAGvD,CAAA,EAvC4BuB,EAAA,CAA3BC,WAAS,CAAEC,KAAMC,UADNtC,qBACgBuC,UAAA,OAAA,CAAA,EACDJ,EAAA,CAA1BC,WAAS,CAAEC,KAAMG,SAFNxC,qBAEeuC,UAAA,gBAAA,CAAA,EACEJ,EAAA,CAA5BC,WAAS,CAAEC,KAAMI,WAHNzC,qBAGiBuC,UAAA,UAAA,CAAA,EAHjBvC,QAAAA,aAANmC,EAAA,CADNO,EAAAA,cAAc,kBACF1C"}

package/dist/json.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./json-DPnyOA3K.cjs");Object.defineProperty(exports,"SchmancyJson",{enumerable:!0,get:()=>e.SchmancyJson});
+//# sourceMappingURL=json.cjs.map

package/dist/json.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"json.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/json.js

@@ -0,0 +1,5 @@
+import { S as c } from "./json-CvcloKQv.js";
+export {
+  c as SchmancyJson
+};
+//# sourceMappingURL=json.js.map

package/dist/json.js.map

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

package/dist/layout.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./flex-DytMcHmq.cjs");Object.defineProperty(exports,"SchmancyFlex",{enumerable:!0,get:()=>e.SchmancyFlex}),Object.defineProperty(exports,"SchmancyFlexV2",{enumerable:!0,get:()=>e.SchmancyFlexV2}),Object.defineProperty(exports,"SchmancyGrid",{enumerable:!0,get:()=>e.SchmancyGrid}),Object.defineProperty(exports,"SchmancyScroll",{enumerable:!0,get:()=>e.SchmancyScroll});
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./flex-DFSIy0t4.cjs"),c=require("./scroll-BqT7bvhu.cjs");Object.defineProperty(exports,"SchmancyFlex",{enumerable:!0,get:()=>e.SchmancyFlex}),Object.defineProperty(exports,"SchmancyFlexV2",{enumerable:!0,get:()=>e.SchmancyFlexV2}),Object.defineProperty(exports,"SchmancyGrid",{enumerable:!0,get:()=>e.SchmancyGrid}),Object.defineProperty(exports,"SchmancyScroll",{enumerable:!0,get:()=>c.SchmancyScroll});
 //# sourceMappingURL=layout.cjs.map

package/dist/layout.js

@@ -1,8 +1,9 @@
-import { S, c as m, a as h, b as l } from "./flex-CYQU6Pf8.js";
+import { S, b as m, a as r } from "./flex-53G-PJx7.js";
+import { S as e } from "./scroll-Bu-vAg3d.js";
 export {
   S as SchmancyFlex,
   m as SchmancyFlexV2,
-  h as SchmancyGrid,
-  l as SchmancyScroll
+  r as SchmancyGrid,
+  e as SchmancyScroll
 };
 //# sourceMappingURL=layout.js.map

package/dist/layout.js.map

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

package/dist/lightbox-service-3mHqBKEh.cjs

@@ -0,0 +1,202 @@
+"use strict";const l=require("lit"),u=require("lit/decorators.js"),I=require("lit/directives/when.js"),y=require("lit/directives/ref.js"),h=require("rxjs"),m=require("rxjs/operators");require("lit/directives/class-map.js");const k=require("lit/directives/style-map.js"),A=require("./tailwind.mixin-UijsBrYW.cjs"),N=require("./litElement.mixin-BVBdv0GP.cjs"),$=require("lit/directive.js"),q=require("lit/async-directive.js");var H=Object.defineProperty,O=Object.getOwnPropertyDescriptor,g=(s,e,t,i)=>{for(var a,n=i>1?void 0:i?O(e,t):e,o=s.length-1;o>=0;o--)(a=s[o])&&(n=(i?a(e,t,n):a(n))||n);return i&&n&&H(e,t,n),n};function C(s,e,t="up",i=.3){const a=(s.x+e.x)/2,n=(s.y+e.y)/2,o=Math.sqrt(Math.pow(e.x-s.x,2)+Math.pow(e.y-s.y,2)),r=Math.min(o*i,150);return{x:a,y:t==="up"?n-r:n+r}}exports.SchmancyLightbox=class extends N.$LitElement(l.css`
+	:host {
+		display: contents;
+	}
+`){constructor(){super(...arguments),this.src="",this.images=[],this.initialIndex=0,this.open=!1,this.currentIndex=0,this.isLoading=!1,this.swipeThreshold=50,this.overlayRef=y.createRef(),this.contentRef=y.createRef(),this.imageRef=y.createRef(),this.handleClose=()=>{this.open=!1},this.handlePrevious=()=>{this.isGalleryMode&&this.images.length>1&&(this.isLoading=!0,this.currentIndex=(this.currentIndex-1+this.images.length)%this.images.length,this.dispatchEvent(new CustomEvent("change",{detail:{index:this.currentIndex},bubbles:!0,composed:!0})))},this.handleNext=()=>{this.isGalleryMode&&this.images.length>1&&(this.isLoading=!0,this.currentIndex=(this.currentIndex+1)%this.images.length,this.dispatchEvent(new CustomEvent("change",{detail:{index:this.currentIndex},bubbles:!0,composed:!0})))},this.handleImageLoad=()=>{this.isLoading=!1},this.handleOverlayClick=s=>{s.target===s.currentTarget&&this.handleClose()}}get isGalleryMode(){return this.images.length>0}get currentImageSrc(){return this.isGalleryMode?this.images[this.currentIndex]||"":this.src}connectedCallback(){super.connectedCallback(),this.currentIndex=this.initialIndex}updated(s){super.updated(s),s.has("open")&&(this.open?(document.body.style.overflow="hidden",this.animateIn(),this.setupEventListeners()):(document.body.style.overflow="",this.animateOut())),s.has("initialIndex")&&(this.currentIndex=this.initialIndex),s.has("currentIndex")&&this.open&&this.animateImageChange()}animateIn(){const s=this.overlayRef.value,e=this.contentRef.value,t=this.imageRef.value;s&&(s.style.backgroundColor="rgba(0, 0, 0, 0)",s.style.opacity="0",s.animate([{opacity:0},{opacity:1}],{duration:300,easing:"cubic-bezier(0.25, 1, 0.5, 1)",fill:"forwards"}),requestAnimationFrame(()=>{s.style.backgroundColor="rgba(0, 0, 0, 0.95)"})),e&&e.animate([{transform:"scale(0.95)",opacity:0},{transform:"scale(1)",opacity:1}],{duration:400,delay:100,easing:"cubic-bezier(0.34, 1.56, 0.64, 1)",fill:"forwards"}),t&&t.animate([{opacity:0,transform:"scale(0.98)"},{opacity:1,transform:"scale(1)"}],{duration:350,delay:150,easing:"cubic-bezier(0.25, 1, 0.5, 1)",fill:"forwards"})}animateOut(){const s=this.overlayRef.value,e=this.contentRef.value,t=this.imageRef.value;t&&t.animate([{transform:"scale(1)",opacity:1},{transform:"scale(0.95)",opacity:0}],{duration:200,easing:"ease-out",fill:"forwards"}),e&&e.animate([{transform:"scale(1)",opacity:1},{transform:"scale(0.95)",opacity:0}],{duration:250,easing:"ease-out",fill:"forwards"}),s&&(s.animate([{opacity:1},{opacity:0}],{duration:250,delay:50,easing:"ease-out",fill:"forwards"}).onfinish=()=>{s.style.backgroundColor="rgba(0, 0, 0, 0)",this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0}))})}animateImageChange(){const s=this.imageRef.value;s&&(s.animate([{opacity:1,transform:"scale(1)"},{opacity:0,transform:"scale(0.98)"}],{duration:150,easing:"ease-out",fill:"forwards"}).onfinish=()=>{s.animate([{opacity:0,transform:"scale(0.98)"},{opacity:1,transform:"scale(1)"}],{duration:200,easing:"cubic-bezier(0.25, 1, 0.5, 1)",fill:"forwards"})})}setupEventListeners(){if(h.fromEvent(document,"keydown").pipe(m.filter(()=>this.open),m.tap(i=>{switch(i.key){case"Escape":this.handleClose();break;case"ArrowLeft":this.handlePrevious();break;case"ArrowRight":this.handleNext()}}),m.takeUntil(this.disconnecting)).subscribe(),!this.isGalleryMode||this.images.length<=1)return;const s=this.contentRef.value;if(!s)return;const e=h.fromEvent(s,"touchstart"),t=h.fromEvent(s,"touchend");e.pipe(m.switchMap(i=>{const a=i.touches[0].clientX;return t.pipe(m.first(),m.map(n=>n.changedTouches[0].clientX-a))}),m.filter(i=>Math.abs(i)>this.swipeThreshold),m.tap(i=>i>0?this.handlePrevious():this.handleNext()),m.takeUntil(this.disconnecting)).subscribe()}render(){return this.open?l.html`
+			<div
+				${y.ref(this.overlayRef)}
+				class="fixed inset-0 z-9999 flex items-center justify-center backdrop-blur-sm"
+				@click=${this.handleOverlayClick}
+			>
+				<div
+					${y.ref(this.contentRef)}
+					class="relative max-w-[90vw] max-h-[90vh]"
+					@click=${s=>s.stopPropagation()}
+				>
+					<!-- Close Button -->
+					<button
+						class="absolute top-4 right-4 md:top-4 md:right-4 sm:top-2 sm:right-2 bg-white/15 backdrop-blur-md border border-white/20 text-white w-11 h-11 rounded-full flex items-center justify-center cursor-pointer z-10 transition-all duration-200 hover:bg-white/25 hover:scale-105 active:scale-95"
+						@click=${this.handleClose}
+						aria-label="Close lightbox"
+						title="Close (Esc)"
+					>
+						<schmancy-icon>close</schmancy-icon>
+					</button>
+
+					<!-- Touch Zones for Gallery Navigation -->
+					${I.when(this.isGalleryMode&&this.images.length>1,()=>l.html`
+							<div
+								class="absolute top-0 bottom-0 left-0 w-1/3 cursor-pointer z-5"
+								@click=${this.handlePrevious}
+							></div>
+							<div
+								class="absolute top-0 bottom-0 right-0 w-1/3 cursor-pointer z-5"
+								@click=${this.handleNext}
+							></div>
+						`)}
+
+					<!-- Loading Spinner -->
+					${I.when(this.isLoading,()=>l.html`
+							<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">
+								<schmancy-progress indeterminate></schmancy-progress>
+							</div>
+						`)}
+
+					<!-- Main Image -->
+					<img
+						${y.ref(this.imageRef)}
+						class="max-w-[90vw] max-h-[90vh] object-contain rounded select-none touch-pinch-zoom ${this.isGalleryMode?"cursor-default":"cursor-pointer"}"
+						.src=${this.currentImageSrc}
+						alt="Full size image"
+						@load=${this.handleImageLoad}
+						@click=${()=>this.isGalleryMode?null:this.handleClose()}
+					/>
+
+					<!-- Navigation Controls (Gallery Mode Only) -->
+					${I.when(this.isGalleryMode&&this.images.length>1,()=>l.html`
+							<div
+								class="absolute bottom-[-3.5rem] md:bottom-[-3.5rem] sm:bottom-[-3rem] left-1/2 -translate-x-1/2 flex items-center gap-4 z-10"
+							>
+								<button
+									class="bg-white/15 backdrop-blur-md border border-white/20 text-white w-10 h-10 rounded-full flex items-center justify-center cursor-pointer transition-all duration-200 hover:bg-white/25 hover:scale-105 active:scale-95"
+									@click=${this.handlePrevious}
+									aria-label="Previous image"
+									title="Previous (←)"
+								>
+									<schmancy-icon>arrow_back</schmancy-icon>
+								</button>
+
+								<div class="text-white text-base font-medium min-w-16 text-center" aria-live="polite">
+									${this.currentIndex+1} / ${this.images.length}
+								</div>
+
+								<button
+									class="bg-white/15 backdrop-blur-md border border-white/20 text-white w-10 h-10 rounded-full flex items-center justify-center cursor-pointer transition-all duration-200 hover:bg-white/25 hover:scale-105 active:scale-95"
+									@click=${this.handleNext}
+									aria-label="Next image"
+									title="Next (→)"
+								>
+									<schmancy-icon>arrow_forward</schmancy-icon>
+								</button>
+							</div>
+						`)}
+				</div>
+			</div>
+		`:l.html``}},g([u.property({type:String})],exports.SchmancyLightbox.prototype,"src",2),g([u.property({type:Array})],exports.SchmancyLightbox.prototype,"images",2),g([u.property({type:Number})],exports.SchmancyLightbox.prototype,"initialIndex",2),g([u.property({type:Boolean})],exports.SchmancyLightbox.prototype,"open",2),g([u.state()],exports.SchmancyLightbox.prototype,"currentIndex",2),g([u.state()],exports.SchmancyLightbox.prototype,"isLoading",2),exports.SchmancyLightbox=g([u.customElement("schmancy-lightbox")],exports.SchmancyLightbox);class G extends q.AsyncDirective{constructor(e){if(super(e),this.hasAnimated=!1,e.type!==$.PartType.ELEMENT)throw new Error("flip directive can only be used on elements")}render(e){return l.noChange}update(e,[t]){this.element=e.element;const i=t?.sourceElement||t?.position;return!this.hasAnimated&&i&&(this.hasAnimated=!0,this.animateIn(t)),l.noChange}animateIn(e){if(!this.element||window.matchMedia("(prefers-reduced-motion: reduce)").matches)return;const t=e?.duration??600,i=e?.scale!==!1,a=e?.blackbird!==!1,n=(o=e?.position,o?"clientX"in o?{x:o.clientX,y:o.clientY}:"touches"in o&&o.touches.length?{x:o.touches[0].clientX,y:o.touches[0].clientY}:"x"in o&&"y"in o?{x:o.x,y:o.y}:null:null);var o;const r=e?.sourceElement?.getBoundingClientRect(),b=()=>{const d=this.element.getBoundingClientRect(),c={x:d.left+d.width/2,y:d.top+d.height/2};let x,f={x:.1,y:.1};r?(x={x:r.left+r.width/2,y:r.top+r.height/2},i&&(f={x:r.width/d.width,y:r.height/d.height})):x=n||{x:window.innerWidth/2,y:window.innerHeight/2};const L=x.x-c.x,E=x.y-c.y;if(a&&n&&r){const v={x:n.x-c.x,y:n.y-c.y},w=C(x,n,"up",.4),j=C(n,c,"down",.3),P={x:w.x-c.x,y:w.y-c.y},S={x:j.x-c.x,y:j.y-c.y},M=.3;this.element.animate([{transform:`translate(${L}px, ${E}px) scale(${f.x}, ${f.y})`,opacity:.6,offset:0},{transform:`translate(${P.x}px, ${P.y}px) scale(${.7*M})`,opacity:.8,offset:.25},{transform:`translate(${v.x}px, ${v.y}px) scale(${M})`,opacity:.9,offset:.5},{transform:`translate(${S.x}px, ${S.y}px) scale(0.6)`,opacity:.95,offset:.75},{transform:"translate(0, 0) scale(1)",opacity:1,offset:1}],{duration:t,easing:"cubic-bezier(0.34, 1.2, 0.64, 1)",fill:"forwards"})}else if(a&&n){const v=C(n,c,"down",.35),w={x:v.x-c.x,y:v.y-c.y};this.element.animate([{transform:`translate(${L}px, ${E}px) scale(0.1)`,opacity:0,offset:0},{transform:`translate(${w.x}px, ${w.y}px) scale(0.5)`,opacity:.8,offset:.5},{transform:"translate(0, 0) scale(1)",opacity:1,offset:1}],{duration:t,easing:"cubic-bezier(0.34, 1.2, 0.64, 1)",fill:"forwards"})}else this.element.animate([{transform:`translate(${L}px, ${E}px) scale(${f.x}, ${f.y})`,opacity:0},{transform:"translate(0, 0) scale(1, 1)",opacity:1}],{duration:t,easing:e?.easing??"cubic-bezier(0.34, 1.56, 0.64, 1)",fill:"forwards"})};this.element instanceof HTMLImageElement?this.element.complete?requestAnimationFrame(b):this.element.onload=()=>requestAnimationFrame(b):requestAnimationFrame(b)}}const R=$.directive(G);class T extends q.AsyncDirective{constructor(e){if(super(e),this.currentIndex=0,this.images=[],e.type!==$.PartType.ELEMENT)throw new Error("lightbox directive can only be used on elements")}render(e){return l.noChange}update(e,[t]){return this.element=e.element,this.clickHandler||(this.clickHandler=i=>{if(i.preventDefault(),i.stopPropagation(),"clientX"in i)this.clickPosition={x:i.clientX,y:i.clientY};else if("touches"in i&&i.touches.length){const a=i.touches[0];this.clickPosition={x:a.clientX,y:a.clientY}}t?.images&&t.images.length>0?(this.images=t.images,this.currentIndex=t.index||0):(this.images=[this.element.src],this.currentIndex=0),this.overlay=t?.overlay,this.open()},this.element.addEventListener("click",this.clickHandler),this.element.style.cursor="pointer",this.element.classList.add("hover:opacity-80","transition-opacity")),l.noChange}open(){this.overlayElement=document.createElement("div"),this.overlayElement.className="fixed inset-0 flex items-center justify-center opacity-0 bg-black/95 backdrop-blur-sm",this.overlayElement.style.zIndex="1000",l.render(this.renderLightbox(),this.overlayElement),document.body.appendChild(this.overlayElement),document.body.style.overflow="hidden",requestAnimationFrame(()=>{this.overlayElement.animate([{opacity:0},{opacity:1}],{duration:300,easing:"cubic-bezier(0.25, 1, 0.5, 1)",fill:"forwards"})}),this.keyHandler=e=>{e.key==="Escape"&&this.close(),e.key==="ArrowLeft"&&this.images.length>1&&this.prev(),e.key==="ArrowRight"&&this.images.length>1&&this.next()},document.addEventListener("keydown",this.keyHandler),this.overlayElement.addEventListener("click",e=>{e.target===this.overlayElement&&this.close()})}close(){if(!this.overlayElement)return;const e=this.overlayElement.querySelector("[data-lightbox-content]");if(e&&this.clickPosition){const t=e.getBoundingClientRect(),i=this.clickPosition.x-(t.left+t.width/2),a=this.clickPosition.y-(t.top+t.height/2),n=e.animate([{transform:"translate(0, 0) scale(1)",opacity:1},{transform:`translate(${i}px, ${a}px) scale(0.1)`,opacity:0}],{duration:300,easing:"cubic-bezier(0.4, 0, 0.2, 1)",fill:"forwards"});this.overlayElement.animate([{opacity:1},{opacity:0}],{duration:250,easing:"ease-out",fill:"forwards"}),n.onfinish=()=>{this.overlayElement?.remove(),this.overlayElement=void 0,document.body.style.overflow=""}}else this.overlayElement.animate([{opacity:1},{opacity:0}],{duration:250,easing:"ease-out",fill:"forwards"}).onfinish=()=>{this.overlayElement?.remove(),this.overlayElement=void 0,document.body.style.overflow=""};this.keyHandler&&(document.removeEventListener("keydown",this.keyHandler),this.keyHandler=void 0)}prev(){this.currentIndex=(this.currentIndex-1+this.images.length)%this.images.length,this.updateImage()}next(){this.currentIndex=(this.currentIndex+1)%this.images.length,this.updateImage()}updateImage(){this.overlayElement&&l.render(this.renderLightbox(),this.overlayElement)}renderLightbox(){const e=this.images[this.currentIndex],t=this.images.length>1;return l.html`
+			<div
+				data-lightbox-content
+				class="relative"
+				style=${k.styleMap({transformOrigin:"center center"})}
+				@click=${i=>i.stopPropagation()}
+			>
+				<!-- Close button -->
+				<button
+					class="absolute top-2 right-2 z-10 w-10 h-10 rounded-full bg-white/20 hover:bg-white/30 flex items-center justify-center text-white transition-colors"
+					@click=${()=>this.close()}
+					aria-label="Close"
+				>
+					<span class="text-2xl">×</span>
+				</button>
+
+				<!-- Image container with optional overlay -->
+				<div class="relative">
+					<img
+						src=${e}
+						${R({sourceElement:this.element,position:this.clickPosition,duration:600,scale:!0,blackbird:!0})}
+						class="object-contain rounded-lg"
+						style="max-height: calc(100vh - 40px); max-width: 90vw;"
+						@click=${()=>!t&&this.close()}
+					/>
+					${this.overlay?this.overlay:""}
+				</div>
+
+				<!-- Gallery controls -->
+				${t?l.html`
+							<div class="flex items-center justify-center gap-4 text-white mt-4">
+								<button
+									class="w-10 h-10 rounded-full bg-white/20 hover:bg-white/30 flex items-center justify-center transition-colors"
+									@click=${()=>this.prev()}
+									aria-label="Previous"
+								>
+									←
+								</button>
+
+								<div class="text-lg">${this.currentIndex+1} / ${this.images.length}</div>
+
+								<button
+									class="w-10 h-10 rounded-full bg-white/20 hover:bg-white/30 flex items-center justify-center transition-colors"
+									@click=${()=>this.next()}
+									aria-label="Next"
+								>
+									→
+								</button>
+							</div>
+						`:""}
+			</div>
+		`}disconnected(){this.element&&this.clickHandler&&this.element.removeEventListener("click",this.clickHandler),this.close()}}const z=$.directive(T);class p{constructor(){this.pushSubject=new h.Subject,this.dismissSubject=new h.Subject,this.setupLightboxOpeningLogic(),this.setupLightboxDismissLogic()}static getInstance(){return p.instance||(p.instance=new p),p.instance}setupLightboxOpeningLogic(){this.pushSubject.pipe(h.switchMap(e=>A.discoverComponent("schmancy-theme").pipe(h.map(t=>{const i=t||document.body,a=document.createElement("div");return a.className="fixed inset-0 flex items-center justify-center opacity-0 bg-black/95 backdrop-blur-sm",a.style.zIndex="1000",i.appendChild(a),document.body.style.overflow="hidden",{overlay:a,config:e,container:i}}))),h.tap(({overlay:e,config:t})=>{let i=[],a=0;t.images&&t.images.length>0?(i=t.images,a=t.index||0):t.image&&(i=[t.image],a=0),this.activeLightbox={element:e,config:t,currentIndex:a,images:i},h.fromEvent(document,"keydown").pipe(h.takeUntil(this.dismissSubject),h.filter(()=>!!this.activeLightbox),h.tap(n=>{n.key==="Escape"&&this.dismiss(),n.key==="ArrowLeft"&&this.activeLightbox.images.length>1&&this.navigatePrev(),n.key==="ArrowRight"&&this.activeLightbox.images.length>1&&this.navigateNext()})).subscribe(),h.fromEvent(e,"click").pipe(h.takeUntil(this.dismissSubject),h.filter(n=>n.target===e),h.tap(()=>this.dismiss())).subscribe(),t.component?this.renderComponent(e,t):this.renderLightbox(e,t,i,a),requestAnimationFrame(()=>{e.animate([{opacity:0},{opacity:1}],{duration:300,easing:"cubic-bezier(0.25, 1, 0.5, 1)",fill:"forwards"})})})).subscribe()}setupLightboxDismissLogic(){this.dismissSubject.pipe(h.tap(()=>{if(!this.activeLightbox)return;const{element:e}=this.activeLightbox;e.animate([{opacity:1},{opacity:0}],{duration:250,easing:"ease-out",fill:"forwards"}).onfinish=()=>{e.remove(),document.body.style.overflow=""},this.activeLightbox=void 0})).subscribe()}push(e){this.activeLightbox&&this.dismiss(),this.pushSubject.next(e)}dismiss(){this.dismissSubject.next()}navigatePrev(){if(!this.activeLightbox||this.activeLightbox.images.length<=1)return;const{images:e,config:t,element:i}=this.activeLightbox;this.activeLightbox.currentIndex=(this.activeLightbox.currentIndex-1+e.length)%e.length,this.renderLightbox(i,t,e,this.activeLightbox.currentIndex)}navigateNext(){if(!this.activeLightbox||this.activeLightbox.images.length<=1)return;const{images:e,config:t,element:i}=this.activeLightbox;this.activeLightbox.currentIndex=(this.activeLightbox.currentIndex+1)%e.length,this.renderLightbox(i,t,e,this.activeLightbox.currentIndex)}renderComponent(e,t){if(!t.component)return;let i;i=typeof t.component=="string"?document.createElement(t.component):new t.component,t.props&&Object.entries(t.props).forEach(([o,r])=>{i[o]=r});const a=l.html`
+			<div class="relative" @click=${o=>o.stopPropagation()}>
+				<!-- Close button -->
+				<button
+					class="absolute -top-12 right-0 z-10 w-10 h-10 rounded-full bg-white/20 hover:bg-white/30 flex items-center justify-center text-white transition-colors"
+					@click=${()=>this.dismiss()}
+					aria-label="Close"
+				>
+					<span class="text-2xl">×</span>
+				</button>
+
+				<!-- Component container -->
+				<div id="lightbox-component-container"></div>
+			</div>
+		`;l.render(a,e);const n=e.querySelector("#lightbox-component-container");n&&n.appendChild(i)}renderLightbox(e,t,i,a){const n=i[a],o=i.length>1;let r=null;t.overlay&&(typeof t.overlay=="string"?r=document.createElement(t.overlay):typeof t.overlay=="function"&&(r=new t.overlay),t.props&&r&&Object.entries(t.props).forEach(([d,c])=>{r[d]=c}));const b=l.html`
+			<div
+				class="relative"
+				style=${k.styleMap({maxWidth:"90vw",maxHeight:"90vh"})}
+				@click=${d=>d.stopPropagation()}
+			>
+				<!-- Close button -->
+				<button
+					class="absolute top-4 right-4 z-10 w-10 h-10 rounded-full bg-white/20 hover:bg-white/30 flex items-center justify-center text-white transition-colors"
+					@click=${()=>this.dismiss()}
+					aria-label="Close"
+				>
+					<span class="text-2xl">×</span>
+				</button>
+
+				<!-- Image container with optional overlay -->
+				<div class="relative" id="lightbox-image-container">
+					<img
+						src=${n}
+						class="max-w-full object-contain rounded-lg"
+						style=${k.styleMap({maxHeight:"85vh"})}
+						@click=${()=>!o&&this.dismiss()}
+					/>
+				</div>
+
+				<!-- Gallery controls -->
+				${o?l.html`
+							<div
+								class="absolute left-1/2 -translate-x-1/2 flex items-center gap-4 text-white"
+								style=${k.styleMap({bottom:"-60px"})}
+							>
+								<button
+									class="w-10 h-10 rounded-full bg-white/20 hover:bg-white/30 flex items-center justify-center transition-colors"
+									@click=${()=>this.navigatePrev()}
+									aria-label="Previous"
+								>
+									←
+								</button>
+
+								<div class="text-lg">${a+1} / ${i.length}</div>
+
+								<button
+									class="w-10 h-10 rounded-full bg-white/20 hover:bg-white/30 flex items-center justify-center transition-colors"
+									@click=${()=>this.navigateNext()}
+									aria-label="Next"
+								>
+									→
+								</button>
+							</div>
+						`:""}
+			</div>
+		`;if(l.render(b,e),r){const d=e.querySelector("#lightbox-image-container");if(d){const c=d.querySelector("[data-lightbox-overlay]");c&&c.remove(),r.setAttribute("data-lightbox-overlay",""),d.appendChild(r)}}}}const X=Object.assign(s=>z(s),{push:s=>p.getInstance().push(s),dismiss:()=>p.getInstance().dismiss()});exports.flip=R,exports.lightbox=z,exports.lightbox$1=X;
+//# sourceMappingURL=lightbox-service-3mHqBKEh.cjs.map