@pageboard/html 0.11.20 → 0.11.22

package/elements/fieldsets.js

@@ -10,10 +10,7 @@ exports.fieldset = {
 			type: 'string',
 			format: 'singleline',
 			nullable: true,
-			$helper: {
-				name: 'element-property',
-				existing: true
-			}
+			$helper: 'form-element'
 		},
 		value: {
 			title: 'matches this value',
@@ -39,6 +36,7 @@ exports.fieldset = {
 
 exports.fieldset_legend = {
 	inplace: true,
+	context: 'fieldset//',
 	contents: "inline*",
 	html: '<legend>Title</legend>'
 };

package/elements/form.js

@@ -40,7 +40,8 @@ exports.query_form = {
 					nullable: true,
 					type: "object"
 				}
-			}
+			},
+			nullable: true
 		}
 	},
 	contents: 'block+',

package/elements/inlines.js

@@ -101,7 +101,10 @@ exports.caps = {
 	inline: true,
 	inplace: true,
 	group: "inline nolink",
-	tag: 'span[block-type="caps"]',
+	parse: function(dom) {
+		return { transform: dom.className };
+	},
+	tag: 'span.uppercase,span.lowercase,span.capitalize,span.smallcaps',
 	properties: {
 		transform: {
 			title: 'Transform',
@@ -168,7 +171,7 @@ exports.color = {
 	},
 	parse: function(dom) {
 		const prop = this.properties.color;
-		const color = (prop.anyOf.find((item) => {
+		const color = (prop.anyOf.find(item => {
 			return item.const && dom.classList.contains(item.const);
 		}) || { const: prop.default }).const;
 		return { color: color };
@@ -176,6 +179,7 @@ exports.color = {
 	contents: "text*",
 	inline: true,
 	inplace: true,
+	tag: 'span.color',
 	group: "inline nolink",
 	html: '<span class="[color] color"></span>'
 };

package/elements/input-date.js

@@ -10,7 +10,8 @@ exports.input_date_time = {
 			title: "Name",
 			description: "The form object key",
 			type: "string",
-			format: "singleline"
+			format: "singleline",
+			$helper: 'element-property'
 		},
 		value: {
 			title: "Default value",
@@ -105,13 +106,15 @@ exports.input_date_slot = {
 			title: "Name for start date",
 			description: "The form object key",
 			type: "string",
-			format: "singleline"
+			format: "singleline",
+			$helper: 'element-property'
 		},
 		nameEnd: {
 			title: "Name for end date",
 			description: "The form object key",
 			type: "string",
-			format: "singleline"
+			format: "singleline",
+			$helper: 'element-property'
 		},
 		valueStart: {
 			title: 'Start time',

package/elements/input-file.js

@@ -10,7 +10,8 @@ exports.input_file = {
 			title: "Name",
 			description: "The form object key",
 			type: "string",
-			format: "singleline"
+			format: "singleline",
+			$helper: 'element-property'
 		},
 		placeholder: {
 			title: "Placeholder",

package/elements/input-property.js

@@ -1,9 +1,8 @@
 exports.input_property = {
-	title: 'Property',
+	// deprecated
 	menu: 'form',
 	group: 'block',
 	context: 'form//',
-	icon: '<i class="icon">X</i>',
 	properties: {
 		name: {
 			title: 'Name',
@@ -108,7 +107,7 @@ exports.input_property = {
 
 		let listOf = propType.anyOf || propType.oneOf;
 		if (listOf) {
-			const listOfNo = listOf.filter((item) => item.type != "null");
+			const listOfNo = listOf.filter(item => item.type != "null");
 			if (listOfNo.length != listOf.length) {
 				required = false;
 			}
@@ -119,7 +118,7 @@ exports.input_property = {
 				listOf = listOfNo;
 			}
 		} else if (Array.isArray(prop.type)) {
-			listOf = prop.type.filter((type) => {
+			listOf = prop.type.filter(type => {
 				if (type == "null") {
 					required = false;
 					return false;
@@ -301,7 +300,7 @@ exports.input_property = {
 			};
 			const filter = propType.$helper.filter;
 			if (filter && filter.type) {
-				limits.types = filter.type.map((type) => {
+				limits.types = filter.type.map(type => {
 					if (type == "image") return "image/*";
 					else if (type == "video") return "video/*";
 					else return "*/*";

package/elements/inputs.js

@@ -84,7 +84,8 @@ exports.input_text = {
 			title: "Name",
 			description: "The form object key",
 			type: "string",
-			format: "singleline"
+			format: "singleline",
+			$helper: 'element-property'
 		},
 		value: {
 			title: "Default value",
@@ -285,7 +286,8 @@ exports.input_checkbox = {
 		name: {
 			title: "Name",
 			type: "string",
-			format: "singleline"
+			format: "singleline",
+			$helper: 'element-property'
 		},
 		value: {
 			title: "Value",
@@ -341,7 +343,8 @@ exports.input_radio = {
 		name: {
 			title: "name",
 			type: "string",
-			format: "singleline"
+			format: "singleline",
+			$helper: 'element-property'
 		},
 		checked: {
 			title: "Checked",
@@ -388,7 +391,8 @@ exports.input_select = {
 			title: "Name",
 			description: "The form object key",
 			type: "string",
-			format: "singleline"
+			format: "singleline",
+			$helper: 'element-property'
 		},
 		placeholder: {
 			title: "Placeholder",

package/elements/list.js

@@ -9,7 +9,7 @@ exports.textblock = {
 	title: 'Text',
 	inplace: true,
 	contents: "inline*",
-	html: '<span></span>'
+	html: '<span class="textblock"></span>'
 };
 exports.list = {
 	title: 'List',
@@ -69,7 +69,7 @@ exports.list = {
 	parse: function(dom) {
 		let marker = null;
 		const style = dom.style.listStyleType;
-		if (style && this.properties.marker.anyOf.some((item) => item.const == style)) {
+		if (style && this.properties.marker.anyOf.some(item => item.const == style)) {
 			marker = style;
 		} else if (dom.nodeName == "OL") {
 			marker = 'decimal';

package/package.json

@@ -1,13 +1,8 @@
 {
   "name": "@pageboard/html",
-  "version": "0.11.20",
+  "version": "0.11.22",
   "description": "",
   "main": "index.js",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
-    "postinstall": "postinstall",
-    "prepare": "postinstall"
-  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/pageboard/client.git"
@@ -26,7 +21,7 @@
     "formdata-polyfill": "^4.0.10",
     "nouislider": "^15.6.1",
     "object-fit-images": "^3.2.4",
-    "postinstall-bundle": "^0.7.4"
+    "postinstall-bundle": "^0.8.0"
   },
   "postinstall": {
     "semantic-ui-css/components": "link lib/components",
@@ -48,5 +43,9 @@
     "elements": [
       "elements/"
     ]
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "postinstall": "postinstall"
   }
-}
+}

package/ui/consent.js

@@ -94,7 +94,7 @@ Page.State.prototype.reconsent = function (fn) {
 	return asking;
 };
 
-Page.paint((state) => {
+Page.paint(state => {
 	state.finish(() => {
 		let run = true;
 		if (HTMLCustomConsentElement.waiting) {

package/ui/embed.js

@@ -10,7 +10,7 @@ class HTMLElementEmbed extends VirtualHTMLElement {
 	}
 	reveal(state) {
 		let done;
-		this.promise = new Promise((resolve) => done = resolve);
+		this.promise = new Promise(resolve => done = resolve);
 		this.promise.done = done;
 		this.classList.add('waiting');
 

package/ui/form.js

@@ -213,7 +213,7 @@ class HTMLCustomFormElement extends HTMLFormElement {
 		const p = this.ignoreInputChange
 			? state.replace(loc)
 			: state.push(loc);
-		return p.catch((err) => {
+		return p.catch(err => {
 			if (err.status != null) status = err.status;
 			else status = 0;
 		}).then(() => {
@@ -228,9 +228,9 @@ class HTMLCustomFormElement extends HTMLFormElement {
 		form.classList.add('loading');
 
 		const data = { $query };
-		return Promise.all(Array.from(form.elements).filter((node) => {
+		return Promise.all(Array.from(form.elements).filter(node => {
 			return Boolean(node.presubmit);
-		}).map((input) => {
+		}).map(input => {
 			return input.presubmit();
 		})).then(() => {
 			data.$query = state.query;
@@ -240,7 +240,7 @@ class HTMLCustomFormElement extends HTMLFormElement {
 				pathname: form.getAttribute('action'),
 				query: data.$query
 			}), data.$request);
-		}).catch((err) => err).then((res) => {
+		}).catch(err => err).then(res => {
 			if (res?.grants) state.data.$grants = res.grants;
 			state.scope.$response = res;
 			form.enable();
@@ -396,7 +396,7 @@ Object.defineProperty(HTMLInputElement.prototype, 'defaultValue', {
 	}
 });
 
-Page.setup((state) => {
+Page.setup(state => {
 	// https://daverupert.com/2017/11/happier-html5-forms/
 	Page.connect({
 		captureBlur: (e, state) => blurHandler(e, false),

package/ui/image.js

@@ -33,7 +33,7 @@ class HTMLElementImage extends VirtualHTMLElement {
 		this.promise.done = function () { };
 	}
 	findClass(list) {
-		return list.find((name) => this.matches(`.${name}`)) || list[0];
+		return list.find(name => this.matches(`.${name}`)) || list[0];
 	}
 	get fit() {
 		return this.findClass(['none', 'contain', 'cover']);
@@ -47,12 +47,12 @@ class HTMLElementImage extends VirtualHTMLElement {
 		this.classList.add(val);
 	}
 	set position(val) {
-		(val || '').split(' ').forEach((val) => {
+		(val || '').split(' ').forEach(val => {
 			if (val) this.classList.add(val);
 		});
 	}
 	get crop() {
-		let [x, y, w, h, z] = (this.dataset.crop || ";;;;").split(";").map((x) => parseFloat(x));
+		let [x, y, w, h, z] = (this.dataset.crop || ";;;;").split(";").map(x => parseFloat(x));
 		if (Number.isNaN(x)) x = 50;
 		if (Number.isNaN(y)) y = 50;
 		if (Number.isNaN(w)) w = 100;
@@ -150,7 +150,7 @@ class HTMLElementImage extends VirtualHTMLElement {
 			}
 			this.classList.add('loading');
 			let done;
-			this.promise = new Promise((resolve) => done = resolve);
+			this.promise = new Promise(resolve => done = resolve);
 			this.promise.done = done;
 			img.setAttribute('src', curSrc);
 		}

package/ui/input-range.js

@@ -6,7 +6,7 @@ class HTMLElementInputRange extends HTMLInputElement {
 	static parse(x) {
 		return (x == null ? '' : x)
 			.split('⩽')
-			.map((n) => {
+			.map(n => {
 				n = parseFloat(n);
 				return Number.isNaN(n) ? null : n;
 			});
@@ -89,7 +89,7 @@ class HTMLElementInputRange extends HTMLInputElement {
 			if (this.isContentEditable) return;
 			const isInt = parseInt(opts.step) == opts.step;
 			helper.classList.remove('indeterminate');
-			if (isInt) values = values.map((n) => parseInt(n));
+			if (isInt) values = values.map(n => parseInt(n));
 			this.rangeValue = values;
 			this.dispatchEvent(new Event('change', {
 				bubbles: true,

package/ui/menu.js

@@ -1,4 +1,4 @@
-Page.patch((state) => {
+Page.patch(state => {
 	function isSameOrParent(loc, state, isItem) {
 		if (!state.sameDomain(loc)) {
 			return false;
@@ -79,7 +79,7 @@ class HTMLElementMenu extends VirtualHTMLElement {
 	}
 	toHelper(root) {
 		const frag = root.ownerDocument.createDocumentFragment();
-		root.children.forEach((item) => {
+		root.children.forEach(item => {
 			frag.append(item.cloneNode(true));
 		});
 		return frag;

package/ui/pagination.js

@@ -95,8 +95,8 @@ class HTMLElementPagination extends HTMLAnchorElement {
 	setup(state) {
 		if (this.isContentEditable || !this.#infinite) return;
 		this.#queue = Promise.resolve();
-		this.#observer = new IntersectionObserver((entries) => {
-			entries.forEach((entry) => {
+		this.#observer = new IntersectionObserver(entries => {
+			entries.forEach(entry => {
 				if (this.#reached) return;
 				if (this.offsetParent && (entry.intersectionRatio || 0) !== 0) {
 					this.#visible = true;

package/ui/query-tags.js

@@ -44,7 +44,7 @@ class HTMLElementQueryTags extends VirtualHTMLElement {
 	}
 	add(name, value) {
 		const labels = this.labels;
-		this.find(name, value).forEach((control) => {
+		this.find(name, value).forEach(control => {
 			if (control.type == "hidden") return;
 			const field = control.closest('.field');
 			if (!field) return;

package/ui/select.js

@@ -137,7 +137,7 @@ class HTMLElementSelect extends VirtualHTMLElement {
 		});
 	}
 	setup(state) {
-		this.#observer = new MutationObserver((mutations) => this.#fillSelect());
+		this.#observer = new MutationObserver(mutations => this.#fillSelect());
 		this.#observer.observe(this.#menu, {
 			childList: true
 		});
@@ -175,7 +175,7 @@ class HTMLElementSelect extends VirtualHTMLElement {
 
 		state.finish(() => {
 			// synchronize after form has filled select
-			this.#select.children.forEach((opt) => {
+			this.#select.children.forEach(opt => {
 				if (opt.value) {
 					if (opt.selected) this.#selectItem(opt.value);
 					else this.#deselectItem(opt.value);

package/ui/sitemap-helper.js

@@ -10,7 +10,7 @@ class HTMLElementSitepage extends VirtualHTMLElement {
 	setup(state) {
 		const content = this.querySelector('[block-content="children"]');
 		if (!content) return;
-		this.observer = new MutationObserver((mutations) => this.updateChildren());
+		this.observer = new MutationObserver(mutations => this.updateChildren());
 		this.observer.observe(content, {
 			childList: true
 		});
@@ -52,7 +52,7 @@ class HTMLElementSitepage extends VirtualHTMLElement {
 		const block = editor.blocks.get(this.getAttribute('block-id'));
 		if (!block.data) block.data = {};
 		const data = this.options;
-		if (Object.keys(data).some((key) => data[key] != block.data[key])) {
+		if (Object.keys(data).some(key => data[key] != block.data[key])) {
 			Object.assign(block.data, data);
 			editor.dispatch(editor.utils.refreshTr(editor.state.tr, this, block));
 			this.updateChildren();

package/ui/tab-helper.js

@@ -1,7 +1,7 @@
 Page.setup(() => {
 	VirtualHTMLElement.extend('element-tabs', class TabsHelper {
 		setup(state) {
-			if (!this.observer) this.observer = new MutationObserver((records) => {
+			if (!this.observer) this.observer = new MutationObserver(records => {
 				for (const record of records) this.mutate(record, state);
 			});
 			this.observer.observe(this.items, {

package/ui/transition.js

@@ -4,7 +4,7 @@ Object.defineProperty(document, 'body', {
 		return this.documentElement.querySelector('body:last-of-type');
 	}
 });
-Page.init((state) => {
+Page.init(state => {
 	const root = document.documentElement;
 	function dtr(state) {
 		root.dataset.stage = state.stage;
@@ -30,7 +30,7 @@ Page.State.prototype.mergeBody = function(body, corpse) {
 	}
 };
 
-Page.setup((state) => {
+Page.setup(state => {
 	if (state.transition) {
 		if (state.transition.ok) {
 			state.finish(() => {
@@ -79,7 +79,7 @@ Page.Transition = class {
 		from.after(to);
 	}
 	start() {
-		return new Promise((resolve) => {
+		return new Promise(resolve => {
 			this.resolve = resolve;
 			if (!this.ok) {
 				this.destroy();