@photon-ai/pho-ui 4.6.1 → 4.7.0

package/dist/chunks/{message-CTml-TrB.js → message-Dz2-numf.js}

@@ -1,17 +1,17 @@
 "use client";
 import { t as r } from "./cn-ChIgwEl3.js";
-import { createContext as l, useContext as d } from "react";
+import { createContext as f, useContext as m } from "react";
 import { jsx as s } from "react/jsx-runtime";
-var i = l("start");
-function m({ className: e, ...a }) {
+var u = f("start");
+function g({ className: e, ...a }) {
   return /* @__PURE__ */ s("div", {
     "data-message-group": "",
     className: r("flex min-w-0 flex-col gap-2", e),
     ...a
   });
 }
-function f({ align: e = "start", className: a, ...t }) {
-  return /* @__PURE__ */ s(i.Provider, {
+function c({ align: e = "start", className: a, ...t }) {
+  return /* @__PURE__ */ s(u.Provider, {
     value: e,
     children: /* @__PURE__ */ s("div", {
       "data-message": "",
@@ -21,69 +21,72 @@ function f({ align: e = "start", className: a, ...t }) {
     })
   });
 }
-function g({ className: e, ...a }) {
+function x({ className: e, ...a }) {
   return /* @__PURE__ */ s("div", {
     "data-message-avatar": "",
     className: r("flex shrink-0 self-end group-has-[[data-message-footer]]/message:-translate-y-[1.375rem]", e),
     ...a
   });
 }
-function c({ className: e, ...a }) {
-  const t = d(i);
+function p({ className: e, ...a }) {
+  const t = m(u);
   return /* @__PURE__ */ s("div", {
     "data-message-content": "",
     className: r("grid w-max max-w-full flex-none items-end gap-x-1.5 gap-y-1 break-words", "[&>[data-message-header]]:[grid-area:header]", "[&>[data-bubble]]:max-w-[80cqw] [&>[data-bubble]]:[grid-area:main]", "[&>[data-bubble-group]]:max-w-[80cqw] [&>[data-bubble-group]]:[grid-area:main]", "[&>[data-bubble][data-variant=ghost]]:max-w-full", "[&>[data-message-time]]:[grid-area:time]", "[&>[data-message-footer]]:[grid-area:status]", t === "end" ? "ml-auto grid-cols-[auto_minmax(0,max-content)] [grid-template-areas:'._header'_'time_main'_'._status'] [&>[data-bubble-group]]:justify-self-end [&>[data-bubble]]:justify-self-end [&>[data-message-header]]:justify-self-end" : "grid-cols-[minmax(0,max-content)_auto] [grid-template-areas:'header_.'_'main_time'_'status_.'] [&>[data-bubble-group]]:justify-self-start [&>[data-bubble]]:justify-self-start", e),
     ...a
   });
 }
-function p({ className: e, ...a }) {
+function b({ className: e, ...a }) {
   return /* @__PURE__ */ s("div", {
     "data-message-header": "",
     className: r("text-pho-secondary flex w-full max-w-full min-w-0 items-center gap-1.5 px-1 text-xs font-medium group-has-[[data-bubble][data-variant=ghost]]/message:px-0", e),
     ...a
   });
 }
-function x({ className: e, ...a }) {
+function h({ className: e, ...a }) {
   return /* @__PURE__ */ s("div", {
     "data-message-time": "",
     className: r("text-pho-description shrink-0 self-end text-xs whitespace-nowrap tabular-nums opacity-0 transition-opacity duration-100 ease-linear group-focus-within/message:opacity-100 group-hover/message:opacity-100", e),
     ...a
   });
 }
-function b({ className: e, ...a }) {
-  const t = d(i);
+function w({ className: e, ...a }) {
+  const t = m(u);
   return /* @__PURE__ */ s("div", {
     "data-message-footer": "",
     className: r("text-pho-description flex max-w-full min-w-0 items-center gap-1.5 px-1 text-xs group-has-[[data-bubble][data-variant=ghost]]/message:px-0", t === "end" && "justify-self-end", e),
     ...a
   });
 }
-var y = {
-  Root: f,
-  Group: m,
-  Avatar: g,
-  Content: c,
-  Header: p,
-  Time: x,
-  Footer: b
+var j = {
+  Root: c,
+  Group: g,
+  Avatar: x,
+  Content: p,
+  Header: b,
+  Time: h,
+  Footer: w
 };
-function u(e, a) {
+function d(e, a) {
   if (!e || a == null) return null;
   const t = a.trim().toLowerCase(), n = t.split(/[\s.]+/)[0];
   return n ? n === "failed" ? t : n : null;
 }
-function _(e, a) {
+function N(e, a) {
   const t = e[a];
   if (!t) return !1;
-  const n = u(t.outbound === !0, t.status);
+  const n = d(t.outbound === !0, t.status);
   if (n == null) return !1;
-  const o = e[a + 1];
-  return o ? u(o.outbound === !0, o.status) !== n : !0;
+  for (let o = a + 1; o < e.length; o++) {
+    const i = e[o], l = d(i?.outbound === !0, i?.status);
+    if (l != null) return l !== n;
+  }
+  return !0;
 }
 export {
-  _ as n,
-  y as r,
-  u as t
+  N as n,
+  j as r,
+  d as t
 };
 
-//# sourceMappingURL=message-CTml-TrB.js.map
+//# sourceMappingURL=message-Dz2-numf.js.map

package/dist/chunks/{message-CTml-TrB.js.map → message-Dz2-numf.js.map}

@@ -1 +1 @@
-{"version":3,"file":"message-CTml-TrB.js","names":[],"sources":["../../src/components/message/message.tsx","../../src/components/message/message-status.ts"],"sourcesContent":["import { createContext, useContext, type ComponentProps } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Message — one turn in a thread: the row that seats an avatar beside a\n * column of header, bubble, and footer, on the author's side. It owns the\n * row layout and nothing else: the surface is `Bubble`'s, the scrolling\n * and the composer are `Chat`'s.\n *\n * Design notes:\n * - `align=\"end\"` mirrors the row — avatar on the right, column\n *   right-aligned — for the reader's own messages.\n * - The avatar sits at the row's bottom, level with the bubble. When a\n *   `Footer` (status) sits under the bubble, the avatar shifts up by one\n *   line so it stays beside the surface.\n * - `Time` sits beside the bubble, last-line aligned — right of inbound,\n *   left of outbound — and is invisible until the row is hovered or\n *   focused. `Footer` is the status caption under the bubble (Delivered,\n *   Failed). Inbound has no status.\n */\n\nexport type MessageAlign = \"start\" | \"end\";\n\nconst MessageContext = createContext<MessageAlign>(\"start\");\n\n/* --------------------------------- group -------------------------------- */\n\n/** Consecutive messages from one author, spaced as one turn. */\nfunction Group({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-group=\"\"\n      className={cn(\"flex min-w-0 flex-col gap-2\", className)}\n      {...props}\n    />\n  );\n}\n\n/* --------------------------------- root --------------------------------- */\n\nexport interface MessageRootProps extends ComponentProps<\"div\"> {\n  /** Which side the author sits on. @default \"start\" */\n  align?: MessageAlign;\n}\n\n/** The row: avatar beside the content column, mirrored for `end`. */\nfunction Root({ align = \"start\", className, ...props }: MessageRootProps) {\n  return (\n    <MessageContext.Provider value={align}>\n      <div\n        data-message=\"\"\n        data-align={align}\n        className={cn(\n          \"group/message @container relative flex w-full min-w-0 gap-2 text-base\",\n          align === \"end\" && \"flex-row-reverse\",\n          className,\n        )}\n        {...props}\n      />\n    </MessageContext.Provider>\n  );\n}\n\n/* -------------------------------- avatar -------------------------------- */\n\n/**\n * The avatar's seat — pass an `Avatar.Root`. Bottom-aligned with the\n * bubble; lifts by one footer line when the message has a `Footer`.\n */\nfunction Avatar({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-avatar=\"\"\n      className={cn(\n        // Footer line = xs line-height (18px) + the column's 4px gap.\n        \"flex shrink-0 self-end group-has-[[data-message-footer]]/message:-translate-y-[1.375rem]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/* -------------------------------- content ------------------------------- */\n\n/**\n * Header over the bubble; time beside it; status under it. Inbound is\n * `[bubble][time]`. Outbound is `[time][bubble]` with `Footer` below\n * the bubble column.\n */\nfunction Content({ className, ...props }: ComponentProps<\"div\">) {\n  const align = useContext(MessageContext);\n  return (\n    <div\n      data-message-content=\"\"\n      className={cn(\n        \"grid w-max max-w-full flex-none items-end gap-x-1.5 gap-y-1 break-words\",\n        \"[&>[data-message-header]]:[grid-area:header]\",\n        \"[&>[data-bubble]]:max-w-[80cqw] [&>[data-bubble]]:[grid-area:main]\",\n        \"[&>[data-bubble-group]]:max-w-[80cqw] [&>[data-bubble-group]]:[grid-area:main]\",\n        \"[&>[data-bubble][data-variant=ghost]]:max-w-full\",\n        \"[&>[data-message-time]]:[grid-area:time]\",\n        \"[&>[data-message-footer]]:[grid-area:status]\",\n        align === \"end\"\n          ? \"ml-auto grid-cols-[auto_minmax(0,max-content)] [grid-template-areas:'._header'_'time_main'_'._status'] [&>[data-bubble-group]]:justify-self-end [&>[data-bubble]]:justify-self-end [&>[data-message-header]]:justify-self-end\"\n          : \"grid-cols-[minmax(0,max-content)_auto] [grid-template-areas:'header_.'_'main_time'_'status_.'] [&>[data-bubble-group]]:justify-self-start [&>[data-bubble]]:justify-self-start\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Who — the sender's name over the bubble, secondary ink. */\nfunction Header({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-header=\"\"\n      className={cn(\n        \"text-pho-secondary flex w-full max-w-full min-w-0 items-center gap-1.5 px-1 text-xs font-medium group-has-[[data-bubble][data-variant=ghost]]/message:px-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Clock beside the bubble, last-line aligned. Description ink, tabular.\n * Inbound sits to the right; outbound to the left. The slot stays in\n * layout; the digits show when the row is hovered or focused.\n */\nfunction Time({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-time=\"\"\n      className={cn(\n        \"text-pho-description shrink-0 self-end text-xs whitespace-nowrap tabular-nums opacity-0 transition-opacity duration-100 ease-linear group-focus-within/message:opacity-100 group-hover/message:opacity-100\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Status under the bubble — Delivered, Failed. Inbound leaves it off.\n * Description ink.\n */\nfunction Footer({ className, ...props }: ComponentProps<\"div\">) {\n  const align = useContext(MessageContext);\n  return (\n    <div\n      data-message-footer=\"\"\n      className={cn(\n        \"text-pho-description flex max-w-full min-w-0 items-center gap-1.5 px-1 text-xs group-has-[[data-bubble][data-variant=ghost]]/message:px-0\",\n        align === \"end\" && \"justify-self-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * A turn in a thread. `Root` takes `align`; `Avatar` seats an\n * `Avatar.Root`; `Content` places `Header` over the bubble, `Time`\n * beside it, and `Footer` under it.\n *\n * ```tsx\n * <Message.Root align=\"end\">\n *   <Message.Content>\n *     <Bubble.Root variant=\"inverse\" align=\"end\">\n *       <Bubble.Content>On my way.</Bubble.Content>\n *     </Bubble.Root>\n *     <Message.Time>2:47 PM</Message.Time>\n *     <Message.Footer>Delivered.</Message.Footer>\n *   </Message.Content>\n * </Message.Root>\n * ```\n */\nexport const Message = { Root, Group, Avatar, Content, Header, Time, Footer };\n","/**\n * One row in a thread, enough to decide whether its outbound status\n * caption should show. Inbound rows leave `outbound` off.\n */\nexport interface MessageStatusItem {\n  outbound?: boolean;\n  /** Delivered, Sent, Failed — or a token like `delivered`. */\n  status?: string | null;\n}\n\n/**\n * The coalesce key for a row: outbound status word, lowercased. Inbound\n * and empty statuses are `null`, so they break a run. A failure keeps its\n * whole text (`failed. 30007`) so two different error codes never\n * collapse into one caption.\n */\nexport function messageStatusKey(\n  outbound: boolean,\n  status: string | null | undefined,\n): string | null {\n  if (!outbound || status == null) return null;\n  const text = status.trim().toLowerCase();\n  const word = text.split(/[\\s.]+/)[0];\n  if (!word) return null;\n  return word === \"failed\" ? text : word;\n}\n\n/**\n * Whether this row should render its outbound status (Delivered, Sent,\n * Failed). Only the last message in a consecutive same-status run shows\n * it. Inbound never does.\n */\nexport function shouldShowMessageStatus(\n  messages: readonly MessageStatusItem[],\n  index: number,\n): boolean {\n  const current = messages[index];\n  if (!current) return false;\n  const key = messageStatusKey(current.outbound === true, current.status);\n  if (key == null) return false;\n  const next = messages[index + 1];\n  if (!next) return true;\n  return messageStatusKey(next.outbound === true, next.status) !== key;\n}\n"],"mappings":";;;;AAuBA,IAAM,IAAiB,EAA4B,OAAO;AAK1D,SAAS,EAAM,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC7D,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,sBAAmB;AAAA,IACnB,WAAW,EAAG,+BAA+B,CAAS;AAAA,IACtD,GAAI;AAAA,EACL,CAAA;AAEL;AAUA,SAAS,EAAK,EAAE,OAAA,IAAQ,SAAS,WAAA,GAAW,GAAG,EAAA,GAA2B;AACxE,SACE,gBAAA,EAAC,EAAe,UAAhB;AAAA,IAAyB,OAAO;AAAA,IAC9B,UAAA,gBAAA,EAAC,OAAD;AAAA,MACE,gBAAa;AAAA,MACb,cAAY;AAAA,MACZ,WAAW,EACT,yEACA,MAAU,SAAS,oBACnB,CACF;AAAA,MACA,GAAI;AAAA,IACL,CAAA;AAAA,EACsB,CAAA;AAE7B;AAQA,SAAS,EAAO,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC9D,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,uBAAoB;AAAA,IACpB,WAAW,EAET,4FACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AASA,SAAS,EAAQ,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC/D,QAAM,IAAQ,EAAW,CAAc;AACvC,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,wBAAqB;AAAA,IACrB,WAAW,EACT,2EACA,gDACA,sEACA,kFACA,oDACA,4CACA,gDACA,MAAU,QACN,kOACA,kLACJ,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAGA,SAAS,EAAO,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC9D,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,uBAAoB;AAAA,IACpB,WAAW,EACT,8JACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAOA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC5D,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,qBAAkB;AAAA,IAClB,WAAW,EACT,8MACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAMA,SAAS,EAAO,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC9D,QAAM,IAAQ,EAAW,CAAc;AACvC,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,uBAAoB;AAAA,IACpB,WAAW,EACT,6IACA,MAAU,SAAS,oBACnB,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAmBA,IAAa,IAAU;AAAA,EAAE,MAAA;AAAA,EAAM,OAAA;AAAA,EAAO,QAAA;AAAA,EAAQ,SAAA;AAAA,EAAS,QAAA;AAAA,EAAQ,MAAA;AAAA,EAAM,QAAA;AAAO;ACrK5E,SAAgB,EACd,GACA,GACe;AACf,MAAI,CAAC,KAAY,KAAU,KAAM,QAAO;AACxC,QAAM,IAAO,EAAO,KAAK,EAAE,YAAY,GACjC,IAAO,EAAK,MAAM,QAAQ,EAAE,CAAA;AAClC,SAAK,IACE,MAAS,WAAW,IAAO,IADhB;AAEpB;AAOA,SAAgB,EACd,GACA,GACS;AACT,QAAM,IAAU,EAAS,CAAA;AACzB,MAAI,CAAC,EAAS,QAAO;AACrB,QAAM,IAAM,EAAiB,EAAQ,aAAa,IAAM,EAAQ,MAAM;AACtE,MAAI,KAAO,KAAM,QAAO;AACxB,QAAM,IAAO,EAAS,IAAQ,CAAA;AAC9B,SAAK,IACE,EAAiB,EAAK,aAAa,IAAM,EAAK,MAAM,MAAM,IAD/C;AAEpB"}
+{"version":3,"file":"message-Dz2-numf.js","names":[],"sources":["../../src/components/message/message.tsx","../../src/components/message/message-status.ts"],"sourcesContent":["import { createContext, useContext, type ComponentProps } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Message — one turn in a thread: the row that seats an avatar beside a\n * column of header, bubble, and footer, on the author's side. It owns the\n * row layout and nothing else: the surface is `Bubble`'s, the scrolling\n * and the composer are `Chat`'s.\n *\n * Design notes:\n * - `align=\"end\"` mirrors the row — avatar on the right, column\n *   right-aligned — for the reader's own messages.\n * - The avatar sits at the row's bottom, level with the bubble. When a\n *   `Footer` (status) sits under the bubble, the avatar shifts up by one\n *   line so it stays beside the surface.\n * - `Time` sits beside the bubble, last-line aligned — right of inbound,\n *   left of outbound — and is invisible until the row is hovered or\n *   focused. `Footer` is the status caption under the bubble (Delivered,\n *   Failed). Inbound has no status.\n */\n\nexport type MessageAlign = \"start\" | \"end\";\n\nconst MessageContext = createContext<MessageAlign>(\"start\");\n\n/* --------------------------------- group -------------------------------- */\n\n/** Consecutive messages from one author, spaced as one turn. */\nfunction Group({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-group=\"\"\n      className={cn(\"flex min-w-0 flex-col gap-2\", className)}\n      {...props}\n    />\n  );\n}\n\n/* --------------------------------- root --------------------------------- */\n\nexport interface MessageRootProps extends ComponentProps<\"div\"> {\n  /** Which side the author sits on. @default \"start\" */\n  align?: MessageAlign;\n}\n\n/** The row: avatar beside the content column, mirrored for `end`. */\nfunction Root({ align = \"start\", className, ...props }: MessageRootProps) {\n  return (\n    <MessageContext.Provider value={align}>\n      <div\n        data-message=\"\"\n        data-align={align}\n        className={cn(\n          \"group/message @container relative flex w-full min-w-0 gap-2 text-base\",\n          align === \"end\" && \"flex-row-reverse\",\n          className,\n        )}\n        {...props}\n      />\n    </MessageContext.Provider>\n  );\n}\n\n/* -------------------------------- avatar -------------------------------- */\n\n/**\n * The avatar's seat — pass an `Avatar.Root`. Bottom-aligned with the\n * bubble; lifts by one footer line when the message has a `Footer`.\n */\nfunction Avatar({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-avatar=\"\"\n      className={cn(\n        // Footer line = xs line-height (18px) + the column's 4px gap.\n        \"flex shrink-0 self-end group-has-[[data-message-footer]]/message:-translate-y-[1.375rem]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/* -------------------------------- content ------------------------------- */\n\n/**\n * Header over the bubble; time beside it; status under it. Inbound is\n * `[bubble][time]`. Outbound is `[time][bubble]` with `Footer` below\n * the bubble column.\n */\nfunction Content({ className, ...props }: ComponentProps<\"div\">) {\n  const align = useContext(MessageContext);\n  return (\n    <div\n      data-message-content=\"\"\n      className={cn(\n        \"grid w-max max-w-full flex-none items-end gap-x-1.5 gap-y-1 break-words\",\n        \"[&>[data-message-header]]:[grid-area:header]\",\n        \"[&>[data-bubble]]:max-w-[80cqw] [&>[data-bubble]]:[grid-area:main]\",\n        \"[&>[data-bubble-group]]:max-w-[80cqw] [&>[data-bubble-group]]:[grid-area:main]\",\n        \"[&>[data-bubble][data-variant=ghost]]:max-w-full\",\n        \"[&>[data-message-time]]:[grid-area:time]\",\n        \"[&>[data-message-footer]]:[grid-area:status]\",\n        align === \"end\"\n          ? \"ml-auto grid-cols-[auto_minmax(0,max-content)] [grid-template-areas:'._header'_'time_main'_'._status'] [&>[data-bubble-group]]:justify-self-end [&>[data-bubble]]:justify-self-end [&>[data-message-header]]:justify-self-end\"\n          : \"grid-cols-[minmax(0,max-content)_auto] [grid-template-areas:'header_.'_'main_time'_'status_.'] [&>[data-bubble-group]]:justify-self-start [&>[data-bubble]]:justify-self-start\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Who — the sender's name over the bubble, secondary ink. */\nfunction Header({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-header=\"\"\n      className={cn(\n        \"text-pho-secondary flex w-full max-w-full min-w-0 items-center gap-1.5 px-1 text-xs font-medium group-has-[[data-bubble][data-variant=ghost]]/message:px-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Clock beside the bubble, last-line aligned. Description ink, tabular.\n * Inbound sits to the right; outbound to the left. The slot stays in\n * layout; the digits show when the row is hovered or focused.\n */\nfunction Time({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-time=\"\"\n      className={cn(\n        \"text-pho-description shrink-0 self-end text-xs whitespace-nowrap tabular-nums opacity-0 transition-opacity duration-100 ease-linear group-focus-within/message:opacity-100 group-hover/message:opacity-100\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Status under the bubble — Delivered, Failed. Inbound leaves it off.\n * Description ink.\n */\nfunction Footer({ className, ...props }: ComponentProps<\"div\">) {\n  const align = useContext(MessageContext);\n  return (\n    <div\n      data-message-footer=\"\"\n      className={cn(\n        \"text-pho-description flex max-w-full min-w-0 items-center gap-1.5 px-1 text-xs group-has-[[data-bubble][data-variant=ghost]]/message:px-0\",\n        align === \"end\" && \"justify-self-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * A turn in a thread. `Root` takes `align`; `Avatar` seats an\n * `Avatar.Root`; `Content` places `Header` over the bubble, `Time`\n * beside it, and `Footer` under it.\n *\n * ```tsx\n * <Message.Root align=\"end\">\n *   <Message.Content>\n *     <Bubble.Root variant=\"inverse\" align=\"end\">\n *       <Bubble.Content>On my way.</Bubble.Content>\n *     </Bubble.Root>\n *     <Message.Time>2:47 PM</Message.Time>\n *     <Message.Footer>Delivered.</Message.Footer>\n *   </Message.Content>\n * </Message.Root>\n * ```\n */\nexport const Message = { Root, Group, Avatar, Content, Header, Time, Footer };\n","/**\n * One row in a thread, enough to decide whether its outbound status\n * caption should show. Inbound rows leave `outbound` off.\n */\nexport interface MessageStatusItem {\n  outbound?: boolean;\n  /** Delivered, Sent, Failed — or a token like `delivered`. */\n  status?: string | null;\n}\n\n/**\n * The coalesce key for a row: outbound status word, lowercased. Inbound\n * and empty statuses are `null`: they carry no status and sit outside the\n * runs (see `shouldShowMessageStatus`). A failure keeps its\n * whole text (`failed. 30007`) so two different error codes never\n * collapse into one caption.\n */\nexport function messageStatusKey(\n  outbound: boolean,\n  status: string | null | undefined,\n): string | null {\n  if (!outbound || status == null) return null;\n  const text = status.trim().toLowerCase();\n  const word = text.split(/[\\s.]+/)[0];\n  if (!word) return null;\n  return word === \"failed\" ? text : word;\n}\n\n/**\n * Whether this row should render its outbound status (Delivered, Sent,\n * Failed). Only the last message in a same-status run shows it. Inbound\n * never does, and a reply in between does not break the run: the run is\n * over the outbound messages alone, so a conversation going back and forth\n * wears one Delivered, under the latest message it holds for, not one\n * under every turn.\n */\nexport function shouldShowMessageStatus(\n  messages: readonly MessageStatusItem[],\n  index: number,\n): boolean {\n  const current = messages[index];\n  if (!current) return false;\n  const key = messageStatusKey(current.outbound === true, current.status);\n  if (key == null) return false;\n  for (let at = index + 1; at < messages.length; at++) {\n    const next = messages[at];\n    const nextKey = messageStatusKey(next?.outbound === true, next?.status);\n    if (nextKey != null) return nextKey !== key;\n  }\n  return true;\n}\n"],"mappings":"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"}

package/dist/components/message.js

@@ -1,5 +1,5 @@
 "use client";
-import { n as e, r as a, t } from "../chunks/message-CTml-TrB.js";
+import { n as e, r as a, t } from "../chunks/message-Dz2-numf.js";
 export {
   a as Message,
   t as messageStatusKey,

package/dist/index.js

@@ -26,14 +26,14 @@ import { n as gs, t as Ms } from "./chunks/card-N-tvFsuV.js";
 import { n as Fs, t as ks } from "./chunks/dialog-MPvem7yV.js";
 import { i as ws, n as Ws, r as xs, t as ys } from "./chunks/status-view-C8tabjDu.js";
 import { t as Ks } from "./chunks/description-list-8qm83WZB.js";
-import { a as Xs, c as Ys, d as Zs, f as js, i as Js, l as Qs, m as qs, n as $s, o as at, p as st, r as tt, s as rt, t as ot, u as et } from "./chunks/basic-page-C0DvO_Vt.js";
+import { a as Xs, c as Ys, d as Zs, f as js, i as Js, l as Qs, m as qs, n as $s, o as at, p as st, r as tt, s as rt, t as ot, u as et } from "./chunks/basic-page-E_on0m1X.js";
 import { i as Et, n as St, r as _t, t as nt } from "./chunks/legend-C0mU7dqd.js";
 import "./components/chart.js";
 import { t as Tt } from "./chunks/bar-chart-DIALC2_z.js";
 import { t as At } from "./chunks/line-chart-VuMYKzW3.js";
 import { i as lt, n as Ct, r as Bt, t as ft } from "./chunks/log-list-tNuCFGlP.js";
 import { n as Nt, t as Pt } from "./chunks/bubble-eaoLJP4N.js";
-import { n as ct, r as Dt, t as Ot } from "./chunks/message-CTml-TrB.js";
+import { n as ct, r as Dt, t as Ot } from "./chunks/message-Dz2-numf.js";
 export {
   ot as AUTO_SAVE_DELAY_MS,
   n as BAR_RISE_PX,

package/dist/sections/basic-page.js

@@ -1,6 +1,6 @@
 "use client";
 import { a as s } from "../chunks/data-table-Mog6m3d9.js";
-import { a as E, c as a, d as C, f as S, i as I, l as e, m as o, n as B, o as P, p as N, r, s as t, t as D, u as R } from "../chunks/basic-page-C0DvO_Vt.js";
+import { a as E, c as a, d as C, f as S, i as I, l as e, m as o, n as B, o as P, p as N, r, s as t, t as D, u as R } from "../chunks/basic-page-E_on0m1X.js";
 export {
   D as AUTO_SAVE_DELAY_MS,
   B as BASIC_PAGE_CALLOUT,

package/dist/src/components/message/message-status.d.ts

@@ -9,14 +9,18 @@ export interface MessageStatusItem {
 }
 /**
  * The coalesce key for a row: outbound status word, lowercased. Inbound
- * and empty statuses are `null`, so they break a run. A failure keeps its
+ * and empty statuses are `null`: they carry no status and sit outside the
+ * runs (see `shouldShowMessageStatus`). A failure keeps its
  * whole text (`failed. 30007`) so two different error codes never
  * collapse into one caption.
  */
 export declare function messageStatusKey(outbound: boolean, status: string | null | undefined): string | null;
 /**
  * Whether this row should render its outbound status (Delivered, Sent,
- * Failed). Only the last message in a consecutive same-status run shows
- * it. Inbound never does.
+ * Failed). Only the last message in a same-status run shows it. Inbound
+ * never does, and a reply in between does not break the run: the run is
+ * over the outbound messages alone, so a conversation going back and forth
+ * wears one Delivered, under the latest message it holds for, not one
+ * under every turn.
  */
 export declare function shouldShowMessageStatus(messages: readonly MessageStatusItem[], index: number): boolean;

package/dist/src/sections/basic-page/basic-page.d.ts

@@ -95,8 +95,13 @@ export interface BasicPageRootProps extends ComponentProps<"div"> {
      * and its control drift out of one glance. Either width can host an
      * `Aside` — the column keeps its cap beside the panel, and leftover
      * space is margin, not content width.
+     *
+     * `full` takes the cap and the gutters off: the column is the pane, edge
+     * to edge, with no trim under it. For a page that is one surface filling
+     * the pane (an inbox, a board) — pair it with `condense="pinned"`, and
+     * `Stack` sits flush under the bar. Its content brings its own padding.
      */
-    width?: "base" | "wide";
+    width?: "base" | "wide" | "full";
     /**
      * This page was painted before React — rendered to a string and inlined
      * ahead of the bundle (a boot skeleton), or the React twin re-rendering

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@photon-ai/pho-ui",
-  "version": "4.6.1",
+  "version": "4.7.0",
   "description": "Pho Design System — Photon's React component library, built on Base UI",
   "license": "UNLICENSED",
   "repository": {