- Deprecate "needed" attribute in favour of standard "required"

- Fix some required CSS

api/js/etemplate/Et2InputWidget/Et2InputWidget.ts

@@ -1,6 +1,6 @@
 import {et2_IInput, et2_IInputNode, et2_ISubmitListener} from "../et2_core_interfaces";
 import {Et2Widget} from "../Et2Widget/Et2Widget";
-import {dedupeMixin, PropertyValues} from "@lion/core";
+import {css, dedupeMixin, PropertyValues} from "@lion/core";
 import {ManualMessage} from "../Validators/ManualMessage";
 import {Required} from "../Validators/Required";
 
@@ -47,7 +47,12 @@ const Et2InputWidgetMixin = (superclass) =>
 		static get styles()
 		{
 			return [
-				...super.styles
+				super.styles,
+				css`
+				/* Needed so required can show through */
+				::slotted(input), input {
+					background-color: transparent;
+				}`
 			];
 		}
 
@@ -67,11 +72,10 @@ const Et2InputWidgetMixin = (superclass) =>
 					type: Boolean
 				},
 
-				needed: {
+				required: {
 					type: Boolean,
 					reflect: true
 				},
-
 				onchange: {
 					type: Function
 				},
@@ -100,14 +104,13 @@ const Et2InputWidgetMixin = (superclass) =>
 			super.updated(changedProperties);
 
 			// Needed changed, add / remove validator
-			if(changedProperties.has('needed'))
+			if(changedProperties.has('required'))
 			{
 				// Remove class
 				this.classList.remove("et2_required")
 				// Remove all existing Required validators (avoids duplicates)
 				this.validators = (this.validators || []).filter((validator) => validator instanceof Required)
-				this.setAttribute("required", this.needed);
-				if(this.needed)
+				if(this.required)
 				{
 					this.validators.push(new Required());
 					this.classList.add("et2_required");
@@ -231,6 +234,7 @@ const Et2InputWidgetMixin = (superclass) =>
 		transformAttributes(attrs)
 		{
 			super.transformAttributes(attrs);
+
 			// Check whether an validation error entry exists
 			if(this.id && this.getArrayMgr("validation_errors"))
 			{

api/js/etemplate/Et2Textbox/Et2Textbox.ts

@@ -19,7 +19,7 @@ export class Et2Textbox extends Et2InputWidget(LionInput)
 	static get styles()
 	{
 		return [
-			...super.styles,
+			super.styles,
 			css`
 			:host([type="hidden"]) {
 				display: none;

api/js/etemplate/Et2Widget/Et2Widget.ts

@@ -1180,8 +1180,15 @@ function transformAttributes(widget, mgr : et2_arrayMgr, attributes)
 		// If there is not attribute set, ignore it.  Widget sets its own default.
 		if(typeof attrValue === "undefined")
 		{
-			return;
+			continue;
 		}
+
+		// "needed" is deprecated, use "required"
+		if(attribute == "needed")
+		{
+			attribute = "required";
+		}
+
 		const property = widget_class.getPropertyOptions(attribute);
 
 		switch(typeof property === "object" ? property.type : property)

api/js/etemplate/etemplate2.ts

@@ -930,9 +930,9 @@ export class etemplate2
 			}
 			else if(submit instanceof Promise)
 			{
-				invalid.push(submit.then(function(sub)
+				invalid.push(submit.then(function(ok)
 				{
-					return sub ? false : this;
+					return ok ? false : this;
 				}.bind(_widget)));
 			}
 		}, this, et2_ISubmitListener);