@godxjp/ui 8.1.0 → 8.3.0

package/dist/styles/layout.css

@@ -173,9 +173,9 @@
   }
 
   @container (min-width: 1024px) {
-    .ui-responsive-grid {
-      grid-template-columns: repeat(var(--responsive-grid-lg, 4), minmax(0, 1fr));
-    }
+  .ui-responsive-grid {
+    grid-template-columns: repeat(var(--responsive-grid-lg, 4), minmax(0, 1fr));
+  }
   }
 
   .ui-split-pane {
@@ -184,6 +184,38 @@
     grid-template-columns: minmax(0, 1fr);
   }
 
+  .ui-resizable-panel-group {
+    display: flex;
+    min-height: 0;
+    width: 100%;
+    height: 100%;
+  }
+
+  .ui-resizable-panel {
+    min-height: 0;
+    min-width: 0;
+  }
+
+  .ui-resizable-handle {
+    width: var(--control-border-width);
+    background: hsl(var(--border));
+    position: relative;
+    flex-shrink: 0;
+  }
+
+  .ui-resizable-handle:hover,
+  .ui-resizable-handle[data-state="drag"] {
+    background: hsl(var(--accent));
+  }
+
+  .ui-resizable-handle:hover::after,
+  .ui-resizable-handle[data-state="drag"]::after {
+    content: "";
+    position: absolute;
+    inset: 0;
+    background: hsl(var(--accent-foreground) / 0.2);
+  }
+
   @media (min-width: 1080px) {
     .ui-split-pane[data-aside-width="sm"] {
       grid-template-columns: minmax(0, 1fr) 20rem;

package/dist/styles/navigation-layout.css

@@ -0,0 +1,271 @@
+@layer components {
+  .ui-context-menu-content {
+    z-index: 50;
+    min-width: 10rem;
+    overflow: hidden;
+    border-radius: var(--radius-md);
+    border: 1px solid hsl(var(--border));
+    background: hsl(var(--popover));
+    color: hsl(var(--popover-foreground));
+    padding: var(--space-1);
+    box-shadow: var(--shadow-md);
+  }
+
+  .ui-context-menu-item,
+  .ui-context-menu-label,
+  .ui-context-menu-sub-trigger,
+  .ui-context-menu-checkbox-item,
+  .ui-context-menu-radio-item,
+  .ui-context-menu-shortcut,
+  .ui-context-menu-content > div,
+  .ui-menubar-item,
+  .ui-menubar-label,
+  .ui-menubar-trigger,
+  .ui-menubar-sub-trigger,
+  .ui-menubar-checkbox-item,
+  .ui-menubar-radio-item {
+    border-radius: var(--radius-sm);
+    padding-inline: var(--space-2);
+    height: 2rem;
+    display: flex;
+    align-items: center;
+    gap: var(--space-2);
+    font-size: var(--font-size-sm);
+  }
+
+  .ui-context-menu-item,
+  .ui-context-menu-checkbox-item,
+  .ui-context-menu-radio-item,
+  .ui-context-menu-sub-trigger,
+  .ui-menubar-item,
+  .ui-menubar-checkbox-item,
+  .ui-menubar-radio-item,
+  .ui-menubar-sub-trigger,
+  .ui-navigation-menu-link {
+    cursor: pointer;
+    outline: none;
+    user-select: none;
+    transition: background-color 150ms ease, color 150ms ease;
+  }
+
+  .ui-context-menu-item:hover,
+  .ui-context-menu-sub-trigger:hover,
+  .ui-menubar-item:hover,
+  .ui-menubar-sub-trigger:hover,
+  .ui-navigation-menu-link:hover,
+  .ui-navigation-menu-item:hover {
+    background: hsl(var(--accent));
+    color: hsl(var(--accent-foreground));
+  }
+
+  .ui-context-menu-item[data-state="open"],
+  .ui-context-menu-item[data-state="checked"],
+  .ui-context-menu-item[data-highlighted],
+  .ui-menubar-item[data-state="open"],
+  .ui-menubar-item[data-state="active"],
+  .ui-menubar-item[data-state="checked"],
+  .ui-menubar-sub-trigger[data-state="open"],
+  .ui-navigation-menu-link[data-highlighted],
+  .ui-navigation-menu-item[data-focus-visible] {
+    background: hsl(var(--accent));
+    color: hsl(var(--accent-foreground));
+  }
+
+  .ui-context-menu-item[data-variant="destructive"],
+  .ui-menubar-item[data-variant="destructive"] {
+    color: hsl(var(--destructive));
+  }
+
+  .ui-context-menu-item[data-variant="destructive"][data-state="focused"],
+  .ui-menubar-item[data-variant="destructive"][data-state="focused"] {
+    background: hsl(var(--destructive));
+    color: hsl(var(--destructive-foreground));
+  }
+
+  .ui-context-menu-separator,
+  .ui-menubar-separator {
+    margin: var(--space-1) 0;
+    height: 1px;
+    background: hsl(var(--border));
+  }
+
+  .ui-context-menu-label,
+  .ui-menubar-label {
+    min-height: 2rem;
+    color: hsl(var(--muted-foreground));
+    font-weight: var(--font-weight-medium);
+  }
+
+  .ui-context-menu-shortcut,
+  .ui-menubar-shortcut {
+    margin-inline-start: auto;
+    text-align: right;
+    color: hsl(var(--muted-foreground));
+    font-size: var(--font-size-xs);
+  }
+
+  .ui-context-menu-item-indicator,
+  .ui-menubar-item-indicator,
+  .ui-navigation-menu-item-indicator {
+    display: inline-flex;
+    width: 1rem;
+    height: 1rem;
+    align-items: center;
+    justify-content: center;
+    color: hsl(var(--accent-foreground));
+  }
+
+  .ui-context-menu-check,
+  .ui-menubar-check {
+    width: 1rem;
+    height: 1rem;
+  }
+
+  .ui-context-menu-dot,
+  .ui-menubar-dot {
+    width: 0.5rem;
+    height: 0.5rem;
+    border-radius: 9999px;
+    background: currentColor;
+  }
+
+  .ui-context-menu-sub-content,
+  .ui-context-menu-sub-trigger,
+  .ui-menubar-sub-content,
+  .ui-menubar-sub-trigger {
+    position: relative;
+  }
+
+  .ui-context-menu-sub-content,
+  .ui-menubar-sub-content {
+    min-width: 10rem;
+    overflow: hidden;
+    border-radius: var(--radius-md);
+    border: 1px solid hsl(var(--border));
+    background: hsl(var(--popover));
+    color: hsl(var(--popover-foreground));
+    padding: var(--space-1);
+    box-shadow: var(--shadow-md);
+  }
+
+  .ui-context-menu-sub-trigger-icon,
+  .ui-menubar-sub-trigger-icon {
+    width: 1rem;
+    height: 1rem;
+    margin-left: auto;
+    opacity: 0.75;
+  }
+
+  .ui-menubar {
+    display: flex;
+    min-height: 2.25rem;
+    align-items: center;
+    gap: var(--space-1);
+    border-radius: var(--radius-md);
+  }
+
+  .ui-menubar-trigger {
+    height: 2.25rem;
+    padding: 0 var(--space-3);
+    border-radius: var(--radius-md);
+  }
+
+  .ui-menubar-content {
+    min-width: 10rem;
+    overflow: hidden;
+    border-radius: var(--radius-md);
+    border: 1px solid hsl(var(--border));
+    background: hsl(var(--popover));
+    color: hsl(var(--popover-foreground));
+    padding: var(--space-1);
+    box-shadow: var(--shadow-md);
+  }
+
+  .ui-menubar-trigger[data-state="open"],
+  .ui-menubar-sub-trigger[data-state="open"] {
+    background: hsl(var(--accent));
+    color: hsl(var(--accent-foreground));
+  }
+
+  .ui-navigation-menu {
+    position: relative;
+    width: max-content;
+  }
+
+  .ui-navigation-menu-list {
+    display: flex;
+    align-items: center;
+    gap: var(--space-1);
+  }
+
+  .ui-navigation-menu-item,
+  .ui-navigation-menu-trigger {
+    position: relative;
+    cursor: pointer;
+    border-radius: var(--radius-md);
+    padding-inline: var(--space-2);
+    padding-block: var(--space-2);
+    height: 2.25rem;
+    font-size: var(--font-size-sm);
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-1);
+    outline: none;
+  }
+
+  .ui-navigation-menu-trigger-icon {
+    width: 0.9rem;
+    height: 0.9rem;
+    margin-left: var(--space-2);
+    opacity: 0.7;
+  }
+
+  .ui-navigation-menu-content {
+    position: absolute;
+    top: 100%;
+    left: 0;
+    min-width: 14rem;
+    z-index: 50;
+    overflow: hidden;
+    border: 1px solid hsl(var(--border));
+    border-radius: var(--radius-md);
+    background: hsl(var(--popover));
+    color: hsl(var(--popover-foreground));
+    padding: var(--space-1);
+    box-shadow: var(--shadow-md);
+  }
+
+  .ui-navigation-menu-link {
+    width: 100%;
+    cursor: pointer;
+  }
+
+  .ui-navigation-menu-viewport {
+    position: absolute;
+    left: 0;
+    top: 100%;
+    width: 100%;
+    overflow: hidden;
+    border-radius: var(--radius-md);
+    border: 1px solid hsl(var(--border));
+    background: hsl(var(--popover));
+    color: hsl(var(--popover-foreground));
+  }
+
+  .ui-navigation-menu-indicator {
+    position: absolute;
+    top: 100%;
+    z-index: 50;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 0.75rem;
+    overflow: hidden;
+  }
+
+  .ui-navigation-menu-item-indicator {
+    width: 100%;
+    transition: transform 200ms ease;
+    transform-origin: center;
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@godxjp/ui",
-  "version": "8.1.0",
+  "version": "8.3.0",
   "type": "module",
   "description": "@godxjp/ui — shared React UI framework (shadcn + Radix + Tailwind v4).",
   "files": [
@@ -89,6 +89,10 @@
       "types": "./dist/lib/utils.d.ts",
       "import": "./dist/lib/utils.js"
     },
+    "./hooks": {
+      "types": "./dist/lib/hooks.d.ts",
+      "import": "./dist/lib/hooks.js"
+    },
     "./ui/button": {
       "types": "./dist/components/general/button.d.ts",
       "import": "./dist/components/general/button.js"
@@ -165,6 +169,10 @@
       "types": "./dist/components/data-entry/cascader.d.ts",
       "import": "./dist/components/data-entry/cascader.js"
     },
+    "./ui/carousel": {
+      "types": "./dist/components/data-display/carousel.d.ts",
+      "import": "./dist/components/data-display/carousel.js"
+    },
     "./ui/tree-select": {
       "types": "./dist/components/data-entry/tree-select.d.ts",
       "import": "./dist/components/data-entry/tree-select.js"
@@ -173,10 +181,30 @@
       "types": "./dist/components/data-entry/transfer.d.ts",
       "import": "./dist/components/data-entry/transfer.js"
     },
+    "./ui/combobox": {
+      "types": "./dist/components/data-entry/combobox.d.ts",
+      "import": "./dist/components/data-entry/combobox.js"
+    },
     "./ui/command": {
       "types": "./dist/components/data-entry/command.d.ts",
       "import": "./dist/components/data-entry/command.js"
     },
+    "./ui/context-menu": {
+      "types": "./dist/components/navigation/context-menu.d.ts",
+      "import": "./dist/components/navigation/context-menu.js"
+    },
+    "./ui/menubar": {
+      "types": "./dist/components/navigation/menubar.d.ts",
+      "import": "./dist/components/navigation/menubar.js"
+    },
+    "./ui/navigation-menu": {
+      "types": "./dist/components/navigation/navigation-menu.d.ts",
+      "import": "./dist/components/navigation/navigation-menu.js"
+    },
+    "./ui/resizable": {
+      "types": "./dist/components/layout/resizable.d.ts",
+      "import": "./dist/components/layout/resizable.js"
+    },
     "./ui/scroll-area": {
       "types": "./dist/components/data-display/scroll-area.d.ts",
       "import": "./dist/components/data-display/scroll-area.js"
@@ -189,6 +217,10 @@
       "types": "./dist/components/data-entry/textarea.d.ts",
       "import": "./dist/components/data-entry/textarea.js"
     },
+    "./ui/time-input": {
+      "types": "./dist/components/data-entry/time-input.d.ts",
+      "import": "./dist/components/data-entry/time-input.js"
+    },
     "./ui/dialog": {
       "types": "./dist/components/feedback/dialog.d.ts",
       "import": "./dist/components/feedback/dialog.js"
@@ -269,10 +301,13 @@
     "@radix-ui/react-checkbox": "^1.3.3",
     "@radix-ui/react-collapsible": "^1.1.12",
     "@radix-ui/react-context": "^1.1.2",
+    "@radix-ui/react-context-menu": "^2.2.16",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
     "@radix-ui/react-hover-card": "^1.1.15",
     "@radix-ui/react-label": "^2.1.8",
+    "@radix-ui/react-menubar": "^1.1.16",
+    "@radix-ui/react-navigation-menu": "^1.2.14",
     "@radix-ui/react-popover": "^1.1.15",
     "@radix-ui/react-radio-group": "^1.3.8",
     "@radix-ui/react-scroll-area": "^1.2.10",
@@ -289,9 +324,11 @@
     "clsx": "^2.1.1",
     "cmdk": "^1.1.1",
     "date-fns": "^4.1.0",
+    "embla-carousel-react": "^8.6.0",
     "input-otp": "^1.4.2",
     "lucide-react": "^1.14.0",
     "react-day-picker": "^10.0.1",
+    "react-resizable-panels": "^4.11.2",
     "sonner": "^2.0.7",
     "tailwind-merge": "^3.5.0",
     "tailwindcss-animate": "^1.0.7",

package/dist/{chunk-A22MCA3X.js → chunk-6J7GRCDA.js}

@@ -1,9 +1,9 @@
 import { normalizeTreeOptions, collectAllExpandableKeys, filterVisibleTree, flattenVisibleTree, findNodeByValue, reactNodeText, getDescendantValues } from './chunk-SMLKNECP.js';
 import { Checkbox } from './chunk-O24Z3ULJ.js';
-import { ScrollArea } from './chunk-3KPEZ5CF.js';
 import { Command, CommandInput } from './chunk-HTEL5DQI.js';
-import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { Button } from './chunk-M4PZNAMV.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
+import { ScrollArea } from './chunk-3KPEZ5CF.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';

package/dist/{chunk-RGPF3HU6.js → chunk-6YBYAEXD.js}

@@ -1,6 +1,6 @@
 import { Input } from './chunk-VOHTRR5X.js';
-import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { Button } from './chunk-M4PZNAMV.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';
 import { normalizeHhmm, isValidHhmm } from './chunk-FXFJF4YA.js';
 import { cn } from './chunk-U7N2A7A3.js';

package/dist/{chunk-WTVLZVBA.js → chunk-CLU46QR2.js}

@@ -1,5 +1,5 @@
-import { Tooltip, TooltipTrigger, TooltipContent } from './chunk-32WO3YLB.js';
 import { DropdownMenu, DropdownMenuTrigger } from './chunk-TO33OY4L.js';
+import { Tooltip, TooltipTrigger, TooltipContent } from './chunk-32WO3YLB.js';
 import { Collapsible, CollapsibleTrigger, CollapsibleContent } from './chunk-DV52WNXO.js';
 import { densityClass, pageContainerVariantClass, Flex } from './chunk-TILFZBTE.js';
 import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';

package/dist/{chunk-XZM2GNAY.js → chunk-HB2OHB5X.js}

@@ -1,9 +1,9 @@
 import { normalizeTreeOptions, formatPathLabels, getNodeByPath, filterTreeOptions, pathsEqual, pathKey } from './chunk-SMLKNECP.js';
 import { Checkbox } from './chunk-O24Z3ULJ.js';
-import { ScrollArea, ScrollBar } from './chunk-3KPEZ5CF.js';
 import { Command, CommandInput } from './chunk-HTEL5DQI.js';
-import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { Button } from './chunk-M4PZNAMV.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
+import { ScrollArea, ScrollBar } from './chunk-3KPEZ5CF.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';

package/dist/{chunk-A7PKMT7Y.js → chunk-JBHXILI4.js}

@@ -1,6 +1,6 @@
 import { Inline, densityClass } from './chunk-TILFZBTE.js';
-import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from './chunk-4MMIMZMK.js';
 import { Button } from './chunk-M4PZNAMV.js';
+import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from './chunk-4MMIMZMK.js';
 import { tableCellPaddingClass, tableRowHeightClass, controlIconSmClass } from './chunk-IBK5D2Q6.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';
 import { cn } from './chunk-U7N2A7A3.js';

package/dist/{chunk-6QXQQAOQ.js → chunk-KDBGFJJI.js}

@@ -1,7 +1,7 @@
 import { Command, CommandList, CommandItem, CommandGroup } from './chunk-HTEL5DQI.js';
 import { Input } from './chunk-VOHTRR5X.js';
-import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { Button } from './chunk-M4PZNAMV.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';

package/dist/{chunk-RGIYKJPW.js → chunk-LJLGABFV.js}

@@ -1,7 +1,7 @@
 import { Calendar } from './chunk-IOGU3ZWF.js';
 import { Input } from './chunk-VOHTRR5X.js';
-import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { Button } from './chunk-M4PZNAMV.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { useTranslation, usePickerLocales } from './chunk-RLGHEV4A.js';
 import { toIsoDate, parseDateInput } from './chunk-FXFJF4YA.js';
 import { cn } from './chunk-U7N2A7A3.js';

package/dist/{chunk-WN52SCGE.js → chunk-N3JPLJ3B.js}

@@ -1,7 +1,7 @@
 import { Calendar } from './chunk-IOGU3ZWF.js';
 import { Input } from './chunk-VOHTRR5X.js';
-import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { Button } from './chunk-M4PZNAMV.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { useTranslation, usePickerLocales } from './chunk-RLGHEV4A.js';
 import { toIsoDate, parseDateInput } from './chunk-FXFJF4YA.js';
 import { cn } from './chunk-U7N2A7A3.js';

package/dist/{chunk-SMWKD2HG.js → chunk-PIQXAOWS.js}

@@ -1,6 +1,6 @@
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from './chunk-P4HFJQID.js';
-import { formatBytes } from './chunk-4R7QL3MW.js';
 import { Slider } from './chunk-CRERCLIZ.js';
+import { formatBytes } from './chunk-4R7QL3MW.js';
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from './chunk-P4HFJQID.js';
 import { Button } from './chunk-M4PZNAMV.js';
 import { controlIconClass } from './chunk-IBK5D2Q6.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';