@godxjp/ui 14.0.0 → 15.0.0

package/dist/components/data-grid/data-grid.js

@@ -1,402 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import {
-  flexRender,
-  getCoreRowModel,
-  getFilteredRowModel,
-  getPaginationRowModel,
-  getSortedRowModel,
-  useReactTable
-} from "@tanstack/react-table";
-import {
-  ArrowDown,
-  ArrowUp,
-  ChevronLeft,
-  ChevronRight,
-  ChevronsUpDown,
-  Layers,
-  Layers2,
-  SlidersHorizontal
-} from "lucide-react";
-import { useTranslation } from "../../i18n/use-translation";
-import { cn } from "../../lib/utils";
-import { densityClass } from "../../lib/variants";
-import { tableCellPaddingClass, tableRowHeightClass } from "../../lib/control-styles";
-import { Flex } from "../layout/flex";
-import { Button } from "../general/button";
-import { Checkbox } from "../data-entry/checkbox";
-import { SearchInput } from "../data-entry/search-input";
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue
-} from "../data-entry/select";
-import {
-  DropdownMenu,
-  DropdownMenuCheckboxItem,
-  DropdownMenuContent,
-  DropdownMenuLabel,
-  DropdownMenuSeparator,
-  DropdownMenuTrigger
-} from "../navigation/dropdown-menu";
-import { EmptyState } from "../data-display/empty-state";
-import {
-  Table,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow
-} from "../data-display/table";
-const DataGridContext = React.createContext(null);
-function useDataGrid() {
-  const ctx = React.useContext(DataGridContext);
-  if (!ctx) throw new Error("DataGrid.* must be used inside <DataGrid>");
-  return ctx;
-}
-const DataGrid = function DataGridRoot({
-  columns,
-  data,
-  getRowId,
-  rowIdKey = "id",
-  sorting,
-  onSortingChange,
-  columnFilters,
-  onColumnFiltersChange,
-  globalFilter,
-  onGlobalFilterChange,
-  pagination,
-  onPaginationChange,
-  rowCount,
-  rowSelection,
-  onRowSelectionChange,
-  enableRowSelection = false,
-  columnVisibility: columnVisibilityProp,
-  onColumnVisibilityChange,
-  manualSorting = true,
-  manualFiltering = true,
-  manualPagination = true,
-  density: densityProp,
-  onDensityChange,
-  loading = false,
-  empty,
-  onRowClick,
-  className,
-  children
-}) {
-  const [internalDensity, setInternalDensity] = React.useState("comfortable");
-  const density = densityProp ?? internalDensity;
-  const setDensity = (d) => {
-    if (!densityProp) setInternalDensity(d);
-    onDensityChange?.(d);
-  };
-  const [internalSorting, setInternalSorting] = React.useState([]);
-  const [internalFilters, setInternalFilters] = React.useState([]);
-  const [internalGlobal, setInternalGlobal] = React.useState("");
-  const [internalPagination, setInternalPagination] = React.useState({
-    pageIndex: 0,
-    pageSize: 10
-  });
-  const [internalSelection, setInternalSelection] = React.useState({});
-  const [internalVisibility, setInternalVisibility] = React.useState({});
-  const resolveRowId = React.useCallback(
-    (row) => getRowId ? getRowId(row) : String(row[rowIdKey]),
-    [getRowId, rowIdKey]
-  );
-  const table = useReactTable({
-    data,
-    columns,
-    getRowId: resolveRowId,
-    getCoreRowModel: getCoreRowModel(),
-    ...manualSorting ? {} : { getSortedRowModel: getSortedRowModel() },
-    ...manualFiltering ? {} : { getFilteredRowModel: getFilteredRowModel() },
-    ...manualPagination ? {} : { getPaginationRowModel: getPaginationRowModel() },
-    manualSorting,
-    manualFiltering,
-    manualPagination,
-    rowCount,
-    enableRowSelection,
-    state: {
-      sorting: sorting ?? internalSorting,
-      columnFilters: columnFilters ?? internalFilters,
-      globalFilter: globalFilter ?? internalGlobal,
-      pagination: pagination ?? internalPagination,
-      rowSelection: rowSelection ?? internalSelection,
-      columnVisibility: columnVisibilityProp ?? internalVisibility
-    },
-    onSortingChange: onSortingChange ?? setInternalSorting,
-    onColumnFiltersChange: onColumnFiltersChange ?? setInternalFilters,
-    onGlobalFilterChange: onGlobalFilterChange ?? setInternalGlobal,
-    onPaginationChange: onPaginationChange ?? setInternalPagination,
-    onRowSelectionChange: onRowSelectionChange ?? setInternalSelection,
-    onColumnVisibilityChange: onColumnVisibilityChange ?? setInternalVisibility
-  });
-  const ctx = {
-    table,
-    density,
-    setDensity,
-    loading,
-    empty,
-    onRowClick
-  };
-  return /* @__PURE__ */ jsx(DataGridContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: cn(
-        "ui-data-table-root",
-        densityClass[density === "compact" ? "compact" : "comfortable"],
-        className
-      ),
-      children: children ?? /* @__PURE__ */ jsx(DataGrid.Content, {})
-    }
-  ) });
-};
-DataGrid.displayName = "DataGrid";
-DataGrid.Toolbar = function DataGridToolbar({ children, className }) {
-  return /* @__PURE__ */ jsx(
-    Flex,
-    {
-      direction: "row",
-      align: "center",
-      justify: "between",
-      gap: "sm",
-      wrap: true,
-      className: cn("ui-data-table-toolbar", className),
-      children
-    }
-  );
-};
-DataGrid.Toolbar.displayName = "DataGrid.Toolbar";
-DataGrid.Search = function DataGridSearch({ placeholder, className }) {
-  const { table } = useDataGrid();
-  const { t } = useTranslation();
-  const value = table.getState().globalFilter ?? "";
-  return /* @__PURE__ */ jsx(
-    SearchInput,
-    {
-      value,
-      onValueChange: (q) => table.setGlobalFilter(q),
-      onSearch: (q) => table.setGlobalFilter(q),
-      placeholder: placeholder ?? t("dataGrid.searchPlaceholder"),
-      ariaLabel: t("dataGrid.search"),
-      className
-    }
-  );
-};
-DataGrid.Search.displayName = "DataGrid.Search";
-DataGrid.ViewOptions = function DataGridViewOptions({ className }) {
-  const { table } = useDataGrid();
-  const { t } = useTranslation();
-  const hideable = table.getAllLeafColumns().filter((c) => c.getCanHide());
-  if (hideable.length === 0) return null;
-  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
-    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "outline", size: "sm", className, children: [
-      /* @__PURE__ */ jsx(SlidersHorizontal, { className: "size-4 shrink-0", "aria-hidden": "true" }),
-      t("dataGrid.view")
-    ] }) }),
-    /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
-      /* @__PURE__ */ jsx(DropdownMenuLabel, { children: t("dataGrid.toggleColumns") }),
-      /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
-      hideable.map((column) => /* @__PURE__ */ jsx(
-        DropdownMenuCheckboxItem,
-        {
-          checked: column.getIsVisible(),
-          onCheckedChange: (v) => column.toggleVisibility(!!v),
-          children: columnLabel(column)
-        },
-        column.id
-      ))
-    ] })
-  ] });
-};
-DataGrid.ViewOptions.displayName = "DataGrid.ViewOptions";
-function columnLabel(column) {
-  const meta = column.columnDef.meta;
-  if (meta?.label) return meta.label;
-  if (typeof column.columnDef.header === "string") return column.columnDef.header;
-  return column.id;
-}
-DataGrid.BulkActions = function DataGridBulkActions({ children }) {
-  const { table } = useDataGrid();
-  const count = table.getSelectedRowModel().rows.length;
-  if (count === 0) return null;
-  return /* @__PURE__ */ jsx(Flex, { direction: "row", align: "center", gap: "sm", children: children(count) });
-};
-DataGrid.BulkActions.displayName = "DataGrid.BulkActions";
-DataGrid.DensityToggle = function DataGridDensityToggle() {
-  const { density, setDensity } = useDataGrid();
-  const { t } = useTranslation();
-  const next = density === "compact" ? "comfortable" : "compact";
-  const Icon = density === "compact" ? Layers : Layers2;
-  const nextLabel = next === "compact" ? t("dataTable.densityCompact") : t("dataTable.densityComfortable");
-  return /* @__PURE__ */ jsxs(
-    Button,
-    {
-      variant: "outline",
-      size: "sm",
-      onClick: () => setDensity(next),
-      "aria-label": t("dataTable.densitySwitch", { density: nextLabel }),
-      children: [
-        /* @__PURE__ */ jsx(Icon, { className: "size-4 shrink-0", "aria-hidden": "true" }),
-        density === "compact" ? t("dataTable.densityCompact") : t("dataTable.densityComfortable")
-      ]
-    }
-  );
-};
-DataGrid.DensityToggle.displayName = "DataGrid.DensityToggle";
-DataGrid.Content = function DataGridContent() {
-  const { table, loading, empty, onRowClick } = useDataGrid();
-  const { t } = useTranslation();
-  const leafCount = table.getVisibleLeafColumns().length;
-  const enableSelection = table.options.enableRowSelection;
-  const colSpan = leafCount + (enableSelection ? 1 : 0);
-  const isInteractive = (target) => !!target.closest("button, a, input, select, textarea, [role=menuitem], [role=checkbox]");
-  return /* @__PURE__ */ jsx("div", { className: "ui-data-table-scroll", "aria-busy": loading, children: /* @__PURE__ */ jsx("div", { className: "ui-data-table-surface min-w-[640px] sm:min-w-0", children: /* @__PURE__ */ jsxs(Table, { children: [
-    /* @__PURE__ */ jsx(TableHeader, { className: "bg-secondary sticky top-0 z-10", children: table.getHeaderGroups().map((hg) => /* @__PURE__ */ jsxs(TableRow, { children: [
-      enableSelection && /* @__PURE__ */ jsx(TableHead, { className: "w-10", children: /* @__PURE__ */ jsx(
-        Checkbox,
-        {
-          checked: table.getIsAllPageRowsSelected() ? true : table.getIsSomePageRowsSelected() ? "indeterminate" : false,
-          onCheckedChange: (v) => table.toggleAllPageRowsSelected(!!v),
-          "aria-label": t("dataTable.selectAll")
-        }
-      ) }),
-      hg.headers.map((header) => {
-        const canSort = header.column.getCanSort();
-        const sorted = header.column.getIsSorted();
-        return /* @__PURE__ */ jsx(
-          TableHead,
-          {
-            "aria-sort": canSort ? sorted === "asc" ? "ascending" : sorted === "desc" ? "descending" : "none" : void 0,
-            className: cn(canSort && "select-none"),
-            children: header.isPlaceholder ? null : canSort ? /* @__PURE__ */ jsxs(
-              "button",
-              {
-                type: "button",
-                className: "ui-data-table-sort-button focus-visible:ring-ring inline-flex items-center gap-1 rounded-sm focus-visible:ring-2",
-                onClick: header.column.getToggleSortingHandler(),
-                children: [
-                  flexRender(header.column.columnDef.header, header.getContext()),
-                  sorted === "asc" ? /* @__PURE__ */ jsx(ArrowUp, { className: "size-3", "aria-hidden": "true" }) : sorted === "desc" ? /* @__PURE__ */ jsx(ArrowDown, { className: "size-3", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(
-                    ChevronsUpDown,
-                    {
-                      className: "text-muted-foreground size-3",
-                      "aria-hidden": "true"
-                    }
-                  )
-                ]
-              }
-            ) : flexRender(header.column.columnDef.header, header.getContext())
-          },
-          header.id
-        );
-      })
-    ] }, hg.id)) }),
-    /* @__PURE__ */ jsx(TableBody, { children: loading ? /* @__PURE__ */ jsx(TableRow, { className: "hover:bg-transparent", children: /* @__PURE__ */ jsx(TableCell, { colSpan, className: "h-32 text-center", "aria-live": "polite", children: /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm", children: t("dataTable.loading") }) }) }) : table.getRowModel().rows.length === 0 ? /* @__PURE__ */ jsx(TableRow, { className: "hover:bg-transparent", children: /* @__PURE__ */ jsx(TableCell, { colSpan, className: "ui-data-table-empty", "aria-live": "polite", children: empty ?? /* @__PURE__ */ jsx(EmptyState, { title: t("dataTable.empty") }) }) }) : table.getRowModel().rows.map((row) => {
-      const selected = row.getIsSelected();
-      return /* @__PURE__ */ jsxs(
-        TableRow,
-        {
-          "data-state": selected ? "selected" : void 0,
-          tabIndex: onRowClick ? 0 : void 0,
-          onClick: (e) => {
-            if (isInteractive(e.target)) return;
-            onRowClick?.(row.original);
-          },
-          onKeyDown: onRowClick ? (e) => {
-            if (e.key !== "Enter" && e.key !== " ") return;
-            if (e.target !== e.currentTarget) return;
-            e.preventDefault();
-            onRowClick(row.original);
-          } : void 0,
-          className: cn(
-            tableRowHeightClass,
-            onRowClick && "hover:bg-muted/50 focus-visible:ring-ring cursor-pointer focus-visible:ring-2 focus-visible:outline-none focus-visible:ring-inset",
-            selected && "bg-muted/30"
-          ),
-          children: [
-            enableSelection && /* @__PURE__ */ jsx(TableCell, { className: tableCellPaddingClass, children: /* @__PURE__ */ jsx(
-              Checkbox,
-              {
-                checked: selected,
-                onCheckedChange: (v) => row.toggleSelected(!!v),
-                "aria-label": t("dataTable.selectRow", { id: row.id }),
-                onClick: (e) => e.stopPropagation()
-              }
-            ) }),
-            row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(TableCell, { className: tableCellPaddingClass, children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))
-          ]
-        },
-        row.id
-      );
-    }) })
-  ] }) }) });
-};
-DataGrid.Content.displayName = "DataGrid.Content";
-DataGrid.Pagination = function DataGridPagination({
-  pageSizeOptions = [10, 20, 50, 100],
-  className
-}) {
-  const { table } = useDataGrid();
-  const { t } = useTranslation();
-  const { pageIndex, pageSize } = table.getState().pagination;
-  const pageCount = table.getPageCount();
-  return /* @__PURE__ */ jsxs(
-    Flex,
-    {
-      direction: "row",
-      align: "center",
-      justify: "between",
-      gap: "md",
-      wrap: true,
-      className: cn("ui-data-table-pagination", className),
-      children: [
-        /* @__PURE__ */ jsxs(Flex, { direction: "row", align: "center", gap: "sm", children: [
-          /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm", children: t("dataGrid.rowsPerPage") }),
-          /* @__PURE__ */ jsxs(
-            Select,
-            {
-              value: String(pageSize),
-              onValueChange: (v) => table.setPageSize(Number(v)),
-              children: [
-                /* @__PURE__ */ jsx(SelectTrigger, { size: "sm", "aria-label": t("dataGrid.rowsPerPage"), className: "tabular-nums", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
-                /* @__PURE__ */ jsx(SelectContent, { children: pageSizeOptions.map((n) => /* @__PURE__ */ jsx(SelectItem, { value: String(n), className: "tabular-nums", children: n }, n)) })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs(Flex, { direction: "row", align: "center", gap: "sm", children: [
-          /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm tabular-nums", children: t("dataGrid.pageOf", { page: pageIndex + 1, total: Math.max(1, pageCount) }) }),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              variant: "outline",
-              size: "icon",
-              disabled: !table.getCanPreviousPage(),
-              onClick: () => table.previousPage(),
-              "aria-label": t("common.previous") ?? "Previous",
-              children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-4", "aria-hidden": "true" })
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              variant: "outline",
-              size: "icon",
-              disabled: !table.getCanNextPage(),
-              onClick: () => table.nextPage(),
-              "aria-label": t("common.next") ?? "Next",
-              children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-4", "aria-hidden": "true" })
-            }
-          )
-        ] })
-      ]
-    }
-  );
-};
-DataGrid.Pagination.displayName = "DataGrid.Pagination";
-export {
-  DataGrid
-};

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

@@ -1,2 +0,0 @@
-export { DataGrid } from "./data-grid";
-export type { DataGridProps, DataGridDensity, ColumnDef } from "./data-grid";

package/dist/components/data-grid/index.js

@@ -1,4 +0,0 @@
-import { DataGrid } from "./data-grid";
-export {
-  DataGrid
-};

package/dist/components/general/logo.d.ts

@@ -1,28 +0,0 @@
-import * as React from "react";
-import type { ShapeProp } from "../../props/vocabulary";
-declare const logoVariants: (props?: ({
-    size?: "xs" | "sm" | "md" | "lg" | null | undefined;
-    shape?: "default" | "pill" | "sharp" | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;
-export interface LogoProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {
-    /**
-     * Accessible product name. When set, the mark exposes `role="img"` + `aria-label` (use this when
-     * the Logo IS the accessible name — e.g. a home link). When omitted the mark is `aria-hidden`
-     * (decorative — assume an adjacent wordmark provides the name).
-     */
-    label?: string;
-    /** Box size — maps to the square size scale. Default `md`. */
-    size?: "xs" | "sm" | "md" | "lg";
-    /** Corner shape — `default` (--logo-radius) · `pill` (fully rounded) · `sharp` (square). */
-    shape?: ShapeProp;
-    /** The mark — a short lettermark string (default `"G"`) or a custom SVG/image node. */
-    glyph?: React.ReactNode;
-}
-/**
- * Logo — the product brand-mark primitive. Use it INSTEAD of a hand-rolled
- * `<span className="flex size-[2rem] rounded-md bg-primary font-bold …">g</span>` (typography-on-span,
- * literal size/radius — cardinal rules #42/#46). Renders the lettermark (or a custom SVG) in a
- * tokenized box that a service rethemes via `--primary` (fill) and `--logo-radius` (corner).
- */
-export declare const Logo: React.ForwardRefExoticComponent<LogoProps & React.RefAttributes<HTMLSpanElement>>;
-export { logoVariants };

package/dist/components/general/logo.js

@@ -1,45 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import * as React from "react";
-import { cva } from "class-variance-authority";
-import { cn } from "../../lib/utils";
-const logoVariants = cva(
-  "inline-flex shrink-0 select-none items-center justify-center bg-primary font-bold leading-none text-primary-foreground [&_svg]:size-[60%]",
-  {
-    variants: {
-      size: {
-        xs: "size-[var(--logo-size-xs)] text-xs",
-        sm: "size-[var(--logo-size-sm)] text-sm",
-        md: "size-[var(--logo-size)] text-base",
-        lg: "size-[var(--logo-size-lg)] text-lg"
-      },
-      shape: {
-        default: "rounded-[var(--logo-radius)]",
-        pill: "rounded-[var(--radius-pill)]",
-        sharp: "rounded-[var(--radius-sharp)]"
-      }
-    },
-    defaultVariants: { size: "md", shape: "default" }
-  }
-);
-const Logo = React.forwardRef(
-  ({ glyph = "G", label, size, shape, className, ...props }, ref) => /* @__PURE__ */ jsx(
-    "span",
-    {
-      ref,
-      "data-slot": "logo",
-      "data-size": size ?? "md",
-      "data-shape": shape ?? "default",
-      role: label ? "img" : void 0,
-      "aria-label": label,
-      "aria-hidden": label ? void 0 : true,
-      className: cn(logoVariants({ size, shape }), className),
-      ...props,
-      children: glyph
-    }
-  )
-);
-Logo.displayName = "Logo";
-export {
-  Logo,
-  logoVariants
-};

package/dist/tokens/components/logo.css

@@ -1,11 +0,0 @@
-/* Logo (brand mark) component tokens. Box size and corner radius are knobs (#45) so a service can
- * match its own grid without forking the mark; brand fill follows --primary. The `size` prop picks
- * the step; a service retunes the steps globally here. (Not a --control-height tier — the mark is
- * decorative, not a density-aware interactive control.) */
-:root {
-  --logo-size: 2rem; /* md */
-  --logo-size-xs: 1.5rem;
-  --logo-size-sm: 1.75rem;
-  --logo-size-lg: 2.5rem;
-  --logo-radius: var(--radius);
-}