cloud-ide-element 1.1.217 → 1.1.219
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.
|
@@ -7939,7 +7939,7 @@ class CideEleButtonComponent {
|
|
|
7939
7939
|
}
|
|
7940
7940
|
}
|
|
7941
7941
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideEleButtonComponent, deps: [{ token: CideElementsService }, { token: i2$1.Router }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
7942
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideEleButtonComponent, isStandalone: true, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: { label: "label", variant: "variant", size: "size", type: "type", shape: "shape", elevation: "elevation", disabled: "disabled", id: "id", loading: "loading", fullWidth: "fullWidth", leftIcon: "leftIcon", rightIcon: "rightIcon", customClass: "customClass", tooltip: "tooltip", ariaLabel: "ariaLabel", testId: "testId", routerLink: "routerLink", routerExtras: "routerExtras", preventDoubleClick: "preventDoubleClick", animated: "animated", adaptive: "adaptive" }, outputs: { btnClick: "btnClick", doubleClick: "doubleClick" }, host: { listeners: { "click": "onClick($event)" }, properties: { "class.cide-button-disabled": "disabled || loading", "attr.disabled": "(disabled || loading) ? true : null", "class.primary": "variant === \"primary\"", "class.secondary": "variant === \"secondary\"", "class.outline": "variant === \"outline\"", "class.text": "variant === \"text\"", "class.link": "variant === \"link\"", "class.success": "variant === \"success\"", "class.danger": "variant === \"danger\"", "class.warning": "variant === \"warning\"", "class.info": "variant === \"info\"", "class.xs": "size === \"xs\"", "class.sm": "size === \"sm\"", "class.md": "size === \"md\"", "class.lg": "size === \"lg\"", "class.xl": "size === \"xl\"", "class.rounded": "shape === \"rounded\"", "class.pill": "shape === \"pill\"", "class.square": "shape === \"square\"", "class.elevation-none": "elevation === \"none\"", "class.elevation-low": "elevation === \"low\"", "class.elevation-medium": "elevation === \"medium\"", "class.elevation-high": "elevation === \"high\"", "attr.type": "type", "attr.aria-label": "ariaLabel", "attr.aria-disabled": "disabled || loading", "attr.data-testid": "testId", "attr.title": "tooltip", "class.adaptive": "adaptive", "class": "customClass" }, classAttribute: "cide-button tw-rounded-md tw-py-0.5 tw-select-none tw-flex tw-items-center tw-justify-center" }, usesOnChanges: true, ngImport: i0, template: "@if (isStandaloneElement) {\r\n<!-- When used as standalone element, render button element -->\r\n<button [type]=\"type\" [disabled]=\"disabled || loading\" [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-disabled]=\"disabled || loading\" [attr.data-testid]=\"testId\" [attr.title]=\"tooltip\"\r\n class=\"tw-flex tw-items-center tw-justify-center cide-ele-btn-content tw-w-full\">\r\n <!-- Left icon -->\r\n @if (leftIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-mr-1' : 'tw-mr-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{leftIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Loading spinner -->\r\n @if (loading) {\r\n <cide-ele-spinner class=\"tw-inline-block tw-my-1\" [ngClass]=\"{\r\n 'tw-mr-1': size === 'xs', \r\n 'tw-mr-2': size !== 'xs', \r\n 'cide-pill-disabled': (disabled || loading)\r\n }\" size=\"xs\">\r\n </cide-ele-spinner>\r\n }\r\n\r\n <!-- Button label or content -->\r\n <span class=\"btn-label\">\r\n @if (label) {\r\n <span>{{ label }}</span>\r\n } @else {\r\n <span class=\"tw-flex tw-items-center tw-justify-center\">\r\n <ng-content></ng-content>\r\n </span>\r\n }\r\n </span>\r\n\r\n\r\n <!-- Right icon -->\r\n @if (rightIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-ml-1' : 'tw-ml-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{rightIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Spacer for spinner when loading to maintain button width -->\r\n @if (loading) {\r\n <span class=\"tw-p-1\" [ngClass]=\"size === 'xs' ? 'tw-w-4 tw-mr-1' : 'tw-w-6 tw-mr-2'\"></span>\r\n }\r\n</button>\r\n} @else {\r\n<!-- When used as attribute directive, just render content -->\r\n<div class=\"tw-flex tw-items-center tw-justify-center cide-ele-btn-content tw-w-full\">\r\n <!-- Left icon -->\r\n @if (leftIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-mr-1' : 'tw-mr-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{leftIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Loading spinner -->\r\n @if (loading) {\r\n <cide-ele-spinner class=\"tw-inline-block tw-my-1\" [ngClass]=\"{\r\n 'tw-mr-1': size === 'xs', \r\n 'tw-mr-2': size !== 'xs', \r\n 'cide-pill-disabled': (disabled || loading)\r\n }\" size=\"xs\">\r\n </cide-ele-spinner>\r\n }\r\n\r\n <!-- Button label or content -->\r\n <span class=\"btn-label\">\r\n @if (label) {\r\n <span>{{ label }}</span>\r\n } @else {\r\n <span class=\"tw-flex tw-items-center tw-justify-center\">\r\n <ng-content></ng-content>\r\n </span>\r\n }\r\n </span>\r\n\r\n\r\n <!-- Right icon -->\r\n @if (rightIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-ml-1' : 'tw-ml-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{rightIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Spacer for spinner when loading to maintain button width -->\r\n @if (loading) {\r\n <span class=\"tw-p-1\" [ngClass]=\"size === 'xs' ? 'tw-w-4 tw-mr-1' : 'tw-w-6 tw-mr-2'\"></span>\r\n }\r\n</div>\r\n}", styles: [":host{position:relative;background-color:var(--cide-ele-brand-primary, #3b82f6);cursor:pointer;font-family:inherit;font-weight:500;outline:none;overflow:hidden;transition:all .2s ease-in-out;border:none;text-align:center;vertical-align:middle;text-decoration:none;line-height:1.5;letter-spacing:.025em;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host:focus-visible{outline:2px solid var(--cide-ele-brand-primary, #3b82f6);outline-offset:2px;box-shadow:0 0 0 3px #3b82f64d}:host:hover:not(:disabled){background-color:var(--cide-ele-brand-primary-hover, #2563eb);transform:translateY(-1px)}:host:active:not(:disabled){transform:translateY(1px)}:host.cide-button-disabled{background-color:var(--cide-button-background-disabled, #9ca3af)!important;cursor:var(--cide-button-cursor-disabled, not-allowed)!important;opacity:.7;pointer-events:none;transform:none!important}:host.xs{font-size:.65rem;padding:0 .25rem;min-height:1.125rem;line-height:1}:host.xs .tw-icon-container.tw-mr-2,:host.xs .tw-icon-container.tw-mr-1{margin-right:.075rem!important}:host.xs .tw-icon-container.tw-ml-2,:host.xs .tw-icon-container.tw-ml-1{margin-left:.075rem!important}:host.xs .tw-icon-container i{font-size:.75rem!important}:host.xs cide-ele-spinner.tw-mr-2,:host.xs cide-ele-spinner.tw-mr-1{margin-right:.075rem!important}:host.xs cide-ele-spinner.tw-ml-2,:host.xs cide-ele-spinner.tw-ml-1{margin-left:.075rem!important}:host.sm{font-size:.875rem;padding:.25rem .5rem}:host.md{font-size:1rem;padding:.25rem .75rem}:host.lg{font-size:1.125rem;padding:.75rem 1rem}:host.xl{font-size:1.25rem;padding:1rem 1.5rem}:host.rounded{border-radius:.5rem}:host.pill{border-radius:9999px}:host.square{border-radius:0}:host.elevation-none{box-shadow:none}:host.elevation-low{box-shadow:0 1px 2px #0000000d}:host.elevation-medium{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}:host.elevation-high{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ripple-effect{position:absolute;border-radius:50%;background-color:#fff6;transform:scale(0);animation:ripple .6s linear;pointer-events:none}@keyframes ripple{to{transform:scale(4);opacity:0}}:host{color:#fff}:host.secondary{background-color:var(--cide-ele-brand-secondary, #4b5563);color:#fff}:host.secondary:hover:not(:disabled){background-color:var(--cide-ele-brand-secondary-hover, #374151)}:host.success{background-color:var(--cide-ele-success, #10b981);color:#fff}:host.success:hover:not(:disabled){background-color:var(--cide-ele-success, #10b981)}:host.danger{background-color:var(--cide-ele-error, #ef4444);color:#fff}:host.danger:hover:not(:disabled){background-color:var(--cide-ele-error, #ef4444)}:host.warning{background-color:var(--cide-ele-warning, #f59e0b);color:#fff}:host.warning:hover:not(:disabled){background-color:var(--cide-ele-warning, #f59e0b)}:host.info{background-color:var(--cide-ele-info, #3b82f6);color:#fff}:host.info:hover:not(:disabled){background-color:var(--cide-ele-info, #3b82f6)}:host.outline{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:1px solid var(--cide-ele-brand-primary, #3b82f6)}:host.outline:hover:not(:disabled){background-color:#3b82f60d}:host.outline.secondary{color:var(--cide-ele-brand-secondary, #4b5563);border-color:var(--cide-ele-brand-secondary, #4b5563)}:host.outline.success{color:var(--cide-ele-success, #10b981);border-color:var(--cide-ele-success, #10b981)}:host.outline.danger{color:var(--cide-ele-error, #ef4444);border-color:var(--cide-ele-error, #ef4444)}:host.outline.warning{color:var(--cide-ele-warning, #f59e0b);border-color:var(--cide-ele-warning, #f59e0b)}:host.outline.info{color:var(--cide-ele-info, #3b82f6);border-color:var(--cide-ele-info, #3b82f6)}:host.text{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:none;padding-left:.5rem;padding-right:.5rem}:host.text:hover:not(:disabled){background-color:#3b82f60d;text-decoration:underline}:host.text.secondary{color:var(--cide-ele-brand-secondary, #4b5563)}:host.text.success{color:var(--cide-ele-success, #10b981)}:host.text.danger{color:var(--cide-ele-error, #ef4444)}:host.text.warning{color:var(--cide-ele-warning, #f59e0b)}:host.text.info{color:var(--cide-ele-info, #3b82f6)}:host.link{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:none;text-decoration:underline;padding:0;font-weight:400}:host.link:hover:not(:disabled){color:var(--cide-ele-brand-primary-hover, #2563eb);text-decoration:underline}:host.link.secondary{color:var(--cide-ele-brand-secondary, #4b5563)}:host.link.success{color:var(--cide-ele-success, #10b981)}:host.link.danger{color:var(--cide-ele-error, #ef4444)}:host.link.warning{color:var(--cide-ele-warning, #f59e0b)}:host.link.info{color:var(--cide-ele-info, #3b82f6)}.tw-icon-container{display:inline-flex;align-items:center;justify-content:center}@media (max-width: 767px){:host.adaptive{padding:.25rem!important;min-width:unset!important}:host.adaptive .btn-label{display:none!important}:host.adaptive .tw-icon-container{margin:0!important}:host.adaptive cide-ele-spinner{margin:0!important}:host.adaptive .tw-p-1{display:none!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: CideSpinnerComponent, selector: "cide-ele-spinner", inputs: ["size", "type"] }] });
|
|
7942
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideEleButtonComponent, isStandalone: true, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: { label: "label", variant: "variant", size: "size", type: "type", shape: "shape", elevation: "elevation", disabled: "disabled", id: "id", loading: "loading", fullWidth: "fullWidth", leftIcon: "leftIcon", rightIcon: "rightIcon", customClass: "customClass", tooltip: "tooltip", ariaLabel: "ariaLabel", testId: "testId", routerLink: "routerLink", routerExtras: "routerExtras", preventDoubleClick: "preventDoubleClick", animated: "animated", adaptive: "adaptive" }, outputs: { btnClick: "btnClick", doubleClick: "doubleClick" }, host: { listeners: { "click": "onClick($event)" }, properties: { "class.cide-button-disabled": "disabled || loading", "attr.disabled": "(disabled || loading) ? true : null", "class.primary": "variant === \"primary\"", "class.secondary": "variant === \"secondary\"", "class.outline": "variant === \"outline\"", "class.text": "variant === \"text\"", "class.link": "variant === \"link\"", "class.success": "variant === \"success\"", "class.danger": "variant === \"danger\"", "class.warning": "variant === \"warning\"", "class.info": "variant === \"info\"", "class.xs": "size === \"xs\"", "class.sm": "size === \"sm\"", "class.md": "size === \"md\"", "class.lg": "size === \"lg\"", "class.xl": "size === \"xl\"", "class.rounded": "shape === \"rounded\"", "class.pill": "shape === \"pill\"", "class.square": "shape === \"square\"", "class.elevation-none": "elevation === \"none\"", "class.elevation-low": "elevation === \"low\"", "class.elevation-medium": "elevation === \"medium\"", "class.elevation-high": "elevation === \"high\"", "attr.type": "type", "attr.aria-label": "ariaLabel", "attr.aria-disabled": "disabled || loading", "attr.data-testid": "testId", "attr.title": "tooltip", "class.adaptive": "adaptive", "class": "customClass" }, classAttribute: "cide-button tw-rounded-md tw-py-0.5 tw-select-none tw-flex tw-items-center tw-justify-center" }, usesOnChanges: true, ngImport: i0, template: "@if (isStandaloneElement) {\r\n<!-- When used as standalone element, render button element -->\r\n<button [type]=\"type\" [disabled]=\"disabled || loading\" [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-disabled]=\"disabled || loading\" [attr.data-testid]=\"testId\" [attr.title]=\"tooltip\"\r\n class=\"tw-flex tw-items-center tw-justify-center cide-ele-btn-content tw-w-full\">\r\n <!-- Left icon -->\r\n @if (leftIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-mr-1' : 'tw-mr-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{leftIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Loading spinner -->\r\n @if (loading) {\r\n <cide-ele-spinner class=\"tw-inline-block tw-my-1\" [ngClass]=\"{\r\n 'tw-mr-1': size === 'xs', \r\n 'tw-mr-2': size !== 'xs', \r\n 'cide-pill-disabled': (disabled || loading)\r\n }\" size=\"xs\">\r\n </cide-ele-spinner>\r\n }\r\n\r\n <!-- Button label or content -->\r\n <span class=\"btn-label\">\r\n @if (label) {\r\n <span>{{ label }}</span>\r\n } @else {\r\n <span class=\"tw-flex tw-items-center tw-justify-center\">\r\n <ng-content></ng-content>\r\n </span>\r\n }\r\n </span>\r\n\r\n\r\n <!-- Right icon -->\r\n @if (rightIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-ml-1' : 'tw-ml-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{rightIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Spacer for spinner when loading to maintain button width -->\r\n @if (loading) {\r\n <span class=\"tw-p-1\" [ngClass]=\"size === 'xs' ? 'tw-w-4 tw-mr-1' : 'tw-w-6 tw-mr-2'\"></span>\r\n }\r\n</button>\r\n} @else {\r\n<!-- When used as attribute directive, just render content -->\r\n<div class=\"tw-flex tw-items-center tw-justify-center cide-ele-btn-content tw-w-full\">\r\n <!-- Left icon -->\r\n @if (leftIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-mr-1' : 'tw-mr-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{leftIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Loading spinner -->\r\n @if (loading) {\r\n <cide-ele-spinner class=\"tw-inline-block tw-my-1\" [ngClass]=\"{\r\n 'tw-mr-1': size === 'xs', \r\n 'tw-mr-2': size !== 'xs', \r\n 'cide-pill-disabled': (disabled || loading)\r\n }\" size=\"xs\">\r\n </cide-ele-spinner>\r\n }\r\n\r\n <!-- Button label or content -->\r\n <span class=\"btn-label\">\r\n @if (label) {\r\n <span>{{ label }}</span>\r\n } @else {\r\n <span class=\"tw-flex tw-items-center tw-justify-center\">\r\n <ng-content></ng-content>\r\n </span>\r\n }\r\n </span>\r\n\r\n\r\n <!-- Right icon -->\r\n @if (rightIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-ml-1' : 'tw-ml-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{rightIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Spacer for spinner when loading to maintain button width -->\r\n @if (loading) {\r\n <span class=\"tw-p-1\" [ngClass]=\"size === 'xs' ? 'tw-w-4 tw-mr-1' : 'tw-w-6 tw-mr-2'\"></span>\r\n }\r\n</div>\r\n}", styles: [":host{position:relative;background-color:var(--cide-ele-brand-primary, #3b82f6);cursor:pointer;font-family:inherit;font-weight:500;outline:none;overflow:hidden;transition:all .2s ease-in-out;border:none;text-align:center;vertical-align:middle;text-decoration:none;line-height:1.5;letter-spacing:.025em;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host:focus-visible{outline:2px solid var(--cide-ele-brand-primary, #3b82f6);outline-offset:2px;box-shadow:0 0 0 3px #3b82f64d}:host:hover:not(:disabled){background-color:var(--cide-ele-brand-primary-hover, #2563eb);transform:translateY(-1px)}:host:active:not(:disabled){transform:translateY(1px)}:host.cide-button-disabled{background-color:var(--cide-button-background-disabled, #9ca3af)!important;cursor:var(--cide-button-cursor-disabled, not-allowed)!important;opacity:.7;pointer-events:none;transform:none!important}:host.xs{font-size:.65rem;padding:0 .25rem;min-height:1.125rem;line-height:1}:host.xs .tw-icon-container.tw-mr-2,:host.xs .tw-icon-container.tw-mr-1{margin-right:.075rem!important}:host.xs .tw-icon-container.tw-ml-2,:host.xs .tw-icon-container.tw-ml-1{margin-left:.075rem!important}:host.xs .tw-icon-container i{font-size:.75rem!important}:host.xs cide-ele-spinner.tw-mr-2,:host.xs cide-ele-spinner.tw-mr-1{margin-right:.075rem!important}:host.xs cide-ele-spinner.tw-ml-2,:host.xs cide-ele-spinner.tw-ml-1{margin-left:.075rem!important}:host.sm{font-size:.875rem;padding:.25rem .5rem}:host.md{font-size:1rem;padding:.25rem .75rem}:host.lg{font-size:1.125rem;padding:.75rem 1rem}:host.xl{font-size:1.25rem;padding:1rem 1.5rem}:host.rounded{border-radius:.5rem}:host.pill{border-radius:9999px}:host.square{border-radius:0}:host.elevation-none{box-shadow:none}:host.elevation-low{box-shadow:0 1px 2px #0000000d}:host.elevation-medium{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}:host.elevation-high{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ripple-effect{position:absolute;border-radius:50%;background-color:#fff6;transform:scale(0);animation:ripple .6s linear;pointer-events:none}@keyframes ripple{to{transform:scale(4);opacity:0}}:host{color:#fff}:host.secondary{background-color:var(--cide-ele-brand-secondary, #4b5563);color:#fff}:host.secondary:hover:not(:disabled){background-color:var(--cide-ele-brand-secondary-hover, #374151)}:host.success{background-color:var(--cide-ele-success, #10b981);color:#fff}:host.success:hover:not(:disabled){background-color:var(--cide-ele-success, #10b981)}:host.danger{background-color:var(--cide-ele-error, #ef4444);color:#fff}:host.danger:hover:not(:disabled){background-color:var(--cide-ele-error, #ef4444)}:host.warning{background-color:var(--cide-ele-warning, #f59e0b);color:#fff}:host.warning:hover:not(:disabled){background-color:var(--cide-ele-warning, #f59e0b)}:host.info{background-color:var(--cide-ele-info, #3b82f6);color:#fff}:host.info:hover:not(:disabled){background-color:var(--cide-ele-info, #3b82f6)}:host.outline{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:1px solid var(--cide-ele-brand-primary, #3b82f6)}:host.outline:hover:not(:disabled){background-color:#3b82f60d}:host.outline.secondary{color:var(--cide-ele-brand-secondary, #4b5563);border-color:var(--cide-ele-brand-secondary, #4b5563)}:host.outline.success{color:var(--cide-ele-success, #10b981);border-color:var(--cide-ele-success, #10b981)}:host.outline.danger{color:var(--cide-ele-error, #ef4444);border-color:var(--cide-ele-error, #ef4444)}:host.outline.warning{color:var(--cide-ele-warning, #f59e0b);border-color:var(--cide-ele-warning, #f59e0b)}:host.outline.info{color:var(--cide-ele-info, #3b82f6);border-color:var(--cide-ele-info, #3b82f6)}:host.text{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:none;padding-left:.5rem;padding-right:.5rem}:host.text:hover:not(:disabled){background-color:#3b82f60d;text-decoration:underline}:host.text.secondary{color:var(--cide-ele-brand-secondary, #4b5563)}:host.text.success{color:var(--cide-ele-success, #10b981)}:host.text.danger{color:var(--cide-ele-error, #ef4444)}:host.text.warning{color:var(--cide-ele-warning, #f59e0b)}:host.text.info{color:var(--cide-ele-info, #3b82f6)}:host.link{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:none;text-decoration:underline;padding:0;font-weight:400}:host.link:hover:not(:disabled){color:var(--cide-ele-brand-primary-hover, #2563eb);text-decoration:underline}:host.link.secondary{color:var(--cide-ele-brand-secondary, #4b5563)}:host.link.success{color:var(--cide-ele-success, #10b981)}:host.link.danger{color:var(--cide-ele-error, #ef4444)}:host.link.warning{color:var(--cide-ele-warning, #f59e0b)}:host.link.info{color:var(--cide-ele-info, #3b82f6)}.tw-icon-container{display:inline-flex;align-items:center;justify-content:center}@media (max-width: 767px){:host.adaptive{padding:.25rem!important;min-width:unset!important;font-size:.875rem!important;line-height:1!important}:host.adaptive .tw-text-base{line-height:1!important}:host.adaptive .btn-label{display:none!important}:host.adaptive .tw-icon-container{margin:0!important}:host.adaptive cide-ele-spinner{margin:0!important}:host.adaptive .tw-p-1{display:none!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: CideSpinnerComponent, selector: "cide-ele-spinner", inputs: ["size", "type"] }] });
|
|
7943
7943
|
}
|
|
7944
7944
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideEleButtonComponent, decorators: [{
|
|
7945
7945
|
type: Component,
|
|
@@ -7975,7 +7975,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
7975
7975
|
'[attr.title]': 'tooltip',
|
|
7976
7976
|
'[class.adaptive]': 'adaptive',
|
|
7977
7977
|
'[class]': 'customClass'
|
|
7978
|
-
}, template: "@if (isStandaloneElement) {\r\n<!-- When used as standalone element, render button element -->\r\n<button [type]=\"type\" [disabled]=\"disabled || loading\" [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-disabled]=\"disabled || loading\" [attr.data-testid]=\"testId\" [attr.title]=\"tooltip\"\r\n class=\"tw-flex tw-items-center tw-justify-center cide-ele-btn-content tw-w-full\">\r\n <!-- Left icon -->\r\n @if (leftIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-mr-1' : 'tw-mr-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{leftIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Loading spinner -->\r\n @if (loading) {\r\n <cide-ele-spinner class=\"tw-inline-block tw-my-1\" [ngClass]=\"{\r\n 'tw-mr-1': size === 'xs', \r\n 'tw-mr-2': size !== 'xs', \r\n 'cide-pill-disabled': (disabled || loading)\r\n }\" size=\"xs\">\r\n </cide-ele-spinner>\r\n }\r\n\r\n <!-- Button label or content -->\r\n <span class=\"btn-label\">\r\n @if (label) {\r\n <span>{{ label }}</span>\r\n } @else {\r\n <span class=\"tw-flex tw-items-center tw-justify-center\">\r\n <ng-content></ng-content>\r\n </span>\r\n }\r\n </span>\r\n\r\n\r\n <!-- Right icon -->\r\n @if (rightIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-ml-1' : 'tw-ml-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{rightIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Spacer for spinner when loading to maintain button width -->\r\n @if (loading) {\r\n <span class=\"tw-p-1\" [ngClass]=\"size === 'xs' ? 'tw-w-4 tw-mr-1' : 'tw-w-6 tw-mr-2'\"></span>\r\n }\r\n</button>\r\n} @else {\r\n<!-- When used as attribute directive, just render content -->\r\n<div class=\"tw-flex tw-items-center tw-justify-center cide-ele-btn-content tw-w-full\">\r\n <!-- Left icon -->\r\n @if (leftIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-mr-1' : 'tw-mr-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{leftIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Loading spinner -->\r\n @if (loading) {\r\n <cide-ele-spinner class=\"tw-inline-block tw-my-1\" [ngClass]=\"{\r\n 'tw-mr-1': size === 'xs', \r\n 'tw-mr-2': size !== 'xs', \r\n 'cide-pill-disabled': (disabled || loading)\r\n }\" size=\"xs\">\r\n </cide-ele-spinner>\r\n }\r\n\r\n <!-- Button label or content -->\r\n <span class=\"btn-label\">\r\n @if (label) {\r\n <span>{{ label }}</span>\r\n } @else {\r\n <span class=\"tw-flex tw-items-center tw-justify-center\">\r\n <ng-content></ng-content>\r\n </span>\r\n }\r\n </span>\r\n\r\n\r\n <!-- Right icon -->\r\n @if (rightIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-ml-1' : 'tw-ml-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{rightIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Spacer for spinner when loading to maintain button width -->\r\n @if (loading) {\r\n <span class=\"tw-p-1\" [ngClass]=\"size === 'xs' ? 'tw-w-4 tw-mr-1' : 'tw-w-6 tw-mr-2'\"></span>\r\n }\r\n</div>\r\n}", styles: [":host{position:relative;background-color:var(--cide-ele-brand-primary, #3b82f6);cursor:pointer;font-family:inherit;font-weight:500;outline:none;overflow:hidden;transition:all .2s ease-in-out;border:none;text-align:center;vertical-align:middle;text-decoration:none;line-height:1.5;letter-spacing:.025em;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host:focus-visible{outline:2px solid var(--cide-ele-brand-primary, #3b82f6);outline-offset:2px;box-shadow:0 0 0 3px #3b82f64d}:host:hover:not(:disabled){background-color:var(--cide-ele-brand-primary-hover, #2563eb);transform:translateY(-1px)}:host:active:not(:disabled){transform:translateY(1px)}:host.cide-button-disabled{background-color:var(--cide-button-background-disabled, #9ca3af)!important;cursor:var(--cide-button-cursor-disabled, not-allowed)!important;opacity:.7;pointer-events:none;transform:none!important}:host.xs{font-size:.65rem;padding:0 .25rem;min-height:1.125rem;line-height:1}:host.xs .tw-icon-container.tw-mr-2,:host.xs .tw-icon-container.tw-mr-1{margin-right:.075rem!important}:host.xs .tw-icon-container.tw-ml-2,:host.xs .tw-icon-container.tw-ml-1{margin-left:.075rem!important}:host.xs .tw-icon-container i{font-size:.75rem!important}:host.xs cide-ele-spinner.tw-mr-2,:host.xs cide-ele-spinner.tw-mr-1{margin-right:.075rem!important}:host.xs cide-ele-spinner.tw-ml-2,:host.xs cide-ele-spinner.tw-ml-1{margin-left:.075rem!important}:host.sm{font-size:.875rem;padding:.25rem .5rem}:host.md{font-size:1rem;padding:.25rem .75rem}:host.lg{font-size:1.125rem;padding:.75rem 1rem}:host.xl{font-size:1.25rem;padding:1rem 1.5rem}:host.rounded{border-radius:.5rem}:host.pill{border-radius:9999px}:host.square{border-radius:0}:host.elevation-none{box-shadow:none}:host.elevation-low{box-shadow:0 1px 2px #0000000d}:host.elevation-medium{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}:host.elevation-high{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ripple-effect{position:absolute;border-radius:50%;background-color:#fff6;transform:scale(0);animation:ripple .6s linear;pointer-events:none}@keyframes ripple{to{transform:scale(4);opacity:0}}:host{color:#fff}:host.secondary{background-color:var(--cide-ele-brand-secondary, #4b5563);color:#fff}:host.secondary:hover:not(:disabled){background-color:var(--cide-ele-brand-secondary-hover, #374151)}:host.success{background-color:var(--cide-ele-success, #10b981);color:#fff}:host.success:hover:not(:disabled){background-color:var(--cide-ele-success, #10b981)}:host.danger{background-color:var(--cide-ele-error, #ef4444);color:#fff}:host.danger:hover:not(:disabled){background-color:var(--cide-ele-error, #ef4444)}:host.warning{background-color:var(--cide-ele-warning, #f59e0b);color:#fff}:host.warning:hover:not(:disabled){background-color:var(--cide-ele-warning, #f59e0b)}:host.info{background-color:var(--cide-ele-info, #3b82f6);color:#fff}:host.info:hover:not(:disabled){background-color:var(--cide-ele-info, #3b82f6)}:host.outline{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:1px solid var(--cide-ele-brand-primary, #3b82f6)}:host.outline:hover:not(:disabled){background-color:#3b82f60d}:host.outline.secondary{color:var(--cide-ele-brand-secondary, #4b5563);border-color:var(--cide-ele-brand-secondary, #4b5563)}:host.outline.success{color:var(--cide-ele-success, #10b981);border-color:var(--cide-ele-success, #10b981)}:host.outline.danger{color:var(--cide-ele-error, #ef4444);border-color:var(--cide-ele-error, #ef4444)}:host.outline.warning{color:var(--cide-ele-warning, #f59e0b);border-color:var(--cide-ele-warning, #f59e0b)}:host.outline.info{color:var(--cide-ele-info, #3b82f6);border-color:var(--cide-ele-info, #3b82f6)}:host.text{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:none;padding-left:.5rem;padding-right:.5rem}:host.text:hover:not(:disabled){background-color:#3b82f60d;text-decoration:underline}:host.text.secondary{color:var(--cide-ele-brand-secondary, #4b5563)}:host.text.success{color:var(--cide-ele-success, #10b981)}:host.text.danger{color:var(--cide-ele-error, #ef4444)}:host.text.warning{color:var(--cide-ele-warning, #f59e0b)}:host.text.info{color:var(--cide-ele-info, #3b82f6)}:host.link{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:none;text-decoration:underline;padding:0;font-weight:400}:host.link:hover:not(:disabled){color:var(--cide-ele-brand-primary-hover, #2563eb);text-decoration:underline}:host.link.secondary{color:var(--cide-ele-brand-secondary, #4b5563)}:host.link.success{color:var(--cide-ele-success, #10b981)}:host.link.danger{color:var(--cide-ele-error, #ef4444)}:host.link.warning{color:var(--cide-ele-warning, #f59e0b)}:host.link.info{color:var(--cide-ele-info, #3b82f6)}.tw-icon-container{display:inline-flex;align-items:center;justify-content:center}@media (max-width: 767px){:host.adaptive{padding:.25rem!important;min-width:unset!important}:host.adaptive .btn-label{display:none!important}:host.adaptive .tw-icon-container{margin:0!important}:host.adaptive cide-ele-spinner{margin:0!important}:host.adaptive .tw-p-1{display:none!important}}\n"] }]
|
|
7978
|
+
}, template: "@if (isStandaloneElement) {\r\n<!-- When used as standalone element, render button element -->\r\n<button [type]=\"type\" [disabled]=\"disabled || loading\" [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-disabled]=\"disabled || loading\" [attr.data-testid]=\"testId\" [attr.title]=\"tooltip\"\r\n class=\"tw-flex tw-items-center tw-justify-center cide-ele-btn-content tw-w-full\">\r\n <!-- Left icon -->\r\n @if (leftIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-mr-1' : 'tw-mr-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{leftIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Loading spinner -->\r\n @if (loading) {\r\n <cide-ele-spinner class=\"tw-inline-block tw-my-1\" [ngClass]=\"{\r\n 'tw-mr-1': size === 'xs', \r\n 'tw-mr-2': size !== 'xs', \r\n 'cide-pill-disabled': (disabled || loading)\r\n }\" size=\"xs\">\r\n </cide-ele-spinner>\r\n }\r\n\r\n <!-- Button label or content -->\r\n <span class=\"btn-label\">\r\n @if (label) {\r\n <span>{{ label }}</span>\r\n } @else {\r\n <span class=\"tw-flex tw-items-center tw-justify-center\">\r\n <ng-content></ng-content>\r\n </span>\r\n }\r\n </span>\r\n\r\n\r\n <!-- Right icon -->\r\n @if (rightIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-ml-1' : 'tw-ml-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{rightIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Spacer for spinner when loading to maintain button width -->\r\n @if (loading) {\r\n <span class=\"tw-p-1\" [ngClass]=\"size === 'xs' ? 'tw-w-4 tw-mr-1' : 'tw-w-6 tw-mr-2'\"></span>\r\n }\r\n</button>\r\n} @else {\r\n<!-- When used as attribute directive, just render content -->\r\n<div class=\"tw-flex tw-items-center tw-justify-center cide-ele-btn-content tw-w-full\">\r\n <!-- Left icon -->\r\n @if (leftIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-mr-1' : 'tw-mr-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{leftIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Loading spinner -->\r\n @if (loading) {\r\n <cide-ele-spinner class=\"tw-inline-block tw-my-1\" [ngClass]=\"{\r\n 'tw-mr-1': size === 'xs', \r\n 'tw-mr-2': size !== 'xs', \r\n 'cide-pill-disabled': (disabled || loading)\r\n }\" size=\"xs\">\r\n </cide-ele-spinner>\r\n }\r\n\r\n <!-- Button label or content -->\r\n <span class=\"btn-label\">\r\n @if (label) {\r\n <span>{{ label }}</span>\r\n } @else {\r\n <span class=\"tw-flex tw-items-center tw-justify-center\">\r\n <ng-content></ng-content>\r\n </span>\r\n }\r\n </span>\r\n\r\n\r\n <!-- Right icon -->\r\n @if (rightIcon) {\r\n <span class=\"tw-icon-container\" [ngClass]=\"size === 'xs' ? 'tw-ml-1' : 'tw-ml-2'\">\r\n <i class=\"tw-text-base material-symbols-outlined\">{{rightIcon}}</i>\r\n </span>\r\n }\r\n\r\n <!-- Spacer for spinner when loading to maintain button width -->\r\n @if (loading) {\r\n <span class=\"tw-p-1\" [ngClass]=\"size === 'xs' ? 'tw-w-4 tw-mr-1' : 'tw-w-6 tw-mr-2'\"></span>\r\n }\r\n</div>\r\n}", styles: [":host{position:relative;background-color:var(--cide-ele-brand-primary, #3b82f6);cursor:pointer;font-family:inherit;font-weight:500;outline:none;overflow:hidden;transition:all .2s ease-in-out;border:none;text-align:center;vertical-align:middle;text-decoration:none;line-height:1.5;letter-spacing:.025em;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host:focus-visible{outline:2px solid var(--cide-ele-brand-primary, #3b82f6);outline-offset:2px;box-shadow:0 0 0 3px #3b82f64d}:host:hover:not(:disabled){background-color:var(--cide-ele-brand-primary-hover, #2563eb);transform:translateY(-1px)}:host:active:not(:disabled){transform:translateY(1px)}:host.cide-button-disabled{background-color:var(--cide-button-background-disabled, #9ca3af)!important;cursor:var(--cide-button-cursor-disabled, not-allowed)!important;opacity:.7;pointer-events:none;transform:none!important}:host.xs{font-size:.65rem;padding:0 .25rem;min-height:1.125rem;line-height:1}:host.xs .tw-icon-container.tw-mr-2,:host.xs .tw-icon-container.tw-mr-1{margin-right:.075rem!important}:host.xs .tw-icon-container.tw-ml-2,:host.xs .tw-icon-container.tw-ml-1{margin-left:.075rem!important}:host.xs .tw-icon-container i{font-size:.75rem!important}:host.xs cide-ele-spinner.tw-mr-2,:host.xs cide-ele-spinner.tw-mr-1{margin-right:.075rem!important}:host.xs cide-ele-spinner.tw-ml-2,:host.xs cide-ele-spinner.tw-ml-1{margin-left:.075rem!important}:host.sm{font-size:.875rem;padding:.25rem .5rem}:host.md{font-size:1rem;padding:.25rem .75rem}:host.lg{font-size:1.125rem;padding:.75rem 1rem}:host.xl{font-size:1.25rem;padding:1rem 1.5rem}:host.rounded{border-radius:.5rem}:host.pill{border-radius:9999px}:host.square{border-radius:0}:host.elevation-none{box-shadow:none}:host.elevation-low{box-shadow:0 1px 2px #0000000d}:host.elevation-medium{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}:host.elevation-high{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ripple-effect{position:absolute;border-radius:50%;background-color:#fff6;transform:scale(0);animation:ripple .6s linear;pointer-events:none}@keyframes ripple{to{transform:scale(4);opacity:0}}:host{color:#fff}:host.secondary{background-color:var(--cide-ele-brand-secondary, #4b5563);color:#fff}:host.secondary:hover:not(:disabled){background-color:var(--cide-ele-brand-secondary-hover, #374151)}:host.success{background-color:var(--cide-ele-success, #10b981);color:#fff}:host.success:hover:not(:disabled){background-color:var(--cide-ele-success, #10b981)}:host.danger{background-color:var(--cide-ele-error, #ef4444);color:#fff}:host.danger:hover:not(:disabled){background-color:var(--cide-ele-error, #ef4444)}:host.warning{background-color:var(--cide-ele-warning, #f59e0b);color:#fff}:host.warning:hover:not(:disabled){background-color:var(--cide-ele-warning, #f59e0b)}:host.info{background-color:var(--cide-ele-info, #3b82f6);color:#fff}:host.info:hover:not(:disabled){background-color:var(--cide-ele-info, #3b82f6)}:host.outline{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:1px solid var(--cide-ele-brand-primary, #3b82f6)}:host.outline:hover:not(:disabled){background-color:#3b82f60d}:host.outline.secondary{color:var(--cide-ele-brand-secondary, #4b5563);border-color:var(--cide-ele-brand-secondary, #4b5563)}:host.outline.success{color:var(--cide-ele-success, #10b981);border-color:var(--cide-ele-success, #10b981)}:host.outline.danger{color:var(--cide-ele-error, #ef4444);border-color:var(--cide-ele-error, #ef4444)}:host.outline.warning{color:var(--cide-ele-warning, #f59e0b);border-color:var(--cide-ele-warning, #f59e0b)}:host.outline.info{color:var(--cide-ele-info, #3b82f6);border-color:var(--cide-ele-info, #3b82f6)}:host.text{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:none;padding-left:.5rem;padding-right:.5rem}:host.text:hover:not(:disabled){background-color:#3b82f60d;text-decoration:underline}:host.text.secondary{color:var(--cide-ele-brand-secondary, #4b5563)}:host.text.success{color:var(--cide-ele-success, #10b981)}:host.text.danger{color:var(--cide-ele-error, #ef4444)}:host.text.warning{color:var(--cide-ele-warning, #f59e0b)}:host.text.info{color:var(--cide-ele-info, #3b82f6)}:host.link{background-color:transparent;color:var(--cide-ele-brand-primary, #3b82f6);border:none;text-decoration:underline;padding:0;font-weight:400}:host.link:hover:not(:disabled){color:var(--cide-ele-brand-primary-hover, #2563eb);text-decoration:underline}:host.link.secondary{color:var(--cide-ele-brand-secondary, #4b5563)}:host.link.success{color:var(--cide-ele-success, #10b981)}:host.link.danger{color:var(--cide-ele-error, #ef4444)}:host.link.warning{color:var(--cide-ele-warning, #f59e0b)}:host.link.info{color:var(--cide-ele-info, #3b82f6)}.tw-icon-container{display:inline-flex;align-items:center;justify-content:center}@media (max-width: 767px){:host.adaptive{padding:.25rem!important;min-width:unset!important;font-size:.875rem!important;line-height:1!important}:host.adaptive .tw-text-base{line-height:1!important}:host.adaptive .btn-label{display:none!important}:host.adaptive .tw-icon-container{margin:0!important}:host.adaptive cide-ele-spinner{margin:0!important}:host.adaptive .tw-p-1{display:none!important}}\n"] }]
|
|
7979
7979
|
}], ctorParameters: () => [{ type: CideElementsService }, { type: i2$1.Router }, { type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { label: [{
|
|
7980
7980
|
type: Input
|
|
7981
7981
|
}], variant: [{
|
|
@@ -10162,7 +10162,7 @@ class CideEleConfirmationModalComponent {
|
|
|
10162
10162
|
</button>
|
|
10163
10163
|
</div>
|
|
10164
10164
|
</div>
|
|
10165
|
-
`, isInline: true, styles: [".confirmation-backdrop{position:fixed;inset:0;background-color:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:10000;display:flex;align-items:center;justify-content:center}[data-theme=dark] .confirmation-backdrop,.dark-mode .confirmation-backdrop{background-color:#000c}.confirmation-modal{background:var(--cide-ele-bg-primary, #ffffff);border-radius:12px;box-shadow:var(--cide-ele-shadow-xl, 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04));max-width:480px;width:90%;max-height:90vh;overflow-y:auto;overflow-x:hidden;z-index:10001;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid var(--cide-ele-border-primary, #e5e7eb);display:flex;flex-direction:column}.modal-header{padding:24px 24px 16px;border-bottom:1px solid var(--cide-ele-border-primary, #e5e7eb);flex-shrink:0}.header-content{display:flex;align-items:center;gap:16px}.icon-container{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.icon-container.danger{background-color:var(--cide-ele-error-light, #fef2f2);color:var(--cide-ele-error, #dc2626)}.icon-container.warning{background-color:var(--cide-ele-warning-light, #fffbeb);color:var(--cide-ele-warning, #d97706)}.icon-container.info{background-color:var(--cide-ele-info-light, #eff6ff);color:var(--cide-ele-info, #2563eb)}.icon-container.success{background-color:var(--cide-ele-success-light, #f0fdf4);color:var(--cide-ele-success, #16a34a)}.modal-title{margin:0;font-size:20px;font-weight:600;color:var(--cide-ele-text-primary, #111827);line-height:1.4}.modal-body{padding:16px 24px 24px;flex:1;overflow-y:auto;min-height:0}.modal-message{margin:0 0 16px;font-size:16px;line-height:1.5;color:var(--cide-ele-text-secondary, #6b7280)}.custom-content{margin-top:16px;padding-top:16px;border-top:1px solid var(--cide-ele-border-primary, #f3f4f6)}.prompt-input-container{margin-top:16px;display:flex;flex-direction:column;gap:8px}.prompt-label{font-size:14px;font-weight:500;color:var(--cide-ele-text-primary, #374151)}.prompt-input{width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--cide-ele-border-secondary, #d1d5db);background-color:var(--cide-ele-bg-primary, #ffffff);color:var(--cide-ele-text-primary, #111827);font-size:14px;transition:all .2s ease}.prompt-input:focus{outline:none;border-color:var(--cide-ele-brand-primary, #2563eb);box-shadow:0 0 0 3px #2563eb1a}.modal-footer{padding:16px 24px 24px;display:flex;gap:12px;justify-content:flex-end;border-top:1px solid var(--cide-ele-border-primary, #e5e7eb);flex-shrink:0}.btn{padding:10px 20px;border-radius:8px;font-size:14px;font-weight:500;border:none;cursor:pointer;transition:all .2s ease;min-width:80px}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-secondary{background-color:var(--cide-ele-bg-secondary, #f9fafb);color:var(--cide-ele-text-primary, #374151);border:1px solid var(--cide-ele-border-secondary, #d1d5db)}.btn-secondary:hover{background-color:var(--cide-ele-bg-hover, #f3f4f6);border-color:var(--cide-ele-border-hover, #9ca3af)}.btn-primary{background-color:var(--cide-ele-brand-primary, #2563eb);color:#fff}.btn-primary:hover{background-color:var(--cide-ele-brand-primary-hover, #1d4ed8)}.btn-danger{background-color:var(--cide-ele-error, #dc2626);color:#fff}.btn-danger:hover{background-color:#b91c1c}.btn-warning{background-color:var(--cide-ele-warning, #d97706);color:#fff}.btn-warning:hover{background-color:#b45309}.btn-success{background-color:var(--cide-ele-success, #16a34a);color:#fff}.btn-success:hover{background-color:#15803d}@media (max-width: 640px){.confirmation-modal{width:calc(100% - 2rem);max-width:calc(100% - 2rem);
|
|
10165
|
+
`, isInline: true, styles: [".confirmation-backdrop{position:fixed;inset:0;background-color:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:10000;display:flex;align-items:center;justify-content:center}[data-theme=dark] .confirmation-backdrop,.dark-mode .confirmation-backdrop{background-color:#000c}.confirmation-modal{background:var(--cide-ele-bg-primary, #ffffff);border-radius:12px;box-shadow:var(--cide-ele-shadow-xl, 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04));max-width:480px;width:90%;max-height:90vh;overflow-y:auto;overflow-x:hidden;z-index:10001;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid var(--cide-ele-border-primary, #e5e7eb);display:flex;flex-direction:column}.modal-header{padding:24px 24px 16px;border-bottom:1px solid var(--cide-ele-border-primary, #e5e7eb);flex-shrink:0}.header-content{display:flex;align-items:center;gap:16px}.icon-container{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.icon-container.danger{background-color:var(--cide-ele-error-light, #fef2f2);color:var(--cide-ele-error, #dc2626)}.icon-container.warning{background-color:var(--cide-ele-warning-light, #fffbeb);color:var(--cide-ele-warning, #d97706)}.icon-container.info{background-color:var(--cide-ele-info-light, #eff6ff);color:var(--cide-ele-info, #2563eb)}.icon-container.success{background-color:var(--cide-ele-success-light, #f0fdf4);color:var(--cide-ele-success, #16a34a)}.modal-title{margin:0;font-size:20px;font-weight:600;color:var(--cide-ele-text-primary, #111827);line-height:1.4}.modal-body{padding:16px 24px 24px;flex:1;overflow-y:auto;min-height:0}.modal-message{margin:0 0 16px;font-size:16px;line-height:1.5;color:var(--cide-ele-text-secondary, #6b7280)}.custom-content{margin-top:16px;padding-top:16px;border-top:1px solid var(--cide-ele-border-primary, #f3f4f6)}.prompt-input-container{margin-top:16px;display:flex;flex-direction:column;gap:8px}.prompt-label{font-size:14px;font-weight:500;color:var(--cide-ele-text-primary, #374151)}.prompt-input{width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--cide-ele-border-secondary, #d1d5db);background-color:var(--cide-ele-bg-primary, #ffffff);color:var(--cide-ele-text-primary, #111827);font-size:14px;transition:all .2s ease}.prompt-input:focus{outline:none;border-color:var(--cide-ele-brand-primary, #2563eb);box-shadow:0 0 0 3px #2563eb1a}.modal-footer{padding:16px 24px 24px;display:flex;gap:12px;justify-content:flex-end;border-top:1px solid var(--cide-ele-border-primary, #e5e7eb);flex-shrink:0}.btn{padding:10px 20px;border-radius:8px;font-size:14px;font-weight:500;border:none;cursor:pointer;transition:all .2s ease;min-width:80px}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-secondary{background-color:var(--cide-ele-bg-secondary, #f9fafb);color:var(--cide-ele-text-primary, #374151);border:1px solid var(--cide-ele-border-secondary, #d1d5db)}.btn-secondary:hover{background-color:var(--cide-ele-bg-hover, #f3f4f6);border-color:var(--cide-ele-border-hover, #9ca3af)}.btn-primary{background-color:var(--cide-ele-brand-primary, #2563eb);color:#fff}.btn-primary:hover{background-color:var(--cide-ele-brand-primary-hover, #1d4ed8)}.btn-danger{background-color:var(--cide-ele-error, #dc2626);color:#fff}.btn-danger:hover{background-color:#b91c1c}.btn-warning{background-color:var(--cide-ele-warning, #d97706);color:#fff}.btn-warning:hover{background-color:#b45309}.btn-success{background-color:var(--cide-ele-success, #16a34a);color:#fff}.btn-success:hover{background-color:#15803d}@media (max-width: 640px){.confirmation-modal{width:calc(100% - 2rem);max-width:calc(100% - 2rem);top:50%;left:50%;transform:translate(-50%,-50%);max-height:calc(100vh - 2rem);position:fixed}.modal-header{padding:16px 16px 12px}.modal-body{padding:12px 16px 16px;flex:1;overflow-y:auto}.modal-footer{padding:12px 16px 16px;flex-direction:column-reverse;gap:8px;flex-shrink:0}.btn{width:100%;justify-content:center}.header-content{flex-direction:column;text-align:center;gap:12px}.modal-title{font-size:18px}.modal-message{font-size:14px}}@media (max-width: 480px){.confirmation-modal{width:calc(100% - 1rem);max-width:calc(100% - 1rem);border-radius:8px}.modal-header{padding:12px 12px 8px}.modal-body,.modal-footer{padding:8px 12px 12px}.icon-container{width:40px;height:40px}.modal-title{font-size:16px}.modal-message{font-size:13px}}.btn:focus{outline:2px solid var(--cide-ele-brand-primary, #2563eb);outline-offset:2px}.modal-enter{opacity:0;transform:scale(.95) translateY(-10px)}.modal-enter-active{opacity:1;transform:scale(1) translateY(0);transition:all .2s ease-out}.modal-exit{opacity:1;transform:scale(1) translateY(0)}.modal-exit-active{opacity:0;transform:scale(.95) translateY(-10px);transition:all .15s ease-in}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
10166
10166
|
}
|
|
10167
10167
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideEleConfirmationModalComponent, decorators: [{
|
|
10168
10168
|
type: Component,
|
|
@@ -10236,7 +10236,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
10236
10236
|
</button>
|
|
10237
10237
|
</div>
|
|
10238
10238
|
</div>
|
|
10239
|
-
`, styles: [".confirmation-backdrop{position:fixed;inset:0;background-color:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:10000;display:flex;align-items:center;justify-content:center}[data-theme=dark] .confirmation-backdrop,.dark-mode .confirmation-backdrop{background-color:#000c}.confirmation-modal{background:var(--cide-ele-bg-primary, #ffffff);border-radius:12px;box-shadow:var(--cide-ele-shadow-xl, 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04));max-width:480px;width:90%;max-height:90vh;overflow-y:auto;overflow-x:hidden;z-index:10001;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid var(--cide-ele-border-primary, #e5e7eb);display:flex;flex-direction:column}.modal-header{padding:24px 24px 16px;border-bottom:1px solid var(--cide-ele-border-primary, #e5e7eb);flex-shrink:0}.header-content{display:flex;align-items:center;gap:16px}.icon-container{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.icon-container.danger{background-color:var(--cide-ele-error-light, #fef2f2);color:var(--cide-ele-error, #dc2626)}.icon-container.warning{background-color:var(--cide-ele-warning-light, #fffbeb);color:var(--cide-ele-warning, #d97706)}.icon-container.info{background-color:var(--cide-ele-info-light, #eff6ff);color:var(--cide-ele-info, #2563eb)}.icon-container.success{background-color:var(--cide-ele-success-light, #f0fdf4);color:var(--cide-ele-success, #16a34a)}.modal-title{margin:0;font-size:20px;font-weight:600;color:var(--cide-ele-text-primary, #111827);line-height:1.4}.modal-body{padding:16px 24px 24px;flex:1;overflow-y:auto;min-height:0}.modal-message{margin:0 0 16px;font-size:16px;line-height:1.5;color:var(--cide-ele-text-secondary, #6b7280)}.custom-content{margin-top:16px;padding-top:16px;border-top:1px solid var(--cide-ele-border-primary, #f3f4f6)}.prompt-input-container{margin-top:16px;display:flex;flex-direction:column;gap:8px}.prompt-label{font-size:14px;font-weight:500;color:var(--cide-ele-text-primary, #374151)}.prompt-input{width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--cide-ele-border-secondary, #d1d5db);background-color:var(--cide-ele-bg-primary, #ffffff);color:var(--cide-ele-text-primary, #111827);font-size:14px;transition:all .2s ease}.prompt-input:focus{outline:none;border-color:var(--cide-ele-brand-primary, #2563eb);box-shadow:0 0 0 3px #2563eb1a}.modal-footer{padding:16px 24px 24px;display:flex;gap:12px;justify-content:flex-end;border-top:1px solid var(--cide-ele-border-primary, #e5e7eb);flex-shrink:0}.btn{padding:10px 20px;border-radius:8px;font-size:14px;font-weight:500;border:none;cursor:pointer;transition:all .2s ease;min-width:80px}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-secondary{background-color:var(--cide-ele-bg-secondary, #f9fafb);color:var(--cide-ele-text-primary, #374151);border:1px solid var(--cide-ele-border-secondary, #d1d5db)}.btn-secondary:hover{background-color:var(--cide-ele-bg-hover, #f3f4f6);border-color:var(--cide-ele-border-hover, #9ca3af)}.btn-primary{background-color:var(--cide-ele-brand-primary, #2563eb);color:#fff}.btn-primary:hover{background-color:var(--cide-ele-brand-primary-hover, #1d4ed8)}.btn-danger{background-color:var(--cide-ele-error, #dc2626);color:#fff}.btn-danger:hover{background-color:#b91c1c}.btn-warning{background-color:var(--cide-ele-warning, #d97706);color:#fff}.btn-warning:hover{background-color:#b45309}.btn-success{background-color:var(--cide-ele-success, #16a34a);color:#fff}.btn-success:hover{background-color:#15803d}@media (max-width: 640px){.confirmation-modal{width:calc(100% - 2rem);max-width:calc(100% - 2rem);
|
|
10239
|
+
`, styles: [".confirmation-backdrop{position:fixed;inset:0;background-color:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:10000;display:flex;align-items:center;justify-content:center}[data-theme=dark] .confirmation-backdrop,.dark-mode .confirmation-backdrop{background-color:#000c}.confirmation-modal{background:var(--cide-ele-bg-primary, #ffffff);border-radius:12px;box-shadow:var(--cide-ele-shadow-xl, 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04));max-width:480px;width:90%;max-height:90vh;overflow-y:auto;overflow-x:hidden;z-index:10001;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid var(--cide-ele-border-primary, #e5e7eb);display:flex;flex-direction:column}.modal-header{padding:24px 24px 16px;border-bottom:1px solid var(--cide-ele-border-primary, #e5e7eb);flex-shrink:0}.header-content{display:flex;align-items:center;gap:16px}.icon-container{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.icon-container.danger{background-color:var(--cide-ele-error-light, #fef2f2);color:var(--cide-ele-error, #dc2626)}.icon-container.warning{background-color:var(--cide-ele-warning-light, #fffbeb);color:var(--cide-ele-warning, #d97706)}.icon-container.info{background-color:var(--cide-ele-info-light, #eff6ff);color:var(--cide-ele-info, #2563eb)}.icon-container.success{background-color:var(--cide-ele-success-light, #f0fdf4);color:var(--cide-ele-success, #16a34a)}.modal-title{margin:0;font-size:20px;font-weight:600;color:var(--cide-ele-text-primary, #111827);line-height:1.4}.modal-body{padding:16px 24px 24px;flex:1;overflow-y:auto;min-height:0}.modal-message{margin:0 0 16px;font-size:16px;line-height:1.5;color:var(--cide-ele-text-secondary, #6b7280)}.custom-content{margin-top:16px;padding-top:16px;border-top:1px solid var(--cide-ele-border-primary, #f3f4f6)}.prompt-input-container{margin-top:16px;display:flex;flex-direction:column;gap:8px}.prompt-label{font-size:14px;font-weight:500;color:var(--cide-ele-text-primary, #374151)}.prompt-input{width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--cide-ele-border-secondary, #d1d5db);background-color:var(--cide-ele-bg-primary, #ffffff);color:var(--cide-ele-text-primary, #111827);font-size:14px;transition:all .2s ease}.prompt-input:focus{outline:none;border-color:var(--cide-ele-brand-primary, #2563eb);box-shadow:0 0 0 3px #2563eb1a}.modal-footer{padding:16px 24px 24px;display:flex;gap:12px;justify-content:flex-end;border-top:1px solid var(--cide-ele-border-primary, #e5e7eb);flex-shrink:0}.btn{padding:10px 20px;border-radius:8px;font-size:14px;font-weight:500;border:none;cursor:pointer;transition:all .2s ease;min-width:80px}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-secondary{background-color:var(--cide-ele-bg-secondary, #f9fafb);color:var(--cide-ele-text-primary, #374151);border:1px solid var(--cide-ele-border-secondary, #d1d5db)}.btn-secondary:hover{background-color:var(--cide-ele-bg-hover, #f3f4f6);border-color:var(--cide-ele-border-hover, #9ca3af)}.btn-primary{background-color:var(--cide-ele-brand-primary, #2563eb);color:#fff}.btn-primary:hover{background-color:var(--cide-ele-brand-primary-hover, #1d4ed8)}.btn-danger{background-color:var(--cide-ele-error, #dc2626);color:#fff}.btn-danger:hover{background-color:#b91c1c}.btn-warning{background-color:var(--cide-ele-warning, #d97706);color:#fff}.btn-warning:hover{background-color:#b45309}.btn-success{background-color:var(--cide-ele-success, #16a34a);color:#fff}.btn-success:hover{background-color:#15803d}@media (max-width: 640px){.confirmation-modal{width:calc(100% - 2rem);max-width:calc(100% - 2rem);top:50%;left:50%;transform:translate(-50%,-50%);max-height:calc(100vh - 2rem);position:fixed}.modal-header{padding:16px 16px 12px}.modal-body{padding:12px 16px 16px;flex:1;overflow-y:auto}.modal-footer{padding:12px 16px 16px;flex-direction:column-reverse;gap:8px;flex-shrink:0}.btn{width:100%;justify-content:center}.header-content{flex-direction:column;text-align:center;gap:12px}.modal-title{font-size:18px}.modal-message{font-size:14px}}@media (max-width: 480px){.confirmation-modal{width:calc(100% - 1rem);max-width:calc(100% - 1rem);border-radius:8px}.modal-header{padding:12px 12px 8px}.modal-body,.modal-footer{padding:8px 12px 12px}.icon-container{width:40px;height:40px}.modal-title{font-size:16px}.modal-message{font-size:13px}}.btn:focus{outline:2px solid var(--cide-ele-brand-primary, #2563eb);outline-offset:2px}.modal-enter{opacity:0;transform:scale(.95) translateY(-10px)}.modal-enter-active{opacity:1;transform:scale(1) translateY(0);transition:all .2s ease-out}.modal-exit{opacity:1;transform:scale(1) translateY(0)}.modal-exit-active{opacity:0;transform:scale(.95) translateY(-10px);transition:all .15s ease-in}\n"] }]
|
|
10240
10240
|
}] });
|
|
10241
10241
|
|
|
10242
10242
|
class CideEleToastNotificationComponent {
|
|
@@ -10326,7 +10326,7 @@ class CideEleToastNotificationComponent {
|
|
|
10326
10326
|
</div>
|
|
10327
10327
|
</div>
|
|
10328
10328
|
</div>
|
|
10329
|
-
`, isInline: true, styles: [".toast-container{position:fixed;top:
|
|
10329
|
+
`, isInline: true, styles: [".toast-container{position:fixed;top:auto;bottom:20px;right:20px;z-index:9990;display:flex;flex-direction:column-reverse;gap:12px;max-width:400px;width:100%}.toast-notification{background:var(--cide-ele-bg-primary, #ffffff);border-radius:8px;box-shadow:var(--cide-ele-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05));border:1px solid var(--cide-ele-border-primary, #e5e7eb);overflow:hidden;position:relative;animation:slideInRight .3s ease-out}.toast-notification.success{border-left:4px solid var(--cide-ele-success, #16a34a)}.toast-notification.error{border-left:4px solid var(--cide-ele-error, #dc2626)}.toast-notification.warning{border-left:4px solid var(--cide-ele-warning, #d97706)}.toast-notification.info{border-left:4px solid var(--cide-ele-info, #2563eb)}.toast-content{display:flex;align-items:flex-start;gap:12px;padding:16px}.toast-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}.toast-icon.success{background-color:var(--cide-ele-success-light, #f0fdf4);color:var(--cide-ele-success, #16a34a)}.toast-icon.error{background-color:var(--cide-ele-error-light, #fef2f2);color:var(--cide-ele-error, #dc2626)}.toast-icon.warning{background-color:var(--cide-ele-warning-light, #fffbeb);color:var(--cide-ele-warning, #d97706)}.toast-icon.info{background-color:var(--cide-ele-info-light, #eff6ff);color:var(--cide-ele-info, #2563eb)}.toast-text{flex:1;min-width:0}.toast-title{font-size:14px;font-weight:600;color:var(--cide-ele-text-primary, #111827);margin-bottom:4px;line-height:1.4}.toast-message{font-size:14px;color:var(--cide-ele-text-secondary, #6b7280);line-height:1.4}.toast-close{background:none;border:none;color:var(--cide-ele-text-tertiary, #9ca3af);cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;flex-shrink:0}.toast-close:hover{background-color:var(--cide-ele-bg-hover, #f3f4f6);color:var(--cide-ele-text-secondary, #6b7280)}.toast-actions{padding:0 16px 16px;display:flex;justify-content:flex-end}.toast-undo-btn{background:none;border:none;color:var(--cide-ele-brand-primary, #2563eb);font-size:14px;font-weight:500;cursor:pointer;padding:8px 12px;border-radius:6px;transition:all .2s ease}.toast-undo-btn:hover{background-color:var(--cide-ele-brand-primary-light, #eff6ff)}.toast-progress{position:absolute;bottom:0;left:0;height:3px;background-color:var(--cide-ele-border-primary, #e5e7eb);animation:progressShrink linear forwards}.toast-notification.success .toast-progress{background-color:var(--cide-ele-success, #16a34a)}.toast-notification.error .toast-progress{background-color:var(--cide-ele-error, #dc2626)}.toast-notification.warning .toast-progress{background-color:var(--cide-ele-warning, #d97706)}.toast-notification.info .toast-progress{background-color:var(--cide-ele-info, #2563eb)}.toast-custom-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background-color:var(--cide-ele-border-primary, #e5e7eb);overflow:hidden}.toast-custom-progress-bar{height:100%;background-color:var(--cide-ele-info, #2563eb);transition:width .3s ease;border-radius:0 3px 0 0}.toast-notification.success .toast-custom-progress-bar{background-color:var(--cide-ele-success, #16a34a)}.toast-notification.error .toast-custom-progress-bar{background-color:var(--cide-ele-error, #dc2626)}.toast-notification.warning .toast-custom-progress-bar{background-color:var(--cide-ele-warning, #d97706)}.toast-notification.info .toast-custom-progress-bar{background-color:var(--cide-ele-info, #2563eb)}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOutRight{0%{transform:translate(0);opacity:1}to{transform:translate(100%);opacity:0}}@keyframes progressShrink{0%{width:100%}to{width:0%}}@media (max-width: 640px){.toast-container{inset:auto 10px 20px;max-width:none;flex-direction:column-reverse}.toast-notification{border-radius:8px;box-shadow:0 -4px 10px #0000001a}.toast-content{padding:10px;gap:10px;align-items:center}.toast-title{font-size:13px;margin-bottom:2px}.toast-message{font-size:12px;line-height:1.3}.toast-icon{width:20px;height:20px}.toast-actions{padding:0 10px 10px}}.toast-close:focus,.toast-undo-btn:focus{outline:2px solid var(--cide-ele-brand-primary, #2563eb);outline-offset:2px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }], animations: [
|
|
10330
10330
|
trigger('toastAnimation', [
|
|
10331
10331
|
state('void', style({
|
|
10332
10332
|
transform: 'translateX(100%)',
|
|
@@ -10422,7 +10422,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
10422
10422
|
transition('void => *', animate('300ms ease-out')),
|
|
10423
10423
|
transition('* => void', animate('200ms ease-in'))
|
|
10424
10424
|
])
|
|
10425
|
-
], styles: [".toast-container{position:fixed;top:
|
|
10425
|
+
], styles: [".toast-container{position:fixed;top:auto;bottom:20px;right:20px;z-index:9990;display:flex;flex-direction:column-reverse;gap:12px;max-width:400px;width:100%}.toast-notification{background:var(--cide-ele-bg-primary, #ffffff);border-radius:8px;box-shadow:var(--cide-ele-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05));border:1px solid var(--cide-ele-border-primary, #e5e7eb);overflow:hidden;position:relative;animation:slideInRight .3s ease-out}.toast-notification.success{border-left:4px solid var(--cide-ele-success, #16a34a)}.toast-notification.error{border-left:4px solid var(--cide-ele-error, #dc2626)}.toast-notification.warning{border-left:4px solid var(--cide-ele-warning, #d97706)}.toast-notification.info{border-left:4px solid var(--cide-ele-info, #2563eb)}.toast-content{display:flex;align-items:flex-start;gap:12px;padding:16px}.toast-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}.toast-icon.success{background-color:var(--cide-ele-success-light, #f0fdf4);color:var(--cide-ele-success, #16a34a)}.toast-icon.error{background-color:var(--cide-ele-error-light, #fef2f2);color:var(--cide-ele-error, #dc2626)}.toast-icon.warning{background-color:var(--cide-ele-warning-light, #fffbeb);color:var(--cide-ele-warning, #d97706)}.toast-icon.info{background-color:var(--cide-ele-info-light, #eff6ff);color:var(--cide-ele-info, #2563eb)}.toast-text{flex:1;min-width:0}.toast-title{font-size:14px;font-weight:600;color:var(--cide-ele-text-primary, #111827);margin-bottom:4px;line-height:1.4}.toast-message{font-size:14px;color:var(--cide-ele-text-secondary, #6b7280);line-height:1.4}.toast-close{background:none;border:none;color:var(--cide-ele-text-tertiary, #9ca3af);cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;flex-shrink:0}.toast-close:hover{background-color:var(--cide-ele-bg-hover, #f3f4f6);color:var(--cide-ele-text-secondary, #6b7280)}.toast-actions{padding:0 16px 16px;display:flex;justify-content:flex-end}.toast-undo-btn{background:none;border:none;color:var(--cide-ele-brand-primary, #2563eb);font-size:14px;font-weight:500;cursor:pointer;padding:8px 12px;border-radius:6px;transition:all .2s ease}.toast-undo-btn:hover{background-color:var(--cide-ele-brand-primary-light, #eff6ff)}.toast-progress{position:absolute;bottom:0;left:0;height:3px;background-color:var(--cide-ele-border-primary, #e5e7eb);animation:progressShrink linear forwards}.toast-notification.success .toast-progress{background-color:var(--cide-ele-success, #16a34a)}.toast-notification.error .toast-progress{background-color:var(--cide-ele-error, #dc2626)}.toast-notification.warning .toast-progress{background-color:var(--cide-ele-warning, #d97706)}.toast-notification.info .toast-progress{background-color:var(--cide-ele-info, #2563eb)}.toast-custom-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background-color:var(--cide-ele-border-primary, #e5e7eb);overflow:hidden}.toast-custom-progress-bar{height:100%;background-color:var(--cide-ele-info, #2563eb);transition:width .3s ease;border-radius:0 3px 0 0}.toast-notification.success .toast-custom-progress-bar{background-color:var(--cide-ele-success, #16a34a)}.toast-notification.error .toast-custom-progress-bar{background-color:var(--cide-ele-error, #dc2626)}.toast-notification.warning .toast-custom-progress-bar{background-color:var(--cide-ele-warning, #d97706)}.toast-notification.info .toast-custom-progress-bar{background-color:var(--cide-ele-info, #2563eb)}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOutRight{0%{transform:translate(0);opacity:1}to{transform:translate(100%);opacity:0}}@keyframes progressShrink{0%{width:100%}to{width:0%}}@media (max-width: 640px){.toast-container{inset:auto 10px 20px;max-width:none;flex-direction:column-reverse}.toast-notification{border-radius:8px;box-shadow:0 -4px 10px #0000001a}.toast-content{padding:10px;gap:10px;align-items:center}.toast-title{font-size:13px;margin-bottom:2px}.toast-message{font-size:12px;line-height:1.3}.toast-icon{width:20px;height:20px}.toast-actions{padding:0 10px 10px}}.toast-close:focus,.toast-undo-btn:focus{outline:2px solid var(--cide-ele-brand-primary, #2563eb);outline-offset:2px}\n"] }]
|
|
10426
10426
|
}] });
|
|
10427
10427
|
|
|
10428
10428
|
class CideEleGlobalNotificationsComponent {
|