@vegait/lyra-ds-v2 0.1.0

package/README.md

@@ -0,0 +1,134 @@
+# @vegait/lyra-ds
+
+Biblioteca de componentes do Lyra Design System. Construída com Radix UI + CVA + Tailwind v4, distribuída como pacote npm.
+
+## Instalação
+
+```bash
+pnpm add @vegait/lyra-ds tw-animate-css
+```
+
+`tw-animate-css` é peerDependency obrigatória: provê os utilitários de animação (`animate-in`, `fade-in-0`, `zoom-in-95`, `slide-in-from-*`) usados em Modal, DropdownMenu, Tooltip e DatePicker. Sem ele, overlays abrem sem animação.
+
+Importe o CSS global da lib uma vez no entry point da aplicação:
+
+```ts
+import "@vegait/lyra-ds/styles";
+```
+
+E adicione o import do `tw-animate-css` no mesmo arquivo CSS onde Tailwind é inicializado (ex: `app/globals.css`):
+
+```css
+@import "tailwindcss";
+@import "tw-animate-css";
+```
+
+> Por que dois lugares: o CSS da lib só transporta tokens. As classes utilitárias do Tailwind v4 (incluindo as do `tw-animate-css`) precisam ser geradas no arquivo do consumidor que tem `@import "tailwindcss"`, porque `@utility` directives são processados no escopo desse arquivo.
+
+## Uso
+
+```tsx
+import { Button, Input, Badge } from "@vegait/lyra-ds";
+
+export function Example() {
+  return (
+    <div>
+      <Button variant="primary">Salvar</Button>
+      <Input label="Nome" placeholder="Digite seu nome" />
+      <Badge variant="success">Ativo</Badge>
+    </div>
+  );
+}
+```
+
+## Stack técnica
+
+- **Radix UI** — primitivos acessíveis (focus trap, keyboard nav, ARIA)
+- **CVA** (class-variance-authority) — variantes de componentes
+- **Tailwind v4** — utilitários e tokens CSS
+- **tsup** — build ESM + CJS com `sideEffects: false`
+
+Esta biblioteca usa o modelo de distribuição npm (não shadcn copy-paste). Ver decisão em `lyra-ds-v2-decisao-shadcn`.
+
+## Tokens CSS
+
+Os tokens são importados via `@vegait/lyra-ds/styles`. Cadeia de tokens:
+
+```
+Primitivos → Brand → Semânticos → Componente
+```
+
+Exemplos: `--color-action-primary`, `--color-feedback-error`, `--color-background-page`.
+
+## Componentes disponíveis
+
+| Componente | Descrição |
+|------------|-----------|
+| `Button` | Ações primárias, secundárias, destrutivas e de ícone |
+| `Input` | Campo de texto com label, helper e estado de erro |
+| `Badge` | Rótulos de status compactos |
+| `Card` / `CardHeader` / `CardContent` | Container de conteúdo |
+| `Alert` | Feedback de sistema (info, success, warning, error) |
+| `Modal` | Dialog genérico com header, body e footer |
+| `DestructiveDialog` | Confirmação de ação destrutiva com input opcional |
+| `Tabs` / `TabsRoot` / `TabsList` / `TabsTrigger` / `TabsContent` | Navegação intra-página |
+| `StatusTag` | Tag semântica (active, invited, pending, suspended, inactive) |
+| `EmptyState` | Tela vazia (no-data, no-results, error, no-permission) |
+| `ListPage` | Template de página de listagem com filtro, tabela e paginação |
+| `Avatar` | Imagem ou iniciais de usuário |
+| `Skeleton` / `SkeletonText` / `SkeletonAvatar` / `SkeletonCard` / `SkeletonButton` | Placeholders de carregamento |
+| `Tooltip` | Texto auxiliar em hover/focus |
+| `Toggle` | Switch ligado/desligado |
+| `DropdownMenu` | Menu suspenso com grupos, labels e separadores |
+| `Sidebar` | Menu lateral com logo, nav items e perfil |
+
+## Criando um novo componente
+
+1. Crie `packages/lyra-ds/src/components/nome-do-componente.tsx`
+2. Use Radix UI como primitivo quando disponível
+3. Defina variantes com CVA e aplique tokens CSS (nunca valores hardcoded)
+4. Exporte do `src/index.ts`
+5. Crie a página de showcase em `apps/showcase/app/style-guides/nome-do-componente/page.tsx`
+6. Rode `pnpm lint` e `pnpm typecheck` antes de commitar
+
+### Template mínimo
+
+```tsx
+"use client";
+
+import * as React from "react";
+import { cva, type VariantProps } from "class-variance-authority";
+import { cn } from "../lib/utils";
+
+const componentVariants = cva("base-classes", {
+  variants: {
+    variant: {
+      default: "...",
+    },
+  },
+  defaultVariants: {
+    variant: "default",
+  },
+});
+
+export interface ComponentProps
+  extends React.HTMLAttributes<HTMLDivElement>,
+    VariantProps<typeof componentVariants> {}
+
+function Component({ className, variant, ...props }: ComponentProps) {
+  return (
+    <div className={cn(componentVariants({ variant }), className)} {...props} />
+  );
+}
+
+export { Component };
+```
+
+## Contribuindo
+
+- `pnpm dev` para desenvolvimento com hot reload
+- `pnpm lint` deve passar sem erros antes de qualquer PR
+- `pnpm typecheck` deve passar sem erros antes de qualquer PR
+- Tokens CSS sempre, zero valores hardcoded
+- `focus-visible:` para estados de foco (não `focus:`)
+- Adicionar `"use client"` em componentes que usam hooks de estado ou eventos de browser

package/dist/chunk-32QWDFOV.js

@@ -0,0 +1,96 @@
+"use client";
+import {
+  Button
+} from "./chunk-EMKU3IZY.js";
+import {
+  cn
+} from "./chunk-KQJCGTS3.js";
+
+// src/components/empty-state.tsx
+import { Inbox, SearchX, AlertCircle, Lock } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DEFAULT_ICONS = {
+  "no-data": Inbox,
+  "no-results": SearchX,
+  error: AlertCircle,
+  "no-permission": Lock
+};
+function EmptyState({
+  className,
+  variant,
+  title,
+  description,
+  primaryAction,
+  secondaryAction,
+  icon: IconProp,
+  size = "inline",
+  ...props
+}) {
+  const Icon = IconProp ?? DEFAULT_ICONS[variant];
+  const isError = variant === "error";
+  const iconContainerSize = size === "full" ? "size-16" : "size-12";
+  const iconSize = size === "full" ? "size-8" : "size-6";
+  const titleClass = size === "full" ? "text-display-sm" : "text-heading";
+  const hasActions = primaryAction || secondaryAction;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-col items-center justify-center text-center",
+        size === "full" ? "py-16 gap-4" : "py-10 gap-3",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "rounded-full flex items-center justify-center bg-[var(--color-surf-container-high)]",
+              iconContainerSize
+            ),
+            children: /* @__PURE__ */ jsx(
+              Icon,
+              {
+                className: cn(
+                  iconSize,
+                  isError ? "text-[var(--color-error)]" : "text-[var(--color-on-surface-var)]"
+                )
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-1", size === "full" ? "max-w-sm" : "max-w-xs"), children: [
+          /* @__PURE__ */ jsx("p", { className: cn(titleClass, "text-[var(--color-on-surface)]"), children: title }),
+          description && /* @__PURE__ */ jsx("p", { className: "text-body-md text-[var(--color-on-surface-var)]", children: description })
+        ] }),
+        hasActions && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 mt-1", children: [
+          primaryAction && variant !== "no-permission" && /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "primary",
+              size: size === "full" ? "md" : "sm",
+              onClick: primaryAction.onClick,
+              loading: primaryAction.loading,
+              children: primaryAction.label
+            }
+          ),
+          secondaryAction && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: secondaryAction.onClick,
+              className: "text-body-sm font-semibold text-[var(--color-primary)] underline hover:no-underline",
+              children: secondaryAction.label
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+export {
+  EmptyState
+};
+//# sourceMappingURL=chunk-32QWDFOV.js.map

package/dist/chunk-32QWDFOV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/empty-state.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Inbox, SearchX, AlertCircle, Lock } from \"lucide-react\";\nimport type { LucideIcon } from \"lucide-react\";\nimport { Button } from \"./button\";\nimport { cn } from \"../lib/utils\";\n\nconst DEFAULT_ICONS: Record<string, LucideIcon> = {\n  \"no-data\": Inbox,\n  \"no-results\": SearchX,\n  error: AlertCircle,\n  \"no-permission\": Lock,\n};\n\nexport interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement> {\n  variant: \"no-data\" | \"no-results\" | \"error\" | \"no-permission\";\n  title: string;\n  description?: string;\n  primaryAction?: {\n    label: string;\n    onClick: () => void;\n    loading?: boolean;\n  };\n  secondaryAction?: {\n    label: string;\n    onClick: () => void;\n  };\n  icon?: LucideIcon;\n  size?: \"full\" | \"inline\";\n}\n\nfunction EmptyState({\n  className,\n  variant,\n  title,\n  description,\n  primaryAction,\n  secondaryAction,\n  icon: IconProp,\n  size = \"inline\",\n  ...props\n}: EmptyStateProps) {\n  const Icon = IconProp ?? DEFAULT_ICONS[variant];\n  const isError = variant === \"error\";\n  const iconContainerSize = size === \"full\" ? \"size-16\" : \"size-12\";\n  const iconSize = size === \"full\" ? \"size-8\" : \"size-6\";\n  const titleClass = size === \"full\" ? \"text-display-sm\" : \"text-heading\";\n  const hasActions = primaryAction || secondaryAction;\n\n  return (\n    <div\n      className={cn(\n        \"flex flex-col items-center justify-center text-center\",\n        size === \"full\" ? \"py-16 gap-4\" : \"py-10 gap-3\",\n        className\n      )}\n      {...props}\n    >\n      <div\n        className={cn(\n          \"rounded-full flex items-center justify-center bg-[var(--color-surf-container-high)]\",\n          iconContainerSize\n        )}\n      >\n        <Icon\n          className={cn(\n            iconSize,\n            isError\n              ? \"text-[var(--color-error)]\"\n              : \"text-[var(--color-on-surface-var)]\"\n          )}\n        />\n      </div>\n\n      <div className={cn(\"flex flex-col gap-1\", size === \"full\" ? \"max-w-sm\" : \"max-w-xs\")}>\n        <p className={cn(titleClass, \"text-[var(--color-on-surface)]\")}>{title}</p>\n        {description && (\n          <p className=\"text-body-md text-[var(--color-on-surface-var)]\">{description}</p>\n        )}\n      </div>\n\n      {hasActions && (\n        <div className=\"flex items-center gap-3 mt-1\">\n          {primaryAction && variant !== \"no-permission\" && (\n            <Button\n              variant=\"primary\"\n              size={size === \"full\" ? \"md\" : \"sm\"}\n              onClick={primaryAction.onClick}\n              loading={primaryAction.loading}\n            >\n              {primaryAction.label}\n            </Button>\n          )}\n          {secondaryAction && (\n            <button\n              type=\"button\"\n              onClick={secondaryAction.onClick}\n              className=\"text-body-sm font-semibold text-[var(--color-primary)] underline hover:no-underline\"\n            >\n              {secondaryAction.label}\n            </button>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport { EmptyState };\n"],"mappings":";;;;;;;;;AACA,SAAS,OAAO,SAAS,aAAa,YAAY;AA8D1C,cAUF,YAVE;AAzDR,IAAM,gBAA4C;AAAA,EAChD,WAAW;AAAA,EACX,cAAc;AAAA,EACd,OAAO;AAAA,EACP,iBAAiB;AACnB;AAmBA,SAAS,WAAW;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN,OAAO;AAAA,EACP,GAAG;AACL,GAAoB;AAClB,QAAM,OAAO,YAAY,cAAc,OAAO;AAC9C,QAAM,UAAU,YAAY;AAC5B,QAAM,oBAAoB,SAAS,SAAS,YAAY;AACxD,QAAM,WAAW,SAAS,SAAS,WAAW;AAC9C,QAAM,aAAa,SAAS,SAAS,oBAAoB;AACzD,QAAM,aAAa,iBAAiB;AAEpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,SAAS,SAAS,gBAAgB;AAAA,QAClC;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YAEA;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW;AAAA,kBACT;AAAA,kBACA,UACI,8BACA;AAAA,gBACN;AAAA;AAAA,YACF;AAAA;AAAA,QACF;AAAA,QAEA,qBAAC,SAAI,WAAW,GAAG,uBAAuB,SAAS,SAAS,aAAa,UAAU,GACjF;AAAA,8BAAC,OAAE,WAAW,GAAG,YAAY,gCAAgC,GAAI,iBAAM;AAAA,UACtE,eACC,oBAAC,OAAE,WAAU,mDAAmD,uBAAY;AAAA,WAEhF;AAAA,QAEC,cACC,qBAAC,SAAI,WAAU,gCACZ;AAAA,2BAAiB,YAAY,mBAC5B;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,MAAM,SAAS,SAAS,OAAO;AAAA,cAC/B,SAAS,cAAc;AAAA,cACvB,SAAS,cAAc;AAAA,cAEtB,wBAAc;AAAA;AAAA,UACjB;AAAA,UAED,mBACC;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,SAAS,gBAAgB;AAAA,cACzB,WAAU;AAAA,cAET,0BAAgB;AAAA;AAAA,UACnB;AAAA,WAEJ;AAAA;AAAA;AAAA,EAEJ;AAEJ;","names":[]}

package/dist/chunk-4EEFY4FU.cjs

@@ -0,0 +1,96 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }"use client";
+
+
+var _chunkLUQS7LYGcjs = require('./chunk-LUQS7LYG.cjs');
+
+
+var _chunk5SCF3EGTcjs = require('./chunk-5SCF3EGT.cjs');
+
+// src/components/empty-state.tsx
+var _lucidereact = require('lucide-react');
+var _jsxruntime = require('react/jsx-runtime');
+var DEFAULT_ICONS = {
+  "no-data": _lucidereact.Inbox,
+  "no-results": _lucidereact.SearchX,
+  error: _lucidereact.AlertCircle,
+  "no-permission": _lucidereact.Lock
+};
+function EmptyState({
+  className,
+  variant,
+  title,
+  description,
+  primaryAction,
+  secondaryAction,
+  icon: IconProp,
+  size = "inline",
+  ...props
+}) {
+  const Icon = _nullishCoalesce(IconProp, () => ( DEFAULT_ICONS[variant]));
+  const isError = variant === "error";
+  const iconContainerSize = size === "full" ? "size-16" : "size-12";
+  const iconSize = size === "full" ? "size-8" : "size-6";
+  const titleClass = size === "full" ? "text-display-sm" : "text-heading";
+  const hasActions = primaryAction || secondaryAction;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "div",
+    {
+      className: _chunk5SCF3EGTcjs.cn.call(void 0, 
+        "flex flex-col items-center justify-center text-center",
+        size === "full" ? "py-16 gap-4" : "py-10 gap-3",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "div",
+          {
+            className: _chunk5SCF3EGTcjs.cn.call(void 0, 
+              "rounded-full flex items-center justify-center bg-[var(--color-surf-container-high)]",
+              iconContainerSize
+            ),
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              Icon,
+              {
+                className: _chunk5SCF3EGTcjs.cn.call(void 0, 
+                  iconSize,
+                  isError ? "text-[var(--color-error)]" : "text-[var(--color-on-surface-var)]"
+                )
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunk5SCF3EGTcjs.cn.call(void 0, "flex flex-col gap-1", size === "full" ? "max-w-sm" : "max-w-xs"), children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: _chunk5SCF3EGTcjs.cn.call(void 0, titleClass, "text-[var(--color-on-surface)]"), children: title }),
+          description && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-body-md text-[var(--color-on-surface-var)]", children: description })
+        ] }),
+        hasActions && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-3 mt-1", children: [
+          primaryAction && variant !== "no-permission" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunkLUQS7LYGcjs.Button,
+            {
+              variant: "primary",
+              size: size === "full" ? "md" : "sm",
+              onClick: primaryAction.onClick,
+              loading: primaryAction.loading,
+              children: primaryAction.label
+            }
+          ),
+          secondaryAction && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "button",
+            {
+              type: "button",
+              onClick: secondaryAction.onClick,
+              className: "text-body-sm font-semibold text-[var(--color-primary)] underline hover:no-underline",
+              children: secondaryAction.label
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+
+
+exports.EmptyState = EmptyState;
+//# sourceMappingURL=chunk-4EEFY4FU.cjs.map

package/dist/chunk-4EEFY4FU.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/isaac/vega/lyra/lyra-ds.v3/packages/lyra-ds/dist/chunk-4EEFY4FU.cjs","../src/components/empty-state.tsx"],"names":[],"mappings":"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","file":"/home/isaac/vega/lyra/lyra-ds.v3/packages/lyra-ds/dist/chunk-4EEFY4FU.cjs","sourcesContent":[null,"import * as React from \"react\";\nimport { Inbox, SearchX, AlertCircle, Lock } from \"lucide-react\";\nimport type { LucideIcon } from \"lucide-react\";\nimport { Button } from \"./button\";\nimport { cn } from \"../lib/utils\";\n\nconst DEFAULT_ICONS: Record<string, LucideIcon> = {\n  \"no-data\": Inbox,\n  \"no-results\": SearchX,\n  error: AlertCircle,\n  \"no-permission\": Lock,\n};\n\nexport interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement> {\n  variant: \"no-data\" | \"no-results\" | \"error\" | \"no-permission\";\n  title: string;\n  description?: string;\n  primaryAction?: {\n    label: string;\n    onClick: () => void;\n    loading?: boolean;\n  };\n  secondaryAction?: {\n    label: string;\n    onClick: () => void;\n  };\n  icon?: LucideIcon;\n  size?: \"full\" | \"inline\";\n}\n\nfunction EmptyState({\n  className,\n  variant,\n  title,\n  description,\n  primaryAction,\n  secondaryAction,\n  icon: IconProp,\n  size = \"inline\",\n  ...props\n}: EmptyStateProps) {\n  const Icon = IconProp ?? DEFAULT_ICONS[variant];\n  const isError = variant === \"error\";\n  const iconContainerSize = size === \"full\" ? \"size-16\" : \"size-12\";\n  const iconSize = size === \"full\" ? \"size-8\" : \"size-6\";\n  const titleClass = size === \"full\" ? \"text-display-sm\" : \"text-heading\";\n  const hasActions = primaryAction || secondaryAction;\n\n  return (\n    <div\n      className={cn(\n        \"flex flex-col items-center justify-center text-center\",\n        size === \"full\" ? \"py-16 gap-4\" : \"py-10 gap-3\",\n        className\n      )}\n      {...props}\n    >\n      <div\n        className={cn(\n          \"rounded-full flex items-center justify-center bg-[var(--color-surf-container-high)]\",\n          iconContainerSize\n        )}\n      >\n        <Icon\n          className={cn(\n            iconSize,\n            isError\n              ? \"text-[var(--color-error)]\"\n              : \"text-[var(--color-on-surface-var)]\"\n          )}\n        />\n      </div>\n\n      <div className={cn(\"flex flex-col gap-1\", size === \"full\" ? \"max-w-sm\" : \"max-w-xs\")}>\n        <p className={cn(titleClass, \"text-[var(--color-on-surface)]\")}>{title}</p>\n        {description && (\n          <p className=\"text-body-md text-[var(--color-on-surface-var)]\">{description}</p>\n        )}\n      </div>\n\n      {hasActions && (\n        <div className=\"flex items-center gap-3 mt-1\">\n          {primaryAction && variant !== \"no-permission\" && (\n            <Button\n              variant=\"primary\"\n              size={size === \"full\" ? \"md\" : \"sm\"}\n              onClick={primaryAction.onClick}\n              loading={primaryAction.loading}\n            >\n              {primaryAction.label}\n            </Button>\n          )}\n          {secondaryAction && (\n            <button\n              type=\"button\"\n              onClick={secondaryAction.onClick}\n              className=\"text-body-sm font-semibold text-[var(--color-primary)] underline hover:no-underline\"\n            >\n              {secondaryAction.label}\n            </button>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport { EmptyState };\n"]}

package/dist/chunk-562W4FCG.cjs

@@ -0,0 +1,88 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }"use client";
+
+
+var _chunk5SCF3EGTcjs = require('./chunk-5SCF3EGT.cjs');
+
+// src/components/radio-group.tsx
+var _react = require('react'); var React = _interopRequireWildcard(_react);
+var _reactradiogroup = require('@radix-ui/react-radio-group'); var RadixRadioGroup = _interopRequireWildcard(_reactradiogroup);
+var _jsxruntime = require('react/jsx-runtime');
+var RadioGroup = React.forwardRef(
+  ({
+    value,
+    defaultValue,
+    onValueChange,
+    disabled,
+    orientation = "vertical",
+    className,
+    children
+  }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    RadixRadioGroup.Root,
+    {
+      ref,
+      value,
+      defaultValue,
+      onValueChange,
+      disabled,
+      orientation,
+      className: _chunk5SCF3EGTcjs.cn.call(void 0, 
+        "flex",
+        orientation === "vertical" ? "flex-col gap-2" : "flex-row flex-wrap gap-4",
+        className
+      ),
+      children
+    }
+  )
+);
+var RadioGroupItem = React.forwardRef(({ value, label, description, disabled, id: idProp }, ref) => {
+  const generatedId = React.useId();
+  const id = _nullishCoalesce(idProp, () => ( generatedId));
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunk5SCF3EGTcjs.cn.call(void 0, "flex items-start gap-3", disabled && "opacity-50 cursor-not-allowed"), children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      RadixRadioGroup.Item,
+      {
+        ref,
+        id,
+        value,
+        disabled,
+        className: _chunk5SCF3EGTcjs.cn.call(void 0, 
+          "mt-0.5 size-4 shrink-0 rounded-full border-2 border-[var(--color-outline)]",
+          "transition-colors duration-[var(--duration-fast)]",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--state-focus-ring)] focus-visible:ring-offset-2",
+          "data-[state=checked]:border-[var(--color-primary)] data-[state=checked]:bg-[var(--color-primary)]",
+          "disabled:cursor-not-allowed",
+          "relative flex items-center justify-center"
+        ),
+        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          RadixRadioGroup.Indicator,
+          {
+            className: "flex items-center justify-center",
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "size-1.5 rounded-full bg-white block" })
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "label",
+        {
+          htmlFor: id,
+          className: _chunk5SCF3EGTcjs.cn.call(void 0, 
+            "text-body-md cursor-pointer text-[var(--color-on-surface)] leading-none pt-0.5",
+            disabled && "cursor-not-allowed"
+          ),
+          children: label
+        }
+      ),
+      description && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-body-sm text-[var(--color-on-surface-var)] mt-0.5", children: description })
+    ] })
+  ] });
+});
+RadioGroup.displayName = "RadioGroup";
+RadioGroupItem.displayName = "RadioGroupItem";
+
+
+
+
+exports.RadioGroup = RadioGroup; exports.RadioGroupItem = RadioGroupItem;
+//# sourceMappingURL=chunk-562W4FCG.cjs.map

package/dist/chunk-562W4FCG.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/isaac/vega/lyra/lyra-ds.v3/packages/lyra-ds/dist/chunk-562W4FCG.cjs","../src/components/radio-group.tsx"],"names":[],"mappings":"AAAA,2cAAY;AACZ;AACE;AACF,wDAA6B;AAC7B;AACA;ACHA,2EAAuB;AACvB,+HAAiC;AA6B7B,+CAAA;AAhBJ,IAAM,WAAA,EAAmB,KAAA,CAAA,UAAA;AAAA,EAIvB,CACE;AAAA,IACE,KAAA;AAAA,IACA,YAAA;AAAA,IACA,aAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA,EAAc,UAAA;AAAA,IACd,SAAA;AAAA,IACA;AAAA,EACF,CAAA,EACA,GAAA,EAAA,mBAEA,6BAAA;AAAA,IAAiB,eAAA,CAAA,IAAA;AAAA,IAAhB;AAAA,MACC,GAAA;AAAA,MACA,KAAA;AAAA,MACA,YAAA;AAAA,MACA,aAAA;AAAA,MACA,QAAA;AAAA,MACA,WAAA;AAAA,MACA,SAAA,EAAW,kCAAA;AAAA,QACT,MAAA;AAAA,QACA,YAAA,IAAgB,WAAA,EAAa,iBAAA,EAAmB,0BAAA;AAAA,QAChD;AAAA,MACF,CAAA;AAAA,MAEC;AAAA,IAAA;AAAA,EACH;AAEJ,CAAA;AAUA,IAAM,eAAA,EAAuB,KAAA,CAAA,UAAA,CAG3B,CAAC,EAAE,KAAA,EAAO,KAAA,EAAO,WAAA,EAAa,QAAA,EAAU,EAAA,EAAI,OAAO,CAAA,EAAG,GAAA,EAAA,GAAQ;AAC9D,EAAA,MAAM,YAAA,EAAoB,KAAA,CAAA,KAAA,CAAM,CAAA;AAChC,EAAA,MAAM,GAAA,mBAAK,MAAA,UAAU,aAAA;AAErB,EAAA,uBACE,8BAAA,KAAC,EAAA,EAAI,SAAA,EAAW,kCAAA,wBAAG,EAA0B,SAAA,GAAY,+BAA+B,CAAA,EACtF,QAAA,EAAA;AAAA,oBAAA,6BAAA;AAAA,MAAiB,eAAA,CAAA,IAAA;AAAA,MAAhB;AAAA,QACC,GAAA;AAAA,QACA,EAAA;AAAA,QACA,KAAA;AAAA,QACA,QAAA;AAAA,QACA,SAAA,EAAW,kCAAA;AAAA,UACT,4EAAA;AAAA,UACA,mDAAA;AAAA,UACA,0HAAA;AAAA,UACA,mGAAA;AAAA,UACA,6BAAA;AAAA,UACA;AAAA,QACF,CAAA;AAAA,QAEA,QAAA,kBAAA,6BAAA;AAAA,UAAiB,eAAA,CAAA,SAAA;AAAA,UAAhB;AAAA,YACC,SAAA,EAAU,kCAAA;AAAA,YAEV,QAAA,kBAAA,6BAAA,MAAC,EAAA,EAAK,SAAA,EAAU,uCAAA,CAAuC;AAAA,UAAA;AAAA,QACzD;AAAA,MAAA;AAAA,IACF,CAAA;AAAA,oBAEA,8BAAA,KAAC,EAAA,EAAI,SAAA,EAAU,eAAA,EACb,QAAA,EAAA;AAAA,sBAAA,6BAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,OAAA,EAAS,EAAA;AAAA,UACT,SAAA,EAAW,kCAAA;AAAA,YACT,gFAAA;AAAA,YACA,SAAA,GAAY;AAAA,UACd,CAAA;AAAA,UAEC,QAAA,EAAA;AAAA,QAAA;AAAA,MACH,CAAA;AAAA,MACC,YAAA,mBACC,6BAAA,MAAC,EAAA,EAAK,SAAA,EAAU,wDAAA,EACb,QAAA,EAAA,YAAA,CACH;AAAA,IAAA,EAAA,CAEJ;AAAA,EAAA,EAAA,CACF,CAAA;AAEJ,CAAC,CAAA;AAED,UAAA,CAAW,YAAA,EAAc,YAAA;AACzB,cAAA,CAAe,YAAA,EAAc,gBAAA;AD3B7B;AACA;AACE;AACA;AACF,yEAAC","file":"/home/isaac/vega/lyra/lyra-ds.v3/packages/lyra-ds/dist/chunk-562W4FCG.cjs","sourcesContent":[null,"\"use client\";\n\nimport * as React from \"react\";\nimport * as RadixRadioGroup from \"@radix-ui/react-radio-group\";\nimport { cn } from \"../lib/utils\";\n\nexport interface RadioGroupProps {\n  value?: string;\n  defaultValue?: string;\n  onValueChange?: (value: string) => void;\n  disabled?: boolean;\n  orientation?: \"horizontal\" | \"vertical\";\n  className?: string;\n  children: React.ReactNode;\n}\n\nconst RadioGroup = React.forwardRef<\n  React.ComponentRef<typeof RadixRadioGroup.Root>,\n  RadioGroupProps\n>(\n  (\n    {\n      value,\n      defaultValue,\n      onValueChange,\n      disabled,\n      orientation = \"vertical\",\n      className,\n      children,\n    },\n    ref\n  ) => (\n    <RadixRadioGroup.Root\n      ref={ref}\n      value={value}\n      defaultValue={defaultValue}\n      onValueChange={onValueChange}\n      disabled={disabled}\n      orientation={orientation}\n      className={cn(\n        \"flex\",\n        orientation === \"vertical\" ? \"flex-col gap-2\" : \"flex-row flex-wrap gap-4\",\n        className\n      )}\n    >\n      {children}\n    </RadixRadioGroup.Root>\n  )\n);\n\nexport interface RadioGroupItemProps {\n  value: string;\n  label: string;\n  description?: string;\n  disabled?: boolean;\n  id?: string;\n}\n\nconst RadioGroupItem = React.forwardRef<\n  React.ComponentRef<typeof RadixRadioGroup.Item>,\n  RadioGroupItemProps\n>(({ value, label, description, disabled, id: idProp }, ref) => {\n  const generatedId = React.useId();\n  const id = idProp ?? generatedId;\n\n  return (\n    <div className={cn(\"flex items-start gap-3\", disabled && \"opacity-50 cursor-not-allowed\")}>\n      <RadixRadioGroup.Item\n        ref={ref}\n        id={id}\n        value={value}\n        disabled={disabled}\n        className={cn(\n          \"mt-0.5 size-4 shrink-0 rounded-full border-2 border-[var(--color-outline)]\",\n          \"transition-colors duration-[var(--duration-fast)]\",\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--state-focus-ring)] focus-visible:ring-offset-2\",\n          \"data-[state=checked]:border-[var(--color-primary)] data-[state=checked]:bg-[var(--color-primary)]\",\n          \"disabled:cursor-not-allowed\",\n          \"relative flex items-center justify-center\"\n        )}\n      >\n        <RadixRadioGroup.Indicator\n          className=\"flex items-center justify-center\"\n        >\n          <span className=\"size-1.5 rounded-full bg-white block\" />\n        </RadixRadioGroup.Indicator>\n      </RadixRadioGroup.Item>\n\n      <div className=\"flex flex-col\">\n        <label\n          htmlFor={id}\n          className={cn(\n            \"text-body-md cursor-pointer text-[var(--color-on-surface)] leading-none pt-0.5\",\n            disabled && \"cursor-not-allowed\"\n          )}\n        >\n          {label}\n        </label>\n        {description && (\n          <span className=\"text-body-sm text-[var(--color-on-surface-var)] mt-0.5\">\n            {description}\n          </span>\n        )}\n      </div>\n    </div>\n  );\n});\n\nRadioGroup.displayName = \"RadioGroup\";\nRadioGroupItem.displayName = \"RadioGroupItem\";\n\nexport { RadioGroup, RadioGroupItem };\n"]}

package/dist/chunk-5SCF3EGT.cjs

@@ -0,0 +1,13 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+
+// src/lib/utils.ts
+var _clsx = require('clsx');
+var _tailwindmerge = require('tailwind-merge');
+function cn(...inputs) {
+  return _tailwindmerge.twMerge.call(void 0, _clsx.clsx.call(void 0, inputs));
+}
+
+
+
+exports.cn = cn;
+//# sourceMappingURL=chunk-5SCF3EGT.cjs.map

package/dist/chunk-5SCF3EGT.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/isaac/vega/lyra/lyra-ds.v3/packages/lyra-ds/dist/chunk-5SCF3EGT.cjs","../src/lib/utils.ts"],"names":[],"mappings":"AAAA,qFAAY;AACZ;AACA;ACFA,4BAAsC;AACtC,+CAAwB;AAEjB,SAAS,EAAA,CAAA,GAAM,MAAA,EAAsB;AAC1C,EAAA,OAAO,oCAAA,wBAAQ,MAAW,CAAC,CAAA;AAC7B;ADGA;AACA;AACE;AACF,gBAAC","file":"/home/isaac/vega/lyra/lyra-ds.v3/packages/lyra-ds/dist/chunk-5SCF3EGT.cjs","sourcesContent":[null,"import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n"]}

package/dist/chunk-5XB7CPVP.cjs

@@ -0,0 +1,34 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+
+
+var _chunk5SCF3EGTcjs = require('./chunk-5SCF3EGT.cjs');
+
+// src/components/filter-chips.tsx
+var _jsxruntime = require('react/jsx-runtime');
+function FilterChips({ filters, active, onChange }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center gap-1 overflow-x-auto", children: filters.map((f) => {
+    const isActive = f.value === active;
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "button",
+      {
+        type: "button",
+        onClick: () => onChange(f.value),
+        className: _chunk5SCF3EGTcjs.cn.call(void 0, 
+          "inline-flex items-center gap-1 px-3 py-1 rounded-[var(--radius-md)] text-[13px] font-semibold whitespace-nowrap transition-colors",
+          isActive ? "bg-[var(--color-primary)] text-white" : "bg-transparent text-[var(--color-on-surface-var)] hover:bg-[var(--color-surf-container-low)]"
+        ),
+        children: [
+          f.label,
+          " ",
+          f.count
+        ]
+      },
+      f.value
+    );
+  }) });
+}
+
+
+
+exports.FilterChips = FilterChips;
+//# sourceMappingURL=chunk-5XB7CPVP.cjs.map

package/dist/chunk-5XB7CPVP.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/isaac/vega/lyra/lyra-ds.v3/packages/lyra-ds/dist/chunk-5XB7CPVP.cjs","../src/components/filter-chips.tsx"],"names":[],"mappings":"AAAA,qFAAY;AACZ;AACE;AACF,wDAA6B;AAC7B;AACA;ACYI,+CAAA;AAFJ,SAAS,WAAA,CAAY,EAAE,OAAA,EAAS,MAAA,EAAQ,SAAS,CAAA,EAAqB;AACpE,EAAA,uBACE,6BAAA,KAAC,EAAA,EAAI,SAAA,EAAU,yCAAA,EACZ,QAAA,EAAA,OAAA,CAAQ,GAAA,CAAI,CAAC,CAAA,EAAA,GAAM;AAClB,IAAA,MAAM,SAAA,EAAW,CAAA,CAAE,MAAA,IAAU,MAAA;AAC7B,IAAA,uBACE,8BAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QAEC,IAAA,EAAK,QAAA;AAAA,QACL,OAAA,EAAS,CAAA,EAAA,GAAM,QAAA,CAAS,CAAA,CAAE,KAAK,CAAA;AAAA,QAC/B,SAAA,EAAW,kCAAA;AAAA,UACT,mIAAA;AAAA,UACA,SAAA,EACI,uCAAA,EACA;AAAA,QACN,CAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,CAAA,CAAE,KAAA;AAAA,UAAM,GAAA;AAAA,UAAE,CAAA,CAAE;AAAA,QAAA;AAAA,MAAA,CAAA;AAAA,MAVR,CAAA,CAAE;AAAA,IAWT,CAAA;AAAA,EAEJ,CAAC,EAAA,CACH,CAAA;AAEJ;ADTA;AACA;AACE;AACF,kCAAC","file":"/home/isaac/vega/lyra/lyra-ds.v3/packages/lyra-ds/dist/chunk-5XB7CPVP.cjs","sourcesContent":[null,"import * as React from \"react\";\nimport { cn } from \"../lib/utils\";\n\nexport interface ListPageFilter {\n  label: string;\n  value: string;\n  count: number;\n}\n\nexport interface FilterChipsProps {\n  filters: ListPageFilter[];\n  active: string;\n  onChange: (value: string) => void;\n}\n\nfunction FilterChips({ filters, active, onChange }: FilterChipsProps) {\n  return (\n    <div className=\"flex items-center gap-1 overflow-x-auto\">\n      {filters.map((f) => {\n        const isActive = f.value === active;\n        return (\n          <button\n            key={f.value}\n            type=\"button\"\n            onClick={() => onChange(f.value)}\n            className={cn(\n              \"inline-flex items-center gap-1 px-3 py-1 rounded-[var(--radius-md)] text-[13px] font-semibold whitespace-nowrap transition-colors\",\n              isActive\n                ? \"bg-[var(--color-primary)] text-white\"\n                : \"bg-transparent text-[var(--color-on-surface-var)] hover:bg-[var(--color-surf-container-low)]\"\n            )}\n          >\n            {f.label} {f.count}\n          </button>\n        );\n      })}\n    </div>\n  );\n}\n\nexport { FilterChips };\n"]}