@shival99/z-ui 2.3.4 → 2.3.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/shival99-z-ui-components-z-tabs.mjs +106 -28
- package/fesm2022/shival99-z-ui-components-z-tabs.mjs.map +1 -1
- package/package.json +1 -1
- package/types/shival99-z-ui-components-z-calendar.d.ts +4 -4
- package/types/shival99-z-ui-components-z-gallery.d.ts +4 -4
- package/types/shival99-z-ui-components-z-modal.d.ts +1 -1
- package/types/shival99-z-ui-components-z-popover.d.ts +1 -1
- package/types/shival99-z-ui-components-z-table.d.ts +1 -1
- package/types/shival99-z-ui-components-z-tabs.d.ts +26 -4
- package/types/shival99-z-ui-components-z-toast.d.ts +2 -2
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { NgTemplateOutlet } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { input, inject, TemplateRef, Directive, contentChildren, viewChild, viewChildren, model, output, signal, computed, effect, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
|
+
import { input, inject, TemplateRef, Directive, contentChildren, viewChild, viewChildren, model, output, signal, computed, effect, untracked, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
4
4
|
import { TranslatePipe } from '@ngx-translate/core';
|
|
5
5
|
import { ZButtonComponent } from '@shival99/z-ui/components/z-button';
|
|
6
6
|
import { ZIconComponent } from '@shival99/z-ui/components/z-icon';
|
|
@@ -40,6 +40,26 @@ const zTabsInstanceIds = (() => {
|
|
|
40
40
|
let counter = 0;
|
|
41
41
|
return { next: () => ++counter };
|
|
42
42
|
})();
|
|
43
|
+
/** Queues low-priority panel work on idle time, falling back to a timer where `requestIdleCallback` is missing. */
|
|
44
|
+
function zTabsRequestIdle(task, timeout = 200) {
|
|
45
|
+
if (typeof window === 'undefined') {
|
|
46
|
+
return 0;
|
|
47
|
+
}
|
|
48
|
+
const idle = window.requestIdleCallback;
|
|
49
|
+
return idle ? idle(() => task(), { timeout }) : window.setTimeout(task, 0);
|
|
50
|
+
}
|
|
51
|
+
/** Cancels a handle returned by `zTabsRequestIdle`, regardless of which scheduler produced it. */
|
|
52
|
+
function zTabsCancelIdle(handle) {
|
|
53
|
+
if (!handle || typeof window === 'undefined') {
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
const cancel = window.cancelIdleCallback;
|
|
57
|
+
if (cancel) {
|
|
58
|
+
cancel(handle);
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
61
|
+
window.clearTimeout(handle);
|
|
62
|
+
}
|
|
43
63
|
|
|
44
64
|
const zTabsVariants = cva('z-tabs flex min-w-0', {
|
|
45
65
|
variants: {
|
|
@@ -267,6 +287,8 @@ class ZTabsComponent {
|
|
|
267
287
|
...(ngDevMode ? [{ debugName: "zContentFit" }] : /* istanbul ignore next */ []));
|
|
268
288
|
zLazy = input(false, /* @ts-ignore */
|
|
269
289
|
...(ngDevMode ? [{ debugName: "zLazy" }] : /* istanbul ignore next */ []));
|
|
290
|
+
zPreload = input('hover', /* @ts-ignore */
|
|
291
|
+
...(ngDevMode ? [{ debugName: "zPreload" }] : /* istanbul ignore next */ []));
|
|
270
292
|
zDestroyInactive = input(false, /* @ts-ignore */
|
|
271
293
|
...(ngDevMode ? [{ debugName: "zDestroyInactive" }] : /* istanbul ignore next */ []));
|
|
272
294
|
zTabsOnly = input(false, /* @ts-ignore */
|
|
@@ -275,6 +297,8 @@ class ZTabsComponent {
|
|
|
275
297
|
...(ngDevMode ? [{ debugName: "zShowNavWrapper" }] : /* istanbul ignore next */ []));
|
|
276
298
|
zNavFullWidth = input(false, /* @ts-ignore */
|
|
277
299
|
...(ngDevMode ? [{ debugName: "zNavFullWidth" }] : /* istanbul ignore next */ []));
|
|
300
|
+
zClassContent = input('', /* @ts-ignore */
|
|
301
|
+
...(ngDevMode ? [{ debugName: "zClassContent" }] : /* istanbul ignore next */ []));
|
|
278
302
|
zShowContentWrapper = input(true, /* @ts-ignore */
|
|
279
303
|
...(ngDevMode ? [{ debugName: "zShowContentWrapper" }] : /* istanbul ignore next */ []));
|
|
280
304
|
zReloadable = input(true, /* @ts-ignore */
|
|
@@ -288,8 +312,10 @@ class ZTabsComponent {
|
|
|
288
312
|
activeTab = model('', /* @ts-ignore */
|
|
289
313
|
...(ngDevMode ? [{ debugName: "activeTab" }] : /* istanbul ignore next */ []));
|
|
290
314
|
zTabChange = output();
|
|
291
|
-
|
|
292
|
-
...(ngDevMode ? [{ debugName: "
|
|
315
|
+
mountedTabs = signal(new Set(), /* @ts-ignore */
|
|
316
|
+
...(ngDevMode ? [{ debugName: "mountedTabs" }] : /* istanbul ignore next */ []));
|
|
317
|
+
renderedTab = signal('', /* @ts-ignore */
|
|
318
|
+
...(ngDevMode ? [{ debugName: "renderedTab" }] : /* istanbul ignore next */ []));
|
|
293
319
|
canScrollLeft = signal(false, /* @ts-ignore */
|
|
294
320
|
...(ngDevMode ? [{ debugName: "canScrollLeft" }] : /* istanbul ignore next */ []));
|
|
295
321
|
canScrollRight = signal(false, /* @ts-ignore */
|
|
@@ -302,20 +328,24 @@ class ZTabsComponent {
|
|
|
302
328
|
...(ngDevMode ? [{ debugName: "glideStyle" }] : /* istanbul ignore next */ []));
|
|
303
329
|
glideReady = signal(false, /* @ts-ignore */
|
|
304
330
|
...(ngDevMode ? [{ debugName: "glideReady" }] : /* istanbul ignore next */ []));
|
|
305
|
-
|
|
306
|
-
|
|
331
|
+
/** With `zDestroyInactive` the single rendered panel is the visible one, so it never collapses mid-swap. */
|
|
332
|
+
visiblePanel = computed(() => (this.zDestroyInactive() ? this.renderedTab() : this.activeTab()), /* @ts-ignore */
|
|
333
|
+
...(ngDevMode ? [{ debugName: "visiblePanel" }] : /* istanbul ignore next */ []));
|
|
307
334
|
panelRenderStates = computed(() => new Map(this.tabPanels().map(panel => {
|
|
308
335
|
const tabValue = panel.zTabPanel();
|
|
309
336
|
if (this.zDestroyInactive()) {
|
|
310
|
-
return [tabValue, this.
|
|
337
|
+
return [tabValue, this.renderedTab() === tabValue];
|
|
311
338
|
}
|
|
312
339
|
if (!this.zLazy()) {
|
|
313
340
|
return [tabValue, true];
|
|
314
341
|
}
|
|
315
|
-
return [tabValue, this.
|
|
342
|
+
return [tabValue, this.mountedTabs().has(tabValue)];
|
|
316
343
|
})), /* @ts-ignore */
|
|
317
344
|
...(ngDevMode ? [{ debugName: "panelRenderStates" }] : /* istanbul ignore next */ []));
|
|
318
345
|
_resizeObserver;
|
|
346
|
+
_mountFrame;
|
|
347
|
+
_idleHandle;
|
|
348
|
+
_viewReady = false;
|
|
319
349
|
_cacheInstanceId = zTabsInstanceIds.next();
|
|
320
350
|
constructor() {
|
|
321
351
|
effect(() => {
|
|
@@ -328,17 +358,27 @@ class ZTabsComponent {
|
|
|
328
358
|
this.isGlideType();
|
|
329
359
|
requestAnimationFrame(() => this._updateGlideIndicator());
|
|
330
360
|
});
|
|
361
|
+
effect(() => {
|
|
362
|
+
const active = this.activeTab();
|
|
363
|
+
untracked(() => this._scheduleCommit(active));
|
|
364
|
+
});
|
|
331
365
|
}
|
|
332
366
|
ngOnInit() {
|
|
333
367
|
this._restoreActiveTabFromCache();
|
|
334
368
|
}
|
|
335
369
|
ngAfterViewInit() {
|
|
370
|
+
this._viewReady = true;
|
|
336
371
|
this.checkScroll();
|
|
337
372
|
this._setupResizeObserver();
|
|
338
373
|
requestAnimationFrame(() => this._updateGlideIndicator());
|
|
374
|
+
this._preloadNextIdlePanel();
|
|
339
375
|
}
|
|
340
376
|
ngOnDestroy() {
|
|
341
377
|
this._resizeObserver?.disconnect();
|
|
378
|
+
zTabsCancelIdle(this._idleHandle);
|
|
379
|
+
if (this._mountFrame !== undefined) {
|
|
380
|
+
cancelAnimationFrame(this._mountFrame);
|
|
381
|
+
}
|
|
342
382
|
}
|
|
343
383
|
tabsClasses = computed(() => zMergeClasses(zTabsVariants({
|
|
344
384
|
zType: this.zType(),
|
|
@@ -384,6 +424,8 @@ class ZTabsComponent {
|
|
|
384
424
|
...(ngDevMode ? [{ debugName: "tabsListHasBottomPadding" }] : /* istanbul ignore next */ []));
|
|
385
425
|
verticalTabsScrollable = computed(() => this.zOrientation() === 'vertical' && this.zTabs().length > 8, /* @ts-ignore */
|
|
386
426
|
...(ngDevMode ? [{ debugName: "verticalTabsScrollable" }] : /* istanbul ignore next */ []));
|
|
427
|
+
navClasses = computed(() => zMergeClasses('z-tabs-nav flex items-center gap-1.5', this.zClassContent()), /* @ts-ignore */
|
|
428
|
+
...(ngDevMode ? [{ debugName: "navClasses" }] : /* istanbul ignore next */ []));
|
|
387
429
|
getTabItemClasses(_tab) {
|
|
388
430
|
return zMergeClasses(zTabItemVariants({
|
|
389
431
|
zType: this.zType(),
|
|
@@ -412,20 +454,9 @@ class ZTabsComponent {
|
|
|
412
454
|
}
|
|
413
455
|
}, 320);
|
|
414
456
|
}
|
|
415
|
-
if (!isAlreadyActive && this.isGlideType()) {
|
|
416
|
-
this.glideSquashing.set(true);
|
|
417
|
-
setTimeout(() => this.glideSquashing.set(false), 420);
|
|
418
|
-
}
|
|
419
457
|
if (!isAlreadyActive || this.zEmitOnActiveClick()) {
|
|
420
458
|
this.zTabChange.emit(tab.value);
|
|
421
459
|
}
|
|
422
|
-
if (this.zLazy()) {
|
|
423
|
-
this.loadedTabs.update(tabs => {
|
|
424
|
-
const newTabs = new Set(tabs);
|
|
425
|
-
newTabs.add(tab.value);
|
|
426
|
-
return newTabs;
|
|
427
|
-
});
|
|
428
|
-
}
|
|
429
460
|
if (scrollToView && this.zOrientation() === 'horizontal') {
|
|
430
461
|
requestAnimationFrame(() => {
|
|
431
462
|
const tabIndex = this.zTabs().findIndex(t => t.value === tab.value);
|
|
@@ -454,6 +485,13 @@ class ZTabsComponent {
|
|
|
454
485
|
});
|
|
455
486
|
}
|
|
456
487
|
}
|
|
488
|
+
/** Mounts a panel ahead of its click so the tab transition never pays for the first render. */
|
|
489
|
+
preloadTab(tab) {
|
|
490
|
+
if (this.zPreload() === 'none' || tab.disabled) {
|
|
491
|
+
return;
|
|
492
|
+
}
|
|
493
|
+
zTabsRequestIdle(() => this._mountPanel(tab.value));
|
|
494
|
+
}
|
|
457
495
|
isTabActive(tab) {
|
|
458
496
|
return this.activeTab() === tab.value;
|
|
459
497
|
}
|
|
@@ -525,6 +563,53 @@ class ZTabsComponent {
|
|
|
525
563
|
onTabsScroll() {
|
|
526
564
|
this.checkScroll();
|
|
527
565
|
}
|
|
566
|
+
/**
|
|
567
|
+
* Lets the browser paint the tab-strip transition before the panel subtree is committed, so the
|
|
568
|
+
* swap lands after the animation has started instead of blocking its opening frames.
|
|
569
|
+
*/
|
|
570
|
+
_scheduleCommit(value) {
|
|
571
|
+
if (!value) {
|
|
572
|
+
return;
|
|
573
|
+
}
|
|
574
|
+
if (!this._viewReady || typeof requestAnimationFrame === 'undefined') {
|
|
575
|
+
this._commitPanel(value);
|
|
576
|
+
return;
|
|
577
|
+
}
|
|
578
|
+
this._mountFrame = requestAnimationFrame(() => {
|
|
579
|
+
this._mountFrame = requestAnimationFrame(() => this._commitPanel(value));
|
|
580
|
+
});
|
|
581
|
+
}
|
|
582
|
+
_commitPanel(value) {
|
|
583
|
+
if (this.activeTab() !== value) {
|
|
584
|
+
return;
|
|
585
|
+
}
|
|
586
|
+
this.renderedTab.set(value);
|
|
587
|
+
this._mountPanel(value);
|
|
588
|
+
this._preloadNextIdlePanel();
|
|
589
|
+
}
|
|
590
|
+
_mountPanel(value) {
|
|
591
|
+
if (!this._canMount(value)) {
|
|
592
|
+
return;
|
|
593
|
+
}
|
|
594
|
+
this.mountedTabs.update(tabs => new Set(tabs).add(value));
|
|
595
|
+
this._preloadNextIdlePanel();
|
|
596
|
+
}
|
|
597
|
+
/** Tracked even while `zDestroyInactive` is on, so flipping that input back keeps the visited panels. */
|
|
598
|
+
_canMount(value) {
|
|
599
|
+
return Boolean(value) && this.zLazy() && !this.mountedTabs().has(value);
|
|
600
|
+
}
|
|
601
|
+
/** Warms remaining panels one idle slot at a time so preloading never stalls a single frame. */
|
|
602
|
+
_preloadNextIdlePanel() {
|
|
603
|
+
if (this.zPreload() !== 'idle' || !this.zLazy() || this.zDestroyInactive()) {
|
|
604
|
+
return;
|
|
605
|
+
}
|
|
606
|
+
const next = this.zTabs().find(tab => !tab.disabled && !this.mountedTabs().has(tab.value));
|
|
607
|
+
if (!next) {
|
|
608
|
+
return;
|
|
609
|
+
}
|
|
610
|
+
zTabsCancelIdle(this._idleHandle);
|
|
611
|
+
this._idleHandle = zTabsRequestIdle(() => this._mountPanel(next.value));
|
|
612
|
+
}
|
|
528
613
|
_updateGlideIndicator() {
|
|
529
614
|
if (!this.isGlideType()) {
|
|
530
615
|
this.glideStyle.set(null);
|
|
@@ -570,13 +655,6 @@ class ZTabsComponent {
|
|
|
570
655
|
return;
|
|
571
656
|
}
|
|
572
657
|
this.activeTab.set(tab.value);
|
|
573
|
-
if (this.zLazy()) {
|
|
574
|
-
this.loadedTabs.update(tabs => {
|
|
575
|
-
const newTabs = new Set(tabs);
|
|
576
|
-
newTabs.add(tab.value);
|
|
577
|
-
return newTabs;
|
|
578
|
-
});
|
|
579
|
-
}
|
|
580
658
|
}
|
|
581
659
|
_saveActiveTabToCache(value) {
|
|
582
660
|
if (!this.zCache()) {
|
|
@@ -616,7 +694,7 @@ class ZTabsComponent {
|
|
|
616
694
|
}, 150);
|
|
617
695
|
}
|
|
618
696
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ZTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
619
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: ZTabsComponent, isStandalone: true, selector: "z-tabs", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zTabs: { classPropertyName: "zTabs", publicName: "zTabs", isSignal: true, isRequired: true, transformFunction: null }, zType: { classPropertyName: "zType", publicName: "zType", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zOrientation: { classPropertyName: "zOrientation", publicName: "zOrientation", isSignal: true, isRequired: false, transformFunction: null }, zContentFit: { classPropertyName: "zContentFit", publicName: "zContentFit", isSignal: true, isRequired: false, transformFunction: null }, zLazy: { classPropertyName: "zLazy", publicName: "zLazy", isSignal: true, isRequired: false, transformFunction: null }, zDestroyInactive: { classPropertyName: "zDestroyInactive", publicName: "zDestroyInactive", isSignal: true, isRequired: false, transformFunction: null }, zTabsOnly: { classPropertyName: "zTabsOnly", publicName: "zTabsOnly", isSignal: true, isRequired: false, transformFunction: null }, zShowNavWrapper: { classPropertyName: "zShowNavWrapper", publicName: "zShowNavWrapper", isSignal: true, isRequired: false, transformFunction: null }, zNavFullWidth: { classPropertyName: "zNavFullWidth", publicName: "zNavFullWidth", isSignal: true, isRequired: false, transformFunction: null }, zShowContentWrapper: { classPropertyName: "zShowContentWrapper", publicName: "zShowContentWrapper", isSignal: true, isRequired: false, transformFunction: null }, zReloadable: { classPropertyName: "zReloadable", publicName: "zReloadable", isSignal: true, isRequired: false, transformFunction: null }, zEmitOnActiveClick: { classPropertyName: "zEmitOnActiveClick", publicName: "zEmitOnActiveClick", isSignal: true, isRequired: false, transformFunction: null }, zCache: { classPropertyName: "zCache", publicName: "zCache", isSignal: true, isRequired: false, transformFunction: null }, zCacheKey: { classPropertyName: "zCacheKey", publicName: "zCacheKey", isSignal: true, isRequired: false, transformFunction: null }, activeTab: { classPropertyName: "activeTab", publicName: "activeTab", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeTab: "activeTabChange", zTabChange: "zTabChange" }, host: { classAttribute: "z-tabs-wrapper block" }, queries: [{ propertyName: "tabPanels", predicate: ZTabPanelDirective, isSignal: true }], viewQueries: [{ propertyName: "tabsListContainer", first: true, predicate: ["tabsListContainer"], descendants: true, isSignal: true }, { propertyName: "tabButtons", predicate: ["tabButton"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n class=\"z-tabs-container flex gap-1\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-content-fit]=\"zContentFit()\"\n [class.flex-col]=\"!zTabsOnly()\"\n [class.flex-row]=\"zOrientation() === 'vertical'\"\n [class.gap-4]=\"zOrientation() === 'vertical'\">\n <!-- Tabs Navigation (Left/Scroll/Tabs/Right/Dropdown) -->\n <div\n class=\"z-tabs-nav flex items-center gap-1.5\"\n [class.z-tabs-nav-surface]=\"zShowNavWrapper() && isGlideType()\"\n [class.w-full]=\"zOrientation() === 'horizontal' && (!zShowNavWrapper() || zNavFullWidth())\"\n [class.w-fit]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.max-w-full]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.w-auto]=\"zOrientation() === 'vertical'\"\n [class.shrink-0]=\"zOrientation() === 'vertical'\">\n <!-- Scroll Left Button -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n [zWave]=\"false\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollLeft()\"\n aria-label=\"Scroll left\">\n <z-icon zType=\"lucideChevronLeft\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Tabs List Container with Scroll + Fade -->\n <div\n class=\"z-tabs-scroll-container relative min-w-0 flex-1\"\n [class.z-tabs-scroll-container-surface]=\"canScrollLeft() || canScrollRight()\"\n [attr.data-type]=\"zType()\">\n @if (zOrientation() === 'vertical') {\n <ng-scrollbar\n class=\"z-tabs-scroll-wrapper z-tabs-scrollbar vertical\"\n [class.z-tabs-scroll-wrapper-limited]=\"verticalTabsScrollable()\"\n track=\"vertical\"\n orientation=\"vertical\"\n appearance=\"compact\"\n visibility=\"hover\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </ng-scrollbar>\n } @else {\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.z-tabs-scroll-wrapper-scrollable]=\"canScrollLeft() || canScrollRight()\"\n [class.z-tabs-scroll-wrapper-fade-left]=\"canScrollLeft()\"\n [class.z-tabs-scroll-wrapper-fade-right]=\"canScrollRight()\"\n (scroll)=\"onTabsScroll()\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </div>\n }\n </div>\n\n <!-- Scroll Right Button -->\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollRight()\"\n [zWave]=\"false\"\n aria-label=\"Scroll right\">\n <z-icon zType=\"lucideChevronRight\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Dropdown Button (Mobile or Overflow) -->\n @if (zOrientation() === 'horizontal' && (canScrollLeft() || canScrollRight())) {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[6.25rem] max-w-[12.5rem]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <ng-template #tabsListTpl>\n <!-- Tab List -->\n <div\n [class]=\"tabsClasses()\"\n [class.pb-0.5]=\"tabsListHasBottomPadding()\"\n role=\"tablist\"\n [attr.aria-orientation]=\"zOrientation()\"\n [attr.data-type]=\"zType()\">\n @if (isGlideType() && glideStyle(); as style) {\n <div\n class=\"z-tabs-glide-indicator pointer-events-none absolute top-0 left-0 z-[6]\"\n [class.z-tabs-glide-indicator-ready]=\"glideReady()\"\n [attr.data-type]=\"zType()\"\n [style.transform]=\"style.transform\"\n [style.width]=\"style.width\"\n [style.height]=\"style.height\"\n aria-hidden=\"true\">\n <div class=\"z-tabs-glide-indicator-fill\" [class.z-tabs-glide-indicator-squash]=\"glideSquashing()\"></div>\n </div>\n }\n @for (tab of zTabs(); track tab.value; let idx = $index; let last = $last) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.data-state]=\"isTabActive(tab) ? 'active' : 'inactive'\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-last]=\"last\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n z-tooltip\n [zContent]=\"zOrientation() === 'vertical' ? (tab.label | translate) : ''\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n (click)=\"selectTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon\n [zType]=\"tab.icon\"\n zSize=\"16\"\n class=\"shrink-0\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\" />\n }\n <span\n class=\"z-tab-item-label min-w-0 flex-1 truncate text-left\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"ring-background ml-1.5 inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold ring-2\"\n [class.bg-primary]=\"zType() !== 'badge'\"\n [class.text-primary-foreground]=\"zType() !== 'badge'\"\n [class.bg-primary!]=\"zType() === 'badge'\"\n [class.text-primary-foreground!]=\"zType() === 'badge'\">\n {{ tab.badge }}\n </span>\n }\n </button>\n }\n </div>\n </ng-template>\n\n <!-- Tab Panels -->\n @if (!zTabsOnly()) {\n <div\n class=\"z-tabs-panels min-h-0\"\n [class.flex-1]=\"zOrientation() === 'vertical'\"\n [class.shadow-xs]=\"contentWrapperFramed()\"\n [class.z-tabs-panels-unwrapped]=\"!contentWrapperFramed()\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (panelRenderStates().get(panel.zTabPanel())) {\n <div\n role=\"tabpanel\"\n [id]=\"'panel-' + panel.zTabPanel()\"\n [attr.aria-labelledby]=\"panel.zTabPanel()\"\n [hidden]=\"activeTab() !== panel.zTabPanel()\">\n <ng-container *ngTemplateOutlet=\"panel.template\" />\n </div>\n }\n }\n </div>\n }\n</div>\n\n<!-- Dropdown Menu Template -->\n<ng-template #dropdownTpl let-close=\"close\">\n <div\n class=\"z-tabs-dropdown-menu flex max-h-[18.75rem] max-w-[12.5rem] min-w-[6.25rem] flex-col gap-0.5 overflow-y-auto p-1\">\n @for (tab of zTabs(); track tab.value) {\n <button\n #dropdownItem\n type=\"button\"\n class=\"flex w-full cursor-pointer items-center justify-start gap-2 rounded-sm px-2 py-1.5 text-left text-sm font-medium transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:text-foreground]=\"!isTabActive(tab)\"\n [class.focus:bg-primary/10]=\"!isTabActive(tab)\"\n [class.bg-primary/15]=\"isTabActive(tab)\"\n [class.text-primary]=\"isTabActive(tab)\"\n [disabled]=\"tab.disabled\"\n (click)=\"selectTab(tab, true); close()\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"min-w-0 flex-1 truncate\"\n z-tooltip\n [zContent]=\"tab.label | translate\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n [zTriggerElement]=\"dropdownItem\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold\">\n {{ tab.badge }}\n </span>\n }\n @if (isTabActive(tab)) {\n <z-icon zType=\"lucideCheck\" zSize=\"16\" class=\"text-primary shink-0\" />\n }\n </button>\n }\n </div>\n</ng-template>\n", styles: [".z-tabs-scroll-wrapper{overflow-x:clip;overflow-y:visible;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}.z-tabs-scroll-wrapper::-webkit-scrollbar{display:none}.z-tabs-scroll-wrapper.vertical{max-height:var(--z-tabs-vertical-max-height, min(22rem, 60vh));overflow:hidden auto}.z-tabs-scroll-wrapper.vertical.z-tabs-scroll-wrapper-limited{height:var(--z-tabs-vertical-max-height, min(22rem, 60vh));overflow:hidden auto}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-scrollable{overflow-x:auto}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-left{mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black 100%)}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-right{mask-image:linear-gradient(to left,transparent 0,black var(--z-tabs-fade-width),black 100%);-webkit-mask-image:linear-gradient(to left,transparent 0,black var(--z-tabs-fade-width),black 100%)}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-left.z-tabs-scroll-wrapper-fade-right{mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black calc(100% - var(--z-tabs-fade-width)),transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black calc(100% - var(--z-tabs-fade-width)),transparent 100%)}.z-tabs-scrollbar{--scrollbar-padding: .125rem;--z-tabs-scrollbar-gutter: .75rem;--scrollbar-track-color: transparent;--scrollbar-thumb-color: color-mix(in oklab, var(--muted-foreground) 35%, transparent);--scrollbar-thumb-hover-color: color-mix(in oklab, var(--muted-foreground) 55%, transparent);--scrollbar-size: .375rem;display:block}.z-tabs-scrollbar .ng-scroll-viewport,.z-tabs-scrollbar .ng-scroll-content{max-width:100%}.z-tabs-scrollbar.z-tabs-scroll-wrapper-limited .ng-scroll-viewport{height:100%;max-height:100%}.z-tabs-scrollbar .ng-scroll-content{box-sizing:border-box;padding-right:var(--z-tabs-scrollbar-gutter)}.z-tabs-scroll-container{isolation:isolate;--z-tabs-fade-width: 2rem}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{background:color-mix(in oklab,var(--background) 72%,var(--muted));border:.0625rem solid color-mix(in oklab,var(--background) 88%,var(--border));box-shadow:0 .0625rem .1875rem #0000000f,0 .125rem .5rem #00000014;backdrop-filter:blur(.75rem) saturate(140%);-webkit-backdrop-filter:blur(.75rem) saturate(140%)}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface .z-tabs{background:transparent}.z-tabs-container:is([data-type=segment],[data-type=segment-solid]) .z-tabs-scroll-container-surface{border-radius:.5rem;overflow:hidden}.z-tabs-container:is([data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{border-radius:9999px;overflow:hidden}.dark .z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{background:color-mix(in oklab,var(--muted) 35%,transparent);border-color:color-mix(in oklab,var(--border) 65%,transparent);box-shadow:0 .0625rem .1875rem #0000002e,0 .125rem .5rem #0000003d}.z-tabs{align-items:stretch;min-height:2.5rem}.z-tabs.flex-col{width:100%}.z-tabs.flex-col.border-r{border-right:.0625rem solid hsl(var(--border));padding-right:.5rem}.z-tabs-nav-control{transition:color .2s ease,background-color .2s ease,border-color .2s ease}.z-tabs-nav-surface{background:color-mix(in oklab,var(--background) 72%,var(--muted));border:.0625rem solid color-mix(in oklab,var(--background) 88%,var(--border));border-radius:.5rem;padding:.125rem;box-shadow:0 .0625rem .1875rem #0000000f,0 .125rem .5rem #00000014;backdrop-filter:blur(.75rem) saturate(140%);-webkit-backdrop-filter:blur(.75rem) saturate(140%)}.z-tabs-nav-surface .z-tabs{background:transparent}.dark .z-tabs-nav-surface{background:color-mix(in oklab,var(--muted) 35%,transparent);border-color:color-mix(in oklab,var(--border) 65%,transparent);box-shadow:0 .0625rem .1875rem #0000002e,0 .125rem .5rem #0000003d}.z-tab-item{-webkit-tap-highlight-color:transparent;position:relative}.z-tab-item[data-active=true]{position:relative}.z-tab-item:disabled{pointer-events:none}.z-tabs-panels{border:.0625rem solid var(--border);border-radius:var(--radius-xs);padding:1rem}.z-tabs-panels [role=tabpanel]{animation:z-tabs-fade-in .2s ease-in-out}.z-tabs-panels [role=tabpanel][hidden]{display:none}.z-tabs-panels-unwrapped{border:0;border-radius:0;padding:0}.z-tabs-wrapper .z-tabs.flex-row+.z-tabs-panels{margin-top:.875rem}.z-tabs-wrapper .z-tabs.flex-col+.z-tabs-panels{margin-top:0;margin-left:0}.z-tabs-container[data-orientation=horizontal]{gap:0}.z-tabs-container[data-orientation=horizontal] .z-tabs-scroll-container{z-index:1}.z-tabs-container[data-orientation=horizontal] .z-tabs-panels{margin-top:0}.z-tabs-container[data-content-fit=screen]{height:var(--z-tabs-screen-height, calc(100dvh - var(--z-tabs-screen-offset, 0rem)));max-height:var(--z-tabs-screen-height, calc(100dvh - var(--z-tabs-screen-offset, 0rem)));min-height:0;overflow:hidden}.z-tabs-container[data-content-fit=screen] .z-tabs-nav{flex:none;min-height:0}.z-tabs-container[data-content-fit=screen] .z-tabs-panels{flex:1 1 auto;min-height:0;overflow:auto}.z-tabs-container[data-content-fit=screen] [role=tabpanel]{min-height:0}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs{isolation:isolate;position:relative}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs .z-tab-item[data-active=true]{z-index:1}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs .z-tab-item[data-active=true]:after{z-index:1}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs:after{content:\"\";position:absolute;right:0;bottom:0;left:0;height:.0625rem;background:color-mix(in oklab,var(--border) 80%,transparent);pointer-events:none;z-index:0}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-scroll-wrapper{padding-inline:0}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-panels{border-radius:0 0 var(--radius-xs) var(--radius-xs)}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-panels-unwrapped{border:0;border-radius:0}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-nav{position:relative}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-nav:after{content:\"\";position:absolute;right:0;bottom:0;left:0;height:.0625rem;background:var(--border);pointer-events:none;z-index:0}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-panels{border-top:0}.z-tabs-container[data-type=folder-solid][data-orientation=horizontal] .z-tab-item[data-active=true][data-last=true]{box-shadow:inset .0625rem 0 0 var(--primary),inset -.0625rem 0 0 var(--border),inset 0 .0625rem 0 var(--primary)}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs{align-items:center}.z-tabs-glide-indicator{transition:none;will-change:transform,width,height}.z-tabs-glide-indicator.z-tabs-glide-indicator-ready{transition:transform .42s cubic-bezier(.3,1.1,.38,1),width .42s cubic-bezier(.3,1.1,.38,1),height .42s cubic-bezier(.3,1.1,.38,1)}.z-tabs-glide-indicator[data-type=segment] .z-tabs-glide-indicator-fill{border-radius:.3125rem;background:var(--background);box-shadow:0 .0625rem .1875rem #00000014,0 .0625rem .125rem #0000000f}.z-tabs-glide-indicator[data-type=segment-solid] .z-tabs-glide-indicator-fill{border-radius:.3125rem;background:var(--primary);box-shadow:0 .0625rem .1875rem #00000014,0 .0625rem .125rem #0000000f}.z-tabs-glide-indicator[data-type=pill-solid] .z-tabs-glide-indicator-fill{border-radius:9999px;background:var(--background);box-shadow:0 .0625rem .1875rem #00000014,0 .0625rem .125rem #0000000f}.z-tabs-glide-indicator[data-type=pill-blur] .z-tabs-glide-indicator-fill{border-radius:9999px;background:linear-gradient(to bottom,color-mix(in oklab,white 22%,transparent) 0%,color-mix(in oklab,white 6%,transparent) 45%,transparent 100%),color-mix(in oklab,var(--background) 55%,transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab,white 25%,transparent),inset 0 .0625rem color-mix(in oklab,white 45%,transparent),0 .125rem .5rem #0000001a,0 .0625rem .125rem #0000000f;backdrop-filter:blur(.75rem) saturate(180%);-webkit-backdrop-filter:blur(.75rem) saturate(180%)}.dark .z-tabs-glide-indicator[data-type=pill-blur] .z-tabs-glide-indicator-fill{background:linear-gradient(to bottom,color-mix(in oklab,white 12%,transparent) 0%,color-mix(in oklab,white 3%,transparent) 45%,transparent 100%),color-mix(in oklab,var(--background) 45%,transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab,white 10%,transparent),inset 0 .0625rem color-mix(in oklab,white 16%,transparent),0 .125rem .5rem #00000059,0 .0625rem .125rem #0003}.z-tabs-glide-indicator-fill{position:absolute;inset:0;transform-origin:center}@keyframes z-tabs-glide-squash{0%{transform:scaleY(1)}45%{transform:scaleY(.94)}75%{transform:scaleY(1.015)}to{transform:scaleY(1)}}.z-tabs-glide-indicator-squash{animation:z-tabs-glide-squash .36s ease-out}@keyframes z-tab-icon-bounce{0%{transform:scale(1)}35%{transform:scale(.97)}to{transform:scale(1)}}.z-tab-icon-bounce{animation:z-tab-icon-bounce .32s cubic-bezier(.34,1.56,.64,1)}.z-tabs-container[data-orientation=vertical] .z-tabs-nav{align-items:stretch}.z-tabs-container[data-orientation=vertical] .z-tabs-scroll-container{width:min(12rem,40vw);flex:none}.z-tabs-container[data-orientation=vertical] .z-tabs-panels,.z-tabs-container[data-orientation=vertical] .z-tab-item{min-width:0}@media(prefers-reduced-motion:reduce){.z-tab-item,.z-tabs-nav-control{transition:none!important}.z-tabs-scroll-wrapper{scroll-behavior:auto}.z-tabs-panels [role=tabpanel]{animation:none!important}.z-tabs-glide-indicator.z-tabs-glide-indicator-ready{transition:none!important}.z-tab-icon-bounce,.z-tabs-glide-indicator-squash{animation:none!important}}@keyframes z-tabs-fade-in{0%{opacity:0;transform:translateY(-.2rem)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { 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: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTooltipPosition", "zTrigger", "zTooltipTrigger", "zTooltipType", "zTooltipSize", "zClass", "zTooltipClass", "zShowDelay", "zTooltipShowDelay", "zHideDelay", "zTooltipHideDelay", "zArrow", "zTooltipArrow", "zDisabled", "zTooltipDisabled", "zOffset", "zTooltipOffset", "zAutoDetect", "zTriggerElement", "zAlwaysShow", "zMaxWidth"], outputs: ["zShow", "zHide"], exportAs: ["zTooltip"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zPopoverTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zTriggerRef", "zManualClose", "zOutsideClickClose", "zScrollClose", "zSticky", "zShowArrow", "zKeyboardSafe"], outputs: ["zShow", "zHide", "zHideStart", "zControl", "zPositionChange", "zOutsideClick"], exportAs: ["zPopover"] }, { kind: "component", type: NgScrollbar, selector: "ng-scrollbar:not([externalViewport]), [ngScrollbar]", exportAs: ["ngScrollbar"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
697
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: ZTabsComponent, isStandalone: true, selector: "z-tabs", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zTabs: { classPropertyName: "zTabs", publicName: "zTabs", isSignal: true, isRequired: true, transformFunction: null }, zType: { classPropertyName: "zType", publicName: "zType", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zOrientation: { classPropertyName: "zOrientation", publicName: "zOrientation", isSignal: true, isRequired: false, transformFunction: null }, zContentFit: { classPropertyName: "zContentFit", publicName: "zContentFit", isSignal: true, isRequired: false, transformFunction: null }, zLazy: { classPropertyName: "zLazy", publicName: "zLazy", isSignal: true, isRequired: false, transformFunction: null }, zPreload: { classPropertyName: "zPreload", publicName: "zPreload", isSignal: true, isRequired: false, transformFunction: null }, zDestroyInactive: { classPropertyName: "zDestroyInactive", publicName: "zDestroyInactive", isSignal: true, isRequired: false, transformFunction: null }, zTabsOnly: { classPropertyName: "zTabsOnly", publicName: "zTabsOnly", isSignal: true, isRequired: false, transformFunction: null }, zShowNavWrapper: { classPropertyName: "zShowNavWrapper", publicName: "zShowNavWrapper", isSignal: true, isRequired: false, transformFunction: null }, zNavFullWidth: { classPropertyName: "zNavFullWidth", publicName: "zNavFullWidth", isSignal: true, isRequired: false, transformFunction: null }, zClassContent: { classPropertyName: "zClassContent", publicName: "zClassContent", isSignal: true, isRequired: false, transformFunction: null }, zShowContentWrapper: { classPropertyName: "zShowContentWrapper", publicName: "zShowContentWrapper", isSignal: true, isRequired: false, transformFunction: null }, zReloadable: { classPropertyName: "zReloadable", publicName: "zReloadable", isSignal: true, isRequired: false, transformFunction: null }, zEmitOnActiveClick: { classPropertyName: "zEmitOnActiveClick", publicName: "zEmitOnActiveClick", isSignal: true, isRequired: false, transformFunction: null }, zCache: { classPropertyName: "zCache", publicName: "zCache", isSignal: true, isRequired: false, transformFunction: null }, zCacheKey: { classPropertyName: "zCacheKey", publicName: "zCacheKey", isSignal: true, isRequired: false, transformFunction: null }, activeTab: { classPropertyName: "activeTab", publicName: "activeTab", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeTab: "activeTabChange", zTabChange: "zTabChange" }, host: { classAttribute: "z-tabs-wrapper block" }, queries: [{ propertyName: "tabPanels", predicate: ZTabPanelDirective, isSignal: true }], viewQueries: [{ propertyName: "tabsListContainer", first: true, predicate: ["tabsListContainer"], descendants: true, isSignal: true }, { propertyName: "tabButtons", predicate: ["tabButton"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n class=\"z-tabs-container flex gap-1\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-content-fit]=\"zContentFit()\"\n [class.flex-col]=\"!zTabsOnly()\"\n [class.flex-row]=\"zOrientation() === 'vertical'\"\n [class.gap-4]=\"zOrientation() === 'vertical'\">\n <!-- Tabs Navigation (Left/Scroll/Tabs/Right/Dropdown) -->\n <div\n [class]=\"navClasses()\"\n [class.z-tabs-nav-surface]=\"zShowNavWrapper() && isGlideType()\"\n [class.w-full]=\"zOrientation() === 'horizontal' && (!zShowNavWrapper() || zNavFullWidth())\"\n [class.w-fit]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.max-w-full]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.w-auto]=\"zOrientation() === 'vertical'\"\n [class.shrink-0]=\"zOrientation() === 'vertical'\">\n <!-- Scroll Left Button -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n [zWave]=\"false\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollLeft()\"\n aria-label=\"Scroll left\">\n <z-icon zType=\"lucideChevronLeft\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Tabs List Container with Scroll + Fade -->\n <div\n class=\"z-tabs-scroll-container relative min-w-0 flex-1\"\n [class.z-tabs-scroll-container-surface]=\"canScrollLeft() || canScrollRight()\"\n [attr.data-type]=\"zType()\">\n @if (zOrientation() === 'vertical') {\n <ng-scrollbar\n class=\"z-tabs-scroll-wrapper z-tabs-scrollbar vertical\"\n [class.z-tabs-scroll-wrapper-limited]=\"verticalTabsScrollable()\"\n track=\"vertical\"\n orientation=\"vertical\"\n appearance=\"compact\"\n visibility=\"hover\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </ng-scrollbar>\n } @else {\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.z-tabs-scroll-wrapper-scrollable]=\"canScrollLeft() || canScrollRight()\"\n [class.z-tabs-scroll-wrapper-fade-left]=\"canScrollLeft()\"\n [class.z-tabs-scroll-wrapper-fade-right]=\"canScrollRight()\"\n (scroll)=\"onTabsScroll()\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </div>\n }\n </div>\n\n <!-- Scroll Right Button -->\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollRight()\"\n [zWave]=\"false\"\n aria-label=\"Scroll right\">\n <z-icon zType=\"lucideChevronRight\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Dropdown Button (Mobile or Overflow) -->\n @if (zOrientation() === 'horizontal' && (canScrollLeft() || canScrollRight())) {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[6.25rem] max-w-[12.5rem]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <ng-template #tabsListTpl>\n <!-- Tab List -->\n <div\n [class]=\"tabsClasses()\"\n [class.pb-0.5]=\"tabsListHasBottomPadding()\"\n role=\"tablist\"\n [attr.aria-orientation]=\"zOrientation()\"\n [attr.data-type]=\"zType()\">\n @if (isGlideType() && glideStyle(); as style) {\n <div\n class=\"z-tabs-glide-indicator pointer-events-none absolute top-0 left-0 z-[6]\"\n [class.z-tabs-glide-indicator-ready]=\"glideReady()\"\n [attr.data-type]=\"zType()\"\n [style.transform]=\"style.transform\"\n [style.width]=\"style.width\"\n [style.height]=\"style.height\"\n aria-hidden=\"true\"></div>\n }\n @for (tab of zTabs(); track tab.value; let idx = $index; let last = $last) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.data-state]=\"isTabActive(tab) ? 'active' : 'inactive'\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-last]=\"last\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n z-tooltip\n [zContent]=\"zOrientation() === 'vertical' ? (tab.label | translate) : ''\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n (click)=\"selectTab(tab)\"\n (pointerenter)=\"preloadTab(tab)\"\n (focus)=\"preloadTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon\n [zType]=\"tab.icon\"\n zSize=\"16\"\n class=\"shrink-0\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\" />\n }\n <span\n class=\"z-tab-item-label min-w-0 flex-1 truncate text-left\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"ring-background ml-1.5 inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold ring-2\"\n [class.bg-primary]=\"zType() !== 'badge'\"\n [class.text-primary-foreground]=\"zType() !== 'badge'\"\n [class.bg-primary!]=\"zType() === 'badge'\"\n [class.text-primary-foreground!]=\"zType() === 'badge'\">\n {{ tab.badge }}\n </span>\n }\n </button>\n }\n </div>\n </ng-template>\n\n <!-- Tab Panels -->\n @if (!zTabsOnly()) {\n <div\n class=\"z-tabs-panels min-h-0\"\n [class.flex-1]=\"zOrientation() === 'vertical'\"\n [class.shadow-xs]=\"contentWrapperFramed()\"\n [class.z-tabs-panels-unwrapped]=\"!contentWrapperFramed()\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (panelRenderStates().get(panel.zTabPanel())) {\n <div\n role=\"tabpanel\"\n [id]=\"'panel-' + panel.zTabPanel()\"\n [attr.aria-labelledby]=\"panel.zTabPanel()\"\n [attr.data-state]=\"visiblePanel() === panel.zTabPanel() ? 'active' : 'inactive'\"\n [attr.inert]=\"visiblePanel() === panel.zTabPanel() ? null : ''\">\n <ng-container *ngTemplateOutlet=\"panel.template\" />\n </div>\n }\n }\n </div>\n }\n</div>\n\n<!-- Dropdown Menu Template -->\n<ng-template #dropdownTpl let-close=\"close\">\n <div\n class=\"z-tabs-dropdown-menu flex max-h-[18.75rem] max-w-[12.5rem] min-w-[6.25rem] flex-col gap-0.5 overflow-y-auto p-1\">\n @for (tab of zTabs(); track tab.value) {\n <button\n #dropdownItem\n type=\"button\"\n class=\"flex w-full cursor-pointer items-center justify-start gap-2 rounded-sm px-2 py-1.5 text-left text-sm font-medium transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:text-foreground]=\"!isTabActive(tab)\"\n [class.focus:bg-primary/10]=\"!isTabActive(tab)\"\n [class.bg-primary/15]=\"isTabActive(tab)\"\n [class.text-primary]=\"isTabActive(tab)\"\n [disabled]=\"tab.disabled\"\n (pointerenter)=\"preloadTab(tab)\"\n (click)=\"selectTab(tab, true); close()\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"min-w-0 flex-1 truncate\"\n z-tooltip\n [zContent]=\"tab.label | translate\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n [zTriggerElement]=\"dropdownItem\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold\">\n {{ tab.badge }}\n </span>\n }\n @if (isTabActive(tab)) {\n <z-icon zType=\"lucideCheck\" zSize=\"16\" class=\"text-primary shink-0\" />\n }\n </button>\n }\n </div>\n</ng-template>\n", styles: [".z-tabs-scroll-wrapper{overflow-x:clip;overflow-y:visible;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}.z-tabs-scroll-wrapper::-webkit-scrollbar{display:none}.z-tabs-scroll-wrapper.vertical{max-height:var(--z-tabs-vertical-max-height, min(22rem, 60vh));overflow:hidden auto}.z-tabs-scroll-wrapper.vertical.z-tabs-scroll-wrapper-limited{height:var(--z-tabs-vertical-max-height, min(22rem, 60vh));overflow:hidden auto}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-scrollable{overflow-x:auto}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-left{mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black 100%)}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-right{mask-image:linear-gradient(to left,transparent 0,black var(--z-tabs-fade-width),black 100%);-webkit-mask-image:linear-gradient(to left,transparent 0,black var(--z-tabs-fade-width),black 100%)}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-left.z-tabs-scroll-wrapper-fade-right{mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black calc(100% - var(--z-tabs-fade-width)),transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black calc(100% - var(--z-tabs-fade-width)),transparent 100%)}.z-tabs-scrollbar{--scrollbar-padding: .125rem;--z-tabs-scrollbar-gutter: .75rem;--scrollbar-track-color: transparent;--scrollbar-thumb-color: color-mix(in oklab, var(--muted-foreground) 35%, transparent);--scrollbar-thumb-hover-color: color-mix(in oklab, var(--muted-foreground) 55%, transparent);--scrollbar-size: .375rem;display:block}.z-tabs-scrollbar .ng-scroll-viewport,.z-tabs-scrollbar .ng-scroll-content{max-width:100%}.z-tabs-scrollbar.z-tabs-scroll-wrapper-limited .ng-scroll-viewport{height:100%;max-height:100%}.z-tabs-scrollbar .ng-scroll-content{box-sizing:border-box;padding-right:var(--z-tabs-scrollbar-gutter)}.z-tabs-scroll-container{isolation:isolate;--z-tabs-fade-width: 2rem}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{background:color-mix(in oklab,var(--background) 72%,var(--muted));border:.0625rem solid color-mix(in oklab,var(--background) 88%,var(--border));box-shadow:0 .0625rem .1875rem #0000000f,0 .125rem .5rem #00000014;backdrop-filter:blur(.75rem) saturate(140%);-webkit-backdrop-filter:blur(.75rem) saturate(140%)}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface .z-tabs{background:transparent}.z-tabs-container:is([data-type=segment],[data-type=segment-solid]) .z-tabs-scroll-container-surface{border-radius:.5rem;overflow:hidden}.z-tabs-container:is([data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{border-radius:9999px;overflow:hidden}.dark .z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{background:color-mix(in oklab,var(--muted) 35%,transparent);border-color:color-mix(in oklab,var(--border) 65%,transparent);box-shadow:0 .0625rem .1875rem #0000002e,0 .125rem .5rem #0000003d}.z-tabs{align-items:stretch;min-height:2.5rem}.z-tabs.flex-col{width:100%}.z-tabs.flex-col.border-r{border-right:.0625rem solid hsl(var(--border));padding-right:.5rem}.z-tabs-nav-control{transition:color .2s ease,background-color .2s ease,border-color .2s ease}.z-tabs-nav-surface{background:color-mix(in oklab,var(--background) 72%,var(--muted));border:.0625rem solid color-mix(in oklab,oklch(95% 0 0deg) 88%,var(--border));border-radius:.5rem;padding:.125rem;box-shadow:0 .0625rem .1875rem #0000000f,0 .125rem .5rem #00000014;backdrop-filter:blur(.75rem) saturate(140%);-webkit-backdrop-filter:blur(.75rem) saturate(140%)}.z-tabs-nav-surface .z-tabs{background:transparent}.z-tabs-container:is([data-type=pill-solid],[data-type=pill-blur]) .z-tabs-nav-surface{border-radius:9999px}.dark .z-tabs-nav-surface{background:color-mix(in oklab,var(--muted) 35%,transparent);border-color:color-mix(in oklab,var(--border) 65%,transparent);box-shadow:0 .0625rem .1875rem #0000002e,0 .125rem .5rem #0000003d}.z-tab-item{-webkit-tap-highlight-color:transparent;position:relative}.z-tab-item[data-active=true]{position:relative}.z-tab-item:disabled{pointer-events:none}.z-tabs-panels{border:.0625rem solid var(--border);border-radius:var(--radius-xs);padding:1rem}.z-tabs-panels [role=tabpanel][data-state=active]{animation:z-tabs-fade-in .2s ease-in-out}.z-tabs-panels [role=tabpanel][data-state=inactive]{content-visibility:hidden}@supports not (content-visibility: hidden){.z-tabs-panels [role=tabpanel][data-state=inactive]{display:none}}.z-tabs-panels-unwrapped{border:0;border-radius:0;padding:0}.z-tabs-wrapper .z-tabs.flex-row+.z-tabs-panels{margin-top:.875rem}.z-tabs-wrapper .z-tabs.flex-col+.z-tabs-panels{margin-top:0;margin-left:0}.z-tabs-container[data-orientation=horizontal]{gap:0}.z-tabs-container[data-orientation=horizontal] .z-tabs-scroll-container{z-index:1}.z-tabs-container[data-orientation=horizontal] .z-tabs-panels{margin-top:0}.z-tabs-container[data-content-fit=screen]{height:var(--z-tabs-screen-height, calc(100dvh - var(--z-tabs-screen-offset, 0rem)));max-height:var(--z-tabs-screen-height, calc(100dvh - var(--z-tabs-screen-offset, 0rem)));min-height:0;overflow:hidden}.z-tabs-container[data-content-fit=screen] .z-tabs-nav{flex:none;min-height:0}.z-tabs-container[data-content-fit=screen] .z-tabs-panels{flex:1 1 auto;min-height:0;overflow:auto}.z-tabs-container[data-content-fit=screen] [role=tabpanel]{min-height:0}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs{isolation:isolate;position:relative}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs .z-tab-item[data-active=true]{z-index:1}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs .z-tab-item[data-active=true]:after{z-index:1}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs:after{content:\"\";position:absolute;right:0;bottom:0;left:0;height:.0625rem;background:color-mix(in oklab,var(--border) 80%,transparent);pointer-events:none;z-index:0}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-scroll-wrapper{padding-inline:0}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-panels{border-radius:0 0 var(--radius-xs) var(--radius-xs)}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-panels-unwrapped{border:0;border-radius:0}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-nav{position:relative}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-nav:after{content:\"\";position:absolute;right:0;bottom:0;left:0;height:.0625rem;background:var(--border);pointer-events:none;z-index:0}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-panels{border-top:0}.z-tabs-container[data-type=folder-solid][data-orientation=horizontal] .z-tab-item[data-active=true][data-last=true]{box-shadow:inset .0625rem 0 0 var(--primary),inset -.0625rem 0 0 var(--border),inset 0 .0625rem 0 var(--primary)}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs{align-items:center}.z-tabs-glide-indicator{transition:none;will-change:transform,width,height}.z-tabs-glide-indicator[data-type=segment],.z-tabs-glide-indicator[data-type=segment-solid]{border-radius:.3125rem;overflow:hidden;background:var(--background);box-shadow:0 .0625rem .1875rem #00000014,0 .0625rem .125rem #0000000f}.z-tabs-glide-indicator[data-type=pill-solid],.z-tabs-glide-indicator[data-type=pill-blur]{border-radius:9999px;overflow:hidden}.z-tabs-glide-indicator[data-type=pill-solid]{background:var(--background);box-shadow:0 .0625rem .1875rem #00000014,0 .0625rem .125rem #0000000f}.z-tabs-glide-indicator.z-tabs-glide-indicator-ready{transition:transform .48s cubic-bezier(.22,1,.36,1),width .48s cubic-bezier(.22,1,.36,1),height .48s cubic-bezier(.22,1,.36,1)}.z-tabs-glide-indicator[data-type=segment-solid]{background:var(--primary)}.z-tabs-glide-indicator[data-type=pill-blur]{background:linear-gradient(to bottom,color-mix(in oklab,white 22%,transparent) 0%,color-mix(in oklab,white 6%,transparent) 45%,transparent 100%),color-mix(in oklab,var(--background) 55%,transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab,white 25%,transparent),inset 0 .0625rem color-mix(in oklab,white 45%,transparent),0 .125rem .5rem #0000001a,0 .0625rem .125rem #0000000f;backdrop-filter:blur(.75rem) saturate(180%);-webkit-backdrop-filter:blur(.75rem) saturate(180%)}.dark .z-tabs-glide-indicator[data-type=pill-blur]{background:linear-gradient(to bottom,color-mix(in oklab,white 12%,transparent) 0%,color-mix(in oklab,white 3%,transparent) 45%,transparent 100%),color-mix(in oklab,var(--background) 45%,transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab,white 10%,transparent),inset 0 .0625rem color-mix(in oklab,white 16%,transparent),0 .125rem .5rem #00000059,0 .0625rem .125rem #0003}@keyframes z-tab-icon-bounce{0%{transform:scale(1)}35%{transform:scale(.97)}to{transform:scale(1)}}.z-tab-icon-bounce{animation:z-tab-icon-bounce .32s cubic-bezier(.34,1.56,.64,1)}.z-tabs-container[data-orientation=vertical] .z-tabs-nav{align-items:stretch}.z-tabs-container[data-orientation=vertical] .z-tabs-scroll-container{width:min(12rem,40vw);flex:none}.z-tabs-container[data-orientation=vertical] .z-tabs-panels,.z-tabs-container[data-orientation=vertical] .z-tab-item{min-width:0}@media(prefers-reduced-motion:reduce){.z-tab-item,.z-tabs-nav-control{transition:none!important}.z-tabs-scroll-wrapper{scroll-behavior:auto}.z-tabs-panels [role=tabpanel][data-state=active]{animation:none!important}.z-tabs-glide-indicator.z-tabs-glide-indicator-ready{transition:none!important}.z-tab-icon-bounce{animation:none!important}}@keyframes z-tabs-fade-in{0%{opacity:0;transform:translateY(-.2rem)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { 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: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTooltipPosition", "zTrigger", "zTooltipTrigger", "zTooltipType", "zTooltipSize", "zClass", "zTooltipClass", "zShowDelay", "zTooltipShowDelay", "zHideDelay", "zTooltipHideDelay", "zArrow", "zTooltipArrow", "zDisabled", "zTooltipDisabled", "zOffset", "zTooltipOffset", "zAutoDetect", "zTriggerElement", "zAlwaysShow", "zMaxWidth"], outputs: ["zShow", "zHide"], exportAs: ["zTooltip"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zPopoverTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zTriggerRef", "zManualClose", "zOutsideClickClose", "zScrollClose", "zSticky", "zShowArrow", "zKeyboardSafe"], outputs: ["zShow", "zHide", "zHideStart", "zControl", "zPositionChange", "zOutsideClick"], exportAs: ["zPopover"] }, { kind: "component", type: NgScrollbar, selector: "ng-scrollbar:not([externalViewport]), [ngScrollbar]", exportAs: ["ngScrollbar"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
620
698
|
}
|
|
621
699
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ZTabsComponent, decorators: [{
|
|
622
700
|
type: Component,
|
|
@@ -630,8 +708,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
|
|
|
630
708
|
NgScrollbar,
|
|
631
709
|
], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
632
710
|
class: 'z-tabs-wrapper block',
|
|
633
|
-
}, template: "<div\n class=\"z-tabs-container flex gap-1\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-content-fit]=\"zContentFit()\"\n [class.flex-col]=\"!zTabsOnly()\"\n [class.flex-row]=\"zOrientation() === 'vertical'\"\n [class.gap-4]=\"zOrientation() === 'vertical'\">\n <!-- Tabs Navigation (Left/Scroll/Tabs/Right/Dropdown) -->\n <div\n class=\"z-tabs-nav flex items-center gap-1.5\"\n [class.z-tabs-nav-surface]=\"zShowNavWrapper() && isGlideType()\"\n [class.w-full]=\"zOrientation() === 'horizontal' && (!zShowNavWrapper() || zNavFullWidth())\"\n [class.w-fit]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.max-w-full]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.w-auto]=\"zOrientation() === 'vertical'\"\n [class.shrink-0]=\"zOrientation() === 'vertical'\">\n <!-- Scroll Left Button -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n [zWave]=\"false\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollLeft()\"\n aria-label=\"Scroll left\">\n <z-icon zType=\"lucideChevronLeft\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Tabs List Container with Scroll + Fade -->\n <div\n class=\"z-tabs-scroll-container relative min-w-0 flex-1\"\n [class.z-tabs-scroll-container-surface]=\"canScrollLeft() || canScrollRight()\"\n [attr.data-type]=\"zType()\">\n @if (zOrientation() === 'vertical') {\n <ng-scrollbar\n class=\"z-tabs-scroll-wrapper z-tabs-scrollbar vertical\"\n [class.z-tabs-scroll-wrapper-limited]=\"verticalTabsScrollable()\"\n track=\"vertical\"\n orientation=\"vertical\"\n appearance=\"compact\"\n visibility=\"hover\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </ng-scrollbar>\n } @else {\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.z-tabs-scroll-wrapper-scrollable]=\"canScrollLeft() || canScrollRight()\"\n [class.z-tabs-scroll-wrapper-fade-left]=\"canScrollLeft()\"\n [class.z-tabs-scroll-wrapper-fade-right]=\"canScrollRight()\"\n (scroll)=\"onTabsScroll()\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </div>\n }\n </div>\n\n <!-- Scroll Right Button -->\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollRight()\"\n [zWave]=\"false\"\n aria-label=\"Scroll right\">\n <z-icon zType=\"lucideChevronRight\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Dropdown Button (Mobile or Overflow) -->\n @if (zOrientation() === 'horizontal' && (canScrollLeft() || canScrollRight())) {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[6.25rem] max-w-[12.5rem]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <ng-template #tabsListTpl>\n <!-- Tab List -->\n <div\n [class]=\"tabsClasses()\"\n [class.pb-0.5]=\"tabsListHasBottomPadding()\"\n role=\"tablist\"\n [attr.aria-orientation]=\"zOrientation()\"\n [attr.data-type]=\"zType()\">\n @if (isGlideType() && glideStyle(); as style) {\n <div\n class=\"z-tabs-glide-indicator pointer-events-none absolute top-0 left-0 z-[6]\"\n [class.z-tabs-glide-indicator-ready]=\"glideReady()\"\n [attr.data-type]=\"zType()\"\n [style.transform]=\"style.transform\"\n [style.width]=\"style.width\"\n [style.height]=\"style.height\"\n aria-hidden=\"true\">\n <div class=\"z-tabs-glide-indicator-fill\" [class.z-tabs-glide-indicator-squash]=\"glideSquashing()\"></div>\n </div>\n }\n @for (tab of zTabs(); track tab.value; let idx = $index; let last = $last) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.data-state]=\"isTabActive(tab) ? 'active' : 'inactive'\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-last]=\"last\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n z-tooltip\n [zContent]=\"zOrientation() === 'vertical' ? (tab.label | translate) : ''\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n (click)=\"selectTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon\n [zType]=\"tab.icon\"\n zSize=\"16\"\n class=\"shrink-0\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\" />\n }\n <span\n class=\"z-tab-item-label min-w-0 flex-1 truncate text-left\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"ring-background ml-1.5 inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold ring-2\"\n [class.bg-primary]=\"zType() !== 'badge'\"\n [class.text-primary-foreground]=\"zType() !== 'badge'\"\n [class.bg-primary!]=\"zType() === 'badge'\"\n [class.text-primary-foreground!]=\"zType() === 'badge'\">\n {{ tab.badge }}\n </span>\n }\n </button>\n }\n </div>\n </ng-template>\n\n <!-- Tab Panels -->\n @if (!zTabsOnly()) {\n <div\n class=\"z-tabs-panels min-h-0\"\n [class.flex-1]=\"zOrientation() === 'vertical'\"\n [class.shadow-xs]=\"contentWrapperFramed()\"\n [class.z-tabs-panels-unwrapped]=\"!contentWrapperFramed()\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (panelRenderStates().get(panel.zTabPanel())) {\n <div\n role=\"tabpanel\"\n [id]=\"'panel-' + panel.zTabPanel()\"\n [attr.aria-labelledby]=\"panel.zTabPanel()\"\n [hidden]=\"activeTab() !== panel.zTabPanel()\">\n <ng-container *ngTemplateOutlet=\"panel.template\" />\n </div>\n }\n }\n </div>\n }\n</div>\n\n<!-- Dropdown Menu Template -->\n<ng-template #dropdownTpl let-close=\"close\">\n <div\n class=\"z-tabs-dropdown-menu flex max-h-[18.75rem] max-w-[12.5rem] min-w-[6.25rem] flex-col gap-0.5 overflow-y-auto p-1\">\n @for (tab of zTabs(); track tab.value) {\n <button\n #dropdownItem\n type=\"button\"\n class=\"flex w-full cursor-pointer items-center justify-start gap-2 rounded-sm px-2 py-1.5 text-left text-sm font-medium transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:text-foreground]=\"!isTabActive(tab)\"\n [class.focus:bg-primary/10]=\"!isTabActive(tab)\"\n [class.bg-primary/15]=\"isTabActive(tab)\"\n [class.text-primary]=\"isTabActive(tab)\"\n [disabled]=\"tab.disabled\"\n (click)=\"selectTab(tab, true); close()\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"min-w-0 flex-1 truncate\"\n z-tooltip\n [zContent]=\"tab.label | translate\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n [zTriggerElement]=\"dropdownItem\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold\">\n {{ tab.badge }}\n </span>\n }\n @if (isTabActive(tab)) {\n <z-icon zType=\"lucideCheck\" zSize=\"16\" class=\"text-primary shink-0\" />\n }\n </button>\n }\n </div>\n</ng-template>\n", styles: [".z-tabs-scroll-wrapper{overflow-x:clip;overflow-y:visible;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}.z-tabs-scroll-wrapper::-webkit-scrollbar{display:none}.z-tabs-scroll-wrapper.vertical{max-height:var(--z-tabs-vertical-max-height, min(22rem, 60vh));overflow:hidden auto}.z-tabs-scroll-wrapper.vertical.z-tabs-scroll-wrapper-limited{height:var(--z-tabs-vertical-max-height, min(22rem, 60vh));overflow:hidden auto}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-scrollable{overflow-x:auto}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-left{mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black 100%)}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-right{mask-image:linear-gradient(to left,transparent 0,black var(--z-tabs-fade-width),black 100%);-webkit-mask-image:linear-gradient(to left,transparent 0,black var(--z-tabs-fade-width),black 100%)}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-left.z-tabs-scroll-wrapper-fade-right{mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black calc(100% - var(--z-tabs-fade-width)),transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black calc(100% - var(--z-tabs-fade-width)),transparent 100%)}.z-tabs-scrollbar{--scrollbar-padding: .125rem;--z-tabs-scrollbar-gutter: .75rem;--scrollbar-track-color: transparent;--scrollbar-thumb-color: color-mix(in oklab, var(--muted-foreground) 35%, transparent);--scrollbar-thumb-hover-color: color-mix(in oklab, var(--muted-foreground) 55%, transparent);--scrollbar-size: .375rem;display:block}.z-tabs-scrollbar .ng-scroll-viewport,.z-tabs-scrollbar .ng-scroll-content{max-width:100%}.z-tabs-scrollbar.z-tabs-scroll-wrapper-limited .ng-scroll-viewport{height:100%;max-height:100%}.z-tabs-scrollbar .ng-scroll-content{box-sizing:border-box;padding-right:var(--z-tabs-scrollbar-gutter)}.z-tabs-scroll-container{isolation:isolate;--z-tabs-fade-width: 2rem}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{background:color-mix(in oklab,var(--background) 72%,var(--muted));border:.0625rem solid color-mix(in oklab,var(--background) 88%,var(--border));box-shadow:0 .0625rem .1875rem #0000000f,0 .125rem .5rem #00000014;backdrop-filter:blur(.75rem) saturate(140%);-webkit-backdrop-filter:blur(.75rem) saturate(140%)}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface .z-tabs{background:transparent}.z-tabs-container:is([data-type=segment],[data-type=segment-solid]) .z-tabs-scroll-container-surface{border-radius:.5rem;overflow:hidden}.z-tabs-container:is([data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{border-radius:9999px;overflow:hidden}.dark .z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{background:color-mix(in oklab,var(--muted) 35%,transparent);border-color:color-mix(in oklab,var(--border) 65%,transparent);box-shadow:0 .0625rem .1875rem #0000002e,0 .125rem .5rem #0000003d}.z-tabs{align-items:stretch;min-height:2.5rem}.z-tabs.flex-col{width:100%}.z-tabs.flex-col.border-r{border-right:.0625rem solid hsl(var(--border));padding-right:.5rem}.z-tabs-nav-control{transition:color .2s ease,background-color .2s ease,border-color .2s ease}.z-tabs-nav-surface{background:color-mix(in oklab,var(--background) 72%,var(--muted));border:.0625rem solid color-mix(in oklab,var(--background) 88%,var(--border));border-radius:.5rem;padding:.125rem;box-shadow:0 .0625rem .1875rem #0000000f,0 .125rem .5rem #00000014;backdrop-filter:blur(.75rem) saturate(140%);-webkit-backdrop-filter:blur(.75rem) saturate(140%)}.z-tabs-nav-surface .z-tabs{background:transparent}.dark .z-tabs-nav-surface{background:color-mix(in oklab,var(--muted) 35%,transparent);border-color:color-mix(in oklab,var(--border) 65%,transparent);box-shadow:0 .0625rem .1875rem #0000002e,0 .125rem .5rem #0000003d}.z-tab-item{-webkit-tap-highlight-color:transparent;position:relative}.z-tab-item[data-active=true]{position:relative}.z-tab-item:disabled{pointer-events:none}.z-tabs-panels{border:.0625rem solid var(--border);border-radius:var(--radius-xs);padding:1rem}.z-tabs-panels [role=tabpanel]{animation:z-tabs-fade-in .2s ease-in-out}.z-tabs-panels [role=tabpanel][hidden]{display:none}.z-tabs-panels-unwrapped{border:0;border-radius:0;padding:0}.z-tabs-wrapper .z-tabs.flex-row+.z-tabs-panels{margin-top:.875rem}.z-tabs-wrapper .z-tabs.flex-col+.z-tabs-panels{margin-top:0;margin-left:0}.z-tabs-container[data-orientation=horizontal]{gap:0}.z-tabs-container[data-orientation=horizontal] .z-tabs-scroll-container{z-index:1}.z-tabs-container[data-orientation=horizontal] .z-tabs-panels{margin-top:0}.z-tabs-container[data-content-fit=screen]{height:var(--z-tabs-screen-height, calc(100dvh - var(--z-tabs-screen-offset, 0rem)));max-height:var(--z-tabs-screen-height, calc(100dvh - var(--z-tabs-screen-offset, 0rem)));min-height:0;overflow:hidden}.z-tabs-container[data-content-fit=screen] .z-tabs-nav{flex:none;min-height:0}.z-tabs-container[data-content-fit=screen] .z-tabs-panels{flex:1 1 auto;min-height:0;overflow:auto}.z-tabs-container[data-content-fit=screen] [role=tabpanel]{min-height:0}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs{isolation:isolate;position:relative}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs .z-tab-item[data-active=true]{z-index:1}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs .z-tab-item[data-active=true]:after{z-index:1}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs:after{content:\"\";position:absolute;right:0;bottom:0;left:0;height:.0625rem;background:color-mix(in oklab,var(--border) 80%,transparent);pointer-events:none;z-index:0}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-scroll-wrapper{padding-inline:0}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-panels{border-radius:0 0 var(--radius-xs) var(--radius-xs)}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-panels-unwrapped{border:0;border-radius:0}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-nav{position:relative}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-nav:after{content:\"\";position:absolute;right:0;bottom:0;left:0;height:.0625rem;background:var(--border);pointer-events:none;z-index:0}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-panels{border-top:0}.z-tabs-container[data-type=folder-solid][data-orientation=horizontal] .z-tab-item[data-active=true][data-last=true]{box-shadow:inset .0625rem 0 0 var(--primary),inset -.0625rem 0 0 var(--border),inset 0 .0625rem 0 var(--primary)}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs{align-items:center}.z-tabs-glide-indicator{transition:none;will-change:transform,width,height}.z-tabs-glide-indicator.z-tabs-glide-indicator-ready{transition:transform .42s cubic-bezier(.3,1.1,.38,1),width .42s cubic-bezier(.3,1.1,.38,1),height .42s cubic-bezier(.3,1.1,.38,1)}.z-tabs-glide-indicator[data-type=segment] .z-tabs-glide-indicator-fill{border-radius:.3125rem;background:var(--background);box-shadow:0 .0625rem .1875rem #00000014,0 .0625rem .125rem #0000000f}.z-tabs-glide-indicator[data-type=segment-solid] .z-tabs-glide-indicator-fill{border-radius:.3125rem;background:var(--primary);box-shadow:0 .0625rem .1875rem #00000014,0 .0625rem .125rem #0000000f}.z-tabs-glide-indicator[data-type=pill-solid] .z-tabs-glide-indicator-fill{border-radius:9999px;background:var(--background);box-shadow:0 .0625rem .1875rem #00000014,0 .0625rem .125rem #0000000f}.z-tabs-glide-indicator[data-type=pill-blur] .z-tabs-glide-indicator-fill{border-radius:9999px;background:linear-gradient(to bottom,color-mix(in oklab,white 22%,transparent) 0%,color-mix(in oklab,white 6%,transparent) 45%,transparent 100%),color-mix(in oklab,var(--background) 55%,transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab,white 25%,transparent),inset 0 .0625rem color-mix(in oklab,white 45%,transparent),0 .125rem .5rem #0000001a,0 .0625rem .125rem #0000000f;backdrop-filter:blur(.75rem) saturate(180%);-webkit-backdrop-filter:blur(.75rem) saturate(180%)}.dark .z-tabs-glide-indicator[data-type=pill-blur] .z-tabs-glide-indicator-fill{background:linear-gradient(to bottom,color-mix(in oklab,white 12%,transparent) 0%,color-mix(in oklab,white 3%,transparent) 45%,transparent 100%),color-mix(in oklab,var(--background) 45%,transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab,white 10%,transparent),inset 0 .0625rem color-mix(in oklab,white 16%,transparent),0 .125rem .5rem #00000059,0 .0625rem .125rem #0003}.z-tabs-glide-indicator-fill{position:absolute;inset:0;transform-origin:center}@keyframes z-tabs-glide-squash{0%{transform:scaleY(1)}45%{transform:scaleY(.94)}75%{transform:scaleY(1.015)}to{transform:scaleY(1)}}.z-tabs-glide-indicator-squash{animation:z-tabs-glide-squash .36s ease-out}@keyframes z-tab-icon-bounce{0%{transform:scale(1)}35%{transform:scale(.97)}to{transform:scale(1)}}.z-tab-icon-bounce{animation:z-tab-icon-bounce .32s cubic-bezier(.34,1.56,.64,1)}.z-tabs-container[data-orientation=vertical] .z-tabs-nav{align-items:stretch}.z-tabs-container[data-orientation=vertical] .z-tabs-scroll-container{width:min(12rem,40vw);flex:none}.z-tabs-container[data-orientation=vertical] .z-tabs-panels,.z-tabs-container[data-orientation=vertical] .z-tab-item{min-width:0}@media(prefers-reduced-motion:reduce){.z-tab-item,.z-tabs-nav-control{transition:none!important}.z-tabs-scroll-wrapper{scroll-behavior:auto}.z-tabs-panels [role=tabpanel]{animation:none!important}.z-tabs-glide-indicator.z-tabs-glide-indicator-ready{transition:none!important}.z-tab-icon-bounce,.z-tabs-glide-indicator-squash{animation:none!important}}@keyframes z-tabs-fade-in{0%{opacity:0;transform:translateY(-.2rem)}to{opacity:1;transform:translateY(0)}}\n"] }]
|
|
634
|
-
}], ctorParameters: () => [], propDecorators: { tabPanels: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => ZTabPanelDirective), { isSignal: true }] }], tabsListContainer: [{ type: i0.ViewChild, args: ['tabsListContainer', { isSignal: true }] }], tabButtons: [{ type: i0.ViewChildren, args: ['tabButton', { isSignal: true }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zTabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTabs", required: true }] }], zType: [{ type: i0.Input, args: [{ isSignal: true, alias: "zType", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zOrientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOrientation", required: false }] }], zContentFit: [{ type: i0.Input, args: [{ isSignal: true, alias: "zContentFit", required: false }] }], zLazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLazy", required: false }] }], zDestroyInactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDestroyInactive", required: false }] }], zTabsOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTabsOnly", required: false }] }], zShowNavWrapper: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowNavWrapper", required: false }] }], zNavFullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zNavFullWidth", required: false }] }], zShowContentWrapper: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowContentWrapper", required: false }] }], zReloadable: [{ type: i0.Input, args: [{ isSignal: true, alias: "zReloadable", required: false }] }], zEmitOnActiveClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "zEmitOnActiveClick", required: false }] }], zCache: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCache", required: false }] }], zCacheKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCacheKey", required: false }] }], activeTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTab", required: false }] }, { type: i0.Output, args: ["activeTabChange"] }], zTabChange: [{ type: i0.Output, args: ["zTabChange"] }] } });
|
|
711
|
+
}, template: "<div\n class=\"z-tabs-container flex gap-1\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-content-fit]=\"zContentFit()\"\n [class.flex-col]=\"!zTabsOnly()\"\n [class.flex-row]=\"zOrientation() === 'vertical'\"\n [class.gap-4]=\"zOrientation() === 'vertical'\">\n <!-- Tabs Navigation (Left/Scroll/Tabs/Right/Dropdown) -->\n <div\n [class]=\"navClasses()\"\n [class.z-tabs-nav-surface]=\"zShowNavWrapper() && isGlideType()\"\n [class.w-full]=\"zOrientation() === 'horizontal' && (!zShowNavWrapper() || zNavFullWidth())\"\n [class.w-fit]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.max-w-full]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.w-auto]=\"zOrientation() === 'vertical'\"\n [class.shrink-0]=\"zOrientation() === 'vertical'\">\n <!-- Scroll Left Button -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n [zWave]=\"false\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollLeft()\"\n aria-label=\"Scroll left\">\n <z-icon zType=\"lucideChevronLeft\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Tabs List Container with Scroll + Fade -->\n <div\n class=\"z-tabs-scroll-container relative min-w-0 flex-1\"\n [class.z-tabs-scroll-container-surface]=\"canScrollLeft() || canScrollRight()\"\n [attr.data-type]=\"zType()\">\n @if (zOrientation() === 'vertical') {\n <ng-scrollbar\n class=\"z-tabs-scroll-wrapper z-tabs-scrollbar vertical\"\n [class.z-tabs-scroll-wrapper-limited]=\"verticalTabsScrollable()\"\n track=\"vertical\"\n orientation=\"vertical\"\n appearance=\"compact\"\n visibility=\"hover\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </ng-scrollbar>\n } @else {\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.z-tabs-scroll-wrapper-scrollable]=\"canScrollLeft() || canScrollRight()\"\n [class.z-tabs-scroll-wrapper-fade-left]=\"canScrollLeft()\"\n [class.z-tabs-scroll-wrapper-fade-right]=\"canScrollRight()\"\n (scroll)=\"onTabsScroll()\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </div>\n }\n </div>\n\n <!-- Scroll Right Button -->\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollRight()\"\n [zWave]=\"false\"\n aria-label=\"Scroll right\">\n <z-icon zType=\"lucideChevronRight\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Dropdown Button (Mobile or Overflow) -->\n @if (zOrientation() === 'horizontal' && (canScrollLeft() || canScrollRight())) {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[6.25rem] max-w-[12.5rem]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <ng-template #tabsListTpl>\n <!-- Tab List -->\n <div\n [class]=\"tabsClasses()\"\n [class.pb-0.5]=\"tabsListHasBottomPadding()\"\n role=\"tablist\"\n [attr.aria-orientation]=\"zOrientation()\"\n [attr.data-type]=\"zType()\">\n @if (isGlideType() && glideStyle(); as style) {\n <div\n class=\"z-tabs-glide-indicator pointer-events-none absolute top-0 left-0 z-[6]\"\n [class.z-tabs-glide-indicator-ready]=\"glideReady()\"\n [attr.data-type]=\"zType()\"\n [style.transform]=\"style.transform\"\n [style.width]=\"style.width\"\n [style.height]=\"style.height\"\n aria-hidden=\"true\"></div>\n }\n @for (tab of zTabs(); track tab.value; let idx = $index; let last = $last) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.data-state]=\"isTabActive(tab) ? 'active' : 'inactive'\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-last]=\"last\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n z-tooltip\n [zContent]=\"zOrientation() === 'vertical' ? (tab.label | translate) : ''\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n (click)=\"selectTab(tab)\"\n (pointerenter)=\"preloadTab(tab)\"\n (focus)=\"preloadTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon\n [zType]=\"tab.icon\"\n zSize=\"16\"\n class=\"shrink-0\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\" />\n }\n <span\n class=\"z-tab-item-label min-w-0 flex-1 truncate text-left\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"ring-background ml-1.5 inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold ring-2\"\n [class.bg-primary]=\"zType() !== 'badge'\"\n [class.text-primary-foreground]=\"zType() !== 'badge'\"\n [class.bg-primary!]=\"zType() === 'badge'\"\n [class.text-primary-foreground!]=\"zType() === 'badge'\">\n {{ tab.badge }}\n </span>\n }\n </button>\n }\n </div>\n </ng-template>\n\n <!-- Tab Panels -->\n @if (!zTabsOnly()) {\n <div\n class=\"z-tabs-panels min-h-0\"\n [class.flex-1]=\"zOrientation() === 'vertical'\"\n [class.shadow-xs]=\"contentWrapperFramed()\"\n [class.z-tabs-panels-unwrapped]=\"!contentWrapperFramed()\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (panelRenderStates().get(panel.zTabPanel())) {\n <div\n role=\"tabpanel\"\n [id]=\"'panel-' + panel.zTabPanel()\"\n [attr.aria-labelledby]=\"panel.zTabPanel()\"\n [attr.data-state]=\"visiblePanel() === panel.zTabPanel() ? 'active' : 'inactive'\"\n [attr.inert]=\"visiblePanel() === panel.zTabPanel() ? null : ''\">\n <ng-container *ngTemplateOutlet=\"panel.template\" />\n </div>\n }\n }\n </div>\n }\n</div>\n\n<!-- Dropdown Menu Template -->\n<ng-template #dropdownTpl let-close=\"close\">\n <div\n class=\"z-tabs-dropdown-menu flex max-h-[18.75rem] max-w-[12.5rem] min-w-[6.25rem] flex-col gap-0.5 overflow-y-auto p-1\">\n @for (tab of zTabs(); track tab.value) {\n <button\n #dropdownItem\n type=\"button\"\n class=\"flex w-full cursor-pointer items-center justify-start gap-2 rounded-sm px-2 py-1.5 text-left text-sm font-medium transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:text-foreground]=\"!isTabActive(tab)\"\n [class.focus:bg-primary/10]=\"!isTabActive(tab)\"\n [class.bg-primary/15]=\"isTabActive(tab)\"\n [class.text-primary]=\"isTabActive(tab)\"\n [disabled]=\"tab.disabled\"\n (pointerenter)=\"preloadTab(tab)\"\n (click)=\"selectTab(tab, true); close()\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"min-w-0 flex-1 truncate\"\n z-tooltip\n [zContent]=\"tab.label | translate\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n [zTriggerElement]=\"dropdownItem\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold\">\n {{ tab.badge }}\n </span>\n }\n @if (isTabActive(tab)) {\n <z-icon zType=\"lucideCheck\" zSize=\"16\" class=\"text-primary shink-0\" />\n }\n </button>\n }\n </div>\n</ng-template>\n", styles: [".z-tabs-scroll-wrapper{overflow-x:clip;overflow-y:visible;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}.z-tabs-scroll-wrapper::-webkit-scrollbar{display:none}.z-tabs-scroll-wrapper.vertical{max-height:var(--z-tabs-vertical-max-height, min(22rem, 60vh));overflow:hidden auto}.z-tabs-scroll-wrapper.vertical.z-tabs-scroll-wrapper-limited{height:var(--z-tabs-vertical-max-height, min(22rem, 60vh));overflow:hidden auto}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-scrollable{overflow-x:auto}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-left{mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black 100%)}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-right{mask-image:linear-gradient(to left,transparent 0,black var(--z-tabs-fade-width),black 100%);-webkit-mask-image:linear-gradient(to left,transparent 0,black var(--z-tabs-fade-width),black 100%)}.z-tabs-scroll-wrapper.z-tabs-scroll-wrapper-fade-left.z-tabs-scroll-wrapper-fade-right{mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black calc(100% - var(--z-tabs-fade-width)),transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,black var(--z-tabs-fade-width),black calc(100% - var(--z-tabs-fade-width)),transparent 100%)}.z-tabs-scrollbar{--scrollbar-padding: .125rem;--z-tabs-scrollbar-gutter: .75rem;--scrollbar-track-color: transparent;--scrollbar-thumb-color: color-mix(in oklab, var(--muted-foreground) 35%, transparent);--scrollbar-thumb-hover-color: color-mix(in oklab, var(--muted-foreground) 55%, transparent);--scrollbar-size: .375rem;display:block}.z-tabs-scrollbar .ng-scroll-viewport,.z-tabs-scrollbar .ng-scroll-content{max-width:100%}.z-tabs-scrollbar.z-tabs-scroll-wrapper-limited .ng-scroll-viewport{height:100%;max-height:100%}.z-tabs-scrollbar .ng-scroll-content{box-sizing:border-box;padding-right:var(--z-tabs-scrollbar-gutter)}.z-tabs-scroll-container{isolation:isolate;--z-tabs-fade-width: 2rem}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{background:color-mix(in oklab,var(--background) 72%,var(--muted));border:.0625rem solid color-mix(in oklab,var(--background) 88%,var(--border));box-shadow:0 .0625rem .1875rem #0000000f,0 .125rem .5rem #00000014;backdrop-filter:blur(.75rem) saturate(140%);-webkit-backdrop-filter:blur(.75rem) saturate(140%)}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface .z-tabs{background:transparent}.z-tabs-container:is([data-type=segment],[data-type=segment-solid]) .z-tabs-scroll-container-surface{border-radius:.5rem;overflow:hidden}.z-tabs-container:is([data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{border-radius:9999px;overflow:hidden}.dark .z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs-scroll-container-surface{background:color-mix(in oklab,var(--muted) 35%,transparent);border-color:color-mix(in oklab,var(--border) 65%,transparent);box-shadow:0 .0625rem .1875rem #0000002e,0 .125rem .5rem #0000003d}.z-tabs{align-items:stretch;min-height:2.5rem}.z-tabs.flex-col{width:100%}.z-tabs.flex-col.border-r{border-right:.0625rem solid hsl(var(--border));padding-right:.5rem}.z-tabs-nav-control{transition:color .2s ease,background-color .2s ease,border-color .2s ease}.z-tabs-nav-surface{background:color-mix(in oklab,var(--background) 72%,var(--muted));border:.0625rem solid color-mix(in oklab,oklch(95% 0 0deg) 88%,var(--border));border-radius:.5rem;padding:.125rem;box-shadow:0 .0625rem .1875rem #0000000f,0 .125rem .5rem #00000014;backdrop-filter:blur(.75rem) saturate(140%);-webkit-backdrop-filter:blur(.75rem) saturate(140%)}.z-tabs-nav-surface .z-tabs{background:transparent}.z-tabs-container:is([data-type=pill-solid],[data-type=pill-blur]) .z-tabs-nav-surface{border-radius:9999px}.dark .z-tabs-nav-surface{background:color-mix(in oklab,var(--muted) 35%,transparent);border-color:color-mix(in oklab,var(--border) 65%,transparent);box-shadow:0 .0625rem .1875rem #0000002e,0 .125rem .5rem #0000003d}.z-tab-item{-webkit-tap-highlight-color:transparent;position:relative}.z-tab-item[data-active=true]{position:relative}.z-tab-item:disabled{pointer-events:none}.z-tabs-panels{border:.0625rem solid var(--border);border-radius:var(--radius-xs);padding:1rem}.z-tabs-panels [role=tabpanel][data-state=active]{animation:z-tabs-fade-in .2s ease-in-out}.z-tabs-panels [role=tabpanel][data-state=inactive]{content-visibility:hidden}@supports not (content-visibility: hidden){.z-tabs-panels [role=tabpanel][data-state=inactive]{display:none}}.z-tabs-panels-unwrapped{border:0;border-radius:0;padding:0}.z-tabs-wrapper .z-tabs.flex-row+.z-tabs-panels{margin-top:.875rem}.z-tabs-wrapper .z-tabs.flex-col+.z-tabs-panels{margin-top:0;margin-left:0}.z-tabs-container[data-orientation=horizontal]{gap:0}.z-tabs-container[data-orientation=horizontal] .z-tabs-scroll-container{z-index:1}.z-tabs-container[data-orientation=horizontal] .z-tabs-panels{margin-top:0}.z-tabs-container[data-content-fit=screen]{height:var(--z-tabs-screen-height, calc(100dvh - var(--z-tabs-screen-offset, 0rem)));max-height:var(--z-tabs-screen-height, calc(100dvh - var(--z-tabs-screen-offset, 0rem)));min-height:0;overflow:hidden}.z-tabs-container[data-content-fit=screen] .z-tabs-nav{flex:none;min-height:0}.z-tabs-container[data-content-fit=screen] .z-tabs-panels{flex:1 1 auto;min-height:0;overflow:auto}.z-tabs-container[data-content-fit=screen] [role=tabpanel]{min-height:0}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs{isolation:isolate;position:relative}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs .z-tab-item[data-active=true]{z-index:1}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs .z-tab-item[data-active=true]:after{z-index:1}.z-tabs-container[data-type=line][data-orientation=horizontal] .z-tabs:after{content:\"\";position:absolute;right:0;bottom:0;left:0;height:.0625rem;background:color-mix(in oklab,var(--border) 80%,transparent);pointer-events:none;z-index:0}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-scroll-wrapper{padding-inline:0}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-panels{border-radius:0 0 var(--radius-xs) var(--radius-xs)}.z-tabs-container:is([data-type=outline],[data-type=soft],[data-type=segment],[data-type=folder],[data-type=folder-soft],[data-type=folder-solid],[data-type=underline],[data-type=underlined],[data-type=badge],[data-type=sharp],[data-type=sharp-line],[data-type=sharp-line-filled],[data-type=square],[data-type=code-line])[data-orientation=horizontal] .z-tabs-panels-unwrapped{border:0;border-radius:0}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-nav{position:relative}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-nav:after{content:\"\";position:absolute;right:0;bottom:0;left:0;height:.0625rem;background:var(--border);pointer-events:none;z-index:0}.z-tabs-container:is([data-type=folder],[data-type=folder-soft],[data-type=folder-solid])[data-orientation=horizontal] .z-tabs-panels{border-top:0}.z-tabs-container[data-type=folder-solid][data-orientation=horizontal] .z-tab-item[data-active=true][data-last=true]{box-shadow:inset .0625rem 0 0 var(--primary),inset -.0625rem 0 0 var(--border),inset 0 .0625rem 0 var(--primary)}.z-tabs-container:is([data-type=segment],[data-type=segment-solid],[data-type=pill-solid],[data-type=pill-blur]) .z-tabs{align-items:center}.z-tabs-glide-indicator{transition:none;will-change:transform,width,height}.z-tabs-glide-indicator[data-type=segment],.z-tabs-glide-indicator[data-type=segment-solid]{border-radius:.3125rem;overflow:hidden;background:var(--background);box-shadow:0 .0625rem .1875rem #00000014,0 .0625rem .125rem #0000000f}.z-tabs-glide-indicator[data-type=pill-solid],.z-tabs-glide-indicator[data-type=pill-blur]{border-radius:9999px;overflow:hidden}.z-tabs-glide-indicator[data-type=pill-solid]{background:var(--background);box-shadow:0 .0625rem .1875rem #00000014,0 .0625rem .125rem #0000000f}.z-tabs-glide-indicator.z-tabs-glide-indicator-ready{transition:transform .48s cubic-bezier(.22,1,.36,1),width .48s cubic-bezier(.22,1,.36,1),height .48s cubic-bezier(.22,1,.36,1)}.z-tabs-glide-indicator[data-type=segment-solid]{background:var(--primary)}.z-tabs-glide-indicator[data-type=pill-blur]{background:linear-gradient(to bottom,color-mix(in oklab,white 22%,transparent) 0%,color-mix(in oklab,white 6%,transparent) 45%,transparent 100%),color-mix(in oklab,var(--background) 55%,transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab,white 25%,transparent),inset 0 .0625rem color-mix(in oklab,white 45%,transparent),0 .125rem .5rem #0000001a,0 .0625rem .125rem #0000000f;backdrop-filter:blur(.75rem) saturate(180%);-webkit-backdrop-filter:blur(.75rem) saturate(180%)}.dark .z-tabs-glide-indicator[data-type=pill-blur]{background:linear-gradient(to bottom,color-mix(in oklab,white 12%,transparent) 0%,color-mix(in oklab,white 3%,transparent) 45%,transparent 100%),color-mix(in oklab,var(--background) 45%,transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab,white 10%,transparent),inset 0 .0625rem color-mix(in oklab,white 16%,transparent),0 .125rem .5rem #00000059,0 .0625rem .125rem #0003}@keyframes z-tab-icon-bounce{0%{transform:scale(1)}35%{transform:scale(.97)}to{transform:scale(1)}}.z-tab-icon-bounce{animation:z-tab-icon-bounce .32s cubic-bezier(.34,1.56,.64,1)}.z-tabs-container[data-orientation=vertical] .z-tabs-nav{align-items:stretch}.z-tabs-container[data-orientation=vertical] .z-tabs-scroll-container{width:min(12rem,40vw);flex:none}.z-tabs-container[data-orientation=vertical] .z-tabs-panels,.z-tabs-container[data-orientation=vertical] .z-tab-item{min-width:0}@media(prefers-reduced-motion:reduce){.z-tab-item,.z-tabs-nav-control{transition:none!important}.z-tabs-scroll-wrapper{scroll-behavior:auto}.z-tabs-panels [role=tabpanel][data-state=active]{animation:none!important}.z-tabs-glide-indicator.z-tabs-glide-indicator-ready{transition:none!important}.z-tab-icon-bounce{animation:none!important}}@keyframes z-tabs-fade-in{0%{opacity:0;transform:translateY(-.2rem)}to{opacity:1;transform:translateY(0)}}\n"] }]
|
|
712
|
+
}], ctorParameters: () => [], propDecorators: { tabPanels: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => ZTabPanelDirective), { isSignal: true }] }], tabsListContainer: [{ type: i0.ViewChild, args: ['tabsListContainer', { isSignal: true }] }], tabButtons: [{ type: i0.ViewChildren, args: ['tabButton', { isSignal: true }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zTabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTabs", required: true }] }], zType: [{ type: i0.Input, args: [{ isSignal: true, alias: "zType", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zOrientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOrientation", required: false }] }], zContentFit: [{ type: i0.Input, args: [{ isSignal: true, alias: "zContentFit", required: false }] }], zLazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLazy", required: false }] }], zPreload: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPreload", required: false }] }], zDestroyInactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDestroyInactive", required: false }] }], zTabsOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTabsOnly", required: false }] }], zShowNavWrapper: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowNavWrapper", required: false }] }], zNavFullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zNavFullWidth", required: false }] }], zClassContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "zClassContent", required: false }] }], zShowContentWrapper: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowContentWrapper", required: false }] }], zReloadable: [{ type: i0.Input, args: [{ isSignal: true, alias: "zReloadable", required: false }] }], zEmitOnActiveClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "zEmitOnActiveClick", required: false }] }], zCache: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCache", required: false }] }], zCacheKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCacheKey", required: false }] }], activeTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTab", required: false }] }, { type: i0.Output, args: ["activeTabChange"] }], zTabChange: [{ type: i0.Output, args: ["zTabChange"] }] } });
|
|
635
713
|
|
|
636
714
|
/**
|
|
637
715
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shival99-z-ui-components-z-tabs.mjs","sources":["../../../../libs/core-ui/components/z-tabs/directives/z-tab-panel.directive.ts","../../../../libs/core-ui/components/z-tabs/z-tabs.define.ts","../../../../libs/core-ui/components/z-tabs/z-tabs.util.ts","../../../../libs/core-ui/components/z-tabs/z-tabs.variants.ts","../../../../libs/core-ui/components/z-tabs/z-tabs.component.ts","../../../../libs/core-ui/components/z-tabs/z-tabs.component.html","../../../../libs/core-ui/components/z-tabs/shival99-z-ui-components-z-tabs.ts"],"sourcesContent":["import { Directive, inject, input, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[z-tab-panel], [zTabPanel]',\n standalone: true,\n exportAs: 'zTabPanel',\n})\nexport class ZTabPanelDirective {\n public readonly zTabPanel = input.required<string>();\n public readonly template = inject(TemplateRef<unknown>);\n}\n","import type { ZTabsType } from './z-tabs.types';\n\n/** Minimum scroll-position delta (px) before the fade/scroll-button state is toggled. */\nexport const Z_TABS_SCROLL_TOLERANCE = 4;\n\n/**\n * Types that render a shared pill behind the active tab and glide it into place instead of\n * swapping each item's own background.\n */\nexport const Z_TABS_GLIDE_TYPES: ZTabsType[] = ['segment', 'segment-solid', 'pill-solid', 'pill-blur'];\n","/** Hands out a fresh, monotonically increasing id for scoping each `z-tabs` instance's cache key. */\nexport const zTabsInstanceIds = (() => {\n let counter = 0;\n return { next: (): number => ++counter };\n})();\n","import { cva } from 'class-variance-authority';\n\nexport const zTabsVariants = cva('z-tabs flex min-w-0', {\n variants: {\n zType: {\n line: 'gap-0',\n soft: 'gap-1 bg-background p-0 dark:bg-transparent',\n segment: 'relative gap-1 rounded-lg bg-muted/60 p-1 dark:bg-muted/35',\n 'segment-solid': 'relative gap-1 rounded-lg bg-muted/60 p-1 dark:bg-muted/35',\n 'pill-solid': 'relative gap-1 rounded-full bg-muted/60 p-1 dark:bg-muted/35',\n 'pill-blur': 'relative gap-1 rounded-full bg-muted/40 p-1 backdrop-blur-md dark:bg-muted/20',\n folder: 'isolate gap-0 bg-background p-0 dark:bg-transparent',\n 'folder-soft': 'isolate gap-0 bg-background p-0 dark:bg-transparent',\n 'folder-solid': 'isolate gap-0 bg-background p-0 dark:bg-transparent',\n underline: 'gap-0',\n underlined: 'gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n badge: 'gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n sharp: 'gap-1 rounded-none bg-background p-0 dark:bg-transparent',\n 'sharp-line': 'gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n 'sharp-line-filled': 'gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n square: 'gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n 'vertical-sharp': 'gap-1 rounded-none bg-background p-0 dark:bg-transparent',\n 'code-line': 'h-10 w-full justify-start gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n },\n zOrientation: {\n horizontal: 'w-max flex-row items-center',\n vertical: 'w-full flex-col items-stretch gap-1 border-b-0',\n },\n },\n defaultVariants: {\n zType: 'line',\n zOrientation: 'horizontal',\n },\n compoundVariants: [\n {\n zType: 'vertical-sharp',\n zOrientation: 'vertical',\n class: 'border-r-0 pr-0',\n },\n {\n zType: 'sharp-line',\n zOrientation: 'vertical',\n class: 'gap-0',\n },\n {\n zType: 'sharp-line-filled',\n zOrientation: 'vertical',\n class: 'gap-0',\n },\n ],\n});\n\nexport const zTabItemVariants = cva(\n 'z-tab-item relative inline-flex min-h-10 select-none items-center justify-center gap-2 whitespace-nowrap font-medium text-sm leading-none text-muted-foreground transition-[color,background-color,border-color,box-shadow,transform] duration-200 outline-none focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 cursor-pointer disabled:opacity-45 disabled:cursor-not-allowed',\n {\n variants: {\n zType: {\n line: 'rounded-none border-0 hover:text-foreground data-[active=true]:text-primary after:pointer-events-none after:absolute after:inset-x-0 after:bottom-[-1px] after:h-1 after:bg-primary after:origin-center after:scale-x-0 after:transition-transform after:duration-200 data-[active=true]:after:scale-x-100',\n soft: 'rounded-md border-0 text-muted-foreground hover:text-foreground data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-xs! dark:data-[active=true]:bg-primary/15',\n segment: 'z-10 rounded-md border-0 text-muted-foreground hover:text-foreground data-[active=true]:text-primary',\n 'segment-solid':\n 'z-10 rounded-md border-0 text-muted-foreground hover:text-foreground data-[active=true]:text-primary-foreground',\n 'pill-solid':\n 'z-10 rounded-full border-0 text-muted-foreground hover:text-foreground data-[active=true]:text-primary',\n 'pill-blur':\n 'z-10 rounded-full border-0 text-muted-foreground hover:text-foreground data-[active=true]:text-primary',\n folder:\n 'rounded-t-md border-0 bg-transparent text-muted-foreground shadow-[inset_0_-1px_0_var(--border)] hover:text-foreground focus-visible:ring-0 focus-visible:ring-offset-0 data-[active=true]:z-[2] data-[active=true]:bg-background data-[active=true]:text-primary data-[active=true]:shadow-[inset_1px_0_0_var(--border),inset_-1px_0_0_var(--border),inset_0_1px_0_var(--border)]',\n 'folder-soft':\n 'rounded-t-md border-0 bg-transparent text-muted-foreground shadow-[inset_0_-1px_0_var(--border)] hover:text-foreground focus-visible:ring-0 focus-visible:ring-offset-0 data-[active=true]:z-[2] data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-[inset_1px_0_0_var(--border),inset_-1px_0_0_var(--border),inset_0_1px_0_var(--border)] dark:data-[active=true]:bg-primary/15',\n 'folder-solid':\n 'rounded-t-md border-0 bg-transparent text-muted-foreground shadow-[inset_0_-1px_0_var(--border)] hover:text-foreground focus-visible:ring-0 focus-visible:ring-offset-0 data-[active=true]:z-[2] data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:shadow-[inset_1px_0_0_var(--primary),inset_-1px_0_0_var(--primary),inset_0_1px_0_var(--primary)]',\n underline:\n 'hover:text-foreground data-[active=true]:text-primary after:pointer-events-none after:absolute after:inset-x-1 after:bottom-[-1px] after:h-[0.1875rem] after:bg-primary after:origin-center after:scale-x-0 after:transition-transform after:duration-200 data-[active=true]:after:scale-x-100',\n underlined:\n 'rounded-none border-0 border-b-2 border-b-transparent! bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-b-primary! data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-sm!',\n badge:\n 'rounded-none border-0 border-b-2 border-b-transparent! bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-b-primary! data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-none',\n sharp:\n 'rounded-none border border-border/45 border-b-[3px] bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-primary! data-[active=true]:border-b-primary! data-[active=true]:text-primary',\n 'sharp-line':\n 'rounded-none first:rounded-l-sm last:rounded-r-sm border border-border/45 border-b-[3px] bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-primary! data-[active=true]:border-b-primary! data-[active=true]:text-primary',\n 'sharp-line-filled':\n 'rounded-none first:rounded-l-sm last:rounded-r-sm border border-border/45 border-b-[3px] bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-primary! data-[active=true]:border-b-primary! data-[active=true]:bg-primary/30 data-[active=true]:text-primary',\n square:\n 'rounded-none border border-border/45 border-b-[3px] bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-primary! data-[active=true]:border-b-primary! data-[active=true]:bg-primary/15 data-[active=true]:text-primary',\n 'vertical-sharp':\n 'rounded-none border border-transparent border-b-[3px] bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-primary data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-none',\n 'code-line':\n 'relative inline-flex h-full min-h-8 flex-1 items-center justify-center gap-1.5 whitespace-nowrap rounded-none first:rounded-l-sm last:rounded-r-sm border border-border/45 border-b-2 bg-background px-4 py-1.5 font-medium text-foreground/60 transition-all hover:text-foreground data-[active=true]:relative data-[active=true]:z-[1] data-[active=true]:-mb-px data-[active=true]:border-x-primary/70! data-[active=true]:border-t-primary/70! data-[active=true]:border-b-primary! data-[active=true]:bg-primary/30 data-[active=true]:text-primary data-[active=true]:shadow-none [&_span.z-tab-item-label]:font-mono [&_span.z-tab-item-label]:text-[13px]',\n },\n zSize: {\n xs: 'min-h-8 px-2.5 py-1 text-xs',\n sm: 'min-h-9 px-3 py-1.5 text-sm',\n default: 'min-h-10 px-4 py-2 text-sm',\n lg: 'min-h-[2.625rem] px-4.5 py-2.25 text-sm',\n },\n zOrientation: {\n horizontal: '',\n vertical: 'justify-start px-3 py-2',\n },\n },\n compoundVariants: [\n {\n zType: 'line',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-sm data-[active=true]:shadow-xs',\n },\n {\n zType: 'soft',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-md data-[active=true]:bg-primary/10 data-[active=true]:shadow-xs dark:data-[active=true]:bg-primary/15',\n },\n {\n zType: 'segment',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-md data-[active=true]:bg-background data-[active=true]:shadow-xs dark:data-[active=true]:border-border!',\n },\n {\n zType: 'segment-solid',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-md data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:shadow-xs',\n },\n {\n zType: 'pill-solid',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-full data-[active=true]:bg-background data-[active=true]:shadow-sm dark:data-[active=true]:border-border!',\n },\n {\n zType: 'pill-blur',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-full backdrop-blur-md data-[active=true]:bg-background/70 data-[active=true]:shadow-sm',\n },\n {\n zType: 'folder',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-sm data-[active=true]:shadow-xs',\n },\n {\n zType: 'folder-soft',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-sm data-[active=true]:shadow-xs',\n },\n {\n zType: 'folder-solid',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-sm data-[active=true]:shadow-xs',\n },\n {\n zType: 'underline',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-sm data-[active=true]:shadow-xs',\n },\n\n {\n zType: 'underlined',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'badge',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'sharp',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'sharp-line',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'sharp-line-filled',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'square',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'vertical-sharp',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-none border border-transparent border-b-[3px] px-3 py-1.5 data-[active=true]:border-primary data-[active=true]:shadow-xs',\n },\n {\n zType: 'code-line',\n zSize: 'xs',\n zOrientation: 'horizontal',\n class: 'min-h-7 px-3 py-1 text-xs [&_span.z-tab-item-label]:text-xs',\n },\n {\n zType: 'code-line',\n zSize: 'sm',\n zOrientation: 'horizontal',\n class: 'min-h-8 px-3.5 py-1.5 text-sm',\n },\n {\n zType: 'code-line',\n zSize: 'default',\n zOrientation: 'horizontal',\n class: 'min-h-8 px-4 py-1.5 text-sm',\n },\n {\n zType: 'code-line',\n zSize: 'lg',\n zOrientation: 'horizontal',\n class: 'min-h-9 px-4.5 py-2 text-sm',\n },\n {\n zType: 'code-line',\n zOrientation: 'vertical',\n class: 'h-auto w-full flex-none justify-start rounded-none px-3 py-2 data-[active=true]:shadow-xs',\n },\n ],\n defaultVariants: {\n zType: 'line',\n zSize: 'default',\n zOrientation: 'horizontal',\n },\n }\n);\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n computed,\n contentChildren,\n effect,\n ElementRef,\n input,\n model,\n output,\n signal,\n viewChild,\n viewChildren,\n ViewEncapsulation,\n OnDestroy,\n OnInit,\n} from '@angular/core';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';\nimport { ZCacheService } from '@shival99/z-ui/services';\nimport { zMergeClasses } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { NgScrollbar } from 'ngx-scrollbar';\nimport { ZTabPanelDirective } from './directives/z-tab-panel.directive';\nimport { Z_TABS_GLIDE_TYPES, Z_TABS_SCROLL_TOLERANCE } from './z-tabs.define';\nimport type { ZTab, ZTabsContentFit, ZTabsOrientation, ZTabsSize, ZTabsType } from './z-tabs.types';\nimport { zTabsInstanceIds } from './z-tabs.util';\nimport { zTabsVariants, zTabItemVariants } from './z-tabs.variants';\n\n@Component({\n selector: 'z-tabs',\n imports: [\n ZIconComponent,\n ZButtonComponent,\n ZTooltipDirective,\n NgTemplateOutlet,\n ZPopoverDirective,\n TranslatePipe,\n NgScrollbar,\n ],\n standalone: true,\n templateUrl: './z-tabs.component.html',\n styleUrl: './z-tabs.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'z-tabs-wrapper block',\n },\n})\nexport class ZTabsComponent implements OnInit, AfterViewInit, OnDestroy {\n public readonly tabPanels = contentChildren(ZTabPanelDirective);\n public readonly tabsListContainer = viewChild<ElementRef<HTMLDivElement>>('tabsListContainer');\n public readonly tabButtons = viewChildren<ElementRef<HTMLButtonElement>>('tabButton');\n\n public readonly class = input<ClassValue>('');\n public readonly zTabs = input.required<ZTab[]>();\n public readonly zType = input<ZTabsType>('line');\n public readonly zSize = input<ZTabsSize>('default');\n public readonly zOrientation = input<ZTabsOrientation>('horizontal');\n public readonly zContentFit = input<ZTabsContentFit>('none');\n public readonly zLazy = input(false);\n public readonly zDestroyInactive = input(false);\n public readonly zTabsOnly = input(false);\n public readonly zShowNavWrapper = input(false);\n public readonly zNavFullWidth = input(false);\n public readonly zShowContentWrapper = input(true);\n public readonly zReloadable = input(true);\n public readonly zEmitOnActiveClick = input(true);\n public readonly zCache = input(true);\n public readonly zCacheKey = input('');\n\n public readonly activeTab = model<string>('');\n public readonly zTabChange = output<string>();\n\n protected readonly loadedTabs = signal<Set<string>>(new Set());\n protected readonly canScrollLeft = signal(false);\n protected readonly canScrollRight = signal(false);\n protected readonly bouncingTab = signal<string | null>(null);\n\n protected readonly isGlideType = computed(\n () => Z_TABS_GLIDE_TYPES.includes(this.zType()) && this.zOrientation() === 'horizontal'\n );\n\n protected readonly glideStyle = signal<{ transform: string; width: string; height: string } | null>(null);\n protected readonly glideReady = signal(false);\n protected readonly glideSquashing = signal(false);\n\n protected readonly panelRenderStates = computed(\n () =>\n new Map(\n this.tabPanels().map(panel => {\n const tabValue = panel.zTabPanel();\n\n if (this.zDestroyInactive()) {\n return [tabValue, this.activeTab() === tabValue] as const;\n }\n\n if (!this.zLazy()) {\n return [tabValue, true] as const;\n }\n\n return [tabValue, this.loadedTabs().has(tabValue) || this.activeTab() === tabValue] as const;\n })\n )\n );\n\n private _resizeObserver?: ResizeObserver;\n private readonly _cacheInstanceId = zTabsInstanceIds.next();\n\n constructor() {\n effect(() => {\n this.zTabs();\n requestAnimationFrame(() => this.checkScroll());\n });\n\n effect(() => {\n this.activeTab();\n this.zTabs();\n this.isGlideType();\n requestAnimationFrame(() => this._updateGlideIndicator());\n });\n }\n\n ngOnInit(): void {\n this._restoreActiveTabFromCache();\n }\n\n ngAfterViewInit(): void {\n this.checkScroll();\n this._setupResizeObserver();\n requestAnimationFrame(() => this._updateGlideIndicator());\n }\n\n ngOnDestroy(): void {\n this._resizeObserver?.disconnect();\n }\n\n protected readonly tabsClasses = computed(() =>\n zMergeClasses(\n zTabsVariants({\n zType: this.zType(),\n zOrientation: this.zOrientation(),\n }),\n this.zNavFullWidth() ? 'w-full' : '',\n this.class()\n )\n );\n\n protected readonly contentWrapperFramed = computed(() => {\n if (!this.zShowContentWrapper()) {\n return false;\n }\n\n if (this.zOrientation() === 'vertical') {\n return false;\n }\n\n const type = this.zType();\n return (\n type === 'folder' ||\n type === 'folder-soft' ||\n type === 'folder-solid' ||\n type === 'sharp' ||\n type === 'sharp-line' ||\n type === 'sharp-line-filled' ||\n type === 'square' ||\n type === 'code-line'\n );\n });\n\n protected readonly tabsListHasBottomPadding = computed(() => {\n if (this.zOrientation() !== 'horizontal') {\n return false;\n }\n\n const type = this.zType();\n return (\n type !== 'folder' &&\n type !== 'folder-soft' &&\n type !== 'folder-solid' &&\n type !== 'segment' &&\n type !== 'segment-solid' &&\n type !== 'pill-solid' &&\n type !== 'pill-blur' &&\n type !== 'sharp' &&\n type !== 'sharp-line' &&\n type !== 'sharp-line-filled' &&\n type !== 'square' &&\n type !== 'code-line'\n );\n });\n\n protected readonly verticalTabsScrollable = computed(\n () => this.zOrientation() === 'vertical' && this.zTabs().length > 8\n );\n\n protected getTabItemClasses(_tab: ZTab): string {\n return zMergeClasses(\n zTabItemVariants({\n zType: this.zType(),\n zSize: this.zSize(),\n zOrientation: this.zOrientation(),\n })\n );\n }\n\n protected selectTab(tab: ZTab, scrollToView = true): void {\n if (tab.disabled) {\n return;\n }\n\n const isAlreadyActive = this.activeTab() === tab.value;\n if (isAlreadyActive && !this.zReloadable()) {\n return;\n }\n\n this.activeTab.set(tab.value);\n this._saveActiveTabToCache(tab.value);\n\n if (this.isGlideType()) {\n requestAnimationFrame(() => this._updateGlideIndicator());\n }\n\n if (this.isGlideType()) {\n this.bouncingTab.set(tab.value);\n setTimeout(() => {\n if (this.bouncingTab() === tab.value) {\n this.bouncingTab.set(null);\n }\n }, 320);\n }\n\n if (!isAlreadyActive && this.isGlideType()) {\n this.glideSquashing.set(true);\n setTimeout(() => this.glideSquashing.set(false), 420);\n }\n\n if (!isAlreadyActive || this.zEmitOnActiveClick()) {\n this.zTabChange.emit(tab.value);\n }\n\n if (this.zLazy()) {\n this.loadedTabs.update(tabs => {\n const newTabs = new Set(tabs);\n newTabs.add(tab.value);\n return newTabs;\n });\n }\n\n if (scrollToView && this.zOrientation() === 'horizontal') {\n requestAnimationFrame(() => {\n const tabIndex = this.zTabs().findIndex(t => t.value === tab.value);\n const tabButtonsList = this.tabButtons();\n const tabButton = tabButtonsList[tabIndex];\n if (tabButton) {\n const alignTabInViewport = () => {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container) {\n return;\n }\n\n const containerRect = container.getBoundingClientRect();\n const tabRect = tabButton.nativeElement.getBoundingClientRect();\n const centeredScrollLeft =\n container.scrollLeft + tabRect.left - containerRect.left - (container.clientWidth - tabRect.width) / 2;\n const maxScrollLeft = container.scrollWidth - container.clientWidth;\n\n container.scrollTo({\n left: Math.max(0, Math.min(centeredScrollLeft, maxScrollLeft)),\n behavior: 'smooth',\n });\n };\n\n alignTabInViewport();\n setTimeout(() => {\n alignTabInViewport();\n }, 320);\n }\n });\n }\n }\n\n protected isTabActive(tab: ZTab): boolean {\n return this.activeTab() === tab.value;\n }\n\n protected onTabKeydown(event: KeyboardEvent, currentIndex: number): void {\n const tabs = this.zTabs().filter(t => !t.disabled);\n const currentTab = tabs[currentIndex];\n\n if (!currentTab) {\n return;\n }\n\n const isHorizontal = this.zOrientation() === 'horizontal';\n const nextKey = isHorizontal ? 'ArrowRight' : 'ArrowDown';\n const prevKey = isHorizontal ? 'ArrowLeft' : 'ArrowUp';\n\n if (event.key === nextKey) {\n event.preventDefault();\n const nextIndex = (currentIndex + 1) % tabs.length;\n this.selectTab(tabs[nextIndex]);\n return;\n }\n\n if (event.key === prevKey) {\n event.preventDefault();\n const prevIndex = (currentIndex - 1 + tabs.length) % tabs.length;\n this.selectTab(tabs[prevIndex]);\n return;\n }\n\n if (event.key === 'Home') {\n event.preventDefault();\n this.selectTab(tabs[0]);\n return;\n }\n\n if (event.key === 'End') {\n event.preventDefault();\n this.selectTab(tabs[tabs.length - 1]);\n }\n }\n\n protected checkScroll(): void {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container || this.zOrientation() !== 'horizontal') {\n this.canScrollLeft.set(false);\n this.canScrollRight.set(false);\n return;\n }\n\n const { scrollLeft, scrollWidth, clientWidth } = container;\n const maxScrollLeft = scrollWidth - clientWidth;\n\n if (maxScrollLeft <= Z_TABS_SCROLL_TOLERANCE) {\n container.scrollLeft = 0;\n this.canScrollLeft.set(false);\n this.canScrollRight.set(false);\n return;\n }\n\n this.canScrollLeft.set(scrollLeft > Z_TABS_SCROLL_TOLERANCE);\n this.canScrollRight.set(maxScrollLeft - scrollLeft > Z_TABS_SCROLL_TOLERANCE);\n }\n\n protected scrollLeft(): void {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container) {\n return;\n }\n\n container.scrollBy({ left: -200, behavior: 'smooth' });\n setTimeout(() => this.checkScroll(), 300);\n }\n\n protected scrollRight(): void {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container) {\n return;\n }\n\n container.scrollBy({ left: 200, behavior: 'smooth' });\n setTimeout(() => this.checkScroll(), 300);\n }\n\n protected onTabsScroll(): void {\n this.checkScroll();\n }\n\n private _updateGlideIndicator(): void {\n if (!this.isGlideType()) {\n this.glideStyle.set(null);\n this.glideReady.set(false);\n return;\n }\n\n const activeIndex = this.zTabs().findIndex(tab => tab.value === this.activeTab());\n const button = this.tabButtons()[activeIndex]?.nativeElement;\n if (!button) {\n return;\n }\n\n this.glideStyle.set({\n transform: `translate(${button.offsetLeft}px, ${button.offsetTop}px)`,\n width: `${button.offsetWidth}px`,\n height: `${button.offsetHeight}px`,\n });\n\n if (!this.glideReady()) {\n requestAnimationFrame(() => this.glideReady.set(true));\n }\n }\n\n private _setupResizeObserver(): void {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container) {\n return;\n }\n\n this._resizeObserver = new ResizeObserver(() => {\n this.checkScroll();\n this._updateGlideIndicator();\n });\n\n this._resizeObserver.observe(container);\n }\n\n private _restoreActiveTabFromCache(): void {\n if (!this.zCache()) {\n return;\n }\n\n const cacheKey = this._getCacheKey();\n const cachedTab = ZCacheService.get<string>(cacheKey);\n if (!cachedTab) {\n return;\n }\n\n const tab = this.zTabs().find(item => item.value === cachedTab && !item.disabled);\n if (!tab) {\n return;\n }\n\n this.activeTab.set(tab.value);\n\n if (this.zLazy()) {\n this.loadedTabs.update(tabs => {\n const newTabs = new Set(tabs);\n newTabs.add(tab.value);\n return newTabs;\n });\n }\n }\n\n private _saveActiveTabToCache(value: string): void {\n if (!this.zCache()) {\n return;\n }\n\n ZCacheService.set(this._getCacheKey(), value);\n }\n\n private _getCacheKey(): string {\n const customKey = this.zCacheKey().trim();\n if (customKey) {\n return customKey;\n }\n\n const path = typeof window === 'undefined' ? 'ssr' : window.location.pathname;\n return `z-tabs:${path}:${this._cacheInstanceId}`;\n }\n\n protected scrollToActiveDropdownItem(): void {\n setTimeout(() => {\n const activeIndex = this.zTabs().findIndex(tab => tab.value === this.activeTab());\n if (activeIndex === -1) {\n return;\n }\n\n const dropdownMenu = document.querySelector('.z-tabs-dropdown-menu') as HTMLElement;\n if (!dropdownMenu) {\n return;\n }\n\n const dropdownItems = Array.from(dropdownMenu.querySelectorAll('button'));\n const activeItem = dropdownItems[activeIndex];\n\n if (activeItem && dropdownMenu) {\n const menuRect = dropdownMenu.getBoundingClientRect();\n const itemRect = activeItem.getBoundingClientRect();\n const scrollTop = activeItem.offsetTop - menuRect.height / 2 + itemRect.height / 2;\n\n dropdownMenu.scrollTo({\n top: scrollTop,\n behavior: 'smooth',\n });\n }\n }, 150);\n }\n}\n","<div\n class=\"z-tabs-container flex gap-1\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-content-fit]=\"zContentFit()\"\n [class.flex-col]=\"!zTabsOnly()\"\n [class.flex-row]=\"zOrientation() === 'vertical'\"\n [class.gap-4]=\"zOrientation() === 'vertical'\">\n <!-- Tabs Navigation (Left/Scroll/Tabs/Right/Dropdown) -->\n <div\n class=\"z-tabs-nav flex items-center gap-1.5\"\n [class.z-tabs-nav-surface]=\"zShowNavWrapper() && isGlideType()\"\n [class.w-full]=\"zOrientation() === 'horizontal' && (!zShowNavWrapper() || zNavFullWidth())\"\n [class.w-fit]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.max-w-full]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.w-auto]=\"zOrientation() === 'vertical'\"\n [class.shrink-0]=\"zOrientation() === 'vertical'\">\n <!-- Scroll Left Button -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n [zWave]=\"false\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollLeft()\"\n aria-label=\"Scroll left\">\n <z-icon zType=\"lucideChevronLeft\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Tabs List Container with Scroll + Fade -->\n <div\n class=\"z-tabs-scroll-container relative min-w-0 flex-1\"\n [class.z-tabs-scroll-container-surface]=\"canScrollLeft() || canScrollRight()\"\n [attr.data-type]=\"zType()\">\n @if (zOrientation() === 'vertical') {\n <ng-scrollbar\n class=\"z-tabs-scroll-wrapper z-tabs-scrollbar vertical\"\n [class.z-tabs-scroll-wrapper-limited]=\"verticalTabsScrollable()\"\n track=\"vertical\"\n orientation=\"vertical\"\n appearance=\"compact\"\n visibility=\"hover\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </ng-scrollbar>\n } @else {\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.z-tabs-scroll-wrapper-scrollable]=\"canScrollLeft() || canScrollRight()\"\n [class.z-tabs-scroll-wrapper-fade-left]=\"canScrollLeft()\"\n [class.z-tabs-scroll-wrapper-fade-right]=\"canScrollRight()\"\n (scroll)=\"onTabsScroll()\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </div>\n }\n </div>\n\n <!-- Scroll Right Button -->\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollRight()\"\n [zWave]=\"false\"\n aria-label=\"Scroll right\">\n <z-icon zType=\"lucideChevronRight\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Dropdown Button (Mobile or Overflow) -->\n @if (zOrientation() === 'horizontal' && (canScrollLeft() || canScrollRight())) {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[6.25rem] max-w-[12.5rem]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <ng-template #tabsListTpl>\n <!-- Tab List -->\n <div\n [class]=\"tabsClasses()\"\n [class.pb-0.5]=\"tabsListHasBottomPadding()\"\n role=\"tablist\"\n [attr.aria-orientation]=\"zOrientation()\"\n [attr.data-type]=\"zType()\">\n @if (isGlideType() && glideStyle(); as style) {\n <div\n class=\"z-tabs-glide-indicator pointer-events-none absolute top-0 left-0 z-[6]\"\n [class.z-tabs-glide-indicator-ready]=\"glideReady()\"\n [attr.data-type]=\"zType()\"\n [style.transform]=\"style.transform\"\n [style.width]=\"style.width\"\n [style.height]=\"style.height\"\n aria-hidden=\"true\">\n <div class=\"z-tabs-glide-indicator-fill\" [class.z-tabs-glide-indicator-squash]=\"glideSquashing()\"></div>\n </div>\n }\n @for (tab of zTabs(); track tab.value; let idx = $index; let last = $last) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.data-state]=\"isTabActive(tab) ? 'active' : 'inactive'\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-last]=\"last\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n z-tooltip\n [zContent]=\"zOrientation() === 'vertical' ? (tab.label | translate) : ''\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n (click)=\"selectTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon\n [zType]=\"tab.icon\"\n zSize=\"16\"\n class=\"shrink-0\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\" />\n }\n <span\n class=\"z-tab-item-label min-w-0 flex-1 truncate text-left\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"ring-background ml-1.5 inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold ring-2\"\n [class.bg-primary]=\"zType() !== 'badge'\"\n [class.text-primary-foreground]=\"zType() !== 'badge'\"\n [class.bg-primary!]=\"zType() === 'badge'\"\n [class.text-primary-foreground!]=\"zType() === 'badge'\">\n {{ tab.badge }}\n </span>\n }\n </button>\n }\n </div>\n </ng-template>\n\n <!-- Tab Panels -->\n @if (!zTabsOnly()) {\n <div\n class=\"z-tabs-panels min-h-0\"\n [class.flex-1]=\"zOrientation() === 'vertical'\"\n [class.shadow-xs]=\"contentWrapperFramed()\"\n [class.z-tabs-panels-unwrapped]=\"!contentWrapperFramed()\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (panelRenderStates().get(panel.zTabPanel())) {\n <div\n role=\"tabpanel\"\n [id]=\"'panel-' + panel.zTabPanel()\"\n [attr.aria-labelledby]=\"panel.zTabPanel()\"\n [hidden]=\"activeTab() !== panel.zTabPanel()\">\n <ng-container *ngTemplateOutlet=\"panel.template\" />\n </div>\n }\n }\n </div>\n }\n</div>\n\n<!-- Dropdown Menu Template -->\n<ng-template #dropdownTpl let-close=\"close\">\n <div\n class=\"z-tabs-dropdown-menu flex max-h-[18.75rem] max-w-[12.5rem] min-w-[6.25rem] flex-col gap-0.5 overflow-y-auto p-1\">\n @for (tab of zTabs(); track tab.value) {\n <button\n #dropdownItem\n type=\"button\"\n class=\"flex w-full cursor-pointer items-center justify-start gap-2 rounded-sm px-2 py-1.5 text-left text-sm font-medium transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:text-foreground]=\"!isTabActive(tab)\"\n [class.focus:bg-primary/10]=\"!isTabActive(tab)\"\n [class.bg-primary/15]=\"isTabActive(tab)\"\n [class.text-primary]=\"isTabActive(tab)\"\n [disabled]=\"tab.disabled\"\n (click)=\"selectTab(tab, true); close()\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"min-w-0 flex-1 truncate\"\n z-tooltip\n [zContent]=\"tab.label | translate\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n [zTriggerElement]=\"dropdownItem\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold\">\n {{ tab.badge }}\n </span>\n }\n @if (isTabActive(tab)) {\n <z-icon zType=\"lucideCheck\" zSize=\"16\" class=\"text-primary shink-0\" />\n }\n </button>\n }\n </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"shival99-z-ui-components-z-tabs.mjs","sources":["../../../../libs/core-ui/components/z-tabs/directives/z-tab-panel.directive.ts","../../../../libs/core-ui/components/z-tabs/z-tabs.define.ts","../../../../libs/core-ui/components/z-tabs/z-tabs.util.ts","../../../../libs/core-ui/components/z-tabs/z-tabs.variants.ts","../../../../libs/core-ui/components/z-tabs/z-tabs.component.ts","../../../../libs/core-ui/components/z-tabs/z-tabs.component.html","../../../../libs/core-ui/components/z-tabs/shival99-z-ui-components-z-tabs.ts"],"sourcesContent":["import { Directive, inject, input, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[z-tab-panel], [zTabPanel]',\n standalone: true,\n exportAs: 'zTabPanel',\n})\nexport class ZTabPanelDirective {\n public readonly zTabPanel = input.required<string>();\n public readonly template = inject(TemplateRef<unknown>);\n}\n","import type { ZTabsType } from './z-tabs.types';\n\n/** Minimum scroll-position delta (px) before the fade/scroll-button state is toggled. */\nexport const Z_TABS_SCROLL_TOLERANCE = 4;\n\n/**\n * Types that render a shared pill behind the active tab and glide it into place instead of\n * swapping each item's own background.\n */\nexport const Z_TABS_GLIDE_TYPES: ZTabsType[] = ['segment', 'segment-solid', 'pill-solid', 'pill-blur'];\n","/** Hands out a fresh, monotonically increasing id for scoping each `z-tabs` instance's cache key. */\nexport const zTabsInstanceIds = (() => {\n let counter = 0;\n return { next: (): number => ++counter };\n})();\n\n/** Queues low-priority panel work on idle time, falling back to a timer where `requestIdleCallback` is missing. */\nexport function zTabsRequestIdle(task: () => void, timeout = 200): number {\n if (typeof window === 'undefined') {\n return 0;\n }\n\n const idle = window.requestIdleCallback;\n return idle ? idle(() => task(), { timeout }) : window.setTimeout(task, 0);\n}\n\n/** Cancels a handle returned by `zTabsRequestIdle`, regardless of which scheduler produced it. */\nexport function zTabsCancelIdle(handle: number | undefined): void {\n if (!handle || typeof window === 'undefined') {\n return;\n }\n\n const cancel = window.cancelIdleCallback;\n if (cancel) {\n cancel(handle);\n return;\n }\n\n window.clearTimeout(handle);\n}\n","import { cva } from 'class-variance-authority';\n\nexport const zTabsVariants = cva('z-tabs flex min-w-0', {\n variants: {\n zType: {\n line: 'gap-0',\n soft: 'gap-1 bg-background p-0 dark:bg-transparent',\n segment: 'relative gap-1 rounded-lg bg-muted/60 p-1 dark:bg-muted/35',\n 'segment-solid': 'relative gap-1 rounded-lg bg-muted/60 p-1 dark:bg-muted/35',\n 'pill-solid': 'relative gap-1 rounded-full bg-muted/60 p-1 dark:bg-muted/35',\n 'pill-blur': 'relative gap-1 rounded-full bg-muted/40 p-1 backdrop-blur-md dark:bg-muted/20',\n folder: 'isolate gap-0 bg-background p-0 dark:bg-transparent',\n 'folder-soft': 'isolate gap-0 bg-background p-0 dark:bg-transparent',\n 'folder-solid': 'isolate gap-0 bg-background p-0 dark:bg-transparent',\n underline: 'gap-0',\n underlined: 'gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n badge: 'gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n sharp: 'gap-1 rounded-none bg-background p-0 dark:bg-transparent',\n 'sharp-line': 'gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n 'sharp-line-filled': 'gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n square: 'gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n 'vertical-sharp': 'gap-1 rounded-none bg-background p-0 dark:bg-transparent',\n 'code-line': 'h-10 w-full justify-start gap-0 rounded-none bg-background p-0 dark:bg-transparent',\n },\n zOrientation: {\n horizontal: 'w-max flex-row items-center',\n vertical: 'w-full flex-col items-stretch gap-1 border-b-0',\n },\n },\n defaultVariants: {\n zType: 'line',\n zOrientation: 'horizontal',\n },\n compoundVariants: [\n {\n zType: 'vertical-sharp',\n zOrientation: 'vertical',\n class: 'border-r-0 pr-0',\n },\n {\n zType: 'sharp-line',\n zOrientation: 'vertical',\n class: 'gap-0',\n },\n {\n zType: 'sharp-line-filled',\n zOrientation: 'vertical',\n class: 'gap-0',\n },\n ],\n});\n\nexport const zTabItemVariants = cva(\n 'z-tab-item relative inline-flex min-h-10 select-none items-center justify-center gap-2 whitespace-nowrap font-medium text-sm leading-none text-muted-foreground transition-[color,background-color,border-color,box-shadow,transform] duration-200 outline-none focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 cursor-pointer disabled:opacity-45 disabled:cursor-not-allowed',\n {\n variants: {\n zType: {\n line: 'rounded-none border-0 hover:text-foreground data-[active=true]:text-primary after:pointer-events-none after:absolute after:inset-x-0 after:bottom-[-1px] after:h-1 after:bg-primary after:origin-center after:scale-x-0 after:transition-transform after:duration-200 data-[active=true]:after:scale-x-100',\n soft: 'rounded-md border-0 text-muted-foreground hover:text-foreground data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-xs! dark:data-[active=true]:bg-primary/15',\n segment: 'z-10 rounded-md border-0 text-muted-foreground hover:text-foreground data-[active=true]:text-primary',\n 'segment-solid':\n 'z-10 rounded-md border-0 text-muted-foreground hover:text-foreground data-[active=true]:text-primary-foreground',\n 'pill-solid':\n 'z-10 rounded-full border-0 text-muted-foreground hover:text-foreground data-[active=true]:text-primary',\n 'pill-blur':\n 'z-10 rounded-full border-0 text-muted-foreground hover:text-foreground data-[active=true]:text-primary',\n folder:\n 'rounded-t-md border-0 bg-transparent text-muted-foreground shadow-[inset_0_-1px_0_var(--border)] hover:text-foreground focus-visible:ring-0 focus-visible:ring-offset-0 data-[active=true]:z-[2] data-[active=true]:bg-background data-[active=true]:text-primary data-[active=true]:shadow-[inset_1px_0_0_var(--border),inset_-1px_0_0_var(--border),inset_0_1px_0_var(--border)]',\n 'folder-soft':\n 'rounded-t-md border-0 bg-transparent text-muted-foreground shadow-[inset_0_-1px_0_var(--border)] hover:text-foreground focus-visible:ring-0 focus-visible:ring-offset-0 data-[active=true]:z-[2] data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-[inset_1px_0_0_var(--border),inset_-1px_0_0_var(--border),inset_0_1px_0_var(--border)] dark:data-[active=true]:bg-primary/15',\n 'folder-solid':\n 'rounded-t-md border-0 bg-transparent text-muted-foreground shadow-[inset_0_-1px_0_var(--border)] hover:text-foreground focus-visible:ring-0 focus-visible:ring-offset-0 data-[active=true]:z-[2] data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:shadow-[inset_1px_0_0_var(--primary),inset_-1px_0_0_var(--primary),inset_0_1px_0_var(--primary)]',\n underline:\n 'hover:text-foreground data-[active=true]:text-primary after:pointer-events-none after:absolute after:inset-x-1 after:bottom-[-1px] after:h-[0.1875rem] after:bg-primary after:origin-center after:scale-x-0 after:transition-transform after:duration-200 data-[active=true]:after:scale-x-100',\n underlined:\n 'rounded-none border-0 border-b-2 border-b-transparent! bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-b-primary! data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-sm!',\n badge:\n 'rounded-none border-0 border-b-2 border-b-transparent! bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-b-primary! data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-none',\n sharp:\n 'rounded-none border border-border/45 border-b-[3px] bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-primary! data-[active=true]:border-b-primary! data-[active=true]:text-primary',\n 'sharp-line':\n 'rounded-none first:rounded-l-sm last:rounded-r-sm border border-border/45 border-b-[3px] bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-primary! data-[active=true]:border-b-primary! data-[active=true]:text-primary',\n 'sharp-line-filled':\n 'rounded-none first:rounded-l-sm last:rounded-r-sm border border-border/45 border-b-[3px] bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-primary! data-[active=true]:border-b-primary! data-[active=true]:bg-primary/30 data-[active=true]:text-primary',\n square:\n 'rounded-none border border-border/45 border-b-[3px] bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-primary! data-[active=true]:border-b-primary! data-[active=true]:bg-primary/15 data-[active=true]:text-primary',\n 'vertical-sharp':\n 'rounded-none border border-transparent border-b-[3px] bg-background text-foreground/60 hover:text-foreground data-[active=true]:border-primary data-[active=true]:bg-primary/10 data-[active=true]:text-primary data-[active=true]:shadow-none',\n 'code-line':\n 'relative inline-flex h-full min-h-8 flex-1 items-center justify-center gap-1.5 whitespace-nowrap rounded-none first:rounded-l-sm last:rounded-r-sm border border-border/45 border-b-2 bg-background px-4 py-1.5 font-medium text-foreground/60 transition-all hover:text-foreground data-[active=true]:relative data-[active=true]:z-[1] data-[active=true]:-mb-px data-[active=true]:border-x-primary/70! data-[active=true]:border-t-primary/70! data-[active=true]:border-b-primary! data-[active=true]:bg-primary/30 data-[active=true]:text-primary data-[active=true]:shadow-none [&_span.z-tab-item-label]:font-mono [&_span.z-tab-item-label]:text-[13px]',\n },\n zSize: {\n xs: 'min-h-8 px-2.5 py-1 text-xs',\n sm: 'min-h-9 px-3 py-1.5 text-sm',\n default: 'min-h-10 px-4 py-2 text-sm',\n lg: 'min-h-[2.625rem] px-4.5 py-2.25 text-sm',\n },\n zOrientation: {\n horizontal: '',\n vertical: 'justify-start px-3 py-2',\n },\n },\n compoundVariants: [\n {\n zType: 'line',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-sm data-[active=true]:shadow-xs',\n },\n {\n zType: 'soft',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-md data-[active=true]:bg-primary/10 data-[active=true]:shadow-xs dark:data-[active=true]:bg-primary/15',\n },\n {\n zType: 'segment',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-md data-[active=true]:bg-background data-[active=true]:shadow-xs dark:data-[active=true]:border-border!',\n },\n {\n zType: 'segment-solid',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-md data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:shadow-xs',\n },\n {\n zType: 'pill-solid',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-full data-[active=true]:bg-background data-[active=true]:shadow-sm dark:data-[active=true]:border-border!',\n },\n {\n zType: 'pill-blur',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-full backdrop-blur-md data-[active=true]:bg-background/70 data-[active=true]:shadow-sm',\n },\n {\n zType: 'folder',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-sm data-[active=true]:shadow-xs',\n },\n {\n zType: 'folder-soft',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-sm data-[active=true]:shadow-xs',\n },\n {\n zType: 'folder-solid',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-sm data-[active=true]:shadow-xs',\n },\n {\n zType: 'underline',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-sm data-[active=true]:shadow-xs',\n },\n\n {\n zType: 'underlined',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'badge',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'sharp',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'sharp-line',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'sharp-line-filled',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'square',\n zOrientation: 'vertical',\n class: 'w-full justify-start rounded-none data-[active=true]:shadow-xs',\n },\n {\n zType: 'vertical-sharp',\n zOrientation: 'vertical',\n class:\n 'w-full justify-start rounded-none border border-transparent border-b-[3px] px-3 py-1.5 data-[active=true]:border-primary data-[active=true]:shadow-xs',\n },\n {\n zType: 'code-line',\n zSize: 'xs',\n zOrientation: 'horizontal',\n class: 'min-h-7 px-3 py-1 text-xs [&_span.z-tab-item-label]:text-xs',\n },\n {\n zType: 'code-line',\n zSize: 'sm',\n zOrientation: 'horizontal',\n class: 'min-h-8 px-3.5 py-1.5 text-sm',\n },\n {\n zType: 'code-line',\n zSize: 'default',\n zOrientation: 'horizontal',\n class: 'min-h-8 px-4 py-1.5 text-sm',\n },\n {\n zType: 'code-line',\n zSize: 'lg',\n zOrientation: 'horizontal',\n class: 'min-h-9 px-4.5 py-2 text-sm',\n },\n {\n zType: 'code-line',\n zOrientation: 'vertical',\n class: 'h-auto w-full flex-none justify-start rounded-none px-3 py-2 data-[active=true]:shadow-xs',\n },\n ],\n defaultVariants: {\n zType: 'line',\n zSize: 'default',\n zOrientation: 'horizontal',\n },\n }\n);\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n computed,\n contentChildren,\n effect,\n ElementRef,\n input,\n model,\n output,\n signal,\n viewChild,\n untracked,\n viewChildren,\n ViewEncapsulation,\n OnDestroy,\n OnInit,\n} from '@angular/core';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';\nimport { ZCacheService } from '@shival99/z-ui/services';\nimport { zMergeClasses } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { NgScrollbar } from 'ngx-scrollbar';\nimport { ZTabPanelDirective } from './directives/z-tab-panel.directive';\nimport { Z_TABS_GLIDE_TYPES, Z_TABS_SCROLL_TOLERANCE } from './z-tabs.define';\nimport type { ZTab, ZTabsContentFit, ZTabsOrientation, ZTabsPreload, ZTabsSize, ZTabsType } from './z-tabs.types';\nimport { zTabsCancelIdle, zTabsInstanceIds, zTabsRequestIdle } from './z-tabs.util';\nimport { zTabsVariants, zTabItemVariants } from './z-tabs.variants';\n\n@Component({\n selector: 'z-tabs',\n imports: [\n ZIconComponent,\n ZButtonComponent,\n ZTooltipDirective,\n NgTemplateOutlet,\n ZPopoverDirective,\n TranslatePipe,\n NgScrollbar,\n ],\n standalone: true,\n templateUrl: './z-tabs.component.html',\n styleUrl: './z-tabs.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'z-tabs-wrapper block',\n },\n})\nexport class ZTabsComponent implements OnInit, AfterViewInit, OnDestroy {\n public readonly tabPanels = contentChildren(ZTabPanelDirective);\n public readonly tabsListContainer = viewChild<ElementRef<HTMLDivElement>>('tabsListContainer');\n public readonly tabButtons = viewChildren<ElementRef<HTMLButtonElement>>('tabButton');\n\n public readonly class = input<ClassValue>('');\n public readonly zTabs = input.required<ZTab[]>();\n public readonly zType = input<ZTabsType>('line');\n public readonly zSize = input<ZTabsSize>('default');\n public readonly zOrientation = input<ZTabsOrientation>('horizontal');\n public readonly zContentFit = input<ZTabsContentFit>('none');\n public readonly zLazy = input(false);\n public readonly zPreload = input<ZTabsPreload>('hover');\n public readonly zDestroyInactive = input(false);\n public readonly zTabsOnly = input(false);\n public readonly zShowNavWrapper = input(false);\n public readonly zNavFullWidth = input(false);\n public readonly zClassContent = input<ClassValue>('');\n public readonly zShowContentWrapper = input(true);\n public readonly zReloadable = input(true);\n public readonly zEmitOnActiveClick = input(true);\n public readonly zCache = input(true);\n public readonly zCacheKey = input('');\n\n public readonly activeTab = model<string>('');\n public readonly zTabChange = output<string>();\n\n protected readonly mountedTabs = signal<Set<string>>(new Set());\n protected readonly renderedTab = signal<string>('');\n protected readonly canScrollLeft = signal(false);\n protected readonly canScrollRight = signal(false);\n protected readonly bouncingTab = signal<string | null>(null);\n\n protected readonly isGlideType = computed(\n () => Z_TABS_GLIDE_TYPES.includes(this.zType()) && this.zOrientation() === 'horizontal'\n );\n\n protected readonly glideStyle = signal<{ transform: string; width: string; height: string } | null>(null);\n protected readonly glideReady = signal(false);\n\n /** With `zDestroyInactive` the single rendered panel is the visible one, so it never collapses mid-swap. */\n protected readonly visiblePanel = computed(() => (this.zDestroyInactive() ? this.renderedTab() : this.activeTab()));\n\n protected readonly panelRenderStates = computed(\n () =>\n new Map(\n this.tabPanels().map(panel => {\n const tabValue = panel.zTabPanel();\n\n if (this.zDestroyInactive()) {\n return [tabValue, this.renderedTab() === tabValue] as const;\n }\n\n if (!this.zLazy()) {\n return [tabValue, true] as const;\n }\n\n return [tabValue, this.mountedTabs().has(tabValue)] as const;\n })\n )\n );\n\n private _resizeObserver?: ResizeObserver;\n private _mountFrame?: number;\n private _idleHandle?: number;\n private _viewReady = false;\n private readonly _cacheInstanceId = zTabsInstanceIds.next();\n\n constructor() {\n effect(() => {\n this.zTabs();\n requestAnimationFrame(() => this.checkScroll());\n });\n\n effect(() => {\n this.activeTab();\n this.zTabs();\n this.isGlideType();\n requestAnimationFrame(() => this._updateGlideIndicator());\n });\n\n effect(() => {\n const active = this.activeTab();\n untracked(() => this._scheduleCommit(active));\n });\n }\n\n ngOnInit(): void {\n this._restoreActiveTabFromCache();\n }\n\n ngAfterViewInit(): void {\n this._viewReady = true;\n this.checkScroll();\n this._setupResizeObserver();\n requestAnimationFrame(() => this._updateGlideIndicator());\n this._preloadNextIdlePanel();\n }\n\n ngOnDestroy(): void {\n this._resizeObserver?.disconnect();\n zTabsCancelIdle(this._idleHandle);\n if (this._mountFrame !== undefined) {\n cancelAnimationFrame(this._mountFrame);\n }\n }\n\n protected readonly tabsClasses = computed(() =>\n zMergeClasses(\n zTabsVariants({\n zType: this.zType(),\n zOrientation: this.zOrientation(),\n }),\n this.zNavFullWidth() ? 'w-full' : '',\n this.class()\n )\n );\n\n protected readonly contentWrapperFramed = computed(() => {\n if (!this.zShowContentWrapper()) {\n return false;\n }\n\n if (this.zOrientation() === 'vertical') {\n return false;\n }\n\n const type = this.zType();\n return (\n type === 'folder' ||\n type === 'folder-soft' ||\n type === 'folder-solid' ||\n type === 'sharp' ||\n type === 'sharp-line' ||\n type === 'sharp-line-filled' ||\n type === 'square' ||\n type === 'code-line'\n );\n });\n\n protected readonly tabsListHasBottomPadding = computed(() => {\n if (this.zOrientation() !== 'horizontal') {\n return false;\n }\n\n const type = this.zType();\n return (\n type !== 'folder' &&\n type !== 'folder-soft' &&\n type !== 'folder-solid' &&\n type !== 'segment' &&\n type !== 'segment-solid' &&\n type !== 'pill-solid' &&\n type !== 'pill-blur' &&\n type !== 'sharp' &&\n type !== 'sharp-line' &&\n type !== 'sharp-line-filled' &&\n type !== 'square' &&\n type !== 'code-line'\n );\n });\n\n protected readonly verticalTabsScrollable = computed(\n () => this.zOrientation() === 'vertical' && this.zTabs().length > 8\n );\n\n protected readonly navClasses = computed(() =>\n zMergeClasses('z-tabs-nav flex items-center gap-1.5', this.zClassContent())\n );\n\n protected getTabItemClasses(_tab: ZTab): string {\n return zMergeClasses(\n zTabItemVariants({\n zType: this.zType(),\n zSize: this.zSize(),\n zOrientation: this.zOrientation(),\n })\n );\n }\n\n protected selectTab(tab: ZTab, scrollToView = true): void {\n if (tab.disabled) {\n return;\n }\n\n const isAlreadyActive = this.activeTab() === tab.value;\n if (isAlreadyActive && !this.zReloadable()) {\n return;\n }\n\n this.activeTab.set(tab.value);\n this._saveActiveTabToCache(tab.value);\n\n if (this.isGlideType()) {\n requestAnimationFrame(() => this._updateGlideIndicator());\n }\n\n if (this.isGlideType()) {\n this.bouncingTab.set(tab.value);\n setTimeout(() => {\n if (this.bouncingTab() === tab.value) {\n this.bouncingTab.set(null);\n }\n }, 320);\n }\n\n if (!isAlreadyActive || this.zEmitOnActiveClick()) {\n this.zTabChange.emit(tab.value);\n }\n\n if (scrollToView && this.zOrientation() === 'horizontal') {\n requestAnimationFrame(() => {\n const tabIndex = this.zTabs().findIndex(t => t.value === tab.value);\n const tabButtonsList = this.tabButtons();\n const tabButton = tabButtonsList[tabIndex];\n if (tabButton) {\n const alignTabInViewport = () => {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container) {\n return;\n }\n\n const containerRect = container.getBoundingClientRect();\n const tabRect = tabButton.nativeElement.getBoundingClientRect();\n const centeredScrollLeft =\n container.scrollLeft + tabRect.left - containerRect.left - (container.clientWidth - tabRect.width) / 2;\n const maxScrollLeft = container.scrollWidth - container.clientWidth;\n\n container.scrollTo({\n left: Math.max(0, Math.min(centeredScrollLeft, maxScrollLeft)),\n behavior: 'smooth',\n });\n };\n\n alignTabInViewport();\n setTimeout(() => {\n alignTabInViewport();\n }, 320);\n }\n });\n }\n }\n\n /** Mounts a panel ahead of its click so the tab transition never pays for the first render. */\n protected preloadTab(tab: ZTab): void {\n if (this.zPreload() === 'none' || tab.disabled) {\n return;\n }\n\n zTabsRequestIdle(() => this._mountPanel(tab.value));\n }\n\n protected isTabActive(tab: ZTab): boolean {\n return this.activeTab() === tab.value;\n }\n\n protected onTabKeydown(event: KeyboardEvent, currentIndex: number): void {\n const tabs = this.zTabs().filter(t => !t.disabled);\n const currentTab = tabs[currentIndex];\n\n if (!currentTab) {\n return;\n }\n\n const isHorizontal = this.zOrientation() === 'horizontal';\n const nextKey = isHorizontal ? 'ArrowRight' : 'ArrowDown';\n const prevKey = isHorizontal ? 'ArrowLeft' : 'ArrowUp';\n\n if (event.key === nextKey) {\n event.preventDefault();\n const nextIndex = (currentIndex + 1) % tabs.length;\n this.selectTab(tabs[nextIndex]);\n return;\n }\n\n if (event.key === prevKey) {\n event.preventDefault();\n const prevIndex = (currentIndex - 1 + tabs.length) % tabs.length;\n this.selectTab(tabs[prevIndex]);\n return;\n }\n\n if (event.key === 'Home') {\n event.preventDefault();\n this.selectTab(tabs[0]);\n return;\n }\n\n if (event.key === 'End') {\n event.preventDefault();\n this.selectTab(tabs[tabs.length - 1]);\n }\n }\n\n protected checkScroll(): void {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container || this.zOrientation() !== 'horizontal') {\n this.canScrollLeft.set(false);\n this.canScrollRight.set(false);\n return;\n }\n\n const { scrollLeft, scrollWidth, clientWidth } = container;\n const maxScrollLeft = scrollWidth - clientWidth;\n\n if (maxScrollLeft <= Z_TABS_SCROLL_TOLERANCE) {\n container.scrollLeft = 0;\n this.canScrollLeft.set(false);\n this.canScrollRight.set(false);\n return;\n }\n\n this.canScrollLeft.set(scrollLeft > Z_TABS_SCROLL_TOLERANCE);\n this.canScrollRight.set(maxScrollLeft - scrollLeft > Z_TABS_SCROLL_TOLERANCE);\n }\n\n protected scrollLeft(): void {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container) {\n return;\n }\n\n container.scrollBy({ left: -200, behavior: 'smooth' });\n setTimeout(() => this.checkScroll(), 300);\n }\n\n protected scrollRight(): void {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container) {\n return;\n }\n\n container.scrollBy({ left: 200, behavior: 'smooth' });\n setTimeout(() => this.checkScroll(), 300);\n }\n\n protected onTabsScroll(): void {\n this.checkScroll();\n }\n\n /**\n * Lets the browser paint the tab-strip transition before the panel subtree is committed, so the\n * swap lands after the animation has started instead of blocking its opening frames.\n */\n private _scheduleCommit(value: string): void {\n if (!value) {\n return;\n }\n\n if (!this._viewReady || typeof requestAnimationFrame === 'undefined') {\n this._commitPanel(value);\n return;\n }\n\n this._mountFrame = requestAnimationFrame(() => {\n this._mountFrame = requestAnimationFrame(() => this._commitPanel(value));\n });\n }\n\n private _commitPanel(value: string): void {\n if (this.activeTab() !== value) {\n return;\n }\n\n this.renderedTab.set(value);\n this._mountPanel(value);\n this._preloadNextIdlePanel();\n }\n\n private _mountPanel(value: string): void {\n if (!this._canMount(value)) {\n return;\n }\n\n this.mountedTabs.update(tabs => new Set(tabs).add(value));\n this._preloadNextIdlePanel();\n }\n\n /** Tracked even while `zDestroyInactive` is on, so flipping that input back keeps the visited panels. */\n private _canMount(value: string): boolean {\n return Boolean(value) && this.zLazy() && !this.mountedTabs().has(value);\n }\n\n /** Warms remaining panels one idle slot at a time so preloading never stalls a single frame. */\n private _preloadNextIdlePanel(): void {\n if (this.zPreload() !== 'idle' || !this.zLazy() || this.zDestroyInactive()) {\n return;\n }\n\n const next = this.zTabs().find(tab => !tab.disabled && !this.mountedTabs().has(tab.value));\n if (!next) {\n return;\n }\n\n zTabsCancelIdle(this._idleHandle);\n this._idleHandle = zTabsRequestIdle(() => this._mountPanel(next.value));\n }\n\n private _updateGlideIndicator(): void {\n if (!this.isGlideType()) {\n this.glideStyle.set(null);\n this.glideReady.set(false);\n return;\n }\n\n const activeIndex = this.zTabs().findIndex(tab => tab.value === this.activeTab());\n const button = this.tabButtons()[activeIndex]?.nativeElement;\n if (!button) {\n return;\n }\n\n this.glideStyle.set({\n transform: `translate(${button.offsetLeft}px, ${button.offsetTop}px)`,\n width: `${button.offsetWidth}px`,\n height: `${button.offsetHeight}px`,\n });\n\n if (!this.glideReady()) {\n requestAnimationFrame(() => this.glideReady.set(true));\n }\n }\n\n private _setupResizeObserver(): void {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container) {\n return;\n }\n\n this._resizeObserver = new ResizeObserver(() => {\n this.checkScroll();\n this._updateGlideIndicator();\n });\n\n this._resizeObserver.observe(container);\n }\n\n private _restoreActiveTabFromCache(): void {\n if (!this.zCache()) {\n return;\n }\n\n const cacheKey = this._getCacheKey();\n const cachedTab = ZCacheService.get<string>(cacheKey);\n if (!cachedTab) {\n return;\n }\n\n const tab = this.zTabs().find(item => item.value === cachedTab && !item.disabled);\n if (!tab) {\n return;\n }\n\n this.activeTab.set(tab.value);\n }\n\n private _saveActiveTabToCache(value: string): void {\n if (!this.zCache()) {\n return;\n }\n\n ZCacheService.set(this._getCacheKey(), value);\n }\n\n private _getCacheKey(): string {\n const customKey = this.zCacheKey().trim();\n if (customKey) {\n return customKey;\n }\n\n const path = typeof window === 'undefined' ? 'ssr' : window.location.pathname;\n return `z-tabs:${path}:${this._cacheInstanceId}`;\n }\n\n protected scrollToActiveDropdownItem(): void {\n setTimeout(() => {\n const activeIndex = this.zTabs().findIndex(tab => tab.value === this.activeTab());\n if (activeIndex === -1) {\n return;\n }\n\n const dropdownMenu = document.querySelector('.z-tabs-dropdown-menu') as HTMLElement;\n if (!dropdownMenu) {\n return;\n }\n\n const dropdownItems = Array.from(dropdownMenu.querySelectorAll('button'));\n const activeItem = dropdownItems[activeIndex];\n\n if (activeItem && dropdownMenu) {\n const menuRect = dropdownMenu.getBoundingClientRect();\n const itemRect = activeItem.getBoundingClientRect();\n const scrollTop = activeItem.offsetTop - menuRect.height / 2 + itemRect.height / 2;\n\n dropdownMenu.scrollTo({\n top: scrollTop,\n behavior: 'smooth',\n });\n }\n }, 150);\n }\n}\n","<div\n class=\"z-tabs-container flex gap-1\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-content-fit]=\"zContentFit()\"\n [class.flex-col]=\"!zTabsOnly()\"\n [class.flex-row]=\"zOrientation() === 'vertical'\"\n [class.gap-4]=\"zOrientation() === 'vertical'\">\n <!-- Tabs Navigation (Left/Scroll/Tabs/Right/Dropdown) -->\n <div\n [class]=\"navClasses()\"\n [class.z-tabs-nav-surface]=\"zShowNavWrapper() && isGlideType()\"\n [class.w-full]=\"zOrientation() === 'horizontal' && (!zShowNavWrapper() || zNavFullWidth())\"\n [class.w-fit]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.max-w-full]=\"zOrientation() === 'horizontal' && zShowNavWrapper() && !zNavFullWidth()\"\n [class.w-auto]=\"zOrientation() === 'vertical'\"\n [class.shrink-0]=\"zOrientation() === 'vertical'\">\n <!-- Scroll Left Button -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n [zWave]=\"false\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollLeft()\"\n aria-label=\"Scroll left\">\n <z-icon zType=\"lucideChevronLeft\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Tabs List Container with Scroll + Fade -->\n <div\n class=\"z-tabs-scroll-container relative min-w-0 flex-1\"\n [class.z-tabs-scroll-container-surface]=\"canScrollLeft() || canScrollRight()\"\n [attr.data-type]=\"zType()\">\n @if (zOrientation() === 'vertical') {\n <ng-scrollbar\n class=\"z-tabs-scroll-wrapper z-tabs-scrollbar vertical\"\n [class.z-tabs-scroll-wrapper-limited]=\"verticalTabsScrollable()\"\n track=\"vertical\"\n orientation=\"vertical\"\n appearance=\"compact\"\n visibility=\"hover\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </ng-scrollbar>\n } @else {\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.z-tabs-scroll-wrapper-scrollable]=\"canScrollLeft() || canScrollRight()\"\n [class.z-tabs-scroll-wrapper-fade-left]=\"canScrollLeft()\"\n [class.z-tabs-scroll-wrapper-fade-right]=\"canScrollRight()\"\n (scroll)=\"onTabsScroll()\">\n <ng-container *ngTemplateOutlet=\"tabsListTpl\" />\n </div>\n }\n </div>\n\n <!-- Scroll Right Button -->\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n (click)=\"scrollRight()\"\n [zWave]=\"false\"\n aria-label=\"Scroll right\">\n <z-icon zType=\"lucideChevronRight\" zSize=\"16\" />\n </z-button>\n }\n\n <!-- Dropdown Button (Mobile or Overflow) -->\n @if (zOrientation() === 'horizontal' && (canScrollLeft() || canScrollRight())) {\n <z-button\n zType=\"ghost\"\n zSize=\"sm\"\n zIconOnly=\"true\"\n class=\"z-tabs-nav-control shrink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[6.25rem] max-w-[12.5rem]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <ng-template #tabsListTpl>\n <!-- Tab List -->\n <div\n [class]=\"tabsClasses()\"\n [class.pb-0.5]=\"tabsListHasBottomPadding()\"\n role=\"tablist\"\n [attr.aria-orientation]=\"zOrientation()\"\n [attr.data-type]=\"zType()\">\n @if (isGlideType() && glideStyle(); as style) {\n <div\n class=\"z-tabs-glide-indicator pointer-events-none absolute top-0 left-0 z-[6]\"\n [class.z-tabs-glide-indicator-ready]=\"glideReady()\"\n [attr.data-type]=\"zType()\"\n [style.transform]=\"style.transform\"\n [style.width]=\"style.width\"\n [style.height]=\"style.height\"\n aria-hidden=\"true\"></div>\n }\n @for (tab of zTabs(); track tab.value; let idx = $index; let last = $last) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.data-state]=\"isTabActive(tab) ? 'active' : 'inactive'\"\n [attr.data-type]=\"zType()\"\n [attr.data-orientation]=\"zOrientation()\"\n [attr.data-last]=\"last\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n z-tooltip\n [zContent]=\"zOrientation() === 'vertical' ? (tab.label | translate) : ''\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n (click)=\"selectTab(tab)\"\n (pointerenter)=\"preloadTab(tab)\"\n (focus)=\"preloadTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon\n [zType]=\"tab.icon\"\n zSize=\"16\"\n class=\"shrink-0\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\" />\n }\n <span\n class=\"z-tab-item-label min-w-0 flex-1 truncate text-left\"\n [class.z-tab-icon-bounce]=\"isGlideType() && bouncingTab() === tab.value\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"ring-background ml-1.5 inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold ring-2\"\n [class.bg-primary]=\"zType() !== 'badge'\"\n [class.text-primary-foreground]=\"zType() !== 'badge'\"\n [class.bg-primary!]=\"zType() === 'badge'\"\n [class.text-primary-foreground!]=\"zType() === 'badge'\">\n {{ tab.badge }}\n </span>\n }\n </button>\n }\n </div>\n </ng-template>\n\n <!-- Tab Panels -->\n @if (!zTabsOnly()) {\n <div\n class=\"z-tabs-panels min-h-0\"\n [class.flex-1]=\"zOrientation() === 'vertical'\"\n [class.shadow-xs]=\"contentWrapperFramed()\"\n [class.z-tabs-panels-unwrapped]=\"!contentWrapperFramed()\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (panelRenderStates().get(panel.zTabPanel())) {\n <div\n role=\"tabpanel\"\n [id]=\"'panel-' + panel.zTabPanel()\"\n [attr.aria-labelledby]=\"panel.zTabPanel()\"\n [attr.data-state]=\"visiblePanel() === panel.zTabPanel() ? 'active' : 'inactive'\"\n [attr.inert]=\"visiblePanel() === panel.zTabPanel() ? null : ''\">\n <ng-container *ngTemplateOutlet=\"panel.template\" />\n </div>\n }\n }\n </div>\n }\n</div>\n\n<!-- Dropdown Menu Template -->\n<ng-template #dropdownTpl let-close=\"close\">\n <div\n class=\"z-tabs-dropdown-menu flex max-h-[18.75rem] max-w-[12.5rem] min-w-[6.25rem] flex-col gap-0.5 overflow-y-auto p-1\">\n @for (tab of zTabs(); track tab.value) {\n <button\n #dropdownItem\n type=\"button\"\n class=\"flex w-full cursor-pointer items-center justify-start gap-2 rounded-sm px-2 py-1.5 text-left text-sm font-medium transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:text-foreground]=\"!isTabActive(tab)\"\n [class.focus:bg-primary/10]=\"!isTabActive(tab)\"\n [class.bg-primary/15]=\"isTabActive(tab)\"\n [class.text-primary]=\"isTabActive(tab)\"\n [disabled]=\"tab.disabled\"\n (pointerenter)=\"preloadTab(tab)\"\n (click)=\"selectTab(tab, true); close()\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"min-w-0 flex-1 truncate\"\n z-tooltip\n [zContent]=\"tab.label | translate\"\n zPosition=\"top\"\n [zHideDelay]=\"0\"\n [zOffset]=\"5\"\n [zArrow]=\"false\"\n [zTriggerElement]=\"dropdownItem\">\n {{ tab.label | translate }}\n </span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs font-semibold\">\n {{ tab.badge }}\n </span>\n }\n @if (isTabActive(tab)) {\n <z-icon zType=\"lucideCheck\" zSize=\"16\" class=\"text-primary shink-0\" />\n }\n </button>\n }\n </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@shival99/z-ui",
|
|
3
|
-
"version": "2.3.
|
|
3
|
+
"version": "2.3.6",
|
|
4
4
|
"description": "Z-UI: Modern Angular UI Component Library - A comprehensive, high-performance design system built with Angular 22, featuring 40+ customizable components with dark mode, accessibility, and enterprise-ready features.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"angular",
|
|
@@ -431,16 +431,16 @@ declare class ZCalendarComponent implements OnInit, ControlValueAccessor {
|
|
|
431
431
|
|
|
432
432
|
declare const zCalendarVariants: (props?: ({
|
|
433
433
|
zSize?: "sm" | "default" | "lg" | null | undefined;
|
|
434
|
-
zStatus?: "default" | "disabled" | "
|
|
434
|
+
zStatus?: "default" | "disabled" | "readonly" | "open" | "error" | null | undefined;
|
|
435
435
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
436
436
|
declare const zCalendarDayVariants: (props?: ({
|
|
437
|
-
state?: "default" | "today" | "selected" | "inRange" | "rangeStart" | "rangeEnd" | "rangeSingle" | "
|
|
437
|
+
state?: "default" | "disabled" | "today" | "selected" | "inRange" | "rangeStart" | "rangeEnd" | "rangeSingle" | "otherMonth" | "hovered" | null | undefined;
|
|
438
438
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
439
439
|
declare const zCalendarMonthVariants: (props?: ({
|
|
440
|
-
state?: "default" | "
|
|
440
|
+
state?: "default" | "current" | "disabled" | "selected" | null | undefined;
|
|
441
441
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
442
442
|
declare const zCalendarYearVariants: (props?: ({
|
|
443
|
-
state?: "default" | "
|
|
443
|
+
state?: "default" | "current" | "disabled" | "selected" | null | undefined;
|
|
444
444
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
445
445
|
|
|
446
446
|
export { ZCalendarComponent, zCalendarDayVariants, zCalendarMonthVariants, zCalendarVariants, zCalendarYearVariants };
|
|
@@ -187,7 +187,7 @@ declare class ZGalleryComponent implements AfterViewInit {
|
|
|
187
187
|
protected readonly headerControlHeight: _angular_core.Signal<"1.75rem" | "2rem" | "2.5rem" | "2.25rem">;
|
|
188
188
|
protected readonly skeletonMediaHeight: _angular_core.Signal<"9rem" | "14rem" | "11rem">;
|
|
189
189
|
protected readonly toggleIconSize: _angular_core.Signal<"14" | "16" | "20" | "18">;
|
|
190
|
-
protected readonly searchInputSize: _angular_core.Signal<"
|
|
190
|
+
protected readonly searchInputSize: _angular_core.Signal<"sm" | "default" | "lg">;
|
|
191
191
|
protected readonly filteredFiles: _angular_core.Signal<ZGalleryFile[]>;
|
|
192
192
|
protected readonly selectedIds: _angular_core.Signal<Set<string>>;
|
|
193
193
|
protected readonly isAllSelected: _angular_core.Signal<boolean>;
|
|
@@ -383,16 +383,16 @@ declare const isPreviewable: (file: ZGalleryFile) => boolean;
|
|
|
383
383
|
declare const isImage: (file: ZGalleryFile) => boolean;
|
|
384
384
|
|
|
385
385
|
declare const zGalleryVariants: (props?: ({
|
|
386
|
-
zSize?: "
|
|
386
|
+
zSize?: "sm" | "default" | "lg" | null | undefined;
|
|
387
387
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
388
388
|
type ZGalleryVariants = VariantProps<typeof zGalleryVariants>;
|
|
389
389
|
declare const zGalleryItemVariants: (props?: ({
|
|
390
390
|
zMode?: "grid" | "list" | null | undefined;
|
|
391
|
-
zSize?: "
|
|
391
|
+
zSize?: "sm" | "default" | "lg" | null | undefined;
|
|
392
392
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
393
393
|
type ZGalleryItemVariants = VariantProps<typeof zGalleryItemVariants>;
|
|
394
394
|
declare const zGalleryFileIconVariants: (props?: ({
|
|
395
|
-
zSize?: "
|
|
395
|
+
zSize?: "sm" | "default" | "lg" | null | undefined;
|
|
396
396
|
zMode?: "grid" | "list" | null | undefined;
|
|
397
397
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
398
398
|
type ZGalleryFileIconVariants = VariantProps<typeof zGalleryFileIconVariants>;
|
|
@@ -252,7 +252,7 @@ declare class ZModalComponent<T, U> implements OnDestroy, AfterViewChecked {
|
|
|
252
252
|
protected readonly effectiveOkText: _angular_core.Signal<string | null | undefined>;
|
|
253
253
|
protected readonly effectiveCancelText: _angular_core.Signal<string | null | undefined>;
|
|
254
254
|
protected readonly effectiveOkDestructive: _angular_core.Signal<boolean | undefined>;
|
|
255
|
-
protected readonly effectiveTypeOk: _angular_core.Signal<"info" | "warning" | "error" | "default" | "primary" | "secondary" | "destructive" | "destructive-heartbeat" | "success" | "outline" | "outline-primary" | "outline-secondary" | "outline-success" | "outline-info" | "outline-warning" | "outline-error" | "outline-destructive" | "outline-shimmer" | "outline-success-secondary" | "outline-info-secondary" | "outline-warning-secondary" | "outline-error-secondary" | "outline-destructive-secondary" | "outline-primary-secondary" | "outline-primary-soft" | "outline-success-soft" | "outline-info-soft" | "outline-warning-soft" | "outline-error-soft" | "outline-destructive-soft" | "outline-primary-soft-border" | "outline-success-soft-border" | "outline-info-soft-border" | "outline-warning-soft-border" | "outline-error-soft-border" | "outline-destructive-soft-border" | "ghost" | "ghost-primary" | "ghost-success" | "ghost-info" | "ghost-warning" | "ghost-error" | "ghost-destructive" | "subtle" | "subtle-primary" | "subtle-success" | "subtle-info" | "subtle-warning" | "subtle-destructive" | "subtle-outline" | "subtle-primary-outline" | "subtle-success-outline" | "subtle-info-outline" | "subtle-warning-outline" | "subtle-destructive-outline" |
|
|
255
|
+
protected readonly effectiveTypeOk: _angular_core.Signal<"info" | "warning" | "error" | "link" | "default" | "primary" | "secondary" | "destructive" | "destructive-heartbeat" | "success" | "outline" | "outline-primary" | "outline-secondary" | "outline-success" | "outline-info" | "outline-warning" | "outline-error" | "outline-destructive" | "outline-shimmer" | "outline-success-secondary" | "outline-info-secondary" | "outline-warning-secondary" | "outline-error-secondary" | "outline-destructive-secondary" | "outline-primary-secondary" | "outline-primary-soft" | "outline-success-soft" | "outline-info-soft" | "outline-warning-soft" | "outline-error-soft" | "outline-destructive-soft" | "outline-primary-soft-border" | "outline-success-soft-border" | "outline-info-soft-border" | "outline-warning-soft-border" | "outline-error-soft-border" | "outline-destructive-soft-border" | "ghost" | "ghost-primary" | "ghost-success" | "ghost-info" | "ghost-warning" | "ghost-error" | "ghost-destructive" | "subtle" | "subtle-primary" | "subtle-success" | "subtle-info" | "subtle-warning" | "subtle-destructive" | "subtle-outline" | "subtle-primary-outline" | "subtle-success-outline" | "subtle-info-outline" | "subtle-warning-outline" | "subtle-destructive-outline" | null | undefined>;
|
|
256
256
|
protected readonly effectiveOkDisabled: _angular_core.Signal<boolean | undefined>;
|
|
257
257
|
protected readonly effectiveLoading: _angular_core.Signal<boolean>;
|
|
258
258
|
protected readonly effectiveContentLoading: _angular_core.Signal<boolean>;
|
|
@@ -113,7 +113,7 @@ declare class ZPopoverDirective implements OnInit, OnDestroy {
|
|
|
113
113
|
readonly zHideDelay: _angular_core.InputSignal<number>;
|
|
114
114
|
readonly zDisabled: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
|
|
115
115
|
readonly zOffset: _angular_core.InputSignal<number>;
|
|
116
|
-
readonly zPopoverWidth: _angular_core.InputSignal<number | "
|
|
116
|
+
readonly zPopoverWidth: _angular_core.InputSignal<number | "trigger" | "auto">;
|
|
117
117
|
readonly zTriggerRef: _angular_core.InputSignal<HTMLElement | ElementRef<HTMLElement> | null>;
|
|
118
118
|
readonly zManualClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
|
|
119
119
|
readonly zOutsideClickClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
|
|
@@ -2239,7 +2239,7 @@ declare class ZTableActionsComponent<T = unknown> {
|
|
|
2239
2239
|
readonly zConfig: _angular_core.InputSignal<ZTableActionColumnConfig<T>>;
|
|
2240
2240
|
readonly zRow: _angular_core.InputSignal<T>;
|
|
2241
2241
|
readonly zRowId: _angular_core.InputSignal<string>;
|
|
2242
|
-
readonly zDropdownButtonSize: _angular_core.InputSignal<"
|
|
2242
|
+
readonly zDropdownButtonSize: _angular_core.InputSignal<"sm" | "default" | "lg" | "xs" | "xl" | null | undefined>;
|
|
2243
2243
|
readonly zActionClick: _angular_core.OutputEmitterRef<ZTableActionClickEvent<T>>;
|
|
2244
2244
|
protected readonly allActions: _angular_core.Signal<ZTableActionItem<T>[]>;
|
|
2245
2245
|
protected readonly shouldShowAsButtons: _angular_core.Signal<boolean>;
|
|
@@ -34,6 +34,7 @@ type ZTabsType = 'line' | 'soft' | 'segment' | 'segment-solid' | 'pill-solid' |
|
|
|
34
34
|
type ZTabsSize = 'xs' | 'sm' | 'default' | 'lg';
|
|
35
35
|
type ZTabsOrientation = 'horizontal' | 'vertical';
|
|
36
36
|
type ZTabsContentFit = 'none' | 'screen';
|
|
37
|
+
type ZTabsPreload = 'none' | 'hover' | 'idle';
|
|
37
38
|
type ZTabsVariants = VariantProps<typeof zTabsVariants>;
|
|
38
39
|
type ZTabItemVariants = VariantProps<typeof zTabItemVariants>;
|
|
39
40
|
|
|
@@ -48,10 +49,12 @@ declare class ZTabsComponent implements OnInit, AfterViewInit, OnDestroy {
|
|
|
48
49
|
readonly zOrientation: _angular_core.InputSignal<ZTabsOrientation>;
|
|
49
50
|
readonly zContentFit: _angular_core.InputSignal<ZTabsContentFit>;
|
|
50
51
|
readonly zLazy: _angular_core.InputSignal<boolean>;
|
|
52
|
+
readonly zPreload: _angular_core.InputSignal<ZTabsPreload>;
|
|
51
53
|
readonly zDestroyInactive: _angular_core.InputSignal<boolean>;
|
|
52
54
|
readonly zTabsOnly: _angular_core.InputSignal<boolean>;
|
|
53
55
|
readonly zShowNavWrapper: _angular_core.InputSignal<boolean>;
|
|
54
56
|
readonly zNavFullWidth: _angular_core.InputSignal<boolean>;
|
|
57
|
+
readonly zClassContent: _angular_core.InputSignal<ClassValue>;
|
|
55
58
|
readonly zShowContentWrapper: _angular_core.InputSignal<boolean>;
|
|
56
59
|
readonly zReloadable: _angular_core.InputSignal<boolean>;
|
|
57
60
|
readonly zEmitOnActiveClick: _angular_core.InputSignal<boolean>;
|
|
@@ -59,7 +62,8 @@ declare class ZTabsComponent implements OnInit, AfterViewInit, OnDestroy {
|
|
|
59
62
|
readonly zCacheKey: _angular_core.InputSignal<string>;
|
|
60
63
|
readonly activeTab: _angular_core.ModelSignal<string>;
|
|
61
64
|
readonly zTabChange: _angular_core.OutputEmitterRef<string>;
|
|
62
|
-
protected readonly
|
|
65
|
+
protected readonly mountedTabs: _angular_core.WritableSignal<Set<string>>;
|
|
66
|
+
protected readonly renderedTab: _angular_core.WritableSignal<string>;
|
|
63
67
|
protected readonly canScrollLeft: _angular_core.WritableSignal<boolean>;
|
|
64
68
|
protected readonly canScrollRight: _angular_core.WritableSignal<boolean>;
|
|
65
69
|
protected readonly bouncingTab: _angular_core.WritableSignal<string | null>;
|
|
@@ -70,9 +74,13 @@ declare class ZTabsComponent implements OnInit, AfterViewInit, OnDestroy {
|
|
|
70
74
|
height: string;
|
|
71
75
|
} | null>;
|
|
72
76
|
protected readonly glideReady: _angular_core.WritableSignal<boolean>;
|
|
73
|
-
|
|
77
|
+
/** With `zDestroyInactive` the single rendered panel is the visible one, so it never collapses mid-swap. */
|
|
78
|
+
protected readonly visiblePanel: _angular_core.Signal<string>;
|
|
74
79
|
protected readonly panelRenderStates: _angular_core.Signal<Map<string, boolean>>;
|
|
75
80
|
private _resizeObserver?;
|
|
81
|
+
private _mountFrame?;
|
|
82
|
+
private _idleHandle?;
|
|
83
|
+
private _viewReady;
|
|
76
84
|
private readonly _cacheInstanceId;
|
|
77
85
|
constructor();
|
|
78
86
|
ngOnInit(): void;
|
|
@@ -82,14 +90,28 @@ declare class ZTabsComponent implements OnInit, AfterViewInit, OnDestroy {
|
|
|
82
90
|
protected readonly contentWrapperFramed: _angular_core.Signal<boolean>;
|
|
83
91
|
protected readonly tabsListHasBottomPadding: _angular_core.Signal<boolean>;
|
|
84
92
|
protected readonly verticalTabsScrollable: _angular_core.Signal<boolean>;
|
|
93
|
+
protected readonly navClasses: _angular_core.Signal<string>;
|
|
85
94
|
protected getTabItemClasses(_tab: ZTab): string;
|
|
86
95
|
protected selectTab(tab: ZTab, scrollToView?: boolean): void;
|
|
96
|
+
/** Mounts a panel ahead of its click so the tab transition never pays for the first render. */
|
|
97
|
+
protected preloadTab(tab: ZTab): void;
|
|
87
98
|
protected isTabActive(tab: ZTab): boolean;
|
|
88
99
|
protected onTabKeydown(event: KeyboardEvent, currentIndex: number): void;
|
|
89
100
|
protected checkScroll(): void;
|
|
90
101
|
protected scrollLeft(): void;
|
|
91
102
|
protected scrollRight(): void;
|
|
92
103
|
protected onTabsScroll(): void;
|
|
104
|
+
/**
|
|
105
|
+
* Lets the browser paint the tab-strip transition before the panel subtree is committed, so the
|
|
106
|
+
* swap lands after the animation has started instead of blocking its opening frames.
|
|
107
|
+
*/
|
|
108
|
+
private _scheduleCommit;
|
|
109
|
+
private _commitPanel;
|
|
110
|
+
private _mountPanel;
|
|
111
|
+
/** Tracked even while `zDestroyInactive` is on, so flipping that input back keeps the visited panels. */
|
|
112
|
+
private _canMount;
|
|
113
|
+
/** Warms remaining panels one idle slot at a time so preloading never stalls a single frame. */
|
|
114
|
+
private _preloadNextIdlePanel;
|
|
93
115
|
private _updateGlideIndicator;
|
|
94
116
|
private _setupResizeObserver;
|
|
95
117
|
private _restoreActiveTabFromCache;
|
|
@@ -97,8 +119,8 @@ declare class ZTabsComponent implements OnInit, AfterViewInit, OnDestroy {
|
|
|
97
119
|
private _getCacheKey;
|
|
98
120
|
protected scrollToActiveDropdownItem(): void;
|
|
99
121
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZTabsComponent, never>;
|
|
100
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZTabsComponent, "z-tabs", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "zTabs": { "alias": "zTabs"; "required": true; "isSignal": true; }; "zType": { "alias": "zType"; "required": false; "isSignal": true; }; "zSize": { "alias": "zSize"; "required": false; "isSignal": true; }; "zOrientation": { "alias": "zOrientation"; "required": false; "isSignal": true; }; "zContentFit": { "alias": "zContentFit"; "required": false; "isSignal": true; }; "zLazy": { "alias": "zLazy"; "required": false; "isSignal": true; }; "zDestroyInactive": { "alias": "zDestroyInactive"; "required": false; "isSignal": true; }; "zTabsOnly": { "alias": "zTabsOnly"; "required": false; "isSignal": true; }; "zShowNavWrapper": { "alias": "zShowNavWrapper"; "required": false; "isSignal": true; }; "zNavFullWidth": { "alias": "zNavFullWidth"; "required": false; "isSignal": true; }; "zShowContentWrapper": { "alias": "zShowContentWrapper"; "required": false; "isSignal": true; }; "zReloadable": { "alias": "zReloadable"; "required": false; "isSignal": true; }; "zEmitOnActiveClick": { "alias": "zEmitOnActiveClick"; "required": false; "isSignal": true; }; "zCache": { "alias": "zCache"; "required": false; "isSignal": true; }; "zCacheKey": { "alias": "zCacheKey"; "required": false; "isSignal": true; }; "activeTab": { "alias": "activeTab"; "required": false; "isSignal": true; }; }, { "activeTab": "activeTabChange"; "zTabChange": "zTabChange"; }, ["tabPanels"], never, true, never>;
|
|
122
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZTabsComponent, "z-tabs", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "zTabs": { "alias": "zTabs"; "required": true; "isSignal": true; }; "zType": { "alias": "zType"; "required": false; "isSignal": true; }; "zSize": { "alias": "zSize"; "required": false; "isSignal": true; }; "zOrientation": { "alias": "zOrientation"; "required": false; "isSignal": true; }; "zContentFit": { "alias": "zContentFit"; "required": false; "isSignal": true; }; "zLazy": { "alias": "zLazy"; "required": false; "isSignal": true; }; "zPreload": { "alias": "zPreload"; "required": false; "isSignal": true; }; "zDestroyInactive": { "alias": "zDestroyInactive"; "required": false; "isSignal": true; }; "zTabsOnly": { "alias": "zTabsOnly"; "required": false; "isSignal": true; }; "zShowNavWrapper": { "alias": "zShowNavWrapper"; "required": false; "isSignal": true; }; "zNavFullWidth": { "alias": "zNavFullWidth"; "required": false; "isSignal": true; }; "zClassContent": { "alias": "zClassContent"; "required": false; "isSignal": true; }; "zShowContentWrapper": { "alias": "zShowContentWrapper"; "required": false; "isSignal": true; }; "zReloadable": { "alias": "zReloadable"; "required": false; "isSignal": true; }; "zEmitOnActiveClick": { "alias": "zEmitOnActiveClick"; "required": false; "isSignal": true; }; "zCache": { "alias": "zCache"; "required": false; "isSignal": true; }; "zCacheKey": { "alias": "zCacheKey"; "required": false; "isSignal": true; }; "activeTab": { "alias": "activeTab"; "required": false; "isSignal": true; }; }, { "activeTab": "activeTabChange"; "zTabChange": "zTabChange"; }, ["tabPanels"], never, true, never>;
|
|
101
123
|
}
|
|
102
124
|
|
|
103
125
|
export { ZTabPanelDirective, ZTabsComponent, zTabItemVariants, zTabsVariants };
|
|
104
|
-
export type { ZTab, ZTabItemVariants, ZTabsContentFit, ZTabsOrientation, ZTabsSize, ZTabsType, ZTabsVariants };
|
|
126
|
+
export type { ZTab, ZTabItemVariants, ZTabsContentFit, ZTabsOrientation, ZTabsPreload, ZTabsSize, ZTabsType, ZTabsVariants };
|
|
@@ -57,7 +57,7 @@ declare class ZToastComponent {
|
|
|
57
57
|
private readonly _themeService;
|
|
58
58
|
private readonly _config;
|
|
59
59
|
readonly class: _angular_core.InputSignal<ClassValue>;
|
|
60
|
-
readonly zVariant: _angular_core.InputSignal<"
|
|
60
|
+
readonly zVariant: _angular_core.InputSignal<"default" | "success" | "error" | "warning" | "info" | null | undefined>;
|
|
61
61
|
readonly zTheme: _angular_core.InputSignal<ZToastTheme | undefined>;
|
|
62
62
|
readonly zPosition: _angular_core.InputSignal<ZToastPosition | undefined>;
|
|
63
63
|
readonly zRichColors: _angular_core.InputSignal<boolean | undefined>;
|
|
@@ -159,7 +159,7 @@ declare class ZToastService implements OnDestroy {
|
|
|
159
159
|
}
|
|
160
160
|
|
|
161
161
|
declare const zToastVariants: (props?: ({
|
|
162
|
-
zVariant?: "
|
|
162
|
+
zVariant?: "default" | "success" | "error" | "warning" | "info" | null | undefined;
|
|
163
163
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
164
164
|
type ZToastVariants = VariantProps<typeof zToastVariants>;
|
|
165
165
|
|