@codefast/ui 0.3.10 → 0.3.11-canary.0

package/dist/components/navigation-menu.cjs

@@ -39,13 +39,13 @@ const external_lucide_react_namespaceObject = require("lucide-react");
 const external_button_cjs_namespaceObject = require("./button.cjs");
 const navigationMenuTriggerVariants = (0, tailwind_variants_namespaceObject.tv)({
     base: (0, external_button_cjs_namespaceObject.buttonVariants)({
-        className: 'data-[state=open]:bg-secondary/50 data-[state=open]:text-secondary-foreground group/navigation-menu-trigger focus-visible:bg-secondary dark:hover:not-disabled:bg-secondary',
-        variant: 'ghost'
+        className: "data-[state=open]:bg-secondary/50 data-[state=open]:text-secondary-foreground group/navigation-menu-trigger focus-visible:bg-secondary dark:hover:not-disabled:bg-secondary",
+        variant: "ghost"
     })
 });
 function NavigationMenu({ children, className, viewport = true, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_navigation_menu_namespaceObject.Root, {
-        className: (0, tailwind_variants_namespaceObject.cn)('group/navigation-menu relative flex max-w-max flex-1 items-center justify-center', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("group/navigation-menu relative flex max-w-max flex-1 items-center justify-center", className),
         "data-slot": "navigation-menu",
         "data-viewport": viewport,
         ...props,
@@ -57,7 +57,7 @@ function NavigationMenu({ children, className, viewport = true, ...props }) {
 }
 function NavigationMenuList({ children, className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_navigation_menu_namespaceObject.List, {
-        className: (0, tailwind_variants_namespaceObject.cn)('flex flex-1 list-none items-center justify-center gap-1', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex flex-1 list-none items-center justify-center gap-1", className),
         "data-slot": "navigation-menu-list",
         ...props,
         children: [
@@ -70,7 +70,7 @@ function NavigationMenuList({ children, className, ...props }) {
 }
 function NavigationMenuItem({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_navigation_menu_namespaceObject.Item, {
-        className: (0, tailwind_variants_namespaceObject.cn)('group-data-[viewport=false]/navigation-menu:relative', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("group-data-[viewport=false]/navigation-menu:relative", className),
         "data-slot": "navigation-menu-item",
         ...props
     });
@@ -93,14 +93,14 @@ function NavigationMenuTrigger({ children, className, ...props }) {
 }
 function NavigationMenuContent({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_navigation_menu_namespaceObject.Content, {
-        className: (0, tailwind_variants_namespaceObject.cn)('data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in-0 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out-0 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 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 ease-ui top-0 left-0 w-full group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-2 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:p-1 group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=true]/navigation-menu:p-2 md:absolute md:w-auto', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("top-0 left-0 w-full ease-ui group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-2 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:p-1 group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=true]/navigation-menu:p-2 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-0 data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out-0 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 md:absolute md:w-auto", className),
         "data-slot": "navigation-menu-content",
         ...props
     });
 }
 function NavigationMenuLink({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_navigation_menu_namespaceObject.Link, {
-        className: (0, tailwind_variants_namespaceObject.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 data-[variant=destructive]:[&_svg:not([class*='text-'])]:text-destructive/80 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm outline-hidden transition [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex flex-col gap-1 rounded-sm p-2 text-sm outline-hidden transition hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground 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]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:[&_svg:not([class*='text-'])]:text-destructive/80", className),
         "data-slot": "navigation-menu-link",
         ...props
     });
@@ -109,7 +109,7 @@ function NavigationMenuViewport({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
         className: "absolute top-full left-0 z-30 flex justify-center perspective-distant",
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_navigation_menu_namespaceObject.Viewport, {
-            className: (0, tailwind_variants_namespaceObject.cn)('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-90 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 ease-ui relative mt-2 min-h-[calc(var(--radix-navigation-menu-viewport-height)+2px)] w-full origin-[top_center] overflow-hidden rounded-lg border shadow-lg transition-[width,height] sm:min-w-[calc(var(--radix-navigation-menu-viewport-width)+2px)]', className),
+            className: (0, tailwind_variants_namespaceObject.cn)("relative mt-2 min-h-[calc(var(--radix-navigation-menu-viewport-height)+2px)] w-full origin-[top_center] overflow-hidden rounded-lg border bg-popover text-popover-foreground shadow-lg transition-[width,height] ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-90 sm:min-w-[calc(var(--radix-navigation-menu-viewport-width)+2px)]", className),
             "data-slot": "navigation-menu-viewport",
             ...props
         })
@@ -117,11 +117,11 @@ function NavigationMenuViewport({ className, ...props }) {
 }
 function NavigationMenuIndicator({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_navigation_menu_namespaceObject.Indicator, {
-        className: (0, tailwind_variants_namespaceObject.cn)('data-[state=visible]:fade-in-0 ease-ui data-[state=visible]:animate-in data-[state=hidden]:fade-out-0 data-[state=hidden]:animate-out top-full z-10 flex h-2 items-center justify-center overflow-hidden', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("top-full z-10 flex h-2 items-center justify-center overflow-hidden ease-ui data-[state=hidden]:animate-out data-[state=hidden]:fade-out-0 data-[state=visible]:animate-in data-[state=visible]:fade-in-0", className),
         "data-slot": "navigation-menu-indicator",
         ...props,
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-            className: "bg-popover text-popover-foreground relative top-[60%] size-2.5 rotate-45 rounded-tl-xs"
+            className: "relative top-[60%] size-2.5 rotate-45 rounded-tl-xs bg-popover text-popover-foreground"
         })
     });
 }

package/dist/components/navigation-menu.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
+import type { ComponentProps, JSX } from "react";
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 declare const navigationMenuTriggerVariants: import("@codefast/tailwind-variants").VariantFunctionType<import("@codefast/tailwind-variants").ConfigurationSchema, Record<string, never>>;
 interface NavigationMenuProps extends ComponentProps<typeof NavigationMenuPrimitive.Root> {
     viewport?: boolean;

package/dist/components/navigation-menu.js

@@ -5,13 +5,13 @@ import { ChevronDownIcon } from "lucide-react";
 import { buttonVariants } from "./button.js";
 const navigationMenuTriggerVariants = tv({
     base: buttonVariants({
-        className: 'data-[state=open]:bg-secondary/50 data-[state=open]:text-secondary-foreground group/navigation-menu-trigger focus-visible:bg-secondary dark:hover:not-disabled:bg-secondary',
-        variant: 'ghost'
+        className: "data-[state=open]:bg-secondary/50 data-[state=open]:text-secondary-foreground group/navigation-menu-trigger focus-visible:bg-secondary dark:hover:not-disabled:bg-secondary",
+        variant: "ghost"
     })
 });
 function NavigationMenu({ children, className, viewport = true, ...props }) {
     return /*#__PURE__*/ jsxs(Root, {
-        className: cn('group/navigation-menu relative flex max-w-max flex-1 items-center justify-center', className),
+        className: cn("group/navigation-menu relative flex max-w-max flex-1 items-center justify-center", className),
         "data-slot": "navigation-menu",
         "data-viewport": viewport,
         ...props,
@@ -23,7 +23,7 @@ function NavigationMenu({ children, className, viewport = true, ...props }) {
 }
 function NavigationMenuList({ children, className, ...props }) {
     return /*#__PURE__*/ jsxs(List, {
-        className: cn('flex flex-1 list-none items-center justify-center gap-1', className),
+        className: cn("flex flex-1 list-none items-center justify-center gap-1", className),
         "data-slot": "navigation-menu-list",
         ...props,
         children: [
@@ -36,7 +36,7 @@ function NavigationMenuList({ children, className, ...props }) {
 }
 function NavigationMenuItem({ className, ...props }) {
     return /*#__PURE__*/ jsx(Item, {
-        className: cn('group-data-[viewport=false]/navigation-menu:relative', className),
+        className: cn("group-data-[viewport=false]/navigation-menu:relative", className),
         "data-slot": "navigation-menu-item",
         ...props
     });
@@ -59,14 +59,14 @@ function NavigationMenuTrigger({ children, className, ...props }) {
 }
 function NavigationMenuContent({ className, ...props }) {
     return /*#__PURE__*/ jsx(Content, {
-        className: cn('data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in-0 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out-0 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 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 ease-ui top-0 left-0 w-full group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-2 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:p-1 group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=true]/navigation-menu:p-2 md:absolute md:w-auto', className),
+        className: cn("top-0 left-0 w-full ease-ui group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-2 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:p-1 group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=true]/navigation-menu:p-2 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-0 data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out-0 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 md:absolute md:w-auto", className),
         "data-slot": "navigation-menu-content",
         ...props
     });
 }
 function NavigationMenuLink({ className, ...props }) {
     return /*#__PURE__*/ jsx(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 data-[variant=destructive]:[&_svg:not([class*='text-'])]:text-destructive/80 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm outline-hidden transition [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: cn("flex flex-col gap-1 rounded-sm p-2 text-sm outline-hidden transition hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground 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]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:[&_svg:not([class*='text-'])]:text-destructive/80", className),
         "data-slot": "navigation-menu-link",
         ...props
     });
@@ -75,7 +75,7 @@ function NavigationMenuViewport({ className, ...props }) {
     return /*#__PURE__*/ jsx("div", {
         className: "absolute top-full left-0 z-30 flex justify-center perspective-distant",
         children: /*#__PURE__*/ jsx(Viewport, {
-            className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-90 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 ease-ui relative mt-2 min-h-[calc(var(--radix-navigation-menu-viewport-height)+2px)] w-full origin-[top_center] overflow-hidden rounded-lg border shadow-lg transition-[width,height] sm:min-w-[calc(var(--radix-navigation-menu-viewport-width)+2px)]', className),
+            className: cn("relative mt-2 min-h-[calc(var(--radix-navigation-menu-viewport-height)+2px)] w-full origin-[top_center] overflow-hidden rounded-lg border bg-popover text-popover-foreground shadow-lg transition-[width,height] ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-90 sm:min-w-[calc(var(--radix-navigation-menu-viewport-width)+2px)]", className),
             "data-slot": "navigation-menu-viewport",
             ...props
         })
@@ -83,11 +83,11 @@ function NavigationMenuViewport({ className, ...props }) {
 }
 function NavigationMenuIndicator({ className, ...props }) {
     return /*#__PURE__*/ jsx(Indicator, {
-        className: cn('data-[state=visible]:fade-in-0 ease-ui data-[state=visible]:animate-in data-[state=hidden]:fade-out-0 data-[state=hidden]:animate-out top-full z-10 flex h-2 items-center justify-center overflow-hidden', className),
+        className: cn("top-full z-10 flex h-2 items-center justify-center overflow-hidden ease-ui data-[state=hidden]:animate-out data-[state=hidden]:fade-out-0 data-[state=visible]:animate-in data-[state=visible]:fade-in-0", className),
         "data-slot": "navigation-menu-indicator",
         ...props,
         children: /*#__PURE__*/ jsx("div", {
-            className: "bg-popover text-popover-foreground relative top-[60%] size-2.5 rotate-45 rounded-tl-xs"
+            className: "relative top-[60%] size-2.5 rotate-45 rounded-tl-xs bg-popover text-popover-foreground"
         })
     });
 }

package/dist/components/pagination.cjs

@@ -39,14 +39,14 @@ const external_button_cjs_namespaceObject = require("./button.cjs");
 function Pagination({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("nav", {
         "aria-label": "pagination",
-        className: (0, tailwind_variants_namespaceObject.cn)('mx-auto flex w-full justify-center', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("mx-auto flex w-full justify-center", className),
         "data-slot": "pagination",
         ...props
     });
 }
 function PaginationContent({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("ul", {
-        className: (0, tailwind_variants_namespaceObject.cn)('flex flex-row items-center gap-1', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex flex-row items-center gap-1", className),
         "data-slot": "pagination-content",
         ...props
     });
@@ -57,13 +57,13 @@ function PaginationItem(props) {
         ...props
     });
 }
-function PaginationLink({ children, className, isActive, size = 'icon', ...props }) {
+function PaginationLink({ children, className, isActive, size = "icon", ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("a", {
-        "aria-current": isActive ? 'page' : void 0,
+        "aria-current": isActive ? "page" : void 0,
         className: (0, external_button_cjs_namespaceObject.buttonVariants)({
             className,
             size,
-            variant: isActive ? 'outline' : 'ghost'
+            variant: isActive ? "outline" : "ghost"
         }),
         "data-slot": "pagination-link",
         ...props,
@@ -103,7 +103,7 @@ function PaginationNext({ ...props }) {
 function PaginationEllipsis({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("span", {
         "aria-hidden": true,
-        className: (0, tailwind_variants_namespaceObject.cn)('flex size-10 items-center justify-center', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex size-10 items-center justify-center", className),
         "data-slot": "pagination-ellipsis",
         ...props,
         children: [

package/dist/components/pagination.d.ts

@@ -1,25 +1,25 @@
-import type { VariantProps } from '@codefast/tailwind-variants';
-import type { ComponentProps, JSX } from 'react';
-import { buttonVariants } from './button';
-type PaginationProps = ComponentProps<'nav'>;
+import type { VariantProps } from "@codefast/tailwind-variants";
+import type { ComponentProps, JSX } from "react";
+import { buttonVariants } from "./button";
+type PaginationProps = ComponentProps<"nav">;
 declare function Pagination({ className, ...props }: PaginationProps): JSX.Element;
-type PaginationContentProps = ComponentProps<'ul'>;
+type PaginationContentProps = ComponentProps<"ul">;
 declare function PaginationContent({ className, ...props }: PaginationContentProps): JSX.Element;
-type PaginationItemProps = ComponentProps<'li'>;
+type PaginationItemProps = ComponentProps<"li">;
 declare function PaginationItem(props: PaginationItemProps): JSX.Element;
-interface PaginationLinkProps extends ComponentProps<'a'>, Pick<VariantProps<typeof buttonVariants>, 'size'> {
+interface PaginationLinkProps extends ComponentProps<"a">, Pick<VariantProps<typeof buttonVariants>, "size"> {
     isActive?: boolean;
 }
 declare function PaginationLink({ children, className, isActive, size, ...props }: PaginationLinkProps): JSX.Element;
-interface PaginationPreviousProps extends ComponentProps<'a'>, Pick<VariantProps<typeof buttonVariants>, 'size'> {
+interface PaginationPreviousProps extends ComponentProps<"a">, Pick<VariantProps<typeof buttonVariants>, "size"> {
     isActive?: boolean;
 }
 declare function PaginationPrevious({ ...props }: PaginationPreviousProps): JSX.Element;
-interface PaginationNextProps extends ComponentProps<'a'>, Pick<VariantProps<typeof buttonVariants>, 'size'> {
+interface PaginationNextProps extends ComponentProps<"a">, Pick<VariantProps<typeof buttonVariants>, "size"> {
     isActive?: boolean;
 }
 declare function PaginationNext({ ...props }: PaginationNextProps): JSX.Element;
-type PaginationEllipsisProps = ComponentProps<'span'>;
+type PaginationEllipsisProps = ComponentProps<"span">;
 declare function PaginationEllipsis({ className, ...props }: PaginationEllipsisProps): JSX.Element;
 export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, };
 export type { PaginationContentProps, PaginationEllipsisProps, PaginationItemProps, PaginationLinkProps, PaginationNextProps, PaginationPreviousProps, PaginationProps, };

package/dist/components/pagination.js

@@ -5,14 +5,14 @@ import { buttonVariants } from "./button.js";
 function Pagination({ className, ...props }) {
     return /*#__PURE__*/ jsx("nav", {
         "aria-label": "pagination",
-        className: cn('mx-auto flex w-full justify-center', className),
+        className: cn("mx-auto flex w-full justify-center", className),
         "data-slot": "pagination",
         ...props
     });
 }
 function PaginationContent({ className, ...props }) {
     return /*#__PURE__*/ jsx("ul", {
-        className: cn('flex flex-row items-center gap-1', className),
+        className: cn("flex flex-row items-center gap-1", className),
         "data-slot": "pagination-content",
         ...props
     });
@@ -23,13 +23,13 @@ function PaginationItem(props) {
         ...props
     });
 }
-function PaginationLink({ children, className, isActive, size = 'icon', ...props }) {
+function PaginationLink({ children, className, isActive, size = "icon", ...props }) {
     return /*#__PURE__*/ jsx("a", {
-        "aria-current": isActive ? 'page' : void 0,
+        "aria-current": isActive ? "page" : void 0,
         className: buttonVariants({
             className,
             size,
-            variant: isActive ? 'outline' : 'ghost'
+            variant: isActive ? "outline" : "ghost"
         }),
         "data-slot": "pagination-link",
         ...props,
@@ -69,7 +69,7 @@ function PaginationNext({ ...props }) {
 function PaginationEllipsis({ className, ...props }) {
     return /*#__PURE__*/ jsxs("span", {
         "aria-hidden": true,
-        className: cn('flex size-10 items-center justify-center', className),
+        className: cn("flex size-10 items-center justify-center", className),
         "data-slot": "pagination-ellipsis",
         ...props,
         children: [

package/dist/components/popover.cjs

@@ -52,11 +52,11 @@ function PopoverAnchor({ ...props }) {
         ...props
     });
 }
-function PopoverContent({ align = 'center', className, sideOffset = 4, ...props }) {
+function PopoverContent({ align = "center", className, sideOffset = 4, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_popover_namespaceObject.Portal, {
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_popover_namespaceObject.Content, {
             align: align,
-            className: (0, tailwind_variants_namespaceObject.cn)('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=top]:slide-in-from-bottom-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 ease-ui z-50 min-w-32 origin-(--radix-popover-content-transform-origin) rounded-lg border p-4 shadow-lg outline-hidden', className),
+            className: (0, tailwind_variants_namespaceObject.cn)("z-50 min-w-32 origin-(--radix-popover-content-transform-origin) rounded-lg border bg-popover p-4 text-popover-foreground shadow-lg outline-hidden ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=top]:slide-in-from-bottom-2", className),
             "data-slot": "popover-content",
             sideOffset: sideOffset,
             ...props
@@ -65,7 +65,7 @@ function PopoverContent({ align = 'center', className, sideOffset = 4, ...props
 }
 function PopoverArrow({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_popover_namespaceObject.Arrow, {
-        className: (0, tailwind_variants_namespaceObject.cn)('fill-popover', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("fill-popover", className),
         "data-slot": "popover-arrow",
         ...props
     });

package/dist/components/popover.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as PopoverPrimitive from '@radix-ui/react-popover';
+import type { ComponentProps, JSX } from "react";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
 type PopoverProps = ComponentProps<typeof PopoverPrimitive.Root>;
 declare function Popover({ ...props }: PopoverProps): JSX.Element;
 type PopoverTriggerProps = ComponentProps<typeof PopoverPrimitive.Trigger>;
@@ -11,4 +11,4 @@ declare function PopoverContent({ align, className, sideOffset, ...props }: Popo
 type PopoverArrowProps = ComponentProps<typeof PopoverPrimitive.Arrow>;
 declare function PopoverArrow({ className, ...props }: PopoverArrowProps): JSX.Element;
 export { Popover, PopoverAnchor, PopoverArrow, PopoverContent, PopoverTrigger };
-export type { PopoverAnchorProps, PopoverArrowProps, PopoverContentProps, PopoverProps, PopoverTriggerProps };
+export type { PopoverAnchorProps, PopoverArrowProps, PopoverContentProps, PopoverProps, PopoverTriggerProps, };

package/dist/components/popover.js

@@ -20,11 +20,11 @@ function PopoverAnchor({ ...props }) {
         ...props
     });
 }
-function PopoverContent({ align = 'center', className, sideOffset = 4, ...props }) {
+function PopoverContent({ align = "center", className, sideOffset = 4, ...props }) {
     return /*#__PURE__*/ jsx(Portal, {
         children: /*#__PURE__*/ jsx(Content, {
             align: align,
-            className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=top]:slide-in-from-bottom-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 ease-ui z-50 min-w-32 origin-(--radix-popover-content-transform-origin) rounded-lg border p-4 shadow-lg outline-hidden', className),
+            className: cn("z-50 min-w-32 origin-(--radix-popover-content-transform-origin) rounded-lg border bg-popover p-4 text-popover-foreground shadow-lg outline-hidden ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=top]:slide-in-from-bottom-2", className),
             "data-slot": "popover-content",
             sideOffset: sideOffset,
             ...props
@@ -33,7 +33,7 @@ function PopoverContent({ align = 'center', className, sideOffset = 4, ...props
 }
 function PopoverArrow({ className, ...props }) {
     return /*#__PURE__*/ jsx(Arrow, {
-        className: cn('fill-popover', className),
+        className: cn("fill-popover", className),
         "data-slot": "popover-arrow",
         ...props
     });

package/dist/components/progress-circle.cjs

@@ -35,33 +35,33 @@ const use_animated_value_cjs_namespaceObject = require("../hooks/use-animated-va
 const progress_circle_cjs_namespaceObject = require("../primitives/progress-circle.cjs");
 const progressCircleVariants = (0, tailwind_variants_namespaceObject.tv)({
     defaultVariants: {
-        size: 'md',
-        thickness: 'regular',
-        variant: 'default'
+        size: "md",
+        thickness: "regular",
+        variant: "default"
     },
     slots: {
-        indicator: 'origin-center',
-        label: 'absolute inset-0 flex items-center justify-center text-xs font-medium',
-        root: 'relative inline-flex items-center justify-center',
-        svg: 'size-full',
-        track: 'origin-center'
+        indicator: "origin-center",
+        label: "absolute inset-0 flex items-center justify-center text-xs font-medium",
+        root: "relative inline-flex items-center justify-center",
+        svg: "size-full",
+        track: "origin-center"
     },
     variants: {
         size: {
             sm: {
-                label: 'text-[0.625rem]'
+                label: "text-[0.625rem]"
             },
             md: {
-                label: 'text-xs'
+                label: "text-xs"
             },
             lg: {
-                label: 'text-sm'
+                label: "text-sm"
             },
             xl: {
-                label: 'text-base'
+                label: "text-base"
             },
-            '2xl': {
-                label: 'text-lg'
+            "2xl": {
+                label: "text-lg"
             }
         },
         thickness: {
@@ -71,17 +71,17 @@ const progressCircleVariants = (0, tailwind_variants_namespaceObject.tv)({
         },
         variant: {
             default: {
-                indicator: 'text-primary',
-                track: 'text-primary/20'
+                indicator: "text-primary",
+                track: "text-primary/20"
             },
             destructive: {
-                indicator: 'text-destructive',
-                track: 'text-destructive/20'
+                indicator: "text-destructive",
+                track: "text-destructive/20"
             }
         }
     }
 });
-function ProgressCircle({ animate = true, animationDuration = 1000, className, classNames, customLabel, showValue = false, size, sizeInPixels, strokeWidth, thickness = 'regular', value = 0, variant = 'default', ...props }) {
+function ProgressCircle({ animate = true, animationDuration = 1000, className, classNames, customLabel, showValue = false, size, sizeInPixels, strokeWidth, thickness = "regular", value = 0, variant = "default", ...props }) {
     const displayValue = (0, use_animated_value_cjs_namespaceObject.useAnimatedValue)(value, animationDuration, animate);
     const actualSize = (0, external_react_namespaceObject.useMemo)(()=>sizeInPixels ?? getActualSize(size), [
         sizeInPixels,
@@ -140,7 +140,7 @@ function ProgressCircle({ animate = true, animationDuration = 1000, className, c
                             }),
                             style: {
                                 transitionDuration: `${animationDuration.toString()}ms`,
-                                transitionProperty: 'stroke-dashoffset'
+                                transitionProperty: "stroke-dashoffset"
                             }
                         })
                     ]
@@ -155,10 +155,10 @@ function ProgressCircle({ animate = true, animationDuration = 1000, className, c
         })
     });
 }
-ProgressCircle.displayName = 'ProgressCircle';
+ProgressCircle.displayName = "ProgressCircle";
 const getActualSize = (size)=>{
     const sizeMap = {
-        '2xl': 128,
+        "2xl": 128,
         lg: 64,
         md: 48,
         sm: 32,

package/dist/components/progress-circle.d.ts

@@ -1,6 +1,6 @@
-import type { VariantProps } from '@codefast/tailwind-variants';
-import type { ComponentProps, JSX } from 'react';
-import * as ProgressCirclePrimitive from '../primitives/progress-circle';
+import type { VariantProps } from "@codefast/tailwind-variants";
+import type { ComponentProps, JSX } from "react";
+import * as ProgressCirclePrimitive from "../primitives/progress-circle";
 declare const progressCircleVariants: import("@codefast/tailwind-variants").VariantFunctionType<{
     size: {
         sm: {
@@ -15,7 +15,7 @@ declare const progressCircleVariants: import("@codefast/tailwind-variants").Vari
         xl: {
             label: string;
         };
-        '2xl': {
+        "2xl": {
             label: string;
         };
     };
@@ -41,7 +41,7 @@ declare const progressCircleVariants: import("@codefast/tailwind-variants").Vari
     svg: string;
     track: string;
 }>;
-interface ProgressCircleProps extends Omit<ComponentProps<typeof ProgressCirclePrimitive.Provider>, 'children' | 'size'>, VariantProps<typeof progressCircleVariants> {
+interface ProgressCircleProps extends Omit<ComponentProps<typeof ProgressCirclePrimitive.Provider>, "children" | "size">, VariantProps<typeof progressCircleVariants> {
     /**
      * Enables animation effect when value changes
      */

package/dist/components/progress-circle.js

@@ -6,33 +6,33 @@ import { useAnimatedValue } from "../hooks/use-animated-value.js";
 import { Indicator, Provider, Root, SVG, Track, Value } from "../primitives/progress-circle.js";
 const progressCircleVariants = tv({
     defaultVariants: {
-        size: 'md',
-        thickness: 'regular',
-        variant: 'default'
+        size: "md",
+        thickness: "regular",
+        variant: "default"
     },
     slots: {
-        indicator: 'origin-center',
-        label: 'absolute inset-0 flex items-center justify-center text-xs font-medium',
-        root: 'relative inline-flex items-center justify-center',
-        svg: 'size-full',
-        track: 'origin-center'
+        indicator: "origin-center",
+        label: "absolute inset-0 flex items-center justify-center text-xs font-medium",
+        root: "relative inline-flex items-center justify-center",
+        svg: "size-full",
+        track: "origin-center"
     },
     variants: {
         size: {
             sm: {
-                label: 'text-[0.625rem]'
+                label: "text-[0.625rem]"
             },
             md: {
-                label: 'text-xs'
+                label: "text-xs"
             },
             lg: {
-                label: 'text-sm'
+                label: "text-sm"
             },
             xl: {
-                label: 'text-base'
+                label: "text-base"
             },
-            '2xl': {
-                label: 'text-lg'
+            "2xl": {
+                label: "text-lg"
             }
         },
         thickness: {
@@ -42,17 +42,17 @@ const progressCircleVariants = tv({
         },
         variant: {
             default: {
-                indicator: 'text-primary',
-                track: 'text-primary/20'
+                indicator: "text-primary",
+                track: "text-primary/20"
             },
             destructive: {
-                indicator: 'text-destructive',
-                track: 'text-destructive/20'
+                indicator: "text-destructive",
+                track: "text-destructive/20"
             }
         }
     }
 });
-function ProgressCircle({ animate = true, animationDuration = 1000, className, classNames, customLabel, showValue = false, size, sizeInPixels, strokeWidth, thickness = 'regular', value = 0, variant = 'default', ...props }) {
+function ProgressCircle({ animate = true, animationDuration = 1000, className, classNames, customLabel, showValue = false, size, sizeInPixels, strokeWidth, thickness = "regular", value = 0, variant = "default", ...props }) {
     const displayValue = useAnimatedValue(value, animationDuration, animate);
     const actualSize = useMemo(()=>sizeInPixels ?? getActualSize(size), [
         sizeInPixels,
@@ -111,7 +111,7 @@ function ProgressCircle({ animate = true, animationDuration = 1000, className, c
                             }),
                             style: {
                                 transitionDuration: `${animationDuration.toString()}ms`,
-                                transitionProperty: 'stroke-dashoffset'
+                                transitionProperty: "stroke-dashoffset"
                             }
                         })
                     ]
@@ -126,10 +126,10 @@ function ProgressCircle({ animate = true, animationDuration = 1000, className, c
         })
     });
 }
-ProgressCircle.displayName = 'ProgressCircle';
+ProgressCircle.displayName = "ProgressCircle";
 const getActualSize = (size)=>{
     const sizeMap = {
-        '2xl': 128,
+        "2xl": 128,
         lg: 64,
         md: 48,
         sm: 32,

package/dist/components/progress.cjs

@@ -32,11 +32,11 @@ const tailwind_variants_namespaceObject = require("@codefast/tailwind-variants")
 const react_progress_namespaceObject = require("@radix-ui/react-progress");
 function Progress({ className, value, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_progress_namespaceObject.Root, {
-        className: (0, tailwind_variants_namespaceObject.cn)('bg-primary/20 relative h-2 w-full overflow-hidden rounded-full', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("relative h-2 w-full overflow-hidden rounded-full bg-primary/20", className),
         "data-slot": "progress",
         ...props,
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_progress_namespaceObject.Indicator, {
-            className: "bg-primary size-full flex-1 transition-all",
+            className: "size-full flex-1 bg-primary transition-all",
             "data-slot": "progress-indicator",
             style: {
                 transform: `translateX(-${(100 - (value ?? 0)).toString()}%)`

package/dist/components/progress.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as ProgressPrimitive from '@radix-ui/react-progress';
+import type { ComponentProps, JSX } from "react";
+import * as ProgressPrimitive from "@radix-ui/react-progress";
 type ProgressProps = ComponentProps<typeof ProgressPrimitive.Root>;
 declare function Progress({ className, value, ...props }: ProgressProps): JSX.Element;
 export { Progress };