@raqm/ui 0.0.0-stage → 0.1.1

package/fesm2022/raqm-ui-scroll-area.mjs

@@ -0,0 +1,510 @@
+import { CdkScrollable } from "@angular/cdk/scrolling";
+import { RtlScrollAxisType, getRtlScrollAxisType } from "@angular/cdk/platform";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, InjectionToken, afterNextRender, booleanAttribute, computed, contentChildren, forwardRef, inject, input, signal, viewChild } from "@angular/core";
+const SCROLL_AREA = new InjectionToken("RAQM_SCROLL_AREA");
+var RaqmScrollBarComponent = class RaqmScrollBarComponent {
+	vertical = input(true, {
+		...ngDevMode ? { debugName: "vertical" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	keepMounted = input(false, {
+		...ngDevMode ? { debugName: "keepMounted" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	area = inject(SCROLL_AREA);
+	host = inject(ElementRef);
+	destroyRef = inject(DestroyRef);
+	trackSize = signal(0, ...ngDevMode ? [{ debugName: "trackSize" }] : /* istanbul ignore next */ []);
+	drag = null;
+	overflow = computed(() => {
+		const m = this.area.metrics();
+		return this.vertical() ? m.scrollHeight > m.height : m.scrollWidth > m.width;
+	}, ...ngDevMode ? [{ debugName: "overflow" }] : /* istanbul ignore next */ []);
+	geometry = computed(() => {
+		const m = this.area.metrics();
+		const vertical = this.vertical();
+		const viewport = vertical ? m.height : m.width;
+		const content = vertical ? m.scrollHeight : m.scrollWidth;
+		const track = this.trackSize();
+		const thumb = Math.min(track, Math.max(16, content ? track * viewport / content : track));
+		const max = Math.max(0, content - viewport);
+		return {
+			thumb,
+			travel: track - thumb,
+			max,
+			offset: vertical ? m.y : m.x
+		};
+	}, ...ngDevMode ? [{ debugName: "geometry" }] : /* istanbul ignore next */ []);
+	thumbStyle = computed(() => {
+		const g = this.geometry();
+		const position = g.max ? g.offset / g.max * g.travel : 0;
+		return this.vertical() ? {
+			"block-size": `${g.thumb}px`,
+			"inset-block-start": `${position}px`
+		} : {
+			"inline-size": `${g.thumb}px`,
+			"inset-inline-start": `${position}px`
+		};
+	}, ...ngDevMode ? [{ debugName: "thumbStyle" }] : /* istanbul ignore next */ []);
+	constructor() {
+		afterNextRender(() => {
+			const resize = new ResizeObserver(() => this.measure());
+			resize.observe(this.host.nativeElement);
+			this.measure();
+			const track = this.host.nativeElement;
+			const wheel = (event) => this.onTrackWheel(event);
+			track.addEventListener("wheel", wheel, { passive: false });
+			this.destroyRef.onDestroy(() => {
+				resize.disconnect();
+				track.removeEventListener("wheel", wheel);
+			});
+		});
+		this.destroyRef.onDestroy(() => this.endDrag());
+	}
+	onTrackWheel(event) {
+		if (event.ctrlKey || event.defaultPrevented || !event.cancelable) return;
+		const vertical = this.vertical();
+		const delta = vertical ? event.deltaY : event.deltaX;
+		if (!Number.isFinite(delta) || delta === 0) return;
+		this.area.refresh();
+		const metrics = this.area.metrics();
+		const css = getComputedStyle(this.host.nativeElement);
+		const lineHeight = parseFloat(css.lineHeight) || parseFloat(css.fontSize) * 1.2 || 16;
+		const change = delta * (event.deltaMode === WheelEvent.DOM_DELTA_LINE ? lineHeight : event.deltaMode === WheelEvent.DOM_DELTA_PAGE ? vertical ? metrics.height : metrics.width : 1) * (!vertical && metrics.rtl ? -1 : 1);
+		const before = vertical ? metrics.y : metrics.x;
+		this.area.scrollTo(this.vertical() ? "vertical" : "horizontal", before + change);
+		const after = this.area.metrics();
+		if ((vertical ? after.y : after.x) !== before) event.preventDefault();
+	}
+	measure() {
+		const el = this.host.nativeElement;
+		const css = getComputedStyle(el);
+		const vertical = this.vertical();
+		this.trackSize.set(Math.max(0, (vertical ? el.clientHeight : el.clientWidth) - parseFloat(vertical ? css.paddingTop : css.paddingLeft) - parseFloat(vertical ? css.paddingBottom : css.paddingRight)));
+	}
+	coordinate(event) {
+		const el = this.host.nativeElement;
+		const rect = el.getBoundingClientRect();
+		const css = getComputedStyle(el);
+		if (this.vertical()) return event.clientY - rect.top - el.clientTop - parseFloat(css.paddingTop);
+		return this.area.metrics().rtl ? rect.right - event.clientX - parseFloat(css.borderRightWidth) - parseFloat(css.paddingRight) : event.clientX - rect.left - el.clientLeft - parseFloat(css.paddingLeft);
+	}
+	onPointerDown(event) {
+		if (!event.isPrimary || event.button !== 0 || !this.overflow() || this.drag) return;
+		event.preventDefault();
+		this.area.refresh();
+		this.measure();
+		const g = this.geometry();
+		const position = g.max ? g.offset / g.max * g.travel : 0;
+		const coordinate = this.coordinate(event);
+		const onThumb = coordinate >= position && coordinate <= position + g.thumb;
+		this.drag = {
+			pointer: event.pointerId,
+			grab: onThumb ? coordinate - position : g.thumb / 2
+		};
+		this.host.nativeElement.setPointerCapture(event.pointerId);
+		if (!onThumb) this.onPointerMove(event);
+	}
+	onPointerMove(event) {
+		if (this.drag?.pointer !== event.pointerId) return;
+		const g = this.geometry();
+		if (g.travel > 0) this.area.scrollTo(this.vertical() ? "vertical" : "horizontal", (this.coordinate(event) - this.drag.grab) / g.travel * g.max);
+	}
+	endPointer(event) {
+		if (event.pointerId === this.drag?.pointer) this.endDrag();
+	}
+	endDrag() {
+		const drag = this.drag;
+		this.drag = null;
+		if (drag && this.host.nativeElement.hasPointerCapture(drag.pointer)) this.host.nativeElement.releasePointerCapture(drag.pointer);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: RaqmScrollBarComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.2",
+		type: RaqmScrollBarComponent,
+		isStandalone: true,
+		selector: "raqm-scroll-bar",
+		inputs: {
+			vertical: {
+				classPropertyName: "vertical",
+				publicName: "vertical",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			keepMounted: {
+				classPropertyName: "keepMounted",
+				publicName: "keepMounted",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			attributes: {
+				"data-slot": "scroll-area-scrollbar",
+				"aria-hidden": "true"
+			},
+			listeners: {
+				"pointerdown": "onPointerDown($event)",
+				"pointermove": "onPointerMove($event)",
+				"pointerup": "endPointer($event)",
+				"pointercancel": "endPointer($event)",
+				"lostpointercapture": "endPointer($event)"
+			},
+			properties: {
+				"attr.data-raqm-vertical": "vertical() ? \"\" : null",
+				"attr.data-raqm-overflow": "overflow() ? \"\" : null",
+				"attr.data-raqm-keep-mounted": "keepMounted() ? \"\" : null",
+				"attr.data-raqm-corner": "area.horizontal() && area.vertical() ? \"\" : null",
+				"attr.data-raqm-scrolling": "area.scrolling() ? \"\" : null",
+				"attr.data-raqm-hovering": "area.hovering() ? \"\" : null",
+				"attr.data-raqm-has-overflow-x": "area.metrics().scrollWidth > area.metrics().width ? \"\" : null",
+				"attr.data-raqm-has-overflow-y": "area.vertical() ? \"\" : null",
+				"attr.data-raqm-overflow-x-start": "area.edges().xStart ? \"\" : null",
+				"attr.data-raqm-overflow-x-end": "area.edges().xEnd ? \"\" : null",
+				"attr.data-raqm-overflow-y-start": "area.edges().yStart ? \"\" : null",
+				"attr.data-raqm-overflow-y-end": "area.edges().yEnd ? \"\" : null"
+			},
+			classAttribute: "raqm-scroll-bar"
+		},
+		ngImport: i0,
+		template: "@if (overflow() || keepMounted()) {\r\n  <div\r\n    class=\"raqm-scroll-bar__thumb\"\r\n    data-slot=\"scroll-area-thumb\"\r\n    [attr.data-raqm-vertical]=\"vertical() ? '' : null\"\r\n    [attr.data-raqm-scrolling]=\"area.scrolling() ? '' : null\"\r\n    [style]=\"thumbStyle()\"\r\n  ></div>\r\n}\r\n",
+		styles: [":host{position:absolute;display:flex;box-sizing:border-box;touch-action:none;-webkit-user-select:none;user-select:none;padding:1px;transition:color .15s,background-color .15s;visibility:hidden}:host([data-raqm-overflow]),:host([data-raqm-keep-mounted]){visibility:visible}:host([data-raqm-vertical]){inset-block:0;inset-inline-end:0;inline-size:calc(var(--raqm-spacing) * 2.5);border-inline-start:1px solid transparent}:host(:not([data-raqm-vertical])){inset-inline:0;inset-block-end:0;block-size:calc(var(--raqm-spacing) * 2.5);flex-direction:column;border-block-start:1px solid transparent}:host([data-raqm-vertical][data-raqm-corner]){inset-block-end:calc(var(--raqm-spacing) * 2.5)}:host(:not([data-raqm-vertical])[data-raqm-corner]){inset-inline-end:calc(var(--raqm-spacing) * 2.5)}.raqm-scroll-bar__thumb{position:relative;flex-shrink:0;background:var(--raqm-border);border-radius:9999px}:host([data-raqm-vertical]) .raqm-scroll-bar__thumb{inline-size:100%}:host(:not([data-raqm-vertical])) .raqm-scroll-bar__thumb{block-size:100%}@media(prefers-reduced-motion:reduce){:host{transition:none}}@media(forced-colors:active){:host{display:none}}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RaqmScrollBarComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "raqm-scroll-bar",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				class: "raqm-scroll-bar",
+				"data-slot": "scroll-area-scrollbar",
+				"aria-hidden": "true",
+				"[attr.data-raqm-vertical]": "vertical() ? \"\" : null",
+				"[attr.data-raqm-overflow]": "overflow() ? \"\" : null",
+				"[attr.data-raqm-keep-mounted]": "keepMounted() ? \"\" : null",
+				"[attr.data-raqm-corner]": "area.horizontal() && area.vertical() ? \"\" : null",
+				"[attr.data-raqm-scrolling]": "area.scrolling() ? \"\" : null",
+				"[attr.data-raqm-hovering]": "area.hovering() ? \"\" : null",
+				"[attr.data-raqm-has-overflow-x]": "area.metrics().scrollWidth > area.metrics().width ? \"\" : null",
+				"[attr.data-raqm-has-overflow-y]": "area.vertical() ? \"\" : null",
+				"[attr.data-raqm-overflow-x-start]": "area.edges().xStart ? \"\" : null",
+				"[attr.data-raqm-overflow-x-end]": "area.edges().xEnd ? \"\" : null",
+				"[attr.data-raqm-overflow-y-start]": "area.edges().yStart ? \"\" : null",
+				"[attr.data-raqm-overflow-y-end]": "area.edges().yEnd ? \"\" : null",
+				"(pointerdown)": "onPointerDown($event)",
+				"(pointermove)": "onPointerMove($event)",
+				"(pointerup)": "endPointer($event)",
+				"(pointercancel)": "endPointer($event)",
+				"(lostpointercapture)": "endPointer($event)"
+			},
+			template: "@if (overflow() || keepMounted()) {\r\n  <div\r\n    class=\"raqm-scroll-bar__thumb\"\r\n    data-slot=\"scroll-area-thumb\"\r\n    [attr.data-raqm-vertical]=\"vertical() ? '' : null\"\r\n    [attr.data-raqm-scrolling]=\"area.scrolling() ? '' : null\"\r\n    [style]=\"thumbStyle()\"\r\n  ></div>\r\n}\r\n",
+			styles: [":host{position:absolute;display:flex;box-sizing:border-box;touch-action:none;-webkit-user-select:none;user-select:none;padding:1px;transition:color .15s,background-color .15s;visibility:hidden}:host([data-raqm-overflow]),:host([data-raqm-keep-mounted]){visibility:visible}:host([data-raqm-vertical]){inset-block:0;inset-inline-end:0;inline-size:calc(var(--raqm-spacing) * 2.5);border-inline-start:1px solid transparent}:host(:not([data-raqm-vertical])){inset-inline:0;inset-block-end:0;block-size:calc(var(--raqm-spacing) * 2.5);flex-direction:column;border-block-start:1px solid transparent}:host([data-raqm-vertical][data-raqm-corner]){inset-block-end:calc(var(--raqm-spacing) * 2.5)}:host(:not([data-raqm-vertical])[data-raqm-corner]){inset-inline-end:calc(var(--raqm-spacing) * 2.5)}.raqm-scroll-bar__thumb{position:relative;flex-shrink:0;background:var(--raqm-border);border-radius:9999px}:host([data-raqm-vertical]) .raqm-scroll-bar__thumb{inline-size:100%}:host(:not([data-raqm-vertical])) .raqm-scroll-bar__thumb{block-size:100%}@media(prefers-reduced-motion:reduce){:host{transition:none}}@media(forced-colors:active){:host{display:none}}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		vertical: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "vertical",
+				required: false
+			}]
+		}],
+		keepMounted: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "keepMounted",
+				required: false
+			}]
+		}]
+	}
+});
+var RaqmScrollAreaComponent = class RaqmScrollAreaComponent {
+	viewportLabel = input.required(...ngDevMode ? [{ debugName: "viewportLabel" }] : /* istanbul ignore next */ []);
+	overflowEdgeThreshold = input(0, ...ngDevMode ? [{ debugName: "overflowEdgeThreshold" }] : /* istanbul ignore next */ []);
+	viewport = viewChild.required("viewport", ...ngDevMode ? [{ debugName: "viewport" }] : /* istanbul ignore next */ []);
+	content = viewChild.required("content", ...ngDevMode ? [{ debugName: "content" }] : /* istanbul ignore next */ []);
+	host = inject(ElementRef);
+	destroyRef = inject(DestroyRef);
+	bars = contentChildren(RaqmScrollBarComponent, ...ngDevMode ? [{ debugName: "bars" }] : /* istanbul ignore next */ []);
+	defaultVertical = computed(() => !this.bars().some((bar) => bar.vertical()), ...ngDevMode ? [{ debugName: "defaultVertical" }] : /* istanbul ignore next */ []);
+	metrics = signal({
+		width: 0,
+		height: 0,
+		scrollWidth: 0,
+		scrollHeight: 0,
+		x: 0,
+		y: 0,
+		rtl: false
+	}, ...ngDevMode ? [{ debugName: "metrics" }] : /* istanbul ignore next */ []);
+	horizontal = computed(() => this.bars().some((bar) => !bar.vertical()) && this.metrics().scrollWidth > this.metrics().width, ...ngDevMode ? [{ debugName: "horizontal" }] : /* istanbul ignore next */ []);
+	vertical = computed(() => this.metrics().scrollHeight > this.metrics().height, ...ngDevMode ? [{ debugName: "vertical" }] : /* istanbul ignore next */ []);
+	scrolling = signal(false, ...ngDevMode ? [{ debugName: "scrolling" }] : /* istanbul ignore next */ []);
+	hovering = signal(false, ...ngDevMode ? [{ debugName: "hovering" }] : /* istanbul ignore next */ []);
+	scrollTimer;
+	edges = computed(() => {
+		const m = this.metrics();
+		const threshold = this.overflowEdgeThreshold();
+		const edge = (key) => Math.max(0, typeof threshold === "number" ? threshold : threshold[key] ?? 0);
+		return {
+			xStart: m.x > edge("xStart"),
+			xEnd: m.scrollWidth - m.width - m.x > edge("xEnd"),
+			yStart: m.y > edge("yStart"),
+			yEnd: m.scrollHeight - m.height - m.y > edge("yEnd")
+		};
+	}, ...ngDevMode ? [{ debugName: "edges" }] : /* istanbul ignore next */ []);
+	constructor() {
+		this.destroyRef.onDestroy(() => clearTimeout(this.scrollTimer));
+		afterNextRender(() => {
+			const viewport = this.viewport().nativeElement;
+			const content = this.content().nativeElement;
+			const resize = new ResizeObserver(() => this.refresh());
+			resize.observe(viewport);
+			resize.observe(content);
+			const direction = new MutationObserver(() => this.refresh());
+			for (let element = this.host.nativeElement; element; element = element.parentElement) direction.observe(element, {
+				attributes: true,
+				attributeFilter: [
+					"dir",
+					"class",
+					"style"
+				]
+			});
+			const mutation = new MutationObserver(() => this.refresh());
+			mutation.observe(content, {
+				subtree: true,
+				childList: true,
+				characterData: true,
+				attributes: true
+			});
+			const load = () => this.refresh();
+			content.addEventListener("load", load, true);
+			this.destroyRef.onDestroy(() => {
+				resize.disconnect();
+				mutation.disconnect();
+				direction.disconnect();
+				content.removeEventListener("load", load, true);
+			});
+			this.refresh();
+		});
+	}
+	onScroll() {
+		this.refresh();
+		this.scrolling.set(true);
+		clearTimeout(this.scrollTimer);
+		this.scrollTimer = setTimeout(() => this.scrolling.set(false), 100);
+	}
+	refresh() {
+		const viewport = this.viewport().nativeElement;
+		const rtl = getComputedStyle(viewport).direction === "rtl";
+		const max = Math.max(0, viewport.scrollWidth - viewport.clientWidth);
+		let x = viewport.scrollLeft;
+		if (rtl) switch (getRtlScrollAxisType()) {
+			case RtlScrollAxisType.NEGATED:
+				x = -x;
+				break;
+			case RtlScrollAxisType.NORMAL: x = max - x;
+		}
+		const next = {
+			width: viewport.clientWidth,
+			height: viewport.clientHeight,
+			scrollWidth: viewport.scrollWidth,
+			scrollHeight: viewport.scrollHeight,
+			x: Math.max(0, Math.min(max, x)),
+			y: Math.max(0, viewport.scrollTop),
+			rtl
+		};
+		const previous = this.metrics();
+		if (Object.keys(next).some((key) => next[key] !== previous[key])) this.metrics.set(next);
+	}
+	scrollTo(orientation, offset) {
+		const viewport = this.viewport().nativeElement;
+		this.refresh();
+		const metrics = this.metrics();
+		const max = orientation === "horizontal" ? metrics.scrollWidth - metrics.width : metrics.scrollHeight - metrics.height;
+		let value = Math.max(0, Math.min(max, offset));
+		if (orientation === "vertical") viewport.scrollTop = value;
+		else {
+			if (metrics.rtl) switch (getRtlScrollAxisType()) {
+				case RtlScrollAxisType.NEGATED:
+					value = -value;
+					break;
+				case RtlScrollAxisType.NORMAL: value = max - value;
+			}
+			viewport.scrollLeft = value;
+		}
+		this.refresh();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: RaqmScrollAreaComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.2",
+		type: RaqmScrollAreaComponent,
+		isStandalone: true,
+		selector: "raqm-scroll-area",
+		inputs: {
+			viewportLabel: {
+				classPropertyName: "viewportLabel",
+				publicName: "viewportLabel",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			overflowEdgeThreshold: {
+				classPropertyName: "overflowEdgeThreshold",
+				publicName: "overflowEdgeThreshold",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			attributes: { "data-slot": "scroll-area" },
+			listeners: {
+				"pointerenter": "hovering.set(true)",
+				"pointerleave": "hovering.set(false)"
+			},
+			properties: {
+				"attr.data-raqm-has-overflow-x": "metrics().scrollWidth > metrics().width ? \"\" : null",
+				"attr.data-raqm-has-overflow-y": "vertical() ? \"\" : null",
+				"attr.data-raqm-overflow-x-start": "edges().xStart ? \"\" : null",
+				"attr.data-raqm-overflow-x-end": "edges().xEnd ? \"\" : null",
+				"attr.data-raqm-overflow-y-start": "edges().yStart ? \"\" : null",
+				"attr.data-raqm-overflow-y-end": "edges().yEnd ? \"\" : null",
+				"attr.data-raqm-scrolling": "scrolling() ? \"\" : null"
+			},
+			classAttribute: "raqm-scroll-area"
+		},
+		providers: [{
+			provide: SCROLL_AREA,
+			useExisting: forwardRef(() => RaqmScrollAreaComponent)
+		}],
+		queries: [{
+			propertyName: "bars",
+			predicate: RaqmScrollBarComponent,
+			isSignal: true
+		}],
+		viewQueries: [{
+			propertyName: "viewport",
+			first: true,
+			predicate: ["viewport"],
+			descendants: true,
+			isSignal: true
+		}, {
+			propertyName: "content",
+			first: true,
+			predicate: ["content"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: "<div\r\n  #viewport\r\n  cdkScrollable\r\n  class=\"raqm-scroll-area__viewport\"\r\n  data-slot=\"scroll-area-viewport\"\r\n  tabindex=\"0\"\r\n  role=\"region\"\r\n  [attr.aria-label]=\"viewportLabel()\"\r\n  (scroll)=\"onScroll()\"\r\n>\r\n  <div #content class=\"raqm-scroll-area__content\"><ng-content /></div>\r\n</div>\r\n<ng-content select=\"raqm-scroll-bar\" />\r\n@if (defaultVertical()) {\r\n  <raqm-scroll-bar />\r\n}\r\n@if (horizontal() && vertical()) {\r\n  <div class=\"raqm-scroll-area__corner\" aria-hidden=\"true\"></div>\r\n}\r\n",
+		styles: [":host{display:block;position:relative;min-inline-size:0;min-block-size:0}.raqm-scroll-area__viewport{inline-size:100%;block-size:100%;overflow:auto;border-radius:inherit;scrollbar-width:none;outline:none;transition:color .15s,box-shadow .15s}.raqm-scroll-area__viewport::-webkit-scrollbar{display:none}.raqm-scroll-area__viewport:focus-visible{outline:1px solid var(--raqm-ring);box-shadow:0 0 0 3px color-mix(in srgb,var(--raqm-ring) 50%,transparent)}.raqm-scroll-area__content{display:table;min-inline-size:100%}.raqm-scroll-area__corner{position:absolute;inset-inline-end:0;inset-block-end:0;inline-size:calc(var(--raqm-spacing) * 2.5);block-size:calc(var(--raqm-spacing) * 2.5)}@media(prefers-reduced-motion:reduce){.raqm-scroll-area__viewport{transition:none}}@media(forced-colors:active){.raqm-scroll-area__viewport{scrollbar-width:auto}.raqm-scroll-area__viewport::-webkit-scrollbar{display:initial}}\n"],
+		dependencies: [{
+			kind: "directive",
+			type: CdkScrollable,
+			selector: "[cdk-scrollable], [cdkScrollable]"
+		}, {
+			kind: "component",
+			type: RaqmScrollBarComponent,
+			selector: "raqm-scroll-bar",
+			inputs: ["vertical", "keepMounted"]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RaqmScrollAreaComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "raqm-scroll-area",
+			imports: [CdkScrollable, RaqmScrollBarComponent],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			providers: [{
+				provide: SCROLL_AREA,
+				useExisting: forwardRef(() => RaqmScrollAreaComponent)
+			}],
+			host: {
+				class: "raqm-scroll-area",
+				"data-slot": "scroll-area",
+				"[attr.data-raqm-has-overflow-x]": "metrics().scrollWidth > metrics().width ? \"\" : null",
+				"[attr.data-raqm-has-overflow-y]": "vertical() ? \"\" : null",
+				"[attr.data-raqm-overflow-x-start]": "edges().xStart ? \"\" : null",
+				"[attr.data-raqm-overflow-x-end]": "edges().xEnd ? \"\" : null",
+				"[attr.data-raqm-overflow-y-start]": "edges().yStart ? \"\" : null",
+				"[attr.data-raqm-overflow-y-end]": "edges().yEnd ? \"\" : null",
+				"[attr.data-raqm-scrolling]": "scrolling() ? \"\" : null",
+				"(pointerenter)": "hovering.set(true)",
+				"(pointerleave)": "hovering.set(false)"
+			},
+			template: "<div\r\n  #viewport\r\n  cdkScrollable\r\n  class=\"raqm-scroll-area__viewport\"\r\n  data-slot=\"scroll-area-viewport\"\r\n  tabindex=\"0\"\r\n  role=\"region\"\r\n  [attr.aria-label]=\"viewportLabel()\"\r\n  (scroll)=\"onScroll()\"\r\n>\r\n  <div #content class=\"raqm-scroll-area__content\"><ng-content /></div>\r\n</div>\r\n<ng-content select=\"raqm-scroll-bar\" />\r\n@if (defaultVertical()) {\r\n  <raqm-scroll-bar />\r\n}\r\n@if (horizontal() && vertical()) {\r\n  <div class=\"raqm-scroll-area__corner\" aria-hidden=\"true\"></div>\r\n}\r\n",
+			styles: [":host{display:block;position:relative;min-inline-size:0;min-block-size:0}.raqm-scroll-area__viewport{inline-size:100%;block-size:100%;overflow:auto;border-radius:inherit;scrollbar-width:none;outline:none;transition:color .15s,box-shadow .15s}.raqm-scroll-area__viewport::-webkit-scrollbar{display:none}.raqm-scroll-area__viewport:focus-visible{outline:1px solid var(--raqm-ring);box-shadow:0 0 0 3px color-mix(in srgb,var(--raqm-ring) 50%,transparent)}.raqm-scroll-area__content{display:table;min-inline-size:100%}.raqm-scroll-area__corner{position:absolute;inset-inline-end:0;inset-block-end:0;inline-size:calc(var(--raqm-spacing) * 2.5);block-size:calc(var(--raqm-spacing) * 2.5)}@media(prefers-reduced-motion:reduce){.raqm-scroll-area__viewport{transition:none}}@media(forced-colors:active){.raqm-scroll-area__viewport{scrollbar-width:auto}.raqm-scroll-area__viewport::-webkit-scrollbar{display:initial}}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		viewportLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "viewportLabel",
+				required: true
+			}]
+		}],
+		overflowEdgeThreshold: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "overflowEdgeThreshold",
+				required: false
+			}]
+		}],
+		viewport: [{
+			type: i0.ViewChild,
+			args: ["viewport", { isSignal: true }]
+		}],
+		content: [{
+			type: i0.ViewChild,
+			args: ["content", { isSignal: true }]
+		}],
+		bars: [{
+			type: i0.ContentChildren,
+			args: [i0.forwardRef(() => RaqmScrollBarComponent), { isSignal: true }]
+		}]
+	}
+});
+const RaqmScrollArea = [RaqmScrollAreaComponent, RaqmScrollBarComponent];
+export { RaqmScrollArea, RaqmScrollAreaComponent, RaqmScrollBarComponent };
+
+//# sourceMappingURL=raqm-ui-scroll-area.mjs.map

package/fesm2022/raqm-ui-scroll-area.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"raqm-ui-scroll-area.mjs","names":[],"sources":["../../../projects/ui/scroll-area/scroll-area-context.ts","../../../projects/ui/scroll-area/scroll-bar.ts","../../../projects/ui/scroll-area/scroll-bar.html","../../../projects/ui/scroll-area/scroll-area.ts","../../../projects/ui/scroll-area/scroll-area.html","../../../projects/ui/scroll-area/public-api.ts"],"sourcesContent":["import { InjectionToken, Signal } from '@angular/core';\r\n\r\nexport interface ScrollAreaMetrics {\r\n  width: number;\r\n  height: number;\r\n  scrollWidth: number;\r\n  scrollHeight: number;\r\n  x: number;\r\n  y: number;\r\n  rtl: boolean;\r\n}\r\n\r\n/** Internal root contract; the token avoids a circular component dependency. */\r\nexport const SCROLL_AREA = new InjectionToken<{\r\n  metrics: Signal<ScrollAreaMetrics>;\r\n  horizontal: Signal<boolean>;\r\n  vertical: Signal<boolean>;\r\n  scrolling: Signal<boolean>;\r\n  hovering: Signal<boolean>;\r\n  edges: Signal<{ xStart: boolean; xEnd: boolean; yStart: boolean; yEnd: boolean }>;\r\n  refresh(): void;\r\n  scrollTo(orientation: 'horizontal' | 'vertical', offset: number): void;\r\n}>('RAQM_SCROLL_AREA');\r\n","import {\r\n  ChangeDetectionStrategy,\r\n  Component,\r\n  DestroyRef,\r\n  ElementRef,\r\n  afterNextRender,\r\n  booleanAttribute,\r\n  computed,\r\n  inject,\r\n  input,\r\n  signal,\r\n} from '@angular/core';\r\nimport { SCROLL_AREA } from './scroll-area-context';\r\n\r\n/** Scroll bar overlay; `aria-hidden` and not a tab stop, because the viewport handles keyboard/AT scrolling. */\r\n@Component({\r\n  selector: 'raqm-scroll-bar',\r\n  templateUrl: './scroll-bar.html',\r\n  styleUrl: './scroll-bar.scss',\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  host: {\r\n    class: 'raqm-scroll-bar',\r\n    'data-slot': 'scroll-area-scrollbar',\r\n    'aria-hidden': 'true',\r\n    '[attr.data-raqm-vertical]': 'vertical() ? \"\" : null',\r\n    '[attr.data-raqm-overflow]': 'overflow() ? \"\" : null',\r\n    '[attr.data-raqm-keep-mounted]': 'keepMounted() ? \"\" : null',\r\n    '[attr.data-raqm-corner]': 'area.horizontal() && area.vertical() ? \"\" : null',\r\n    '[attr.data-raqm-scrolling]': 'area.scrolling() ? \"\" : null',\r\n    '[attr.data-raqm-hovering]': 'area.hovering() ? \"\" : null',\r\n    '[attr.data-raqm-has-overflow-x]':\r\n      'area.metrics().scrollWidth > area.metrics().width ? \"\" : null',\r\n    '[attr.data-raqm-has-overflow-y]': 'area.vertical() ? \"\" : null',\r\n    '[attr.data-raqm-overflow-x-start]': 'area.edges().xStart ? \"\" : null',\r\n    '[attr.data-raqm-overflow-x-end]': 'area.edges().xEnd ? \"\" : null',\r\n    '[attr.data-raqm-overflow-y-start]': 'area.edges().yStart ? \"\" : null',\r\n    '[attr.data-raqm-overflow-y-end]': 'area.edges().yEnd ? \"\" : null',\r\n    '(pointerdown)': 'onPointerDown($event)',\r\n    '(pointermove)': 'onPointerMove($event)',\r\n    '(pointerup)': 'endPointer($event)',\r\n    '(pointercancel)': 'endPointer($event)',\r\n    '(lostpointercapture)': 'endPointer($event)',\r\n  },\r\n})\r\nexport class RaqmScrollBarComponent {\r\n  readonly vertical = input(true, { transform: booleanAttribute });\r\n  /** Keeps the internal thumb mounted without overflow; the Angular host always exists. */\r\n  readonly keepMounted = input(false, { transform: booleanAttribute });\r\n  protected readonly area = inject(SCROLL_AREA);\r\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\r\n  private readonly destroyRef = inject(DestroyRef);\r\n  private readonly trackSize = signal(0);\r\n  private drag: { pointer: number; grab: number } | null = null;\r\n  protected readonly overflow = computed(() => {\r\n    const m = this.area.metrics();\r\n    return this.vertical() ? m.scrollHeight > m.height : m.scrollWidth > m.width;\r\n  });\r\n  private readonly geometry = computed(() => {\r\n    const m = this.area.metrics();\r\n    const vertical = this.vertical();\r\n    const viewport = vertical ? m.height : m.width;\r\n    const content = vertical ? m.scrollHeight : m.scrollWidth;\r\n    const track = this.trackSize();\r\n    const thumb = Math.min(track, Math.max(16, content ? (track * viewport) / content : track));\r\n    const max = Math.max(0, content - viewport);\r\n    return { thumb, travel: track - thumb, max, offset: vertical ? m.y : m.x };\r\n  });\r\n  protected readonly thumbStyle = computed(() => {\r\n    const g = this.geometry();\r\n    const position = g.max ? (g.offset / g.max) * g.travel : 0;\r\n    return this.vertical()\r\n      ? { 'block-size': `${g.thumb}px`, 'inset-block-start': `${position}px` }\r\n      : { 'inline-size': `${g.thumb}px`, 'inset-inline-start': `${position}px` };\r\n  });\r\n\r\n  constructor() {\r\n    afterNextRender(() => {\r\n      const resize = new ResizeObserver(() => this.measure());\r\n      resize.observe(this.host.nativeElement);\r\n      this.measure();\r\n      const track = this.host.nativeElement;\r\n      const wheel = (event: WheelEvent) => this.onTrackWheel(event);\r\n      track.addEventListener('wheel', wheel, { passive: false });\r\n      this.destroyRef.onDestroy(() => {\r\n        resize.disconnect();\r\n        track.removeEventListener('wheel', wheel);\r\n      });\r\n    });\r\n    this.destroyRef.onDestroy(() => this.endDrag());\r\n  }\r\n\r\n  /** Bridges only overlay-track wheel input; viewport wheel/touch remain native. */\r\n  private onTrackWheel(event: WheelEvent): void {\r\n    if (event.ctrlKey || event.defaultPrevented || !event.cancelable) return;\r\n    const vertical = this.vertical();\r\n    const delta = vertical ? event.deltaY : event.deltaX;\r\n    if (!Number.isFinite(delta) || delta === 0) return;\r\n    this.area.refresh();\r\n    const metrics = this.area.metrics();\r\n    const css = getComputedStyle(this.host.nativeElement);\r\n    // Computed line-height may be `normal`: use the inherited font's usual 1.2 ratio.\r\n    const lineHeight = parseFloat(css.lineHeight) || parseFloat(css.fontSize) * 1.2 || 16;\r\n    const unit =\r\n      event.deltaMode === WheelEvent.DOM_DELTA_LINE\r\n        ? lineHeight\r\n        : event.deltaMode === WheelEvent.DOM_DELTA_PAGE\r\n          ? vertical\r\n            ? metrics.height\r\n            : metrics.width\r\n          : 1;\r\n    // Wheel deltaX is physical; the root's public offset is measured from logical start.\r\n    const change = delta * unit * (!vertical && metrics.rtl ? -1 : 1);\r\n    const before = vertical ? metrics.y : metrics.x;\r\n    this.area.scrollTo(this.vertical() ? 'vertical' : 'horizontal', before + change);\r\n    const after = this.area.metrics();\r\n    if ((vertical ? after.y : after.x) !== before) event.preventDefault();\r\n  }\r\n\r\n  private measure(): void {\r\n    const el = this.host.nativeElement;\r\n    const css = getComputedStyle(el);\r\n    const vertical = this.vertical();\r\n    this.trackSize.set(\r\n      Math.max(\r\n        0,\r\n        (vertical ? el.clientHeight : el.clientWidth) -\r\n          parseFloat(vertical ? css.paddingTop : css.paddingLeft) -\r\n          parseFloat(vertical ? css.paddingBottom : css.paddingRight),\r\n      ),\r\n    );\r\n  }\r\n\r\n  private coordinate(event: PointerEvent): number {\r\n    const el = this.host.nativeElement;\r\n    const rect = el.getBoundingClientRect();\r\n    const css = getComputedStyle(el);\r\n    if (this.vertical())\r\n      return event.clientY - rect.top - el.clientTop - parseFloat(css.paddingTop);\r\n    return this.area.metrics().rtl\r\n      ? rect.right - event.clientX - parseFloat(css.borderRightWidth) - parseFloat(css.paddingRight)\r\n      : event.clientX - rect.left - el.clientLeft - parseFloat(css.paddingLeft);\r\n  }\r\n\r\n  protected onPointerDown(event: PointerEvent): void {\r\n    if (!event.isPrimary || event.button !== 0 || !this.overflow() || this.drag) return;\r\n    event.preventDefault();\r\n    this.area.refresh();\r\n    this.measure();\r\n    const g = this.geometry();\r\n    const position = g.max ? (g.offset / g.max) * g.travel : 0;\r\n    const coordinate = this.coordinate(event);\r\n    const onThumb = coordinate >= position && coordinate <= position + g.thumb;\r\n    this.drag = { pointer: event.pointerId, grab: onThumb ? coordinate - position : g.thumb / 2 };\r\n    this.host.nativeElement.setPointerCapture(event.pointerId);\r\n    if (!onThumb) this.onPointerMove(event);\r\n  }\r\n\r\n  protected onPointerMove(event: PointerEvent): void {\r\n    if (this.drag?.pointer !== event.pointerId) return;\r\n    const g = this.geometry();\r\n    if (g.travel > 0)\r\n      this.area.scrollTo(\r\n        this.vertical() ? 'vertical' : 'horizontal',\r\n        ((this.coordinate(event) - this.drag.grab) / g.travel) * g.max,\r\n      );\r\n  }\r\n\r\n  protected endPointer(event: PointerEvent): void {\r\n    if (event.pointerId === this.drag?.pointer) this.endDrag();\r\n  }\r\n\r\n  private endDrag(): void {\r\n    const drag = this.drag;\r\n    this.drag = null;\r\n    if (drag && this.host.nativeElement.hasPointerCapture(drag.pointer))\r\n      this.host.nativeElement.releasePointerCapture(drag.pointer);\r\n  }\r\n}\r\n","@if (overflow() || keepMounted()) {\r\n  <div\r\n    class=\"raqm-scroll-bar__thumb\"\r\n    data-slot=\"scroll-area-thumb\"\r\n    [attr.data-raqm-vertical]=\"vertical() ? '' : null\"\r\n    [attr.data-raqm-scrolling]=\"area.scrolling() ? '' : null\"\r\n    [style]=\"thumbStyle()\"\r\n  ></div>\r\n}\r\n","import { CdkScrollable } from '@angular/cdk/scrolling';\r\nimport { getRtlScrollAxisType, RtlScrollAxisType } from '@angular/cdk/platform';\r\nimport {\r\n  ChangeDetectionStrategy,\r\n  Component,\r\n  DestroyRef,\r\n  ElementRef,\r\n  afterNextRender,\r\n  computed,\r\n  contentChildren,\r\n  forwardRef,\r\n  inject,\r\n  input,\r\n  signal,\r\n  viewChild,\r\n} from '@angular/core';\r\nimport { RaqmScrollBarComponent } from './scroll-bar';\r\nimport { SCROLL_AREA, ScrollAreaMetrics } from './scroll-area-context';\r\n\r\n/** Scroll area; the labelled native viewport is the sole keyboard/AT target and the overlay bars are `aria-hidden` and pointer-only. */\r\n@Component({\r\n  selector: 'raqm-scroll-area',\r\n  imports: [CdkScrollable, RaqmScrollBarComponent],\r\n  templateUrl: './scroll-area.html',\r\n  styleUrl: './scroll-area.scss',\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  providers: [{ provide: SCROLL_AREA, useExisting: forwardRef(() => RaqmScrollAreaComponent) }],\r\n  host: {\r\n    class: 'raqm-scroll-area',\r\n    'data-slot': 'scroll-area',\r\n    '[attr.data-raqm-has-overflow-x]': 'metrics().scrollWidth > metrics().width ? \"\" : null',\r\n    '[attr.data-raqm-has-overflow-y]': 'vertical() ? \"\" : null',\r\n    '[attr.data-raqm-overflow-x-start]': 'edges().xStart ? \"\" : null',\r\n    '[attr.data-raqm-overflow-x-end]': 'edges().xEnd ? \"\" : null',\r\n    '[attr.data-raqm-overflow-y-start]': 'edges().yStart ? \"\" : null',\r\n    '[attr.data-raqm-overflow-y-end]': 'edges().yEnd ? \"\" : null',\r\n    '[attr.data-raqm-scrolling]': 'scrolling() ? \"\" : null',\r\n    '(pointerenter)': 'hovering.set(true)',\r\n    '(pointerleave)': 'hovering.set(false)',\r\n  },\r\n})\r\nexport class RaqmScrollAreaComponent {\r\n  /** Required accessible name for the keyboard-focusable native viewport. */\r\n  readonly viewportLabel = input.required<string>();\r\n  readonly overflowEdgeThreshold = input<\r\n    number | Partial<Record<'xStart' | 'xEnd' | 'yStart' | 'yEnd', number>>\r\n  >(0);\r\n  readonly viewport = viewChild.required<ElementRef<HTMLElement>>('viewport');\r\n  private readonly content = viewChild.required<ElementRef<HTMLElement>>('content');\r\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\r\n  private readonly destroyRef = inject(DestroyRef);\r\n  private readonly bars = contentChildren(RaqmScrollBarComponent);\r\n  protected readonly defaultVertical = computed(() => !this.bars().some((bar) => bar.vertical()));\r\n  readonly metrics = signal<ScrollAreaMetrics>({\r\n    width: 0,\r\n    height: 0,\r\n    scrollWidth: 0,\r\n    scrollHeight: 0,\r\n    x: 0,\r\n    y: 0,\r\n    rtl: false,\r\n  });\r\n  readonly horizontal = computed(\r\n    () =>\r\n      this.bars().some((bar) => !bar.vertical()) &&\r\n      this.metrics().scrollWidth > this.metrics().width,\r\n  );\r\n  readonly vertical = computed(() => this.metrics().scrollHeight > this.metrics().height);\r\n  readonly scrolling = signal(false);\r\n  readonly hovering = signal(false);\r\n  private scrollTimer: ReturnType<typeof setTimeout> | undefined;\r\n  readonly edges = computed(() => {\r\n    const m = this.metrics();\r\n    const threshold = this.overflowEdgeThreshold();\r\n    const edge = (key: 'xStart' | 'xEnd' | 'yStart' | 'yEnd') =>\r\n      Math.max(0, typeof threshold === 'number' ? threshold : (threshold[key] ?? 0));\r\n    return {\r\n      xStart: m.x > edge('xStart'),\r\n      xEnd: m.scrollWidth - m.width - m.x > edge('xEnd'),\r\n      yStart: m.y > edge('yStart'),\r\n      yEnd: m.scrollHeight - m.height - m.y > edge('yEnd'),\r\n    };\r\n  });\r\n\r\n  constructor() {\r\n    this.destroyRef.onDestroy(() => clearTimeout(this.scrollTimer));\r\n    afterNextRender(() => {\r\n      const viewport = this.viewport().nativeElement;\r\n      const content = this.content().nativeElement;\r\n      const resize = new ResizeObserver(() => this.refresh());\r\n      resize.observe(viewport);\r\n      resize.observe(content);\r\n      // Direction can change on any ancestor without changing viewport size.\r\n      const direction = new MutationObserver(() => this.refresh());\r\n      for (\r\n        let element: HTMLElement | null = this.host.nativeElement;\r\n        element;\r\n        element = element.parentElement\r\n      ) {\r\n        direction.observe(element, {\r\n          attributes: true,\r\n          attributeFilter: ['dir', 'class', 'style'],\r\n        });\r\n      }\r\n      const mutation = new MutationObserver(() => this.refresh());\r\n      mutation.observe(content, {\r\n        subtree: true,\r\n        childList: true,\r\n        characterData: true,\r\n        attributes: true,\r\n      });\r\n      const load = () => this.refresh();\r\n      content.addEventListener('load', load, true);\r\n      this.destroyRef.onDestroy(() => {\r\n        resize.disconnect();\r\n        mutation.disconnect();\r\n        direction.disconnect();\r\n        content.removeEventListener('load', load, true);\r\n      });\r\n      this.refresh();\r\n    });\r\n  }\r\n\r\n  /** Tracks the native scroll lifecycle without changing wheel or touch events. */\r\n  protected onScroll(): void {\r\n    this.refresh();\r\n    this.scrolling.set(true);\r\n    clearTimeout(this.scrollTimer);\r\n    this.scrollTimer = setTimeout(() => this.scrolling.set(false), 100);\r\n  }\r\n\r\n  refresh(): void {\r\n    const viewport = this.viewport().nativeElement;\r\n    const rtl = getComputedStyle(viewport).direction === 'rtl';\r\n    const max = Math.max(0, viewport.scrollWidth - viewport.clientWidth);\r\n    let x = viewport.scrollLeft;\r\n    if (rtl) {\r\n      switch (getRtlScrollAxisType()) {\r\n        case RtlScrollAxisType.NEGATED:\r\n          x = -x;\r\n          break;\r\n        case RtlScrollAxisType.NORMAL:\r\n          x = max - x;\r\n          break;\r\n      }\r\n    }\r\n    const next = {\r\n      width: viewport.clientWidth,\r\n      height: viewport.clientHeight,\r\n      scrollWidth: viewport.scrollWidth,\r\n      scrollHeight: viewport.scrollHeight,\r\n      x: Math.max(0, Math.min(max, x)),\r\n      y: Math.max(0, viewport.scrollTop),\r\n      rtl,\r\n    };\r\n    const previous = this.metrics();\r\n    if (\r\n      Object.keys(next).some(\r\n        (key) => next[key as keyof ScrollAreaMetrics] !== previous[key as keyof ScrollAreaMetrics],\r\n      )\r\n    )\r\n      this.metrics.set(next);\r\n  }\r\n\r\n  /** Sets a clamped native offset measured from the logical start of the chosen axis. */\r\n  scrollTo(orientation: 'horizontal' | 'vertical', offset: number): void {\r\n    const viewport = this.viewport().nativeElement;\r\n    this.refresh();\r\n    const metrics = this.metrics();\r\n    const max =\r\n      orientation === 'horizontal'\r\n        ? metrics.scrollWidth - metrics.width\r\n        : metrics.scrollHeight - metrics.height;\r\n    let value = Math.max(0, Math.min(max, offset));\r\n    if (orientation === 'vertical') {\r\n      viewport.scrollTop = value;\r\n    } else {\r\n      if (metrics.rtl) {\r\n        switch (getRtlScrollAxisType()) {\r\n          case RtlScrollAxisType.NEGATED:\r\n            value = -value;\r\n            break;\r\n          case RtlScrollAxisType.NORMAL:\r\n            value = max - value;\r\n            break;\r\n        }\r\n      }\r\n      viewport.scrollLeft = value;\r\n    }\r\n    this.refresh();\r\n  }\r\n}\r\n","<div\r\n  #viewport\r\n  cdkScrollable\r\n  class=\"raqm-scroll-area__viewport\"\r\n  data-slot=\"scroll-area-viewport\"\r\n  tabindex=\"0\"\r\n  role=\"region\"\r\n  [attr.aria-label]=\"viewportLabel()\"\r\n  (scroll)=\"onScroll()\"\r\n>\r\n  <div #content class=\"raqm-scroll-area__content\"><ng-content /></div>\r\n</div>\r\n<ng-content select=\"raqm-scroll-bar\" />\r\n@if (defaultVertical()) {\r\n  <raqm-scroll-bar />\r\n}\r\n@if (horizontal() && vertical()) {\r\n  <div class=\"raqm-scroll-area__corner\" aria-hidden=\"true\"></div>\r\n}\r\n","import { RaqmScrollAreaComponent } from './scroll-area';\r\nimport { RaqmScrollBarComponent } from './scroll-bar';\r\n\r\nexport { RaqmScrollAreaComponent, RaqmScrollBarComponent };\r\n\r\nexport const RaqmScrollArea = [RaqmScrollAreaComponent, RaqmScrollBarComponent] as const;\r\n"],"mappings":"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"}