@vllnt/ui 0.1.3 → 0.1.6

package/dist/components/dropdown-menu/dropdown-menu.js

@@ -0,0 +1,151 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
+import { cn } from "../../lib/utils";
+const DropdownMenu = DropdownMenuPrimitive.Root;
+const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+const DropdownMenuGroup = DropdownMenuPrimitive.Group;
+const DropdownMenuPortal = DropdownMenuPrimitive.Portal;
+const DropdownMenuSub = DropdownMenuPrimitive.Sub;
+const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
+const DropdownMenuSubTrigger = React.forwardRef(({ children, className, inset, ...props }, reference) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.SubTrigger,
+  {
+    className: cn(
+      "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
+      inset && "pl-8",
+      className
+    ),
+    ref: reference,
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx("span", { className: "ml-auto text-xs", children: "\u203A" })
+    ]
+  }
+));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
+const DropdownMenuSubContent = React.forwardRef(({ className, ...props }, reference) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.SubContent,
+  {
+    className: cn(
+      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-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",
+      className
+    ),
+    ref: reference,
+    ...props
+  }
+));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
+const DropdownMenuContent = React.forwardRef(({ className, sideOffset = 4, ...props }, reference) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Content,
+  {
+    className: cn(
+      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-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",
+      className
+    ),
+    ref: reference,
+    sideOffset,
+    ...props
+  }
+) }));
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+const DropdownMenuItem = React.forwardRef(({ className, inset, ...props }, reference) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Item,
+  {
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      inset && "pl-8",
+      className
+    ),
+    ref: reference,
+    ...props
+  }
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+const DropdownMenuCheckboxItem = React.forwardRef(({ checked, children, className, ...props }, reference) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.CheckboxItem,
+  {
+    checked,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    ref: reference,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx("span", { className: "text-xs", children: "\u2713" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
+const DropdownMenuRadioItem = React.forwardRef(({ children, className, ...props }, reference) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.RadioItem,
+  {
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    ref: reference,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx("span", { className: "text-xs", children: "\u25CB" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
+const DropdownMenuLabel = React.forwardRef(({ className, inset, ...props }, reference) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Label,
+  {
+    className: cn(
+      "px-2 py-1.5 text-sm font-semibold",
+      inset && "pl-8",
+      className
+    ),
+    ref: reference,
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+const DropdownMenuSeparator = React.forwardRef(({ className, ...props }, reference) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Separator,
+  {
+    className: cn("-mx-1 my-1 h-px bg-muted", className),
+    ref: reference,
+    ...props
+  }
+));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+const DropdownMenuShortcut = ({
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn("ml-auto text-xs tracking-widest opacity-60", className),
+      ...props
+    }
+  );
+};
+DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
+export {
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuSeparator,
+  DropdownMenuShortcut,
+  DropdownMenuSub,
+  DropdownMenuSubContent,
+  DropdownMenuSubTrigger,
+  DropdownMenuTrigger
+};

package/dist/components/dropdown-menu/index.js

@@ -0,0 +1,34 @@
+import {
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuSeparator,
+  DropdownMenuShortcut,
+  DropdownMenuSub,
+  DropdownMenuSubContent,
+  DropdownMenuSubTrigger,
+  DropdownMenuTrigger
+} from "./dropdown-menu";
+export {
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuSeparator,
+  DropdownMenuShortcut,
+  DropdownMenuSub,
+  DropdownMenuSubContent,
+  DropdownMenuSubTrigger,
+  DropdownMenuTrigger
+};

package/dist/components/exercise/exercise.js

@@ -0,0 +1,112 @@
+"use client";
+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";
+const difficultyConfig = {
+  easy: { className: "text-green-600 dark:text-green-400", label: "Easy" },
+  hard: { className: "text-red-600 dark:text-red-400", label: "Hard" },
+  medium: { className: "text-amber-600 dark:text-amber-400", label: "Medium" }
+};
+function ExerciseHeader({ completed, config, onToggle, title }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4 mb-4", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-primary/10", children: /* @__PURE__ */ jsx(Dumbbell, { className: "h-5 w-5 text-primary" }) }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h4", { className: "font-semibold text-foreground", children: title }),
+        /* @__PURE__ */ jsx("span", { className: cn("text-xs font-medium", config.className), children: config.label })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        className: cn(completed && "bg-green-500 hover:bg-green-600"),
+        onClick: onToggle,
+        size: "sm",
+        variant: completed ? "default" : "outline",
+        children: completed ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 mr-1" }),
+          "Done"
+        ] }) : "Mark Complete"
+      }
+    )
+  ] });
+}
+function ExerciseHint({ hint, onShow, showHint }) {
+  return /* @__PURE__ */ jsx("div", { className: "mb-4", children: showHint ? /* @__PURE__ */ jsxs("div", { className: "p-3 rounded bg-muted/50 text-sm", children: [
+    /* @__PURE__ */ jsx("p", { className: "font-medium text-xs uppercase tracking-wider text-muted-foreground mb-1", children: "Hint" }),
+    /* @__PURE__ */ jsx("p", { className: "text-muted-foreground italic", children: hint })
+  ] }) : /* @__PURE__ */ jsx(
+    "button",
+    {
+      className: "text-sm text-primary hover:underline",
+      onClick: onShow,
+      type: "button",
+      children: "Need a hint?"
+    }
+  ) });
+}
+function ExerciseSolution({ onToggle, showSolution, solution }) {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(Button, { className: "mb-3", onClick: onToggle, size: "sm", variant: "outline", children: showSolution ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(EyeOff, { className: "h-4 w-4 mr-1" }),
+      "Hide Solution"
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Eye, { className: "h-4 w-4 mr-1" }),
+      "Show Solution"
+    ] }) }),
+    showSolution ? /* @__PURE__ */ jsxs("div", { className: "p-4 rounded-lg bg-card border text-sm [&>pre]:my-0", children: [
+      /* @__PURE__ */ jsx("p", { className: "font-medium text-xs uppercase tracking-wider text-muted-foreground mb-2", children: "Solution" }),
+      solution
+    ] }) : null
+  ] });
+}
+function Exercise({
+  children,
+  difficulty = "medium",
+  hint,
+  solution,
+  title
+}) {
+  const [showSolution, setShowSolution] = useState(false);
+  const [showHint, setShowHint] = useState(false);
+  const [completed, setCompleted] = useState(false);
+  return /* @__PURE__ */ jsxs("div", { className: "my-6 rounded-lg border-2 border-dashed border-primary/30 bg-primary/5 p-6", children: [
+    /* @__PURE__ */ jsx(
+      ExerciseHeader,
+      {
+        completed,
+        config: difficultyConfig[difficulty],
+        onToggle: () => {
+          setCompleted(!completed);
+        },
+        title
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground mb-4 [&>p]:mb-2 [&>ul]:mb-2", children }),
+    hint ? /* @__PURE__ */ jsx(
+      ExerciseHint,
+      {
+        hint,
+        onShow: () => {
+          setShowHint(true);
+        },
+        showHint
+      }
+    ) : null,
+    solution ? /* @__PURE__ */ jsx(
+      ExerciseSolution,
+      {
+        onToggle: () => {
+          setShowSolution(!showSolution);
+        },
+        showSolution,
+        solution
+      }
+    ) : null
+  ] });
+}
+export {
+  Exercise
+};

package/dist/components/exercise/index.js

@@ -0,0 +1,4 @@
+import { Exercise } from "./exercise";
+export {
+  Exercise
+};

package/dist/components/faq/faq.js

@@ -0,0 +1,56 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { ChevronDown, HelpCircle } from "lucide-react";
+import { cn } from "../../lib/utils";
+function FAQItem({ children, defaultOpen = false, question }) {
+  const [isOpen, setIsOpen] = useState(defaultOpen);
+  return /* @__PURE__ */ jsxs("div", { className: "border-b border-border last:border-b-0", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        className: "w-full flex items-center justify-between py-4 text-left hover:text-primary transition-colors",
+        onClick: () => {
+          setIsOpen(!isOpen);
+        },
+        type: "button",
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "font-medium text-sm pr-4", children: question }),
+          /* @__PURE__ */ jsx(
+            ChevronDown,
+            {
+              className: cn(
+                "h-4 w-4 flex-shrink-0 transition-transform duration-200",
+                isOpen && "rotate-180"
+              )
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "overflow-hidden transition-all duration-200",
+          isOpen ? "max-h-96 pb-4" : "max-h-0"
+        ),
+        children: /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground [&>p]:mb-2 [&>p:last-child]:mb-0", children })
+      }
+    )
+  ] });
+}
+function FAQ({ children, title = "Frequently Asked Questions" }) {
+  return /* @__PURE__ */ jsxs("div", { className: "my-6 rounded-lg border bg-card", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 p-4 border-b border-border", children: [
+      /* @__PURE__ */ jsx(HelpCircle, { className: "h-5 w-5 text-primary" }),
+      /* @__PURE__ */ jsx("h4", { className: "font-semibold", children: title })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "px-4", children })
+  ] });
+}
+FAQ.Item = FAQItem;
+export {
+  FAQ,
+  FAQItem
+};

package/dist/components/faq/index.js

@@ -0,0 +1,5 @@
+import { FAQ, FAQItem } from "./faq";
+export {
+  FAQ,
+  FAQItem
+};

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

@@ -0,0 +1,244 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { memo, useCallback, useState } from "react";
+import { cn } from "../../lib/utils";
+import { Badge } from "../badge";
+function SearchInput({
+  disabled,
+  label,
+  onChange,
+  placeholder,
+  value
+}) {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx("label", { className: "sr-only", htmlFor: "filter-search", children: label }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        className: cn(
+          "w-full px-4 py-2 border border-border rounded-lg",
+          "bg-background text-foreground placeholder:text-muted-foreground",
+          "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+        ),
+        defaultValue: value,
+        disabled,
+        id: "filter-search",
+        onChange: (event) => {
+          onChange(event.target.value);
+        },
+        placeholder,
+        type: "text"
+      }
+    )
+  ] });
+}
+function DifficultyFilter({
+  activeDifficulty,
+  disabled,
+  label,
+  onChange,
+  options
+}) {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 mb-2", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: label }) }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: options.map((option) => {
+      const isActive = option.value === activeDifficulty;
+      return /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: cn(
+            "px-3 py-1 text-sm rounded-lg border transition-colors",
+            isActive ? "bg-primary text-primary-foreground border-transparent" : "bg-background text-foreground border-border hover:bg-muted"
+          ),
+          disabled,
+          onClick: () => {
+            onChange(option.value);
+          },
+          type: "button",
+          children: option.label
+        },
+        option.value
+      );
+    }) })
+  ] });
+}
+function TagFilter({
+  clearLabel,
+  currentTags,
+  label,
+  onClearTags,
+  onTagToggle,
+  tags
+}) {
+  if (tags.length === 0) return null;
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-2", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: label }),
+      currentTags.length > 0 ? /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: "text-xs text-muted-foreground hover:text-foreground transition-colors",
+          onClick: onClearTags,
+          type: "button",
+          children: clearLabel
+        }
+      ) : null
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: tags.map((tag) => {
+      const isActive = currentTags.includes(tag);
+      return /* @__PURE__ */ jsx(
+        Badge,
+        {
+          className: cn(
+            "cursor-pointer transition-all",
+            isActive ? "bg-primary text-primary-foreground border-transparent" : "hover:bg-muted"
+          ),
+          onClick: () => {
+            onTagToggle(tag);
+          },
+          variant: isActive ? "default" : "outline",
+          children: tag
+        },
+        tag
+      );
+    }) })
+  ] });
+}
+function ActiveFiltersSummary({
+  clearAllLabel,
+  currentDifficulty,
+  currentTags,
+  difficultyOptions,
+  label,
+  onClearAll,
+  searchLabel,
+  searchQuery
+}) {
+  if (!currentDifficulty && currentTags.length === 0 && !searchQuery)
+    return null;
+  const difficultyLabel = difficultyOptions.find(
+    (o) => o.value === currentDifficulty
+  )?.label;
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
+    /* @__PURE__ */ jsx("span", { children: label }),
+    difficultyLabel ? /* @__PURE__ */ jsx(Badge, { className: "capitalize", variant: "secondary", children: difficultyLabel }) : null,
+    currentTags.map((tag) => /* @__PURE__ */ jsx(Badge, { variant: "secondary", children: tag }, tag)),
+    searchQuery ? /* @__PURE__ */ jsxs(Badge, { variant: "secondary", children: [
+      searchLabel,
+      ' "',
+      searchQuery,
+      '"'
+    ] }) : null,
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        className: "text-xs hover:underline",
+        onClick: onClearAll,
+        type: "button",
+        children: clearAllLabel
+      }
+    )
+  ] });
+}
+const DEFAULT_LABELS = {
+  activeFilters: "Active filters:",
+  clearAll: "Clear all",
+  clearTags: "Clear",
+  difficultyLabel: "Difficulty:",
+  searchLabel: "Search",
+  searchPlaceholder: "Search...",
+  tagsLabel: "Tags:"
+};
+function FilterBarImpl({
+  className,
+  currentDifficulty,
+  currentTags,
+  difficultyOptions,
+  labels = {},
+  onFiltersChange,
+  searchQuery,
+  tags
+}) {
+  const [isPending, setIsPending] = useState(false);
+  const mergedLabels = { ...DEFAULT_LABELS, ...labels };
+  const handleDifficultyChange = useCallback(
+    (difficulty) => {
+      setIsPending(true);
+      onFiltersChange({ difficulty });
+      setIsPending(false);
+    },
+    [onFiltersChange]
+  );
+  const handleSearchChange = useCallback(
+    (search) => {
+      onFiltersChange({ search });
+    },
+    [onFiltersChange]
+  );
+  const handleTagToggle = useCallback(
+    (tag) => {
+      const newTags = currentTags.includes(tag) ? currentTags.filter((t) => t !== tag) : [...currentTags, tag];
+      onFiltersChange({ tags: newTags });
+    },
+    [currentTags, onFiltersChange]
+  );
+  const handleClearAll = useCallback(() => {
+    onFiltersChange({ difficulty: "all", search: "", tags: [] });
+    const input = document.querySelector("#filter-search");
+    if (input) input.value = "";
+  }, [onFiltersChange]);
+  const activeDifficulty = currentDifficulty || "all";
+  return /* @__PURE__ */ jsxs("div", { className: cn("space-y-4 mb-8", className), children: [
+    /* @__PURE__ */ jsx(
+      SearchInput,
+      {
+        disabled: isPending,
+        label: mergedLabels.searchLabel,
+        onChange: handleSearchChange,
+        placeholder: mergedLabels.searchPlaceholder,
+        value: searchQuery
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      DifficultyFilter,
+      {
+        activeDifficulty,
+        disabled: isPending,
+        label: mergedLabels.difficultyLabel,
+        onChange: handleDifficultyChange,
+        options: difficultyOptions
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      TagFilter,
+      {
+        clearLabel: mergedLabels.clearTags,
+        currentTags,
+        label: mergedLabels.tagsLabel,
+        onClearTags: () => {
+          onFiltersChange({ tags: [] });
+        },
+        onTagToggle: handleTagToggle,
+        tags
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ActiveFiltersSummary,
+      {
+        clearAllLabel: mergedLabels.clearAll,
+        currentDifficulty,
+        currentTags,
+        difficultyOptions,
+        label: mergedLabels.activeFilters,
+        onClearAll: handleClearAll,
+        searchLabel: mergedLabels.searchLabel,
+        searchQuery
+      }
+    )
+  ] });
+}
+const FilterBar = memo(FilterBarImpl);
+FilterBar.displayName = "FilterBar";
+export {
+  FilterBar
+};

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

@@ -0,0 +1,6 @@
+import {
+  FilterBar
+} from "./filter-bar";
+export {
+  FilterBar
+};

package/dist/components/floating-action-button/floating-action-button.js

@@ -0,0 +1,35 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { memo } from "react";
+import { cn } from "../../lib/utils";
+function FloatingActionButtonImpl({
+  "aria-label": ariaLabel,
+  children,
+  className,
+  onClick,
+  position = "bottom-right"
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      "aria-label": ariaLabel,
+      className: cn(
+        "fixed z-40 flex h-12 w-12 items-center justify-center rounded-full",
+        "bg-primary text-primary-foreground shadow-lg",
+        "transition-transform hover:scale-110",
+        "focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2",
+        position === "bottom-right" && "bottom-20 right-4 sm:bottom-4",
+        position === "bottom-left" && "bottom-20 left-4 sm:bottom-4",
+        className
+      ),
+      onClick,
+      type: "button",
+      children
+    }
+  );
+}
+const FloatingActionButton = memo(FloatingActionButtonImpl);
+FloatingActionButton.displayName = "FloatingActionButton";
+export {
+  FloatingActionButton
+};

package/dist/components/floating-action-button/index.js

@@ -0,0 +1,6 @@
+import {
+  FloatingActionButton
+} from "./floating-action-button";
+export {
+  FloatingActionButton
+};