florixui 1.0.0 → 1.1.0

package/README.md

@@ -349,6 +349,32 @@ A bordered surface that groups related content and actions into a single contain
 </Card>
 ```
 
+### Card Radio Group
+
+A radio group whose options are bordered cards — each with an optional icon, a label (plus inline sublabel), and a description. The whole card is clickable and the selected card highlights its border.
+
+```tsx
+<CardRadioGroup
+  defaultValue="mastercard"
+  items={[
+    {
+      value: 'mastercard',
+      label: 'Mastercard',
+      sublabel: '(•••• 4242)',
+      description: 'You can use this card with a label and a description.',
+      icon: <MastercardIcon />,
+    },
+    {
+      value: 'visa',
+      label: 'Visa',
+      sublabel: '(•••• 1881)',
+      description: 'You can use this card with a label and a description.',
+      icon: <VisaIcon />,
+    },
+  ]}
+/>
+```
+
 ### Chart
 
 A theming and tooltip/legend wrapper around Recharts that maps a config object to CSS color variables for consistent, accessible charts.
@@ -412,6 +438,21 @@ A fast, composable command menu with fuzzy search for navigating actions, built
 </Command>
 ```
 
+### Custom Tabs
+
+A higher-level tab strip with two looks — underline and pill — driven by a single items array. Each tab can carry an icon, a numeric count, and a short badge like "New". Built on Radix Tabs for keyboard and a11y support.
+
+```tsx
+const navItems = [
+  { value: 'overview', label: 'Overview', icon: <HomeIcon /> },
+  { value: 'projects', label: 'Projects', icon: <LayoutPanelTopIcon />, count: 3 },
+  { value: 'packages', label: 'Packages', icon: <PackageIcon />, badge: 'New' },
+  { value: 'team', label: 'Team', icon: <UsersIcon /> },
+]
+
+<CustomTabs type="underline" defaultValue="overview" items={navItems} />
+```
+
 ### Data Table
 
 A simple, column-driven table with the shadcn data-table look: badge cells, row selection, a row-actions menu, and empty/loading states — no sorting/pagination machinery.
@@ -513,6 +554,30 @@ Displays a menu of actions or options triggered by a button, built on Radix UI w
 </DropdownMenu>
 ```
 
+### Faceted Filter
+
+A controlled filter trigger and popover: a searchable list of options selectable as multi-select checkboxes (default) or single-select. Shows the selection as pills and emits the value(s) via onChange so you can filter your own list or API query.
+
+```tsx
+const [status, setStatus] = useState<string[]>(['backlog', 'todo'])
+
+<FacetedFilter
+  title="Status"
+  options={[
+    { value: 'backlog', label: 'Backlog', icon: <CircleDashedIcon />, count: 13 },
+    { value: 'todo', label: 'Todo', icon: <CircleIcon />, count: 12 },
+    // ...
+  ]}
+  value={status}
+  onChange={setStatus}
+/>
+
+// then filter your data:
+const filtered = status.length === 0
+  ? tasks
+  : tasks.filter((t) => status.includes(t.status))
+```
+
 ### Field
 
 Layout primitives that pair a form control with its label, description, and error message in a consistent, accessible structure.
@@ -527,6 +592,56 @@ Layout primitives that pair a form control with its label, description, and erro
 </Field>
 ```
 
+### File Upload
+
+A batteries-included drag-and-drop uploader with validation, previews, and two layouts: a single-image dropzone and a multi-file card grid. Backed by the headless useFileUpload hook.
+
+```tsx
+<FileUpload
+  variant="image"
+  accept="image/*"
+  maxSize={5 * 1024 * 1024}
+/>
+```
+
+### Form Dialog
+
+A pre-composed modal for forms: a fixed bordered header (title, description, close button), a scrollable body, and an optional pinned footer for actions. Controlled via open/onClose.
+
+```tsx
+function Example() {
+  const [open, setOpen] = useState(false)
+  return (
+    <>
+      <Button onClick={() => setOpen(true)}>Edit profile</Button>
+      <FormDialog
+        open={open}
+        onClose={() => setOpen(false)}
+        title="Edit profile"
+        description="Update your details. Changes are saved when you submit."
+        footer={
+          <>
+            <Button variant="outline" onClick={() => setOpen(false)}>Cancel</Button>
+            <Button onClick={() => setOpen(false)}>Save changes</Button>
+          </>
+        }
+      >
+        <form className="grid gap-4">
+          <div className="grid gap-2">
+            <Label htmlFor="name">Name</Label>
+            <Input id="name" defaultValue="Ada Lovelace" />
+          </div>
+          <div className="grid gap-2">
+            <Label htmlFor="bio">Bio</Label>
+            <Textarea id="bio" rows={4} />
+          </div>
+        </form>
+      </FormDialog>
+    </>
+  )
+}
+```
+
 ### Hover Card
 
 Shows rich preview content in a floating card when the user hovers over or focuses a trigger.
@@ -676,6 +791,22 @@ Displays a list of options for the user to pick from, triggered by a button.
 </Select>
 ```
 
+### Sensor Card
+
+A compact info/action card with a left side (icon, mode label, description) and a right side (accent bar + value). Tint it with colorVariant, wrap it with variant, and wire onClick / onValueClick for actions.
+
+```tsx
+<SensorCard
+  variant="standalone"
+  icon={<BlindsIcon className="size-5 text-primary" />}
+  mode="Shades & Curtains"
+  description="shade 01"
+  value="Active"
+  showAccent
+  valueColorVariant="primary"
+/>
+```
+
 ### Separator
 
 Visually or semantically divides content, either horizontally or vertically.
@@ -721,6 +852,44 @@ A panel that slides in from an edge of the screen to show supplementary content
 </Sheet>
 ```
 
+### Side Sheet
+
+A slide-in panel with a pinned header and a sticky footer — the header and footer stay fixed while the body scrolls between them. Ideal for long configuration forms. Controlled via open/onClose.
+
+```tsx
+function Example() {
+  const [open, setOpen] = useState(false)
+  return (
+    <>
+      <Button onClick={() => setOpen(true)}>Open configuration</Button>
+      <SideSheet
+        open={open}
+        onClose={() => setOpen(false)}
+        onBack={() => setOpen(false)}
+        floating
+        title="PID Equation Program Configuration"
+        footer={
+          <>
+            <Button onClick={() => setOpen(false)}>Save</Button>
+            <Button variant="outline" onClick={() => setOpen(false)}>Cancel</Button>
+          </>
+        }
+      >
+        <AdvancedInput label="Program name" placeholder="Enter program name" required />
+        <AdvancedSelect label="PID Equation Type" required options={EQUATION_TYPES} />
+
+        <SideSheetSection label="Reading VS Target Settings">
+          <div className="grid grid-cols-2 gap-4">
+            <AdvancedSelect label="Reading Source" options={SOURCES} />
+            <AdvancedSelect label="Target Source" options={SOURCES} />
+          </div>
+        </SideSheetSection>
+      </SideSheet>
+    </>
+  )
+}
+```
+
 ### Slider
 
 Lets users select a value or range from a continuous track by dragging one or more thumbs.
@@ -757,6 +926,20 @@ An animated loading indicator that communicates that content or an action is in
 <Spinner />
 ```
 
+### Stat Card
+
+A dashboard metric card with a title, a bold value, and an optional accessory — a tinted icon, a colored trend delta, a linear progress bar, a sparkline area chart, or a radial ring.
+
+```tsx
+<StatCard
+  title="Total Revenue"
+  value="$45,231"
+  description="+20.1% from last month"
+  icon={<DollarSignIcon />}
+  color="danger"
+/>
+```
+
 ### Stepper
 
 A composable stepper (from Origin UI) for multi-step flows — horizontal or vertical, with numbered indicators, titles, descriptions, and an active/completed state.

package/dist/components/custom/card-radio-group.d.ts

@@ -0,0 +1,32 @@
+import { RadioGroup } from '../ui/radio-group';
+import * as React from "react";
+export interface CardRadioItem {
+    /** Unique value submitted when this card is selected. */
+    value: string;
+    /** Primary label. */
+    label: React.ReactNode;
+    /** Muted text shown inline after the label, e.g. "(Sublabel)". */
+    sublabel?: React.ReactNode;
+    /** Supporting text shown beneath the label. */
+    description?: React.ReactNode;
+    /** Optional leading media — an icon, logo, or small illustration. */
+    icon?: React.ReactNode;
+    /** Disables this individual card. */
+    disabled?: boolean;
+}
+export interface CardRadioGroupProps extends Omit<React.ComponentProps<typeof RadioGroup>, "children"> {
+    /** The cards to render. */
+    items: CardRadioItem[];
+    /** Place the radio dot on the leading edge instead of the trailing edge. */
+    indicatorPosition?: "start" | "end";
+    /** Class for each card. */
+    cardClassName?: string;
+}
+/**
+ * A radio group whose options are bordered cards, each with an optional icon,
+ * a label (+ inline sublabel), and a description. The selected card highlights
+ * its border. The whole card is clickable. Control selection with
+ * `value`/`onValueChange` or `defaultValue`, like the base RadioGroup.
+ */
+declare function CardRadioGroup({ items, indicatorPosition, className, cardClassName, ...props }: CardRadioGroupProps): import("react/jsx-runtime").JSX.Element;
+export { CardRadioGroup };

package/dist/components/custom/custom-tabs.d.ts

@@ -0,0 +1,34 @@
+import { Tabs as TabsPrimitive } from 'radix-ui';
+import * as React from "react";
+export type CustomTabsType = "underline" | "pill";
+export interface CustomTabItem {
+    /** Unique value for the tab; also used as the trigger's `value`. */
+    value: string;
+    /** Visible label. */
+    label: React.ReactNode;
+    /** Optional leading icon. */
+    icon?: React.ReactNode;
+    /** Optional numeric count rendered as a muted pill after the label. */
+    count?: number;
+    /** Optional short badge rendered after the label, e.g. "New". */
+    badge?: React.ReactNode;
+    /** Disables this individual tab. */
+    disabled?: boolean;
+}
+export interface CustomTabsProps extends Omit<React.ComponentProps<typeof TabsPrimitive.Root>, "orientation" | "children"> {
+    /** Visual style of the tab strip. Defaults to `underline`. */
+    type?: CustomTabsType;
+    /** The tabs to render. */
+    items: CustomTabItem[];
+    /** Class for the tab list (the strip itself). */
+    listClassName?: string;
+}
+/**
+ * A higher-level tab strip with two looks — `underline` and `pill` — driven by
+ * a single `items` array. Each item can carry an icon, a numeric `count`, and a
+ * short `badge` (e.g. "New"). Built on Radix Tabs, so it stays keyboard- and
+ * a11y-friendly; control selection with `value`/`onValueChange` or
+ * `defaultValue` just like the primitive.
+ */
+declare function CustomTabs({ type, items, className, listClassName, ...props }: CustomTabsProps): import("react/jsx-runtime").JSX.Element;
+export { CustomTabs };

package/dist/components/custom/data-table.d.ts

@@ -26,6 +26,12 @@ export interface DataTableProps<TRow> {
     rowActions?: (row: TRow) => ActionsMenuItem[];
     loading?: boolean;
     emptyMessage?: React.ReactNode;
+    /** Enable client-side pagination with a footer of page controls. */
+    pagination?: boolean;
+    /** Rows per page. Default `25`. */
+    pageSize?: number;
+    /** Page-size options in the footer selector. Default `[25, 50, 100, 200]`. */
+    pageSizeOptions?: number[];
     /** Alternating row backgrounds for easier scanning. */
     striped?: boolean;
     /** Keep the header visible while the body scrolls (pair with maxHeight). */
@@ -35,4 +41,4 @@ export interface DataTableProps<TRow> {
     onRowClick?: (row: TRow) => void;
     className?: string;
 }
-export declare function DataTable<TRow>({ columns, data, getRowId, selectable, selectedIds, onSelectionChange, rowActions, loading, emptyMessage, striped, stickyHeader, maxHeight, onRowClick, className, }: DataTableProps<TRow>): import("react/jsx-runtime").JSX.Element;
+export declare function DataTable<TRow>({ columns, data, getRowId, selectable, selectedIds, onSelectionChange, rowActions, loading, emptyMessage, pagination, pageSize: pageSizeProp, pageSizeOptions, striped, stickyHeader, maxHeight, onRowClick, className, }: DataTableProps<TRow>): import("react/jsx-runtime").JSX.Element;

package/dist/components/custom/faceted-filter.d.ts

@@ -0,0 +1,44 @@
+import * as React from "react";
+export interface FacetedFilterOption {
+    /** Value stored in the selection. */
+    value: string;
+    /** Visible label. */
+    label: string;
+    /** Optional leading icon. */
+    icon?: React.ReactNode;
+    /** Optional count shown on the right (e.g. matching rows). */
+    count?: number;
+}
+interface BaseProps {
+    /** Trigger label, e.g. "Status". */
+    title: string;
+    options: FacetedFilterOption[];
+    /** Placeholder for the search box. Defaults to `title`. */
+    searchPlaceholder?: string;
+    /** Hide the search box (for short lists). */
+    searchable?: boolean;
+    /** Max selected pills to show on the trigger before collapsing to a count. */
+    maxDisplayed?: number;
+    className?: string;
+}
+interface MultiProps extends BaseProps {
+    mode?: "multiple";
+    /** Selected values. */
+    value: string[];
+    onChange: (value: string[]) => void;
+}
+interface SingleProps extends BaseProps {
+    mode: "single";
+    /** Selected value (or null). */
+    value: string | null;
+    onChange: (value: string | null) => void;
+}
+export type FacetedFilterProps = MultiProps | SingleProps;
+/**
+ * A controlled filter trigger + popover: a searchable list of options, each
+ * selectable (multi-select checkboxes by default, or single-select with
+ * `mode="single"`). Shows the selection as pills on the trigger and emits the
+ * value(s) via `onChange` — use it to filter your own list or API query.
+ */
+export declare function FacetedFilter(props: FacetedFilterProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/custom/file-upload.d.ts

@@ -0,0 +1,26 @@
+import { FileMetadata, FileWithPreview } from '../../lib/use-file-upload';
+export type FileUploadProps = {
+    /**
+     * `image` renders a single-image dropzone with an inline preview overlay.
+     * `files` renders a multi-file grid with per-file cards. Defaults to `image`.
+     */
+    variant?: "image" | "files";
+    /** `accept` attribute, e.g. `"image/*"` or `".pdf,.png"`. */
+    accept?: string;
+    /** Maximum size per file, in bytes. */
+    maxSize?: number;
+    /** Maximum number of files (`files` variant). */
+    maxFiles?: number;
+    /** Allow more than one file. Forced on for the `files` variant. */
+    multiple?: boolean;
+    /** Files to seed the uploader with (already-uploaded items). */
+    initialFiles?: FileMetadata[];
+    /** Disables the dropzone and hides the file input. */
+    disabled?: boolean;
+    /** Called whenever the file list changes. */
+    onFilesChange?: (files: FileWithPreview[]) => void;
+    /** Class for the outer wrapper element. */
+    className?: string;
+};
+declare function FileUpload({ variant, accept, maxSize, maxFiles, multiple, initialFiles, disabled, onFilesChange, className, }: FileUploadProps): import("react/jsx-runtime").JSX.Element;
+export { FileUpload };

package/dist/components/custom/form-dialog.d.ts

@@ -0,0 +1,30 @@
+import * as React from "react";
+export interface FormDialogProps {
+    /** Body content — typically a form. Scrolls when it overflows. */
+    children: React.ReactNode;
+    /** Heading shown in the (bordered) header. Omit to hide the header. */
+    title?: React.ReactNode;
+    /** Whether the dialog is open. Controlled. */
+    open: boolean;
+    /** Called when the dialog requests to close (X, overlay, or Esc). */
+    onClose: () => void;
+    /** Optional supporting text under the title. */
+    description?: React.ReactNode;
+    /**
+     * When set, the dialog can't be dismissed by clicking the overlay or pressing
+     * Escape — only the explicit close button / footer actions close it.
+     */
+    notDismissable?: boolean;
+    /** Footer content, pinned below the scrollable body with a top border. */
+    footer?: React.ReactNode;
+    /** Class for the dialog content surface. */
+    className?: string;
+}
+/**
+ * A pre-composed modal for forms: a fixed bordered header (title, description,
+ * and a close button), a scrollable body, and an optional pinned footer for
+ * actions. Controlled via `open`/`onClose`. Set `notDismissable` to require an
+ * explicit action to close.
+ */
+declare function FormDialog({ children, title, open, onClose, description, notDismissable, footer, className, }: FormDialogProps): import("react/jsx-runtime").JSX.Element;
+export { FormDialog };

package/dist/components/custom/sensor-card.d.ts

@@ -0,0 +1,45 @@
+import * as React from "react";
+/** Color variant for the accent bar, mode label, icon, and value text. */
+export type SensorCardColorVariant = "primary" | "warning" | "danger" | "muted";
+export interface SensorCardProps {
+    /** Leading icon. Falls back to a default based on `mode` ("auto" vs other). */
+    icon?: React.ReactNode;
+    /** Mode label, e.g. "Manual", "Auto". */
+    mode?: string;
+    /** Main description / name. */
+    description?: string;
+    /** Value shown on the right, e.g. "80", "Active", "OFF". */
+    value: string;
+    /** Show the colored accent bar before the value (active states). */
+    showAccent?: boolean;
+    /** Color of the accent bar, mode label, and default icon. */
+    colorVariant?: SensorCardColorVariant;
+    /** Override the accent-bar color only (falls back to `colorVariant`). */
+    accentColorVariant?: SensorCardColorVariant;
+    /** Color the value text (defaults to the foreground color). */
+    valueColorVariant?: SensorCardColorVariant;
+    /** Append a "%" to numeric values. Default `true`. */
+    showPercentSign?: boolean;
+    /** Unit shown above the value in a stacked layout, e.g. "°F", "kPa". */
+    unit?: string;
+    /** Icon on the left with mode/description stacked beside it. */
+    stackedLayout?: boolean;
+    /**
+     * - `default`: bare row, no Card wrapper (for nesting).
+     * - `standalone`: wrapped in a Card with full styling.
+     */
+    variant?: "default" | "standalone";
+    /** Click handler for the whole card. */
+    onClick?: () => void;
+    /** Click handler for just the value. */
+    onValueClick?: () => void;
+    className?: string;
+}
+/**
+ * A compact info/action card: a left side with an icon, mode label, and
+ * description, and a right side with an accent bar and a value. Use
+ * `colorVariant` to tint the bar, mode label, and default icon (primary /
+ * warning / danger / muted), `variant="standalone"` to wrap it in a Card, and
+ * `onClick` / `onValueClick` for actions.
+ */
+export declare function SensorCard({ icon, mode, description, value, showAccent, colorVariant, accentColorVariant, valueColorVariant, showPercentSign, unit, stackedLayout, variant, onClick, onValueClick, className, }: SensorCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/custom/side-sheet.d.ts

@@ -0,0 +1,56 @@
+import * as React from "react";
+export interface SideSheetProps {
+    /** Body content — typically a form. Scrolls between the pinned header/footer. */
+    children: React.ReactNode;
+    /** Heading shown in the pinned header. */
+    title?: React.ReactNode;
+    /** Whether the sheet is open. Controlled. */
+    open: boolean;
+    /** Called when the sheet requests to close (back/close, overlay, or Esc). */
+    onClose: () => void;
+    /** Optional supporting text under the title. */
+    description?: React.ReactNode;
+    /** Which edge the sheet slides in from. Defaults to `right`. */
+    side?: "left" | "right";
+    /**
+     * Detach the panel from the screen edge — inset with a margin, fully rounded
+     * corners, and a shadow, so it reads as a floating card.
+     */
+    floating?: boolean;
+    /**
+     * Show a back chevron before the title. Defaults to a close (X) button.
+     * When set, the chevron calls `onBack` (falls back to `onClose`).
+     */
+    onBack?: () => void;
+    /**
+     * When set, the sheet can't be dismissed by clicking the overlay or pressing
+     * Escape — only the header control / footer actions close it.
+     */
+    notDismissable?: boolean;
+    /** Footer content, pinned to the bottom with a top border. Always visible. */
+    footer?: React.ReactNode;
+    /** Class for the sheet content surface (e.g. width overrides). */
+    className?: string;
+}
+/**
+ * A slide-in panel with a pinned header and a **sticky footer**: the header
+ * (title, description, and a back/close control) and the footer (actions) stay
+ * fixed while the body scrolls between them. Controlled via `open`/`onClose`.
+ * Set `notDismissable` to require an explicit action to close, pass `onBack` to
+ * swap the close button for a back chevron, or `floating` to detach the panel
+ * from the screen edge as a rounded, shadowed card.
+ */
+declare function SideSheet({ children, title, open, onClose, description, side, floating, onBack, notDismissable, footer, className, }: SideSheetProps): import("react/jsx-runtime").JSX.Element;
+export interface SideSheetSectionProps extends React.ComponentProps<"div"> {
+    /** Optional label rendered above the grouped panel, with a divider rule. */
+    label?: React.ReactNode;
+    /** Optional trailing control beside the label (e.g. an expand button). */
+    action?: React.ReactNode;
+}
+/**
+ * A labelled, grouped block for the sheet body — a divider-titled `bg-secondary`
+ * panel, matching the "Trigger Settings" / "Spray Stages" grouping pattern.
+ * Drop form rows in as children.
+ */
+declare function SideSheetSection({ label, action, className, children, ...props }: SideSheetSectionProps): import("react/jsx-runtime").JSX.Element;
+export { SideSheet, SideSheetSection };

package/dist/components/custom/stat-card.d.ts

@@ -0,0 +1,54 @@
+import * as React from "react";
+export type StatCardColor = "primary" | "success" | "warning" | "danger" | "muted";
+export interface StatCardTrend {
+    /** Delta text, e.g. "+20.1%". */
+    value: string;
+    /** Direction — sets the arrow icon and default color. */
+    direction?: "up" | "down";
+    /** Trailing context, e.g. "from last month". */
+    label?: React.ReactNode;
+}
+export interface StatCardProgress {
+    /** Completion percentage, 0–100. */
+    value: number;
+    /** Caption under the bar, left-aligned. */
+    caption?: React.ReactNode;
+    /** Caption under the bar, right-aligned (e.g. "Target: $10,000"). */
+    target?: React.ReactNode;
+}
+export interface StatCardRing {
+    /** Filled percentage, 0–100. */
+    value: number;
+    /** Label inside the ring (defaults to `value%`). */
+    label?: React.ReactNode;
+    /** Caption beside the ring (e.g. "of 100 GB"). */
+    caption?: React.ReactNode;
+}
+export interface StatCardProps {
+    /** Small muted heading. */
+    title: React.ReactNode;
+    /** The headline figure, e.g. "$45,231". */
+    value: React.ReactNode;
+    /** Muted supporting line under the value. */
+    description?: React.ReactNode;
+    /** Icon shown in a tinted box at the top-right. */
+    icon?: React.ReactNode;
+    /** Accent color for the icon box, trend, progress bar, and ring. */
+    color?: StatCardColor;
+    /** A colored delta with a trend arrow, shown in place of `description`. */
+    trend?: StatCardTrend;
+    /** A linear progress bar with optional captions, shown under the value. */
+    progress?: StatCardProgress;
+    /** A small filled area chart (series of numbers), shown under the value. */
+    sparkline?: number[];
+    /** A radial progress ring shown beside the value. */
+    ring?: StatCardRing;
+    className?: string;
+}
+/**
+ * A dashboard stat card: a muted `title`, a bold `value`, and an optional
+ * accessory — a tinted `icon` box, a colored `trend` delta, a linear
+ * `progress` bar, a `sparkline` area chart, or a radial `ring`. Tint accessories
+ * with `color`.
+ */
+export declare function StatCard({ title, value, description, icon, color, trend, progress, sparkline, ring, className, }: StatCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/badge.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const badgeVariants: (props?: ({
-    variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | "red" | "orange" | "yellow" | "green" | "teal" | "cyan" | "blue" | "purple" | "pink" | "gray" | null | undefined;
+    variant?: "link" | "default" | "outline" | "secondary" | "ghost" | "destructive" | "red" | "orange" | "yellow" | "green" | "teal" | "cyan" | "blue" | "purple" | "pink" | "gray" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 declare function Badge({ className, variant, asChild, ...props }: React.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
     asChild?: boolean;

package/dist/components/ui/button.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const buttonVariants: (props?: ({
-    variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined;
+    variant?: "link" | "default" | "outline" | "secondary" | "ghost" | "destructive" | null | undefined;
     size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {

package/dist/components/ui/item.d.ts

@@ -11,7 +11,7 @@ declare function Item({ className, variant, size, asChild, ...props }: React.Com
     asChild?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
 declare const itemMediaVariants: (props?: ({
-    variant?: "default" | "icon" | "image" | null | undefined;
+    variant?: "image" | "default" | "icon" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 declare function ItemMedia({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): import("react/jsx-runtime").JSX.Element;
 declare function ItemContent({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;

package/dist/index.d.ts

@@ -1,6 +1,8 @@
 export { cn } from './lib/utils';
+export { useFileUpload, formatBytes, type FileMetadata, type FileWithPreview, type FileUploadOptions, type FileUploadState, type FileUploadActions, } from './lib/use-file-upload';
 export * from './components/custom/actions-menu';
 export * from './components/custom/advanced-input';
+export * from './components/custom/file-upload';
 export * from './components/custom/advanced-select';
 export * from './components/custom/data-table';
 export * from './components/custom/date-time-range-picker';