native-document 1.0.69 → 1.0.72

package/src/components/fom-control/field/FieldFactory.js

@@ -0,0 +1,107 @@
+import StringField from "./types/StringField";
+import EmailField from "./types/EmailField";
+import PasswordField from "./types/PasswordField";
+import NumberField from "./types/NumberField";
+import TextAreaField from "./types/TextAreaField";
+import CheckboxField from "./types/CheckboxField";
+import RadioField from "./types/RadioField";
+import SelectField from "./types/SelectField";
+import HiddenField from "./types/HiddenField";
+import FileField from "./types/FileField";
+import DateField from "./types/DateField";
+import TimeField from "./types/TimeField";
+import TelField from "./types/TelField";
+import UrlField from "./types/UrlField";
+import ColorField from "./types/ColorField";
+import RangeField from "./types/RangeField";
+import ImageField from "./types/ImageField";
+import CheckboxGroupField from "./types/CheckboxGroupField";
+import AutocompleteField from "./types/AutocompleteField";
+
+import Field from "./Field";
+import FieldCollection from "./FieldCollection";
+
+
+Field.string = function(name, defaultConfig) {
+    return new StringField(name, 'text', defaultConfig);
+};
+
+Field.text = function(name, defaultConfig) {
+    return new StringField(name, 'text', defaultConfig);
+};
+
+Field.email = function(name, defaultConfig) {
+    return new EmailField(name, defaultConfig);
+};
+
+Field.password = function(name, defaultConfig) {
+    return new PasswordField(name, defaultConfig);
+};
+
+Field.number = function(name, defaultConfig) {
+    return new NumberField(name, 'number', defaultConfig);
+};
+
+Field.textarea = function(name, defaultConfig) {
+    return new TextAreaField(name, defaultConfig);
+};
+
+Field.checkbox = function(name, defaultConfig) {
+    return new CheckboxField(name, defaultConfig);
+};
+
+Field.radio = function(name, options, defaultConfig) {
+    return new RadioField(name, options, defaultConfig);
+};
+
+Field.select = function(name, options, defaultConfig) {
+    return new SelectField(name, options, defaultConfig);
+};
+
+Field.hidden = function(name, defaultConfig) {
+    return new HiddenField(name, defaultConfig);
+};
+
+Field.file = function(name, defaultConfig) {
+    return new FileField(name, 'file', defaultConfig);
+};
+
+Field.date = function(name, defaultConfig) {
+    return new DateField(name, defaultConfig);
+};
+
+Field.time = function(name, defaultConfig) {
+    return new TimeField(name, defaultConfig);
+};
+
+Field.tel = function(name, defaultConfig) {
+    return new TelField(name, defaultConfig);
+};
+
+Field.url = function(name, defaultConfig) {
+    return new UrlField(name, defaultConfig);
+};
+
+Field.color = function(name, defaultConfig) {
+    return new ColorField(name, defaultConfig);
+};
+
+Field.range = function(name, defaultConfig) {
+    return new RangeField(name, defaultConfig);
+};
+
+Field.image = function(name, defaultConfig) {
+    return new ImageField(name, defaultConfig);
+};
+
+Field.checkboxGroup = function(name, options, defaultConfig) {
+    return new CheckboxGroupField(name, options, defaultConfig);
+};
+
+Field.autocomplete = function(name, defaultConfig) {
+    return new AutocompleteField(name, defaultConfig);
+};
+
+Field.collection = function(name, defaultConfig) {
+    return new FieldCollection(name, defaultConfig);
+};

package/src/components/fom-control/field/types/AutocompleteField.js

@@ -0,0 +1,46 @@
+import StringField from "./StringField";
+
+export default function AutocompleteField(name, defaultConfig) {
+    StringField.call(this, name, 'autocomplete', defaultConfig);
+
+    Object.assign(this.$description, {
+        source: null,
+        minChars: 2,
+        debounce: 300,
+        maxResults: 10
+    });
+}
+
+AutocompleteField.prototype = Object.create(StringField.prototype);
+AutocompleteField.prototype.constructor = AutocompleteField;
+
+AutocompleteField.prototype.source = function(dataSource) {
+    this.$description.source = dataSource;
+    return this;
+};
+
+AutocompleteField.prototype.minChars = function(min) {
+    this.$description.minChars = min;
+    return this;
+};
+
+AutocompleteField.prototype.debounce = function(ms) {
+    this.$description.debounce = ms;
+    return this;
+};
+
+AutocompleteField.prototype.maxResults = function(max) {
+    this.$description.maxResults = max;
+    return this;
+};
+
+AutocompleteField.prototype.oneOf = function(allowedValues, message) {
+    this.$description.rules.push({
+        validate: (value) => {
+            if (!value) return true;
+            return allowedValues.includes(value);
+        },
+        message: message || `Must be one of: ${allowedValues.join(', ')}`
+    });
+    return this;
+};

package/src/components/fom-control/field/types/CheckboxField.js

@@ -0,0 +1,17 @@
+import Field from "../Field";
+
+export default function CheckboxField(name, defaultConfig) {
+    Field.call(this, name, 'checkbox', defaultConfig);
+
+    Object.assign(this.$description, {
+        checked: false,
+    });
+}
+
+CheckboxField.prototype = Object.create(Field.prototype);
+CheckboxField.prototype.constructor = CheckboxField;
+
+CheckboxField.prototype.checked = function(value) {
+    this.$description.checked = value;
+    return this;
+};

package/src/components/fom-control/field/types/CheckboxGroupField.js

@@ -0,0 +1,78 @@
+import Field from "../Field";
+
+export default function CheckboxGroupField(name, options, defaultConfig) {
+    Field.call(this, name, 'checkbox-group', defaultConfig);
+
+    Object.assign(this.$description, {
+        options: options || [],
+        layout: 'vertical',
+        defaultValue: []
+    });
+}
+
+CheckboxGroupField.prototype = Object.create(Field.prototype);
+CheckboxGroupField.prototype.constructor = CheckboxGroupField;
+
+CheckboxGroupField.prototype.options = function(opts) {
+    this.$description.options = opts;
+    return this;
+};
+
+CheckboxGroupField.prototype.layout = function(value) {
+    const allowedLayouts = ['vertical', 'horizontal', 'grid'];
+
+    if (!allowedLayouts.includes(value)) {
+        throw new Error(`Invalid layout "${value}". Must be one of: ${allowedLayouts.join(', ')}`);
+    }
+
+    this.$description.layout = value;
+    return this;
+};
+
+CheckboxGroupField.prototype.horizontal = function() {
+    this.$description.layout = 'horizontal';
+    return this;
+};
+
+CheckboxGroupField.prototype.vertical = function() {
+    this.$description.layout = 'vertical';
+    return this;
+};
+
+CheckboxGroupField.prototype.grid = function() {
+    this.$description.layout = 'grid';
+    return this;
+};
+
+CheckboxGroupField.prototype.minChecked = function(min, message) {
+    this.$description.rules.push({
+        validate: (values) => {
+            if (!Array.isArray(values)) return false;
+            return values.length >= min;
+        },
+        message: message || `At least ${min} option${min > 1 ? 's' : ''} must be selected`
+    });
+    return this;
+};
+
+CheckboxGroupField.prototype.maxChecked = function(max, message) {
+    this.$description.rules.push({
+        validate: (values) => {
+            if (!Array.isArray(values)) return false;
+            return values.length <= max;
+        },
+        message: message || `Maximum ${max} option${max > 1 ? 's' : ''} allowed`
+    });
+    return this;
+};
+
+CheckboxGroupField.prototype.exactChecked = function(count, message) {
+    this.$description.rules.push({
+        validate: (values) => {
+            if (!Array.isArray(values)) return false;
+            return values.length === count;
+        },
+        message: message || `Exactly ${count} option${count > 1 ? 's' : ''} must be selected`
+    });
+    return this;
+};

package/src/components/fom-control/field/types/ColorField.js

@@ -0,0 +1,39 @@
+// ColorField.js
+import Field from "../Field";
+import {Validation} from "../../validation/Validation";
+
+export default function ColorField(name, defaultConfig) {
+    Field.call(this, name, 'color', defaultConfig);
+
+    Object.assign(this.$description, {
+        format: 'hex',
+        presets: null
+    });
+}
+
+ColorField.prototype = Object.create(Field.prototype);
+ColorField.prototype.constructor = ColorField;
+
+ColorField.prototype.format = function(formatType) {
+    const allowedFormats = ['hex', 'rgb', 'hsl'];
+
+    if (!allowedFormats.includes(formatType)) {
+        throw new Error(`Invalid format "${formatType}". Must be one of: ${allowedFormats.join(', ')}`);
+    }
+
+    this.$description.format = formatType;
+    return this;
+};
+
+ColorField.prototype.presets = function(colors) {
+    this.$description.presets = colors;
+    return this;
+};
+
+ColorField.prototype.hex = function(message) {
+    return this.addRule(Validation.hexColor, [], message);
+};
+
+ColorField.prototype.rgb = function(message) {
+    return this.addRule(Validation.rgbColor, [], message);
+};

package/src/components/fom-control/field/types/DateField.js

@@ -0,0 +1,62 @@
+import Field from "../Field";
+import {Validation} from "../../validation/Validation";
+
+export default function DateField(name, defaultConfig) {
+    Field.call(this, name, 'date', defaultConfig);
+
+    Object.assign(this.$description, {
+        format: 'YYYY-MM-DD',
+        minDate: null,
+        maxDate: null,
+        disabledDates: [],
+        picker: true
+    });
+}
+
+DateField.prototype = Object.create(Field.prototype);
+DateField.prototype.constructor = DateField;
+
+DateField.prototype.format = function(formatString) {
+    this.$description.format = formatString;
+    return this;
+};
+
+DateField.prototype.minDate = function(date) {
+    this.$description.minDate = date;
+    return this;
+};
+
+DateField.prototype.maxDate = function(date) {
+    this.$description.maxDate = date;
+    return this;
+};
+
+DateField.prototype.disabledDates = function(dates) {
+    this.$description.disabledDates = dates;
+    return this;
+};
+
+DateField.prototype.picker = function(enabled = true) {
+    this.$description.picker = enabled;
+    return this;
+};
+
+DateField.prototype.min = function(date, message) {
+    return this.addRule(Validation.afterDate, [date], message);
+};
+
+DateField.prototype.max = function(date, message) {
+    return this.addRule(Validation.beforeDate, [date], message);
+};
+
+DateField.prototype.between = function(startDate, endDate, message) {
+    return this.addRule(Validation.betweenDates, [startDate, endDate], message);
+};
+
+DateField.prototype.after = function(date, message) {
+    return this.addRule(Validation.afterDate, [date], message);
+};
+
+DateField.prototype.before = function(date, message) {
+    return this.addRule(Validation.beforeDate, [date], message);
+};

package/src/components/fom-control/field/types/EmailField.js

@@ -0,0 +1,44 @@
+import Field from "../Field";
+import {Validation} from "../../validation/Validation";
+
+export default function EmailField(name, defaultConfig) {
+    Field.call(this, name, 'email', defaultConfig);
+
+    // Auto-apply email validation
+    this.addRule(Validation.email, []);
+}
+
+EmailField.prototype = Object.create(Field.prototype);
+EmailField.prototype.constructor = EmailField;
+
+EmailField.prototype.email = function(message) {
+    const existingRule = this.rules.find(r => r.fn === Validation.email);
+    if (existingRule && message) {
+        existingRule.message = message;
+    }
+    return this;
+};
+
+EmailField.prototype.allowedDomain = function(allowedDomains, message) {
+    this.$description.rules.push({
+        validate: (value) => {
+            if (!value) return true;
+            const domain = value.split('@')[1];
+            return allowedDomains.includes(domain);
+        },
+        message: message || `Allowed domains: ${allowedDomains.join(', ')}`
+    });
+    return this;
+};
+
+EmailField.prototype.notAllowedDomain = function(blockedDomains, message) {
+    this.$description.rules.push({
+        validate: (value) => {
+            if (!value) return true;
+            const domain = value.split('@')[1];
+            return !blockedDomains.includes(domain);
+        },
+        message: message || `Domain not allowed`
+    });
+    return this;
+};

package/src/components/fom-control/field/types/FileField.js

@@ -0,0 +1,66 @@
+import Field from "../Field";
+import {Validation} from "../../validation/Validation";
+
+export default function FileField(name, type = 'file', defaultConfig = {}) {
+    Field.call(this, name, type, defaultConfig);
+
+    Object.assign(this.$description, {
+        accept: null,
+        multiple: false,
+        preview: false,
+        dragDrop: false,
+        compress: false
+    });
+}
+
+FileField.prototype = Object.create(Field.prototype);
+FileField.prototype.constructor = FileField;
+
+FileField.prototype.accept = function(mimeTypes) {
+    this.$description.accept = Array.isArray(mimeTypes) ? mimeTypes.join(',') : mimeTypes;
+    return this;
+};
+
+FileField.prototype.multiple = function(enabled = true) {
+    this.$description.multiple = enabled;
+    return this;
+};
+
+FileField.prototype.preview = function(enabled = true) {
+    this.$description.preview = enabled;
+    return this;
+};
+
+FileField.prototype.dragDrop = function(enabled = true) {
+    this.$description.dragDrop = enabled;
+    return this;
+};
+
+FileField.prototype.compress = function(enabled = true) {
+    this.$description.compress = enabled;
+    return this;
+};
+
+FileField.prototype.maxSize = function(bytes, message) {
+    return this.addRule(Validation.maxFileSize, [bytes], message);
+};
+
+FileField.prototype.minSize = function(bytes, message) {
+    return this.addRule(Validation.minFileSize, [bytes], message);
+};
+
+FileField.prototype.mimeTypes = function(types, message) {
+    return this.addRule(Validation.mimeTypes, [types], message);
+};
+
+FileField.prototype.extensions = function(extensions, message) {
+    return this.addRule(Validation.extensions, [extensions], message);
+};
+
+FileField.prototype.maxFiles = function(max, message) {
+    return this.addRule(Validation.maxFiles, [max], message);
+};
+
+FileField.prototype.minFiles = function(min, message) {
+    return this.addRule(Validation.minFiles, [min], message);
+};

package/src/components/fom-control/field/types/HiddenField.js

@@ -0,0 +1,8 @@
+import Field from "../Field";
+
+export default function HiddenField(name, defaultConfig) {
+    Field.call(this, name, 'hidden', defaultConfig);
+}
+
+HiddenField.prototype = Object.create(Field.prototype);
+HiddenField.prototype.constructor = HiddenField;

package/src/components/fom-control/field/types/ImageField.js

@@ -0,0 +1,49 @@
+import FileField from "./FileField";
+import {Validation} from "../../validation/Validation";
+
+export default function ImageField(name, defaultConfig) {
+    FileField.call(this, name, 'image', defaultConfig);
+
+    Object.assign(this.$description, {
+        maxWidth: null,
+        maxHeight: null,
+        crop: false
+    });
+
+    // Auto-apply image mime types
+    this.accept(['image/jpeg', 'image/png', 'image/gif', 'image/webp']);
+}
+
+ImageField.prototype = Object.create(FileField.prototype);
+ImageField.prototype.constructor = ImageField;
+
+ImageField.prototype.maxWidth = function(width) {
+    this.$description.maxWidth = width;
+    return this;
+};
+
+ImageField.prototype.maxHeight = function(height) {
+    this.$description.maxHeight = height;
+    return this;
+};
+
+ImageField.prototype.crop = function(enabled = true) {
+    this.$description.crop = enabled;
+    return this;
+};
+
+ImageField.prototype.dimensions = function(width, height, message) {
+    return this.addRule(Validation.dimensions, [width, height], message);
+};
+
+ImageField.prototype.maxDimensions = function(width, height, message) {
+    return this.addRule(Validation.maxDimensions, [width, height], message);
+};
+
+ImageField.prototype.minDimensions = function(width, height, message) {
+    return this.addRule(Validation.minDimensions, [width, height], message);
+};
+
+ImageField.prototype.aspectRatio = function(ratio, message) {
+    return this.addRule(Validation.aspectRatio, [ratio], message);
+};

package/src/components/fom-control/field/types/NumberField.js

@@ -0,0 +1,74 @@
+import {Validation} from "../../validation/Validation";
+import Field from "../Field";
+
+export default function NumberField(name, type = 'number', defaultConfig = {}) {
+    Field.call(this, name, type, defaultConfig);
+
+    Object.assign(this.$description, {
+        ...this.$description,
+        step: null,
+        decimals: null,
+        prefix: null,
+        suffix: null,
+    });
+}
+
+NumberField.prototype = Object.create(Field.prototype);
+NumberField.prototype.constructor = NumberField;
+
+NumberField.prototype.min = function(min, message) {
+    return this.addRule(Validation.min, [min], message);
+};
+
+NumberField.prototype.max = function(max, message) {
+    return this.addRule(Validation.max, [max], message);
+};
+
+NumberField.prototype.between = function(min, max, message) {
+    return this.addRule(Validation.between, [min, max], message);
+};
+
+NumberField.prototype.integer = function(message) {
+    return this.addRule(Validation.integer, [], message);
+};
+
+NumberField.prototype.positive = function(message) {
+    return this.addRule(Validation.positive, [], message);
+};
+
+NumberField.prototype.unsigned = NumberField.prototype.positive;
+
+NumberField.prototype.negative = function(message) {
+    return this.addRule(Validation.negative, [], message);
+};
+
+NumberField.prototype.multipleOf = function(n, message) {
+    this.$description.rules.push({
+        validate: (value) => {
+            if (!value && value !== 0) return true;
+            return Number(value) % n === 0;
+        },
+        message: message || `Must be a multiple of ${n}`
+    });
+    return this;
+};
+
+NumberField.prototype.step = function(value) {
+    this.$description.step = value;
+    return this;
+};
+
+NumberField.prototype.decimals = function(value) {
+    this.$description.decimals = value;
+    return this;
+};
+
+NumberField.prototype.prefix = function(text) {
+    this.$description.prefix = text;
+    return this;
+};
+
+NumberField.prototype.suffix = function(text) {
+    this.$description.suffix = text;
+    return this;
+};

package/src/components/fom-control/field/types/PasswordField.js

@@ -0,0 +1,72 @@
+import {Validation} from "../../validation/Validation";
+import StringField from "./StringField";
+
+export default function PasswordField(name, defaultConfig) {
+    StringField.call(this, name, 'password', defaultConfig);
+    Object.assign(this.$description, {
+        visibilityToggle: false,
+        showStrengthMeter: false
+    });
+}
+
+PasswordField.prototype = Object.create(StringField.prototype);
+PasswordField.prototype.constructor = PasswordField;
+
+PasswordField.prototype.strong = function(message) {
+    const strongPattern = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d).{8,}$/;
+    return this.addRule(
+        Validation.pattern,
+        [strongPattern],
+        message || 'Password must contain uppercase, lowercase, and number'
+    );
+};
+
+PasswordField.prototype.containsNumber = function(message) {
+    return this.addRule(
+        Validation.pattern,
+        [/\d/],
+        message || 'Must contain at least one number'
+    );
+};
+
+PasswordField.prototype.containsUppercase = function(message) {
+    return this.addRule(
+        Validation.pattern,
+        [/[A-Z]/],
+        message || 'Must contain at least one uppercase letter'
+    );
+};
+
+PasswordField.prototype.containsLowercase = function(message) {
+    return this.addRule(
+        Validation.pattern,
+        [/[a-z]/],
+        message || 'Must contain at least one lowercase letter'
+    );
+};
+
+PasswordField.prototype.containsSpecialChar = function(message) {
+    return this.addRule(
+        Validation.pattern,
+        [/[!@#$%^&*(),.?":{}|<>]/],
+        message || 'Must contain at least one special character'
+    );
+};
+
+PasswordField.prototype.visibilityToggle = function(enabled = true) {
+    this.$description.visibilityToggle = enabled;
+    return this;
+};
+
+PasswordField.prototype.showStrengthMeter = function(enabled = true) {
+    this.$description.showStrengthMeter = enabled;
+    return this;
+};
+
+PasswordField.prototype.same = function(fieldName, message) {
+    return this.addRule(Validation.same, [fieldName], message || 'Passwords must match');
+};
+
+PasswordField.prototype.different = function(fieldName, message) {
+    return this.addRule(Validation.different, [fieldName], message);
+};