Skip to content

Commit cb1ce5f

Browse files
takemiyamakototakemiyamakoto
committed
lint
1 parent 9b11df9 commit cb1ce5f

File tree

8 files changed

+85
-77
lines changed

8 files changed

+85
-77
lines changed

‎docs/README.md‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -35,12 +35,12 @@ This directory gathers the practical knowledge required to work with the Soramit
3535

3636
## Audience guide
3737

38-
| Persona | Focus areas |
39-
| --- | --- |
40-
| Application consumers | [getting-started.md](getting-started.md), [components.md](components.md), [theming.md](theming.md) |
41-
| Component contributors | [development-workflow.md](development-workflow.md), [components.md](components.md), [testing-and-quality.md](testing-and-quality.md) |
42-
| Release managers | [release-management.md](release-management.md), [scripts-reference.md](scripts-reference.md) |
43-
| QA and accessibility reviewers | [storybook.md](storybook.md), [testing-and-quality.md](testing-and-quality.md) |
38+
| Persona | Focus areas |
39+
| ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------ |
40+
| Application consumers | [getting-started.md](getting-started.md), [components.md](components.md), [theming.md](theming.md) |
41+
| Component contributors | [development-workflow.md](development-workflow.md), [components.md](components.md), [testing-and-quality.md](testing-and-quality.md) |
42+
| Release managers | [release-management.md](release-management.md), [scripts-reference.md](scripts-reference.md) |
43+
| QA and accessibility reviewers | [storybook.md](storybook.md), [testing-and-quality.md](testing-and-quality.md) |
4444

4545
## Keeping this documentation healthy
4646

‎docs/components.md‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -42,13 +42,13 @@ All components share a single CSS bundle emitted as `@soramitsu-ui/ui/styles`. I
4242

4343
## Component catalogue
4444

45-
| Category | Components |
46-
| --- | --- |
47-
| Inputs | `SCheckbox`, `SRadio`, `SSwitch`, `SSelect`, `STextField`, `SDatePicker`, `SJsonInput` |
48-
| Navigation | `SNavigationMenu`, `SNavigationSubmenu`, `SNavigationMenuItem`, `STabs`, `SLink` |
49-
| Feedback | `SAlert`, `SBadge`, `SProgressBar`, `SSpinner`, `SNotifications`, `SToasts` |
50-
| Surfaces | `SAccordion`, `SModal`, `SPopover`, `STable`, `SCard`-style layouts (table adapt mode) |
51-
| Utilities | `SBodyScrollLockProvider`, `STooltip`, transition wrappers in `Transitions/` |
45+
| Category | Components |
46+
| ---------- | -------------------------------------------------------------------------------------- |
47+
| Inputs | `SCheckbox`, `SRadio`, `SSwitch`, `SSelect`, `STextField`, `SDatePicker`, `SJsonInput` |
48+
| Navigation | `SNavigationMenu`, `SNavigationSubmenu`, `SNavigationMenuItem`, `STabs`, `SLink` |
49+
| Feedback | `SAlert`, `SBadge`, `SProgressBar`, `SSpinner`, `SNotifications`, `SToasts` |
50+
| Surfaces | `SAccordion`, `SModal`, `SPopover`, `STable`, `SCard`-style layouts (table adapt mode) |
51+
| Utilities | `SBodyScrollLockProvider`, `STooltip`, transition wrappers in `Transitions/` |
5252

5353
Storybook documents the full API surface with live examples. Use `yarn sb:serve` and navigate through component categories.
5454

‎docs/getting-started.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,20 +29,25 @@ The install command resolves all workspace dependencies (including Storybook, Vi
2929
Some workflows depend on generated artefacts:
3030

3131
1. **Build the theme tokens at least once per session.**
32+
3233
```sh
3334
yarn build:theme
3435
```
36+
3537
This compiles Sass tokens into CSS variables consumed by the UI package.
3638

3739
2. **Build the SVG plugin** (runs automatically before Storybook via `presb:serve`, but it can be invoked manually when testing changes to the plugin).
40+
3841
```sh
3942
yarn build:vite-plugin-svg
4043
```
4144

4245
3. **Run Storybook** to explore components interactively.
46+
4347
```sh
4448
yarn sb:serve
4549
```
50+
4651
Storybook is served from `packages/ui/.storybook` and listens on port 6006 by default.
4752

4853
4. **(Optional) Compile all packages.** Useful for ensuring release readiness.
@@ -84,6 +89,7 @@ The published packages are available on NPM under the `@soramitsu-ui/*` scope. T
8489
yarn link "@soramitsu-ui/vite-plugin-svg" # optional, for local SVG fixes
8590
```
8691
4. Import the plugin in your Vue app:
92+
8793
```ts
8894
import { createApp } from 'vue'
8995
import { plugin as SoramitsuPlugin } from '@soramitsu-ui/ui'

‎docs/project-structure.md‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -66,12 +66,12 @@ The repository is a Yarn workspace monorepo. Each package owns its build tools,
6666

6767
## Where to place new work
6868

69-
| Task | Location | Notes |
70-
| --- | --- | --- |
71-
| New Vue component | `packages/ui/src/components/<Name>` | Export via `index.ts` and `all-components.ts`; add Storybook stories and Cypress tests. |
72-
| Shared composable | `packages/ui/src/composables` | Prefix with `use` and document in [components.md](components.md). |
73-
| Token or typography addition | `packages/theme/src/sass/tokens.scss` and related utilities | Update docs in [theming.md](theming.md) and add Jest coverage. |
74-
| Storybook configuration | `packages/ui/.storybook` and `stories/` | Story-level guidance in [storybook.md](storybook.md). |
75-
| Release automation | Root scripts or `lerna.json` | Coordinate with [release-management.md](release-management.md). |
69+
| Task | Location | Notes |
70+
| ---------------------------- | ----------------------------------------------------------- | --------------------------------------------------------------------------------------- |
71+
| New Vue component | `packages/ui/src/components/<Name>` | Export via `index.ts` and `all-components.ts`; add Storybook stories and Cypress tests. |
72+
| Shared composable | `packages/ui/src/composables` | Prefix with `use` and document in [components.md](components.md). |
73+
| Token or typography addition | `packages/theme/src/sass/tokens.scss` and related utilities | Update docs in [theming.md](theming.md) and add Jest coverage. |
74+
| Storybook configuration | `packages/ui/.storybook` and `stories/` | Story-level guidance in [storybook.md](storybook.md). |
75+
| Release automation | Root scripts or `lerna.json` | Coordinate with [release-management.md](release-management.md). |
7676

7777
Keeping this structure predictable simplifies navigation for both designers and engineers. If you introduce a new folder or package, document it here.

‎docs/scripts-reference.md‎

Lines changed: 42 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -4,67 +4,67 @@ Use this cheat sheet to find the right Yarn script for each task. Run commands f
44

55
## Root-level scripts
66

7-
| Command | Purpose |
8-
| --- | --- |
9-
| `yarn build` | Builds theme, SVG plugin, and UI package in sequence. |
10-
| `yarn build:theme` | Compiles design tokens and typography assets. |
11-
| `yarn build:vite-plugin-svg` | Builds the custom SVG loader used by Storybook and the UI package. |
12-
| `yarn build:ui` | Runs the full UI build (`clean` → `tsc` → `vite` → `api:extract`). |
13-
| `yarn build:ui:only-vite` | Executes only the Vite bundle step for the UI package. |
14-
| `yarn sb:serve` | Starts Storybook on port 6006 (prebuilds the SVG plugin). |
15-
| `yarn sb:build` | Produces a static Storybook build under `packages/ui/storybook-static`. |
16-
| `yarn test:all` | Full quality gate: lint → tests → builds. Mirrors CI. |
17-
| `yarn test:theme:unit` | Runs Jest suites for `@soramitsu-ui/theme`. |
18-
| `yarn test:ui:unit` | Executes Vitest unit tests for the UI package. |
19-
| `yarn test:ui:cy` | Runs Cypress component tests in headless mode. |
20-
| `yarn test:ui:cy-open` | Opens the interactive Cypress runner. |
21-
| `yarn test:ui:after-build` | Post-build verification for compiled UI output. |
22-
| `yarn lint:es` | Runs ESLint across the workspace. |
23-
| `yarn lint:es:fix` | Runs ESLint with auto-fix. |
24-
| `yarn lint:format:check` | Checks Prettier formatting. |
25-
| `yarn lint:format:fix` | Applies Prettier formatting, then ESLint auto-fix. |
26-
| `yarn lint:check` | Executes `lint:es` and `lint:format:check`. |
27-
| `yarn storybook:verify` | Ensures Storybook builds cleanly (prebuilds the SVG plugin automatically). |
28-
| `yarn publish-workspaces` | Publishes all packages that have been versioned via Changesets (Lerna `from-package`). |
7+
| Command | Purpose |
8+
| ---------------------------- | -------------------------------------------------------------------------------------- |
9+
| `yarn build` | Builds theme, SVG plugin, and UI package in sequence. |
10+
| `yarn build:theme` | Compiles design tokens and typography assets. |
11+
| `yarn build:vite-plugin-svg` | Builds the custom SVG loader used by Storybook and the UI package. |
12+
| `yarn build:ui` | Runs the full UI build (`clean` → `tsc` → `vite` → `api:extract`). |
13+
| `yarn build:ui:only-vite` | Executes only the Vite bundle step for the UI package. |
14+
| `yarn sb:serve` | Starts Storybook on port 6006 (prebuilds the SVG plugin). |
15+
| `yarn sb:build` | Produces a static Storybook build under `packages/ui/storybook-static`. |
16+
| `yarn test:all` | Full quality gate: lint → tests → builds. Mirrors CI. |
17+
| `yarn test:theme:unit` | Runs Jest suites for `@soramitsu-ui/theme`. |
18+
| `yarn test:ui:unit` | Executes Vitest unit tests for the UI package. |
19+
| `yarn test:ui:cy` | Runs Cypress component tests in headless mode. |
20+
| `yarn test:ui:cy-open` | Opens the interactive Cypress runner. |
21+
| `yarn test:ui:after-build` | Post-build verification for compiled UI output. |
22+
| `yarn lint:es` | Runs ESLint across the workspace. |
23+
| `yarn lint:es:fix` | Runs ESLint with auto-fix. |
24+
| `yarn lint:format:check` | Checks Prettier formatting. |
25+
| `yarn lint:format:fix` | Applies Prettier formatting, then ESLint auto-fix. |
26+
| `yarn lint:check` | Executes `lint:es` and `lint:format:check`. |
27+
| `yarn storybook:verify` | Ensures Storybook builds cleanly (prebuilds the SVG plugin automatically). |
28+
| `yarn publish-workspaces` | Publishes all packages that have been versioned via Changesets (Lerna `from-package`). |
2929

3030
## Package-specific scripts
3131

3232
### `packages/ui`
3333

3434
Run with `yarn --cwd packages/ui <script>`.
3535

36-
| Script | Purpose |
37-
| --- | --- |
38-
| `build` | Clean, type-check, Vite build, API Extractor. |
39-
| `build:clean` | Removes `dist/` and `dist-ts/`. |
40-
| `build:tsc` | Generates type declarations via `vue-tsc`. |
41-
| `build:vite` | Bundles the library using Vite (ESM + CJS outputs). |
42-
| `api:extract` | Produces `ui.api.md` using Microsoft API Extractor. |
36+
| Script | Purpose |
37+
| ------------------- | -------------------------------------------------------------- |
38+
| `build` | Clean, type-check, Vite build, API Extractor. |
39+
| `build:clean` | Removes `dist/` and `dist-ts/`. |
40+
| `build:tsc` | Generates type declarations via `vue-tsc`. |
41+
| `build:vite` | Bundles the library using Vite (ESM + CJS outputs). |
42+
| `api:extract` | Produces `ui.api.md` using Microsoft API Extractor. |
4343
| `api:extract:local` | API Extractor in local mode (skips .api.md consistency check). |
44-
| `sb:serve` | Storybook dev server scoped to the UI package. |
45-
| `sb:build` | Storybook static export. |
46-
| `sb:test` | Runs Storybook test runner (Playwright). |
47-
| `test:unit` | Vitest unit tests. |
48-
| `test:after-build` | Runs assertions against the compiled `dist/`. |
49-
| `cy` | Opens Cypress component UI runner. |
50-
| `cy:ci:component` | Headless Cypress component tests. |
51-
| `typecheck` | TypeScript type checking via `vue-tsc`. |
44+
| `sb:serve` | Storybook dev server scoped to the UI package. |
45+
| `sb:build` | Storybook static export. |
46+
| `sb:test` | Runs Storybook test runner (Playwright). |
47+
| `test:unit` | Vitest unit tests. |
48+
| `test:after-build` | Runs assertions against the compiled `dist/`. |
49+
| `cy` | Opens Cypress component UI runner. |
50+
| `cy:ci:component` | Headless Cypress component tests. |
51+
| `typecheck` | TypeScript type checking via `vue-tsc`. |
5252

5353
### `packages/theme`
5454

5555
Run with `yarn --cwd packages/theme <script>`.
5656

57-
| Script | Purpose |
58-
| --- | --- |
57+
| Script | Purpose |
58+
| ------- | --------------------------------------------------------- |
5959
| `build` | Compiles Sass tokens and TypeScript exports into `dist/`. |
60-
| `test` | Jest suite validating token schemas and mixins. |
60+
| `test` | Jest suite validating token schemas and mixins. |
6161

6262
### `packages/vite-plugin-svg`
6363

6464
Run with `yarn --cwd packages/vite-plugin-svg <script>`.
6565

66-
| Script | Purpose |
67-
| --- | --- |
66+
| Script | Purpose |
67+
| ------- | ------------------------------------ |
6868
| `build` | Bundles the plugin for distribution. |
6969

7070
### `packages/icons`

‎docs/storybook.md‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -111,10 +111,10 @@ export const Primary: Story = {
111111

112112
## Troubleshooting
113113

114-
| Symptom | Fix |
115-
| --- | --- |
116-
| Storybook fails with SVG import errors | Rebuild the SVG plugin (`yarn build:vite-plugin-svg`) or reinstall dependencies. |
117-
| Stories render blank | Inspect console for missing theme CSS. Ensure `@soramitsu-ui/ui/styles` is imported in `preview.ts`. |
118-
| Controls panel missing props | Export prop typings or ensure `defineProps` includes default values for Storybook to infer. |
114+
| Symptom | Fix |
115+
| -------------------------------------- | ---------------------------------------------------------------------------------------------------- |
116+
| Storybook fails with SVG import errors | Rebuild the SVG plugin (`yarn build:vite-plugin-svg`) or reinstall dependencies. |
117+
| Stories render blank | Inspect console for missing theme CSS. Ensure `@soramitsu-ui/ui/styles` is imported in `preview.ts`. |
118+
| Controls panel missing props | Export prop typings or ensure `defineProps` includes default values for Storybook to infer. |
119119

120120
Keep this guide updated as Storybook evolves (new addons, frameworks, or CI integrations).

‎docs/theming.md‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -29,13 +29,15 @@ Import the Sass module and use the provided mixins/functions to bind or evaluate
2929
@include theme.tokens-preset-light;
3030

3131
// Override specific values
32-
@include theme.eval-tokens-partial((
33-
sys: (
34-
color: (
35-
primary: #0057b8,
32+
@include theme.eval-tokens-partial(
33+
(
34+
sys: (
35+
color: (
36+
primary: #0057b8,
37+
),
3638
),
37-
),
38-
));
39+
)
40+
);
3941
}
4042

4143
.button {

‎docs/troubleshooting.md‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@ This page lists common issues encountered while working with the Soramitsu UI mo
44

55
## Installation issues
66

7-
| Symptom | Resolution |
8-
| --- | --- |
9-
| `node` version mismatch errors | Install Node 18+ and clear `node_modules` (`rm -rf node_modules && yarn`). |
7+
| Symptom | Resolution |
8+
| ---------------------------------------- | --------------------------------------------------------------------------------------------------- |
9+
| `node` version mismatch errors | Install Node 18+ and clear `node_modules` (`rm -rf node_modules && yarn`). |
1010
| Yarn complains about incompatible engine | Ensure you are using Yarn 1.x (`yarn --version`). Remove `.pnp.cjs` if Yarn 2+ was previously used. |
11-
| `esbuild` download failures | Set the `ESBUILD_BINARY_PATH` or install via `yarn add --dev esbuild` manually, then retry `yarn`. |
11+
| `esbuild` download failures | Set the `ESBUILD_BINARY_PATH` or install via `yarn add --dev esbuild` manually, then retry `yarn`. |
1212

1313
## Storybook fails to start
1414

0 commit comments

Comments
 (0)