Skip to content

Commit 7b7705c

Browse files
thedanchezthedanchez
committed
Initial commit
0 parents  commit 7b7705c

20 files changed

+420
-0
lines changed

‎.eslintrc.json

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"parser": "@typescript-eslint/parser",
3+
"plugins": ["simple-import-sort", "solid"],
4+
"extends": [
5+
"eslint:recommended",
6+
"plugin:@typescript-eslint/eslint-recommended",
7+
"plugin:@typescript-eslint/recommended",
8+
"plugin:solid/typescript"
9+
],
10+
"env": {
11+
"browser": true,
12+
"node": true,
13+
"es6": true,
14+
"jest": true
15+
},
16+
"parserOptions": {
17+
"sourceType": "module"
18+
},
19+
"rules": {
20+
"@typescript-eslint/no-unused-vars": ["error", { "varsIgnorePattern": "^_" }],
21+
"no-unused-vars": "off",
22+
"simple-import-sort/imports": "error",
23+
"simple-import-sort/exports": "error"
24+
},
25+
"ignorePatterns": ["dist", "node_modules"]
26+
}

‎.github/CODEOWNERS

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
thedanchez

‎.github/workflows/ci.yaml

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
name: CI
2+
on:
3+
push:
4+
branches:
5+
- main
6+
pull_request:
7+
branches:
8+
- main
9+
workflow_dispatch:
10+
11+
jobs:
12+
quality-checks:
13+
name: Quality Checks
14+
runs-on: ubuntu-latest
15+
steps:
16+
- name: Checkout
17+
uses: actions/checkout@v4
18+
- name: Setup Bun
19+
uses: oven-sh/setup-bun@v1
20+
with:
21+
bun-version: latest
22+
- name: Install Dependencies
23+
run: bun install --frozen-lockfile
24+
- name: Lint Check
25+
run: bun run lint
26+
- name: Format Check
27+
run: bun run format
28+
- name: Test Coverage Check
29+
run: bun run test

‎.gitignore

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
coverage
2+
dist
3+
node_modules
4+
5+
.DS_Store
6+
/*.tgz

‎.nvmrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
20.17.0

‎.prettierignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
coverage
2+
dist
3+
node_modules

‎.prettierrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"printWidth": 120
3+
}

‎.vscode/settings.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"editor.codeActionsOnSave": {
3+
"source.fixAll": "always"
4+
},
5+
"editor.formatOnSave": true,
6+
"editor.rulers": [120],
7+
"files.autoSave": "onFocusChange",
8+
"files.insertFinalNewline": true
9+
}

‎README.md

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
# Template: SolidJS Library
2+
3+
Template for [SolidJS](https://www.solidjs.com/) library package. Bundling of the library is managed by [tsup](https://tsup.egoist.dev/).
4+
5+
Other things configured include:
6+
7+
- Bun (for dependency management and running scripts)
8+
- TypeScript
9+
- ESLint / Prettier
10+
- Solid Testing Library + Vitest (for testing)
11+
- GitHub Actions (for all CI/CD)
12+
13+
## Getting Started
14+
15+
Some pre-requisites before install dependencies:
16+
17+
- Install Node Version Manager (NVM)
18+
```bash
19+
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
20+
```
21+
- Install Bun
22+
```bash
23+
curl -fsSL https://bun.sh/install | bash
24+
```
25+
26+
### Installing Dependencies
27+
28+
```bash
29+
nvm use
30+
bun install
31+
```
32+
33+
### Local Development Build
34+
35+
```bash
36+
bun start
37+
```
38+
39+
### Linting & Formatting
40+
41+
```bash
42+
bun run lint # checks source for lint violations
43+
bun run format # checks source for format violations
44+
45+
bun run lint:fix # fixes lint violations
46+
bun run format:fix # fixes format violations
47+
```
48+
49+
### Unit Testing
50+
51+
> We use [Solid Testing Library](https://github.com/solidjs/solid-testing-library) for integration style unit tests
52+
53+
```bash
54+
bun run test
55+
bun run test:cov # with test coverage
56+
```
57+
58+
### Contributing
59+
60+
The only requirements when contributing are:
61+
62+
- You keep a clean git history in your branch
63+
- rebasing `main` instead of making merge commits.
64+
- Using proper commit message formats that adhere to [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/)
65+
- Additionally, squashing (via rebase) commits that are not [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/)
66+
- CI checks pass before merging into `main`

‎bun.lockb

176 KB
Binary file not shown.

‎index.html

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<meta name="theme-color" content="#000000" />
7+
<link rel="shortcut icon" type="image/ico" href="/playground/assets/favicon.ico" />
8+
<title>Solid App</title>
9+
</head>
10+
<body>
11+
<noscript>You need to enable JavaScript to run this app.</noscript>
12+
<div id="root"></div>
13+
14+
<script src="/playground/index.tsx" type="module"></script>
15+
</body>
16+
</html>

‎package.json

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
{
2+
"name": "template-solidjs-library",
3+
"version": "0.0.0",
4+
"description": "Template for SolidJS library using tsup for bundling. Configured with Bun, NVM, TypeScript, ESLint, Prettier, Vitest, and GHA",
5+
"type": "module",
6+
"scripts": {
7+
"build": "tsup",
8+
"build:watch": "tsup --watch",
9+
"dev": "vite",
10+
"format": "prettier . --check",
11+
"format:fix": "prettier . --write",
12+
"lint": "eslint . --ext .ts,.tsx",
13+
"lint:fix": "eslint . --ext .ts,.tsx --fix",
14+
"serve": "vite preview",
15+
"start": "vite",
16+
"test": "vitest run",
17+
"test:cov": "vitest run --coverage",
18+
"typecheck": "tsc --noEmit"
19+
},
20+
"license": "MIT",
21+
"devDependencies": {
22+
"@solidjs/testing-library": "^0.8.10",
23+
"@testing-library/jest-dom": "^6.5.0",
24+
"@types/bun": "^1.1.10",
25+
"@typescript-eslint/eslint-plugin": "^8.7.0",
26+
"@typescript-eslint/parser": "^8.7.0",
27+
"@vitest/coverage-istanbul": "^2.1.1",
28+
"eslint": "^8.57.0",
29+
"eslint-plugin-simple-import-sort": "^12.1.1",
30+
"eslint-plugin-solid": "^0.14.3",
31+
"jsdom": "^25.0.1",
32+
"prettier": "^3.3.3",
33+
"tsup": "^8.3.0",
34+
"tsup-preset-solid": "^2.2.0",
35+
"typescript": "^5.6.2",
36+
"vite": "^5.4.8",
37+
"vite-plugin-solid": "^2.10.2",
38+
"vitest": "^2.1.1"
39+
},
40+
"peerDependencies": {
41+
"solid-js": ">=1.8.0"
42+
}
43+
}

‎playground/App.tsx

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
import { createSignal, For } from "solid-js";
2+
import { createStore } from "solid-js/store";
3+
4+
type Todo = { id: number; text: string; completed: boolean };
5+
6+
export const App = () => {
7+
let input!: HTMLInputElement;
8+
9+
const [count, setCount] = createSignal(0);
10+
const [todos, setTodos] = createStore<Todo[]>([]);
11+
12+
const addTodo = (text: string) => {
13+
setTodos(todos.length, { id: todos.length, text, completed: false });
14+
};
15+
16+
const toggleTodo = (id: number) => {
17+
setTodos(id, "completed", (c) => !c);
18+
};
19+
20+
return (
21+
<>
22+
<div>
23+
<div>Count: {count()}</div>
24+
<button
25+
onClick={() => {
26+
setCount((prev) => prev + 1);
27+
}}
28+
>
29+
Increment Count
30+
</button>
31+
<input placeholder="new todo here" ref={input} />
32+
<button
33+
onClick={() => {
34+
if (!input.value.trim()) return;
35+
addTodo(input.value);
36+
input.value = "";
37+
}}
38+
>
39+
Add Todo
40+
</button>
41+
</div>
42+
<For each={todos}>
43+
{(todo) => {
44+
const { id, text } = todo;
45+
return (
46+
<div>
47+
<input type="checkbox" checked={todo.completed} onChange={[toggleTodo, id]} />
48+
<span
49+
style={{
50+
"text-decoration": todo.completed ? "line-through" : "none",
51+
}}
52+
>
53+
{text}
54+
</span>
55+
</div>
56+
);
57+
}}
58+
</For>
59+
</>
60+
);
61+
};

‎playground/__tests__/todo-list.test.tsx

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import { fireEvent, render } from "@solidjs/testing-library";
2+
import { describe, expect, test } from "vitest";
3+
4+
import { TodoList } from "../App";
5+
6+
describe("<TodoList />", () => {
7+
test("it will render an text input and a button", () => {
8+
const { getByPlaceholderText, getByText } = render(() => <TodoList />);
9+
expect(getByPlaceholderText("new todo here")).toBeInTheDocument();
10+
expect(getByText("Add Todo")).toBeInTheDocument();
11+
});
12+
13+
test("it will add a new todo", async () => {
14+
const { getByPlaceholderText, getByText } = render(() => <TodoList />);
15+
const input = getByPlaceholderText("new todo here") as HTMLInputElement;
16+
const button = getByText("Add Todo");
17+
input.value = "test new todo";
18+
fireEvent.click(button as HTMLInputElement);
19+
expect(input.value).toBe("");
20+
expect(getByText(/test new todo/)).toBeInTheDocument();
21+
});
22+
23+
test("it will mark a todo as completed", async () => {
24+
const { getByPlaceholderText, findByRole, getByText } = render(() => <TodoList />);
25+
const input = getByPlaceholderText("new todo here") as HTMLInputElement;
26+
const button = getByText("Add Todo") as HTMLButtonElement;
27+
input.value = "mark new todo as completed";
28+
fireEvent.click(button);
29+
const completed = (await findByRole("checkbox")) as HTMLInputElement;
30+
expect(completed?.checked).toBe(false);
31+
fireEvent.click(completed);
32+
expect(completed?.checked).toBe(true);
33+
const text = getByText("mark new todo as completed") as HTMLSpanElement;
34+
expect(text).toHaveStyle({ "text-decoration": "line-through" });
35+
});
36+
});

‎playground/index.tsx

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { render } from "solid-js/web";
2+
3+
import { App } from "./App";
4+
5+
const root = document.getElementById("root");
6+
7+
if (import.meta.env.DEV && !(root instanceof HTMLElement)) {
8+
throw new Error(
9+
"Root element not found. Did you forget to add it to your index.html? Or maybe the id attribute got misspelled?",
10+
);
11+
}
12+
13+
render(() => <App />, root!);

‎setupTests.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import "@testing-library/jest-dom/vitest";

‎src/index.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
// Main library export site
2+
// Use playground app (via Vite) to test and document the library

‎tsconfig.json

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"compilerOptions": {
3+
/* Base Options: */
4+
"outDir": "dist",
5+
"esModuleInterop": true,
6+
"skipLibCheck": true,
7+
"target": "ESNext",
8+
"module": "ESNext",
9+
"lib": ["ESNext", "DOM", "DOM.Iterable"],
10+
"allowJs": true,
11+
"resolveJsonModule": true,
12+
"moduleResolution": "Bundler",
13+
"moduleDetection": "force",
14+
"isolatedModules": true,
15+
"verbatimModuleSyntax": true,
16+
17+
/* Strictness */
18+
"strict": true,
19+
"allowUnreachableCode": false,
20+
"noImplicitOverride": true,
21+
"noFallthroughCasesInSwitch": true,
22+
"noUncheckedIndexedAccess": true,
23+
"noUnusedLocals": true,
24+
"noUnusedParameters": true,
25+
26+
/* JSX */
27+
"jsx": "preserve",
28+
"jsxImportSource": "solid-js",
29+
30+
/* Types */
31+
"types": ["vite/client", "bun-types", "@testing-library/jest-dom"]
32+
},
33+
"exclude": ["node_modules", "coverage", "dist"]
34+
}

0 commit comments

Comments
 (0)