@dinachi/cli 0.6.2 → 0.6.3

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 DinachiUI
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dinachi/cli",
-  "version": "0.6.2",
+  "version": "0.6.3",
   "description": "CLI for adding Dinachi UI components to your project",
   "type": "module",
   "keywords": [
@@ -15,7 +15,7 @@
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/dinachi/ui.git"
+    "url": "git+https://github.com/raymond-UI/dinachiUI.git"
   },
   "homepage": "https://dinachi.dev",
   "bin": {

package/templates/alert-dialog/alert-dialog.tsx

@@ -33,7 +33,7 @@ const AlertDialogBackdrop = React.forwardRef<
     ref={ref}
     className={cn(
       "fixed inset-0 z-50 bg-black/80",
-      "data-[starting-style]:opacity-0 data-[ending-style]:opacity-0",
+      "data-starting-style:opacity-0 data-ending-style:opacity-0",
       "transition-all duration-150",
       className
     )}
@@ -50,8 +50,8 @@ const AlertDialogPopup = React.forwardRef<
     ref={ref}
     className={cn(
       "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg sm:rounded-lg",
-      "data-[starting-style]:scale-95 data-[starting-style]:opacity-0",
-      "data-[ending-style]:scale-95 data-[ending-style]:opacity-0",
+      "data-starting-style:scale-95 data-starting-style:opacity-0",
+      "data-ending-style:scale-95 data-ending-style:opacity-0",
       "transition-all duration-150",
       className
     )}

package/templates/autocomplete/autocomplete.tsx

@@ -71,24 +71,30 @@ AutocompleteClear.displayName = "AutocompleteClear"
 
 const AutocompleteContent = React.forwardRef<
   React.ComponentRef<typeof AutocompletePrimitive.Popup>,
-  React.ComponentPropsWithoutRef<typeof AutocompletePrimitive.Popup>
->(({ className, ...props }, ref) => (
-  <AutocompletePortal>
+  React.ComponentPropsWithoutRef<typeof AutocompletePrimitive.Popup> & {
+    readonly portal?: boolean
+  }
+>(({ className, portal = true, ...props }, ref) => {
+  const content = (
     <AutocompletePrimitive.Positioner sideOffset={4}>
       <AutocompletePrimitive.Popup
         ref={ref}
         className={cn(
-          "relative z-50 min-w-[12rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
-          "origin-[var(--transform-origin)] outline-none",
-          "data-[starting-style]:animate-in data-[starting-style]:fade-in-0 data-[starting-style]:zoom-in-95",
-          "data-[ending-style]:animate-out data-[ending-style]:fade-out-0 data-[ending-style]:zoom-out-95",
+          "relative z-50 min-w-48 overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
+          "origin-(--transform-origin) outline-none",
+          "data-starting-style:animate-in data-starting-style:fade-in-0 data-starting-style:zoom-in-95",
+          "data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:zoom-out-95",
           className
         )}
         {...props}
       />
     </AutocompletePrimitive.Positioner>
-  </AutocompletePortal>
-))
+  )
+
+  if (!portal) return content
+
+  return <AutocompletePortal>{content}</AutocompletePortal>
+})
 AutocompleteContent.displayName = "AutocompleteContent"
 
 const AutocompleteList = React.forwardRef<
@@ -113,8 +119,8 @@ const AutocompleteItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none",
-      "data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground",
-      "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      "data-highlighted:bg-accent data-highlighted:text-accent-foreground",
+      "data-disabled:pointer-events-none data-disabled:opacity-50",
       inset && "pl-8",
       className
     )}
@@ -151,7 +157,7 @@ const AutocompleteEmpty = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <AutocompletePrimitive.Empty
     ref={ref}
-    className={cn("px-2 py-6 text-center text-sm text-muted-foreground", className)}
+    className={cn("p-2 text-center text-sm text-muted-foreground", className)}
     {...props}
   />
 ))

package/templates/combobox/combobox.tsx

@@ -71,24 +71,30 @@ ComboboxClear.displayName = "ComboboxClear"
 
 const ComboboxContent = React.forwardRef<
   React.ComponentRef<typeof ComboboxPrimitive.Popup>,
-  React.ComponentPropsWithoutRef<typeof ComboboxPrimitive.Popup>
->(({ className, ...props }, ref) => (
-  <ComboboxPortal>
+  React.ComponentPropsWithoutRef<typeof ComboboxPrimitive.Popup> & {
+    readonly portal?: boolean
+  }
+>(({ className, portal = true, ...props }, ref) => {
+  const content = (
     <ComboboxPrimitive.Positioner sideOffset={4}>
       <ComboboxPrimitive.Popup
         ref={ref}
         className={cn(
-          "relative z-50 min-w-[12rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
-          "origin-[var(--transform-origin)] outline-none",
-          "data-[starting-style]:animate-in data-[starting-style]:fade-in-0 data-[starting-style]:zoom-in-95",
-          "data-[ending-style]:animate-out data-[ending-style]:fade-out-0 data-[ending-style]:zoom-out-95",
+          "relative z-50 min-w-48 overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
+          "origin-(--transform-origin) outline-none",
+          "data-starting-style:animate-in data-starting-style:fade-in-0 data-starting-style:zoom-in-95",
+          "data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:zoom-out-95",
           className
         )}
         {...props}
       />
     </ComboboxPrimitive.Positioner>
-  </ComboboxPortal>
-))
+  )
+
+  if (!portal) return content
+
+  return <ComboboxPortal>{content}</ComboboxPortal>
+})
 ComboboxContent.displayName = "ComboboxContent"
 
 const ComboboxList = React.forwardRef<
@@ -113,8 +119,8 @@ const ComboboxItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none",
-      "data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground",
-      "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      "data-highlighted:bg-accent data-highlighted:text-accent-foreground",
+      "data-disabled:pointer-events-none data-disabled:opacity-50",
       inset && "pl-10",
       className
     )}
@@ -156,7 +162,7 @@ const ComboboxEmpty = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <ComboboxPrimitive.Empty
     ref={ref}
-    className={cn("px-2 py-6 text-center text-sm text-muted-foreground", className)}
+    className={cn("p-2 text-center text-sm text-muted-foreground", className)}
     {...props}
   />
 ))

package/templates/menubar/index.ts

@@ -9,6 +9,7 @@ export {
   MenubarCheckboxItem,
   MenubarRadioGroup,
   MenubarRadioItem,
+  MenubarGroup,
   MenubarLabel,
   MenubarSeparator,
   MenubarShortcut,

package/templates/menubar/menubar.tsx

@@ -175,6 +175,14 @@ const MenubarRadioItem = React.forwardRef<
 ))
 MenubarRadioItem.displayName = "MenubarRadioItem"
 
+const MenubarGroup = React.forwardRef<
+  React.ComponentRef<typeof Menu.Group>,
+  React.ComponentProps<typeof Menu.Group>
+>(({ className, ...props }, ref) => (
+  <Menu.Group ref={ref} className={cn(className)} {...props} />
+))
+MenubarGroup.displayName = "MenubarGroup"
+
 const MenubarLabel = React.forwardRef<
   React.ComponentRef<typeof Menu.GroupLabel>,
   React.ComponentProps<typeof Menu.GroupLabel> & {
@@ -293,6 +301,7 @@ export {
   MenubarCheckboxItem,
   MenubarRadioGroup,
   MenubarRadioItem,
+  MenubarGroup,
   MenubarLabel,
   MenubarSeparator,
   MenubarShortcut,

package/templates/popover/popover.tsx

@@ -17,10 +17,11 @@ const PopoverContent = React.forwardRef<
     readonly sideOffset?: number
     readonly align?: "start" | "center" | "end"
     readonly side?: "top" | "bottom" | "left" | "right"
+    readonly portal?: boolean
   }
->(({ className, align = "center", side = "bottom", sideOffset = 8, ...props }, ref) => (
-  <PopoverPrimitive.Portal>
-    <PopoverPrimitive.Positioner 
+>(({ className, align = "center", side = "bottom", sideOffset = 8, portal = true, ...props }, ref) => {
+  const content = (
+    <PopoverPrimitive.Positioner
       align={align}
       side={side}
       sideOffset={sideOffset}
@@ -29,17 +30,21 @@ const PopoverContent = React.forwardRef<
         ref={ref}
         className={cn(
           "z-50 rounded-lg border bg-popover px-6 py-4 text-popover-foreground shadow-lg outline-none",
-          "origin-[var(--transform-origin)]",
-          "data-[starting-style]:scale-90 data-[starting-style]:opacity-0",
-          "data-[ending-style]:scale-90 data-[ending-style]:opacity-0",
+          "origin-(--transform-origin)",
+          "data-starting-style:scale-90 data-starting-style:opacity-0",
+          "data-ending-style:scale-90 data-ending-style:opacity-0",
           "transition-[transform,opacity] duration-150",
           className
         )}
         {...props}
       />
     </PopoverPrimitive.Positioner>
-  </PopoverPrimitive.Portal>
-))
+  )
+
+  if (!portal) return content
+
+  return <PopoverPrimitive.Portal>{content}</PopoverPrimitive.Portal>
+})
 PopoverContent.displayName = "PopoverContent"
 
 // Optimized PopoverArrow
@@ -113,7 +118,7 @@ const PopoverBackdrop = React.forwardRef<
     ref={ref}
     className={cn(
       "fixed inset-0 z-40 bg-black/50",
-      "data-[starting-style]:opacity-0 data-[ending-style]:opacity-0",
+      "data-starting-style:opacity-0 data-ending-style:opacity-0",
       "transition-opacity duration-150",
       className
     )}

package/templates/radio/radio.tsx

@@ -21,7 +21,7 @@ const Radio = React.forwardRef<
   <RadioPrimitive.Root
     ref={ref}
     className={cn(
-      "aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background",
+      "flex items-center justify-center aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background",
       "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
       "disabled:cursor-not-allowed disabled:opacity-50",
       className

package/templates/select/select.tsx

@@ -39,9 +39,10 @@ const SelectContent = React.forwardRef<
   React.ComponentPropsWithoutRef<typeof SelectPrimitive.Popup> & {
     readonly position?: "item-aligned" | "popper"
     readonly sideOffset?: number
+    readonly portal?: boolean
   }
->(({ className, children, position = "popper", sideOffset = 4, ...props }, ref) => (
-  <SelectPrimitive.Portal>
+>(({ className, children, position = "popper", sideOffset = 4, portal = true, ...props }, ref) => {
+  const content = (
     <SelectPrimitive.Positioner
       sideOffset={sideOffset}
       alignItemWithTrigger={position === "item-aligned"}
@@ -49,7 +50,7 @@ const SelectContent = React.forwardRef<
       <SelectPrimitive.Popup
         ref={ref}
         className={cn(
-          "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
+          "relative z-50 max-h-96 min-w-32 overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
           "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
           "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
           position === "popper" &&
@@ -65,8 +66,12 @@ const SelectContent = React.forwardRef<
         <SelectScrollDownArrow />
       </SelectPrimitive.Popup>
     </SelectPrimitive.Positioner>
-  </SelectPrimitive.Portal>
-))
+  )
+
+  if (!portal) return content
+
+  return <SelectPrimitive.Portal>{content}</SelectPrimitive.Portal>
+})
 SelectContent.displayName = "SelectContent"
 
 // Add scroll arrows for better UX with large lists
@@ -143,7 +148,7 @@ const SelectItem = React.forwardRef<
       ref={ref}
       className={cn(
         "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-2 text-sm outline-none",
-        "focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        "focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50",
         // Dynamic padding based on indicator presence and position
         showIndicator && isLeftIndicator && "pl-8",
         showIndicator && isRightIndicator && "pr-8",