@eagami/ui 2.11.0 → 2.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/eagami-ui.mjs +208 -32
- package/fesm2022/eagami-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/src/styles/_tooltip.scss +3 -0
- package/types/eagami-ui.d.ts +43 -8
package/fesm2022/eagami-ui.mjs
CHANGED
|
@@ -2808,6 +2808,8 @@ class TooltipDirective {
|
|
|
2808
2808
|
renderer = inject(Renderer2);
|
|
2809
2809
|
eaTooltip = input.required(...(ngDevMode ? [{ debugName: "eaTooltip" }] : /* istanbul ignore next */ []));
|
|
2810
2810
|
tooltipPosition = input('top', ...(ngDevMode ? [{ debugName: "tooltipPosition" }] : /* istanbul ignore next */ []));
|
|
2811
|
+
/** Max width in px; the text wraps at this width. Clamped to a 50px floor. */
|
|
2812
|
+
maxWidth = input(undefined, ...(ngDevMode ? [{ debugName: "maxWidth" }] : /* istanbul ignore next */ []));
|
|
2811
2813
|
tooltipEl = null;
|
|
2812
2814
|
tooltipId = `ea-tooltip-${Math.random().toString(36).slice(2, 9)}`;
|
|
2813
2815
|
// Touch devices fire `mouseenter` on tap but never fire `mouseleave` until
|
|
@@ -2830,8 +2832,11 @@ class TooltipDirective {
|
|
|
2830
2832
|
open even though the user has moved their cursor away. `:focus-visible`
|
|
2831
2833
|
is the browser's signal for "keyboard activation", which is exactly
|
|
2832
2834
|
when a tooltip on focus is welcome. */
|
|
2833
|
-
focusHandler = () => {
|
|
2834
|
-
|
|
2835
|
+
focusHandler = (event) => {
|
|
2836
|
+
// focusin bubbles, so the focused element may be a child of the host (e.g. the
|
|
2837
|
+
// inner <button> of <ea-button>); test it, not the host, for keyboard focus.
|
|
2838
|
+
const target = event.target;
|
|
2839
|
+
if (!this.supportsFocusVisible || target.matches(':focus-visible')) {
|
|
2835
2840
|
this.show();
|
|
2836
2841
|
}
|
|
2837
2842
|
};
|
|
@@ -2867,9 +2872,10 @@ class TooltipDirective {
|
|
|
2867
2872
|
resizeObserver = null;
|
|
2868
2873
|
constructor() {
|
|
2869
2874
|
const native = this.el.nativeElement;
|
|
2870
|
-
//
|
|
2871
|
-
|
|
2872
|
-
native.addEventListener('
|
|
2875
|
+
// focusin/focusout (not focus/blur) so the tooltip still shows when the host
|
|
2876
|
+
// wraps the focusable element (focus does not bubble; focusin does).
|
|
2877
|
+
native.addEventListener('focusin', this.focusHandler);
|
|
2878
|
+
native.addEventListener('focusout', this.hideHandler);
|
|
2873
2879
|
native.addEventListener('keydown', this.keydownHandler);
|
|
2874
2880
|
this.syncPointerListeners(this.hoverMql?.matches ?? true);
|
|
2875
2881
|
this.hoverMql?.addEventListener('change', this.hoverChangeHandler);
|
|
@@ -2878,8 +2884,8 @@ class TooltipDirective {
|
|
|
2878
2884
|
const native = this.el.nativeElement;
|
|
2879
2885
|
native.removeEventListener('mouseenter', this.showHandler);
|
|
2880
2886
|
native.removeEventListener('mouseleave', this.hideHandler);
|
|
2881
|
-
native.removeEventListener('
|
|
2882
|
-
native.removeEventListener('
|
|
2887
|
+
native.removeEventListener('focusin', this.focusHandler);
|
|
2888
|
+
native.removeEventListener('focusout', this.hideHandler);
|
|
2883
2889
|
native.removeEventListener('keydown', this.keydownHandler);
|
|
2884
2890
|
this.hoverMql?.removeEventListener('change', this.hoverChangeHandler);
|
|
2885
2891
|
this.hide();
|
|
@@ -2908,6 +2914,11 @@ class TooltipDirective {
|
|
|
2908
2914
|
this.renderer.setAttribute(this.tooltipEl, 'role', 'tooltip');
|
|
2909
2915
|
this.renderer.setAttribute(this.tooltipEl, 'id', this.tooltipId);
|
|
2910
2916
|
this.tooltipEl.textContent = this.eaTooltip();
|
|
2917
|
+
const maxWidth = this.maxWidth();
|
|
2918
|
+
if (maxWidth != null) {
|
|
2919
|
+
this.renderer.setStyle(this.tooltipEl, 'max-width', `${Math.max(50, maxWidth)}px`);
|
|
2920
|
+
this.renderer.setStyle(this.tooltipEl, 'white-space', 'normal');
|
|
2921
|
+
}
|
|
2911
2922
|
this.renderer.appendChild(document.body, this.tooltipEl);
|
|
2912
2923
|
this.appendDescribedBy();
|
|
2913
2924
|
this.positionTooltip();
|
|
@@ -3033,14 +3044,14 @@ class TooltipDirective {
|
|
|
3033
3044
|
this.renderer.setStyle(this.tooltipEl, 'left', `${left + window.scrollX}px`);
|
|
3034
3045
|
}
|
|
3035
3046
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: TooltipDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
3036
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.16", type: TooltipDirective, isStandalone: true, selector: "[eaTooltip]", inputs: { eaTooltip: { classPropertyName: "eaTooltip", publicName: "eaTooltip", isSignal: true, isRequired: true, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
|
|
3047
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.16", type: TooltipDirective, isStandalone: true, selector: "[eaTooltip]", inputs: { eaTooltip: { classPropertyName: "eaTooltip", publicName: "eaTooltip", isSignal: true, isRequired: true, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
|
|
3037
3048
|
}
|
|
3038
3049
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: TooltipDirective, decorators: [{
|
|
3039
3050
|
type: Directive,
|
|
3040
3051
|
args: [{
|
|
3041
3052
|
selector: '[eaTooltip]',
|
|
3042
3053
|
}]
|
|
3043
|
-
}], ctorParameters: () => [], propDecorators: { eaTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "eaTooltip", required: true }] }], tooltipPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipPosition", required: false }] }] } });
|
|
3054
|
+
}], ctorParameters: () => [], propDecorators: { eaTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "eaTooltip", required: true }] }], tooltipPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipPosition", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }] } });
|
|
3044
3055
|
|
|
3045
3056
|
/**
|
|
3046
3057
|
* Canvas-based image editor for cropping avatars. Supports drag-and-drop
|
|
@@ -3602,7 +3613,7 @@ class AvatarEditorComponent {
|
|
|
3602
3613
|
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
3603
3614
|
}
|
|
3604
3615
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: AvatarEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3605
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: AvatarEditorComponent, isStandalone: true, selector: "ea-avatar-editor", inputs: { shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, canvasSize: { classPropertyName: "canvasSize", publicName: "canvasSize", isSignal: true, isRequired: false, transformFunction: null }, currentSrc: { classPropertyName: "currentSrc", publicName: "currentSrc", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, minZoom: { classPropertyName: "minZoom", publicName: "minZoom", isSignal: true, isRequired: false, transformFunction: null }, maxZoom: { classPropertyName: "maxZoom", publicName: "maxZoom", isSignal: true, isRequired: false, transformFunction: null }, exportQuality: { classPropertyName: "exportQuality", publicName: "exportQuality", isSignal: true, isRequired: false, transformFunction: null }, exportType: { classPropertyName: "exportType", publicName: "exportType", isSignal: true, isRequired: false, transformFunction: null }, cropState: { classPropertyName: "cropState", publicName: "cropState", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cropped: "cropped", fileSelected: "fileSelected", removed: "removed", errored: "errored", cropStateChanged: "cropStateChanged" }, viewQueries: [{ propertyName: "canvasEl", first: true, predicate: ["canvasEl"], descendants: true, isSignal: true }, { propertyName: "fileInputEl", first: true, predicate: ["fileInputEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n class=\"ea-avatar-editor\"\n [ngClass]=\"hostClasses()\">\n <input\n #fileInputEl\n type=\"file\"\n class=\"ea-avatar-editor__file-input\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.upload\"\n [accept]=\"accept()\"\n (change)=\"onFileSelected($event)\" />\n\n @if (!hasImage() && !isLoading()) {\n <button\n type=\"button\"\n class=\"ea-avatar-editor__dropzone\"\n [style.width.px]=\"canvasSize()\"\n [style.height.px]=\"canvasSize()\"\n (click)=\"openFilePicker()\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\">\n <ea-icon-upload class=\"ea-avatar-editor__upload-icon\" />\n <span class=\"ea-avatar-editor__dropzone-text\">\n {{ i18n.messages().avatarEditor.dropzone }}\n </span>\n </button>\n }\n\n @if (hasImage() || isLoading()) {\n <div\n class=\"ea-avatar-editor__canvas-wrapper\"\n [style.width.px]=\"canvasSize()\"\n [style.height.px]=\"canvasSize()\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\">\n @if (isLoading()) {\n <ea-skeleton\n [variant]=\"shape() === 'circle' ? 'circle' : 'rect'\"\n [width]=\"canvasSize() + 'px'\"\n [height]=\"canvasSize() + 'px'\" />\n }\n\n @if (hasImage()) {\n <canvas\n #canvasEl\n class=\"ea-avatar-editor__canvas\"\n role=\"img\"\n tabindex=\"0\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.canvas\"\n [style.display]=\"isLoading() ? 'none' : 'block'\"\n [width]=\"canvasSize()\"\n [height]=\"canvasSize()\"\n (mousedown)=\"onMouseDown($event)\"\n (touchstart)=\"onTouchStart($event)\"\n (keydown)=\"onCanvasKeydown($event)\"></canvas>\n\n @if (!isLoading()) {\n <div\n class=\"ea-avatar-editor__canvas-overlay\"\n [class.ea-avatar-editor__canvas-overlay--on-light]=\"!isImageDark()\">\n <ea-icon-camera class=\"ea-avatar-editor__overlay-icon\" />\n <span>{{ i18n.messages().avatarEditor.change }}</span>\n </div>\n }\n }\n </div>\n }\n\n <div class=\"ea-avatar-editor__controls\">\n <button\n type=\"button\"\n class=\"ea-avatar-editor__icon-btn\"\n [eaTooltip]=\"i18n.messages().avatarEditor.revert\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.revert\"\n [disabled]=\"!canRevert() || isLoading()\"\n (click)=\"revertImage()\">\n <ea-icon-rotate-ccw />\n </button>\n\n <button\n type=\"button\"\n class=\"ea-avatar-editor__icon-btn\"\n [eaTooltip]=\"i18n.messages().avatarEditor.zoomOut\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.zoomOut\"\n [disabled]=\"!hasImage() || isLoading() || zoom() <= minZoom()\"\n (click)=\"setZoom(zoom() - 0.1)\">\n <ea-icon-minus />\n </button>\n\n <input\n type=\"range\"\n class=\"ea-avatar-editor__zoom-slider\"\n [min]=\"minZoom()\"\n [max]=\"maxZoom()\"\n step=\"0.01\"\n [value]=\"zoom()\"\n [disabled]=\"!hasImage() || isLoading()\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.zoom\"\n (input)=\"onZoomInput($event)\" />\n\n <button\n type=\"button\"\n class=\"ea-avatar-editor__icon-btn\"\n [eaTooltip]=\"i18n.messages().avatarEditor.zoomIn\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.zoomIn\"\n [disabled]=\"!hasImage() || isLoading() || zoom() >= maxZoom()\"\n (click)=\"setZoom(zoom() + 0.1)\">\n <ea-icon-plus />\n </button>\n\n <button\n type=\"button\"\n class=\"ea-avatar-editor__icon-btn ea-avatar-editor__icon-btn--danger\"\n [eaTooltip]=\"i18n.messages().avatarEditor.remove\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.remove\"\n [disabled]=\"!hasImage() || isLoading()\"\n (click)=\"removeImage()\">\n <ea-icon-trash />\n </button>\n </div>\n</div>\n", styles: [".ea-avatar-editor{display:inline-flex;flex-direction:column;align-items:center;gap:var(--space-3);font-family:var(--font-family-sans)}.ea-avatar-editor__file-input{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;margin:-1px;border:0;white-space:nowrap;clip:rect(0,0,0,0);clip-path:inset(50%)}.ea-avatar-editor__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-4);font-family:inherit;font-size:var(--font-size-sm);line-height:var(--line-height-normal);border:2px dashed var(--color-border-default);border-radius:var(--radius-lg);background-color:var(--color-bg-subtle);color:var(--color-text-tertiary);cursor:pointer;transition:var(--transition-colors)}.ea-avatar-editor__dropzone:hover{border-color:var(--color-border-focus);background-color:var(--color-state-hover);color:var(--color-text-secondary)}.ea-avatar-editor__dropzone:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor--drag-over .ea-avatar-editor__dropzone{border-color:var(--color-primary-500);background-color:var(--color-primary-50);color:var(--color-primary-600)}.ea-avatar-editor--circle .ea-avatar-editor__dropzone{border-radius:var(--radius-full)}.ea-avatar-editor__upload-icon{width:32px;height:32px;opacity:.6}.ea-avatar-editor__dropzone-text{text-align:center}.ea-avatar-editor--compact .ea-avatar-editor__dropzone{gap:var(--space-1-5);padding:var(--space-3);font-size:.75rem;line-height:1.35}.ea-avatar-editor--compact .ea-avatar-editor__upload-icon{width:24px;height:24px}.ea-avatar-editor--ultra-compact .ea-avatar-editor__dropzone{gap:var(--space-1);padding:var(--space-2);font-size:.625rem;line-height:1.2}.ea-avatar-editor--ultra-compact .ea-avatar-editor__upload-icon{width:16px;height:16px}.ea-avatar-editor__canvas-wrapper{position:relative;overflow:hidden;border-radius:var(--radius-lg)}.ea-avatar-editor--circle .ea-avatar-editor__canvas-wrapper{border-radius:var(--radius-full)}.ea-avatar-editor__canvas{display:block;cursor:grab}.ea-avatar-editor__canvas:active{cursor:grabbing}.ea-avatar-editor__canvas-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-neutral-0);opacity:0;pointer-events:none;transition:opacity var(--duration-fast) var(--easing-default),color var(--duration-fast) var(--easing-default)}.ea-avatar-editor__canvas-overlay--on-light{color:var(--color-neutral-950)}.ea-avatar-editor__overlay-icon{width:24px;height:24px}.ea-avatar-editor__canvas-wrapper:hover .ea-avatar-editor__canvas-overlay{opacity:1}.ea-avatar-editor__controls{display:flex;align-items:center;gap:var(--space-2)}.ea-avatar-editor__icon-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0}.ea-avatar-editor__icon-btn ea-icon-rotate-ccw,.ea-avatar-editor__icon-btn ea-icon-minus,.ea-avatar-editor__icon-btn ea-icon-plus,.ea-avatar-editor__icon-btn ea-icon-trash{width:1rem;height:1rem}.ea-avatar-editor__icon-btn{border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-avatar-editor__icon-btn:hover:not(:disabled){border-color:var(--color-border-focus)}.ea-avatar-editor__icon-btn:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor__icon-btn:disabled{opacity:.4;cursor:not-allowed}.ea-avatar-editor__icon-btn--danger{color:var(--color-error-default)}.ea-avatar-editor__icon-btn--danger:hover:not(:disabled){border-color:var(--color-error-default)}.ea-avatar-editor__zoom-slider{width:7rem;height:4px;border-radius:var(--radius-full);background:var(--color-neutral-200);appearance:none;cursor:pointer}.ea-avatar-editor__zoom-slider::-webkit-slider-thumb{width:1rem;height:1rem;border:2px solid var(--color-primary-500);border-radius:var(--radius-full);background:var(--color-bg-base);appearance:none;cursor:grab}.ea-avatar-editor__zoom-slider::-webkit-slider-thumb:active{cursor:grabbing}.ea-avatar-editor__zoom-slider::-moz-range-thumb{width:1rem;height:1rem;border:2px solid var(--color-primary-500);border-radius:var(--radius-full);background:var(--color-bg-base);cursor:grab}.ea-avatar-editor__zoom-slider::-moz-range-thumb:active{cursor:grabbing}.ea-avatar-editor__zoom-slider:focus-visible{outline:none}.ea-avatar-editor__zoom-slider:focus-visible::-webkit-slider-thumb{box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor__zoom-slider:disabled{opacity:.4;cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: CameraIconComponent, selector: "ea-icon-camera" }, { kind: "component", type: MinusIconComponent, selector: "ea-icon-minus" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PlusIconComponent, selector: "ea-icon-plus" }, { kind: "component", type: RotateCcwIconComponent, selector: "ea-icon-rotate-ccw" }, { kind: "component", type: SkeletonComponent, selector: "ea-skeleton", inputs: ["variant", "width", "height", "animated"] }, { kind: "directive", type: TooltipDirective, selector: "[eaTooltip]", inputs: ["eaTooltip", "tooltipPosition"] }, { kind: "component", type: TrashIconComponent, selector: "ea-icon-trash" }, { kind: "component", type: UploadIconComponent, selector: "ea-icon-upload" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3616
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: AvatarEditorComponent, isStandalone: true, selector: "ea-avatar-editor", inputs: { shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, canvasSize: { classPropertyName: "canvasSize", publicName: "canvasSize", isSignal: true, isRequired: false, transformFunction: null }, currentSrc: { classPropertyName: "currentSrc", publicName: "currentSrc", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, minZoom: { classPropertyName: "minZoom", publicName: "minZoom", isSignal: true, isRequired: false, transformFunction: null }, maxZoom: { classPropertyName: "maxZoom", publicName: "maxZoom", isSignal: true, isRequired: false, transformFunction: null }, exportQuality: { classPropertyName: "exportQuality", publicName: "exportQuality", isSignal: true, isRequired: false, transformFunction: null }, exportType: { classPropertyName: "exportType", publicName: "exportType", isSignal: true, isRequired: false, transformFunction: null }, cropState: { classPropertyName: "cropState", publicName: "cropState", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cropped: "cropped", fileSelected: "fileSelected", removed: "removed", errored: "errored", cropStateChanged: "cropStateChanged" }, viewQueries: [{ propertyName: "canvasEl", first: true, predicate: ["canvasEl"], descendants: true, isSignal: true }, { propertyName: "fileInputEl", first: true, predicate: ["fileInputEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n class=\"ea-avatar-editor\"\n [ngClass]=\"hostClasses()\">\n <input\n #fileInputEl\n type=\"file\"\n class=\"ea-avatar-editor__file-input\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.upload\"\n [accept]=\"accept()\"\n (change)=\"onFileSelected($event)\" />\n\n @if (!hasImage() && !isLoading()) {\n <button\n type=\"button\"\n class=\"ea-avatar-editor__dropzone\"\n [style.width.px]=\"canvasSize()\"\n [style.height.px]=\"canvasSize()\"\n (click)=\"openFilePicker()\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\">\n <ea-icon-upload class=\"ea-avatar-editor__upload-icon\" />\n <span class=\"ea-avatar-editor__dropzone-text\">\n {{ i18n.messages().avatarEditor.dropzone }}\n </span>\n </button>\n }\n\n @if (hasImage() || isLoading()) {\n <div\n class=\"ea-avatar-editor__canvas-wrapper\"\n [style.width.px]=\"canvasSize()\"\n [style.height.px]=\"canvasSize()\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\">\n @if (isLoading()) {\n <ea-skeleton\n [variant]=\"shape() === 'circle' ? 'circle' : 'rect'\"\n [width]=\"canvasSize() + 'px'\"\n [height]=\"canvasSize() + 'px'\" />\n }\n\n @if (hasImage()) {\n <canvas\n #canvasEl\n class=\"ea-avatar-editor__canvas\"\n role=\"img\"\n tabindex=\"0\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.canvas\"\n [style.display]=\"isLoading() ? 'none' : 'block'\"\n [width]=\"canvasSize()\"\n [height]=\"canvasSize()\"\n (mousedown)=\"onMouseDown($event)\"\n (touchstart)=\"onTouchStart($event)\"\n (keydown)=\"onCanvasKeydown($event)\"></canvas>\n\n @if (!isLoading()) {\n <div\n class=\"ea-avatar-editor__canvas-overlay\"\n [class.ea-avatar-editor__canvas-overlay--on-light]=\"!isImageDark()\">\n <ea-icon-camera class=\"ea-avatar-editor__overlay-icon\" />\n <span>{{ i18n.messages().avatarEditor.change }}</span>\n </div>\n }\n }\n </div>\n }\n\n <div class=\"ea-avatar-editor__controls\">\n <button\n type=\"button\"\n class=\"ea-avatar-editor__icon-btn\"\n [eaTooltip]=\"i18n.messages().avatarEditor.revert\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.revert\"\n [disabled]=\"!canRevert() || isLoading()\"\n (click)=\"revertImage()\">\n <ea-icon-rotate-ccw />\n </button>\n\n <button\n type=\"button\"\n class=\"ea-avatar-editor__icon-btn\"\n [eaTooltip]=\"i18n.messages().avatarEditor.zoomOut\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.zoomOut\"\n [disabled]=\"!hasImage() || isLoading() || zoom() <= minZoom()\"\n (click)=\"setZoom(zoom() - 0.1)\">\n <ea-icon-minus />\n </button>\n\n <input\n type=\"range\"\n class=\"ea-avatar-editor__zoom-slider\"\n [min]=\"minZoom()\"\n [max]=\"maxZoom()\"\n step=\"0.01\"\n [value]=\"zoom()\"\n [disabled]=\"!hasImage() || isLoading()\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.zoom\"\n (input)=\"onZoomInput($event)\" />\n\n <button\n type=\"button\"\n class=\"ea-avatar-editor__icon-btn\"\n [eaTooltip]=\"i18n.messages().avatarEditor.zoomIn\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.zoomIn\"\n [disabled]=\"!hasImage() || isLoading() || zoom() >= maxZoom()\"\n (click)=\"setZoom(zoom() + 0.1)\">\n <ea-icon-plus />\n </button>\n\n <button\n type=\"button\"\n class=\"ea-avatar-editor__icon-btn ea-avatar-editor__icon-btn--danger\"\n [eaTooltip]=\"i18n.messages().avatarEditor.remove\"\n [attr.aria-label]=\"i18n.messages().avatarEditor.remove\"\n [disabled]=\"!hasImage() || isLoading()\"\n (click)=\"removeImage()\">\n <ea-icon-trash />\n </button>\n </div>\n</div>\n", styles: [".ea-avatar-editor{display:inline-flex;flex-direction:column;align-items:center;gap:var(--space-3);font-family:var(--font-family-sans)}.ea-avatar-editor__file-input{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;margin:-1px;border:0;white-space:nowrap;clip:rect(0,0,0,0);clip-path:inset(50%)}.ea-avatar-editor__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-4);font-family:inherit;font-size:var(--font-size-sm);line-height:var(--line-height-normal);border:2px dashed var(--color-border-default);border-radius:var(--radius-lg);background-color:var(--color-bg-subtle);color:var(--color-text-tertiary);cursor:pointer;transition:var(--transition-colors)}.ea-avatar-editor__dropzone:hover{border-color:var(--color-border-focus);background-color:var(--color-state-hover);color:var(--color-text-secondary)}.ea-avatar-editor__dropzone:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor--drag-over .ea-avatar-editor__dropzone{border-color:var(--color-primary-500);background-color:var(--color-primary-50);color:var(--color-primary-600)}.ea-avatar-editor--circle .ea-avatar-editor__dropzone{border-radius:var(--radius-full)}.ea-avatar-editor__upload-icon{width:32px;height:32px;opacity:.6}.ea-avatar-editor__dropzone-text{text-align:center}.ea-avatar-editor--compact .ea-avatar-editor__dropzone{gap:var(--space-1-5);padding:var(--space-3);font-size:.75rem;line-height:1.35}.ea-avatar-editor--compact .ea-avatar-editor__upload-icon{width:24px;height:24px}.ea-avatar-editor--ultra-compact .ea-avatar-editor__dropzone{gap:var(--space-1);padding:var(--space-2);font-size:.625rem;line-height:1.2}.ea-avatar-editor--ultra-compact .ea-avatar-editor__upload-icon{width:16px;height:16px}.ea-avatar-editor__canvas-wrapper{position:relative;overflow:hidden;border-radius:var(--radius-lg)}.ea-avatar-editor--circle .ea-avatar-editor__canvas-wrapper{border-radius:var(--radius-full)}.ea-avatar-editor__canvas{display:block;cursor:grab}.ea-avatar-editor__canvas:active{cursor:grabbing}.ea-avatar-editor__canvas-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-neutral-0);opacity:0;pointer-events:none;transition:opacity var(--duration-fast) var(--easing-default),color var(--duration-fast) var(--easing-default)}.ea-avatar-editor__canvas-overlay--on-light{color:var(--color-neutral-950)}.ea-avatar-editor__overlay-icon{width:24px;height:24px}.ea-avatar-editor__canvas-wrapper:hover .ea-avatar-editor__canvas-overlay{opacity:1}.ea-avatar-editor__controls{display:flex;align-items:center;gap:var(--space-2)}.ea-avatar-editor__icon-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0}.ea-avatar-editor__icon-btn ea-icon-rotate-ccw,.ea-avatar-editor__icon-btn ea-icon-minus,.ea-avatar-editor__icon-btn ea-icon-plus,.ea-avatar-editor__icon-btn ea-icon-trash{width:1rem;height:1rem}.ea-avatar-editor__icon-btn{border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-avatar-editor__icon-btn:hover:not(:disabled){border-color:var(--color-border-focus)}.ea-avatar-editor__icon-btn:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor__icon-btn:disabled{opacity:.4;cursor:not-allowed}.ea-avatar-editor__icon-btn--danger{color:var(--color-error-default)}.ea-avatar-editor__icon-btn--danger:hover:not(:disabled){border-color:var(--color-error-default)}.ea-avatar-editor__zoom-slider{width:7rem;height:4px;border-radius:var(--radius-full);background:var(--color-neutral-200);appearance:none;cursor:pointer}.ea-avatar-editor__zoom-slider::-webkit-slider-thumb{width:1rem;height:1rem;border:2px solid var(--color-primary-500);border-radius:var(--radius-full);background:var(--color-bg-base);appearance:none;cursor:grab}.ea-avatar-editor__zoom-slider::-webkit-slider-thumb:active{cursor:grabbing}.ea-avatar-editor__zoom-slider::-moz-range-thumb{width:1rem;height:1rem;border:2px solid var(--color-primary-500);border-radius:var(--radius-full);background:var(--color-bg-base);cursor:grab}.ea-avatar-editor__zoom-slider::-moz-range-thumb:active{cursor:grabbing}.ea-avatar-editor__zoom-slider:focus-visible{outline:none}.ea-avatar-editor__zoom-slider:focus-visible::-webkit-slider-thumb{box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor__zoom-slider:disabled{opacity:.4;cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: CameraIconComponent, selector: "ea-icon-camera" }, { kind: "component", type: MinusIconComponent, selector: "ea-icon-minus" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PlusIconComponent, selector: "ea-icon-plus" }, { kind: "component", type: RotateCcwIconComponent, selector: "ea-icon-rotate-ccw" }, { kind: "component", type: SkeletonComponent, selector: "ea-skeleton", inputs: ["variant", "width", "height", "animated"] }, { kind: "directive", type: TooltipDirective, selector: "[eaTooltip]", inputs: ["eaTooltip", "tooltipPosition", "maxWidth"] }, { kind: "component", type: TrashIconComponent, selector: "ea-icon-trash" }, { kind: "component", type: UploadIconComponent, selector: "ea-icon-upload" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3606
3617
|
}
|
|
3607
3618
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: AvatarEditorComponent, decorators: [{
|
|
3608
3619
|
type: Component,
|
|
@@ -6281,6 +6292,8 @@ class DrawerComponent {
|
|
|
6281
6292
|
size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
6282
6293
|
closeOnBackdrop = input(true, ...(ngDevMode ? [{ debugName: "closeOnBackdrop" }] : /* istanbul ignore next */ []));
|
|
6283
6294
|
closeOnEscape = input(true, ...(ngDevMode ? [{ debugName: "closeOnEscape" }] : /* istanbul ignore next */ []));
|
|
6295
|
+
/** Slide the panel in from its edge when the drawer opens. */
|
|
6296
|
+
animated = input(false, ...(ngDevMode ? [{ debugName: "animated" }] : /* istanbul ignore next */ []));
|
|
6284
6297
|
showClose = input(true, ...(ngDevMode ? [{ debugName: "showClose" }] : /* istanbul ignore next */ []));
|
|
6285
6298
|
ariaLabel = input(undefined, { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
|
|
6286
6299
|
id = input(uniqueId('ea-drawer'), ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
|
|
@@ -6337,13 +6350,29 @@ class DrawerComponent {
|
|
|
6337
6350
|
}
|
|
6338
6351
|
this.handleClose();
|
|
6339
6352
|
}
|
|
6353
|
+
// The native <dialog> can close on its own (e.g. Escape), so reconcile the open
|
|
6354
|
+
// model here. When closeOnEscape is off, Chrome's repeated-Escape abuse
|
|
6355
|
+
// mitigation can force the close past cancel's preventDefault, so re-show to
|
|
6356
|
+
// keep the drawer open; otherwise mirror the close back into the model.
|
|
6357
|
+
onDialogClose() {
|
|
6358
|
+
if (!this.open()) {
|
|
6359
|
+
return;
|
|
6360
|
+
}
|
|
6361
|
+
if (this.closeOnEscape()) {
|
|
6362
|
+
this.open.set(false);
|
|
6363
|
+
this.closed.emit();
|
|
6364
|
+
}
|
|
6365
|
+
else {
|
|
6366
|
+
this.drawerEl()?.nativeElement.showModal();
|
|
6367
|
+
}
|
|
6368
|
+
}
|
|
6340
6369
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: DrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6341
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: DrawerComponent, isStandalone: true, selector: "ea-drawer", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, showClose: { classPropertyName: "showClose", publicName: "showClose", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", opened: "opened", closed: "closed" }, viewQueries: [{ propertyName: "drawerEl", first: true, predicate: ["drawerEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<dialog\n #drawerEl\n class=\"ea-drawer\"\n [id]=\"id()\"\n [attr.aria-label]=\"ariaLabel() ?? null\"\n [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n (click)=\"handleBackdropClick($event)\"\n (cancel)=\"handleCancel($event)\">\n <div\n class=\"ea-drawer__panel\"\n [ngClass]=\"panelClasses()\">\n @if (showClose()) {\n <button\n type=\"button\"\n class=\"ea-drawer__close\"\n [attr.aria-label]=\"i18n.messages().drawer.close\"\n (click)=\"handleClose()\">\n <ea-icon-x />\n </button>\n }\n\n <div\n class=\"ea-drawer__header\"\n [id]=\"id() + '-header'\">\n <ng-content select=\"[slot=header]\" />\n </div>\n\n <div class=\"ea-drawer__body\">\n <ng-content />\n </div>\n\n <div class=\"ea-drawer__footer\">\n <ng-content select=\"[slot=footer]\" />\n </div>\n </div>\n</dialog>\n", styles: [".ea-drawer{position:fixed;inset:0;width:100vw;max-width:none;height:100vh;max-height:none;padding:0;margin:0;border:none;background:transparent;overflow:hidden}.ea-drawer::backdrop{background-color:var(--color-bg-overlay)}.ea-drawer__panel{position:absolute;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);box-shadow:var(--shadow-2xl);overflow:hidden}.ea-drawer__panel--right{top:0;right:0;bottom:0;height:100%}.ea-drawer__panel--right.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--right.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--right.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--right.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--right.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--right.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--left{top:0;left:0;bottom:0;height:100%}.ea-drawer__panel--left.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--left.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--left.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--left.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--left.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--left.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--top{top:0;left:0;right:0;width:100%}.ea-drawer__panel--top.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--top.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--top.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--top.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--top.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--top.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--bottom{bottom:0;left:0;right:0;width:100%}.ea-drawer__panel--bottom.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--bottom.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--bottom.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--bottom.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--bottom.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--bottom.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-drawer__close>*{font-size:1.25em}.ea-drawer__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-drawer__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-drawer__close:disabled{cursor:not-allowed;opacity:.5}.ea-drawer__close svg{width:1em;height:1em}.ea-drawer__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-drawer__header:empty{display:none}.ea-drawer__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-drawer__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-drawer__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-drawer__footer:empty{display:none}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
6370
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: DrawerComponent, isStandalone: true, selector: "ea-drawer", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, animated: { classPropertyName: "animated", publicName: "animated", isSignal: true, isRequired: false, transformFunction: null }, showClose: { classPropertyName: "showClose", publicName: "showClose", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", opened: "opened", closed: "closed" }, viewQueries: [{ propertyName: "drawerEl", first: true, predicate: ["drawerEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<dialog\n #drawerEl\n class=\"ea-drawer\"\n [class.ea-drawer--animated]=\"animated()\"\n [id]=\"id()\"\n [attr.aria-label]=\"ariaLabel() ?? null\"\n [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n (click)=\"handleBackdropClick($event)\"\n (cancel)=\"handleCancel($event)\"\n (close)=\"onDialogClose()\">\n <div\n class=\"ea-drawer__panel\"\n [ngClass]=\"panelClasses()\">\n @if (showClose()) {\n <button\n type=\"button\"\n class=\"ea-drawer__close\"\n [attr.aria-label]=\"i18n.messages().drawer.close\"\n (click)=\"handleClose()\">\n <ea-icon-x />\n </button>\n }\n\n <div\n class=\"ea-drawer__header\"\n [id]=\"id() + '-header'\">\n <ng-content select=\"[slot=header]\" />\n </div>\n\n <div class=\"ea-drawer__body\">\n <ng-content />\n </div>\n\n <div class=\"ea-drawer__footer\">\n <ng-content select=\"[slot=footer]\" />\n </div>\n </div>\n</dialog>\n", styles: [".ea-drawer{position:fixed;inset:0;width:100vw;max-width:none;height:100vh;max-height:none;padding:0;margin:0;border:none;background:transparent;overflow:hidden}.ea-drawer::backdrop{background-color:var(--color-bg-overlay)}.ea-drawer--animated[open]::backdrop{animation:ea-drawer-backdrop-in var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--right{animation:ea-drawer-slide-right var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--left{animation:ea-drawer-slide-left var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--top{animation:ea-drawer-slide-top var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--bottom{animation:ea-drawer-slide-bottom var(--duration-slow) var(--ease-out)}.ea-drawer__panel{position:absolute;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);box-shadow:var(--shadow-2xl);overflow:hidden}.ea-drawer__panel--right{top:0;right:0;bottom:0;height:100%}.ea-drawer__panel--right.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--right.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--right.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--right.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--right.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--right.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--left{top:0;left:0;bottom:0;height:100%}.ea-drawer__panel--left.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--left.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--left.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--left.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--left.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--left.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--top{top:0;left:0;right:0;width:100%}.ea-drawer__panel--top.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--top.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--top.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--top.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--top.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--top.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--bottom{bottom:0;left:0;right:0;width:100%}.ea-drawer__panel--bottom.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--bottom.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--bottom.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--bottom.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--bottom.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--bottom.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__header,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__header{padding-top:var(--space-3)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__body,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__body{padding-block:var(--space-2)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__footer,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__footer{padding-bottom:var(--space-3)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__header,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__header{padding-top:var(--space-2);padding-bottom:var(--space-1)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__body,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__body{padding-block:var(--space-1)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__footer,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__footer{padding-top:var(--space-1);padding-bottom:var(--space-2)}.ea-drawer__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-drawer__close>*{font-size:1.25em}.ea-drawer__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-drawer__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-drawer__close:disabled{cursor:not-allowed;opacity:.5}.ea-drawer__close svg{width:1em;height:1em}.ea-drawer__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-drawer__header:empty{display:none}.ea-drawer__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-drawer__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-drawer__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-drawer__footer:empty{display:none}@keyframes ea-drawer-slide-right{0%{transform:translate(100%)}}@keyframes ea-drawer-slide-left{0%{transform:translate(-100%)}}@keyframes ea-drawer-slide-top{0%{transform:translateY(-100%)}}@keyframes ea-drawer-slide-bottom{0%{transform:translateY(100%)}}@keyframes ea-drawer-backdrop-in{0%{opacity:0}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
6342
6371
|
}
|
|
6343
6372
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: DrawerComponent, decorators: [{
|
|
6344
6373
|
type: Component,
|
|
6345
|
-
args: [{ selector: 'ea-drawer', imports: [NgClass, XIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<dialog\n #drawerEl\n class=\"ea-drawer\"\n [id]=\"id()\"\n [attr.aria-label]=\"ariaLabel() ?? null\"\n [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n (click)=\"handleBackdropClick($event)\"\n (cancel)=\"handleCancel($event)\">\n <div\n class=\"ea-drawer__panel\"\n [ngClass]=\"panelClasses()\">\n @if (showClose()) {\n <button\n type=\"button\"\n class=\"ea-drawer__close\"\n [attr.aria-label]=\"i18n.messages().drawer.close\"\n (click)=\"handleClose()\">\n <ea-icon-x />\n </button>\n }\n\n <div\n class=\"ea-drawer__header\"\n [id]=\"id() + '-header'\">\n <ng-content select=\"[slot=header]\" />\n </div>\n\n <div class=\"ea-drawer__body\">\n <ng-content />\n </div>\n\n <div class=\"ea-drawer__footer\">\n <ng-content select=\"[slot=footer]\" />\n </div>\n </div>\n</dialog>\n", styles: [".ea-drawer{position:fixed;inset:0;width:100vw;max-width:none;height:100vh;max-height:none;padding:0;margin:0;border:none;background:transparent;overflow:hidden}.ea-drawer::backdrop{background-color:var(--color-bg-overlay)}.ea-drawer__panel{position:absolute;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);box-shadow:var(--shadow-2xl);overflow:hidden}.ea-drawer__panel--right{top:0;right:0;bottom:0;height:100%}.ea-drawer__panel--right.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--right.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--right.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--right.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--right.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--right.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--left{top:0;left:0;bottom:0;height:100%}.ea-drawer__panel--left.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--left.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--left.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--left.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--left.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--left.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--top{top:0;left:0;right:0;width:100%}.ea-drawer__panel--top.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--top.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--top.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--top.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--top.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--top.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--bottom{bottom:0;left:0;right:0;width:100%}.ea-drawer__panel--bottom.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--bottom.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--bottom.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--bottom.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--bottom.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--bottom.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-drawer__close>*{font-size:1.25em}.ea-drawer__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-drawer__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-drawer__close:disabled{cursor:not-allowed;opacity:.5}.ea-drawer__close svg{width:1em;height:1em}.ea-drawer__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-drawer__header:empty{display:none}.ea-drawer__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-drawer__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-drawer__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-drawer__footer:empty{display:none}\n"] }]
|
|
6346
|
-
}], ctorParameters: () => [], propDecorators: { drawerEl: [{ type: i0.ViewChild, args: ['drawerEl', { isSignal: true }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], showClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClose", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
|
|
6374
|
+
args: [{ selector: 'ea-drawer', imports: [NgClass, XIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<dialog\n #drawerEl\n class=\"ea-drawer\"\n [class.ea-drawer--animated]=\"animated()\"\n [id]=\"id()\"\n [attr.aria-label]=\"ariaLabel() ?? null\"\n [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n (click)=\"handleBackdropClick($event)\"\n (cancel)=\"handleCancel($event)\"\n (close)=\"onDialogClose()\">\n <div\n class=\"ea-drawer__panel\"\n [ngClass]=\"panelClasses()\">\n @if (showClose()) {\n <button\n type=\"button\"\n class=\"ea-drawer__close\"\n [attr.aria-label]=\"i18n.messages().drawer.close\"\n (click)=\"handleClose()\">\n <ea-icon-x />\n </button>\n }\n\n <div\n class=\"ea-drawer__header\"\n [id]=\"id() + '-header'\">\n <ng-content select=\"[slot=header]\" />\n </div>\n\n <div class=\"ea-drawer__body\">\n <ng-content />\n </div>\n\n <div class=\"ea-drawer__footer\">\n <ng-content select=\"[slot=footer]\" />\n </div>\n </div>\n</dialog>\n", styles: [".ea-drawer{position:fixed;inset:0;width:100vw;max-width:none;height:100vh;max-height:none;padding:0;margin:0;border:none;background:transparent;overflow:hidden}.ea-drawer::backdrop{background-color:var(--color-bg-overlay)}.ea-drawer--animated[open]::backdrop{animation:ea-drawer-backdrop-in var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--right{animation:ea-drawer-slide-right var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--left{animation:ea-drawer-slide-left var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--top{animation:ea-drawer-slide-top var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--bottom{animation:ea-drawer-slide-bottom var(--duration-slow) var(--ease-out)}.ea-drawer__panel{position:absolute;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);box-shadow:var(--shadow-2xl);overflow:hidden}.ea-drawer__panel--right{top:0;right:0;bottom:0;height:100%}.ea-drawer__panel--right.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--right.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--right.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--right.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--right.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--right.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--left{top:0;left:0;bottom:0;height:100%}.ea-drawer__panel--left.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--left.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--left.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--left.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--left.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--left.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--top{top:0;left:0;right:0;width:100%}.ea-drawer__panel--top.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--top.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--top.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--top.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--top.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--top.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--bottom{bottom:0;left:0;right:0;width:100%}.ea-drawer__panel--bottom.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--bottom.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--bottom.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--bottom.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--bottom.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--bottom.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__header,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__header{padding-top:var(--space-3)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__body,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__body{padding-block:var(--space-2)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__footer,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__footer{padding-bottom:var(--space-3)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__header,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__header{padding-top:var(--space-2);padding-bottom:var(--space-1)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__body,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__body{padding-block:var(--space-1)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__footer,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__footer{padding-top:var(--space-1);padding-bottom:var(--space-2)}.ea-drawer__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-drawer__close>*{font-size:1.25em}.ea-drawer__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-drawer__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-drawer__close:disabled{cursor:not-allowed;opacity:.5}.ea-drawer__close svg{width:1em;height:1em}.ea-drawer__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-drawer__header:empty{display:none}.ea-drawer__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-drawer__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-drawer__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-drawer__footer:empty{display:none}@keyframes ea-drawer-slide-right{0%{transform:translate(100%)}}@keyframes ea-drawer-slide-left{0%{transform:translate(-100%)}}@keyframes ea-drawer-slide-top{0%{transform:translateY(-100%)}}@keyframes ea-drawer-slide-bottom{0%{transform:translateY(100%)}}@keyframes ea-drawer-backdrop-in{0%{opacity:0}}\n"] }]
|
|
6375
|
+
}], ctorParameters: () => [], propDecorators: { drawerEl: [{ type: i0.ViewChild, args: ['drawerEl', { isSignal: true }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], animated: [{ type: i0.Input, args: [{ isSignal: true, alias: "animated", required: false }] }], showClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClose", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
|
|
6347
6376
|
|
|
6348
6377
|
/**
|
|
6349
6378
|
* Single-select dropdown with a custom popup list. Supports keyboard
|
|
@@ -8409,11 +8438,11 @@ class MenuItemComponent {
|
|
|
8409
8438
|
this.menu?.close(true);
|
|
8410
8439
|
}
|
|
8411
8440
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: MenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8412
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.16", type: MenuItemComponent, isStandalone: true, selector: "ea-menu-item", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n type=\"button\"\n class=\"ea-menu-item\"\n role=\"menuitem\"\n [class.ea-menu-item--disabled]=\"disabled()\"\n [class.ea-menu-item--danger]=\"variant() === 'danger'\"\n [disabled]=\"disabled()\"\n (click)=\"handleClick($event)\">\n <span class=\"ea-menu-item__icon\">\n <ng-content select=\"[slot=icon]\" />\n </span>\n <span class=\"ea-menu-item__label\">\n <ng-content />\n </span>\n</button>\n", styles: [".ea-menu-item{display:flex;align-items:center;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-family:var(--font-family-sans);text-align:left;border:none;background:transparent;color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-menu-item:hover:not(.ea-menu-item--disabled),.ea-menu-item:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-
|
|
8441
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.16", type: MenuItemComponent, isStandalone: true, selector: "ea-menu-item", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n type=\"button\"\n class=\"ea-menu-item\"\n role=\"menuitem\"\n [class.ea-menu-item--disabled]=\"disabled()\"\n [class.ea-menu-item--danger]=\"variant() === 'danger'\"\n [disabled]=\"disabled()\"\n (click)=\"handleClick($event)\">\n <span class=\"ea-menu-item__icon\">\n <ng-content select=\"[slot=icon]\" />\n </span>\n <span class=\"ea-menu-item__label\">\n <ng-content />\n </span>\n</button>\n", styles: [".ea-menu-item{display:flex;align-items:center;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-family:var(--font-family-sans);text-align:left;border:none;background:transparent;color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-menu-item:hover:not(.ea-menu-item--disabled),.ea-menu-item:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-state-hover)}.ea-menu-item:focus-visible{outline:none}.ea-menu-item--danger{color:var(--color-error-default)}.ea-menu-item--danger:hover:not(.ea-menu-item--disabled),.ea-menu-item--danger:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-error-subtle, var(--color-bg-muted))}.ea-menu-item--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-menu-item__icon{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:1rem;height:1rem;color:inherit}.ea-menu-item__icon>*{width:1rem;height:1rem}.ea-menu-item__icon:empty{display:none}.ea-menu-item__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8413
8442
|
}
|
|
8414
8443
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: MenuItemComponent, decorators: [{
|
|
8415
8444
|
type: Component,
|
|
8416
|
-
args: [{ selector: 'ea-menu-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n type=\"button\"\n class=\"ea-menu-item\"\n role=\"menuitem\"\n [class.ea-menu-item--disabled]=\"disabled()\"\n [class.ea-menu-item--danger]=\"variant() === 'danger'\"\n [disabled]=\"disabled()\"\n (click)=\"handleClick($event)\">\n <span class=\"ea-menu-item__icon\">\n <ng-content select=\"[slot=icon]\" />\n </span>\n <span class=\"ea-menu-item__label\">\n <ng-content />\n </span>\n</button>\n", styles: [".ea-menu-item{display:flex;align-items:center;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-family:var(--font-family-sans);text-align:left;border:none;background:transparent;color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-menu-item:hover:not(.ea-menu-item--disabled),.ea-menu-item:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-
|
|
8445
|
+
args: [{ selector: 'ea-menu-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n type=\"button\"\n class=\"ea-menu-item\"\n role=\"menuitem\"\n [class.ea-menu-item--disabled]=\"disabled()\"\n [class.ea-menu-item--danger]=\"variant() === 'danger'\"\n [disabled]=\"disabled()\"\n (click)=\"handleClick($event)\">\n <span class=\"ea-menu-item__icon\">\n <ng-content select=\"[slot=icon]\" />\n </span>\n <span class=\"ea-menu-item__label\">\n <ng-content />\n </span>\n</button>\n", styles: [".ea-menu-item{display:flex;align-items:center;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-family:var(--font-family-sans);text-align:left;border:none;background:transparent;color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-menu-item:hover:not(.ea-menu-item--disabled),.ea-menu-item:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-state-hover)}.ea-menu-item:focus-visible{outline:none}.ea-menu-item--danger{color:var(--color-error-default)}.ea-menu-item--danger:hover:not(.ea-menu-item--disabled),.ea-menu-item--danger:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-error-subtle, var(--color-bg-muted))}.ea-menu-item--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-menu-item__icon{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:1rem;height:1rem;color:inherit}.ea-menu-item__icon>*{width:1rem;height:1rem}.ea-menu-item__icon:empty{display:none}.ea-menu-item__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
|
|
8417
8446
|
}], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
|
|
8418
8447
|
|
|
8419
8448
|
/**
|
|
@@ -8525,8 +8554,8 @@ class MultiSelectComponent {
|
|
|
8525
8554
|
searchable = input(true, ...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
|
|
8526
8555
|
/** Toggle the "Select all" row at the top of the option list. */
|
|
8527
8556
|
selectAll = input(true, ...(ngDevMode ? [{ debugName: "selectAll" }] : /* istanbul ignore next */ []));
|
|
8528
|
-
/** Max number of chips shown inside the trigger; the rest collapse into a "+N more" pill. `0` removes the cap. */
|
|
8529
|
-
maxVisibleChips = input(
|
|
8557
|
+
/** Max number of chips shown inside the trigger; the rest collapse into a "+N more" pill. `0` removes the cap so every chip shows and the row scrolls horizontally. */
|
|
8558
|
+
maxVisibleChips = input(0, ...(ngDevMode ? [{ debugName: "maxVisibleChips" }] : /* istanbul ignore next */ []));
|
|
8530
8559
|
id = input(uniqueId('ea-multi-select'), ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
|
|
8531
8560
|
/** Selected option values, in the original options order. */
|
|
8532
8561
|
value = model([], ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
@@ -8806,7 +8835,7 @@ class MultiSelectComponent {
|
|
|
8806
8835
|
useExisting: forwardRef(() => MultiSelectComponent),
|
|
8807
8836
|
multi: true,
|
|
8808
8837
|
},
|
|
8809
|
-
], viewQueries: [{ propertyName: "triggerEl", first: true, predicate: ["triggerEl"], descendants: true, isSignal: true }, { propertyName: "searchEl", first: true, predicate: ["searchEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ea-multi-select-field\">\n @if (label(); as labelText) {\n <ea-field-label\n [text]=\"labelText\"\n [forId]=\"id()\"\n [labelId]=\"id() + '-label'\"\n [required]=\"required()\" />\n }\n\n <div class=\"ea-multi-select\">\n <div\n class=\"ea-multi-select__trigger-wrapper\"\n [ngClass]=\"wrapperClasses()\">\n <div\n #triggerEl\n class=\"ea-multi-select__trigger\"\n [ngClass]=\"triggerClasses()\"\n [id]=\"id()\"\n role=\"combobox\"\n [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n [attr.aria-expanded]=\"isOpen()\"\n [attr.aria-haspopup]=\"'listbox'\"\n [attr.aria-disabled]=\"isDisabled() || null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \"\n (click)=\"toggle()\"\n (keydown)=\"handleTriggerKeydown($event)\">\n <span class=\"ea-multi-select__trigger-content\">\n @if (!hasValue()) {\n <span class=\"ea-multi-select__trigger-placeholder\">\n {{ resolvedPlaceholder() }}\n </span>\n } @else {\n @for (opt of visibleChips(); track opt.value) {\n <ea-tag\n [size]=\"size()\"\n variant=\"default\"\n [removable]=\"!isDisabled() && !readonly()\"\n [removeLabel]=\"i18n.messages().multiSelect.removeOption(opt.label)\"\n (removed)=\"removeChip(opt)\">\n {{ opt.label }}\n </ea-tag>\n }\n @if (hiddenChipCount() > 0) {\n <span class=\"ea-multi-select__more\">+{{ hiddenChipCount() }}</span>\n }\n }\n </span>\n <ea-icon-chevron-down\n class=\"ea-multi-select__trigger-icon\"\n aria-hidden=\"true\" />\n </div>\n @if (hasValue() && !isDisabled() && !readonly()) {\n <button\n type=\"button\"\n class=\"ea-multi-select__clear\"\n [attr.aria-label]=\"i18n.messages().multiSelect.clearAll\"\n (click)=\"clear($event)\">\n <ea-icon-x\n class=\"ea-multi-select__clear-icon\"\n aria-hidden=\"true\" />\n </button>\n }\n </div>\n\n <ea-popover\n [anchor]=\"triggerEl\"\n [open]=\"isOpen()\"\n placement=\"bottom-start\"\n role=\"listbox\"\n [matchAnchorWidth]=\"true\"\n [closeOnEscape]=\"false\"\n scrollBehavior=\"reposition\"\n (closeRequested)=\"onPopoverCloseRequested()\">\n <div\n class=\"ea-multi-select__popover\"\n [ngClass]=\"menuClasses()\">\n @if (searchable()) {\n <div class=\"ea-multi-select__search\">\n <ea-icon-search\n class=\"ea-multi-select__search-icon\"\n aria-hidden=\"true\" />\n <input\n #searchEl\n type=\"text\"\n class=\"ea-multi-select__search-input\"\n autocomplete=\"off\"\n [placeholder]=\"resolvedSearchPlaceholder()\"\n [value]=\"searchTerm()\"\n (input)=\"onSearchInput($event)\"\n (keydown)=\"handlePopoverKeydown($event)\" />\n </div>\n }\n\n @if (selectAll() && filteredOptions().length > 0) {\n <div\n class=\"ea-multi-select__option ea-multi-select__option--select-all\"\n (click)=\"toggleSelectAll()\">\n <ea-checkbox\n size=\"sm\"\n [checked]=\"selectAllState() === 'all'\"\n [indeterminate]=\"selectAllState() === 'some'\"\n [ariaLabel]=\"i18n.messages().multiSelect.selectAll\" />\n <span class=\"ea-multi-select__option-label\">\n {{ i18n.messages().multiSelect.selectAll }}\n </span>\n </div>\n }\n\n <ul\n class=\"ea-multi-select__list\"\n role=\"presentation\">\n @for (opt of filteredOptions(); track opt.value; let i = $index) {\n <li\n class=\"ea-multi-select__option\"\n [class.ea-multi-select__option--focused]=\"focusedIndex() === i\"\n [class.ea-multi-select__option--disabled]=\"opt.disabled\"\n role=\"option\"\n tabindex=\"-1\"\n [attr.aria-selected]=\"selectedSet().has(opt.value)\"\n [attr.aria-disabled]=\"opt.disabled || null\"\n (click)=\"toggleOption(opt)\"\n (keydown)=\"handlePopoverKeydown($event)\">\n <ea-checkbox\n size=\"sm\"\n [checked]=\"selectedSet().has(opt.value)\"\n [disabled]=\"!!opt.disabled\"\n [ariaLabel]=\"opt.label\" />\n <span class=\"ea-multi-select__option-label\">\n {{ opt.label }}\n </span>\n </li>\n } @empty {\n <li class=\"ea-multi-select__empty\">\n {{ i18n.messages().multiSelect.searchEmpty }}\n </li>\n }\n </ul>\n </div>\n </ea-popover>\n </div>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"showError() ? errorMsg() : null\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-multi-select-field{display:flex;flex-direction:column;gap:var(--space-1-5)}.ea-multi-select,.ea-multi-select__trigger-wrapper{position:relative}.ea-multi-select__trigger-wrapper--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger-wrapper--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger-wrapper--md{font-size:var(--font-size-md)}.ea-multi-select__trigger-wrapper--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger-wrapper--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger{display:flex;align-items:center;gap:.5em;width:100%;min-height:2.5em;padding:.375em .75em;text-align:left;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors),var(--transition-shadow)}.ea-multi-select__trigger:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger--md{font-size:var(--font-size-md)}.ea-multi-select__trigger--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger--open{border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger--error{border-color:var(--color-error-default)}.ea-multi-select__trigger--error.ea-multi-select__trigger--open{box-shadow:var(--shadow-focus-ring-error)}.ea-multi-select__trigger--disabled{background-color:var(--color-bg-muted);opacity:.6;cursor:not-allowed}.ea-multi-select__trigger-content{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1);flex:1;min-width:0}.ea-multi-select__trigger-placeholder{color:var(--color-text-tertiary)}.ea-multi-select__trigger-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-secondary);transition:var(--transition-transform)}.ea-multi-select__trigger--open .ea-multi-select__trigger-icon{transform:rotate(180deg)}.ea-multi-select__more{display:inline-flex;align-items:center;padding:0 var(--space-1-5);border-radius:var(--radius-lg);background-color:var(--color-bg-muted);font-size:.85em;font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.ea-multi-select__clear{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__clear>*{font-size:1.25em}.ea-multi-select__clear:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-multi-select__clear:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__clear:disabled{cursor:not-allowed;opacity:.5}.ea-multi-select__clear{z-index:1;position:absolute;top:50%;right:calc(1em + var(--space-5));transform:translateY(-50%)}.ea-multi-select__clear-icon{width:1em;height:1em}.ea-multi-select__popover{display:flex;flex-direction:column;overflow:hidden;max-height:20rem;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}.ea-multi-select__popover--xs{font-size:var(--font-size-xs)}.ea-multi-select__popover--sm{font-size:var(--font-size-sm)}.ea-multi-select__popover--md{font-size:var(--font-size-md)}.ea-multi-select__popover--lg{font-size:var(--font-size-lg)}.ea-multi-select__popover--xl{font-size:var(--font-size-xl)}.ea-multi-select__search{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:var(--space-2) var(--space-3);border-bottom:var(--border-width-thin) solid var(--color-border-default)}.ea-multi-select__search-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-tertiary)}.ea-multi-select__search-input{flex:1;min-width:0;padding:0;border:none;background:none;font-family:var(--font-family-sans);font-size:inherit;color:var(--color-text-primary)}.ea-multi-select__search-input::placeholder{color:var(--color-text-tertiary);opacity:1}.ea-multi-select__search-input:focus{outline:none}.ea-multi-select__list{overflow-y:auto;overscroll-behavior:none;flex:1;margin:0;padding:var(--space-1) 0;list-style:none}.ea-multi-select__option{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1-5) var(--space-3);font-size:inherit;font-family:var(--font-family-sans);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__option--focused{background-color:var(--color-state-hover)}.ea-multi-select__option--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-multi-select__option--select-all{border-bottom:var(--border-width-thin) solid var(--color-border-default);font-weight:var(--font-weight-medium)}.ea-multi-select__option:hover:not(.ea-multi-select__option--disabled){background-color:var(--color-state-hover)}.ea-multi-select__option ea-checkbox{pointer-events:none;display:inline-flex;align-items:center;line-height:1}.ea-multi-select__option-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ea-multi-select__empty{padding:var(--space-3);font-size:inherit;text-align:center;color:var(--color-text-tertiary);list-style:none}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "ea-checkbox", inputs: ["label", "count", "hint", "errorMsg", "size", "disabled", "required", "indeterminate", "aria-label", "id", "checked"], outputs: ["checkedChange", "changed"] }, { kind: "component", type: ChevronDownIconComponent, selector: "ea-icon-chevron-down" }, { kind: "component", type: FieldLabelComponent, selector: "ea-field-label", inputs: ["text", "forId", "required", "labelId"] }, { kind: "component", type: FieldMessagesComponent, selector: "ea-field-messages", inputs: ["id", "error", "hint"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PopoverComponent, selector: "ea-popover", inputs: ["anchor", "open", "placement", "role", "aria-label", "surfaceId", "offset", "flip", "clamp", "matchAnchorWidth", "closeOnOutsideClick", "closeOnEscape", "scrollBehavior"], outputs: ["closeRequested"] }, { kind: "component", type: SearchIconComponent, selector: "ea-icon-search" }, { kind: "component", type: TagComponent, selector: "ea-tag", inputs: ["variant", "size", "removable", "disabled", "removeLabel"], outputs: ["removed"] }, { kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8838
|
+
], viewQueries: [{ propertyName: "triggerEl", first: true, predicate: ["triggerEl"], descendants: true, isSignal: true }, { propertyName: "searchEl", first: true, predicate: ["searchEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ea-multi-select-field\">\n @if (label(); as labelText) {\n <ea-field-label\n [text]=\"labelText\"\n [forId]=\"id()\"\n [labelId]=\"id() + '-label'\"\n [required]=\"required()\" />\n }\n\n <div class=\"ea-multi-select\">\n <div\n class=\"ea-multi-select__trigger-wrapper\"\n [ngClass]=\"wrapperClasses()\">\n <div\n #triggerEl\n class=\"ea-multi-select__trigger\"\n [ngClass]=\"triggerClasses()\"\n [id]=\"id()\"\n role=\"combobox\"\n [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n [attr.aria-expanded]=\"isOpen()\"\n [attr.aria-haspopup]=\"'listbox'\"\n [attr.aria-disabled]=\"isDisabled() || null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \"\n (click)=\"toggle()\"\n (keydown)=\"handleTriggerKeydown($event)\">\n <span class=\"ea-multi-select__trigger-content\">\n @if (!hasValue()) {\n <span class=\"ea-multi-select__trigger-placeholder\">\n {{ resolvedPlaceholder() }}\n </span>\n } @else {\n @for (opt of visibleChips(); track opt.value) {\n <ea-tag\n [size]=\"size()\"\n variant=\"default\"\n [removable]=\"!isDisabled() && !readonly()\"\n [removeLabel]=\"i18n.messages().multiSelect.removeOption(opt.label)\"\n (removed)=\"removeChip(opt)\">\n {{ opt.label }}\n </ea-tag>\n }\n @if (hiddenChipCount() > 0) {\n <span class=\"ea-multi-select__more\">+{{ hiddenChipCount() }}</span>\n }\n }\n </span>\n </div>\n @if (hasValue() && !isDisabled() && !readonly()) {\n <button\n type=\"button\"\n class=\"ea-multi-select__clear\"\n [attr.aria-label]=\"i18n.messages().multiSelect.clearAll\"\n (click)=\"clear($event)\">\n <ea-icon-x\n class=\"ea-multi-select__clear-icon\"\n aria-hidden=\"true\" />\n </button>\n }\n <ea-icon-chevron-down\n class=\"ea-multi-select__trigger-icon\"\n aria-hidden=\"true\"\n (click)=\"toggle()\" />\n </div>\n\n <ea-popover\n [anchor]=\"triggerEl\"\n [open]=\"isOpen()\"\n placement=\"bottom-start\"\n role=\"listbox\"\n [matchAnchorWidth]=\"true\"\n [closeOnEscape]=\"false\"\n scrollBehavior=\"reposition\"\n (closeRequested)=\"onPopoverCloseRequested()\">\n <div\n class=\"ea-multi-select__popover\"\n [ngClass]=\"menuClasses()\">\n @if (searchable()) {\n <div class=\"ea-multi-select__search\">\n <ea-icon-search\n class=\"ea-multi-select__search-icon\"\n aria-hidden=\"true\" />\n <input\n #searchEl\n type=\"text\"\n class=\"ea-multi-select__search-input\"\n autocomplete=\"off\"\n [placeholder]=\"resolvedSearchPlaceholder()\"\n [value]=\"searchTerm()\"\n (input)=\"onSearchInput($event)\"\n (keydown)=\"handlePopoverKeydown($event)\" />\n </div>\n }\n\n @if (selectAll() && filteredOptions().length > 0) {\n <div\n class=\"ea-multi-select__option ea-multi-select__option--select-all\"\n (click)=\"toggleSelectAll()\">\n <ea-checkbox\n size=\"sm\"\n [checked]=\"selectAllState() === 'all'\"\n [indeterminate]=\"selectAllState() === 'some'\"\n [ariaLabel]=\"i18n.messages().multiSelect.selectAll\" />\n <span class=\"ea-multi-select__option-label\">\n {{ i18n.messages().multiSelect.selectAll }}\n </span>\n </div>\n }\n\n <ul\n class=\"ea-multi-select__list\"\n role=\"presentation\">\n @for (opt of filteredOptions(); track opt.value; let i = $index) {\n <li\n class=\"ea-multi-select__option\"\n [class.ea-multi-select__option--focused]=\"focusedIndex() === i\"\n [class.ea-multi-select__option--disabled]=\"opt.disabled\"\n role=\"option\"\n tabindex=\"-1\"\n [attr.aria-selected]=\"selectedSet().has(opt.value)\"\n [attr.aria-disabled]=\"opt.disabled || null\"\n (click)=\"toggleOption(opt)\"\n (keydown)=\"handlePopoverKeydown($event)\">\n <ea-checkbox\n size=\"sm\"\n [checked]=\"selectedSet().has(opt.value)\"\n [disabled]=\"!!opt.disabled\"\n [ariaLabel]=\"opt.label\" />\n <span class=\"ea-multi-select__option-label\">\n {{ opt.label }}\n </span>\n </li>\n } @empty {\n <li class=\"ea-multi-select__empty\">\n {{ i18n.messages().multiSelect.searchEmpty }}\n </li>\n }\n </ul>\n </div>\n </ea-popover>\n </div>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"showError() ? errorMsg() : null\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-multi-select-field{display:flex;flex-direction:column;gap:var(--space-1-5)}.ea-multi-select{position:relative}.ea-multi-select__trigger-wrapper{position:relative;display:flex;align-items:center;gap:.5em;width:100%;min-height:2.5em;padding:.375em .75em;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);transition:var(--transition-colors),var(--transition-shadow)}.ea-multi-select__trigger-wrapper--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger-wrapper--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger-wrapper--md{font-size:var(--font-size-md)}.ea-multi-select__trigger-wrapper--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger-wrapper--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger:focus-visible){box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--open){border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--error){border-color:var(--color-error-default)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--error.ea-multi-select__trigger--open){box-shadow:var(--shadow-focus-ring-error)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--disabled){background-color:var(--color-bg-muted);opacity:.6;cursor:not-allowed}.ea-multi-select__trigger{display:flex;align-items:center;flex:1;min-width:0;text-align:left;font-family:var(--font-family-sans);cursor:pointer}.ea-multi-select__trigger:focus-visible{outline:none}.ea-multi-select__trigger--disabled{cursor:not-allowed}.ea-multi-select__trigger-content{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--space-1);flex:1;min-width:0;overflow-x:auto;scrollbar-width:thin}.ea-multi-select__trigger-content ea-tag{flex-shrink:0}.ea-multi-select__trigger-placeholder{color:var(--color-text-tertiary)}.ea-multi-select__trigger-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-transform)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--open) .ea-multi-select__trigger-icon{transform:rotate(180deg)}.ea-multi-select__more{display:inline-flex;flex-shrink:0;align-items:center;padding:0 var(--space-1-5);border-radius:var(--radius-lg);background-color:var(--color-bg-muted);font-size:.85em;font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.ea-multi-select__clear{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__clear>*{font-size:1.25em}.ea-multi-select__clear:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-multi-select__clear:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__clear:disabled{cursor:not-allowed;opacity:.5}.ea-multi-select__clear{flex-shrink:0}.ea-multi-select__clear-icon{width:1em;height:1em}.ea-multi-select__popover{display:flex;flex-direction:column;overflow:hidden;max-height:20rem;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}.ea-multi-select__popover--xs{font-size:var(--font-size-xs)}.ea-multi-select__popover--sm{font-size:var(--font-size-sm)}.ea-multi-select__popover--md{font-size:var(--font-size-md)}.ea-multi-select__popover--lg{font-size:var(--font-size-lg)}.ea-multi-select__popover--xl{font-size:var(--font-size-xl)}.ea-multi-select__search{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:var(--space-2) var(--space-3);border-bottom:var(--border-width-thin) solid var(--color-border-default)}.ea-multi-select__search-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-tertiary)}.ea-multi-select__search-input{flex:1;min-width:0;padding:0;border:none;background:none;font-family:var(--font-family-sans);font-size:inherit;color:var(--color-text-primary)}.ea-multi-select__search-input::placeholder{color:var(--color-text-tertiary);opacity:1}.ea-multi-select__search-input:focus{outline:none}.ea-multi-select__list{overflow-y:auto;overscroll-behavior:none;flex:1;margin:0;padding:var(--space-1) 0;list-style:none}.ea-multi-select__option{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1-5) var(--space-3);font-size:inherit;font-family:var(--font-family-sans);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__option--focused{background-color:var(--color-state-hover)}.ea-multi-select__option--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-multi-select__option--select-all{border-bottom:var(--border-width-thin) solid var(--color-border-default);font-weight:var(--font-weight-medium)}.ea-multi-select__option:hover:not(.ea-multi-select__option--disabled){background-color:var(--color-state-hover)}.ea-multi-select__option ea-checkbox{pointer-events:none;display:inline-flex;align-items:center;line-height:1}.ea-multi-select__option-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ea-multi-select__empty{padding:var(--space-3);font-size:inherit;text-align:center;color:var(--color-text-tertiary);list-style:none}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "ea-checkbox", inputs: ["label", "count", "hint", "errorMsg", "size", "disabled", "required", "indeterminate", "aria-label", "id", "checked"], outputs: ["checkedChange", "changed"] }, { kind: "component", type: ChevronDownIconComponent, selector: "ea-icon-chevron-down" }, { kind: "component", type: FieldLabelComponent, selector: "ea-field-label", inputs: ["text", "forId", "required", "labelId"] }, { kind: "component", type: FieldMessagesComponent, selector: "ea-field-messages", inputs: ["id", "error", "hint"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PopoverComponent, selector: "ea-popover", inputs: ["anchor", "open", "placement", "role", "aria-label", "surfaceId", "offset", "flip", "clamp", "matchAnchorWidth", "closeOnOutsideClick", "closeOnEscape", "scrollBehavior"], outputs: ["closeRequested"] }, { kind: "component", type: SearchIconComponent, selector: "ea-icon-search" }, { kind: "component", type: TagComponent, selector: "ea-tag", inputs: ["variant", "size", "removable", "disabled", "removeLabel"], outputs: ["removed"] }, { kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8810
8839
|
}
|
|
8811
8840
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: MultiSelectComponent, decorators: [{
|
|
8812
8841
|
type: Component,
|
|
@@ -8826,7 +8855,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
8826
8855
|
useExisting: forwardRef(() => MultiSelectComponent),
|
|
8827
8856
|
multi: true,
|
|
8828
8857
|
},
|
|
8829
|
-
], template: "<div class=\"ea-multi-select-field\">\n @if (label(); as labelText) {\n <ea-field-label\n [text]=\"labelText\"\n [forId]=\"id()\"\n [labelId]=\"id() + '-label'\"\n [required]=\"required()\" />\n }\n\n <div class=\"ea-multi-select\">\n <div\n class=\"ea-multi-select__trigger-wrapper\"\n [ngClass]=\"wrapperClasses()\">\n <div\n #triggerEl\n class=\"ea-multi-select__trigger\"\n [ngClass]=\"triggerClasses()\"\n [id]=\"id()\"\n role=\"combobox\"\n [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n [attr.aria-expanded]=\"isOpen()\"\n [attr.aria-haspopup]=\"'listbox'\"\n [attr.aria-disabled]=\"isDisabled() || null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \"\n (click)=\"toggle()\"\n (keydown)=\"handleTriggerKeydown($event)\">\n <span class=\"ea-multi-select__trigger-content\">\n @if (!hasValue()) {\n <span class=\"ea-multi-select__trigger-placeholder\">\n {{ resolvedPlaceholder() }}\n </span>\n } @else {\n @for (opt of visibleChips(); track opt.value) {\n <ea-tag\n [size]=\"size()\"\n variant=\"default\"\n [removable]=\"!isDisabled() && !readonly()\"\n [removeLabel]=\"i18n.messages().multiSelect.removeOption(opt.label)\"\n (removed)=\"removeChip(opt)\">\n {{ opt.label }}\n </ea-tag>\n }\n @if (hiddenChipCount() > 0) {\n <span class=\"ea-multi-select__more\">+{{ hiddenChipCount() }}</span>\n }\n }\n </span>\n <ea-icon-chevron-down\n class=\"ea-multi-select__trigger-icon\"\n aria-hidden=\"true\" />\n </div>\n @if (hasValue() && !isDisabled() && !readonly()) {\n <button\n type=\"button\"\n class=\"ea-multi-select__clear\"\n [attr.aria-label]=\"i18n.messages().multiSelect.clearAll\"\n (click)=\"clear($event)\">\n <ea-icon-x\n class=\"ea-multi-select__clear-icon\"\n aria-hidden=\"true\" />\n </button>\n }\n </div>\n\n <ea-popover\n [anchor]=\"triggerEl\"\n [open]=\"isOpen()\"\n placement=\"bottom-start\"\n role=\"listbox\"\n [matchAnchorWidth]=\"true\"\n [closeOnEscape]=\"false\"\n scrollBehavior=\"reposition\"\n (closeRequested)=\"onPopoverCloseRequested()\">\n <div\n class=\"ea-multi-select__popover\"\n [ngClass]=\"menuClasses()\">\n @if (searchable()) {\n <div class=\"ea-multi-select__search\">\n <ea-icon-search\n class=\"ea-multi-select__search-icon\"\n aria-hidden=\"true\" />\n <input\n #searchEl\n type=\"text\"\n class=\"ea-multi-select__search-input\"\n autocomplete=\"off\"\n [placeholder]=\"resolvedSearchPlaceholder()\"\n [value]=\"searchTerm()\"\n (input)=\"onSearchInput($event)\"\n (keydown)=\"handlePopoverKeydown($event)\" />\n </div>\n }\n\n @if (selectAll() && filteredOptions().length > 0) {\n <div\n class=\"ea-multi-select__option ea-multi-select__option--select-all\"\n (click)=\"toggleSelectAll()\">\n <ea-checkbox\n size=\"sm\"\n [checked]=\"selectAllState() === 'all'\"\n [indeterminate]=\"selectAllState() === 'some'\"\n [ariaLabel]=\"i18n.messages().multiSelect.selectAll\" />\n <span class=\"ea-multi-select__option-label\">\n {{ i18n.messages().multiSelect.selectAll }}\n </span>\n </div>\n }\n\n <ul\n class=\"ea-multi-select__list\"\n role=\"presentation\">\n @for (opt of filteredOptions(); track opt.value; let i = $index) {\n <li\n class=\"ea-multi-select__option\"\n [class.ea-multi-select__option--focused]=\"focusedIndex() === i\"\n [class.ea-multi-select__option--disabled]=\"opt.disabled\"\n role=\"option\"\n tabindex=\"-1\"\n [attr.aria-selected]=\"selectedSet().has(opt.value)\"\n [attr.aria-disabled]=\"opt.disabled || null\"\n (click)=\"toggleOption(opt)\"\n (keydown)=\"handlePopoverKeydown($event)\">\n <ea-checkbox\n size=\"sm\"\n [checked]=\"selectedSet().has(opt.value)\"\n [disabled]=\"!!opt.disabled\"\n [ariaLabel]=\"opt.label\" />\n <span class=\"ea-multi-select__option-label\">\n {{ opt.label }}\n </span>\n </li>\n } @empty {\n <li class=\"ea-multi-select__empty\">\n {{ i18n.messages().multiSelect.searchEmpty }}\n </li>\n }\n </ul>\n </div>\n </ea-popover>\n </div>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"showError() ? errorMsg() : null\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-multi-select-field{display:flex;flex-direction:column;gap:var(--space-1-5)}.ea-multi-select,.ea-multi-select__trigger-wrapper{position:relative}.ea-multi-select__trigger-wrapper--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger-wrapper--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger-wrapper--md{font-size:var(--font-size-md)}.ea-multi-select__trigger-wrapper--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger-wrapper--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger{display:flex;align-items:center;gap:.5em;width:100%;min-height:2.5em;padding:.375em .75em;text-align:left;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors),var(--transition-shadow)}.ea-multi-select__trigger:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger--md{font-size:var(--font-size-md)}.ea-multi-select__trigger--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger--open{border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger--error{border-color:var(--color-error-default)}.ea-multi-select__trigger--error.ea-multi-select__trigger--open{box-shadow:var(--shadow-focus-ring-error)}.ea-multi-select__trigger--disabled{background-color:var(--color-bg-muted);opacity:.6;cursor:not-allowed}.ea-multi-select__trigger-content{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1);flex:1;min-width:0}.ea-multi-select__trigger-placeholder{color:var(--color-text-tertiary)}.ea-multi-select__trigger-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-secondary);transition:var(--transition-transform)}.ea-multi-select__trigger--open .ea-multi-select__trigger-icon{transform:rotate(180deg)}.ea-multi-select__more{display:inline-flex;align-items:center;padding:0 var(--space-1-5);border-radius:var(--radius-lg);background-color:var(--color-bg-muted);font-size:.85em;font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.ea-multi-select__clear{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__clear>*{font-size:1.25em}.ea-multi-select__clear:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-multi-select__clear:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__clear:disabled{cursor:not-allowed;opacity:.5}.ea-multi-select__clear{z-index:1;position:absolute;top:50%;right:calc(1em + var(--space-5));transform:translateY(-50%)}.ea-multi-select__clear-icon{width:1em;height:1em}.ea-multi-select__popover{display:flex;flex-direction:column;overflow:hidden;max-height:20rem;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}.ea-multi-select__popover--xs{font-size:var(--font-size-xs)}.ea-multi-select__popover--sm{font-size:var(--font-size-sm)}.ea-multi-select__popover--md{font-size:var(--font-size-md)}.ea-multi-select__popover--lg{font-size:var(--font-size-lg)}.ea-multi-select__popover--xl{font-size:var(--font-size-xl)}.ea-multi-select__search{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:var(--space-2) var(--space-3);border-bottom:var(--border-width-thin) solid var(--color-border-default)}.ea-multi-select__search-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-tertiary)}.ea-multi-select__search-input{flex:1;min-width:0;padding:0;border:none;background:none;font-family:var(--font-family-sans);font-size:inherit;color:var(--color-text-primary)}.ea-multi-select__search-input::placeholder{color:var(--color-text-tertiary);opacity:1}.ea-multi-select__search-input:focus{outline:none}.ea-multi-select__list{overflow-y:auto;overscroll-behavior:none;flex:1;margin:0;padding:var(--space-1) 0;list-style:none}.ea-multi-select__option{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1-5) var(--space-3);font-size:inherit;font-family:var(--font-family-sans);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__option--focused{background-color:var(--color-state-hover)}.ea-multi-select__option--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-multi-select__option--select-all{border-bottom:var(--border-width-thin) solid var(--color-border-default);font-weight:var(--font-weight-medium)}.ea-multi-select__option:hover:not(.ea-multi-select__option--disabled){background-color:var(--color-state-hover)}.ea-multi-select__option ea-checkbox{pointer-events:none;display:inline-flex;align-items:center;line-height:1}.ea-multi-select__option-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ea-multi-select__empty{padding:var(--space-3);font-size:inherit;text-align:center;color:var(--color-text-tertiary);list-style:none}\n"] }]
|
|
8858
|
+
], template: "<div class=\"ea-multi-select-field\">\n @if (label(); as labelText) {\n <ea-field-label\n [text]=\"labelText\"\n [forId]=\"id()\"\n [labelId]=\"id() + '-label'\"\n [required]=\"required()\" />\n }\n\n <div class=\"ea-multi-select\">\n <div\n class=\"ea-multi-select__trigger-wrapper\"\n [ngClass]=\"wrapperClasses()\">\n <div\n #triggerEl\n class=\"ea-multi-select__trigger\"\n [ngClass]=\"triggerClasses()\"\n [id]=\"id()\"\n role=\"combobox\"\n [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n [attr.aria-expanded]=\"isOpen()\"\n [attr.aria-haspopup]=\"'listbox'\"\n [attr.aria-disabled]=\"isDisabled() || null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \"\n (click)=\"toggle()\"\n (keydown)=\"handleTriggerKeydown($event)\">\n <span class=\"ea-multi-select__trigger-content\">\n @if (!hasValue()) {\n <span class=\"ea-multi-select__trigger-placeholder\">\n {{ resolvedPlaceholder() }}\n </span>\n } @else {\n @for (opt of visibleChips(); track opt.value) {\n <ea-tag\n [size]=\"size()\"\n variant=\"default\"\n [removable]=\"!isDisabled() && !readonly()\"\n [removeLabel]=\"i18n.messages().multiSelect.removeOption(opt.label)\"\n (removed)=\"removeChip(opt)\">\n {{ opt.label }}\n </ea-tag>\n }\n @if (hiddenChipCount() > 0) {\n <span class=\"ea-multi-select__more\">+{{ hiddenChipCount() }}</span>\n }\n }\n </span>\n </div>\n @if (hasValue() && !isDisabled() && !readonly()) {\n <button\n type=\"button\"\n class=\"ea-multi-select__clear\"\n [attr.aria-label]=\"i18n.messages().multiSelect.clearAll\"\n (click)=\"clear($event)\">\n <ea-icon-x\n class=\"ea-multi-select__clear-icon\"\n aria-hidden=\"true\" />\n </button>\n }\n <ea-icon-chevron-down\n class=\"ea-multi-select__trigger-icon\"\n aria-hidden=\"true\"\n (click)=\"toggle()\" />\n </div>\n\n <ea-popover\n [anchor]=\"triggerEl\"\n [open]=\"isOpen()\"\n placement=\"bottom-start\"\n role=\"listbox\"\n [matchAnchorWidth]=\"true\"\n [closeOnEscape]=\"false\"\n scrollBehavior=\"reposition\"\n (closeRequested)=\"onPopoverCloseRequested()\">\n <div\n class=\"ea-multi-select__popover\"\n [ngClass]=\"menuClasses()\">\n @if (searchable()) {\n <div class=\"ea-multi-select__search\">\n <ea-icon-search\n class=\"ea-multi-select__search-icon\"\n aria-hidden=\"true\" />\n <input\n #searchEl\n type=\"text\"\n class=\"ea-multi-select__search-input\"\n autocomplete=\"off\"\n [placeholder]=\"resolvedSearchPlaceholder()\"\n [value]=\"searchTerm()\"\n (input)=\"onSearchInput($event)\"\n (keydown)=\"handlePopoverKeydown($event)\" />\n </div>\n }\n\n @if (selectAll() && filteredOptions().length > 0) {\n <div\n class=\"ea-multi-select__option ea-multi-select__option--select-all\"\n (click)=\"toggleSelectAll()\">\n <ea-checkbox\n size=\"sm\"\n [checked]=\"selectAllState() === 'all'\"\n [indeterminate]=\"selectAllState() === 'some'\"\n [ariaLabel]=\"i18n.messages().multiSelect.selectAll\" />\n <span class=\"ea-multi-select__option-label\">\n {{ i18n.messages().multiSelect.selectAll }}\n </span>\n </div>\n }\n\n <ul\n class=\"ea-multi-select__list\"\n role=\"presentation\">\n @for (opt of filteredOptions(); track opt.value; let i = $index) {\n <li\n class=\"ea-multi-select__option\"\n [class.ea-multi-select__option--focused]=\"focusedIndex() === i\"\n [class.ea-multi-select__option--disabled]=\"opt.disabled\"\n role=\"option\"\n tabindex=\"-1\"\n [attr.aria-selected]=\"selectedSet().has(opt.value)\"\n [attr.aria-disabled]=\"opt.disabled || null\"\n (click)=\"toggleOption(opt)\"\n (keydown)=\"handlePopoverKeydown($event)\">\n <ea-checkbox\n size=\"sm\"\n [checked]=\"selectedSet().has(opt.value)\"\n [disabled]=\"!!opt.disabled\"\n [ariaLabel]=\"opt.label\" />\n <span class=\"ea-multi-select__option-label\">\n {{ opt.label }}\n </span>\n </li>\n } @empty {\n <li class=\"ea-multi-select__empty\">\n {{ i18n.messages().multiSelect.searchEmpty }}\n </li>\n }\n </ul>\n </div>\n </ea-popover>\n </div>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"showError() ? errorMsg() : null\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-multi-select-field{display:flex;flex-direction:column;gap:var(--space-1-5)}.ea-multi-select{position:relative}.ea-multi-select__trigger-wrapper{position:relative;display:flex;align-items:center;gap:.5em;width:100%;min-height:2.5em;padding:.375em .75em;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);transition:var(--transition-colors),var(--transition-shadow)}.ea-multi-select__trigger-wrapper--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger-wrapper--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger-wrapper--md{font-size:var(--font-size-md)}.ea-multi-select__trigger-wrapper--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger-wrapper--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger:focus-visible){box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--open){border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--error){border-color:var(--color-error-default)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--error.ea-multi-select__trigger--open){box-shadow:var(--shadow-focus-ring-error)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--disabled){background-color:var(--color-bg-muted);opacity:.6;cursor:not-allowed}.ea-multi-select__trigger{display:flex;align-items:center;flex:1;min-width:0;text-align:left;font-family:var(--font-family-sans);cursor:pointer}.ea-multi-select__trigger:focus-visible{outline:none}.ea-multi-select__trigger--disabled{cursor:not-allowed}.ea-multi-select__trigger-content{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--space-1);flex:1;min-width:0;overflow-x:auto;scrollbar-width:thin}.ea-multi-select__trigger-content ea-tag{flex-shrink:0}.ea-multi-select__trigger-placeholder{color:var(--color-text-tertiary)}.ea-multi-select__trigger-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-transform)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--open) .ea-multi-select__trigger-icon{transform:rotate(180deg)}.ea-multi-select__more{display:inline-flex;flex-shrink:0;align-items:center;padding:0 var(--space-1-5);border-radius:var(--radius-lg);background-color:var(--color-bg-muted);font-size:.85em;font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.ea-multi-select__clear{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__clear>*{font-size:1.25em}.ea-multi-select__clear:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-multi-select__clear:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__clear:disabled{cursor:not-allowed;opacity:.5}.ea-multi-select__clear{flex-shrink:0}.ea-multi-select__clear-icon{width:1em;height:1em}.ea-multi-select__popover{display:flex;flex-direction:column;overflow:hidden;max-height:20rem;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}.ea-multi-select__popover--xs{font-size:var(--font-size-xs)}.ea-multi-select__popover--sm{font-size:var(--font-size-sm)}.ea-multi-select__popover--md{font-size:var(--font-size-md)}.ea-multi-select__popover--lg{font-size:var(--font-size-lg)}.ea-multi-select__popover--xl{font-size:var(--font-size-xl)}.ea-multi-select__search{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:var(--space-2) var(--space-3);border-bottom:var(--border-width-thin) solid var(--color-border-default)}.ea-multi-select__search-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-tertiary)}.ea-multi-select__search-input{flex:1;min-width:0;padding:0;border:none;background:none;font-family:var(--font-family-sans);font-size:inherit;color:var(--color-text-primary)}.ea-multi-select__search-input::placeholder{color:var(--color-text-tertiary);opacity:1}.ea-multi-select__search-input:focus{outline:none}.ea-multi-select__list{overflow-y:auto;overscroll-behavior:none;flex:1;margin:0;padding:var(--space-1) 0;list-style:none}.ea-multi-select__option{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1-5) var(--space-3);font-size:inherit;font-family:var(--font-family-sans);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__option--focused{background-color:var(--color-state-hover)}.ea-multi-select__option--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-multi-select__option--select-all{border-bottom:var(--border-width-thin) solid var(--color-border-default);font-weight:var(--font-weight-medium)}.ea-multi-select__option:hover:not(.ea-multi-select__option--disabled){background-color:var(--color-state-hover)}.ea-multi-select__option ea-checkbox{pointer-events:none;display:inline-flex;align-items:center;line-height:1}.ea-multi-select__option-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ea-multi-select__empty{padding:var(--space-3);font-size:inherit;text-align:center;color:var(--color-text-tertiary);list-style:none}\n"] }]
|
|
8830
8859
|
}], propDecorators: { triggerEl: [{ type: i0.ViewChild, args: ['triggerEl', { isSignal: true }] }], searchEl: [{ type: i0.ViewChild, args: ['searchEl', { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], errorMsg: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMsg", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], selectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAll", required: false }] }], maxVisibleChips: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleChips", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
|
|
8831
8860
|
|
|
8832
8861
|
/**
|
|
@@ -8842,6 +8871,9 @@ class PaginatorComponent {
|
|
|
8842
8871
|
showPageSizeSelector = input(true, ...(ngDevMode ? [{ debugName: "showPageSizeSelector" }] : /* istanbul ignore next */ []));
|
|
8843
8872
|
showRangeLabel = input(true, ...(ngDevMode ? [{ debugName: "showRangeLabel" }] : /* istanbul ignore next */ []));
|
|
8844
8873
|
align = input('right', ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
|
|
8874
|
+
size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
8875
|
+
/** Group thousands with commas in the range and page numbers. */
|
|
8876
|
+
groupThousands = input(true, ...(ngDevMode ? [{ debugName: "groupThousands" }] : /* istanbul ignore next */ []));
|
|
8845
8877
|
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
8846
8878
|
page = model(1, ...(ngDevMode ? [{ debugName: "page" }] : /* istanbul ignore next */ []));
|
|
8847
8879
|
pageSize = model(10, ...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
|
|
@@ -8852,6 +8884,10 @@ class PaginatorComponent {
|
|
|
8852
8884
|
rangeEnd = computed(() => Math.min(this.page() * this.pageSize(), this.totalItems()), ...(ngDevMode ? [{ debugName: "rangeEnd" }] : /* istanbul ignore next */ []));
|
|
8853
8885
|
canGoPrev = computed(() => this.page() > 1, ...(ngDevMode ? [{ debugName: "canGoPrev" }] : /* istanbul ignore next */ []));
|
|
8854
8886
|
canGoNext = computed(() => this.page() < this.totalPages(), ...(ngDevMode ? [{ debugName: "canGoNext" }] : /* istanbul ignore next */ []));
|
|
8887
|
+
/** Formats a number for display, grouping thousands with commas when enabled. */
|
|
8888
|
+
formatNumber(value) {
|
|
8889
|
+
return this.groupThousands() ? value.toLocaleString('en-US') : `${value}`;
|
|
8890
|
+
}
|
|
8855
8891
|
visiblePages = computed(() => {
|
|
8856
8892
|
const total = this.totalPages();
|
|
8857
8893
|
const current = this.page();
|
|
@@ -8911,12 +8947,17 @@ class PaginatorComponent {
|
|
|
8911
8947
|
this.changed.emit({ page: 1, pageSize: newSize });
|
|
8912
8948
|
}
|
|
8913
8949
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8914
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: PaginatorComponent, isStandalone: true, selector: "ea-paginator", inputs: { totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showPageSizeSelector: { classPropertyName: "showPageSizeSelector", publicName: "showPageSizeSelector", isSignal: true, isRequired: false, transformFunction: null }, showRangeLabel: { classPropertyName: "showRangeLabel", publicName: "showRangeLabel", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange", pageSize: "pageSizeChange", changed: "changed" }, ngImport: i0, template: "<div\n class=\"ea-paginator\"\n [class.ea-paginator--left]=\"align() === 'left'\"\n [class.ea-paginator--center]=\"align() === 'center'\"\n [class.ea-paginator--disabled]=\"disabled()\"\n role=\"navigation\"\n [attr.aria-label]=\"i18n.messages().paginator.label\">\n @if (showPageSizeSelector()) {\n <div class=\"ea-paginator__page-size\">\n <label\n class=\"ea-paginator__label\"\n for=\"ea-paginator-size\">\n {{ i18n.messages().paginator.rowsPerPage }}\n </label>\n <select\n class=\"ea-paginator__select\"\n id=\"ea-paginator-size\"\n [disabled]=\"disabled()\"\n (change)=\"onPageSizeChange($event)\">\n @for (
|
|
8950
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: PaginatorComponent, isStandalone: true, selector: "ea-paginator", inputs: { totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showPageSizeSelector: { classPropertyName: "showPageSizeSelector", publicName: "showPageSizeSelector", isSignal: true, isRequired: false, transformFunction: null }, showRangeLabel: { classPropertyName: "showRangeLabel", publicName: "showRangeLabel", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, groupThousands: { classPropertyName: "groupThousands", publicName: "groupThousands", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange", pageSize: "pageSizeChange", changed: "changed" }, ngImport: i0, template: "<div\n class=\"ea-paginator\"\n [ngClass]=\"'ea-paginator--' + size()\"\n [class.ea-paginator--left]=\"align() === 'left'\"\n [class.ea-paginator--center]=\"align() === 'center'\"\n [class.ea-paginator--disabled]=\"disabled()\"\n role=\"navigation\"\n [attr.aria-label]=\"i18n.messages().paginator.label\">\n @if (showPageSizeSelector()) {\n <div class=\"ea-paginator__page-size\">\n <label\n class=\"ea-paginator__label\"\n for=\"ea-paginator-size\">\n {{ i18n.messages().paginator.rowsPerPage }}\n </label>\n <select\n class=\"ea-paginator__select\"\n id=\"ea-paginator-size\"\n [disabled]=\"disabled()\"\n (change)=\"onPageSizeChange($event)\">\n @for (option of pageSizeOptions(); track option) {\n <option\n [value]=\"option\"\n [selected]=\"option === pageSize()\">\n {{ formatNumber(option) }}\n </option>\n }\n </select>\n </div>\n }\n\n @if (showRangeLabel()) {\n <span class=\"ea-paginator__range\">\n {{\n i18n\n .messages()\n .paginator.range(\n formatNumber(rangeStart()),\n formatNumber(rangeEnd()),\n formatNumber(totalItems())\n )\n }}\n </span>\n }\n\n <div class=\"ea-paginator__controls\">\n <ea-button\n variant=\"ghost\"\n [size]=\"size()\"\n [disabled]=\"disabled() || !canGoPrev()\"\n [aria-label]=\"i18n.messages().paginator.previousPage\"\n (clicked)=\"prevPage()\">\n <ea-icon-chevron-left />\n </ea-button>\n\n @for (p of visiblePages(); track $index) {\n @if (p === 'ellipsis') {\n <span class=\"ea-paginator__ellipsis\">\u2026</span>\n } @else {\n <ea-button\n class=\"ea-paginator__page-btn\"\n [class.ea-paginator__page-btn--active]=\"p === page()\"\n variant=\"ghost\"\n [size]=\"size()\"\n [disabled]=\"disabled()\"\n [aria-current]=\"p === page() ? 'page' : undefined\"\n (clicked)=\"goToPage(p)\">\n {{ formatNumber(p) }}\n </ea-button>\n }\n }\n\n <ea-button\n variant=\"ghost\"\n [size]=\"size()\"\n [disabled]=\"disabled() || !canGoNext()\"\n [aria-label]=\"i18n.messages().paginator.nextPage\"\n (clicked)=\"nextPage()\">\n <ea-icon-chevron-right />\n </ea-button>\n </div>\n</div>\n", styles: [".ea-paginator{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:1em;width:100%;padding:.75em 1em;font-family:var(--font-family-sans);color:var(--color-text-secondary);border-top:var(--border-width-thin) solid var(--color-border-subtle)}.ea-paginator--xs{font-size:var(--font-size-xs)}.ea-paginator--sm{font-size:var(--font-size-sm)}.ea-paginator--md{font-size:var(--font-size-md)}.ea-paginator--lg{font-size:var(--font-size-lg)}.ea-paginator--xl{font-size:var(--font-size-xl)}.ea-paginator--left{justify-content:flex-start}.ea-paginator--center{justify-content:center}.ea-paginator__page-size{display:flex;align-items:center;gap:.5em}.ea-paginator__label{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__select{padding:.25em 1.5em .25em .5em;font-size:inherit;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right 6px center;color:var(--color-text-primary);cursor:pointer;appearance:none;transition:var(--transition-colors),var(--transition-shadow)}.ea-paginator__select:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-paginator__select:disabled{opacity:.5;cursor:not-allowed}.ea-paginator__range{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__controls{display:flex;align-items:center;gap:.25em}.ea-paginator__controls ea-icon-chevron-left,.ea-paginator__controls ea-icon-chevron-right{width:1em;height:1em}.ea-paginator__page-btn--active .ea-button{font-weight:var(--font-weight-medium);border-color:var(--color-brand-text);background-color:var(--color-brand-subtle);color:var(--color-brand-text)}.ea-paginator__page-btn--active .ea-button:hover:not(.ea-button--disabled){background-color:var(--color-brand-muted)}.ea-paginator__ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:2em;height:2em;color:var(--color-text-tertiary);pointer-events:none;-webkit-user-select:none;user-select:none}.ea-paginator--disabled{pointer-events:none}.ea-paginator--disabled .ea-paginator__range,.ea-paginator--disabled .ea-paginator__label{opacity:.5}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "ea-button", inputs: ["variant", "size", "type", "disabled", "loading", "fullWidth", "icon", "aria-label", "aria-current"], outputs: ["clicked"] }, { kind: "component", type: ChevronLeftIconComponent, selector: "ea-icon-chevron-left" }, { kind: "component", type: ChevronRightIconComponent, selector: "ea-icon-chevron-right" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
8915
8951
|
}
|
|
8916
8952
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: PaginatorComponent, decorators: [{
|
|
8917
8953
|
type: Component,
|
|
8918
|
-
args: [{ selector: 'ea-paginator', imports: [
|
|
8919
|
-
|
|
8954
|
+
args: [{ selector: 'ea-paginator', imports: [
|
|
8955
|
+
NgClass,
|
|
8956
|
+
ButtonComponent,
|
|
8957
|
+
ChevronLeftIconComponent,
|
|
8958
|
+
ChevronRightIconComponent,
|
|
8959
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"ea-paginator\"\n [ngClass]=\"'ea-paginator--' + size()\"\n [class.ea-paginator--left]=\"align() === 'left'\"\n [class.ea-paginator--center]=\"align() === 'center'\"\n [class.ea-paginator--disabled]=\"disabled()\"\n role=\"navigation\"\n [attr.aria-label]=\"i18n.messages().paginator.label\">\n @if (showPageSizeSelector()) {\n <div class=\"ea-paginator__page-size\">\n <label\n class=\"ea-paginator__label\"\n for=\"ea-paginator-size\">\n {{ i18n.messages().paginator.rowsPerPage }}\n </label>\n <select\n class=\"ea-paginator__select\"\n id=\"ea-paginator-size\"\n [disabled]=\"disabled()\"\n (change)=\"onPageSizeChange($event)\">\n @for (option of pageSizeOptions(); track option) {\n <option\n [value]=\"option\"\n [selected]=\"option === pageSize()\">\n {{ formatNumber(option) }}\n </option>\n }\n </select>\n </div>\n }\n\n @if (showRangeLabel()) {\n <span class=\"ea-paginator__range\">\n {{\n i18n\n .messages()\n .paginator.range(\n formatNumber(rangeStart()),\n formatNumber(rangeEnd()),\n formatNumber(totalItems())\n )\n }}\n </span>\n }\n\n <div class=\"ea-paginator__controls\">\n <ea-button\n variant=\"ghost\"\n [size]=\"size()\"\n [disabled]=\"disabled() || !canGoPrev()\"\n [aria-label]=\"i18n.messages().paginator.previousPage\"\n (clicked)=\"prevPage()\">\n <ea-icon-chevron-left />\n </ea-button>\n\n @for (p of visiblePages(); track $index) {\n @if (p === 'ellipsis') {\n <span class=\"ea-paginator__ellipsis\">\u2026</span>\n } @else {\n <ea-button\n class=\"ea-paginator__page-btn\"\n [class.ea-paginator__page-btn--active]=\"p === page()\"\n variant=\"ghost\"\n [size]=\"size()\"\n [disabled]=\"disabled()\"\n [aria-current]=\"p === page() ? 'page' : undefined\"\n (clicked)=\"goToPage(p)\">\n {{ formatNumber(p) }}\n </ea-button>\n }\n }\n\n <ea-button\n variant=\"ghost\"\n [size]=\"size()\"\n [disabled]=\"disabled() || !canGoNext()\"\n [aria-label]=\"i18n.messages().paginator.nextPage\"\n (clicked)=\"nextPage()\">\n <ea-icon-chevron-right />\n </ea-button>\n </div>\n</div>\n", styles: [".ea-paginator{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:1em;width:100%;padding:.75em 1em;font-family:var(--font-family-sans);color:var(--color-text-secondary);border-top:var(--border-width-thin) solid var(--color-border-subtle)}.ea-paginator--xs{font-size:var(--font-size-xs)}.ea-paginator--sm{font-size:var(--font-size-sm)}.ea-paginator--md{font-size:var(--font-size-md)}.ea-paginator--lg{font-size:var(--font-size-lg)}.ea-paginator--xl{font-size:var(--font-size-xl)}.ea-paginator--left{justify-content:flex-start}.ea-paginator--center{justify-content:center}.ea-paginator__page-size{display:flex;align-items:center;gap:.5em}.ea-paginator__label{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__select{padding:.25em 1.5em .25em .5em;font-size:inherit;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right 6px center;color:var(--color-text-primary);cursor:pointer;appearance:none;transition:var(--transition-colors),var(--transition-shadow)}.ea-paginator__select:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-paginator__select:disabled{opacity:.5;cursor:not-allowed}.ea-paginator__range{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__controls{display:flex;align-items:center;gap:.25em}.ea-paginator__controls ea-icon-chevron-left,.ea-paginator__controls ea-icon-chevron-right{width:1em;height:1em}.ea-paginator__page-btn--active .ea-button{font-weight:var(--font-weight-medium);border-color:var(--color-brand-text);background-color:var(--color-brand-subtle);color:var(--color-brand-text)}.ea-paginator__page-btn--active .ea-button:hover:not(.ea-button--disabled){background-color:var(--color-brand-muted)}.ea-paginator__ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:2em;height:2em;color:var(--color-text-tertiary);pointer-events:none;-webkit-user-select:none;user-select:none}.ea-paginator--disabled{pointer-events:none}.ea-paginator--disabled .ea-paginator__range,.ea-paginator--disabled .ea-paginator__label{opacity:.5}\n"] }]
|
|
8960
|
+
}], propDecorators: { totalItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalItems", required: true }] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], showPageSizeSelector: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPageSizeSelector", required: false }] }], showRangeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRangeLabel", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], groupThousands: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupThousands", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }, { type: i0.Output, args: ["pageChange"] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
|
|
8920
8961
|
|
|
8921
8962
|
/**
|
|
8922
8963
|
* Linear progress indicator supporting both determinate (driven by `value`
|
|
@@ -9768,23 +9809,25 @@ class SegmentedComponent {
|
|
|
9768
9809
|
}
|
|
9769
9810
|
}
|
|
9770
9811
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: SegmentedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9771
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: SegmentedComponent, isStandalone: true, selector: "ea-segmented", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, errorMsg: { classPropertyName: "errorMsg", publicName: "errorMsg", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", changed: "changed" }, providers: [
|
|
9812
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: SegmentedComponent, isStandalone: true, selector: "ea-segmented", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, errorMsg: { classPropertyName: "errorMsg", publicName: "errorMsg", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", changed: "changed" }, host: { properties: { "class.ea-segmented-host--full-width": "fullWidth()" } }, providers: [
|
|
9772
9813
|
{
|
|
9773
9814
|
provide: NG_VALUE_ACCESSOR,
|
|
9774
9815
|
useExisting: forwardRef(() => SegmentedComponent),
|
|
9775
9816
|
multi: true,
|
|
9776
9817
|
},
|
|
9777
|
-
], viewQueries: [{ propertyName: "buttonEls", predicate: ["optionEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div
|
|
9818
|
+
], viewQueries: [{ propertyName: "buttonEls", predicate: ["optionEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n class=\"ea-segmented-field\"\n [class.ea-segmented-field--full-width]=\"fullWidth()\">\n @if (label(); as labelText) {\n <ea-field-label\n [text]=\"labelText\"\n [labelId]=\"id() + '-label'\"\n [required]=\"required()\" />\n }\n\n <div\n class=\"ea-segmented\"\n role=\"radiogroup\"\n [ngClass]=\"hostClasses()\"\n [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-disabled]=\"isDisabled() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \">\n @for (option of options(); track option.value; let i = $index) {\n <button\n #optionEl\n type=\"button\"\n class=\"ea-segmented__option\"\n role=\"radio\"\n [class.ea-segmented__option--selected]=\"isSelected(option)\"\n [class.ea-segmented__option--disabled]=\"isOptionDisabled(option)\"\n [attr.aria-checked]=\"isSelected(option)\"\n [attr.aria-disabled]=\"isOptionDisabled(option) || null\"\n [disabled]=\"isOptionDisabled(option)\"\n [attr.tabindex]=\"isSelected(option) || (!value() && i === 0) ? 0 : -1\"\n (click)=\"select(option)\"\n (keydown)=\"handleKeydown($event, i)\">\n {{ option.label }}\n </button>\n }\n </div>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"showError() ? errorMsg() : null\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [":host(.ea-segmented-host--full-width){display:block;width:100%}.ea-segmented-field{display:inline-flex;flex-direction:column;gap:var(--space-1-5)}.ea-segmented-field--full-width{width:100%}.ea-segmented{display:inline-flex;flex-direction:row;flex-wrap:wrap;row-gap:var(--space-0-5);max-width:100%;padding:var(--space-0-5);background-color:var(--color-bg-muted);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);font-family:var(--font-family-sans)}.ea-segmented--full-width{display:flex;width:100%}.ea-segmented--full-width .ea-segmented__option{flex:1}.ea-segmented--disabled{opacity:.5;cursor:not-allowed}.ea-segmented--error{border-color:var(--color-error-default)}.ea-segmented--xs .ea-segmented__option{font-size:var(--font-size-xs)}.ea-segmented--sm .ea-segmented__option{font-size:var(--font-size-sm)}.ea-segmented--md .ea-segmented__option{font-size:var(--font-size-md)}.ea-segmented--lg .ea-segmented__option{font-size:var(--font-size-lg)}.ea-segmented--xl .ea-segmented__option{font-size:var(--font-size-xl)}.ea-segmented__option{display:inline-flex;align-items:center;justify-content:center;gap:.375em;min-height:2.25em;padding:.375em .75em;font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);background:transparent;border:var(--border-width-thin) solid transparent;border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors),var(--transition-shadow)}.ea-segmented__option:hover:not(.ea-segmented__option--selected):not(.ea-segmented__option--disabled){color:var(--color-text-primary);background-color:var(--color-state-active)}.ea-segmented__option:focus-visible{box-shadow:var(--shadow-focus-ring);outline:none}.ea-segmented__option--selected{background-color:var(--color-bg-base);border-color:var(--color-border-default);color:var(--color-text-primary);box-shadow:var(--shadow-sm)}.ea-segmented__option--disabled{cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: FieldLabelComponent, selector: "ea-field-label", inputs: ["text", "forId", "required", "labelId"] }, { kind: "component", type: FieldMessagesComponent, selector: "ea-field-messages", inputs: ["id", "error", "hint"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9778
9819
|
}
|
|
9779
9820
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: SegmentedComponent, decorators: [{
|
|
9780
9821
|
type: Component,
|
|
9781
|
-
args: [{ selector: 'ea-segmented', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
9822
|
+
args: [{ selector: 'ea-segmented', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
9823
|
+
'[class.ea-segmented-host--full-width]': 'fullWidth()',
|
|
9824
|
+
}, imports: [FieldLabelComponent, FieldMessagesComponent, NgClass], providers: [
|
|
9782
9825
|
{
|
|
9783
9826
|
provide: NG_VALUE_ACCESSOR,
|
|
9784
9827
|
useExisting: forwardRef(() => SegmentedComponent),
|
|
9785
9828
|
multi: true,
|
|
9786
9829
|
},
|
|
9787
|
-
], template: "<div
|
|
9830
|
+
], template: "<div\n class=\"ea-segmented-field\"\n [class.ea-segmented-field--full-width]=\"fullWidth()\">\n @if (label(); as labelText) {\n <ea-field-label\n [text]=\"labelText\"\n [labelId]=\"id() + '-label'\"\n [required]=\"required()\" />\n }\n\n <div\n class=\"ea-segmented\"\n role=\"radiogroup\"\n [ngClass]=\"hostClasses()\"\n [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-disabled]=\"isDisabled() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \">\n @for (option of options(); track option.value; let i = $index) {\n <button\n #optionEl\n type=\"button\"\n class=\"ea-segmented__option\"\n role=\"radio\"\n [class.ea-segmented__option--selected]=\"isSelected(option)\"\n [class.ea-segmented__option--disabled]=\"isOptionDisabled(option)\"\n [attr.aria-checked]=\"isSelected(option)\"\n [attr.aria-disabled]=\"isOptionDisabled(option) || null\"\n [disabled]=\"isOptionDisabled(option)\"\n [attr.tabindex]=\"isSelected(option) || (!value() && i === 0) ? 0 : -1\"\n (click)=\"select(option)\"\n (keydown)=\"handleKeydown($event, i)\">\n {{ option.label }}\n </button>\n }\n </div>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"showError() ? errorMsg() : null\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [":host(.ea-segmented-host--full-width){display:block;width:100%}.ea-segmented-field{display:inline-flex;flex-direction:column;gap:var(--space-1-5)}.ea-segmented-field--full-width{width:100%}.ea-segmented{display:inline-flex;flex-direction:row;flex-wrap:wrap;row-gap:var(--space-0-5);max-width:100%;padding:var(--space-0-5);background-color:var(--color-bg-muted);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);font-family:var(--font-family-sans)}.ea-segmented--full-width{display:flex;width:100%}.ea-segmented--full-width .ea-segmented__option{flex:1}.ea-segmented--disabled{opacity:.5;cursor:not-allowed}.ea-segmented--error{border-color:var(--color-error-default)}.ea-segmented--xs .ea-segmented__option{font-size:var(--font-size-xs)}.ea-segmented--sm .ea-segmented__option{font-size:var(--font-size-sm)}.ea-segmented--md .ea-segmented__option{font-size:var(--font-size-md)}.ea-segmented--lg .ea-segmented__option{font-size:var(--font-size-lg)}.ea-segmented--xl .ea-segmented__option{font-size:var(--font-size-xl)}.ea-segmented__option{display:inline-flex;align-items:center;justify-content:center;gap:.375em;min-height:2.25em;padding:.375em .75em;font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);background:transparent;border:var(--border-width-thin) solid transparent;border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors),var(--transition-shadow)}.ea-segmented__option:hover:not(.ea-segmented__option--selected):not(.ea-segmented__option--disabled){color:var(--color-text-primary);background-color:var(--color-state-active)}.ea-segmented__option:focus-visible{box-shadow:var(--shadow-focus-ring);outline:none}.ea-segmented__option--selected{background-color:var(--color-bg-base);border-color:var(--color-border-default);color:var(--color-text-primary);box-shadow:var(--shadow-sm)}.ea-segmented__option--disabled{cursor:not-allowed}\n"] }]
|
|
9788
9831
|
}], propDecorators: { buttonEls: [{ type: i0.ViewChildren, args: ['optionEl', { isSignal: true }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], errorMsg: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMsg", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
|
|
9789
9832
|
|
|
9790
9833
|
// Default value formatter, identity-checked so a custom `formatValue` bypasses
|
|
@@ -10140,11 +10183,11 @@ class StepperComponent {
|
|
|
10140
10183
|
return -1;
|
|
10141
10184
|
}
|
|
10142
10185
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: StepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10143
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: StepperComponent, isStandalone: true, selector: "ea-stepper", inputs: { activeStep: { classPropertyName: "activeStep", publicName: "activeStep", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeStep: "activeStepChange", changed: "changed" }, ngImport: i0, template: "<div\n class=\"ea-stepper\"\n [ngClass]=\"hostClasses()\">\n <div\n class=\"ea-stepper__list\"\n role=\"tablist\"\n (keydown)=\"handleKeydown($event)\">\n @for (step of registeredSteps(); let i = $index; track step) {\n <
|
|
10186
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: StepperComponent, isStandalone: true, selector: "ea-stepper", inputs: { activeStep: { classPropertyName: "activeStep", publicName: "activeStep", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeStep: "activeStepChange", changed: "changed" }, ngImport: i0, template: "<div\n class=\"ea-stepper\"\n [ngClass]=\"hostClasses()\">\n <div\n class=\"ea-stepper__list\"\n role=\"tablist\"\n (keydown)=\"handleKeydown($event)\">\n @for (step of registeredSteps(); let i = $index; track step) {\n <button\n type=\"button\"\n role=\"tab\"\n class=\"ea-stepper__button\"\n [class.ea-stepper__button--active]=\"i === activeStep()\"\n [class.ea-stepper__button--completed]=\"step.completed()\"\n [id]=\"step.id() + '-tab'\"\n [attr.aria-controls]=\"step.id() + '-panel'\"\n [attr.aria-selected]=\"i === activeStep()\"\n [attr.aria-current]=\"i === activeStep() ? 'step' : null\"\n [disabled]=\"!canNavigateTo(i)\"\n [tabindex]=\"i === activeStep() ? 0 : -1\"\n (click)=\"selectStep(i)\">\n <span\n class=\"ea-stepper__circle\"\n aria-hidden=\"true\">\n @if (step.completed()) {\n <ea-icon-check />\n } @else {\n {{ i + 1 }}\n }\n </span>\n <span class=\"ea-stepper__label\">\n {{ step.label() }}\n @if (step.optional()) {\n <span class=\"ea-stepper__optional\">\n ({{ i18n.messages().stepper.optional }})\n </span>\n }\n </span>\n </button>\n @if (i < registeredSteps().length - 1) {\n <span\n class=\"ea-stepper__connector\"\n [class.ea-stepper__connector--completed]=\"step.completed()\"\n aria-hidden=\"true\">\n </span>\n }\n }\n </div>\n <ng-content />\n</div>\n", styles: [".ea-stepper{display:flex;flex-direction:column;gap:var(--space-4)}.ea-stepper--xs{font-size:var(--font-size-xs)}.ea-stepper--sm{font-size:var(--font-size-sm)}.ea-stepper--md{font-size:var(--font-size-md)}.ea-stepper--lg{font-size:var(--font-size-lg)}.ea-stepper--xl{font-size:var(--font-size-xl)}.ea-stepper__list{display:flex;align-items:center;gap:var(--space-2);margin:0;padding:0;list-style:none}.ea-stepper__button{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:0;border:none;background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-stepper__button:focus-visible{outline:none}.ea-stepper__button:focus-visible .ea-stepper__circle{box-shadow:var(--shadow-focus-ring)}.ea-stepper__button:hover:not(:disabled){color:var(--color-text-primary)}.ea-stepper__button:disabled{cursor:not-allowed;color:var(--color-text-disabled)}.ea-stepper__circle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:2em;height:2em;font-weight:var(--font-weight-medium);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-full);background-color:var(--color-bg-base);color:var(--color-text-secondary);transition:var(--transition-colors)}.ea-stepper__circle ea-icon-check{width:.875em;height:.875em}.ea-stepper__button--active .ea-stepper__circle,.ea-stepper__button--completed .ea-stepper__circle{border-color:var(--color-brand-default);background-color:var(--color-brand-default);color:var(--color-text-inverse)}.ea-stepper__button:disabled .ea-stepper__circle{border-color:var(--color-border-default);background-color:var(--color-bg-muted);color:var(--color-text-disabled)}.ea-stepper__label{display:flex;flex-direction:column;align-items:flex-start;font-size:.875em;font-weight:var(--font-weight-medium);text-align:left;line-height:var(--line-height-tight)}.ea-stepper__button--active .ea-stepper__label{color:var(--color-text-primary)}.ea-stepper__optional{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);color:var(--color-text-tertiary)}.ea-stepper__connector{display:block;flex:1;align-self:center;min-width:var(--space-4);height:var(--border-width-thin);background-color:var(--color-border-default);transition:var(--transition-colors)}.ea-stepper__connector--completed{background-color:var(--color-brand-default)}.ea-stepper--disabled{opacity:.6;pointer-events:none}.ea-step__panel:focus-visible{outline:none}\n"], dependencies: [{ kind: "component", type: CheckIconComponent, selector: "ea-icon-check" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10144
10187
|
}
|
|
10145
10188
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: StepperComponent, decorators: [{
|
|
10146
10189
|
type: Component,
|
|
10147
|
-
args: [{ selector: 'ea-stepper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CheckIconComponent, NgClass], template: "<div\n class=\"ea-stepper\"\n [ngClass]=\"hostClasses()\">\n <div\n class=\"ea-stepper__list\"\n role=\"tablist\"\n (keydown)=\"handleKeydown($event)\">\n @for (step of registeredSteps(); let i = $index; track step) {\n <
|
|
10190
|
+
args: [{ selector: 'ea-stepper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CheckIconComponent, NgClass], template: "<div\n class=\"ea-stepper\"\n [ngClass]=\"hostClasses()\">\n <div\n class=\"ea-stepper__list\"\n role=\"tablist\"\n (keydown)=\"handleKeydown($event)\">\n @for (step of registeredSteps(); let i = $index; track step) {\n <button\n type=\"button\"\n role=\"tab\"\n class=\"ea-stepper__button\"\n [class.ea-stepper__button--active]=\"i === activeStep()\"\n [class.ea-stepper__button--completed]=\"step.completed()\"\n [id]=\"step.id() + '-tab'\"\n [attr.aria-controls]=\"step.id() + '-panel'\"\n [attr.aria-selected]=\"i === activeStep()\"\n [attr.aria-current]=\"i === activeStep() ? 'step' : null\"\n [disabled]=\"!canNavigateTo(i)\"\n [tabindex]=\"i === activeStep() ? 0 : -1\"\n (click)=\"selectStep(i)\">\n <span\n class=\"ea-stepper__circle\"\n aria-hidden=\"true\">\n @if (step.completed()) {\n <ea-icon-check />\n } @else {\n {{ i + 1 }}\n }\n </span>\n <span class=\"ea-stepper__label\">\n {{ step.label() }}\n @if (step.optional()) {\n <span class=\"ea-stepper__optional\">\n ({{ i18n.messages().stepper.optional }})\n </span>\n }\n </span>\n </button>\n @if (i < registeredSteps().length - 1) {\n <span\n class=\"ea-stepper__connector\"\n [class.ea-stepper__connector--completed]=\"step.completed()\"\n aria-hidden=\"true\">\n </span>\n }\n }\n </div>\n <ng-content />\n</div>\n", styles: [".ea-stepper{display:flex;flex-direction:column;gap:var(--space-4)}.ea-stepper--xs{font-size:var(--font-size-xs)}.ea-stepper--sm{font-size:var(--font-size-sm)}.ea-stepper--md{font-size:var(--font-size-md)}.ea-stepper--lg{font-size:var(--font-size-lg)}.ea-stepper--xl{font-size:var(--font-size-xl)}.ea-stepper__list{display:flex;align-items:center;gap:var(--space-2);margin:0;padding:0;list-style:none}.ea-stepper__button{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:0;border:none;background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-stepper__button:focus-visible{outline:none}.ea-stepper__button:focus-visible .ea-stepper__circle{box-shadow:var(--shadow-focus-ring)}.ea-stepper__button:hover:not(:disabled){color:var(--color-text-primary)}.ea-stepper__button:disabled{cursor:not-allowed;color:var(--color-text-disabled)}.ea-stepper__circle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:2em;height:2em;font-weight:var(--font-weight-medium);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-full);background-color:var(--color-bg-base);color:var(--color-text-secondary);transition:var(--transition-colors)}.ea-stepper__circle ea-icon-check{width:.875em;height:.875em}.ea-stepper__button--active .ea-stepper__circle,.ea-stepper__button--completed .ea-stepper__circle{border-color:var(--color-brand-default);background-color:var(--color-brand-default);color:var(--color-text-inverse)}.ea-stepper__button:disabled .ea-stepper__circle{border-color:var(--color-border-default);background-color:var(--color-bg-muted);color:var(--color-text-disabled)}.ea-stepper__label{display:flex;flex-direction:column;align-items:flex-start;font-size:.875em;font-weight:var(--font-weight-medium);text-align:left;line-height:var(--line-height-tight)}.ea-stepper__button--active .ea-stepper__label{color:var(--color-text-primary)}.ea-stepper__optional{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);color:var(--color-text-tertiary)}.ea-stepper__connector{display:block;flex:1;align-self:center;min-width:var(--space-4);height:var(--border-width-thin);background-color:var(--color-border-default);transition:var(--transition-colors)}.ea-stepper__connector--completed{background-color:var(--color-brand-default)}.ea-stepper--disabled{opacity:.6;pointer-events:none}.ea-step__panel:focus-visible{outline:none}\n"] }]
|
|
10148
10191
|
}], propDecorators: { activeStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeStep", required: false }] }, { type: i0.Output, args: ["activeStepChange"] }], linear: [{ type: i0.Input, args: [{ isSignal: true, alias: "linear", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
|
|
10149
10192
|
|
|
10150
10193
|
/**
|
|
@@ -11194,16 +11237,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
11194
11237
|
class ToastComponent {
|
|
11195
11238
|
toastService = inject(ToastService);
|
|
11196
11239
|
i18n = inject(EagamiI18nService);
|
|
11240
|
+
/** Viewport corner or edge the toast stack is pinned to. */
|
|
11241
|
+
position = input('bottom-right', ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
|
|
11242
|
+
/** Show a dismiss button on each toast. */
|
|
11243
|
+
clearable = input(true, ...(ngDevMode ? [{ debugName: "clearable" }] : /* istanbul ignore next */ []));
|
|
11244
|
+
containerClass = computed(() => `ea-toast-container ea-toast-container--${this.position()}`, ...(ngDevMode ? [{ debugName: "containerClass" }] : /* istanbul ignore next */ []));
|
|
11197
11245
|
getRole(toast) {
|
|
11198
11246
|
return toast.variant === 'error' || toast.variant === 'warning' ? 'alert' : 'status';
|
|
11199
11247
|
}
|
|
11200
11248
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
11201
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: ToastComponent, isStandalone: true, selector: "ea-toast", ngImport: i0, template: "@if (toastService.toasts().length) {\n <div\n class=\"
|
|
11249
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: ToastComponent, isStandalone: true, selector: "ea-toast", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (toastService.toasts().length) {\n <div\n [class]=\"containerClass()\"\n aria-live=\"polite\"\n aria-atomic=\"false\">\n @for (toast of toastService.toasts(); track toast.id) {\n <div\n class=\"ea-toast ea-toast--{{ toast.variant }}\"\n [attr.role]=\"getRole(toast)\"\n [attr.aria-live]=\"getRole(toast) === 'alert' ? 'assertive' : 'polite'\">\n <span class=\"ea-toast__message\">{{ toast.message }}</span>\n @if (clearable()) {\n <button\n class=\"ea-toast__close\"\n type=\"button\"\n [attr.aria-label]=\"i18n.messages().toast.dismiss\"\n (click)=\"toastService.dismiss(toast.id)\">\n <ea-icon-x />\n </button>\n }\n </div>\n }\n </div>\n}\n", styles: [".ea-toast-container{position:fixed;z-index:var(--z-index-toast);display:flex;flex-direction:column;gap:var(--space-2);max-width:min(24rem,100vw - var(--space-6) * 2);pointer-events:none}.ea-toast-container--top-left,.ea-toast-container--top,.ea-toast-container--top-right{top:var(--space-6)}.ea-toast-container--bottom-left,.ea-toast-container--bottom,.ea-toast-container--bottom-right{bottom:var(--space-6)}.ea-toast-container--top-left,.ea-toast-container--bottom-left{left:var(--space-6);align-items:flex-start}.ea-toast-container--top-right,.ea-toast-container--bottom-right{right:var(--space-6);align-items:flex-end}.ea-toast-container--top,.ea-toast-container--bottom{left:50%;align-items:center;transform:translate(-50%)}.ea-toast-container--top-left .ea-toast,.ea-toast-container--bottom-left .ea-toast{--ea-toast-enter-x: -100%}.ea-toast-container--top .ea-toast{--ea-toast-enter-x: 0;--ea-toast-enter-y: -100%}.ea-toast-container--bottom .ea-toast{--ea-toast-enter-x: 0;--ea-toast-enter-y: 100%}.ea-toast{--ea-toast-enter-x: 100%;--ea-toast-enter-y: 0;display:flex;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-3) var(--space-4);font-family:var(--font-family-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);pointer-events:auto;animation:ea-toast-slide-in var(--duration-slow) var(--ease-out)}@media(min-width:640px){.ea-toast{width:auto}}.ea-toast--default{background-color:var(--color-neutral-800);color:var(--color-neutral-0)}.ea-toast--success{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-success-subtle),var(--color-success-subtle));color:var(--color-success-text)}.ea-toast--warning{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-warning-subtle),var(--color-warning-subtle));color:var(--color-warning-text)}.ea-toast--error{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-error-subtle),var(--color-error-subtle));color:var(--color-error-text)}.ea-toast--info{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-info-subtle),var(--color-info-subtle));color:var(--color-info-text)}.ea-toast__message{flex:1;min-width:0}.ea-toast__close{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-toast__close>*{font-size:1.25em}.ea-toast__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-toast__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-toast__close:disabled{cursor:not-allowed;opacity:.5}.ea-toast__close ea-icon-x{width:1em;height:1em}@keyframes ea-toast-slide-in{0%{opacity:0;transform:translate(var(--ea-toast-enter-x),var(--ea-toast-enter-y))}to{opacity:1;transform:translate(0)}}@media(prefers-reduced-motion:reduce){.ea-toast{animation-name:ea-toast-fade-in}}@keyframes ea-toast-fade-in{0%{opacity:0}to{opacity:1}}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .ea-toast--success{color:var(--color-success-200)}:root:not([data-theme=light]) .ea-toast--warning{color:var(--color-warning-200)}:root:not([data-theme=light]) .ea-toast--error{color:var(--color-error-200)}:root:not([data-theme=light]) .ea-toast--info{color:var(--color-info-200)}}:root[data-theme=dark] .ea-toast--success{color:var(--color-success-200)}:root[data-theme=dark] .ea-toast--warning{color:var(--color-warning-200)}:root[data-theme=dark] .ea-toast--error{color:var(--color-error-200)}:root[data-theme=dark] .ea-toast--info{color:var(--color-info-200)}\n"], dependencies: [{ kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
11202
11250
|
}
|
|
11203
11251
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: ToastComponent, decorators: [{
|
|
11204
11252
|
type: Component,
|
|
11205
|
-
args: [{ selector: 'ea-toast', imports: [XIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (toastService.toasts().length) {\n <div\n class=\"
|
|
11206
|
-
}] });
|
|
11253
|
+
args: [{ selector: 'ea-toast', imports: [XIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (toastService.toasts().length) {\n <div\n [class]=\"containerClass()\"\n aria-live=\"polite\"\n aria-atomic=\"false\">\n @for (toast of toastService.toasts(); track toast.id) {\n <div\n class=\"ea-toast ea-toast--{{ toast.variant }}\"\n [attr.role]=\"getRole(toast)\"\n [attr.aria-live]=\"getRole(toast) === 'alert' ? 'assertive' : 'polite'\">\n <span class=\"ea-toast__message\">{{ toast.message }}</span>\n @if (clearable()) {\n <button\n class=\"ea-toast__close\"\n type=\"button\"\n [attr.aria-label]=\"i18n.messages().toast.dismiss\"\n (click)=\"toastService.dismiss(toast.id)\">\n <ea-icon-x />\n </button>\n }\n </div>\n }\n </div>\n}\n", styles: [".ea-toast-container{position:fixed;z-index:var(--z-index-toast);display:flex;flex-direction:column;gap:var(--space-2);max-width:min(24rem,100vw - var(--space-6) * 2);pointer-events:none}.ea-toast-container--top-left,.ea-toast-container--top,.ea-toast-container--top-right{top:var(--space-6)}.ea-toast-container--bottom-left,.ea-toast-container--bottom,.ea-toast-container--bottom-right{bottom:var(--space-6)}.ea-toast-container--top-left,.ea-toast-container--bottom-left{left:var(--space-6);align-items:flex-start}.ea-toast-container--top-right,.ea-toast-container--bottom-right{right:var(--space-6);align-items:flex-end}.ea-toast-container--top,.ea-toast-container--bottom{left:50%;align-items:center;transform:translate(-50%)}.ea-toast-container--top-left .ea-toast,.ea-toast-container--bottom-left .ea-toast{--ea-toast-enter-x: -100%}.ea-toast-container--top .ea-toast{--ea-toast-enter-x: 0;--ea-toast-enter-y: -100%}.ea-toast-container--bottom .ea-toast{--ea-toast-enter-x: 0;--ea-toast-enter-y: 100%}.ea-toast{--ea-toast-enter-x: 100%;--ea-toast-enter-y: 0;display:flex;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-3) var(--space-4);font-family:var(--font-family-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);pointer-events:auto;animation:ea-toast-slide-in var(--duration-slow) var(--ease-out)}@media(min-width:640px){.ea-toast{width:auto}}.ea-toast--default{background-color:var(--color-neutral-800);color:var(--color-neutral-0)}.ea-toast--success{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-success-subtle),var(--color-success-subtle));color:var(--color-success-text)}.ea-toast--warning{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-warning-subtle),var(--color-warning-subtle));color:var(--color-warning-text)}.ea-toast--error{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-error-subtle),var(--color-error-subtle));color:var(--color-error-text)}.ea-toast--info{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-info-subtle),var(--color-info-subtle));color:var(--color-info-text)}.ea-toast__message{flex:1;min-width:0}.ea-toast__close{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-toast__close>*{font-size:1.25em}.ea-toast__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-toast__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-toast__close:disabled{cursor:not-allowed;opacity:.5}.ea-toast__close ea-icon-x{width:1em;height:1em}@keyframes ea-toast-slide-in{0%{opacity:0;transform:translate(var(--ea-toast-enter-x),var(--ea-toast-enter-y))}to{opacity:1;transform:translate(0)}}@media(prefers-reduced-motion:reduce){.ea-toast{animation-name:ea-toast-fade-in}}@keyframes ea-toast-fade-in{0%{opacity:0}to{opacity:1}}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .ea-toast--success{color:var(--color-success-200)}:root:not([data-theme=light]) .ea-toast--warning{color:var(--color-warning-200)}:root:not([data-theme=light]) .ea-toast--error{color:var(--color-error-200)}:root:not([data-theme=light]) .ea-toast--info{color:var(--color-info-200)}}:root[data-theme=dark] .ea-toast--success{color:var(--color-success-200)}:root[data-theme=dark] .ea-toast--warning{color:var(--color-warning-200)}:root[data-theme=dark] .ea-toast--error{color:var(--color-error-200)}:root[data-theme=dark] .ea-toast--info{color:var(--color-info-200)}\n"] }]
|
|
11254
|
+
}], propDecorators: { position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }] } });
|
|
11207
11255
|
|
|
11208
11256
|
class ChevronsLeftIconComponent extends IconComponentBase {
|
|
11209
11257
|
static slug = 'chevrons-left';
|
|
@@ -20129,6 +20177,132 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
20129
20177
|
}]
|
|
20130
20178
|
}] });
|
|
20131
20179
|
|
|
20180
|
+
class HalfCircleIconComponent extends IconComponentBase {
|
|
20181
|
+
static slug = 'half-circle';
|
|
20182
|
+
static category = 'eagami';
|
|
20183
|
+
static tags = [
|
|
20184
|
+
'half-circle',
|
|
20185
|
+
'half',
|
|
20186
|
+
'left',
|
|
20187
|
+
'partial',
|
|
20188
|
+
'rating',
|
|
20189
|
+
'circle',
|
|
20190
|
+
'round',
|
|
20191
|
+
'shape',
|
|
20192
|
+
'demi-cercle',
|
|
20193
|
+
'demi',
|
|
20194
|
+
'gauche',
|
|
20195
|
+
'medio-círculo',
|
|
20196
|
+
'medio',
|
|
20197
|
+
'izquierda',
|
|
20198
|
+
'μισός-κύκλος',
|
|
20199
|
+
'μισό',
|
|
20200
|
+
'αριστερά',
|
|
20201
|
+
'pół-koła',
|
|
20202
|
+
'pół',
|
|
20203
|
+
'lewa',
|
|
20204
|
+
];
|
|
20205
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: HalfCircleIconComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
20206
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.16", type: HalfCircleIconComponent, isStandalone: true, selector: "ea-icon-half-circle", usesInheritance: true, ngImport: i0, template: `
|
|
20207
|
+
<svg
|
|
20208
|
+
viewBox="0 0 24 24"
|
|
20209
|
+
fill="none"
|
|
20210
|
+
stroke="currentColor"
|
|
20211
|
+
[attr.stroke-width]="strokeWidth()"
|
|
20212
|
+
stroke-linecap="round"
|
|
20213
|
+
stroke-linejoin="round"
|
|
20214
|
+
aria-hidden="true"
|
|
20215
|
+
width="100%"
|
|
20216
|
+
height="100%">
|
|
20217
|
+
<path d="M12 2 A10 10 0 0 0 12 22 Z" />
|
|
20218
|
+
</svg>
|
|
20219
|
+
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
20220
|
+
}
|
|
20221
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: HalfCircleIconComponent, decorators: [{
|
|
20222
|
+
type: Component,
|
|
20223
|
+
args: [{
|
|
20224
|
+
selector: 'ea-icon-half-circle',
|
|
20225
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
20226
|
+
template: `
|
|
20227
|
+
<svg
|
|
20228
|
+
viewBox="0 0 24 24"
|
|
20229
|
+
fill="none"
|
|
20230
|
+
stroke="currentColor"
|
|
20231
|
+
[attr.stroke-width]="strokeWidth()"
|
|
20232
|
+
stroke-linecap="round"
|
|
20233
|
+
stroke-linejoin="round"
|
|
20234
|
+
aria-hidden="true"
|
|
20235
|
+
width="100%"
|
|
20236
|
+
height="100%">
|
|
20237
|
+
<path d="M12 2 A10 10 0 0 0 12 22 Z" />
|
|
20238
|
+
</svg>
|
|
20239
|
+
`,
|
|
20240
|
+
}]
|
|
20241
|
+
}] });
|
|
20242
|
+
|
|
20243
|
+
class HalfHeartIconComponent extends IconComponentBase {
|
|
20244
|
+
static slug = 'half-heart';
|
|
20245
|
+
static category = 'eagami';
|
|
20246
|
+
static tags = [
|
|
20247
|
+
'half-heart',
|
|
20248
|
+
'half',
|
|
20249
|
+
'left',
|
|
20250
|
+
'partial',
|
|
20251
|
+
'rating',
|
|
20252
|
+
'heart',
|
|
20253
|
+
'love',
|
|
20254
|
+
'shape',
|
|
20255
|
+
'demi-cœur',
|
|
20256
|
+
'demi',
|
|
20257
|
+
'gauche',
|
|
20258
|
+
'medio-corazón',
|
|
20259
|
+
'medio',
|
|
20260
|
+
'izquierda',
|
|
20261
|
+
'μισή-καρδιά',
|
|
20262
|
+
'μισό',
|
|
20263
|
+
'αριστερά',
|
|
20264
|
+
'pół-serca',
|
|
20265
|
+
'pół',
|
|
20266
|
+
'lewa',
|
|
20267
|
+
];
|
|
20268
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: HalfHeartIconComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
20269
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.16", type: HalfHeartIconComponent, isStandalone: true, selector: "ea-icon-half-heart", usesInheritance: true, ngImport: i0, template: `
|
|
20270
|
+
<svg
|
|
20271
|
+
viewBox="0 0 24 24"
|
|
20272
|
+
fill="none"
|
|
20273
|
+
stroke="currentColor"
|
|
20274
|
+
[attr.stroke-width]="strokeWidth()"
|
|
20275
|
+
stroke-linecap="round"
|
|
20276
|
+
stroke-linejoin="round"
|
|
20277
|
+
aria-hidden="true"
|
|
20278
|
+
width="100%"
|
|
20279
|
+
height="100%">
|
|
20280
|
+
<path d="M12 5.67 L10.94 4.61 a5.5 5.5 0 0 0 -7.78 7.78 L12 21.23 Z" />
|
|
20281
|
+
</svg>
|
|
20282
|
+
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
20283
|
+
}
|
|
20284
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: HalfHeartIconComponent, decorators: [{
|
|
20285
|
+
type: Component,
|
|
20286
|
+
args: [{
|
|
20287
|
+
selector: 'ea-icon-half-heart',
|
|
20288
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
20289
|
+
template: `
|
|
20290
|
+
<svg
|
|
20291
|
+
viewBox="0 0 24 24"
|
|
20292
|
+
fill="none"
|
|
20293
|
+
stroke="currentColor"
|
|
20294
|
+
[attr.stroke-width]="strokeWidth()"
|
|
20295
|
+
stroke-linecap="round"
|
|
20296
|
+
stroke-linejoin="round"
|
|
20297
|
+
aria-hidden="true"
|
|
20298
|
+
width="100%"
|
|
20299
|
+
height="100%">
|
|
20300
|
+
<path d="M12 5.67 L10.94 4.61 a5.5 5.5 0 0 0 -7.78 7.78 L12 21.23 Z" />
|
|
20301
|
+
</svg>
|
|
20302
|
+
`,
|
|
20303
|
+
}]
|
|
20304
|
+
}] });
|
|
20305
|
+
|
|
20132
20306
|
class HardDriveIconComponent extends IconComponentBase {
|
|
20133
20307
|
static slug = 'hard-drive';
|
|
20134
20308
|
static category = 'feather';
|
|
@@ -32426,6 +32600,8 @@ const ICONS = [
|
|
|
32426
32600
|
GlobeIconComponent,
|
|
32427
32601
|
GoogleIconComponent,
|
|
32428
32602
|
GridIconComponent,
|
|
32603
|
+
HalfCircleIconComponent,
|
|
32604
|
+
HalfHeartIconComponent,
|
|
32429
32605
|
HardDriveIconComponent,
|
|
32430
32606
|
HashIconComponent,
|
|
32431
32607
|
HeadphonesIconComponent,
|
|
@@ -32619,5 +32795,5 @@ const ICONS = [
|
|
|
32619
32795
|
* Generated bundle index. Do not edit.
|
|
32620
32796
|
*/
|
|
32621
32797
|
|
|
32622
|
-
export { AccordionComponent, AccordionItemComponent, ActivityIconComponent, AirplayIconComponent, AlertCircleIconComponent, AlertComponent, AlertOctagonIconComponent, AlertTriangleIconComponent, AlignCenterIconComponent, AlignJustifyIconComponent, AlignLeftIconComponent, AlignRightIconComponent, AnchorIconComponent, ApertureIconComponent, ArchiveIconComponent, ArrowDownCircleIconComponent, ArrowDownIconComponent, ArrowDownLeftIconComponent, ArrowDownRightIconComponent, ArrowLeftCircleIconComponent, ArrowLeftIconComponent, ArrowRightCircleIconComponent, ArrowRightIconComponent, ArrowUpCircleIconComponent, ArrowUpIconComponent, ArrowUpLeftIconComponent, ArrowUpRightIconComponent, AtSignIconComponent, AutocompleteComponent, AvatarComponent, AvatarEditorComponent, AwardIconComponent, BadgeComponent, BarChart2IconComponent, BarChartIconComponent, BatteryChargingIconComponent, BatteryIconComponent, BellIconComponent, BellOffIconComponent, BluetoothIconComponent, BoldIconComponent, BookIconComponent, BookOpenIconComponent, BookmarkIconComponent, BottleIconComponent, BoxIconComponent, BreadcrumbsComponent, BriefcaseIconComponent, ButtonComponent, CalendarIconComponent, CameraIconComponent, CameraOffIconComponent, CandleIconComponent, CardComponent, CastIconComponent, CheckCircleIconComponent, CheckIconComponent, CheckSquareIconComponent, CheckboxComponent, ChevronDownIconComponent, ChevronLeftIconComponent, ChevronRightIconComponent, ChevronUpIconComponent, ChevronsDownIconComponent, ChevronsLeftIconComponent, ChevronsRightIconComponent, ChevronsUpDownIconComponent, ChevronsUpIconComponent, ChromeIconComponent, CircleIconComponent, ClipboardIconComponent, ClockIconComponent, CloudDrizzleIconComponent, CloudIconComponent, CloudLightningIconComponent, CloudOffIconComponent, CloudRainIconComponent, CloudSnowIconComponent, CloudflareIconComponent, CodeIconComponent, CodeInputComponent, CodepenIconComponent, CodesandboxIconComponent, CoffeeIconComponent, ColorPickerComponent, ColumnsIconComponent, CommandIconComponent, CommandPaletteComponent, CompassIconComponent, CopyIconComponent, CornerDownLeftIconComponent, CornerDownRightIconComponent, CornerLeftDownIconComponent, CornerLeftUpIconComponent, CornerRightDownIconComponent, CornerRightUpIconComponent, CornerUpLeftIconComponent, CornerUpRightIconComponent, CpuIconComponent, CreditCardIconComponent, CropIconComponent, CrosshairIconComponent, DEFAULT_PALETTE_ROLES, DataTableComponent, DatabaseIconComponent, DatePickerComponent, DeleteIconComponent, DialogComponent, DiscIconComponent, DiscordIconComponent, DivideCircleIconComponent, DivideIconComponent, DivideSquareIconComponent, DividerComponent, DockerIconComponent, DollarSignIconComponent, DownloadCloudIconComponent, DownloadIconComponent, DrawerComponent, DribbbleIconComponent, DropboxIconComponent, DropdownComponent, DropletIconComponent, EAGAMI_I18N_CONFIG, EAGAMI_LOCALES, EAGAMI_MESSAGES, EagamiI18nService, EagamiIconComponent, EagamiWordmarkComponent, Edit2IconComponent, Edit3IconComponent, EditIconComponent, EmptyStateComponent, ExternalLinkIconComponent, EyeIconComponent, EyeOffIconComponent, Facebook2IconComponent, FacebookIconComponent, FastForwardIconComponent, FeatherIconComponent, FieldLabelComponent, FieldMessagesComponent, Figma2IconComponent, FigmaIconComponent, FileIconComponent, FileMinusIconComponent, FilePlusIconComponent, FileTextIconComponent, FileUploaderComponent, FilmIconComponent, FilterIconComponent, FlagIconComponent, FolderIconComponent, FolderMinusIconComponent, FolderPlusIconComponent, FramerIconComponent, FrownIconComponent, GiftIconComponent, GitBranchIconComponent, GitCommitIconComponent, GitMergeIconComponent, GitPullRequestIconComponent, Github2IconComponent, GithubIconComponent, GitlabIconComponent, GlobeIconComponent, GoogleIconComponent, GridIconComponent, HardDriveIconComponent, HashIconComponent, HeadphonesIconComponent, HeartIconComponent, HelpCircleIconComponent, HeptagonIconComponent, HexagonIconComponent, HomeIconComponent, ICONS, IconComponentBase, ImageIconComponent, InboxIconComponent, InfoIconComponent, InputComponent, InstagramIconComponent, ItalicIconComponent, KeyIconComponent, KubernetesIconComponent, LampIconComponent, LayersIconComponent, LayoutIconComponent, LeftHalfStarIconComponent, LifeBuoyIconComponent, Link2IconComponent, LinkIconComponent, Linkedin2IconComponent, LinkedinIconComponent, ListIconComponent, LoaderIconComponent, LockIconComponent, LogInIconComponent, LogOutIconComponent, MailIconComponent, MapIconComponent, MapPinIconComponent, MastercardIconComponent, Maximize2IconComponent, MaximizeIconComponent, MehIconComponent, MenuComponent, MenuIconComponent, MenuItemComponent, MenuTriggerDirective, MessageCircleIconComponent, MessageSquareIconComponent, MicIconComponent, MicOffIconComponent, MicrosoftIconComponent, Minimize2IconComponent, MinimizeIconComponent, MinusCircleIconComponent, MinusIconComponent, MinusSquareIconComponent, MongodbIconComponent, MonitorIconComponent, MoonIconComponent, MoreHorizontalIconComponent, MoreVerticalIconComponent, MousePointerIconComponent, MoveIconComponent, MultiSelectComponent, MusicIconComponent, Navigation2IconComponent, NavigationIconComponent, NetlifyIconComponent, NotionIconComponent, NpmIconComponent, OctagonIconComponent, PackageIconComponent, PaginatorComponent, PaperclipIconComponent, PauseCircleIconComponent, PauseIconComponent, PaypalIconComponent, PenToolIconComponent, PentagonIconComponent, PercentIconComponent, PhoneCallIconComponent, PhoneForwardedIconComponent, PhoneIconComponent, PhoneIncomingIconComponent, PhoneMissedIconComponent, PhoneOffIconComponent, PhoneOutgoingIconComponent, PieChartIconComponent, PlayCircleIconComponent, PlayIconComponent, PlusCircleIconComponent, PlusIconComponent, PlusSquareIconComponent, PocketIconComponent, PopoverComponent, PowerIconComponent, PrinterIconComponent, ProgressBarComponent, RadioComponent, RadioGroupComponent, RadioIconComponent, RangeSliderComponent, RatingComponent, RectangleHorizontalIconComponent, RectangleVerticalIconComponent, RedditIconComponent, RefreshCcwIconComponent, RefreshCwIconComponent, RepeatIconComponent, RewindIconComponent, RightHalfStarIconComponent, RotateCcwIconComponent, RotateCwIconComponent, RssIconComponent, SaveIconComponent, ScissorsIconComponent, SearchIconComponent, SegmentedComponent, SendIconComponent, ServerIconComponent, SettingsIconComponent, Share2IconComponent, ShareIconComponent, ShieldIconComponent, ShieldOffIconComponent, ShoppingBagIconComponent, ShoppingCartIconComponent, ShuffleIconComponent, SidebarIconComponent, SkeletonComponent, SkipBackIconComponent, SkipForwardIconComponent, Slack2IconComponent, SlackIconComponent, SlashIconComponent, SliderComponent, SlidersIconComponent, SmartphoneIconComponent, SmileIconComponent, SoccerBallIconComponent, SpeakerIconComponent, SpinnerComponent, SpotifyIconComponent, SquareIconComponent, StarIconComponent, StepComponent, StepperComponent, StopCircleIconComponent, StripeIconComponent, SunIconComponent, SunriseIconComponent, SunsetIconComponent, SwitchComponent, TabComponent, TableIconComponent, TabletIconComponent, TabsComponent, TagComponent, TagIconComponent, TargetIconComponent, TerminalIconComponent, TextareaComponent, ThermometerIconComponent, ThumbsDownIconComponent, ThumbsUpIconComponent, TimePickerComponent, ToastComponent, ToastService, ToggleLeftIconComponent, ToggleRightIconComponent, ToolIconComponent, TooltipDirective, TransferListComponent, Trash2IconComponent, TrashIconComponent, TreeComponent, TrelloIconComponent, TrendingDownIconComponent, TrendingUpIconComponent, TriangleIconComponent, TrophyIconComponent, TruckIconComponent, TvIconComponent, Twitch2IconComponent, TwitchIconComponent, TwitterIconComponent, TypeIconComponent, UmbrellaIconComponent, UnderlineIconComponent, UnlockIconComponent, UploadCloudIconComponent, UploadIconComponent, UserCheckIconComponent, UserIconComponent, UserMinusIconComponent, UserPlusIconComponent, UserXIconComponent, UsersIconComponent, VercelIconComponent, VideoIconComponent, VideoOffIconComponent, VirtualListComponent, VoicemailIconComponent, Volume1IconComponent, Volume2IconComponent, VolumeIconComponent, VolumeXIconComponent, WCAG_AA, WatchIconComponent, WifiIconComponent, WifiOffIconComponent, WindIconComponent, XCircleIconComponent, XIconComponent, XOctagonIconComponent, XSquareIconComponent, XTwitterIconComponent, Youtube2IconComponent, YoutubeIconComponent, ZapIconComponent, ZapOffIconComponent, ZoomInIconComponent, ZoomOutIconComponent, applyPalette, computePopoverPosition, contrastRatio, derivePalette, el, en, esES, formatViolations, frFR, frenchSpacing, hexToOklch, iconDisplayName, oklchToHex, pl, provideEagamiUi, relativeLuminance, validatePalette, visibleNodeIds, walkTree };
|
|
32798
|
+
export { AccordionComponent, AccordionItemComponent, ActivityIconComponent, AirplayIconComponent, AlertCircleIconComponent, AlertComponent, AlertOctagonIconComponent, AlertTriangleIconComponent, AlignCenterIconComponent, AlignJustifyIconComponent, AlignLeftIconComponent, AlignRightIconComponent, AnchorIconComponent, ApertureIconComponent, ArchiveIconComponent, ArrowDownCircleIconComponent, ArrowDownIconComponent, ArrowDownLeftIconComponent, ArrowDownRightIconComponent, ArrowLeftCircleIconComponent, ArrowLeftIconComponent, ArrowRightCircleIconComponent, ArrowRightIconComponent, ArrowUpCircleIconComponent, ArrowUpIconComponent, ArrowUpLeftIconComponent, ArrowUpRightIconComponent, AtSignIconComponent, AutocompleteComponent, AvatarComponent, AvatarEditorComponent, AwardIconComponent, BadgeComponent, BarChart2IconComponent, BarChartIconComponent, BatteryChargingIconComponent, BatteryIconComponent, BellIconComponent, BellOffIconComponent, BluetoothIconComponent, BoldIconComponent, BookIconComponent, BookOpenIconComponent, BookmarkIconComponent, BottleIconComponent, BoxIconComponent, BreadcrumbsComponent, BriefcaseIconComponent, ButtonComponent, CalendarIconComponent, CameraIconComponent, CameraOffIconComponent, CandleIconComponent, CardComponent, CastIconComponent, CheckCircleIconComponent, CheckIconComponent, CheckSquareIconComponent, CheckboxComponent, ChevronDownIconComponent, ChevronLeftIconComponent, ChevronRightIconComponent, ChevronUpIconComponent, ChevronsDownIconComponent, ChevronsLeftIconComponent, ChevronsRightIconComponent, ChevronsUpDownIconComponent, ChevronsUpIconComponent, ChromeIconComponent, CircleIconComponent, ClipboardIconComponent, ClockIconComponent, CloudDrizzleIconComponent, CloudIconComponent, CloudLightningIconComponent, CloudOffIconComponent, CloudRainIconComponent, CloudSnowIconComponent, CloudflareIconComponent, CodeIconComponent, CodeInputComponent, CodepenIconComponent, CodesandboxIconComponent, CoffeeIconComponent, ColorPickerComponent, ColumnsIconComponent, CommandIconComponent, CommandPaletteComponent, CompassIconComponent, CopyIconComponent, CornerDownLeftIconComponent, CornerDownRightIconComponent, CornerLeftDownIconComponent, CornerLeftUpIconComponent, CornerRightDownIconComponent, CornerRightUpIconComponent, CornerUpLeftIconComponent, CornerUpRightIconComponent, CpuIconComponent, CreditCardIconComponent, CropIconComponent, CrosshairIconComponent, DEFAULT_PALETTE_ROLES, DataTableComponent, DatabaseIconComponent, DatePickerComponent, DeleteIconComponent, DialogComponent, DiscIconComponent, DiscordIconComponent, DivideCircleIconComponent, DivideIconComponent, DivideSquareIconComponent, DividerComponent, DockerIconComponent, DollarSignIconComponent, DownloadCloudIconComponent, DownloadIconComponent, DrawerComponent, DribbbleIconComponent, DropboxIconComponent, DropdownComponent, DropletIconComponent, EAGAMI_I18N_CONFIG, EAGAMI_LOCALES, EAGAMI_MESSAGES, EagamiI18nService, EagamiIconComponent, EagamiWordmarkComponent, Edit2IconComponent, Edit3IconComponent, EditIconComponent, EmptyStateComponent, ExternalLinkIconComponent, EyeIconComponent, EyeOffIconComponent, Facebook2IconComponent, FacebookIconComponent, FastForwardIconComponent, FeatherIconComponent, FieldLabelComponent, FieldMessagesComponent, Figma2IconComponent, FigmaIconComponent, FileIconComponent, FileMinusIconComponent, FilePlusIconComponent, FileTextIconComponent, FileUploaderComponent, FilmIconComponent, FilterIconComponent, FlagIconComponent, FolderIconComponent, FolderMinusIconComponent, FolderPlusIconComponent, FramerIconComponent, FrownIconComponent, GiftIconComponent, GitBranchIconComponent, GitCommitIconComponent, GitMergeIconComponent, GitPullRequestIconComponent, Github2IconComponent, GithubIconComponent, GitlabIconComponent, GlobeIconComponent, GoogleIconComponent, GridIconComponent, HalfCircleIconComponent, HalfHeartIconComponent, HardDriveIconComponent, HashIconComponent, HeadphonesIconComponent, HeartIconComponent, HelpCircleIconComponent, HeptagonIconComponent, HexagonIconComponent, HomeIconComponent, ICONS, IconComponentBase, ImageIconComponent, InboxIconComponent, InfoIconComponent, InputComponent, InstagramIconComponent, ItalicIconComponent, KeyIconComponent, KubernetesIconComponent, LampIconComponent, LayersIconComponent, LayoutIconComponent, LeftHalfStarIconComponent, LifeBuoyIconComponent, Link2IconComponent, LinkIconComponent, Linkedin2IconComponent, LinkedinIconComponent, ListIconComponent, LoaderIconComponent, LockIconComponent, LogInIconComponent, LogOutIconComponent, MailIconComponent, MapIconComponent, MapPinIconComponent, MastercardIconComponent, Maximize2IconComponent, MaximizeIconComponent, MehIconComponent, MenuComponent, MenuIconComponent, MenuItemComponent, MenuTriggerDirective, MessageCircleIconComponent, MessageSquareIconComponent, MicIconComponent, MicOffIconComponent, MicrosoftIconComponent, Minimize2IconComponent, MinimizeIconComponent, MinusCircleIconComponent, MinusIconComponent, MinusSquareIconComponent, MongodbIconComponent, MonitorIconComponent, MoonIconComponent, MoreHorizontalIconComponent, MoreVerticalIconComponent, MousePointerIconComponent, MoveIconComponent, MultiSelectComponent, MusicIconComponent, Navigation2IconComponent, NavigationIconComponent, NetlifyIconComponent, NotionIconComponent, NpmIconComponent, OctagonIconComponent, PackageIconComponent, PaginatorComponent, PaperclipIconComponent, PauseCircleIconComponent, PauseIconComponent, PaypalIconComponent, PenToolIconComponent, PentagonIconComponent, PercentIconComponent, PhoneCallIconComponent, PhoneForwardedIconComponent, PhoneIconComponent, PhoneIncomingIconComponent, PhoneMissedIconComponent, PhoneOffIconComponent, PhoneOutgoingIconComponent, PieChartIconComponent, PlayCircleIconComponent, PlayIconComponent, PlusCircleIconComponent, PlusIconComponent, PlusSquareIconComponent, PocketIconComponent, PopoverComponent, PowerIconComponent, PrinterIconComponent, ProgressBarComponent, RadioComponent, RadioGroupComponent, RadioIconComponent, RangeSliderComponent, RatingComponent, RectangleHorizontalIconComponent, RectangleVerticalIconComponent, RedditIconComponent, RefreshCcwIconComponent, RefreshCwIconComponent, RepeatIconComponent, RewindIconComponent, RightHalfStarIconComponent, RotateCcwIconComponent, RotateCwIconComponent, RssIconComponent, SaveIconComponent, ScissorsIconComponent, SearchIconComponent, SegmentedComponent, SendIconComponent, ServerIconComponent, SettingsIconComponent, Share2IconComponent, ShareIconComponent, ShieldIconComponent, ShieldOffIconComponent, ShoppingBagIconComponent, ShoppingCartIconComponent, ShuffleIconComponent, SidebarIconComponent, SkeletonComponent, SkipBackIconComponent, SkipForwardIconComponent, Slack2IconComponent, SlackIconComponent, SlashIconComponent, SliderComponent, SlidersIconComponent, SmartphoneIconComponent, SmileIconComponent, SoccerBallIconComponent, SpeakerIconComponent, SpinnerComponent, SpotifyIconComponent, SquareIconComponent, StarIconComponent, StepComponent, StepperComponent, StopCircleIconComponent, StripeIconComponent, SunIconComponent, SunriseIconComponent, SunsetIconComponent, SwitchComponent, TabComponent, TableIconComponent, TabletIconComponent, TabsComponent, TagComponent, TagIconComponent, TargetIconComponent, TerminalIconComponent, TextareaComponent, ThermometerIconComponent, ThumbsDownIconComponent, ThumbsUpIconComponent, TimePickerComponent, ToastComponent, ToastService, ToggleLeftIconComponent, ToggleRightIconComponent, ToolIconComponent, TooltipDirective, TransferListComponent, Trash2IconComponent, TrashIconComponent, TreeComponent, TrelloIconComponent, TrendingDownIconComponent, TrendingUpIconComponent, TriangleIconComponent, TrophyIconComponent, TruckIconComponent, TvIconComponent, Twitch2IconComponent, TwitchIconComponent, TwitterIconComponent, TypeIconComponent, UmbrellaIconComponent, UnderlineIconComponent, UnlockIconComponent, UploadCloudIconComponent, UploadIconComponent, UserCheckIconComponent, UserIconComponent, UserMinusIconComponent, UserPlusIconComponent, UserXIconComponent, UsersIconComponent, VercelIconComponent, VideoIconComponent, VideoOffIconComponent, VirtualListComponent, VoicemailIconComponent, Volume1IconComponent, Volume2IconComponent, VolumeIconComponent, VolumeXIconComponent, WCAG_AA, WatchIconComponent, WifiIconComponent, WifiOffIconComponent, WindIconComponent, XCircleIconComponent, XIconComponent, XOctagonIconComponent, XSquareIconComponent, XTwitterIconComponent, Youtube2IconComponent, YoutubeIconComponent, ZapIconComponent, ZapOffIconComponent, ZoomInIconComponent, ZoomOutIconComponent, applyPalette, computePopoverPosition, contrastRatio, derivePalette, el, en, esES, formatViolations, frFR, frenchSpacing, hexToOklch, iconDisplayName, oklchToHex, pl, provideEagamiUi, relativeLuminance, validatePalette, visibleNodeIds, walkTree };
|
|
32623
32799
|
//# sourceMappingURL=eagami-ui.mjs.map
|