@gamecp/ui 0.1.26 → 0.1.29

package/dist/index.d.mts

@@ -213,6 +213,19 @@ interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
 }
 declare const Link: React__default.ForwardRefExoticComponent<LinkProps & React__default.RefAttributes<HTMLAnchorElement>>;
 
+interface SidebarNavItemProps {
+    href: string;
+    icon?: IconType;
+    children: React__default.ReactNode;
+    active?: boolean;
+    className?: string;
+    title?: string;
+    exact?: boolean;
+    onClick?: () => void;
+    isButton?: boolean;
+}
+declare function SidebarNavItem({ href, icon: Icon, children, active, className, title, exact, onClick, isButton, }: SidebarNavItemProps): react_jsx_runtime.JSX.Element;
+
 interface LoadingSpinnerProps {
     message?: string;
     className?: string;
@@ -265,8 +278,9 @@ interface SwitchProps {
     className?: string;
     size?: 'sm' | 'md' | 'lg';
     variant?: SwitchVariant;
+    labelPosition?: 'left' | 'right';
 }
-declare function Switch({ checked, onChange, disabled, label, description, className, size, variant, }: SwitchProps): react_jsx_runtime.JSX.Element;
+declare function Switch({ checked, onChange, disabled, label, description, className, size, variant, labelPosition, }: SwitchProps): react_jsx_runtime.JSX.Element;
 
 interface SmartDropdownProps {
     isOpen: boolean;
@@ -634,4 +648,4 @@ declare function IconButtonWithCount({ icon, label, count, onClick, onClear, sho
 
 declare const VERSION = "0.1.3";
 
-export { ActionButton, Badge, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, ConfirmDialog, type ConfirmDialogOptions, Container, DataTable, DataTableActions, DataTableBody, DataTableCell, DataTableEmptyState, DataTableHeader, DataTableHeaderCell, DataTableLoadingState, DataTableRow, EmptyState, FilterSelect, FilterToggleButton, FormInput, FormSection, Grid, IconButtonWithCount, InfoBox, Link, type LinkProps, LoadingSpinner, MobileSearchLayout, Modal, PageHeader, RefreshButton, SearchCard, SearchCardContent, SearchCardHeader, SearchInput, SharedTooltip, Skeleton, SkeletonCard, SkeletonEnvironmentsList, SkeletonForm, SkeletonGameCard, SkeletonGameServerCard, SkeletonGameServerCards, SkeletonGameServerTable, SkeletonGamesTable, SkeletonItem, SkeletonList, SkeletonNodeCard, SkeletonNodeCards, SkeletonNodeTable, SkeletonRecentActivity, SkeletonSearchCard, SkeletonStats, SkeletonTable, SkeletonTenantCard, SkeletonUserCard, SmartDropdown, SmartSelect, Spinner, StatusBadge, StickyActionsColumn, Switch, type SwitchVariant, Typography, VERSION, ViewToggle, useConfirmDialog };
+export { ActionButton, Badge, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, ConfirmDialog, type ConfirmDialogOptions, Container, DataTable, DataTableActions, DataTableBody, DataTableCell, DataTableEmptyState, DataTableHeader, DataTableHeaderCell, DataTableLoadingState, DataTableRow, EmptyState, FilterSelect, FilterToggleButton, FormInput, FormSection, Grid, IconButtonWithCount, InfoBox, Link, type LinkProps, LoadingSpinner, MobileSearchLayout, Modal, PageHeader, RefreshButton, SearchCard, SearchCardContent, SearchCardHeader, SearchInput, SharedTooltip, SidebarNavItem, type SidebarNavItemProps, Skeleton, SkeletonCard, SkeletonEnvironmentsList, SkeletonForm, SkeletonGameCard, SkeletonGameServerCard, SkeletonGameServerCards, SkeletonGameServerTable, SkeletonGamesTable, SkeletonItem, SkeletonList, SkeletonNodeCard, SkeletonNodeCards, SkeletonNodeTable, SkeletonRecentActivity, SkeletonSearchCard, SkeletonStats, SkeletonTable, SkeletonTenantCard, SkeletonUserCard, SmartDropdown, SmartSelect, Spinner, StatusBadge, StickyActionsColumn, Switch, type SwitchVariant, Typography, VERSION, ViewToggle, useConfirmDialog };

package/dist/index.d.ts

@@ -213,6 +213,19 @@ interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
 }
 declare const Link: React__default.ForwardRefExoticComponent<LinkProps & React__default.RefAttributes<HTMLAnchorElement>>;
 
+interface SidebarNavItemProps {
+    href: string;
+    icon?: IconType;
+    children: React__default.ReactNode;
+    active?: boolean;
+    className?: string;
+    title?: string;
+    exact?: boolean;
+    onClick?: () => void;
+    isButton?: boolean;
+}
+declare function SidebarNavItem({ href, icon: Icon, children, active, className, title, exact, onClick, isButton, }: SidebarNavItemProps): react_jsx_runtime.JSX.Element;
+
 interface LoadingSpinnerProps {
     message?: string;
     className?: string;
@@ -265,8 +278,9 @@ interface SwitchProps {
     className?: string;
     size?: 'sm' | 'md' | 'lg';
     variant?: SwitchVariant;
+    labelPosition?: 'left' | 'right';
 }
-declare function Switch({ checked, onChange, disabled, label, description, className, size, variant, }: SwitchProps): react_jsx_runtime.JSX.Element;
+declare function Switch({ checked, onChange, disabled, label, description, className, size, variant, labelPosition, }: SwitchProps): react_jsx_runtime.JSX.Element;
 
 interface SmartDropdownProps {
     isOpen: boolean;
@@ -634,4 +648,4 @@ declare function IconButtonWithCount({ icon, label, count, onClick, onClear, sho
 
 declare const VERSION = "0.1.3";
 
-export { ActionButton, Badge, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, ConfirmDialog, type ConfirmDialogOptions, Container, DataTable, DataTableActions, DataTableBody, DataTableCell, DataTableEmptyState, DataTableHeader, DataTableHeaderCell, DataTableLoadingState, DataTableRow, EmptyState, FilterSelect, FilterToggleButton, FormInput, FormSection, Grid, IconButtonWithCount, InfoBox, Link, type LinkProps, LoadingSpinner, MobileSearchLayout, Modal, PageHeader, RefreshButton, SearchCard, SearchCardContent, SearchCardHeader, SearchInput, SharedTooltip, Skeleton, SkeletonCard, SkeletonEnvironmentsList, SkeletonForm, SkeletonGameCard, SkeletonGameServerCard, SkeletonGameServerCards, SkeletonGameServerTable, SkeletonGamesTable, SkeletonItem, SkeletonList, SkeletonNodeCard, SkeletonNodeCards, SkeletonNodeTable, SkeletonRecentActivity, SkeletonSearchCard, SkeletonStats, SkeletonTable, SkeletonTenantCard, SkeletonUserCard, SmartDropdown, SmartSelect, Spinner, StatusBadge, StickyActionsColumn, Switch, type SwitchVariant, Typography, VERSION, ViewToggle, useConfirmDialog };
+export { ActionButton, Badge, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, ConfirmDialog, type ConfirmDialogOptions, Container, DataTable, DataTableActions, DataTableBody, DataTableCell, DataTableEmptyState, DataTableHeader, DataTableHeaderCell, DataTableLoadingState, DataTableRow, EmptyState, FilterSelect, FilterToggleButton, FormInput, FormSection, Grid, IconButtonWithCount, InfoBox, Link, type LinkProps, LoadingSpinner, MobileSearchLayout, Modal, PageHeader, RefreshButton, SearchCard, SearchCardContent, SearchCardHeader, SearchInput, SharedTooltip, SidebarNavItem, type SidebarNavItemProps, Skeleton, SkeletonCard, SkeletonEnvironmentsList, SkeletonForm, SkeletonGameCard, SkeletonGameServerCard, SkeletonGameServerCards, SkeletonGameServerTable, SkeletonGamesTable, SkeletonItem, SkeletonList, SkeletonNodeCard, SkeletonNodeCards, SkeletonNodeTable, SkeletonRecentActivity, SkeletonSearchCard, SkeletonStats, SkeletonTable, SkeletonTenantCard, SkeletonUserCard, SmartDropdown, SmartSelect, Spinner, StatusBadge, StickyActionsColumn, Switch, type SwitchVariant, Typography, VERSION, ViewToggle, useConfirmDialog };

package/dist/index.js

@@ -6,6 +6,7 @@ var ri = require('react-icons/ri');
 var reactDom = require('react-dom');
 var framerMotion = require('framer-motion');
 var NextLink = require('next/link');
+var navigation = require('next/navigation');
 var reactTooltip = require('react-tooltip');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -291,7 +292,7 @@ function Card({
     variantClasses2[variant],
     paddingClasses[padding],
     borderAccentClasses[borderAccent],
-    overflow !== "visible" || activeHeaderBorder ? `overflow-${overflow === "visible" && activeHeaderBorder ? "hidden" : overflow}` : "",
+    overflow !== "visible" ? `overflow-${overflow}` : "",
     activeHeaderBorder ? "relative" : "",
     hover ? "hover:shadow-md transition-shadow" : "",
     clickable || onClick ? "cursor-pointer" : "",
@@ -1932,7 +1933,7 @@ function SkeletonGamesTable({
           /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-6 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider", children: "Created" }),
           /* @__PURE__ */ jsxRuntime.jsx("th", { className: "px-2 py-1 rounded-md backdrop-blur-sm text-center text-xs font-medium text-muted-foreground uppercase tracking-wider sticky right-0", children: "Actions" })
         ] }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("tbody", { className: "table-body-card", children: Array.from({ length: items }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: "hover:bg-muted hover:text-muted-foreground", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("tbody", { className: "table-body-card", children: Array.from({ length: items }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: "hover:bg-muted/50", children: [
           /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center", children: [
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-shrink-0 h-10 w-10", children: /* @__PURE__ */ jsxRuntime.jsx(SkeletonItem, { width: "w-10", height: "h-10", rounded: true }) }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-4 min-w-0 flex-1", children: [
@@ -2605,6 +2606,63 @@ var Link = React4.forwardRef(
 );
 Link.displayName = "Link";
 var Link_default = Link;
+function SidebarNavItem({
+  href,
+  icon: Icon,
+  children,
+  active,
+  className = "",
+  title,
+  exact = false,
+  onClick,
+  isButton = false
+}) {
+  const pathname = navigation.usePathname();
+  const isActive = active !== void 0 ? active : exact ? pathname === href : pathname === href || pathname?.startsWith(`${href}/`);
+  const commonClasses = `group flex items-center px-3 py-2 text-sm font-medium rounded-md transition-all duration-150 ease-in-out ${isActive ? "" : "hover:bg-muted"} ${className}`;
+  if (isButton) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        onClick,
+        title,
+        "aria-current": isActive ? "page" : void 0,
+        className: `w-full text-left ${commonClasses}`,
+        children: [
+          Icon && /* @__PURE__ */ jsxRuntime.jsx(
+            Icon,
+            {
+              className: `mr-3 h-5 w-5 shrink-0 transition-all duration-150 ease-in-out`,
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    NextLink__default.default,
+    {
+      href,
+      onClick,
+      title,
+      "aria-current": isActive ? "page" : void 0,
+      className: commonClasses,
+      children: [
+        Icon && /* @__PURE__ */ jsxRuntime.jsx(
+          Icon,
+          {
+            className: `mr-3 h-5 w-5 shrink-0 transition-all duration-150 ease-in-out`,
+            "aria-hidden": "true"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { children })
+      ]
+    }
+  );
+}
 var LoadingSpinner = ({
   message = "Initializing...",
   className,
@@ -2671,7 +2729,8 @@ function Switch({
   description,
   className = "",
   size = "md",
-  variant = "default"
+  variant = "default",
+  labelPosition = "right"
 }) {
   const toggle = () => {
     if (!disabled) {
@@ -2686,38 +2745,43 @@ function Switch({
   const variants = {
     default: {
       checked: "bg-primary",
-      unchecked: "bg-muted",
+      unchecked: "bg-input",
       ring: "focus:ring-primary"
     },
     success: {
       checked: "bg-success",
-      unchecked: "bg-muted",
+      unchecked: "bg-input",
       ring: "focus:ring-success"
     },
     danger: {
       checked: "bg-destructive",
-      unchecked: "bg-muted",
+      unchecked: "bg-input",
       ring: "focus:ring-destructive"
     },
     warning: {
       checked: "bg-warning",
-      unchecked: "bg-muted",
+      unchecked: "bg-input",
       ring: "focus:ring-warning"
     },
     info: {
       checked: "bg-info",
-      unchecked: "bg-muted",
+      unchecked: "bg-input",
       ring: "focus:ring-info"
     },
     embedded: {
       checked: "bg-success",
-      unchecked: "bg-gray-300 dark:bg-gray-600",
+      unchecked: "bg-input",
       ring: "focus:ring-success"
     }
   };
   const currentSize = sizes[size];
   const currentVariant = variants[variant];
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex items-start ${className}`, children: [
+  const LabelContent = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${labelPosition === "left" ? "mr-3 flex-1 text-left" : "ml-3 w-fit"} flex flex-col justify-center gap-1`, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-sm font-medium text-foreground cursor-pointer", onClick: toggle, children: label }),
+    description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground leading-snug", children: description })
+  ] });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex items-center ${labelPosition === "left" ? "justify-between" : ""} ${className}`, children: [
+    labelPosition === "left" && (label || description) && LabelContent,
     /* @__PURE__ */ jsxRuntime.jsx(
       "button",
       {
@@ -2747,10 +2811,7 @@ function Switch({
         )
       }
     ),
-    (label || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-3 text-sm leading-6", children: [
-      label && /* @__PURE__ */ jsxRuntime.jsx("label", { className: "font-medium text-foreground cursor-pointer", onClick: toggle, children: label }),
-      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: description })
-    ] })
+    labelPosition === "right" && (label || description) && LabelContent
   ] });
 }
 var variantClasses4 = {
@@ -3630,6 +3691,7 @@ exports.SearchCardContent = SearchCardContent;
 exports.SearchCardHeader = SearchCardHeader;
 exports.SearchInput = SearchInput;
 exports.SharedTooltip = SharedTooltip;
+exports.SidebarNavItem = SidebarNavItem;
 exports.Skeleton = Skeleton;
 exports.SkeletonCard = SkeletonCard;
 exports.SkeletonEnvironmentsList = SkeletonEnvironmentsList;