@superblocksteam/vite-plugin-file-sync 2.0.170-next.1 → 2.0.171-next.0

package/dist/migration-templates/app-fullstack/client/components/ui/checkbox.tsx

@@ -2,18 +2,8 @@ import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
 import { CheckIcon } from "lucide-react";
 import type * as React from "react";
 
-import { registerComponent } from "@superblocksteam/library";
-import {
-  Prop,
-  Section,
-  PropsCategory,
-  type PropertiesPanelDefinition,
-  type EditorConfig,
-} from "@superblocksteam/library";
-
 import { cn } from "@/lib/utils";
 
-// Base Checkbox Component
 function Checkbox({
   className,
   ...props
@@ -37,36 +27,4 @@ function Checkbox({
   );
 }
 
-// Checkbox Props
-type CheckboxProps = React.ComponentProps<typeof CheckboxPrimitive.Root> & {
-  onCheckedChange?: (checked: boolean) => void;
-  defaultChecked?: boolean;
-};
-
-// Properties Definition
-const propertiesDefinition: PropertiesPanelDefinition<CheckboxProps> = {
-  general: Section.category(PropsCategory.Content).children({
-    checked: Prop.boolean(),
-    defaultChecked: Prop.boolean(),
-  }),
-  interaction: Section.category(PropsCategory.Interaction).children({
-    disabled: Prop.boolean(),
-  }),
-
-  events: Section.category(PropsCategory.EventHandlers).children({
-    onCheckedChange: Prop.eventHandler(),
-  }),
-};
-
-// Editor Template
-// Editor Config
-const editorConfig: EditorConfig = {
-  icon: "checkbox",
-  description:
-    "A control that allows the user to toggle between checked and not checked",
-};
-
-// Register Component
-registerComponent(Checkbox, propertiesDefinition).editorConfig(editorConfig);
-
 export { Checkbox };

package/dist/migration-templates/app-fullstack/client/components/ui/dialog.tsx

@@ -2,15 +2,6 @@ import * as DialogPrimitive from "@radix-ui/react-dialog";
 import { XIcon } from "lucide-react";
 import type * as React from "react";
 
-import {
-  Prop,
-  PropsCategory,
-  registerComponent,
-  Section,
-  type PropertiesPanelDefinition,
-  type EditorConfig,
-} from "@superblocksteam/library";
-
 import { cn } from "@/lib/utils";
 
 function Dialog({
@@ -148,49 +139,3 @@ export {
   DialogTitle,
   DialogTrigger,
 };
-
-// Properties Definition
-const propertiesDefinition: PropertiesPanelDefinition<
-  React.ComponentPropsWithoutRef<typeof Dialog>
-> = {
-  general: Section.category(PropsCategory.Content).children({
-    open: Prop.boolean(),
-    children: Prop.jsx(),
-  }),
-  interaction: Section.category(PropsCategory.Interaction).children({
-    showCloseButton: Prop.boolean(),
-    defaultOpen: Prop.boolean(),
-    modal: Prop.boolean().docs({
-      description:
-        "When true, interaction with outside elements will be disabled",
-    }),
-  }),
-
-  events: Section.category(PropsCategory.EventHandlers).children({
-    onOpenChange: Prop.eventHandler(),
-  }),
-};
-
-const editorConfig: EditorConfig = {
-  icon: "modal",
-  isDetached: true,
-  isDraggable: false,
-  description:
-    "A window overlaid on the primary window, rendering the content underneath inert",
-};
-
-const childrenPropertiesDefinition = {
-  general: Section.category(PropsCategory.Content).children({
-    children: Prop.jsx(),
-  }),
-};
-
-// Register Component
-registerComponent(Dialog, propertiesDefinition).editorConfig(editorConfig);
-registerComponent(DialogTrigger, childrenPropertiesDefinition);
-registerComponent(DialogClose);
-registerComponent(DialogContent, childrenPropertiesDefinition);
-registerComponent(DialogDescription, childrenPropertiesDefinition);
-registerComponent(DialogFooter, childrenPropertiesDefinition);
-registerComponent(DialogHeader, childrenPropertiesDefinition);
-registerComponent(DialogTitle, childrenPropertiesDefinition);

package/dist/migration-templates/app-fullstack/client/components/ui/dropdown-menu.tsx

@@ -2,15 +2,6 @@ import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
 import type * as React from "react";
 
-import { registerComponent } from "@superblocksteam/library";
-import {
-  Prop,
-  Section,
-  PropsCategory,
-  type PropertiesPanelDefinition,
-  type EditorConfig,
-} from "@superblocksteam/library";
-
 import { cn } from "@/lib/utils";
 
 function DropdownMenu({
@@ -245,26 +236,6 @@ function DropdownMenuSubContent({
   );
 }
 
-// Properties Definition
-const propertiesDefinition: PropertiesPanelDefinition<
-  React.ComponentProps<typeof DropdownMenuPrimitive.Root>
-> = {
-  general: Section.category(PropsCategory.Content).children({
-    children: Prop.jsx(),
-  }),
-};
-
-// Editor Template
-// Editor Config
-const editorConfig: EditorConfig = {
-  icon: "menu",
-};
-
-// Register Component
-registerComponent(DropdownMenu, propertiesDefinition).editorConfig(
-  editorConfig,
-);
-
 export {
   DropdownMenu,
   DropdownMenuPortal,

package/dist/migration-templates/app-fullstack/client/components/ui/hover-card.tsx

@@ -1,15 +1,6 @@
 import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
 import React from "react";
 
-import {
-  Prop,
-  Section,
-  PropsCategory,
-  registerComponent,
-  type PropertiesPanelDefinition,
-  type EditorConfig,
-} from "@superblocksteam/library";
-
 import { cn } from "@/lib/utils";
 
 function HoverCard({
@@ -49,58 +40,3 @@ function HoverCardContent({
 }
 
 export { HoverCard, HoverCardTrigger, HoverCardContent };
-
-// Properties Definition for HoverCard (root)
-const hoverCardPropertiesDefinition: PropertiesPanelDefinition<
-  React.ComponentPropsWithoutRef<typeof HoverCard>
-> = {
-  general: Section.category(PropsCategory.Content).children({
-    open: Prop.boolean(),
-    children: Prop.jsx(),
-    openDelay: Prop.number(),
-    closeDelay: Prop.number(),
-  }),
-  interaction: Section.category(PropsCategory.Interaction).children({
-    defaultOpen: Prop.boolean(),
-  }),
-  events: Section.category(PropsCategory.EventHandlers).children({
-    onOpenChange: Prop.eventHandler(),
-  }),
-};
-
-const hoverCardEditorConfig: EditorConfig = {
-  icon: "custom",
-  isDetached: true,
-  isDraggable: false,
-  description:
-    "A hover card component for displaying contextual information on hover",
-};
-
-// Properties Definition for HoverCardContent
-const hoverCardContentPropertiesDefinition: PropertiesPanelDefinition<
-  React.ComponentPropsWithoutRef<typeof HoverCardContent>
-> = {
-  general: Section.category(PropsCategory.Content).children({
-    children: Prop.jsx(),
-  }),
-  appearance: Section.category(PropsCategory.Appearance).children({
-    side: Prop.string<"top" | "right" | "bottom" | "left">(),
-    align: Prop.string<"start" | "center" | "end">(),
-    sideOffset: Prop.number(),
-    alignOffset: Prop.number(),
-    avoidCollisions: Prop.boolean(),
-  }),
-};
-
-const childrenPropertiesDefinition = {
-  general: Section.category(PropsCategory.Content).children({
-    children: Prop.jsx(),
-  }),
-};
-
-// Register Components
-registerComponent(HoverCard, hoverCardPropertiesDefinition).editorConfig(
-  hoverCardEditorConfig,
-);
-registerComponent(HoverCardTrigger, childrenPropertiesDefinition);
-registerComponent(HoverCardContent, hoverCardContentPropertiesDefinition);

package/dist/migration-templates/app-fullstack/client/components/ui/input.tsx

@@ -1,17 +1,7 @@
 import React from "react";
 
-import {
-  registerComponent,
-  Prop,
-  Section,
-  PropsCategory,
-  type PropertiesPanelDefinition,
-  type EditorConfig,
-} from "@superblocksteam/library";
-
 import { cn } from "@/lib/utils";
 
-// Input Component
 function Input({ className, type, ...props }: React.ComponentProps<"input">) {
   return (
     <input
@@ -28,51 +18,4 @@ function Input({ className, type, ...props }: React.ComponentProps<"input">) {
   );
 }
 
-type InputProps = React.ComponentProps<typeof Input>;
-
-// Properties Definition
-const propertiesDefinition: PropertiesPanelDefinition<InputProps> = {
-  general: Section.category(PropsCategory.Content).children({
-    value: Prop.string(),
-    defaultValue: Prop.string(),
-    placeholder: Prop.string(),
-    type: Prop.string<"text" | "email" | "password" | "number" | "url">(),
-  }),
-  appearance: Section.category(PropsCategory.Appearance).children({
-    autoComplete: Prop.string(),
-  }),
-
-  interaction: Section.category(PropsCategory.Interaction)
-    .children({
-      disabled: Prop.boolean(),
-      readOnly: Prop.boolean(),
-      autoFocus: Prop.boolean(),
-    })
-    .add({
-      minLength: Prop.number(),
-      maxLength: Prop.number(),
-    })
-    .add({
-      min: Prop.number(),
-      max: Prop.number(),
-      step: Prop.number(),
-    }),
-
-  events: Section.category(PropsCategory.EventHandlers).children({
-    onChange: Prop.eventHandler(),
-    onFocus: Prop.eventHandler(),
-    onBlur: Prop.eventHandler(),
-    onKeyDown: Prop.eventHandler(),
-  }),
-};
-
-// Editor Configuration
-const editorConfig: EditorConfig = {
-  icon: "input",
-  description: "A versatile input component for collecting user data",
-};
-
-// Registration
-registerComponent(Input, propertiesDefinition).editorConfig(editorConfig);
-
 export { Input };

package/dist/migration-templates/app-fullstack/client/components/ui/label.tsx

@@ -1,18 +1,8 @@
 import * as LabelPrimitive from "@radix-ui/react-label";
 import React from "react";
 
-import { registerComponent } from "@superblocksteam/library";
-import {
-  Prop,
-  Section,
-  PropsCategory,
-  type PropertiesPanelDefinition,
-  type EditorConfig,
-} from "@superblocksteam/library";
-
 import { cn } from "@/lib/utils";
 
-// Label Component
 function Label({
   className,
   ...props
@@ -29,24 +19,4 @@ function Label({
   );
 }
 
-type LabelProps = React.ComponentProps<typeof Label>;
-
-// Properties Definition
-const propertiesDefinition: PropertiesPanelDefinition<LabelProps> = {
-  general: Section.category(PropsCategory.Content).children({
-    children: Prop.jsx(),
-    htmlFor: Prop.string(),
-  }),
-};
-
-// Editor Template
-// Editor Config
-const editorConfig: EditorConfig = {
-  icon: "button",
-  description: "A label component for forms and inputs",
-};
-
-// Register Component
-registerComponent(Label, propertiesDefinition).editorConfig(editorConfig);
-
 export { Label };

package/dist/migration-templates/app-fullstack/client/components/ui/navigation-menu.tsx

@@ -1,40 +1,11 @@
 import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
+import { cva } from "class-variance-authority";
 import { ChevronDownIcon } from "lucide-react";
-import { type IconName } from "lucide-react/dynamic";
-import React from "react";
-import { useNavigate } from "react-router";
+import * as React from "react";
 
-import { registerComponent } from "@superblocksteam/library";
-import {
-  Prop,
-  Section,
-  PropsCategory,
-  type PropertiesPanelDefinition,
-  type EditorConfig,
-} from "@superblocksteam/library";
-
-import { useActivePage } from "@/components/hooks/use-active-page";
-import { Icon } from "@/components/ui/icon";
 import { cn } from "@/lib/utils";
 
-// Types
-interface MenuItem {
-  label: string;
-  href?: string;
-  content?: {
-    title: string;
-    description?: string;
-    href: string;
-    icon?: IconName;
-  }[];
-}
-
-// Constants
-const TRIGGER_CLASSES =
-  "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50 focus-visible:ring-ring/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1";
-
-// Primitive Components
-function NavigationMenuRoot({
+function NavigationMenu({
   className,
   children,
   viewport = true,
@@ -87,18 +58,19 @@ function NavigationMenuItem({
   );
 }
 
+const navigationMenuTriggerStyle = cva(
+  "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-[color,box-shadow] outline-none hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=open]:bg-accent/50 data-[state=open]:text-accent-foreground data-[state=open]:hover:bg-accent data-[state=open]:focus:bg-accent",
+);
+
 function NavigationMenuTrigger({
   className,
   children,
   ...props
-}: Omit<
-  React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>,
-  "asChild"
->) {
+}: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>) {
   return (
     <NavigationMenuPrimitive.Trigger
       data-slot="navigation-menu-trigger"
-      className={cn(TRIGGER_CLASSES, className)}
+      className={cn(navigationMenuTriggerStyle(), "group", className)}
       {...props}
     >
       {children}{" "}
@@ -118,8 +90,8 @@ function NavigationMenuContent({
     <NavigationMenuPrimitive.Content
       data-slot="navigation-menu-content"
       className={cn(
-        "data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 top-0 left-0 w-full p-2 pr-2.5 md:absolute md:w-auto",
-        "group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none",
+        "top-0 left-0 w-full p-2 pr-2.5 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out md:absolute md:w-auto",
+        "group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95",
         className,
       )}
       {...props}
@@ -140,7 +112,7 @@ function NavigationMenuViewport({
       <NavigationMenuPrimitive.Viewport
         data-slot="navigation-menu-viewport"
         className={cn(
-          "origin-top-center bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--radix-navigation-menu-viewport-width)]",
+          "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",
           className,
         )}
         {...props}
@@ -157,7 +129,7 @@ function NavigationMenuLink({
     <NavigationMenuPrimitive.Link
       data-slot="navigation-menu-link"
       className={cn(
-        "data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-ring/50 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none focus-visible:ring-[3px] focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4",
+        "flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground data-[active=true]:hover:bg-accent data-[active=true]:focus:bg-accent [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
         className,
       )}
       {...props}
@@ -173,147 +145,18 @@ function NavigationMenuIndicator({
     <NavigationMenuPrimitive.Indicator
       data-slot="navigation-menu-indicator"
       className={cn(
-        "data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden",
+        "top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:animate-in data-[state=visible]:fade-in",
         className,
       )}
       {...props}
     >
-      <div className="bg-border relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm shadow-md" />
+      <div className="relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" />
     </NavigationMenuPrimitive.Indicator>
   );
 }
 
-// Main Component
-type NavigationMenuProps = React.ComponentPropsWithoutRef<
-  typeof NavigationMenuRoot
-> & {
-  menuItems?: MenuItem[];
-  disabled?: boolean;
-  onItemClick?: (href?: string) => void;
-};
-
-const NavigationMenu = ({
-  menuItems,
-  disabled,
-  onItemClick,
-  children: _children,
-  ...props
-}: NavigationMenuProps) => {
-  const { isPageActive } = useActivePage();
-  const navigate = useNavigate();
-  const handleItemClick = React.useCallback(
-    (item: MenuItem, href?: string) => {
-      const targetHref = href || item.href;
-      void onItemClick?.(targetHref);
-      if (targetHref) {
-        navigate(targetHref);
-      }
-    },
-    [onItemClick, navigate],
-  );
-  const normalizedMenuItems: MenuItem[] = React.useMemo(() => {
-    if (!Array.isArray(menuItems)) return [];
-    return menuItems.map((item: any) => ({
-      label: item?.label?.toString() ?? "",
-      href: item?.href?.toString(),
-      icon: item?.icon?.toString(),
-      content: Array.isArray(item?.content)
-        ? item.content.map((contentItem: any) => ({
-            title: contentItem?.title?.toString() ?? "",
-            description: contentItem?.description?.toString() ?? "",
-            href: contentItem?.href?.toString() ?? "",
-            icon: contentItem?.icon?.toString() ?? "",
-          }))
-        : undefined,
-    }));
-  }, [menuItems]);
-  return (
-    <NavigationMenuRoot {...props}>
-      <NavigationMenuList>
-        {normalizedMenuItems.map((item, index) => (
-          <NavigationMenuItem key={`${item.label}-${index}`}>
-            {item.content && item.content.length > 0 ? (
-              <>
-                <NavigationMenuTrigger
-                  className={cn(
-                    item.href &&
-                      isPageActive(item.href) &&
-                      "bg-accent text-accent-foreground",
-                  )}
-                  disabled={disabled}
-                >
-                  {item.label}
-                </NavigationMenuTrigger>
-                <NavigationMenuContent>
-                  <div className="grid w-[400px] gap-3 p-4 md:w-[500px] md:grid-cols-2 lg:w-[600px]">
-                    {item.content.map((contentItem, contentIndex) => (
-                      <NavigationMenuLink
-                        key={`${contentItem.title}-${contentIndex}`}
-                        className="cursor-pointer"
-                        onClick={() => handleItemClick(item, contentItem.href)}
-                      >
-                        <div className="flex items-center gap-2">
-                          {contentItem.icon && <Icon icon={contentItem.icon} />}
-                          {contentItem.title}
-                        </div>
-                        <p className="line-clamp-2 text-sm leading-snug text-muted-foreground">
-                          {contentItem.description}
-                        </p>
-                      </NavigationMenuLink>
-                    ))}
-                  </div>
-                </NavigationMenuContent>
-              </>
-            ) : (
-              <NavigationMenuLink
-                onClick={() => handleItemClick(item)}
-                className={cn(
-                  TRIGGER_CLASSES,
-                  "cursor-pointer",
-                  item.href &&
-                    isPageActive(item.href) &&
-                    "bg-accent text-accent-foreground",
-                  disabled && "pointer-events-none opacity-50",
-                )}
-              >
-                {item.label}
-              </NavigationMenuLink>
-            )}
-          </NavigationMenuItem>
-        ))}
-      </NavigationMenuList>
-    </NavigationMenuRoot>
-  );
-};
-
-// Properties Definition
-const propertiesDefinition: PropertiesPanelDefinition<NavigationMenuProps> = {
-  general: Section.category(PropsCategory.Content).children({
-    menuItems: Prop.array<MenuItem>(),
-  }),
-  interaction: Section.category(PropsCategory.Interaction).children({
-    disabled: Prop.boolean(),
-  }),
-
-  events: Section.category(PropsCategory.EventHandlers).children({
-    onItemClick: Prop.eventHandler(),
-  }),
-};
-
-// Editor Configuration
-const editorConfig: EditorConfig = {
-  icon: "menu",
-  description: "A collection of links for navigating websites",
-};
-
-// Registration
-registerComponent(NavigationMenu, propertiesDefinition).editorConfig(
-  editorConfig,
-);
-
 export {
   NavigationMenu,
-  NavigationMenuRoot,
   NavigationMenuList,
   NavigationMenuItem,
   NavigationMenuContent,
@@ -321,4 +164,5 @@ export {
   NavigationMenuLink,
   NavigationMenuIndicator,
   NavigationMenuViewport,
+  navigationMenuTriggerStyle,
 };

package/dist/migration-templates/app-fullstack/client/components/ui/pagination.tsx

@@ -5,15 +5,6 @@ import {
 } from "lucide-react";
 import React from "react";
 
-import { registerComponent } from "@superblocksteam/library";
-import {
-  Prop,
-  Section,
-  PropsCategory,
-  type PropertiesPanelDefinition,
-  type EditorConfig,
-} from "@superblocksteam/library";
-
 import { buttonVariants, type Button } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
 
@@ -126,41 +117,6 @@ function PaginationEllipsis({
   );
 }
 
-// Properties Definition
-const paginationLinkPropertiesDefinition: PropertiesPanelDefinition<PaginationLinkProps> =
-  {
-    general: Section.category(PropsCategory.Content).children({
-      isActive: Prop.boolean(),
-    }),
-    appearance: Section.category(PropsCategory.Appearance).children({
-      size: Prop.string<"sm" | "default" | "lg">(),
-    }),
-    interaction: Section.category(PropsCategory.Interaction).children({
-      disabled: Prop.boolean(),
-    }),
-    events: Section.category(PropsCategory.EventHandlers).children({
-      onClick: Prop.eventHandler(),
-    }),
-  };
-
-// Editor Configuration
-const editorConfig: EditorConfig = {
-  icon: "custom",
-  isDraggable: true,
-  description:
-    "Pagination component with page navigation, next and previous links for navigating through large datasets.",
-};
-
-// Registration
-registerComponent(Pagination).editorConfig(editorConfig);
-
-registerComponent(PaginationLink, paginationLinkPropertiesDefinition);
-registerComponent(PaginationNext, paginationLinkPropertiesDefinition);
-registerComponent(PaginationPrevious, paginationLinkPropertiesDefinition);
-registerComponent(PaginationEllipsis);
-registerComponent(PaginationItem);
-registerComponent(PaginationContent);
-
 export {
   Pagination,
   PaginationContent,