@slimr/react 3.0.6 → 3.0.7

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 (19) hide show
  1. package/cjs/index.d.ts +1 -0
  2. package/cjs/index.js +1 -0
  3. package/cjs/index.js.map +1 -1
  4. package/cjs/index.ts +1 -0
  5. package/cjs/useColorScheme.d.ts +5 -0
  6. package/cjs/useColorScheme.js +20 -0
  7. package/cjs/useColorScheme.js.map +1 -0
  8. package/cjs/useColorScheme.ts +19 -0
  9. package/esm/index.d.ts +1 -0
  10. package/esm/index.js +1 -0
  11. package/esm/index.js.map +1 -1
  12. package/esm/index.ts +1 -0
  13. package/esm/useColorScheme.d.ts +5 -0
  14. package/esm/useColorScheme.js +16 -0
  15. package/esm/useColorScheme.js.map +1 -0
  16. package/esm/useColorScheme.ts +19 -0
  17. package/package.json +2 -2
  18. package/src/index.ts +1 -0
  19. package/src/useColorScheme.ts +19 -0
package/cjs/index.d.ts CHANGED
@@ -5,5 +5,6 @@ export * from '@slimr/styled';
5
5
  export * from '@slimr/swr';
6
6
  export * from 'react-use';
7
7
  export * from './merge-refs.js';
8
+ export * from './useColorScheme.js';
8
9
  export * from './useMemos.js';
9
10
  export * from './useSet2.js';
package/cjs/index.js CHANGED
@@ -21,6 +21,7 @@ __exportStar(require("@slimr/styled"), exports);
21
21
  __exportStar(require("@slimr/swr"), exports);
22
22
  __exportStar(require("react-use"), exports);
23
23
  __exportStar(require("./merge-refs.js"), exports);
24
+ __exportStar(require("./useColorScheme.js"), exports);
24
25
  __exportStar(require("./useMemos.js"), exports);
25
26
  __exportStar(require("./useSet2.js"), exports);
26
27
  //# sourceMappingURL=index.js.map
package/cjs/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,+CAA4B;AAC5B,kDAA+B;AAC/B,gDAA6B;AAC7B,gDAA6B;AAC7B,6CAA0B;AAC1B,4CAAyB;AAEzB,kDAA+B;AAC/B,gDAA6B;AAC7B,+CAA4B"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,+CAA4B;AAC5B,kDAA+B;AAC/B,gDAA6B;AAC7B,gDAA6B;AAC7B,6CAA0B;AAC1B,4CAAyB;AAEzB,kDAA+B;AAC/B,sDAAmC;AACnC,gDAA6B;AAC7B,+CAA4B"}
package/cjs/index.ts CHANGED
@@ -6,5 +6,6 @@ export * from '@slimr/swr'
6
6
  export * from 'react-use'
7
7
 
8
8
  export * from './merge-refs.js'
9
+ export * from './useColorScheme.js'
9
10
  export * from './useMemos.js'
10
11
  export * from './useSet2.js'
package/cjs/useColorScheme.d.ts ADDED
@@ -0,0 +1,5 @@
1
+ export declare function useColorScheme(): {
2
+ dark: boolean;
3
+ light: boolean;
4
+ scheme: string;
5
+ };
package/cjs/useColorScheme.js ADDED
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useColorScheme = void 0;
4
+ const react_1 = require("react");
5
+ const matchMediaPrefersDark = matchMedia?.('(prefers-color-scheme:dark)');
6
+ function useColorScheme() {
7
+ const [dark, setDark] = (0, react_1.useState)(!!matchMediaPrefersDark?.matches);
8
+ (0, react_1.useEffect)(() => {
9
+ const updateColorScheme = () => {
10
+ setDark(!!matchMediaPrefersDark?.matches);
11
+ };
12
+ matchMediaPrefersDark.addEventListener('change', updateColorScheme);
13
+ return () => {
14
+ matchMediaPrefersDark.removeEventListener('change', updateColorScheme);
15
+ };
16
+ }, []);
17
+ return { dark, light: !dark, scheme: dark ? 'dark' : 'light' };
18
+ }
19
+ exports.useColorScheme = useColorScheme;
20
+ //# sourceMappingURL=useColorScheme.js.map
package/cjs/useColorScheme.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useColorScheme.js","sourceRoot":"","sources":["../src/useColorScheme.ts"],"names":[],"mappings":";;;AAAA,iCAAyC;AAEzC,MAAM,qBAAqB,GAAG,UAAU,EAAE,CAAC,6BAA6B,CAAC,CAAA;AAEzE,SAAgB,cAAc;IAC5B,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAC,CAAC,CAAC,qBAAqB,EAAE,OAAO,CAAC,CAAA;IAElE,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,iBAAiB,GAAG,GAAG,EAAE;YAC7B,OAAO,CAAC,CAAC,CAAC,qBAAqB,EAAE,OAAO,CAAC,CAAA;QAC3C,CAAC,CAAA;QACD,qBAAqB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,iBAAiB,CAAC,CAAA;QACnE,OAAO,GAAG,EAAE;YACV,qBAAqB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,iBAAiB,CAAC,CAAA;QACxE,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,EAAC,IAAI,EAAE,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAAC,CAAA;AAC9D,CAAC;AAdD,wCAcC"}
package/cjs/useColorScheme.ts ADDED
@@ -0,0 +1,19 @@
1
+ import {useEffect, useState} from 'react'
2
+
3
+ const matchMediaPrefersDark = matchMedia?.('(prefers-color-scheme:dark)')
4
+
5
+ export function useColorScheme() {
6
+ const [dark, setDark] = useState(!!matchMediaPrefersDark?.matches)
7
+
8
+ useEffect(() => {
9
+ const updateColorScheme = () => {
10
+ setDark(!!matchMediaPrefersDark?.matches)
11
+ }
12
+ matchMediaPrefersDark.addEventListener('change', updateColorScheme)
13
+ return () => {
14
+ matchMediaPrefersDark.removeEventListener('change', updateColorScheme)
15
+ }
16
+ }, [])
17
+
18
+ return {dark, light: !dark, scheme: dark ? 'dark' : 'light'}
19
+ }
package/esm/index.d.ts CHANGED
@@ -5,5 +5,6 @@ export * from '@slimr/styled';
5
5
  export * from '@slimr/swr';
6
6
  export * from 'react-use';
7
7
  export * from './merge-refs.js';
8
+ export * from './useColorScheme.js';
8
9
  export * from './useMemos.js';
9
10
  export * from './useSet2.js';
package/esm/index.js CHANGED
@@ -5,6 +5,7 @@ export * from '@slimr/styled';
5
5
  export * from '@slimr/swr';
6
6
  export * from 'react-use';
7
7
  export * from './merge-refs.js';
8
+ export * from './useColorScheme.js';
8
9
  export * from './useMemos.js';
9
10
  export * from './useSet2.js';
10
11
  //# sourceMappingURL=index.js.map
package/esm/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,eAAe,CAAA;AAC7B,cAAc,eAAe,CAAA;AAC7B,cAAc,YAAY,CAAA;AAC1B,cAAc,WAAW,CAAA;AAEzB,cAAc,iBAAiB,CAAA;AAC/B,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,eAAe,CAAA;AAC7B,cAAc,eAAe,CAAA;AAC7B,cAAc,YAAY,CAAA;AAC1B,cAAc,WAAW,CAAA;AAEzB,cAAc,iBAAiB,CAAA;AAC/B,cAAc,qBAAqB,CAAA;AACnC,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA"}
package/esm/index.ts CHANGED
@@ -6,5 +6,6 @@ export * from '@slimr/swr'
6
6
  export * from 'react-use'
7
7
 
8
8
  export * from './merge-refs.js'
9
+ export * from './useColorScheme.js'
9
10
  export * from './useMemos.js'
10
11
  export * from './useSet2.js'
package/esm/useColorScheme.d.ts ADDED
@@ -0,0 +1,5 @@
1
+ export declare function useColorScheme(): {
2
+ dark: boolean;
3
+ light: boolean;
4
+ scheme: string;
5
+ };
package/esm/useColorScheme.js ADDED
@@ -0,0 +1,16 @@
1
+ import { useEffect, useState } from 'react';
2
+ const matchMediaPrefersDark = matchMedia?.('(prefers-color-scheme:dark)');
3
+ export function useColorScheme() {
4
+ const [dark, setDark] = useState(!!matchMediaPrefersDark?.matches);
5
+ useEffect(() => {
6
+ const updateColorScheme = () => {
7
+ setDark(!!matchMediaPrefersDark?.matches);
8
+ };
9
+ matchMediaPrefersDark.addEventListener('change', updateColorScheme);
10
+ return () => {
11
+ matchMediaPrefersDark.removeEventListener('change', updateColorScheme);
12
+ };
13
+ }, []);
14
+ return { dark, light: !dark, scheme: dark ? 'dark' : 'light' };
15
+ }
16
+ //# sourceMappingURL=useColorScheme.js.map
package/esm/useColorScheme.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useColorScheme.js","sourceRoot":"","sources":["../src/useColorScheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAA;AAEzC,MAAM,qBAAqB,GAAG,UAAU,EAAE,CAAC,6BAA6B,CAAC,CAAA;AAEzE,MAAM,UAAU,cAAc;IAC5B,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,qBAAqB,EAAE,OAAO,CAAC,CAAA;IAElE,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,iBAAiB,GAAG,GAAG,EAAE;YAC7B,OAAO,CAAC,CAAC,CAAC,qBAAqB,EAAE,OAAO,CAAC,CAAA;QAC3C,CAAC,CAAA;QACD,qBAAqB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,iBAAiB,CAAC,CAAA;QACnE,OAAO,GAAG,EAAE;YACV,qBAAqB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,iBAAiB,CAAC,CAAA;QACxE,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,EAAC,IAAI,EAAE,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAAC,CAAA;AAC9D,CAAC"}
package/esm/useColorScheme.ts ADDED
@@ -0,0 +1,19 @@
1
+ import {useEffect, useState} from 'react'
2
+
3
+ const matchMediaPrefersDark = matchMedia?.('(prefers-color-scheme:dark)')
4
+
5
+ export function useColorScheme() {
6
+ const [dark, setDark] = useState(!!matchMediaPrefersDark?.matches)
7
+
8
+ useEffect(() => {
9
+ const updateColorScheme = () => {
10
+ setDark(!!matchMediaPrefersDark?.matches)
11
+ }
12
+ matchMediaPrefersDark.addEventListener('change', updateColorScheme)
13
+ return () => {
14
+ matchMediaPrefersDark.removeEventListener('change', updateColorScheme)
15
+ }
16
+ }, [])
17
+
18
+ return {dark, light: !dark, scheme: dark ? 'dark' : 'light'}
19
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@slimr/react",
3
- "version": "3.0.6",
3
+ "version": "3.0.7",
4
4
  "author": "Brian Dombrowski",
5
5
  "license": "ISC",
6
6
  "private": false,
@@ -32,7 +32,7 @@
32
32
  "start": "nodemon -w src -e '*' -x 'npm run build && cd ../demo && npm start'"
33
33
  },
34
34
  "dependencies": {
35
- "@slimr/forms": "^5.0.4",
35
+ "@slimr/forms": "^5.0.5",
36
36
  "@slimr/markdown": "^2.1.36",
37
37
  "@slimr/router": "^2.1.53",
38
38
  "@slimr/styled": "^2.1.44",
package/src/index.ts CHANGED
@@ -6,5 +6,6 @@ export * from '@slimr/swr'
6
6
  export * from 'react-use'
7
7
 
8
8
  export * from './merge-refs.js'
9
+ export * from './useColorScheme.js'
9
10
  export * from './useMemos.js'
10
11
  export * from './useSet2.js'
package/src/useColorScheme.ts ADDED
@@ -0,0 +1,19 @@
1
+ import {useEffect, useState} from 'react'
2
+
3
+ const matchMediaPrefersDark = matchMedia?.('(prefers-color-scheme:dark)')
4
+
5
+ export function useColorScheme() {
6
+ const [dark, setDark] = useState(!!matchMediaPrefersDark?.matches)
7
+
8
+ useEffect(() => {
9
+ const updateColorScheme = () => {
10
+ setDark(!!matchMediaPrefersDark?.matches)
11
+ }
12
+ matchMediaPrefersDark.addEventListener('change', updateColorScheme)
13
+ return () => {
14
+ matchMediaPrefersDark.removeEventListener('change', updateColorScheme)
15
+ }
16
+ }, [])
17
+
18
+ return {dark, light: !dark, scheme: dark ? 'dark' : 'light'}
19
+ }