laioutr-developer

Plugin laioutr-developer from marketplace laioutr in laioutr/claude-marketplace. Commands read from the repo's manifest — 28 days ago.

Skills (11)

• adr

  Use when making architectural decisions, after completing design plans, when user says 'adr' or 'architecture decision record', or when proposing technology choices, integration patterns, or structural changes that affect the codebase long-term.

• designing-action-tokens

  Use when adding or reshaping an action token (`defineActionToken`, a `.action.ts` handler or a shared token file) in a Laioutr app module. An action is an imperative call the frontend makes to the backend, either a mutation (add to cart, subscribe, register, book, submit a form, save, delete) or an

• designing-entity-components

  Use when designing entity data in a Laioutr app module. That covers defining a new entity type, or new `defineEntityComponentToken` components (on your own entity, or extra components on a canonical one such as `Product` or `Location`), for connector-fed data such as events, job postings, stores, re

• figma-component-architecture

  Use when producing component API specs (props, slots, events, state, composition) from a figma-design-analysis plan, before implementation with figma-to-component. Bridges structural analysis and code. Step 2 of the Laioutr Figma → component pipeline.

• figma-design-analysis

  Use when analyzing Figma designs before implementation, when decomposing complex multi-component pages (checkout, PDP, full layouts) into component hierarchies, or when creating implementation plans from Figma designs for a Laioutr-based Nuxt module.

• figma-export-assets

  Use when implementing a component from a Figma frame that contains image content (illustrations, photos, logos, markers, screenshots, custom icons) that needs to live as files in your Laioutr-based Nuxt module. Excludes themable defaults registered via themeMedia/themeResponsiveMedia — that workflow

• figma-to-component

  Use when implementing Vue components from a figma-design-analysis plan, from a figma-component-architecture spec, or directly from Figma designs, when writing component code following Laioutr conventions, or when verifying implemented components against project standards. Step 3 of the Laioutr Figma

• laioutr-platform

  Use when developing on the Laioutr e-commerce platform — building Nuxt 3 / Vue 3 storefronts, custom UI components, sections and blocks via `defineSection` / `defineBlock`, Orchestr query / link / component-resolver / action handlers, or any work involving the `@laioutr-core/*` packages (`frontend-c

• writing-claude-rules

  Use when authoring a new rule file in a project's `rules/` or `.claude/rules/` directory, when a user asks to "write a rule for X" / "add a rule about Y" / "encode this convention", or when a recurring code-review correction needs to be turned into project memory.

• writing-section-block-definitions

  Use when authoring or modifying a `defineSection` / `defineBlock` schema in a Laioutr module — choosing sidebar group placement (Section info / Content / Design → Styling / Design → Layout / Rules), picking canonical field names (`heading`, `media`, `cta`, `background`, `margin`, `alignment`, …), av

• writing-storybook-stories

  Use when authoring or modifying a Vue Storybook `.stories.ts` file in a Laioutr module — naming the meta title and exports, deciding the variant sequence, picking layout variants by Figma frame, attaching `parameters.design.url`, choosing args over render, handling theming under multiple themes, or

MCP servers (1)

• laioutr-docs

  connects to: https://docs.laioutr.com/mcp

Similar plugins