@almoamendev/ngx-md3 0.7.0 → 0.7.2
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.
|
@@ -5639,7 +5639,7 @@ class Toolbar {
|
|
|
5639
5639
|
provide: MD3_BUTTON_CONTEXT,
|
|
5640
5640
|
useExisting: Toolbar,
|
|
5641
5641
|
},
|
|
5642
|
-
], queries: [{ propertyName: "fab", first: true, predicate: FloatingActionButton, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "layoutElement", first: true, predicate: ["layout"], descendants: true, isSignal: true }, { propertyName: "containerElement", first: true, predicate: ["container"], descendants: true, isSignal: true }, { propertyName: "slotsElement", first: true, predicate: ["slots"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"md3-toolbar-layout\" #layout>\n @if (isFloating()) {\n <ng-content select=\"[md3-fab]\"></ng-content>\n }\n \n <div class=\"md3-toolbar-container\" #container>\n <div class=\"md3-toolbar-slots\" #slots>\n <ng-content select=\"md3-toolbar-item\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{--md-toolbar-size: 4em;--md-toolbar-padding: .
|
|
5642
|
+
], queries: [{ propertyName: "fab", first: true, predicate: FloatingActionButton, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "layoutElement", first: true, predicate: ["layout"], descendants: true, isSignal: true }, { propertyName: "containerElement", first: true, predicate: ["container"], descendants: true, isSignal: true }, { propertyName: "slotsElement", first: true, predicate: ["slots"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"md3-toolbar-layout\" #layout>\n @if (isFloating()) {\n <ng-content select=\"[md3-fab]\"></ng-content>\n }\n \n <div class=\"md3-toolbar-container\" #container>\n <div class=\"md3-toolbar-slots\" #slots>\n <ng-content select=\"md3-toolbar-item\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{--md-toolbar-size: 4em;--md-toolbar-padding: .75em;--md-toolbar-radius: var(--md-toolbar-size);--md-toolbar-shadow: var(--md-shadow-3dp);--md-toolbar-item-max-size: 20em;--md-toolbar-gap-min: .25em;--md-toolbar-gap-max: 2em;--md-toolbar-gap: clamp(var(--md-toolbar-gap-min), var(--md-toolbar-gap-free, 0px), var(--md-toolbar-gap-max));--md-toolbar-duration: var(--md-motion-expressive-default-spatial-duration);--md-toolbar-easing: var(--md-motion-expressive-default-spatial-easing);--md-toolbar-effect-duration: var(--md-motion-expressive-fast-effects-duration);--background-color: rgb(var(--md-scheme-surface-container));--foreground-color: rgb(var(--md-scheme-on-surface));display:block;position:relative;min-width:0em;min-height:0em;transition:max-height var(--md-toolbar-duration) var(--md-toolbar-easing),max-width var(--md-toolbar-duration) var(--md-toolbar-easing),opacity var(--md-toolbar-duration) var(--md-toolbar-easing)}:host .md3-toolbar-layout{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--md-toolbar-padding);width:100%;height:100%;min-width:0em;min-height:0em;transition:transform var(--md-toolbar-duration) var(--md-toolbar-easing),opacity var(--md-toolbar-duration) var(--md-toolbar-easing)}:host .md3-toolbar-layout .md3-toolbar-container{display:flex;flex-direction:row;align-items:center;min-width:0em;min-height:0em;max-width:100%;max-height:100%;border-radius:var(--md-toolbar-radius);background-color:var(--background-color);color:var(--foreground-color);box-shadow:var(--md-toolbar-shadow);overflow:hidden;pointer-events:auto;transition:max-width var(--md-toolbar-duration) var(--md-toolbar-easing),padding var(--md-toolbar-duration) var(--md-toolbar-easing),box-shadow var(--md-toolbar-effect-duration) linear,opacity var(--md-toolbar-effect-duration) linear,visibility 0s linear}:host .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots{display:flex;flex:0 1 auto;flex-direction:row;align-items:center;min-width:0em;min-height:0em}:host .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots ::ng-deep>md3-toolbar-item{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;transition:max-width var(--md-toolbar-duration) var(--md-toolbar-easing),margin var(--md-toolbar-duration) var(--md-toolbar-easing),padding var(--md-toolbar-duration) var(--md-toolbar-easing),opacity var(--md-toolbar-effect-duration) linear,visibility 0s linear}:host.md3-fab-start ::ng-deep [md3-fab]{order:-1}:host.md3-fab-end ::ng-deep [md3-fab]{order:1}:host.md3-docked{--md-toolbar-radius: var(--md-border-radius-none);--md-toolbar-shadow: var(--md-shadow-0dp);background-color:var(--background-color)}:host.md3-docked.md3-align-start .md3-toolbar-layout .md3-toolbar-container{justify-content:start}:host.md3-docked.md3-align-center .md3-toolbar-layout .md3-toolbar-container{justify-content:center}:host.md3-docked.md3-align-end .md3-toolbar-layout .md3-toolbar-container{justify-content:end}:host.md3-docked .md3-toolbar-layout{width:100%;height:100%}:host.md3-docked .md3-toolbar-layout .md3-toolbar-container{background-color:transparent}:host.md3-floating.md3-align-start .md3-toolbar-layout{justify-content:start}:host.md3-floating.md3-align-center .md3-toolbar-layout{justify-content:center}:host.md3-floating.md3-align-end .md3-toolbar-layout{justify-content:end}:host.md3-floating .md3-toolbar-layout{position:absolute;inset:0;pointer-events:none}:host.md3-floating .md3-toolbar-layout .md3-toolbar-container{pointer-events:auto}:host.md3-floating .md3-toolbar-layout ::ng-deep [md3-fab]{pointer-events:auto}:host.md3-horizontal{max-height:var(--md-toolbar-size)}:host.md3-horizontal .md3-toolbar-layout{height:var(--md-toolbar-size);padding:0 1em}:host.md3-horizontal .md3-toolbar-layout .md3-toolbar-container{height:var(--md-toolbar-size)}:host.md3-horizontal .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots ::ng-deep>md3-toolbar-item{max-width:var(--md-toolbar-item-max-size)}:host.md3-horizontal .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots ::ng-deep>md3-toolbar-item+md3-toolbar-item{margin-inline-start:var(--md-toolbar-gap)}:host.md3-horizontal.md3-docked .md3-toolbar-layout .md3-toolbar-container{width:100%}:host.md3-horizontal.md3-floating{height:0}:host.md3-horizontal.md3-floating .md3-toolbar-layout .md3-toolbar-container{padding:0 var(--md-toolbar-padding)}:host.md3-horizontal.md3-floating.md3-region-block-end .md3-toolbar-layout{inset-block-start:auto;inset-block-end:1em}:host.md3-horizontal.md3-floating.md3-region-block-start .md3-toolbar-layout{inset-block-end:auto;inset-block-start:1em}:host.md3-vertical{max-width:var(--md-toolbar-size)}:host.md3-vertical .md3-toolbar-layout{flex-direction:column;width:var(--md-toolbar-size);padding:1em 0}:host.md3-vertical .md3-toolbar-layout .md3-toolbar-container{flex-direction:column;width:var(--md-toolbar-size)}:host.md3-vertical .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots{flex-direction:column;width:100%;height:auto}:host.md3-vertical .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots ::ng-deep>md3-toolbar-item{max-height:var(--md-toolbar-item-max-size);min-height:3em}:host.md3-vertical .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots ::ng-deep>md3-toolbar-item+md3-toolbar-item{margin-block-start:var(--md-toolbar-gap)}:host.md3-vertical.md3-docked .md3-toolbar-layout .md3-toolbar-container{height:100%}:host.md3-vertical.md3-floating{width:0}:host.md3-vertical.md3-floating .md3-toolbar-layout .md3-toolbar-container{padding:var(--md-toolbar-padding) 0}:host.md3-vertical.md3-floating.md3-region-inline-end .md3-toolbar-layout{inset-inline-start:auto;inset-inline-end:1em}:host.md3-vertical.md3-floating.md3-region-inline-start .md3-toolbar-layout{inset-inline-end:auto;inset-inline-start:1em}:host.md3-hidden{opacity:0;pointer-events:none}:host.md3-hidden.md3-horizontal{max-height:0em}:host.md3-hidden.md3-vertical{max-width:0em}:host.md3-hidden .md3-toolbar-layout{transform:scaleY(0)}:host.md3-collapsed{--md-toolbar-gap: 0em}:host.md3-collapsed .md3-toolbar-container .md3-toolbar-slots>::ng-deep md3-toolbar-item:not([md3-toolbar-persistent]){max-width:0em!important;max-height:0em!important;min-width:0em!important;min-height:0em!important;margin:0;padding-inline:0em;border-width:0em;opacity:0;visibility:hidden;transition:max-width var(--md-toolbar-duration) var(--md-toolbar-easing),max-height var(--md-toolbar-duration) var(--md-toolbar-easing),margin var(--md-toolbar-duration) var(--md-toolbar-easing),padding var(--md-toolbar-duration) var(--md-toolbar-easing),opacity var(--md-toolbar-effect-duration) linear,visibility 0s linear var(--md-toolbar-duration)}:host.md3-collapsed.md3-collapse-to-fab{--md-toolbar-padding: 0}:host.md3-collapsed.md3-collapse-to-fab .md3-toolbar-container{max-width:0em;opacity:0;visibility:hidden;pointer-events:none;box-shadow:var(--md-shadow-0dp);transition:max-width var(--md-toolbar-duration) var(--md-toolbar-easing),padding var(--md-toolbar-duration) var(--md-toolbar-easing),box-shadow var(--md-toolbar-effect-duration) linear,opacity var(--md-toolbar-effect-duration) linear,visibility 0s linear var(--md-toolbar-duration)}:host.md3-color-vibrant{--background-color: rgb(var(--md-scheme-primary-container));--foreground-color: rgb(var(--md-scheme-on-primary-container))}:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-icon-button].md3-standard,:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-icon-button].md3-outlined,:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-button].md3-text,:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-button].md3-outlined{--foreground-color: rgb(var(--md-scheme-on-primary-container))}:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-icon-button].md3-tonal,:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-button].md3-tonal{--background-color: rgb(var(--md-scheme-surface-container));--foreground-color: rgb(var(--md-scheme-on-surface))}\n"] });
|
|
5643
5643
|
}
|
|
5644
5644
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: Toolbar, decorators: [{
|
|
5645
5645
|
type: Component,
|
|
@@ -5659,7 +5659,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
|
|
|
5659
5659
|
'[class.md3-collapse-to-fab]': 'isCollapsedToFab()',
|
|
5660
5660
|
'(focusin)': 'onFocusIn()',
|
|
5661
5661
|
'(focusout)': 'onFocusOut($event)',
|
|
5662
|
-
}, template: "<div class=\"md3-toolbar-layout\" #layout>\n @if (isFloating()) {\n <ng-content select=\"[md3-fab]\"></ng-content>\n }\n \n <div class=\"md3-toolbar-container\" #container>\n <div class=\"md3-toolbar-slots\" #slots>\n <ng-content select=\"md3-toolbar-item\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{--md-toolbar-size: 4em;--md-toolbar-padding: .
|
|
5662
|
+
}, template: "<div class=\"md3-toolbar-layout\" #layout>\n @if (isFloating()) {\n <ng-content select=\"[md3-fab]\"></ng-content>\n }\n \n <div class=\"md3-toolbar-container\" #container>\n <div class=\"md3-toolbar-slots\" #slots>\n <ng-content select=\"md3-toolbar-item\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{--md-toolbar-size: 4em;--md-toolbar-padding: .75em;--md-toolbar-radius: var(--md-toolbar-size);--md-toolbar-shadow: var(--md-shadow-3dp);--md-toolbar-item-max-size: 20em;--md-toolbar-gap-min: .25em;--md-toolbar-gap-max: 2em;--md-toolbar-gap: clamp(var(--md-toolbar-gap-min), var(--md-toolbar-gap-free, 0px), var(--md-toolbar-gap-max));--md-toolbar-duration: var(--md-motion-expressive-default-spatial-duration);--md-toolbar-easing: var(--md-motion-expressive-default-spatial-easing);--md-toolbar-effect-duration: var(--md-motion-expressive-fast-effects-duration);--background-color: rgb(var(--md-scheme-surface-container));--foreground-color: rgb(var(--md-scheme-on-surface));display:block;position:relative;min-width:0em;min-height:0em;transition:max-height var(--md-toolbar-duration) var(--md-toolbar-easing),max-width var(--md-toolbar-duration) var(--md-toolbar-easing),opacity var(--md-toolbar-duration) var(--md-toolbar-easing)}:host .md3-toolbar-layout{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--md-toolbar-padding);width:100%;height:100%;min-width:0em;min-height:0em;transition:transform var(--md-toolbar-duration) var(--md-toolbar-easing),opacity var(--md-toolbar-duration) var(--md-toolbar-easing)}:host .md3-toolbar-layout .md3-toolbar-container{display:flex;flex-direction:row;align-items:center;min-width:0em;min-height:0em;max-width:100%;max-height:100%;border-radius:var(--md-toolbar-radius);background-color:var(--background-color);color:var(--foreground-color);box-shadow:var(--md-toolbar-shadow);overflow:hidden;pointer-events:auto;transition:max-width var(--md-toolbar-duration) var(--md-toolbar-easing),padding var(--md-toolbar-duration) var(--md-toolbar-easing),box-shadow var(--md-toolbar-effect-duration) linear,opacity var(--md-toolbar-effect-duration) linear,visibility 0s linear}:host .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots{display:flex;flex:0 1 auto;flex-direction:row;align-items:center;min-width:0em;min-height:0em}:host .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots ::ng-deep>md3-toolbar-item{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;transition:max-width var(--md-toolbar-duration) var(--md-toolbar-easing),margin var(--md-toolbar-duration) var(--md-toolbar-easing),padding var(--md-toolbar-duration) var(--md-toolbar-easing),opacity var(--md-toolbar-effect-duration) linear,visibility 0s linear}:host.md3-fab-start ::ng-deep [md3-fab]{order:-1}:host.md3-fab-end ::ng-deep [md3-fab]{order:1}:host.md3-docked{--md-toolbar-radius: var(--md-border-radius-none);--md-toolbar-shadow: var(--md-shadow-0dp);background-color:var(--background-color)}:host.md3-docked.md3-align-start .md3-toolbar-layout .md3-toolbar-container{justify-content:start}:host.md3-docked.md3-align-center .md3-toolbar-layout .md3-toolbar-container{justify-content:center}:host.md3-docked.md3-align-end .md3-toolbar-layout .md3-toolbar-container{justify-content:end}:host.md3-docked .md3-toolbar-layout{width:100%;height:100%}:host.md3-docked .md3-toolbar-layout .md3-toolbar-container{background-color:transparent}:host.md3-floating.md3-align-start .md3-toolbar-layout{justify-content:start}:host.md3-floating.md3-align-center .md3-toolbar-layout{justify-content:center}:host.md3-floating.md3-align-end .md3-toolbar-layout{justify-content:end}:host.md3-floating .md3-toolbar-layout{position:absolute;inset:0;pointer-events:none}:host.md3-floating .md3-toolbar-layout .md3-toolbar-container{pointer-events:auto}:host.md3-floating .md3-toolbar-layout ::ng-deep [md3-fab]{pointer-events:auto}:host.md3-horizontal{max-height:var(--md-toolbar-size)}:host.md3-horizontal .md3-toolbar-layout{height:var(--md-toolbar-size);padding:0 1em}:host.md3-horizontal .md3-toolbar-layout .md3-toolbar-container{height:var(--md-toolbar-size)}:host.md3-horizontal .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots ::ng-deep>md3-toolbar-item{max-width:var(--md-toolbar-item-max-size)}:host.md3-horizontal .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots ::ng-deep>md3-toolbar-item+md3-toolbar-item{margin-inline-start:var(--md-toolbar-gap)}:host.md3-horizontal.md3-docked .md3-toolbar-layout .md3-toolbar-container{width:100%}:host.md3-horizontal.md3-floating{height:0}:host.md3-horizontal.md3-floating .md3-toolbar-layout .md3-toolbar-container{padding:0 var(--md-toolbar-padding)}:host.md3-horizontal.md3-floating.md3-region-block-end .md3-toolbar-layout{inset-block-start:auto;inset-block-end:1em}:host.md3-horizontal.md3-floating.md3-region-block-start .md3-toolbar-layout{inset-block-end:auto;inset-block-start:1em}:host.md3-vertical{max-width:var(--md-toolbar-size)}:host.md3-vertical .md3-toolbar-layout{flex-direction:column;width:var(--md-toolbar-size);padding:1em 0}:host.md3-vertical .md3-toolbar-layout .md3-toolbar-container{flex-direction:column;width:var(--md-toolbar-size)}:host.md3-vertical .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots{flex-direction:column;width:100%;height:auto}:host.md3-vertical .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots ::ng-deep>md3-toolbar-item{max-height:var(--md-toolbar-item-max-size);min-height:3em}:host.md3-vertical .md3-toolbar-layout .md3-toolbar-container .md3-toolbar-slots ::ng-deep>md3-toolbar-item+md3-toolbar-item{margin-block-start:var(--md-toolbar-gap)}:host.md3-vertical.md3-docked .md3-toolbar-layout .md3-toolbar-container{height:100%}:host.md3-vertical.md3-floating{width:0}:host.md3-vertical.md3-floating .md3-toolbar-layout .md3-toolbar-container{padding:var(--md-toolbar-padding) 0}:host.md3-vertical.md3-floating.md3-region-inline-end .md3-toolbar-layout{inset-inline-start:auto;inset-inline-end:1em}:host.md3-vertical.md3-floating.md3-region-inline-start .md3-toolbar-layout{inset-inline-end:auto;inset-inline-start:1em}:host.md3-hidden{opacity:0;pointer-events:none}:host.md3-hidden.md3-horizontal{max-height:0em}:host.md3-hidden.md3-vertical{max-width:0em}:host.md3-hidden .md3-toolbar-layout{transform:scaleY(0)}:host.md3-collapsed{--md-toolbar-gap: 0em}:host.md3-collapsed .md3-toolbar-container .md3-toolbar-slots>::ng-deep md3-toolbar-item:not([md3-toolbar-persistent]){max-width:0em!important;max-height:0em!important;min-width:0em!important;min-height:0em!important;margin:0;padding-inline:0em;border-width:0em;opacity:0;visibility:hidden;transition:max-width var(--md-toolbar-duration) var(--md-toolbar-easing),max-height var(--md-toolbar-duration) var(--md-toolbar-easing),margin var(--md-toolbar-duration) var(--md-toolbar-easing),padding var(--md-toolbar-duration) var(--md-toolbar-easing),opacity var(--md-toolbar-effect-duration) linear,visibility 0s linear var(--md-toolbar-duration)}:host.md3-collapsed.md3-collapse-to-fab{--md-toolbar-padding: 0}:host.md3-collapsed.md3-collapse-to-fab .md3-toolbar-container{max-width:0em;opacity:0;visibility:hidden;pointer-events:none;box-shadow:var(--md-shadow-0dp);transition:max-width var(--md-toolbar-duration) var(--md-toolbar-easing),padding var(--md-toolbar-duration) var(--md-toolbar-easing),box-shadow var(--md-toolbar-effect-duration) linear,opacity var(--md-toolbar-effect-duration) linear,visibility 0s linear var(--md-toolbar-duration)}:host.md3-color-vibrant{--background-color: rgb(var(--md-scheme-primary-container));--foreground-color: rgb(var(--md-scheme-on-primary-container))}:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-icon-button].md3-standard,:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-icon-button].md3-outlined,:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-button].md3-text,:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-button].md3-outlined{--foreground-color: rgb(var(--md-scheme-on-primary-container))}:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-icon-button].md3-tonal,:host.md3-color-vibrant ::ng-deep .md3-toolbar-slots md3-toolbar-item [md3-button].md3-tonal{--background-color: rgb(var(--md-scheme-surface-container));--foreground-color: rgb(var(--md-scheme-on-surface))}\n"] }]
|
|
5663
5663
|
}], ctorParameters: () => [], propDecorators: { toolbarType: [{ type: i0.Input, args: [{ isSignal: true, alias: "toolbar-type", required: false }] }], toolbarColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "toolbar-color", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], alignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignment", required: false }] }], scrollAction: [{ type: i0.Input, args: [{ isSignal: true, alias: "scroll-action", required: false }] }], fabPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "fab-position", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }, { type: i0.Output, args: ["expandedChange"] }], layoutElement: [{ type: i0.ViewChild, args: ['layout', { isSignal: true }] }], containerElement: [{ type: i0.ViewChild, args: ['container', { isSignal: true }] }], slotsElement: [{ type: i0.ViewChild, args: ['slots', { isSignal: true }] }], fab: [{ type: i0.ContentChild, args: [i0.forwardRef(() => FloatingActionButton), { isSignal: true }] }] } });
|
|
5664
5664
|
|
|
5665
5665
|
class ToolbarItem {
|