@omegagrid/form 0.10.24 → 0.10.25

package/dist/types.d.ts

@@ -2,6 +2,7 @@ import { ComponentAdapter, CommonOptions, ColorTypes, AlertType, VerticalPositio
 import { TreeAdapter } from "@omegagrid/tree";
 export declare enum FormControlType {
     TextInput = "text",
+    PasswordInput = "password",
     Button = "button",
     NumericInput = "number",
     DateInput = "date",

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,UAAU,EAAE,SAAS,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AACrH,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAE9C,oBAAY,eAAe;IAC1B,SAAS,SAAS;IAClB,aAAa,aAAa;IAC1B,MAAM,WAAW;IACjB,YAAY,WAAW;IACvB,SAAS,SAAS;IAClB,iBAAiB,aAAa;IAC9B,QAAQ,aAAa;IACrB,KAAK,UAAU;IACf,IAAI,SAAS;IACb,UAAU,UAAU;IACpB,SAAS,SAAS;CAClB;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC9B,KAAK,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IACnC,iCAAiC;IACjC,GAAG,EAAE,MAAM,CAAC;IACZ,oCAAoC;IACpC,GAAG,EAAE,MAAM,CAAC;IACZ,8BAA8B;IAC9B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,gCAAgC;IAChC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,wBAAwB;IACxB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uBAAuB;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0DAA0D;IAC1D,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,gCAAgC;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,cAAc;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,qBAAqB,KAAK,gBAAgB,GAAC,OAAO,GAAC,OAAO,CAAC,gBAAgB,GAAC,OAAO,CAAC,CAAC;CACxH,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,SAAS,CAAA;CACf,CAAC;AAEF,MAAM,MAAM,OAAO,GAAG;IACrB,MAAM,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,MAAM,MAAM,UAAU,GAAG;IACxB,KAAK,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,aAAa,GAAG;IAC3B,IAAI,EAAE,OAAO,EAAE,CAAC;IAChB,OAAO,EAAE,UAAU,EAAE,CAAC;CACtB,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACzB,WAAW,CAAC,EAAE,WAAW,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG;IAClC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,eAAe,CAAC,EAAE,gBAAgB,CAAC;IACnC,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,OAAO,CAAC,EAAE,cAAc,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAA;CACxB,GAAG,aAAa,CAAC;AAElB,MAAM,MAAM,YAAY,GAAG;IAC1B,GAAG,CAAC,EAAE,MAAM,GAAC,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,QAAQ,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACnC,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IACvB,IAAI,CAAC,EAAE,OAAO,EAAE,CAAC;IACjB,OAAO,CAAC,EAAE,WAAW,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC9B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,QAAQ,GAAC,MAAM,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,UAAU,CAAA;CAClB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG,MAAM,GAAC,OAAO,GAAC,UAAU,GAAC,QAAQ,GAAC,OAAO,GAAC,gBAAgB,CAAC;AAEzF,MAAM,MAAM,UAAU,GAAG,cAAc,CAAC;AAExC,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC"}

package/dist/types.js

@@ -1,6 +1,7 @@
 export var FormControlType;
 (function (FormControlType) {
     FormControlType["TextInput"] = "text";
+    FormControlType["PasswordInput"] = "password";
     FormControlType["Button"] = "button";
     FormControlType["NumericInput"] = "number";
     FormControlType["DateInput"] = "date";

package/dist/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAGA,MAAM,CAAN,IAAY,eAWX;AAXD,WAAY,eAAe;IAC1B,qCAAkB,CAAA;IAClB,oCAAiB,CAAA;IACjB,0CAAuB,CAAA;IACvB,qCAAkB,CAAA;IAClB,iDAA8B,CAAA;IAC9B,wCAAqB,CAAA;IACrB,kCAAe,CAAA;IACf,gCAAa,CAAA;IACb,uCAAoB,CAAA;IACpB,qCAAkB,CAAA;AACnB,CAAC,EAXW,eAAe,KAAf,eAAe,QAW1B","sourcesContent":["import { ComponentAdapter, CommonOptions, ColorTypes, AlertType, VerticalPosition, IconSpec } from \"@omegagrid/core\";\nimport { TreeAdapter } from \"@omegagrid/tree\";\n\nexport enum FormControlType {\n\tTextInput = 'text',\n\tButton = 'button',\n\tNumericInput = 'number',\n\tDateInput = 'date',\n\tCalendarDateInput = 'calendar',\n\tCheckbox = 'checkbox',\n\tLabel = 'label',\n\tList = 'list',\n\tColorInput = 'color',\n\tFileInput = 'file',\n}\n\nexport type ValidationResult = {\n\tvalid: boolean;\n\tmessage?: string;\n};\n\nexport type FormControlProperties = {\n\t/** Row index within form grid */\n\trow: number,\n\t/** Column index within form grid */\n\tcol: number,\n\t/** Unique field identifier */\n\tkey?: string,\n\t/** Key of bound form control */\n\tfor?: string,\n\t/** Value validation pattern */\n\tpattern?: RegExp,\n\t/** Form control type */\n\ttype?: FormControlType,\n\t/** Required field */\n\trequired?: boolean,\n\t/** Readonly control */\n\treadOnly?: boolean,\n\t/** Current control value */\n\tvalue?: unknown,\n\t/** Key of parent element */\n\tdependsOn?: string,\n\t/** Component adapter where applicable (eg. TreeSelect) */\n\tadapter?: ComponentAdapter,\n\t/** Component item definition */\n\tcontent?: unknown,\n\t/** colspan */\n\tcs?: number,\n\t/** rowspan */\n\trs?: number,\n\t/** control-specific options */\n\toptions?: Record<string, unknown>,\n\tplaceholder?: string,\n\tcaption?: string,\n\n\t/** validation callback */\n\tvalidate?: (value: unknown, props: FormControlProperties) => ValidationResult|boolean|Promise<ValidationResult|boolean>,\n};\n\nexport type FormAlert = {\n\ttext: string,\n\ttype: AlertType\n};\n\nexport type FormRow = {\n\theight?: number\n}\n\nexport type FormColumn = {\n\twidth?: number\n}\n\nexport type FormGridModel = {\n\trows: FormRow[],\n\tcolumns: FormColumn[],\n}\n\nexport type FormOptions = {\n\ttreeAdapter?: TreeAdapter\n}\n\nexport type FormContainerOptions = {\n\tcaption?: string,\n\tbuttonsPosition?: VerticalPosition,\n\talertsPosition?: VerticalPosition,\n\tbuttons?: FormButtonType[],\n\tformOptions?: FormOptions,\n\tcloseAfterSave?: boolean\n} & CommonOptions;\n\nexport type FormSettings = {\n\tkey?: string|number,\n\tcaption?: string,\n\ttreeAdapter?: TreeAdapter,\n\tcontrols?: FormControlProperties[],\n\tcolumns?: FormColumn[],\n\trows?: FormRow[],\n\toptions?: FormOptions\n}\n\nexport type FormButtonConfig = {\n\tkey?: string,\n\ticon?: IconSpec|string,\n\ttext: string,\n\tdefault?: boolean,\n\tcolor?: ColorTypes\n}\n\nexport type FormButtonType = \"save\"|\"reset\"|\"validate\"|\"storno\"|\"close\"|FormButtonConfig;\n\nexport type FormAction = FormButtonType;\n\nexport type FormValues = Record<string, unknown>;"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAGA,MAAM,CAAN,IAAY,eAYX;AAZD,WAAY,eAAe;IAC1B,qCAAkB,CAAA;IAClB,6CAA0B,CAAA;IAC1B,oCAAiB,CAAA;IACjB,0CAAuB,CAAA;IACvB,qCAAkB,CAAA;IAClB,iDAA8B,CAAA;IAC9B,wCAAqB,CAAA;IACrB,kCAAe,CAAA;IACf,gCAAa,CAAA;IACb,uCAAoB,CAAA;IACpB,qCAAkB,CAAA;AACnB,CAAC,EAZW,eAAe,KAAf,eAAe,QAY1B","sourcesContent":["import { ComponentAdapter, CommonOptions, ColorTypes, AlertType, VerticalPosition, IconSpec } from \"@omegagrid/core\";\nimport { TreeAdapter } from \"@omegagrid/tree\";\n\nexport enum FormControlType {\n\tTextInput = 'text',\n\tPasswordInput = 'password',\n\tButton = 'button',\n\tNumericInput = 'number',\n\tDateInput = 'date',\n\tCalendarDateInput = 'calendar',\n\tCheckbox = 'checkbox',\n\tLabel = 'label',\n\tList = 'list',\n\tColorInput = 'color',\n\tFileInput = 'file',\n}\n\nexport type ValidationResult = {\n\tvalid: boolean;\n\tmessage?: string;\n};\n\nexport type FormControlProperties = {\n\t/** Row index within form grid */\n\trow: number,\n\t/** Column index within form grid */\n\tcol: number,\n\t/** Unique field identifier */\n\tkey?: string,\n\t/** Key of bound form control */\n\tfor?: string,\n\t/** Value validation pattern */\n\tpattern?: RegExp,\n\t/** Form control type */\n\ttype?: FormControlType,\n\t/** Required field */\n\trequired?: boolean,\n\t/** Readonly control */\n\treadOnly?: boolean,\n\t/** Current control value */\n\tvalue?: unknown,\n\t/** Key of parent element */\n\tdependsOn?: string,\n\t/** Component adapter where applicable (eg. TreeSelect) */\n\tadapter?: ComponentAdapter,\n\t/** Component item definition */\n\tcontent?: unknown,\n\t/** colspan */\n\tcs?: number,\n\t/** rowspan */\n\trs?: number,\n\t/** control-specific options */\n\toptions?: Record<string, unknown>,\n\tplaceholder?: string,\n\tcaption?: string,\n\n\t/** validation callback */\n\tvalidate?: (value: unknown, props: FormControlProperties) => ValidationResult|boolean|Promise<ValidationResult|boolean>,\n};\n\nexport type FormAlert = {\n\ttext: string,\n\ttype: AlertType\n};\n\nexport type FormRow = {\n\theight?: number\n}\n\nexport type FormColumn = {\n\twidth?: number\n}\n\nexport type FormGridModel = {\n\trows: FormRow[],\n\tcolumns: FormColumn[],\n}\n\nexport type FormOptions = {\n\ttreeAdapter?: TreeAdapter\n}\n\nexport type FormContainerOptions = {\n\tcaption?: string,\n\tbuttonsPosition?: VerticalPosition,\n\talertsPosition?: VerticalPosition,\n\tbuttons?: FormButtonType[],\n\tformOptions?: FormOptions,\n\tcloseAfterSave?: boolean\n} & CommonOptions;\n\nexport type FormSettings = {\n\tkey?: string|number,\n\tcaption?: string,\n\ttreeAdapter?: TreeAdapter,\n\tcontrols?: FormControlProperties[],\n\tcolumns?: FormColumn[],\n\trows?: FormRow[],\n\toptions?: FormOptions\n}\n\nexport type FormButtonConfig = {\n\tkey?: string,\n\ticon?: IconSpec|string,\n\ttext: string,\n\tdefault?: boolean,\n\tcolor?: ColorTypes\n}\n\nexport type FormButtonType = \"save\"|\"reset\"|\"validate\"|\"storno\"|\"close\"|FormButtonConfig;\n\nexport type FormAction = FormButtonType;\n\nexport type FormValues = Record<string, unknown>;"]}

package/dist/ui/controls/baseControl.d.ts

@@ -23,6 +23,7 @@ export declare abstract class BaseControl<TValue = unknown, TAdapter extends Com
     get value(): TValue;
     set value(value: TValue);
     required: boolean;
+    readOnly: boolean;
     protected updateValue(value: TValue, dispatchEvent?: boolean): Promise<void>;
     willUpdate(changedProps: Map<PropertyKey, unknown>): void;
     reset(dispatchEvent?: boolean): Promise<void>;

package/dist/ui/controls/baseControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"baseControl.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/baseControl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,UAAU,EAAE,MAAM,KAAK,CAAC;AAEtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAG1D,qBAAa,YAAY,CAAC,MAAM,CAAE,SAAQ,KAAK;aAG7B,KAAK,EAAE,gBAAgB;aACvB,KAAK,EAAE,MAAM;gBAF7B,IAAI,EAAE,MAAM,EACI,KAAK,EAAE,gBAAgB,EACvB,KAAK,EAAE,MAAM;CAI9B;AAED,MAAM,WAAW,QAAQ,CAAC,MAAM,GAAG,OAAO,EAAE,QAAQ,SAAS,gBAAgB,GAAG,IAAI,CAAE,SAAQ,WAAW;IACxG,KAAK,EAAE,gBAAgB,CAAC;IACxB,OAAO,EAAE,QAAQ,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,aAAa,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9C,QAAQ,IAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC3B,IAAI,OAAO,IAAK,OAAO,CAAC;CACxB;AAED,8BAAsB,WAAW,CAAC,MAAM,GAAG,OAAO,EAAE,QAAQ,SAAS,gBAAgB,GAAG,IAAI,CAC3F,SAAQ,UAAW,YAAW,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC;IAExD,MAAM,CAAC,MAAM,4BAcV;IAGH,KAAK,EAAE,gBAAgB,CAAC;IAGxB,SAAS,EAAE,SAAS,CAAC;IAGrB,OAAO,EAAE,QAAQ,CAAC;IAElB,OAAO,CAAC,MAAM,CAAgB;IAC9B,IACI,KAAK,IACQ,MAAM,CADY;IACnC,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAMtB;IAGD,QAAQ,UAAS;cAED,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,aAAa,UAAO;IAQ/D,UAAU,CAAC,YAAY,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC,GAAG,IAAI;IASnD,KAAK,CAAC,aAAa,UAAO;IAM1B,QAAQ;IAgBd,IAAI,OAAO,YAA2C;CAEtD"}
+{"version":3,"file":"baseControl.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/baseControl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,UAAU,EAAE,MAAM,KAAK,CAAC;AAEtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAG1D,qBAAa,YAAY,CAAC,MAAM,CAAE,SAAQ,KAAK;aAG7B,KAAK,EAAE,gBAAgB;aACvB,KAAK,EAAE,MAAM;gBAF7B,IAAI,EAAE,MAAM,EACI,KAAK,EAAE,gBAAgB,EACvB,KAAK,EAAE,MAAM;CAI9B;AAED,MAAM,WAAW,QAAQ,CAAC,MAAM,GAAG,OAAO,EAAE,QAAQ,SAAS,gBAAgB,GAAG,IAAI,CAAE,SAAQ,WAAW;IACxG,KAAK,EAAE,gBAAgB,CAAC;IACxB,OAAO,EAAE,QAAQ,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,aAAa,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9C,QAAQ,IAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC3B,IAAI,OAAO,IAAK,OAAO,CAAC;CACxB;AAED,8BAAsB,WAAW,CAAC,MAAM,GAAG,OAAO,EAAE,QAAQ,SAAS,gBAAgB,GAAG,IAAI,CAC3F,SAAQ,UAAW,YAAW,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC;IAExD,MAAM,CAAC,MAAM,4BAmBV;IAGH,KAAK,EAAE,gBAAgB,CAAC;IAGxB,SAAS,EAAE,SAAS,CAAC;IAGrB,OAAO,EAAE,QAAQ,CAAC;IAElB,OAAO,CAAC,MAAM,CAAgB;IAC9B,IACI,KAAK,IACQ,MAAM,CADY;IACnC,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAMtB;IAGD,QAAQ,UAAS;IAGjB,QAAQ,UAAS;cAED,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,aAAa,UAAO;IAQ/D,UAAU,CAAC,YAAY,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC,GAAG,IAAI;IAUnD,KAAK,CAAC,aAAa,UAAO;IAM1B,QAAQ;IAgBd,IAAI,OAAO,YAA2C;CAEtD"}

package/dist/ui/controls/baseControl.js

@@ -18,6 +18,7 @@ export class BaseControl extends LitElement {
         super(...arguments);
         this._value = null;
         this.required = false;
+        this.readOnly = false;
     }
     get value() { return this._value; }
     set value(value) {
@@ -40,6 +41,7 @@ export class BaseControl extends LitElement {
                 this.value = this.model.props.value;
             }
             this.required = this.model.props.required;
+            this.readOnly = !!this.model.props.readOnly;
         }
     }
     async reset(dispatchEvent = true) {
@@ -78,6 +80,11 @@ BaseControl.styles = [css `
 			border: 2px solid var(--og-accent-color);
 			border-radius: var(--og-base-radius);
 		}
+
+		:host([readOnly]) {
+			opacity: 0.7;
+			pointer-events: none;
+		}
 	`];
 __decorate([
     property({ type: Object })
@@ -94,4 +101,7 @@ __decorate([
 __decorate([
     property({ type: Boolean, reflect: true })
 ], BaseControl.prototype, "required", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], BaseControl.prototype, "readOnly", void 0);
 //# sourceMappingURL=baseControl.js.map

package/dist/ui/controls/baseControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"baseControl.js","sourceRoot":"","sources":["../../../src/ui/controls/baseControl.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, LitElement } from 'lit';\nimport { property } from \"lit/decorators.js\";\nimport { ComponentAdapter } from '@omegagrid/core';\nimport { FormControlModel, FormModel } from '../../model';\nimport { ValidationResult } from '../../types';\n\nexport class ControlEvent<TValue> extends Event {\n\tconstructor(\n\t\ttype: string,\n\t\tpublic readonly model: FormControlModel,\n\t\tpublic readonly value: TValue\n\t) {\n\t\tsuper(type, {bubbles: true, cancelable: true, composed: true});\n\t}\n}\n\nexport interface IControl<TValue = unknown, TAdapter extends ComponentAdapter = null> extends HTMLElement {\n\tmodel: FormControlModel;\n\tadapter: TAdapter;\n\tvalue: TValue;\n\treset(dispatchEvent?: boolean): Promise<void>;\n\tvalidate() : Promise<void>;\n\tget isValid() : boolean;\n}\n\nexport abstract class BaseControl<TValue = unknown, TAdapter extends ComponentAdapter = null> \n\textends LitElement implements IControl<TValue, TAdapter> {\n\n\tstatic styles = [css`\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t* {\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t:host([required]) {\n\t\t\tborder: 2px solid var(--og-accent-color);\n\t\t\tborder-radius: var(--og-base-radius);\n\t\t}\n\t`];\n\n\t@property({type: Object})\n\tmodel: FormControlModel;\n\n\t@property({type: Object})\n\tformModel: FormModel;\n\n\t@property({type: Object})\n\tadapter: TAdapter;\n\n\tprivate _value: TValue = null;\n\t@property({type: Object})\n\tget value() { return this._value; }\n\tset value(value: TValue) {\n\t\tconst oldValue = this._value;\n\t\tthis._value = value;\n\t\tif (oldValue !== value) {\n\t\t\tthis.requestUpdate('value', oldValue);\n\t\t}\n\t}\n\t\n\t@property({type: Boolean, reflect: true})\n\trequired = false;\n\n\tprotected async updateValue(value: TValue, dispatchEvent = true) {\n\t\tthis._value = value;\n\t\tawait this.validate();\n\t\tif (dispatchEvent) {\n\t\t\tthis.dispatchEvent(new ControlEvent<TValue>('change', this.model, value));\n\t\t}\n\t}\n\n\twillUpdate(changedProps: Map<PropertyKey, unknown>): void {\n\t\tif (changedProps.has('model')) {\n\t\t\tif (this.value === null) {\n\t\t\t\tthis.value = this.model.props.value as TValue;\n\t\t\t}\n\t\t\tthis.required = this.model.props.required;\n\t\t}\n\t}\n\n\tasync reset(dispatchEvent = true) {\n\t\tconst oldValue = this._value;\n\t\tawait this.updateValue(this.model.props.value as TValue, dispatchEvent);\n\t\tthis.requestUpdate('value', oldValue);\n\t}\n\n\tasync validate() {\n\t\tif (!this.model) return;\n\n\t\tthis.model.errors = [];\n\n\t\tif (this.required && (this.value == null || this.value === '')) {\n\t\t\tthis.model.errors = ['this field is required'];\n\t\t} else if (this.model.props?.validate) {\n\t\t\tconst result = await this.model.props.validate(this.value, this.model.props);\n\t\t\tconst validationResult = typeof result == 'boolean' ? {valid: result} as ValidationResult : result;\n\t\t\tif (!validationResult.valid) {\n\t\t\t\tthis.model.errors.push(validationResult.message || 'Invalid value');\n\t\t\t}\n\t\t}\n\t}\n\n\tget isValid() { return this.model.errors.length == 0 }\n\t\n}"]}
+{"version":3,"file":"baseControl.js","sourceRoot":"","sources":["../../../src/ui/controls/baseControl.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAK7C,MAAM,OAAO,YAAqB,SAAQ,KAAK;IAC9C,YACC,IAAY,EACI,KAAuB,EACvB,KAAa;QAE7B,KAAK,CAAC,IAAI,EAAE,EAAC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAC,CAAC,CAAC;QAH/C,UAAK,GAAL,KAAK,CAAkB;QACvB,UAAK,GAAL,KAAK,CAAQ;IAG9B,CAAC;CACD;AAWD,MAAM,OAAgB,WACrB,SAAQ,UAAU;IADnB;;QAiCS,WAAM,GAAW,IAAI,CAAC;QAY9B,aAAQ,GAAG,KAAK,CAAC;QAGjB,aAAQ,GAAG,KAAK,CAAC;IA4ClB,CAAC;IAzDA,IAAI,KAAK,KAAK,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;IACnC,IAAI,KAAK,CAAC,KAAa;QACtB,MAAM,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAC;QAC7B,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,QAAQ,KAAK,KAAK,EAAE,CAAC;YACxB,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;QACvC,CAAC;IACF,CAAC;IAQS,KAAK,CAAC,WAAW,CAAC,KAAa,EAAE,aAAa,GAAG,IAAI;QAC9D,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC;QACtB,IAAI,aAAa,EAAE,CAAC;YACnB,IAAI,CAAC,aAAa,CAAC,IAAI,YAAY,CAAS,QAAQ,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC;QAC3E,CAAC;IACF,CAAC;IAED,UAAU,CAAC,YAAuC;QACjD,IAAI,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;YAC/B,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI,EAAE,CAAC;gBACzB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAe,CAAC;YAC/C,CAAC;YACD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC;YAC1C,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC;QAC7C,CAAC;IACF,CAAC;IAED,KAAK,CAAC,KAAK,CAAC,aAAa,GAAG,IAAI;QAC/B,MAAM,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAC;QAC7B,MAAM,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAe,EAAE,aAAa,CAAC,CAAC;QACxE,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;IACvC,CAAC;IAED,KAAK,CAAC,QAAQ;QACb,IAAI,CAAC,IAAI,CAAC,KAAK;YAAE,OAAO;QAExB,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,EAAE,CAAC;QAEvB,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,IAAI,IAAI,CAAC,KAAK,KAAK,EAAE,CAAC,EAAE,CAAC;YAChE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,wBAAwB,CAAC,CAAC;QAChD,CAAC;aAAM,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,CAAC;YACvC,MAAM,MAAM,GAAG,MAAM,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YAC7E,MAAM,gBAAgB,GAAG,OAAO,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,EAAC,KAAK,EAAE,MAAM,EAAqB,CAAC,CAAC,CAAC,MAAM,CAAC;YACnG,IAAI,CAAC,gBAAgB,CAAC,KAAK,EAAE,CAAC;gBAC7B,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,IAAI,eAAe,CAAC,CAAC;YACrE,CAAC;QACF,CAAC;IACF,CAAC;IAED,IAAI,OAAO,KAAK,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,IAAI,CAAC,CAAA,CAAC,CAAC;;AAvF/C,kBAAM,GAAG,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;EAmBnB,CAAC,AAnBW,CAmBV;AAGH;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;0CACD;AAGxB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;8CACJ;AAGrB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;4CACP;AAIlB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;wCACU;AAUnC;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;6CACxB;AAGjB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;6CACxB","sourcesContent":["import { css, LitElement } from 'lit';\nimport { property } from \"lit/decorators.js\";\nimport { ComponentAdapter } from '@omegagrid/core';\nimport { FormControlModel, FormModel } from '../../model';\nimport { ValidationResult } from '../../types';\n\nexport class ControlEvent<TValue> extends Event {\n\tconstructor(\n\t\ttype: string,\n\t\tpublic readonly model: FormControlModel,\n\t\tpublic readonly value: TValue\n\t) {\n\t\tsuper(type, {bubbles: true, cancelable: true, composed: true});\n\t}\n}\n\nexport interface IControl<TValue = unknown, TAdapter extends ComponentAdapter = null> extends HTMLElement {\n\tmodel: FormControlModel;\n\tadapter: TAdapter;\n\tvalue: TValue;\n\treset(dispatchEvent?: boolean): Promise<void>;\n\tvalidate() : Promise<void>;\n\tget isValid() : boolean;\n}\n\nexport abstract class BaseControl<TValue = unknown, TAdapter extends ComponentAdapter = null> \n\textends LitElement implements IControl<TValue, TAdapter> {\n\n\tstatic styles = [css`\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t* {\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t:host([required]) {\n\t\t\tborder: 2px solid var(--og-accent-color);\n\t\t\tborder-radius: var(--og-base-radius);\n\t\t}\n\n\t\t:host([readOnly]) {\n\t\t\topacity: 0.7;\n\t\t\tpointer-events: none;\n\t\t}\n\t`];\n\n\t@property({type: Object})\n\tmodel: FormControlModel;\n\n\t@property({type: Object})\n\tformModel: FormModel;\n\n\t@property({type: Object})\n\tadapter: TAdapter;\n\n\tprivate _value: TValue = null;\n\t@property({type: Object})\n\tget value() { return this._value; }\n\tset value(value: TValue) {\n\t\tconst oldValue = this._value;\n\t\tthis._value = value;\n\t\tif (oldValue !== value) {\n\t\t\tthis.requestUpdate('value', oldValue);\n\t\t}\n\t}\n\t\n\t@property({type: Boolean, reflect: true})\n\trequired = false;\n\n\t@property({type: Boolean, reflect: true})\n\treadOnly = false;\n\n\tprotected async updateValue(value: TValue, dispatchEvent = true) {\n\t\tthis._value = value;\n\t\tawait this.validate();\n\t\tif (dispatchEvent) {\n\t\t\tthis.dispatchEvent(new ControlEvent<TValue>('change', this.model, value));\n\t\t}\n\t}\n\n\twillUpdate(changedProps: Map<PropertyKey, unknown>): void {\n\t\tif (changedProps.has('model')) {\n\t\t\tif (this.value === null) {\n\t\t\t\tthis.value = this.model.props.value as TValue;\n\t\t\t}\n\t\t\tthis.required = this.model.props.required;\n\t\t\tthis.readOnly = !!this.model.props.readOnly;\n\t\t}\n\t}\n\n\tasync reset(dispatchEvent = true) {\n\t\tconst oldValue = this._value;\n\t\tawait this.updateValue(this.model.props.value as TValue, dispatchEvent);\n\t\tthis.requestUpdate('value', oldValue);\n\t}\n\n\tasync validate() {\n\t\tif (!this.model) return;\n\n\t\tthis.model.errors = [];\n\n\t\tif (this.required && (this.value == null || this.value === '')) {\n\t\t\tthis.model.errors = ['this field is required'];\n\t\t} else if (this.model.props?.validate) {\n\t\t\tconst result = await this.model.props.validate(this.value, this.model.props);\n\t\t\tconst validationResult = typeof result == 'boolean' ? {valid: result} as ValidationResult : result;\n\t\t\tif (!validationResult.valid) {\n\t\t\t\tthis.model.errors.push(validationResult.message || 'Invalid value');\n\t\t\t}\n\t\t}\n\t}\n\n\tget isValid() { return this.model.errors.length == 0 }\n\t\n}"]}

package/dist/ui/controls/checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/checkbox.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,qBACa,YAAa,SAAQ,WAAW,CAAC,OAAO,CAAC;IAErD,MAAM,CAAC,MAAM,4BAUV;IAEH,IAAI,OAAO,YAAkB;;IAU7B,MAAM,6CAEJ;CAEF"}
+{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/checkbox.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,qBACa,YAAa,SAAQ,WAAW,CAAC,OAAO,CAAC;IAErD,MAAM,CAAC,MAAM,4BAUV;IAEH,IAAI,OAAO,YAAkB;;IAW7B,MAAM,6CAEJ;CAEF"}

package/dist/ui/controls/checkbox.js

@@ -15,6 +15,8 @@ let FormCheckbox = class FormCheckbox extends BaseControl {
 		<og-checkbox .value="${this.value ? 'checked' : 'none'}"></og-checkbox>
 	`;
         this.addEventListener('click', () => {
+            if (this.readOnly)
+                return;
             this.updateValue(!this.value);
             this.requestUpdate();
         });

package/dist/ui/controls/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../src/ui/controls/checkbox.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAGrC,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,WAAoB;IAcrD,IAAI,OAAO,KAAK,OAAO,IAAI,CAAA,CAAC,CAAC;IAE7B;QACC,KAAK,EAAE,CAAC;QAOT,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;yBACK,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM;EACtD,CAAC;QARD,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;YACnC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAC9B,IAAI,CAAC,aAAa,EAAE,CAAC;QACtB,CAAC,CAAC,CAAC;IACJ,CAAC;;AApBM,mBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;;;;;;EAU1C,CAAC,AAVW,CAUV;AAZS,YAAY;IADxB,aAAa,CAAC,kBAAkB,CAAC;GACrB,YAAY,CA4BxB","sourcesContent":["import { css, html } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\n\n@customElement('og-form-checkbox')\nexport class FormCheckbox extends BaseControl<boolean> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\talign-items: center;\n\t\t\theight: 100%;\n\t\t}\n\t\t\n\t\tog-checkbox {\n\t\t\tcursor: pointer;\n\t\t}\n\t`];\n\n\tget isValid() { return true }\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.addEventListener('click', () => {\n\t\t\tthis.updateValue(!this.value);\n\t\t\tthis.requestUpdate();\n\t\t});\n\t}\n\n\trender = () => html`\n\t\t<og-checkbox .value=\"${this.value ? 'checked' : 'none'}\"></og-checkbox>\n\t`;\n\t\n}"]}
+{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../src/ui/controls/checkbox.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAGrC,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,WAAoB;IAcrD,IAAI,OAAO,KAAK,OAAO,IAAI,CAAA,CAAC,CAAC;IAE7B;QACC,KAAK,EAAE,CAAC;QAQT,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;yBACK,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM;EACtD,CAAC;QATD,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;YACnC,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAC1B,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAC9B,IAAI,CAAC,aAAa,EAAE,CAAC;QACtB,CAAC,CAAC,CAAC;IACJ,CAAC;;AArBM,mBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;;;;;;EAU1C,CAAC,AAVW,CAUV;AAZS,YAAY;IADxB,aAAa,CAAC,kBAAkB,CAAC;GACrB,YAAY,CA6BxB","sourcesContent":["import { css, html } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\n\n@customElement('og-form-checkbox')\nexport class FormCheckbox extends BaseControl<boolean> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\talign-items: center;\n\t\t\theight: 100%;\n\t\t}\n\t\t\n\t\tog-checkbox {\n\t\t\tcursor: pointer;\n\t\t}\n\t`];\n\n\tget isValid() { return true }\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.addEventListener('click', () => {\n\t\t\tif (this.readOnly) return;\n\t\t\tthis.updateValue(!this.value);\n\t\t\tthis.requestUpdate();\n\t\t});\n\t}\n\n\trender = () => html`\n\t\t<og-checkbox .value=\"${this.value ? 'checked' : 'none'}\"></og-checkbox>\n\t`;\n\t\n}"]}

package/dist/ui/controls/colorInput.js

@@ -18,7 +18,7 @@ let FormColorInput = class FormColorInput extends BaseControl {
             this.requestUpdate();
         };
         this.render = () => html `
-		<og-dropdown style="${styleMap({ backgroundColor: this.value ? `#${this.value}` : null })}">
+		<og-dropdown ?disabled="${this.readOnly}" style="${styleMap({ backgroundColor: this.value ? `#${this.value}` : null })}">
 			<div
 				slot="label" 
 				style="${styleMap({

package/dist/ui/controls/colorInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"colorInput.js","sourceRoot":"","sources":["../../../src/ui/controls/colorInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAoB,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAGnD,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,WAAmB;IAAhD;;QAON,cAAS,GAAG,CAAC,CAA6B,EAAE,EAAE;YAC7C,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;YACtB,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC;YACpE,IAAI,CAAC,aAAa,EAAE,CAAC;QACtB,CAAC,CAAA;QAED,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;wBACI,QAAQ,CAAC,EAAC,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,EAAC,CAAC;;;aAG5E,QAAQ,CAAC;YACjB,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,aAAa;YAC9D,OAAO,EAAE,KAAK;SACd,CAAC;;;;;cAKQ,IAAI,CAAC,KAAK;eACT,IAAI,CAAC,SAAS;kBACX,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE;;;EAGtD,CAAC;IAEH,CAAC;;AA9BO,qBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,CAAC,AAA1B,CAA2B;AAGxC;IADC,KAAK,CAAC,aAAa,CAAC;gDACF;AALP,cAAc;IAD1B,aAAa,CAAC,oBAAoB,CAAC;GACvB,cAAc,CAgC1B","sourcesContent":["import { html } from \"lit\";\nimport { customElement, query } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\nimport { styleMap } from \"lit/directives/style-map.js\";\nimport { Dropdown, events, utils } from \"@omegagrid/core\";\n\n@customElement('og-form-colorinput')\nexport class FormColorInput extends BaseControl<string> {\n\n\tstatic styles = [...BaseControl.styles];\n\n\t@query('og-dropdown')\n\tdropdown: Dropdown;\n\n\t_onChange = (e: events.ChangeEvent<string>) => {\n\t\tthis.dropdown.close();\n\t\tthis.updateValue(e.value == null ? null : utils.trim(e.value, '#'));\n\t\tthis.requestUpdate();\n\t}\n\n\trender = () => html`\n\t\t<og-dropdown style=\"${styleMap({backgroundColor: this.value ? `#${this.value}` : null})}\">\n\t\t\t<div\n\t\t\t\tslot=\"label\" \n\t\t\t\tstyle=\"${styleMap({\n\t\t\t\t\tbackgroundColor: this.value ? `#${this.value}` : 'transparent', \n\t\t\t\t\tpadding: '2px'\n\t\t\t\t})}\">&nbsp;\n\t\t\t</div>\n\n\t\t\t<og-colorpicker\n\t\t\t\tslot=\"content\"\n\t\t\t\t.color=\"${this.value}\"\n\t\t\t\t@change=\"${this._onChange}\"\n\t\t\t\t@mousedown=\"${(e: MouseEvent) => e.stopPropagation()}\">\n\t\t\t</og-colorpicker>\n\t\t</og-dropdown>\n\t`;\n\t\n}"]}
+{"version":3,"file":"colorInput.js","sourceRoot":"","sources":["../../../src/ui/controls/colorInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAoB,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAGnD,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,WAAmB;IAAhD;;QAON,cAAS,GAAG,CAAC,CAA6B,EAAE,EAAE;YAC7C,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;YACtB,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC;YACpE,IAAI,CAAC,aAAa,EAAE,CAAC;QACtB,CAAC,CAAA;QAED,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;4BACQ,IAAI,CAAC,QAAQ,YAAY,QAAQ,CAAC,EAAC,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,EAAC,CAAC;;;aAGzG,QAAQ,CAAC;YACjB,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,aAAa;YAC9D,OAAO,EAAE,KAAK;SACd,CAAC;;;;;cAKQ,IAAI,CAAC,KAAK;eACT,IAAI,CAAC,SAAS;kBACX,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE;;;EAGtD,CAAC;IAEH,CAAC;;AA9BO,qBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,CAAC,AAA1B,CAA2B;AAGxC;IADC,KAAK,CAAC,aAAa,CAAC;gDACF;AALP,cAAc;IAD1B,aAAa,CAAC,oBAAoB,CAAC;GACvB,cAAc,CAgC1B","sourcesContent":["import { html } from \"lit\";\nimport { customElement, query } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\nimport { styleMap } from \"lit/directives/style-map.js\";\nimport { Dropdown, events, utils } from \"@omegagrid/core\";\n\n@customElement('og-form-colorinput')\nexport class FormColorInput extends BaseControl<string> {\n\n\tstatic styles = [...BaseControl.styles];\n\n\t@query('og-dropdown')\n\tdropdown: Dropdown;\n\n\t_onChange = (e: events.ChangeEvent<string>) => {\n\t\tthis.dropdown.close();\n\t\tthis.updateValue(e.value == null ? null : utils.trim(e.value, '#'));\n\t\tthis.requestUpdate();\n\t}\n\n\trender = () => html`\n\t\t<og-dropdown ?disabled=\"${this.readOnly}\" style=\"${styleMap({backgroundColor: this.value ? `#${this.value}` : null})}\">\n\t\t\t<div\n\t\t\t\tslot=\"label\" \n\t\t\t\tstyle=\"${styleMap({\n\t\t\t\t\tbackgroundColor: this.value ? `#${this.value}` : 'transparent', \n\t\t\t\t\tpadding: '2px'\n\t\t\t\t})}\">&nbsp;\n\t\t\t</div>\n\n\t\t\t<og-colorpicker\n\t\t\t\tslot=\"content\"\n\t\t\t\t.color=\"${this.value}\"\n\t\t\t\t@change=\"${this._onChange}\"\n\t\t\t\t@mousedown=\"${(e: MouseEvent) => e.stopPropagation()}\">\n\t\t\t</og-colorpicker>\n\t\t</og-dropdown>\n\t`;\n\t\n}"]}

package/dist/ui/controls/dateInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dateInput.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/dateInput.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAI9E,qBACa,aAAc,SAAQ,WAAW,CAAC,IAAI,GAAC,MAAM,CAAC;;IAE1D,MAAM,CAAC,MAAM,4BAIV;IAGH,IAAI,WAAW,oBAA8F;IAE7G,IAAI,SAAS,sBAeZ;IAED,SAAS,GAAI,GAAG,SAAS,UASxB;IAED,MAAM,6CAcJ;CAEF"}
+{"version":3,"file":"dateInput.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/dateInput.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAI9E,qBACa,aAAc,SAAQ,WAAW,CAAC,IAAI,GAAC,MAAM,CAAC;;IAE1D,MAAM,CAAC,MAAM,4BAIV;IAGH,IAAI,WAAW,oBAA8F;IAE7G,IAAI,SAAS,sBAeZ;IAED,SAAS,GAAI,GAAG,SAAS,UASxB;IAED,MAAM,6CAeJ;CAEF"}

package/dist/ui/controls/dateInput.js

@@ -35,6 +35,7 @@ let FormDateInput = class FormDateInput extends BaseControl {
         this.render = () => html `
 		<og-tree-dropdown
 			@change="${this._onChange}"
+			?disabled="${this.readOnly}"
 			.adapter="${this.dateAdapter}"
 			.options="${{
             selectMode: 'single',

package/dist/ui/controls/dateInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"dateInput.js","sourceRoot":"","sources":["../../../src/ui/controls/dateInput.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\nimport { DateTreeAdapter, SerializedValue, TreeEvent } from \"@omegagrid/tree\";\nimport { dates } from \"@omegagrid/core\";\nimport { getLocale } from \"@omegagrid/localize\";\n\n@customElement('og-form-dateinput')\nexport class FormDateInput extends BaseControl<Date|string> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tog-tree-dropdown {\n\t\t\theight: 100%;\n\t\t}\t\n\t`];\n\n\t#adapter: DateTreeAdapter;\n\tget dateAdapter() { return this.#adapter ?? (this.#adapter = new DateTreeAdapter(this.model.props.options)) }\n\n\tget treeValue() {\n\t\tif (!this.value) return null;\n\t\tlet date: Date;\n\t\tif (this.value instanceof Date) {\n\t\t\tdate = this.value;\n\t\t\tthis.value = [\n\t\t\t\tthis.value.getFullYear(),\n\t\t\t\t(this.value.getMonth() + 1).toString().padStart(2, '0'),\n\t\t\t\tthis.value.getDate().toString().padStart(2, '0')\n\t\t\t].join('-');\n\t\t} else {\n\t\t\tdate = dates.parse(this.value as string, getLocale());\n\t\t}\n\n\t\treturn [[this.value, 0, 1, {value: dates.getDateFormatter(getLocale())(date)}]] as SerializedValue[];\n\t}\n\n\t_onChange = (e: TreeEvent) => {\n\t\tif (!e.node) return;\n\t\tconst strDate = e.node.key;\n\t\tthis.updateValue(new Date(\n\t\t\tparseInt(strDate.substring(0, 4)), \n\t\t\tparseInt(strDate.substring(4, 6)) - 1, \n\t\t\tparseInt(strDate.substring(6, 8)),\n\t\t\t0, 0, 0\n\t\t));\n\t}\n\n\trender = () => html`\n\t\t<og-tree-dropdown\n\t\t\t@change=\"${this._onChange}\"\n\t\t\t.adapter=\"${this.dateAdapter}\"\n\t\t\t.options=\"${{\n\t\t\t\tselectMode: 'single', \n\t\t\t\tautoClose: true, \n\t\t\t\tallowEmpty: true\n\t\t\t}}\"\n\t\t\t?cross=\"${!this.model.props.required}\"\n\t\t\t.value=\"${this.treeValue}\"\n\t\t\t.caption=\"${this.model.props.caption}\"\n\t\t\t.placeholder=\"${this.model.props.placeholder}\">\n\t\t</og-tree-dropdown>\n\t`;\n\t\n}"]}
+{"version":3,"file":"dateInput.js","sourceRoot":"","sources":["../../../src/ui/controls/dateInput.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\nimport { DateTreeAdapter, SerializedValue, TreeEvent } from \"@omegagrid/tree\";\nimport { dates } from \"@omegagrid/core\";\nimport { getLocale } from \"@omegagrid/localize\";\n\n@customElement('og-form-dateinput')\nexport class FormDateInput extends BaseControl<Date|string> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tog-tree-dropdown {\n\t\t\theight: 100%;\n\t\t}\t\n\t`];\n\n\t#adapter: DateTreeAdapter;\n\tget dateAdapter() { return this.#adapter ?? (this.#adapter = new DateTreeAdapter(this.model.props.options)) }\n\n\tget treeValue() {\n\t\tif (!this.value) return null;\n\t\tlet date: Date;\n\t\tif (this.value instanceof Date) {\n\t\t\tdate = this.value;\n\t\t\tthis.value = [\n\t\t\t\tthis.value.getFullYear(),\n\t\t\t\t(this.value.getMonth() + 1).toString().padStart(2, '0'),\n\t\t\t\tthis.value.getDate().toString().padStart(2, '0')\n\t\t\t].join('-');\n\t\t} else {\n\t\t\tdate = dates.parse(this.value as string, getLocale());\n\t\t}\n\n\t\treturn [[this.value, 0, 1, {value: dates.getDateFormatter(getLocale())(date)}]] as SerializedValue[];\n\t}\n\n\t_onChange = (e: TreeEvent) => {\n\t\tif (!e.node) return;\n\t\tconst strDate = e.node.key;\n\t\tthis.updateValue(new Date(\n\t\t\tparseInt(strDate.substring(0, 4)), \n\t\t\tparseInt(strDate.substring(4, 6)) - 1, \n\t\t\tparseInt(strDate.substring(6, 8)),\n\t\t\t0, 0, 0\n\t\t));\n\t}\n\n\trender = () => html`\n\t\t<og-tree-dropdown\n\t\t\t@change=\"${this._onChange}\"\n\t\t\t?disabled=\"${this.readOnly}\"\n\t\t\t.adapter=\"${this.dateAdapter}\"\n\t\t\t.options=\"${{\n\t\t\t\tselectMode: 'single',\n\t\t\t\tautoClose: true,\n\t\t\t\tallowEmpty: true\n\t\t\t}}\"\n\t\t\t?cross=\"${!this.model.props.required}\"\n\t\t\t.value=\"${this.treeValue}\"\n\t\t\t.caption=\"${this.model.props.caption}\"\n\t\t\t.placeholder=\"${this.model.props.placeholder}\">\n\t\t</og-tree-dropdown>\n\t`;\n\t\n}"]}

package/dist/ui/controls/fileInput.js

@@ -11,7 +11,7 @@ let FormFileInput = class FormFileInput extends BaseControl {
     constructor() {
         super(...arguments);
         this.render = () => html `
-		<og-fileinput @change="${(e) => this.updateValue(e.value)}"></og-fileinput>
+		<og-fileinput ?disabled="${this.readOnly}" @change="${(e) => this.updateValue(e.value)}"></og-fileinput>
 	`;
     }
 };

package/dist/ui/controls/fileInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"fileInput.js","sourceRoot":"","sources":["../../../src/ui/controls/fileInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAIrC,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,WAAiB;IAA7C;;QASN,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;2BACO,CAAC,CAAqB,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC;EAC7E,CAAC;IAEH,CAAC;;AAXO,oBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;EAK1C,CAAC,AALW,CAKV;AAPS,aAAa;IADzB,aAAa,CAAC,mBAAmB,CAAC;GACtB,aAAa,CAazB","sourcesContent":["import { css, html } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\nimport { events } from \"@omegagrid/core\";\n\n@customElement('og-form-fileinput')\nexport class FormFileInput extends BaseControl<File> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tog-fileinput {\n\t\t\tborder-color: var(--og-accent-color);\n\t\t\twidth: 100%;\n\t\t}\t\n\t`];\n\n\trender = () => html`\n\t\t<og-fileinput @change=\"${(e: events.ChangeEvent) => this.updateValue(e.value)}\"></og-fileinput>\n\t`;\n\t\n}"]}
+{"version":3,"file":"fileInput.js","sourceRoot":"","sources":["../../../src/ui/controls/fileInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAIrC,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,WAAiB;IAA7C;;QASN,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;6BACS,IAAI,CAAC,QAAQ,cAAc,CAAC,CAAqB,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC;EAC1G,CAAC;IAEH,CAAC;;AAXO,oBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;EAK1C,CAAC,AALW,CAKV;AAPS,aAAa;IADzB,aAAa,CAAC,mBAAmB,CAAC;GACtB,aAAa,CAazB","sourcesContent":["import { css, html } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\nimport { events } from \"@omegagrid/core\";\n\n@customElement('og-form-fileinput')\nexport class FormFileInput extends BaseControl<File> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tog-fileinput {\n\t\t\tborder-color: var(--og-accent-color);\n\t\t\twidth: 100%;\n\t\t}\t\n\t`];\n\n\trender = () => html`\n\t\t<og-fileinput ?disabled=\"${this.readOnly}\" @change=\"${(e: events.ChangeEvent) => this.updateValue(e.value)}\"></og-fileinput>\n\t`;\n\t\n}"]}

package/dist/ui/controls/index.d.ts

@@ -1,4 +1,5 @@
 export * from './textInput';
+export * from './passwordInput';
 export * from './colorInput';
 export * from './dateInput';
 export * from './calendarDateInput';

package/dist/ui/controls/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC"}

package/dist/ui/controls/index.js

@@ -1,4 +1,5 @@
 export * from './textInput';
+export * from './passwordInput';
 export * from './colorInput';
 export * from './dateInput';
 export * from './calendarDateInput';

package/dist/ui/controls/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/controls/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC","sourcesContent":["export * from './textInput';\nexport * from './colorInput';\nexport * from './dateInput';\nexport * from './calendarDateInput';\nexport * from './numericInput';\nexport * from './fileInput';\nexport * from './checkbox';\nexport * from './label';\nexport * from './list';\nexport * from './button';"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/controls/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC","sourcesContent":["export * from './textInput';\nexport * from './passwordInput';\nexport * from './colorInput';\nexport * from './dateInput';\nexport * from './calendarDateInput';\nexport * from './numericInput';\nexport * from './fileInput';\nexport * from './checkbox';\nexport * from './label';\nexport * from './list';\nexport * from './button';"]}

package/dist/ui/controls/list.d.ts

@@ -10,7 +10,7 @@ export declare class FormList extends BaseControl<SerializedValue[] | string, Tr
     _onChange: (e: TreeEvent) => void;
     _onDropdownOpen: () => void;
     getAdapter(): TreeAdapter;
-    willUpdate(): Promise<void>;
+    willUpdate(changedProps: Map<PropertyKey, unknown>): Promise<void>;
     updated(): Promise<void>;
     render: () => import("lit-html").TemplateResult<1>;
 }

package/dist/ui/controls/list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/list.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,YAAY,EAAE,SAAS,EAAuC,MAAM,iBAAiB,CAAC;AAE7H,qBACa,QAAS,SAAQ,WAAW,CAAC,eAAe,EAAE,GAAC,MAAM,EAAE,WAAW,CAAC;IAE/E,MAAM,CAAC,MAAM,4BAIV;IAGH,QAAQ,EAAE,YAAY,CAAC;IAEvB,OAAO,CAAC,UAAU,CAAQ;IAE1B,IAAI,OAAO,YAAkB;IAE7B,OAAO,CAAC,WAAW;IAIb,KAAK,CAAC,aAAa,UAAO;IAQhC,SAAS,GAAI,GAAG,SAAS,UAMxB;IAED,eAAe,aAGd;IAED,UAAU;IAIJ,UAAU;IAWV,OAAO;IAOb,MAAM,6CAUJ;CAEF"}
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/list.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,YAAY,EAAE,SAAS,EAAuC,MAAM,iBAAiB,CAAC;AAE7H,qBACa,QAAS,SAAQ,WAAW,CAAC,eAAe,EAAE,GAAC,MAAM,EAAE,WAAW,CAAC;IAE/E,MAAM,CAAC,MAAM,4BAIV;IAGH,QAAQ,EAAE,YAAY,CAAC;IAEvB,OAAO,CAAC,UAAU,CAAQ;IAE1B,IAAI,OAAO,YAAkB;IAE7B,OAAO,CAAC,WAAW;IAIb,KAAK,CAAC,aAAa,UAAO;IAQhC,SAAS,GAAI,GAAG,SAAS,UAMxB;IAED,eAAe,aAGd;IAED,UAAU;IAIJ,UAAU,CAAC,YAAY,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC;IAYlD,OAAO;IAOb,MAAM,6CAWJ;CAEF"}

package/dist/ui/controls/list.js

@@ -26,9 +26,10 @@ let FormList = class FormList extends BaseControl {
                 this.adapter?.attach(this.dropdown.tree);
         };
         this.render = () => html `
-		<og-tree-dropdown 
+		<og-tree-dropdown
 			@change="${this._onChange}"
 			@dropdown.open="${this._onDropdownOpen}"
+			?disabled="${this.readOnly}"
 			?cross="${!this.model.props.required}"
 			.adapter="${this.getAdapter()}"
 			.value="${this.formatValue(this.value)}"
@@ -51,7 +52,8 @@ let FormList = class FormList extends BaseControl {
     getAdapter() {
         return this.adapter ?? this.formModel.options?.treeAdapter;
     }
-    async willUpdate() {
+    async willUpdate(changedProps) {
+        super.willUpdate(changedProps);
         if (this.value) {
             const adapter = this.getAdapter();
             if (adapter) {

package/dist/ui/controls/list.js.map

@@ -1 +1 @@
-{"version":3,"file":"list.js","sourceRoot":"","sources":["../../../src/ui/controls/list.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html } from \"lit\";\nimport { customElement, query } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\nimport { TreeAdapter, SerializedValue, TreeDropdown, TreeEvent, TreeSource, TreeOptions, SelectMode } from \"@omegagrid/tree\";\n\n@customElement('og-form-list')\nexport class FormList extends BaseControl<SerializedValue[]|string, TreeAdapter> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tog-tree-dropdown {\n\t\t\theight: 100%;\n\t\t}\t\n\t`];\n\n\t@query('og-tree-dropdown')\n\tdropdown: TreeDropdown;\n\n\tprivate _firstOpen = true;\n\n\tget isValid() { return true }\n\n\tprivate formatValue(value: unknown) {\n\t\treturn Array.isArray(value) ? value : (value == null ? null : [[value, 0, 1]]) as SerializedValue[];\n\t}\n\n\tasync reset(dispatchEvent = true) {\n\t\tawait super.reset(dispatchEvent);\n\t\tif (this.dropdown) {\n\t\t\tthis.dropdown.value = null;\n\t\t\tthis.dropdown.value = this.formatValue(this.model.props.value);\n\t\t}\n\t}\n\n\t_onChange = (e: TreeEvent) => {\n\t\tconst values = e.component.selection.serialize(['v']);\n\t\tif (this.dropdown.tree.options.selectMode == SelectMode.Single)\n\t\t\tthis.updateValue(values.length > 0 ? values[0][0] : null, true);\n\t\telse\n\t\t\tthis.updateValue(values, true);\n\t}\n\n\t_onDropdownOpen = () => {\n\t\tif (this._firstOpen) this._firstOpen = false;\n\t\telse this.adapter?.attach(this.dropdown.tree);\n\t}\n\n\tgetAdapter() {\n\t\treturn this.adapter ?? this.formModel.options?.treeAdapter;\n\t}\n\n\tasync willUpdate() {\n\t\tif (this.value) {\n\t\t\tconst adapter = this.getAdapter();\n\t\t\tif (adapter) {\n\t\t\t\tconst [options] = await Promise.all([adapter.getOptions()]);\n\t\t\t\tif (options && options.selectMode == SelectMode.Single)\n\t\t\t\t\tthis.updateValue(Array.isArray(this.value) && this.value.length > 0 ? this.value[0][0] : this.value);\n\t\t\t}\n\t\t}\n\t}\n\n\tasync updated() {\n\t\tif (this.model.props.content) {\n\t\t\tconst content: {sourceData: TreeSource, options: TreeOptions} = this.model.props.content as {sourceData: TreeSource, options: TreeOptions};\n\t\t\tthis.dropdown.setSourceData(content.sourceData, content.options);\n\t\t}\n\t}\n\n\trender = () => html`\n\t\t<og-tree-dropdown \n\t\t\t@change=\"${this._onChange}\"\n\t\t\t@dropdown.open=\"${this._onDropdownOpen}\"\n\t\t\t?cross=\"${!this.model.props.required}\"\n\t\t\t.adapter=\"${this.getAdapter()}\"\n\t\t\t.value=\"${this.formatValue(this.value)}\"\n\t\t\t.caption=\"${this.model.props.caption}\"\n\t\t\t.placeholder=\"${this.model.props.placeholder}\">\n\t\t</og-tree-dropdown>\n\t`;\n\t\n}"]}
+{"version":3,"file":"list.js","sourceRoot":"","sources":["../../../src/ui/controls/list.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html } from \"lit\";\nimport { customElement, query } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\nimport { TreeAdapter, SerializedValue, TreeDropdown, TreeEvent, TreeSource, TreeOptions, SelectMode } from \"@omegagrid/tree\";\n\n@customElement('og-form-list')\nexport class FormList extends BaseControl<SerializedValue[]|string, TreeAdapter> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tog-tree-dropdown {\n\t\t\theight: 100%;\n\t\t}\t\n\t`];\n\n\t@query('og-tree-dropdown')\n\tdropdown: TreeDropdown;\n\n\tprivate _firstOpen = true;\n\n\tget isValid() { return true }\n\n\tprivate formatValue(value: unknown) {\n\t\treturn Array.isArray(value) ? value : (value == null ? null : [[value, 0, 1]]) as SerializedValue[];\n\t}\n\n\tasync reset(dispatchEvent = true) {\n\t\tawait super.reset(dispatchEvent);\n\t\tif (this.dropdown) {\n\t\t\tthis.dropdown.value = null;\n\t\t\tthis.dropdown.value = this.formatValue(this.model.props.value);\n\t\t}\n\t}\n\n\t_onChange = (e: TreeEvent) => {\n\t\tconst values = e.component.selection.serialize(['v']);\n\t\tif (this.dropdown.tree.options.selectMode == SelectMode.Single)\n\t\t\tthis.updateValue(values.length > 0 ? values[0][0] : null, true);\n\t\telse\n\t\t\tthis.updateValue(values, true);\n\t}\n\n\t_onDropdownOpen = () => {\n\t\tif (this._firstOpen) this._firstOpen = false;\n\t\telse this.adapter?.attach(this.dropdown.tree);\n\t}\n\n\tgetAdapter() {\n\t\treturn this.adapter ?? this.formModel.options?.treeAdapter;\n\t}\n\n\tasync willUpdate(changedProps: Map<PropertyKey, unknown>) {\n\t\tsuper.willUpdate(changedProps);\n\t\tif (this.value) {\n\t\t\tconst adapter = this.getAdapter();\n\t\t\tif (adapter) {\n\t\t\t\tconst [options] = await Promise.all([adapter.getOptions()]);\n\t\t\t\tif (options && options.selectMode == SelectMode.Single)\n\t\t\t\t\tthis.updateValue(Array.isArray(this.value) && this.value.length > 0 ? this.value[0][0] : this.value);\n\t\t\t}\n\t\t}\n\t}\n\n\tasync updated() {\n\t\tif (this.model.props.content) {\n\t\t\tconst content: {sourceData: TreeSource, options: TreeOptions} = this.model.props.content as {sourceData: TreeSource, options: TreeOptions};\n\t\t\tthis.dropdown.setSourceData(content.sourceData, content.options);\n\t\t}\n\t}\n\n\trender = () => html`\n\t\t<og-tree-dropdown\n\t\t\t@change=\"${this._onChange}\"\n\t\t\t@dropdown.open=\"${this._onDropdownOpen}\"\n\t\t\t?disabled=\"${this.readOnly}\"\n\t\t\t?cross=\"${!this.model.props.required}\"\n\t\t\t.adapter=\"${this.getAdapter()}\"\n\t\t\t.value=\"${this.formatValue(this.value)}\"\n\t\t\t.caption=\"${this.model.props.caption}\"\n\t\t\t.placeholder=\"${this.model.props.placeholder}\">\n\t\t</og-tree-dropdown>\n\t`;\n\t\n}"]}

package/dist/ui/controls/numericInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"numericInput.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/numericInput.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,qBACa,gBAAiB,SAAQ,WAAW,CAAC,MAAM,CAAC;IAExD,MAAM,CAAC,MAAM,4BA4BV;IAGH,GAAG,EAAE,MAAM,CAAC;IAGZ,GAAG,EAAE,MAAM,CAAC;IAEN,QAAQ;;IAQd,SAAS,GAAI,GAAG,UAAU,UAEzB;IAEK,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,aAAa,UAAO;IASrD,EAAE,sBAAkD;IACpD,IAAI,sBAAiD;IAErD,MAAM,6CASJ;CAEF"}
+{"version":3,"file":"numericInput.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/numericInput.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,qBACa,gBAAiB,SAAQ,WAAW,CAAC,MAAM,CAAC;IAExD,MAAM,CAAC,MAAM,4BA4BV;IAGH,GAAG,EAAE,MAAM,CAAC;IAGZ,GAAG,EAAE,MAAM,CAAC;IAEN,QAAQ;;IAQd,SAAS,GAAI,GAAG,UAAU,UAEzB;IAEK,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,aAAa,UAAO;IASrD,EAAE,sBAAkD;IACpD,IAAI,sBAAiD;IAErD,MAAM,6CAUJ;CAEF"}

package/dist/ui/controls/numericInput.js

@@ -22,6 +22,7 @@ let FormNumericInput = class FormNumericInput extends BaseControl {
         this.render = () => html `
 		<og-numericinput
 			?buttons="${true}"
+			?disabled="${this.readOnly}"
 			.min="${this.min}"
 			.max="${this.max}"
 			.value="${this.value}"

package/dist/ui/controls/numericInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"numericInput.js","sourceRoot":"","sources":["../../../src/ui/controls/numericInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,SAAS,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAGrC,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,WAAmB;IAsCxD,KAAK,CAAC,QAAQ;QACb,MAAM,KAAK,CAAC,QAAQ,EAAE,CAAC;IACxB,CAAC;IAED;QACC,KAAK,EAAE,CAAC;QAGT,cAAS,GAAG,CAAC,CAAa,EAAE,EAAE;YAC7B,IAAI,CAAC,WAAW,CAAC,UAAU,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAC,CAAC;QACpE,CAAC,CAAA;QAWD,OAAE,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QACpD,SAAI,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QAErD,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;eAEL,IAAI;WACR,IAAI,CAAC,GAAG;WACR,IAAI,CAAC,GAAG;aACN,IAAI,CAAC,KAAK;mBACJ,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW;cAClC,IAAI,CAAC,SAAS;;EAE1B,CAAC;IA3BF,CAAC;IAMD,KAAK,CAAC,WAAW,CAAC,KAAa,EAAE,aAAa,GAAG,IAAI;QACpD,IAAI,KAAK,IAAI,IAAI,EAAE,CAAC;YACnB,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;YAC5D,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;QAC7D,CAAC;QACD,MAAM,KAAK,CAAC,WAAW,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;QAC9C,IAAI,CAAC,aAAa,EAAE,CAAC;IACtB,CAAC;;AAvDM,uBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;;kBAM1B,SAAS,CAAC,wBAAwB;;;;;;;;;;;;;;;;;;;;;;EAsBlD,CAAC,AA5BW,CA4BV;AAGH;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;6CACb;AAGZ;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;6CACb;AApCA,gBAAgB;IAD5B,aAAa,CAAC,sBAAsB,CAAC;GACzB,gBAAgB,CAyE5B","sourcesContent":["import constants from \"../../constants\";\nimport { css, html } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\n\n@customElement('og-form-numericinput')\nexport class FormNumericInput extends BaseControl<number> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tog-numericinput {\n\t\t\tborder: 1px solid var(--og-accent-color);\n\t\t\tbackground-color: var(--og-form-background-color);\n\t\t\tcolor: var(--og-text-color);\n\t\t\theight: 100%;\n\t\t\tline-height: ${constants.DEFAULT_FORM_LINE_HEIGHT}px;\n\t\t\twidth: 100%;\n\t\t}\n\n\t\t.buttons {\n\t\t\tdisplay: none;\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\tright: 0;\n\t\t\tbottom: 0;\n\t\t\twidth: 15px;\n\t\t\tbackground-color: var(--og-accent-color);\n\t\t}\n\n\t\t:host {\n\t\t\tposition: relative;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t:host(:hover) .buttons {\n\t\t\tdisplay: block;\n\t\t}\n\t`];\n\n\t@property({type: Number})\n\tmin: number;\n\n\t@property({type: Number})\n\tmax: number;\n\n\tasync validate() {\n\t\tawait super.validate();\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t}\n\n\t_onChange = (e: InputEvent) => {\n\t\tthis.updateValue(parseFloat((e.target as HTMLInputElement).value));\n\t}\n\n\tasync updateValue(value: number, dispatchEvent = true) {\n\t\tif (value != null) {\n\t\t\tvalue = isNaN(this.min) ? value : Math.max(value, this.min);\n\t\t\tvalue = isNaN(this.max) ? value : Math.min(value, this.max);\n\t\t}\n\t\tawait super.updateValue(value, dispatchEvent);\n\t\tthis.requestUpdate();\n\t}\n\n\tup = () => this.updateValue((this.value ?? -1) + 1);\n\tdown = () => this.updateValue((this.value ?? 1) - 1);\n\n\trender = () => html`\n\t\t<og-numericinput\n\t\t\t?buttons=\"${true}\"\n\t\t\t.min=\"${this.min}\"\n\t\t\t.max=\"${this.max}\"\n\t\t\t.value=\"${this.value}\"\n\t\t\t.placeholder=\"${this.model?.props.placeholder}\"\n\t\t\t@change=\"${this._onChange}\">\n\t\t</og-numericinput>\n\t`;\n\t\n}"]}
+{"version":3,"file":"numericInput.js","sourceRoot":"","sources":["../../../src/ui/controls/numericInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,SAAS,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAGrC,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,WAAmB;IAsCxD,KAAK,CAAC,QAAQ;QACb,MAAM,KAAK,CAAC,QAAQ,EAAE,CAAC;IACxB,CAAC;IAED;QACC,KAAK,EAAE,CAAC;QAGT,cAAS,GAAG,CAAC,CAAa,EAAE,EAAE;YAC7B,IAAI,CAAC,WAAW,CAAC,UAAU,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAC,CAAC;QACpE,CAAC,CAAA;QAWD,OAAE,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QACpD,SAAI,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QAErD,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;eAEL,IAAI;gBACH,IAAI,CAAC,QAAQ;WAClB,IAAI,CAAC,GAAG;WACR,IAAI,CAAC,GAAG;aACN,IAAI,CAAC,KAAK;mBACJ,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW;cAClC,IAAI,CAAC,SAAS;;EAE1B,CAAC;IA5BF,CAAC;IAMD,KAAK,CAAC,WAAW,CAAC,KAAa,EAAE,aAAa,GAAG,IAAI;QACpD,IAAI,KAAK,IAAI,IAAI,EAAE,CAAC;YACnB,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;YAC5D,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;QAC7D,CAAC;QACD,MAAM,KAAK,CAAC,WAAW,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;QAC9C,IAAI,CAAC,aAAa,EAAE,CAAC;IACtB,CAAC;;AAvDM,uBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;;kBAM1B,SAAS,CAAC,wBAAwB;;;;;;;;;;;;;;;;;;;;;;EAsBlD,CAAC,AA5BW,CA4BV;AAGH;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;6CACb;AAGZ;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;6CACb;AApCA,gBAAgB;IAD5B,aAAa,CAAC,sBAAsB,CAAC;GACzB,gBAAgB,CA0E5B","sourcesContent":["import constants from \"../../constants\";\nimport { css, html } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\n\n@customElement('og-form-numericinput')\nexport class FormNumericInput extends BaseControl<number> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tog-numericinput {\n\t\t\tborder: 1px solid var(--og-accent-color);\n\t\t\tbackground-color: var(--og-form-background-color);\n\t\t\tcolor: var(--og-text-color);\n\t\t\theight: 100%;\n\t\t\tline-height: ${constants.DEFAULT_FORM_LINE_HEIGHT}px;\n\t\t\twidth: 100%;\n\t\t}\n\n\t\t.buttons {\n\t\t\tdisplay: none;\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\tright: 0;\n\t\t\tbottom: 0;\n\t\t\twidth: 15px;\n\t\t\tbackground-color: var(--og-accent-color);\n\t\t}\n\n\t\t:host {\n\t\t\tposition: relative;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t:host(:hover) .buttons {\n\t\t\tdisplay: block;\n\t\t}\n\t`];\n\n\t@property({type: Number})\n\tmin: number;\n\n\t@property({type: Number})\n\tmax: number;\n\n\tasync validate() {\n\t\tawait super.validate();\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t}\n\n\t_onChange = (e: InputEvent) => {\n\t\tthis.updateValue(parseFloat((e.target as HTMLInputElement).value));\n\t}\n\n\tasync updateValue(value: number, dispatchEvent = true) {\n\t\tif (value != null) {\n\t\t\tvalue = isNaN(this.min) ? value : Math.max(value, this.min);\n\t\t\tvalue = isNaN(this.max) ? value : Math.min(value, this.max);\n\t\t}\n\t\tawait super.updateValue(value, dispatchEvent);\n\t\tthis.requestUpdate();\n\t}\n\n\tup = () => this.updateValue((this.value ?? -1) + 1);\n\tdown = () => this.updateValue((this.value ?? 1) - 1);\n\n\trender = () => html`\n\t\t<og-numericinput\n\t\t\t?buttons=\"${true}\"\n\t\t\t?disabled=\"${this.readOnly}\"\n\t\t\t.min=\"${this.min}\"\n\t\t\t.max=\"${this.max}\"\n\t\t\t.value=\"${this.value}\"\n\t\t\t.placeholder=\"${this.model?.props.placeholder}\"\n\t\t\t@change=\"${this._onChange}\">\n\t\t</og-numericinput>\n\t`;\n\t\n}"]}

package/dist/ui/controls/passwordInput.d.ts

@@ -0,0 +1,9 @@
+import { FormTextInput } from "./textInput";
+export declare class FormPasswordInput extends FormTextInput {
+    static styles: import("lit").CSSResult[];
+    private _visible;
+    get showToggle(): boolean;
+    private _toggleVisibility;
+    render: () => import("lit-html").TemplateResult<1>;
+}
+//# sourceMappingURL=passwordInput.d.ts.map

package/dist/ui/controls/passwordInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"passwordInput.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/passwordInput.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,qBACa,iBAAkB,SAAQ,aAAa;IAEnD,MAAM,CAAC,MAAM,4BA0BV;IAGH,OAAO,CAAC,QAAQ,CAAS;IAEzB,IAAI,UAAU,YAEb;IAED,OAAO,CAAC,iBAAiB,CAExB;IAED,MAAM,6CAmBJ;CAEF"}

package/dist/ui/controls/passwordInput.js

@@ -0,0 +1,76 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { css, html } from "lit";
+import { customElement, state } from "lit/decorators.js";
+import { FormTextInput } from "./textInput";
+let FormPasswordInput = class FormPasswordInput extends FormTextInput {
+    constructor() {
+        super(...arguments);
+        this._visible = false;
+        this._toggleVisibility = () => {
+            this._visible = !this._visible;
+        };
+        this.render = () => html `
+		<div class="wrapper">
+			<input
+				type="${this._visible ? 'text' : 'password'}"
+				placeholder="${this.model?.props.placeholder ?? ''}"
+				?readonly="${this.readOnly}"
+				@change="${this._onChange}"
+				@keydown="${this._onKeyDown}"
+			>
+			${this.showToggle ? html `
+				<button
+					type="button"
+					class="toggle"
+					tabindex="-1"
+					@click="${this._toggleVisibility}">
+					<og-icon icon="${this._visible ? 'eye-slash' : 'eye'}"></og-icon>
+				</button>
+			` : ''}
+		</div>
+	`;
+    }
+    get showToggle() {
+        return !!(this.model?.props.options?.showToggle);
+    }
+};
+FormPasswordInput.styles = [...FormTextInput.styles, css `
+		.wrapper {
+			position: relative;
+			height: 100%;
+			width: 100%;
+		}
+
+		.wrapper input {
+			padding-right: 28px;
+		}
+
+		.toggle {
+			position: absolute;
+			top: 0;
+			right: 0;
+			bottom: 0;
+			width: 28px;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			cursor: pointer;
+			color: var(--og-text-color);
+			background: transparent;
+			border: none;
+			outline: none;
+		}
+	`];
+__decorate([
+    state()
+], FormPasswordInput.prototype, "_visible", void 0);
+FormPasswordInput = __decorate([
+    customElement('og-form-passwordinput')
+], FormPasswordInput);
+export { FormPasswordInput };
+//# sourceMappingURL=passwordInput.js.map

package/dist/ui/controls/passwordInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"passwordInput.js","sourceRoot":"","sources":["../../../src/ui/controls/passwordInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAGrC,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,aAAa;IAA7C;;QA+BE,aAAQ,GAAG,KAAK,CAAC;QAMjB,sBAAiB,GAAG,GAAG,EAAE;YAChC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAChC,CAAC,CAAA;QAED,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;;YAGR,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU;mBAC5B,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,IAAI,EAAE;iBACrC,IAAI,CAAC,QAAQ;eACf,IAAI,CAAC,SAAS;gBACb,IAAI,CAAC,UAAU;;KAE1B,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAA;;;;;eAKZ,IAAI,CAAC,iBAAiB;sBACf,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK;;IAErD,CAAC,CAAC,CAAC,EAAE;;EAEP,CAAC;IAEH,CAAC;IA7BA,IAAI,UAAU;QACb,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;IAClD,CAAC;;AAjCM,wBAAM,GAAG,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;EA0B5C,CAAC,AA1BW,CA0BV;AAGK;IADP,KAAK,EAAE;mDACiB;AA/Bb,iBAAiB;IAD7B,aAAa,CAAC,uBAAuB,CAAC;GAC1B,iBAAiB,CA8D7B","sourcesContent":["import { css, html } from \"lit\";\nimport { customElement, state } from \"lit/decorators.js\";\nimport { FormTextInput } from \"./textInput\";\n\n@customElement('og-form-passwordinput')\nexport class FormPasswordInput extends FormTextInput {\n\n\tstatic styles = [...FormTextInput.styles, css`\n\t\t.wrapper {\n\t\t\tposition: relative;\n\t\t\theight: 100%;\n\t\t\twidth: 100%;\n\t\t}\n\n\t\t.wrapper input {\n\t\t\tpadding-right: 28px;\n\t\t}\n\n\t\t.toggle {\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\tright: 0;\n\t\t\tbottom: 0;\n\t\t\twidth: 28px;\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t\tcursor: pointer;\n\t\t\tcolor: var(--og-text-color);\n\t\t\tbackground: transparent;\n\t\t\tborder: none;\n\t\t\toutline: none;\n\t\t}\n\t`];\n\n\t@state()\n\tprivate _visible = false;\n\n\tget showToggle() {\n\t\treturn !!(this.model?.props.options?.showToggle);\n\t}\n\n\tprivate _toggleVisibility = () => {\n\t\tthis._visible = !this._visible;\n\t}\n\n\trender = () => html`\n\t\t<div class=\"wrapper\">\n\t\t\t<input\n\t\t\t\ttype=\"${this._visible ? 'text' : 'password'}\"\n\t\t\t\tplaceholder=\"${this.model?.props.placeholder ?? ''}\"\n\t\t\t\t?readonly=\"${this.readOnly}\"\n\t\t\t\t@change=\"${this._onChange}\"\n\t\t\t\t@keydown=\"${this._onKeyDown}\"\n\t\t\t>\n\t\t\t${this.showToggle ? html`\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclass=\"toggle\"\n\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t@click=\"${this._toggleVisibility}\">\n\t\t\t\t\t<og-icon icon=\"${this._visible ? 'eye-slash' : 'eye'}\"></og-icon>\n\t\t\t\t</button>\n\t\t\t` : ''}\n\t\t</div>\n\t`;\n\n}\n"]}

package/dist/ui/controls/textInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"textInput.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/textInput.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,qBACa,aAAc,SAAQ,WAAW,CAAC,MAAM,CAAC;IAErD,MAAM,CAAC,MAAM,4BAgBV;IAGH,KAAK,EAAE,gBAAgB,CAAC;IAElB,QAAQ;IAQd,SAAS,GAAI,GAAG,UAAU,UAEzB;IAED,UAAU,GAAI,GAAG,aAAa,UAI7B;IAED,OAAO;IAIP,MAAM,6CAOJ;CAEF"}
+{"version":3,"file":"textInput.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/textInput.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,qBACa,aAAc,SAAQ,WAAW,CAAC,MAAM,CAAC;IAErD,MAAM,CAAC,MAAM,4BAoBV;IAGH,KAAK,EAAE,gBAAgB,CAAC;IAElB,QAAQ;IAQd,SAAS,GAAI,GAAG,UAAU,UAEzB;IAED,UAAU,GAAI,GAAG,aAAa,UAI7B;IAED,OAAO;IAIP,MAAM,6CAQJ;CAEF"}

package/dist/ui/controls/textInput.js

@@ -23,6 +23,7 @@ let FormTextInput = class FormTextInput extends BaseControl {
 		<input
 			type="text"
 			placeholder="${this.model?.props.placeholder ?? ''}"
+			?readonly="${this.readOnly}"
 			@change="${this._onChange}"
 			@keydown="${this._onKeyDown}"
 		>
@@ -56,6 +57,10 @@ FormTextInput.styles = [...BaseControl.styles, css `
 		:host([required]) input {
 			border: none;
 		}
+
+		:host([readOnly]) {
+			pointer-events: auto;
+		}
 	`];
 __decorate([
     query('input')

package/dist/ui/controls/textInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"textInput.js","sourceRoot":"","sources":["../../../src/ui/controls/textInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,SAAS,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAGrC,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,WAAmB;IAA/C;;QA+BN,cAAS,GAAG,CAAC,CAAa,EAAE,EAAE;YAC7B,IAAI,CAAC,WAAW,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAC;QACxD,CAAC,CAAA;QAED,eAAU,GAAG,CAAC,CAAgB,EAAE,EAAE;YACjC,IAAI,CAAC,CAAC,GAAG,IAAI,OAAO,EAAE,CAAC;gBACtB,IAAI,CAAC,WAAW,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAC;YACxD,CAAC;QACF,CAAC,CAAA;QAMD,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;;kBAGF,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,IAAI,EAAE;cACvC,IAAI,CAAC,SAAS;eACb,IAAI,CAAC,UAAU;;EAE5B,CAAC;IAEH,CAAC;IA/BA,KAAK,CAAC,QAAQ;QACb,MAAM,KAAK,CAAC,QAAQ,EAAE,CAAC;QACvB,IAAI,CAAC,IAAI,CAAC,KAAK;YAAE,OAAO;QACxB,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC,EAAE,CAAC;YAClF,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACzC,CAAC;IACF,CAAC;IAYD,OAAO;QACN,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;IACzD,CAAC;;AAzCM,oBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;;;kBAO1B,SAAS,CAAC,uBAAuB;;;;;;;;;EASjD,CAAC,AAhBW,CAgBV;AAGH;IADC,KAAK,CAAC,OAAO,CAAC;4CACS;AArBZ,aAAa;IADzB,aAAa,CAAC,mBAAmB,CAAC;GACtB,aAAa,CAsDzB","sourcesContent":["import constants from \"../../constants\";\nimport { css, html } from \"lit\";\nimport { customElement, query } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\n\n@customElement('og-form-textinput')\nexport class FormTextInput extends BaseControl<string> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tinput {\n\t\t\tborder: 1px solid var(--og-accent-color);\n\t\t\tbackground-color: var(--og-form-background-color);\n\t\t\tcolor: var(--og-text-color);\n\t\t\tfont-size: var(--og-font-size);\n\t\t\theight: 100%;\n\t\t\tline-height: ${constants.DEFAULT_FORM_ROW_HEIGHT}px;\n\t\t\toutline: none;\n\t\t\twidth: 100%;\n\t\t\tborder-radius: var(--og-base-radius);\n\t\t}\n\n\t\t:host([required]) input {\n\t\t\tborder: none;\n\t\t}\n\t`];\n\n\t@query('input')\n\tinput: HTMLInputElement;\n\n\tasync validate() {\n\t\tawait super.validate();\n\t\tif (!this.model) return;\n\t\tif (this.model.props.pattern && !this.model.props.pattern.test(this.value ?? \"\")) {\n\t\t\tthis.model.errors.push('invalid value');\n\t\t}\n\t}\n\n\t_onChange = (e: InputEvent) => {\n\t\tthis.updateValue((e.target as HTMLInputElement).value);\n\t}\n\n\t_onKeyDown = (e: KeyboardEvent) => {\n\t\tif (e.key == 'Enter') {\n\t\t\tthis.updateValue((e.target as HTMLInputElement).value);\n\t\t}\n\t}\n\n\tupdated() {\n\t\tthis.input.value = this.value == null ? '' : this.value;\n\t}\n\n\trender = () => html`\n\t\t<input\n\t\t\ttype=\"text\"\n\t\t\tplaceholder=\"${this.model?.props.placeholder ?? ''}\"\n\t\t\t@change=\"${this._onChange}\"\n\t\t\t@keydown=\"${this._onKeyDown}\"\n\t\t>\n\t`;\n\t\n}"]}
+{"version":3,"file":"textInput.js","sourceRoot":"","sources":["../../../src/ui/controls/textInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,SAAS,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAGrC,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,WAAmB;IAA/C;;QAmCN,cAAS,GAAG,CAAC,CAAa,EAAE,EAAE;YAC7B,IAAI,CAAC,WAAW,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAC;QACxD,CAAC,CAAA;QAED,eAAU,GAAG,CAAC,CAAgB,EAAE,EAAE;YACjC,IAAI,CAAC,CAAC,GAAG,IAAI,OAAO,EAAE,CAAC;gBACtB,IAAI,CAAC,WAAW,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAC;YACxD,CAAC;QACF,CAAC,CAAA;QAMD,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;;kBAGF,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,IAAI,EAAE;gBACrC,IAAI,CAAC,QAAQ;cACf,IAAI,CAAC,SAAS;eACb,IAAI,CAAC,UAAU;;EAE5B,CAAC;IAEH,CAAC;IAhCA,KAAK,CAAC,QAAQ;QACb,MAAM,KAAK,CAAC,QAAQ,EAAE,CAAC;QACvB,IAAI,CAAC,IAAI,CAAC,KAAK;YAAE,OAAO;QACxB,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC,EAAE,CAAC;YAClF,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACzC,CAAC;IACF,CAAC;IAYD,OAAO;QACN,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;IACzD,CAAC;;AA7CM,oBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;;;kBAO1B,SAAS,CAAC,uBAAuB;;;;;;;;;;;;;EAajD,CAAC,AApBW,CAoBV;AAGH;IADC,KAAK,CAAC,OAAO,CAAC;4CACS;AAzBZ,aAAa;IADzB,aAAa,CAAC,mBAAmB,CAAC;GACtB,aAAa,CA2DzB","sourcesContent":["import constants from \"../../constants\";\nimport { css, html } from \"lit\";\nimport { customElement, query } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\n\n@customElement('og-form-textinput')\nexport class FormTextInput extends BaseControl<string> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tinput {\n\t\t\tborder: 1px solid var(--og-accent-color);\n\t\t\tbackground-color: var(--og-form-background-color);\n\t\t\tcolor: var(--og-text-color);\n\t\t\tfont-size: var(--og-font-size);\n\t\t\theight: 100%;\n\t\t\tline-height: ${constants.DEFAULT_FORM_ROW_HEIGHT}px;\n\t\t\toutline: none;\n\t\t\twidth: 100%;\n\t\t\tborder-radius: var(--og-base-radius);\n\t\t}\n\n\t\t:host([required]) input {\n\t\t\tborder: none;\n\t\t}\n\n\t\t:host([readOnly]) {\n\t\t\tpointer-events: auto;\n\t\t}\n\t`];\n\n\t@query('input')\n\tinput: HTMLInputElement;\n\n\tasync validate() {\n\t\tawait super.validate();\n\t\tif (!this.model) return;\n\t\tif (this.model.props.pattern && !this.model.props.pattern.test(this.value ?? \"\")) {\n\t\t\tthis.model.errors.push('invalid value');\n\t\t}\n\t}\n\n\t_onChange = (e: InputEvent) => {\n\t\tthis.updateValue((e.target as HTMLInputElement).value);\n\t}\n\n\t_onKeyDown = (e: KeyboardEvent) => {\n\t\tif (e.key == 'Enter') {\n\t\t\tthis.updateValue((e.target as HTMLInputElement).value);\n\t\t}\n\t}\n\n\tupdated() {\n\t\tthis.input.value = this.value == null ? '' : this.value;\n\t}\n\n\trender = () => html`\n\t\t<input\n\t\t\ttype=\"text\"\n\t\t\tplaceholder=\"${this.model?.props.placeholder ?? ''}\"\n\t\t\t?readonly=\"${this.readOnly}\"\n\t\t\t@change=\"${this._onChange}\"\n\t\t\t@keydown=\"${this._onKeyDown}\"\n\t\t>\n\t`;\n\t\n}"]}

package/dist/ui/form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../src/ui/form.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAKjC,OAAO,EAAmB,YAAY,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAO,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAEhE,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAgBvC,qBAAa,SAAU,SAAQ,KAAK;IAEnC,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;gBAEb,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC;CAInD;AAED,qBACa,IAAK,SAAQ,UAAU;IAEnC,MAAM,CAAC,MAAM,4BAAW;IAGxB,GAAG,EAAE,MAAM,GAAC,MAAM,CAAC;IAGnB,OAAO,EAAE,WAAW,CAAC;IAGrB,KAAK,EAAE,SAAS,CAAC;IAGjB,OAAO,EAAE,MAAM,CAAC;IAGhB,YAAY,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAEnC,QAAQ,EAAE,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IAGhC,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAG/B,OAAO,EAAE,OAAO,CAAC;IAGjB,MAAM,EAAE,UAAU,CAAM;IAExB,OAAO,CAAC,WAAW,CAA8B;IAEjD,WAAW,aAAkC;IAC7C,WAAW,oBAA8B;IAEzC,aAAa,CAAC,UAAU,EAAE,YAAY;IAItC,WAAW;IAMX,QAAQ,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO;IAM9B,KAAK;IAKX,QAAQ;IAKR,OAAO;IAQD,WAAW;IAUX,OAAO,CAAC,YAAY,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC;IA+BrD,cAAc,CAAC,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC;IAavC,MAAM,0CA+CJ;CAEF"}
+{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../src/ui/form.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAKjC,OAAO,EAAmB,YAAY,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAO,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAEhE,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAiBvC,qBAAa,SAAU,SAAQ,KAAK;IAEnC,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;gBAEb,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC;CAInD;AAED,qBACa,IAAK,SAAQ,UAAU;IAEnC,MAAM,CAAC,MAAM,4BAAW;IAGxB,GAAG,EAAE,MAAM,GAAC,MAAM,CAAC;IAGnB,OAAO,EAAE,WAAW,CAAC;IAGrB,KAAK,EAAE,SAAS,CAAC;IAGjB,OAAO,EAAE,MAAM,CAAC;IAGhB,YAAY,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAEnC,QAAQ,EAAE,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IAGhC,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAG/B,OAAO,EAAE,OAAO,CAAC;IAGjB,MAAM,EAAE,UAAU,CAAM;IAExB,OAAO,CAAC,WAAW,CAA8B;IAEjD,WAAW,aAAkC;IAC7C,WAAW,oBAA8B;IAEzC,aAAa,CAAC,UAAU,EAAE,YAAY;IAItC,WAAW;IAMX,QAAQ,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO;IAM9B,KAAK;IAKX,QAAQ;IAKR,OAAO;IAQD,WAAW;IAUX,OAAO,CAAC,YAAY,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC;IA+BrD,cAAc,CAAC,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC;IAavC,MAAM,0CA+CJ;CAEF"}

package/dist/ui/form.js

@@ -17,6 +17,7 @@ import { msg } from '@omegagrid/localize';
 const controlTypeMap = new Map([
     [FormControlType.Label, literal `og-form-label`],
     [FormControlType.TextInput, literal `og-form-textinput`],
+    [FormControlType.PasswordInput, literal `og-form-passwordinput`],
     [FormControlType.ColorInput, literal `og-form-colorinput`],
     [FormControlType.Checkbox, literal `og-form-checkbox`],
     [FormControlType.List, literal `og-form-list`],

package/dist/ui/form.js.map

@@ -1 +1 @@
-{"version":3,"file":"form.js","sourceRoot":"","sources":["../../src/ui/form.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAe,MAAM,oBAAoB,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAC5C,OAAO,EAAE,eAAe,EAA4B,MAAM,UAAU,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,GAAG,EAAW,MAAM,iBAAiB,CAAC;AAE/C,OAAO,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAErC,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,MAAM,cAAc,GAAG,IAAI,GAAG,CAA+B;IAC5D,CAAC,eAAe,CAAC,KAAK,EAAE,OAAO,CAAA,eAAe,CAAC;IAC/C,CAAC,eAAe,CAAC,SAAS,EAAE,OAAO,CAAA,mBAAmB,CAAC;IACvD,CAAC,eAAe,CAAC,UAAU,EAAE,OAAO,CAAA,oBAAoB,CAAC;IACzD,CAAC,eAAe,CAAC,QAAQ,EAAE,OAAO,CAAA,kBAAkB,CAAC;IACrD,CAAC,eAAe,CAAC,IAAI,EAAE,OAAO,CAAA,cAAc,CAAC;IAC7C,CAAC,eAAe,CAAC,MAAM,EAAE,OAAO,CAAA,gBAAgB,CAAC;IACjD,CAAC,eAAe,CAAC,YAAY,EAAE,OAAO,CAAA,sBAAsB,CAAC;IAC7D,CAAC,eAAe,CAAC,SAAS,EAAE,OAAO,CAAA,mBAAmB,CAAC;IACvD,CAAC,eAAe,CAAC,SAAS,EAAE,OAAO,CAAA,mBAAmB,CAAC;IACvD,CAAC,eAAe,CAAC,iBAAiB,EAAE,OAAO,CAAA,2BAA2B,CAAC;CACvE,CAAC,CAAC;AAEH,MAAM,OAAO,SAAU,SAAQ,KAAK;IAMnC,YAAY,IAAY,EAAE,IAAyB;QAClD,KAAK,CAAC,QAAQ,IAAI,EAAE,EAAE,EAAC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAC,CAAC,CAAC;QACzE,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,IAAI,EAAE,CAAC,CAAC;IACjC,CAAC;CACD;AAGM,IAAM,IAAI,GAAV,MAAM,IAAK,SAAQ,UAAU;IAA7B;;QA4BN,WAAM,GAAe,EAAE,CAAC;QAEhB,gBAAW,GAA2B,EAAE,CAAC;QAEjD,gBAAW,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;QAC7C,gBAAW,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,CAAC;QA0FzC,WAAM,GAAG,GAAG,EAAE;YACb,MAAM,OAAO,GAAG,IAAI,CAAA,yCAAyC,CAAC;YAC9D,IAAI,CAAC,IAAI,CAAC,KAAK;gBAAE,OAAO,OAAO,CAAC;YAChC,MAAM,OAAO,GAAG,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,MAAM,CAAC,EAAE;gBAChD,MAAM,QAAQ,GAAG,QAAQ,CAAC,EAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,EAAC,CAAC,CAAC;gBAC3F,OAAO,IAAI,CAAA,eAAe,QAAQ,IAAI,CAAC;YACxC,CAAC,CAAC,CAAC;YAEH,MAAM,IAAI,GAAG,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE;gBAChD,MAAM,SAAS,GAAG,QAAQ,CAAC;oBAC1B,MAAM,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM;wBAC1E,CAAC,CAAC,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;iBACrD,CAAC,CAAC;gBACH,OAAO,IAAI,CAAA;;OAEP,GAAG,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,IAAI,CAAA;oBACb,OAAO,EAAE,KAAK,CAAC,EAAE,IAAI,CAAC,cAAc,OAAO,EAAE,KAAK,CAAC,EAAE,IAAI,CAAC,YAAY,SAAS;QAC3F,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA;UACZ,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC;cAClC,OAAO,CAAC,KAAK,CAAC,GAAG;kBACb,IAAI,CAAC,cAAc;;kBAEnB,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK;kBAC5G,OAAO;sBACH,IAAI,CAAC,KAAK;oBACZ,OAAO,CAAC,KAAK,CAAC,OAAO,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW;WAChE,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC;SACxC,GAAG,CAAC,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA;6BACX,GAAG,CAAC,GAAG,CAAC;QAC7B,CAAC;OACF,CAAC,CAAC,CAAC,EAAE;;MAEN,CAAC;;IAEH,CAAA;YACF,CAAC,CAAC,CAAC;YAEH,OAAO,IAAI,CAAA;KACR,OAAO;KACP,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA,sBAAsB,IAAI,CAAC,OAAO,QAAQ,CAAC,CAAC,CAAC,EAAE;uBAChD,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA;;iBAEvB,OAAO;cACV,IAAI;;IAEd,CAAC,CAAC,CAAC,EAAE;GACN,CAAC;QACH,CAAC,CAAC;IAEH,CAAC;IAzIA,aAAa,CAAC,UAAwB;QACrC,IAAI,CAAC,KAAK,GAAG,IAAI,SAAS,CAAC,UAAU,CAAC,CAAC;IACxC,CAAC;IAED,WAAW;QACV,MAAM,MAAM,GAAe,EAAE,CAAA;QAC7B,IAAI,CAAC,KAAK,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QACnE,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;IACtB,CAAC;IAED,QAAQ,CAAC,GAAW,EAAE,KAAc;QACnC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;QACzB,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,IAAI,GAAG,EAAE,CAAwB,CAAC;QAChF,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC;IACvB,CAAC;IAED,KAAK,CAAC,KAAK;QACV,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAC5C,CAAC;IAED,QAAQ;QACP,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;QACzC,IAAI,CAAC,aAAa,EAAE,CAAC;IACtB,CAAC;IAED,OAAO;QACN,IAAI,CAAC,QAAQ,EAAE,CAAC;QAChB,KAAK,MAAM,CAAC,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACnC,IAAI,CAAC,CAAC,CAAC,OAAO;gBAAE,OAAO,KAAK,CAAC;QAC9B,CAAC;QACD,OAAO,IAAI,CAAC;IACb,CAAC;IAED,KAAK,CAAC,WAAW;QAChB,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,CAAC,KAAK,GAAG,IAAI,SAAS,CAAC;YAC1B,IAAI,EAAE,MAAM,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;YAC1C,OAAO,EAAE,MAAM,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC;YAChD,QAAQ,EAAE,MAAM,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC;SAClD,CAAC,CAAC;QACH,IAAI,CAAC,WAAW,EAAE,CAAC;IACpB,CAAC;IAED,KAAK,CAAC,OAAO,CAAC,YAAuC;QACpD,IAAI,YAAY,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC;YACjC,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;YAC3B,MAAM,IAAI,CAAC,WAAW,EAAE,CAAC;QAC1B,CAAC;QAED,IAAI,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;YAC/B,IAAI,CAAC,WAAW,EAAE,CAAC;QACpB,CAAC;QAED,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;QAC3D,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,CAAC,EAAE,EAAE;YACnE,MAAM,EAAE,GAAG,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,CAAC;YACjC,MAAM,EAAE,GAAG,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,CAAC;YACjC,IAAI,EAAE,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,EAAE,CAAC;gBACtB,KAAK,IAAI,EAAE,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC;oBACzC,KAAK,IAAI,EAAE,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC;wBACzC,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAyB,CAAC;wBACnE,IAAI,IAAI,EAAE,CAAC;4BACV,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC;gCAAE,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;;gCACtC,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;wBACzB,CAAC;oBACF,CAAC;gBACF,CAAC;YACF,CAAC;iBAAM,CAAC;gBACP,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAyB,CAAC,CAAC;YACnE,CAAC;QACF,CAAC,CAAC,CAAC,CAAC;IACL,CAAC;IAED,cAAc,CAAC,CAAwB;QACtC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC;QACnC,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC;YAC5D,IAAI,CAAC,aAAa,EAAE,CAAC;QACtB,CAAC;QACD,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC;QACtD,IAAI,CAAC,aAAa,CAAC,IAAI,SAAS,CAAC,QAAQ,EAAE;YAC1C,GAAG,EAAE,CAAC,CAAC,KAAK,CAAC,GAAG;YAChB,KAAK,EAAE,CAAC,CAAC,KAAK;YACd,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,IAAI,CAAC;SACjC,CAAC,CAAC,CAAC;IACL,CAAC;;AAvHM,WAAM,GAAG,CAAC,KAAK,CAAC,AAAV,CAAW;AAGxB;IADC,QAAQ,EAAE;iCACQ;AAGnB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;qCACJ;AAGrB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;mCACR;AAGjB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;qCACT;AAGhB;IADC,QAAQ,CAAC,UAAU,CAAC;0CACc;AAKnC;IADC,QAAQ,CAAC,MAAM,CAAC;qCACc;AAG/B;IADC,KAAK,CAAC,YAAY,CAAC;qCACH;AAGjB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;oCACD;AA5BZ,IAAI;IADhB,aAAa,CAAC,SAAS,CAAC;GACZ,IAAI,CA4KhB","sourcesContent":["import { LitElement } from \"lit\";\nimport { literal, html, StaticValue } from 'lit/static-html.js';\nimport { customElement, property, query, queryAll } from \"lit/decorators.js\";\nimport { styleMap } from \"lit/directives/style-map.js\";\nimport { map } from \"lit/directives/map.js\";\nimport { FormControlType, FormSettings, FormValues } from \"../types\";\nimport { FormModel } from \"../model/formModel\";\nimport { dom, Overlay } from '@omegagrid/core';\nimport { IControl, ControlEvent } from \"./controls/baseControl\";\nimport { style } from './form.style';\nimport { FormAdapter } from \"../model\";\nimport { msg } from '@omegagrid/localize';\n\nconst controlTypeMap = new Map<FormControlType, StaticValue>([\n\t[FormControlType.Label, literal`og-form-label`],\n\t[FormControlType.TextInput, literal`og-form-textinput`],\n\t[FormControlType.ColorInput, literal`og-form-colorinput`],\n\t[FormControlType.Checkbox, literal`og-form-checkbox`],\n\t[FormControlType.List, literal`og-form-list`],\n\t[FormControlType.Button, literal`og-form-button`],\n\t[FormControlType.NumericInput, literal`og-form-numericinput`],\n\t[FormControlType.FileInput, literal`og-form-fileinput`],\n\t[FormControlType.DateInput, literal`og-form-dateinput`],\n\t[FormControlType.CalendarDateInput, literal`og-form-calendardateinput`],\n]);\n\nexport class FormEvent extends Event {\n\n\treadonly key: string;\n\treadonly value: unknown;\n\treadonly valid?: boolean;\n\n\tconstructor(type: string, args?: Partial<FormEvent>) {\n\t\tsuper(`form.${type}`, {bubbles: true, cancelable: true, composed: true});\n\t\tObject.assign(this, args || {});\n\t}\n}\n\n@customElement('og-form')\nexport class Form extends LitElement {\n\n\tstatic styles = [style];\n\n\t@property()\n\tkey: string|number;\n\n\t@property({type: Object})\n\tadapter: FormAdapter;\n\n\t@property({type: Object})\n\tmodel: FormModel;\n\n\t@property({type: String})\n\tcaption: string;\n\n\t@queryAll('.control')\n\tcontrolNodes: NodeListOf<IControl>;\n\n\tcontrols: Map<string, IControl>;\n\n\t@queryAll('.row')\n\trowElms: HTMLTableRowElement[];\n\n\t@query('og-overlay')\n\toverlay: Overlay;\n\n\t@property({type: Object})\n\tvalues: FormValues = {};\n\n\tprivate errorCounts: Record<string, number> = {};\n\n\tshowOverlay = () => this.overlay?.show(this);\n\thideOverlay = () => this.overlay?.hide();\n\t\n\tsetSourceData(sourceData: FormSettings) {\n\t\tthis.model = new FormModel(sourceData);\n\t}\n\n\tresetValues() {\n\t\tconst values: FormValues = {}\n\t\tthis.model?.controlMap.forEach(c => values[c.key] = c.props.value);\n\t\tthis.values = values;\n\t}\n\n\tsetValue(key: string, value: unknown) {\n\t\tthis.values[key] = value;\n\t\tconst control = this.shadowRoot.querySelector(`#${key}`) as unknown as IControl;\n\t\tcontrol.value = value;\n\t}\n\n\tasync reset() {\n\t\tthis.resetValues();\n\t\tthis.controls.forEach(c => c.reset(false));\n\t}\n\t\n\tvalidate() {\n\t\tthis.controls.forEach(c => c.validate());\n\t\tthis.requestUpdate();\n\t}\n\n\tisValid() {\n\t\tthis.validate();\n\t\tfor (const c of this.controlNodes) {\n\t\t\tif (!c.isValid) return false;\n\t\t}\n\t\treturn true;\n\t}\n\n\tasync initAdapter() {\n\t\tthis.showOverlay();\n\t\tthis.model = new FormModel({\n\t\t\trows: await this.adapter.getRows(this.key),\n\t\t\tcolumns: await this.adapter.getColumns(this.key),\n\t\t\tcontrols: await this.adapter.getControls(this.key)\n\t\t});\n\t\tthis.hideOverlay();\n\t}\n\n\tasync updated(changedProps: Map<PropertyKey, unknown>) {\n\t\tif (changedProps.has('adapter')) {\n\t\t\tthis.adapter?.attach(this);\n\t\t\tawait this.initAdapter();\n\t\t}\n\n\t\tif (changedProps.has('model')) {\n\t\t\tthis.resetValues();\n\t\t}\n\n\t\tthis.controls = new Map();\n\t\tthis.controlNodes.forEach(c => this.controls.set(c.id, c));\n\t\tthis.model?.controls.forEach((row, r) => row.forEach((control, c) => {\n\t\t\tconst cs = control.props.cs || 1;\n\t\t\tconst rs = control.props.rs || 1;\n\t\t\tif (cs > 1 || rs > 1) {\n\t\t\t\tfor (let ri = r; ri <= r + rs - 1; ri++) {\n\t\t\t\t\tfor (let ci = c; ci <= c + cs - 1; ci++) {\n\t\t\t\t\t\tconst cell = this.rowElms[ri].children[ci] as HTMLTableCellElement;\n\t\t\t\t\t\tif (cell) {\n\t\t\t\t\t\t\tif (ci != c || ri != r) dom.hideCell(cell);\n\t\t\t\t\t\t\telse dom.showCell(cell);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tdom.showCell(this.rowElms[r].children[c] as HTMLTableCellElement);\n\t\t\t}\n\t\t}));\n\t}\n\n\t_onValueChange(e: ControlEvent<unknown>) {\n\t\tthis.values[e.model.key] = e.value;\n\t\tif (this.errorCounts[e.model.key] != e.model.errors.length) {\n\t\t\tthis.requestUpdate();\n\t\t}\n\t\tthis.errorCounts[e.model.key] = e.model.errors.length;\n\t\tthis.dispatchEvent(new FormEvent('change', {\n\t\t\tkey: e.model.key, \n\t\t\tvalue: e.value,\n\t\t\tvalid: e.model.errors.length == 0\n\t\t}));\n\t}\n\n\trender = () => {\n\t\tconst overlay = html`<og-overlay defaultLoader></og-overlay>`;\n\t\tif (!this.model) return overlay;\n\t\tconst columns = map(this.model.columns, column => { \n\t\t\tconst colStyle = styleMap({width: column?.width ? dom.numToPixels(column.width) : 'auto'});\n\t\t\treturn html`<col style=\"${colStyle}\">`; \n\t\t});\n\n\t\tconst rows = map(this.model.controls, (row, r) => {\n\t\t\tconst cellStyle = styleMap({\n\t\t\t\theight: (this.model.rows && this.model.rows[r] && this.model.rows[r].height \n\t\t\t\t\t? dom.numToPixels(this.model.rows[r].height) : null)\n\t\t\t});\n\t\t\treturn html`\n\t\t\t\t<tr class=\"row\">\n\t\t\t\t\t${map(row, (control) => html`\n\t\t\t\t\t<td colspan=\"${control?.props.cs || 1}\" rowspan=\"${control?.props.rs || 1}\" style=\"${cellStyle}\">\n\t\t\t\t\t\t${control ? html`\n\t\t\t\t\t\t\t<${controlTypeMap.get(control.props.type)}\n\t\t\t\t\t\t\t\tid=\"${control.props.key}\"\n\t\t\t\t\t\t\t\t@change=${this._onValueChange}\n\t\t\t\t\t\t\t\tclass=\"control\"\n\t\t\t\t\t\t\t\t.value=\"${this.values && this.values[control.props.key] != null ? this.values[control.props.key] : control.props.value}\"\n\t\t\t\t\t\t\t\t.model=\"${control}\"\n\t\t\t\t\t\t\t\t.formModel=\"${this.model}\"\n\t\t\t\t\t\t\t\t.adapter=\"${control.props.adapter || this.model.options.treeAdapter}\">\n\t\t\t\t\t\t\t</${controlTypeMap.get(control.props.type)}>\n\t\t\t\t\t\t\t${map(control.errors, err => html`\n\t\t\t\t\t\t\t\t<div class=\"error\">${msg(err)}</div>\n\t\t\t\t\t\t\t`)}\n\t\t\t\t\t\t` : ``}\n\t\t\t\t\t</td>\n\t\t\t\t\t`)}\n\t\t\t\t</tr>\n\t\t\t`\n\t\t});\n\n\t\treturn html`\n\t\t\t${overlay}\n\t\t\t${this.caption ? html`<div class=\"title\">${this.caption}</div>` : ``}\n\t\t\t<div class=\"body\">${this.model ? html`\n\t\t\t\t<table>\n\t\t\t\t\t<colgroup>${columns}</colgroup>\n\t\t\t\t\t<tbody>${rows}</tbody>\n\t\t\t\t</table>\n\t\t\t` : ``}</div>\n\t\t`;\n\t};\n\n}"]}
+{"version":3,"file":"form.js","sourceRoot":"","sources":["../../src/ui/form.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement } from \"lit\";\nimport { literal, html, StaticValue } from 'lit/static-html.js';\nimport { customElement, property, query, queryAll } from \"lit/decorators.js\";\nimport { styleMap } from \"lit/directives/style-map.js\";\nimport { map } from \"lit/directives/map.js\";\nimport { FormControlType, FormSettings, FormValues } from \"../types\";\nimport { FormModel } from \"../model/formModel\";\nimport { dom, Overlay } from '@omegagrid/core';\nimport { IControl, ControlEvent } from \"./controls/baseControl\";\nimport { style } from './form.style';\nimport { FormAdapter } from \"../model\";\nimport { msg } from '@omegagrid/localize';\n\nconst controlTypeMap = new Map<FormControlType, StaticValue>([\n\t[FormControlType.Label, literal`og-form-label`],\n\t[FormControlType.TextInput, literal`og-form-textinput`],\n\t[FormControlType.PasswordInput, literal`og-form-passwordinput`],\n\t[FormControlType.ColorInput, literal`og-form-colorinput`],\n\t[FormControlType.Checkbox, literal`og-form-checkbox`],\n\t[FormControlType.List, literal`og-form-list`],\n\t[FormControlType.Button, literal`og-form-button`],\n\t[FormControlType.NumericInput, literal`og-form-numericinput`],\n\t[FormControlType.FileInput, literal`og-form-fileinput`],\n\t[FormControlType.DateInput, literal`og-form-dateinput`],\n\t[FormControlType.CalendarDateInput, literal`og-form-calendardateinput`],\n]);\n\nexport class FormEvent extends Event {\n\n\treadonly key: string;\n\treadonly value: unknown;\n\treadonly valid?: boolean;\n\n\tconstructor(type: string, args?: Partial<FormEvent>) {\n\t\tsuper(`form.${type}`, {bubbles: true, cancelable: true, composed: true});\n\t\tObject.assign(this, args || {});\n\t}\n}\n\n@customElement('og-form')\nexport class Form extends LitElement {\n\n\tstatic styles = [style];\n\n\t@property()\n\tkey: string|number;\n\n\t@property({type: Object})\n\tadapter: FormAdapter;\n\n\t@property({type: Object})\n\tmodel: FormModel;\n\n\t@property({type: String})\n\tcaption: string;\n\n\t@queryAll('.control')\n\tcontrolNodes: NodeListOf<IControl>;\n\n\tcontrols: Map<string, IControl>;\n\n\t@queryAll('.row')\n\trowElms: HTMLTableRowElement[];\n\n\t@query('og-overlay')\n\toverlay: Overlay;\n\n\t@property({type: Object})\n\tvalues: FormValues = {};\n\n\tprivate errorCounts: Record<string, number> = {};\n\n\tshowOverlay = () => this.overlay?.show(this);\n\thideOverlay = () => this.overlay?.hide();\n\t\n\tsetSourceData(sourceData: FormSettings) {\n\t\tthis.model = new FormModel(sourceData);\n\t}\n\n\tresetValues() {\n\t\tconst values: FormValues = {}\n\t\tthis.model?.controlMap.forEach(c => values[c.key] = c.props.value);\n\t\tthis.values = values;\n\t}\n\n\tsetValue(key: string, value: unknown) {\n\t\tthis.values[key] = value;\n\t\tconst control = this.shadowRoot.querySelector(`#${key}`) as unknown as IControl;\n\t\tcontrol.value = value;\n\t}\n\n\tasync reset() {\n\t\tthis.resetValues();\n\t\tthis.controls.forEach(c => c.reset(false));\n\t}\n\t\n\tvalidate() {\n\t\tthis.controls.forEach(c => c.validate());\n\t\tthis.requestUpdate();\n\t}\n\n\tisValid() {\n\t\tthis.validate();\n\t\tfor (const c of this.controlNodes) {\n\t\t\tif (!c.isValid) return false;\n\t\t}\n\t\treturn true;\n\t}\n\n\tasync initAdapter() {\n\t\tthis.showOverlay();\n\t\tthis.model = new FormModel({\n\t\t\trows: await this.adapter.getRows(this.key),\n\t\t\tcolumns: await this.adapter.getColumns(this.key),\n\t\t\tcontrols: await this.adapter.getControls(this.key)\n\t\t});\n\t\tthis.hideOverlay();\n\t}\n\n\tasync updated(changedProps: Map<PropertyKey, unknown>) {\n\t\tif (changedProps.has('adapter')) {\n\t\t\tthis.adapter?.attach(this);\n\t\t\tawait this.initAdapter();\n\t\t}\n\n\t\tif (changedProps.has('model')) {\n\t\t\tthis.resetValues();\n\t\t}\n\n\t\tthis.controls = new Map();\n\t\tthis.controlNodes.forEach(c => this.controls.set(c.id, c));\n\t\tthis.model?.controls.forEach((row, r) => row.forEach((control, c) => {\n\t\t\tconst cs = control.props.cs || 1;\n\t\t\tconst rs = control.props.rs || 1;\n\t\t\tif (cs > 1 || rs > 1) {\n\t\t\t\tfor (let ri = r; ri <= r + rs - 1; ri++) {\n\t\t\t\t\tfor (let ci = c; ci <= c + cs - 1; ci++) {\n\t\t\t\t\t\tconst cell = this.rowElms[ri].children[ci] as HTMLTableCellElement;\n\t\t\t\t\t\tif (cell) {\n\t\t\t\t\t\t\tif (ci != c || ri != r) dom.hideCell(cell);\n\t\t\t\t\t\t\telse dom.showCell(cell);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tdom.showCell(this.rowElms[r].children[c] as HTMLTableCellElement);\n\t\t\t}\n\t\t}));\n\t}\n\n\t_onValueChange(e: ControlEvent<unknown>) {\n\t\tthis.values[e.model.key] = e.value;\n\t\tif (this.errorCounts[e.model.key] != e.model.errors.length) {\n\t\t\tthis.requestUpdate();\n\t\t}\n\t\tthis.errorCounts[e.model.key] = e.model.errors.length;\n\t\tthis.dispatchEvent(new FormEvent('change', {\n\t\t\tkey: e.model.key, \n\t\t\tvalue: e.value,\n\t\t\tvalid: e.model.errors.length == 0\n\t\t}));\n\t}\n\n\trender = () => {\n\t\tconst overlay = html`<og-overlay defaultLoader></og-overlay>`;\n\t\tif (!this.model) return overlay;\n\t\tconst columns = map(this.model.columns, column => { \n\t\t\tconst colStyle = styleMap({width: column?.width ? dom.numToPixels(column.width) : 'auto'});\n\t\t\treturn html`<col style=\"${colStyle}\">`; \n\t\t});\n\n\t\tconst rows = map(this.model.controls, (row, r) => {\n\t\t\tconst cellStyle = styleMap({\n\t\t\t\theight: (this.model.rows && this.model.rows[r] && this.model.rows[r].height \n\t\t\t\t\t? dom.numToPixels(this.model.rows[r].height) : null)\n\t\t\t});\n\t\t\treturn html`\n\t\t\t\t<tr class=\"row\">\n\t\t\t\t\t${map(row, (control) => html`\n\t\t\t\t\t<td colspan=\"${control?.props.cs || 1}\" rowspan=\"${control?.props.rs || 1}\" style=\"${cellStyle}\">\n\t\t\t\t\t\t${control ? html`\n\t\t\t\t\t\t\t<${controlTypeMap.get(control.props.type)}\n\t\t\t\t\t\t\t\tid=\"${control.props.key}\"\n\t\t\t\t\t\t\t\t@change=${this._onValueChange}\n\t\t\t\t\t\t\t\tclass=\"control\"\n\t\t\t\t\t\t\t\t.value=\"${this.values && this.values[control.props.key] != null ? this.values[control.props.key] : control.props.value}\"\n\t\t\t\t\t\t\t\t.model=\"${control}\"\n\t\t\t\t\t\t\t\t.formModel=\"${this.model}\"\n\t\t\t\t\t\t\t\t.adapter=\"${control.props.adapter || this.model.options.treeAdapter}\">\n\t\t\t\t\t\t\t</${controlTypeMap.get(control.props.type)}>\n\t\t\t\t\t\t\t${map(control.errors, err => html`\n\t\t\t\t\t\t\t\t<div class=\"error\">${msg(err)}</div>\n\t\t\t\t\t\t\t`)}\n\t\t\t\t\t\t` : ``}\n\t\t\t\t\t</td>\n\t\t\t\t\t`)}\n\t\t\t\t</tr>\n\t\t\t`\n\t\t});\n\n\t\treturn html`\n\t\t\t${overlay}\n\t\t\t${this.caption ? html`<div class=\"title\">${this.caption}</div>` : ``}\n\t\t\t<div class=\"body\">${this.model ? html`\n\t\t\t\t<table>\n\t\t\t\t\t<colgroup>${columns}</colgroup>\n\t\t\t\t\t<tbody>${rows}</tbody>\n\t\t\t\t</table>\n\t\t\t` : ``}</div>\n\t\t`;\n\t};\n\n}"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omegagrid/form",
-  "version": "0.10.24",
+  "version": "0.10.25",
   "license": "UNLICENSED",
   "description": "Universal form component",
   "main": "./dist/index.js",
@@ -27,10 +27,10 @@
     "_prepublish": "yarn test && yarn lint"
   },
   "dependencies": {
-    "@omegagrid/calendar": "^0.10.24",
-    "@omegagrid/core": "^0.10.24",
-    "@omegagrid/localize": "^0.10.24",
-    "@omegagrid/tree": "^0.10.24",
+    "@omegagrid/calendar": "^0.10.25",
+    "@omegagrid/core": "^0.10.25",
+    "@omegagrid/localize": "^0.10.25",
+    "@omegagrid/tree": "^0.10.25",
     "lit": "^3.1.1",
     "lit-html": "^3.1.1",
     "ts-debounce": "^4.0.0"