@ojiepermana/angular 22.1.13 → 22.2.0

package/fesm2022/ojiepermana-angular-component-scroll-area.mjs

@@ -1,27 +1,64 @@
-import * as i0 from '@angular/core';
-import { input, numberAttribute, computed, Component } from '@angular/core';
-import { cn } from '@ojiepermana/angular/component/utils/core';
-
-/**
- * Lightweight scroll area using native scrollbars styled via CSS.
- * Fully accessible — real scrolling, keyboard, wheel, momentum.
- */
-class ScrollAreaComponent {
-    class = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
-    viewportClass = input('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "viewportClass" }] : /* istanbul ignore next */ []));
-    viewportAriaLabel = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "viewportAriaLabel" }] : /* istanbul ignore next */ []));
-    viewportTabIndex = input(0, { ...(ngDevMode ? { debugName: "viewportTabIndex" } : /* istanbul ignore next */ {}), transform: numberAttribute });
-    classes = computed(() => cn('relative overflow-hidden', this.class()), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    viewportRole = computed(() => (this.viewportAriaLabel() ? 'region' : null), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "viewportRole" }] : /* istanbul ignore next */ []));
-    viewportClasses = computed(() => cn('scroll-area-viewport h-full w-full rounded-[inherit]', 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring', this.viewportClass()), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "viewportClasses" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: ScrollAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: ScrollAreaComponent, isStandalone: true, selector: "ScrollArea", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, viewportClass: { classPropertyName: "viewportClass", publicName: "viewportClass", isSignal: true, isRequired: false, transformFunction: null }, viewportAriaLabel: { classPropertyName: "viewportAriaLabel", publicName: "viewportAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, viewportTabIndex: { classPropertyName: "viewportTabIndex", publicName: "viewportTabIndex", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: `
+import * as i0 from "@angular/core";
+import { Component, computed, input, numberAttribute } from "@angular/core";
+import { cn } from "@ojiepermana/angular/component/utils/core";
+var ScrollAreaComponent = class ScrollAreaComponent {
+	class = input("", ...ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []);
+	viewportClass = input("", ...ngDevMode ? [{ debugName: "viewportClass" }] : /* istanbul ignore next */ []);
+	viewportAriaLabel = input(null, ...ngDevMode ? [{ debugName: "viewportAriaLabel" }] : /* istanbul ignore next */ []);
+	viewportTabIndex = input(0, {
+		...ngDevMode ? { debugName: "viewportTabIndex" } : /* istanbul ignore next */ {},
+		transform: numberAttribute
+	});
+	classes = computed(() => cn("relative overflow-hidden", this.class()), ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	viewportRole = computed(() => this.viewportAriaLabel() ? "region" : null, ...ngDevMode ? [{ debugName: "viewportRole" }] : /* istanbul ignore next */ []);
+	viewportClasses = computed(() => cn("scroll-area-viewport h-full w-full rounded-[inherit]", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring", this.viewportClass()), ...ngDevMode ? [{ debugName: "viewportClasses" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ScrollAreaComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ScrollAreaComponent,
+		isStandalone: true,
+		selector: "ScrollArea",
+		inputs: {
+			class: {
+				classPropertyName: "class",
+				publicName: "class",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			viewportClass: {
+				classPropertyName: "viewportClass",
+				publicName: "viewportClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			viewportAriaLabel: {
+				classPropertyName: "viewportAriaLabel",
+				publicName: "viewportAriaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			viewportTabIndex: {
+				classPropertyName: "viewportTabIndex",
+				publicName: "viewportTabIndex",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { properties: { "class": "classes()" } },
+		ngImport: i0,
+		template: `
     <div
       [class]="viewportClasses()"
       [attr.aria-label]="viewportAriaLabel()"
@@ -30,13 +67,22 @@ class ScrollAreaComponent {
     >
       <ng-content />
     </div>
-  `, isInline: true, styles: [":host{display:block;overflow:hidden;position:relative}.scroll-area-viewport{overflow:auto;scrollbar-width:thin;scrollbar-color:var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb))) var(--tw-scrollbar-track, hsl(var(--scrollbar-track)))}.scroll-area-viewport::-webkit-scrollbar{width:var(--scrollbar-size, .5rem);height:var(--scrollbar-size, .5rem)}.scroll-area-viewport::-webkit-scrollbar-track{background:var(--tw-scrollbar-track, hsl(var(--scrollbar-track)))}.scroll-area-viewport::-webkit-scrollbar-thumb{background:var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb)));border:var(--border-width) solid transparent;background-clip:padding-box;border-radius:var(--scrollbar-radius, 9999px)}.scroll-area-viewport::-webkit-scrollbar-thumb:hover{background:var( --scrollbar-thumb-hover, var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb-hover))) );background-clip:padding-box}@media(forced-colors:active){.scroll-area-viewport{scrollbar-width:auto;scrollbar-color:auto}.scroll-area-viewport::-webkit-scrollbar-thumb{background:CanvasText;border-color:transparent}}\n"] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: ScrollAreaComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ScrollArea', host: {
-                        '[class]': 'classes()',
-                    }, template: `
+  `,
+		isInline: true,
+		styles: [":host{display:block;overflow:hidden;position:relative}.scroll-area-viewport{overflow:auto;scrollbar-width:thin;scrollbar-color:var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb))) var(--tw-scrollbar-track, hsl(var(--scrollbar-track)))}.scroll-area-viewport::-webkit-scrollbar{width:var(--scrollbar-size, .5rem);height:var(--scrollbar-size, .5rem)}.scroll-area-viewport::-webkit-scrollbar-track{background:var(--tw-scrollbar-track, hsl(var(--scrollbar-track)))}.scroll-area-viewport::-webkit-scrollbar-thumb{background:var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb)));border:var(--border-width) solid transparent;background-clip:padding-box;border-radius:var(--scrollbar-radius, 9999px)}.scroll-area-viewport::-webkit-scrollbar-thumb:hover{background:var( --scrollbar-thumb-hover, var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb-hover))) );background-clip:padding-box}@media(forced-colors:active){.scroll-area-viewport{scrollbar-width:auto;scrollbar-color:auto}.scroll-area-viewport::-webkit-scrollbar-thumb{background:CanvasText;border-color:transparent}}\n"]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ScrollAreaComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ScrollArea",
+			host: { "[class]": "classes()" },
+			template: `
     <div
       [class]="viewportClasses()"
       [attr.aria-label]="viewportAriaLabel()"
@@ -45,11 +91,43 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
     >
       <ng-content />
     </div>
-  `, styles: [":host{display:block;overflow:hidden;position:relative}.scroll-area-viewport{overflow:auto;scrollbar-width:thin;scrollbar-color:var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb))) var(--tw-scrollbar-track, hsl(var(--scrollbar-track)))}.scroll-area-viewport::-webkit-scrollbar{width:var(--scrollbar-size, .5rem);height:var(--scrollbar-size, .5rem)}.scroll-area-viewport::-webkit-scrollbar-track{background:var(--tw-scrollbar-track, hsl(var(--scrollbar-track)))}.scroll-area-viewport::-webkit-scrollbar-thumb{background:var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb)));border:var(--border-width) solid transparent;background-clip:padding-box;border-radius:var(--scrollbar-radius, 9999px)}.scroll-area-viewport::-webkit-scrollbar-thumb:hover{background:var( --scrollbar-thumb-hover, var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb-hover))) );background-clip:padding-box}@media(forced-colors:active){.scroll-area-viewport{scrollbar-width:auto;scrollbar-color:auto}.scroll-area-viewport::-webkit-scrollbar-thumb{background:CanvasText;border-color:transparent}}\n"] }]
-        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], viewportClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewportClass", required: false }] }], viewportAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewportAriaLabel", required: false }] }], viewportTabIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewportTabIndex", required: false }] }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { ScrollAreaComponent };
+  `,
+			styles: [":host{display:block;overflow:hidden;position:relative}.scroll-area-viewport{overflow:auto;scrollbar-width:thin;scrollbar-color:var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb))) var(--tw-scrollbar-track, hsl(var(--scrollbar-track)))}.scroll-area-viewport::-webkit-scrollbar{width:var(--scrollbar-size, .5rem);height:var(--scrollbar-size, .5rem)}.scroll-area-viewport::-webkit-scrollbar-track{background:var(--tw-scrollbar-track, hsl(var(--scrollbar-track)))}.scroll-area-viewport::-webkit-scrollbar-thumb{background:var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb)));border:var(--border-width) solid transparent;background-clip:padding-box;border-radius:var(--scrollbar-radius, 9999px)}.scroll-area-viewport::-webkit-scrollbar-thumb:hover{background:var( --scrollbar-thumb-hover, var(--tw-scrollbar-thumb, hsl(var(--scrollbar-thumb-hover))) );background-clip:padding-box}@media(forced-colors:active){.scroll-area-viewport{scrollbar-width:auto;scrollbar-color:auto}.scroll-area-viewport::-webkit-scrollbar-thumb{background:CanvasText;border-color:transparent}}\n"]
+		}]
+	}],
+	propDecorators: {
+		class: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "class",
+				required: false
+			}]
+		}],
+		viewportClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "viewportClass",
+				required: false
+			}]
+		}],
+		viewportAriaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "viewportAriaLabel",
+				required: false
+			}]
+		}],
+		viewportTabIndex: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "viewportTabIndex",
+				required: false
+			}]
+		}]
+	}
+});
+export { ScrollAreaComponent };