@lesterarte/sefin-ui 0.0.68 → 0.0.69
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.
|
@@ -2585,11 +2585,11 @@ class TooltipComponent {
|
|
|
2585
2585
|
.join(' ');
|
|
2586
2586
|
}
|
|
2587
2587
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: TooltipComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2588
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: TooltipComponent, isStandalone: true, selector: "sefin-tooltip", inputs: { text: "text", position: "position", trigger: "trigger", delay: "delay", disabled: "disabled", borderRadius: "borderRadius", class: "class" }, host: { listeners: { "mouseenter": "onMouseEnter($event)", "mouseleave": "onMouseLeave($event)", "click": "onClick($event)", "focus": "onFocus($event)", "blur": "onBlur($event)" } }, viewQueries: [{ propertyName: "tooltipContent", first: true, predicate: ["tooltipContent"], descendants: true }, { propertyName: "tooltipTrigger", first: true, predicate: ["tooltipTrigger"], descendants: true }], ngImport: i0, template: "<div #tooltipTrigger class=\"sefin-tooltip__wrapper\">\n <ng-content></ng-content>\n <div\n #tooltipContent\n [class]=\"tooltipClasses\"\n role=\"tooltip\"\n [attr.aria-hidden]=\"!isVisible\"\n *ngIf=\"text && !disabled\"\n >\n <div class=\"sefin-tooltip__content\">{{ text }}</div>\n <div class=\"sefin-tooltip__arrow\"></div>\n </div>\n</div>\n\n", styles: [".sefin-tooltip__wrapper{display:block;width:100%;position:relative;box-sizing:border-box}.sefin-tooltip{position:absolute;z-index:
|
|
2588
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: TooltipComponent, isStandalone: true, selector: "sefin-tooltip", inputs: { text: "text", position: "position", trigger: "trigger", delay: "delay", disabled: "disabled", borderRadius: "borderRadius", class: "class" }, host: { listeners: { "mouseenter": "onMouseEnter($event)", "mouseleave": "onMouseLeave($event)", "click": "onClick($event)", "focus": "onFocus($event)", "blur": "onBlur($event)" } }, viewQueries: [{ propertyName: "tooltipContent", first: true, predicate: ["tooltipContent"], descendants: true }, { propertyName: "tooltipTrigger", first: true, predicate: ["tooltipTrigger"], descendants: true }], ngImport: i0, template: "<div #tooltipTrigger class=\"sefin-tooltip__wrapper\">\n <ng-content></ng-content>\n <div\n #tooltipContent\n [class]=\"tooltipClasses\"\n role=\"tooltip\"\n [attr.aria-hidden]=\"!isVisible\"\n *ngIf=\"text && !disabled\"\n >\n <div class=\"sefin-tooltip__content\">{{ text }}</div>\n <div class=\"sefin-tooltip__arrow\"></div>\n </div>\n</div>\n\n", styles: [".sefin-tooltip__wrapper{display:block;width:100%;position:relative;box-sizing:border-box}.sefin-tooltip{position:absolute;z-index:var(--sefin-z-index-tooltip, 10001);pointer-events:none;opacity:0;transform:scale(.95);transition:opacity .2s ease-in-out,transform .2s ease-in-out;white-space:nowrap}.sefin-tooltip--visible{opacity:1;transform:scale(1);pointer-events:auto}.sefin-tooltip__content{background-color:var(--sefin-color-surface-inverse, #333);color:var(--sefin-color-text-inverse, #ffffff);font-family:var(--sefin-font-family-base, sans-serif);font-size:var(--sefin-font-size-sm, 12px);font-weight:var(--sefin-font-weight-normal, 400);line-height:var(--sefin-line-height-normal, 1.5);padding:var(--sefin-spacing-xs, 6px) var(--sefin-spacing-sm, 10px);border-radius:var(--sefin-radius-md);box-shadow:var(--sefin-shadow-md, 0 4px 6px rgba(0, 0, 0, .1));max-width:200px;white-space:normal;word-wrap:break-word;box-sizing:border-box}.sefin-tooltip--radius-none .sefin-tooltip__content{border-radius:var(--sefin-radius-none)}.sefin-tooltip--radius-sm .sefin-tooltip__content{border-radius:var(--sefin-radius-sm)}.sefin-tooltip--radius-md .sefin-tooltip__content{border-radius:var(--sefin-radius-md)}.sefin-tooltip--radius-lg .sefin-tooltip__content{border-radius:var(--sefin-radius-lg)}.sefin-tooltip--radius-xl .sefin-tooltip__content{border-radius:var(--sefin-radius-xl)}.sefin-tooltip--radius-2xl .sefin-tooltip__content{border-radius:var(--sefin-radius-2xl)}.sefin-tooltip--radius-full .sefin-tooltip__content{border-radius:var(--sefin-radius-full)}.sefin-tooltip__arrow{position:absolute;width:0;height:0;border-style:solid}.sefin-tooltip--top{bottom:calc(100% + 8px);left:50%;transform:translate(-50%) scale(.95)}.sefin-tooltip--top.sefin-tooltip--visible{transform:translate(-50%) scale(1)}.sefin-tooltip--top .sefin-tooltip__arrow{top:100%;left:50%;transform:translate(-50%);border-width:6px 6px 0 6px;border-color:var(--sefin-color-surface-inverse, #333) transparent transparent transparent}.sefin-tooltip--bottom{top:calc(100% + 8px);left:50%;transform:translate(-50%) scale(.95)}.sefin-tooltip--bottom.sefin-tooltip--visible{transform:translate(-50%) scale(1)}.sefin-tooltip--bottom .sefin-tooltip__arrow{bottom:100%;left:50%;transform:translate(-50%);border-width:0 6px 6px 6px;border-color:transparent transparent var(--sefin-color-surface-inverse, #333) transparent}.sefin-tooltip--left{right:calc(100% + 8px);top:50%;transform:translateY(-50%) scale(.95)}.sefin-tooltip--left.sefin-tooltip--visible{transform:translateY(-50%) scale(1)}.sefin-tooltip--left .sefin-tooltip__arrow{left:100%;top:50%;transform:translateY(-50%);border-width:6px 0 6px 6px;border-color:transparent transparent transparent var(--sefin-color-surface-inverse, #333)}.sefin-tooltip--right{left:calc(100% + 8px);top:50%;transform:translateY(-50%) scale(.95)}.sefin-tooltip--right.sefin-tooltip--visible{transform:translateY(-50%) scale(1)}.sefin-tooltip--right .sefin-tooltip__arrow{right:100%;top:50%;transform:translateY(-50%);border-width:6px 6px 6px 0;border-color:transparent var(--sefin-color-surface-inverse, #333) transparent transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2589
2589
|
}
|
|
2590
2590
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: TooltipComponent, decorators: [{
|
|
2591
2591
|
type: Component,
|
|
2592
|
-
args: [{ selector: 'sefin-tooltip', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #tooltipTrigger class=\"sefin-tooltip__wrapper\">\n <ng-content></ng-content>\n <div\n #tooltipContent\n [class]=\"tooltipClasses\"\n role=\"tooltip\"\n [attr.aria-hidden]=\"!isVisible\"\n *ngIf=\"text && !disabled\"\n >\n <div class=\"sefin-tooltip__content\">{{ text }}</div>\n <div class=\"sefin-tooltip__arrow\"></div>\n </div>\n</div>\n\n", styles: [".sefin-tooltip__wrapper{display:block;width:100%;position:relative;box-sizing:border-box}.sefin-tooltip{position:absolute;z-index:
|
|
2592
|
+
args: [{ selector: 'sefin-tooltip', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #tooltipTrigger class=\"sefin-tooltip__wrapper\">\n <ng-content></ng-content>\n <div\n #tooltipContent\n [class]=\"tooltipClasses\"\n role=\"tooltip\"\n [attr.aria-hidden]=\"!isVisible\"\n *ngIf=\"text && !disabled\"\n >\n <div class=\"sefin-tooltip__content\">{{ text }}</div>\n <div class=\"sefin-tooltip__arrow\"></div>\n </div>\n</div>\n\n", styles: [".sefin-tooltip__wrapper{display:block;width:100%;position:relative;box-sizing:border-box}.sefin-tooltip{position:absolute;z-index:var(--sefin-z-index-tooltip, 10001);pointer-events:none;opacity:0;transform:scale(.95);transition:opacity .2s ease-in-out,transform .2s ease-in-out;white-space:nowrap}.sefin-tooltip--visible{opacity:1;transform:scale(1);pointer-events:auto}.sefin-tooltip__content{background-color:var(--sefin-color-surface-inverse, #333);color:var(--sefin-color-text-inverse, #ffffff);font-family:var(--sefin-font-family-base, sans-serif);font-size:var(--sefin-font-size-sm, 12px);font-weight:var(--sefin-font-weight-normal, 400);line-height:var(--sefin-line-height-normal, 1.5);padding:var(--sefin-spacing-xs, 6px) var(--sefin-spacing-sm, 10px);border-radius:var(--sefin-radius-md);box-shadow:var(--sefin-shadow-md, 0 4px 6px rgba(0, 0, 0, .1));max-width:200px;white-space:normal;word-wrap:break-word;box-sizing:border-box}.sefin-tooltip--radius-none .sefin-tooltip__content{border-radius:var(--sefin-radius-none)}.sefin-tooltip--radius-sm .sefin-tooltip__content{border-radius:var(--sefin-radius-sm)}.sefin-tooltip--radius-md .sefin-tooltip__content{border-radius:var(--sefin-radius-md)}.sefin-tooltip--radius-lg .sefin-tooltip__content{border-radius:var(--sefin-radius-lg)}.sefin-tooltip--radius-xl .sefin-tooltip__content{border-radius:var(--sefin-radius-xl)}.sefin-tooltip--radius-2xl .sefin-tooltip__content{border-radius:var(--sefin-radius-2xl)}.sefin-tooltip--radius-full .sefin-tooltip__content{border-radius:var(--sefin-radius-full)}.sefin-tooltip__arrow{position:absolute;width:0;height:0;border-style:solid}.sefin-tooltip--top{bottom:calc(100% + 8px);left:50%;transform:translate(-50%) scale(.95)}.sefin-tooltip--top.sefin-tooltip--visible{transform:translate(-50%) scale(1)}.sefin-tooltip--top .sefin-tooltip__arrow{top:100%;left:50%;transform:translate(-50%);border-width:6px 6px 0 6px;border-color:var(--sefin-color-surface-inverse, #333) transparent transparent transparent}.sefin-tooltip--bottom{top:calc(100% + 8px);left:50%;transform:translate(-50%) scale(.95)}.sefin-tooltip--bottom.sefin-tooltip--visible{transform:translate(-50%) scale(1)}.sefin-tooltip--bottom .sefin-tooltip__arrow{bottom:100%;left:50%;transform:translate(-50%);border-width:0 6px 6px 6px;border-color:transparent transparent var(--sefin-color-surface-inverse, #333) transparent}.sefin-tooltip--left{right:calc(100% + 8px);top:50%;transform:translateY(-50%) scale(.95)}.sefin-tooltip--left.sefin-tooltip--visible{transform:translateY(-50%) scale(1)}.sefin-tooltip--left .sefin-tooltip__arrow{left:100%;top:50%;transform:translateY(-50%);border-width:6px 0 6px 6px;border-color:transparent transparent transparent var(--sefin-color-surface-inverse, #333)}.sefin-tooltip--right{left:calc(100% + 8px);top:50%;transform:translateY(-50%) scale(.95)}.sefin-tooltip--right.sefin-tooltip--visible{transform:translateY(-50%) scale(1)}.sefin-tooltip--right .sefin-tooltip__arrow{right:100%;top:50%;transform:translateY(-50%);border-width:6px 6px 6px 0;border-color:transparent var(--sefin-color-surface-inverse, #333) transparent transparent}\n"] }]
|
|
2593
2593
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { text: [{
|
|
2594
2594
|
type: Input
|
|
2595
2595
|
}], position: [{
|
|
@@ -2687,11 +2687,11 @@ class AlertComponent {
|
|
|
2687
2687
|
return '#ffffff';
|
|
2688
2688
|
}
|
|
2689
2689
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: AlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2690
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: AlertComponent, isStandalone: true, selector: "sefin-alert", inputs: { variant: "variant", size: "size", title: "title", dismissible: "dismissible", showIcon: "showIcon", visible: "visible", borderRadius: "borderRadius", class: "class" }, outputs: { dismissed: "dismissed" }, ngImport: i0, template: "<div\n *ngIf=\"visible\"\n [class]=\"alertClasses\"\n role=\"alert\"\n [attr.aria-live]=\"variant === 'error' ? 'assertive' : 'polite'\"\n>\n <div class=\"sefin-alert__content\">\n <div *ngIf=\"showIcon\" class=\"sefin-alert__icon\" [attr.aria-hidden]=\"true\">\n <sefin-icon [name]=\"iconName\" [size]=\"iconSize\" [color]=\"iconColor\"></sefin-icon>\n </div>\n <div class=\"sefin-alert__body\">\n <div *ngIf=\"title\" class=\"sefin-alert__title\">{{ title }}</div>\n <div class=\"sefin-alert__message\">\n <ng-content></ng-content>\n </div>\n </div>\n <button\n *ngIf=\"dismissible\"\n type=\"button\"\n class=\"sefin-alert__close\"\n (click)=\"onDismiss()\"\n aria-label=\"Close alert\"\n >\n <span aria-hidden=\"true\">\u00D7</span>\n </button>\n </div>\n</div>\n\n", styles: [".sefin-alert{display:flex;width:100%;box-sizing:border-box;border-radius:var(--sefin-radius-md);border:1px solid transparent}.sefin-alert--radius-none{border-radius:var(--sefin-radius-none)}.sefin-alert--radius-sm{border-radius:var(--sefin-radius-sm)}.sefin-alert--radius-md{border-radius:var(--sefin-radius-md)}.sefin-alert--radius-lg{border-radius:var(--sefin-radius-lg)}.sefin-alert--radius-xl{border-radius:var(--sefin-radius-xl)}.sefin-alert--radius-2xl{border-radius:var(--sefin-radius-2xl)}.sefin-alert--radius-full{border-radius:var(--sefin-radius-full)}.sefin-alert{font-family:var(--sefin-font-family-base, sans-serif);transition:opacity .2s ease-in-out,transform .2s ease-in-out}.sefin-alert--hidden{display:none}.sefin-alert--sm{padding:var(--sefin-spacing-sm, 8px) var(--sefin-spacing-md, 12px);font-size:var(--sefin-font-size-sm, 12px)}.sefin-alert--sm .sefin-alert__icon{width:20px;height:20px;min-width:20px;min-height:20px}.sefin-alert--sm .sefin-alert__icon sefin-icon{width:12px;height:12px}.sefin-alert--sm .sefin-alert__title{font-size:var(--sefin-font-size-sm, 12px);margin-bottom:var(--sefin-spacing-xs, 4px)}.sefin-alert--md{padding:var(--sefin-spacing-md, 12px) var(--sefin-spacing-lg, 16px);font-size:var(--sefin-font-size-base, 14px)}.sefin-alert--md .sefin-alert__icon{width:24px;height:24px;min-width:24px;min-height:24px}.sefin-alert--md .sefin-alert__icon sefin-icon{width:16px;height:16px}.sefin-alert--md .sefin-alert__title{font-size:var(--sefin-font-size-base, 14px);margin-bottom:var(--sefin-spacing-xs, 4px)}.sefin-alert--lg{padding:var(--sefin-spacing-lg, 16px) var(--sefin-spacing-xl, 20px);font-size:var(--sefin-font-size-lg, 16px)}.sefin-alert--lg .sefin-alert__icon{width:28px;height:28px;min-width:28px;min-height:28px}.sefin-alert--lg .sefin-alert__icon sefin-icon{width:20px;height:20px}.sefin-alert--lg .sefin-alert__title{font-size:var(--sefin-font-size-lg, 16px);margin-bottom:var(--sefin-spacing-sm, 8px)}.sefin-alert__content{display:flex;align-items:flex-start;width:100%;gap:var(--sefin-spacing-sm, 8px)}.sefin-alert__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;box-sizing:border-box;position:relative}.sefin-alert__icon sefin-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;margin:auto}.sefin-alert__body{flex:1;min-width:0}.sefin-alert__title{font-weight:var(--sefin-font-weight-semibold, 600);line-height:var(--sefin-line-height-tight, 1.4);margin:0}.sefin-alert__message{line-height:var(--sefin-line-height-normal, 1.5);margin:0}.sefin-alert__close{flex-shrink:0;background:none;border:none;padding:0;margin:0;cursor:pointer;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:var(--sefin-radius-sm);font-size:20px;line-height:1;opacity:.7;transition:opacity .2s ease-in-out,background-color .2s ease-in-out}.sefin-alert__close:hover{opacity:1;background-color:#0000000d}.sefin-alert__close:focus-visible{outline:2px solid currentColor;outline-offset:2px}.sefin-alert__close span{display:block;line-height:1}.sefin-alert--success{background-color:var(--sefin-color-success-light, #e8f5e9);border-color:var(--sefin-color-success, #4caf50);color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success{background-color:#4caf5026;border-color:var(--sefin-color-success, #4caf50);color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__icon{background-color:var(--sefin-color-success, #4caf50);color:#fff}.sefin-alert--success .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--success .sefin-alert__title{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__message{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__close{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--success .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--warning{background-color:var(--sefin-color-warning-light, #fff3e0);border-color:var(--sefin-color-warning, #ff9800);color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning{background-color:#ff980026;border-color:var(--sefin-color-warning, #ff9800);color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__icon{background-color:var(--sefin-color-warning, #ff9800);color:#fff}.sefin-alert--warning .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--warning .sefin-alert__title{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__message{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__close{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--warning .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--error{background-color:var(--sefin-color-error-light, #ffebee);border-color:var(--sefin-color-error, #f44336);color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error{background-color:#f4433626;border-color:var(--sefin-color-error, #f44336);color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__icon{background-color:var(--sefin-color-error, #f44336);color:#fff}.sefin-alert--error .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--error .sefin-alert__title{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__message{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__close{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--error .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--info{background-color:var(--sefin-color-primary-light, #e3f2fd);border-color:var(--sefin-color-primary, #1976d2);color:var(--sefin-color-text, #1a1a1a)}[data-theme=dark] .sefin-alert--info{background-color:#55c3d826;border-color:var(--sefin-color-primary, #55C3D8);color:var(--sefin-color-text, #ffffff)}.sefin-alert--info .sefin-alert__icon{background-color:var(--sefin-color-primary, #1976d2);color:#fff;border:none}[data-theme=dark] .sefin-alert--info .sefin-alert__icon{background-color:var(--sefin-color-primary, #55C3D8)}.sefin-alert--info .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--info .sefin-alert__title{color:var(--sefin-color-text, #1a1a1a);font-weight:var(--sefin-font-weight-semibold, 600)}[data-theme=dark] .sefin-alert--info .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--info .sefin-alert__message{color:var(--sefin-color-text, #1a1a1a)}[data-theme=dark] .sefin-alert--info .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--info .sefin-alert__close{color:var(--sefin-color-text, #1a1a1a)}[data-theme=dark] .sefin-alert--info .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--info .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--info .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--default{background-color:var(--sefin-color-surface-hover, #f5f5f5);border-color:var(--sefin-color-border, #e0e0e0);color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default{background-color:var(--sefin-color-surface-hover, #4f4f4f);border-color:var(--sefin-color-border, #686868);color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__icon{background-color:var(--sefin-color-text-secondary, #666);color:#fff}.sefin-alert--default .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--default .sefin-alert__title{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__message{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__close{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--default .sefin-alert__close:hover{background-color:#ffffff1a}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "sefin-icon", inputs: ["name", "size", "color", "rotate", "flipH", "flipV", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2690
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: AlertComponent, isStandalone: true, selector: "sefin-alert", inputs: { variant: "variant", size: "size", title: "title", dismissible: "dismissible", showIcon: "showIcon", visible: "visible", borderRadius: "borderRadius", class: "class" }, outputs: { dismissed: "dismissed" }, ngImport: i0, template: "<div\n *ngIf=\"visible\"\n [class]=\"alertClasses\"\n role=\"alert\"\n [attr.aria-live]=\"variant === 'error' ? 'assertive' : 'polite'\"\n>\n <div class=\"sefin-alert__content\">\n <div *ngIf=\"showIcon\" class=\"sefin-alert__icon\" [attr.aria-hidden]=\"true\">\n <sefin-icon [name]=\"iconName\" [size]=\"iconSize\" [color]=\"iconColor\"></sefin-icon>\n </div>\n <div class=\"sefin-alert__body\">\n <div *ngIf=\"title\" class=\"sefin-alert__title\">{{ title }}</div>\n <div class=\"sefin-alert__message\">\n <ng-content></ng-content>\n </div>\n </div>\n <button\n *ngIf=\"dismissible\"\n type=\"button\"\n class=\"sefin-alert__close\"\n (click)=\"onDismiss()\"\n aria-label=\"Close alert\"\n >\n <span aria-hidden=\"true\">\u00D7</span>\n </button>\n </div>\n</div>\n\n", styles: [".sefin-alert{display:flex;width:100%;box-sizing:border-box;border-radius:var(--sefin-radius-md);border:1px solid transparent}.sefin-alert--radius-none{border-radius:var(--sefin-radius-none)}.sefin-alert--radius-sm{border-radius:var(--sefin-radius-sm)}.sefin-alert--radius-md{border-radius:var(--sefin-radius-md)}.sefin-alert--radius-lg{border-radius:var(--sefin-radius-lg)}.sefin-alert--radius-xl{border-radius:var(--sefin-radius-xl)}.sefin-alert--radius-2xl{border-radius:var(--sefin-radius-2xl)}.sefin-alert--radius-full{border-radius:var(--sefin-radius-full)}.sefin-alert{font-family:var(--sefin-font-family-base, sans-serif);transition:opacity .2s ease-in-out,transform .2s ease-in-out}.sefin-alert--hidden{display:none}.sefin-alert--sm{padding:var(--sefin-spacing-sm, 8px) var(--sefin-spacing-md, 12px);font-size:var(--sefin-font-size-sm, 12px)}.sefin-alert--sm .sefin-alert__icon{width:20px;height:20px;min-width:20px;min-height:20px}.sefin-alert--sm .sefin-alert__icon sefin-icon{width:12px;height:12px}.sefin-alert--sm .sefin-alert__title{font-size:var(--sefin-font-size-sm, 12px);margin-bottom:var(--sefin-spacing-xs, 4px)}.sefin-alert--md{padding:var(--sefin-spacing-md, 12px) var(--sefin-spacing-lg, 16px);font-size:var(--sefin-font-size-base, 14px)}.sefin-alert--md .sefin-alert__icon{width:24px;height:24px;min-width:24px;min-height:24px}.sefin-alert--md .sefin-alert__icon sefin-icon{width:16px;height:16px}.sefin-alert--md .sefin-alert__title{font-size:var(--sefin-font-size-base, 14px);margin-bottom:var(--sefin-spacing-xs, 4px)}.sefin-alert--lg{padding:var(--sefin-spacing-lg, 16px) var(--sefin-spacing-xl, 20px);font-size:var(--sefin-font-size-lg, 16px)}.sefin-alert--lg .sefin-alert__icon{width:28px;height:28px;min-width:28px;min-height:28px}.sefin-alert--lg .sefin-alert__icon sefin-icon{width:20px;height:20px}.sefin-alert--lg .sefin-alert__title{font-size:var(--sefin-font-size-lg, 16px);margin-bottom:var(--sefin-spacing-sm, 8px)}.sefin-alert__content{display:flex;align-items:flex-start;width:100%;gap:var(--sefin-spacing-sm, 8px)}.sefin-alert__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;box-sizing:border-box;position:relative}.sefin-alert__icon sefin-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;margin:auto}.sefin-alert__body{flex:1;min-width:0}.sefin-alert__title{font-weight:var(--sefin-font-weight-semibold, 600);line-height:var(--sefin-line-height-tight, 1.4);margin:0}.sefin-alert__message{line-height:var(--sefin-line-height-normal, 1.5);margin:0}.sefin-alert__close{flex-shrink:0;background:none;border:none;padding:0;margin:0;cursor:pointer;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:var(--sefin-radius-sm);font-size:20px;line-height:1;opacity:.7;transition:opacity .2s ease-in-out,background-color .2s ease-in-out}.sefin-alert__close:hover{opacity:1;background-color:#0000000d}.sefin-alert__close:focus-visible{outline:2px solid currentColor;outline-offset:2px}.sefin-alert__close span{display:block;line-height:1}.sefin-alert--success{background-color:var(--sefin-color-success-light, #e8f5e9);border-color:var(--sefin-color-success, #4caf50);color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success{background-color:#4caf5026;border-color:var(--sefin-color-success, #4caf50);color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__icon{background-color:var(--sefin-color-success, #4caf50);color:#fff}.sefin-alert--success .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--success .sefin-alert__title{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__message{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__close{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--success .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--warning{background-color:var(--sefin-color-warning-light, #fff3e0);border-color:var(--sefin-color-warning, #ff9800);color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning{background-color:#ff980026;border-color:var(--sefin-color-warning, #ff9800);color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__icon{background-color:var(--sefin-color-warning, #ff9800);color:#fff}.sefin-alert--warning .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--warning .sefin-alert__title{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__message{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__close{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--warning .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--error{background-color:var(--sefin-color-error-light, #ffebee);border-color:var(--sefin-color-error, #f44336);color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error{background-color:#f4433626;border-color:var(--sefin-color-error, #f44336);color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__icon{background-color:var(--sefin-color-error, #f44336);color:#fff}.sefin-alert--error .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--error .sefin-alert__title{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__message{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__close{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--error .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--info{background-color:var(--sefin-color-primary, #1976d2);border-color:var(--sefin-color-primary, #1976d2);color:var(--sefin-color-text-inverse, #ffffff)}[data-theme=dark] .sefin-alert--info{background-color:var(--sefin-color-primary, #55C3D8);border-color:var(--sefin-color-primary, #55C3D8);color:var(--sefin-color-text-inverse, #ffffff)}.sefin-alert--info .sefin-alert__icon{background-color:#fff3;color:var(--sefin-color-text-inverse, #ffffff);border:none}[data-theme=dark] .sefin-alert--info .sefin-alert__icon{background-color:#fff3}.sefin-alert--info .sefin-alert__icon sefin-icon{color:var(--sefin-color-text-inverse, #ffffff)}.sefin-alert--info .sefin-alert__title{color:var(--sefin-color-text-inverse, #ffffff);font-weight:var(--sefin-font-weight-semibold, 600)}[data-theme=dark] .sefin-alert--info .sefin-alert__title,.sefin-alert--info .sefin-alert__message,[data-theme=dark] .sefin-alert--info .sefin-alert__message,.sefin-alert--info .sefin-alert__close,[data-theme=dark] .sefin-alert--info .sefin-alert__close{color:var(--sefin-color-text-inverse, #ffffff)}.sefin-alert--info .sefin-alert__close:hover,[data-theme=dark] .sefin-alert--info .sefin-alert__close:hover{background-color:#ffffff26}.sefin-alert--default{background-color:var(--sefin-color-surface-hover, #f5f5f5);border-color:var(--sefin-color-border, #e0e0e0);color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default{background-color:var(--sefin-color-surface-hover, #4f4f4f);border-color:var(--sefin-color-border, #686868);color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__icon{background-color:var(--sefin-color-text-secondary, #666);color:#fff}.sefin-alert--default .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--default .sefin-alert__title{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__message{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__close{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--default .sefin-alert__close:hover{background-color:#ffffff1a}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "sefin-icon", inputs: ["name", "size", "color", "rotate", "flipH", "flipV", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2691
2691
|
}
|
|
2692
2692
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: AlertComponent, decorators: [{
|
|
2693
2693
|
type: Component,
|
|
2694
|
-
args: [{ selector: 'sefin-alert', standalone: true, imports: [CommonModule, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"visible\"\n [class]=\"alertClasses\"\n role=\"alert\"\n [attr.aria-live]=\"variant === 'error' ? 'assertive' : 'polite'\"\n>\n <div class=\"sefin-alert__content\">\n <div *ngIf=\"showIcon\" class=\"sefin-alert__icon\" [attr.aria-hidden]=\"true\">\n <sefin-icon [name]=\"iconName\" [size]=\"iconSize\" [color]=\"iconColor\"></sefin-icon>\n </div>\n <div class=\"sefin-alert__body\">\n <div *ngIf=\"title\" class=\"sefin-alert__title\">{{ title }}</div>\n <div class=\"sefin-alert__message\">\n <ng-content></ng-content>\n </div>\n </div>\n <button\n *ngIf=\"dismissible\"\n type=\"button\"\n class=\"sefin-alert__close\"\n (click)=\"onDismiss()\"\n aria-label=\"Close alert\"\n >\n <span aria-hidden=\"true\">\u00D7</span>\n </button>\n </div>\n</div>\n\n", styles: [".sefin-alert{display:flex;width:100%;box-sizing:border-box;border-radius:var(--sefin-radius-md);border:1px solid transparent}.sefin-alert--radius-none{border-radius:var(--sefin-radius-none)}.sefin-alert--radius-sm{border-radius:var(--sefin-radius-sm)}.sefin-alert--radius-md{border-radius:var(--sefin-radius-md)}.sefin-alert--radius-lg{border-radius:var(--sefin-radius-lg)}.sefin-alert--radius-xl{border-radius:var(--sefin-radius-xl)}.sefin-alert--radius-2xl{border-radius:var(--sefin-radius-2xl)}.sefin-alert--radius-full{border-radius:var(--sefin-radius-full)}.sefin-alert{font-family:var(--sefin-font-family-base, sans-serif);transition:opacity .2s ease-in-out,transform .2s ease-in-out}.sefin-alert--hidden{display:none}.sefin-alert--sm{padding:var(--sefin-spacing-sm, 8px) var(--sefin-spacing-md, 12px);font-size:var(--sefin-font-size-sm, 12px)}.sefin-alert--sm .sefin-alert__icon{width:20px;height:20px;min-width:20px;min-height:20px}.sefin-alert--sm .sefin-alert__icon sefin-icon{width:12px;height:12px}.sefin-alert--sm .sefin-alert__title{font-size:var(--sefin-font-size-sm, 12px);margin-bottom:var(--sefin-spacing-xs, 4px)}.sefin-alert--md{padding:var(--sefin-spacing-md, 12px) var(--sefin-spacing-lg, 16px);font-size:var(--sefin-font-size-base, 14px)}.sefin-alert--md .sefin-alert__icon{width:24px;height:24px;min-width:24px;min-height:24px}.sefin-alert--md .sefin-alert__icon sefin-icon{width:16px;height:16px}.sefin-alert--md .sefin-alert__title{font-size:var(--sefin-font-size-base, 14px);margin-bottom:var(--sefin-spacing-xs, 4px)}.sefin-alert--lg{padding:var(--sefin-spacing-lg, 16px) var(--sefin-spacing-xl, 20px);font-size:var(--sefin-font-size-lg, 16px)}.sefin-alert--lg .sefin-alert__icon{width:28px;height:28px;min-width:28px;min-height:28px}.sefin-alert--lg .sefin-alert__icon sefin-icon{width:20px;height:20px}.sefin-alert--lg .sefin-alert__title{font-size:var(--sefin-font-size-lg, 16px);margin-bottom:var(--sefin-spacing-sm, 8px)}.sefin-alert__content{display:flex;align-items:flex-start;width:100%;gap:var(--sefin-spacing-sm, 8px)}.sefin-alert__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;box-sizing:border-box;position:relative}.sefin-alert__icon sefin-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;margin:auto}.sefin-alert__body{flex:1;min-width:0}.sefin-alert__title{font-weight:var(--sefin-font-weight-semibold, 600);line-height:var(--sefin-line-height-tight, 1.4);margin:0}.sefin-alert__message{line-height:var(--sefin-line-height-normal, 1.5);margin:0}.sefin-alert__close{flex-shrink:0;background:none;border:none;padding:0;margin:0;cursor:pointer;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:var(--sefin-radius-sm);font-size:20px;line-height:1;opacity:.7;transition:opacity .2s ease-in-out,background-color .2s ease-in-out}.sefin-alert__close:hover{opacity:1;background-color:#0000000d}.sefin-alert__close:focus-visible{outline:2px solid currentColor;outline-offset:2px}.sefin-alert__close span{display:block;line-height:1}.sefin-alert--success{background-color:var(--sefin-color-success-light, #e8f5e9);border-color:var(--sefin-color-success, #4caf50);color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success{background-color:#4caf5026;border-color:var(--sefin-color-success, #4caf50);color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__icon{background-color:var(--sefin-color-success, #4caf50);color:#fff}.sefin-alert--success .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--success .sefin-alert__title{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__message{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__close{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--success .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--warning{background-color:var(--sefin-color-warning-light, #fff3e0);border-color:var(--sefin-color-warning, #ff9800);color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning{background-color:#ff980026;border-color:var(--sefin-color-warning, #ff9800);color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__icon{background-color:var(--sefin-color-warning, #ff9800);color:#fff}.sefin-alert--warning .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--warning .sefin-alert__title{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__message{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__close{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--warning .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--error{background-color:var(--sefin-color-error-light, #ffebee);border-color:var(--sefin-color-error, #f44336);color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error{background-color:#f4433626;border-color:var(--sefin-color-error, #f44336);color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__icon{background-color:var(--sefin-color-error, #f44336);color:#fff}.sefin-alert--error .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--error .sefin-alert__title{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__message{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__close{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--error .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--info{background-color:var(--sefin-color-primary-light, #e3f2fd);border-color:var(--sefin-color-primary, #1976d2);color:var(--sefin-color-text, #1a1a1a)}[data-theme=dark] .sefin-alert--info{background-color:#55c3d826;border-color:var(--sefin-color-primary, #55C3D8);color:var(--sefin-color-text, #ffffff)}.sefin-alert--info .sefin-alert__icon{background-color:var(--sefin-color-primary, #1976d2);color:#fff;border:none}[data-theme=dark] .sefin-alert--info .sefin-alert__icon{background-color:var(--sefin-color-primary, #55C3D8)}.sefin-alert--info .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--info .sefin-alert__title{color:var(--sefin-color-text, #1a1a1a);font-weight:var(--sefin-font-weight-semibold, 600)}[data-theme=dark] .sefin-alert--info .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--info .sefin-alert__message{color:var(--sefin-color-text, #1a1a1a)}[data-theme=dark] .sefin-alert--info .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--info .sefin-alert__close{color:var(--sefin-color-text, #1a1a1a)}[data-theme=dark] .sefin-alert--info .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--info .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--info .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--default{background-color:var(--sefin-color-surface-hover, #f5f5f5);border-color:var(--sefin-color-border, #e0e0e0);color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default{background-color:var(--sefin-color-surface-hover, #4f4f4f);border-color:var(--sefin-color-border, #686868);color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__icon{background-color:var(--sefin-color-text-secondary, #666);color:#fff}.sefin-alert--default .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--default .sefin-alert__title{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__message{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__close{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--default .sefin-alert__close:hover{background-color:#ffffff1a}\n"] }]
|
|
2694
|
+
args: [{ selector: 'sefin-alert', standalone: true, imports: [CommonModule, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"visible\"\n [class]=\"alertClasses\"\n role=\"alert\"\n [attr.aria-live]=\"variant === 'error' ? 'assertive' : 'polite'\"\n>\n <div class=\"sefin-alert__content\">\n <div *ngIf=\"showIcon\" class=\"sefin-alert__icon\" [attr.aria-hidden]=\"true\">\n <sefin-icon [name]=\"iconName\" [size]=\"iconSize\" [color]=\"iconColor\"></sefin-icon>\n </div>\n <div class=\"sefin-alert__body\">\n <div *ngIf=\"title\" class=\"sefin-alert__title\">{{ title }}</div>\n <div class=\"sefin-alert__message\">\n <ng-content></ng-content>\n </div>\n </div>\n <button\n *ngIf=\"dismissible\"\n type=\"button\"\n class=\"sefin-alert__close\"\n (click)=\"onDismiss()\"\n aria-label=\"Close alert\"\n >\n <span aria-hidden=\"true\">\u00D7</span>\n </button>\n </div>\n</div>\n\n", styles: [".sefin-alert{display:flex;width:100%;box-sizing:border-box;border-radius:var(--sefin-radius-md);border:1px solid transparent}.sefin-alert--radius-none{border-radius:var(--sefin-radius-none)}.sefin-alert--radius-sm{border-radius:var(--sefin-radius-sm)}.sefin-alert--radius-md{border-radius:var(--sefin-radius-md)}.sefin-alert--radius-lg{border-radius:var(--sefin-radius-lg)}.sefin-alert--radius-xl{border-radius:var(--sefin-radius-xl)}.sefin-alert--radius-2xl{border-radius:var(--sefin-radius-2xl)}.sefin-alert--radius-full{border-radius:var(--sefin-radius-full)}.sefin-alert{font-family:var(--sefin-font-family-base, sans-serif);transition:opacity .2s ease-in-out,transform .2s ease-in-out}.sefin-alert--hidden{display:none}.sefin-alert--sm{padding:var(--sefin-spacing-sm, 8px) var(--sefin-spacing-md, 12px);font-size:var(--sefin-font-size-sm, 12px)}.sefin-alert--sm .sefin-alert__icon{width:20px;height:20px;min-width:20px;min-height:20px}.sefin-alert--sm .sefin-alert__icon sefin-icon{width:12px;height:12px}.sefin-alert--sm .sefin-alert__title{font-size:var(--sefin-font-size-sm, 12px);margin-bottom:var(--sefin-spacing-xs, 4px)}.sefin-alert--md{padding:var(--sefin-spacing-md, 12px) var(--sefin-spacing-lg, 16px);font-size:var(--sefin-font-size-base, 14px)}.sefin-alert--md .sefin-alert__icon{width:24px;height:24px;min-width:24px;min-height:24px}.sefin-alert--md .sefin-alert__icon sefin-icon{width:16px;height:16px}.sefin-alert--md .sefin-alert__title{font-size:var(--sefin-font-size-base, 14px);margin-bottom:var(--sefin-spacing-xs, 4px)}.sefin-alert--lg{padding:var(--sefin-spacing-lg, 16px) var(--sefin-spacing-xl, 20px);font-size:var(--sefin-font-size-lg, 16px)}.sefin-alert--lg .sefin-alert__icon{width:28px;height:28px;min-width:28px;min-height:28px}.sefin-alert--lg .sefin-alert__icon sefin-icon{width:20px;height:20px}.sefin-alert--lg .sefin-alert__title{font-size:var(--sefin-font-size-lg, 16px);margin-bottom:var(--sefin-spacing-sm, 8px)}.sefin-alert__content{display:flex;align-items:flex-start;width:100%;gap:var(--sefin-spacing-sm, 8px)}.sefin-alert__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;box-sizing:border-box;position:relative}.sefin-alert__icon sefin-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;margin:auto}.sefin-alert__body{flex:1;min-width:0}.sefin-alert__title{font-weight:var(--sefin-font-weight-semibold, 600);line-height:var(--sefin-line-height-tight, 1.4);margin:0}.sefin-alert__message{line-height:var(--sefin-line-height-normal, 1.5);margin:0}.sefin-alert__close{flex-shrink:0;background:none;border:none;padding:0;margin:0;cursor:pointer;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:var(--sefin-radius-sm);font-size:20px;line-height:1;opacity:.7;transition:opacity .2s ease-in-out,background-color .2s ease-in-out}.sefin-alert__close:hover{opacity:1;background-color:#0000000d}.sefin-alert__close:focus-visible{outline:2px solid currentColor;outline-offset:2px}.sefin-alert__close span{display:block;line-height:1}.sefin-alert--success{background-color:var(--sefin-color-success-light, #e8f5e9);border-color:var(--sefin-color-success, #4caf50);color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success{background-color:#4caf5026;border-color:var(--sefin-color-success, #4caf50);color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__icon{background-color:var(--sefin-color-success, #4caf50);color:#fff}.sefin-alert--success .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--success .sefin-alert__title{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__message{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__close{color:var(--sefin-color-success-dark, #2e7d32)}[data-theme=dark] .sefin-alert--success .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--success .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--success .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--warning{background-color:var(--sefin-color-warning-light, #fff3e0);border-color:var(--sefin-color-warning, #ff9800);color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning{background-color:#ff980026;border-color:var(--sefin-color-warning, #ff9800);color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__icon{background-color:var(--sefin-color-warning, #ff9800);color:#fff}.sefin-alert--warning .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--warning .sefin-alert__title{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__message{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__close{color:var(--sefin-color-warning-dark, #e65100)}[data-theme=dark] .sefin-alert--warning .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--warning .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--warning .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--error{background-color:var(--sefin-color-error-light, #ffebee);border-color:var(--sefin-color-error, #f44336);color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error{background-color:#f4433626;border-color:var(--sefin-color-error, #f44336);color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__icon{background-color:var(--sefin-color-error, #f44336);color:#fff}.sefin-alert--error .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--error .sefin-alert__title{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__message{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__close{color:var(--sefin-color-error-dark, #c62828)}[data-theme=dark] .sefin-alert--error .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--error .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--error .sefin-alert__close:hover{background-color:#ffffff1a}.sefin-alert--info{background-color:var(--sefin-color-primary, #1976d2);border-color:var(--sefin-color-primary, #1976d2);color:var(--sefin-color-text-inverse, #ffffff)}[data-theme=dark] .sefin-alert--info{background-color:var(--sefin-color-primary, #55C3D8);border-color:var(--sefin-color-primary, #55C3D8);color:var(--sefin-color-text-inverse, #ffffff)}.sefin-alert--info .sefin-alert__icon{background-color:#fff3;color:var(--sefin-color-text-inverse, #ffffff);border:none}[data-theme=dark] .sefin-alert--info .sefin-alert__icon{background-color:#fff3}.sefin-alert--info .sefin-alert__icon sefin-icon{color:var(--sefin-color-text-inverse, #ffffff)}.sefin-alert--info .sefin-alert__title{color:var(--sefin-color-text-inverse, #ffffff);font-weight:var(--sefin-font-weight-semibold, 600)}[data-theme=dark] .sefin-alert--info .sefin-alert__title,.sefin-alert--info .sefin-alert__message,[data-theme=dark] .sefin-alert--info .sefin-alert__message,.sefin-alert--info .sefin-alert__close,[data-theme=dark] .sefin-alert--info .sefin-alert__close{color:var(--sefin-color-text-inverse, #ffffff)}.sefin-alert--info .sefin-alert__close:hover,[data-theme=dark] .sefin-alert--info .sefin-alert__close:hover{background-color:#ffffff26}.sefin-alert--default{background-color:var(--sefin-color-surface-hover, #f5f5f5);border-color:var(--sefin-color-border, #e0e0e0);color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default{background-color:var(--sefin-color-surface-hover, #4f4f4f);border-color:var(--sefin-color-border, #686868);color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__icon{background-color:var(--sefin-color-text-secondary, #666);color:#fff}.sefin-alert--default .sefin-alert__icon sefin-icon{color:#fff}.sefin-alert--default .sefin-alert__title{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__title{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__message{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__message{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__close{color:var(--sefin-color-text, #333)}[data-theme=dark] .sefin-alert--default .sefin-alert__close{color:var(--sefin-color-text, #ffffff)}.sefin-alert--default .sefin-alert__close:hover{background-color:#0000000d}[data-theme=dark] .sefin-alert--default .sefin-alert__close:hover{background-color:#ffffff1a}\n"] }]
|
|
2695
2695
|
}], propDecorators: { variant: [{
|
|
2696
2696
|
type: Input
|
|
2697
2697
|
}], size: [{
|
|
@@ -7437,11 +7437,11 @@ class DrawerComponent {
|
|
|
7437
7437
|
return styles;
|
|
7438
7438
|
}
|
|
7439
7439
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7440
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: DrawerComponent, isStandalone: true, selector: "sefin-drawer", inputs: { isOpen: "isOpen", position: "position", minWidth: "minWidth", minHeight: "minHeight", showOverlay: "showOverlay", closeOnOverlayClick: "closeOnOverlayClick", closeOnEscape: "closeOnEscape", borderRadius: "borderRadius" }, outputs: { close: "close" }, host: { listeners: { "document:keydown": "handleEscapeKey($event)" } }, ngImport: i0, template: "<!-- Overlay for drawer -->\n@if (
|
|
7440
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: DrawerComponent, isStandalone: true, selector: "sefin-drawer", inputs: { isOpen: "isOpen", position: "position", minWidth: "minWidth", minHeight: "minHeight", showOverlay: "showOverlay", closeOnOverlayClick: "closeOnOverlayClick", closeOnEscape: "closeOnEscape", borderRadius: "borderRadius" }, outputs: { close: "close" }, host: { listeners: { "document:keydown": "handleEscapeKey($event)" } }, ngImport: i0, template: "<!-- Overlay for drawer - always in DOM when showOverlay to allow fade-out transition -->\n@if (showOverlay) {\n <div\n class=\"sefin-drawer__overlay\"\n [class.sefin-drawer__overlay--visible]=\"isOpen\"\n (click)=\"handleOverlayClick()\"\n [attr.aria-hidden]=\"!isOpen\"\n role=\"presentation\"\n ></div>\n}\n\n<aside\n [class]=\"drawerClasses\"\n [ngStyle]=\"drawerStyles\"\n [attr.aria-hidden]=\"!isOpen\"\n role=\"dialog\"\n [attr.aria-modal]=\"isOpen\"\n>\n <div class=\"sefin-drawer__content\">\n <ng-content></ng-content>\n </div>\n</aside>\n", styles: [".sefin-drawer{position:fixed;z-index:var(--sefin-z-index-drawer, 1000);background:var(--sefin-color-surface, #ffffff);display:flex;flex-direction:column;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);box-shadow:var(--sefin-shadow-drawer, 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12), 0 5px 5px -3px rgba(0, 0, 0, .2));transition:transform var(--sefin-transition-duration-drawer, .35s) cubic-bezier(.32,.72,0,1)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-none{border-top-right-radius:var(--sefin-radius-none);border-bottom-right-radius:var(--sefin-radius-none)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-sm{border-top-right-radius:var(--sefin-radius-sm);border-bottom-right-radius:var(--sefin-radius-sm)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-md{border-top-right-radius:var(--sefin-radius-md);border-bottom-right-radius:var(--sefin-radius-md)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-lg{border-top-right-radius:var(--sefin-radius-lg);border-bottom-right-radius:var(--sefin-radius-lg)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-xl{border-top-right-radius:var(--sefin-radius-xl);border-bottom-right-radius:var(--sefin-radius-xl)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-2xl{border-top-right-radius:var(--sefin-radius-2xl);border-bottom-right-radius:var(--sefin-radius-2xl)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-full{border-top-right-radius:var(--sefin-radius-full);border-bottom-right-radius:var(--sefin-radius-full)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-none{border-top-left-radius:var(--sefin-radius-none);border-bottom-left-radius:var(--sefin-radius-none)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-sm{border-top-left-radius:var(--sefin-radius-sm);border-bottom-left-radius:var(--sefin-radius-sm)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-md{border-top-left-radius:var(--sefin-radius-md);border-bottom-left-radius:var(--sefin-radius-md)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-lg{border-top-left-radius:var(--sefin-radius-lg);border-bottom-left-radius:var(--sefin-radius-lg)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-xl{border-top-left-radius:var(--sefin-radius-xl);border-bottom-left-radius:var(--sefin-radius-xl)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-2xl{border-top-left-radius:var(--sefin-radius-2xl);border-bottom-left-radius:var(--sefin-radius-2xl)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-full{border-top-left-radius:var(--sefin-radius-full);border-bottom-left-radius:var(--sefin-radius-full)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-none{border-bottom-left-radius:var(--sefin-radius-none);border-bottom-right-radius:var(--sefin-radius-none)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-sm{border-bottom-left-radius:var(--sefin-radius-sm);border-bottom-right-radius:var(--sefin-radius-sm)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-md{border-bottom-left-radius:var(--sefin-radius-md);border-bottom-right-radius:var(--sefin-radius-md)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-lg{border-bottom-left-radius:var(--sefin-radius-lg);border-bottom-right-radius:var(--sefin-radius-lg)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-xl{border-bottom-left-radius:var(--sefin-radius-xl);border-bottom-right-radius:var(--sefin-radius-xl)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-2xl{border-bottom-left-radius:var(--sefin-radius-2xl);border-bottom-right-radius:var(--sefin-radius-2xl)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-full{border-bottom-left-radius:var(--sefin-radius-full);border-bottom-right-radius:var(--sefin-radius-full)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-none{border-top-left-radius:var(--sefin-radius-none);border-top-right-radius:var(--sefin-radius-none)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-sm{border-top-left-radius:var(--sefin-radius-sm);border-top-right-radius:var(--sefin-radius-sm)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-md{border-top-left-radius:var(--sefin-radius-md);border-top-right-radius:var(--sefin-radius-md)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-lg{border-top-left-radius:var(--sefin-radius-lg);border-top-right-radius:var(--sefin-radius-lg)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-xl{border-top-left-radius:var(--sefin-radius-xl);border-top-right-radius:var(--sefin-radius-xl)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-2xl{border-top-left-radius:var(--sefin-radius-2xl);border-top-right-radius:var(--sefin-radius-2xl)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-full{border-top-left-radius:var(--sefin-radius-full);border-top-right-radius:var(--sefin-radius-full)}.sefin-drawer.sefin-drawer--left{top:0;left:0;height:100vh;width:fit-content;min-width:288px;border-right:1px solid var(--sefin-color-border, #e8e8e8);transform:translate(-100%)}.sefin-drawer.sefin-drawer--left.sefin-drawer--open{transform:translate(0)}.sefin-drawer.sefin-drawer--right{top:0;right:0;height:100vh;width:fit-content;min-width:288px;border-left:1px solid var(--sefin-color-border, #e8e8e8);transform:translate(100%)}.sefin-drawer.sefin-drawer--right.sefin-drawer--open{transform:translate(0)}.sefin-drawer.sefin-drawer--top{top:0;left:0;right:0;width:100vw;height:fit-content;min-height:300px;border-bottom:1px solid var(--sefin-color-border, #e8e8e8);transform:translateY(-100%)}.sefin-drawer.sefin-drawer--top.sefin-drawer--open{transform:translateY(0)}.sefin-drawer.sefin-drawer--bottom{bottom:0;left:0;right:0;width:100vw;height:fit-content;min-height:300px;border-top:1px solid var(--sefin-color-border, #e8e8e8);transform:translateY(100%)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--open{transform:translateY(0)}.sefin-drawer__content{flex:1;overflow:auto;display:flex;flex-direction:column;height:100%;width:100%}.sefin-drawer__overlay{position:fixed;inset:0;background:var(--sefin-color-overlay, rgba(0, 0, 0, .5));z-index:calc(var(--sefin-z-index-drawer, 1000) - 1);opacity:0;pointer-events:none;transition:opacity var(--sefin-transition-duration-drawer, .35s) cubic-bezier(.32,.72,0,1);-webkit-backdrop-filter:blur(var(--sefin-overlay-blur, 2px));backdrop-filter:blur(var(--sefin-overlay-blur, 2px))}.sefin-drawer__overlay--visible{opacity:1;pointer-events:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
7441
7441
|
}
|
|
7442
7442
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DrawerComponent, decorators: [{
|
|
7443
7443
|
type: Component,
|
|
7444
|
-
args: [{ selector: 'sefin-drawer', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<!-- Overlay for drawer -->\n@if (
|
|
7444
|
+
args: [{ selector: 'sefin-drawer', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<!-- Overlay for drawer - always in DOM when showOverlay to allow fade-out transition -->\n@if (showOverlay) {\n <div\n class=\"sefin-drawer__overlay\"\n [class.sefin-drawer__overlay--visible]=\"isOpen\"\n (click)=\"handleOverlayClick()\"\n [attr.aria-hidden]=\"!isOpen\"\n role=\"presentation\"\n ></div>\n}\n\n<aside\n [class]=\"drawerClasses\"\n [ngStyle]=\"drawerStyles\"\n [attr.aria-hidden]=\"!isOpen\"\n role=\"dialog\"\n [attr.aria-modal]=\"isOpen\"\n>\n <div class=\"sefin-drawer__content\">\n <ng-content></ng-content>\n </div>\n</aside>\n", styles: [".sefin-drawer{position:fixed;z-index:var(--sefin-z-index-drawer, 1000);background:var(--sefin-color-surface, #ffffff);display:flex;flex-direction:column;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);box-shadow:var(--sefin-shadow-drawer, 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12), 0 5px 5px -3px rgba(0, 0, 0, .2));transition:transform var(--sefin-transition-duration-drawer, .35s) cubic-bezier(.32,.72,0,1)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-none{border-top-right-radius:var(--sefin-radius-none);border-bottom-right-radius:var(--sefin-radius-none)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-sm{border-top-right-radius:var(--sefin-radius-sm);border-bottom-right-radius:var(--sefin-radius-sm)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-md{border-top-right-radius:var(--sefin-radius-md);border-bottom-right-radius:var(--sefin-radius-md)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-lg{border-top-right-radius:var(--sefin-radius-lg);border-bottom-right-radius:var(--sefin-radius-lg)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-xl{border-top-right-radius:var(--sefin-radius-xl);border-bottom-right-radius:var(--sefin-radius-xl)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-2xl{border-top-right-radius:var(--sefin-radius-2xl);border-bottom-right-radius:var(--sefin-radius-2xl)}.sefin-drawer.sefin-drawer--left.sefin-drawer--radius-full{border-top-right-radius:var(--sefin-radius-full);border-bottom-right-radius:var(--sefin-radius-full)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-none{border-top-left-radius:var(--sefin-radius-none);border-bottom-left-radius:var(--sefin-radius-none)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-sm{border-top-left-radius:var(--sefin-radius-sm);border-bottom-left-radius:var(--sefin-radius-sm)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-md{border-top-left-radius:var(--sefin-radius-md);border-bottom-left-radius:var(--sefin-radius-md)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-lg{border-top-left-radius:var(--sefin-radius-lg);border-bottom-left-radius:var(--sefin-radius-lg)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-xl{border-top-left-radius:var(--sefin-radius-xl);border-bottom-left-radius:var(--sefin-radius-xl)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-2xl{border-top-left-radius:var(--sefin-radius-2xl);border-bottom-left-radius:var(--sefin-radius-2xl)}.sefin-drawer.sefin-drawer--right.sefin-drawer--radius-full{border-top-left-radius:var(--sefin-radius-full);border-bottom-left-radius:var(--sefin-radius-full)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-none{border-bottom-left-radius:var(--sefin-radius-none);border-bottom-right-radius:var(--sefin-radius-none)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-sm{border-bottom-left-radius:var(--sefin-radius-sm);border-bottom-right-radius:var(--sefin-radius-sm)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-md{border-bottom-left-radius:var(--sefin-radius-md);border-bottom-right-radius:var(--sefin-radius-md)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-lg{border-bottom-left-radius:var(--sefin-radius-lg);border-bottom-right-radius:var(--sefin-radius-lg)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-xl{border-bottom-left-radius:var(--sefin-radius-xl);border-bottom-right-radius:var(--sefin-radius-xl)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-2xl{border-bottom-left-radius:var(--sefin-radius-2xl);border-bottom-right-radius:var(--sefin-radius-2xl)}.sefin-drawer.sefin-drawer--top.sefin-drawer--radius-full{border-bottom-left-radius:var(--sefin-radius-full);border-bottom-right-radius:var(--sefin-radius-full)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-none{border-top-left-radius:var(--sefin-radius-none);border-top-right-radius:var(--sefin-radius-none)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-sm{border-top-left-radius:var(--sefin-radius-sm);border-top-right-radius:var(--sefin-radius-sm)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-md{border-top-left-radius:var(--sefin-radius-md);border-top-right-radius:var(--sefin-radius-md)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-lg{border-top-left-radius:var(--sefin-radius-lg);border-top-right-radius:var(--sefin-radius-lg)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-xl{border-top-left-radius:var(--sefin-radius-xl);border-top-right-radius:var(--sefin-radius-xl)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-2xl{border-top-left-radius:var(--sefin-radius-2xl);border-top-right-radius:var(--sefin-radius-2xl)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--radius-full{border-top-left-radius:var(--sefin-radius-full);border-top-right-radius:var(--sefin-radius-full)}.sefin-drawer.sefin-drawer--left{top:0;left:0;height:100vh;width:fit-content;min-width:288px;border-right:1px solid var(--sefin-color-border, #e8e8e8);transform:translate(-100%)}.sefin-drawer.sefin-drawer--left.sefin-drawer--open{transform:translate(0)}.sefin-drawer.sefin-drawer--right{top:0;right:0;height:100vh;width:fit-content;min-width:288px;border-left:1px solid var(--sefin-color-border, #e8e8e8);transform:translate(100%)}.sefin-drawer.sefin-drawer--right.sefin-drawer--open{transform:translate(0)}.sefin-drawer.sefin-drawer--top{top:0;left:0;right:0;width:100vw;height:fit-content;min-height:300px;border-bottom:1px solid var(--sefin-color-border, #e8e8e8);transform:translateY(-100%)}.sefin-drawer.sefin-drawer--top.sefin-drawer--open{transform:translateY(0)}.sefin-drawer.sefin-drawer--bottom{bottom:0;left:0;right:0;width:100vw;height:fit-content;min-height:300px;border-top:1px solid var(--sefin-color-border, #e8e8e8);transform:translateY(100%)}.sefin-drawer.sefin-drawer--bottom.sefin-drawer--open{transform:translateY(0)}.sefin-drawer__content{flex:1;overflow:auto;display:flex;flex-direction:column;height:100%;width:100%}.sefin-drawer__overlay{position:fixed;inset:0;background:var(--sefin-color-overlay, rgba(0, 0, 0, .5));z-index:calc(var(--sefin-z-index-drawer, 1000) - 1);opacity:0;pointer-events:none;transition:opacity var(--sefin-transition-duration-drawer, .35s) cubic-bezier(.32,.72,0,1);-webkit-backdrop-filter:blur(var(--sefin-overlay-blur, 2px));backdrop-filter:blur(var(--sefin-overlay-blur, 2px))}.sefin-drawer__overlay--visible{opacity:1;pointer-events:auto}\n"] }]
|
|
7445
7445
|
}], propDecorators: { isOpen: [{
|
|
7446
7446
|
type: Input
|
|
7447
7447
|
}], position: [{
|