@godxjp/ui 6.0.0 → 6.0.2

package/src/components/data-display/scroll-area.tsx

@@ -1,42 +0,0 @@
-import * as React from "react";
-import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-
-import { cn } from "../../lib/utils";
-
-export const ScrollArea = React.forwardRef<
-  React.ComponentRef<typeof ScrollAreaPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>
->(({ className, children, ...props }, ref) => (
-  <ScrollAreaPrimitive.Root
-    ref={ref}
-    className={cn("relative overflow-hidden", className)}
-    {...props}
-  >
-    <ScrollAreaPrimitive.Viewport className="size-full rounded-[inherit]">
-      {children}
-    </ScrollAreaPrimitive.Viewport>
-    <ScrollBar />
-    <ScrollAreaPrimitive.Corner />
-  </ScrollAreaPrimitive.Root>
-));
-ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-
-export const ScrollBar = React.forwardRef<
-  React.ComponentRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>,
-  React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>
->(({ className, orientation = "vertical", ...props }, ref) => (
-  <ScrollAreaPrimitive.ScrollAreaScrollbar
-    ref={ref}
-    orientation={orientation}
-    className={cn(
-      "flex touch-none transition-colors select-none",
-      orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-px",
-      orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-px",
-      className,
-    )}
-    {...props}
-  >
-    <ScrollAreaPrimitive.ScrollAreaThumb className="bg-border relative flex-1 rounded-full" />
-  </ScrollAreaPrimitive.ScrollAreaScrollbar>
-));
-ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;

package/src/components/data-display/status-badge.tsx

@@ -1,83 +0,0 @@
-// StatusBadge — globally consistent status display. Adding a new status:
-// extend STATUS_MAP below + add key to i18n JSON (`status.*`), never inline `<Badge>`.
-import * as React from "react";
-import {
-  AlertCircle,
-  CheckCircle2,
-  Circle,
-  Clock,
-  type LucideIcon,
-  Pause,
-  Play,
-  Trash2,
-  XCircle,
-} from "lucide-react";
-
-import { useTranslation } from "../../i18n/use-translation";
-import { cn } from "../../lib/utils";
-import {
-  toneDestructiveClass,
-  toneInfoClass,
-  toneNeutralClass,
-  toneSuccessClass,
-  toneWarningClass,
-} from "../../lib/control-styles";
-
-type Tone = "success" | "warning" | "destructive" | "info" | "neutral";
-
-interface StatusDef {
-  tone: Tone;
-  icon: LucideIcon;
-}
-
-const STATUS_MAP: Record<string, StatusDef> = {
-  active: { tone: "success", icon: CheckCircle2 },
-  completed: { tone: "success", icon: CheckCircle2 },
-  delivered: { tone: "success", icon: CheckCircle2 },
-  done: { tone: "success", icon: CheckCircle2 },
-  permanent: { tone: "success", icon: CheckCircle2 },
-  succeeded: { tone: "success", icon: CheckCircle2 },
-  draft: { tone: "neutral", icon: Circle },
-  pending: { tone: "warning", icon: Clock },
-  scheduled: { tone: "info", icon: Clock },
-  sending: { tone: "info", icon: Play },
-  temporary: { tone: "warning", icon: Clock },
-  bounced: { tone: "destructive", icon: AlertCircle },
-  cancelled: { tone: "neutral", icon: Pause },
-  deleted: { tone: "destructive", icon: Trash2 },
-  failed: { tone: "destructive", icon: XCircle },
-  private: { tone: "neutral", icon: Circle },
-  internal: { tone: "info", icon: Circle },
-  public: { tone: "info", icon: Circle },
-  ASSIGNMENT_STATUS_ACTIVE: { tone: "success", icon: CheckCircle2 },
-  ASSIGNMENT_STATUS_SUSPENDED: { tone: "warning", icon: Pause },
-  ASSIGNMENT_STATUS_TERMINATED: { tone: "destructive", icon: XCircle },
-};
-
-const TONE_CLASSES: Record<Tone, string> = {
-  success: toneSuccessClass,
-  warning: toneWarningClass,
-  destructive: toneDestructiveClass,
-  info: toneInfoClass,
-  neutral: toneNeutralClass,
-};
-
-interface StatusBadgeProps {
-  status: string;
-  className?: string;
-  label?: React.ReactNode;
-}
-
-export function StatusBadge({ status, className, label: labelOverride }: StatusBadgeProps) {
-  const { t } = useTranslation();
-  const def = STATUS_MAP[status] ?? { tone: "neutral" as const, icon: Circle };
-  const Icon = def.icon;
-  const resolvedLabel = labelOverride ?? (status in STATUS_MAP ? t(`status.${status}`) : status);
-
-  return (
-    <span data-slot="status-badge" className={cn(TONE_CLASSES[def.tone], className)}>
-      <Icon data-slot="status-badge-icon" aria-hidden="true" />
-      <span>{resolvedLabel}</span>
-    </span>
-  );
-}

package/src/components/data-display/table.tsx

@@ -1,59 +0,0 @@
-import * as React from "react";
-import { tableHeadHeightClass } from "../../lib/control-styles";
-import { cn } from "../../lib/utils";
-
-export const Table = React.forwardRef<HTMLTableElement, React.HTMLAttributes<HTMLTableElement>>(
-  ({ className, ...props }, ref) => (
-    <div className="relative w-full overflow-auto">
-      <table ref={ref} className={cn("w-full caption-bottom text-sm", className)} {...props} />
-    </div>
-  ),
-);
-Table.displayName = "Table";
-
-export const TableHeader = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
-));
-TableHeader.displayName = "TableHeader";
-
-export const TableBody = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <tbody ref={ref} className={cn("[&_tr:last-child]:border-0", className)} {...props} />
-));
-TableBody.displayName = "TableBody";
-
-export const TableRow = React.forwardRef<
-  HTMLTableRowElement,
-  React.HTMLAttributes<HTMLTableRowElement>
->(({ className, ...props }, ref) => (
-  <tr
-    ref={ref}
-    className={cn(
-      "ui-table-row hover:bg-accent/70 data-[state=selected]:bg-primary/[0.06] border-b transition-colors",
-      className,
-    )}
-    {...props}
-  />
-));
-TableRow.displayName = "TableRow";
-
-export const TableHead = React.forwardRef<
-  HTMLTableCellElement,
-  React.ThHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <th ref={ref} data-slot="table-head" className={cn(tableHeadHeightClass, className)} {...props} />
-));
-TableHead.displayName = "TableHead";
-
-export const TableCell = React.forwardRef<
-  HTMLTableCellElement,
-  React.TdHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <td ref={ref} data-slot="table-cell" className={cn(className)} {...props} />
-));
-TableCell.displayName = "TableCell";

package/src/components/data-display/timeline.tsx

@@ -1,42 +0,0 @@
-import type { ReactNode } from "react";
-import { CheckCircle2, Plane } from "lucide-react";
-
-export type TimelineItem = {
-  title: ReactNode;
-  location?: ReactNode;
-  time?: ReactNode;
-  note?: ReactNode;
-  current?: boolean;
-};
-
-export type TimelineProps = {
-  items: TimelineItem[];
-};
-
-export function Timeline({ items }: TimelineProps) {
-  return (
-    <div className="ui-timeline">
-      {items.map((item, index) => {
-        const Icon = item.current ? Plane : CheckCircle2;
-        return (
-          <div className="ui-timeline-item" key={index}>
-            <div className="ui-timeline-rail">
-              <span className="ui-timeline-dot" data-current={item.current ? "true" : undefined}>
-                <Icon aria-hidden="true" />
-              </span>
-              {index !== items.length - 1 ? <span className="ui-timeline-line" /> : null}
-            </div>
-            <div className="ui-timeline-body">
-              <div className="ui-timeline-head">
-                <span className="ui-timeline-title">{item.title}</span>
-                {item.time ? <span className="ui-timeline-time">{item.time}</span> : null}
-              </div>
-              {item.location ? <div className="ui-timeline-location">{item.location}</div> : null}
-              {item.note ? <p className="ui-timeline-note">{item.note}</p> : null}
-            </div>
-          </div>
-        );
-      })}
-    </div>
-  );
-}

package/src/components/data-display/tree-list.tsx

@@ -1,42 +0,0 @@
-import type { ReactNode } from "react";
-import { ChevronRight, Package } from "lucide-react";
-
-import { Badge } from "./badge";
-
-export type TreeListItem = {
-  id: string;
-  title: ReactNode;
-  description?: ReactNode;
-  depth?: number;
-  active?: boolean;
-  badge?: ReactNode;
-};
-
-export type TreeListProps = {
-  items: TreeListItem[];
-};
-
-export function TreeList({ items }: TreeListProps) {
-  return (
-    <div className="ui-tree-list">
-      {items.map((item) => (
-        <div
-          className="ui-tree-item"
-          data-active={item.active ? "true" : undefined}
-          data-depth={item.depth ?? 0}
-          key={item.id}
-        >
-          <ChevronRight aria-hidden="true" />
-          <Package aria-hidden="true" />
-          <div className="ui-tree-item-body">
-            <div className="ui-tree-item-title">{item.title}</div>
-            {item.description ? (
-              <div className="ui-tree-item-description">{item.description}</div>
-            ) : null}
-          </div>
-          {item.badge ? <Badge variant="secondary">{item.badge}</Badge> : null}
-        </div>
-      ))}
-    </div>
-  );
-}

package/src/components/data-entry/__fixtures__/tree-options.ts

@@ -1,80 +0,0 @@
-import type { TreeOptionProp } from "../../../props/components/data-entry.prop";
-
-/** Demo data - VN/JP region hierarchy for preview examples and tests. */
-export const REGION_OPTIONS: TreeOptionProp[] = [
-  {
-    value: "vn",
-    label: "Việt Nam",
-    children: [
-      {
-        value: "hcm",
-        label: "TP. Hồ Chí Minh",
-        children: [
-          { value: "q1", label: "Quận 1" },
-          { value: "q3", label: "Quận 3" },
-        ],
-      },
-      {
-        value: "hn",
-        label: "Hà Nội",
-        children: [
-          { value: "badinh", label: "Ba Đình" },
-          { value: "caugiay", label: "Cầu Giấy" },
-        ],
-      },
-    ],
-  },
-  {
-    value: "jp",
-    label: "日本",
-    children: [
-      {
-        value: "osaka",
-        label: "大阪府",
-        children: [
-          { value: "chuo", label: "中央区" },
-          { value: "kita", label: "北区" },
-        ],
-      },
-      {
-        value: "tokyo",
-        label: "東京都",
-        children: [
-          { value: "shinjuku", label: "新宿区" },
-          { value: "shibuya", label: "渋谷区" },
-        ],
-      },
-    ],
-  },
-];
-
-export const ORG_TREE: TreeOptionProp[] = [
-  {
-    value: "godx",
-    label: "GODX",
-    children: [
-      {
-        value: "logistics",
-        label: "Logistics",
-        children: [
-          { value: "warehouse-osaka", label: "Kho Osaka" },
-          { value: "warehouse-hcm", label: "Kho HCM" },
-        ],
-      },
-      {
-        value: "platform",
-        label: "Platform",
-        children: [
-          { value: "identity", label: "Identity" },
-          { value: "media", label: "Media" },
-        ],
-      },
-    ],
-  },
-];
-
-export const TRANSFER_MOCK = Array.from({ length: 12 }, (_, i) => ({
-  key: `user-${i + 1}`,
-  title: `NV-${String(i + 1).padStart(3, "0")}`,
-  description: i % 3 === 0 ? "Kho Osaka" : "Kho HCM",
-}));