@taiga-ui/layout 5.0.0-canary.b049509 → 5.0.0-canary.c343ecb
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/components/card/large.directive.d.ts +12 -2
- package/directives/index.d.ts +1 -0
- package/directives/list/index.d.ts +1 -0
- package/directives/list/list.directive.d.ts +13 -0
- package/fesm2022/taiga-ui-layout-components-app-bar.mjs +16 -24
- package/fesm2022/taiga-ui-layout-components-app-bar.mjs.map +1 -1
- package/fesm2022/taiga-ui-layout-components-block-details.mjs +7 -9
- package/fesm2022/taiga-ui-layout-components-block-details.mjs.map +1 -1
- package/fesm2022/taiga-ui-layout-components-block-status.mjs +7 -9
- package/fesm2022/taiga-ui-layout-components-block-status.mjs.map +1 -1
- package/fesm2022/taiga-ui-layout-components-card.mjs +36 -35
- package/fesm2022/taiga-ui-layout-components-card.mjs.map +1 -1
- package/fesm2022/taiga-ui-layout-components-dynamic-header.mjs +12 -18
- package/fesm2022/taiga-ui-layout-components-dynamic-header.mjs.map +1 -1
- package/fesm2022/taiga-ui-layout-components-elastic-container.mjs +6 -6
- package/fesm2022/taiga-ui-layout-components-floating-container.mjs +6 -6
- package/fesm2022/taiga-ui-layout-components-form.mjs +6 -6
- package/fesm2022/taiga-ui-layout-components-header.mjs +6 -6
- package/fesm2022/taiga-ui-layout-components-input-search.mjs +3 -3
- package/fesm2022/taiga-ui-layout-components-item-group.mjs +6 -6
- package/fesm2022/taiga-ui-layout-components-navigation.mjs +38 -42
- package/fesm2022/taiga-ui-layout-components-navigation.mjs.map +1 -1
- package/fesm2022/taiga-ui-layout-components-pdf-viewer.mjs +4 -6
- package/fesm2022/taiga-ui-layout-components-pdf-viewer.mjs.map +1 -1
- package/fesm2022/taiga-ui-layout-components-search.mjs +9 -9
- package/fesm2022/taiga-ui-layout-components-slides.mjs +6 -6
- package/fesm2022/taiga-ui-layout-components-surface.mjs +6 -6
- package/fesm2022/taiga-ui-layout-directives-list.mjs +39 -0
- package/fesm2022/taiga-ui-layout-directives-list.mjs.map +1 -0
- package/fesm2022/taiga-ui-layout-directives.mjs +6 -0
- package/fesm2022/taiga-ui-layout-directives.mjs.map +1 -0
- package/fesm2022/taiga-ui-layout.mjs +1 -0
- package/fesm2022/taiga-ui-layout.mjs.map +1 -1
- package/index.d.ts +1 -0
- package/package.json +20 -12
|
@@ -19,15 +19,15 @@ import { TUI_ICON_START } from '@taiga-ui/core/tokens';
|
|
|
19
19
|
import { TUI_COMMON_ICONS } from '@taiga-ui/layout/tokens';
|
|
20
20
|
|
|
21
21
|
class TuiSearchComponent {
|
|
22
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
23
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
22
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
23
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.18", type: TuiSearchComponent, isStandalone: true, selector: "search[tuiSearch]", providers: [
|
|
24
24
|
tuiButtonOptionsProvider({ size: 'm' }),
|
|
25
25
|
tuiBlockOptionsProvider({ size: 's' }),
|
|
26
26
|
tuiSwitchOptionsProvider({ size: 's' }),
|
|
27
27
|
tuiTextfieldOptionsProvider({ size: signal('m') }),
|
|
28
28
|
], ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["search[tuiSearch] form{display:flex;flex-direction:column;gap:.75rem}search[tuiSearch] form fieldset{display:flex;align-items:center;flex-wrap:wrap;gap:inherit;min-inline-size:0;padding:0;margin:0;border:0;color:var(--tui-text-secondary)}search[tuiSearch] form tui-items-with-more{min-inline-size:0;flex:1}search[tuiSearch] form tui-textfield,search[tuiSearch] form [tuiSearchField]{flex:1;min-inline-size:11.25rem;max-inline-size:22.5rem}search[tuiSearch] form tui-textfield:first-child,search[tuiSearch] form [tuiSearchField]:first-child{max-inline-size:unset}search[tuiSearch] form hr{inline-size:1px;block-size:1rem;background:var(--tui-border-normal)}search[tuiSearch] form tui-filter{white-space:nowrap}search[tuiSearch] form [tuiLabel]{font:inherit}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
29
29
|
}
|
|
30
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
30
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiSearchComponent, decorators: [{
|
|
31
31
|
type: Component,
|
|
32
32
|
args: [{ selector: 'search[tuiSearch]', template: '<ng-content/>', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
33
33
|
tuiButtonOptionsProvider({ size: 'm' }),
|
|
@@ -43,8 +43,8 @@ class TuiSearchFilterComponent {
|
|
|
43
43
|
this.template = viewChild(TemplateRef);
|
|
44
44
|
this.ef = effect(() => this.dropdown.set(this.template()));
|
|
45
45
|
}
|
|
46
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
47
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.
|
|
46
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiSearchFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
47
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.18", type: TuiSearchFilterComponent, isStandalone: true, selector: "button[tuiSearchFilter]", providers: [
|
|
48
48
|
tuiDropdownOptionsProvider({ align: 'end' }),
|
|
49
49
|
{
|
|
50
50
|
provide: TUI_ICON_START,
|
|
@@ -52,7 +52,7 @@ class TuiSearchFilterComponent {
|
|
|
52
52
|
},
|
|
53
53
|
], viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], hostDirectives: [{ directive: i1.TuiDropdownDirective }, { directive: i1.TuiWithDropdownOpen }], ngImport: i0, template: '<ng-template><ng-content /></ng-template>filters', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
54
54
|
}
|
|
55
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
55
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiSearchFilterComponent, decorators: [{
|
|
56
56
|
type: Component,
|
|
57
57
|
args: [{
|
|
58
58
|
selector: 'button[tuiSearchFilter]',
|
|
@@ -99,13 +99,13 @@ class TuiSearchFiltersComponent {
|
|
|
99
99
|
get more() {
|
|
100
100
|
return this.button()?.nativeElement.clientWidth || 0;
|
|
101
101
|
}
|
|
102
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
103
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
102
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiSearchFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
103
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.18", type: TuiSearchFiltersComponent, isStandalone: true, selector: "tui-search-filters", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
104
104
|
WaResizeObserverService,
|
|
105
105
|
tuiButtonOptionsProvider({ size: 'xs', appearance: 'flat' }),
|
|
106
106
|
], queries: [{ propertyName: "controls", predicate: NgControl, descendants: true, isSignal: true }, { propertyName: "templates", predicate: TuiItem, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "rem", first: true, predicate: ["rem"], descendants: true, isSignal: true }, { propertyName: "button", first: true, predicate: TuiButton, descendants: true, read: ElementRef, isSignal: true }], hostDirectives: [{ directive: i1$1.TuiTextfieldOptionsDirective, inputs: ["tuiTextfieldSize", "size"] }], ngImport: i0, template: "@for (template of templates(); track template) {\n @if ($index < overflown()) {\n <ng-container [ngTemplateOutlet]=\"template\" />\n }\n}\n<div\n #rem\n class=\"t-rem\"\n></div>\n@if (overflown() < templates().length) {\n <button\n appearance=\"secondary\"\n tuiIconButton\n tuiSearchFilter\n type=\"button\"\n class=\"t-button\"\n [class._active]=\"enabled()\"\n [size]=\"size()\"\n >\n <form\n class=\"t-form\"\n (reset)=\"onReset()\"\n >\n <fieldset\n class=\"t-header\"\n [disabled]=\"!enabled()\"\n >\n <ng-content />\n </fieldset>\n @for (template of templates(); track template) {\n @if ($index >= overflown()) {\n <ng-container [ngTemplateOutlet]=\"template\" />\n }\n }\n </form>\n </button>\n}\n", styles: [":host{display:flex;flex:1;gap:inherit;justify-content:flex-end;min-inline-size:0}.t-rem{position:absolute;inline-size:1rem}.t-button{overflow:visible}.t-button._active:after{content:\"\";position:absolute;top:.25rem;right:.25rem;display:block;inline-size:.625rem;block-size:.625rem;background:var(--tui-status-warning);transform:translate(50%,-50%);border-radius:100%;margin:0}.t-form{display:flex;min-inline-size:25.5rem;max-inline-size:33rem;flex-direction:column;gap:.75rem;padding:0 1.5rem 1.5rem;box-sizing:border-box}.t-header{display:flex;justify-content:space-between;padding:1.25rem 0;margin:0 0 .5rem;border:none;box-shadow:inset 0 -1px var(--tui-border-normal);font:var(--tui-font-ui-l);font-weight:700}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiSearchFilterComponent, selector: "button[tuiSearchFilter]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
107
107
|
}
|
|
108
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
108
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiSearchFiltersComponent, decorators: [{
|
|
109
109
|
type: Component,
|
|
110
110
|
args: [{ selector: 'tui-search-filters', imports: [NgTemplateOutlet, TuiButton, TuiSearchFilterComponent], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
111
111
|
WaResizeObserverService,
|
|
@@ -6,10 +6,10 @@ import { tuiInjectElement } from '@taiga-ui/cdk/utils/dom';
|
|
|
6
6
|
import { tuiWithStyles } from '@taiga-ui/cdk/utils/miscellaneous';
|
|
7
7
|
|
|
8
8
|
class Styles {
|
|
9
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
10
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
9
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: Styles, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.18", type: Styles, isStandalone: true, selector: "ng-component", host: { classAttribute: "tui-slides" }, ngImport: i0, template: '', isInline: true, styles: ["[tuiSlides]{display:grid;isolation:isolate}[tuiSlides][data-direction=\"-1\"]>*{--tui-from: translateX(-2rem)}[tuiSlides][data-direction=\"-1\"]>*.tui-leave{--tui-from: translateX(1rem)}[tuiSlides][data-direction=\"1\"]>*{--tui-from: translateX(2rem)}[tuiSlides][data-direction=\"1\"]>*.tui-leave{--tui-from: translateX(-1rem)}[tuiSlides]>*{grid-area:1 / 1;align-self:start;mix-blend-mode:plus-lighter;animation-name:tuiFade,tuiSlide;animation-duration:var(--tui-duration);animation-timing-function:ease-in-out;--tui-from: translateY(0)}[tuiSlides]>*.tui-slide:not(.tui-leave){animation-name:none}[tuiSlides]>*.tui-leave{margin-block-end:-100rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
11
11
|
}
|
|
12
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
12
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: Styles, decorators: [{
|
|
13
13
|
type: Component,
|
|
14
14
|
args: [{ template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'tui-slides' }, styles: ["[tuiSlides]{display:grid;isolation:isolate}[tuiSlides][data-direction=\"-1\"]>*{--tui-from: translateX(-2rem)}[tuiSlides][data-direction=\"-1\"]>*.tui-leave{--tui-from: translateX(1rem)}[tuiSlides][data-direction=\"1\"]>*{--tui-from: translateX(2rem)}[tuiSlides][data-direction=\"1\"]>*.tui-leave{--tui-from: translateX(-1rem)}[tuiSlides]>*{grid-area:1 / 1;align-self:start;mix-blend-mode:plus-lighter;animation-name:tuiFade,tuiSlide;animation-duration:var(--tui-duration);animation-timing-function:ease-in-out;--tui-from: translateY(0)}[tuiSlides]>*.tui-slide:not(.tui-leave){animation-name:none}[tuiSlides]>*.tui-leave{margin-block-end:-100rem}\n"] }]
|
|
15
15
|
}] });
|
|
@@ -25,10 +25,10 @@ class TuiSlides {
|
|
|
25
25
|
.find((element) => element === target)
|
|
26
26
|
?.classList.add('tui-slide');
|
|
27
27
|
}
|
|
28
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
29
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.
|
|
28
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiSlides, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
29
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.18", type: TuiSlides, isStandalone: true, selector: "[tuiSlides]", inputs: { direction: { classPropertyName: "direction", publicName: "tuiSlides", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "tuiSlides": "" }, listeners: { "animationend": "onAnimation($event.target)" }, properties: { "attr.data-direction": "sign()" } }, hostDirectives: [{ directive: i1.TuiAnimated }], ngImport: i0 }); }
|
|
30
30
|
}
|
|
31
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
31
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiSlides, decorators: [{
|
|
32
32
|
type: Directive,
|
|
33
33
|
args: [{
|
|
34
34
|
selector: '[tuiSlides]',
|
|
@@ -3,10 +3,10 @@ import { ChangeDetectionStrategy, ViewEncapsulation, Component, Directive } from
|
|
|
3
3
|
import { tuiWithStyles } from '@taiga-ui/cdk/utils/miscellaneous';
|
|
4
4
|
|
|
5
5
|
class Styles {
|
|
6
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
7
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
6
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: Styles, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.18", type: Styles, isStandalone: true, selector: "ng-component", host: { classAttribute: "tui-surface" }, ngImport: i0, template: '', isInline: true, styles: ["[tuiSurface]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;--tui-gap: .25rem;position:relative;box-sizing:border-box;background:none no-repeat;background-size:cover;overflow:hidden;isolation:isolate;-webkit-appearance:none;appearance:none;border:0;font-size:inherit;line-height:inherit;text-decoration:none;transition-property:backdrop-filter,background,border-radius,box-shadow,mask,transform!important}[tuiSurface]:focus-visible{outline-color:var(--tui-border-focus)}@supports (not (-moz-appearance: none)) and (not (-webkit-hyphens: none)){[tuiSurface]:before{mix-blend-mode:multiply}}button[tuiSurface]{cursor:pointer}[tuiSurface]:before,[tuiSurface]:after,[tuiSurfaceLayer]:before,[tuiSurfaceLayer]:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";z-index:-1;border-radius:inherit;pointer-events:none;background-size:cover;background-repeat:no-repeat;transition-property:opacity,backdrop-filter,transform}[tuiSurfaceLayer]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:0;left:0;inline-size:100%;block-size:100%;position:absolute!important;z-index:-1;object-fit:cover;border-radius:inherit;box-sizing:border-box;transition-property:box-shadow,filter,padding}input[tuiSurfaceLayer]+[tuiSurfaceLayer]{will-change:padding;background-clip:content-box;overflow:clip;overflow-clip-margin:content-box}input[tuiSurfaceLayer]:checked+[tuiSurfaceLayer]{padding:var(--tui-gap)}input[tuiSurfaceLayer]:focus-visible+[tuiSurfaceLayer]{padding:var(--tui-gap)}@media (hover: hover) and (pointer: fine){[tuiSurface]:hover input[tuiSurfaceLayer]+[tuiSurfaceLayer]{padding:var(--tui-gap)}}input[tuiSurfaceLayer]{color:var(--tui-background-accent-2);-webkit-appearance:none;appearance:none;margin:0;border-radius:inherit;outline:none;box-shadow:inset 0 0,inset 0 0 var(--tui-background-neutral-1)}input[tuiSurfaceLayer]:checked{box-shadow:inset 0 0 0 calc(var(--tui-gap) / 2),inset 0 0 var(--tui-background-neutral-1)}input[tuiSurfaceLayer]:focus-visible{box-shadow:inset 0 0,inset 0 0 0 calc(var(--tui-gap) / 2) var(--tui-background-neutral-1)}input[tuiSurfaceLayer]:checked:focus-visible{filter:brightness(.7);box-shadow:inset 0 0 0 calc(var(--tui-gap) / 2),inset 0 0 0 calc(var(--tui-gap) / 2) var(--tui-background-neutral-1)}@media (hover: hover) and (pointer: fine){[tuiSurface]:hover input[tuiSurfaceLayer]{box-shadow:inset 0 0,inset 0 0 0 calc(var(--tui-gap) / 2) var(--tui-background-neutral-1)}[tuiSurface]:hover input[tuiSurfaceLayer]:checked{filter:brightness(.9);box-shadow:inset 0 0 0 calc(var(--tui-gap) / 2),inset 0 0 0 calc(var(--tui-gap) / 2) var(--tui-background-neutral-1)}}[tuiSurface][data-appearance=floating]:is(a,button,select,textarea,input,label,.tui-interactive):not(:disabled):active{box-shadow:var(--tui-shadow-small);transform:scale(.95)}@media (hover: hover) and (pointer: fine){[tuiSurface][data-appearance=floating]:is(a,button,select,textarea,input,label,.tui-interactive):not(:disabled):hover{box-shadow:var(--tui-shadow-small-hover);transform:translate3d(0,-.25rem,0);background:var(--tui-background-elevation-2)}}[tuiSurface][data-appearance=neutral]:is(a,button,select,textarea,input,label,.tui-interactive):not(:disabled):active{transform:scale(.95)}@media (hover: hover) and (pointer: fine){[tuiSurface][data-appearance=neutral]:is(a,button,select,textarea,input,label,.tui-interactive):not(:disabled):hover{transform:scale(1.15)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
8
8
|
}
|
|
9
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
9
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: Styles, decorators: [{
|
|
10
10
|
type: Component,
|
|
11
11
|
args: [{ template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'tui-surface' }, styles: ["[tuiSurface]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;--tui-gap: .25rem;position:relative;box-sizing:border-box;background:none no-repeat;background-size:cover;overflow:hidden;isolation:isolate;-webkit-appearance:none;appearance:none;border:0;font-size:inherit;line-height:inherit;text-decoration:none;transition-property:backdrop-filter,background,border-radius,box-shadow,mask,transform!important}[tuiSurface]:focus-visible{outline-color:var(--tui-border-focus)}@supports (not (-moz-appearance: none)) and (not (-webkit-hyphens: none)){[tuiSurface]:before{mix-blend-mode:multiply}}button[tuiSurface]{cursor:pointer}[tuiSurface]:before,[tuiSurface]:after,[tuiSurfaceLayer]:before,[tuiSurfaceLayer]:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";z-index:-1;border-radius:inherit;pointer-events:none;background-size:cover;background-repeat:no-repeat;transition-property:opacity,backdrop-filter,transform}[tuiSurfaceLayer]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:0;left:0;inline-size:100%;block-size:100%;position:absolute!important;z-index:-1;object-fit:cover;border-radius:inherit;box-sizing:border-box;transition-property:box-shadow,filter,padding}input[tuiSurfaceLayer]+[tuiSurfaceLayer]{will-change:padding;background-clip:content-box;overflow:clip;overflow-clip-margin:content-box}input[tuiSurfaceLayer]:checked+[tuiSurfaceLayer]{padding:var(--tui-gap)}input[tuiSurfaceLayer]:focus-visible+[tuiSurfaceLayer]{padding:var(--tui-gap)}@media (hover: hover) and (pointer: fine){[tuiSurface]:hover input[tuiSurfaceLayer]+[tuiSurfaceLayer]{padding:var(--tui-gap)}}input[tuiSurfaceLayer]{color:var(--tui-background-accent-2);-webkit-appearance:none;appearance:none;margin:0;border-radius:inherit;outline:none;box-shadow:inset 0 0,inset 0 0 var(--tui-background-neutral-1)}input[tuiSurfaceLayer]:checked{box-shadow:inset 0 0 0 calc(var(--tui-gap) / 2),inset 0 0 var(--tui-background-neutral-1)}input[tuiSurfaceLayer]:focus-visible{box-shadow:inset 0 0,inset 0 0 0 calc(var(--tui-gap) / 2) var(--tui-background-neutral-1)}input[tuiSurfaceLayer]:checked:focus-visible{filter:brightness(.7);box-shadow:inset 0 0 0 calc(var(--tui-gap) / 2),inset 0 0 0 calc(var(--tui-gap) / 2) var(--tui-background-neutral-1)}@media (hover: hover) and (pointer: fine){[tuiSurface]:hover input[tuiSurfaceLayer]{box-shadow:inset 0 0,inset 0 0 0 calc(var(--tui-gap) / 2) var(--tui-background-neutral-1)}[tuiSurface]:hover input[tuiSurfaceLayer]:checked{filter:brightness(.9);box-shadow:inset 0 0 0 calc(var(--tui-gap) / 2),inset 0 0 0 calc(var(--tui-gap) / 2) var(--tui-background-neutral-1)}}[tuiSurface][data-appearance=floating]:is(a,button,select,textarea,input,label,.tui-interactive):not(:disabled):active{box-shadow:var(--tui-shadow-small);transform:scale(.95)}@media (hover: hover) and (pointer: fine){[tuiSurface][data-appearance=floating]:is(a,button,select,textarea,input,label,.tui-interactive):not(:disabled):hover{box-shadow:var(--tui-shadow-small-hover);transform:translate3d(0,-.25rem,0);background:var(--tui-background-elevation-2)}}[tuiSurface][data-appearance=neutral]:is(a,button,select,textarea,input,label,.tui-interactive):not(:disabled):active{transform:scale(.95)}@media (hover: hover) and (pointer: fine){[tuiSurface][data-appearance=neutral]:is(a,button,select,textarea,input,label,.tui-interactive):not(:disabled):hover{transform:scale(1.15)}}\n"] }]
|
|
12
12
|
}] });
|
|
@@ -14,10 +14,10 @@ class TuiSurface {
|
|
|
14
14
|
constructor() {
|
|
15
15
|
this.nothing = tuiWithStyles(Styles);
|
|
16
16
|
}
|
|
17
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
18
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
17
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiSurface, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
18
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.18", type: TuiSurface, isStandalone: true, selector: "[tuiSurface]", host: { attributes: { "tuiSurface": "" } }, ngImport: i0 }); }
|
|
19
19
|
}
|
|
20
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiSurface, decorators: [{
|
|
21
21
|
type: Directive,
|
|
22
22
|
args: [{
|
|
23
23
|
selector: '[tuiSurface]',
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { ChangeDetectionStrategy, ViewEncapsulation, Component, inject, input, Directive } from '@angular/core';
|
|
3
|
+
import { tuiCreateOptions } from '@taiga-ui/cdk/utils/di';
|
|
4
|
+
import { tuiWithStyles } from '@taiga-ui/cdk/utils/miscellaneous';
|
|
5
|
+
|
|
6
|
+
const [TUI_LIST_OPTIONS, tuiListOptionsProvider] = tuiCreateOptions({ size: 'l' });
|
|
7
|
+
class Styles {
|
|
8
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: Styles, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.18", type: Styles, isStandalone: true, selector: "ng-component", host: { classAttribute: "tui-list" }, ngImport: i0, template: '', isInline: true, styles: ["[tuiList]{list-style:none;padding:.25rem 0;counter-reset:item;margin-inline-start:1.5rem}[tuiList] [tuiList]{padding:0;margin-inline-start:1.25rem}[tuiList]>li{counter-increment:item;margin:.5rem 0}[tuiList]>li:before{content:counters(item,\".\") \".\";display:inline-flex;margin:0 .5625rem 0 -1.5rem}[tuiList]:is(ul)>li:before{color:transparent;background:radial-gradient(circle .1875rem,var(--tui-status-info) 100%,transparent 101%);inline-size:.75rem;margin-inline-end:.75rem}[tuiList]:is(ol)>li:before{unicode-bidi:isolate;font-variant-numeric:tabular-nums}[tuiList][data-size=l]{font:var(--tui-font-body-l)}[tuiList][data-size=l]:is(ul)>li:before{inline-size:.875rem;margin:0 .5625rem 0 -1.4375rem}[tuiList][data-size=m]{font:var(--tui-font-body-m)}[tuiList][data-size=s]{font:var(--tui-font-ui-s)}[tuiList][data-size=s]>li{margin:.625rem 0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
10
|
+
}
|
|
11
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: Styles, decorators: [{
|
|
12
|
+
type: Component,
|
|
13
|
+
args: [{ template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'tui-list' }, styles: ["[tuiList]{list-style:none;padding:.25rem 0;counter-reset:item;margin-inline-start:1.5rem}[tuiList] [tuiList]{padding:0;margin-inline-start:1.25rem}[tuiList]>li{counter-increment:item;margin:.5rem 0}[tuiList]>li:before{content:counters(item,\".\") \".\";display:inline-flex;margin:0 .5625rem 0 -1.5rem}[tuiList]:is(ul)>li:before{color:transparent;background:radial-gradient(circle .1875rem,var(--tui-status-info) 100%,transparent 101%);inline-size:.75rem;margin-inline-end:.75rem}[tuiList]:is(ol)>li:before{unicode-bidi:isolate;font-variant-numeric:tabular-nums}[tuiList][data-size=l]{font:var(--tui-font-body-l)}[tuiList][data-size=l]:is(ul)>li:before{inline-size:.875rem;margin:0 .5625rem 0 -1.4375rem}[tuiList][data-size=m]{font:var(--tui-font-body-m)}[tuiList][data-size=s]{font:var(--tui-font-ui-s)}[tuiList][data-size=s]>li{margin:.625rem 0}\n"] }]
|
|
14
|
+
}] });
|
|
15
|
+
class TuiList {
|
|
16
|
+
constructor() {
|
|
17
|
+
this.nothing = tuiWithStyles(Styles);
|
|
18
|
+
this.options = inject(TUI_LIST_OPTIONS);
|
|
19
|
+
this.size = input(this.options.size, {
|
|
20
|
+
alias: 'tuiList',
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiList, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
24
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.18", type: TuiList, isStandalone: true, selector: "ul[tuiList], ol[tuiList]", inputs: { size: { classPropertyName: "size", publicName: "tuiList", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-size": "size() || options.size" } }, ngImport: i0 }); }
|
|
25
|
+
}
|
|
26
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TuiList, decorators: [{
|
|
27
|
+
type: Directive,
|
|
28
|
+
args: [{
|
|
29
|
+
selector: 'ul[tuiList], ol[tuiList]',
|
|
30
|
+
host: { '[attr.data-size]': 'size() || options.size' },
|
|
31
|
+
}]
|
|
32
|
+
}] });
|
|
33
|
+
|
|
34
|
+
/**
|
|
35
|
+
* Generated bundle index. Do not edit.
|
|
36
|
+
*/
|
|
37
|
+
|
|
38
|
+
export { TUI_LIST_OPTIONS, TuiList, tuiListOptionsProvider };
|
|
39
|
+
//# sourceMappingURL=taiga-ui-layout-directives-list.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"taiga-ui-layout-directives-list.mjs","sources":["../../../projects/layout/directives/list/list.directive.ts","../../../projects/layout/directives/list/taiga-ui-layout-directives-list.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n Directive,\n inject,\n input,\n ViewEncapsulation,\n} from '@angular/core';\nimport {tuiCreateOptions} from '@taiga-ui/cdk/utils/di';\nimport {tuiWithStyles} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {type TuiSizeL, type TuiSizeS} from '@taiga-ui/core/types';\n\nexport interface TuiListOptions {\n readonly size: TuiSizeL | TuiSizeS;\n}\n\nexport const [TUI_LIST_OPTIONS, tuiListOptionsProvider] =\n tuiCreateOptions<TuiListOptions>({size: 'l'});\n\n@Component({\n template: '',\n styleUrl: './list.style.less',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {class: 'tui-list'},\n})\nclass Styles {}\n\n@Directive({\n selector: 'ul[tuiList], ol[tuiList]',\n host: {'[attr.data-size]': 'size() || options.size'},\n})\nexport class TuiList {\n protected readonly nothing = tuiWithStyles(Styles);\n protected readonly options = inject(TUI_LIST_OPTIONS);\n\n public readonly size = input<TuiListOptions['size'] | ''>(this.options.size, {\n alias: 'tuiList',\n });\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAgBa,MAAA,CAAC,gBAAgB,EAAE,sBAAsB,CAAC,GACnD,gBAAgB,CAAiB,EAAC,IAAI,EAAE,GAAG,EAAC;AAEhD,MAOM,MAAM,CAAA;+GAAN,MAAM,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAN,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,MAAM,8GANE,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,k1BAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAMV,MAAM,EAAA,UAAA,EAAA,CAAA;kBAPX,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAE,EAEG,aAAA,EAAA,iBAAiB,CAAC,IAAI,EACpB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EACzC,IAAA,EAAA,EAAC,KAAK,EAAE,UAAU,EAAC,EAAA,MAAA,EAAA,CAAA,k1BAAA,CAAA,EAAA;;MAQhB,OAAO,CAAA;AAJpB,IAAA,WAAA,GAAA;AAKuB,QAAA,IAAA,CAAA,OAAO,GAAG,aAAa,CAAC,MAAM,CAAC;AAC/B,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAC,gBAAgB,CAAC;QAErC,IAAI,CAAA,IAAA,GAAG,KAAK,CAA8B,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;AACzE,YAAA,KAAK,EAAE,SAAS;AACnB,SAAA,CAAC;AACL;+GAPY,OAAO,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAP,OAAO,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,0BAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,wBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAAP,OAAO,EAAA,UAAA,EAAA,CAAA;kBAJnB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,0BAA0B;AACpC,oBAAA,IAAI,EAAE,EAAC,kBAAkB,EAAE,wBAAwB,EAAC;AACvD,iBAAA;;;AC/BD;;AAEG;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"taiga-ui-layout-directives.mjs","sources":["../../../projects/layout/directives/taiga-ui-layout-directives.ts"],"sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;AAAA;;AAEG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"taiga-ui-layout.mjs","sources":["../../../projects/layout/taiga-ui-layout.ts"],"sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"taiga-ui-layout.mjs","sources":["../../../projects/layout/taiga-ui-layout.ts"],"sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;AAEG"}
|
package/index.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@taiga-ui/layout",
|
|
3
|
-
"version": "5.0.0-canary.
|
|
3
|
+
"version": "5.0.0-canary.c343ecb",
|
|
4
4
|
"description": "A package with Taiga UI layout components",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"angular",
|
|
@@ -16,9 +16,9 @@
|
|
|
16
16
|
"peerDependencies": {
|
|
17
17
|
"@angular/common": ">=19.0.0",
|
|
18
18
|
"@angular/core": ">=19.0.0",
|
|
19
|
-
"@taiga-ui/cdk": "^5.0.0-rc.
|
|
20
|
-
"@taiga-ui/core": "^5.0.0-rc.
|
|
21
|
-
"@taiga-ui/kit": "^5.0.0-rc.
|
|
19
|
+
"@taiga-ui/cdk": "^5.0.0-rc.1",
|
|
20
|
+
"@taiga-ui/core": "^5.0.0-rc.1",
|
|
21
|
+
"@taiga-ui/kit": "^5.0.0-rc.1",
|
|
22
22
|
"@taiga-ui/polymorpheus": "^5.0.0",
|
|
23
23
|
"rxjs": ">=7.0.0"
|
|
24
24
|
},
|
|
@@ -36,6 +36,10 @@
|
|
|
36
36
|
"types": "./components/index.d.ts",
|
|
37
37
|
"default": "./fesm2022/taiga-ui-layout-components.mjs"
|
|
38
38
|
},
|
|
39
|
+
"./directives": {
|
|
40
|
+
"types": "./directives/index.d.ts",
|
|
41
|
+
"default": "./fesm2022/taiga-ui-layout-directives.mjs"
|
|
42
|
+
},
|
|
39
43
|
"./tokens": {
|
|
40
44
|
"types": "./tokens/index.d.ts",
|
|
41
45
|
"default": "./fesm2022/taiga-ui-layout-tokens.mjs"
|
|
@@ -68,6 +72,14 @@
|
|
|
68
72
|
"types": "./components/floating-container/index.d.ts",
|
|
69
73
|
"default": "./fesm2022/taiga-ui-layout-components-floating-container.mjs"
|
|
70
74
|
},
|
|
75
|
+
"./components/form": {
|
|
76
|
+
"types": "./components/form/index.d.ts",
|
|
77
|
+
"default": "./fesm2022/taiga-ui-layout-components-form.mjs"
|
|
78
|
+
},
|
|
79
|
+
"./components/header": {
|
|
80
|
+
"types": "./components/header/index.d.ts",
|
|
81
|
+
"default": "./fesm2022/taiga-ui-layout-components-header.mjs"
|
|
82
|
+
},
|
|
71
83
|
"./components/input-search": {
|
|
72
84
|
"types": "./components/input-search/index.d.ts",
|
|
73
85
|
"default": "./fesm2022/taiga-ui-layout-components-input-search.mjs"
|
|
@@ -76,14 +88,6 @@
|
|
|
76
88
|
"types": "./components/item-group/index.d.ts",
|
|
77
89
|
"default": "./fesm2022/taiga-ui-layout-components-item-group.mjs"
|
|
78
90
|
},
|
|
79
|
-
"./components/header": {
|
|
80
|
-
"types": "./components/header/index.d.ts",
|
|
81
|
-
"default": "./fesm2022/taiga-ui-layout-components-header.mjs"
|
|
82
|
-
},
|
|
83
|
-
"./components/form": {
|
|
84
|
-
"types": "./components/form/index.d.ts",
|
|
85
|
-
"default": "./fesm2022/taiga-ui-layout-components-form.mjs"
|
|
86
|
-
},
|
|
87
91
|
"./components/navigation": {
|
|
88
92
|
"types": "./components/navigation/index.d.ts",
|
|
89
93
|
"default": "./fesm2022/taiga-ui-layout-components-navigation.mjs"
|
|
@@ -103,6 +107,10 @@
|
|
|
103
107
|
"./components/surface": {
|
|
104
108
|
"types": "./components/surface/index.d.ts",
|
|
105
109
|
"default": "./fesm2022/taiga-ui-layout-components-surface.mjs"
|
|
110
|
+
},
|
|
111
|
+
"./directives/list": {
|
|
112
|
+
"types": "./directives/list/index.d.ts",
|
|
113
|
+
"default": "./fesm2022/taiga-ui-layout-directives-list.mjs"
|
|
106
114
|
}
|
|
107
115
|
},
|
|
108
116
|
"sideEffects": false,
|