@sweberdev/witness-react 0.0.0-stage → 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Seya
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,19 @@
-# Temporary Holding Version
+# @sweberdev/witness-react
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+React components for [Witness](https://packages.sweber.dev/witness): the chatbot AI notice (EU AI Act Art. 50(1)), AI labels and marked content blocks.
+
+```sh
+pnpm add @sweberdev/witness @sweberdev/witness-react
+```
+
+```tsx
+import "@sweberdev/witness/styles.css";
+import { AiContent, AiLabel, AiNotice, WitnessProvider } from "@sweberdev/witness-react";
+
+<WitnessProvider locale="de">
+  <AiNotice id="support-chat" href="/ki-einsatz" />
+  <AiContent marking={{ generator: "Claude" }}>{summary}</AiContent>
+</WitnessProvider>;
+```
+
+Docs: [packages.sweber.dev/witness/docs/guides/react](https://packages.sweber.dev/witness/docs/guides/react) · MIT

package/dist/index.cjs

@@ -0,0 +1,346 @@
+"use client";
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  AiContent: () => AiContent,
+  AiLabel: () => AiLabel,
+  AiNotice: () => AiNotice,
+  WitnessProvider: () => WitnessProvider,
+  useAiDisclosure: () => useAiDisclosure,
+  useWitnessMessages: () => useWitnessMessages
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/AiContent.tsx
+var import_witness4 = require("@sweberdev/witness");
+var import_react5 = require("react");
+
+// src/AiLabel.tsx
+var import_witness3 = require("@sweberdev/witness");
+var import_react4 = require("react");
+
+// src/AiNotice.tsx
+var import_react3 = require("react");
+
+// src/context.tsx
+var import_witness = require("@sweberdev/witness");
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var WitnessContext = (0, import_react.createContext)(null);
+function WitnessProvider({ locale, messages, children }) {
+  const value = (0, import_react.useMemo)(
+    () => ({ locale: (0, import_witness.resolveLocale)(locale), messages: (0, import_witness.getMessages)(locale, messages) }),
+    [locale, messages]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WitnessContext.Provider, { value, children });
+}
+function useWitnessMessages(locale) {
+  const context = (0, import_react.useContext)(WitnessContext);
+  return (0, import_react.useMemo)(() => {
+    if (locale) return { locale: (0, import_witness.resolveLocale)(locale), messages: (0, import_witness.getMessages)(locale) };
+    return context ?? { locale: "en", messages: (0, import_witness.getMessages)("en") };
+  }, [context, locale]);
+}
+
+// src/useAiDisclosure.ts
+var import_witness2 = require("@sweberdev/witness");
+var import_react2 = require("react");
+function useAiDisclosure(options = {}) {
+  const onEvent = (0, import_react2.useRef)(options.onEvent);
+  onEvent.current = options.onEvent;
+  const { id, kind, version, locale, storage } = options;
+  const disclosure = (0, import_react2.useMemo)(
+    () => (0, import_witness2.createDisclosure)({
+      ...id ? { id } : {},
+      ...kind ? { kind } : {},
+      ...version ? { version } : {},
+      ...locale ? { locale } : {},
+      ...storage ? { storage } : {},
+      onEvent: (event) => onEvent.current?.(event)
+    }),
+    [id, kind, version, locale, storage]
+  );
+  const subscribe = (0, import_react2.useCallback)(
+    (listener) => {
+      const unsubscribe = disclosure.subscribe(listener);
+      const onStorage = (event) => {
+        if (event.key === null || event.key.startsWith("witness:ack:")) listener();
+      };
+      if (typeof window !== "undefined") window.addEventListener("storage", onStorage);
+      return () => {
+        unsubscribe();
+        if (typeof window !== "undefined") window.removeEventListener("storage", onStorage);
+      };
+    },
+    [disclosure]
+  );
+  const acknowledgedAt = (0, import_react2.useSyncExternalStore)(
+    subscribe,
+    () => disclosure.acknowledgedAt(),
+    () => null
+  );
+  return {
+    needsAcknowledgement: acknowledgedAt === null,
+    acknowledgedAt,
+    acknowledge: disclosure.acknowledge,
+    markShown: disclosure.markShown,
+    reset: disclosure.reset,
+    disclosure
+  };
+}
+
+// src/AiNotice.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function AiNotice({
+  kind = "chatbot",
+  id,
+  version,
+  locale,
+  href,
+  storage,
+  onEvent,
+  children,
+  className
+}) {
+  const { locale: code, messages } = useWitnessMessages(locale);
+  const disclosure = useAiDisclosure({
+    kind,
+    locale: code,
+    ...id ? { id } : {},
+    ...version ? { version } : {},
+    ...storage ? { storage } : {},
+    ...onEvent ? { onEvent } : {}
+  });
+  const [reopened, setReopened] = (0, import_react3.useState)(false);
+  const titleId = (0, import_react3.useId)();
+  const text = messages.kinds[kind];
+  const full = reopened || disclosure.needsAcknowledgement;
+  const { markShown } = disclosure;
+  (0, import_react3.useEffect)(() => {
+    if (full) markShown();
+  }, [full, markShown]);
+  if (!full) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+      "button",
+      {
+        type: "button",
+        className: cx("witness-notice--compact", className),
+        "aria-label": `${text.label}: ${messages.ui.details}`,
+        onClick: () => setReopened(true),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "witness-label__icon", "aria-hidden": "true", children: "AI" }),
+          text.label
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { className: cx("witness-notice", className), role: "note", "aria-labelledby": titleId, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "witness-label__icon", "aria-hidden": "true", children: "AI" }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h2", { id: titleId, className: "witness-notice__title", children: text.title }),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "witness-notice__body", children: children ?? text.body }),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "witness-notice__actions", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          "button",
+          {
+            type: "button",
+            className: "witness-notice__ack",
+            onClick: () => {
+              setReopened(false);
+              disclosure.acknowledge();
+            },
+            children: messages.ui.acknowledge
+          }
+        ),
+        href ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("a", { href, children: messages.ui.moreInfo }) : null
+      ] })
+    ] })
+  ] });
+}
+function cx(...names) {
+  return names.filter(Boolean).join(" ");
+}
+
+// src/AiLabel.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function AiLabel({
+  kind = "generated",
+  generator,
+  generatorVersion,
+  createdAt,
+  reviewed,
+  href,
+  locale,
+  variant = "inline",
+  className
+}) {
+  const { locale: code, messages } = useWitnessMessages(locale);
+  const [open, setOpen] = (0, import_react4.useState)(false);
+  const panelId = (0, import_react4.useId)();
+  const root = (0, import_react4.useRef)(null);
+  const button = (0, import_react4.useRef)(null);
+  const text = messages.kinds[kind];
+  const name = [generator, generatorVersion].filter(Boolean).join(" ");
+  (0, import_react4.useEffect)(() => {
+    if (!open) return;
+    const onKey = (event) => {
+      if (event.key === "Escape") {
+        setOpen(false);
+        button.current?.focus();
+      }
+    };
+    const onClick = (event) => {
+      if (root.current && !root.current.contains(event.target)) setOpen(false);
+    };
+    document.addEventListener("keydown", onKey);
+    document.addEventListener("click", onClick);
+    return () => {
+      document.removeEventListener("keydown", onKey);
+      document.removeEventListener("click", onClick);
+    };
+  }, [open]);
+  const facts = [];
+  if (name) facts.push((0, import_witness3.format)(messages.ui.generatedWith, { generator: name }));
+  if (createdAt) facts.push((0, import_witness3.format)(messages.ui.createdOn, { date: formatDate(createdAt, code) }));
+  if (reviewed) facts.push(messages.ui.humanReviewed);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+    "span",
+    {
+      ref: root,
+      className: cx("witness-badge", `witness-badge--${variant}`, className),
+      style: variant === "overlay" ? overlayStyle : inlineStyle,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+          "button",
+          {
+            ref: button,
+            type: "button",
+            className: "witness-label",
+            style: { margin: 0, font: "inherit", cursor: "pointer" },
+            "aria-expanded": open,
+            "aria-controls": panelId,
+            title: messages.ui.details,
+            onClick: () => setOpen((value) => !value),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "witness-label__icon", "aria-hidden": "true", children: "AI" }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "witness-label__text", children: text.label })
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+          "span",
+          {
+            id: panelId,
+            role: "dialog",
+            "aria-label": text.title,
+            className: "witness-badge__panel",
+            hidden: !open,
+            style: variant === "overlay" ? { ...panelStyle, right: 0 } : { ...panelStyle, left: 0 },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("strong", { style: { display: "block", marginBottom: "0.25em" }, children: text.title }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { display: "block" }, children: text.body }),
+              facts.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("ul", { style: { margin: "0.4em 0", paddingInlineStart: "1.1em" }, children: facts.map((fact) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("li", { children: fact }, fact)) }) : null,
+              href ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("a", { href, children: messages.ui.moreInfo }) : null
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+var inlineStyle = { position: "relative", display: "inline-block" };
+var overlayStyle = { position: "absolute", top: "0.5em", right: "0.5em", zIndex: 1 };
+var panelStyle = {
+  position: "absolute",
+  top: "calc(100% + 0.4em)",
+  zIndex: 10,
+  width: "max-content",
+  maxWidth: "min(22em, 80vw)",
+  padding: "0.75em 0.875em",
+  border: "1px solid var(--witness-border, #d7dbe3)",
+  borderRadius: "var(--witness-radius, 8px)",
+  background: "var(--witness-bg, #fff)",
+  color: "var(--witness-fg, #1a1a1a)",
+  boxShadow: "0 6px 24px rgb(0 0 0 / 0.15)",
+  lineHeight: 1.45,
+  fontSize: "0.875rem",
+  textAlign: "start"
+};
+function formatDate(value, locale) {
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) return value;
+  try {
+    return new Intl.DateTimeFormat(locale, { dateStyle: "medium" }).format(date);
+  } catch {
+    return value;
+  }
+}
+
+// src/AiContent.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function AiContent({
+  marking,
+  as: Tag = "div",
+  labelPosition = "top",
+  locale,
+  className,
+  children
+}) {
+  const m = (0, import_react5.useMemo)(() => (0, import_witness4.createMarking)(marking), [marking]);
+  const label = labelPosition === "none" ? null : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    AiLabel,
+    {
+      kind: m.kind,
+      variant: labelPosition === "overlay" ? "overlay" : "inline",
+      createdAt: m.createdAt,
+      reviewed: m.humanReviewed,
+      ...m.generator ? { generator: m.generator } : {},
+      ...m.generatorVersion ? { generatorVersion: m.generatorVersion } : {},
+      ...m.disclosureUrl ? { href: m.disclosureUrl } : {},
+      ...locale ? { locale } : {}
+    }
+  );
+  const labelBlock = label && labelPosition !== "overlay" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { style: { marginBlock: "0.5em" }, children: label }) : label;
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+    Tag,
+    {
+      className: cx("witness-content", className),
+      style: labelPosition === "overlay" ? { position: "relative" } : void 0,
+      ...(0, import_witness4.markingAttributes)(m),
+      children: [
+        labelPosition === "bottom" ? null : labelBlock,
+        children,
+        labelPosition === "bottom" ? labelBlock : null
+      ]
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AiContent,
+  AiLabel,
+  AiNotice,
+  WitnessProvider,
+  useAiDisclosure,
+  useWitnessMessages
+});
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/AiContent.tsx","../src/AiLabel.tsx","../src/AiNotice.tsx","../src/context.tsx","../src/useAiDisclosure.ts"],"sourcesContent":["export { AiContent, type AiContentProps } from \"./AiContent.js\";\nexport { AiLabel, type AiLabelProps } from \"./AiLabel.js\";\nexport { AiNotice, type AiNoticeProps } from \"./AiNotice.js\";\nexport { useWitnessMessages, WitnessProvider, type WitnessProviderProps } from \"./context.js\";\nexport { type UseAiDisclosureResult, useAiDisclosure } from \"./useAiDisclosure.js\";\n","import {\n  createMarking,\n  type Marking,\n  type MarkingInput,\n  markingAttributes,\n} from \"@sweberdev/witness\";\nimport { type ElementType, type ReactNode, useMemo } from \"react\";\nimport { AiLabel } from \"./AiLabel.js\";\nimport { cx } from \"./AiNotice.js\";\n\nexport interface AiContentProps {\n  marking: Marking | MarkingInput;\n  /** Element that wraps label and content. Default `div`. */\n  as?: ElementType;\n  /** Text should be labelled at the top (default). Use `overlay` for images and video. */\n  labelPosition?: \"top\" | \"bottom\" | \"overlay\" | \"none\";\n  locale?: string | readonly string[];\n  className?: string;\n  children: ReactNode;\n}\n\n/**\n * Wraps AI-generated content: adds the `data-ai-*` marking attributes and a visible label.\n * With `labelPosition=\"overlay\"` the wrapper becomes `position: relative`.\n */\nexport function AiContent({\n  marking,\n  as: Tag = \"div\",\n  labelPosition = \"top\",\n  locale,\n  className,\n  children,\n}: AiContentProps) {\n  const m = useMemo(() => createMarking(marking), [marking]);\n  const label =\n    labelPosition === \"none\" ? null : (\n      <AiLabel\n        kind={m.kind}\n        variant={labelPosition === \"overlay\" ? \"overlay\" : \"inline\"}\n        createdAt={m.createdAt}\n        reviewed={m.humanReviewed}\n        {...(m.generator ? { generator: m.generator } : {})}\n        {...(m.generatorVersion ? { generatorVersion: m.generatorVersion } : {})}\n        {...(m.disclosureUrl ? { href: m.disclosureUrl } : {})}\n        {...(locale ? { locale } : {})}\n      />\n    );\n  const labelBlock =\n    label && labelPosition !== \"overlay\" ? (\n      <div style={{ marginBlock: \"0.5em\" }}>{label}</div>\n    ) : (\n      label\n    );\n  return (\n    <Tag\n      className={cx(\"witness-content\", className)}\n      style={labelPosition === \"overlay\" ? { position: \"relative\" } : undefined}\n      {...markingAttributes(m)}\n    >\n      {labelPosition === \"bottom\" ? null : labelBlock}\n      {children}\n      {labelPosition === \"bottom\" ? labelBlock : null}\n    </Tag>\n  );\n}\n","import { type ContentKind, type DisclosureKind, format } from \"@sweberdev/witness\";\nimport { useEffect, useId, useRef, useState } from \"react\";\nimport { cx } from \"./AiNotice.js\";\nimport { useWitnessMessages } from \"./context.js\";\n\nexport interface AiLabelProps {\n  /** Default `generated`. */\n  kind?: ContentKind | DisclosureKind;\n  generator?: string;\n  generatorVersion?: string;\n  /** ISO date or timestamp. */\n  createdAt?: string;\n  /** A person reviewed the content and holds editorial responsibility. */\n  reviewed?: boolean;\n  /** Link to a page that explains how you use AI. */\n  href?: string;\n  locale?: string | readonly string[];\n  /** `overlay` places the label in the top corner of a positioned parent, e.g. over an image. */\n  variant?: \"inline\" | \"overlay\";\n  className?: string;\n}\n\n/** A badge for AI-generated or AI-edited content. Clicking it shows what the label means. */\nexport function AiLabel({\n  kind = \"generated\",\n  generator,\n  generatorVersion,\n  createdAt,\n  reviewed,\n  href,\n  locale,\n  variant = \"inline\",\n  className,\n}: AiLabelProps) {\n  const { locale: code, messages } = useWitnessMessages(locale);\n  const [open, setOpen] = useState(false);\n  const panelId = useId();\n  const root = useRef<HTMLSpanElement>(null);\n  const button = useRef<HTMLButtonElement>(null);\n  const text = messages.kinds[kind];\n  const name = [generator, generatorVersion].filter(Boolean).join(\" \");\n\n  useEffect(() => {\n    if (!open) return;\n    const onKey = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        setOpen(false);\n        button.current?.focus();\n      }\n    };\n    const onClick = (event: MouseEvent) => {\n      if (root.current && !root.current.contains(event.target as Node)) setOpen(false);\n    };\n    document.addEventListener(\"keydown\", onKey);\n    document.addEventListener(\"click\", onClick);\n    return () => {\n      document.removeEventListener(\"keydown\", onKey);\n      document.removeEventListener(\"click\", onClick);\n    };\n  }, [open]);\n\n  const facts: string[] = [];\n  if (name) facts.push(format(messages.ui.generatedWith, { generator: name }));\n  if (createdAt) facts.push(format(messages.ui.createdOn, { date: formatDate(createdAt, code) }));\n  if (reviewed) facts.push(messages.ui.humanReviewed);\n\n  return (\n    <span\n      ref={root}\n      className={cx(\"witness-badge\", `witness-badge--${variant}`, className)}\n      style={variant === \"overlay\" ? overlayStyle : inlineStyle}\n    >\n      <button\n        ref={button}\n        type=\"button\"\n        className=\"witness-label\"\n        style={{ margin: 0, font: \"inherit\", cursor: \"pointer\" }}\n        aria-expanded={open}\n        aria-controls={panelId}\n        title={messages.ui.details}\n        onClick={() => setOpen((value) => !value)}\n      >\n        <span className=\"witness-label__icon\" aria-hidden=\"true\">\n          AI\n        </span>\n        <span className=\"witness-label__text\">{text.label}</span>\n      </button>\n      <span\n        id={panelId}\n        role=\"dialog\"\n        aria-label={text.title}\n        className=\"witness-badge__panel\"\n        hidden={!open}\n        style={variant === \"overlay\" ? { ...panelStyle, right: 0 } : { ...panelStyle, left: 0 }}\n      >\n        <strong style={{ display: \"block\", marginBottom: \"0.25em\" }}>{text.title}</strong>\n        <span style={{ display: \"block\" }}>{text.body}</span>\n        {facts.length > 0 ? (\n          <ul style={{ margin: \"0.4em 0\", paddingInlineStart: \"1.1em\" }}>\n            {facts.map((fact) => (\n              <li key={fact}>{fact}</li>\n            ))}\n          </ul>\n        ) : null}\n        {href ? <a href={href}>{messages.ui.moreInfo}</a> : null}\n      </span>\n    </span>\n  );\n}\n\nconst inlineStyle = { position: \"relative\", display: \"inline-block\" } as const;\nconst overlayStyle = { position: \"absolute\", top: \"0.5em\", right: \"0.5em\", zIndex: 1 } as const;\nconst panelStyle = {\n  position: \"absolute\",\n  top: \"calc(100% + 0.4em)\",\n  zIndex: 10,\n  width: \"max-content\",\n  maxWidth: \"min(22em, 80vw)\",\n  padding: \"0.75em 0.875em\",\n  border: \"1px solid var(--witness-border, #d7dbe3)\",\n  borderRadius: \"var(--witness-radius, 8px)\",\n  background: \"var(--witness-bg, #fff)\",\n  color: \"var(--witness-fg, #1a1a1a)\",\n  boxShadow: \"0 6px 24px rgb(0 0 0 / 0.15)\",\n  lineHeight: 1.45,\n  fontSize: \"0.875rem\",\n  textAlign: \"start\",\n} as const;\n\nfunction formatDate(value: string, locale: string): string {\n  const date = new Date(value);\n  if (Number.isNaN(date.getTime())) return value;\n  try {\n    return new Intl.DateTimeFormat(locale, { dateStyle: \"medium\" }).format(date);\n  } catch {\n    return value;\n  }\n}\n","import type { DisclosureEvent, DisclosureKind } from \"@sweberdev/witness\";\nimport { type ReactNode, useEffect, useId, useState } from \"react\";\nimport { useWitnessMessages } from \"./context.js\";\nimport { useAiDisclosure } from \"./useAiDisclosure.js\";\n\nexport interface AiNoticeProps {\n  /** Default `chatbot`. Also fits `emotion-recognition` and `biometric-categorisation`. */\n  kind?: DisclosureKind;\n  /** Your id for this disclosure. Default: the kind. */\n  id?: string;\n  /** Bump when the wording changes, so people see it again. Default \"1\". */\n  version?: string;\n  locale?: string | readonly string[];\n  /** Link to a page that explains how you use AI. */\n  href?: string;\n  storage?: \"local\" | \"session\" | \"memory\";\n  /** Evidence hook: called when the notice is shown and acknowledged. */\n  onEvent?: (event: DisclosureEvent) => void;\n  /** Replaces the default body text. */\n  children?: ReactNode;\n  className?: string;\n}\n\n/**\n * The AI notice for a chat (Art. 50(1)): expanded until acknowledged, then a compact label\n * that stays visible and can be reopened. Style it with `@sweberdev/witness/styles.css`.\n */\nexport function AiNotice({\n  kind = \"chatbot\",\n  id,\n  version,\n  locale,\n  href,\n  storage,\n  onEvent,\n  children,\n  className,\n}: AiNoticeProps) {\n  const { locale: code, messages } = useWitnessMessages(locale);\n  const disclosure = useAiDisclosure({\n    kind,\n    locale: code,\n    ...(id ? { id } : {}),\n    ...(version ? { version } : {}),\n    ...(storage ? { storage } : {}),\n    ...(onEvent ? { onEvent } : {}),\n  });\n  const [reopened, setReopened] = useState(false);\n  const titleId = useId();\n  const text = messages.kinds[kind];\n  const full = reopened || disclosure.needsAcknowledgement;\n  const { markShown } = disclosure;\n\n  useEffect(() => {\n    if (full) markShown();\n  }, [full, markShown]);\n\n  if (!full) {\n    return (\n      <button\n        type=\"button\"\n        className={cx(\"witness-notice--compact\", className)}\n        aria-label={`${text.label}: ${messages.ui.details}`}\n        onClick={() => setReopened(true)}\n      >\n        <span className=\"witness-label__icon\" aria-hidden=\"true\">\n          AI\n        </span>\n        {text.label}\n      </button>\n    );\n  }\n\n  return (\n    <section className={cx(\"witness-notice\", className)} role=\"note\" aria-labelledby={titleId}>\n      <span className=\"witness-label__icon\" aria-hidden=\"true\">\n        AI\n      </span>\n      <div>\n        <h2 id={titleId} className=\"witness-notice__title\">\n          {text.title}\n        </h2>\n        <p className=\"witness-notice__body\">{children ?? text.body}</p>\n        <div className=\"witness-notice__actions\">\n          <button\n            type=\"button\"\n            className=\"witness-notice__ack\"\n            onClick={() => {\n              setReopened(false);\n              disclosure.acknowledge();\n            }}\n          >\n            {messages.ui.acknowledge}\n          </button>\n          {href ? <a href={href}>{messages.ui.moreInfo}</a> : null}\n        </div>\n      </div>\n    </section>\n  );\n}\n\nexport function cx(...names: Array<string | undefined | false>): string {\n  return names.filter(Boolean).join(\" \");\n}\n","import {\n  getMessages,\n  type LocaleMessages,\n  type LocaleOverride,\n  resolveLocale,\n} from \"@sweberdev/witness\";\nimport { createContext, type ReactNode, useContext, useMemo } from \"react\";\n\ninterface WitnessContextValue {\n  locale: string;\n  messages: LocaleMessages;\n}\n\nconst WitnessContext = createContext<WitnessContextValue | null>(null);\n\nexport interface WitnessProviderProps {\n  /** A locale tag such as \"de-CH\", or a list such as `navigator.languages`. Default \"en\". */\n  locale?: string | readonly string[];\n  /** Overrides for the wording, e.g. the informal \"du\" in German. */\n  messages?: LocaleOverride;\n  children: ReactNode;\n}\n\n/** Sets the language and wording for all Witness components below it. */\nexport function WitnessProvider({ locale, messages, children }: WitnessProviderProps) {\n  const value = useMemo(\n    () => ({ locale: resolveLocale(locale), messages: getMessages(locale, messages) }),\n    [locale, messages],\n  );\n  return <WitnessContext.Provider value={value}>{children}</WitnessContext.Provider>;\n}\n\n/** The active locale and messages. A `locale` prop on a component wins over the provider. */\nexport function useWitnessMessages(locale?: string | readonly string[]): WitnessContextValue {\n  const context = useContext(WitnessContext);\n  return useMemo(() => {\n    if (locale) return { locale: resolveLocale(locale), messages: getMessages(locale) };\n    return context ?? { locale: \"en\", messages: getMessages(\"en\") };\n  }, [context, locale]);\n}\n","import { createDisclosure, type Disclosure, type DisclosureOptions } from \"@sweberdev/witness\";\nimport { useCallback, useMemo, useRef, useSyncExternalStore } from \"react\";\n\nexport interface UseAiDisclosureResult {\n  /** True until the current version was acknowledged. Always true during server rendering. */\n  needsAcknowledgement: boolean;\n  acknowledgedAt: string | null;\n  acknowledge: () => void;\n  /** Records that the notice was rendered (emits a `shown` event once). */\n  markShown: () => void;\n  reset: () => void;\n  disclosure: Disclosure;\n}\n\n/**\n * State for a custom AI disclosure UI. The server snapshot always needs acknowledgement, so\n * the full notice is in the server HTML and collapses after hydration for people who already\n * acknowledged it.\n */\nexport function useAiDisclosure(options: DisclosureOptions = {}): UseAiDisclosureResult {\n  const onEvent = useRef(options.onEvent);\n  onEvent.current = options.onEvent;\n  const { id, kind, version, locale, storage } = options;\n\n  const disclosure = useMemo(\n    () =>\n      createDisclosure({\n        ...(id ? { id } : {}),\n        ...(kind ? { kind } : {}),\n        ...(version ? { version } : {}),\n        ...(locale ? { locale } : {}),\n        ...(storage ? { storage } : {}),\n        onEvent: (event) => onEvent.current?.(event),\n      }),\n    [id, kind, version, locale, storage],\n  );\n\n  const subscribe = useCallback(\n    (listener: () => void) => {\n      const unsubscribe = disclosure.subscribe(listener);\n      // Another tab acknowledged or reset: the browser tells us through a storage event.\n      const onStorage = (event: StorageEvent) => {\n        if (event.key === null || event.key.startsWith(\"witness:ack:\")) listener();\n      };\n      if (typeof window !== \"undefined\") window.addEventListener(\"storage\", onStorage);\n      return () => {\n        unsubscribe();\n        if (typeof window !== \"undefined\") window.removeEventListener(\"storage\", onStorage);\n      };\n    },\n    [disclosure],\n  );\n  const acknowledgedAt = useSyncExternalStore(\n    subscribe,\n    () => disclosure.acknowledgedAt(),\n    () => null,\n  );\n\n  return {\n    needsAcknowledgement: acknowledgedAt === null,\n    acknowledgedAt,\n    acknowledge: disclosure.acknowledge,\n    markShown: disclosure.markShown,\n    reset: disclosure.reset,\n    disclosure,\n  };\n}\n"],"mappings":"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","names":["import_witness","import_react","import_witness","import_react","import_react","import_witness","import_react","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime"]}

package/dist/index.d.cts

@@ -0,0 +1,96 @@
+import * as react from 'react';
+import { ElementType, ReactNode } from 'react';
+import { Marking, MarkingInput, ContentKind, DisclosureKind, DisclosureEvent, LocaleOverride, LocaleMessages, Disclosure, DisclosureOptions } from '@sweberdev/witness';
+
+interface AiContentProps {
+    marking: Marking | MarkingInput;
+    /** Element that wraps label and content. Default `div`. */
+    as?: ElementType;
+    /** Text should be labelled at the top (default). Use `overlay` for images and video. */
+    labelPosition?: "top" | "bottom" | "overlay" | "none";
+    locale?: string | readonly string[];
+    className?: string;
+    children: ReactNode;
+}
+/**
+ * Wraps AI-generated content: adds the `data-ai-*` marking attributes and a visible label.
+ * With `labelPosition="overlay"` the wrapper becomes `position: relative`.
+ */
+declare function AiContent({ marking, as: Tag, labelPosition, locale, className, children, }: AiContentProps): react.JSX.Element;
+
+interface AiLabelProps {
+    /** Default `generated`. */
+    kind?: ContentKind | DisclosureKind;
+    generator?: string;
+    generatorVersion?: string;
+    /** ISO date or timestamp. */
+    createdAt?: string;
+    /** A person reviewed the content and holds editorial responsibility. */
+    reviewed?: boolean;
+    /** Link to a page that explains how you use AI. */
+    href?: string;
+    locale?: string | readonly string[];
+    /** `overlay` places the label in the top corner of a positioned parent, e.g. over an image. */
+    variant?: "inline" | "overlay";
+    className?: string;
+}
+/** A badge for AI-generated or AI-edited content. Clicking it shows what the label means. */
+declare function AiLabel({ kind, generator, generatorVersion, createdAt, reviewed, href, locale, variant, className, }: AiLabelProps): react.JSX.Element;
+
+interface AiNoticeProps {
+    /** Default `chatbot`. Also fits `emotion-recognition` and `biometric-categorisation`. */
+    kind?: DisclosureKind;
+    /** Your id for this disclosure. Default: the kind. */
+    id?: string;
+    /** Bump when the wording changes, so people see it again. Default "1". */
+    version?: string;
+    locale?: string | readonly string[];
+    /** Link to a page that explains how you use AI. */
+    href?: string;
+    storage?: "local" | "session" | "memory";
+    /** Evidence hook: called when the notice is shown and acknowledged. */
+    onEvent?: (event: DisclosureEvent) => void;
+    /** Replaces the default body text. */
+    children?: ReactNode;
+    className?: string;
+}
+/**
+ * The AI notice for a chat (Art. 50(1)): expanded until acknowledged, then a compact label
+ * that stays visible and can be reopened. Style it with `@sweberdev/witness/styles.css`.
+ */
+declare function AiNotice({ kind, id, version, locale, href, storage, onEvent, children, className, }: AiNoticeProps): react.JSX.Element;
+
+interface WitnessContextValue {
+    locale: string;
+    messages: LocaleMessages;
+}
+interface WitnessProviderProps {
+    /** A locale tag such as "de-CH", or a list such as `navigator.languages`. Default "en". */
+    locale?: string | readonly string[];
+    /** Overrides for the wording, e.g. the informal "du" in German. */
+    messages?: LocaleOverride;
+    children: ReactNode;
+}
+/** Sets the language and wording for all Witness components below it. */
+declare function WitnessProvider({ locale, messages, children }: WitnessProviderProps): react.JSX.Element;
+/** The active locale and messages. A `locale` prop on a component wins over the provider. */
+declare function useWitnessMessages(locale?: string | readonly string[]): WitnessContextValue;
+
+interface UseAiDisclosureResult {
+    /** True until the current version was acknowledged. Always true during server rendering. */
+    needsAcknowledgement: boolean;
+    acknowledgedAt: string | null;
+    acknowledge: () => void;
+    /** Records that the notice was rendered (emits a `shown` event once). */
+    markShown: () => void;
+    reset: () => void;
+    disclosure: Disclosure;
+}
+/**
+ * State for a custom AI disclosure UI. The server snapshot always needs acknowledgement, so
+ * the full notice is in the server HTML and collapses after hydration for people who already
+ * acknowledged it.
+ */
+declare function useAiDisclosure(options?: DisclosureOptions): UseAiDisclosureResult;
+
+export { AiContent, type AiContentProps, AiLabel, type AiLabelProps, AiNotice, type AiNoticeProps, type UseAiDisclosureResult, WitnessProvider, type WitnessProviderProps, useAiDisclosure, useWitnessMessages };

package/dist/index.d.ts

@@ -0,0 +1,96 @@
+import * as react from 'react';
+import { ElementType, ReactNode } from 'react';
+import { Marking, MarkingInput, ContentKind, DisclosureKind, DisclosureEvent, LocaleOverride, LocaleMessages, Disclosure, DisclosureOptions } from '@sweberdev/witness';
+
+interface AiContentProps {
+    marking: Marking | MarkingInput;
+    /** Element that wraps label and content. Default `div`. */
+    as?: ElementType;
+    /** Text should be labelled at the top (default). Use `overlay` for images and video. */
+    labelPosition?: "top" | "bottom" | "overlay" | "none";
+    locale?: string | readonly string[];
+    className?: string;
+    children: ReactNode;
+}
+/**
+ * Wraps AI-generated content: adds the `data-ai-*` marking attributes and a visible label.
+ * With `labelPosition="overlay"` the wrapper becomes `position: relative`.
+ */
+declare function AiContent({ marking, as: Tag, labelPosition, locale, className, children, }: AiContentProps): react.JSX.Element;
+
+interface AiLabelProps {
+    /** Default `generated`. */
+    kind?: ContentKind | DisclosureKind;
+    generator?: string;
+    generatorVersion?: string;
+    /** ISO date or timestamp. */
+    createdAt?: string;
+    /** A person reviewed the content and holds editorial responsibility. */
+    reviewed?: boolean;
+    /** Link to a page that explains how you use AI. */
+    href?: string;
+    locale?: string | readonly string[];
+    /** `overlay` places the label in the top corner of a positioned parent, e.g. over an image. */
+    variant?: "inline" | "overlay";
+    className?: string;
+}
+/** A badge for AI-generated or AI-edited content. Clicking it shows what the label means. */
+declare function AiLabel({ kind, generator, generatorVersion, createdAt, reviewed, href, locale, variant, className, }: AiLabelProps): react.JSX.Element;
+
+interface AiNoticeProps {
+    /** Default `chatbot`. Also fits `emotion-recognition` and `biometric-categorisation`. */
+    kind?: DisclosureKind;
+    /** Your id for this disclosure. Default: the kind. */
+    id?: string;
+    /** Bump when the wording changes, so people see it again. Default "1". */
+    version?: string;
+    locale?: string | readonly string[];
+    /** Link to a page that explains how you use AI. */
+    href?: string;
+    storage?: "local" | "session" | "memory";
+    /** Evidence hook: called when the notice is shown and acknowledged. */
+    onEvent?: (event: DisclosureEvent) => void;
+    /** Replaces the default body text. */
+    children?: ReactNode;
+    className?: string;
+}
+/**
+ * The AI notice for a chat (Art. 50(1)): expanded until acknowledged, then a compact label
+ * that stays visible and can be reopened. Style it with `@sweberdev/witness/styles.css`.
+ */
+declare function AiNotice({ kind, id, version, locale, href, storage, onEvent, children, className, }: AiNoticeProps): react.JSX.Element;
+
+interface WitnessContextValue {
+    locale: string;
+    messages: LocaleMessages;
+}
+interface WitnessProviderProps {
+    /** A locale tag such as "de-CH", or a list such as `navigator.languages`. Default "en". */
+    locale?: string | readonly string[];
+    /** Overrides for the wording, e.g. the informal "du" in German. */
+    messages?: LocaleOverride;
+    children: ReactNode;
+}
+/** Sets the language and wording for all Witness components below it. */
+declare function WitnessProvider({ locale, messages, children }: WitnessProviderProps): react.JSX.Element;
+/** The active locale and messages. A `locale` prop on a component wins over the provider. */
+declare function useWitnessMessages(locale?: string | readonly string[]): WitnessContextValue;
+
+interface UseAiDisclosureResult {
+    /** True until the current version was acknowledged. Always true during server rendering. */
+    needsAcknowledgement: boolean;
+    acknowledgedAt: string | null;
+    acknowledge: () => void;
+    /** Records that the notice was rendered (emits a `shown` event once). */
+    markShown: () => void;
+    reset: () => void;
+    disclosure: Disclosure;
+}
+/**
+ * State for a custom AI disclosure UI. The server snapshot always needs acknowledgement, so
+ * the full notice is in the server HTML and collapses after hydration for people who already
+ * acknowledged it.
+ */
+declare function useAiDisclosure(options?: DisclosureOptions): UseAiDisclosureResult;
+
+export { AiContent, type AiContentProps, AiLabel, type AiLabelProps, AiNotice, type AiNoticeProps, type UseAiDisclosureResult, WitnessProvider, type WitnessProviderProps, useAiDisclosure, useWitnessMessages };