nath-angular-ui 0.8.8 → 0.8.10
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.
|
@@ -210,11 +210,11 @@ class NathAutocomplete {
|
|
|
210
210
|
this.isOpen.set(true);
|
|
211
211
|
}
|
|
212
212
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NathAutocomplete, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
213
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NathAutocomplete, isStandalone: true, selector: "nath-autocomplete", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, displayWith: { classPropertyName: "displayWith", publicName: "displayWith", isSignal: true, isRequired: false, transformFunction: null }, valueWith: { classPropertyName: "valueWith", publicName: "valueWith", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, dropdown: { classPropertyName: "dropdown", publicName: "dropdown", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, delay: { classPropertyName: "delay", publicName: "delay", isSignal: true, isRequired: false, transformFunction: null }, minQueryLength: { classPropertyName: "minQueryLength", publicName: "minQueryLength", isSignal: true, isRequired: false, transformFunction: null }, borderless: { classPropertyName: "borderless", publicName: "borderless", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, forceDisabled: { classPropertyName: "forceDisabled", publicName: "forceDisabled", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", debouncedQueryChange: "debouncedQueryChange", cleared: "cleared", unselected: "unselected", query: "queryChange" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputField", first: true, predicate: ["inputField"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n (click)=\"inputField?.focus()\"\r\n (keydown.enter)=\"inputField?.focus()\"\r\n class=\"input nath-autocomplete-theme ac-input-container\"\r\n [ngClass]=\"{\r\n 'ac-has-clear-btn': showClearButton(),\r\n 'ac-borderless-container': borderless(),\r\n 'ac-no-right-radius': dropdown()\r\n }\"\r\n cdkOverlayOrigin\r\n #origin=\"cdkOverlayOrigin\"\r\n>\r\n @if (multiple()) {\r\n @for (item of selectedItems(); track $index) {\r\n <div class=\"ac-selected-tag\">\r\n <span [ngClass]=\"{'ac-tag-disabled': isDisabled()}\">\r\n {{ displayFn()(item) }}\r\n </span>\r\n\r\n <button\r\n type=\"button\"\r\n (click)=\"removeItem(item, $event)\"\r\n class=\"ac-remove-tag-btn\"\r\n [disabled]=\"isDisabled()\"\r\n >\r\n <svg\r\n class=\"ac-svg-icon\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2.5\"\r\n d=\"M6 18L18 6M6 6l12 12\"\r\n />\r\n </svg>\r\n </button>\r\n </div>\r\n }\r\n }\r\n\r\n <input\r\n #inputField\r\n type=\"text\"\r\n [id]=\"inputId()\"\r\n [placeholder]=\"selectedItems().length === 0 || !multiple() ? placeholder() : ''\"\r\n [value]=\"inputValue()\"\r\n [disabled]=\"isDisabled()\"\r\n (input)=\"onInputChange($event)\"\r\n (keydown)=\"onKeyDown($event)\"\r\n class=\"ac-native-input inner-input\"\r\n [ngClass]=\"{ 'ac-borderless-input': borderless() }\"\r\n />\r\n\r\n @if (showClearButton()) {\r\n <button\r\n type=\"button\"\r\n class=\"ac-clear-button\"\r\n [disabled]=\"isDisabled()\"\r\n (click)=\"clear()\"\r\n >\r\n <svg lucideX [size]=\"16\" />\r\n </button>\r\n }\r\n</div>\r\n\r\n<ng-template\r\n cdkConnectedOverlay\r\n [cdkConnectedOverlayOrigin]=\"origin\"\r\n [cdkConnectedOverlayOpen]=\"isOpen() && items().length > 0\"\r\n [cdkConnectedOverlayHasBackdrop]=\"true\"\r\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\r\n [cdkConnectedOverlayPanelClass]=\"'nath-autocomplete-theme'\"\r\n (backdropClick)=\"isOpen.set(false)\"\r\n>\r\n <div\r\n class=\"ac-dropdown-overlay\"\r\n [style.width.px]=\"elementRef.nativeElement?.getBoundingClientRect()?.width\"\r\n >\r\n @for (item of items(); track $index) {\r\n <div\r\n (click)=\"selectItem(item)\"\r\n (keydown.enter)=\"selectItem(item)\"\r\n class=\"ac-dropdown-item\"\r\n [class.is-active]=\"activeTrackedIndex() === $index\"\r\n >\r\n @if (!itemTemplate()) {\r\n {{ displayFn()(item) }}\r\n } @else {\r\n <ng-container\r\n *ngTemplateOutlet=\"itemTemplate()!; context: { $implicit: item }\"\r\n ></ng-container>\r\n }\r\n </div>\r\n }\r\n @if (items().length === 0) {\r\n <div class=\"ac-dropdown-item\">\r\n {{ emptyMessage() }}\r\n </div>\r\n }\r\n </div>\r\n</ng-template>\r\n\r\n@if (dropdown()) {\r\n <button\r\n type=\"button\"\r\n class=\"button-secondary ac-dropdown-trigger-btn\"\r\n [disabled]=\"isDisabled()\"\r\n (click)=\"openDropdown()\"\r\n >\r\n <svg lucideChevronDown [size]=\"16\" />\r\n </button>\r\n}\r\n", styles: ["nath-autocomplete{display:flex;width:100%}nath-autocomplete,.nath-autocomplete-theme{--nath-autocomplete-bg: #ffffff;--nath-autocomplete-border: var(--color-zinc-300, oklch(87.1% .006 286.286));--nath-autocomplete-radius: .375rem;--nath-autocomplete-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-autocomplete-ring-color: var(--color-indigo-500, oklch(58.5% .233 277.117));--nath-autocomplete-input-padding: .25rem;--nath-autocomplete-placeholder: var(--color-gray-400, oklch(70.5% .015 286.067));--nath-autocomplete-tag-bg: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-autocomplete-tag-text: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-autocomplete-button-hover-bg: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-overlay-bg: #ffffff;--nath-autocomplete-overlay-border: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-overlay-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--nath-autocomplete-text-main: var(--color-gray-800, oklch(27.8% .033 256.848));--nath-autocomplete-text-muted: var(--color-gray-500, oklch(55.1% .027 264.364));--nath-autocomplete-hover-bg: var(--color-gray-100, oklch(96.7% .003 264.542));--nath-autocomplete-hover-text: var(--color-gray-900, oklch(21% .006 285.885));--nath-autocomplete-selected-bg: var(--color-indigo-50, oklch(96.2% .018 272.846));--nath-autocomplete-selected-text: var(--color-indigo-900, oklch(25.7% .09 270.891))}.dark nath-autocomplete,.dark .nath-autocomplete-theme{--nath-autocomplete-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-autocomplete-border: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-autocomplete-overlay-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-autocomplete-overlay-border: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-autocomplete-text-main: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-text-muted: var(--color-zinc-400, oklch(70.5% .015 286.067));--nath-autocomplete-placeholder: var(--color-zinc-500, oklch(55.2% .016 285.938));--nath-autocomplete-tag-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-autocomplete-tag-text: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-button-hover-bg: var(--color-zinc-700, oklch(37% .013 285.805));--nath-autocomplete-hover-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-autocomplete-hover-text: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-autocomplete-selected-bg: var(--color-indigo-950, oklch(15.2% .06 273.111));--nath-autocomplete-selected-text: var(--color-indigo-100, oklch(92% .04 273.111))}.ac-input-container{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;position:relative;flex-grow:1;padding:var(--nath-autocomplete-input-padding);background-color:var(--nath-autocomplete-bg);border:1px solid var(--nath-autocomplete-border);border-radius:var(--nath-autocomplete-radius);box-shadow:var(--nath-autocomplete-shadow);transition:border-color .2s,box-shadow .2s}.ac-input-container:focus-within{outline:none;border-color:var(--nath-autocomplete-ring-color);box-shadow:0 0 0 2px var(--nath-autocomplete-ring-color)}.ac-has-clear-btn{padding-right:2.5rem!important}.ac-borderless-container{border:0!important;box-shadow:none!important}.ac-borderless-container:focus-within{outline:none!important}.ac-no-right-radius{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.ac-selected-tag{display:inline-flex;align-items:center;gap:.25rem;background-color:var(--nath-autocomplete-tag-bg);color:var(--nath-autocomplete-tag-text);font-weight:500;padding:.25rem .375rem .25rem .625rem;border-radius:.375rem}.ac-tag-disabled{opacity:.5;cursor:not-allowed}.ac-remove-tag-btn{width:1rem;height:1rem;padding:0!important;border:none;box-shadow:none!important;border-radius:9999px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--nath-autocomplete-text-muted);transition:background-color .15s,color .15s;cursor:pointer}.ac-remove-tag-btn:disabled{cursor:not-allowed}.ac-remove-tag-btn:not(:disabled):hover{background-color:var(--nath-autocomplete-button-hover-bg);color:var(--nath-autocomplete-text-main)}.ac-clear-button{position:absolute;right:.5rem;background:transparent;border:none;cursor:pointer;color:var(--nath-autocomplete-text-muted)}.ac-svg-icon{width:.75rem;height:.75rem;display:block}.ac-native-input{flex:1 1 0%;min-width:120px;border:none;background:transparent;color:var(--nath-autocomplete-text-main);box-shadow:none}.ac-native-input::placeholder{color:var(--nath-autocomplete-placeholder)}.ac-native-input:focus{outline:none}.ac-borderless-input{padding-left:0!important;padding-right:0!important}.ac-dropdown-overlay{max-height:15rem;overflow-y:auto;background-color:var(--nath-autocomplete-overlay-bg);border:1px solid var(--nath-autocomplete-overlay-border);border-radius:.375rem;box-shadow:var(--nath-autocomplete-overlay-shadow);padding:.25rem 0;z-index:50;display:flex;flex-direction:column;box-sizing:border-box}.ac-dropdown-item{padding:.625rem 1rem;cursor:pointer;display:flex;align-items:center;transition:background-color .15s,color .15s;color:var(--nath-autocomplete-text-main)}.ac-dropdown-item:hover{background-color:var(--nath-autocomplete-hover-bg);color:var(--nath-autocomplete-hover-text)}.ac-dropdown-item.is-active{background-color:var(--nath-autocomplete-selected-bg)!important;color:var(--nath-autocomplete-selected-text)!important}.ac-dropdown-trigger-btn{border-top-left-radius:0!important;border-bottom-left-radius:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
213
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NathAutocomplete, isStandalone: true, selector: "nath-autocomplete", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, displayWith: { classPropertyName: "displayWith", publicName: "displayWith", isSignal: true, isRequired: false, transformFunction: null }, valueWith: { classPropertyName: "valueWith", publicName: "valueWith", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, dropdown: { classPropertyName: "dropdown", publicName: "dropdown", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, delay: { classPropertyName: "delay", publicName: "delay", isSignal: true, isRequired: false, transformFunction: null }, minQueryLength: { classPropertyName: "minQueryLength", publicName: "minQueryLength", isSignal: true, isRequired: false, transformFunction: null }, borderless: { classPropertyName: "borderless", publicName: "borderless", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, forceDisabled: { classPropertyName: "forceDisabled", publicName: "forceDisabled", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", debouncedQueryChange: "debouncedQueryChange", cleared: "cleared", unselected: "unselected", query: "queryChange" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputField", first: true, predicate: ["inputField"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n (click)=\"inputField?.focus()\"\n (keydown.enter)=\"inputField?.focus()\"\n class=\"input nath-autocomplete-theme ac-input-container\"\n [ngClass]=\"{\n 'ac-has-clear-btn': showClearButton(),\n 'ac-borderless-container': borderless(),\n 'ac-no-right-radius': dropdown(),\n }\"\n cdkOverlayOrigin\n #origin=\"cdkOverlayOrigin\"\n>\n @if (multiple()) {\n @for (item of selectedItems(); track $index) {\n <div class=\"ac-selected-tag\">\n <span [ngClass]=\"{ 'ac-tag-disabled': isDisabled() }\">\n {{ displayFn()(item) }}\n </span>\n\n <button\n type=\"button\"\n (click)=\"removeItem(item, $event)\"\n class=\"ac-remove-tag-btn\"\n [disabled]=\"isDisabled()\"\n >\n <svg class=\"ac-svg-icon\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2.5\"\n d=\"M6 18L18 6M6 6l12 12\"\n />\n </svg>\n </button>\n </div>\n }\n }\n\n <input\n #inputField\n type=\"text\"\n [id]=\"inputId()\"\n [placeholder]=\"selectedItems().length === 0 || !multiple() ? placeholder() : ''\"\n [value]=\"inputValue()\"\n [disabled]=\"isDisabled()\"\n (input)=\"onInputChange($event)\"\n (keydown)=\"onKeyDown($event)\"\n class=\"ac-native-input\"\n [ngClass]=\"{ 'ac-borderless-input': borderless() }\"\n />\n\n @if (showClearButton()) {\n <button type=\"button\" class=\"ac-clear-button\" [disabled]=\"isDisabled()\" (click)=\"clear()\">\n <svg lucideX [size]=\"16\" />\n </button>\n }\n</div>\n\n<ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"origin\"\n [cdkConnectedOverlayOpen]=\"isOpen() && items().length > 0\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n [cdkConnectedOverlayPanelClass]=\"'nath-autocomplete-theme'\"\n (backdropClick)=\"isOpen.set(false)\"\n>\n <div\n class=\"ac-dropdown-overlay\"\n [style.width.px]=\"elementRef.nativeElement?.getBoundingClientRect()?.width\"\n >\n @for (item of items(); track $index) {\n <div\n (click)=\"selectItem(item)\"\n (keydown.enter)=\"selectItem(item)\"\n class=\"ac-dropdown-item\"\n [class.is-active]=\"activeTrackedIndex() === $index\"\n >\n @if (!itemTemplate()) {\n {{ displayFn()(item) }}\n } @else {\n <ng-container\n *ngTemplateOutlet=\"itemTemplate()!; context: { $implicit: item }\"\n ></ng-container>\n }\n </div>\n }\n @if (items().length === 0) {\n <div class=\"ac-dropdown-item\">\n {{ emptyMessage() }}\n </div>\n }\n </div>\n</ng-template>\n\n@if (dropdown()) {\n <button\n type=\"button\"\n class=\"button-secondary ac-dropdown-trigger-btn\"\n [disabled]=\"isDisabled()\"\n (click)=\"openDropdown()\"\n >\n <svg lucideChevronDown [size]=\"16\" />\n </button>\n}\n", styles: ["nath-autocomplete{display:flex;width:100%}nath-autocomplete,.nath-autocomplete-theme{--nath-autocomplete-bg: #ffffff;--nath-autocomplete-border: var(--color-zinc-300, oklch(87.1% .006 286.286));--nath-autocomplete-radius: .375rem;--nath-autocomplete-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-autocomplete-ring-color: var(--color-indigo-500, oklch(58.5% .233 277.117));--nath-autocomplete-input-padding: .25rem;--nath-autocomplete-placeholder: var(--color-gray-400, oklch(70.5% .015 286.067));--nath-autocomplete-tag-bg: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-autocomplete-tag-text: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-autocomplete-button-hover-bg: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-overlay-bg: #ffffff;--nath-autocomplete-overlay-border: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-overlay-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--nath-autocomplete-text-main: var(--color-gray-800, oklch(27.8% .033 256.848));--nath-autocomplete-text-muted: var(--color-gray-500, oklch(55.1% .027 264.364));--nath-autocomplete-hover-bg: var(--color-gray-100, oklch(96.7% .003 264.542));--nath-autocomplete-hover-text: var(--color-gray-900, oklch(21% .006 285.885));--nath-autocomplete-selected-bg: var(--color-indigo-50, oklch(96.2% .018 272.846));--nath-autocomplete-selected-text: var(--color-indigo-900, oklch(25.7% .09 270.891))}.dark nath-autocomplete,.dark .nath-autocomplete-theme{--nath-autocomplete-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-autocomplete-border: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-autocomplete-overlay-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-autocomplete-overlay-border: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-autocomplete-text-main: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-text-muted: var(--color-zinc-400, oklch(70.5% .015 286.067));--nath-autocomplete-placeholder: var(--color-zinc-500, oklch(55.2% .016 285.938));--nath-autocomplete-tag-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-autocomplete-tag-text: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-button-hover-bg: var(--color-zinc-700, oklch(37% .013 285.805));--nath-autocomplete-hover-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-autocomplete-hover-text: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-autocomplete-selected-bg: var(--color-indigo-950, oklch(15.2% .06 273.111));--nath-autocomplete-selected-text: var(--color-indigo-100, oklch(92% .04 273.111))}.ac-input-container{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;position:relative;flex-grow:1;padding:var(--nath-autocomplete-input-padding);background-color:var(--nath-autocomplete-bg);border:1px solid var(--nath-autocomplete-border);border-radius:var(--nath-autocomplete-radius);box-shadow:var(--nath-autocomplete-shadow);transition:border-color .2s,box-shadow .2s}.ac-input-container:focus-within{outline:none;border-color:var(--nath-autocomplete-ring-color);box-shadow:0 0 0 2px var(--nath-autocomplete-ring-color)}.ac-has-clear-btn{padding-right:2.5rem!important}.ac-borderless-container{border:0!important;box-shadow:none!important}.ac-borderless-container:focus-within{outline:none!important}.ac-no-right-radius{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.ac-selected-tag{display:inline-flex;align-items:center;gap:.25rem;background-color:var(--nath-autocomplete-tag-bg);color:var(--nath-autocomplete-tag-text);font-weight:500;padding:.25rem .375rem .25rem .625rem;border-radius:.375rem}.ac-tag-disabled{opacity:.5;cursor:not-allowed}.ac-remove-tag-btn{width:1rem;height:1rem;padding:0!important;border:none;box-shadow:none!important;border-radius:9999px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--nath-autocomplete-text-muted);transition:background-color .15s,color .15s;cursor:pointer}.ac-remove-tag-btn:disabled{cursor:not-allowed}.ac-remove-tag-btn:not(:disabled):hover{background-color:var(--nath-autocomplete-button-hover-bg);color:var(--nath-autocomplete-text-main)}.ac-clear-button{position:absolute;right:.5rem;background:transparent;border:none;cursor:pointer;color:var(--nath-autocomplete-text-muted)}.ac-svg-icon{width:.75rem;height:.75rem;display:block}.ac-native-input{flex:1 1 0;min-width:120px;border:none;background:transparent;color:var(--nath-autocomplete-text-main);box-shadow:none;padding:.25rem}.ac-native-input::placeholder{color:var(--nath-autocomplete-placeholder)}.ac-native-input:focus{outline:none}.ac-borderless-input{padding-left:0!important;padding-right:0!important}.ac-dropdown-overlay{max-height:15rem;overflow-y:auto;background-color:var(--nath-autocomplete-overlay-bg);border:1px solid var(--nath-autocomplete-overlay-border);border-radius:.375rem;box-shadow:var(--nath-autocomplete-overlay-shadow);padding:.25rem 0;z-index:50;display:flex;flex-direction:column;box-sizing:border-box}.ac-dropdown-item{padding:.625rem 1rem;cursor:pointer;display:flex;align-items:center;transition:background-color .15s,color .15s;color:var(--nath-autocomplete-text-main)}.ac-dropdown-item:hover{background-color:var(--nath-autocomplete-hover-bg);color:var(--nath-autocomplete-hover-text)}.ac-dropdown-item.is-active{background-color:var(--nath-autocomplete-selected-bg)!important;color:var(--nath-autocomplete-selected-text)!important}.ac-dropdown-trigger-btn{border-top-left-radius:0!important;border-bottom-left-radius:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
214
214
|
}
|
|
215
215
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NathAutocomplete, decorators: [{
|
|
216
216
|
type: Component,
|
|
217
|
-
args: [{ selector: 'nath-autocomplete', imports: [CommonModule, OverlayModule, LucideX, LucideChevronDown], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\
|
|
217
|
+
args: [{ selector: 'nath-autocomplete', imports: [CommonModule, OverlayModule, LucideX, LucideChevronDown], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n (click)=\"inputField?.focus()\"\n (keydown.enter)=\"inputField?.focus()\"\n class=\"input nath-autocomplete-theme ac-input-container\"\n [ngClass]=\"{\n 'ac-has-clear-btn': showClearButton(),\n 'ac-borderless-container': borderless(),\n 'ac-no-right-radius': dropdown(),\n }\"\n cdkOverlayOrigin\n #origin=\"cdkOverlayOrigin\"\n>\n @if (multiple()) {\n @for (item of selectedItems(); track $index) {\n <div class=\"ac-selected-tag\">\n <span [ngClass]=\"{ 'ac-tag-disabled': isDisabled() }\">\n {{ displayFn()(item) }}\n </span>\n\n <button\n type=\"button\"\n (click)=\"removeItem(item, $event)\"\n class=\"ac-remove-tag-btn\"\n [disabled]=\"isDisabled()\"\n >\n <svg class=\"ac-svg-icon\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2.5\"\n d=\"M6 18L18 6M6 6l12 12\"\n />\n </svg>\n </button>\n </div>\n }\n }\n\n <input\n #inputField\n type=\"text\"\n [id]=\"inputId()\"\n [placeholder]=\"selectedItems().length === 0 || !multiple() ? placeholder() : ''\"\n [value]=\"inputValue()\"\n [disabled]=\"isDisabled()\"\n (input)=\"onInputChange($event)\"\n (keydown)=\"onKeyDown($event)\"\n class=\"ac-native-input\"\n [ngClass]=\"{ 'ac-borderless-input': borderless() }\"\n />\n\n @if (showClearButton()) {\n <button type=\"button\" class=\"ac-clear-button\" [disabled]=\"isDisabled()\" (click)=\"clear()\">\n <svg lucideX [size]=\"16\" />\n </button>\n }\n</div>\n\n<ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"origin\"\n [cdkConnectedOverlayOpen]=\"isOpen() && items().length > 0\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n [cdkConnectedOverlayPanelClass]=\"'nath-autocomplete-theme'\"\n (backdropClick)=\"isOpen.set(false)\"\n>\n <div\n class=\"ac-dropdown-overlay\"\n [style.width.px]=\"elementRef.nativeElement?.getBoundingClientRect()?.width\"\n >\n @for (item of items(); track $index) {\n <div\n (click)=\"selectItem(item)\"\n (keydown.enter)=\"selectItem(item)\"\n class=\"ac-dropdown-item\"\n [class.is-active]=\"activeTrackedIndex() === $index\"\n >\n @if (!itemTemplate()) {\n {{ displayFn()(item) }}\n } @else {\n <ng-container\n *ngTemplateOutlet=\"itemTemplate()!; context: { $implicit: item }\"\n ></ng-container>\n }\n </div>\n }\n @if (items().length === 0) {\n <div class=\"ac-dropdown-item\">\n {{ emptyMessage() }}\n </div>\n }\n </div>\n</ng-template>\n\n@if (dropdown()) {\n <button\n type=\"button\"\n class=\"button-secondary ac-dropdown-trigger-btn\"\n [disabled]=\"isDisabled()\"\n (click)=\"openDropdown()\"\n >\n <svg lucideChevronDown [size]=\"16\" />\n </button>\n}\n", styles: ["nath-autocomplete{display:flex;width:100%}nath-autocomplete,.nath-autocomplete-theme{--nath-autocomplete-bg: #ffffff;--nath-autocomplete-border: var(--color-zinc-300, oklch(87.1% .006 286.286));--nath-autocomplete-radius: .375rem;--nath-autocomplete-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-autocomplete-ring-color: var(--color-indigo-500, oklch(58.5% .233 277.117));--nath-autocomplete-input-padding: .25rem;--nath-autocomplete-placeholder: var(--color-gray-400, oklch(70.5% .015 286.067));--nath-autocomplete-tag-bg: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-autocomplete-tag-text: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-autocomplete-button-hover-bg: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-overlay-bg: #ffffff;--nath-autocomplete-overlay-border: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-overlay-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--nath-autocomplete-text-main: var(--color-gray-800, oklch(27.8% .033 256.848));--nath-autocomplete-text-muted: var(--color-gray-500, oklch(55.1% .027 264.364));--nath-autocomplete-hover-bg: var(--color-gray-100, oklch(96.7% .003 264.542));--nath-autocomplete-hover-text: var(--color-gray-900, oklch(21% .006 285.885));--nath-autocomplete-selected-bg: var(--color-indigo-50, oklch(96.2% .018 272.846));--nath-autocomplete-selected-text: var(--color-indigo-900, oklch(25.7% .09 270.891))}.dark nath-autocomplete,.dark .nath-autocomplete-theme{--nath-autocomplete-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-autocomplete-border: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-autocomplete-overlay-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-autocomplete-overlay-border: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-autocomplete-text-main: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-text-muted: var(--color-zinc-400, oklch(70.5% .015 286.067));--nath-autocomplete-placeholder: var(--color-zinc-500, oklch(55.2% .016 285.938));--nath-autocomplete-tag-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-autocomplete-tag-text: var(--color-zinc-200, oklch(92% .004 286.32));--nath-autocomplete-button-hover-bg: var(--color-zinc-700, oklch(37% .013 285.805));--nath-autocomplete-hover-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-autocomplete-hover-text: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-autocomplete-selected-bg: var(--color-indigo-950, oklch(15.2% .06 273.111));--nath-autocomplete-selected-text: var(--color-indigo-100, oklch(92% .04 273.111))}.ac-input-container{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;position:relative;flex-grow:1;padding:var(--nath-autocomplete-input-padding);background-color:var(--nath-autocomplete-bg);border:1px solid var(--nath-autocomplete-border);border-radius:var(--nath-autocomplete-radius);box-shadow:var(--nath-autocomplete-shadow);transition:border-color .2s,box-shadow .2s}.ac-input-container:focus-within{outline:none;border-color:var(--nath-autocomplete-ring-color);box-shadow:0 0 0 2px var(--nath-autocomplete-ring-color)}.ac-has-clear-btn{padding-right:2.5rem!important}.ac-borderless-container{border:0!important;box-shadow:none!important}.ac-borderless-container:focus-within{outline:none!important}.ac-no-right-radius{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.ac-selected-tag{display:inline-flex;align-items:center;gap:.25rem;background-color:var(--nath-autocomplete-tag-bg);color:var(--nath-autocomplete-tag-text);font-weight:500;padding:.25rem .375rem .25rem .625rem;border-radius:.375rem}.ac-tag-disabled{opacity:.5;cursor:not-allowed}.ac-remove-tag-btn{width:1rem;height:1rem;padding:0!important;border:none;box-shadow:none!important;border-radius:9999px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--nath-autocomplete-text-muted);transition:background-color .15s,color .15s;cursor:pointer}.ac-remove-tag-btn:disabled{cursor:not-allowed}.ac-remove-tag-btn:not(:disabled):hover{background-color:var(--nath-autocomplete-button-hover-bg);color:var(--nath-autocomplete-text-main)}.ac-clear-button{position:absolute;right:.5rem;background:transparent;border:none;cursor:pointer;color:var(--nath-autocomplete-text-muted)}.ac-svg-icon{width:.75rem;height:.75rem;display:block}.ac-native-input{flex:1 1 0;min-width:120px;border:none;background:transparent;color:var(--nath-autocomplete-text-main);box-shadow:none;padding:.25rem}.ac-native-input::placeholder{color:var(--nath-autocomplete-placeholder)}.ac-native-input:focus{outline:none}.ac-borderless-input{padding-left:0!important;padding-right:0!important}.ac-dropdown-overlay{max-height:15rem;overflow-y:auto;background-color:var(--nath-autocomplete-overlay-bg);border:1px solid var(--nath-autocomplete-overlay-border);border-radius:.375rem;box-shadow:var(--nath-autocomplete-overlay-shadow);padding:.25rem 0;z-index:50;display:flex;flex-direction:column;box-sizing:border-box}.ac-dropdown-item{padding:.625rem 1rem;cursor:pointer;display:flex;align-items:center;transition:background-color .15s,color .15s;color:var(--nath-autocomplete-text-main)}.ac-dropdown-item:hover{background-color:var(--nath-autocomplete-hover-bg);color:var(--nath-autocomplete-hover-text)}.ac-dropdown-item.is-active{background-color:var(--nath-autocomplete-selected-bg)!important;color:var(--nath-autocomplete-selected-text)!important}.ac-dropdown-trigger-btn{border-top-left-radius:0!important;border-bottom-left-radius:0!important}\n"] }]
|
|
218
218
|
}], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], displayWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayWith", required: false }] }], valueWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueWith", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], dropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdown", required: false }] }], showClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClear", required: false }] }], delay: [{ type: i0.Input, args: [{ isSignal: true, alias: "delay", required: false }] }], minQueryLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minQueryLength", required: false }] }], borderless: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderless", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], forceDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "forceDisabled", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], debouncedQueryChange: [{ type: i0.Output, args: ["debouncedQueryChange"] }], cleared: [{ type: i0.Output, args: ["cleared"] }], unselected: [{ type: i0.Output, args: ["unselected"] }], query: [{ type: i0.Input, args: [{ isSignal: true, alias: "query", required: false }] }, { type: i0.Output, args: ["queryChange"] }], itemTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }], inputField: [{ type: i0.ViewChild, args: ['inputField', { isSignal: true }] }] } });
|
|
219
219
|
|
|
220
220
|
class NathBooleanControl {
|
|
@@ -4841,7 +4841,7 @@ class NathSelect {
|
|
|
4841
4841
|
(click)="toggle()"
|
|
4842
4842
|
>
|
|
4843
4843
|
<svg lucideChevronDown [size]="16" />
|
|
4844
|
-
</button>`, isInline: true, styles: ["nath-select,.nath-select-theme{--nath-select-bg: #ffffff;--nath-select-border-color: var(--color-zinc-300, oklch(87.1% .006 286.286));--nath-select-border-width: 1px;--nath-select-radius: .375rem;--nath-select-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-select-ring-color: var(--color-indigo-500, oklch(58.5% .233 277.117));--nath-select-input-padding: .25rem;--nath-select-placeholder: var(--color-gray-400, oklch(70.5% .015 286.067));--nath-select-overlay-bg: #ffffff;--nath-select-overlay-border: var(--color-zinc-200, oklch(92% .004 286.32));--nath-select-overlay-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--nath-select-text-main: var(--color-gray-800, oklch(27.8% .033 256.848));--nath-select-text-muted: var(--color-gray-500, oklch(55.1% .027 264.364));--nath-select-hover-bg: var(--color-gray-100, oklch(96.7% .003 264.542));--nath-select-hover-text: var(--color-gray-900, oklch(21% .006 285.885));--nath-select-selected-bg: var(--color-indigo-50, oklch(96.2% .018 272.846));--nath-select-selected-text: var(--color-indigo-900, oklch(25.7% .09 270.891))}.dark nath-select,.dark .nath-select-theme{--nath-select-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-select-border-color: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-select-overlay-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-select-overlay-border: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-select-text-main: var(--color-zinc-200, oklch(92% .004 286.32));--nath-select-text-muted: var(--color-zinc-400, oklch(70.5% .015 286.067));--nath-select-placeholder: var(--color-zinc-500, oklch(55.2% .016 285.938));--nath-select-hover-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-select-hover-text: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-select-selected-bg: var(--color-indigo-950, oklch(15.2% .06 273.111));--nath-select-selected-text: var(--color-indigo-100, oklch(92% .04 273.111))}nath-select{display:flex;width:100%}.select-combobox{display:flex;position:relative;flex-grow:1;min-width:3.5rem;padding:var(--nath-select-input-padding)!important;cursor:pointer;background-color:var(--nath-select-bg);border-width:var(--nath-select-border-width);border-style:solid;border-color:var(--nath-select-border-color);border-radius:var(--nath-select-radius);box-shadow:var(--nath-select-shadow);transition:border-color .2s,box-shadow .2s;border-top-right-radius:0;border-bottom-right-radius:0}.select-combobox:focus-within{outline:none;border-color:var(--nath-select-ring-color);box-shadow:0 0 0 2px var(--nath-select-ring-color)}.select-combobox__display-wrapper{min-width:0;flex-grow:1;padding-left:.5rem;padding-right:.5rem}.select-combobox__text{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--nath-select-text-main)}.select-combobox__placeholder{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--nath-select-placeholder);min-height:1.5rem}.select-combobox--has-clear-btn{padding-right:2.5rem!important}.select-combobox--borderless{border:0!important;box-shadow:none!important}.nath-select-input{flex:1;background:transparent;border:none;outline:none;padding:var(--nath-select-input-padding);color:var(--nath-select-text-main);font-size:.875rem;width:100%}.select-clear-btn{position:absolute;right:.5rem;background:transparent;border:none;cursor:pointer;color:var(--nath-select-text-muted)}.select-dropdown-overlay{display:flex;flex-direction:column;min-width:10rem;padding:.25rem 0;z-index:50;background-color:var(--nath-select-overlay-bg);border:1px solid var(--nath-select-overlay-border);border-radius:.375rem;box-shadow:var(--nath-select-overlay-shadow);box-sizing:border-box}.select-listbox{display:flex;flex-direction:column}.select-listbox--scrollable{max-height:15rem;overflow-y:auto}.select-listbox__viewport{max-height:15rem;height:240px;overflow-y:auto;min-width:0;display:flex;flex-direction:column}.select-item{display:flex;align-items:center;padding:.625rem 1rem;cursor:pointer;transition:background-color .15s,color .15s;color:var(--nath-select-text-main);background:transparent;border:none;width:100%;text-align:left}.select-item:focus{outline:none;background-color:var(--nath-select-hover-bg)}.select-item--virtual{padding-left:1rem;padding-right:1rem}.select-item:hover{background-color:var(--nath-select-hover-bg);color:var(--nath-select-hover-text)}.select-item--active{background-color:var(--nath-select-selected-bg)!important;color:var(--nath-select-selected-text)!important}.select-item--status{color:var(--nath-select-text-muted);font-style:italic}.select-trigger-btn-addon{border-top-left-radius:0!important;border-bottom-left-radius:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i2.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }], encapsulation: i0.ViewEncapsulation.None });
|
|
4844
|
+
</button>`, isInline: true, styles: ["nath-select,.nath-select-theme{--nath-select-bg: #ffffff;--nath-select-border-color: var(--color-zinc-300, oklch(87.1% .006 286.286));--nath-select-border-width: 1px;--nath-select-radius: .375rem;--nath-select-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-select-ring-color: var(--color-indigo-500, oklch(58.5% .233 277.117));--nath-select-input-padding: .5rem .25rem;--nath-select-placeholder: var(--color-gray-400, oklch(70.5% .015 286.067));--nath-select-overlay-bg: #ffffff;--nath-select-overlay-border: var(--color-zinc-200, oklch(92% .004 286.32));--nath-select-overlay-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--nath-select-text-main: var(--color-gray-800, oklch(27.8% .033 256.848));--nath-select-text-muted: var(--color-gray-500, oklch(55.1% .027 264.364));--nath-select-hover-bg: var(--color-gray-100, oklch(96.7% .003 264.542));--nath-select-hover-text: var(--color-gray-900, oklch(21% .006 285.885));--nath-select-selected-bg: var(--color-indigo-50, oklch(96.2% .018 272.846));--nath-select-selected-text: var(--color-indigo-900, oklch(25.7% .09 270.891))}.dark nath-select,.dark .nath-select-theme{--nath-select-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-select-border-color: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-select-overlay-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-select-overlay-border: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-select-text-main: var(--color-zinc-200, oklch(92% .004 286.32));--nath-select-text-muted: var(--color-zinc-400, oklch(70.5% .015 286.067));--nath-select-placeholder: var(--color-zinc-500, oklch(55.2% .016 285.938));--nath-select-hover-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-select-hover-text: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-select-selected-bg: var(--color-indigo-950, oklch(15.2% .06 273.111));--nath-select-selected-text: var(--color-indigo-100, oklch(92% .04 273.111))}nath-select{display:flex;width:100%}.select-combobox{display:flex;position:relative;flex-grow:1;min-width:3.5rem;padding:var(--nath-select-input-padding)!important;cursor:pointer;background-color:var(--nath-select-bg);border-width:var(--nath-select-border-width);border-style:solid;border-color:var(--nath-select-border-color);border-radius:var(--nath-select-radius);box-shadow:var(--nath-select-shadow);transition:border-color .2s,box-shadow .2s;border-top-right-radius:0;border-bottom-right-radius:0}.select-combobox:focus-within{outline:none;border-color:var(--nath-select-ring-color);box-shadow:0 0 0 2px var(--nath-select-ring-color)}.select-combobox__display-wrapper{min-width:0;flex-grow:1;padding-left:.5rem;padding-right:.5rem}.select-combobox__text{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--nath-select-text-main)}.select-combobox__placeholder{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--nath-select-placeholder);min-height:1.5rem}.select-combobox--has-clear-btn{padding-right:2.5rem!important}.select-combobox--borderless{border:0!important;box-shadow:none!important}.nath-select-input{flex:1;background:transparent;border:none;outline:none;padding:var(--nath-select-input-padding);color:var(--nath-select-text-main);font-size:.875rem;width:100%}.select-clear-btn{position:absolute;right:.5rem;background:transparent;border:none;cursor:pointer;color:var(--nath-select-text-muted)}.select-dropdown-overlay{display:flex;flex-direction:column;min-width:10rem;padding:.25rem 0;z-index:50;background-color:var(--nath-select-overlay-bg);border:1px solid var(--nath-select-overlay-border);border-radius:.375rem;box-shadow:var(--nath-select-overlay-shadow);box-sizing:border-box}.select-listbox{display:flex;flex-direction:column}.select-listbox--scrollable{max-height:15rem;overflow-y:auto}.select-listbox__viewport{max-height:15rem;height:240px;overflow-y:auto;min-width:0;display:flex;flex-direction:column}.select-item{display:flex;align-items:center;padding:.625rem 1rem;cursor:pointer;transition:background-color .15s,color .15s;color:var(--nath-select-text-main);background:transparent;border:none;width:100%;text-align:left}.select-item:focus{outline:none;background-color:var(--nath-select-hover-bg)}.select-item--virtual{padding-left:1rem;padding-right:1rem}.select-item:hover{background-color:var(--nath-select-hover-bg);color:var(--nath-select-hover-text)}.select-item--active{background-color:var(--nath-select-selected-bg)!important;color:var(--nath-select-selected-text)!important}.select-item--status{color:var(--nath-select-text-muted);font-style:italic}.select-trigger-btn-addon{border-top-left-radius:0!important;border-bottom-left-radius:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i2.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }], encapsulation: i0.ViewEncapsulation.None });
|
|
4845
4845
|
}
|
|
4846
4846
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NathSelect, decorators: [{
|
|
4847
4847
|
type: Component,
|
|
@@ -4993,7 +4993,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
4993
4993
|
(click)="toggle()"
|
|
4994
4994
|
>
|
|
4995
4995
|
<svg lucideChevronDown [size]="16" />
|
|
4996
|
-
</button>`, encapsulation: ViewEncapsulation.None, styles: ["nath-select,.nath-select-theme{--nath-select-bg: #ffffff;--nath-select-border-color: var(--color-zinc-300, oklch(87.1% .006 286.286));--nath-select-border-width: 1px;--nath-select-radius: .375rem;--nath-select-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-select-ring-color: var(--color-indigo-500, oklch(58.5% .233 277.117));--nath-select-input-padding: .25rem;--nath-select-placeholder: var(--color-gray-400, oklch(70.5% .015 286.067));--nath-select-overlay-bg: #ffffff;--nath-select-overlay-border: var(--color-zinc-200, oklch(92% .004 286.32));--nath-select-overlay-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--nath-select-text-main: var(--color-gray-800, oklch(27.8% .033 256.848));--nath-select-text-muted: var(--color-gray-500, oklch(55.1% .027 264.364));--nath-select-hover-bg: var(--color-gray-100, oklch(96.7% .003 264.542));--nath-select-hover-text: var(--color-gray-900, oklch(21% .006 285.885));--nath-select-selected-bg: var(--color-indigo-50, oklch(96.2% .018 272.846));--nath-select-selected-text: var(--color-indigo-900, oklch(25.7% .09 270.891))}.dark nath-select,.dark .nath-select-theme{--nath-select-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-select-border-color: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-select-overlay-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-select-overlay-border: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-select-text-main: var(--color-zinc-200, oklch(92% .004 286.32));--nath-select-text-muted: var(--color-zinc-400, oklch(70.5% .015 286.067));--nath-select-placeholder: var(--color-zinc-500, oklch(55.2% .016 285.938));--nath-select-hover-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-select-hover-text: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-select-selected-bg: var(--color-indigo-950, oklch(15.2% .06 273.111));--nath-select-selected-text: var(--color-indigo-100, oklch(92% .04 273.111))}nath-select{display:flex;width:100%}.select-combobox{display:flex;position:relative;flex-grow:1;min-width:3.5rem;padding:var(--nath-select-input-padding)!important;cursor:pointer;background-color:var(--nath-select-bg);border-width:var(--nath-select-border-width);border-style:solid;border-color:var(--nath-select-border-color);border-radius:var(--nath-select-radius);box-shadow:var(--nath-select-shadow);transition:border-color .2s,box-shadow .2s;border-top-right-radius:0;border-bottom-right-radius:0}.select-combobox:focus-within{outline:none;border-color:var(--nath-select-ring-color);box-shadow:0 0 0 2px var(--nath-select-ring-color)}.select-combobox__display-wrapper{min-width:0;flex-grow:1;padding-left:.5rem;padding-right:.5rem}.select-combobox__text{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--nath-select-text-main)}.select-combobox__placeholder{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--nath-select-placeholder);min-height:1.5rem}.select-combobox--has-clear-btn{padding-right:2.5rem!important}.select-combobox--borderless{border:0!important;box-shadow:none!important}.nath-select-input{flex:1;background:transparent;border:none;outline:none;padding:var(--nath-select-input-padding);color:var(--nath-select-text-main);font-size:.875rem;width:100%}.select-clear-btn{position:absolute;right:.5rem;background:transparent;border:none;cursor:pointer;color:var(--nath-select-text-muted)}.select-dropdown-overlay{display:flex;flex-direction:column;min-width:10rem;padding:.25rem 0;z-index:50;background-color:var(--nath-select-overlay-bg);border:1px solid var(--nath-select-overlay-border);border-radius:.375rem;box-shadow:var(--nath-select-overlay-shadow);box-sizing:border-box}.select-listbox{display:flex;flex-direction:column}.select-listbox--scrollable{max-height:15rem;overflow-y:auto}.select-listbox__viewport{max-height:15rem;height:240px;overflow-y:auto;min-width:0;display:flex;flex-direction:column}.select-item{display:flex;align-items:center;padding:.625rem 1rem;cursor:pointer;transition:background-color .15s,color .15s;color:var(--nath-select-text-main);background:transparent;border:none;width:100%;text-align:left}.select-item:focus{outline:none;background-color:var(--nath-select-hover-bg)}.select-item--virtual{padding-left:1rem;padding-right:1rem}.select-item:hover{background-color:var(--nath-select-hover-bg);color:var(--nath-select-hover-text)}.select-item--active{background-color:var(--nath-select-selected-bg)!important;color:var(--nath-select-selected-text)!important}.select-item--status{color:var(--nath-select-text-muted);font-style:italic}.select-trigger-btn-addon{border-top-left-radius:0!important;border-bottom-left-radius:0!important}\n"] }]
|
|
4996
|
+
</button>`, encapsulation: ViewEncapsulation.None, styles: ["nath-select,.nath-select-theme{--nath-select-bg: #ffffff;--nath-select-border-color: var(--color-zinc-300, oklch(87.1% .006 286.286));--nath-select-border-width: 1px;--nath-select-radius: .375rem;--nath-select-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-select-ring-color: var(--color-indigo-500, oklch(58.5% .233 277.117));--nath-select-input-padding: .5rem .25rem;--nath-select-placeholder: var(--color-gray-400, oklch(70.5% .015 286.067));--nath-select-overlay-bg: #ffffff;--nath-select-overlay-border: var(--color-zinc-200, oklch(92% .004 286.32));--nath-select-overlay-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--nath-select-text-main: var(--color-gray-800, oklch(27.8% .033 256.848));--nath-select-text-muted: var(--color-gray-500, oklch(55.1% .027 264.364));--nath-select-hover-bg: var(--color-gray-100, oklch(96.7% .003 264.542));--nath-select-hover-text: var(--color-gray-900, oklch(21% .006 285.885));--nath-select-selected-bg: var(--color-indigo-50, oklch(96.2% .018 272.846));--nath-select-selected-text: var(--color-indigo-900, oklch(25.7% .09 270.891))}.dark nath-select,.dark .nath-select-theme{--nath-select-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-select-border-color: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-select-overlay-bg: var(--color-zinc-950, oklch(14.1% .005 285.823));--nath-select-overlay-border: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-select-text-main: var(--color-zinc-200, oklch(92% .004 286.32));--nath-select-text-muted: var(--color-zinc-400, oklch(70.5% .015 286.067));--nath-select-placeholder: var(--color-zinc-500, oklch(55.2% .016 285.938));--nath-select-hover-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-select-hover-text: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-select-selected-bg: var(--color-indigo-950, oklch(15.2% .06 273.111));--nath-select-selected-text: var(--color-indigo-100, oklch(92% .04 273.111))}nath-select{display:flex;width:100%}.select-combobox{display:flex;position:relative;flex-grow:1;min-width:3.5rem;padding:var(--nath-select-input-padding)!important;cursor:pointer;background-color:var(--nath-select-bg);border-width:var(--nath-select-border-width);border-style:solid;border-color:var(--nath-select-border-color);border-radius:var(--nath-select-radius);box-shadow:var(--nath-select-shadow);transition:border-color .2s,box-shadow .2s;border-top-right-radius:0;border-bottom-right-radius:0}.select-combobox:focus-within{outline:none;border-color:var(--nath-select-ring-color);box-shadow:0 0 0 2px var(--nath-select-ring-color)}.select-combobox__display-wrapper{min-width:0;flex-grow:1;padding-left:.5rem;padding-right:.5rem}.select-combobox__text{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--nath-select-text-main)}.select-combobox__placeholder{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--nath-select-placeholder);min-height:1.5rem}.select-combobox--has-clear-btn{padding-right:2.5rem!important}.select-combobox--borderless{border:0!important;box-shadow:none!important}.nath-select-input{flex:1;background:transparent;border:none;outline:none;padding:var(--nath-select-input-padding);color:var(--nath-select-text-main);font-size:.875rem;width:100%}.select-clear-btn{position:absolute;right:.5rem;background:transparent;border:none;cursor:pointer;color:var(--nath-select-text-muted)}.select-dropdown-overlay{display:flex;flex-direction:column;min-width:10rem;padding:.25rem 0;z-index:50;background-color:var(--nath-select-overlay-bg);border:1px solid var(--nath-select-overlay-border);border-radius:.375rem;box-shadow:var(--nath-select-overlay-shadow);box-sizing:border-box}.select-listbox{display:flex;flex-direction:column}.select-listbox--scrollable{max-height:15rem;overflow-y:auto}.select-listbox__viewport{max-height:15rem;height:240px;overflow-y:auto;min-width:0;display:flex;flex-direction:column}.select-item{display:flex;align-items:center;padding:.625rem 1rem;cursor:pointer;transition:background-color .15s,color .15s;color:var(--nath-select-text-main);background:transparent;border:none;width:100%;text-align:left}.select-item:focus{outline:none;background-color:var(--nath-select-hover-bg)}.select-item--virtual{padding-left:1rem;padding-right:1rem}.select-item:hover{background-color:var(--nath-select-hover-bg);color:var(--nath-select-hover-text)}.select-item--active{background-color:var(--nath-select-selected-bg)!important;color:var(--nath-select-selected-text)!important}.select-item--status{color:var(--nath-select-text-muted);font-style:italic}.select-trigger-btn-addon{border-top-left-radius:0!important;border-bottom-left-radius:0!important}\n"] }]
|
|
4997
4997
|
}], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], displayWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayWith", required: false }] }], valueWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueWith", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], showClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClear", required: false }] }], delay: [{ type: i0.Input, args: [{ isSignal: true, alias: "delay", required: false }] }], minQueryLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minQueryLength", required: false }] }], borderless: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderless", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }], virtualScrollItemSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScrollItemSize", required: false }] }], comboboxClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "comboboxClass", required: false }] }], ariaLabelledBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledBy", required: false }] }], debouncedQueryChange: [{ type: i0.Output, args: ["debouncedQueryChange"] }], cleared: [{ type: i0.Output, args: ["cleared"] }], unselected: [{ type: i0.Output, args: ["unselected"] }], selected: [{ type: i0.Output, args: ["selected"] }], itemTemplate: [{ type: i0.ContentChild, args: ['item', { isSignal: true }] }], selectedItemTemplate: [{ type: i0.ContentChild, args: ['selectedItem', { isSignal: true }] }], inputField: [{ type: i0.ViewChild, args: ['inputField', { isSignal: true }] }], container: [{ type: i0.ViewChild, args: ['container', { isSignal: true }] }], viewport: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkVirtualScrollViewport), { isSignal: true }] }] } });
|
|
4998
4998
|
|
|
4999
4999
|
class NathSkeleton {
|
|
@@ -5502,7 +5502,7 @@ class NathTag {
|
|
|
5502
5502
|
this.closed.emit();
|
|
5503
5503
|
}
|
|
5504
5504
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NathTag, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5505
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NathTag, isStandalone: true, selector: "nath-tag", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, host: { properties: { "class.nath-tag--neutral": "variant() === \"neutral\"", "class.nath-tag--primary": "variant() === \"primary\"", "class.nath-tag--secondary": "variant() === \"secondary\"", "class.nath-tag--success": "variant() === \"success\"", "class.nath-tag--danger": "variant() === \"danger\"", "class.nath-tag--warning": "variant() === \"warning\"", "class.nath-tag--info": "variant() === \"info\"", "class.nath-tag--help": "variant() === \"help\"", "class.nath-tag--small": "size() === \"small\"", "class.nath-tag--medium": "size() === \"medium\"", "class.nath-tag--large": "size() === \"large\"", "class.nath-tag--closable": "closable()" } }, ngImport: i0, template: "@if (value()) {\n {{ value() }}\n}\n<ng-content></ng-content>\n@if (closable()) {\n <button class=\"nath-tag-close\" (click)=\"onClose($event)\" aria-label=\"Close tag\">\n <svg lucideX class=\"nath-tag-close-icon\" />\n </button>\n}\n", styles: ["nath-tag,.nath-tag-theme{--nath-tag-radius: .375rem;--nath-tag-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-tag-neutral-bg: var(--color-neutral-
|
|
5505
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NathTag, isStandalone: true, selector: "nath-tag", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, host: { properties: { "class.nath-tag--neutral": "variant() === \"neutral\"", "class.nath-tag--primary": "variant() === \"primary\"", "class.nath-tag--secondary": "variant() === \"secondary\"", "class.nath-tag--success": "variant() === \"success\"", "class.nath-tag--danger": "variant() === \"danger\"", "class.nath-tag--warning": "variant() === \"warning\"", "class.nath-tag--info": "variant() === \"info\"", "class.nath-tag--help": "variant() === \"help\"", "class.nath-tag--small": "size() === \"small\"", "class.nath-tag--medium": "size() === \"medium\"", "class.nath-tag--large": "size() === \"large\"", "class.nath-tag--closable": "closable()" } }, ngImport: i0, template: "@if (value()) {\n {{ value() }}\n}\n<ng-content></ng-content>\n@if (closable()) {\n <button class=\"nath-tag-close\" (click)=\"onClose($event)\" aria-label=\"Close tag\">\n <svg lucideX class=\"nath-tag-close-icon\" />\n </button>\n}\n", styles: ["nath-tag,.nath-tag-theme{--nath-tag-radius: .375rem;--nath-tag-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-tag-neutral-bg: var(--color-neutral-500, oklch(.556 0 0));--nath-tag-neutral-text: #ffffff;--nath-tag-neutral-hover-bg: var(--color-neutral-600, oklch(.439 0 0));--nath-tag-primary-bg: var(--color-primary-500, #8e9ba5);--nath-tag-primary-text: #ffffff;--nath-tag-primary-hover-bg: var(--color-primary-600, #79848c);--nath-tag-secondary-bg: var(--color-slate-300, #cbd5e1);--nath-tag-secondary-text: var(--color-slate-800, #1e293b);--nath-tag-secondary-hover-bg: var(--color-slate-300, #cbd5e1);--nath-tag-success-bg: var(--color-success-500, oklch(72.3% .219 149.579));--nath-tag-success-text: #ffffff;--nath-tag-success-hover-bg: var(--color-success-600, oklch(62.7% .194 149.214));--nath-tag-danger-bg: var(--color-danger-500, oklch(63.7% .237 25.331));--nath-tag-danger-text: #ffffff;--nath-tag-danger-hover-bg: var(--color-danger-600, oklch(57.7% .245 27.325));--nath-tag-warning-bg: var(--color-warning-500, oklch(70.5% .213 47.604));--nath-tag-warning-text: #ffffff;--nath-tag-warning-hover-bg: var(--color-warning-600, oklch(64.6% .222 41.116));--nath-tag-info-bg: var(--color-info-500, oklch(71.5% .143 215.221));--nath-tag-info-text: #ffffff;--nath-tag-info-hover-bg: var(--color-info-600, oklch(60.9% .126 221.723));--nath-tag-help-bg: var(--color-help-500, oklch(60.6% .25 292.717));--nath-tag-help-text: #ffffff;--nath-tag-help-hover-bg: var(--color-help-600, oklch(54.1% .281 293.009));--nath-tag-close-color: rgba(255, 255, 255, .8);--nath-tag-close-hover-bg: rgba(255, 255, 255, .2)}.dark nath-tag,.dark .nath-tag-theme{--nath-tag-neutral-bg: var(--color-neutral-500, oklch(.556 0 0));--nath-tag-neutral-text: #ffffff;--nath-tag-neutral-hover-bg: var(--color-neutral-600, oklch(.439 0 0));--nath-tag-primary-bg: var(--color-primary-400, #a3aeb6);--nath-tag-primary-text: var(--color-zinc-900, #242729);--nath-tag-primary-hover-bg: var(--color-primary-300, #b9c1c7);--nath-tag-secondary-bg: var(--color-slate-800, #1e293b);--nath-tag-secondary-text: var(--color-slate-200, #e2e8f0);--nath-tag-secondary-hover-bg: var(--color-slate-700, #334155);--nath-tag-close-color: rgba(0, 0, 0, .6);--nath-tag-close-hover-bg: rgba(0, 0, 0, .1)}nath-tag{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .75rem;border-radius:var(--nath-tag-radius);box-shadow:var(--nath-tag-shadow);font-weight:500;font-size:.875rem;line-height:1.25rem;transition:background-color .15s}nath-tag.nath-tag--small{padding:.25rem .5rem;font-size:.75rem;line-height:1rem}nath-tag.nath-tag--medium{padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem}nath-tag.nath-tag--large{padding:.5rem 1rem;font-size:1rem;line-height:1.5rem}nath-tag.nath-tag--neutral{background-color:var(--nath-tag-neutral-bg);color:var(--nath-tag-neutral-text)}nath-tag.nath-tag--primary{background-color:var(--nath-tag-primary-bg);color:var(--nath-tag-primary-text)}nath-tag.nath-tag--closable.nath-tag--primary:hover{background-color:var(--nath-tag-primary-hover-bg)}nath-tag.nath-tag--secondary{background-color:var(--nath-tag-secondary-bg);color:var(--nath-tag-secondary-text)}nath-tag.nath-tag--closable.nath-tag--secondary:hover{background-color:var(--nath-tag-secondary-hover-bg)}nath-tag.nath-tag--success{background-color:var(--nath-tag-success-bg);color:var(--nath-tag-success-text)}nath-tag.nath-tag--closable.nath-tag--success:hover{background-color:var(--nath-tag-success-hover-bg)}nath-tag.nath-tag--danger{background-color:var(--nath-tag-danger-bg);color:var(--nath-tag-danger-text)}nath-tag.nath-tag--closable.nath-tag--danger:hover{background-color:var(--nath-tag-danger-hover-bg)}nath-tag.nath-tag--warning{background-color:var(--nath-tag-warning-bg);color:var(--nath-tag-warning-text)}nath-tag.nath-tag--closable.nath-tag--warning:hover{background-color:var(--nath-tag-warning-hover-bg)}nath-tag.nath-tag--info{background-color:var(--nath-tag-info-bg);color:var(--nath-tag-info-text)}nath-tag.nath-tag--closable.nath-tag--info:hover{background-color:var(--nath-tag-info-hover-bg)}nath-tag.nath-tag--help{background-color:var(--nath-tag-help-bg);color:var(--nath-tag-help-text)}nath-tag.nath-tag--closable.nath-tag--help:hover{background-color:var(--nath-tag-help-hover-bg)}.nath-tag-close{display:inline-flex;align-items:center;justify-content:center;width:1rem;height:1rem;padding:0;border:none;border-radius:9999px;background:transparent;color:var(--nath-tag-close-color);cursor:pointer;transition:background-color .15s,color .15s}.nath-tag-close:hover{background-color:var(--nath-tag-close-hover-bg)}.nath-tag-close:focus{outline:2px solid currentColor;outline-offset:2px}.nath-tag-close-icon{width:.75rem;height:.75rem;display:block;color:var(--nath-tag-neutral-text)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }], encapsulation: i0.ViewEncapsulation.None });
|
|
5506
5506
|
}
|
|
5507
5507
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NathTag, decorators: [{
|
|
5508
5508
|
type: Component,
|
|
@@ -5519,7 +5519,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
5519
5519
|
'[class.nath-tag--medium]': 'size() === "medium"',
|
|
5520
5520
|
'[class.nath-tag--large]': 'size() === "large"',
|
|
5521
5521
|
'[class.nath-tag--closable]': 'closable()',
|
|
5522
|
-
}, template: "@if (value()) {\n {{ value() }}\n}\n<ng-content></ng-content>\n@if (closable()) {\n <button class=\"nath-tag-close\" (click)=\"onClose($event)\" aria-label=\"Close tag\">\n <svg lucideX class=\"nath-tag-close-icon\" />\n </button>\n}\n", styles: ["nath-tag,.nath-tag-theme{--nath-tag-radius: .375rem;--nath-tag-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-tag-neutral-bg: var(--color-neutral-
|
|
5522
|
+
}, template: "@if (value()) {\n {{ value() }}\n}\n<ng-content></ng-content>\n@if (closable()) {\n <button class=\"nath-tag-close\" (click)=\"onClose($event)\" aria-label=\"Close tag\">\n <svg lucideX class=\"nath-tag-close-icon\" />\n </button>\n}\n", styles: ["nath-tag,.nath-tag-theme{--nath-tag-radius: .375rem;--nath-tag-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);--nath-tag-neutral-bg: var(--color-neutral-500, oklch(.556 0 0));--nath-tag-neutral-text: #ffffff;--nath-tag-neutral-hover-bg: var(--color-neutral-600, oklch(.439 0 0));--nath-tag-primary-bg: var(--color-primary-500, #8e9ba5);--nath-tag-primary-text: #ffffff;--nath-tag-primary-hover-bg: var(--color-primary-600, #79848c);--nath-tag-secondary-bg: var(--color-slate-300, #cbd5e1);--nath-tag-secondary-text: var(--color-slate-800, #1e293b);--nath-tag-secondary-hover-bg: var(--color-slate-300, #cbd5e1);--nath-tag-success-bg: var(--color-success-500, oklch(72.3% .219 149.579));--nath-tag-success-text: #ffffff;--nath-tag-success-hover-bg: var(--color-success-600, oklch(62.7% .194 149.214));--nath-tag-danger-bg: var(--color-danger-500, oklch(63.7% .237 25.331));--nath-tag-danger-text: #ffffff;--nath-tag-danger-hover-bg: var(--color-danger-600, oklch(57.7% .245 27.325));--nath-tag-warning-bg: var(--color-warning-500, oklch(70.5% .213 47.604));--nath-tag-warning-text: #ffffff;--nath-tag-warning-hover-bg: var(--color-warning-600, oklch(64.6% .222 41.116));--nath-tag-info-bg: var(--color-info-500, oklch(71.5% .143 215.221));--nath-tag-info-text: #ffffff;--nath-tag-info-hover-bg: var(--color-info-600, oklch(60.9% .126 221.723));--nath-tag-help-bg: var(--color-help-500, oklch(60.6% .25 292.717));--nath-tag-help-text: #ffffff;--nath-tag-help-hover-bg: var(--color-help-600, oklch(54.1% .281 293.009));--nath-tag-close-color: rgba(255, 255, 255, .8);--nath-tag-close-hover-bg: rgba(255, 255, 255, .2)}.dark nath-tag,.dark .nath-tag-theme{--nath-tag-neutral-bg: var(--color-neutral-500, oklch(.556 0 0));--nath-tag-neutral-text: #ffffff;--nath-tag-neutral-hover-bg: var(--color-neutral-600, oklch(.439 0 0));--nath-tag-primary-bg: var(--color-primary-400, #a3aeb6);--nath-tag-primary-text: var(--color-zinc-900, #242729);--nath-tag-primary-hover-bg: var(--color-primary-300, #b9c1c7);--nath-tag-secondary-bg: var(--color-slate-800, #1e293b);--nath-tag-secondary-text: var(--color-slate-200, #e2e8f0);--nath-tag-secondary-hover-bg: var(--color-slate-700, #334155);--nath-tag-close-color: rgba(0, 0, 0, .6);--nath-tag-close-hover-bg: rgba(0, 0, 0, .1)}nath-tag{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .75rem;border-radius:var(--nath-tag-radius);box-shadow:var(--nath-tag-shadow);font-weight:500;font-size:.875rem;line-height:1.25rem;transition:background-color .15s}nath-tag.nath-tag--small{padding:.25rem .5rem;font-size:.75rem;line-height:1rem}nath-tag.nath-tag--medium{padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem}nath-tag.nath-tag--large{padding:.5rem 1rem;font-size:1rem;line-height:1.5rem}nath-tag.nath-tag--neutral{background-color:var(--nath-tag-neutral-bg);color:var(--nath-tag-neutral-text)}nath-tag.nath-tag--primary{background-color:var(--nath-tag-primary-bg);color:var(--nath-tag-primary-text)}nath-tag.nath-tag--closable.nath-tag--primary:hover{background-color:var(--nath-tag-primary-hover-bg)}nath-tag.nath-tag--secondary{background-color:var(--nath-tag-secondary-bg);color:var(--nath-tag-secondary-text)}nath-tag.nath-tag--closable.nath-tag--secondary:hover{background-color:var(--nath-tag-secondary-hover-bg)}nath-tag.nath-tag--success{background-color:var(--nath-tag-success-bg);color:var(--nath-tag-success-text)}nath-tag.nath-tag--closable.nath-tag--success:hover{background-color:var(--nath-tag-success-hover-bg)}nath-tag.nath-tag--danger{background-color:var(--nath-tag-danger-bg);color:var(--nath-tag-danger-text)}nath-tag.nath-tag--closable.nath-tag--danger:hover{background-color:var(--nath-tag-danger-hover-bg)}nath-tag.nath-tag--warning{background-color:var(--nath-tag-warning-bg);color:var(--nath-tag-warning-text)}nath-tag.nath-tag--closable.nath-tag--warning:hover{background-color:var(--nath-tag-warning-hover-bg)}nath-tag.nath-tag--info{background-color:var(--nath-tag-info-bg);color:var(--nath-tag-info-text)}nath-tag.nath-tag--closable.nath-tag--info:hover{background-color:var(--nath-tag-info-hover-bg)}nath-tag.nath-tag--help{background-color:var(--nath-tag-help-bg);color:var(--nath-tag-help-text)}nath-tag.nath-tag--closable.nath-tag--help:hover{background-color:var(--nath-tag-help-hover-bg)}.nath-tag-close{display:inline-flex;align-items:center;justify-content:center;width:1rem;height:1rem;padding:0;border:none;border-radius:9999px;background:transparent;color:var(--nath-tag-close-color);cursor:pointer;transition:background-color .15s,color .15s}.nath-tag-close:hover{background-color:var(--nath-tag-close-hover-bg)}.nath-tag-close:focus{outline:2px solid currentColor;outline-offset:2px}.nath-tag-close-icon{width:.75rem;height:.75rem;display:block;color:var(--nath-tag-neutral-text)}\n"] }]
|
|
5523
5523
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], closable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closable", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
|
|
5524
5524
|
|
|
5525
5525
|
const DARK_THEME_CLASS = 'dark';
|