@magmonium/one 0.4.91 → 0.4.94
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.
|
@@ -4424,7 +4424,8 @@ var SectionSearchComponent = class SectionSearchComponent extends BaseTextInputC
|
|
|
4424
4424
|
resultText = signal("", ...ngDevMode ? [{ debugName: "resultText" }] : /* istanbul ignore next */ []);
|
|
4425
4425
|
isDesignMode = !!inject(IS_DESIGN_MODE, { optional: true });
|
|
4426
4426
|
scrollSticky = injectScrollSticky(0, "none");
|
|
4427
|
-
|
|
4427
|
+
stickyOn = computed(() => this.sticky() && !this.isDesignMode, ...ngDevMode ? [{ debugName: "stickyOn" }] : /* istanbul ignore next */ []);
|
|
4428
|
+
isSticky = computed(() => this.stickyOn() && this.scrollSticky(), ...ngDevMode ? [{ debugName: "isSticky" }] : /* istanbul ignore next */ []);
|
|
4428
4429
|
sectionContext = inject(SECTION_CONTEXT, { optional: true });
|
|
4429
4430
|
sidepanel = computed(() => this.sectionContext?.sidepanel() ?? false, ...ngDevMode ? [{ debugName: "sidepanel" }] : /* istanbul ignore next */ []);
|
|
4430
4431
|
noBorder = computed(() => this.sectionContext?.variant() === "noBorder", ...ngDevMode ? [{ debugName: "noBorder" }] : /* istanbul ignore next */ []);
|
|
@@ -4626,7 +4627,7 @@ var SectionSearchComponent = class SectionSearchComponent extends BaseTextInputC
|
|
|
4626
4627
|
host: {
|
|
4627
4628
|
listeners: { "focusout": "onFocusOut($event)" },
|
|
4628
4629
|
properties: {
|
|
4629
|
-
"class.is-sticky-enabled": "
|
|
4630
|
+
"class.is-sticky-enabled": "stickyOn()",
|
|
4630
4631
|
"class.is-sticky": "isSticky()",
|
|
4631
4632
|
"class.has-sidepanel": "sidepanel()",
|
|
4632
4633
|
"class.has-results": "showResults()",
|
|
@@ -4829,7 +4830,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
4829
4830
|
],
|
|
4830
4831
|
host: {
|
|
4831
4832
|
"(focusout)": "onFocusOut($event)",
|
|
4832
|
-
"[class.is-sticky-enabled]": "
|
|
4833
|
+
"[class.is-sticky-enabled]": "stickyOn()",
|
|
4833
4834
|
"[class.is-sticky]": "isSticky()",
|
|
4834
4835
|
"[class.has-sidepanel]": "sidepanel()",
|
|
4835
4836
|
"[class.has-results]": "showResults()",
|
|
@@ -7743,7 +7744,8 @@ var SectionPaginationComponent = class SectionPaginationComponent {
|
|
|
7743
7744
|
selectorDir = viewChild(SelectorDirective, ...ngDevMode ? [{ debugName: "selectorDir" }] : /* istanbul ignore next */ []);
|
|
7744
7745
|
scrollSticky = injectScrollSticky(0, "none");
|
|
7745
7746
|
sectionContext = inject(SECTION_CONTEXT, { optional: true });
|
|
7746
|
-
|
|
7747
|
+
stickyOn = computed(() => this.sticky() && !this.isDesignMode, ...ngDevMode ? [{ debugName: "stickyOn" }] : /* istanbul ignore next */ []);
|
|
7748
|
+
isSticky = computed(() => this.stickyOn() && this.scrollSticky(), ...ngDevMode ? [{ debugName: "isSticky" }] : /* istanbul ignore next */ []);
|
|
7747
7749
|
noBorder = computed(() => this.sectionContext?.variant() === "noBorder", ...ngDevMode ? [{ debugName: "noBorder" }] : /* istanbul ignore next */ []);
|
|
7748
7750
|
options = computed(() => {
|
|
7749
7751
|
const authored = (this.perPageOptions() ?? "").split(",").map((entry) => Number(entry.trim())).filter((size) => Number.isFinite(size) && size > 0);
|
|
@@ -7937,7 +7939,7 @@ var SectionPaginationComponent = class SectionPaginationComponent {
|
|
|
7937
7939
|
host: {
|
|
7938
7940
|
properties: {
|
|
7939
7941
|
"class.is-hidden": "!visible()",
|
|
7940
|
-
"class.is-sticky-enabled": "
|
|
7942
|
+
"class.is-sticky-enabled": "stickyOn()",
|
|
7941
7943
|
"class.is-sticky": "isSticky()",
|
|
7942
7944
|
"class.align-left": "align() === \"left\"",
|
|
7943
7945
|
"class.align-center": "align() === \"center\"",
|
|
@@ -8113,7 +8115,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
8113
8115
|
host: {
|
|
8114
8116
|
class: "m-section-pagination",
|
|
8115
8117
|
"[class.is-hidden]": "!visible()",
|
|
8116
|
-
"[class.is-sticky-enabled]": "
|
|
8118
|
+
"[class.is-sticky-enabled]": "stickyOn()",
|
|
8117
8119
|
"[class.is-sticky]": "isSticky()",
|
|
8118
8120
|
"[class.align-left]": "align() === \"left\"",
|
|
8119
8121
|
"[class.align-center]": "align() === \"center\"",
|
|
@@ -9768,8 +9770,9 @@ var SectionComponent = class SectionComponent extends ConfigComponent {
|
|
|
9768
9770
|
resolvedMaxWidth = computed(() => this.maxWidth() ?? this.config()?.maxWidth, ...ngDevMode ? [{ debugName: "resolvedMaxWidth" }] : /* istanbul ignore next */ []);
|
|
9769
9771
|
resolvedHeightMode = computed(() => this.heightMode() ?? this.config()?.heightMode, ...ngDevMode ? [{ debugName: "resolvedHeightMode" }] : /* istanbul ignore next */ []);
|
|
9770
9772
|
resolvedMaxHeight = computed(() => this.maxHeight() ?? this.height() ?? this.config()?.maxHeight ?? this.config()?.height, ...ngDevMode ? [{ debugName: "resolvedMaxHeight" }] : /* istanbul ignore next */ []);
|
|
9771
|
-
isFullHeight = computed(() => this.resolvedHeightMode() === "full" || this.resolvedMaxHeight() === "full", ...ngDevMode ? [{ debugName: "isFullHeight" }] : /* istanbul ignore next */ []);
|
|
9773
|
+
isFullHeight = computed(() => !this.isDesignMode && (this.resolvedHeightMode() === "full" || this.resolvedMaxHeight() === "full"), ...ngDevMode ? [{ debugName: "isFullHeight" }] : /* istanbul ignore next */ []);
|
|
9772
9774
|
cssMaxHeight = computed(() => {
|
|
9775
|
+
if (this.isDesignMode) return void 0;
|
|
9773
9776
|
const mode = this.resolvedHeightMode();
|
|
9774
9777
|
const val = this.resolvedMaxHeight();
|
|
9775
9778
|
if (mode === "full" || val === "full") return "100vh";
|
|
@@ -16736,6 +16739,7 @@ var SectionHeaderComponent = class SectionHeaderComponent {
|
|
|
16736
16739
|
translateService = inject(TranslateService);
|
|
16737
16740
|
host = inject(ElementRef);
|
|
16738
16741
|
subText = computed(() => this.noTranslate() ? this.subLabel() : this.translateService.translate(this.subLabel(), this.params()), ...ngDevMode ? [{ debugName: "subText" }] : /* istanbul ignore next */ []);
|
|
16742
|
+
isDesignMode = !!inject(IS_DESIGN_MODE, { optional: true });
|
|
16739
16743
|
scrollSticky = injectScrollSticky(120, "none");
|
|
16740
16744
|
sectionContext = inject(SECTION_CONTEXT, { optional: true });
|
|
16741
16745
|
sidepanel = computed(() => this.sectionContext?.sidepanel() ?? false, ...ngDevMode ? [{ debugName: "sidepanel" }] : /* istanbul ignore next */ []);
|
|
@@ -16743,7 +16747,8 @@ var SectionHeaderComponent = class SectionHeaderComponent {
|
|
|
16743
16747
|
resolvedMaxWidth = computed(() => this.maxWidth() ?? this.sectionContext?.maxWidth?.(), ...ngDevMode ? [{ debugName: "resolvedMaxWidth" }] : /* istanbul ignore next */ []);
|
|
16744
16748
|
boxAlign = computed(() => this.sectionContext?.align?.() ?? "left", ...ngDevMode ? [{ debugName: "boxAlign" }] : /* istanbul ignore next */ []);
|
|
16745
16749
|
iconBox = computed(() => HEADER_LINE_BOX[this.level()], ...ngDevMode ? [{ debugName: "iconBox" }] : /* istanbul ignore next */ []);
|
|
16746
|
-
|
|
16750
|
+
stickyOn = computed(() => this.sticky() && !this.isDesignMode, ...ngDevMode ? [{ debugName: "stickyOn" }] : /* istanbul ignore next */ []);
|
|
16751
|
+
isSticky = computed(() => this.stickyOn() && this.scrollSticky(), ...ngDevMode ? [{ debugName: "isSticky" }] : /* istanbul ignore next */ []);
|
|
16747
16752
|
hasMenu = computed(() => !!this.menu() || !!this.menuName(), ...ngDevMode ? [{ debugName: "hasMenu" }] : /* istanbul ignore next */ []);
|
|
16748
16753
|
actionConfig = computed(() => {
|
|
16749
16754
|
const icon = this.actionButton();
|
|
@@ -16943,7 +16948,7 @@ var SectionHeaderComponent = class SectionHeaderComponent {
|
|
|
16943
16948
|
host: {
|
|
16944
16949
|
listeners: { "click": "onHeaderClick($event)" },
|
|
16945
16950
|
properties: {
|
|
16946
|
-
"class.is-sticky-enabled": "
|
|
16951
|
+
"class.is-sticky-enabled": "stickyOn()",
|
|
16947
16952
|
"class.is-sticky": "isSticky()",
|
|
16948
16953
|
"class.has-menu": "hasMenu()",
|
|
16949
16954
|
"class.align-left": "alignment() === \"left\"",
|
|
@@ -17086,7 +17091,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
17086
17091
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
17087
17092
|
host: {
|
|
17088
17093
|
class: "m-section-header",
|
|
17089
|
-
"[class.is-sticky-enabled]": "
|
|
17094
|
+
"[class.is-sticky-enabled]": "stickyOn()",
|
|
17090
17095
|
"[class.is-sticky]": "isSticky()",
|
|
17091
17096
|
"[class.has-menu]": "hasMenu()",
|
|
17092
17097
|
"[class.align-left]": "alignment() === \"left\"",
|
|
@@ -17286,8 +17291,10 @@ var SectionFooterComponent = class SectionFooterComponent {
|
|
|
17286
17291
|
align = input("right", ...ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []);
|
|
17287
17292
|
maxWidth = input(...ngDevMode ? [void 0, { debugName: "maxWidth" }] : /* istanbul ignore next */ []);
|
|
17288
17293
|
fullWidth = input(false, ...ngDevMode ? [{ debugName: "fullWidth" }] : /* istanbul ignore next */ []);
|
|
17294
|
+
isDesignMode = !!inject(IS_DESIGN_MODE, { optional: true });
|
|
17289
17295
|
scrollSticky = injectScrollSticky(0, "none");
|
|
17290
|
-
|
|
17296
|
+
stickyOn = computed(() => this.sticky() && !this.isDesignMode, ...ngDevMode ? [{ debugName: "stickyOn" }] : /* istanbul ignore next */ []);
|
|
17297
|
+
isSticky = computed(() => this.stickyOn() && this.scrollSticky(), ...ngDevMode ? [{ debugName: "isSticky" }] : /* istanbul ignore next */ []);
|
|
17291
17298
|
sectionContext = inject(SECTION_CONTEXT, { optional: true });
|
|
17292
17299
|
sidepanel = computed(() => this.sectionContext?.sidepanel() ?? false, ...ngDevMode ? [{ debugName: "sidepanel" }] : /* istanbul ignore next */ []);
|
|
17293
17300
|
noBorder = computed(() => this.sectionContext?.variant() === "noBorder", ...ngDevMode ? [{ debugName: "noBorder" }] : /* istanbul ignore next */ []);
|
|
@@ -17339,7 +17346,7 @@ var SectionFooterComponent = class SectionFooterComponent {
|
|
|
17339
17346
|
},
|
|
17340
17347
|
host: {
|
|
17341
17348
|
properties: {
|
|
17342
|
-
"class.is-sticky-enabled": "
|
|
17349
|
+
"class.is-sticky-enabled": "stickyOn()",
|
|
17343
17350
|
"class.is-sticky": "isSticky()",
|
|
17344
17351
|
"class.align-left": "align() === \"left\"",
|
|
17345
17352
|
"class.align-center": "align() === \"center\"",
|
|
@@ -17373,7 +17380,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
17373
17380
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
17374
17381
|
host: {
|
|
17375
17382
|
class: "m-section-footer",
|
|
17376
|
-
"[class.is-sticky-enabled]": "
|
|
17383
|
+
"[class.is-sticky-enabled]": "stickyOn()",
|
|
17377
17384
|
"[class.is-sticky]": "isSticky()",
|
|
17378
17385
|
"[class.align-left]": "align() === \"left\"",
|
|
17379
17386
|
"[class.align-center]": "align() === \"center\"",
|
|
@@ -36806,7 +36813,7 @@ var ScaleComponent = class ScaleComponent {
|
|
|
36806
36813
|
isSignal: true
|
|
36807
36814
|
}],
|
|
36808
36815
|
ngImport: i0,
|
|
36809
|
-
template: "<div [class]=\"'m-scale is-' + shownAs()\" role=\"img\" [attr.aria-label]=\"summary()\">\n <div class=\"m-scale__head\">\n @if (label()) {\n <span class=\"m-scale__label\">{{ label() | translate }}</span>\n }\n @if (primary(); as p) {\n <span class=\"m-scale__value\">{{ formatValue(p.value) }}</span>\n <span class=\"m-scale__value-name\">{{ p.name }}</span>\n }\n </div>\n\n @if (chips().length) {\n <div class=\"m-scale__chips\">\n @for (c of chips(); track c.key) {\n <span [class]=\"'m-scale__chip is-' + c.tone\" [attr.title]=\"c.detail || null\">{{ c.label }}</span>\n }\n </div>\n }\n\n @if (plot(); as p) {\n <div\n class=\"m-scale__plot\"\n [style.--_lanes]=\"p.lanes\"\n [style.--_brackets]=\"p.brackets.length\"\n [style.height.px]=\"shownAs() === 'vertical' ? verticalPx() : null\"\n >\n <div class=\"m-scale__axis\">\n @if (p.range; as r) {\n <span class=\"m-scale__range\" [style.--_from.%]=\"r.from\" [style.--_size.%]=\"r.size\"></span>\n }\n @for (b of p.bands; track b.key) {\n <span class=\"m-scale__band\" [style.--_from.%]=\"b.from\" [style.--_size.%]=\"b.size\"></span>\n }\n @for (t of p.ticks; track t.key) {\n <span\n [class]=\"'m-scale__tick is-' + t.kind\"\n [class.is-primary]=\"t.primary\"\n [class.is-pin-start]=\"t.pin === 'start'\"\n [class.is-pin-end]=\"t.pin === 'end'\"\n [style.--_at.%]=\"t.at\"\n ></span>\n }\n </div>\n\n @for (l of p.labels; track l.key) {\n <span\n class=\"m-scale__mark-label\"\n [class.is-lane-2]=\"l.lane === 1\"\n [class.is-primary]=\"l.primary\"\n [class.is-target]=\"l.target\"\n [style.--_at.%]=\"l.at\"\n >\n <span class=\"m-scale__mark-
|
|
36816
|
+
template: "<div [class]=\"'m-scale is-' + shownAs()\" role=\"img\" [attr.aria-label]=\"summary()\">\n <div class=\"m-scale__head\">\n @if (label()) {\n <span class=\"m-scale__label\">{{ label() | translate }}</span>\n }\n @if (primary(); as p) {\n <span class=\"m-scale__value\">{{ formatValue(p.value) }}</span>\n <span class=\"m-scale__value-name\">{{ p.name }}</span>\n }\n </div>\n\n @if (chips().length) {\n <div class=\"m-scale__chips\">\n @for (c of chips(); track c.key) {\n <span [class]=\"'m-scale__chip is-' + c.tone\" [attr.title]=\"c.detail || null\">{{ c.label }}</span>\n }\n </div>\n }\n\n @if (plot(); as p) {\n <div\n class=\"m-scale__plot\"\n [style.--_lanes]=\"p.lanes\"\n [style.--_brackets]=\"p.brackets.length\"\n [style.height.px]=\"shownAs() === 'vertical' ? verticalPx() : null\"\n >\n <div class=\"m-scale__axis\">\n @if (p.range; as r) {\n <span class=\"m-scale__range\" [style.--_from.%]=\"r.from\" [style.--_size.%]=\"r.size\"></span>\n }\n @for (b of p.bands; track b.key) {\n <span class=\"m-scale__band\" [style.--_from.%]=\"b.from\" [style.--_size.%]=\"b.size\"></span>\n }\n @for (t of p.ticks; track t.key) {\n <span\n [class]=\"'m-scale__tick is-' + t.kind\"\n [class.is-primary]=\"t.primary\"\n [class.is-pin-start]=\"t.pin === 'start'\"\n [class.is-pin-end]=\"t.pin === 'end'\"\n [style.--_at.%]=\"t.at\"\n ></span>\n }\n </div>\n\n @for (l of p.labels; track l.key) {\n <span\n class=\"m-scale__mark-label\"\n [class.is-lane-2]=\"l.lane === 1\"\n [class.is-primary]=\"l.primary\"\n [class.is-target]=\"l.target\"\n [style.--_at.%]=\"l.at\"\n >\n <span class=\"m-scale__mark-value\">{{ l.valueText }}</span>\n <span class=\"m-scale__mark-name\">{{ l.name }}</span>\n </span>\n }\n\n @for (b of p.brackets; track b.key) {\n <span\n [class]=\"'m-scale__bracket is-' + b.tone\"\n [attr.title]=\"b.label\"\n [style.--_from.%]=\"b.from\"\n [style.--_size.%]=\"b.size\"\n [style.--_row]=\"b.row\"\n >\n <span class=\"m-scale__bracket-label\">{{ b.label }}</span>\n </span>\n }\n </div>\n }\n</div>\n",
|
|
36810
36817
|
styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;flex:1 1 100%;min-width:0;--m-scale-target: var(--m-mm);--m-scale-up: var(--m-success);--m-scale-down: var(--m-error);--m-scale-warn: var(--m-warning);--m-scale-gold: var(--m-gold)}.m-scale{display:flex;flex-direction:column;gap:.75em;font-variant-numeric:tabular-nums}.m-scale__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5em}.m-scale__label{color:var(--m-text-secondary);font-weight:600}.m-scale__value{font-size:1.5em;font-weight:700}.m-scale__value-name{color:var(--m-text-tertiary);font-size:.8em}.m-scale__chips{display:flex;flex-wrap:wrap;gap:.4em}.m-scale__chip{display:inline-flex;align-items:center;gap:.4em;padding:.15em .65em .15em .5em;border:1px solid var(--m-border);border-radius:999px;font-size:.8em;font-weight:500}.m-scale__chip:before{content:\"\";width:.55em;height:.55em;border-radius:50%;background:var(--_tone, var(--m-text-tertiary))}.m-scale__chip.is-up{--_tone: var(--m-scale-up)}.m-scale__chip.is-down{--_tone: var(--m-scale-down)}.m-scale__chip.is-warn{--_tone: var(--m-scale-warn)}.m-scale__chip.is-gold{--_tone: var(--m-scale-gold);border-color:var(--m-scale-gold)}.m-scale__plot{position:relative}.m-scale__axis{position:absolute}.m-scale__axis:before{content:\"\";position:absolute;background:var(--m-border)}.m-scale__range,.m-scale__band,.m-scale__tick,.m-scale__bracket,.m-scale__mark-label{position:absolute}.m-scale__range{background:color-mix(in srgb,var(--m-text-tertiary) 22%,transparent)}.m-scale__band{border:1px dashed var(--m-scale-target);border-radius:.2em;background:repeating-linear-gradient(45deg,color-mix(in srgb,var(--m-scale-target) 22%,transparent) 0 2px,transparent 2px 6px)}.m-scale__tick{background:var(--m-text-secondary)}.m-scale__tick.is-bound{background:var(--m-text-tertiary)}.m-scale__tick.is-target{background:none}.m-scale__mark-label{font-size:.75em;white-space:nowrap}.m-scale__mark-label.is-primary{font-weight:700}.m-scale__mark-label.is-target{color:var(--m-scale-target)}.m-scale__mark-name{color:var(--m-text-tertiary)}.m-scale__mark-value{font-weight:600}.m-scale__bracket{border:1.5px solid var(--_tone, var(--m-text-tertiary))}.m-scale__bracket.is-up{--_tone: var(--m-scale-up)}.m-scale__bracket.is-down{--_tone: var(--m-scale-down)}.m-scale__bracket.is-warn{--_tone: var(--m-scale-warn)}.m-scale__bracket.is-gold{--_tone: var(--m-scale-gold)}.m-scale__bracket-label{position:absolute;color:var(--_tone, var(--m-text-tertiary));font-size:.7em;white-space:nowrap}.m-scale.is-horizontal .m-scale__plot{height:calc(2.6em + var(--_lanes, 1) * 2.4em + var(--_brackets, 0) * 1.8em)}.m-scale.is-horizontal .m-scale__axis{inset:0 0 auto;height:2.4em}.m-scale.is-horizontal .m-scale__axis:before{inset:50% 0 auto;height:2px;transform:translateY(-50%)}.m-scale.is-horizontal .m-scale__range,.m-scale.is-horizontal .m-scale__band{top:50%;left:var(--_from);width:var(--_size);transform:translateY(-50%)}.m-scale.is-horizontal .m-scale__range{height:.5em}.m-scale.is-horizontal .m-scale__band{height:1.4em}.m-scale.is-horizontal .m-scale__tick{top:50%;left:var(--_at);width:1.5px;height:.9em;transform:translate(-50%,-50%)}.m-scale.is-horizontal .m-scale__tick.is-bound{width:2.5px;height:1.3em}.m-scale.is-horizontal .m-scale__tick.is-target{width:0;height:2em;border-left:2px dashed var(--m-scale-target)}.m-scale.is-horizontal .m-scale__tick.is-primary{width:.9em;height:.9em;border:2px solid var(--m-background);border-radius:50%;background:var(--m-text)}.m-scale.is-horizontal .m-scale__tick.is-pin-start,.m-scale.is-horizontal .m-scale__tick.is-pin-end{width:.6em;height:.6em;border:0;border-top:2.5px solid var(--m-scale-target);border-right:2.5px solid var(--m-scale-target);background:none}.m-scale.is-horizontal .m-scale__tick.is-pin-start{transform:translate(-50%,-50%) rotate(-135deg)}.m-scale.is-horizontal .m-scale__tick.is-pin-end{transform:translate(-50%,-50%) rotate(45deg)}.m-scale.is-horizontal .m-scale__mark-label{top:3.4em;left:var(--_at);display:flex;flex-direction:column;align-items:center;transform:translate(calc(var(--_at) * -1))}.m-scale.is-horizontal .m-scale__mark-label.is-lane-2{top:6.6em}.m-scale.is-horizontal .m-scale__bracket{top:calc(2.8em + var(--_lanes, 1) * 2.4em + var(--_row, 0) * 1.8em);left:var(--_from);width:var(--_size);height:.45em;border-top:0}.m-scale.is-horizontal .m-scale__bracket-label{top:.45em;left:50%;transform:translate(-50%)}.m-scale.is-vertical .m-scale__axis{inset:0 auto 0 calc(.5em + var(--_brackets, 0) * .9em);width:2.4em}.m-scale.is-vertical .m-scale__axis:before{inset:0 auto 0 50%;width:2px;transform:translate(-50%)}.m-scale.is-vertical .m-scale__range,.m-scale.is-vertical .m-scale__band{top:var(--_from);left:50%;height:var(--_size);transform:translate(-50%)}.m-scale.is-vertical .m-scale__range{width:.5em}.m-scale.is-vertical .m-scale__band{width:1.4em}.m-scale.is-vertical .m-scale__tick{top:var(--_at);left:50%;width:.9em;height:1.5px;transform:translate(-50%,-50%)}.m-scale.is-vertical .m-scale__tick.is-bound{width:1.3em;height:2.5px}.m-scale.is-vertical .m-scale__tick.is-target{width:2em;height:0;border-top:2px dashed var(--m-scale-target)}.m-scale.is-vertical .m-scale__tick.is-primary{width:.9em;height:.9em;border:2px solid var(--m-background);border-radius:50%;background:var(--m-text)}.m-scale.is-vertical .m-scale__tick.is-pin-start,.m-scale.is-vertical .m-scale__tick.is-pin-end{width:.6em;height:.6em;border:0;border-top:2.5px solid var(--m-scale-target);border-right:2.5px solid var(--m-scale-target);background:none}.m-scale.is-vertical .m-scale__tick.is-pin-start{transform:translate(-50%,-50%) rotate(-45deg)}.m-scale.is-vertical .m-scale__tick.is-pin-end{transform:translate(-50%,-50%) rotate(135deg)}.m-scale.is-vertical .m-scale__mark-label{top:var(--_at);left:calc(3.6em + var(--_brackets, 0) * .9em);display:flex;gap:.5em;transform:translateY(-50%)}.m-scale.is-vertical .m-scale__bracket{top:var(--_from);left:calc(.2em + var(--_row, 0) * .9em);width:.45em;height:var(--_size);border-right:0}.m-scale.is-vertical .m-scale__bracket-label{display:none}\n"],
|
|
36811
36818
|
dependencies: [{
|
|
36812
36819
|
kind: "pipe",
|
|
@@ -36827,7 +36834,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
36827
36834
|
selector: "m-scale",
|
|
36828
36835
|
imports: [TranslatePipe],
|
|
36829
36836
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
36830
|
-
template: "<div [class]=\"'m-scale is-' + shownAs()\" role=\"img\" [attr.aria-label]=\"summary()\">\n <div class=\"m-scale__head\">\n @if (label()) {\n <span class=\"m-scale__label\">{{ label() | translate }}</span>\n }\n @if (primary(); as p) {\n <span class=\"m-scale__value\">{{ formatValue(p.value) }}</span>\n <span class=\"m-scale__value-name\">{{ p.name }}</span>\n }\n </div>\n\n @if (chips().length) {\n <div class=\"m-scale__chips\">\n @for (c of chips(); track c.key) {\n <span [class]=\"'m-scale__chip is-' + c.tone\" [attr.title]=\"c.detail || null\">{{ c.label }}</span>\n }\n </div>\n }\n\n @if (plot(); as p) {\n <div\n class=\"m-scale__plot\"\n [style.--_lanes]=\"p.lanes\"\n [style.--_brackets]=\"p.brackets.length\"\n [style.height.px]=\"shownAs() === 'vertical' ? verticalPx() : null\"\n >\n <div class=\"m-scale__axis\">\n @if (p.range; as r) {\n <span class=\"m-scale__range\" [style.--_from.%]=\"r.from\" [style.--_size.%]=\"r.size\"></span>\n }\n @for (b of p.bands; track b.key) {\n <span class=\"m-scale__band\" [style.--_from.%]=\"b.from\" [style.--_size.%]=\"b.size\"></span>\n }\n @for (t of p.ticks; track t.key) {\n <span\n [class]=\"'m-scale__tick is-' + t.kind\"\n [class.is-primary]=\"t.primary\"\n [class.is-pin-start]=\"t.pin === 'start'\"\n [class.is-pin-end]=\"t.pin === 'end'\"\n [style.--_at.%]=\"t.at\"\n ></span>\n }\n </div>\n\n @for (l of p.labels; track l.key) {\n <span\n class=\"m-scale__mark-label\"\n [class.is-lane-2]=\"l.lane === 1\"\n [class.is-primary]=\"l.primary\"\n [class.is-target]=\"l.target\"\n [style.--_at.%]=\"l.at\"\n >\n <span class=\"m-scale__mark-
|
|
36837
|
+
template: "<div [class]=\"'m-scale is-' + shownAs()\" role=\"img\" [attr.aria-label]=\"summary()\">\n <div class=\"m-scale__head\">\n @if (label()) {\n <span class=\"m-scale__label\">{{ label() | translate }}</span>\n }\n @if (primary(); as p) {\n <span class=\"m-scale__value\">{{ formatValue(p.value) }}</span>\n <span class=\"m-scale__value-name\">{{ p.name }}</span>\n }\n </div>\n\n @if (chips().length) {\n <div class=\"m-scale__chips\">\n @for (c of chips(); track c.key) {\n <span [class]=\"'m-scale__chip is-' + c.tone\" [attr.title]=\"c.detail || null\">{{ c.label }}</span>\n }\n </div>\n }\n\n @if (plot(); as p) {\n <div\n class=\"m-scale__plot\"\n [style.--_lanes]=\"p.lanes\"\n [style.--_brackets]=\"p.brackets.length\"\n [style.height.px]=\"shownAs() === 'vertical' ? verticalPx() : null\"\n >\n <div class=\"m-scale__axis\">\n @if (p.range; as r) {\n <span class=\"m-scale__range\" [style.--_from.%]=\"r.from\" [style.--_size.%]=\"r.size\"></span>\n }\n @for (b of p.bands; track b.key) {\n <span class=\"m-scale__band\" [style.--_from.%]=\"b.from\" [style.--_size.%]=\"b.size\"></span>\n }\n @for (t of p.ticks; track t.key) {\n <span\n [class]=\"'m-scale__tick is-' + t.kind\"\n [class.is-primary]=\"t.primary\"\n [class.is-pin-start]=\"t.pin === 'start'\"\n [class.is-pin-end]=\"t.pin === 'end'\"\n [style.--_at.%]=\"t.at\"\n ></span>\n }\n </div>\n\n @for (l of p.labels; track l.key) {\n <span\n class=\"m-scale__mark-label\"\n [class.is-lane-2]=\"l.lane === 1\"\n [class.is-primary]=\"l.primary\"\n [class.is-target]=\"l.target\"\n [style.--_at.%]=\"l.at\"\n >\n <span class=\"m-scale__mark-value\">{{ l.valueText }}</span>\n <span class=\"m-scale__mark-name\">{{ l.name }}</span>\n </span>\n }\n\n @for (b of p.brackets; track b.key) {\n <span\n [class]=\"'m-scale__bracket is-' + b.tone\"\n [attr.title]=\"b.label\"\n [style.--_from.%]=\"b.from\"\n [style.--_size.%]=\"b.size\"\n [style.--_row]=\"b.row\"\n >\n <span class=\"m-scale__bracket-label\">{{ b.label }}</span>\n </span>\n }\n </div>\n }\n</div>\n",
|
|
36831
36838
|
styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;flex:1 1 100%;min-width:0;--m-scale-target: var(--m-mm);--m-scale-up: var(--m-success);--m-scale-down: var(--m-error);--m-scale-warn: var(--m-warning);--m-scale-gold: var(--m-gold)}.m-scale{display:flex;flex-direction:column;gap:.75em;font-variant-numeric:tabular-nums}.m-scale__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5em}.m-scale__label{color:var(--m-text-secondary);font-weight:600}.m-scale__value{font-size:1.5em;font-weight:700}.m-scale__value-name{color:var(--m-text-tertiary);font-size:.8em}.m-scale__chips{display:flex;flex-wrap:wrap;gap:.4em}.m-scale__chip{display:inline-flex;align-items:center;gap:.4em;padding:.15em .65em .15em .5em;border:1px solid var(--m-border);border-radius:999px;font-size:.8em;font-weight:500}.m-scale__chip:before{content:\"\";width:.55em;height:.55em;border-radius:50%;background:var(--_tone, var(--m-text-tertiary))}.m-scale__chip.is-up{--_tone: var(--m-scale-up)}.m-scale__chip.is-down{--_tone: var(--m-scale-down)}.m-scale__chip.is-warn{--_tone: var(--m-scale-warn)}.m-scale__chip.is-gold{--_tone: var(--m-scale-gold);border-color:var(--m-scale-gold)}.m-scale__plot{position:relative}.m-scale__axis{position:absolute}.m-scale__axis:before{content:\"\";position:absolute;background:var(--m-border)}.m-scale__range,.m-scale__band,.m-scale__tick,.m-scale__bracket,.m-scale__mark-label{position:absolute}.m-scale__range{background:color-mix(in srgb,var(--m-text-tertiary) 22%,transparent)}.m-scale__band{border:1px dashed var(--m-scale-target);border-radius:.2em;background:repeating-linear-gradient(45deg,color-mix(in srgb,var(--m-scale-target) 22%,transparent) 0 2px,transparent 2px 6px)}.m-scale__tick{background:var(--m-text-secondary)}.m-scale__tick.is-bound{background:var(--m-text-tertiary)}.m-scale__tick.is-target{background:none}.m-scale__mark-label{font-size:.75em;white-space:nowrap}.m-scale__mark-label.is-primary{font-weight:700}.m-scale__mark-label.is-target{color:var(--m-scale-target)}.m-scale__mark-name{color:var(--m-text-tertiary)}.m-scale__mark-value{font-weight:600}.m-scale__bracket{border:1.5px solid var(--_tone, var(--m-text-tertiary))}.m-scale__bracket.is-up{--_tone: var(--m-scale-up)}.m-scale__bracket.is-down{--_tone: var(--m-scale-down)}.m-scale__bracket.is-warn{--_tone: var(--m-scale-warn)}.m-scale__bracket.is-gold{--_tone: var(--m-scale-gold)}.m-scale__bracket-label{position:absolute;color:var(--_tone, var(--m-text-tertiary));font-size:.7em;white-space:nowrap}.m-scale.is-horizontal .m-scale__plot{height:calc(2.6em + var(--_lanes, 1) * 2.4em + var(--_brackets, 0) * 1.8em)}.m-scale.is-horizontal .m-scale__axis{inset:0 0 auto;height:2.4em}.m-scale.is-horizontal .m-scale__axis:before{inset:50% 0 auto;height:2px;transform:translateY(-50%)}.m-scale.is-horizontal .m-scale__range,.m-scale.is-horizontal .m-scale__band{top:50%;left:var(--_from);width:var(--_size);transform:translateY(-50%)}.m-scale.is-horizontal .m-scale__range{height:.5em}.m-scale.is-horizontal .m-scale__band{height:1.4em}.m-scale.is-horizontal .m-scale__tick{top:50%;left:var(--_at);width:1.5px;height:.9em;transform:translate(-50%,-50%)}.m-scale.is-horizontal .m-scale__tick.is-bound{width:2.5px;height:1.3em}.m-scale.is-horizontal .m-scale__tick.is-target{width:0;height:2em;border-left:2px dashed var(--m-scale-target)}.m-scale.is-horizontal .m-scale__tick.is-primary{width:.9em;height:.9em;border:2px solid var(--m-background);border-radius:50%;background:var(--m-text)}.m-scale.is-horizontal .m-scale__tick.is-pin-start,.m-scale.is-horizontal .m-scale__tick.is-pin-end{width:.6em;height:.6em;border:0;border-top:2.5px solid var(--m-scale-target);border-right:2.5px solid var(--m-scale-target);background:none}.m-scale.is-horizontal .m-scale__tick.is-pin-start{transform:translate(-50%,-50%) rotate(-135deg)}.m-scale.is-horizontal .m-scale__tick.is-pin-end{transform:translate(-50%,-50%) rotate(45deg)}.m-scale.is-horizontal .m-scale__mark-label{top:3.4em;left:var(--_at);display:flex;flex-direction:column;align-items:center;transform:translate(calc(var(--_at) * -1))}.m-scale.is-horizontal .m-scale__mark-label.is-lane-2{top:6.6em}.m-scale.is-horizontal .m-scale__bracket{top:calc(2.8em + var(--_lanes, 1) * 2.4em + var(--_row, 0) * 1.8em);left:var(--_from);width:var(--_size);height:.45em;border-top:0}.m-scale.is-horizontal .m-scale__bracket-label{top:.45em;left:50%;transform:translate(-50%)}.m-scale.is-vertical .m-scale__axis{inset:0 auto 0 calc(.5em + var(--_brackets, 0) * .9em);width:2.4em}.m-scale.is-vertical .m-scale__axis:before{inset:0 auto 0 50%;width:2px;transform:translate(-50%)}.m-scale.is-vertical .m-scale__range,.m-scale.is-vertical .m-scale__band{top:var(--_from);left:50%;height:var(--_size);transform:translate(-50%)}.m-scale.is-vertical .m-scale__range{width:.5em}.m-scale.is-vertical .m-scale__band{width:1.4em}.m-scale.is-vertical .m-scale__tick{top:var(--_at);left:50%;width:.9em;height:1.5px;transform:translate(-50%,-50%)}.m-scale.is-vertical .m-scale__tick.is-bound{width:1.3em;height:2.5px}.m-scale.is-vertical .m-scale__tick.is-target{width:2em;height:0;border-top:2px dashed var(--m-scale-target)}.m-scale.is-vertical .m-scale__tick.is-primary{width:.9em;height:.9em;border:2px solid var(--m-background);border-radius:50%;background:var(--m-text)}.m-scale.is-vertical .m-scale__tick.is-pin-start,.m-scale.is-vertical .m-scale__tick.is-pin-end{width:.6em;height:.6em;border:0;border-top:2.5px solid var(--m-scale-target);border-right:2.5px solid var(--m-scale-target);background:none}.m-scale.is-vertical .m-scale__tick.is-pin-start{transform:translate(-50%,-50%) rotate(-45deg)}.m-scale.is-vertical .m-scale__tick.is-pin-end{transform:translate(-50%,-50%) rotate(135deg)}.m-scale.is-vertical .m-scale__mark-label{top:var(--_at);left:calc(3.6em + var(--_brackets, 0) * .9em);display:flex;gap:.5em;transform:translateY(-50%)}.m-scale.is-vertical .m-scale__bracket{top:var(--_from);left:calc(.2em + var(--_row, 0) * .9em);width:.45em;height:var(--_size);border-right:0}.m-scale.is-vertical .m-scale__bracket-label{display:none}\n"]
|
|
36832
36839
|
}]
|
|
36833
36840
|
}],
|