angular-tailwind-components 1.8.3-RC4 → 1.8.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/angular-tailwind-components.mjs +144 -144
- package/package.json +1 -1
|
@@ -348,10 +348,10 @@ class TailwindComponent {
|
|
|
348
348
|
id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : /* istanbul ignore next */ []));
|
|
349
349
|
/** Custom CSS classes to append */
|
|
350
350
|
class = input(undefined, { ...(ngDevMode ? { debugName: "class" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
351
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
352
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
351
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
352
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", type: TailwindComponent, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.id": "id() || null", "class": "class() || null" } }, ngImport: i0 });
|
|
353
353
|
}
|
|
354
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
354
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindComponent, decorators: [{
|
|
355
355
|
type: Directive,
|
|
356
356
|
args: [{
|
|
357
357
|
host: {
|
|
@@ -463,10 +463,10 @@ class TailwindTooltip extends TailwindComponent {
|
|
|
463
463
|
window.removeEventListener('scroll', this.scrollListener, true);
|
|
464
464
|
window.removeEventListener('resize', this.scrollListener, true);
|
|
465
465
|
}
|
|
466
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
467
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.
|
|
466
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTooltip, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
467
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.14", type: TailwindTooltip, isStandalone: true, selector: "tailwind-tooltip", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "tooltipEl", first: true, predicate: ["tooltipEl"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div #tooltipEl role=\"tooltip\" [class]=\"tooltipClasses()\" [style.top.px]=\"topPos()\" [style.left.px]=\"leftPos()\">\n {{ text() }}\n <!-- Arrow -->\n <div [class]=\"arrowClasses()\"></div>\n</div>\n", styles: [":host{display:inline-flex}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
468
468
|
}
|
|
469
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
469
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTooltip, decorators: [{
|
|
470
470
|
type: Component,
|
|
471
471
|
args: [{ selector: 'tailwind-tooltip', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #tooltipEl role=\"tooltip\" [class]=\"tooltipClasses()\" [style.top.px]=\"topPos()\" [style.left.px]=\"leftPos()\">\n {{ text() }}\n <!-- Arrow -->\n <div [class]=\"arrowClasses()\"></div>\n</div>\n", styles: [":host{display:inline-flex}\n"] }]
|
|
472
472
|
}], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: true }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], tooltipEl: [{ type: i0.ViewChild, args: ['tooltipEl', { isSignal: true }] }] } });
|
|
@@ -568,10 +568,10 @@ class TailwindTooltipDirective {
|
|
|
568
568
|
this.clearHideTimeout();
|
|
569
569
|
this.destroyComponent();
|
|
570
570
|
}
|
|
571
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
572
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
571
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTooltipDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
572
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", type: TailwindTooltipDirective, isStandalone: true, selector: "[tooltip]", inputs: { tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: true, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "show()", "focusin": "show()", "mouseleave": "hideFromPointer()", "focusout": "hideFromFocus($event)" } }, ngImport: i0 });
|
|
573
573
|
}
|
|
574
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
574
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTooltipDirective, decorators: [{
|
|
575
575
|
type: Directive,
|
|
576
576
|
args: [{
|
|
577
577
|
selector: '[tooltip]',
|
|
@@ -599,10 +599,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
599
599
|
*/
|
|
600
600
|
class TailwindTableRowDirective {
|
|
601
601
|
templateRef = inject((TemplateRef));
|
|
602
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
603
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
602
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTableRowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
603
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.14", type: TailwindTableRowDirective, isStandalone: true, selector: "[tailwindTableRow]", ngImport: i0 });
|
|
604
604
|
}
|
|
605
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
605
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTableRowDirective, decorators: [{
|
|
606
606
|
type: Directive,
|
|
607
607
|
args: [{
|
|
608
608
|
selector: '[tailwindTableRow]',
|
|
@@ -645,10 +645,10 @@ class TailwindIcon extends TailwindComponent {
|
|
|
645
645
|
return custom ? `tailwind-icon-glyph ${custom}` : 'tailwind-icon-glyph';
|
|
646
646
|
}, ...(ngDevMode ? [{ debugName: "glyphClasses" }] : /* istanbul ignore next */ []));
|
|
647
647
|
maskImage = computed(() => `url("${this.src()}")`, ...(ngDevMode ? [{ debugName: "maskImage" }] : /* istanbul ignore next */ []));
|
|
648
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
649
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
648
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindIcon, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
649
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.14", type: TailwindIcon, isStandalone: true, selector: "tailwind-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, usesInheritance: true, ngImport: i0, template: "<span\n [class]=\"glyphClasses()\"\n [style.width.px]=\"pixelSize()\"\n [style.height.px]=\"pixelSize()\"\n [style.mask-image]=\"maskImage()\"\n [style.-webkit-mask-image]=\"maskImage()\"\n [attr.aria-hidden]=\"true\"\n [attr.aria-label]=\"icon()\"></span>\n", styles: [".tailwind-icon-glyph{display:block;flex-shrink:0;background-color:currentColor;mask-size:contain;mask-repeat:no-repeat;mask-position:center;-webkit-mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
650
650
|
}
|
|
651
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
651
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindIcon, decorators: [{
|
|
652
652
|
type: Component,
|
|
653
653
|
args: [{ selector: 'tailwind-icon', host: {
|
|
654
654
|
'[class]': 'hostClasses()'
|
|
@@ -757,10 +757,10 @@ class TailwindSortHeaderDirective {
|
|
|
757
757
|
this.labelWrapper = wrapper;
|
|
758
758
|
return wrapper;
|
|
759
759
|
}
|
|
760
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
761
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
760
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindSortHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
761
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", type: TailwindSortHeaderDirective, isStandalone: true, selector: "[tailwindSortHeader]", inputs: { sortKey: { classPropertyName: "sortKey", publicName: "sortKey", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "attr.tabindex": "0", "attr.data-sort-key": "sortKey()" }, classAttribute: "cursor-pointer whitespace-nowrap text-left select-none hover:text-neutral-900" }, ngImport: i0 });
|
|
762
762
|
}
|
|
763
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
763
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindSortHeaderDirective, decorators: [{
|
|
764
764
|
type: Directive,
|
|
765
765
|
args: [{
|
|
766
766
|
selector: '[tailwindSortHeader]',
|
|
@@ -898,10 +898,10 @@ class TailwindButton extends TailwindComponent {
|
|
|
898
898
|
this.onClick.emit(event);
|
|
899
899
|
}
|
|
900
900
|
}
|
|
901
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
902
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
901
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindButton, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
902
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindButton, isStandalone: true, selector: "tailwind-button", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, kind: { classPropertyName: "kind", publicName: "kind", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClick: "onClick" }, usesInheritance: true, ngImport: i0, template: "<button\n [ngClass]=\"computedClasses()\"\n [disabled]=\"disabled()\"\n [type]=\"type()\"\n [attr.role]=\"role()\"\n [attr.aria-label]=\"ariaLabel() || null\"\n [attr.aria-disabled]=\"disabled() || null\"\n (click)=\"handleClick($event)\">\n <span class=\"inline-flex min-w-0 items-center justify-center gap-2\">\n @if (icon() && iconPosition() === 'left') {\n <tailwind-icon [icon]=\"icon()!\" [size]=\"iconPixelSize()\" class=\"shrink-0\" />\n }\n <span class=\"tailwind-button-label inline-flex min-w-0 items-center empty:hidden\">\n <ng-content />\n </span>\n @if (icon() && iconPosition() === 'right') {\n <tailwind-icon [icon]=\"icon()!\" [size]=\"iconPixelSize()\" class=\"shrink-0\" />\n }\n </span>\n</button>\n", styles: [":host{display:inline-block}.tailwind-btn-spinner{animation:tailwind-spin 1s linear infinite;width:1em;height:1em}@keyframes tailwind-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
903
903
|
}
|
|
904
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
904
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindButton, decorators: [{
|
|
905
905
|
type: Component,
|
|
906
906
|
args: [{ imports: [NgClass, TailwindIcon], selector: 'tailwind-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n [ngClass]=\"computedClasses()\"\n [disabled]=\"disabled()\"\n [type]=\"type()\"\n [attr.role]=\"role()\"\n [attr.aria-label]=\"ariaLabel() || null\"\n [attr.aria-disabled]=\"disabled() || null\"\n (click)=\"handleClick($event)\">\n <span class=\"inline-flex min-w-0 items-center justify-center gap-2\">\n @if (icon() && iconPosition() === 'left') {\n <tailwind-icon [icon]=\"icon()!\" [size]=\"iconPixelSize()\" class=\"shrink-0\" />\n }\n <span class=\"tailwind-button-label inline-flex min-w-0 items-center empty:hidden\">\n <ng-content />\n </span>\n @if (icon() && iconPosition() === 'right') {\n <tailwind-icon [icon]=\"icon()!\" [size]=\"iconPixelSize()\" class=\"shrink-0\" />\n }\n </span>\n</button>\n", styles: [":host{display:inline-block}.tailwind-btn-spinner{animation:tailwind-spin 1s linear infinite;width:1em;height:1em}@keyframes tailwind-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
|
|
907
907
|
}], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], kind: [{ type: i0.Input, args: [{ isSignal: true, alias: "kind", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconPosition", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], onClick: [{ type: i0.Output, args: ["onClick"] }] } });
|
|
@@ -971,8 +971,8 @@ class TailwindInput extends TailwindComponent {
|
|
|
971
971
|
onBlur() {
|
|
972
972
|
this.onTouched();
|
|
973
973
|
}
|
|
974
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
975
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
974
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindInput, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
975
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindInput, isStandalone: true, selector: "tailwind-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, providers: [
|
|
976
976
|
{
|
|
977
977
|
provide: NG_VALUE_ACCESSOR,
|
|
978
978
|
useExisting: forwardRef(() => TailwindInput),
|
|
@@ -980,7 +980,7 @@ class TailwindInput extends TailwindComponent {
|
|
|
980
980
|
}
|
|
981
981
|
], usesInheritance: true, ngImport: i0, template: "<div class=\"tailwind-input-wrapper flex flex-col gap-1.5\">\n @if (label()) {\n <label\n [attr.for]=\"id() ? id() + '-inner' : null\"\n class=\"text-sm font-medium text-neutral-700\"\n [class.text-danger-600]=\"hasError()\">\n {{ label() }}\n </label>\n }\n\n <input\n [attr.id]=\"id() ? id() + '-inner' : null\"\n [type]=\"type()\"\n [placeholder]=\"placeholder()\"\n [disabled]=\"isDisabled()\"\n [readonly]=\"readonly()\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"(helperText() || errorText()) && id() ? id() + '-helper' : null\"\n [value]=\"value()\"\n [class]=\"inputClasses()\"\n (input)=\"onInputChange($event)\"\n (blur)=\"onBlur()\" />\n\n @if (helperText() && !hasError()) {\n <p [attr.id]=\"id() ? id() + '-helper' : null\" class=\"text-xs text-neutral-500\">\n {{ helperText() }}\n </p>\n }\n @if (errorText() && hasError()) {\n <p [attr.id]=\"id() ? id() + '-helper' : null\" class=\"text-xs text-danger-600\">\n {{ errorText() }}\n </p>\n }\n</div>\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
982
982
|
}
|
|
983
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
983
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindInput, decorators: [{
|
|
984
984
|
type: Component,
|
|
985
985
|
args: [{ selector: 'tailwind-input', providers: [
|
|
986
986
|
{
|
|
@@ -1067,8 +1067,8 @@ class TailwindTextarea extends TailwindComponent {
|
|
|
1067
1067
|
onBlur() {
|
|
1068
1068
|
this.onTouched();
|
|
1069
1069
|
}
|
|
1070
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1071
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1070
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTextarea, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1071
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindTextarea, isStandalone: true, selector: "tailwind-textarea", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, cols: { classPropertyName: "cols", publicName: "cols", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, providers: [
|
|
1072
1072
|
{
|
|
1073
1073
|
provide: NG_VALUE_ACCESSOR,
|
|
1074
1074
|
useExisting: forwardRef(() => TailwindTextarea),
|
|
@@ -1076,7 +1076,7 @@ class TailwindTextarea extends TailwindComponent {
|
|
|
1076
1076
|
}
|
|
1077
1077
|
], usesInheritance: true, ngImport: i0, template: "<div class=\"tailwind-textarea-wrapper flex flex-col gap-1.5\">\n @if (label()) {\n <label\n [attr.for]=\"id() ? id() + '-inner' : null\"\n class=\"text-sm font-medium text-neutral-700\"\n [class.text-danger-600]=\"hasError()\">\n {{ label() }}\n </label>\n }\n\n <textarea\n [attr.id]=\"id() ? id() + '-inner' : null\"\n [placeholder]=\"placeholder()\"\n [rows]=\"rows()\"\n [attr.cols]=\"cols() ?? null\"\n [attr.maxlength]=\"maxlength() ?? null\"\n [disabled]=\"isDisabled()\"\n [readonly]=\"readonly()\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"(helperText() || errorText()) && id() ? id() + '-helper' : null\"\n [value]=\"value()\"\n [class]=\"textareaClasses()\"\n (input)=\"onInputChange($event)\"\n (blur)=\"onBlur()\"></textarea>\n\n @if (helperText() && !hasError()) {\n <p [attr.id]=\"id() ? id() + '-helper' : null\" class=\"text-xs text-neutral-500\">\n {{ helperText() }}\n </p>\n }\n @if (errorText() && hasError()) {\n <p [attr.id]=\"id() ? id() + '-helper' : null\" class=\"text-xs text-danger-600\">\n {{ errorText() }}\n </p>\n }\n</div>\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1078
1078
|
}
|
|
1079
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1079
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTextarea, decorators: [{
|
|
1080
1080
|
type: Component,
|
|
1081
1081
|
args: [{ selector: 'tailwind-textarea', providers: [
|
|
1082
1082
|
{
|
|
@@ -1290,8 +1290,8 @@ class TailwindUpload extends TailwindComponent {
|
|
|
1290
1290
|
reader.readAsDataURL(file);
|
|
1291
1291
|
});
|
|
1292
1292
|
}
|
|
1293
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1294
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1293
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindUpload, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1294
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindUpload, isStandalone: true, selector: "tailwind-upload", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, buttonLabel: { classPropertyName: "buttonLabel", publicName: "buttonLabel", isSignal: true, isRequired: false, transformFunction: null }, areaTitle: { classPropertyName: "areaTitle", publicName: "areaTitle", isSignal: true, isRequired: false, transformFunction: null }, areaHint: { classPropertyName: "areaHint", publicName: "areaHint", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, maxFileSizeBytes: { classPropertyName: "maxFileSizeBytes", publicName: "maxFileSizeBytes", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, clearText: { classPropertyName: "clearText", publicName: "clearText", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", filesSelected: "filesSelected", validationError: "validationError" }, providers: [
|
|
1295
1295
|
{
|
|
1296
1296
|
provide: NG_VALUE_ACCESSOR,
|
|
1297
1297
|
useExisting: forwardRef(() => TailwindUpload),
|
|
@@ -1299,7 +1299,7 @@ class TailwindUpload extends TailwindComponent {
|
|
|
1299
1299
|
}
|
|
1300
1300
|
], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"tailwind-upload-wrapper flex flex-col gap-1.5\">\n @if (label()) {\n <label [attr.for]=\"fileInputId()\" class=\"text-sm font-medium text-neutral-700\" [class.text-danger-600]=\"hasError()\">\n {{ label() }}\n </label>\n }\n\n <input\n #fileInput\n type=\"file\"\n class=\"sr-only\"\n [attr.id]=\"fileInputId()\"\n [accept]=\"accept() ?? null\"\n [attr.multiple]=\"multiple() ? '' : null\"\n [disabled]=\"isDisabled()\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"helperText() || errorText() ? fileInputId() + '-helper' : null\"\n (change)=\"onNativeChange($event)\"\n (blur)=\"blurHost()\" />\n\n @if (variant() === 'button') {\n <div class=\"flex flex-wrap items-center gap-2\">\n <tailwind-button\n type=\"button\"\n color=\"primary\"\n kind=\"solid\"\n [size]=\"size()\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"triggerPicker($event)\">\n {{ buttonLabel() }}\n </tailwind-button>\n @if (showClear() && value()) {\n <tailwind-button\n kind=\"text\"\n color=\"primary\"\n size=\"sm\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"clear($event)\">\n {{ clearText() }}\n </tailwind-button>\n }\n </div>\n } @else {\n <div class=\"flex flex-col gap-2\">\n <div\n role=\"button\"\n tabindex=\"0\"\n [class]=\"areaClasses()\"\n [attr.aria-disabled]=\"isDisabled() || null\"\n (click)=\"triggerPicker($event)\"\n (keydown)=\"onKeydownArea($event)\"\n (dragenter)=\"onDragEnter($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (dragover)=\"onDragOver($event)\"\n (drop)=\"onDrop($event)\">\n <tailwind-icon icon=\"cloud-arrow-up\" [size]=\"40\" />\n <span class=\"text-sm font-medium\">{{ areaTitle() }}</span>\n <span class=\"text-xs text-neutral-500\">{{ areaHint() }}</span>\n </div>\n @if (showClear() && value()) {\n <tailwind-button\n kind=\"text\"\n color=\"primary\"\n size=\"sm\"\n class=\"self-start\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"clear($event)\">\n {{ clearText() }}\n </tailwind-button>\n }\n </div>\n }\n\n @if (selectedNames().length) {\n <p class=\"truncate text-xs text-neutral-600\" [attr.title]=\"selectedNames().join(', ')\">\n {{ selectedNames().join(', ') }}\n </p>\n }\n\n @if (helperText() && !hasError()) {\n <p [attr.id]=\"fileInputId() + '-helper'\" class=\"text-xs text-neutral-500\">\n {{ helperText() }}\n </p>\n }\n @if (errorText() && hasError()) {\n <p [attr.id]=\"fileInputId() + '-helper'\" class=\"text-xs text-danger-600\">\n {{ errorText() }}\n </p>\n }\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }, { kind: "component", type: TailwindButton, selector: "tailwind-button", inputs: ["color", "kind", "size", "disabled", "type", "role", "icon", "iconPosition", "ariaLabel"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1301
1301
|
}
|
|
1302
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1302
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindUpload, decorators: [{
|
|
1303
1303
|
type: Component,
|
|
1304
1304
|
args: [{ selector: 'tailwind-upload', imports: [TailwindIcon, TailwindButton], providers: [
|
|
1305
1305
|
{
|
|
@@ -1523,8 +1523,8 @@ class TailwindInputOtp extends TailwindComponent {
|
|
|
1523
1523
|
el?.select();
|
|
1524
1524
|
});
|
|
1525
1525
|
}
|
|
1526
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1527
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1526
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindInputOtp, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1527
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindInputOtp, isStandalone: true, selector: "tailwind-input-otp", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, integerOnly: { classPropertyName: "integerOnly", publicName: "integerOnly", isSignal: true, isRequired: false, transformFunction: null }, mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, separatorAfterIndex: { classPropertyName: "separatorAfterIndex", publicName: "separatorAfterIndex", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", completed: "completed" }, providers: [
|
|
1528
1528
|
{
|
|
1529
1529
|
provide: NG_VALUE_ACCESSOR,
|
|
1530
1530
|
useExisting: forwardRef(() => TailwindInputOtp),
|
|
@@ -1532,7 +1532,7 @@ class TailwindInputOtp extends TailwindComponent {
|
|
|
1532
1532
|
}
|
|
1533
1533
|
], viewQueries: [{ propertyName: "otpInputs", predicate: ["otpDigit"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"tailwind-input-otp-wrapper flex flex-col gap-1.5\">\n @if (label()) {\n <label [attr.for]=\"cellId(0)\" class=\"text-sm font-medium text-neutral-700\" [class.text-danger-600]=\"hasError()\">\n {{ label() }}\n </label>\n }\n\n <div role=\"group\" [attr.aria-label]=\"groupAriaLabel()\" class=\"flex flex-wrap items-center gap-2\">\n @for (idx of slotIndexes(); track idx) {\n <input\n #otpDigit\n [attr.id]=\"cellId(idx)\"\n [type]=\"inputType()\"\n [attr.inputmode]=\"inputMode()\"\n [attr.autocomplete]=\"autocompleteForSlot(idx)\"\n [attr.aria-label]=\"'Digit ' + (idx + 1) + ' of ' + slotIndexes().length\"\n [disabled]=\"isDisabled()\"\n [readonly]=\"readonly()\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"(helperText() || errorText()) && id() ? id() + '-helper' : null\"\n maxlength=\"1\"\n spellcheck=\"false\"\n [class]=\"cellClasses()\"\n [value]=\"digitAt(idx)\"\n (input)=\"onInput($event, idx)\"\n (keydown)=\"onKeydown($event, idx)\"\n (paste)=\"onPaste($event, idx)\"\n (focus)=\"onSlotFocus(idx)\" />\n @if (showSeparatorAfter(idx)) {\n <span class=\"select-none text-neutral-500\" aria-hidden=\"true\">{{ separator() }}</span>\n }\n }\n </div>\n\n @if (helperText() && !hasError()) {\n <p [attr.id]=\"id() ? id() + '-helper' : null\" class=\"text-xs text-neutral-500\">\n {{ helperText() }}\n </p>\n }\n @if (errorText() && hasError()) {\n <p [attr.id]=\"id() ? id() + '-helper' : null\" class=\"text-xs text-danger-600\">\n {{ errorText() }}\n </p>\n }\n</div>\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1534
1534
|
}
|
|
1535
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1535
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindInputOtp, decorators: [{
|
|
1536
1536
|
type: Component,
|
|
1537
1537
|
args: [{ selector: 'tailwind-input-otp', providers: [
|
|
1538
1538
|
{
|
|
@@ -1597,8 +1597,8 @@ class TailwindCheckbox extends TailwindComponent {
|
|
|
1597
1597
|
this.onChange(val);
|
|
1598
1598
|
this.onTouched();
|
|
1599
1599
|
}
|
|
1600
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1601
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1600
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindCheckbox, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1601
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindCheckbox, isStandalone: true, selector: "tailwind-checkbox", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, providers: [
|
|
1602
1602
|
{
|
|
1603
1603
|
provide: NG_VALUE_ACCESSOR,
|
|
1604
1604
|
useExisting: forwardRef(() => TailwindCheckbox),
|
|
@@ -1606,7 +1606,7 @@ class TailwindCheckbox extends TailwindComponent {
|
|
|
1606
1606
|
}
|
|
1607
1607
|
], usesInheritance: true, ngImport: i0, template: "<div class=\"inline-flex items-center gap-2.5 select-none\" [class.opacity-50]=\"isDisabled()\">\n <label\n class=\"relative flex items-center justify-center shrink-0\"\n [class.cursor-pointer]=\"!isDisabled()\"\n [class.cursor-not-allowed]=\"isDisabled()\"\n [attr.for]=\"id() ? id() + '-inner' : null\">\n <input\n [attr.id]=\"id() ? id() + '-inner' : null\"\n type=\"checkbox\"\n class=\"peer sr-only\"\n [checked]=\"checked()\"\n [disabled]=\"isDisabled()\"\n [attr.aria-describedby]=\"description() && id() ? id() + '-desc' : null\"\n [attr.aria-labelledby]=\"label() && id() ? id() + '-label' : null\"\n (change)=\"onCheckboxChange($event)\" />\n <div\n class=\"w-full h-full border-2 transition-all duration-150 flex items-center justify-center peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500/30 peer-focus-visible:ring-offset-1\"\n [class.rounded-sm]=\"size() === 'xs' || size() === 'sm'\"\n [class.rounded-md]=\"size() !== 'xs' && size() !== 'sm'\"\n [class.border-neutral-300]=\"!checked()\"\n [class.bg-white]=\"!checked()\"\n [class.border-primary-600]=\"checked()\"\n [class.bg-primary-600]=\"checked()\">\n @if (checked()) {\n <tailwind-icon icon=\"check\" [size]=\"checkIconSize()\" class=\"text-white shrink-0\" />\n }\n </div>\n </label>\n\n <div class=\"flex flex-col gap-0.5 pt-0.5\">\n @if (label()) {\n <span [attr.id]=\"id() ? id() + '-label' : null\" class=\"text-sm font-medium text-neutral-800 leading-tight\">{{\n label()\n }}</span>\n }\n @if (description()) {\n <span [attr.id]=\"id() ? id() + '-desc' : null\" class=\"text-xs text-neutral-500 leading-snug\">\n {{ description() }}\n </span>\n }\n </div>\n</div>\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1608
1608
|
}
|
|
1609
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1609
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindCheckbox, decorators: [{
|
|
1610
1610
|
type: Component,
|
|
1611
1611
|
args: [{ imports: [TailwindIcon], selector: 'tailwind-checkbox', providers: [
|
|
1612
1612
|
{
|
|
@@ -1676,8 +1676,8 @@ class TailwindRadioGroup extends TailwindComponent {
|
|
|
1676
1676
|
this.onChange(optionValue);
|
|
1677
1677
|
this.onTouched();
|
|
1678
1678
|
}
|
|
1679
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1680
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1679
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindRadioGroup, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1680
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindRadioGroup, isStandalone: true, selector: "tailwind-radio-group", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, providers: [
|
|
1681
1681
|
{
|
|
1682
1682
|
provide: NG_VALUE_ACCESSOR,
|
|
1683
1683
|
useExisting: forwardRef(() => TailwindRadioGroup),
|
|
@@ -1685,7 +1685,7 @@ class TailwindRadioGroup extends TailwindComponent {
|
|
|
1685
1685
|
}
|
|
1686
1686
|
], usesInheritance: true, ngImport: i0, template: "<fieldset\n class=\"flex gap-3\"\n [class.flex-col]=\"orientation() === 'vertical'\"\n [attr.aria-label]=\"ariaLabel()\"\n role=\"radiogroup\">\n @if (label()) {\n <legend class=\"text-sm font-medium text-neutral-700 mb-2\">{{ label() }}</legend>\n }\n\n @for (option of options(); track option.value) {\n <label\n class=\"inline-flex items-start gap-2.5 cursor-pointer select-none\"\n [class.cursor-not-allowed]=\"isDisabled() || option.disabled\"\n [class.opacity-50]=\"isDisabled() || option.disabled\">\n <div class=\"relative flex items-center justify-center shrink-0\" [class]=\"radioSizeClass()\">\n <input\n type=\"radio\"\n class=\"peer sr-only\"\n [name]=\"name()\"\n [value]=\"option.value\"\n [checked]=\"value() === option.value\"\n [disabled]=\"isDisabled() || !!option.disabled\"\n (change)=\"onRadioChange(option.value)\" />\n <div\n class=\"w-full h-full rounded-full border-2 transition-all duration-150 peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500/30 peer-focus-visible:ring-offset-1 flex items-center justify-center\"\n [class.border-neutral-300]=\"value() !== option.value\"\n [class.border-primary-600]=\"value() === option.value\">\n @if (value() === option.value) {\n <div\n class=\"rounded-full bg-primary-600 transition-transform duration-150 scale-100\"\n [class]=\"dotSizeClass()\"></div>\n }\n </div>\n </div>\n\n <div class=\"flex flex-col gap-0.5 pt-0.5\">\n <span class=\"text-sm font-medium text-neutral-800 leading-tight\">{{ option.label }}</span>\n @if (option.description) {\n <span class=\"text-xs text-neutral-500 leading-snug\">{{ option.description }}</span>\n }\n </div>\n </label>\n }\n</fieldset>\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1687
1687
|
}
|
|
1688
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1688
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindRadioGroup, decorators: [{
|
|
1689
1689
|
type: Component,
|
|
1690
1690
|
args: [{ selector: 'tailwind-radio-group', providers: [
|
|
1691
1691
|
{
|
|
@@ -1989,8 +1989,8 @@ class TailwindSelect extends TailwindComponent {
|
|
|
1989
1989
|
}
|
|
1990
1990
|
}
|
|
1991
1991
|
}
|
|
1992
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1993
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1992
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindSelect, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1993
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindSelect, isStandalone: true, selector: "tailwind-select", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, providers: [
|
|
1994
1994
|
{
|
|
1995
1995
|
provide: NG_VALUE_ACCESSOR,
|
|
1996
1996
|
useExisting: forwardRef(() => TailwindSelect),
|
|
@@ -1998,7 +1998,7 @@ class TailwindSelect extends TailwindComponent {
|
|
|
1998
1998
|
}
|
|
1999
1999
|
], viewQueries: [{ propertyName: "panelTemplate", first: true, predicate: ["panelTemplate"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col gap-1.5\">\n @if (label()) {\n <label\n [attr.for]=\"id() ? id() + '-inner' : null\"\n class=\"text-sm font-medium text-neutral-700\"\n [class.text-danger-600]=\"hasError()\">\n {{ label() }}\n </label>\n }\n\n <!-- Trigger button -->\n <button\n type=\"button\"\n [attr.id]=\"id() ? id() + '-inner' : null\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n [attr.aria-label]=\"comboboxAriaLabel()\"\n [attr.aria-expanded]=\"isOpen()\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"(helperText() || errorText()) && id() ? id() + '-helper' : null\"\n [disabled]=\"isDisabled()\"\n [class]=\"triggerClasses()\"\n (click)=\"toggleDropdown()\"\n (keydown)=\"onKeydown($event)\">\n @if (multiple()) {\n <span class=\"flex flex-wrap gap-1 flex-1 min-w-0 mr-2\" [class.text-neutral-400]=\"selectedOptions().length === 0\">\n @if (selectedOptions().length === 0) {\n {{ placeholder() }}\n } @else {\n @for (opt of selectedOptions(); track opt) {\n <span class=\"rounded-md bg-neutral-100 px-2 py-0.5 text-sm text-neutral-800\">{{ opt.label }}</span>\n }\n }\n </span>\n } @else {\n <span [class.text-neutral-400]=\"!selectedOption()\">\n {{ selectedOption()?.label ?? placeholder() }}\n </span>\n }\n\n <tailwind-icon\n icon=\"chevron-down\"\n [size]=\"16\"\n class=\"shrink-0 ml-2 text-neutral-600 transition-transform duration-150\"\n [class.rotate-180]=\"isOpen()\"\n aria-hidden=\"true\" />\n </button>\n\n @if (helperText() && !hasError()) {\n <p [attr.id]=\"id() ? id() + '-helper' : null\" class=\"text-xs text-neutral-500\">{{ helperText() }}</p>\n }\n @if (errorText() && hasError()) {\n <p [attr.id]=\"id() ? id() + '-helper' : null\" class=\"text-xs text-danger-600\">{{ errorText() }}</p>\n }\n</div>\n\n<!-- Dropdown panel \u2014 rendered via CDK Overlay outside the component DOM -->\n<ng-template #panelTemplate>\n <ul\n role=\"listbox\"\n [attr.aria-multiselectable]=\"multiple() ? true : null\"\n class=\"w-full bg-white border border-neutral-200 rounded-md shadow-lg py-1 max-h-60 overflow-auto\">\n @if (placeholder()) {\n <li role=\"option\" aria-disabled=\"true\" class=\"px-3 py-2 text-sm text-neutral-400 cursor-default select-none\">\n {{ placeholder() }}\n </li>\n }\n @for (option of options(); track option.value; let i = $index) {\n <li\n role=\"option\"\n [attr.aria-selected]=\"isOptionSelected(option)\"\n [attr.aria-disabled]=\"option.disabled || null\"\n [class]=\"optionClasses(i, option)\"\n (click)=\"selectOption(option)\"\n (mouseenter)=\"!option.disabled && activeIndex.set(i)\">\n <span>{{ option.label }}</span>\n\n @if (isOptionSelected(option)) {\n <tailwind-icon icon=\"check\" [size]=\"16\" class=\"text-primary-600 shrink-0\" aria-hidden=\"true\" />\n }\n </li>\n }\n </ul>\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2000
2000
|
}
|
|
2001
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2001
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindSelect, decorators: [{
|
|
2002
2002
|
type: Component,
|
|
2003
2003
|
args: [{ imports: [TailwindIcon], selector: 'tailwind-select', providers: [
|
|
2004
2004
|
{
|
|
@@ -2346,8 +2346,8 @@ class TailwindAutocomplete extends TailwindComponent {
|
|
|
2346
2346
|
this.isOpen.set(false);
|
|
2347
2347
|
this.activeIndex.set(-1);
|
|
2348
2348
|
}
|
|
2349
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2350
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2349
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindAutocomplete, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2350
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindAutocomplete, isStandalone: true, selector: "tailwind-autocomplete", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, filterLocally: { classPropertyName: "filterLocally", publicName: "filterLocally", isSignal: true, isRequired: false, transformFunction: null }, minSearchLength: { classPropertyName: "minSearchLength", publicName: "minSearchLength", isSignal: true, isRequired: false, transformFunction: null }, debounceMs: { classPropertyName: "debounceMs", publicName: "debounceMs", isSignal: true, isRequired: false, transformFunction: null }, forceSelection: { classPropertyName: "forceSelection", publicName: "forceSelection", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", onSearch: "onSearch" }, providers: [
|
|
2351
2351
|
{
|
|
2352
2352
|
provide: NG_VALUE_ACCESSOR,
|
|
2353
2353
|
useExisting: forwardRef(() => TailwindAutocomplete),
|
|
@@ -2355,7 +2355,7 @@ class TailwindAutocomplete extends TailwindComponent {
|
|
|
2355
2355
|
}
|
|
2356
2356
|
], queries: [{ propertyName: "itemTemplate", first: true, predicate: ["item"], descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "panelTemplate", first: true, predicate: ["panelTemplate"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col gap-1.5\">\r\n @if (label()) {\r\n <label\r\n [attr.for]=\"id() ? id() + '-inner' : null\"\r\n class=\"text-sm font-medium text-neutral-700\"\r\n [class.text-danger-600]=\"hasError()\">\r\n {{ label() }}\r\n </label>\r\n }\r\n\r\n <input\r\n type=\"text\"\r\n role=\"combobox\"\r\n aria-autocomplete=\"list\"\r\n [attr.id]=\"id() ? id() + '-inner' : null\"\r\n [attr.aria-expanded]=\"isOpen()\"\r\n [attr.aria-controls]=\"listboxId()\"\r\n [attr.aria-activedescendant]=\"\r\n isOpen() && activeIndex() >= 0 ? listboxId() + '-option-' + activeIndex() : null\r\n \"\r\n [attr.aria-invalid]=\"hasError() || null\"\r\n [attr.aria-describedby]=\"(helperText() || errorText()) && id() ? id() + '-helper' : null\"\r\n [placeholder]=\"placeholder()\"\r\n [disabled]=\"isDisabled()\"\r\n [value]=\"searchQuery()\"\r\n [class]=\"inputClasses()\"\r\n (input)=\"onInputChange($event)\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n (keydown)=\"onKeydown($event)\" />\r\n\r\n <ng-content />\r\n\r\n @if (helperText() && !hasError()) {\r\n <p [attr.id]=\"id() ? id() + '-helper' : null\" class=\"text-xs text-neutral-500\">{{ helperText() }}</p>\r\n }\r\n @if (errorText() && hasError()) {\r\n <p [attr.id]=\"id() ? id() + '-helper' : null\" class=\"text-xs text-danger-600\">{{ errorText() }}</p>\r\n }\r\n</div>\r\n\r\n<ng-template #panelTemplate>\r\n <ul\r\n role=\"listbox\"\r\n [attr.id]=\"listboxId()\"\r\n class=\"w-full bg-white border border-neutral-200 rounded-md shadow-lg py-1 max-h-60 overflow-auto\">\r\n @for (option of filteredOptions(); track option.value; let i = $index) {\r\n <li\r\n role=\"option\"\r\n [attr.id]=\"listboxId() + '-option-' + i\"\r\n [attr.aria-selected]=\"isOptionSelected(option)\"\r\n [attr.aria-disabled]=\"option.disabled || null\"\r\n [class]=\"optionClasses(i, option)\"\r\n (mousedown)=\"$event.preventDefault()\"\r\n (click)=\"selectOption(option)\"\r\n (mouseenter)=\"!option.disabled && activeIndex.set(i)\">\r\n @if (itemTemplate()) {\r\n <ng-container\r\n *ngTemplateOutlet=\"itemTemplate()!; context: itemContext(option, i)\" />\r\n } @else {\r\n <span>{{ option.label }}</span>\r\n @if (isOptionSelected(option)) {\r\n <tailwind-icon icon=\"check\" [size]=\"16\" class=\"text-primary-600 shrink-0\" aria-hidden=\"true\" />\r\n }\r\n }\r\n </li>\r\n } @empty {\r\n <li role=\"option\" aria-disabled=\"true\" class=\"px-3 py-2 text-sm text-neutral-400 cursor-default select-none\">\r\n {{ placeholder() || 'Nessun risultato' }}\r\n </li>\r\n }\r\n </ul>\r\n</ng-template>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2357
2357
|
}
|
|
2358
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2358
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindAutocomplete, decorators: [{
|
|
2359
2359
|
type: Component,
|
|
2360
2360
|
args: [{ imports: [NgTemplateOutlet, TailwindIcon], selector: 'tailwind-autocomplete', providers: [
|
|
2361
2361
|
{
|
|
@@ -2453,8 +2453,8 @@ class TailwindToggle extends TailwindComponent {
|
|
|
2453
2453
|
this.onChange(newValue);
|
|
2454
2454
|
this.onTouched();
|
|
2455
2455
|
}
|
|
2456
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2457
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2456
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindToggle, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2457
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindToggle, isStandalone: true, selector: "tailwind-toggle", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, providers: [
|
|
2458
2458
|
{
|
|
2459
2459
|
provide: NG_VALUE_ACCESSOR,
|
|
2460
2460
|
useExisting: forwardRef(() => TailwindToggle),
|
|
@@ -2462,7 +2462,7 @@ class TailwindToggle extends TailwindComponent {
|
|
|
2462
2462
|
}
|
|
2463
2463
|
], usesInheritance: true, ngImport: i0, template: "<div class=\"inline-flex items-center gap-3 select-none\" [class.opacity-50]=\"isDisabled()\">\n <button\n type=\"button\"\n role=\"switch\"\n [attr.aria-checked]=\"checked()\"\n [attr.aria-label]=\"switchAria().label\"\n [attr.aria-labelledby]=\"switchAria().labelledBy\"\n [disabled]=\"isDisabled()\"\n [class]=\"trackClasses()\"\n (click)=\"toggle()\">\n <span [class]=\"thumbClasses()\" aria-hidden=\"true\"></span>\n </button>\n\n @if (label()) {\n <span [attr.id]=\"id() ? id() + '-label' : null\" class=\"text-sm font-medium text-neutral-800\">{{ label() }}</span>\n }\n</div>\n", styles: [":host{display:inline-block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2464
2464
|
}
|
|
2465
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2465
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindToggle, decorators: [{
|
|
2466
2466
|
type: Component,
|
|
2467
2467
|
args: [{ selector: 'tailwind-toggle', providers: [
|
|
2468
2468
|
{
|
|
@@ -2504,10 +2504,10 @@ class TailwindBadge extends TailwindComponent {
|
|
|
2504
2504
|
const shape = this.rounded() ? 'rounded-full' : 'rounded-md';
|
|
2505
2505
|
return [...base, variantMap[this.variant()] ?? variantMap['primary'], sizeMap[this.size()], shape].join(' ');
|
|
2506
2506
|
}, ...(ngDevMode ? [{ debugName: "computedClasses" }] : /* istanbul ignore next */ []));
|
|
2507
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2508
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2507
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindBadge, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2508
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindBadge, isStandalone: true, selector: "tailwind-badge", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, dot: { classPropertyName: "dot", publicName: "dot", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<span [class]=\"computedClasses()\" [attr.aria-label]=\"ariaLabel()\">\n @if (dot()) {\n <span class=\"w-1.5 h-1.5 rounded-full bg-current\"></span>\n }\n <ng-content />\n</span>\n", styles: [":host{display:inline-block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2509
2509
|
}
|
|
2510
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2510
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindBadge, decorators: [{
|
|
2511
2511
|
type: Component,
|
|
2512
2512
|
args: [{ selector: 'tailwind-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span [class]=\"computedClasses()\" [attr.aria-label]=\"ariaLabel()\">\n @if (dot()) {\n <span class=\"w-1.5 h-1.5 rounded-full bg-current\"></span>\n }\n <ng-content />\n</span>\n", styles: [":host{display:inline-block}\n"] }]
|
|
2513
2513
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], dot: [{ type: i0.Input, args: [{ isSignal: true, alias: "dot", required: false }] }], rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
|
|
@@ -2546,10 +2546,10 @@ class TailwindTitle extends TailwindComponent {
|
|
|
2546
2546
|
};
|
|
2547
2547
|
return size[tag];
|
|
2548
2548
|
}, ...(ngDevMode ? [{ debugName: "iconSize" }] : /* istanbul ignore next */ []));
|
|
2549
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2550
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2549
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTitle, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2550
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindTitle, isStandalone: true, selector: "tailwind-title", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, titleTag: { classPropertyName: "titleTag", publicName: "titleTag", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "@switch (titleTag()) {\n @case ('h1') {\n <h1 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h1>\n }\n @case ('h2') {\n <h2 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h2>\n }\n @case ('h3') {\n <h3 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h3>\n }\n @case ('h4') {\n <h4 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h4>\n }\n @case ('h5') {\n <h5 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h5>\n }\n @case ('h6') {\n <h6 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h6>\n }\n}\n\n<ng-template #titleBody>\n @if (icon()) {\n <tailwind-icon [icon]=\"icon()!\" [size]=\"iconSize()\" />\n }\n <span class=\"min-w-0\">{{ text() }}</span>\n</ng-template>\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2551
2551
|
}
|
|
2552
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2552
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTitle, decorators: [{
|
|
2553
2553
|
type: Component,
|
|
2554
2554
|
args: [{ selector: 'tailwind-title', imports: [NgTemplateOutlet, TailwindIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: "@switch (titleTag()) {\n @case ('h1') {\n <h1 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h1>\n }\n @case ('h2') {\n <h2 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h2>\n }\n @case ('h3') {\n <h3 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h3>\n }\n @case ('h4') {\n <h4 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h4>\n }\n @case ('h5') {\n <h5 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h5>\n }\n @case ('h6') {\n <h6 [class]=\"headingClasses()\">\n <ng-container [ngTemplateOutlet]=\"titleBody\" />\n </h6>\n }\n}\n\n<ng-template #titleBody>\n @if (icon()) {\n <tailwind-icon [icon]=\"icon()!\" [size]=\"iconSize()\" />\n }\n <span class=\"min-w-0\">{{ text() }}</span>\n</ng-template>\n", styles: [":host{display:contents}\n"] }]
|
|
2555
2555
|
}], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: true }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], titleTag: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleTag", required: false }] }] } });
|
|
@@ -2565,10 +2565,10 @@ class TailwindCard extends TailwindComponent {
|
|
|
2565
2565
|
hasHeader = input(true, ...(ngDevMode ? [{ debugName: "hasHeader" }] : /* istanbul ignore next */ []));
|
|
2566
2566
|
/** Whether the card has a footer */
|
|
2567
2567
|
hasFooter = input(true, ...(ngDevMode ? [{ debugName: "hasFooter" }] : /* istanbul ignore next */ []));
|
|
2568
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2569
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2568
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindCard, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2569
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindCard, isStandalone: true, selector: "tailwind-card", inputs: { elevated: { classPropertyName: "elevated", publicName: "elevated", isSignal: true, isRequired: false, transformFunction: null }, hoverable: { classPropertyName: "hoverable", publicName: "hoverable", isSignal: true, isRequired: false, transformFunction: null }, headerBg: { classPropertyName: "headerBg", publicName: "headerBg", isSignal: true, isRequired: false, transformFunction: null }, hasHeader: { classPropertyName: "hasHeader", publicName: "hasHeader", isSignal: true, isRequired: false, transformFunction: null }, hasFooter: { classPropertyName: "hasFooter", publicName: "hasFooter", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<div\n class=\"bg-white rounded-xl border border-neutral-200 overflow-hidden transition-shadow duration-200\"\n [class.shadow-sm]=\"!elevated()\"\n [class.shadow-lg]=\"elevated()\"\n [class.hover:shadow-md]=\"hoverable() && !elevated()\"\n [class.hover:shadow-xl]=\"hoverable() && elevated()\">\n @if (hasHeader()) {\n <!-- Header slot (always rendered; only visible when content is projected) -->\n <div class=\"px-6 pt-4 pb-2 border-b border-neutral-100\" [class.bg-neutral-50]=\"headerBg()\">\n <ng-content select=\"[tailwind-card-header]\" />\n </div>\n }\n\n <!-- Image slot -->\n <ng-content select=\"[tailwind-card-image]\" />\n\n <!-- Body -->\n <div class=\"p-6\">\n <ng-content />\n </div>\n\n @if (hasFooter()) {\n <!-- Footer slot -->\n <div class=\"px-6 py-4 border-t border-neutral-100 bg-neutral-50/50\">\n <ng-content select=\"[tailwind-card-footer]\" />\n </div>\n }\n</div>\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2570
2570
|
}
|
|
2571
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2571
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindCard, decorators: [{
|
|
2572
2572
|
type: Component,
|
|
2573
2573
|
args: [{ selector: 'tailwind-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"bg-white rounded-xl border border-neutral-200 overflow-hidden transition-shadow duration-200\"\n [class.shadow-sm]=\"!elevated()\"\n [class.shadow-lg]=\"elevated()\"\n [class.hover:shadow-md]=\"hoverable() && !elevated()\"\n [class.hover:shadow-xl]=\"hoverable() && elevated()\">\n @if (hasHeader()) {\n <!-- Header slot (always rendered; only visible when content is projected) -->\n <div class=\"px-6 pt-4 pb-2 border-b border-neutral-100\" [class.bg-neutral-50]=\"headerBg()\">\n <ng-content select=\"[tailwind-card-header]\" />\n </div>\n }\n\n <!-- Image slot -->\n <ng-content select=\"[tailwind-card-image]\" />\n\n <!-- Body -->\n <div class=\"p-6\">\n <ng-content />\n </div>\n\n @if (hasFooter()) {\n <!-- Footer slot -->\n <div class=\"px-6 py-4 border-t border-neutral-100 bg-neutral-50/50\">\n <ng-content select=\"[tailwind-card-footer]\" />\n </div>\n }\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
2574
2574
|
}], propDecorators: { elevated: [{ type: i0.Input, args: [{ isSignal: true, alias: "elevated", required: false }] }], hoverable: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverable", required: false }] }], headerBg: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerBg", required: false }] }], hasHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasHeader", required: false }] }], hasFooter: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasFooter", required: false }] }] } });
|
|
@@ -2601,10 +2601,10 @@ class TailwindAlert extends TailwindComponent {
|
|
|
2601
2601
|
this.dismissed.set(true);
|
|
2602
2602
|
this.onDismiss.emit();
|
|
2603
2603
|
}
|
|
2604
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2605
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2604
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindAlert, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2605
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindAlert, isStandalone: true, selector: "tailwind-alert", inputs: { severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onDismiss: "onDismiss" }, usesInheritance: true, ngImport: i0, template: "@if (!dismissed()) {\n <div [class]=\"computedClasses()\" role=\"alert\" [attr.aria-live]=\"severity() === 'danger' ? 'assertive' : 'polite'\">\n <!-- Icon -->\n <div class=\"shrink-0 mt-0.5\">\n @switch (severity()) {\n @case ('success') {\n <tailwind-icon icon=\"check-circle\" [size]=\"20\" />\n }\n @case ('warning') {\n <tailwind-icon icon=\"exclamation-triangle\" [size]=\"20\" />\n }\n @case ('danger') {\n <tailwind-icon icon=\"x-circle\" [size]=\"20\" />\n }\n @case ('info') {\n <tailwind-icon icon=\"information-circle\" [size]=\"20\" />\n }\n }\n </div>\n\n <!-- Content -->\n <div class=\"flex-1 min-w-0\">\n @if (title()) {\n <h3 class=\"text-sm font-semibold mb-0.5\">{{ title() }}</h3>\n }\n <div class=\"text-sm\">\n <ng-content />\n </div>\n </div>\n\n <!-- Dismiss button -->\n @if (dismissible()) {\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"x-mark\"\n class=\"shrink-0 -m-1 opacity-70 hover:opacity-100\"\n ariaLabel=\"Dismiss alert\"\n (onClick)=\"dismiss()\" />\n }\n </div>\n}\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }, { kind: "component", type: TailwindButton, selector: "tailwind-button", inputs: ["color", "kind", "size", "disabled", "type", "role", "icon", "iconPosition", "ariaLabel"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2606
2606
|
}
|
|
2607
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2607
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindAlert, decorators: [{
|
|
2608
2608
|
type: Component,
|
|
2609
2609
|
args: [{ imports: [TailwindIcon, TailwindButton], selector: 'tailwind-alert', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!dismissed()) {\n <div [class]=\"computedClasses()\" role=\"alert\" [attr.aria-live]=\"severity() === 'danger' ? 'assertive' : 'polite'\">\n <!-- Icon -->\n <div class=\"shrink-0 mt-0.5\">\n @switch (severity()) {\n @case ('success') {\n <tailwind-icon icon=\"check-circle\" [size]=\"20\" />\n }\n @case ('warning') {\n <tailwind-icon icon=\"exclamation-triangle\" [size]=\"20\" />\n }\n @case ('danger') {\n <tailwind-icon icon=\"x-circle\" [size]=\"20\" />\n }\n @case ('info') {\n <tailwind-icon icon=\"information-circle\" [size]=\"20\" />\n }\n }\n </div>\n\n <!-- Content -->\n <div class=\"flex-1 min-w-0\">\n @if (title()) {\n <h3 class=\"text-sm font-semibold mb-0.5\">{{ title() }}</h3>\n }\n <div class=\"text-sm\">\n <ng-content />\n </div>\n </div>\n\n <!-- Dismiss button -->\n @if (dismissible()) {\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"x-mark\"\n class=\"shrink-0 -m-1 opacity-70 hover:opacity-100\"\n ariaLabel=\"Dismiss alert\"\n (onClick)=\"dismiss()\" />\n }\n </div>\n}\n", styles: [":host{display:block}\n"] }]
|
|
2610
2610
|
}], propDecorators: { severity: [{ type: i0.Input, args: [{ isSignal: true, alias: "severity", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], dismissible: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissible", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], onDismiss: [{ type: i0.Output, args: ["onDismiss"] }] } });
|
|
@@ -2657,10 +2657,10 @@ class TailwindSpinner extends TailwindComponent {
|
|
|
2657
2657
|
};
|
|
2658
2658
|
return `${sizeMap[this.size()]} ${this.color()} font-medium`;
|
|
2659
2659
|
}, ...(ngDevMode ? [{ debugName: "labelClasses" }] : /* istanbul ignore next */ []));
|
|
2660
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2661
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2660
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindSpinner, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2661
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindSpinner, isStandalone: true, selector: "tailwind-spinner", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<div [class]=\"containerClasses()\" role=\"status\" [attr.aria-label]=\"ariaLabel()\">\n <tailwind-icon icon=\"arrow-path\" [size]=\"iconPixelSize()\" [class]=\"iconClasses()\" />\n\n @if (label()) {\n <span [class]=\"labelClasses()\">{{ label() }}</span>\n }\n</div>\n", styles: [":host{display:inline-flex}\n"], dependencies: [{ kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2662
2662
|
}
|
|
2663
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2663
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindSpinner, decorators: [{
|
|
2664
2664
|
type: Component,
|
|
2665
2665
|
args: [{ imports: [TailwindIcon], selector: 'tailwind-spinner', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"containerClasses()\" role=\"status\" [attr.aria-label]=\"ariaLabel()\">\n <tailwind-icon icon=\"arrow-path\" [size]=\"iconPixelSize()\" [class]=\"iconClasses()\" />\n\n @if (label()) {\n <span [class]=\"labelClasses()\">{{ label() }}</span>\n }\n</div>\n", styles: [":host{display:inline-flex}\n"] }]
|
|
2666
2666
|
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }] } });
|
|
@@ -2716,10 +2716,10 @@ class TailwindModal extends TailwindComponent {
|
|
|
2716
2716
|
this.onClose.emit();
|
|
2717
2717
|
}, 200);
|
|
2718
2718
|
}
|
|
2719
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2720
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2719
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindModal, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2720
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindModal, isStandalone: true, selector: "tailwind-modal", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, showCloseButton: { classPropertyName: "showCloseButton", publicName: "showCloseButton", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClose: "onClose" }, viewQueries: [{ propertyName: "modalPanel", first: true, predicate: ["modalPanel"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (isOpen()) {\n <!-- Backdrop -->\n <div\n class=\"fixed inset-0 bg-black/50 backdrop-blur-sm z-1040 transition-opacity duration-200\"\n [class.opacity-100]=\"isVisible()\"\n [class.opacity-0]=\"!isVisible()\"\n (click)=\"closeOnBackdrop() && close()\"\n aria-hidden=\"true\"></div>\n\n <!-- Modal -->\n <div\n role=\"dialog\"\n class=\"fixed inset-0 z-1050 overflow-y-auto\"\n [attr.aria-modal]=\"true\"\n (keydown.escape)=\"closeOnEscape() && close()\">\n <div class=\"flex min-h-full items-center justify-center p-4\">\n <div #modalPanel [class]=\"panelClasses()\" tabindex=\"-1\">\n <!-- Header -->\n <div class=\"flex items-center justify-between px-6 py-4 border-b border-neutral-200\">\n <h2 class=\"text-lg font-semibold text-neutral-900 pr-2\">\n <ng-content />\n </h2>\n @if (showCloseButton()) {\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"x-mark\"\n class=\"shrink-0 -m-1.5\"\n ariaLabel=\"Close\"\n (onClick)=\"close()\" />\n }\n </div>\n\n <!-- Body -->\n <div class=\"px-6 py-5\">\n <ng-content select=\"[tailwind-modal-content]\" />\n </div>\n\n <!-- Footer -->\n <div class=\"border-t border-neutral-200 px-6 py-4\">\n <ng-content select=\"[tailwind-modal-footer]\" />\n </div>\n </div>\n </div>\n </div>\n}\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "component", type: TailwindButton, selector: "tailwind-button", inputs: ["color", "kind", "size", "disabled", "type", "role", "icon", "iconPosition", "ariaLabel"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2721
2721
|
}
|
|
2722
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2722
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindModal, decorators: [{
|
|
2723
2723
|
type: Component,
|
|
2724
2724
|
args: [{ imports: [TailwindButton], selector: 'tailwind-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isOpen()) {\n <!-- Backdrop -->\n <div\n class=\"fixed inset-0 bg-black/50 backdrop-blur-sm z-1040 transition-opacity duration-200\"\n [class.opacity-100]=\"isVisible()\"\n [class.opacity-0]=\"!isVisible()\"\n (click)=\"closeOnBackdrop() && close()\"\n aria-hidden=\"true\"></div>\n\n <!-- Modal -->\n <div\n role=\"dialog\"\n class=\"fixed inset-0 z-1050 overflow-y-auto\"\n [attr.aria-modal]=\"true\"\n (keydown.escape)=\"closeOnEscape() && close()\">\n <div class=\"flex min-h-full items-center justify-center p-4\">\n <div #modalPanel [class]=\"panelClasses()\" tabindex=\"-1\">\n <!-- Header -->\n <div class=\"flex items-center justify-between px-6 py-4 border-b border-neutral-200\">\n <h2 class=\"text-lg font-semibold text-neutral-900 pr-2\">\n <ng-content />\n </h2>\n @if (showCloseButton()) {\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"x-mark\"\n class=\"shrink-0 -m-1.5\"\n ariaLabel=\"Close\"\n (onClick)=\"close()\" />\n }\n </div>\n\n <!-- Body -->\n <div class=\"px-6 py-5\">\n <ng-content select=\"[tailwind-modal-content]\" />\n </div>\n\n <!-- Footer -->\n <div class=\"border-t border-neutral-200 px-6 py-4\">\n <ng-content select=\"[tailwind-modal-footer]\" />\n </div>\n </div>\n </div>\n </div>\n}\n", styles: [":host{display:contents}\n"] }]
|
|
2725
2725
|
}], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], showCloseButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCloseButton", required: false }] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], onClose: [{ type: i0.Output, args: ["onClose"] }], modalPanel: [{ type: i0.ViewChild, args: ['modalPanel', { isSignal: true }] }] } });
|
|
@@ -2733,10 +2733,10 @@ class TailwindTab extends TailwindComponent {
|
|
|
2733
2733
|
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
2734
2734
|
/** Whether this tab is the currently active one (set by parent) */
|
|
2735
2735
|
isActive = signal(false, ...(ngDevMode ? [{ debugName: "isActive" }] : /* istanbul ignore next */ []));
|
|
2736
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2737
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2736
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTab, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2737
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindTab, isStandalone: true, selector: "tailwind-tab", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "@if (isActive()) {\n <div role=\"tabpanel\" [attr.aria-labelledby]=\"id() ? 'tab-' + id() : null\">\n <ng-content />\n </div>\n}\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2738
2738
|
}
|
|
2739
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2739
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTab, decorators: [{
|
|
2740
2740
|
type: Component,
|
|
2741
2741
|
args: [{ selector: 'tailwind-tab', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isActive()) {\n <div role=\"tabpanel\" [attr.aria-labelledby]=\"id() ? 'tab-' + id() : null\">\n <ng-content />\n </div>\n}\n", styles: [":host{display:block}\n"] }]
|
|
2742
2742
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
|
|
@@ -2761,10 +2761,10 @@ class TailwindTabGroup extends TailwindComponent {
|
|
|
2761
2761
|
selectTab(index) {
|
|
2762
2762
|
this.activeIndex.set(index);
|
|
2763
2763
|
}
|
|
2764
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2765
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2764
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTabGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2765
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindTabGroup, isStandalone: true, selector: "tailwind-tab-group", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, activeIndex: { classPropertyName: "activeIndex", publicName: "activeIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeIndex: "activeIndexChange" }, queries: [{ propertyName: "tabs", predicate: TailwindTab, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!-- Tab Headers -->\n<div class=\"border-b border-neutral-200\">\n <nav\n class=\"flex -mb-px gap-1\"\n [class.overflow-x-auto]=\"scrollable()\"\n role=\"tablist\"\n [attr.aria-label]=\"ariaLabel() || null\">\n @for (tab of tabs(); track $index; let i = $index) {\n <button\n type=\"button\"\n role=\"tab\"\n [attr.id]=\"tab.id() ? 'tab-' + tab.id() : null\"\n [attr.aria-selected]=\"activeIndex() === i\"\n [attr.aria-controls]=\"tab.id() ? tab.id() : null\"\n [disabled]=\"tab.disabled()\"\n class=\"group relative px-4 py-2.5 text-sm font-medium whitespace-nowrap transition-colors duration-150 cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/30 focus-visible:rounded-t-lg\"\n [class.text-primary-600]=\"activeIndex() === i\"\n [class.text-neutral-500]=\"activeIndex() !== i\"\n [class.hover:text-neutral-700]=\"activeIndex() !== i && !tab.disabled()\"\n [class.opacity-50]=\"tab.disabled()\"\n [class.cursor-not-allowed]=\"tab.disabled()\"\n (click)=\"!tab.disabled() && selectTab(i)\">\n {{ tab.label() }}\n <!-- Active indicator -->\n <span\n class=\"absolute bottom-0 left-0 right-0 h-0.5 rounded-full transition-all duration-200\"\n [class.bg-primary-600]=\"activeIndex() === i\"\n [class.scale-x-100]=\"activeIndex() === i\"\n [class.scale-x-0]=\"activeIndex() !== i\"></span>\n </button>\n }\n </nav>\n</div>\n\n<!-- Tab Content -->\n<div class=\"pt-4\">\n <ng-content />\n</div>\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2766
2766
|
}
|
|
2767
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2767
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTabGroup, decorators: [{
|
|
2768
2768
|
type: Component,
|
|
2769
2769
|
args: [{ selector: 'tailwind-tab-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Tab Headers -->\n<div class=\"border-b border-neutral-200\">\n <nav\n class=\"flex -mb-px gap-1\"\n [class.overflow-x-auto]=\"scrollable()\"\n role=\"tablist\"\n [attr.aria-label]=\"ariaLabel() || null\">\n @for (tab of tabs(); track $index; let i = $index) {\n <button\n type=\"button\"\n role=\"tab\"\n [attr.id]=\"tab.id() ? 'tab-' + tab.id() : null\"\n [attr.aria-selected]=\"activeIndex() === i\"\n [attr.aria-controls]=\"tab.id() ? tab.id() : null\"\n [disabled]=\"tab.disabled()\"\n class=\"group relative px-4 py-2.5 text-sm font-medium whitespace-nowrap transition-colors duration-150 cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/30 focus-visible:rounded-t-lg\"\n [class.text-primary-600]=\"activeIndex() === i\"\n [class.text-neutral-500]=\"activeIndex() !== i\"\n [class.hover:text-neutral-700]=\"activeIndex() !== i && !tab.disabled()\"\n [class.opacity-50]=\"tab.disabled()\"\n [class.cursor-not-allowed]=\"tab.disabled()\"\n (click)=\"!tab.disabled() && selectTab(i)\">\n {{ tab.label() }}\n <!-- Active indicator -->\n <span\n class=\"absolute bottom-0 left-0 right-0 h-0.5 rounded-full transition-all duration-200\"\n [class.bg-primary-600]=\"activeIndex() === i\"\n [class.scale-x-100]=\"activeIndex() === i\"\n [class.scale-x-0]=\"activeIndex() !== i\"></span>\n </button>\n }\n </nav>\n</div>\n\n<!-- Tab Content -->\n<div class=\"pt-4\">\n <ng-content />\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
2770
2770
|
}], ctorParameters: () => [], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], scrollable: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollable", required: false }] }], activeIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeIndex", required: false }] }, { type: i0.Output, args: ["activeIndexChange"] }], tabs: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => TailwindTab), { isSignal: true }] }] } });
|
|
@@ -2817,10 +2817,10 @@ class TailwindProgressBar extends TailwindComponent {
|
|
|
2817
2817
|
}
|
|
2818
2818
|
return base.join(' ');
|
|
2819
2819
|
}, ...(ngDevMode ? [{ debugName: "barClasses" }] : /* istanbul ignore next */ []));
|
|
2820
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2821
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
2820
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindProgressBar, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2821
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindProgressBar, isStandalone: true, selector: "tailwind-progress-bar", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, showValue: { classPropertyName: "showValue", publicName: "showValue", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<div class=\"w-full\">\n @if (showLabel()) {\n <div class=\"flex justify-between items-center mb-1.5\">\n @if (label()) {\n <span class=\"text-sm font-medium text-neutral-700\">{{ label() }}</span>\n }\n @if (showValue()) {\n <span class=\"text-sm font-medium text-neutral-600\">{{ clampedValue() }}%</span>\n }\n </div>\n }\n\n <div\n [class]=\"trackClasses()\"\n role=\"progressbar\"\n [attr.aria-valuenow]=\"clampedValue()\"\n [attr.aria-valuemin]=\"0\"\n [attr.aria-valuemax]=\"100\"\n [attr.aria-label]=\"label() || 'Progress'\">\n <div [class]=\"barClasses()\" [style.width.%]=\"indeterminate() ? 100 : clampedValue()\"></div>\n </div>\n</div>\n", styles: [":host{display:block}@keyframes tailwind-indeterminate{0%{transform:translate(-100%)}to{transform:translate(200%)}}.tailwind-progress-indeterminate{animation:tailwind-indeterminate 1.5s ease-in-out infinite;width:40%!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2822
2822
|
}
|
|
2823
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2823
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindProgressBar, decorators: [{
|
|
2824
2824
|
type: Component,
|
|
2825
2825
|
args: [{ selector: 'tailwind-progress-bar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"w-full\">\n @if (showLabel()) {\n <div class=\"flex justify-between items-center mb-1.5\">\n @if (label()) {\n <span class=\"text-sm font-medium text-neutral-700\">{{ label() }}</span>\n }\n @if (showValue()) {\n <span class=\"text-sm font-medium text-neutral-600\">{{ clampedValue() }}%</span>\n }\n </div>\n }\n\n <div\n [class]=\"trackClasses()\"\n role=\"progressbar\"\n [attr.aria-valuenow]=\"clampedValue()\"\n [attr.aria-valuemin]=\"0\"\n [attr.aria-valuemax]=\"100\"\n [attr.aria-label]=\"label() || 'Progress'\">\n <div [class]=\"barClasses()\" [style.width.%]=\"indeterminate() ? 100 : clampedValue()\"></div>\n </div>\n</div>\n", styles: [":host{display:block}@keyframes tailwind-indeterminate{0%{transform:translate(-100%)}to{transform:translate(200%)}}.tailwind-progress-indeterminate{animation:tailwind-indeterminate 1.5s ease-in-out infinite;width:40%!important}\n"] }]
|
|
2826
2826
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], showValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "showValue", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }], striped: [{ type: i0.Input, args: [{ isSignal: true, alias: "striped", required: false }] }] } });
|
|
@@ -3005,10 +3005,10 @@ class TailwindMenu extends TailwindComponent {
|
|
|
3005
3005
|
}
|
|
3006
3006
|
return document.documentElement;
|
|
3007
3007
|
}
|
|
3008
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3009
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3008
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindMenu, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3009
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindMenu, isStandalone: true, selector: "tailwind-menu", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSelect: "onSelect" }, host: { listeners: { "document:keydown.escape": "onDocumentEscape()", "document:click": "onDocumentClick($event)", "window:resize": "onWindowResize()" } }, viewQueries: [{ propertyName: "panelRef", first: true, predicate: ["panel"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (isOpen() && panelLayout(); as layout) {\n <div\n #panel\n role=\"menu\"\n class=\"fixed z-1000 bg-white rounded-xl border border-neutral-200 shadow-lg py-1 animate-in fade-in slide-in-from-top-1\"\n [style.top.px]=\"layout.top\"\n [style.left.px]=\"layout.left ?? null\"\n [style.right.px]=\"layout.right ?? null\"\n [style.minWidth.px]=\"layout.minWidth\">\n @for (item of items(); track $index) {\n @if (item.divider) {\n <hr class=\"my-1 border-neutral-100\" />\n } @else {\n <button\n type=\"button\"\n role=\"menuitem\"\n [disabled]=\"!!item.disabled\"\n class=\"w-full text-left px-4 py-2 text-sm text-neutral-700 hover:bg-neutral-50 hover:text-neutral-900 disabled:opacity-50 disabled:cursor-not-allowed transition-colors cursor-pointer\"\n (click)=\"selectItem(item)\">\n {{ item.label }}\n </button>\n }\n }\n </div>\n}\n", styles: [":host{display:contents}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3010
3010
|
}
|
|
3011
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3011
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindMenu, decorators: [{
|
|
3012
3012
|
type: Component,
|
|
3013
3013
|
args: [{ selector: 'tailwind-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isOpen() && panelLayout(); as layout) {\n <div\n #panel\n role=\"menu\"\n class=\"fixed z-1000 bg-white rounded-xl border border-neutral-200 shadow-lg py-1 animate-in fade-in slide-in-from-top-1\"\n [style.top.px]=\"layout.top\"\n [style.left.px]=\"layout.left ?? null\"\n [style.right.px]=\"layout.right ?? null\"\n [style.minWidth.px]=\"layout.minWidth\">\n @for (item of items(); track $index) {\n @if (item.divider) {\n <hr class=\"my-1 border-neutral-100\" />\n } @else {\n <button\n type=\"button\"\n role=\"menuitem\"\n [disabled]=\"!!item.disabled\"\n class=\"w-full text-left px-4 py-2 text-sm text-neutral-700 hover:bg-neutral-50 hover:text-neutral-900 disabled:opacity-50 disabled:cursor-not-allowed transition-colors cursor-pointer\"\n (click)=\"selectItem(item)\">\n {{ item.label }}\n </button>\n }\n }\n </div>\n}\n", styles: [":host{display:contents}\n"] }]
|
|
3014
3014
|
}], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], onSelect: [{ type: i0.Output, args: ["onSelect"] }], panelRef: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }], onDocumentEscape: [{
|
|
@@ -3068,10 +3068,10 @@ class TailwindDrawer extends TailwindComponent {
|
|
|
3068
3068
|
this.onClose.emit();
|
|
3069
3069
|
}, 300);
|
|
3070
3070
|
}
|
|
3071
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3072
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3071
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindDrawer, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3072
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindDrawer, isStandalone: true, selector: "tailwind-drawer", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClose: "onClose" }, usesInheritance: true, ngImport: i0, template: "@if (isOpen()) {\n <!-- Backdrop -->\n <div\n class=\"fixed inset-0 bg-black/40 backdrop-blur-sm z-1040 transition-opacity duration-300\"\n [class.opacity-100]=\"isVisible()\"\n [class.opacity-0]=\"!isVisible()\"\n (click)=\"closeOnBackdrop() && close()\"\n aria-hidden=\"true\"></div>\n\n <!-- Drawer Panel -->\n <div [class]=\"panelClasses()\" role=\"dialog\" [attr.aria-modal]=\"true\" [attr.aria-label]=\"title()\">\n <!-- Header -->\n <div class=\"flex items-center justify-between px-6 py-4 border-b border-neutral-200\">\n @if (title()) {\n <h2 class=\"text-lg font-semibold text-neutral-900\">{{ title() }}</h2>\n }\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"x-mark\"\n class=\"ml-auto shrink-0 -m-1.5\"\n ariaLabel=\"Close\"\n (onClick)=\"close()\" />\n </div>\n\n <!-- Body -->\n <div class=\"flex-1 overflow-y-auto px-6 py-5\">\n <ng-content />\n </div>\n\n <!-- Footer -->\n <ng-content select=\"[tailwind-drawer-footer]\" />\n </div>\n}\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "component", type: TailwindButton, selector: "tailwind-button", inputs: ["color", "kind", "size", "disabled", "type", "role", "icon", "iconPosition", "ariaLabel"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3073
3073
|
}
|
|
3074
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3074
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindDrawer, decorators: [{
|
|
3075
3075
|
type: Component,
|
|
3076
3076
|
args: [{ imports: [TailwindButton], selector: 'tailwind-drawer', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isOpen()) {\n <!-- Backdrop -->\n <div\n class=\"fixed inset-0 bg-black/40 backdrop-blur-sm z-1040 transition-opacity duration-300\"\n [class.opacity-100]=\"isVisible()\"\n [class.opacity-0]=\"!isVisible()\"\n (click)=\"closeOnBackdrop() && close()\"\n aria-hidden=\"true\"></div>\n\n <!-- Drawer Panel -->\n <div [class]=\"panelClasses()\" role=\"dialog\" [attr.aria-modal]=\"true\" [attr.aria-label]=\"title()\">\n <!-- Header -->\n <div class=\"flex items-center justify-between px-6 py-4 border-b border-neutral-200\">\n @if (title()) {\n <h2 class=\"text-lg font-semibold text-neutral-900\">{{ title() }}</h2>\n }\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"x-mark\"\n class=\"ml-auto shrink-0 -m-1.5\"\n ariaLabel=\"Close\"\n (onClick)=\"close()\" />\n </div>\n\n <!-- Body -->\n <div class=\"flex-1 overflow-y-auto px-6 py-5\">\n <ng-content />\n </div>\n\n <!-- Footer -->\n <ng-content select=\"[tailwind-drawer-footer]\" />\n </div>\n}\n", styles: [":host{display:contents}\n"] }]
|
|
3077
3077
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], onClose: [{ type: i0.Output, args: ["onClose"] }] } });
|
|
@@ -3080,10 +3080,10 @@ class TailwindBreadcrumb extends TailwindComponent {
|
|
|
3080
3080
|
items = input([], ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
3081
3081
|
separator = input('>', ...(ngDevMode ? [{ debugName: "separator" }] : /* istanbul ignore next */ []));
|
|
3082
3082
|
ariaLabel = input('Breadcrumb', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
3083
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3084
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3083
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindBreadcrumb, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3084
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindBreadcrumb, isStandalone: true, selector: "tailwind-breadcrumb", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<nav [attr.aria-label]=\"ariaLabel()\" class=\"flex\">\n <ol class=\"inline-flex items-center text-sm\">\n @for (item of items(); track item.label; let last = $last; let first = $first) {\n <li class=\"inline-flex items-center\">\n @if (!first) {\n <span class=\"mx-2 text-neutral-400\" aria-hidden=\"true\">\n {{ separator() }}\n </span>\n }\n @if (item.link && !last) {\n <a\n [routerLink]=\"item.link\"\n class=\"inline-flex items-center gap-1 text-neutral-500 hover:text-primary-600 transition-colors font-medium\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"16\" />\n }\n {{ item.label }}\n </a>\n } @else {\n <span\n class=\"inline-flex items-center gap-1 font-medium\"\n [class.text-neutral-900]=\"last\"\n [class.text-neutral-500]=\"!last\"\n [attr.aria-current]=\"last ? 'page' : null\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"16\" />\n }\n {{ item.label }}\n </span>\n }\n </li>\n }\n </ol>\n</nav>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3085
3085
|
}
|
|
3086
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3086
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindBreadcrumb, decorators: [{
|
|
3087
3087
|
type: Component,
|
|
3088
3088
|
args: [{ imports: [RouterLink, TailwindIcon], selector: 'tailwind-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav [attr.aria-label]=\"ariaLabel()\" class=\"flex\">\n <ol class=\"inline-flex items-center text-sm\">\n @for (item of items(); track item.label; let last = $last; let first = $first) {\n <li class=\"inline-flex items-center\">\n @if (!first) {\n <span class=\"mx-2 text-neutral-400\" aria-hidden=\"true\">\n {{ separator() }}\n </span>\n }\n @if (item.link && !last) {\n <a\n [routerLink]=\"item.link\"\n class=\"inline-flex items-center gap-1 text-neutral-500 hover:text-primary-600 transition-colors font-medium\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"16\" />\n }\n {{ item.label }}\n </a>\n } @else {\n <span\n class=\"inline-flex items-center gap-1 font-medium\"\n [class.text-neutral-900]=\"last\"\n [class.text-neutral-500]=\"!last\"\n [attr.aria-current]=\"last ? 'page' : null\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"16\" />\n }\n {{ item.label }}\n </span>\n }\n </li>\n }\n </ol>\n</nav>\n", styles: [":host{display:block}\n"] }]
|
|
3089
3089
|
}], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
|
|
@@ -3150,10 +3150,10 @@ class TailwindPagination extends TailwindComponent {
|
|
|
3150
3150
|
this.onPageChange.emit(1);
|
|
3151
3151
|
}
|
|
3152
3152
|
}
|
|
3153
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3154
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3153
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindPagination, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3154
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindPagination, isStandalone: true, selector: "tailwind-pagination", inputs: { totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, lengthOptions: { classPropertyName: "lengthOptions", publicName: "lengthOptions", isSignal: true, isRequired: false, transformFunction: null }, currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, summary: { classPropertyName: "summary", publicName: "summary", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageSize: "pageSizeChange", currentPage: "currentPageChange", onPageChange: "onPageChange", onPageSizeChange: "onPageSizeChange" }, usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-wrap items-center justify-between gap-4 w-full\">\n <div class=\"flex flex-wrap items-center gap-3 min-w-0\">\n @if (summary()) {\n <span class=\"text-sm text-neutral-700 dark:text-neutral-300\">\n {{ summaryText() }}\n </span>\n }\n\n @if (lengthOptions().length > 0) {\n <div class=\"w-20 shrink-0\">\n <tailwind-select\n size=\"sm\"\n ariaLabel=\"Rows per page\"\n [options]=\"pageSizeSelectOptions()\"\n [value]=\"pageSize()\"\n (valueChange)=\"onPageSizeValueChange($event)\" />\n </div>\n }\n </div>\n\n <nav [attr.aria-label]=\"ariaLabel()\" class=\"flex items-center gap-1\">\n <!-- Previous -->\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-left\"\n [disabled]=\"currentPage() <= 1\"\n ariaLabel=\"Previous page\"\n (onClick)=\"goToPage(currentPage() - 1)\" />\n\n @for (page of visiblePages(); track page) {\n <tailwind-button\n size=\"sm\"\n [kind]=\"page === currentPage() ? 'flat' : 'ghost'\"\n [color]=\"page === currentPage() ? 'primary' : 'secondary'\"\n class=\"min-w-8\"\n [ariaLabel]=\"pageButtonAriaLabel(page)\"\n (onClick)=\"goToPage(page)\">\n {{ page }}\n </tailwind-button>\n }\n\n <!-- Next -->\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-right\"\n [disabled]=\"currentPage() >= totalPages()\"\n ariaLabel=\"Next page\"\n (onClick)=\"goToPage(currentPage() + 1)\" />\n </nav>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: TailwindSelect, selector: "tailwind-select", inputs: ["label", "ariaLabel", "placeholder", "options", "size", "helperText", "errorText", "hasError", "multiple", "value"], outputs: ["valueChange"] }, { kind: "component", type: TailwindButton, selector: "tailwind-button", inputs: ["color", "kind", "size", "disabled", "type", "role", "icon", "iconPosition", "ariaLabel"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3155
3155
|
}
|
|
3156
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3156
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindPagination, decorators: [{
|
|
3157
3157
|
type: Component,
|
|
3158
3158
|
args: [{ selector: 'tailwind-pagination', imports: [TailwindSelect, TailwindButton], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-wrap items-center justify-between gap-4 w-full\">\n <div class=\"flex flex-wrap items-center gap-3 min-w-0\">\n @if (summary()) {\n <span class=\"text-sm text-neutral-700 dark:text-neutral-300\">\n {{ summaryText() }}\n </span>\n }\n\n @if (lengthOptions().length > 0) {\n <div class=\"w-20 shrink-0\">\n <tailwind-select\n size=\"sm\"\n ariaLabel=\"Rows per page\"\n [options]=\"pageSizeSelectOptions()\"\n [value]=\"pageSize()\"\n (valueChange)=\"onPageSizeValueChange($event)\" />\n </div>\n }\n </div>\n\n <nav [attr.aria-label]=\"ariaLabel()\" class=\"flex items-center gap-1\">\n <!-- Previous -->\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-left\"\n [disabled]=\"currentPage() <= 1\"\n ariaLabel=\"Previous page\"\n (onClick)=\"goToPage(currentPage() - 1)\" />\n\n @for (page of visiblePages(); track page) {\n <tailwind-button\n size=\"sm\"\n [kind]=\"page === currentPage() ? 'flat' : 'ghost'\"\n [color]=\"page === currentPage() ? 'primary' : 'secondary'\"\n class=\"min-w-8\"\n [ariaLabel]=\"pageButtonAriaLabel(page)\"\n (onClick)=\"goToPage(page)\">\n {{ page }}\n </tailwind-button>\n }\n\n <!-- Next -->\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-right\"\n [disabled]=\"currentPage() >= totalPages()\"\n ariaLabel=\"Next page\"\n (onClick)=\"goToPage(currentPage() + 1)\" />\n </nav>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
3159
3159
|
}], propDecorators: { totalItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalItems", required: true }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], lengthOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "lengthOptions", required: false }] }], currentPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPage", required: false }] }, { type: i0.Output, args: ["currentPageChange"] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], summary: [{ type: i0.Input, args: [{ isSignal: true, alias: "summary", required: false }] }], onPageChange: [{ type: i0.Output, args: ["onPageChange"] }], onPageSizeChange: [{ type: i0.Output, args: ["onPageSizeChange"] }] } });
|
|
@@ -3171,10 +3171,10 @@ class TailwindTag extends TailwindComponent {
|
|
|
3171
3171
|
};
|
|
3172
3172
|
return `inline-flex items-center text-[11px] font-semibold uppercase tracking-wider px-2 py-0.5 rounded ${variantMap[this.variant()]}`;
|
|
3173
3173
|
}, ...(ngDevMode ? [{ debugName: "computedClasses" }] : /* istanbul ignore next */ []));
|
|
3174
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3175
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
3174
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTag, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3175
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.14", type: TailwindTag, isStandalone: true, selector: "tailwind-tag", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<span [class]=\"computedClasses()\"><ng-content /></span>\n", styles: [":host{display:inline-block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3176
3176
|
}
|
|
3177
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3177
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTag, decorators: [{
|
|
3178
3178
|
type: Component,
|
|
3179
3179
|
args: [{ selector: 'tailwind-tag', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span [class]=\"computedClasses()\"><ng-content /></span>\n", styles: [":host{display:inline-block}\n"] }]
|
|
3180
3180
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }] } });
|
|
@@ -3299,10 +3299,10 @@ class TailwindTable extends TailwindComponent {
|
|
|
3299
3299
|
if (key)
|
|
3300
3300
|
this.sort(key);
|
|
3301
3301
|
}
|
|
3302
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3303
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3302
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3303
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindTable, isStandalone: true, selector: "tailwind-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, emptyColspan: { classPropertyName: "emptyColspan", publicName: "emptyColspan", isSignal: true, isRequired: false, transformFunction: null }, paginated: { classPropertyName: "paginated", publicName: "paginated", isSignal: true, isRequired: false, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSortChange: "onSortChange", onSelectionChange: "onSelectionChange" }, host: { listeners: { "click": "onSortZoneClick($event)", "keydown": "onSortZoneKeydown($event)" }, properties: { "attr.data-tw-sort-key": "sortKey()", "attr.data-tw-sort-dir": "sortDir()" } }, queries: [{ propertyName: "rowTemplate", first: true, predicate: TailwindTableRowDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"w-full overflow-x-auto rounded-lg border border-neutral-200\">\n @if (loading()) {\n <div class=\"flex items-center justify-center py-16 text-neutral-400\">\n <tailwind-icon icon=\"arrow-path\" [size]=\"24\" class=\"animate-spin mr-2 text-neutral-400\" />\n Loading...\n </div>\n } @else {\n <!-- `table-fixed`: consente `w-*` / `min-w-*` / `max-w-*` sulle celle e sugli `th` proiettati. -->\n <table class=\"w-full min-w-0 table-fixed text-sm text-left divide-y divide-neutral-100\">\n <ng-content select=\"thead\" />\n @for (row of displayedData(); track $index; let i = $index) {\n <ng-container *ngTemplateOutlet=\"rowTemplate().templateRef; context: rowContext(row, i)\" />\n } @empty {\n <tbody>\n <tr>\n <td [attr.colspan]=\"emptyColspan()\">\n {{ emptyMessage() }}\n </td>\n </tr>\n </tbody>\n }\n </table>\n\n @if (paginated() && data().length > 0) {\n <div class=\"px-4 py-3 border-t border-neutral-200 bg-white\">\n <tailwind-pagination\n [totalItems]=\"pagination()?.totalItems ?? data().length\"\n [pageSize]=\"pageSize()\"\n (pageSizeChange)=\"pageSize.set($event)\"\n [lengthOptions]=\"paginationLengthOptions()\"\n [currentPage]=\"currentPage()\"\n (onPageChange)=\"currentPage.set($event)\"\n [ariaLabel]=\"pagination()?.ariaLabel ?? 'Pagination'\"\n [summary]=\"paginationSummary()\">\n </tailwind-pagination>\n </div>\n }\n }\n</div>\n", styles: ["@layer components{:host{display:block}:host ::ng-deep :where(thead){background-color:var(--color-neutral-50);border-bottom:1px solid var(--color-neutral-200)}:host ::ng-deep :where(thead th){padding:.75rem 1rem;font-weight:600;color:var(--color-neutral-700);text-align:left;white-space:nowrap;vertical-align:middle}:host ::ng-deep :where(tbody td){padding:.75rem 1rem;color:var(--color-neutral-700)}:host ::ng-deep :where(tbody td[colspan]){padding:2rem 1rem;text-align:center;color:var(--color-neutral-400)}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: TailwindPagination, selector: "tailwind-pagination", inputs: ["totalItems", "pageSize", "lengthOptions", "currentPage", "ariaLabel", "summary"], outputs: ["pageSizeChange", "currentPageChange", "onPageChange", "onPageSizeChange"] }, { kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3304
3304
|
}
|
|
3305
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3305
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTable, decorators: [{
|
|
3306
3306
|
type: Component,
|
|
3307
3307
|
args: [{ selector: 'tailwind-table', imports: [NgTemplateOutlet, TailwindPagination, TailwindIcon], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
3308
3308
|
'[attr.data-tw-sort-key]': 'sortKey()',
|
|
@@ -3486,10 +3486,10 @@ class TailwindDatePicker extends TailwindComponent {
|
|
|
3486
3486
|
event.stopPropagation();
|
|
3487
3487
|
this.showCalendar.set(false);
|
|
3488
3488
|
}
|
|
3489
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3490
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3489
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindDatePicker, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3490
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindDatePicker, isStandalone: true, selector: "tailwind-date-picker", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { listeners: { "document:pointerdown": "onDocumentPointerDown($event)", "document:keydown": "onDocumentKeydown($event)" } }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TailwindDatePicker), multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col gap-1.5\">\n @if (label()) {\n <label [attr.for]=\"id() ? id() + '-inner' : null\" class=\"text-sm font-medium text-neutral-700\">{{ label() }}</label>\n }\n <div class=\"relative\">\n <input\n [attr.id]=\"id() ? id() + '-inner' : null\"\n type=\"text\"\n readonly\n [value]=\"displayValue()\"\n [placeholder]=\"effectivePlaceholder()\"\n class=\"block w-full bg-white border border-neutral-300 rounded-md px-3 py-2 text-sm text-neutral-900 placeholder:text-neutral-400 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 cursor-pointer disabled:bg-neutral-50 disabled:cursor-not-allowed pr-10\"\n [disabled]=\"isDisabled()\"\n (click)=\"toggleCalendar()\" />\n <tailwind-icon\n icon=\"calendar-days\"\n [size]=\"16\"\n class=\"absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 pointer-events-none\" />\n </div>\n\n @if (showCalendar()) {\n <div class=\"absolute z-popover mt-1 bg-white rounded-xl border border-neutral-200 shadow-xl p-4 w-72\">\n <!-- Month/Year nav -->\n <div class=\"flex items-center justify-between mb-3\">\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-left\"\n ariaLabel=\"Previous month\"\n (onClick)=\"prevMonth()\" />\n <span class=\"text-sm font-semibold text-neutral-800\">{{ monthYearLabel() }}</span>\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-right\"\n ariaLabel=\"Next month\"\n (onClick)=\"nextMonth()\" />\n </div>\n <!-- Weekdays -->\n <div class=\"grid grid-cols-7 gap-0 mb-1\">\n @for (day of weekDays; track $index) {\n <div class=\"text-center text-xs font-medium text-neutral-400 py-1\">{{ day }}</div>\n }\n </div>\n <!-- Days -->\n <div class=\"grid grid-cols-7 gap-0\">\n @for (day of calendarDays(); track $index) {\n @if (day === 0) {\n <div></div>\n } @else {\n <button\n type=\"button\"\n (click)=\"selectDay(day)\"\n class=\"h-8 w-8 mx-auto rounded-lg text-sm transition-colors cursor-pointer hover:bg-neutral-100\"\n [class.bg-primary-600]=\"isSelected(day)\"\n [class.text-white]=\"isSelected(day)\"\n [class.hover:bg-primary-700]=\"isSelected(day)\"\n [class.text-neutral-700]=\"!isSelected(day) && !isToday(day)\"\n [class.font-semibold]=\"isToday(day)\"\n [class.text-primary-600]=\"isToday(day) && !isSelected(day)\">\n {{ day }}\n </button>\n }\n }\n </div>\n <div class=\"mt-2 pt-2 border-t border-neutral-100 flex items-center justify-between gap-2\">\n <tailwind-button\n kind=\"text\"\n color=\"primary\"\n size=\"xs\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"goToToday()\">\n {{ i18n.today }}\n </tailwind-button>\n <tailwind-button\n kind=\"solid\"\n color=\"primary\"\n size=\"sm\"\n [disabled]=\"isDisabled() || !draft()\"\n (onClick)=\"apply()\">\n {{ i18n.confirm }}\n </tailwind-button>\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:block;position:relative}\n"], dependencies: [{ kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }, { kind: "component", type: TailwindButton, selector: "tailwind-button", inputs: ["color", "kind", "size", "disabled", "type", "role", "icon", "iconPosition", "ariaLabel"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3491
3491
|
}
|
|
3492
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3492
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindDatePicker, decorators: [{
|
|
3493
3493
|
type: Component,
|
|
3494
3494
|
args: [{ imports: [TailwindIcon, TailwindButton], selector: 'tailwind-date-picker', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TailwindDatePicker), multi: true }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col gap-1.5\">\n @if (label()) {\n <label [attr.for]=\"id() ? id() + '-inner' : null\" class=\"text-sm font-medium text-neutral-700\">{{ label() }}</label>\n }\n <div class=\"relative\">\n <input\n [attr.id]=\"id() ? id() + '-inner' : null\"\n type=\"text\"\n readonly\n [value]=\"displayValue()\"\n [placeholder]=\"effectivePlaceholder()\"\n class=\"block w-full bg-white border border-neutral-300 rounded-md px-3 py-2 text-sm text-neutral-900 placeholder:text-neutral-400 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 cursor-pointer disabled:bg-neutral-50 disabled:cursor-not-allowed pr-10\"\n [disabled]=\"isDisabled()\"\n (click)=\"toggleCalendar()\" />\n <tailwind-icon\n icon=\"calendar-days\"\n [size]=\"16\"\n class=\"absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 pointer-events-none\" />\n </div>\n\n @if (showCalendar()) {\n <div class=\"absolute z-popover mt-1 bg-white rounded-xl border border-neutral-200 shadow-xl p-4 w-72\">\n <!-- Month/Year nav -->\n <div class=\"flex items-center justify-between mb-3\">\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-left\"\n ariaLabel=\"Previous month\"\n (onClick)=\"prevMonth()\" />\n <span class=\"text-sm font-semibold text-neutral-800\">{{ monthYearLabel() }}</span>\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-right\"\n ariaLabel=\"Next month\"\n (onClick)=\"nextMonth()\" />\n </div>\n <!-- Weekdays -->\n <div class=\"grid grid-cols-7 gap-0 mb-1\">\n @for (day of weekDays; track $index) {\n <div class=\"text-center text-xs font-medium text-neutral-400 py-1\">{{ day }}</div>\n }\n </div>\n <!-- Days -->\n <div class=\"grid grid-cols-7 gap-0\">\n @for (day of calendarDays(); track $index) {\n @if (day === 0) {\n <div></div>\n } @else {\n <button\n type=\"button\"\n (click)=\"selectDay(day)\"\n class=\"h-8 w-8 mx-auto rounded-lg text-sm transition-colors cursor-pointer hover:bg-neutral-100\"\n [class.bg-primary-600]=\"isSelected(day)\"\n [class.text-white]=\"isSelected(day)\"\n [class.hover:bg-primary-700]=\"isSelected(day)\"\n [class.text-neutral-700]=\"!isSelected(day) && !isToday(day)\"\n [class.font-semibold]=\"isToday(day)\"\n [class.text-primary-600]=\"isToday(day) && !isSelected(day)\">\n {{ day }}\n </button>\n }\n }\n </div>\n <div class=\"mt-2 pt-2 border-t border-neutral-100 flex items-center justify-between gap-2\">\n <tailwind-button\n kind=\"text\"\n color=\"primary\"\n size=\"xs\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"goToToday()\">\n {{ i18n.today }}\n </tailwind-button>\n <tailwind-button\n kind=\"solid\"\n color=\"primary\"\n size=\"sm\"\n [disabled]=\"isDisabled() || !draft()\"\n (onClick)=\"apply()\">\n {{ i18n.confirm }}\n </tailwind-button>\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:block;position:relative}\n"] }]
|
|
3495
3495
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], format: [{ type: i0.Input, args: [{ isSignal: true, alias: "format", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], onDocumentPointerDown: [{
|
|
@@ -3585,10 +3585,10 @@ class TailwindTimePicker extends TailwindComponent {
|
|
|
3585
3585
|
event.stopPropagation();
|
|
3586
3586
|
this.showPanel.set(false);
|
|
3587
3587
|
}
|
|
3588
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3589
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3588
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTimePicker, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3589
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindTimePicker, isStandalone: true, selector: "tailwind-time-picker", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { listeners: { "document:pointerdown": "onDocumentPointerDown($event)", "document:keydown": "onDocumentKeydown($event)" } }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TailwindTimePicker), multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col gap-1.5\">\n @if (label()) {\n <label [attr.for]=\"id() ? id() + '-inner' : null\" class=\"text-sm font-medium text-neutral-700\">{{ label() }}</label>\n }\n <div class=\"relative\">\n <input\n [attr.id]=\"id() ? id() + '-inner' : null\"\n type=\"text\"\n readonly\n [value]=\"displayValue()\"\n [placeholder]=\"i18n.placeholder\"\n [disabled]=\"isDisabled()\"\n class=\"block w-full bg-white border border-neutral-300 rounded-md px-3 py-2 text-sm text-neutral-900 placeholder:text-neutral-400 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 cursor-pointer disabled:bg-neutral-50 disabled:cursor-not-allowed pr-10\"\n (click)=\"togglePanel()\" />\n <tailwind-icon\n icon=\"clock\"\n [size]=\"16\"\n class=\"absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 pointer-events-none\" />\n\n @if (showPanel()) {\n <div\n class=\"absolute left-0 top-full z-popover mt-1 w-52 rounded-xl border border-neutral-200 bg-white p-4 shadow-xl\">\n <div class=\"flex items-center gap-2\">\n <select\n class=\"flex-1 min-w-0 block bg-white border border-neutral-300 rounded-md px-2 py-1.5 text-sm text-neutral-900 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 disabled:bg-neutral-50 disabled:cursor-not-allowed\"\n [disabled]=\"isDisabled()\"\n (change)=\"onHourChange($event)\">\n @for (h of hours; track h) {\n <option [value]=\"h\" [selected]=\"h === (draft()?.h ?? 0)\">\n {{ h.toString().padStart(2, '0') }}\n </option>\n }\n </select>\n <span class=\"text-neutral-400 text-sm shrink-0\">:</span>\n <select\n class=\"flex-1 min-w-0 block bg-white border border-neutral-300 rounded-md px-2 py-1.5 text-sm text-neutral-900 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 disabled:bg-neutral-50 disabled:cursor-not-allowed\"\n [disabled]=\"isDisabled()\"\n (change)=\"onMinuteChange($event)\">\n @for (m of minutes; track m) {\n <option [value]=\"m\" [selected]=\"m === (draft()?.m ?? 0)\">\n {{ m.toString().padStart(2, '0') }}\n </option>\n }\n </select>\n </div>\n <div class=\"mt-2 pt-2 border-t border-neutral-100 flex items-center justify-between gap-2\">\n <tailwind-button\n kind=\"text\"\n color=\"primary\"\n size=\"xs\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"goToNow()\">\n {{ i18n.now }}\n </tailwind-button>\n <tailwind-button\n kind=\"solid\"\n color=\"primary\"\n size=\"sm\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"apply()\">\n {{ i18n.apply }}\n </tailwind-button>\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }, { kind: "component", type: TailwindButton, selector: "tailwind-button", inputs: ["color", "kind", "size", "disabled", "type", "role", "icon", "iconPosition", "ariaLabel"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3590
3590
|
}
|
|
3591
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3591
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindTimePicker, decorators: [{
|
|
3592
3592
|
type: Component,
|
|
3593
3593
|
args: [{ selector: 'tailwind-time-picker', imports: [TailwindIcon, TailwindButton], providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TailwindTimePicker), multi: true }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col gap-1.5\">\n @if (label()) {\n <label [attr.for]=\"id() ? id() + '-inner' : null\" class=\"text-sm font-medium text-neutral-700\">{{ label() }}</label>\n }\n <div class=\"relative\">\n <input\n [attr.id]=\"id() ? id() + '-inner' : null\"\n type=\"text\"\n readonly\n [value]=\"displayValue()\"\n [placeholder]=\"i18n.placeholder\"\n [disabled]=\"isDisabled()\"\n class=\"block w-full bg-white border border-neutral-300 rounded-md px-3 py-2 text-sm text-neutral-900 placeholder:text-neutral-400 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 cursor-pointer disabled:bg-neutral-50 disabled:cursor-not-allowed pr-10\"\n (click)=\"togglePanel()\" />\n <tailwind-icon\n icon=\"clock\"\n [size]=\"16\"\n class=\"absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 pointer-events-none\" />\n\n @if (showPanel()) {\n <div\n class=\"absolute left-0 top-full z-popover mt-1 w-52 rounded-xl border border-neutral-200 bg-white p-4 shadow-xl\">\n <div class=\"flex items-center gap-2\">\n <select\n class=\"flex-1 min-w-0 block bg-white border border-neutral-300 rounded-md px-2 py-1.5 text-sm text-neutral-900 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 disabled:bg-neutral-50 disabled:cursor-not-allowed\"\n [disabled]=\"isDisabled()\"\n (change)=\"onHourChange($event)\">\n @for (h of hours; track h) {\n <option [value]=\"h\" [selected]=\"h === (draft()?.h ?? 0)\">\n {{ h.toString().padStart(2, '0') }}\n </option>\n }\n </select>\n <span class=\"text-neutral-400 text-sm shrink-0\">:</span>\n <select\n class=\"flex-1 min-w-0 block bg-white border border-neutral-300 rounded-md px-2 py-1.5 text-sm text-neutral-900 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 disabled:bg-neutral-50 disabled:cursor-not-allowed\"\n [disabled]=\"isDisabled()\"\n (change)=\"onMinuteChange($event)\">\n @for (m of minutes; track m) {\n <option [value]=\"m\" [selected]=\"m === (draft()?.m ?? 0)\">\n {{ m.toString().padStart(2, '0') }}\n </option>\n }\n </select>\n </div>\n <div class=\"mt-2 pt-2 border-t border-neutral-100 flex items-center justify-between gap-2\">\n <tailwind-button\n kind=\"text\"\n color=\"primary\"\n size=\"xs\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"goToNow()\">\n {{ i18n.now }}\n </tailwind-button>\n <tailwind-button\n kind=\"solid\"\n color=\"primary\"\n size=\"sm\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"apply()\">\n {{ i18n.apply }}\n </tailwind-button>\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
3594
3594
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], onDocumentPointerDown: [{
|
|
@@ -3800,10 +3800,10 @@ class TailwindDateTimePicker extends TailwindComponent {
|
|
|
3800
3800
|
event.stopPropagation();
|
|
3801
3801
|
this.showPanel.set(false);
|
|
3802
3802
|
}
|
|
3803
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3804
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3803
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindDateTimePicker, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3804
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindDateTimePicker, isStandalone: true, selector: "tailwind-datetime-picker", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:pointerdown": "onDocumentPointerDown($event)", "document:keydown": "onDocumentKeydown($event)" } }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TailwindDateTimePicker), multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col gap-1.5\">\n @if (label()) {\n <label [attr.for]=\"id() ? id() + '-inner' : null\" class=\"text-sm font-medium text-neutral-700\">{{ label() }}</label>\n }\n <div class=\"relative\">\n <input\n [attr.id]=\"id() ? id() + '-inner' : null\"\n type=\"text\"\n readonly\n [value]=\"displayValue()\"\n [placeholder]=\"effectivePlaceholder()\"\n class=\"block w-full bg-white border border-neutral-300 rounded-md px-3 py-2 text-sm text-neutral-900 placeholder:text-neutral-400 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 cursor-pointer disabled:bg-neutral-50 disabled:cursor-not-allowed pr-10\"\n [disabled]=\"isDisabled()\"\n (click)=\"togglePanel()\" />\n <tailwind-icon\n icon=\"calendar-days\"\n [size]=\"16\"\n class=\"absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 pointer-events-none\" />\n\n @if (showPanel()) {\n <div\n class=\"absolute left-0 top-full z-popover mt-1 w-80 max-w-full rounded-xl border border-neutral-200 bg-white p-4 shadow-xl\">\n <div class=\"flex items-center justify-between mb-3\">\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-left\"\n ariaLabel=\"Previous month\"\n (onClick)=\"prevMonth()\" />\n <span class=\"text-sm font-semibold text-neutral-800\">{{ monthYearLabel() }}</span>\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-right\"\n ariaLabel=\"Next month\"\n (onClick)=\"nextMonth()\" />\n </div>\n <div class=\"grid grid-cols-7 gap-0 mb-1\">\n @for (day of weekDays; track day) {\n <div class=\"text-center text-xs font-medium text-neutral-400 py-1\">{{ day }}</div>\n }\n </div>\n <div class=\"grid grid-cols-7 gap-0\">\n @for (day of calendarDays(); track $index) {\n @if (day === 0) {\n <div></div>\n } @else {\n <button\n type=\"button\"\n (click)=\"selectDay(day)\"\n class=\"h-8 w-8 mx-auto rounded-lg text-sm transition-colors cursor-pointer hover:bg-neutral-100\"\n [class.bg-primary-600]=\"isSelected(day)\"\n [class.text-white]=\"isSelected(day)\"\n [class.hover:bg-primary-700]=\"isSelected(day)\"\n [class.text-neutral-700]=\"!isSelected(day) && !isToday(day)\"\n [class.font-semibold]=\"isToday(day)\"\n [class.text-primary-600]=\"isToday(day) && !isSelected(day)\">\n {{ day }}\n </button>\n }\n }\n </div>\n <div class=\"mt-3 pt-3 border-t border-neutral-100 flex items-center gap-2\">\n <span class=\"text-xs font-medium text-neutral-600 shrink-0\">{{ i18n.time }}</span>\n <select\n class=\"flex-1 min-w-0 block bg-white border border-neutral-300 rounded-md px-2 py-1.5 text-sm text-neutral-900 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 disabled:bg-neutral-50 disabled:cursor-not-allowed\"\n [disabled]=\"isDisabled() || !draft()\"\n (change)=\"onHourChange($event)\">\n @for (h of hours; track h) {\n <option [value]=\"h\" [selected]=\"h === (draft()?.getHours() ?? 0)\">\n {{ h.toString().padStart(2, '0') }}\n </option>\n }\n </select>\n <span class=\"text-neutral-400 text-sm\">:</span>\n <select\n class=\"flex-1 min-w-0 block bg-white border border-neutral-300 rounded-md px-2 py-1.5 text-sm text-neutral-900 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 disabled:bg-neutral-50 disabled:cursor-not-allowed\"\n [disabled]=\"isDisabled() || !draft()\"\n (change)=\"onMinuteChange($event)\">\n @for (m of minutes; track m) {\n <option [value]=\"m\" [selected]=\"m === (draft()?.getMinutes() ?? 0)\">\n {{ m.toString().padStart(2, '0') }}\n </option>\n }\n </select>\n </div>\n <div class=\"mt-2 pt-2 border-t border-neutral-100 flex items-center justify-between gap-2\">\n <tailwind-button\n kind=\"text\"\n color=\"primary\"\n size=\"xs\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"goToToday()\">\n {{ i18n.today }}\n </tailwind-button>\n <tailwind-button\n kind=\"solid\"\n color=\"primary\"\n size=\"sm\"\n [disabled]=\"isDisabled() || !draft()\"\n (onClick)=\"apply()\">\n {{ i18n.confirm }}\n </tailwind-button>\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block;position:relative;overflow:visible}\n"], dependencies: [{ kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }, { kind: "component", type: TailwindButton, selector: "tailwind-button", inputs: ["color", "kind", "size", "disabled", "type", "role", "icon", "iconPosition", "ariaLabel"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3805
3805
|
}
|
|
3806
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3806
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindDateTimePicker, decorators: [{
|
|
3807
3807
|
type: Component,
|
|
3808
3808
|
args: [{ selector: 'tailwind-datetime-picker', imports: [TailwindIcon, TailwindButton], providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TailwindDateTimePicker), multi: true }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col gap-1.5\">\n @if (label()) {\n <label [attr.for]=\"id() ? id() + '-inner' : null\" class=\"text-sm font-medium text-neutral-700\">{{ label() }}</label>\n }\n <div class=\"relative\">\n <input\n [attr.id]=\"id() ? id() + '-inner' : null\"\n type=\"text\"\n readonly\n [value]=\"displayValue()\"\n [placeholder]=\"effectivePlaceholder()\"\n class=\"block w-full bg-white border border-neutral-300 rounded-md px-3 py-2 text-sm text-neutral-900 placeholder:text-neutral-400 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 cursor-pointer disabled:bg-neutral-50 disabled:cursor-not-allowed pr-10\"\n [disabled]=\"isDisabled()\"\n (click)=\"togglePanel()\" />\n <tailwind-icon\n icon=\"calendar-days\"\n [size]=\"16\"\n class=\"absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 pointer-events-none\" />\n\n @if (showPanel()) {\n <div\n class=\"absolute left-0 top-full z-popover mt-1 w-80 max-w-full rounded-xl border border-neutral-200 bg-white p-4 shadow-xl\">\n <div class=\"flex items-center justify-between mb-3\">\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-left\"\n ariaLabel=\"Previous month\"\n (onClick)=\"prevMonth()\" />\n <span class=\"text-sm font-semibold text-neutral-800\">{{ monthYearLabel() }}</span>\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"chevron-right\"\n ariaLabel=\"Next month\"\n (onClick)=\"nextMonth()\" />\n </div>\n <div class=\"grid grid-cols-7 gap-0 mb-1\">\n @for (day of weekDays; track day) {\n <div class=\"text-center text-xs font-medium text-neutral-400 py-1\">{{ day }}</div>\n }\n </div>\n <div class=\"grid grid-cols-7 gap-0\">\n @for (day of calendarDays(); track $index) {\n @if (day === 0) {\n <div></div>\n } @else {\n <button\n type=\"button\"\n (click)=\"selectDay(day)\"\n class=\"h-8 w-8 mx-auto rounded-lg text-sm transition-colors cursor-pointer hover:bg-neutral-100\"\n [class.bg-primary-600]=\"isSelected(day)\"\n [class.text-white]=\"isSelected(day)\"\n [class.hover:bg-primary-700]=\"isSelected(day)\"\n [class.text-neutral-700]=\"!isSelected(day) && !isToday(day)\"\n [class.font-semibold]=\"isToday(day)\"\n [class.text-primary-600]=\"isToday(day) && !isSelected(day)\">\n {{ day }}\n </button>\n }\n }\n </div>\n <div class=\"mt-3 pt-3 border-t border-neutral-100 flex items-center gap-2\">\n <span class=\"text-xs font-medium text-neutral-600 shrink-0\">{{ i18n.time }}</span>\n <select\n class=\"flex-1 min-w-0 block bg-white border border-neutral-300 rounded-md px-2 py-1.5 text-sm text-neutral-900 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 disabled:bg-neutral-50 disabled:cursor-not-allowed\"\n [disabled]=\"isDisabled() || !draft()\"\n (change)=\"onHourChange($event)\">\n @for (h of hours; track h) {\n <option [value]=\"h\" [selected]=\"h === (draft()?.getHours() ?? 0)\">\n {{ h.toString().padStart(2, '0') }}\n </option>\n }\n </select>\n <span class=\"text-neutral-400 text-sm\">:</span>\n <select\n class=\"flex-1 min-w-0 block bg-white border border-neutral-300 rounded-md px-2 py-1.5 text-sm text-neutral-900 outline-none focus:outline focus:outline-primary-500 focus:outline-offset-2 disabled:bg-neutral-50 disabled:cursor-not-allowed\"\n [disabled]=\"isDisabled() || !draft()\"\n (change)=\"onMinuteChange($event)\">\n @for (m of minutes; track m) {\n <option [value]=\"m\" [selected]=\"m === (draft()?.getMinutes() ?? 0)\">\n {{ m.toString().padStart(2, '0') }}\n </option>\n }\n </select>\n </div>\n <div class=\"mt-2 pt-2 border-t border-neutral-100 flex items-center justify-between gap-2\">\n <tailwind-button\n kind=\"text\"\n color=\"primary\"\n size=\"xs\"\n [disabled]=\"isDisabled()\"\n (onClick)=\"goToToday()\">\n {{ i18n.today }}\n </tailwind-button>\n <tailwind-button\n kind=\"solid\"\n color=\"primary\"\n size=\"sm\"\n [disabled]=\"isDisabled() || !draft()\"\n (onClick)=\"apply()\">\n {{ i18n.confirm }}\n </tailwind-button>\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block;position:relative;overflow:visible}\n"] }]
|
|
3809
3809
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], format: [{ type: i0.Input, args: [{ isSignal: true, alias: "format", required: false }] }], onDocumentPointerDown: [{
|
|
@@ -3820,10 +3820,10 @@ class TailwindStep extends TailwindComponent {
|
|
|
3820
3820
|
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
3821
3821
|
completed = signal(false, ...(ngDevMode ? [{ debugName: "completed" }] : /* istanbul ignore next */ []));
|
|
3822
3822
|
isActive = signal(false, ...(ngDevMode ? [{ debugName: "isActive" }] : /* istanbul ignore next */ []));
|
|
3823
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3824
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3823
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindStep, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3824
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindStep, isStandalone: true, selector: "tailwind-step", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "@if (isActive()) {\n <div class=\"py-4\"><ng-content /></div>\n}\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3825
3825
|
}
|
|
3826
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3826
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindStep, decorators: [{
|
|
3827
3827
|
type: Component,
|
|
3828
3828
|
args: [{ selector: 'tailwind-step', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isActive()) {\n <div class=\"py-4\"><ng-content /></div>\n}\n", styles: [":host{display:block}\n"] }]
|
|
3829
3829
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }] } });
|
|
@@ -3856,10 +3856,10 @@ class TailwindStepper extends TailwindComponent {
|
|
|
3856
3856
|
if (this.activeIndex() > 0)
|
|
3857
3857
|
this.activeIndex.update(v => v - 1);
|
|
3858
3858
|
}
|
|
3859
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3860
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3859
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindStepper, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3860
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindStepper, isStandalone: true, selector: "tailwind-stepper", inputs: { activeIndex: { classPropertyName: "activeIndex", publicName: "activeIndex", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeIndex: "activeIndexChange" }, queries: [{ propertyName: "steps", predicate: TailwindStep, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!-- Step indicators -->\n<div class=\"flex items-center mb-6\">\n @for (step of steps(); track step.label(); let i = $index; let last = $last) {\n <div class=\"flex items-center\" [class.flex-1]=\"!last\">\n <button\n type=\"button\"\n (click)=\"goToStep(i)\"\n class=\"flex items-center gap-2 cursor-pointer group\"\n [attr.aria-current]=\"activeIndex() === i ? 'step' : null\">\n <div\n class=\"w-8 h-8 rounded-full flex items-center justify-center text-sm font-semibold border-2 transition-all duration-200\"\n [class.bg-primary-600]=\"i <= activeIndex()\"\n [class.border-primary-600]=\"i <= activeIndex()\"\n [class.text-on-primary-600]=\"i <= activeIndex()\"\n [class.border-neutral-300]=\"i > activeIndex()\"\n [class.text-neutral-600]=\"i > activeIndex()\">\n @if (step.completed()) {\n <tailwind-icon icon=\"check\" [size]=\"16\" />\n } @else {\n {{ i + 1 }}\n }\n </div>\n <div class=\"hidden sm:block\">\n <p\n class=\"text-sm font-medium\"\n [class.text-primary-700]=\"i <= activeIndex()\"\n [class.text-neutral-700]=\"i > activeIndex()\">\n {{ step.label() }}\n </p>\n @if (step.description()) {\n <p class=\"text-xs text-neutral-500\">{{ step.description() }}</p>\n }\n </div>\n </button>\n @if (!last) {\n <div\n class=\"flex-1 h-0.5 mx-3 rounded-full transition-colors duration-200\"\n [class.bg-primary-600]=\"i < activeIndex()\"\n [class.bg-neutral-200]=\"i >= activeIndex()\"></div>\n }\n </div>\n }\n</div>\n<!-- Step content -->\n<ng-content />\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3861
3861
|
}
|
|
3862
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3862
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindStepper, decorators: [{
|
|
3863
3863
|
type: Component,
|
|
3864
3864
|
args: [{ imports: [TailwindIcon], selector: 'tailwind-stepper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Step indicators -->\n<div class=\"flex items-center mb-6\">\n @for (step of steps(); track step.label(); let i = $index; let last = $last) {\n <div class=\"flex items-center\" [class.flex-1]=\"!last\">\n <button\n type=\"button\"\n (click)=\"goToStep(i)\"\n class=\"flex items-center gap-2 cursor-pointer group\"\n [attr.aria-current]=\"activeIndex() === i ? 'step' : null\">\n <div\n class=\"w-8 h-8 rounded-full flex items-center justify-center text-sm font-semibold border-2 transition-all duration-200\"\n [class.bg-primary-600]=\"i <= activeIndex()\"\n [class.border-primary-600]=\"i <= activeIndex()\"\n [class.text-on-primary-600]=\"i <= activeIndex()\"\n [class.border-neutral-300]=\"i > activeIndex()\"\n [class.text-neutral-600]=\"i > activeIndex()\">\n @if (step.completed()) {\n <tailwind-icon icon=\"check\" [size]=\"16\" />\n } @else {\n {{ i + 1 }}\n }\n </div>\n <div class=\"hidden sm:block\">\n <p\n class=\"text-sm font-medium\"\n [class.text-primary-700]=\"i <= activeIndex()\"\n [class.text-neutral-700]=\"i > activeIndex()\">\n {{ step.label() }}\n </p>\n @if (step.description()) {\n <p class=\"text-xs text-neutral-500\">{{ step.description() }}</p>\n }\n </div>\n </button>\n @if (!last) {\n <div\n class=\"flex-1 h-0.5 mx-3 rounded-full transition-colors duration-200\"\n [class.bg-primary-600]=\"i < activeIndex()\"\n [class.bg-neutral-200]=\"i >= activeIndex()\"></div>\n }\n </div>\n }\n</div>\n<!-- Step content -->\n<ng-content />\n", styles: [":host{display:block}\n"] }]
|
|
3865
3865
|
}], ctorParameters: () => [], propDecorators: { activeIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeIndex", required: false }] }, { type: i0.Output, args: ["activeIndexChange"] }], linear: [{ type: i0.Input, args: [{ isSignal: true, alias: "linear", required: false }] }], steps: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => TailwindStep), { isSignal: true }] }] } });
|
|
@@ -3875,20 +3875,20 @@ class TailwindAccordionItem extends TailwindComponent {
|
|
|
3875
3875
|
this.onToggle.emit();
|
|
3876
3876
|
}
|
|
3877
3877
|
}
|
|
3878
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3879
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3878
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindAccordionItem, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3879
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindAccordionItem, isStandalone: true, selector: "tailwind-accordion-item", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onToggle: "onToggle" }, usesInheritance: true, ngImport: i0, template: "<div [id]=\"id()\" [ngClass]=\"class()\" class=\"border-b border-neutral-200 last:border-b-0\">\n <button\n type=\"button\"\n (click)=\"toggle()\"\n class=\"flex items-center justify-between w-full px-5 py-4 text-left text-sm font-medium text-neutral-800 hover:bg-neutral-50 transition-colors cursor-pointer\"\n [attr.aria-expanded]=\"isExpanded()\">\n <span>{{ title() }}</span>\n <tailwind-icon\n icon=\"chevron-down\"\n [size]=\"16\"\n class=\"text-neutral-400 transition-transform duration-200\"\n [class.rotate-180]=\"isExpanded()\" />\n </button>\n @if (isExpanded()) {\n <div class=\"px-5 py-4 text-sm text-neutral-600\">\n <ng-content />\n </div>\n }\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3880
3880
|
}
|
|
3881
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3881
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindAccordionItem, decorators: [{
|
|
3882
3882
|
type: Component,
|
|
3883
3883
|
args: [{ imports: [CommonModule, TailwindIcon], selector: 'tailwind-accordion-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [id]=\"id()\" [ngClass]=\"class()\" class=\"border-b border-neutral-200 last:border-b-0\">\n <button\n type=\"button\"\n (click)=\"toggle()\"\n class=\"flex items-center justify-between w-full px-5 py-4 text-left text-sm font-medium text-neutral-800 hover:bg-neutral-50 transition-colors cursor-pointer\"\n [attr.aria-expanded]=\"isExpanded()\">\n <span>{{ title() }}</span>\n <tailwind-icon\n icon=\"chevron-down\"\n [size]=\"16\"\n class=\"text-neutral-400 transition-transform duration-200\"\n [class.rotate-180]=\"isExpanded()\" />\n </button>\n @if (isExpanded()) {\n <div class=\"px-5 py-4 text-sm text-neutral-600\">\n <ng-content />\n </div>\n }\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
3884
3884
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], onToggle: [{ type: i0.Output, args: ["onToggle"] }] } });
|
|
3885
3885
|
|
|
3886
3886
|
class TailwindAccordion extends TailwindComponent {
|
|
3887
3887
|
items = contentChildren(TailwindAccordionItem, ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
3888
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3889
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.
|
|
3888
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindAccordion, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3889
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.14", type: TailwindAccordion, isStandalone: true, selector: "tailwind-accordion", queries: [{ propertyName: "items", predicate: TailwindAccordionItem, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n [id]=\"id()\"\n [ngClass]=\"class()\"\n class=\"border border-neutral-200 rounded-md overflow-hidden divide-y divide-neutral-200\">\n <ng-content />\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3890
3890
|
}
|
|
3891
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3891
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindAccordion, decorators: [{
|
|
3892
3892
|
type: Component,
|
|
3893
3893
|
args: [{ imports: [CommonModule], selector: 'tailwind-accordion', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [id]=\"id()\"\n [ngClass]=\"class()\"\n class=\"border border-neutral-200 rounded-md overflow-hidden divide-y divide-neutral-200\">\n <ng-content />\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
3894
3894
|
}], propDecorators: { items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => TailwindAccordionItem), { isSignal: true }] }] } });
|
|
@@ -3981,10 +3981,10 @@ class TailwindModalService {
|
|
|
3981
3981
|
modalComp.instance.open();
|
|
3982
3982
|
});
|
|
3983
3983
|
}
|
|
3984
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3985
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
3984
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
3985
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindModalService, providedIn: 'root' });
|
|
3986
3986
|
}
|
|
3987
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3987
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindModalService, decorators: [{
|
|
3988
3988
|
type: Injectable,
|
|
3989
3989
|
args: [{ providedIn: 'root' }]
|
|
3990
3990
|
}] });
|
|
@@ -4019,20 +4019,20 @@ class TailwindToastService {
|
|
|
4019
4019
|
clear() {
|
|
4020
4020
|
this.toasts.set([]);
|
|
4021
4021
|
}
|
|
4022
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4023
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
4022
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
4023
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindToastService, providedIn: 'root' });
|
|
4024
4024
|
}
|
|
4025
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4025
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindToastService, decorators: [{
|
|
4026
4026
|
type: Injectable,
|
|
4027
4027
|
args: [{ providedIn: 'root' }]
|
|
4028
4028
|
}] });
|
|
4029
4029
|
|
|
4030
4030
|
class TailwindToast extends TailwindComponent {
|
|
4031
4031
|
toastService = inject(TailwindToastService);
|
|
4032
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4033
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
4032
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindToast, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4033
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindToast, isStandalone: true, selector: "tailwind-toast", usesInheritance: true, ngImport: i0, template: "<div class=\"fixed bottom-4 right-4 z-1080 flex flex-col gap-2 max-w-sm w-full pointer-events-none\">\n @for (toast of toastService.toasts(); track toast.id) {\n <div\n class=\"pointer-events-auto rounded-xl border shadow-lg p-4 flex gap-3 animate-in slide-in-from-right-full duration-300\"\n [class.bg-success-50]=\"toast.severity === 'success'\"\n [class.border-success-200]=\"toast.severity === 'success'\"\n [class.bg-warning-50]=\"toast.severity === 'warning'\"\n [class.border-warning-200]=\"toast.severity === 'warning'\"\n [class.bg-danger-50]=\"toast.severity === 'danger'\"\n [class.border-danger-200]=\"toast.severity === 'danger'\"\n [class.bg-info-50]=\"toast.severity === 'info'\"\n [class.border-info-200]=\"toast.severity === 'info'\"\n role=\"alert\">\n <div class=\"flex-1 min-w-0\">\n @if (toast.title) {\n <p class=\"text-sm font-semibold mb-0.5\">{{ toast.title }}</p>\n }\n <p class=\"text-sm\">{{ toast.message }}</p>\n </div>\n @if (toast.dismissible) {\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"x-mark\"\n class=\"shrink-0 opacity-60 hover:opacity-100\"\n ariaLabel=\"Dismiss\"\n (onClick)=\"toastService.dismiss(toast.id)\" />\n }\n </div>\n }\n</div>\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "component", type: TailwindButton, selector: "tailwind-button", inputs: ["color", "kind", "size", "disabled", "type", "role", "icon", "iconPosition", "ariaLabel"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4034
4034
|
}
|
|
4035
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4035
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindToast, decorators: [{
|
|
4036
4036
|
type: Component,
|
|
4037
4037
|
args: [{ imports: [TailwindButton], selector: 'tailwind-toast', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"fixed bottom-4 right-4 z-1080 flex flex-col gap-2 max-w-sm w-full pointer-events-none\">\n @for (toast of toastService.toasts(); track toast.id) {\n <div\n class=\"pointer-events-auto rounded-xl border shadow-lg p-4 flex gap-3 animate-in slide-in-from-right-full duration-300\"\n [class.bg-success-50]=\"toast.severity === 'success'\"\n [class.border-success-200]=\"toast.severity === 'success'\"\n [class.bg-warning-50]=\"toast.severity === 'warning'\"\n [class.border-warning-200]=\"toast.severity === 'warning'\"\n [class.bg-danger-50]=\"toast.severity === 'danger'\"\n [class.border-danger-200]=\"toast.severity === 'danger'\"\n [class.bg-info-50]=\"toast.severity === 'info'\"\n [class.border-info-200]=\"toast.severity === 'info'\"\n role=\"alert\">\n <div class=\"flex-1 min-w-0\">\n @if (toast.title) {\n <p class=\"text-sm font-semibold mb-0.5\">{{ toast.title }}</p>\n }\n <p class=\"text-sm\">{{ toast.message }}</p>\n </div>\n @if (toast.dismissible) {\n <tailwind-button\n kind=\"ghost\"\n color=\"transparent\"\n size=\"sm\"\n icon=\"x-mark\"\n class=\"shrink-0 opacity-60 hover:opacity-100\"\n ariaLabel=\"Dismiss\"\n (onClick)=\"toastService.dismiss(toast.id)\" />\n }\n </div>\n }\n</div>\n", styles: [":host{display:contents}\n"] }]
|
|
4038
4038
|
}] });
|
|
@@ -4052,10 +4052,10 @@ class TailwindNotification extends TailwindComponent {
|
|
|
4052
4052
|
};
|
|
4053
4053
|
return `flex items-start rounded-lg border p-4 ${variantMap[this.severity()]}`;
|
|
4054
4054
|
}, ...(ngDevMode ? [{ debugName: "computedClasses" }] : /* istanbul ignore next */ []));
|
|
4055
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4056
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
4055
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindNotification, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4056
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindNotification, isStandalone: true, selector: "tailwind-notification", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, showActions: { classPropertyName: "showActions", publicName: "showActions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onDismiss: "onDismiss" }, usesInheritance: true, ngImport: i0, template: "<div [class]=\"computedClasses()\" role=\"alert\">\n <div class=\"flex-1 min-w-0\">\n @if (title()) {\n <p class=\"text-sm font-semibold mb-0.5\">{{ title() }}</p>\n }\n <p class=\"text-sm\"><ng-content /></p>\n @if (showActions()) {\n <div class=\"pt-3\">\n <ng-content select=\"[tailwind-notification-actions]\" />\n </div>\n }\n </div>\n @if (dismissible()) {\n <tailwind-button\n kind=\"ghost\"\n color=\"secondary\"\n size=\"sm\"\n icon=\"x-mark\"\n class=\"shrink-0 -m-1\"\n ariaLabel=\"Dismiss\"\n (onClick)=\"onDismiss.emit()\" />\n }\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: TailwindButton, selector: "tailwind-button", inputs: ["color", "kind", "size", "disabled", "type", "role", "icon", "iconPosition", "ariaLabel"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4057
4057
|
}
|
|
4058
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4058
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindNotification, decorators: [{
|
|
4059
4059
|
type: Component,
|
|
4060
4060
|
args: [{ imports: [TailwindButton], selector: 'tailwind-notification', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"computedClasses()\" role=\"alert\">\n <div class=\"flex-1 min-w-0\">\n @if (title()) {\n <p class=\"text-sm font-semibold mb-0.5\">{{ title() }}</p>\n }\n <p class=\"text-sm\"><ng-content /></p>\n @if (showActions()) {\n <div class=\"pt-3\">\n <ng-content select=\"[tailwind-notification-actions]\" />\n </div>\n }\n </div>\n @if (dismissible()) {\n <tailwind-button\n kind=\"ghost\"\n color=\"secondary\"\n size=\"sm\"\n icon=\"x-mark\"\n class=\"shrink-0 -m-1\"\n ariaLabel=\"Dismiss\"\n (onClick)=\"onDismiss.emit()\" />\n }\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
4061
4061
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], severity: [{ type: i0.Input, args: [{ isSignal: true, alias: "severity", required: false }] }], dismissible: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissible", required: false }] }], showActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showActions", required: false }] }], onDismiss: [{ type: i0.Output, args: ["onDismiss"] }] } });
|
|
@@ -4071,10 +4071,10 @@ class TailwindMessage extends TailwindComponent {
|
|
|
4071
4071
|
};
|
|
4072
4072
|
return `text-sm px-3 py-2 rounded-lg border ${variantMap[this.severity()]}`;
|
|
4073
4073
|
}, ...(ngDevMode ? [{ debugName: "computedClasses" }] : /* istanbul ignore next */ []));
|
|
4074
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4075
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
4074
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindMessage, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4075
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.14", type: TailwindMessage, isStandalone: true, selector: "tailwind-message", inputs: { severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<div [class]=\"computedClasses()\" role=\"status\">\n <ng-content />\n</div>\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4076
4076
|
}
|
|
4077
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4077
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindMessage, decorators: [{
|
|
4078
4078
|
type: Component,
|
|
4079
4079
|
args: [{ selector: 'tailwind-message', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"computedClasses()\" role=\"status\">\n <ng-content />\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
4080
4080
|
}], propDecorators: { severity: [{ type: i0.Input, args: [{ isSignal: true, alias: "severity", required: false }] }] } });
|
|
@@ -4093,10 +4093,10 @@ class TailwindSkeleton extends TailwindComponent {
|
|
|
4093
4093
|
};
|
|
4094
4094
|
return `${base} ${variantMap[this.variant()]}`;
|
|
4095
4095
|
}, ...(ngDevMode ? [{ debugName: "computedClasses" }] : /* istanbul ignore next */ []));
|
|
4096
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4097
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
4096
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindSkeleton, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4097
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.14", type: TailwindSkeleton, isStandalone: true, selector: "tailwind-skeleton", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<div\n [style.width]=\"width()\"\n [style.height]=\"height() || (variant() === 'circle' ? width() : '1.5rem')\"\n [class]=\"computedClasses()\"\n aria-hidden=\"true\"></div>\n", styles: [":host{display:block}@keyframes tailwind-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.tailwind-skeleton-pulse{animation:tailwind-shimmer 1.5s ease-in-out infinite;background:linear-gradient(90deg,var(--color-neutral-200) 25%,var(--color-neutral-100) 50%,var(--color-neutral-200) 75%);background-size:200% 100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4098
4098
|
}
|
|
4099
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4099
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindSkeleton, decorators: [{
|
|
4100
4100
|
type: Component,
|
|
4101
4101
|
args: [{ selector: 'tailwind-skeleton', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [style.width]=\"width()\"\n [style.height]=\"height() || (variant() === 'circle' ? width() : '1.5rem')\"\n [class]=\"computedClasses()\"\n aria-hidden=\"true\"></div>\n", styles: [":host{display:block}@keyframes tailwind-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.tailwind-skeleton-pulse{animation:tailwind-shimmer 1.5s ease-in-out infinite;background:linear-gradient(90deg,var(--color-neutral-200) 25%,var(--color-neutral-100) 50%,var(--color-neutral-200) 75%);background-size:200% 100%}\n"] }]
|
|
4102
4102
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }] } });
|
|
@@ -4242,10 +4242,10 @@ class TailwindToolbar extends TailwindComponent {
|
|
|
4242
4242
|
menuTrackKey(index, item) {
|
|
4243
4243
|
return item.value ?? item.label ?? String(index);
|
|
4244
4244
|
}
|
|
4245
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4246
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
4245
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindToolbar, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4246
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindToolbar, isStandalone: true, selector: "tailwind-toolbar", inputs: { rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, elevated: { classPropertyName: "elevated", publicName: "elevated", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, menu: { classPropertyName: "menu", publicName: "menu", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onMenuSelect: "onMenuSelect" }, usesInheritance: true, ngImport: i0, template: "<div [class]=\"rootClasses()\">\n <div class=\"shrink-0\">\n <ng-content select=\"[tailwind-toolbar-logo]\" />\n </div>\n @if (orientation() === 'horizontal') {\n <nav class=\"min-w-0 flex flex-1 flex-row flex-wrap items-center gap-1\" [attr.aria-label]=\"'Toolbar menu'\">\n @if (menu().length) {\n <div class=\"flex shrink-0 items-center md:hidden\">\n <button\n type=\"button\"\n [class]=\"mobileMenuToggleClasses()\"\n [attr.aria-expanded]=\"mobileToolbarMenu.isOpen()\"\n aria-haspopup=\"menu\"\n aria-label=\"Open navigation menu\"\n (click)=\"mobileToolbarMenu.toggle($event)\">\n <tailwind-icon icon=\"bars-3\" [size]=\"22\" [class]=\"menuItemIconClasses()\" />\n </button>\n <tailwind-menu\n #mobileToolbarMenu\n [items]=\"mobileMenuItems()\"\n align=\"left\"\n (onSelect)=\"selectMenuItem($event)\" />\n </div>\n }\n <div class=\"hidden min-w-0 flex-1 flex-row flex-wrap items-center gap-1 md:flex\">\n @for (item of menu(); track menuTrackKey($index, item)) {\n @if (item.divider) {\n <span [class]=\"menuDividerLineClasses()\" aria-hidden=\"true\"></span>\n } @else if (hasSubmenu(item)) {\n <div [class]=\"menuItemWithSubmenuClasses()\">\n <button\n type=\"button\"\n [disabled]=\"!!item.disabled\"\n [class]=\"menuItemButtonClasses()\"\n [class.px-2]=\"!!item.icon && !menuItemHasVisibleLabel(item)\"\n [class.py-2]=\"!!item.icon && !menuItemHasVisibleLabel(item)\"\n [attr.aria-label]=\"menuItemAriaLabel(item)\"\n [attr.aria-expanded]=\"itemMenu.isOpen()\"\n aria-haspopup=\"menu\"\n (click)=\"itemMenu.toggle($event)\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"20\" [class]=\"menuItemIconClasses()\" />\n }\n @if (menuItemHasVisibleLabel(item)) {\n {{ item.label }}\n }\n <tailwind-icon [icon]=\"submenuChevronIcon()\" [size]=\"16\" [class]=\"menuItemIconClasses()\" />\n </button>\n <tailwind-menu\n #itemMenu\n [items]=\"item.items!\"\n [placement]=\"submenuPlacement()\"\n align=\"left\"\n (onSelect)=\"selectMenuItem($event)\" />\n </div>\n } @else {\n <button\n type=\"button\"\n [disabled]=\"!!item.disabled\"\n [class]=\"menuItemButtonClasses()\"\n [class.px-2]=\"!!item.icon && !menuItemHasVisibleLabel(item)\"\n [class.py-2]=\"!!item.icon && !menuItemHasVisibleLabel(item)\"\n [attr.aria-label]=\"menuItemAriaLabel(item)\"\n (click)=\"selectMenuItem(item)\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"20\" [class]=\"menuItemIconClasses()\" />\n }\n @if (menuItemHasVisibleLabel(item)) {\n {{ item.label }}\n }\n </button>\n }\n }\n </div>\n </nav>\n } @else {\n <nav [class]=\"menuContainerClasses()\" [attr.aria-label]=\"'Toolbar menu'\">\n @for (item of menu(); track menuTrackKey($index, item)) {\n @if (item.divider) {\n <hr [class]=\"menuDividerRuleClasses()\" />\n } @else if (hasSubmenu(item)) {\n <div [class]=\"menuItemWithSubmenuClasses()\">\n <button\n type=\"button\"\n [disabled]=\"!!item.disabled\"\n [class]=\"menuItemButtonClasses()\"\n [class.justify-center]=\"!menuItemHasVisibleLabel(item)\"\n [attr.aria-label]=\"menuItemAriaLabel(item)\"\n [attr.aria-expanded]=\"itemMenu.isOpen()\"\n aria-haspopup=\"menu\"\n (click)=\"itemMenu.toggle($event)\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"22\" [class]=\"menuItemIconClasses()\" />\n }\n @if (menuItemHasVisibleLabel(item)) {\n <span class=\"min-w-0 flex-1\">{{ item.label }}</span>\n }\n <tailwind-icon\n [icon]=\"submenuChevronIcon()\"\n [size]=\"18\"\n [class]=\"menuItemIconClasses()\"\n [class.ml-auto]=\"menuItemHasVisibleLabel(item)\" />\n </button>\n <tailwind-menu\n #itemMenu\n [items]=\"item.items!\"\n [placement]=\"submenuPlacement()\"\n align=\"left\"\n (onSelect)=\"selectMenuItem($event)\" />\n </div>\n } @else {\n <button\n type=\"button\"\n [disabled]=\"!!item.disabled\"\n [class]=\"menuItemButtonClasses()\"\n [class.justify-center]=\"!menuItemHasVisibleLabel(item)\"\n [attr.aria-label]=\"menuItemAriaLabel(item)\"\n (click)=\"selectMenuItem(item)\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"22\" [class]=\"menuItemIconClasses()\" />\n }\n @if (menuItemHasVisibleLabel(item)) {\n {{ item.label }}\n }\n </button>\n }\n }\n </nav>\n }\n <div\n class=\"flex flex-wrap items-center gap-2 shrink-0\"\n [class.toolbar-end-vertical]=\"orientation() === 'vertical'\"\n [class.justify-end]=\"orientation() === 'horizontal'\"\n [class.mt-auto]=\"orientation() === 'vertical'\"\n [class.w-full]=\"orientation() === 'vertical'\"\n [class.justify-center]=\"orientation() === 'vertical'\">\n <ng-content select=\"[tailwind-toolbar-end]\" />\n </div>\n</div>\n", styles: [":host{display:block}:host .toolbar-menu-icon-on-light .tailwind-icon-glyph{filter:brightness(0) invert(1)}:host .toolbar-end-vertical tailwind-button{display:block;width:100%}:host .toolbar-end-vertical tailwind-button>button{width:100%;justify-content:center}\n"], dependencies: [{ kind: "component", type: TailwindIcon, selector: "tailwind-icon", inputs: ["icon", "size"] }, { kind: "component", type: TailwindMenu, selector: "tailwind-menu", inputs: ["items", "align", "placement"], outputs: ["onSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4247
4247
|
}
|
|
4248
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4248
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindToolbar, decorators: [{
|
|
4249
4249
|
type: Component,
|
|
4250
4250
|
args: [{ imports: [TailwindIcon, TailwindMenu], selector: 'tailwind-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"rootClasses()\">\n <div class=\"shrink-0\">\n <ng-content select=\"[tailwind-toolbar-logo]\" />\n </div>\n @if (orientation() === 'horizontal') {\n <nav class=\"min-w-0 flex flex-1 flex-row flex-wrap items-center gap-1\" [attr.aria-label]=\"'Toolbar menu'\">\n @if (menu().length) {\n <div class=\"flex shrink-0 items-center md:hidden\">\n <button\n type=\"button\"\n [class]=\"mobileMenuToggleClasses()\"\n [attr.aria-expanded]=\"mobileToolbarMenu.isOpen()\"\n aria-haspopup=\"menu\"\n aria-label=\"Open navigation menu\"\n (click)=\"mobileToolbarMenu.toggle($event)\">\n <tailwind-icon icon=\"bars-3\" [size]=\"22\" [class]=\"menuItemIconClasses()\" />\n </button>\n <tailwind-menu\n #mobileToolbarMenu\n [items]=\"mobileMenuItems()\"\n align=\"left\"\n (onSelect)=\"selectMenuItem($event)\" />\n </div>\n }\n <div class=\"hidden min-w-0 flex-1 flex-row flex-wrap items-center gap-1 md:flex\">\n @for (item of menu(); track menuTrackKey($index, item)) {\n @if (item.divider) {\n <span [class]=\"menuDividerLineClasses()\" aria-hidden=\"true\"></span>\n } @else if (hasSubmenu(item)) {\n <div [class]=\"menuItemWithSubmenuClasses()\">\n <button\n type=\"button\"\n [disabled]=\"!!item.disabled\"\n [class]=\"menuItemButtonClasses()\"\n [class.px-2]=\"!!item.icon && !menuItemHasVisibleLabel(item)\"\n [class.py-2]=\"!!item.icon && !menuItemHasVisibleLabel(item)\"\n [attr.aria-label]=\"menuItemAriaLabel(item)\"\n [attr.aria-expanded]=\"itemMenu.isOpen()\"\n aria-haspopup=\"menu\"\n (click)=\"itemMenu.toggle($event)\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"20\" [class]=\"menuItemIconClasses()\" />\n }\n @if (menuItemHasVisibleLabel(item)) {\n {{ item.label }}\n }\n <tailwind-icon [icon]=\"submenuChevronIcon()\" [size]=\"16\" [class]=\"menuItemIconClasses()\" />\n </button>\n <tailwind-menu\n #itemMenu\n [items]=\"item.items!\"\n [placement]=\"submenuPlacement()\"\n align=\"left\"\n (onSelect)=\"selectMenuItem($event)\" />\n </div>\n } @else {\n <button\n type=\"button\"\n [disabled]=\"!!item.disabled\"\n [class]=\"menuItemButtonClasses()\"\n [class.px-2]=\"!!item.icon && !menuItemHasVisibleLabel(item)\"\n [class.py-2]=\"!!item.icon && !menuItemHasVisibleLabel(item)\"\n [attr.aria-label]=\"menuItemAriaLabel(item)\"\n (click)=\"selectMenuItem(item)\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"20\" [class]=\"menuItemIconClasses()\" />\n }\n @if (menuItemHasVisibleLabel(item)) {\n {{ item.label }}\n }\n </button>\n }\n }\n </div>\n </nav>\n } @else {\n <nav [class]=\"menuContainerClasses()\" [attr.aria-label]=\"'Toolbar menu'\">\n @for (item of menu(); track menuTrackKey($index, item)) {\n @if (item.divider) {\n <hr [class]=\"menuDividerRuleClasses()\" />\n } @else if (hasSubmenu(item)) {\n <div [class]=\"menuItemWithSubmenuClasses()\">\n <button\n type=\"button\"\n [disabled]=\"!!item.disabled\"\n [class]=\"menuItemButtonClasses()\"\n [class.justify-center]=\"!menuItemHasVisibleLabel(item)\"\n [attr.aria-label]=\"menuItemAriaLabel(item)\"\n [attr.aria-expanded]=\"itemMenu.isOpen()\"\n aria-haspopup=\"menu\"\n (click)=\"itemMenu.toggle($event)\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"22\" [class]=\"menuItemIconClasses()\" />\n }\n @if (menuItemHasVisibleLabel(item)) {\n <span class=\"min-w-0 flex-1\">{{ item.label }}</span>\n }\n <tailwind-icon\n [icon]=\"submenuChevronIcon()\"\n [size]=\"18\"\n [class]=\"menuItemIconClasses()\"\n [class.ml-auto]=\"menuItemHasVisibleLabel(item)\" />\n </button>\n <tailwind-menu\n #itemMenu\n [items]=\"item.items!\"\n [placement]=\"submenuPlacement()\"\n align=\"left\"\n (onSelect)=\"selectMenuItem($event)\" />\n </div>\n } @else {\n <button\n type=\"button\"\n [disabled]=\"!!item.disabled\"\n [class]=\"menuItemButtonClasses()\"\n [class.justify-center]=\"!menuItemHasVisibleLabel(item)\"\n [attr.aria-label]=\"menuItemAriaLabel(item)\"\n (click)=\"selectMenuItem(item)\">\n @if (item.icon) {\n <tailwind-icon [icon]=\"item.icon\" [size]=\"22\" [class]=\"menuItemIconClasses()\" />\n }\n @if (menuItemHasVisibleLabel(item)) {\n {{ item.label }}\n }\n </button>\n }\n }\n </nav>\n }\n <div\n class=\"flex flex-wrap items-center gap-2 shrink-0\"\n [class.toolbar-end-vertical]=\"orientation() === 'vertical'\"\n [class.justify-end]=\"orientation() === 'horizontal'\"\n [class.mt-auto]=\"orientation() === 'vertical'\"\n [class.w-full]=\"orientation() === 'vertical'\"\n [class.justify-center]=\"orientation() === 'vertical'\">\n <ng-content select=\"[tailwind-toolbar-end]\" />\n </div>\n</div>\n", styles: [":host{display:block}:host .toolbar-menu-icon-on-light .tailwind-icon-glyph{filter:brightness(0) invert(1)}:host .toolbar-end-vertical tailwind-button{display:block;width:100%}:host .toolbar-end-vertical tailwind-button>button{width:100%;justify-content:center}\n"] }]
|
|
4251
4251
|
}], propDecorators: { rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], elevated: [{ type: i0.Input, args: [{ isSignal: true, alias: "elevated", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], menu: [{ type: i0.Input, args: [{ isSignal: true, alias: "menu", required: false }] }], onMenuSelect: [{ type: i0.Output, args: ["onMenuSelect"] }] } });
|
|
@@ -4274,10 +4274,10 @@ class TailwindDivider extends TailwindComponent {
|
|
|
4274
4274
|
return ['border-neutral-200', variant].join(' ');
|
|
4275
4275
|
}, ...(ngDevMode ? [{ debugName: "ruleLineClass" }] : /* istanbul ignore next */ []));
|
|
4276
4276
|
labeledRowClass = computed(() => ['flex items-center gap-3 w-full my-4', this.inset() ? 'mx-4' : ''].filter(Boolean).join(' '), ...(ngDevMode ? [{ debugName: "labeledRowClass" }] : /* istanbul ignore next */ []));
|
|
4277
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4278
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
4277
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindDivider, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4278
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindDivider, isStandalone: true, selector: "tailwind-divider", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, inset: { classPropertyName: "inset", publicName: "inset", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "@if (isLabeledHorizontal()) {\n <div [class]=\"labeledRowClass()\" role=\"separator\" [attr.aria-label]=\"label()\">\n <div class=\"flex-1 border-0 border-t\" [class]=\"ruleLineClass()\"></div>\n <span class=\"text-xs font-medium text-neutral-500 shrink-0\">{{ label() }}</span>\n <div class=\"flex-1 border-0 border-t\" [class]=\"ruleLineClass()\"></div>\n </div>\n} @else {\n <div [class]=\"ruleClasses()\" role=\"separator\"></div>\n}\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4279
4279
|
}
|
|
4280
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4280
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindDivider, decorators: [{
|
|
4281
4281
|
type: Component,
|
|
4282
4282
|
args: [{ selector: 'tailwind-divider', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isLabeledHorizontal()) {\n <div [class]=\"labeledRowClass()\" role=\"separator\" [attr.aria-label]=\"label()\">\n <div class=\"flex-1 border-0 border-t\" [class]=\"ruleLineClass()\"></div>\n <span class=\"text-xs font-medium text-neutral-500 shrink-0\">{{ label() }}</span>\n <div class=\"flex-1 border-0 border-t\" [class]=\"ruleLineClass()\"></div>\n </div>\n} @else {\n <div [class]=\"ruleClasses()\" role=\"separator\"></div>\n}\n", styles: [":host{display:block}\n"] }]
|
|
4283
4283
|
}], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], inset: [{ type: i0.Input, args: [{ isSignal: true, alias: "inset", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }] } });
|
|
@@ -4335,10 +4335,10 @@ class TailwindMeter extends TailwindComponent {
|
|
|
4335
4335
|
};
|
|
4336
4336
|
return map[variant] ?? map['primary'];
|
|
4337
4337
|
}
|
|
4338
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4339
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
4338
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindMeter, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4339
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindMeter, isStandalone: true, selector: "tailwind-meter", inputs: { segments: { classPropertyName: "segments", publicName: "segments", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, showLabels: { classPropertyName: "showLabels", publicName: "showLabels", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<div class=\"w-full space-y-2\">\n <div\n [class]=\"trackContainerClasses()\"\n role=\"meter\"\n [attr.aria-valuemin]=\"0\"\n [attr.aria-valuemax]=\"scaleMax()\"\n [attr.aria-valuenow]=\"totalValue()\"\n [attr.aria-label]=\"'Meter'\">\n @for (seg of segmentLayouts(); track $index) {\n @if (seg.widthPct > 0) {\n <div\n class=\"h-full min-w-0 transition-all duration-300 ease-out\"\n [class]=\"seg.barClass\"\n [style.width.%]=\"seg.widthPct\"\n [attr.title]=\"seg.label + ': ' + seg.value\"></div>\n }\n }\n </div>\n\n @if (showLabels()) {\n <div class=\"flex flex-wrap gap-x-4 gap-y-1 text-xs\">\n @for (seg of segments(); track $index) {\n <span class=\"inline-flex items-center gap-1.5\">\n <span class=\"inline-block size-2 rounded-sm shrink-0\" [class]=\"legendSwatchClass(seg.variant)\"></span>\n <span class=\"text-neutral-700\">{{ seg.label }}</span>\n <span class=\"text-neutral-500\">({{ seg.value }})</span>\n </span>\n }\n </div>\n }\n</div>\n", styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4340
4340
|
}
|
|
4341
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4341
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindMeter, decorators: [{
|
|
4342
4342
|
type: Component,
|
|
4343
4343
|
args: [{ selector: 'tailwind-meter', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"w-full space-y-2\">\n <div\n [class]=\"trackContainerClasses()\"\n role=\"meter\"\n [attr.aria-valuemin]=\"0\"\n [attr.aria-valuemax]=\"scaleMax()\"\n [attr.aria-valuenow]=\"totalValue()\"\n [attr.aria-label]=\"'Meter'\">\n @for (seg of segmentLayouts(); track $index) {\n @if (seg.widthPct > 0) {\n <div\n class=\"h-full min-w-0 transition-all duration-300 ease-out\"\n [class]=\"seg.barClass\"\n [style.width.%]=\"seg.widthPct\"\n [attr.title]=\"seg.label + ': ' + seg.value\"></div>\n }\n }\n </div>\n\n @if (showLabels()) {\n <div class=\"flex flex-wrap gap-x-4 gap-y-1 text-xs\">\n @for (seg of segments(); track $index) {\n <span class=\"inline-flex items-center gap-1.5\">\n <span class=\"inline-block size-2 rounded-sm shrink-0\" [class]=\"legendSwatchClass(seg.variant)\"></span>\n <span class=\"text-neutral-700\">{{ seg.label }}</span>\n <span class=\"text-neutral-500\">({{ seg.value }})</span>\n </span>\n }\n </div>\n }\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
4344
4344
|
}], propDecorators: { segments: [{ type: i0.Input, args: [{ isSignal: true, alias: "segments", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], showLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabels", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
@@ -4618,8 +4618,8 @@ class TailwindSlider extends TailwindComponent {
|
|
|
4618
4618
|
this.onChange(this.singleValue());
|
|
4619
4619
|
}
|
|
4620
4620
|
}
|
|
4621
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4622
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
4621
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindSlider, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4622
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: TailwindSlider, isStandalone: true, selector: "tailwind-slider", inputs: { min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, showTicks: { classPropertyName: "showTicks", publicName: "showTicks", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, hostDisabled: { classPropertyName: "hostDisabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
4623
4623
|
{
|
|
4624
4624
|
provide: NG_VALUE_ACCESSOR,
|
|
4625
4625
|
useExisting: forwardRef(() => TailwindSlider),
|
|
@@ -4627,7 +4627,7 @@ class TailwindSlider extends TailwindComponent {
|
|
|
4627
4627
|
}
|
|
4628
4628
|
], viewQueries: [{ propertyName: "trackRef", first: true, predicate: ["track"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (orientation() === 'horizontal') {\n <div\n #track\n class=\"relative w-full touch-none select-none py-3\"\n [class.opacity-50]=\"isEffectivelyDisabled()\"\n [class.pointer-events-none]=\"isEffectivelyDisabled()\"\n (pointerdown)=\"onTrackPointerDown($event, range() ? null : null)\">\n <div class=\"relative h-6 w-full\">\n <!-- rail -->\n <div\n class=\"pointer-events-none absolute left-0 right-0 top-1/2 -translate-y-1/2 rounded-full bg-neutral-200\"\n [class]=\"trackThickness()\"></div>\n\n @if (showTicks()) {\n @for (p of tickPositions(); track $index) {\n <div\n class=\"pointer-events-none absolute top-1/2 h-2 w-px -translate-x-1/2 -translate-y-1/2 bg-neutral-300\"\n [style.left.%]=\"p\"></div>\n }\n }\n\n <!-- fill -->\n <div\n class=\"pointer-events-none absolute top-1/2 z-1 -translate-y-1/2 rounded-full\"\n [class]=\"trackThickness()\"\n [style.background-color]=\"accentVars().fill\"\n [style.left.%]=\"fillStartPct()\"\n [style.width.%]=\"fillWidthPct()\"></div>\n\n @if (range()) {\n <button\n type=\"button\"\n [disabled]=\"isEffectivelyDisabled()\"\n class=\"tailwind-slider-thumb absolute top-1/2 z-10 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow focus:outline-none\"\n [class]=\"thumbSizeClass()\"\n [style.background-color]=\"accentVars().thumb\"\n [style.--slider-ring]=\"accentVars().ring\"\n [style.left.%]=\"lowPct()\"\n role=\"slider\"\n [attr.aria-valuemin]=\"min()\"\n [attr.aria-valuemax]=\"max()\"\n [attr.aria-valuenow]=\"rangeLow()\"\n [attr.aria-disabled]=\"isEffectivelyDisabled()\"\n (pointerdown)=\"onThumbPointerDown($event, 0)\"\n (keydown)=\"onKeyDown($event, 0)\"></button>\n <button\n type=\"button\"\n [disabled]=\"isEffectivelyDisabled()\"\n class=\"tailwind-slider-thumb absolute top-1/2 z-10 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow focus:outline-none\"\n [class]=\"thumbSizeClass()\"\n [style.background-color]=\"accentVars().thumb\"\n [style.--slider-ring]=\"accentVars().ring\"\n [style.left.%]=\"highPct()\"\n role=\"slider\"\n [attr.aria-valuemin]=\"min()\"\n [attr.aria-valuemax]=\"max()\"\n [attr.aria-valuenow]=\"rangeHigh()\"\n [attr.aria-disabled]=\"isEffectivelyDisabled()\"\n (pointerdown)=\"onThumbPointerDown($event, 1)\"\n (keydown)=\"onKeyDown($event, 1)\"></button>\n } @else {\n <button\n type=\"button\"\n [disabled]=\"isEffectivelyDisabled()\"\n class=\"tailwind-slider-thumb absolute top-1/2 z-10 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow focus:outline-none\"\n [class]=\"thumbSizeClass()\"\n [style.background-color]=\"accentVars().thumb\"\n [style.--slider-ring]=\"accentVars().ring\"\n [style.left.%]=\"singlePct()\"\n role=\"slider\"\n [attr.aria-valuemin]=\"min()\"\n [attr.aria-valuemax]=\"max()\"\n [attr.aria-valuenow]=\"singleValue()\"\n [attr.aria-disabled]=\"isEffectivelyDisabled()\"\n (pointerdown)=\"onThumbPointerDown($event, 0)\"\n (keydown)=\"onKeyDown($event, 0)\"></button>\n }\n </div>\n </div>\n} @else {\n <div\n #track\n class=\"relative mx-auto h-52 w-10 touch-none select-none\"\n [class.opacity-50]=\"isEffectivelyDisabled()\"\n [class.pointer-events-none]=\"isEffectivelyDisabled()\"\n (pointerdown)=\"onTrackPointerDown($event, range() ? null : null)\">\n <div class=\"relative h-full w-full\">\n <div\n class=\"pointer-events-none absolute bottom-0 left-1/2 top-0 -translate-x-1/2 rounded-full bg-neutral-200\"\n [class]=\"verticalTrackThickness()\"></div>\n\n @if (showTicks()) {\n @for (p of tickPositions(); track $index) {\n <div\n class=\"pointer-events-none absolute left-1/2 w-2 h-px -translate-x-1/2 translate-y-1/2 bg-neutral-300\"\n [style.bottom.%]=\"p\"></div>\n }\n }\n\n <div\n class=\"pointer-events-none absolute bottom-0 left-1/2 z-1 -translate-x-1/2 rounded-full\"\n [class]=\"verticalTrackThickness()\"\n [style.background-color]=\"accentVars().fill\"\n [style.bottom.%]=\"fillStartPct()\"\n [style.height.%]=\"fillWidthPct()\"></div>\n\n @if (range()) {\n <button\n type=\"button\"\n [disabled]=\"isEffectivelyDisabled()\"\n class=\"tailwind-slider-thumb absolute left-1/2 z-10 -translate-x-1/2 translate-y-1/2 rounded-full border-2 border-white shadow focus:outline-none\"\n [class]=\"thumbSizeClass()\"\n [style.background-color]=\"accentVars().thumb\"\n [style.--slider-ring]=\"accentVars().ring\"\n [style.bottom.%]=\"lowPct()\"\n role=\"slider\"\n [attr.aria-valuemin]=\"min()\"\n [attr.aria-valuemax]=\"max()\"\n [attr.aria-valuenow]=\"rangeLow()\"\n [attr.aria-disabled]=\"isEffectivelyDisabled()\"\n (pointerdown)=\"onThumbPointerDown($event, 0)\"\n (keydown)=\"onKeyDown($event, 0)\"></button>\n <button\n type=\"button\"\n [disabled]=\"isEffectivelyDisabled()\"\n class=\"tailwind-slider-thumb absolute left-1/2 z-10 -translate-x-1/2 translate-y-1/2 rounded-full border-2 border-white shadow focus:outline-none\"\n [class]=\"thumbSizeClass()\"\n [style.background-color]=\"accentVars().thumb\"\n [style.--slider-ring]=\"accentVars().ring\"\n [style.bottom.%]=\"highPct()\"\n role=\"slider\"\n [attr.aria-valuemin]=\"min()\"\n [attr.aria-valuemax]=\"max()\"\n [attr.aria-valuenow]=\"rangeHigh()\"\n [attr.aria-disabled]=\"isEffectivelyDisabled()\"\n (pointerdown)=\"onThumbPointerDown($event, 1)\"\n (keydown)=\"onKeyDown($event, 1)\"></button>\n } @else {\n <button\n type=\"button\"\n [disabled]=\"isEffectivelyDisabled()\"\n class=\"tailwind-slider-thumb absolute left-1/2 z-10 -translate-x-1/2 translate-y-1/2 rounded-full border-2 border-white shadow focus:outline-none\"\n [class]=\"thumbSizeClass()\"\n [style.background-color]=\"accentVars().thumb\"\n [style.--slider-ring]=\"accentVars().ring\"\n [style.bottom.%]=\"singlePct()\"\n role=\"slider\"\n [attr.aria-valuemin]=\"min()\"\n [attr.aria-valuemax]=\"max()\"\n [attr.aria-valuenow]=\"singleValue()\"\n [attr.aria-disabled]=\"isEffectivelyDisabled()\"\n (pointerdown)=\"onThumbPointerDown($event, 0)\"\n (keydown)=\"onKeyDown($event, 0)\"></button>\n }\n </div>\n </div>\n}\n", styles: [":host{display:block}.tailwind-slider-thumb{cursor:pointer}.tailwind-slider-thumb:focus-visible{outline:2px solid var(--slider-ring);outline-offset:2px}.tailwind-slider-thumb:focus:not(:focus-visible){outline:none}.tailwind-slider-thumb:disabled{cursor:not-allowed}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4629
4629
|
}
|
|
4630
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4630
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TailwindSlider, decorators: [{
|
|
4631
4631
|
type: Component,
|
|
4632
4632
|
args: [{ selector: 'tailwind-slider', providers: [
|
|
4633
4633
|
{
|