@lindaui/blocks 0.0.2 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/llms.txt +108 -0
- package/package.json +6 -5
package/llms.txt
ADDED
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
# @lindaui/blocks
|
|
2
|
+
|
|
3
|
+
> Composed UI sections built on **@lindaui/ui** primitives — auth forms, master-detail,
|
|
4
|
+
> lists, dialogs, media viewers, and charts. Importable npm package (NOT a copy-paste
|
|
5
|
+
> registry). Each block has its OWN flat API and does not leak HeroUI/RAC types.
|
|
6
|
+
> This file is for coding agents: every entry, import path, and public API.
|
|
7
|
+
|
|
8
|
+
All blocks are generic, controlled/mobile-first, and contain zero data-fetching, no
|
|
9
|
+
`next`, no `sonner`. Controlled blocks receive state + handlers from you. For the exact
|
|
10
|
+
type of any export, read `node_modules/@lindaui/blocks/dist/<name>.d.ts`.
|
|
11
|
+
|
|
12
|
+
## Install
|
|
13
|
+
|
|
14
|
+
```bash
|
|
15
|
+
pnpm add @lindaui/blocks @lindaui/ui @lindaui/tokens
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
Peers you provide: `react >=19`, `react-dom >=19`, `react-hook-form >=7`, `recharts >=3`
|
|
19
|
+
(only for chart blocks), plus `@lindaui/ui` and `@lindaui/tokens`. Import the CSS once
|
|
20
|
+
at app root: `import "@lindaui/tokens/css";`.
|
|
21
|
+
|
|
22
|
+
## Import convention
|
|
23
|
+
|
|
24
|
+
One block per import path: `@lindaui/blocks/<name>`.
|
|
25
|
+
|
|
26
|
+
---
|
|
27
|
+
|
|
28
|
+
## Auth & forms
|
|
29
|
+
|
|
30
|
+
### @lindaui/blocks/login-form
|
|
31
|
+
`<LoginForm onSubmit={(values)=>...} title emailLabel passwordLabel submitLabel loading
|
|
32
|
+
error bare />` — RHF handled internally; `onSubmit({email,password})`. `bare` drops the
|
|
33
|
+
Card/title for embedding inside a shell (e.g. AuthLayout).
|
|
34
|
+
|
|
35
|
+
### @lindaui/blocks/auth-layout
|
|
36
|
+
Split-screen auth shell. Slots: `logo`, `compactLogo`, `brandHeadline`,
|
|
37
|
+
`brandDescription`, `brandFeatures: {icon,label}[]`, `brandFooter`, `title`,
|
|
38
|
+
`description`, `footer`, and `children` (the form). Desktop shows a dark brand panel;
|
|
39
|
+
without `brandHeadline`/`brandFeatures` it collapses to a single centered form column.
|
|
40
|
+
|
|
41
|
+
### @lindaui/blocks/auth-provider
|
|
42
|
+
Context `{ user }` + `useAuth()` hook. Wrap your app; read the current user anywhere.
|
|
43
|
+
|
|
44
|
+
### @lindaui/blocks/field-array-form
|
|
45
|
+
A select + repeatable rows form via RHF `useFieldArray`.
|
|
46
|
+
|
|
47
|
+
## Lists & master-detail (controlled)
|
|
48
|
+
|
|
49
|
+
### @lindaui/blocks/list-item
|
|
50
|
+
Selectable row. Controlled selected state + `onSelect`.
|
|
51
|
+
|
|
52
|
+
### @lindaui/blocks/list-pane
|
|
53
|
+
Filterable/searchable list shell with loading/empty/error states. Controlled:
|
|
54
|
+
`filters: {key,label,count?}[]`, `activeFilter`, `onFilterChange`, `searchValue`,
|
|
55
|
+
`onSearchChange`, `loading`, `error`, `onRetry`, `isEmpty`, empty/error slots. Items go
|
|
56
|
+
in via `children`. Does NOT filter for you — filter your data (use `@lindaui/ui/search`).
|
|
57
|
+
|
|
58
|
+
### @lindaui/blocks/detail-panel
|
|
59
|
+
Master-detail right side: empty state + header + meta card + CTA. Controlled.
|
|
60
|
+
|
|
61
|
+
### @lindaui/blocks/split-workspace
|
|
62
|
+
Responsive split `media | panel` (controlled). Props: `media`, `panel`, `overlay?`,
|
|
63
|
+
`back?`. Two-column on desktop, stacked on mobile (uses `useIsDesktop`).
|
|
64
|
+
|
|
65
|
+
## Dialogs & overlays
|
|
66
|
+
|
|
67
|
+
### @lindaui/blocks/confirm-dialog
|
|
68
|
+
`<ConfirmDialog open onOpenChange onConfirm title description confirmLabel cancelLabel
|
|
69
|
+
icon destructive identity={{name}} />` — `destructive` → red confirm button + red icon
|
|
70
|
+
box; `identity` → actor chip under the description.
|
|
71
|
+
|
|
72
|
+
### @lindaui/blocks/image-viewer
|
|
73
|
+
Full-bleed media viewer with zoom (uses `viewer-*` tokens).
|
|
74
|
+
|
|
75
|
+
### @lindaui/blocks/recording-overlay
|
|
76
|
+
Voice-recording overlay: timer / waveform / stop.
|
|
77
|
+
|
|
78
|
+
## Documents
|
|
79
|
+
|
|
80
|
+
### @lindaui/blocks/document-panel
|
|
81
|
+
Header + per-state body + footer. Controlled.
|
|
82
|
+
|
|
83
|
+
### @lindaui/blocks/document-reader
|
|
84
|
+
Sectioned text reader.
|
|
85
|
+
|
|
86
|
+
## Charts (over @lindaui/ui/chart + recharts)
|
|
87
|
+
|
|
88
|
+
All chart blocks share a flat API:
|
|
89
|
+
`data: Record<string,string|number>[]`, `config: ChartConfig` (serie → {label,color}),
|
|
90
|
+
`categoryKey: string`, `series: string[]` (or `valueKey`/`nameKey` for pie/radial),
|
|
91
|
+
`variant?`, `className?`. Series color comes from `var(--color-<key>)` that
|
|
92
|
+
`ChartContainer` injects from `config`; dark mode is free.
|
|
93
|
+
|
|
94
|
+
```tsx
|
|
95
|
+
import { AreaChart } from "@lindaui/blocks/area-chart";
|
|
96
|
+
const config = { sales: { label: "Sales", color: "var(--chart-1)" } };
|
|
97
|
+
<AreaChart data={data} config={config} categoryKey="month" series={["sales"]} />
|
|
98
|
+
```
|
|
99
|
+
|
|
100
|
+
- `@lindaui/blocks/area-chart` — `variant: "default"|"stacked"|"gradient"`
|
|
101
|
+
- `@lindaui/blocks/bar-chart`
|
|
102
|
+
- `@lindaui/blocks/line-chart`
|
|
103
|
+
- `@lindaui/blocks/pie-chart`
|
|
104
|
+
- `@lindaui/blocks/radar-chart`
|
|
105
|
+
- `@lindaui/blocks/radial-chart`
|
|
106
|
+
- `@lindaui/blocks/stat-card` — KPI card: label/value/delta/sparkline
|
|
107
|
+
- `@lindaui/blocks/chart-card` — Card shell wrapping a chart
|
|
108
|
+
- `@lindaui/blocks/stats-grid` — responsive grid of KPI stat-cards
|
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lindaui/blocks",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.3",
|
|
4
4
|
"description": "Composed UI sections (auth, lists, master-detail, charts) built on @lindaui/ui — importable npm package, not a copy-paste registry.",
|
|
5
5
|
"author": "Franco Carballar <francocarballar@gmail.com>",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"repository": {
|
|
8
8
|
"type": "git",
|
|
9
|
-
"url": "git+https://github.com/francocarballar/
|
|
9
|
+
"url": "git+https://github.com/francocarballar/lindaui.git",
|
|
10
10
|
"directory": "packages/blocks"
|
|
11
11
|
},
|
|
12
12
|
"publishConfig": {
|
|
@@ -107,7 +107,8 @@
|
|
|
107
107
|
"files": [
|
|
108
108
|
"dist",
|
|
109
109
|
"LICENSE",
|
|
110
|
-
"README.md"
|
|
110
|
+
"README.md",
|
|
111
|
+
"llms.txt"
|
|
111
112
|
],
|
|
112
113
|
"peerDependencies": {
|
|
113
114
|
"react": ">=19",
|
|
@@ -137,8 +138,8 @@
|
|
|
137
138
|
"zod": "^3.23.0",
|
|
138
139
|
"@hookform/resolvers": "^3.9.0",
|
|
139
140
|
"typescript": "^6.0.3",
|
|
140
|
-
"@lindaui/
|
|
141
|
-
"@lindaui/
|
|
141
|
+
"@lindaui/tokens": "0.0.3",
|
|
142
|
+
"@lindaui/ui": "0.0.3"
|
|
142
143
|
},
|
|
143
144
|
"scripts": {
|
|
144
145
|
"build": "bunchee --no-dts && tsc -p tsconfig.build.json",
|