lintje 0.1.1 → 0.3.0

package/dist-elements/chunks/{player-Bq9YGnpt.js → player-B8QXJ0Z5.js}

@@ -1,4 +1,4 @@
-import { Gt as e, Kt as t, U as n, Z as r, et as i, ut as a, zt as o } from "./base-rBLTcEIv.js";
+import { Jt as e, Q as t, bt as n, en as r, nn as i, st as a, ut as o } from "./base-CbmWxUig.js";
 import { a as s, h as c, i as l, l as u, m as d, s as f, t as p } from "./playback-DZJ_NMXv.js";
 //#region src/components/content/audio-player/player.ts
 var m = /* @__PURE__ */ new Set([
@@ -7,7 +7,7 @@ var m = /* @__PURE__ */ new Set([
 	"INPUT",
 	"TEXTAREA",
 	"A"
-]), h = class extends o {
+]), h = class extends e {
 	constructor(...e) {
 		super(...e), this.src = "", this.name = "", this.position = 0, this.heard = 0, this.playing = !1, this.ready = !1, this.failed = !1, this.mediaDuration = NaN, this.speed = 1, this.pendingSeek = null, this.limit = new p(), this.listening = null, this.onMetadata = () => {
 			let e = this.media;
@@ -19,8 +19,8 @@ var m = /* @__PURE__ */ new Set([
 			let e = this.media;
 			if (!e) return;
 			this.position = e.currentTime;
-			let t = this.renderRoot.querySelector("[role=\"slider\"][aria-label=\"Positie\"]");
-			(!t || !n(t)) && (this.heard = this.position), this.report(!1);
+			let n = this.renderRoot.querySelector("[role=\"slider\"][aria-label=\"Positie\"]");
+			(!n || !t(n)) && (this.heard = this.position), this.report(!1);
 		}, this.onSeeked = () => {
 			let e = this.media;
 			e && (this.position = e.currentTime, this.heard = this.position, this.report(!0));
@@ -132,41 +132,41 @@ var m = /* @__PURE__ */ new Set([
 		this.ready && t.hasPointerCapture?.(e.pointerId) && this.seekFromPointer(e);
 	}
 	renderPlay() {
-		let n = this.playing ? "Pauzeren" : "Afspelen", a = !this.ready;
-		return t`<button
+		let e = this.playing ? "Pauzeren" : "Afspelen", t = !this.ready;
+		return i`<button
       type="button"
-      class=${r({
+      class=${a({
 			"lintje-button": !0,
 			"lintje-button--primary": !0,
 			"lintje-player__play": !0,
-			"is-disabled": a
+			"is-disabled": t
 		})}
-      aria-label=${n}
-      title=${n}
-      aria-disabled=${a ? "true" : e}
+      aria-label=${e}
+      title=${e}
+      aria-disabled=${t ? "true" : r}
       @click=${() => {
-			a || this.toggle();
+			t || this.toggle();
 		}}
     >
-      ${i(this.playing ? "multimedia-player-pauze" : "multimedia-player-afspelen", { size: 20 })}
+      ${o(this.playing ? "multimedia-player-pauze" : "multimedia-player-afspelen", { size: 20 })}
     </button>`;
 	}
-	renderIconButton(n, r, a, o = {}) {
-		let s = o.disabled ?? !this.ready;
-		return t`<button
+	renderIconButton(e, t, n, a = {}) {
+		let s = a.disabled ?? !this.ready;
+		return i`<button
       type="button"
-      class="lintje-icon-button lintje-icon-button--flat lintje-player__icon-button ${s ? "is-disabled" : ""} ${o.className ?? ""}"
-      aria-label=${r}
-      title=${r}
-      aria-pressed=${o.pressed === void 0 ? e : String(o.pressed)}
-      aria-disabled=${s ? "true" : e}
+      class="lintje-icon-button lintje-icon-button--flat lintje-player__icon-button ${s ? "is-disabled" : ""} ${a.className ?? ""}"
+      aria-label=${t}
+      title=${t}
+      aria-pressed=${a.pressed === void 0 ? r : String(a.pressed)}
+      aria-disabled=${s ? "true" : r}
       @click=${() => {
-			s || a();
+			s || n();
 		}}
     >
-      ${i(n, {
+      ${o(e, {
 			size: 20,
-			flip: o.flip ? "horizontal" : void 0
+			flip: a.flip ? "horizontal" : void 0
 		})}
     </button>`;
 	}
@@ -174,9 +174,9 @@ var m = /* @__PURE__ */ new Set([
 		return c(this.heard, this.length);
 	}
 	renderBar() {
-		let n = this.length, i = f(this.position, n) * 100;
-		return t`<div
-      class=${r({
+		let e = this.length, t = f(this.position, e) * 100;
+		return i`<div
+      class=${a({
 			"lintje-player__bar": !0,
 			"is-disabled": !this.ready
 		})}
@@ -184,24 +184,24 @@ var m = /* @__PURE__ */ new Set([
       tabindex=${this.ready ? "0" : "-1"}
       aria-label="Positie"
       aria-valuemin="0"
-      aria-valuemax=${Math.round(n)}
+      aria-valuemax=${Math.round(e)}
       aria-valuenow=${Math.round(this.heard)}
       aria-valuetext=${this.sliderLabel()}
-      aria-disabled=${this.ready ? e : "true"}
+      aria-disabled=${this.ready ? r : "true"}
       @keydown=${this.onSliderKeydown}
       @pointerdown=${this.onSliderPointerDown}
       @pointermove=${this.onSliderPointerMove}
     >
-      <div class="lintje-player__bar-fill" ${a({ width: `${i}%` })}></div>
-      <div class="lintje-player__bar-handle" ${a({ left: `${i}%` })}></div>
+      <div class="lintje-player__bar-fill" ${n({ width: `${t}%` })}></div>
+      <div class="lintje-player__bar-handle" ${n({ left: `${t}%` })}></div>
     </div>`;
 	}
 	renderTime(e) {
-		let n = s(this.length);
-		return e ? t`<span class="lintje-player__time"
+		let t = s(this.length);
+		return e ? i`<span class="lintje-player__time"
       ><strong class="lintje-player__position">${s(this.position)}</strong>
-      <span class="lintje-player__duration">/ ${n}</span></span
-    >` : t`<span class="lintje-player__time is-muted">${n}</span>`;
+      <span class="lintje-player__duration">/ ${t}</span></span
+    >` : i`<span class="lintje-player__time is-muted">${t}</span>`;
 	}
 }, g = "/*\n * The parts both players draw (`player.ts`). Adopted next to `button.css` and `icon-button.css`,\n * which draw the buttons and their disabled look; this sheet only sizes them.\n */\n\n/* ------------------------------------------------------------------------ */\n\n.lintje-player__media { display: none; }\n\n.lintje-player__play { width: var(--h-touch); height: var(--h-touch); padding: 0; flex: none; }\n\n.lintje-player__icon-button { width: var(--h-touch); height: var(--h-touch); }\n\n.lintje-player__time {\n  flex: none;\n  font: var(--text-ui);\n  font-variant-numeric: tabular-nums;\n  white-space: nowrap;\n  color: var(--color-text-primary);\n}\n.lintje-player__position { font-weight: 700; }\n.lintje-player__duration,\n.lintje-player__time.is-muted { color: var(--color-text-muted); }\n\n/* A transparent area above and below the line takes the pointer, never beside it. */\n.lintje-player__bar {\n  position: relative;\n  flex: 1 1 140px;\n  min-width: 0;\n  height: 6px;\n  background: var(--color-border-default);\n  cursor: pointer;\n  touch-action: none;\n}\n.lintje-player__bar::before {\n  content: '';\n  position: absolute;\n  inset: calc((100% - var(--h-target)) / 2) 0;\n}\n.lintje-player__bar.is-disabled { cursor: not-allowed; }\n.lintje-player__bar-fill {\n  height: 100%;\n  background: var(--color-accent-line);\n  pointer-events: none;\n}\n/* The head marks where the recording stands, drawn as the audio player's (`__head`). */\n.lintje-player__bar-handle {\n  position: absolute;\n  top: 50%;\n  width: var(--space-1);\n  height: var(--space-4);\n  transform: translate(-50%, -50%);\n  background: var(--color-text-primary);\n  pointer-events: none;\n}\n.lintje-player__bar.is-disabled .lintje-player__bar-handle { display: none; }\n\n/* Forced colours drop fills; the track and stretch keep their drawing in system colours. */\n@media (forced-colors: active) {\n  .lintje-player__bar,\n  .lintje-player__bar-fill,\n  .lintje-player__bar-handle { forced-color-adjust: none; }\n  .lintje-player__bar { background: CanvasText; }\n  .lintje-player__bar-fill { background: Highlight; }\n  .lintje-player__bar-handle { background: Highlight; outline: 1px solid Canvas; }\n  .lintje-player__bar.is-disabled,\n  .lintje-player__bar.is-disabled .lintje-player__bar-fill { background: GrayText; }\n}\n";
 //#endregion

package/dist-elements/chunks/{sentence-CLNJOeXz.js → sentence-B19AyZBS.js}

@@ -1,4 +1,4 @@
-import { Gt as e, Kt as t, et as n } from "./base-rBLTcEIv.js";
+import { en as e, nn as t, ut as n } from "./base-CbmWxUig.js";
 //#region src/components/filters/shared/sentence.ts
 function r(r, i = !0) {
 	return t`${i ? n("lichaam-oog", {