injast-core 1.0.80 → 1.0.82

package/skills/injast-app-builder/SKILL.md

@@ -0,0 +1,49 @@
+---
+name: injast-app-builder
+description: Build or revise Persian RTL mobile product app flows with Injast Core and the Gold reference app. Use when Codex is asked to implement Injast Core screens, Figma-to-Injast designs, Gold-style buy/sell or drawer flows, Persian mobile app UI, or to enforce Injast guidelines around 520px shells, wired navigation, Injast inputs, and drawer-based pre-invoices.
+---
+
+# Injast App Builder
+
+## Required References
+
+Read these before implementing or reviewing an Injast app flow:
+
+- `guidelines/Guidelines.md` from the installed `injast-core` package.
+- Focused guideline files linked from that document for setup, layout, forms, feedback, data display, date inputs, icons, runtime, and types.
+- `/Users/ali/Documents/Gold` as the canonical reference app for composition, 520px shell, wired state, drawer pre-invoices, and Persian mobile product behavior when that reference is available locally.
+
+## Implementation Workflow
+
+1. Inspect the target app and the relevant Gold reference files before editing.
+2. Keep runtime component APIs unchanged unless the user explicitly asks for package source changes.
+3. Build Persian RTL flows with `SPAThemeProvider` for Vite/Figma Make apps or `ThemeProvider` for Next.js apps.
+4. Center mobile app surfaces with `maxWidth: 520` or `max-width: 520px` plus `mx: "auto"` or `margin-inline: auto`.
+5. Wire the product flow end to end: navigation actions, submit buttons, drawers, modals, close actions, and confirmations must update route or local state.
+6. Verify the result against the Gold reference behavior and the focused guidelines.
+
+## Figma MCP Workflow
+
+For Figma-driven work, use the Figma MCP server at:
+
+```text
+http://127.0.0.1:3845/mcp
+```
+
+Use this sequence:
+
+1. Fetch design context for the exact node or frame.
+2. Fetch a screenshot for the same target before implementation.
+3. If the payload is too large, fetch metadata and then narrow to the needed node.
+4. Translate the design into Injast Core conventions. Do not keep generic React, Tailwind, raw controls, or mobile OS chrome from MCP output as final code.
+
+## Hard Rules
+
+- Use Injast Core components before raw HTML or direct Material UI primitives.
+- Use Injast inputs for every field: `TextField`, `NumberInput`, `InputPhoneNumber`, `CardNumberInput`, `OtpInput`, `Select`, `MultiSelect`, `Autocomplete`, `Checkbox`, `Radio`, `Toggle`, `Slider`, or `CounterBoxInput`.
+- Use `iconsax-react` for generated app icons.
+- Do not implement mobile OS status bars or decorative app status bars, even when present in Figma.
+- Pre-invoices (`پیش‌فاکتور`) are drawer or bottom-sheet overlays, not independent pages.
+- Drawers must feel like drawers: fixed overlay, backdrop, centered 520px sheet, visible close path, and entrance/exit motion from the drawer edge.
+- When useful, dim, blur, or subtly scale the underlying page while an overlay is open.
+- Keep generated apps as wired flows, not disconnected screen previews.

package/skills/injast-app-builder/agents/openai.yaml

@@ -0,0 +1,4 @@
+interface:
+  display_name: "Injast App Builder"
+  short_description: "Build Injast RTL mobile app flows"
+  default_prompt: "Use $injast-app-builder to build or revise a Persian Injast Core mobile app flow."