@godxjp/ui 20.2.1 → 22.0.0

package/dist/i18n/messages/en.json

@@ -132,7 +132,7 @@
       "openGrid": "Open month grid",
       "previousYear": "Previous year",
       "nextYear": "Next year",
-      "placeholder": "yyyy/mm"
+      "placeholder": "Select month"
     },
     "branchScope": {
       "label": "Branch scope",
@@ -162,6 +162,22 @@
       "error": "Invalid",
       "validating": "Validating",
       "submitFailed": "Could not submit the form. Please try again."
+    },
+    "chatComposer": {
+      "label": "Message",
+      "placeholder": "Write a message",
+      "send": "Send message",
+      "cancel": "Stop generating",
+      "hintEnter": "Enter to send · Shift + Enter for a new line",
+      "hintShiftEnter": "Shift + Enter to send · Enter for a new line"
+    },
+    "chatSuggestion": {
+      "label": "Suggestions",
+      "empty": "No suggestions match",
+      "count": {
+        "one": "{count} suggestion",
+        "other": "{count} suggestions"
+      }
     }
   },
   "feedback": {
@@ -289,6 +305,13 @@
     "progress": {
       "ariaLabel": "Progress",
       "breakdownSeparator": ", "
+    },
+    "tree": {
+      "expand": "Expand",
+      "collapse": "Collapse",
+      "loading": "Loading child nodes…",
+      "empty": "Nothing to show",
+      "selected": "Selected"
     }
   },
   "ui": {
@@ -324,7 +347,8 @@
   "navigation": {
     "tabs": {
       "addTab": "Add tab",
-      "removeTab": "Close tab"
+      "removeTab": "Close tab",
+      "moreTabs": "More tabs"
     },
     "steps": {
       "ariaLabel": "Progress",
@@ -536,5 +560,27 @@
   "textExamples": {
     "preservedText": "Plain text",
     "sampleText": "First line\n  Indented line\n\nLast line"
+  },
+  "chat": {
+    "bubble": {
+      "typing": "Typing…",
+      "loading": "Loading the message",
+      "you": "You",
+      "assistant": "Assistant",
+      "tone": {
+        "info": "Information",
+        "success": "Success",
+        "warning": "Warning",
+        "destructive": "Error"
+      }
+    },
+    "list": {
+      "label": "Conversation",
+      "jumpToLatest": "Jump to latest",
+      "newMessages": {
+        "one": "{count} new message",
+        "other": "{count} new messages"
+      }
+    }
   }
 }

package/dist/i18n/messages/ja.json

@@ -132,7 +132,7 @@
       "openGrid": "月選択を開く",
       "previousYear": "前年へ",
       "nextYear": "翌年へ",
-      "placeholder": "yyyy/mm"
+      "placeholder": "年月を選択"
     },
     "branchScope": {
       "label": "ブランチ範囲",
@@ -159,6 +159,21 @@
       "error": "入力エラー",
       "validating": "確認中",
       "submitFailed": "フォームを送信できませんでした。再試行してください。"
+    },
+    "chatComposer": {
+      "label": "メッセージ",
+      "placeholder": "メッセージを入力",
+      "send": "メッセージを送信",
+      "cancel": "生成を停止",
+      "hintEnter": "Enter で送信 · Shift + Enter で改行",
+      "hintShiftEnter": "Shift + Enter で送信 · Enter で改行"
+    },
+    "chatSuggestion": {
+      "label": "候補",
+      "empty": "一致する候補がありません",
+      "count": {
+        "other": "候補 {count} 件"
+      }
     }
   },
   "feedback": {
@@ -283,6 +298,13 @@
     "progress": {
       "ariaLabel": "進捗",
       "breakdownSeparator": "、"
+    },
+    "tree": {
+      "expand": "展開",
+      "collapse": "折りたたむ",
+      "loading": "子ノードを読み込み中…",
+      "empty": "表示する項目がありません",
+      "selected": "選択中"
     }
   },
   "ui": {
@@ -318,7 +340,8 @@
   "navigation": {
     "tabs": {
       "addTab": "タブを追加",
-      "removeTab": "タブを閉じる"
+      "removeTab": "タブを閉じる",
+      "moreTabs": "他のタブ"
     },
     "steps": {
       "ariaLabel": "進行状況",
@@ -524,5 +547,26 @@
   "textExamples": {
     "preservedText": "プレーンテキスト",
     "sampleText": "最初の行\n  字下げした行\n\n最後の行"
+  },
+  "chat": {
+    "bubble": {
+      "typing": "入力中",
+      "loading": "メッセージを読み込み中",
+      "you": "自分",
+      "assistant": "アシスタント",
+      "tone": {
+        "info": "情報",
+        "success": "成功",
+        "warning": "警告",
+        "destructive": "エラー"
+      }
+    },
+    "list": {
+      "label": "会話",
+      "jumpToLatest": "最新へ移動",
+      "newMessages": {
+        "other": "新着 {count} 件"
+      }
+    }
   }
 }

package/dist/i18n/messages/vi.json

@@ -132,7 +132,7 @@
       "openGrid": "Mở chọn tháng",
       "previousYear": "Năm trước",
       "nextYear": "Năm sau",
-      "placeholder": "yyyy/mm"
+      "placeholder": "Chọn tháng"
     },
     "branchScope": {
       "label": "Phạm vi chi nhánh",
@@ -159,6 +159,22 @@
       "error": "Không hợp lệ",
       "validating": "Đang kiểm tra",
       "submitFailed": "Không thể gửi biểu mẫu. Vui lòng thử lại."
+    },
+    "chatComposer": {
+      "label": "Tin nhắn",
+      "placeholder": "Nhập tin nhắn",
+      "send": "Gửi tin nhắn",
+      "cancel": "Dừng tạo câu trả lời",
+      "hintEnter": "Enter để gửi · Shift + Enter để xuống dòng",
+      "hintShiftEnter": "Shift + Enter để gửi · Enter để xuống dòng"
+    },
+    "chatSuggestion": {
+      "label": "Gợi ý",
+      "empty": "Không có gợi ý phù hợp",
+      "count": {
+        "one": "{count} gợi ý",
+        "other": "{count} gợi ý"
+      }
     }
   },
   "feedback": {
@@ -283,6 +299,13 @@
     "progress": {
       "ariaLabel": "Tiến độ",
       "breakdownSeparator": ", "
+    },
+    "tree": {
+      "expand": "Mở rộng",
+      "collapse": "Thu gọn",
+      "loading": "Đang tải nút con…",
+      "empty": "Không có gì để hiển thị",
+      "selected": "Đã chọn"
     }
   },
   "ui": {
@@ -318,7 +341,8 @@
   "navigation": {
     "tabs": {
       "addTab": "Thêm tab",
-      "removeTab": "Đóng tab"
+      "removeTab": "Đóng tab",
+      "moreTabs": "Tab khác"
     },
     "steps": {
       "ariaLabel": "Tiến trình",
@@ -524,5 +548,26 @@
   "textExamples": {
     "preservedText": "Văn bản thuần",
     "sampleText": "Dòng đầu\n  Dòng thụt vào\n\nDòng cuối"
+  },
+  "chat": {
+    "bubble": {
+      "typing": "Đang nhập…",
+      "loading": "Đang tải tin nhắn",
+      "you": "Bạn",
+      "assistant": "Trợ lý",
+      "tone": {
+        "info": "Thông tin",
+        "success": "Thành công",
+        "warning": "Cảnh báo",
+        "destructive": "Lỗi"
+      }
+    },
+    "list": {
+      "label": "Cuộc trò chuyện",
+      "jumpToLatest": "Đến tin mới nhất",
+      "newMessages": {
+        "other": "{count} tin nhắn mới"
+      }
+    }
   }
 }

package/dist/lib/datetime/picker-format.d.ts

@@ -1,8 +1,26 @@
 import { type Locale } from "date-fns";
 import type { DatePickerBaseProp, PickerDateFormatProp } from "../../props/components/data-entry.prop.js";
+/** The granularity axis a picker selects at — `DatePickerProp["picker"]`, resolved. */
+export type DatePickerPicker = NonNullable<DatePickerBaseProp["picker"]>;
 /** Display is independent from the canonical value submitted by the field. */
 export declare function formatPickerDate(date: Date | undefined, format: PickerDateFormatProp | undefined, locale: string, withTime?: boolean): string;
 export declare function parsePickerDate(text: string, format: PickerDateFormatProp | undefined, parser?: (text: string) => Date | undefined, withTime?: boolean): Date | undefined;
 export declare function pickerDateAllowed(date: Date, min: Date | undefined, max: Date | undefined, disabled?: (date: Date) => boolean): boolean;
 /** Normalize a reporting period with the active calendar's week convention. */
 export declare function pickerPeriodStart(date: Date, picker: DatePickerBaseProp["picker"], locale: Pick<Locale, "options">): Date;
+/**
+ * ISO-8601 at the precision the picker actually selects.
+ *
+ * The standard defines reduced forms, and a month picker that submits `2026/03` is simply using
+ * none of them: `/` is not an ISO separator and a server parsing an ISO date will reject it. Each
+ * granularity gets the shortest ISO form that loses nothing:
+ *   year → `2026` · month → `2026-03` · quarter → `2026-01` (the quarter's first month, which is
+ *   what the value IS) · week → `2026-W07` (ISO week-numbering year + week) · date → `2026-03-01`.
+ */
+export declare function toIsoPeriod(date: Date | undefined, picker: DatePickerPicker): string;
+/**
+ * The inverse of `toIsoPeriod`: read back the reduced ISO form the field displays for this
+ * granularity. `date` is left to `parsePickerDate`, which already owns the full `yyyy-MM-dd` path
+ * (custom parser, `format` pattern, era display).
+ */
+export declare function parseIsoPeriod(raw: string, picker: DatePickerPicker): Date | undefined;

package/dist/lib/datetime/picker-format.js

@@ -46,9 +46,43 @@ function pickerPeriodStart(date, picker, locale) {
       return date;
   }
 }
+function toIsoPeriod(date, picker) {
+  if (!date || Number.isNaN(date.getTime())) return "";
+  switch (picker) {
+    case "year":
+      return String(date.getFullYear()).padStart(4, "0");
+    case "quarter":
+    case "month":
+      return toIsoDate(date).slice(0, 7);
+    case "week":
+      return formatDate(date, "RRRR-'W'II");
+    default:
+      return toIsoDate(date);
+  }
+}
+function parseIsoPeriod(raw, picker) {
+  const text = raw.trim();
+  if (picker === "year") {
+    const m = /^(\d{4})$/.exec(text);
+    return m ? new Date(Number(m[1]), 0, 1) : void 0;
+  }
+  if (picker === "month" || picker === "quarter") {
+    const m = /^(\d{4})-(\d{1,2})$/.exec(text);
+    if (!m) return void 0;
+    const month = Number(m[2]);
+    return month >= 1 && month <= 12 ? new Date(Number(m[1]), month - 1, 1) : void 0;
+  }
+  if (picker === "week") {
+    const parsed = parse(text, "RRRR-'W'II", new Date(2e3, 0, 1));
+    return isValid(parsed) ? parsed : void 0;
+  }
+  return void 0;
+}
 export {
   formatPickerDate,
+  parseIsoPeriod,
   parsePickerDate,
   pickerDateAllowed,
-  pickerPeriodStart
+  pickerPeriodStart,
+  toIsoPeriod
 };

package/dist/lib/field-a11y.d.ts

@@ -51,6 +51,18 @@ export interface FieldNameContextValue {
     /** The label's plain-text content, when it is a string (belt-and-suspenders `aria-label`). */
     label?: string;
 }
+/**
+ * Write attributes onto the real `<input>` react-aria hides inside a Checkbox / Radio / Switch.
+ *
+ * react-aria renders the painted control as a `<label>` and the FOCUS TARGET as a visually hidden
+ * `<input>` inside it — then strips every `data-*` off that input (`removeDataAttributes`) and
+ * forwards only the aria attributes its own props model knows about. So the two contracts this
+ * library puts on the semantic focus target — `data-field` (gh#337, the machine key automation
+ * addresses) and the aria state a control has no react-aria prop for — have to be written by hand.
+ *
+ * Deliberately NOT left on the root as well: one field must resolve to exactly one node.
+ */
+export declare function useMirroredInputAttributes(inputRef: React.RefObject<HTMLInputElement | null>, attributes: Record<string, string | undefined>): void;
 export declare const FieldNameContext: React.Context<FieldNameContextValue | null>;
 /**
  * Resolve the last-resort accessible name for a control's semantic focus target (see

package/dist/lib/field-a11y.js

@@ -37,6 +37,18 @@ function resolveFieldA11y(props, intrinsicAriaLabel) {
   }
   return picked;
 }
+function useMirroredInputAttributes(inputRef, attributes) {
+  const key = JSON.stringify(attributes);
+  React.useLayoutEffect(() => {
+    const input = inputRef.current;
+    if (!input) return;
+    const entries = JSON.parse(key);
+    for (const [name, value] of Object.entries(entries)) {
+      if (value === void 0) input.removeAttribute(name);
+      else input.setAttribute(name, value);
+    }
+  }, [inputRef, key]);
+}
 const FieldNameContext = React.createContext(null);
 function useFieldNameFallback(name) {
   const field = React.useContext(FieldNameContext);
@@ -75,5 +87,6 @@ export {
   pickGroupFieldA11y,
   resolveFieldA11y,
   useFieldIdentity,
-  useFieldNameFallback
+  useFieldNameFallback,
+  useMirroredInputAttributes
 };

package/dist/lib/tree.d.ts

@@ -0,0 +1,53 @@
+import type * as React from "react";
+/** Normalized tree node — the conventional `treeData` / Cascader `options` shape. */
+export type TreeOption = {
+    value: string;
+    label: React.ReactNode;
+    disabled?: boolean;
+    disableCheckbox?: boolean;
+    /** When false with `loadData`, shows expand affordance */
+    isLeaf?: boolean;
+    /**
+     * Per-node glyph, drawn by `Tree` when `showIcon` is on. Carried through the normalizer so the
+     * page tree and the dropdown tree keep ONE node shape; `TreeSelect` simply never reads it.
+     */
+    icon?: React.ReactNode;
+    children?: TreeOption[];
+};
+export type TreeFieldNames = {
+    label?: string;
+    value?: string;
+    children?: string;
+};
+export type NormalizedTreeOption = TreeOption & {
+    children?: NormalizedTreeOption[];
+};
+type RawTreeNode = Record<string, unknown>;
+export declare function reactNodeText(value: React.ReactNode): string;
+export declare function normalizeTreeOptions(nodes: RawTreeNode[] | undefined, fieldNames?: TreeFieldNames): NormalizedTreeOption[];
+export declare function getNodeByPath(options: NormalizedTreeOption[], path: string[]): NormalizedTreeOption[];
+export declare function getOptionsAtPath(options: NormalizedTreeOption[], path: string[]): NormalizedTreeOption[];
+export declare function formatPathLabels(chain: NormalizedTreeOption[], separator?: string): string;
+export type TreePath = {
+    path: string[];
+    labels: string[];
+};
+export declare function collectLeafPaths(options: NormalizedTreeOption[], prefix?: string[], root?: NormalizedTreeOption[]): TreePath[];
+export declare function collectAllPaths(options: NormalizedTreeOption[], prefix?: string[], root?: NormalizedTreeOption[]): TreePath[];
+export declare function pathKey(path: string[]): string;
+export declare function pathsEqual(a: string[], b: string[]): boolean;
+export declare function filterTreeOptions(options: NormalizedTreeOption[], query: string, filter?: (query: string, path: NormalizedTreeOption[]) => boolean): TreePath[];
+export declare function getDescendantValues(node: NormalizedTreeOption): string[];
+export declare function flattenVisibleTree(options: NormalizedTreeOption[], expandedKeys: Set<string>, depth?: number): {
+    node: NormalizedTreeOption;
+    depth: number;
+    hasChildren: boolean;
+}[];
+export declare function filterVisibleTree(options: NormalizedTreeOption[], query: string): {
+    node: NormalizedTreeOption;
+    depth: number;
+    hasChildren: boolean;
+}[];
+export declare function collectAllExpandableKeys(options: NormalizedTreeOption[]): string[];
+export declare function findNodeByValue(options: NormalizedTreeOption[], value: string): NormalizedTreeOption | undefined;
+export {};

package/dist/lib/tree.js

@@ -0,0 +1,155 @@
+function reactNodeText(value) {
+  if (value == null || typeof value === "boolean") return "";
+  if (typeof value === "string" || typeof value === "number" || typeof value === "bigint") {
+    return String(value);
+  }
+  if (Array.isArray(value)) {
+    return value.map((item) => reactNodeText(item)).join("");
+  }
+  return "";
+}
+function unknownText(value) {
+  if (typeof value === "string" || typeof value === "number" || typeof value === "bigint") {
+    return String(value);
+  }
+  return "";
+}
+function normalizeTreeOptions(nodes, fieldNames) {
+  if (!nodes?.length) return [];
+  const labelKey = fieldNames?.label ?? "label";
+  const valueKey = fieldNames?.value ?? "value";
+  const childrenKey = fieldNames?.children ?? "children";
+  return nodes.map((node) => {
+    const children = node[childrenKey];
+    const value = unknownText(node[valueKey]);
+    const label = node[labelKey];
+    return {
+      value,
+      label: label ?? value,
+      disabled: Boolean(node.disabled),
+      disableCheckbox: Boolean(node.disableCheckbox),
+      isLeaf: node.isLeaf,
+      icon: node.icon,
+      children: Array.isArray(children) ? normalizeTreeOptions(children, fieldNames) : void 0
+    };
+  });
+}
+function getNodeByPath(options, path) {
+  const chain = [];
+  let level = options;
+  for (const segment of path) {
+    const found = level.find((n) => n.value === segment);
+    if (!found) break;
+    chain.push(found);
+    level = found.children ?? [];
+  }
+  return chain;
+}
+function getOptionsAtPath(options, path) {
+  if (!path.length) return options;
+  const chain = getNodeByPath(options, path);
+  return chain.at(-1)?.children ?? [];
+}
+function formatPathLabels(chain, separator = " / ") {
+  return chain.map((n) => reactNodeText(n.label)).join(separator);
+}
+function collectLeafPaths(options, prefix = [], root = options) {
+  const out = [];
+  for (const node of options) {
+    const path = [...prefix, node.value];
+    const hasChildren = (node.children?.length ?? 0) > 0;
+    if (!hasChildren || node.isLeaf === true) {
+      out.push({ path, labels: getNodeByPath(root, path).map((n) => reactNodeText(n.label)) });
+    }
+    if (hasChildren) out.push(...collectLeafPaths(node.children, path, root));
+  }
+  return out;
+}
+function collectAllPaths(options, prefix = [], root = options) {
+  const out = [];
+  for (const node of options) {
+    const path = [...prefix, node.value];
+    out.push({ path, labels: getNodeByPath(root, path).map((n) => reactNodeText(n.label)) });
+    if (node.children?.length) out.push(...collectAllPaths(node.children, path, root));
+  }
+  return out;
+}
+function pathKey(path) {
+  return path.join("\0");
+}
+function pathsEqual(a, b) {
+  return a.length === b.length && a.every((v, i) => v === b[i]);
+}
+function filterTreeOptions(options, query, filter) {
+  const q = query.trim().toLowerCase();
+  if (!q) return [];
+  const paths = collectLeafPaths(options);
+  return paths.filter(({ path }) => {
+    const chain = getNodeByPath(options, path);
+    if (filter) return filter(query, chain);
+    return chain.some((n) => reactNodeText(n.label).toLowerCase().includes(q));
+  });
+}
+function getDescendantValues(node) {
+  const values = [node.value];
+  for (const child of node.children ?? []) values.push(...getDescendantValues(child));
+  return values;
+}
+function flattenVisibleTree(options, expandedKeys, depth = 0) {
+  const out = [];
+  for (const node of options) {
+    const hasChildren = (node.children?.length ?? 0) > 0 && node.isLeaf !== true;
+    out.push({ node, depth, hasChildren });
+    if (hasChildren && expandedKeys.has(node.value)) {
+      out.push(...flattenVisibleTree(node.children, expandedKeys, depth + 1));
+    }
+  }
+  return out;
+}
+function filterVisibleTree(options, query) {
+  const q = query.trim().toLowerCase();
+  if (!q) return flattenVisibleTree(options, new Set(collectAllExpandableKeys(options)));
+  function matches(nodes, depth) {
+    return nodes.flatMap((node) => {
+      const children = node.isLeaf ? [] : matches(node.children ?? [], depth + 1);
+      if (!reactNodeText(node.label).toLowerCase().includes(q) && children.length === 0) return [];
+      return [{ node, depth, hasChildren: children.length > 0 }, ...children];
+    });
+  }
+  return matches(options, 0);
+}
+function collectAllExpandableKeys(options) {
+  const keys = [];
+  for (const node of options) {
+    if ((node.children?.length ?? 0) > 0 && node.isLeaf !== true) {
+      keys.push(node.value);
+      keys.push(...collectAllExpandableKeys(node.children));
+    }
+  }
+  return keys;
+}
+function findNodeByValue(options, value) {
+  for (const node of options) {
+    if (node.value === value) return node;
+    const nested = node.children ? findNodeByValue(node.children, value) : void 0;
+    if (nested) return nested;
+  }
+  return void 0;
+}
+export {
+  collectAllExpandableKeys,
+  collectAllPaths,
+  collectLeafPaths,
+  filterTreeOptions,
+  filterVisibleTree,
+  findNodeByValue,
+  flattenVisibleTree,
+  formatPathLabels,
+  getDescendantValues,
+  getNodeByPath,
+  getOptionsAtPath,
+  normalizeTreeOptions,
+  pathKey,
+  pathsEqual,
+  reactNodeText
+};