@masterkeymaterial/ui 0.0.5 → 0.0.7
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.
|
@@ -4006,13 +4006,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
4006
4006
|
class UiProgress {
|
|
4007
4007
|
value = input(0, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
4008
4008
|
bufferValue = input(0, ...(ngDevMode ? [{ debugName: "bufferValue" }] : /* istanbul ignore next */ []));
|
|
4009
|
-
mode = input('
|
|
4009
|
+
mode = input('indeterminate', ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
|
|
4010
4010
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: UiProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4011
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
4011
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: UiProgress, isStandalone: true, selector: "ui-progress", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, bufferValue: { classPropertyName: "bufferValue", publicName: "bufferValue", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@switch (mode()) {\n@case ('determinate'){\n<div class=\"bar-progress determinate\">\n\t<div class=\"bar-progress-filled\" [style.width.%]=\"value() ?? 0\"></div>\n</div>\n}\n\n@case ('indeterminate'){\n<div class=\"bar-progress indeterminate\">\n\t<div class=\"bar-progress-filled\"></div>\n</div>\n}\n\n@case ('buffer'){\n<div class=\"bar-progress buffer\">\n\t<div class=\"bar-progress-filled\" [style.width.%]=\"value() ?? 0\"></div>\n\t<div class=\"bar-progress-buffer\" [style.width.%]=\"bufferValue() ?? 0\"></div>\n</div>\n}\n\n@case ('query'){\n<div class=\"bar-progress query\">\n\t<div class=\"bar-progress-filled\"></div>\n</div>\n}\n\n@default {\n<div class=\"bar-progress indeterminate\">\n\t<div class=\"bar-progress-filled\"></div>\n</div>\n}\n\n}", styles: [".bar-progress{position:relative;width:100%;height:4px;background:color-mix(in srgb,var(--ui-background, var(--sys-background, hsl(210, 80%, 50%))) 25%,transparent);overflow:hidden}.bar-progress-filled{position:absolute;top:0;left:0;height:100%;background:var(--primary, hsl(210, 80%, 50%));transition:width .25s ease}.bar-progress-buffer{position:absolute;top:0;left:0;height:100%;background:color-mix(in srgb,var(--primary, hsl(210, 80%, 50%)) 40%,transparent);transition:width .25s ease;z-index:-1}.bar-progress.indeterminate .bar-progress-filled{width:50%;animation:indeterminate 1.5s cubic-bezier(.65,.815,.735,.395) infinite}@keyframes indeterminate{0%{left:-50%}to{left:100%}}.bar-progress.query .bar-progress-filled{width:30%;animation:query 1.5s cubic-bezier(.65,.815,.735,.395) infinite}@keyframes query{0%{left:100%}to{left:-30%}}\n"] });
|
|
4012
4012
|
}
|
|
4013
4013
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: UiProgress, decorators: [{
|
|
4014
4014
|
type: Component,
|
|
4015
|
-
args: [{ selector: 'ui-progress', template: "<progress [value]=\"value()\"></progress
|
|
4015
|
+
args: [{ selector: 'ui-progress', template: "@switch (mode()) {\n@case ('determinate'){\n<div class=\"bar-progress determinate\">\n\t<div class=\"bar-progress-filled\" [style.width.%]=\"value() ?? 0\"></div>\n</div>\n}\n\n@case ('indeterminate'){\n<div class=\"bar-progress indeterminate\">\n\t<div class=\"bar-progress-filled\"></div>\n</div>\n}\n\n@case ('buffer'){\n<div class=\"bar-progress buffer\">\n\t<div class=\"bar-progress-filled\" [style.width.%]=\"value() ?? 0\"></div>\n\t<div class=\"bar-progress-buffer\" [style.width.%]=\"bufferValue() ?? 0\"></div>\n</div>\n}\n\n@case ('query'){\n<div class=\"bar-progress query\">\n\t<div class=\"bar-progress-filled\"></div>\n</div>\n}\n\n@default {\n<div class=\"bar-progress indeterminate\">\n\t<div class=\"bar-progress-filled\"></div>\n</div>\n}\n\n}", styles: [".bar-progress{position:relative;width:100%;height:4px;background:color-mix(in srgb,var(--ui-background, var(--sys-background, hsl(210, 80%, 50%))) 25%,transparent);overflow:hidden}.bar-progress-filled{position:absolute;top:0;left:0;height:100%;background:var(--primary, hsl(210, 80%, 50%));transition:width .25s ease}.bar-progress-buffer{position:absolute;top:0;left:0;height:100%;background:color-mix(in srgb,var(--primary, hsl(210, 80%, 50%)) 40%,transparent);transition:width .25s ease;z-index:-1}.bar-progress.indeterminate .bar-progress-filled{width:50%;animation:indeterminate 1.5s cubic-bezier(.65,.815,.735,.395) infinite}@keyframes indeterminate{0%{left:-50%}to{left:100%}}.bar-progress.query .bar-progress-filled{width:30%;animation:query 1.5s cubic-bezier(.65,.815,.735,.395) infinite}@keyframes query{0%{left:100%}to{left:-30%}}\n"] }]
|
|
4016
4016
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], bufferValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "bufferValue", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }] } });
|
|
4017
4017
|
|
|
4018
4018
|
class UiSlide {
|