@godxjp/ui 14.0.1 → 15.0.1

package/dist/components/layout/topbar.d.ts

@@ -4,12 +4,12 @@ export type { TopbarProp, TopbarProp as TopbarProps } from "../../props/componen
  * Topbar — a PURE SLOT bar. It positions three clusters (`start` / `center` / `end`) and owns the
  * bar's flex layout; it does NOT bake any chrome. There is no built-in product switcher, search
  * box, notification bell, or language picker — the CONSUMER composes those from real primitives
- * (brand `Logo`, a `Button` search trigger, `AppSettingPicker` for locale/theme, a `DropdownMenu`
- * user menu) and drops them into a slot. Whether a control is icon-only, labelled, bordered, etc.
- * is that control's OWN configuration — never the shell's to dictate.
+ * (a brand mark `Avatar`, a `Button` search trigger, `AppSettingPicker` for locale/theme, a
+ * `DropdownMenu` user menu) and drops them into a slot. Whether a control is icon-only, labelled,
+ * bordered, etc. is that control's OWN configuration — never the shell's to dictate.
  *
  *   <Topbar
- *     start={<><SidebarToggle /><Logo label="…" /></>}
+ *     start={<><SidebarToggle /><Avatar className="rounded-md"><AvatarFallback>C</AvatarFallback></Avatar></>}
  *     center={<Button variant="outline" onClick={openSearch}><Search />検索</Button>}
  *     end={<><AppSettingPicker kind="locale" /><UserMenu /></>}
  *   />

package/dist/components/navigation/pagination.js

@@ -164,7 +164,7 @@ function Pagination({
               /* @__PURE__ */ jsx(
                 SelectTrigger,
                 {
-                  className: "ui-pagination-size-trigger",
+                  className: "ui-pagination-size-trigger w-[var(--pagination-size-width)]",
                   "aria-label": t("navigation.pagination.pageSize"),
                   children: /* @__PURE__ */ jsx(SelectValue, {})
                 }

package/dist/props/components/layout.prop.d.ts

@@ -105,13 +105,13 @@ export type SidebarProp = {
 };
 /**
  * @see Topbar — a PURE SLOT bar (no baked chrome). The library only positions three clusters; the
- * CONSUMER decides what goes in each (brand `Logo`, sidebar toggle, nav, a search trigger, settings
+ * CONSUMER decides what goes in each (a brand mark `Avatar`, sidebar toggle, nav, a search trigger, settings
  * pickers like `AppSettingPicker`, a notification button, a user menu). The shell never forces a
  * product switcher, a search box, or a language picker — those are the consumer's components,
  * configured via THEIR own props and dropped into a slot.
  */
 export type TopbarProp = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & {
-    /** Inline-start cluster — typically the sidebar toggle + brand `Logo` + primary nav. */
+    /** Inline-start cluster — typically the sidebar toggle + a brand mark (`Avatar`) + primary nav. */
     start?: ReactNode;
     /** Center cluster — optional (e.g. a search trigger or a page/entity switcher). */
     center?: ReactNode;

package/dist/props/vocabulary/data.prop.d.ts

@@ -18,6 +18,12 @@ export type ColumnDefProp<T> = {
     width?: string;
     align?: ColumnAlignProp;
     hiddenOnMobile?: boolean;
+    /**
+     * List this column in DataTable.ViewOptions (the column show/hide "set view"
+     * menu). Defaults to true; set false to keep a column always visible (e.g. a
+     * primary key or a pinned actions column).
+     */
+    enableHiding?: boolean;
     /**
      * Pin the column to the inline-end edge so it stays visible while the rest of
      * the table scrolls horizontally — the standard home for a row-actions column.

package/dist/styles/layout.css

@@ -84,8 +84,14 @@
     justify-content: space-evenly;
   }
 
-  .ui-flex-gap-xs,
+  .ui-flex-gap-xs {
+    gap: var(--space-stack-xs);
+  }
+  /* Match the other `.ui-stack-*` sizes: a stack is a vertical column, not a row.
+   * Without this, `gap="xs"` stacks (e.g. ToolbarGroup label + control) laid out
+   * as a row and squeezed CJK labels into a vertical wrap. */
   .ui-stack-xs {
+    flex-direction: column;
     gap: var(--space-stack-xs);
   }
   .ui-flex-gap-sm {
@@ -591,8 +597,7 @@
     font-variant-numeric: tabular-nums;
   }
 
-  .ui-toolbar,
-  .ui-filter-bar {
+  .ui-toolbar {
     display: flex;
     flex-direction: column;
     gap: var(--filter-bar-gap);
@@ -600,41 +605,35 @@
   }
 
   @media (min-width: 640px) {
-    .ui-toolbar,
-    .ui-filter-bar {
+    .ui-toolbar {
       flex-flow: row wrap;
       align-items: flex-end;
     }
   }
 
-  .ui-toolbar-clear,
-  .ui-filter-clear {
+  .ui-toolbar-clear {
     width: 100%;
   }
 
   @media (min-width: 640px) {
-    .ui-toolbar-clear,
-    .ui-filter-clear {
+    .ui-toolbar-clear {
       width: auto;
       margin-inline-start: auto;
     }
   }
 
-  .ui-toolbar-group,
-  .ui-filter-group {
+  .ui-toolbar-group {
     min-width: 0;
     width: 100%;
   }
 
   @media (min-width: 640px) {
-    .ui-toolbar-group,
-    .ui-filter-group {
+    .ui-toolbar-group {
       width: auto;
     }
   }
 
-  .ui-toolbar-label,
-  .ui-filter-label {
+  .ui-toolbar-label {
     display: flex;
     align-items: center;
     color: hsl(var(--muted-foreground));

package/dist/tokens/base.css

@@ -15,6 +15,5 @@
 @import "./components/navigation.css";
 @import "./components/data-display.css";
 @import "./components/list-row.css";
-@import "./components/logo.css";
 @import "./components/data-entry.css";
 @import "./components/shell.css";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@godxjp/ui",
-  "version": "14.0.1",
+  "version": "15.0.1",
   "type": "module",
   "packageManager": "pnpm@10.29.1",
   "sideEffects": false,
@@ -54,10 +54,6 @@
       "types": "./dist/components/query/index.d.ts",
       "import": "./dist/components/query/index.js"
     },
-    "./data-grid": {
-      "types": "./dist/components/data-grid/index.d.ts",
-      "import": "./dist/components/data-grid/index.js"
-    },
     "./charts": {
       "types": "./dist/components/charts/index.d.ts",
       "import": "./dist/components/charts/index.js"
@@ -269,6 +265,7 @@
   },
   "scripts": {
     "typecheck": "tsc --noEmit -p tsconfig.json",
+    "typecheck:docs": "tsc --noEmit -p tsconfig.docs.json",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
     "format": "prettier --check .",
@@ -278,7 +275,7 @@
     "test:coverage": "vitest run --coverage",
     "check:example-imports": "node scripts/check-example-imports.mjs",
     "verify": "pnpm typecheck && pnpm lint && pnpm format && pnpm build && pnpm preview:build && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-token-sync && pnpm check:mcp-sync && pnpm check:mcp-orphans && pnpm check:audit-sync && pnpm test",
-    "verify:release": "pnpm typecheck && pnpm lint && pnpm build && pnpm preview:build && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-token-sync && pnpm check:mcp-sync && pnpm check:mcp-orphans && pnpm check:audit-sync && pnpm check:mcp-prop-sync && pnpm test",
+    "verify:release": "pnpm typecheck && pnpm typecheck:docs && pnpm lint && pnpm build && pnpm preview:build && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-token-sync && pnpm check:mcp-sync && pnpm check:mcp-orphans && pnpm check:audit-sync && pnpm check:mcp-prop-sync && pnpm test",
     "check:mcp-sync": "node scripts/check-mcp-sync.mjs",
     "check:mcp-orphans": "node scripts/check-mcp-orphans.mjs",
     "check:mcp-prop-sync": "node scripts/check-mcp-prop-sync.mjs",
@@ -307,7 +304,6 @@
   "peerDependencies": {
     "@hookform/resolvers": "^5.2.0",
     "@tanstack/react-query": ">=5.0.0",
-    "@tanstack/react-table": ">=8.0.0",
     "react": ">=19.0.0",
     "react-dom": ">=19.0.0",
     "react-hook-form": "^7.76.0",
@@ -320,9 +316,6 @@
     "axe-core": "*"
   },
   "peerDependenciesMeta": {
-    "@tanstack/react-table": {
-      "optional": true
-    },
     "recharts": {
       "optional": true
     },
@@ -338,6 +331,7 @@
   },
   "dependencies": {
     "@date-fns/tz": "^1.5.0",
+    "@tanstack/react-table": "^8.21.3",
     "@fontsource/m-plus-2": "^5.2.9",
     "@radix-ui/react-accordion": "^1.2.12",
     "@radix-ui/react-alert-dialog": "^1.1.15",
@@ -385,7 +379,6 @@
     "@hookform/resolvers": "^5.2.2",
     "@tailwindcss/vite": "^4.2.4",
     "@tanstack/react-query": "^5.100.9",
-    "@tanstack/react-table": "^8.21.3",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",

package/scripts/ui-audit.mjs

@@ -387,8 +387,13 @@ function walk(dir, acc = []) {
     const full = join(dir, name);
     const st = statSync(full);
     if (st.isDirectory()) {
+      // Test/story dirs are not product UI — never hold them to the UI-standardization rules.
+      if (name === "__tests__" || name === "node_modules") continue;
       walk(full, acc);
-    } else if (name.endsWith(".tsx") || name.endsWith(".ts")) {
+    } else if (
+      (name.endsWith(".tsx") || name.endsWith(".ts")) &&
+      !/\.(test|spec|stories)\.tsx?$/.test(name)
+    ) {
       acc.push(full);
     }
   }

package/dist/components/data-grid/data-grid.d.ts

@@ -1,67 +0,0 @@
-import * as React from "react";
-import { type ColumnDef, type ColumnFiltersState, type OnChangeFn, type PaginationState, type RowSelectionState, type RowData, type SortingState, type VisibilityState } from "@tanstack/react-table";
-import type { TableDensityProp } from "../../props/vocabulary";
-export type DataGridDensity = TableDensityProp;
-export type { ColumnDef } from "@tanstack/react-table";
-declare module "@tanstack/react-table" {
-    interface ColumnMeta<TData extends RowData, TValue> {
-        label?: React.ReactNode;
-    }
-}
-export interface DataGridProps<T> {
-    columns: ColumnDef<T, unknown>[];
-    data: T[];
-    getRowId?: (row: T) => string;
-    /** Stable id key when getRowId is omitted (defaults to "id"). */
-    rowIdKey?: keyof T & string;
-    sorting?: SortingState;
-    onSortingChange?: OnChangeFn<SortingState>;
-    columnFilters?: ColumnFiltersState;
-    onColumnFiltersChange?: OnChangeFn<ColumnFiltersState>;
-    globalFilter?: string;
-    onGlobalFilterChange?: OnChangeFn<string>;
-    pagination?: PaginationState;
-    onPaginationChange?: OnChangeFn<PaginationState>;
-    /** Total server row count (manual pagination) — drives the page count. */
-    rowCount?: number;
-    rowSelection?: RowSelectionState;
-    onRowSelectionChange?: OnChangeFn<RowSelectionState>;
-    enableRowSelection?: boolean;
-    columnVisibility?: VisibilityState;
-    onColumnVisibilityChange?: OnChangeFn<VisibilityState>;
-    manualSorting?: boolean;
-    manualFiltering?: boolean;
-    manualPagination?: boolean;
-    density?: DataGridDensity;
-    onDensityChange?: (d: DataGridDensity) => void;
-    loading?: boolean;
-    empty?: React.ReactNode;
-    onRowClick?: (row: T) => void;
-    className?: string;
-    children?: React.ReactNode;
-}
-interface DataGridComponent {
-    <T>(props: DataGridProps<T>): React.ReactElement;
-    Toolbar: React.FC<{
-        children?: React.ReactNode;
-        className?: string;
-    }>;
-    Search: React.FC<{
-        placeholder?: string;
-        className?: string;
-    }>;
-    ViewOptions: React.FC<{
-        className?: string;
-    }>;
-    BulkActions: React.FC<{
-        children: (count: number) => React.ReactNode;
-    }>;
-    DensityToggle: React.FC;
-    Content: React.FC;
-    Pagination: React.FC<{
-        pageSizeOptions?: number[];
-        className?: string;
-    }>;
-    displayName?: string;
-}
-export declare const DataGrid: DataGridComponent;