@mekari/pixel3-utils 0.0.7-dev.1 → 0.0.7-dev.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.
Files changed (17) hide show
  1. package/dist/chunk-CO6CIIBD.mjs +110 -0
  2. package/dist/composables/index.d.mts +1 -0
  3. package/dist/composables/index.d.ts +1 -0
  4. package/dist/composables/index.js +69 -45
  5. package/dist/composables/index.mjs +1 -1
  6. package/dist/composables/usePixelTheme.d.mts +9 -0
  7. package/dist/composables/usePixelTheme.d.ts +9 -0
  8. package/dist/composables/usePixelTheme.js +69 -45
  9. package/dist/composables/usePixelTheme.mjs +1 -1
  10. package/dist/index.js +69 -45
  11. package/dist/index.mjs +1 -1
  12. package/dist/metafile-cjs.json +1 -1
  13. package/dist/metafile-esm.json +1 -1
  14. package/dist/types.d.mts +1 -1
  15. package/dist/types.d.ts +1 -1
  16. package/package.json +1 -1
  17. package/dist/chunk-BAQYFJRO.mjs +0 -86
package/dist/chunk-CO6CIIBD.mjs ADDED
@@ -0,0 +1,110 @@
1
+ import {
2
+ canUseDOM
3
+ } from "./chunk-OVY52ELY.mjs";
4
+ import {
5
+ __name
6
+ } from "./chunk-QZ7VFGWC.mjs";
7
+
8
+ // src/composables/usePixelTheme.ts
9
+ import { watch, ref, readonly } from "vue";
10
+ import { useStorage } from "@vueuse/core";
11
+ var isDark = useStorage("pixel-dark-mode", false);
12
+ var isNextTheme = useStorage("pixel-next-theme", false);
13
+ var watchersInstance = ref([]);
14
+ function usePixelTheme() {
15
+ function setDarkMode(value) {
16
+ isDark.value = value;
17
+ }
18
+ __name(setDarkMode, "setDarkMode");
19
+ function setNextTheme(value) {
20
+ isNextTheme.value = value;
21
+ }
22
+ __name(setNextTheme, "setNextTheme");
23
+ function getComputedCSSVariableValue(variable) {
24
+ if (!canUseDOM)
25
+ return;
26
+ return getComputedStyle(document.documentElement).getPropertyValue(variable.slice(4, variable.length - 1)).trim();
27
+ }
28
+ __name(getComputedCSSVariableValue, "getComputedCSSVariableValue");
29
+ function activePixelThemeWatcher() {
30
+ if (!canUseDOM) {
31
+ console.warn("usePixelTheme: Cannot activate theme watcher - DOM is not available");
32
+ return false;
33
+ }
34
+ if (watchersInstance.value.length > 0) {
35
+ return false;
36
+ }
37
+ function showLightMode() {
38
+ if (!canUseDOM)
39
+ return;
40
+ document.documentElement.classList.add("light");
41
+ document.documentElement.classList.remove("dark");
42
+ }
43
+ __name(showLightMode, "showLightMode");
44
+ function showDarkMode() {
45
+ if (!canUseDOM)
46
+ return;
47
+ document.documentElement.classList.add("dark");
48
+ document.documentElement.classList.remove("light");
49
+ }
50
+ __name(showDarkMode, "showDarkMode");
51
+ function applyNextTheme() {
52
+ if (!canUseDOM)
53
+ return;
54
+ document.documentElement.setAttribute("data-panda-theme", "next");
55
+ }
56
+ __name(applyNextTheme, "applyNextTheme");
57
+ function removeNextTheme() {
58
+ if (!canUseDOM)
59
+ return;
60
+ document.documentElement.removeAttribute("data-panda-theme");
61
+ }
62
+ __name(removeNextTheme, "removeNextTheme");
63
+ watchersInstance.value = [
64
+ // Watch for theme changes
65
+ watch(() => isDark.value, (value) => {
66
+ if (value)
67
+ showDarkMode();
68
+ else
69
+ showLightMode();
70
+ }, {
71
+ immediate: true
72
+ }),
73
+ watch(() => isNextTheme.value, (value) => {
74
+ if (!canUseDOM)
75
+ return;
76
+ if (value)
77
+ applyNextTheme();
78
+ else
79
+ removeNextTheme();
80
+ }, {
81
+ immediate: true
82
+ })
83
+ ];
84
+ return true;
85
+ }
86
+ __name(activePixelThemeWatcher, "activePixelThemeWatcher");
87
+ function stopPixelThemeWatcher() {
88
+ if (watchersInstance.value.length === 0)
89
+ return false;
90
+ watchersInstance.value.forEach((stop) => stop());
91
+ watchersInstance.value = [];
92
+ return true;
93
+ }
94
+ __name(stopPixelThemeWatcher, "stopPixelThemeWatcher");
95
+ return {
96
+ isDark,
97
+ isNextTheme,
98
+ watchersInstance: readonly(watchersInstance),
99
+ setDarkMode,
100
+ setNextTheme,
101
+ getComputedCSSVariableValue,
102
+ activePixelThemeWatcher,
103
+ stopPixelThemeWatcher
104
+ };
105
+ }
106
+ __name(usePixelTheme, "usePixelTheme");
107
+
108
+ export {
109
+ usePixelTheme
110
+ };
package/dist/composables/index.d.mts CHANGED
@@ -1,2 +1,3 @@
1
1
  export { usePixelTheme } from './usePixelTheme.mjs';
2
+ import 'vue';
2
3
  import '@vueuse/core';
package/dist/composables/index.d.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export { usePixelTheme } from './usePixelTheme.js';
2
+ import 'vue';
2
3
  import '@vueuse/core';
package/dist/composables/index.js CHANGED
@@ -35,6 +35,7 @@ var canUseDOM = !!(typeof window !== "undefined" && window.document && window.do
35
35
  // src/composables/usePixelTheme.ts
36
36
  var isDark = (0, import_core.useStorage)("pixel-dark-mode", false);
37
37
  var isNextTheme = (0, import_core.useStorage)("pixel-next-theme", false);
38
+ var watchersInstance = (0, import_vue.ref)([]);
38
39
  function usePixelTheme() {
39
40
  function setDarkMode(value) {
40
41
  isDark.value = value;
@@ -44,64 +45,87 @@ function usePixelTheme() {
44
45
  isNextTheme.value = value;
45
46
  }
46
47
  __name(setNextTheme, "setNextTheme");
47
- function showLightMode() {
48
- if (!canUseDOM)
49
- return;
50
- document.documentElement.classList.add("light");
51
- document.documentElement.classList.remove("dark");
52
- }
53
- __name(showLightMode, "showLightMode");
54
- function showDarkMode() {
55
- if (!canUseDOM)
56
- return;
57
- document.documentElement.classList.add("dark");
58
- document.documentElement.classList.remove("light");
59
- }
60
- __name(showDarkMode, "showDarkMode");
61
- function applyNextTheme() {
62
- if (!canUseDOM)
63
- return;
64
- document.documentElement.setAttribute("data-panda-theme", "next");
65
- }
66
- __name(applyNextTheme, "applyNextTheme");
67
- function removeNextTheme() {
68
- if (!canUseDOM)
69
- return;
70
- document.documentElement.removeAttribute("data-panda-theme");
71
- }
72
- __name(removeNextTheme, "removeNextTheme");
73
48
  function getComputedCSSVariableValue(variable) {
74
49
  if (!canUseDOM)
75
50
  return;
76
51
  return getComputedStyle(document.documentElement).getPropertyValue(variable.slice(4, variable.length - 1)).trim();
77
52
  }
78
53
  __name(getComputedCSSVariableValue, "getComputedCSSVariableValue");
79
- (0, import_vue.watch)(() => isDark.value, (value) => {
80
- if (value) {
81
- showDarkMode();
82
- } else {
83
- showLightMode();
54
+ function activePixelThemeWatcher() {
55
+ if (!canUseDOM) {
56
+ console.warn("usePixelTheme: Cannot activate theme watcher - DOM is not available");
57
+ return false;
84
58
  }
85
- }, {
86
- immediate: true
87
- });
88
- (0, import_vue.watch)(() => isNextTheme.value, (value) => {
89
- if (!canUseDOM)
90
- return;
91
- if (value) {
92
- applyNextTheme();
93
- } else {
94
- removeNextTheme();
59
+ if (watchersInstance.value.length > 0) {
60
+ return false;
61
+ }
62
+ function showLightMode() {
63
+ if (!canUseDOM)
64
+ return;
65
+ document.documentElement.classList.add("light");
66
+ document.documentElement.classList.remove("dark");
95
67
  }
96
- }, {
97
- immediate: true
98
- });
68
+ __name(showLightMode, "showLightMode");
69
+ function showDarkMode() {
70
+ if (!canUseDOM)
71
+ return;
72
+ document.documentElement.classList.add("dark");
73
+ document.documentElement.classList.remove("light");
74
+ }
75
+ __name(showDarkMode, "showDarkMode");
76
+ function applyNextTheme() {
77
+ if (!canUseDOM)
78
+ return;
79
+ document.documentElement.setAttribute("data-panda-theme", "next");
80
+ }
81
+ __name(applyNextTheme, "applyNextTheme");
82
+ function removeNextTheme() {
83
+ if (!canUseDOM)
84
+ return;
85
+ document.documentElement.removeAttribute("data-panda-theme");
86
+ }
87
+ __name(removeNextTheme, "removeNextTheme");
88
+ watchersInstance.value = [
89
+ // Watch for theme changes
90
+ (0, import_vue.watch)(() => isDark.value, (value) => {
91
+ if (value)
92
+ showDarkMode();
93
+ else
94
+ showLightMode();
95
+ }, {
96
+ immediate: true
97
+ }),
98
+ (0, import_vue.watch)(() => isNextTheme.value, (value) => {
99
+ if (!canUseDOM)
100
+ return;
101
+ if (value)
102
+ applyNextTheme();
103
+ else
104
+ removeNextTheme();
105
+ }, {
106
+ immediate: true
107
+ })
108
+ ];
109
+ return true;
110
+ }
111
+ __name(activePixelThemeWatcher, "activePixelThemeWatcher");
112
+ function stopPixelThemeWatcher() {
113
+ if (watchersInstance.value.length === 0)
114
+ return false;
115
+ watchersInstance.value.forEach((stop) => stop());
116
+ watchersInstance.value = [];
117
+ return true;
118
+ }
119
+ __name(stopPixelThemeWatcher, "stopPixelThemeWatcher");
99
120
  return {
100
121
  isDark,
101
122
  isNextTheme,
123
+ watchersInstance: (0, import_vue.readonly)(watchersInstance),
102
124
  setDarkMode,
103
125
  setNextTheme,
104
- getComputedCSSVariableValue
126
+ getComputedCSSVariableValue,
127
+ activePixelThemeWatcher,
128
+ stopPixelThemeWatcher
105
129
  };
106
130
  }
107
131
  __name(usePixelTheme, "usePixelTheme");
package/dist/composables/index.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import "../chunk-34MJNZK5.mjs";
2
2
  import {
3
3
  usePixelTheme
4
- } from "../chunk-BAQYFJRO.mjs";
4
+ } from "../chunk-CO6CIIBD.mjs";
5
5
  import "../chunk-OVY52ELY.mjs";
6
6
  import "../chunk-XE4ZKGPH.mjs";
7
7
  import "../chunk-QZ7VFGWC.mjs";
package/dist/composables/usePixelTheme.d.mts CHANGED
@@ -1,3 +1,5 @@
1
+ import * as vue from 'vue';
2
+ import { WatchStopHandle } from 'vue';
1
3
  import * as _vueuse_core from '@vueuse/core';
2
4
 
3
5
  /**
@@ -7,15 +9,22 @@ import * as _vueuse_core from '@vueuse/core';
7
9
  * @returns {Object} Theme control functions and state
8
10
  * @property {ComputedRef<boolean>} isDark - Computed value indicating if dark mode is active
9
11
  * @property {ComputedRef<boolean>} isNextTheme - Computed value indicating if next theme is active
12
+ * @property {Ref<WatchStopHandle[]>} watchersInstance - Ref to store watchers instance
10
13
  * @property {(value: boolean) => void} setDarkMode - Function to toggle dark mode
11
14
  * @property {(value: boolean) => void} setNextTheme - Function to toggle next theme.
15
+ * @property {(variable: string) => string} getComputedCSSVariableValue - Function to get hex value when use semantic token
16
+ * @property {() => boolean} activePixelThemeWatcher - Function to activate theme watcher
17
+ * @property {() => boolean} stopPixelThemeWatcher - Function to stop theme watcher
12
18
  */
13
19
  declare function usePixelTheme(): {
14
20
  isDark: _vueuse_core.RemovableRef<boolean>;
15
21
  isNextTheme: _vueuse_core.RemovableRef<boolean>;
22
+ watchersInstance: Readonly<vue.Ref<readonly WatchStopHandle[]>>;
16
23
  setDarkMode: (value: boolean) => void;
17
24
  setNextTheme: (value: boolean) => void;
18
25
  getComputedCSSVariableValue: (variable: string) => string | undefined;
26
+ activePixelThemeWatcher: () => boolean;
27
+ stopPixelThemeWatcher: () => boolean;
19
28
  };
20
29
 
21
30
  export { usePixelTheme };
package/dist/composables/usePixelTheme.d.ts CHANGED
@@ -1,3 +1,5 @@
1
+ import * as vue from 'vue';
2
+ import { WatchStopHandle } from 'vue';
1
3
  import * as _vueuse_core from '@vueuse/core';
2
4
 
3
5
  /**
@@ -7,15 +9,22 @@ import * as _vueuse_core from '@vueuse/core';
7
9
  * @returns {Object} Theme control functions and state
8
10
  * @property {ComputedRef<boolean>} isDark - Computed value indicating if dark mode is active
9
11
  * @property {ComputedRef<boolean>} isNextTheme - Computed value indicating if next theme is active
12
+ * @property {Ref<WatchStopHandle[]>} watchersInstance - Ref to store watchers instance
10
13
  * @property {(value: boolean) => void} setDarkMode - Function to toggle dark mode
11
14
  * @property {(value: boolean) => void} setNextTheme - Function to toggle next theme.
15
+ * @property {(variable: string) => string} getComputedCSSVariableValue - Function to get hex value when use semantic token
16
+ * @property {() => boolean} activePixelThemeWatcher - Function to activate theme watcher
17
+ * @property {() => boolean} stopPixelThemeWatcher - Function to stop theme watcher
12
18
  */
13
19
  declare function usePixelTheme(): {
14
20
  isDark: _vueuse_core.RemovableRef<boolean>;
15
21
  isNextTheme: _vueuse_core.RemovableRef<boolean>;
22
+ watchersInstance: Readonly<vue.Ref<readonly WatchStopHandle[]>>;
16
23
  setDarkMode: (value: boolean) => void;
17
24
  setNextTheme: (value: boolean) => void;
18
25
  getComputedCSSVariableValue: (variable: string) => string | undefined;
26
+ activePixelThemeWatcher: () => boolean;
27
+ stopPixelThemeWatcher: () => boolean;
19
28
  };
20
29
 
21
30
  export { usePixelTheme };
package/dist/composables/usePixelTheme.js CHANGED
@@ -33,6 +33,7 @@ var canUseDOM = !!(typeof window !== "undefined" && window.document && window.do
33
33
  // src/composables/usePixelTheme.ts
34
34
  var isDark = (0, import_core.useStorage)("pixel-dark-mode", false);
35
35
  var isNextTheme = (0, import_core.useStorage)("pixel-next-theme", false);
36
+ var watchersInstance = (0, import_vue.ref)([]);
36
37
  function usePixelTheme() {
37
38
  function setDarkMode(value) {
38
39
  isDark.value = value;
@@ -42,64 +43,87 @@ function usePixelTheme() {
42
43
  isNextTheme.value = value;
43
44
  }
44
45
  __name(setNextTheme, "setNextTheme");
45
- function showLightMode() {
46
- if (!canUseDOM)
47
- return;
48
- document.documentElement.classList.add("light");
49
- document.documentElement.classList.remove("dark");
50
- }
51
- __name(showLightMode, "showLightMode");
52
- function showDarkMode() {
53
- if (!canUseDOM)
54
- return;
55
- document.documentElement.classList.add("dark");
56
- document.documentElement.classList.remove("light");
57
- }
58
- __name(showDarkMode, "showDarkMode");
59
- function applyNextTheme() {
60
- if (!canUseDOM)
61
- return;
62
- document.documentElement.setAttribute("data-panda-theme", "next");
63
- }
64
- __name(applyNextTheme, "applyNextTheme");
65
- function removeNextTheme() {
66
- if (!canUseDOM)
67
- return;
68
- document.documentElement.removeAttribute("data-panda-theme");
69
- }
70
- __name(removeNextTheme, "removeNextTheme");
71
46
  function getComputedCSSVariableValue(variable) {
72
47
  if (!canUseDOM)
73
48
  return;
74
49
  return getComputedStyle(document.documentElement).getPropertyValue(variable.slice(4, variable.length - 1)).trim();
75
50
  }
76
51
  __name(getComputedCSSVariableValue, "getComputedCSSVariableValue");
77
- (0, import_vue.watch)(() => isDark.value, (value) => {
78
- if (value) {
79
- showDarkMode();
80
- } else {
81
- showLightMode();
52
+ function activePixelThemeWatcher() {
53
+ if (!canUseDOM) {
54
+ console.warn("usePixelTheme: Cannot activate theme watcher - DOM is not available");
55
+ return false;
82
56
  }
83
- }, {
84
- immediate: true
85
- });
86
- (0, import_vue.watch)(() => isNextTheme.value, (value) => {
87
- if (!canUseDOM)
88
- return;
89
- if (value) {
90
- applyNextTheme();
91
- } else {
92
- removeNextTheme();
57
+ if (watchersInstance.value.length > 0) {
58
+ return false;
59
+ }
60
+ function showLightMode() {
61
+ if (!canUseDOM)
62
+ return;
63
+ document.documentElement.classList.add("light");
64
+ document.documentElement.classList.remove("dark");
93
65
  }
94
- }, {
95
- immediate: true
96
- });
66
+ __name(showLightMode, "showLightMode");
67
+ function showDarkMode() {
68
+ if (!canUseDOM)
69
+ return;
70
+ document.documentElement.classList.add("dark");
71
+ document.documentElement.classList.remove("light");
72
+ }
73
+ __name(showDarkMode, "showDarkMode");
74
+ function applyNextTheme() {
75
+ if (!canUseDOM)
76
+ return;
77
+ document.documentElement.setAttribute("data-panda-theme", "next");
78
+ }
79
+ __name(applyNextTheme, "applyNextTheme");
80
+ function removeNextTheme() {
81
+ if (!canUseDOM)
82
+ return;
83
+ document.documentElement.removeAttribute("data-panda-theme");
84
+ }
85
+ __name(removeNextTheme, "removeNextTheme");
86
+ watchersInstance.value = [
87
+ // Watch for theme changes
88
+ (0, import_vue.watch)(() => isDark.value, (value) => {
89
+ if (value)
90
+ showDarkMode();
91
+ else
92
+ showLightMode();
93
+ }, {
94
+ immediate: true
95
+ }),
96
+ (0, import_vue.watch)(() => isNextTheme.value, (value) => {
97
+ if (!canUseDOM)
98
+ return;
99
+ if (value)
100
+ applyNextTheme();
101
+ else
102
+ removeNextTheme();
103
+ }, {
104
+ immediate: true
105
+ })
106
+ ];
107
+ return true;
108
+ }
109
+ __name(activePixelThemeWatcher, "activePixelThemeWatcher");
110
+ function stopPixelThemeWatcher() {
111
+ if (watchersInstance.value.length === 0)
112
+ return false;
113
+ watchersInstance.value.forEach((stop) => stop());
114
+ watchersInstance.value = [];
115
+ return true;
116
+ }
117
+ __name(stopPixelThemeWatcher, "stopPixelThemeWatcher");
97
118
  return {
98
119
  isDark,
99
120
  isNextTheme,
121
+ watchersInstance: (0, import_vue.readonly)(watchersInstance),
100
122
  setDarkMode,
101
123
  setNextTheme,
102
- getComputedCSSVariableValue
124
+ getComputedCSSVariableValue,
125
+ activePixelThemeWatcher,
126
+ stopPixelThemeWatcher
103
127
  };
104
128
  }
105
129
  __name(usePixelTheme, "usePixelTheme");
package/dist/composables/usePixelTheme.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  usePixelTheme
3
- } from "../chunk-BAQYFJRO.mjs";
3
+ } from "../chunk-CO6CIIBD.mjs";
4
4
  import "../chunk-OVY52ELY.mjs";
5
5
  import "../chunk-XE4ZKGPH.mjs";
6
6
  import "../chunk-QZ7VFGWC.mjs";
package/dist/index.js CHANGED
@@ -295,6 +295,7 @@ var import_vue5 = require("vue");
295
295
  var import_core = require("@vueuse/core");
296
296
  var isDark = (0, import_core.useStorage)("pixel-dark-mode", false);
297
297
  var isNextTheme2 = (0, import_core.useStorage)("pixel-next-theme", false);
298
+ var watchersInstance = (0, import_vue5.ref)([]);
298
299
  function usePixelTheme() {
299
300
  function setDarkMode(value) {
300
301
  isDark.value = value;
@@ -304,64 +305,87 @@ function usePixelTheme() {
304
305
  isNextTheme2.value = value;
305
306
  }
306
307
  __name(setNextTheme, "setNextTheme");
307
- function showLightMode() {
308
- if (!canUseDOM)
309
- return;
310
- document.documentElement.classList.add("light");
311
- document.documentElement.classList.remove("dark");
312
- }
313
- __name(showLightMode, "showLightMode");
314
- function showDarkMode() {
315
- if (!canUseDOM)
316
- return;
317
- document.documentElement.classList.add("dark");
318
- document.documentElement.classList.remove("light");
319
- }
320
- __name(showDarkMode, "showDarkMode");
321
- function applyNextTheme() {
322
- if (!canUseDOM)
323
- return;
324
- document.documentElement.setAttribute("data-panda-theme", "next");
325
- }
326
- __name(applyNextTheme, "applyNextTheme");
327
- function removeNextTheme() {
328
- if (!canUseDOM)
329
- return;
330
- document.documentElement.removeAttribute("data-panda-theme");
331
- }
332
- __name(removeNextTheme, "removeNextTheme");
333
308
  function getComputedCSSVariableValue(variable) {
334
309
  if (!canUseDOM)
335
310
  return;
336
311
  return getComputedStyle(document.documentElement).getPropertyValue(variable.slice(4, variable.length - 1)).trim();
337
312
  }
338
313
  __name(getComputedCSSVariableValue, "getComputedCSSVariableValue");
339
- (0, import_vue5.watch)(() => isDark.value, (value) => {
340
- if (value) {
341
- showDarkMode();
342
- } else {
343
- showLightMode();
314
+ function activePixelThemeWatcher() {
315
+ if (!canUseDOM) {
316
+ console.warn("usePixelTheme: Cannot activate theme watcher - DOM is not available");
317
+ return false;
344
318
  }
345
- }, {
346
- immediate: true
347
- });
348
- (0, import_vue5.watch)(() => isNextTheme2.value, (value) => {
349
- if (!canUseDOM)
350
- return;
351
- if (value) {
352
- applyNextTheme();
353
- } else {
354
- removeNextTheme();
319
+ if (watchersInstance.value.length > 0) {
320
+ return false;
355
321
  }
356
- }, {
357
- immediate: true
358
- });
322
+ function showLightMode() {
323
+ if (!canUseDOM)
324
+ return;
325
+ document.documentElement.classList.add("light");
326
+ document.documentElement.classList.remove("dark");
327
+ }
328
+ __name(showLightMode, "showLightMode");
329
+ function showDarkMode() {
330
+ if (!canUseDOM)
331
+ return;
332
+ document.documentElement.classList.add("dark");
333
+ document.documentElement.classList.remove("light");
334
+ }
335
+ __name(showDarkMode, "showDarkMode");
336
+ function applyNextTheme() {
337
+ if (!canUseDOM)
338
+ return;
339
+ document.documentElement.setAttribute("data-panda-theme", "next");
340
+ }
341
+ __name(applyNextTheme, "applyNextTheme");
342
+ function removeNextTheme() {
343
+ if (!canUseDOM)
344
+ return;
345
+ document.documentElement.removeAttribute("data-panda-theme");
346
+ }
347
+ __name(removeNextTheme, "removeNextTheme");
348
+ watchersInstance.value = [
349
+ // Watch for theme changes
350
+ (0, import_vue5.watch)(() => isDark.value, (value) => {
351
+ if (value)
352
+ showDarkMode();
353
+ else
354
+ showLightMode();
355
+ }, {
356
+ immediate: true
357
+ }),
358
+ (0, import_vue5.watch)(() => isNextTheme2.value, (value) => {
359
+ if (!canUseDOM)
360
+ return;
361
+ if (value)
362
+ applyNextTheme();
363
+ else
364
+ removeNextTheme();
365
+ }, {
366
+ immediate: true
367
+ })
368
+ ];
369
+ return true;
370
+ }
371
+ __name(activePixelThemeWatcher, "activePixelThemeWatcher");
372
+ function stopPixelThemeWatcher() {
373
+ if (watchersInstance.value.length === 0)
374
+ return false;
375
+ watchersInstance.value.forEach((stop) => stop());
376
+ watchersInstance.value = [];
377
+ return true;
378
+ }
379
+ __name(stopPixelThemeWatcher, "stopPixelThemeWatcher");
359
380
  return {
360
381
  isDark,
361
382
  isNextTheme: isNextTheme2,
383
+ watchersInstance: (0, import_vue5.readonly)(watchersInstance),
362
384
  setDarkMode,
363
385
  setNextTheme,
364
- getComputedCSSVariableValue
386
+ getComputedCSSVariableValue,
387
+ activePixelThemeWatcher,
388
+ stopPixelThemeWatcher
365
389
  };
366
390
  }
367
391
  __name(usePixelTheme, "usePixelTheme");
package/dist/index.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import "./chunk-34MJNZK5.mjs";
2
2
  import {
3
3
  usePixelTheme
4
- } from "./chunk-BAQYFJRO.mjs";
4
+ } from "./chunk-CO6CIIBD.mjs";
5
5
  import {
6
6
  groupBy
7
7
  } from "./chunk-555RL46T.mjs";
package/dist/metafile-cjs.json CHANGED
@@ -1 +1 @@
1
- {"inputs":{"src/array.ts":{"bytes":479,"imports":[{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/context.ts":{"bytes":493,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/validators.ts":{"bytes":1787,"imports":[{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/dom.ts":{"bytes":2010,"imports":[{"path":"src/validators.ts","kind":"import-statement","original":"./validators"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/generators.ts":{"bytes":778,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/performance.ts":{"bytes":2171,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/object.ts":{"bytes":918,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"./types","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/types.ts":{"bytes":1205,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/composables/usePixelTheme.ts":{"bytes":2808,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"@vueuse/core","kind":"import-statement","external":true},{"path":"src/dom.ts","kind":"import-statement","original":"../dom"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/composables/index.ts":{"bytes":117,"imports":[{"path":"src/composables/usePixelTheme.ts","kind":"import-statement","original":"./usePixelTheme"}],"format":"esm"},"src/index.ts":{"bytes":597,"imports":[{"path":"src/performance.ts","kind":"import-statement","original":"./performance"},{"path":"src/validators.ts","kind":"import-statement","original":"./validators"},{"path":"src/generators.ts","kind":"import-statement","original":"./generators"},{"path":"src/object.ts","kind":"import-statement","original":"./object"},{"path":"src/context.ts","kind":"import-statement","original":"./context"},{"path":"src/dom.ts","kind":"import-statement","original":"./dom"},{"path":"src/types.ts","kind":"import-statement","original":"./types"},{"path":"src/array.ts","kind":"import-statement","original":"./array"},{"path":"src/types.ts","kind":"import-statement","original":"./types"},{"path":"src/composables/index.ts","kind":"import-statement","original":"./composables"},{"path":"@vueuse/core","kind":"import-statement","external":true},{"path":"@vueuse/integrations/useFocusTrap","kind":"import-statement","external":true}],"format":"esm"}},"outputs":{"dist/array.js":{"imports":[],"exports":[],"entryPoint":"src/array.ts","inputs":{"src/array.ts":{"bytesInOutput":377}},"bytes":1384},"dist/context.js":{"imports":[{"path":"vue","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/context.ts","inputs":{"src/context.ts":{"bytesInOutput":579}},"bytes":1602},"dist/dom.js":{"imports":[],"exports":[],"entryPoint":"src/dom.ts","inputs":{"src/dom.ts":{"bytesInOutput":1682},"src/validators.ts":{"bytesInOutput":110}},"bytes":2921},"dist/generators.js":{"imports":[{"path":"vue","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/generators.ts","inputs":{"src/generators.ts":{"bytesInOutput":953}},"bytes":1993},"dist/index.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@vueuse/core","kind":"require-call","external":true},{"path":"@vueuse/core","kind":"require-call","external":true},{"path":"@vueuse/integrations/useFocusTrap","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":1584},"src/performance.ts":{"bytesInOutput":1935},"src/validators.ts":{"bytesInOutput":1355},"src/generators.ts":{"bytesInOutput":752},"src/object.ts":{"bytesInOutput":851},"src/context.ts":{"bytesInOutput":423},"src/dom.ts":{"bytesInOutput":1369},"src/types.ts":{"bytesInOutput":99},"src/array.ts":{"bytesInOutput":252},"src/composables/usePixelTheme.ts":{"bytesInOutput":2085},"src/composables/index.ts":{"bytesInOutput":0}},"bytes":12461},"dist/object.js":{"imports":[{"path":"vue","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/object.ts","inputs":{"src/object.ts":{"bytesInOutput":1103}},"bytes":2168},"dist/performance.js":{"imports":[{"path":"vue","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/performance.ts","inputs":{"src/performance.ts":{"bytesInOutput":2108}},"bytes":3136},"dist/types.js":{"imports":[],"exports":[],"entryPoint":"src/types.ts","inputs":{"src/types.ts":{"bytesInOutput":242}},"bytes":1258},"dist/validators.js":{"imports":[],"exports":[],"entryPoint":"src/validators.ts","inputs":{"src/validators.ts":{"bytesInOutput":1633}},"bytes":2706},"dist/composables/index.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"@vueuse/core","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/composables/index.ts","inputs":{"src/composables/index.ts":{"bytesInOutput":155},"src/composables/usePixelTheme.ts":{"bytesInOutput":2065},"src/dom.ts":{"bytesInOutput":103}},"bytes":3437},"dist/composables/usePixelTheme.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"@vueuse/core","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/composables/usePixelTheme.ts","inputs":{"src/composables/usePixelTheme.ts":{"bytesInOutput":2226},"src/dom.ts":{"bytesInOutput":103}},"bytes":3414}}}
1
+ {"inputs":{"src/array.ts":{"bytes":479,"imports":[{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/context.ts":{"bytes":493,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/validators.ts":{"bytes":1787,"imports":[{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/dom.ts":{"bytes":2010,"imports":[{"path":"src/validators.ts","kind":"import-statement","original":"./validators"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/generators.ts":{"bytes":778,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/performance.ts":{"bytes":2171,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/object.ts":{"bytes":918,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"./types","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/types.ts":{"bytes":1203,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/composables/usePixelTheme.ts":{"bytes":4413,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"@vueuse/core","kind":"import-statement","external":true},{"path":"src/dom.ts","kind":"import-statement","original":"../dom"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/composables/index.ts":{"bytes":117,"imports":[{"path":"src/composables/usePixelTheme.ts","kind":"import-statement","original":"./usePixelTheme"}],"format":"esm"},"src/index.ts":{"bytes":597,"imports":[{"path":"src/performance.ts","kind":"import-statement","original":"./performance"},{"path":"src/validators.ts","kind":"import-statement","original":"./validators"},{"path":"src/generators.ts","kind":"import-statement","original":"./generators"},{"path":"src/object.ts","kind":"import-statement","original":"./object"},{"path":"src/context.ts","kind":"import-statement","original":"./context"},{"path":"src/dom.ts","kind":"import-statement","original":"./dom"},{"path":"src/types.ts","kind":"import-statement","original":"./types"},{"path":"src/array.ts","kind":"import-statement","original":"./array"},{"path":"src/types.ts","kind":"import-statement","original":"./types"},{"path":"src/composables/index.ts","kind":"import-statement","original":"./composables"},{"path":"@vueuse/core","kind":"import-statement","external":true},{"path":"@vueuse/integrations/useFocusTrap","kind":"import-statement","external":true}],"format":"esm"}},"outputs":{"dist/array.js":{"imports":[],"exports":[],"entryPoint":"src/array.ts","inputs":{"src/array.ts":{"bytesInOutput":377}},"bytes":1384},"dist/context.js":{"imports":[{"path":"vue","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/context.ts","inputs":{"src/context.ts":{"bytesInOutput":579}},"bytes":1602},"dist/dom.js":{"imports":[],"exports":[],"entryPoint":"src/dom.ts","inputs":{"src/dom.ts":{"bytesInOutput":1682},"src/validators.ts":{"bytesInOutput":110}},"bytes":2921},"dist/generators.js":{"imports":[{"path":"vue","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/generators.ts","inputs":{"src/generators.ts":{"bytesInOutput":953}},"bytes":1993},"dist/index.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@vueuse/core","kind":"require-call","external":true},{"path":"@vueuse/core","kind":"require-call","external":true},{"path":"@vueuse/integrations/useFocusTrap","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":1584},"src/performance.ts":{"bytesInOutput":1935},"src/validators.ts":{"bytesInOutput":1355},"src/generators.ts":{"bytesInOutput":752},"src/object.ts":{"bytesInOutput":851},"src/context.ts":{"bytesInOutput":423},"src/dom.ts":{"bytesInOutput":1369},"src/types.ts":{"bytesInOutput":99},"src/array.ts":{"bytesInOutput":252},"src/composables/usePixelTheme.ts":{"bytesInOutput":3027},"src/composables/index.ts":{"bytesInOutput":0}},"bytes":13403},"dist/object.js":{"imports":[{"path":"vue","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/object.ts","inputs":{"src/object.ts":{"bytesInOutput":1103}},"bytes":2168},"dist/performance.js":{"imports":[{"path":"vue","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/performance.ts","inputs":{"src/performance.ts":{"bytesInOutput":2108}},"bytes":3136},"dist/types.js":{"imports":[],"exports":[],"entryPoint":"src/types.ts","inputs":{"src/types.ts":{"bytesInOutput":242}},"bytes":1258},"dist/validators.js":{"imports":[],"exports":[],"entryPoint":"src/validators.ts","inputs":{"src/validators.ts":{"bytesInOutput":1633}},"bytes":2706},"dist/composables/index.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"@vueuse/core","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/composables/index.ts","inputs":{"src/composables/index.ts":{"bytesInOutput":155},"src/composables/usePixelTheme.ts":{"bytesInOutput":3005},"src/dom.ts":{"bytesInOutput":103}},"bytes":4377},"dist/composables/usePixelTheme.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"@vueuse/core","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/composables/usePixelTheme.ts","inputs":{"src/composables/usePixelTheme.ts":{"bytesInOutput":3166},"src/dom.ts":{"bytesInOutput":103}},"bytes":4354}}}
package/dist/metafile-esm.json CHANGED
@@ -1 +1 @@
1
- {"inputs":{"src/array.ts":{"bytes":479,"imports":[{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/context.ts":{"bytes":493,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/validators.ts":{"bytes":1787,"imports":[{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/dom.ts":{"bytes":2010,"imports":[{"path":"src/validators.ts","kind":"import-statement","original":"./validators"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/generators.ts":{"bytes":778,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/performance.ts":{"bytes":2171,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/object.ts":{"bytes":918,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"./types","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/types.ts":{"bytes":1205,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/composables/usePixelTheme.ts":{"bytes":2808,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"@vueuse/core","kind":"import-statement","external":true},{"path":"src/dom.ts","kind":"import-statement","original":"../dom"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/composables/index.ts":{"bytes":117,"imports":[{"path":"src/composables/usePixelTheme.ts","kind":"import-statement","original":"./usePixelTheme"}],"format":"esm"},"src/index.ts":{"bytes":597,"imports":[{"path":"src/performance.ts","kind":"import-statement","original":"./performance"},{"path":"src/validators.ts","kind":"import-statement","original":"./validators"},{"path":"src/generators.ts","kind":"import-statement","original":"./generators"},{"path":"src/object.ts","kind":"import-statement","original":"./object"},{"path":"src/context.ts","kind":"import-statement","original":"./context"},{"path":"src/dom.ts","kind":"import-statement","original":"./dom"},{"path":"src/types.ts","kind":"import-statement","original":"./types"},{"path":"src/array.ts","kind":"import-statement","original":"./array"},{"path":"src/types.ts","kind":"import-statement","original":"./types"},{"path":"src/composables/index.ts","kind":"import-statement","original":"./composables"},{"path":"@vueuse/core","kind":"import-statement","external":true},{"path":"@vueuse/integrations/useFocusTrap","kind":"import-statement","external":true}],"format":"esm"}},"outputs":{"dist/validators.mjs":{"imports":[{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["isDef","isEqual","isPixelTagComponent","isUndef","isVueComponent"],"entryPoint":"src/validators.ts","inputs":{},"bytes":225},"dist/composables/index.mjs":{"imports":[{"path":"dist/chunk-34MJNZK5.mjs","kind":"import-statement"},{"path":"dist/chunk-BAQYFJRO.mjs","kind":"import-statement"},{"path":"dist/chunk-OVY52ELY.mjs","kind":"import-statement"},{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["usePixelTheme"],"entryPoint":"src/composables/index.ts","inputs":{},"bytes":213},"dist/composables/usePixelTheme.mjs":{"imports":[{"path":"dist/chunk-BAQYFJRO.mjs","kind":"import-statement"},{"path":"dist/chunk-OVY52ELY.mjs","kind":"import-statement"},{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["usePixelTheme"],"entryPoint":"src/composables/usePixelTheme.ts","inputs":{},"bytes":181},"dist/array.mjs":{"imports":[{"path":"dist/chunk-555RL46T.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["groupBy"],"entryPoint":"src/array.ts","inputs":{},"bytes":103},"dist/context.mjs":{"imports":[{"path":"dist/chunk-HXLTBFWE.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["usePixelCreateContext"],"entryPoint":"src/context.ts","inputs":{},"bytes":131},"dist/dom.mjs":{"imports":[{"path":"dist/chunk-OVY52ELY.mjs","kind":"import-statement"},{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["canUseDOM","getElement","getNode","isElementVisible","isNextTheme","scrollToTargetElement"],"entryPoint":"src/dom.ts","inputs":{},"bytes":308},"dist/generators.mjs":{"imports":[{"path":"dist/chunk-TJIIVYQV.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["declareEmit","getUniqueId","useId"],"entryPoint":"src/generators.ts","inputs":{},"bytes":159},"dist/index.mjs":{"imports":[{"path":"dist/chunk-34MJNZK5.mjs","kind":"import-statement"},{"path":"dist/chunk-BAQYFJRO.mjs","kind":"import-statement"},{"path":"dist/chunk-555RL46T.mjs","kind":"import-statement"},{"path":"dist/chunk-HXLTBFWE.mjs","kind":"import-statement"},{"path":"dist/chunk-OVY52ELY.mjs","kind":"import-statement"},{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-TJIIVYQV.mjs","kind":"import-statement"},{"path":"dist/chunk-PLTSXP5P.mjs","kind":"import-statement"},{"path":"dist/chunk-65WDFMBW.mjs","kind":"import-statement"},{"path":"dist/chunk-P3Q2WHZW.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"@vueuse/core","kind":"import-statement","external":true},{"path":"@vueuse/integrations/useFocusTrap","kind":"import-statement","external":true}],"exports":["canUseDOM","declareEmit","definePropsTable","getChildren","getElement","getNode","getUniqueId","groupBy","isDef","isElementVisible","isEqual","isNextTheme","isObject","isPixelTagComponent","isUndef","isVueComponent","objectFilter","objectFilterUndefined","onClickOutside","onKeyStroke","scrollToTargetElement","unrefElement","useFocusTrap","useId","useInfiniteScroll","useIntersectionObserver","usePerformanceObserver","usePixelCreateContext","usePixelTheme","useScrollLock","useStorage","useStyleTag","useVirtualList"],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":240}},"bytes":1610},"dist/chunk-34MJNZK5.mjs":{"imports":[],"exports":[],"inputs":{"src/composables/index.ts":{"bytesInOutput":0}},"bytes":0},"dist/chunk-BAQYFJRO.mjs":{"imports":[{"path":"dist/chunk-OVY52ELY.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true},{"path":"@vueuse/core","kind":"import-statement","external":true}],"exports":["usePixelTheme"],"inputs":{"src/composables/usePixelTheme.ts":{"bytesInOutput":1995}},"bytes":2162},"dist/chunk-555RL46T.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["groupBy"],"inputs":{"src/array.ts":{"bytesInOutput":252}},"bytes":341},"dist/chunk-HXLTBFWE.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true}],"exports":["usePixelCreateContext"],"inputs":{"src/context.ts":{"bytesInOutput":394}},"bytes":499},"dist/chunk-OVY52ELY.mjs":{"imports":[{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["canUseDOM","getElement","getNode","isElementVisible","isNextTheme","scrollToTargetElement"],"inputs":{"src/dom.ts":{"bytesInOutput":1369}},"bytes":1600},"dist/chunk-XE4ZKGPH.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["isDef","isEqual","isPixelTagComponent","isUndef","isVueComponent"],"inputs":{"src/validators.ts":{"bytesInOutput":1355}},"bytes":1510},"dist/chunk-TJIIVYQV.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true}],"exports":["declareEmit","getUniqueId","useId"],"inputs":{"src/generators.ts":{"bytesInOutput":721}},"bytes":843},"dist/object.mjs":{"imports":[{"path":"dist/chunk-PLTSXP5P.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["getChildren","isObject","objectFilter","objectFilterUndefined"],"entryPoint":"src/object.ts","inputs":{},"bytes":217},"dist/chunk-PLTSXP5P.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true}],"exports":["getChildren","isObject","objectFilter","objectFilterUndefined"],"inputs":{"src/object.ts":{"bytesInOutput":831}},"bytes":978},"dist/performance.mjs":{"imports":[{"path":"dist/chunk-65WDFMBW.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["usePerformanceObserver"],"entryPoint":"src/performance.ts","inputs":{},"bytes":133},"dist/chunk-65WDFMBW.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true}],"exports":["usePerformanceObserver"],"inputs":{"src/performance.ts":{"bytesInOutput":1880}},"bytes":1990},"dist/types.mjs":{"imports":[{"path":"dist/chunk-P3Q2WHZW.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["definePropsTable"],"entryPoint":"src/types.ts","inputs":{},"bytes":121},"dist/chunk-P3Q2WHZW.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["definePropsTable"],"inputs":{"src/types.ts":{"bytesInOutput":99}},"bytes":197},"dist/chunk-QZ7VFGWC.mjs":{"imports":[],"exports":["__name"],"inputs":{},"bytes":151}}}
1
+ {"inputs":{"src/array.ts":{"bytes":479,"imports":[{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/context.ts":{"bytes":493,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/validators.ts":{"bytes":1787,"imports":[{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/dom.ts":{"bytes":2010,"imports":[{"path":"src/validators.ts","kind":"import-statement","original":"./validators"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/generators.ts":{"bytes":778,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/performance.ts":{"bytes":2171,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/object.ts":{"bytes":918,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"./types","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/types.ts":{"bytes":1203,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/composables/usePixelTheme.ts":{"bytes":4413,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"@vueuse/core","kind":"import-statement","external":true},{"path":"src/dom.ts","kind":"import-statement","original":"../dom"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/composables/index.ts":{"bytes":117,"imports":[{"path":"src/composables/usePixelTheme.ts","kind":"import-statement","original":"./usePixelTheme"}],"format":"esm"},"src/index.ts":{"bytes":597,"imports":[{"path":"src/performance.ts","kind":"import-statement","original":"./performance"},{"path":"src/validators.ts","kind":"import-statement","original":"./validators"},{"path":"src/generators.ts","kind":"import-statement","original":"./generators"},{"path":"src/object.ts","kind":"import-statement","original":"./object"},{"path":"src/context.ts","kind":"import-statement","original":"./context"},{"path":"src/dom.ts","kind":"import-statement","original":"./dom"},{"path":"src/types.ts","kind":"import-statement","original":"./types"},{"path":"src/array.ts","kind":"import-statement","original":"./array"},{"path":"src/types.ts","kind":"import-statement","original":"./types"},{"path":"src/composables/index.ts","kind":"import-statement","original":"./composables"},{"path":"@vueuse/core","kind":"import-statement","external":true},{"path":"@vueuse/integrations/useFocusTrap","kind":"import-statement","external":true}],"format":"esm"}},"outputs":{"dist/validators.mjs":{"imports":[{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["isDef","isEqual","isPixelTagComponent","isUndef","isVueComponent"],"entryPoint":"src/validators.ts","inputs":{},"bytes":225},"dist/composables/index.mjs":{"imports":[{"path":"dist/chunk-34MJNZK5.mjs","kind":"import-statement"},{"path":"dist/chunk-CO6CIIBD.mjs","kind":"import-statement"},{"path":"dist/chunk-OVY52ELY.mjs","kind":"import-statement"},{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["usePixelTheme"],"entryPoint":"src/composables/index.ts","inputs":{},"bytes":213},"dist/composables/usePixelTheme.mjs":{"imports":[{"path":"dist/chunk-CO6CIIBD.mjs","kind":"import-statement"},{"path":"dist/chunk-OVY52ELY.mjs","kind":"import-statement"},{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["usePixelTheme"],"entryPoint":"src/composables/usePixelTheme.ts","inputs":{},"bytes":181},"dist/array.mjs":{"imports":[{"path":"dist/chunk-555RL46T.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["groupBy"],"entryPoint":"src/array.ts","inputs":{},"bytes":103},"dist/context.mjs":{"imports":[{"path":"dist/chunk-HXLTBFWE.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["usePixelCreateContext"],"entryPoint":"src/context.ts","inputs":{},"bytes":131},"dist/dom.mjs":{"imports":[{"path":"dist/chunk-OVY52ELY.mjs","kind":"import-statement"},{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["canUseDOM","getElement","getNode","isElementVisible","isNextTheme","scrollToTargetElement"],"entryPoint":"src/dom.ts","inputs":{},"bytes":308},"dist/generators.mjs":{"imports":[{"path":"dist/chunk-TJIIVYQV.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["declareEmit","getUniqueId","useId"],"entryPoint":"src/generators.ts","inputs":{},"bytes":159},"dist/index.mjs":{"imports":[{"path":"dist/chunk-34MJNZK5.mjs","kind":"import-statement"},{"path":"dist/chunk-CO6CIIBD.mjs","kind":"import-statement"},{"path":"dist/chunk-555RL46T.mjs","kind":"import-statement"},{"path":"dist/chunk-HXLTBFWE.mjs","kind":"import-statement"},{"path":"dist/chunk-OVY52ELY.mjs","kind":"import-statement"},{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-TJIIVYQV.mjs","kind":"import-statement"},{"path":"dist/chunk-PLTSXP5P.mjs","kind":"import-statement"},{"path":"dist/chunk-65WDFMBW.mjs","kind":"import-statement"},{"path":"dist/chunk-P3Q2WHZW.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"@vueuse/core","kind":"import-statement","external":true},{"path":"@vueuse/integrations/useFocusTrap","kind":"import-statement","external":true}],"exports":["canUseDOM","declareEmit","definePropsTable","getChildren","getElement","getNode","getUniqueId","groupBy","isDef","isElementVisible","isEqual","isNextTheme","isObject","isPixelTagComponent","isUndef","isVueComponent","objectFilter","objectFilterUndefined","onClickOutside","onKeyStroke","scrollToTargetElement","unrefElement","useFocusTrap","useId","useInfiniteScroll","useIntersectionObserver","usePerformanceObserver","usePixelCreateContext","usePixelTheme","useScrollLock","useStorage","useStyleTag","useVirtualList"],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":240}},"bytes":1610},"dist/chunk-34MJNZK5.mjs":{"imports":[],"exports":[],"inputs":{"src/composables/index.ts":{"bytesInOutput":0}},"bytes":0},"dist/chunk-CO6CIIBD.mjs":{"imports":[{"path":"dist/chunk-OVY52ELY.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true},{"path":"@vueuse/core","kind":"import-statement","external":true}],"exports":["usePixelTheme"],"inputs":{"src/composables/usePixelTheme.ts":{"bytesInOutput":2918}},"bytes":3085},"dist/chunk-555RL46T.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["groupBy"],"inputs":{"src/array.ts":{"bytesInOutput":252}},"bytes":341},"dist/chunk-HXLTBFWE.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true}],"exports":["usePixelCreateContext"],"inputs":{"src/context.ts":{"bytesInOutput":394}},"bytes":499},"dist/chunk-OVY52ELY.mjs":{"imports":[{"path":"dist/chunk-XE4ZKGPH.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["canUseDOM","getElement","getNode","isElementVisible","isNextTheme","scrollToTargetElement"],"inputs":{"src/dom.ts":{"bytesInOutput":1369}},"bytes":1600},"dist/chunk-XE4ZKGPH.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["isDef","isEqual","isPixelTagComponent","isUndef","isVueComponent"],"inputs":{"src/validators.ts":{"bytesInOutput":1355}},"bytes":1510},"dist/chunk-TJIIVYQV.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true}],"exports":["declareEmit","getUniqueId","useId"],"inputs":{"src/generators.ts":{"bytesInOutput":721}},"bytes":843},"dist/object.mjs":{"imports":[{"path":"dist/chunk-PLTSXP5P.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["getChildren","isObject","objectFilter","objectFilterUndefined"],"entryPoint":"src/object.ts","inputs":{},"bytes":217},"dist/chunk-PLTSXP5P.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true}],"exports":["getChildren","isObject","objectFilter","objectFilterUndefined"],"inputs":{"src/object.ts":{"bytesInOutput":831}},"bytes":978},"dist/performance.mjs":{"imports":[{"path":"dist/chunk-65WDFMBW.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["usePerformanceObserver"],"entryPoint":"src/performance.ts","inputs":{},"bytes":133},"dist/chunk-65WDFMBW.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true}],"exports":["usePerformanceObserver"],"inputs":{"src/performance.ts":{"bytesInOutput":1880}},"bytes":1990},"dist/types.mjs":{"imports":[{"path":"dist/chunk-P3Q2WHZW.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["definePropsTable"],"entryPoint":"src/types.ts","inputs":{},"bytes":121},"dist/chunk-P3Q2WHZW.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["definePropsTable"],"inputs":{"src/types.ts":{"bytesInOutput":99}},"bytes":197},"dist/chunk-QZ7VFGWC.mjs":{"imports":[],"exports":["__name"],"inputs":{},"bytes":151}}}
package/dist/types.d.mts CHANGED
@@ -4,7 +4,7 @@ type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
4
4
  type Dict<T = any> = Record<string, T>;
5
5
  type FilterFn<T> = (value: any, key: string, object: T) => boolean;
6
6
  type PropTypes<T = Dict> = Record<'button' | 'label' | 'input' | 'img' | 'output' | 'element' | 'select' | 'style', T>;
7
- type CombinedString = (string & NonNullable<unknown>);
7
+ type CombinedString = string & NonNullable<unknown>;
8
8
  type ComponentWithProps<P> = {
9
9
  new (): {
10
10
  $props: AllowedComponentProps & ComponentCustomProps & VNodeProps & {
package/dist/types.d.ts CHANGED
@@ -4,7 +4,7 @@ type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
4
4
  type Dict<T = any> = Record<string, T>;
5
5
  type FilterFn<T> = (value: any, key: string, object: T) => boolean;
6
6
  type PropTypes<T = Dict> = Record<'button' | 'label' | 'input' | 'img' | 'output' | 'element' | 'select' | 'style', T>;
7
- type CombinedString = (string & NonNullable<unknown>);
7
+ type CombinedString = string & NonNullable<unknown>;
8
8
  type ComponentWithProps<P> = {
9
9
  new (): {
10
10
  $props: AllowedComponentProps & ComponentCustomProps & VNodeProps & {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mekari/pixel3-utils",
3
3
  "description": "Utils for mekari pixel 3",
4
- "version": "0.0.7-dev.1",
4
+ "version": "0.0.7-dev.2",
5
5
  "files": [
6
6
  "dist"
7
7
  ],
package/dist/chunk-BAQYFJRO.mjs DELETED
@@ -1,86 +0,0 @@
1
- import {
2
- canUseDOM
3
- } from "./chunk-OVY52ELY.mjs";
4
- import {
5
- __name
6
- } from "./chunk-QZ7VFGWC.mjs";
7
-
8
- // src/composables/usePixelTheme.ts
9
- import { watch } from "vue";
10
- import { useStorage } from "@vueuse/core";
11
- var isDark = useStorage("pixel-dark-mode", false);
12
- var isNextTheme = useStorage("pixel-next-theme", false);
13
- function usePixelTheme() {
14
- function setDarkMode(value) {
15
- isDark.value = value;
16
- }
17
- __name(setDarkMode, "setDarkMode");
18
- function setNextTheme(value) {
19
- isNextTheme.value = value;
20
- }
21
- __name(setNextTheme, "setNextTheme");
22
- function showLightMode() {
23
- if (!canUseDOM)
24
- return;
25
- document.documentElement.classList.add("light");
26
- document.documentElement.classList.remove("dark");
27
- }
28
- __name(showLightMode, "showLightMode");
29
- function showDarkMode() {
30
- if (!canUseDOM)
31
- return;
32
- document.documentElement.classList.add("dark");
33
- document.documentElement.classList.remove("light");
34
- }
35
- __name(showDarkMode, "showDarkMode");
36
- function applyNextTheme() {
37
- if (!canUseDOM)
38
- return;
39
- document.documentElement.setAttribute("data-panda-theme", "next");
40
- }
41
- __name(applyNextTheme, "applyNextTheme");
42
- function removeNextTheme() {
43
- if (!canUseDOM)
44
- return;
45
- document.documentElement.removeAttribute("data-panda-theme");
46
- }
47
- __name(removeNextTheme, "removeNextTheme");
48
- function getComputedCSSVariableValue(variable) {
49
- if (!canUseDOM)
50
- return;
51
- return getComputedStyle(document.documentElement).getPropertyValue(variable.slice(4, variable.length - 1)).trim();
52
- }
53
- __name(getComputedCSSVariableValue, "getComputedCSSVariableValue");
54
- watch(() => isDark.value, (value) => {
55
- if (value) {
56
- showDarkMode();
57
- } else {
58
- showLightMode();
59
- }
60
- }, {
61
- immediate: true
62
- });
63
- watch(() => isNextTheme.value, (value) => {
64
- if (!canUseDOM)
65
- return;
66
- if (value) {
67
- applyNextTheme();
68
- } else {
69
- removeNextTheme();
70
- }
71
- }, {
72
- immediate: true
73
- });
74
- return {
75
- isDark,
76
- isNextTheme,
77
- setDarkMode,
78
- setNextTheme,
79
- getComputedCSSVariableValue
80
- };
81
- }
82
- __name(usePixelTheme, "usePixelTheme");
83
-
84
- export {
85
- usePixelTheme
86
- };