Skip to content

Commit 2714755

Browse files
timkpainetimkpaine
committed
Initialize Web Awesome UI toolkit template
Signed-off-by: Tim Paine <3105306+timkpaine@users.noreply.github.com>
0 parents  commit 2714755

26 files changed

Lines changed: 2438 additions & 0 deletions

‎.copier-answers.yaml‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
# Changes here will be overwritten by Copier
2+
_commit: 690e994
3+
_src_path: https://github.com/python-project-templates/base.git
4+
add_extension: uitk-webawesome
5+
brand_name: Example
6+
css_prefix: example
7+
element_prefix: example
8+
github: python-project-templates
9+
package_name: '@python-project-templates/uitk-webawesome'
10+
project_description: Shared brand identity, design tokens, and reusable Lit and Web
11+
Awesome components.
12+
project_name: javascript-template-uitk-webawesome

‎.github/workflows/build.yaml‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
name: Build Status
2+
3+
on:
4+
push:
5+
branches: [main]
6+
tags: [v*]
7+
pull_request:
8+
workflow_dispatch:
9+
10+
permissions:
11+
contents: read
12+
13+
jobs:
14+
build:
15+
runs-on: ubuntu-latest
16+
steps:
17+
- uses: actions/checkout@v7
18+
- uses: pnpm/action-setup@v6
19+
with:
20+
version: 11
21+
- uses: actions/setup-node@v7
22+
with:
23+
node-version: 22.x
24+
cache: pnpm
25+
- run: pnpm install
26+
- run: pnpm build
27+
- run: pnpm check
28+
- run: pnpm lint
29+
- run: pnpm test:unit
30+
- run: pnpm exec playwright install --with-deps chromium
31+
- run: pnpm test:e2e
32+
env:
33+
CI: '1'

‎.gitignore‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
node_modules
2+
/dist
3+
/.svelte-kit
4+
/build
5+
/coverage
6+
/playwright-report
7+
/test-results
8+
.DS_Store

‎.oxfmtrc.json‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"$schema": "./node_modules/oxfmt/configuration_schema.json",
3+
"printWidth": 120,
4+
"semi": true,
5+
"singleQuote": true,
6+
"tabWidth": 2,
7+
"trailingComma": "none",
8+
"sortPackageJson": false,
9+
"ignorePatterns": [
10+
".svelte-kit/**",
11+
".copier-answers.yaml",
12+
"build/**",
13+
"coverage/**",
14+
"dist/**",
15+
"playwright-report/**",
16+
"test-results/**"
17+
]
18+
}

‎.oxlintrc.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"$schema": "./node_modules/oxlint/configuration_schema.json",
3+
"env": {
4+
"browser": true,
5+
"es6": true,
6+
"node": true
7+
}
8+
}

‎BRAND.md‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
# Example Brand Guide
2+
3+
Canonical source for the Example identity. Replace each placeholder before publishing the first consumer.
4+
5+
## Identity
6+
7+
Describe what Example is, who it serves, and what it must not be confused with.
8+
9+
## Mark
10+
11+
Document primary mark, clear space, minimum size, and approved variants.
12+
13+
## Color
14+
15+
| Role | Light | Dark | Usage |
16+
| ------ | --------- | --------- | ------------------ |
17+
| Paper | `#f5f5f0` | `#151515` | Page surfaces |
18+
| Ink | `#151515` | `#f5f5f0` | Primary content |
19+
| Muted | `#666660` | `#aaa9a0` | Supporting content |
20+
| Line | `#d0d0c8` | `#3a3a36` | Borders and rules |
21+
| Accent | `#6cff8f` | `#6cff8f` | Focus and emphasis |
22+
23+
## Typography
24+
25+
Document font families, weights, scale, tracking, and fallback behavior.
26+
27+
## Composition
28+
29+
Document spacing, layout, shape, imagery, and data-visualization rules.
30+
31+
## Motion
32+
33+
Document purposeful transitions and reduced-motion behavior.
34+
35+
## Voice
36+
37+
Document preferred vocabulary, sentence style, capitalization, and examples.

‎README.md‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
# @python-project-templates/uitk-webawesome
2+
3+
Shared brand identity, design tokens, and reusable Lit and Web Awesome components.
4+
5+
See [`BRAND.md`](./BRAND.md) for the canonical brand guide.
6+
7+
## Install
8+
9+
```bash
10+
pnpm add @python-project-templates/uitk-webawesome
11+
```
12+
13+
Import design tokens once at the application root:
14+
15+
```css
16+
@import '@python-project-templates/uitk-webawesome/tokens.css';
17+
```
18+
19+
```ts
20+
import '@python-project-templates/uitk-webawesome';
21+
```
22+
23+
```html
24+
<example-brand-mark></example-brand-mark> <example-theme-toggle></example-theme-toggle>
25+
```
26+
27+
## Develop
28+
29+
```bash
30+
pnpm install
31+
pnpm dev
32+
pnpm check
33+
pnpm lint
34+
pnpm fix
35+
pnpm test
36+
pnpm build
37+
```
38+
39+
After customizing the showcase, run `pnpm test:e2e:update` once to establish its visual baseline.

‎index.html‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
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.0" />
6+
<title>Example brand kit</title>
7+
<script>
8+
try {
9+
const saved = localStorage.getItem('javascript-template-uitk-webawesome.theme');
10+
const theme =
11+
saved === 'light' || saved === 'dark'
12+
? saved
13+
: matchMedia('(prefers-color-scheme: dark)').matches
14+
? 'dark'
15+
: 'light';
16+
document.documentElement.dataset.theme = theme;
17+
} catch {}
18+
</script>
19+
</head>
20+
<body>
21+
<main>
22+
<p class="eyebrow">Brand toolkit</p>
23+
<example-brand-mark></example-brand-mark>
24+
<p>Shared brand identity, design tokens, and reusable Lit and Web Awesome components.</p>
25+
<example-theme-toggle data-testid="theme-toggle"></example-theme-toggle>
26+
</main>
27+
<script type="module" src="/src/demo.ts"></script>
28+
</body>
29+
</html>

‎package.json‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
{
2+
"name": "@python-project-templates/uitk-webawesome",
3+
"version": "0.1.0",
4+
"description": "Shared brand identity, design tokens, and reusable Lit and Web Awesome components.",
5+
"license": "Apache-2.0",
6+
"private": true,
7+
"packageManager": "pnpm@11.9.0",
8+
"engines": {
9+
"node": ">=22"
10+
},
11+
"type": "module",
12+
"files": [
13+
"dist",
14+
"!dist/**/*.test.*",
15+
"!dist/**/*.spec.*"
16+
],
17+
"types": "./dist/index.d.ts",
18+
"exports": {
19+
".": {
20+
"types": "./dist/index.d.ts",
21+
"import": "./dist/index.js",
22+
"default": "./dist/index.js"
23+
},
24+
"./tokens.css": "./dist/tokens.css",
25+
"./package.json": "./package.json"
26+
},
27+
"sideEffects": [
28+
"**/*.css"
29+
],
30+
"scripts": {
31+
"dev": "vite dev",
32+
"build": "vite build && tsc -p tsconfig.build.json --emitDeclarationOnly && publint",
33+
"check": "tsc --noEmit",
34+
"preview": "vite preview",
35+
"lint": "oxlint . && oxfmt --check .",
36+
"fix": "oxlint --fix . && oxfmt --write .",
37+
"test": "pnpm test:unit && pnpm test:e2e",
38+
"test:unit": "vitest run",
39+
"test:e2e": "playwright test",
40+
"test:e2e:update": "playwright test --update-snapshots"
41+
},
42+
"peerDependencies": {
43+
"@awesome.me/webawesome": "^3.11.0",
44+
"lit": "^3.3.3"
45+
},
46+
"devDependencies": {
47+
"@axe-core/playwright": "^4.12.1",
48+
"@playwright/test": "^1.60.0",
49+
"@awesome.me/webawesome": "^3.11.0",
50+
"lit": "^3.3.3",
51+
"@types/node": "^24.0.0",
52+
"jsdom": "^29.0.0",
53+
"oxfmt": "^0.63.0",
54+
"oxlint": "^1.78.0",
55+
"publint": "^0.3.21",
56+
"typescript": "^5.9.3",
57+
"vite": "^8.1.5",
58+
"vitest": "^4.1.8"
59+
}
60+
}

‎playwright.config.ts‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import { defineConfig, devices } from '@playwright/test';
2+
3+
export default defineConfig({
4+
testDir: 'tests',
5+
testIgnore: process.env.CI ? ['**/visual/**'] : [],
6+
snapshotPathTemplate: '{testDir}/{testFilePath}-snapshots/{arg}-{projectName}{ext}',
7+
fullyParallel: true,
8+
forbidOnly: !!process.env.CI,
9+
retries: process.env.CI ? 2 : 0,
10+
reporter: process.env.CI ? 'github' : 'list',
11+
use: {
12+
baseURL: 'http://127.0.0.1:4177',
13+
trace: 'retain-on-failure',
14+
screenshot: 'only-on-failure'
15+
},
16+
webServer: {
17+
command: 'vite dev --host 127.0.0.1 --port 4177 --strictPort',
18+
port: 4177,
19+
reuseExistingServer: !process.env.CI,
20+
timeout: 120_000
21+
},
22+
projects: [
23+
{
24+
name: 'desktop',
25+
use: { ...devices['Desktop Chrome'], viewport: { width: 1280, height: 800 } }
26+
}
27+
]
28+
});

0 commit comments

Comments
 (0)