formeo 5.1.1 → 5.1.2

package/dist/demo/assets/js/formeo.umd.js

@@ -1,7 +1,7 @@
 
 /**
 formeo - https://formeo.io
-Version: 5.1.0
+Version: 5.1.1
 Author: Draggable https://draggable.io
 */
 
@@ -74,7 +74,7 @@ Author: Draggable https://draggable.io
 			allowSelect: "Laat Kies toe",
 			and: "en",
 			attribute: "kenmerk",
-			attributeNotPermitted: `Attribuut "{attribuut}" is nie toegelaat nie, kies asseblief 'n ander.`,
+			attributeNotPermitted: "Attribuut \"{attribuut}\" is nie toegelaat nie, kies asseblief 'n ander.",
 			attributes: "eienskappe",
 			"attrs.class": "klas",
 			"attrs.className": "klas",
@@ -2127,7 +2127,7 @@ Author: Draggable https://draggable.io
 			"row.makeInputGroup": "Définir cette ligne comme groupe de saisie.",
 			"row.makeInputGroupDesc": "Les groupes de saisie permettent aux usagers de rajouter de multiples champs à la fois.",
 			"row.settings.fieldsetWrap": "Entourer le champ d'un élément <fieldset>",
-			"row.settings.fieldsetWrap.aria": `Entourer le champ d'un "Fieldset"`,
+			"row.settings.fieldsetWrap.aria": "Entourer le champ d'un \"Fieldset\"",
 			save: "Sauvegarder",
 			secondary: "Secondaire",
 			select: "Sélection",
@@ -2902,7 +2902,7 @@ Author: Draggable https://draggable.io
 			allowSelect: "Consenti selezione",
 			and: "e",
 			attribute: "Attributo",
-			attributeNotPermitted: `L'attributo "{attribute}" non è permesso, per favore sceglierne un altro.`,
+			attributeNotPermitted: "L'attributo \"{attribute}\" non è permesso, per favore sceglierne un altro.",
 			attributes: "attributi",
 			"attrs.class": "Classe",
 			"attrs.className": "Classe",
@@ -5711,10 +5711,10 @@ Author: Draggable https://draggable.io
 	//#region node_modules/@draggable/formeo-languages/dist/formeo-languages.es.js
 	/**
 	@draggable/formeo-languages - https://github.com/Draggable/formeo-languages#readme
-	Version: 3.4.1
+	Version: 3.5.0
 	Author: Kevin Chappell <kevin.b.chappell@gmail.com> (https://kevin-chappell.com)
 	*/
-	var i = e$1["en-US"];
+	var s$1 = e$1["en-US"];
 	e$1["es-ES"];
 	e$1["fa-IR"];
 	e$1["fi-FI"];
@@ -6064,7 +6064,7 @@ Author: Draggable https://draggable.io
 	var name$1, version$2, type, main, module$1, unpkg, exports$1, files, homepage, repository, author, contributors, bugs, description, keywords, ignore, config, scripts, devDependencies, dependencies, release, commitlint, package_default;
 	var init_package = __esmMin((() => {
 		name$1 = "formeo";
-		version$2 = "5.1.0";
+		version$2 = "5.1.1";
 		type = "module";
 		main = "dist/formeo.cjs.js";
 		module$1 = "dist/formeo.es.js";
@@ -10070,7 +10070,7 @@ Author: Draggable https://draggable.io
 		}, _typeof(o);
 	}
 	function userAgent(pattern) {
-		if (typeof window !== "undefined" && window.navigator) return !!/* @__PURE__ */ navigator.userAgent.match(pattern);
+		if (typeof window !== "undefined" && window.navigator) return !!/*@__PURE__*/ navigator.userAgent.match(pattern);
 	}
 	function on(el, event, fn) {
 		el.addEventListener(event, fn, !IE11OrLess && captureMode);
@@ -17900,7 +17900,7 @@ Author: Draggable https://draggable.io
 				fetchIcons(this.opts.svgSprite),
 				fetchFormeoStyle(this.opts.style),
 				s.init({
-					preloaded: { "en-US": i },
+					preloaded: { "en-US": s$1 },
 					...this.opts.i18n,
 					locale: globalThis.sessionStorage?.getItem(SESSION_LOCALE_KEY)
 				})
@@ -18076,20 +18076,56 @@ Author: Draggable https://draggable.io
 	};
 	var isVisible = (elem) => {
 		if (!elem) return false;
-		if (elem.hasAttribute("hidden") || elem.parentElement.hasAttribute("hidden")) return false;
+		if (elem.hasAttribute("hidden") || elem.parentElement?.hasAttribute("hidden")) return false;
 		const computedStyle = window.getComputedStyle(elem);
 		return !(computedStyle.display === "none" || computedStyle.visibility === "hidden" || computedStyle.opacity === "0");
 	};
+	var CHECKABLE_INPUT_SELECTOR = "input[type=\"checkbox\"], input[type=\"radio\"]";
+	var CHECKABLE_TYPES = new Set(["checkbox", "radio"]);
+	var tagName$1 = (elem) => elem?.tagName?.toLowerCase();
+	var isCheckableInput = (elem) => tagName$1(elem) === "input" && CHECKABLE_TYPES.has(elem.type);
+	/**
+	* Radio and checkbox fields render as a wrapper holding one input per option, so a
+	* field address resolves to the wrapper rather than to anything carrying a value.
+	* @param  {Element} elem
+	* @return {Array<Element>|null} option inputs, or null when elem is not a group
+	*/
+	var checkableGroupInputs = (elem) => {
+		if (!elem || isCheckableInput(elem) || typeof elem.querySelectorAll !== "function") return null;
+		const inputs = elem.querySelectorAll(CHECKABLE_INPUT_SELECTOR);
+		return inputs.length ? Array.from(inputs) : null;
+	};
+	var isCheckableGroup = (elem) => Boolean(checkableGroupInputs(elem));
+	/**
+	* Value a condition compares against. Controls that can hold several values at once
+	* yield an array so that a single selection still matches an `equals` comparison.
+	* @param  {Element} elem
+	* @return {String|Array<String>|undefined}
+	*/
+	var elementValue = (elem) => {
+		if (!elem) return;
+		const groupInputs = checkableGroupInputs(elem);
+		if (groupInputs) {
+			const checkedValues = groupInputs.filter((input) => input.checked).map((input) => input.value);
+			return groupInputs.every((input) => input.type === "radio") ? checkedValues[0] ?? "" : checkedValues;
+		}
+		if (tagName$1(elem) === "select" && elem.multiple) return Array.from(elem.selectedOptions, (option) => option.value);
+		if (isCheckableInput(elem)) return elem.checked ? elem.value : "";
+		return elem.value;
+	};
+	var isChecked = (elem) => {
+		const groupInputs = checkableGroupInputs(elem);
+		return groupInputs ? groupInputs.some((input) => input.checked) : Boolean(elem?.checked);
+	};
 	var propertyMap = {
 		isChecked: (elem) => {
-			return elem.checked;
+			return isChecked(elem);
 		},
 		isNotChecked: (elem) => {
-			return !elem.checked;
-		},
-		value: (elem) => {
-			return elem.value;
+			return !isChecked(elem);
 		},
+		value: elementValue,
+		checked: elementValue,
 		isVisible: (elem) => {
 			return isVisible(elem);
 		},
@@ -18106,11 +18142,16 @@ Author: Draggable https://draggable.io
 			click: ({ target }) => target.parentElement.remove()
 		}
 	});
+	var equals = (source, target) => Array.isArray(source) ? source.some((value) => (0, import_isEqual.default)(value, target)) : (0, import_isEqual.default)(source, target);
+	var contains = (source, target) => {
+		if (source == null) return false;
+		return Array.isArray(source) ? source.includes(target) : String(source).includes(target);
+	};
 	var comparisonHandlers = {
-		equals: import_isEqual.default,
-		notEquals: (source, target) => !(0, import_isEqual.default)(source, target),
-		contains: (source, target) => source.includes(target),
-		notContains: (source, target) => !source.includes(target)
+		equals,
+		notEquals: (source, target) => !equals(source, target),
+		contains,
+		notContains: (source, target) => !contains(source, target)
 	};
 	var comparisonMap = Object.entries(COMPARISON_OPERATORS).reduce((acc, [key, value]) => {
 		acc[value] = comparisonHandlers[key];
@@ -18378,7 +18419,8 @@ Author: Draggable https://draggable.io
 		* @return {Array} flattened array of conditions
 		*/
 		handleComponentCondition = (component, ifRest, thenConditions) => {
-			if (component.length) {
+			if (!component) return;
+			if (isNodeCollection(component)) {
 				for (const elem of component) this.handleComponentCondition(elem, ifRest, thenConditions);
 				return;
 			}
@@ -18390,23 +18432,25 @@ Author: Draggable https://draggable.io
 			if (this.evaluateCondition(ifRest, fakeEvt)) for (const thenCondition of thenConditions) this.execResult(thenCondition, fakeEvt);
 		};
 		applyConditions = () => {
-			for (const { conditions } of Object.values(this.components)) if (conditions) for (const condition of conditions) {
-				const { if: ifConditions, then: thenConditions } = condition;
-				for (const ifCondition of ifConditions) {
-					const { source, target } = ifCondition;
-					if (isAddress(source)) {
-						const { component, options } = this.getComponent(source);
-						const sourceComponent = options || component;
-						this.handleComponentCondition(sourceComponent, ifCondition, thenConditions);
-					}
-					if (isAddress(target)) {
-						const { component, options } = this.getComponent(target);
-						const targetComponent = options || component;
-						this.handleComponentCondition(targetComponent, ifCondition, thenConditions);
+			for (const { conditions } of Object.values(this.components)) {
+				if (!conditions) continue;
+				for (const condition of conditions) {
+					const { if: ifConditions = [], then: thenConditions = [] } = condition;
+					for (const ifCondition of ifConditions) try {
+						this.applyCondition(ifCondition, thenConditions);
+					} catch (err) {
+						console.error("formeo: condition skipped", ifCondition, err);
 					}
 				}
 			}
 		};
+		applyCondition = (ifCondition, thenConditions) => {
+			for (const address of [ifCondition.source, ifCondition.target]) {
+				if (!isAddress(address)) continue;
+				const { component, options } = this.getComponent(address);
+				this.handleComponentCondition(options || component, ifCondition, thenConditions);
+			}
+		};
 		/**
 		* Evaulate conditions
 		*/
@@ -18428,9 +18472,10 @@ Author: Draggable https://draggable.io
 			}
 		};
 		getComponentProperty = (address, propertyName) => {
-			const { component, option } = this.getComponent(address);
+			const { component, option } = this.getComponent(address) || {};
 			const elem = option || component;
-			return propertyMap[propertyName]?.(elem) || elem[propertyName];
+			if (!elem) return;
+			return propertyMap[propertyName] ? propertyMap[propertyName](elem) : elem[propertyName];
 		};
 		getComponent = (address) => {
 			const result = { component: null };
@@ -18455,7 +18500,14 @@ Author: Draggable https://draggable.io
 			return components;
 		};
 	};
-	var listenTypeMap = [["input", (c) => ["textarea", "text"].includes(c.type)], ["change", (c) => ["select"].includes(c.tagName.toLowerCase()) || ["checkbox", "radio"].includes(c.type)]];
+	var isDomNode = (value) => Boolean(value) && typeof value.nodeType === "number";
+	var isNodeCollection = (value) => Boolean(value) && !isDomNode(value) && typeof value.length === "number";
+	var tagName = (component) => component.tagName?.toLowerCase();
+	var listenTypeMap = [
+		["change", (component) => isCheckableGroup(component)],
+		["change", (component) => tagName(component) === "select" || ["checkbox", "radio"].includes(component.type)],
+		["input", (component) => ["input", "textarea"].includes(tagName(component))]
+	];
 	var LISTEN_TYPE_MAP = (component) => {
 		const [listenerEvent] = listenTypeMap.find((typeMap) => typeMap[1](component)) || [false];
 		return listenerEvent;

package/dist/demo/assets/js/html.min.js

@@ -1,7 +1,7 @@
 
 /**
 formeo - https://formeo.io
-Version: 5.1.0
+Version: 5.1.1
 Author: Draggable https://draggable.io
 */
 

package/dist/demo/assets/js/layout.min.js

@@ -1,7 +1,7 @@
 
 /**
 formeo - https://formeo.io
-Version: 5.1.0
+Version: 5.1.1
 Author: Draggable https://draggable.io
 */
 

package/dist/demo/assets/js/mode-json.min.js

@@ -1,7 +1,7 @@
 
 /**
 formeo - https://formeo.io
-Version: 5.1.0
+Version: 5.1.1
 Author: Draggable https://draggable.io
 */
 

package/dist/demo/assets/js/theme-github_light_default.min.js

@@ -1,7 +1,7 @@
 
 /**
 formeo - https://formeo.io
-Version: 5.1.0
+Version: 5.1.1
 Author: Draggable https://draggable.io
 */
 

package/dist/demo/index.html

@@ -1 +1 @@
-<!doctype html><html lang="en" xml:lang="en"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="chrome=1"><meta name="viewport" content="user-scalable=no,width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1"><meta name="description" content="Vanilla Javascript form building module"><meta name="theme-color" content="#232323"><title>Formeo | Drag &amp; Drop Form Creation</title><script type="module" crossorigin src="/formeo/assets/js/demo.min.js"></script><link rel="stylesheet" crossorigin href="/formeo/assets/css/demo.min.css"></head><body><div class="site-wrap"><header id="demo-header"><div class="header-inner"><img id="formeo-logo" src="/formeo/assets/img/formeo-logo.svg" alt="Formeo Logo" width="100"><nav aria-label="Framework navigation"><ul><li><label for="framework-select">Framework:</label> <select name="framework-select" id="framework-select" class="form-control"><option value="vanilla">Vanilla JavaScript</option><option value="angular">Angular</option><option value="react">React</option></select></li><li><label for="locale">Language</label> <select name="locale" id="locale" class="form-control"><option value="af-ZA" dir="ltr">Afrikaans (Suid-Afrika)</option><option value="ar-TN" dir="rtl">العربية (تونس)</option><option value="cs-CZ" dir="ltr">čeština (Česko)</option><option value="de-DE" dir="ltr">Deutsch (Deutschland)</option><option value="en-US" dir="ltr">English</option><option value="es-ES" dir="ltr">español de España</option><option value="fa-IR" dir="rtl">فارسی (ایران)</option><option value="fi-FI" dir="ltr">suomi (Suomi)</option><option value="fr-FR" dir="ltr">français (France)</option><option value="he-IL" dir="rtl">עברית (ישראל)</option><option value="hi-IN" dir="ltr">हिन्दी (भारत)</option><option value="hu-HU" dir="ltr">magyar (Magyarország)</option><option value="it-IT" dir="ltr">italiano (Italia)</option><option value="ja-JP" dir="ltr">日本語 (日本)</option><option value="nb-NO" dir="ltr">norsk bokmål (Norge)</option><option value="pl-PL" dir="ltr">polski (Polska)</option><option value="pt-BR" dir="ltr">português (Brasil)</option><option value="pt-PT" dir="ltr">português europeu</option><option value="ro-RO" dir="ltr">română (România)</option><option value="ru-RU" dir="ltr">русский (Россия)</option><option value="th-TH" dir="ltr">ไทย (ไทย)</option><option value="tr-TR" dir="ltr">Türkçe (Türkiye)</option><option value="zh-CN" dir="ltr">中文（中国）</option><option value="zh-HK" dir="ltr">中文（中國香港特別行政區）</option></select></li><li><label for="control-filter">Control Filter:</label> <input id="control-filter" placeholder="ex. text" class="form-control"></li><li style="float:right">v5.1.0</li></ul></nav></div></header><section id="main_content" class="inner"><div id="framework-container"></div></section><div class="container render-btn-wrap" id="editor-action-buttons"></div><div id="formData-popover" popover><div class="popover-header"><h3>Test formData</h3><div><button type="button" id="format-json">Format</button> <button type="button" id="collapse-json">Collapse</button> <button type="button" id="copy-json">Copy to Clipboard</button></div></div><pre id="formData-editor"></pre><div class="formData-actions"><button popovertarget="formData-popover" popovertargetaction="hide" type="button">Cancel</button> <button id="submit-formData" type="button">Submit</button></div></div><footer id="demo-footer"><nav aria-label="Footer navigation"><ul><li><a href="https://github.com/Draggable/formeo" target="_blank" title="View project on GitHub"><img src="/formeo/assets/img/github.png" width="77" alt="GitHub"></a></li></ul></nav></footer></div></body></html>
+<!doctype html><html lang="en" xml:lang="en"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="chrome=1"><meta name="viewport" content="user-scalable=no,width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1"><meta name="description" content="Vanilla Javascript form building module"><meta name="theme-color" content="#232323"><title>Formeo | Drag &amp; Drop Form Creation</title><script type="module" crossorigin src="/formeo/assets/js/demo.min.js"></script><link rel="stylesheet" crossorigin href="/formeo/assets/css/demo.min.css"></head><body><div class="site-wrap"><header id="demo-header"><div class="header-inner"><img id="formeo-logo" src="/formeo/assets/img/formeo-logo.svg" alt="Formeo Logo" width="100"><nav aria-label="Framework navigation"><ul><li><label for="framework-select">Framework:</label> <select name="framework-select" id="framework-select" class="form-control"><option value="vanilla">Vanilla JavaScript</option><option value="angular">Angular</option><option value="react">React</option></select></li><li><label for="locale">Language</label> <select name="locale" id="locale" class="form-control"><option value="af-ZA" dir="ltr">Afrikaans (Suid-Afrika)</option><option value="ar-TN" dir="rtl">العربية (تونس)</option><option value="cs-CZ" dir="ltr">čeština (Česko)</option><option value="de-DE" dir="ltr">Deutsch (Deutschland)</option><option value="en-US" dir="ltr">English</option><option value="es-ES" dir="ltr">español de España</option><option value="fa-IR" dir="rtl">فارسی (ایران)</option><option value="fi-FI" dir="ltr">suomi (Suomi)</option><option value="fr-FR" dir="ltr">français (France)</option><option value="he-IL" dir="rtl">עברית (ישראל)</option><option value="hi-IN" dir="ltr">हिन्दी (भारत)</option><option value="hu-HU" dir="ltr">magyar (Magyarország)</option><option value="it-IT" dir="ltr">italiano (Italia)</option><option value="ja-JP" dir="ltr">日本語 (日本)</option><option value="nb-NO" dir="ltr">norsk bokmål (Norge)</option><option value="pl-PL" dir="ltr">polski (Polska)</option><option value="pt-BR" dir="ltr">português (Brasil)</option><option value="pt-PT" dir="ltr">português europeu</option><option value="ro-RO" dir="ltr">română (România)</option><option value="ru-RU" dir="ltr">русский (Россия)</option><option value="th-TH" dir="ltr">ไทย (ไทย)</option><option value="tr-TR" dir="ltr">Türkçe (Türkiye)</option><option value="zh-CN" dir="ltr">中文（中国）</option><option value="zh-HK" dir="ltr">中文（中國香港特別行政區）</option></select></li><li><label for="control-filter">Control Filter:</label> <input id="control-filter" placeholder="ex. text" class="form-control"></li><li style="float:right">v5.1.1</li></ul></nav></div></header><section id="main_content" class="inner"><div id="framework-container"></div></section><div class="container render-btn-wrap" id="editor-action-buttons"></div><div id="formData-popover" popover><div class="popover-header"><h3>Test formData</h3><div><button type="button" id="format-json">Format</button> <button type="button" id="collapse-json">Collapse</button> <button type="button" id="copy-json">Copy to Clipboard</button></div></div><pre id="formData-editor"></pre><div class="formData-actions"><button popovertarget="formData-popover" popovertargetaction="hide" type="button">Cancel</button> <button id="submit-formData" type="button">Submit</button></div></div><footer id="demo-footer"><nav aria-label="Footer navigation"><ul><li><a href="https://github.com/Draggable/formeo" target="_blank" title="View project on GitHub"><img src="/formeo/assets/img/github.png" width="77" alt="GitHub"></a></li></ul></nav></footer></div></body></html>

package/dist/formeo.cjs.js

@@ -1,7 +1,7 @@
 
 /**
 formeo - https://formeo.io
-Version: 5.1.0
+Version: 5.1.1
 Author: Draggable https://draggable.io
 */
 
@@ -71,7 +71,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 		allowSelect: "Laat Kies toe",
 		and: "en",
 		attribute: "kenmerk",
-		attributeNotPermitted: `Attribuut "{attribuut}" is nie toegelaat nie, kies asseblief 'n ander.`,
+		attributeNotPermitted: "Attribuut \"{attribuut}\" is nie toegelaat nie, kies asseblief 'n ander.",
 		attributes: "eienskappe",
 		"attrs.class": "klas",
 		"attrs.className": "klas",
@@ -2124,7 +2124,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 		"row.makeInputGroup": "Définir cette ligne comme groupe de saisie.",
 		"row.makeInputGroupDesc": "Les groupes de saisie permettent aux usagers de rajouter de multiples champs à la fois.",
 		"row.settings.fieldsetWrap": "Entourer le champ d'un élément <fieldset>",
-		"row.settings.fieldsetWrap.aria": `Entourer le champ d'un "Fieldset"`,
+		"row.settings.fieldsetWrap.aria": "Entourer le champ d'un \"Fieldset\"",
 		save: "Sauvegarder",
 		secondary: "Secondaire",
 		select: "Sélection",
@@ -2899,7 +2899,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 		allowSelect: "Consenti selezione",
 		and: "e",
 		attribute: "Attributo",
-		attributeNotPermitted: `L'attributo "{attribute}" non è permesso, per favore sceglierne un altro.`,
+		attributeNotPermitted: "L'attributo \"{attribute}\" non è permesso, per favore sceglierne un altro.",
 		attributes: "attributi",
 		"attrs.class": "Classe",
 		"attrs.className": "Classe",
@@ -5708,10 +5708,10 @@ e$1["de-DE"];
 //#region node_modules/@draggable/formeo-languages/dist/formeo-languages.es.js
 /**
 @draggable/formeo-languages - https://github.com/Draggable/formeo-languages#readme
-Version: 3.4.1
+Version: 3.5.0
 Author: Kevin Chappell <kevin.b.chappell@gmail.com> (https://kevin-chappell.com)
 */
-var i = e$1["en-US"];
+var s$1 = e$1["en-US"];
 e$1["es-ES"];
 e$1["fa-IR"];
 e$1["fi-FI"];
@@ -6061,7 +6061,7 @@ if (globalThis !== void 0) globalThis.SmartTooltip = SmartTooltip;
 var name$1, version$2, type, main, module$1, unpkg, exports$1, files, homepage, repository, author, contributors, bugs, description, keywords, ignore, config, scripts, devDependencies, dependencies, release, commitlint, package_default;
 var init_package = __esmMin((() => {
 	name$1 = "formeo";
-	version$2 = "5.1.0";
+	version$2 = "5.1.1";
 	type = "module";
 	main = "dist/formeo.cjs.js";
 	module$1 = "dist/formeo.es.js";
@@ -10067,7 +10067,7 @@ function _typeof(o) {
 	}, _typeof(o);
 }
 function userAgent(pattern) {
-	if (typeof window !== "undefined" && window.navigator) return !!/* @__PURE__ */ navigator.userAgent.match(pattern);
+	if (typeof window !== "undefined" && window.navigator) return !!/*@__PURE__*/ navigator.userAgent.match(pattern);
 }
 function on(el, event, fn) {
 	el.addEventListener(event, fn, !IE11OrLess && captureMode);
@@ -17897,7 +17897,7 @@ var FormeoEditor$1 = class {
 			fetchIcons(this.opts.svgSprite),
 			fetchFormeoStyle(this.opts.style),
 			s.init({
-				preloaded: { "en-US": i },
+				preloaded: { "en-US": s$1 },
 				...this.opts.i18n,
 				locale: globalThis.sessionStorage?.getItem(SESSION_LOCALE_KEY)
 			})
@@ -18073,20 +18073,56 @@ var baseId = (id) => {
 };
 var isVisible = (elem) => {
 	if (!elem) return false;
-	if (elem.hasAttribute("hidden") || elem.parentElement.hasAttribute("hidden")) return false;
+	if (elem.hasAttribute("hidden") || elem.parentElement?.hasAttribute("hidden")) return false;
 	const computedStyle = window.getComputedStyle(elem);
 	return !(computedStyle.display === "none" || computedStyle.visibility === "hidden" || computedStyle.opacity === "0");
 };
+var CHECKABLE_INPUT_SELECTOR = "input[type=\"checkbox\"], input[type=\"radio\"]";
+var CHECKABLE_TYPES = new Set(["checkbox", "radio"]);
+var tagName$1 = (elem) => elem?.tagName?.toLowerCase();
+var isCheckableInput = (elem) => tagName$1(elem) === "input" && CHECKABLE_TYPES.has(elem.type);
+/**
+* Radio and checkbox fields render as a wrapper holding one input per option, so a
+* field address resolves to the wrapper rather than to anything carrying a value.
+* @param  {Element} elem
+* @return {Array<Element>|null} option inputs, or null when elem is not a group
+*/
+var checkableGroupInputs = (elem) => {
+	if (!elem || isCheckableInput(elem) || typeof elem.querySelectorAll !== "function") return null;
+	const inputs = elem.querySelectorAll(CHECKABLE_INPUT_SELECTOR);
+	return inputs.length ? Array.from(inputs) : null;
+};
+var isCheckableGroup = (elem) => Boolean(checkableGroupInputs(elem));
+/**
+* Value a condition compares against. Controls that can hold several values at once
+* yield an array so that a single selection still matches an `equals` comparison.
+* @param  {Element} elem
+* @return {String|Array<String>|undefined}
+*/
+var elementValue = (elem) => {
+	if (!elem) return;
+	const groupInputs = checkableGroupInputs(elem);
+	if (groupInputs) {
+		const checkedValues = groupInputs.filter((input) => input.checked).map((input) => input.value);
+		return groupInputs.every((input) => input.type === "radio") ? checkedValues[0] ?? "" : checkedValues;
+	}
+	if (tagName$1(elem) === "select" && elem.multiple) return Array.from(elem.selectedOptions, (option) => option.value);
+	if (isCheckableInput(elem)) return elem.checked ? elem.value : "";
+	return elem.value;
+};
+var isChecked = (elem) => {
+	const groupInputs = checkableGroupInputs(elem);
+	return groupInputs ? groupInputs.some((input) => input.checked) : Boolean(elem?.checked);
+};
 var propertyMap = {
 	isChecked: (elem) => {
-		return elem.checked;
+		return isChecked(elem);
 	},
 	isNotChecked: (elem) => {
-		return !elem.checked;
-	},
-	value: (elem) => {
-		return elem.value;
+		return !isChecked(elem);
 	},
+	value: elementValue,
+	checked: elementValue,
 	isVisible: (elem) => {
 		return isVisible(elem);
 	},
@@ -18103,11 +18139,16 @@ var createRemoveButton = () => dom.btnTemplate({
 		click: ({ target }) => target.parentElement.remove()
 	}
 });
+var equals = (source, target) => Array.isArray(source) ? source.some((value) => (0, import_isEqual.default)(value, target)) : (0, import_isEqual.default)(source, target);
+var contains = (source, target) => {
+	if (source == null) return false;
+	return Array.isArray(source) ? source.includes(target) : String(source).includes(target);
+};
 var comparisonHandlers = {
-	equals: import_isEqual.default,
-	notEquals: (source, target) => !(0, import_isEqual.default)(source, target),
-	contains: (source, target) => source.includes(target),
-	notContains: (source, target) => !source.includes(target)
+	equals,
+	notEquals: (source, target) => !equals(source, target),
+	contains,
+	notContains: (source, target) => !contains(source, target)
 };
 var comparisonMap = Object.entries(COMPARISON_OPERATORS).reduce((acc, [key, value]) => {
 	acc[value] = comparisonHandlers[key];
@@ -18375,7 +18416,8 @@ var FormeoRenderer$1 = class {
 	* @return {Array} flattened array of conditions
 	*/
 	handleComponentCondition = (component, ifRest, thenConditions) => {
-		if (component.length) {
+		if (!component) return;
+		if (isNodeCollection(component)) {
 			for (const elem of component) this.handleComponentCondition(elem, ifRest, thenConditions);
 			return;
 		}
@@ -18387,23 +18429,25 @@ var FormeoRenderer$1 = class {
 		if (this.evaluateCondition(ifRest, fakeEvt)) for (const thenCondition of thenConditions) this.execResult(thenCondition, fakeEvt);
 	};
 	applyConditions = () => {
-		for (const { conditions } of Object.values(this.components)) if (conditions) for (const condition of conditions) {
-			const { if: ifConditions, then: thenConditions } = condition;
-			for (const ifCondition of ifConditions) {
-				const { source, target } = ifCondition;
-				if (isAddress(source)) {
-					const { component, options } = this.getComponent(source);
-					const sourceComponent = options || component;
-					this.handleComponentCondition(sourceComponent, ifCondition, thenConditions);
-				}
-				if (isAddress(target)) {
-					const { component, options } = this.getComponent(target);
-					const targetComponent = options || component;
-					this.handleComponentCondition(targetComponent, ifCondition, thenConditions);
+		for (const { conditions } of Object.values(this.components)) {
+			if (!conditions) continue;
+			for (const condition of conditions) {
+				const { if: ifConditions = [], then: thenConditions = [] } = condition;
+				for (const ifCondition of ifConditions) try {
+					this.applyCondition(ifCondition, thenConditions);
+				} catch (err) {
+					console.error("formeo: condition skipped", ifCondition, err);
 				}
 			}
 		}
 	};
+	applyCondition = (ifCondition, thenConditions) => {
+		for (const address of [ifCondition.source, ifCondition.target]) {
+			if (!isAddress(address)) continue;
+			const { component, options } = this.getComponent(address);
+			this.handleComponentCondition(options || component, ifCondition, thenConditions);
+		}
+	};
 	/**
 	* Evaulate conditions
 	*/
@@ -18425,9 +18469,10 @@ var FormeoRenderer$1 = class {
 		}
 	};
 	getComponentProperty = (address, propertyName) => {
-		const { component, option } = this.getComponent(address);
+		const { component, option } = this.getComponent(address) || {};
 		const elem = option || component;
-		return propertyMap[propertyName]?.(elem) || elem[propertyName];
+		if (!elem) return;
+		return propertyMap[propertyName] ? propertyMap[propertyName](elem) : elem[propertyName];
 	};
 	getComponent = (address) => {
 		const result = { component: null };
@@ -18452,7 +18497,14 @@ var FormeoRenderer$1 = class {
 		return components;
 	};
 };
-var listenTypeMap = [["input", (c) => ["textarea", "text"].includes(c.type)], ["change", (c) => ["select"].includes(c.tagName.toLowerCase()) || ["checkbox", "radio"].includes(c.type)]];
+var isDomNode = (value) => Boolean(value) && typeof value.nodeType === "number";
+var isNodeCollection = (value) => Boolean(value) && !isDomNode(value) && typeof value.length === "number";
+var tagName = (component) => component.tagName?.toLowerCase();
+var listenTypeMap = [
+	["change", (component) => isCheckableGroup(component)],
+	["change", (component) => tagName(component) === "select" || ["checkbox", "radio"].includes(component.type)],
+	["input", (component) => ["input", "textarea"].includes(tagName(component))]
+];
 var LISTEN_TYPE_MAP = (component) => {
 	const [listenerEvent] = listenTypeMap.find((typeMap) => typeMap[1](component)) || [false];
 	return listenerEvent;

package/dist/formeo.css

@@ -1,7 +1,7 @@
 
 /**
 formeo - https://formeo.io
-Version: 5.1.0
+Version: 5.1.1
 Author: Draggable https://draggable.io
 */