@eifi1/ui-kit 0.30.0 → 0.31.0

package/dist/components/ui.d.ts

@@ -1,6 +1,6 @@
 import 'react';
 import './tooltip.js';
-export { bB as Button, bC as ButtonClassesOptions, bD as ButtonLinkProps, bE as ButtonProps, bF as ButtonSize, bG as ButtonTone, bH as ButtonVariant, bJ as Card, bK as CardAction, bL as CardActionProps, bM as CardContent, bN as CardContentProps, bO as CardDensity, bP as CardDescription, bQ as CardDescriptionProps, bR as CardFooter, bS as CardFooterProps, bT as CardHeader, bU as CardHeaderProps, bV as CardProps, bW as CardTitle, bX as CardTitleLevel, bY as CardTitleProps, bZ as CardTone, b_ as CharacterCountLabels, ci as DEFAULT_CHARACTER_COUNT_LABELS, cy as DEFAULT_PASSWORD_REVEAL_LABELS, cG as DEFAULT_TABS_LABELS, cW as EmptyState, cX as EmptyStateProps, cY as FIELD_BASE, cZ as FIELD_DISPLAY, c_ as FIELD_FLOATING_PAD, c$ as FIELD_INVALID, d0 as FIELD_TRIGGER, d1 as FIELD_WRITABLE_LOOK, d2 as FLOATING_INPUT_CLASS, d3 as FLOATING_LABEL_CLASS, d4 as FieldChevron, d5 as FieldChevronProps, d6 as FieldHint, d7 as FieldHintProps, df as FloatingField, dg as FloatingFieldProps, du as IconButton, dv as IconButtonGlyphSize, dw as IconButtonLinkProps, dx as IconButtonProps, dy as IconButtonSize, dz as IconButtonTone, dA as IconButtonToneColor, dB as IconButtonVariant, dC as Input, dD as InputProps, dU as Label, dW as LabelProps, ec as PHONE_QUERY, ed as PasswordRevealLabels, eC as Select, eD as SelectProps, eQ as Spinner, eR as SpinnerProps, eT as TabItem, eU as Tabs, eV as TabsLabels, eW as TabsProps, eX as Textarea, eY as TextareaProps, fq as buttonClasses, fA as resolvePasswordRevealLabels } from '../delete-account-setting-CGVMckMw.js';
+export { bB as Button, bC as ButtonClassesOptions, bD as ButtonLinkProps, bE as ButtonProps, bF as ButtonSize, bG as ButtonTone, bH as ButtonVariant, bJ as Card, bK as CardAction, bL as CardActionProps, bM as CardContent, bN as CardContentProps, bO as CardDensity, bP as CardDescription, bQ as CardDescriptionProps, bR as CardFooter, bS as CardFooterProps, bT as CardHeader, bU as CardHeaderProps, bV as CardProps, bW as CardTitle, bX as CardTitleLevel, bY as CardTitleProps, bZ as CardTone, b_ as CharacterCountLabels, ci as DEFAULT_CHARACTER_COUNT_LABELS, cy as DEFAULT_PASSWORD_REVEAL_LABELS, cG as DEFAULT_TABS_LABELS, cW as EmptyState, cX as EmptyStateProps, cY as FIELD_BASE, cZ as FIELD_DISPLAY, c_ as FIELD_FLOATING_PAD, c$ as FIELD_INVALID, d0 as FIELD_TRIGGER, d1 as FIELD_WRITABLE_LOOK, d2 as FLOATING_INPUT_CLASS, d3 as FLOATING_LABEL_CLASS, d4 as FieldChevron, d5 as FieldChevronProps, d6 as FieldHint, d7 as FieldHintProps, df as FloatingField, dg as FloatingFieldProps, du as IconButton, dv as IconButtonGlyphSize, dw as IconButtonLinkProps, dx as IconButtonProps, dy as IconButtonSize, dz as IconButtonTone, dA as IconButtonToneColor, dB as IconButtonVariant, dC as Input, dD as InputProps, dU as Label, dW as LabelProps, ec as PHONE_QUERY, ed as PasswordRevealLabels, eC as Select, eD as SelectProps, eQ as Spinner, eR as SpinnerProps, eT as TabItem, eU as Tabs, eV as TabsLabels, eW as TabsProps, eX as Textarea, eY as TextareaProps, fq as buttonClasses, fA as resolvePasswordRevealLabels } from '../delete-account-setting-DCFS5Vof.js';
 export { FLOATING_LABEL_STATIC, FieldLabel, FieldLabelProps } from './field-parts.js';
 import '../hooks/use-anchored-rect.js';
 import '../lib/clipping.js';
@@ -55,6 +55,8 @@ import './image-grid.js';
 import './lightbox.js';
 import './write-lock.js';
 import '../auth/sign-in-form.js';
+import '../landing/access.js';
+import '../landing/landing-labels.js';
 import '../shell/topbar-controls.js';
 import '../theme/palette-presets.js';
 import '../theme/chart-palette.js';
@@ -76,6 +78,8 @@ import '../account/data-export-setting.js';
 import './account-chips.js';
 import '../admin/admin-parts.js';
 import '../admin/admin-action-log.js';
+import '../settings/settings-labels.js';
+import '../demo/demo-labels.js';
 import './reauth-dialog.js';
 import './server-wake.js';
 import '../lib/server-wake.js';

package/dist/{delete-account-setting-CGVMckMw.d.ts → delete-account-setting-DCFS5Vof.d.ts}

@@ -60,6 +60,9 @@ import { RoleVocabulary, AccountState, RoleDefinition, AccountStateLabels } from
 import { SortState } from './components/data-table-sort.js';
 import { MaybePromise as MaybePromise$1, AdminPerson } from './admin/admin-parts.js';
 import { AdminActionLogLabels } from './admin/admin-action-log.js';
+import { SettingsLabels } from './settings/settings-labels.js';
+import { LandingLabels } from './landing/landing-labels.js';
+import { DemoLabels } from './demo/demo-labels.js';
 import { ReauthDialogLabels } from './components/reauth-dialog.js';
 import { ServerWakeLabels } from './components/server-wake.js';
 import { TranslationReviewLabels } from './components/translation-review-labels.js';
@@ -855,12 +858,14 @@ declare function pastedName(type: string): string;
  * keksdose's wording), read by default by the badges and the transitions below;
  * a `label` the caller passes still wins.
  */
-/** The seven states a report can be in.
+/** The eight states a report can be in.
  *
- *  Shared value for value across both apps on purpose: it is what lets one habit,
- *  and one agent prompt, work on either repo. Four are a chain and three sit off
- *  it — see {@link visibleFeedbackStatuses} for what that buys. */
-type FeedbackStatus = "OPEN" | "IN_PROGRESS" | "IN_EVALUATION" | "NEEDS_LIVE_TEST" | "POSTPONED" | "DONE" | "WONT_DO";
+ *  Shared value for value across the apps on purpose: it is what lets one habit,
+ *  and one agent prompt, work on any repo. Five are a chain and three sit off
+ *  it — see {@link visibleFeedbackStatuses} for what that buys. `READY` joined in 0.31
+ *  (feedback contract §8.2): OPEN is "filed, not yet triaged", READY "released for
+ *  implementation", and nobody works an OPEN row. */
+type FeedbackStatus = "OPEN" | "READY" | "IN_PROGRESS" | "IN_EVALUATION" | "NEEDS_LIVE_TEST" | "POSTPONED" | "DONE" | "WONT_DO";
 /** What a report is about. `CRASH` is filed by an error boundary and never
  *  chosen, which is exactly why it is loud below and absent from every picker. */
 type FeedbackCategory = "CRASH" | "BUG" | "IDEA" | "QUESTION" | "OTHER";
@@ -872,7 +877,7 @@ type FeedbackCategory = "CRASH" | "BUG" | "IDEA" | "QUESTION" | "OTHER";
  * its own shape as well. Declaration order is chain order, and
  * {@link FEEDBACK_STATUS_ORDER} is derived from it rather than restated, because
  * a restated list cannot be checked for exhaustiveness: an eighth status would
- * break the build here and leave a literal seven long.
+ * break the build here and leave a literal eight long (as READY did in 0.31).
  */
 declare const FEEDBACK_STATUS_META: Record<FeedbackStatus, {
     icon: LucideIcon;
@@ -890,7 +895,7 @@ declare function nextFeedbackStatus(current: FeedbackStatus): FeedbackStatus | n
  * The steps that make sense from where a row currently stands.
  *
  * For the compact control in a table cell: it is a glanceable triage affordance,
- * and a row of seven icons in a cell is noise. One step forward, one step back
+ * and a row of eight icons in a cell is noise. One step forward, one step back
  * (so an item can be sent back for rework), and any of the three off-chain
  * verdicts — which is what makes those usable as verdicts at all.
  *
@@ -1511,7 +1516,7 @@ type ChatComposerSlotContext = FeedbackComposerSlotContext;
  * `feedbackStatus` — one word per status, keyed by the enum value so
  * `labels[row.status]` is the whole lookup.
  *
- * de-CH canon: OPEN "Offen" · IN_PROGRESS "In Bearbeitung" · IN_EVALUATION "Zur Prüfung"
+ * de-CH canon: OPEN "Offen" · READY "Bereit zur Umsetzung" · IN_PROGRESS "In Bearbeitung" · IN_EVALUATION "Zur Prüfung"
  * · NEEDS_LIVE_TEST "Live testen" · POSTPONED "Zurückgestellt" · DONE "Erledigt" ·
  * WONT_DO "Wird nicht umgesetzt".
  */
@@ -1780,16 +1785,17 @@ declare const FEEDBACK_PICKABLE_CATEGORIES: readonly FeedbackCategory[];
 declare const FEEDBACK_REWORKABLE_STATUSES: readonly FeedbackStatus[];
 /**
  * The statuses in which the AUTHOR may still edit title, body and category (§3.4,
- * keksdose `canAuthorEdit`, `feedback-page.tsx:398`): `OPEN` and `IN_PROGRESS`. Once the
- * team has answered, the description is what they answered and stays as it was; a
- * correction goes in as a rework.
+ * keksdose `canAuthorEdit`, `feedback-page.tsx:398`): `OPEN`, `READY` and `IN_PROGRESS`.
+ * Once the team has answered, the description is what they answered and stays as it
+ * was; a correction goes in as a rework.
  */
 declare const FEEDBACK_AUTHOR_EDITABLE_STATUSES: readonly FeedbackStatus[];
 /**
- * The two statuses that wait on the person triaging: answered and handed back for a
- * verdict, or answered and only checkable on a deployed build (keksdose
- * `AWAITING_VERDICT`, live #330). The phone's "Only what is waiting for you" toggle
- * narrows the inbox to exactly these (§4.3).
+ * The statuses that wait on the person triaging: filed and not yet triaged (`OPEN`,
+ * since READY took over "released for implementation" in 0.31, feedback contract §8.2),
+ * answered and handed back for a verdict, or answered and only checkable on a deployed
+ * build (keksdose `AWAITING_VERDICT`, live #330). The phone's "Only what is waiting for
+ * you" toggle narrows the inbox to exactly these (§4.3).
  */
 declare const FEEDBACK_AWAITING_STATUSES: readonly FeedbackStatus[];
 /** The body line for one uploaded attachment — what {@link appendRework} writes under
@@ -2380,8 +2386,9 @@ declare function FeedbackEmptyState({ labels: labelsProp }: FeedbackEmptyStatePr
  *   path (`/accounts?p=2`): keksdose's `new URL(…)` throws on one and the section
  *   vanished. kastlan already fell back to `context.route` (`feedbackRaw`, `:97`).
  *
- * The sections, in the contract's order: **Description** (the body; the author's
- * Edit while OPEN / IN_PROGRESS), **URL**, **Attachment**, **Outcome** (the admin's
+ * The sections, in the contract's order: **Subject** (the category and the title, §8.1;
+ * `showSubject={false}` leaves it out), **Description** (the body; the author's
+ * Edit while OPEN / READY / IN_PROGRESS), **URL**, **Attachment**, **Outcome** (the admin's
  * outcome editor, Rework, Open page), **Send for rework** (only while reworking) and
  * **Status**. No comment thread (§2.2: kastlan's comments fold into the body, §7.7).
  *
@@ -2395,7 +2402,11 @@ declare function FeedbackEmptyState({ labels: labelsProp }: FeedbackEmptyStatePr
  * canon (keksdose `de-CH.json`, ss never ß, "Nacharbeit" throughout — §7.14) on each key.
  */
 interface FeedbackDetailLabels {
-    /** Section 1's heading — keksdose's `feedback.body` (§7.3). The dialog's field asks
+    /** The first section's heading: what the report is called (feedback contract §8.1,
+     *  keksdose live #395 — with the row expanded and the table scrolled, nothing said
+     *  which entry was being answered). de-CH: "Betreff" */
+    subject: string;
+    /** The description section's heading — keksdose's `feedback.body` (§7.3). The dialog's field asks
      *  "What happened? (optional)"; the description, once filed, is headed as what it is
      *  — and as the author's "Edit description" calls it. de-CH: "Beschreibung" */
     body: string;
@@ -2487,7 +2498,7 @@ declare function feedbackAttachmentUrls(row: Pick<FeedbackRecord, "screenshot_ur
 interface FeedbackRowAccess {
     /** The viewer filed it (`viewerId === row.user_id`; never for an erased author). */
     isAuthor: boolean;
-    /** "Edit description": the author, while the row is OPEN or IN_PROGRESS — on either
+    /** "Edit description": the author, while the row is OPEN, READY or IN_PROGRESS — on either
      *  page (keksdose `canAuthorEdit`, `feedback-page.tsx:398`, is not gated on `mine`). */
     canEditDescription: boolean;
     /** The outcome editor: the admin on the inbox (`canEdit`). */
@@ -2620,6 +2631,12 @@ interface FeedbackRowDetailProps {
      * BUDGET, and a person viewing one still owns their own reports.
      */
     commit?: boolean;
+    /**
+     * Open with the subject: the category badge and the title (feedback contract §8.1,
+     * keksdose live #395). On by default; `false` for a page that already shows the title
+     * beside the detail.
+     */
+    showSubject?: boolean;
     labels?: Partial<FeedbackDetailLabels>;
     className?: string;
 }
@@ -2646,7 +2663,7 @@ interface FeedbackRowDetailProps {
  * collapsing the row closes it. Each editor is keyed by the row's id, so a draft is
  * never thrown away by a list refresh under it.
  */
-declare function FeedbackRowDetail({ row, canEdit, viewerId, onUpdate, pending, onUpload, fetcher, statusChange, onCaptureScreenshot, reworkAttachment, renderDate, commit, labels: labelsProp, className, }: FeedbackRowDetailProps): react.JSX.Element;
+declare function FeedbackRowDetail({ row, canEdit, viewerId, onUpdate, pending, onUpload, fetcher, statusChange, onCaptureScreenshot, reworkAttachment, renderDate, commit, showSubject, labels: labelsProp, className, }: FeedbackRowDetailProps): react.JSX.Element;
 
 /**
  * The `confirmDialog` namespace of `<UiKitProvider labels>`: the two buttons' fallback
@@ -4609,8 +4626,10 @@ interface InvitationsPanelProps<R extends string = string> {
     onInvite?: (draft: InvitationDraft<R>) => MaybePromise$1<InvitationSentAnswer | void>;
     /** Mints a new link and mails it. Left out: no resend button. */
     onResend?: (invitation: InvitationRow<R>) => MaybePromise$1<InvitationSentAnswer | void>;
-    /** Revokes an open invitation (level `none`, §4.2: re-inviting undoes it). Left out:
-     *  no revoke button. */
+    /** Revokes an open or an expired invitation (level `none`, §4.2: re-inviting undoes
+     *  it). An expired row can be resent, and since 0.31 also removed: in an app that
+     *  keeps the rows it would otherwise stay listed for good (Kurvenschmiede's 0.30
+     *  adoption). Left out: no revoke button. */
     onRevoke?: (invitation: InvitationRow<R>) => MaybePromise$1;
     /** The list is being fetched. */
     loading?: boolean;
@@ -4618,10 +4637,14 @@ interface InvitationsPanelProps<R extends string = string> {
     describeError?: (error: unknown) => ReactNode | undefined;
     /** Over the form: who can be invited and what happens, in the app's words. */
     intro?: ReactNode;
+    /** The list's visible heading. Default: the `listTitle` label. `null` leaves it out,
+     *  for a page whose card is already headed "Invitations" (Kurvenschmiede's 0.30
+     *  adoption); the list keeps the label as its accessible name either way. */
+    listTitle?: ReactNode | null;
     className?: string;
     labels?: Partial<InvitationsLabels>;
 }
-declare function InvitationsPanel<R extends string = string>({ invitations, roles, invitableRoles, defaultRole, scopes, scopeRequired, languages, defaultLocale, mailBackend, onInvite, onResend, onRevoke, loading, describeError, intro, className, labels: labelsProp, }: InvitationsPanelProps<R>): react.JSX.Element;
+declare function InvitationsPanel<R extends string = string>({ invitations, roles, invitableRoles, defaultRole, scopes, scopeRequired, languages, defaultLocale, mailBackend, onInvite, onResend, onRevoke, loading, describeError, intro, listTitle, className, labels: labelsProp, }: InvitationsPanelProps<R>): react.JSX.Element;
 
 /**
  * Who holds one record, and the owner's every way of changing that — Kurvenschmiede's
@@ -5224,6 +5247,12 @@ interface UiKitLabels {
     transferOwnership: TransferOwnershipLabels;
     /** 0.30.0: the invitations panel (§5). */
     invitations: InvitationsLabels;
+    /** 0.31.0: the settings and admin pages' shell (docs/settings-harmonization.md §4.3). */
+    settings: SettingsLabels;
+    /** 0.31.0: the public landing page's kit words (docs/landing-demo-harmonization.md §4). */
+    landing: LandingLabels;
+    /** 0.31.0: the demo's start, banner and end (§5). */
+    demo: DemoLabels;
     /** 0.22.0: the screen-reader words of `Input` / `Textarea`'s `showCount` counter. */
     characterCount: CharacterCountLabels;
     /** 0.22.0: `CountrySelect`. Its list's "no results" and counts are `combobox`'s. */

package/dist/demo/demo-banner.d.ts

@@ -0,0 +1,51 @@
+import * as react from 'react';
+import { ComponentPropsWithoutRef } from 'react';
+import { AccessChoice } from '../landing/access.js';
+import { LandingLabels } from '../landing/landing-labels.js';
+import { DemoExpiry } from './demo-countdown.js';
+import { DemoLabels } from './demo-labels.js';
+import { DemoModel } from './demo-session.js';
+
+interface DemoBannerProps extends Omit<ComponentPropsWithoutRef<"div">, "children" | "onClick"> {
+    /** The demo's end: `expires_at` from the `TokenResponse`, or `demo_expires_at` from
+     *  `/auth/me` (§5.3). */
+    expiresAt: DemoExpiry | null | undefined;
+    /** Which line the banner says about the data (§2.3). */
+    model: DemoModel;
+    /** "Request access". */
+    access: AccessChoice;
+    /** "Sign in" — let through for a demo session by `RedirectIfAuthed allowDemo`. Default
+     *  `/login`. */
+    signInHref?: string;
+    /** The countdown reached zero: clear the session and replace to `/demo/ended` (§5.5). */
+    onEnded?: () => void;
+    /** Where the collapsed state is kept for the tab's session. Default
+     *  `kit.demoBanner.collapsed`. */
+    collapseKey?: string;
+    /** The clock, for tests and previews. Default `Date.now`. Keep it stable. */
+    now?: () => number;
+    labels?: Partial<DemoLabels>;
+    /** The access words (`landing` namespace) for this instance. */
+    landingLabels?: Partial<LandingLabels>;
+}
+/**
+ * The demo's strip under the top bar, on every page of a demo session
+ * (docs/landing-demo-harmonization.md §5.4) — a kit `AlertBanner` strip:
+ *
+ * - the time left, "Demo · 23 h 12 min left" — minutes only in the last hour, and the
+ *   warning tone in the last ten minutes (`useDemoCountdown`);
+ * - one line on the model: R "You're looking at sample data. Changes aren't possible.",
+ *   S "Your own work is deleted when the demo ends.";
+ * - "Request access" (the mail) and "Sign in".
+ *
+ * It collapses to the countdown alone, for the tab's session (`sessionStorage`) — never
+ * hidden for good: it is a live state, like keksdose's preview banner, which a demo user
+ * gets instead of. At zero it calls `onEnded`.
+ *
+ * The countdown is no live region: a sentence read out every minute would drown the
+ * page. A screen-reader user meets it at the top of the page, and the end page says
+ * the rest.
+ */
+declare function DemoBanner({ expiresAt, model, access, signInHref, onEnded, collapseKey, now, labels: labelsProp, landingLabels, className, ...rest }: DemoBannerProps): react.JSX.Element;
+
+export { DemoBanner, type DemoBannerProps };

package/dist/demo/demo-banner.js

@@ -0,0 +1,97 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { ChevronDown, ChevronUp, Timer } from "lucide-react";
+import { cn } from "../lib/cn.js";
+import { AlertBanner } from "../components/alert-banner.js";
+import { Button, IconButton } from "../components/ui.js";
+import { useAccessAction } from "../landing/access.js";
+import { useLandingLabels } from "../landing/landing-labels.js";
+import { useDemoCountdown } from "./demo-countdown.js";
+import { useDemoLabels } from "./demo-labels.js";
+const COLLAPSE_KEY = "kit.demoBanner.collapsed";
+function readSession(key) {
+  if (typeof window === "undefined") return null;
+  try {
+    return window.sessionStorage.getItem(key);
+  } catch {
+    return null;
+  }
+}
+function writeSession(key, value) {
+  if (typeof window === "undefined") return;
+  try {
+    if (value === null) window.sessionStorage.removeItem(key);
+    else window.sessionStorage.setItem(key, value);
+  } catch {
+  }
+}
+function timeText(countdown, labels) {
+  if (countdown.minutesLeft === null) return labels.badge;
+  if (countdown.ended) return labels.endedTitle;
+  return countdown.lastHour ? labels.minutesLeft(countdown.minutes) : labels.hoursLeft(countdown.hours, countdown.minutes);
+}
+function DemoBanner({
+  expiresAt,
+  model,
+  access,
+  signInHref = "/login",
+  onEnded,
+  collapseKey = COLLAPSE_KEY,
+  now,
+  labels: labelsProp,
+  landingLabels,
+  className,
+  ...rest
+}) {
+  const labels = useDemoLabels(labelsProp);
+  const landing = useLandingLabels(landingLabels);
+  const accessLink = useAccessAction(access, landingLabels);
+  const countdown = useDemoCountdown(expiresAt, { now, onEnded });
+  const [collapsed, setCollapsed] = useState(() => readSession(collapseKey) === "1");
+  const toggle = () => {
+    const next = !collapsed;
+    setCollapsed(next);
+    writeSession(collapseKey, next ? "1" : null);
+  };
+  return /* @__PURE__ */ jsxs(
+    AlertBanner,
+    {
+      ...rest,
+      variant: "strip",
+      size: "sm",
+      tone: countdown.warning || countdown.ended ? "warning" : "info",
+      icon: /* @__PURE__ */ jsx(Timer, {}),
+      "data-demo-model": model,
+      className: cn("sm:text-sm", className),
+      action: /* @__PURE__ */ jsxs(Fragment, { children: [
+        !collapsed && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Button, { href: accessLink.href, variant: "brand", size: "sm", children: accessLink.label }),
+          /* @__PURE__ */ jsx(Button, { href: signInHref, variant: "secondary", size: "sm", children: landing.signIn })
+        ] }),
+        /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            size: "2xs",
+            variant: "ghost",
+            label: labels.details,
+            "aria-expanded": !collapsed,
+            onClick: toggle,
+            children: collapsed ? /* @__PURE__ */ jsx(ChevronDown, {}) : /* @__PURE__ */ jsx(ChevronUp, {})
+          }
+        )
+      ] }),
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "font-semibold", children: timeText(countdown, labels) }),
+        !collapsed && /* @__PURE__ */ jsxs(Fragment, { children: [
+          " ",
+          /* @__PURE__ */ jsx("span", { children: model === "read-only" ? labels.readOnly : labels.sandbox })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  DemoBanner
+};
+//# sourceMappingURL=demo-banner.js.map

package/dist/demo/demo-banner.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/demo/demo-banner.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport { ChevronDown, ChevronUp, Timer } from \"lucide-react\";\n\nimport { cn } from \"../lib/cn\";\nimport { AlertBanner } from \"../components/alert-banner\";\nimport { Button, IconButton } from \"../components/ui\";\nimport { useAccessAction } from \"../landing/access\";\nimport type { AccessChoice } from \"../landing/access\";\nimport { useLandingLabels } from \"../landing/landing-labels\";\nimport type { LandingLabels } from \"../landing/landing-labels\";\nimport { useDemoCountdown } from \"./demo-countdown\";\nimport type { DemoCountdown, DemoExpiry } from \"./demo-countdown\";\nimport { useDemoLabels } from \"./demo-labels\";\nimport type { DemoLabels } from \"./demo-labels\";\nimport type { DemoModel } from \"./demo-session\";\n\n/** The default `sessionStorage` key of the collapsed state. */\nconst COLLAPSE_KEY = \"kit.demoBanner.collapsed\";\n\n/** `sessionStorage`, guarded like `lib/safe-storage`'s `localStorage`: blocked storage\n *  reads as \"not set\" and writes nothing. */\nfunction readSession(key: string): string | null {\n  if (typeof window === \"undefined\") return null;\n  try {\n    return window.sessionStorage.getItem(key);\n  } catch {\n    return null;\n  }\n}\n\nfunction writeSession(key: string, value: string | null): void {\n  if (typeof window === \"undefined\") return;\n  try {\n    if (value === null) window.sessionStorage.removeItem(key);\n    else window.sessionStorage.setItem(key, value);\n  } catch {\n    // storage blocked: the banner just opens again next time\n  }\n}\n\n/** \"Demo · 23 h 12 min left\", \"Demo · 50 min left\", the end, or plain \"Demo\". */\nfunction timeText(countdown: DemoCountdown, labels: DemoLabels): string {\n  if (countdown.minutesLeft === null) return labels.badge;\n  if (countdown.ended) return labels.endedTitle;\n  return countdown.lastHour\n    ? labels.minutesLeft(countdown.minutes)\n    : labels.hoursLeft(countdown.hours, countdown.minutes);\n}\n\nexport interface DemoBannerProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\" | \"onClick\"> {\n  /** The demo's end: `expires_at` from the `TokenResponse`, or `demo_expires_at` from\n   *  `/auth/me` (§5.3). */\n  expiresAt: DemoExpiry | null | undefined;\n  /** Which line the banner says about the data (§2.3). */\n  model: DemoModel;\n  /** \"Request access\". */\n  access: AccessChoice;\n  /** \"Sign in\" — let through for a demo session by `RedirectIfAuthed allowDemo`. Default\n   *  `/login`. */\n  signInHref?: string;\n  /** The countdown reached zero: clear the session and replace to `/demo/ended` (§5.5). */\n  onEnded?: () => void;\n  /** Where the collapsed state is kept for the tab's session. Default\n   *  `kit.demoBanner.collapsed`. */\n  collapseKey?: string;\n  /** The clock, for tests and previews. Default `Date.now`. Keep it stable. */\n  now?: () => number;\n  labels?: Partial<DemoLabels>;\n  /** The access words (`landing` namespace) for this instance. */\n  landingLabels?: Partial<LandingLabels>;\n}\n\n/**\n * The demo's strip under the top bar, on every page of a demo session\n * (docs/landing-demo-harmonization.md §5.4) — a kit `AlertBanner` strip:\n *\n * - the time left, \"Demo · 23 h 12 min left\" — minutes only in the last hour, and the\n *   warning tone in the last ten minutes (`useDemoCountdown`);\n * - one line on the model: R \"You're looking at sample data. Changes aren't possible.\",\n *   S \"Your own work is deleted when the demo ends.\";\n * - \"Request access\" (the mail) and \"Sign in\".\n *\n * It collapses to the countdown alone, for the tab's session (`sessionStorage`) — never\n * hidden for good: it is a live state, like keksdose's preview banner, which a demo user\n * gets instead of. At zero it calls `onEnded`.\n *\n * The countdown is no live region: a sentence read out every minute would drown the\n * page. A screen-reader user meets it at the top of the page, and the end page says\n * the rest.\n */\nexport function DemoBanner({\n  expiresAt,\n  model,\n  access,\n  signInHref = \"/login\",\n  onEnded,\n  collapseKey = COLLAPSE_KEY,\n  now,\n  labels: labelsProp,\n  landingLabels,\n  className,\n  ...rest\n}: DemoBannerProps) {\n  const labels = useDemoLabels(labelsProp);\n  const landing = useLandingLabels(landingLabels);\n  const accessLink = useAccessAction(access, landingLabels);\n  const countdown = useDemoCountdown(expiresAt, { now, onEnded });\n  const [collapsed, setCollapsed] = useState(() => readSession(collapseKey) === \"1\");\n\n  const toggle = () => {\n    const next = !collapsed;\n    setCollapsed(next);\n    writeSession(collapseKey, next ? \"1\" : null);\n  };\n\n  return (\n    <AlertBanner\n      {...rest}\n      variant=\"strip\"\n      size=\"sm\"\n      tone={countdown.warning || countdown.ended ? \"warning\" : \"info\"}\n      icon={<Timer />}\n      data-demo-model={model}\n      className={cn(\"sm:text-sm\", className)}\n      action={\n        <>\n          {!collapsed && (\n            <>\n              <Button href={accessLink.href} variant=\"brand\" size=\"sm\">\n                {accessLink.label}\n              </Button>\n              <Button href={signInHref} variant=\"secondary\" size=\"sm\">\n                {landing.signIn}\n              </Button>\n            </>\n          )}\n          <IconButton\n            size=\"2xs\"\n            variant=\"ghost\"\n            label={labels.details}\n            aria-expanded={!collapsed}\n            onClick={toggle}\n          >\n            {collapsed ? <ChevronDown /> : <ChevronUp />}\n          </IconButton>\n        </>\n      }\n    >\n      <span className=\"font-semibold\">{timeText(countdown, labels)}</span>\n      {!collapsed && (\n        <>\n          {\" \"}\n          <span>{model === \"read-only\" ? labels.readOnly : labels.sandbox}</span>\n        </>\n      )}\n    </AlertBanner>\n  );\n}\n"],"mappings":";AA0HY,SAMA,UANA,KAMA,YANA;AA1HZ,SAAS,gBAAgB;AAEzB,SAAS,aAAa,WAAW,aAAa;AAE9C,SAAS,UAAU;AACnB,SAAS,mBAAmB;AAC5B,SAAS,QAAQ,kBAAkB;AACnC,SAAS,uBAAuB;AAEhC,SAAS,wBAAwB;AAEjC,SAAS,wBAAwB;AAEjC,SAAS,qBAAqB;AAK9B,MAAM,eAAe;AAIrB,SAAS,YAAY,KAA4B;AAC/C,MAAI,OAAO,WAAW,YAAa,QAAO;AAC1C,MAAI;AACF,WAAO,OAAO,eAAe,QAAQ,GAAG;AAAA,EAC1C,QAAQ;AACN,WAAO;AAAA,EACT;AACF;AAEA,SAAS,aAAa,KAAa,OAA4B;AAC7D,MAAI,OAAO,WAAW,YAAa;AACnC,MAAI;AACF,QAAI,UAAU,KAAM,QAAO,eAAe,WAAW,GAAG;AAAA,QACnD,QAAO,eAAe,QAAQ,KAAK,KAAK;AAAA,EAC/C,QAAQ;AAAA,EAER;AACF;AAGA,SAAS,SAAS,WAA0B,QAA4B;AACtE,MAAI,UAAU,gBAAgB,KAAM,QAAO,OAAO;AAClD,MAAI,UAAU,MAAO,QAAO,OAAO;AACnC,SAAO,UAAU,WACb,OAAO,YAAY,UAAU,OAAO,IACpC,OAAO,UAAU,UAAU,OAAO,UAAU,OAAO;AACzD;AA2CO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAoB;AAClB,QAAM,SAAS,cAAc,UAAU;AACvC,QAAM,UAAU,iBAAiB,aAAa;AAC9C,QAAM,aAAa,gBAAgB,QAAQ,aAAa;AACxD,QAAM,YAAY,iBAAiB,WAAW,EAAE,KAAK,QAAQ,CAAC;AAC9D,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,MAAM,YAAY,WAAW,MAAM,GAAG;AAEjF,QAAM,SAAS,MAAM;AACnB,UAAM,OAAO,CAAC;AACd,iBAAa,IAAI;AACjB,iBAAa,aAAa,OAAO,MAAM,IAAI;AAAA,EAC7C;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,MAAM,UAAU,WAAW,UAAU,QAAQ,YAAY;AAAA,MACzD,MAAM,oBAAC,SAAM;AAAA,MACb,mBAAiB;AAAA,MACjB,WAAW,GAAG,cAAc,SAAS;AAAA,MACrC,QACE,iCACG;AAAA,SAAC,aACA,iCACE;AAAA,8BAAC,UAAO,MAAM,WAAW,MAAM,SAAQ,SAAQ,MAAK,MACjD,qBAAW,OACd;AAAA,UACA,oBAAC,UAAO,MAAM,YAAY,SAAQ,aAAY,MAAK,MAChD,kBAAQ,QACX;AAAA,WACF;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,OAAO,OAAO;AAAA,YACd,iBAAe,CAAC;AAAA,YAChB,SAAS;AAAA,YAER,sBAAY,oBAAC,eAAY,IAAK,oBAAC,aAAU;AAAA;AAAA,QAC5C;AAAA,SACF;AAAA,MAGF;AAAA,4BAAC,UAAK,WAAU,iBAAiB,mBAAS,WAAW,MAAM,GAAE;AAAA,QAC5D,CAAC,aACA,iCACG;AAAA;AAAA,UACD,oBAAC,UAAM,oBAAU,cAAc,OAAO,WAAW,OAAO,SAAQ;AAAA,WAClE;AAAA;AAAA;AAAA,EAEJ;AAEJ;","names":[]}

package/dist/demo/demo-countdown.d.ts

@@ -0,0 +1,58 @@
+/**
+ * The demo's countdown (docs/landing-demo-harmonization.md §5.3, §5.4): the time left to
+ * the demo account's end, from `expires_at` (the `TokenResponse`) or `demo_expires_at`
+ * (`/auth/me`). The client never decodes the JWT.
+ */
+/** When the demo ends: an ISO timestamp from the server, epoch milliseconds, or a
+ *  `Date`. */
+type DemoExpiry = string | number | Date;
+/** The last stretch, in minutes, in which the banner turns to the warning tone (§5.4). */
+declare const DEMO_WARNING_MINUTES = 10;
+/** Below this many minutes the countdown shows minutes only (§5.4). */
+declare const DEMO_MINUTES_ONLY = 60;
+interface DemoCountdown {
+    /**
+     * Whole minutes left, ROUNDED UP — 30 s left is "1 min", and 0 only once the demo has
+     * ended. `null` when `expiresAt` cannot be read: the countdown then shows no time and
+     * never ends by itself (a parse slip must not throw a visitor out).
+     */
+    minutesLeft: number | null;
+    /** The display split: whole hours, and the minutes past them. In the last hour
+     *  (`lastHour`) `hours` is 0 and `minutes` is `minutesLeft`. */
+    hours: number;
+    minutes: number;
+    /** `minutesLeft <= 60`: show minutes only. */
+    lastHour: boolean;
+    /** `minutesLeft <= 10`: the warning tone. */
+    warning: boolean;
+    /** The demo's time is up. */
+    ended: boolean;
+}
+/**
+ * The countdown at `now` — pure, for a test or a server-rendered value. See
+ * {@link DemoCountdown} for the rounding and the thresholds.
+ */
+declare function demoCountdown(expiresAt: DemoExpiry | null | undefined, now: number): DemoCountdown;
+interface DemoCountdownOptions {
+    /**
+     * The clock, in epoch milliseconds. Default `Date.now`. A test passes its own (or uses
+     * fake timers, which move `Date.now` too). Keep it a stable function — a new one each
+     * render re-arms the timer each render.
+     */
+    now?: () => number;
+    /** Called once when the countdown reaches zero — also on mount, if it already has.
+     *  The app clears the session and replaces to `/demo/ended` (§5.5). */
+    onEnded?: () => void;
+}
+/**
+ * The time left to `expiresAt`, re-rendering when the shown minute changes — one timer
+ * to the next minute boundary, not a tick a second — and once more when the tab comes
+ * back from the background (a hidden tab's timers are throttled).
+ *
+ * `onEnded` fires at zero (§5.5). The countdown is the client's, from `expires_at`; the
+ * server's answer to a request after the end (a 401) ends the demo as well — the app's
+ * 401 handler, not this hook.
+ */
+declare function useDemoCountdown(expiresAt: DemoExpiry | null | undefined, { now, onEnded }?: DemoCountdownOptions): DemoCountdown;
+
+export { DEMO_MINUTES_ONLY, DEMO_WARNING_MINUTES, type DemoCountdown, type DemoCountdownOptions, type DemoExpiry, demoCountdown, useDemoCountdown };

package/dist/demo/demo-countdown.js

@@ -0,0 +1,79 @@
+"use client";
+import { useCallback, useEffect, useEffectEvent, useSyncExternalStore } from "react";
+const DEMO_WARNING_MINUTES = 10;
+const DEMO_MINUTES_ONLY = 60;
+const MINUTE = 6e4;
+function expiryMs(expiresAt) {
+  if (expiresAt === null || expiresAt === void 0) return Number.NaN;
+  if (typeof expiresAt === "number") return expiresAt;
+  if (expiresAt instanceof Date) return expiresAt.getTime();
+  return Date.parse(expiresAt);
+}
+function minutesAt(expiry, now) {
+  if (!Number.isFinite(expiry)) return null;
+  return Math.max(0, Math.ceil((expiry - now) / MINUTE));
+}
+function demoCountdown(expiresAt, now) {
+  return countdownOf(minutesAt(expiryMs(expiresAt), now));
+}
+function countdownOf(minutesLeft) {
+  if (minutesLeft === null) {
+    return { minutesLeft, hours: 0, minutes: 0, lastHour: false, warning: false, ended: false };
+  }
+  const lastHour = minutesLeft <= DEMO_MINUTES_ONLY;
+  return {
+    minutesLeft,
+    hours: lastHour ? 0 : Math.floor(minutesLeft / 60),
+    minutes: lastHour ? minutesLeft : minutesLeft % 60,
+    lastHour,
+    warning: minutesLeft <= DEMO_WARNING_MINUTES,
+    ended: minutesLeft === 0
+  };
+}
+function useDemoCountdown(expiresAt, { now = Date.now, onEnded } = {}) {
+  const expiry = expiryMs(expiresAt);
+  const subscribe = useCallback(
+    (notify) => {
+      if (!Number.isFinite(expiry)) return () => {
+      };
+      let timer;
+      const arm = () => {
+        const left = expiry - now();
+        if (left <= 0) return;
+        const delay = left - (Math.ceil(left / MINUTE) - 1) * MINUTE;
+        timer = setTimeout(() => {
+          notify();
+          arm();
+        }, delay);
+      };
+      const onVisible = () => {
+        if (document.visibilityState !== "visible") return;
+        clearTimeout(timer);
+        notify();
+        arm();
+      };
+      arm();
+      document.addEventListener("visibilitychange", onVisible);
+      return () => {
+        clearTimeout(timer);
+        document.removeEventListener("visibilitychange", onVisible);
+      };
+    },
+    [expiry, now]
+  );
+  const snapshot = () => minutesAt(expiry, now());
+  const minutesLeft = useSyncExternalStore(subscribe, snapshot, snapshot);
+  const countdown = countdownOf(minutesLeft);
+  const fireEnded = useEffectEvent(() => onEnded?.());
+  useEffect(() => {
+    if (countdown.ended) fireEnded();
+  }, [countdown.ended]);
+  return countdown;
+}
+export {
+  DEMO_MINUTES_ONLY,
+  DEMO_WARNING_MINUTES,
+  demoCountdown,
+  useDemoCountdown
+};
+//# sourceMappingURL=demo-countdown.js.map

package/dist/demo/demo-countdown.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/demo/demo-countdown.ts"],"sourcesContent":["import { useCallback, useEffect, useEffectEvent, useSyncExternalStore } from \"react\";\n\n/**\n * The demo's countdown (docs/landing-demo-harmonization.md §5.3, §5.4): the time left to\n * the demo account's end, from `expires_at` (the `TokenResponse`) or `demo_expires_at`\n * (`/auth/me`). The client never decodes the JWT.\n */\n\n/** When the demo ends: an ISO timestamp from the server, epoch milliseconds, or a\n *  `Date`. */\nexport type DemoExpiry = string | number | Date;\n\n/** The last stretch, in minutes, in which the banner turns to the warning tone (§5.4). */\nexport const DEMO_WARNING_MINUTES = 10;\n/** Below this many minutes the countdown shows minutes only (§5.4). */\nexport const DEMO_MINUTES_ONLY = 60;\n\nconst MINUTE = 60_000;\n\nexport interface DemoCountdown {\n  /**\n   * Whole minutes left, ROUNDED UP — 30 s left is \"1 min\", and 0 only once the demo has\n   * ended. `null` when `expiresAt` cannot be read: the countdown then shows no time and\n   * never ends by itself (a parse slip must not throw a visitor out).\n   */\n  minutesLeft: number | null;\n  /** The display split: whole hours, and the minutes past them. In the last hour\n   *  (`lastHour`) `hours` is 0 and `minutes` is `minutesLeft`. */\n  hours: number;\n  minutes: number;\n  /** `minutesLeft <= 60`: show minutes only. */\n  lastHour: boolean;\n  /** `minutesLeft <= 10`: the warning tone. */\n  warning: boolean;\n  /** The demo's time is up. */\n  ended: boolean;\n}\n\n/** `expiresAt` as epoch milliseconds, or NaN. */\nfunction expiryMs(expiresAt: DemoExpiry | null | undefined): number {\n  if (expiresAt === null || expiresAt === undefined) return Number.NaN;\n  if (typeof expiresAt === \"number\") return expiresAt;\n  if (expiresAt instanceof Date) return expiresAt.getTime();\n  return Date.parse(expiresAt);\n}\n\n/** Whole minutes left at `now`, rounded up, never below 0; null for an unreadable end. */\nfunction minutesAt(expiry: number, now: number): number | null {\n  if (!Number.isFinite(expiry)) return null;\n  return Math.max(0, Math.ceil((expiry - now) / MINUTE));\n}\n\n/**\n * The countdown at `now` — pure, for a test or a server-rendered value. See\n * {@link DemoCountdown} for the rounding and the thresholds.\n */\nexport function demoCountdown(expiresAt: DemoExpiry | null | undefined, now: number): DemoCountdown {\n  return countdownOf(minutesAt(expiryMs(expiresAt), now));\n}\n\nfunction countdownOf(minutesLeft: number | null): DemoCountdown {\n  if (minutesLeft === null) {\n    return { minutesLeft, hours: 0, minutes: 0, lastHour: false, warning: false, ended: false };\n  }\n  const lastHour = minutesLeft <= DEMO_MINUTES_ONLY;\n  return {\n    minutesLeft,\n    hours: lastHour ? 0 : Math.floor(minutesLeft / 60),\n    minutes: lastHour ? minutesLeft : minutesLeft % 60,\n    lastHour,\n    warning: minutesLeft <= DEMO_WARNING_MINUTES,\n    ended: minutesLeft === 0,\n  };\n}\n\nexport interface DemoCountdownOptions {\n  /**\n   * The clock, in epoch milliseconds. Default `Date.now`. A test passes its own (or uses\n   * fake timers, which move `Date.now` too). Keep it a stable function — a new one each\n   * render re-arms the timer each render.\n   */\n  now?: () => number;\n  /** Called once when the countdown reaches zero — also on mount, if it already has.\n   *  The app clears the session and replaces to `/demo/ended` (§5.5). */\n  onEnded?: () => void;\n}\n\n/**\n * The time left to `expiresAt`, re-rendering when the shown minute changes — one timer\n * to the next minute boundary, not a tick a second — and once more when the tab comes\n * back from the background (a hidden tab's timers are throttled).\n *\n * `onEnded` fires at zero (§5.5). The countdown is the client's, from `expires_at`; the\n * server's answer to a request after the end (a 401) ends the demo as well — the app's\n * 401 handler, not this hook.\n */\nexport function useDemoCountdown(\n  expiresAt: DemoExpiry | null | undefined,\n  { now = Date.now, onEnded }: DemoCountdownOptions = {},\n): DemoCountdown {\n  const expiry = expiryMs(expiresAt);\n  const subscribe = useCallback(\n    (notify: () => void) => {\n      if (!Number.isFinite(expiry)) return () => {};\n      let timer: ReturnType<typeof setTimeout> | undefined;\n      const arm = () => {\n        const left = expiry - now();\n        if (left <= 0) return;\n        // The rounded-up minute changes when `left` crosses the next whole minute below.\n        const delay = left - (Math.ceil(left / MINUTE) - 1) * MINUTE;\n        timer = setTimeout(() => {\n          notify();\n          arm();\n        }, delay);\n      };\n      const onVisible = () => {\n        if (document.visibilityState !== \"visible\") return;\n        clearTimeout(timer);\n        notify();\n        arm();\n      };\n      arm();\n      document.addEventListener(\"visibilitychange\", onVisible);\n      return () => {\n        clearTimeout(timer);\n        document.removeEventListener(\"visibilitychange\", onVisible);\n      };\n    },\n    [expiry, now],\n  );\n  const snapshot = () => minutesAt(expiry, now());\n  const minutesLeft = useSyncExternalStore(subscribe, snapshot, snapshot);\n  const countdown = countdownOf(minutesLeft);\n\n  const fireEnded = useEffectEvent(() => onEnded?.());\n  useEffect(() => {\n    if (countdown.ended) fireEnded();\n  }, [countdown.ended]);\n\n  return countdown;\n}\n"],"mappings":";AAAA,SAAS,aAAa,WAAW,gBAAgB,4BAA4B;AAatE,MAAM,uBAAuB;AAE7B,MAAM,oBAAoB;AAEjC,MAAM,SAAS;AAsBf,SAAS,SAAS,WAAkD;AAClE,MAAI,cAAc,QAAQ,cAAc,OAAW,QAAO,OAAO;AACjE,MAAI,OAAO,cAAc,SAAU,QAAO;AAC1C,MAAI,qBAAqB,KAAM,QAAO,UAAU,QAAQ;AACxD,SAAO,KAAK,MAAM,SAAS;AAC7B;AAGA,SAAS,UAAU,QAAgB,KAA4B;AAC7D,MAAI,CAAC,OAAO,SAAS,MAAM,EAAG,QAAO;AACrC,SAAO,KAAK,IAAI,GAAG,KAAK,MAAM,SAAS,OAAO,MAAM,CAAC;AACvD;AAMO,SAAS,cAAc,WAA0C,KAA4B;AAClG,SAAO,YAAY,UAAU,SAAS,SAAS,GAAG,GAAG,CAAC;AACxD;AAEA,SAAS,YAAY,aAA2C;AAC9D,MAAI,gBAAgB,MAAM;AACxB,WAAO,EAAE,aAAa,OAAO,GAAG,SAAS,GAAG,UAAU,OAAO,SAAS,OAAO,OAAO,MAAM;AAAA,EAC5F;AACA,QAAM,WAAW,eAAe;AAChC,SAAO;AAAA,IACL;AAAA,IACA,OAAO,WAAW,IAAI,KAAK,MAAM,cAAc,EAAE;AAAA,IACjD,SAAS,WAAW,cAAc,cAAc;AAAA,IAChD;AAAA,IACA,SAAS,eAAe;AAAA,IACxB,OAAO,gBAAgB;AAAA,EACzB;AACF;AAuBO,SAAS,iBACd,WACA,EAAE,MAAM,KAAK,KAAK,QAAQ,IAA0B,CAAC,GACtC;AACf,QAAM,SAAS,SAAS,SAAS;AACjC,QAAM,YAAY;AAAA,IAChB,CAAC,WAAuB;AACtB,UAAI,CAAC,OAAO,SAAS,MAAM,EAAG,QAAO,MAAM;AAAA,MAAC;AAC5C,UAAI;AACJ,YAAM,MAAM,MAAM;AAChB,cAAM,OAAO,SAAS,IAAI;AAC1B,YAAI,QAAQ,EAAG;AAEf,cAAM,QAAQ,QAAQ,KAAK,KAAK,OAAO,MAAM,IAAI,KAAK;AACtD,gBAAQ,WAAW,MAAM;AACvB,iBAAO;AACP,cAAI;AAAA,QACN,GAAG,KAAK;AAAA,MACV;AACA,YAAM,YAAY,MAAM;AACtB,YAAI,SAAS,oBAAoB,UAAW;AAC5C,qBAAa,KAAK;AAClB,eAAO;AACP,YAAI;AAAA,MACN;AACA,UAAI;AACJ,eAAS,iBAAiB,oBAAoB,SAAS;AACvD,aAAO,MAAM;AACX,qBAAa,KAAK;AAClB,iBAAS,oBAAoB,oBAAoB,SAAS;AAAA,MAC5D;AAAA,IACF;AAAA,IACA,CAAC,QAAQ,GAAG;AAAA,EACd;AACA,QAAM,WAAW,MAAM,UAAU,QAAQ,IAAI,CAAC;AAC9C,QAAM,cAAc,qBAAqB,WAAW,UAAU,QAAQ;AACtE,QAAM,YAAY,YAAY,WAAW;AAEzC,QAAM,YAAY,eAAe,MAAM,UAAU,CAAC;AAClD,YAAU,MAAM;AACd,QAAI,UAAU,MAAO,WAAU;AAAA,EACjC,GAAG,CAAC,UAAU,KAAK,CAAC;AAEpB,SAAO;AACT;","names":[]}

package/dist/demo/demo-ended.d.ts

@@ -0,0 +1,45 @@
+import * as react from 'react';
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { AuthHeadingLevel } from '../auth/status-parts.js';
+import { AccessChoice } from '../landing/access.js';
+import { LandingLabels } from '../landing/landing-labels.js';
+import { DemoLabels } from './demo-labels.js';
+import { DemoModel } from './demo-session.js';
+
+interface DemoEndedProps extends Omit<ComponentPropsWithoutRef<"div">, "children" | "title"> {
+    /** Which line the page says about the data (§2.3). */
+    model: DemoModel;
+    /** "Request access". */
+    access: AccessChoice;
+    /** "Start a new demo". Default `/demo` — a new demo may start after one ends, within
+     *  the per-IP window (§2.7). */
+    restartHref?: string;
+    /** "Sign in". Default `/login`. */
+    signInHref?: string;
+    /** App content under the line. */
+    children?: ReactNode;
+    /** `false` adds no `noindex` — for a preview. Default `true` (§4.3). */
+    noIndex?: boolean;
+    /** Default `h2`, under `AuthLayout`'s `h1`. */
+    headingAs?: AuthHeadingLevel;
+    labels?: Partial<DemoLabels>;
+    /** The access words (`landing` namespace) for this instance. */
+    landingLabels?: Partial<LandingLabels>;
+}
+/**
+ * The `/demo/ended` page's content (docs/landing-demo-harmonization.md §5.5): "The demo
+ * has ended", one line on what became of the data, and three ways on — "Start a new
+ * demo", "Request access", "Sign in".
+ *
+ * Where a demo lands at `expires_at`, or on ANY 401 while the session is a demo: the
+ * client clears the session and replaces to `/demo/ended`, never to `/login`. keksdose's
+ * expired demo met an unexplained sign-in form. The server deletes the user at the next
+ * reap; nothing is kept.
+ *
+ * Content, like `NotFoundPage`: put it in the app's `AuthLayout` (its logo, language
+ * menu and legal footer). It marks the page `noindex`; robots.txt must NOT disallow it,
+ * or a crawler could never read that (§10.8).
+ */
+declare function DemoEnded({ model, access, restartHref, signInHref, children, noIndex, headingAs: Heading, labels: labelsProp, landingLabels, className, ...rest }: DemoEndedProps): react.JSX.Element;
+
+export { DemoEnded, type DemoEndedProps };

package/dist/demo/demo-ended.js

@@ -0,0 +1,42 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Hourglass } from "lucide-react";
+import { cn } from "../lib/cn.js";
+import { Button } from "../components/ui.js";
+import { useNoIndex } from "../hooks/use-noindex.js";
+import { useAccessAction } from "../landing/access.js";
+import { useLandingLabels } from "../landing/landing-labels.js";
+import { useDemoLabels } from "./demo-labels.js";
+function DemoEnded({
+  model,
+  access,
+  restartHref = "/demo",
+  signInHref = "/login",
+  children,
+  noIndex = true,
+  headingAs: Heading = "h2",
+  labels: labelsProp,
+  landingLabels,
+  className,
+  ...rest
+}) {
+  const labels = useDemoLabels(labelsProp);
+  const landing = useLandingLabels(landingLabels);
+  const accessLink = useAccessAction(access, landingLabels);
+  useNoIndex(noIndex);
+  return /* @__PURE__ */ jsxs("div", { ...rest, className: cn("flex flex-col items-center gap-2 py-4 text-center", className), children: [
+    /* @__PURE__ */ jsx(Hourglass, { "aria-hidden": true, className: "size-10 text-[var(--text-placeholder)]" }),
+    /* @__PURE__ */ jsx(Heading, { className: "mt-2 text-xl font-semibold text-[var(--text-primary)]", children: labels.endedTitle }),
+    /* @__PURE__ */ jsx("p", { className: "max-w-prose text-sm text-[var(--text-secondary)]", children: model === "sandbox" ? labels.endedSandbox : labels.endedReadOnly }),
+    children,
+    /* @__PURE__ */ jsxs("div", { className: "mt-4 flex w-full flex-col gap-2 sm:w-auto sm:flex-row sm:flex-wrap sm:justify-center", children: [
+      /* @__PURE__ */ jsx(Button, { href: restartHref, variant: "brand", children: labels.restart }),
+      /* @__PURE__ */ jsx(Button, { href: accessLink.href, variant: "secondary", children: accessLink.label }),
+      /* @__PURE__ */ jsx(Button, { href: signInHref, variant: "secondary", children: landing.signIn })
+    ] })
+  ] });
+}
+export {
+  DemoEnded
+};
+//# sourceMappingURL=demo-ended.js.map

package/dist/demo/demo-ended.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/demo/demo-ended.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport { Hourglass } from \"lucide-react\";\n\nimport { cn } from \"../lib/cn\";\nimport { Button } from \"../components/ui\";\nimport { useNoIndex } from \"../hooks/use-noindex\";\nimport type { AuthHeadingLevel } from \"../auth/status-parts\";\nimport { useAccessAction } from \"../landing/access\";\nimport type { AccessChoice } from \"../landing/access\";\nimport { useLandingLabels } from \"../landing/landing-labels\";\nimport type { LandingLabels } from \"../landing/landing-labels\";\nimport { useDemoLabels } from \"./demo-labels\";\nimport type { DemoLabels } from \"./demo-labels\";\nimport type { DemoModel } from \"./demo-session\";\n\nexport interface DemoEndedProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\" | \"title\"> {\n  /** Which line the page says about the data (§2.3). */\n  model: DemoModel;\n  /** \"Request access\". */\n  access: AccessChoice;\n  /** \"Start a new demo\". Default `/demo` — a new demo may start after one ends, within\n   *  the per-IP window (§2.7). */\n  restartHref?: string;\n  /** \"Sign in\". Default `/login`. */\n  signInHref?: string;\n  /** App content under the line. */\n  children?: ReactNode;\n  /** `false` adds no `noindex` — for a preview. Default `true` (§4.3). */\n  noIndex?: boolean;\n  /** Default `h2`, under `AuthLayout`'s `h1`. */\n  headingAs?: AuthHeadingLevel;\n  labels?: Partial<DemoLabels>;\n  /** The access words (`landing` namespace) for this instance. */\n  landingLabels?: Partial<LandingLabels>;\n}\n\n/**\n * The `/demo/ended` page's content (docs/landing-demo-harmonization.md §5.5): \"The demo\n * has ended\", one line on what became of the data, and three ways on — \"Start a new\n * demo\", \"Request access\", \"Sign in\".\n *\n * Where a demo lands at `expires_at`, or on ANY 401 while the session is a demo: the\n * client clears the session and replaces to `/demo/ended`, never to `/login`. keksdose's\n * expired demo met an unexplained sign-in form. The server deletes the user at the next\n * reap; nothing is kept.\n *\n * Content, like `NotFoundPage`: put it in the app's `AuthLayout` (its logo, language\n * menu and legal footer). It marks the page `noindex`; robots.txt must NOT disallow it,\n * or a crawler could never read that (§10.8).\n */\nexport function DemoEnded({\n  model,\n  access,\n  restartHref = \"/demo\",\n  signInHref = \"/login\",\n  children,\n  noIndex = true,\n  headingAs: Heading = \"h2\",\n  labels: labelsProp,\n  landingLabels,\n  className,\n  ...rest\n}: DemoEndedProps) {\n  const labels = useDemoLabels(labelsProp);\n  const landing = useLandingLabels(landingLabels);\n  const accessLink = useAccessAction(access, landingLabels);\n  useNoIndex(noIndex);\n  return (\n    <div {...rest} className={cn(\"flex flex-col items-center gap-2 py-4 text-center\", className)}>\n      <Hourglass aria-hidden className=\"size-10 text-[var(--text-placeholder)]\" />\n      <Heading className=\"mt-2 text-xl font-semibold text-[var(--text-primary)]\">{labels.endedTitle}</Heading>\n      <p className=\"max-w-prose text-sm text-[var(--text-secondary)]\">\n        {model === \"sandbox\" ? labels.endedSandbox : labels.endedReadOnly}\n      </p>\n      {children}\n      <div className=\"mt-4 flex w-full flex-col gap-2 sm:w-auto sm:flex-row sm:flex-wrap sm:justify-center\">\n        <Button href={restartHref} variant=\"brand\">\n          {labels.restart}\n        </Button>\n        <Button href={accessLink.href} variant=\"secondary\">\n          {accessLink.label}\n        </Button>\n        <Button href={signInHref} variant=\"secondary\">\n          {landing.signIn}\n        </Button>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAqEM,cAMA,YANA;AApEN,SAAS,iBAAiB;AAE1B,SAAS,UAAU;AACnB,SAAS,cAAc;AACvB,SAAS,kBAAkB;AAE3B,SAAS,uBAAuB;AAEhC,SAAS,wBAAwB;AAEjC,SAAS,qBAAqB;AAuCvB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,aAAa;AAAA,EACb;AAAA,EACA,UAAU;AAAA,EACV,WAAW,UAAU;AAAA,EACrB,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAmB;AACjB,QAAM,SAAS,cAAc,UAAU;AACvC,QAAM,UAAU,iBAAiB,aAAa;AAC9C,QAAM,aAAa,gBAAgB,QAAQ,aAAa;AACxD,aAAW,OAAO;AAClB,SACE,qBAAC,SAAK,GAAG,MAAM,WAAW,GAAG,qDAAqD,SAAS,GACzF;AAAA,wBAAC,aAAU,eAAW,MAAC,WAAU,0CAAyC;AAAA,IAC1E,oBAAC,WAAQ,WAAU,yDAAyD,iBAAO,YAAW;AAAA,IAC9F,oBAAC,OAAE,WAAU,oDACV,oBAAU,YAAY,OAAO,eAAe,OAAO,eACtD;AAAA,IACC;AAAA,IACD,qBAAC,SAAI,WAAU,wFACb;AAAA,0BAAC,UAAO,MAAM,aAAa,SAAQ,SAChC,iBAAO,SACV;AAAA,MACA,oBAAC,UAAO,MAAM,WAAW,MAAM,SAAQ,aACpC,qBAAW,OACd;AAAA,MACA,oBAAC,UAAO,MAAM,YAAY,SAAQ,aAC/B,kBAAQ,QACX;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}