native-document 1.0.129 → 1.0.131

package/src/components/progress/Progress.js

@@ -1,12 +1,15 @@
 import BaseComponent from "../BaseComponent";
 import EventEmitter from "../../../src/core/utils/EventEmitter";
 import {Validator} from "../../../index";
+import DebugManager from "../../core/utils/debug-manager";
 
-export default function Progress(config = {}) {
+export default function Progress(props = {}) {
     if (!(this instanceof Progress)) {
-        return new Progress(config);
+        return new Progress(props);
     }
 
+    BaseComponent.call(this, props);
+
     this.$description = {
         value: null,
         type: null,
@@ -22,7 +25,8 @@ export default function Progress(config = {}) {
         striped: null,
         animated: null,
         render: null,
-        ...config
+        borderRadiusType: null,
+        props
     };
 }
 
@@ -30,13 +34,32 @@ BaseComponent.extends(Progress, EventEmitter);
 
 Progress.defaultTemplate = null;
 
-Progress.use = function(template) {};
+Progress.use = function(template) {
+    Progress.defaultTemplate = template.progress;
+};
+
+Progress.preset = function(name, callback) {
+    if (Progress.prototype[name] || Progress[name]) {
+        DebugManager.warn(`Warning: the ${name} method already exists in Progress.`);
+        return;
+    }
+    Progress[name] = (props) => callback(new Progress(props));
+};
+
+Progress.presets = function(presets) {
+    for (const name in presets) {
+        Progress.preset(name, presets[name]);
+    }
+};
+
 
 Progress.prototype.model = function(observable) {
     this.$description.value = observable;
     return this;
 };
 
+Progress.prototype.bind = Progress.prototype.model;
+
 Progress.prototype.setCurrentStep = function(step) {
     this.$description.value?.set(step);
     this.emit('change', step);
@@ -51,12 +74,7 @@ Progress.prototype.value = function() {
 };
 
 Progress.prototype.setValue = function(newValue) {
-    const value = this.$description.value;
-    if(Validator.isObservable(value)) {
-        value.set(newValue);
-        return this;
-    }
-    this.$description.value = newValue;
+    this.setCurrentStep(newValue);
     return this;
 };
 
@@ -82,6 +100,11 @@ Progress.prototype.line = function() {
     return this.type('line');
 };
 
+Progress.prototype.pill = function() {
+    this.$description.borderRadiusType = 'pill';
+    return this;
+};
+
 // Variant
 Progress.prototype.variant = function(name) {
     this.$description.variant = name;

package/src/components/skeleton/Skeleton.js

@@ -1,22 +1,47 @@
+import BaseComponent from "../BaseComponent";
+import DebugManager from "../../core/utils/debug-manager";
 
-export default function Skeleton(type = 'rect', config = {}) {
+export default function Skeleton(props = {}) {
     if (!(this instanceof Skeleton)) {
-        return new Skeleton(config);
+        return new Skeleton(props);
     }
+
+    BaseComponent.call(this, props);
+
     this.$description = {
-        type,
+        type: 'rect',
+        variant: 'pulse',
+        borderRadiusType: 'rounded',
         lines: null,
         width: null,
         height: null,
         loading: null,
         repeat: null,
-        ...config
+        props
     };
 }
 
+BaseComponent.extends(Skeleton);
+
 Skeleton.defaultTemplate = null;
 
-Skeleton.use = function(template) {};
+Skeleton.use = function(template) {
+    Skeleton.defaultTemplate = template.skeleton;
+};
+
+Skeleton.preset = function(name, callback) {
+    if (Skeleton.prototype[name] || Skeleton[name]) {
+        DebugManager.warn(`Warning: the ${name} method already exists in Skeleton.`);
+        return;
+    }
+    Skeleton[name] = (props) => callback(new Skeleton(props));
+};
+
+Skeleton.presets = function(presets) {
+    for (const name in presets) {
+        Skeleton.preset(name, presets[name]);
+    }
+};
 
 Skeleton.prototype.type = function(type) {
     this.$description.type = type;
@@ -39,6 +64,21 @@ Skeleton.prototype.image = function() {
     return this.type('image');
 };
 
+Skeleton.prototype.rounded = function() {
+    this.$description.borderRadiusType = 'rounded';
+    return this;
+};
+
+Skeleton.prototype.pill = function() {
+    this.$description.borderRadiusType = 'pill';
+    return this;
+};
+
+Skeleton.prototype.smooth = function() {
+    this.$description.borderRadiusType = 'smooth';
+    return this;
+};
+
 Skeleton.prototype.width = function(width) {
     this.$description.width = width;
     return this;
@@ -63,7 +103,6 @@ Skeleton.prototype.wave = function() {
 Skeleton.prototype.pulse = function() {
     return this.variant('pulse');
 };
-Skeleton.prototype.rounded = function() {};
 
 Skeleton.prototype.loading = function(isLoading) {
     this.$description.loading = isLoading;

package/src/components/spacer/Spacer.js

@@ -0,0 +1,13 @@
+import BaseComponent from "../BaseComponent";
+
+export function Spacer(props = {}) {
+    if (!(this instanceof Spacer)) {
+        return new Spacer(props);
+    }
+    BaseComponent.call(this, props);
+    this.$description = {
+        type: 'spacer',
+        props
+    };
+}
+BaseComponent.extends(Spacer);

package/src/components/spacer/index.js

@@ -0,0 +1,5 @@
+import Spacer from './spacer';
+
+export {
+    Spacer,
+}

package/src/components/spinner/Spinner.js

@@ -1,12 +1,14 @@
+import BaseComponent from "../BaseComponent";
+import DebugManager from "../../core/utils/debug-manager";
 
-export default function Spinner(config = {}) {
+export default function Spinner(props = {}) {
     if (!(this instanceof Spinner)) {
-        return new Spinner(config);
+        return new Spinner(props);
     }
 
     this.$description = {
         type: 'circle',
-        variant: null,
+        variant: 'primary',
         color: null,
         size: 'small',
         label: null,
@@ -15,13 +17,29 @@ export default function Spinner(config = {}) {
         backdrop: null,
         render: null,
         loading: null,
-        speed: null,
-        ...config
+        speed: 'normal',
+        props
     };
 }
 
-Spinner.use = function(template) {};
 Spinner.defaultTemplate = null;
+Spinner.use = function(template) {
+    Spinner.defaultTemplate = template.spinner;
+};
+
+Spinner.preset = function(name, callback) {
+    if (Spinner.prototype[name] || Spinner[name]) {
+        DebugManager.warn(`Warning: the ${name} method already exists in Spinner.`);
+        return;
+    }
+    Spinner[name] = (props) => callback(new Spinner(props));
+};
+
+Spinner.presets = function(presets) {
+    for (const name in presets) {
+        Spinner.preset(name, presets[name]);
+    }
+};
 
 Spinner.prototype.type = function(type) {
     this.$description.type = type;
@@ -144,17 +162,14 @@ Spinner.prototype.fast = function() {
     return this.speed('fast');
 };
 Spinner.prototype.loading = function(isLoading) {
-    this.$description.loading = isLoading;
+    this.$description.loading = BaseComponent.obs(isLoading);
     return this;
 };
+Spinner.prototype.bind = Spinner.prototype.loading;
 
-Spinner.prototype.show = function() {};
-Spinner.prototype.hide = function() {};
-
-Spinner.prototype.render = function(renderFn) {
-    this.$description.render = renderFn;
-    return this;
+Spinner.prototype.show = function() {
+    this.$description.loading?.set(true);
 };
-
-Spinner.prototype.$build = function() {};
-Spinner.prototype.toNdElement = function() {};
+Spinner.prototype.hide = function() {
+    this.$description.loading?.set(false);
+};