@craftzbay/ui 0.1.0 → 0.2.0

package/dist-lib/components/ui/Calendar.d.ts

@@ -0,0 +1,9 @@
+import { DayPickerProps } from 'react-day-picker';
+export type CalendarProps = DayPickerProps & {
+    className?: string;
+};
+/**
+ * Standalone calendar surface. Used by DatePicker, but can also be embedded
+ * directly in popovers, sheets, or inline forms. Wraps `react-day-picker`.
+ */
+export declare const Calendar: import('react').ForwardRefExoticComponent<CalendarProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist-lib/components/ui/Carousel.d.ts

@@ -0,0 +1,23 @@
+import { HTMLAttributes } from 'react';
+import { default as useEmblaCarousel, UseEmblaCarouselType } from 'embla-carousel-react';
+type CarouselApi = UseEmblaCarouselType[1];
+type CarouselOptions = Parameters<typeof useEmblaCarousel>[0];
+export interface CarouselProps extends HTMLAttributes<HTMLDivElement> {
+    opts?: CarouselOptions;
+    orientation?: 'horizontal' | 'vertical';
+    setApi?: (api: CarouselApi) => void;
+}
+/**
+ * Embla-backed carousel. Compose with `<CarouselContent>`, `<CarouselItem>`,
+ * `<CarouselPrevious>`, and `<CarouselNext>`.
+ */
+export declare const Carousel: import('react').ForwardRefExoticComponent<CarouselProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare const CarouselContent: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
+export declare const CarouselItem: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>>;
+export declare function CarouselPrevious({ className }: {
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function CarouselNext({ className }: {
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist-lib/components/ui/Chart.d.ts

@@ -0,0 +1,23 @@
+import { ReactNode } from 'react';
+/**
+ * Tiny, dependency-free chart primitives for inline dashboards. For complex
+ * visualisations reach for a charting library (Recharts, visx). These suffice
+ * for sparklines, KPI cards, and at-a-glance trends.
+ */
+export interface ChartPoint {
+    x: string | number;
+    y: number;
+}
+export interface ChartProps {
+    data: ChartPoint[];
+    /** Defaults to 24px height per point + 60px padding. */
+    height?: number;
+    /** Defaults to fluid 100%. */
+    width?: number | string;
+    /** Tooltip / label rendered above the chart. */
+    caption?: ReactNode;
+    className?: string;
+}
+export declare function LineChart({ data, height, width, caption, className }: ChartProps): import("react/jsx-runtime").JSX.Element;
+export declare function AreaChart({ data, height, width, caption, className }: ChartProps): import("react/jsx-runtime").JSX.Element;
+export declare function BarChart({ data, height, width, caption, className }: ChartProps): import("react/jsx-runtime").JSX.Element;

package/dist-lib/components/ui/Drawer.d.ts

@@ -0,0 +1,15 @@
+import { ComponentPropsWithoutRef, HTMLAttributes } from 'react';
+import { Drawer as DrawerPrimitive } from 'vaul';
+export declare const Drawer: {
+    ({ shouldScaleBackground, ...props }: ComponentPropsWithoutRef<typeof DrawerPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export declare const DrawerTrigger: import('react').ForwardRefExoticComponent<import('@radix-ui/react-dialog').DialogTriggerProps & import('react').RefAttributes<HTMLButtonElement>>;
+export declare const DrawerPortal: typeof import('vaul').Portal;
+export declare const DrawerClose: import('react').ForwardRefExoticComponent<import('@radix-ui/react-dialog').DialogCloseProps & import('react').RefAttributes<HTMLButtonElement>>;
+export declare const DrawerOverlay: import('react').ForwardRefExoticComponent<Omit<Omit<import('@radix-ui/react-dialog').DialogOverlayProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export declare const DrawerContent: import('react').ForwardRefExoticComponent<Omit<Omit<import('@radix-ui/react-dialog').DialogContentProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export declare function DrawerHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+export declare function DrawerFooter({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+export declare const DrawerTitle: import('react').ForwardRefExoticComponent<Omit<import('@radix-ui/react-dialog').DialogTitleProps & import('react').RefAttributes<HTMLHeadingElement>, "ref"> & import('react').RefAttributes<HTMLHeadingElement>>;
+export declare const DrawerDescription: import('react').ForwardRefExoticComponent<Omit<import('@radix-ui/react-dialog').DialogDescriptionProps & import('react').RefAttributes<HTMLParagraphElement>, "ref"> & import('react').RefAttributes<HTMLParagraphElement>>;

package/dist-lib/components/ui/FileUpload.d.ts

@@ -0,0 +1,23 @@
+import { ReactNode } from 'react';
+export interface FileUploadProps {
+    /** Accepted file types, e.g. `image/*` or `.pdf,.docx`. */
+    accept?: string;
+    /** Allow multiple files. */
+    multiple?: boolean;
+    /** Max file size in bytes. Files larger than this are rejected. */
+    maxSize?: number;
+    /** Controlled file list. */
+    value?: File[];
+    /** Called when files are added or removed. */
+    onChange?: (files: File[]) => void;
+    /** Helper text inside the drop zone. */
+    hint?: ReactNode;
+    /** Disable the picker entirely. */
+    disabled?: boolean;
+    className?: string;
+}
+/**
+ * Drag-and-drop file picker with an inline file list. Uncontrolled by default;
+ * pass `value` + `onChange` to control externally.
+ */
+export declare const FileUpload: import('react').ForwardRefExoticComponent<FileUploadProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist-lib/components/ui/Snackbar.d.ts

@@ -0,0 +1,21 @@
+import { HTMLAttributes, ReactNode } from 'react';
+import { VariantProps } from '../../lib/cva';
+declare const snackbar: (props?: ({
+    variant?: "default" | "success" | "warning" | "danger" | "info" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface SnackbarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'>, VariantProps<typeof snackbar> {
+    /** Headline. */
+    title?: ReactNode;
+    /** Action button rendered on the right. */
+    action?: ReactNode;
+    /** Show a close (×) button on the right. */
+    onClose?: () => void;
+    /** Override the variant's default icon. Pass `false` to hide. */
+    icon?: ReactNode | false;
+}
+/**
+ * Persistent inline notification. Unlike Toast, Snackbar does **not** auto-
+ * dismiss. Pair with an `action` button or an `onClose` handler.
+ */
+export declare const Snackbar: import('react').ForwardRefExoticComponent<SnackbarProps & import('react').RefAttributes<HTMLDivElement>>;
+export {};

package/dist-lib/components/ui/TagInput.d.ts

@@ -0,0 +1,24 @@
+export interface TagInputProps {
+    /** Controlled list of tags. */
+    value?: string[];
+    /** Default tags when uncontrolled. */
+    defaultValue?: string[];
+    /** Called when the tag list changes. */
+    onChange?: (tags: string[]) => void;
+    /** Placeholder shown inside the inline input. */
+    placeholder?: string;
+    /** Maximum number of tags. */
+    max?: number;
+    /** Disable the editor. */
+    disabled?: boolean;
+    /** Show a danger border. */
+    error?: boolean;
+    /** Treat these characters as separators (default: Enter + comma). */
+    separators?: string[];
+    className?: string;
+}
+/**
+ * Chip-based multi-value input. Press Enter or comma to add. Backspace on an
+ * empty input removes the last tag.
+ */
+export declare const TagInput: import('react').ForwardRefExoticComponent<TagInputProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist-lib/components/ui/Timeline.d.ts

@@ -0,0 +1,23 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface TimelineProps extends HTMLAttributes<HTMLOListElement> {
+}
+export declare const Timeline: import('react').ForwardRefExoticComponent<TimelineProps & import('react').RefAttributes<HTMLOListElement>>;
+export interface TimelineItemProps extends HTMLAttributes<HTMLLIElement> {
+    /** Optional bullet override. Default: small accent dot. */
+    bullet?: ReactNode;
+    /** Hide the connector line below this item — use for the last item. */
+    isLast?: boolean;
+}
+export declare const TimelineItem: import('react').ForwardRefExoticComponent<TimelineItemProps & import('react').RefAttributes<HTMLLIElement>>;
+export declare function TimelineTime({ className, children }: {
+    className?: string;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function TimelineTitle({ className, children, }: {
+    className?: string;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function TimelineDescription({ className, children, }: {
+    className?: string;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist-lib/components/ui/Tree.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from 'react';
+export interface TreeNode {
+    id: string;
+    label: ReactNode;
+    /** If undefined the node is a leaf; if empty array it is an empty folder. */
+    children?: TreeNode[];
+    /** Optional custom icon (overrides default file/folder icons). */
+    icon?: ReactNode;
+}
+export interface TreeProps {
+    /** The root nodes. */
+    data: TreeNode[];
+    /** Ids to expand by default. */
+    defaultExpanded?: string[];
+    /** Currently selected node id. */
+    selectedId?: string;
+    onSelect?: (id: string) => void;
+    className?: string;
+}
+/**
+ * Expandable file-tree style list. Single selection. Keyboard a11y is
+ * handled at the row level (`tabIndex`, Enter, ArrowRight/Left to toggle).
+ */
+export declare function Tree({ data, defaultExpanded, selectedId, onSelect, className }: TreeProps): import("react/jsx-runtime").JSX.Element;