native-document 1.0.76 → 1.0.78

package/src/components/popover/PopoverFooter.js

@@ -0,0 +1,37 @@
+import BaseComponent from "../BaseComponent";
+
+export default function PopoverFooter(content, config = {}) {
+    if(!(this instanceof PopoverFooter)) {
+        return new PopoverFooter(content, config);
+    }
+
+    this.$description = {
+        content: content || null,
+        data: null,
+        render: null,
+        ...config
+    };
+}
+
+BaseComponent.extends(PopoverFooter);
+
+PopoverFooter.defaultTemplate = null;
+
+PopoverFooter.use = function(template) {
+    PopoverFooter.defaultTemplate = template.popoverFooter;
+};
+
+PopoverFooter.prototype.content = function(content) {
+    this.$description.content = content;
+    return this;
+};
+
+PopoverFooter.prototype.data = function(data) {
+    this.$description.data = data;
+    return this;
+};
+
+PopoverFooter.prototype.render = function(renderFn) {
+    this.$description.render = renderFn;
+    return this;
+};

package/src/components/popover/PopoverHeader.js

@@ -0,0 +1,43 @@
+import BaseComponent from "../BaseComponent";
+
+export default function PopoverHeader(content, config = {}) {
+    if(!(this instanceof PopoverHeader)) {
+        return new PopoverHeader(content, config);
+    }
+
+    this.$description = {
+        content: content || null,
+        showClose: false,
+        data: null,
+        render: null,
+        ...config
+    };
+}
+
+BaseComponent.extends(PopoverHeader);
+
+PopoverHeader.defaultTemplate = null;
+
+PopoverHeader.use = function(template) {
+    PopoverHeader.defaultTemplate = template.popoverHeader;
+};
+
+PopoverHeader.prototype.content = function(content) {
+    this.$description.content = content;
+    return this;
+};
+
+PopoverHeader.prototype.showClose = function(show = true) {
+    this.$description.showClose = show;
+    return this;
+};
+
+PopoverHeader.prototype.data = function(data) {
+    this.$description.data = data;
+    return this;
+};
+
+PopoverHeader.prototype.render = function(renderFn) {
+    this.$description.render = renderFn;
+    return this;
+};

package/src/components/popover/index.js

@@ -0,0 +1,10 @@
+import Popover from "./Popover";
+import PopoverHeader from "./PopoverHeader";
+import PopoverFooter from "./PopoverFooter";
+
+
+export {
+    Popover,
+    PopoverHeader,
+    PopoverFooter
+};

package/src/components/progress/Progress.js

@@ -0,0 +1,220 @@
+import BaseComponent from "../BaseComponent";
+import EventEmitter from "../../../src/core/utils/EventEmitter";
+import {Validator} from "../../../index";
+
+export default function Progress(config = {}) {
+    if (!(this instanceof Progress)) {
+        return new Progress(config);
+    }
+
+    this.$description = {
+        value: null,
+        type: null,
+        variant: null,
+        max: 100,
+        size: null,
+        height: null,
+        showValue: null,
+        showPercentage: null,
+        label: null,
+        format: null,
+        indeterminate: null,
+        striped: null,
+        animated: null,
+        render: null,
+        ...config
+    };
+}
+
+BaseComponent.extends(Progress, EventEmitter);
+
+Progress.defaultTemplate = null;
+
+Progress.use = function(template) {};
+
+Progress.prototype.model = function(observable) {
+    this.$description.value = observable;
+    return this;
+};
+
+Progress.prototype.setCurrentStep = function(step) {
+    this.$description.value?.set(step);
+    this.emit('change', step);
+};
+
+Progress.prototype.value = function() {
+    const value = this.$description.value;
+    if(Validator.isObservable(value)) {
+        return value.val();
+    }
+    return value;
+};
+
+Progress.prototype.setValue = function(newValue) {
+    const value = this.$description.value;
+    if(Validator.isObservable(value)) {
+        value.set(newValue);
+        return this;
+    }
+    this.$description.value = newValue;
+    return this;
+};
+
+Progress.prototype.max = function(max) {
+    this.$description.max = max;
+    return this;
+};
+
+Progress.prototype.type = function(type) {
+    this.$description.type = type;
+    return this;
+};
+
+Progress.prototype.bar = function() {
+    return this.type('bar');
+};
+
+Progress.prototype.circle = function() {
+    return this.type('circle');
+};
+
+Progress.prototype.line = function() {
+    return this.type('line');
+};
+
+// Variant
+Progress.prototype.variant = function(name) {
+    this.$description.variant = name;
+    return this;
+};
+
+Progress.prototype.primary = function() {
+    return this.variant('primary');
+};
+
+Progress.prototype.secondary = function() {
+    return this.variant('secondary');
+};
+
+Progress.prototype.success = function() {
+    return this.variant('success');
+};
+
+Progress.prototype.warning = function() {
+    return this.variant('warning');
+};
+
+Progress.prototype.danger = function() {
+    return this.variant('danger');
+};
+
+Progress.prototype.info = function() {
+    return this.variant('info');
+};
+
+
+Progress.prototype.size = function(size) {
+    this.$description.size = size;
+    return this;
+};
+
+Progress.prototype.small = function() {
+    return this.size('small');
+};
+
+Progress.prototype.medium = function() {
+    return this.size('medium');
+};
+
+Progress.prototype.large = function() {
+    return this.size('large');
+};
+
+Progress.prototype.height = function(height) {
+    this.$description.height = height;
+    return this;
+};
+
+
+Progress.prototype.showValue = function(enabled = true) {
+    this.$description.showValue = enabled;
+    return this;
+};
+
+Progress.prototype.label = function(text) {
+    this.$description.label = text;
+    return this;
+};
+
+Progress.prototype.format = function(formatFn) {
+    this.$description.format = formatFn;
+    return this;
+};
+
+Progress.prototype.indeterminate = function(enabled = true) {
+    this.$description.indeterminate = enabled;
+    return this;
+};
+
+Progress.prototype.striped = function(enabled = true) {
+    this.$description.striped = enabled;
+    return this;
+};
+
+Progress.prototype.animated = function(enabled = true) {
+    this.$description.animated = enabled;
+    return this;
+};
+
+
+Progress.prototype.start = function() {
+    // TODO: Implementation
+};
+
+Progress.prototype.complete = function() {
+    this.setCurrentStep(100);
+    this.emit('complete');
+};
+
+Progress.prototype.increment = function(step) {
+    const current = this.value() || 0;
+    this.setCurrentStep(Math.min(this.$description.max, current + step));
+    return this;
+};
+
+Progress.prototype.reset = function() {
+    this.setCurrentStep(0);
+    this.emit('reset');
+    return this;
+};
+
+// Events
+Progress.prototype.onChange = function(handler) {
+    this.on('change', handler);
+    return this;
+};
+
+Progress.prototype.onComplete = function(handler) {
+    this.on('complete', handler);
+    return this;
+};
+
+Progress.prototype.onReset = function(handler) {
+    this.on('reset', handler);
+    return this;
+};
+
+
+Progress.prototype.render = function(renderFn) {
+    this.$description.render = renderFn;
+    return this;
+};
+
+// Build & Render
+Progress.prototype.$build = function() {
+    // TODO: Implementation
+};
+
+Progress.prototype.toNdElement = function() {
+    return this.$build();
+};

package/src/components/progress/index.js

@@ -0,0 +1,6 @@
+import Progress from "./Progress";
+
+
+export {
+    Progress
+}

package/src/components/skeleton/Skeleton.js

@@ -0,0 +1,98 @@
+
+export default function Skeleton(type = 'rect', config = {}) {
+    if (!(this instanceof Skeleton)) {
+        return new Skeleton(config);
+    }
+    this.$description = {
+        type,
+        lines: null,
+        width: null,
+        height: null,
+        loading: null,
+        repeat: null,
+        ...config
+    };
+}
+
+Skeleton.defaultTemplate = null;
+
+Skeleton.use = function(template) {};
+
+Skeleton.prototype.type = function(type) {
+    this.$description.type = type;
+    return this;
+};
+Skeleton.prototype.text = function(lines = 1) {
+    this.$description.lines = lines;
+    return this.type('text');
+};
+Skeleton.prototype.circle = function() {
+    return this.type('circle');
+};
+Skeleton.prototype.rect = function() {
+    return this.type('rect');
+};
+Skeleton.prototype.avatar = function() {
+    return this.type('avatar');
+};
+Skeleton.prototype.image = function() {
+    return this.type('image');
+};
+
+Skeleton.prototype.width = function(width) {
+    this.$description.width = width;
+    return this;
+};
+Skeleton.prototype.height = function(height) {
+    this.$description.height = height;
+    return this;
+};
+Skeleton.prototype.size = function(width, height) {
+    this.width(width);
+    this.height(height);
+    return this;
+};
+
+Skeleton.prototype.variant = function(name) {
+    this.$description.variant = name;
+    return this;
+};
+Skeleton.prototype.wave = function() {
+    return this.variant('wave');
+};
+Skeleton.prototype.pulse = function() {
+    return this.variant('pulse');
+};
+Skeleton.prototype.rounded = function() {};
+
+Skeleton.prototype.loading = function(isLoading) {
+    this.$description.loading = isLoading;
+    return this;
+};
+Skeleton.prototype.show = function() {};
+Skeleton.prototype.hide = function() {};
+
+Skeleton.prototype.repeat = function(times) {
+    this.$description.repeat = times;
+    return this;
+};
+
+
+Skeleton.prototype.render = function(renderFn) {
+    this.$description.render = renderFn;
+    return this;
+};
+
+
+Skeleton.prototype.$build = function() {
+
+};
+Skeleton.prototype.toNdElement = function() {
+    return this.$build();
+};
+
+// Presets
+Skeleton.card = function() {}; // Preset pour card
+Skeleton.list = function(items = 3) {}; // Preset pour liste
+Skeleton.table = function(rows = 5, cols = 4) {}; // Preset pour tableau
+Skeleton.paragraph = function(lines = 3) {}; // Preset pour paragraphe

package/src/components/skeleton/index.js

@@ -0,0 +1,6 @@
+import Skeleton from './Skeleton'
+
+
+export {
+    Skeleton
+}

package/src/components/slider/Slider.js

@@ -0,0 +1,183 @@
+import BaseComponent from "../BaseComponent";
+import EventEmitter from "../../../src/core/utils/EventEmitter";
+
+export default function Slider(config = {}) {
+    if (!(this instanceof Slider)) {
+        return new Slider(config);
+    }
+
+    this.$description = {
+        value: null,
+        defaultValue: null,
+        range: null,
+        min: null,
+        max: null,
+        step: null,
+        showValue: null,
+        showTooltip: null,
+        tooltipFormat: null,
+        marks: null,
+        showMarks: null,
+        variant: null,
+        color: null,
+        trackColor: null,
+        vertical: null,
+        height: null,
+        disabled: null,
+        readonly: null,
+        reverse: null,
+        snapToMarks: null,
+        render: null,
+        renderCursor: null,
+        ...config
+    };
+}
+
+BaseComponent.extends(Slider, EventEmitter);
+
+Slider.use = function(template) {};
+Slider.defaultTemplate = null;
+
+
+Slider.prototype.value = function(value) {
+    this.$description.value = value;
+    return this;
+};
+
+Slider.prototype.value = function() {
+    return this.$description.value?.val();
+};
+
+Slider.prototype.setCurrentStep = function(value) {
+    this.$description.value?.set(value);
+    this.emit('change', value);
+    return this;
+};
+
+Slider.prototype.range = function(min, max) {
+    this.$description.range = {min, max};
+    return this;
+};
+
+Slider.prototype.min = function(min) {
+    this.$description.min = min;
+    return this;
+};
+
+Slider.prototype.max = function(max) {
+    this.$description.max = max;
+    return this;
+};
+
+Slider.prototype.step = function(step) {
+    this.$description.step = step;
+    return this;
+};
+
+Slider.prototype.showValue = function(enabled = true) {
+    this.$description.showValue = enabled;
+    return this;
+};
+
+Slider.prototype.showTooltip = function(enabled = true) {
+    this.$description.showTooltip = enabled;
+    return this;
+};
+
+Slider.prototype.tooltipFormat = function(formatFn) {
+    this.$description.tooltipFormat = formatFn;
+    return this;
+};
+
+Slider.prototype.marks = function(marks) {
+    this.$description.marks = marks;
+    return this;
+};
+
+Slider.prototype.showMarks = function(enabled = true) {
+    this.$description.showMarks = enabled;
+    return this;
+};
+
+Slider.prototype.variant = function(name) {
+    this.$description.variant = name;
+    return this;
+};
+
+Slider.prototype.primary = function() {
+    return this.variant('primary');
+};
+Slider.prototype.secondary = function() {
+    return this.variant('secondary');
+};
+Slider.prototype.success = function() {
+    return this.variant('success');
+};
+Slider.prototype.warning = function() {
+    return this.variant('warning');
+};
+Slider.prototype.danger = function() {
+    return this.variant('danger');
+};
+Slider.prototype.info = function() {
+    return this.variant('info');
+};
+
+Slider.prototype.vertical = function(enabled = true) {
+    this.$description.vertical = enabled;
+    return this;
+};
+
+Slider.prototype.height = function(height) {
+    this.$description.height = height;
+    return this;
+};
+
+Slider.prototype.disabled = function(condition = true) {
+    this.$description.disabled = condition;
+    return this;
+};
+
+Slider.prototype.readonly = function(condition = true) {
+    this.$description.readonly = condition;
+    return this;
+};
+
+Slider.prototype.reverse = function(enabled = true) {
+    this.$description.reverse = enabled;
+    return this;
+};
+
+Slider.prototype.snapToMarks = function(enabled = true) {
+    this.$description.snapToMarks = enabled;
+    return this;
+};
+
+Slider.prototype.onChange = function(handler) {
+    this.on('change', handler);
+    return this;
+};
+
+Slider.prototype.onComplete = function(handler) {
+    this.on('complete', handler);
+    return this;
+};
+
+
+Slider.prototype.renderCursor = function(renderFn) {
+    this.$description.renderCursor = renderFn;
+    return this;
+};
+
+Slider.prototype.render = function(renderFn) {
+    this.$description.render = renderFn;
+};
+
+
+Slider.prototype.$build = function() {
+    // TODO: Implementation
+};
+
+Slider.prototype.toNdElement = function() {
+    return this.$build();
+};

package/src/components/slider/index.js

@@ -0,0 +1,5 @@
+import Slider from "./Slider";
+
+export {
+    Slider
+};