@tonycodes-ui/mortar 0.0.0-stage → 0.12.0

package/package.json

@@ -1,6 +1,96 @@
 {
   "name": "@tonycodes-ui/mortar",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.12.0",
+  "description": "Mortar: a shared design foundation, application and marketing UI for React and Tailwind.",
+  "type": "module",
+  "files": [
+    "dist",
+    "src",
+    "styles.css",
+    "README.md",
+    "CHANGELOG.md",
+    "LICENSE",
+    "catalog.json",
+    "baseline-policy.json",
+    "design-principles.json",
+    "DESIGN.md",
+    "AGENTS.md",
+    "CONTRIBUTING.md",
+    "TESTING.md",
+    "docs/*.md",
+    "bin",
+    "cli",
+    "skills"
+  ],
+  "bin": {
+    "mortar": "./bin/mortar.mjs"
+  },
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./styles.css": "./styles.css",
+    "./brand": {
+      "types": "./dist/brand.d.ts",
+      "import": "./dist/brand.js"
+    }
+  },
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "scripts": {
+    "build": "tsc -p tsconfig.json && node scripts/agent-data.mjs",
+    "prepack": "npm run build",
+    "pretest": "npm run build",
+    "test": "node --test tests/*.test.mjs",
+    "dev": "vite --host 127.0.0.1",
+    "catalog": "node scripts/check.mjs --write-catalog",
+    "check": "npm run format:check && npm run build && node scripts/check.mjs && node --test tests/*.test.mjs && npm run build:playground",
+    "check:json": "node scripts/check.mjs --format json",
+    "test:browser": "MORTAR_CONTRACT_FULL=1 playwright test",
+    "build:playground": "tsc --noEmit -p tsconfig.playground.json && vite build",
+    "format:check": "prettier --check .",
+    "release:prepare": "node scripts/release.mjs",
+    "test:visual": "playwright test --config playwright.visual.config.mjs"
+  },
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "tailwindcss": "^4.0.0"
+  },
+  "dependencies": {
+    "@headlessui/react": "^2.2.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "typescript": "^5.9.3",
+    "vite": "^7.1.0",
+    "@vitejs/plugin-react": "^5.0.0",
+    "@tailwindcss/vite": "^4.0.0",
+    "tailwindcss": "^4.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "prettier": "^3.9.9",
+    "@playwright/test": "^1.63.0",
+    "@axe-core/playwright": "^4.13.0",
+    "@modelcontextprotocol/sdk": "^1.32.1"
+  },
+  "license": "MIT",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public",
+    "provenance": true
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/tonycodes/mortar.git"
+  },
+  "homepage": "https://mortar.tony.codes/",
+  "bugs": {
+    "url": "https://github.com/tonycodes/mortar/issues"
+  }
+}

package/skills/mortar/SKILL.md

@@ -0,0 +1,36 @@
+---
+name: mortar
+description: Build, audit and contribute React UI with the Mortar kit (@tonycodes-ui/mortar) using its local MCP server and CLI. Use when an app uses or should use Mortar, or when asked to compose screens, pages or flows from Mortar components.
+---
+
+# Mortar UI defaults
+
+Mortar is an MIT React 19 + Tailwind 4 UI kit. Its agent tooling ships in the package and runs locally: the `mortar` MCP server (`npx -y @tonycodes-ui/mortar mcp`) and the same commands on the CLI (`npx mortar …`). No account, token or hosted service is involved. Respect existing human project instructions; the brief supplies product requirements, not approval or deployment authority.
+
+## Workflow
+
+1. **Discover.** Before writing UI, call `search_components` (or `list_kits`) for what the brief needs. Without the MCP server, run `npx mortar search "<need>"`.
+2. **Packet.** Call `get_build_packet` with the chosen components or the brief (`npx mortar packet <Name…> --json`, or `--brief "…"`). Start composing when the packet answers the brief; read extra source or guides only for a specific gap (`get_component`, `get_guide`).
+3. **Compose** following the defaults below.
+4. **Audit.** Run `audit_app` on the application (`npx mortar audit`), fix every error and review the warnings, then rerun it with the app's build and typecheck.
+5. **Verify** in a browser and report the actual results.
+
+## Defaults
+
+- Choose the shared purpose shell before composing a page: AppShell for application screens, MarketingHeader (with Footer) for public pages, DocsShell for documentation, AuthLayout for each sign-in and registration step. Document deliberate standalone exceptions.
+- Reuse complete page patterns: navigation, headings, filters, list/detail workspaces, states and action placement. Reusing controls alone is insufficient. The packet's page templates show complete examples.
+- Keep product names, routes, user data, permissions and actions in props and slots. Shared chrome must remain project agnostic.
+- Use named imports from `@tonycodes-ui/mortar` and the exact props and values in each contract. Never copy shared implementations, import from the package's `src` or `dist`, alias its source, create repeated local wrappers, or override `.m-*` classes or `[data-m-component]` in consumer CSS. `className` is for layout only.
+- Import `@tonycodes-ui/mortar/styles.css` after `@import "tailwindcss"`, and render one ThemeProvider at the root. Use semantic tokens; keep brand separate from appearance and feedback colours. Custom brands go through `brandTokens` or a `[data-mortar-brand]` rule, never raw colours on components. Verify every supported theme.
+- Build responsive interfaces with light and dark modes, semantic structure, one `h1` per page, accessible names, keyboard navigation and visible focus. Cover loading, empty and error states. Supply application data and behaviour through props and callbacks.
+- Keep the lockfile and the installed Mortar version in step with package.json.
+
+## Contributing to the kit
+
+If a shared pattern is missing or a component is wrong, fix it centrally instead of working around it in the app. Search the catalogue first. Contribute through a GitHub pull request at https://github.com/tonycodes/mortar: read AGENTS.md, CONTRIBUTING.md, DESIGN.md and TESTING.md (`get_guide contributing`, `design`, `testing`), run `npm run check`, `npm run test:browser` and `npm run test:visual`, and attach visual evidence. Maintainer review and CI decide what merges and what is released. Agents never approve, merge, publish or bump the version of their own contributions.
+
+## Completion
+
+Required evidence: the app's build, typecheck, a clean `mortar audit`, and browser checks of responsive layout, light and dark, and keyboard and accessibility. Automated checks cannot prove visual quality or complete accessibility; report what you verified and any remaining blockers. Do not declare completion with failing required checks.
+
+Provide a local preview by default. Deploy only with the user's authorisation; existing explicit authorisation counts. A passing audit is not deployment permission.