@hanzo/design 0.2.0 → 0.3.1

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.
Files changed (37) hide show
  1. package/LICENSE +23 -16
  2. package/README.md +54 -5
  3. package/assets/fonts/Geist-Variable.woff2 +0 -0
  4. package/assets/fonts/GeistMono-Variable.woff2 +0 -0
  5. package/assets/fonts/LICENSE-Geist.txt +92 -0
  6. package/components/core/HanzoLogo.jsx +1 -1
  7. package/components/overlays/Dialog.jsx +1 -1
  8. package/components/overlays/DropdownMenu.jsx +1 -1
  9. package/components/overlays/Sheet.jsx +1 -1
  10. package/components/overlays/Toaster.jsx +1 -1
  11. package/dist/index.d.ts +22 -7
  12. package/dist/index.d.ts.map +1 -1
  13. package/dist/index.js +22 -8
  14. package/dist/tokens.gen.d.ts +64 -4
  15. package/dist/tokens.gen.d.ts.map +1 -1
  16. package/dist/tokens.gen.js +64 -4
  17. package/docs/README.md +1 -1
  18. package/docs/integrate.md +4 -4
  19. package/guidelines/DESIGN.md +106 -0
  20. package/package.json +15 -7
  21. package/prompts/README.md +13 -1
  22. package/prompts/studio-designer.md +41 -0
  23. package/prompts/system.md +1 -1
  24. package/scripts/check-tokens.mjs +93 -0
  25. package/scripts/gen-tokens.mjs +78 -0
  26. package/scripts/lint.mjs +179 -0
  27. package/skills/design-system/SKILL.md +103 -0
  28. package/src/index.ts +26 -9
  29. package/src/tokens.gen.ts +64 -4
  30. package/styles.css +4 -1
  31. package/tokens/base.css +7 -3
  32. package/tokens/colors.css +32 -4
  33. package/tokens/elevation.css +12 -0
  34. package/tokens/fonts.css +30 -3
  35. package/tokens/typography.css +19 -0
  36. package/tokens/z.css +18 -9
  37. package/ui_kits/.gitkeep +0 -0
package/tokens/typography.css CHANGED
@@ -16,6 +16,25 @@
16
16
  --text-5xl:2.5rem; --leading-5xl:1.05; /* 40px */
17
17
  --text-6xl:3.25rem; --leading-6xl:1; /* 52px */
18
18
  --text-7xl:4rem; --leading-7xl:1; /* 64px */
19
+ --text-8xl:5.25rem; --leading-8xl:1; /* 84px */
20
+ --text-9xl:7rem; --leading-9xl:1; /* 112px */
21
+
22
+ /* The SAME scale under @hanzo/brand's spelling. @hanzo/gui's shell theme and
23
+ Hanzo Studio address the ramp as --font-size-*; both names are one value, so
24
+ a component written against either resolves here. --text-* is canonical. */
25
+ --font-size-xs:var(--text-xs);
26
+ --font-size-sm:var(--text-sm);
27
+ --font-size-base:var(--text-base);
28
+ --font-size-lg:var(--text-lg);
29
+ --font-size-xl:var(--text-xl);
30
+ --font-size-2xl:var(--text-2xl);
31
+ --font-size-3xl:var(--text-3xl);
32
+ --font-size-4xl:var(--text-4xl);
33
+ --font-size-5xl:var(--text-5xl);
34
+ --font-size-6xl:var(--text-6xl);
35
+ --font-size-7xl:var(--text-7xl);
36
+ --font-size-8xl:var(--text-8xl);
37
+ --font-size-9xl:var(--text-9xl);
19
38
 
20
39
  --weight-normal:400;
21
40
  --weight-medium:500;
package/tokens/z.css CHANGED
@@ -1,14 +1,23 @@
1
1
  /* Stacking order — the one z-index ladder. Layers are named by role, never by a
2
2
  magic number, so a dropdown opened from the fixed header always sits above it
3
- and nothing ever reaches for 9999. Below --z-raised is ordinary document flow. */
3
+ and nothing ever reaches for 9999. Below --z-raised is ordinary document flow.
4
+
5
+ Rungs are 100 apart so a surface can slot a one-off BETWEEN two roles
6
+ (calc(var(--z-modal) + 1)) without inventing a new decade. */
4
7
  :root{
5
8
  --z-base:0;
6
- --z-raised:10; /* hover-lifted cards, sticky table headers */
7
- --z-sticky:200; /* pinned section rails */
8
- --z-header:300; /* the fixed site header */
9
- --z-dropdown:400; /* menus, selects, comboboxes */
10
- --z-overlay:500; /* dialog / sheet scrim */
11
- --z-modal:600; /* dialogs, sheets, command palette */
12
- --z-popover:700; /* popovers, tooltips (also when anchored in modals)*/
13
- --z-toast:800; /* toasts / notifications — always on top */
9
+ --z-raised:10; /* hover-lifted cards, sticky table headers */
10
+ --z-sticky:200; /* pinned section rails */
11
+ --z-header:300; /* the fixed site header */
12
+ --z-dropdown:400; /* menus, selects, comboboxes */
13
+ --z-overlay:500; /* dialog / sheet scrim */
14
+ --z-modal:600; /* dialogs, sheets, command palette */
15
+ --z-popover:700; /* popovers, tooltips (also when anchored in modals) */
16
+ --z-toast:800; /* toasts / notifications — always on top */
17
+
18
+ /* @hanzo/brand spells the top two rungs --z-tooltip and --z-notification.
19
+ Same rungs, so a component written against either vocabulary stacks
20
+ identically. --z-popover / --z-toast are canonical. */
21
+ --z-tooltip:var(--z-popover);
22
+ --z-notification:var(--z-toast);
14
23
  }
package/ui_kits/.gitkeep ADDED
File without changes