@mhmo91/schmancy 0.10.29 → 0.10.30

package/dist/{layout-eXb9wjDh.cjs.map → layout-B0dct--7.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"layout-eXb9wjDh.cjs","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-B0dct--7.cjs","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.cjs

@@ -1,4 +1,4 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=require(`./active-host-jH3iloCR.cjs`);let n=require(`rxjs`),r=require(`lit/decorators.js`),i=require(`lit`);var a=class extends e.c{constructor(...e){super(...e),this.hide=!1,this.direction=`both`,this.debounce=10}static{this.styles=[i.css`
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-CncqDLb2.cjs`);const e=require(`./SchmancyElement-DhSiMp6Y.cjs`);require(`./mixins-YQI9JogS.cjs`);let t=require(`rxjs`),n=require(`lit/decorators.js`),r=require(`lit`);var i=class extends e.t{constructor(...e){super(...e),this.hide=!1,this.direction=`both`,this.debounce=10}static{this.styles=[r.css`
 	:host {
 		/* Flexible sizing for different layout contexts */
 		width: 100%;
@@ -23,4 +23,4 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./ch
 	:host([hide])::-webkit-scrollbar {
 		display: none; /* Chrome, Safari, and Opera */
 	}
-`]}get scroller(){return this}scrollTo(e,t){typeof e==`number`?super.scrollTo({top:e,behavior:t?`smooth`:`auto`}):e?super.scrollTo(e):super.scrollTo({top:0,left:0,behavior:`auto`})}scrollToLeft(e,t=`auto`){super.scrollTo({left:e,behavior:t})}connectedCallback(){super.connectedCallback(),this.updateScrollingStyles(),this.updateLayoutContext(),this.setAttribute(`part`,`scroller`)}updateScrollingStyles(){this.direction===`horizontal`?(this.style.setProperty(`overflow-y`,`hidden`),this.style.setProperty(`overflow-x`,`auto`)):this.direction===`vertical`?(this.style.setProperty(`overflow-y`,`auto`),this.style.setProperty(`overflow-x`,`hidden`)):(this.style.setProperty(`overflow-y`,`auto`),this.style.setProperty(`overflow-x`,`auto`))}updateLayoutContext(){requestAnimationFrame(()=>{let e=this.parentElement;if(e){let t=getComputedStyle(e);t.display===`flex`||t.display===`inline-flex`?this.classList.remove(`explicit-height`):this.classList.add(`explicit-height`)}else this.classList.add(`explicit-height`)})}updated(e){super.updated(e),e.has(`direction`)&&this.updateScrollingStyles(),this.updateLayoutContext()}firstUpdated(){(0,n.fromEvent)(this.scroller,`scroll`,{passive:!0}).pipe((0,n.debounceTime)(this.debounce),(0,n.takeUntil)(this.disconnecting)).subscribe(e=>{let t=this.scroller.scrollTop,n=this.scroller.scrollHeight,r=this.scroller.clientHeight,i=this.scroller.scrollLeft,a=this.scroller.scrollWidth,o=this.scroller.clientWidth;this.dispatchEvent(new CustomEvent(`scroll`,{detail:{scrollTop:t,scrollHeight:n,clientHeight:r,e,scrollLeft:i,scrollWidth:a,clientWidth:o},bubbles:!0,composed:!0}))}),(0,n.fromEvent)(window,`@schmancy:scrollTo`).pipe((0,n.filter)(e=>this.name!==void 0&&e.detail.name===this.name),(0,n.takeUntil)(this.disconnecting)).subscribe(e=>{if(e.detail.action===`scrollTo`&&typeof e.detail.top==`number`){let t={behavior:`smooth`,top:e.detail.top};typeof e.detail.left==`number`&&(t.left=e.detail.left),this.scrollTo(t)}})}render(){return i.html`<slot></slot>`}};t.a([(0,r.property)({type:Boolean,reflect:!0})],a.prototype,`hide`,void 0),t.a([(0,r.property)({type:String,reflect:!0})],a.prototype,`name`,void 0),t.a([(0,r.property)({type:String,reflect:!0})],a.prototype,`direction`,void 0),t.a([(0,r.property)({type:Number})],a.prototype,`debounce`,void 0),a=t.a([(0,r.customElement)(`schmancy-scroll`)],a),Object.defineProperty(exports,`SchmancyScroll`,{enumerable:!0,get:function(){return a}});
+`]}get scroller(){return this}scrollTo(e,t){typeof e==`number`?super.scrollTo({top:e,behavior:t?`smooth`:`auto`}):e?super.scrollTo(e):super.scrollTo({top:0,left:0,behavior:`auto`})}scrollToLeft(e,t=`auto`){super.scrollTo({left:e,behavior:t})}connectedCallback(){super.connectedCallback(),this.updateScrollingStyles(),this.updateLayoutContext(),this.setAttribute(`part`,`scroller`)}updateScrollingStyles(){this.direction===`horizontal`?(this.style.setProperty(`overflow-y`,`hidden`),this.style.setProperty(`overflow-x`,`auto`)):this.direction===`vertical`?(this.style.setProperty(`overflow-y`,`auto`),this.style.setProperty(`overflow-x`,`hidden`)):(this.style.setProperty(`overflow-y`,`auto`),this.style.setProperty(`overflow-x`,`auto`))}updateLayoutContext(){requestAnimationFrame(()=>{let e=this.parentElement;if(e){let t=getComputedStyle(e);t.display===`flex`||t.display===`inline-flex`?this.classList.remove(`explicit-height`):this.classList.add(`explicit-height`)}else this.classList.add(`explicit-height`)})}updated(e){super.updated(e),e.has(`direction`)&&this.updateScrollingStyles(),this.updateLayoutContext()}firstUpdated(){(0,t.fromEvent)(this.scroller,`scroll`,{passive:!0}).pipe((0,t.debounceTime)(this.debounce),(0,t.takeUntil)(this.disconnecting)).subscribe(e=>{let t=this.scroller.scrollTop,n=this.scroller.scrollHeight,r=this.scroller.clientHeight,i=this.scroller.scrollLeft,a=this.scroller.scrollWidth,o=this.scroller.clientWidth;this.dispatchEvent(new CustomEvent(`scroll`,{detail:{scrollTop:t,scrollHeight:n,clientHeight:r,e,scrollLeft:i,scrollWidth:a,clientWidth:o},bubbles:!0,composed:!0}))}),(0,t.fromEvent)(window,`@schmancy:scrollTo`).pipe((0,t.filter)(e=>this.name!==void 0&&e.detail.name===this.name),(0,t.takeUntil)(this.disconnecting)).subscribe(e=>{if(e.detail.action===`scrollTo`&&typeof e.detail.top==`number`){let t={behavior:`smooth`,top:e.detail.top};typeof e.detail.left==`number`&&(t.left=e.detail.left),this.scrollTo(t)}})}render(){return r.html`<slot></slot>`}};e.p([(0,n.property)({type:Boolean,reflect:!0})],i.prototype,`hide`,void 0),e.p([(0,n.property)({type:String,reflect:!0})],i.prototype,`name`,void 0),e.p([(0,n.property)({type:String,reflect:!0})],i.prototype,`direction`,void 0),e.p([(0,n.property)({type:Number})],i.prototype,`debounce`,void 0),i=e.p([(0,n.customElement)(`schmancy-scroll`)],i),Object.defineProperty(exports,`SchmancyScroll`,{enumerable:!0,get:function(){return i}});

package/dist/layout.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"layout.cjs","names":[],"sources":["../src/layout/scroll/scroll.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { debounceTime, filter, fromEvent, takeUntil } from 'rxjs'\n\n/**\n * Custom scroll event interface for the SchmancyScroll component.\n * Contains detailed information about the scroll state.\n */\nexport interface SchmancyScrollEvent\n\textends CustomEvent<{\n\t\t/** Current scroll position from the top */\n\t\tscrollTop: number\n\t\t/** Total scrollable height of the content */\n\t\tscrollHeight: number\n\t\t/** Visible height of the container */\n\t\tclientHeight: number\n\t\t/** Original scroll event */\n\t\te: Event\n\t\t/** Current scroll position from the left (for horizontal scrolling) */\n\t\tscrollLeft?: number\n\t\t/** Total scrollable width of the content (for horizontal scrolling) */\n\t\tscrollWidth?: number\n\t\t/** Visible width of the container (for horizontal scrolling) */\n\t\tclientWidth?: number\n\t}> {}\n\n/**\n * Command event interface for controlling SchmancyScroll components\n */\nexport interface SchmancyScrollCommandEvent\n\textends CustomEvent<{\n\t\t/** Target component name */\n\t\tname: string\n\t\t/** Command action to perform */\n\t\taction: 'scrollTo'\n\t\t/** Scroll position for scrollTo action */\n\t\ttop: number\n\t\t/** Horizontal scroll position for scrollTo action (optional) */\n\t\tleft?: number\n\t}> {}\n\n// Augment the HTMLElementEventMap to include our custom events\ndeclare global {\n\tinterface HTMLElementEventMap {\n\t\tscroll: SchmancyScrollEvent\n\t\t'schmancy-scroll-command': SchmancyScrollCommandEvent\n\t}\n}\n\n/**\n * A custom scrollable container with enhanced features.\n *\n * @fires {SchmancyScrollEvent} scroll - Fired when scrolling occurs (with a configurable debounce)\n * @slot - Default slot for content to be scrolled\n * @csspart scroller - The inner scrollable div element\n *\n * @example\n * ```html\n * <schmancy-scroll hide name=\"main-content\">\n *   <div>Scrollable content goes here</div>\n * </schmancy-scroll>\n * ```\n *\n * @example\n * ```html\n * <schmancy-scroll direction=\"horizontal\" hide name=\"image-carousel\">\n *   <div class=\"flex\">\n *     <img src=\"image1.jpg\" alt=\"Image 1\">\n *     <img src=\"image2.jpg\" alt=\"Image 2\">\n *   </div>\n * </schmancy-scroll>\n * ```\n *\n * @example Programmatic scroll with Lit ref\n * ```typescript\n * private scrollRef = createRef<HTMLElement>()\n *\n * // In template:\n * html`<schmancy-scroll ${ref(this.scrollRef)}>...</schmancy-scroll>`\n *\n * // Scroll to top (smooth — host has scroll-behavior: smooth):\n * this.scrollRef.value?.scrollTo({ top: 0 })\n * ```\n */\n@customElement('schmancy-scroll')\nexport class SchmancyScroll extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\t/* Flexible sizing for different layout contexts */\n\t\twidth: 100%;\n\t\tmin-height: 0; /* Allow flex shrinking */\n\t\tflex: 1; /* Grow in flex containers */\n\t\tbox-sizing: border-box; /* Ensures proper sizing */\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tscroll-behavior: smooth;\n\t\toverscroll-behavior-x: contain;\n\t\toverscroll-behavior-y: auto;\n\t}\n\t/* Fallback for non-flex contexts */\n\t:host(.explicit-height) {\n\t\theight: 100%;\n\t\tflex: none;\n\t}\n\t:host([hide]) {\n\t\t-ms-overflow-style: none; /* IE and Edge */\n\t\tscrollbar-width: none; /* Firefox */\n\t}\n\t:host([hide])::-webkit-scrollbar {\n\t\tdisplay: none; /* Chrome, Safari, and Opera */\n\t}\n`];\n\t/**\n\t * Determines whether the scrollbar is hidden.\n\t *\n\t * When `hide` is true, the host element's scrollbars are hidden\n\t * in supported browsers using CSS.\n\t *\n\t * @attr hide\n\t * @example <schmancy-scroll hide></schmancy-scroll>\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tpublic hide = false\n\n\t/**\n\t * Optional name identifier for the component.\n\t * Used for targeting this specific component with global events.\n\t *\n\t * @attr name\n\t * @example <schmancy-scroll name=\"main-content\"></schmancy-scroll>\n\t */\n\t@property({ type: String, reflect: true })\n\tpublic name?: string\n\n\t/**\n\t * Direction of scrolling: vertical, horizontal, or both.\n\t * - vertical: Only allows vertical scrolling\n\t * - horizontal: Only allows horizontal scrolling\n\t * - both: Allows both horizontal and vertical scrolling (default)\n\t *\n\t * @attr direction\n\t * @example <schmancy-scroll direction=\"horizontal\"></schmancy-scroll>\n\t */\n\t@property({ type: String, reflect: true })\n\tpublic direction: 'vertical' | 'horizontal' | 'both' = 'both'\n\n\t/**\n\t * Reference to the scrollable element (the host element itself)\n\t * @public\n\t */\n\tget scroller(): HTMLElement {\n\t\treturn this\n\t}\n\n\t/**\n\t * Debounce time in milliseconds for the scroll event.\n\t * Higher values reduce the frequency of scroll events being dispatched.\n\t *\n\t * @attr debounce\n\t * @example <schmancy-scroll debounce=\"50\"></schmancy-scroll>\n\t */\n\t@property({ type: Number })\n\tpublic debounce = 10\n\n\t/**\n\t * Scrolls the container to the specified position\n\t * @param options - ScrollToOptions or a number representing the top position\n\t * @param top - For backward compatibility, if options is a number, this is treated as \"behavior\"\n\t */\n\tpublic override scrollTo(options?: ScrollToOptions | number, top?: number): void {\n\t\tif (typeof options === 'number') {\n\t\t\tsuper.scrollTo({ top: options, behavior: top ? 'smooth' : 'auto' })\n\t\t} else if (options) {\n\t\t\tsuper.scrollTo(options)\n\t\t} else {\n\t\t\tsuper.scrollTo({ top: 0, left: 0, behavior: 'auto' })\n\t\t}\n\t}\n\n\t/**\n\t * Scrolls the container horizontally to the specified position\n\t * @param left - The horizontal position to scroll to (in pixels)\n\t * @param behavior - The scroll behavior ('auto' or 'smooth')\n\t */\n\tpublic scrollToLeft(left: number, behavior: ScrollBehavior = 'auto'): void {\n\t\tsuper.scrollTo({ left, behavior })\n\t}\n\n\t/**\n\t * Called when the component is connected to the DOM\n\t * Applies scrolling styles directly to the host element\n\t * @protected\n\t */\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tthis.updateScrollingStyles()\n\t\tthis.updateLayoutContext()\n\t\t// Set the part attribute on the host element\n\t\tthis.setAttribute('part', 'scroller')\n\t}\n\n\t/**\n\t * Updates the overflow styles based on the direction property\n\t * @private\n\t */\n\tprivate updateScrollingStyles(): void {\n\t\t// Apply overflow styles based on direction\n\t\tif (this.direction === 'horizontal') {\n\t\t\tthis.style.setProperty('overflow-y', 'hidden')\n\t\t\tthis.style.setProperty('overflow-x', 'auto')\n\t\t} else if (this.direction === 'vertical') {\n\t\t\tthis.style.setProperty('overflow-y', 'auto')\n\t\t\tthis.style.setProperty('overflow-x', 'hidden')\n\t\t} else {\n\t\t\t// both\n\t\t\tthis.style.setProperty('overflow-y', 'auto')\n\t\t\tthis.style.setProperty('overflow-x', 'auto')\n\t\t}\n\t}\n\n\t/**\n\t * Updates the layout context based on parent container type\n\t * @private\n\t */\n\tprivate updateLayoutContext(): void {\n\t\t// Use requestAnimationFrame to ensure DOM is fully rendered\n\t\trequestAnimationFrame(() => {\n\t\t\t// Check if parent is a flex container\n\t\t\tconst parent = this.parentElement\n\t\t\tif (parent) {\n\t\t\t\tconst parentStyles = getComputedStyle(parent)\n\t\t\t\tconst isFlexParent = parentStyles.display === 'flex' || parentStyles.display === 'inline-flex'\n\n\t\t\t\t// For debugging - remove in production\n\t\t\t\tconsole.debug('schmancy-scroll parent detection:', {\n\t\t\t\t\tparent: parent.tagName,\n\t\t\t\t\tdisplay: parentStyles.display,\n\t\t\t\t\tisFlexParent,\n\t\t\t\t})\n\n\t\t\t\t// Apply appropriate class based on parent layout\n\t\t\t\tif (isFlexParent) {\n\t\t\t\t\tthis.classList.remove('explicit-height')\n\t\t\t\t} else {\n\t\t\t\t\tthis.classList.add('explicit-height')\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// Default to explicit height if no parent\n\t\t\t\tthis.classList.add('explicit-height')\n\t\t\t}\n\t\t})\n\t}\n\n\t/**\n\t * Called when properties change\n\t * @protected\n\t */\n\tprotected updated(changedProperties: Map<string | number | symbol, unknown>): void {\n\t\tsuper.updated(changedProperties)\n\t\t// Update styles if direction changes\n\t\tif (changedProperties.has('direction')) {\n\t\t\tthis.updateScrollingStyles()\n\t\t}\n\t\t// Always update layout context in case parent layout changed\n\t\tthis.updateLayoutContext()\n\t}\n\n\t/**\n\t * Called after the component's first update\n\t * Sets up the scroll event listener with debouncing\n\t * @protected\n\t */\n\tprotected firstUpdated(): void {\n\t\t// Set up scroll event listening with debounce\n\t\tfromEvent(this.scroller, 'scroll', {\n\t\t\tpassive: true,\n\t\t})\n\t\t\t.pipe(\n\t\t\t\tdebounceTime(this.debounce),\n\t\t\t\ttakeUntil(this.disconnecting), // Unsubscribe when the element is destroyed\n\t\t\t)\n\t\t\t.subscribe(e => {\n\t\t\t\t// Always include the original required properties for backward compatibility\n\t\t\t\tconst scrollTop = this.scroller.scrollTop\n\t\t\t\tconst scrollHeight = this.scroller.scrollHeight\n\t\t\t\tconst clientHeight = this.scroller.clientHeight\n\n\t\t\t\t// Include horizontal scroll information as optional properties\n\t\t\t\tconst scrollLeft = this.scroller.scrollLeft\n\t\t\t\tconst scrollWidth = this.scroller.scrollWidth\n\t\t\t\tconst clientWidth = this.scroller.clientWidth\n\n\t\t\t\tthis.dispatchEvent(\n\t\t\t\t\tnew CustomEvent('scroll', {\n\t\t\t\t\t\tdetail: {\n\t\t\t\t\t\t\t// Original required properties first\n\t\t\t\t\t\t\tscrollTop,\n\t\t\t\t\t\t\tscrollHeight,\n\t\t\t\t\t\t\tclientHeight,\n\t\t\t\t\t\t\te,\n\t\t\t\t\t\t\t// New optional properties last\n\t\t\t\t\t\t\tscrollLeft,\n\t\t\t\t\t\t\tscrollWidth,\n\t\t\t\t\t\t\tclientWidth,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}) as SchmancyScrollEvent,\n\t\t\t\t)\n\t\t\t})\n\n\t\t// Set up global command event listener\n\t\tfromEvent<SchmancyScrollCommandEvent>(window, '@schmancy:scrollTo')\n\t\t\t.pipe(\n\t\t\t\t// Only process events targeting this component by name\n\t\t\t\tfilter(e => this.name !== undefined && e.detail.name === this.name),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(e => {\n\t\t\t\tif (e.detail.action === 'scrollTo' && typeof e.detail.top === 'number') {\n\t\t\t\t\tconst options: ScrollToOptions = {\n\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\ttop: e.detail.top, // Required for backward compatibility\n\t\t\t\t\t}\n\n\t\t\t\t\t// Add optional left position if provided\n\t\t\t\t\tif (typeof e.detail.left === 'number') {\n\t\t\t\t\t\toptions.left = e.detail.left\n\t\t\t\t\t}\n\n\t\t\t\t\tthis.scrollTo(options)\n\t\t\t\t}\n\t\t\t})\n\t}\n\n\t/**\n\t * Renders the component template\n\t * @returns {TemplateResult} The template to render\n\t * @protected\n\t */\n\tprotected render() {\n\t\t// Only render the slot, all styling is applied to the host\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-scroll': SchmancyScroll\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"file":"layout.cjs","names":[],"sources":["../src/layout/scroll/scroll.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { debounceTime, filter, fromEvent, takeUntil } from 'rxjs'\n\n/**\n * Custom scroll event interface for the SchmancyScroll component.\n * Contains detailed information about the scroll state.\n */\nexport interface SchmancyScrollEvent\n\textends CustomEvent<{\n\t\t/** Current scroll position from the top */\n\t\tscrollTop: number\n\t\t/** Total scrollable height of the content */\n\t\tscrollHeight: number\n\t\t/** Visible height of the container */\n\t\tclientHeight: number\n\t\t/** Original scroll event */\n\t\te: Event\n\t\t/** Current scroll position from the left (for horizontal scrolling) */\n\t\tscrollLeft?: number\n\t\t/** Total scrollable width of the content (for horizontal scrolling) */\n\t\tscrollWidth?: number\n\t\t/** Visible width of the container (for horizontal scrolling) */\n\t\tclientWidth?: number\n\t}> {}\n\n/**\n * Command event interface for controlling SchmancyScroll components\n */\nexport interface SchmancyScrollCommandEvent\n\textends CustomEvent<{\n\t\t/** Target component name */\n\t\tname: string\n\t\t/** Command action to perform */\n\t\taction: 'scrollTo'\n\t\t/** Scroll position for scrollTo action */\n\t\ttop: number\n\t\t/** Horizontal scroll position for scrollTo action (optional) */\n\t\tleft?: number\n\t}> {}\n\n// Augment the HTMLElementEventMap to include our custom events\ndeclare global {\n\tinterface HTMLElementEventMap {\n\t\tscroll: SchmancyScrollEvent\n\t\t'schmancy-scroll-command': SchmancyScrollCommandEvent\n\t}\n}\n\n/**\n * A custom scrollable container with enhanced features.\n *\n * @fires {SchmancyScrollEvent} scroll - Fired when scrolling occurs (with a configurable debounce)\n * @slot - Default slot for content to be scrolled\n * @csspart scroller - The inner scrollable div element\n *\n * @example\n * ```html\n * <schmancy-scroll hide name=\"main-content\">\n *   <div>Scrollable content goes here</div>\n * </schmancy-scroll>\n * ```\n *\n * @example\n * ```html\n * <schmancy-scroll direction=\"horizontal\" hide name=\"image-carousel\">\n *   <div class=\"flex\">\n *     <img src=\"image1.jpg\" alt=\"Image 1\">\n *     <img src=\"image2.jpg\" alt=\"Image 2\">\n *   </div>\n * </schmancy-scroll>\n * ```\n *\n * @example Programmatic scroll with Lit ref\n * ```typescript\n * private scrollRef = createRef<HTMLElement>()\n *\n * // In template:\n * html`<schmancy-scroll ${ref(this.scrollRef)}>...</schmancy-scroll>`\n *\n * // Scroll to top (smooth — host has scroll-behavior: smooth):\n * this.scrollRef.value?.scrollTo({ top: 0 })\n * ```\n */\n@customElement('schmancy-scroll')\nexport class SchmancyScroll extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\t/* Flexible sizing for different layout contexts */\n\t\twidth: 100%;\n\t\tmin-height: 0; /* Allow flex shrinking */\n\t\tflex: 1; /* Grow in flex containers */\n\t\tbox-sizing: border-box; /* Ensures proper sizing */\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tscroll-behavior: smooth;\n\t\toverscroll-behavior-x: contain;\n\t\toverscroll-behavior-y: auto;\n\t}\n\t/* Fallback for non-flex contexts */\n\t:host(.explicit-height) {\n\t\theight: 100%;\n\t\tflex: none;\n\t}\n\t:host([hide]) {\n\t\t-ms-overflow-style: none; /* IE and Edge */\n\t\tscrollbar-width: none; /* Firefox */\n\t}\n\t:host([hide])::-webkit-scrollbar {\n\t\tdisplay: none; /* Chrome, Safari, and Opera */\n\t}\n`];\n\t/**\n\t * Determines whether the scrollbar is hidden.\n\t *\n\t * When `hide` is true, the host element's scrollbars are hidden\n\t * in supported browsers using CSS.\n\t *\n\t * @attr hide\n\t * @example <schmancy-scroll hide></schmancy-scroll>\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tpublic hide = false\n\n\t/**\n\t * Optional name identifier for the component.\n\t * Used for targeting this specific component with global events.\n\t *\n\t * @attr name\n\t * @example <schmancy-scroll name=\"main-content\"></schmancy-scroll>\n\t */\n\t@property({ type: String, reflect: true })\n\tpublic name?: string\n\n\t/**\n\t * Direction of scrolling: vertical, horizontal, or both.\n\t * - vertical: Only allows vertical scrolling\n\t * - horizontal: Only allows horizontal scrolling\n\t * - both: Allows both horizontal and vertical scrolling (default)\n\t *\n\t * @attr direction\n\t * @example <schmancy-scroll direction=\"horizontal\"></schmancy-scroll>\n\t */\n\t@property({ type: String, reflect: true })\n\tpublic direction: 'vertical' | 'horizontal' | 'both' = 'both'\n\n\t/**\n\t * Reference to the scrollable element (the host element itself)\n\t * @public\n\t */\n\tget scroller(): HTMLElement {\n\t\treturn this\n\t}\n\n\t/**\n\t * Debounce time in milliseconds for the scroll event.\n\t * Higher values reduce the frequency of scroll events being dispatched.\n\t *\n\t * @attr debounce\n\t * @example <schmancy-scroll debounce=\"50\"></schmancy-scroll>\n\t */\n\t@property({ type: Number })\n\tpublic debounce = 10\n\n\t/**\n\t * Scrolls the container to the specified position\n\t * @param options - ScrollToOptions or a number representing the top position\n\t * @param top - For backward compatibility, if options is a number, this is treated as \"behavior\"\n\t */\n\tpublic override scrollTo(options?: ScrollToOptions | number, top?: number): void {\n\t\tif (typeof options === 'number') {\n\t\t\tsuper.scrollTo({ top: options, behavior: top ? 'smooth' : 'auto' })\n\t\t} else if (options) {\n\t\t\tsuper.scrollTo(options)\n\t\t} else {\n\t\t\tsuper.scrollTo({ top: 0, left: 0, behavior: 'auto' })\n\t\t}\n\t}\n\n\t/**\n\t * Scrolls the container horizontally to the specified position\n\t * @param left - The horizontal position to scroll to (in pixels)\n\t * @param behavior - The scroll behavior ('auto' or 'smooth')\n\t */\n\tpublic scrollToLeft(left: number, behavior: ScrollBehavior = 'auto'): void {\n\t\tsuper.scrollTo({ left, behavior })\n\t}\n\n\t/**\n\t * Called when the component is connected to the DOM\n\t * Applies scrolling styles directly to the host element\n\t * @protected\n\t */\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tthis.updateScrollingStyles()\n\t\tthis.updateLayoutContext()\n\t\t// Set the part attribute on the host element\n\t\tthis.setAttribute('part', 'scroller')\n\t}\n\n\t/**\n\t * Updates the overflow styles based on the direction property\n\t * @private\n\t */\n\tprivate updateScrollingStyles(): void {\n\t\t// Apply overflow styles based on direction\n\t\tif (this.direction === 'horizontal') {\n\t\t\tthis.style.setProperty('overflow-y', 'hidden')\n\t\t\tthis.style.setProperty('overflow-x', 'auto')\n\t\t} else if (this.direction === 'vertical') {\n\t\t\tthis.style.setProperty('overflow-y', 'auto')\n\t\t\tthis.style.setProperty('overflow-x', 'hidden')\n\t\t} else {\n\t\t\t// both\n\t\t\tthis.style.setProperty('overflow-y', 'auto')\n\t\t\tthis.style.setProperty('overflow-x', 'auto')\n\t\t}\n\t}\n\n\t/**\n\t * Updates the layout context based on parent container type\n\t * @private\n\t */\n\tprivate updateLayoutContext(): void {\n\t\t// Use requestAnimationFrame to ensure DOM is fully rendered\n\t\trequestAnimationFrame(() => {\n\t\t\t// Check if parent is a flex container\n\t\t\tconst parent = this.parentElement\n\t\t\tif (parent) {\n\t\t\t\tconst parentStyles = getComputedStyle(parent)\n\t\t\t\tconst isFlexParent = parentStyles.display === 'flex' || parentStyles.display === 'inline-flex'\n\n\t\t\t\t// For debugging - remove in production\n\t\t\t\tconsole.debug('schmancy-scroll parent detection:', {\n\t\t\t\t\tparent: parent.tagName,\n\t\t\t\t\tdisplay: parentStyles.display,\n\t\t\t\t\tisFlexParent,\n\t\t\t\t})\n\n\t\t\t\t// Apply appropriate class based on parent layout\n\t\t\t\tif (isFlexParent) {\n\t\t\t\t\tthis.classList.remove('explicit-height')\n\t\t\t\t} else {\n\t\t\t\t\tthis.classList.add('explicit-height')\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// Default to explicit height if no parent\n\t\t\t\tthis.classList.add('explicit-height')\n\t\t\t}\n\t\t})\n\t}\n\n\t/**\n\t * Called when properties change\n\t * @protected\n\t */\n\tprotected updated(changedProperties: Map<string | number | symbol, unknown>): void {\n\t\tsuper.updated(changedProperties)\n\t\t// Update styles if direction changes\n\t\tif (changedProperties.has('direction')) {\n\t\t\tthis.updateScrollingStyles()\n\t\t}\n\t\t// Always update layout context in case parent layout changed\n\t\tthis.updateLayoutContext()\n\t}\n\n\t/**\n\t * Called after the component's first update\n\t * Sets up the scroll event listener with debouncing\n\t * @protected\n\t */\n\tprotected firstUpdated(): void {\n\t\t// Set up scroll event listening with debounce\n\t\tfromEvent(this.scroller, 'scroll', {\n\t\t\tpassive: true,\n\t\t})\n\t\t\t.pipe(\n\t\t\t\tdebounceTime(this.debounce),\n\t\t\t\ttakeUntil(this.disconnecting), // Unsubscribe when the element is destroyed\n\t\t\t)\n\t\t\t.subscribe(e => {\n\t\t\t\t// Always include the original required properties for backward compatibility\n\t\t\t\tconst scrollTop = this.scroller.scrollTop\n\t\t\t\tconst scrollHeight = this.scroller.scrollHeight\n\t\t\t\tconst clientHeight = this.scroller.clientHeight\n\n\t\t\t\t// Include horizontal scroll information as optional properties\n\t\t\t\tconst scrollLeft = this.scroller.scrollLeft\n\t\t\t\tconst scrollWidth = this.scroller.scrollWidth\n\t\t\t\tconst clientWidth = this.scroller.clientWidth\n\n\t\t\t\tthis.dispatchEvent(\n\t\t\t\t\tnew CustomEvent('scroll', {\n\t\t\t\t\t\tdetail: {\n\t\t\t\t\t\t\t// Original required properties first\n\t\t\t\t\t\t\tscrollTop,\n\t\t\t\t\t\t\tscrollHeight,\n\t\t\t\t\t\t\tclientHeight,\n\t\t\t\t\t\t\te,\n\t\t\t\t\t\t\t// New optional properties last\n\t\t\t\t\t\t\tscrollLeft,\n\t\t\t\t\t\t\tscrollWidth,\n\t\t\t\t\t\t\tclientWidth,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}) as SchmancyScrollEvent,\n\t\t\t\t)\n\t\t\t})\n\n\t\t// Set up global command event listener\n\t\tfromEvent<SchmancyScrollCommandEvent>(window, '@schmancy:scrollTo')\n\t\t\t.pipe(\n\t\t\t\t// Only process events targeting this component by name\n\t\t\t\tfilter(e => this.name !== undefined && e.detail.name === this.name),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(e => {\n\t\t\t\tif (e.detail.action === 'scrollTo' && typeof e.detail.top === 'number') {\n\t\t\t\t\tconst options: ScrollToOptions = {\n\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\ttop: e.detail.top, // Required for backward compatibility\n\t\t\t\t\t}\n\n\t\t\t\t\t// Add optional left position if provided\n\t\t\t\t\tif (typeof e.detail.left === 'number') {\n\t\t\t\t\t\toptions.left = e.detail.left\n\t\t\t\t\t}\n\n\t\t\t\t\tthis.scrollTo(options)\n\t\t\t\t}\n\t\t\t})\n\t}\n\n\t/**\n\t * Renders the component template\n\t * @returns {TemplateResult} The template to render\n\t * @protected\n\t */\n\tprotected render() {\n\t\t// Only render the slot, all styling is applied to the host\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-scroll': SchmancyScroll\n\t}\n}\n"],"mappings":"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"}

package/dist/layout.js

@@ -1,9 +1,9 @@
-import { c as e } from "./mixins-BfazlmLD.js";
-import { a as t } from "./active-host-BP0zy_Y9.js";
+import { p as e, t } from "./SchmancyElement-BQ4DFufc.js";
+import "./mixins-BYfSDvbP.js";
 import { debounceTime as n, filter as r, fromEvent as i, takeUntil as a } from "rxjs";
 import { customElement as o, property as s } from "lit/decorators.js";
 import { css as c, html as l } from "lit";
-var u = class extends e {
+var u = class extends t {
 	constructor(...e) {
 		super(...e), this.hide = !1, this.direction = "both", this.debounce = 10;
 	}
@@ -102,14 +102,14 @@ var u = class extends e {
 		return l`<slot></slot>`;
 	}
 };
-t([s({
+e([s({
 	type: Boolean,
 	reflect: !0
-})], u.prototype, "hide", void 0), t([s({
+})], u.prototype, "hide", void 0), e([s({
 	type: String,
 	reflect: !0
-})], u.prototype, "name", void 0), t([s({
+})], u.prototype, "name", void 0), e([s({
 	type: String,
 	reflect: !0
-})], u.prototype, "direction", void 0), t([s({ type: Number })], u.prototype, "debounce", void 0), u = t([o("schmancy-scroll")], u);
+})], u.prototype, "direction", void 0), e([s({ type: Number })], u.prototype, "debounce", void 0), u = e([o("schmancy-scroll")], u);
 export { u as SchmancyScroll };

package/dist/layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"layout.js","names":[],"sources":["../src/layout/scroll/scroll.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { debounceTime, filter, fromEvent, takeUntil } from 'rxjs'\n\n/**\n * Custom scroll event interface for the SchmancyScroll component.\n * Contains detailed information about the scroll state.\n */\nexport interface SchmancyScrollEvent\n\textends CustomEvent<{\n\t\t/** Current scroll position from the top */\n\t\tscrollTop: number\n\t\t/** Total scrollable height of the content */\n\t\tscrollHeight: number\n\t\t/** Visible height of the container */\n\t\tclientHeight: number\n\t\t/** Original scroll event */\n\t\te: Event\n\t\t/** Current scroll position from the left (for horizontal scrolling) */\n\t\tscrollLeft?: number\n\t\t/** Total scrollable width of the content (for horizontal scrolling) */\n\t\tscrollWidth?: number\n\t\t/** Visible width of the container (for horizontal scrolling) */\n\t\tclientWidth?: number\n\t}> {}\n\n/**\n * Command event interface for controlling SchmancyScroll components\n */\nexport interface SchmancyScrollCommandEvent\n\textends CustomEvent<{\n\t\t/** Target component name */\n\t\tname: string\n\t\t/** Command action to perform */\n\t\taction: 'scrollTo'\n\t\t/** Scroll position for scrollTo action */\n\t\ttop: number\n\t\t/** Horizontal scroll position for scrollTo action (optional) */\n\t\tleft?: number\n\t}> {}\n\n// Augment the HTMLElementEventMap to include our custom events\ndeclare global {\n\tinterface HTMLElementEventMap {\n\t\tscroll: SchmancyScrollEvent\n\t\t'schmancy-scroll-command': SchmancyScrollCommandEvent\n\t}\n}\n\n/**\n * A custom scrollable container with enhanced features.\n *\n * @fires {SchmancyScrollEvent} scroll - Fired when scrolling occurs (with a configurable debounce)\n * @slot - Default slot for content to be scrolled\n * @csspart scroller - The inner scrollable div element\n *\n * @example\n * ```html\n * <schmancy-scroll hide name=\"main-content\">\n *   <div>Scrollable content goes here</div>\n * </schmancy-scroll>\n * ```\n *\n * @example\n * ```html\n * <schmancy-scroll direction=\"horizontal\" hide name=\"image-carousel\">\n *   <div class=\"flex\">\n *     <img src=\"image1.jpg\" alt=\"Image 1\">\n *     <img src=\"image2.jpg\" alt=\"Image 2\">\n *   </div>\n * </schmancy-scroll>\n * ```\n *\n * @example Programmatic scroll with Lit ref\n * ```typescript\n * private scrollRef = createRef<HTMLElement>()\n *\n * // In template:\n * html`<schmancy-scroll ${ref(this.scrollRef)}>...</schmancy-scroll>`\n *\n * // Scroll to top (smooth — host has scroll-behavior: smooth):\n * this.scrollRef.value?.scrollTo({ top: 0 })\n * ```\n */\n@customElement('schmancy-scroll')\nexport class SchmancyScroll extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\t/* Flexible sizing for different layout contexts */\n\t\twidth: 100%;\n\t\tmin-height: 0; /* Allow flex shrinking */\n\t\tflex: 1; /* Grow in flex containers */\n\t\tbox-sizing: border-box; /* Ensures proper sizing */\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tscroll-behavior: smooth;\n\t\toverscroll-behavior-x: contain;\n\t\toverscroll-behavior-y: auto;\n\t}\n\t/* Fallback for non-flex contexts */\n\t:host(.explicit-height) {\n\t\theight: 100%;\n\t\tflex: none;\n\t}\n\t:host([hide]) {\n\t\t-ms-overflow-style: none; /* IE and Edge */\n\t\tscrollbar-width: none; /* Firefox */\n\t}\n\t:host([hide])::-webkit-scrollbar {\n\t\tdisplay: none; /* Chrome, Safari, and Opera */\n\t}\n`];\n\t/**\n\t * Determines whether the scrollbar is hidden.\n\t *\n\t * When `hide` is true, the host element's scrollbars are hidden\n\t * in supported browsers using CSS.\n\t *\n\t * @attr hide\n\t * @example <schmancy-scroll hide></schmancy-scroll>\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tpublic hide = false\n\n\t/**\n\t * Optional name identifier for the component.\n\t * Used for targeting this specific component with global events.\n\t *\n\t * @attr name\n\t * @example <schmancy-scroll name=\"main-content\"></schmancy-scroll>\n\t */\n\t@property({ type: String, reflect: true })\n\tpublic name?: string\n\n\t/**\n\t * Direction of scrolling: vertical, horizontal, or both.\n\t * - vertical: Only allows vertical scrolling\n\t * - horizontal: Only allows horizontal scrolling\n\t * - both: Allows both horizontal and vertical scrolling (default)\n\t *\n\t * @attr direction\n\t * @example <schmancy-scroll direction=\"horizontal\"></schmancy-scroll>\n\t */\n\t@property({ type: String, reflect: true })\n\tpublic direction: 'vertical' | 'horizontal' | 'both' = 'both'\n\n\t/**\n\t * Reference to the scrollable element (the host element itself)\n\t * @public\n\t */\n\tget scroller(): HTMLElement {\n\t\treturn this\n\t}\n\n\t/**\n\t * Debounce time in milliseconds for the scroll event.\n\t * Higher values reduce the frequency of scroll events being dispatched.\n\t *\n\t * @attr debounce\n\t * @example <schmancy-scroll debounce=\"50\"></schmancy-scroll>\n\t */\n\t@property({ type: Number })\n\tpublic debounce = 10\n\n\t/**\n\t * Scrolls the container to the specified position\n\t * @param options - ScrollToOptions or a number representing the top position\n\t * @param top - For backward compatibility, if options is a number, this is treated as \"behavior\"\n\t */\n\tpublic override scrollTo(options?: ScrollToOptions | number, top?: number): void {\n\t\tif (typeof options === 'number') {\n\t\t\tsuper.scrollTo({ top: options, behavior: top ? 'smooth' : 'auto' })\n\t\t} else if (options) {\n\t\t\tsuper.scrollTo(options)\n\t\t} else {\n\t\t\tsuper.scrollTo({ top: 0, left: 0, behavior: 'auto' })\n\t\t}\n\t}\n\n\t/**\n\t * Scrolls the container horizontally to the specified position\n\t * @param left - The horizontal position to scroll to (in pixels)\n\t * @param behavior - The scroll behavior ('auto' or 'smooth')\n\t */\n\tpublic scrollToLeft(left: number, behavior: ScrollBehavior = 'auto'): void {\n\t\tsuper.scrollTo({ left, behavior })\n\t}\n\n\t/**\n\t * Called when the component is connected to the DOM\n\t * Applies scrolling styles directly to the host element\n\t * @protected\n\t */\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tthis.updateScrollingStyles()\n\t\tthis.updateLayoutContext()\n\t\t// Set the part attribute on the host element\n\t\tthis.setAttribute('part', 'scroller')\n\t}\n\n\t/**\n\t * Updates the overflow styles based on the direction property\n\t * @private\n\t */\n\tprivate updateScrollingStyles(): void {\n\t\t// Apply overflow styles based on direction\n\t\tif (this.direction === 'horizontal') {\n\t\t\tthis.style.setProperty('overflow-y', 'hidden')\n\t\t\tthis.style.setProperty('overflow-x', 'auto')\n\t\t} else if (this.direction === 'vertical') {\n\t\t\tthis.style.setProperty('overflow-y', 'auto')\n\t\t\tthis.style.setProperty('overflow-x', 'hidden')\n\t\t} else {\n\t\t\t// both\n\t\t\tthis.style.setProperty('overflow-y', 'auto')\n\t\t\tthis.style.setProperty('overflow-x', 'auto')\n\t\t}\n\t}\n\n\t/**\n\t * Updates the layout context based on parent container type\n\t * @private\n\t */\n\tprivate updateLayoutContext(): void {\n\t\t// Use requestAnimationFrame to ensure DOM is fully rendered\n\t\trequestAnimationFrame(() => {\n\t\t\t// Check if parent is a flex container\n\t\t\tconst parent = this.parentElement\n\t\t\tif (parent) {\n\t\t\t\tconst parentStyles = getComputedStyle(parent)\n\t\t\t\tconst isFlexParent = parentStyles.display === 'flex' || parentStyles.display === 'inline-flex'\n\n\t\t\t\t// For debugging - remove in production\n\t\t\t\tconsole.debug('schmancy-scroll parent detection:', {\n\t\t\t\t\tparent: parent.tagName,\n\t\t\t\t\tdisplay: parentStyles.display,\n\t\t\t\t\tisFlexParent,\n\t\t\t\t})\n\n\t\t\t\t// Apply appropriate class based on parent layout\n\t\t\t\tif (isFlexParent) {\n\t\t\t\t\tthis.classList.remove('explicit-height')\n\t\t\t\t} else {\n\t\t\t\t\tthis.classList.add('explicit-height')\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// Default to explicit height if no parent\n\t\t\t\tthis.classList.add('explicit-height')\n\t\t\t}\n\t\t})\n\t}\n\n\t/**\n\t * Called when properties change\n\t * @protected\n\t */\n\tprotected updated(changedProperties: Map<string | number | symbol, unknown>): void {\n\t\tsuper.updated(changedProperties)\n\t\t// Update styles if direction changes\n\t\tif (changedProperties.has('direction')) {\n\t\t\tthis.updateScrollingStyles()\n\t\t}\n\t\t// Always update layout context in case parent layout changed\n\t\tthis.updateLayoutContext()\n\t}\n\n\t/**\n\t * Called after the component's first update\n\t * Sets up the scroll event listener with debouncing\n\t * @protected\n\t */\n\tprotected firstUpdated(): void {\n\t\t// Set up scroll event listening with debounce\n\t\tfromEvent(this.scroller, 'scroll', {\n\t\t\tpassive: true,\n\t\t})\n\t\t\t.pipe(\n\t\t\t\tdebounceTime(this.debounce),\n\t\t\t\ttakeUntil(this.disconnecting), // Unsubscribe when the element is destroyed\n\t\t\t)\n\t\t\t.subscribe(e => {\n\t\t\t\t// Always include the original required properties for backward compatibility\n\t\t\t\tconst scrollTop = this.scroller.scrollTop\n\t\t\t\tconst scrollHeight = this.scroller.scrollHeight\n\t\t\t\tconst clientHeight = this.scroller.clientHeight\n\n\t\t\t\t// Include horizontal scroll information as optional properties\n\t\t\t\tconst scrollLeft = this.scroller.scrollLeft\n\t\t\t\tconst scrollWidth = this.scroller.scrollWidth\n\t\t\t\tconst clientWidth = this.scroller.clientWidth\n\n\t\t\t\tthis.dispatchEvent(\n\t\t\t\t\tnew CustomEvent('scroll', {\n\t\t\t\t\t\tdetail: {\n\t\t\t\t\t\t\t// Original required properties first\n\t\t\t\t\t\t\tscrollTop,\n\t\t\t\t\t\t\tscrollHeight,\n\t\t\t\t\t\t\tclientHeight,\n\t\t\t\t\t\t\te,\n\t\t\t\t\t\t\t// New optional properties last\n\t\t\t\t\t\t\tscrollLeft,\n\t\t\t\t\t\t\tscrollWidth,\n\t\t\t\t\t\t\tclientWidth,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}) as SchmancyScrollEvent,\n\t\t\t\t)\n\t\t\t})\n\n\t\t// Set up global command event listener\n\t\tfromEvent<SchmancyScrollCommandEvent>(window, '@schmancy:scrollTo')\n\t\t\t.pipe(\n\t\t\t\t// Only process events targeting this component by name\n\t\t\t\tfilter(e => this.name !== undefined && e.detail.name === this.name),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(e => {\n\t\t\t\tif (e.detail.action === 'scrollTo' && typeof e.detail.top === 'number') {\n\t\t\t\t\tconst options: ScrollToOptions = {\n\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\ttop: e.detail.top, // Required for backward compatibility\n\t\t\t\t\t}\n\n\t\t\t\t\t// Add optional left position if provided\n\t\t\t\t\tif (typeof e.detail.left === 'number') {\n\t\t\t\t\t\toptions.left = e.detail.left\n\t\t\t\t\t}\n\n\t\t\t\t\tthis.scrollTo(options)\n\t\t\t\t}\n\t\t\t})\n\t}\n\n\t/**\n\t * Renders the component template\n\t * @returns {TemplateResult} The template to render\n\t * @protected\n\t */\n\tprotected render() {\n\t\t// Only render the slot, all styling is applied to the host\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-scroll': SchmancyScroll\n\t}\n}\n"],"mappings":";;;;;AAsFO,IAAA,IAAA,cAA6B,EAAA;CAAA,YAAA,GAAA,GAAA;EAAA,MAAA,GAAA,EAAA,EAAA,KAAA,OAAA,CAqCrB,GAAA,KAAA,YAsByC,QAAA,KAAA,WAkBrC;;CAAA;EAAA,KAAA,SA5EF,CAAC,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgEpB,IAAA,WAAI;EACH,OAAO;;CAkBR,SAAyB,GAAoC,GAAA;EACrC,AAAA,OAAZ,KAAY,WACtB,MAAM,SAAS;GAAE,KAAK;GAAS,UAAU,IAAM,WAAW;GAAA,CAAA,GAChD,IACV,MAAM,SAAS,EAAA,GAEf,MAAM,SAAS;GAAE,KAAK;GAAG,MAAM;GAAG,UAAU;GAAA,CAAA;;CAS9C,aAAoB,GAAc,IAA2B,QAAA;EAC5D,MAAM,SAAS;GAAE,MAAA;GAAM,UAAA;GAAA,CAAA;;CAQxB,oBAAA;EACC,MAAM,mBAAA,EACN,KAAK,uBAAA,EACL,KAAK,qBAAA,EAEL,KAAK,aAAa,QAAQ,WAAA;;CAO3B,wBAAA;EAEwB,AAAnB,KAAK,cAAc,gBACtB,KAAK,MAAM,YAAY,cAAc,SAAA,EACrC,KAAK,MAAM,YAAY,cAAc,OAAA,IAC3B,KAAK,cAAc,cAC7B,KAAK,MAAM,YAAY,cAAc,OAAA,EACrC,KAAK,MAAM,YAAY,cAAc,SAAA,KAGrC,KAAK,MAAM,YAAY,cAAc,OAAA,EACrC,KAAK,MAAM,YAAY,cAAc,OAAA;;CAQvC,sBAAA;EAEC,4BAAA;GAEC,IAAM,IAAS,KAAK;GACpB,IAAI,GAAQ;IACX,IAAM,IAAe,iBAAiB,EAAA;IACQ,AAAzB,EAAa,YAAY,UAAU,EAAa,YAAY,gBAWhF,KAAK,UAAU,OAAO,kBAAA,GAEtB,KAAK,UAAU,IAAI,kBAAA;UAIpB,KAAK,UAAU,IAAI,kBAAA;IAAA;;CAStB,QAAkB,GAAA;EACjB,MAAM,QAAQ,EAAA,EAEV,EAAkB,IAAI,YAAA,IACzB,KAAK,uBAAA,EAGN,KAAK,qBAAA;;CAQN,eAAA;EAEC,EAAU,KAAK,UAAU,UAAU,EAClC,SAAA,CAAS,GAAA,CAAA,CAER,KACA,EAAa,KAAK,SAAA,EAClB,EAAU,KAAK,cAAA,CAAA,CAEf,WAAU,MAAA;GAEV,IAAM,IAAY,KAAK,SAAS,WAC1B,IAAe,KAAK,SAAS,cAC7B,IAAe,KAAK,SAAS,cAG7B,IAAa,KAAK,SAAS,YAC3B,IAAc,KAAK,SAAS,aAC5B,IAAc,KAAK,SAAS;GAElC,KAAK,cACJ,IAAI,YAAY,UAAU;IACzB,QAAQ;KAEP,WAAA;KACA,cAAA;KACA,cAAA;KACA;KAEA,YAAA;KACA,aAAA;KACA,aAAA;KAAA;IAED,SAAA,CAAS;IACT,UAAA,CAAU;IAAA,CAAA,CAAA;IAAA,EAMd,EAAsC,QAAQ,qBAAA,CAC5C,KAEA,GAAO,MAAK,KAAK,SAAV,KAAmB,KAAa,EAAE,OAAO,SAAS,KAAK,KAAA,EAC9D,EAAU,KAAK,cAAA,CAAA,CAEf,WAAU,MAAA;GACV,IAAI,EAAE,OAAO,WAAW,cAAsC,OAAjB,EAAE,OAAO,OAAQ,UAAU;IACvE,IAAM,IAA2B;KAChC,UAAU;KACV,KAAK,EAAE,OAAO;KAAA;IAIc,AAAA,OAAlB,EAAE,OAAO,QAAS,aAC5B,EAAQ,OAAO,EAAE,OAAO,OAGzB,KAAK,SAAS,EAAA;;IAAA;;CAUlB,SAAA;EAEC,OAAO,CAAI;;;AAAA,EAAA,CA7NX,EAAS;CAAE,MAAM;CAAS,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAU1C,EAAS;CAAE,MAAM;CAAQ,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAYzC,EAAS;CAAE,MAAM;CAAQ,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,aAAA,KAAA,EAAA,EAAA,EAAA,CAkBzC,EAAS,EAAE,MAAM,QAAA,CAAA,CAAA,EAAS,EAAA,WAAA,YAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CA7E3B,EAAc,kBAAA,CAAA,EAAkB,EAAA;AAAA,SAAA,KAAA"}
+{"version":3,"file":"layout.js","names":[],"sources":["../src/layout/scroll/scroll.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { debounceTime, filter, fromEvent, takeUntil } from 'rxjs'\n\n/**\n * Custom scroll event interface for the SchmancyScroll component.\n * Contains detailed information about the scroll state.\n */\nexport interface SchmancyScrollEvent\n\textends CustomEvent<{\n\t\t/** Current scroll position from the top */\n\t\tscrollTop: number\n\t\t/** Total scrollable height of the content */\n\t\tscrollHeight: number\n\t\t/** Visible height of the container */\n\t\tclientHeight: number\n\t\t/** Original scroll event */\n\t\te: Event\n\t\t/** Current scroll position from the left (for horizontal scrolling) */\n\t\tscrollLeft?: number\n\t\t/** Total scrollable width of the content (for horizontal scrolling) */\n\t\tscrollWidth?: number\n\t\t/** Visible width of the container (for horizontal scrolling) */\n\t\tclientWidth?: number\n\t}> {}\n\n/**\n * Command event interface for controlling SchmancyScroll components\n */\nexport interface SchmancyScrollCommandEvent\n\textends CustomEvent<{\n\t\t/** Target component name */\n\t\tname: string\n\t\t/** Command action to perform */\n\t\taction: 'scrollTo'\n\t\t/** Scroll position for scrollTo action */\n\t\ttop: number\n\t\t/** Horizontal scroll position for scrollTo action (optional) */\n\t\tleft?: number\n\t}> {}\n\n// Augment the HTMLElementEventMap to include our custom events\ndeclare global {\n\tinterface HTMLElementEventMap {\n\t\tscroll: SchmancyScrollEvent\n\t\t'schmancy-scroll-command': SchmancyScrollCommandEvent\n\t}\n}\n\n/**\n * A custom scrollable container with enhanced features.\n *\n * @fires {SchmancyScrollEvent} scroll - Fired when scrolling occurs (with a configurable debounce)\n * @slot - Default slot for content to be scrolled\n * @csspart scroller - The inner scrollable div element\n *\n * @example\n * ```html\n * <schmancy-scroll hide name=\"main-content\">\n *   <div>Scrollable content goes here</div>\n * </schmancy-scroll>\n * ```\n *\n * @example\n * ```html\n * <schmancy-scroll direction=\"horizontal\" hide name=\"image-carousel\">\n *   <div class=\"flex\">\n *     <img src=\"image1.jpg\" alt=\"Image 1\">\n *     <img src=\"image2.jpg\" alt=\"Image 2\">\n *   </div>\n * </schmancy-scroll>\n * ```\n *\n * @example Programmatic scroll with Lit ref\n * ```typescript\n * private scrollRef = createRef<HTMLElement>()\n *\n * // In template:\n * html`<schmancy-scroll ${ref(this.scrollRef)}>...</schmancy-scroll>`\n *\n * // Scroll to top (smooth — host has scroll-behavior: smooth):\n * this.scrollRef.value?.scrollTo({ top: 0 })\n * ```\n */\n@customElement('schmancy-scroll')\nexport class SchmancyScroll extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\t/* Flexible sizing for different layout contexts */\n\t\twidth: 100%;\n\t\tmin-height: 0; /* Allow flex shrinking */\n\t\tflex: 1; /* Grow in flex containers */\n\t\tbox-sizing: border-box; /* Ensures proper sizing */\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tscroll-behavior: smooth;\n\t\toverscroll-behavior-x: contain;\n\t\toverscroll-behavior-y: auto;\n\t}\n\t/* Fallback for non-flex contexts */\n\t:host(.explicit-height) {\n\t\theight: 100%;\n\t\tflex: none;\n\t}\n\t:host([hide]) {\n\t\t-ms-overflow-style: none; /* IE and Edge */\n\t\tscrollbar-width: none; /* Firefox */\n\t}\n\t:host([hide])::-webkit-scrollbar {\n\t\tdisplay: none; /* Chrome, Safari, and Opera */\n\t}\n`];\n\t/**\n\t * Determines whether the scrollbar is hidden.\n\t *\n\t * When `hide` is true, the host element's scrollbars are hidden\n\t * in supported browsers using CSS.\n\t *\n\t * @attr hide\n\t * @example <schmancy-scroll hide></schmancy-scroll>\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tpublic hide = false\n\n\t/**\n\t * Optional name identifier for the component.\n\t * Used for targeting this specific component with global events.\n\t *\n\t * @attr name\n\t * @example <schmancy-scroll name=\"main-content\"></schmancy-scroll>\n\t */\n\t@property({ type: String, reflect: true })\n\tpublic name?: string\n\n\t/**\n\t * Direction of scrolling: vertical, horizontal, or both.\n\t * - vertical: Only allows vertical scrolling\n\t * - horizontal: Only allows horizontal scrolling\n\t * - both: Allows both horizontal and vertical scrolling (default)\n\t *\n\t * @attr direction\n\t * @example <schmancy-scroll direction=\"horizontal\"></schmancy-scroll>\n\t */\n\t@property({ type: String, reflect: true })\n\tpublic direction: 'vertical' | 'horizontal' | 'both' = 'both'\n\n\t/**\n\t * Reference to the scrollable element (the host element itself)\n\t * @public\n\t */\n\tget scroller(): HTMLElement {\n\t\treturn this\n\t}\n\n\t/**\n\t * Debounce time in milliseconds for the scroll event.\n\t * Higher values reduce the frequency of scroll events being dispatched.\n\t *\n\t * @attr debounce\n\t * @example <schmancy-scroll debounce=\"50\"></schmancy-scroll>\n\t */\n\t@property({ type: Number })\n\tpublic debounce = 10\n\n\t/**\n\t * Scrolls the container to the specified position\n\t * @param options - ScrollToOptions or a number representing the top position\n\t * @param top - For backward compatibility, if options is a number, this is treated as \"behavior\"\n\t */\n\tpublic override scrollTo(options?: ScrollToOptions | number, top?: number): void {\n\t\tif (typeof options === 'number') {\n\t\t\tsuper.scrollTo({ top: options, behavior: top ? 'smooth' : 'auto' })\n\t\t} else if (options) {\n\t\t\tsuper.scrollTo(options)\n\t\t} else {\n\t\t\tsuper.scrollTo({ top: 0, left: 0, behavior: 'auto' })\n\t\t}\n\t}\n\n\t/**\n\t * Scrolls the container horizontally to the specified position\n\t * @param left - The horizontal position to scroll to (in pixels)\n\t * @param behavior - The scroll behavior ('auto' or 'smooth')\n\t */\n\tpublic scrollToLeft(left: number, behavior: ScrollBehavior = 'auto'): void {\n\t\tsuper.scrollTo({ left, behavior })\n\t}\n\n\t/**\n\t * Called when the component is connected to the DOM\n\t * Applies scrolling styles directly to the host element\n\t * @protected\n\t */\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tthis.updateScrollingStyles()\n\t\tthis.updateLayoutContext()\n\t\t// Set the part attribute on the host element\n\t\tthis.setAttribute('part', 'scroller')\n\t}\n\n\t/**\n\t * Updates the overflow styles based on the direction property\n\t * @private\n\t */\n\tprivate updateScrollingStyles(): void {\n\t\t// Apply overflow styles based on direction\n\t\tif (this.direction === 'horizontal') {\n\t\t\tthis.style.setProperty('overflow-y', 'hidden')\n\t\t\tthis.style.setProperty('overflow-x', 'auto')\n\t\t} else if (this.direction === 'vertical') {\n\t\t\tthis.style.setProperty('overflow-y', 'auto')\n\t\t\tthis.style.setProperty('overflow-x', 'hidden')\n\t\t} else {\n\t\t\t// both\n\t\t\tthis.style.setProperty('overflow-y', 'auto')\n\t\t\tthis.style.setProperty('overflow-x', 'auto')\n\t\t}\n\t}\n\n\t/**\n\t * Updates the layout context based on parent container type\n\t * @private\n\t */\n\tprivate updateLayoutContext(): void {\n\t\t// Use requestAnimationFrame to ensure DOM is fully rendered\n\t\trequestAnimationFrame(() => {\n\t\t\t// Check if parent is a flex container\n\t\t\tconst parent = this.parentElement\n\t\t\tif (parent) {\n\t\t\t\tconst parentStyles = getComputedStyle(parent)\n\t\t\t\tconst isFlexParent = parentStyles.display === 'flex' || parentStyles.display === 'inline-flex'\n\n\t\t\t\t// For debugging - remove in production\n\t\t\t\tconsole.debug('schmancy-scroll parent detection:', {\n\t\t\t\t\tparent: parent.tagName,\n\t\t\t\t\tdisplay: parentStyles.display,\n\t\t\t\t\tisFlexParent,\n\t\t\t\t})\n\n\t\t\t\t// Apply appropriate class based on parent layout\n\t\t\t\tif (isFlexParent) {\n\t\t\t\t\tthis.classList.remove('explicit-height')\n\t\t\t\t} else {\n\t\t\t\t\tthis.classList.add('explicit-height')\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// Default to explicit height if no parent\n\t\t\t\tthis.classList.add('explicit-height')\n\t\t\t}\n\t\t})\n\t}\n\n\t/**\n\t * Called when properties change\n\t * @protected\n\t */\n\tprotected updated(changedProperties: Map<string | number | symbol, unknown>): void {\n\t\tsuper.updated(changedProperties)\n\t\t// Update styles if direction changes\n\t\tif (changedProperties.has('direction')) {\n\t\t\tthis.updateScrollingStyles()\n\t\t}\n\t\t// Always update layout context in case parent layout changed\n\t\tthis.updateLayoutContext()\n\t}\n\n\t/**\n\t * Called after the component's first update\n\t * Sets up the scroll event listener with debouncing\n\t * @protected\n\t */\n\tprotected firstUpdated(): void {\n\t\t// Set up scroll event listening with debounce\n\t\tfromEvent(this.scroller, 'scroll', {\n\t\t\tpassive: true,\n\t\t})\n\t\t\t.pipe(\n\t\t\t\tdebounceTime(this.debounce),\n\t\t\t\ttakeUntil(this.disconnecting), // Unsubscribe when the element is destroyed\n\t\t\t)\n\t\t\t.subscribe(e => {\n\t\t\t\t// Always include the original required properties for backward compatibility\n\t\t\t\tconst scrollTop = this.scroller.scrollTop\n\t\t\t\tconst scrollHeight = this.scroller.scrollHeight\n\t\t\t\tconst clientHeight = this.scroller.clientHeight\n\n\t\t\t\t// Include horizontal scroll information as optional properties\n\t\t\t\tconst scrollLeft = this.scroller.scrollLeft\n\t\t\t\tconst scrollWidth = this.scroller.scrollWidth\n\t\t\t\tconst clientWidth = this.scroller.clientWidth\n\n\t\t\t\tthis.dispatchEvent(\n\t\t\t\t\tnew CustomEvent('scroll', {\n\t\t\t\t\t\tdetail: {\n\t\t\t\t\t\t\t// Original required properties first\n\t\t\t\t\t\t\tscrollTop,\n\t\t\t\t\t\t\tscrollHeight,\n\t\t\t\t\t\t\tclientHeight,\n\t\t\t\t\t\t\te,\n\t\t\t\t\t\t\t// New optional properties last\n\t\t\t\t\t\t\tscrollLeft,\n\t\t\t\t\t\t\tscrollWidth,\n\t\t\t\t\t\t\tclientWidth,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}) as SchmancyScrollEvent,\n\t\t\t\t)\n\t\t\t})\n\n\t\t// Set up global command event listener\n\t\tfromEvent<SchmancyScrollCommandEvent>(window, '@schmancy:scrollTo')\n\t\t\t.pipe(\n\t\t\t\t// Only process events targeting this component by name\n\t\t\t\tfilter(e => this.name !== undefined && e.detail.name === this.name),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(e => {\n\t\t\t\tif (e.detail.action === 'scrollTo' && typeof e.detail.top === 'number') {\n\t\t\t\t\tconst options: ScrollToOptions = {\n\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\ttop: e.detail.top, // Required for backward compatibility\n\t\t\t\t\t}\n\n\t\t\t\t\t// Add optional left position if provided\n\t\t\t\t\tif (typeof e.detail.left === 'number') {\n\t\t\t\t\t\toptions.left = e.detail.left\n\t\t\t\t\t}\n\n\t\t\t\t\tthis.scrollTo(options)\n\t\t\t\t}\n\t\t\t})\n\t}\n\n\t/**\n\t * Renders the component template\n\t * @returns {TemplateResult} The template to render\n\t * @protected\n\t */\n\tprotected render() {\n\t\t// Only render the slot, all styling is applied to the host\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-scroll': SchmancyScroll\n\t}\n}\n"],"mappings":"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"}

package/dist/lazy-CayEFyC3.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"lazy-CayEFyC3.cjs","names":[],"sources":["../src/area/lazy.ts"],"sourcesContent":["/**\r\n * Lazy loading for Schmancy Area components\r\n * Similar to React.lazy() but adapted for Web Components\r\n */\r\n\r\n// Type definition for custom element constructors\r\ntype CustomElementConstructor = typeof HTMLElement\r\n\r\n/**\r\n * LazyComponent interface with preload capability\r\n */\r\nexport interface LazyComponent<T extends CustomElementConstructor = CustomElementConstructor> {\r\n  (): Promise<{ default: T }>\r\n  preload(): Promise<void>\r\n  _promise?: Promise<{ default: T }>\r\n  _module?: { default: T }\r\n}\r\n\r\n/**\r\n * Create a lazy-loaded component that will be imported on demand\r\n *\r\n * @example\r\n * ```typescript\r\n * const LazyProfile = lazy(() => import('./profile'))\r\n *\r\n * // Use with area.push\r\n * area.push({\r\n *   component: LazyProfile,\r\n *   area: 'main'\r\n * })\r\n *\r\n * // Preload on hover\r\n * element.addEventListener('mouseenter', () => LazyProfile.preload())\r\n * ```\r\n *\r\n * @param loader - Dynamic import function that returns a module with default export\r\n * @returns LazyComponent function compatible with area.push()\r\n */\r\nexport function lazy<T extends CustomElementConstructor>(\r\n  loader: () => Promise<{ default: T }>\r\n): LazyComponent<T> {\r\n\r\n  // Create the lazy component function\r\n  const lazyComponent = function(): Promise<{ default: T }> {\r\n    // Return cached promise if already loading/loaded\r\n    if (lazyComponent._promise) {\r\n      return lazyComponent._promise\r\n    }\r\n\r\n    // Return cached module if already loaded\r\n    if (lazyComponent._module) {\r\n      return Promise.resolve(lazyComponent._module)\r\n    }\r\n\r\n    // Start loading and cache the promise\r\n    lazyComponent._promise = loader()\r\n      .then(module => {\r\n        // Cache the loaded module\r\n        lazyComponent._module = module\r\n        return module\r\n      })\r\n      .catch(error => {\r\n        // Clear promise on error to allow retry\r\n        lazyComponent._promise = undefined\r\n        throw error\r\n      })\r\n\r\n    return lazyComponent._promise\r\n  } as LazyComponent<T>\r\n\r\n  // Add preload method for manual preloading\r\n  lazyComponent.preload = async function(): Promise<void> {\r\n    try {\r\n      await lazyComponent()\r\n    } catch (error) {\r\n      console.error('Failed to preload component:', error)\r\n    }\r\n  }\r\n\r\n  return lazyComponent\r\n}\r\n\r\n\r\n"],"mappings":"AAsCA,SAAgB,EACd,EAAA,CAIA,IAAM,EAAgB,UAAA,CAEpB,OAAI,EAAc,SACT,EAAc,SAInB,EAAc,QACT,QAAQ,QAAQ,EAAc,QAAA,EAIvC,EAAc,SAAW,GAAA,CACtB,KAAK,IAEJ,EAAc,QAAU,EACjB,GAAA,CAER,MAAM,GAAA,CAGL,KADA,GAAc,SAAA,IAAW,GACnB,GAAA,CAGH,EAAc,WAYvB,MARA,GAAc,QAAU,gBAAA,CACtB,GAAA,CAAA,MACQ,GAAA,MACC,IAKJ,EAAA,OAAA,eAAA,QAAA,IAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,GAAA,CAAA"}
+{"version":3,"file":"lazy-CayEFyC3.cjs","names":[],"sources":["../src/area/lazy.ts"],"sourcesContent":["/**\r\n * Lazy loading for Schmancy Area components\r\n * Similar to React.lazy() but adapted for Web Components\r\n */\r\n\r\n// Type definition for custom element constructors\r\ntype CustomElementConstructor = typeof HTMLElement\r\n\r\n/**\r\n * LazyComponent interface with preload capability\r\n */\r\nexport interface LazyComponent<T extends CustomElementConstructor = CustomElementConstructor> {\r\n  (): Promise<{ default: T }>\r\n  preload(): Promise<void>\r\n  _promise?: Promise<{ default: T }>\r\n  _module?: { default: T }\r\n}\r\n\r\n/**\r\n * Create a lazy-loaded component that will be imported on demand\r\n *\r\n * @example\r\n * ```typescript\r\n * const LazyProfile = lazy(() => import('./profile'))\r\n *\r\n * // Use with area.push\r\n * area.push({\r\n *   component: LazyProfile,\r\n *   area: 'main'\r\n * })\r\n *\r\n * // Preload on hover\r\n * element.addEventListener('mouseenter', () => LazyProfile.preload())\r\n * ```\r\n *\r\n * @param loader - Dynamic import function that returns a module with default export\r\n * @returns LazyComponent function compatible with area.push()\r\n */\r\nexport function lazy<T extends CustomElementConstructor>(\r\n  loader: () => Promise<{ default: T }>\r\n): LazyComponent<T> {\r\n\r\n  // Create the lazy component function\r\n  const lazyComponent = function(): Promise<{ default: T }> {\r\n    // Return cached promise if already loading/loaded\r\n    if (lazyComponent._promise) {\r\n      return lazyComponent._promise\r\n    }\r\n\r\n    // Return cached module if already loaded\r\n    if (lazyComponent._module) {\r\n      return Promise.resolve(lazyComponent._module)\r\n    }\r\n\r\n    // Start loading and cache the promise\r\n    lazyComponent._promise = loader()\r\n      .then(module => {\r\n        // Cache the loaded module\r\n        lazyComponent._module = module\r\n        return module\r\n      })\r\n      .catch(error => {\r\n        // Clear promise on error to allow retry\r\n        lazyComponent._promise = undefined\r\n        throw error\r\n      })\r\n\r\n    return lazyComponent._promise\r\n  } as LazyComponent<T>\r\n\r\n  // Add preload method for manual preloading\r\n  lazyComponent.preload = async function(): Promise<void> {\r\n    try {\r\n      await lazyComponent()\r\n    } catch (error) {\r\n      console.error('Failed to preload component:', error)\r\n    }\r\n  }\r\n\r\n  return lazyComponent\r\n}\r\n\r\n\r\n"],"mappings":"AAsCA,SAAgB,EACd,EAAA,CAIA,IAAM,EAAgB,UAAA,CAEpB,OAAI,EAAc,SACT,EAAc,SAInB,EAAc,QACT,QAAQ,QAAQ,EAAc,OAAA,GAIvC,EAAc,SAAW,EAAA,EACtB,KAAK,IAEJ,EAAc,QAAU,EACjB,EAAA,EAER,MAAM,GAAA,CAGL,KADA,GAAc,SAAA,IAAW,GACnB,CAAA,CAAA,EAGH,EAAc,SACvB,EAWA,MARA,GAAc,QAAU,gBAAA,CACtB,GAAA,CAAA,MACQ,EAAA,CACR,MAAS,CAET,CACF,EAEO,CACT,CAAA,OAAA,eAAA,QAAA,IAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,CAAA,CAAA,CAAA"}

package/dist/lazy-D-bO2r4m.js.map

@@ -1 +1 @@
-{"version":3,"file":"lazy-D-bO2r4m.js","names":[],"sources":["../src/area/lazy.ts"],"sourcesContent":["/**\r\n * Lazy loading for Schmancy Area components\r\n * Similar to React.lazy() but adapted for Web Components\r\n */\r\n\r\n// Type definition for custom element constructors\r\ntype CustomElementConstructor = typeof HTMLElement\r\n\r\n/**\r\n * LazyComponent interface with preload capability\r\n */\r\nexport interface LazyComponent<T extends CustomElementConstructor = CustomElementConstructor> {\r\n  (): Promise<{ default: T }>\r\n  preload(): Promise<void>\r\n  _promise?: Promise<{ default: T }>\r\n  _module?: { default: T }\r\n}\r\n\r\n/**\r\n * Create a lazy-loaded component that will be imported on demand\r\n *\r\n * @example\r\n * ```typescript\r\n * const LazyProfile = lazy(() => import('./profile'))\r\n *\r\n * // Use with area.push\r\n * area.push({\r\n *   component: LazyProfile,\r\n *   area: 'main'\r\n * })\r\n *\r\n * // Preload on hover\r\n * element.addEventListener('mouseenter', () => LazyProfile.preload())\r\n * ```\r\n *\r\n * @param loader - Dynamic import function that returns a module with default export\r\n * @returns LazyComponent function compatible with area.push()\r\n */\r\nexport function lazy<T extends CustomElementConstructor>(\r\n  loader: () => Promise<{ default: T }>\r\n): LazyComponent<T> {\r\n\r\n  // Create the lazy component function\r\n  const lazyComponent = function(): Promise<{ default: T }> {\r\n    // Return cached promise if already loading/loaded\r\n    if (lazyComponent._promise) {\r\n      return lazyComponent._promise\r\n    }\r\n\r\n    // Return cached module if already loaded\r\n    if (lazyComponent._module) {\r\n      return Promise.resolve(lazyComponent._module)\r\n    }\r\n\r\n    // Start loading and cache the promise\r\n    lazyComponent._promise = loader()\r\n      .then(module => {\r\n        // Cache the loaded module\r\n        lazyComponent._module = module\r\n        return module\r\n      })\r\n      .catch(error => {\r\n        // Clear promise on error to allow retry\r\n        lazyComponent._promise = undefined\r\n        throw error\r\n      })\r\n\r\n    return lazyComponent._promise\r\n  } as LazyComponent<T>\r\n\r\n  // Add preload method for manual preloading\r\n  lazyComponent.preload = async function(): Promise<void> {\r\n    try {\r\n      await lazyComponent()\r\n    } catch (error) {\r\n      console.error('Failed to preload component:', error)\r\n    }\r\n  }\r\n\r\n  return lazyComponent\r\n}\r\n\r\n\r\n"],"mappings":"AAsCA,SAAgB,EACd,GAAA;CAIA,IAAM,IAAgB,WAAA;EAEpB,OAAI,EAAc,WACT,EAAc,WAInB,EAAc,UACT,QAAQ,QAAQ,EAAc,QAAA,IAIvC,EAAc,WAAW,GAAA,CACtB,MAAK,OAEJ,EAAc,UAAU,GACjB,GAAA,CAER,OAAM,MAAA;GAGL,MADA,EAAc,WAAA,KAAW,GACnB;IAAA,EAGH,EAAc;;CAYvB,OARA,EAAc,UAAU,iBAAA;EACtB,IAAA;GAAA,MACQ,GAAA;UACC;IAKJ;;AAAA,SAAA"}
+{"version":3,"file":"lazy-D-bO2r4m.js","names":[],"sources":["../src/area/lazy.ts"],"sourcesContent":["/**\r\n * Lazy loading for Schmancy Area components\r\n * Similar to React.lazy() but adapted for Web Components\r\n */\r\n\r\n// Type definition for custom element constructors\r\ntype CustomElementConstructor = typeof HTMLElement\r\n\r\n/**\r\n * LazyComponent interface with preload capability\r\n */\r\nexport interface LazyComponent<T extends CustomElementConstructor = CustomElementConstructor> {\r\n  (): Promise<{ default: T }>\r\n  preload(): Promise<void>\r\n  _promise?: Promise<{ default: T }>\r\n  _module?: { default: T }\r\n}\r\n\r\n/**\r\n * Create a lazy-loaded component that will be imported on demand\r\n *\r\n * @example\r\n * ```typescript\r\n * const LazyProfile = lazy(() => import('./profile'))\r\n *\r\n * // Use with area.push\r\n * area.push({\r\n *   component: LazyProfile,\r\n *   area: 'main'\r\n * })\r\n *\r\n * // Preload on hover\r\n * element.addEventListener('mouseenter', () => LazyProfile.preload())\r\n * ```\r\n *\r\n * @param loader - Dynamic import function that returns a module with default export\r\n * @returns LazyComponent function compatible with area.push()\r\n */\r\nexport function lazy<T extends CustomElementConstructor>(\r\n  loader: () => Promise<{ default: T }>\r\n): LazyComponent<T> {\r\n\r\n  // Create the lazy component function\r\n  const lazyComponent = function(): Promise<{ default: T }> {\r\n    // Return cached promise if already loading/loaded\r\n    if (lazyComponent._promise) {\r\n      return lazyComponent._promise\r\n    }\r\n\r\n    // Return cached module if already loaded\r\n    if (lazyComponent._module) {\r\n      return Promise.resolve(lazyComponent._module)\r\n    }\r\n\r\n    // Start loading and cache the promise\r\n    lazyComponent._promise = loader()\r\n      .then(module => {\r\n        // Cache the loaded module\r\n        lazyComponent._module = module\r\n        return module\r\n      })\r\n      .catch(error => {\r\n        // Clear promise on error to allow retry\r\n        lazyComponent._promise = undefined\r\n        throw error\r\n      })\r\n\r\n    return lazyComponent._promise\r\n  } as LazyComponent<T>\r\n\r\n  // Add preload method for manual preloading\r\n  lazyComponent.preload = async function(): Promise<void> {\r\n    try {\r\n      await lazyComponent()\r\n    } catch (error) {\r\n      console.error('Failed to preload component:', error)\r\n    }\r\n  }\r\n\r\n  return lazyComponent\r\n}\r\n\r\n\r\n"],"mappings":"AAsCA,SAAgB,EACd,GAAA;CAIA,IAAM,IAAgB,WAAA;EAEpB,OAAI,EAAc,WACT,EAAc,WAInB,EAAc,UACT,QAAQ,QAAQ,EAAc,OAAA,KAIvC,EAAc,WAAW,EAAA,EACtB,MAAK,OAEJ,EAAc,UAAU,GACjB,EAAA,EAER,OAAM,MAAA;GAGL,MADA,EAAc,WAAA,KAAW,GACnB;EAAA,CAAA,GAGH,EAAc;CACvB;CAWA,OARA,EAAc,UAAU,iBAAA;EACtB,IAAA;GAAA,MACQ,EAAA;EACR,QAAS,CAET;CACF,GAEO;AACT;AAAA,SAAA"}

package/dist/{lightbox-BiNK_plj.cjs → lightbox-D_EizrG3.cjs}

@@ -1,16 +1,16 @@
-require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=require(`./active-host-jH3iloCR.cjs`),n=require(`./overlay-stack-Bdr9lOqi.cjs`);let r=require(`rxjs`),i=require(`rxjs/operators`),a=require(`lit/directives/style-map.js`),o=require(`lit/decorators.js`),s=require(`lit`),c=require(`lit/directives/ref.js`),l=require(`lit/directives/when.js`),u=require(`lit/async-directive.js`),d=require(`lit/directive.js`);var f=class extends e.c{constructor(...e){super(...e),this.src=``,this.images=[],this.initialIndex=0,this.open=!1,this.currentIndex=0,this.isLoading=!1,this.zIndex=1e4,this.swipeThreshold=50,this.overlayRef=(0,c.createRef)(),this.contentRef=(0,c.createRef)(),this.imageRef=(0,c.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=e=>{e.target===e.currentTarget&&this.handleClose()}}static{this.styles=[s.css`
+require(`./chunk-CncqDLb2.cjs`);const e=require(`./SchmancyElement-DhSiMp6Y.cjs`);require(`./mixins-YQI9JogS.cjs`);const t=require(`./overlay-stack-Bdr9lOqi.cjs`);let n=require(`rxjs`),r=require(`rxjs/operators`),i=require(`lit/directives/style-map.js`),a=require(`lit/decorators.js`),o=require(`lit`),s=require(`lit/directives/ref.js`),c=require(`lit/directives/when.js`),l=require(`lit/async-directive.js`),u=require(`lit/directive.js`);var d=class extends e.t{constructor(...e){super(...e),this.src=``,this.images=[],this.initialIndex=0,this.open=!1,this.currentIndex=0,this.isLoading=!1,this.zIndex=1e4,this.swipeThreshold=50,this.overlayRef=(0,s.createRef)(),this.contentRef=(0,s.createRef)(),this.imageRef=(0,s.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=e=>{e.target===e.currentTarget&&this.handleClose()}}static{this.styles=[o.css`
 	:host {
 		display: contents;
 	}
-`]}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(e){super.updated(e),e.has(`open`)&&(this.open?(this.zIndex=n.t.getNextZIndex(),document.body.style.overflow=`hidden`,this.animateIn(),this.setupEventListeners()):(document.body.style.overflow=``,this.animateOut())),e.has(`initialIndex`)&&(this.currentIndex=this.initialIndex),e.has(`currentIndex`)&&this.open&&this.animateImageChange()}animateIn(){let e=this.overlayRef.value,t=this.contentRef.value,n=this.imageRef.value;e&&(e.style.backgroundColor=`rgba(0, 0, 0, 0)`,e.style.opacity=`0`,e.animate([{opacity:0},{opacity:1}],{duration:300,easing:`cubic-bezier(0.25, 1, 0.5, 1)`,fill:`forwards`}),requestAnimationFrame(()=>{e.style.backgroundColor=`rgba(0, 0, 0, 0.95)`})),t&&t.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`}),n&&n.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(){let e=this.overlayRef.value,t=this.contentRef.value,r=this.imageRef.value;r&&r.animate([{transform:`scale(1)`,opacity:1},{transform:`scale(0.95)`,opacity:0}],{duration:200,easing:`ease-out`,fill:`forwards`}),t&&t.animate([{transform:`scale(1)`,opacity:1},{transform:`scale(0.95)`,opacity:0}],{duration:250,easing:`ease-out`,fill:`forwards`}),e&&(e.animate([{opacity:1},{opacity:0}],{duration:250,delay:50,easing:`ease-out`,fill:`forwards`}).onfinish=()=>{e.style.backgroundColor=`rgba(0, 0, 0, 0)`,n.t.release(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0}))})}animateImageChange(){let e=this.imageRef.value;e&&(e.animate([{opacity:1,transform:`scale(1)`},{opacity:0,transform:`scale(0.98)`}],{duration:150,easing:`ease-out`,fill:`forwards`}).onfinish=()=>{e.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((0,r.fromEvent)(document,`keydown`).pipe((0,i.filter)(()=>this.open),(0,i.tap)(e=>{switch(e.key){case`Escape`:this.handleClose();break;case`ArrowLeft`:this.handlePrevious();break;case`ArrowRight`:this.handleNext()}}),(0,i.takeUntil)(this.disconnecting)).subscribe(),!this.isGalleryMode||this.images.length<=1)return;let e=this.contentRef.value;if(!e)return;let t=(0,r.fromEvent)(e,`touchstart`),n=(0,r.fromEvent)(e,`touchend`);t.pipe((0,i.switchMap)(e=>{let t=e.touches[0].clientX;return n.pipe((0,i.first)(),(0,i.map)(e=>e.changedTouches[0].clientX-t))}),(0,i.filter)(e=>Math.abs(e)>this.swipeThreshold),(0,i.tap)(e=>e>0?this.handlePrevious():this.handleNext()),(0,i.takeUntil)(this.disconnecting)).subscribe()}render(){return this.open?s.html`
+`]}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(e){super.updated(e),e.has(`open`)&&(this.open?(this.zIndex=t.t.getNextZIndex(),document.body.style.overflow=`hidden`,this.animateIn(),this.setupEventListeners()):(document.body.style.overflow=``,this.animateOut())),e.has(`initialIndex`)&&(this.currentIndex=this.initialIndex),e.has(`currentIndex`)&&this.open&&this.animateImageChange()}animateIn(){let e=this.overlayRef.value,t=this.contentRef.value,n=this.imageRef.value;e&&(e.style.backgroundColor=`rgba(0, 0, 0, 0)`,e.style.opacity=`0`,e.animate([{opacity:0},{opacity:1}],{duration:300,easing:`cubic-bezier(0.25, 1, 0.5, 1)`,fill:`forwards`}),requestAnimationFrame(()=>{e.style.backgroundColor=`rgba(0, 0, 0, 0.95)`})),t&&t.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`}),n&&n.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(){let e=this.overlayRef.value,n=this.contentRef.value,r=this.imageRef.value;r&&r.animate([{transform:`scale(1)`,opacity:1},{transform:`scale(0.95)`,opacity:0}],{duration:200,easing:`ease-out`,fill:`forwards`}),n&&n.animate([{transform:`scale(1)`,opacity:1},{transform:`scale(0.95)`,opacity:0}],{duration:250,easing:`ease-out`,fill:`forwards`}),e&&(e.animate([{opacity:1},{opacity:0}],{duration:250,delay:50,easing:`ease-out`,fill:`forwards`}).onfinish=()=>{e.style.backgroundColor=`rgba(0, 0, 0, 0)`,t.t.release(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0}))})}animateImageChange(){let e=this.imageRef.value;e&&(e.animate([{opacity:1,transform:`scale(1)`},{opacity:0,transform:`scale(0.98)`}],{duration:150,easing:`ease-out`,fill:`forwards`}).onfinish=()=>{e.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((0,n.fromEvent)(document,`keydown`).pipe((0,r.filter)(()=>this.open),(0,r.tap)(e=>{switch(e.key){case`Escape`:this.handleClose();break;case`ArrowLeft`:this.handlePrevious();break;case`ArrowRight`:this.handleNext()}}),(0,r.takeUntil)(this.disconnecting)).subscribe(),!this.isGalleryMode||this.images.length<=1)return;let e=this.contentRef.value;if(!e)return;let t=(0,n.fromEvent)(e,`touchstart`),i=(0,n.fromEvent)(e,`touchend`);t.pipe((0,r.switchMap)(e=>{let t=e.touches[0].clientX;return i.pipe((0,r.first)(),(0,r.map)(e=>e.changedTouches[0].clientX-t))}),(0,r.filter)(e=>Math.abs(e)>this.swipeThreshold),(0,r.tap)(e=>e>0?this.handlePrevious():this.handleNext()),(0,r.takeUntil)(this.disconnecting)).subscribe()}render(){return this.open?o.html`
 			<div
-				${(0,c.ref)(this.overlayRef)}
+				${(0,s.ref)(this.overlayRef)}
 				class="fixed inset-0 flex items-center justify-center backdrop-blur-sm"
 				style="z-index: ${this.zIndex}"
 				@click=${this.handleOverlayClick}
 			>
 				<div
-					${(0,c.ref)(this.contentRef)}
+					${(0,s.ref)(this.contentRef)}
 					class="relative max-w-[90vw] max-h-[90vh]"
 					@click=${e=>e.stopPropagation()}
 				>
@@ -25,7 +25,7 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 					</button>
 
 					<!-- Touch Zones for Gallery Navigation -->
-					${(0,l.when)(this.isGalleryMode&&this.images.length>1,()=>s.html`
+					${(0,c.when)(this.isGalleryMode&&this.images.length>1,()=>o.html`
 							<div
 								class="absolute top-0 bottom-0 left-0 w-1/3 cursor-pointer z-5"
 								@click=${this.handlePrevious}
@@ -37,7 +37,7 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 						`)}
 
 					<!-- Loading Spinner -->
-					${(0,l.when)(this.isLoading,()=>s.html`
+					${(0,c.when)(this.isLoading,()=>o.html`
 							<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">
 								<schmancy-progress indeterminate></schmancy-progress>
 							</div>
@@ -45,7 +45,7 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 
 					<!-- Main Image -->
 					<img
-						${(0,c.ref)(this.imageRef)}
+						${(0,s.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"
@@ -54,7 +54,7 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 					/>
 
 					<!-- Navigation Controls (Gallery Mode Only) -->
-					${(0,l.when)(this.isGalleryMode&&this.images.length>1,()=>s.html`
+					${(0,c.when)(this.isGalleryMode&&this.images.length>1,()=>o.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"
 							>
@@ -83,11 +83,11 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 						`)}
 				</div>
 			</div>
-		`:s.html``}};function p(e,t,n=`up`,r=.3){let i=(e.x+t.x)/2,a=(e.y+t.y)/2,o=Math.sqrt((t.x-e.x)**2+(t.y-e.y)**2),s=Math.min(o*r,150);return{x:i,y:n===`up`?a-s:a+s}}t.a([(0,o.property)({type:String})],f.prototype,`src`,void 0),t.a([(0,o.property)({type:Array})],f.prototype,`images`,void 0),t.a([(0,o.property)({type:Number})],f.prototype,`initialIndex`,void 0),t.a([(0,o.property)({type:Boolean})],f.prototype,`open`,void 0),t.a([(0,o.state)()],f.prototype,`currentIndex`,void 0),t.a([(0,o.state)()],f.prototype,`isLoading`,void 0),t.a([(0,o.state)()],f.prototype,`zIndex`,void 0),f=t.a([(0,o.customElement)(`schmancy-lightbox`)],f);var m=class extends u.AsyncDirective{constructor(e){if(super(e),this.hasAnimated=!1,e.type!==d.PartType.ELEMENT)throw Error(`flip directive can only be used on elements`)}render(e){return s.noChange}update(e,[t]){this.element=e.element;let n=t?.sourceElement||t?.position;return!this.hasAnimated&&n&&(this.hasAnimated=!0,this.animateIn(t)),s.noChange}animateIn(e){if(!this.element||window.matchMedia(`(prefers-reduced-motion: reduce)`).matches)return;let t=e?.duration??600,n=!1!==e?.scale,r=!1!==e?.blackbird,i=(a=e?.position,a?`clientX`in a?{x:a.clientX,y:a.clientY}:`touches`in a&&a.touches.length?{x:a.touches[0].clientX,y:a.touches[0].clientY}:`x`in a&&`y`in a?{x:a.x,y:a.y}:null:null);var a;let o=e?.sourceElement?.getBoundingClientRect(),s=()=>{let a=this.element.getBoundingClientRect(),s={x:a.left+a.width/2,y:a.top+a.height/2},c,l={x:.1,y:.1};o?(c={x:o.left+o.width/2,y:o.top+o.height/2},n&&(l={x:o.width/a.width,y:o.height/a.height})):c=i||{x:window.innerWidth/2,y:window.innerHeight/2};let u=c.x-s.x,d=c.y-s.y;if(r&&i&&o){let e={x:i.x-s.x,y:i.y-s.y},n=p(c,i,`up`,.4),r=p(i,s,`down`,.3),a={x:n.x-s.x,y:n.y-s.y},o={x:r.x-s.x,y:r.y-s.y},f=.3;this.element.animate([{transform:`translate(${u}px, ${d}px) scale(${l.x}, ${l.y})`,opacity:.6,offset:0},{transform:`translate(${a.x}px, ${a.y}px) scale(${.7*f})`,opacity:.8,offset:.25},{transform:`translate(${e.x}px, ${e.y}px) scale(${f})`,opacity:.9,offset:.5},{transform:`translate(${o.x}px, ${o.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(r&&i){let e=p(i,s,`down`,.35),n={x:e.x-s.x,y:e.y-s.y};this.element.animate([{transform:`translate(${u}px, ${d}px) scale(0.1)`,opacity:0,offset:0},{transform:`translate(${n.x}px, ${n.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(${u}px, ${d}px) scale(${l.x}, ${l.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(s):this.element.addEventListener(`load`,()=>requestAnimationFrame(s),{once:!0}):requestAnimationFrame(s)}},h=(0,d.directive)(m),g=class extends u.AsyncDirective{constructor(e){if(super(e),this.currentIndex=0,this.images=[],e.type!==d.PartType.ELEMENT)throw Error(`lightbox directive can only be used on elements`)}render(e){return s.noChange}update(e,[t]){return this.element=e.element,this.clickHandler||(this.clickHandler=e=>{if(e.preventDefault(),e.stopPropagation(),`clientX`in e)this.clickPosition={x:e.clientX,y:e.clientY};else if(`touches`in e&&e.touches.length){let t=e.touches[0];this.clickPosition={x:t.clientX,y:t.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`)),s.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`,(0,s.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;let e=this.overlayElement.querySelector(`[data-lightbox-content]`);if(e&&this.clickPosition){let t=e.getBoundingClientRect(),n=this.clickPosition.x-(t.left+t.width/2),r=this.clickPosition.y-(t.top+t.height/2),i=e.animate([{transform:`translate(0, 0) scale(1)`,opacity:1},{transform:`translate(${n}px, ${r}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`}),i.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),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&&(0,s.render)(this.renderLightbox(),this.overlayElement)}renderLightbox(){let e=this.images[this.currentIndex],t=this.images.length>1;return s.html`
+		`:o.html``}};function f(e,t,n=`up`,r=.3){let i=(e.x+t.x)/2,a=(e.y+t.y)/2,o=Math.sqrt((t.x-e.x)**2+(t.y-e.y)**2),s=Math.min(o*r,150);return{x:i,y:n===`up`?a-s:a+s}}e.p([(0,a.property)({type:String})],d.prototype,`src`,void 0),e.p([(0,a.property)({type:Array})],d.prototype,`images`,void 0),e.p([(0,a.property)({type:Number})],d.prototype,`initialIndex`,void 0),e.p([(0,a.property)({type:Boolean})],d.prototype,`open`,void 0),e.p([(0,a.state)()],d.prototype,`currentIndex`,void 0),e.p([(0,a.state)()],d.prototype,`isLoading`,void 0),e.p([(0,a.state)()],d.prototype,`zIndex`,void 0),d=e.p([(0,a.customElement)(`schmancy-lightbox`)],d);var p=class extends l.AsyncDirective{constructor(e){if(super(e),this.hasAnimated=!1,e.type!==u.PartType.ELEMENT)throw Error(`flip directive can only be used on elements`)}render(e){return o.noChange}update(e,[t]){this.element=e.element;let n=t?.sourceElement||t?.position;return!this.hasAnimated&&n&&(this.hasAnimated=!0,this.animateIn(t)),o.noChange}animateIn(e){if(!this.element||window.matchMedia(`(prefers-reduced-motion: reduce)`).matches)return;let t=e?.duration??600,n=!1!==e?.scale,r=!1!==e?.blackbird,i=(a=e?.position,a?`clientX`in a?{x:a.clientX,y:a.clientY}:`touches`in a&&a.touches.length?{x:a.touches[0].clientX,y:a.touches[0].clientY}:`x`in a&&`y`in a?{x:a.x,y:a.y}:null:null);var a;let o=e?.sourceElement?.getBoundingClientRect(),s=()=>{let a=this.element.getBoundingClientRect(),s={x:a.left+a.width/2,y:a.top+a.height/2},c,l={x:.1,y:.1};o?(c={x:o.left+o.width/2,y:o.top+o.height/2},n&&(l={x:o.width/a.width,y:o.height/a.height})):c=i||{x:window.innerWidth/2,y:window.innerHeight/2};let u=c.x-s.x,d=c.y-s.y;if(r&&i&&o){let e={x:i.x-s.x,y:i.y-s.y},n=f(c,i,`up`,.4),r=f(i,s,`down`,.3),a={x:n.x-s.x,y:n.y-s.y},o={x:r.x-s.x,y:r.y-s.y},p=.3;this.element.animate([{transform:`translate(${u}px, ${d}px) scale(${l.x}, ${l.y})`,opacity:.6,offset:0},{transform:`translate(${a.x}px, ${a.y}px) scale(${.7*p})`,opacity:.8,offset:.25},{transform:`translate(${e.x}px, ${e.y}px) scale(${p})`,opacity:.9,offset:.5},{transform:`translate(${o.x}px, ${o.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(r&&i){let e=f(i,s,`down`,.35),n={x:e.x-s.x,y:e.y-s.y};this.element.animate([{transform:`translate(${u}px, ${d}px) scale(0.1)`,opacity:0,offset:0},{transform:`translate(${n.x}px, ${n.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(${u}px, ${d}px) scale(${l.x}, ${l.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(s):this.element.addEventListener(`load`,()=>requestAnimationFrame(s),{once:!0}):requestAnimationFrame(s)}},m=(0,u.directive)(p),h=class extends l.AsyncDirective{constructor(e){if(super(e),this.currentIndex=0,this.images=[],e.type!==u.PartType.ELEMENT)throw Error(`lightbox directive can only be used on elements`)}render(e){return o.noChange}update(e,[t]){return this.element=e.element,this.clickHandler||(this.clickHandler=e=>{if(e.preventDefault(),e.stopPropagation(),`clientX`in e)this.clickPosition={x:e.clientX,y:e.clientY};else if(`touches`in e&&e.touches.length){let t=e.touches[0];this.clickPosition={x:t.clientX,y:t.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`)),o.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`,(0,o.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;let e=this.overlayElement.querySelector(`[data-lightbox-content]`);if(e&&this.clickPosition){let t=e.getBoundingClientRect(),n=this.clickPosition.x-(t.left+t.width/2),r=this.clickPosition.y-(t.top+t.height/2),i=e.animate([{transform:`translate(0, 0) scale(1)`,opacity:1},{transform:`translate(${n}px, ${r}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`}),i.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),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&&(0,o.render)(this.renderLightbox(),this.overlayElement)}renderLightbox(){let e=this.images[this.currentIndex],t=this.images.length>1;return o.html`
 			<div
 				data-lightbox-content
 				class="relative"
-				style=${(0,a.styleMap)({transformOrigin:`center center`})}
+				style=${(0,i.styleMap)({transformOrigin:`center center`})}
 				@click=${e=>e.stopPropagation()}
 			>
 				<!-- Close button -->
@@ -103,7 +103,7 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 				<div class="relative">
 					<img
 						src=${e}
-						${h({sourceElement:this.element,position:this.clickPosition,duration:600,scale:!0,blackbird:!0})}
+						${m({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()}
@@ -112,7 +112,7 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 				</div>
 
 				<!-- Gallery controls -->
-				${t?s.html`
+				${t?o.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"
@@ -134,7 +134,7 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 							</div>
 						`:``}
 			</div>
-		`}disconnected(){this.element&&this.clickHandler&&this.element.removeEventListener(`click`,this.clickHandler),this.close()}},_=(0,d.directive)(g),v=class t{constructor(){this.pushSubject=new r.Subject,this.dismissSubject=new r.Subject,this.setupLightboxOpeningLogic(),this.setupLightboxDismissLogic()}static getInstance(){return t.instance||=new t,t.instance}setupLightboxOpeningLogic(){this.pushSubject.pipe((0,r.switchMap)(t=>e.y(`schmancy-theme`).pipe((0,r.map)(e=>{let r=e||document.body,i=document.createElement(`div`);return i.className=`fixed inset-0 flex items-center justify-center opacity-0 bg-black/95 backdrop-blur-sm`,i.style.zIndex=String(n.t.getNextZIndex()),r.appendChild(i),document.body.style.overflow=`hidden`,{overlay:i,config:t,container:r}}))),(0,r.tap)(({overlay:e,config:t})=>{let n=[],i=0;t.images&&t.images.length>0?(n=t.images,i=t.index||0):t.image&&(n=[t.image],i=0),this.activeLightbox={element:e,config:t,currentIndex:i,images:n},(0,r.fromEvent)(document,`keydown`).pipe((0,r.takeUntil)(this.dismissSubject),(0,r.filter)(()=>!!this.activeLightbox),(0,r.tap)(e=>{e.key===`Escape`&&this.dismiss(),e.key===`ArrowLeft`&&this.activeLightbox.images.length>1&&this.navigatePrev(),e.key===`ArrowRight`&&this.activeLightbox.images.length>1&&this.navigateNext()})).subscribe(),(0,r.fromEvent)(e,`click`).pipe((0,r.takeUntil)(this.dismissSubject),(0,r.filter)(t=>t.target===e),(0,r.tap)(()=>this.dismiss())).subscribe(),t.component?this.renderComponent(e,t):this.renderLightbox(e,t,n,i),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((0,r.tap)(()=>{if(!this.activeLightbox)return;let{element:e}=this.activeLightbox;e.animate([{opacity:1},{opacity:0}],{duration:250,easing:`ease-out`,fill:`forwards`}).onfinish=()=>{e.remove(),document.body.style.overflow=``,n.t.release()},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;let{images:e,config:t,element:n}=this.activeLightbox;this.activeLightbox.currentIndex=(this.activeLightbox.currentIndex-1+e.length)%e.length,this.renderLightbox(n,t,e,this.activeLightbox.currentIndex)}navigateNext(){if(!this.activeLightbox||this.activeLightbox.images.length<=1)return;let{images:e,config:t,element:n}=this.activeLightbox;this.activeLightbox.currentIndex=(this.activeLightbox.currentIndex+1)%e.length,this.renderLightbox(n,t,e,this.activeLightbox.currentIndex)}renderComponent(e,t){if(!t.component)return;let n;n=typeof t.component==`string`?document.createElement(t.component):new t.component,t.props&&Object.entries(t.props).forEach(([e,t])=>{n[e]=t}),(0,s.render)(s.html`
+		`}disconnected(){this.element&&this.clickHandler&&this.element.removeEventListener(`click`,this.clickHandler),this.close()}},g=(0,u.directive)(h),_=class r{constructor(){this.pushSubject=new n.Subject,this.dismissSubject=new n.Subject,this.setupLightboxOpeningLogic(),this.setupLightboxDismissLogic()}static getInstance(){return r.instance||=new r,r.instance}setupLightboxOpeningLogic(){this.pushSubject.pipe((0,n.switchMap)(r=>e.b(`schmancy-theme`).pipe((0,n.map)(e=>{let n=e||document.body,i=document.createElement(`div`);return i.className=`fixed inset-0 flex items-center justify-center opacity-0 bg-black/95 backdrop-blur-sm`,i.style.zIndex=String(t.t.getNextZIndex()),n.appendChild(i),document.body.style.overflow=`hidden`,{overlay:i,config:r,container:n}}))),(0,n.tap)(({overlay:e,config:t})=>{let r=[],i=0;t.images&&t.images.length>0?(r=t.images,i=t.index||0):t.image&&(r=[t.image],i=0),this.activeLightbox={element:e,config:t,currentIndex:i,images:r},(0,n.fromEvent)(document,`keydown`).pipe((0,n.takeUntil)(this.dismissSubject),(0,n.filter)(()=>!!this.activeLightbox),(0,n.tap)(e=>{e.key===`Escape`&&this.dismiss(),e.key===`ArrowLeft`&&this.activeLightbox.images.length>1&&this.navigatePrev(),e.key===`ArrowRight`&&this.activeLightbox.images.length>1&&this.navigateNext()})).subscribe(),(0,n.fromEvent)(e,`click`).pipe((0,n.takeUntil)(this.dismissSubject),(0,n.filter)(t=>t.target===e),(0,n.tap)(()=>this.dismiss())).subscribe(),t.component?this.renderComponent(e,t):this.renderLightbox(e,t,r,i),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((0,n.tap)(()=>{if(!this.activeLightbox)return;let{element:e}=this.activeLightbox;e.animate([{opacity:1},{opacity:0}],{duration:250,easing:`ease-out`,fill:`forwards`}).onfinish=()=>{e.remove(),document.body.style.overflow=``,t.t.release()},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;let{images:e,config:t,element:n}=this.activeLightbox;this.activeLightbox.currentIndex=(this.activeLightbox.currentIndex-1+e.length)%e.length,this.renderLightbox(n,t,e,this.activeLightbox.currentIndex)}navigateNext(){if(!this.activeLightbox||this.activeLightbox.images.length<=1)return;let{images:e,config:t,element:n}=this.activeLightbox;this.activeLightbox.currentIndex=(this.activeLightbox.currentIndex+1)%e.length,this.renderLightbox(n,t,e,this.activeLightbox.currentIndex)}renderComponent(e,t){if(!t.component)return;let n;n=typeof t.component==`string`?document.createElement(t.component):new t.component,t.props&&Object.entries(t.props).forEach(([e,t])=>{n[e]=t}),(0,o.render)(o.html`
 			<div class="relative" @click=${e=>e.stopPropagation()}>
 				<!-- Close button -->
 				<button
@@ -148,10 +148,10 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 				<!-- Component container -->
 				<div id="lightbox-component-container"></div>
 			</div>
-		`,e);let r=e.querySelector(`#lightbox-component-container`);r&&r.appendChild(n)}renderLightbox(e,t,n,r){let i=n[r],o=n.length>1,c=null;if(t.overlay&&(typeof t.overlay==`string`?c=document.createElement(t.overlay):typeof t.overlay==`function`&&(c=new t.overlay),t.props&&c&&Object.entries(t.props).forEach(([e,t])=>{c[e]=t})),(0,s.render)(s.html`
+		`,e);let r=e.querySelector(`#lightbox-component-container`);r&&r.appendChild(n)}renderLightbox(e,t,n,r){let a=n[r],s=n.length>1,c=null;if(t.overlay&&(typeof t.overlay==`string`?c=document.createElement(t.overlay):typeof t.overlay==`function`&&(c=new t.overlay),t.props&&c&&Object.entries(t.props).forEach(([e,t])=>{c[e]=t})),(0,o.render)(o.html`
 			<div
 				class="relative"
-				style=${(0,a.styleMap)({maxWidth:`90vw`,maxHeight:`90vh`})}
+				style=${(0,i.styleMap)({maxWidth:`90vw`,maxHeight:`90vh`})}
 				@click=${e=>e.stopPropagation()}
 			>
 				<!-- Close button -->
@@ -166,18 +166,18 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 				<!-- Image container with optional overlay -->
 				<div class="relative" id="lightbox-image-container">
 					<img
-						src=${i}
+						src=${a}
 						class="max-w-full object-contain rounded-lg"
-						style=${(0,a.styleMap)({maxHeight:`85vh`})}
-						@click=${()=>!o&&this.dismiss()}
+						style=${(0,i.styleMap)({maxHeight:`85vh`})}
+						@click=${()=>!s&&this.dismiss()}
 					/>
 				</div>
 
 				<!-- Gallery controls -->
-				${o?s.html`
+				${s?o.html`
 							<div
 								class="absolute left-1/2 -translate-x-1/2 flex items-center gap-4 text-white"
-								style=${(0,a.styleMap)({bottom:`-60px`})}
+								style=${(0,i.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"
@@ -199,4 +199,4 @@ require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-CxGRIPYQ.cjs`),t=requi
 							</div>
 						`:``}
 			</div>
-		`,e),c){let t=e.querySelector(`#lightbox-image-container`);if(t){let e=t.querySelector(`[data-lightbox-overlay]`);e&&e.remove(),c.setAttribute(`data-lightbox-overlay`,``),t.appendChild(c)}}}},y=Object.assign(e=>_(e),{push:e=>v.getInstance().push(e),dismiss:()=>v.getInstance().dismiss()});Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return y}});
+		`,e),c){let t=e.querySelector(`#lightbox-image-container`);if(t){let e=t.querySelector(`[data-lightbox-overlay]`);e&&e.remove(),c.setAttribute(`data-lightbox-overlay`,``),t.appendChild(c)}}}},v=Object.assign(e=>g(e),{push:e=>_.getInstance().push(e),dismiss:()=>_.getInstance().dismiss()});Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return v}});