What problem does it solve? Large React codebases decay when modules import freely across architectural layers, producing circular dependencies, untestable components, and unpredictable refactors. This Skill documents the twelve-layer import stack and per-domain import partitions of the Layer component library so contributors know which direction imports may point and how to resolve a lint-reported boundary violation. ## Core Features & Use Cases - Layer stack reference: Defines twelve layers from foundation (schemas, utils) up to the app root, with the rule that files may import only from strictly lower layers, and explains non-obvious placements such as context below generic hooks and stores below feature hooks. - Boundary error triage: Provides a decision procedure for fixing violations — move shared code down a layer, pass computed values as props, or relocate the file to the correct layer — instead of reaching for eslint-disable. - Feature-domain partitions: Lists the five domain-partitioned directory trees (schemas, components, hooks, providers, utils) with each partition's declared shared-domain set, plus import-order and translation-key ownership rules driven by the same alias table. - Use Case: A developer adds a hook that reads a Zustand store and an SWR endpoint, and the lint run fails. The Skill explains that this is a layer-5 store hook belonging under providers/features, not a layer-6 feature hook, and shows how to restructure the import. ## Quick Start Ask the AI to review a new cross-module import in the src tree against the layer stack and domain partitions, and to propose the correct fix for any boundary violation it finds.
