@codefast/ui 0.0.10 → 0.0.11

package/src/breadcrumb.tsx

@@ -65,9 +65,9 @@ interface BreadcrumbLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorEleme
 
 const BreadcrumbLink = React.forwardRef<BreadcrumbLinkElement, BreadcrumbLinkProps>(
   ({ asChild, className, ...props }, ref) => {
-    const Comp = asChild ? Slot : "a";
+    const Component = asChild ? Slot : "a";
 
-    return <Comp ref={ref} className={cn("transition-colors", "hover:text-foreground", className)} {...props} />;
+    return <Component ref={ref} className={cn("transition-colors", "hover:text-foreground", className)} {...props} />;
   },
 );
 

package/src/button.tsx

@@ -1,6 +1,8 @@
 import * as React from "react";
 import { Slot } from "@radix-ui/react-slot";
 import { type VariantProps } from "cva";
+import { Fragment } from "react";
+import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
 import { Spinner } from "./spinner";
 import { cva } from "./utils";
 
@@ -58,11 +60,12 @@ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, But
 
 const Button = React.forwardRef<ButtonElement, ButtonProps>(
   ({ children, className, variant, size, loading = false, asChild = false, ...props }, ref) => {
-    const Comp = asChild ? Slot : "button";
+    const Component = asChild ? Slot : "button";
+    const ComponentLoading = asChild ? "span" : Fragment;
     const disabled = loading || props.disabled;
 
     return (
-      <Comp
+      <Component
         ref={ref}
         type={asChild ? undefined : "button"}
         className={buttonVariants({ variant, size, loading, className })}
@@ -70,23 +73,19 @@ const Button = React.forwardRef<ButtonElement, ButtonProps>(
         disabled={disabled}
       >
         {loading ? (
-          <>
-            <span
-              aria-hidden
-              className="invisible contents"
-              // Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.
-              {...{ inert: "" }}
-            >
+          <ComponentLoading>
+            <span aria-hidden className="invisible contents">
               {children}
             </span>
+            <VisuallyHidden>{children}</VisuallyHidden>
             <span className="absolute inset-0 flex items-center justify-center">
               <Spinner />
             </span>
-          </>
+          </ComponentLoading>
         ) : (
           children
         )}
-      </Comp>
+      </Component>
     );
   },
 );

package/src/code.tsx

@@ -12,9 +12,9 @@ interface CodeProps extends React.HTMLAttributes<HTMLElement> {
 }
 
 const Code = React.forwardRef<CodeElement, CodeProps>(({ asChild, ...props }, ref) => {
-  const Comp = asChild ? Slot : "code";
+  const Component = asChild ? Slot : "code";
 
-  return <Comp ref={ref} {...props} />;
+  return <Component ref={ref} {...props} />;
 });
 
 Code.displayName = "Code";

package/src/container.tsx

@@ -13,9 +13,9 @@ interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 
 const Container = React.forwardRef<ContainerElement, ContainerProps>(({ className, asChild, ...props }, ref) => {
-  const Comp = asChild ? Slot : "div";
+  const Component = asChild ? Slot : "div";
 
-  return <Comp ref={ref} className={cn("container", className)} {...props} />;
+  return <Component ref={ref} className={cn("container", className)} {...props} />;
 });
 
 Container.displayName = "Container";

package/src/em.tsx

@@ -12,9 +12,9 @@ interface EmProps extends React.HTMLAttributes<HTMLElement> {
 }
 
 const Em = React.forwardRef<EmElement, EmProps>(({ asChild, ...props }, ref) => {
-  const Comp = asChild ? Slot : "em";
+  const Component = asChild ? Slot : "em";
 
-  return <Comp ref={ref} {...props} />;
+  return <Component ref={ref} {...props} />;
 });
 
 Em.displayName = "Em";

package/src/heading.tsx

@@ -13,9 +13,9 @@ interface HeadingProps extends React.HTMLAttributes<HTMLHeadingElement> {
 }
 
 const Heading = React.forwardRef<HeadingElement, HeadingProps>(({ asChild, as: Tag = "h1", ...props }, ref) => {
-  const Com = asChild ? Slot : Tag;
+  const Component = asChild ? Slot : Tag;
 
-  return <Com ref={ref} {...props} />;
+  return <Component ref={ref} {...props} />;
 });
 
 Heading.displayName = "Heading";

package/src/kbd.tsx

@@ -13,10 +13,10 @@ interface KbdProps extends React.HTMLAttributes<HTMLElement> {
 }
 
 const Kbd = React.forwardRef<KbdElement, KbdProps>(({ asChild, className, ...props }, ref) => {
-  const Comp = asChild ? Slot : "kbd";
+  const Component = asChild ? Slot : "kbd";
 
   return (
-    <Comp
+    <Component
       ref={ref}
       className={cn(
         "bg-muted text-muted-foreground inline-flex h-5 select-none items-center gap-1 rounded border px-1.5 font-mono text-xs font-medium",

package/src/pre.tsx

@@ -12,9 +12,9 @@ interface PreProps extends React.HTMLAttributes<HTMLPreElement> {
 }
 
 const Pre = React.forwardRef<PreElement, PreProps>(({ asChild, ...props }, ref) => {
-  const Comp = asChild ? Slot : "pre";
+  const Component = asChild ? Slot : "pre";
 
-  return <Comp ref={ref} {...props} />;
+  return <Component ref={ref} {...props} />;
 });
 
 Pre.displayName = "Pre";

package/src/quote.tsx

@@ -12,9 +12,9 @@ interface QuoteProps extends React.QuoteHTMLAttributes<HTMLQuoteElement> {
 }
 
 const Quote = React.forwardRef<QuoteElement, QuoteProps>(({ asChild, ...props }, ref) => {
-  const Comp = asChild ? Slot : "q";
+  const Component = asChild ? Slot : "q";
 
-  return <Comp ref={ref} {...props} />;
+  return <Component ref={ref} {...props} />;
 });
 
 Quote.displayName = "Quote";

package/src/section.tsx

@@ -12,9 +12,9 @@ interface SectionProps extends React.HTMLAttributes<HTMLElement> {
 }
 
 const Section = React.forwardRef<SectionElement, SectionProps>(({ asChild, ...props }, ref) => {
-  const Comp = asChild ? Slot : "section";
+  const Component = asChild ? Slot : "section";
 
-  return <Comp ref={ref} {...props} />;
+  return <Component ref={ref} {...props} />;
 });
 
 Section.displayName = "Section";

package/src/segmented.tsx

@@ -0,0 +1,176 @@
+"use client";
+
+import * as React from "react";
+import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
+import { useControllableState } from "@radix-ui/react-use-controllable-state";
+import { createContextScope, type Scope } from "@radix-ui/react-context";
+import { composeEventHandlers } from "@radix-ui/primitive";
+import { cn } from "./utils";
+
+type RemovedProps = "value" | "asChild" | "defaultChecked" | "defaultValue";
+
+/* -----------------------------------------------------------------------------
+ * Component: Segmented
+ * -------------------------------------------------------------------------- */
+
+const SEGMENTED_NAME = "Segmented";
+
+type ScopedProps<P> = P & { __scopeSegmented?: Scope };
+
+const [createSegmentedContext] = createContextScope(SEGMENTED_NAME);
+
+interface Offset {
+  left: number;
+  top: number;
+}
+
+interface SegmentedContextValue {
+  offset: Offset;
+  setOffset: React.Dispatch<React.SetStateAction<Offset>>;
+}
+
+const [SegmentedProvider, useSegmentedContext] = createSegmentedContext<SegmentedContextValue>(SEGMENTED_NAME);
+
+type SegmentedElement = React.ElementRef<typeof ToggleGroupPrimitive.Root>;
+type SegmentedProps = Omit<
+  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root>,
+  RemovedProps | "disabled" | "type" | "onValueChange"
+> & {
+  value?: string;
+  defaultValue?: string;
+  onValueChange?: (value: string) => void;
+};
+
+const Segmented = React.forwardRef<SegmentedElement, SegmentedProps>(
+  (
+    {
+      __scopeSegmented,
+      children,
+      className,
+      value: valueProp,
+      onValueChange: onValueChangeProp,
+      defaultValue: defaultValueProp,
+      ...props
+    }: ScopedProps<SegmentedProps>,
+    ref,
+  ) => {
+    const [value, setValue] = useControllableState({
+      prop: valueProp,
+      onChange: onValueChangeProp,
+      defaultProp: defaultValueProp,
+    });
+    const childCount = React.Children.count(children);
+    const [offset, setOffset] = React.useState<Offset>({
+      left: 0,
+      top: 0,
+    });
+
+    return (
+      <SegmentedProvider scope={__scopeSegmented} offset={offset} setOffset={setOffset}>
+        <ToggleGroupPrimitive.Root
+          ref={ref}
+          className={cn(
+            "bg-background relative isolate inline-grid h-10 min-w-max auto-cols-fr grid-flow-col items-stretch rounded-md border text-center align-top shadow-sm",
+            className,
+          )}
+          value={value}
+          onValueChange={(valueChanged) => {
+            if (valueChanged) {
+              setValue(valueChanged);
+            }
+          }}
+          type="single"
+          {...props}
+          style={
+            {
+              "--offset-left": `${offset.left.toString()}px`,
+              "--offset-top": `${offset.top.toString()}px`,
+              ...props.style,
+            } as React.CSSProperties
+          }
+        >
+          {children}
+          <div
+            className={cn(
+              "pointer-events-none absolute -z-[1] h-full translate-x-[var(--offset-left)] transition-transform",
+              "before:bg-accent before:absolute before:inset-0 before:rounded",
+            )}
+            style={
+              {
+                width: `calc(100% / ${childCount.toString()})`,
+              } as React.CSSProperties
+            }
+          />
+        </ToggleGroupPrimitive.Root>
+      </SegmentedProvider>
+    );
+  },
+);
+
+Segmented.displayName = SEGMENTED_NAME;
+
+/* -----------------------------------------------------------------------------
+ * Component: SegmentedItem
+ * -------------------------------------------------------------------------- */
+
+const SEGMENTED_ITEM_NAME = "SegmentedItem";
+
+type SegmentedItemElement = React.ElementRef<typeof ToggleGroupPrimitive.Item>;
+type SegmentedItemProps = Omit<
+  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item>,
+  RemovedProps | "disabled" | "type"
+> & {
+  value: string;
+};
+
+const SegmentedItem = React.forwardRef<SegmentedItemElement, SegmentedItemProps>(
+  ({ __scopeSegmented, children, className, onClick, ...props }: ScopedProps<SegmentedItemProps>, ref) => {
+    const { setOffset } = useSegmentedContext(SEGMENTED_ITEM_NAME, __scopeSegmented);
+
+    return (
+      <ToggleGroupPrimitive.Item
+        ref={ref}
+        className={cn(
+          "group flex select-none items-stretch rounded text-sm first:rounded-l-[inherit] [&:nth-last-child(2)]:rounded-r-[inherit]",
+          "hover:bg-accent/30",
+          "group-aria-checked:text-accent-foreground",
+          className,
+        )}
+        onClick={composeEventHandlers(onClick, (event) => {
+          setOffset({
+            left: event.currentTarget.offsetLeft,
+            top: event.currentTarget.offsetTop,
+          });
+        })}
+        {...props}
+      >
+        {/* Separator */}
+        <span
+          className={cn(
+            "bg-border my-1.5 w-px transition",
+            "group-first:opacity-0",
+            "group-[:where([data-state=on])+*]:opacity-0 group-aria-checked:opacity-0",
+            "group-focus-visible:opacity-0 group-[&:focus-visible+*]:opacity-0",
+            "group-[:where([data-state=on])+*]:scale-0 group-aria-checked:scale-0",
+            "group-focus-visible:scale-0 group-[&:focus-visible+*]:scale-0",
+          )}
+        />
+        {/* Label */}
+        <span className="flex grow items-center justify-center gap-2 px-3 py-1 [&_svg]:shrink-0">
+          {/* LabelActive */}
+          <span className="font-medium opacity-0 transition-opacity group-aria-checked:opacity-100">{children}</span>
+          {/* LabelInactive */}
+          <span className="absolute opacity-100 transition-opacity group-aria-checked:opacity-0">{children}</span>
+        </span>
+      </ToggleGroupPrimitive.Item>
+    );
+  },
+);
+
+SegmentedItem.displayName = SEGMENTED_ITEM_NAME;
+
+/* -----------------------------------------------------------------------------
+ * Exports
+ * -------------------------------------------------------------------------- */
+
+export { Segmented, SegmentedItem, type SegmentedProps, type SegmentedItemProps };

package/src/spinner.tsx

@@ -1,4 +1,5 @@
 import * as React from "react";
+import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
 import { cn } from "./utils";
 
 /* -----------------------------------------------------------------------------
@@ -51,15 +52,10 @@ const Spinner = React.forwardRef<SpinnerElement, SpinnerProps>(
 
     return (
       <span className="relative">
-        <span
-          aria-hidden
-          className="invisible contents"
-          // Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.
-          {...{ inert: "" }}
-        >
+        <span aria-hidden className="invisible contents">
           {children}
         </span>
-
+        <VisuallyHidden>{children}</VisuallyHidden>
         <span className="absolute inset-0 flex items-center justify-center">{spinner}</span>
       </span>
     );

package/src/strong.tsx

@@ -12,9 +12,9 @@ interface StrongProps extends React.HTMLAttributes<HTMLElement> {
 }
 
 const Strong = React.forwardRef<StrongElement, StrongProps>(({ asChild, ...props }, ref) => {
-  const Comp = asChild ? Slot : "strong";
+  const Component = asChild ? Slot : "strong";
 
-  return <Comp ref={ref} {...props} />;
+  return <Component ref={ref} {...props} />;
 });
 
 Strong.displayName = "Strong";

package/src/text.tsx

@@ -20,9 +20,9 @@ type TextProps = (TextParagraphProps | TextSpanProps) & {
 };
 
 const Text = React.forwardRef<TextElement, TextProps>(({ as: Tag = "p", asChild, ...props }, ref) => {
-  const Comp = asChild ? Slot : Tag;
+  const Component = asChild ? Slot : Tag;
 
-  return <Comp ref={ref} {...props} />;
+  return <Component ref={ref} {...props} />;
 });
 
 Text.displayName = "Text";

package/src/toggle.tsx

@@ -11,8 +11,11 @@ import { cva } from "./utils";
 
 const toggleVariants = cva({
   base: [
-    "hover:bg-muted hover:text-muted-foreground data-[state=on]:bg-accent data-[state=on]:text-accent-foreground inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50",
+    "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors",
+    "hover:bg-muted hover:text-muted-foreground",
     "focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
+    "data-[state=on]:bg-accent data-[state=on]:text-accent-foreground",
+    "disabled:pointer-events-none disabled:opacity-50",
   ],
   variants: {
     variant: {

package/dist/chunk-5UHPKXF4.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/spinner.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Component: Spinner\n * -------------------------------------------------------------------------- */\n\nconst spinnerCount = 8;\n\ntype SpinnerElement = HTMLSpanElement;\n\ninterface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {\n  loading?: boolean;\n}\n\nconst Spinner = React.forwardRef<SpinnerElement, SpinnerProps>(\n  ({ className, loading = true, children, ...props }, ref) => {\n    if (!loading) {\n      return children;\n    }\n\n    const spinner = (\n      <span\n        ref={ref}\n        className={cn(\"relative flex size-4 items-center justify-center opacity-60\", className)}\n        {...props}\n      >\n        {Array.from({ length: spinnerCount }, (_, i) => (\n          <span\n            key={i}\n            className={cn(\n              \"absolute h-full rotate-[var(--spinner-rotate)]\",\n              \"before:fade-out-25 before:animate-out before:repeat-infinite before:block before:h-1/3 before:w-full before:rounded-full before:bg-current before:[animation-delay:var(--spinner-delay)] before:[animation-duration:var(--spinner-duration)]\",\n            )}\n            style={\n              {\n                width: `${(100 / spinnerCount).toString()}%`,\n                \"--spinner-delay\": `-${((spinnerCount - i) * 100).toString()}ms`,\n                \"--spinner-rotate\": `${((360 / spinnerCount) * i).toString()}deg`,\n                \"--spinner-duration\": `${(spinnerCount * 100).toString()}ms`,\n              } as React.CSSProperties\n            }\n          />\n        ))}\n      </span>\n    );\n\n    if (children === undefined) {\n      return spinner;\n    }\n\n    return (\n      <span className=\"relative\">\n        <span\n          aria-hidden\n          className=\"invisible contents\"\n          // Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.\n          {...{ inert: \"\" }}\n        >\n          {children}\n        </span>\n\n        <span className=\"absolute inset-0 flex items-center justify-center\">{spinner}</span>\n      </span>\n    );\n  },\n);\n\nSpinner.displayName = \"Spinner\";\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport { Spinner, type SpinnerProps };\n"],"mappings":";;;;;AAAA,YAAY,WAAW;AA4Bb,cAwBJ,YAxBI;AArBV,IAAM,eAAe;AAQrB,IAAM,UAAgB;AAAA,EACpB,CAAC,EAAE,WAAW,UAAU,MAAM,UAAU,GAAG,MAAM,GAAG,QAAQ;AAC1D,QAAI,CAAC,SAAS;AACZ,aAAO;AAAA,IACT;AAEA,UAAM,UACJ;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,+DAA+D,SAAS;AAAA,QACrF,GAAG;AAAA,QAEH,gBAAM,KAAK,EAAE,QAAQ,aAAa,GAAG,CAAC,GAAG,MACxC;AAAA,UAAC;AAAA;AAAA,YAEC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YACA,OACE;AAAA,cACE,OAAO,IAAI,MAAM,cAAc,SAAS,CAAC;AAAA,cACzC,mBAAmB,MAAM,eAAe,KAAK,KAAK,SAAS,CAAC;AAAA,cAC5D,oBAAoB,IAAK,MAAM,eAAgB,GAAG,SAAS,CAAC;AAAA,cAC5D,sBAAsB,IAAI,eAAe,KAAK,SAAS,CAAC;AAAA,YAC1D;AAAA;AAAA,UAXG;AAAA,QAaP,CACD;AAAA;AAAA,IACH;AAGF,QAAI,aAAa,QAAW;AAC1B,aAAO;AAAA,IACT;AAEA,WACE,qBAAC,UAAK,WAAU,YACd;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,eAAW;AAAA,UACX,WAAU;AAAA,UAET,GAAG,EAAE,OAAO,GAAG;AAAA,UAEf;AAAA;AAAA,MACH;AAAA,MAEA,oBAAC,UAAK,WAAU,qDAAqD,mBAAQ;AAAA,OAC/E;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;","names":[]}

package/dist/chunk-J6COVJTP.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/spinner.tsx"],"names":[],"mappings":";;;;;AAAA,YAAY,WAAW;AA4Bb,cAwBJ,YAxBI;AArBV,IAAM,eAAe;AAQrB,IAAM,UAAgB;AAAA,EACpB,CAAC,EAAE,WAAW,UAAU,MAAM,UAAU,GAAG,MAAM,GAAG,QAAQ;AAC1D,QAAI,CAAC,SAAS;AACZ,aAAO;AAAA,IACT;AAEA,UAAM,UACJ;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,+DAA+D,SAAS;AAAA,QACrF,GAAG;AAAA,QAEH,gBAAM,KAAK,EAAE,QAAQ,aAAa,GAAG,CAAC,GAAG,MACxC;AAAA,UAAC;AAAA;AAAA,YAEC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YACA,OACE;AAAA,cACE,OAAO,IAAI,MAAM,cAAc,SAAS,CAAC;AAAA,cACzC,mBAAmB,MAAM,eAAe,KAAK,KAAK,SAAS,CAAC;AAAA,cAC5D,oBAAoB,IAAK,MAAM,eAAgB,GAAG,SAAS,CAAC;AAAA,cAC5D,sBAAsB,IAAI,eAAe,KAAK,SAAS,CAAC;AAAA,YAC1D;AAAA;AAAA,UAXG;AAAA,QAaP,CACD;AAAA;AAAA,IACH;AAGF,QAAI,aAAa,QAAW;AAC1B,aAAO;AAAA,IACT;AAEA,WACE,qBAAC,UAAK,WAAU,YACd;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,eAAW;AAAA,UACX,WAAU;AAAA,UAET,GAAG,EAAE,OAAO,GAAG;AAAA,UAEf;AAAA;AAAA,MACH;AAAA,MAEA,oBAAC,UAAK,WAAU,qDAAqD,mBAAQ;AAAA,OAC/E;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc","sourcesContent":["import * as React from \"react\";\nimport { cn } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Component: Spinner\n * -------------------------------------------------------------------------- */\n\nconst spinnerCount = 8;\n\ntype SpinnerElement = HTMLSpanElement;\n\ninterface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {\n  loading?: boolean;\n}\n\nconst Spinner = React.forwardRef<SpinnerElement, SpinnerProps>(\n  ({ className, loading = true, children, ...props }, ref) => {\n    if (!loading) {\n      return children;\n    }\n\n    const spinner = (\n      <span\n        ref={ref}\n        className={cn(\"relative flex size-4 items-center justify-center opacity-60\", className)}\n        {...props}\n      >\n        {Array.from({ length: spinnerCount }, (_, i) => (\n          <span\n            key={i}\n            className={cn(\n              \"absolute h-full rotate-[var(--spinner-rotate)]\",\n              \"before:fade-out-25 before:animate-out before:repeat-infinite before:block before:h-1/3 before:w-full before:rounded-full before:bg-current before:[animation-delay:var(--spinner-delay)] before:[animation-duration:var(--spinner-duration)]\",\n            )}\n            style={\n              {\n                width: `${(100 / spinnerCount).toString()}%`,\n                \"--spinner-delay\": `-${((spinnerCount - i) * 100).toString()}ms`,\n                \"--spinner-rotate\": `${((360 / spinnerCount) * i).toString()}deg`,\n                \"--spinner-duration\": `${(spinnerCount * 100).toString()}ms`,\n              } as React.CSSProperties\n            }\n          />\n        ))}\n      </span>\n    );\n\n    if (children === undefined) {\n      return spinner;\n    }\n\n    return (\n      <span className=\"relative\">\n        <span\n          aria-hidden\n          className=\"invisible contents\"\n          // Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.\n          {...{ inert: \"\" }}\n        >\n          {children}\n        </span>\n\n        <span className=\"absolute inset-0 flex items-center justify-center\">{spinner}</span>\n      </span>\n    );\n  },\n);\n\nSpinner.displayName = \"Spinner\";\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport { Spinner, type SpinnerProps };\n"]}

package/dist/chunk-NEP3JDVQ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/button.tsx"],"names":[],"mappings":";;;;;;;;AAAA,YAAY,WAAW;AACvB,SAAS,YAAY;AAuEX,mBACE,KADF;AA9DV,IAAM,iBAAiB,IAAI;AAAA,EACzB,MAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,MACb,OAAO;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW;AAAA,IACb;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,MAAM;AAAA,MACN,WAAW;AAAA,MACX,WAAW;AAAA,MACX,WAAW;AAAA,IACb;AAAA,IACA,SAAS;AAAA,MACP,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,EACX;AACF,CAAC;AAcD,IAAM,SAAe;AAAA,EACnB,CAAC,EAAE,UAAU,WAAW,SAAS,MAAM,UAAU,OAAO,UAAU,OAAO,GAAG,MAAM,GAAG,QAAQ;AAC3F,UAAM,OAAO,UAAU,OAAO;AAC9B,UAAM,WAAW,WAAW,MAAM;AAElC,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAM,UAAU,SAAY;AAAA,QAC5B,WAAW,eAAe,EAAE,SAAS,MAAM,SAAS,UAAU,CAAC;AAAA,QAC9D,GAAG;AAAA,QACJ;AAAA,QAEC,oBACC,iCACE;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,eAAW;AAAA,cACX,WAAU;AAAA,cAET,GAAG,EAAE,OAAO,GAAG;AAAA,cAEf;AAAA;AAAA,UACH;AAAA,UACA,oBAAC,UAAK,WAAU,qDACd,8BAAC,WAAQ,GACX;AAAA,WACF,IAEA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc","sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { type VariantProps } from \"cva\";\nimport { Spinner } from \"./spinner\";\nimport { cva } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Variant: Button\n * -------------------------------------------------------------------------- */\n\nconst buttonVariants = cva({\n  base: [\n    \"inline-flex select-none items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors\",\n    \"disabled:pointer-events-none disabled:opacity-50\",\n    \"focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2\",\n  ],\n  variants: {\n    variant: {\n      default: \"bg-primary text-primary-foreground hover:bg-primary/90 shadow\",\n      destructive: \"bg-destructive text-destructive-foreground hover:bg-destructive/90 shadow-sm\",\n      ghost: \"hover:bg-accent hover:text-accent-foreground\",\n      link: \"text-primary underline-offset-4 hover:underline\",\n      outline: \"border-input bg-background hover:bg-accent hover:text-accent-foreground border shadow-sm\",\n      secondary: \"bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-sm\",\n    },\n    size: {\n      default: \"h-10 px-4\",\n      xs: \"h-8 px-2\",\n      sm: \"h-9 px-3\",\n      lg: \"h-11 px-8\",\n      icon: \"size-10\",\n      \"icon-xs\": \"size-8\",\n      \"icon-sm\": \"size-9\",\n      \"icon-lg\": \"size-11\",\n    },\n    loading: {\n      true: \"relative\",\n    },\n  },\n  defaultVariants: {\n    size: \"default\",\n    variant: \"default\",\n    loading: false,\n  },\n});\n\ntype ButtonVariantsProps = VariantProps<typeof buttonVariants>;\n\n/* -----------------------------------------------------------------------------\n * Component: Button\n * -------------------------------------------------------------------------- */\n\ntype ButtonElement = HTMLButtonElement;\n\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, ButtonVariantsProps {\n  asChild?: boolean;\n}\n\nconst Button = React.forwardRef<ButtonElement, ButtonProps>(\n  ({ children, className, variant, size, loading = false, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : \"button\";\n    const disabled = loading || props.disabled;\n\n    return (\n      <Comp\n        ref={ref}\n        type={asChild ? undefined : \"button\"}\n        className={buttonVariants({ variant, size, loading, className })}\n        {...props}\n        disabled={disabled}\n      >\n        {loading ? (\n          <>\n            <span\n              aria-hidden\n              className=\"invisible contents\"\n              // Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.\n              {...{ inert: \"\" }}\n            >\n              {children}\n            </span>\n            <span className=\"absolute inset-0 flex items-center justify-center\">\n              <Spinner />\n            </span>\n          </>\n        ) : (\n          children\n        )}\n      </Comp>\n    );\n  },\n);\n\nButton.displayName = \"Button\";\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport { Button, buttonVariants, type ButtonProps, type ButtonVariantsProps };\n"]}

package/dist/chunk-ORAVN37L.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/toggle.tsx"],"names":[],"mappings":";;;;;AAEA,YAAY,WAAW;AACvB,YAAY,qBAAqB;AAwC/B;AAhCF,IAAM,iBAAiB,IAAI;AAAA,EACzB,MAAM;AAAA,IACJ;AAAA,IACA;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,MAAM;AAAA,EACR;AACF,CAAC;AAWD,IAAM,SAAe,iBAAuC,CAAC,EAAE,WAAW,SAAS,MAAM,GAAG,MAAM,GAAG,QACnG,oBAAiB,sBAAhB,EAAqB,KAAU,WAAW,eAAe,EAAE,SAAS,MAAM,UAAU,CAAC,GAAI,GAAG,OAAO,CACrG;AAED,OAAO,cAA8B,qBAAK","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\nimport { type VariantProps } from \"cva\";\nimport { cva } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Variant: Toggle\n * -------------------------------------------------------------------------- */\n\nconst toggleVariants = cva({\n  base: [\n    \"hover:bg-muted hover:text-muted-foreground data-[state=on]:bg-accent data-[state=on]:text-accent-foreground inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50\",\n    \"focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2\",\n  ],\n  variants: {\n    variant: {\n      default: \"bg-transparent\",\n      outline: \"border-input hover:bg-accent hover:text-accent-foreground border bg-transparent shadow-sm\",\n    },\n    size: {\n      default: \"h-10 px-3\",\n      sm: \"h-9 px-2.5\",\n      lg: \"h-11 px-5\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n    size: \"default\",\n  },\n});\n\ntype ToggleVariantsProps = VariantProps<typeof toggleVariants>;\n\n/* -----------------------------------------------------------------------------\n * Component: Toggle\n * -------------------------------------------------------------------------- */\n\ntype ToggleElement = React.ElementRef<typeof TogglePrimitive.Root>;\ntype ToggleProps = React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> & ToggleVariantsProps;\n\nconst Toggle = React.forwardRef<ToggleElement, ToggleProps>(({ className, variant, size, ...props }, ref) => (\n  <TogglePrimitive.Root ref={ref} className={toggleVariants({ variant, size, className })} {...props} />\n));\n\nToggle.displayName = TogglePrimitive.Root.displayName;\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\nexport { Toggle, toggleVariants, type ToggleProps, type ToggleVariantsProps };\n"]}

package/dist/chunk-XCBBSHAK.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/toggle.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\nimport { type VariantProps } from \"cva\";\nimport { cva } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Variant: Toggle\n * -------------------------------------------------------------------------- */\n\nconst toggleVariants = cva({\n  base: [\n    \"hover:bg-muted hover:text-muted-foreground data-[state=on]:bg-accent data-[state=on]:text-accent-foreground inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50\",\n    \"focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2\",\n  ],\n  variants: {\n    variant: {\n      default: \"bg-transparent\",\n      outline: \"border-input hover:bg-accent hover:text-accent-foreground border bg-transparent shadow-sm\",\n    },\n    size: {\n      default: \"h-10 px-3\",\n      sm: \"h-9 px-2.5\",\n      lg: \"h-11 px-5\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n    size: \"default\",\n  },\n});\n\ntype ToggleVariantsProps = VariantProps<typeof toggleVariants>;\n\n/* -----------------------------------------------------------------------------\n * Component: Toggle\n * -------------------------------------------------------------------------- */\n\ntype ToggleElement = React.ElementRef<typeof TogglePrimitive.Root>;\ntype ToggleProps = React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> & ToggleVariantsProps;\n\nconst Toggle = React.forwardRef<ToggleElement, ToggleProps>(({ className, variant, size, ...props }, ref) => (\n  <TogglePrimitive.Root ref={ref} className={toggleVariants({ variant, size, className })} {...props} />\n));\n\nToggle.displayName = TogglePrimitive.Root.displayName;\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\nexport { Toggle, toggleVariants, type ToggleProps, type ToggleVariantsProps };\n"],"mappings":";;;;;AAEA,YAAY,WAAW;AACvB,YAAY,qBAAqB;AAwC/B;AAhCF,IAAM,iBAAiB,IAAI;AAAA,EACzB,MAAM;AAAA,IACJ;AAAA,IACA;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,MAAM;AAAA,EACR;AACF,CAAC;AAWD,IAAM,SAAe,iBAAuC,CAAC,EAAE,WAAW,SAAS,MAAM,GAAG,MAAM,GAAG,QACnG,oBAAiB,sBAAhB,EAAqB,KAAU,WAAW,eAAe,EAAE,SAAS,MAAM,UAAU,CAAC,GAAI,GAAG,OAAO,CACrG;AAED,OAAO,cAA8B,qBAAK;","names":[]}

package/dist/chunk-XHZUPL2U.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { type VariantProps } from \"cva\";\nimport { Spinner } from \"./spinner\";\nimport { cva } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Variant: Button\n * -------------------------------------------------------------------------- */\n\nconst buttonVariants = cva({\n  base: [\n    \"inline-flex select-none items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors\",\n    \"disabled:pointer-events-none disabled:opacity-50\",\n    \"focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2\",\n  ],\n  variants: {\n    variant: {\n      default: \"bg-primary text-primary-foreground hover:bg-primary/90 shadow\",\n      destructive: \"bg-destructive text-destructive-foreground hover:bg-destructive/90 shadow-sm\",\n      ghost: \"hover:bg-accent hover:text-accent-foreground\",\n      link: \"text-primary underline-offset-4 hover:underline\",\n      outline: \"border-input bg-background hover:bg-accent hover:text-accent-foreground border shadow-sm\",\n      secondary: \"bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-sm\",\n    },\n    size: {\n      default: \"h-10 px-4\",\n      xs: \"h-8 px-2\",\n      sm: \"h-9 px-3\",\n      lg: \"h-11 px-8\",\n      icon: \"size-10\",\n      \"icon-xs\": \"size-8\",\n      \"icon-sm\": \"size-9\",\n      \"icon-lg\": \"size-11\",\n    },\n    loading: {\n      true: \"relative\",\n    },\n  },\n  defaultVariants: {\n    size: \"default\",\n    variant: \"default\",\n    loading: false,\n  },\n});\n\ntype ButtonVariantsProps = VariantProps<typeof buttonVariants>;\n\n/* -----------------------------------------------------------------------------\n * Component: Button\n * -------------------------------------------------------------------------- */\n\ntype ButtonElement = HTMLButtonElement;\n\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, ButtonVariantsProps {\n  asChild?: boolean;\n}\n\nconst Button = React.forwardRef<ButtonElement, ButtonProps>(\n  ({ children, className, variant, size, loading = false, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : \"button\";\n    const disabled = loading || props.disabled;\n\n    return (\n      <Comp\n        ref={ref}\n        type={asChild ? undefined : \"button\"}\n        className={buttonVariants({ variant, size, loading, className })}\n        {...props}\n        disabled={disabled}\n      >\n        {loading ? (\n          <>\n            <span\n              aria-hidden\n              className=\"invisible contents\"\n              // Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.\n              {...{ inert: \"\" }}\n            >\n              {children}\n            </span>\n            <span className=\"absolute inset-0 flex items-center justify-center\">\n              <Spinner />\n            </span>\n          </>\n        ) : (\n          children\n        )}\n      </Comp>\n    );\n  },\n);\n\nButton.displayName = \"Button\";\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport { Button, buttonVariants, type ButtonProps, type ButtonVariantsProps };\n"],"mappings":";;;;;;;;AAAA,YAAY,WAAW;AACvB,SAAS,YAAY;AAuEX,mBACE,KADF;AA9DV,IAAM,iBAAiB,IAAI;AAAA,EACzB,MAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,MACb,OAAO;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW;AAAA,IACb;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,MAAM;AAAA,MACN,WAAW;AAAA,MACX,WAAW;AAAA,MACX,WAAW;AAAA,IACb;AAAA,IACA,SAAS;AAAA,MACP,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,EACX;AACF,CAAC;AAcD,IAAM,SAAe;AAAA,EACnB,CAAC,EAAE,UAAU,WAAW,SAAS,MAAM,UAAU,OAAO,UAAU,OAAO,GAAG,MAAM,GAAG,QAAQ;AAC3F,UAAM,OAAO,UAAU,OAAO;AAC9B,UAAM,WAAW,WAAW,MAAM;AAElC,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAM,UAAU,SAAY;AAAA,QAC5B,WAAW,eAAe,EAAE,SAAS,MAAM,SAAS,UAAU,CAAC;AAAA,QAC9D,GAAG;AAAA,QACJ;AAAA,QAEC,oBACC,iCACE;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,eAAW;AAAA,cACX,WAAU;AAAA,cAET,GAAG,EAAE,OAAO,GAAG;AAAA,cAEf;AAAA;AAAA,UACH;AAAA,UACA,oBAAC,UAAK,WAAU,qDACd,8BAAC,WAAQ,GACX;AAAA,WACF,IAEA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;","names":[]}