@pie-players/pie-assessment-toolkit 0.3.53 → 0.3.54

package/README.md

@@ -609,7 +609,7 @@ tools: {
       enabled: true,
       backend: "browser",
       settings: {
-        speedOptions: [2, 1.25, 1.5] // rendered in this order
+        speedOptions: [2, 1.25, 1.5] // host options keep this order; Normal is added if omitted
       }
     }
   }
@@ -630,6 +630,7 @@ tools: {
       settings: {
         speedOptions: [
           { rate: 0.8, label: "Slow", ariaLabel: "Slow speed" },
+          { rate: 1, label: "Normal", ariaLabel: "Normal speed", default: true },
           { rate: 1.5, label: "Fast", ariaLabel: "Fast speed" }
         ]
       }
@@ -640,14 +641,20 @@ tools: {
 
 `speedOptions` semantics:
 
-- Omitted or non-array: default speed buttons are shown (`0.8x`, `1.25x`).
-- Explicit empty array (`[]`): hide all speed buttons.
-- Invalid-only arrays (for example `["fast", -1, 1]`): fall back to defaults.
+- Omitted or non-array: default speed choices are shown (`Slow`, `Normal`, `Fast`), with `Normal` selected.
+- Explicit empty array (`[]`): hide all speed choices and reset playback speed to `1.0`.
+- Invalid-only arrays (for example `["fast", -1]`): fall back to defaults.
 - Valid numeric values are deduplicated and keep first-seen order.
 - Object-form entries use the same numeric validation/deduping by `rate`.
 - Missing labels fall back to numeric text like `1.5x`; missing `ariaLabel`
   falls back to a matching accessible name like `Fast speed`.
-- `1` is excluded (normal speed is already available by toggling active speed off).
+- `1` is a visible `Normal` choice. If a non-empty config omits `1`, PIE adds
+  `Normal` at the natural point in the speed scale while preserving the
+  relative order of host-provided options.
+- Speed choices are exposed as a `Playback speed` radio group: one option is
+  always selected, and choosing the already-selected speed is a no-op.
+- If only one speed option remains, the speed group is hidden by default. Set
+  `showSingleSpeedOption: true` in TTS settings to surface that one-option state.
 
 ### Runtime Fallback: Server TTS -> Browser TTS
 

package/dist/components/ItemToolBar.custom-element.js

@@ -6809,7 +6809,11 @@ var calculatorToolRegistration = {
             minWidth: 380,
             minHeight: 420,
             initialAlign: "bottom-right",
-            initialMargin: 16
+            initialMargin: 16,
+            content: {
+              overflowY: "auto",
+              preserveMinHeight: true
+            }
           }
         }
       ],
@@ -6871,12 +6875,16 @@ var isServerBackend = (backend) => backend === "polly" || backend === "google" |
 var withDefault = (value, fallback2) => value === undefined ? fallback2 : value;
 var normalizeTTSLayoutMode = (value, fallback2 = "left-aligned") => typeof value === "string" && VALID_TTS_LAYOUT_MODES.has(value) ? value : fallback2;
 var DEFAULT_TTS_SPEED_OPTIONS = Object.freeze([0.8, 1.25]);
-var normalizeSpeedRate = (entry) => {
+var DEFAULT_TTS_SPEED_CONTROL_OPTIONS = Object.freeze([
+  { rate: 0.8, label: "Slow", ariaLabel: "Slow speed" },
+  { rate: 1, label: "Normal", ariaLabel: "Normal speed", default: true },
+  { rate: 1.25, label: "Fast", ariaLabel: "Fast speed" }
+]);
+var normalizeControlSpeedRate = (entry) => {
   if (typeof entry !== "number" || !Number.isFinite(entry) || entry <= 0) {
     return;
   }
-  const rounded = Math.round(entry * 100) / 100;
-  return rounded === 1 ? undefined : rounded;
+  return Math.round(entry * 100) / 100;
 };
 var trimOptionalText = (value) => {
   if (typeof value !== "string")
@@ -6885,7 +6893,7 @@ var trimOptionalText = (value) => {
   return trimmed.length ? trimmed : undefined;
 };
 var formatSpeedLabel = (rate) => `${rate}x`;
-var formatSpeedAriaLabel = (label, usedDefaultLabel) => usedDefaultLabel ? `Speed ${label}` : `${label} speed`;
+var formatSpeedAriaLabel = (label, usedDefaultLabel) => label.toLowerCase() === "normal" ? "Normal speed" : usedDefaultLabel ? `Speed ${label}` : `${label} speed`;
 var normalizeSpeedAriaLabel = (label, ariaLabel, usedDefaultLabel) => {
   if (!ariaLabel)
     return formatSpeedAriaLabel(label, usedDefaultLabel);
@@ -6893,59 +6901,55 @@ var normalizeSpeedAriaLabel = (label, ariaLabel, usedDefaultLabel) => {
     return ariaLabel;
   return `${label} ${ariaLabel}`;
 };
-var normalizeTTSSpeedOptionConfig = (entry) => {
-  if (typeof entry === "number")
-    return normalizeSpeedRate(entry);
-  if (!entry || typeof entry !== "object" || Array.isArray(entry))
-    return;
-  const record = entry;
-  const rate = normalizeSpeedRate(record.rate);
-  if (rate === undefined)
-    return;
-  const label = trimOptionalText(record.label);
-  const ariaLabel = trimOptionalText(record.ariaLabel);
-  return {
-    rate,
-    ...label ? { label } : {},
-    ...ariaLabel ? { ariaLabel } : {}
-  };
-};
-var normalizeTTSSpeedOptionConfigs = (value) => {
-  if (!Array.isArray(value))
-    return [...DEFAULT_TTS_SPEED_OPTIONS];
-  if (value.length === 0)
+var normalizeTTSSpeedControlOptions = (value) => {
+  const input = Array.isArray(value) ? value : [...DEFAULT_TTS_SPEED_CONTROL_OPTIONS];
+  if (input.length === 0)
     return [];
   const dedupedRates = new Set;
   const normalized = [];
-  for (const entry of value) {
-    const option = normalizeTTSSpeedOptionConfig(entry);
-    if (option === undefined)
-      continue;
-    const rate = typeof option === "number" ? option : option.rate;
-    if (dedupedRates.has(rate))
+  for (const entry of input) {
+    const record = toRecord(entry);
+    const rate = typeof entry === "number" ? normalizeControlSpeedRate(entry) : normalizeControlSpeedRate(record.rate);
+    if (rate === undefined || dedupedRates.has(rate))
       continue;
     dedupedRates.add(rate);
-    normalized.push(option);
+    const defaultLabel = rate === 1 ? "Normal" : typeof entry === "number" ? formatSpeedLabel(rate) : formatSpeedLabel(rate);
+    const label = typeof entry === "number" ? defaultLabel : trimOptionalText(record.label) || defaultLabel;
+    const ariaLabel = typeof entry === "number" ? rate === 1 ? "Normal speed" : formatSpeedAriaLabel(label, true) : normalizeSpeedAriaLabel(label, trimOptionalText(record.ariaLabel), label === defaultLabel);
+    normalized.push({
+      rate,
+      label,
+      ariaLabel,
+      isDefault: false,
+      requestedDefault: record.default === true || record.isDefault === true
+    });
   }
-  return normalized.length ? normalized : [...DEFAULT_TTS_SPEED_OPTIONS];
-};
-var normalizeTTSSpeedControlOptions = (value) => normalizeTTSSpeedOptionConfigs(value).map((option) => {
-  if (typeof option === "number") {
-    const label2 = formatSpeedLabel(option);
-    return {
-      rate: option,
-      label: label2,
-      ariaLabel: formatSpeedAriaLabel(label2, true)
+  if (!normalized.length) {
+    return normalizeTTSSpeedControlOptions(DEFAULT_TTS_SPEED_CONTROL_OPTIONS);
+  }
+  if (!dedupedRates.has(1)) {
+    const normalOption = {
+      rate: 1,
+      label: "Normal",
+      ariaLabel: "Normal speed",
+      isDefault: false,
+      requestedDefault: false
     };
+    const firstFasterIndex = normalized.findIndex((option) => option.rate > 1);
+    if (firstFasterIndex >= 0) {
+      normalized.splice(firstFasterIndex, 0, normalOption);
+    } else {
+      normalized.push(normalOption);
+    }
   }
-  const defaultLabel = formatSpeedLabel(option.rate);
-  const label = option.label || defaultLabel;
-  return {
-    rate: option.rate,
-    label,
-    ariaLabel: normalizeSpeedAriaLabel(label, option.ariaLabel, label === defaultLabel)
-  };
-});
+  const requestedDefaultIndex = normalized.findIndex((option) => option.requestedDefault);
+  const defaultIndex = requestedDefaultIndex >= 0 ? requestedDefaultIndex : normalized.findIndex((option) => option.rate === 1);
+  return normalized.map(({ requestedDefault: _requestedDefault, ...option }, index2) => ({
+    ...option,
+    isDefault: index2 === defaultIndex
+  }));
+};
+var DEFAULT_TTS_SPEED_CONTROL_RATES = Object.freeze([0.8, 1, 1.25]);
 var applyRuntimeDefaults = (config) => {
   const withLayoutDefaults = {
     ...config,
@@ -7102,7 +7106,7 @@ var ttsToolRegistration = {
         settings.layoutMode = normalizeTTSLayoutMode(settings.layoutMode);
       }
       if (settings && "speedOptions" in settings) {
-        settings.speedOptions = normalizeTTSSpeedOptionConfigs(settings.speedOptions);
+        settings.speedOptions = normalizeTTSSpeedControlOptions(settings.speedOptions);
       }
       const normalizedConfig = {
         ...config
@@ -7111,7 +7115,7 @@ var ttsToolRegistration = {
         normalizedConfig.layoutMode = normalizeTTSLayoutMode(normalizedConfig.layoutMode);
       }
       if ("speedOptions" in normalizedConfig) {
-        normalizedConfig.speedOptions = normalizeTTSSpeedOptionConfigs(normalizedConfig.speedOptions);
+        normalizedConfig.speedOptions = normalizeTTSSpeedControlOptions(normalizedConfig.speedOptions);
       }
       if (settings) {
         normalizedConfig.settings = settings;
@@ -7164,6 +7168,7 @@ var ttsToolRegistration = {
       element2.setAttribute("size", resolveControlSize());
       element2.setAttribute("layout-mode", resolveLayoutMode());
       element2.speedOptions = resolveElementSpeedOptions();
+      element2.showSingleSpeedOption = resolveRuntimeSettings().showSingleSpeedOption === true;
       return element2;
     };
     const hostLayout = resolveHostLayout();
@@ -7201,6 +7206,7 @@ var ttsToolRegistration = {
         element2.setAttribute("size", resolveControlSize());
         element2.setAttribute("layout-mode", resolveLayoutMode());
         element2.speedOptions = resolveElementSpeedOptions();
+        element2.showSingleSpeedOption = resolveRuntimeSettings().showSingleSpeedOption === true;
       }
     };
   }
@@ -9411,6 +9417,38 @@ function ItemToolBar($$anchor, $$props) {
         shellEl.style.overflowY = "visible";
       }
     };
+    const getContentOverflowY = () => currentArgs.mounted.entry.shell?.content?.overflowY === "auto" ? "auto" : "hidden";
+    const getHeaderHeight = () => {
+      if (!headerEl)
+        return 0;
+      const rectHeight = headerEl.getBoundingClientRect().height;
+      if (rectHeight > 0)
+        return rectHeight;
+      return headerEl.offsetHeight || 0;
+    };
+    const applyContentLayout = () => {
+      if (!contentEl)
+        return;
+      const shellConfig = currentArgs.mounted.entry.shell;
+      contentEl.style.overflowX = "hidden";
+      contentEl.style.overflowY = getContentOverflowY();
+      if (!mountedContentElement)
+        return;
+      if (shellConfig?.content?.preserveMinHeight === true) {
+        const headerHeight = getHeaderHeight();
+        const shellMinHeight = shellConfig.minHeight ?? 240;
+        const contentMinHeight = Math.max(0, shellMinHeight - headerHeight);
+        const availableHeight = Math.max(0, height - headerHeight);
+        const elementHeight = Math.max(availableHeight, contentMinHeight);
+        mountedContentElement.style.height = `${elementHeight}px`;
+        mountedContentElement.style.minHeight = "0";
+        mountedContentElement.style.flex = `0 0 ${elementHeight}px`;
+        return;
+      }
+      mountedContentElement.style.height = "100%";
+      mountedContentElement.style.minHeight = "0";
+      mountedContentElement.style.flex = "1 1 auto";
+    };
     const applyPositionAndSize = () => {
       const { minWidth, minHeight, maxWidth, maxHeight } = getShellBounds();
       const effectiveMinWidth = Math.min(minWidth, window.innerWidth);
@@ -9421,6 +9459,7 @@ function ItemToolBar($$anchor, $$props) {
       y2 = clamp(y2, 0, Math.max(0, window.innerHeight - height));
       applyShellStyle();
       applyContentMinWidth();
+      applyContentLayout();
       notifyHostedResize();
     };
     const moveBy = (dx, dy) => {
@@ -9521,7 +9560,6 @@ function ItemToolBar($$anchor, $$props) {
       element2.style.height = "100%";
       element2.style.flex = "1 1 auto";
       element2.style.minHeight = "0";
-      applyContentMinWidth();
       if (mountedContentElement && mountedContentElement !== element2) {
         if (mountedContentElement.parentNode === contentEl) {
           invokeElementUnmount(mountedContentElement);
@@ -9536,6 +9574,8 @@ function ItemToolBar($$anchor, $$props) {
         contentEl.appendChild(element2);
       }
       mountedContentElement = element2;
+      applyContentMinWidth();
+      applyContentLayout();
       notifyHostedMount(element2);
     };
     const bringToFront = () => {
@@ -9805,6 +9845,7 @@ function ItemToolBar($$anchor, $$props) {
         }
         applyShellStyle();
         applyContentMinWidth();
+        applyContentLayout();
         notifyHostedResize();
       }
     };
@@ -10017,7 +10058,8 @@ function ItemToolBar($$anchor, $$props) {
       contentEl.style.width = "100%";
       contentEl.style.flex = "1 1 auto";
       contentEl.style.minHeight = "0";
-      contentEl.style.overflow = "hidden";
+      contentEl.style.overflowX = "hidden";
+      contentEl.style.overflowY = getContentOverflowY();
       contentEl.style.borderRadius = "0 0 12px 12px";
       if (isCalculatorShell) {
         const makeFocusGuard = (label) => {
@@ -10135,8 +10177,8 @@ function ItemToolBar($$anchor, $$props) {
         titleEl.textContent = currentArgs.mounted.entry.shell?.title || currentArgs.mounted.toolId;
         const closeButtonOpenDisplay = currentArgs.mounted.toolId === "calculator" ? "inline-block" : "inline-flex";
         closeButtonEl.style.display = currentArgs.mounted.entry.shell?.closeable === false ? "none" : closeButtonOpenDisplay;
-        mountContent();
         applyShellStyle();
+        mountContent();
         notifyHostedResize();
         if (!previousActive && currentArgs.active) {
           installFocusTrap();

package/dist/components/PieAssessmentToolkit.custom-element.js

@@ -18666,7 +18666,11 @@ var calculatorToolRegistration = {
             minWidth: 380,
             minHeight: 420,
             initialAlign: "bottom-right",
-            initialMargin: 16
+            initialMargin: 16,
+            content: {
+              overflowY: "auto",
+              preserveMinHeight: true
+            }
           }
         }
       ],
@@ -18971,12 +18975,16 @@ var isServerBackend = (backend) => backend === "polly" || backend === "google" |
 var withDefault = (value, fallback2) => value === undefined ? fallback2 : value;
 var normalizeTTSLayoutMode = (value, fallback2 = "left-aligned") => typeof value === "string" && VALID_TTS_LAYOUT_MODES.has(value) ? value : fallback2;
 var DEFAULT_TTS_SPEED_OPTIONS = Object.freeze([0.8, 1.25]);
-var normalizeSpeedRate = (entry) => {
+var DEFAULT_TTS_SPEED_CONTROL_OPTIONS = Object.freeze([
+  { rate: 0.8, label: "Slow", ariaLabel: "Slow speed" },
+  { rate: 1, label: "Normal", ariaLabel: "Normal speed", default: true },
+  { rate: 1.25, label: "Fast", ariaLabel: "Fast speed" }
+]);
+var normalizeControlSpeedRate = (entry) => {
   if (typeof entry !== "number" || !Number.isFinite(entry) || entry <= 0) {
     return;
   }
-  const rounded = Math.round(entry * 100) / 100;
-  return rounded === 1 ? undefined : rounded;
+  return Math.round(entry * 100) / 100;
 };
 var trimOptionalText = (value) => {
   if (typeof value !== "string")
@@ -18985,7 +18993,7 @@ var trimOptionalText = (value) => {
   return trimmed.length ? trimmed : undefined;
 };
 var formatSpeedLabel = (rate) => `${rate}x`;
-var formatSpeedAriaLabel = (label, usedDefaultLabel) => usedDefaultLabel ? `Speed ${label}` : `${label} speed`;
+var formatSpeedAriaLabel = (label, usedDefaultLabel) => label.toLowerCase() === "normal" ? "Normal speed" : usedDefaultLabel ? `Speed ${label}` : `${label} speed`;
 var normalizeSpeedAriaLabel = (label, ariaLabel, usedDefaultLabel) => {
   if (!ariaLabel)
     return formatSpeedAriaLabel(label, usedDefaultLabel);
@@ -18993,59 +19001,55 @@ var normalizeSpeedAriaLabel = (label, ariaLabel, usedDefaultLabel) => {
     return ariaLabel;
   return `${label} ${ariaLabel}`;
 };
-var normalizeTTSSpeedOptionConfig = (entry) => {
-  if (typeof entry === "number")
-    return normalizeSpeedRate(entry);
-  if (!entry || typeof entry !== "object" || Array.isArray(entry))
-    return;
-  const record = entry;
-  const rate = normalizeSpeedRate(record.rate);
-  if (rate === undefined)
-    return;
-  const label = trimOptionalText(record.label);
-  const ariaLabel = trimOptionalText(record.ariaLabel);
-  return {
-    rate,
-    ...label ? { label } : {},
-    ...ariaLabel ? { ariaLabel } : {}
-  };
-};
-var normalizeTTSSpeedOptionConfigs = (value) => {
-  if (!Array.isArray(value))
-    return [...DEFAULT_TTS_SPEED_OPTIONS];
-  if (value.length === 0)
+var normalizeTTSSpeedControlOptions = (value) => {
+  const input = Array.isArray(value) ? value : [...DEFAULT_TTS_SPEED_CONTROL_OPTIONS];
+  if (input.length === 0)
     return [];
   const dedupedRates = new Set;
   const normalized = [];
-  for (const entry of value) {
-    const option = normalizeTTSSpeedOptionConfig(entry);
-    if (option === undefined)
-      continue;
-    const rate = typeof option === "number" ? option : option.rate;
-    if (dedupedRates.has(rate))
+  for (const entry of input) {
+    const record = toRecord(entry);
+    const rate = typeof entry === "number" ? normalizeControlSpeedRate(entry) : normalizeControlSpeedRate(record.rate);
+    if (rate === undefined || dedupedRates.has(rate))
       continue;
     dedupedRates.add(rate);
-    normalized.push(option);
+    const defaultLabel = rate === 1 ? "Normal" : typeof entry === "number" ? formatSpeedLabel(rate) : formatSpeedLabel(rate);
+    const label = typeof entry === "number" ? defaultLabel : trimOptionalText(record.label) || defaultLabel;
+    const ariaLabel = typeof entry === "number" ? rate === 1 ? "Normal speed" : formatSpeedAriaLabel(label, true) : normalizeSpeedAriaLabel(label, trimOptionalText(record.ariaLabel), label === defaultLabel);
+    normalized.push({
+      rate,
+      label,
+      ariaLabel,
+      isDefault: false,
+      requestedDefault: record.default === true || record.isDefault === true
+    });
   }
-  return normalized.length ? normalized : [...DEFAULT_TTS_SPEED_OPTIONS];
-};
-var normalizeTTSSpeedControlOptions = (value) => normalizeTTSSpeedOptionConfigs(value).map((option) => {
-  if (typeof option === "number") {
-    const label2 = formatSpeedLabel(option);
-    return {
-      rate: option,
-      label: label2,
-      ariaLabel: formatSpeedAriaLabel(label2, true)
+  if (!normalized.length) {
+    return normalizeTTSSpeedControlOptions(DEFAULT_TTS_SPEED_CONTROL_OPTIONS);
+  }
+  if (!dedupedRates.has(1)) {
+    const normalOption = {
+      rate: 1,
+      label: "Normal",
+      ariaLabel: "Normal speed",
+      isDefault: false,
+      requestedDefault: false
     };
+    const firstFasterIndex = normalized.findIndex((option) => option.rate > 1);
+    if (firstFasterIndex >= 0) {
+      normalized.splice(firstFasterIndex, 0, normalOption);
+    } else {
+      normalized.push(normalOption);
+    }
   }
-  const defaultLabel = formatSpeedLabel(option.rate);
-  const label = option.label || defaultLabel;
-  return {
-    rate: option.rate,
-    label,
-    ariaLabel: normalizeSpeedAriaLabel(label, option.ariaLabel, label === defaultLabel)
-  };
-});
+  const requestedDefaultIndex = normalized.findIndex((option) => option.requestedDefault);
+  const defaultIndex = requestedDefaultIndex >= 0 ? requestedDefaultIndex : normalized.findIndex((option) => option.rate === 1);
+  return normalized.map(({ requestedDefault: _requestedDefault, ...option }, index2) => ({
+    ...option,
+    isDefault: index2 === defaultIndex
+  }));
+};
+var DEFAULT_TTS_SPEED_CONTROL_RATES = Object.freeze([0.8, 1, 1.25]);
 var applyRuntimeDefaults = (config) => {
   const withLayoutDefaults = {
     ...config,
@@ -19202,7 +19206,7 @@ var ttsToolRegistration = {
         settings.layoutMode = normalizeTTSLayoutMode(settings.layoutMode);
       }
       if (settings && "speedOptions" in settings) {
-        settings.speedOptions = normalizeTTSSpeedOptionConfigs(settings.speedOptions);
+        settings.speedOptions = normalizeTTSSpeedControlOptions(settings.speedOptions);
       }
       const normalizedConfig = {
         ...config
@@ -19211,7 +19215,7 @@ var ttsToolRegistration = {
         normalizedConfig.layoutMode = normalizeTTSLayoutMode(normalizedConfig.layoutMode);
       }
       if ("speedOptions" in normalizedConfig) {
-        normalizedConfig.speedOptions = normalizeTTSSpeedOptionConfigs(normalizedConfig.speedOptions);
+        normalizedConfig.speedOptions = normalizeTTSSpeedControlOptions(normalizedConfig.speedOptions);
       }
       if (settings) {
         normalizedConfig.settings = settings;
@@ -19264,6 +19268,7 @@ var ttsToolRegistration = {
       element2.setAttribute("size", resolveControlSize());
       element2.setAttribute("layout-mode", resolveLayoutMode());
       element2.speedOptions = resolveElementSpeedOptions();
+      element2.showSingleSpeedOption = resolveRuntimeSettings().showSingleSpeedOption === true;
       return element2;
     };
     const hostLayout = resolveHostLayout();
@@ -19301,6 +19306,7 @@ var ttsToolRegistration = {
         element2.setAttribute("size", resolveControlSize());
         element2.setAttribute("layout-mode", resolveLayoutMode());
         element2.speedOptions = resolveElementSpeedOptions();
+        element2.showSingleSpeedOption = resolveRuntimeSettings().showSingleSpeedOption === true;
       }
     };
   }