@lessly/ui 0.12.0 → 0.14.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 (5) hide show
  1. package/README.md +11 -6
  2. package/dist/index.d.ts +270 -1
  3. package/dist/index.js +1316 -275
  4. package/dist/styles.css +25 -6
  5. package/package.json +11 -4
package/dist/styles.css CHANGED
@@ -82,6 +82,7 @@
82
82
  --shadow-md: 0 2px 8px rgba(0,0,0,0.5), 0 1px 2px rgba(0,0,0,0.4);
83
83
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.6), 0 2px 8px rgba(0,0,0,0.4);
84
84
  --shadow-xl: 0 16px 48px rgba(0,0,0,0.7), 0 4px 12px rgba(0,0,0,0.5);
85
+ --shadow-overlay: 0 8px 24px rgba(0,0,0,0.5);
85
86
  --shadow-inner: inset 0 1px 3px rgba(0,0,0,0.4);
86
87
  --shadow-glow-brand: 0 0 12px rgba(6,41,125,0.5);
87
88
  --overlay-backdrop: rgba(8,9,12,0.80);
@@ -325,6 +326,7 @@
325
326
  --shadow-md: 0 2px 8px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
326
327
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.06);
327
328
  --shadow-xl: 0 16px 48px rgba(0,0,0,0.16), 0 4px 12px rgba(0,0,0,0.08);
329
+ --shadow-overlay: 0 12px 32px rgba(16,24,40,0.1), 0 2px 8px rgba(16,24,40,0.06);
328
330
  --shadow-inner: inset 0 1px 3px rgba(0,0,0,0.08);
329
331
  --shadow-glow-brand: 0 0 12px rgba(6,41,125,0.2);
330
332
  --overlay-backdrop: rgba(14,16,21,0.50);
@@ -740,23 +742,40 @@
740
742
  }
741
743
  :root {
742
744
  /* === Nav / menu surfaces (0.3.0 sidebar) === */
743
- /* --menu-shadow stays a literal mirroring the 0.3.0 prototype's --shadow-md:
744
- @lessly/tokens ships its own --shadow-* scale, but with different values —
745
- switching to var(--shadow-md) would visibly change the menus. */
745
+ /* --menu-shadow sits on the package's --shadow-overlay role; theme.css re-resolves
746
+ it per theme, so `.light` needs no override. */
746
747
  --hov-bg: color-mix(in srgb, var(--text-primary) 7%, transparent);
747
748
  --menu-bg: var(--bg-elevated);
748
- --menu-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
749
+ --menu-shadow: var(--shadow-overlay);
749
750
  --menu-hov: var(--hov-bg);
751
+
752
+ /* === Sign-in / auth screen (<SignInScreen/>) ===
753
+ Dark and light are deliberately DIFFERENT treatments, not inverts: dark leans on
754
+ a border hairline + deep glow ground (no shadow), light drops the border and floats
755
+ the card on an elevation shadow. The glow layers can't be one token pair either —
756
+ dark pools --bg-brand, light washes --bg-brand-subtle — so both live per theme
757
+ rather than as a color-mix over a single token. */
758
+ --auth-glow-a: rgba(99, 148, 246, 0.1);
759
+ --auth-glow-b: rgba(6, 41, 125, 0.42);
760
+ --auth-card-border: var(--border-subtle);
761
+ --auth-card-shadow: none;
762
+ --auth-btn-shadow: none;
750
763
  }
751
764
 
752
765
  .light {
753
766
  /* Light keeps opaque plates: a translucent text-mix would vanish on a white menu.
754
767
  Pinned 0.3.0-prototype literals — deliberately NOT var(--bg-elevated), which
755
- only coincidentally resolves to the same white in the current package. */
768
+ resolves to #edeef0 in the package, not this white. */
756
769
  --hov-bg: #ffffff;
757
770
  --menu-bg: #ffffff;
758
- --menu-shadow: 0 12px 32px rgba(16, 24, 40, 0.1), 0 2px 8px rgba(16, 24, 40, 0.06);
759
771
  --menu-hov: #f2f4f7;
772
+
773
+ /* Auth screen — see :root above. */
774
+ --auth-glow-a: rgba(11, 76, 213, 0.09);
775
+ --auth-glow-b: rgba(228, 236, 254, 0.85);
776
+ --auth-card-border: transparent;
777
+ --auth-card-shadow: var(--shadow-lg);
778
+ --auth-btn-shadow: var(--shadow-md);
760
779
  }
761
780
 
762
781
  /* === Base === */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lessly/ui",
3
- "version": "0.12.0",
3
+ "version": "0.14.1",
4
4
  "description": "Lessly design system — shared UI primitives, tokens, and theme",
5
5
  "type": "module",
6
6
  "packageManager": "pnpm@10.30.3",
@@ -39,7 +39,12 @@
39
39
  "changeset": "changeset",
40
40
  "release:version": "changeset version && node scripts/stamp-changelog-date.mjs",
41
41
  "release:publish": "node scripts/release-publish.mjs",
42
- "release:tag": "changeset tag"
42
+ "release:tag": "changeset tag",
43
+ "dev-site": "vite --config site/vite.config.ts",
44
+ "build-site": "pnpm build && vite build --config site/vite.config.ts",
45
+ "test-site": "node --test site/*.test.mjs",
46
+ "test-site-app": "vitest run --config site/vitest.config.ts",
47
+ "gen-changelog": "node site/scripts/gen-changelog.mjs"
43
48
  },
44
49
  "publishConfig": {
45
50
  "registry": "https://registry.npmjs.org/",
@@ -57,7 +62,7 @@
57
62
  }
58
63
  },
59
64
  "dependencies": {
60
- "@lessly/tokens": "^0.3.1",
65
+ "@lessly/tokens": "^0.4.0",
61
66
  "@radix-ui/react-accordion": "^1.2.16",
62
67
  "@radix-ui/react-alert-dialog": "^1.1.19",
63
68
  "@radix-ui/react-aspect-ratio": "^1.1.11",
@@ -98,6 +103,7 @@
98
103
  "@changesets/cli": "^2.31.0",
99
104
  "@eslint/js": "^9.39.5",
100
105
  "@storybook/addon-essentials": "^8.6.14",
106
+ "@storybook/blocks": "8.6.18",
101
107
  "@storybook/react": "^8.6.18",
102
108
  "@storybook/react-vite": "^8.6.18",
103
109
  "@tailwindcss/cli": "^4",
@@ -114,8 +120,9 @@
114
120
  "jsdom": "^26.0.0",
115
121
  "react": "^19.0.0",
116
122
  "react-dom": "^19.0.0",
117
- "react-router": "^7.18.1",
123
+ "react-router": "^8.3.0",
118
124
  "storybook": "^8.6.18",
125
+ "storybook-dark-mode": "^4.0.2",
119
126
  "tailwindcss": "^4",
120
127
  "tsup": "^8.0.0",
121
128
  "tw-animate-css": "^1.4.0",