@genexus/mercury 0.17.0 → 0.17.2

package/README.md

@@ -30,9 +30,11 @@ Mercury Design System is a robust and scalable solution designed to improve prod
 
     - [2.3.1. Copying assets with Angular](#231-copying-assets-with-angular)
 
-    - [2.3.2. Copying assets with StencilJS](#232-copying-assets-with-stenciljs)
+    - [2.3.2. Copying assets with NextJS](#232-copying-assets-with-nextjs)
 
-    - [2.3.3. Copying assets with Vite](#233-copying-assets-with-vite)
+    - [2.3.3. Copying assets with StencilJS](#233-copying-assets-with-stenciljs)
+
+    - [2.3.4. Copying assets with Vite](#234-copying-assets-with-vite)
 
   - [2.4. Register Mercury and Chameleon utilities](#24-register-mercury-and-chameleon-utilities)
 
@@ -228,7 +230,51 @@ In the following sections we provide examples of how to copy the assets with dif
 }
 ```
 
-#### 2.3.2. Copying assets with StencilJS
+#### 2.3.2. Copying assets with NextJS
+
+First, install `copy-webpack-plugin`:
+
+```bash
+npm i copy-webpack-plugin --save-dev
+```
+
+```ts
+// next.config.ts
+import type { NextConfig } from "next";
+import CopyWebpackPlugin from "copy-webpack-plugin";
+
+const nextConfig: NextConfig = {
+  webpack: (config, { isServer }) => {
+    // Only apply the plugin for client-side builds
+    if (!isServer) {
+      config.plugins.push(
+        new CopyWebpackPlugin({
+          patterns: [
+            {
+              from: "{{ CSS outDir path }}",
+              to: "{{ CSS bundles final path }}"
+            },
+            {
+              from: "<path to node_modules>/@genexus/mercury/dist/assets/fonts",
+              to: "{{ Fonts final path }}"
+            },
+            {
+              from: "<path to node_modules>/@genexus/mercury/dist/assets/icons",
+              to: "{{ Icons final path }}"
+            }
+          ]
+        })
+      );
+    }
+
+    return config;
+  }
+};
+
+export default nextConfig;
+```
+
+#### 2.3.3. Copying assets with StencilJS
 
 When building web components with the StencilJS compiler, the assets can be copied using the copy tasks that provides StencilJS:
 
@@ -268,7 +314,7 @@ export const config: Config = {
 };
 ```
 
-#### 2.3.3. Copying assets with Vite
+#### 2.3.4. Copying assets with Vite
 
 First, install `vite-plugin-static-copy`:
 

package/dist/assets-manager.js

@@ -1 +1 @@
-"use strict";const a={},d={},g="/",u=":";export const MERCURY_ALIAS="mer",registerAssets=(e,t,r)=>{a[e]||d[t]||(a[e]=r,d[t]=e)},getAsset=(e,t)=>{const r=d[e]??e,n=a[r];if(!n)return;const o=n.icons[t.category];if(!o)return;const c=o[t.name];if(c)return t.colorType?c[t.colorType]:c},getIconPath=(e,t=MERCURY_ALIAS)=>{const r=e.colorType?`${g}${e.colorType}`:"";return`${t}${g}${e.category}${g}${e.name}${r}`},getIconPathExpanded=(e,t,r=MERCURY_ALIAS)=>`${getIconPath(e,r)}${u}${getIconPath(t,r)}`;const l=(e,t,r)=>{const n=t===MERCURY_ALIAS?"":`-${t}`;return r?`var(--icon${n}__${e}--${r})`:`var(--icon${n}__${e})`},f=e=>{const t=e.split(g),r=t[0],n=d[r]??r;if(!a[n]){const i=t[0],S=t[1],p=t[2];return{vendor:MERCURY_ALIAS,category:i,name:S,colorType:p}}const c=t[1],s=t[2],m=t[3];return{vendor:r,category:c,name:s,colorType:m}};export const getImagePathCallback=e=>{const{vendor:t,category:r,name:n,colorType:o}=f(e),c=getAsset(t,o?{category:r,name:n,colorType:o}:{category:r,name:n});if(!c)return;const s={base:l(c.enabled.name,t)};return c.hover&&(s.hover=l(c.hover.name,t)),c.active&&(s.active=l(c.active.name,t)),c.disabled&&(s.disabled=l(c.disabled.name,t)),s},getActionMenuImagePathCallback=(e,t)=>{if(!e.startImgSrc&&t==="start"||!e.endImgSrc&&t==="end")return;const r=t==="start"?e.startImgSrc:e.endImgSrc;return getImagePathCallback(r)},getActionListImagePathCallback=e=>e.imgSrc?getImagePathCallback(e.imgSrc):void 0,getNavigationListImagePathCallback=e=>e.startImgSrc?getImagePathCallback(e.startImgSrc):void 0,getTreeViewImagePathCallback=(e,t)=>{if(!e.startImgSrc&&t==="start"||!e.endImgSrc&&t==="end")return;const n=(t==="start"?e.startImgSrc:e.endImgSrc).split(u),o=getImagePathCallback(n[0]);if(o)return n[1]?{default:o,expanded:getImagePathCallback(n[1])}:{default:o}},getComboBoxImagePathCallback=(e,t)=>{if(!e.startImgSrc&&t==="start"||!e.endImgSrc&&t==="end")return;const r=t==="start"?e.startImgSrc:e.endImgSrc;return getImagePathCallback(r)},getImagePathCallbackDefinitions={"ch-accordion-render":getImagePathCallback,"ch-action-menu-render":getActionMenuImagePathCallback,"ch-action-list-render":getActionListImagePathCallback,"ch-combo-box-render":getComboBoxImagePathCallback,"ch-navigation-list-render":getNavigationListImagePathCallback,"ch-checkbox":getImagePathCallback,"ch-edit":getImagePathCallback,"ch-image":getImagePathCallback,"ch-tree-view-render":getTreeViewImagePathCallback};
+"use strict";const a={},d={},g="/",u=":";export const MERCURY_ALIAS="mer",registerAssets=(e,t,r)=>{a[e]||d[t]||(a[e]=r,d[t]=e)},getAsset=(e,t)=>{const r=d[e]??e,n=a[r];if(!n)return;const o=n.icons[t.category];if(!o)return;const c=o[t.name];if(c)return t.colorType?c[t.colorType]:c},getIconPath=(e,t=MERCURY_ALIAS)=>{const r=e.colorType?`${g}${e.colorType}`:"";return`${t}${g}${e.category}${g}${e.name}${r}`},getIconPathExpanded=(e,t,r=MERCURY_ALIAS)=>`${getIconPath(e,r)}${u}${getIconPath(t,r)}`;const l=(e,t,r)=>{const n=t===MERCURY_ALIAS?"":`-${t}`;return r?`var(--icon${n}__${e}--${r})`:`var(--icon${n}__${e})`},f=e=>{const t=e.split(g),r=t[0],n=d[r]??r;if(!a[n]){const i=t[0],S=t[1],p=t[2];return{vendor:MERCURY_ALIAS,category:i,name:S,colorType:p}}const c=t[1],s=t[2],m=t[3];return{vendor:r,category:c,name:s,colorType:m}};export const getImagePathCallback=e=>{const{vendor:t,category:r,name:n,colorType:o}=f(e),c=getAsset(t,o?{category:r,name:n,colorType:o}:{category:r,name:n});if(!c)return;const s={base:l(c.enabled.name,t)};return c.hover&&(s.hover=l(c.hover.name,t)),c.active&&(s.active=l(c.active.name,t)),c.disabled&&(s.disabled=l(c.disabled.name,t)),s},getActionMenuImagePathCallback=(e,t)=>{if(!e.startImgSrc&&t==="start"||!e.endImgSrc&&t==="end")return;const r=t==="start"?e.startImgSrc:e.endImgSrc;return getImagePathCallback(r)},getActionListImagePathCallback=e=>e.imgSrc?getImagePathCallback(e.imgSrc):void 0,getNavigationListImagePathCallback=e=>e.startImgSrc?getImagePathCallback(e.startImgSrc):void 0,getTreeViewImagePathCallback=(e,t)=>{if(!e.startImgSrc&&t==="start"||!e.endImgSrc&&t==="end")return;const n=(t==="start"?e.startImgSrc:e.endImgSrc).split(u),o=getImagePathCallback(n[0]);if(o)return n[1]?{default:o,expanded:getImagePathCallback(n[1])}:{default:o}},getComboBoxImagePathCallback=(e,t)=>{if(!e.startImgSrc&&t==="start"||!e.endImgSrc&&t==="end")return;const r=t==="start"?e.startImgSrc:e.endImgSrc;return getImagePathCallback(r)},getImagePathCallbackDefinitions={"ch-accordion-render":getImagePathCallback,"ch-action-menu-render":getActionMenuImagePathCallback,"ch-action-list-render":getActionListImagePathCallback,"ch-combo-box-render":getComboBoxImagePathCallback,"ch-checkbox":getImagePathCallback,"ch-edit":getImagePathCallback,"ch-image":getImagePathCallback,"ch-navigation-list-render":getNavigationListImagePathCallback,"ch-tab-render":getImagePathCallback,"ch-tree-view-render":getTreeViewImagePathCallback};