@mhmo91/schmancy 0.10.20 → 0.10.21

package/dist/scroll-Bj7FsS08.js

@@ -1,115 +0,0 @@
-import { c as e } from "./mixins-B9kY_60p.js";
-import { a as t } from "./active-host-BP0zy_Y9.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 {
-	constructor(...e) {
-		super(...e), this.hide = !1, this.direction = "both", this.debounce = 10;
-	}
-	static {
-		this.styles = [c`
-	:host {
-		/* Flexible sizing for different layout contexts */
-		width: 100%;
-		min-height: 0; /* Allow flex shrinking */
-		flex: 1; /* Grow in flex containers */
-		box-sizing: border-box; /* Ensures proper sizing */
-		display: block;
-		position: relative;
-		scroll-behavior: smooth;
-		overscroll-behavior-x: contain;
-		overscroll-behavior-y: auto;
-	}
-	/* Fallback for non-flex contexts */
-	:host(.explicit-height) {
-		height: 100%;
-		flex: none;
-	}
-	:host([hide]) {
-		-ms-overflow-style: none; /* IE and Edge */
-		scrollbar-width: none; /* Firefox */
-	}
-	: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() {
-		i(this.scroller, "scroll", { passive: !0 }).pipe(n(this.debounce), a(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
-			}));
-		}), i(window, "@schmancy:scrollTo").pipe(r((e) => this.name !== void 0 && e.detail.name === this.name), a(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 l`<slot></slot>`;
-	}
-};
-t([s({
-	type: Boolean,
-	reflect: !0
-})], u.prototype, "hide", void 0), t([s({
-	type: String,
-	reflect: !0
-})], u.prototype, "name", void 0), t([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);
-export { u as t };

package/dist/scroll-Bj7FsS08.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"scroll-Bj7FsS08.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/scroll-Djz3pJfX.cjs

@@ -1,26 +0,0 @@
-require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-BwGJwK7X.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`
-	:host {
-		/* Flexible sizing for different layout contexts */
-		width: 100%;
-		min-height: 0; /* Allow flex shrinking */
-		flex: 1; /* Grow in flex containers */
-		box-sizing: border-box; /* Ensures proper sizing */
-		display: block;
-		position: relative;
-		scroll-behavior: smooth;
-		overscroll-behavior-x: contain;
-		overscroll-behavior-y: auto;
-	}
-	/* Fallback for non-flex contexts */
-	:host(.explicit-height) {
-		height: 100%;
-		flex: none;
-	}
-	:host([hide]) {
-		-ms-overflow-style: none; /* IE and Edge */
-		scrollbar-width: none; /* Firefox */
-	}
-	: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,`t`,{enumerable:!0,get:function(){return a}});

package/dist/scroll-Djz3pJfX.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"scroll-Djz3pJfX.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/src/page/index.ts

@@ -1 +0,0 @@
-export * from './page'

package/src/page/page.ts

@@ -1,137 +0,0 @@
-import { SchmancyElement } from '@mixins/index'
-import { css, html } from 'lit'
-import { customElement, property } from 'lit/decorators.js'
-import '../layout/scroll/scroll'
-import { Subject, fromEvent, merge, EMPTY, timer, combineLatest } from 'rxjs'
-import { debounceTime, switchMap, takeUntil, distinctUntilChanged, map, tap, startWith } from 'rxjs/operators'
-import { theme } from '../theme/theme.service'
-import { fromResizeObserver } from '../directives/layout'
-
-/**
- * Native mobile-like page container.
- * Prevents double-tap zoom, pull-to-refresh, rubber-banding.
- * Automatically fills remaining viewport height.
- *
- * @element schmancy-page
- *
- * @example
- * html`
- *   <schmancy-page rows="1fr_2fr_auto">
- *     <header>App Bar</header>
- *     <main>Scrollable content</main>
- *     <footer>Navigation</footer>
- *   </schmancy-page>
- * `
- */
-@customElement('schmancy-page')
-export class SchmancyPage extends SchmancyElement {
-	static styles = [css`
-	:host {
-		display: block;
-		box-sizing: border-box;
-		touch-action: pan-x pan-y;
-		overscroll-behavior: none;
-		-webkit-tap-highlight-color: transparent;
-	}
-`]
-
-	/** Custom grid-template-rows using underscores (e.g. "1fr_2fr_auto") */
-	@property({ type: String })
-	rows = 'auto_1fr_auto'
-
-	@property({ type: Boolean, attribute: 'show-scrollbar' })
-	showScrollbar = false
-
-	@property({ type: Boolean, attribute: 'no-select' })
-	noSelect = false
-
-	private heightDisconnecting$ = new Subject<void>()
-
-	private calculateHeight(): number {
-		const viewportHeight = window.visualViewport?.height ?? window.innerHeight
-		const topOffset = this.getBoundingClientRect().top
-		return Math.max(0, viewportHeight - topOffset)
-	}
-
-	private applyHeight(height: number, bottomPadding: number) {
-		this.style.height = `${height}px`
-		this.style.paddingBottom = `${bottomPadding}px`
-	}
-
-	private setupHeightStream() {
-		// Shared resize stream
-		const windowResize$ = fromEvent(window, 'resize', { passive: true })
-		const viewportEvents$ = window.visualViewport
-			? merge(
-					fromEvent(window.visualViewport, 'resize', { passive: true }),
-					fromEvent(window.visualViewport, 'scroll', { passive: true })
-				)
-			: windowResize$
-		const orientation$ = fromEvent(window, 'orientationchange')
-		const focusOut$ = fromEvent(document, 'focusout', { passive: true }).pipe(
-			switchMap(() => timer(100))
-		)
-
-		const globalEvents$ = merge(windowResize$, viewportEvents$, orientation$, focusOut$).pipe(
-			debounceTime(16)
-		)
-
-		// Parent resize detects layout shifts
-		const parentResize$ = this.parentElement
-			? fromResizeObserver(this.parentElement)
-			: EMPTY
-
-		// Combine all sources, calculate height and padding, dedupe, apply
-		combineLatest([
-			merge(parentResize$, globalEvents$).pipe(startWith(null)),
-			theme.bottomOffset$,
-			theme.fullscreen$
-		]).pipe(
-			map(([, bottomOffset, isFullscreen]) => ({
-				height: this.calculateHeight(),
-				padding: isFullscreen ? 0 : bottomOffset
-			})),
-			distinctUntilChanged((a, b) => a.height === b.height && a.padding === b.padding),
-			tap(({ height, padding }) => this.applyHeight(height, padding)),
-			takeUntil(this.heightDisconnecting$)
-		).subscribe()
-	}
-
-	connectedCallback() {
-		super.connectedCallback()
-		// Auto-assign semantic elements to slots
-		this.querySelectorAll(':scope > header').forEach(el => el.setAttribute('slot', 'header'))
-		this.querySelectorAll(':scope > footer').forEach(el => el.setAttribute('slot', 'footer'))
-		// Setup fullHeight on host
-		this.setupHeightStream()
-	}
-
-	disconnectedCallback() {
-		super.disconnectedCallback()
-		this.heightDisconnecting$.next()
-	}
-
-	protected render() {
-		return html`
-			<section
-				class=${this.classMap({
-					'grid overflow-hidden h-full': true,
-					'select-none': this.noSelect,
-				})}
-				style="grid-template-rows: ${this.rows.replace(/_/g, ' ')}"
-			>
-				<slot name="header"></slot>
-				<schmancy-scroll ?hide=${!this.showScrollbar}><slot></slot></schmancy-scroll>
-				<schmancy-scroll ?hide=${!this.showScrollbar}>
-					<slot name="footer"></slot>
-				</schmancy-scroll>
-			</section>
-		`
-	}
-}
-
-declare global {
-	interface HTMLElementTagNameMap {
-		'schmancy-page': SchmancyPage
-	}
-}

package/types/src/page/index.d.ts

@@ -1 +0,0 @@
-export * from './page';

package/types/src/page/page.d.ts

@@ -1,37 +0,0 @@
-import { SchmancyElement } from '@mixins/index';
-import '../layout/scroll/scroll';
-/**
- * Native mobile-like page container.
- * Prevents double-tap zoom, pull-to-refresh, rubber-banding.
- * Automatically fills remaining viewport height.
- *
- * @element schmancy-page
- *
- * @example
- * html`
- *   <schmancy-page rows="1fr_2fr_auto">
- *     <header>App Bar</header>
- *     <main>Scrollable content</main>
- *     <footer>Navigation</footer>
- *   </schmancy-page>
- * `
- */
-export declare class SchmancyPage extends SchmancyElement {
-    static styles: import("lit").CSSResult[];
-    /** Custom grid-template-rows using underscores (e.g. "1fr_2fr_auto") */
-    rows: string;
-    showScrollbar: boolean;
-    noSelect: boolean;
-    private heightDisconnecting$;
-    private calculateHeight;
-    private applyHeight;
-    private setupHeightStream;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    protected render(): import("lit-html").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'schmancy-page': SchmancyPage;
-    }
-}