@taiga-ui/experimental 5.10.0 → 5.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/taiga-ui-experimental-components-calendar.mjs +3 -3
- package/fesm2022/taiga-ui-experimental-components-data-grid.mjs +3 -3
- package/fesm2022/taiga-ui-experimental-components-date-picker.mjs +3 -3
- package/fesm2022/taiga-ui-experimental-components-file.mjs +8 -8
- package/fesm2022/taiga-ui-experimental-components-popout.mjs +12 -12
- package/fesm2022/taiga-ui-experimental-components-search-results.mjs +9 -9
- package/package.json +6 -6
|
@@ -44,10 +44,10 @@ class TuiCalendar {
|
|
|
44
44
|
}
|
|
45
45
|
return range.dayInRange(day) ? 'middle' : null;
|
|
46
46
|
}
|
|
47
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
48
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
47
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiCalendar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
48
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.24", type: TuiCalendar, isStandalone: true, selector: "tui-calendar", inputs: { month: { classPropertyName: "month", publicName: "month", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabledItemHandler: { classPropertyName: "disabledItemHandler", publicName: "disabledItemHandler", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pick: "pick" }, host: { listeners: { "mouseleave": "hovered.set(null)" } }, ngImport: i0, template: "@for (day of week(); track $index) {\n <span>{{ day }}</span>\n}\n@for (week of month() | tuiCalendarSheet: true; track week) {\n @for (day of week; track day) {\n <button\n type=\"button\"\n class=\"t-day\"\n [attr.data-range]=\"getRange(day)\"\n [class.t-day_adjacent]=\"day.month !== month().month\"\n [class.t-day_today]=\"day.daySame(today)\"\n [disabled]=\"disabledItemHandler()(day)\"\n (click)=\"pick.emit(day)\"\n (mouseenter)=\"hovered.set(day)\"\n >\n {{ day.day }}\n </button>\n }\n}\n", styles: [":host{display:grid;inline-size:100%;color:var(--tui-text-secondary);font:var(--tui-typography-ui-s);grid-template:2rem / repeat(7,1fr);gap:.25rem 0;place-items:center;isolation:isolate}.t-day{position:relative;inline-size:100%;block-size:2rem;padding:0;border:0;background:transparent;font:var(--tui-typography-ui-m);color:var(--tui-text-primary);cursor:pointer;overflow:hidden}.t-day:before{content:\"\";position:absolute;inset:50%;z-index:-1;block-size:2rem;inline-size:2rem;border-radius:100%;transform:translate(calc(var(--tui-inline) * -50%),-50%)}.t-day:disabled{opacity:var(--tui-disabled-opacity);pointer-events:none}.t-day_adjacent{opacity:var(--tui-disabled-opacity)}.t-day_today:after{content:\"\";position:absolute;inset-block-end:.25rem;inset-inline-start:50%;margin-inline-start:-.125rem;inline-size:.25rem;block-size:.25rem;border-radius:100%;background:var(--tui-background-accent-2)}.t-day[data-range=single],.t-day[data-range=start],.t-day[data-range=end]{color:var(--tui-text-primary-on-accent-2)}.t-day[data-range=single]:before,.t-day[data-range=start]:before,.t-day[data-range=end]:before{background:var(--tui-background-accent-2)}.t-day[data-range=single]:after,.t-day[data-range=start]:after,.t-day[data-range=end]:after{background:currentColor}.t-day[data-range=start]:before{box-shadow:calc(var(--tui-inline) * 11rem) 0 0 10rem var(--tui-background-neutral-1)}.t-day[data-range=end]:before{box-shadow:calc(var(--tui-inline) * -11rem) 0 0 10rem var(--tui-background-neutral-1)}.t-day[data-range=middle]:before{box-shadow:0 0 0 10rem var(--tui-background-neutral-1),inset 0 0 0 10rem var(--tui-background-neutral-1)}@media(hover:hover)and (pointer:fine){.t-day:hover:before{background:var(--tui-background-neutral-1-hover)}.t-day[data-range=single]:hover:before,.t-day[data-range=start]:hover:before,.t-day[data-range=end]:hover:before{background:var(--tui-background-accent-2-hover)}}\n"], dependencies: [{ kind: "pipe", type: TuiCalendarSheetPipe, name: "tuiCalendarSheet" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
49
49
|
}
|
|
50
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
50
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiCalendar, decorators: [{
|
|
51
51
|
type: Component,
|
|
52
52
|
args: [{ selector: 'tui-calendar', imports: [TuiCalendarSheetPipe], changeDetection: ChangeDetectionStrategy.OnPush, host: { '(mouseleave)': 'hovered.set(null)' }, template: "@for (day of week(); track $index) {\n <span>{{ day }}</span>\n}\n@for (week of month() | tuiCalendarSheet: true; track week) {\n @for (day of week; track day) {\n <button\n type=\"button\"\n class=\"t-day\"\n [attr.data-range]=\"getRange(day)\"\n [class.t-day_adjacent]=\"day.month !== month().month\"\n [class.t-day_today]=\"day.daySame(today)\"\n [disabled]=\"disabledItemHandler()(day)\"\n (click)=\"pick.emit(day)\"\n (mouseenter)=\"hovered.set(day)\"\n >\n {{ day.day }}\n </button>\n }\n}\n", styles: [":host{display:grid;inline-size:100%;color:var(--tui-text-secondary);font:var(--tui-typography-ui-s);grid-template:2rem / repeat(7,1fr);gap:.25rem 0;place-items:center;isolation:isolate}.t-day{position:relative;inline-size:100%;block-size:2rem;padding:0;border:0;background:transparent;font:var(--tui-typography-ui-m);color:var(--tui-text-primary);cursor:pointer;overflow:hidden}.t-day:before{content:\"\";position:absolute;inset:50%;z-index:-1;block-size:2rem;inline-size:2rem;border-radius:100%;transform:translate(calc(var(--tui-inline) * -50%),-50%)}.t-day:disabled{opacity:var(--tui-disabled-opacity);pointer-events:none}.t-day_adjacent{opacity:var(--tui-disabled-opacity)}.t-day_today:after{content:\"\";position:absolute;inset-block-end:.25rem;inset-inline-start:50%;margin-inline-start:-.125rem;inline-size:.25rem;block-size:.25rem;border-radius:100%;background:var(--tui-background-accent-2)}.t-day[data-range=single],.t-day[data-range=start],.t-day[data-range=end]{color:var(--tui-text-primary-on-accent-2)}.t-day[data-range=single]:before,.t-day[data-range=start]:before,.t-day[data-range=end]:before{background:var(--tui-background-accent-2)}.t-day[data-range=single]:after,.t-day[data-range=start]:after,.t-day[data-range=end]:after{background:currentColor}.t-day[data-range=start]:before{box-shadow:calc(var(--tui-inline) * 11rem) 0 0 10rem var(--tui-background-neutral-1)}.t-day[data-range=end]:before{box-shadow:calc(var(--tui-inline) * -11rem) 0 0 10rem var(--tui-background-neutral-1)}.t-day[data-range=middle]:before{box-shadow:0 0 0 10rem var(--tui-background-neutral-1),inset 0 0 0 10rem var(--tui-background-neutral-1)}@media(hover:hover)and (pointer:fine){.t-day:hover:before{background:var(--tui-background-neutral-1-hover)}.t-day[data-range=single]:hover:before,.t-day[data-range=start]:hover:before,.t-day[data-range=end]:hover:before{background:var(--tui-background-accent-2-hover)}}\n"] }]
|
|
53
53
|
}] });
|
|
@@ -15,10 +15,10 @@ class TuiDataGrid {
|
|
|
15
15
|
this.value = input([], { transform: (coerceArray) });
|
|
16
16
|
this.disabledItemHandler = input(TUI_FALSE_HANDLER);
|
|
17
17
|
}
|
|
18
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
19
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
18
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiDataGrid, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
19
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.24", type: TuiDataGrid, isStandalone: true, selector: "tui-data-grid", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabledItemHandler: { classPropertyName: "disabledItemHandler", publicName: "disabledItemHandler", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pick: "pick" }, ngImport: i0, template: "@for (item of items(); track item) {\n <button\n type=\"button\"\n class=\"t-item\"\n [class.t-item_active]=\"value().includes(item)\"\n [disabled]=\"disabledItemHandler()(item)\"\n (click)=\"pick.emit(item)\"\n >\n <ng-container *polymorpheusOutlet=\"content() || `${item}` as text; context: {$implicit: item}\">\n {{ text }}\n </ng-container>\n </button>\n}\n", styles: [":host{display:grid;inline-size:100%;grid-template-columns:repeat(3,calc(33% - .625rem));gap:1rem .5rem;place-content:center}.t-item{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:block;block-size:2.5rem;border-radius:10rem;border:none;background:var(--tui-background-neutral-1);color:var(--tui-text-primary);font:var(--tui-typography-ui-s)}.t-item:disabled{opacity:var(--tui-disabled-opacity);pointer-events:none}.t-item_active{background:var(--tui-background-accent-2);color:var(--tui-text-primary-on-accent-2)}@media(hover:hover)and (pointer:fine){.t-item:hover{background:var(--tui-background-neutral-1-hover);cursor:pointer}.t-item_active:hover{background:var(--tui-background-accent-2-hover)}}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
20
20
|
}
|
|
21
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
21
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiDataGrid, decorators: [{
|
|
22
22
|
type: Component,
|
|
23
23
|
args: [{ selector: 'tui-data-grid', imports: [PolymorpheusOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (item of items(); track item) {\n <button\n type=\"button\"\n class=\"t-item\"\n [class.t-item_active]=\"value().includes(item)\"\n [disabled]=\"disabledItemHandler()(item)\"\n (click)=\"pick.emit(item)\"\n >\n <ng-container *polymorpheusOutlet=\"content() || `${item}` as text; context: {$implicit: item}\">\n {{ text }}\n </ng-container>\n </button>\n}\n", styles: [":host{display:grid;inline-size:100%;grid-template-columns:repeat(3,calc(33% - .625rem));gap:1rem .5rem;place-content:center}.t-item{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:block;block-size:2.5rem;border-radius:10rem;border:none;background:var(--tui-background-neutral-1);color:var(--tui-text-primary);font:var(--tui-typography-ui-s)}.t-item:disabled{opacity:var(--tui-disabled-opacity);pointer-events:none}.t-item_active{background:var(--tui-background-accent-2);color:var(--tui-text-primary-on-accent-2)}@media(hover:hover)and (pointer:fine){.t-item:hover{background:var(--tui-background-neutral-1-hover);cursor:pointer}.t-item_active:hover{background:var(--tui-background-accent-2-hover)}}\n"] }]
|
|
24
24
|
}] });
|
|
@@ -100,10 +100,10 @@ class TuiDatePicker {
|
|
|
100
100
|
this.value.set(day);
|
|
101
101
|
}
|
|
102
102
|
}
|
|
103
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
104
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
103
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiDatePicker, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
104
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.24", type: TuiDatePicker, isStandalone: true, selector: "tui-date-picker", inputs: { view: { classPropertyName: "view", publicName: "view", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, current: { classPropertyName: "current", publicName: "current", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, disabledItemHandler: { classPropertyName: "disabledItemHandler", publicName: "disabledItemHandler", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { view: "viewChange", value: "valueChange", current: "currentChange" }, providers: [tuiButtonOptionsProvider({ size: 'xs', appearance: 'flat' })], viewQueries: [{ propertyName: "carousel", first: true, predicate: TuiCarouselComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<header class=\"t-header\">\n @if (view() !== 'year') {\n <button\n appearance=\"\"\n tuiChevron\n tuiLink\n type=\"button\"\n class=\"t-button\"\n [textContent]=\"button()\"\n (click)=\"view.set(view() === 'day' ? 'month' : 'year')\"\n ></button>\n }\n <button\n tuiIconButton\n type=\"button\"\n class=\"t-chevron\"\n [disabled]=\"start()\"\n [iconStart]=\"icons.decrement\"\n (click)=\"onSpin(-1)\"\n >\n {{ texts()[0] }}\n </button>\n <button\n tuiIconButton\n type=\"button\"\n class=\"t-chevron\"\n [disabled]=\"end()\"\n [iconStart]=\"icons.increment\"\n (click)=\"onSpin(1)\"\n >\n {{ texts()[1] }}\n </button>\n</header>\n<section tuiSlides>\n @switch (view()) {\n @case ('day') {\n <tui-carousel\n [index]=\"current().year * 12 + current().month\"\n [max]=\"max().year * 12 + max().month\"\n [min]=\"min().year * 12 + min().month\"\n (indexChange)=\"current.set(getMonth($event))\"\n >\n <tui-calendar\n *tuiItem=\"let index\"\n [disabledItemHandler]=\"disabledDay()\"\n [month]=\"index | tuiMapper: getMonth\"\n [value]=\"value()\"\n (pick)=\"onDay($event)\"\n />\n </tui-carousel>\n }\n\n @case ('month') {\n <tui-data-grid\n [content]=\"month()\"\n [disabledItemHandler]=\"disabledMonth()\"\n [items]=\"0 | tuiMapper: getItems\"\n [value]=\"months()\"\n (pick)=\"onMonth($event)\"\n />\n }\n\n @case ('year') {\n <tui-carousel\n [max]=\"yearMax()\"\n [min]=\"yearMin()\"\n >\n <tui-data-grid\n *tuiItem=\"let offset\"\n [disabledItemHandler]=\"disabledYear()\"\n [items]=\"current().year + offset * 12 - 6 | tuiMapper: getItems\"\n [value]=\"years()\"\n (pick)=\"onYear($event)\"\n />\n </tui-carousel>\n }\n }\n</section>\n", styles: [":host{display:block;min-inline-size:17.5rem}.t-header{display:flex;gap:.25rem;align-items:center;justify-content:flex-end;padding:.5rem .75rem 1rem}.t-button{transition-property:opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;font:var(--tui-typography-ui-l);font-weight:700;text-decoration:none;margin-inline-end:auto}@media(hover:hover)and (pointer:fine){.t-button:hover{opacity:var(--tui-disabled-opacity)}}\n"], dependencies: [{ kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiCalendar, selector: "tui-calendar", inputs: ["month", "value", "disabledItemHandler"], outputs: ["pick"] }, { kind: "component", type: i1.TuiCarouselComponent, selector: "tui-carousel", inputs: ["index", "min", "max"], outputs: ["indexChange"] }, { kind: "directive", type: i2.TuiItem, selector: "[tuiItem]" }, { kind: "directive", type: TuiChevron, selector: "[tuiChevron]", inputs: ["tuiChevron"] }, { kind: "component", type: TuiDataGrid, selector: "tui-data-grid", inputs: ["items", "content", "value", "disabledItemHandler"], outputs: ["pick"] }, { kind: "directive", type: TuiLink, selector: "a[tuiLink], button[tuiLink]" }, { kind: "pipe", type: TuiMapperPipe, name: "tuiMapper" }, { kind: "directive", type: TuiSlides, selector: "[tuiSlides]", inputs: ["tuiSlides"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
105
105
|
}
|
|
106
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
106
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiDatePicker, decorators: [{
|
|
107
107
|
type: Component,
|
|
108
108
|
args: [{ selector: 'tui-date-picker', imports: [
|
|
109
109
|
TuiButton,
|
|
@@ -21,8 +21,8 @@ class TuiFile {
|
|
|
21
21
|
constructor() {
|
|
22
22
|
this.orientation = input(inject(TUI_FILE_OPTIONS_OPTIONS).orientation);
|
|
23
23
|
}
|
|
24
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
25
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.
|
|
24
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiFile, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
25
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.24", type: TuiFile, isStandalone: true, selector: "[tuiFile]", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "tuiFile": "" }, properties: { "attr.data-orientation": "orientation()" } }, providers: [
|
|
26
26
|
tuiCellOptionsProvider(() => ({ size: inject(TUI_FILE_OPTIONS_OPTIONS).size })),
|
|
27
27
|
tuiAvatarOptionsProvider({ round: false, appearance: 'secondary-grayscale' }),
|
|
28
28
|
tuiButtonOptionsProvider({ size: 's', appearance: 'action' }),
|
|
@@ -40,9 +40,9 @@ class TuiFile {
|
|
|
40
40
|
<ng-content select="[tuiTitle]" />
|
|
41
41
|
</label>
|
|
42
42
|
<ng-content select="[tuiButtonX]" />
|
|
43
|
-
`, isInline: true, styles: ["[data-tui-version=\"5.
|
|
43
|
+
`, isInline: true, styles: ["[data-tui-version=\"5.11.0\"]{@import \"./file.styles.less\";}\n"], dependencies: [{ kind: "directive", type: TuiAvatar, selector: "[tuiAvatar]", inputs: ["size", "round", "badge"] }, { kind: "directive", type: TuiSlides, selector: "[tuiSlides]", inputs: ["tuiSlides"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
44
44
|
}
|
|
45
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
45
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiFile, decorators: [{
|
|
46
46
|
type: Component,
|
|
47
47
|
args: [{ selector: '[tuiFile]', imports: [TuiAvatar, TuiSlides], template: `
|
|
48
48
|
<label>
|
|
@@ -65,7 +65,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
|
|
|
65
65
|
], hostDirectives: [{ directive: TuiCell, inputs: ['tuiCell: size'] }], host: {
|
|
66
66
|
tuiFile: '',
|
|
67
67
|
'[attr.data-orientation]': 'orientation()',
|
|
68
|
-
}, styles: ["[data-tui-version=\"5.
|
|
68
|
+
}, styles: ["[data-tui-version=\"5.11.0\"]{@import \"./file.styles.less\";}\n"] }]
|
|
69
69
|
}] });
|
|
70
70
|
|
|
71
71
|
class TuiFilePipe {
|
|
@@ -80,10 +80,10 @@ class TuiFilePipe {
|
|
|
80
80
|
ngOnDestroy() {
|
|
81
81
|
URL.revokeObjectURL(this.url);
|
|
82
82
|
}
|
|
83
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
84
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.
|
|
83
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiFilePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
84
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.24", ngImport: i0, type: TuiFilePipe, isStandalone: true, name: "tuiFile" }); }
|
|
85
85
|
}
|
|
86
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
86
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiFilePipe, decorators: [{
|
|
87
87
|
type: Pipe,
|
|
88
88
|
args: [{ name: 'tuiFile' }]
|
|
89
89
|
}] });
|
|
@@ -14,8 +14,8 @@ class TuiPopoutComponent {
|
|
|
14
14
|
constructor() {
|
|
15
15
|
this.context = injectContext();
|
|
16
16
|
}
|
|
17
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
18
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
17
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiPopoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
18
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.24", type: TuiPopoutComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: `
|
|
19
19
|
<tui-root>
|
|
20
20
|
<ng-container *polymorpheusOutlet="context.content as text; context: context">
|
|
21
21
|
{{ text }}
|
|
@@ -23,7 +23,7 @@ class TuiPopoutComponent {
|
|
|
23
23
|
</tui-root>
|
|
24
24
|
`, isInline: true, dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: TuiRoot, selector: "tui-root" }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
|
|
25
25
|
}
|
|
26
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
26
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiPopoutComponent, decorators: [{
|
|
27
27
|
type: Component,
|
|
28
28
|
args: [{
|
|
29
29
|
imports: [PolymorpheusOutlet, TuiRoot],
|
|
@@ -119,10 +119,10 @@ class PopoutComponent {
|
|
|
119
119
|
throw error;
|
|
120
120
|
});
|
|
121
121
|
}
|
|
122
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
123
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
122
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: PopoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
123
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.24", type: PopoutComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
124
124
|
}
|
|
125
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
125
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: PopoutComponent, decorators: [{
|
|
126
126
|
type: Component,
|
|
127
127
|
args: [{
|
|
128
128
|
template: '',
|
|
@@ -135,10 +135,10 @@ class TuiPopoutService extends TuiPortal {
|
|
|
135
135
|
this.component = PopoutComponent;
|
|
136
136
|
this.options = { title: '', features: {}, pip: false };
|
|
137
137
|
}
|
|
138
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
139
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
138
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiPopoutService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
139
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiPopoutService, providedIn: 'root' }); }
|
|
140
140
|
}
|
|
141
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
141
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiPopoutService, decorators: [{
|
|
142
142
|
type: Injectable,
|
|
143
143
|
args: [{ providedIn: 'root' }]
|
|
144
144
|
}], ctorParameters: () => [] });
|
|
@@ -147,10 +147,10 @@ class TuiPopout {
|
|
|
147
147
|
constructor() {
|
|
148
148
|
this.tuiPopoutOptions = input({});
|
|
149
149
|
}
|
|
150
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
151
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.
|
|
150
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiPopout, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
151
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.24", type: TuiPopout, isStandalone: true, selector: "ng-template[tuiPopout]", inputs: { tuiPopoutOptions: { classPropertyName: "tuiPopoutOptions", publicName: "tuiPopoutOptions", isSignal: true, isRequired: false, transformFunction: null } }, providers: [tuiAsPortal(TuiPopoutService)], hostDirectives: [{ directive: i1.TuiPortalDirective, inputs: ["options", "tuiPopoutOptions", "open", "tuiPopout"], outputs: ["openChange", "tuiPopoutChange"] }], ngImport: i0 }); }
|
|
152
152
|
}
|
|
153
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
153
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiPopout, decorators: [{
|
|
154
154
|
type: Directive,
|
|
155
155
|
args: [{
|
|
156
156
|
selector: 'ng-template[tuiPopout]',
|
|
@@ -67,10 +67,10 @@ class TuiSearchHistory {
|
|
|
67
67
|
get items() {
|
|
68
68
|
return JSON.parse(this.storage?.getItem(this.options.key) || '[]');
|
|
69
69
|
}
|
|
70
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
71
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
70
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiSearchHistory, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
71
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.24", type: TuiSearchHistory, isStandalone: true, selector: "tui-search-history", inputs: { popular: { classPropertyName: "popular", publicName: "popular", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (history.length) {\n <label class=\"t-sr-label\">{{ i18n().history }}</label>\n}\n@for (item of history; track item) {\n <button\n tuiCell\n type=\"button\"\n (click)=\"select(item)\"\n (keydown.backspace)=\"remove(item)\"\n (keydown.delete)=\"remove(item)\"\n (mousedown.prevent)=\"(0)\"\n >\n <div [tuiAvatar]=\"options.history\"></div>\n <span tuiTitle>{{ item }}</span>\n <button\n appearance=\"icon\"\n size=\"xs\"\n tabindex=\"-1\"\n tuiIconButton\n type=\"button\"\n [iconStart]=\"options.remove\"\n (click.stop)=\"remove(item)\"\n >\n \uD83D\uDDD1\uFE0F\n </button>\n </button>\n}\n@if (popular().length) {\n <label class=\"t-sr-label\">{{ i18n().popular }}</label>\n}\n@for (item of popular(); track item) {\n <button\n tuiCell\n type=\"button\"\n (click)=\"select(item)\"\n (mousedown.prevent)=\"(0)\"\n >\n <span [tuiAvatar]=\"options.popular\"></span>\n <span tuiTitle>{{ item }}</span>\n </button>\n}\n", styles: [":host:not(:empty){display:block;padding:.375rem 0}\n"], dependencies: [{ kind: "directive", type: TuiAvatar, selector: "[tuiAvatar]", inputs: ["size", "round", "badge"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "directive", type: TuiCell, selector: "[tuiCell]:not(ng-template)", inputs: ["tuiCell", "tuiCellHeight"] }, { kind: "directive", type: TuiTitle, selector: "[tuiTitle]", inputs: ["tuiTitle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
72
72
|
}
|
|
73
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
73
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiSearchHistory, decorators: [{
|
|
74
74
|
type: Component,
|
|
75
75
|
args: [{ selector: 'tui-search-history', imports: [TuiAvatar, TuiButton, TuiCell, TuiTitle], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (history.length) {\n <label class=\"t-sr-label\">{{ i18n().history }}</label>\n}\n@for (item of history; track item) {\n <button\n tuiCell\n type=\"button\"\n (click)=\"select(item)\"\n (keydown.backspace)=\"remove(item)\"\n (keydown.delete)=\"remove(item)\"\n (mousedown.prevent)=\"(0)\"\n >\n <div [tuiAvatar]=\"options.history\"></div>\n <span tuiTitle>{{ item }}</span>\n <button\n appearance=\"icon\"\n size=\"xs\"\n tabindex=\"-1\"\n tuiIconButton\n type=\"button\"\n [iconStart]=\"options.remove\"\n (click.stop)=\"remove(item)\"\n >\n \uD83D\uDDD1\uFE0F\n </button>\n </button>\n}\n@if (popular().length) {\n <label class=\"t-sr-label\">{{ i18n().popular }}</label>\n}\n@for (item of popular(); track item) {\n <button\n tuiCell\n type=\"button\"\n (click)=\"select(item)\"\n (mousedown.prevent)=\"(0)\"\n >\n <span [tuiAvatar]=\"options.popular\"></span>\n <span tuiTitle>{{ item }}</span>\n </button>\n}\n", styles: [":host:not(:empty){display:block;padding:.375rem 0}\n"] }]
|
|
76
76
|
}] });
|
|
@@ -82,10 +82,10 @@ class TuiSearchHotkey {
|
|
|
82
82
|
this.search = inject(TuiInputSearch);
|
|
83
83
|
this.placeholder = computed(({ hotkey } = this.texts()) => this.platform.startsWith('Mac') ? `⌘+K ${hotkey}` : `Alt+K ${hotkey}`);
|
|
84
84
|
}
|
|
85
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
86
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
85
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiSearchHotkey, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
86
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.24", type: TuiSearchHotkey, isStandalone: true, selector: "input[tuiSearchHotkey]", host: { listeners: { "document:keydown.alt.k.stop": "search.open()", "document:keydown.meta.k.stop": "search.open()" }, properties: { "placeholder": "placeholder()" } }, ngImport: i0 }); }
|
|
87
87
|
}
|
|
88
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
88
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiSearchHotkey, decorators: [{
|
|
89
89
|
type: Directive,
|
|
90
90
|
args: [{
|
|
91
91
|
selector: 'input[tuiSearchHotkey]',
|
|
@@ -131,10 +131,10 @@ class TuiSearchResultsComponent {
|
|
|
131
131
|
asIs() {
|
|
132
132
|
return 0;
|
|
133
133
|
}
|
|
134
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
135
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
134
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiSearchResultsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
135
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.24", type: TuiSearchResultsComponent, isStandalone: true, selector: "tui-search-results", inputs: { results: { classPropertyName: "results", publicName: "results", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "keydown.arrowDown.prevent": "onArrow($event.target, 1)", "keydown.arrowUp.prevent": "onArrow($event.target, -1)" } }, queries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "@if (!textfield.value()) {\n <ng-content />\n} @else {\n @if (!results()) {\n <tui-loader class=\"t-loader\" />\n } @else {\n @if (empty()) {\n <tui-block-status\n size=\"m\"\n class=\"t-status\"\n >\n <tui-icon\n tuiSlot=\"top\"\n class=\"t-empty\"\n [icon]=\"options.empty\"\n />\n {{ i18n().empty }}\n </tui-block-status>\n } @else {\n @let items = (results() | keyvalue: asIs) || [];\n <tui-scrollbar class=\"t-scrollbar\">\n @for (group of items | tuiFilter: notEmpty; track group) {\n @if (!active || active === $index + 1) {\n @if (!active && items.length > 1) {\n <label class=\"t-sr-label\">\n {{ group.key }}\n </label>\n }\n @for (item of group.value; track item) {\n <ng-container\n [ngTemplateOutlet]=\"template() || null\"\n [ngTemplateOutletContext]=\"{$implicit: item}\"\n />\n }\n }\n }\n </tui-scrollbar>\n @if (items.length > 1) {\n <tui-tabs\n size=\"m\"\n class=\"t-tabs\"\n [(activeItemIndex)]=\"active\"\n (document:keydown.shift.tab.prevent)=\"tab(-1)\"\n (document:keydown.tab.prevent)=\"tab(1)\"\n >\n <button tuiTab>{{ i18n().all }}</button>\n @for (group of items; track group) {\n @if (group.value.length) {\n <button tuiTab>\n {{ group.key }}\n </button>\n }\n }\n </tui-tabs>\n }\n }\n }\n}\n", styles: [":host{display:flex;flex-direction:column;border-radius:var(--tui-radius-l);background:var(--tui-background-base);box-shadow:inset 0 0 0 1px var(--tui-border-normal)}:host ::ng-deep [tuiCell]{inline-size:calc(100% - 2rem);padding:.375rem;margin:.25rem .625rem;border-radius:var(--tui-radius-l)}:host ::ng-deep [tuiCell]>[tuiAvatar]{border-radius:var(--tui-radius-m)}:host ::ng-deep .t-sr-label{display:block;font:var(--tui-typography-ui-s);color:var(--tui-text-secondary);margin:.75rem 1rem .5rem}.t-loader{margin:1rem 0}.t-status{margin-block-end:2rem}.t-empty{margin-block-start:1.5rem;font-size:6rem;color:var(--tui-text-primary)}.t-tabs{order:-1;margin:0 1rem;box-shadow:none;border-image:linear-gradient(0deg,var(--tui-border-normal) 1px,transparent 0) fill 0/0/0 1rem}.t-tabs:before{background:var(--tui-background-accent-opposite-pressed)}.t-scrollbar{max-block-size:30rem;padding:.375rem 0}\n"], dependencies: [{ kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1.TuiBlockStatusComponent, selector: "tui-block-status", inputs: ["card", "size"] }, { kind: "directive", type: i1.TuiBlockStatusDirective, selector: "[tuiSlot]", inputs: ["tuiSlot"] }, { kind: "pipe", type: TuiFilterPipe, name: "tuiFilter" }, { kind: "component", type: TuiIcon, selector: "tui-icon:not([tuiBadge])", inputs: ["background"] }, { kind: "component", type: TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "loading"] }, { kind: "component", type: TuiScrollbar, selector: "tui-scrollbar" }, { kind: "directive", type: i2.TuiTab, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { kind: "directive", type: i2.TuiTabsHorizontal, selector: "tui-tabs:not([vertical])", inputs: ["underline"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
136
136
|
}
|
|
137
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
137
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.24", ngImport: i0, type: TuiSearchResultsComponent, decorators: [{
|
|
138
138
|
type: Component,
|
|
139
139
|
args: [{ selector: 'tui-search-results', imports: [
|
|
140
140
|
KeyValuePipe,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@taiga-ui/experimental",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.11.0",
|
|
4
4
|
"description": "A package with Taiga UI experimental components",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"angular",
|
|
@@ -30,11 +30,11 @@
|
|
|
30
30
|
"peerDependencies": {
|
|
31
31
|
"@angular/common": ">=19.0.0",
|
|
32
32
|
"@angular/core": ">=19.0.0",
|
|
33
|
-
"@taiga-ui/addon-commerce": "5.
|
|
34
|
-
"@taiga-ui/cdk": "5.
|
|
35
|
-
"@taiga-ui/core": "5.
|
|
36
|
-
"@taiga-ui/kit": "5.
|
|
37
|
-
"@taiga-ui/layout": "5.
|
|
33
|
+
"@taiga-ui/addon-commerce": "5.11.0",
|
|
34
|
+
"@taiga-ui/cdk": "5.11.0",
|
|
35
|
+
"@taiga-ui/core": "5.11.0",
|
|
36
|
+
"@taiga-ui/kit": "5.11.0",
|
|
37
|
+
"@taiga-ui/layout": "5.11.0",
|
|
38
38
|
"@taiga-ui/polymorpheus": "^5.0.1",
|
|
39
39
|
"rxjs": ">=7.0.0"
|
|
40
40
|
},
|