@mhmo91/schmancy 0.10.42 → 0.10.43

package/src/utils/overlay-stack.ts

@@ -92,9 +92,7 @@ class OverlayStackManager {
 	 * Get all tracked IDs sorted by z-index (lowest first, front-most last).
 	 */
 	getStackOrder(): string[] {
-		return [...this.idMap.entries()]
-			.toSorted(([, a], [, b]) => a - b)
-			.map(([id]) => id)
+		return [...this.idMap.entries()].toSorted(([, a], [, b]) => a - b).map(([id]) => id)
 	}
 }
 

package/src/utils/search.ts

@@ -80,7 +80,7 @@ export function similarity(query: string, target: string, options?: SimilarityOp
 	if (normalizedTarget.startsWith(normalizedQuery)) {
 		// Give higher score to shorter targets (more precise matches)
 		const lengthRatio = normalizedQuery.length / normalizedTarget.length
-		return 0.95 + (lengthRatio * 0.05) // Score between 0.95 and 1.0
+		return 0.95 + lengthRatio * 0.05 // Score between 0.95 and 1.0
 	}
 
 	// 3. Word boundary match (query matches start of any word in target)
@@ -116,11 +116,7 @@ export function similarity(query: string, target: string, options?: SimilarityOp
 
 	// 6b. Levenshtein distance (good for typos)
 	const maxLength = Math.max(normalizedQuery.length, normalizedTarget.length)
-	const levenshteinDistance = calculateLevenshtein(
-		normalizedQuery,
-		normalizedTarget,
-		opts.maxLevenshteinDistance
-	)
+	const levenshteinDistance = calculateLevenshtein(normalizedQuery, normalizedTarget, opts.maxLevenshteinDistance)
 	const levenshteinScore = maxLength ? (1 - levenshteinDistance / maxLength) * SCORE_WEIGHT_LEVENSHTEIN : 0
 	if (levenshteinScore > maxScore) maxScore = levenshteinScore
 
@@ -302,9 +298,9 @@ function calculateLevenshtein(a: string, b: string, maxDistance = 0): number {
 		for (let j = 1; j <= a.length; j++) {
 			const cost = a[j - 1] === b[i - 1] ? 0 : 1
 			currRow[j] = Math.min(
-				prevRow[j] + 1,        // deletion
-				currRow[j - 1] + 1,    // insertion
-				prevRow[j - 1] + cost  // substitution
+				prevRow[j] + 1, // deletion
+				currRow[j - 1] + 1, // insertion
+				prevRow[j - 1] + cost, // substitution
 			)
 			if (currRow[j] < minRowValue) minRowValue = currRow[j]
 		}

package/src/visually-hidden/visually-hidden.ts

@@ -15,19 +15,21 @@ import { customElement } from 'lit/decorators.js'
  */
 @customElement('schmancy-visually-hidden')
 export class SchmancyVisuallyHidden extends SchmancyElement {
-	static styles = [css`
-	:host {
-		position: absolute;
-		width: 1px;
-		height: 1px;
-		padding: 0;
-		margin: -1px;
-		overflow: hidden;
-		clip: rect(0, 0, 0, 0);
-		white-space: nowrap;
-		border-width: 0;
-	}
-`];
+	static styles = [
+		css`
+			:host {
+				position: absolute;
+				width: 1px;
+				height: 1px;
+				padding: 0;
+				margin: -1px;
+				overflow: hidden;
+				clip: rect(0, 0, 0, 0);
+				white-space: nowrap;
+				border-width: 0;
+			}
+		`,
+	]
 	render() {
 		return html`<slot></slot>`
 	}

package/src/window/window-manager.ts

@@ -198,7 +198,12 @@ class WindowManagerService {
 
 /** Simple rect overlap check (inline — no circular import with window-position) */
 function rectsOverlap(a: WindowBounds, b: WindowBounds): boolean {
-	return !(a.left >= b.left + b.width || a.left + a.width <= b.left || a.top >= b.top + b.height || a.top + a.height <= b.top)
+	return !(
+		a.left >= b.left + b.width ||
+		a.left + a.width <= b.left ||
+		a.top >= b.top + b.height ||
+		a.top + a.height <= b.top
+	)
 }
 
 export const windowManager = WindowManagerService.getInstance()

package/src/window/window-position.ts

@@ -19,7 +19,12 @@ const MAX_CASCADE_ATTEMPTS = 10
 
 /** Check if two rectangles overlap (edges touching does NOT count as overlap) */
 export function rectsOverlap(a: WindowBounds, b: WindowBounds): boolean {
-	return !(a.left >= b.left + b.width || a.left + a.width <= b.left || a.top >= b.top + b.height || a.top + a.height <= b.top)
+	return !(
+		a.left >= b.left + b.width ||
+		a.left + a.width <= b.left ||
+		a.top >= b.top + b.height ||
+		a.top + a.height <= b.top
+	)
 }
 
 /**
@@ -47,10 +52,7 @@ export function resolveOverlap(
 /**
  * Clamp bounds so the window stays fully within the viewport.
  */
-export function clampToViewport(
-	bounds: WindowBounds,
-	viewport: { width: number; height: number },
-): WindowBounds {
+export function clampToViewport(bounds: WindowBounds, viewport: { width: number; height: number }): WindowBounds {
 	return {
 		width: bounds.width,
 		height: bounds.height,

package/src/window/window.ts

@@ -39,16 +39,18 @@ interface Position {
 
 @customElement('schmancy-window')
 export default class SchmancyWindow extends SchmancyElement {
-	static styles = [css`
-	:host {
-		display: contents;
-		position: relative;
-		z-index: 1000;
-	}
-	:host([hidden]) {
-		display: none !important;
-	}
-`]
+	static styles = [
+		css`
+			:host {
+				display: contents;
+				position: relative;
+				z-index: 1000;
+			}
+			:host([hidden]) {
+				display: none !important;
+			}
+		`,
+	]
 
 	@property({ type: String }) id: string = 'default'
 	/** Override the expanded panel width (e.g. '320px', '24rem'). Defaults to responsive sizing. */
@@ -200,9 +202,7 @@ export default class SchmancyWindow extends SchmancyElement {
 		// L -- calculate nearest corner using head visual center
 		const currentIsBottom = this.currentCorner.includes('bottom')
 		const headCenterX = rect.left + rect.width / 2
-		const headCenterY = currentIsBottom
-			? rect.bottom - HEAD_HEIGHT / 2
-			: rect.top + HEAD_HEIGHT / 2
+		const headCenterY = currentIsBottom ? rect.bottom - HEAD_HEIGHT / 2 : rect.top + HEAD_HEIGHT / 2
 		const side = headCenterX > window.innerWidth / 2 ? 'right' : 'left'
 		const vert = headCenterY > window.innerHeight / 2 ? 'bottom' : 'top'
 		const newCorner: SnapCorner = `${vert}-${side}` as SnapCorner
@@ -219,7 +219,12 @@ export default class SchmancyWindow extends SchmancyElement {
 		if (skipAnimation || reducedMotion$.value) {
 			this.savePosition()
 			const snapRect = container.getBoundingClientRect()
-			windowManager.updateBounds(this.id, { left: snapRect.left, top: snapRect.top, width: snapRect.width, height: snapRect.height })
+			windowManager.updateBounds(this.id, {
+				left: snapRect.left,
+				top: snapRect.top,
+				width: snapRect.width,
+				height: snapRect.height,
+			})
 			return
 		}
 
@@ -231,25 +236,29 @@ export default class SchmancyWindow extends SchmancyElement {
 
 		// P -- play: animate from the inverse offset to natural resting position
 		const flipKeyframes: Keyframe[] = [{ translate: `${dx}px ${dy}px` }, { translate: '0px 0px' }]
-		const anim = container.animate(
-			flipKeyframes,
-			{
-				duration: SPRING_SMOOTH.duration,
-				easing: SPRING_SMOOTH.easingFallback,
-				fill: 'forwards',
-			},
-		)
-		from(anim.finished).pipe(
-			take(1),
-			tap(() => {
-				if (container.isConnected) container.style.translate = ''
-				// Report final resting bounds after animation completes
-				const finalRect = container.getBoundingClientRect()
-				windowManager.updateBounds(this.id, { left: finalRect.left, top: finalRect.top, width: finalRect.width, height: finalRect.height })
-			}),
-			catchError(() => EMPTY),
-			takeUntil(this.disconnecting),
-		).subscribe()
+		const anim = container.animate(flipKeyframes, {
+			duration: SPRING_SMOOTH.duration,
+			easing: SPRING_SMOOTH.easingFallback,
+			fill: 'forwards',
+		})
+		from(anim.finished)
+			.pipe(
+				take(1),
+				tap(() => {
+					if (container.isConnected) container.style.translate = ''
+					// Report final resting bounds after animation completes
+					const finalRect = container.getBoundingClientRect()
+					windowManager.updateBounds(this.id, {
+						left: finalRect.left,
+						top: finalRect.top,
+						width: finalRect.width,
+						height: finalRect.height,
+					})
+				}),
+				catchError(() => EMPTY),
+				takeUntil(this.disconnecting),
+			)
+			.subscribe()
 
 		this.savePosition()
 	}
@@ -266,18 +275,21 @@ export default class SchmancyWindow extends SchmancyElement {
 
 			let didDrag = false
 
-			const sub = fromEvent<PointerEvent>(head, 'pointerdown').pipe(
-				filter(e => e.button === 0),
-				filter(e => {
-					const tag = (e.target as HTMLElement).tagName?.toLowerCase()
-					return !['input', 'textarea', 'select', 'button'].includes(tag)
-						&& !(e.target as HTMLElement).closest('schmancy-input, schmancy-icon-button, button, a')
-				}),
-				tap(e => {
-					e.preventDefault()
-					e.stopPropagation()
-				}),
-			)
+			const sub = fromEvent<PointerEvent>(head, 'pointerdown')
+				.pipe(
+					filter(e => e.button === 0),
+					filter(e => {
+						const tag = (e.target as HTMLElement).tagName?.toLowerCase()
+						return (
+							!['input', 'textarea', 'select', 'button'].includes(tag) &&
+							!(e.target as HTMLElement).closest('schmancy-input, schmancy-icon-button, button, a')
+						)
+					}),
+					tap(e => {
+						e.preventDefault()
+						e.stopPropagation()
+					}),
+				)
 				.pipe(
 					map(e => {
 						const rect = container.getBoundingClientRect()
@@ -303,9 +315,7 @@ export default class SchmancyWindow extends SchmancyElement {
 							auditTime(0, animationFrameScheduler),
 							map(e => ({ clientX: e.clientX, clientY: e.clientY })),
 						)
-						const end$ = fromEvent<PointerEvent>(window, 'pointerup').pipe(
-							filter(e => e.pointerId === pointerId),
-						)
+						const end$ = fromEvent<PointerEvent>(window, 'pointerup').pipe(filter(e => e.pointerId === pointerId))
 
 						return move$.pipe(
 							tap(({ clientX, clientY }) => {
@@ -367,34 +377,37 @@ export default class SchmancyWindow extends SchmancyElement {
 		super.connectedCallback()
 
 		// Pipeline 1: DOM setup + manager registration + drag + z-index sync
-		from(this.updateComplete).pipe(
-			take(1),
-			tap(() => {
-				this.currentCorner = this.corner
-				this.loadPosition()
-				this.applyContainerPosition()
-				this.initDOMState()
-				// Register with window manager
-				const container = this.containerRef.value
-				if (container) {
-					const rect = container.getBoundingClientRect()
-					const bounds: WindowBounds = { left: rect.left, top: rect.top, width: rect.width, height: rect.height }
-					windowManager.register(this.id, bounds, this.freePosition ? 'free' : this.currentCorner)
-				}
-			}),
-			switchMap(() => merge(
-				this.drag$(),
-				windowManager.selectWindow(this.id).pipe(
-					tap(record => {
-						if (!record) return
-						const container = this.containerRef.value
-						if (container) container.style.zIndex = String(record.zIndex)
-					}),
+		from(this.updateComplete)
+			.pipe(
+				take(1),
+				tap(() => {
+					this.currentCorner = this.corner
+					this.loadPosition()
+					this.applyContainerPosition()
+					this.initDOMState()
+					// Register with window manager
+					const container = this.containerRef.value
+					if (container) {
+						const rect = container.getBoundingClientRect()
+						const bounds: WindowBounds = { left: rect.left, top: rect.top, width: rect.width, height: rect.height }
+						windowManager.register(this.id, bounds, this.freePosition ? 'free' : this.currentCorner)
+					}
+				}),
+				switchMap(() =>
+					merge(
+						this.drag$(),
+						windowManager.selectWindow(this.id).pipe(
+							tap(record => {
+								if (!record) return
+								const container = this.containerRef.value
+								if (container) container.style.zIndex = String(record.zIndex)
+							}),
+						),
+					),
 				),
-			)),
-			takeUntil(this.disconnecting),
-		).subscribe()
-
+				takeUntil(this.disconnecting),
+			)
+			.subscribe()
 
 		// Pipeline 3: Environment -- one subscription
 		merge(
@@ -402,10 +415,10 @@ export default class SchmancyWindow extends SchmancyElement {
 				auditTime(0, animationFrameScheduler),
 				tap(() => this.validateBounds()),
 			),
-			theme.bottomOffset$.pipe(
-				tap(() => this.applyContainerPosition()),
-			),
-		).pipe(takeUntil(this.disconnecting)).subscribe()
+			theme.bottomOffset$.pipe(tap(() => this.applyContainerPosition())),
+		)
+			.pipe(takeUntil(this.disconnecting))
+			.subscribe()
 	}
 
 	disconnectedCallback() {
@@ -459,7 +472,10 @@ export default class SchmancyWindow extends SchmancyElement {
 		}
 		const overlaps = windowManager.findOverlaps(projectedBounds, this.id)
 		if (overlaps.length > 0) {
-			const resolved = resolveOverlap(projectedBounds, overlaps, { width: window.innerWidth, height: window.innerHeight })
+			const resolved = resolveOverlap(projectedBounds, overlaps, {
+				width: window.innerWidth,
+				height: window.innerHeight,
+			})
 			if (Math.abs(resolved.left - projectedBounds.left) > 10 || Math.abs(resolved.top - projectedBounds.top) > 10) {
 				const isRight = this.currentCorner.includes('right')
 				const isBottom = this.currentCorner.includes('bottom')
@@ -497,18 +513,20 @@ export default class SchmancyWindow extends SchmancyElement {
 		})
 		this.currentAnimation = anim
 
-		from(anim.finished).pipe(
-			take(1),
-			tap(() => {
-				if (container.isConnected) {
-					container.style.clipPath = ''
-					container.style.overflow = ''
-					container.style.willChange = ''
-				}
-			}),
-			catchError(() => EMPTY),
-			takeUntil(this.disconnecting),
-		).subscribe()
+		from(anim.finished)
+			.pipe(
+				take(1),
+				tap(() => {
+					if (container.isConnected) {
+						container.style.clipPath = ''
+						container.style.overflow = ''
+						container.style.willChange = ''
+					}
+				}),
+				catchError(() => EMPTY),
+				takeUntil(this.disconnecting),
+			)
+			.subscribe()
 
 		this.dispatchScopedEvent('window-toggle', { state: 'expanded' })
 	}
@@ -522,7 +540,10 @@ export default class SchmancyWindow extends SchmancyElement {
 			container.style.overflow = 'hidden'
 			this.open = false
 			const body = this.bodyRef.value
-			if (body) { body.inert = true; body.style.visibility = 'hidden' }
+			if (body) {
+				body.inert = true
+				body.style.visibility = 'hidden'
+			}
 			this.dispatchScopedEvent('window-toggle', { state: 'collapsed' })
 			return
 		}
@@ -541,17 +562,22 @@ export default class SchmancyWindow extends SchmancyElement {
 		})
 		this.currentAnimation = anim
 
-		from(anim.finished).pipe(
-			take(1),
-			tap(() => {
-				this.open = false
-				container.style.willChange = ''
-				const body = this.bodyRef.value
-				if (body) { body.inert = true; body.style.visibility = 'hidden' }
-			}),
-			catchError(() => EMPTY),
-			takeUntil(this.disconnecting),
-		).subscribe()
+		from(anim.finished)
+			.pipe(
+				take(1),
+				tap(() => {
+					this.open = false
+					container.style.willChange = ''
+					const body = this.bodyRef.value
+					if (body) {
+						body.inert = true
+						body.style.visibility = 'hidden'
+					}
+				}),
+				catchError(() => EMPTY),
+				takeUntil(this.disconnecting),
+			)
+			.subscribe()
 
 		this.dispatchScopedEvent('window-toggle', { state: 'collapsed' })
 	}
@@ -655,7 +681,7 @@ export default class SchmancyWindow extends SchmancyElement {
 		return html`
 			<schmancy-surface
 				${ref(this.containerRef)}
-				type="glass"
+				type="container"
 				class=${containerClasses}
 				style=${containerStyles}
 				aria-expanded=${this.open}
@@ -679,7 +705,7 @@ export default class SchmancyWindow extends SchmancyElement {
 				>
 					<div
 						${ref(this.headRef)}
-						${cursorGlow({ radius: 200, intensity: 0.10 })}
+						${cursorGlow({ radius: 200, intensity: 0.1 })}
 						class=${headClasses}
 						role="button"
 						tabindex="0"
@@ -691,11 +717,20 @@ export default class SchmancyWindow extends SchmancyElement {
 							<slot></slot>
 						</div>
 						<svg
-							width="16" height="16" viewBox="0 0 24 24" fill="none"
+							width="16"
+							height="16"
+							viewBox="0 0 24 24"
+							fill="none"
 							class="shrink-0 text-surface-on/40 transition-transform duration-200 ${this.open ? 'rotate-180' : ''}"
 							aria-hidden="true"
 						>
-							<path d="M6 9L12 15L18 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+							<path
+								d="M6 9L12 15L18 9"
+								stroke="currentColor"
+								stroke-width="2"
+								stroke-linecap="round"
+								stroke-linejoin="round"
+							/>
 						</svg>
 					</div>
 				</section>

package/types/src/calendar/calendar.d.ts

@@ -0,0 +1,108 @@
+import { PropertyValues } from 'lit';
+import { SchmancyElement } from '@mixins/index';
+/** Fired on every provisional change (including range hover-preview). */
+export type SchmancyCalendarInputEvent = CustomEvent<{
+    value: string | null;
+    start: string | null;
+    end: string | null;
+}>;
+/** Fired on a committed change: single click | second range endpoint | clear. */
+export type SchmancyCalendarChangeEvent = CustomEvent<{
+    value: string | null;
+    start: string | null;
+    end: string | null;
+}>;
+/** Fired as the dominant in-view month changes while scrolling. */
+export type SchmancyCalendarNavigateEvent = CustomEvent<{
+    month: string;
+}>;
+/**
+ * A presentational calendar primitive with continuous vertical month-scroll.
+ * Supports single-date and date-range selection. No form-association.
+ *
+ * @element schmancy-calendar
+ * @fires input  - Every provisional change (incl. range hover-preview)
+ * @fires change - Committed change: single click | second range endpoint | clear
+ * @fires navigate - Dominant in-view month changed while scrolling
+ *
+ * @csspart scroll          - The scrollable container
+ * @csspart month-label     - Sticky month/year label
+ * @csspart weekday         - Weekday header cell
+ * @csspart grid            - Day grid for a month
+ * @csspart day             - Individual day cell
+ * @csspart day-selected    - A selected day (single mode, or both endpoints)
+ * @csspart day-range-start - Range start day
+ * @csspart day-range-end   - Range end day
+ * @csspart day-in-range    - Day inside the selected range (exclusive of endpoints)
+ * @csspart day-preview     - Day inside the hover-preview range
+ * @csspart day-today       - Today's date
+ * @csspart day-disabled    - Disabled (out-of-bounds) day
+ */
+export declare class SchmancyCalendar extends SchmancyElement {
+    static styles: import("lit").CSSResult[];
+    mode: 'single' | 'range';
+    type: 'date' | 'datetime-local';
+    value?: string | null;
+    start?: string | null;
+    end?: string | null;
+    min?: string;
+    max?: string;
+    month?: string;
+    /** BCP-47 locale tag; week-start derived from it. Stored as `calLocale` to avoid conflicting with the base-class `locale` getter. */
+    calLocale?: string;
+    disabled: boolean;
+    readonly: boolean;
+    /** The month the scroller is currently anchored to ('YYYY-MM'). */
+    private anchorMonth;
+    /** In range mode: the first click (pending second endpoint). */
+    private pendingStart;
+    /** In range mode: day the pointer is hovering over (for preview). */
+    private hoverDate;
+    /**
+     * Emits the dominant month string whenever a scroll event occurs.
+     * Fed by both the DOM scroller's fromEvent (via scrollerReady$) and any
+     * future direct pushes. Merging both into a single debounced pipeline
+     * satisfies ONE_PIPELINE_ONE_SUBSCRIBE.
+     */
+    private readonly scroll$;
+    /**
+     * Emits the scroller HTMLElement once it is available in the DOM
+     * (from updated()). switchMap converts it into the fromEvent stream,
+     * which feeds scroll$ — all inside the single connectedCallback pipeline.
+     */
+    private readonly scrollerReady$;
+    connectedCallback(): void;
+    updated(changed: PropertyValues): void;
+    private scrollerAttached;
+    /** The scroll window start month. */
+    private windowStart;
+    /** The scroll window end month. */
+    private windowEnd;
+    /** Resolve the best anchor month from current props. */
+    private resolveAnchor;
+    /** All months in the scroll window as 'YYYY-MM' strings. */
+    private months;
+    /** Days of the week starting from the locale's first day (BCP-47 derived). */
+    private weekdayHeaders;
+    private dominantMonth;
+    private scrollToMonth;
+    private isSelected;
+    private isRangeStart;
+    private isRangeEnd;
+    private isInRange;
+    private isInPreview;
+    private isToday;
+    private isDisabled;
+    private handleDayClick;
+    private handleDayHover;
+    private handleKeyDown;
+    private emit;
+    render(): import("lit-html").TemplateResult<1>;
+    private renderMonth;
+    private renderDay;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'schmancy-calendar': SchmancyCalendar;
+    }
+}

package/types/src/calendar/calendar.test.d.ts

@@ -0,0 +1 @@
+import './calendar';

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

@@ -0,0 +1,2 @@
+export { SchmancyCalendar } from './calendar';
+export type { SchmancyCalendarInputEvent, SchmancyCalendarChangeEvent, SchmancyCalendarNavigateEvent } from './calendar';

package/types/src/directives/cursor-glow.d.ts

@@ -13,7 +13,7 @@ export interface CursorGlowOptions {
  *
  * @example
  * ```html
- * <schmancy-surface type="glass" ${cursorGlow()}>content</schmancy-surface>
+ * <schmancy-surface type="container" ${cursorGlow()}>content</schmancy-surface>
  * <div ${cursorGlow({ radius: 300, intensity: 0.2 })}>hero panel</div>
  * ```
  */

package/types/src/directives/hummingbird.d.ts

@@ -116,9 +116,9 @@ declare class HummingbirdDirective extends AsyncDirective {
     private pulseRings;
     private tickHovering;
     /**
- * Check if an element is sufficiently visible (opacity > 0.5 and not hidden)
- * Uses 0.5 threshold to wait for CSS transitions to be halfway done
- */
+     * Check if an element is sufficiently visible (opacity > 0.5 and not hidden)
+     * Uses 0.5 threshold to wait for CSS transitions to be halfway done
+     */
     private isElementVisible;
     /** Check if element is within the viewport bounds (with padding so bird doesn't fly to edges) */
     private isInViewport;