admin-ui-starter-kit 0.1.1 → 0.1.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.
@@ -0,0 +1,126 @@
1
+ ---
2
+ name: admin-ui-consumer-migration
3
+ description: Use when migrating a React app to consume `admin-ui-starter-kit`, replacing copied local UI folders, auditing exact package imports, deciding what stays app-owned, or wiring framework adapters such as Inertia without recreating local package mirrors.
4
+ ---
5
+
6
+ # Admin UI Consumer Migration
7
+
8
+ Use this skill inside consuming apps, not when editing package internals.
9
+
10
+ Goal: move reusable UI to `admin-ui-starter-kit` imports while keeping
11
+ app-specific routing, APIs, auth, translations, brand assets, and domain logic
12
+ inside the app.
13
+
14
+ ## First reads
15
+
16
+ When available in the installed package or repo, read these before editing:
17
+
18
+ 1. `MIGRATION.md` — migration sequence and deletion rules.
19
+ 2. `COMPONENT_SELECTION.md` — which component/import to use.
20
+ 3. `INTEGRATION.md` — install, provider, exact import, and framework wiring.
21
+ 4. `.agents/skills/component-library-rules/references/components/INDEX.json` —
22
+ searchable component index.
23
+
24
+ Do not bulk-load every component doc. Use the index, then read only the matching
25
+ component file.
26
+
27
+ ## Migration order
28
+
29
+ 1. Install package, stylesheet, and `<UIProvider>`.
30
+ 2. Replace typography, buttons, badges, cards, and simple display components.
31
+ 3. Replace repeated row and metadata patterns with `Item` and `MetadataList`.
32
+ 4. Replace form rows with `FormField` / `ControlledFormField`.
33
+ 5. Replace tables, filters, metrics, comments, overlays, and other features.
34
+ 6. Replace page/header/sidebar layout surfaces last.
35
+ 7. Delete copied local folders only after imports, typecheck, and build are
36
+ clean.
37
+
38
+ ## Exact package imports only
39
+
40
+ Use:
41
+
42
+ ```tsx
43
+ import { Button } from 'admin-ui-starter-kit/base/buttons';
44
+ import { Text } from 'admin-ui-starter-kit/typography';
45
+ import { MetadataList } from 'admin-ui-starter-kit/base/display/metadata';
46
+ import { Comments } from 'admin-ui-starter-kit/features/comments';
47
+ ```
48
+
49
+ Do not use:
50
+
51
+ ```tsx
52
+ import { Button } from '@/components/ui/base/buttons';
53
+ import { Button } from 'admin-ui-starter-kit/base';
54
+ import { MetadataList } from 'admin-ui-starter-kit/base/display/metadata/metadata-list';
55
+ ```
56
+
57
+ If a path is not listed in `package.json` `exports`, treat it as private.
58
+
59
+ ## Adapter rule
60
+
61
+ Adapters are allowed only when they bind app-specific behaviour.
62
+
63
+ Good:
64
+
65
+ ```tsx
66
+ import { Link, router } from '@inertiajs/react';
67
+ import { Button, type ButtonProps } from 'admin-ui-starter-kit/base/buttons';
68
+
69
+ export function InertiaButton({ href, ...props }: ButtonProps & { href: string }) {
70
+ return <Button {...props} onClick={() => router.visit(href)} />;
71
+ }
72
+ ```
73
+
74
+ Bad:
75
+
76
+ ```ts
77
+ export { Button } from 'admin-ui-starter-kit/base/buttons';
78
+ ```
79
+
80
+ Do not create local mirrors, barrels, or aliases that hide package imports.
81
+ Agents should replace call-site imports directly unless a wrapper adds routing,
82
+ auth, API, translation, or domain behaviour.
83
+
84
+ ## Keep app-owned
85
+
86
+ Do not migrate these into package imports or generic wrappers:
87
+
88
+ - Brand/logo assets and product marks.
89
+ - Error boundaries.
90
+ - Auth, permission gates, tenant/workspace selectors.
91
+ - Route-aware global search content and API-backed search.
92
+ - Domain-specific cards/features that encode business rules.
93
+ - Inertia/router/query clients, Wayfinder actions, API calls, app i18n.
94
+ - Page-level data loading and layout orchestration.
95
+
96
+ ## Useful commands
97
+
98
+ Run in the consuming app:
99
+
100
+ ```bash
101
+ npx admin-ui-starter-kit-audit
102
+ npx admin-ui-starter-kit-audit --fix
103
+ npm run typecheck
104
+ npm run build
105
+ ```
106
+
107
+ Use `--fix` only for conservative import rewrites from known copied paths.
108
+ Review the diff before deleting local folders.
109
+
110
+ ## Component selection shortcuts
111
+
112
+ | Need | Import |
113
+ | --- | --- |
114
+ | Text/headings | `admin-ui-starter-kit/typography` |
115
+ | Buttons | `admin-ui-starter-kit/base/buttons` |
116
+ | Badges | `admin-ui-starter-kit/base/badge` |
117
+ | Card shell | `admin-ui-starter-kit/base/cards` |
118
+ | Icon/avatar/title row | `admin-ui-starter-kit/base/item` |
119
+ | Label/value metadata | `admin-ui-starter-kit/base/display/metadata` |
120
+ | Form rows | `admin-ui-starter-kit/base/forms` |
121
+ | Tables | `admin-ui-starter-kit/base/table` |
122
+ | Filters | `admin-ui-starter-kit/features/filters` |
123
+ | Comments | `admin-ui-starter-kit/features/comments` |
124
+ | Dialogs/drawers | `admin-ui-starter-kit/features/overlays` |
125
+ | Metrics/charts | `admin-ui-starter-kit/composed/analytics` |
126
+ | Page/header/sidebar | `admin-ui-starter-kit/layout/page`, `/header`, `/sidebar` |
@@ -56,6 +56,11 @@ These deeper guides live alongside this file under `references/`. The skill stay
56
56
 
57
57
  Don't read all of them — find the matching guide for the immediate task, follow it, return.
58
58
 
59
+ Consumer-app migration guidance lives outside this maintainer skill:
60
+ [`../admin-ui-consumer-migration/SKILL.md`](../admin-ui-consumer-migration/SKILL.md),
61
+ `MIGRATION.md`, and `COMPONENT_SELECTION.md`. Use those when replacing copied
62
+ local UI in downstream apps.
63
+
59
64
  ## Component reference index
60
65
 
61
66
  Every component documented in the showcase has a generated markdown
@@ -99,9 +104,14 @@ to see how the library uses it before writing fresh code.
99
104
  The references are generated from the MDX showcase by
100
105
  `npm run docs:sync-skill`; CI runs the freshness check via `npm run verify`.
101
106
 
102
- ## This is the only skill in this repo
107
+ ## Maintainer skill scope
103
108
 
104
- There are no other skills shipped with this repo. The harness may surface generic skills (`frontend-design`, `shadcn`, `tailwind-v4-shadcn`, etc.) from the user's plugin set, but **this skill is the source of truth for anything inside `src/components/**`**. Where they conflict, this skill wins. The relevant material from those generic skills is inlined here:
109
+ This skill is the source of truth for anything inside `src/components/**`.
110
+ The separate `admin-ui-consumer-migration` skill is for downstream app
111
+ migrations. The harness may surface generic skills (`frontend-design`,
112
+ `shadcn`, `tailwind-v4-shadcn`, etc.) from the user's plugin set, but for this
113
+ package's component internals, this skill wins. The relevant material from
114
+ those generic skills is inlined here:
105
115
 
106
116
  - **Visual taste / "escape generic AI aesthetics"** → see rule 16 (visual evaluation) and the "Tone for visual work" section in `AGENTS.md`. The library voice is calm, neutral, dense without being cramped — admin density, not marketing flash.
107
117
  - **Adding a shadcn primitive** → step 0 of [`references/base-wrapper.md`](references/base-wrapper.md): `npx shadcn@latest add <primitive>` lands the file in `src/components/ui/<primitive>.tsx`. Then write the wrapper.
@@ -784,6 +794,11 @@ from `admin-ui-starter-kit/base/display/metadata` so consumers do not need to
784
794
  load the broader `base/display` barrel. Never document file-level paths such as
785
795
  `admin-ui-starter-kit/base/display/metadata/metadata-list`.
786
796
 
797
+ The package `exports` map must list every public family as an exact key:
798
+ `./base/buttons`, `./features/comments`, `./layout/page`, etc. Do not use
799
+ wildcard exports such as `./base/*`, and do not use null wildcard blockers such
800
+ as `./base/*/*`; bundlers can treat those patterns inconsistently.
801
+
787
802
  Base UI-backed triggers use Base UI's `render` prop, not Radix's `asChild`.
788
803
  For dropdown menus, write:
789
804
 
@@ -41,6 +41,12 @@ Do not use or document broad `admin-ui-starter-kit/base`,
41
41
  They are intentionally not exported so optional peers stay isolated to the exact
42
42
  component family that needs them.
43
43
 
44
+ `package.json` must publish those component families as explicit exact keys,
45
+ not wildcard package exports. For example, publish `./base/buttons` and
46
+ `./features/comments`, not `./base/*` or `./features/*`. Do not use null
47
+ wildcard blockers such as `./base/*/*`; exact exports already keep undocumented
48
+ nested paths private and avoid bundler resolver drift.
49
+
44
50
  Most public boundaries are first-level families. A nested subfamily is public
45
51
  only when it has an explicit `package.json` export and `vite.lib.config.ts`
46
52
  entry. Current intentional nested subfamily:
package/AGENTS.md CHANGED
@@ -43,7 +43,7 @@ Read it once for context; it is not a live roadmap.
43
43
 
44
44
  ## Mandatory reading before any code change
45
45
 
46
- The **only** mandatory skill in this repo is
46
+ The **only** mandatory maintainer skill in this repo is
47
47
  [`component-library-rules`](.agents/skills/component-library-rules/SKILL.md).
48
48
  It encodes 24 rules covering layer order, typography, density, tokens,
49
49
  strings/i18n, framework-agnostic contracts, slot/render-prop
@@ -59,9 +59,11 @@ pages, ui-provider, consumer wiring, import paths, visual evaluation,
59
59
  testing, layout, composed-domains. Pull the matching one when the work
60
60
  fits; don't read all of them.
61
61
 
62
- This skill is **self-sufficient by design** — there are no other skills
63
- shipped with this repo. If a topic isn't covered, ask before inventing
64
- a pattern.
62
+ The repo also ships
63
+ [`admin-ui-consumer-migration`](.agents/skills/admin-ui-consumer-migration/SKILL.md)
64
+ for downstream apps migrating copied UI into the package. Use that skill in
65
+ consumer repos; use `component-library-rules` when changing this package.
66
+ If a topic isn't covered, ask before inventing a pattern.
65
67
 
66
68
  ## The architectural layers
67
69
 
@@ -117,8 +119,11 @@ Hard rules (full detail in the skill):
117
119
 
118
120
  - **Entry**: `src/preview/PreviewApp.tsx` (showcase) and the public
119
121
  `package.json` `exports` map (`.`, `./ui-provider`,
120
- `./typography`, `./base/*`, `./composed/*`, `./features/*`,
121
- `./layout`, `./layout/*`, `./lib/strings`, `./lib/utils`).
122
+ `./typography`, exact `./base/<family>`, exact
123
+ `./composed/<family>`, exact `./features/<feature>`, `./layout`,
124
+ exact `./layout/<family>`, `./lib/strings`, `./lib/utils`).
125
+ The exports map must use exact keys, not wildcard/null blocker
126
+ patterns.
122
127
  - **`<UIProvider>`** (`@/lib/ui-provider`) — the **only** library-level
123
128
  provider. Holds opinionated display defaults (`money.defaultCurrency`,
124
129
  `dates.weekStartsOn`, `badge.defaultSize`, `card.defaultPadding`, …).
@@ -0,0 +1,115 @@
1
+ # Component Selection Guide
2
+
3
+ Use this when deciding which package entrypoint belongs at a call site.
4
+
5
+ Public imports are exact. If a path is not listed in `package.json` `exports`
6
+ or documented here, treat it as private.
7
+
8
+ ## Common decisions
9
+
10
+ | Need | Use | Import |
11
+ | --- | --- | --- |
12
+ | Text, headings, labels, links | `Text`, `Heading`, `Label`, `TextLink` | `admin-ui-starter-kit/typography` |
13
+ | Button or icon button | `Button`, `TextButton`, button variants | `admin-ui-starter-kit/base/buttons` |
14
+ | Status pill or count badge | `Badge` | `admin-ui-starter-kit/base/badge` |
15
+ | Card shell | `SmartCard` | `admin-ui-starter-kit/base/cards` |
16
+ | Row with icon/avatar/title/meta/actions | `Item` family | `admin-ui-starter-kit/base/item` |
17
+ | Label/value metadata | `MetadataList` | `admin-ui-starter-kit/base/display/metadata` |
18
+ | Tooltip, avatar, separator, inline stat | display family | `admin-ui-starter-kit/base/display` |
19
+ | Form label/control/error row | `FormField`, `ControlledFormField` | `admin-ui-starter-kit/base/forms` |
20
+ | Inputs, selects, textareas, QR fields | form field exports | `admin-ui-starter-kit/base/forms` |
21
+ | Searchable select | `Combobox` | `admin-ui-starter-kit/base/combobox` |
22
+ | Popover menu or command menu | `PopoverMenu`, `Command` | `admin-ui-starter-kit/base/popover-menu`, `admin-ui-starter-kit/base/command` |
23
+ | Dropdown navigation menus | navigation family | `admin-ui-starter-kit/base/navigation` |
24
+ | Data table | `DataTable` | `admin-ui-starter-kit/base/table` |
25
+ | Date picker or date range picker | date picker family | `admin-ui-starter-kit/base/date-pickers` |
26
+ | Map or place autocomplete | map family | `admin-ui-starter-kit/base/map` |
27
+ | KPI cards and charts | analytics surfaces | `admin-ui-starter-kit/composed/analytics` |
28
+ | Commerce/order/product surfaces | commerce surfaces | `admin-ui-starter-kit/composed/commerce` |
29
+ | Timeline | timeline surfaces | `admin-ui-starter-kit/composed/timelines` |
30
+ | Comments panel | `Comments` | `admin-ui-starter-kit/features/comments` |
31
+ | Filter bar/facets | filters feature | `admin-ui-starter-kit/features/filters` |
32
+ | Dialog, drawer, alert dialog | overlays feature | `admin-ui-starter-kit/features/overlays` |
33
+ | Global search shell | global search feature | `admin-ui-starter-kit/features/global-search` |
34
+ | Mentions/typeahead | mentions or suggestions feature | `admin-ui-starter-kit/features/mentions`, `admin-ui-starter-kit/features/suggestions` |
35
+ | Rich text editor | TipTap-backed editor | `admin-ui-starter-kit/features/rich-text-editor` |
36
+ | Page title/actions/breadcrumb chrome | page layout | `admin-ui-starter-kit/layout/page` |
37
+ | Header shell/search/action slots | header layout | `admin-ui-starter-kit/layout/header` |
38
+ | Sidebar shell | sidebar layout | `admin-ui-starter-kit/layout/sidebar` |
39
+
40
+ ## Decision tree
41
+
42
+ 1. Is it plain user-facing text?
43
+ Use `typography`. Do not hand-roll `text-xs text-muted-foreground` spans.
44
+
45
+ 2. Is it a primitive UI control or presentational wrapper?
46
+ Use `base`. Buttons, badges, cards, form fields, popovers, tables, maps,
47
+ display helpers, and item rows live there.
48
+
49
+ 3. Is it a reusable domain-shaped surface built from base components?
50
+ Use `composed`. Metrics, commerce cards, admin rows, timeline surfaces, and
51
+ dense data-display blocks belong there.
52
+
53
+ 4. Does it include feature state, slots, callbacks, or app-level behaviour?
54
+ Use `features`. Comments, filters, search, overlays, mentions, sync, and
55
+ rich text editor live there.
56
+
57
+ 5. Is it page chrome?
58
+ Use `layout`. Keep routing and active-link state in the app.
59
+
60
+ 6. Does it hardcode backend, auth, routing, app translations, or product
61
+ branding?
62
+ Keep it in the app. Wrap package components only where the wrapper binds
63
+ app-specific behaviour.
64
+
65
+ ## Adapter examples
66
+
67
+ Use an app adapter when you bind framework behaviour:
68
+
69
+ ```tsx
70
+ import { router } from '@inertiajs/react';
71
+ import { Button, type ButtonProps } from 'admin-ui-starter-kit/base/buttons';
72
+
73
+ export function InertiaActionButton({
74
+ href,
75
+ method = 'get',
76
+ ...props
77
+ }: ButtonProps & { href: string; method?: 'get' | 'post' | 'put' | 'delete' }) {
78
+ return <Button {...props} onClick={() => router.visit(href, { method })} />;
79
+ }
80
+ ```
81
+
82
+ Do not create app wrappers that only rename or re-export package components:
83
+
84
+ ```ts
85
+ export { Button } from 'admin-ui-starter-kit/base/buttons';
86
+ ```
87
+
88
+ ## Exact import rules
89
+
90
+ Use:
91
+
92
+ ```tsx
93
+ import { Button } from 'admin-ui-starter-kit/base/buttons';
94
+ import { Text } from 'admin-ui-starter-kit/typography';
95
+ import { MetadataList } from 'admin-ui-starter-kit/base/display/metadata';
96
+ ```
97
+
98
+ Do not use:
99
+
100
+ ```tsx
101
+ import { Button } from 'admin-ui-starter-kit/base';
102
+ import { MetadataList } from 'admin-ui-starter-kit/base/display/metadata/metadata-list';
103
+ import { Button } from '@/components/ui/base/buttons';
104
+ ```
105
+
106
+ ## Where agents should look
107
+
108
+ 1. `AGENTS.md`
109
+ 2. `.agents/skills/component-library-rules/SKILL.md`
110
+ 3. `.agents/skills/admin-ui-consumer-migration/SKILL.md`
111
+ 4. `.agents/skills/component-library-rules/references/components/INDEX.json`
112
+ 5. The specific component doc under `references/components/*.md`
113
+ 6. `INTEGRATION.md`
114
+ 7. `MIGRATION.md`
115
+ 8. `package.json` `exports`
package/INTEGRATION.md CHANGED
@@ -2,6 +2,11 @@
2
2
 
3
3
  Use this when installing `admin-ui-starter-kit` into a React app.
4
4
 
5
+ If the app already has a copied local design system, follow
6
+ [`MIGRATION.md`](MIGRATION.md) first. Use
7
+ [`COMPONENT_SELECTION.md`](COMPONENT_SELECTION.md) when deciding which exact
8
+ entrypoint replaces a local component.
9
+
5
10
  ## 1. Install the package and required peers
6
11
 
7
12
  ```bash
@@ -40,6 +45,10 @@ Only documented nested subfamily entrypoints are public. For example,
40
45
  `admin-ui-starter-kit/base/display/metadata` so consumers do not need the
41
46
  broader `base/display` barrel or its optional peers.
42
47
 
48
+ The package publishes exact export keys, not wildcard package exports. If an
49
+ import path is not documented or listed in `package.json` `exports`, treat it as
50
+ private even when a declaration file happens to exist under `dist/`.
51
+
43
52
  The root entrypoint is intentionally small:
44
53
 
45
54
  ```tsx
@@ -136,6 +145,7 @@ For a quick smoke test:
136
145
  ```bash
137
146
  npm run typecheck
138
147
  npm run build
148
+ npx admin-ui-starter-kit-audit
139
149
  ```
140
150
 
141
151
  If a build reports a missing optional peer, either install the peer listed
package/MIGRATION.md ADDED
@@ -0,0 +1,235 @@
1
+ # Migration Guide
2
+
3
+ Use this when replacing a copied local design system with the published
4
+ `admin-ui-starter-kit` package.
5
+
6
+ The goal is not to move every UI file into npm. The package owns reusable UI.
7
+ The consuming app owns routing, API calls, auth context, translations, brand
8
+ assets, and domain-specific behaviour.
9
+
10
+ ## 1. Install and mount
11
+
12
+ ```bash
13
+ npm install admin-ui-starter-kit react react-dom tailwindcss lucide-react
14
+ ```
15
+
16
+ If the app still uses `lucide-react` v0, upgrade it as part of the migration.
17
+ This package has a lucide v1 peer.
18
+
19
+ Mount the stylesheet and provider once:
20
+
21
+ ```tsx
22
+ import 'admin-ui-starter-kit/style.css';
23
+ import { UIProvider } from 'admin-ui-starter-kit/ui-provider';
24
+
25
+ <UIProvider
26
+ config={{
27
+ money: { defaultCurrency: 'USD', locale: 'en-US' },
28
+ dates: { weekStartsOn: 1 },
29
+ badge: { defaultSize: 'xs' },
30
+ button: { defaultSize: 'sm' },
31
+ }}
32
+ >
33
+ <App />
34
+ </UIProvider>;
35
+ ```
36
+
37
+ ## 2. Replace local primitives first
38
+
39
+ Start with the low-level imports used everywhere. Keep the changes mechanical
40
+ and verify after each group.
41
+
42
+ ```tsx
43
+ import { Button } from 'admin-ui-starter-kit/base/buttons';
44
+ import { Badge } from 'admin-ui-starter-kit/base/badge';
45
+ import { SmartCard } from 'admin-ui-starter-kit/base/cards';
46
+ import { Text, Heading } from 'admin-ui-starter-kit/typography';
47
+ ```
48
+
49
+ Do not create local mirror files that re-export package primitives. Replace the
50
+ call-site imports directly.
51
+
52
+ ## 3. Replace repeated display patterns
53
+
54
+ Use package components for shapes that repeat across the app:
55
+
56
+ ```tsx
57
+ import { MetadataList } from 'admin-ui-starter-kit/base/display/metadata';
58
+ import { Item, ItemContent, ItemMedia, ItemTitle } from 'admin-ui-starter-kit/base/item';
59
+ ```
60
+
61
+ Use `MetadataList` for label/value data, compact summaries, and entity details.
62
+ Use `Item` for rows with media, title, description, metadata, or actions.
63
+
64
+ ## 4. Replace form rows
65
+
66
+ Use the package form shell before moving larger forms:
67
+
68
+ ```tsx
69
+ import { ControlledFormField, Input, Select } from 'admin-ui-starter-kit/base/forms';
70
+ ```
71
+
72
+ Keep form submission, validation schemas, and API mutation wiring in the app.
73
+ The package should own the field row and control presentation, not the backend
74
+ contract.
75
+
76
+ ## 5. Replace tables, filters, metrics, and overlays
77
+
78
+ Move shared app surfaces after primitives are stable:
79
+
80
+ ```tsx
81
+ import { DataTable } from 'admin-ui-starter-kit/base/table';
82
+ import { FilterProvider } from 'admin-ui-starter-kit/features/filters';
83
+ import { MetricGrid } from 'admin-ui-starter-kit/composed/analytics';
84
+ import { Dialog, Drawer } from 'admin-ui-starter-kit/features/overlays';
85
+ ```
86
+
87
+ Install optional peers only for the entrypoints you import. For example,
88
+ `base/table` needs `@tanstack/react-table`, `composed/analytics` needs
89
+ `recharts`, and `features/rich-text-editor` needs TipTap.
90
+
91
+ ## 6. Replace layouts last
92
+
93
+ Migrate page chrome after shared atoms and features are clean:
94
+
95
+ ```tsx
96
+ import { PageHeader, PageActions } from 'admin-ui-starter-kit/layout/page';
97
+ import { Header, HeaderSearch } from 'admin-ui-starter-kit/layout/header';
98
+ import { AppSidebar, SidebarProvider } from 'admin-ui-starter-kit/layout/sidebar';
99
+ ```
100
+
101
+ Route-aware layout state, active navigation logic, auth menus, and application
102
+ search content stay in the app. The package provides the shell and slots.
103
+
104
+ ## 7. Keep app-owned adapters, not local mirrors
105
+
106
+ A consuming app may create adapters for framework wiring, but not local mirrors.
107
+
108
+ Good:
109
+
110
+ ```tsx
111
+ import { Link } from '@inertiajs/react';
112
+ import { PageHeader, type PageHeaderProps } from 'admin-ui-starter-kit/layout/page';
113
+
114
+ export function AppPageHeader(props: PageHeaderProps) {
115
+ return (
116
+ <PageHeader
117
+ {...props}
118
+ renderLink={(href, children) => <Link href={href}>{children}</Link>}
119
+ />
120
+ );
121
+ }
122
+ ```
123
+
124
+ Bad:
125
+
126
+ ```ts
127
+ export { Button } from 'admin-ui-starter-kit/base/buttons';
128
+ export { Text } from 'admin-ui-starter-kit/typography';
129
+ ```
130
+
131
+ The package owns UI. The app owns routing, API calls, auth context, and
132
+ translations.
133
+
134
+ ## 8. Inertia recipe
135
+
136
+ Keep Inertia imports in the consuming app:
137
+
138
+ ```tsx
139
+ import { Link, router } from '@inertiajs/react';
140
+ import { Button } from 'admin-ui-starter-kit/base/buttons';
141
+ import { Comments } from 'admin-ui-starter-kit/features/comments';
142
+ import { PageHeader } from 'admin-ui-starter-kit/layout/page';
143
+
144
+ <PageHeader
145
+ title="Customers"
146
+ actions={<Button onClick={() => router.visit('/customers/create')}>Create</Button>}
147
+ renderLink={(href, children) => <Link href={href}>{children}</Link>}
148
+ />;
149
+
150
+ <Comments
151
+ comments={comments}
152
+ onSubmit={(values) => router.post(route('comments.store'), values)}
153
+ onDelete={(id) => router.delete(route('comments.destroy', id))}
154
+ strings={{
155
+ empty: t('comments.empty'),
156
+ composerPlaceholder: t('comments.placeholder'),
157
+ }}
158
+ />;
159
+ ```
160
+
161
+ Do not add Inertia adapters to the package. Document app adapters locally when
162
+ they bind routes, Wayfinder actions, translations, or app APIs.
163
+
164
+ ## 9. Do not migrate these
165
+
166
+ Keep these in the consuming app:
167
+
168
+ - Brand assets, logos, app icons, and product-specific marks.
169
+ - Error boundaries and app-level exception handling.
170
+ - Route-aware search content and backend-connected global search.
171
+ - Auth menus, permission gates, and tenant/workspace selectors.
172
+ - Domain-specific cards and features that encode business rules.
173
+ - API clients, query caches, Inertia router calls, and Wayfinder route actions.
174
+ - App-specific layout orchestration and page-level data loading.
175
+
176
+ ## 10. Delete copied folders after imports are clean
177
+
178
+ Only delete local copied folders after typecheck and build pass:
179
+
180
+ ```text
181
+ components/ui/base
182
+ components/ui/typography
183
+ components/ui/navigation
184
+ components/layout
185
+ components/features/comments
186
+ components/features/filters
187
+ components/features/metrics
188
+ ```
189
+
190
+ The exact folders vary by app. Delete only copied package equivalents; keep
191
+ app-owned components.
192
+
193
+ ## 11. Hard import rules
194
+
195
+ Use exact public exports:
196
+
197
+ ```tsx
198
+ import { Button } from 'admin-ui-starter-kit/base/buttons';
199
+ import { Text } from 'admin-ui-starter-kit/typography';
200
+ import { MetadataList } from 'admin-ui-starter-kit/base/display/metadata';
201
+ ```
202
+
203
+ Do not use:
204
+
205
+ ```tsx
206
+ import { Button } from '@/components/ui/base/buttons';
207
+ import { Button } from 'admin-ui-starter-kit/base';
208
+ import { MetadataList } from 'admin-ui-starter-kit/base/display/metadata/metadata-list';
209
+ ```
210
+
211
+ Run the package audit in a consumer app:
212
+
213
+ ```bash
214
+ npx admin-ui-starter-kit-audit
215
+ ```
216
+
217
+ Use `--fix` for conservative import rewrites from known copied paths:
218
+
219
+ ```bash
220
+ npx admin-ui-starter-kit-audit --fix
221
+ ```
222
+
223
+ ## 12. Verification
224
+
225
+ After each migration chunk:
226
+
227
+ ```bash
228
+ npm run typecheck
229
+ npm run build
230
+ npx admin-ui-starter-kit-audit
231
+ ```
232
+
233
+ If a package import fails, check `package.json` `exports` in
234
+ `admin-ui-starter-kit`. Public imports are exact keys. Undocumented nested
235
+ paths are private even when declaration files exist under `dist/`.
package/PUBLISHING.md CHANGED
@@ -54,7 +54,12 @@ Read the file list. **Confirm:**
54
54
  - `dist/files/` and `dist/images/` are included for font and map CSS assets.
55
55
  - `style.css.d.ts` is included for strict TypeScript side-effect CSS imports.
56
56
  - `dist/showcase/` is included.
57
- - `README.md`, `INTEGRATION.md`, `LICENSE`, `CHANGELOG.md` are included.
57
+ - `README.md`, `INTEGRATION.md`, `MIGRATION.md`,
58
+ `COMPONENT_SELECTION.md`, `LICENSE`, `CHANGELOG.md` are included.
59
+ - `.agents/skills/component-library-rules/` and
60
+ `.agents/skills/admin-ui-consumer-migration/` are included.
61
+ - `scripts/audit-consumer.mjs`, `scripts/install-skill.mjs`, and
62
+ `scripts/serve-showcase.mjs` are included.
58
63
  - `src/App.css` is included so consumers can copy the token source when
59
64
  building their own Tailwind output.
60
65
  - `node_modules/`, `coverage/`, `.git/`, `dist-ssr/`, the preview app
@@ -112,8 +117,8 @@ You cannot delete or overwrite a published version. Always dry-run first.
112
117
  | --- | --- |
113
118
  | `npm publish` says "private package" | Remove `"private": true` from `package.json` |
114
119
  | `npm publish` says "name not available" | Someone took the name; pick a new one |
115
- | Consumers report "module not found" for `admin-ui-starter-kit/foo` | Add `./foo` to the `exports` map AND `vite.lib.config.ts` entries; rebuild and republish |
116
- | Consumers report "module not found" for a nested component path | Only explicitly exported nested subfamilies are public. Add an exact `exports` entry plus `vite.lib.config.ts` entry, or document the first-level family import. |
120
+ | Consumers report "module not found" for `admin-ui-starter-kit/foo` | Add an exact `./foo` entry to the `exports` map AND `vite.lib.config.ts`; rebuild and republish |
121
+ | Consumers report "module not found" for a nested component path | Only explicitly exported nested subfamilies are public. Add an exact `exports` entry plus `vite.lib.config.ts` entry, or document the first-level family import. Do not add wildcard or null-blocker exports. |
117
122
  | Consumers must upgrade `lucide-react` | Expected for apps still on lucide v0; this package has a lucide v1 peer. |
118
123
  | Published bundle has stale code | Confirm `prepublishOnly` ran; check `dist/` mtime; bump patch and republish |
119
124
  | `peer dep warning: <pkg> not installed` for an optional peer | Verify the entry is in `peerDependenciesMeta.optional` block; consumer can ignore |