@gem-sdk/eslint-plugin 0.0.1 → 0.0.3

package/README.md

@@ -1,13 +1,15 @@
-# eslint-plugin-gem-fe
+# @gem-sdk/eslint-plugin
 
 Shared ESLint rules for all GemPages frontend repositories.
 
 Consolidates every custom rule from `web-builder-shopify-app`, `web-builder`, and `web-builder-elements` into a single publishable npm package. The architecture rules support both React (`.tsx`) and Vue (`.vue`) files.
 
+> The package name is `@gem-sdk/eslint-plugin`, so its ESLint plugin prefix is **`@gem-sdk`** (scoped packages drop the `eslint-plugin-` segment). Reference rules as `@gem-sdk/<rule>` and shareable configs as `plugin:@gem-sdk/<config>`.
+
 ## Installation
 
 ```bash
-yarn add -D eslint-plugin-gem-fe
+yarn add -D @gem-sdk/eslint-plugin
 ```
 
 ## Usage
@@ -18,7 +20,7 @@ Choose the config that matches your tech stack:
 
 ```json
 {
-  "extends": ["plugin:gem-fe/react"]
+  "extends": ["plugin:@gem-sdk/react"]
 }
 ```
 
@@ -26,7 +28,7 @@ Choose the config that matches your tech stack:
 
 ```json
 {
-  "extends": ["plugin:gem-fe/vue"]
+  "extends": ["plugin:@gem-sdk/vue"]
 }
 ```
 
@@ -34,7 +36,7 @@ Choose the config that matches your tech stack:
 
 ```json
 {
-  "extends": ["plugin:gem-fe/recommended"]
+  "extends": ["plugin:@gem-sdk/recommended"]
 }
 ```
 
@@ -42,257 +44,35 @@ Choose the config that matches your tech stack:
 
 ```json
 {
-  "plugins": ["gem-fe"],
+  "plugins": ["@gem-sdk"],
   "rules": {
-    "gem-fe/module-structure": "error",
-    "gem-fe/no-module-barrel": "error",
-    "gem-fe/module-import-boundary": "error",
-    "gem-fe/pure-ui-layer": "error",
-    "gem-fe/module-index-required": "error",
-    "gem-fe/no-t-for-variable": "error",
-    "gem-fe/not-use-store-to-refs": "error",
-    "gem-fe/not-use-custom-color-class": "warn",
-    "gem-fe/no-export-type-from-tsx": "error",
-    "gem-fe/no-import-from-package-path": "error"
+    "@gem-sdk/module-structure": "error",
+    "@gem-sdk/no-module-barrel": "error",
+    "@gem-sdk/module-import-boundary": "error",
+    "@gem-sdk/pure-ui-layer": "error",
+    "@gem-sdk/module-index-required": "error",
+    "@gem-sdk/no-t-for-variable": "error",
+    "@gem-sdk/not-use-store-to-refs": "error",
+    "@gem-sdk/not-use-custom-color-class": "warn",
+    "@gem-sdk/no-export-type-from-tsx": "error",
+    "@gem-sdk/no-import-from-package-path": "error"
   }
 }
 ```
 
----
-
-## Rules
-
-### Architecture (React + Vue)
-
-These rules apply to both `.tsx` and `.vue` files and enforce the v2 module structure used across all GemPages repos.
-
-Module detection handles both project layouts:
-- `v2/modules/<name>/` — business modules (code lives under `app/` subdir)
-- `v2/core/<name>/` — core modules (code lives at the module root)
-
----
-
-#### `module-structure`
-
-Enforces the allowed file/folder layout inside v2 modules.
-
-**Allowed paths (business modules):**
-
-```
-app/contexts/*.(ts|tsx)
-app/constants/*.ts
-app/hooks/*.ts
-app/stores/*.ts
-app/types/*.ts
-app/utils/*.ts
-app/graphql/{fragments,queries,mutations}/*.(gql|ts)
-app/ui/{atoms,molecules,organisms,templates}/*.(vue|tsx)
-app/ui/assets/fonts/*.(woff|woff2|ttf|eot)
-app/ui/assets/icons/*.(vue|tsx)
-app/ui/assets/images/*.(png|jpg|jpeg|gif|svg|webp|ico|bmp|tiff)
-app/ui/assets/styles/*.(css|scss)
-app/ui/assets/videos/*.(mp4|mp3)
-*.test.[tj]sx?        (anywhere in the module)
-external.ts           (module root only)
-index.ts              (module root only)
-```
-
-Core modules use the same layout without the `app/` prefix.
-
----
-
-#### `no-module-barrel`
-
-Bans `index.ts` barrel files inside module subdirectories. Only the module-root `index.ts` is allowed.
-
-```ts
-// ❌ Error — app/hooks/index.ts
-export { useFoo } from './useFoo';
-
-// ✅ OK — module-root index.ts
-export { useFoo } from './app/hooks/useFoo';
-```
-
----
-
-#### `module-import-boundary`
-
-Prevents files inside a module from importing across the module boundary. Cross-module dependencies must go through `external.ts`.
-
-Banned imports:
-- Alias imports (`~/...`, `@/...`) — always escape the module
-- Relative imports (`../`) resolving outside the module root
-
-Scoped npm packages (e.g. `@shopify/react-form`) are unaffected — the alias check only matches the literal `@/` prefix.
-
-```ts
-// ❌ Error
-import { useShop } from '~/modules/shop-info/app/hooks/useShop';
-
-// ✅ OK — through the public API
-import { useShop } from '~/modules/shop-info';
-```
-
----
-
-#### `pure-ui-layer`
-
-Bans hook imports and `use*` calls inside `ui/atoms/` and `ui/molecules/`. These layers must be stateless.
-
-Exempt hooks: anything matching `use.*i18n`, `use.*translat`, or `use.*const` (case-insensitive) — e.g. `useI18n`, `useTranslation`, `useConstants`.
-
-Files under `v2/modules/<name>/core/` are fully exempt from this rule.
-
-```tsx
-// ❌ Error — atoms/ProductCard.tsx
-import { useProduct } from '../../hooks/useProduct';
-
-// ✅ OK
-import { useTranslation } from '../../hooks/useTranslation';
-```
-
----
-
-#### `module-index-required`
-
-Verifies that every v2 module has an `index.ts` at its root. Fires on every file linted inside the module.
-
----
-
-### i18n (React + Vue)
-
-#### `no-t-for-variable`
-
-Only plain string literals are allowed as the first argument to `t()`. Template literals with interpolations are banned.
-
-```ts
-// ✅ OK
-t("Save")
-t(`Hello`)
-
-// ❌ Error
-t(key)
-t(`Hello ${name}`)
-t(props.label)
-```
-
----
-
-### Vue-specific
-
-#### `not-use-store-to-refs`
-
-Bans Pinia's `storeToRefs()`. Use `computed()` instead for explicit reactivity.
+## What each config enables
 
-```ts
-// ❌ Error
-const { count } = storeToRefs(useCounterStore())
+| Rule | `recommended` | `vue` | `react` |
+| --- | :---: | :---: | :---: |
+| `module-structure` | error | error | error |
+| `no-module-barrel` | error | error | error |
+| `module-import-boundary` | error | error | error |
+| `pure-ui-layer` | error | error | error |
+| `module-index-required` | error | error | error |
+| `no-t-for-variable` | error | error | error |
+| `not-use-store-to-refs` | — | error | — |
+| `not-use-custom-color-class` | — | warn | — |
+| `no-export-type-from-tsx` | — | — | error |
+| `no-import-from-package-path` | — | — | error |
 
-// ✅ OK
-const count = computed(() => useCounterStore().count)
-```
-
-#### `not-use-custom-color-class`
-
-Warns when raw color values (hex, `rgb()`, `hsl()`) are used in Vue template class bindings. Use design-system tokens instead.
-
-```html
-<!-- ❌ Warning -->
-<div :class="['[#ff0000]']" />
-
-<!-- ✅ OK -->
-<div class="text-primary" />
-```
-
-Requires `vue-eslint-parser` as the parser.
-
----
-
-### React / TypeScript-specific
-
-#### `no-export-type-from-tsx`
-
-Disallows type/interface exports from `.tsx` files. Move types to a dedicated `.ts` file.
-
-```ts
-// ❌ Error — MyComponent.tsx
-export type MyProps = { name: string };
-
-// ✅ OK — MyComponent.ts
-export type MyProps = { name: string };
-```
-
-#### `no-import-from-package-path`
-
-Prevents value imports from `@gem-sdk` packages using deep path syntax. Type-only imports are allowed.
-
-```ts
-// ❌ Error
-import { fn } from '@gem-sdk/core/internal/utils';
-
-// ✅ OK
-import { fn } from '@gem-sdk/core';
-import type { T } from '@gem-sdk/core/internal/utils';
-```
-
----
-
-## Development
-
-### Setup
-
-```bash
-yarn install
-```
-
-### Tests
-
-Each rule has a co-located `.test.ts` file. Run all tests with:
-
-```bash
-yarn test
-```
-
-### Build
-
-```bash
-yarn build   # outputs to dist/
-```
-
-### Adding a new rule
-
-1. Create `src/rules/myNewRule.ts` (camelCase filename)
-2. Export the rule as `default`
-3. Add a co-located `src/rules/myNewRule.test.ts`
-4. Register in `src/index.ts`:
-
-```ts
-import myNewRule from './rules/myNewRule';
-
-export const rules = {
-  // ...existing
-  'my-new-rule': myNewRule,
-};
-```
-
----
-
-## Release
-
-This package uses [Changesets](https://github.com/changesets/changesets) with the same branching strategy as `web-builder-elements`:
-
-| Branch | NPM tag |
-|--------|---------|
-| `production` | `latest` |
-| `staging` | `staging` |
-| `dev` | `dev` |
-| `dev-sun` / `dev-moon` / `dev-earth` / `dev-new-feature` | `sun` / `moon` / `earth` / `new-feature` |
-
-To release a new version:
-
-```bash
-# 1. Create a changeset describing your changes
-yarn changeset
-
-# 2. The CI release workflow handles publishing automatically on merge
-```
+`vue` and `react` both extend `recommended`. Vue configs require `vue-eslint-parser`.

package/dist/index.d.ts

@@ -12,40 +12,40 @@ export declare const rules: {
 };
 export declare const configs: {
     recommended: {
-        readonly plugins: readonly ['gem-fe'];
+        readonly plugins: readonly ['@gem-sdk'];
         readonly rules: {
-            readonly 'gem-fe/module-structure': 'error';
-            readonly 'gem-fe/no-module-barrel': 'error';
-            readonly 'gem-fe/module-import-boundary': 'error';
-            readonly 'gem-fe/pure-ui-layer': 'error';
-            readonly 'gem-fe/module-index-required': 'error';
-            readonly 'gem-fe/no-t-for-variable': 'error';
+            readonly '@gem-sdk/module-structure': 'error';
+            readonly '@gem-sdk/no-module-barrel': 'error';
+            readonly '@gem-sdk/module-import-boundary': 'error';
+            readonly '@gem-sdk/pure-ui-layer': 'error';
+            readonly '@gem-sdk/module-index-required': 'error';
+            readonly '@gem-sdk/no-t-for-variable': 'error';
         };
     };
     vue: {
-        readonly plugins: readonly ['gem-fe'];
+        readonly plugins: readonly ['@gem-sdk'];
         readonly rules: {
-            readonly 'gem-fe/module-structure': 'error';
-            readonly 'gem-fe/no-module-barrel': 'error';
-            readonly 'gem-fe/module-import-boundary': 'error';
-            readonly 'gem-fe/pure-ui-layer': 'error';
-            readonly 'gem-fe/module-index-required': 'error';
-            readonly 'gem-fe/no-t-for-variable': 'error';
-            readonly 'gem-fe/not-use-store-to-refs': 'error';
-            readonly 'gem-fe/not-use-custom-color-class': 'warn';
+            readonly '@gem-sdk/module-structure': 'error';
+            readonly '@gem-sdk/no-module-barrel': 'error';
+            readonly '@gem-sdk/module-import-boundary': 'error';
+            readonly '@gem-sdk/pure-ui-layer': 'error';
+            readonly '@gem-sdk/module-index-required': 'error';
+            readonly '@gem-sdk/no-t-for-variable': 'error';
+            readonly '@gem-sdk/not-use-store-to-refs': 'error';
+            readonly '@gem-sdk/not-use-custom-color-class': 'warn';
         };
     };
     react: {
-        readonly plugins: readonly ['gem-fe'];
+        readonly plugins: readonly ['@gem-sdk'];
         readonly rules: {
-            readonly 'gem-fe/module-structure': 'error';
-            readonly 'gem-fe/no-module-barrel': 'error';
-            readonly 'gem-fe/module-import-boundary': 'error';
-            readonly 'gem-fe/pure-ui-layer': 'error';
-            readonly 'gem-fe/module-index-required': 'error';
-            readonly 'gem-fe/no-t-for-variable': 'error';
-            readonly 'gem-fe/no-export-type-from-tsx': 'error';
-            readonly 'gem-fe/no-import-from-package-path': 'error';
+            readonly '@gem-sdk/module-structure': 'error';
+            readonly '@gem-sdk/no-module-barrel': 'error';
+            readonly '@gem-sdk/module-import-boundary': 'error';
+            readonly '@gem-sdk/pure-ui-layer': 'error';
+            readonly '@gem-sdk/module-index-required': 'error';
+            readonly '@gem-sdk/no-t-for-variable': 'error';
+            readonly '@gem-sdk/no-export-type-from-tsx': 'error';
+            readonly '@gem-sdk/no-import-from-package-path': 'error';
         };
     };
 };

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAYA,eAAO,MAAM,KAAK;;;;;;;;;;;CAegB,CAAC;AAyCnC,eAAO,MAAM,OAAO;;oCAnCR,QAAQ;;qBAEhB,yBAAyB,EAAE,OAAO;qBAClC,yBAAyB,EAAE,OAAO;qBAClC,+BAA+B,EAAE,OAAO;qBACxC,sBAAsB,EAAE,OAAO;qBAC/B,8BAA8B,EAAE,OAAO;qBACvC,0BAA0B,EAAE,OAAO;;;;oCAQ3B,QAAQ;;gDAbW,OAAO;gDACP,OAAO;sDACD,OAAO;6CAChB,OAAO;qDACC,OAAO;iDACX,OAAO;qDAWH,OAAO;0DACF,MAAM;;;;oCAQnC,QAAQ;;gDAzBW,OAAO;gDACP,OAAO;sDACD,OAAO;6CAChB,OAAO;qDACC,OAAO;iDACX,OAAO;uDAuBD,OAAO;2DACH,OAAO;;;CAIC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAYA,eAAO,MAAM,KAAK;;;;;;;;;;;CAegB,CAAC;AAyCnC,eAAO,MAAM,OAAO;;oCAnCR,UAAU;;qBAElB,2BAA2B,EAAE,OAAO;qBACpC,2BAA2B,EAAE,OAAO;qBACpC,iCAAiC,EAAE,OAAO;qBAC1C,wBAAwB,EAAE,OAAO;qBACjC,gCAAgC,EAAE,OAAO;qBACzC,4BAA4B,EAAE,OAAO;;;;oCAQ7B,UAAU;;kDAbW,OAAO;kDACP,OAAO;wDACD,OAAO;+CAChB,OAAO;uDACC,OAAO;mDACX,OAAO;uDAWH,OAAO;4DACF,MAAM;;;;oCAQrC,UAAU;;kDAzBW,OAAO;kDACP,OAAO;wDACD,OAAO;+CAChB,OAAO;uDACC,OAAO;mDACX,OAAO;yDAuBD,OAAO;6DACH,OAAO;;;CAID,CAAC"}

package/dist/index.js

@@ -34,36 +34,36 @@ exports.rules = {
  * Shared architecture + i18n rules for both React and Vue repos.
  */
 const recommended = {
-    plugins: ['gem-fe'],
+    plugins: ['@gem-sdk'],
     rules: {
-        'gem-fe/module-structure': 'error',
-        'gem-fe/no-module-barrel': 'error',
-        'gem-fe/module-import-boundary': 'error',
-        'gem-fe/pure-ui-layer': 'error',
-        'gem-fe/module-index-required': 'error',
-        'gem-fe/no-t-for-variable': 'error',
+        '@gem-sdk/module-structure': 'error',
+        '@gem-sdk/no-module-barrel': 'error',
+        '@gem-sdk/module-import-boundary': 'error',
+        '@gem-sdk/pure-ui-layer': 'error',
+        '@gem-sdk/module-index-required': 'error',
+        '@gem-sdk/no-t-for-variable': 'error',
     },
 };
 /**
  * `recommended` + Vue-specific rules. Use with vue-eslint-parser.
  */
 const vue = {
-    plugins: ['gem-fe'],
+    plugins: ['@gem-sdk'],
     rules: {
         ...recommended.rules,
-        'gem-fe/not-use-store-to-refs': 'error',
-        'gem-fe/not-use-custom-color-class': 'warn',
+        '@gem-sdk/not-use-store-to-refs': 'error',
+        '@gem-sdk/not-use-custom-color-class': 'warn',
     },
 };
 /**
  * `recommended` + React/TypeScript-specific rules.
  */
 const react = {
-    plugins: ['gem-fe'],
+    plugins: ['@gem-sdk'],
     rules: {
         ...recommended.rules,
-        'gem-fe/no-export-type-from-tsx': 'error',
-        'gem-fe/no-import-from-package-path': 'error',
+        '@gem-sdk/no-export-type-from-tsx': 'error',
+        '@gem-sdk/no-import-from-package-path': 'error',
     },
 };
 exports.configs = { recommended, vue, react };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/eslint-plugin",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "Shared ESLint rules for GemPages frontend repos (React + Vue)",
   "license": "MIT",
   "main": "./dist/index.js",
@@ -13,8 +13,8 @@
     "test": "vitest run",
     "type-check": "tsc --noEmit",
     "lint": "eslint src --ext .ts",
-    "release": "changeset publish",
-    "release-packages": "yarn build && changeset publish"
+    "release": "set -a && . ./.env && set +a && env npm_config_//registry.npmjs.org/:_authToken=\"$NPM_TOKEN\" changeset publish",
+    "release-packages": "set -a && . ./.env && set +a && yarn build && env npm_config_//registry.npmjs.org/:_authToken=\"$NPM_TOKEN\" changeset publish"
   },
   "peerDependencies": {
     "eslint": ">=8.0.0"