@spicainternational/ngx-sds-components 7.5.0 → 7.6.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/esm2020/src/lib/drawer/drawer.component.mjs +44 -3
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-drawer.mjs +43 -2
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-drawer.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-drawer.mjs +43 -2
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-drawer.mjs.map +1 -1
- package/package.json +1 -1
- package/src/lib/drawer/drawer.component.d.ts +10 -1
|
@@ -3,6 +3,11 @@ import * as i0 from "@angular/core";
|
|
|
3
3
|
export class SdsDrawerComponent {
|
|
4
4
|
constructor() {
|
|
5
5
|
this.isOpen = false;
|
|
6
|
+
this.showShadow = true;
|
|
7
|
+
this.backgroundColor = 'white';
|
|
8
|
+
this.borderColor = 'var(--bs-gray-400)';
|
|
9
|
+
this.transitionTimingFunction = 'ease-in-out';
|
|
10
|
+
this.transitionDuration = '0.3s';
|
|
6
11
|
this.width = '10rem';
|
|
7
12
|
this.position = 'end';
|
|
8
13
|
this.drawerClass = true;
|
|
@@ -25,14 +30,38 @@ export class SdsDrawerComponent {
|
|
|
25
30
|
get drawerWidth() {
|
|
26
31
|
return this.width;
|
|
27
32
|
}
|
|
33
|
+
get drawerShowShadow() {
|
|
34
|
+
return this.showShadow;
|
|
35
|
+
}
|
|
36
|
+
get drawerBackgroundColor() {
|
|
37
|
+
return this.backgroundColor;
|
|
38
|
+
}
|
|
39
|
+
get drawerTransitionTimingFunction() {
|
|
40
|
+
return this.transitionTimingFunction;
|
|
41
|
+
}
|
|
42
|
+
get drawerTransitionDuration() {
|
|
43
|
+
return this.transitionDuration;
|
|
44
|
+
}
|
|
28
45
|
}
|
|
29
46
|
SdsDrawerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
30
|
-
SdsDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsDrawerComponent, selector: "sds-drawer", inputs: { isOpen: "isOpen", width: "width", position: "position" }, host: { properties: { "class.sds-drawer": "this.drawerClass", "class.sds-drawer-end": "this.drawerEnd", "class.sds-drawer-start": "this.drawerStart", "class.sds-drawer-top": "this.drawerTop", "class.sds-drawer-bottom": "this.drawerBottom", "class.show": "this.show", "style.width": "this.drawerWidth" } }, ngImport: i0, template: "<ng-content></ng-content>\r\n", styles: [":host{position:fixed;bottom:0;z-index:1040;display:flex;flex-direction:column;max-width:100%;background-color:#fff;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}:host(.sds-drawer-start){top:0;left:0;width:400px;border-right:1px solid var(--
|
|
47
|
+
SdsDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsDrawerComponent, selector: "sds-drawer", inputs: { isOpen: "isOpen", showShadow: "showShadow", backgroundColor: "backgroundColor", borderColor: "borderColor", transitionTimingFunction: "transitionTimingFunction", transitionDuration: "transitionDuration", width: "width", position: "position" }, host: { properties: { "style.--sds-drawer-border-color": "borderColor", "class.sds-drawer": "this.drawerClass", "class.sds-drawer-end": "this.drawerEnd", "class.sds-drawer-start": "this.drawerStart", "class.sds-drawer-top": "this.drawerTop", "class.sds-drawer-bottom": "this.drawerBottom", "class.show": "this.show", "style.width": "this.drawerWidth", "class.show-shadow": "this.drawerShowShadow", "style.background-color": "this.drawerBackgroundColor", "style.transition-timing-function": "this.drawerTransitionTimingFunction", "style.transition-duration": "this.drawerTransitionDuration" } }, ngImport: i0, template: "<ng-content></ng-content>\r\n", styles: [":host{position:fixed;bottom:0;z-index:1040;display:flex;flex-direction:column;max-width:100%;background-color:#fff;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}:host(.sds-drawer-start){top:0;left:0;width:400px;border-right:1px solid var(--sds-drawer-border-color);transform:translate(-100%)}:host(.sds-drawer-end){top:0;right:0;width:400px;border-left:1px solid var(--sds-drawer-border-color);transform:translate(100%)}:host(.sds-drawer-top){top:0;right:0;left:0;height:400px;max-height:100%;border-bottom:1px solid var(--sds-drawer-border-color);transform:translateY(-100%)}:host(.sds-drawer-bottom){right:0;left:0;height:400px;max-height:100%;border-top:1px solid var(--sds-drawer-border-color);transform:translateY(100%)}:host(.show){transform:none}:host(.show).show-shadow{box-shadow:var(--bs-box-shadow)!important}\n"] });
|
|
31
48
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsDrawerComponent, decorators: [{
|
|
32
49
|
type: Component,
|
|
33
|
-
args: [{ selector: 'sds-drawer',
|
|
50
|
+
args: [{ selector: 'sds-drawer', host: {
|
|
51
|
+
'[style.--sds-drawer-border-color]': 'borderColor'
|
|
52
|
+
}, template: "<ng-content></ng-content>\r\n", styles: [":host{position:fixed;bottom:0;z-index:1040;display:flex;flex-direction:column;max-width:100%;background-color:#fff;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}:host(.sds-drawer-start){top:0;left:0;width:400px;border-right:1px solid var(--sds-drawer-border-color);transform:translate(-100%)}:host(.sds-drawer-end){top:0;right:0;width:400px;border-left:1px solid var(--sds-drawer-border-color);transform:translate(100%)}:host(.sds-drawer-top){top:0;right:0;left:0;height:400px;max-height:100%;border-bottom:1px solid var(--sds-drawer-border-color);transform:translateY(-100%)}:host(.sds-drawer-bottom){right:0;left:0;height:400px;max-height:100%;border-top:1px solid var(--sds-drawer-border-color);transform:translateY(100%)}:host(.show){transform:none}:host(.show).show-shadow{box-shadow:var(--bs-box-shadow)!important}\n"] }]
|
|
34
53
|
}], propDecorators: { isOpen: [{
|
|
35
54
|
type: Input
|
|
55
|
+
}], showShadow: [{
|
|
56
|
+
type: Input
|
|
57
|
+
}], backgroundColor: [{
|
|
58
|
+
type: Input
|
|
59
|
+
}], borderColor: [{
|
|
60
|
+
type: Input
|
|
61
|
+
}], transitionTimingFunction: [{
|
|
62
|
+
type: Input
|
|
63
|
+
}], transitionDuration: [{
|
|
64
|
+
type: Input
|
|
36
65
|
}], width: [{
|
|
37
66
|
type: Input
|
|
38
67
|
}], position: [{
|
|
@@ -58,5 +87,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
58
87
|
}], drawerWidth: [{
|
|
59
88
|
type: HostBinding,
|
|
60
89
|
args: ['style.width']
|
|
90
|
+
}], drawerShowShadow: [{
|
|
91
|
+
type: HostBinding,
|
|
92
|
+
args: ['class.show-shadow']
|
|
93
|
+
}], drawerBackgroundColor: [{
|
|
94
|
+
type: HostBinding,
|
|
95
|
+
args: ['style.background-color']
|
|
96
|
+
}], drawerTransitionTimingFunction: [{
|
|
97
|
+
type: HostBinding,
|
|
98
|
+
args: ['style.transition-timing-function']
|
|
99
|
+
}], drawerTransitionDuration: [{
|
|
100
|
+
type: HostBinding,
|
|
101
|
+
args: ['style.transition-duration']
|
|
61
102
|
}] } });
|
|
62
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
103
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJhd2VyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL2RyYXdlci9kcmF3ZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvZHJhd2VyL2RyYXdlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0gsU0FBUyxFQUVULFdBQVcsRUFDWCxLQUFLLEdBRVIsTUFBTSxlQUFlLENBQUM7O0FBVXZCLE1BQU0sT0FBTyxrQkFBa0I7SUFSL0I7UUFTYSxXQUFNLEdBQUcsS0FBSyxDQUFDO1FBQ2YsZUFBVSxHQUFHLElBQUksQ0FBQztRQUNsQixvQkFBZSxHQUFHLE9BQU8sQ0FBQztRQUMxQixnQkFBVyxHQUFHLG9CQUFvQixDQUFDO1FBQ25DLDZCQUF3QixHQUFHLGFBQWEsQ0FBQztRQUN6Qyx1QkFBa0IsR0FBRyxNQUFNLENBQUM7UUFFNUIsVUFBSyxHQUFHLE9BQU8sQ0FBQztRQUNoQixhQUFRLEdBQXVDLEtBQUssQ0FBQztRQUU3QixnQkFBVyxHQUFHLElBQUksQ0FBQztLQWlDdkQ7SUFoQ0csSUFBeUMsU0FBUztRQUM5QyxPQUFPLElBQUksQ0FBQyxRQUFRLEtBQUssS0FBSyxDQUFDO0lBQ25DLENBQUM7SUFDRCxJQUEyQyxXQUFXO1FBQ2xELE9BQU8sSUFBSSxDQUFDLFFBQVEsS0FBSyxPQUFPLENBQUM7SUFDckMsQ0FBQztJQUNELElBQXlDLFNBQVM7UUFDOUMsT0FBTyxJQUFJLENBQUMsUUFBUSxLQUFLLEtBQUssQ0FBQztJQUNuQyxDQUFDO0lBQ0QsSUFBNEMsWUFBWTtRQUNwRCxPQUFPLElBQUksQ0FBQyxRQUFRLEtBQUssUUFBUSxDQUFDO0lBQ3RDLENBQUM7SUFDRCxJQUErQixJQUFJO1FBQy9CLE9BQU8sSUFBSSxDQUFDLE1BQU0sQ0FBQztJQUN2QixDQUFDO0lBQ0QsSUFBZ0MsV0FBVztRQUN2QyxPQUFPLElBQUksQ0FBQyxLQUFLLENBQUM7SUFDdEIsQ0FBQztJQUNELElBQXNDLGdCQUFnQjtRQUNsRCxPQUFPLElBQUksQ0FBQyxVQUFVLENBQUM7SUFDM0IsQ0FBQztJQUNELElBQTJDLHFCQUFxQjtRQUM1RCxPQUFPLElBQUksQ0FBQyxlQUFlLENBQUM7SUFDaEMsQ0FBQztJQUNELElBQXFELDhCQUE4QjtRQUMvRSxPQUFPLElBQUksQ0FBQyx3QkFBd0IsQ0FBQztJQUN6QyxDQUFDO0lBQ0QsSUFBOEMsd0JBQXdCO1FBQ2xFLE9BQU8sSUFBSSxDQUFDLGtCQUFrQixDQUFDO0lBQ25DLENBQUM7O2dIQXpDUSxrQkFBa0I7b0dBQWxCLGtCQUFrQixtNEJDaEIvQiwrQkFDQTs0RkRlYSxrQkFBa0I7a0JBUjlCLFNBQVM7K0JBQ0ksWUFBWSxRQUdoQjt3QkFDRixtQ0FBbUMsRUFBRSxhQUFhO3FCQUNyRDs4QkFHUSxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxlQUFlO3NCQUF2QixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csd0JBQXdCO3NCQUFoQyxLQUFLO2dCQUNHLGtCQUFrQjtzQkFBMUIsS0FBSztnQkFFRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFFMkIsV0FBVztzQkFBM0MsV0FBVzt1QkFBQyxrQkFBa0I7Z0JBQ1UsU0FBUztzQkFBakQsV0FBVzt1QkFBQyxzQkFBc0I7Z0JBR1EsV0FBVztzQkFBckQsV0FBVzt1QkFBQyx3QkFBd0I7Z0JBR0ksU0FBUztzQkFBakQsV0FBVzt1QkFBQyxzQkFBc0I7Z0JBR1MsWUFBWTtzQkFBdkQsV0FBVzt1QkFBQyx5QkFBeUI7Z0JBR1AsSUFBSTtzQkFBbEMsV0FBVzt1QkFBQyxZQUFZO2dCQUdPLFdBQVc7c0JBQTFDLFdBQVc7dUJBQUMsYUFBYTtnQkFHWSxnQkFBZ0I7c0JBQXJELFdBQVc7dUJBQUMsbUJBQW1CO2dCQUdXLHFCQUFxQjtzQkFBL0QsV0FBVzt1QkFBQyx3QkFBd0I7Z0JBR2dCLDhCQUE4QjtzQkFBbEYsV0FBVzt1QkFBQyxrQ0FBa0M7Z0JBR0Qsd0JBQXdCO3NCQUFyRSxXQUFXO3VCQUFDLDJCQUEyQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XHJcbiAgICBDb21wb25lbnQsXHJcbiAgICBFdmVudEVtaXR0ZXIsXHJcbiAgICBIb3N0QmluZGluZyxcclxuICAgIElucHV0LFxyXG4gICAgT3V0cHV0LFxyXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgICBzZWxlY3RvcjogJ3Nkcy1kcmF3ZXInLFxyXG4gICAgdGVtcGxhdGVVcmw6ICcuL2RyYXdlci5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybHM6IFsnLi9kcmF3ZXIuY29tcG9uZW50LnNjc3MnXSxcclxuICAgIGhvc3Q6IHtcclxuICAgICAgICAnW3N0eWxlLi0tc2RzLWRyYXdlci1ib3JkZXItY29sb3JdJzogJ2JvcmRlckNvbG9yJ1xyXG4gICAgfVxyXG59KVxyXG5leHBvcnQgY2xhc3MgU2RzRHJhd2VyQ29tcG9uZW50IHtcclxuICAgIEBJbnB1dCgpIGlzT3BlbiA9IGZhbHNlO1xyXG4gICAgQElucHV0KCkgc2hvd1NoYWRvdyA9IHRydWU7XHJcbiAgICBASW5wdXQoKSBiYWNrZ3JvdW5kQ29sb3IgPSAnd2hpdGUnO1xyXG4gICAgQElucHV0KCkgYm9yZGVyQ29sb3IgPSAndmFyKC0tYnMtZ3JheS00MDApJztcclxuICAgIEBJbnB1dCgpIHRyYW5zaXRpb25UaW1pbmdGdW5jdGlvbiA9ICdlYXNlLWluLW91dCc7XHJcbiAgICBASW5wdXQoKSB0cmFuc2l0aW9uRHVyYXRpb24gPSAnMC4zcyc7XHJcblxyXG4gICAgQElucHV0KCkgd2lkdGggPSAnMTByZW0nO1xyXG4gICAgQElucHV0KCkgcG9zaXRpb246ICdzdGFydCcgfCAnZW5kJyB8ICd0b3AnIHwgJ2JvdHRvbScgPSAnZW5kJztcclxuXHJcbiAgICBASG9zdEJpbmRpbmcoJ2NsYXNzLnNkcy1kcmF3ZXInKSBkcmF3ZXJDbGFzcyA9IHRydWU7XHJcbiAgICBASG9zdEJpbmRpbmcoJ2NsYXNzLnNkcy1kcmF3ZXItZW5kJykgZ2V0IGRyYXdlckVuZCgpIHtcclxuICAgICAgICByZXR1cm4gdGhpcy5wb3NpdGlvbiA9PT0gJ2VuZCc7XHJcbiAgICB9XHJcbiAgICBASG9zdEJpbmRpbmcoJ2NsYXNzLnNkcy1kcmF3ZXItc3RhcnQnKSBnZXQgZHJhd2VyU3RhcnQoKSB7XHJcbiAgICAgICAgcmV0dXJuIHRoaXMucG9zaXRpb24gPT09ICdzdGFydCc7XHJcbiAgICB9XHJcbiAgICBASG9zdEJpbmRpbmcoJ2NsYXNzLnNkcy1kcmF3ZXItdG9wJykgZ2V0IGRyYXdlclRvcCgpIHtcclxuICAgICAgICByZXR1cm4gdGhpcy5wb3NpdGlvbiA9PT0gJ3RvcCc7XHJcbiAgICB9XHJcbiAgICBASG9zdEJpbmRpbmcoJ2NsYXNzLnNkcy1kcmF3ZXItYm90dG9tJykgZ2V0IGRyYXdlckJvdHRvbSgpIHtcclxuICAgICAgICByZXR1cm4gdGhpcy5wb3NpdGlvbiA9PT0gJ2JvdHRvbSc7XHJcbiAgICB9XHJcbiAgICBASG9zdEJpbmRpbmcoJ2NsYXNzLnNob3cnKSBnZXQgc2hvdygpIHtcclxuICAgICAgICByZXR1cm4gdGhpcy5pc09wZW47XHJcbiAgICB9XHJcbiAgICBASG9zdEJpbmRpbmcoJ3N0eWxlLndpZHRoJykgZ2V0IGRyYXdlcldpZHRoKCkge1xyXG4gICAgICAgIHJldHVybiB0aGlzLndpZHRoO1xyXG4gICAgfVxyXG4gICAgQEhvc3RCaW5kaW5nKCdjbGFzcy5zaG93LXNoYWRvdycpIGdldCBkcmF3ZXJTaG93U2hhZG93KCkge1xyXG4gICAgICAgIHJldHVybiB0aGlzLnNob3dTaGFkb3c7XHJcbiAgICB9XHJcbiAgICBASG9zdEJpbmRpbmcoJ3N0eWxlLmJhY2tncm91bmQtY29sb3InKSBnZXQgZHJhd2VyQmFja2dyb3VuZENvbG9yKCkge1xyXG4gICAgICAgIHJldHVybiB0aGlzLmJhY2tncm91bmRDb2xvcjtcclxuICAgIH1cclxuICAgIEBIb3N0QmluZGluZygnc3R5bGUudHJhbnNpdGlvbi10aW1pbmctZnVuY3Rpb24nKSBnZXQgZHJhd2VyVHJhbnNpdGlvblRpbWluZ0Z1bmN0aW9uKCkge1xyXG4gICAgICAgIHJldHVybiB0aGlzLnRyYW5zaXRpb25UaW1pbmdGdW5jdGlvbjtcclxuICAgIH1cclxuICAgIEBIb3N0QmluZGluZygnc3R5bGUudHJhbnNpdGlvbi1kdXJhdGlvbicpIGdldCBkcmF3ZXJUcmFuc2l0aW9uRHVyYXRpb24oKSB7XHJcbiAgICAgICAgcmV0dXJuIHRoaXMudHJhbnNpdGlvbkR1cmF0aW9uO1xyXG4gICAgfVxyXG5cclxuXHJcbn1cclxuIiwiPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxyXG4iXX0=
|
|
@@ -5,6 +5,11 @@ import { CommonModule } from '@angular/common';
|
|
|
5
5
|
class SdsDrawerComponent {
|
|
6
6
|
constructor() {
|
|
7
7
|
this.isOpen = false;
|
|
8
|
+
this.showShadow = true;
|
|
9
|
+
this.backgroundColor = 'white';
|
|
10
|
+
this.borderColor = 'var(--bs-gray-400)';
|
|
11
|
+
this.transitionTimingFunction = 'ease-in-out';
|
|
12
|
+
this.transitionDuration = '0.3s';
|
|
8
13
|
this.width = '10rem';
|
|
9
14
|
this.position = 'end';
|
|
10
15
|
this.drawerClass = true;
|
|
@@ -27,14 +32,38 @@ class SdsDrawerComponent {
|
|
|
27
32
|
get drawerWidth() {
|
|
28
33
|
return this.width;
|
|
29
34
|
}
|
|
35
|
+
get drawerShowShadow() {
|
|
36
|
+
return this.showShadow;
|
|
37
|
+
}
|
|
38
|
+
get drawerBackgroundColor() {
|
|
39
|
+
return this.backgroundColor;
|
|
40
|
+
}
|
|
41
|
+
get drawerTransitionTimingFunction() {
|
|
42
|
+
return this.transitionTimingFunction;
|
|
43
|
+
}
|
|
44
|
+
get drawerTransitionDuration() {
|
|
45
|
+
return this.transitionDuration;
|
|
46
|
+
}
|
|
30
47
|
}
|
|
31
48
|
SdsDrawerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
32
|
-
SdsDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsDrawerComponent, selector: "sds-drawer", inputs: { isOpen: "isOpen", width: "width", position: "position" }, host: { properties: { "class.sds-drawer": "this.drawerClass", "class.sds-drawer-end": "this.drawerEnd", "class.sds-drawer-start": "this.drawerStart", "class.sds-drawer-top": "this.drawerTop", "class.sds-drawer-bottom": "this.drawerBottom", "class.show": "this.show", "style.width": "this.drawerWidth" } }, ngImport: i0, template: "<ng-content></ng-content>\r\n", styles: [":host{position:fixed;bottom:0;z-index:1040;display:flex;flex-direction:column;max-width:100%;background-color:#fff;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}:host(.sds-drawer-start){top:0;left:0;width:400px;border-right:1px solid var(--
|
|
49
|
+
SdsDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsDrawerComponent, selector: "sds-drawer", inputs: { isOpen: "isOpen", showShadow: "showShadow", backgroundColor: "backgroundColor", borderColor: "borderColor", transitionTimingFunction: "transitionTimingFunction", transitionDuration: "transitionDuration", width: "width", position: "position" }, host: { properties: { "style.--sds-drawer-border-color": "borderColor", "class.sds-drawer": "this.drawerClass", "class.sds-drawer-end": "this.drawerEnd", "class.sds-drawer-start": "this.drawerStart", "class.sds-drawer-top": "this.drawerTop", "class.sds-drawer-bottom": "this.drawerBottom", "class.show": "this.show", "style.width": "this.drawerWidth", "class.show-shadow": "this.drawerShowShadow", "style.background-color": "this.drawerBackgroundColor", "style.transition-timing-function": "this.drawerTransitionTimingFunction", "style.transition-duration": "this.drawerTransitionDuration" } }, ngImport: i0, template: "<ng-content></ng-content>\r\n", styles: [":host{position:fixed;bottom:0;z-index:1040;display:flex;flex-direction:column;max-width:100%;background-color:#fff;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}:host(.sds-drawer-start){top:0;left:0;width:400px;border-right:1px solid var(--sds-drawer-border-color);transform:translate(-100%)}:host(.sds-drawer-end){top:0;right:0;width:400px;border-left:1px solid var(--sds-drawer-border-color);transform:translate(100%)}:host(.sds-drawer-top){top:0;right:0;left:0;height:400px;max-height:100%;border-bottom:1px solid var(--sds-drawer-border-color);transform:translateY(-100%)}:host(.sds-drawer-bottom){right:0;left:0;height:400px;max-height:100%;border-top:1px solid var(--sds-drawer-border-color);transform:translateY(100%)}:host(.show){transform:none}:host(.show).show-shadow{box-shadow:var(--bs-box-shadow)!important}\n"] });
|
|
33
50
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsDrawerComponent, decorators: [{
|
|
34
51
|
type: Component,
|
|
35
|
-
args: [{ selector: 'sds-drawer',
|
|
52
|
+
args: [{ selector: 'sds-drawer', host: {
|
|
53
|
+
'[style.--sds-drawer-border-color]': 'borderColor'
|
|
54
|
+
}, template: "<ng-content></ng-content>\r\n", styles: [":host{position:fixed;bottom:0;z-index:1040;display:flex;flex-direction:column;max-width:100%;background-color:#fff;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}:host(.sds-drawer-start){top:0;left:0;width:400px;border-right:1px solid var(--sds-drawer-border-color);transform:translate(-100%)}:host(.sds-drawer-end){top:0;right:0;width:400px;border-left:1px solid var(--sds-drawer-border-color);transform:translate(100%)}:host(.sds-drawer-top){top:0;right:0;left:0;height:400px;max-height:100%;border-bottom:1px solid var(--sds-drawer-border-color);transform:translateY(-100%)}:host(.sds-drawer-bottom){right:0;left:0;height:400px;max-height:100%;border-top:1px solid var(--sds-drawer-border-color);transform:translateY(100%)}:host(.show){transform:none}:host(.show).show-shadow{box-shadow:var(--bs-box-shadow)!important}\n"] }]
|
|
36
55
|
}], propDecorators: { isOpen: [{
|
|
37
56
|
type: Input
|
|
57
|
+
}], showShadow: [{
|
|
58
|
+
type: Input
|
|
59
|
+
}], backgroundColor: [{
|
|
60
|
+
type: Input
|
|
61
|
+
}], borderColor: [{
|
|
62
|
+
type: Input
|
|
63
|
+
}], transitionTimingFunction: [{
|
|
64
|
+
type: Input
|
|
65
|
+
}], transitionDuration: [{
|
|
66
|
+
type: Input
|
|
38
67
|
}], width: [{
|
|
39
68
|
type: Input
|
|
40
69
|
}], position: [{
|
|
@@ -60,6 +89,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
60
89
|
}], drawerWidth: [{
|
|
61
90
|
type: HostBinding,
|
|
62
91
|
args: ['style.width']
|
|
92
|
+
}], drawerShowShadow: [{
|
|
93
|
+
type: HostBinding,
|
|
94
|
+
args: ['class.show-shadow']
|
|
95
|
+
}], drawerBackgroundColor: [{
|
|
96
|
+
type: HostBinding,
|
|
97
|
+
args: ['style.background-color']
|
|
98
|
+
}], drawerTransitionTimingFunction: [{
|
|
99
|
+
type: HostBinding,
|
|
100
|
+
args: ['style.transition-timing-function']
|
|
101
|
+
}], drawerTransitionDuration: [{
|
|
102
|
+
type: HostBinding,
|
|
103
|
+
args: ['style.transition-duration']
|
|
63
104
|
}] } });
|
|
64
105
|
|
|
65
106
|
class SdsDrawerModule {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-drawer.mjs","sources":["../../../projects/ngx-sds-components/src/lib/drawer/drawer.component.ts","../../../projects/ngx-sds-components/src/lib/drawer/drawer.component.html","../../../projects/ngx-sds-components/src/lib/drawer/drawer.module.ts","../../../projects/ngx-sds-components/src/lib/drawer/spicainternational-ngx-sds-components-src-lib-drawer.ts"],"sourcesContent":["import {\r\n Component,\r\n EventEmitter,\r\n HostBinding,\r\n Input,\r\n Output,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sds-drawer',\r\n templateUrl: './drawer.component.html',\r\n styleUrls: ['./drawer.component.scss'],\r\n})\r\nexport class SdsDrawerComponent {\r\n @Input() isOpen = false;\r\n\r\n @Input() width = '10rem';\r\n @Input() position: 'start' | 'end' | 'top' | 'bottom' = 'end';\r\n\r\n @HostBinding('class.sds-drawer') drawerClass = true;\r\n @HostBinding('class.sds-drawer-end') get drawerEnd() {\r\n return this.position === 'end';\r\n }\r\n @HostBinding('class.sds-drawer-start') get drawerStart() {\r\n return this.position === 'start';\r\n }\r\n @HostBinding('class.sds-drawer-top') get drawerTop() {\r\n return this.position === 'top';\r\n }\r\n @HostBinding('class.sds-drawer-bottom') get drawerBottom() {\r\n return this.position === 'bottom';\r\n }\r\n @HostBinding('class.show') get show() {\r\n return this.isOpen;\r\n }\r\n @HostBinding('style.width') get drawerWidth() {\r\n return this.width;\r\n }\r\n}\r\n","<ng-content></ng-content>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsDrawerComponent } from './drawer.component';\r\n\r\n@NgModule({\r\n declarations: [SdsDrawerComponent],\r\n imports: [CommonModule],\r\n exports: [SdsDrawerComponent],\r\n})\r\nexport class SdsDrawerModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-drawer.mjs","sources":["../../../projects/ngx-sds-components/src/lib/drawer/drawer.component.ts","../../../projects/ngx-sds-components/src/lib/drawer/drawer.component.html","../../../projects/ngx-sds-components/src/lib/drawer/drawer.module.ts","../../../projects/ngx-sds-components/src/lib/drawer/spicainternational-ngx-sds-components-src-lib-drawer.ts"],"sourcesContent":["import {\r\n Component,\r\n EventEmitter,\r\n HostBinding,\r\n Input,\r\n Output,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sds-drawer',\r\n templateUrl: './drawer.component.html',\r\n styleUrls: ['./drawer.component.scss'],\r\n host: {\r\n '[style.--sds-drawer-border-color]': 'borderColor'\r\n }\r\n})\r\nexport class SdsDrawerComponent {\r\n @Input() isOpen = false;\r\n @Input() showShadow = true;\r\n @Input() backgroundColor = 'white';\r\n @Input() borderColor = 'var(--bs-gray-400)';\r\n @Input() transitionTimingFunction = 'ease-in-out';\r\n @Input() transitionDuration = '0.3s';\r\n\r\n @Input() width = '10rem';\r\n @Input() position: 'start' | 'end' | 'top' | 'bottom' = 'end';\r\n\r\n @HostBinding('class.sds-drawer') drawerClass = true;\r\n @HostBinding('class.sds-drawer-end') get drawerEnd() {\r\n return this.position === 'end';\r\n }\r\n @HostBinding('class.sds-drawer-start') get drawerStart() {\r\n return this.position === 'start';\r\n }\r\n @HostBinding('class.sds-drawer-top') get drawerTop() {\r\n return this.position === 'top';\r\n }\r\n @HostBinding('class.sds-drawer-bottom') get drawerBottom() {\r\n return this.position === 'bottom';\r\n }\r\n @HostBinding('class.show') get show() {\r\n return this.isOpen;\r\n }\r\n @HostBinding('style.width') get drawerWidth() {\r\n return this.width;\r\n }\r\n @HostBinding('class.show-shadow') get drawerShowShadow() {\r\n return this.showShadow;\r\n }\r\n @HostBinding('style.background-color') get drawerBackgroundColor() {\r\n return this.backgroundColor;\r\n }\r\n @HostBinding('style.transition-timing-function') get drawerTransitionTimingFunction() {\r\n return this.transitionTimingFunction;\r\n }\r\n @HostBinding('style.transition-duration') get drawerTransitionDuration() {\r\n return this.transitionDuration;\r\n }\r\n\r\n\r\n}\r\n","<ng-content></ng-content>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsDrawerComponent } from './drawer.component';\r\n\r\n@NgModule({\r\n declarations: [SdsDrawerComponent],\r\n imports: [CommonModule],\r\n exports: [SdsDrawerComponent],\r\n})\r\nexport class SdsDrawerModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -5,6 +5,11 @@ import { CommonModule } from '@angular/common';
|
|
|
5
5
|
class SdsDrawerComponent {
|
|
6
6
|
constructor() {
|
|
7
7
|
this.isOpen = false;
|
|
8
|
+
this.showShadow = true;
|
|
9
|
+
this.backgroundColor = 'white';
|
|
10
|
+
this.borderColor = 'var(--bs-gray-400)';
|
|
11
|
+
this.transitionTimingFunction = 'ease-in-out';
|
|
12
|
+
this.transitionDuration = '0.3s';
|
|
8
13
|
this.width = '10rem';
|
|
9
14
|
this.position = 'end';
|
|
10
15
|
this.drawerClass = true;
|
|
@@ -27,14 +32,38 @@ class SdsDrawerComponent {
|
|
|
27
32
|
get drawerWidth() {
|
|
28
33
|
return this.width;
|
|
29
34
|
}
|
|
35
|
+
get drawerShowShadow() {
|
|
36
|
+
return this.showShadow;
|
|
37
|
+
}
|
|
38
|
+
get drawerBackgroundColor() {
|
|
39
|
+
return this.backgroundColor;
|
|
40
|
+
}
|
|
41
|
+
get drawerTransitionTimingFunction() {
|
|
42
|
+
return this.transitionTimingFunction;
|
|
43
|
+
}
|
|
44
|
+
get drawerTransitionDuration() {
|
|
45
|
+
return this.transitionDuration;
|
|
46
|
+
}
|
|
30
47
|
}
|
|
31
48
|
SdsDrawerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
32
|
-
SdsDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsDrawerComponent, selector: "sds-drawer", inputs: { isOpen: "isOpen", width: "width", position: "position" }, host: { properties: { "class.sds-drawer": "this.drawerClass", "class.sds-drawer-end": "this.drawerEnd", "class.sds-drawer-start": "this.drawerStart", "class.sds-drawer-top": "this.drawerTop", "class.sds-drawer-bottom": "this.drawerBottom", "class.show": "this.show", "style.width": "this.drawerWidth" } }, ngImport: i0, template: "<ng-content></ng-content>\r\n", styles: [":host{position:fixed;bottom:0;z-index:1040;display:flex;flex-direction:column;max-width:100%;background-color:#fff;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}:host(.sds-drawer-start){top:0;left:0;width:400px;border-right:1px solid var(--
|
|
49
|
+
SdsDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsDrawerComponent, selector: "sds-drawer", inputs: { isOpen: "isOpen", showShadow: "showShadow", backgroundColor: "backgroundColor", borderColor: "borderColor", transitionTimingFunction: "transitionTimingFunction", transitionDuration: "transitionDuration", width: "width", position: "position" }, host: { properties: { "style.--sds-drawer-border-color": "borderColor", "class.sds-drawer": "this.drawerClass", "class.sds-drawer-end": "this.drawerEnd", "class.sds-drawer-start": "this.drawerStart", "class.sds-drawer-top": "this.drawerTop", "class.sds-drawer-bottom": "this.drawerBottom", "class.show": "this.show", "style.width": "this.drawerWidth", "class.show-shadow": "this.drawerShowShadow", "style.background-color": "this.drawerBackgroundColor", "style.transition-timing-function": "this.drawerTransitionTimingFunction", "style.transition-duration": "this.drawerTransitionDuration" } }, ngImport: i0, template: "<ng-content></ng-content>\r\n", styles: [":host{position:fixed;bottom:0;z-index:1040;display:flex;flex-direction:column;max-width:100%;background-color:#fff;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}:host(.sds-drawer-start){top:0;left:0;width:400px;border-right:1px solid var(--sds-drawer-border-color);transform:translate(-100%)}:host(.sds-drawer-end){top:0;right:0;width:400px;border-left:1px solid var(--sds-drawer-border-color);transform:translate(100%)}:host(.sds-drawer-top){top:0;right:0;left:0;height:400px;max-height:100%;border-bottom:1px solid var(--sds-drawer-border-color);transform:translateY(-100%)}:host(.sds-drawer-bottom){right:0;left:0;height:400px;max-height:100%;border-top:1px solid var(--sds-drawer-border-color);transform:translateY(100%)}:host(.show){transform:none}:host(.show).show-shadow{box-shadow:var(--bs-box-shadow)!important}\n"] });
|
|
33
50
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsDrawerComponent, decorators: [{
|
|
34
51
|
type: Component,
|
|
35
|
-
args: [{ selector: 'sds-drawer',
|
|
52
|
+
args: [{ selector: 'sds-drawer', host: {
|
|
53
|
+
'[style.--sds-drawer-border-color]': 'borderColor'
|
|
54
|
+
}, template: "<ng-content></ng-content>\r\n", styles: [":host{position:fixed;bottom:0;z-index:1040;display:flex;flex-direction:column;max-width:100%;background-color:#fff;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}:host(.sds-drawer-start){top:0;left:0;width:400px;border-right:1px solid var(--sds-drawer-border-color);transform:translate(-100%)}:host(.sds-drawer-end){top:0;right:0;width:400px;border-left:1px solid var(--sds-drawer-border-color);transform:translate(100%)}:host(.sds-drawer-top){top:0;right:0;left:0;height:400px;max-height:100%;border-bottom:1px solid var(--sds-drawer-border-color);transform:translateY(-100%)}:host(.sds-drawer-bottom){right:0;left:0;height:400px;max-height:100%;border-top:1px solid var(--sds-drawer-border-color);transform:translateY(100%)}:host(.show){transform:none}:host(.show).show-shadow{box-shadow:var(--bs-box-shadow)!important}\n"] }]
|
|
36
55
|
}], propDecorators: { isOpen: [{
|
|
37
56
|
type: Input
|
|
57
|
+
}], showShadow: [{
|
|
58
|
+
type: Input
|
|
59
|
+
}], backgroundColor: [{
|
|
60
|
+
type: Input
|
|
61
|
+
}], borderColor: [{
|
|
62
|
+
type: Input
|
|
63
|
+
}], transitionTimingFunction: [{
|
|
64
|
+
type: Input
|
|
65
|
+
}], transitionDuration: [{
|
|
66
|
+
type: Input
|
|
38
67
|
}], width: [{
|
|
39
68
|
type: Input
|
|
40
69
|
}], position: [{
|
|
@@ -60,6 +89,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
60
89
|
}], drawerWidth: [{
|
|
61
90
|
type: HostBinding,
|
|
62
91
|
args: ['style.width']
|
|
92
|
+
}], drawerShowShadow: [{
|
|
93
|
+
type: HostBinding,
|
|
94
|
+
args: ['class.show-shadow']
|
|
95
|
+
}], drawerBackgroundColor: [{
|
|
96
|
+
type: HostBinding,
|
|
97
|
+
args: ['style.background-color']
|
|
98
|
+
}], drawerTransitionTimingFunction: [{
|
|
99
|
+
type: HostBinding,
|
|
100
|
+
args: ['style.transition-timing-function']
|
|
101
|
+
}], drawerTransitionDuration: [{
|
|
102
|
+
type: HostBinding,
|
|
103
|
+
args: ['style.transition-duration']
|
|
63
104
|
}] } });
|
|
64
105
|
|
|
65
106
|
class SdsDrawerModule {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-drawer.mjs","sources":["../../../projects/ngx-sds-components/src/lib/drawer/drawer.component.ts","../../../projects/ngx-sds-components/src/lib/drawer/drawer.component.html","../../../projects/ngx-sds-components/src/lib/drawer/drawer.module.ts","../../../projects/ngx-sds-components/src/lib/drawer/spicainternational-ngx-sds-components-src-lib-drawer.ts"],"sourcesContent":["import {\r\n Component,\r\n EventEmitter,\r\n HostBinding,\r\n Input,\r\n Output,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sds-drawer',\r\n templateUrl: './drawer.component.html',\r\n styleUrls: ['./drawer.component.scss'],\r\n})\r\nexport class SdsDrawerComponent {\r\n @Input() isOpen = false;\r\n\r\n @Input() width = '10rem';\r\n @Input() position: 'start' | 'end' | 'top' | 'bottom' = 'end';\r\n\r\n @HostBinding('class.sds-drawer') drawerClass = true;\r\n @HostBinding('class.sds-drawer-end') get drawerEnd() {\r\n return this.position === 'end';\r\n }\r\n @HostBinding('class.sds-drawer-start') get drawerStart() {\r\n return this.position === 'start';\r\n }\r\n @HostBinding('class.sds-drawer-top') get drawerTop() {\r\n return this.position === 'top';\r\n }\r\n @HostBinding('class.sds-drawer-bottom') get drawerBottom() {\r\n return this.position === 'bottom';\r\n }\r\n @HostBinding('class.show') get show() {\r\n return this.isOpen;\r\n }\r\n @HostBinding('style.width') get drawerWidth() {\r\n return this.width;\r\n }\r\n}\r\n","<ng-content></ng-content>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsDrawerComponent } from './drawer.component';\r\n\r\n@NgModule({\r\n declarations: [SdsDrawerComponent],\r\n imports: [CommonModule],\r\n exports: [SdsDrawerComponent],\r\n})\r\nexport class SdsDrawerModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-drawer.mjs","sources":["../../../projects/ngx-sds-components/src/lib/drawer/drawer.component.ts","../../../projects/ngx-sds-components/src/lib/drawer/drawer.component.html","../../../projects/ngx-sds-components/src/lib/drawer/drawer.module.ts","../../../projects/ngx-sds-components/src/lib/drawer/spicainternational-ngx-sds-components-src-lib-drawer.ts"],"sourcesContent":["import {\r\n Component,\r\n EventEmitter,\r\n HostBinding,\r\n Input,\r\n Output,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sds-drawer',\r\n templateUrl: './drawer.component.html',\r\n styleUrls: ['./drawer.component.scss'],\r\n host: {\r\n '[style.--sds-drawer-border-color]': 'borderColor'\r\n }\r\n})\r\nexport class SdsDrawerComponent {\r\n @Input() isOpen = false;\r\n @Input() showShadow = true;\r\n @Input() backgroundColor = 'white';\r\n @Input() borderColor = 'var(--bs-gray-400)';\r\n @Input() transitionTimingFunction = 'ease-in-out';\r\n @Input() transitionDuration = '0.3s';\r\n\r\n @Input() width = '10rem';\r\n @Input() position: 'start' | 'end' | 'top' | 'bottom' = 'end';\r\n\r\n @HostBinding('class.sds-drawer') drawerClass = true;\r\n @HostBinding('class.sds-drawer-end') get drawerEnd() {\r\n return this.position === 'end';\r\n }\r\n @HostBinding('class.sds-drawer-start') get drawerStart() {\r\n return this.position === 'start';\r\n }\r\n @HostBinding('class.sds-drawer-top') get drawerTop() {\r\n return this.position === 'top';\r\n }\r\n @HostBinding('class.sds-drawer-bottom') get drawerBottom() {\r\n return this.position === 'bottom';\r\n }\r\n @HostBinding('class.show') get show() {\r\n return this.isOpen;\r\n }\r\n @HostBinding('style.width') get drawerWidth() {\r\n return this.width;\r\n }\r\n @HostBinding('class.show-shadow') get drawerShowShadow() {\r\n return this.showShadow;\r\n }\r\n @HostBinding('style.background-color') get drawerBackgroundColor() {\r\n return this.backgroundColor;\r\n }\r\n @HostBinding('style.transition-timing-function') get drawerTransitionTimingFunction() {\r\n return this.transitionTimingFunction;\r\n }\r\n @HostBinding('style.transition-duration') get drawerTransitionDuration() {\r\n return this.transitionDuration;\r\n }\r\n\r\n\r\n}\r\n","<ng-content></ng-content>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsDrawerComponent } from './drawer.component';\r\n\r\n@NgModule({\r\n declarations: [SdsDrawerComponent],\r\n imports: [CommonModule],\r\n exports: [SdsDrawerComponent],\r\n})\r\nexport class SdsDrawerModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
import * as i0 from "@angular/core";
|
|
2
2
|
export declare class SdsDrawerComponent {
|
|
3
3
|
isOpen: boolean;
|
|
4
|
+
showShadow: boolean;
|
|
5
|
+
backgroundColor: string;
|
|
6
|
+
borderColor: string;
|
|
7
|
+
transitionTimingFunction: string;
|
|
8
|
+
transitionDuration: string;
|
|
4
9
|
width: string;
|
|
5
10
|
position: 'start' | 'end' | 'top' | 'bottom';
|
|
6
11
|
drawerClass: boolean;
|
|
@@ -10,6 +15,10 @@ export declare class SdsDrawerComponent {
|
|
|
10
15
|
get drawerBottom(): boolean;
|
|
11
16
|
get show(): boolean;
|
|
12
17
|
get drawerWidth(): string;
|
|
18
|
+
get drawerShowShadow(): boolean;
|
|
19
|
+
get drawerBackgroundColor(): string;
|
|
20
|
+
get drawerTransitionTimingFunction(): string;
|
|
21
|
+
get drawerTransitionDuration(): string;
|
|
13
22
|
static ɵfac: i0.ɵɵFactoryDeclaration<SdsDrawerComponent, never>;
|
|
14
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SdsDrawerComponent, "sds-drawer", never, { "isOpen": "isOpen"; "width": "width"; "position": "position"; }, {}, never, ["*"], false, never>;
|
|
23
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SdsDrawerComponent, "sds-drawer", never, { "isOpen": "isOpen"; "showShadow": "showShadow"; "backgroundColor": "backgroundColor"; "borderColor": "borderColor"; "transitionTimingFunction": "transitionTimingFunction"; "transitionDuration": "transitionDuration"; "width": "width"; "position": "position"; }, {}, never, ["*"], false, never>;
|
|
15
24
|
}
|