@pie-element/ebsr 14.2.1 → 14.2.2-next.0

package/dist/browser/delivery/index.js

@@ -0,0 +1,133 @@
+import { i as e, t } from "../browser-CdX8WGiZ.js";
+import { t as n } from "../dist-DQkngCcw.js";
+import { t as r } from "../get-BfBCyZ1r.js";
+//#region src/delivery/index.tsx
+var i = /* @__PURE__ */ e(t(), 1), a = n.TYPE, o = "ebsr-multiple-choice", s = (0, i.default)("pie-elements:ebsr");
+customElements.get(o);
+var c = (e) => Array.isArray(e) && e.length > 0, l = (e) => {
+	let t = r(e, "value.partA.value"), n = r(e, "value.partB.value");
+	return c(t) && c(n);
+};
+function u(e) {
+	let t = e.closest("pie-player") || e.closest("pie-item-player");
+	if (!t) return {
+		baseHeadingLevel: void 0,
+		includeSrHeading: !0
+	};
+	let n = (e, n, r) => {
+		let i = t[e];
+		return i ??= t.getAttribute(n) ?? t.getAttribute(r), i;
+	}, r = n("baseHeadingLevel", "base-heading-level", "baseheadinglevel"), i = parseInt(r, 10), a = Number.isFinite(i) && i >= 1 && i <= 6 ? i : void 0, o = n("includeSrHeading", "include-sr-heading", "includesrheading");
+	return {
+		baseHeadingLevel: a,
+		includeSrHeading: o == null ? !0 : o !== !1 && o !== "false"
+	};
+}
+var d = class extends HTMLElement {
+	constructor() {
+		super(), this._model = {}, this._session = {};
+	}
+	onSessionUpdated = (e) => {
+		if (e.target === this) return;
+		e.preventDefault(), e.stopImmediatePropagation();
+		let t = e.target.getAttribute("id");
+		if (t) {
+			let n = `part${t.toUpperCase()}`;
+			e.update && (this._model[n] = e.update), this.dispatchSessionChanged(e.srcElement._session, n);
+		}
+	};
+	set model(e) {
+		this._model = e, customElements.whenDefined(o).then(() => {
+			this.setPartModel(this.partA, "partA"), this.setPartModel(this.partB, "partB");
+		});
+	}
+	set session(e) {
+		this._session = e, customElements.whenDefined(o).then(() => {
+			this.setPartSession(this.partA, "partA"), this.setPartSession(this.partB, "partB");
+		});
+	}
+	get session() {
+		return this._session;
+	}
+	setPartModel(e, t) {
+		if (this._model && this._model[t] && e) {
+			let { mode: n } = this._model;
+			e.model = {
+				...this._model[t],
+				mode: n,
+				keyMode: this._model[t].choicePrefix
+			};
+			let { includeSrHeading: r, baseHeadingLevel: i } = u(this);
+			e.includeSrHeading = r, e.baseHeadingLevel = i;
+		}
+	}
+	setPartSession(e, t) {
+		if (this._session && this._model && e) {
+			let { value: n } = this._session;
+			e.session = n && n[t] ? n[t] : { id: t };
+		}
+	}
+	dispatchSessionChanged(e, t) {
+		this._session.value = {
+			...this._session.value,
+			[t]: e
+		}, s("[onSessionChanged] session: ", this._session);
+		let r = l(this._session);
+		this.dispatchEvent(new n(this.tagName.toLowerCase(), r));
+	}
+	get partA() {
+		return this.querySelector(`${o}#a`);
+	}
+	get partB() {
+		return this.querySelector(`${o}#b`);
+	}
+	connectedCallback() {
+		this._render(), this._initPlayerObserver(), this.addEventListener(a, this.onSessionUpdated);
+	}
+	disconnectedCallback() {
+		this._disconnectPlayerObserver(), this.removeEventListener(a, this.onSessionUpdated);
+	}
+	_initPlayerObserver() {
+		let e = this.closest("pie-player") || this.closest("pie-item-player");
+		e && (this._playerObserver = new MutationObserver(() => {
+			this._render();
+		}), this._playerObserver.observe(e, {
+			attributes: !0,
+			attributeFilter: [
+				"base-heading-level",
+				"baseheadinglevel",
+				"include-sr-heading",
+				"includesrheading"
+			]
+		}));
+	}
+	_disconnectPlayerObserver() {
+		this._playerObserver &&= (this._playerObserver.disconnect(), null);
+	}
+	_render() {
+		this.ariaLabel = "Two-Part Question", this.role = "region";
+		let { baseHeadingLevel: e, includeSrHeading: t } = u(this), n = e ? `h${Math.min(6, e)}` : "h2", r = t ? `<${n} class="srOnly">Two-Part Question</${n}>` : "";
+		this.innerHTML = `
+      <style>
+        .srOnly {
+        position: absolute;
+        width: 1px;
+        height: 1px;
+        padding: 0;
+        margin: -1px;
+        overflow: hidden;
+        left: -10000px;
+        top: auto;
+      }
+      ${this._model?.extraCSSRules?.rules}
+      </style>
+        ${r}
+        <${o} id="a"></${o}>
+        <${o} id="b"></${o}>
+    `, customElements.get(o) && (this.setPartModel(this.partA, "partA"), this.setPartModel(this.partB, "partB"), this.setPartSession(this.partA, "partA"), this.setPartSession(this.partB, "partB"));
+	}
+};
+//#endregion
+export { d as default, l as isSessionComplete };
+
+//# sourceMappingURL=index.js.map

package/dist/browser/delivery/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/delivery/index.tsx"],"sourcesContent":["// @ts-nocheck\n/**\n * @synced-from pie-elements/packages/ebsr/src/index.js\n * @auto-generated\n *\n * This file is automatically synced from pie-elements and converted to TypeScript.\n * Manual edits will be overwritten on next sync.\n * To make changes, edit the upstream JavaScript file and run sync again.\n */\n\nimport { SessionChangedEvent } from '@pie-element/shared-player-events';\nimport MultipleChoice from '@pie-element/multiple-choice';\nimport { get } from 'lodash-es';\nimport debug from 'debug';\n\nconst SESSION_CHANGED = SessionChangedEvent.TYPE;\nconst MC_TAG_NAME = 'ebsr-multiple-choice';\nconst log = debug('pie-elements:ebsr');\n\nclass EbsrMC extends MultipleChoice {}\n\nconst defineMultipleChoice = () => {\n  if (!customElements.get(MC_TAG_NAME)) {\n    customElements.define(MC_TAG_NAME, EbsrMC);\n  }\n};\n\ndefineMultipleChoice();\n\nconst isNonEmptyArray = (a) => Array.isArray(a) && a.length > 0;\n\nexport const isSessionComplete = (session) => {\n  const a = get(session, 'value.partA.value');\n  const b = get(session, 'value.partB.value');\n\n  return isNonEmptyArray(a) && isNonEmptyArray(b);\n};\n\nfunction getPlayerAttributes(element) {\n  const player =\n    element.closest('pie-player') ||\n    element.closest('pie-item-player');\n\n  if (!player) {\n    return { baseHeadingLevel: undefined, includeSrHeading: true };\n  }\n\n  const getRaw = (camelCaseName, hyphenatedName, allLowerName) => {\n    let raw = player[camelCaseName];\n\n    // fallback in case someone sets via HTML attribute manually\n    if (raw == null) {\n      raw =\n        player.getAttribute(hyphenatedName) ??\n        player.getAttribute(allLowerName);\n    }\n\n    return raw;\n  };\n\n  const levelRaw = getRaw('baseHeadingLevel', 'base-heading-level', 'baseheadinglevel');\n  const level = parseInt(levelRaw, 10);\n  const baseHeadingLevel = Number.isFinite(level) && level >= 1 && level <= 6 ? level : undefined;\n\n  const srRaw = getRaw('includeSrHeading', 'include-sr-heading', 'includesrheading');\n  const includeSrHeading = srRaw == null ? true : srRaw !== false && srRaw !== 'false';\n\n  return { baseHeadingLevel, includeSrHeading };\n}\n\nexport default class Ebsr extends HTMLElement {\n  constructor() {\n    super();\n    this._model = {};\n    this._session = {};\n  }\n\n  onSessionUpdated: any = (e) => {\n    if (e.target === this) {\n      return;\n    }\n\n    e.preventDefault();\n    e.stopImmediatePropagation();\n\n    const id = e.target.getAttribute('id');\n\n    if (id) {\n      const key = `part${id.toUpperCase()}`;\n\n      if (e.update) {\n        this._model[key] = e.update;\n      }\n      //TODO: accessing a private property here. The session event should contain the update in future to prevent this.\n      this.dispatchSessionChanged(e.srcElement._session, key);\n    }\n  };\n\n  set model(m) {\n    this._model = m;\n\n    customElements.whenDefined(MC_TAG_NAME).then(() => {\n      this.setPartModel(this.partA, 'partA');\n      this.setPartModel(this.partB, 'partB');\n    });\n  }\n\n  set session(s) {\n    this._session = s;\n\n    customElements.whenDefined(MC_TAG_NAME).then(() => {\n      this.setPartSession(this.partA, 'partA');\n      this.setPartSession(this.partB, 'partB');\n    });\n  }\n\n  get session() {\n    return this._session;\n  }\n\n  setPartModel(part, key) {\n    if (this._model && this._model[key] && part) {\n      const { mode } = this._model;\n\n      part.model = {\n        ...this._model[key],\n        mode,\n        keyMode: this._model[key].choicePrefix,\n      };\n\n      // Parts of an EBSR item should not render their own SR headings —\n      // the EBSR element itself provides the item-level heading.\n      const { includeSrHeading, baseHeadingLevel } = getPlayerAttributes(this);\n      part.includeSrHeading = includeSrHeading;\n      part.baseHeadingLevel = baseHeadingLevel;\n    }\n  }\n\n  setPartSession(part, key) {\n    if (this._session && this._model && part) {\n      const { value } = this._session;\n      part.session = value && value[key] ? value[key] : { id: key };\n    }\n  }\n\n  dispatchSessionChanged(partSession, key) {\n    this._session.value = {\n      ...this._session.value,\n      [key]: partSession,\n    };\n\n    log('[onSessionChanged] session: ', this._session);\n    const complete = isSessionComplete(this._session);\n    this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), complete));\n  }\n\n  get partA() {\n    return this.querySelector(`${MC_TAG_NAME}#a`);\n  }\n\n  get partB() {\n    return this.querySelector(`${MC_TAG_NAME}#b`);\n  }\n\n  connectedCallback() {\n    this._render();\n    this._initPlayerObserver();\n    this.addEventListener(SESSION_CHANGED, this.onSessionUpdated);\n  }\n\n  disconnectedCallback() {\n    this._disconnectPlayerObserver();\n    this.removeEventListener(SESSION_CHANGED, this.onSessionUpdated);\n  }\n\n  _initPlayerObserver() {\n    const player = this.closest('pie-player') || this.closest('pie-item-player');\n    if (!player) return;\n\n    this._playerObserver = new MutationObserver(() => {\n      this._render();\n    });\n    this._playerObserver.observe(player, {\n      attributes: true,\n      attributeFilter: ['base-heading-level', 'baseheadinglevel', 'include-sr-heading', 'includesrheading'],\n    });\n  }\n\n  _disconnectPlayerObserver() {\n    if (this._playerObserver) {\n      this._playerObserver.disconnect();\n      this._playerObserver = null;\n    }\n  }\n\n  _render() {\n    this.ariaLabel = 'Two-Part Question';\n    this.role = 'region';\n\n    const { baseHeadingLevel: ebsrLevel, includeSrHeading } = getPlayerAttributes(this);\n    const headingTag = ebsrLevel ? `h${Math.min(6, ebsrLevel)}` : 'h2';\n    const srHeading = includeSrHeading ? `<${headingTag} class=\"srOnly\">Two-Part Question</${headingTag}>` : '';\n\n    this.innerHTML = `\n      <style>\n        .srOnly {\n        position: absolute;\n        width: 1px;\n        height: 1px;\n        padding: 0;\n        margin: -1px;\n        overflow: hidden;\n        left: -10000px;\n        top: auto;\n      }\n      ${this._model?.extraCSSRules?.rules}\n      </style>\n        ${srHeading}\n        <${MC_TAG_NAME} id=\"a\"></${MC_TAG_NAME}>\n        <${MC_TAG_NAME} id=\"b\"></${MC_TAG_NAME}>\n    `;\n\n    // when item is re-rendered (due to connectedCallback), if the custom element is already defined,\n    // we need to set the model and session, otherwise the setters are not reached again\n    if (customElements.get(MC_TAG_NAME)) {\n      this.setPartModel(this.partA, 'partA');\n      this.setPartModel(this.partB, 'partB');\n      this.setPartSession(this.partA, 'partA');\n      this.setPartSession(this.partB, 'partB');\n    }\n  }\n}\n"],"mappings":"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"}