@kjaniec-dev/ui 0.5.0 → 0.6.0

package/dist/index.d.cts

@@ -329,4 +329,35 @@ declare namespace DataTable {
     var displayName: string;
 }
 
-export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, Alert, type AlertProps, Avatar, AvatarGroup, type AvatarProps, Badge, type BadgeProps, Breadcrumb, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbSeparator, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Checkbox, type CheckboxProps, DataTable, type DataTableColumn, type DataTableProps, DropdownMenu, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuSeparator, DropdownMenuTrigger, EmptyState, type EmptyStateProps, Field, Hint, type HintProps, Input, type InputProps, Label, type LabelProps, MetricCard, type MetricCardProps, Modal, ModalActions, ModalDescription, type ModalProps, ModalTitle, PageHeader, type PageHeaderProps, Pagination, type PaginationProps, Progress, type ProgressProps, Radio, type RadioProps, Segmented, type SegmentedOption, type SegmentedProps, Select, type SelectProps, Slider, type SliderProps, Spinner, type SpinnerProps, Stat, type StatProps, Switch, type SwitchProps, Table, TableBody, TableCell, type TableCellProps, TableHead, TableHeader, TableRow, TableWrap, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, type ToastOptions, ToastProvider, type ToastTone, Tooltip, type TooltipProps, badgeVariants, buttonVariants, cn, sliderThumbCSS, useToast };
+interface FormFieldProps extends React.HTMLAttributes<HTMLDivElement> {
+    label: string;
+    hint?: string;
+    error?: string;
+    required?: boolean;
+    children: React.ReactNode;
+}
+declare const FormField: React.ForwardRefExoticComponent<FormFieldProps & React.RefAttributes<HTMLDivElement>>;
+
+interface ErrorStateProps extends React.HTMLAttributes<HTMLDivElement> {
+    title?: string;
+    message: string;
+    onRetry?: () => void;
+    retryLabel?: string;
+}
+declare const ErrorState: React.ForwardRefExoticComponent<ErrorStateProps & React.RefAttributes<HTMLDivElement>>;
+
+interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: "text" | "circular" | "rectangular";
+    width?: string | number;
+    height?: string | number;
+}
+declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;
+
+interface DashboardShellProps extends React.HTMLAttributes<HTMLDivElement> {
+    sidebar?: React.ReactNode;
+    topbar?: React.ReactNode;
+    children: React.ReactNode;
+}
+declare const DashboardShell: React.ForwardRefExoticComponent<DashboardShellProps & React.RefAttributes<HTMLDivElement>>;
+
+export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, Alert, type AlertProps, Avatar, AvatarGroup, type AvatarProps, Badge, type BadgeProps, Breadcrumb, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbSeparator, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Checkbox, type CheckboxProps, DashboardShell, type DashboardShellProps, DataTable, type DataTableColumn, type DataTableProps, DropdownMenu, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuSeparator, DropdownMenuTrigger, EmptyState, type EmptyStateProps, ErrorState, type ErrorStateProps, Field, FormField, type FormFieldProps, Hint, type HintProps, Input, type InputProps, Label, type LabelProps, MetricCard, type MetricCardProps, Modal, ModalActions, ModalDescription, type ModalProps, ModalTitle, PageHeader, type PageHeaderProps, Pagination, type PaginationProps, Progress, type ProgressProps, Radio, type RadioProps, Segmented, type SegmentedOption, type SegmentedProps, Select, type SelectProps, Skeleton, type SkeletonProps, Slider, type SliderProps, Spinner, type SpinnerProps, Stat, type StatProps, Switch, type SwitchProps, Table, TableBody, TableCell, type TableCellProps, TableHead, TableHeader, TableRow, TableWrap, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, type ToastOptions, ToastProvider, type ToastTone, Tooltip, type TooltipProps, badgeVariants, buttonVariants, cn, sliderThumbCSS, useToast };

package/dist/index.d.ts

@@ -329,4 +329,35 @@ declare namespace DataTable {
     var displayName: string;
 }
 
-export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, Alert, type AlertProps, Avatar, AvatarGroup, type AvatarProps, Badge, type BadgeProps, Breadcrumb, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbSeparator, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Checkbox, type CheckboxProps, DataTable, type DataTableColumn, type DataTableProps, DropdownMenu, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuSeparator, DropdownMenuTrigger, EmptyState, type EmptyStateProps, Field, Hint, type HintProps, Input, type InputProps, Label, type LabelProps, MetricCard, type MetricCardProps, Modal, ModalActions, ModalDescription, type ModalProps, ModalTitle, PageHeader, type PageHeaderProps, Pagination, type PaginationProps, Progress, type ProgressProps, Radio, type RadioProps, Segmented, type SegmentedOption, type SegmentedProps, Select, type SelectProps, Slider, type SliderProps, Spinner, type SpinnerProps, Stat, type StatProps, Switch, type SwitchProps, Table, TableBody, TableCell, type TableCellProps, TableHead, TableHeader, TableRow, TableWrap, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, type ToastOptions, ToastProvider, type ToastTone, Tooltip, type TooltipProps, badgeVariants, buttonVariants, cn, sliderThumbCSS, useToast };
+interface FormFieldProps extends React.HTMLAttributes<HTMLDivElement> {
+    label: string;
+    hint?: string;
+    error?: string;
+    required?: boolean;
+    children: React.ReactNode;
+}
+declare const FormField: React.ForwardRefExoticComponent<FormFieldProps & React.RefAttributes<HTMLDivElement>>;
+
+interface ErrorStateProps extends React.HTMLAttributes<HTMLDivElement> {
+    title?: string;
+    message: string;
+    onRetry?: () => void;
+    retryLabel?: string;
+}
+declare const ErrorState: React.ForwardRefExoticComponent<ErrorStateProps & React.RefAttributes<HTMLDivElement>>;
+
+interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: "text" | "circular" | "rectangular";
+    width?: string | number;
+    height?: string | number;
+}
+declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;
+
+interface DashboardShellProps extends React.HTMLAttributes<HTMLDivElement> {
+    sidebar?: React.ReactNode;
+    topbar?: React.ReactNode;
+    children: React.ReactNode;
+}
+declare const DashboardShell: React.ForwardRefExoticComponent<DashboardShellProps & React.RefAttributes<HTMLDivElement>>;
+
+export { Accordion, AccordionContent, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, Alert, type AlertProps, Avatar, AvatarGroup, type AvatarProps, Badge, type BadgeProps, Breadcrumb, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbSeparator, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Checkbox, type CheckboxProps, DashboardShell, type DashboardShellProps, DataTable, type DataTableColumn, type DataTableProps, DropdownMenu, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuSeparator, DropdownMenuTrigger, EmptyState, type EmptyStateProps, ErrorState, type ErrorStateProps, Field, FormField, type FormFieldProps, Hint, type HintProps, Input, type InputProps, Label, type LabelProps, MetricCard, type MetricCardProps, Modal, ModalActions, ModalDescription, type ModalProps, ModalTitle, PageHeader, type PageHeaderProps, Pagination, type PaginationProps, Progress, type ProgressProps, Radio, type RadioProps, Segmented, type SegmentedOption, type SegmentedProps, Select, type SelectProps, Skeleton, type SkeletonProps, Slider, type SliderProps, Spinner, type SpinnerProps, Stat, type StatProps, Switch, type SwitchProps, Table, TableBody, TableCell, type TableCellProps, TableHead, TableHeader, TableRow, TableWrap, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, type ToastOptions, ToastProvider, type ToastTone, Tooltip, type TooltipProps, badgeVariants, buttonVariants, cn, sliderThumbCSS, useToast };

package/dist/index.js

@@ -632,7 +632,7 @@ var AccordionContent = React17.forwardRef(
         ref,
         className: cn("grid transition-[grid-template-rows] duration-200 ease-out", isOpen ? "[grid-template-rows:1fr]" : "[grid-template-rows:0fr]"),
         ...props,
-        children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: cn("px-[1.2rem] pb-[1.1rem] text-[0.85rem] text-muted-foreground", className), children }) })
+        children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: cn("px-[1.2rem] pt-3 pb-4 text-[0.85rem] text-muted-foreground", className), children }) })
       }
     );
   }
@@ -1151,7 +1151,95 @@ function DataTable({
   ] });
 }
 DataTable.displayName = "DataTable";
+var FormField = React17.forwardRef(
+  ({ className, label, hint, error, required, children, ...props }, ref) => {
+    const id = React17.useId();
+    const hintId = `${id}-hint`;
+    const errorId = `${id}-error`;
+    const child = React17.Children.only(children);
+    const clonedChild = React17.cloneElement(child, {
+      id: child.props.id ?? id,
+      "aria-describedby": cn(
+        hint && hintId,
+        error && errorId,
+        child.props["aria-describedby"]
+      ) || void 0,
+      "aria-invalid": error ? "true" : void 0,
+      required: child.props.required ?? required
+    });
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn("flex flex-col gap-1.5 w-full", className), ...props, children: [
+      /* @__PURE__ */ jsx(Label, { htmlFor: id, required, children: label }),
+      clonedChild,
+      hint && !error && /* @__PURE__ */ jsx(Hint, { id: hintId, children: hint }),
+      error && /* @__PURE__ */ jsx(Hint, { id: errorId, error: true, children: error })
+    ] });
+  }
+);
+FormField.displayName = "FormField";
+var ErrorState = React17.forwardRef(
+  ({ className, title = "Wyst\u0105pi\u0142 b\u0142\u0105d", message, onRetry, retryLabel = "Spr\xF3buj ponownie", ...props }, ref) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex flex-col items-center justify-center text-center p-8 border border-danger/25 rounded-kj-lg bg-danger-surface/20 min-h-[300px]",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-danger-surface border border-danger/30 text-danger mb-4", children: /* @__PURE__ */ jsx("svg", { fill: "none", stroke: "currentColor", strokeWidth: 2.5, viewBox: "0 0 24 24", className: "h-6 w-6", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 9v3.75m9-.75a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 3.75h.008v.008H12v-.008Z" }) }) }),
+        /* @__PURE__ */ jsx("h3", { className: "text-base font-bold text-foreground mb-1", children: title }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground max-w-sm mb-6 leading-relaxed", children: message }),
+        onRetry && /* @__PURE__ */ jsx(Button, { size: "sm", variant: "danger", onClick: onRetry, children: retryLabel })
+      ]
+    }
+  )
+);
+ErrorState.displayName = "ErrorState";
+var Skeleton = React17.forwardRef(
+  ({ className, variant = "rectangular", width, height, style, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "animate-pulse bg-muted/40",
+        variant === "text" && "h-3 w-4/5 rounded-sm my-1.5",
+        variant === "circular" && "rounded-full",
+        variant === "rectangular" && "rounded-kj-md",
+        className
+      ),
+      style: {
+        width,
+        height,
+        ...style
+      },
+      ...props
+    }
+  )
+);
+Skeleton.displayName = "Skeleton";
+var DashboardShell = React17.forwardRef(
+  ({ className, sidebar, topbar, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn(
+        "min-h-screen bg-canvas text-foreground flex flex-col md:flex-row",
+        className
+      ),
+      ...props,
+      children: [
+        sidebar && /* @__PURE__ */ jsx("aside", { className: "w-full md:w-64 border-r border-border bg-surface shrink-0 z-20", children: /* @__PURE__ */ jsx("div", { className: "sticky top-0 h-auto md:h-screen flex flex-col", children: sidebar }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col min-w-0", children: [
+          topbar && /* @__PURE__ */ jsx("header", { className: "sticky top-0 h-14 border-b border-border bg-surface flex items-center px-6 z-10 shrink-0", children: topbar }),
+          /* @__PURE__ */ jsx("main", { className: "flex-1 p-6 md:p-8 max-w-7xl w-full mx-auto", children })
+        ] })
+      ]
+    }
+  )
+);
+DashboardShell.displayName = "DashboardShell";
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, Avatar, AvatarGroup, Badge, Breadcrumb, BreadcrumbItem, BreadcrumbSeparator, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, DataTable, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, EmptyState, Field, Hint, Input, Label, MetricCard, Modal, ModalActions, ModalDescription, ModalTitle, PageHeader, Pagination, Progress, Radio, Segmented, Select, Slider, Spinner, Stat, Switch, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, TableWrap, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ToastProvider, Tooltip, badgeVariants, buttonVariants, cn, sliderThumbCSS, useToast };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, Avatar, AvatarGroup, Badge, Breadcrumb, BreadcrumbItem, BreadcrumbSeparator, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, DashboardShell, DataTable, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, EmptyState, ErrorState, Field, FormField, Hint, Input, Label, MetricCard, Modal, ModalActions, ModalDescription, ModalTitle, PageHeader, Pagination, Progress, Radio, Segmented, Select, Skeleton, Slider, Spinner, Stat, Switch, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, TableWrap, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ToastProvider, Tooltip, badgeVariants, buttonVariants, cn, sliderThumbCSS, useToast };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map