hey-pharmacist-ecommerce 1.1.39 → 1.1.41
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.
- package/dist/index.js +37 -11
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +38 -12
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/providers/ThemeProvider.tsx +48 -20
- package/src/styles/globals.css +43 -44
package/dist/index.js
CHANGED
|
@@ -236,29 +236,55 @@ function useTheme() {
|
|
|
236
236
|
}
|
|
237
237
|
return context;
|
|
238
238
|
}
|
|
239
|
+
var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React10.useLayoutEffect : React10.useEffect;
|
|
239
240
|
function ThemeProvider({ config, children }) {
|
|
240
|
-
|
|
241
|
+
const cssVariables = React10__default.default.useMemo(() => {
|
|
241
242
|
const primaryShades = generateColorShades(config.colors.primary);
|
|
242
243
|
const secondaryShades = generateColorShades(config.colors.secondary);
|
|
243
244
|
const accentShades = generateColorShades(config.colors.accent);
|
|
245
|
+
const vars = [];
|
|
246
|
+
vars.push(`--hp-primary: ${config.colors.primary}`);
|
|
247
|
+
vars.push(`--hp-primary-dark: ${config.colors.primaryDark}`);
|
|
248
|
+
vars.push(`--hp-secondary: ${config.colors.secondary}`);
|
|
249
|
+
vars.push(`--hp-accent: ${config.colors.accent}`);
|
|
250
|
+
vars.push(`--hp-accent-dark: ${config.colors.accentDark}`);
|
|
251
|
+
vars.push(`--hp-text-muted: ${config.colors.textMuted}`);
|
|
252
|
+
Object.entries(primaryShades).forEach(([shade, rgb]) => {
|
|
253
|
+
vars.push(`--hp-primary-${shade}: ${rgb}`);
|
|
254
|
+
});
|
|
255
|
+
Object.entries(secondaryShades).forEach(([shade, rgb]) => {
|
|
256
|
+
vars.push(`--hp-secondary-${shade}: ${rgb}`);
|
|
257
|
+
});
|
|
258
|
+
Object.entries(accentShades).forEach(([shade, rgb]) => {
|
|
259
|
+
vars.push(`--hp-accent-${shade}: ${rgb}`);
|
|
260
|
+
});
|
|
261
|
+
return vars.join("; ");
|
|
262
|
+
}, [config.colors]);
|
|
263
|
+
useIsomorphicLayoutEffect(() => {
|
|
244
264
|
const root = document.documentElement;
|
|
265
|
+
const primaryShades = generateColorShades(config.colors.primary);
|
|
266
|
+
const secondaryShades = generateColorShades(config.colors.secondary);
|
|
267
|
+
const accentShades = generateColorShades(config.colors.accent);
|
|
268
|
+
root.style.setProperty("--hp-primary", config.colors.primary);
|
|
269
|
+
root.style.setProperty("--hp-primary-dark", config.colors.primaryDark);
|
|
270
|
+
root.style.setProperty("--hp-secondary", config.colors.secondary);
|
|
271
|
+
root.style.setProperty("--hp-accent", config.colors.accent);
|
|
272
|
+
root.style.setProperty("--hp-accent-dark", config.colors.accentDark);
|
|
273
|
+
root.style.setProperty("--hp-text-muted", config.colors.textMuted);
|
|
245
274
|
Object.entries(primaryShades).forEach(([shade, rgb]) => {
|
|
246
|
-
root.style.setProperty(`--
|
|
275
|
+
root.style.setProperty(`--hp-primary-${shade}`, rgb);
|
|
247
276
|
});
|
|
248
277
|
Object.entries(secondaryShades).forEach(([shade, rgb]) => {
|
|
249
|
-
root.style.setProperty(`--
|
|
278
|
+
root.style.setProperty(`--hp-secondary-${shade}`, rgb);
|
|
250
279
|
});
|
|
251
280
|
Object.entries(accentShades).forEach(([shade, rgb]) => {
|
|
252
|
-
root.style.setProperty(`--
|
|
281
|
+
root.style.setProperty(`--hp-accent-${shade}`, rgb);
|
|
253
282
|
});
|
|
254
|
-
root.style.setProperty("--color-primary", config.colors.primary);
|
|
255
|
-
root.style.setProperty("--color-primary-dark", config.colors.primaryDark);
|
|
256
|
-
root.style.setProperty("--color-secondary", config.colors.secondary);
|
|
257
|
-
root.style.setProperty("--color-accent", config.colors.accent);
|
|
258
|
-
root.style.setProperty("--color-accent-dark", config.colors.accentDark);
|
|
259
|
-
root.style.setProperty("--color-text-muted", config.colors.textMuted);
|
|
260
283
|
}, [config]);
|
|
261
|
-
return /* @__PURE__ */ jsxRuntime.
|
|
284
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(ThemeContext.Provider, { value: { config }, children: [
|
|
285
|
+
/* @__PURE__ */ jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: `:root { ${cssVariables} }` } }),
|
|
286
|
+
children
|
|
287
|
+
] });
|
|
262
288
|
}
|
|
263
289
|
|
|
264
290
|
// src/providers/AuthProvider.tsx
|