@contractspec/lib.ui-kit 1.57.0 → 1.59.0

package/dist/ui/organisms/ListPage/ListPage.js

@@ -1,198 +1,1376 @@
-import { Button } from "../../button.js";
-import { Card, CardContent } from "../../card.js";
-import { HStack, VStack } from "../../stack.js";
-import { Separator } from "../../separator.js";
-import { Pagination } from "../../atoms/Pagination/Pagination.js";
-import { SearchAndFilter } from "../../molecules/SearchAndFilter/SearchAndFilter.js";
-import React from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { AlertTriangle, Loader2, Plus, RefreshCcw } from "lucide-react";
-import Link from "next/link";
-
-//#region ui/organisms/ListPage/ListPage.tsx
-function ListPage({ title, description, header, items, totalItems, totalPages, isLoading, isFetching, error, listState, searchPlaceholder, filters = [], onRefresh, primaryAction, toolbar, renderItem, renderEmpty, renderStats, className = "", itemClassName = "" }) {
-	const { searchQuery, setSearchQuery, filters: filterValues, setFilter, currentPage, itemsPerPage, setCurrentPage, setItemsPerPage } = listState;
-	if (isLoading && !items.length) return /* @__PURE__ */ jsxs(VStack, {
-		className: `space-y-4 md:space-y-6 ${className}`,
-		children: [header ? header : /* @__PURE__ */ jsxs(VStack, {
-			className: "gap-1",
-			children: [/* @__PURE__ */ jsx("h1", {
-				className: "text-2xl font-bold md:text-3xl",
-				children: title
-			}), description && /* @__PURE__ */ jsx("p", {
-				className: "text-muted-foreground text-base",
-				children: description
-			})]
-		}), /* @__PURE__ */ jsx("div", {
-			className: "flex min-h-[400px] items-center justify-center",
-			children: /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(CardContent, {
-				className: "flex items-center gap-4 p-6",
-				children: [/* @__PURE__ */ jsx(Loader2, { className: "text-primary h-8 w-8 animate-spin" }), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
-					className: "font-medium",
-					children: "Chargement..."
-				}), /* @__PURE__ */ jsx("p", {
-					className: "text-muted-foreground text-base",
-					children: "Récupération des données en cours"
-				})] })]
-			}) })
-		})]
-	});
-	if (error && !items.length) return /* @__PURE__ */ jsxs(VStack, {
-		className: `space-y-4 md:space-y-6 ${className}`,
-		children: [header ? header : /* @__PURE__ */ jsxs(VStack, {
-			className: "gap-1",
-			children: [/* @__PURE__ */ jsx("h1", {
-				className: "text-2xl font-bold md:text-3xl",
-				children: title
-			}), description && /* @__PURE__ */ jsx("p", {
-				className: "text-muted-foreground text-base",
-				children: description
-			})]
-		}), /* @__PURE__ */ jsx("div", {
-			className: "flex min-h-[400px] items-center justify-center",
-			children: /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(CardContent, {
-				className: "flex flex-col items-center gap-4 p-6 text-center",
-				children: [
-					/* @__PURE__ */ jsx(AlertTriangle, { className: "text-destructive h-12 w-12" }),
-					/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
-						className: "font-medium",
-						children: "Erreur de chargement"
-					}), /* @__PURE__ */ jsx("p", {
-						className: "text-muted-foreground text-base",
-						children: error.message || "Une erreur est survenue"
-					})] }),
-					onRefresh && /* @__PURE__ */ jsxs(Button, {
-						onPress: onRefresh,
-						variant: "outline",
-						size: "sm",
-						children: [/* @__PURE__ */ jsx(RefreshCcw, { className: "mr-2 h-4 w-4" }), "Réessayer"]
-					})
-				]
-			}) })
-		})]
-	});
-	const filterConfigs = filters.map((filter) => ({
-		key: filter.key,
-		label: filter.label,
-		value: filterValues[filter.key] || "",
-		options: filter.options,
-		onChange: (value) => {
-			setFilter(filter.key, value?.value || "");
-		},
-		showCounts: filter.showCounts
-	}));
-	return /* @__PURE__ */ jsxs(VStack, {
-		className: `space-y-4 md:space-y-6 ${className}`,
-		children: [
-			header ? header : /* @__PURE__ */ jsxs(HStack, {
-				className: "items-center justify-between",
-				children: [/* @__PURE__ */ jsxs(VStack, {
-					className: "gap-1",
-					children: [/* @__PURE__ */ jsx("h1", {
-						className: "text-2xl font-bold md:text-3xl",
-						children: title
-					}), description && /* @__PURE__ */ jsx("p", {
-						className: "text-muted-foreground text-base",
-						children: description
-					})]
-				}), /* @__PURE__ */ jsxs(HStack, {
-					className: "items-center gap-4",
-					children: [
-						toolbar,
-						(isLoading || isFetching) && /* @__PURE__ */ jsxs("div", {
-							className: "text-muted-foreground flex items-center gap-2 text-base",
-							children: [/* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }), /* @__PURE__ */ jsx("span", {
-								className: "hidden sm:inline",
-								children: "Mise à jour..."
-							})]
-						}),
-						onRefresh && /* @__PURE__ */ jsxs(Button, {
-							variant: "outline",
-							size: "sm",
-							onPress: onRefresh,
-							disabled: Boolean(isLoading),
-							"aria-label": "Rafraîchir",
-							children: [/* @__PURE__ */ jsx(RefreshCcw, { className: `mr-2 h-4 w-4 ${isLoading || isFetching ? "animate-spin" : ""}` }), /* @__PURE__ */ jsx("span", {
-								className: "hidden sm:inline",
-								children: "Rafraîchir"
-							})]
-						}),
-						primaryAction && /* @__PURE__ */ jsx(Fragment, { children: primaryAction.href ? /* @__PURE__ */ jsx(Link, {
-							href: primaryAction.href,
-							children: /* @__PURE__ */ jsxs(Button, { children: [
-								primaryAction.icon || /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4" }),
-								/* @__PURE__ */ jsx("span", {
-									className: "hidden sm:inline",
-									children: primaryAction.label
-								}),
-								/* @__PURE__ */ jsx("span", {
-									className: "sm:hidden",
-									children: "Nouveau"
-								})
-							] })
-						}) : /* @__PURE__ */ jsxs(Button, {
-							onPress: primaryAction.onClick,
-							children: [
-								primaryAction.icon || /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4" }),
-								/* @__PURE__ */ jsx("span", {
-									className: "hidden sm:inline",
-									children: primaryAction.label
-								}),
-								/* @__PURE__ */ jsx("span", {
-									className: "sm:hidden",
-									children: "Nouveau"
-								})
-							]
-						}) })
-					]
-				})]
-			}),
-			renderStats && /* @__PURE__ */ jsxs(Fragment, { children: [renderStats(items), /* @__PURE__ */ jsx(Separator, {})] }),
-			/* @__PURE__ */ jsx(SearchAndFilter, {
-				searchValue: searchQuery,
-				onSearchChange: setSearchQuery,
-				searchPlaceholder,
-				filters: filterConfigs,
-				isLoading
-			}),
-			items.length === 0 && !isLoading ? renderEmpty ? renderEmpty() : /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(CardContent, {
-				className: "flex flex-col items-center gap-4 p-8 text-center",
-				children: [
-					/* @__PURE__ */ jsx("div", {
-						className: "bg-muted flex h-12 w-12 items-center justify-center rounded-full",
-						children: /* @__PURE__ */ jsx("div", { className: "bg-muted-foreground/20 h-6 w-6 rounded-full" })
-					}),
-					/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
-						className: "font-medium",
-						children: "Aucun élément trouvé"
-					}), /* @__PURE__ */ jsx("p", {
-						className: "text-muted-foreground text-base",
-						children: searchQuery || Object.values(filterValues).some((v) => v) ? "Essayez de modifier vos critères de recherche" : "Commencez par créer votre premier élément"
-					})] }),
-					primaryAction && !searchQuery && !Object.values(filterValues).some((v) => v) && /* @__PURE__ */ jsx(Fragment, { children: primaryAction.href ? /* @__PURE__ */ jsx(Link, {
-						href: primaryAction.href,
-						children: /* @__PURE__ */ jsxs(Button, { children: [primaryAction.icon || /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4" }), primaryAction.label] })
-					}) : /* @__PURE__ */ jsxs(Button, {
-						onPress: primaryAction.onClick,
-						children: [primaryAction.icon || /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4" }), primaryAction.label]
-					}) })
-				]
-			}) }) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
-				className: `space-y-4 ${itemClassName}`,
-				children: items.map((item, index) => renderItem(item, index))
-			}), totalPages > 1 && /* @__PURE__ */ jsx(Pagination, {
-				currentPage,
-				totalPages,
-				totalItems,
-				itemsPerPage,
-				onPageChange: setCurrentPage,
-				onItemsPerPageChange: setItemsPerPage,
-				disabled: isLoading
-			})] })
-		]
-	});
+// @bun
+// ui/icons/iconWithClassName.ts
+import { styled } from "nativewind";
+function iconWithClassName(icon) {
+  styled(icon, {
+    className: {
+      target: "style",
+      nativeStyleMapping: {
+        color: true,
+        opacity: true
+      }
+    }
+  });
 }
 
-//#endregion
-export { ListPage };
-//# sourceMappingURL=ListPage.js.map
+// ui/icons/ChevronDown.tsx
+import { ChevronDown } from "lucide-react-native";
+iconWithClassName(ChevronDown);
+// ui/text.tsx
+import * as Slot from "@rn-primitives/slot";
+import * as React from "react";
+import { Text as RNText } from "react-native";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+var TextClassContext = React.createContext(undefined);
+function Text2({
+  className,
+  asChild = false,
+  ...props
+}) {
+  const textClass = React.useContext(TextClassContext);
+  const Component = asChild ? Slot.Text : RNText;
+  return /* @__PURE__ */ jsxDEV(Component, {
+    className: cn("text-foreground web:select-text text-base", textClass, className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/button.tsx
+import { cva } from "class-variance-authority";
+import { Pressable } from "react-native";
+import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+var buttonVariants = cva("group flex items-center justify-center rounded-md web:ring-offset-background web:transition-colors web:focus-visible:outline-hidden web:focus-visible:ring-2 web:focus-visible:ring-ring web:focus-visible:ring-offset-2", {
+  variants: {
+    variant: {
+      default: "bg-primary web:hover:opacity-90 active:opacity-90",
+      destructive: "bg-destructive web:hover:opacity-90 active:opacity-90",
+      outline: "border border-input bg-background web:hover:bg-accent web:hover:text-accent-foreground active:bg-accent",
+      secondary: "bg-secondary web:hover:opacity-80 active:opacity-80",
+      ghost: "web:hover:bg-accent web:hover:text-accent-foreground active:bg-accent",
+      link: "web:underline-offset-4 web:hover:underline web:focus:underline"
+    },
+    size: {
+      default: "h-10 px-4 py-2 native:h-12 native:px-5 native:py-3",
+      sm: "h-9 rounded-md px-3",
+      lg: "h-11 rounded-md px-8 native:h-14",
+      icon: "h-10 w-10"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+var buttonTextVariants = cva("web:whitespace-nowrap text-sm native:text-base font-medium text-foreground web:transition-colors", {
+  variants: {
+    variant: {
+      default: "text-primary-foreground",
+      destructive: "text-destructive-foreground",
+      outline: "group-active:text-accent-foreground",
+      secondary: "text-secondary-foreground group-active:text-secondary-foreground",
+      ghost: "group-active:text-accent-foreground",
+      link: "text-primary group-active:underline"
+    },
+    size: {
+      default: "",
+      sm: "",
+      lg: "native:text-lg",
+      icon: ""
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+function Button({ ref, className, variant, size, ...props }) {
+  return /* @__PURE__ */ jsxDEV2(TextClassContext.Provider, {
+    value: buttonTextVariants({
+      variant,
+      size,
+      className: "web:pointer-events-none"
+    }),
+    children: /* @__PURE__ */ jsxDEV2(Pressable, {
+      className: cn2(props.disabled && "web:pointer-events-none opacity-50", buttonVariants({ variant, size, className })),
+      ref,
+      role: "button",
+      ...props
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+// ui/icons/Check.tsx
+import { Check } from "lucide-react-native";
+iconWithClassName(Check);
+// ui/icons/ChevronUp.tsx
+import { ChevronUp } from "lucide-react-native";
+iconWithClassName(ChevronUp);
+// ui/select.tsx
+import * as SelectPrimitive from "@rn-primitives/select";
+import { Platform, StyleSheet, View } from "react-native";
+import Animated, { FadeIn, FadeOut } from "react-native-reanimated";
+import { cn as cn3 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
+var Select = SelectPrimitive.Root;
+var SelectGroup = SelectPrimitive.Group;
+var SelectValue = SelectPrimitive.Value;
+function SelectTrigger({
+  ref,
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV3(SelectPrimitive.Trigger, {
+    ref,
+    className: cn3("native:h-12 border-input bg-background text-muted-foreground web:ring-offset-background web:focus:outline-hidden web:focus:ring-2 web:focus:ring-ring web:focus:ring-offset-2 flex h-10 flex-row items-center justify-between rounded-md border px-3 py-2 text-sm [&>span]:line-clamp-1", props.disabled && "web:cursor-not-allowed opacity-50", className),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsxDEV3(ChevronDown, {
+        size: 16,
+        "aria-hidden": true,
+        className: "text-foreground opacity-50"
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+function SelectScrollUpButton({
+  className,
+  ...props
+}) {
+  if (Platform.OS !== "web") {
+    return null;
+  }
+  return /* @__PURE__ */ jsxDEV3(SelectPrimitive.ScrollUpButton, {
+    className: cn3("web:cursor-default flex items-center justify-center py-1", className),
+    ...props,
+    children: /* @__PURE__ */ jsxDEV3(ChevronUp, {
+      size: 14,
+      className: "text-foreground"
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+function SelectScrollDownButton({
+  className,
+  ...props
+}) {
+  if (Platform.OS !== "web") {
+    return null;
+  }
+  return /* @__PURE__ */ jsxDEV3(SelectPrimitive.ScrollDownButton, {
+    className: cn3("web:cursor-default flex items-center justify-center py-1", className),
+    ...props,
+    children: /* @__PURE__ */ jsxDEV3(ChevronDown, {
+      size: 14,
+      className: "text-foreground"
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+function SelectContent({
+  className,
+  children,
+  position = "popper",
+  portalHost,
+  ...props
+}) {
+  const { open } = SelectPrimitive.useRootContext();
+  return /* @__PURE__ */ jsxDEV3(SelectPrimitive.Portal, {
+    hostName: portalHost,
+    children: /* @__PURE__ */ jsxDEV3(SelectPrimitive.Overlay, {
+      style: Platform.OS !== "web" ? StyleSheet.absoluteFill : undefined,
+      children: /* @__PURE__ */ jsxDEV3(Animated.View, {
+        className: "z-50",
+        entering: FadeIn,
+        exiting: FadeOut,
+        children: /* @__PURE__ */ jsxDEV3(SelectPrimitive.Content, {
+          className: cn3("border-border bg-popover shadow-foreground/10 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 relative z-50 max-h-96 min-w-32 rounded-md border px-1 py-2 shadow-md", position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", open ? "web:animate-in web:fade-in-0 web:zoom-in-95" : "web:animate-out web:fade-out-0 web:zoom-out-95", className),
+          position,
+          ...props,
+          children: [
+            /* @__PURE__ */ jsxDEV3(SelectScrollUpButton, {}, undefined, false, undefined, this),
+            /* @__PURE__ */ jsxDEV3(SelectPrimitive.Viewport, {
+              className: cn3("p-1", position === "popper" && "h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)"),
+              children
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ jsxDEV3(SelectScrollDownButton, {}, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      }, undefined, false, undefined, this)
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+function SelectLabel({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV3(SelectPrimitive.Label, {
+    className: cn3("native:pb-2 native:pl-10 native:text-base text-popover-foreground py-1.5 pr-2 pl-8 text-sm font-semibold", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function SelectItem({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV3(SelectPrimitive.Item, {
+    className: cn3("web:group native:py-2 native:pl-10 active:bg-accent web:cursor-default web:select-none web:outline-hidden web:hover:bg-accent/50 web:focus:bg-accent relative flex w-full flex-row items-center rounded-xs py-1.5 pr-2 pl-8", props.disabled && "web:pointer-events-none opacity-50", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxDEV3(View, {
+        className: "native:left-3.5 native:pt-px absolute left-2 flex h-3.5 w-3.5 items-center justify-center",
+        children: /* @__PURE__ */ jsxDEV3(SelectPrimitive.ItemIndicator, {
+          children: /* @__PURE__ */ jsxDEV3(Check, {
+            size: 16,
+            strokeWidth: 3,
+            className: "text-popover-foreground"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV3(SelectPrimitive.ItemText, {
+        className: "native:text-lg native:text-base text-popover-foreground web:group-focus:text-accent-foreground text-sm"
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+function SelectSeparator({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV3(SelectPrimitive.Separator, {
+    className: cn3("bg-muted -mx-1 my-1 h-px", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/label.tsx
+import { cn as cn4 } from "@contractspec/lib.ui-kit-core/utils";
+import * as LabelPrimitive from "@rn-primitives/label";
+import { Platform as Platform2 } from "react-native";
+import { jsxDEV as jsxDEV4 } from "react/jsx-dev-runtime";
+function Label2({
+  className,
+  onPress,
+  onLongPress,
+  onPressIn,
+  onPressOut,
+  disabled,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV4(LabelPrimitive.Root, {
+    className: cn4("flex flex-row items-center gap-2 select-none", Platform2.select({
+      web: "cursor-default leading-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
+    }), disabled && "opacity-50"),
+    onPress,
+    onLongPress,
+    onPressIn,
+    onPressOut,
+    disabled,
+    children: /* @__PURE__ */ jsxDEV4(LabelPrimitive.Text, {
+      className: cn4("text-foreground text-sm font-medium", Platform2.select({ web: "leading-none" }), className),
+      ...props
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+// ui/stack.tsx
+import { View as View2 } from "react-native";
+import { cn as cn5 } from "@contractspec/lib.ui-kit-core/utils";
+import { cva as cva2 } from "class-variance-authority";
+import { jsxDEV as jsxDEV5 } from "react/jsx-dev-runtime";
+var baseStyle = "flex";
+var vStackVariants = cva2([baseStyle, "flex-col"], {
+  variants: {
+    spacing: {
+      none: "",
+      xs: "gap-y-1",
+      sm: "gap-y-2",
+      md: "gap-y-4",
+      lg: "gap-y-6",
+      xl: "gap-y-8",
+      "2xl": "gap-y-12"
+    },
+    align: {
+      stretch: "items-stretch",
+      start: "items-start",
+      center: "items-center",
+      end: "items-end"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    width: {
+      auto: "w-auto",
+      full: "w-full",
+      screen: "w-screen",
+      fit: "w-fit"
+    },
+    padding: {
+      none: "",
+      xs: "p-1",
+      sm: "p-2",
+      md: "p-4",
+      lg: "p-6",
+      xl: "p-8"
+    },
+    gap: {
+      none: "",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-4",
+      lg: "gap-6",
+      xl: "gap-8"
+    }
+  },
+  defaultVariants: {
+    spacing: "md",
+    align: "stretch",
+    justify: "start",
+    width: "auto",
+    padding: "none",
+    gap: "none"
+  }
+});
+var hStackVariants = cva2([baseStyle, "flex-row"], {
+  variants: {
+    spacing: {
+      none: "",
+      xs: "gap-x-1",
+      sm: "gap-x-2",
+      md: "gap-x-4",
+      lg: "gap-x-6",
+      xl: "gap-x-8",
+      "2xl": "gap-x-12"
+    },
+    align: {
+      stretch: "items-stretch",
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      baseline: "items-baseline"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    width: {
+      auto: "w-auto",
+      full: "w-full",
+      screen: "w-screen",
+      fit: "w-fit"
+    },
+    padding: {
+      none: "",
+      xs: "p-1",
+      sm: "p-2",
+      md: "p-4",
+      lg: "p-6",
+      xl: "p-8"
+    },
+    gap: {
+      none: "",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-4",
+      lg: "gap-6",
+      xl: "gap-8"
+    },
+    wrap: {
+      nowrap: "flex-nowrap",
+      wrap: "flex-wrap",
+      reverse: "flex-wrap-reverse"
+    }
+  },
+  defaultVariants: {
+    spacing: "md",
+    align: "center",
+    justify: "start",
+    width: "auto",
+    padding: "none",
+    gap: "none",
+    wrap: "wrap"
+  }
+});
+var boxVariants = cva2([baseStyle, "flex-row"], {
+  variants: {
+    spacing: {
+      none: "",
+      xs: "gap-x-1",
+      sm: "gap-x-2",
+      md: "gap-x-4",
+      lg: "gap-x-6",
+      xl: "gap-x-8",
+      "2xl": "gap-x-12"
+    },
+    align: {
+      stretch: "items-stretch",
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      baseline: "items-baseline"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    width: {
+      auto: "w-auto",
+      full: "w-full",
+      screen: "w-screen",
+      fit: "w-fit"
+    },
+    padding: {
+      none: "",
+      xs: "p-1",
+      sm: "p-2",
+      md: "p-4",
+      lg: "p-6",
+      xl: "p-8"
+    },
+    gap: {
+      none: "",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-4",
+      lg: "gap-6",
+      xl: "gap-8"
+    },
+    wrap: {
+      nowrap: "flex-nowrap",
+      wrap: "flex-wrap",
+      reverse: "flex-wrap-reverse"
+    }
+  },
+  defaultVariants: {
+    spacing: "md",
+    align: "center",
+    justify: "center",
+    width: "auto",
+    padding: "none",
+    gap: "none",
+    wrap: "wrap"
+  }
+});
+function Box({
+  className,
+  spacing,
+  align,
+  justify,
+  width,
+  padding,
+  gap,
+  wrap,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV5(View2, {
+    className: cn5(boxVariants({ spacing, align, justify, width, padding, gap, wrap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function HStack({
+  className,
+  spacing,
+  align,
+  justify,
+  width,
+  padding,
+  gap,
+  wrap,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV5(View2, {
+    className: cn5(hStackVariants({ spacing, align, justify, width, padding, gap, wrap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function VStack({
+  className,
+  spacing,
+  align,
+  justify,
+  width,
+  padding,
+  gap,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV5(View2, {
+    className: cn5(vStackVariants({ spacing, align, justify, width, padding, gap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/atoms/FilterSelect/FilterSelect.tsx
+import { View as View3 } from "react-native";
+import { jsxDEV as jsxDEV6 } from "react/jsx-dev-runtime";
+var FilterSelect = ({
+  value,
+  options,
+  onChange,
+  placeholder = "S\xE9lectionner...",
+  label,
+  disabled = false,
+  className = "",
+  showCounts = false
+}) => {
+  return /* @__PURE__ */ jsxDEV6(HStack, {
+    className: `space-y-2 ${className}`,
+    children: [
+      label && /* @__PURE__ */ jsxDEV6(Label2, {
+        className: "text-foreground text-base font-medium",
+        children: label
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV6(Select, {
+        value,
+        onValueChange: onChange,
+        disabled,
+        children: [
+          /* @__PURE__ */ jsxDEV6(SelectTrigger, {
+            className: "w-full",
+            children: /* @__PURE__ */ jsxDEV6(SelectValue, {
+              placeholder
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV6(SelectContent, {
+            className: "bg-background",
+            children: [
+              /* @__PURE__ */ jsxDEV6(SelectItem, {
+                value: "all",
+                label: "Tous",
+                children: [
+                  /* @__PURE__ */ jsxDEV6(Text2, {
+                    children: "Tous"
+                  }, undefined, false, undefined, this),
+                  showCounts && /* @__PURE__ */ jsxDEV6(View3, {
+                    className: "text-muted-foreground ml-2 text-sm",
+                    children: [
+                      "(",
+                      options.reduce((sum, option) => sum + (option.count || 0), 0),
+                      ")"
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this),
+              options.map((option) => /* @__PURE__ */ jsxDEV6(SelectItem, {
+                value: option.value,
+                label: option.label,
+                children: /* @__PURE__ */ jsxDEV6(HStack, {
+                  className: "flex w-full items-center justify-between",
+                  children: [
+                    /* @__PURE__ */ jsxDEV6(Text2, {
+                      children: option.label
+                    }, undefined, false, undefined, this),
+                    showCounts && option.count !== undefined && /* @__PURE__ */ jsxDEV6(Text2, {
+                      className: "text-muted-foreground ml-2 text-sm",
+                      children: [
+                        "(",
+                        option.count,
+                        ")"
+                      ]
+                    }, undefined, true, undefined, this)
+                  ]
+                }, undefined, true, undefined, this)
+              }, option.value, false, undefined, this))
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+// ui/atoms/Pagination/Pagination.tsx
+import {
+  ChevronLeft,
+  ChevronRight,
+  ChevronsLeft,
+  ChevronsRight
+} from "lucide-react";
+import { View as View4 } from "react-native";
+import { jsxDEV as jsxDEV7 } from "react/jsx-dev-runtime";
+var Pagination = ({
+  currentPage,
+  totalPages,
+  totalItems,
+  itemsPerPage,
+  onPageChange,
+  onItemsPerPageChange,
+  disabled = false,
+  className = "",
+  showItemsPerPage = true,
+  itemsPerPageOptions = [10, 25, 50, 100]
+}) => {
+  const startItem = (currentPage - 1) * itemsPerPage + 1;
+  const endItem = Math.min(currentPage * itemsPerPage, totalItems);
+  const canGoPrevious = currentPage > 1 && !disabled;
+  const canGoNext = currentPage < totalPages && !disabled;
+  const getVisiblePageNumbers = () => {
+    if (totalPages <= 7) {
+      return Array.from({ length: totalPages }, (_, i) => i + 1);
+    }
+    if (currentPage <= 3) {
+      return [1, 2, 3, 4, 5, -1, totalPages];
+    }
+    if (currentPage >= totalPages - 2) {
+      return [
+        1,
+        -1,
+        totalPages - 4,
+        totalPages - 3,
+        totalPages - 2,
+        totalPages - 1,
+        totalPages
+      ];
+    }
+    return [
+      1,
+      -1,
+      currentPage - 1,
+      currentPage,
+      currentPage + 1,
+      -1,
+      totalPages
+    ];
+  };
+  if (totalPages === 0)
+    return null;
+  return /* @__PURE__ */ jsxDEV7(View4, {
+    className: `flex flex-col items-center justify-between gap-4 sm:flex-row ${className}`,
+    children: [
+      /* @__PURE__ */ jsxDEV7(View4, {
+        className: "text-muted-foreground order-2 text-base sm:order-1",
+        children: [
+          "Affichage de ",
+          startItem,
+          " \xE0 ",
+          endItem,
+          " sur ",
+          totalItems,
+          " r\xE9sultats"
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV7(View4, {
+        className: "order-1 flex items-center gap-2 sm:order-2",
+        children: [
+          /* @__PURE__ */ jsxDEV7(Button, {
+            variant: "outline",
+            size: "sm",
+            onPress: () => onPageChange(1),
+            disabled: !canGoPrevious,
+            className: "hidden h-8 w-8 p-0 sm:flex",
+            children: [
+              /* @__PURE__ */ jsxDEV7(ChevronsLeft, {
+                className: "h-4 w-4"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV7(Text2, {
+                className: "sr-only",
+                children: "Premi\xE8re page"
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV7(Button, {
+            variant: "outline",
+            size: "sm",
+            onPress: () => onPageChange(currentPage - 1),
+            disabled: !canGoPrevious,
+            className: "h-8 w-8 p-0",
+            children: [
+              /* @__PURE__ */ jsxDEV7(ChevronLeft, {
+                className: "h-4 w-4"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV7(Text2, {
+                className: "sr-only",
+                children: "Page pr\xE9c\xE9dente"
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV7(View4, {
+            className: "flex items-center gap-1",
+            children: getVisiblePageNumbers().map((page, index) => {
+              if (page === -1) {
+                return /* @__PURE__ */ jsxDEV7(View4, {
+                  className: "text-muted-foreground px-2 py-1",
+                  children: "..."
+                }, `ellipsis-${index}`, false, undefined, this);
+              }
+              return /* @__PURE__ */ jsxDEV7(Button, {
+                variant: page === currentPage ? "default" : "outline",
+                size: "sm",
+                onPress: () => onPageChange(page),
+                disabled,
+                className: "h-8 min-w-8 px-2",
+                children: /* @__PURE__ */ jsxDEV7(Text2, {
+                  children: page
+                }, undefined, false, undefined, this)
+              }, page, false, undefined, this);
+            })
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV7(Button, {
+            variant: "outline",
+            size: "sm",
+            onPress: () => onPageChange(currentPage + 1),
+            disabled: !canGoNext,
+            className: "h-8 w-8 p-0",
+            children: [
+              /* @__PURE__ */ jsxDEV7(ChevronRight, {
+                className: "h-4 w-4"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV7(Text2, {
+                className: "sr-only",
+                children: "Page suivante"
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV7(Button, {
+            variant: "outline",
+            size: "sm",
+            onPress: () => onPageChange(totalPages),
+            disabled: !canGoNext,
+            className: "hidden h-8 w-8 p-0 sm:flex",
+            children: [
+              /* @__PURE__ */ jsxDEV7(ChevronsRight, {
+                className: "h-4 w-4"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV7(Text2, {
+                className: "sr-only",
+                children: "Derni\xE8re page"
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      showItemsPerPage && onItemsPerPageChange && /* @__PURE__ */ jsxDEV7(View4, {
+        className: "order-3 flex items-center gap-2 text-base",
+        children: [
+          /* @__PURE__ */ jsxDEV7(Text2, {
+            className: "text-muted-foreground",
+            children: "Afficher:"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV7(Select, {
+            value: {
+              value: itemsPerPage.toString(),
+              label: itemsPerPage.toString()
+            },
+            onValueChange: (value) => onItemsPerPageChange(parseInt(value?.value || "")),
+            disabled,
+            children: [
+              /* @__PURE__ */ jsxDEV7(SelectTrigger, {
+                className: "h-8 w-16",
+                children: /* @__PURE__ */ jsxDEV7(SelectValue, {
+                  placeholder: "Afficher:"
+                }, undefined, false, undefined, this)
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV7(SelectContent, {
+                className: "bg-background",
+                children: itemsPerPageOptions.map((option) => /* @__PURE__ */ jsxDEV7(SelectItem, {
+                  value: option.toString(),
+                  label: option.toString(),
+                  children: option
+                }, option, false, undefined, this))
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+// ui/input.tsx
+import { TextInput } from "react-native";
+import { cn as cn6 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV8 } from "react/jsx-dev-runtime";
+function Input({
+  className,
+  placeholderClassName,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV8(TextInput, {
+    className: cn6("native:h-12 native:text-lg native:leading-tight border-input bg-background text-foreground placeholder:text-muted-foreground web:flex web:w-full web:py-2 web:ring-offset-background web:focus-visible:outline-hidden web:focus-visible:ring-2 web:focus-visible:ring-ring web:focus-visible:ring-offset-2 h-10 rounded-md border px-3 text-base file:border-0 file:bg-transparent file:font-medium lg:text-sm", props.editable === false && "web:cursor-not-allowed opacity-50", className),
+    placeholderClassName: cn6("text-muted-foreground", placeholderClassName),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/atoms/SearchInput/SearchInput.tsx
+import { Search, X } from "lucide-react";
+import { View as View5 } from "react-native";
+import { jsxDEV as jsxDEV9 } from "react/jsx-dev-runtime";
+var SearchInput = ({
+  value,
+  onChange,
+  placeholder = "Rechercher...",
+  onClear,
+  disabled = false,
+  className = ""
+}) => {
+  const handleClear = () => {
+    onChange("");
+    onClear?.();
+  };
+  return /* @__PURE__ */ jsxDEV9(View5, {
+    className: `relative w-full ${className}`,
+    children: [
+      /* @__PURE__ */ jsxDEV9(View5, {
+        className: "pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3",
+        children: /* @__PURE__ */ jsxDEV9(Search, {
+          className: "text-muted-foreground h-4 w-4"
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV9(Input, {
+        value,
+        onChange: (e) => onChange(e.nativeEvent.text),
+        placeholder,
+        editable: !disabled,
+        className: "pr-10 pl-10"
+      }, undefined, false, undefined, this),
+      value && /* @__PURE__ */ jsxDEV9(View5, {
+        className: "absolute inset-y-0 right-0 flex items-center pr-3",
+        children: /* @__PURE__ */ jsxDEV9(Button, {
+          variant: "ghost",
+          size: "sm",
+          onPress: handleClear,
+          disabled,
+          className: "h-6 w-6 p-0 hover:bg-transparent",
+          children: [
+            /* @__PURE__ */ jsxDEV9(X, {
+              className: "text-muted-foreground hover:text-foreground h-4 w-4"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ jsxDEV9(Text2, {
+              className: "sr-only",
+              children: "Effacer la recherche"
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+// ui/card.tsx
+import { Text as Text4, View as View6 } from "react-native";
+import { cn as cn7 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV10 } from "react/jsx-dev-runtime";
+function Card({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV10(View6, {
+    className: cn7("border-border bg-card shadow-foreground/10 rounded-lg border shadow-2xs", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function CardHeader({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV10(View6, {
+    className: cn7("flex flex-col gap-y-1.5 p-6", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function CardTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV10(Text4, {
+    role: "heading",
+    "aria-level": 3,
+    className: cn7("text-card-foreground text-2xl leading-none font-semibold tracking-tight", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function CardDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV10(Text4, {
+    className: cn7("text-muted-foreground text-sm", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function CardContent({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV10(TextClassContext.Provider, {
+    value: "text-card-foreground",
+    children: /* @__PURE__ */ jsxDEV10(View6, {
+      className: cn7("p-6 pt-0", className),
+      ...props
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+function CardFooter({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV10(View6, {
+    className: cn7("flex flex-row items-center p-6 pt-0", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/collapsible.tsx
+import * as CollapsiblePrimitive from "@rn-primitives/collapsible";
+var Collapsible = CollapsiblePrimitive.Root;
+var CollapsibleTrigger = CollapsiblePrimitive.Trigger;
+var CollapsibleContent = CollapsiblePrimitive.Content;
+// ui/separator.tsx
+import * as SeparatorPrimitive from "@rn-primitives/separator";
+import { cn as cn8 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV11 } from "react/jsx-dev-runtime";
+function Separator2({
+  className,
+  orientation = "horizontal",
+  decorative = true,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV11(SeparatorPrimitive.Root, {
+    decorative,
+    orientation,
+    className: cn8("bg-border shrink-0", orientation === "horizontal" ? "h-px w-full" : "h-full w-px", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/molecules/SearchAndFilter/SearchAndFilter.tsx
+import { useState } from "react";
+import { ChevronDown as ChevronDown2, ChevronUp as ChevronUp2, Filter } from "lucide-react";
+import { jsxDEV as jsxDEV12 } from "react/jsx-dev-runtime";
+var SearchAndFilter = ({
+  searchValue,
+  onSearchChange,
+  searchPlaceholder,
+  filters = [],
+  isLoading = false,
+  disabled = false,
+  className = "",
+  collapsible = true,
+  defaultCollapsed = false
+}) => {
+  const [isCollapsed, setIsCollapsed] = useState(defaultCollapsed);
+  const hasFilters = filters.length > 0;
+  const activeFiltersCount = filters.filter((f) => f.value).length;
+  const shouldUseCollapsible = collapsible && hasFilters;
+  console.log("SearchAndFilter", { filters });
+  const FilterComponents = () => /* @__PURE__ */ jsxDEV12("div", {
+    className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4",
+    children: filters.map((filter) => /* @__PURE__ */ jsxDEV12(FilterSelect, {
+      value: { value: filter.value, label: filter.value },
+      options: filter.options,
+      onChange: filter.onChange,
+      label: filter.label,
+      disabled: disabled || isLoading,
+      showCounts: filter.showCounts,
+      className: "min-w-0"
+    }, filter.key, false, undefined, this))
+  }, undefined, false, undefined, this);
+  return /* @__PURE__ */ jsxDEV12("div", {
+    className: `space-y-4 ${className}`,
+    children: [
+      /* @__PURE__ */ jsxDEV12("div", {
+        className: "flex flex-col gap-4 sm:flex-row",
+        children: [
+          /* @__PURE__ */ jsxDEV12("div", {
+            className: "flex-1",
+            children: /* @__PURE__ */ jsxDEV12(SearchInput, {
+              value: searchValue,
+              onChange: onSearchChange,
+              placeholder: searchPlaceholder,
+              disabled: disabled || isLoading,
+              className: "w-full"
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          shouldUseCollapsible && /* @__PURE__ */ jsxDEV12(Collapsible, {
+            open: !isCollapsed,
+            onOpenChange: setIsCollapsed,
+            className: "sm:hidden",
+            children: [
+              /* @__PURE__ */ jsxDEV12(CollapsibleTrigger, {
+                asChild: true,
+                children: /* @__PURE__ */ jsxDEV12(Button, {
+                  variant: "outline",
+                  className: "sm:hidden",
+                  disabled: disabled || isLoading,
+                  children: [
+                    /* @__PURE__ */ jsxDEV12(Filter, {
+                      className: "mr-2 h-4 w-4"
+                    }, undefined, false, undefined, this),
+                    "Filtres",
+                    activeFiltersCount > 0 && /* @__PURE__ */ jsxDEV12("span", {
+                      className: "bg-primary text-primary-foreground ml-2 flex h-5 w-5 items-center justify-center rounded-full text-sm",
+                      children: activeFiltersCount
+                    }, undefined, false, undefined, this),
+                    isCollapsed ? /* @__PURE__ */ jsxDEV12(ChevronDown2, {
+                      className: "ml-2 h-4 w-4"
+                    }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV12(ChevronUp2, {
+                      className: "ml-2 h-4 w-4"
+                    }, undefined, false, undefined, this)
+                  ]
+                }, undefined, true, undefined, this)
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV12(CollapsibleContent, {
+                className: "mt-4 space-y-4",
+                children: /* @__PURE__ */ jsxDEV12(FilterComponents, {}, undefined, false, undefined, this)
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      hasFilters && /* @__PURE__ */ jsxDEV12("div", {
+        className: "hidden sm:block",
+        children: /* @__PURE__ */ jsxDEV12(FilterComponents, {}, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      activeFiltersCount > 0 && /* @__PURE__ */ jsxDEV12("div", {
+        className: "flex flex-wrap items-center gap-2",
+        children: [
+          /* @__PURE__ */ jsxDEV12("span", {
+            className: "text-muted-foreground text-base",
+            children: "Filtres actifs:"
+          }, undefined, false, undefined, this),
+          filters.filter((f) => f.value).map((filter) => {
+            const selectedOption = filter.options.find((opt) => opt.value === filter.value);
+            return /* @__PURE__ */ jsxDEV12(Button, {
+              variant: "secondary",
+              size: "sm",
+              onPress: () => filter.onChange(undefined),
+              disabled: disabled || isLoading,
+              className: "h-7 px-2 text-sm",
+              children: [
+                filter.label,
+                ": ",
+                selectedOption?.label,
+                /* @__PURE__ */ jsxDEV12("span", {
+                  className: "ml-1",
+                  children: "\xD7"
+                }, undefined, false, undefined, this)
+              ]
+            }, filter.key, true, undefined, this);
+          })
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+// ui/organisms/ListPage/ListPage.tsx
+import Link from "next/link";
+import { AlertTriangle, Loader2, Plus, RefreshCcw } from "lucide-react";
+import { jsxDEV as jsxDEV13, Fragment } from "react/jsx-dev-runtime";
+function ListPage({
+  title,
+  description,
+  header,
+  items,
+  totalItems,
+  totalPages,
+  isLoading,
+  isFetching,
+  error,
+  listState,
+  searchPlaceholder,
+  filters = [],
+  onRefresh,
+  primaryAction,
+  toolbar,
+  renderItem,
+  renderEmpty,
+  renderStats,
+  className = "",
+  itemClassName = ""
+}) {
+  const {
+    searchQuery,
+    setSearchQuery,
+    filters: filterValues,
+    setFilter,
+    currentPage,
+    itemsPerPage,
+    setCurrentPage,
+    setItemsPerPage
+  } = listState;
+  if (isLoading && !items.length) {
+    return /* @__PURE__ */ jsxDEV13(VStack, {
+      className: `space-y-4 md:space-y-6 ${className}`,
+      children: [
+        header ? header : /* @__PURE__ */ jsxDEV13(VStack, {
+          className: "gap-1",
+          children: [
+            /* @__PURE__ */ jsxDEV13("h1", {
+              className: "text-2xl font-bold md:text-3xl",
+              children: title
+            }, undefined, false, undefined, this),
+            description && /* @__PURE__ */ jsxDEV13("p", {
+              className: "text-muted-foreground text-base",
+              children: description
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ jsxDEV13("div", {
+          className: "flex min-h-[400px] items-center justify-center",
+          children: /* @__PURE__ */ jsxDEV13(Card, {
+            children: /* @__PURE__ */ jsxDEV13(CardContent, {
+              className: "flex items-center gap-4 p-6",
+              children: [
+                /* @__PURE__ */ jsxDEV13(Loader2, {
+                  className: "text-primary h-8 w-8 animate-spin"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ jsxDEV13("div", {
+                  children: [
+                    /* @__PURE__ */ jsxDEV13("h3", {
+                      className: "font-medium",
+                      children: "Chargement..."
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ jsxDEV13("p", {
+                      className: "text-muted-foreground text-base",
+                      children: "R\xE9cup\xE9ration des donn\xE9es en cours"
+                    }, undefined, false, undefined, this)
+                  ]
+                }, undefined, true, undefined, this)
+              ]
+            }, undefined, true, undefined, this)
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  if (error && !items.length) {
+    return /* @__PURE__ */ jsxDEV13(VStack, {
+      className: `space-y-4 md:space-y-6 ${className}`,
+      children: [
+        header ? header : /* @__PURE__ */ jsxDEV13(VStack, {
+          className: "gap-1",
+          children: [
+            /* @__PURE__ */ jsxDEV13("h1", {
+              className: "text-2xl font-bold md:text-3xl",
+              children: title
+            }, undefined, false, undefined, this),
+            description && /* @__PURE__ */ jsxDEV13("p", {
+              className: "text-muted-foreground text-base",
+              children: description
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ jsxDEV13("div", {
+          className: "flex min-h-[400px] items-center justify-center",
+          children: /* @__PURE__ */ jsxDEV13(Card, {
+            children: /* @__PURE__ */ jsxDEV13(CardContent, {
+              className: "flex flex-col items-center gap-4 p-6 text-center",
+              children: [
+                /* @__PURE__ */ jsxDEV13(AlertTriangle, {
+                  className: "text-destructive h-12 w-12"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ jsxDEV13("div", {
+                  children: [
+                    /* @__PURE__ */ jsxDEV13("h3", {
+                      className: "font-medium",
+                      children: "Erreur de chargement"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ jsxDEV13("p", {
+                      className: "text-muted-foreground text-base",
+                      children: error.message || "Une erreur est survenue"
+                    }, undefined, false, undefined, this)
+                  ]
+                }, undefined, true, undefined, this),
+                onRefresh && /* @__PURE__ */ jsxDEV13(Button, {
+                  onPress: onRefresh,
+                  variant: "outline",
+                  size: "sm",
+                  children: [
+                    /* @__PURE__ */ jsxDEV13(RefreshCcw, {
+                      className: "mr-2 h-4 w-4"
+                    }, undefined, false, undefined, this),
+                    "R\xE9essayer"
+                  ]
+                }, undefined, true, undefined, this)
+              ]
+            }, undefined, true, undefined, this)
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  const filterConfigs = filters.map((filter) => ({
+    key: filter.key,
+    label: filter.label,
+    value: filterValues[filter.key] || "",
+    options: filter.options,
+    onChange: (value) => {
+      setFilter(filter.key, value?.value || "");
+    },
+    showCounts: filter.showCounts
+  }));
+  return /* @__PURE__ */ jsxDEV13(VStack, {
+    className: `space-y-4 md:space-y-6 ${className}`,
+    children: [
+      header ? header : /* @__PURE__ */ jsxDEV13(HStack, {
+        className: "items-center justify-between",
+        children: [
+          /* @__PURE__ */ jsxDEV13(VStack, {
+            className: "gap-1",
+            children: [
+              /* @__PURE__ */ jsxDEV13("h1", {
+                className: "text-2xl font-bold md:text-3xl",
+                children: title
+              }, undefined, false, undefined, this),
+              description && /* @__PURE__ */ jsxDEV13("p", {
+                className: "text-muted-foreground text-base",
+                children: description
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV13(HStack, {
+            className: "items-center gap-4",
+            children: [
+              toolbar,
+              (isLoading || isFetching) && /* @__PURE__ */ jsxDEV13("div", {
+                className: "text-muted-foreground flex items-center gap-2 text-base",
+                children: [
+                  /* @__PURE__ */ jsxDEV13(Loader2, {
+                    className: "h-4 w-4 animate-spin"
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ jsxDEV13("span", {
+                    className: "hidden sm:inline",
+                    children: "Mise \xE0 jour..."
+                  }, undefined, false, undefined, this)
+                ]
+              }, undefined, true, undefined, this),
+              onRefresh && /* @__PURE__ */ jsxDEV13(Button, {
+                variant: "outline",
+                size: "sm",
+                onPress: onRefresh,
+                disabled: Boolean(isLoading),
+                "aria-label": "Rafra\xEEchir",
+                children: [
+                  /* @__PURE__ */ jsxDEV13(RefreshCcw, {
+                    className: `mr-2 h-4 w-4 ${isLoading || isFetching ? "animate-spin" : ""}`
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ jsxDEV13("span", {
+                    className: "hidden sm:inline",
+                    children: "Rafra\xEEchir"
+                  }, undefined, false, undefined, this)
+                ]
+              }, undefined, true, undefined, this),
+              primaryAction && /* @__PURE__ */ jsxDEV13(Fragment, {
+                children: primaryAction.href ? /* @__PURE__ */ jsxDEV13(Link, {
+                  href: primaryAction.href,
+                  children: /* @__PURE__ */ jsxDEV13(Button, {
+                    children: [
+                      primaryAction.icon || /* @__PURE__ */ jsxDEV13(Plus, {
+                        className: "mr-2 h-4 w-4"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV13("span", {
+                        className: "hidden sm:inline",
+                        children: primaryAction.label
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV13("span", {
+                        className: "sm:hidden",
+                        children: "Nouveau"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV13(Button, {
+                  onPress: primaryAction.onClick,
+                  children: [
+                    primaryAction.icon || /* @__PURE__ */ jsxDEV13(Plus, {
+                      className: "mr-2 h-4 w-4"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ jsxDEV13("span", {
+                      className: "hidden sm:inline",
+                      children: primaryAction.label
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ jsxDEV13("span", {
+                      className: "sm:hidden",
+                      children: "Nouveau"
+                    }, undefined, false, undefined, this)
+                  ]
+                }, undefined, true, undefined, this)
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      renderStats && /* @__PURE__ */ jsxDEV13(Fragment, {
+        children: [
+          renderStats(items),
+          /* @__PURE__ */ jsxDEV13(Separator2, {}, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV13(SearchAndFilter, {
+        searchValue: searchQuery,
+        onSearchChange: setSearchQuery,
+        searchPlaceholder,
+        filters: filterConfigs,
+        isLoading
+      }, undefined, false, undefined, this),
+      items.length === 0 && !isLoading ? renderEmpty ? renderEmpty() : /* @__PURE__ */ jsxDEV13(Card, {
+        children: /* @__PURE__ */ jsxDEV13(CardContent, {
+          className: "flex flex-col items-center gap-4 p-8 text-center",
+          children: [
+            /* @__PURE__ */ jsxDEV13("div", {
+              className: "bg-muted flex h-12 w-12 items-center justify-center rounded-full",
+              children: /* @__PURE__ */ jsxDEV13("div", {
+                className: "bg-muted-foreground/20 h-6 w-6 rounded-full"
+              }, undefined, false, undefined, this)
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ jsxDEV13("div", {
+              children: [
+                /* @__PURE__ */ jsxDEV13("h3", {
+                  className: "font-medium",
+                  children: "Aucun \xE9l\xE9ment trouv\xE9"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ jsxDEV13("p", {
+                  className: "text-muted-foreground text-base",
+                  children: searchQuery || Object.values(filterValues).some((v) => v) ? "Essayez de modifier vos crit\xE8res de recherche" : "Commencez par cr\xE9er votre premier \xE9l\xE9ment"
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            primaryAction && !searchQuery && !Object.values(filterValues).some((v) => v) && /* @__PURE__ */ jsxDEV13(Fragment, {
+              children: primaryAction.href ? /* @__PURE__ */ jsxDEV13(Link, {
+                href: primaryAction.href,
+                children: /* @__PURE__ */ jsxDEV13(Button, {
+                  children: [
+                    primaryAction.icon || /* @__PURE__ */ jsxDEV13(Plus, {
+                      className: "mr-2 h-4 w-4"
+                    }, undefined, false, undefined, this),
+                    primaryAction.label
+                  ]
+                }, undefined, true, undefined, this)
+              }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV13(Button, {
+                onPress: primaryAction.onClick,
+                children: [
+                  primaryAction.icon || /* @__PURE__ */ jsxDEV13(Plus, {
+                    className: "mr-2 h-4 w-4"
+                  }, undefined, false, undefined, this),
+                  primaryAction.label
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV13(Fragment, {
+        children: [
+          /* @__PURE__ */ jsxDEV13("div", {
+            className: `space-y-4 ${itemClassName}`,
+            children: items.map((item, index) => renderItem(item, index))
+          }, undefined, false, undefined, this),
+          totalPages > 1 && /* @__PURE__ */ jsxDEV13(Pagination, {
+            currentPage,
+            totalPages,
+            totalItems,
+            itemsPerPage,
+            onPageChange: setCurrentPage,
+            onItemsPerPageChange: setItemsPerPage,
+            disabled: isLoading
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+export {
+  ListPage
+};