@ng-atomic/components 19.34.0 → 19.36.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/ng-atomic-components-atoms-chips-input.mjs +2 -2
- package/fesm2022/ng-atomic-components-atoms-chips-input.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-atoms-icon.mjs +2 -2
- package/fesm2022/ng-atomic-components-atoms-value-cell.mjs +4 -4
- package/fesm2022/ng-atomic-components-atoms-value-cell.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-extras-editor.mjs +3 -2
- package/fesm2022/ng-atomic-components-extras-editor.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-frames-app.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-app.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-frames-auto-layout.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-breadcrumb-navbar.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-card.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-columns.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-divider.mjs +3 -3
- package/fesm2022/ng-atomic-components-frames-divider.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-frames-drawer.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-entrance.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-fab.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-fab.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-frames-horizontal-divider.mjs +3 -3
- package/fesm2022/ng-atomic-components-frames-horizontal-divider.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-frames-line-up.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-line-up.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-frames-loading.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-router-outlet.mjs +3 -3
- package/fesm2022/ng-atomic-components-frames-router-outlet.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-frames-scroll.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-side-nav.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-side-nav.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-frames-smart-menu.mjs +2 -2
- package/fesm2022/ng-atomic-components-frames-vertical-hide.mjs +2 -2
- package/fesm2022/ng-atomic-components-molecules-actions-column.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-molecules-checkbox-column.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-molecules-date-input-field.mjs +2 -2
- package/fesm2022/ng-atomic-components-molecules-date-range-input-field.mjs +2 -2
- package/fesm2022/ng-atomic-components-molecules-date-range-input-field.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-molecules-file-input-field.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-molecules-grid-item.mjs +2 -2
- package/fesm2022/ng-atomic-components-molecules-loading-box.mjs +2 -2
- package/fesm2022/ng-atomic-components-molecules-navigation-list-item.mjs +2 -2
- package/fesm2022/ng-atomic-components-molecules-navigation-list-item.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-molecules-nested-menu.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-molecules-select-input-field.mjs +2 -2
- package/fesm2022/ng-atomic-components-molecules-textarea-field.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-molecules-thread-message.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-action-buttons-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-action-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-agreement-input-section.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-organisms-breadcrumb-navbar.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-card-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-cvc-and-exp-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-date-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-date-range-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-definition-list.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-file-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-graphql-editor.mjs +1 -1
- package/fesm2022/ng-atomic-components-organisms-graphql-editor.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-organisms-grid-cards-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-heading.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-menu-footer.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-menu-header.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-mermaid-section.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-organisms-messages-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-navigation-list.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-navigator.mjs +3 -2
- package/fesm2022/ng-atomic-components-organisms-navigator.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-organisms-number-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-paginator.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-password-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-select-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-slider-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-social-login-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-table.mjs +6 -5
- package/fesm2022/ng-atomic-components-organisms-table.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-organisms-terminal.mjs +1 -2
- package/fesm2022/ng-atomic-components-organisms-terminal.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-organisms-text-input-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-textarea-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-thread-messages-section.mjs +2 -2
- package/fesm2022/ng-atomic-components-organisms-tree-list.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-organisms-tree-section.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-pages-_index.mjs +6 -4
- package/fesm2022/ng-atomic-components-pages-_index.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-pages-columns.mjs +2 -2
- package/fesm2022/ng-atomic-components-pages-columns.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-pages-form.mjs +2 -2
- package/fesm2022/ng-atomic-components-pages-form.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-services-global-iframe.mjs +2 -1
- package/fesm2022/ng-atomic-components-services-global-iframe.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-templates-_index.mjs +2 -2
- package/fesm2022/ng-atomic-components-templates-_index.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-templates-background.mjs +2 -2
- package/fesm2022/ng-atomic-components-templates-code-editor.mjs +2 -2
- package/fesm2022/ng-atomic-components-templates-columns.mjs +2 -2
- package/fesm2022/ng-atomic-components-templates-columns.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-templates-entrance.mjs +2 -2
- package/fesm2022/ng-atomic-components-templates-form.mjs +5 -5
- package/fesm2022/ng-atomic-components-templates-form.mjs.map +1 -1
- package/fesm2022/ng-atomic-components-templates-icon-button-menu.mjs +2 -2
- package/fesm2022/ng-atomic-components-templates-menu.mjs +2 -2
- package/fesm2022/ng-atomic-components-templates-selection.mjs +2 -2
- package/fesm2022/ng-atomic-components-templates-settings.mjs +2 -2
- package/package.json +3 -3
- package/types/ng-atomic-components-atoms-chips-input.d.ts +1 -1
- package/types/ng-atomic-components-atoms-icon.d.ts +1 -1
- package/types/ng-atomic-components-atoms-menu-button.d.ts +2 -2
- package/types/ng-atomic-components-atoms-value-cell.d.ts +5 -5
- package/types/ng-atomic-components-extras-editor.d.ts +1 -1
- package/types/ng-atomic-components-extras.d.ts +1 -1
- package/types/ng-atomic-components-frames-app.d.ts +20 -20
- package/types/ng-atomic-components-frames-breadcrumb-navbar.d.ts +1 -1
- package/types/ng-atomic-components-frames-columns.d.ts +4 -4
- package/types/ng-atomic-components-frames-entrance.d.ts +2 -2
- package/types/ng-atomic-components-frames-fab.d.ts +3 -3
- package/types/ng-atomic-components-frames-fab.d.ts.map +1 -1
- package/types/ng-atomic-components-frames-line-up.d.ts +3 -3
- package/types/ng-atomic-components-frames-router-outlet.d.ts +5 -5
- package/types/ng-atomic-components-frames-side-app.d.ts +1 -1
- package/types/ng-atomic-components-frames-side-nav.d.ts +9 -9
- package/types/ng-atomic-components-molecules-action-input-field.d.ts +1 -1
- package/types/ng-atomic-components-molecules-actions-column.d.ts +2 -2
- package/types/ng-atomic-components-molecules-checkbox-column.d.ts +2 -2
- package/types/ng-atomic-components-molecules-chips-input-field.d.ts +5 -5
- package/types/ng-atomic-components-molecules-date-input-field.d.ts +3 -3
- package/types/ng-atomic-components-molecules-date-range-input-field.d.ts +2 -2
- package/types/ng-atomic-components-molecules-file-input-field.d.ts +5 -5
- package/types/ng-atomic-components-molecules-grid-item.d.ts +1 -1
- package/types/ng-atomic-components-molecules-list-item.d.ts +3 -3
- package/types/ng-atomic-components-molecules-loading-box.d.ts +1 -1
- package/types/ng-atomic-components-molecules-nested-menu.d.ts +1 -1
- package/types/ng-atomic-components-molecules-nested-menu.d.ts.map +1 -1
- package/types/ng-atomic-components-molecules-select-input-field.d.ts +3 -3
- package/types/ng-atomic-components-molecules-text-column.d.ts +2 -2
- package/types/ng-atomic-components-molecules-text-input-field.d.ts +4 -4
- package/types/ng-atomic-components-molecules-textarea-field.d.ts +2 -2
- package/types/ng-atomic-components-molecules-textarea-field.d.ts.map +1 -1
- package/types/ng-atomic-components-molecules-thread-message.d.ts +3 -3
- package/types/ng-atomic-components-molecules-tree-column.d.ts +3 -3
- package/types/ng-atomic-components-organisms-action-input-section.d.ts +2 -2
- package/types/ng-atomic-components-organisms-agreement-input-section.d.ts +1 -1
- package/types/ng-atomic-components-organisms-breadcrumb-navbar.d.ts +1 -1
- package/types/ng-atomic-components-organisms-card-input-section.d.ts +1 -1
- package/types/ng-atomic-components-organisms-chips-input-section.d.ts +1 -1
- package/types/ng-atomic-components-organisms-date-input-section.d.ts +2 -2
- package/types/ng-atomic-components-organisms-date-range-input-section.d.ts +2 -2
- package/types/ng-atomic-components-organisms-file-input-section.d.ts +2 -2
- package/types/ng-atomic-components-organisms-filters-section.d.ts +3 -3
- package/types/ng-atomic-components-organisms-graphql-editor.d.ts +1 -1
- package/types/ng-atomic-components-organisms-grid-toolbar.d.ts +1 -1
- package/types/ng-atomic-components-organisms-image-preview-section.d.ts +1 -1
- package/types/ng-atomic-components-organisms-list.d.ts +3 -3
- package/types/ng-atomic-components-organisms-menu-header.d.ts +1 -1
- package/types/ng-atomic-components-organisms-mermaid-section.d.ts +2 -2
- package/types/ng-atomic-components-organisms-message-input-section.d.ts +1 -1
- package/types/ng-atomic-components-organisms-navigator.d.ts +2 -2
- package/types/ng-atomic-components-organisms-navigator.d.ts.map +1 -1
- package/types/ng-atomic-components-organisms-number-input-section.d.ts +2 -2
- package/types/ng-atomic-components-organisms-paginator.d.ts +4 -4
- package/types/ng-atomic-components-organisms-password-input-section.d.ts +2 -2
- package/types/ng-atomic-components-organisms-select-input-section.d.ts +4 -4
- package/types/ng-atomic-components-organisms-slider-input-section.d.ts +6 -6
- package/types/ng-atomic-components-organisms-stripe-input-section.d.ts +55 -55
- package/types/ng-atomic-components-organisms-table.d.ts +39 -19
- package/types/ng-atomic-components-organisms-table.d.ts.map +1 -1
- package/types/ng-atomic-components-organisms-text-input-section.d.ts +2 -2
- package/types/ng-atomic-components-organisms-textarea-section.d.ts +2 -2
- package/types/ng-atomic-components-organisms-time-range-input-section.d.ts +2 -2
- package/types/ng-atomic-components-organisms-toolbar.d.ts +1 -1
- package/types/ng-atomic-components-organisms-tree-section.d.ts +1 -1
- package/types/ng-atomic-components-organisms-video-section.d.ts +4 -4
- package/types/ng-atomic-components-pages-_index.d.ts +29 -29
- package/types/ng-atomic-components-pages-_index.d.ts.map +1 -1
- package/types/ng-atomic-components-pages-columns.d.ts +1 -1
- package/types/ng-atomic-components-pages-columns.d.ts.map +1 -1
- package/types/ng-atomic-components-pages-form.d.ts +13 -12
- package/types/ng-atomic-components-pages-form.d.ts.map +1 -1
- package/types/ng-atomic-components-pages-terms.d.ts +9 -9
- package/types/ng-atomic-components-services-global-iframe.d.ts +1 -1
- package/types/ng-atomic-components-services-global-iframe.d.ts.map +1 -1
- package/types/ng-atomic-components-templates-_index.d.ts +52 -50
- package/types/ng-atomic-components-templates-_index.d.ts.map +1 -1
- package/types/ng-atomic-components-templates-code-editor.d.ts +1 -1
- package/types/ng-atomic-components-templates-columns.d.ts +17 -17
- package/types/ng-atomic-components-templates-entrance.d.ts +2 -2
- package/types/ng-atomic-components-templates-form.d.ts +7 -7
- package/types/ng-atomic-components-templates-menu.d.ts +1 -1
- package/types/ng-atomic-components-templates-term.d.ts +1 -1
- package/types/ng-atomic-components-templates-thread.d.ts +3 -3
|
@@ -68,7 +68,7 @@ class BreadcrumbNavbarFrame extends NgAtomicComponent {
|
|
|
68
68
|
<div class="breadcrumb-navbar-content">
|
|
69
69
|
<ng-content />
|
|
70
70
|
</div>
|
|
71
|
-
`, isInline: true, styles: [":host{display:block;--primary-color: inherit;--primary-color-SCOPED-IN-navigator-
|
|
71
|
+
`, isInline: true, styles: [":host{display:block;--primary-color: inherit;--primary-color-SCOPED-IN-navigator-HUvt: var(--primary-color);--on-primary-color: inherit;--on-primary-color-SCOPED-IN-navigator-HUvt: var(--on-primary-color);--secondary-color: inherit;--secondary-color-SCOPED-IN-navigator-HUvt: var(--secondary-color);--on-secondary-color: inherit;--on-secondary-color-SCOPED-IN-navigator-HUvt: var(--on-secondary-color);--background-color: inherit;--background-color-SCOPED-IN-navigator-HUvt: var(--background-color);--on-background-color: inherit;--on-background-color-SCOPED-IN-navigator-HUvt: var(--on-background-color)}:host{display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-navigator-HUvt);--on-primary-color: var(--on-primary-color-SCOPED-IN-navigator-HUvt);--secondary-color: var(--secondary-color-SCOPED-IN-navigator-HUvt);--on-secondary-color: var(--on-secondary-color-SCOPED-IN-navigator-HUvt);--background-color: var(--background-color-SCOPED-IN-navigator-HUvt);--on-background-color: var(--on-background-color-SCOPED-IN-navigator-HUvt)}:host .breadcrumb-navbar-frame{width:100%;z-index:100;background:var(--primary-color-SCOPED-IN-navigator-HUvt)}:host .breadcrumb-navbar-frame.fixed{position:fixed;top:0;left:0;right:0}:host .breadcrumb-navbar-frame ::ng-deep organisms-breadcrumb-navbar mat-toolbar{border-bottom:none}:host .breadcrumb-navbar-content{width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: BreadcrumbNavbarOrganismStore, selector: "organisms-breadcrumb-navbar", inputs: ["items", "separator", "showHome", "homeIcon", "homeLink", "showLogo", "logoHeight", "logoWidth", "endActions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
72
72
|
}
|
|
73
73
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: BreadcrumbNavbarFrame, decorators: [{
|
|
74
74
|
type: Component,
|
|
@@ -105,7 +105,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImpor
|
|
|
105
105
|
'hideOnMobile',
|
|
106
106
|
],
|
|
107
107
|
}
|
|
108
|
-
], styles: [":host{display:block;--primary-color: inherit;--primary-color-SCOPED-IN-navigator-
|
|
108
|
+
], styles: [":host{display:block;--primary-color: inherit;--primary-color-SCOPED-IN-navigator-HUvt: var(--primary-color);--on-primary-color: inherit;--on-primary-color-SCOPED-IN-navigator-HUvt: var(--on-primary-color);--secondary-color: inherit;--secondary-color-SCOPED-IN-navigator-HUvt: var(--secondary-color);--on-secondary-color: inherit;--on-secondary-color-SCOPED-IN-navigator-HUvt: var(--on-secondary-color);--background-color: inherit;--background-color-SCOPED-IN-navigator-HUvt: var(--background-color);--on-background-color: inherit;--on-background-color-SCOPED-IN-navigator-HUvt: var(--on-background-color)}:host{display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-navigator-HUvt);--on-primary-color: var(--on-primary-color-SCOPED-IN-navigator-HUvt);--secondary-color: var(--secondary-color-SCOPED-IN-navigator-HUvt);--on-secondary-color: var(--on-secondary-color-SCOPED-IN-navigator-HUvt);--background-color: var(--background-color-SCOPED-IN-navigator-HUvt);--on-background-color: var(--on-background-color-SCOPED-IN-navigator-HUvt)}:host .breadcrumb-navbar-frame{width:100%;z-index:100;background:var(--primary-color-SCOPED-IN-navigator-HUvt)}:host .breadcrumb-navbar-frame.fixed{position:fixed;top:0;left:0;right:0}:host .breadcrumb-navbar-frame ::ng-deep organisms-breadcrumb-navbar mat-toolbar{border-bottom:none}:host .breadcrumb-navbar-content{width:100%;height:100%}\n"] }]
|
|
109
109
|
}] });
|
|
110
110
|
|
|
111
111
|
/**
|
|
@@ -5,13 +5,13 @@ import { MatCardModule } from '@angular/material/card';
|
|
|
5
5
|
|
|
6
6
|
class CardFrame {
|
|
7
7
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CardFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.6", type: CardFrame, isStandalone: true, selector: "frames-card", ngImport: i0, template: `<mat-card><ng-content></ng-content></mat-card>`, isInline: true, styles: [":host{display:block;--background-color: rgba(255, 255, 255, .6);--background-color-SCOPED-IN-columns-
|
|
8
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.6", type: CardFrame, isStandalone: true, selector: "frames-card", ngImport: i0, template: `<mat-card><ng-content></ng-content></mat-card>`, isInline: true, styles: [":host{display:block;--background-color: rgba(255, 255, 255, .6);--background-color-SCOPED-IN-columns-8h2s: var(--background-color)}:host{display:block}:host mat-card{background-color:var(--background-color-SCOPED-IN-columns-8h2s);display:flex;justify-content:center;align-items:center;flex-direction:column;padding:24px;box-sizing:border-box;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
9
9
|
}
|
|
10
10
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: CardFrame, decorators: [{
|
|
11
11
|
type: Component,
|
|
12
12
|
args: [{ selector: 'frames-card', imports: [
|
|
13
13
|
MatCardModule
|
|
14
|
-
], template: `<mat-card><ng-content></ng-content></mat-card>`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;--background-color: rgba(255, 255, 255, .6);--background-color-SCOPED-IN-columns-
|
|
14
|
+
], template: `<mat-card><ng-content></ng-content></mat-card>`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;--background-color: rgba(255, 255, 255, .6);--background-color-SCOPED-IN-columns-8h2s: var(--background-color)}:host{display:block}:host mat-card{background-color:var(--background-color-SCOPED-IN-columns-8h2s);display:flex;justify-content:center;align-items:center;flex-direction:column;padding:24px;box-sizing:border-box;width:100%}\n"] }]
|
|
15
15
|
}] });
|
|
16
16
|
|
|
17
17
|
/**
|
|
@@ -103,7 +103,7 @@ class ColumnsFrame extends NgAtomicComponent {
|
|
|
103
103
|
<ng-container [ngTemplateOutlet]="right()?.templateRef" />
|
|
104
104
|
</div>
|
|
105
105
|
}
|
|
106
|
-
`, isInline: true, styles: [":host{display:block;--side-width: 360px;--side-width-SCOPED-IN-columns-
|
|
106
|
+
`, isInline: true, styles: [":host{display:block;--side-width: 360px;--side-width-SCOPED-IN-columns-fWOw: var(--side-width)}:host{display:flex;flex-direction:row;justify-content:space-between;width:100%;height:100%}:host[type=row]{flex-direction:row;justify-content:space-between}:host[type=row] .container{width:100%}:host[type=row] .container.left{max-width:var(--side-width-SCOPED-IN-columns-fWOw)}:host[type=row] .container.right{max-width:var(--side-width-SCOPED-IN-columns-fWOw)}:host[type=column]{flex-direction:column;justify-content:flex-start}:host[type=column] .container.main{width:100%}:host[type=column] .container.left{width:100%}:host[type=column] .container.right{width:100%}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
107
107
|
}
|
|
108
108
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: ColumnsFrame, decorators: [{
|
|
109
109
|
type: Component,
|
|
@@ -134,7 +134,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImpor
|
|
|
134
134
|
}
|
|
135
135
|
], host: {
|
|
136
136
|
'[attr.type]': 'store.type()',
|
|
137
|
-
}, styles: [":host{display:block;--side-width: 360px;--side-width-SCOPED-IN-columns-
|
|
137
|
+
}, styles: [":host{display:block;--side-width: 360px;--side-width-SCOPED-IN-columns-fWOw: var(--side-width)}:host{display:flex;flex-direction:row;justify-content:space-between;width:100%;height:100%}:host[type=row]{flex-direction:row;justify-content:space-between}:host[type=row] .container{width:100%}:host[type=row] .container.left{max-width:var(--side-width-SCOPED-IN-columns-fWOw)}:host[type=row] .container.right{max-width:var(--side-width-SCOPED-IN-columns-fWOw)}:host[type=column]{flex-direction:column;justify-content:flex-start}:host[type=column] .container.main{width:100%}:host[type=column] .container.left{width:100%}:host[type=column] .container.right{width:100%}\n"] }]
|
|
138
138
|
}], propDecorators: { left: [{ type: i0.ContentChild, args: [i0.forwardRef(() => LeftColumn), { isSignal: true }] }], main: [{ type: i0.ContentChild, args: [i0.forwardRef(() => MainColumn), { isSignal: true }] }], right: [{ type: i0.ContentChild, args: [i0.forwardRef(() => RightColumn), { isSignal: true }] }] } });
|
|
139
139
|
class ColumnsFrameModule {
|
|
140
140
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: ColumnsFrameModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
@@ -15,7 +15,7 @@ class DividerFrame extends NgAtomicComponent {
|
|
|
15
15
|
constructor() {
|
|
16
16
|
super(...arguments);
|
|
17
17
|
this.el = inject(ElementRef);
|
|
18
|
-
this.firstContent = viewChild('first', {
|
|
18
|
+
this.firstContent = viewChild('first', { read: ElementRef });
|
|
19
19
|
this.divider = viewChild.required('el', { read: ElementRef });
|
|
20
20
|
this.dragging = signal(false, ...(ngDevMode ? [{ debugName: "dragging" }] : []));
|
|
21
21
|
}
|
|
@@ -64,7 +64,7 @@ class DividerFrame extends NgAtomicComponent {
|
|
|
64
64
|
<ng-content select="[second]"></ng-content>
|
|
65
65
|
@if (dragging()) { <div class="cover"></div> }
|
|
66
66
|
</div>
|
|
67
|
-
`, isInline: true, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-divider-
|
|
67
|
+
`, isInline: true, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-divider-8GBH: var(--primary-color);--secondary-color: #B0B0B0;--secondary-color-SCOPED-IN-divider-8GBH: var(--secondary-color);--background-color: #B0B0B0;--background-color-SCOPED-IN-divider-8GBH: var(--background-color);--on-background-color: #f0f0f0;--on-background-color-SCOPED-IN-divider-8GBH: var(--on-background-color);--surface-color: transparent;--surface-color-SCOPED-IN-divider-8GBH: var(--surface-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-divider-8GBH: var(--on-primary-color);--on-surface-color: #f0f0f0;--on-surface-color-SCOPED-IN-divider-8GBH: var(--on-surface-color);--first-content-height: 0px;--first-content-height-SCOPED-IN-divider-8GBH: var(--first-content-height);--min-first-content-height: 0px;--min-first-content-height-SCOPED-IN-divider-8GBH: var(--min-first-content-height);--max-first-content-height: calc(100% - 80px) ;--max-first-content-height-SCOPED-IN-divider-8GBH: var(--max-first-content-height)}:host{position:relative;display:flex;flex-direction:column;height:100%;width:100%}:host .container{position:relative;transition:height .3s ease}:host .container.first{height:min(max(var(--first-content-height-SCOPED-IN-divider-8GBH),var(--min-first-content-height-SCOPED-IN-divider-8GBH)),var(--max-first-content-height-SCOPED-IN-divider-8GBH));overflow:hidden;display:flex;flex-direction:column}:host .container.second{display:flex;flex-direction:column;height:calc(100% - min(max(var(--first-content-height-SCOPED-IN-divider-8GBH),var(--min-first-content-height-SCOPED-IN-divider-8GBH)),var(--max-first-content-height-SCOPED-IN-divider-8GBH)));overflow:hidden}:host .container .cover{position:absolute;top:0;left:0;width:100%;height:100%}:host mat-divider{z-index:1000;width:100%;cursor:row-resize;position:relative;border:0px}:host mat-divider:before{content:\"\";position:absolute;top:-8px;left:0;width:100%;height:8px;background-color:transparent;transition:.1s background-color}:host mat-divider:hover:before{background-color:var(--primary-color-SCOPED-IN-divider-8GBH)}:host.dragging .container{transition:none}\n"], dependencies: [{ kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
68
68
|
}
|
|
69
69
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: DividerFrame, decorators: [{
|
|
70
70
|
type: Component,
|
|
@@ -92,7 +92,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImpor
|
|
|
92
92
|
<ng-content select="[second]"></ng-content>
|
|
93
93
|
@if (dragging()) { <div class="cover"></div> }
|
|
94
94
|
</div>
|
|
95
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-divider-
|
|
95
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-divider-8GBH: var(--primary-color);--secondary-color: #B0B0B0;--secondary-color-SCOPED-IN-divider-8GBH: var(--secondary-color);--background-color: #B0B0B0;--background-color-SCOPED-IN-divider-8GBH: var(--background-color);--on-background-color: #f0f0f0;--on-background-color-SCOPED-IN-divider-8GBH: var(--on-background-color);--surface-color: transparent;--surface-color-SCOPED-IN-divider-8GBH: var(--surface-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-divider-8GBH: var(--on-primary-color);--on-surface-color: #f0f0f0;--on-surface-color-SCOPED-IN-divider-8GBH: var(--on-surface-color);--first-content-height: 0px;--first-content-height-SCOPED-IN-divider-8GBH: var(--first-content-height);--min-first-content-height: 0px;--min-first-content-height-SCOPED-IN-divider-8GBH: var(--min-first-content-height);--max-first-content-height: calc(100% - 80px) ;--max-first-content-height-SCOPED-IN-divider-8GBH: var(--max-first-content-height)}:host{position:relative;display:flex;flex-direction:column;height:100%;width:100%}:host .container{position:relative;transition:height .3s ease}:host .container.first{height:min(max(var(--first-content-height-SCOPED-IN-divider-8GBH),var(--min-first-content-height-SCOPED-IN-divider-8GBH)),var(--max-first-content-height-SCOPED-IN-divider-8GBH));overflow:hidden;display:flex;flex-direction:column}:host .container.second{display:flex;flex-direction:column;height:calc(100% - min(max(var(--first-content-height-SCOPED-IN-divider-8GBH),var(--min-first-content-height-SCOPED-IN-divider-8GBH)),var(--max-first-content-height-SCOPED-IN-divider-8GBH)));overflow:hidden}:host .container .cover{position:absolute;top:0;left:0;width:100%;height:100%}:host mat-divider{z-index:1000;width:100%;cursor:row-resize;position:relative;border:0px}:host mat-divider:before{content:\"\";position:absolute;top:-8px;left:0;width:100%;height:8px;background-color:transparent;transition:.1s background-color}:host mat-divider:hover:before{background-color:var(--primary-color-SCOPED-IN-divider-8GBH)}:host.dragging .container{transition:none}\n"] }]
|
|
96
96
|
}], propDecorators: { firstContent: [{ type: i0.ViewChild, args: ['first', { ...{ read: ElementRef }, isSignal: true }] }], divider: [{ type: i0.ViewChild, args: ['el', { ...{ read: ElementRef }, isSignal: true }] }] } });
|
|
97
97
|
|
|
98
98
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-atomic-components-frames-divider.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/divider/divider.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/divider/ng-atomic-components-frames-divider.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, ElementRef, Signal, inject, signal, viewChild } from '@angular/core';\nimport { MatDividerModule } from '@angular/material/divider';\nimport { CdkDrag, CdkDragMove, CdkDragStart } from '@angular/cdk/drag-drop';\nimport { NgAtomicComponent } from '@ng-atomic/core';\n\nenum ActionId {\n DRAG_STARTED = '[@ng-atomic/divider] drag start',\n DRAG_MOVED = '[@ng-atomic/divider] drag move',\n DRAG_ENDED = '[@ng-atomic/divider] drag end',\n}\n\n@Component({\n selector: 'frames-divider',\n imports: [\n MatDividerModule,\n CdkDrag,\n ],\n host: {\n '[class.dragging]': 'dragging()'\n },\n template: `\n <div class=\"first container\" #first>\n <ng-content select=\"[first]\"></ng-content>\n @if (dragging()) { <div class=\"cover\"></div> }\n </div>\n <mat-divider\n cdkDrag\n cdkDragHandle\n [cdkDragStartDelay]=\"0\"\n (cdkDragStarted)=\"onDragStart($event)\"\n (cdkDragMoved)=\"onDragMoved($event)\"\n (cdkDragEnded)=\"onDragEnd($event)\"\n cdkDragLockAxis=\"y\"\n #el\n />\n <div class=\"second container\">\n <ng-content select=\"[second]\"></ng-content>\n @if (dragging()) { <div class=\"cover\"></div> }\n </div>\n `,\n styleUrls: ['./divider.frame.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class DividerFrame extends NgAtomicComponent {\n static ActionId = ActionId;\n\n private el = inject<ElementRef<HTMLElement>>(ElementRef);\n protected firstContentHeight
|
|
1
|
+
{"version":3,"file":"ng-atomic-components-frames-divider.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/divider/divider.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/divider/ng-atomic-components-frames-divider.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, ElementRef, Signal, inject, signal, viewChild } from '@angular/core';\nimport { MatDividerModule } from '@angular/material/divider';\nimport { CdkDrag, CdkDragMove, CdkDragStart } from '@angular/cdk/drag-drop';\nimport { NgAtomicComponent } from '@ng-atomic/core';\n\nenum ActionId {\n DRAG_STARTED = '[@ng-atomic/divider] drag start',\n DRAG_MOVED = '[@ng-atomic/divider] drag move',\n DRAG_ENDED = '[@ng-atomic/divider] drag end',\n}\n\n@Component({\n selector: 'frames-divider',\n imports: [\n MatDividerModule,\n CdkDrag,\n ],\n host: {\n '[class.dragging]': 'dragging()'\n },\n template: `\n <div class=\"first container\" #first>\n <ng-content select=\"[first]\"></ng-content>\n @if (dragging()) { <div class=\"cover\"></div> }\n </div>\n <mat-divider\n cdkDrag\n cdkDragHandle\n [cdkDragStartDelay]=\"0\"\n (cdkDragStarted)=\"onDragStart($event)\"\n (cdkDragMoved)=\"onDragMoved($event)\"\n (cdkDragEnded)=\"onDragEnd($event)\"\n cdkDragLockAxis=\"y\"\n #el\n />\n <div class=\"second container\">\n <ng-content select=\"[second]\"></ng-content>\n @if (dragging()) { <div class=\"cover\"></div> }\n </div>\n `,\n styleUrls: ['./divider.frame.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class DividerFrame extends NgAtomicComponent {\n static ActionId = ActionId;\n\n private el = inject<ElementRef<HTMLElement>>(ElementRef);\n protected firstContentHeight!: number;\n readonly firstContent = viewChild('first', { read: ElementRef }) as Signal<ElementRef<HTMLDivElement>>;\n readonly divider: Signal<ElementRef<HTMLDivElement>> = viewChild.required('el', { read: ElementRef });\n readonly dragging = signal(false);\n\n protected onDragStart($event: CdkDragStart) {\n this.dragging.set(true);\n this.dispatch({ id: ActionId.DRAG_STARTED, payload: $event }, 'default');\n const parentRect = this.divider().nativeElement.parentElement!.getBoundingClientRect();\n const elementRect = this.divider().nativeElement.getBoundingClientRect();\n this.firstContentHeight = elementRect.top - parentRect.top;\n }\n\n protected onDragMoved($event: CdkDragMove) {\n this.dispatch({ id: ActionId.DRAG_MOVED, payload: $event }, 'default');\n this.divider().nativeElement.style.transform = `translate3d(0, 0, 0)`;\n const height = Math.max(1, this.firstContentHeight + $event.distance.y);\n this.setFirstContentHeight(height, 'px');\n }\n\n protected onDragEnd($event: CdkDragMove) {\n this.dragging.set(false);\n this.dispatch({ id: ActionId.DRAG_ENDED, payload: $event }, 'default');\n }\n\n setFirstContentHeight(height: number, unit: 'px' | '%' = 'px', {\n animate = false\n }: { animate?: boolean } = {}) {\n if (this.firstContent() && animate) {\n this.firstContent().nativeElement.style.transition = 'height 0.5s';\n setTimeout(() => this.firstContent().nativeElement.style.transition = 'none', 500);\n }\n this.el.nativeElement.style.setProperty('--first-content-height', `${height}${unit}`);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -101,7 +101,7 @@ class DrawerFrame extends NgAtomicComponent {
|
|
|
101
101
|
<mat-drawer-content>
|
|
102
102
|
<ng-content select=[contents] />
|
|
103
103
|
</mat-drawer-content>
|
|
104
|
-
</mat-drawer-container>`, isInline: true, styles: [":host{--primary-color: #000000;--primary-color-SCOPED-IN-drawer-
|
|
104
|
+
</mat-drawer-container>`, isInline: true, styles: [":host{--primary-color: #000000;--primary-color-SCOPED-IN-drawer-M327: var(--primary-color);--on-primary-color: #ffffff;--on-primary-color-SCOPED-IN-drawer-M327: var(--on-primary-color);--content-width: 360px;--content-width-SCOPED-IN-drawer-M327: var(--content-width);--height: 100%;--height-SCOPED-IN-drawer-M327: var(--height);--background-color: #ffffff;--background-color-SCOPED-IN-drawer-M327: var(--background-color);--on-background-color: #000000;--on-background-color-SCOPED-IN-drawer-M327: var(--on-background-color);--surface-color: transparent;--surface-color-SCOPED-IN-drawer-M327: var(--surface-color)}:host{display:contents;height:var(--height-SCOPED-IN-drawer-M327)}:host mat-drawer{background-color:var(--background-color-SCOPED-IN-drawer-M327)}:host mat-drawer.resizing{transition:width 0s}:host mat-drawer ::ng-deep .mat-drawer-inner-container{height:100%}:host mat-drawer-container{--mat-sidenav-content-background-color: transparent;width:100%;height:100%}:host mat-drawer-content{width:100%;height:100%}:host .resize-handle{position:absolute;left:0;top:0;width:8px;height:100%;background:transparent;cursor:col-resize;z-index:1000;transition:background .2s}:host .resize-handle:hover{background:var(--on-background-color-SCOPED-IN-drawer-M327)}:host .resize-handle:active{background:var(--on-background-color-SCOPED-IN-drawer-M327)}\n"], dependencies: [{ kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i1.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i1.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i1.MatDrawerContent, selector: "mat-drawer-content" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
105
105
|
}
|
|
106
106
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: DrawerFrame, decorators: [{
|
|
107
107
|
type: Component,
|
|
@@ -133,7 +133,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImpor
|
|
|
133
133
|
directive: DrawerFrameStore,
|
|
134
134
|
inputs: ['opened', 'mode', 'hasBackdrop', 'position', 'width', 'resizable'],
|
|
135
135
|
}
|
|
136
|
-
], styles: [":host{--primary-color: #000000;--primary-color-SCOPED-IN-drawer-
|
|
136
|
+
], styles: [":host{--primary-color: #000000;--primary-color-SCOPED-IN-drawer-M327: var(--primary-color);--on-primary-color: #ffffff;--on-primary-color-SCOPED-IN-drawer-M327: var(--on-primary-color);--content-width: 360px;--content-width-SCOPED-IN-drawer-M327: var(--content-width);--height: 100%;--height-SCOPED-IN-drawer-M327: var(--height);--background-color: #ffffff;--background-color-SCOPED-IN-drawer-M327: var(--background-color);--on-background-color: #000000;--on-background-color-SCOPED-IN-drawer-M327: var(--on-background-color);--surface-color: transparent;--surface-color-SCOPED-IN-drawer-M327: var(--surface-color)}:host{display:contents;height:var(--height-SCOPED-IN-drawer-M327)}:host mat-drawer{background-color:var(--background-color-SCOPED-IN-drawer-M327)}:host mat-drawer.resizing{transition:width 0s}:host mat-drawer ::ng-deep .mat-drawer-inner-container{height:100%}:host mat-drawer-container{--mat-sidenav-content-background-color: transparent;width:100%;height:100%}:host mat-drawer-content{width:100%;height:100%}:host .resize-handle{position:absolute;left:0;top:0;width:8px;height:100%;background:transparent;cursor:col-resize;z-index:1000;transition:background .2s}:host .resize-handle:hover{background:var(--on-background-color-SCOPED-IN-drawer-M327)}:host .resize-handle:active{background:var(--on-background-color-SCOPED-IN-drawer-M327)}\n"] }]
|
|
137
137
|
}], ctorParameters: () => [] });
|
|
138
138
|
|
|
139
139
|
/**
|
|
@@ -43,7 +43,7 @@ class EntranceFrame extends NgAtomicComponent {
|
|
|
43
43
|
(action)="dispatch($event)"
|
|
44
44
|
/>
|
|
45
45
|
</frames-overlay>
|
|
46
|
-
`, isInline: true, styles: [":host{display:block;--primary-color: inherit;--primary-color-SCOPED-IN-entrance-
|
|
46
|
+
`, isInline: true, styles: [":host{display:block;--primary-color: inherit;--primary-color-SCOPED-IN-entrance-dDXb: var(--primary-color);--on-primary-color: inherit;--on-primary-color-SCOPED-IN-entrance-dDXb: var(--on-primary-color);--surface-color: inherit;--surface-color-SCOPED-IN-entrance-dDXb: var(--surface-color);--on-surface-color: inherit;--on-surface-color-SCOPED-IN-entrance-dDXb: var(--on-surface-color);--background-color: inherit;--background-color-SCOPED-IN-entrance-dDXb: var(--background-color);--on-background-color: inherit;--on-background-color-SCOPED-IN-entrance-dDXb: var(--on-background-color);--menu-width: inherit;--menu-width-SCOPED-IN-entrance-dDXb: var(--menu-width);--menu-background-color: inherit;--menu-background-color-SCOPED-IN-entrance-dDXb: var(--menu-background-color);--menu-on-background-color: inherit;--menu-on-background-color-SCOPED-IN-entrance-dDXb: var(--menu-on-background-color);--background-primary-color: inherit;--background-primary-color-SCOPED-IN-entrance-dDXb: var(--background-primary-color);--background-on-primary-color: inherit;--background-on-primary-color-SCOPED-IN-entrance-dDXb: var(--background-on-primary-color);--background-background-color: inherit;--background-background-color-SCOPED-IN-entrance-dDXb: var(--background-background-color)}:host{display:block;width:100%;height:100%}:host templates-entrance{position:relative;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-entrance-dDXb);--on-primary-color: var(--on-primary-color-SCOPED-IN-entrance-dDXb);--surface-color: var(--surface-color-SCOPED-IN-entrance-dDXb);--on-surface-color: var(--on-surface-color-SCOPED-IN-entrance-dDXb);--background-color: var(--background-color-SCOPED-IN-entrance-dDXb);--on-background-color: var(--on-background-color-SCOPED-IN-entrance-dDXb);--menu-background-color: var(--menu-background-color-SCOPED-IN-entrance-dDXb);--menu-on-background-color: var(--menu-on-background-color-SCOPED-IN-entrance-dDXb)}\n"], dependencies: [{ kind: "component", type: OverlayFrame, selector: "frames-overlay" }, { kind: "directive", type: EntranceTemplateStore, selector: "templates-entrance", inputs: ["form", "actions", "fieldMap", "title"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
47
47
|
}
|
|
48
48
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: EntranceFrame, decorators: [{
|
|
49
49
|
type: Component,
|
|
@@ -69,7 +69,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImpor
|
|
|
69
69
|
directive: EntranceFrameStore,
|
|
70
70
|
inputs: ['isEntrance', 'actions', 'form', 'title'],
|
|
71
71
|
},
|
|
72
|
-
], styles: [":host{display:block;--primary-color: inherit;--primary-color-SCOPED-IN-entrance-
|
|
72
|
+
], styles: [":host{display:block;--primary-color: inherit;--primary-color-SCOPED-IN-entrance-dDXb: var(--primary-color);--on-primary-color: inherit;--on-primary-color-SCOPED-IN-entrance-dDXb: var(--on-primary-color);--surface-color: inherit;--surface-color-SCOPED-IN-entrance-dDXb: var(--surface-color);--on-surface-color: inherit;--on-surface-color-SCOPED-IN-entrance-dDXb: var(--on-surface-color);--background-color: inherit;--background-color-SCOPED-IN-entrance-dDXb: var(--background-color);--on-background-color: inherit;--on-background-color-SCOPED-IN-entrance-dDXb: var(--on-background-color);--menu-width: inherit;--menu-width-SCOPED-IN-entrance-dDXb: var(--menu-width);--menu-background-color: inherit;--menu-background-color-SCOPED-IN-entrance-dDXb: var(--menu-background-color);--menu-on-background-color: inherit;--menu-on-background-color-SCOPED-IN-entrance-dDXb: var(--menu-on-background-color);--background-primary-color: inherit;--background-primary-color-SCOPED-IN-entrance-dDXb: var(--background-primary-color);--background-on-primary-color: inherit;--background-on-primary-color-SCOPED-IN-entrance-dDXb: var(--background-on-primary-color);--background-background-color: inherit;--background-background-color-SCOPED-IN-entrance-dDXb: var(--background-background-color)}:host{display:block;width:100%;height:100%}:host templates-entrance{position:relative;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-entrance-dDXb);--on-primary-color: var(--on-primary-color-SCOPED-IN-entrance-dDXb);--surface-color: var(--surface-color-SCOPED-IN-entrance-dDXb);--on-surface-color: var(--on-surface-color-SCOPED-IN-entrance-dDXb);--background-color: var(--background-color-SCOPED-IN-entrance-dDXb);--on-background-color: var(--on-background-color-SCOPED-IN-entrance-dDXb);--menu-background-color: var(--menu-background-color-SCOPED-IN-entrance-dDXb);--menu-on-background-color: var(--menu-on-background-color-SCOPED-IN-entrance-dDXb)}\n"] }]
|
|
73
73
|
}] });
|
|
74
74
|
|
|
75
75
|
/**
|
|
@@ -81,7 +81,7 @@ class FabFrame extends NgAtomicComponent {
|
|
|
81
81
|
}
|
|
82
82
|
}
|
|
83
83
|
}
|
|
84
|
-
`, isInline: true, styles: [":host{--primary-color: #039be5;--primary-color-SCOPED-IN-fab-
|
|
84
|
+
`, isInline: true, styles: [":host{--primary-color: #039be5;--primary-color-SCOPED-IN-fab-R68p: var(--primary-color);--container-color: var(--primary-color-SCOPED-IN-fab-R68p);--container-color-SCOPED-IN-fab-R68p: var(--container-color);--icon-color: #fff;--icon-color-SCOPED-IN-fab-R68p: var(--icon-color);--fab-button-bottom: 16px;--fab-button-bottom-SCOPED-IN-fab-R68p: var(--fab-button-bottom);--fab-button-right: 16px;--fab-button-right-SCOPED-IN-fab-R68p: var(--fab-button-right)}:host{display:block;width:100%;height:100%;position:relative}:host button{position:absolute;z-index:2000;bottom:var(--fab-button-bottom-SCOPED-IN-fab-R68p);right:var(--fab-button-right-SCOPED-IN-fab-R68p);transition:all .3s ease;--mat-fab-container-color: var(--container-color);--mat-fab-icon-color: var(--icon-color);--mat-mdc-fab-color: var(--icon-color)}:host[hide=true] button{bottom:-120px}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
85
85
|
}
|
|
86
86
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: FabFrame, decorators: [{
|
|
87
87
|
type: Component,
|
|
@@ -121,7 +121,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImpor
|
|
|
121
121
|
},
|
|
122
122
|
], host: {
|
|
123
123
|
'[attr.hide]': 'store.hide()',
|
|
124
|
-
}, styles: [":host{--primary-color: #039be5;--primary-color-SCOPED-IN-fab-
|
|
124
|
+
}, styles: [":host{--primary-color: #039be5;--primary-color-SCOPED-IN-fab-R68p: var(--primary-color);--container-color: var(--primary-color-SCOPED-IN-fab-R68p);--container-color-SCOPED-IN-fab-R68p: var(--container-color);--icon-color: #fff;--icon-color-SCOPED-IN-fab-R68p: var(--icon-color);--fab-button-bottom: 16px;--fab-button-bottom-SCOPED-IN-fab-R68p: var(--fab-button-bottom);--fab-button-right: 16px;--fab-button-right-SCOPED-IN-fab-R68p: var(--fab-button-right)}:host{display:block;width:100%;height:100%;position:relative}:host button{position:absolute;z-index:2000;bottom:var(--fab-button-bottom-SCOPED-IN-fab-R68p);right:var(--fab-button-right-SCOPED-IN-fab-R68p);transition:all .3s ease;--mat-fab-container-color: var(--container-color);--mat-fab-icon-color: var(--icon-color);--mat-mdc-fab-color: var(--icon-color)}:host[hide=true] button{bottom:-120px}\n"] }]
|
|
125
125
|
}] });
|
|
126
126
|
|
|
127
127
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-atomic-components-frames-fab.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/fab/fab.service.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/fab/fab.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/fab/ng-atomic-components-frames-fab.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { Action } from '@ng-atomic/core';\n\n@Injectable({providedIn: 'root'})\nexport class FabService {\n private actionMap = new Map<string, Action[]>;\n private contexts: string[] = [];\n get actions(): Action[] {\n return this.actionMap.get(this.contexts.at(-1)) ?? [];\n }\n\n set(name, actions: Action[]) {\n return this.actionMap.set(name, actions);\n }\n\n push(name: string) {\n return this.contexts.push(name);\n }\n\n pop() {\n return this.contexts.pop();\n }\n}\n","import { ChangeDetectionStrategy, Component, Directive, inject, input } from '@angular/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { Action, _computed } from '@ng-atomic/core';\nimport { FabService } from './fab.service';\nimport { NgAtomicComponent } from '@ng-atomic/core';\nimport { makeConfig } from '@ng-atomic/common/services/ui';\n\n@Directive({ standalone: true, selector: 'frames-fab' })\nexport class FabFrameStore {\n static readonly Config = makeConfig(() => {\n return () => ({\n actions: [] as Action[],\n hide: false,\n });\n }, ['components', 'frames', 'fab']);\n\n readonly config = FabFrameStore.Config.inject();\n readonly actions = input(_computed(() => this.config().actions));\n readonly hide = input(_computed(() => this.config().hide));\n readonly type = input<'fab' | 'mini-fab' | 'extended'>('fab');\n}\n\n@Component({\n selector: 'frames-fab',\n imports: [\n MatIconModule,\n MatButtonModule,\n ],\n template: `\n <ng-content></ng-content>\n @for (action of store.actions(); track action.id) {\n @switch (store.type()) {\n @case ('fab') {\n <button mat-fab [color]=\"action?.color ?? 'primary'\" (click)=\"dispatch(action)\">\n <mat-icon>{{ action?.icon ?? 'add' }}</mat-icon>\n </button>\n }\n @case ('mini-fab') {\n <button mat-mini-fab [color]=\"action?.color ?? 'primary'\" (click)=\"dispatch(action)\">\n <mat-icon>{{ action?.icon ?? 'add' }}</mat-icon>\n </button>\n }\n @case ('extended') {\n <button mat-fab extended [color]=\"action?.color ?? 'primary'\" (click)=\"dispatch(action)\">\n <mat-icon>{{ action?.icon ?? 'add' }}</mat-icon>\n <span>{{ action?.name }}</span>\n </button>\n }\n }\n }\n `,\n styleUrls: ['./fab.frame.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n hostDirectives: [\n {\n directive: FabFrameStore,\n inputs: [\n 'actions',\n 'hide',\n 'type'\n ],\n },\n ],\n host: {\n '[attr.hide]': 'store.hide()',\n }\n})\nexport class FabFrame extends NgAtomicComponent {\n protected fab = inject(FabService);\n protected store = inject(FabFrameStore);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;MAIa,UAAU,CAAA;AADvB,IAAA,WAAA,GAAA;QAEU,IAAA,CAAA,SAAS,GAAG,IAAI,GAAqB;QACrC,IAAA,CAAA,QAAQ,GAAa,EAAE;AAgBhC,IAAA;AAfC,IAAA,IAAI,OAAO,GAAA;AACT,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"ng-atomic-components-frames-fab.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/fab/fab.service.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/fab/fab.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/fab/ng-atomic-components-frames-fab.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { Action } from '@ng-atomic/core';\n\n@Injectable({providedIn: 'root'})\nexport class FabService {\n private actionMap = new Map<string, Action[]>;\n private contexts: string[] = [];\n get actions(): Action[] {\n return this.actionMap.get(this.contexts.at(-1) as string) ?? [];\n }\n\n set(name: string, actions: Action[]) {\n return this.actionMap.set(name, actions);\n }\n\n push(name: string) {\n return this.contexts.push(name);\n }\n\n pop() {\n return this.contexts.pop();\n }\n}\n","import { ChangeDetectionStrategy, Component, Directive, inject, input } from '@angular/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { Action, _computed } from '@ng-atomic/core';\nimport { FabService } from './fab.service';\nimport { NgAtomicComponent } from '@ng-atomic/core';\nimport { makeConfig } from '@ng-atomic/common/services/ui';\n\n@Directive({ standalone: true, selector: 'frames-fab' })\nexport class FabFrameStore {\n static readonly Config = makeConfig(() => {\n return () => ({\n actions: [] as Action[],\n hide: false,\n });\n }, ['components', 'frames', 'fab']);\n\n readonly config = FabFrameStore.Config.inject();\n readonly actions = input(_computed(() => this.config().actions));\n readonly hide = input(_computed(() => this.config().hide));\n readonly type = input<'fab' | 'mini-fab' | 'extended'>('fab');\n}\n\n@Component({\n selector: 'frames-fab',\n imports: [\n MatIconModule,\n MatButtonModule,\n ],\n template: `\n <ng-content></ng-content>\n @for (action of store.actions(); track action.id) {\n @switch (store.type()) {\n @case ('fab') {\n <button mat-fab [color]=\"action?.color ?? 'primary'\" (click)=\"dispatch(action)\">\n <mat-icon>{{ action?.icon ?? 'add' }}</mat-icon>\n </button>\n }\n @case ('mini-fab') {\n <button mat-mini-fab [color]=\"action?.color ?? 'primary'\" (click)=\"dispatch(action)\">\n <mat-icon>{{ action?.icon ?? 'add' }}</mat-icon>\n </button>\n }\n @case ('extended') {\n <button mat-fab extended [color]=\"action?.color ?? 'primary'\" (click)=\"dispatch(action)\">\n <mat-icon>{{ action?.icon ?? 'add' }}</mat-icon>\n <span>{{ action?.name }}</span>\n </button>\n }\n }\n }\n `,\n styleUrls: ['./fab.frame.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n hostDirectives: [\n {\n directive: FabFrameStore,\n inputs: [\n 'actions',\n 'hide',\n 'type'\n ],\n },\n ],\n host: {\n '[attr.hide]': 'store.hide()',\n }\n})\nexport class FabFrame extends NgAtomicComponent {\n protected fab = inject(FabService);\n protected store = inject(FabFrameStore);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -15,7 +15,7 @@ class HorizontalDividerFrame extends NgAtomicComponent {
|
|
|
15
15
|
constructor() {
|
|
16
16
|
super(...arguments);
|
|
17
17
|
this.el = inject(ElementRef);
|
|
18
|
-
this.firstContent = viewChild('first', {
|
|
18
|
+
this.firstContent = viewChild('first', { read: ElementRef });
|
|
19
19
|
this.divider = viewChild.required('el', { read: ElementRef });
|
|
20
20
|
this.dragging = signal(false, ...(ngDevMode ? [{ debugName: "dragging" }] : []));
|
|
21
21
|
}
|
|
@@ -64,7 +64,7 @@ class HorizontalDividerFrame extends NgAtomicComponent {
|
|
|
64
64
|
<ng-content select="[second]"></ng-content>
|
|
65
65
|
@if (dragging()) { <div class="cover"></div> }
|
|
66
66
|
</div>
|
|
67
|
-
`, isInline: true, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-divider-
|
|
67
|
+
`, isInline: true, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-divider-WlDR: var(--primary-color);--secondary-color: #B0B0B0;--secondary-color-SCOPED-IN-divider-WlDR: var(--secondary-color);--background-color: #B0B0B0;--background-color-SCOPED-IN-divider-WlDR: var(--background-color);--on-background-color: #f0f0f0;--on-background-color-SCOPED-IN-divider-WlDR: var(--on-background-color);--surface-color: transparent;--surface-color-SCOPED-IN-divider-WlDR: var(--surface-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-divider-WlDR: var(--on-primary-color);--on-surface-color: #f0f0f0;--on-surface-color-SCOPED-IN-divider-WlDR: var(--on-surface-color);--first-content-width: calc(100% - 360px) ;--first-content-width-SCOPED-IN-divider-WlDR: var(--first-content-width);--min-first-content-width: 200px;--min-first-content-width-SCOPED-IN-divider-WlDR: var(--min-first-content-width);--max-first-content-width: 100%;--max-first-content-width-SCOPED-IN-divider-WlDR: var(--max-first-content-width)}:host{display:flex;flex-direction:row;position:relative;width:100%;height:100%}:host .container{position:relative}:host .container.first{flex:0 0 clamp(var(--min-first-content-width-SCOPED-IN-divider-WlDR),var(--first-content-width-SCOPED-IN-divider-WlDR),var(--max-first-content-width-SCOPED-IN-divider-WlDR));overflow:hidden}:host .container.second{flex:1;overflow:hidden}:host .cover{position:absolute;inset:0;z-index:1}:host mat-divider{flex:none;align-self:stretch;z-index:1000;height:100%;width:1px;cursor:col-resize;position:relative;border:none;background-color:var(--primary-color-SCOPED-IN-divider-WlDR);transition:background-color .1s}:host mat-divider:before{content:\"\";position:absolute;top:0;left:-8px;width:8px;height:100%;background-color:transparent;transition:background-color .1s}:host mat-divider:hover{background-color:var(--primary-color-SCOPED-IN-divider-WlDR)}:host mat-divider:hover:before{background-color:var(--primary-color-SCOPED-IN-divider-WlDR)}\n"], dependencies: [{ kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
68
68
|
}
|
|
69
69
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: HorizontalDividerFrame, decorators: [{
|
|
70
70
|
type: Component,
|
|
@@ -90,7 +90,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImpor
|
|
|
90
90
|
<ng-content select="[second]"></ng-content>
|
|
91
91
|
@if (dragging()) { <div class="cover"></div> }
|
|
92
92
|
</div>
|
|
93
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-divider-
|
|
93
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-divider-WlDR: var(--primary-color);--secondary-color: #B0B0B0;--secondary-color-SCOPED-IN-divider-WlDR: var(--secondary-color);--background-color: #B0B0B0;--background-color-SCOPED-IN-divider-WlDR: var(--background-color);--on-background-color: #f0f0f0;--on-background-color-SCOPED-IN-divider-WlDR: var(--on-background-color);--surface-color: transparent;--surface-color-SCOPED-IN-divider-WlDR: var(--surface-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-divider-WlDR: var(--on-primary-color);--on-surface-color: #f0f0f0;--on-surface-color-SCOPED-IN-divider-WlDR: var(--on-surface-color);--first-content-width: calc(100% - 360px) ;--first-content-width-SCOPED-IN-divider-WlDR: var(--first-content-width);--min-first-content-width: 200px;--min-first-content-width-SCOPED-IN-divider-WlDR: var(--min-first-content-width);--max-first-content-width: 100%;--max-first-content-width-SCOPED-IN-divider-WlDR: var(--max-first-content-width)}:host{display:flex;flex-direction:row;position:relative;width:100%;height:100%}:host .container{position:relative}:host .container.first{flex:0 0 clamp(var(--min-first-content-width-SCOPED-IN-divider-WlDR),var(--first-content-width-SCOPED-IN-divider-WlDR),var(--max-first-content-width-SCOPED-IN-divider-WlDR));overflow:hidden}:host .container.second{flex:1;overflow:hidden}:host .cover{position:absolute;inset:0;z-index:1}:host mat-divider{flex:none;align-self:stretch;z-index:1000;height:100%;width:1px;cursor:col-resize;position:relative;border:none;background-color:var(--primary-color-SCOPED-IN-divider-WlDR);transition:background-color .1s}:host mat-divider:before{content:\"\";position:absolute;top:0;left:-8px;width:8px;height:100%;background-color:transparent;transition:background-color .1s}:host mat-divider:hover{background-color:var(--primary-color-SCOPED-IN-divider-WlDR)}:host mat-divider:hover:before{background-color:var(--primary-color-SCOPED-IN-divider-WlDR)}\n"] }]
|
|
94
94
|
}], propDecorators: { firstContent: [{ type: i0.ViewChild, args: ['first', { ...{ read: ElementRef }, isSignal: true }] }], divider: [{ type: i0.ViewChild, args: ['el', { ...{ read: ElementRef }, isSignal: true }] }] } });
|
|
95
95
|
|
|
96
96
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-atomic-components-frames-horizontal-divider.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/horizontal-divider/horizontal-divider.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/horizontal-divider/ng-atomic-components-frames-horizontal-divider.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, ElementRef, Signal, inject, signal, viewChild } from '@angular/core';\nimport { MatDividerModule } from '@angular/material/divider';\nimport { CdkDrag, CdkDragMove, CdkDragStart } from '@angular/cdk/drag-drop';\nimport { NgAtomicComponent } from '@ng-atomic/core';\n\nenum ActionId {\n DRAG_STARTED = '[@ng-atomic/horizontal-divider] drag start',\n DRAG_MOVED = '[@ng-atomic/horizontal-divider] drag move',\n DRAG_ENDED = '[@ng-atomic/horizontal-divider] drag end',\n}\n\n@Component({\n selector: 'frames-horizontal-divider',\n imports: [\n MatDividerModule,\n CdkDrag,\n ],\n template: `\n <div class=\"first container\" #first>\n <ng-content select=\"[first]\"></ng-content>\n @if (dragging()) { <div class=\"cover\"></div> }\n </div>\n <mat-divider\n cdkDrag\n cdkDragHandle\n [cdkDragStartDelay]=\"0\"\n (cdkDragStarted)=\"onDragStart($event)\"\n (cdkDragMoved)=\"onDragMoved($event)\"\n (cdkDragEnded)=\"onDragEnd($event)\"\n cdkDragLockAxis=\"x\"\n #el\n />\n <div class=\"second container\">\n <ng-content select=\"[second]\"></ng-content>\n @if (dragging()) { <div class=\"cover\"></div> }\n </div>\n `,\n styleUrls: ['./horizontal-divider.frame.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class HorizontalDividerFrame extends NgAtomicComponent {\n static ActionId = ActionId;\n\n private el = inject<ElementRef<HTMLElement>>(ElementRef);\n protected firstContentWidth
|
|
1
|
+
{"version":3,"file":"ng-atomic-components-frames-horizontal-divider.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/horizontal-divider/horizontal-divider.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/horizontal-divider/ng-atomic-components-frames-horizontal-divider.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, ElementRef, Signal, inject, signal, viewChild } from '@angular/core';\nimport { MatDividerModule } from '@angular/material/divider';\nimport { CdkDrag, CdkDragMove, CdkDragStart } from '@angular/cdk/drag-drop';\nimport { NgAtomicComponent } from '@ng-atomic/core';\n\nenum ActionId {\n DRAG_STARTED = '[@ng-atomic/horizontal-divider] drag start',\n DRAG_MOVED = '[@ng-atomic/horizontal-divider] drag move',\n DRAG_ENDED = '[@ng-atomic/horizontal-divider] drag end',\n}\n\n@Component({\n selector: 'frames-horizontal-divider',\n imports: [\n MatDividerModule,\n CdkDrag,\n ],\n template: `\n <div class=\"first container\" #first>\n <ng-content select=\"[first]\"></ng-content>\n @if (dragging()) { <div class=\"cover\"></div> }\n </div>\n <mat-divider\n cdkDrag\n cdkDragHandle\n [cdkDragStartDelay]=\"0\"\n (cdkDragStarted)=\"onDragStart($event)\"\n (cdkDragMoved)=\"onDragMoved($event)\"\n (cdkDragEnded)=\"onDragEnd($event)\"\n cdkDragLockAxis=\"x\"\n #el\n />\n <div class=\"second container\">\n <ng-content select=\"[second]\"></ng-content>\n @if (dragging()) { <div class=\"cover\"></div> }\n </div>\n `,\n styleUrls: ['./horizontal-divider.frame.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class HorizontalDividerFrame extends NgAtomicComponent {\n static ActionId = ActionId;\n\n private el = inject<ElementRef<HTMLElement>>(ElementRef);\n protected firstContentWidth!: number;\n readonly firstContent: Signal<ElementRef<HTMLDivElement>> = viewChild('first', { read: ElementRef }) as Signal<ElementRef<HTMLDivElement>>;\n readonly divider: Signal<ElementRef<HTMLDivElement>> = viewChild.required('el', { read: ElementRef });\n readonly dragging = signal(false);\n\n protected onDragStart($event: CdkDragStart) {\n this.dragging.set(true);\n this.dispatch({ id: ActionId.DRAG_STARTED, payload: $event }, 'default');\n const parentRect = this.divider().nativeElement.parentElement!.getBoundingClientRect();\n const elementRect = this.divider().nativeElement.getBoundingClientRect();\n this.firstContentWidth = elementRect.left - parentRect.left;\n }\n\n protected onDragMoved($event: CdkDragMove) {\n this.dispatch({ id: ActionId.DRAG_MOVED, payload: $event }, 'default');\n this.divider().nativeElement.style.transform = `translate3d(0, 0, 0)`;\n const width = Math.max(1, this.firstContentWidth + $event.distance.x);\n this.setFirstContentWidth(width, 'px');\n }\n\n protected onDragEnd($event: CdkDragMove) {\n this.dragging.set(false);\n this.dispatch({ id: ActionId.DRAG_ENDED, payload: $event }, 'default');\n }\n\n setFirstContentWidth(width: number, unit: 'px' | '%' = 'px', { animate = false }: { animate?: boolean } = {}) {\n if (this.firstContent() && animate) {\n this.firstContent().nativeElement.style.transition = 'width 0.5s';\n setTimeout(() => this.firstContent().nativeElement.style.transition = 'none', 500);\n }\n this.el.nativeElement.style.setProperty('--first-content-width', `${width}${unit}`);\n }\n} ","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -143,7 +143,7 @@ class LineUpFrame {
|
|
|
143
143
|
@if (store.hasNext()) {
|
|
144
144
|
<div class="next" @hasNext><ng-content select=[next] /></div>
|
|
145
145
|
}
|
|
146
|
-
`, isInline: true, styles: [":host{--gap: 0px;--gap-SCOPED-IN-line-up-
|
|
146
|
+
`, isInline: true, styles: [":host{--gap: 0px;--gap-SCOPED-IN-line-up-Dl1w: var(--gap);--background-color: #ccc;--background-color-SCOPED-IN-line-up-Dl1w: var(--background-color);--next-width: 100%;--next-width-SCOPED-IN-line-up-Dl1w: var(--next-width);--next-max-width: fit-content;--next-max-width-SCOPED-IN-line-up-Dl1w: var(--next-max-width);--translate-x: 0px;--translate-x-SCOPED-IN-line-up-Dl1w: var(--translate-x)}:host{position:relative;transform:translate(var(--translate-x-SCOPED-IN-line-up-Dl1w));transition:transform .3s ease-in-out;display:flex;justify-content:flex-start;gap:var(--gap-SCOPED-IN-line-up-Dl1w);width:100%;height:100%}:host .main{max-width:100%;height:100%;z-index:2}:host .next{width:100%;height:100%;z-index:1}\n"], animations: LINE_UP_ANIMATIONS, changeDetection: i0.ChangeDetectionStrategy.Default }); }
|
|
147
147
|
}
|
|
148
148
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: LineUpFrame, decorators: [{
|
|
149
149
|
type: Component,
|
|
@@ -159,7 +159,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImpor
|
|
|
159
159
|
},
|
|
160
160
|
], host: {
|
|
161
161
|
'attr.has-next': 'store.hasNext()',
|
|
162
|
-
}, styles: [":host{--gap: 0px;--gap-SCOPED-IN-line-up-
|
|
162
|
+
}, styles: [":host{--gap: 0px;--gap-SCOPED-IN-line-up-Dl1w: var(--gap);--background-color: #ccc;--background-color-SCOPED-IN-line-up-Dl1w: var(--background-color);--next-width: 100%;--next-width-SCOPED-IN-line-up-Dl1w: var(--next-width);--next-max-width: fit-content;--next-max-width-SCOPED-IN-line-up-Dl1w: var(--next-max-width);--translate-x: 0px;--translate-x-SCOPED-IN-line-up-Dl1w: var(--translate-x)}:host{position:relative;transform:translate(var(--translate-x-SCOPED-IN-line-up-Dl1w));transition:transform .3s ease-in-out;display:flex;justify-content:flex-start;gap:var(--gap-SCOPED-IN-line-up-Dl1w);width:100%;height:100%}:host .main{max-width:100%;height:100%;z-index:2}:host .next{width:100%;height:100%;z-index:1}\n"] }]
|
|
163
163
|
}], propDecorators: { main: [{ type: i0.ViewChild, args: ['main', { ...{ read: ElementRef }, isSignal: true }] }] } });
|
|
164
164
|
|
|
165
165
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-atomic-components-frames-line-up.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/line-up/line-up.animations.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/line-up/line-up.service.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/line-up/resize-observer.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/line-up/line-up.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/line-up/ng-atomic-components-frames-line-up.ts"],"sourcesContent":["import { animate, query, sequence, state, style, transition, trigger, group } from '@angular/animations';\n\nexport const LINE_UP_ANIMATIONS = [\n trigger('hasNext', [\n transition(':enter', [\n query(':enter', [style({ transform: 'translateX(-100%)', })], { optional: true }),\n query(':enter', [animate('300ms linear', style({ transform: 'translateX(0%)', })),], { optional: true }),\n ]),\n transition(':leave', [\n query(':leave', [style({transform: 'translateX(0%)'})], { optional: true }),\n query(':leave', [animate('300ms linear', style({transform: 'translateX(-100%)'}))], { optional: true }),\n ]),\n ])\n];\n","import { Injectable, signal } from \"@angular/core\";\nimport { LineUpFrame } from \"./line-up.frame\";\nimport { takeUntilDestroyed, toObservable } from \"@angular/core/rxjs-interop\";\nimport { distinctUntilChanged } from \"rxjs\";\n\ninterface State {\n [scope: string]: {\n frames: LineUpFrame[];\n sizeMap: Record<number, number>;\n }\n}\n\n\n@Injectable({providedIn: 'root'})\nexport class LineUpFrameService {\n readonly sizeMap = signal<State>({});\n readonly sizeMap$ = toObservable(this.sizeMap).pipe(\n distinctUntilChanged(),\n takeUntilDestroyed(),\n );\n\n register(frame: LineUpFrame, scope: string) {\n this.sizeMap.update(record => {\n record[scope] ??= {frames: [], sizeMap: {}};\n record[scope].frames.push(frame);\n return {...record};\n });\n }\n\n update(frame: LineUpFrame, mainWidth: number, scope: string) {\n const index = this.findIndex(frame, scope);\n this.sizeMap.update(record => {\n record[scope] ??= {frames: [], sizeMap: {}};\n record[scope].sizeMap[index] = mainWidth;\n return {...record};\n })\n }\n\n unregister(frame: LineUpFrame, scope: string) {\n const index = this.findIndex(frame, scope);\n this.sizeMap.update(record => {\n record[scope].frames = [...record[scope].frames.filter((value) => value !== frame)];\n delete record[scope].sizeMap[index];\n return {...record};\n })\n }\n\n findIndex(frame: LineUpFrame, scope: string): number {\n return this.sizeMap()[scope].frames.findIndex((value) => value === frame);\n }\n\n isFirst(frame: LineUpFrame, scope: string): boolean {\n const index = this.findIndex(frame, scope);\n return Math.min(...Object.keys(this.getSizeMap(scope)).map(key => parseInt(key, 10))) === index;\n }\n\n getSizeMap(scope: string) {\n return this.sizeMap()[scope].sizeMap ?? {};\n }\n\n getFollowingWidth(scope: string, frame: LineUpFrame): number {\n return Object.entries(this.getSizeMap(scope))\n .filter(([key]) => parseInt(key, 10) >= this.findIndex(frame, scope))\n .reduce((acc, [_, width]) => width + acc, 0);\n }\n}\n","import { NEVER, Observable } from 'rxjs';\nimport { startWith } from 'rxjs/operators';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport { distinctUntilChanged, map } from 'rxjs/operators';\nimport { ElementRef } from '@angular/core';\n\nexport function fromResize(el: ElementRef<Element>): Observable<number> {\n if (!el) return NEVER;\n return new Observable<any>((observer) => {\n const resizeObserver = new ResizeObserver(entries => {\n entries.forEach((entry) => observer.next(entry));\n });\n resizeObserver.observe(el.nativeElement);\n return () => resizeObserver.disconnect();\n }).pipe(\n map((el) => el.contentRect?.width ?? 0),\n startWith(0),\n distinctUntilChanged(),\n );\n}\n","import { ChangeDetectionStrategy, Component, Directive, ElementRef, OnDestroy, OnInit, PLATFORM_ID, inject, input, viewChild, AfterViewInit } from '@angular/core';\nimport { isPlatformBrowser } from '@angular/common';\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';\nimport { distinctUntilChanged, filter, map, startWith, switchMap } from 'rxjs/operators';\nimport { LINE_UP_ANIMATIONS } from './line-up.animations';\nimport { LineUpFrameService } from './line-up.service';\nimport { fromResize } from './resize-observer';\nimport { combineLatest, fromEvent, of } from 'rxjs';\n\n@Directive({standalone: true, selector: 'frames-line-up'})\nexport class LineUpFrameStore {\n readonly scope = input('default');\n readonly hasNext = input(false);\n}\n\n@Component({\n imports: [],\n selector: 'frames-line-up',\n template: `\n <div class=\"main\" #main><ng-content select=[main] /></div>\n @if (store.hasNext()) {\n <div class=\"next\" @hasNext><ng-content select=[next] /></div>\n }\n `,\n styleUrls: ['./line-up.frame.scss'],\n changeDetection: ChangeDetectionStrategy.Default,\n animations: LINE_UP_ANIMATIONS,\n hostDirectives: [\n {\n directive: LineUpFrameStore,\n inputs: ['scope', 'hasNext'],\n },\n ],\n host: {\n 'attr.has-next': 'store.hasNext()',\n }\n})\nexport class LineUpFrame implements OnInit, OnDestroy, AfterViewInit {\n protected store = inject(LineUpFrameStore);\n private service = inject(LineUpFrameService);\n private el = inject(ElementRef);\n private platformId = inject(PLATFORM_ID);\n\n readonly resizeWindow$ = of(null).pipe(\n switchMap(() => {\n return isPlatformBrowser(this.platformId)\n ? fromEvent(window, 'resize').pipe(startWith(null))\n : of(null);\n }),\n )\n\n readonly elWidth$ = this.resizeWindow$.pipe(\n switchMap(() => fromResize(this.el).pipe(startWith(null))),\n map(() => this.el.nativeElement?.clientWidth ?? 0),\n takeUntilDestroyed(),\n );\n \n readonly main = viewChild('main', {read: ElementRef});\n readonly main$ = toObservable(this.main);\n readonly mainWidth$ = combineLatest({\n main: this.main$,\n resize: this.resizeWindow$\n }).pipe(\n switchMap(({main}) => fromResize(main).pipe(startWith(null))),\n map(() => this.main()),\n map((main) => main?.nativeElement?.clientWidth ?? 0),\n takeUntilDestroyed(),\n );\n readonly allWidth$ = combineLatest({\n map: this.service.sizeMap$,\n window: this.resizeWindow$\n }) .pipe(\n map(() => this.service.getFollowingWidth(this.store.scope(), this)),\n takeUntilDestroyed(),\n );\n\n readonly delta$ = combineLatest({\n el: this.elWidth$,\n all: this.allWidth$,\n }).pipe(\n filter(() => this.service.isFirst(this, this.store.scope())),\n map(({el, all}) => Math.min(el - all, 0)),\n distinctUntilChanged(),\n takeUntilDestroyed(),\n );\n\n ngOnInit(): void {\n this.service.register(this, this.store.scope());\n }\n\n ngAfterViewInit(): void {\n if (isPlatformBrowser(this.platformId)) {\n this.mainWidth$.subscribe((width) => this.service.update(this, width, this.store.scope()));\n this.delta$.subscribe((delta) => this.setTranslateX(delta));\n }\n }\n\n ngOnDestroy(): void {\n this.service.unregister(this, this.store.scope());\n }\n\n protected setTranslateX(value: number) {\n this.el.nativeElement.style.setProperty('--translate-x', `${value}px`);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["distinctUntilChanged"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ng-atomic-components-frames-line-up.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/line-up/line-up.animations.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/line-up/line-up.service.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/line-up/resize-observer.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/line-up/line-up.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/line-up/ng-atomic-components-frames-line-up.ts"],"sourcesContent":["import { animate, query, sequence, state, style, transition, trigger, group } from '@angular/animations';\n\nexport const LINE_UP_ANIMATIONS = [\n trigger('hasNext', [\n transition(':enter', [\n query(':enter', [style({ transform: 'translateX(-100%)', })], { optional: true }),\n query(':enter', [animate('300ms linear', style({ transform: 'translateX(0%)', })),], { optional: true }),\n ]),\n transition(':leave', [\n query(':leave', [style({transform: 'translateX(0%)'})], { optional: true }),\n query(':leave', [animate('300ms linear', style({transform: 'translateX(-100%)'}))], { optional: true }),\n ]),\n ])\n];\n","import { Injectable, signal } from \"@angular/core\";\nimport { LineUpFrame } from \"./line-up.frame\";\nimport { takeUntilDestroyed, toObservable } from \"@angular/core/rxjs-interop\";\nimport { distinctUntilChanged } from \"rxjs\";\n\ninterface State {\n [scope: string]: {\n frames: LineUpFrame[];\n sizeMap: Record<number, number>;\n }\n}\n\n\n@Injectable({providedIn: 'root'})\nexport class LineUpFrameService {\n readonly sizeMap = signal<State>({});\n readonly sizeMap$ = toObservable(this.sizeMap).pipe(\n distinctUntilChanged(),\n takeUntilDestroyed(),\n );\n\n register(frame: LineUpFrame, scope: string) {\n this.sizeMap.update(record => {\n record[scope] ??= {frames: [], sizeMap: {}};\n record[scope].frames.push(frame);\n return {...record};\n });\n }\n\n update(frame: LineUpFrame, mainWidth: number, scope: string) {\n const index = this.findIndex(frame, scope);\n this.sizeMap.update(record => {\n record[scope] ??= {frames: [], sizeMap: {}};\n record[scope].sizeMap[index] = mainWidth;\n return {...record};\n })\n }\n\n unregister(frame: LineUpFrame, scope: string) {\n const index = this.findIndex(frame, scope);\n this.sizeMap.update(record => {\n record[scope].frames = [...record[scope].frames.filter((value) => value !== frame)];\n delete record[scope].sizeMap[index];\n return {...record};\n })\n }\n\n findIndex(frame: LineUpFrame, scope: string): number {\n return this.sizeMap()[scope].frames.findIndex((value) => value === frame);\n }\n\n isFirst(frame: LineUpFrame, scope: string): boolean {\n const index = this.findIndex(frame, scope);\n return Math.min(...Object.keys(this.getSizeMap(scope)).map(key => parseInt(key, 10))) === index;\n }\n\n getSizeMap(scope: string) {\n return this.sizeMap()[scope].sizeMap ?? {};\n }\n\n getFollowingWidth(scope: string, frame: LineUpFrame): number {\n return Object.entries(this.getSizeMap(scope))\n .filter(([key]) => parseInt(key, 10) >= this.findIndex(frame, scope))\n .reduce((acc, [_, width]) => width + acc, 0);\n }\n}\n","import { NEVER, Observable } from 'rxjs';\nimport { startWith } from 'rxjs/operators';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport { distinctUntilChanged, map } from 'rxjs/operators';\nimport { ElementRef } from '@angular/core';\n\nexport function fromResize(el: ElementRef<Element>): Observable<number> {\n if (!el) return NEVER;\n return new Observable<any>((observer) => {\n const resizeObserver = new ResizeObserver(entries => {\n entries.forEach((entry) => observer.next(entry));\n });\n resizeObserver.observe(el.nativeElement);\n return () => resizeObserver.disconnect();\n }).pipe(\n map((el) => el.contentRect?.width ?? 0),\n startWith(0),\n distinctUntilChanged(),\n );\n}\n","import { ChangeDetectionStrategy, Component, Directive, ElementRef, OnDestroy, OnInit, PLATFORM_ID, inject, input, viewChild, AfterViewInit } from '@angular/core';\nimport { isPlatformBrowser } from '@angular/common';\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';\nimport { distinctUntilChanged, filter, map, startWith, switchMap } from 'rxjs/operators';\nimport { LINE_UP_ANIMATIONS } from './line-up.animations';\nimport { LineUpFrameService } from './line-up.service';\nimport { fromResize } from './resize-observer';\nimport { combineLatest, fromEvent, of } from 'rxjs';\n\n@Directive({standalone: true, selector: 'frames-line-up'})\nexport class LineUpFrameStore {\n readonly scope = input('default');\n readonly hasNext = input(false);\n}\n\n@Component({\n imports: [],\n selector: 'frames-line-up',\n template: `\n <div class=\"main\" #main><ng-content select=[main] /></div>\n @if (store.hasNext()) {\n <div class=\"next\" @hasNext><ng-content select=[next] /></div>\n }\n `,\n styleUrls: ['./line-up.frame.scss'],\n changeDetection: ChangeDetectionStrategy.Default,\n animations: LINE_UP_ANIMATIONS,\n hostDirectives: [\n {\n directive: LineUpFrameStore,\n inputs: ['scope', 'hasNext'],\n },\n ],\n host: {\n 'attr.has-next': 'store.hasNext()',\n }\n})\nexport class LineUpFrame implements OnInit, OnDestroy, AfterViewInit {\n protected store = inject(LineUpFrameStore);\n private service = inject(LineUpFrameService);\n private el = inject(ElementRef);\n private platformId = inject(PLATFORM_ID);\n\n readonly resizeWindow$ = of(null).pipe(\n switchMap(() => {\n return isPlatformBrowser(this.platformId)\n ? fromEvent(window, 'resize').pipe(startWith(null))\n : of(null);\n }),\n )\n\n readonly elWidth$ = this.resizeWindow$.pipe(\n switchMap(() => fromResize(this.el).pipe(startWith(null))),\n map(() => this.el.nativeElement?.clientWidth ?? 0),\n takeUntilDestroyed(),\n );\n \n readonly main = viewChild('main', {read: ElementRef});\n readonly main$ = toObservable(this.main);\n readonly mainWidth$ = combineLatest({\n main: this.main$,\n resize: this.resizeWindow$\n }).pipe(\n switchMap(({main}) => fromResize(main as ElementRef).pipe(startWith(null))),\n map(() => this.main()),\n map((main) => main?.nativeElement?.clientWidth ?? 0),\n takeUntilDestroyed(),\n );\n readonly allWidth$ = combineLatest({\n map: this.service.sizeMap$,\n window: this.resizeWindow$\n }) .pipe(\n map(() => this.service.getFollowingWidth(this.store.scope(), this)),\n takeUntilDestroyed(),\n );\n\n readonly delta$ = combineLatest({\n el: this.elWidth$,\n all: this.allWidth$,\n }).pipe(\n filter(() => this.service.isFirst(this, this.store.scope())),\n map(({el, all}) => Math.min(el - all, 0)),\n distinctUntilChanged(),\n takeUntilDestroyed(),\n );\n\n ngOnInit(): void {\n this.service.register(this, this.store.scope());\n }\n\n ngAfterViewInit(): void {\n if (isPlatformBrowser(this.platformId)) {\n this.mainWidth$.subscribe((width) => this.service.update(this, width, this.store.scope()));\n this.delta$.subscribe((delta) => this.setTranslateX(delta));\n }\n }\n\n ngOnDestroy(): void {\n this.service.unregister(this, this.store.scope());\n }\n\n protected setTranslateX(value: number) {\n this.el.nativeElement.style.setProperty('--translate-x', `${value}px`);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["distinctUntilChanged"],"mappings":"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"}
|
|
@@ -26,7 +26,7 @@ class LoadingFrame extends NgAtomicComponent {
|
|
|
26
26
|
@if(store.isLoading()) {
|
|
27
27
|
<div class="loading"><mat-spinner /></div>
|
|
28
28
|
}
|
|
29
|
-
`, isInline: true, styles: [":host{--primary-color: inherit;--primary-color-SCOPED-IN-loading-
|
|
29
|
+
`, isInline: true, styles: [":host{--primary-color: inherit;--primary-color-SCOPED-IN-loading-H538: var(--primary-color);--on-primary-color: inherit;--on-primary-color-SCOPED-IN-loading-H538: var(--on-primary-color)}:host{position:relative;display:block;width:100%;height:100%}:host .loading{position:absolute;z-index:10000;display:flex;width:100%;height:100%;justify-content:center;align-items:center;background-color:#0006}:host .loading mat-spinner{--mat-progress-spinner-active-indicator-color: var(--primary-color)}:host .contents{position:absolute;top:0;left:0;display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-loading-H538);--on-primary-color: var(--on-primary-color-SCOPED-IN-loading-H538)}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
30
30
|
}
|
|
31
31
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: LoadingFrame, decorators: [{
|
|
32
32
|
type: Component,
|
|
@@ -42,7 +42,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImpor
|
|
|
42
42
|
directive: LoadingFrameStore,
|
|
43
43
|
inputs: ['isLoading'],
|
|
44
44
|
}
|
|
45
|
-
], styles: [":host{--primary-color: inherit;--primary-color-SCOPED-IN-loading-
|
|
45
|
+
], styles: [":host{--primary-color: inherit;--primary-color-SCOPED-IN-loading-H538: var(--primary-color);--on-primary-color: inherit;--on-primary-color-SCOPED-IN-loading-H538: var(--on-primary-color)}:host{position:relative;display:block;width:100%;height:100%}:host .loading{position:absolute;z-index:10000;display:flex;width:100%;height:100%;justify-content:center;align-items:center;background-color:#0006}:host .loading mat-spinner{--mat-progress-spinner-active-indicator-color: var(--primary-color)}:host .contents{position:absolute;top:0;left:0;display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-loading-H538);--on-primary-color: var(--on-primary-color-SCOPED-IN-loading-H538)}\n"] }]
|
|
46
46
|
}] });
|
|
47
47
|
|
|
48
48
|
/**
|
|
@@ -77,7 +77,7 @@ class RouterOutletFrame extends NgAtomicComponent {
|
|
|
77
77
|
}));
|
|
78
78
|
this.hasNext = toSignal(this.hasNext$);
|
|
79
79
|
this.events$.subscribe((event) => {
|
|
80
|
-
if (this.store.skip()) {
|
|
80
|
+
if (this.store.skip() && this.parent) {
|
|
81
81
|
this.parent.events.emit(event);
|
|
82
82
|
}
|
|
83
83
|
});
|
|
@@ -107,7 +107,7 @@ class RouterOutletFrame extends NgAtomicComponent {
|
|
|
107
107
|
}
|
|
108
108
|
<ng-template #main><ng-content main/></ng-template>
|
|
109
109
|
<ng-template #next><router-outlet [name]="store.name()"/></ng-template>
|
|
110
|
-
`, isInline: true, styles: [":host{display:contents;--primary-color: #ccc;--primary-color-SCOPED-IN-router-outlet-
|
|
110
|
+
`, isInline: true, styles: [":host{display:contents;--primary-color: #ccc;--primary-color-SCOPED-IN-router-outlet-ZdIn: var(--primary-color);--on-primary-color: #ccc;--on-primary-color-SCOPED-IN-router-outlet-ZdIn: var(--on-primary-color);--surface-color: #ccc;--surface-color-SCOPED-IN-router-outlet-ZdIn: var(--surface-color);--background-color: #ccc;--background-color-SCOPED-IN-router-outlet-ZdIn: var(--background-color)}:host *{--primary-color: var(--primary-color-SCOPED-IN-router-outlet-ZdIn);--on-primary-color: var(--on-primary-color-SCOPED-IN-router-outlet-ZdIn);--surface-color: var(--surface-color-SCOPED-IN-router-outlet-ZdIn);--background-color: var(--background-color-SCOPED-IN-router-outlet-ZdIn)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: OverlayFrame, selector: "frames-overlay" }, { kind: "component", type: LineUpFrame, selector: "frames-line-up" }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
111
111
|
}
|
|
112
112
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: RouterOutletFrame, decorators: [{
|
|
113
113
|
type: Component,
|
|
@@ -142,7 +142,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImpor
|
|
|
142
142
|
directive: RouterOutletFrameStore,
|
|
143
143
|
inputs: ['frame', 'name', 'skip'],
|
|
144
144
|
},
|
|
145
|
-
], styles: [":host{display:contents;--primary-color: #ccc;--primary-color-SCOPED-IN-router-outlet-
|
|
145
|
+
], styles: [":host{display:contents;--primary-color: #ccc;--primary-color-SCOPED-IN-router-outlet-ZdIn: var(--primary-color);--on-primary-color: #ccc;--on-primary-color-SCOPED-IN-router-outlet-ZdIn: var(--on-primary-color);--surface-color: #ccc;--surface-color-SCOPED-IN-router-outlet-ZdIn: var(--surface-color);--background-color: #ccc;--background-color-SCOPED-IN-router-outlet-ZdIn: var(--background-color)}:host *{--primary-color: var(--primary-color-SCOPED-IN-router-outlet-ZdIn);--on-primary-color: var(--on-primary-color-SCOPED-IN-router-outlet-ZdIn);--surface-color: var(--surface-color-SCOPED-IN-router-outlet-ZdIn);--background-color: var(--background-color-SCOPED-IN-router-outlet-ZdIn)}\n"] }]
|
|
146
146
|
}], ctorParameters: () => [], propDecorators: { events: [{
|
|
147
147
|
type: Output
|
|
148
148
|
}], outlet: [{ type: i0.ViewChild, args: [i0.forwardRef(() => RouterOutlet), { isSignal: true }] }] } });
|