@stacksjs/components 0.2.92 → 0.2.93

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.
@@ -271,10 +271,28 @@ function toggleCollapse() {
271
271
  if (collapsibleProp) setCollapsed(!collapsed())
272
272
  }
273
273
 
274
+ // ---------------------------------------------------------------------------
275
+ // Appearance — native sidebars follow the OS light/dark appearance. Crosswind
276
+ // dark: utilities are class-based, so mirror prefers-color-scheme onto the
277
+ // root element unless the app manages its own theme (data-theme attribute).
278
+ // ---------------------------------------------------------------------------
279
+
280
+ function followSystemAppearance() {
281
+ const media = window.matchMedia('(prefers-color-scheme: dark)')
282
+ function sync() {
283
+ if (document.documentElement.dataset.theme) return
284
+ document.documentElement.classList.toggle('dark', media.matches)
285
+ }
286
+ sync()
287
+ media.addEventListener('change', sync)
288
+ }
289
+
274
290
  onMount(() => {
275
291
  pane = document.getElementById(sidebarUidProp)
276
292
  if (!pane) return
277
293
 
294
+ followSystemAppearance()
295
+
278
296
  if (persistKeyProp) {
279
297
  try {
280
298
  const saved = window.localStorage?.getItem(persistKeyProp)
package/dist/index.js CHANGED
@@ -1,11 +1,11 @@
1
1
  // @bun
2
- // ../../../../../../../tmp/stx-components-build-vsTGnE/stubs/stub-0.js
2
+ // ../../../../../../../tmp/stx-components-build-ptvQRK/stubs/stub-0.js
3
3
  var stub_0_default = { __stx: true, src: "./components/CodeBlock.stx" };
4
- // ../../../../../../../tmp/stx-components-build-vsTGnE/stubs/stub-1.js
4
+ // ../../../../../../../tmp/stx-components-build-ptvQRK/stubs/stub-1.js
5
5
  var stub_1_default = { __stx: true, src: "./components/Footer.stx" };
6
- // ../../../../../../../tmp/stx-components-build-vsTGnE/stubs/stub-2.js
6
+ // ../../../../../../../tmp/stx-components-build-ptvQRK/stubs/stub-2.js
7
7
  var stub_2_default = { __stx: true, src: "./components/Hero.stx" };
8
- // ../../../../../../../tmp/stx-components-build-vsTGnE/stubs/stub-3.js
8
+ // ../../../../../../../tmp/stx-components-build-ptvQRK/stubs/stub-3.js
9
9
  var stub_3_default = { __stx: true, src: "./components/Installation.stx" };
10
10
  // src/composables/useCopyCode.ts
11
11
  function useCopyCode(options) {
@@ -1132,7 +1132,7 @@ var RadioGroupOption_default = "./RadioGroupOption-s1d6r221.stx";
1132
1132
  // src/ui/select/Select.stx
1133
1133
  var Select_default = "./Select-1vnd0brz.stx";
1134
1134
  // src/ui/sidebar/Sidebar.stx
1135
- var Sidebar_default = "./Sidebar-yb115a2w.stx";
1135
+ var Sidebar_default = "./Sidebar-4hn7vw4n.stx";
1136
1136
  // src/ui/sidebar/SidebarFooter.stx
1137
1137
  var SidebarFooter_default = "./SidebarFooter-0aegr99p.stx";
1138
1138
  // src/ui/sidebar/SidebarHeader.stx
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@stacksjs/components",
3
3
  "type": "module",
4
- "version": "0.2.92",
4
+ "version": "0.2.93",
5
5
  "description": "A modern component library built with STX, featuring headwind utility classes and TypeScript syntax highlighting.",
6
6
  "author": "Chris Breuer <chris@stacksjs.org>",
7
7
  "license": "MIT",
@@ -28,13 +28,13 @@
28
28
  ],
29
29
  "exports": {
30
30
  ".": {
31
- "bun": "./src/index.ts",
32
31
  "types": "./dist/index.d.ts",
32
+ "bun": "./src/index.ts",
33
33
  "import": "./dist/index.js"
34
34
  },
35
35
  "./*": {
36
- "bun": "./src/*/index.ts",
37
36
  "types": "./dist/*/index.d.ts",
37
+ "bun": "./src/*/index.ts",
38
38
  "import": "./dist/*/index.js"
39
39
  },
40
40
  "./stx-plugin": {
@@ -63,8 +63,8 @@
63
63
  },
64
64
  "dependencies": {
65
65
  "@cwcss/crosswind": "^0.2.6",
66
- "@stacksjs/stx": "0.2.92",
67
- "bun-plugin-stx": "0.2.92",
66
+ "@stacksjs/stx": "0.2.93",
67
+ "bun-plugin-stx": "0.2.93",
68
68
  "ts-syntax-highlighter": "^0.2.1"
69
69
  },
70
70
  "devDependencies": {
@@ -271,10 +271,28 @@ function toggleCollapse() {
271
271
  if (collapsibleProp) setCollapsed(!collapsed())
272
272
  }
273
273
 
274
+ // ---------------------------------------------------------------------------
275
+ // Appearance — native sidebars follow the OS light/dark appearance. Crosswind
276
+ // dark: utilities are class-based, so mirror prefers-color-scheme onto the
277
+ // root element unless the app manages its own theme (data-theme attribute).
278
+ // ---------------------------------------------------------------------------
279
+
280
+ function followSystemAppearance() {
281
+ const media = window.matchMedia('(prefers-color-scheme: dark)')
282
+ function sync() {
283
+ if (document.documentElement.dataset.theme) return
284
+ document.documentElement.classList.toggle('dark', media.matches)
285
+ }
286
+ sync()
287
+ media.addEventListener('change', sync)
288
+ }
289
+
274
290
  onMount(() => {
275
291
  pane = document.getElementById(sidebarUidProp)
276
292
  if (!pane) return
277
293
 
294
+ followSystemAppearance()
295
+
278
296
  if (persistKeyProp) {
279
297
  try {
280
298
  const saved = window.localStorage?.getItem(persistKeyProp)