react-shadcn-kit 0.2.2 → 0.2.3

package/dist/components/primitives/toggle-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-group.js","sources":["../../../src/components/primitives/toggle-group.tsx"],"sourcesContent":["import * as React from \"react\";\nimport * as ToggleGroupPrimitive from \"@radix-ui/react-toggle-group\";\nimport { type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils\";\nimport { toggleVariants } from \"../primitives/toggle-variants\";\n\nconst ToggleGroupContext = React.createContext<\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number;\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  spacing: 0,\n});\n\nfunction ToggleGroup({\n  className,\n  variant,\n  size,\n  spacing = 0,\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number;\n  }) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-spacing={spacing}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        \"group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-md data-[spacing=default]:data-[variant=outline]:shadow-xs\",\n        className,\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider value={{ variant, size, spacing }}>\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  );\n}\n\nfunction ToggleGroupItem({\n  className,\n  children,\n  variant,\n  size,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>) {\n  const context = React.useContext(ToggleGroupContext);\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      data-spacing={context.spacing}\n      className={cn(\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n        }),\n        \"w-auto min-w-0 shrink-0 px-3 focus:z-10 focus-visible:z-10\",\n        \"data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none data-[spacing=0]:first:rounded-l-md data-[spacing=0]:last:rounded-r-md data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n"],"names":["jsx","React","ToggleGroupPrimitive","cn","toggleVariants","ToggleGroupContext","ToggleGroup","className","variant","size","spacing","children","props","ToggleGroupItem","context"],"mappings":"AAOA,SAAA,OAAAA,SAAA;AAAA,YAAAC,OAAA;AAAA,YAAAC,OAAA;AAAA,SAAA,MAAAC,SAAA;AAAA,SAAA,kBAAAC,SAAA;AAAA,MAAMC,IAAqBJ,EAAM,cAI/B;AAAA,EACA,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AACX,CAAC;AAED,SAASK,EAAY;AAAA,EACnB,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,UAAAC;AAAA,EACA,GAAGC;AACL,GAGK;AACH,SACE,gBAAAZ;AAAA,IAACE,EAAqB;AAAA,IAArB;AAAA,MACC,aAAU;AAAA,MACV,gBAAcM;AAAA,MACd,aAAWC;AAAA,MACX,gBAAcC;AAAA,MACd,OAAO,EAAE,SAASA,EAAA;AAAA,MAClB,WAAWP;AAAA,QACT;AAAA,QACAI;AAAA,MAAA;AAAA,MAED,GAAGK;AAAA,MAEJ,UAAA,gBAAAZ,EAACK,EAAmB,UAAnB,EAA4B,OAAO,EAAE,SAAAG,GAAS,MAAAC,GAAM,SAAAC,EAAA,GAClD,UAAAC,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,SAASE,EAAgB;AAAA,EACvB,WAAAN;AAAA,EACA,UAAAI;AAAA,EACA,SAAAH;AAAA,EACA,MAAAC;AAAA,EACA,GAAGG;AACL,GAAiG;AAC/F,QAAME,IAAUb,EAAM,WAAWI,CAAkB;AAEnD,SACE,gBAAAL;AAAA,IAACE,EAAqB;AAAA,IAArB;AAAA,MACC,aAAU;AAAA,MACV,gBAAcY,EAAQ,WAAWN;AAAA,MACjC,aAAWM,EAAQ,QAAQL;AAAA,MAC3B,gBAAcK,EAAQ;AAAA,MACtB,WAAWX;AAAA,QACTC,EAAe;AAAA,UACb,SAASU,EAAQ,WAAWN;AAAA,UAC5B,MAAMM,EAAQ,QAAQL;AAAA,QAAA,CACvB;AAAA,QACD;AAAA,QACA;AAAA,QACAF;AAAA,MAAA;AAAA,MAED,GAAGK;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"toggle-group.js","sources":["../../../src/components/primitives/toggle-group.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as ToggleGroupPrimitive from \"@radix-ui/react-toggle-group\";\nimport { type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils\";\nimport { toggleVariants } from \"../primitives/toggle-variants\";\n\nconst ToggleGroupContext = React.createContext<\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number;\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  spacing: 0,\n});\n\nfunction ToggleGroup({\n  className,\n  variant,\n  size,\n  spacing = 0,\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number;\n  }) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-spacing={spacing}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        \"group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-md data-[spacing=default]:data-[variant=outline]:shadow-xs\",\n        className,\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider value={{ variant, size, spacing }}>\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  );\n}\n\nfunction ToggleGroupItem({\n  className,\n  children,\n  variant,\n  size,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>) {\n  const context = React.useContext(ToggleGroupContext);\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      data-spacing={context.spacing}\n      className={cn(\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n        }),\n        \"w-auto min-w-0 shrink-0 px-3 focus:z-10 focus-visible:z-10\",\n        \"data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none data-[spacing=0]:first:rounded-l-md data-[spacing=0]:last:rounded-r-md data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n"],"names":[],"mappings":";AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIE;AACM;AACG;AAEX;AAEA;AAAqB;AACnB;AACA;AACA;AACU;AACV;AAEF;AAIE;AACE;AAAsB;AAArB;AACW;AACI;AACH;AACG;AACI;AACP;AACT;AACA;AAAA;AAEE;AAIJ;AAAA;AAGN;AAEA;AAAyB;AACvB;AACA;AACA;AACA;AAEF;AACE;AAEA;AACE;AAAsB;AAArB;AACW;AACuB;AACN;AACL;AACX;AACM;AACe;AACN;AACvB;AACD;AACA;AACA;AAAA;AAEE;AAEH;AAAA;AAGP;;;;;"}

package/dist/components/primitives/toggle.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as i } from "react/jsx-runtime";
 import * as s from "react";
 import * as o from "@radix-ui/react-toggle";

package/dist/components/primitives/toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggle.js","sources":["../../../src/components/primitives/toggle.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\nimport { type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@/lib/utils\";\nimport { toggleVariants } from \"./toggle-variants\";\n\ninterface ToggleProps\n  extends React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root>,\n    VariantProps<typeof toggleVariants> {}\n\nconst Toggle = React.forwardRef<React.ElementRef<typeof TogglePrimitive.Root>, ToggleProps>(\n  ({ className, variant, size, ...props }, ref) => {\n    return (\n      <TogglePrimitive.Root\n        ref={ref}\n        data-slot=\"toggle\"\n        className={cn(toggleVariants({ variant, size, className }))}\n        {...props}\n      />\n    );\n  },\n);\n\nToggle.displayName = TogglePrimitive.Root.displayName;\n\nexport { Toggle };\nexport type { ToggleProps };\n"],"names":["jsx","React","TogglePrimitive","cn","toggleVariants","Toggle","className","variant","size","props","ref"],"mappings":"AAYA,SAAA,OAAAA,SAAA;AAAA,YAAAC,OAAA;AAAA,YAAAC,OAAA;AAAA,SAAA,MAAAC,SAAA;AAAA,SAAA,kBAAAC,SAAA;AAAA,MAAMC,IAASJ,EAAM;AAAA,EACnB,CAAC,EAAE,WAAAK,GAAW,SAAAC,GAAS,MAAAC,GAAM,GAAGC,EAAA,GAASC,MAErC,gBAAAV;AAAA,IAACE,EAAgB;AAAA,IAAhB;AAAA,MACC,KAAAQ;AAAA,MACA,aAAU;AAAA,MACV,WAAWP,EAAGC,EAAe,EAAE,SAAAG,GAAS,MAAAC,GAAM,WAAAF,EAAA,CAAW,CAAC;AAAA,MACzD,GAAGG;AAAA,IAAA;AAAA,EAAA;AAIZ;AAEAJ,EAAO,cAAcH,EAAgB,KAAK;"}
+{"version":3,"file":"toggle.js","sources":["../../../src/components/primitives/toggle.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\nimport { type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@/lib/utils\";\nimport { toggleVariants } from \"./toggle-variants\";\n\ninterface ToggleProps\n  extends React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root>,\n    VariantProps<typeof toggleVariants> {}\n\nconst Toggle = React.forwardRef<React.ElementRef<typeof TogglePrimitive.Root>, ToggleProps>(\n  ({ className, variant, size, ...props }, ref) => {\n    return (\n      <TogglePrimitive.Root\n        ref={ref}\n        data-slot=\"toggle\"\n        className={cn(toggleVariants({ variant, size, className }))}\n        {...props}\n      />\n    );\n  },\n);\n\nToggle.displayName = TogglePrimitive.Root.displayName;\n\nexport { Toggle };\nexport type { ToggleProps };\n"],"names":["Toggle"],"mappings":";AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAqB;AAGf;AAAiB;AAAhB;AACC;AACU;AACgD;AACtD;AAAA;AAIZ;AAEAA;;;;"}

package/dist/components/primitives/tooltip.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as i, jsxs as n } from "react/jsx-runtime";
 import * as o from "@radix-ui/react-tooltip";
 import { cn as d } from "../../lib/utils.js";

package/dist/components/primitives/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","sources":["../../../src/components/primitives/tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction TooltipProvider({\n  delayDuration = 0,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {\n  return (\n    <TooltipPrimitive.Provider\n      data-slot=\"tooltip-provider\"\n      delayDuration={delayDuration}\n      {...props}\n    />\n  );\n}\n\nfunction Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>) {\n  return (\n    <TooltipProvider>\n      <TooltipPrimitive.Root data-slot=\"tooltip\" {...props} />\n    </TooltipProvider>\n  );\n}\n\nfunction TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {\n  return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />;\n}\n\nfunction TooltipContent({\n  className,\n  sideOffset = 0,\n  children,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Content>) {\n  return (\n    <TooltipPrimitive.Portal>\n      <TooltipPrimitive.Content\n        data-slot=\"tooltip-content\"\n        sideOffset={sideOffset}\n        className={cn(\n          \"bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        <TooltipPrimitive.Arrow className=\"bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]\" />\n      </TooltipPrimitive.Content>\n    </TooltipPrimitive.Portal>\n  );\n}\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n"],"names":["jsx","jsxs","TooltipPrimitive","cn","TooltipProvider","delayDuration","props","Tooltip","TooltipTrigger","TooltipContent","className","sideOffset","children"],"mappings":"AAOA,SAAA,OAAAA,GAAA,QAAAC,SAAA;AAAA,YAAAC,OAAA;AAAA,SAAA,MAAAC,SAAA;AAAA,SAASC,EAAgB;AAAA,EACvB,eAAAC,IAAgB;AAAA,EAChB,GAAGC;AACL,GAA2D;AACzD,SACE,gBAAAN;AAAA,IAACE,EAAiB;AAAA,IAAjB;AAAA,MACC,aAAU;AAAA,MACV,eAAAG;AAAA,MACC,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASC,EAAQ,EAAE,GAAGD,KAA6D;AACjF,SACE,gBAAAN,EAACI,GAAA,EACC,UAAA,gBAAAJ,EAACE,EAAiB,MAAjB,EAAsB,aAAU,WAAW,GAAGI,EAAA,CAAO,EAAA,CACxD;AAEJ;AAEA,SAASE,EAAe,EAAE,GAAGF,KAAgE;AAC3F,2BAAQJ,EAAiB,SAAjB,EAAyB,aAAU,mBAAmB,GAAGI,GAAO;AAC1E;AAEA,SAASG,EAAe;AAAA,EACtB,WAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,UAAAC;AAAA,EACA,GAAGN;AACL,GAA0D;AACxD,SACE,gBAAAN,EAACE,EAAiB,QAAjB,EACC,UAAA,gBAAAD;AAAA,IAACC,EAAiB;AAAA,IAAjB;AAAA,MACC,aAAU;AAAA,MACV,YAAAS;AAAA,MACA,WAAWR;AAAA,QACT;AAAA,QACAO;AAAA,MAAA;AAAA,MAED,GAAGJ;AAAA,MAEH,UAAA;AAAA,QAAAM;AAAA,QACD,gBAAAZ,EAACE,EAAiB,OAAjB,EAAuB,WAAU,qGAAA,CAAqG;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAE3I;AAEJ;"}
+{"version":3,"file":"tooltip.js","sources":["../../../src/components/primitives/tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction TooltipProvider({\n  delayDuration = 0,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {\n  return (\n    <TooltipPrimitive.Provider\n      data-slot=\"tooltip-provider\"\n      delayDuration={delayDuration}\n      {...props}\n    />\n  );\n}\n\nfunction Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>) {\n  return (\n    <TooltipProvider>\n      <TooltipPrimitive.Root data-slot=\"tooltip\" {...props} />\n    </TooltipProvider>\n  );\n}\n\nfunction TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {\n  return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />;\n}\n\nfunction TooltipContent({\n  className,\n  sideOffset = 0,\n  children,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Content>) {\n  return (\n    <TooltipPrimitive.Portal>\n      <TooltipPrimitive.Content\n        data-slot=\"tooltip-content\"\n        sideOffset={sideOffset}\n        className={cn(\n          \"bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        <TooltipPrimitive.Arrow className=\"bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]\" />\n      </TooltipPrimitive.Content>\n    </TooltipPrimitive.Portal>\n  );\n}\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n"],"names":[],"mappings":";AAOA;AAAA;AAAA;AAAA;AAAyB;AACP;AAElB;AACE;AACE;AAAkB;AAAjB;AACW;AACV;AACI;AAAA;AAGV;AAEA;AACE;AAKF;AAEA;AACE;AACF;AAEA;AAAwB;AACtB;AACa;AACb;AAEF;AACE;AAEI;AAAkB;AAAjB;AACW;AACV;AACW;AACT;AACA;AAAA;AAEE;AAEH;AAAA;AACsI;AAAA;AAAA;AAI/I;;;;;;;"}

package/dist/hooks/use-aria-live.js

@@ -1,3 +1,4 @@
+"use client";
 import { useRef as r, useEffect as u } from "react";
 function c() {
   const t = r(null), n = (e) => {

package/dist/hooks/use-aria-live.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-aria-live.js","sources":["../../src/hooks/use-aria-live.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\n/**\n * useAriaLive\n *\n * Provides a simple way to announce dynamic content to screen readers using an\n * `aria-live` region. The hook returns a ref that should be attached to a hidden\n * element and a function to update the live message.\n *\n * Example usage:\n * ```tsx\n * const { liveRef, announce } = useAriaLive();\n * return (\n *   <>\n *     <div ref={liveRef} aria-live=\"polite\" className=\"sr-only\" />\n *     <button onClick={() => announce('Item added')}>Add</button>\n *   </>\n * );\n * ```\n */\nexport function useAriaLive() {\n  const liveRef = useRef<HTMLDivElement>(null);\n\n  const announce = (message: string) => {\n    if (liveRef.current) {\n      // Clear previous message to ensure screen readers pick up the new one\n      liveRef.current.textContent = \"\";\n      // Use a timeout to allow the DOM to register the change\n      setTimeout(() => {\n        if (liveRef.current) {\n          liveRef.current.textContent = message;\n        }\n      }, 100);\n    }\n  };\n\n  // Cleanup on unmount\n  useEffect(() => {\n    const liveElement = liveRef.current;\n    return () => {\n      if (liveElement) {\n        liveElement.textContent = \"\";\n      }\n    };\n  }, []);\n\n  return { liveRef, announce } as const;\n}\n"],"names":["useRef","useEffect","useAriaLive","liveRef","announce","message","liveElement"],"mappings":"AAoBO,SAAA,UAAAA,GAAA,aAAAC,SAAA;AAAA,SAASC,IAAc;AAC5B,QAAMC,IAAUH,EAAuB,IAAI,GAErCI,IAAW,CAACC,MAAoB;AACpC,IAAIF,EAAQ,YAEVA,EAAQ,QAAQ,cAAc,IAE9B,WAAW,MAAM;AACf,MAAIA,EAAQ,YACVA,EAAQ,QAAQ,cAAcE;AAAA,IAElC,GAAG,GAAG;AAAA,EAEV;AAGA,SAAAJ,EAAU,MAAM;AACd,UAAMK,IAAcH,EAAQ;AAC5B,WAAO,MAAM;AACX,MAAIG,MACFA,EAAY,cAAc;AAAA,IAE9B;AAAA,EACF,GAAG,CAAA,CAAE,GAEE,EAAE,SAAAH,GAAS,UAAAC,EAAA;AACpB;"}
+{"version":3,"file":"use-aria-live.js","sources":["../../src/hooks/use-aria-live.ts"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useRef } from \"react\";\n\n/**\n * useAriaLive\n *\n * Provides a simple way to announce dynamic content to screen readers using an\n * `aria-live` region. The hook returns a ref that should be attached to a hidden\n * element and a function to update the live message.\n *\n * Example usage:\n * ```tsx\n * const { liveRef, announce } = useAriaLive();\n * return (\n *   <>\n *     <div ref={liveRef} aria-live=\"polite\" className=\"sr-only\" />\n *     <button onClick={() => announce('Item added')}>Add</button>\n *   </>\n * );\n * ```\n */\nexport function useAriaLive() {\n  const liveRef = useRef<HTMLDivElement>(null);\n\n  const announce = (message: string) => {\n    if (liveRef.current) {\n      // Clear previous message to ensure screen readers pick up the new one\n      liveRef.current.textContent = \"\";\n      // Use a timeout to allow the DOM to register the change\n      setTimeout(() => {\n        if (liveRef.current) {\n          liveRef.current.textContent = message;\n        }\n      }, 100);\n    }\n  };\n\n  // Cleanup on unmount\n  useEffect(() => {\n    const liveElement = liveRef.current;\n    return () => {\n      if (liveElement) {\n        liveElement.textContent = \"\";\n      }\n    };\n  }, []);\n\n  return { liveRef, announce } as const;\n}\n"],"names":[],"mappings":";AAsBO;AAAA;AACL;AAGE;AAKI;AACgC;AAE5B;AAKV;AACE;AACA;AACE;AAC4B;AAE9B;AAIJ;;;;"}

package/dist/hooks/use-focus-visible.js

@@ -1,3 +1,4 @@
+"use client";
 import { useState as r, useEffect as i } from "react";
 function u() {
   const [t, o] = r(!1);

package/dist/hooks/use-focus-visible.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-focus-visible.js","sources":["../../src/hooks/use-focus-visible.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\n/**\n * useFocusVisible\n *\n * Detects when the user is navigating via keyboard (focus-visible) and provides a\n * boolean flag that can be used to apply a visual focus style only for keyboard\n * users. This mirrors the behavior of the `:focus-visible` CSS pseudo‑class but\n * works in browsers that lack native support.\n *\n * Example usage:\n * ```tsx\n * const isFocusVisible = useFocusVisible();\n * return <button className={isFocusVisible ? 'focus-visible' : ''}>Click</button>;\n * ```\n */\nexport function useFocusVisible() {\n  const [isFocusVisible, setIsFocusVisible] = useState(false);\n\n  useEffect(() => {\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (\n        e.key === \"Tab\" ||\n        e.key === \"Shift\" ||\n        e.key === \"ArrowUp\" ||\n        e.key === \"ArrowDown\" ||\n        e.key === \"ArrowLeft\" ||\n        e.key === \"ArrowRight\"\n      ) {\n        setIsFocusVisible(true);\n      }\n    };\n    const onMouseDown = () => setIsFocusVisible(false);\n\n    window.addEventListener(\"keydown\", onKeyDown);\n    window.addEventListener(\"mousedown\", onMouseDown);\n    return () => {\n      window.removeEventListener(\"keydown\", onKeyDown);\n      window.removeEventListener(\"mousedown\", onMouseDown);\n    };\n  }, []);\n\n  return isFocusVisible;\n}\n"],"names":["useState","useEffect","useFocusVisible","isFocusVisible","setIsFocusVisible","onKeyDown","onMouseDown"],"mappings":"AAgBO,SAAA,YAAAA,GAAA,aAAAC,SAAA;AAAA,SAASC,IAAkB;AAChC,QAAM,CAACC,GAAgBC,CAAiB,IAAIJ,EAAS,EAAK;AAE1D,SAAAC,EAAU,MAAM;AACd,UAAMI,IAAY,CAAC,MAAqB;AACtC,OACE,EAAE,QAAQ,SACV,EAAE,QAAQ,WACV,EAAE,QAAQ,aACV,EAAE,QAAQ,eACV,EAAE,QAAQ,eACV,EAAE,QAAQ,iBAEVD,EAAkB,EAAI;AAAA,IAE1B,GACME,IAAc,MAAMF,EAAkB,EAAK;AAEjD,kBAAO,iBAAiB,WAAWC,CAAS,GAC5C,OAAO,iBAAiB,aAAaC,CAAW,GACzC,MAAM;AACX,aAAO,oBAAoB,WAAWD,CAAS,GAC/C,OAAO,oBAAoB,aAAaC,CAAW;AAAA,IACrD;AAAA,EACF,GAAG,CAAA,CAAE,GAEEH;AACT;"}
+{"version":3,"file":"use-focus-visible.js","sources":["../../src/hooks/use-focus-visible.ts"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\n\n/**\n * useFocusVisible\n *\n * Detects when the user is navigating via keyboard (focus-visible) and provides a\n * boolean flag that can be used to apply a visual focus style only for keyboard\n * users. This mirrors the behavior of the `:focus-visible` CSS pseudo‑class but\n * works in browsers that lack native support.\n *\n * Example usage:\n * ```tsx\n * const isFocusVisible = useFocusVisible();\n * return <button className={isFocusVisible ? 'focus-visible' : ''}>Click</button>;\n * ```\n */\nexport function useFocusVisible() {\n  const [isFocusVisible, setIsFocusVisible] = useState(false);\n\n  useEffect(() => {\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (\n        e.key === \"Tab\" ||\n        e.key === \"Shift\" ||\n        e.key === \"ArrowUp\" ||\n        e.key === \"ArrowDown\" ||\n        e.key === \"ArrowLeft\" ||\n        e.key === \"ArrowRight\"\n      ) {\n        setIsFocusVisible(true);\n      }\n    };\n    const onMouseDown = () => setIsFocusVisible(false);\n\n    window.addEventListener(\"keydown\", onKeyDown);\n    window.addEventListener(\"mousedown\", onMouseDown);\n    return () => {\n      window.removeEventListener(\"keydown\", onKeyDown);\n      window.removeEventListener(\"mousedown\", onMouseDown);\n    };\n  }, []);\n\n  return isFocusVisible;\n}\n"],"names":[],"mappings":";AAkBO;AAAA;AACL;AAEA;AACE;AACE;AAQwB;AAK1B;AAGE;AACmD;AACrD;AAIJ;;;;"}

package/dist/hooks/use-mobile.js

@@ -1,3 +1,4 @@
+"use client";
 import * as o from "react";
 const e = 768;
 function r() {

package/dist/hooks/use-mobile.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-mobile.js","sources":["../../src/hooks/use-mobile.ts"],"sourcesContent":["import * as React from \"react\";\n\nconst MOBILE_BREAKPOINT = 768;\n\nexport function useIsMobile() {\n  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined);\n\n  React.useEffect(() => {\n    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);\n    const onChange = () => {\n      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);\n    };\n    mql.addEventListener(\"change\", onChange);\n    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);\n    return () => mql.removeEventListener(\"change\", onChange);\n  }, []);\n\n  return !!isMobile;\n}\n"],"names":["MOBILE_BREAKPOINT","useIsMobile","isMobile","setIsMobile","React","mql","onChange"],"mappings":";AAEA,MAAMA,IAAoB;AAEnB,SAASC,IAAc;AAC5B,QAAM,CAACC,GAAUC,CAAW,IAAIC,EAAM,SAA8B,MAAS;AAE7E,SAAAA,EAAM,UAAU,MAAM;AACpB,UAAMC,IAAM,OAAO,WAAW,eAAeL,IAAoB,CAAC,KAAK,GACjEM,IAAW,MAAM;AACrB,MAAAH,EAAY,OAAO,aAAaH,CAAiB;AAAA,IACnD;AACA,WAAAK,EAAI,iBAAiB,UAAUC,CAAQ,GACvCH,EAAY,OAAO,aAAaH,CAAiB,GAC1C,MAAMK,EAAI,oBAAoB,UAAUC,CAAQ;AAAA,EACzD,GAAG,CAAA,CAAE,GAEE,CAAC,CAACJ;AACX;"}
+{"version":3,"file":"use-mobile.js","sources":["../../src/hooks/use-mobile.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nconst MOBILE_BREAKPOINT = 768;\n\nexport function useIsMobile() {\n  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined);\n\n  React.useEffect(() => {\n    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);\n    const onChange = () => {\n      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);\n    };\n    mql.addEventListener(\"change\", onChange);\n    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);\n    return () => mql.removeEventListener(\"change\", onChange);\n  }, []);\n\n  return !!isMobile;\n}\n"],"names":[],"mappings":";;AAIA;AAEO;AACL;AAEA;AACE;AAEE;AAAiD;AAEnD;AAEuD;AAI3D;;;;"}

package/dist/hooks/use-screen-reader-only.js

@@ -1,3 +1,4 @@
+"use client";
 import { useEffect as r } from "react";
 function p() {
   const e = "absolute w-px h-px overflow-hidden whitespace-nowrap border-0 p-0 -m-px clip[rect(0,0,0,0)]";

package/dist/hooks/use-screen-reader-only.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-screen-reader-only.js","sources":["../../src/hooks/use-screen-reader-only.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\n/**\n * useScreenReaderOnly\n *\n * Provides a utility hook that returns a className string for visually hidden\n * elements that are still accessible to screen readers. It mirrors the common\n * `sr-only` utility from Tailwind but can be used without Tailwind.\n *\n * Example usage:\n * ```tsx\n * const srOnly = useScreenReaderOnly();\n * return <span className={srOnly}>Only for screen readers</span>;\n * ```\n */\nexport function useScreenReaderOnly() {\n  // The className mirrors Tailwind's `sr-only` implementation.\n  const className =\n    \"absolute w-px h-px overflow-hidden whitespace-nowrap border-0 p-0 -m-px clip[rect(0,0,0,0)]\";\n\n  // Ensure the element is removed from the visual flow on mount (no side‑effects needed).\n  useEffect(() => {}, []);\n\n  return className;\n}\n"],"names":["useEffect","useScreenReaderOnly","className"],"mappings":"AAeO,SAAA,aAAAA,SAAA;AAAA,SAASC,IAAsB;AAEpC,QAAMC,IACJ;AAGF,SAAAF,EAAU,MAAM;AAAA,EAAC,GAAG,CAAA,CAAE,GAEfE;AACT;"}
+{"version":3,"file":"use-screen-reader-only.js","sources":["../../src/hooks/use-screen-reader-only.ts"],"sourcesContent":["\"use client\";\n\nimport { useEffect } from \"react\";\n\n/**\n * useScreenReaderOnly\n *\n * Provides a utility hook that returns a className string for visually hidden\n * elements that are still accessible to screen readers. It mirrors the common\n * `sr-only` utility from Tailwind but can be used without Tailwind.\n *\n * Example usage:\n * ```tsx\n * const srOnly = useScreenReaderOnly();\n * return <span className={srOnly}>Only for screen readers</span>;\n * ```\n */\nexport function useScreenReaderOnly() {\n  // The className mirrors Tailwind's `sr-only` implementation.\n  const className =\n    \"absolute w-px h-px overflow-hidden whitespace-nowrap border-0 p-0 -m-px clip[rect(0,0,0,0)]\";\n\n  // Ensure the element is removed from the visual flow on mount (no side‑effects needed).\n  useEffect(() => {}, []);\n\n  return className;\n}\n"],"names":[],"mappings":";AAiBO;AAAA;AAEL;AAIA;AAAgB;AAGlB;;;;"}

package/dist/index.d.ts

@@ -6,6 +6,8 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import { ClassProp } from 'class-variance-authority/types';
 import { ClassValue } from 'clsx';
 import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+import { Column } from '@tanstack/react-table';
+import { ColumnDef } from '@tanstack/react-table';
 import { Command as Command_2 } from 'cmdk';
 import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
 import { ControllerProps } from 'react-hook-form';
@@ -32,6 +34,7 @@ import * as React_2 from 'react';
 import * as RechartsPrimitive from 'recharts';
 import { RefObject } from 'react';
 import * as ResizablePrimitive from 'react-resizable-panels';
+import { Row } from '@tanstack/react-table';
 import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
@@ -39,6 +42,7 @@ import { SeparatorProps } from '@radix-ui/react-separator';
 import * as SliderPrimitive from '@radix-ui/react-slider';
 import { SlotProps } from '@radix-ui/react-slot';
 import * as SwitchPrimitive from '@radix-ui/react-switch';
+import { Table as Table_2 } from '@tanstack/react-table';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 import { ThemeProvider as ThemeProvider_2 } from 'next-themes';
 import { ToasterProps } from 'sonner';
@@ -393,6 +397,88 @@ export declare const customButtonVariants: (props?: ({
     size?: "default" | "sm" | "lg" | "icon" | null | undefined;
 } & ClassProp) | undefined) => string;
 
+export declare function DataTable<TData, TValue>({ columns, data, searchKey, onRowClick, renderSubComponent, enableRowExpansion, enableColumnSizing, enableColumnPinning, enableGlobalFilter, enableColumnOrdering, enableRowPinning, facetedFilters, }: DataTableProps<TData, TValue>): JSX.Element;
+
+export declare function DataTableColumnHeader<TData, TValue>({ column, title, className, }: DataTableColumnHeaderProps<TData, TValue>): JSX.Element;
+
+declare interface DataTableColumnHeaderProps<TData, TValue> extends React.HTMLAttributes<HTMLDivElement> {
+    column: Column<TData, TValue>;
+    title: string;
+}
+
+export declare function DataTableFacetedFilter<TData, TValue>({ column, title, options, }: DataTableFacetedFilterProps<TData, TValue>): JSX.Element;
+
+declare interface DataTableFacetedFilterProps<TData, TValue> {
+    column?: Column<TData, TValue>;
+    title?: string;
+    options: {
+        label: string;
+        value: string;
+        icon?: React_2.ComponentType<{
+            className?: string;
+        }>;
+    }[];
+}
+
+export declare function DataTablePagination<TData>({ table }: DataTablePaginationProps<TData>): JSX.Element;
+
+declare interface DataTablePaginationProps<TData> {
+    table: Table_2<TData>;
+}
+
+declare interface DataTableProps<TData, TValue> {
+    columns: ColumnDef<TData, TValue>[];
+    data: TData[];
+    searchKey?: string;
+    onRowClick?: (row: Row<TData>) => void;
+    renderSubComponent?: (props: {
+        row: Row<TData>;
+    }) => React_2.ReactNode;
+    enableRowExpansion?: boolean;
+    enableColumnSizing?: boolean;
+    enableColumnPinning?: boolean;
+    enableGlobalFilter?: boolean;
+    enableColumnOrdering?: boolean;
+    enableRowPinning?: boolean;
+    facetedFilters?: {
+        columnId: string;
+        title: string;
+        options: {
+            label: string;
+            value: string;
+            icon?: React_2.ComponentType<{
+                className?: string;
+            }>;
+        }[];
+    }[];
+}
+
+export declare function DataTableToolbar<TData>({ table, searchKey, placeholder, enableGlobalFilter, facetedFilters, }: DataTableToolbarProps<TData>): JSX.Element;
+
+declare interface DataTableToolbarProps<TData> {
+    table: Table_2<TData>;
+    searchKey?: string;
+    placeholder?: string;
+    enableGlobalFilter?: boolean;
+    facetedFilters?: {
+        columnId: string;
+        title: string;
+        options: {
+            label: string;
+            value: string;
+            icon?: React.ComponentType<{
+                className?: string;
+            }>;
+        }[];
+    }[];
+}
+
+export declare function DataTableViewOptions<TData>({ table }: DataTableViewOptionsProps<TData>): JSX.Element;
+
+declare interface DataTableViewOptionsProps<TData> {
+    table: Table_2<TData>;
+}
+
 export declare function Dialog({ ...props }: React_2.ComponentProps<typeof DialogPrimitive.Root>): JSX.Element;
 
 export declare function DialogClose({ ...props }: React_2.ComponentProps<typeof DialogPrimitive.Close>): JSX.Element;
@@ -646,6 +732,64 @@ declare const itemVariants: (props?: ({
     size?: "default" | "sm" | null | undefined;
 } & ClassProp) | undefined) => string;
 
+export declare function Kanban<T extends KanbanItem>({ items, columns, onItemUpdate, onItemClick, renderCard, className, }: KanbanRootProps<T>): JSX.Element;
+
+export declare const KanbanCard: typeof KanbanCardInner;
+
+export declare function KanbanCardDescription({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+declare const KanbanCardInner: <T extends KanbanItem>({ card, onCardClick, renderCard, className, }: KanbanCardProps<T>) => JSX.Element;
+
+declare interface KanbanCardProps<T extends KanbanItem> {
+    card: T;
+    onCardClick?: (item: T) => void;
+    renderCard?: (item: T) => React_2.ReactNode;
+    className?: string;
+}
+
+export declare function KanbanCardTitle({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function KanbanColumn<T extends KanbanItem>({ column, items, onCardClick, renderCard, className, }: KanbanColumnProps<T>): JSX.Element;
+
+export declare function KanbanColumnBadge({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function KanbanColumnContent({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare interface KanbanColumnDef {
+    id: string;
+    title: string;
+}
+
+export declare function KanbanColumnHeader({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+declare interface KanbanColumnProps<T extends KanbanItem> {
+    column: KanbanColumnDef;
+    items: T[];
+    onCardClick?: (item: T) => void;
+    renderCard?: (item: T) => React_2.ReactNode;
+    className?: string;
+}
+
+export declare type KanbanId = string | number;
+
+export declare interface KanbanItem {
+    id: KanbanId;
+    status: string;
+    title?: string;
+    name?: string;
+    description?: string;
+    [key: string]: unknown;
+}
+
+declare interface KanbanRootProps<T extends KanbanItem> {
+    items: T[];
+    columns?: KanbanColumnDef[];
+    onItemUpdate: (itemId: KanbanId, newStatus: string) => void;
+    onItemClick?: (item: T) => void;
+    renderCard?: (item: T) => React_2.ReactNode;
+    className?: string;
+}
+
 export declare function Kbd({ className, ...props }: React.ComponentProps<"kbd">): JSX.Element;
 
 export declare function KbdGroup({ className, ...props }: React.ComponentProps<"div">): JSX.Element;