@staging-apiplus/essentials 0.0.0-stage → 0.0.2

package/dist/tab.js

@@ -0,0 +1,185 @@
+import { t as e } from "./sync_selected_style_roles-PKX5qPBc.js";
+import { n as t, t as n } from "./design_time-BeEBEFSF.js";
+//#region src/tab/runtime/dom.ts
+var r = "data-qp-logic-tabs", i = "qp-tabs-runtime-styles", a = `
+    [${r}] {
+        display: block;
+        width: 100%;
+    }
+
+    [${r}] .qp-tab-list {
+        display: flex;
+        flex-direction: row;
+        flex-wrap: nowrap;
+        gap: 0;
+        width: 100%;
+    }
+
+    [${r}] .qp-tab {
+        cursor: pointer;
+        user-select: none;
+    }
+
+    [${r}] .qp-panel-list {
+        display: block;
+        width: 100%;
+    }
+
+    [${r}] .qp-panel {
+        display: block;
+        width: 100%;
+        box-sizing: border-box;
+    }
+
+    /* Publish critical CSS hides inactive panels by class with !important. */
+    [${r}] .qp-panel:not([hidden]) {
+        display: revert !important;
+    }
+
+    [${r}] .qp-panel[hidden] {
+        display: none !important;
+    }
+`;
+function o() {
+	if (typeof document > "u" || document.getElementById("qp-tabs-runtime-styles")) return;
+	let e = document.createElement("style");
+	e.id = i, e.textContent = a, document.head.appendChild(e);
+}
+function s(e, t) {
+	if (t instanceof HTMLElement) return t;
+	let n = e.querySelector(".qp-tab-list");
+	return n instanceof HTMLElement ? n : null;
+}
+function c(e, t) {
+	if (t instanceof HTMLElement) return t;
+	let n = e.querySelector(".qp-panel-list");
+	return n instanceof HTMLElement ? n : null;
+}
+function l(e) {
+	let t = Array.from(e.children).filter((e) => e instanceof HTMLElement && e.classList.contains("qp-tab"));
+	return t.length > 0 ? t : Array.from(e.children).filter((e) => e instanceof HTMLElement);
+}
+function u(e) {
+	let t = Array.from(e.children).filter((e) => e instanceof HTMLElement && e.classList.contains("qp-panel"));
+	return t.length > 0 ? t : Array.from(e.children).filter((e) => e instanceof HTMLElement);
+}
+function d(e, t, n) {
+	t.classList.contains("qp-tab-list") || t.classList.add("qp-tab-list"), n.classList.contains("qp-panel-list") || n.classList.add("qp-panel-list");
+	for (let e of l(t)) e.classList.contains("qp-tab") || e.classList.add("qp-tab");
+	for (let e of u(n)) e.classList.contains("qp-panel") || e.classList.add("qp-panel");
+}
+function f(e, t, n) {
+	if (t.length === 0) return;
+	let r = Math.max(0, Math.min(n, t.length - 1));
+	for (let e = 0; e < t.length; e += 1) {
+		let n = t[e];
+		e === r ? (n.style.removeProperty("display"), n.removeAttribute("hidden")) : (n.style.display = "none", n.setAttribute("hidden", ""));
+	}
+	for (let t = 0; t < e.length; t += 1) {
+		let n = e[t], i = t === r;
+		n.setAttribute("aria-selected", i ? "true" : "false"), n.tabIndex = i ? 0 : -1;
+	}
+}
+function p(e, t, n) {
+	e.setAttribute("role", "tablist");
+	for (let e = 0; e < t.length; e += 1) {
+		let r = t[e], i = n[e];
+		r.setAttribute("role", "tab"), i && (i.id ||= `qp-tab-panel-${e}`, r.setAttribute("aria-controls", i.id), i.setAttribute("role", "tabpanel"), i.setAttribute("aria-labelledby", r.id || `qp-tab-${e}`), r.id || (r.id = `qp-tab-${e}`, i.setAttribute("aria-labelledby", r.id)));
+	}
+}
+//#endregion
+//#region src/tab/runtime/runtime.ts
+function m(e) {
+	return e.scopeRoot instanceof HTMLElement ? e.scopeRoot : null;
+}
+function h(e) {
+	let t = m(e);
+	if (!t) return null;
+	let n = s(t, e.wiring.tabList), r = c(t, e.wiring.panelList);
+	return !n || !r ? null : {
+		tabs: t,
+		tabList: n,
+		panelList: r
+	};
+}
+function g(r, i) {
+	e({
+		spec: n,
+		activeIndex: i,
+		roleLists: { [t.Tab]: r }
+	});
+}
+function _(e, t) {
+	let r = e.editorState?.[n.activeIndexStateKey];
+	if (r !== void 0) {
+		let e = Number(r);
+		return Number.isFinite(e) ? e : t;
+	}
+	let i = e.props.defaultIndex;
+	if (i !== void 0) {
+		let e = Number(i);
+		if (Number.isFinite(e)) return e;
+	}
+	return t;
+}
+function v(e) {
+	let t = e, n = h(e);
+	if (!n) return;
+	o();
+	let i = _(e, 0), a = [], s = [], c = null, m = (e) => {
+		d(e.tabs, e.tabList, e.panelList), a = l(e.tabList), s = u(e.panelList), p(e.tabList, a, s);
+	}, v = (e, t) => {
+		let n = h(e);
+		n && (m(n), s.length !== 0 && (i = Math.max(0, Math.min(t, s.length - 1)), f(a, s, i), g(a, i)));
+	}, y = (e) => {
+		if (!h(t)) return;
+		let n = e.target;
+		if (n instanceof Node) {
+			for (let [r, i] of a.entries()) if (i === n || i.contains(n)) {
+				e.preventDefault(), v(t, r);
+				return;
+			}
+		}
+	}, b = (e) => {
+		if (a.length === 0) return;
+		let n = i;
+		switch (e.key) {
+			case "ArrowRight":
+			case "ArrowDown":
+				n = i + 1;
+				break;
+			case "ArrowLeft":
+			case "ArrowUp":
+				n = i - 1;
+				break;
+			case "Home":
+				n = 0;
+				break;
+			case "End":
+				n = a.length - 1;
+				break;
+			default: return;
+		}
+		e.preventDefault(), v(t, n), a[i]?.focus();
+	}, x = (e) => {
+		let t = h(e);
+		t && c !== t.tabList && (c?.removeEventListener("click", y), c?.removeEventListener("keydown", b), c = t.tabList, c.addEventListener("click", y), c.addEventListener("keydown", b));
+	}, S = (e) => {
+		t = e;
+		let n = h(e);
+		n && (n.tabs.setAttribute(r, ""), m(n), x(e), i = _(e, i), v(e, i));
+	};
+	return x(e), S(e), {
+		update: (e) => {
+			S(e);
+		},
+		destroy: () => {
+			c?.removeEventListener("click", y), c?.removeEventListener("keydown", b), c = null, n.tabs.removeAttribute(r);
+		}
+	};
+}
+var y = { mount(e) {
+	return v(e);
+} };
+//#endregion
+export { y as default };

package/dist/tab.schema.json

@@ -0,0 +1,13 @@
+{
+  "$schema": "https://quickpage.dev/schemas/logic/v1",
+  "type": "object",
+  "properties": {
+    "defaultIndex": {
+      "type": "number",
+      "default": 0,
+      "minimum": 0,
+      "x-qp-control": "number",
+      "x-qp-label": "Starting tab for visitors"
+    }
+  }
+}

package/dist/tab.wiring.json

@@ -0,0 +1,16 @@
+{
+  "$schema": "https://quickpage.dev/schemas/wiring/v1",
+  "type": "object",
+  "properties": {
+    "tabList": {
+      "type": "string",
+      "x-qp-wire-kind": "node",
+      "x-qp-label": "Tab list"
+    },
+    "panelList": {
+      "type": "string",
+      "x-qp-wire-kind": "node",
+      "x-qp-label": "Panel list"
+    }
+  }
+}

package/package.json

@@ -1,6 +1,70 @@
 {
   "name": "@staging-apiplus/essentials",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.0.2",
+  "type": "module",
+  "scripts": {
+    "dev": "qp dev --port 5179 --host --open",
+    "validate": "qp validate",
+    "build": "qp build",
+    "publish:npm": "qp publish",
+    "publish:dev": "qp publish:dev",
+    "test:unit": "pnpm --filter @packages/qp-code-host exec vitest run --config ./vitest.example-gallery.config.ts"
+  },
+  "dependencies": {
+    "swiper": "^12.1.2"
+  },
+  "devDependencies": {
+    "@packages/qp-cli": "workspace:@packages/qp-cli@^0.0.1",
+    "@packages/qp-sdk": "workspace:@packages/qp-sdk@^0.0.1",
+    "@sveltejs/vite-plugin-svelte": "catalog:dev",
+    "svelte": "catalog:dev",
+    "tsx": "catalog:dev",
+    "typescript": "catalog:dev",
+    "vite": "catalog:dev"
+  },
+  "exports": {
+    "./gallery": {
+      "import": "./dist/gallery.js",
+      "quickpage": "./dist/gallery/package.json",
+      "default": "./dist/gallery.js"
+    },
+    "./dist/gallery/package.json": "./dist/gallery/package.json",
+    "./slider": {
+      "import": "./dist/slider.js",
+      "quickpage": "./dist/slider/package.json",
+      "default": "./dist/slider.js"
+    },
+    "./dist/slider/package.json": "./dist/slider/package.json",
+    "./tab": {
+      "import": "./dist/tab.js",
+      "quickpage": "./dist/tab/package.json",
+      "default": "./dist/tab.js"
+    },
+    "./dist/tab/package.json": "./dist/tab/package.json"
+  },
+  "files": [
+    "dist"
+  ],
+  "quickpage": {
+    "kind": "code-package",
+    "engine": "^1.0.0",
+    "manifest": "./dist/qp-package.json",
+    "modules": [
+      {
+        "id": "gallery",
+        "kind": "component",
+        "export": "./gallery"
+      },
+      {
+        "id": "slider",
+        "kind": "logic",
+        "export": "./slider"
+      },
+      {
+        "id": "tab",
+        "kind": "logic",
+        "export": "./tab"
+      }
+    ]
+  }
+}