@pageboard/html 0.11.18 → 0.11.20

package/elements/input-date.js

@@ -49,13 +49,15 @@ exports.input_date_time = {
 			}]
 		},
 		step: {
-			title: 'Step',
-			description: 'rounding/increment in seconds',
+			title: 'Time steps',
+			description: 'Ignored for dates',
 			type: 'integer',
-			default: 60,
+			default: null,
 			anyOf: [{
-				const: 60,
+				const: null,
 				title: '1 minute'
+			}, {
+				const: 60
 			}, {
 				const: 60 * 5,
 				title: '5 minutes'

package/elements/menu.js

@@ -43,6 +43,17 @@ exports.menu_group = {
 				const: "right",
 				title: "Right"
 			}]
+		},
+		responsive: {
+			title: 'Responsive',
+			default: 'popup',
+			anyOf: [{
+				const: null,
+				title: 'None'
+			}, {
+				const: 'popup',
+				title: 'Popup'
+			}]
 		}
 	},
 	contents: {
@@ -51,7 +62,7 @@ exports.menu_group = {
 	},
 	html: `<element-menu class="[position] menu">
 		<div block-content="items"></div>
-		<div tabindex="0" class="ui fixed popup item">
+		<div tabindex="0" class="ui fixed popup item [responsive|eq:popup|bmagnet:*]">
 			<div class="icon">≡</div>
 			<div class="dropdown placer"><div class="menu"></div></div>
 		</div>

package/elements/paragraph.js

@@ -150,6 +150,9 @@ exports.heading = {
 	stylesheets: [
 		'../ui/heading.css'
 	],
+	scripts: [
+		'../ui/heading.js'
+	],
 	resources: {
 		helper: '../ui/heading-helper.js'
 	},

package/elements/sitemap.js

@@ -1,6 +1,7 @@
 exports.sitemap = {
 	title: "Sitemap",
 	group: "block",
+	bundle: true,
 	icon: '<i class="sitemap icon"></i>',
 	menu: 'link',
 	contents: {
@@ -38,6 +39,7 @@ exports.sitemap = {
 				...schema.properties
 			},
 			menu: "link",
+			bundle: 'sitemap',
 			group: 'sitemap_item',
 			virtual: true,
 			contents: leaf ? undefined : {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pageboard/html",
-  "version": "0.11.18",
+  "version": "0.11.20",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -19,12 +19,12 @@
   },
   "homepage": "https://github.com/pageboard/client#readme",
   "dependencies": {
-    "postinstall": "^0.7.4",
+    "postinstall": "^0.8.0",
     "semantic-ui-css": "^2.4.1"
   },
   "devDependencies": {
     "formdata-polyfill": "^4.0.10",
-    "nouislider": "^15.6.0",
+    "nouislider": "^15.6.1",
     "object-fit-images": "^3.2.4",
     "postinstall-bundle": "^0.7.4"
   },

package/ui/heading-helper.js

@@ -5,8 +5,8 @@ class HTMLElementHeadingHelper extends HTMLHeadingElement {
 	}
 	init() {
 		this.willSync = Pageboard.debounce(this.sync, 100);
-		this.observer = new MutationObserver((records) => {
-			if (records.some((mut) => {
+		this.observer = new MutationObserver(records => {
+			if (records.some(mut => {
 				return mut.type == "characterData" || mut.type == "childList" && mut.addedNodes.length;
 			}))	this.willSync();
 		});

package/ui/heading.js

@@ -0,0 +1,9 @@
+Page.patch(state => {
+	state.finish(() => {
+		const heading = document.body.querySelector('element-template > .view h1');
+		if (!heading) return;
+		const title = document.head.querySelector('title');
+		if (!title) return;
+		title.textContent = heading.textContent.trim() + ' - ' + title.textContent;
+	});
+});

package/ui/input-date-slot.js

@@ -62,10 +62,8 @@ class HTMLElementInputDateSlot extends VirtualHTMLElement {
 	patch(state) {
 		const [ start, end ] = this.#inputs();
 		const type = this.type;
-		let step = this.step;
-		if (type == "date" && step < 86400) step = 0;
+		const step = type == "date" ? 0 : this.step;
 		if (step) {
-			if (type == "date") step = Math.round(step / 86400);
 			start.setAttribute('step', step);
 			end.setAttribute('step', step);
 		} else {

package/ui/input-date.js

@@ -4,6 +4,10 @@ class HTMLElementInputDate extends HTMLInputElement {
 		if (this.init) this.init();
 	}
 
+	patch() {
+		if (this.type == "date") this.removeAttribute('step');
+	}
+
 	setAttribute(name, value) {
 		if (name == "value") {
 			this.value = value;

package/ui/menu.css

@@ -102,13 +102,10 @@ element-menu > [block-content="items"] {
 }
 element-menu.burger > [block-content="items"] {
 	left:0;
-}
-element-menu.burger.right > [block-content="items"] {
 	position: absolute;
 	pointer-events: none;
 	height: 0;
 }
-
 element-menu:not(.burger) > .item {
 	display:none !important;
 }

package/ui/menu.js

@@ -1,10 +1,13 @@
 Page.patch((state) => {
-	function isSameOrParent(loc, state) {
+	function isSameOrParent(loc, state, isItem) {
 		if (!state.sameDomain(loc)) {
 			return false;
 		} else if (state.samePathname(loc)) {
-			if (loc.sameQuery({query:{}})) return true;
-			if (state.query.develop !== undefined) loc.query.develop = state.query.develop;
+			if (!isItem && loc.sameQuery({query:{}})) return true;
+			if (state.query.develop !== undefined) {
+				// kept for backward compatibility
+				loc.query.develop = state.query.develop;
+			}
 			if (state.sameQuery(loc)) return true;
 		} else {
 			return state.pathname.startsWith(loc.pathname + '/');
@@ -14,7 +17,7 @@ Page.patch((state) => {
 		for (const item of document.querySelectorAll('[block-type="menu"] [href]')) {
 			const loc = item.getAttribute('href');
 			if (!loc) continue;
-			if (isSameOrParent(Page.parse(loc), state)) {
+			if (isSameOrParent(Page.parse(loc), state, item.matches('.item'))) {
 				item.classList.add('active');
 			}
 		}
@@ -26,6 +29,10 @@ class HTMLElementMenu extends VirtualHTMLElement {
 		if (this.isContentEditable || this.matches('.vertical')) return;
 		const menu = this.firstElementChild;
 		const helper = this.lastElementChild;
+		if (helper == menu) {
+			// not a popup
+			return;
+		}
 		helper.lastElementChild.lastElementChild.appendChild(this.toHelper(menu));
 		state.finish(() => {
 			this.observer = new ResizeObserver((entries, observer) => {
@@ -43,10 +50,14 @@ class HTMLElementMenu extends VirtualHTMLElement {
 		if (this.observer) this.observer.disconnect();
 	}
 	handleAllClick(e, state) {
+		const tosser = this.lastElementChild;
+		if (tosser == this.firstElementChild) {
+			// not a popup
+			return;
+		}
 		if (this.active) {
 			this.active.classList.toggle('active', false);
 		}
-		const tosser = this.lastElementChild;
 		tosser.classList.remove('inactive');
 		let item = tosser.contains(e.target) && !e.target.closest('a') && e.target.closest('.item');
 		if (item == tosser) {

package/ui/sitemap.js

@@ -8,7 +8,7 @@ class HTMLElementSitemap extends VirtualHTMLElement {
 			if (parent.content == null) parent.content = {};
 			if (parent.content.children == null) parent.content.children = "";
 			if (typeof parent.content.children == "string") {
-				parent.content.children += `<div block-id="${page.id}" block-type="site${page.type}"></div>`;
+				parent.content.children += `<div block-id="${page.id}" block-type="${page.type}"></div>`;
 			}
 			delete tree._;
 		} else {