@strands.gg/accui 2.2.1 → 2.2.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.
@@ -1 +1 @@
1
- "use strict";const t=require("@nuxt/kit");var s="undefined"!=typeof document?document.currentScript:null;const e=t.defineNuxtModule({meta:{name:"@strands.gg/accui/nuxt",configKey:"strandsAuth",compatibility:{nuxt:"^3.0.0"}},defaults:{baseUrl:"https://your-api.example.com",accentColor:"#EA00A8",redirectUrl:"/",onSignInUrl:"/dashboard",onSignOutUrl:"/",autoRefresh:1,refreshInterval:4,protectedRoutes:[],guestOnlyRoutes:["/auth","/login","/register"],devMode:0,styles:1,supportEmail:"",oauth2RedirectUrl:""},async setup(e,n){const r=t.createResolver("undefined"==typeof document?require("url").pathToFileURL(__filename).href:s&&"SCRIPT"===s.tagName.toUpperCase()&&s.src||new URL("nuxt/module.cjs.js",document.baseURI).href);if(n.options.runtimeConfig.public=n.options.runtimeConfig.public||{},n.options.runtimeConfig.public.strandsAuth={...e,styles:0!=e.styles},0!=e.styles&&n.options.css.push("@strands.gg/accui/style.css"),e.accentColor&&"#EA00A8"!==e.accentColor){const t=e.accentColor,s=`\n :root {\n --strands-accent: ${t};\n --accui-strands-accent: ${t};\n --accui-strands-50: color-mix(in srgb, ${t} 10%, white);\n --accui-strands-100: color-mix(in srgb, ${t} 20%, white);\n --accui-strands-200: color-mix(in srgb, ${t} 30%, white);\n --accui-strands-300: color-mix(in srgb, ${t} 40%, white);\n --accui-strands-400: color-mix(in srgb, ${t} 70%, white);\n --accui-strands-500: ${t};\n --accui-strands-600: color-mix(in srgb, ${t} 85%, black);\n --accui-strands-700: color-mix(in srgb, ${t} 70%, black);\n --accui-strands-800: color-mix(in srgb, ${t} 55%, black);\n --accui-strands-900: color-mix(in srgb, ${t} 40%, black);\n --accui-strands-950: color-mix(in srgb, ${t} 25%, black);\n }\n `;n.options.app.head=n.options.app.head||{},n.options.app.head.style=n.options.app.head.style||[],n.options.app.head.style.push({children:s,type:"text/css"})}const a="es.js";t.addPlugin({src:r.resolve(`./runtime/plugin.client.${a}`),mode:"client"}),t.addPlugin({src:r.resolve(`./runtime/plugin.server.${a}`),mode:"server"}),t.addPlugin({src:r.resolve(`./runtime/plugins/auth-interceptor.client.${a}`),mode:"client"}),t.addRouteMiddleware({name:"auth",path:r.resolve(`./runtime/middleware/auth.global.${a}`),global:1}),n.hook("pages:extend",t=>{}),t.addImports([{name:"useStrandsAuth",as:"useStrandsAuth",from:r.resolve(`./runtime/composables/useStrandsAuth.${a}`)},{name:"useAuthUser",as:"useAuthUser",from:r.resolve(`./runtime/composables/useStrandsAuth.${a}`)},{name:"useAuthState",as:"useAuthState",from:r.resolve(`./runtime/composables/useStrandsAuth.${a}`)},{name:"useAuthenticatedFetch",as:"useAuthenticatedFetch",from:r.resolve(`./runtime/composables/useAuthenticatedFetch.${a}`)}]);const i=["StrandsAuth","StrandsSignIn","StrandsSignUp","StrandsCompleteSignUp","StrandsUserProfile","StrandsUserButton","StrandsPasswordReset","StrandsMFASetup","StrandsConfigProvider","SignedIn","SignedOut","StrandsLogo","StrandsSecuredFooter","StrandsUiAlert","StrandsUiButton","StrandsUiCard","StrandsUiInput","StrandsUiLink","StrandsUiTabs","StrandsUiLoader"];for(const s of i)t.addComponent({name:s,export:s,filePath:"@strands.gg/accui"});n.hook("prepare:types",t=>{t.references.push({types:"@strands.gg/auth-nuxt"})})}});module.exports=e;
1
+ "use strict";const t=require("@nuxt/kit");var n="undefined"!=typeof document?document.currentScript:null;const r=t.defineNuxtModule({meta:{name:"@strands.gg/accui/nuxt",configKey:"strandsAuth",compatibility:{nuxt:"^3.0.0"}},defaults:{baseUrl:"https://your-api.example.com",accentColor:"#EA00A8",redirectUrl:"/",onSignInUrl:"/dashboard",onSignOutUrl:"/",autoRefresh:1,refreshInterval:4,protectedRoutes:[],guestOnlyRoutes:["/auth","/login","/register"],devMode:0,styles:1,supportEmail:"",oauth2RedirectUrl:""},async setup(r,s){const a=t.createResolver("undefined"==typeof document?require("url").pathToFileURL(__filename).href:n&&"SCRIPT"===n.tagName.toUpperCase()&&n.src||new URL("nuxt/module.cjs.js",document.baseURI).href);if(s.options.runtimeConfig.public=s.options.runtimeConfig.public||{},s.options.runtimeConfig.public.strandsAuth={...r,styles:0!=r.styles},0!=r.styles&&s.options.css.push("@strands.gg/accui/style.css"),r.accentColor&&"#EA00A8"!==r.accentColor){const t=r.accentColor,n=`\n :root {\n --strands-accent: ${t} !important;\n --accui-strands-accent: ${t} !important;\n --accui-strands-50: color-mix(in srgb, ${t} 10%, white) !important;\n --accui-strands-100: color-mix(in srgb, ${t} 20%, white) !important;\n --accui-strands-200: color-mix(in srgb, ${t} 30%, white) !important;\n --accui-strands-300: color-mix(in srgb, ${t} 40%, white) !important;\n --accui-strands-400: color-mix(in srgb, ${t} 70%, white) !important;\n --accui-strands-500: ${t} !important;\n --accui-strands-600: color-mix(in srgb, ${t} 85%, black) !important;\n --accui-strands-700: color-mix(in srgb, ${t} 70%, black) !important;\n --accui-strands-800: color-mix(in srgb, ${t} 55%, black) !important;\n --accui-strands-900: color-mix(in srgb, ${t} 40%, black) !important;\n --accui-strands-950: color-mix(in srgb, ${t} 25%, black) !important;\n }\n [data-theme="dark"] {\n --accui-strands-accent: ${t} !important;\n --accui-strands-50: color-mix(in srgb, ${t} 10%, white) !important;\n --accui-strands-100: color-mix(in srgb, ${t} 20%, white) !important;\n --accui-strands-200: color-mix(in srgb, ${t} 30%, white) !important;\n --accui-strands-300: color-mix(in srgb, ${t} 40%, white) !important;\n --accui-strands-400: color-mix(in srgb, ${t} 70%, white) !important;\n --accui-strands-500: ${t} !important;\n --accui-strands-600: color-mix(in srgb, ${t} 85%, black) !important;\n --accui-strands-700: color-mix(in srgb, ${t} 70%, black) !important;\n --accui-strands-800: color-mix(in srgb, ${t} 55%, black) !important;\n --accui-strands-900: color-mix(in srgb, ${t} 40%, black) !important;\n --accui-strands-950: color-mix(in srgb, ${t} 25%, black) !important;\n }\n `;s.options.app.head=s.options.app.head||{},s.options.app.head.style=s.options.app.head.style||[],s.options.app.head.style.unshift({children:n,type:"text/css",key:"strands-accent-override"})}const i="es.js";t.addPlugin({src:a.resolve(`./runtime/plugin.client.${i}`),mode:"client"}),t.addPlugin({src:a.resolve(`./runtime/plugin.server.${i}`),mode:"server"}),t.addPlugin({src:a.resolve(`./runtime/plugins/auth-interceptor.client.${i}`),mode:"client"}),t.addRouteMiddleware({name:"auth",path:a.resolve(`./runtime/middleware/auth.global.${i}`),global:1}),s.hook("pages:extend",t=>{}),t.addImports([{name:"useStrandsAuth",as:"useStrandsAuth",from:a.resolve(`./runtime/composables/useStrandsAuth.${i}`)},{name:"useAuthUser",as:"useAuthUser",from:a.resolve(`./runtime/composables/useStrandsAuth.${i}`)},{name:"useAuthState",as:"useAuthState",from:a.resolve(`./runtime/composables/useStrandsAuth.${i}`)},{name:"useAuthenticatedFetch",as:"useAuthenticatedFetch",from:a.resolve(`./runtime/composables/useAuthenticatedFetch.${i}`)}]);const e=["StrandsAuth","StrandsSignIn","StrandsSignUp","StrandsCompleteSignUp","StrandsUserProfile","StrandsUserButton","StrandsPasswordReset","StrandsMFASetup","StrandsConfigProvider","SignedIn","SignedOut","StrandsLogo","StrandsSecuredFooter","StrandsUiAlert","StrandsUiButton","StrandsUiCard","StrandsUiInput","StrandsUiLink","StrandsUiTabs","StrandsUiLoader"];for(const n of e)t.addComponent({name:n,export:n,filePath:"@strands.gg/accui"});s.hook("prepare:types",t=>{t.references.push({types:"@strands.gg/auth-nuxt"})})}});module.exports=r;
@@ -37,26 +37,41 @@ const module = defineNuxtModule({
37
37
  const accentColor = options.accentColor;
38
38
  const cssVariables = `
39
39
  :root {
40
- --strands-accent: ${accentColor};
41
- --accui-strands-accent: ${accentColor};
42
- --accui-strands-50: color-mix(in srgb, ${accentColor} 10%, white);
43
- --accui-strands-100: color-mix(in srgb, ${accentColor} 20%, white);
44
- --accui-strands-200: color-mix(in srgb, ${accentColor} 30%, white);
45
- --accui-strands-300: color-mix(in srgb, ${accentColor} 40%, white);
46
- --accui-strands-400: color-mix(in srgb, ${accentColor} 70%, white);
47
- --accui-strands-500: ${accentColor};
48
- --accui-strands-600: color-mix(in srgb, ${accentColor} 85%, black);
49
- --accui-strands-700: color-mix(in srgb, ${accentColor} 70%, black);
50
- --accui-strands-800: color-mix(in srgb, ${accentColor} 55%, black);
51
- --accui-strands-900: color-mix(in srgb, ${accentColor} 40%, black);
52
- --accui-strands-950: color-mix(in srgb, ${accentColor} 25%, black);
40
+ --strands-accent: ${accentColor} !important;
41
+ --accui-strands-accent: ${accentColor} !important;
42
+ --accui-strands-50: color-mix(in srgb, ${accentColor} 10%, white) !important;
43
+ --accui-strands-100: color-mix(in srgb, ${accentColor} 20%, white) !important;
44
+ --accui-strands-200: color-mix(in srgb, ${accentColor} 30%, white) !important;
45
+ --accui-strands-300: color-mix(in srgb, ${accentColor} 40%, white) !important;
46
+ --accui-strands-400: color-mix(in srgb, ${accentColor} 70%, white) !important;
47
+ --accui-strands-500: ${accentColor} !important;
48
+ --accui-strands-600: color-mix(in srgb, ${accentColor} 85%, black) !important;
49
+ --accui-strands-700: color-mix(in srgb, ${accentColor} 70%, black) !important;
50
+ --accui-strands-800: color-mix(in srgb, ${accentColor} 55%, black) !important;
51
+ --accui-strands-900: color-mix(in srgb, ${accentColor} 40%, black) !important;
52
+ --accui-strands-950: color-mix(in srgb, ${accentColor} 25%, black) !important;
53
+ }
54
+ [data-theme="dark"] {
55
+ --accui-strands-accent: ${accentColor} !important;
56
+ --accui-strands-50: color-mix(in srgb, ${accentColor} 10%, white) !important;
57
+ --accui-strands-100: color-mix(in srgb, ${accentColor} 20%, white) !important;
58
+ --accui-strands-200: color-mix(in srgb, ${accentColor} 30%, white) !important;
59
+ --accui-strands-300: color-mix(in srgb, ${accentColor} 40%, white) !important;
60
+ --accui-strands-400: color-mix(in srgb, ${accentColor} 70%, white) !important;
61
+ --accui-strands-500: ${accentColor} !important;
62
+ --accui-strands-600: color-mix(in srgb, ${accentColor} 85%, black) !important;
63
+ --accui-strands-700: color-mix(in srgb, ${accentColor} 70%, black) !important;
64
+ --accui-strands-800: color-mix(in srgb, ${accentColor} 55%, black) !important;
65
+ --accui-strands-900: color-mix(in srgb, ${accentColor} 40%, black) !important;
66
+ --accui-strands-950: color-mix(in srgb, ${accentColor} 25%, black) !important;
53
67
  }
54
68
  `;
55
69
  nuxt.options.app.head = nuxt.options.app.head || {};
56
70
  nuxt.options.app.head.style = nuxt.options.app.head.style || [];
57
- nuxt.options.app.head.style.push({
71
+ nuxt.options.app.head.style.unshift({
58
72
  children: cssVariables,
59
- type: "text/css"
73
+ type: "text/css",
74
+ key: "strands-accent-override"
60
75
  });
61
76
  }
62
77
  const ext = "es.js";
@@ -1 +1 @@
1
- "use strict";const t=require("@nuxt/kit");var s="undefined"!=typeof document?document.currentScript:null;const e=t.defineNuxtModule({meta:{name:"@strands.gg/accui/nuxt-v4",configKey:"strandsAuth",compatibility:{nuxt:"^4.0.0"}},defaults:{baseUrl:"https://your-api.example.com",accentColor:"#EA00A8",redirectUrl:"/",onSignInUrl:"/dashboard",onSignOutUrl:"/",autoRefresh:1,refreshInterval:4,protectedRoutes:[],guestOnlyRoutes:["/auth","/login","/register"],devMode:0,styles:1,supportEmail:"",oauth2RedirectUrl:""},async setup(e,n){const r=t.createResolver("undefined"==typeof document?require("url").pathToFileURL(__filename).href:s&&"SCRIPT"===s.tagName.toUpperCase()&&s.src||new URL("nuxt-v4/module.cjs.js",document.baseURI).href);n.options.runtimeConfig.public=n.options.runtimeConfig.public||{};const a={...e,styles:0!=e.styles};if(n.options.runtimeConfig.public.strandsAuth=a,n.options.appConfig.strandsAuth=a,0!=e.styles&&n.options.css.push("@strands.gg/accui/style.css"),e.accentColor&&"#EA00A8"!==e.accentColor){const t=e.accentColor,s=`\n :root {\n --strands-accent: ${t};\n --accui-strands-accent: ${t};\n --accui-strands-50: color-mix(in srgb, ${t} 10%, white);\n --accui-strands-100: color-mix(in srgb, ${t} 20%, white);\n --accui-strands-200: color-mix(in srgb, ${t} 30%, white);\n --accui-strands-300: color-mix(in srgb, ${t} 40%, white);\n --accui-strands-400: color-mix(in srgb, ${t} 70%, white);\n --accui-strands-500: ${t};\n --accui-strands-600: color-mix(in srgb, ${t} 85%, black);\n --accui-strands-700: color-mix(in srgb, ${t} 70%, black);\n --accui-strands-800: color-mix(in srgb, ${t} 55%, black);\n --accui-strands-900: color-mix(in srgb, ${t} 40%, black);\n --accui-strands-950: color-mix(in srgb, ${t} 25%, black);\n }\n `;n.options.app.head=n.options.app.head||{},n.options.app.head.style=n.options.app.head.style||[],n.options.app.head.style.push({children:s,type:"text/css"})}const u="es.js",i=r.resolve(`./runtime/plugin.client.${u}`),o=r.resolve(`./runtime/plugin.server.${u}`),c=r.resolve(`./runtime/middleware/auth.global.${u}`);t.addPlugin({src:i,mode:"client"}),t.addPlugin({src:o,mode:"server"}),t.addPlugin({src:r.resolve(`./runtime/plugins/auth-interceptor.client.${u}`),mode:"client"}),t.addRouteMiddleware({name:"auth",path:c,global:1}),t.addImports([{name:"useStrandsAuth",as:"useStrandsAuth",from:r.resolve(`./runtime/composables/useStrandsAuth.${u}`)},{name:"useAuthUser",as:"useAuthUser",from:r.resolve(`./runtime/composables/useStrandsAuth.${u}`)},{name:"useAuthState",as:"useAuthState",from:r.resolve(`./runtime/composables/useStrandsAuth.${u}`)},{name:"useAuthenticatedFetch",as:"useAuthenticatedFetch",from:r.resolve(`./runtime/composables/useAuthenticatedFetch.${u}`)}]);const d=["StrandsAuth","StrandsSignIn","StrandsSignUp","StrandsCompleteSignUp","StrandsUserProfile","StrandsUserButton","StrandsPasswordReset","StrandsMFASetup","StrandsConfigProvider","SignedIn","SignedOut","StrandsLogo","StrandsSecuredFooter","StrandsUiAlert","StrandsUiButton","StrandsUiCard","StrandsUiInput","StrandsUiLink","StrandsUiTabs","StrandsUiLoader"];for(const s of d)t.addComponent({name:s,export:s,filePath:"@strands.gg/accui"});n.hook("prepare:types",t=>{t.references.push({types:"@strands.gg/auth-nuxt-v4"}),t.declarations.push(`\n declare global {\n const useStrandsAuth: typeof import('${r.resolve("./runtime/composables/useStrandsAuth.d.ts")}')['useStrandsAuth']\n const useAuthUser: typeof import('${r.resolve("./runtime/composables/useStrandsAuth.d.ts")}')['useAuthUser']\n const useAuthState: typeof import('${r.resolve("./runtime/composables/useStrandsAuth.d.ts")}')['useAuthState']\n }\n `)})}});module.exports=e;
1
+ "use strict";const t=require("@nuxt/kit");var n="undefined"!=typeof document?document.currentScript:null;const s=t.defineNuxtModule({meta:{name:"@strands.gg/accui/nuxt-v4",configKey:"strandsAuth",compatibility:{nuxt:"^4.0.0"}},defaults:{baseUrl:"https://your-api.example.com",accentColor:"#EA00A8",redirectUrl:"/",onSignInUrl:"/dashboard",onSignOutUrl:"/",autoRefresh:1,refreshInterval:4,protectedRoutes:[],guestOnlyRoutes:["/auth","/login","/register"],devMode:0,styles:1,supportEmail:"",oauth2RedirectUrl:""},async setup(s,r){const a=t.createResolver("undefined"==typeof document?require("url").pathToFileURL(__filename).href:n&&"SCRIPT"===n.tagName.toUpperCase()&&n.src||new URL("nuxt-v4/module.cjs.js",document.baseURI).href);r.options.runtimeConfig.public=r.options.runtimeConfig.public||{};const e={...s,styles:0!=s.styles};if(r.options.runtimeConfig.public.strandsAuth=e,r.options.appConfig.strandsAuth=e,0!=s.styles&&r.options.css.push("@strands.gg/accui/style.css"),s.accentColor&&"#EA00A8"!==s.accentColor){const t=s.accentColor,n=`\n :root {\n --strands-accent: ${t} !important;\n --accui-strands-accent: ${t} !important;\n --accui-strands-50: color-mix(in srgb, ${t} 10%, white) !important;\n --accui-strands-100: color-mix(in srgb, ${t} 20%, white) !important;\n --accui-strands-200: color-mix(in srgb, ${t} 30%, white) !important;\n --accui-strands-300: color-mix(in srgb, ${t} 40%, white) !important;\n --accui-strands-400: color-mix(in srgb, ${t} 70%, white) !important;\n --accui-strands-500: ${t} !important;\n --accui-strands-600: color-mix(in srgb, ${t} 85%, black) !important;\n --accui-strands-700: color-mix(in srgb, ${t} 70%, black) !important;\n --accui-strands-800: color-mix(in srgb, ${t} 55%, black) !important;\n --accui-strands-900: color-mix(in srgb, ${t} 40%, black) !important;\n --accui-strands-950: color-mix(in srgb, ${t} 25%, black) !important;\n }\n [data-theme="dark"] {\n --accui-strands-accent: ${t} !important;\n --accui-strands-50: color-mix(in srgb, ${t} 10%, white) !important;\n --accui-strands-100: color-mix(in srgb, ${t} 20%, white) !important;\n --accui-strands-200: color-mix(in srgb, ${t} 30%, white) !important;\n --accui-strands-300: color-mix(in srgb, ${t} 40%, white) !important;\n --accui-strands-400: color-mix(in srgb, ${t} 70%, white) !important;\n --accui-strands-500: ${t} !important;\n --accui-strands-600: color-mix(in srgb, ${t} 85%, black) !important;\n --accui-strands-700: color-mix(in srgb, ${t} 70%, black) !important;\n --accui-strands-800: color-mix(in srgb, ${t} 55%, black) !important;\n --accui-strands-900: color-mix(in srgb, ${t} 40%, black) !important;\n --accui-strands-950: color-mix(in srgb, ${t} 25%, black) !important;\n }\n `;r.options.app.head=r.options.app.head||{},r.options.app.head.style=r.options.app.head.style||[],r.options.app.head.style.unshift({children:n,type:"text/css",key:"strands-accent-override"})}const i="es.js",o=a.resolve(`./runtime/plugin.client.${i}`),c=a.resolve(`./runtime/plugin.server.${i}`),u=a.resolve(`./runtime/middleware/auth.global.${i}`);t.addPlugin({src:o,mode:"client"}),t.addPlugin({src:c,mode:"server"}),t.addPlugin({src:a.resolve(`./runtime/plugins/auth-interceptor.client.${i}`),mode:"client"}),t.addRouteMiddleware({name:"auth",path:u,global:1}),t.addImports([{name:"useStrandsAuth",as:"useStrandsAuth",from:a.resolve(`./runtime/composables/useStrandsAuth.${i}`)},{name:"useAuthUser",as:"useAuthUser",from:a.resolve(`./runtime/composables/useStrandsAuth.${i}`)},{name:"useAuthState",as:"useAuthState",from:a.resolve(`./runtime/composables/useStrandsAuth.${i}`)},{name:"useAuthenticatedFetch",as:"useAuthenticatedFetch",from:a.resolve(`./runtime/composables/useAuthenticatedFetch.${i}`)}]);const d=["StrandsAuth","StrandsSignIn","StrandsSignUp","StrandsCompleteSignUp","StrandsUserProfile","StrandsUserButton","StrandsPasswordReset","StrandsMFASetup","StrandsConfigProvider","SignedIn","SignedOut","StrandsLogo","StrandsSecuredFooter","StrandsUiAlert","StrandsUiButton","StrandsUiCard","StrandsUiInput","StrandsUiLink","StrandsUiTabs","StrandsUiLoader"];for(const n of d)t.addComponent({name:n,export:n,filePath:"@strands.gg/accui"});r.hook("prepare:types",t=>{t.references.push({types:"@strands.gg/auth-nuxt-v4"}),t.declarations.push(`\n declare global {\n const useStrandsAuth: typeof import('${a.resolve("./runtime/composables/useStrandsAuth.d.ts")}')['useStrandsAuth']\n const useAuthUser: typeof import('${a.resolve("./runtime/composables/useStrandsAuth.d.ts")}')['useAuthUser']\n const useAuthState: typeof import('${a.resolve("./runtime/composables/useStrandsAuth.d.ts")}')['useAuthState']\n }\n `)})}});module.exports=s;
@@ -39,26 +39,41 @@ const module = defineNuxtModule({
39
39
  const accentColor = options.accentColor;
40
40
  const cssVariables = `
41
41
  :root {
42
- --strands-accent: ${accentColor};
43
- --accui-strands-accent: ${accentColor};
44
- --accui-strands-50: color-mix(in srgb, ${accentColor} 10%, white);
45
- --accui-strands-100: color-mix(in srgb, ${accentColor} 20%, white);
46
- --accui-strands-200: color-mix(in srgb, ${accentColor} 30%, white);
47
- --accui-strands-300: color-mix(in srgb, ${accentColor} 40%, white);
48
- --accui-strands-400: color-mix(in srgb, ${accentColor} 70%, white);
49
- --accui-strands-500: ${accentColor};
50
- --accui-strands-600: color-mix(in srgb, ${accentColor} 85%, black);
51
- --accui-strands-700: color-mix(in srgb, ${accentColor} 70%, black);
52
- --accui-strands-800: color-mix(in srgb, ${accentColor} 55%, black);
53
- --accui-strands-900: color-mix(in srgb, ${accentColor} 40%, black);
54
- --accui-strands-950: color-mix(in srgb, ${accentColor} 25%, black);
42
+ --strands-accent: ${accentColor} !important;
43
+ --accui-strands-accent: ${accentColor} !important;
44
+ --accui-strands-50: color-mix(in srgb, ${accentColor} 10%, white) !important;
45
+ --accui-strands-100: color-mix(in srgb, ${accentColor} 20%, white) !important;
46
+ --accui-strands-200: color-mix(in srgb, ${accentColor} 30%, white) !important;
47
+ --accui-strands-300: color-mix(in srgb, ${accentColor} 40%, white) !important;
48
+ --accui-strands-400: color-mix(in srgb, ${accentColor} 70%, white) !important;
49
+ --accui-strands-500: ${accentColor} !important;
50
+ --accui-strands-600: color-mix(in srgb, ${accentColor} 85%, black) !important;
51
+ --accui-strands-700: color-mix(in srgb, ${accentColor} 70%, black) !important;
52
+ --accui-strands-800: color-mix(in srgb, ${accentColor} 55%, black) !important;
53
+ --accui-strands-900: color-mix(in srgb, ${accentColor} 40%, black) !important;
54
+ --accui-strands-950: color-mix(in srgb, ${accentColor} 25%, black) !important;
55
+ }
56
+ [data-theme="dark"] {
57
+ --accui-strands-accent: ${accentColor} !important;
58
+ --accui-strands-50: color-mix(in srgb, ${accentColor} 10%, white) !important;
59
+ --accui-strands-100: color-mix(in srgb, ${accentColor} 20%, white) !important;
60
+ --accui-strands-200: color-mix(in srgb, ${accentColor} 30%, white) !important;
61
+ --accui-strands-300: color-mix(in srgb, ${accentColor} 40%, white) !important;
62
+ --accui-strands-400: color-mix(in srgb, ${accentColor} 70%, white) !important;
63
+ --accui-strands-500: ${accentColor} !important;
64
+ --accui-strands-600: color-mix(in srgb, ${accentColor} 85%, black) !important;
65
+ --accui-strands-700: color-mix(in srgb, ${accentColor} 70%, black) !important;
66
+ --accui-strands-800: color-mix(in srgb, ${accentColor} 55%, black) !important;
67
+ --accui-strands-900: color-mix(in srgb, ${accentColor} 40%, black) !important;
68
+ --accui-strands-950: color-mix(in srgb, ${accentColor} 25%, black) !important;
55
69
  }
56
70
  `;
57
71
  nuxt.options.app.head = nuxt.options.app.head || {};
58
72
  nuxt.options.app.head.style = nuxt.options.app.head.style || [];
59
- nuxt.options.app.head.style.push({
73
+ nuxt.options.app.head.style.unshift({
60
74
  children: cssVariables,
61
- type: "text/css"
75
+ type: "text/css",
76
+ key: "strands-accent-override"
62
77
  });
63
78
  }
64
79
  const ext = "es.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@strands.gg/accui",
3
- "version": "2.2.1",
3
+ "version": "2.2.2",
4
4
  "description": "Strands Authentication UI Components",
5
5
  "type": "module",
6
6
  "main": "./dist/strands-auth-ui.cjs.js",