@almadar/ui 5.133.0 → 5.134.0

package/dist/lib/drawable/three/index.cjs

@@ -2795,6 +2795,53 @@ var Box = React3__default.default.forwardRef(
   }
 );
 Box.displayName = "Box";
+
+// lib/format.ts
+function formatDate(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
+}
+function formatTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleTimeString(void 0, { hour: "numeric", minute: "2-digit" });
+}
+function formatDateTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return `${formatDate(value)} ${formatTime(value)}`;
+}
+function asYesNo(value) {
+  return value === false || value === 0 || String(value) === "false" ? "No" : "Yes";
+}
+function formatValue(value, format) {
+  if (value === void 0 || value === null) return "";
+  if (typeof value === "boolean") return asYesNo(value);
+  switch (format) {
+    case "date":
+      return formatDate(value);
+    case "time":
+      return formatTime(value);
+    case "datetime":
+      return formatDateTime(value);
+    case "currency":
+      return typeof value === "number" ? `$${value.toFixed(2)}` : String(value);
+    case "number":
+      return typeof value === "number" ? value.toLocaleString() : String(value);
+    case "percent":
+      return typeof value === "number" ? `${Math.round(value)}%` : String(value);
+    case "boolean":
+      return asYesNo(value);
+    default:
+      return String(value);
+  }
+}
+
+// components/core/atoms/Typography.tsx
 var variantStyles = {
   h1: "text-4xl font-bold tracking-tight text-foreground",
   h2: "text-3xl font-bold tracking-tight text-foreground",
@@ -2882,11 +2929,16 @@ var Typography = ({
   id,
   className,
   style,
+  format,
   content,
   children
 }) => {
   const variant = variantProp ?? (level ? `h${level}` : "body1");
   const Component2 = as || defaultElements[variant];
+  let body = children ?? content;
+  if (format !== void 0 && format !== "none" && (typeof body === "string" || typeof body === "number" || body instanceof Date)) {
+    body = formatValue(body, format);
+  }
   return React3__default.default.createElement(
     Component2,
     {
@@ -2903,7 +2955,7 @@ var Typography = ({
       ),
       style
     },
-    children ?? content
+    body
   );
 };
 Typography.displayName = "Typography";

package/dist/lib/drawable/three/index.js

@@ -2771,6 +2771,53 @@ var Box = React3.forwardRef(
   }
 );
 Box.displayName = "Box";
+
+// lib/format.ts
+function formatDate(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
+}
+function formatTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleTimeString(void 0, { hour: "numeric", minute: "2-digit" });
+}
+function formatDateTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return `${formatDate(value)} ${formatTime(value)}`;
+}
+function asYesNo(value) {
+  return value === false || value === 0 || String(value) === "false" ? "No" : "Yes";
+}
+function formatValue(value, format) {
+  if (value === void 0 || value === null) return "";
+  if (typeof value === "boolean") return asYesNo(value);
+  switch (format) {
+    case "date":
+      return formatDate(value);
+    case "time":
+      return formatTime(value);
+    case "datetime":
+      return formatDateTime(value);
+    case "currency":
+      return typeof value === "number" ? `$${value.toFixed(2)}` : String(value);
+    case "number":
+      return typeof value === "number" ? value.toLocaleString() : String(value);
+    case "percent":
+      return typeof value === "number" ? `${Math.round(value)}%` : String(value);
+    case "boolean":
+      return asYesNo(value);
+    default:
+      return String(value);
+  }
+}
+
+// components/core/atoms/Typography.tsx
 var variantStyles = {
   h1: "text-4xl font-bold tracking-tight text-foreground",
   h2: "text-3xl font-bold tracking-tight text-foreground",
@@ -2858,11 +2905,16 @@ var Typography = ({
   id,
   className,
   style,
+  format,
   content,
   children
 }) => {
   const variant = variantProp ?? (level ? `h${level}` : "body1");
   const Component2 = as || defaultElements[variant];
+  let body = children ?? content;
+  if (format !== void 0 && format !== "none" && (typeof body === "string" || typeof body === "number" || body instanceof Date)) {
+    body = formatValue(body, format);
+  }
   return React3.createElement(
     Component2,
     {
@@ -2879,7 +2931,7 @@ var Typography = ({
       ),
       style
     },
-    children ?? content
+    body
   );
 };
 Typography.displayName = "Typography";

package/dist/lib/index.cjs

@@ -790,6 +790,57 @@ function clearVerification() {
 }
 exposeOnWindow();
 
+// lib/format.ts
+function humanizeFieldName(name) {
+  return name.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/([A-Z]+)([A-Z][a-z])/g, "$1 $2").replace(/[_-]/g, " ").replace(/\b\w/g, (c) => c.toUpperCase()).replace(/\b([A-Z])([A-Z]+)\b/g, (_, first, rest) => first + rest.toLowerCase()).trim();
+}
+function humanizeEnumValue(value) {
+  return /^[a-z0-9]+(?:[_-][a-z0-9]+)+$/.test(value) ? humanizeFieldName(value) : value;
+}
+function formatDate(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
+}
+function formatTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleTimeString(void 0, { hour: "numeric", minute: "2-digit" });
+}
+function formatDateTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return `${formatDate(value)} ${formatTime(value)}`;
+}
+function asYesNo(value) {
+  return value === false || value === 0 || String(value) === "false" ? "No" : "Yes";
+}
+function formatValue(value, format) {
+  if (value === void 0 || value === null) return "";
+  if (typeof value === "boolean") return asYesNo(value);
+  switch (format) {
+    case "date":
+      return formatDate(value);
+    case "time":
+      return formatTime(value);
+    case "datetime":
+      return formatDateTime(value);
+    case "currency":
+      return typeof value === "number" ? `$${value.toFixed(2)}` : String(value);
+    case "number":
+      return typeof value === "number" ? value.toLocaleString() : String(value);
+    case "percent":
+      return typeof value === "number" ? `${Math.round(value)}%` : String(value);
+    case "boolean":
+      return asYesNo(value);
+    default:
+      return String(value);
+  }
+}
+
 // lib/getNestedValue.ts
 function getNestedValue(obj, path) {
   if (obj === null || obj === void 0 || !path) {
@@ -1879,8 +1930,12 @@ exports.debugWarn = debugWarn;
 exports.eightPointedStarPath = eightPointedStarPath;
 exports.extractOutputsFromTransitions = extractOutputsFromTransitions;
 exports.extractStateMachine = extractStateMachine;
+exports.formatDate = formatDate;
+exports.formatDateTime = formatDateTime;
 exports.formatGuard = formatGuard;
 exports.formatNestedFieldLabel = formatNestedFieldLabel;
+exports.formatTime = formatTime;
+exports.formatValue = formatValue;
 exports.gearTeethPath = gearTeethPath;
 exports.getAllChecks = getAllChecks;
 exports.getAllTicks = getAllTicks;
@@ -1905,6 +1960,8 @@ exports.getTrait = getTrait;
 exports.getTraitSnapshots = getTraitSnapshots;
 exports.getTransitions = getTransitions;
 exports.getTransitionsForTrait = getTransitionsForTrait;
+exports.humanizeEnumValue = humanizeEnumValue;
+exports.humanizeFieldName = humanizeFieldName;
 exports.initDebugShortcut = initDebugShortcut;
 exports.isDebugEnabled = isDebugEnabled;
 exports.lockIconPath = lockIconPath;

package/dist/lib/index.d.cts

@@ -283,6 +283,35 @@ declare function onDebugToggle(listener: DebugToggleListener): () => void;
  */
 declare function initDebugShortcut(): () => void;
 
+/**
+ * Shared field-name + value formatting — the single owner of the humanize and
+ * format vocabulary previously duplicated across DataTable, DataGrid, CardGrid,
+ * DataList, TableView, DetailPanel, List, and UISlotRenderer.
+ */
+
+type ValueFormat = 'none' | 'date' | 'time' | 'datetime' | 'number' | 'currency' | 'percent' | 'boolean';
+/**
+ * Convert a camelCase, PascalCase, ALLCAPS, snake_case, or kebab-case field
+ * name to a human-readable header: "estimatedDelivery" → "Estimated Delivery",
+ * "PURCHASEPRICE" → "Purchase Price", "is_active" → "Is Active".
+ */
+declare function humanizeFieldName(name: string): string;
+/**
+ * Badge/label-position enum values: a lowercase token chain joined by `_` or
+ * `-` renders as spaced Title Case ("checked_in" → "Checked In"). Any other
+ * shape (ids, emails, mixed case, single words) passes through unchanged —
+ * a stated formatting contract, applied only where call sites opt in.
+ */
+declare function humanizeEnumValue(value: string): string;
+declare function formatDate(value: FieldValue | undefined): string;
+declare function formatTime(value: FieldValue | undefined): string;
+declare function formatDateTime(value: FieldValue | undefined): string;
+/**
+ * Format a field value for display. Booleans always render Yes/No regardless
+ * of the declared format (a raw `true`/`false` cell is never intended output).
+ */
+declare function formatValue(value: FieldValue | undefined, format?: string): string;
+
 /**
  * Get Nested Value Utility
  *
@@ -502,4 +531,4 @@ declare function eightPointedStarPath(cx: number, cy: number, outerR: number, in
  */
 declare function arrowheadPath(size: number): string;
 
-export { ApiError, type DebugEvent, type DebugEventType, type EntitySnapshot, type EntityState, type GuardContext, type GuardEvaluation, JAZARI_COLORS, type JazariArmLayout, type JazariEffectInfo, type JazariGearLayout, type JazariGuardInfo, type JazariLayout, type LayoutInput, type LayoutState, type LayoutTransition, type PersistentEntityInfo, type RuntimeEntity, type TickExecution, type TraitDebugInfo, type TraitGuard, type TraitTransition, apiClient, arrowheadPath, brainIconPath, clearDebugEvents, clearEntityProvider, clearGuardHistory, clearTicks, clearTraits, computeJazariLayout, debug, debugCollision, debugError, debugGameState, debugGroup, debugGroupEnd, debugInput, debugPhysics, debugTable, debugTime, debugTimeEnd, debugWarn, eightPointedStarPath, formatNestedFieldLabel, gearTeethPath, getAllTicks, getAllTraits, getDebugEvents, getEntitiesByType, getEntityById, getEntitySnapshot, getEventsBySource, getEventsByType, getGuardEvaluationsForTrait, getGuardHistory, getNestedValue, getRecentEvents, getRecentGuardEvaluations, getTick, getTrait, initDebugShortcut, isDebugEnabled, lockIconPath, logDebugEvent, logEffectExecuted, logError, logEventFired, logInfo, logStateChange, logWarning, onDebugToggle, pipeIconPath, recordGuardEvaluation, registerTick, registerTrait, setDebugEnabled, setEntityProvider, setTickActive, subscribeToDebugEvents, subscribeToGuardChanges, subscribeToTickChanges, subscribeToTraitChanges, toggleDebug, unregisterTick, unregisterTrait, updateGuardResult, updateTickExecution, updateTraitState };
+export { ApiError, type DebugEvent, type DebugEventType, type EntitySnapshot, type EntityState, type GuardContext, type GuardEvaluation, JAZARI_COLORS, type JazariArmLayout, type JazariEffectInfo, type JazariGearLayout, type JazariGuardInfo, type JazariLayout, type LayoutInput, type LayoutState, type LayoutTransition, type PersistentEntityInfo, type RuntimeEntity, type TickExecution, type TraitDebugInfo, type TraitGuard, type TraitTransition, type ValueFormat, apiClient, arrowheadPath, brainIconPath, clearDebugEvents, clearEntityProvider, clearGuardHistory, clearTicks, clearTraits, computeJazariLayout, debug, debugCollision, debugError, debugGameState, debugGroup, debugGroupEnd, debugInput, debugPhysics, debugTable, debugTime, debugTimeEnd, debugWarn, eightPointedStarPath, formatDate, formatDateTime, formatNestedFieldLabel, formatTime, formatValue, gearTeethPath, getAllTicks, getAllTraits, getDebugEvents, getEntitiesByType, getEntityById, getEntitySnapshot, getEventsBySource, getEventsByType, getGuardEvaluationsForTrait, getGuardHistory, getNestedValue, getRecentEvents, getRecentGuardEvaluations, getTick, getTrait, humanizeEnumValue, humanizeFieldName, initDebugShortcut, isDebugEnabled, lockIconPath, logDebugEvent, logEffectExecuted, logError, logEventFired, logInfo, logStateChange, logWarning, onDebugToggle, pipeIconPath, recordGuardEvaluation, registerTick, registerTrait, setDebugEnabled, setEntityProvider, setTickActive, subscribeToDebugEvents, subscribeToGuardChanges, subscribeToTickChanges, subscribeToTraitChanges, toggleDebug, unregisterTick, unregisterTrait, updateGuardResult, updateTickExecution, updateTraitState };

package/dist/lib/index.d.ts

@@ -283,6 +283,35 @@ declare function onDebugToggle(listener: DebugToggleListener): () => void;
  */
 declare function initDebugShortcut(): () => void;
 
+/**
+ * Shared field-name + value formatting — the single owner of the humanize and
+ * format vocabulary previously duplicated across DataTable, DataGrid, CardGrid,
+ * DataList, TableView, DetailPanel, List, and UISlotRenderer.
+ */
+
+type ValueFormat = 'none' | 'date' | 'time' | 'datetime' | 'number' | 'currency' | 'percent' | 'boolean';
+/**
+ * Convert a camelCase, PascalCase, ALLCAPS, snake_case, or kebab-case field
+ * name to a human-readable header: "estimatedDelivery" → "Estimated Delivery",
+ * "PURCHASEPRICE" → "Purchase Price", "is_active" → "Is Active".
+ */
+declare function humanizeFieldName(name: string): string;
+/**
+ * Badge/label-position enum values: a lowercase token chain joined by `_` or
+ * `-` renders as spaced Title Case ("checked_in" → "Checked In"). Any other
+ * shape (ids, emails, mixed case, single words) passes through unchanged —
+ * a stated formatting contract, applied only where call sites opt in.
+ */
+declare function humanizeEnumValue(value: string): string;
+declare function formatDate(value: FieldValue | undefined): string;
+declare function formatTime(value: FieldValue | undefined): string;
+declare function formatDateTime(value: FieldValue | undefined): string;
+/**
+ * Format a field value for display. Booleans always render Yes/No regardless
+ * of the declared format (a raw `true`/`false` cell is never intended output).
+ */
+declare function formatValue(value: FieldValue | undefined, format?: string): string;
+
 /**
  * Get Nested Value Utility
  *
@@ -502,4 +531,4 @@ declare function eightPointedStarPath(cx: number, cy: number, outerR: number, in
  */
 declare function arrowheadPath(size: number): string;
 
-export { ApiError, type DebugEvent, type DebugEventType, type EntitySnapshot, type EntityState, type GuardContext, type GuardEvaluation, JAZARI_COLORS, type JazariArmLayout, type JazariEffectInfo, type JazariGearLayout, type JazariGuardInfo, type JazariLayout, type LayoutInput, type LayoutState, type LayoutTransition, type PersistentEntityInfo, type RuntimeEntity, type TickExecution, type TraitDebugInfo, type TraitGuard, type TraitTransition, apiClient, arrowheadPath, brainIconPath, clearDebugEvents, clearEntityProvider, clearGuardHistory, clearTicks, clearTraits, computeJazariLayout, debug, debugCollision, debugError, debugGameState, debugGroup, debugGroupEnd, debugInput, debugPhysics, debugTable, debugTime, debugTimeEnd, debugWarn, eightPointedStarPath, formatNestedFieldLabel, gearTeethPath, getAllTicks, getAllTraits, getDebugEvents, getEntitiesByType, getEntityById, getEntitySnapshot, getEventsBySource, getEventsByType, getGuardEvaluationsForTrait, getGuardHistory, getNestedValue, getRecentEvents, getRecentGuardEvaluations, getTick, getTrait, initDebugShortcut, isDebugEnabled, lockIconPath, logDebugEvent, logEffectExecuted, logError, logEventFired, logInfo, logStateChange, logWarning, onDebugToggle, pipeIconPath, recordGuardEvaluation, registerTick, registerTrait, setDebugEnabled, setEntityProvider, setTickActive, subscribeToDebugEvents, subscribeToGuardChanges, subscribeToTickChanges, subscribeToTraitChanges, toggleDebug, unregisterTick, unregisterTrait, updateGuardResult, updateTickExecution, updateTraitState };
+export { ApiError, type DebugEvent, type DebugEventType, type EntitySnapshot, type EntityState, type GuardContext, type GuardEvaluation, JAZARI_COLORS, type JazariArmLayout, type JazariEffectInfo, type JazariGearLayout, type JazariGuardInfo, type JazariLayout, type LayoutInput, type LayoutState, type LayoutTransition, type PersistentEntityInfo, type RuntimeEntity, type TickExecution, type TraitDebugInfo, type TraitGuard, type TraitTransition, type ValueFormat, apiClient, arrowheadPath, brainIconPath, clearDebugEvents, clearEntityProvider, clearGuardHistory, clearTicks, clearTraits, computeJazariLayout, debug, debugCollision, debugError, debugGameState, debugGroup, debugGroupEnd, debugInput, debugPhysics, debugTable, debugTime, debugTimeEnd, debugWarn, eightPointedStarPath, formatDate, formatDateTime, formatNestedFieldLabel, formatTime, formatValue, gearTeethPath, getAllTicks, getAllTraits, getDebugEvents, getEntitiesByType, getEntityById, getEntitySnapshot, getEventsBySource, getEventsByType, getGuardEvaluationsForTrait, getGuardHistory, getNestedValue, getRecentEvents, getRecentGuardEvaluations, getTick, getTrait, humanizeEnumValue, humanizeFieldName, initDebugShortcut, isDebugEnabled, lockIconPath, logDebugEvent, logEffectExecuted, logError, logEventFired, logInfo, logStateChange, logWarning, onDebugToggle, pipeIconPath, recordGuardEvaluation, registerTick, registerTrait, setDebugEnabled, setEntityProvider, setTickActive, subscribeToDebugEvents, subscribeToGuardChanges, subscribeToTickChanges, subscribeToTraitChanges, toggleDebug, unregisterTick, unregisterTrait, updateGuardResult, updateTickExecution, updateTraitState };

package/dist/lib/index.js

@@ -788,6 +788,57 @@ function clearVerification() {
 }
 exposeOnWindow();
 
+// lib/format.ts
+function humanizeFieldName(name) {
+  return name.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/([A-Z]+)([A-Z][a-z])/g, "$1 $2").replace(/[_-]/g, " ").replace(/\b\w/g, (c) => c.toUpperCase()).replace(/\b([A-Z])([A-Z]+)\b/g, (_, first, rest) => first + rest.toLowerCase()).trim();
+}
+function humanizeEnumValue(value) {
+  return /^[a-z0-9]+(?:[_-][a-z0-9]+)+$/.test(value) ? humanizeFieldName(value) : value;
+}
+function formatDate(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
+}
+function formatTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleTimeString(void 0, { hour: "numeric", minute: "2-digit" });
+}
+function formatDateTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return `${formatDate(value)} ${formatTime(value)}`;
+}
+function asYesNo(value) {
+  return value === false || value === 0 || String(value) === "false" ? "No" : "Yes";
+}
+function formatValue(value, format) {
+  if (value === void 0 || value === null) return "";
+  if (typeof value === "boolean") return asYesNo(value);
+  switch (format) {
+    case "date":
+      return formatDate(value);
+    case "time":
+      return formatTime(value);
+    case "datetime":
+      return formatDateTime(value);
+    case "currency":
+      return typeof value === "number" ? `$${value.toFixed(2)}` : String(value);
+    case "number":
+      return typeof value === "number" ? value.toLocaleString() : String(value);
+    case "percent":
+      return typeof value === "number" ? `${Math.round(value)}%` : String(value);
+    case "boolean":
+      return asYesNo(value);
+    default:
+      return String(value);
+  }
+}
+
 // lib/getNestedValue.ts
 function getNestedValue(obj, path) {
   if (obj === null || obj === void 0 || !path) {
@@ -1844,4 +1895,4 @@ var JAZARI_COLORS = {
   darkBg: "#1a1a2e"
 };
 
-export { ApiError, DEFAULT_CONFIG, JAZARI_COLORS, apiClient, arrowheadPath, bindCanvasCapture, bindEventBus, bindLastDrawables, bindTraitStateGetter, brainIconPath, clearDebugEvents, clearEntityProvider, clearGuardHistory, clearTicks, clearTraits, clearVerification, cn, computeJazariLayout, debug, debugCollision, debugError, debugGameState, debugGroup, debugGroupEnd, debugInput, debugPhysics, debugTable, debugTime, debugTimeEnd, debugWarn, eightPointedStarPath, extractOutputsFromTransitions, extractStateMachine, formatGuard, formatNestedFieldLabel, gearTeethPath, getAllChecks, getAllTicks, getAllTraits, getBridgeHealth, getDebugEvents, getEffectSummary, getEntitiesByType, getEntityById, getEntitySnapshot, getEventsBySource, getEventsByType, getGuardEvaluationsForTrait, getGuardHistory, getNestedValue, getRecentEvents, getRecentGuardEvaluations, getSnapshot, getSummary, getTick, getTrait, getTraitSnapshots, getTransitions, getTransitionsForTrait, initDebugShortcut, isDebugEnabled, lockIconPath, logDebugEvent, logEffectExecuted, logError, logEventFired, logInfo, logStateChange, logWarning, onDebugToggle, parseContentSegments, parseMarkdownWithCodeBlocks, pipeIconPath, recordGuardEvaluation, recordServerResponse, recordTransition, registerCheck, registerTick, registerTrait, registerTraitSnapshot, renderStateMachineToDomData, renderStateMachineToSvg, setDebugEnabled, setEntityProvider, setTickActive, subscribeToDebugEvents, subscribeToGuardChanges, subscribeToTickChanges, subscribeToTraitChanges, subscribeToVerification, toggleDebug, unregisterTick, unregisterTrait, updateAssetStatus, updateBridgeHealth, updateCheck, updateGuardResult, updateTickExecution, updateTraitState, waitForTransition };
+export { ApiError, DEFAULT_CONFIG, JAZARI_COLORS, apiClient, arrowheadPath, bindCanvasCapture, bindEventBus, bindLastDrawables, bindTraitStateGetter, brainIconPath, clearDebugEvents, clearEntityProvider, clearGuardHistory, clearTicks, clearTraits, clearVerification, cn, computeJazariLayout, debug, debugCollision, debugError, debugGameState, debugGroup, debugGroupEnd, debugInput, debugPhysics, debugTable, debugTime, debugTimeEnd, debugWarn, eightPointedStarPath, extractOutputsFromTransitions, extractStateMachine, formatDate, formatDateTime, formatGuard, formatNestedFieldLabel, formatTime, formatValue, gearTeethPath, getAllChecks, getAllTicks, getAllTraits, getBridgeHealth, getDebugEvents, getEffectSummary, getEntitiesByType, getEntityById, getEntitySnapshot, getEventsBySource, getEventsByType, getGuardEvaluationsForTrait, getGuardHistory, getNestedValue, getRecentEvents, getRecentGuardEvaluations, getSnapshot, getSummary, getTick, getTrait, getTraitSnapshots, getTransitions, getTransitionsForTrait, humanizeEnumValue, humanizeFieldName, initDebugShortcut, isDebugEnabled, lockIconPath, logDebugEvent, logEffectExecuted, logError, logEventFired, logInfo, logStateChange, logWarning, onDebugToggle, parseContentSegments, parseMarkdownWithCodeBlocks, pipeIconPath, recordGuardEvaluation, recordServerResponse, recordTransition, registerCheck, registerTick, registerTrait, registerTraitSnapshot, renderStateMachineToDomData, renderStateMachineToSvg, setDebugEnabled, setEntityProvider, setTickActive, subscribeToDebugEvents, subscribeToGuardChanges, subscribeToTickChanges, subscribeToTraitChanges, subscribeToVerification, toggleDebug, unregisterTick, unregisterTrait, updateAssetStatus, updateBridgeHealth, updateCheck, updateGuardResult, updateTickExecution, updateTraitState, waitForTransition };

package/dist/marketing/index.cjs

@@ -2958,6 +2958,53 @@ var Stack = ({
 };
 var VStack = (props) => /* @__PURE__ */ jsxRuntime.jsx(Stack, { direction: "vertical", ...props });
 var HStack = (props) => /* @__PURE__ */ jsxRuntime.jsx(Stack, { direction: "horizontal", ...props });
+
+// lib/format.ts
+function formatDate(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
+}
+function formatTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleTimeString(void 0, { hour: "numeric", minute: "2-digit" });
+}
+function formatDateTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return `${formatDate(value)} ${formatTime(value)}`;
+}
+function asYesNo(value) {
+  return value === false || value === 0 || String(value) === "false" ? "No" : "Yes";
+}
+function formatValue(value, format) {
+  if (value === void 0 || value === null) return "";
+  if (typeof value === "boolean") return asYesNo(value);
+  switch (format) {
+    case "date":
+      return formatDate(value);
+    case "time":
+      return formatTime(value);
+    case "datetime":
+      return formatDateTime(value);
+    case "currency":
+      return typeof value === "number" ? `$${value.toFixed(2)}` : String(value);
+    case "number":
+      return typeof value === "number" ? value.toLocaleString() : String(value);
+    case "percent":
+      return typeof value === "number" ? `${Math.round(value)}%` : String(value);
+    case "boolean":
+      return asYesNo(value);
+    default:
+      return String(value);
+  }
+}
+
+// components/core/atoms/Typography.tsx
 var variantStyles = {
   h1: "text-4xl font-bold tracking-tight text-foreground",
   h2: "text-3xl font-bold tracking-tight text-foreground",
@@ -3045,11 +3092,16 @@ var Typography = ({
   id,
   className,
   style,
+  format,
   content,
   children
 }) => {
   const variant = variantProp ?? (level ? `h${level}` : "body1");
   const Component = as || defaultElements[variant];
+  let body = children ?? content;
+  if (format !== void 0 && format !== "none" && (typeof body === "string" || typeof body === "number" || body instanceof Date)) {
+    body = formatValue(body, format);
+  }
   return React12__namespace.default.createElement(
     Component,
     {
@@ -3066,7 +3118,7 @@ var Typography = ({
       ),
       style
     },
-    children ?? content
+    body
   );
 };
 Typography.displayName = "Typography";

package/dist/marketing/index.d.cts

@@ -165,6 +165,12 @@ interface TypographyProps {
     className?: string;
     /** Inline style */
     style?: React.CSSProperties;
+    /**
+     * Value formatting applied to string/number/Date content — `none` (the
+     * default) renders content as-is. Covers the raw-ISO-date class: a bound
+     * datetime renders human-readable via `format="date"|"time"|"datetime"`.
+     */
+    format?: "none" | "date" | "time" | "datetime" | "number" | "currency" | "percent";
     /** Text content (alternative to children) */
     content?: React.ReactNode;
     /** Children elements */

package/dist/marketing/index.d.ts

@@ -165,6 +165,12 @@ interface TypographyProps {
     className?: string;
     /** Inline style */
     style?: React.CSSProperties;
+    /**
+     * Value formatting applied to string/number/Date content — `none` (the
+     * default) renders content as-is. Covers the raw-ISO-date class: a bound
+     * datetime renders human-readable via `format="date"|"time"|"datetime"`.
+     */
+    format?: "none" | "date" | "time" | "datetime" | "number" | "currency" | "percent";
     /** Text content (alternative to children) */
     content?: React.ReactNode;
     /** Children elements */

package/dist/marketing/index.js

@@ -2937,6 +2937,53 @@ var Stack = ({
 };
 var VStack = (props) => /* @__PURE__ */ jsx(Stack, { direction: "vertical", ...props });
 var HStack = (props) => /* @__PURE__ */ jsx(Stack, { direction: "horizontal", ...props });
+
+// lib/format.ts
+function formatDate(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
+}
+function formatTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return d.toLocaleTimeString(void 0, { hour: "numeric", minute: "2-digit" });
+}
+function formatDateTime(value) {
+  if (!value) return "";
+  const d = new Date(String(value));
+  if (isNaN(d.getTime())) return String(value);
+  return `${formatDate(value)} ${formatTime(value)}`;
+}
+function asYesNo(value) {
+  return value === false || value === 0 || String(value) === "false" ? "No" : "Yes";
+}
+function formatValue(value, format) {
+  if (value === void 0 || value === null) return "";
+  if (typeof value === "boolean") return asYesNo(value);
+  switch (format) {
+    case "date":
+      return formatDate(value);
+    case "time":
+      return formatTime(value);
+    case "datetime":
+      return formatDateTime(value);
+    case "currency":
+      return typeof value === "number" ? `$${value.toFixed(2)}` : String(value);
+    case "number":
+      return typeof value === "number" ? value.toLocaleString() : String(value);
+    case "percent":
+      return typeof value === "number" ? `${Math.round(value)}%` : String(value);
+    case "boolean":
+      return asYesNo(value);
+    default:
+      return String(value);
+  }
+}
+
+// components/core/atoms/Typography.tsx
 var variantStyles = {
   h1: "text-4xl font-bold tracking-tight text-foreground",
   h2: "text-3xl font-bold tracking-tight text-foreground",
@@ -3024,11 +3071,16 @@ var Typography = ({
   id,
   className,
   style,
+  format,
   content,
   children
 }) => {
   const variant = variantProp ?? (level ? `h${level}` : "body1");
   const Component = as || defaultElements[variant];
+  let body = children ?? content;
+  if (format !== void 0 && format !== "none" && (typeof body === "string" || typeof body === "number" || body instanceof Date)) {
+    body = formatValue(body, format);
+  }
   return React12__default.createElement(
     Component,
     {
@@ -3045,7 +3097,7 @@ var Typography = ({
       ),
       style
     },
-    children ?? content
+    body
   );
 };
 Typography.displayName = "Typography";