@auspices/eos 6.0.0 → 6.1.0

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 (8) hide show
  1. package/README.md +92 -0
  2. package/dist/cjs/Themer/useThemer.js +19 -6
  3. package/dist/cjs/Themer/useThemer.js.map +1 -1
  4. package/dist/esm/Themer/useThemer.d.ts +12 -2
  5. package/dist/esm/Themer/useThemer.d.ts.map +1 -1
  6. package/dist/esm/Themer/useThemer.js +19 -6
  7. package/dist/esm/Themer/useThemer.js.map +1 -1
  8. package/package.json +11 -4
package/README.md CHANGED
@@ -38,11 +38,103 @@ import { Dropdown, Modal, useConfirm } from "@auspices/eos/client";
38
38
 
39
39
  - Import theme primitives from `@auspices/eos/theme`.
40
40
 
41
+ ### Using eos with `next-themes` (controlled mode)
42
+
43
+ When your app theme is managed by `next-themes`, pass the resolved `light | dark`
44
+ scheme directly into `ThemerProvider`. This keeps eos and your app on the same
45
+ authoritative theme source and avoids mixed first paint.
46
+
47
+ ```tsx
48
+ // pages/_app.tsx
49
+ import type { AppProps } from "next/app";
50
+ import React, { useEffect, useMemo, useState } from "react";
51
+ import { ThemeProvider as NextThemesProvider, useTheme } from "next-themes";
52
+ import { ThemeProvider as StyledThemeProvider } from "styled-components";
53
+ import { GlobalStyles, ThemerProvider, useThemer } from "@auspices/eos/client";
54
+ import type { Scheme } from "@auspices/eos/theme";
55
+
56
+ const getSchemeFromDom = (): Scheme => {
57
+ if (typeof document === "undefined") return "light";
58
+ const fromAttribute = document.documentElement.getAttribute("data-theme");
59
+ return fromAttribute === "dark" ? "dark" : "light";
60
+ };
61
+
62
+ const EosThemeBridge: React.FC<{ children: React.ReactNode }> = ({ children }) => {
63
+ const { resolvedTheme, setTheme } = useTheme();
64
+ const [mounted, setMounted] = useState(false);
65
+ const [fallbackScheme] = useState<Scheme>(getSchemeFromDom);
66
+
67
+ useEffect(() => {
68
+ setMounted(true);
69
+ }, []);
70
+
71
+ const scheme = useMemo<Scheme>(() => {
72
+ if (resolvedTheme === "dark" || resolvedTheme === "light") return resolvedTheme;
73
+ return fallbackScheme;
74
+ }, [fallbackScheme, resolvedTheme]);
75
+
76
+ if (!mounted) return null;
77
+
78
+ return (
79
+ <ThemerProvider scheme={scheme} setScheme={(nextScheme) => setTheme(nextScheme)}>
80
+ <EosStyledThemeProvider>{children}</EosStyledThemeProvider>
81
+ </ThemerProvider>
82
+ );
83
+ };
84
+
85
+ const EosStyledThemeProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
86
+ const { theme } = useThemer();
87
+ return (
88
+ <StyledThemeProvider theme={theme}>
89
+ <GlobalStyles />
90
+ {children}
91
+ </StyledThemeProvider>
92
+ );
93
+ };
94
+
95
+ export default function App({ Component, pageProps }: AppProps) {
96
+ return (
97
+ <NextThemesProvider attribute="data-theme" defaultTheme="system" enableSystem>
98
+ <EosThemeBridge>
99
+ <Component {...pageProps} />
100
+ </EosThemeBridge>
101
+ </NextThemesProvider>
102
+ );
103
+ }
104
+ ```
105
+
106
+ ```tsx
107
+ // pages/_document.tsx
108
+ import Document, { Html, Head, Main, NextScript } from "next/document";
109
+
110
+ export default class MyDocument extends Document {
111
+ render() {
112
+ return (
113
+ <Html suppressHydrationWarning>
114
+ <Head />
115
+ <body>
116
+ <Main />
117
+ <NextScript />
118
+ </body>
119
+ </Html>
120
+ );
121
+ }
122
+ }
123
+ ```
124
+
125
+ Notes:
126
+ - In controlled mode, eos does not read or write local storage for scheme state.
127
+ - `next-themes` remains the only source of truth.
128
+ - Ensure the `scheme` prop is always a concrete `light` or `dark` value.
129
+ - Avoid rendering `useTheme()`-derived UI until client mount to prevent hydration mismatch.
130
+ - See `examples/next-pages-next-themes` for a complete pages-router SSR integration.
131
+
41
132
  ### Local Example App
42
133
 
43
134
  ```bash
44
135
  yarn install
45
136
  yarn workspace eos-next-minimal dev
137
+ yarn workspace eos-next-pages-next-themes dev
46
138
  ```
47
139
 
48
140
  For production validation:
package/dist/cjs/Themer/useThemer.js CHANGED
@@ -37,17 +37,30 @@ exports.ThemeContext = (0, react_1.createContext)({
37
37
  });
38
38
  const isScheme = (value) => !!value && Object.keys(theme_1.SCHEMES).includes(value);
39
39
  exports.isScheme = isScheme;
40
- const ThemerProvider = ({ children, initialScheme = DEFAULT_SCHEME, backend = DEFAULT_BACKEND, }) => {
41
- const [scheme, setScheme] = (0, react_1.useState)(initialScheme);
40
+ const ThemerProvider = ({ children, initialScheme = DEFAULT_SCHEME, backend = DEFAULT_BACKEND, scheme: controlledScheme, setScheme: controlledSetScheme, }) => {
41
+ const isControlled = controlledScheme !== undefined;
42
+ const [uncontrolledScheme, setUncontrolledScheme] = (0, react_1.useState)(initialScheme);
43
+ const scheme = controlledScheme !== null && controlledScheme !== void 0 ? controlledScheme : uncontrolledScheme;
42
44
  (0, react_1.useEffect)(() => {
43
45
  var _a;
44
- setScheme((_a = backend.get()) !== null && _a !== void 0 ? _a : initialScheme);
45
- }, [backend, initialScheme]);
46
+ if (isControlled)
47
+ return;
48
+ setUncontrolledScheme((_a = backend.get()) !== null && _a !== void 0 ? _a : initialScheme);
49
+ }, [backend, initialScheme, isControlled]);
50
+ const setScheme = (0, react_1.useCallback)((nextScheme) => {
51
+ if (isControlled) {
52
+ controlledSetScheme === null || controlledSetScheme === void 0 ? void 0 : controlledSetScheme(nextScheme);
53
+ return;
54
+ }
55
+ setUncontrolledScheme(nextScheme);
56
+ }, [controlledSetScheme, isControlled]);
46
57
  const theme = (0, react_1.useMemo)(() => ({ ...theme_1.THEME, scheme, colors: theme_1.SCHEMES[scheme] }), [scheme]);
47
- const toggleScheme = (0, react_1.useCallback)(() => setScheme((prevScheme) => (prevScheme === "dark" ? "light" : "dark")), []);
58
+ const toggleScheme = (0, react_1.useCallback)(() => setScheme(scheme === "dark" ? "light" : "dark"), [scheme, setScheme]);
48
59
  (0, useUpdateEffect_1.useUpdateEffect)(() => {
60
+ if (isControlled)
61
+ return;
49
62
  backend.set(scheme);
50
- }, [backend, scheme]);
63
+ }, [backend, isControlled, scheme]);
51
64
  return ((0, jsx_runtime_1.jsx)(exports.ThemeContext.Provider, { value: { theme, scheme, setScheme, toggleScheme }, children: children }));
52
65
  };
53
66
  exports.ThemerProvider = ThemerProvider;
package/dist/cjs/Themer/useThemer.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useThemer.js","sourceRoot":"","sources":["../../../src/Themer/useThemer.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"useThemer.js","sourceRoot":"","sources":["../../../src/Themer/useThemer.tsx"],"names":[],"mappings":"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"}
package/dist/esm/Themer/useThemer.d.ts CHANGED
@@ -13,12 +13,22 @@ export declare const ThemeContext: React.Context<{
13
13
  toggleScheme(): void;
14
14
  }>;
15
15
  export declare const isScheme: (value: string | null) => value is Scheme;
16
- export declare const ThemerProvider: React.FC<{
16
+ type ThemerProviderBaseProps = {
17
17
  key?: string;
18
18
  backend?: Backend;
19
19
  initialScheme?: Scheme;
20
20
  children: React.ReactNode;
21
- }>;
21
+ };
22
+ type ThemerProviderControlledProps = ThemerProviderBaseProps & {
23
+ scheme: Scheme;
24
+ setScheme(scheme: Scheme): void;
25
+ };
26
+ type ThemerProviderUncontrolledProps = ThemerProviderBaseProps & {
27
+ scheme?: undefined;
28
+ setScheme?: undefined;
29
+ };
30
+ type ThemerProviderProps = ThemerProviderControlledProps | ThemerProviderUncontrolledProps;
31
+ export declare const ThemerProvider: React.FC<ThemerProviderProps>;
22
32
  export declare const useThemer: () => {
23
33
  theme: {
24
34
  fonts: {
package/dist/esm/Themer/useThemer.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useThemer.d.ts","sourceRoot":"","sources":["../../../src/Themer/useThemer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,MAAM,OAAO,CAAC;AAEf,OAAO,EAAkB,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAIzD,eAAO,MAAM,WAAW,eAMvB,CAAC;AAKF,KAAK,OAAO,GAAG;IACb,GAAG,IAAI,MAAM,GAAG,IAAI,CAAC;IACrB,GAAG,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B,CAAC;AAcF,eAAO,MAAM,YAAY;UACjB,MAAM;WACL,KAAK;YACJ,MAAM;sBACI,MAAM,GAAG,IAAI;oBACf,IAAI;EAOpB,CAAC;AAEH,eAAO,MAAM,QAAQ,GAAI,OAAO,MAAM,GAAG,IAAI,KAAG,KAAK,IAAI,MACR,CAAC;AAElD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC;IACpC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CA8BA,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;wBAlDF,MAAM,KAAG,IAAI;wBACf,IAAI;CAqDrB,CAAC"}
1
+ {"version":3,"file":"useThemer.d.ts","sourceRoot":"","sources":["../../../src/Themer/useThemer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,MAAM,OAAO,CAAC;AAEf,OAAO,EAAkB,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAIzD,eAAO,MAAM,WAAW,eAMvB,CAAC;AAKF,KAAK,OAAO,GAAG;IACb,GAAG,IAAI,MAAM,GAAG,IAAI,CAAC;IACrB,GAAG,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B,CAAC;AAcF,eAAO,MAAM,YAAY;UACjB,MAAM;WACL,KAAK;YACJ,MAAM;sBACI,MAAM,GAAG,IAAI;oBACf,IAAI;EAOpB,CAAC;AAEH,eAAO,MAAM,QAAQ,GAAI,OAAO,MAAM,GAAG,IAAI,KAAG,KAAK,IAAI,MACR,CAAC;AAElD,KAAK,uBAAuB,GAAG;IAC7B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,KAAK,6BAA6B,GAAG,uBAAuB,GAAG;IAC7D,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;CACjC,CAAC;AAEF,KAAK,+BAA+B,GAAG,uBAAuB,GAAG;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB,CAAC;AAEF,KAAK,mBAAmB,GACpB,6BAA6B,GAC7B,+BAA+B,CAAC;AAEpC,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAiDxD,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;wBArFF,MAAM,KAAG,IAAI;wBACf,IAAI;CAwFrB,CAAC"}
package/dist/esm/Themer/useThemer.js CHANGED
@@ -32,16 +32,29 @@ export const ThemeContext = createContext({
32
32
  toggleScheme: () => { },
33
33
  });
34
34
  export const isScheme = (value) => !!value && Object.keys(SCHEMES).includes(value);
35
- export const ThemerProvider = ({ children, initialScheme = DEFAULT_SCHEME, backend = DEFAULT_BACKEND, }) => {
36
- const [scheme, setScheme] = useState(initialScheme);
35
+ export const ThemerProvider = ({ children, initialScheme = DEFAULT_SCHEME, backend = DEFAULT_BACKEND, scheme: controlledScheme, setScheme: controlledSetScheme, }) => {
36
+ const isControlled = controlledScheme !== undefined;
37
+ const [uncontrolledScheme, setUncontrolledScheme] = useState(initialScheme);
38
+ const scheme = controlledScheme ?? uncontrolledScheme;
37
39
  useEffect(() => {
38
- setScheme(backend.get() ?? initialScheme);
39
- }, [backend, initialScheme]);
40
+ if (isControlled)
41
+ return;
42
+ setUncontrolledScheme(backend.get() ?? initialScheme);
43
+ }, [backend, initialScheme, isControlled]);
44
+ const setScheme = useCallback((nextScheme) => {
45
+ if (isControlled) {
46
+ controlledSetScheme?.(nextScheme);
47
+ return;
48
+ }
49
+ setUncontrolledScheme(nextScheme);
50
+ }, [controlledSetScheme, isControlled]);
40
51
  const theme = useMemo(() => ({ ...THEME, scheme, colors: SCHEMES[scheme] }), [scheme]);
41
- const toggleScheme = useCallback(() => setScheme((prevScheme) => (prevScheme === "dark" ? "light" : "dark")), []);
52
+ const toggleScheme = useCallback(() => setScheme(scheme === "dark" ? "light" : "dark"), [scheme, setScheme]);
42
53
  useUpdateEffect(() => {
54
+ if (isControlled)
55
+ return;
43
56
  backend.set(scheme);
44
- }, [backend, scheme]);
57
+ }, [backend, isControlled, scheme]);
45
58
  return (_jsx(ThemeContext.Provider, { value: { theme, scheme, setScheme, toggleScheme }, children: children }));
46
59
  };
47
60
  export const useThemer = () => {
package/dist/esm/Themer/useThemer.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useThemer.js","sourceRoot":"","sources":["../../../src/Themer/useThemer.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"useThemer.js","sourceRoot":"","sources":["../../../src/Themer/useThemer.tsx"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@auspices/eos",
3
- "version": "6.0.0",
3
+ "version": "6.1.0",
4
4
  "main": "./dist/cjs/client.js",
5
5
  "module": "./dist/esm/client.js",
6
6
  "types": "./dist/esm/client.d.ts",
@@ -35,7 +35,8 @@
35
35
  "dist"
36
36
  ],
37
37
  "workspaces": [
38
- "examples/next-minimal"
38
+ "examples/next-minimal",
39
+ "examples/next-pages-next-themes"
39
40
  ],
40
41
  "repository": {
41
42
  "type": "git",
@@ -55,8 +56,9 @@
55
56
  "semantic-release": "semantic-release",
56
57
  "start": "yarn storybook",
57
58
  "storybook": "storybook dev -p 6006",
59
+ "test": "vitest run",
58
60
  "type:check": "tsc -p tsconfig.json --noEmit",
59
- "verify:release": "yarn type:check && yarn lint && yarn build && yarn workspace eos-next-minimal build",
61
+ "verify:release": "yarn type:check && yarn lint && yarn build && yarn workspace eos-next-minimal build && yarn workspace eos-next-pages-next-themes build",
60
62
  "unlink-all": "yalc remove --all && yarn --check-files"
61
63
  },
62
64
  "peerDependencies": {
@@ -85,6 +87,9 @@
85
87
  "@storybook/addon-webpack5-compiler-swc": "^2.1.0",
86
88
  "@storybook/react": "^8.6.4",
87
89
  "@storybook/react-webpack5": "^8.6.4",
90
+ "@testing-library/dom": "^10.4.0",
91
+ "@testing-library/jest-dom": "^6.8.0",
92
+ "@testing-library/react": "^16.3.0",
88
93
  "@types/node": "22.13.9",
89
94
  "@types/react-dom": "19.0.4",
90
95
  "@types/styled-components": "5.1.34",
@@ -96,6 +101,7 @@
96
101
  "eslint": "9.21.0",
97
102
  "eslint-plugin-react": "7.37.4",
98
103
  "eslint-plugin-react-hooks": "5.2.0",
104
+ "jsdom": "^26.1.0",
99
105
  "prettier": "3.5.3",
100
106
  "react": "19.0.0",
101
107
  "react-dom": "19.0.0",
@@ -104,7 +110,8 @@
104
110
  "storybook-states": "1.2.0",
105
111
  "styled-components": "6.1.15",
106
112
  "ts-node": "10.9.2",
107
- "typescript": "5.8.2"
113
+ "typescript": "5.8.2",
114
+ "vitest": "^3.2.4"
108
115
  },
109
116
  "publishConfig": {
110
117
  "access": "public",