@shival99/z-ui 1.4.12 → 1.4.14

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.
@@ -6,7 +6,7 @@ import { cva } from 'class-variance-authority';
6
6
 
7
7
  const zCardVariants = cva([
8
8
  'block w-full',
9
- 'rounded-lg border border-border',
9
+ 'rounded-[6px] border border-border',
10
10
  'bg-card text-card-foreground',
11
11
  'shadow-card',
12
12
  'transition-shadow duration-200',
@@ -34,8 +34,8 @@ const zCardHeaderVariants = cva(['flex items-center justify-between', 'transitio
34
34
  false: '',
35
35
  },
36
36
  zCollapsed: {
37
- true: '',
38
- false: 'border-b border-border',
37
+ true: 'border-b !border-transparent',
38
+ false: 'border-b !border-border',
39
39
  },
40
40
  },
41
41
  defaultVariants: {
@@ -1 +1 @@
1
- {"version":3,"file":"shival99-z-ui-components-z-card.mjs","sources":["../../../../libs/core-ui/components/z-card/z-card.variants.ts","../../../../libs/core-ui/components/z-card/z-card.component.ts","../../../../libs/core-ui/components/z-card/z-card.component.html","../../../../libs/core-ui/components/z-card/shival99-z-ui-components-z-card.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zCardVariants = cva(\n [\n 'block w-full',\n 'rounded-lg border border-border',\n 'bg-card text-card-foreground',\n 'shadow-card',\n 'transition-shadow duration-200',\n ],\n {\n variants: {\n zSize: {\n sm: '',\n default: '',\n lg: '',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n }\n);\n\nexport const zCardHeaderVariants = cva(['flex items-center justify-between', 'transition-colors duration-200'], {\n variants: {\n zSize: {\n sm: 'px-3 py-2',\n default: 'px-4 py-3',\n lg: 'px-5 py-4',\n },\n zCollapsible: {\n true: 'cursor-pointer hover:bg-muted/50',\n false: '',\n },\n zCollapsed: {\n true: '',\n false: 'border-b border-border',\n },\n },\n defaultVariants: {\n zSize: 'default',\n zCollapsible: false,\n zCollapsed: false,\n },\n});\n\nexport const zCardTitleVariants = cva(['font-medium text-foreground'], {\n variants: {\n zSize: {\n sm: 'text-sm',\n default: 'text-base',\n lg: 'text-lg',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport const zCardContentVariants = cva([''], {\n variants: {\n zSize: {\n sm: 'p-3',\n default: 'p-4',\n lg: 'p-5',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport type ZCardVariants = VariantProps<typeof zCardVariants>;\nexport type ZCardHeaderVariants = VariantProps<typeof zCardHeaderVariants>;\nexport type ZCardTitleVariants = VariantProps<typeof zCardTitleVariants>;\nexport type ZCardContentVariants = VariantProps<typeof zCardContentVariants>;\n","import {\n ChangeDetectionStrategy,\n Component,\n computed,\n contentChild,\n ElementRef,\n input,\n model,\n output,\n ViewEncapsulation,\n} from '@angular/core';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport type { ZCardSize } from './z-card.types';\nimport { zCardContentVariants, zCardHeaderVariants, zCardTitleVariants, zCardVariants } from './z-card.variants';\n\n@Component({\n selector: 'z-card',\n imports: [ZIconComponent],\n standalone: true,\n templateUrl: './z-card.component.html',\n styleUrl: './z-card.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n '[class]': 'hostClasses()',\n },\n})\nexport class ZCardComponent {\n private readonly _customTitle = contentChild<ElementRef>('zCardTitle');\n\n public readonly zCollapsedChange = output<boolean>();\n\n public readonly class = input<ClassValue>('');\n public readonly zTitle = input<string>('');\n public readonly zSize = input<ZCardSize>('default');\n public readonly zCollapsible = input(false, { transform: zTransform });\n public readonly zCollapsed = model<boolean>(false);\n\n protected readonly isCollapsed = computed(() => {\n if (!this.zCollapsible()) {\n return false;\n }\n return this.zCollapsed();\n });\n\n protected readonly hasCustomTitle = computed(() => !!this._customTitle());\n\n protected readonly hostClasses = computed(() => zMergeClasses(zCardVariants({ zSize: this.zSize() }), this.class()));\n\n protected readonly headerClasses = computed(() =>\n zCardHeaderVariants({\n zSize: this.zSize(),\n zCollapsible: this.zCollapsible(),\n zCollapsed: this.isCollapsed(),\n })\n );\n\n protected readonly titleClasses = computed(() => zCardTitleVariants({ zSize: this.zSize() }));\n\n protected readonly contentClasses = computed(() => zCardContentVariants({ zSize: this.zSize() }));\n\n protected onHeaderClick(): void {\n if (!this.zCollapsible()) {\n return;\n }\n\n const newState = !this.zCollapsed();\n this.zCollapsed.set(newState);\n this.zCollapsedChange.emit(newState);\n }\n}\n","@if (zTitle() || zCollapsible()) {\n <div\n [class]=\"headerClasses()\"\n (click)=\"onHeaderClick()\"\n (keydown.enter)=\"onHeaderClick()\"\n (keydown.space)=\"onHeaderClick()\"\n [tabindex]=\"zCollapsible() ? 0 : -1\"\n [attr.role]=\"zCollapsible() ? 'button' : null\"\n [attr.aria-expanded]=\"zCollapsible() ? !isCollapsed() : null\">\n <span [class]=\"titleClasses()\">\n <ng-content select=\"[zCardTitle]\" />\n @if (!hasCustomTitle()) {\n {{ zTitle() }}\n }\n </span>\n @if (zCollapsible()) {\n <z-icon\n zType=\"lucideChevronDown\"\n zSize=\"16\"\n class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n [class.rotate-180]=\"!isCollapsed()\" />\n }\n <ng-content select=\"[zCardExtra]\" />\n </div>\n}\n\n<div class=\"z-card-content\" [class.z-card-content-open]=\"!isCollapsed()\">\n <div class=\"z-card-content-inner\">\n <div [class]=\"contentClasses()\">\n <ng-content />\n </div>\n </div>\n</div>\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-card.mjs","sources":["../../../../libs/core-ui/components/z-card/z-card.variants.ts","../../../../libs/core-ui/components/z-card/z-card.component.ts","../../../../libs/core-ui/components/z-card/z-card.component.html","../../../../libs/core-ui/components/z-card/shival99-z-ui-components-z-card.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zCardVariants = cva(\n [\n 'block w-full',\n 'rounded-[6px] border border-border',\n 'bg-card text-card-foreground',\n 'shadow-card',\n 'transition-shadow duration-200',\n ],\n {\n variants: {\n zSize: {\n sm: '',\n default: '',\n lg: '',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n }\n);\n\nexport const zCardHeaderVariants = cva(['flex items-center justify-between', 'transition-colors duration-200'], {\n variants: {\n zSize: {\n sm: 'px-3 py-2',\n default: 'px-4 py-3',\n lg: 'px-5 py-4',\n },\n zCollapsible: {\n true: 'cursor-pointer hover:bg-muted/50',\n false: '',\n },\n zCollapsed: {\n true: 'border-b !border-transparent',\n false: 'border-b !border-border',\n },\n },\n defaultVariants: {\n zSize: 'default',\n zCollapsible: false,\n zCollapsed: false,\n },\n});\n\nexport const zCardTitleVariants = cva(['font-medium text-foreground'], {\n variants: {\n zSize: {\n sm: 'text-sm',\n default: 'text-base',\n lg: 'text-lg',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport const zCardContentVariants = cva([''], {\n variants: {\n zSize: {\n sm: 'p-3',\n default: 'p-4',\n lg: 'p-5',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport type ZCardVariants = VariantProps<typeof zCardVariants>;\nexport type ZCardHeaderVariants = VariantProps<typeof zCardHeaderVariants>;\nexport type ZCardTitleVariants = VariantProps<typeof zCardTitleVariants>;\nexport type ZCardContentVariants = VariantProps<typeof zCardContentVariants>;\n","import {\n ChangeDetectionStrategy,\n Component,\n computed,\n contentChild,\n ElementRef,\n input,\n model,\n output,\n ViewEncapsulation,\n} from '@angular/core';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport type { ZCardSize } from './z-card.types';\nimport { zCardContentVariants, zCardHeaderVariants, zCardTitleVariants, zCardVariants } from './z-card.variants';\n\n@Component({\n selector: 'z-card',\n imports: [ZIconComponent],\n standalone: true,\n templateUrl: './z-card.component.html',\n styleUrl: './z-card.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n '[class]': 'hostClasses()',\n },\n})\nexport class ZCardComponent {\n private readonly _customTitle = contentChild<ElementRef>('zCardTitle');\n\n public readonly zCollapsedChange = output<boolean>();\n\n public readonly class = input<ClassValue>('');\n public readonly zTitle = input<string>('');\n public readonly zSize = input<ZCardSize>('default');\n public readonly zCollapsible = input(false, { transform: zTransform });\n public readonly zCollapsed = model<boolean>(false);\n\n protected readonly isCollapsed = computed(() => {\n if (!this.zCollapsible()) {\n return false;\n }\n return this.zCollapsed();\n });\n\n protected readonly hasCustomTitle = computed(() => !!this._customTitle());\n\n protected readonly hostClasses = computed(() => zMergeClasses(zCardVariants({ zSize: this.zSize() }), this.class()));\n\n protected readonly headerClasses = computed(() =>\n zCardHeaderVariants({\n zSize: this.zSize(),\n zCollapsible: this.zCollapsible(),\n zCollapsed: this.isCollapsed(),\n })\n );\n\n protected readonly titleClasses = computed(() => zCardTitleVariants({ zSize: this.zSize() }));\n\n protected readonly contentClasses = computed(() => zCardContentVariants({ zSize: this.zSize() }));\n\n protected onHeaderClick(): void {\n if (!this.zCollapsible()) {\n return;\n }\n\n const newState = !this.zCollapsed();\n this.zCollapsed.set(newState);\n this.zCollapsedChange.emit(newState);\n }\n}\n","@if (zTitle() || zCollapsible()) {\n <div\n [class]=\"headerClasses()\"\n (click)=\"onHeaderClick()\"\n (keydown.enter)=\"onHeaderClick()\"\n (keydown.space)=\"onHeaderClick()\"\n [tabindex]=\"zCollapsible() ? 0 : -1\"\n [attr.role]=\"zCollapsible() ? 'button' : null\"\n [attr.aria-expanded]=\"zCollapsible() ? !isCollapsed() : null\">\n <span [class]=\"titleClasses()\">\n <ng-content select=\"[zCardTitle]\" />\n @if (!hasCustomTitle()) {\n {{ zTitle() }}\n }\n </span>\n @if (zCollapsible()) {\n <z-icon\n zType=\"lucideChevronDown\"\n zSize=\"16\"\n class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n [class.rotate-180]=\"!isCollapsed()\" />\n }\n <ng-content select=\"[zCardExtra]\" />\n </div>\n}\n\n<div class=\"z-card-content\" [class.z-card-content-open]=\"!isCollapsed()\">\n <div class=\"z-card-content-inner\">\n <div [class]=\"contentClasses()\">\n <ng-content />\n </div>\n </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;AAEO,MAAM,aAAa,GAAG,GAAG,CAC9B;IACE,cAAc;IACd,oCAAoC;IACpC,8BAA8B;IAC9B,aAAa;IACb,gCAAgC;CACjC,EACD;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,EAAE;AACN,YAAA,OAAO,EAAE,EAAE;AACX,YAAA,EAAE,EAAE,EAAE;AACP,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA;AAGI,MAAM,mBAAmB,GAAG,GAAG,CAAC,CAAC,mCAAmC,EAAE,gCAAgC,CAAC,EAAE;AAC9G,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,WAAW;AACf,YAAA,OAAO,EAAE,WAAW;AACpB,YAAA,EAAE,EAAE,WAAW;AAChB,SAAA;AACD,QAAA,YAAY,EAAE;AACZ,YAAA,IAAI,EAAE,kCAAkC;AACxC,YAAA,KAAK,EAAE,EAAE;AACV,SAAA;AACD,QAAA,UAAU,EAAE;AACV,YAAA,IAAI,EAAE,8BAA8B;AACpC,YAAA,KAAK,EAAE,yBAAyB;AACjC,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,YAAY,EAAE,KAAK;AACnB,QAAA,UAAU,EAAE,KAAK;AAClB,KAAA;AACF,CAAA;MAEY,kBAAkB,GAAG,GAAG,CAAC,CAAC,6BAA6B,CAAC,EAAE;AACrE,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,SAAS;AACb,YAAA,OAAO,EAAE,WAAW;AACpB,YAAA,EAAE,EAAE,SAAS;AACd,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA;MAEY,oBAAoB,GAAG,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE;AAC5C,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,KAAK;AACT,YAAA,OAAO,EAAE,KAAK;AACd,YAAA,EAAE,EAAE,KAAK;AACV,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA;;MC1CY,cAAc,CAAA;AACR,IAAA,YAAY,GAAG,YAAY,CAAa,YAAY,wDAAC;IAEtD,gBAAgB,GAAG,MAAM,EAAW;AAEpC,IAAA,KAAK,GAAG,KAAK,CAAa,EAAE,iDAAC;AAC7B,IAAA,MAAM,GAAG,KAAK,CAAS,EAAE,kDAAC;AAC1B,IAAA,KAAK,GAAG,KAAK,CAAY,SAAS,iDAAC;IACnC,YAAY,GAAG,KAAK,CAAC,KAAK,yDAAI,SAAS,EAAE,UAAU,EAAA,CAAG;AACtD,IAAA,UAAU,GAAG,KAAK,CAAU,KAAK,sDAAC;AAE/B,IAAA,WAAW,GAAG,QAAQ,CAAC,MAAK;AAC7C,QAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,EAAE;AACxB,YAAA,OAAO,KAAK;QACd;AACA,QAAA,OAAO,IAAI,CAAC,UAAU,EAAE;AAC1B,IAAA,CAAC,uDAAC;AAEiB,IAAA,cAAc,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,YAAY,EAAE,0DAAC;IAEtD,WAAW,GAAG,QAAQ,CAAC,MAAM,aAAa,CAAC,aAAa,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,aAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAC;AAEjG,IAAA,aAAa,GAAG,QAAQ,CAAC,MAC1C,mBAAmB,CAAC;AAClB,QAAA,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE;AACnB,QAAA,YAAY,EAAE,IAAI,CAAC,YAAY,EAAE;AACjC,QAAA,UAAU,EAAE,IAAI,CAAC,WAAW,EAAE;AAC/B,KAAA,CAAC,yDACH;AAEkB,IAAA,YAAY,GAAG,QAAQ,CAAC,MAAM,kBAAkB,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC,wDAAC;AAE1E,IAAA,cAAc,GAAG,QAAQ,CAAC,MAAM,oBAAoB,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC,0DAAC;IAEvF,aAAa,GAAA;AACrB,QAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,EAAE;YACxB;QACF;AAEA,QAAA,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,UAAU,EAAE;AACnC,QAAA,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,QAAQ,CAAC;AAC7B,QAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC;IACtC;uGA1CW,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAd,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,UAAA,EAAA,kBAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,eAAA,EAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,cAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,YAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC7B3B,+gCAiCA,EAAA,MAAA,EAAA,CAAA,iOAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDdY,cAAc,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,OAAA,EAAA,OAAA,EAAA,cAAA,EAAA,MAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAUb,cAAc,EAAA,UAAA,EAAA,CAAA;kBAZ1B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,QAAQ,EAAA,OAAA,EACT,CAAC,cAAc,CAAC,cACb,IAAI,EAAA,eAAA,EAGC,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,SAAS,EAAE,eAAe;AAC3B,qBAAA,EAAA,QAAA,EAAA,+gCAAA,EAAA,MAAA,EAAA,CAAA,iOAAA,CAAA,EAAA;6EAGwD,YAAY,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,gBAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,CAAA,EAAA,KAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,OAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,QAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,KAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,OAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,cAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,YAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AE9BvE;;AAEG;;;;"}
@@ -29,7 +29,7 @@ const zTabsVariants = cva('z-tabs flex', {
29
29
  zType: {
30
30
  line: 'border-b',
31
31
  enclosed: 'gap-1 border-b',
32
- soft: 'bg-muted/50 dark:bg-input/30 rounded-lg p-1 gap-1 border border-border/50',
32
+ soft: 'bg-muted/50 dark:bg-input/30 rounded-[6px] p-1 gap-1 border border-border/50',
33
33
  pill: 'gap-2',
34
34
  solid: 'gap-1',
35
35
  underline: 'gap-2 border-b',
@@ -48,10 +48,10 @@ const zTabItemVariants = cva('z-tab-item relative inline-flex items-center justi
48
48
  variants: {
49
49
  zType: {
50
50
  line: 'border-b-2 border-transparent hover:text-foreground data-[active=true]:border-primary data-[active=true]:text-primary',
51
- enclosed: '-mb-px border border-transparent rounded-t-md hover:bg-muted/50 data-[active=true]:border-border data-[active=true]:border-b-background data-[active=true]:bg-background',
52
- soft: 'rounded-md text-muted-foreground hover:text-foreground hover:bg-background/80 data-[active=true]:bg-white data-[active=true]:dark:bg-input/30 data-[active=true]:text-primary data-[active=true]:shadow',
51
+ enclosed: '-mb-px border border-transparent rounded-t-[6px] hover:bg-muted/50 data-[active=true]:border-border data-[active=true]:border-b-background data-[active=true]:bg-background',
52
+ soft: 'rounded-[6px] text-muted-foreground hover:text-foreground hover:bg-background/80 data-[active=true]:bg-white data-[active=true]:dark:bg-input/30 data-[active=true]:text-primary data-[active=true]:shadow',
53
53
  pill: 'rounded-full hover:bg-muted data-[active=true]:bg-primary data-[active=true]:text-primary-foreground',
54
- solid: 'rounded-md border border-transparent hover:border-border data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:border-primary',
54
+ solid: 'rounded-[6px] border border-transparent hover:border-border data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:border-primary',
55
55
  underline: 'border-b-2 border-transparent hover:text-foreground data-[active=true]:border-primary data-[active=true]:text-primary',
56
56
  },
57
57
  zSize: {
@@ -81,6 +81,7 @@ class ZTabsComponent {
81
81
  zSize = input('default', ...(ngDevMode ? [{ debugName: "zSize" }] : []));
82
82
  zOrientation = input('horizontal', ...(ngDevMode ? [{ debugName: "zOrientation" }] : []));
83
83
  zLazy = input(false, ...(ngDevMode ? [{ debugName: "zLazy" }] : []));
84
+ zTabsOnly = input(false, ...(ngDevMode ? [{ debugName: "zTabsOnly" }] : []));
84
85
  activeTab = model('', ...(ngDevMode ? [{ debugName: "activeTab" }] : []));
85
86
  zTabChange = output();
86
87
  loadedTabs = signal(new Set(), ...(ngDevMode ? [{ debugName: "loadedTabs" }] : []));
@@ -243,14 +244,14 @@ class ZTabsComponent {
243
244
  }, 150);
244
245
  }
245
246
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
246
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", 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 }, zLazy: { classPropertyName: "zLazy", publicName: "zLazy", 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 flex-col gap-4\"\n [class.flex-row]=\"zOrientation() === 'vertical'\"\n [class.gap-4]=\"zOrientation() === 'vertical'\">\n <!-- Tabs Navigation (Left/Scroll/Tabs/Right/Dropdown) -->\n <div class=\"z-tabs-nav flex items-start gap-2\">\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=\"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 class=\"z-tabs-scroll-container relative min-w-0 flex-1\">\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.vertical]=\"zOrientation() === 'vertical'\"\n (scroll)=\"onTabsScroll()\">\n <!-- Tab List -->\n <div [class]=\"tabsClasses()\" role=\"tablist\" [attr.aria-orientation]=\"zOrientation()\">\n @for (tab of zTabs(); track tab.value; let idx = $index) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n (click)=\"selectTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" />\n }\n <span>{{ tab.label | translate }}</span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground ml-1.5 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 </button>\n }\n </div>\n </div>\n\n <!-- Fade overlays (outside scroll container) -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-left\"></div>\n }\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-right\"></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=\"shink-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=\"shink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[100px] max-w-[200px]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <!-- Tab Panels -->\n <div class=\"z-tabs-panels min-h-0\" [class.mt-2]=\"zOrientation() === 'horizontal'\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (shouldRenderPanel(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</div>\n\n<!-- Dropdown Menu Template -->\n<ng-template #dropdownTpl let-close=\"close\">\n <div class=\"z-tabs-dropdown-menu flex max-h-[300px] max-w-[200px] min-w-[100px] 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 transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:bg-primary/10]=\"!isTabActive(tab)\"\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 [class.font-medium]=\"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 shink-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:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}.z-tabs-scroll-wrapper::-webkit-scrollbar{display:none}.z-tabs-scroll-wrapper.vertical{overflow-x:hidden;overflow-y:auto}.z-tabs-fade-left{content:\"\";position:absolute;left:0;top:0;bottom:0;width:40px;background:linear-gradient(to right,var(--background) 0%,oklch(from var(--background) l c h/.8) 30%,oklch(from var(--background) l c h/.4) 60%,oklch(from var(--background) l c h/0) 100%);pointer-events:none;z-index:10}.z-tabs-fade-right{content:\"\";position:absolute;right:0;top:0;bottom:0;width:40px;background:linear-gradient(to left,var(--background) 0%,oklch(from var(--background) l c h/.8) 30%,oklch(from var(--background) l c h/.4) 60%,oklch(from var(--background) l c h/0) 100%);pointer-events:none;z-index:10}.z-tabs.flex-row.border-b{border-bottom:1px solid hsl(var(--border))}.z-tabs.flex-col.border-r{border-right:1px solid hsl(var(--border));padding-right:.5rem}.z-tab-item{-webkit-tap-highlight-color:transparent}.z-tab-item[data-active=true]{position:relative}.z-tab-item:disabled{pointer-events:none}.z-tabs-panels [role=tabpanel]{animation:z-tabs-fade-in .2s ease-in-out}.z-tabs-panels [role=tabpanel][hidden]{display:none}.z-tabs-wrapper .z-tabs.flex-row.border-b+.z-tabs-panels{margin-top:1rem}.z-tabs-wrapper .z-tabs.flex-row:not(.border-b)+.z-tabs-panels{margin-top:-1px}.z-tabs-wrapper .z-tabs.flex-row:not(.border-b)+.z-tabs-panels [role=tabpanel]:not([hidden]){border:1px solid hsl(var(--border));border-radius:0 6px 6px;padding:1rem}.z-tabs-wrapper .z-tabs.bg-muted\\/30+.z-tabs-panels{margin-top:.75rem}.z-tabs-wrapper .z-tabs.flex-col+.z-tabs-panels{margin-top:0;margin-left:1rem}@keyframes z-tabs-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "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", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTrigger", "zTooltipType", "zTooltipSize", "zClass", "zShowDelay", "zHideDelay", "zArrow", "zDisabled", "zOffset", "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", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zManualClose", "zScrollClose", "zShowArrow"], outputs: ["zShow", "zHide", "zHideStart", "zControl"], exportAs: ["zPopover"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
247
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", 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 }, zLazy: { classPropertyName: "zLazy", publicName: "zLazy", isSignal: true, isRequired: false, transformFunction: null }, zTabsOnly: { classPropertyName: "zTabsOnly", publicName: "zTabsOnly", 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-4\"\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 class=\"z-tabs-nav flex items-start gap-2\">\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=\"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 class=\"z-tabs-scroll-container relative min-w-0 flex-1\">\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.vertical]=\"zOrientation() === 'vertical'\"\n (scroll)=\"onTabsScroll()\">\n <!-- Tab List -->\n <div [class]=\"tabsClasses()\" role=\"tablist\" [attr.aria-orientation]=\"zOrientation()\">\n @for (tab of zTabs(); track tab.value; let idx = $index) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n (click)=\"selectTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" />\n }\n <span>{{ tab.label | translate }}</span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground ml-1.5 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 </button>\n }\n </div>\n </div>\n\n <!-- Fade overlays (outside scroll container) -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-left\"></div>\n }\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-right\"></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=\"shink-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=\"shink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[100px] max-w-[200px]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <!-- Tab Panels -->\n @if (!zTabsOnly()) {\n <div class=\"z-tabs-panels min-h-0\" [class.mt-2]=\"zOrientation() === 'horizontal'\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (shouldRenderPanel(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 class=\"z-tabs-dropdown-menu flex max-h-[300px] max-w-[200px] min-w-[100px] 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 transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:bg-primary/10]=\"!isTabActive(tab)\"\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 [class.font-medium]=\"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 shink-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:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}.z-tabs-scroll-wrapper::-webkit-scrollbar{display:none}.z-tabs-scroll-wrapper.vertical{overflow-x:hidden;overflow-y:auto}.z-tabs-fade-left{content:\"\";position:absolute;left:0;top:0;bottom:0;width:40px;background:linear-gradient(to right,var(--background) 0%,oklch(from var(--background) l c h/.8) 30%,oklch(from var(--background) l c h/.4) 60%,oklch(from var(--background) l c h/0) 100%);pointer-events:none;z-index:10}.z-tabs-fade-right{content:\"\";position:absolute;right:0;top:0;bottom:0;width:40px;background:linear-gradient(to left,var(--background) 0%,oklch(from var(--background) l c h/.8) 30%,oklch(from var(--background) l c h/.4) 60%,oklch(from var(--background) l c h/0) 100%);pointer-events:none;z-index:10}.z-tabs.flex-row.border-b{border-bottom:1px solid hsl(var(--border))}.z-tabs.flex-col.border-r{border-right:1px solid hsl(var(--border));padding-right:.5rem}.z-tab-item{-webkit-tap-highlight-color:transparent}.z-tab-item[data-active=true]{position:relative}.z-tab-item:disabled{pointer-events:none}.z-tabs-panels [role=tabpanel]{animation:z-tabs-fade-in .2s ease-in-out}.z-tabs-panels [role=tabpanel][hidden]{display:none}.z-tabs-wrapper .z-tabs.flex-row.border-b+.z-tabs-panels{margin-top:1rem}.z-tabs-wrapper .z-tabs.flex-row:not(.border-b)+.z-tabs-panels{margin-top:-1px}.z-tabs-wrapper .z-tabs.flex-row:not(.border-b)+.z-tabs-panels [role=tabpanel]:not([hidden]){border:1px solid hsl(var(--border));border-radius:0 6px 6px;padding:1rem}.z-tabs-wrapper .z-tabs.bg-muted\\/30+.z-tabs-panels{margin-top:.75rem}.z-tabs-wrapper .z-tabs.flex-col+.z-tabs-panels{margin-top:0;margin-left:1rem}@keyframes z-tabs-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "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", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTrigger", "zTooltipType", "zTooltipSize", "zClass", "zShowDelay", "zHideDelay", "zArrow", "zDisabled", "zOffset", "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", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zManualClose", "zScrollClose", "zShowArrow"], outputs: ["zShow", "zHide", "zHideStart", "zControl"], exportAs: ["zPopover"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
247
248
  }
248
249
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZTabsComponent, decorators: [{
249
250
  type: Component,
250
251
  args: [{ selector: 'z-tabs', imports: [ZIconComponent, ZButtonComponent, ZTooltipDirective, NgTemplateOutlet, ZPopoverDirective, TranslatePipe], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
251
252
  class: 'z-tabs-wrapper block',
252
- }, template: "<div\n class=\"z-tabs-container flex flex-col gap-4\"\n [class.flex-row]=\"zOrientation() === 'vertical'\"\n [class.gap-4]=\"zOrientation() === 'vertical'\">\n <!-- Tabs Navigation (Left/Scroll/Tabs/Right/Dropdown) -->\n <div class=\"z-tabs-nav flex items-start gap-2\">\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=\"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 class=\"z-tabs-scroll-container relative min-w-0 flex-1\">\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.vertical]=\"zOrientation() === 'vertical'\"\n (scroll)=\"onTabsScroll()\">\n <!-- Tab List -->\n <div [class]=\"tabsClasses()\" role=\"tablist\" [attr.aria-orientation]=\"zOrientation()\">\n @for (tab of zTabs(); track tab.value; let idx = $index) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n (click)=\"selectTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" />\n }\n <span>{{ tab.label | translate }}</span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground ml-1.5 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 </button>\n }\n </div>\n </div>\n\n <!-- Fade overlays (outside scroll container) -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-left\"></div>\n }\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-right\"></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=\"shink-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=\"shink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[100px] max-w-[200px]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <!-- Tab Panels -->\n <div class=\"z-tabs-panels min-h-0\" [class.mt-2]=\"zOrientation() === 'horizontal'\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (shouldRenderPanel(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</div>\n\n<!-- Dropdown Menu Template -->\n<ng-template #dropdownTpl let-close=\"close\">\n <div class=\"z-tabs-dropdown-menu flex max-h-[300px] max-w-[200px] min-w-[100px] 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 transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:bg-primary/10]=\"!isTabActive(tab)\"\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 [class.font-medium]=\"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 shink-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:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}.z-tabs-scroll-wrapper::-webkit-scrollbar{display:none}.z-tabs-scroll-wrapper.vertical{overflow-x:hidden;overflow-y:auto}.z-tabs-fade-left{content:\"\";position:absolute;left:0;top:0;bottom:0;width:40px;background:linear-gradient(to right,var(--background) 0%,oklch(from var(--background) l c h/.8) 30%,oklch(from var(--background) l c h/.4) 60%,oklch(from var(--background) l c h/0) 100%);pointer-events:none;z-index:10}.z-tabs-fade-right{content:\"\";position:absolute;right:0;top:0;bottom:0;width:40px;background:linear-gradient(to left,var(--background) 0%,oklch(from var(--background) l c h/.8) 30%,oklch(from var(--background) l c h/.4) 60%,oklch(from var(--background) l c h/0) 100%);pointer-events:none;z-index:10}.z-tabs.flex-row.border-b{border-bottom:1px solid hsl(var(--border))}.z-tabs.flex-col.border-r{border-right:1px solid hsl(var(--border));padding-right:.5rem}.z-tab-item{-webkit-tap-highlight-color:transparent}.z-tab-item[data-active=true]{position:relative}.z-tab-item:disabled{pointer-events:none}.z-tabs-panels [role=tabpanel]{animation:z-tabs-fade-in .2s ease-in-out}.z-tabs-panels [role=tabpanel][hidden]{display:none}.z-tabs-wrapper .z-tabs.flex-row.border-b+.z-tabs-panels{margin-top:1rem}.z-tabs-wrapper .z-tabs.flex-row:not(.border-b)+.z-tabs-panels{margin-top:-1px}.z-tabs-wrapper .z-tabs.flex-row:not(.border-b)+.z-tabs-panels [role=tabpanel]:not([hidden]){border:1px solid hsl(var(--border));border-radius:0 6px 6px;padding:1rem}.z-tabs-wrapper .z-tabs.bg-muted\\/30+.z-tabs-panels{margin-top:.75rem}.z-tabs-wrapper .z-tabs.flex-col+.z-tabs-panels{margin-top:0;margin-left:1rem}@keyframes z-tabs-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}\n"] }]
253
- }], 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 }] }], zLazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLazy", required: false }] }], activeTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTab", required: false }] }, { type: i0.Output, args: ["activeTabChange"] }], zTabChange: [{ type: i0.Output, args: ["zTabChange"] }] } });
253
+ }, template: "<div\n class=\"z-tabs-container flex gap-4\"\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 class=\"z-tabs-nav flex items-start gap-2\">\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=\"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 class=\"z-tabs-scroll-container relative min-w-0 flex-1\">\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.vertical]=\"zOrientation() === 'vertical'\"\n (scroll)=\"onTabsScroll()\">\n <!-- Tab List -->\n <div [class]=\"tabsClasses()\" role=\"tablist\" [attr.aria-orientation]=\"zOrientation()\">\n @for (tab of zTabs(); track tab.value; let idx = $index) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n (click)=\"selectTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" />\n }\n <span>{{ tab.label | translate }}</span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground ml-1.5 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 </button>\n }\n </div>\n </div>\n\n <!-- Fade overlays (outside scroll container) -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-left\"></div>\n }\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-right\"></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=\"shink-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=\"shink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[100px] max-w-[200px]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <!-- Tab Panels -->\n @if (!zTabsOnly()) {\n <div class=\"z-tabs-panels min-h-0\" [class.mt-2]=\"zOrientation() === 'horizontal'\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (shouldRenderPanel(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 class=\"z-tabs-dropdown-menu flex max-h-[300px] max-w-[200px] min-w-[100px] 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 transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:bg-primary/10]=\"!isTabActive(tab)\"\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 [class.font-medium]=\"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 shink-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:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}.z-tabs-scroll-wrapper::-webkit-scrollbar{display:none}.z-tabs-scroll-wrapper.vertical{overflow-x:hidden;overflow-y:auto}.z-tabs-fade-left{content:\"\";position:absolute;left:0;top:0;bottom:0;width:40px;background:linear-gradient(to right,var(--background) 0%,oklch(from var(--background) l c h/.8) 30%,oklch(from var(--background) l c h/.4) 60%,oklch(from var(--background) l c h/0) 100%);pointer-events:none;z-index:10}.z-tabs-fade-right{content:\"\";position:absolute;right:0;top:0;bottom:0;width:40px;background:linear-gradient(to left,var(--background) 0%,oklch(from var(--background) l c h/.8) 30%,oklch(from var(--background) l c h/.4) 60%,oklch(from var(--background) l c h/0) 100%);pointer-events:none;z-index:10}.z-tabs.flex-row.border-b{border-bottom:1px solid hsl(var(--border))}.z-tabs.flex-col.border-r{border-right:1px solid hsl(var(--border));padding-right:.5rem}.z-tab-item{-webkit-tap-highlight-color:transparent}.z-tab-item[data-active=true]{position:relative}.z-tab-item:disabled{pointer-events:none}.z-tabs-panels [role=tabpanel]{animation:z-tabs-fade-in .2s ease-in-out}.z-tabs-panels [role=tabpanel][hidden]{display:none}.z-tabs-wrapper .z-tabs.flex-row.border-b+.z-tabs-panels{margin-top:1rem}.z-tabs-wrapper .z-tabs.flex-row:not(.border-b)+.z-tabs-panels{margin-top:-1px}.z-tabs-wrapper .z-tabs.flex-row:not(.border-b)+.z-tabs-panels [role=tabpanel]:not([hidden]){border:1px solid hsl(var(--border));border-radius:0 6px 6px;padding:1rem}.z-tabs-wrapper .z-tabs.bg-muted\\/30+.z-tabs-panels{margin-top:.75rem}.z-tabs-wrapper .z-tabs.flex-col+.z-tabs-panels{margin-top:0;margin-left:1rem}@keyframes z-tabs-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}\n"] }]
254
+ }], 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 }] }], zLazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLazy", required: false }] }], zTabsOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTabsOnly", required: false }] }], activeTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTab", required: false }] }, { type: i0.Output, args: ["activeTabChange"] }], zTabChange: [{ type: i0.Output, args: ["zTabChange"] }] } });
254
255
 
255
256
  /**
256
257
  * 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.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 { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zTabsVariants = cva('z-tabs flex', {\n variants: {\n zType: {\n line: 'border-b',\n enclosed: 'gap-1 border-b',\n soft: 'bg-muted/50 dark:bg-input/30 rounded-lg p-1 gap-1 border border-border/50',\n pill: 'gap-2',\n solid: 'gap-1',\n underline: 'gap-2 border-b',\n },\n zOrientation: {\n horizontal: 'flex-row',\n vertical: 'flex-col border-r border-b-0',\n },\n },\n defaultVariants: {\n zType: 'line',\n zOrientation: 'horizontal',\n },\n});\n\nexport const zTabItemVariants = cva(\n 'z-tab-item relative inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium transition-[border-color,background-color,color,box-shadow] duration-200 outline-none focus-visible:ring-2 focus-visible:ring-ring cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed',\n {\n variants: {\n zType: {\n line: 'border-b-2 border-transparent hover:text-foreground data-[active=true]:border-primary data-[active=true]:text-primary',\n enclosed:\n '-mb-px border border-transparent rounded-t-md hover:bg-muted/50 data-[active=true]:border-border data-[active=true]:border-b-background data-[active=true]:bg-background',\n soft: 'rounded-md text-muted-foreground hover:text-foreground hover:bg-background/80 data-[active=true]:bg-white data-[active=true]:dark:bg-input/30 data-[active=true]:text-primary data-[active=true]:shadow',\n pill: 'rounded-full hover:bg-muted data-[active=true]:bg-primary data-[active=true]:text-primary-foreground',\n solid:\n 'rounded-md border border-transparent hover:border-border data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:border-primary',\n underline:\n 'border-b-2 border-transparent hover:text-foreground data-[active=true]:border-primary data-[active=true]:text-primary',\n },\n zSize: {\n sm: 'px-3 py-1.5 text-sm',\n default: 'px-4 py-2 text-sm',\n lg: 'px-5 py-2.5 text-base',\n },\n zOrientation: {\n horizontal: '',\n vertical: 'w-full justify-start',\n },\n },\n defaultVariants: {\n zType: 'line',\n zSize: 'default',\n zOrientation: 'horizontal',\n },\n }\n);\n\nexport type ZTabsVariants = VariantProps<typeof zTabsVariants>;\nexport type ZTabItemVariants = VariantProps<typeof zTabItemVariants>;\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} 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 { zMergeClasses } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ZTabPanelDirective } from './directives/z-tab-panel.directive';\nimport type { ZTab, ZTabsType, ZTabsSize, ZTabsOrientation } from './z-tabs.types';\nimport { zTabsVariants, zTabItemVariants } from './z-tabs.variants';\n\n@Component({\n selector: 'z-tabs',\n imports: [ZIconComponent, ZButtonComponent, ZTooltipDirective, NgTemplateOutlet, ZPopoverDirective, TranslatePipe],\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 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 zLazy = input(false);\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\n private _resizeObserver?: ResizeObserver;\n\n constructor() {\n effect(() => {\n this.zTabs();\n requestAnimationFrame(() => this.checkScroll());\n });\n }\n\n ngAfterViewInit(): void {\n this.checkScroll();\n this._setupResizeObserver();\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.class()\n )\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 = false): void {\n if (tab.disabled) {\n return;\n }\n\n this.activeTab.set(tab.value);\n this.zTabChange.emit(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 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 tabButton.nativeElement.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'center',\n });\n }\n });\n }\n }\n\n protected isTabActive(tab: ZTab): boolean {\n return this.activeTab() === tab.value;\n }\n\n protected shouldRenderPanel(tabValue: string): boolean {\n if (!this.zLazy()) {\n return true;\n }\n return this.loadedTabs().has(tabValue) || this.activeTab() === tabValue;\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 this.canScrollLeft.set(scrollLeft > 0);\n this.canScrollRight.set(scrollLeft + clientWidth < scrollWidth - 1);\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 _setupResizeObserver(): void {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container) {\n return;\n }\n\n this._resizeObserver = new ResizeObserver(() => {\n this.checkScroll();\n });\n\n this._resizeObserver.observe(container);\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 flex-col gap-4\"\n [class.flex-row]=\"zOrientation() === 'vertical'\"\n [class.gap-4]=\"zOrientation() === 'vertical'\">\n <!-- Tabs Navigation (Left/Scroll/Tabs/Right/Dropdown) -->\n <div class=\"z-tabs-nav flex items-start gap-2\">\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=\"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 class=\"z-tabs-scroll-container relative min-w-0 flex-1\">\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.vertical]=\"zOrientation() === 'vertical'\"\n (scroll)=\"onTabsScroll()\">\n <!-- Tab List -->\n <div [class]=\"tabsClasses()\" role=\"tablist\" [attr.aria-orientation]=\"zOrientation()\">\n @for (tab of zTabs(); track tab.value; let idx = $index) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n (click)=\"selectTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" />\n }\n <span>{{ tab.label | translate }}</span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground ml-1.5 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 </button>\n }\n </div>\n </div>\n\n <!-- Fade overlays (outside scroll container) -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-left\"></div>\n }\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-right\"></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=\"shink-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=\"shink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[100px] max-w-[200px]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <!-- Tab Panels -->\n <div class=\"z-tabs-panels min-h-0\" [class.mt-2]=\"zOrientation() === 'horizontal'\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (shouldRenderPanel(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</div>\n\n<!-- Dropdown Menu Template -->\n<ng-template #dropdownTpl let-close=\"close\">\n <div class=\"z-tabs-dropdown-menu flex max-h-[300px] max-w-[200px] min-w-[100px] 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 transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:bg-primary/10]=\"!isTabActive(tab)\"\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 [class.font-medium]=\"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 shink-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.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 { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zTabsVariants = cva('z-tabs flex', {\n variants: {\n zType: {\n line: 'border-b',\n enclosed: 'gap-1 border-b',\n soft: 'bg-muted/50 dark:bg-input/30 rounded-[6px] p-1 gap-1 border border-border/50',\n pill: 'gap-2',\n solid: 'gap-1',\n underline: 'gap-2 border-b',\n },\n zOrientation: {\n horizontal: 'flex-row',\n vertical: 'flex-col border-r border-b-0',\n },\n },\n defaultVariants: {\n zType: 'line',\n zOrientation: 'horizontal',\n },\n});\n\nexport const zTabItemVariants = cva(\n 'z-tab-item relative inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium transition-[border-color,background-color,color,box-shadow] duration-200 outline-none focus-visible:ring-2 focus-visible:ring-ring cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed',\n {\n variants: {\n zType: {\n line: 'border-b-2 border-transparent hover:text-foreground data-[active=true]:border-primary data-[active=true]:text-primary',\n enclosed:\n '-mb-px border border-transparent rounded-t-[6px] hover:bg-muted/50 data-[active=true]:border-border data-[active=true]:border-b-background data-[active=true]:bg-background',\n soft: 'rounded-[6px] text-muted-foreground hover:text-foreground hover:bg-background/80 data-[active=true]:bg-white data-[active=true]:dark:bg-input/30 data-[active=true]:text-primary data-[active=true]:shadow',\n pill: 'rounded-full hover:bg-muted data-[active=true]:bg-primary data-[active=true]:text-primary-foreground',\n solid:\n 'rounded-[6px] border border-transparent hover:border-border data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:border-primary',\n underline:\n 'border-b-2 border-transparent hover:text-foreground data-[active=true]:border-primary data-[active=true]:text-primary',\n },\n zSize: {\n sm: 'px-3 py-1.5 text-sm',\n default: 'px-4 py-2 text-sm',\n lg: 'px-5 py-2.5 text-base',\n },\n zOrientation: {\n horizontal: '',\n vertical: 'w-full justify-start',\n },\n },\n defaultVariants: {\n zType: 'line',\n zSize: 'default',\n zOrientation: 'horizontal',\n },\n }\n);\n\nexport type ZTabsVariants = VariantProps<typeof zTabsVariants>;\nexport type ZTabItemVariants = VariantProps<typeof zTabItemVariants>;\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} 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 { zMergeClasses } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ZTabPanelDirective } from './directives/z-tab-panel.directive';\nimport type { ZTab, ZTabsType, ZTabsSize, ZTabsOrientation } from './z-tabs.types';\nimport { zTabsVariants, zTabItemVariants } from './z-tabs.variants';\n\n@Component({\n selector: 'z-tabs',\n imports: [ZIconComponent, ZButtonComponent, ZTooltipDirective, NgTemplateOutlet, ZPopoverDirective, TranslatePipe],\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 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 zLazy = input(false);\n public readonly zTabsOnly = input(false);\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\n private _resizeObserver?: ResizeObserver;\n\n constructor() {\n effect(() => {\n this.zTabs();\n requestAnimationFrame(() => this.checkScroll());\n });\n }\n\n ngAfterViewInit(): void {\n this.checkScroll();\n this._setupResizeObserver();\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.class()\n )\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 = false): void {\n if (tab.disabled) {\n return;\n }\n\n this.activeTab.set(tab.value);\n this.zTabChange.emit(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 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 tabButton.nativeElement.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'center',\n });\n }\n });\n }\n }\n\n protected isTabActive(tab: ZTab): boolean {\n return this.activeTab() === tab.value;\n }\n\n protected shouldRenderPanel(tabValue: string): boolean {\n if (!this.zLazy()) {\n return true;\n }\n return this.loadedTabs().has(tabValue) || this.activeTab() === tabValue;\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 this.canScrollLeft.set(scrollLeft > 0);\n this.canScrollRight.set(scrollLeft + clientWidth < scrollWidth - 1);\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 _setupResizeObserver(): void {\n const container = this.tabsListContainer()?.nativeElement;\n if (!container) {\n return;\n }\n\n this._resizeObserver = new ResizeObserver(() => {\n this.checkScroll();\n });\n\n this._resizeObserver.observe(container);\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-4\"\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 class=\"z-tabs-nav flex items-start gap-2\">\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=\"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 class=\"z-tabs-scroll-container relative min-w-0 flex-1\">\n <div\n #tabsListContainer\n class=\"z-tabs-scroll-wrapper\"\n [class.vertical]=\"zOrientation() === 'vertical'\"\n (scroll)=\"onTabsScroll()\">\n <!-- Tab List -->\n <div [class]=\"tabsClasses()\" role=\"tablist\" [attr.aria-orientation]=\"zOrientation()\">\n @for (tab of zTabs(); track tab.value; let idx = $index) {\n <button\n #tabButton\n type=\"button\"\n role=\"tab\"\n [class]=\"getTabItemClasses(tab)\"\n [attr.data-active]=\"isTabActive(tab)\"\n [attr.aria-selected]=\"isTabActive(tab)\"\n [attr.aria-controls]=\"'panel-' + tab.value\"\n [disabled]=\"tab.disabled\"\n [tabindex]=\"isTabActive(tab) ? 0 : -1\"\n (click)=\"selectTab(tab)\"\n (keydown)=\"onTabKeydown($event, idx)\">\n @if (tab.icon) {\n <z-icon [zType]=\"tab.icon\" zSize=\"16\" />\n }\n <span>{{ tab.label | translate }}</span>\n @if (tab.badge) {\n <span\n class=\"bg-primary text-primary-foreground ml-1.5 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 </button>\n }\n </div>\n </div>\n\n <!-- Fade overlays (outside scroll container) -->\n @if (canScrollLeft() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-left\"></div>\n }\n @if (canScrollRight() && zOrientation() === 'horizontal') {\n <div class=\"z-tabs-fade-right\"></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=\"shink-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=\"shink-0\"\n z-popover\n [zPopoverContent]=\"dropdownTpl\"\n zPosition=\"bottom-right\"\n [zWave]=\"false\"\n zClass=\"min-w-[100px] max-w-[200px]\"\n (zShow)=\"scrollToActiveDropdownItem()\"\n aria-label=\"Select tab\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"16\" />\n </z-button>\n }\n </div>\n\n <!-- Tab Panels -->\n @if (!zTabsOnly()) {\n <div class=\"z-tabs-panels min-h-0\" [class.mt-2]=\"zOrientation() === 'horizontal'\">\n @for (panel of tabPanels(); track panel.zTabPanel()) {\n @if (shouldRenderPanel(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 class=\"z-tabs-dropdown-menu flex max-h-[300px] max-w-[200px] min-w-[100px] 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 transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n [class.hover:bg-primary/10]=\"!isTabActive(tab)\"\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 [class.font-medium]=\"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 shink-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": "1.4.12",
3
+ "version": "1.4.14",
4
4
  "description": "Z-UI: Modern Angular UI Component Library - A comprehensive, high-performance design system built with Angular 20+, featuring 40+ customizable components with dark mode, accessibility, and enterprise-ready features.",
5
5
  "keywords": [
6
6
  "angular",
@@ -395,16 +395,16 @@ declare class ZCalendarComponent implements OnInit, ControlValueAccessor {
395
395
 
396
396
  declare const zCalendarVariants: (props?: ({
397
397
  zSize?: "sm" | "default" | "lg" | null | undefined;
398
- zStatus?: "default" | "disabled" | "readonly" | "open" | "error" | null | undefined;
398
+ zStatus?: "default" | "disabled" | "open" | "error" | "readonly" | null | undefined;
399
399
  } & class_variance_authority_types.ClassProp) | undefined) => string;
400
400
  declare const zCalendarDayVariants: (props?: ({
401
- state?: "default" | "disabled" | "today" | "selected" | "inRange" | "rangeStart" | "rangeEnd" | "rangeSingle" | "otherMonth" | "hovered" | null | undefined;
401
+ state?: "default" | "today" | "selected" | "inRange" | "rangeStart" | "rangeEnd" | "rangeSingle" | "disabled" | "otherMonth" | "hovered" | null | undefined;
402
402
  } & class_variance_authority_types.ClassProp) | undefined) => string;
403
403
  declare const zCalendarMonthVariants: (props?: ({
404
- state?: "default" | "current" | "disabled" | "selected" | null | undefined;
404
+ state?: "default" | "selected" | "disabled" | "current" | null | undefined;
405
405
  } & class_variance_authority_types.ClassProp) | undefined) => string;
406
406
  declare const zCalendarYearVariants: (props?: ({
407
- state?: "default" | "current" | "disabled" | "selected" | null | undefined;
407
+ state?: "default" | "selected" | "disabled" | "current" | null | undefined;
408
408
  } & class_variance_authority_types.ClassProp) | undefined) => string;
409
409
 
410
410
  export { ZCalendarComponent, zCalendarDayVariants, zCalendarMonthVariants, zCalendarVariants, zCalendarYearVariants };
@@ -109,7 +109,7 @@ declare class ZEditorComponent implements OnInit, ControlValueAccessor {
109
109
 
110
110
  declare const zEditorVariants: (props?: ({
111
111
  zSize?: "sm" | "default" | "lg" | null | undefined;
112
- zStatus?: "default" | "disabled" | "readonly" | "error" | null | undefined;
112
+ zStatus?: "default" | "error" | "disabled" | "readonly" | null | undefined;
113
113
  } & class_variance_authority_types.ClassProp) | undefined) => string;
114
114
  type ZEditorVariants = VariantProps<typeof zEditorVariants>;
115
115
 
@@ -187,11 +187,11 @@ declare class ZInputComponent implements OnInit, ControlValueAccessor {
187
187
 
188
188
  declare const zInputVariants: (props?: ({
189
189
  zSize?: "sm" | "default" | "lg" | null | undefined;
190
- zStatus?: "default" | "disabled" | "readonly" | "error" | null | undefined;
190
+ zStatus?: "default" | "error" | "disabled" | "readonly" | null | undefined;
191
191
  } & class_variance_authority_types.ClassProp) | undefined) => string;
192
192
  type ZInputVariants = VariantProps<typeof zInputVariants>;
193
193
  declare const zTextareaVariants: (props?: ({
194
- zStatus?: "default" | "disabled" | "readonly" | "error" | null | undefined;
194
+ zStatus?: "default" | "error" | "disabled" | "readonly" | null | undefined;
195
195
  } & class_variance_authority_types.ClassProp) | undefined) => string;
196
196
  type ZTextareaVariants = VariantProps<typeof zTextareaVariants>;
197
197
 
@@ -220,7 +220,7 @@ declare class ZModalComponent<T, U> extends BasePortalOutlet implements OnDestro
220
220
  protected readonly effectiveOkText: _angular_core.Signal<string | null | undefined>;
221
221
  protected readonly effectiveCancelText: _angular_core.Signal<string | null | undefined>;
222
222
  protected readonly effectiveOkDestructive: _angular_core.Signal<boolean | undefined>;
223
- protected readonly effectiveTypeOk: _angular_core.Signal<"info" | "warning" | "error" | "default" | "primary" | "secondary" | "destructive" | "success" | "outline" | "outline-primary" | "outline-secondary" | "outline-success" | "outline-info" | "outline-warning" | "outline-error" | "outline-destructive" | "outline-success-secondary" | "outline-info-secondary" | "outline-warning-secondary" | "outline-error-secondary" | "outline-destructive-secondary" | "outline-primary-secondary" | "ghost" | "ghost-primary" | "ghost-success" | "ghost-info" | "ghost-warning" | "ghost-error" | "ghost-destructive" | "subtle" | "link" | null | undefined>;
223
+ protected readonly effectiveTypeOk: _angular_core.Signal<"info" | "warning" | "error" | "link" | "default" | "primary" | "secondary" | "destructive" | "success" | "outline" | "outline-primary" | "outline-secondary" | "outline-success" | "outline-info" | "outline-warning" | "outline-error" | "outline-destructive" | "outline-success-secondary" | "outline-info-secondary" | "outline-warning-secondary" | "outline-error-secondary" | "outline-destructive-secondary" | "outline-primary-secondary" | "ghost" | "ghost-primary" | "ghost-success" | "ghost-info" | "ghost-warning" | "ghost-error" | "ghost-destructive" | "subtle" | null | undefined>;
224
224
  protected readonly effectiveOkDisabled: _angular_core.Signal<boolean | undefined>;
225
225
  protected readonly effectiveLoading: _angular_core.Signal<boolean>;
226
226
  protected readonly effectiveContentLoading: _angular_core.Signal<boolean>;
@@ -271,7 +271,7 @@ declare class ZTagClassesPipe implements PipeTransform {
271
271
 
272
272
  declare const zSelectVariants: (props?: ({
273
273
  zSize?: "sm" | "default" | "lg" | null | undefined;
274
- zStatus?: "default" | "disabled" | "readonly" | "open" | "error" | null | undefined;
274
+ zStatus?: "default" | "open" | "error" | "disabled" | "readonly" | null | undefined;
275
275
  } & class_variance_authority_types.ClassProp) | undefined) => string;
276
276
  declare const zSelectTagVariants: (props?: ({
277
277
  zSize?: "sm" | "default" | "lg" | null | undefined;
@@ -604,7 +604,7 @@ declare class ZTableActionsComponent<T = unknown> {
604
604
  readonly zConfig: _angular_core.InputSignal<ZTableActionColumnConfig<T>>;
605
605
  readonly zRow: _angular_core.InputSignal<T>;
606
606
  readonly zRowId: _angular_core.InputSignal<string>;
607
- readonly zDropdownButtonSize: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "xl" | null | undefined>;
607
+ readonly zDropdownButtonSize: _angular_core.InputSignal<"sm" | "default" | "lg" | "xs" | "xl" | null | undefined>;
608
608
  readonly zActionClick: _angular_core.OutputEmitterRef<ZTableActionClickEvent<T>>;
609
609
  protected readonly allActions: _angular_core.Signal<ZTableActionItem<T>[]>;
610
610
  protected readonly shouldShowAsButtons: _angular_core.Signal<boolean>;
@@ -34,6 +34,7 @@ declare class ZTabsComponent implements AfterViewInit, OnDestroy {
34
34
  readonly zSize: _angular_core.InputSignal<ZTabsSize>;
35
35
  readonly zOrientation: _angular_core.InputSignal<ZTabsOrientation>;
36
36
  readonly zLazy: _angular_core.InputSignal<boolean>;
37
+ readonly zTabsOnly: _angular_core.InputSignal<boolean>;
37
38
  readonly activeTab: _angular_core.ModelSignal<string>;
38
39
  readonly zTabChange: _angular_core.OutputEmitterRef<string>;
39
40
  protected readonly loadedTabs: _angular_core.WritableSignal<Set<string>>;
@@ -56,7 +57,7 @@ declare class ZTabsComponent implements AfterViewInit, OnDestroy {
56
57
  private _setupResizeObserver;
57
58
  protected scrollToActiveDropdownItem(): void;
58
59
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZTabsComponent, never>;
59
- 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; }; "zLazy": { "alias": "zLazy"; "required": false; "isSignal": true; }; "activeTab": { "alias": "activeTab"; "required": false; "isSignal": true; }; }, { "activeTab": "activeTabChange"; "zTabChange": "zTabChange"; }, ["tabPanels"], never, true, never>;
60
+ 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; }; "zLazy": { "alias": "zLazy"; "required": false; "isSignal": true; }; "zTabsOnly": { "alias": "zTabsOnly"; "required": false; "isSignal": true; }; "activeTab": { "alias": "activeTab"; "required": false; "isSignal": true; }; }, { "activeTab": "activeTabChange"; "zTabChange": "zTabChange"; }, ["tabPanels"], never, true, never>;
60
61
  }
61
62
 
62
63
  declare const zTabsVariants: (props?: ({
@@ -32,7 +32,7 @@ declare class ZTimelineComponent {
32
32
  readonly class: _angular_core.InputSignal<ClassValue>;
33
33
  readonly zItems: _angular_core.InputSignal<ZTimelineItem[]>;
34
34
  readonly zSize: _angular_core.InputSignal<ZTimelineSize>;
35
- readonly zTimeVariant: _angular_core.InputSignal<"default" | "secondary" | "outline" | "muted">;
35
+ readonly zTimeVariant: _angular_core.InputSignal<"default" | "outline" | "secondary" | "muted">;
36
36
  readonly zLineStyle: _angular_core.InputSignal<ZTimelineLineStyle>;
37
37
  readonly zIconStyle: _angular_core.InputSignal<ZTimelineIconStyle>;
38
38
  readonly zLayout: _angular_core.InputSignal<ZTimelineLayout>;
@@ -57,7 +57,7 @@ declare class ZTimelineClassPipe implements PipeTransform {
57
57
  }
58
58
 
59
59
  declare const zTimelineVariants: (props?: ({
60
- zSize?: "sm" | "default" | "lg" | null | undefined;
60
+ zSize?: "default" | "sm" | "lg" | null | undefined;
61
61
  zLayout?: "default" | "reversed" | "alternate" | null | undefined;
62
62
  } & class_variance_authority_types.ClassProp) | undefined) => string;
63
63
  declare const zTimelineItemVariants: (props?: ({
@@ -71,18 +71,18 @@ declare const zTimelineHeaderVariants: (props?: ({
71
71
  } & class_variance_authority_types.ClassProp) | undefined) => string;
72
72
  declare const zTimelineIconVariants: (props?: ({
73
73
  zColor?: "default" | "primary" | "success" | "warning" | "error" | "info" | null | undefined;
74
- zIconStyle?: "outline" | "filled" | null | undefined;
74
+ zIconStyle?: "filled" | "outline" | null | undefined;
75
75
  zLayout?: "default" | "reversed" | "alternate" | null | undefined;
76
76
  } & class_variance_authority_types.ClassProp) | undefined) => string;
77
77
  declare const zTimelineTitleVariants: (props?: ({
78
- zSize?: "sm" | "default" | "lg" | null | undefined;
78
+ zSize?: "default" | "sm" | "lg" | null | undefined;
79
79
  } & class_variance_authority_types.ClassProp) | undefined) => string;
80
80
  declare const zTimelineTimeVariants: (props?: ({
81
- zVariant?: "default" | "secondary" | "outline" | "muted" | null | undefined;
81
+ zVariant?: "default" | "outline" | "secondary" | "muted" | null | undefined;
82
82
  zLayout?: "default" | "reversed" | "alternate" | null | undefined;
83
83
  } & class_variance_authority_types.ClassProp) | undefined) => string;
84
84
  declare const zTimelineDescriptionVariants: (props?: ({
85
- zSize?: "sm" | "default" | "lg" | null | undefined;
85
+ zSize?: "default" | "sm" | "lg" | null | undefined;
86
86
  } & class_variance_authority_types.ClassProp) | undefined) => string;
87
87
  declare const zTimelineContentVariants: (props?: ({
88
88
  zContentStyle?: "simple" | "card" | null | undefined;
@@ -86,7 +86,7 @@ declare class ZUploadComponent implements OnInit, ControlValueAccessor {
86
86
  protected readonly hasError: _angular_core.Signal<boolean>;
87
87
  protected readonly showError: _angular_core.Signal<boolean>;
88
88
  protected readonly errorMessage: _angular_core.Signal<string>;
89
- protected readonly currentStatus: _angular_core.Signal<"default" | "disabled" | "readonly" | "error" | "active">;
89
+ protected readonly currentStatus: _angular_core.Signal<"default" | "error" | "disabled" | "readonly" | "active">;
90
90
  protected readonly dropzoneClasses: _angular_core.Signal<string>;
91
91
  protected readonly acceptTypes: _angular_core.Signal<string>;
92
92
  protected readonly formatFileSize: (bytes: number) => string;
@@ -125,11 +125,11 @@ declare class ZUploadComponent implements OnInit, ControlValueAccessor {
125
125
 
126
126
  declare const zUploadDropzoneVariants: (props?: ({
127
127
  zSize?: "sm" | "default" | "lg" | null | undefined;
128
- zStatus?: "default" | "disabled" | "readonly" | "error" | "active" | null | undefined;
128
+ zStatus?: "default" | "error" | "active" | "disabled" | "readonly" | null | undefined;
129
129
  } & class_variance_authority_types.ClassProp) | undefined) => string;
130
130
  type ZUploadDropzoneVariants = VariantProps<typeof zUploadDropzoneVariants>;
131
131
  declare const zUploadFileItemVariants: (props?: ({
132
- zStatus?: "error" | "pending" | "uploading" | "success" | null | undefined;
132
+ zStatus?: "pending" | "uploading" | "success" | "error" | null | undefined;
133
133
  } & class_variance_authority_types.ClassProp) | undefined) => string;
134
134
  type ZUploadFileItemVariants = VariantProps<typeof zUploadFileItemVariants>;
135
135