monkey-style-guide-v2 0.0.91 → 0.0.92
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/monkey-style-guide-v2.mjs +7 -4
- package/fesm2022/monkey-style-guide-v2.mjs.map +1 -1
- package/lib/components/download-button/download-button.component.d.ts +1 -0
- package/lib/components/tabs/tab-link.directive.d.ts +1 -1
- package/monkey-style-guide-v2-0.0.92.tgz +0 -0
- package/package.json +1 -1
- package/monkey-style-guide-v2-0.0.91.tgz +0 -0
|
@@ -4511,6 +4511,9 @@ class MonkeyDownloadButtonComponent {
|
|
|
4511
4511
|
get hasProgress() {
|
|
4512
4512
|
return typeof this.progress === 'number' && this.progress > 0;
|
|
4513
4513
|
}
|
|
4514
|
+
get enablleMargin() {
|
|
4515
|
+
return this.safeProgress === 100;
|
|
4516
|
+
}
|
|
4514
4517
|
constructor() {
|
|
4515
4518
|
this.progress = 0;
|
|
4516
4519
|
this.color = 'default';
|
|
@@ -4547,10 +4550,10 @@ class MonkeyDownloadButtonComponent {
|
|
|
4547
4550
|
[style.--mecx-button-progress]="hasProgress ? safeProgress + '%' : null"
|
|
4548
4551
|
*ngIf="hasProgress"
|
|
4549
4552
|
>
|
|
4550
|
-
{{ safeProgress }}
|
|
4553
|
+
<span [class.pe-2]="enablleMargin">{{ safeProgress }}%</span>
|
|
4551
4554
|
</div>
|
|
4552
4555
|
</monkey-button>
|
|
4553
|
-
`, isInline: true, styles: [":host{display:inline-flex}:host .content-download{display:flex;align-items:center;justify-content:center;gap:var(--mecx-spaces-xs);padding:0px var(--mecx-spaces-small);flex-shrink:0;letter-spacing:.48px;font-weight:400;transition:transform .2s cubic-bezier(0,.5,.2,1)}:host .content-download-progress{position:absolute;left:0;top:0;height:100%;color:var(--mecx-color-theme-contrast-main);background:var(--mecx-color-theme-main);z-index:1;font-weight:500;font-size:12px;display:flex;align-items:center;justify-content:flex-end;width:var(--mecx-button-progress);transition:width .01s ease-in-out}:host .content-download-progress:before,:host .content-download-progress:after{content:\"\";position:absolute;width:200px;height:200px;top:50%;right:-8px;background:var(--mecx-color-theme-main);border-radius:45% 47% 43% 46%;transform:translateY(-50%) rotate(0);animation:rotate 7s linear infinite;z-index:-1}:host .content-download-progress:after{content:\"\";border-radius:47% 42% 46% 44%;background:var(--mecx-color-theme-300);transform:translateY(-50%) rotate(0);animation:rotate 9s linear -4s infinite;z-index:-2;width:140px;height:150px}@keyframes rotate{50%{transform:translateY(-50%) rotate(180deg)}to{transform:translateY(-50%) rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MonkeyButtonComponent, selector: "monkey-button", inputs: ["disabled", "color", "size", "type", "loading", "id"] }] }); }
|
|
4556
|
+
`, isInline: true, styles: [":host{display:inline-flex}:host .content-download{display:flex;align-items:center;justify-content:center;gap:var(--mecx-spaces-xs);padding:0px var(--mecx-spaces-small);flex-shrink:0;letter-spacing:.48px;font-weight:400;transition:transform .2s cubic-bezier(0,.5,.2,1)}:host .content-download-progress{position:absolute;left:0;top:0;height:100%;color:var(--mecx-color-theme-contrast-main);background:var(--mecx-color-theme-main);z-index:1;font-weight:500;font-size:12px;display:flex;align-items:center;justify-content:flex-end;width:var(--mecx-button-progress);transition:width .01s ease-in-out;text-align:right}:host .content-download-progress:before,:host .content-download-progress:after{content:\"\";position:absolute;width:200px;height:200px;top:50%;right:-8px;background:var(--mecx-color-theme-main);border-radius:45% 47% 43% 46%;transform:translateY(-50%) rotate(0);animation:rotate 7s linear infinite;z-index:-1}:host .content-download-progress:after{content:\"\";border-radius:47% 42% 46% 44%;background:var(--mecx-color-theme-300);transform:translateY(-50%) rotate(0);animation:rotate 9s linear -4s infinite;z-index:-2;width:140px;height:150px}@keyframes rotate{50%{transform:translateY(-50%) rotate(180deg)}to{transform:translateY(-50%) rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MonkeyButtonComponent, selector: "monkey-button", inputs: ["disabled", "color", "size", "type", "loading", "id"] }] }); }
|
|
4554
4557
|
}
|
|
4555
4558
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MonkeyDownloadButtonComponent, decorators: [{
|
|
4556
4559
|
type: Component,
|
|
@@ -4575,7 +4578,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
4575
4578
|
[style.--mecx-button-progress]="hasProgress ? safeProgress + '%' : null"
|
|
4576
4579
|
*ngIf="hasProgress"
|
|
4577
4580
|
>
|
|
4578
|
-
{{ safeProgress }}
|
|
4581
|
+
<span [class.pe-2]="enablleMargin">{{ safeProgress }}%</span>
|
|
4579
4582
|
</div>
|
|
4580
4583
|
</monkey-button>
|
|
4581
4584
|
`, host: {
|
|
@@ -4583,7 +4586,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
4583
4586
|
class: 'mecx-download-button',
|
|
4584
4587
|
'[attr.id]': 'id',
|
|
4585
4588
|
'[attr.tabindex]': 'disabled ? -1 : tabIndex'
|
|
4586
|
-
}, styles: [":host{display:inline-flex}:host .content-download{display:flex;align-items:center;justify-content:center;gap:var(--mecx-spaces-xs);padding:0px var(--mecx-spaces-small);flex-shrink:0;letter-spacing:.48px;font-weight:400;transition:transform .2s cubic-bezier(0,.5,.2,1)}:host .content-download-progress{position:absolute;left:0;top:0;height:100%;color:var(--mecx-color-theme-contrast-main);background:var(--mecx-color-theme-main);z-index:1;font-weight:500;font-size:12px;display:flex;align-items:center;justify-content:flex-end;width:var(--mecx-button-progress);transition:width .01s ease-in-out}:host .content-download-progress:before,:host .content-download-progress:after{content:\"\";position:absolute;width:200px;height:200px;top:50%;right:-8px;background:var(--mecx-color-theme-main);border-radius:45% 47% 43% 46%;transform:translateY(-50%) rotate(0);animation:rotate 7s linear infinite;z-index:-1}:host .content-download-progress:after{content:\"\";border-radius:47% 42% 46% 44%;background:var(--mecx-color-theme-300);transform:translateY(-50%) rotate(0);animation:rotate 9s linear -4s infinite;z-index:-2;width:140px;height:150px}@keyframes rotate{50%{transform:translateY(-50%) rotate(180deg)}to{transform:translateY(-50%) rotate(360deg)}}\n"] }]
|
|
4589
|
+
}, styles: [":host{display:inline-flex}:host .content-download{display:flex;align-items:center;justify-content:center;gap:var(--mecx-spaces-xs);padding:0px var(--mecx-spaces-small);flex-shrink:0;letter-spacing:.48px;font-weight:400;transition:transform .2s cubic-bezier(0,.5,.2,1)}:host .content-download-progress{position:absolute;left:0;top:0;height:100%;color:var(--mecx-color-theme-contrast-main);background:var(--mecx-color-theme-main);z-index:1;font-weight:500;font-size:12px;display:flex;align-items:center;justify-content:flex-end;width:var(--mecx-button-progress);transition:width .01s ease-in-out;text-align:right}:host .content-download-progress:before,:host .content-download-progress:after{content:\"\";position:absolute;width:200px;height:200px;top:50%;right:-8px;background:var(--mecx-color-theme-main);border-radius:45% 47% 43% 46%;transform:translateY(-50%) rotate(0);animation:rotate 7s linear infinite;z-index:-1}:host .content-download-progress:after{content:\"\";border-radius:47% 42% 46% 44%;background:var(--mecx-color-theme-300);transform:translateY(-50%) rotate(0);animation:rotate 9s linear -4s infinite;z-index:-2;width:140px;height:150px}@keyframes rotate{50%{transform:translateY(-50%) rotate(180deg)}to{transform:translateY(-50%) rotate(360deg)}}\n"] }]
|
|
4587
4590
|
}], ctorParameters: () => [], propDecorators: { progress: [{
|
|
4588
4591
|
type: Input
|
|
4589
4592
|
}], disabled: [{
|