@tailor-platform/app-shell 1.2.0 → 1.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tailor-platform/app-shell",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "An opinionated React application framework for building ERP applications on Tailor Platform",
   "keywords": [
     "app-shell",
@@ -22,7 +22,8 @@
     "directory": "packages/core"
   },
   "files": [
-    "dist/**"
+    "dist/**",
+    "skills/**"
   ],
   "type": "module",
   "exports": {
@@ -41,7 +42,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@base-ui/react": "^1.4.1",
+    "@base-ui/react": "^1.5.0",
     "@standard-schema/spec": "^1.1.0",
     "@tailor-platform/auth-public-client": "^0.5.0",
     "change-case": "^5.4.4",
@@ -49,29 +50,29 @@
     "clsx": "^2.1.1",
     "encoding-japanese": "^2.2.0",
     "es-toolkit": "^1.45.1",
-    "graphql": "^16.13.2",
+    "graphql": "^16.14.0",
     "lucide-react": "^1.8.0",
     "papaparse": "^5.5.3",
-    "react": "^19.2.5",
-    "react-dom": "^19.2.5",
     "react-hook-form": "^7.71.2",
     "react-router": "^7.14.1",
     "sonner": "^2.0.7",
-    "tailwind-merge": "^3.5.0",
+    "tailwind-merge": "^3.6.0",
     "@tailor-platform/app-shell-vite-plugin": "0.2.2"
   },
   "devDependencies": {
-    "@tailwindcss/postcss": "^4.2.4",
+    "@tailwindcss/postcss": "^4.3.0",
     "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",
     "@types/encoding-japanese": "^2.2.1",
-    "@types/node": "^25.6.0",
+    "@types/node": "^25.9.1",
     "@types/papaparse": "^5.5.2",
     "@types/react": "^19",
     "@types/react-dom": "^19",
     "@vitejs/plugin-react": "^5.2.0",
     "happy-dom": "^20.6.2",
     "postcss": "^8",
+    "react": "^19.2.6",
+    "react-dom": "^19.2.6",
     "tailwindcss": "^4.2.4",
     "tw-animate-css": "^1.4.0",
     "typescript": "^5",
@@ -79,7 +80,7 @@
     "vite-plugin-dts": "^4.5.0",
     "vite-plugin-externalize-deps": "^0.10.0",
     "vite-tsconfig-paths": "^6.1.1",
-    "vitest": "^4.1.4"
+    "vitest": "^4.1.6"
   },
   "peerDependencies": {
     "react": ">= 19",

package/skills/app-shell-patterns/SKILL.md

@@ -0,0 +1,67 @@
+---
+name: app-shell-patterns
+description: UI pattern catalog for building pages with @tailor-platform/app-shell components
+---
+
+# App-Shell Patterns
+
+## Purpose
+
+Select and implement the correct UI pattern using @tailor-platform/app-shell components.
+
+## Fundamental References
+
+These are the foundational rules that underpin all patterns. All patterns build on top of these references.
+
+| File | Description |
+| ---- | ----------- |
+| [components.md](references/fundamental/components.md) | components reference |
+| [design-system.md](references/fundamental/design-system.md) | design-system reference |
+| [graphql.md](references/fundamental/graphql.md) | graphql reference |
+
+## Available Patterns
+
+### detail
+
+| Slug | Name | Description |
+| ---- | ---- | ----------- |
+| [`detail/hero-with-actions`](references/patterns/detail-hero-with-actions.md) | Hero With Actions Detail | Single-record detail view with workflow actions and activity timeline |
+
+### form
+
+| Slug | Name | Description |
+| ---- | ---- | ----------- |
+| [`form/modal`](references/patterns/form-modal.md) | Modal Form | Default form pattern for Create/Edit — keeps user in context on the parent screen |
+| [`form/sectioned`](references/patterns/form-sectioned.md) | Sectioned Form | Complex form with 15+ fields organized into named fieldset sections |
+| [`form/single-page`](references/patterns/form-single-page.md) | Single Page Form | Routed full-page form for moderate field count (6-15) without natural sectioning |
+| [`form/wizard`](references/patterns/form-wizard.md) | Wizard Form | Multi-stage create flow with 3-7 steps and per-step validation gates |
+
+### interaction
+
+| Slug | Name | Description |
+| ---- | ---- | ----------- |
+| [`interaction/confirm`](references/patterns/interaction-confirm.md) | Confirm | Confirmation dialog before destructive or irreversible actions |
+| [`interaction/multi-select`](references/patterns/interaction-multi-select.md) | Multi Select | Floating bottom action bar for bulk operations on selected list rows |
+| [`interaction/toast`](references/patterns/interaction-toast.md) | Toast | Lightweight feedback after mutations — success or error notifications |
+
+### list
+
+| Slug | Name | Description |
+| ---- | ---- | ----------- |
+| [`list/dense-scan`](references/patterns/list-dense-scan.md) | Dense Scan List | High-density scannable list backed by GraphQL connections with DataTable, sort, filters, and pagination |
+
+## How to Use
+
+1. Identify the user's intent (list, detail, form, interaction, screen composition, recipe)
+2. Match constraints to an entry slug from the tables above
+3. Read the entry's detailed spec: `references/<category>/<slug>.md` (relative to this file)
+4. Read fundamental references for component APIs, design tokens, and GraphQL conventions: `references/fundamental/`
+5. Implement using ONLY the imports listed in the entry's `requiredImports`
+
+## Rules
+
+- ALWAYS cite the entry slug in a comment at the top of the file:
+  `/* pattern: list/dense-scan */`
+- NEVER mix patterns in a single page component
+- ALWAYS use AppShell components — do NOT use raw HTML or third-party UI libraries
+- If no entry matches, compose directly from fundamental references