@decafhub/decaf-react-webapp 0.0.1 → 0.0.3

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # Changelog
 
+## [0.0.3](https://github.com/teloscube/decaf-react-webapp/compare/v0.0.2...v0.0.3) (2022-11-28)
+
+
+### Features
+
+* get app icon from props ([577a1f5](https://github.com/teloscube/decaf-react-webapp/commit/577a1f553e4ba064f3e3a9d7f807ae94f085d634))
+
+## [0.0.2](https://github.com/teloscube/decaf-react-webapp/compare/v0.0.1...v0.0.2) (2022-11-28)
+
+
+### Features
+
+* get menu, routes and appName as props ([f76e1b9](https://github.com/teloscube/decaf-react-webapp/commit/f76e1b94b8e390ae3a901bc3509404c9d20eca01))
+* integrate and export emotion for styling ([de274f7](https://github.com/teloscube/decaf-react-webapp/commit/de274f7b3139acd7502259ddf16e2dff24b55e51))
+
+
+### Bug Fixes
+
+* app name is not working as a link to home page ([4bbbc56](https://github.com/teloscube/decaf-react-webapp/commit/4bbbc565c7d7a3202bc1c3657347c8b642e5036e))
+
 ## 0.0.1 (2022-11-24)
 
 

package/README.md

@@ -9,20 +9,27 @@
 Install @decafhub/decaf-react-webapp along with its peer dependencies:
 
 ```bash:
-npm install --save @decafhub/decaf-react-webapp @decafhub/decaf-react@^0.1 @decafhub/decaf-client@^0.3 antd@^5 react@^18 react-dom@^18
+npm install --save @decafhub/decaf-react-webapp @decafhub/decaf-react@^0.1 @decafhub/decaf-client@^0.3 antd@^5 @ant-design/icons@^4 react@^18 react-dom@^18
 ```
 
 Or with yarn:
 
 ```bash
-yarn add @decafhub/decaf-react-webapp @decafhub/decaf-react@^0.1 @decafhub/decaf-client@^0.3 antd@^5 react@^18 react-dom@^18
+yarn add @decafhub/decaf-react-webapp @decafhub/decaf-react@^0.1 @decafhub/decaf-client@^0.3 antd@^5 @ant-design/icons@^4 react@^18 react-dom@^18
 ```
 
+## Usage
+
+See the [App.tsx](./example/src/App.tsx) file in the `example` folder file for detailed usage.
+
 ## Development
 
 1. Clone the repository.
 2. Install dependencies with `yarn`.
 3. Run `yarn start` to start the development server.
-4. cd into `example` and run `yarn install` and `yarn start` to start the example application.
-5. cd into `example` and run `yarn caddy` to start Caddy server.
-6. Open http://localhost:2999/webapps/react-webapp-example/development/ in your browser.
+4. cd into `example`
+   1. run `yarn install`
+   2. duplicate `.env.example` to `.env`
+   3. run `yarn start` to start the example application.
+   4. run `yarn caddy` to start the Caddy server.
+5. Open http://localhost:2999/webapps/react-webapp-example/development/ in your browser.

package/dist/Layout.d.ts

@@ -0,0 +1,22 @@
+import { ItemType } from 'antd/es/menu/hooks/useItems';
+import React from 'react';
+interface BaseDecafMenuItem {
+    label: any;
+    icon?: React.ReactNode;
+    children?: DecafMenuItem[];
+}
+export type DecafMenuItem = BaseDecafMenuItem & ({
+    to?: string;
+} | {
+    href?: string;
+});
+export interface DecafLayoutProps {
+    menu: DecafMenuItem[];
+    appName: string;
+    appIcon?: React.ReactNode;
+    children: React.ReactNode;
+}
+export declare function routesToAntMenu(routes: DecafMenuItem[]): ItemType[];
+export default function DecafLayout(props: DecafLayoutProps): JSX.Element;
+export {};
+//# sourceMappingURL=Layout.d.ts.map

package/dist/Layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../src/Layout.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAe,MAAM,6BAA6B,CAAC;AACpE,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,UAAU,iBAAiB;IACzB,KAAK,EAAE,GAAG,CAAC;IACX,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,aAAa,EAAE,CAAC;CAC5B;AAED,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAAG,CAAC;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAEtF,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,aAAa,EAAE,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,eAAe,CAAC,MAAM,EAAE,aAAa,EAAE,GAAG,QAAQ,EAAE,CAyBnE;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAAK,EAAE,gBAAgB,eA0B1D"}

package/dist/index.d.ts

@@ -1,11 +1,21 @@
-import { DecafAppController, DecafAppConfig } from '@decafhub/decaf-react';
+import { DecafAppConfig, DecafAppController } from '@decafhub/decaf-react';
+import { css, Global } from '@emotion/react';
+import styled from '@emotion/styled';
+import 'antd/dist/reset.css';
 import { ThemeConfig } from 'antd/es/config-provider/context';
 import React from 'react';
+import { RouteObject } from 'react-router-dom';
+import { DecafMenuItem } from './Layout';
+export type DecafRoute = RouteObject;
 export interface DecafWebappProps {
     config?: DecafAppConfig;
     controller?: DecafAppController;
     theme?: ThemeConfig;
-    children: React.ReactNode;
+    routes: DecafRoute[];
+    menuItems: DecafMenuItem[];
+    appName: string;
+    appIcon?: React.ReactNode;
 }
-export default function DecafWebapp(props: DecafWebappProps): JSX.Element;
+declare function DecafWebapp(props: DecafWebappProps): JSX.Element;
+export { DecafWebapp, Global as GlobalStyle, css, styled };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAY,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAErF,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,gBAAgB;IAC/B,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAAK,EAAE,gBAAgB,eAM1D"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,cAAc,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AACrF,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAA+B,WAAW,EAAkB,MAAM,kBAAkB,CAAC;AAC5F,OAAoB,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAGtD,MAAM,MAAM,UAAU,GAAG,WAAW,CAAC;AAErC,MAAM,WAAW,gBAAgB;IAC/B,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,SAAS,EAAE,aAAa,EAAE,CAAC;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAuBD,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,eA4B3C;AAED,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,WAAW,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC"}

package/dist/index.js

@@ -1,2 +1,2 @@
-var e=require("@decafhub/decaf-react"),r=require("antd");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=/*#__PURE__*/o(require("react")),c={hashed:!0,token:{colorPrimary:"#344961",colorBgBase:"#10161d",colorBgLayout:"#10161d",borderRadius:0,colorError:"#b03a38",colorSuccess:"#48734d",colorWarning:"#ffc107",colorInfo:"#4694ab",green:"#48734d",red:"#b03a38",blue:"#0d6efd",yellow:"#ffc107",colorWhite:"#fff"},algorithm:[r.theme.darkAlgorithm]};module.exports=function(o){var l;return t.default.createElement(e.DecafApp,{config:o.config,controller:o.controller},t.default.createElement(r.ConfigProvider,{theme:null!=(l=o.theme)?l:c},o.children))};
+var e=require("@decafhub/decaf-react"),t=require("@emotion/react"),n=require("@emotion/styled"),r=require("antd");require("antd/dist/reset.css");var o=require("react"),a=require("react-router-dom");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=/*#__PURE__*/l(n),c=/*#__PURE__*/l(o);function u(){return u=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},u.apply(this,arguments)}function d(e){var t=[];return e.forEach(function(e){var n={key:"to"in e?e.to:e.label,label:e.label,icon:e.icon};"to"in e&&e.to?n.label=c.default.createElement(a.NavLink,{to:e.to,end:"/"===e.to},e.label):"href"in e&&e.href?n.label=c.default.createElement("a",{href:e.href},e.label):e.children&&(n.label=e.label,n.children=d(e.children||[])),t.push(n)}),t}function f(e){var t=d(e.menu),n=a.useMatches().map(function(e){return e.pathname});return c.default.createElement(r.Layout,{style:{height:"100%"}},c.default.createElement(r.Layout.Header,{style:{paddingInline:0}},c.default.createElement("div",{style:{paddingInline:20,display:"flex",justifyContent:"space-between",alignItems:"center"}},c.default.createElement(a.Link,{to:"/",style:{display:"flex",alignItems:"center",gap:10}},e.appIcon,c.default.createElement(r.Typography.Title,{level:4,style:{margin:0}},e.appName)),c.default.createElement(r.Menu,{style:{justifyContent:"flex-end",backgroundColor:"transparent",border:"none"},mode:"horizontal",items:t,selectedKeys:n}))),c.default.createElement(r.Layout.Content,{style:{padding:"20px 50px"}},e.children))}var s={hashed:!0,components:{Layout:{colorBgHeader:"#10161d"},Button:{boxShadow:"none",boxShadowSecondary:"none"}},token:{fontFamily:'"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"',colorPrimary:"#344961",colorBgBase:"#1a242f",colorBgLayout:"#1a242f",borderRadius:0,colorError:"#b03a38",colorSuccess:"#48734d",colorWarning:"#ffc107",colorInfo:"#4694ab",green:"#48734d",red:"#b03a38",blue:"#0d6efd",yellow:"#ffc107",colorWhite:"#fff"},algorithm:[r.theme.darkAlgorithm]};function m(e,t){var n=[];return t.forEach(function(t){var r,o=u({},t);t.children?(o.element=null!=(r=t.element)?r:c.default.createElement(a.Outlet,null),o.children=m(e,t.children)):o.element=c.default.createElement(f,{menu:e.menuItems,appName:e.appName,appIcon:e.appIcon},t.element),n.push(o)}),n}Object.defineProperty(exports,"GlobalStyle",{enumerable:!0,get:function(){return t.Global}}),Object.defineProperty(exports,"css",{enumerable:!0,get:function(){return t.css}}),Object.defineProperty(exports,"styled",{enumerable:!0,get:function(){return i.default}}),exports.DecafWebapp=function(n){var o,l,i,u,d=m(n,n.routes),f=a.createBrowserRouter(d,{basename:null==(o=n.config)?void 0:o.basePath}),p=null!=(l=n.theme)?l:s;return c.default.createElement(r.ConfigProvider,{theme:p},c.default.createElement(t.Global,{styles:{body:{background:null==(i=p.token)?void 0:i.colorBgBase,fontFamily:null==(u=p.token)?void 0:u.fontFamily,margin:0},button:{boxShadow:"none !important"}}}),c.default.createElement(e.DecafApp,{config:n.config,controller:n.controller},c.default.createElement(a.RouterProvider,{router:f})))};
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/theme.ts","../src/index.tsx"],"sourcesContent":["import { theme } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\n\nexport const decafTheme: ThemeConfig = {\n  hashed: true,\n  token: {\n    colorPrimary: '#344961',\n    colorBgBase: '#10161d',\n    colorBgLayout: '#10161d',\n    borderRadius: 0,\n    colorError: '#b03a38',\n    colorSuccess: '#48734d',\n    colorWarning: '#ffc107',\n    colorInfo: '#4694ab',\n    green: '#48734d',\n    red: '#b03a38',\n    blue: '#0d6efd',\n    yellow: '#ffc107',\n    colorWhite: '#fff',\n  },\n\n  algorithm: [theme.darkAlgorithm],\n};\n","import { DecafAppController, DecafApp, DecafAppConfig } from '@decafhub/decaf-react';\nimport { ConfigProvider } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\nimport React from 'react';\nimport { decafTheme } from 'theme';\n\nexport interface DecafWebappProps {\n  config?: DecafAppConfig;\n  controller?: DecafAppController;\n  theme?: ThemeConfig;\n  children: React.ReactNode;\n}\n\nexport default function DecafWebapp(props: DecafWebappProps) {\n  return (\n    <DecafApp config={props.config} controller={props.controller}>\n      <ConfigProvider theme={props.theme ?? decafTheme}>{props.children}</ConfigProvider>\n    </DecafApp>\n  );\n}\n"],"names":["decafTheme","hashed","token","colorPrimary","colorBgBase","colorBgLayout","borderRadius","colorError","colorSuccess","colorWarning","colorInfo","green","red","blue","yellow","colorWhite","algorithm","theme","darkAlgorithm","props","_props$theme","React","createElement","DecafApp","config","controller","ConfigProvider","children"],"mappings":"wKAGuBA,EAAgB,CACrCC,QAAQ,EACRC,MAAO,CACLC,aAAc,UACdC,YAAa,UACbC,cAAe,UACfC,aAAc,EACdC,WAAY,UACZC,aAAc,UACdC,aAAc,UACdC,UAAW,UACXC,MAAO,UACPC,IAAK,UACLC,KAAM,UACNC,OAAQ,UACRC,WAAY,QAGdC,UAAW,CAACC,EAAAA,MAAMC,+BCRI,SAAYC,GAAuB,IAAAC,EACzD,OACEC,EAAA,QAAAC,cAACC,WAAQ,CAACC,OAAQL,EAAMK,OAAQC,WAAYN,EAAMM,YAChDJ,EAAA,QAAAC,cAACI,EAAcA,eAAC,CAAAT,MAAkB,OAAXE,EAAAA,EAAMF,OAAKG,EAAIpB,GAAamB,EAAMQ,UAG/D"}
+{"version":3,"file":"index.js","sources":["../src/Layout.tsx","../src/theme.ts","../src/index.tsx"],"sourcesContent":["import { Layout, Menu, Typography } from 'antd';\nimport { ItemType, SubMenuType } from 'antd/es/menu/hooks/useItems';\nimport React from 'react';\nimport { Link, NavLink, useMatches } from 'react-router-dom';\n\ninterface BaseDecafMenuItem {\n  label: any;\n  icon?: React.ReactNode;\n  children?: DecafMenuItem[];\n}\n\nexport type DecafMenuItem = BaseDecafMenuItem & ({ to?: string } | { href?: string });\n\nexport interface DecafLayoutProps {\n  menu: DecafMenuItem[];\n  appName: string;\n  appIcon?: React.ReactNode;\n  children: React.ReactNode;\n}\n\nexport function routesToAntMenu(routes: DecafMenuItem[]): ItemType[] {\n  const result: ItemType[] = [];\n\n  routes.forEach((route) => {\n    const item: ItemType = {\n      key: 'to' in route ? route.to : route.label,\n      label: route.label,\n      icon: route.icon,\n    };\n    if ('to' in route && route.to) {\n      item.label = (\n        <NavLink to={route.to} end={route.to === '/'}>\n          {route.label}\n        </NavLink>\n      );\n    } else if ('href' in route && route.href) {\n      item.label = <a href={route.href}>{route.label}</a>;\n    } else if (route.children) {\n      item.label = route.label;\n      (item as SubMenuType).children = routesToAntMenu(route.children || []);\n    }\n    result.push(item);\n  });\n\n  return result;\n}\n\nexport default function DecafLayout(props: DecafLayoutProps) {\n  const menuItems = routesToAntMenu(props.menu);\n  const matches = useMatches();\n  const matchedMenuItems = matches.map((match) => match.pathname);\n\n  return (\n    <Layout style={{ height: '100%' }}>\n      <Layout.Header style={{ paddingInline: 0 }}>\n        <div style={{ paddingInline: 20, display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>\n          <Link to=\"/\" style={{ display: 'flex', alignItems: 'center', gap: 10 }}>\n            {props.appIcon}\n            <Typography.Title level={4} style={{ margin: 0 }}>\n              {props.appName}\n            </Typography.Title>\n          </Link>\n          <Menu\n            style={{ justifyContent: 'flex-end', backgroundColor: 'transparent', border: 'none' }}\n            mode=\"horizontal\"\n            items={menuItems}\n            selectedKeys={matchedMenuItems}\n          />\n        </div>\n      </Layout.Header>\n      <Layout.Content style={{ padding: '20px 50px' }}>{props.children}</Layout.Content>\n    </Layout>\n  );\n}\n","import { theme } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\n\nexport const decafTheme: ThemeConfig = {\n  hashed: true,\n  components: {\n    Layout: {\n      colorBgHeader: '#10161d',\n    },\n    Button: {\n      boxShadow: 'none',\n      boxShadowSecondary: 'none',\n    },\n  },\n  token: {\n    fontFamily:\n      '\"Inter\",system-ui,-apple-system,\"Segoe UI\",Roboto,\"Helvetica Neue\",Arial,\"Noto Sans\",\"Liberation Sans\",sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\"',\n    colorPrimary: '#344961',\n    colorBgBase: '#1a242f',\n    colorBgLayout: '#1a242f',\n    borderRadius: 0,\n    colorError: '#b03a38',\n    colorSuccess: '#48734d',\n    colorWarning: '#ffc107',\n    colorInfo: '#4694ab',\n    green: '#48734d',\n    red: '#b03a38',\n    blue: '#0d6efd',\n    yellow: '#ffc107',\n    colorWhite: '#fff',\n  },\n\n  algorithm: [theme.darkAlgorithm],\n};\n","import { DecafApp, DecafAppConfig, DecafAppController } from '@decafhub/decaf-react';\nimport { css, Global } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { ConfigProvider } from 'antd';\nimport 'antd/dist/reset.css';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\nimport React from 'react';\nimport { createBrowserRouter, Outlet, RouteObject, RouterProvider } from 'react-router-dom';\nimport DecafLayout, { DecafMenuItem } from './Layout';\nimport { decafTheme } from './theme';\n\nexport type DecafRoute = RouteObject;\n\nexport interface DecafWebappProps {\n  config?: DecafAppConfig;\n  controller?: DecafAppController;\n  theme?: ThemeConfig;\n  routes: DecafRoute[];\n  menuItems: DecafMenuItem[];\n  appName: string;\n  appIcon?: React.ReactNode;\n}\n\nfunction buildRoutes(props: DecafWebappProps, routes: DecafRoute[]): RouteObject[] {\n  const result: RouteObject[] = [];\n\n  routes.forEach((route) => {\n    const item: RouteObject = { ...route };\n    if (route.children) {\n      item.element = route.element ?? <Outlet />;\n      item.children = buildRoutes(props, route.children);\n    } else {\n      item.element = (\n        <DecafLayout menu={props.menuItems} appName={props.appName} appIcon={props.appIcon}>\n          {route.element}\n        </DecafLayout>\n      );\n    }\n    result.push(item);\n  });\n\n  return result;\n}\n\nfunction DecafWebapp(props: DecafWebappProps) {\n  const routes = buildRoutes(props, props.routes);\n  const router = createBrowserRouter(routes, {\n    basename: props.config?.basePath,\n  });\n\n  const theme = props.theme ?? decafTheme;\n\n  return (\n    <ConfigProvider theme={theme}>\n      <Global\n        styles={{\n          body: {\n            background: theme.token?.colorBgBase,\n            fontFamily: theme.token?.fontFamily,\n            margin: 0,\n          },\n          button: {\n            // antd button has a default box shadow and we can't override it for now\n            boxShadow: 'none !important',\n          },\n        }}\n      />\n      <DecafApp config={props.config} controller={props.controller}>\n        <RouterProvider router={router} />\n      </DecafApp>\n    </ConfigProvider>\n  );\n}\n\nexport { DecafWebapp, Global as GlobalStyle, css, styled };\n"],"names":["routesToAntMenu","routes","result","forEach","route","item","key","to","label","icon","React","createElement","NavLink","end","href","children","push","DecafLayout","props","menuItems","menu","matchedMenuItems","useMatches","map","match","pathname","Layout","style","height","Header","paddingInline","display","justifyContent","alignItems","Link","gap","appIcon","Typography","Title","level","margin","appName","Menu","backgroundColor","border","mode","items","selectedKeys","Content","padding","decafTheme","hashed","components","colorBgHeader","Button","boxShadow","boxShadowSecondary","token","fontFamily","colorPrimary","colorBgBase","colorBgLayout","borderRadius","colorError","colorSuccess","colorWarning","colorInfo","green","red","blue","yellow","colorWhite","algorithm","theme","darkAlgorithm","buildRoutes","element","_route$element","Outlet","_props$config","_props$theme","_theme$token","_theme$token2","router","createBrowserRouter","basename","config","basePath","ConfigProvider","Global","styles","body","background","button","DecafApp","controller","RouterProvider"],"mappings":"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"}

package/dist/index.modern.mjs

@@ -1,2 +1,2 @@
-import{DecafApp as r}from"@decafhub/decaf-react";import{theme as o,ConfigProvider as e}from"antd";import c from"react";const t={hashed:!0,token:{colorPrimary:"#344961",colorBgBase:"#10161d",colorBgLayout:"#10161d",borderRadius:0,colorError:"#b03a38",colorSuccess:"#48734d",colorWarning:"#ffc107",colorInfo:"#4694ab",green:"#48734d",red:"#b03a38",blue:"#0d6efd",yellow:"#ffc107",colorWhite:"#fff"},algorithm:[o.darkAlgorithm]};function l(o){var l;return c.createElement(r,{config:o.config,controller:o.controller},c.createElement(e,{theme:null!=(l=o.theme)?l:t},o.children))}export{l as default};
+import{DecafApp as e}from"@decafhub/decaf-react";import{Global as t}from"@emotion/react";export{Global as GlobalStyle,css}from"@emotion/react";export{default as styled}from"@emotion/styled";import{Layout as o,Typography as n,Menu as r,theme as l,ConfigProvider as a}from"antd";import"antd/dist/reset.css";import c from"react";import{useMatches as i,Link as m,NavLink as s,createBrowserRouter as d,RouterProvider as f,Outlet as p}from"react-router-dom";function u(){return u=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&(e[n]=o[n])}return e},u.apply(this,arguments)}function b(e){const t=[];return e.forEach(e=>{const o={key:"to"in e?e.to:e.label,label:e.label,icon:e.icon};"to"in e&&e.to?o.label=c.createElement(s,{to:e.to,end:"/"===e.to},e.label):"href"in e&&e.href?o.label=c.createElement("a",{href:e.href},e.label):e.children&&(o.label=e.label,o.children=b(e.children||[])),t.push(o)}),t}function h(e){const t=b(e.menu),l=i().map(e=>e.pathname);return c.createElement(o,{style:{height:"100%"}},c.createElement(o.Header,{style:{paddingInline:0}},c.createElement("div",{style:{paddingInline:20,display:"flex",justifyContent:"space-between",alignItems:"center"}},c.createElement(m,{to:"/",style:{display:"flex",alignItems:"center",gap:10}},e.appIcon,c.createElement(n.Title,{level:4,style:{margin:0}},e.appName)),c.createElement(r,{style:{justifyContent:"flex-end",backgroundColor:"transparent",border:"none"},mode:"horizontal",items:t,selectedKeys:l}))),c.createElement(o.Content,{style:{padding:"20px 50px"}},e.children))}const y={hashed:!0,components:{Layout:{colorBgHeader:"#10161d"},Button:{boxShadow:"none",boxShadowSecondary:"none"}},token:{fontFamily:'"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"',colorPrimary:"#344961",colorBgBase:"#1a242f",colorBgLayout:"#1a242f",borderRadius:0,colorError:"#b03a38",colorSuccess:"#48734d",colorWarning:"#ffc107",colorInfo:"#4694ab",green:"#48734d",red:"#b03a38",blue:"#0d6efd",yellow:"#ffc107",colorWhite:"#fff"},algorithm:[l.darkAlgorithm]};function g(e,t){const o=[];return t.forEach(t=>{const n=u({},t);var r;t.children?(n.element=null!=(r=t.element)?r:c.createElement(p,null),n.children=g(e,t.children)):n.element=c.createElement(h,{menu:e.menuItems,appName:e.appName,appIcon:e.appIcon},t.element),o.push(n)}),o}function E(o){var n,r,l,i;const m=g(o,o.routes),s=d(m,{basename:null==(n=o.config)?void 0:n.basePath}),p=null!=(r=o.theme)?r:y;return c.createElement(a,{theme:p},c.createElement(t,{styles:{body:{background:null==(l=p.token)?void 0:l.colorBgBase,fontFamily:null==(i=p.token)?void 0:i.fontFamily,margin:0},button:{boxShadow:"none !important"}}}),c.createElement(e,{config:o.config,controller:o.controller},c.createElement(f,{router:s})))}export{E as DecafWebapp};
 //# sourceMappingURL=index.modern.mjs.map

package/dist/index.modern.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.modern.mjs","sources":["../src/theme.ts","../src/index.tsx"],"sourcesContent":["import { theme } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\n\nexport const decafTheme: ThemeConfig = {\n  hashed: true,\n  token: {\n    colorPrimary: '#344961',\n    colorBgBase: '#10161d',\n    colorBgLayout: '#10161d',\n    borderRadius: 0,\n    colorError: '#b03a38',\n    colorSuccess: '#48734d',\n    colorWarning: '#ffc107',\n    colorInfo: '#4694ab',\n    green: '#48734d',\n    red: '#b03a38',\n    blue: '#0d6efd',\n    yellow: '#ffc107',\n    colorWhite: '#fff',\n  },\n\n  algorithm: [theme.darkAlgorithm],\n};\n","import { DecafAppController, DecafApp, DecafAppConfig } from '@decafhub/decaf-react';\nimport { ConfigProvider } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\nimport React from 'react';\nimport { decafTheme } from 'theme';\n\nexport interface DecafWebappProps {\n  config?: DecafAppConfig;\n  controller?: DecafAppController;\n  theme?: ThemeConfig;\n  children: React.ReactNode;\n}\n\nexport default function DecafWebapp(props: DecafWebappProps) {\n  return (\n    <DecafApp config={props.config} controller={props.controller}>\n      <ConfigProvider theme={props.theme ?? decafTheme}>{props.children}</ConfigProvider>\n    </DecafApp>\n  );\n}\n"],"names":["decafTheme","hashed","token","colorPrimary","colorBgBase","colorBgLayout","borderRadius","colorError","colorSuccess","colorWarning","colorInfo","green","red","blue","yellow","colorWhite","algorithm","theme","darkAlgorithm","props","_props$theme","React","createElement","DecafApp","config","controller","ConfigProvider","children"],"mappings":"6HAGuBA,EAAgB,CACrCC,QAAQ,EACRC,MAAO,CACLC,aAAc,UACdC,YAAa,UACbC,cAAe,UACfC,aAAc,EACdC,WAAY,UACZC,aAAc,UACdC,aAAc,UACdC,UAAW,UACXC,MAAO,UACPC,IAAK,UACLC,KAAM,UACNC,OAAQ,UACRC,WAAY,QAGdC,UAAW,CAACC,EAAMC,gBCRI,WAAYC,GAAuB,IAAAC,EACzD,OACEC,EAAAC,cAACC,EAAQ,CAACC,OAAQL,EAAMK,OAAQC,WAAYN,EAAMM,YAChDJ,EAAAC,cAACI,EAAe,CAAAT,MAAkB,OAAXE,EAAAA,EAAMF,OAAKG,EAAIpB,GAAamB,EAAMQ,UAG/D"}
+{"version":3,"file":"index.modern.mjs","sources":["../src/Layout.tsx","../src/theme.ts","../src/index.tsx"],"sourcesContent":["import { Layout, Menu, Typography } from 'antd';\nimport { ItemType, SubMenuType } from 'antd/es/menu/hooks/useItems';\nimport React from 'react';\nimport { Link, NavLink, useMatches } from 'react-router-dom';\n\ninterface BaseDecafMenuItem {\n  label: any;\n  icon?: React.ReactNode;\n  children?: DecafMenuItem[];\n}\n\nexport type DecafMenuItem = BaseDecafMenuItem & ({ to?: string } | { href?: string });\n\nexport interface DecafLayoutProps {\n  menu: DecafMenuItem[];\n  appName: string;\n  appIcon?: React.ReactNode;\n  children: React.ReactNode;\n}\n\nexport function routesToAntMenu(routes: DecafMenuItem[]): ItemType[] {\n  const result: ItemType[] = [];\n\n  routes.forEach((route) => {\n    const item: ItemType = {\n      key: 'to' in route ? route.to : route.label,\n      label: route.label,\n      icon: route.icon,\n    };\n    if ('to' in route && route.to) {\n      item.label = (\n        <NavLink to={route.to} end={route.to === '/'}>\n          {route.label}\n        </NavLink>\n      );\n    } else if ('href' in route && route.href) {\n      item.label = <a href={route.href}>{route.label}</a>;\n    } else if (route.children) {\n      item.label = route.label;\n      (item as SubMenuType).children = routesToAntMenu(route.children || []);\n    }\n    result.push(item);\n  });\n\n  return result;\n}\n\nexport default function DecafLayout(props: DecafLayoutProps) {\n  const menuItems = routesToAntMenu(props.menu);\n  const matches = useMatches();\n  const matchedMenuItems = matches.map((match) => match.pathname);\n\n  return (\n    <Layout style={{ height: '100%' }}>\n      <Layout.Header style={{ paddingInline: 0 }}>\n        <div style={{ paddingInline: 20, display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>\n          <Link to=\"/\" style={{ display: 'flex', alignItems: 'center', gap: 10 }}>\n            {props.appIcon}\n            <Typography.Title level={4} style={{ margin: 0 }}>\n              {props.appName}\n            </Typography.Title>\n          </Link>\n          <Menu\n            style={{ justifyContent: 'flex-end', backgroundColor: 'transparent', border: 'none' }}\n            mode=\"horizontal\"\n            items={menuItems}\n            selectedKeys={matchedMenuItems}\n          />\n        </div>\n      </Layout.Header>\n      <Layout.Content style={{ padding: '20px 50px' }}>{props.children}</Layout.Content>\n    </Layout>\n  );\n}\n","import { theme } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\n\nexport const decafTheme: ThemeConfig = {\n  hashed: true,\n  components: {\n    Layout: {\n      colorBgHeader: '#10161d',\n    },\n    Button: {\n      boxShadow: 'none',\n      boxShadowSecondary: 'none',\n    },\n  },\n  token: {\n    fontFamily:\n      '\"Inter\",system-ui,-apple-system,\"Segoe UI\",Roboto,\"Helvetica Neue\",Arial,\"Noto Sans\",\"Liberation Sans\",sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\"',\n    colorPrimary: '#344961',\n    colorBgBase: '#1a242f',\n    colorBgLayout: '#1a242f',\n    borderRadius: 0,\n    colorError: '#b03a38',\n    colorSuccess: '#48734d',\n    colorWarning: '#ffc107',\n    colorInfo: '#4694ab',\n    green: '#48734d',\n    red: '#b03a38',\n    blue: '#0d6efd',\n    yellow: '#ffc107',\n    colorWhite: '#fff',\n  },\n\n  algorithm: [theme.darkAlgorithm],\n};\n","import { DecafApp, DecafAppConfig, DecafAppController } from '@decafhub/decaf-react';\nimport { css, Global } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { ConfigProvider } from 'antd';\nimport 'antd/dist/reset.css';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\nimport React from 'react';\nimport { createBrowserRouter, Outlet, RouteObject, RouterProvider } from 'react-router-dom';\nimport DecafLayout, { DecafMenuItem } from './Layout';\nimport { decafTheme } from './theme';\n\nexport type DecafRoute = RouteObject;\n\nexport interface DecafWebappProps {\n  config?: DecafAppConfig;\n  controller?: DecafAppController;\n  theme?: ThemeConfig;\n  routes: DecafRoute[];\n  menuItems: DecafMenuItem[];\n  appName: string;\n  appIcon?: React.ReactNode;\n}\n\nfunction buildRoutes(props: DecafWebappProps, routes: DecafRoute[]): RouteObject[] {\n  const result: RouteObject[] = [];\n\n  routes.forEach((route) => {\n    const item: RouteObject = { ...route };\n    if (route.children) {\n      item.element = route.element ?? <Outlet />;\n      item.children = buildRoutes(props, route.children);\n    } else {\n      item.element = (\n        <DecafLayout menu={props.menuItems} appName={props.appName} appIcon={props.appIcon}>\n          {route.element}\n        </DecafLayout>\n      );\n    }\n    result.push(item);\n  });\n\n  return result;\n}\n\nfunction DecafWebapp(props: DecafWebappProps) {\n  const routes = buildRoutes(props, props.routes);\n  const router = createBrowserRouter(routes, {\n    basename: props.config?.basePath,\n  });\n\n  const theme = props.theme ?? decafTheme;\n\n  return (\n    <ConfigProvider theme={theme}>\n      <Global\n        styles={{\n          body: {\n            background: theme.token?.colorBgBase,\n            fontFamily: theme.token?.fontFamily,\n            margin: 0,\n          },\n          button: {\n            // antd button has a default box shadow and we can't override it for now\n            boxShadow: 'none !important',\n          },\n        }}\n      />\n      <DecafApp config={props.config} controller={props.controller}>\n        <RouterProvider router={router} />\n      </DecafApp>\n    </ConfigProvider>\n  );\n}\n\nexport { DecafWebapp, Global as GlobalStyle, css, styled };\n"],"names":["routesToAntMenu","routes","result","forEach","route","key","to","label","icon","item","React","createElement","NavLink","end","href","children","push","DecafLayout","props","menuItems","menu","matchedMenuItems","useMatches","map","match","pathname","Layout","style","height","Header","paddingInline","display","justifyContent","alignItems","Link","gap","appIcon","Typography","Title","level","margin","appName","Menu","backgroundColor","border","mode","items","selectedKeys","Content","padding","decafTheme","hashed","components","colorBgHeader","Button","boxShadow","boxShadowSecondary","token","fontFamily","colorPrimary","colorBgBase","colorBgLayout","borderRadius","colorError","colorSuccess","colorWarning","colorInfo","green","red","blue","yellow","colorWhite","algorithm","theme","darkAlgorithm","buildRoutes","_extends","_route$element","element","Outlet","_props$config","_props$theme","_theme$token","_theme$token2","router","createBrowserRouter","basename","config","basePath","ConfigProvider","Global","styles","body","background","button","DecafApp","controller","RouterProvider"],"mappings":"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"}

package/dist/index.module.js

@@ -1,2 +1,2 @@
-import{DecafApp as r}from"@decafhub/decaf-react";import{theme as o,ConfigProvider as e}from"antd";import c from"react";var l={hashed:!0,token:{colorPrimary:"#344961",colorBgBase:"#10161d",colorBgLayout:"#10161d",borderRadius:0,colorError:"#b03a38",colorSuccess:"#48734d",colorWarning:"#ffc107",colorInfo:"#4694ab",green:"#48734d",red:"#b03a38",blue:"#0d6efd",yellow:"#ffc107",colorWhite:"#fff"},algorithm:[o.darkAlgorithm]};function t(o){var t;return c.createElement(r,{config:o.config,controller:o.controller},c.createElement(e,{theme:null!=(t=o.theme)?t:l},o.children))}export{t as default};
+import{DecafApp as e}from"@decafhub/decaf-react";import{Global as t}from"@emotion/react";export{Global as GlobalStyle,css}from"@emotion/react";export{default as styled}from"@emotion/styled";import{Layout as o,Typography as n,Menu as r,theme as a,ConfigProvider as l}from"antd";import"antd/dist/reset.css";import c from"react";import{useMatches as i,Link as m,NavLink as s,createBrowserRouter as d,RouterProvider as f,Outlet as p}from"react-router-dom";function u(){return u=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&(e[n]=o[n])}return e},u.apply(this,arguments)}function b(e){var t=[];return e.forEach(function(e){var o={key:"to"in e?e.to:e.label,label:e.label,icon:e.icon};"to"in e&&e.to?o.label=c.createElement(s,{to:e.to,end:"/"===e.to},e.label):"href"in e&&e.href?o.label=c.createElement("a",{href:e.href},e.label):e.children&&(o.label=e.label,o.children=b(e.children||[])),t.push(o)}),t}function h(e){var t=b(e.menu),a=i().map(function(e){return e.pathname});return c.createElement(o,{style:{height:"100%"}},c.createElement(o.Header,{style:{paddingInline:0}},c.createElement("div",{style:{paddingInline:20,display:"flex",justifyContent:"space-between",alignItems:"center"}},c.createElement(m,{to:"/",style:{display:"flex",alignItems:"center",gap:10}},e.appIcon,c.createElement(n.Title,{level:4,style:{margin:0}},e.appName)),c.createElement(r,{style:{justifyContent:"flex-end",backgroundColor:"transparent",border:"none"},mode:"horizontal",items:t,selectedKeys:a}))),c.createElement(o.Content,{style:{padding:"20px 50px"}},e.children))}var y={hashed:!0,components:{Layout:{colorBgHeader:"#10161d"},Button:{boxShadow:"none",boxShadowSecondary:"none"}},token:{fontFamily:'"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"',colorPrimary:"#344961",colorBgBase:"#1a242f",colorBgLayout:"#1a242f",borderRadius:0,colorError:"#b03a38",colorSuccess:"#48734d",colorWarning:"#ffc107",colorInfo:"#4694ab",green:"#48734d",red:"#b03a38",blue:"#0d6efd",yellow:"#ffc107",colorWhite:"#fff"},algorithm:[a.darkAlgorithm]};function g(e,t){var o=[];return t.forEach(function(t){var n,r=u({},t);t.children?(r.element=null!=(n=t.element)?n:c.createElement(p,null),r.children=g(e,t.children)):r.element=c.createElement(h,{menu:e.menuItems,appName:e.appName,appIcon:e.appIcon},t.element),o.push(r)}),o}function E(o){var n,r,a,i,m=g(o,o.routes),s=d(m,{basename:null==(n=o.config)?void 0:n.basePath}),p=null!=(r=o.theme)?r:y;return c.createElement(l,{theme:p},c.createElement(t,{styles:{body:{background:null==(a=p.token)?void 0:a.colorBgBase,fontFamily:null==(i=p.token)?void 0:i.fontFamily,margin:0},button:{boxShadow:"none !important"}}}),c.createElement(e,{config:o.config,controller:o.controller},c.createElement(f,{router:s})))}export{E as DecafWebapp};
 //# sourceMappingURL=index.module.js.map

package/dist/index.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.js","sources":["../src/theme.ts","../src/index.tsx"],"sourcesContent":["import { theme } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\n\nexport const decafTheme: ThemeConfig = {\n  hashed: true,\n  token: {\n    colorPrimary: '#344961',\n    colorBgBase: '#10161d',\n    colorBgLayout: '#10161d',\n    borderRadius: 0,\n    colorError: '#b03a38',\n    colorSuccess: '#48734d',\n    colorWarning: '#ffc107',\n    colorInfo: '#4694ab',\n    green: '#48734d',\n    red: '#b03a38',\n    blue: '#0d6efd',\n    yellow: '#ffc107',\n    colorWhite: '#fff',\n  },\n\n  algorithm: [theme.darkAlgorithm],\n};\n","import { DecafAppController, DecafApp, DecafAppConfig } from '@decafhub/decaf-react';\nimport { ConfigProvider } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\nimport React from 'react';\nimport { decafTheme } from 'theme';\n\nexport interface DecafWebappProps {\n  config?: DecafAppConfig;\n  controller?: DecafAppController;\n  theme?: ThemeConfig;\n  children: React.ReactNode;\n}\n\nexport default function DecafWebapp(props: DecafWebappProps) {\n  return (\n    <DecafApp config={props.config} controller={props.controller}>\n      <ConfigProvider theme={props.theme ?? decafTheme}>{props.children}</ConfigProvider>\n    </DecafApp>\n  );\n}\n"],"names":["decafTheme","hashed","token","colorPrimary","colorBgBase","colorBgLayout","borderRadius","colorError","colorSuccess","colorWarning","colorInfo","green","red","blue","yellow","colorWhite","algorithm","theme","darkAlgorithm","props","_props$theme","React","createElement","DecafApp","config","controller","ConfigProvider","children"],"mappings":"2HAGuBA,EAAgB,CACrCC,QAAQ,EACRC,MAAO,CACLC,aAAc,UACdC,YAAa,UACbC,cAAe,UACfC,aAAc,EACdC,WAAY,UACZC,aAAc,UACdC,aAAc,UACdC,UAAW,UACXC,MAAO,UACPC,IAAK,UACLC,KAAM,UACNC,OAAQ,UACRC,WAAY,QAGdC,UAAW,CAACC,EAAMC,gBCRI,WAAYC,GAAuB,IAAAC,EACzD,OACEC,EAAAC,cAACC,EAAQ,CAACC,OAAQL,EAAMK,OAAQC,WAAYN,EAAMM,YAChDJ,EAAAC,cAACI,EAAe,CAAAT,MAAkB,OAAXE,EAAAA,EAAMF,OAAKG,EAAIpB,GAAamB,EAAMQ,UAG/D"}
+{"version":3,"file":"index.module.js","sources":["../src/Layout.tsx","../src/theme.ts","../src/index.tsx"],"sourcesContent":["import { Layout, Menu, Typography } from 'antd';\nimport { ItemType, SubMenuType } from 'antd/es/menu/hooks/useItems';\nimport React from 'react';\nimport { Link, NavLink, useMatches } from 'react-router-dom';\n\ninterface BaseDecafMenuItem {\n  label: any;\n  icon?: React.ReactNode;\n  children?: DecafMenuItem[];\n}\n\nexport type DecafMenuItem = BaseDecafMenuItem & ({ to?: string } | { href?: string });\n\nexport interface DecafLayoutProps {\n  menu: DecafMenuItem[];\n  appName: string;\n  appIcon?: React.ReactNode;\n  children: React.ReactNode;\n}\n\nexport function routesToAntMenu(routes: DecafMenuItem[]): ItemType[] {\n  const result: ItemType[] = [];\n\n  routes.forEach((route) => {\n    const item: ItemType = {\n      key: 'to' in route ? route.to : route.label,\n      label: route.label,\n      icon: route.icon,\n    };\n    if ('to' in route && route.to) {\n      item.label = (\n        <NavLink to={route.to} end={route.to === '/'}>\n          {route.label}\n        </NavLink>\n      );\n    } else if ('href' in route && route.href) {\n      item.label = <a href={route.href}>{route.label}</a>;\n    } else if (route.children) {\n      item.label = route.label;\n      (item as SubMenuType).children = routesToAntMenu(route.children || []);\n    }\n    result.push(item);\n  });\n\n  return result;\n}\n\nexport default function DecafLayout(props: DecafLayoutProps) {\n  const menuItems = routesToAntMenu(props.menu);\n  const matches = useMatches();\n  const matchedMenuItems = matches.map((match) => match.pathname);\n\n  return (\n    <Layout style={{ height: '100%' }}>\n      <Layout.Header style={{ paddingInline: 0 }}>\n        <div style={{ paddingInline: 20, display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>\n          <Link to=\"/\" style={{ display: 'flex', alignItems: 'center', gap: 10 }}>\n            {props.appIcon}\n            <Typography.Title level={4} style={{ margin: 0 }}>\n              {props.appName}\n            </Typography.Title>\n          </Link>\n          <Menu\n            style={{ justifyContent: 'flex-end', backgroundColor: 'transparent', border: 'none' }}\n            mode=\"horizontal\"\n            items={menuItems}\n            selectedKeys={matchedMenuItems}\n          />\n        </div>\n      </Layout.Header>\n      <Layout.Content style={{ padding: '20px 50px' }}>{props.children}</Layout.Content>\n    </Layout>\n  );\n}\n","import { theme } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\n\nexport const decafTheme: ThemeConfig = {\n  hashed: true,\n  components: {\n    Layout: {\n      colorBgHeader: '#10161d',\n    },\n    Button: {\n      boxShadow: 'none',\n      boxShadowSecondary: 'none',\n    },\n  },\n  token: {\n    fontFamily:\n      '\"Inter\",system-ui,-apple-system,\"Segoe UI\",Roboto,\"Helvetica Neue\",Arial,\"Noto Sans\",\"Liberation Sans\",sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\"',\n    colorPrimary: '#344961',\n    colorBgBase: '#1a242f',\n    colorBgLayout: '#1a242f',\n    borderRadius: 0,\n    colorError: '#b03a38',\n    colorSuccess: '#48734d',\n    colorWarning: '#ffc107',\n    colorInfo: '#4694ab',\n    green: '#48734d',\n    red: '#b03a38',\n    blue: '#0d6efd',\n    yellow: '#ffc107',\n    colorWhite: '#fff',\n  },\n\n  algorithm: [theme.darkAlgorithm],\n};\n","import { DecafApp, DecafAppConfig, DecafAppController } from '@decafhub/decaf-react';\nimport { css, Global } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { ConfigProvider } from 'antd';\nimport 'antd/dist/reset.css';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\nimport React from 'react';\nimport { createBrowserRouter, Outlet, RouteObject, RouterProvider } from 'react-router-dom';\nimport DecafLayout, { DecafMenuItem } from './Layout';\nimport { decafTheme } from './theme';\n\nexport type DecafRoute = RouteObject;\n\nexport interface DecafWebappProps {\n  config?: DecafAppConfig;\n  controller?: DecafAppController;\n  theme?: ThemeConfig;\n  routes: DecafRoute[];\n  menuItems: DecafMenuItem[];\n  appName: string;\n  appIcon?: React.ReactNode;\n}\n\nfunction buildRoutes(props: DecafWebappProps, routes: DecafRoute[]): RouteObject[] {\n  const result: RouteObject[] = [];\n\n  routes.forEach((route) => {\n    const item: RouteObject = { ...route };\n    if (route.children) {\n      item.element = route.element ?? <Outlet />;\n      item.children = buildRoutes(props, route.children);\n    } else {\n      item.element = (\n        <DecafLayout menu={props.menuItems} appName={props.appName} appIcon={props.appIcon}>\n          {route.element}\n        </DecafLayout>\n      );\n    }\n    result.push(item);\n  });\n\n  return result;\n}\n\nfunction DecafWebapp(props: DecafWebappProps) {\n  const routes = buildRoutes(props, props.routes);\n  const router = createBrowserRouter(routes, {\n    basename: props.config?.basePath,\n  });\n\n  const theme = props.theme ?? decafTheme;\n\n  return (\n    <ConfigProvider theme={theme}>\n      <Global\n        styles={{\n          body: {\n            background: theme.token?.colorBgBase,\n            fontFamily: theme.token?.fontFamily,\n            margin: 0,\n          },\n          button: {\n            // antd button has a default box shadow and we can't override it for now\n            boxShadow: 'none !important',\n          },\n        }}\n      />\n      <DecafApp config={props.config} controller={props.controller}>\n        <RouterProvider router={router} />\n      </DecafApp>\n    </ConfigProvider>\n  );\n}\n\nexport { DecafWebapp, Global as GlobalStyle, css, styled };\n"],"names":["routesToAntMenu","routes","result","forEach","route","item","key","to","label","icon","React","createElement","NavLink","end","href","children","push","DecafLayout","props","menuItems","menu","matchedMenuItems","useMatches","map","match","pathname","Layout","style","height","Header","paddingInline","display","justifyContent","alignItems","Link","gap","appIcon","Typography","Title","level","margin","appName","Menu","backgroundColor","border","mode","items","selectedKeys","Content","padding","decafTheme","hashed","components","colorBgHeader","Button","boxShadow","boxShadowSecondary","token","fontFamily","colorPrimary","colorBgBase","colorBgLayout","borderRadius","colorError","colorSuccess","colorWarning","colorInfo","green","red","blue","yellow","colorWhite","algorithm","theme","darkAlgorithm","buildRoutes","element","_route$element","Outlet","_props$config","_props$theme","_theme$token","_theme$token2","router","createBrowserRouter","basename","config","basePath","ConfigProvider","Global","styles","body","background","button","DecafApp","controller","RouterProvider"],"mappings":"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"}

package/dist/index.umd.js

@@ -1,2 +1,2 @@
-!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r(require("@decafhub/decaf-react"),require("antd"),require("react")):"function"==typeof define&&define.amd?define(["@decafhub/decaf-react","antd","react"],r):(e||self).decafReactWebapp=r(e.decafReact,e.antd,e.react)}(this,function(e,r,o){function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=/*#__PURE__*/t(o),c={hashed:!0,token:{colorPrimary:"#344961",colorBgBase:"#10161d",colorBgLayout:"#10161d",borderRadius:0,colorError:"#b03a38",colorSuccess:"#48734d",colorWarning:"#ffc107",colorInfo:"#4694ab",green:"#48734d",red:"#b03a38",blue:"#0d6efd",yellow:"#ffc107",colorWhite:"#fff"},algorithm:[r.theme.darkAlgorithm]};return function(o){var t;return a.default.createElement(e.DecafApp,{config:o.config,controller:o.controller},a.default.createElement(r.ConfigProvider,{theme:null!=(t=o.theme)?t:c},o.children))}});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@decafhub/decaf-react"),require("@emotion/react"),require("@emotion/styled"),require("antd"),require("antd/dist/reset.css"),require("react"),require("react-router-dom")):"function"==typeof define&&define.amd?define(["exports","@decafhub/decaf-react","@emotion/react","@emotion/styled","antd","antd/dist/reset.css","react","react-router-dom"],t):t((e||self).decafReactWebapp={},e.decafReact,e.react,e.styled,e.antd,0,e.react,e.reactRouterDom)}(this,function(e,t,n,o,r,a,l,c){function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=/*#__PURE__*/i(o),d=/*#__PURE__*/i(l);function f(){return f=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},f.apply(this,arguments)}function s(e){var t=[];return e.forEach(function(e){var n={key:"to"in e?e.to:e.label,label:e.label,icon:e.icon};"to"in e&&e.to?n.label=d.default.createElement(c.NavLink,{to:e.to,end:"/"===e.to},e.label):"href"in e&&e.href?n.label=d.default.createElement("a",{href:e.href},e.label):e.children&&(n.label=e.label,n.children=s(e.children||[])),t.push(n)}),t}function m(e){var t=s(e.menu),n=c.useMatches().map(function(e){return e.pathname});return d.default.createElement(r.Layout,{style:{height:"100%"}},d.default.createElement(r.Layout.Header,{style:{paddingInline:0}},d.default.createElement("div",{style:{paddingInline:20,display:"flex",justifyContent:"space-between",alignItems:"center"}},d.default.createElement(c.Link,{to:"/",style:{display:"flex",alignItems:"center",gap:10}},e.appIcon,d.default.createElement(r.Typography.Title,{level:4,style:{margin:0}},e.appName)),d.default.createElement(r.Menu,{style:{justifyContent:"flex-end",backgroundColor:"transparent",border:"none"},mode:"horizontal",items:t,selectedKeys:n}))),d.default.createElement(r.Layout.Content,{style:{padding:"20px 50px"}},e.children))}var p={hashed:!0,components:{Layout:{colorBgHeader:"#10161d"},Button:{boxShadow:"none",boxShadowSecondary:"none"}},token:{fontFamily:'"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"',colorPrimary:"#344961",colorBgBase:"#1a242f",colorBgLayout:"#1a242f",borderRadius:0,colorError:"#b03a38",colorSuccess:"#48734d",colorWarning:"#ffc107",colorInfo:"#4694ab",green:"#48734d",red:"#b03a38",blue:"#0d6efd",yellow:"#ffc107",colorWhite:"#fff"},algorithm:[r.theme.darkAlgorithm]};function b(e,t){var n=[];return t.forEach(function(t){var o,r=f({},t);t.children?(r.element=null!=(o=t.element)?o:d.default.createElement(c.Outlet,null),r.children=b(e,t.children)):r.element=d.default.createElement(m,{menu:e.menuItems,appName:e.appName,appIcon:e.appIcon},t.element),n.push(r)}),n}Object.defineProperty(e,"GlobalStyle",{enumerable:!0,get:function(){return n.Global}}),Object.defineProperty(e,"css",{enumerable:!0,get:function(){return n.css}}),Object.defineProperty(e,"styled",{enumerable:!0,get:function(){return u.default}}),e.DecafWebapp=function(e){var o,a,l,i,u=b(e,e.routes),f=c.createBrowserRouter(u,{basename:null==(o=e.config)?void 0:o.basePath}),s=null!=(a=e.theme)?a:p;return d.default.createElement(r.ConfigProvider,{theme:s},d.default.createElement(n.Global,{styles:{body:{background:null==(l=s.token)?void 0:l.colorBgBase,fontFamily:null==(i=s.token)?void 0:i.fontFamily,margin:0},button:{boxShadow:"none !important"}}}),d.default.createElement(t.DecafApp,{config:e.config,controller:e.controller},d.default.createElement(c.RouterProvider,{router:f})))}});
 //# sourceMappingURL=index.umd.js.map

package/dist/index.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.umd.js","sources":["../src/theme.ts","../src/index.tsx"],"sourcesContent":["import { theme } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\n\nexport const decafTheme: ThemeConfig = {\n  hashed: true,\n  token: {\n    colorPrimary: '#344961',\n    colorBgBase: '#10161d',\n    colorBgLayout: '#10161d',\n    borderRadius: 0,\n    colorError: '#b03a38',\n    colorSuccess: '#48734d',\n    colorWarning: '#ffc107',\n    colorInfo: '#4694ab',\n    green: '#48734d',\n    red: '#b03a38',\n    blue: '#0d6efd',\n    yellow: '#ffc107',\n    colorWhite: '#fff',\n  },\n\n  algorithm: [theme.darkAlgorithm],\n};\n","import { DecafAppController, DecafApp, DecafAppConfig } from '@decafhub/decaf-react';\nimport { ConfigProvider } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\nimport React from 'react';\nimport { decafTheme } from 'theme';\n\nexport interface DecafWebappProps {\n  config?: DecafAppConfig;\n  controller?: DecafAppController;\n  theme?: ThemeConfig;\n  children: React.ReactNode;\n}\n\nexport default function DecafWebapp(props: DecafWebappProps) {\n  return (\n    <DecafApp config={props.config} controller={props.controller}>\n      <ConfigProvider theme={props.theme ?? decafTheme}>{props.children}</ConfigProvider>\n    </DecafApp>\n  );\n}\n"],"names":["decafTheme","hashed","token","colorPrimary","colorBgBase","colorBgLayout","borderRadius","colorError","colorSuccess","colorWarning","colorInfo","green","red","blue","yellow","colorWhite","algorithm","theme","darkAlgorithm","props","_props$theme","React","createElement","DecafApp","config","controller","ConfigProvider","children"],"mappings":"6cAGuBA,EAAgB,CACrCC,QAAQ,EACRC,MAAO,CACLC,aAAc,UACdC,YAAa,UACbC,cAAe,UACfC,aAAc,EACdC,WAAY,UACZC,aAAc,UACdC,aAAc,UACdC,UAAW,UACXC,MAAO,UACPC,IAAK,UACLC,KAAM,UACNC,OAAQ,UACRC,WAAY,QAGdC,UAAW,CAACC,EAAAA,MAAMC,uBCRI,SAAYC,GAAuB,IAAAC,EACzD,OACEC,EAAA,QAAAC,cAACC,WAAQ,CAACC,OAAQL,EAAMK,OAAQC,WAAYN,EAAMM,YAChDJ,EAAA,QAAAC,cAACI,EAAcA,eAAC,CAAAT,MAAkB,OAAXE,EAAAA,EAAMF,OAAKG,EAAIpB,GAAamB,EAAMQ,UAG/D"}
+{"version":3,"file":"index.umd.js","sources":["../src/Layout.tsx","../src/theme.ts","../src/index.tsx"],"sourcesContent":["import { Layout, Menu, Typography } from 'antd';\nimport { ItemType, SubMenuType } from 'antd/es/menu/hooks/useItems';\nimport React from 'react';\nimport { Link, NavLink, useMatches } from 'react-router-dom';\n\ninterface BaseDecafMenuItem {\n  label: any;\n  icon?: React.ReactNode;\n  children?: DecafMenuItem[];\n}\n\nexport type DecafMenuItem = BaseDecafMenuItem & ({ to?: string } | { href?: string });\n\nexport interface DecafLayoutProps {\n  menu: DecafMenuItem[];\n  appName: string;\n  appIcon?: React.ReactNode;\n  children: React.ReactNode;\n}\n\nexport function routesToAntMenu(routes: DecafMenuItem[]): ItemType[] {\n  const result: ItemType[] = [];\n\n  routes.forEach((route) => {\n    const item: ItemType = {\n      key: 'to' in route ? route.to : route.label,\n      label: route.label,\n      icon: route.icon,\n    };\n    if ('to' in route && route.to) {\n      item.label = (\n        <NavLink to={route.to} end={route.to === '/'}>\n          {route.label}\n        </NavLink>\n      );\n    } else if ('href' in route && route.href) {\n      item.label = <a href={route.href}>{route.label}</a>;\n    } else if (route.children) {\n      item.label = route.label;\n      (item as SubMenuType).children = routesToAntMenu(route.children || []);\n    }\n    result.push(item);\n  });\n\n  return result;\n}\n\nexport default function DecafLayout(props: DecafLayoutProps) {\n  const menuItems = routesToAntMenu(props.menu);\n  const matches = useMatches();\n  const matchedMenuItems = matches.map((match) => match.pathname);\n\n  return (\n    <Layout style={{ height: '100%' }}>\n      <Layout.Header style={{ paddingInline: 0 }}>\n        <div style={{ paddingInline: 20, display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>\n          <Link to=\"/\" style={{ display: 'flex', alignItems: 'center', gap: 10 }}>\n            {props.appIcon}\n            <Typography.Title level={4} style={{ margin: 0 }}>\n              {props.appName}\n            </Typography.Title>\n          </Link>\n          <Menu\n            style={{ justifyContent: 'flex-end', backgroundColor: 'transparent', border: 'none' }}\n            mode=\"horizontal\"\n            items={menuItems}\n            selectedKeys={matchedMenuItems}\n          />\n        </div>\n      </Layout.Header>\n      <Layout.Content style={{ padding: '20px 50px' }}>{props.children}</Layout.Content>\n    </Layout>\n  );\n}\n","import { theme } from 'antd';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\n\nexport const decafTheme: ThemeConfig = {\n  hashed: true,\n  components: {\n    Layout: {\n      colorBgHeader: '#10161d',\n    },\n    Button: {\n      boxShadow: 'none',\n      boxShadowSecondary: 'none',\n    },\n  },\n  token: {\n    fontFamily:\n      '\"Inter\",system-ui,-apple-system,\"Segoe UI\",Roboto,\"Helvetica Neue\",Arial,\"Noto Sans\",\"Liberation Sans\",sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\"',\n    colorPrimary: '#344961',\n    colorBgBase: '#1a242f',\n    colorBgLayout: '#1a242f',\n    borderRadius: 0,\n    colorError: '#b03a38',\n    colorSuccess: '#48734d',\n    colorWarning: '#ffc107',\n    colorInfo: '#4694ab',\n    green: '#48734d',\n    red: '#b03a38',\n    blue: '#0d6efd',\n    yellow: '#ffc107',\n    colorWhite: '#fff',\n  },\n\n  algorithm: [theme.darkAlgorithm],\n};\n","import { DecafApp, DecafAppConfig, DecafAppController } from '@decafhub/decaf-react';\nimport { css, Global } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { ConfigProvider } from 'antd';\nimport 'antd/dist/reset.css';\nimport { ThemeConfig } from 'antd/es/config-provider/context';\nimport React from 'react';\nimport { createBrowserRouter, Outlet, RouteObject, RouterProvider } from 'react-router-dom';\nimport DecafLayout, { DecafMenuItem } from './Layout';\nimport { decafTheme } from './theme';\n\nexport type DecafRoute = RouteObject;\n\nexport interface DecafWebappProps {\n  config?: DecafAppConfig;\n  controller?: DecafAppController;\n  theme?: ThemeConfig;\n  routes: DecafRoute[];\n  menuItems: DecafMenuItem[];\n  appName: string;\n  appIcon?: React.ReactNode;\n}\n\nfunction buildRoutes(props: DecafWebappProps, routes: DecafRoute[]): RouteObject[] {\n  const result: RouteObject[] = [];\n\n  routes.forEach((route) => {\n    const item: RouteObject = { ...route };\n    if (route.children) {\n      item.element = route.element ?? <Outlet />;\n      item.children = buildRoutes(props, route.children);\n    } else {\n      item.element = (\n        <DecafLayout menu={props.menuItems} appName={props.appName} appIcon={props.appIcon}>\n          {route.element}\n        </DecafLayout>\n      );\n    }\n    result.push(item);\n  });\n\n  return result;\n}\n\nfunction DecafWebapp(props: DecafWebappProps) {\n  const routes = buildRoutes(props, props.routes);\n  const router = createBrowserRouter(routes, {\n    basename: props.config?.basePath,\n  });\n\n  const theme = props.theme ?? decafTheme;\n\n  return (\n    <ConfigProvider theme={theme}>\n      <Global\n        styles={{\n          body: {\n            background: theme.token?.colorBgBase,\n            fontFamily: theme.token?.fontFamily,\n            margin: 0,\n          },\n          button: {\n            // antd button has a default box shadow and we can't override it for now\n            boxShadow: 'none !important',\n          },\n        }}\n      />\n      <DecafApp config={props.config} controller={props.controller}>\n        <RouterProvider router={router} />\n      </DecafApp>\n    </ConfigProvider>\n  );\n}\n\nexport { DecafWebapp, Global as GlobalStyle, css, styled };\n"],"names":["routesToAntMenu","routes","result","forEach","route","item","key","to","label","icon","React","createElement","NavLink","end","href","children","push","DecafLayout","props","menuItems","menu","matchedMenuItems","useMatches","map","match","pathname","Layout","style","height","Header","paddingInline","display","justifyContent","alignItems","Link","gap","appIcon","Typography","Title","level","margin","appName","Menu","backgroundColor","border","mode","items","selectedKeys","Content","padding","decafTheme","hashed","components","colorBgHeader","Button","boxShadow","boxShadowSecondary","token","fontFamily","colorPrimary","colorBgBase","colorBgLayout","borderRadius","colorError","colorSuccess","colorWarning","colorInfo","green","red","blue","yellow","colorWhite","algorithm","theme","darkAlgorithm","buildRoutes","element","_route$element","Outlet","_props$config","_props$theme","_theme$token","_theme$token2","router","createBrowserRouter","basename","config","basePath","ConfigProvider","Global","styles","body","background","button","DecafApp","controller","RouterProvider"],"mappings":"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"}

package/dist/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAE9D,eAAO,MAAM,UAAU,EAAE,WAmBxB,CAAC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAE9D,eAAO,MAAM,UAAU,EAAE,WA8BxB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decafhub/decaf-react-webapp",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "keywords": [
     "decafhub",
     "react"
@@ -33,14 +33,20 @@
     "node": ">=16"
   },
   "peerDependencies": {
+    "@ant-design/icons": "^4.8.0",
     "@decafhub/decaf-client": "^0.3",
     "@decafhub/decaf-react": "^0.1",
     "antd": "^5.0.0",
     "react": "^17.0.0 || ^18.0.0",
-    "react-dom": "^17.0.0 || ^18.0.0"
+    "react-dom": "^17.0.0 || ^18.0.0",
+    "react-router-dom": "^6.0.0"
+  },
+  "dependencies": {
+    "@emotion/react": "^11.10.5",
+    "@emotion/styled": "^11.10.5"
   },
-  "dependencies": {},
   "devDependencies": {
+    "@ant-design/icons": "^4.8.0",
     "@commitlint/cli": "^17.3.0",
     "@commitlint/config-conventional": "^17.3.0",
     "@decafhub/decaf-client": "^0.3.1",
@@ -77,6 +83,7 @@
     "prettier": "^2.8.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-router-dom": "^6.4.3",
     "ts-jest": "^29.0.3",
     "typedoc": "^0.23.21",
     "typescript": "^4.9.3"