@lssm/lib.ui-kit-web 0.0.0-canary-20251120170226

package/dist/ui/marketing/PricingTable.js

@@ -0,0 +1,60 @@
+import { cn } from "../utils.js";
+import { Button } from "../button.js";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region ui/marketing/PricingTable.tsx
+function PricingTable({ tiers, className }) {
+	return /* @__PURE__ */ jsxs("section", {
+		className: cn("mx-auto max-w-6xl py-12", className),
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "grid grid-cols-1 gap-6 md:grid-cols-3",
+			children: tiers.map((t, idx) => /* @__PURE__ */ jsxs("div", {
+				className: cn("flex flex-col rounded-lg border p-6", t.highlighted && "border-primary shadow-lg"),
+				children: [
+					/* @__PURE__ */ jsx("div", {
+						className: "text-muted-foreground mb-2 text-base font-medium",
+						children: t.name
+					}),
+					/* @__PURE__ */ jsx("div", {
+						className: "text-3xl font-semibold",
+						children: t.price
+					}),
+					t.tagline && /* @__PURE__ */ jsx("div", {
+						className: "text-muted-foreground mt-1 text-base",
+						children: t.tagline
+					}),
+					/* @__PURE__ */ jsx("ul", {
+						className: "mt-4 space-y-2 text-base",
+						children: t.features.map((f, i) => /* @__PURE__ */ jsxs("li", {
+							className: "flex items-start gap-2",
+							children: [/* @__PURE__ */ jsx("span", { className: "bg-primary mt-1 h-1.5 w-1.5 rounded-full" }), /* @__PURE__ */ jsx("span", { children: f })]
+						}, i))
+					}),
+					t.cta && /* @__PURE__ */ jsx("div", {
+						className: "mt-6",
+						children: t.cta.href ? /* @__PURE__ */ jsx(Button, {
+							asChild: true,
+							className: "w-full",
+							children: /* @__PURE__ */ jsx("a", {
+								href: t.cta.href,
+								children: t.cta.label
+							})
+						}) : /* @__PURE__ */ jsx(Button, {
+							className: "w-full",
+							onClick: t.cta.onClick,
+							children: t.cta.label
+						})
+					})
+				]
+			}, idx))
+		}), /* @__PURE__ */ jsx("p", {
+			className: "text-muted-foreground mt-6 text-center text-base",
+			children: "Usage-based tiers inspired by generous free allowances and per-unit pricing."
+		})]
+	});
+}
+
+//#endregion
+export { PricingTable };
+//# sourceMappingURL=PricingTable.js.map

package/dist/ui/marketing/PricingTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PricingTable.js","names":[],"sources":["../../../ui/marketing/PricingTable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Button } from '../button';\nimport { cn } from '../utils';\n\nexport interface PricingTier {\n  name: string;\n  price: string;\n  tagline?: string;\n  features: string[];\n  cta?: { label: string; href?: string; onClick?: () => void };\n  highlighted?: boolean;\n}\n\nexport function PricingTable({\n  tiers,\n  className,\n}: {\n  tiers: PricingTier[];\n  className?: string;\n}) {\n  return (\n    <section className={cn('mx-auto max-w-6xl py-12', className)}>\n      <div className=\"grid grid-cols-1 gap-6 md:grid-cols-3\">\n        {tiers.map((t, idx) => (\n          <div\n            key={idx}\n            className={cn(\n              'flex flex-col rounded-lg border p-6',\n              t.highlighted && 'border-primary shadow-lg'\n            )}\n          >\n            <div className=\"text-muted-foreground mb-2 text-base font-medium\">\n              {t.name}\n            </div>\n            <div className=\"text-3xl font-semibold\">{t.price}</div>\n            {t.tagline && (\n              <div className=\"text-muted-foreground mt-1 text-base\">\n                {t.tagline}\n              </div>\n            )}\n            <ul className=\"mt-4 space-y-2 text-base\">\n              {t.features.map((f, i) => (\n                <li key={i} className=\"flex items-start gap-2\">\n                  <span className=\"bg-primary mt-1 h-1.5 w-1.5 rounded-full\" />\n                  <span>{f}</span>\n                </li>\n              ))}\n            </ul>\n            {t.cta && (\n              <div className=\"mt-6\">\n                {t.cta.href ? (\n                  <Button asChild className=\"w-full\">\n                    {}\n                    <a href={t.cta.href}>{t.cta.label}</a>\n                  </Button>\n                ) : (\n                  <Button className=\"w-full\" onClick={t.cta.onClick}>\n                    {t.cta.label}\n                  </Button>\n                )}\n              </div>\n            )}\n          </div>\n        ))}\n      </div>\n      <p className=\"text-muted-foreground mt-6 text-center text-base\">\n        Usage-based tiers inspired by generous free allowances and per-unit\n        pricing.\n      </p>\n    </section>\n  );\n}\n"],"mappings":";;;;;;AAaA,SAAgB,aAAa,EAC3B,OACA,aAIC;AACD,QACE,qBAAC;EAAQ,WAAW,GAAG,2BAA2B,UAAU;aAC1D,oBAAC;GAAI,WAAU;aACZ,MAAM,KAAK,GAAG,QACb,qBAAC;IAEC,WAAW,GACT,uCACA,EAAE,eAAe,2BAClB;;KAED,oBAAC;MAAI,WAAU;gBACZ,EAAE;OACC;KACN,oBAAC;MAAI,WAAU;gBAA0B,EAAE;OAAY;KACtD,EAAE,WACD,oBAAC;MAAI,WAAU;gBACZ,EAAE;OACC;KAER,oBAAC;MAAG,WAAU;gBACX,EAAE,SAAS,KAAK,GAAG,MAClB,qBAAC;OAAW,WAAU;kBACpB,oBAAC,UAAK,WAAU,6CAA6C,EAC7D,oBAAC,oBAAM,IAAS;SAFT,EAGJ,CACL;OACC;KACJ,EAAE,OACD,oBAAC;MAAI,WAAU;gBACZ,EAAE,IAAI,OACL,oBAAC;OAAO;OAAQ,WAAU;iBAExB,oBAAC;QAAE,MAAM,EAAE,IAAI;kBAAO,EAAE,IAAI;SAAU;QAC/B,GAET,oBAAC;OAAO,WAAU;OAAS,SAAS,EAAE,IAAI;iBACvC,EAAE,IAAI;QACA;OAEP;;MAnCH,IAqCD,CACN;IACE,EACN,oBAAC;GAAE,WAAU;aAAmD;IAG5D;GACI"}

package/dist/ui/marketing/index.d.ts

@@ -0,0 +1,4 @@
+import { FeatureGrid, FeatureItem } from "./FeatureGrid.js";
+import { Hero } from "./Hero.js";
+import { PricingTable, PricingTier } from "./PricingTable.js";
+export { FeatureGrid, type FeatureItem, Hero, PricingTable, type PricingTier };

package/dist/ui/marketing/index.js

@@ -0,0 +1,5 @@
+import { FeatureGrid } from "./FeatureGrid.js";
+import { Hero } from "./Hero.js";
+import { PricingTable } from "./PricingTable.js";
+
+export { FeatureGrid, Hero, PricingTable };

package/dist/ui/menubar.d.ts

@@ -0,0 +1,85 @@
+import * as React$1 from "react";
+import * as react_jsx_runtime76 from "react/jsx-runtime";
+import * as MenubarPrimitive from "@radix-ui/react-menubar";
+
+//#region ui/menubar.d.ts
+declare function Menubar({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.Root>): react_jsx_runtime76.JSX.Element;
+declare function MenubarMenu({
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.Menu>): react_jsx_runtime76.JSX.Element;
+declare function MenubarGroup({
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.Group>): react_jsx_runtime76.JSX.Element;
+declare function MenubarPortal({
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.Portal>): react_jsx_runtime76.JSX.Element;
+declare function MenubarRadioGroup({
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.RadioGroup>): react_jsx_runtime76.JSX.Element;
+declare function MenubarTrigger({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.Trigger>): react_jsx_runtime76.JSX.Element;
+declare function MenubarContent({
+  className,
+  align,
+  alignOffset,
+  sideOffset,
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.Content>): react_jsx_runtime76.JSX.Element;
+declare function MenubarItem({
+  className,
+  inset,
+  variant,
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.Item> & {
+  inset?: boolean;
+  variant?: 'default' | 'destructive';
+}): react_jsx_runtime76.JSX.Element;
+declare function MenubarCheckboxItem({
+  className,
+  children,
+  checked,
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.CheckboxItem>): react_jsx_runtime76.JSX.Element;
+declare function MenubarRadioItem({
+  className,
+  children,
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.RadioItem>): react_jsx_runtime76.JSX.Element;
+declare function MenubarLabel({
+  className,
+  inset,
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.Label> & {
+  inset?: boolean;
+}): react_jsx_runtime76.JSX.Element;
+declare function MenubarSeparator({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.Separator>): react_jsx_runtime76.JSX.Element;
+declare function MenubarShortcut({
+  className,
+  ...props
+}: React$1.ComponentProps<'span'>): react_jsx_runtime76.JSX.Element;
+declare function MenubarSub({
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.Sub>): react_jsx_runtime76.JSX.Element;
+declare function MenubarSubTrigger({
+  className,
+  inset,
+  children,
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.SubTrigger> & {
+  inset?: boolean;
+}): react_jsx_runtime76.JSX.Element;
+declare function MenubarSubContent({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof MenubarPrimitive.SubContent>): react_jsx_runtime76.JSX.Element;
+//#endregion
+export { Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger };
+//# sourceMappingURL=menubar.d.ts.map

package/dist/ui/menubar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menubar.d.ts","names":[],"sources":["../../ui/menubar.tsx"],"sourcesContent":[],"mappings":";;;;;iBAQS,OAAA;;;GAGN,OAAA,CAAM,sBAAsB,gBAAA,CAAiB,QAAK,mBAAA,CAAA,GAAA,CAAA;iBAa5C,WAAA;;GAEN,OAAA,CAAM,sBAAsB,gBAAA,CAAiB,QAAK,mBAAA,CAAA,GAAA,CAAA;iBAI5C,YAAA;;GAEN,OAAA,CAAM,sBAAsB,gBAAA,CAAiB,SAAM,mBAAA,CAAA,GAAA,CAAA;AA7BM,iBAiCnD,aAAA,CA5BO;EAAA,GAAA;AAAA,CAAA,EA8Bb,OAAA,CAAM,cA9BO,CAAA,OA8Be,gBAAA,CAAiB,MA9BhC,CAAA,CAAA,EA8BuC,mBAAA,CAAA,GAAA,CAAA,OA9BvC;iBAkCP,iBAAA,CAjCP;EAAA,GAAA;AAAA,CAAA,EAmCC,OAAA,CAAM,cAnCP,CAAA,OAmC6B,gBAAA,CAAiB,UAnC9C,CAAA,CAAA,EAmCyD,mBAAA,CAAA,GAAA,CAAA,OAnCzD;iBAyCO,cAAA,CAvCuC;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA0C7C,OAAA,CAAM,cA1CuC,CAAA,OA0CjB,gBAAA,CAAiB,OA1CA,CAAA,CAAA,EA0CQ,mBAAA,CAAA,GAAA,CAAA,OA1CR;iBAuDvC,cAAA,CAvDA;EAAA,SAAA;EAAA,KAAA;EAAA,WAAA;EAAA,UAAA;EAAA,GAAA;AAAA,CAAA,EA6DN,OAAA,CAAM,cA7DA,CAAA,OA6DsB,gBAAA,CAAiB,OA7DvC,CAAA,CAAA,EA6D+C,mBAAA,CAAA,GAAA,CAAA,OA7D/C;iBA+EA,WAAA,CA/E4C;EAAA,SAAA;EAAA,KAAA;EAAA,OAAA;EAAA,GAAA;CAAA,EAoFlD,OAAA,CAAM,cApF4C,CAAA,OAoFtB,gBAAA,CAAiB,IApFK,CAAA,GAAA;EAAA,KAAA,CAAA,EAAA,OAAA;EAa5C,OAAA,CAAA,EAAA,SAAW,GAAA,aAAA;CAEW,CAAA,EAwE9B,mBAAA,CAAA,GAAA,CAAA,OAxE+C;iBAuFvC,mBAAA,CAvFA;EAAA,SAAA;EAAA,QAAA;EAAA,OAAA;EAAA,GAAA;AAAA,CAAA,EA4FN,OAAA,CAAM,cA5FA,CAAA,OA4FsB,gBAAA,CAAiB,YA5FvC,CAAA,CAAA,EA4FoD,mBAAA,CAAA,GAAA,CAAA,OA5FpD;iBAiHA,gBAAA,CAjH4C;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAqHlD,OAAA,CAAM,cArH4C,CAAA,OAqHtB,gBAAA,CAAiB,SArHK,CAAA,CAAA,EAqHK,mBAAA,CAAA,GAAA,CAAA,OArHL;iBAyI5C,YAAA,CAzI4C;EAAA,SAAA;EAAA,KAAA;EAAA,GAAA;CAAA,EA6IlD,OAAA,CAAM,cA7I4C,CAAA,OA6ItB,gBAAA,CAAiB,KA7IK,CAAA,GAAA;EAI5C,KAAA,CAAA,EAAA,OAAY;CAEU,CAAA,EAyI9B,mBAAA,CAAA,GAAA,CAAA,OAzI+C;iBAuJvC,gBAAA,CAvJA;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA0JN,OAAA,CAAM,cA1JA,CAAA,OA0JsB,gBAAA,CAAiB,SA1JvC,CAAA,CAAA,EA0JiD,mBAAA,CAAA,GAAA,CAAA,OA1JjD;iBAoKA,eAAA,CApK6C;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAuKnD,OAAA,CAAM,cAvK6C,CAAA,MAAA,CAAA,CAAA,EAuKvB,mBAAA,CAAA,GAAA,CAAA,OAvKuB;iBAoL7C,UAAA,CApL6C;EAAA,GAAA;AAAA,CAAA,EAsLnD,OAAA,CAAM,cAtL6C,CAAA,OAsLvB,gBAAA,CAAiB,GAtLM,CAAA,CAAA,EAsLF,mBAAA,CAAA,GAAA,CAAA,OAtLE;AAAA,iBA0L7C,iBAAA,CAtLa;EAAA,SAAA;EAAA,KAAA;EAAA,QAAA;EAAA,GAAA;CAAA,EA2LnB,OAAA,CAAM,cA3La,CAAA,OA2LS,gBAAA,CAAiB,UA3L1B,CAAA,GAAA;EAES,KAAA,CAAA,EAAA,OAAiB;CAA7C,CAAA,EA2LF,mBAAA,CAAA,GAAA,CAAA,OA3LQ;iBA4MA,iBAAA,CA5M8C;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA+MpD,OAAA,CAAM,cA/M8C,CAAA,OA+MxB,gBAAA,CAAiB,UA/MO,CAAA,CAAA,EA+MI,mBAAA,CAAA,GAAA,CAAA,OA/MJ"}

package/dist/ui/menubar.js

@@ -0,0 +1,138 @@
+'use client';
+
+
+import { cn } from "./utils.js";
+import "react";
+import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as MenubarPrimitive from "@radix-ui/react-menubar";
+
+//#region ui/menubar.tsx
+function Menubar({ className,...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.Root, {
+		"data-slot": "menubar",
+		className: cn("bg-background flex h-9 items-center gap-1 rounded-md border p-1 shadow-2xs", className),
+		...props
+	});
+}
+function MenubarMenu({ ...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.Menu, {
+		"data-slot": "menubar-menu",
+		...props
+	});
+}
+function MenubarGroup({ ...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.Group, {
+		"data-slot": "menubar-group",
+		...props
+	});
+}
+function MenubarPortal({ ...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.Portal, {
+		"data-slot": "menubar-portal",
+		...props
+	});
+}
+function MenubarRadioGroup({ ...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.RadioGroup, {
+		"data-slot": "menubar-radio-group",
+		...props
+	});
+}
+function MenubarTrigger({ className,...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.Trigger, {
+		"data-slot": "menubar-trigger",
+		className: cn("focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex items-center rounded-xs px-2 py-1 text-sm font-medium outline-hidden select-none", className),
+		...props
+	});
+}
+function MenubarContent({ className, align = "start", alignOffset = -4, sideOffset = 8,...props }) {
+	return /* @__PURE__ */ jsx(MenubarPortal, { children: /* @__PURE__ */ jsx(MenubarPrimitive.Content, {
+		"data-slot": "menubar-content",
+		align,
+		alignOffset,
+		sideOffset,
+		className: cn("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-48 origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-md", className),
+		...props
+	}) });
+}
+function MenubarItem({ className, inset, variant = "default",...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.Item, {
+		"data-slot": "menubar-item",
+		"data-inset": inset,
+		"data-variant": variant,
+		className: cn("data-[variant=destructive]:*:[svg]:text-destructive! focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-xs px-2 py-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+		...props
+	});
+}
+function MenubarCheckboxItem({ className, children, checked,...props }) {
+	return /* @__PURE__ */ jsxs(MenubarPrimitive.CheckboxItem, {
+		"data-slot": "menubar-checkbox-item",
+		className: cn("focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+		checked,
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center",
+			children: /* @__PURE__ */ jsx(MenubarPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { className: "size-4" }) })
+		}), children]
+	});
+}
+function MenubarRadioItem({ className, children,...props }) {
+	return /* @__PURE__ */ jsxs(MenubarPrimitive.RadioItem, {
+		"data-slot": "menubar-radio-item",
+		className: cn("focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center",
+			children: /* @__PURE__ */ jsx(MenubarPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CircleIcon, { className: "size-2 fill-current" }) })
+		}), children]
+	});
+}
+function MenubarLabel({ className, inset,...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.Label, {
+		"data-slot": "menubar-label",
+		"data-inset": inset,
+		className: cn("px-2 py-1.5 text-sm font-medium data-inset:pl-8", className),
+		...props
+	});
+}
+function MenubarSeparator({ className,...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.Separator, {
+		"data-slot": "menubar-separator",
+		className: cn("bg-border -mx-1 my-1 h-px", className),
+		...props
+	});
+}
+function MenubarShortcut({ className,...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "menubar-shortcut",
+		className: cn("text-muted-foreground ml-auto text-xs tracking-widest", className),
+		...props
+	});
+}
+function MenubarSub({ ...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.Sub, {
+		"data-slot": "menubar-sub",
+		...props
+	});
+}
+function MenubarSubTrigger({ className, inset, children,...props }) {
+	return /* @__PURE__ */ jsxs(MenubarPrimitive.SubTrigger, {
+		"data-slot": "menubar-sub-trigger",
+		"data-inset": inset,
+		className: cn("focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-xs px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8", className),
+		...props,
+		children: [children, /* @__PURE__ */ jsx(ChevronRightIcon, { className: "ml-auto h-4 w-4" })]
+	});
+}
+function MenubarSubContent({ className,...props }) {
+	return /* @__PURE__ */ jsx(MenubarPrimitive.SubContent, {
+		"data-slot": "menubar-sub-content",
+		className: cn("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-32 origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg", className),
+		...props
+	});
+}
+
+//#endregion
+export { Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger };
+//# sourceMappingURL=menubar.js.map

package/dist/ui/menubar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menubar.js","names":[],"sources":["../../ui/menubar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport * as MenubarPrimitive from '@radix-ui/react-menubar';\nimport { CheckIcon, ChevronRightIcon, CircleIcon } from 'lucide-react';\n\nimport { cn } from './utils';\n\nfunction Menubar({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Root>) {\n  return (\n    <MenubarPrimitive.Root\n      data-slot=\"menubar\"\n      className={cn(\n        'bg-background flex h-9 items-center gap-1 rounded-md border p-1 shadow-2xs',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction MenubarMenu({\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Menu>) {\n  return <MenubarPrimitive.Menu data-slot=\"menubar-menu\" {...props} />;\n}\n\nfunction MenubarGroup({\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Group>) {\n  return <MenubarPrimitive.Group data-slot=\"menubar-group\" {...props} />;\n}\n\nfunction MenubarPortal({\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Portal>) {\n  return <MenubarPrimitive.Portal data-slot=\"menubar-portal\" {...props} />;\n}\n\nfunction MenubarRadioGroup({\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.RadioGroup>) {\n  return (\n    <MenubarPrimitive.RadioGroup data-slot=\"menubar-radio-group\" {...props} />\n  );\n}\n\nfunction MenubarTrigger({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Trigger>) {\n  return (\n    <MenubarPrimitive.Trigger\n      data-slot=\"menubar-trigger\"\n      className={cn(\n        'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex items-center rounded-xs px-2 py-1 text-sm font-medium outline-hidden select-none',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction MenubarContent({\n  className,\n  align = 'start',\n  alignOffset = -4,\n  sideOffset = 8,\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Content>) {\n  return (\n    <MenubarPortal>\n      <MenubarPrimitive.Content\n        data-slot=\"menubar-content\"\n        align={align}\n        alignOffset={alignOffset}\n        sideOffset={sideOffset}\n        className={cn(\n          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-48 origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-md',\n          className\n        )}\n        {...props}\n      />\n    </MenubarPortal>\n  );\n}\n\nfunction MenubarItem({\n  className,\n  inset,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Item> & {\n  inset?: boolean;\n  variant?: 'default' | 'destructive';\n}) {\n  return (\n    <MenubarPrimitive.Item\n      data-slot=\"menubar-item\"\n      data-inset={inset}\n      data-variant={variant}\n      className={cn(\n        \"data-[variant=destructive]:*:[svg]:text-destructive! focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-xs px-2 py-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction MenubarCheckboxItem({\n  className,\n  children,\n  checked,\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.CheckboxItem>) {\n  return (\n    <MenubarPrimitive.CheckboxItem\n      data-slot=\"menubar-checkbox-item\"\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n        <MenubarPrimitive.ItemIndicator>\n          <CheckIcon className=\"size-4\" />\n        </MenubarPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </MenubarPrimitive.CheckboxItem>\n  );\n}\n\nfunction MenubarRadioItem({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.RadioItem>) {\n  return (\n    <MenubarPrimitive.RadioItem\n      data-slot=\"menubar-radio-item\"\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    >\n      <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n        <MenubarPrimitive.ItemIndicator>\n          <CircleIcon className=\"size-2 fill-current\" />\n        </MenubarPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </MenubarPrimitive.RadioItem>\n  );\n}\n\nfunction MenubarLabel({\n  className,\n  inset,\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Label> & {\n  inset?: boolean;\n}) {\n  return (\n    <MenubarPrimitive.Label\n      data-slot=\"menubar-label\"\n      data-inset={inset}\n      className={cn(\n        'px-2 py-1.5 text-sm font-medium data-inset:pl-8',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction MenubarSeparator({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Separator>) {\n  return (\n    <MenubarPrimitive.Separator\n      data-slot=\"menubar-separator\"\n      className={cn('bg-border -mx-1 my-1 h-px', className)}\n      {...props}\n    />\n  );\n}\n\nfunction MenubarShortcut({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"menubar-shortcut\"\n      className={cn(\n        'text-muted-foreground ml-auto text-xs tracking-widest',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction MenubarSub({\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Sub>) {\n  return <MenubarPrimitive.Sub data-slot=\"menubar-sub\" {...props} />;\n}\n\nfunction MenubarSubTrigger({\n  className,\n  inset,\n  children,\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.SubTrigger> & {\n  inset?: boolean;\n}) {\n  return (\n    <MenubarPrimitive.SubTrigger\n      data-slot=\"menubar-sub-trigger\"\n      data-inset={inset}\n      className={cn(\n        'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-xs px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8',\n        className\n      )}\n      {...props}\n    >\n      {children}\n      <ChevronRightIcon className=\"ml-auto h-4 w-4\" />\n    </MenubarPrimitive.SubTrigger>\n  );\n}\n\nfunction MenubarSubContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenubarPrimitive.SubContent>) {\n  return (\n    <MenubarPrimitive.SubContent\n      data-slot=\"menubar-sub-content\"\n      className={cn(\n        'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-32 origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Menubar,\n  MenubarPortal,\n  MenubarMenu,\n  MenubarTrigger,\n  MenubarContent,\n  MenubarGroup,\n  MenubarSeparator,\n  MenubarLabel,\n  MenubarItem,\n  MenubarShortcut,\n  MenubarCheckboxItem,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarSub,\n  MenubarSubTrigger,\n  MenubarSubContent,\n};\n"],"mappings":"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"}

package/dist/ui/molecules/Autocomplete/index.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime69 from "react/jsx-runtime";
+
+//#region ui/molecules/Autocomplete/index.d.ts
+declare function ComboBoxResponsive(): react_jsx_runtime69.JSX.Element;
+//#endregion
+export { ComboBoxResponsive };
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/molecules/Autocomplete/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../ui/molecules/Autocomplete/index.tsx"],"sourcesContent":[],"mappings":";;;iBAyCgB,kBAAA,CAAA,GAAkB,mBAAA,CAAA,GAAA,CAAA"}

package/dist/ui/molecules/Autocomplete/index.js

@@ -0,0 +1,86 @@
+'use client';
+
+
+import { Button } from "../../button.js";
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "../../command.js";
+import { Popover, PopoverContent, PopoverTrigger } from "../../popover.js";
+import { Drawer, DrawerContent, DrawerTrigger } from "../../drawer.js";
+import { useMediaQuery } from "../../use-media-query.js";
+import * as React$1 from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+
+//#region ui/molecules/Autocomplete/index.tsx
+const statuses = [
+	{
+		value: "backlog",
+		label: "Backlog"
+	},
+	{
+		value: "in progress",
+		label: "In Progress"
+	},
+	{
+		value: "done",
+		label: "Done"
+	},
+	{
+		value: "canceled",
+		label: "Canceled"
+	}
+];
+function ComboBoxResponsive() {
+	const [open, setOpen] = React$1.useState(false);
+	const isDesktop = useMediaQuery("(min-width: 768px)");
+	const [selectedStatus, setSelectedStatus] = React$1.useState(null);
+	if (isDesktop) return /* @__PURE__ */ jsxs(Popover, {
+		open,
+		onOpenChange: setOpen,
+		children: [/* @__PURE__ */ jsx(PopoverTrigger, {
+			asChild: true,
+			children: /* @__PURE__ */ jsx(Button, {
+				variant: "outline",
+				className: "w-[150px] justify-start",
+				children: selectedStatus ? /* @__PURE__ */ jsx(Fragment, { children: selectedStatus.label }) : /* @__PURE__ */ jsx(Fragment, { children: "+ Set status" })
+			})
+		}), /* @__PURE__ */ jsx(PopoverContent, {
+			className: "w-[200px] p-0",
+			align: "start",
+			children: /* @__PURE__ */ jsx(StatusList, {
+				setOpen,
+				setSelectedStatus
+			})
+		})]
+	});
+	return /* @__PURE__ */ jsxs(Drawer, {
+		open,
+		onOpenChange: setOpen,
+		children: [/* @__PURE__ */ jsx(DrawerTrigger, {
+			asChild: true,
+			children: /* @__PURE__ */ jsx(Button, {
+				variant: "outline",
+				className: "w-[150px] justify-start",
+				children: selectedStatus ? /* @__PURE__ */ jsx(Fragment, { children: selectedStatus.label }) : /* @__PURE__ */ jsx(Fragment, { children: "+ Set status" })
+			})
+		}), /* @__PURE__ */ jsx(DrawerContent, { children: /* @__PURE__ */ jsx("div", {
+			className: "mt-4 border-t",
+			children: /* @__PURE__ */ jsx(StatusList, {
+				setOpen,
+				setSelectedStatus
+			})
+		}) })]
+	});
+}
+function StatusList({ setOpen, setSelectedStatus }) {
+	return /* @__PURE__ */ jsxs(Command, { children: [/* @__PURE__ */ jsx(CommandInput, { placeholder: "Filter status..." }), /* @__PURE__ */ jsxs(CommandList, { children: [/* @__PURE__ */ jsx(CommandEmpty, { children: "No results found." }), /* @__PURE__ */ jsx(CommandGroup, { children: statuses.map((status) => /* @__PURE__ */ jsx(CommandItem, {
+		value: status.value,
+		onSelect: (value) => {
+			setSelectedStatus(statuses.find((priority) => priority.value === value) || null);
+			setOpen(false);
+		},
+		children: status.label
+	}, status.value)) })] })] });
+}
+
+//#endregion
+export { ComboBoxResponsive };
+//# sourceMappingURL=index.js.map

package/dist/ui/molecules/Autocomplete/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["statuses: Status[]","React"],"sources":["../../../../ui/molecules/Autocomplete/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { Button } from '../../button';\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from '../../command';\nimport { Drawer, DrawerContent, DrawerTrigger } from '../../drawer';\nimport { Popover, PopoverContent, PopoverTrigger } from '../../popover';\nimport { useMediaQuery } from '../../use-media-query';\n\ninterface Status {\n  value: string;\n  label: string;\n}\n\nconst statuses: Status[] = [\n  {\n    value: 'backlog',\n    label: 'Backlog',\n  },\n  {\n    value: 'in progress',\n    label: 'In Progress',\n  },\n  {\n    value: 'done',\n    label: 'Done',\n  },\n  {\n    value: 'canceled',\n    label: 'Canceled',\n  },\n];\n\nexport function ComboBoxResponsive() {\n  const [open, setOpen] = React.useState(false);\n  const isDesktop = useMediaQuery('(min-width: 768px)');\n  const [selectedStatus, setSelectedStatus] = React.useState<Status | null>(\n    null\n  );\n\n  if (isDesktop) {\n    return (\n      <Popover open={open} onOpenChange={setOpen}>\n        <PopoverTrigger asChild>\n          <Button variant=\"outline\" className=\"w-[150px] justify-start\">\n            {selectedStatus ? <>{selectedStatus.label}</> : <>+ Set status</>}\n          </Button>\n        </PopoverTrigger>\n        <PopoverContent className=\"w-[200px] p-0\" align=\"start\">\n          <StatusList setOpen={setOpen} setSelectedStatus={setSelectedStatus} />\n        </PopoverContent>\n      </Popover>\n    );\n  }\n\n  return (\n    <Drawer open={open} onOpenChange={setOpen}>\n      <DrawerTrigger asChild>\n        <Button variant=\"outline\" className=\"w-[150px] justify-start\">\n          {selectedStatus ? <>{selectedStatus.label}</> : <>+ Set status</>}\n        </Button>\n      </DrawerTrigger>\n      <DrawerContent>\n        <div className=\"mt-4 border-t\">\n          <StatusList setOpen={setOpen} setSelectedStatus={setSelectedStatus} />\n        </div>\n      </DrawerContent>\n    </Drawer>\n  );\n}\n\nfunction StatusList({\n  setOpen,\n  setSelectedStatus,\n}: {\n  setOpen: (open: boolean) => void;\n  setSelectedStatus: (status: Status | null) => void;\n}) {\n  return (\n    <Command>\n      <CommandInput placeholder=\"Filter status...\" />\n      <CommandList>\n        <CommandEmpty>No results found.</CommandEmpty>\n        <CommandGroup>\n          {statuses.map((status) => (\n            <CommandItem\n              key={status.value}\n              value={status.value}\n              onSelect={(value) => {\n                setSelectedStatus(\n                  statuses.find((priority) => priority.value === value) || null\n                );\n                setOpen(false);\n              }}\n            >\n              {status.label}\n            </CommandItem>\n          ))}\n        </CommandGroup>\n      </CommandList>\n    </Command>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AAsBA,MAAMA,WAAqB;CACzB;EACE,OAAO;EACP,OAAO;EACR;CACD;EACE,OAAO;EACP,OAAO;EACR;CACD;EACE,OAAO;EACP,OAAO;EACR;CACD;EACE,OAAO;EACP,OAAO;EACR;CACF;AAED,SAAgB,qBAAqB;CACnC,MAAM,CAAC,MAAM,WAAWC,QAAM,SAAS,MAAM;CAC7C,MAAM,YAAY,cAAc,qBAAqB;CACrD,MAAM,CAAC,gBAAgB,qBAAqBA,QAAM,SAChD,KACD;AAED,KAAI,UACF,QACE,qBAAC;EAAc;EAAM,cAAc;aACjC,oBAAC;GAAe;aACd,oBAAC;IAAO,SAAQ;IAAU,WAAU;cACjC,iBAAiB,0CAAG,eAAe,QAAS,GAAG,0CAAE,iBAAe;KAC1D;IACM,EACjB,oBAAC;GAAe,WAAU;GAAgB,OAAM;aAC9C,oBAAC;IAAoB;IAA4B;KAAqB;IACvD;GACT;AAId,QACE,qBAAC;EAAa;EAAM,cAAc;aAChC,oBAAC;GAAc;aACb,oBAAC;IAAO,SAAQ;IAAU,WAAU;cACjC,iBAAiB,0CAAG,eAAe,QAAS,GAAG,0CAAE,iBAAe;KAC1D;IACK,EAChB,oBAAC,2BACC,oBAAC;GAAI,WAAU;aACb,oBAAC;IAAoB;IAA4B;KAAqB;IAClE,GACQ;GACT;;AAIb,SAAS,WAAW,EAClB,SACA,qBAIC;AACD,QACE,qBAAC,sBACC,oBAAC,gBAAa,aAAY,qBAAqB,EAC/C,qBAAC,0BACC,oBAAC,0BAAa,sBAAgC,EAC9C,oBAAC,0BACE,SAAS,KAAK,WACb,oBAAC;EAEC,OAAO,OAAO;EACd,WAAW,UAAU;AACnB,qBACE,SAAS,MAAM,aAAa,SAAS,UAAU,MAAM,IAAI,KAC1D;AACD,WAAQ,MAAM;;YAGf,OAAO;IATH,OAAO,MAUA,CACd,GACW,IACH,IACN"}

package/dist/ui/molecules/SearchAndFilter/SearchAndFilter.d.ts

@@ -0,0 +1,8 @@
+import { SearchAndFilterProps } from "./types.js";
+import React from "react";
+
+//#region ui/molecules/SearchAndFilter/SearchAndFilter.d.ts
+declare const SearchAndFilter: React.FC<SearchAndFilterProps>;
+//#endregion
+export { SearchAndFilter };
+//# sourceMappingURL=SearchAndFilter.d.ts.map

package/dist/ui/molecules/SearchAndFilter/SearchAndFilter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchAndFilter.d.ts","names":[],"sources":["../../../../ui/molecules/SearchAndFilter/SearchAndFilter.tsx"],"sourcesContent":[],"mappings":";;;;cAYa,iBAAiB,KAAA,CAAM,GAAG"}

package/dist/ui/molecules/SearchAndFilter/SearchAndFilter.js

@@ -0,0 +1,103 @@
+import { Button } from "../../button.js";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../../collapsible.js";
+import { FilterSelect } from "../../atoms/FilterSelect/FilterSelect.js";
+import { SearchInput } from "../../atoms/SearchInput/SearchInput.js";
+import React, { useState } from "react";
+import { ChevronDown, ChevronUp, Filter } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region ui/molecules/SearchAndFilter/SearchAndFilter.tsx
+const 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__ */ jsx("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__ */ jsx(FilterSelect, {
+			value: filter.value,
+			options: filter.options,
+			onChange: filter.onChange,
+			label: filter.label,
+			disabled: disabled || isLoading,
+			showCounts: filter.showCounts,
+			className: "min-w-0"
+		}, filter.key))
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: `space-y-4 ${className}`,
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col gap-4 sm:flex-row",
+				children: [/* @__PURE__ */ jsx("div", {
+					className: "flex-1",
+					children: /* @__PURE__ */ jsx(SearchInput, {
+						value: searchValue,
+						onChange: onSearchChange,
+						placeholder: searchPlaceholder,
+						disabled: disabled || isLoading,
+						className: "w-full"
+					})
+				}), shouldUseCollapsible && /* @__PURE__ */ jsxs(Collapsible, {
+					open: !isCollapsed,
+					onOpenChange: setIsCollapsed,
+					className: "sm:hidden",
+					children: [/* @__PURE__ */ jsx(CollapsibleTrigger, {
+						asChild: true,
+						children: /* @__PURE__ */ jsxs(Button, {
+							variant: "outline",
+							className: "sm:hidden",
+							disabled: disabled || isLoading,
+							children: [
+								/* @__PURE__ */ jsx(Filter, { className: "mr-2 h-4 w-4" }),
+								"Filtres",
+								activeFiltersCount > 0 && /* @__PURE__ */ jsx("span", {
+									className: "bg-primary text-primary-foreground ml-2 flex h-5 w-5 items-center justify-center rounded-full text-sm",
+									children: activeFiltersCount
+								}),
+								isCollapsed ? /* @__PURE__ */ jsx(ChevronDown, { className: "ml-2 h-4 w-4" }) : /* @__PURE__ */ jsx(ChevronUp, { className: "ml-2 h-4 w-4" })
+							]
+						})
+					}), /* @__PURE__ */ jsx(CollapsibleContent, {
+						className: "mt-4 space-y-4",
+						children: /* @__PURE__ */ jsx(FilterComponents, {})
+					})]
+				})]
+			}),
+			hasFilters && /* @__PURE__ */ jsx("div", {
+				className: "hidden sm:block",
+				children: /* @__PURE__ */ jsx(FilterComponents, {})
+			}),
+			activeFiltersCount > 0 && /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-wrap items-center gap-2",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "text-muted-foreground text-base",
+					children: "Filtres actifs:"
+				}), filters.filter((f) => f.value).map((filter) => {
+					const selectedOption = filter.options.find((opt) => opt.value === filter.value);
+					return /* @__PURE__ */ jsxs(Button, {
+						variant: "secondary",
+						size: "sm",
+						onClick: () => filter.onChange(""),
+						disabled: disabled || isLoading,
+						className: "h-7 px-2 text-sm",
+						children: [
+							filter.label,
+							": ",
+							selectedOption?.label,
+							/* @__PURE__ */ jsx("span", {
+								className: "ml-1",
+								children: "×"
+							})
+						]
+					}, filter.key);
+				})]
+			})
+		]
+	});
+};
+
+//#endregion
+export { SearchAndFilter };
+//# sourceMappingURL=SearchAndFilter.js.map

package/dist/ui/molecules/SearchAndFilter/SearchAndFilter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchAndFilter.js","names":["SearchAndFilter: React.FC<SearchAndFilterProps>"],"sources":["../../../../ui/molecules/SearchAndFilter/SearchAndFilter.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { ChevronDown, ChevronUp, Filter } from 'lucide-react';\nimport { Button } from '../../button';\nimport {\n  Collapsible,\n  CollapsibleContent,\n  CollapsibleTrigger,\n} from '../../collapsible';\nimport { SearchInput } from '../../atoms/SearchInput';\nimport { FilterSelect } from '../../atoms/FilterSelect';\nimport type { SearchAndFilterProps } from './types';\n\nexport const SearchAndFilter: React.FC<SearchAndFilterProps> = ({\n  searchValue,\n  onSearchChange,\n  searchPlaceholder,\n  filters = [],\n  isLoading = false,\n  disabled = false,\n  className = '',\n  collapsible = true,\n  defaultCollapsed = false,\n}) => {\n  const [isCollapsed, setIsCollapsed] = useState(defaultCollapsed);\n\n  const hasFilters = filters.length > 0;\n  const activeFiltersCount = filters.filter((f) => f.value).length;\n\n  // On mobile, show collapsible by default; on desktop, always show filters\n  const shouldUseCollapsible = collapsible && hasFilters;\n\n  console.log('SearchAndFilter', { filters });\n\n  const FilterComponents = () => (\n    <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4\">\n      {filters.map((filter) => (\n        <FilterSelect\n          key={filter.key}\n          value={filter.value}\n          options={filter.options}\n          onChange={filter.onChange}\n          label={filter.label}\n          disabled={disabled || isLoading}\n          showCounts={filter.showCounts}\n          className=\"min-w-0\"\n        />\n      ))}\n    </div>\n  );\n\n  return (\n    <div className={`space-y-4 ${className}`}>\n      {/* Search - Always visible */}\n      <div className=\"flex flex-col gap-4 sm:flex-row\">\n        <div className=\"flex-1\">\n          <SearchInput\n            value={searchValue}\n            onChange={onSearchChange}\n            placeholder={searchPlaceholder}\n            disabled={disabled || isLoading}\n            className=\"w-full\"\n          />\n        </div>\n\n        {/* Filter toggle for mobile */}\n        {shouldUseCollapsible && (\n          <Collapsible\n            open={!isCollapsed}\n            onOpenChange={setIsCollapsed}\n            className=\"sm:hidden\"\n          >\n            <CollapsibleTrigger asChild>\n              <Button\n                variant=\"outline\"\n                className=\"sm:hidden\"\n                disabled={disabled || isLoading}\n              >\n                <Filter className=\"mr-2 h-4 w-4\" />\n                Filtres\n                {activeFiltersCount > 0 && (\n                  <span className=\"bg-primary text-primary-foreground ml-2 flex h-5 w-5 items-center justify-center rounded-full text-sm\">\n                    {activeFiltersCount}\n                  </span>\n                )}\n                {isCollapsed ? (\n                  <ChevronDown className=\"ml-2 h-4 w-4\" />\n                ) : (\n                  <ChevronUp className=\"ml-2 h-4 w-4\" />\n                )}\n              </Button>\n            </CollapsibleTrigger>\n            <CollapsibleContent className=\"mt-4 space-y-4\">\n              <FilterComponents />\n            </CollapsibleContent>\n          </Collapsible>\n        )}\n      </div>\n\n      {/* Filters - Always visible on desktop, collapsible on mobile */}\n      {hasFilters && (\n        <div className=\"hidden sm:block\">\n          <FilterComponents />\n        </div>\n      )}\n\n      {/* Active filters summary */}\n      {activeFiltersCount > 0 && (\n        <div className=\"flex flex-wrap items-center gap-2\">\n          <span className=\"text-muted-foreground text-base\">\n            Filtres actifs:\n          </span>\n          {filters\n            .filter((f) => f.value)\n            .map((filter) => {\n              const selectedOption = filter.options.find(\n                (opt) => opt.value === filter.value\n              );\n              return (\n                <Button\n                  key={filter.key}\n                  variant=\"secondary\"\n                  size=\"sm\"\n                  onClick={() => filter.onChange('')}\n                  disabled={disabled || isLoading}\n                  className=\"h-7 px-2 text-sm\"\n                >\n                  {filter.label}: {selectedOption?.label}\n                  <span className=\"ml-1\">×</span>\n                </Button>\n              );\n            })}\n        </div>\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;AAYA,MAAaA,mBAAmD,EAC9D,aACA,gBACA,mBACA,UAAU,EAAE,EACZ,YAAY,OACZ,WAAW,OACX,YAAY,IACZ,cAAc,MACd,mBAAmB,YACf;CACJ,MAAM,CAAC,aAAa,kBAAkB,SAAS,iBAAiB;CAEhE,MAAM,aAAa,QAAQ,SAAS;CACpC,MAAM,qBAAqB,QAAQ,QAAQ,MAAM,EAAE,MAAM,CAAC;CAG1D,MAAM,uBAAuB,eAAe;AAE5C,SAAQ,IAAI,mBAAmB,EAAE,SAAS,CAAC;CAE3C,MAAM,yBACJ,oBAAC;EAAI,WAAU;YACZ,QAAQ,KAAK,WACZ,oBAAC;GAEC,OAAO,OAAO;GACd,SAAS,OAAO;GAChB,UAAU,OAAO;GACjB,OAAO,OAAO;GACd,UAAU,YAAY;GACtB,YAAY,OAAO;GACnB,WAAU;KAPL,OAAO,IAQZ,CACF;GACE;AAGR,QACE,qBAAC;EAAI,WAAW,aAAa;;GAE3B,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAI,WAAU;eACb,oBAAC;MACC,OAAO;MACP,UAAU;MACV,aAAa;MACb,UAAU,YAAY;MACtB,WAAU;OACV;MACE,EAGL,wBACC,qBAAC;KACC,MAAM,CAAC;KACP,cAAc;KACd,WAAU;gBAEV,oBAAC;MAAmB;gBAClB,qBAAC;OACC,SAAQ;OACR,WAAU;OACV,UAAU,YAAY;;QAEtB,oBAAC,UAAO,WAAU,iBAAiB;;QAElC,qBAAqB,KACpB,oBAAC;SAAK,WAAU;mBACb;UACI;QAER,cACC,oBAAC,eAAY,WAAU,iBAAiB,GAExC,oBAAC,aAAU,WAAU,iBAAiB;;QAEjC;OACU,EACrB,oBAAC;MAAmB,WAAU;gBAC5B,oBAAC,qBAAmB;OACD;MACT;KAEZ;GAGL,cACC,oBAAC;IAAI,WAAU;cACb,oBAAC,qBAAmB;KAChB;GAIP,qBAAqB,KACpB,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAK,WAAU;eAAkC;MAE3C,EACN,QACE,QAAQ,MAAM,EAAE,MAAM,CACtB,KAAK,WAAW;KACf,MAAM,iBAAiB,OAAO,QAAQ,MACnC,QAAQ,IAAI,UAAU,OAAO,MAC/B;AACD,YACE,qBAAC;MAEC,SAAQ;MACR,MAAK;MACL,eAAe,OAAO,SAAS,GAAG;MAClC,UAAU,YAAY;MACtB,WAAU;;OAET,OAAO;OAAM;OAAG,gBAAgB;OACjC,oBAAC;QAAK,WAAU;kBAAO;SAAQ;;QAR1B,OAAO,IASL;MAEX;KACA;;GAEJ"}

package/dist/ui/molecules/SearchAndFilter/index.d.ts

@@ -0,0 +1,3 @@
+import { SearchAndFilterProps } from "./types.js";
+import { SearchAndFilter } from "./SearchAndFilter.js";
+export { SearchAndFilter, type SearchAndFilterProps };

package/dist/ui/molecules/SearchAndFilter/index.js

@@ -0,0 +1,3 @@
+import { SearchAndFilter } from "./SearchAndFilter.js";
+
+export { SearchAndFilter };

package/dist/ui/molecules/SearchAndFilter/types.d.ts

@@ -0,0 +1,24 @@
+import { FilterOption } from "@lssm/lib.ui-kit-web/ui/atoms/FilterSelect";
+
+//#region ui/molecules/SearchAndFilter/types.d.ts
+interface SearchAndFilterProps {
+  searchValue: string;
+  onSearchChange: (value: string) => void;
+  searchPlaceholder?: string;
+  filters?: {
+    key: string;
+    label: string;
+    value: string;
+    options: FilterOption[];
+    onChange: (value: string) => void;
+    showCounts?: boolean;
+  }[];
+  isLoading?: boolean;
+  disabled?: boolean;
+  className?: string;
+  collapsible?: boolean;
+  defaultCollapsed?: boolean;
+}
+//#endregion
+export { SearchAndFilterProps };
+//# sourceMappingURL=types.d.ts.map

package/dist/ui/molecules/SearchAndFilter/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","names":[],"sources":["../../../../ui/molecules/SearchAndFilter/types.ts"],"sourcesContent":[],"mappings":";;;UAEiB,oBAAA;;EAAA,cAAA,EAAA,CAAA,KAAA,EAAoB,MAAA,EAAA,GAAA,IAWxB;;;;;;aAAA"}

package/dist/ui/molecules/SkeletonList.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime107 from "react/jsx-runtime";
+
+//#region ui/molecules/SkeletonList.d.ts
+interface Props {
+  count?: number;
+  className?: string;
+  itemClassName?: string;
+}
+declare function SkeletonList({
+  count,
+  className,
+  itemClassName
+}: Props): react_jsx_runtime107.JSX.Element;
+//#endregion
+export { SkeletonList };
+//# sourceMappingURL=SkeletonList.d.ts.map