bernova 1.2.2 → 1.3.0

package/CHANGELOG.md

@@ -5,6 +5,12 @@ All notable changes to Bernova will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.3.0] - 2026-01-21
+
+### New Features
+
+- **Added --embed-css flag**: Added the function for embedded styles.
+
 ## [1.2.2] - 2026-01-16
 
 ### Fixed

package/README.md

@@ -1854,6 +1854,8 @@ When publishing our projects, depending of the packager configuration, it is nec
  - `"provider"`: Custom output path for provider file
  - `"tools"`: Custom output path for tools files (cssVars, cssClasses, etc)
 
+- **embedCss**: When set to `'true'`, instead of generating a static CSS file, the styles generated by Bernova will be embedded.
+
  ### Overwrite or set a single customOutDirs
 
 You may need to run the bv-build script in multiple outputs, and the bernova.config.json file configuration only supports one path. In these cases, you can use flags to specify the output path for the specific case.
@@ -1896,4 +1898,7 @@ npx bv-build --types none
 
 # Prevent process the js ad dts files
 npx bv-build --prevent-process-js
+
+# Embed styles
+npx bv-build --embed-css
 ```

package/dist/bin/buildstyle.js

@@ -1,2 +1,2 @@
 #!/usr/bin/env node
-const e=require("fs").promises,s=require("path"),t=require("@babel/core"),{minify:r}=require("terser"),{extractDocFragment:a,writeDoc:o,fileExists:n,readConfigData:i,buildRelativePath:c}=require("../src/lib");async function p({baseOutPath:t,jsFile:r,rootDir:i,customOutDirs:p,dir:m,minifyJS:l,preventMoveJS:d,provider:v,type:y=""}){const b=r.name.endsWith(".d.ts"),D=s.resolve(m,r.path,r.name);if(!n(m,D))return void console.error(`File not found: ${D}`);let g=await e.readFile(D,"utf8");if("stats.js"===r.name&&p?.css){const e=a({section:"CssThemes",doc:g}),t=e.replace(/export const cssThemes\s*=\s*/,""),r=new Function(`return (${t})`)(),o=s.relative(i||"",v.path),n=f({cssThemes:r,cssOutPath:c({from:s.resolve(o),to:s.resolve(m,p.css)})});g=g.replace(e,`export const cssThemes = {\n${n}};\n`)}"cjs"!==y||b||(g=await u(g,D,!0)),"esm"!==y||b||(g=await u(g,D)),l&&!b&&(g=await h(g));const O=s.relative(i||"",r.path),j=d?D:s.resolve(t,O,r.name);await o(j,g,r.name)}async function m({baseOutPath:t,cssFiles:r,rootDir:a,customOutDirs:i,dir:c}){for(const p of r){const r=(()=>a&&!i?.css?s.relative(a,p.path):i?.css?i.css:p.path)(),m=s.resolve(c,p.path,p.name);if(n(c,m)){const a=await e.readFile(m,"utf8");await o(s.resolve(t,r,p.name),a,p.name.replace(".min",""))}}}function l({baseOutDir:e,type:t="-"}){const r=(()=>{switch(t){case"cjs":return"cjs";case"esm":return"esm";default:return""}})();return s.join(e,r)}async function u(e,s,r=!1){const a=!!r&&"commonjs";return(await t.transformAsync(e,{filename:s,presets:[["@babel/preset-env",{modules:a,targets:{node:"current"}}]]})).code}async function h(e){return(await r(e,{compress:{dead_code:!0,drop_console:!1,drop_debugger:!0,keep_classnames:!1,keep_fargs:!0,keep_fnames:!1,keep_infinity:!1},mangle:{toplevel:!1},format:{comments:!1}})).code}function d({themes:e,minifyCss:t}){return e&&Array.isArray(e)&&e.length>0?e.reduce((e,r)=>{const{name:a,stylesPath:o,foreignThemes:n}=r;return a&&o&&y(e,{name:t?`${a}.min.css`:`${a}.css`,path:o}),n&&Array.isArray(n)&&n.length>0&&n.forEach(t=>{const r=s.basename(t),a=t.replace(r,"").trim();y(e,{name:r,path:a})}),e},[]):[]}function v({provider:e,themes:s,preventMoveDTS:t=!1}){const r=s&&s.bvTools?s.reduce((e,{bvTools:s})=>{const{path:r,declarationHelp:a,cssVariables:o,cssClassNames:n,cssMediaQueries:i,cssGlobalStyles:c,availableComponents:p}=s,m=a&&!t;return o&&(y(e,{name:"cssVars.js",path:r}),m&&y(e,{name:"cssVars.d.ts",path:r})),n&&(y(e,{name:"cssClasses.js",path:r}),m&&y(e,{name:"cssClasses.d.ts",path:r})),i&&(y(e,{name:"cssMediaQueries.js",path:r}),m&&y(e,{name:"cssMediaQueries.d.ts",path:r})),c&&(y(e,{name:"cssGlobalStyles.js",path:r}),m&&y(e,{name:"cssGlobalStyles.d.ts",path:r})),p&&(y(e,{name:"cssAvailableComponents.js",path:r}),m&&y(e,{name:"cssAvailableComponents.d.js",path:r})),e},[]):[];return e&&(y(r,{name:`${e.name.toLocaleLowerCase()}.js`,path:e.path}),y(r,{name:"stats.js",path:`${e.path}/stats`}),e.declarationHelp&&!t&&(y(r,{name:`${e.name.toLocaleLowerCase()}.d.ts`,path:e.path}),y(r,{name:"stats.d.ts",path:`${e.path}/stats`}))),r}function f({cssThemes:e,cssOutPath:t}){return Object.entries(e).reduce((e,[r,{foreign:a}])=>{const{before:o,after:n}=a,i=o&&Array.isArray(o)&&o.length>0?o.reduce((e,r,a)=>{const o=s.basename(r);return a>0&&(e+=", "),e+`'${t}/${o}'`},""):"",c=n&&Array.isArray(n)&&n.length>0?n.reduce((e,r,a)=>{const o=s.basename(r);return a>0&&(e+=", "),e+`'${t}/${o}'`},""):"";return e+`'${r}': { css: '${t}/${r}.css', foreign: { before: [${i}], after: [${c}] } },\n`},"")}function y(e,s){e.some(e=>e.name===s.name&&e.path===s.path)||e.push(s)}function b(){const e=["--base-out-dir","--root-dir","--prevent-process-js","--prevent-move-js","--prevent-move-dts","--types","--css","--tools","--provider"],s={};for(let t=0;t<process.argv.length;t++)if(e.includes(process.argv[t])){const r=process.argv[t].replace("--","").replace(/-([a-z])/g,(e,s)=>s.toUpperCase()),a=process.argv[t+1];s[r]=(()=>!(a&&!e.includes(a))||("none"===a.toLocaleLowerCase()?"":a))()}return s}function D({jsonCustomOutDirs:e,cliCustomOutDirs:s}){let t={};return e&&(t={...e}),s&&(t={...t,...s}),Object.keys(t).length>0?t:void 0}(async()=>{const e=process.cwd(),t=await i(s.resolve(e,"bernova.config.json")),{compilerOptions:r,provider:a,themes:o}=t;r&&a&&o||(console.error("Invalid configuration: Missing compilerOptions, themes or provider"),process.exit(1));const{baseOutDir:n,rootDir:c,minifyCss:u,minifyJS:h,preventMoveJS:f,preventMoveDTS:y,types:g,customOutDirs:O}=r,{baseOutDir:j,rootDir:w,types:C,preventMoveJs:$,preventMoveDts:S,preventProcessJs:A=!1,...M}=b(),T=j??n??"",F=w??c??void 0,J=$??f??!1,P=S??y??!1,_=C??g??void 0,L=D({jsonCustomOutDirs:O,cliCustomOutDirs:M}),k=d({themes:o,minifyCss:u}),q=A?[]:v({provider:a,themes:o,preventMoveDTS:P}),x=l({baseOutDir:T});if(k&&k.length>0&&await m({baseOutPath:x,cssFiles:k,rootDir:F,customOutDirs:L,dir:e}),q&&q.length>0)if(_&&Array.isArray(_)&&_.length>0)for(const s of _){const t=l({baseOutDir:T,type:s});for(const r of q)await p({baseOutPath:t,jsFile:r,rootDir:F,customOutDirs:L,dir:e,minifyJS:h,preventMoveJS:J,provider:a,type:s})}else for(const s of q)await p({baseOutPath:x,jsFile:s,rootDir:F,customOutDirs:L,dir:e,minifyJS:h,preventMoveJS:J,provider:a})})();
+const e=require("fs").promises,s=require("path"),t=require("@babel/core"),{minify:n}=require("terser"),{extractDocFragment:r,writeDoc:a,fileExists:o,readConfigData:i,buildRelativePath:c}=require("../src/lib");async function l({baseOutPath:t,jsFile:n,rootDir:i,customOutDirs:l,dir:m,minifyJS:p,preventMoveJS:h,provider:f,type:y="",embedCss:b,cssFiles:g}){const D=n.name.endsWith(".d.ts"),j=s.resolve(m,n.path,n.name);if(!o(m,j))return void console.error(`File not found: ${j}`);let C=await e.readFile(j,"utf8");const O=!!l?.css||b&&g.length>0;if("stats.js"===n.name&&O){const t=r({section:"CssThemes",doc:C}),n=t.replace(/export const cssThemes\s*=\s*/,""),a=new Function(`return (${n})`)();if(l?.css){const e=s.relative(i||"",f.path),n=c({from:s.resolve(e),to:s.resolve(m,l.css)}),r=v({cssThemes:a,cssOutPath:""!==y?s.join("../",n):n});C=C.replace(t,`export const cssThemes = {\n${r}};\n`)}else if(b&&g.length>0){const n={},r=await g.reduce(async(t,{name:r,path:a,parent:i})=>{const c=s.resolve(m,a,r);if(o(m,c)){const s=await e.readFile(c,"utf8");if(i)i.forEach(e=>{const{name:t,position:r}=e;t in n||(n[t]={before:"",after:""}),n[t][r]+=s.replace(/\s+/g,"")});else{const e=r.replace(".css","").replace(".min","");e in t||(t[e]=""),t[e]+=s.replace(/\s+/g,"")}}return t},{}),a=`export const cssThemes = {\n${Object.entries(r).reduce((e,[s,t])=>{const r=n[s]||{before:"",after:""};return e+`'${s}': { css: \`${r.before+t+r.after}\` },\n`},"")}};\n`;C=C.replace(t,a)}}if(n.name===`${f.name.toLocaleLowerCase()}.js`&&O){const t="\n    #linkBuilder = (css, id) => {\n      if (typeof document === 'undefined') return;\n      let styleElement = document.getElementById(id);\n      if (!styleElement) {\n        styleElement = document.createElement('style');\n        styleElement.id = id;\n        styleElement.type = 'text/css';\n        document.head.appendChild(styleElement);\n      }\n      styleElement.innerHTML = css;\n    };\n    #handlerThemes = (data) => {\n      const { css } = data;\n      this.#linkBuilder(css, this.#linkId);\n    };\n    #cleanUpLinks = () => {\n      if (typeof document === 'undefined') return;\n      const style = document.getElementById(this.#linkId);\n      if (style) style.remove();\n    };\n    ",n="../src/lib/generateProvider/template/providerTemplate.js";let a=await e.readFile(s.resolve(__dirname,n),"utf8");a=a.replace(/\$_Provider_\$/g,f.name);const o=r({section:"Bernova provider methods",doc:a});C=a.replace(o,t.trim())}if(n.name===`${f.name.toLocaleLowerCase()}.d.ts`&&O){const t="\n    #linkBuilder(css: string, id: string): void;\n    #handlerThemes(data: { css: string }): void;\n    #cleanUpLinks(): void;\n    ",n="../src/lib/generateProvider/template/providerTemplate.d.ts";let a=await e.readFile(s.resolve(__dirname,n),"utf8");a=a.replace(/\$_Provider_\$/g,f.name);const o=r({section:"Bernova provider methods",doc:a});C=a.replace(o,t.trim())}"cjs"!==y||D||(C=await d(C,j,!0)),"esm"!==y||D||(C=await d(C,j)),p&&!D&&(C=await u(C));const $=s.relative(i||"",n.path),w=h?j:s.resolve(t,$,n.name);await a(w,C,n.name)}async function m({baseOutPath:t,cssFiles:n,rootDir:r,customOutDirs:i,dir:c}){for(const l of n){const n=(()=>r&&!i?.css?s.relative(r,l.path):i?.css?i.css:l.path)(),m=s.resolve(c,l.path,l.name);if(o(c,m)){const r=await e.readFile(m,"utf8"),o=l.name.replace(".min","");await a(s.resolve(t,n,o),r,o)}}}function p({baseOutDir:e,type:t="-"}){const n=(()=>{switch(t){case"cjs":return"cjs";case"esm":return"esm";default:return""}})();return s.join(e,n)}async function d(e,s,n=!1){const r=!!n&&"commonjs";return(await t.transformAsync(e,{filename:s,presets:[["@babel/preset-env",{modules:r,targets:{node:"current"}}]]})).code}async function u(e){return(await n(e,{compress:{dead_code:!0,drop_console:!1,drop_debugger:!0,keep_classnames:!1,keep_fargs:!0,keep_fnames:!1,keep_infinity:!1},mangle:{toplevel:!1},format:{comments:!1}})).code}function h({themes:e,minifyCss:t}){return e&&Array.isArray(e)&&e.length>0?e.reduce((e,n)=>{const{name:r,stylesPath:a,foreignThemes:o}=n;return r&&a&&y(e,{name:t?`${r}.min.css`:`${r}.css`,path:a}),o&&Array.isArray(o)&&o.length>0&&o.forEach(t=>{const n=s.basename(t.path),a=t.path.replace(n,"").trim(),o=e.findIndex(e=>e.name===n&&e.path===a);o>=0?e[o].parent.push({name:r,position:t.position}):e.push({name:n,path:a,parent:[{name:r,position:t.position}]})}),e},[]):[]}function f({provider:e,themes:s,preventMoveDTS:t=!1}){const n=s&&s.bvTools?s.reduce((e,{bvTools:s})=>{const{path:n,declarationHelp:r,cssVariables:a,cssClassNames:o,cssMediaQueries:i,cssGlobalStyles:c,availableComponents:l}=s,m=r&&!t;return a&&(y(e,{name:"cssVars.js",path:n}),m&&y(e,{name:"cssVars.d.ts",path:n})),o&&(y(e,{name:"cssClasses.js",path:n}),m&&y(e,{name:"cssClasses.d.ts",path:n})),i&&(y(e,{name:"cssMediaQueries.js",path:n}),m&&y(e,{name:"cssMediaQueries.d.ts",path:n})),c&&(y(e,{name:"cssGlobalStyles.js",path:n}),m&&y(e,{name:"cssGlobalStyles.d.ts",path:n})),l&&(y(e,{name:"cssAvailableComponents.js",path:n}),m&&y(e,{name:"cssAvailableComponents.d.js",path:n})),e},[]):[];return e&&(y(n,{name:`${e.name.toLocaleLowerCase()}.js`,path:e.path}),y(n,{name:"stats.js",path:`${e.path}/stats`}),e.declarationHelp&&!t&&(y(n,{name:`${e.name.toLocaleLowerCase()}.d.ts`,path:e.path}),y(n,{name:"stats.d.ts",path:`${e.path}/stats`}))),n}function v({cssThemes:e,cssOutPath:t}){return Object.entries(e).reduce((e,[n,{foreign:r}])=>{const{before:a,after:o}=r,i=a&&Array.isArray(a)&&a.length>0?a.reduce((e,n,r)=>{const a=s.basename(n);return r>0&&(e+=", "),e+`'${t}/${a}'`},""):"",c=o&&Array.isArray(o)&&o.length>0?o.reduce((e,n,r)=>{const a=s.basename(n);return r>0&&(e+=", "),e+`'${t}/${a}'`},""):"";return e+`'${n}': { css: '${t}/${n}.css', foreign: { before: [${i}], after: [${c}] } },\n`},"")}function y(e,s){e.some(e=>e.name===s.name&&e.path===s.path)||e.push(s)}function b(){const e=["--base-out-dir","--root-dir","--prevent-process-js","--prevent-move-js","--prevent-move-dts","--types","--css","--tools","--provider","--embed-css"],s={};for(let t=0;t<process.argv.length;t++)if(e.includes(process.argv[t])){const n=process.argv[t].replace("--","").replace(/-([a-z])/g,(e,s)=>s.toUpperCase()),r=process.argv[t+1];s[n]=(()=>!(r&&!e.includes(r))||("none"===r.toLocaleLowerCase()?"":r))()}return s}function g({jsonCustomOutDirs:e,cliCustomOutDirs:s}){let t={};return e&&(t={...e}),s&&(t={...t,...s}),Object.keys(t).length>0?t:void 0}(async()=>{const e=process.cwd(),t=await i(s.resolve(e,"bernova.config.json")),{compilerOptions:n,provider:r,themes:a}=t;n&&r&&a||(console.error("Invalid configuration: Missing compilerOptions, themes or provider"),process.exit(1));const{baseOutDir:o,rootDir:c,minifyCss:d,minifyJS:u,preventMoveJS:v,preventMoveDTS:y,types:D,embedCss:j,customOutDirs:C}=n,{baseOutDir:O,rootDir:$,types:w,preventMoveJs:T,preventMoveDts:F,preventProcessJs:_=!1,embedCss:M,...P}=b(),S=O??o??"",A=$??c??void 0,E=T??v??!1,L=F??y??!1,k=w??D??void 0,J=M??j??!1,x=g({jsonCustomOutDirs:C,cliCustomOutDirs:P}),B=h({themes:a,minifyCss:d}),I=_?[]:f({provider:r,themes:a,preventMoveDTS:L}),q=p({baseOutDir:S});if(B&&B.length>0&&!J&&await m({baseOutPath:q,cssFiles:B,rootDir:A,customOutDirs:x,dir:e}),I&&I.length>0)if(k&&Array.isArray(k)&&k.length>0)for(const s of k){const t=p({baseOutDir:S,type:s});for(const n of I)await l({baseOutPath:t,jsFile:n,rootDir:A,customOutDirs:x,dir:e,minifyJS:u,preventMoveJS:E,provider:r,type:s,embedCss:J,cssFiles:B})}else for(const s of I)await l({baseOutPath:q,jsFile:s,rootDir:A,customOutDirs:x,dir:e,minifyJS:u,preventMoveJS:E,provider:r,embedCss:J,cssFiles:B})})();

package/dist/src/lib/generateProvider/template/providerTemplate.d.ts

@@ -32,12 +32,14 @@ export declare class $_Provider_$ {
   #themesMediaQueries: typeof cssMediaQueries;
   #linkId: string;
   #jsInCss: boolean;
+  /* Bernova provider methods */
   #linkBuilder: (url: string, id: string) => void;
   #handlerThemes: (data: {
     css: string;
     foreign?: { high?: string[]; low?: string[] };
   }) => void;
   #cleanUpLinks: () => void;
+  /* Bernova provider methods */
 
   constructor(options?: { linkId?: string; jsInCss?: boolean });
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bernova",
-  "version": "1.2.2",
+  "version": "1.3.0",
   "description": "The best way to write CSS with Javascript syntax",
   "main": "./dist/src/index.js",
   "types": "./dist/src/index.d.ts",

package/src/lib/generateProvider/template/providerTemplate.d.ts

@@ -32,12 +32,14 @@ export declare class $_Provider_$ {
   #themesMediaQueries: typeof cssMediaQueries;
   #linkId: string;
   #jsInCss: boolean;
+  /* Bernova provider methods */
   #linkBuilder: (url: string, id: string) => void;
   #handlerThemes: (data: {
     css: string;
     foreign?: { high?: string[]; low?: string[] };
   }) => void;
   #cleanUpLinks: () => void;
+  /* Bernova provider methods */
 
   constructor(options?: { linkId?: string; jsInCss?: boolean });
 

package/src/lib/generateProvider/template/providerTemplate.js

@@ -17,6 +17,7 @@ export class $_Provider_$ {
   #themesMediaQueries;
   #linkId;
   #jsInCss;
+  /* Bernova provider methods */
   #linkBuilder = (url, id) => {
     if (typeof document === 'undefined') return;
     let linkElement = document.getElementById(id);
@@ -51,6 +52,7 @@ export class $_Provider_$ {
     const links = document.querySelectorAll(`link[id^="${this.#linkId}"]`);
     links.forEach((link) => link.remove());
   };
+  /* Bernova provider methods */
 
   constructor({ linkId, jsInCss } = {}) {
     this.#themes = cssThemes;