@steez-ui/ui 0.1.0 → 0.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +82 -25
- package/dist/components/PageHeader.d.ts +5 -1
- package/dist/components/PageHeader.d.ts.map +1 -1
- package/dist/components/PageHeader.js +3 -2
- package/dist/components/PageHeader.js.map +1 -1
- package/dist/components/PageTemplate.d.ts +5 -1
- package/dist/components/PageTemplate.d.ts.map +1 -1
- package/dist/components/PageTemplate.js +2 -2
- package/dist/components/PageTemplate.js.map +1 -1
- package/package.json +5 -4
package/README.md
CHANGED
|
@@ -1,52 +1,109 @@
|
|
|
1
1
|
# Steez UI
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Standalone React primitives, flat theme tokens, and shadcn-compatible registry output.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
## Overview
|
|
6
|
+
|
|
7
|
+
Steez UI is authored once and shipped in two forms:
|
|
8
|
+
|
|
9
|
+
- npm packages for direct React consumption
|
|
10
|
+
- generated registry payloads for source-level installation
|
|
11
|
+
|
|
12
|
+
The source of truth lives in `packages/ui`. The registry output is generated from that same source tree, so the package build and registry install path stay aligned.
|
|
13
|
+
|
|
14
|
+
Live surfaces:
|
|
15
|
+
|
|
16
|
+
- Registry frontend: `https://steez-ui-6v5.pages.dev`
|
|
17
|
+
- Docs: `https://steez-ui-6v5.pages.dev/docs/`
|
|
18
|
+
- Packages: `https://steez-ui-6v5.pages.dev/packages/`
|
|
19
|
+
- Registry page: `https://steez-ui-6v5.pages.dev/registry/`
|
|
20
|
+
- Registry index: `https://steez-ui-6v5.pages.dev/r/index.json`
|
|
21
|
+
- Foundation preset: `https://steez-ui-6v5.pages.dev/r/foundation.json`
|
|
6
22
|
|
|
7
23
|
## Packages
|
|
8
24
|
|
|
9
25
|
- `@steez-ui/theme`
|
|
26
|
+
Theme tokens and compatibility aliases.
|
|
10
27
|
- `@steez-ui/icons`
|
|
28
|
+
Shared icon surface and provider.
|
|
11
29
|
- `@steez-ui/ui`
|
|
30
|
+
React primitives authored in `.tsx` and `.module.css`.
|
|
12
31
|
|
|
13
|
-
##
|
|
14
|
-
|
|
15
|
-
- `@steez-ui/registry`
|
|
32
|
+
## Install
|
|
16
33
|
|
|
17
|
-
|
|
34
|
+
Registry:
|
|
18
35
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
- `bun run publish:packages`
|
|
23
|
-
- `bun run deploy:registry`
|
|
24
|
-
- `bun run generate:registry`
|
|
25
|
-
- `bun run test`
|
|
26
|
-
- `bun run test:install-smoke`
|
|
36
|
+
```bash
|
|
37
|
+
bunx shadcn@latest add https://steez-ui-6v5.pages.dev/r/foundation.json
|
|
38
|
+
```
|
|
27
39
|
|
|
28
|
-
|
|
40
|
+
Packages:
|
|
29
41
|
|
|
30
42
|
```bash
|
|
31
|
-
|
|
43
|
+
bun add @steez-ui/theme @steez-ui/icons @steez-ui/ui
|
|
32
44
|
```
|
|
33
45
|
|
|
46
|
+
## Repo Layout
|
|
47
|
+
|
|
48
|
+
```text
|
|
49
|
+
packages/
|
|
50
|
+
theme/ # tokens and compatibility exports
|
|
51
|
+
icons/ # icon primitives and provider
|
|
52
|
+
ui/ # canonical component source
|
|
53
|
+
|
|
54
|
+
apps/
|
|
55
|
+
registry/ # public install frontend and registry docs
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
## Authoring Model
|
|
59
|
+
|
|
60
|
+
- `packages/theme` defines tokens first.
|
|
61
|
+
- `packages/icons` owns the shared icon surface.
|
|
62
|
+
- `packages/ui` is the canonical primitive source.
|
|
63
|
+
- `scripts/generate-registry.mjs` emits the registry JSON payloads from package source.
|
|
64
|
+
- `apps/registry` is the documentation, preview, and install frontend.
|
|
65
|
+
|
|
66
|
+
## Development
|
|
67
|
+
|
|
34
68
|
```bash
|
|
35
|
-
bun
|
|
69
|
+
bun install
|
|
70
|
+
bun run build
|
|
71
|
+
bun run test
|
|
72
|
+
bun run test:install-smoke
|
|
36
73
|
```
|
|
37
74
|
|
|
75
|
+
Useful commands:
|
|
76
|
+
|
|
77
|
+
- `bun run generate:registry`
|
|
78
|
+
- `bun run check:release`
|
|
79
|
+
- `bun run publish:packages:dry-run`
|
|
80
|
+
- `bun run publish:packages`
|
|
81
|
+
- `bun run deploy:registry`
|
|
82
|
+
|
|
83
|
+
## Adding Or Updating A Primitive
|
|
84
|
+
|
|
85
|
+
1. Build or update the component in `packages/ui/src/components`.
|
|
86
|
+
2. Export it from `packages/ui/src/index.ts`.
|
|
87
|
+
3. Add or update the registry item definition in `scripts/generate-registry.mjs`.
|
|
88
|
+
4. Run `bun run build` and `bun run test`.
|
|
89
|
+
5. Confirm the registry frontend reflects the new component or install path.
|
|
90
|
+
|
|
38
91
|
## Release Flow
|
|
39
92
|
|
|
40
|
-
1. `bun
|
|
41
|
-
2. `bun run
|
|
42
|
-
3. `bun run
|
|
43
|
-
|
|
93
|
+
1. `bun run check:release`
|
|
94
|
+
2. `bun run publish:packages`
|
|
95
|
+
3. `bun run deploy:registry`
|
|
96
|
+
|
|
97
|
+
GitHub Actions mirror the same CI, npm publish, and Cloudflare Pages deploy path.
|
|
98
|
+
|
|
99
|
+
## Current Packages
|
|
44
100
|
|
|
45
|
-
|
|
101
|
+
- `@steez-ui/theme@0.1.2`
|
|
102
|
+
- `@steez-ui/icons@0.1.2`
|
|
103
|
+
- `@steez-ui/ui@0.1.2`
|
|
46
104
|
|
|
47
|
-
##
|
|
105
|
+
## External Setup
|
|
48
106
|
|
|
49
|
-
- Create or claim the npm scope `@steez-ui`, then grant the publishing account access.
|
|
50
107
|
- Add `NPM_TOKEN` to the GitHub repository secrets before using the package publish workflow.
|
|
51
108
|
- Add `CLOUDFLARE_API_TOKEN` and `CLOUDFLARE_ACCOUNT_ID` to the GitHub repository secrets before relying on the Pages deploy workflow.
|
|
52
|
-
-
|
|
109
|
+
- Keep the Cloudflare Pages project named `steez-ui` so the deploy script and workflow stay in sync.
|
|
@@ -8,10 +8,14 @@ export interface PageHeaderProps {
|
|
|
8
8
|
className?: string;
|
|
9
9
|
brand?: ReactNode;
|
|
10
10
|
onBrandClick?: () => void;
|
|
11
|
+
brandTitle?: string;
|
|
12
|
+
brandAriaLabel?: string;
|
|
11
13
|
onBack?: () => void;
|
|
12
14
|
onSettings?: () => void;
|
|
13
15
|
onViewerToggle?: () => void;
|
|
14
16
|
viewerVisible?: boolean;
|
|
17
|
+
viewerShowLabel?: string;
|
|
18
|
+
viewerHideLabel?: string;
|
|
15
19
|
}
|
|
16
|
-
export declare function PageHeader({ title, description, icon, extra, className, brand, onBrandClick, onBack, onSettings, onViewerToggle, viewerVisible, }: PageHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
export declare function PageHeader({ title, description, icon, extra, className, brand, onBrandClick, brandTitle, brandAriaLabel, onBack, onSettings, onViewerToggle, viewerVisible, viewerShowLabel, viewerHideLabel, }: PageHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
17
21
|
//# sourceMappingURL=PageHeader.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../src/components/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIrD,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../src/components/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIrD,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAK,EACL,SAAc,EACd,KAAK,EACL,YAAY,EACZ,UAAU,EACV,cAAc,EACd,MAAM,EACN,UAAU,EACV,cAAc,EACd,aAAa,EACb,eAA+B,EAC/B,eAA+B,GAChC,EAAE,eAAe,2CAyDjB"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { EyeIcon, Icon, SlidersIcon } from "@steez-ui/icons";
|
|
3
3
|
import styles from "./PageHeader.module.css";
|
|
4
|
-
export function PageHeader({ title, description, icon, extra, className = "", brand, onBrandClick, onBack, onSettings, onViewerToggle, viewerVisible, }) {
|
|
5
|
-
|
|
4
|
+
export function PageHeader({ title, description, icon, extra, className = "", brand, onBrandClick, brandTitle, brandAriaLabel, onBack, onSettings, onViewerToggle, viewerVisible, viewerShowLabel = "Show viewer", viewerHideLabel = "Hide viewer", }) {
|
|
5
|
+
const viewerLabel = viewerVisible ? viewerHideLabel : viewerShowLabel;
|
|
6
|
+
return (_jsx("div", { className: `${styles.header} ${className}`.trim(), children: _jsxs("div", { className: styles.headerRow, children: [_jsxs("div", { className: styles.brandCluster, children: [brand || onBrandClick ? (_jsx("button", { type: "button", className: styles.brandButton, onClick: onBrandClick, title: brandTitle, "aria-label": brandAriaLabel, children: _jsx("span", { className: styles.brandVisual, children: brand ?? title.slice(0, 1) }) })) : null, _jsxs("div", { className: styles.headerContent, children: [_jsxs("h2", { children: [icon ? (_jsx("span", { className: styles.titleIcon, children: _jsx(Icon, { icon: icon, width: 18, height: 18 }) })) : null, title] }), description ? _jsx("p", { children: description }) : null] })] }), _jsxs("div", { className: styles.headerExtra, children: [extra, onBack ? (_jsx("button", { type: "button", className: styles.iconButton, onClick: onBack, "aria-label": "Go back", children: _jsx(Icon, { icon: "chevronLeft", width: 18, height: 18 }) })) : null, onSettings ? (_jsx("button", { type: "button", className: styles.iconButton, onClick: onSettings, "aria-label": "Open settings", children: _jsx(SlidersIcon, { width: 18, height: 18 }) })) : null, onViewerToggle ? (_jsx("button", { type: "button", className: styles.iconButton, onClick: onViewerToggle, "aria-label": viewerLabel, title: viewerLabel, children: _jsx(EyeIcon, { width: 18, height: 18 }) })) : null] })] }) }));
|
|
6
7
|
}
|
|
7
8
|
//# sourceMappingURL=PageHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageHeader.js","sourceRoot":"","sources":["../../src/components/PageHeader.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAG7D,OAAO,MAAM,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"PageHeader.js","sourceRoot":"","sources":["../../src/components/PageHeader.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAG7D,OAAO,MAAM,MAAM,yBAAyB,CAAC;AAoB7C,MAAM,UAAU,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAK,EACL,SAAS,GAAG,EAAE,EACd,KAAK,EACL,YAAY,EACZ,UAAU,EACV,cAAc,EACd,MAAM,EACN,UAAU,EACV,cAAc,EACd,aAAa,EACb,eAAe,GAAG,aAAa,EAC/B,eAAe,GAAG,aAAa,GACf;IAChB,MAAM,WAAW,GAAG,aAAa,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,CAAC;IAEtE,OAAO,CACL,cAAK,SAAS,EAAE,GAAG,MAAM,CAAC,MAAM,IAAI,SAAS,EAAE,CAAC,IAAI,EAAE,YACpD,eAAK,SAAS,EAAE,MAAM,CAAC,SAAS,aAC9B,eAAK,SAAS,EAAE,MAAM,CAAC,YAAY,aAChC,KAAK,IAAI,YAAY,CAAC,CAAC,CAAC,CACvB,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,WAAW,EAC7B,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,UAAU,gBACL,cAAc,YAE1B,eAAM,SAAS,EAAE,MAAM,CAAC,WAAW,YAAG,KAAK,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,GAAQ,GACjE,CACV,CAAC,CAAC,CAAC,IAAI,EACR,eAAK,SAAS,EAAE,MAAM,CAAC,aAAa,aAClC,yBACG,IAAI,CAAC,CAAC,CAAC,CACN,eAAM,SAAS,EAAE,MAAM,CAAC,SAAS,YAC/B,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,GACtC,CACR,CAAC,CAAC,CAAC,IAAI,EACP,KAAK,IACH,EACJ,WAAW,CAAC,CAAC,CAAC,sBAAI,WAAW,GAAK,CAAC,CAAC,CAAC,IAAI,IACtC,IACF,EACN,eAAK,SAAS,EAAE,MAAM,CAAC,WAAW,aAC/B,KAAK,EACL,MAAM,CAAC,CAAC,CAAC,CACR,iBAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,gBAAa,SAAS,YACvF,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,EAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,GAC3C,CACV,CAAC,CAAC,CAAC,IAAI,EACP,UAAU,CAAC,CAAC,CAAC,CACZ,iBAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,UAAU,EAAE,OAAO,EAAE,UAAU,gBAAa,eAAe,YACjG,KAAC,WAAW,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,GAC/B,CACV,CAAC,CAAC,CAAC,IAAI,EACP,cAAc,CAAC,CAAC,CAAC,CAChB,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,UAAU,EAC5B,OAAO,EAAE,cAAc,gBACX,WAAW,EACvB,KAAK,EAAE,WAAW,YAElB,KAAC,OAAO,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,GAC3B,CACV,CAAC,CAAC,CAAC,IAAI,IACJ,IACF,GACF,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -14,7 +14,11 @@ export interface PageTemplateProps extends Pick<PageHeaderProps, "title" | "desc
|
|
|
14
14
|
children?: React.ReactNode;
|
|
15
15
|
loading?: boolean;
|
|
16
16
|
showTitle?: boolean;
|
|
17
|
+
brandTitle?: string;
|
|
18
|
+
brandAriaLabel?: string;
|
|
19
|
+
viewerShowLabel?: string;
|
|
20
|
+
viewerHideLabel?: string;
|
|
17
21
|
}
|
|
18
|
-
export declare function PageTemplate({ title, actions, extra, description, icon, subTabs, activeSubTab, onSubTabChange, onBack, onSettings, brand, onBrandClick, onViewerToggle, viewerVisible, children, loading, showTitle, className, }: PageTemplateProps): import("react/jsx-runtime").JSX.Element;
|
|
22
|
+
export declare function PageTemplate({ title, actions, extra, description, icon, subTabs, activeSubTab, onSubTabChange, onBack, onSettings, brand, onBrandClick, onViewerToggle, viewerVisible, brandTitle, brandAriaLabel, viewerShowLabel, viewerHideLabel, children, loading, showTitle, className, }: PageTemplateProps): import("react/jsx-runtime").JSX.Element;
|
|
19
23
|
export {};
|
|
20
24
|
//# sourceMappingURL=PageTemplate.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageTemplate.d.ts","sourceRoot":"","sources":["../../src/components/PageTemplate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAGhE,UAAU,MAAM;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,iBACf,SAAQ,IAAI,CACV,eAAe,EACb,OAAO,GACP,aAAa,GACb,MAAM,GACN,QAAQ,GACR,YAAY,GACZ,OAAO,GACP,cAAc,GACd,gBAAgB,GAChB,eAAe,CAClB;IACD,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"PageTemplate.d.ts","sourceRoot":"","sources":["../../src/components/PageTemplate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAGhE,UAAU,MAAM;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,iBACf,SAAQ,IAAI,CACV,eAAe,EACb,OAAO,GACP,aAAa,GACb,MAAM,GACN,QAAQ,GACR,YAAY,GACZ,OAAO,GACP,cAAc,GACd,gBAAgB,GAChB,eAAe,CAClB;IACD,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,cAAc,EACd,MAAM,EACN,UAAU,EACV,KAAK,EACL,YAAY,EACZ,cAAc,EACd,aAAa,EACb,UAAU,EACV,cAAc,EACd,eAAe,EACf,eAAe,EACf,QAAQ,EACR,OAAO,EACP,SAAgB,EAChB,SAAc,GACf,EAAE,iBAAiB,2CAgDnB"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { PageHeader } from "./PageHeader";
|
|
3
3
|
import styles from "./PageTemplate.module.css";
|
|
4
|
-
export function PageTemplate({ title, actions, extra, description, icon, subTabs, activeSubTab, onSubTabChange, onBack, onSettings, brand, onBrandClick, onViewerToggle, viewerVisible, children, loading, showTitle = true, className = "", }) {
|
|
4
|
+
export function PageTemplate({ title, actions, extra, description, icon, subTabs, activeSubTab, onSubTabChange, onBack, onSettings, brand, onBrandClick, onViewerToggle, viewerVisible, brandTitle, brandAriaLabel, viewerShowLabel, viewerHideLabel, children, loading, showTitle = true, className = "", }) {
|
|
5
5
|
const headerExtra = extra ?? actions;
|
|
6
|
-
return (_jsxs("div", { className: `${styles.root} ${className}`.trim(), children: [showTitle ? (_jsx("div", { className: styles.header, children: _jsx(PageHeader, { title: title, description: description, icon: icon, extra: headerExtra, onBack: onBack, onSettings: onSettings, brand: brand, onBrandClick: onBrandClick, onViewerToggle: onViewerToggle, viewerVisible: viewerVisible }) })) : null, subTabs?.length ? (_jsx("div", { className: styles.subTabs, role: "tablist", "aria-label": `${title} sections`, children: subTabs.map((tab) => (_jsx("button", { onClick: () => onSubTabChange?.(tab.id), className: `${styles.subTabButton} ${activeSubTab === tab.id ? styles.subTabButtonActive : ""}`.trim(), type: "button", role: "tab", "aria-selected": activeSubTab === tab.id, children: tab.label }, tab.id))) })) : null, _jsx("div", { className: styles.content, children: loading ? _jsx("div", { className: styles.loading, children: "Loading..." }) : children ?? null })] }));
|
|
6
|
+
return (_jsxs("div", { className: `${styles.root} ${className}`.trim(), children: [showTitle ? (_jsx("div", { className: styles.header, children: _jsx(PageHeader, { title: title, description: description, icon: icon, extra: headerExtra, onBack: onBack, onSettings: onSettings, brand: brand, onBrandClick: onBrandClick, brandTitle: brandTitle, brandAriaLabel: brandAriaLabel, onViewerToggle: onViewerToggle, viewerVisible: viewerVisible, viewerShowLabel: viewerShowLabel, viewerHideLabel: viewerHideLabel }) })) : null, subTabs?.length ? (_jsx("div", { className: styles.subTabs, role: "tablist", "aria-label": `${title} sections`, children: subTabs.map((tab) => (_jsx("button", { onClick: () => onSubTabChange?.(tab.id), className: `${styles.subTabButton} ${activeSubTab === tab.id ? styles.subTabButtonActive : ""}`.trim(), type: "button", role: "tab", "aria-selected": activeSubTab === tab.id, children: tab.label }, tab.id))) })) : null, _jsx("div", { className: styles.content, children: loading ? _jsx("div", { className: styles.loading, children: "Loading..." }) : children ?? null })] }));
|
|
7
7
|
}
|
|
8
8
|
//# sourceMappingURL=PageTemplate.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageTemplate.js","sourceRoot":"","sources":["../../src/components/PageTemplate.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,UAAU,EAAwB,MAAM,cAAc,CAAC;AAChE,OAAO,MAAM,MAAM,2BAA2B,CAAC;
|
|
1
|
+
{"version":3,"file":"PageTemplate.js","sourceRoot":"","sources":["../../src/components/PageTemplate.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,UAAU,EAAwB,MAAM,cAAc,CAAC;AAChE,OAAO,MAAM,MAAM,2BAA2B,CAAC;AAmC/C,MAAM,UAAU,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,cAAc,EACd,MAAM,EACN,UAAU,EACV,KAAK,EACL,YAAY,EACZ,cAAc,EACd,aAAa,EACb,UAAU,EACV,cAAc,EACd,eAAe,EACf,eAAe,EACf,QAAQ,EACR,OAAO,EACP,SAAS,GAAG,IAAI,EAChB,SAAS,GAAG,EAAE,GACI;IAClB,MAAM,WAAW,GAAG,KAAK,IAAI,OAAO,CAAC;IAErC,OAAO,CACL,eAAK,SAAS,EAAE,GAAG,MAAM,CAAC,IAAI,IAAI,SAAS,EAAE,CAAC,IAAI,EAAE,aACjD,SAAS,CAAC,CAAC,CAAC,CACX,cAAK,SAAS,EAAE,MAAM,CAAC,MAAM,YAC3B,KAAC,UAAU,IACT,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,eAAe,EAAE,eAAe,EAChC,eAAe,EAAE,eAAe,GAChC,GACE,CACP,CAAC,CAAC,CAAC,IAAI,EAEP,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,CACjB,cAAK,SAAS,EAAE,MAAM,CAAC,OAAO,EAAE,IAAI,EAAC,SAAS,gBAAa,GAAG,KAAK,WAAW,YAC3E,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACpB,iBAEE,OAAO,EAAE,GAAG,EAAE,CAAC,cAAc,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EACvC,SAAS,EAAE,GAAG,MAAM,CAAC,YAAY,IAAI,YAAY,KAAK,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,EAAE,EACtG,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,KAAK,mBACK,YAAY,KAAK,GAAG,CAAC,EAAE,YAErC,GAAG,CAAC,KAAK,IAPL,GAAG,CAAC,EAAE,CAQJ,CACV,CAAC,GACE,CACP,CAAC,CAAC,CAAC,IAAI,EAER,cAAK,SAAS,EAAE,MAAM,CAAC,OAAO,YAC3B,OAAO,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,MAAM,CAAC,OAAO,2BAAkB,CAAC,CAAC,CAAC,QAAQ,IAAI,IAAI,GAC1E,IACF,CACP,CAAC;AACJ,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@steez-ui/ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.2",
|
|
4
|
+
"description": "React primitives authored with CSS modules for Steez UI.",
|
|
4
5
|
"license": "MIT",
|
|
5
6
|
"type": "module",
|
|
6
7
|
"files": [
|
|
@@ -11,8 +12,8 @@
|
|
|
11
12
|
"react-dom": ">=18"
|
|
12
13
|
},
|
|
13
14
|
"dependencies": {
|
|
14
|
-
"@steez-ui/icons": "^0.1.
|
|
15
|
-
"@steez-ui/theme": "^0.1.
|
|
15
|
+
"@steez-ui/icons": "^0.1.2",
|
|
16
|
+
"@steez-ui/theme": "^0.1.2"
|
|
16
17
|
},
|
|
17
18
|
"exports": {
|
|
18
19
|
".": {
|
|
@@ -28,7 +29,7 @@
|
|
|
28
29
|
"type": "git",
|
|
29
30
|
"url": "git+https://github.com/thomasjvu/steez-ui.git"
|
|
30
31
|
},
|
|
31
|
-
"homepage": "https://steez-ui.pages.dev",
|
|
32
|
+
"homepage": "https://steez-ui-6v5.pages.dev",
|
|
32
33
|
"bugs": {
|
|
33
34
|
"url": "https://github.com/thomasjvu/steez-ui/issues"
|
|
34
35
|
}
|