yukit-web 0.2.0 → 0.2.1
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/.npm/_cacache/content-v2/sha512/{22/89/9d6cbfb738a4d90601bca2c32d44181ca961e95a19b45f5309af387937373b1d52023694a4885cb287821e5aff1140e73250a03d88504e01b71900a716ff → b9/e9/4533d1d7bc3e9898277dd6b321eae6eea20a129bd18ca6355f211af20112852d5bbb1313981c8dc1ce532a698ba311ced4c8d2bee5381f5ad746a6168c0d} +1 -1
- package/.npm/_cacache/index-v5/64/dc/73c7a26f2e6eb0c711133d96c247da5ecf0eba708cd37c450a7b3c7cb488 +1 -1
- package/.npm/_logs/{2026-10-02T08_38_53_560Z-debug-0.log → 2026-10-02T09_15_53_709Z-debug-0.log} +10 -10
- package/.npm/_logs/{2026-10-02T08_38_54_110Z-debug-0.log → 2026-10-02T09_15_54_206Z-debug-0.log} +2 -2
- package/fesm2022/yukit-web.mjs +11 -5
- package/fesm2022/yukit-web.mjs.map +1 -1
- package/package.json +1 -1
package/.npm/_cacache/index-v5/64/dc/73c7a26f2e6eb0c711133d96c247da5ecf0eba708cd37c450a7b3c7cb488
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
|
|
2
|
-
|
|
2
|
+
73156870f087abb5a501996bd729e4209ae8993a {"key":"make-fetch-happen:request-cache:https://registry.npmjs.org/yukit-web","integrity":"sha512-uelFM9HXvD6YmCd91rMh6ubuogoSm9GMpjVfIRryARKFLVu7ExOYHI3BzlMqaYujEc7UyNK+5TgfWtdGphaMDQ==","time":1790932554123,"size":404684,"metadata":{"time":1790932554108,"url":"https://registry.npmjs.org/yukit-web","reqHeaders":{"accept":"application/json"},"resHeaders":{"cache-control":"public, max-age=300","content-encoding":"gzip","content-type":"application/json","date":"Fri, 02 Oct 2026 09:15:54 GMT","etag":"W/\"350e8ae7ac80104bec4de38ae2cd6cc7\"","last-modified":"Fri, 02 Oct 2026 08:40:33 GMT","vary":"accept-encoding, accept"},"options":{"compress":true}}}
|
package/.npm/_logs/{2026-10-02T08_38_53_560Z-debug-0.log → 2026-10-02T09_15_53_709Z-debug-0.log}
RENAMED
|
@@ -5,24 +5,24 @@
|
|
|
5
5
|
4 silly config load:file:/builds/yurest/yurest-ui/dist/yukit-web/.npmrc
|
|
6
6
|
5 silly config load:file:/root/.npmrc
|
|
7
7
|
6 silly config load:file:/usr/local/etc/npmrc
|
|
8
|
-
7 verbose title npm view yukit-web@0.2.
|
|
9
|
-
8 verbose argv "view" "yukit-web@0.2.
|
|
10
|
-
9 verbose logfile logs-max:10 dir:/builds/yurest/yurest-ui/dist/yukit-web/.npm/_logs/2026-10-
|
|
11
|
-
10 verbose logfile /builds/yurest/yurest-ui/dist/yukit-web/.npm/_logs/2026-10-
|
|
8
|
+
7 verbose title npm view yukit-web@0.2.1 version
|
|
9
|
+
8 verbose argv "view" "yukit-web@0.2.1" "version"
|
|
10
|
+
9 verbose logfile logs-max:10 dir:/builds/yurest/yurest-ui/dist/yukit-web/.npm/_logs/2026-10-02T09_15_53_709Z-
|
|
11
|
+
10 verbose logfile /builds/yurest/yurest-ui/dist/yukit-web/.npm/_logs/2026-10-02T09_15_53_709Z-debug-0.log
|
|
12
12
|
11 silly logfile done cleaning log files
|
|
13
|
-
12 http fetch GET 200 https://registry.npmjs.org/yukit-web
|
|
14
|
-
13 verbose stack Error: No match found for version 0.2.
|
|
13
|
+
12 http fetch GET 200 https://registry.npmjs.org/yukit-web 217ms (cache miss)
|
|
14
|
+
13 verbose stack Error: No match found for version 0.2.1
|
|
15
15
|
13 verbose stack at #getData (/usr/local/lib/node_modules/npm/lib/commands/view.js:192:27)
|
|
16
16
|
13 verbose stack at async #viewPackage (/usr/local/lib/node_modules/npm/lib/commands/view.js:112:28)
|
|
17
17
|
13 verbose stack at async View.exec (/usr/local/lib/node_modules/npm/lib/commands/view.js:70:5)
|
|
18
18
|
13 verbose stack at async Npm.exec (/usr/local/lib/node_modules/npm/lib/npm.js:207:9)
|
|
19
19
|
13 verbose stack at async module.exports (/usr/local/lib/node_modules/npm/lib/cli/entry.js:74:5)
|
|
20
20
|
14 verbose statusCode 404
|
|
21
|
-
15 verbose pkgid yukit-web@0.2.
|
|
21
|
+
15 verbose pkgid yukit-web@0.2.1
|
|
22
22
|
16 error code E404
|
|
23
|
-
17 error 404 No match found for version 0.2.
|
|
23
|
+
17 error 404 No match found for version 0.2.1
|
|
24
24
|
18 error 404
|
|
25
|
-
19 error 404 'yukit-web@0.2.
|
|
25
|
+
19 error 404 'yukit-web@0.2.1' is not in this registry.
|
|
26
26
|
20 error 404
|
|
27
27
|
21 error 404 Note that you can also install from a
|
|
28
28
|
22 error 404 tarball, folder, http url, or git url.
|
|
@@ -32,4 +32,4 @@
|
|
|
32
32
|
26 verbose npm v10.9.9
|
|
33
33
|
27 verbose exit 1
|
|
34
34
|
28 verbose code 1
|
|
35
|
-
29 error A complete log of this run can be found in: /builds/yurest/yurest-ui/dist/yukit-web/.npm/_logs/2026-10-
|
|
35
|
+
29 error A complete log of this run can be found in: /builds/yurest/yurest-ui/dist/yukit-web/.npm/_logs/2026-10-02T09_15_53_709Z-debug-0.log
|
package/.npm/_logs/{2026-10-02T08_38_54_110Z-debug-0.log → 2026-10-02T09_15_54_206Z-debug-0.log}
RENAMED
|
@@ -7,8 +7,8 @@
|
|
|
7
7
|
6 silly config load:file:/usr/local/etc/npmrc
|
|
8
8
|
7 verbose title npm publish
|
|
9
9
|
8 verbose argv "publish" "--access" "public"
|
|
10
|
-
9 verbose logfile logs-max:10 dir:/builds/yurest/yurest-ui/dist/yukit-web/.npm/_logs/2026-10-
|
|
11
|
-
10 verbose logfile /builds/yurest/yurest-ui/dist/yukit-web/.npm/_logs/2026-10-
|
|
10
|
+
9 verbose logfile logs-max:10 dir:/builds/yurest/yurest-ui/dist/yukit-web/.npm/_logs/2026-10-02T09_15_54_206Z-
|
|
11
|
+
10 verbose logfile /builds/yurest/yurest-ui/dist/yukit-web/.npm/_logs/2026-10-02T09_15_54_206Z-debug-0.log
|
|
12
12
|
11 silly logfile done cleaning log files
|
|
13
13
|
12 verbose publish [ '.' ]
|
|
14
14
|
13 silly packumentCache heap:2197815296 maxSize:549453824 maxEntrySize:274726912
|
package/fesm2022/yukit-web.mjs
CHANGED
|
@@ -15,7 +15,7 @@ import * as i1 from '@spartan-ng/brain/tooltip';
|
|
|
15
15
|
import { provideBrnTooltipDefaultOptions, BrnTooltip } from '@spartan-ng/brain/tooltip';
|
|
16
16
|
import { tooltipPositionVariants, DEFAULT_TOOLTIP_CONTENT_CLASSES, DEFAULT_TOOLTIP_SVG_CLASS } from 'yukit-web/helm/tooltip';
|
|
17
17
|
import { NgIcon, provideIcons } from '@ng-icons/core';
|
|
18
|
-
import { lucideX, lucideChevronRight, lucideChevronLeft, lucideArrowLeft, lucidePlus, lucideSearch, lucideEyeOff, lucideEye, lucideSettings2, lucideDownload, lucideTrash2, lucideStar, lucideEllipsis, lucideChevronsUpDown, lucideChevronUp,
|
|
18
|
+
import { lucideX, lucideChevronRight, lucideChevronLeft, lucideArrowLeft, lucidePlus, lucideSearch, lucideEyeOff, lucideEye, lucideSettings2, lucideDownload, lucideTrash2, lucideStar, lucideEllipsis, lucideChevronDown, lucideChevronsUpDown, lucideChevronUp, lucidePencil } from '@ng-icons/lucide';
|
|
19
19
|
import * as i1$1 from 'yukit-web/helm/badge';
|
|
20
20
|
import { HlmBadge } from 'yukit-web/helm/badge';
|
|
21
21
|
import * as i1$2 from 'yukit-web/helm/breadcrumb';
|
|
@@ -3740,11 +3740,11 @@ class YuwListToolbarFilterSetFormComponent {
|
|
|
3740
3740
|
}
|
|
3741
3741
|
}
|
|
3742
3742
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: YuwListToolbarFilterSetFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3743
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.22", type: YuwListToolbarFilterSetFormComponent, isStandalone: true, selector: "yuw-list-toolbar-filter-set-form", inputs: { labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, titleHidden: { classPropertyName: "titleHidden", publicName: "titleHidden", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cancelled: "cancelled", confirmed: "confirmed", deleteRequested: "deleteRequested" }, host: { listeners: { "keydown.enter": "onConfirm()" }, classAttribute: "flex max-w-full flex-col gap-3" }, providers: [provideIcons({ lucideTrash2 })], viewQueries: [{ propertyName: "_nameInput", first: true, predicate: YuwInputComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@if (!titleHidden()) {\n <p class=\"text-sm font-medium\">{{ title() }}</p>\n}\n\n@if (isDelete()) {\n <p class=\"text-sm text-muted-foreground\">{{ deleteMessage() }}</p>\n} @else {\n <div class=\"flex flex-col gap-2\">\n <label class=\"text-sm\" for=\"yuw-filter-set-name\">{{ labels().nameLabel }}</label>\n <yuw-input inputId=\"yuw-filter-set-name\" [maxlength]=\"nameMaxLength\" [(value)]=\"draftName\" />\n </div>\n}\n\n<div class=\"flex items-center gap-
|
|
3743
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.22", type: YuwListToolbarFilterSetFormComponent, isStandalone: true, selector: "yuw-list-toolbar-filter-set-form", inputs: { labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, titleHidden: { classPropertyName: "titleHidden", publicName: "titleHidden", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cancelled: "cancelled", confirmed: "confirmed", deleteRequested: "deleteRequested" }, host: { listeners: { "keydown.enter": "onConfirm()" }, classAttribute: "flex max-w-full flex-col gap-3" }, providers: [provideIcons({ lucideTrash2 })], viewQueries: [{ propertyName: "_nameInput", first: true, predicate: YuwInputComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@if (!titleHidden()) {\n <p class=\"text-sm font-medium\">{{ title() }}</p>\n}\n\n@if (isDelete()) {\n <p class=\"text-sm text-muted-foreground\">{{ deleteMessage() }}</p>\n} @else {\n <div class=\"flex flex-col gap-2\">\n <label class=\"text-sm\" for=\"yuw-filter-set-name\">{{ labels().nameLabel }}</label>\n <yuw-input inputId=\"yuw-filter-set-name\" [maxlength]=\"nameMaxLength\" [(value)]=\"draftName\" />\n </div>\n}\n\n<div class=\"flex flex-wrap items-center gap-1\" [class.justify-between]=\"canDelete()\" [class.justify-end]=\"!canDelete()\">\n @if (canDelete()) {\n <yuw-button variant=\"ghost\" color=\"destructive\" size=\"sm\" class=\"gap-1\" (clicked)=\"deleteRequested.emit()\">\n <ng-icon name=\"lucideTrash2\" size=\"16\" />\n {{ labels().delete }}\n </yuw-button>\n }\n\n <span class=\"flex gap-1\">\n <yuw-button variant=\"outline\" size=\"sm\" (clicked)=\"cancelled.emit()\">{{ labels().cancel }}</yuw-button>\n <yuw-button\n size=\"sm\"\n [color]=\"isDelete() ? 'destructive' : 'neutral'\"\n [disabled]=\"!canConfirm()\"\n (clicked)=\"onConfirm()\"\n >\n {{ isDelete() ? labels().delete : labels().confirm }}\n </yuw-button>\n </span>\n</div>\n", dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: YuwButtonComponent, selector: "yuw-button", inputs: ["animationDisabled", "ariaLabel", "color", "disabled", "href", "size", "target", "transparent", "type", "class", "variant", "yuwDropdownMenuTrigger"], outputs: ["clicked"] }, { kind: "component", type: YuwInputComponent, selector: "yuw-input", inputs: ["inputmode", "maxlength", "size", "type"], outputs: ["enterPressed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3744
3744
|
}
|
|
3745
3745
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: YuwListToolbarFilterSetFormComponent, decorators: [{
|
|
3746
3746
|
type: Component,
|
|
3747
|
-
args: [{ selector: 'yuw-list-toolbar-filter-set-form', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgIcon, YuwButtonComponent, YuwInputComponent], providers: [provideIcons({ lucideTrash2 })], host: { class: 'flex max-w-full flex-col gap-3', '(keydown.enter)': 'onConfirm()' }, template: "@if (!titleHidden()) {\n <p class=\"text-sm font-medium\">{{ title() }}</p>\n}\n\n@if (isDelete()) {\n <p class=\"text-sm text-muted-foreground\">{{ deleteMessage() }}</p>\n} @else {\n <div class=\"flex flex-col gap-2\">\n <label class=\"text-sm\" for=\"yuw-filter-set-name\">{{ labels().nameLabel }}</label>\n <yuw-input inputId=\"yuw-filter-set-name\" [maxlength]=\"nameMaxLength\" [(value)]=\"draftName\" />\n </div>\n}\n\n<div class=\"flex items-center gap-
|
|
3747
|
+
args: [{ selector: 'yuw-list-toolbar-filter-set-form', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgIcon, YuwButtonComponent, YuwInputComponent], providers: [provideIcons({ lucideTrash2 })], host: { class: 'flex max-w-full flex-col gap-3', '(keydown.enter)': 'onConfirm()' }, template: "@if (!titleHidden()) {\n <p class=\"text-sm font-medium\">{{ title() }}</p>\n}\n\n@if (isDelete()) {\n <p class=\"text-sm text-muted-foreground\">{{ deleteMessage() }}</p>\n} @else {\n <div class=\"flex flex-col gap-2\">\n <label class=\"text-sm\" for=\"yuw-filter-set-name\">{{ labels().nameLabel }}</label>\n <yuw-input inputId=\"yuw-filter-set-name\" [maxlength]=\"nameMaxLength\" [(value)]=\"draftName\" />\n </div>\n}\n\n<div class=\"flex flex-wrap items-center gap-1\" [class.justify-between]=\"canDelete()\" [class.justify-end]=\"!canDelete()\">\n @if (canDelete()) {\n <yuw-button variant=\"ghost\" color=\"destructive\" size=\"sm\" class=\"gap-1\" (clicked)=\"deleteRequested.emit()\">\n <ng-icon name=\"lucideTrash2\" size=\"16\" />\n {{ labels().delete }}\n </yuw-button>\n }\n\n <span class=\"flex gap-1\">\n <yuw-button variant=\"outline\" size=\"sm\" (clicked)=\"cancelled.emit()\">{{ labels().cancel }}</yuw-button>\n <yuw-button\n size=\"sm\"\n [color]=\"isDelete() ? 'destructive' : 'neutral'\"\n [disabled]=\"!canConfirm()\"\n (clicked)=\"onConfirm()\"\n >\n {{ isDelete() ? labels().delete : labels().confirm }}\n </yuw-button>\n </span>\n</div>\n" }]
|
|
3748
3748
|
}], ctorParameters: () => [], propDecorators: { _nameInput: [{ type: i0.ViewChild, args: [i0.forwardRef(() => YuwInputComponent), { isSignal: true }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: true }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], titleHidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleHidden", required: false }] }], cancelled: [{ type: i0.Output, args: ["cancelled"] }], confirmed: [{ type: i0.Output, args: ["confirmed"] }], deleteRequested: [{ type: i0.Output, args: ["deleteRequested"] }] } });
|
|
3749
3749
|
|
|
3750
3750
|
const NO_SET = '__yuw_no_set__';
|
|
@@ -3761,6 +3761,9 @@ const NO_SET = '__yuw_no_set__';
|
|
|
3761
3761
|
* opens that set's rename view, which also offers delete. Once
|
|
3762
3762
|
* there are sets, a select applies one. Choosing "none" restores the selection held before the first
|
|
3763
3763
|
* set was applied, but only while a set is the one applied, so it never discards hand-picked filters.
|
|
3764
|
+
* Below `md` the sets select collapses to an icon button that opens it, so the toolbar keeps one
|
|
3765
|
+
* line; the select stays mounted but invisible, right-aligned under the button, so its list has an
|
|
3766
|
+
* anchor and a usable width.
|
|
3764
3767
|
* Naming, renaming and deleting a set replace the editor inside the same popover or sheet. The view
|
|
3765
3768
|
* is reset when the panel opens, not when it closes, so it does not flash back while closing. A change
|
|
3766
3769
|
* of layout closes the panel, since a popover opened from a sheet has no anchor to position against.
|
|
@@ -3925,6 +3928,9 @@ class YuwListToolbarFiltersComponent {
|
|
|
3925
3928
|
this._setsCombobox()?.close();
|
|
3926
3929
|
requestAnimationFrame(() => this.openSetPanel(mode, setId));
|
|
3927
3930
|
}
|
|
3931
|
+
openSetsList() {
|
|
3932
|
+
this._setsCombobox()?.open();
|
|
3933
|
+
}
|
|
3928
3934
|
selectGroup(groupId) {
|
|
3929
3935
|
this._activeGroupId.set(groupId);
|
|
3930
3936
|
}
|
|
@@ -3940,7 +3946,7 @@ class YuwListToolbarFiltersComponent {
|
|
|
3940
3946
|
this.open.set(false);
|
|
3941
3947
|
}
|
|
3942
3948
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: YuwListToolbarFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3943
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.22", type: YuwListToolbarFiltersComponent, isStandalone: true, selector: "yuw-list-toolbar-filters", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, groups: { classPropertyName: "groups", publicName: "groups", isSignal: true, isRequired: true, transformFunction: null }, idleColor: { classPropertyName: "idleColor", publicName: "idleColor", isSignal: true, isRequired: true, transformFunction: null }, isMobile: { classPropertyName: "isMobile", publicName: "isMobile", isSignal: true, isRequired: true, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: true, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, sets: { classPropertyName: "sets", publicName: "sets", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", setDeleted: "setDeleted", setRenamed: "setRenamed", setSaved: "setSaved" }, host: { classAttribute: "flex min-w-0 max-w-full flex-wrap items-center gap-2" }, providers: [provideIcons({ lucideEllipsis, lucideStar, lucideX })], viewQueries: [{ propertyName: "_setsCombobox", first: true, predicate: YuwComboboxComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #options let-group>\n <ul class=\"flex flex-col gap-1\" [attr.aria-label]=\"group.label\">\n @for (option of group.options; track option.value) {\n <li>\n <label\n class=\"flex cursor-pointer items-center justify-between gap-3 rounded-md px-3 py-1 text-sm transition-colors hover:bg-accent/45\"\n [for]=\"`${group.id}-option-${option.value}`\"\n >\n <span class=\"min-w-0 truncate\">{{ option.label }}</span>\n\n <yuw-checkbox\n [inputId]=\"`${group.id}-option-${option.value}`\"\n [checked]=\"draft.checkedValues()[group.id]?.has(option.value) ?? false\"\n [disabled]=\"option.disabled ?? false\"\n [ariaLabel]=\"option.label\"\n (checkedChange)=\"onOptionChange(group, option.value, $event)\"\n />\n </label>\n </li>\n }\n </ul>\n</ng-template>\n\n<ng-template #starIcon>\n <ng-icon name=\"lucideStar\" size=\"16\" [class]=\"matchingSet() ? '[&_svg]:fill-current' : ''\" />\n</ng-template>\n\n<ng-template #setForm let-sheet>\n @if (setPanelMode(); as mode) {\n <yuw-list-toolbar-filter-set-form\n [class]=\"sheet ? 'w-full pb-3' : 'w-64 p-1'\"\n [titleHidden]=\"sheet\"\n [labels]=\"setLabels()!\"\n [mode]=\"mode\"\n [name]=\"setPanelName()\"\n (cancelled)=\"open.set(false)\"\n (confirmed)=\"onSetFormConfirmed($event)\"\n (deleteRequested)=\"onSetDeleteRequested()\"\n />\n }\n</ng-template>\n\n<ng-template #commitRow>\n @if (selectedText(); as text) {\n <p class=\"text-end text-xs text-muted-foreground pr-2\">{{ text }}</p>\n }\n\n <div class=\"flex justify-end gap-2 pt-3\">\n <yuw-button variant=\"outline\" (clicked)=\"draft.clear()\">\n {{ labels().clear }}\n </yuw-button>\n\n <yuw-button (clicked)=\"onApply()\">\n {{ labels().apply }}\n </yuw-button>\n </div>\n</ng-template>\n\n@if (isMobile()) {\n <yuw-button-group\n variant=\"secondary\"\n [buttons]=\"buttons()\"\n [color]=\"buttonsColor()\"\n [ariaLabel]=\"labels().title\"\n (buttonClicked)=\"onButtonClicked($event)\"\n >\n <ng-template yuwButtonGroupContent=\"save\">\n <ng-container [ngTemplateOutlet]=\"starIcon\" />\n </ng-template>\n <ng-template yuwButtonGroupContent=\"clear\">\n <ng-icon name=\"lucideX\" size=\"16\" />\n </ng-template>\n </yuw-button-group>\n\n <yuw-sheet\n side=\"bottom\"\n panelClass=\"max-h-[85svh] overflow-y-auto\"\n [showTrigger]=\"false\"\n [title]=\"sheetTitle()\"\n [closeLabel]=\"labels().close\"\n [(open)]=\"open\"\n >\n @if (setPanelMode()) {\n <ng-container [ngTemplateOutlet]=\"setForm\" [ngTemplateOutletContext]=\"{ $implicit: true }\" />\n } @else {\n <div class=\"flex min-h-0 flex-col gap-3\">\n <yuw-tabs\n class=\"max-w-full justify-start overflow-x-auto overflow-y-hidden scrollbar-none [&::-webkit-scrollbar]:hidden scroll-fade-x\"\n [tabs]=\"tabs()\"\n [activeTab]=\"activeGroup()?.id ?? ''\"\n (activeTabChange)=\"selectGroup($event)\"\n >\n @for (group of groups(); track group.id) {\n <ng-template [yuwTabContent]=\"group.id\">\n <span class=\"flex items-center gap-1.5 whitespace-nowrap\">\n {{ group.label }}\n\n @if (draft.pendingGroupIds().has(group.id)) {\n <yuw-badge\n dot\n color=\"secondary\"\n style=\"width: 0.5rem; height: 0.5rem\"\n [attr.aria-label]=\"labels().pending\"\n [attr.title]=\"labels().pending\"\n />\n }\n </span>\n </ng-template>\n\n <ng-template [yuwTabPanel]=\"group.id\">\n <div class=\"max-h-[45svh] overflow-y-auto pt-2\">\n <ng-container [ngTemplateOutlet]=\"options\" [ngTemplateOutletContext]=\"{ $implicit: group }\" />\n </div>\n </ng-template>\n }\n </yuw-tabs>\n\n <div class=\"pb-3\">\n <ng-container [ngTemplateOutlet]=\"commitRow\" />\n </div>\n </div>\n }\n </yuw-sheet>\n} @else {\n <yuw-popover align=\"start\" panelClass=\"w-auto p-2 dark:border\" triggerClass=\"px-0\" triggerTransparent [(open)]=\"open\">\n <yuw-button-group\n yuwPopoverTrigger\n variant=\"secondary\"\n [buttons]=\"buttons()\"\n [color]=\"buttonsColor()\"\n [ariaLabel]=\"labels().title\"\n (buttonClicked)=\"onButtonClicked($event)\"\n >\n <ng-template yuwButtonGroupContent=\"save\">\n <ng-container [ngTemplateOutlet]=\"starIcon\" />\n </ng-template>\n <ng-template yuwButtonGroupContent=\"clear\">\n <ng-icon name=\"lucideX\" size=\"16\" />\n </ng-template>\n </yuw-button-group>\n @if (setPanelMode()) {\n <ng-container [ngTemplateOutlet]=\"setForm\" [ngTemplateOutletContext]=\"{ $implicit: false }\" />\n } @else {\n <div class=\"flex min-w-0\">\n <ul class=\"flex w-44 shrink-0 flex-col gap-1 pe-2\">\n @for (group of groups(); track group.id) {\n <li>\n <button\n type=\"button\"\n class=\"flex w-full items-center gap-2 rounded-md px-3 py-2 text-start text-sm transition-colors hover:bg-accent/45\"\n [class.bg-accent/45]=\"activeGroup()?.id === group.id\"\n [attr.aria-current]=\"activeGroup()?.id === group.id ? 'true' : null\"\n (click)=\"selectGroup(group.id)\"\n >\n <span class=\"min-w-0 flex-1 truncate\">{{ group.label }}</span>\n\n @if (draft.pendingGroupIds().has(group.id)) {\n <yuw-badge\n dot\n color=\"secondary\"\n style=\"width: 0.5rem; height: 0.5rem\"\n [attr.aria-label]=\"labels().pending\"\n [attr.title]=\"labels().pending\"\n />\n }\n </button>\n </li>\n }\n </ul>\n\n @if (activeGroup(); as group) {\n <div class=\"flex min-w-0 flex-1 flex-col gap-3 border-s p-3\">\n <ng-container [ngTemplateOutlet]=\"options\" [ngTemplateOutletContext]=\"{ $implicit: group }\" />\n <ng-container [ngTemplateOutlet]=\"commitRow\" />\n </div>\n }\n </div>\n }\n </yuw-popover>\n}\n\n@if (setLabels(); as labels) {\n @if (setOptions().length > 0) {\n <div class=\"w-full sm:w-64\">\n <yuw-combobox\n readonlyTrigger\n [options]=\"setOptions()\"\n [value]=\"selectedSetId()\"\n [triggerAriaLabel]=\"labels.select\"\n [placeholder]=\"labels.select\"\n (valueChange)=\"onSetPicked($event)\"\n >\n <ng-template yuwComboboxItem let-option>\n <span class=\"min-w-0 flex-1 truncate\">{{ option.label }}</span>\n\n @if (option.data) {\n <span class=\"inline-flex\" (click)=\"$event.stopPropagation()\">\n <yuw-button\n variant=\"ghost\"\n size=\"icon-sm\"\n [ariaLabel]=\"labels.edit\"\n (clicked)=\"openSetPanelFromList('rename', option.value)\"\n >\n <ng-icon name=\"lucideEllipsis\" size=\"14\" />\n </yuw-button>\n </span>\n }\n </ng-template>\n </yuw-combobox>\n </div>\n }\n}\n", styles: [".scrollbar-none{scrollbar-width:none}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: YuwBadgeComponent, selector: "yuw-badge", inputs: ["color", "dot", "removeLabel", "variant"], outputs: ["removed"] }, { kind: "component", type: YuwButtonComponent, selector: "yuw-button", inputs: ["animationDisabled", "ariaLabel", "color", "disabled", "href", "size", "target", "transparent", "type", "class", "variant", "yuwDropdownMenuTrigger"], outputs: ["clicked"] }, { kind: "component", type: YuwButtonGroupComponent, selector: "yuw-button-group", inputs: ["ariaLabel", "buttons", "color", "orientation", "selectedColor", "selectedVariant", "size", "variant"], outputs: ["buttonClicked"] }, { kind: "directive", type: YuwButtonGroupContentDirective, selector: "ng-template[yuwButtonGroupContent]", inputs: ["yuwButtonGroupContent"] }, { kind: "component", type: YuwCheckboxComponent, selector: "yuw-checkbox", inputs: ["ariaDescribedby", "ariaLabel", "ariaLabelledby", "indeterminate", "inputId", "invalid", "name", "primary", "required", "checked"], outputs: ["indeterminateChange", "checkedChange"] }, { kind: "component", type: YuwComboboxComponent, selector: "yuw-combobox", inputs: ["clearAriaLabel", "emptyText", "inputId", "invalid", "keepValueOnEscape", "multiple", "options", "placeholder", "readonlyTrigger", "search", "searchPlaceholder", "size", "triggerAriaLabel", "value"], outputs: ["searchChange", "valueChange"] }, { kind: "directive", type: YuwComboboxItemDirective, selector: "[yuwComboboxItem]", inputs: ["yuwComboboxItemTypeOf"] }, { kind: "component", type: YuwListToolbarFilterSetFormComponent, selector: "yuw-list-toolbar-filter-set-form", inputs: ["labels", "mode", "name", "titleHidden"], outputs: ["cancelled", "confirmed", "deleteRequested"] }, { kind: "component", type: YuwPopoverComponent, selector: "yuw-popover", inputs: ["align", "description", "offsetX", "open", "panelClass", "showTrigger", "sideOffset", "title", "triggerClass", "triggerColor", "triggerSize", "triggerTransparent", "triggerVariant"], outputs: ["openChange"] }, { kind: "component", type: YuwSheetComponent, selector: "yuw-sheet", inputs: ["ariaLabel", "ariaModal", "closeLabel", "closeOnOutsidePointerEvents", "description", "open", "overlayClass", "panelClass", "scrollStrategy", "showTrigger", "side", "title", "triggerSize", "triggerVariant"], outputs: ["openChange"] }, { kind: "directive", type: YuwTabContentDirective, selector: "ng-template[yuwTabContent]", inputs: ["yuwTabContent"] }, { kind: "directive", type: YuwTabPanelDirective, selector: "ng-template[yuwTabPanel]", inputs: ["yuwTabPanel"] }, { kind: "component", type: YuwTabsComponent, selector: "yuw-tabs", inputs: ["activationMode", "activeTab", "orientation", "size", "tabs", "class", "variant"], outputs: ["activeTabChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3949
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.22", type: YuwListToolbarFiltersComponent, isStandalone: true, selector: "yuw-list-toolbar-filters", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, groups: { classPropertyName: "groups", publicName: "groups", isSignal: true, isRequired: true, transformFunction: null }, idleColor: { classPropertyName: "idleColor", publicName: "idleColor", isSignal: true, isRequired: true, transformFunction: null }, isMobile: { classPropertyName: "isMobile", publicName: "isMobile", isSignal: true, isRequired: true, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: true, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, sets: { classPropertyName: "sets", publicName: "sets", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", setDeleted: "setDeleted", setRenamed: "setRenamed", setSaved: "setSaved" }, host: { classAttribute: "flex min-w-0 max-w-full items-center gap-1" }, providers: [provideIcons({ lucideChevronDown, lucideEllipsis, lucideStar, lucideX })], viewQueries: [{ propertyName: "_setsCombobox", first: true, predicate: YuwComboboxComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #options let-group>\n <ul class=\"flex flex-col gap-1\" [attr.aria-label]=\"group.label\">\n @for (option of group.options; track option.value) {\n <li>\n <label\n class=\"flex cursor-pointer items-center justify-between gap-3 rounded-md px-3 py-1 text-sm transition-colors hover:bg-accent/45\"\n [for]=\"`${group.id}-option-${option.value}`\"\n >\n <span class=\"min-w-0 truncate\">{{ option.label }}</span>\n\n <yuw-checkbox\n [inputId]=\"`${group.id}-option-${option.value}`\"\n [checked]=\"draft.checkedValues()[group.id]?.has(option.value) ?? false\"\n [disabled]=\"option.disabled ?? false\"\n [ariaLabel]=\"option.label\"\n (checkedChange)=\"onOptionChange(group, option.value, $event)\"\n />\n </label>\n </li>\n }\n </ul>\n</ng-template>\n\n<ng-template #starIcon>\n <ng-icon name=\"lucideStar\" size=\"16\" [class]=\"matchingSet() ? '[&_svg]:fill-current' : ''\" />\n</ng-template>\n\n<ng-template #setForm let-sheet>\n @if (setPanelMode(); as mode) {\n <yuw-list-toolbar-filter-set-form\n [class]=\"sheet ? 'w-full pb-3' : 'w-64 p-1'\"\n [titleHidden]=\"sheet\"\n [labels]=\"setLabels()!\"\n [mode]=\"mode\"\n [name]=\"setPanelName()\"\n (cancelled)=\"open.set(false)\"\n (confirmed)=\"onSetFormConfirmed($event)\"\n (deleteRequested)=\"onSetDeleteRequested()\"\n />\n }\n</ng-template>\n\n<ng-template #commitRow>\n @if (selectedText(); as text) {\n <p class=\"text-end text-xs text-muted-foreground pr-2\">{{ text }}</p>\n }\n\n <div class=\"flex justify-end gap-2 pt-3\">\n <yuw-button variant=\"outline\" (clicked)=\"draft.clear()\">\n {{ labels().clear }}\n </yuw-button>\n\n <yuw-button (clicked)=\"onApply()\">\n {{ labels().apply }}\n </yuw-button>\n </div>\n</ng-template>\n\n@if (isMobile()) {\n <yuw-button-group\n variant=\"secondary\"\n [buttons]=\"buttons()\"\n [color]=\"buttonsColor()\"\n [ariaLabel]=\"labels().title\"\n (buttonClicked)=\"onButtonClicked($event)\"\n >\n <ng-template yuwButtonGroupContent=\"save\">\n <ng-container [ngTemplateOutlet]=\"starIcon\" />\n </ng-template>\n <ng-template yuwButtonGroupContent=\"clear\">\n <ng-icon name=\"lucideX\" size=\"16\" />\n </ng-template>\n </yuw-button-group>\n\n <yuw-sheet\n side=\"bottom\"\n panelClass=\"max-h-[85svh] overflow-y-auto\"\n [showTrigger]=\"false\"\n [title]=\"sheetTitle()\"\n [closeLabel]=\"labels().close\"\n [(open)]=\"open\"\n >\n @if (setPanelMode()) {\n <ng-container [ngTemplateOutlet]=\"setForm\" [ngTemplateOutletContext]=\"{ $implicit: true }\" />\n } @else {\n <div class=\"flex min-h-0 flex-col gap-3\">\n <yuw-tabs\n class=\"max-w-full justify-start overflow-x-auto overflow-y-hidden scrollbar-none [&::-webkit-scrollbar]:hidden scroll-fade-x\"\n [tabs]=\"tabs()\"\n [activeTab]=\"activeGroup()?.id ?? ''\"\n (activeTabChange)=\"selectGroup($event)\"\n >\n @for (group of groups(); track group.id) {\n <ng-template [yuwTabContent]=\"group.id\">\n <span class=\"flex items-center gap-1.5 whitespace-nowrap\">\n {{ group.label }}\n\n @if (draft.pendingGroupIds().has(group.id)) {\n <yuw-badge\n dot\n color=\"secondary\"\n style=\"width: 0.5rem; height: 0.5rem\"\n [attr.aria-label]=\"labels().pending\"\n [attr.title]=\"labels().pending\"\n />\n }\n </span>\n </ng-template>\n\n <ng-template [yuwTabPanel]=\"group.id\">\n <div class=\"max-h-[45svh] overflow-y-auto pt-2\">\n <ng-container [ngTemplateOutlet]=\"options\" [ngTemplateOutletContext]=\"{ $implicit: group }\" />\n </div>\n </ng-template>\n }\n </yuw-tabs>\n\n <div class=\"pb-3\">\n <ng-container [ngTemplateOutlet]=\"commitRow\" />\n </div>\n </div>\n }\n </yuw-sheet>\n} @else {\n <yuw-popover align=\"start\" panelClass=\"w-auto p-2 dark:border\" triggerClass=\"px-0\" triggerTransparent [(open)]=\"open\">\n <yuw-button-group\n yuwPopoverTrigger\n variant=\"secondary\"\n [buttons]=\"buttons()\"\n [color]=\"buttonsColor()\"\n [ariaLabel]=\"labels().title\"\n (buttonClicked)=\"onButtonClicked($event)\"\n >\n <ng-template yuwButtonGroupContent=\"save\">\n <ng-container [ngTemplateOutlet]=\"starIcon\" />\n </ng-template>\n <ng-template yuwButtonGroupContent=\"clear\">\n <ng-icon name=\"lucideX\" size=\"16\" />\n </ng-template>\n </yuw-button-group>\n @if (setPanelMode()) {\n <ng-container [ngTemplateOutlet]=\"setForm\" [ngTemplateOutletContext]=\"{ $implicit: false }\" />\n } @else {\n <div class=\"flex min-w-0\">\n <ul class=\"flex w-44 shrink-0 flex-col gap-1 pe-2\">\n @for (group of groups(); track group.id) {\n <li>\n <button\n type=\"button\"\n class=\"flex w-full items-center gap-2 rounded-md px-3 py-2 text-start text-sm transition-colors hover:bg-accent/45\"\n [class.bg-accent/45]=\"activeGroup()?.id === group.id\"\n [attr.aria-current]=\"activeGroup()?.id === group.id ? 'true' : null\"\n (click)=\"selectGroup(group.id)\"\n >\n <span class=\"min-w-0 flex-1 truncate\">{{ group.label }}</span>\n\n @if (draft.pendingGroupIds().has(group.id)) {\n <yuw-badge\n dot\n color=\"secondary\"\n style=\"width: 0.5rem; height: 0.5rem\"\n [attr.aria-label]=\"labels().pending\"\n [attr.title]=\"labels().pending\"\n />\n }\n </button>\n </li>\n }\n </ul>\n\n @if (activeGroup(); as group) {\n <div class=\"flex min-w-0 flex-1 flex-col gap-3 border-s p-3\">\n <ng-container [ngTemplateOutlet]=\"options\" [ngTemplateOutletContext]=\"{ $implicit: group }\" />\n <ng-container [ngTemplateOutlet]=\"commitRow\" />\n </div>\n }\n </div>\n }\n </yuw-popover>\n}\n\n@if (setLabels(); as labels) {\n @if (setOptions().length > 0) {\n <div [class]=\"isMobile() ? 'relative inline-flex' : 'w-full max-w-52.5'\">\n @if (isMobile()) {\n <yuw-button variant=\"outline\" size=\"icon\" [ariaLabel]=\"labels.select\" (clicked)=\"openSetsList()\">\n <ng-icon name=\"lucideChevronDown\" size=\"16\" />\n </yuw-button>\n }\n\n <div [class]=\"isMobile() ? 'pointer-events-none absolute top-0 right-0 h-full w-52 opacity-0' : 'contents'\">\n <yuw-combobox\n readonlyTrigger\n [options]=\"setOptions()\"\n [value]=\"selectedSetId()\"\n [triggerAriaLabel]=\"labels.select\"\n [placeholder]=\"labels.select\"\n (valueChange)=\"onSetPicked($event)\"\n >\n <ng-template yuwComboboxItem let-option>\n <span class=\"min-w-0 flex-1 truncate\">{{ option.label }}</span>\n\n @if (option.data) {\n <span class=\"inline-flex\" (click)=\"$event.stopPropagation()\">\n <yuw-button\n variant=\"ghost\"\n size=\"icon-sm\"\n [ariaLabel]=\"labels.edit\"\n (clicked)=\"openSetPanelFromList('rename', option.value)\"\n >\n <ng-icon name=\"lucideEllipsis\" size=\"14\" />\n </yuw-button>\n </span>\n }\n </ng-template>\n </yuw-combobox>\n </div>\n </div>\n }\n}\n", styles: [".scrollbar-none{scrollbar-width:none}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: YuwBadgeComponent, selector: "yuw-badge", inputs: ["color", "dot", "removeLabel", "variant"], outputs: ["removed"] }, { kind: "component", type: YuwButtonComponent, selector: "yuw-button", inputs: ["animationDisabled", "ariaLabel", "color", "disabled", "href", "size", "target", "transparent", "type", "class", "variant", "yuwDropdownMenuTrigger"], outputs: ["clicked"] }, { kind: "component", type: YuwButtonGroupComponent, selector: "yuw-button-group", inputs: ["ariaLabel", "buttons", "color", "orientation", "selectedColor", "selectedVariant", "size", "variant"], outputs: ["buttonClicked"] }, { kind: "directive", type: YuwButtonGroupContentDirective, selector: "ng-template[yuwButtonGroupContent]", inputs: ["yuwButtonGroupContent"] }, { kind: "component", type: YuwCheckboxComponent, selector: "yuw-checkbox", inputs: ["ariaDescribedby", "ariaLabel", "ariaLabelledby", "indeterminate", "inputId", "invalid", "name", "primary", "required", "checked"], outputs: ["indeterminateChange", "checkedChange"] }, { kind: "component", type: YuwComboboxComponent, selector: "yuw-combobox", inputs: ["clearAriaLabel", "emptyText", "inputId", "invalid", "keepValueOnEscape", "multiple", "options", "placeholder", "readonlyTrigger", "search", "searchPlaceholder", "size", "triggerAriaLabel", "value"], outputs: ["searchChange", "valueChange"] }, { kind: "directive", type: YuwComboboxItemDirective, selector: "[yuwComboboxItem]", inputs: ["yuwComboboxItemTypeOf"] }, { kind: "component", type: YuwListToolbarFilterSetFormComponent, selector: "yuw-list-toolbar-filter-set-form", inputs: ["labels", "mode", "name", "titleHidden"], outputs: ["cancelled", "confirmed", "deleteRequested"] }, { kind: "component", type: YuwPopoverComponent, selector: "yuw-popover", inputs: ["align", "description", "offsetX", "open", "panelClass", "showTrigger", "sideOffset", "title", "triggerClass", "triggerColor", "triggerSize", "triggerTransparent", "triggerVariant"], outputs: ["openChange"] }, { kind: "component", type: YuwSheetComponent, selector: "yuw-sheet", inputs: ["ariaLabel", "ariaModal", "closeLabel", "closeOnOutsidePointerEvents", "description", "open", "overlayClass", "panelClass", "scrollStrategy", "showTrigger", "side", "title", "triggerSize", "triggerVariant"], outputs: ["openChange"] }, { kind: "directive", type: YuwTabContentDirective, selector: "ng-template[yuwTabContent]", inputs: ["yuwTabContent"] }, { kind: "directive", type: YuwTabPanelDirective, selector: "ng-template[yuwTabPanel]", inputs: ["yuwTabPanel"] }, { kind: "component", type: YuwTabsComponent, selector: "yuw-tabs", inputs: ["activationMode", "activeTab", "orientation", "size", "tabs", "class", "variant"], outputs: ["activeTabChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3944
3950
|
}
|
|
3945
3951
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: YuwListToolbarFiltersComponent, decorators: [{
|
|
3946
3952
|
type: Component,
|
|
@@ -3960,7 +3966,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImpo
|
|
|
3960
3966
|
YuwTabContentDirective,
|
|
3961
3967
|
YuwTabPanelDirective,
|
|
3962
3968
|
YuwTabsComponent,
|
|
3963
|
-
], providers: [provideIcons({ lucideEllipsis, lucideStar, lucideX })], host: { class: 'flex min-w-0 max-w-full
|
|
3969
|
+
], providers: [provideIcons({ lucideChevronDown, lucideEllipsis, lucideStar, lucideX })], host: { class: 'flex min-w-0 max-w-full items-center gap-1' }, template: "<ng-template #options let-group>\n <ul class=\"flex flex-col gap-1\" [attr.aria-label]=\"group.label\">\n @for (option of group.options; track option.value) {\n <li>\n <label\n class=\"flex cursor-pointer items-center justify-between gap-3 rounded-md px-3 py-1 text-sm transition-colors hover:bg-accent/45\"\n [for]=\"`${group.id}-option-${option.value}`\"\n >\n <span class=\"min-w-0 truncate\">{{ option.label }}</span>\n\n <yuw-checkbox\n [inputId]=\"`${group.id}-option-${option.value}`\"\n [checked]=\"draft.checkedValues()[group.id]?.has(option.value) ?? false\"\n [disabled]=\"option.disabled ?? false\"\n [ariaLabel]=\"option.label\"\n (checkedChange)=\"onOptionChange(group, option.value, $event)\"\n />\n </label>\n </li>\n }\n </ul>\n</ng-template>\n\n<ng-template #starIcon>\n <ng-icon name=\"lucideStar\" size=\"16\" [class]=\"matchingSet() ? '[&_svg]:fill-current' : ''\" />\n</ng-template>\n\n<ng-template #setForm let-sheet>\n @if (setPanelMode(); as mode) {\n <yuw-list-toolbar-filter-set-form\n [class]=\"sheet ? 'w-full pb-3' : 'w-64 p-1'\"\n [titleHidden]=\"sheet\"\n [labels]=\"setLabels()!\"\n [mode]=\"mode\"\n [name]=\"setPanelName()\"\n (cancelled)=\"open.set(false)\"\n (confirmed)=\"onSetFormConfirmed($event)\"\n (deleteRequested)=\"onSetDeleteRequested()\"\n />\n }\n</ng-template>\n\n<ng-template #commitRow>\n @if (selectedText(); as text) {\n <p class=\"text-end text-xs text-muted-foreground pr-2\">{{ text }}</p>\n }\n\n <div class=\"flex justify-end gap-2 pt-3\">\n <yuw-button variant=\"outline\" (clicked)=\"draft.clear()\">\n {{ labels().clear }}\n </yuw-button>\n\n <yuw-button (clicked)=\"onApply()\">\n {{ labels().apply }}\n </yuw-button>\n </div>\n</ng-template>\n\n@if (isMobile()) {\n <yuw-button-group\n variant=\"secondary\"\n [buttons]=\"buttons()\"\n [color]=\"buttonsColor()\"\n [ariaLabel]=\"labels().title\"\n (buttonClicked)=\"onButtonClicked($event)\"\n >\n <ng-template yuwButtonGroupContent=\"save\">\n <ng-container [ngTemplateOutlet]=\"starIcon\" />\n </ng-template>\n <ng-template yuwButtonGroupContent=\"clear\">\n <ng-icon name=\"lucideX\" size=\"16\" />\n </ng-template>\n </yuw-button-group>\n\n <yuw-sheet\n side=\"bottom\"\n panelClass=\"max-h-[85svh] overflow-y-auto\"\n [showTrigger]=\"false\"\n [title]=\"sheetTitle()\"\n [closeLabel]=\"labels().close\"\n [(open)]=\"open\"\n >\n @if (setPanelMode()) {\n <ng-container [ngTemplateOutlet]=\"setForm\" [ngTemplateOutletContext]=\"{ $implicit: true }\" />\n } @else {\n <div class=\"flex min-h-0 flex-col gap-3\">\n <yuw-tabs\n class=\"max-w-full justify-start overflow-x-auto overflow-y-hidden scrollbar-none [&::-webkit-scrollbar]:hidden scroll-fade-x\"\n [tabs]=\"tabs()\"\n [activeTab]=\"activeGroup()?.id ?? ''\"\n (activeTabChange)=\"selectGroup($event)\"\n >\n @for (group of groups(); track group.id) {\n <ng-template [yuwTabContent]=\"group.id\">\n <span class=\"flex items-center gap-1.5 whitespace-nowrap\">\n {{ group.label }}\n\n @if (draft.pendingGroupIds().has(group.id)) {\n <yuw-badge\n dot\n color=\"secondary\"\n style=\"width: 0.5rem; height: 0.5rem\"\n [attr.aria-label]=\"labels().pending\"\n [attr.title]=\"labels().pending\"\n />\n }\n </span>\n </ng-template>\n\n <ng-template [yuwTabPanel]=\"group.id\">\n <div class=\"max-h-[45svh] overflow-y-auto pt-2\">\n <ng-container [ngTemplateOutlet]=\"options\" [ngTemplateOutletContext]=\"{ $implicit: group }\" />\n </div>\n </ng-template>\n }\n </yuw-tabs>\n\n <div class=\"pb-3\">\n <ng-container [ngTemplateOutlet]=\"commitRow\" />\n </div>\n </div>\n }\n </yuw-sheet>\n} @else {\n <yuw-popover align=\"start\" panelClass=\"w-auto p-2 dark:border\" triggerClass=\"px-0\" triggerTransparent [(open)]=\"open\">\n <yuw-button-group\n yuwPopoverTrigger\n variant=\"secondary\"\n [buttons]=\"buttons()\"\n [color]=\"buttonsColor()\"\n [ariaLabel]=\"labels().title\"\n (buttonClicked)=\"onButtonClicked($event)\"\n >\n <ng-template yuwButtonGroupContent=\"save\">\n <ng-container [ngTemplateOutlet]=\"starIcon\" />\n </ng-template>\n <ng-template yuwButtonGroupContent=\"clear\">\n <ng-icon name=\"lucideX\" size=\"16\" />\n </ng-template>\n </yuw-button-group>\n @if (setPanelMode()) {\n <ng-container [ngTemplateOutlet]=\"setForm\" [ngTemplateOutletContext]=\"{ $implicit: false }\" />\n } @else {\n <div class=\"flex min-w-0\">\n <ul class=\"flex w-44 shrink-0 flex-col gap-1 pe-2\">\n @for (group of groups(); track group.id) {\n <li>\n <button\n type=\"button\"\n class=\"flex w-full items-center gap-2 rounded-md px-3 py-2 text-start text-sm transition-colors hover:bg-accent/45\"\n [class.bg-accent/45]=\"activeGroup()?.id === group.id\"\n [attr.aria-current]=\"activeGroup()?.id === group.id ? 'true' : null\"\n (click)=\"selectGroup(group.id)\"\n >\n <span class=\"min-w-0 flex-1 truncate\">{{ group.label }}</span>\n\n @if (draft.pendingGroupIds().has(group.id)) {\n <yuw-badge\n dot\n color=\"secondary\"\n style=\"width: 0.5rem; height: 0.5rem\"\n [attr.aria-label]=\"labels().pending\"\n [attr.title]=\"labels().pending\"\n />\n }\n </button>\n </li>\n }\n </ul>\n\n @if (activeGroup(); as group) {\n <div class=\"flex min-w-0 flex-1 flex-col gap-3 border-s p-3\">\n <ng-container [ngTemplateOutlet]=\"options\" [ngTemplateOutletContext]=\"{ $implicit: group }\" />\n <ng-container [ngTemplateOutlet]=\"commitRow\" />\n </div>\n }\n </div>\n }\n </yuw-popover>\n}\n\n@if (setLabels(); as labels) {\n @if (setOptions().length > 0) {\n <div [class]=\"isMobile() ? 'relative inline-flex' : 'w-full max-w-52.5'\">\n @if (isMobile()) {\n <yuw-button variant=\"outline\" size=\"icon\" [ariaLabel]=\"labels.select\" (clicked)=\"openSetsList()\">\n <ng-icon name=\"lucideChevronDown\" size=\"16\" />\n </yuw-button>\n }\n\n <div [class]=\"isMobile() ? 'pointer-events-none absolute top-0 right-0 h-full w-52 opacity-0' : 'contents'\">\n <yuw-combobox\n readonlyTrigger\n [options]=\"setOptions()\"\n [value]=\"selectedSetId()\"\n [triggerAriaLabel]=\"labels.select\"\n [placeholder]=\"labels.select\"\n (valueChange)=\"onSetPicked($event)\"\n >\n <ng-template yuwComboboxItem let-option>\n <span class=\"min-w-0 flex-1 truncate\">{{ option.label }}</span>\n\n @if (option.data) {\n <span class=\"inline-flex\" (click)=\"$event.stopPropagation()\">\n <yuw-button\n variant=\"ghost\"\n size=\"icon-sm\"\n [ariaLabel]=\"labels.edit\"\n (clicked)=\"openSetPanelFromList('rename', option.value)\"\n >\n <ng-icon name=\"lucideEllipsis\" size=\"14\" />\n </yuw-button>\n </span>\n }\n </ng-template>\n </yuw-combobox>\n </div>\n </div>\n }\n}\n", styles: [".scrollbar-none{scrollbar-width:none}\n"] }]
|
|
3964
3970
|
}], ctorParameters: () => [], propDecorators: { _setsCombobox: [{ type: i0.ViewChild, args: [i0.forwardRef(() => YuwComboboxComponent), { isSignal: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], groups: [{ type: i0.Input, args: [{ isSignal: true, alias: "groups", required: true }] }], idleColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "idleColor", required: true }] }], isMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "isMobile", required: true }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: true }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }, { type: i0.Output, args: ["selectionChange"] }], sets: [{ type: i0.Input, args: [{ isSignal: true, alias: "sets", required: false }] }], setDeleted: [{ type: i0.Output, args: ["setDeleted"] }], setRenamed: [{ type: i0.Output, args: ["setRenamed"] }], setSaved: [{ type: i0.Output, args: ["setSaved"] }] } });
|
|
3965
3971
|
|
|
3966
3972
|
/**
|