@ng-vagabond-lab/ng-dsv 0.0.5 → 0.0.6
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/ds/container/component/container.component.d.ts +7 -0
- package/ds/container/index.d.ts +5 -0
- package/ds/container/public-api.d.ts +1 -0
- package/ds/header/component/header.component.d.ts +15 -0
- package/ds/header/index.d.ts +5 -0
- package/ds/header/public-api.d.ts +1 -0
- package/ds/item/component/item.component.d.ts +12 -0
- package/ds/item/index.d.ts +5 -0
- package/ds/item/public-api.d.ts +1 -0
- package/ds/menu/component/button/menu.button.component.d.ts +9 -0
- package/ds/menu/component/menu.component.d.ts +13 -0
- package/ds/menu/index.d.ts +5 -0
- package/ds/menu/public-api.d.ts +3 -0
- package/ds/menu/service/menu.service.d.ts +8 -0
- package/ds/theme/component/switch/dsv.theme.switch.component.d.ts +14 -0
- package/ds/theme/public-api.d.ts +2 -0
- package/ds/theme/service/dsv.theme.service.d.ts +10 -0
- package/ds/toast/component/toast.component.d.ts +2 -2
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-button.mjs +2 -2
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-button.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-container.mjs +26 -0
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-container.mjs.map +1 -0
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-header.mjs +44 -0
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-header.mjs.map +1 -0
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-item.mjs +37 -0
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-item.mjs.map +1 -0
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-menu.mjs +87 -0
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-menu.mjs.map +1 -0
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-theme.mjs +53 -7
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-theme.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-toast.mjs +8 -7
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-toast.mjs.map +1 -1
- package/package.json +20 -4
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
export declare class DsvContainerComponent {
|
|
3
|
+
column: boolean;
|
|
4
|
+
ngOnInit(): void;
|
|
5
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<DsvContainerComponent, never>;
|
|
6
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DsvContainerComponent, "dsv-container", never, { "column": { "alias": "column"; "required": false; }; }, {}, never, ["*"], true, never>;
|
|
7
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './component/container.component';
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { Router } from '@angular/router';
|
|
2
|
+
import { MenuService } from '@ng-vagabond-lab/ng-dsv/ds/menu';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
export declare class DsvHeaderComponent {
|
|
5
|
+
private router;
|
|
6
|
+
private menuService;
|
|
7
|
+
img: string;
|
|
8
|
+
title: string;
|
|
9
|
+
withMenu: boolean;
|
|
10
|
+
constructor(router: Router, menuService: MenuService);
|
|
11
|
+
doToogleMenu(): void;
|
|
12
|
+
goToHome(): void;
|
|
13
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<DsvHeaderComponent, never>;
|
|
14
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DsvHeaderComponent, "dsv-header", never, { "img": { "alias": "img"; "required": false; }; "title": { "alias": "title"; "required": false; }; "withMenu": { "alias": "withMenu"; "required": false; }; }, {}, never, ["*"], true, never>;
|
|
15
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './component/header.component';
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { Router } from '@angular/router';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class DsvItemComponent {
|
|
4
|
+
private router;
|
|
5
|
+
icon: string;
|
|
6
|
+
text: string;
|
|
7
|
+
url: string;
|
|
8
|
+
constructor(router: Router);
|
|
9
|
+
doClick(): void;
|
|
10
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<DsvItemComponent, never>;
|
|
11
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DsvItemComponent, "dsv-item", never, { "icon": { "alias": "icon"; "required": false; }; "text": { "alias": "text"; "required": false; }; "url": { "alias": "url"; "required": false; }; }, {}, never, ["*"], true, never>;
|
|
12
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './component/item.component';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { MenuService } from '../../public-api';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class DsvMenuButtonComponent {
|
|
4
|
+
private menuService;
|
|
5
|
+
constructor(menuService: MenuService);
|
|
6
|
+
doToogleMenu(): void;
|
|
7
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<DsvMenuButtonComponent, never>;
|
|
8
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DsvMenuButtonComponent, "dsv-menu-button", never, {}, {}, never, never, true, never>;
|
|
9
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ElementRef, OnInit } from '@angular/core';
|
|
2
|
+
import { MenuService } from '../public-api';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
export declare class DsvMenuComponent implements OnInit {
|
|
5
|
+
private menuService;
|
|
6
|
+
private elementRef;
|
|
7
|
+
showFooter: boolean;
|
|
8
|
+
constructor(menuService: MenuService, elementRef: ElementRef);
|
|
9
|
+
ngOnInit(): void;
|
|
10
|
+
onClickOutside(event: Event): void;
|
|
11
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<DsvMenuComponent, never>;
|
|
12
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DsvMenuComponent, "dsv-menu", never, { "showFooter": { "alias": "showFooter"; "required": false; }; }, {}, never, ["*"], true, never>;
|
|
13
|
+
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { WritableSignal } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class MenuService {
|
|
4
|
+
isMenuOpen: WritableSignal<boolean>;
|
|
5
|
+
toogleMenu(): void;
|
|
6
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<MenuService, never>;
|
|
7
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<MenuService>;
|
|
8
|
+
}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { ThemeService } from '../../public-api';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export type Theme = {
|
|
4
|
+
primary: string;
|
|
5
|
+
text: string;
|
|
6
|
+
};
|
|
7
|
+
export declare class DsvThemeSwitchComponent {
|
|
8
|
+
private themeService;
|
|
9
|
+
constructor(themeService: ThemeService);
|
|
10
|
+
switchTheme(): void;
|
|
11
|
+
isLightMode(): boolean;
|
|
12
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<DsvThemeSwitchComponent, never>;
|
|
13
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DsvThemeSwitchComponent, "dsv-theme-switch", never, {}, {}, never, never, true, never>;
|
|
14
|
+
}
|
package/ds/theme/public-api.d.ts
CHANGED
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { WritableSignal } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export type ThemeMode = 'dark' | 'light';
|
|
4
|
+
export declare class ThemeService {
|
|
5
|
+
themeMode: WritableSignal<ThemeMode>;
|
|
6
|
+
constructor();
|
|
7
|
+
switchTheme(): void;
|
|
8
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ThemeService, never>;
|
|
9
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<ThemeService>;
|
|
10
|
+
}
|
|
@@ -5,8 +5,8 @@ export type Theme = {
|
|
|
5
5
|
text: string;
|
|
6
6
|
};
|
|
7
7
|
export declare class DsvToastComponent {
|
|
8
|
-
toastService: ToastService;
|
|
9
|
-
constructor();
|
|
8
|
+
protected toastService: ToastService;
|
|
9
|
+
constructor(toastService: ToastService);
|
|
10
10
|
ngOnInit(): void;
|
|
11
11
|
static ɵfac: i0.ɵɵFactoryDeclaration<DsvToastComponent, never>;
|
|
12
12
|
static ɵcmp: i0.ɵɵComponentDeclaration<DsvToastComponent, "dsv-toast", never, {}, {}, never, never, true, never>;
|
|
@@ -20,11 +20,11 @@ class DsvButtonComponent {
|
|
|
20
20
|
!this.disabled && this.callback.emit();
|
|
21
21
|
}
|
|
22
22
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
23
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvButtonComponent, isStandalone: true, selector: "dsv-button", inputs: { libelle: "libelle", color: "color", icon: "icon", iconEnd: "iconEnd", width: "width", variant: "variant", fullwidth: "fullwidth", show: "show", disabled: "disabled" }, outputs: { callback: "callback" }, ngImport: i0, template: "<button\n class=\"dsv-button\"\n (click)=\"doClick($event)\"\n [ngClass]=\"\n (icon ? 'icon' : '') +\n ' ' +\n color +\n ' ' +\n width +\n ' ' +\n variant +\n ' ' +\n (fullwidth ? 'fullwidth' : '')\n \"\n [disabled]=\"disabled\"\n *ngIf=\"show\"\n>\n <i [class]=\"icon\" *ngIf=\"icon\"></i>\n <span *ngIf=\"libelle\">\n {{ libelle }}\n </span>\n <ng-content></ng-content>\n <i [class]=\"iconEnd\" *ngIf=\"iconEnd\"></i>\n</button>\n", styles: ["button.dsv-button{display:inline-flex;flex-direction:row;gap:5px;align-items:center;justify-content:center;position:relative;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:middle;font-weight:500;letter-spacing:.02857em;text-transform:uppercase;color:#fff!important;outline:0px;margin:0;text-decoration:none;border-width:0px;border-radius:4px;transition:background-color .25s cubic-bezier(.4,0,.2,1),box-shadow .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1);padding:6px;font-size:1rem;min-width:10px;line-height:1;color:var(--text)}button.dsv-button.small,button.dsv-button.small>i{font-size:.8rem!important}button.dsv-button.medium,button.dsv-button.medium>i{font-size:1rem!important}button.dsv-button.large,button.dsv-button.large>i{font-size:1.5rem!important}button.dsv-button.fullwidth{width:100%}button.dsv-button.text,button.dsv-button.outlined{background-color:transparent;box-shadow:none}button.dsv-button.text.primary,button.dsv-button.outlined.primary{color:var(--primary)}button.dsv-button.text.success,button.dsv-button.outlined.success{color:var(--success)}button.dsv-button.text.info,button.dsv-button.outlined.info{color:var(--info)}button.dsv-button.text.warning,button.dsv-button.outlined.warning{color:var(--warning)}button.dsv-button.text.error,button.dsv-button.outlined.error{color:var(--error)}button.dsv-button.text.outlined.primary,button.dsv-button.outlined.outlined.primary{border:1px solid var(--primary)}button.dsv-button.text.outlined.success,button.dsv-button.outlined.outlined.success{border:1px solid var(--success)}button.dsv-button.text.outlined.info,button.dsv-button.outlined.outlined.info{border:1px solid var(--info)}button.dsv-button.text.outlined.warning,button.dsv-button.outlined.outlined.warning{border:1px solid var(--warning)}button.dsv-button.text.outlined.error,button.dsv-button.outlined.outlined.error{border:1px solid var(--error)}button.dsv-button.contained.primary{background-color:var(--primary)}button.dsv-button.contained.success{background-color:var(--success)}button.dsv-button.contained.info{background-color:var(--info)}button.dsv-button.contained.warning{background-color:var(--warning)}button.dsv-button.contained.error{background-color:var(--error)}button.dsv-button:not(:disabled):hover{transform:scale(1);opacity:1.2}button.dsv-button:not(:disabled):hover:not(.text){box-shadow:#0003 0 2px 4px -1px,#00000024 0 4px 5px,#0000001f 0 1px 10px}button.dsv-button:not(:disabled):active{transform:scale(1);opacity:.8}button.dsv-button:disabled{background:#5b5b5b!important}::ng-deep .dark button.dsv-button{filter:hue-rotate(5deg)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
23
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvButtonComponent, isStandalone: true, selector: "dsv-button", inputs: { libelle: "libelle", color: "color", icon: "icon", iconEnd: "iconEnd", width: "width", variant: "variant", fullwidth: "fullwidth", show: "show", disabled: "disabled" }, outputs: { callback: "callback" }, ngImport: i0, template: "<button\n class=\"dsv-button\"\n (click)=\"doClick($event)\"\n [ngClass]=\"\n (icon ? 'icon' : '') +\n ' ' +\n color +\n ' ' +\n width +\n ' ' +\n variant +\n ' ' +\n (fullwidth ? 'fullwidth' : '')\n \"\n [disabled]=\"disabled\"\n *ngIf=\"show\"\n>\n <i [class]=\"icon\" *ngIf=\"icon\"></i>\n <span *ngIf=\"libelle\">\n {{ libelle }}\n </span>\n <ng-content></ng-content>\n <i [class]=\"iconEnd\" *ngIf=\"iconEnd\"></i>\n</button>\n", styles: ["button.dsv-button{display:inline-flex;flex-direction:row;gap:5px;align-items:center;justify-content:center;position:relative;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:middle;font-weight:500;letter-spacing:.02857em;text-transform:uppercase;color:#fff!important;outline:0px;margin:0;text-decoration:none;border-width:0px;border-radius:4px;transition:background-color .25s cubic-bezier(.4,0,.2,1),box-shadow .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1);padding:6px;font-size:1rem;min-width:10px;line-height:1;color:var(--text)}button.dsv-button.small,button.dsv-button.small>i{font-size:.8rem!important}button.dsv-button.medium,button.dsv-button.medium>i{font-size:1rem!important}button.dsv-button.large,button.dsv-button.large>i{font-size:1.5rem!important}button.dsv-button.fullwidth{width:100%}button.dsv-button.text,button.dsv-button.outlined{background-color:transparent;box-shadow:none}button.dsv-button.text.primary,button.dsv-button.outlined.primary{color:var(--primary)}button.dsv-button.text.success,button.dsv-button.outlined.success{color:var(--success)}button.dsv-button.text.info,button.dsv-button.outlined.info{color:var(--info)}button.dsv-button.text.warning,button.dsv-button.outlined.warning{color:var(--warning)}button.dsv-button.text.error,button.dsv-button.outlined.error{color:var(--error)}button.dsv-button.text.outlined.primary,button.dsv-button.outlined.outlined.primary{border:1px solid var(--primary)}button.dsv-button.text.outlined.success,button.dsv-button.outlined.outlined.success{border:1px solid var(--success)}button.dsv-button.text.outlined.info,button.dsv-button.outlined.outlined.info{border:1px solid var(--info)}button.dsv-button.text.outlined.warning,button.dsv-button.outlined.outlined.warning{border:1px solid var(--warning)}button.dsv-button.text.outlined.error,button.dsv-button.outlined.outlined.error{border:1px solid var(--error)}button.dsv-button.contained.inherit{background-color:inherit;color:var(--text)!important}button.dsv-button.contained.primary{background-color:var(--primary)}button.dsv-button.contained.secondary{background-color:var(--secondary)}button.dsv-button.contained.success{background-color:var(--success)}button.dsv-button.contained.info{background-color:var(--info)}button.dsv-button.contained.warning{background-color:var(--warning)}button.dsv-button.contained.error{background-color:var(--error)}button.dsv-button:not(:disabled):hover{transform:scale(1);opacity:1.2}button.dsv-button:not(:disabled):hover:not(.text){box-shadow:#0003 0 2px 4px -1px,#00000024 0 4px 5px,#0000001f 0 1px 10px}button.dsv-button:not(:disabled):active{transform:scale(1);opacity:.8}button.dsv-button:disabled{background:#5b5b5b!important}::ng-deep .dark button.dsv-button.contained.inherit{color:var(--white)!important;filter:hue-rotate(5deg)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
24
24
|
}
|
|
25
25
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvButtonComponent, decorators: [{
|
|
26
26
|
type: Component,
|
|
27
|
-
args: [{ selector: 'dsv-button', standalone: true, imports: [CommonModule], template: "<button\n class=\"dsv-button\"\n (click)=\"doClick($event)\"\n [ngClass]=\"\n (icon ? 'icon' : '') +\n ' ' +\n color +\n ' ' +\n width +\n ' ' +\n variant +\n ' ' +\n (fullwidth ? 'fullwidth' : '')\n \"\n [disabled]=\"disabled\"\n *ngIf=\"show\"\n>\n <i [class]=\"icon\" *ngIf=\"icon\"></i>\n <span *ngIf=\"libelle\">\n {{ libelle }}\n </span>\n <ng-content></ng-content>\n <i [class]=\"iconEnd\" *ngIf=\"iconEnd\"></i>\n</button>\n", styles: ["button.dsv-button{display:inline-flex;flex-direction:row;gap:5px;align-items:center;justify-content:center;position:relative;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:middle;font-weight:500;letter-spacing:.02857em;text-transform:uppercase;color:#fff!important;outline:0px;margin:0;text-decoration:none;border-width:0px;border-radius:4px;transition:background-color .25s cubic-bezier(.4,0,.2,1),box-shadow .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1);padding:6px;font-size:1rem;min-width:10px;line-height:1;color:var(--text)}button.dsv-button.small,button.dsv-button.small>i{font-size:.8rem!important}button.dsv-button.medium,button.dsv-button.medium>i{font-size:1rem!important}button.dsv-button.large,button.dsv-button.large>i{font-size:1.5rem!important}button.dsv-button.fullwidth{width:100%}button.dsv-button.text,button.dsv-button.outlined{background-color:transparent;box-shadow:none}button.dsv-button.text.primary,button.dsv-button.outlined.primary{color:var(--primary)}button.dsv-button.text.success,button.dsv-button.outlined.success{color:var(--success)}button.dsv-button.text.info,button.dsv-button.outlined.info{color:var(--info)}button.dsv-button.text.warning,button.dsv-button.outlined.warning{color:var(--warning)}button.dsv-button.text.error,button.dsv-button.outlined.error{color:var(--error)}button.dsv-button.text.outlined.primary,button.dsv-button.outlined.outlined.primary{border:1px solid var(--primary)}button.dsv-button.text.outlined.success,button.dsv-button.outlined.outlined.success{border:1px solid var(--success)}button.dsv-button.text.outlined.info,button.dsv-button.outlined.outlined.info{border:1px solid var(--info)}button.dsv-button.text.outlined.warning,button.dsv-button.outlined.outlined.warning{border:1px solid var(--warning)}button.dsv-button.text.outlined.error,button.dsv-button.outlined.outlined.error{border:1px solid var(--error)}button.dsv-button.contained.primary{background-color:var(--primary)}button.dsv-button.contained.success{background-color:var(--success)}button.dsv-button.contained.info{background-color:var(--info)}button.dsv-button.contained.warning{background-color:var(--warning)}button.dsv-button.contained.error{background-color:var(--error)}button.dsv-button:not(:disabled):hover{transform:scale(1);opacity:1.2}button.dsv-button:not(:disabled):hover:not(.text){box-shadow:#0003 0 2px 4px -1px,#00000024 0 4px 5px,#0000001f 0 1px 10px}button.dsv-button:not(:disabled):active{transform:scale(1);opacity:.8}button.dsv-button:disabled{background:#5b5b5b!important}::ng-deep .dark button.dsv-button{filter:hue-rotate(5deg)}\n"] }]
|
|
27
|
+
args: [{ selector: 'dsv-button', standalone: true, imports: [CommonModule], template: "<button\n class=\"dsv-button\"\n (click)=\"doClick($event)\"\n [ngClass]=\"\n (icon ? 'icon' : '') +\n ' ' +\n color +\n ' ' +\n width +\n ' ' +\n variant +\n ' ' +\n (fullwidth ? 'fullwidth' : '')\n \"\n [disabled]=\"disabled\"\n *ngIf=\"show\"\n>\n <i [class]=\"icon\" *ngIf=\"icon\"></i>\n <span *ngIf=\"libelle\">\n {{ libelle }}\n </span>\n <ng-content></ng-content>\n <i [class]=\"iconEnd\" *ngIf=\"iconEnd\"></i>\n</button>\n", styles: ["button.dsv-button{display:inline-flex;flex-direction:row;gap:5px;align-items:center;justify-content:center;position:relative;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:middle;font-weight:500;letter-spacing:.02857em;text-transform:uppercase;color:#fff!important;outline:0px;margin:0;text-decoration:none;border-width:0px;border-radius:4px;transition:background-color .25s cubic-bezier(.4,0,.2,1),box-shadow .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1);padding:6px;font-size:1rem;min-width:10px;line-height:1;color:var(--text)}button.dsv-button.small,button.dsv-button.small>i{font-size:.8rem!important}button.dsv-button.medium,button.dsv-button.medium>i{font-size:1rem!important}button.dsv-button.large,button.dsv-button.large>i{font-size:1.5rem!important}button.dsv-button.fullwidth{width:100%}button.dsv-button.text,button.dsv-button.outlined{background-color:transparent;box-shadow:none}button.dsv-button.text.primary,button.dsv-button.outlined.primary{color:var(--primary)}button.dsv-button.text.success,button.dsv-button.outlined.success{color:var(--success)}button.dsv-button.text.info,button.dsv-button.outlined.info{color:var(--info)}button.dsv-button.text.warning,button.dsv-button.outlined.warning{color:var(--warning)}button.dsv-button.text.error,button.dsv-button.outlined.error{color:var(--error)}button.dsv-button.text.outlined.primary,button.dsv-button.outlined.outlined.primary{border:1px solid var(--primary)}button.dsv-button.text.outlined.success,button.dsv-button.outlined.outlined.success{border:1px solid var(--success)}button.dsv-button.text.outlined.info,button.dsv-button.outlined.outlined.info{border:1px solid var(--info)}button.dsv-button.text.outlined.warning,button.dsv-button.outlined.outlined.warning{border:1px solid var(--warning)}button.dsv-button.text.outlined.error,button.dsv-button.outlined.outlined.error{border:1px solid var(--error)}button.dsv-button.contained.inherit{background-color:inherit;color:var(--text)!important}button.dsv-button.contained.primary{background-color:var(--primary)}button.dsv-button.contained.secondary{background-color:var(--secondary)}button.dsv-button.contained.success{background-color:var(--success)}button.dsv-button.contained.info{background-color:var(--info)}button.dsv-button.contained.warning{background-color:var(--warning)}button.dsv-button.contained.error{background-color:var(--error)}button.dsv-button:not(:disabled):hover{transform:scale(1);opacity:1.2}button.dsv-button:not(:disabled):hover:not(.text){box-shadow:#0003 0 2px 4px -1px,#00000024 0 4px 5px,#0000001f 0 1px 10px}button.dsv-button:not(:disabled):active{transform:scale(1);opacity:.8}button.dsv-button:disabled{background:#5b5b5b!important}::ng-deep .dark button.dsv-button.contained.inherit{color:var(--white)!important;filter:hue-rotate(5deg)}\n"] }]
|
|
28
28
|
}], propDecorators: { libelle: [{
|
|
29
29
|
type: Input
|
|
30
30
|
}], color: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-button.mjs","sources":["../../../projects/ng-dsv/ds/button/component/button.component.ts","../../../projects/ng-dsv/ds/button/component/button.component.html","../../../projects/ng-dsv/ds/button/ng-vagabond-lab-ng-dsv-ds-button.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input, output } from '@angular/core';\nimport { ColorType } from '@ng-vagabond-lab/ng-dsv/type';\n\nexport type ButtonWidthType = 'small' | 'medium' | 'large';\nexport type ButtonVariantType = 'text' | 'outlined' | 'contained';\n\n@Component({\n selector: 'dsv-button',\n standalone: true,\n imports: [CommonModule],\n templateUrl: './button.component.html',\n styleUrls: ['./button.component.scss'],\n})\nexport class DsvButtonComponent {\n @Input() libelle: string = '';\n @Input() color: ColorType = 'primary';\n @Input() icon: string = '';\n @Input() iconEnd: string = '';\n @Input() width: ButtonWidthType = 'medium';\n @Input() variant: ButtonVariantType = 'contained';\n @Input() fullwidth: boolean = false;\n @Input() show: boolean = true;\n @Input() disabled: boolean = false;\n\n callback = output<void>();\n\n doClick(event: Event) {\n event.stopPropagation();\n event.preventDefault();\n !this.disabled && this.callback.emit();\n }\n}\n","<button\n class=\"dsv-button\"\n (click)=\"doClick($event)\"\n [ngClass]=\"\n (icon ? 'icon' : '') +\n ' ' +\n color +\n ' ' +\n width +\n ' ' +\n variant +\n ' ' +\n (fullwidth ? 'fullwidth' : '')\n \"\n [disabled]=\"disabled\"\n *ngIf=\"show\"\n>\n <i [class]=\"icon\" *ngIf=\"icon\"></i>\n <span *ngIf=\"libelle\">\n {{ libelle }}\n </span>\n <ng-content></ng-content>\n <i [class]=\"iconEnd\" *ngIf=\"iconEnd\"></i>\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAca,kBAAkB,CAAA;IACpB,OAAO,GAAW,EAAE;IACpB,KAAK,GAAc,SAAS;IAC5B,IAAI,GAAW,EAAE;IACjB,OAAO,GAAW,EAAE;IACpB,KAAK,GAAoB,QAAQ;IACjC,OAAO,GAAsB,WAAW;IACxC,SAAS,GAAY,KAAK;IAC1B,IAAI,GAAY,IAAI;IACpB,QAAQ,GAAY,KAAK;IAElC,QAAQ,GAAG,MAAM,EAAQ;AAEzB,IAAA,OAAO,CAAC,KAAY,EAAA;QAClB,KAAK,CAAC,eAAe,EAAE;QACvB,KAAK,CAAC,cAAc,EAAE;QACtB,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE;;uGAhB7B,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAlB,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA,SAAA,EAAA,SAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECd/B,2dAwBA,EAAA,MAAA,EAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-button.mjs","sources":["../../../projects/ng-dsv/ds/button/component/button.component.ts","../../../projects/ng-dsv/ds/button/component/button.component.html","../../../projects/ng-dsv/ds/button/ng-vagabond-lab-ng-dsv-ds-button.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input, output } from '@angular/core';\nimport { ColorType } from '@ng-vagabond-lab/ng-dsv/type';\n\nexport type ButtonWidthType = 'small' | 'medium' | 'large';\nexport type ButtonVariantType = 'text' | 'outlined' | 'contained';\n\n@Component({\n selector: 'dsv-button',\n standalone: true,\n imports: [CommonModule],\n templateUrl: './button.component.html',\n styleUrls: ['./button.component.scss'],\n})\nexport class DsvButtonComponent {\n @Input() libelle: string = '';\n @Input() color: ColorType = 'primary';\n @Input() icon: string = '';\n @Input() iconEnd: string = '';\n @Input() width: ButtonWidthType = 'medium';\n @Input() variant: ButtonVariantType = 'contained';\n @Input() fullwidth: boolean = false;\n @Input() show: boolean = true;\n @Input() disabled: boolean = false;\n\n callback = output<void>();\n\n doClick(event: Event) {\n event.stopPropagation();\n event.preventDefault();\n !this.disabled && this.callback.emit();\n }\n}\n","<button\n class=\"dsv-button\"\n (click)=\"doClick($event)\"\n [ngClass]=\"\n (icon ? 'icon' : '') +\n ' ' +\n color +\n ' ' +\n width +\n ' ' +\n variant +\n ' ' +\n (fullwidth ? 'fullwidth' : '')\n \"\n [disabled]=\"disabled\"\n *ngIf=\"show\"\n>\n <i [class]=\"icon\" *ngIf=\"icon\"></i>\n <span *ngIf=\"libelle\">\n {{ libelle }}\n </span>\n <ng-content></ng-content>\n <i [class]=\"iconEnd\" *ngIf=\"iconEnd\"></i>\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAca,kBAAkB,CAAA;IACpB,OAAO,GAAW,EAAE;IACpB,KAAK,GAAc,SAAS;IAC5B,IAAI,GAAW,EAAE;IACjB,OAAO,GAAW,EAAE;IACpB,KAAK,GAAoB,QAAQ;IACjC,OAAO,GAAsB,WAAW;IACxC,SAAS,GAAY,KAAK;IAC1B,IAAI,GAAY,IAAI;IACpB,QAAQ,GAAY,KAAK;IAElC,QAAQ,GAAG,MAAM,EAAQ;AAEzB,IAAA,OAAO,CAAC,KAAY,EAAA;QAClB,KAAK,CAAC,eAAe,EAAE;QACvB,KAAK,CAAC,cAAc,EAAE;QACtB,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE;;uGAhB7B,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAlB,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA,SAAA,EAAA,SAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECd/B,2dAwBA,EAAA,MAAA,EAAA,CAAA,szFAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDdY,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAIX,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAP9B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,YAAY,EACV,UAAA,EAAA,IAAI,EACP,OAAA,EAAA,CAAC,YAAY,CAAC,EAAA,QAAA,EAAA,2dAAA,EAAA,MAAA,EAAA,CAAA,szFAAA,CAAA,EAAA;8BAKd,OAAO,EAAA,CAAA;sBAAf;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,IAAI,EAAA,CAAA;sBAAZ;gBACQ,OAAO,EAAA,CAAA;sBAAf;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,OAAO,EAAA,CAAA;sBAAf;gBACQ,SAAS,EAAA,CAAA;sBAAjB;gBACQ,IAAI,EAAA,CAAA;sBAAZ;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;;;AEvBH;;AAEG;;;;"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { CommonModule } from '@angular/common';
|
|
2
|
+
import * as i0 from '@angular/core';
|
|
3
|
+
import { Component, Input } from '@angular/core';
|
|
4
|
+
|
|
5
|
+
class DsvContainerComponent {
|
|
6
|
+
column = false;
|
|
7
|
+
ngOnInit() {
|
|
8
|
+
this.column &&
|
|
9
|
+
document.getElementsByTagName('dsv-container')[0].classList.add('column');
|
|
10
|
+
}
|
|
11
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
12
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvContainerComponent, isStandalone: true, selector: "dsv-container", inputs: { column: "column" }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:flex;flex-direction:column;flex:1;overflow:auto}:host.column{flex-direction:row}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
13
|
+
}
|
|
14
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvContainerComponent, decorators: [{
|
|
15
|
+
type: Component,
|
|
16
|
+
args: [{ selector: 'dsv-container', standalone: true, imports: [CommonModule], template: "<ng-content></ng-content>\n", styles: [":host{display:flex;flex-direction:column;flex:1;overflow:auto}:host.column{flex-direction:row}\n"] }]
|
|
17
|
+
}], propDecorators: { column: [{
|
|
18
|
+
type: Input
|
|
19
|
+
}] } });
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* Generated bundle index. Do not edit.
|
|
23
|
+
*/
|
|
24
|
+
|
|
25
|
+
export { DsvContainerComponent };
|
|
26
|
+
//# sourceMappingURL=ng-vagabond-lab-ng-dsv-ds-container.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-container.mjs","sources":["../../../projects/ng-dsv/ds/container/component/container.component.ts","../../../projects/ng-dsv/ds/container/component/container.component.html","../../../projects/ng-dsv/ds/container/ng-vagabond-lab-ng-dsv-ds-container.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input } from '@angular/core';\n\n@Component({\n selector: 'dsv-container',\n standalone: true,\n imports: [CommonModule],\n templateUrl: './container.component.html',\n styleUrls: ['./container.component.scss'],\n})\nexport class DsvContainerComponent {\n @Input() column: boolean = false;\n\n ngOnInit() {\n this.column &&\n document.getElementsByTagName('dsv-container')[0].classList.add('column');\n }\n}\n","<ng-content></ng-content>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAUa,qBAAqB,CAAA;IACvB,MAAM,GAAY,KAAK;IAEhC,QAAQ,GAAA;AACN,QAAA,IAAI,CAAC,MAAM;AACT,YAAA,QAAQ,CAAC,oBAAoB,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC;;uGALlE,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAArB,qBAAqB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECVlC,6BACA,EAAA,MAAA,EAAA,CAAA,kGAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDKY,YAAY,EAAA,CAAA,EAAA,CAAA;;2FAIX,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAPjC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,eAAe,EACb,UAAA,EAAA,IAAI,EACP,OAAA,EAAA,CAAC,YAAY,CAAC,EAAA,QAAA,EAAA,6BAAA,EAAA,MAAA,EAAA,CAAA,kGAAA,CAAA,EAAA;8BAKd,MAAM,EAAA,CAAA;sBAAd;;;AEXH;;AAEG;;;;"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import * as i3 from '@angular/common';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
3
|
+
import * as i0 from '@angular/core';
|
|
4
|
+
import { Component, Input } from '@angular/core';
|
|
5
|
+
import * as i2 from '@ng-vagabond-lab/ng-dsv/ds/menu';
|
|
6
|
+
import { DsvMenuButtonComponent } from '@ng-vagabond-lab/ng-dsv/ds/menu';
|
|
7
|
+
import * as i1 from '@angular/router';
|
|
8
|
+
|
|
9
|
+
class DsvHeaderComponent {
|
|
10
|
+
router;
|
|
11
|
+
menuService;
|
|
12
|
+
img;
|
|
13
|
+
title = '';
|
|
14
|
+
withMenu = true;
|
|
15
|
+
constructor(router, menuService) {
|
|
16
|
+
this.router = router;
|
|
17
|
+
this.menuService = menuService;
|
|
18
|
+
}
|
|
19
|
+
doToogleMenu() {
|
|
20
|
+
this.menuService.toogleMenu();
|
|
21
|
+
}
|
|
22
|
+
goToHome() {
|
|
23
|
+
this.router.navigate(['/']);
|
|
24
|
+
}
|
|
25
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvHeaderComponent, deps: [{ token: i1.Router }, { token: i2.MenuService }], target: i0.ɵɵFactoryTarget.Component });
|
|
26
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvHeaderComponent, isStandalone: true, selector: "dsv-header", inputs: { img: "img", title: "title", withMenu: "withMenu" }, ngImport: i0, template: "<div class=\"dsv-header-content\">\n <div class=\"dsv-header-logo\" (click)=\"goToHome()\">\n <dsv-menu-button *ngIf=\"withMenu\"></dsv-menu-button>\n <img src=\"{{ img }}\" alt=\"logo\" *ngIf=\"img\" />\n <span>{{ title }}</span>\n </div>\n <ng-content></ng-content>\n</div>\n", styles: [":host{display:flex;flex-direction:column;width:100%;box-sizing:border-box;flex-shrink:0;top:0;left:auto;right:0;background-color:var(--white);color:var(--text);z-index:1201;transition:box-shadow .3s cubic-bezier(.4,0,.2,1)}:host .dsv-header-content{position:relative;display:flex;-webkit-box-align:center;align-items:center;padding-left:16px;padding-right:16px;min-height:56px;-webkit-user-select:none;user-select:none}:host .dsv-header-content .dsv-header-logo{display:flex;justify-content:flex-start;align-items:center;font-size:1.3rem;flex:1;gap:10px}:host .dsv-header-content .dsv-header-logo img{width:40px;height:40px;cursor:pointer}:host .dsv-header-content .dsv-header-logo span{font-weight:700;cursor:pointer}::ng-deep .dark dsv-header{background-color:var(--background-dark)}::ng-deep .dark dsv-header *{color:var(--text-dark)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DsvMenuButtonComponent, selector: "dsv-menu-button" }] });
|
|
27
|
+
}
|
|
28
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvHeaderComponent, decorators: [{
|
|
29
|
+
type: Component,
|
|
30
|
+
args: [{ selector: 'dsv-header', standalone: true, imports: [CommonModule, DsvMenuButtonComponent], template: "<div class=\"dsv-header-content\">\n <div class=\"dsv-header-logo\" (click)=\"goToHome()\">\n <dsv-menu-button *ngIf=\"withMenu\"></dsv-menu-button>\n <img src=\"{{ img }}\" alt=\"logo\" *ngIf=\"img\" />\n <span>{{ title }}</span>\n </div>\n <ng-content></ng-content>\n</div>\n", styles: [":host{display:flex;flex-direction:column;width:100%;box-sizing:border-box;flex-shrink:0;top:0;left:auto;right:0;background-color:var(--white);color:var(--text);z-index:1201;transition:box-shadow .3s cubic-bezier(.4,0,.2,1)}:host .dsv-header-content{position:relative;display:flex;-webkit-box-align:center;align-items:center;padding-left:16px;padding-right:16px;min-height:56px;-webkit-user-select:none;user-select:none}:host .dsv-header-content .dsv-header-logo{display:flex;justify-content:flex-start;align-items:center;font-size:1.3rem;flex:1;gap:10px}:host .dsv-header-content .dsv-header-logo img{width:40px;height:40px;cursor:pointer}:host .dsv-header-content .dsv-header-logo span{font-weight:700;cursor:pointer}::ng-deep .dark dsv-header{background-color:var(--background-dark)}::ng-deep .dark dsv-header *{color:var(--text-dark)}\n"] }]
|
|
31
|
+
}], ctorParameters: () => [{ type: i1.Router }, { type: i2.MenuService }], propDecorators: { img: [{
|
|
32
|
+
type: Input
|
|
33
|
+
}], title: [{
|
|
34
|
+
type: Input
|
|
35
|
+
}], withMenu: [{
|
|
36
|
+
type: Input
|
|
37
|
+
}] } });
|
|
38
|
+
|
|
39
|
+
/**
|
|
40
|
+
* Generated bundle index. Do not edit.
|
|
41
|
+
*/
|
|
42
|
+
|
|
43
|
+
export { DsvHeaderComponent };
|
|
44
|
+
//# sourceMappingURL=ng-vagabond-lab-ng-dsv-ds-header.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-header.mjs","sources":["../../../projects/ng-dsv/ds/header/component/header.component.ts","../../../projects/ng-dsv/ds/header/component/header.component.html","../../../projects/ng-dsv/ds/header/ng-vagabond-lab-ng-dsv-ds-header.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input } from '@angular/core';\nimport { Router } from '@angular/router';\nimport {\n DsvMenuButtonComponent,\n MenuService,\n} from '@ng-vagabond-lab/ng-dsv/ds/menu';\n\n@Component({\n selector: 'dsv-header',\n standalone: true,\n imports: [CommonModule, DsvMenuButtonComponent],\n templateUrl: './header.component.html',\n styleUrls: ['./header.component.scss'],\n})\nexport class DsvHeaderComponent {\n @Input() img!: string;\n @Input() title: string = '';\n @Input() withMenu: boolean = true;\n\n constructor(private router: Router, private menuService: MenuService) {}\n\n doToogleMenu() {\n this.menuService.toogleMenu();\n }\n\n goToHome() {\n this.router.navigate(['/']);\n }\n}\n","<div class=\"dsv-header-content\">\n <div class=\"dsv-header-logo\" (click)=\"goToHome()\">\n <dsv-menu-button *ngIf=\"withMenu\"></dsv-menu-button>\n <img src=\"{{ img }}\" alt=\"logo\" *ngIf=\"img\" />\n <span>{{ title }}</span>\n </div>\n <ng-content></ng-content>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;MAea,kBAAkB,CAAA;AAKT,IAAA,MAAA;AAAwB,IAAA,WAAA;AAJnC,IAAA,GAAG;IACH,KAAK,GAAW,EAAE;IAClB,QAAQ,GAAY,IAAI;IAEjC,WAAoB,CAAA,MAAc,EAAU,WAAwB,EAAA;QAAhD,IAAM,CAAA,MAAA,GAAN,MAAM;QAAkB,IAAW,CAAA,WAAA,GAAX,WAAW;;IAEvD,YAAY,GAAA;AACV,QAAA,IAAI,CAAC,WAAW,CAAC,UAAU,EAAE;;IAG/B,QAAQ,GAAA;QACN,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC;;uGAZlB,kBAAkB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,MAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,WAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,kBAAkB,ECf/B,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,KAAA,EAAA,KAAA,EAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,mSAQA,EDGY,MAAA,EAAA,CAAA,y0BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,YAAY,mIAAE,sBAAsB,EAAA,QAAA,EAAA,iBAAA,EAAA,CAAA,EAAA,CAAA;;2FAInC,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAP9B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,YAAY,cACV,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,EAAE,sBAAsB,CAAC,EAAA,QAAA,EAAA,mSAAA,EAAA,MAAA,EAAA,CAAA,y0BAAA,CAAA,EAAA;qGAKtC,GAAG,EAAA,CAAA;sBAAX;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;;;AElBH;;AAEG;;;;"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import * as i2 from '@angular/common';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
3
|
+
import * as i0 from '@angular/core';
|
|
4
|
+
import { Component, Input } from '@angular/core';
|
|
5
|
+
import * as i1 from '@angular/router';
|
|
6
|
+
|
|
7
|
+
class DsvItemComponent {
|
|
8
|
+
router;
|
|
9
|
+
icon = '';
|
|
10
|
+
text = '';
|
|
11
|
+
url;
|
|
12
|
+
constructor(router) {
|
|
13
|
+
this.router = router;
|
|
14
|
+
}
|
|
15
|
+
doClick() {
|
|
16
|
+
this.url && this.router.navigate([this.url]);
|
|
17
|
+
}
|
|
18
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvItemComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
19
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvItemComponent, isStandalone: true, selector: "dsv-item", inputs: { icon: "icon", text: "text", url: "url" }, ngImport: i0, template: "<div class=\"text\" (click)=\"doClick()\">\n <i *ngIf=\"icon\" class=\"ri-{{ icon }}-line\"></i>\n {{ text }}\n</div>\n<ng-content></ng-content>\n", styles: [":host{display:flex;flex-direction:column;gap:10px;padding:10px;font-size:1.2rem;-webkit-user-select:none;user-select:none}:host:hover{background-color:#d9d9d9;cursor:pointer}:host .text{display:flex;gap:10px;flex:1;font-weight:700}::ng-deep .dark dsv-item:hover{background-color:#313131}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
20
|
+
}
|
|
21
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvItemComponent, decorators: [{
|
|
22
|
+
type: Component,
|
|
23
|
+
args: [{ selector: 'dsv-item', standalone: true, imports: [CommonModule], template: "<div class=\"text\" (click)=\"doClick()\">\n <i *ngIf=\"icon\" class=\"ri-{{ icon }}-line\"></i>\n {{ text }}\n</div>\n<ng-content></ng-content>\n", styles: [":host{display:flex;flex-direction:column;gap:10px;padding:10px;font-size:1.2rem;-webkit-user-select:none;user-select:none}:host:hover{background-color:#d9d9d9;cursor:pointer}:host .text{display:flex;gap:10px;flex:1;font-weight:700}::ng-deep .dark dsv-item:hover{background-color:#313131}\n"] }]
|
|
24
|
+
}], ctorParameters: () => [{ type: i1.Router }], propDecorators: { icon: [{
|
|
25
|
+
type: Input
|
|
26
|
+
}], text: [{
|
|
27
|
+
type: Input
|
|
28
|
+
}], url: [{
|
|
29
|
+
type: Input
|
|
30
|
+
}] } });
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* Generated bundle index. Do not edit.
|
|
34
|
+
*/
|
|
35
|
+
|
|
36
|
+
export { DsvItemComponent };
|
|
37
|
+
//# sourceMappingURL=ng-vagabond-lab-ng-dsv-ds-item.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-item.mjs","sources":["../../../projects/ng-dsv/ds/item/component/item.component.ts","../../../projects/ng-dsv/ds/item/component/item.component.html","../../../projects/ng-dsv/ds/item/ng-vagabond-lab-ng-dsv-ds-item.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input } from '@angular/core';\nimport { Router } from '@angular/router';\n\n@Component({\n selector: 'dsv-item',\n standalone: true,\n imports: [CommonModule],\n templateUrl: './item.component.html',\n styleUrls: ['./item.component.scss'],\n})\nexport class DsvItemComponent {\n @Input() icon: string = '';\n @Input() text: string = '';\n @Input() url!: string;\n\n constructor(private router: Router) {}\n\n doClick() {\n this.url && this.router.navigate([this.url]);\n }\n}\n","<div class=\"text\" (click)=\"doClick()\">\n <i *ngIf=\"icon\" class=\"ri-{{ icon }}-line\"></i>\n {{ text }}\n</div>\n<ng-content></ng-content>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;MAWa,gBAAgB,CAAA;AAKP,IAAA,MAAA;IAJX,IAAI,GAAW,EAAE;IACjB,IAAI,GAAW,EAAE;AACjB,IAAA,GAAG;AAEZ,IAAA,WAAA,CAAoB,MAAc,EAAA;QAAd,IAAM,CAAA,MAAA,GAAN,MAAM;;IAE1B,OAAO,GAAA;AACL,QAAA,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;;uGARnC,gBAAgB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,MAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,MAAA,EAAA,GAAA,EAAA,KAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECX7B,sJAKA,EAAA,MAAA,EAAA,CAAA,mSAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDEY,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAIX,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAP5B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,UAAU,EACR,UAAA,EAAA,IAAI,EACP,OAAA,EAAA,CAAC,YAAY,CAAC,EAAA,QAAA,EAAA,sJAAA,EAAA,MAAA,EAAA,CAAA,mSAAA,CAAA,EAAA;2EAKd,IAAI,EAAA,CAAA;sBAAZ;gBACQ,IAAI,EAAA,CAAA;sBAAZ;gBACQ,GAAG,EAAA,CAAA;sBAAX;;;AEdH;;AAEG;;;;"}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import { CommonModule } from '@angular/common';
|
|
2
|
+
import * as i0 from '@angular/core';
|
|
3
|
+
import { Component, effect, Input, HostListener, signal, Injectable } from '@angular/core';
|
|
4
|
+
import { DsvButtonComponent } from '@ng-vagabond-lab/ng-dsv/ds/button';
|
|
5
|
+
import { DsvContainerComponent } from '@ng-vagabond-lab/ng-dsv/ds/container';
|
|
6
|
+
import { DsvThemeSwitchComponent } from '@ng-vagabond-lab/ng-dsv/ds/theme';
|
|
7
|
+
|
|
8
|
+
class DsvMenuButtonComponent {
|
|
9
|
+
menuService;
|
|
10
|
+
constructor(menuService) {
|
|
11
|
+
this.menuService = menuService;
|
|
12
|
+
}
|
|
13
|
+
doToogleMenu() {
|
|
14
|
+
this.menuService.toogleMenu();
|
|
15
|
+
}
|
|
16
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvMenuButtonComponent, deps: [{ token: MenuService }], target: i0.ɵɵFactoryTarget.Component });
|
|
17
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvMenuButtonComponent, isStandalone: true, selector: "dsv-menu-button", ngImport: i0, template: "<dsv-button\n icon=\"ri-menu-line\"\n color=\"inherit\"\n (callback)=\"doToogleMenu()\"\n></dsv-button>\n", styles: [":host{display:flex}@media only screen and (min-width: 1001px){:host{display:none!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DsvButtonComponent, selector: "dsv-button", inputs: ["libelle", "color", "icon", "iconEnd", "width", "variant", "fullwidth", "show", "disabled"], outputs: ["callback"] }] });
|
|
18
|
+
}
|
|
19
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvMenuButtonComponent, decorators: [{
|
|
20
|
+
type: Component,
|
|
21
|
+
args: [{ selector: 'dsv-menu-button', standalone: true, imports: [CommonModule, DsvButtonComponent], template: "<dsv-button\n icon=\"ri-menu-line\"\n color=\"inherit\"\n (callback)=\"doToogleMenu()\"\n></dsv-button>\n", styles: [":host{display:flex}@media only screen and (min-width: 1001px){:host{display:none!important}}\n"] }]
|
|
22
|
+
}], ctorParameters: () => [{ type: MenuService }] });
|
|
23
|
+
|
|
24
|
+
class DsvMenuComponent {
|
|
25
|
+
menuService;
|
|
26
|
+
elementRef;
|
|
27
|
+
showFooter = true;
|
|
28
|
+
constructor(menuService, elementRef) {
|
|
29
|
+
this.menuService = menuService;
|
|
30
|
+
this.elementRef = elementRef;
|
|
31
|
+
effect(() => {
|
|
32
|
+
const menu = document.getElementsByTagName('dsv-menu')[0];
|
|
33
|
+
const collapse = document.getElementById('collapse');
|
|
34
|
+
if (this.menuService.isMenuOpen()) {
|
|
35
|
+
menu?.classList?.add('open');
|
|
36
|
+
collapse?.classList.add('show');
|
|
37
|
+
}
|
|
38
|
+
else {
|
|
39
|
+
menu?.classList?.remove('open');
|
|
40
|
+
collapse?.classList.remove('show');
|
|
41
|
+
}
|
|
42
|
+
});
|
|
43
|
+
}
|
|
44
|
+
ngOnInit() {
|
|
45
|
+
this.menuService.isMenuOpen() &&
|
|
46
|
+
document.getElementsByTagName('dsv-container')[0].classList.add('show');
|
|
47
|
+
}
|
|
48
|
+
onClickOutside(event) {
|
|
49
|
+
if (this.menuService.isMenuOpen() &&
|
|
50
|
+
!this.elementRef.nativeElement.contains(event.target)) {
|
|
51
|
+
this.menuService.toogleMenu();
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvMenuComponent, deps: [{ token: MenuService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
55
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvMenuComponent, isStandalone: true, selector: "dsv-menu", inputs: { showFooter: "showFooter" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, ngImport: i0, template: "<dsv-container>\n <ng-content></ng-content>\n</dsv-container>\n<div class=\"footer\">\n <dsv-theme-switch></dsv-theme-switch>\n</div>\n", styles: [":host{display:flex;flex-direction:column;overflow:auto;background-color:var(--white);color:var(--text);width:240px;transform:translate(0)!important}:host.open{transform:translate(0)!important}:host .footer{display:flex;align-items:center;justify-content:center;padding:10px}::ng-deep .dark dsv-menu{background-color:var(--background-dark);color:var(--text-dark)}@media only screen and (max-width: 1000px){:host{position:fixed;height:-webkit-fill-available;z-index:1201;transform:translate(-100%)!important;transition:transform .3s ease-in-out}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DsvThemeSwitchComponent, selector: "dsv-theme-switch" }, { kind: "component", type: DsvContainerComponent, selector: "dsv-container", inputs: ["column"] }] });
|
|
56
|
+
}
|
|
57
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvMenuComponent, decorators: [{
|
|
58
|
+
type: Component,
|
|
59
|
+
args: [{ selector: 'dsv-menu', standalone: true, imports: [CommonModule, DsvThemeSwitchComponent, DsvContainerComponent], template: "<dsv-container>\n <ng-content></ng-content>\n</dsv-container>\n<div class=\"footer\">\n <dsv-theme-switch></dsv-theme-switch>\n</div>\n", styles: [":host{display:flex;flex-direction:column;overflow:auto;background-color:var(--white);color:var(--text);width:240px;transform:translate(0)!important}:host.open{transform:translate(0)!important}:host .footer{display:flex;align-items:center;justify-content:center;padding:10px}::ng-deep .dark dsv-menu{background-color:var(--background-dark);color:var(--text-dark)}@media only screen and (max-width: 1000px){:host{position:fixed;height:-webkit-fill-available;z-index:1201;transform:translate(-100%)!important;transition:transform .3s ease-in-out}}\n"] }]
|
|
60
|
+
}], ctorParameters: () => [{ type: MenuService }, { type: i0.ElementRef }], propDecorators: { showFooter: [{
|
|
61
|
+
type: Input
|
|
62
|
+
}], onClickOutside: [{
|
|
63
|
+
type: HostListener,
|
|
64
|
+
args: ['document:click', ['$event']]
|
|
65
|
+
}] } });
|
|
66
|
+
|
|
67
|
+
class MenuService {
|
|
68
|
+
isMenuOpen = signal(false);
|
|
69
|
+
toogleMenu() {
|
|
70
|
+
this.isMenuOpen.update((toogle) => !toogle);
|
|
71
|
+
}
|
|
72
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: MenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
73
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: MenuService, providedIn: 'root' });
|
|
74
|
+
}
|
|
75
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: MenuService, decorators: [{
|
|
76
|
+
type: Injectable,
|
|
77
|
+
args: [{
|
|
78
|
+
providedIn: 'root',
|
|
79
|
+
}]
|
|
80
|
+
}] });
|
|
81
|
+
|
|
82
|
+
/**
|
|
83
|
+
* Generated bundle index. Do not edit.
|
|
84
|
+
*/
|
|
85
|
+
|
|
86
|
+
export { DsvMenuButtonComponent, DsvMenuComponent, MenuService };
|
|
87
|
+
//# sourceMappingURL=ng-vagabond-lab-ng-dsv-ds-menu.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-menu.mjs","sources":["../../../projects/ng-dsv/ds/menu/component/button/menu.button.component.ts","../../../projects/ng-dsv/ds/menu/component/button/menu.button.component.html","../../../projects/ng-dsv/ds/menu/component/menu.component.ts","../../../projects/ng-dsv/ds/menu/component/menu.component.html","../../../projects/ng-dsv/ds/menu/service/menu.service.ts","../../../projects/ng-dsv/ds/menu/ng-vagabond-lab-ng-dsv-ds-menu.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component } from '@angular/core';\nimport { DsvButtonComponent } from '@ng-vagabond-lab/ng-dsv/ds/button';\nimport { MenuService } from '../../public-api';\n\n@Component({\n selector: 'dsv-menu-button',\n standalone: true,\n imports: [CommonModule, DsvButtonComponent],\n templateUrl: './menu.button.component.html',\n styleUrls: ['./menu.button.component.scss'],\n})\nexport class DsvMenuButtonComponent {\n constructor(private menuService: MenuService) {}\n\n doToogleMenu() {\n this.menuService.toogleMenu();\n }\n}\n","<dsv-button\n icon=\"ri-menu-line\"\n color=\"inherit\"\n (callback)=\"doToogleMenu()\"\n></dsv-button>\n","import { CommonModule } from '@angular/common';\nimport {\n Component,\n effect,\n ElementRef,\n HostListener,\n Input,\n OnInit,\n} from '@angular/core';\nimport { DsvContainerComponent } from '@ng-vagabond-lab/ng-dsv/ds/container';\nimport { DsvThemeSwitchComponent } from '@ng-vagabond-lab/ng-dsv/ds/theme';\nimport { MenuService } from '../public-api';\n\n@Component({\n selector: 'dsv-menu',\n standalone: true,\n imports: [CommonModule, DsvThemeSwitchComponent, DsvContainerComponent],\n templateUrl: './menu.component.html',\n styleUrls: ['./menu.component.scss'],\n})\nexport class DsvMenuComponent implements OnInit {\n @Input() showFooter: boolean = true;\n\n constructor(\n private menuService: MenuService,\n private elementRef: ElementRef\n ) {\n effect(() => {\n const menu = document.getElementsByTagName('dsv-menu')[0];\n const collapse = document.getElementById('collapse');\n if (this.menuService.isMenuOpen()) {\n menu?.classList?.add('open');\n collapse?.classList.add('show');\n } else {\n menu?.classList?.remove('open');\n collapse?.classList.remove('show');\n }\n });\n }\n\n ngOnInit() {\n this.menuService.isMenuOpen() &&\n document.getElementsByTagName('dsv-container')[0].classList.add('show');\n }\n\n @HostListener('document:click', ['$event'])\n onClickOutside(event: Event) {\n if (\n this.menuService.isMenuOpen() &&\n !this.elementRef.nativeElement.contains(event.target)\n ) {\n this.menuService.toogleMenu();\n }\n }\n}\n","<dsv-container>\n <ng-content></ng-content>\n</dsv-container>\n<div class=\"footer\">\n <dsv-theme-switch></dsv-theme-switch>\n</div>\n","import { Injectable, signal, WritableSignal } from '@angular/core';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class MenuService {\n isMenuOpen: WritableSignal<boolean> = signal(false);\n\n toogleMenu() {\n this.isMenuOpen.update((toogle) => !toogle);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.MenuService"],"mappings":"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"}
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, Input, HostBinding } from '@angular/core';
|
|
2
|
+
import { Component, Input, HostBinding, signal, Injectable } from '@angular/core';
|
|
3
|
+
import { CommonModule } from '@angular/common';
|
|
4
|
+
import { DsvButtonComponent } from '@ng-vagabond-lab/ng-dsv/ds/button';
|
|
3
5
|
|
|
4
6
|
class DsvThemeComponent {
|
|
5
|
-
theme;
|
|
7
|
+
theme = {};
|
|
6
8
|
background;
|
|
7
9
|
backgroundDark;
|
|
8
10
|
text;
|
|
@@ -14,8 +16,8 @@ class DsvThemeComponent {
|
|
|
14
16
|
warning;
|
|
15
17
|
error;
|
|
16
18
|
ngOnInit() {
|
|
17
|
-
this.background = this.theme.background ?? '
|
|
18
|
-
this.backgroundDark = this.theme.backgroundDark ?? '
|
|
19
|
+
this.background = this.theme.background ?? 'rgb(220, 220, 220)';
|
|
20
|
+
this.backgroundDark = this.theme.backgroundDark ?? 'rgb(31, 31, 31)';
|
|
19
21
|
this.text = this.theme.text ?? '#000';
|
|
20
22
|
this.textDark = this.theme.textDark ?? '#fff';
|
|
21
23
|
this.primary = this.theme.primary ?? '#AAA';
|
|
@@ -26,11 +28,11 @@ class DsvThemeComponent {
|
|
|
26
28
|
this.error = this.theme.error ?? '#da1709';
|
|
27
29
|
}
|
|
28
30
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvThemeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvThemeComponent, isStandalone: true, selector: "dsv-theme", inputs: { theme: "theme" }, host: { properties: { "style.--background": "this.background", "style.--background-dark": "this.backgroundDark", "style.--text": "this.text", "style.--text-dark": "this.textDark", "style.--primary": "this.primary", "style.--secondary": "this.secondary", "style.--success": "this.success", "style.--info": "this.info", "style.--warning": "this.warning", "style.--error": "this.error" } }, ngImport: i0, template:
|
|
31
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvThemeComponent, isStandalone: true, selector: "dsv-theme", inputs: { theme: "theme" }, host: { properties: { "style.--background": "this.background", "style.--background-dark": "this.backgroundDark", "style.--text": "this.text", "style.--text-dark": "this.textDark", "style.--primary": "this.primary", "style.--secondary": "this.secondary", "style.--success": "this.success", "style.--info": "this.info", "style.--warning": "this.warning", "style.--error": "this.error" } }, ngImport: i0, template: "<ng-content></ng-content>\n<div id=\"collapse\"></div>\n", styles: [":host{--white: #fff;--black: #000;--background: var(--background);--background-dark: var(--background-dark);--text: var(--text);--text-dark: var(--text-dark);--primary: var(--primary);--primary: var(--secondary);--success: var(--success);--info: var(--info);--warning: var(--warning);--error: var(--error);display:flex;flex:1;font-size:1rem!important;flex-direction:column;overflow:hidden;background-color:var(--background);color:var(--text)}:host #collapse{display:none;position:absolute;top:0;left:0;width:100%;height:100%;z-index:1200;background-color:#0009}:host #collapse.show{display:inline}::ng-deep .dark dsv-theme{background-color:var(--black);color:var(--text-dark)}\n"] });
|
|
30
32
|
}
|
|
31
33
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvThemeComponent, decorators: [{
|
|
32
34
|
type: Component,
|
|
33
|
-
args: [{ selector: 'dsv-theme', standalone: true, imports: [], template:
|
|
35
|
+
args: [{ selector: 'dsv-theme', standalone: true, imports: [], template: "<ng-content></ng-content>\n<div id=\"collapse\"></div>\n", styles: [":host{--white: #fff;--black: #000;--background: var(--background);--background-dark: var(--background-dark);--text: var(--text);--text-dark: var(--text-dark);--primary: var(--primary);--primary: var(--secondary);--success: var(--success);--info: var(--info);--warning: var(--warning);--error: var(--error);display:flex;flex:1;font-size:1rem!important;flex-direction:column;overflow:hidden;background-color:var(--background);color:var(--text)}:host #collapse{display:none;position:absolute;top:0;left:0;width:100%;height:100%;z-index:1200;background-color:#0009}:host #collapse.show{display:inline}::ng-deep .dark dsv-theme{background-color:var(--black);color:var(--text-dark)}\n"] }]
|
|
34
36
|
}], propDecorators: { theme: [{
|
|
35
37
|
type: Input
|
|
36
38
|
}], background: [{
|
|
@@ -65,9 +67,53 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
|
|
|
65
67
|
args: ['style.--error']
|
|
66
68
|
}] } });
|
|
67
69
|
|
|
70
|
+
class DsvThemeSwitchComponent {
|
|
71
|
+
themeService;
|
|
72
|
+
constructor(themeService) {
|
|
73
|
+
this.themeService = themeService;
|
|
74
|
+
}
|
|
75
|
+
switchTheme() {
|
|
76
|
+
this.themeService.switchTheme();
|
|
77
|
+
}
|
|
78
|
+
isLightMode() {
|
|
79
|
+
return this.themeService.themeMode() === 'light';
|
|
80
|
+
}
|
|
81
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvThemeSwitchComponent, deps: [{ token: ThemeService }], target: i0.ɵɵFactoryTarget.Component });
|
|
82
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvThemeSwitchComponent, isStandalone: true, selector: "dsv-theme-switch", ngImport: i0, template: "<dsv-button\n width=\"large\"\n color=\"inherit\"\n size=\"medium\"\n (callback)=\"switchTheme()\"\n [icon]=\"isLightMode() ? 'ri-contrast-2-line' : 'ri-contrast-2-fill'\"\n>\n</dsv-button>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DsvButtonComponent, selector: "dsv-button", inputs: ["libelle", "color", "icon", "iconEnd", "width", "variant", "fullwidth", "show", "disabled"], outputs: ["callback"] }] });
|
|
83
|
+
}
|
|
84
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvThemeSwitchComponent, decorators: [{
|
|
85
|
+
type: Component,
|
|
86
|
+
args: [{ selector: 'dsv-theme-switch', standalone: true, imports: [CommonModule, DsvButtonComponent], template: "<dsv-button\n width=\"large\"\n color=\"inherit\"\n size=\"medium\"\n (callback)=\"switchTheme()\"\n [icon]=\"isLightMode() ? 'ri-contrast-2-line' : 'ri-contrast-2-fill'\"\n>\n</dsv-button>\n" }]
|
|
87
|
+
}], ctorParameters: () => [{ type: ThemeService }] });
|
|
88
|
+
|
|
89
|
+
console.log('default theme :', localStorage.getItem('theme'));
|
|
90
|
+
class ThemeService {
|
|
91
|
+
themeMode = signal(localStorage.getItem('theme') ?? 'light');
|
|
92
|
+
constructor() {
|
|
93
|
+
let html = document.getElementsByTagName('body')[0];
|
|
94
|
+
html.classList.add(this.themeMode());
|
|
95
|
+
}
|
|
96
|
+
switchTheme() {
|
|
97
|
+
let html = document.getElementsByTagName('body')[0];
|
|
98
|
+
html.classList.remove(this.themeMode());
|
|
99
|
+
let newMode = this.themeMode() === 'dark' ? 'light' : 'dark';
|
|
100
|
+
this.themeMode.set(newMode);
|
|
101
|
+
localStorage.setItem('theme', newMode);
|
|
102
|
+
html.classList.add(newMode);
|
|
103
|
+
}
|
|
104
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
105
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ThemeService, providedIn: 'root' });
|
|
106
|
+
}
|
|
107
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ThemeService, decorators: [{
|
|
108
|
+
type: Injectable,
|
|
109
|
+
args: [{
|
|
110
|
+
providedIn: 'root',
|
|
111
|
+
}]
|
|
112
|
+
}], ctorParameters: () => [] });
|
|
113
|
+
|
|
68
114
|
/**
|
|
69
115
|
* Generated bundle index. Do not edit.
|
|
70
116
|
*/
|
|
71
117
|
|
|
72
|
-
export { DsvThemeComponent };
|
|
118
|
+
export { DsvThemeComponent, DsvThemeSwitchComponent, ThemeService };
|
|
73
119
|
//# sourceMappingURL=ng-vagabond-lab-ng-dsv-ds-theme.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-theme.mjs","sources":["../../../projects/ng-dsv/ds/theme/component/dsv.theme.component.ts","../../../projects/ng-dsv/ds/theme/ng-vagabond-lab-ng-dsv-ds-theme.ts"],"sourcesContent":["import { Component, HostBinding, Input } from '@angular/core';\n\nexport type ThemeType = {\n background?: string;\n backgroundDark?: string;\n text?: string;\n textDark?: string;\n primary?: string;\n secondary?: string;\n success?: string;\n info?: string;\n warning?: string;\n error?: string;\n};\n\n@Component({\n selector: 'dsv-theme',\n standalone: true,\n imports: [],\n
|
|
1
|
+
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-theme.mjs","sources":["../../../projects/ng-dsv/ds/theme/component/dsv.theme.component.ts","../../../projects/ng-dsv/ds/theme/component/dsv.theme.component.html","../../../projects/ng-dsv/ds/theme/component/switch/dsv.theme.switch.component.ts","../../../projects/ng-dsv/ds/theme/component/switch/dsv.theme.switch.component.html","../../../projects/ng-dsv/ds/theme/service/dsv.theme.service.ts","../../../projects/ng-dsv/ds/theme/ng-vagabond-lab-ng-dsv-ds-theme.ts"],"sourcesContent":["import { Component, HostBinding, Input } from '@angular/core';\n\nexport type ThemeType = {\n background?: string;\n backgroundDark?: string;\n text?: string;\n textDark?: string;\n primary?: string;\n secondary?: string;\n success?: string;\n info?: string;\n warning?: string;\n error?: string;\n};\n\n@Component({\n selector: 'dsv-theme',\n standalone: true,\n imports: [],\n templateUrl: './dsv.theme.component.html',\n styleUrls: ['./dsv.theme.component.scss'],\n})\nexport class DsvThemeComponent {\n @Input()\n theme: ThemeType = {};\n\n @HostBinding('style.--background')\n background!: string;\n\n @HostBinding('style.--background-dark')\n backgroundDark!: string;\n\n @HostBinding('style.--text')\n text!: string;\n\n @HostBinding('style.--text-dark')\n textDark!: string;\n\n @HostBinding('style.--primary')\n primary!: string;\n\n @HostBinding('style.--secondary')\n secondary!: string;\n\n @HostBinding('style.--success')\n success!: string;\n\n @HostBinding('style.--info')\n info!: string;\n\n @HostBinding('style.--warning')\n warning!: string;\n\n @HostBinding('style.--error')\n error!: string;\n\n ngOnInit() {\n this.background = this.theme.background ?? 'rgb(220, 220, 220)';\n this.backgroundDark = this.theme.backgroundDark ?? 'rgb(31, 31, 31)';\n this.text = this.theme.text ?? '#000';\n this.textDark = this.theme.textDark ?? '#fff';\n this.primary = this.theme.primary ?? '#AAA';\n this.secondary = this.theme.secondary ?? '#AAA';\n this.success = this.theme.success ?? '#439746';\n this.info = this.theme.info ?? '#1b78c4';\n this.warning = this.theme.warning ?? '#dca603';\n this.error = this.theme.error ?? '#da1709';\n }\n}\n","<ng-content></ng-content>\n<div id=\"collapse\"></div>\n","import { CommonModule } from '@angular/common';\nimport { Component } from '@angular/core';\nimport { DsvButtonComponent } from '@ng-vagabond-lab/ng-dsv/ds/button';\nimport { ThemeService } from '../../public-api';\n\nexport type Theme = {\n primary: string;\n text: string;\n};\n\n@Component({\n selector: 'dsv-theme-switch',\n standalone: true,\n imports: [CommonModule, DsvButtonComponent],\n templateUrl: `./dsv.theme.switch.component.html`,\n})\nexport class DsvThemeSwitchComponent {\n constructor(private themeService: ThemeService) {}\n\n switchTheme() {\n this.themeService.switchTheme();\n }\n\n isLightMode() {\n return this.themeService.themeMode() === 'light';\n }\n}\n","<dsv-button\n width=\"large\"\n color=\"inherit\"\n size=\"medium\"\n (callback)=\"switchTheme()\"\n [icon]=\"isLightMode() ? 'ri-contrast-2-line' : 'ri-contrast-2-fill'\"\n>\n</dsv-button>\n","import { Injectable, signal, WritableSignal } from '@angular/core';\n\nexport type ThemeMode = 'dark' | 'light';\n\nconsole.log('default theme :', localStorage.getItem('theme'));\n\n@Injectable({\n providedIn: 'root',\n})\nexport class ThemeService {\n themeMode: WritableSignal<ThemeMode> = signal(\n (localStorage.getItem('theme') as ThemeMode) ?? 'light'\n );\n\n constructor() {\n let html = document.getElementsByTagName('body')[0];\n html.classList.add(this.themeMode());\n }\n\n switchTheme() {\n let html = document.getElementsByTagName('body')[0];\n html.classList.remove(this.themeMode());\n\n let newMode: ThemeMode = this.themeMode() === 'dark' ? 'light' : 'dark';\n this.themeMode.set(newMode);\n localStorage.setItem('theme', newMode);\n html.classList.add(newMode);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.ThemeService"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as i2 from '@angular/common';
|
|
2
2
|
import { CommonModule } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { signal, Injectable,
|
|
4
|
+
import { signal, Injectable, effect, Component } from '@angular/core';
|
|
5
5
|
|
|
6
6
|
const MAX_TOASTS = 10;
|
|
7
7
|
const DURATION_DEFAULT = 5000;
|
|
@@ -54,8 +54,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
|
|
|
54
54
|
}] });
|
|
55
55
|
|
|
56
56
|
class DsvToastComponent {
|
|
57
|
-
toastService
|
|
58
|
-
constructor() {
|
|
57
|
+
toastService;
|
|
58
|
+
constructor(toastService) {
|
|
59
|
+
this.toastService = toastService;
|
|
59
60
|
effect(() => {
|
|
60
61
|
for (const toast of this.toastService.toasts()) {
|
|
61
62
|
if (this.toastService.toastShows().length < MAX_TOASTS) {
|
|
@@ -72,13 +73,13 @@ class DsvToastComponent {
|
|
|
72
73
|
duration: 10000,
|
|
73
74
|
});
|
|
74
75
|
}
|
|
75
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
76
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvToastComponent, isStandalone: true, selector: "dsv-toast", ngImport: i0, template: "<div class=\"dsv-toast-container\">\n <div class=\"dsv-toast\" *ngFor=\"let toast of toastService.toastShows()\"\n [ngClass]=\"toast.type + ' ' + (toast.filled ? 'filled' : '')\">\n <button class=\"close-button\" type=\"button\" (click)=\"toastService.closeToast(toast.uuid!)\">\n X\n </button>\n <i class=\"ri-check-fill\" *ngIf=\"toast.type === 'success'\"></i>\n <i class=\"ri-information-2-line\" *ngIf=\"toast.type === 'info'\"></i>\n <i class=\"ri-alert-line\" *ngIf=\"toast.type === 'warning'\"></i>\n <i class=\"ri-close-line\" *ngIf=\"toast.type === 'error'\"></i>\n\n {{ toast.text }}\n <div class=\"loader-container\">\n <div class=\"loader\" [style.width]=\"(toast.durationLeft! / toast.duration!) * 100 + '%'\"></div>\n </div>\n </div>\n</div>", styles: [".dsv-toast-container{position:fixed;bottom:0;right:0;display:flex;flex-direction:column;gap:8px;overflow:hidden;padding:5px}.dsv-toast-container .dsv-toast{font-size:1.2rem;border-radius:2px;box-shadow:0 0 0 .5px #0006;min-width:300px;padding:10px 15px;pointer-events:all;position:relative;display:flex;align-items:center;flex-direction:row;gap:8px;opacity:0;transform:translate(100%);animation:slideInRight .5s ease-out forwards}@keyframes slideInRight{to{opacity:1;transform:translate(0)}}.dsv-toast-container .dsv-toast.success{border-left:4px solid var(--success)}.dsv-toast-container .dsv-toast.success i{color:var(--success);font-size:1.2rem!important}.dsv-toast-container .dsv-toast.info{border-left:4px solid var(--info)}.dsv-toast-container .dsv-toast.info i{color:var(--info);font-size:1.2rem!important}.dsv-toast-container .dsv-toast.warning{border-left:4px solid var(--warning)}.dsv-toast-container .dsv-toast.warning i{color:var(--warning);font-size:1.2rem!important}.dsv-toast-container .dsv-toast.error{border-left:4px solid var(--error)}.dsv-toast-container .dsv-toast.error i{color:var(--error);font-size:1.2rem!important}.dsv-toast-container .dsv-toast .close-button{position:absolute;top:6px;right:10px;font-size:1rem;border:0;background-color:inherit;cursor:pointer}.dsv-toast-container .dsv-toast .close-button:hover{background-color:#f9f9f9;border-radius:5px}::ng-deep .dark .dsv-toast-container .dsv-toast .close-button{color:#fff}::ng-deep .dark .dsv-toast-container .dsv-toast .close-button:hover{background-color:#212121!important}.dsv-toast-container .dsv-toast .loader-container{position:absolute;bottom:0;left:0;width:100%}.dsv-toast-container .dsv-toast .loader-container .loader{border:1px solid #b8b8b8}::ng-deep .light .dsv-toast-container .dsv-toast{background-color:#fff;color:#000}::ng-deep .dark .dsv-toast-container .dsv-toast{background-color:#000;color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
76
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvToastComponent, deps: [{ token: ToastService }], target: i0.ɵɵFactoryTarget.Component });
|
|
77
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: DsvToastComponent, isStandalone: true, selector: "dsv-toast", ngImport: i0, template: "<div class=\"dsv-toast-container\">\n <div class=\"dsv-toast\" *ngFor=\"let toast of toastService.toastShows()\"\n [ngClass]=\"toast.type + ' ' + (toast.filled ? 'filled' : '')\">\n <button class=\"close-button\" type=\"button\" (click)=\"toastService.closeToast(toast.uuid!)\">\n X\n </button>\n <i class=\"ri-check-fill\" *ngIf=\"toast.type === 'success'\"></i>\n <i class=\"ri-information-2-line\" *ngIf=\"toast.type === 'info'\"></i>\n <i class=\"ri-alert-line\" *ngIf=\"toast.type === 'warning'\"></i>\n <i class=\"ri-close-line\" *ngIf=\"toast.type === 'error'\"></i>\n\n {{ toast.text }}\n <div class=\"loader-container\">\n <div class=\"loader\" [style.width]=\"(toast.durationLeft! / toast.duration!) * 100 + '%'\"></div>\n </div>\n </div>\n</div>", styles: [".dsv-toast-container{position:fixed;bottom:0;right:0;display:flex;flex-direction:column;gap:8px;overflow:hidden;padding:5px}.dsv-toast-container .dsv-toast{font-size:1.2rem;border-radius:2px;box-shadow:0 0 0 .5px #0006;min-width:300px;padding:10px 15px;pointer-events:all;position:relative;display:flex;align-items:center;flex-direction:row;gap:8px;opacity:0;transform:translate(100%);animation:slideInRight .5s ease-out forwards}@keyframes slideInRight{to{opacity:1;transform:translate(0)}}.dsv-toast-container .dsv-toast.success{border-left:4px solid var(--success)}.dsv-toast-container .dsv-toast.success i{color:var(--success);font-size:1.2rem!important}.dsv-toast-container .dsv-toast.info{border-left:4px solid var(--info)}.dsv-toast-container .dsv-toast.info i{color:var(--info);font-size:1.2rem!important}.dsv-toast-container .dsv-toast.warning{border-left:4px solid var(--warning)}.dsv-toast-container .dsv-toast.warning i{color:var(--warning);font-size:1.2rem!important}.dsv-toast-container .dsv-toast.error{border-left:4px solid var(--error)}.dsv-toast-container .dsv-toast.error i{color:var(--error);font-size:1.2rem!important}.dsv-toast-container .dsv-toast .close-button{position:absolute;top:6px;right:10px;font-size:1rem;border:0;background-color:inherit;cursor:pointer}.dsv-toast-container .dsv-toast .close-button:hover{background-color:#f9f9f9;border-radius:5px}::ng-deep .dark .dsv-toast-container .dsv-toast .close-button{color:#fff}::ng-deep .dark .dsv-toast-container .dsv-toast .close-button:hover{background-color:#212121!important}.dsv-toast-container .dsv-toast .loader-container{position:absolute;bottom:0;left:0;width:100%}.dsv-toast-container .dsv-toast .loader-container .loader{border:1px solid #b8b8b8}::ng-deep .light .dsv-toast-container .dsv-toast{background-color:#fff;color:#000}::ng-deep .dark .dsv-toast-container .dsv-toast{background-color:#000;color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
77
78
|
}
|
|
78
79
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DsvToastComponent, decorators: [{
|
|
79
80
|
type: Component,
|
|
80
81
|
args: [{ selector: 'dsv-toast', standalone: true, imports: [CommonModule], template: "<div class=\"dsv-toast-container\">\n <div class=\"dsv-toast\" *ngFor=\"let toast of toastService.toastShows()\"\n [ngClass]=\"toast.type + ' ' + (toast.filled ? 'filled' : '')\">\n <button class=\"close-button\" type=\"button\" (click)=\"toastService.closeToast(toast.uuid!)\">\n X\n </button>\n <i class=\"ri-check-fill\" *ngIf=\"toast.type === 'success'\"></i>\n <i class=\"ri-information-2-line\" *ngIf=\"toast.type === 'info'\"></i>\n <i class=\"ri-alert-line\" *ngIf=\"toast.type === 'warning'\"></i>\n <i class=\"ri-close-line\" *ngIf=\"toast.type === 'error'\"></i>\n\n {{ toast.text }}\n <div class=\"loader-container\">\n <div class=\"loader\" [style.width]=\"(toast.durationLeft! / toast.duration!) * 100 + '%'\"></div>\n </div>\n </div>\n</div>", styles: [".dsv-toast-container{position:fixed;bottom:0;right:0;display:flex;flex-direction:column;gap:8px;overflow:hidden;padding:5px}.dsv-toast-container .dsv-toast{font-size:1.2rem;border-radius:2px;box-shadow:0 0 0 .5px #0006;min-width:300px;padding:10px 15px;pointer-events:all;position:relative;display:flex;align-items:center;flex-direction:row;gap:8px;opacity:0;transform:translate(100%);animation:slideInRight .5s ease-out forwards}@keyframes slideInRight{to{opacity:1;transform:translate(0)}}.dsv-toast-container .dsv-toast.success{border-left:4px solid var(--success)}.dsv-toast-container .dsv-toast.success i{color:var(--success);font-size:1.2rem!important}.dsv-toast-container .dsv-toast.info{border-left:4px solid var(--info)}.dsv-toast-container .dsv-toast.info i{color:var(--info);font-size:1.2rem!important}.dsv-toast-container .dsv-toast.warning{border-left:4px solid var(--warning)}.dsv-toast-container .dsv-toast.warning i{color:var(--warning);font-size:1.2rem!important}.dsv-toast-container .dsv-toast.error{border-left:4px solid var(--error)}.dsv-toast-container .dsv-toast.error i{color:var(--error);font-size:1.2rem!important}.dsv-toast-container .dsv-toast .close-button{position:absolute;top:6px;right:10px;font-size:1rem;border:0;background-color:inherit;cursor:pointer}.dsv-toast-container .dsv-toast .close-button:hover{background-color:#f9f9f9;border-radius:5px}::ng-deep .dark .dsv-toast-container .dsv-toast .close-button{color:#fff}::ng-deep .dark .dsv-toast-container .dsv-toast .close-button:hover{background-color:#212121!important}.dsv-toast-container .dsv-toast .loader-container{position:absolute;bottom:0;left:0;width:100%}.dsv-toast-container .dsv-toast .loader-container .loader{border:1px solid #b8b8b8}::ng-deep .light .dsv-toast-container .dsv-toast{background-color:#fff;color:#000}::ng-deep .dark .dsv-toast-container .dsv-toast{background-color:#000;color:#fff}\n"] }]
|
|
81
|
-
}], ctorParameters: () => [] });
|
|
82
|
+
}], ctorParameters: () => [{ type: ToastService }] });
|
|
82
83
|
|
|
83
84
|
/**
|
|
84
85
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-toast.mjs","sources":["../../../projects/ng-dsv/ds/toast/service/toast.service.ts","../../../projects/ng-dsv/ds/toast/component/toast.component.ts","../../../projects/ng-dsv/ds/toast/component/toast.component.html","../../../projects/ng-dsv/ds/toast/ng-vagabond-lab-ng-dsv-ds-toast.ts"],"sourcesContent":["import { Injectable, signal, WritableSignal } from '@angular/core';\nimport { IToastDto } from '../dto/toast.dto';\n\nexport const MAX_TOASTS = 10;\nexport const DURATION_DEFAULT = 5000;\nexport const DURATION_TIMEOUT = 10;\n\n@Injectable({\n providedIn: 'root',\n})\nexport class ToastService {\n toastShows: WritableSignal<IToastDto[]> = signal([]);\n toasts: WritableSignal<IToastDto[]> = signal([]);\n\n showToast(toast: IToastDto) {\n toast.uuid = crypto.randomUUID();\n toast.type = toast.type ?? 'success';\n toast.duration = toast.duration ?? DURATION_DEFAULT;\n toast.durationLeft = toast.duration;\n toast.filled = toast.filled ?? false;\n this.toasts.update((toasts) => [...toasts, toast]);\n }\n\n consumeToast(toast: IToastDto) {\n this.toastShows.update((toasts) => [...toasts, toast]);\n let duration = 0;\n const interval = setInterval(() => {\n duration += DURATION_TIMEOUT;\n if (duration > toast.duration!) {\n clearInterval(interval);\n this.closeToast(toast.uuid!);\n } else {\n this.toastShows.update((toasts) =>\n toasts.map((oneToast) => {\n if (oneToast.uuid === toast.uuid) {\n oneToast.durationLeft = toast.duration! - duration;\n }\n return oneToast;\n })\n );\n }\n }, DURATION_TIMEOUT);\n this.removeToastFromQueue(toast.uuid!);\n }\n\n closeToast(uuid: string) {\n this.toastShows.update((toasts) => toasts.filter((t) => t.uuid !== uuid));\n }\n\n removeToastFromQueue(uuid: string) {\n this.toasts.update((toasts) => toasts.filter((t) => t.uuid !== uuid));\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { Component, effect
|
|
1
|
+
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-toast.mjs","sources":["../../../projects/ng-dsv/ds/toast/service/toast.service.ts","../../../projects/ng-dsv/ds/toast/component/toast.component.ts","../../../projects/ng-dsv/ds/toast/component/toast.component.html","../../../projects/ng-dsv/ds/toast/ng-vagabond-lab-ng-dsv-ds-toast.ts"],"sourcesContent":["import { Injectable, signal, WritableSignal } from '@angular/core';\nimport { IToastDto } from '../dto/toast.dto';\n\nexport const MAX_TOASTS = 10;\nexport const DURATION_DEFAULT = 5000;\nexport const DURATION_TIMEOUT = 10;\n\n@Injectable({\n providedIn: 'root',\n})\nexport class ToastService {\n toastShows: WritableSignal<IToastDto[]> = signal([]);\n toasts: WritableSignal<IToastDto[]> = signal([]);\n\n showToast(toast: IToastDto) {\n toast.uuid = crypto.randomUUID();\n toast.type = toast.type ?? 'success';\n toast.duration = toast.duration ?? DURATION_DEFAULT;\n toast.durationLeft = toast.duration;\n toast.filled = toast.filled ?? false;\n this.toasts.update((toasts) => [...toasts, toast]);\n }\n\n consumeToast(toast: IToastDto) {\n this.toastShows.update((toasts) => [...toasts, toast]);\n let duration = 0;\n const interval = setInterval(() => {\n duration += DURATION_TIMEOUT;\n if (duration > toast.duration!) {\n clearInterval(interval);\n this.closeToast(toast.uuid!);\n } else {\n this.toastShows.update((toasts) =>\n toasts.map((oneToast) => {\n if (oneToast.uuid === toast.uuid) {\n oneToast.durationLeft = toast.duration! - duration;\n }\n return oneToast;\n })\n );\n }\n }, DURATION_TIMEOUT);\n this.removeToastFromQueue(toast.uuid!);\n }\n\n closeToast(uuid: string) {\n this.toastShows.update((toasts) => toasts.filter((t) => t.uuid !== uuid));\n }\n\n removeToastFromQueue(uuid: string) {\n this.toasts.update((toasts) => toasts.filter((t) => t.uuid !== uuid));\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { Component, effect } from '@angular/core';\nimport { MAX_TOASTS, ToastService } from '../service/toast.service';\n\nexport type Theme = {\n primary: string;\n text: string;\n};\n\n@Component({\n selector: 'dsv-toast',\n standalone: true,\n imports: [CommonModule],\n templateUrl: './toast.component.html',\n styleUrls: ['./toast.component.scss'],\n})\nexport class DsvToastComponent {\n constructor(protected toastService: ToastService) {\n effect(() => {\n for (const toast of this.toastService.toasts()) {\n if (this.toastService.toastShows().length < MAX_TOASTS) {\n this.toastService.consumeToast(toast);\n }\n }\n });\n }\n\n ngOnInit() {\n this.toastService.showToast({\n text: 'test',\n type: 'success',\n filled: true,\n duration: 10000,\n });\n }\n}\n","<div class=\"dsv-toast-container\">\n <div class=\"dsv-toast\" *ngFor=\"let toast of toastService.toastShows()\"\n [ngClass]=\"toast.type + ' ' + (toast.filled ? 'filled' : '')\">\n <button class=\"close-button\" type=\"button\" (click)=\"toastService.closeToast(toast.uuid!)\">\n X\n </button>\n <i class=\"ri-check-fill\" *ngIf=\"toast.type === 'success'\"></i>\n <i class=\"ri-information-2-line\" *ngIf=\"toast.type === 'info'\"></i>\n <i class=\"ri-alert-line\" *ngIf=\"toast.type === 'warning'\"></i>\n <i class=\"ri-close-line\" *ngIf=\"toast.type === 'error'\"></i>\n\n {{ toast.text }}\n <div class=\"loader-container\">\n <div class=\"loader\" [style.width]=\"(toast.durationLeft! / toast.duration!) * 100 + '%'\"></div>\n </div>\n </div>\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.ToastService"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ng-vagabond-lab/ng-dsv",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.6",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@angular/common": "^19.1.7",
|
|
6
6
|
"@angular/core": "^19.1.7"
|
|
@@ -43,13 +43,29 @@
|
|
|
43
43
|
"types": "./ds/card/index.d.ts",
|
|
44
44
|
"default": "./fesm2022/ng-vagabond-lab-ng-dsv-ds-card.mjs"
|
|
45
45
|
},
|
|
46
|
-
"./ds/
|
|
47
|
-
"types": "./ds/
|
|
48
|
-
"default": "./fesm2022/ng-vagabond-lab-ng-dsv-ds-
|
|
46
|
+
"./ds/container": {
|
|
47
|
+
"types": "./ds/container/index.d.ts",
|
|
48
|
+
"default": "./fesm2022/ng-vagabond-lab-ng-dsv-ds-container.mjs"
|
|
49
|
+
},
|
|
50
|
+
"./ds/header": {
|
|
51
|
+
"types": "./ds/header/index.d.ts",
|
|
52
|
+
"default": "./fesm2022/ng-vagabond-lab-ng-dsv-ds-header.mjs"
|
|
53
|
+
},
|
|
54
|
+
"./ds/item": {
|
|
55
|
+
"types": "./ds/item/index.d.ts",
|
|
56
|
+
"default": "./fesm2022/ng-vagabond-lab-ng-dsv-ds-item.mjs"
|
|
57
|
+
},
|
|
58
|
+
"./ds/menu": {
|
|
59
|
+
"types": "./ds/menu/index.d.ts",
|
|
60
|
+
"default": "./fesm2022/ng-vagabond-lab-ng-dsv-ds-menu.mjs"
|
|
49
61
|
},
|
|
50
62
|
"./ds/theme": {
|
|
51
63
|
"types": "./ds/theme/index.d.ts",
|
|
52
64
|
"default": "./fesm2022/ng-vagabond-lab-ng-dsv-ds-theme.mjs"
|
|
65
|
+
},
|
|
66
|
+
"./ds/toast": {
|
|
67
|
+
"types": "./ds/toast/index.d.ts",
|
|
68
|
+
"default": "./fesm2022/ng-vagabond-lab-ng-dsv-ds-toast.mjs"
|
|
53
69
|
}
|
|
54
70
|
}
|
|
55
71
|
}
|