@vllnt/ui 0.2.1-canary.be68966 → 0.2.1-canary.bf41f62

package/dist/components/activity-log/activity-log.js

@@ -3,7 +3,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, useMemo, useState } from "react";
 import { ArrowRight, ChevronLeft, ChevronRight } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Avatar, AvatarFallback } from "../avatar";
+import { Avatar, AvatarFallback } from "../avatar/avatar";
 import { Badge } from "../badge";
 import { Button } from "../button";
 import {

package/dist/components/ai-chat-input/ai-chat-input.js

@@ -3,7 +3,7 @@ import { forwardRef } from "react";
 import { cva } from "class-variance-authority";
 import { LoaderCircle, SendHorizontal } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 import { Textarea } from "../textarea";
 const formShellVariants = cva(
   "rounded-2xl border border-border/70 bg-background shadow-sm"

package/dist/components/ai-message-bubble/ai-message-bubble.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { cva } from "class-variance-authority";
 import { cn } from "../../lib/utils";
-import { Avatar, AvatarFallback } from "../avatar";
+import { Avatar, AvatarFallback } from "../avatar/avatar";
 import { Badge } from "../badge";
 const bubbleVariants = cva(
   "rounded-2xl border px-4 py-3 shadow-sm transition-colors",

package/dist/components/ai-tool-call-display/ai-tool-call-display.js

@@ -3,7 +3,7 @@ import { forwardRef } from "react";
 import { cva } from "class-variance-authority";
 import { AlertCircle, CheckCircle2, Clock3, Wrench } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 const statusVariants = cva(
   "rounded-full px-2 py-0 text-[10px] uppercase tracking-wide",
   {

package/dist/components/annotation/annotation.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "../../lib/utils";
-import { Popover, PopoverContent, PopoverTrigger } from "../popover";
+import { Popover, PopoverContent, PopoverTrigger } from "../popover/popover";
 const toneClasses = {
   amber: "bg-amber-500/20 text-amber-950 dark:text-amber-100",
   emerald: "bg-emerald-500/20 text-emerald-950 dark:text-emerald-100",

package/dist/components/avatar-group/avatar-group.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cva } from "class-variance-authority";
 import { cn } from "../../lib/utils";
-import { Avatar, AvatarFallback, AvatarImage } from "../avatar";
+import { Avatar, AvatarFallback, AvatarImage } from "../avatar/avatar";
 const avatarGroupVariants = cva("flex items-center", {
   defaultVariants: {
     size: "md"

package/dist/components/blog-card/blog-card.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import Link from "next/link";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import {
   Card,
   CardContent,

package/dist/components/canvas-shell/canvas-foundation-demo.js

@@ -1,6 +1,6 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Activity, Bot, Compass, Layers3, Sparkles } from "lucide-react";
-import { BottomBar } from "../bottom-bar";
+import { BottomBar } from "../bottom-bar/bottom-bar";
 import { Button } from "../button";
 import { CanvasView } from "../canvas-view";
 import { ChatDockSection } from "../chat-dock-section";

package/dist/components/category-filter/category-filter.js

@@ -2,7 +2,7 @@
 import { jsx } from "react/jsx-runtime";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 function slugify(text) {
   return text.toLowerCase().normalize("NFD").replaceAll(/[\u0300-\u036F]/g, "").replaceAll(/[^\s\w-]/g, "").trim().replaceAll(/\s+/g, "-").replaceAll(/-+/g, "-").replaceAll(/^-+|-+$/g, "");
 }

package/dist/components/chat-dock-section/chat-dock-section.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { ArrowUpRight, MessageSquareText } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 const ChatDockSection = forwardRef(
   ({
     className,

package/dist/components/code-playground/code-playground.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Check, Code, Copy, FileCode } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 function CodeLine({ highlightLines, line, lineNumber }) {
   const isHighlighted = highlightLines.includes(lineNumber);
   return /* @__PURE__ */ jsxs("div", { className: cn("flex", isHighlighted && "bg-primary/10 -mx-4 px-4"), children: [

package/dist/components/combobox/combobox.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { Check, ChevronsUpDown } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 import {
   Command,
   CommandEmpty,

package/dist/components/completion-dialog/completion-dialog.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { memo, useEffect, useRef } from "react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 function DialogContent({
   as: Heading = "h2",
   cancelLabel = "Skip",

package/dist/components/connector-edge/connector-edge.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { cn } from "../../lib/utils";
-import { EdgeLabel } from "../edge-label";
+import { EdgeLabel } from "../edge-label/edge-label";
 const strokeClasses = {
   active: "stroke-sky-500",
   blocked: "stroke-amber-500",

package/dist/components/content-intro/content-intro.js

@@ -2,7 +2,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { memo, useEffect, useRef } from "react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 const DEFAULT_LABELS = {
   continueLabel: "Continue Tutorial",
   startLabel: "Start Tutorial",

package/dist/components/conversation-thread/conversation-thread.js

@@ -12,7 +12,7 @@ import {
 } from "react";
 import { ArrowDown, RefreshCw, ThumbsDown, ThumbsUp } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { ThinkingBlock } from "../thinking-block";
+import { ThinkingBlock } from "../thinking-block/thinking-block";
 const ConversationThreadContext = createContext(null);
 function useConversationThreadContext() {
   const ctx = useContext(ConversationThreadContext);

package/dist/components/countdown-timer/countdown-timer.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import {
   Card,
   CardContent,

package/dist/components/data-table/data-table.js

@@ -11,7 +11,7 @@ import {
 } from "@tanstack/react-table";
 import { ArrowDown, ArrowUp, ArrowUpDown } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 import { Checkbox } from "../checkbox";
 import { Input } from "../input";
 import {

package/dist/components/date-picker/date-picker.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { CalendarIcon } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 import { Calendar } from "../calendar";
 import { Popover, PopoverContent, PopoverTrigger } from "../popover";
 const defaultDateFormatter = new Intl.DateTimeFormat("en-US", {

package/dist/components/exercise/exercise.js

@@ -3,7 +3,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Check, Dumbbell, Eye, EyeOff } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 const difficultyConfig = {
   easy: { className: "text-green-600 dark:text-green-400", label: "Easy" },
   hard: { className: "text-red-600 dark:text-red-400", label: "Hard" },

package/dist/components/file-upload/file-upload.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { FileUp, UploadCloud, X } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 function useFileUploadState(controlledFiles, multiple, onFilesChange) {
   const [internalFiles, setInternalFiles] = React.useState(
     controlledFiles ?? []

package/dist/components/filter-bar/filter-bar.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { memo, useCallback, useTransition } from "react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 function SearchInput({
   disabled,
   label,

package/dist/components/flashcard/flashcard.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { RefreshCcw } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import { Button } from "../button";
 import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "../card";
 function Flashcard({

package/dist/components/form/form.js

@@ -10,7 +10,7 @@ import {
   useFormContext
 } from "react-hook-form";
 import { cn } from "../../lib/utils";
-import { Label } from "../label";
+import { Label } from "../label/label";
 const FormRootContext = React.createContext(
   void 0
 );

package/dist/components/inline-input/inline-input.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { cn } from "../../lib/utils";
-import { Input } from "../input";
+import { Input } from "../input/input";
 function InlineInput({
   className,
   onCancel,

package/dist/components/live-feed/live-feed.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import {
   Card,
   CardContent,

package/dist/components/metric-gauge/metric-gauge.js

@@ -1,7 +1,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import {
   Card,
   CardContent,

package/dist/components/model-selector/model-selector.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useMemo, useRef, useState } from "react";
 import { ArrowUpDown, Filter } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import { Button } from "../button";
 import {
   Command,

package/dist/components/multi-select/multi-select.js

@@ -3,7 +3,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { Check, ChevronDown } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import { Button } from "../button";
 import {
   Command,

package/dist/components/navbar-saas/navbar-saas.js

@@ -4,10 +4,9 @@ import { Menu, X } from "lucide-react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 import { useSidebar } from "../sidebar-provider";
 import { ThemeToggle } from "../theme-toggle";
-import { useMobile } from "./use-mobile";
 const EMPTY_NAV_ITEMS = [];
 function NavbarSaas({
   brand,
@@ -17,13 +16,13 @@ function NavbarSaas({
 }) {
   const pathname = usePathname();
   const { open, setOpen } = useSidebar();
-  const isMobile = useMobile();
   return /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60 shrink-0", children: /* @__PURE__ */ jsx("div", { className: "w-full", children: /* @__PURE__ */ jsxs("div", { className: "mx-auto flex h-16 items-center justify-between px-4", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
-      showMobileMenu && isMobile ? /* @__PURE__ */ jsx(
+      showMobileMenu ? /* @__PURE__ */ jsx(
         Button,
         {
-          className: "lg:hidden",
+          "aria-expanded": open,
+          "aria-label": "Toggle sidebar",
           "data-testid": "navbar-saas-mobile-trigger",
           onClick: () => {
             setOpen(!open);
@@ -34,7 +33,7 @@ function NavbarSaas({
         }
       ) : null,
       brand ? typeof brand === "string" ? /* @__PURE__ */ jsx(Link, { className: "text-xl font-bold truncate", href: "/", children: brand }) : brand : null,
-      navItems.length > 0 ? /* @__PURE__ */ jsx("nav", { className: "hidden md:flex gap-6", children: navItems.map((item) => /* @__PURE__ */ jsx(
+      navItems.length > 0 ? /* @__PURE__ */ jsx("nav", { className: "hidden lg:flex gap-6", children: navItems.map((item) => /* @__PURE__ */ jsx(
         Link,
         {
           className: cn(

package/dist/components/number-input/number-input.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { Minus, Plus } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 function getNumericBound(bound) {
   if (bound === void 0) {
     return;

package/dist/components/object-card/object-card.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import { Button } from "../button";
 const stateClasses = {
   blocked: "border-amber-500/30 bg-amber-500/10 text-amber-700 dark:text-amber-300",

package/dist/components/overview-board/overview-board.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { AlertCircle, ArrowRight, Inbox, ListTodo, Siren } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 const toneClassNames = {
   danger: "border-red-500/30 bg-red-500/8",
   default: "border-border/70 bg-background/80",

package/dist/components/progress-card/progress-card.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { memo, useEffect, useState } from "react";
 import { useMounted } from "../../lib/use-mounted";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import {
   Card,
   CardContent,

package/dist/components/progress-tracker/progress-tracker.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import {
   Card,
   CardContent,

package/dist/components/scope-selector/scope-selector.js

@@ -3,7 +3,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, useMemo, useState } from "react";
 import { Check, ChevronRight, Search } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import { Button } from "../button";
 import { Input } from "../input";
 import { Popover, PopoverContent, PopoverTrigger } from "../popover";

package/dist/components/search-dialog/search-dialog.js

@@ -10,7 +10,7 @@ import {
 } from "react";
 import { Search } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 import {
   CommandDialog,
   CommandEmpty,

package/dist/components/sidebar/sidebar.js

@@ -4,8 +4,9 @@ import { useEffect, useRef, useState, useSyncExternalStore } from "react";
 import { ChevronDown } from "lucide-react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
+import { useMounted } from "../../lib/use-mounted";
 import { cn } from "../../lib/utils";
-import { useSidebar } from "../sidebar-provider";
+import { useSidebar } from "../sidebar-provider/sidebar-provider";
 const getMobileSnapshot = () => typeof window === "undefined" ? false : window.innerWidth < 1024;
 const getServerMobileSnapshot = () => false;
 const subscribeToViewportResize = (onStoreChange) => {
@@ -97,10 +98,12 @@ function Sidebar({ sections }) {
   const pathname = usePathname();
   const { open, setOpen } = useSidebar();
   const isMobile = useMobile(setOpen);
+  const mounted = useMounted();
   const scrollContainerReference = useRef(null);
   const { showBottomFade, showTopFade } = useScrollFade(
     scrollContainerReference
   );
+  const collapsed = mounted && !isMobile && !open;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     isMobile && open ? /* @__PURE__ */ jsx(
       "div",
@@ -123,15 +126,16 @@ function Sidebar({ sections }) {
       "aside",
       {
         className: cn(
-          "fixed lg:relative top-16 lg:top-0 bottom-0 lg:bottom-auto left-0 z-40 lg:h-full border-r bg-background transition-transform duration-300 ease-in-out",
+          "fixed lg:relative top-16 lg:top-0 bottom-0 lg:bottom-auto left-0 z-40 lg:h-full bg-background transition-[transform,width] duration-300 ease-in-out",
           "flex flex-col",
           "overflow-hidden",
           "shrink-0",
-          isMobile ? "w-full" : "w-64",
-          isMobile && !open && "-translate-x-full",
+          collapsed ? "border-r-0" : "border-r",
+          collapsed ? "w-0" : isMobile ? "w-full" : "w-64",
           isMobile && open && "translate-x-0",
-          !isMobile && !open && "-translate-x-full lg:translate-x-0",
-          !isMobile && "lg:translate-x-0"
+          isMobile && !open && "-translate-x-full",
+          !isMobile && !collapsed && "-translate-x-full lg:translate-x-0",
+          !isMobile && collapsed && "-translate-x-full"
         ),
         children: /* @__PURE__ */ jsxs("div", { className: "relative flex-1 overflow-hidden", children: [
           showTopFade ? /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 right-0 h-8 bg-gradient-to-b from-background to-transparent pointer-events-none z-20" }) : null,
@@ -139,7 +143,7 @@ function Sidebar({ sections }) {
           /* @__PURE__ */ jsx(
             "nav",
             {
-              className: "flex-1 p-4 overflow-y-auto h-full",
+              className: "flex-1 p-4 overflow-y-auto overscroll-contain h-full [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
               ref: scrollContainerReference,
               children: /* @__PURE__ */ jsx("div", { className: "space-y-4", children: sections.map((section, sectionIndex) => {
                 const sectionItems = /* @__PURE__ */ jsx("div", { className: section.title ? "space-y-0.5" : "space-y-1", children: section.items.map((item) => /* @__PURE__ */ jsx(

package/dist/components/sidebar-toggle/sidebar-toggle.js

@@ -2,7 +2,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Menu, X } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 function SidebarToggle({
   className,
   onToggle,

package/dist/components/slideshow/slideshow.js

@@ -4,7 +4,7 @@ import { memo, useCallback, useEffect, useState } from "react";
 import { createPortal } from "react-dom";
 import { useMounted } from "../../lib/use-mounted";
 import { cn } from "../../lib/utils";
-import { CompletionDialog } from "../completion-dialog";
+import { CompletionDialog } from "../completion-dialog/completion-dialog";
 const DEFAULT_LABELS = {
   closeLabel: "Close",
   closeTocLabel: "Close table of contents",

package/dist/components/stat-card/stat-card.js

@@ -3,7 +3,7 @@ import * as React from "react";
 import { cva } from "class-variance-authority";
 import { ArrowDownRight, ArrowRight, ArrowUpRight } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Card, CardContent, CardDescription, CardHeader } from "../card";
+import { Card, CardContent, CardDescription, CardHeader } from "../card/card";
 const statCardVariants = cva("overflow-hidden border shadow-sm", {
   defaultVariants: {
     tone: "neutral"

package/dist/components/status-board/status-board.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import {
   Card,
   CardContent,

package/dist/components/terminal/terminal.js

@@ -2,7 +2,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Check, Copy, Terminal as TerminalIcon } from "lucide-react";
-import { Button } from "../button";
+import { Button } from "../button/button";
 function getCommandContents(lines) {
   return lines.reduce((commands, line) => {
     if (line.type === "command") {

package/dist/components/ticker-tape/ticker-tape.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { ArrowDownRight, ArrowUpRight, Dot } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 const tickerTapeKeyframes = `
 @keyframes ticker-tape-scroll {
   from {

package/dist/components/tour/tour.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import { Button } from "../button";
 import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "../card";
 function TourHeader({

package/dist/components/tutorial-card/tutorial-card.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { memo, useEffect, useState } from "react";
 import { useMounted } from "../../lib/use-mounted";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import {
   Card,
   CardContent,

package/dist/components/tutorial-complete/tutorial-complete.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { memo } from "react";
 import { Check, ChevronRight, RotateCcw } from "lucide-react";
-import { Button } from "../button";
+import { Button } from "../button/button";
 import { ProfileSection } from "../profile-section";
 import { ShareSection } from "../share-section";
 function DefaultLink({

package/dist/components/tutorial-filters/tutorial-filters.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { memo } from "react";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 function SearchInput({
   isPending,
   labels,

package/dist/components/tutorial-mdx/tutorial-mdx.js

@@ -10,7 +10,7 @@ import {
   AccordionContent,
   AccordionItem,
   AccordionTrigger
-} from "../accordion";
+} from "../accordion/accordion";
 import { Callout } from "../callout";
 import { Checklist } from "../checklist";
 import { CodePlayground, FileTree } from "../code-playground";

package/dist/components/usage-breakdown/usage-breakdown.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, useMemo } from "react";
 import { ArrowDownRight, ArrowUpRight } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 import {
   Card,
   CardContent,

package/dist/components/world-clock-bar/world-clock-bar.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../../lib/utils";
-import { Badge } from "../badge";
+import { Badge } from "../badge/badge";
 function normalizeDate(input) {
   if (input instanceof Date) {
     return new Date(input.getTime());

package/dist/components/zoom-hud/zoom-hud.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { Minus, Plus, RotateCcw } from "lucide-react";
 import { cn } from "../../lib/utils";
-import { Button } from "../button";
+import { Button } from "../button/button";
 const ZoomHUD = forwardRef(
   ({ className, onReset, onZoomIn, onZoomOut, zoom, ...props }, ref) => /* @__PURE__ */ jsxs(
     "div",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vllnt/ui",
-  "version": "0.2.1-canary.be68966",
+  "version": "0.2.1-canary.bf41f62",
   "description": "React component library — 225 components built on Radix UI, Tailwind CSS, and CVA",
   "license": "MIT",
   "author": "vllnt",