@intellectif/lk-react 6.1.0 → 7.0.0

package/dist/theme/skin.css

@@ -174,7 +174,7 @@
     transition: var(--lk-transition-fast);
   }
 
-  .lk-mc-option:hover {
+  .lk-mc-option:not([data-correct]):hover {
     border-color: var(--lk-color-primary);
     background: var(--lk-color-surface-raised);
   }
@@ -188,14 +188,68 @@
     cursor: default;
   }
 
+  .lk-mc-option > span:first-of-type {
+    flex: 1 1 0%;
+    min-inline-size: 12ch;
+    overflow-wrap: anywhere;
+  }
+
+  /* -- Post-submit marking ---------------------------------------------
+     Hue says correctness; weight says whether the LEARNER chose it. Both
+     correct states are green, because it is the same fact, but only the
+     chosen one is filled, so "you got it" and "the key was here" cannot be
+     confused. The glyphs exist for WCAG 1.4.1: colour must not be the only
+     carrier, and the component emits no correctness text of its own. They
+     are declared decorative (the `/ ""` alt text) because the translatable
+     announcement belongs to the component, not to a stylesheet that would
+     bake English into every locale. */
+
+  /* The answer was here and the learner did not pick it: outlined, not filled. */
   .lk-mc-option[data-correct="true"] {
     border-color: var(--lk-color-success);
+    border-style: dashed;
+    box-shadow: none;
+  }
+
+  .lk-mc-option[data-correct="true"]::after {
+    content: "○" / "";
+    margin-inline-start: auto;
+    font-weight: var(--lk-font-weight-bold);
+    color: var(--lk-color-success);
+  }
+
+  /* Chosen AND right: the strongest mark. At (0,3,1) this outranks
+     `:has(input:checked)`, which is the whole reason it has to exist. */
+  .lk-mc-option[data-correct="true"]:has(input:checked) {
+    border-color: var(--lk-color-success);
+    border-style: solid;
     box-shadow: inset 0 0 0 1px var(--lk-color-success);
+    background: color-mix(in srgb, var(--lk-color-success) 10%, var(--lk-color-surface));
   }
 
+  .lk-mc-option[data-correct="true"]:has(input:checked)::after {
+    content: "✓" / "";
+  }
+
+  /* Chosen and wrong. */
   .lk-mc-option[data-correct="false"]:has(input:checked) {
     border-color: var(--lk-color-error);
     box-shadow: inset 0 0 0 1px var(--lk-color-error);
+    background: color-mix(in srgb, var(--lk-color-error) 8%, var(--lk-color-surface));
+  }
+
+  .lk-mc-option[data-correct="false"]:has(input:checked)::after {
+    content: "✗" / "";
+    margin-inline-start: auto;
+    font-weight: var(--lk-font-weight-bold);
+    color: var(--lk-color-error);
+  }
+
+  /* A distractor nobody picked recedes so the three marks carry the eye.
+     0.7 keeps the default text at 6.6:1 on the default surface (AA);
+     0.55 would drop it to 3.9:1 and fail. */
+  .lk-mc-option[data-correct="false"]:not(:has(input:checked)) {
+    opacity: 0.7;
   }
 
   .lk-mc-option input {
@@ -559,3 +613,152 @@
     color: var(--lk-color-warning);
   }
 }
+
+/*
+ * The SDK's own audio transport, rendered whenever a playback policy has
+ * something to enforce. It replaces the browser's control bar, so it has to be
+ * at least as operable: 44px targets (WCAG 2.5.8), visible focus, and controls
+ * that never disappear just because a budget is spent.
+ */
+@layer lk-skin {
+  .lk-media[data-controls="minimal"] {
+    margin: 0 0 var(--lk-spacing-md);
+    padding: var(--lk-spacing-sm) var(--lk-spacing-md);
+    background: var(--lk-color-surface-raised);
+    border: 1px solid var(--lk-color-border);
+    border-radius: var(--lk-radius-base);
+  }
+
+  .lk-media-transport {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--lk-spacing-sm);
+  }
+
+  .lk-media-play,
+  .lk-media-mute {
+    min-block-size: 44px;
+    min-inline-size: 44px;
+    padding: var(--lk-spacing-xs) var(--lk-spacing-md);
+    font: inherit;
+    font-weight: var(--lk-font-weight-bold);
+    color: var(--lk-color-surface);
+    background: var(--lk-color-primary);
+    border: 0;
+    border-radius: var(--lk-radius-base);
+    cursor: pointer;
+    transition: var(--lk-transition-fast);
+  }
+
+  .lk-media-mute {
+    color: var(--lk-color-text);
+    background: transparent;
+    border: 1px solid var(--lk-color-border);
+  }
+
+  .lk-media-play:hover {
+    background: var(--lk-color-primary-hover);
+  }
+
+  /*
+   * `aria-disabled`, never `disabled`: the button stays focusable so a learner
+   * who tabs to it is told why it will not start, and pressing it re-announces
+   * the refusal. Styled as unavailable without leaving the focus order.
+   */
+  .lk-media-play[aria-disabled="true"] {
+    background: var(--lk-color-text-muted);
+    cursor: not-allowed;
+  }
+
+  .lk-media-play:focus-visible,
+  .lk-media-mute:focus-visible,
+  .lk-media-scrub:focus-visible,
+  .lk-media-volume:focus-visible,
+  .lk-media-rate:focus-visible {
+    outline: 2px solid var(--lk-color-focus-ring);
+    outline-offset: 2px;
+  }
+
+  .lk-media-time {
+    font-size: var(--lk-font-size-sm);
+    font-variant-numeric: tabular-nums;
+    color: var(--lk-color-text-muted);
+  }
+
+  .lk-media-scrub {
+    flex: 1 1 8rem;
+  }
+
+  .lk-media-volume {
+    inline-size: 6rem;
+  }
+
+  .lk-media-rate {
+    min-block-size: 44px;
+    padding: var(--lk-spacing-xs);
+    font: inherit;
+    color: var(--lk-color-text);
+    background: var(--lk-color-surface);
+    border: 1px solid var(--lk-color-border);
+    border-radius: var(--lk-radius-sm);
+  }
+
+  .lk-media-plays {
+    margin: var(--lk-spacing-xs) 0 0;
+    font-size: var(--lk-font-size-sm);
+    color: var(--lk-color-text-muted);
+  }
+
+  /* A refusal is the highest-stakes text on a listening paper. */
+  .lk-media-notice:not(:empty) {
+    margin: var(--lk-spacing-xs) 0 0;
+    font-size: var(--lk-font-size-sm);
+    color: var(--lk-color-warning);
+  }
+
+  .lk-media-confirm {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--lk-spacing-sm);
+    margin: var(--lk-spacing-sm) 0 0;
+    padding: var(--lk-spacing-sm);
+    border: 1px solid var(--lk-color-border);
+    border-radius: var(--lk-radius-base);
+  }
+
+  .lk-media-confirm legend {
+    padding-inline: var(--lk-spacing-xs);
+    font-size: var(--lk-font-size-sm);
+    color: var(--lk-color-text);
+  }
+
+  .lk-media-confirm-start,
+  .lk-media-confirm-cancel {
+    min-block-size: 44px;
+    padding: var(--lk-spacing-xs) var(--lk-spacing-md);
+    font: inherit;
+    border-radius: var(--lk-radius-base);
+    cursor: pointer;
+  }
+
+  .lk-media-confirm-start {
+    color: var(--lk-color-surface);
+    background: var(--lk-color-primary);
+    border: 0;
+  }
+
+  .lk-media-confirm-cancel {
+    color: var(--lk-color-text);
+    background: transparent;
+    border: 1px solid var(--lk-color-border);
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .lk-media-play,
+    .lk-media-mute {
+      transition: none;
+    }
+  }
+}

package/dist/{types-9iS1Vs2I.d.ts → types-eXX4hzSj.d.cts}

@@ -1,4 +1,4 @@
-import { ActivityData, ActivityResult, LearnerResponse, ItemOutcome, InteractionEvent, ThemeTokens, RedactedActivityData, ItemGroup, SequenceEntry } from '@intellectif/lk-core';
+import { ActivityData, ActivityResult, LearnerResponse, ItemOutcome, MediaPlayLedgerEntry, MediaPlayClaim, MediaPlayGrant, InteractionEvent, ThemeTokens, RedactedActivityData, ItemGroup, SequenceEntry } from '@intellectif/lk-core';
 
 /**
  * How an activity is being presented. This is the single switch that decides
@@ -108,6 +108,14 @@ interface ActivityProps<TData extends ActivityData = ActivityData> {
     outcome?: ItemOutcome;
     /** Renders author-supplied rich text when provided. See {@link HtmlSanitizer}. */
     sanitizeHtml?: HtmlSanitizer;
+    /**
+     * Binds this activity's own `data.media` to a play budget the consumer
+     * persists. Usually supplied by `<ActivitySequence mediaBudget={…}>`; pass it
+     * yourself when rendering an activity standalone.
+     */
+    mediaBudget?: MediaBudgetBinding;
+    /** Translations for the audio transport chrome. See {@link MediaTransportStrings}. */
+    mediaStrings?: Partial<MediaTransportStrings>;
     onInteraction?: (event: InteractionEvent) => void;
     /** Per-instance token overrides, applied as inline CSS vars on the root. */
     theme?: Partial<ThemeTokens>;
@@ -177,5 +185,123 @@ declare function asRenderableSequence(entries: readonly (RedactedActivityData |
 type RedactedItemGroupData = ItemGroup<RedactedActivityData> & {
     redacted: true;
 };
+/**
+ * Every English string the SDK's audio transport renders.
+ *
+ * Supply them to translate it. These are the highest-stakes strings on a
+ * listening paper — "No plays remaining" decides whether a learner believes
+ * they may try again — so shipping them as untranslatable English inside a
+ * Spanish panel was not acceptable. Supplying any of them also sets `lang` on
+ * the transport chrome, so a screen reader does not read the SDK's own words
+ * with the passage's phonetics.
+ */
+interface MediaTransportStrings {
+    play: string;
+    pause: string;
+    preparing: string;
+    mute: string;
+    unmute: string;
+    volume: string;
+    speed: string;
+    seek: string;
+    /** e.g. `(1, 2) => '1 of 2 plays remaining'`. */
+    playsRemaining: (remaining: number, max: number) => string;
+    noPlaysRemaining: string;
+    /** Shown before the LAST play is spent, so a stray press cannot cost it. */
+    lastPlayConfirm: string;
+    lastPlayStart: string;
+    lastPlayCancel: string;
+    seekBlocked: string;
+    rateBlocked: string;
+    playFailed: string;
+}
+/**
+ * Binds ONE media block to a play budget the consumer persists.
+ *
+ * The SDK refuses a play; it does not remember one. Everything durable here is
+ * the consuming application's — see {@link SequenceMediaBudget.onPlayConsumed}.
+ */
+interface MediaBudgetBinding {
+    /** From `slotMediaKey(slotId)` / `stimulusMediaKey(slotId)` in lk-core. */
+    key: string;
+    /** Plays already spent, and where playback stood. Read at mount only. */
+    entry?: MediaPlayLedgerEntry;
+    /** Defaults to `renderMode !== 'review'`. An explicit boolean wins either way. */
+    enforced?: boolean;
+    /** Slot context stamped onto the claim and the interaction event. */
+    slotId: string;
+    index: number;
+    activityId?: string;
+    onPlayConsumed?: (claim: MediaPlayClaim) => undefined | Promise<MediaPlayGrant | undefined>;
+    onPlayRefunded?: (claim: MediaPlayClaim) => void;
+    onPosition?: (key: string, seconds: number) => void;
+    /** Translations for the transport chrome. */
+    strings?: Partial<MediaTransportStrings>;
+}
+/**
+ * The pager-level half of a play budget. One prop, because it is one concept.
+ */
+interface SequenceMediaBudget {
+    /**
+     * `MediaPlayLedger.entries` goes straight in. An absent key means nothing
+     * spent. Read at mount, like `responses`.
+     */
+    plays?: Readonly<Record<string, MediaPlayLedgerEntry>>;
+    /**
+     * Re-seed token. Change this string and the budgets re-seed from `plays`
+     * WITHOUT remounting the pager — the invigilator path ("the audio never
+     * started, give her the play back") that would otherwise cost the learner
+     * their focus, their scroll position and an unsaved answer.
+     */
+    resumeKey?: string;
+    /** Explicit override of the default (`renderMode !== 'review'`). */
+    enforced?: boolean;
+    /**
+     * Called the instant a play is claimed, BEFORE any audio is audible.
+     *
+     * Two tiers, chosen by what you return:
+     *
+     * - **Return nothing (optimistic).** Playback starts immediately and the
+     *   count is only as durable as your write. **Do not debounce this, and do
+     *   not batch it with the answer autosave** — an eight-second debounce is
+     *   exactly long enough to start a third play and hard-reload. A `pagehide`
+     *   beacon is a backstop, not the mechanism. A crash between this call and
+     *   your write landing RETURNS the play to the learner; that is the honest
+     *   description of what you are buying.
+     * - **Return a promise (confirmed).** Playback is held — the button reads
+     *   "Preparing…" and is `aria-busy` — until it settles. Resolve with
+     *   `{ playsUsed }` from an ATOMIC server write (`UPDATE … SET plays = plays
+     *   + 1 … RETURNING plays`, or a compare-and-set on
+     *   `claim.previousPlaysUsed`). A resolved count above `maxPlays` refuses the
+     *   play, which is how a second tab is caught: two mounts both seeded at 0
+     *   both claim 1, and only an atomic increment can tell them apart. A
+     *   rejection charges nothing and lets the learner retry. This is the only
+     *   tier in which "consumed before audible" is true of storage rather than
+     *   only of memory; use it for summative papers.
+     *
+     * Never settle the promise and the learner cannot play at all: settle it.
+     */
+    onPlayConsumed?: (claim: MediaPlayClaim) => undefined | Promise<MediaPlayGrant | undefined>;
+    /**
+     * Called when a charged play produced no audio — the element errored before
+     * playback advanced past 0.25 s, an expired signed URL being the realistic
+     * cause. Supply it to give the play back, decrementing with a compare-and-set
+     * on `claim.playsUsed`. Omit it and the play stays spent: the SDK will not
+     * decrement a ledger it has no channel to correct.
+     */
+    onPlayRefunded?: (claim: MediaPlayClaim) => void;
+    /**
+     * Position reports, so a refresh resumes the play the learner already paid
+     * for instead of charging them again. Fires on pause, on end (with 0), and at
+     * most once per whole second of playback.
+     *
+     * **This one you MAY throttle** — the granularity you persist is the
+     * granularity of the replay a crash grants. Three seconds is sane; three
+     * minutes is not.
+     */
+    onPosition?: (key: string, seconds: number) => void;
+    /** Translations for the transport chrome. Defaults are English. */
+    strings?: Partial<MediaTransportStrings>;
+}
 
-export { type ActivityProps as A, type HtmlSanitizer as H, type RenderMode as R, type Renderable as a, type RenderableActivity as b, asRenderable as c, asRenderableSequence as d };
+export { type ActivityProps as A, type HtmlSanitizer as H, type MediaBudgetBinding as M, type RenderMode as R, type SequenceMediaBudget as S, type MediaTransportStrings as a, type Renderable as b, type RenderableActivity as c, asRenderable as d, asRenderableSequence as e };

package/dist/{types-9iS1Vs2I.d.cts → types-eXX4hzSj.d.ts}

@@ -1,4 +1,4 @@
-import { ActivityData, ActivityResult, LearnerResponse, ItemOutcome, InteractionEvent, ThemeTokens, RedactedActivityData, ItemGroup, SequenceEntry } from '@intellectif/lk-core';
+import { ActivityData, ActivityResult, LearnerResponse, ItemOutcome, MediaPlayLedgerEntry, MediaPlayClaim, MediaPlayGrant, InteractionEvent, ThemeTokens, RedactedActivityData, ItemGroup, SequenceEntry } from '@intellectif/lk-core';
 
 /**
  * How an activity is being presented. This is the single switch that decides
@@ -108,6 +108,14 @@ interface ActivityProps<TData extends ActivityData = ActivityData> {
     outcome?: ItemOutcome;
     /** Renders author-supplied rich text when provided. See {@link HtmlSanitizer}. */
     sanitizeHtml?: HtmlSanitizer;
+    /**
+     * Binds this activity's own `data.media` to a play budget the consumer
+     * persists. Usually supplied by `<ActivitySequence mediaBudget={…}>`; pass it
+     * yourself when rendering an activity standalone.
+     */
+    mediaBudget?: MediaBudgetBinding;
+    /** Translations for the audio transport chrome. See {@link MediaTransportStrings}. */
+    mediaStrings?: Partial<MediaTransportStrings>;
     onInteraction?: (event: InteractionEvent) => void;
     /** Per-instance token overrides, applied as inline CSS vars on the root. */
     theme?: Partial<ThemeTokens>;
@@ -177,5 +185,123 @@ declare function asRenderableSequence(entries: readonly (RedactedActivityData |
 type RedactedItemGroupData = ItemGroup<RedactedActivityData> & {
     redacted: true;
 };
+/**
+ * Every English string the SDK's audio transport renders.
+ *
+ * Supply them to translate it. These are the highest-stakes strings on a
+ * listening paper — "No plays remaining" decides whether a learner believes
+ * they may try again — so shipping them as untranslatable English inside a
+ * Spanish panel was not acceptable. Supplying any of them also sets `lang` on
+ * the transport chrome, so a screen reader does not read the SDK's own words
+ * with the passage's phonetics.
+ */
+interface MediaTransportStrings {
+    play: string;
+    pause: string;
+    preparing: string;
+    mute: string;
+    unmute: string;
+    volume: string;
+    speed: string;
+    seek: string;
+    /** e.g. `(1, 2) => '1 of 2 plays remaining'`. */
+    playsRemaining: (remaining: number, max: number) => string;
+    noPlaysRemaining: string;
+    /** Shown before the LAST play is spent, so a stray press cannot cost it. */
+    lastPlayConfirm: string;
+    lastPlayStart: string;
+    lastPlayCancel: string;
+    seekBlocked: string;
+    rateBlocked: string;
+    playFailed: string;
+}
+/**
+ * Binds ONE media block to a play budget the consumer persists.
+ *
+ * The SDK refuses a play; it does not remember one. Everything durable here is
+ * the consuming application's — see {@link SequenceMediaBudget.onPlayConsumed}.
+ */
+interface MediaBudgetBinding {
+    /** From `slotMediaKey(slotId)` / `stimulusMediaKey(slotId)` in lk-core. */
+    key: string;
+    /** Plays already spent, and where playback stood. Read at mount only. */
+    entry?: MediaPlayLedgerEntry;
+    /** Defaults to `renderMode !== 'review'`. An explicit boolean wins either way. */
+    enforced?: boolean;
+    /** Slot context stamped onto the claim and the interaction event. */
+    slotId: string;
+    index: number;
+    activityId?: string;
+    onPlayConsumed?: (claim: MediaPlayClaim) => undefined | Promise<MediaPlayGrant | undefined>;
+    onPlayRefunded?: (claim: MediaPlayClaim) => void;
+    onPosition?: (key: string, seconds: number) => void;
+    /** Translations for the transport chrome. */
+    strings?: Partial<MediaTransportStrings>;
+}
+/**
+ * The pager-level half of a play budget. One prop, because it is one concept.
+ */
+interface SequenceMediaBudget {
+    /**
+     * `MediaPlayLedger.entries` goes straight in. An absent key means nothing
+     * spent. Read at mount, like `responses`.
+     */
+    plays?: Readonly<Record<string, MediaPlayLedgerEntry>>;
+    /**
+     * Re-seed token. Change this string and the budgets re-seed from `plays`
+     * WITHOUT remounting the pager — the invigilator path ("the audio never
+     * started, give her the play back") that would otherwise cost the learner
+     * their focus, their scroll position and an unsaved answer.
+     */
+    resumeKey?: string;
+    /** Explicit override of the default (`renderMode !== 'review'`). */
+    enforced?: boolean;
+    /**
+     * Called the instant a play is claimed, BEFORE any audio is audible.
+     *
+     * Two tiers, chosen by what you return:
+     *
+     * - **Return nothing (optimistic).** Playback starts immediately and the
+     *   count is only as durable as your write. **Do not debounce this, and do
+     *   not batch it with the answer autosave** — an eight-second debounce is
+     *   exactly long enough to start a third play and hard-reload. A `pagehide`
+     *   beacon is a backstop, not the mechanism. A crash between this call and
+     *   your write landing RETURNS the play to the learner; that is the honest
+     *   description of what you are buying.
+     * - **Return a promise (confirmed).** Playback is held — the button reads
+     *   "Preparing…" and is `aria-busy` — until it settles. Resolve with
+     *   `{ playsUsed }` from an ATOMIC server write (`UPDATE … SET plays = plays
+     *   + 1 … RETURNING plays`, or a compare-and-set on
+     *   `claim.previousPlaysUsed`). A resolved count above `maxPlays` refuses the
+     *   play, which is how a second tab is caught: two mounts both seeded at 0
+     *   both claim 1, and only an atomic increment can tell them apart. A
+     *   rejection charges nothing and lets the learner retry. This is the only
+     *   tier in which "consumed before audible" is true of storage rather than
+     *   only of memory; use it for summative papers.
+     *
+     * Never settle the promise and the learner cannot play at all: settle it.
+     */
+    onPlayConsumed?: (claim: MediaPlayClaim) => undefined | Promise<MediaPlayGrant | undefined>;
+    /**
+     * Called when a charged play produced no audio — the element errored before
+     * playback advanced past 0.25 s, an expired signed URL being the realistic
+     * cause. Supply it to give the play back, decrementing with a compare-and-set
+     * on `claim.playsUsed`. Omit it and the play stays spent: the SDK will not
+     * decrement a ledger it has no channel to correct.
+     */
+    onPlayRefunded?: (claim: MediaPlayClaim) => void;
+    /**
+     * Position reports, so a refresh resumes the play the learner already paid
+     * for instead of charging them again. Fires on pause, on end (with 0), and at
+     * most once per whole second of playback.
+     *
+     * **This one you MAY throttle** — the granularity you persist is the
+     * granularity of the replay a crash grants. Three seconds is sane; three
+     * minutes is not.
+     */
+    onPosition?: (key: string, seconds: number) => void;
+    /** Translations for the transport chrome. Defaults are English. */
+    strings?: Partial<MediaTransportStrings>;
+}
 
-export { type ActivityProps as A, type HtmlSanitizer as H, type RenderMode as R, type Renderable as a, type RenderableActivity as b, asRenderable as c, asRenderableSequence as d };
+export { type ActivityProps as A, type HtmlSanitizer as H, type MediaBudgetBinding as M, type RenderMode as R, type SequenceMediaBudget as S, type MediaTransportStrings as a, type Renderable as b, type RenderableActivity as c, asRenderable as d, asRenderableSequence as e };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@intellectif/lk-react",
-  "version": "6.1.0",
+  "version": "7.0.0",
   "description": "Accessible React 19 assessment components — multiple choice, fill-in-the-blanks, written response — with a resumable exam/review pager, theming, and xAPI delivery.",
   "keywords": [
     "react",
@@ -137,7 +137,7 @@
   "peerDependencies": {
     "react": "^19",
     "react-dom": "^19",
-    "@intellectif/lk-core": "^0.7.1"
+    "@intellectif/lk-core": "^0.8.0"
   },
   "devDependencies": {
     "@axe-core/react": "^4.10.0",
@@ -156,7 +156,7 @@
     "tsup": "^8.3.0",
     "vitest": "^4.1.6",
     "vitest-axe": "^0.1.0",
-    "@intellectif/lk-core": "0.7.1"
+    "@intellectif/lk-core": "0.8.0"
   },
   "license": "MIT",
   "engines": {

package/dist/chunk-4HZ7LQIH.cjs

@@ -1,41 +0,0 @@
-'use client';
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-
-// src/components/shared/ActivityMedia.tsx
-function ActivityMedia({ media }) {
-  const { type, url, alt, captionsUrl } = media;
-  if (type === "image") {
-    return /* @__PURE__ */ jsxRuntime.jsx("figure", { className: "lk-media", children: /* @__PURE__ */ jsxRuntime.jsx("img", { className: "lk-media-el", src: url, alt: alt ?? "" }) });
-  }
-  if (type === "audio") {
-    return /* @__PURE__ */ jsxRuntime.jsx("figure", { className: "lk-media", children: /* @__PURE__ */ jsxRuntime.jsxs("audio", { className: "lk-media-el", controls: true, "aria-label": alt || void 0, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("source", { src: url }),
-      captionsUrl ? /* @__PURE__ */ jsxRuntime.jsx("track", { kind: "captions", src: captionsUrl, default: true }) : null
-    ] }) });
-  }
-  if (type === "embed") {
-    return /* @__PURE__ */ jsxRuntime.jsx("figure", { className: "lk-media", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lk-media-embed", children: /* @__PURE__ */ jsxRuntime.jsx(
-      "iframe",
-      {
-        className: "lk-media-el",
-        src: url,
-        title: alt ?? "Embedded media",
-        loading: "lazy",
-        referrerPolicy: "strict-origin-when-cross-origin",
-        sandbox: "allow-scripts allow-same-origin allow-presentation",
-        allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",
-        allowFullScreen: true
-      }
-    ) }) });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx("figure", { className: "lk-media", children: /* @__PURE__ */ jsxRuntime.jsxs("video", { className: "lk-media-el", controls: true, "aria-label": alt || void 0, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("source", { src: url }),
-    captionsUrl ? /* @__PURE__ */ jsxRuntime.jsx("track", { kind: "captions", src: captionsUrl, default: true }) : null
-  ] }) });
-}
-
-exports.ActivityMedia = ActivityMedia;
-//# sourceMappingURL=chunk-4HZ7LQIH.cjs.map
-//# sourceMappingURL=chunk-4HZ7LQIH.cjs.map

package/dist/chunk-4HZ7LQIH.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/shared/ActivityMedia.tsx"],"names":["jsx","jsxs"],"mappings":";;;;;AAUO,SAAS,aAAA,CAAc,EAAE,KAAA,EAAM,EAAoD;AACxF,EAAA,MAAM,EAAE,IAAA,EAAM,GAAA,EAAK,GAAA,EAAK,aAAY,GAAI,KAAA;AAExC,EAAA,IAAI,SAAS,OAAA,EAAS;AACpB,IAAA,uBACEA,cAAA,CAAC,QAAA,EAAA,EAAO,SAAA,EAAU,UAAA,EAChB,QAAA,kBAAAA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,aAAA,EAAc,GAAA,EAAK,GAAA,EAAK,GAAA,EAAK,GAAA,IAAO,IAAI,CAAA,EACzD,CAAA;AAAA,EAEJ;AAEA,EAAA,IAAI,SAAS,OAAA,EAAS;AACpB,IAAA,uBACEA,cAAA,CAAC,QAAA,EAAA,EAAO,SAAA,EAAU,UAAA,EAEhB,QAAA,kBAAAC,eAAA,CAAC,OAAA,EAAA,EAAM,SAAA,EAAU,aAAA,EAAc,QAAA,EAAQ,IAAA,EAAC,YAAA,EAAY,GAAA,IAAO,MAAA,EACzD,QAAA,EAAA;AAAA,sBAAAD,cAAA,CAAC,QAAA,EAAA,EAAO,KAAK,GAAA,EAAK,CAAA;AAAA,MACjB,WAAA,kCAAe,OAAA,EAAA,EAAM,IAAA,EAAK,YAAW,GAAA,EAAK,WAAA,EAAa,OAAA,EAAO,IAAA,EAAC,CAAA,GAAK;AAAA,KAAA,EACvE,CAAA,EACF,CAAA;AAAA,EAEJ;AAEA,EAAA,IAAI,SAAS,OAAA,EAAS;AACpB,IAAA,sCACG,QAAA,EAAA,EAAO,SAAA,EAAU,YAChB,QAAA,kBAAAA,cAAA,CAAC,KAAA,EAAA,EAAI,WAAU,gBAAA,EACb,QAAA,kBAAAA,cAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAU,aAAA;AAAA,QACV,GAAA,EAAK,GAAA;AAAA,QACL,OAAO,GAAA,IAAO,gBAAA;AAAA,QACd,OAAA,EAAQ,MAAA;AAAA,QACR,cAAA,EAAe,iCAAA;AAAA,QAMf,OAAA,EAAQ,oDAAA;AAAA,QACR,KAAA,EAAM,qGAAA;AAAA,QACN,eAAA,EAAe;AAAA;AAAA,OAEnB,CAAA,EACF,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACEA,cAAA,CAAC,QAAA,EAAA,EAAO,SAAA,EAAU,UAAA,EAEhB,QAAA,kBAAAC,eAAA,CAAC,OAAA,EAAA,EAAM,SAAA,EAAU,aAAA,EAAc,QAAA,EAAQ,IAAA,EAAC,YAAA,EAAY,GAAA,IAAO,MAAA,EACzD,QAAA,EAAA;AAAA,oBAAAD,cAAA,CAAC,QAAA,EAAA,EAAO,KAAK,GAAA,EAAK,CAAA;AAAA,IACjB,WAAA,kCAAe,OAAA,EAAA,EAAM,IAAA,EAAK,YAAW,GAAA,EAAK,WAAA,EAAa,OAAA,EAAO,IAAA,EAAC,CAAA,GAAK;AAAA,GAAA,EACvE,CAAA,EACF,CAAA;AAEJ","file":"chunk-4HZ7LQIH.cjs","sourcesContent":["import type { ActivityMedia as ActivityMediaData } from '@intellectif/lk-core';\n\n/**\n * Presentational media block shown above a question or passage. URL-only:\n * the SDK does not host media (consumer responsibility). Accessibility:\n * images use `alt` (schema requires it non-empty); audio/video expose an\n * optional label and a captions `<track>` when `captionsUrl` is provided;\n * `embed` renders a responsive sandboxed iframe with `alt` as its required\n * accessible `title` (Req 14.5).\n */\nexport function ActivityMedia({ media }: { media: ActivityMediaData }): React.JSX.Element {\n  const { type, url, alt, captionsUrl } = media;\n\n  if (type === 'image') {\n    return (\n      <figure className=\"lk-media\">\n        <img className=\"lk-media-el\" src={url} alt={alt ?? ''} />\n      </figure>\n    );\n  }\n\n  if (type === 'audio') {\n    return (\n      <figure className=\"lk-media\">\n        {/* biome-ignore lint/a11y/useMediaCaption: captions are optional in the data contract — a <track> is rendered when captionsUrl is provided; absence is the author's documented choice (Req 14.5) */}\n        <audio className=\"lk-media-el\" controls aria-label={alt || undefined}>\n          <source src={url} />\n          {captionsUrl ? <track kind=\"captions\" src={captionsUrl} default /> : null}\n        </audio>\n      </figure>\n    );\n  }\n\n  if (type === 'embed') {\n    return (\n      <figure className=\"lk-media\">\n        <div className=\"lk-media-embed\">\n          <iframe\n            className=\"lk-media-el\"\n            src={url}\n            title={alt ?? 'Embedded media'}\n            loading=\"lazy\"\n            referrerPolicy=\"strict-origin-when-cross-origin\"\n            // The docblock always promised a sandboxed iframe; now it is one.\n            // allow-scripts + allow-same-origin are required by provider\n            // players (YouTube/Vimeo); top-navigation, forms, downloads and\n            // popups stay blocked. Scheme allow-listing in MediaSchema is the\n            // primary defense; this is depth.\n            sandbox=\"allow-scripts allow-same-origin allow-presentation\"\n            allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\"\n            allowFullScreen\n          />\n        </div>\n      </figure>\n    );\n  }\n\n  return (\n    <figure className=\"lk-media\">\n      {/* biome-ignore lint/a11y/useMediaCaption: captions are optional in the data contract — a <track> is rendered when captionsUrl is provided; absence is the author's documented choice (Req 14.5) */}\n      <video className=\"lk-media-el\" controls aria-label={alt || undefined}>\n        <source src={url} />\n        {captionsUrl ? <track kind=\"captions\" src={captionsUrl} default /> : null}\n      </video>\n    </figure>\n  );\n}\n"]}