alchemy-form 0.1.11 → 0.2.0

package/element/{alchemy_field.js → al_field.js}

@@ -1,5 +1,5 @@
 /**
- * The alchemy-field element
+ * The al-field element
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
@@ -16,15 +16,6 @@ const Field = Function.inherits('Alchemy.Element.Form.Base', 'Field');
  */
 Field.setTemplateFile('form/elements/alchemy_field');
 
-/**
- * The stylesheet to load for this element
- *
- * @author   Jelle De Loecker <jelle@develry.be>
- * @since    0.1.0
- * @version  0.1.0
- */
-Field.setStylesheetFile('form/alchemy_field');
-
 /**
  * Use a new Renderer scope for the contents
  *
@@ -70,6 +61,15 @@ Field.setAttribute('field-type');
  */
 Field.setAttribute('field-view');
 
+/**
+ * The wrapper view override
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.12
+ * @version  0.1.12
+ */
+Field.setAttribute('wrapper-view');
+
 /**
  * Is this a read only field?
  *
@@ -89,19 +89,19 @@ Field.setAttribute('readonly', {boolean: true});
 Field.setAssignedProperty('widget_settings');
 
 /**
- * Get the parent alchemy-form element
+ * Get the parent al-form element
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.4
+ * @version  0.2.0
  */
 Field.enforceProperty(function alchemy_form(new_value) {
 
 	if (new_value == null) {
-		new_value = this.queryUp('alchemy-form');
+		new_value = this.queryUp('al-form');
 
 		if (!new_value && this.field_context) {
-			new_value = this.field_context.queryUp('alchemy-form');
+			new_value = this.field_context.queryUp('al-form');
 		}
 
 		if (!new_value && this.alchemy_field_schema && this.alchemy_field_schema.alchemy_field) {
@@ -122,16 +122,16 @@ Field.enforceProperty(function alchemy_form(new_value) {
 Field.addElementGetter('error_area', '.error-area');
 
 /**
- * Get the optional alchemy-field-schema it belongs to
+ * Get the optional al-field-schema it belongs to
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.2.0
  */
 Field.enforceProperty(function alchemy_field_schema(new_value, old_value) {
 
 	if (!new_value) {
-		new_value = this.queryUp('alchemy-field-schema');
+		new_value = this.queryUp('al-field-schema');
 	}
 
 	return new_value;
@@ -180,7 +180,7 @@ Field.enforceProperty(function schema(new_value, old_value) {
 		}
 	}
 
-	// See if the alchemy-form element has an explicit schema instance
+	// See if the al-form element has an explicit schema instance
 	if (!new_value && this.alchemy_form) {
 		new_value = this.alchemy_form.schema;
 	}
@@ -260,22 +260,19 @@ Field.setProperty(function is_translatable() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.1.12
  */
 Field.setProperty(function field_title() {
 
-	let config = this.config,
-	    result;
-
-	if (config) {
-		result = config.title;
-	}
+	let result = this._title || this.widget_settings?.title || this.config?.title;
 
 	if (!result && this.field_name) {
 		result = this.field_name.titleize();
 	}
 
 	return result;
+}, function setTitle(value) {
+	this._title = value;
 });
 
 /**
@@ -283,16 +280,11 @@ Field.setProperty(function field_title() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.1.12
  */
 Field.setProperty(function field_description() {
 
-	let config = this.config,
-	    result;
-
-	if (config && config.options) {
-		result = config.options.description;
-	}
+	let result = this.widget_settings?.description || this.config?.description;
 
 	return result;
 });
@@ -393,11 +385,11 @@ Field.enforceProperty(function wrapper_file(new_value, old_value) {
 			return false;
 		}
 
-		let field_type = this.getFieldType(),
+		let wrapper_view = this.wrapper_view || this.getFieldType(),
 		     view_type = this.view_type;
 
-		if (field_type) {
-			return this.generateTemplatePath('wrappers', view_type, field_type);
+		if (wrapper_view) {
+			return this.generateTemplatePath('wrappers', view_type, wrapper_view);
 		}
 	}
 
@@ -534,7 +526,7 @@ Field.setProperty(function original_value() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.4
+ * @version  0.2.0
  */
 Field.setProperty(function value_element() {
 
@@ -542,11 +534,11 @@ Field.setProperty(function value_element() {
 
 	// Translations always get preference
 	if (this.is_translatable) {
-		input = this.querySelector('alchemy-field-translatable');
+		input = this.querySelector('al-field-translatable');
 	} else if (this.is_array) {
-		input = this.querySelector('alchemy-field-array');
+		input = this.querySelector('al-field-array');
 	} else if (this.contains_schema) {
-		input = this.querySelector('alchemy-field-schema');
+		input = this.querySelector('al-field-schema');
 	}
 
 	if (!input) {
@@ -584,6 +576,55 @@ Field.setProperty(function value() {
 	}
 });
 
+/**
+ * Apply options
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.12
+ * @version  0.1.12
+ *
+ * @param    {Object}   options
+ */
+Field.setMethod(function applyOptions(options) {
+
+	if (!options || typeof options != 'object') {
+		return;
+	}
+
+	if (options.purpose) {
+		this.purpose = options.purpose;
+	}
+
+	if (options.mode) {
+		this.mode = options.mode;
+	}
+
+	if (options.view) {
+		this.field_view = options.view;
+	}
+
+	if (options.wrapper) {
+		this.wrapper_view = options.wrapper;
+	}
+
+	if (options.readonly) {
+		this.readonly = true;
+	}
+
+	if (options.widget_settings) {
+		this.widget_settings = options.widget_settings;
+	}
+
+	if (options.data_src) {
+		this.data_src = options.data_src;
+	}
+
+	if (options.title) {
+		this.field_title = options.title;
+	}
+
+});
+
 /**
  * Get the field type
  *
@@ -729,7 +770,7 @@ Field.setMethod(function removeErrors() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.3
+ * @version  0.2.0
  */
 Field.setMethod(function retained() {
 
@@ -745,7 +786,7 @@ Field.setMethod(function retained() {
 		this.id = id;
 	}
 
-	let label = this.querySelector('.form-field-info alchemy-label');
+	let label = this.querySelector('.form-field-info al-label');
 
 	if (label && this.value_element) {
 		let v_id = this.id + '_fv';

package/element/{alchemy_field_array.js → al_field_array.js}

@@ -1,13 +1,11 @@
 /**
- * The alchemy-field-array element
+ * The al-field-array element
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
  * @version  0.1.0
  */
-var FieldArray = Function.inherits('Alchemy.Element.Form.FieldCustom', function FieldArray() {
-	FieldArray.super.call(this);
-});
+const FieldArray = Function.inherits('Alchemy.Element.Form.FieldCustom', 'FieldArray');
 
 /**
  * The template to use for the content of this element
@@ -18,25 +16,16 @@ var FieldArray = Function.inherits('Alchemy.Element.Form.FieldCustom', function
  */
 FieldArray.setTemplateFile('form/elements/alchemy_field_array');
 
-/**
- * The stylesheet to load for this element
- *
- * @author   Jelle De Loecker <jelle@develry.be>
- * @since    0.1.0
- * @version  0.1.0
- */
-FieldArray.setStylesheetFile('form/alchemy_field_array');
-
 /**
  * Get the live value
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.2.0
  */
 FieldArray.setProperty(function value() {
 
-	let entries = this.queryAllNotNested('alchemy-field-array-entry'),
+	let entries = this.queryAllNotNested('al-field-array-entry'),
 	    result = [],
 	    entry,
 	    i;
@@ -58,7 +47,7 @@ FieldArray.setProperty(function value() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.2.0
  */
 FieldArray.setMethod(function introduced() {
 
@@ -68,7 +57,7 @@ FieldArray.setMethod(function introduced() {
 
 		e.preventDefault();
 
-		let entry = e.target.queryUp('alchemy-field-array-entry');
+		let entry = e.target.queryUp('al-field-array-entry');
 
 		entry.remove();
 	});
@@ -89,7 +78,7 @@ FieldArray.setMethod(function introduced() {
 				throw new Error('Unable to add new entry for field "' + alchemy_field.field_title + '", no view files found');
 			}
 
-			let new_entry = that.createElement('alchemy-field-array-entry');
+			let new_entry = that.createElement('al-field-array-entry');
 
 			new_entry.alchemy_field_array = that;
 

package/element/{alchemy_field_array_entry.js → al_field_array_entry.js}

@@ -1,13 +1,11 @@
 /**
- * The alchemy-field-array-entry element
+ * The al-field-array-entry element
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
  * @version  0.1.0
  */
-var FieldArrayEntry = Function.inherits('Alchemy.Element.Form.FieldEntry', function FieldArrayEntry() {
-	FieldArrayEntry.super.call(this);
-});
+const FieldArrayEntry = Function.inherits('Alchemy.Element.Form.FieldEntry', 'FieldArrayEntry');
 
 /**
  * The template to use for the content of this element
@@ -19,16 +17,16 @@ var FieldArrayEntry = Function.inherits('Alchemy.Element.Form.FieldEntry', funct
 FieldArrayEntry.setTemplateFile('form/elements/alchemy_field_array_entry');
 
 /**
- * Get a reference to the alchemy-field-array parent
+ * Get a reference to the al-field-array parent
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.2.0
  */
 FieldArrayEntry.enforceProperty(function alchemy_field_array(new_value, old_value) {
 
 	if (!new_value) {
-		new_value = this.queryUp('alchemy-field-array');
+		new_value = this.queryUp('al-field-array');
 	}
 
 	return new_value;
@@ -39,7 +37,7 @@ FieldArrayEntry.enforceProperty(function alchemy_field_array(new_value, old_valu
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.3
- * @version  0.1.3
+ * @version  0.2.0
  */
 FieldArrayEntry.setProperty(function index() {
 
@@ -59,7 +57,7 @@ FieldArrayEntry.setProperty(function index() {
 		for (let i = 0; i < container.entries_element.children.length; i++) {
 			child = container.entries_element.children[i];
 
-			if (child.tagName == 'ALCHEMY-FIELD-ARRAY-ENTRY') {
+			if (child.tagName == 'AL-FIELD-ARRAY-ENTRY') {
 				counter++;
 			}
 

package/element/{alchemy_field_schema.js → al_field_schema.js}

@@ -1,13 +1,11 @@
 /**
- * The alchemy-field-schema element
+ * The al-field-schema element
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
  * @version  0.1.0
  */
-var FieldSchema = Function.inherits('Alchemy.Element.Form.FieldCustom', function FieldSchema() {
-	FieldSchema.super.call(this);
-});
+var FieldSchema = Function.inherits('Alchemy.Element.Form.FieldCustom', 'FieldSchema');
 
 /**
  * The template to use for the content of this element
@@ -23,7 +21,7 @@ FieldSchema.setTemplateFile('form/elements/alchemy_field_schema');
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.4
+ * @version  0.1.12
  */
 FieldSchema.setProperty(function schema() {
 
@@ -38,15 +36,29 @@ FieldSchema.setProperty(function schema() {
 				let values = other_field.config.options.values;
 
 				if (values) {
+					let value;
 
 					if (values instanceof Classes.Alchemy.Map.Backed) {
-						schema = values.get(other_field.value);
+						value = values.get(other_field.value);
 					} else {
-						schema = values[other_field.value];
+						value = values[other_field.value];
 					}
 
-					if (schema && schema.schema) {
-						schema = schema.schema;
+					if (value) {
+						if (value.schema) {
+							schema = value.schema;
+						} else if (value.value) {
+							// Enumified values can be wrapped on the server-side
+							value = value.value;
+
+							if (value.schema) {
+								schema = value.schema;
+							}
+						}
+					}
+
+					if (!schema) {
+						schema = value;
 					}
 				}
 			}
@@ -86,11 +98,11 @@ FieldSchema.setProperty(function sub_fields() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.2.0
  */
 FieldSchema.setProperty(function value() {
 
-	let entries = this.queryAllNotNested('alchemy-field'),
+	let entries = this.queryAllNotNested('al-field'),
 	    result = {},
 	    entry,
 	    i;

package/element/{alchemy_field_translatable.js → al_field_translatable.js}

@@ -1,13 +1,11 @@
 /**
- * The alchemy-field-translatable element
+ * The al-field-translatable element
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
  * @version  0.1.0
  */
-var FieldTranslatable = Function.inherits('Alchemy.Element.Form.FieldCustom', function FieldTranslatable() {
-	FieldTranslatable.super.call(this);
-});
+const FieldTranslatable = Function.inherits('Alchemy.Element.Form.FieldCustom', 'FieldTranslatable');
 
 /**
  * The template to use for the content of this element
@@ -18,25 +16,16 @@ var FieldTranslatable = Function.inherits('Alchemy.Element.Form.FieldCustom', fu
  */
 FieldTranslatable.setTemplateFile('form/elements/alchemy_field_translatable');
 
-/**
- * The stylesheet to load for this element
- *
- * @author   Jelle De Loecker <jelle@elevenways.be>
- * @since    0.1.0
- * @version  0.1.0
- */
-FieldTranslatable.setStylesheetFile('form/alchemy_field_translatable');
-
 /**
  * Get the live value
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.2.0
  */
 FieldTranslatable.setProperty(function value() {
 
-	let entries = this.queryAllNotNested('alchemy-field-translatable-entry'),
+	let entries = this.queryAllNotNested('al-field-translatable-entry'),
 	    result = {},
 	    entry,
 	    i;
@@ -58,12 +47,12 @@ FieldTranslatable.setProperty(function value() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.2.0
  */
 FieldTranslatable.setMethod(function showPrefix(prefix) {
 
 	let buttons = this.queryAllNotNested('.prefix-buttons button'),
-	    entries = this.queryAllNotNested('alchemy-field-translatable-entry'),
+	    entries = this.queryAllNotNested('al-field-translatable-entry'),
 	    element,
 	    i;
 

package/element/{alchemy_field_translatable_entry.js → al_field_translatable_entry.js}

@@ -1,13 +1,11 @@
 /**
- * The alchemy-field-translatable-entry element
+ * The al-field-translatable-entry element
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
  * @version  0.1.0
  */
-var FieldTranslatableEntry = Function.inherits('Alchemy.Element.Form.FieldEntry', function FieldTranslatableEntry() {
-	FieldTranslatableEntry.super.call(this);
-});
+const FieldTranslatableEntry = Function.inherits('Alchemy.Element.Form.FieldEntry', 'FieldTranslatableEntry');
 
 /**
  * The template to use for the content of this element

package/element/{alchemy_form.js → al_form.js}

@@ -1,20 +1,11 @@
 /**
- * The alchemy-form element
+ * The al-form element
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
  * @version  0.1.0
  */
-var Form = Function.inherits('Alchemy.Element.Form.Base', 'Form');
-
-/**
- * The stylesheet to load for this element
- *
- * @author   Jelle De Loecker <jelle@develry.be>
- * @since    0.1.0
- * @version  0.1.0
- */
-Form.setStylesheetFile('form/alchemy_form');
+const Form = Function.inherits('Alchemy.Element.Form.Base', 'Form');
 
 /**
  * The attribute to use for the route
@@ -97,11 +88,11 @@ Form.setProperty(function main_error_area() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.2
+ * @version  0.2.0
  */
 Form.setProperty(function value() {
 
-	let fields = this.queryAllNotNested('alchemy-field'),
+	let fields = this.queryAllNotNested('al-field'),
 	    result = {},
 	    field,
 	    key,
@@ -282,7 +273,7 @@ Form.setMethod(async function showViolations(err) {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.2.0
  *
  * @param    {String}   path
  *
@@ -304,9 +295,9 @@ Form.setMethod(function findFieldByPath(path) {
 		}
 
 		if (current.config && current.config.is_array) {
-			query = 'alchemy-field-array-entry:nth-child(' + (Number(piece) + 1) + ') .field > *';
+			query = 'al-field-array-entry:nth-child(' + (Number(piece) + 1) + ') .field > *';
 		} else {
-			query = 'alchemy-field[field-name="' + piece + '"]';
+			query = 'al-field[field-name="' + piece + '"]';
 		}
 
 		current = current.queryAllNotNested(query)[0];

package/element/{alchemy_label.js → al_label.js}

@@ -1,5 +1,5 @@
 /**
- * The alchemy-label custom element
+ * The al-label custom element
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
@@ -7,15 +7,6 @@
  */
 const AlchemyLabel = Function.inherits('Alchemy.Element.Form.Base', 'Label');
 
-/**
- * The stylesheet to load for this element
- *
- * @author   Jelle De Loecker <jelle@develry.be>
- * @since    0.1.0
- * @version  0.1.0
- */
-AlchemyLabel.setStylesheetFile('form/alchemy_form');
-
 /**
  * The linked element
  *

package/element/{number_input.js → al_number_input.js}

@@ -1,11 +1,11 @@
 /**
- * The alchemy-number-input custom element
+ * The al-number-input custom element
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.3
  * @version  0.1.3
  */
- var NumberInput = Function.inherits('Alchemy.Element.Form.FeedbackInput', 'NumberInput');
+const NumberInput = Function.inherits('Alchemy.Element.Form.FeedbackInput', 'NumberInput');
 
 /**
  * The hawkejs template to use