@godxjp/chat 0.0.0-stage → 32.0.1

package/dist/data-entry.prop-D4jLTqUk.d.ts

@@ -0,0 +1,184 @@
+import * as React from 'react';
+
+/**
+ * Shared atomic prop types used across multiple components.
+ * @see docs/PROPS-VOCABULARY.md
+ */
+
+/** Extra CSS class names on a component root. */
+type ClassNameProp = string;
+/** Stable DOM / form identifier. */
+type IdProp = string;
+/** Loading / pending state — disables actions and shows spinners. */
+type PendingProp = boolean;
+/** Disable user interaction. */
+type DisabledProp = boolean;
+/** Placeholder text for inputs. */
+type PlaceholderProp = string;
+/** HTML input `name` attribute. */
+type NameProp = string;
+/** Abstract controlled value. */
+type ValueProp<T = string> = T;
+/** Abstract uncontrolled initial value. */
+type DefaultValueProp<T = string> = T;
+/** Callback when an abstract value changes. */
+type OnValueChangeProp<T = string> = (value: T) => void;
+/** Click handler for buttons and interactive elements. */
+type OnClickProp = React.MouseEventHandler<HTMLButtonElement>;
+/** Radix/shadcn `asChild` polymorphism — render as child element. */
+type AsChildProp = boolean;
+
+/**
+ * Interaction & visual variant prop types.
+ * @see docs/PROPS-VOCABULARY.md#interaction-variants
+ */
+
+/**
+ * Button visual style.
+ *
+ * `bare` (gh#404) is the control WITHOUT geometry: a real button — hitbox, focus ring, keyboard
+ * semantics, `aria-label` — around content that already IS the shape (a `Badge`, a truncating
+ * title). Every other variant loads a height and an inline inset from its `size`, so wrapping a
+ * chip meant writing `className="h-auto p-0"`, an audit error with no legal replacement; `link`
+ * was not it either, since it still loads a size class and adds primary colour plus a hover
+ * underline. The 24×24 target WCAG 2.2 SC 2.5.8 requires is kept by a pseudo-element, so the box
+ * stays exactly as big as its content.
+ */
+type ButtonVariantProp = "default" | "destructive" | "outline" | "dashed" | "secondary" | "ghost" | "link" | "bare";
+/**
+ * Corner shape — maps to the radius tokens (default = control/component radius). Shared by Button
+ * + Badge.
+ */
+type ShapeProp = "default" | "pill" | "sharp";
+/** Inline text alignment (logical, RTL-safe). */
+type TextAlignProp = "start" | "center" | "end";
+/** Button size preset. */
+type SizeProp = "xs" | "sm" | "md" | "lg";
+/** Button size preset; icon-only sizes are a documented Button subset. */
+type ButtonSizeProp = SizeProp | "default" | "icon" | "icon-xs" | "icon-sm" | "icon-lg";
+/**
+ * Validation state a data-entry control PAINTS — Ant Design's `status` axis, which
+ * docs/DESIGN-AUTHORITY.md names the taxonomy authority for this library.
+ *
+ * Two members, not antd's five. `error` and `warning` are the two antd paints from the prop alone;
+ * `success` and `validating` are only ever drawn together with antd's `hasFeedback` icon slot,
+ * which this library does not have (FormField owns the message and the icon), and `""` is antd's
+ * way of spelling "no status" in a required field — `undefined` already says that here.
+ *
+ * `error` and `aria-invalid` are the same state seen from two sides: a control given
+ * `status="error"` also reports `aria-invalid`, so the paint and the announcement can never drift.
+ * `warning` deliberately does NOT set `aria-invalid` — a warning is not a validity failure, and
+ * antd does not announce one either.
+ */
+type ControlStatusProp = "error" | "warning";
+
+/** Foundation component prop types — @see docs/COMPONENTS.md#foundation */
+
+/** @see Button */
+type ButtonProp = React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    variant?: ButtonVariantProp;
+    size?: ButtonSizeProp;
+    /** Corner shape — `default` (control radius) · `pill` (fully rounded) · `sharp` (square). */
+    shape?: ShapeProp;
+    fullWidth?: boolean;
+    /**
+     * Take the space the siblings leave, and let a long label ELLIPSE instead of widening the row —
+     * the same axis `Flex` calls `fill`, for the same reason.
+     *
+     * Button ships `flex-shrink: 0`, right almost everywhere and wrong in a constrained bar: an
+     * account menu holding an avatar plus a person's name keeps its full width while the cluster
+     * clips it, so a keyboard user tabs to a control they cannot see (SC 2.4.7). Until this axis
+     * existed the only move was `className="min-w-0 flex-1"`, which ui-audit blocks — and which this
+     * package's own Topbar guidance recommended, so the docs prescribed the utility the audit forbids.
+     *
+     * Sets `flex: 1 1 auto` and `min-inline-size: 0`; pair it with a `<Text truncate>` label.
+     */
+    fill?: boolean;
+    /** Allow a text button to grow vertically for multi-line labels. */
+    wrap?: boolean;
+    /** Logical content alignment, especially for full-width collection actions. */
+    align?: TextAlignProp;
+    asChild?: AsChildProp;
+    onClick?: OnClickProp;
+    disabled?: DisabledProp;
+    /**
+     * In-flight state — shows a leading spinner (replaces a leading icon if present),
+     * sets `aria-busy` and blocks activation while keeping the label to avoid layout shift.
+     */
+    loading?: PendingProp;
+    /** Optional label to swap in while `loading` (pass the `t()`-translated string). */
+    loadingText?: string;
+    /**
+     * Optional numeric count rendered as a borderless counter pill after the label (filter tabs /
+     * segmented toggles, e.g. "Chờ bay 18").
+     */
+    count?: number;
+    /**
+     * Cap for `count` (Ant Badge parity). When `count` exceeds it the pill shows `{overflowCount}+`
+     * (e.g.
+     */
+    overflowCount?: number;
+    /**
+     * Whether to render the pill when `count` is 0 (Ant Badge parity). Defaults to
+     * `true` (a `0` pill shows); pass `false` to hide the pill at zero.
+     */
+    showZero?: boolean;
+    /**
+     * Localized description of what the count MEANS, folded into the accessible name so the control
+     * never announces as a bare digit run. The SAME prop and the same contract `Toggle` has carried
+     * since gh#312 — without it a counted button measured `"Git3"` in the accessibility tree, not
+     * "Git, 3 pages" (gh#734).
+     *
+     * The pill itself is `aria-hidden` and the spoken form is an `sr-only` sibling, so the name
+     * reads `"<label>, <count> <countLabel>"` from the contents; with an explicit `aria-label`
+     * (an icon-only counted button) the same clause is folded into that instead. Pass a
+     * `t()`-resolved string — the library does not own this wording.
+     */
+    countLabel?: string;
+};
+
+/**
+ * Which keystroke SENDS and which one breaks the line — Ant Design X `Sender.submitType`.
+ *
+ * `enter` (default) is the chat convention: `Enter` sends, `Shift+Enter` inserts a newline.
+ * `shiftEnter` is the inverse, for composers that hold long, deliberately multi-line drafts.
+ * `modEnter` is this library's extension (antd X has only the first two; see
+ * docs/DESIGN-AUTHORITY.md): `⌘+Enter` on Apple platforms, `Ctrl+Enter` elsewhere sends, while
+ * `Enter` and `Shift+Enter` both insert a newline — the record-comment convention.
+ * None of them ever fires while an IME conversion is in flight.
+ * @see ChatComposer
+ */
+type ChatComposerSubmitTypeProp = "enter" | "shiftEnter" | "modEnter";
+/**
+ * @see ChatComposer `footer` — the built-in trailing action, pre-wired (onClick/disabled/
+ * accessible name already resolved) and handed to a `footer` render function so it can be
+ * RELOCATED instead of duplicated.
+ *
+ * Ant Design X `Sender.ActionsComponents` ships four (`SendButton`/`ClearButton`/`LoadingButton`/
+ * `SpeechButton`) because `Sender` has a clear affordance and speech input this composer does not
+ * — porting those two as inert components would ship dead API (the same "not ported" discipline
+ * `docs/DESIGN-AUTHORITY.md` applies to antd fields nothing here reads). `LoadingButton` is
+ * `CancelButton` here — this composer already names the streaming state's trailing action `cancel`
+ * (`onCancel`, `cancelLabel`), so the antd-x name would be a second spelling of the same button.
+ */
+type ChatComposerActionComponents = {
+    /** The send action — disabled while empty/disabled/readOnly/loading, exactly like the inline one. */
+    SubmitButton: React.ComponentType<ButtonProp>;
+    /** The stop action — only meaningful while `loading`; renders antd X's `LoadingButton` slot. */
+    CancelButton: React.ComponentType<ButtonProp>;
+};
+/**
+ * @see ChatComposer `footer` — either a plain node (unchanged default behaviour) or Ant Design X
+ * `Sender`'s `NodeRender` shape: a function receiving `{ components }` so a consumer can render
+ * the real send/cancel buttons BELOW the draft box instead of beside it. Combine with `actions=
+ * {false}` to hide the inline pair and avoid rendering both.
+ */
+type ChatComposerFooterProp = React.ReactNode | ((info: {
+    components: ChatComposerActionComponents;
+}) => React.ReactNode);
+/** Ant Design X `Attachments` overflow modes — how the card list behaves when it exceeds its box. */
+type AttachmentsOverflowProp = "wrap" | "scrollX" | "scrollY";
+/** Semantic slots Ant Design X exposes on `Attachments`. */
+type AttachmentsSemanticProp = "list" | "placeholder" | "upload" | "root" | "card" | "file";
+
+export type { AttachmentsOverflowProp as A, ChatComposerFooterProp as C, DefaultValueProp as D, IdProp as I, NameProp as N, OnValueChangeProp as O, PendingProp as P, SizeProp as S, ValueProp as V, AttachmentsSemanticProp as a, ChatComposerSubmitTypeProp as b, ClassNameProp as c, ControlStatusProp as d, DisabledProp as e, PlaceholderProp as f };

package/dist/index.d.ts

@@ -0,0 +1,11 @@
+export { ChatBubble, ChatBubbleList, ChatBubbleListProps, ChatBubbleProps } from './chat-bubble.js';
+export { ChatComposer } from './chat-composer.js';
+export { ChatSuggestion } from './chat-suggestion.js';
+export { Attachments } from './attachments.js';
+export { Conversations } from './conversations.js';
+export { ThoughtChain, ThoughtChainItem } from './thought-chain.js';
+export { Welcome } from './welcome.js';
+export { AttachmentsItemProp, AttachmentsOverflowProp, AttachmentsPlaceholderProp, AttachmentsProp, AttachmentsProp as AttachmentsProps, AttachmentsRefProp, ChatBubbleListProp, ChatBubblePlacementProp, ChatBubbleProp, ChatBubbleToneProp, ChatBubbleTypingProp, ChatBubbleVariantProp, ChatComposerProp, ChatComposerProp as ChatComposerProps, ChatComposerSubmitTypeProp, ChatMessageProp, ChatSuggestionItemProp, ChatSuggestionProp, ChatSuggestionProp as ChatSuggestionProps, ChatSuggestionRenderProp, ConversationsCreationProp, ConversationsDividerProp, ConversationsEntryProp, ConversationsGroupableProp, ConversationsItemProp, ConversationsMenuItemProp, ConversationsMenuProp, ConversationsProp, ConversationsProp as ConversationsProps, ThoughtChainItemProp, ThoughtChainItemProp as ThoughtChainItemProps, ThoughtChainItemsProp, ThoughtChainLineProp, ThoughtChainProp, ThoughtChainProp as ThoughtChainProps, ThoughtChainStatusProp, ThoughtChainVariantProp, WelcomeProp, WelcomeProp as WelcomeProps, WelcomeVariantProp } from '@godxjp/ui/props/components';
+import 'react';
+import './data-entry.prop-D4jLTqUk.js';
+import '@godxjp/ui/data-entry';

package/dist/index.js

@@ -0,0 +1,35 @@
+"use client";
+import {
+  Attachments
+} from "./chunk-PGCRFJHC.js";
+import {
+  ChatBubble,
+  ChatBubbleList
+} from "./chunk-XCTRKZCF.js";
+import {
+  ChatComposer
+} from "./chunk-4K5JWTV5.js";
+import {
+  ChatSuggestion
+} from "./chunk-DEYHFJBA.js";
+import {
+  Conversations
+} from "./chunk-IWWOS4BL.js";
+import {
+  ThoughtChain,
+  ThoughtChainItem
+} from "./chunk-52TWSF6W.js";
+import {
+  Welcome
+} from "./chunk-NUCO7NAP.js";
+export {
+  Attachments,
+  ChatBubble,
+  ChatBubbleList,
+  ChatComposer,
+  ChatSuggestion,
+  Conversations,
+  ThoughtChain,
+  ThoughtChainItem,
+  Welcome
+};

package/dist/thought-chain.d.ts

@@ -0,0 +1,45 @@
+import * as React from 'react';
+import { ThoughtChainProp, ThoughtChainItemProp } from '@godxjp/ui/props/components';
+export { ThoughtChainItemProp, ThoughtChainItemProp as ThoughtChainItemProps, ThoughtChainItemsProp, ThoughtChainLineProp, ThoughtChainProp, ThoughtChainProp as ThoughtChainProps, ThoughtChainStatusProp, ThoughtChainVariantProp } from '@godxjp/ui/props/components';
+
+/**
+ * ThoughtChain — the assistant's reasoning, step by step (Ant Design X `ThoughtChain`).
+ *
+ * ## The shape, and why it is an `<ol>`
+ *
+ * Ant renders the whole chain as nested `<div>`s and paints the step number itself
+ * (`index + 1` in `es/thought-chain/Node.js`). The order of the steps IS the content here — step 3
+ * only makes sense after step 2 — so the chain is an ordered list and a screen reader gets "list,
+ * 4 items" plus each step's position for free. The visible ordinal stays, because the same number
+ * has to be on screen for a sighted reader following a long chain.
+ *
+ * ## The disclosure is a real button
+ *
+ * A `collapsible` step's title in Ant is a `<div onClick>` with a rotating chevron — no role, no
+ * `tabIndex`, no `aria-expanded`. Here it is a `<button aria-expanded aria-controls>` over the
+ * body it opens: the WAI-ARIA APG Disclosure pattern, so the step can be opened from the keyboard
+ * and its state is announced rather than inferred from a rotation.
+ *
+ * Everything a caller passes keeps Ant's spelling: `items` (with `icon`, `title`, `description`,
+ * `content`, `footer`, `status`, `collapsible`, `blink`, `destroyOnHidden`), the
+ * `defaultExpandedKeys` / `expandedKeys` / `onExpand` triad, and `line`. `styles` / `classNames` /
+ * `prefixCls` / `rootClassName` are not ported — the standing style-hole decision
+ * (docs/WHAT-BELONGS-HERE.md, docs/DESIGN-AUTHORITY.md); the chain is retuned through
+ * `src/tokens/components/thought-chain.css`.
+ */
+declare const ThoughtChain: React.ForwardRefExoticComponent<ThoughtChainProp & React.RefAttributes<HTMLOListElement>>;
+/**
+ * ThoughtChainItem — one step OUTSIDE a chain (Ant Design X `ThoughtChain.Item`).
+ *
+ * A named export rather than `ThoughtChain.Item`, for the same reason `ActionsItem` is: every
+ * compound in this library is separate named exports (`CardHeader`, `TabsList`), and attaching
+ * statics to one component would be the only instance of it here.
+ *
+ * ONE DEVIATION: Ant renders the chip as a `<div>` and hangs `onClick` on it, so a clickable step
+ * is invisible to the keyboard and to assistive technology. Here an item WITH `onClick` renders a
+ * real `<button>` and one without renders a plain `<div>` — the element follows whether the thing
+ * is actually a control.
+ */
+declare const ThoughtChainItem: React.ForwardRefExoticComponent<ThoughtChainItemProp & React.RefAttributes<HTMLElement>>;
+
+export { ThoughtChain, ThoughtChainItem };

package/dist/thought-chain.js

@@ -0,0 +1,9 @@
+"use client";
+import {
+  ThoughtChain,
+  ThoughtChainItem
+} from "./chunk-52TWSF6W.js";
+export {
+  ThoughtChain,
+  ThoughtChainItem
+};

package/dist/welcome.d.ts

@@ -0,0 +1,29 @@
+import * as React from 'react';
+import { WelcomeProp } from '@godxjp/ui/props/components';
+export { WelcomeProp, WelcomeProp as WelcomeProps, WelcomeVariantProp } from '@godxjp/ui/props/components';
+
+/**
+ * Welcome — the greeting block at the head of an empty conversation (Ant Design X `Welcome`).
+ *
+ * ## Why this is a component and not four lines of composition
+ *
+ * It is close to the line, and the honest answer is that the SHAPE is the value: an assistant's
+ * first screen is the same object in every product — glyph, greeting, one line under it, one
+ * trailing action — and Ant X named it, so every consumer that builds a chat now expects the name.
+ * What it owns beyond a `Flex` is the `extra` slot's placement (on the TITLE row, not below the
+ * description, which is where a hand-roll puts it) and the `icon`-as-URL rule below.
+ *
+ * ## Two deliberate differences from Ant X, both in the same direction
+ *
+ * - **The image icon is decorative.** Ant renders `alt="icon"` — a screen reader then reads the
+ *   word "icon" beside a title the glyph is only decorating. Here it is `alt=""`, which is what an
+ *   image that duplicates adjacent text is supposed to be.
+ * - **The heading level is Ant's.** Ant hardcodes `Typography.Title level={4}`, so this renders an
+ *   `<h4>`. Hardcoding a level is a document-structure decision a component should not normally
+ *   make, but the alternative — inventing a `level` prop Ant does not have — is a second spelling
+ *   of an axis the issue asked to port verbatim. Wrap it in your own heading hierarchy if the page
+ *   needs a different rung.
+ */
+declare const Welcome: React.ForwardRefExoticComponent<WelcomeProp & React.RefAttributes<HTMLDivElement>>;
+
+export { Welcome };

package/dist/welcome.js

@@ -0,0 +1,7 @@
+"use client";
+import {
+  Welcome
+} from "./chunk-NUCO7NAP.js";
+export {
+  Welcome
+};

package/package.json

@@ -1,6 +1,45 @@
 {
   "name": "@godxjp/chat",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "32.0.1",
+  "description": "Conversational UI for GoDX apps on @godxjp/ui: message bubbles and lists, the composer with slash / mention suggestions, the conversation list, thought chains, the welcome block, attachments and the message action bar — IME-safe, ja / en / vi.",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "sideEffects": false,
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/godx-jp/godxjp-ui.git",
+    "directory": "packages/chat"
+  },
+  "license": "Apache-2.0",
+  "dependencies": {
+    "lucide-react": "^1.37.0"
+  },
+  "peerDependencies": {
+    "@godxjp/ui": "~32.0.1",
+    "react": ">=19.0.0",
+    "react-dom": ">=19.0.0"
+  },
+  "keywords": [
+    "chat",
+    "conversation",
+    "ai",
+    "godxjp"
+  ]
+}