@yimingliao/cms 0.0.129 → 0.0.131

package/dist/src/client/interfaces/components/shadcn/sidebar.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
 import { PanelLeftIcon } from 'lucide-react';
@@ -79,7 +80,7 @@ function SidebarProvider({
     }),
     [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
   );
-  return /* @__PURE__ */ React.createElement(SidebarContext.Provider, { value: contextValue }, /* @__PURE__ */ React.createElement(TooltipProvider, { delayDuration: 0 }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "sidebar-wrapper",
@@ -92,10 +93,10 @@ function SidebarProvider({
         "group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full",
         className
       ),
-      ...props
-    },
-    children
-  )));
+      ...props,
+      children
+    }
+  ) }) });
 }
 function Sidebar({
   side = "left",
@@ -107,7 +108,7 @@ function Sidebar({
 }) {
   const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
   if (collapsible === "none") {
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsx(
       "div",
       {
         "data-slot": "sidebar",
@@ -115,13 +116,13 @@ function Sidebar({
           "bg-sidebar text-sidebar-foreground flex h-full w-(--sidebar-width) flex-col",
           className
         ),
-        ...props
-      },
-      children
+        ...props,
+        children
+      }
     );
   }
   if (isMobile) {
-    return /* @__PURE__ */ React.createElement(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props }, /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsx(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsxs(
       SheetContent,
       {
         "data-sidebar": "sidebar",
@@ -131,13 +132,18 @@ function Sidebar({
         style: {
           "--sidebar-width": SIDEBAR_WIDTH_MOBILE
         },
-        side
-      },
-      /* @__PURE__ */ React.createElement(SheetHeader, { className: "sr-only" }, /* @__PURE__ */ React.createElement(SheetTitle, null, "Sidebar"), /* @__PURE__ */ React.createElement(SheetDescription, null, "Displays the mobile sidebar.")),
-      /* @__PURE__ */ React.createElement("div", { className: "flex h-full w-full flex-col" }, children)
-    ));
+        side,
+        children: [
+          /* @__PURE__ */ jsxs(SheetHeader, { className: "sr-only", children: [
+            /* @__PURE__ */ jsx(SheetTitle, { children: "Sidebar" }),
+            /* @__PURE__ */ jsx(SheetDescription, { children: "Displays the mobile sidebar." })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "flex h-full w-full flex-col", children })
+        ]
+      }
+    ) });
   }
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxs(
     "div",
     {
       className: "group peer text-sidebar-foreground hidden md:block",
@@ -145,43 +151,45 @@ function Sidebar({
       "data-collapsible": state === "collapsed" ? collapsible : "",
       "data-variant": variant,
       "data-side": side,
-      "data-slot": "sidebar"
-    },
-    /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        "data-slot": "sidebar-gap",
-        className: cn(
-          "relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear",
-          "group-data-[collapsible=offcanvas]:w-0",
-          "group-data-[side=right]:rotate-180",
-          variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)"
-        )
-      }
-    ),
-    /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        "data-slot": "sidebar-container",
-        className: cn(
-          "fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex",
-          side === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
-          // Adjust the padding for floating and inset variants.
-          variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l",
-          className
+      "data-slot": "sidebar",
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-slot": "sidebar-gap",
+            className: cn(
+              "relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear",
+              "group-data-[collapsible=offcanvas]:w-0",
+              "group-data-[side=right]:rotate-180",
+              variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)"
+            )
+          }
         ),
-        ...props
-      },
-      /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          "data-sidebar": "sidebar",
-          "data-slot": "sidebar-inner",
-          className: "bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm"
-        },
-        children
-      )
-    )
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-slot": "sidebar-container",
+            className: cn(
+              "fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex",
+              side === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
+              // Adjust the padding for floating and inset variants.
+              variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l",
+              className
+            ),
+            ...props,
+            children: /* @__PURE__ */ jsx(
+              "div",
+              {
+                "data-sidebar": "sidebar",
+                "data-slot": "sidebar-inner",
+                className: "bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm",
+                children
+              }
+            )
+          }
+        )
+      ]
+    }
   );
 }
 function SidebarTrigger({
@@ -190,7 +198,7 @@ function SidebarTrigger({
   ...props
 }) {
   const { toggleSidebar } = useSidebar();
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxs(
     Button,
     {
       "data-sidebar": "trigger",
@@ -202,15 +210,17 @@ function SidebarTrigger({
         onClick?.(event);
         toggleSidebar();
       },
-      ...props
-    },
-    /* @__PURE__ */ React.createElement(PanelLeftIcon, null),
-    /* @__PURE__ */ React.createElement("span", { className: "sr-only" }, "Toggle Sidebar")
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(PanelLeftIcon, {}),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Toggle Sidebar" })
+      ]
+    }
   );
 }
 function SidebarRail({ className, ...props }) {
   const { toggleSidebar } = useSidebar();
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "button",
     {
       "data-sidebar": "rail",
@@ -233,7 +243,7 @@ function SidebarRail({ className, ...props }) {
   );
 }
 function SidebarInset({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "main",
     {
       "data-slot": "sidebar-inset",
@@ -251,7 +261,7 @@ function SidebarInput({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Input,
     {
       "data-slot": "sidebar-input",
@@ -262,7 +272,7 @@ function SidebarInput({
   );
 }
 function SidebarHeader({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "sidebar-header",
@@ -273,7 +283,7 @@ function SidebarHeader({ className, ...props }) {
   );
 }
 function SidebarFooter({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "sidebar-footer",
@@ -287,7 +297,7 @@ function SidebarSeparator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Separator,
     {
       "data-slot": "sidebar-separator",
@@ -298,7 +308,7 @@ function SidebarSeparator({
   );
 }
 function SidebarContent({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "sidebar-content",
@@ -312,7 +322,7 @@ function SidebarContent({ className, ...props }) {
   );
 }
 function SidebarGroup({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "sidebar-group",
@@ -328,7 +338,7 @@ function SidebarGroupLabel({
   ...props
 }) {
   const Comp = asChild ? Slot : "div";
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Comp,
     {
       "data-slot": "sidebar-group-label",
@@ -348,7 +358,7 @@ function SidebarGroupAction({
   ...props
 }) {
   const Comp = asChild ? Slot : "button";
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Comp,
     {
       "data-slot": "sidebar-group-action",
@@ -368,7 +378,7 @@ function SidebarGroupContent({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "sidebar-group-content",
@@ -379,7 +389,7 @@ function SidebarGroupContent({
   );
 }
 function SidebarMenu({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "ul",
     {
       "data-slot": "sidebar-menu",
@@ -390,7 +400,7 @@ function SidebarMenu({ className, ...props }) {
   );
 }
 function SidebarMenuItem({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "li",
     {
       "data-slot": "sidebar-menu-item",
@@ -432,7 +442,7 @@ function SidebarMenuButton({
 }) {
   const Comp = asChild ? Slot : "button";
   const { isMobile, state } = useSidebar();
-  const button = /* @__PURE__ */ React.createElement(
+  const button = /* @__PURE__ */ jsx(
     Comp,
     {
       "data-slot": "sidebar-menu-button",
@@ -455,15 +465,18 @@ function SidebarMenuButton({
       children: tooltip
     };
   }
-  return /* @__PURE__ */ React.createElement(Tooltip, null, /* @__PURE__ */ React.createElement(TooltipTrigger, { asChild: true }, button), /* @__PURE__ */ React.createElement(
-    TooltipContent,
-    {
-      side: "right",
-      align: "center",
-      hidden: state !== "collapsed" || isMobile,
-      ...tooltip
-    }
-  ));
+  return /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: button }),
+    /* @__PURE__ */ jsx(
+      TooltipContent,
+      {
+        side: "right",
+        align: "center",
+        hidden: state !== "collapsed" || isMobile,
+        ...tooltip
+      }
+    )
+  ] });
 }
 function SidebarMenuAction({
   className,
@@ -472,7 +485,7 @@ function SidebarMenuAction({
   ...props
 }) {
   const Comp = asChild ? Slot : "button";
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Comp,
     {
       "data-slot": "sidebar-menu-action",
@@ -496,7 +509,7 @@ function SidebarMenuBadge({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "sidebar-menu-badge",
@@ -523,35 +536,37 @@ function SidebarMenuSkeleton({
   React.useEffect(() => {
     setWidth(`${Math.floor(Math.random() * 40) + 50}%`);
   }, []);
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxs(
     "div",
     {
       "data-slot": "sidebar-menu-skeleton",
       "data-sidebar": "menu-skeleton",
       className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
-      ...props
-    },
-    showIcon && /* @__PURE__ */ React.createElement(
-      Skeleton,
-      {
-        className: "size-4 rounded-md",
-        "data-sidebar": "menu-skeleton-icon"
-      }
-    ),
-    /* @__PURE__ */ React.createElement(
-      Skeleton,
-      {
-        className: "h-4 max-w-(--skeleton-width) flex-1",
-        "data-sidebar": "menu-skeleton-text",
-        style: {
-          "--skeleton-width": width
-        }
-      }
-    )
+      ...props,
+      children: [
+        showIcon && /* @__PURE__ */ jsx(
+          Skeleton,
+          {
+            className: "size-4 rounded-md",
+            "data-sidebar": "menu-skeleton-icon"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Skeleton,
+          {
+            className: "h-4 max-w-(--skeleton-width) flex-1",
+            "data-sidebar": "menu-skeleton-text",
+            style: {
+              "--skeleton-width": width
+            }
+          }
+        )
+      ]
+    }
   );
 }
 function SidebarMenuSub({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "ul",
     {
       "data-slot": "sidebar-menu-sub",
@@ -569,7 +584,7 @@ function SidebarMenuSubItem({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "li",
     {
       "data-slot": "sidebar-menu-sub-item",
@@ -587,7 +602,7 @@ function SidebarMenuSubButton({
   ...props
 }) {
   const Comp = asChild ? Slot : "a";
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Comp,
     {
       "data-slot": "sidebar-menu-sub-button",

package/dist/src/client/interfaces/components/shadcn/skeleton.js

@@ -1,10 +1,11 @@
+import { jsx } from 'react/jsx-runtime';
 import 'react';
 import 'ua-parser-js';
 import { cn } from '../../../applications/shadcn/utils.js';
 import 'next/navigation';
 
 function Skeleton({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "skeleton",

package/dist/src/client/interfaces/components/shadcn/spinner.js

@@ -1,3 +1,4 @@
+import { jsx } from 'react/jsx-runtime';
 import { Loader2Icon } from 'lucide-react';
 import 'react';
 import 'ua-parser-js';
@@ -5,7 +6,7 @@ import { cn } from '../../../applications/shadcn/utils.js';
 import 'next/navigation';
 
 function Spinner({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Loader2Icon,
     {
       role: "status",

package/dist/src/client/interfaces/components/shadcn/textarea.js

@@ -1,10 +1,11 @@
-import * as React from 'react';
+import { jsx } from 'react/jsx-runtime';
+import 'react';
 import 'ua-parser-js';
 import { cn } from '../../../applications/shadcn/utils.js';
 import 'next/navigation';
 
 function Textarea({ className, ...props }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "textarea",
     {
       "data-slot": "textarea",

package/dist/src/client/interfaces/components/shadcn/tooltip.js

@@ -1,6 +1,7 @@
 "use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
-import * as React from 'react';
+import 'react';
 import 'ua-parser-js';
 import { cn } from '../../../applications/shadcn/utils.js';
 import 'next/navigation';
@@ -9,7 +10,7 @@ function TooltipProvider({
   delayDuration = 0,
   ...props
 }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     TooltipPrimitive.Provider,
     {
       "data-slot": "tooltip-provider",
@@ -21,12 +22,12 @@ function TooltipProvider({
 function Tooltip({
   ...props
 }) {
-  return /* @__PURE__ */ React.createElement(TooltipProvider, null, /* @__PURE__ */ React.createElement(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }));
+  return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
 }
 function TooltipTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ React.createElement(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
+  return /* @__PURE__ */ jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
 }
 function TooltipContent({
   className,
@@ -34,7 +35,7 @@ function TooltipContent({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ React.createElement(TooltipPrimitive.Portal, null, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
     TooltipPrimitive.Content,
     {
       "data-slot": "tooltip-content",
@@ -43,11 +44,13 @@ function TooltipContent({
         "bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
         className
       ),
-      ...props
-    },
-    children,
-    /* @__PURE__ */ React.createElement(TooltipPrimitive.Arrow, { className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
-  ));
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(TooltipPrimitive.Arrow, { className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
+      ]
+    }
+  ) });
 }
 
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

package/dist/src/client/interfaces/components/ui/blocks/list-cards-container/list-cards-container.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
 import { useEffect } from 'react';
 import '@radix-ui/react-avatar';
@@ -43,29 +44,40 @@ function ListCardsContainer({
   useEffect(() => {
     setPage(1);
   }, [searchString, setPage]);
-  return /* @__PURE__ */ React.createElement("div", { className: "flex h-full flex-col gap-6" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-between" }, headerChildren, /* @__PURE__ */ React.createElement("div", { className: "ml-auto w-64" }, /* @__PURE__ */ React.createElement(
-    SearchInput,
-    {
-      searchString,
-      setSearchString,
-      isLoading: isFetching
-    }
-  ))), /* @__PURE__ */ React.createElement("div", { className: "max-h-[88%] flex-1 overflow-y-auto" }, isFetching ? /* @__PURE__ */ React.createElement(Spinner, null) : isNotFound ? /* @__PURE__ */ React.createElement("p", { className: "text-sm opacity-50" }, t("ui.no-data.text")) : /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap gap-4" }, children)), /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React.createElement("div", { className: "w-52" }), /* @__PURE__ */ React.createElement(
-    Pagination,
-    {
-      page,
-      setPage,
-      pageSize,
-      total
-    }
-  ), /* @__PURE__ */ React.createElement(
-    PageSizeSelector,
-    {
-      pageSize,
-      setPageSize,
-      setPage
-    }
-  )));
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col gap-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      headerChildren,
+      /* @__PURE__ */ jsx("div", { className: "ml-auto w-64", children: /* @__PURE__ */ jsx(
+        SearchInput,
+        {
+          searchString,
+          setSearchString,
+          isLoading: isFetching
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "max-h-[88%] flex-1 overflow-y-auto", children: isFetching ? /* @__PURE__ */ jsx(Spinner, {}) : isNotFound ? /* @__PURE__ */ jsx("p", { className: "text-sm opacity-50", children: t("ui.no-data.text") }) : /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-4", children }) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsx("div", { className: "w-52" }),
+      /* @__PURE__ */ jsx(
+        Pagination,
+        {
+          page,
+          setPage,
+          pageSize,
+          total
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        PageSizeSelector,
+        {
+          pageSize,
+          setPageSize,
+          setPage
+        }
+      )
+    ] })
+  ] });
 }
 
 export { ListCardsContainer };

package/dist/src/client/interfaces/components/ui/blocks/list-cards-container/page-size-selector.js

@@ -1,3 +1,4 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
 import 'lucide-react';
 import 'react';
@@ -24,20 +25,25 @@ function PageSizeSelector({
   setPage
 }) {
   const { t } = useTranslator();
-  return /* @__PURE__ */ React.createElement("div", { className: "flex w-52 items-center gap-4" }, /* @__PURE__ */ React.createElement("p", { className: "text-muted-foreground text-sm whitespace-nowrap" }, t("ui.layout.item-list-container.items-per-page.text")), /* @__PURE__ */ React.createElement(
-    Select,
-    {
-      value: String(pageSize),
-      onValueChange: (value) => {
-        setPageSize(Number(value ?? 20));
-        setPage(1);
-      },
-      className: "w-full"
-    },
-    /* @__PURE__ */ React.createElement(Option, { value: String(20) }, "20"),
-    /* @__PURE__ */ React.createElement(Option, { value: String(40) }, "40"),
-    /* @__PURE__ */ React.createElement(Option, { value: String(80) }, "80")
-  ));
+  return /* @__PURE__ */ jsxs("div", { className: "flex w-52 items-center gap-4", children: [
+    /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm whitespace-nowrap", children: t("ui.layout.item-list-container.items-per-page.text") }),
+    /* @__PURE__ */ jsxs(
+      Select,
+      {
+        value: String(pageSize),
+        onValueChange: (value) => {
+          setPageSize(Number(value ?? 20));
+          setPage(1);
+        },
+        className: "w-full",
+        children: [
+          /* @__PURE__ */ jsx(Option, { value: String(20), children: "20" }),
+          /* @__PURE__ */ jsx(Option, { value: String(40), children: "40" }),
+          /* @__PURE__ */ jsx(Option, { value: String(80), children: "80" })
+        ]
+      }
+    )
+  ] });
 }
 
 export { PageSizeSelector };