@vueless/nuxt 1.2.0 → 1.2.1-beta.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 (4) hide show
  1. package/dist/module.json +1 -1
  2. package/dist/package.json +2 -2
  3. package/dist/runtime/plugin.js +51 -45
  4. package/package.json +2 -2
package/dist/module.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "compatibility": {
5
5
  "nuxt": ">=3.13.0"
6
6
  },
7
- "version": "1.2.0",
7
+ "version": "1.2.1-beta.0",
8
8
  "builder": {
9
9
  "@nuxt/module-builder": "1.0.2",
10
10
  "unbuild": "3.6.1"
package/dist/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vueless/nuxt",
3
- "version": "1.2.0",
3
+ "version": "1.2.1-beta.0",
4
4
  "description": "Nuxt Styleless UI Component Library, powered by Tailwind CSS.",
5
5
  "author": "Johnny Grid <hello@vueless.com> (https://vueless.com)",
6
6
  "homepage": "https://vueless.com",
@@ -30,7 +30,7 @@
30
30
  "sb:preview": "vite preview --host --outDir=storybook-static"
31
31
  },
32
32
  "dependencies": {
33
- "vueless": "^1.2.4"
33
+ "vueless": "^1.2.5-beta.4"
34
34
  },
35
35
  "devDependencies": {
36
36
  "@material-symbols/svg-500": "^0.34.1",
package/dist/runtime/plugin.js CHANGED
@@ -1,29 +1,30 @@
1
1
  import { defineNuxtPlugin, useRuntimeConfig } from "#app";
2
- import { createVueless, createVueI18nAdapter, setTheme, ColorMode, vClickOutside, vTooltip, vuelessConfig } from "vueless";
2
+ import {
3
+ getTheme,
4
+ setTheme,
5
+ ColorMode,
6
+ createVueless,
7
+ createVueI18nAdapter,
8
+ normalizeThemeConfig,
9
+ vClickOutside,
10
+ vTooltip
11
+ } from "vueless";
3
12
  import {
4
13
  TEXT,
5
14
  OUTLINE,
6
15
  ROUNDING,
7
16
  PRIMARY_COLOR,
8
17
  NEUTRAL_COLOR,
18
+ AUTO_MODE_KEY,
9
19
  COLOR_MODE_KEY,
20
+ LETTER_SPACING,
10
21
  DARK_MODE_CLASS,
11
22
  LIGHT_MODE_CLASS,
12
23
  DISABLED_OPACITY
13
24
  } from "vueless/constants";
14
- function parseCookies(cookieHeader) {
15
- if (!cookieHeader) return {};
16
- return cookieHeader.split(";").reduce((acc, cookie) => {
17
- const [key, value] = cookie.trim().split("=");
18
- if (key) {
19
- acc[key] = value || "";
20
- }
21
- return acc;
22
- }, {});
23
- }
24
25
  export default defineNuxtPlugin((_nuxtApp) => {
25
26
  const vuelessOptions = {};
26
- if (import.meta.env.PROD) {
27
+ if (!import.meta.env.DEV) {
27
28
  vuelessOptions.config = useRuntimeConfig().public.vueless;
28
29
  }
29
30
  if ("$i18n" in _nuxtApp) {
@@ -38,42 +39,47 @@ export default defineNuxtPlugin((_nuxtApp) => {
38
39
  if (import.meta.server) {
39
40
  const event = _nuxtApp.ssrContext?.event;
40
41
  const cookies = parseCookies(event?.node.req.headers.cookie);
41
- const primary = cookies?.[`vl-${PRIMARY_COLOR}`] ?? void 0;
42
- const neutral = cookies?.[`vl-${NEUTRAL_COLOR}`] ?? void 0;
43
- const textXs = Number(cookies?.[`vl-${TEXT}-xs`]);
44
- const textSm = Number(cookies?.[`vl-${TEXT}-sm`]);
45
- const textMd = Number(cookies?.[`vl-${TEXT}-md`]);
46
- const textLg = Number(cookies?.[`vl-${TEXT}-lg`]);
47
- const text = {
48
- xs: !Number.isNaN(textXs) ? textXs : void 0,
49
- sm: !Number.isNaN(textSm) ? textSm : void 0,
50
- md: !Number.isNaN(textMd) ? textMd : void 0,
51
- lg: !Number.isNaN(textLg) ? textLg : void 0
52
- };
53
- const outlineSm = Number(cookies?.[`vl-${OUTLINE}-sm`]);
54
- const outlineMd = Number(cookies?.[`vl-${OUTLINE}-md`]);
55
- const outlineLg = Number(cookies?.[`vl-${OUTLINE}-lg`]);
56
- const outline = {
57
- sm: !Number.isNaN(outlineSm) ? outlineSm : void 0,
58
- md: !Number.isNaN(outlineMd) ? outlineMd : void 0,
59
- lg: !Number.isNaN(outlineLg) ? outlineLg : void 0
60
- };
61
- const roundingSm = Number(cookies?.[`vl-${ROUNDING}-sm`]);
62
- const roundingMd = Number(cookies?.[`vl-${ROUNDING}-md`]);
63
- const roundingLg = Number(cookies?.[`vl-${ROUNDING}-lg`]);
64
- const rounding = {
65
- sm: !Number.isNaN(roundingSm) ? roundingSm : void 0,
66
- md: !Number.isNaN(roundingMd) ? roundingMd : void 0,
67
- lg: !Number.isNaN(roundingLg) ? roundingLg : void 0
68
- };
69
- const disabledOpacityValue = Number(cookies?.[`vl-${DISABLED_OPACITY}`]);
70
- const disabledOpacity = !Number.isNaN(disabledOpacityValue) ? disabledOpacityValue : void 0;
71
- const colorMode = cookies?.[COLOR_MODE_KEY] || vuelessConfig.colorMode || ColorMode.Light;
72
- const themeRootVariables = setTheme({ primary, neutral, text, outline, rounding, disabledOpacity, colorMode });
73
- const colorModeClass = colorMode === ColorMode.Dark ? DARK_MODE_CLASS : LIGHT_MODE_CLASS;
42
+ const normalizedThemeParams = normalizeThemeConfig({
43
+ colorMode: cookies?.[COLOR_MODE_KEY],
44
+ isColorModeAuto: cookies?.[AUTO_MODE_KEY],
45
+ primary: cookies?.[`vl-${PRIMARY_COLOR}`],
46
+ neutral: cookies?.[`vl-${NEUTRAL_COLOR}`],
47
+ text: {
48
+ xs: cookies?.[`vl-${TEXT}-xs`],
49
+ sm: cookies?.[`vl-${TEXT}-sm`],
50
+ md: cookies?.[`vl-${TEXT}-md`],
51
+ lg: cookies?.[`vl-${TEXT}-lg`]
52
+ },
53
+ outline: {
54
+ sm: cookies?.[`vl-${OUTLINE}-sm`],
55
+ md: cookies?.[`vl-${OUTLINE}-md`],
56
+ lg: cookies?.[`vl-${OUTLINE}-lg`]
57
+ },
58
+ rounding: {
59
+ sm: cookies?.[`vl-${ROUNDING}-sm`],
60
+ md: cookies?.[`vl-${ROUNDING}-md`],
61
+ lg: cookies?.[`vl-${ROUNDING}-lg`]
62
+ },
63
+ disabledOpacity: cookies?.[`vl-${DISABLED_OPACITY}`],
64
+ letterSpacing: cookies?.[`vl-${LETTER_SPACING}`]
65
+ });
66
+ console.log("normalizedThemeParams", normalizedThemeParams);
67
+ const theme = getTheme(normalizedThemeParams);
68
+ const themeRootVariables = setTheme(theme);
69
+ const colorModeClass = theme.colorMode === ColorMode.Dark ? DARK_MODE_CLASS : LIGHT_MODE_CLASS;
74
70
  _nuxtApp.ssrContext?.head.push({
75
71
  style: [{ innerHTML: themeRootVariables }],
76
72
  htmlAttrs: { class: colorModeClass }
77
73
  });
78
74
  }
79
75
  });
76
+ function parseCookies(cookieHeader) {
77
+ if (!cookieHeader) return {};
78
+ return cookieHeader.split(";").reduce((acc, cookie) => {
79
+ const [key, value] = cookie.trim().split("=");
80
+ if (key) {
81
+ acc[key] = value || "";
82
+ }
83
+ return acc;
84
+ }, {});
85
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vueless/nuxt",
3
- "version": "1.2.0",
3
+ "version": "1.2.1-beta.0",
4
4
  "description": "Nuxt Styleless UI Component Library, powered by Tailwind CSS.",
5
5
  "author": "Johnny Grid <hello@vueless.com> (https://vueless.com)",
6
6
  "homepage": "https://vueless.com",
@@ -30,7 +30,7 @@
30
30
  "sb:preview": "vite preview --host --outDir=storybook-static"
31
31
  },
32
32
  "dependencies": {
33
- "vueless": "^1.2.4"
33
+ "vueless": "^1.2.5-beta.4"
34
34
  },
35
35
  "devDependencies": {
36
36
  "@material-symbols/svg-500": "^0.34.1",