@wildo-ai/presets-components 1.1.4 → 1.1.6

package/dist/esm/components/data-display/formatters/display-field-phone.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-phone.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-phone.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM1I,eAAO,MAAM,+BAA+B,EAAE,mBAAmB,EAMhE,CAAC"}
+{"version":3,"file":"display-field-phone.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-phone.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM1I,eAAO,MAAM,+BAA+B,EAAE,mBAAmB,EAMhE,CAAC"}

package/dist/esm/components/data-display/formatters/display-field-range-bigdecimal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-bigdecimal.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-bigdecimal.tsx"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAY9B,OAAO,KAAK,EAAE,gCAAgC,EAAE,MAAM,6BAA6B,CAAA;AAuEnF;;;;GAIG;AACH,iBAAS,2BAA2B,CAAC,EACnC,MAAM,EACN,KAAK,EACL,SAAS,EACT,MAAM,EACN,SAAe,GAChB,EAAE,gCAAgC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CA2E7D;AAID,OAAO,EAAE,2BAA2B,EAAE,CAAA"}
+{"version":3,"file":"display-field-range-bigdecimal.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-bigdecimal.tsx"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAY9B,OAAO,KAAK,EAAE,gCAAgC,EAAE,MAAM,6BAA6B,CAAA;AAuEnF;;;;GAIG;AACH,iBAAS,2BAA2B,CAAC,EACnC,MAAM,EACN,KAAK,EACL,SAAS,EACT,MAAM,EACN,SAAe,GAChB,EAAE,gCAAgC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CA2E7D;AAID,OAAO,EAAE,2BAA2B,EAAE,CAAA"}

package/dist/esm/components/data-display/formatters/display-field-range-bigdecimal.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-bigdecimal.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-bigdecimal.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM1I,eAAO,MAAM,yCAAyC,EAAE,mBAAmB,EAM1E,CAAC"}
+{"version":3,"file":"display-field-range-bigdecimal.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-bigdecimal.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM1I,eAAO,MAAM,yCAAyC,EAAE,mBAAmB,EAM1E,CAAC"}

package/dist/esm/components/data-display/formatters/display-field-range-date.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-date.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-date.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAA;AAI7E,iBAAS,qBAAqB,CAAC,EAC7B,KAAK,EACL,SAAS,EACT,SAAe,GAChB,EAAE,0BAA0B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CA8BvD;AAID,OAAO,EAAE,qBAAqB,EAAE,CAAA"}
+{"version":3,"file":"display-field-range-date.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-date.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAA;AAI7E,iBAAS,qBAAqB,CAAC,EAC7B,KAAK,EACL,SAAS,EACT,SAAe,GAChB,EAAE,0BAA0B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CA8BvD;AAID,OAAO,EAAE,qBAAqB,EAAE,CAAA"}

package/dist/esm/components/data-display/formatters/display-field-range-date.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-date.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-date.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,mCAAmC,EAAE,mBAAmB,EAAO,CAAC"}
+{"version":3,"file":"display-field-range-date.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-date.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,mCAAmC,EAAE,mBAAmB,EAAO,CAAC"}

package/dist/esm/components/data-display/formatters/display-field-range-datetime.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-datetime.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-datetime.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,8BAA8B,EAAE,MAAM,6BAA6B,CAAA;AAIjF,iBAAS,yBAAyB,CAAC,EACjC,KAAK,EACL,SAAS,EACT,SAAe,GAChB,EAAE,8BAA8B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CA8B3D;AAID,OAAO,EAAE,yBAAyB,EAAE,CAAA"}
+{"version":3,"file":"display-field-range-datetime.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-datetime.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,8BAA8B,EAAE,MAAM,6BAA6B,CAAA;AAIjF,iBAAS,yBAAyB,CAAC,EACjC,KAAK,EACL,SAAS,EACT,SAAe,GAChB,EAAE,8BAA8B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CA8B3D;AAID,OAAO,EAAE,yBAAyB,EAAE,CAAA"}

package/dist/esm/components/data-display/formatters/display-field-range-datetime.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-datetime.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-datetime.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,uCAAuC,EAAE,mBAAmB,EAAO,CAAC"}
+{"version":3,"file":"display-field-range-datetime.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-datetime.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,uCAAuC,EAAE,mBAAmB,EAAO,CAAC"}

package/dist/esm/components/data-display/formatters/display-field-range-money.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-money.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-money.tsx"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAU9B,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,6BAA6B,CAAA;AAwC9E;;;;GAIG;AACH,iBAAS,sBAAsB,CAAC,EAC9B,MAAM,EACN,KAAK,EACL,SAAS,EACT,UAAiB,EACjB,cAAyB,EACzB,gBAAwB,EACxB,SAAe,GAChB,EAAE,2BAA2B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CA+DxD;AAID,OAAO,EAAE,sBAAsB,EAAE,CAAA"}
+{"version":3,"file":"display-field-range-money.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-money.tsx"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAU9B,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,6BAA6B,CAAA;AAwC9E;;;;GAIG;AACH,iBAAS,sBAAsB,CAAC,EAC9B,MAAM,EACN,KAAK,EACL,SAAS,EACT,UAAiB,EACjB,cAAyB,EACzB,gBAAwB,EACxB,SAAe,GAChB,EAAE,2BAA2B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CA+DxD;AAID,OAAO,EAAE,sBAAsB,EAAE,CAAA"}

package/dist/esm/components/data-display/formatters/display-field-range-money.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-money.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-money.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM1I,eAAO,MAAM,oCAAoC,EAAE,mBAAmB,EAMrE,CAAC"}
+{"version":3,"file":"display-field-range-money.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-money.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM1I,eAAO,MAAM,oCAAoC,EAAE,mBAAmB,EAMrE,CAAC"}

package/dist/esm/components/data-display/formatters/display-field-range-number.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-number.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-number.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,6BAA6B,CAAA;AAK/E,iBAAS,uBAAuB,CAAC,EAC/B,KAAK,EACL,SAAS,EACT,SAAe,GAChB,EAAE,4BAA4B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAwCzD;AAID,OAAO,EAAE,uBAAuB,EAAE,CAAA"}
+{"version":3,"file":"display-field-range-number.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-number.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,6BAA6B,CAAA;AAK/E,iBAAS,uBAAuB,CAAC,EAC/B,KAAK,EACL,SAAS,EACT,SAAe,GAChB,EAAE,4BAA4B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAwCzD;AAID,OAAO,EAAE,uBAAuB,EAAE,CAAA"}

package/dist/esm/components/data-display/formatters/display-field-range-number.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-number.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-number.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM1I,eAAO,MAAM,qCAAqC,EAAE,mBAAmB,EAMtE,CAAC"}
+{"version":3,"file":"display-field-range-number.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-number.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM1I,eAAO,MAAM,qCAAqC,EAAE,mBAAmB,EAMtE,CAAC"}

package/dist/esm/components/data-display/formatters/display-field-range-time.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-time.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-time.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAA;AAI7E,iBAAS,qBAAqB,CAAC,EAC7B,KAAK,EACL,SAAS,EACT,SAAe,GAChB,EAAE,0BAA0B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAgCvD;AAID,OAAO,EAAE,qBAAqB,EAAE,CAAA"}
+{"version":3,"file":"display-field-range-time.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-time.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAA;AAI7E,iBAAS,qBAAqB,CAAC,EAC7B,KAAK,EACL,SAAS,EACT,SAAe,GAChB,EAAE,0BAA0B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAgCvD;AAID,OAAO,EAAE,qBAAqB,EAAE,CAAA"}

package/dist/esm/components/data-display/formatters/display-field-range-time.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-range-time.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-range-time.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,mCAAmC,EAAE,mBAAmB,EAAO,CAAC"}
+{"version":3,"file":"display-field-range-time.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-range-time.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,mCAAmC,EAAE,mBAAmB,EAAO,CAAC"}

package/dist/esm/components/data-display/formatters/display-field-string.d.ts

@@ -2,7 +2,7 @@
  * DisplayFieldString Component
  *
  * Displays a string value based on the string UI decorator.
- * Supports different display modes: text, truncate, multiline, markdown, color, link, email, badge, copy, secret
+ * Supports different display modes: text, truncate, multiline, markdown, untrusted_html, color, link, email, badge, copy, secret
  */
 import * as React from "react";
 import type { DisplayFieldStringProps } from '@wildo-ai/saas-frontend-lib';

package/dist/esm/components/data-display/formatters/display-field-string.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-string.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-string.tsx"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAA;AAI1E;;;;GAIG;AACH,iBAAS,kBAAkB,CAAC,EAC1B,MAAM,EACN,KAAK,EACL,SAAS,GACV,EAAE,uBAAuB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAoKpD;AAID,OAAO,EAAE,kBAAkB,EAAE,CAAA"}
+{"version":3,"file":"display-field-string.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-string.tsx"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAA;AA+B1E;;;;GAIG;AACH,iBAAS,kBAAkB,CAAC,EAC1B,MAAM,EACN,KAAK,EACL,SAAS,GACV,EAAE,uBAAuB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAuQpD;AAID,OAAO,EAAE,kBAAkB,EAAE,CAAA"}

package/dist/esm/components/data-display/formatters/display-field-string.js

@@ -4,28 +4,75 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
  * DisplayFieldString Component
  *
  * Displays a string value based on the string UI decorator.
- * Supports different display modes: text, truncate, multiline, markdown, color, link, email, badge, copy, secret
+ * Supports different display modes: text, truncate, multiline, markdown, untrusted_html, color, link, email, badge, copy, secret
  */
 import * as React from "react";
-import { useI18n, useIconRegistry, StandardIconReference, IconSize, Text, Badge } from "@wildo-ai/saas-frontend-lib";
-import { FrontendComponentType } from "@wildo-ai/presets-components-models";
-import { getStringUI, getStringFormat, StringDisplayMode } from "@wildo-ai/zod-decorators";
+import { useI18n, useIconRegistry, StandardIconReference, IconSize, Text, Badge, Identifier, useContextualDisplayParams } from "@wildo-ai/saas-frontend-lib";
+import { FrontendComponentType, LabellingTypes, resolveVocabularyWordKey } from "@wildo-ai/presets-components-models";
+import { getStringUI, getStringFormat, getSystemEnumName, StringDisplayMode } from "@wildo-ai/zod-decorators";
 import { MarkdownContent } from "../markdown-content.js";
+import { UntrustedHtmlContent } from "../untrusted-html-content.js";
+/**
+ * Split a string into user-perceived characters.
+ *
+ * `Intl.Segmenter` is the only thing that gets this right — code units split surrogate pairs, and
+ * code points still split a flag, a ZWJ sequence, a skin-tone modifier and a combining accent. The
+ * fallback to code points is for a runtime without it; it is strictly better than code units and
+ * cannot produce a lone surrogate, which is the failure that actually shows on screen.
+ */
+const GRAPHEME_SEGMENTER = typeof Intl !== 'undefined' && typeof Intl.Segmenter === 'function'
+    ? new Intl.Segmenter(undefined, { granularity: 'grapheme' })
+    : null;
+function splitIntoGraphemes(value) {
+    if (!GRAPHEME_SEGMENTER)
+        return Array.from(value);
+    return Array.from(GRAPHEME_SEGMENTER.segment(value), part => part.segment);
+}
+/**
+ * The label namespaces a string display reads beyond its own component: the `roles` words an ORGANIZATION_ROLE value
+ * shows (#1921) — requested only by a field that can show one, so no other string display waits on the roles bundle.
+ * Module-level so each requested set keeps one identity across renders.
+ */
+const ROLE_LABEL_NAMESPACES = [LabellingTypes.ROLES];
+const NO_EXTRA_LABEL_NAMESPACES = [];
 /**
  * DisplayFieldString component
  *
  * Renders a string value according to the string UI decorator
  */
 function DisplayFieldString({ schema, value, className, }) {
-    const { tComponent, isReady } = useI18n({ component: FrontendComponentType.LOW_LEVEL_FORM_FIELD });
+    const stringUI = getStringUI(schema);
+    const showsRole = stringUI?.display?.displayMode === StringDisplayMode.ORGANIZATION_ROLE
+        || stringUI?.summaryOverride?.displayMode === StringDisplayMode.ORGANIZATION_ROLE;
+    const { tComponent, tRole, t, isReady } = useI18n({
+        component: [FrontendComponentType.LOW_LEVEL_FORM_FIELD, FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING],
+        keys: showsRole ? ROLE_LABEL_NAMESPACES : NO_EXTRA_LABEL_NAMESPACES,
+    });
     const { renderIcon } = useIconRegistry();
     const [copied, setCopied] = React.useState(false);
-    const stringUI = getStringUI(schema);
     const stringFormat = getStringFormat(schema);
+    /*
+     * An OPEN vocabulary (#1791): the string's values are words of a vocabulary declared outside the schema — today the
+     * engine's audit event types — named with `.systemEnum(name)`. Read as a word where the vocabulary keeps it
+     * (`resolveVocabularyWordKey`: `system_enums.<name>.<value>`, or a feature's and a limit's own billing section) in
+     * every mode that shows the value as prose (text, truncate, multiline, badge, the default); a missing word shows
+     * the value, which is the missing label looking missing. Modes that show the value AS DATA keep it raw on purpose:
+     * copy, identifier, link, email, secret, markdown, untrusted HTML, colour. Every one of those sections is eager
+     * (`EAGER_I18N_SECTIONS`), so this needs no extra request.
+     */
+    const openVocabulary = schema ? getSystemEnumName(schema) : undefined;
+    const asWord = (raw) => {
+        if (!openVocabulary)
+            return raw;
+        const key = resolveVocabularyWordKey(openVocabulary, raw);
+        const word = t(key);
+        return word === key ? raw : word;
+    };
     // SECRET fields mask by default; `initiallyRevealed` (set by `.isEphemeral()`)
     // shows the value on first paint for one-time reveals. The eye toggle still works.
-    const [revealed, setRevealed] = React.useState(stringUI?.display?.initiallyRevealed ?? false);
-    let displayMode = stringUI?.display?.displayMode ?? StringDisplayMode.TEXT;
+    const stringDisplayParams = useContextualDisplayParams(stringUI);
+    const [revealed, setRevealed] = React.useState(stringDisplayParams?.initiallyRevealed ?? false);
+    let displayMode = stringDisplayParams?.displayMode ?? StringDisplayMode.TEXT;
     if (!stringUI && stringFormat) {
         if (stringFormat === 'email')
             displayMode = StringDisplayMode.EMAIL;
@@ -49,19 +96,86 @@ function DisplayFieldString({ schema, value, className, }) {
         // Render based on display mode
         switch (displayMode) {
             case StringDisplayMode.TEXT:
-                return _jsx(Text, { children: value });
-            case StringDisplayMode.TRUNCATE:
-                return (_jsx(Text, { className: "min-w-0 truncate", children: value }));
+                return _jsx(Text, { children: asWord(value) });
+            case StringDisplayMode.TRUNCATE: {
+                // TWO AXES, BOTH LIVE, AND THEY ARE NOT THE SAME QUESTION.
+                //
+                // The `truncate` class below is a WIDTH cap: it clips to whatever the container can
+                // show, so it is responsive and never cuts a value that fits. `truncateLength` is a
+                // CHARACTER cap — its declaration says "Max characters before truncation" — so it is a
+                // statement about the VALUE and holds at any width. Applying both gives the shorter of
+                // the two, which is what an author asking for either one expects.
+                //
+                // The `ch`-based width ceiling considered as an alternative was rejected: a `ch` is the
+                // advance of "0", so against a proportional font `truncateLength: 48` would show
+                // anywhere from roughly thirty to eighty characters. That makes a parameter documented
+                // as a character count mean something it does not say, which is the kind of near-miss
+                // semantics the framework refuses.
+                //
+                // The ellipsis is ADDITIONAL to the budget: `truncateLength: 48` yields 48 characters
+                // of the value plus the mark that more exists, which is how a "max characters" cap
+                // reads everywhere else. `trimEnd` so a cut landing mid-space does not render "abc …".
+                //
+                // A CHARACTER IS A GRAPHEME, not a UTF-16 code unit, and the difference is not academic.
+                // `value.slice(0, n)` cuts between the two halves of a surrogate pair, so a string of emoji
+                // rendered at `truncateLength: 3` came out as `👍�…` — a literal replacement glyph. It also
+                // counted `"🎉🎉🎉"` as six characters, which made this parameter mean something other than
+                // what its own declaration says, for exactly the reason the `ch`-based alternative was
+                // rejected. `Intl.Segmenter` counts and cuts what a reader would call a character: an emoji
+                // with a skin-tone modifier, a family joined by ZWJ, a flag's two regional indicators, and a
+                // letter with its combining accent are each one.
+                // What is shown, and cut: an open-vocabulary value's WORD (#1791), otherwise the value itself.
+                const shown = asWord(value);
+                const maximumCharacters = stringDisplayParams?.truncateLength;
+                const graphemes = typeof maximumCharacters === 'number' && maximumCharacters > 0
+                    ? splitIntoGraphemes(shown)
+                    : null;
+                const clipsAtCharacterCount = graphemes !== null && typeof maximumCharacters === 'number' && graphemes.length > maximumCharacters;
+                if (!clipsAtCharacterCount) {
+                    return (_jsx(Text, { className: "min-w-0 truncate", children: shown }));
+                }
+                // `title` carries the full value, and it is not decoration: a character cap REMOVES the
+                // remainder from the DOM, where a CSS clip only hides it, so without this there is nothing
+                // left holding the rest of the string.
+                //
+                // Be precise about what it does and does not restore, because an earlier version of this
+                // comment overclaimed and a review caught it. `title` is an ATTRIBUTE, so browser
+                // find-in-page — which searches rendered text — does NOT match the hidden remainder, and a
+                // screen reader's treatment of `title` on a `<p>` is inconsistent and never keyboard
+                // reachable. It is the strongest affordance available on this element, not an equivalent of
+                // leaving the text in place.
+                //
+                // On a surface whose policy sets `tooltipOnTruncate`, `Text` routes its children into a
+                // styled tooltip when the element OVERFLOWS. A character-capped string usually no longer
+                // overflows, so that tooltip stops opening and the native `title` is what remains. The full
+                // value stays reachable either way; the polish of which tooltip shows it does not survive
+                // the cap, and an author choosing `truncateLength` on such a surface is choosing that.
+                return (_jsx(Text, { className: "min-w-0 truncate", title: shown, children: `${(graphemes ?? []).slice(0, maximumCharacters).join('').trimEnd()}…` }));
+            }
+            case StringDisplayMode.ORGANIZATION_ROLE:
+                // #1921 — a key of the organization role table, read as the role's word from the `roles` labels (the member
+                // directory's words). A role with no authored word shows its key: a missing label that looks missing.
+                return _jsx(Text, { children: tRole(value, 'label') });
             case StringDisplayMode.MULTILINE:
-                return (_jsx(Text, { className: "whitespace-pre-wrap", children: value }));
+                return (_jsx(Text, { className: "whitespace-pre-wrap", children: asWord(value) }));
             case StringDisplayMode.IDENTIFIER:
                 // A machine ref/slug: verbatim and greppable, styled to recede behind the prose.
-                return _jsx(Text, { className: "font-mono text-xs text-muted-foreground break-all", children: value });
+                //
+                // Through the `Identifier` element rather than a class string, and that is the whole point of
+                // that element existing: this treatment used to live ONLY here, inside a switch nothing
+                // outside the field pipeline can call, so every surface that builds its own rows spelled the
+                // same classes by hand and drifted. One resolved component is what lets a hand-built row and
+                // a field render the same ref the same way — and makes the treatment themeable, which a
+                // class string in a switch never was.
+                return _jsx(Identifier, { children: value });
             case StringDisplayMode.MARKDOWN:
                 // Rich long-form content (descriptions, notes): full markdown body
                 // themed through the typography recipes. See markdown-content.tsx for
                 // the embedded heading-demotion rationale.
                 return _jsx(MarkdownContent, { value: value });
+            case StringDisplayMode.UNTRUSTED_HTML:
+                // HTML from outside the application (a received email body, #1912): sandboxed, no remote content.
+                return _jsx(UntrustedHtmlContent, { value: value, title: tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'untrustedHtmlFrameTitle') });
             case StringDisplayMode.COLOR:
                 return (_jsxs("div", { className: "flex items-center gap-element", children: [_jsx("div", { className: "h-5 w-5 rounded border border-border", style: { backgroundColor: value }, "aria-hidden": "true" }), _jsx(Text, { className: "font-mono text-sm", children: value })] }));
             case StringDisplayMode.LINK:
@@ -69,7 +183,7 @@ function DisplayFieldString({ schema, value, className, }) {
             case StringDisplayMode.EMAIL:
                 return (_jsx("a", { href: `mailto:${value}`, className: "text-primary hover:underline", children: value }));
             case StringDisplayMode.BADGE:
-                return _jsx(Badge, { variant: "secondary", children: value });
+                return _jsx(Badge, { variant: "secondary", children: asWord(value) });
             case StringDisplayMode.COPY:
                 return (_jsxs("div", { className: "flex items-center gap-element", children: [_jsx(Text, { className: "font-mono text-sm", children: value }), _jsx("button", { type: "button", onClick: handleCopy, className: "text-muted-foreground hover:text-foreground transition-colors", "aria-label": copied ? tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'copied') : tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'copyToClipboard'), children: _jsx("span", { "aria-hidden": "true", children: copied
                                     ? renderIcon(StandardIconReference.CHECK, { size: IconSize.SM })
@@ -81,7 +195,7 @@ function DisplayFieldString({ schema, value, className, }) {
                                     ? renderIcon(StandardIconReference.CHECK, { size: IconSize.SM })
                                     : renderIcon(StandardIconReference.COPY, { size: IconSize.SM }) }) })] }));
             default:
-                return _jsx(Text, { children: value });
+                return _jsx(Text, { children: asWord(value) });
         }
     };
     if (!isReady)

package/dist/esm/components/data-display/formatters/display-field-string.js.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-string.js","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-string.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\n/**\n * DisplayFieldString Component\n *\n * Displays a string value based on the string UI decorator.\n * Supports different display modes: text, truncate, multiline, markdown, color, link, email, badge, copy, secret\n */\n\nimport * as React from \"react\"\n\nimport { cn, useI18n, useIconRegistry, StandardIconReference, IconSize, Text, Badge } from \"@wildo-ai/saas-frontend-lib\"\nimport { FrontendComponentType } from \"@wildo-ai/presets-components-models\"\nimport { getStringUI, getStringFormat, StringDisplayMode } from \"@wildo-ai/zod-decorators\"\nimport type { DisplayFieldStringProps } from '@wildo-ai/saas-frontend-lib'\n\nimport { MarkdownContent } from \"../markdown-content\"\n\n/**\n * DisplayFieldString component\n *\n * Renders a string value according to the string UI decorator\n */\nfunction DisplayFieldString({\n  schema,\n  value,\n  className,\n}: DisplayFieldStringProps): React.JSX.Element | null {\n  const { tComponent, isReady } = useI18n({ component: FrontendComponentType.LOW_LEVEL_FORM_FIELD })\n  const { renderIcon } = useIconRegistry()\n  const [copied, setCopied] = React.useState(false)\n\n  const stringUI = getStringUI(schema)\n  const stringFormat = getStringFormat(schema)\n\n  // SECRET fields mask by default; `initiallyRevealed` (set by `.isEphemeral()`)\n  // shows the value on first paint for one-time reveals. The eye toggle still works.\n  const [revealed, setRevealed] = React.useState(stringUI?.display?.initiallyRevealed ?? false)\n\n  let displayMode = stringUI?.display?.displayMode ?? StringDisplayMode.TEXT\n  if (!stringUI && stringFormat) {\n    if (stringFormat === 'email') displayMode = StringDisplayMode.EMAIL\n    else if (stringFormat === 'url') displayMode = StringDisplayMode.LINK\n  }\n\n  // Copy to clipboard handler\n  const handleCopy = async () => {\n    if (value) {\n      await navigator.clipboard.writeText(value)\n      setCopied(true)\n      setTimeout(() => setCopied(false), 2000)\n    }\n  }\n\n  // Render the value content\n  const renderValue = () => {\n    // Handle null/undefined\n    if (value === null || value === undefined || value === '') {\n      return <><Text className=\"text-muted-foreground italic\" aria-hidden=\"true\">—</Text><span className=\"sr-only\">{tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD, 'noValue')}</span></>\n    }\n\n    // Render based on display mode\n    switch (displayMode) {\n      case StringDisplayMode.TEXT:\n        return <Text>{value}</Text>\n\n      case StringDisplayMode.TRUNCATE:\n        return (\n          <Text className=\"min-w-0 truncate\">\n            {value}\n          </Text>\n        )\n\n      case StringDisplayMode.MULTILINE:\n        return (\n          <Text className=\"whitespace-pre-wrap\">\n            {value}\n          </Text>\n        )\n\n      case StringDisplayMode.IDENTIFIER:\n        // A machine ref/slug: verbatim and greppable, styled to recede behind the prose.\n        return <Text className=\"font-mono text-xs text-muted-foreground break-all\">{value}</Text>\n\n      case StringDisplayMode.MARKDOWN:\n        // Rich long-form content (descriptions, notes): full markdown body\n        // themed through the typography recipes. See markdown-content.tsx for\n        // the embedded heading-demotion rationale.\n        return <MarkdownContent value={value} />\n\n\n      case StringDisplayMode.COLOR:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <div\n              className=\"h-5 w-5 rounded border border-border\"\n              style={{ backgroundColor: value }}\n              aria-hidden=\"true\"\n            />\n            <Text className=\"font-mono text-sm\">{value}</Text>\n          </div>\n        )\n\n      case StringDisplayMode.LINK:\n        return (\n          <a\n            href={value}\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            className=\"text-primary hover:underline\"\n          >\n            {value}\n          </a>\n        )\n\n      case StringDisplayMode.EMAIL:\n        return (\n          <a\n            href={`mailto:${value}`}\n            className=\"text-primary hover:underline\"\n          >\n            {value}\n          </a>\n        )\n\n      case StringDisplayMode.BADGE:\n        return <Badge variant=\"secondary\">{value}</Badge>\n\n      case StringDisplayMode.COPY:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <Text className=\"font-mono text-sm\">{value}</Text>\n            <button\n              type=\"button\"\n              onClick={handleCopy}\n              className=\"text-muted-foreground hover:text-foreground transition-colors\"\n              aria-label={copied ? tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'copied') : tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'copyToClipboard')}\n            >\n              <span aria-hidden=\"true\">\n                {copied\n                  ? renderIcon(StandardIconReference.CHECK, { size: IconSize.SM })\n                  : renderIcon(StandardIconReference.COPY, { size: IconSize.SM })\n                }\n              </span>\n            </button>\n          </div>\n        )\n\n      case StringDisplayMode.SECRET:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <Text className=\"font-mono text-sm select-all\" aria-live=\"polite\">\n              {revealed ? value : '••••••••••••••••'}\n            </Text>\n            <button\n              type=\"button\"\n              onClick={() => setRevealed(prev => !prev)}\n              className=\"text-muted-foreground hover:text-foreground transition-colors\"\n              aria-label={revealed ? tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'hideValue') : tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'revealValue')}\n            >\n              <span aria-hidden=\"true\">\n                {revealed\n                  ? renderIcon(StandardIconReference.EYE_OFF, { size: IconSize.SM })\n                  : renderIcon(StandardIconReference.EYE, { size: IconSize.SM })\n                }\n              </span>\n            </button>\n            <button\n              type=\"button\"\n              onClick={handleCopy}\n              className=\"text-muted-foreground hover:text-foreground transition-colors\"\n              aria-label={copied ? tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'copied') : tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'copyToClipboard')}\n            >\n              <span aria-hidden=\"true\">\n                {copied\n                  ? renderIcon(StandardIconReference.CHECK, { size: IconSize.SM })\n                  : renderIcon(StandardIconReference.COPY, { size: IconSize.SM })\n                }\n              </span>\n            </button>\n          </div>\n        )\n\n      default:\n        return <Text>{value}</Text>\n    }\n  }\n\n  if (!isReady) return null\n  // Label/description rendering is handled by the parent DisplayField (FIELD-01)\n  return <div className={className}>{renderValue()}</div>\n}\n\n;(DisplayFieldString as typeof DisplayFieldString & { displayName: string }).displayName = \"DisplayFieldString\"\n\nexport { DisplayFieldString }\n"]}
+{"version":3,"file":"display-field-string.js","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-string.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\n/**\n * DisplayFieldString Component\n *\n * Displays a string value based on the string UI decorator.\n * Supports different display modes: text, truncate, multiline, markdown, untrusted_html, color, link, email, badge, copy, secret\n */\n\nimport * as React from \"react\"\n\nimport { cn, useI18n, useIconRegistry, StandardIconReference, IconSize, Text, Badge, Identifier, useContextualDisplayParams} from \"@wildo-ai/saas-frontend-lib\"\nimport { FrontendComponentType, LabellingTypes, resolveVocabularyWordKey } from \"@wildo-ai/presets-components-models\"\nimport { getStringUI, getStringFormat, getSystemEnumName, StringDisplayMode } from \"@wildo-ai/zod-decorators\"\nimport type { DisplayFieldStringProps } from '@wildo-ai/saas-frontend-lib'\n\nimport { MarkdownContent } from \"../markdown-content\"\nimport { UntrustedHtmlContent } from \"../untrusted-html-content\"\n\n/**\n * Split a string into user-perceived characters.\n *\n * `Intl.Segmenter` is the only thing that gets this right — code units split surrogate pairs, and\n * code points still split a flag, a ZWJ sequence, a skin-tone modifier and a combining accent. The\n * fallback to code points is for a runtime without it; it is strictly better than code units and\n * cannot produce a lone surrogate, which is the failure that actually shows on screen.\n */\nconst GRAPHEME_SEGMENTER =\n  typeof Intl !== 'undefined' && typeof Intl.Segmenter === 'function'\n    ? new Intl.Segmenter(undefined, { granularity: 'grapheme' })\n    : null\n\nfunction splitIntoGraphemes(value: string): string[] {\n  if (!GRAPHEME_SEGMENTER) return Array.from(value)\n  return Array.from(GRAPHEME_SEGMENTER.segment(value), part => part.segment)\n}\n\n/**\n * The label namespaces a string display reads beyond its own component: the `roles` words an ORGANIZATION_ROLE value\n * shows (#1921) — requested only by a field that can show one, so no other string display waits on the roles bundle.\n * Module-level so each requested set keeps one identity across renders.\n */\nconst ROLE_LABEL_NAMESPACES = [LabellingTypes.ROLES]\nconst NO_EXTRA_LABEL_NAMESPACES: LabellingTypes[] = []\n\n/**\n * DisplayFieldString component\n *\n * Renders a string value according to the string UI decorator\n */\nfunction DisplayFieldString({\n  schema,\n  value,\n  className,\n}: DisplayFieldStringProps): React.JSX.Element | null {\n  const stringUI = getStringUI(schema)\n  const showsRole = stringUI?.display?.displayMode === StringDisplayMode.ORGANIZATION_ROLE\n    || stringUI?.summaryOverride?.displayMode === StringDisplayMode.ORGANIZATION_ROLE\n  const { tComponent, tRole, t, isReady } = useI18n({\n    component: [FrontendComponentType.LOW_LEVEL_FORM_FIELD, FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING],\n    keys: showsRole ? ROLE_LABEL_NAMESPACES : NO_EXTRA_LABEL_NAMESPACES,\n  })\n  const { renderIcon } = useIconRegistry()\n  const [copied, setCopied] = React.useState(false)\n\n  const stringFormat = getStringFormat(schema)\n\n  /*\n   * An OPEN vocabulary (#1791): the string's values are words of a vocabulary declared outside the schema — today the\n   * engine's audit event types — named with `.systemEnum(name)`. Read as a word where the vocabulary keeps it\n   * (`resolveVocabularyWordKey`: `system_enums.<name>.<value>`, or a feature's and a limit's own billing section) in\n   * every mode that shows the value as prose (text, truncate, multiline, badge, the default); a missing word shows\n   * the value, which is the missing label looking missing. Modes that show the value AS DATA keep it raw on purpose:\n   * copy, identifier, link, email, secret, markdown, untrusted HTML, colour. Every one of those sections is eager\n   * (`EAGER_I18N_SECTIONS`), so this needs no extra request.\n   */\n  const openVocabulary = schema ? getSystemEnumName(schema) : undefined\n  const asWord = (raw: string): string => {\n    if (!openVocabulary) return raw\n    const key = resolveVocabularyWordKey(openVocabulary, raw)\n    const word = t(key)\n    return word === key ? raw : word\n  }\n\n  // SECRET fields mask by default; `initiallyRevealed` (set by `.isEphemeral()`)\n  // shows the value on first paint for one-time reveals. The eye toggle still works.\n  const stringDisplayParams = useContextualDisplayParams(stringUI)\n  const [revealed, setRevealed] = React.useState(stringDisplayParams?.initiallyRevealed ?? false)\n\n  let displayMode = stringDisplayParams?.displayMode ?? StringDisplayMode.TEXT\n  if (!stringUI && stringFormat) {\n    if (stringFormat === 'email') displayMode = StringDisplayMode.EMAIL\n    else if (stringFormat === 'url') displayMode = StringDisplayMode.LINK\n  }\n\n  // Copy to clipboard handler\n  const handleCopy = async () => {\n    if (value) {\n      await navigator.clipboard.writeText(value)\n      setCopied(true)\n      setTimeout(() => setCopied(false), 2000)\n    }\n  }\n\n  // Render the value content\n  const renderValue = () => {\n    // Handle null/undefined\n    if (value === null || value === undefined || value === '') {\n      return <><Text className=\"text-muted-foreground italic\" aria-hidden=\"true\">—</Text><span className=\"sr-only\">{tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD, 'noValue')}</span></>\n    }\n\n    // Render based on display mode\n    switch (displayMode) {\n      case StringDisplayMode.TEXT:\n        return <Text>{asWord(value)}</Text>\n\n      case StringDisplayMode.TRUNCATE: {\n        // TWO AXES, BOTH LIVE, AND THEY ARE NOT THE SAME QUESTION.\n        //\n        // The `truncate` class below is a WIDTH cap: it clips to whatever the container can\n        // show, so it is responsive and never cuts a value that fits. `truncateLength` is a\n        // CHARACTER cap — its declaration says \"Max characters before truncation\" — so it is a\n        // statement about the VALUE and holds at any width. Applying both gives the shorter of\n        // the two, which is what an author asking for either one expects.\n        //\n        // The `ch`-based width ceiling considered as an alternative was rejected: a `ch` is the\n        // advance of \"0\", so against a proportional font `truncateLength: 48` would show\n        // anywhere from roughly thirty to eighty characters. That makes a parameter documented\n        // as a character count mean something it does not say, which is the kind of near-miss\n        // semantics the framework refuses.\n        //\n        // The ellipsis is ADDITIONAL to the budget: `truncateLength: 48` yields 48 characters\n        // of the value plus the mark that more exists, which is how a \"max characters\" cap\n        // reads everywhere else. `trimEnd` so a cut landing mid-space does not render \"abc …\".\n        //\n        // A CHARACTER IS A GRAPHEME, not a UTF-16 code unit, and the difference is not academic.\n        // `value.slice(0, n)` cuts between the two halves of a surrogate pair, so a string of emoji\n        // rendered at `truncateLength: 3` came out as `👍�…` — a literal replacement glyph. It also\n        // counted `\"🎉🎉🎉\"` as six characters, which made this parameter mean something other than\n        // what its own declaration says, for exactly the reason the `ch`-based alternative was\n        // rejected. `Intl.Segmenter` counts and cuts what a reader would call a character: an emoji\n        // with a skin-tone modifier, a family joined by ZWJ, a flag's two regional indicators, and a\n        // letter with its combining accent are each one.\n        // What is shown, and cut: an open-vocabulary value's WORD (#1791), otherwise the value itself.\n        const shown = asWord(value)\n        const maximumCharacters = stringDisplayParams?.truncateLength\n        const graphemes = typeof maximumCharacters === 'number' && maximumCharacters > 0\n          ? splitIntoGraphemes(shown)\n          : null\n        const clipsAtCharacterCount =\n          graphemes !== null && typeof maximumCharacters === 'number' && graphemes.length > maximumCharacters\n\n        if (!clipsAtCharacterCount) {\n          return (\n            <Text className=\"min-w-0 truncate\">\n              {shown}\n            </Text>\n          )\n        }\n\n        // `title` carries the full value, and it is not decoration: a character cap REMOVES the\n        // remainder from the DOM, where a CSS clip only hides it, so without this there is nothing\n        // left holding the rest of the string.\n        //\n        // Be precise about what it does and does not restore, because an earlier version of this\n        // comment overclaimed and a review caught it. `title` is an ATTRIBUTE, so browser\n        // find-in-page — which searches rendered text — does NOT match the hidden remainder, and a\n        // screen reader's treatment of `title` on a `<p>` is inconsistent and never keyboard\n        // reachable. It is the strongest affordance available on this element, not an equivalent of\n        // leaving the text in place.\n        //\n        // On a surface whose policy sets `tooltipOnTruncate`, `Text` routes its children into a\n        // styled tooltip when the element OVERFLOWS. A character-capped string usually no longer\n        // overflows, so that tooltip stops opening and the native `title` is what remains. The full\n        // value stays reachable either way; the polish of which tooltip shows it does not survive\n        // the cap, and an author choosing `truncateLength` on such a surface is choosing that.\n        return (\n          <Text className=\"min-w-0 truncate\" title={shown}>\n            {`${(graphemes ?? []).slice(0, maximumCharacters).join('').trimEnd()}…`}\n          </Text>\n        )\n      }\n\n      case StringDisplayMode.ORGANIZATION_ROLE:\n        // #1921 — a key of the organization role table, read as the role's word from the `roles` labels (the member\n        // directory's words). A role with no authored word shows its key: a missing label that looks missing.\n        return <Text>{tRole(value, 'label')}</Text>\n\n      case StringDisplayMode.MULTILINE:\n        return (\n          <Text className=\"whitespace-pre-wrap\">\n            {asWord(value)}\n          </Text>\n        )\n\n      case StringDisplayMode.IDENTIFIER:\n        // A machine ref/slug: verbatim and greppable, styled to recede behind the prose.\n        //\n        // Through the `Identifier` element rather than a class string, and that is the whole point of\n        // that element existing: this treatment used to live ONLY here, inside a switch nothing\n        // outside the field pipeline can call, so every surface that builds its own rows spelled the\n        // same classes by hand and drifted. One resolved component is what lets a hand-built row and\n        // a field render the same ref the same way — and makes the treatment themeable, which a\n        // class string in a switch never was.\n        return <Identifier>{value}</Identifier>\n\n      case StringDisplayMode.MARKDOWN:\n        // Rich long-form content (descriptions, notes): full markdown body\n        // themed through the typography recipes. See markdown-content.tsx for\n        // the embedded heading-demotion rationale.\n        return <MarkdownContent value={value} />\n\n      case StringDisplayMode.UNTRUSTED_HTML:\n        // HTML from outside the application (a received email body, #1912): sandboxed, no remote content.\n        return <UntrustedHtmlContent value={value} title={tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'untrustedHtmlFrameTitle')} />\n\n\n      case StringDisplayMode.COLOR:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <div\n              className=\"h-5 w-5 rounded border border-border\"\n              style={{ backgroundColor: value }}\n              aria-hidden=\"true\"\n            />\n            <Text className=\"font-mono text-sm\">{value}</Text>\n          </div>\n        )\n\n      case StringDisplayMode.LINK:\n        return (\n          <a\n            href={value}\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            className=\"text-primary hover:underline\"\n          >\n            {value}\n          </a>\n        )\n\n      case StringDisplayMode.EMAIL:\n        return (\n          <a\n            href={`mailto:${value}`}\n            className=\"text-primary hover:underline\"\n          >\n            {value}\n          </a>\n        )\n\n      case StringDisplayMode.BADGE:\n        return <Badge variant=\"secondary\">{asWord(value)}</Badge>\n\n      case StringDisplayMode.COPY:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <Text className=\"font-mono text-sm\">{value}</Text>\n            <button\n              type=\"button\"\n              onClick={handleCopy}\n              className=\"text-muted-foreground hover:text-foreground transition-colors\"\n              aria-label={copied ? tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'copied') : tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'copyToClipboard')}\n            >\n              <span aria-hidden=\"true\">\n                {copied\n                  ? renderIcon(StandardIconReference.CHECK, { size: IconSize.SM })\n                  : renderIcon(StandardIconReference.COPY, { size: IconSize.SM })\n                }\n              </span>\n            </button>\n          </div>\n        )\n\n      case StringDisplayMode.SECRET:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <Text className=\"font-mono text-sm select-all\" aria-live=\"polite\">\n              {revealed ? value : '••••••••••••••••'}\n            </Text>\n            <button\n              type=\"button\"\n              onClick={() => setRevealed(prev => !prev)}\n              className=\"text-muted-foreground hover:text-foreground transition-colors\"\n              aria-label={revealed ? tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'hideValue') : tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'revealValue')}\n            >\n              <span aria-hidden=\"true\">\n                {revealed\n                  ? renderIcon(StandardIconReference.EYE_OFF, { size: IconSize.SM })\n                  : renderIcon(StandardIconReference.EYE, { size: IconSize.SM })\n                }\n              </span>\n            </button>\n            <button\n              type=\"button\"\n              onClick={handleCopy}\n              className=\"text-muted-foreground hover:text-foreground transition-colors\"\n              aria-label={copied ? tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'copied') : tComponent(FrontendComponentType.LOW_LEVEL_FORM_FIELD_STRING, 'copyToClipboard')}\n            >\n              <span aria-hidden=\"true\">\n                {copied\n                  ? renderIcon(StandardIconReference.CHECK, { size: IconSize.SM })\n                  : renderIcon(StandardIconReference.COPY, { size: IconSize.SM })\n                }\n              </span>\n            </button>\n          </div>\n        )\n\n      default:\n        return <Text>{asWord(value)}</Text>\n    }\n  }\n\n  if (!isReady) return null\n  // Label/description rendering is handled by the parent DisplayField (FIELD-01)\n  return <div className={className}>{renderValue()}</div>\n}\n\n;(DisplayFieldString as typeof DisplayFieldString & { displayName: string }).displayName = \"DisplayFieldString\"\n\nexport { DisplayFieldString }\n"]}

package/dist/esm/components/data-display/formatters/display-field-string.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-string.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-string.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,gCAAgC,EAAE,mBAAmB,EAAO,CAAC"}
+{"version":3,"file":"display-field-string.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-string.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,gCAAgC,EAAE,mBAAmB,EAAO,CAAC"}

package/dist/esm/components/data-display/formatters/display-field-time.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-time.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-time.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAA;AAGxE,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,GACV,EAAE,qBAAqB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAgBlD;AAID,OAAO,EAAE,gBAAgB,EAAE,CAAA"}
+{"version":3,"file":"display-field-time.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-time.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAA;AAGxE,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,GACV,EAAE,qBAAqB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAgBlD;AAID,OAAO,EAAE,gBAAgB,EAAE,CAAA"}

package/dist/esm/components/data-display/formatters/display-field-time.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-field-time.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/formatters/display-field-time.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,8BAA8B,EAAE,mBAAmB,EAAO,CAAC"}
+{"version":3,"file":"display-field-time.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/data-display/formatters/display-field-time.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,8BAA8B,EAAE,mBAAmB,EAAO,CAAC"}

package/dist/esm/components/data-display/identifier.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+import type { IdentifierProps } from "@wildo-ai/saas-frontend-lib";
+/**
+ * DEFAULT preset for `LOW_LEVEL_IDENTIFIER`: the design-system `Text` in a monospaced face, as a
+ * `<span>` so it composes inline beside the prose it addresses.
+ *
+ * `Text` owns the size and colour — this preset adds only what makes an identifier an identifier:
+ * the monospaced face, and `min-w-0 break-all` so a long unbroken ref wraps instead of pushing its
+ * row sideways. The caller's `className` is merged LAST, so a surface can still override.
+ *
+ * Deliberately NOT the `TypographyVariant.CODE` recipe: that one is an inline CODE SPAN
+ * (`bg-muted rounded px-1 py-0.5`), which is a chip behind the value. An identifier is the value
+ * itself, sitting in a row — a grey pill behind every ref on a board is a different design.
+ */
+export declare function Identifier({ size, variant, className, children, }: IdentifierProps): React.JSX.Element;
+export declare namespace Identifier {
+    var displayName: string;
+}
+//# sourceMappingURL=identifier.d.ts.map

package/dist/esm/components/data-display/identifier.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"identifier.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/identifier.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAElE;;;;;;;;;;;GAWG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAkB,EAClB,OAA2B,EAC3B,SAAS,EACT,QAAQ,GACT,EAAE,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAMrC;yBAXe,UAAU"}

package/dist/esm/components/data-display/identifier.js

@@ -0,0 +1,21 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { TextSize, TextVariant } from "@wildo-ai/presets-components-models";
+import { cn, Text } from "@wildo-ai/saas-frontend-lib";
+/**
+ * DEFAULT preset for `LOW_LEVEL_IDENTIFIER`: the design-system `Text` in a monospaced face, as a
+ * `<span>` so it composes inline beside the prose it addresses.
+ *
+ * `Text` owns the size and colour — this preset adds only what makes an identifier an identifier:
+ * the monospaced face, and `min-w-0 break-all` so a long unbroken ref wraps instead of pushing its
+ * row sideways. The caller's `className` is merged LAST, so a surface can still override.
+ *
+ * Deliberately NOT the `TypographyVariant.CODE` recipe: that one is an inline CODE SPAN
+ * (`bg-muted rounded px-1 py-0.5`), which is a chip behind the value. An identifier is the value
+ * itself, sitting in a row — a grey pill behind every ref on a board is a different design.
+ */
+export function Identifier({ size = TextSize.XS, variant = TextVariant.MUTED, className, children, }) {
+    return (_jsx(Text, { as: "span", size: size, variant: variant, className: cn("min-w-0 break-all font-mono", className), children: children }));
+}
+Identifier.displayName = "Identifier";
+//# sourceMappingURL=identifier.js.map

package/dist/esm/components/data-display/identifier.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"identifier.js","sourceRoot":"","sources":["../../../../../src/components/data-display/identifier.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAIZ,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAA;AAC3E,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,MAAM,6BAA6B,CAAA;AAGtD;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,UAAU,CAAC,EACzB,IAAI,GAAG,QAAQ,CAAC,EAAE,EAClB,OAAO,GAAG,WAAW,CAAC,KAAK,EAC3B,SAAS,EACT,QAAQ,GACQ;IAChB,OAAO,CACL,KAAC,IAAI,IAAC,EAAE,EAAC,MAAM,EAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,CAAC,6BAA6B,EAAE,SAAS,CAAC,YAClG,QAAQ,GACJ,CACR,CAAA;AACH,CAAC;AAED,UAAU,CAAC,WAAW,GAAG,YAAY,CAAA","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { TextSize, TextVariant } from \"@wildo-ai/presets-components-models\"\nimport { cn, Text } from \"@wildo-ai/saas-frontend-lib\"\nimport type { IdentifierProps } from \"@wildo-ai/saas-frontend-lib\"\n\n/**\n * DEFAULT preset for `LOW_LEVEL_IDENTIFIER`: the design-system `Text` in a monospaced face, as a\n * `<span>` so it composes inline beside the prose it addresses.\n *\n * `Text` owns the size and colour — this preset adds only what makes an identifier an identifier:\n * the monospaced face, and `min-w-0 break-all` so a long unbroken ref wraps instead of pushing its\n * row sideways. The caller's `className` is merged LAST, so a surface can still override.\n *\n * Deliberately NOT the `TypographyVariant.CODE` recipe: that one is an inline CODE SPAN\n * (`bg-muted rounded px-1 py-0.5`), which is a chip behind the value. An identifier is the value\n * itself, sitting in a row — a grey pill behind every ref on a board is a different design.\n */\nexport function Identifier({\n  size = TextSize.XS,\n  variant = TextVariant.MUTED,\n  className,\n  children,\n}: IdentifierProps): React.JSX.Element {\n  return (\n    <Text as=\"span\" size={size} variant={variant} className={cn(\"min-w-0 break-all font-mono\", className)}>\n      {children}\n    </Text>\n  )\n}\n\nIdentifier.displayName = \"Identifier\"\n"]}

package/dist/esm/components/data-display/kbd.d.ts

@@ -0,0 +1,17 @@
+import * as React from "react";
+import type { KbdProps } from "@wildo-ai/saas-frontend-lib";
+/**
+ * DEFAULT preset for `LOW_LEVEL_KBD`: a real `<kbd>` element, in the monospaced face, on the INSET
+ * surface with a hairline border — a key cap, drawn once for every surface that tells a person what
+ * to press.
+ *
+ * INSET rather than SUNKEN or MUTED: the three sites this replaced disagreed on the ground, and an
+ * inset surface is the one whose meaning is "a control sunk into what it sits on", which is what a
+ * key cap depicts. The size is fixed at the XS text scale and never scales with its host: a cap
+ * beside a heading and a cap beside a caption are the same key.
+ */
+export declare function Kbd({ className, children }: KbdProps): React.JSX.Element;
+export declare namespace Kbd {
+    var displayName: string;
+}
+//# sourceMappingURL=kbd.d.ts.map

package/dist/esm/components/data-display/kbd.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"kbd.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/kbd.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAE3D;;;;;;;;;GASG;AACH,wBAAgB,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAYxE;yBAZe,GAAG"}

package/dist/esm/components/data-display/kbd.js

@@ -0,0 +1,18 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "@wildo-ai/saas-frontend-lib";
+/**
+ * DEFAULT preset for `LOW_LEVEL_KBD`: a real `<kbd>` element, in the monospaced face, on the INSET
+ * surface with a hairline border — a key cap, drawn once for every surface that tells a person what
+ * to press.
+ *
+ * INSET rather than SUNKEN or MUTED: the three sites this replaced disagreed on the ground, and an
+ * inset surface is the one whose meaning is "a control sunk into what it sits on", which is what a
+ * key cap depicts. The size is fixed at the XS text scale and never scales with its host: a cap
+ * beside a heading and a cap beside a caption are the same key.
+ */
+export function Kbd({ className, children }) {
+    return (_jsx("kbd", { "data-slot": "kbd", className: cn("inline-flex shrink-0 select-none items-center justify-center rounded border border-border bg-surface-inset px-1.5 py-0.5 font-mono text-xs font-medium leading-none text-surface-inset-foreground", className), children: children }));
+}
+Kbd.displayName = "Kbd";
+//# sourceMappingURL=kbd.js.map

package/dist/esm/components/data-display/kbd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kbd.js","sourceRoot":"","sources":["../../../../../src/components/data-display/kbd.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAIZ,OAAO,EAAE,EAAE,EAAE,MAAM,6BAA6B,CAAA;AAGhD;;;;;;;;;GASG;AACH,MAAM,UAAU,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAY;IACnD,OAAO,CACL,2BACY,KAAK,EACf,SAAS,EAAE,EAAE,CACX,mMAAmM,EACnM,SAAS,CACV,YAEA,QAAQ,GACL,CACP,CAAA;AACH,CAAC;AAED,GAAG,CAAC,WAAW,GAAG,KAAK,CAAA","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"@wildo-ai/saas-frontend-lib\"\nimport type { KbdProps } from \"@wildo-ai/saas-frontend-lib\"\n\n/**\n * DEFAULT preset for `LOW_LEVEL_KBD`: a real `<kbd>` element, in the monospaced face, on the INSET\n * surface with a hairline border — a key cap, drawn once for every surface that tells a person what\n * to press.\n *\n * INSET rather than SUNKEN or MUTED: the three sites this replaced disagreed on the ground, and an\n * inset surface is the one whose meaning is \"a control sunk into what it sits on\", which is what a\n * key cap depicts. The size is fixed at the XS text scale and never scales with its host: a cap\n * beside a heading and a cap beside a caption are the same key.\n */\nexport function Kbd({ className, children }: KbdProps): React.JSX.Element {\n  return (\n    <kbd\n      data-slot=\"kbd\"\n      className={cn(\n        \"inline-flex shrink-0 select-none items-center justify-center rounded border border-border bg-surface-inset px-1.5 py-0.5 font-mono text-xs font-medium leading-none text-surface-inset-foreground\",\n        className,\n      )}\n    >\n      {children}\n    </kbd>\n  )\n}\n\nKbd.displayName = \"Kbd\"\n"]}

package/dist/esm/components/data-display/markdown-content.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"markdown-content.d.ts","sourceRoot":"","sources":["../../../../src/components/data-display/markdown-content.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAS9B,MAAM,WAAW,oBAAoB;IACnC,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAID,iBAAS,eAAe,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,oBAAoB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CA6FtF;AAID,OAAO,EAAE,eAAe,EAAE,CAAA"}
+{"version":3,"file":"markdown-content.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/markdown-content.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAS9B,MAAM,WAAW,oBAAoB;IACnC,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAID,iBAAS,eAAe,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,oBAAoB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CA6FtF;AAID,OAAO,EAAE,eAAe,EAAE,CAAA"}

package/dist/esm/components/data-display/markdown-stream-runtime.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"markdown-stream-runtime.d.ts","sourceRoot":"","sources":["../../../../src/components/data-display/markdown-stream-runtime.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAGH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAEjD,sGAAsG;AACtG,MAAM,MAAM,wBAAwB,GAAG,WAAW,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC,CAAA;AAEpF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+EG;AACH,eAAO,MAAM,sBAAsB,EAAE,wBAQjC,CAAA;AAEJ;;;;;;;;;;;GAWG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,eAAe,GAAG,YAAY,CAE1E"}
+{"version":3,"file":"markdown-stream-runtime.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/markdown-stream-runtime.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAGH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAEjD,sGAAsG;AACtG,MAAM,MAAM,wBAAwB,GAAG,WAAW,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC,CAAA;AAEpF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+EG;AACH,eAAO,MAAM,sBAAsB,EAAE,wBAQjC,CAAA;AAEJ;;;;;;;;;;;GAWG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,eAAe,GAAG,YAAY,CAE1E"}

package/dist/esm/components/data-display/markdown-stream.lazy.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"markdown-stream.lazy.d.ts","sourceRoot":"","sources":["../../../../src/components/data-display/markdown-stream.lazy.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AAE5C,4DAA4D;AAC5D,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,CAAA;AAqDzE;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAAC,EAAE,OAAyB,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAc9G"}
+{"version":3,"file":"markdown-stream.lazy.d.ts","sourceRoot":"","sources":["../../../../../src/components/data-display/markdown-stream.lazy.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AAE5C,4DAA4D;AAC5D,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,CAAA;AAwEzE;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAAC,EAAE,OAAyB,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAgB9G"}

package/dist/esm/components/data-display/markdown-stream.lazy.js

@@ -37,7 +37,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * `pnpm check:lazy-boundaries`.
  */
 import * as React from "react";
-import { Skeleton, cn, useUI } from "@wildo-ai/saas-frontend-lib";
+import { LazyDoorErrorBoundary, Skeleton, cn, useUI } from "@wildo-ai/saas-frontend-lib";
 import { TypographyVariant, UIBehavior } from "@wildo-ai/presets-components-models";
 /**
  * What a ```` ```mermaid ```` fence renders as, now that diagram rendering is switched off.
@@ -60,6 +60,17 @@ function MermaidSourceFallback({ chart }) {
     const code = getRecipe(UIBehavior.TYPOGRAPHY, TypographyVariant.CODE);
     return (_jsx("pre", { className: cn("my-4 overflow-x-auto rounded-md border bg-muted/50 p-card-sm text-sm", code.base), "data-streamdown": "mermaid-source", children: _jsx("code", { children: chart }) }));
 }
+/**
+ * What markdown degrades TO when the rendering pipeline never arrives (#963): the SOURCE, in the same
+ * code block the mermaid fallback uses. Markdown is readable as text — headings, lists and links keep
+ * their meaning unrendered — so the source is the most useful thing left to show, and it is the
+ * person's own content rather than a word the door would have to invent.
+ */
+function MarkdownSourceFallback({ children }) {
+    const { getRecipe } = useUI();
+    const code = getRecipe(UIBehavior.TYPOGRAPHY, TypographyVariant.CODE);
+    return (_jsx("pre", { className: cn("my-4 overflow-x-auto rounded-md border border-dashed bg-muted/50 p-card-sm text-sm whitespace-pre-wrap", code.base), "data-lazy-door": "unavailable", children: _jsx("code", { children: typeof children === "string" ? children : "" }) }));
+}
 /**
  * Default `mermaid` options handed to `streamdown`.
  *
@@ -87,6 +98,6 @@ const LazyStreamdown = React.lazy(() => import("./markdown-stream-runtime.js").t
  * `MermaidSourceFallback` above; passing `mermaid` explicitly overrides it.
  */
 export function MarkdownStream({ mermaid = MERMAID_OPTIONS, ...props }) {
-    return (_jsx(React.Suspense, { fallback: _jsxs("div", { className: "space-y-2", "aria-busy": "true", children: [_jsx(Skeleton, { className: "h-4 w-full" }), _jsx(Skeleton, { className: "h-4 w-11/12" }), _jsx(Skeleton, { className: "h-4 w-4/6" })] }), children: _jsx(LazyStreamdown, { mermaid: mermaid, ...props }) }));
+    return (_jsx(LazyDoorErrorBoundary, { doorName: "MarkdownStream", fallback: _jsx(MarkdownSourceFallback, { children: props.children }), children: _jsx(React.Suspense, { fallback: _jsxs("div", { className: "space-y-2", "aria-busy": "true", children: [_jsx(Skeleton, { className: "h-4 w-full" }), _jsx(Skeleton, { className: "h-4 w-11/12" }), _jsx(Skeleton, { className: "h-4 w-4/6" })] }), children: _jsx(LazyStreamdown, { mermaid: mermaid, ...props }) }) }));
 }
 //# sourceMappingURL=markdown-stream.lazy.js.map