@shival99/z-ui 2.0.29 → 2.0.31

package/fesm2022/shival99-z-ui-components-z-scrollarea.mjs

@@ -0,0 +1,131 @@
+import { NgTemplateOutlet } from '@angular/common';
+import * as i0 from '@angular/core';
+import { viewChild, input, output, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { zMergeClasses } from '@shival99/z-ui/utils';
+import { NgScrollbar } from 'ngx-scrollbar';
+import { cva } from 'class-variance-authority';
+
+const zScrollAreaVariants = cva('z-scrollarea block overflow-hidden w-full', {
+    variants: {
+        zSize: {
+            sm: 'z-scrollarea-size-sm',
+            default: 'z-scrollarea-size-default',
+            lg: 'z-scrollarea-size-lg',
+        },
+    },
+    defaultVariants: {
+        zSize: 'default',
+    },
+});
+
+class ZScrollAreaComponent {
+    // Lấy reference đến ngx-scrollbar
+    scrollbarRef = viewChild('scrollbarRef', ...(ngDevMode ? [{ debugName: "scrollbarRef" }] : []));
+    // Lấy reference đến native viewport
+    nativeViewport = viewChild('nativeViewport', ...(ngDevMode ? [{ debugName: "nativeViewport" }] : []));
+    // Khai báo các inputs sử dụng Signals API
+    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
+    zType = input('custom', ...(ngDevMode ? [{ debugName: "zType" }] : []));
+    zOrientation = input('vertical', ...(ngDevMode ? [{ debugName: "zOrientation" }] : []));
+    zVisibility = input('hover', ...(ngDevMode ? [{ debugName: "zVisibility" }] : []));
+    zSize = input('default', ...(ngDevMode ? [{ debugName: "zSize" }] : []));
+    zDisableInteraction = input(false, ...(ngDevMode ? [{ debugName: "zDisableInteraction" }] : []));
+    zSensorThrottleTime = input(200, ...(ngDevMode ? [{ debugName: "zSensorThrottleTime" }] : []));
+    zDisableSensor = input(false, ...(ngDevMode ? [{ debugName: "zDisableSensor" }] : []));
+    // Khai báo các outputs sử dụng Signals API
+    zScroll = output();
+    zScrollbarInit = output();
+    // Tính toán các class cho host element
+    hostClasses = computed(() => zMergeClasses(zScrollAreaVariants({
+        zSize: this.zSize(),
+    }), `z-scrollarea-${this.zOrientation()}`, `z-scrollarea-visibility-${this.zVisibility()}`, this.class()), ...(ngDevMode ? [{ debugName: "hostClasses" }] : []));
+    // Tính toán các class cho native viewport
+    nativeClasses = computed(() => {
+        const orientation = this.zOrientation();
+        let overflowClass = 'overflow-auto';
+        if (orientation === 'vertical') {
+            overflowClass = 'overflow-y-auto overflow-x-hidden';
+        }
+        if (orientation === 'horizontal') {
+            overflowClass = 'overflow-x-auto overflow-y-hidden';
+        }
+        return zMergeClasses('z-scrollarea-native w-full h-full block', overflowClass);
+    }, ...(ngDevMode ? [{ debugName: "nativeClasses" }] : []));
+    ngAfterViewInit() {
+        const scrollbar = this.scrollbarRef();
+        if (!scrollbar) {
+            return;
+        }
+        this.zScrollbarInit.emit(scrollbar);
+    }
+    // Chuyển tiếp sự kiện scroll
+    onScroll(event) {
+        this.zScroll.emit(event);
+    }
+    // API helper để scroll chương trình
+    scrollTo(options) {
+        if (this.zType() === 'native') {
+            const nativeEl = this.nativeViewport()?.nativeElement;
+            if (nativeEl) {
+                nativeEl.scrollTo(options);
+            }
+            return;
+        }
+        const scrollbar = this.scrollbarRef();
+        if (!scrollbar) {
+            return;
+        }
+        void scrollbar.scrollTo(options);
+    }
+    // API helper để scroll đến phần tử cụ thể
+    scrollToElement(selectorOrElement, options) {
+        if (this.zType() === 'native') {
+            const nativeEl = this.nativeViewport()?.nativeElement;
+            if (!nativeEl) {
+                return;
+            }
+            let targetEl = null;
+            if (typeof selectorOrElement === 'string') {
+                targetEl = nativeEl.querySelector(selectorOrElement);
+            }
+            if (selectorOrElement instanceof HTMLElement) {
+                targetEl = selectorOrElement;
+            }
+            if (targetEl) {
+                const behavior = options?.duration && options.duration > 0 ? 'smooth' : 'auto';
+                targetEl.scrollIntoView({ behavior, block: 'nearest', inline: 'nearest' });
+            }
+            return;
+        }
+        const scrollbar = this.scrollbarRef();
+        if (!scrollbar) {
+            return;
+        }
+        let targetEl = null;
+        if (typeof selectorOrElement === 'string') {
+            targetEl = scrollbar.nativeElement.querySelector(selectorOrElement);
+        }
+        if (selectorOrElement instanceof HTMLElement) {
+            targetEl = selectorOrElement;
+        }
+        if (!targetEl) {
+            return;
+        }
+        void scrollbar.scrollToElement(targetEl, options);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZScrollAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ZScrollAreaComponent, isStandalone: true, selector: "z-scrollarea", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zType: { classPropertyName: "zType", publicName: "zType", isSignal: true, isRequired: false, transformFunction: null }, zOrientation: { classPropertyName: "zOrientation", publicName: "zOrientation", isSignal: true, isRequired: false, transformFunction: null }, zVisibility: { classPropertyName: "zVisibility", publicName: "zVisibility", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zDisableInteraction: { classPropertyName: "zDisableInteraction", publicName: "zDisableInteraction", isSignal: true, isRequired: false, transformFunction: null }, zSensorThrottleTime: { classPropertyName: "zSensorThrottleTime", publicName: "zSensorThrottleTime", isSignal: true, isRequired: false, transformFunction: null }, zDisableSensor: { classPropertyName: "zDisableSensor", publicName: "zDisableSensor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zScroll: "zScroll", zScrollbarInit: "zScrollbarInit" }, host: { properties: { "class": "hostClasses()" } }, viewQueries: [{ propertyName: "scrollbarRef", first: true, predicate: ["scrollbarRef"], descendants: true, isSignal: true }, { propertyName: "nativeViewport", first: true, predicate: ["nativeViewport"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #contentTpl>\n  <ng-content />\n</ng-template>\n\n@if (zType() === 'custom') {\n  <ng-scrollbar\n    #scrollbarRef\n    class=\"block h-full w-full\"\n    [visibility]=\"zVisibility()\"\n    [orientation]=\"zOrientation()\"\n    [disableInteraction]=\"zDisableInteraction()\"\n    [sensorThrottleTime]=\"zSensorThrottleTime()\"\n    [disableSensor]=\"zDisableSensor()\"\n    (scroll)=\"onScroll($event)\">\n    <ng-container *ngTemplateOutlet=\"contentTpl\" />\n  </ng-scrollbar>\n} @else {\n  <div #nativeViewport [class]=\"nativeClasses()\" (scroll)=\"onScroll($event)\">\n    <ng-container *ngTemplateOutlet=\"contentTpl\" />\n  </div>\n}\n", styles: [":host{display:block;position:relative}.z-scrollarea{display:block}.z-scrollarea ng-scrollbar{width:100%;height:inherit;--scrollbar-track-thickness: var(--scrollbar-size);--scrollbar-track-hover-thickness: var(--scrollbar-size);--scrollbar-track-active-thickness: var(--scrollbar-size);--scrollbar-container-offset: 0px;--scrollbar-track-offset: 0px;--scrollbar-track-color: inherit;--scrollbar-thumb-color: inherit;--scrollbar-thumb-hover-color: inherit;--scrollbar-border-radius: inherit;--scrollbar-track-border-radius: inherit;--scrollbar-thumb-transition: inherit}.z-scrollarea .z-scrollarea-native{width:100%;height:inherit}.z-scrollarea{--scrollbar-track-color: transparent;--scrollbar-thumb-color: color-mix(in oklab, var(--muted-foreground) 30%, transparent);--scrollbar-thumb-hover-color: color-mix(in oklab, var(--muted-foreground) 50%, transparent);--scrollbar-border-radius: var(--radius-sm, 6px);--scrollbar-track-border-radius: var(--radius-sm, 6px);--scrollbar-thumb-transition: background-color .2s ease, opacity .2s ease}.z-scrollarea.z-scrollarea-size-sm{--scrollbar-size: 4px;--scrollbar-padding: 2px}.z-scrollarea.z-scrollarea-size-default{--scrollbar-size: 6px;--scrollbar-padding: 4px}.z-scrollarea.z-scrollarea-size-lg{--scrollbar-size: 8px;--scrollbar-padding: 6px}.z-scrollarea .ng-scroll-viewport{width:100%;height:100%;max-width:100%;max-height:100%;box-sizing:border-box}.z-scrollarea .ng-scroll-content{box-sizing:border-box;display:block;width:100%}.z-scrollarea.z-scrollarea-horizontal .ng-scroll-content,.z-scrollarea.z-scrollarea-auto .ng-scroll-content{width:max-content;min-width:100%}.z-scrollarea-visibility-visible .z-scrollarea-native,.z-scrollarea-visibility-hover .z-scrollarea-native{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb-color, color-mix(in oklab, var(--muted-foreground) 30%, transparent)) var(--scrollbar-track-color, transparent)}.z-scrollarea-visibility-visible .z-scrollarea-native::-webkit-scrollbar,.z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar{width:var(--scrollbar-size, 6px);height:var(--scrollbar-size, 6px)}.z-scrollarea-visibility-visible .z-scrollarea-native::-webkit-scrollbar-track,.z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-track{background:var(--scrollbar-track-color, transparent)}.z-scrollarea-visibility-visible .z-scrollarea-native::-webkit-scrollbar-thumb,.z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-color, color-mix(in oklab, var(--muted-foreground) 30%, transparent));border-radius:var(--scrollbar-border-radius, var(--radius-sm, 6px));transition:var(--scrollbar-thumb-transition, background-color .2s ease)}.z-scrollarea-visibility-visible .z-scrollarea-native::-webkit-scrollbar-thumb:hover,.z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover-color, color-mix(in oklab, var(--muted-foreground) 50%, transparent))}.z-scrollarea-visibility-hover .z-scrollarea-native{scrollbar-color:transparent transparent}.z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb{background:transparent}.z-scrollarea-visibility-hover:hover .z-scrollarea-visibility-hover .z-scrollarea-native,.z-scrollarea-visibility-hover:active .z-scrollarea-visibility-hover .z-scrollarea-native,.z-scrollarea-visibility-hover:focus-within .z-scrollarea-visibility-hover .z-scrollarea-native,.z-scrollarea-visibility-hover .z-scrollarea-native:hover,.z-scrollarea-visibility-hover .z-scrollarea-native:active{scrollbar-color:var(--scrollbar-thumb-color, color-mix(in oklab, var(--muted-foreground) 30%, transparent)) var(--scrollbar-track-color, transparent)}.z-scrollarea-visibility-hover:hover .z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb,.z-scrollarea-visibility-hover:active .z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb,.z-scrollarea-visibility-hover:focus-within .z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb,.z-scrollarea-visibility-hover .z-scrollarea-native:hover::-webkit-scrollbar-thumb,.z-scrollarea-visibility-hover .z-scrollarea-native:active::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-color, color-mix(in oklab, var(--muted-foreground) 30%, transparent))}\n"], dependencies: [{ kind: "component", type: NgScrollbar, selector: "ng-scrollbar:not([externalViewport]), [ngScrollbar]", exportAs: ["ngScrollbar"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZScrollAreaComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'z-scrollarea', imports: [NgScrollbar, NgTemplateOutlet], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        '[class]': 'hostClasses()',
+                    }, template: "<ng-template #contentTpl>\n  <ng-content />\n</ng-template>\n\n@if (zType() === 'custom') {\n  <ng-scrollbar\n    #scrollbarRef\n    class=\"block h-full w-full\"\n    [visibility]=\"zVisibility()\"\n    [orientation]=\"zOrientation()\"\n    [disableInteraction]=\"zDisableInteraction()\"\n    [sensorThrottleTime]=\"zSensorThrottleTime()\"\n    [disableSensor]=\"zDisableSensor()\"\n    (scroll)=\"onScroll($event)\">\n    <ng-container *ngTemplateOutlet=\"contentTpl\" />\n  </ng-scrollbar>\n} @else {\n  <div #nativeViewport [class]=\"nativeClasses()\" (scroll)=\"onScroll($event)\">\n    <ng-container *ngTemplateOutlet=\"contentTpl\" />\n  </div>\n}\n", styles: [":host{display:block;position:relative}.z-scrollarea{display:block}.z-scrollarea ng-scrollbar{width:100%;height:inherit;--scrollbar-track-thickness: var(--scrollbar-size);--scrollbar-track-hover-thickness: var(--scrollbar-size);--scrollbar-track-active-thickness: var(--scrollbar-size);--scrollbar-container-offset: 0px;--scrollbar-track-offset: 0px;--scrollbar-track-color: inherit;--scrollbar-thumb-color: inherit;--scrollbar-thumb-hover-color: inherit;--scrollbar-border-radius: inherit;--scrollbar-track-border-radius: inherit;--scrollbar-thumb-transition: inherit}.z-scrollarea .z-scrollarea-native{width:100%;height:inherit}.z-scrollarea{--scrollbar-track-color: transparent;--scrollbar-thumb-color: color-mix(in oklab, var(--muted-foreground) 30%, transparent);--scrollbar-thumb-hover-color: color-mix(in oklab, var(--muted-foreground) 50%, transparent);--scrollbar-border-radius: var(--radius-sm, 6px);--scrollbar-track-border-radius: var(--radius-sm, 6px);--scrollbar-thumb-transition: background-color .2s ease, opacity .2s ease}.z-scrollarea.z-scrollarea-size-sm{--scrollbar-size: 4px;--scrollbar-padding: 2px}.z-scrollarea.z-scrollarea-size-default{--scrollbar-size: 6px;--scrollbar-padding: 4px}.z-scrollarea.z-scrollarea-size-lg{--scrollbar-size: 8px;--scrollbar-padding: 6px}.z-scrollarea .ng-scroll-viewport{width:100%;height:100%;max-width:100%;max-height:100%;box-sizing:border-box}.z-scrollarea .ng-scroll-content{box-sizing:border-box;display:block;width:100%}.z-scrollarea.z-scrollarea-horizontal .ng-scroll-content,.z-scrollarea.z-scrollarea-auto .ng-scroll-content{width:max-content;min-width:100%}.z-scrollarea-visibility-visible .z-scrollarea-native,.z-scrollarea-visibility-hover .z-scrollarea-native{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb-color, color-mix(in oklab, var(--muted-foreground) 30%, transparent)) var(--scrollbar-track-color, transparent)}.z-scrollarea-visibility-visible .z-scrollarea-native::-webkit-scrollbar,.z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar{width:var(--scrollbar-size, 6px);height:var(--scrollbar-size, 6px)}.z-scrollarea-visibility-visible .z-scrollarea-native::-webkit-scrollbar-track,.z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-track{background:var(--scrollbar-track-color, transparent)}.z-scrollarea-visibility-visible .z-scrollarea-native::-webkit-scrollbar-thumb,.z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-color, color-mix(in oklab, var(--muted-foreground) 30%, transparent));border-radius:var(--scrollbar-border-radius, var(--radius-sm, 6px));transition:var(--scrollbar-thumb-transition, background-color .2s ease)}.z-scrollarea-visibility-visible .z-scrollarea-native::-webkit-scrollbar-thumb:hover,.z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover-color, color-mix(in oklab, var(--muted-foreground) 50%, transparent))}.z-scrollarea-visibility-hover .z-scrollarea-native{scrollbar-color:transparent transparent}.z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb{background:transparent}.z-scrollarea-visibility-hover:hover .z-scrollarea-visibility-hover .z-scrollarea-native,.z-scrollarea-visibility-hover:active .z-scrollarea-visibility-hover .z-scrollarea-native,.z-scrollarea-visibility-hover:focus-within .z-scrollarea-visibility-hover .z-scrollarea-native,.z-scrollarea-visibility-hover .z-scrollarea-native:hover,.z-scrollarea-visibility-hover .z-scrollarea-native:active{scrollbar-color:var(--scrollbar-thumb-color, color-mix(in oklab, var(--muted-foreground) 30%, transparent)) var(--scrollbar-track-color, transparent)}.z-scrollarea-visibility-hover:hover .z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb,.z-scrollarea-visibility-hover:active .z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb,.z-scrollarea-visibility-hover:focus-within .z-scrollarea-visibility-hover .z-scrollarea-native::-webkit-scrollbar-thumb,.z-scrollarea-visibility-hover .z-scrollarea-native:hover::-webkit-scrollbar-thumb,.z-scrollarea-visibility-hover .z-scrollarea-native:active::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-color, color-mix(in oklab, var(--muted-foreground) 30%, transparent))}\n"] }]
+        }], propDecorators: { scrollbarRef: [{ type: i0.ViewChild, args: ['scrollbarRef', { isSignal: true }] }], nativeViewport: [{ type: i0.ViewChild, args: ['nativeViewport', { isSignal: true }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zType: [{ type: i0.Input, args: [{ isSignal: true, alias: "zType", required: false }] }], zOrientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOrientation", required: false }] }], zVisibility: [{ type: i0.Input, args: [{ isSignal: true, alias: "zVisibility", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zDisableInteraction: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisableInteraction", required: false }] }], zSensorThrottleTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSensorThrottleTime", required: false }] }], zDisableSensor: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisableSensor", required: false }] }], zScroll: [{ type: i0.Output, args: ["zScroll"] }], zScrollbarInit: [{ type: i0.Output, args: ["zScrollbarInit"] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ZScrollAreaComponent, zScrollAreaVariants };
+//# sourceMappingURL=shival99-z-ui-components-z-scrollarea.mjs.map

package/fesm2022/shival99-z-ui-components-z-scrollarea.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"shival99-z-ui-components-z-scrollarea.mjs","sources":["../../../../libs/core-ui/components/z-scrollarea/z-scrollarea.variants.ts","../../../../libs/core-ui/components/z-scrollarea/z-scrollarea.component.ts","../../../../libs/core-ui/components/z-scrollarea/z-scrollarea.component.html","../../../../libs/core-ui/components/z-scrollarea/shival99-z-ui-components-z-scrollarea.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zScrollAreaVariants = cva('z-scrollarea block overflow-hidden w-full', {\n  variants: {\n    zSize: {\n      sm: 'z-scrollarea-size-sm',\n      default: 'z-scrollarea-size-default',\n      lg: 'z-scrollarea-size-lg',\n    },\n  },\n  defaultVariants: {\n    zSize: 'default',\n  },\n});\n\nexport type ZScrollAreaVariants = VariantProps<typeof zScrollAreaVariants>;\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  ElementRef,\n  input,\n  output,\n  viewChild,\n  ViewEncapsulation,\n  type AfterViewInit,\n} from '@angular/core';\nimport { zMergeClasses } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { NgScrollbar } from 'ngx-scrollbar';\nimport type {\n  ZScrollAreaOrientation,\n  ZScrollAreaVisibility,\n  ZScrollAreaSize,\n  ZScrollAreaType,\n} from './z-scrollarea.types';\nimport { zScrollAreaVariants } from './z-scrollarea.variants';\n\n@Component({\n  selector: 'z-scrollarea',\n  imports: [NgScrollbar, NgTemplateOutlet],\n  standalone: true,\n  templateUrl: './z-scrollarea.component.html',\n  styleUrl: './z-scrollarea.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'hostClasses()',\n  },\n})\nexport class ZScrollAreaComponent implements AfterViewInit {\n  // Lấy reference đến ngx-scrollbar\n  public readonly scrollbarRef = viewChild<NgScrollbar>('scrollbarRef');\n  // Lấy reference đến native viewport\n  public readonly nativeViewport = viewChild<ElementRef<HTMLElement>>('nativeViewport');\n\n  // Khai báo các inputs sử dụng Signals API\n  public readonly class = input<ClassValue>('');\n  public readonly zType = input<ZScrollAreaType>('custom');\n  public readonly zOrientation = input<ZScrollAreaOrientation>('vertical');\n  public readonly zVisibility = input<ZScrollAreaVisibility>('hover');\n  public readonly zSize = input<ZScrollAreaSize>('default');\n  public readonly zDisableInteraction = input<boolean>(false);\n  public readonly zSensorThrottleTime = input<number>(200);\n  public readonly zDisableSensor = input<boolean>(false);\n\n  // Khai báo các outputs sử dụng Signals API\n  public readonly zScroll = output<Event>();\n  public readonly zScrollbarInit = output<NgScrollbar>();\n\n  // Tính toán các class cho host element\n  protected readonly hostClasses = computed(() =>\n    zMergeClasses(\n      zScrollAreaVariants({\n        zSize: this.zSize(),\n      }),\n      `z-scrollarea-${this.zOrientation()}`,\n      `z-scrollarea-visibility-${this.zVisibility()}`,\n      this.class()\n    )\n  );\n\n  // Tính toán các class cho native viewport\n  protected readonly nativeClasses = computed(() => {\n    const orientation = this.zOrientation();\n    let overflowClass = 'overflow-auto';\n    if (orientation === 'vertical') {\n      overflowClass = 'overflow-y-auto overflow-x-hidden';\n    }\n    if (orientation === 'horizontal') {\n      overflowClass = 'overflow-x-auto overflow-y-hidden';\n    }\n    return zMergeClasses('z-scrollarea-native w-full h-full block', overflowClass);\n  });\n\n  public ngAfterViewInit(): void {\n    const scrollbar = this.scrollbarRef();\n    if (!scrollbar) {\n      return;\n    }\n    this.zScrollbarInit.emit(scrollbar);\n  }\n\n  // Chuyển tiếp sự kiện scroll\n  protected onScroll(event: Event): void {\n    this.zScroll.emit(event);\n  }\n\n  // API helper để scroll chương trình\n  public scrollTo(options: ScrollToOptions): void {\n    if (this.zType() === 'native') {\n      const nativeEl = this.nativeViewport()?.nativeElement;\n      if (nativeEl) {\n        nativeEl.scrollTo(options);\n      }\n      return;\n    }\n\n    const scrollbar = this.scrollbarRef();\n    if (!scrollbar) {\n      return;\n    }\n    void scrollbar.scrollTo(options);\n  }\n\n  // API helper để scroll đến phần tử cụ thể\n  public scrollToElement(\n    selectorOrElement: string | HTMLElement,\n    options?: { top?: number; left?: number; duration?: number }\n  ): void {\n    if (this.zType() === 'native') {\n      const nativeEl = this.nativeViewport()?.nativeElement;\n      if (!nativeEl) {\n        return;\n      }\n\n      let targetEl: HTMLElement | null = null;\n      if (typeof selectorOrElement === 'string') {\n        targetEl = nativeEl.querySelector(selectorOrElement);\n      }\n      if (selectorOrElement instanceof HTMLElement) {\n        targetEl = selectorOrElement;\n      }\n\n      if (targetEl) {\n        const behavior = options?.duration && options.duration > 0 ? 'smooth' : 'auto';\n        targetEl.scrollIntoView({ behavior, block: 'nearest', inline: 'nearest' });\n      }\n      return;\n    }\n\n    const scrollbar = this.scrollbarRef();\n    if (!scrollbar) {\n      return;\n    }\n\n    let targetEl: HTMLElement | null = null;\n    if (typeof selectorOrElement === 'string') {\n      targetEl = scrollbar.nativeElement.querySelector(selectorOrElement);\n    }\n    if (selectorOrElement instanceof HTMLElement) {\n      targetEl = selectorOrElement;\n    }\n\n    if (!targetEl) {\n      return;\n    }\n\n    void scrollbar.scrollToElement(targetEl, options);\n  }\n}\n","<ng-template #contentTpl>\n  <ng-content />\n</ng-template>\n\n@if (zType() === 'custom') {\n  <ng-scrollbar\n    #scrollbarRef\n    class=\"block h-full w-full\"\n    [visibility]=\"zVisibility()\"\n    [orientation]=\"zOrientation()\"\n    [disableInteraction]=\"zDisableInteraction()\"\n    [sensorThrottleTime]=\"zSensorThrottleTime()\"\n    [disableSensor]=\"zDisableSensor()\"\n    (scroll)=\"onScroll($event)\">\n    <ng-container *ngTemplateOutlet=\"contentTpl\" />\n  </ng-scrollbar>\n} @else {\n  <div #nativeViewport [class]=\"nativeClasses()\" (scroll)=\"onScroll($event)\">\n    <ng-container *ngTemplateOutlet=\"contentTpl\" />\n  </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/shival99-z-ui-components-z-show-more.mjs

@@ -0,0 +1,121 @@
+import * as i0 from '@angular/core';
+import { inject, DestroyRef, input, output, viewChild, signal, computed, afterNextRender, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { TranslatePipe } from '@ngx-translate/core';
+import { ZButtonComponent } from '@shival99/z-ui/components/z-button';
+import { ZIconComponent } from '@shival99/z-ui/components/z-icon';
+import { zTransform, zMergeClasses } from '@shival99/z-ui/utils';
+
+class ZShowMoreComponent {
+    _destroyRef = inject(DestroyRef);
+    // Inputs
+    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
+    zMaxHeight = input(150, ...(ngDevMode ? [{ debugName: "zMaxHeight" }] : []));
+    zShowMoreLabel = input(undefined, ...(ngDevMode ? [{ debugName: "zShowMoreLabel" }] : []));
+    zShowLessLabel = input(undefined, ...(ngDevMode ? [{ debugName: "zShowLessLabel" }] : []));
+    zShowLessButton = input(true, ...(ngDevMode ? [{ debugName: "zShowLessButton" }] : []));
+    zButtonType = input('ghost-primary', ...(ngDevMode ? [{ debugName: "zButtonType" }] : []));
+    zButtonSize = input('sm', ...(ngDevMode ? [{ debugName: "zButtonSize" }] : []));
+    zWave = input(false, { ...(ngDevMode ? { debugName: "zWave" } : {}), transform: zTransform });
+    zBlurHeight = input(64, ...(ngDevMode ? [{ debugName: "zBlurHeight" }] : []));
+    zBlurColor = input(undefined, ...(ngDevMode ? [{ debugName: "zBlurColor" }] : []));
+    // Outputs
+    zExpandChange = output();
+    // Queries
+    _contentContainer = viewChild('contentContainer', ...(ngDevMode ? [{ debugName: "_contentContainer" }] : []));
+    _contentInner = viewChild('contentInner', ...(ngDevMode ? [{ debugName: "_contentInner" }] : []));
+    // State
+    _isExpanded = signal(false, ...(ngDevMode ? [{ debugName: "_isExpanded" }] : []));
+    _isOverflowing = signal(false, ...(ngDevMode ? [{ debugName: "_isOverflowing" }] : []));
+    _scrollHeight = signal(0, ...(ngDevMode ? [{ debugName: "_scrollHeight" }] : []));
+    // Readonly bindings for template
+    isExpanded = this._isExpanded.asReadonly();
+    isOverflowing = this._isOverflowing.asReadonly();
+    zClasses = computed(() => zMergeClasses('block w-full', this.class()), ...(ngDevMode ? [{ debugName: "zClasses" }] : []));
+    computedMaxHeight = computed(() => {
+        if (!this._isOverflowing()) {
+            return 'none';
+        }
+        if (this._isExpanded()) {
+            return `${this._scrollHeight()}px`;
+        }
+        const maxH = this.zMaxHeight();
+        return typeof maxH === 'number' ? `${maxH}px` : maxH;
+    }, ...(ngDevMode ? [{ debugName: "computedMaxHeight" }] : []));
+    // Tạo linear gradient mờ dần xuống nền (card/page)
+    blurGradientStyle = computed(() => {
+        const bg = this.zBlurColor() || 'var(--card, var(--background, #fff))';
+        return {
+            'background-image': `linear-gradient(to top, ${bg} 0%, transparent 100%)`,
+            height: `${this.zBlurHeight()}px`,
+        };
+    }, ...(ngDevMode ? [{ debugName: "blurGradientStyle" }] : []));
+    constructor() {
+        afterNextRender(() => {
+            const innerEl = this._contentInner()?.nativeElement;
+            if (!innerEl) {
+                return;
+            }
+            // Kiểm tra chiều cao nội dung thực tế so với chiều cao tối đa giới hạn
+            const checkOverflow = () => {
+                const { scrollHeight } = innerEl;
+                this._scrollHeight.set(scrollHeight);
+                const maxH = this.zMaxHeight();
+                if (typeof maxH === 'number') {
+                    this._isOverflowing.set(scrollHeight > maxH);
+                    return;
+                }
+                // Nếu zMaxHeight là string (ví dụ: '100%', 'calc(100% - 40px)')
+                const contentEl = this._contentContainer()?.nativeElement;
+                if (!contentEl) {
+                    return;
+                }
+                // Tạm thời tắt transition để đo chiều cao chính xác mà không bị ảnh hưởng bởi chuyển động
+                const originalTransition = contentEl.style.transition;
+                const originalMaxHeight = contentEl.style.maxHeight;
+                contentEl.style.transition = 'none';
+                contentEl.style.maxHeight = maxH;
+                // Force reflow để trình duyệt tính toán lại layout
+                const collapsedClientHeight = contentEl.clientHeight;
+                // Khôi phục lại trạng thái ban đầu
+                contentEl.style.maxHeight = originalMaxHeight;
+                // Force reflow để tránh giật lag khi phục hồi transition
+                void contentEl.offsetHeight;
+                contentEl.style.transition = originalTransition;
+                // Nếu phần tử đang ẩn (display: none) thì bỏ qua
+                if (collapsedClientHeight === 0 && contentEl.offsetWidth === 0) {
+                    return;
+                }
+                this._isOverflowing.set(scrollHeight > collapsedClientHeight);
+            };
+            checkOverflow();
+            // Sử dụng ResizeObserver để lắng nghe thay đổi kích thước của phần tử nội dung bên trong
+            const resizeObserver = new ResizeObserver(() => {
+                checkOverflow();
+            });
+            resizeObserver.observe(innerEl);
+            this._destroyRef.onDestroy(() => {
+                resizeObserver.disconnect();
+            });
+        });
+    }
+    toggle() {
+        const nextState = !this._isExpanded();
+        this._isExpanded.set(nextState);
+        this.zExpandChange.emit(nextState);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZShowMoreComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ZShowMoreComponent, isStandalone: true, selector: "z-show-more", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zMaxHeight: { classPropertyName: "zMaxHeight", publicName: "zMaxHeight", isSignal: true, isRequired: false, transformFunction: null }, zShowMoreLabel: { classPropertyName: "zShowMoreLabel", publicName: "zShowMoreLabel", isSignal: true, isRequired: false, transformFunction: null }, zShowLessLabel: { classPropertyName: "zShowLessLabel", publicName: "zShowLessLabel", isSignal: true, isRequired: false, transformFunction: null }, zShowLessButton: { classPropertyName: "zShowLessButton", publicName: "zShowLessButton", isSignal: true, isRequired: false, transformFunction: null }, zButtonType: { classPropertyName: "zButtonType", publicName: "zButtonType", isSignal: true, isRequired: false, transformFunction: null }, zButtonSize: { classPropertyName: "zButtonSize", publicName: "zButtonSize", isSignal: true, isRequired: false, transformFunction: null }, zWave: { classPropertyName: "zWave", publicName: "zWave", isSignal: true, isRequired: false, transformFunction: null }, zBlurHeight: { classPropertyName: "zBlurHeight", publicName: "zBlurHeight", isSignal: true, isRequired: false, transformFunction: null }, zBlurColor: { classPropertyName: "zBlurColor", publicName: "zBlurColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zExpandChange: "zExpandChange" }, host: { properties: { "class": "zClasses()" } }, viewQueries: [{ propertyName: "_contentContainer", first: true, predicate: ["contentContainer"], descendants: true, isSignal: true }, { propertyName: "_contentInner", first: true, predicate: ["contentInner"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"z-show-more flex h-full min-h-0 w-full flex-col\">\n  <div\n    #contentContainer\n    class=\"z-show-more-content relative min-h-0 flex-1 overflow-hidden transition-[max-height] duration-300 ease-out\"\n    [style.max-height]=\"computedMaxHeight()\">\n    <div #contentInner>\n      <ng-content />\n    </div>\n\n    @if (!isExpanded() && isOverflowing()) {\n      <div\n        class=\"pointer-events-none absolute right-0 bottom-0 left-0 transition-opacity duration-300\"\n        [style]=\"blurGradientStyle()\"></div>\n    }\n  </div>\n\n  @if (isOverflowing() && (zShowLessButton() || !isExpanded())) {\n    <div class=\"z-show-more-actions mt-2 flex justify-center\">\n      <button z-button [zType]=\"zButtonType()\" [zSize]=\"zButtonSize()\" [zWave]=\"zWave()\" (click)=\"toggle()\">\n        <span>\n          {{\n            isExpanded()\n              ? zShowLessLabel() || ('i18n_z_ui_show_more_collapse' | translate)\n              : zShowMoreLabel() || ('i18n_z_ui_show_more_expand' | translate)\n          }}\n        </span>\n        <z-icon [zType]=\"isExpanded() ? 'lucideChevronUp' : 'lucideChevronDown'\" zSize=\"16\" class=\"ml-1\" />\n      </button>\n    </div>\n  }\n</div>\n", styles: [".z-show-more-content{will-change:max-height}\n"], dependencies: [{ kind: "component", type: ZButtonComponent, selector: "z-button, button[z-button], a[z-button]", inputs: ["class", "zType", "zSize", "zShape", "zLabel", "zLoading", "zDisabled", "zTypeIcon", "zAnimatedTypeIcon", "zAnimateIcon", "zAnimationTriggerIcon", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZShowMoreComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'z-show-more', imports: [ZButtonComponent, ZIconComponent, TranslatePipe], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        '[class]': 'zClasses()',
+                    }, template: "<div class=\"z-show-more flex h-full min-h-0 w-full flex-col\">\n  <div\n    #contentContainer\n    class=\"z-show-more-content relative min-h-0 flex-1 overflow-hidden transition-[max-height] duration-300 ease-out\"\n    [style.max-height]=\"computedMaxHeight()\">\n    <div #contentInner>\n      <ng-content />\n    </div>\n\n    @if (!isExpanded() && isOverflowing()) {\n      <div\n        class=\"pointer-events-none absolute right-0 bottom-0 left-0 transition-opacity duration-300\"\n        [style]=\"blurGradientStyle()\"></div>\n    }\n  </div>\n\n  @if (isOverflowing() && (zShowLessButton() || !isExpanded())) {\n    <div class=\"z-show-more-actions mt-2 flex justify-center\">\n      <button z-button [zType]=\"zButtonType()\" [zSize]=\"zButtonSize()\" [zWave]=\"zWave()\" (click)=\"toggle()\">\n        <span>\n          {{\n            isExpanded()\n              ? zShowLessLabel() || ('i18n_z_ui_show_more_collapse' | translate)\n              : zShowMoreLabel() || ('i18n_z_ui_show_more_expand' | translate)\n          }}\n        </span>\n        <z-icon [zType]=\"isExpanded() ? 'lucideChevronUp' : 'lucideChevronDown'\" zSize=\"16\" class=\"ml-1\" />\n      </button>\n    </div>\n  }\n</div>\n", styles: [".z-show-more-content{will-change:max-height}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zMaxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMaxHeight", required: false }] }], zShowMoreLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowMoreLabel", required: false }] }], zShowLessLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowLessLabel", required: false }] }], zShowLessButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowLessButton", required: false }] }], zButtonType: [{ type: i0.Input, args: [{ isSignal: true, alias: "zButtonType", required: false }] }], zButtonSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zButtonSize", required: false }] }], zWave: [{ type: i0.Input, args: [{ isSignal: true, alias: "zWave", required: false }] }], zBlurHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "zBlurHeight", required: false }] }], zBlurColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "zBlurColor", required: false }] }], zExpandChange: [{ type: i0.Output, args: ["zExpandChange"] }], _contentContainer: [{ type: i0.ViewChild, args: ['contentContainer', { isSignal: true }] }], _contentInner: [{ type: i0.ViewChild, args: ['contentInner', { isSignal: true }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ZShowMoreComponent };
+//# sourceMappingURL=shival99-z-ui-components-z-show-more.mjs.map

package/fesm2022/shival99-z-ui-components-z-show-more.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"shival99-z-ui-components-z-show-more.mjs","sources":["../../../../libs/core-ui/components/z-show-more/z-show-more.component.ts","../../../../libs/core-ui/components/z-show-more/z-show-more.component.html","../../../../libs/core-ui/components/z-show-more/shival99-z-ui-components-z-show-more.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  DestroyRef,\n  ElementRef,\n  inject,\n  input,\n  signal,\n  viewChild,\n  afterNextRender,\n  ViewEncapsulation,\n  output,\n} from '@angular/core';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent, type ZButtonVariants } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\n\n@Component({\n  selector: 'z-show-more',\n  imports: [ZButtonComponent, ZIconComponent, TranslatePipe],\n  standalone: true,\n  templateUrl: './z-show-more.component.html',\n  styleUrl: './z-show-more.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'zClasses()',\n  },\n})\nexport class ZShowMoreComponent {\n  private readonly _destroyRef = inject(DestroyRef);\n\n  // Inputs\n  public readonly class = input<ClassValue>('');\n  public readonly zMaxHeight = input<number | string>(150);\n  public readonly zShowMoreLabel = input<string | undefined>(undefined);\n  public readonly zShowLessLabel = input<string | undefined>(undefined);\n  public readonly zShowLessButton = input<boolean>(true);\n  public readonly zButtonType = input<ZButtonVariants['zType']>('ghost-primary');\n  public readonly zButtonSize = input<ZButtonVariants['zSize']>('sm');\n  public readonly zWave = input(false, { transform: zTransform });\n  public readonly zBlurHeight = input<number>(64);\n  public readonly zBlurColor = input<string | undefined>(undefined);\n\n  // Outputs\n  public readonly zExpandChange = output<boolean>();\n\n  // Queries\n  private readonly _contentContainer = viewChild<ElementRef<HTMLElement>>('contentContainer');\n  private readonly _contentInner = viewChild<ElementRef<HTMLElement>>('contentInner');\n\n  // State\n  private readonly _isExpanded = signal(false);\n  private readonly _isOverflowing = signal(false);\n  private readonly _scrollHeight = signal(0);\n\n  // Readonly bindings for template\n  protected readonly isExpanded = this._isExpanded.asReadonly();\n  protected readonly isOverflowing = this._isOverflowing.asReadonly();\n\n  protected readonly zClasses = computed(() => zMergeClasses('block w-full', this.class()));\n\n  protected readonly computedMaxHeight = computed(() => {\n    if (!this._isOverflowing()) {\n      return 'none';\n    }\n    if (this._isExpanded()) {\n      return `${this._scrollHeight()}px`;\n    }\n    const maxH = this.zMaxHeight();\n    return typeof maxH === 'number' ? `${maxH}px` : maxH;\n  });\n\n  // Tạo linear gradient mờ dần xuống nền (card/page)\n  protected readonly blurGradientStyle = computed(() => {\n    const bg = this.zBlurColor() || 'var(--card, var(--background, #fff))';\n    return {\n      'background-image': `linear-gradient(to top, ${bg} 0%, transparent 100%)`,\n      height: `${this.zBlurHeight()}px`,\n    };\n  });\n\n  constructor() {\n    afterNextRender(() => {\n      const innerEl = this._contentInner()?.nativeElement;\n      if (!innerEl) {\n        return;\n      }\n\n      // Kiểm tra chiều cao nội dung thực tế so với chiều cao tối đa giới hạn\n      const checkOverflow = () => {\n        const { scrollHeight } = innerEl;\n        this._scrollHeight.set(scrollHeight);\n\n        const maxH = this.zMaxHeight();\n        if (typeof maxH === 'number') {\n          this._isOverflowing.set(scrollHeight > maxH);\n          return;\n        }\n\n        // Nếu zMaxHeight là string (ví dụ: '100%', 'calc(100% - 40px)')\n        const contentEl = this._contentContainer()?.nativeElement;\n        if (!contentEl) {\n          return;\n        }\n\n        // Tạm thời tắt transition để đo chiều cao chính xác mà không bị ảnh hưởng bởi chuyển động\n        const originalTransition = contentEl.style.transition;\n        const originalMaxHeight = contentEl.style.maxHeight;\n\n        contentEl.style.transition = 'none';\n        contentEl.style.maxHeight = maxH;\n\n        // Force reflow để trình duyệt tính toán lại layout\n        const collapsedClientHeight = contentEl.clientHeight;\n\n        // Khôi phục lại trạng thái ban đầu\n        contentEl.style.maxHeight = originalMaxHeight;\n        // Force reflow để tránh giật lag khi phục hồi transition\n        void contentEl.offsetHeight;\n        contentEl.style.transition = originalTransition;\n\n        // Nếu phần tử đang ẩn (display: none) thì bỏ qua\n        if (collapsedClientHeight === 0 && contentEl.offsetWidth === 0) {\n          return;\n        }\n\n        this._isOverflowing.set(scrollHeight > collapsedClientHeight);\n      };\n\n      checkOverflow();\n\n      // Sử dụng ResizeObserver để lắng nghe thay đổi kích thước của phần tử nội dung bên trong\n      const resizeObserver = new ResizeObserver(() => {\n        checkOverflow();\n      });\n\n      resizeObserver.observe(innerEl);\n\n      this._destroyRef.onDestroy(() => {\n        resizeObserver.disconnect();\n      });\n    });\n  }\n\n  protected toggle(): void {\n    const nextState = !this._isExpanded();\n    this._isExpanded.set(nextState);\n    this.zExpandChange.emit(nextState);\n  }\n}\n","<div class=\"z-show-more flex h-full min-h-0 w-full flex-col\">\n  <div\n    #contentContainer\n    class=\"z-show-more-content relative min-h-0 flex-1 overflow-hidden transition-[max-height] duration-300 ease-out\"\n    [style.max-height]=\"computedMaxHeight()\">\n    <div #contentInner>\n      <ng-content />\n    </div>\n\n    @if (!isExpanded() && isOverflowing()) {\n      <div\n        class=\"pointer-events-none absolute right-0 bottom-0 left-0 transition-opacity duration-300\"\n        [style]=\"blurGradientStyle()\"></div>\n    }\n  </div>\n\n  @if (isOverflowing() && (zShowLessButton() || !isExpanded())) {\n    <div class=\"z-show-more-actions mt-2 flex justify-center\">\n      <button z-button [zType]=\"zButtonType()\" [zSize]=\"zButtonSize()\" [zWave]=\"zWave()\" (click)=\"toggle()\">\n        <span>\n          {{\n            isExpanded()\n              ? zShowLessLabel() || ('i18n_z_ui_show_more_collapse' | translate)\n              : zShowMoreLabel() || ('i18n_z_ui_show_more_expand' | translate)\n          }}\n        </span>\n        <z-icon [zType]=\"isExpanded() ? 'lucideChevronUp' : 'lucideChevronDown'\" zSize=\"16\" class=\"ml-1\" />\n      </button>\n    </div>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}