@dgui/react-web-material-bars 1.7.6 → 1.8.0

package/dist/cjs/AppBar.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import DrawerToggle from './DrawerToggle';
+import Tabs from './Tabs';
+import { useSelectTab, useTabIndex, useTabOrder, useTabs } from '@dgui/react-shared';
+import { ReactWebDigestAppBar } from '@dgui/react-web';
+import { useCallback, useMemo } from 'react';
+const styles = {
+    appBar: {
+        alignItems: 'center',
+        backgroundColor: '#CCC',
+        boxShadow: '0 0 10px 5px rgba(0, 0, 0, 0.1)',
+        display: 'flex',
+        flexDirection: 'row',
+        position: 'relative',
+        zIndex: 102
+    }
+};
+const AppBar = ({ appBarStyle: givenAppBarStyle, children, icon, tabBarStyle, ...props }) => {
+    const appBarStyle = useMemo(() => {
+        return {
+            ...styles['appBar'],
+            ...givenAppBarStyle
+        };
+    }, [
+        givenAppBarStyle
+    ]);
+    const selectTab = useSelectTab();
+    const tabIndex = useTabIndex();
+    const handleSelectTab = useCallback((index) => {
+        selectTab(index);
+    }, [
+        selectTab
+    ]);
+    const tabOrder = useTabOrder();
+    const tabs = useTabs();
+    const routes = useMemo(() => {
+        return tabOrder.map((tabId) => {
+            return {
+                accessibilityLabel: tabs[tabId]?.title ?? tabId,
+                icon: undefined,
+                key: tabId,
+                title: tabs[tabId]?.title ?? tabId
+            };
+        });
+    }, [
+        tabOrder,
+        tabs
+    ]);
+    return (_jsx(ReactWebDigestAppBar, { children: _jsxs("div", { style: appBarStyle, children: [_jsx(DrawerToggle, { icon: icon }), _jsx(Tabs, { ...props, defaultIndex: tabIndex, onSelectTab: handleSelectTab, routes: routes, style: tabBarStyle }), children] }) }));
+};
+export default AppBar;
+//# sourceMappingURL=AppBar.js.map

package/dist/cjs/AppBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppBar.js","sourceRoot":"","sources":["../../src/AppBar.tsx"],"names":[],"mappings":";AAAA,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,EACL,YAAY,EACZ,WAAW,EACX,WAAW,EACX,OAAO,EACR,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,oBAAoB,EACrB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAIL,WAAW,EACX,OAAO,EACR,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,GAER;IACF,MAAM,EAAE;QACN,UAAU,EAAE,QAAQ;QACpB,eAAe,EAAE,MAAM;QACvB,SAAS,EAAE,iCAAiC;QAC5C,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,KAAK;QACpB,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,GAAG;KACZ;CACF,CAAC;AAEF,MAAM,MAAM,GAAmC,CAAC,EAC9C,WAAW,EAAE,gBAAgB,EAC7B,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,WAAW,GAAkB,OAAO,CACxC,GAAG,EAAE;QACH,OAAO;YACL,GAAG,MAAM,CAAC,QAAQ,CAAC;YACnB,GAAG,gBAAgB;SACpB,CAAC;IACJ,CAAC,EACD;QACE,gBAAgB;KACjB,CACF,CAAC;IAEF,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;IACjC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,MAAM,eAAe,GAAG,WAAW,CACjC,CACE,KAAa,EACb,EAAE;QACF,SAAS,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,EACD;QACE,SAAS;KACV,CACF,CAAC;IAEF,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IAEvB,MAAM,MAAM,GAAG,OAAO,CACpB,GAAG,EAAE;QACH,OAAO,QAAQ,CAAC,GAAG,CACjB,CACE,KAAK,EACL,EAAE;YACF,OAAO;gBACL,kBAAkB,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,KAAK,IAAI,KAAK;gBAC/C,IAAI,EAAE,SAAS;gBACf,GAAG,EAAE,KAAK;gBACV,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,KAAK,IAAI,KAAK;aACnC,CAAC;QACJ,CAAC,CACF,CAAC;IACJ,CAAC,EACD;QACE,QAAQ;QACR,IAAI;KACL,CACF,CAAC;IAEF,OAAO,CACL,KAAC,oBAAoB,cACnB,eACE,KAAK,EAAE,WAAW,aAElB,KAAC,YAAY,IACX,IAAI,EAAE,IAAI,GACV,EACF,KAAC,IAAI,OACC,KAAK,EACT,YAAY,EAAE,QAAQ,EACtB,WAAW,EAAE,eAAe,EAC5B,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,WAAW,GAClB,EACD,QAAQ,IACL,GACe,CACxB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/cjs/DrawerBar.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Tabs from './Tabs';
+import { useDrawerIndex, useDrawerOrder, useDrawers, useSelectDrawer } from '@dgui/react-shared';
+import { ReactWebDigestDrawerBar } from '@dgui/react-web';
+import { useCallback, useMemo } from 'react';
+const styles = {
+    tabBar: {
+        backgroundColor: '#CCC',
+        display: 'flex',
+        flexDirection: 'row'
+    }
+};
+const DrawerBar = () => {
+    const drawerIndex = useDrawerIndex();
+    const selectDrawer = useSelectDrawer();
+    const handleSelectDrawer = useCallback((tabIndex) => {
+        selectDrawer(tabIndex);
+    }, [
+        selectDrawer
+    ]);
+    const drawerOrder = useDrawerOrder();
+    const drawers = useDrawers();
+    const routes = useMemo(() => {
+        return drawerOrder.map((drawerId) => {
+            return ({
+                key: drawerId,
+                title: drawers[drawerId]?.title ?? drawerId
+            });
+        });
+    }, [
+        drawerOrder,
+        drawers
+    ]);
+    return (_jsx(ReactWebDigestDrawerBar, { children: _jsx("div", { style: styles['tabBar'], children: _jsx(Tabs, { defaultIndex: drawerIndex, onSelectTab: handleSelectDrawer, routes: routes }) }) }));
+};
+export default DrawerBar;
+//# sourceMappingURL=DrawerBar.js.map

package/dist/cjs/DrawerBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerBar.js","sourceRoot":"","sources":["../../src/DrawerBar.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,EACL,cAAc,EACd,cAAc,EACd,UAAU,EACV,eAAe,EAChB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,uBAAuB,EACxB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAGL,WAAW,EACX,OAAO,EACR,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,GAER;IACF,MAAM,EAAE;QACN,eAAe,EAAE,MAAM;QAEvB,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,KAAK;KACrB;CACF,CAAC;AAEF,MAAM,SAAS,GAAsC,GAAG,EAAE;IACxD,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,MAAM,kBAAkB,GAAG,WAAW,CACpC,CACE,QAAgB,EAChB,EAAE;QACF,YAAY,CAAC,QAAQ,CAAC,CAAC;IACzB,CAAC,EACD;QACE,YAAY;KACb,CACF,CAAC;IAEF,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAE7B,MAAM,MAAM,GAAG,OAAO,CACpB,GAAG,EAAE;QACH,OAAO,WAAW,CAAC,GAAG,CACpB,CACE,QAAQ,EACR,EAAE;YACF,OAAO,CACL;gBACE,GAAG,EAAE,QAAQ;gBACb,KAAK,EAAE,OAAO,CAAC,QAAQ,CAAC,EAAE,KAAK,IAAI,QAAQ;aAC5C,CACF,CAAC;QACJ,CAAC,CACF,CAAC;IACJ,CAAC,EACD;QACE,WAAW;QACX,OAAO;KACR,CACF,CAAC;IAEF,OAAO,CACL,KAAC,uBAAuB,cACtB,cACE,KAAK,EAAE,MAAM,CAAC,QAAQ,CAAC,YAEvB,KAAC,IAAI,IACH,YAAY,EAAE,WAAW,EACzB,WAAW,EAAE,kBAAkB,EAC/B,MAAM,EAAE,MAAM,GACd,GACE,GACkB,CAC3B,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/cjs/DrawerToggle.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useDrawerToggle } from '@dgui/react-shared';
+import MenuIcon from '@mui/icons-material/Menu';
+import IconButton from '@mui/material/IconButton';
+import { memo, useCallback } from 'react';
+const styles = {
+    iconButton: {
+        margin: 0
+    }
+};
+const DrawerToggle = ({ icon: Icon }) => {
+    const toggleDrawer = useDrawerToggle();
+    const onClick = useCallback(() => {
+        if (toggleDrawer) {
+            toggleDrawer();
+        }
+    }, [
+        toggleDrawer
+    ]);
+    return (_jsx(IconButton, { "aria-label": 'open drawer', onClick: onClick, style: styles['iconButton'], children: Icon ?
+            _jsx(Icon, {}) :
+            _jsx(MenuIcon, {}) }));
+};
+export default memo(DrawerToggle);
+//# sourceMappingURL=DrawerToggle.js.map

package/dist/cjs/DrawerToggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerToggle.js","sourceRoot":"","sources":["../../src/DrawerToggle.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,eAAe,EAChB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,QAAQ,MAAM,0BAA0B,CAAC;AAChD,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAGL,IAAI,EACJ,WAAW,EACZ,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,GAER;IACF,UAAU,EAAE;QACV,MAAM,EAAE,CAAC;KACV;CACF,CAAC;AAEF,MAAM,YAAY,GAAyC,CAAC,EAC1D,IAAI,EAAE,IAAI,EACX,EAAE,EAAE;IACH,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,MAAM,OAAO,GAAG,WAAW,CACzB,GAAG,EAAE;QACH,IAAI,YAAY,EAAE,CAAC;YACjB,YAAY,EAAE,CAAC;QACjB,CAAC;IACH,CAAC,EACD;QACE,YAAY;KACb,CACF,CAAC;IAEF,OAAO,CACL,KAAC,UAAU,kBACE,aAAa,EACxB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,MAAM,CAAC,YAAY,CAAC,YAGzB,IAAI,CAAC,CAAC;YACJ,KAAC,IAAI,KAAG,CAAC,CAAC;YACV,KAAC,QAAQ,KAAG,GAEL,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,IAAI,CACjB,YAAY,CACb,CAAC"}

package/dist/cjs/Tab.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import GenericTab from '@mui/material/Tab';
+const Tab = ({ label, tabIndex, ...rest }) => {
+    return (_jsx(GenericTab, { label: label, style: {
+            height: '20px'
+        }, value: tabIndex, ...rest }));
+};
+export default Tab;
+//# sourceMappingURL=Tab.js.map

package/dist/cjs/Tab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.js","sourceRoot":"","sources":["../../src/Tab.tsx"],"names":[],"mappings":";AAAA,OAAO,UAEN,MAAM,mBAAmB,CAAC;AAM3B,MAAM,GAAG,GAAgC,CAAC,EACxC,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,EAAE;IACH,OAAO,CACL,KAAC,UAAU,IACT,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE;YACL,MAAM,EAAE,MAAM;SACf,EACD,KAAK,EAAE,QAAQ,KACX,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,GAAG,CAAC"}

package/dist/cjs/Tabs.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import renderScene from './renderScene';
+import MaterialTabs from '@mui/material/Tabs';
+import { useCallback, useMemo } from 'react';
+const { defaultTabStyle } = {
+    defaultTabStyle: {
+        flex: 1
+    }
+};
+const Tabs = ({ defaultIndex, onSelectTab, routes = [], style: givenStyle, ...props }) => {
+    const tabStyle = useMemo(() => {
+        return {
+            ...defaultTabStyle,
+            ...givenStyle
+        };
+    }, [
+        givenStyle
+    ]);
+    const handleWebSelectTab = useCallback((_event, tabIndex) => {
+        if (onSelectTab) {
+            onSelectTab(tabIndex);
+        }
+    }, [
+        onSelectTab
+    ]);
+    const renderedScene = useMemo(() => {
+        return renderScene(routes);
+    }, [
+        routes
+    ]);
+    return (_jsx(MaterialTabs, { ...props, onChange: handleWebSelectTab, style: tabStyle, value: defaultIndex, children: renderedScene }));
+};
+export default Tabs;
+//# sourceMappingURL=Tabs.js.map

package/dist/cjs/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../src/Tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,YAEN,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAIL,WAAW,EACX,OAAO,EACR,MAAM,OAAO,CAAC;AAEf,MAAM,EACJ,eAAe,EAChB,GAEG;IACF,eAAe,EAAE;QACf,IAAI,EAAE,CAAC;KACR;CACF,CAAC;AAEF,MAAM,IAAI,GAAiC,CAAC,EAC1C,YAAY,EACZ,WAAW,EACX,MAAM,GAAG,EAAE,EACX,KAAK,EAAE,UAAU,EACjB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,QAAQ,GAAG,OAAO,CACtB,GAAG,EAAE;QACH,OAAO;YACL,GAAG,eAAe;YAClB,GAAG,UAAU;SACd,CAAC;IACJ,CAAC,EACD;QACE,UAAU;KACX,CACF,CAAC;IAEF,MAAM,kBAAkB,GAAG,WAAW,CACpC,CACE,MAAsB,EACtB,QAAgB,EAChB,EAAE;QACF,IAAI,WAAW,EAAE,CAAC;YAChB,WAAW,CAAC,QAAQ,CAAC,CAAC;QACxB,CAAC;IACH,CAAC,EACD;QACE,WAAW;KACZ,CACF,CAAC;IAEF,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE;QACH,OAAO,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,CAAC,EACD;QACE,MAAM;KACP,CACF,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,OACP,KAAK,EACT,QAAQ,EAAE,kBAAkB,EAC5B,KAAK,EAAE,QAAQ,EACf,KAAK,EAAE,YAAY,YAElB,aAAa,GACD,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/cjs/index.js

@@ -0,0 +1,4 @@
+export { default as ReactWebMaterialAppBar } from './AppBar';
+export { default as ReactWebMaterialDrawerBar } from './DrawerBar';
+export { default as ReactWebMaterialTabs } from './Tabs';
+//# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,IAAI,sBAAsB,EAElC,MAAM,UAAU,CAAC;AAClB,OAAO,EACL,OAAO,IAAI,yBAAyB,EAErC,MAAM,aAAa,CAAC;AACrB,OAAO,EACL,OAAO,IAAI,oBAAoB,EAEhC,MAAM,QAAQ,CAAC"}

package/dist/cjs/renderScene.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Tab from './Tab';
+const styles = {
+    tab: {
+        textTransform: 'initial'
+    }
+};
+export default (routes) => {
+    return routes.map(({ key, title }, index) => {
+        return (_jsx(Tab, { label: title, style: styles['tab'], tabIndex: index }, key));
+    });
+};
+//# sourceMappingURL=renderScene.js.map

package/dist/cjs/renderScene.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderScene.js","sourceRoot":"","sources":["../../src/renderScene.tsx"],"names":[],"mappings":";AAAA,OAAO,GAAG,MAAM,OAAO,CAAC;AAKxB,MAAM,MAAM,GAER;IACF,GAAG,EAAE;QACH,aAAa,EAAE,SAAS;KACzB;CACF,CAAC;AAEF,eAAe,CACb,MAGE,EACF,EAAE;IACF,OAAO,MAAM,CAAC,GAAG,CACf,CACE,EACE,GAAG,EACH,KAAK,EACN,EACD,KAAK,EACL,EAAE;QACF,OAAO,CACL,KAAC,GAAG,IAEF,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,EACpB,QAAQ,EAAE,KAAK,IAHV,GAAG,CAIR,CACH,CAAC;IACJ,CAAC,CACF,CAAC;AACJ,CAAC,CAAC"}

package/dist/esm/AppBar.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import DrawerToggle from './DrawerToggle';
+import Tabs from './Tabs';
+import { useSelectTab, useTabIndex, useTabOrder, useTabs } from '@dgui/react-shared';
+import { ReactWebDigestAppBar } from '@dgui/react-web';
+import { useCallback, useMemo } from 'react';
+const styles = {
+    appBar: {
+        alignItems: 'center',
+        backgroundColor: '#CCC',
+        boxShadow: '0 0 10px 5px rgba(0, 0, 0, 0.1)',
+        display: 'flex',
+        flexDirection: 'row',
+        position: 'relative',
+        zIndex: 102
+    }
+};
+const AppBar = ({ appBarStyle: givenAppBarStyle, children, icon, tabBarStyle, ...props }) => {
+    const appBarStyle = useMemo(() => {
+        return {
+            ...styles['appBar'],
+            ...givenAppBarStyle
+        };
+    }, [
+        givenAppBarStyle
+    ]);
+    const selectTab = useSelectTab();
+    const tabIndex = useTabIndex();
+    const handleSelectTab = useCallback((index) => {
+        selectTab(index);
+    }, [
+        selectTab
+    ]);
+    const tabOrder = useTabOrder();
+    const tabs = useTabs();
+    const routes = useMemo(() => {
+        return tabOrder.map((tabId) => {
+            return {
+                accessibilityLabel: tabs[tabId]?.title ?? tabId,
+                icon: undefined,
+                key: tabId,
+                title: tabs[tabId]?.title ?? tabId
+            };
+        });
+    }, [
+        tabOrder,
+        tabs
+    ]);
+    return (_jsx(ReactWebDigestAppBar, { children: _jsxs("div", { style: appBarStyle, children: [_jsx(DrawerToggle, { icon: icon }), _jsx(Tabs, { ...props, defaultIndex: tabIndex, onSelectTab: handleSelectTab, routes: routes, style: tabBarStyle }), children] }) }));
+};
+export default AppBar;
+//# sourceMappingURL=AppBar.js.map

package/dist/esm/AppBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppBar.js","sourceRoot":"","sources":["../../src/AppBar.tsx"],"names":[],"mappings":";AAAA,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,EACL,YAAY,EACZ,WAAW,EACX,WAAW,EACX,OAAO,EACR,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,oBAAoB,EACrB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAIL,WAAW,EACX,OAAO,EACR,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,GAER;IACF,MAAM,EAAE;QACN,UAAU,EAAE,QAAQ;QACpB,eAAe,EAAE,MAAM;QACvB,SAAS,EAAE,iCAAiC;QAC5C,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,KAAK;QACpB,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,GAAG;KACZ;CACF,CAAC;AAEF,MAAM,MAAM,GAAmC,CAAC,EAC9C,WAAW,EAAE,gBAAgB,EAC7B,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,WAAW,GAAkB,OAAO,CACxC,GAAG,EAAE;QACH,OAAO;YACL,GAAG,MAAM,CAAC,QAAQ,CAAC;YACnB,GAAG,gBAAgB;SACpB,CAAC;IACJ,CAAC,EACD;QACE,gBAAgB;KACjB,CACF,CAAC;IAEF,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;IACjC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,MAAM,eAAe,GAAG,WAAW,CACjC,CACE,KAAa,EACb,EAAE;QACF,SAAS,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,EACD;QACE,SAAS;KACV,CACF,CAAC;IAEF,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IAEvB,MAAM,MAAM,GAAG,OAAO,CACpB,GAAG,EAAE;QACH,OAAO,QAAQ,CAAC,GAAG,CACjB,CACE,KAAK,EACL,EAAE;YACF,OAAO;gBACL,kBAAkB,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,KAAK,IAAI,KAAK;gBAC/C,IAAI,EAAE,SAAS;gBACf,GAAG,EAAE,KAAK;gBACV,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,KAAK,IAAI,KAAK;aACnC,CAAC;QACJ,CAAC,CACF,CAAC;IACJ,CAAC,EACD;QACE,QAAQ;QACR,IAAI;KACL,CACF,CAAC;IAEF,OAAO,CACL,KAAC,oBAAoB,cACnB,eACE,KAAK,EAAE,WAAW,aAElB,KAAC,YAAY,IACX,IAAI,EAAE,IAAI,GACV,EACF,KAAC,IAAI,OACC,KAAK,EACT,YAAY,EAAE,QAAQ,EACtB,WAAW,EAAE,eAAe,EAC5B,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,WAAW,GAClB,EACD,QAAQ,IACL,GACe,CACxB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/esm/DrawerBar.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Tabs from './Tabs';
+import { useDrawerIndex, useDrawerOrder, useDrawers, useSelectDrawer } from '@dgui/react-shared';
+import { ReactWebDigestDrawerBar } from '@dgui/react-web';
+import { useCallback, useMemo } from 'react';
+const styles = {
+    tabBar: {
+        backgroundColor: '#CCC',
+        display: 'flex',
+        flexDirection: 'row'
+    }
+};
+const DrawerBar = () => {
+    const drawerIndex = useDrawerIndex();
+    const selectDrawer = useSelectDrawer();
+    const handleSelectDrawer = useCallback((tabIndex) => {
+        selectDrawer(tabIndex);
+    }, [
+        selectDrawer
+    ]);
+    const drawerOrder = useDrawerOrder();
+    const drawers = useDrawers();
+    const routes = useMemo(() => {
+        return drawerOrder.map((drawerId) => {
+            return ({
+                key: drawerId,
+                title: drawers[drawerId]?.title ?? drawerId
+            });
+        });
+    }, [
+        drawerOrder,
+        drawers
+    ]);
+    return (_jsx(ReactWebDigestDrawerBar, { children: _jsx("div", { style: styles['tabBar'], children: _jsx(Tabs, { defaultIndex: drawerIndex, onSelectTab: handleSelectDrawer, routes: routes }) }) }));
+};
+export default DrawerBar;
+//# sourceMappingURL=DrawerBar.js.map

package/dist/esm/DrawerBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerBar.js","sourceRoot":"","sources":["../../src/DrawerBar.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,EACL,cAAc,EACd,cAAc,EACd,UAAU,EACV,eAAe,EAChB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,uBAAuB,EACxB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAGL,WAAW,EACX,OAAO,EACR,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,GAER;IACF,MAAM,EAAE;QACN,eAAe,EAAE,MAAM;QAEvB,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,KAAK;KACrB;CACF,CAAC;AAEF,MAAM,SAAS,GAAsC,GAAG,EAAE;IACxD,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,MAAM,kBAAkB,GAAG,WAAW,CACpC,CACE,QAAgB,EAChB,EAAE;QACF,YAAY,CAAC,QAAQ,CAAC,CAAC;IACzB,CAAC,EACD;QACE,YAAY;KACb,CACF,CAAC;IAEF,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAE7B,MAAM,MAAM,GAAG,OAAO,CACpB,GAAG,EAAE;QACH,OAAO,WAAW,CAAC,GAAG,CACpB,CACE,QAAQ,EACR,EAAE;YACF,OAAO,CACL;gBACE,GAAG,EAAE,QAAQ;gBACb,KAAK,EAAE,OAAO,CAAC,QAAQ,CAAC,EAAE,KAAK,IAAI,QAAQ;aAC5C,CACF,CAAC;QACJ,CAAC,CACF,CAAC;IACJ,CAAC,EACD;QACE,WAAW;QACX,OAAO;KACR,CACF,CAAC;IAEF,OAAO,CACL,KAAC,uBAAuB,cACtB,cACE,KAAK,EAAE,MAAM,CAAC,QAAQ,CAAC,YAEvB,KAAC,IAAI,IACH,YAAY,EAAE,WAAW,EACzB,WAAW,EAAE,kBAAkB,EAC/B,MAAM,EAAE,MAAM,GACd,GACE,GACkB,CAC3B,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/esm/DrawerToggle.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useDrawerToggle } from '@dgui/react-shared';
+import MenuIcon from '@mui/icons-material/Menu';
+import IconButton from '@mui/material/IconButton';
+import { memo, useCallback } from 'react';
+const styles = {
+    iconButton: {
+        margin: 0
+    }
+};
+const DrawerToggle = ({ icon: Icon }) => {
+    const toggleDrawer = useDrawerToggle();
+    const onClick = useCallback(() => {
+        if (toggleDrawer) {
+            toggleDrawer();
+        }
+    }, [
+        toggleDrawer
+    ]);
+    return (_jsx(IconButton, { "aria-label": 'open drawer', onClick: onClick, style: styles['iconButton'], children: Icon ?
+            _jsx(Icon, {}) :
+            _jsx(MenuIcon, {}) }));
+};
+export default memo(DrawerToggle);
+//# sourceMappingURL=DrawerToggle.js.map

package/dist/esm/DrawerToggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerToggle.js","sourceRoot":"","sources":["../../src/DrawerToggle.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,eAAe,EAChB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,QAAQ,MAAM,0BAA0B,CAAC;AAChD,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAGL,IAAI,EACJ,WAAW,EACZ,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,GAER;IACF,UAAU,EAAE;QACV,MAAM,EAAE,CAAC;KACV;CACF,CAAC;AAEF,MAAM,YAAY,GAAyC,CAAC,EAC1D,IAAI,EAAE,IAAI,EACX,EAAE,EAAE;IACH,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,MAAM,OAAO,GAAG,WAAW,CACzB,GAAG,EAAE;QACH,IAAI,YAAY,EAAE,CAAC;YACjB,YAAY,EAAE,CAAC;QACjB,CAAC;IACH,CAAC,EACD;QACE,YAAY;KACb,CACF,CAAC;IAEF,OAAO,CACL,KAAC,UAAU,kBACE,aAAa,EACxB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,MAAM,CAAC,YAAY,CAAC,YAGzB,IAAI,CAAC,CAAC;YACJ,KAAC,IAAI,KAAG,CAAC,CAAC;YACV,KAAC,QAAQ,KAAG,GAEL,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,IAAI,CACjB,YAAY,CACb,CAAC"}

package/dist/esm/Tab.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import GenericTab from '@mui/material/Tab';
+const Tab = ({ label, tabIndex, ...rest }) => {
+    return (_jsx(GenericTab, { label: label, style: {
+            height: '20px'
+        }, value: tabIndex, ...rest }));
+};
+export default Tab;
+//# sourceMappingURL=Tab.js.map

package/dist/esm/Tab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.js","sourceRoot":"","sources":["../../src/Tab.tsx"],"names":[],"mappings":";AAAA,OAAO,UAEN,MAAM,mBAAmB,CAAC;AAM3B,MAAM,GAAG,GAAgC,CAAC,EACxC,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,EAAE;IACH,OAAO,CACL,KAAC,UAAU,IACT,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE;YACL,MAAM,EAAE,MAAM;SACf,EACD,KAAK,EAAE,QAAQ,KACX,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,GAAG,CAAC"}

package/dist/esm/Tabs.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import renderScene from './renderScene';
+import MaterialTabs from '@mui/material/Tabs';
+import { useCallback, useMemo } from 'react';
+const { defaultTabStyle } = {
+    defaultTabStyle: {
+        flex: 1
+    }
+};
+const Tabs = ({ defaultIndex, onSelectTab, routes = [], style: givenStyle, ...props }) => {
+    const tabStyle = useMemo(() => {
+        return {
+            ...defaultTabStyle,
+            ...givenStyle
+        };
+    }, [
+        givenStyle
+    ]);
+    const handleWebSelectTab = useCallback((_event, tabIndex) => {
+        if (onSelectTab) {
+            onSelectTab(tabIndex);
+        }
+    }, [
+        onSelectTab
+    ]);
+    const renderedScene = useMemo(() => {
+        return renderScene(routes);
+    }, [
+        routes
+    ]);
+    return (_jsx(MaterialTabs, { ...props, onChange: handleWebSelectTab, style: tabStyle, value: defaultIndex, children: renderedScene }));
+};
+export default Tabs;
+//# sourceMappingURL=Tabs.js.map

package/dist/esm/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../src/Tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,YAEN,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAIL,WAAW,EACX,OAAO,EACR,MAAM,OAAO,CAAC;AAEf,MAAM,EACJ,eAAe,EAChB,GAEG;IACF,eAAe,EAAE;QACf,IAAI,EAAE,CAAC;KACR;CACF,CAAC;AAEF,MAAM,IAAI,GAAiC,CAAC,EAC1C,YAAY,EACZ,WAAW,EACX,MAAM,GAAG,EAAE,EACX,KAAK,EAAE,UAAU,EACjB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,QAAQ,GAAG,OAAO,CACtB,GAAG,EAAE;QACH,OAAO;YACL,GAAG,eAAe;YAClB,GAAG,UAAU;SACd,CAAC;IACJ,CAAC,EACD;QACE,UAAU;KACX,CACF,CAAC;IAEF,MAAM,kBAAkB,GAAG,WAAW,CACpC,CACE,MAAsB,EACtB,QAAgB,EAChB,EAAE;QACF,IAAI,WAAW,EAAE,CAAC;YAChB,WAAW,CAAC,QAAQ,CAAC,CAAC;QACxB,CAAC;IACH,CAAC,EACD;QACE,WAAW;KACZ,CACF,CAAC;IAEF,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE;QACH,OAAO,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,CAAC,EACD;QACE,MAAM;KACP,CACF,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,OACP,KAAK,EACT,QAAQ,EAAE,kBAAkB,EAC5B,KAAK,EAAE,QAAQ,EACf,KAAK,EAAE,YAAY,YAElB,aAAa,GACD,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/esm/index.js

@@ -0,0 +1,4 @@
+export { default as ReactWebMaterialAppBar } from './AppBar';
+export { default as ReactWebMaterialDrawerBar } from './DrawerBar';
+export { default as ReactWebMaterialTabs } from './Tabs';
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,IAAI,sBAAsB,EAElC,MAAM,UAAU,CAAC;AAClB,OAAO,EACL,OAAO,IAAI,yBAAyB,EAErC,MAAM,aAAa,CAAC;AACrB,OAAO,EACL,OAAO,IAAI,oBAAoB,EAEhC,MAAM,QAAQ,CAAC"}

package/dist/esm/renderScene.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Tab from './Tab';
+const styles = {
+    tab: {
+        textTransform: 'initial'
+    }
+};
+export default (routes) => {
+    return routes.map(({ key, title }, index) => {
+        return (_jsx(Tab, { label: title, style: styles['tab'], tabIndex: index }, key));
+    });
+};
+//# sourceMappingURL=renderScene.js.map

package/dist/esm/renderScene.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderScene.js","sourceRoot":"","sources":["../../src/renderScene.tsx"],"names":[],"mappings":";AAAA,OAAO,GAAG,MAAM,OAAO,CAAC;AAKxB,MAAM,MAAM,GAER;IACF,GAAG,EAAE;QACH,aAAa,EAAE,SAAS;KACzB;CACF,CAAC;AAEF,eAAe,CACb,MAGE,EACF,EAAE;IACF,OAAO,MAAM,CAAC,GAAG,CACf,CACE,EACE,GAAG,EACH,KAAK,EACN,EACD,KAAK,EACL,EAAE;QACF,OAAO,CACL,KAAC,GAAG,IAEF,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,EACpB,QAAQ,EAAE,KAAK,IAHV,GAAG,CAIR,CACH,CAAC;IACJ,CAAC,CACF,CAAC;AACJ,CAAC,CAAC"}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@dgui/react-web-material-bars",
   "title": "Digested React GUI Shared Web Material Bars",
   "license": "LGPL-3.0-or-later",
-  "version": "1.7.6",
+  "version": "1.8.0",
   "private": false,
   "description": "Shared Web Material Bars (AppBar & DrawerBar) and supporting components for @dgui",
   "author": "wallzero @wallzeroblog (http://wallzero.com)",
@@ -13,8 +13,9 @@
       "position": "Initial and Lead Developer"
     }
   ],
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
+  "types": "dist/esm/index.d.ts",
   "files": [
     "dist/",
     "COPYING.md",
@@ -30,7 +31,9 @@
   },
   "scripts": {
     "build": "run-s clean:dist build:prod",
-    "build:prod": "tsc -p ./tsconfig.json",
+    "build:prod": "run-p build:cjs:prod build:esm:prod",
+    "build:cjs:prod": "tsc -p ./tsconfig.cjs.json",
+    "build:esm:prod": "tsc -p ./tsconfig.json",
     "build:watch": "tsc -p ./tsconfig.json --watch --pretty --preserveWatchOutput",
     "----------------------------------------------------------------": "",
     "build:prod:config": "",
@@ -52,20 +55,20 @@
     "@mui/icons-material": "^6.5.0",
     "@mui/material": "^6.5.0",
     "@types/jest": "^30.0.0",
-    "@types/react": "^19.2.7",
+    "@types/react": "^19.2.13",
     "@types/react-test-renderer": "^19.1.0",
     "cross-env": "^10.1.0",
     "jest-environment-jsdom": "^30.2.0",
     "jest-environment-jsdom-global": "^4.0.0",
     "npm-run-all": "^4.1.5",
-    "react": "^19.2.3",
-    "react-dom": "^19.2.3",
-    "react-test-renderer": "^19.2.3",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "react-test-renderer": "^19.2.4",
     "rimraf": "^6.1.2"
   },
   "dependencies": {
-    "@dgui/react-shared": "1.7.6",
-    "@dgui/react-web": "1.7.6"
+    "@dgui/react-shared": "1.8.0",
+    "@dgui/react-web": "1.8.0"
   },
   "peerDependencies": {
     "@mui/material": "^6.0.0",
@@ -82,5 +85,5 @@
     "material",
     "typescript"
   ],
-  "gitHead": "864501301de458311da44d7b3043c7488ce6096c"
+  "gitHead": "95e59233ca83f31132d06237305b05e188666974"
 }

package/dist/AppBar.js

@@ -1,67 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const DrawerToggle_1 = __importDefault(require("./DrawerToggle"));
-const Tabs_1 = __importDefault(require("./Tabs"));
-const react_shared_1 = require("@dgui/react-shared");
-const react_web_1 = require("@dgui/react-web");
-const react_1 = require("react");
-const styles = {
-    appBar: {
-        alignItems: 'center',
-        backgroundColor: '#CCC',
-        boxShadow: '0 0 10px 5px rgba(0, 0, 0, 0.1)',
-        display: 'flex',
-        flexDirection: 'row',
-        position: 'relative',
-        zIndex: 102
-    }
-};
-const AppBar = (_a) => {
-    var { appBarStyle: givenAppBarStyle, children, icon, tabBarStyle } = _a, props = __rest(_a, ["appBarStyle", "children", "icon", "tabBarStyle"]);
-    const appBarStyle = (0, react_1.useMemo)(() => {
-        return Object.assign(Object.assign({}, styles.appBar), givenAppBarStyle);
-    }, [
-        givenAppBarStyle
-    ]);
-    const selectTab = (0, react_shared_1.useSelectTab)();
-    const tabIndex = (0, react_shared_1.useTabIndex)();
-    const handleSelectTab = (0, react_1.useCallback)((index) => {
-        selectTab(index);
-    }, [
-        selectTab
-    ]);
-    const tabOrder = (0, react_shared_1.useTabOrder)();
-    const tabs = (0, react_shared_1.useTabs)();
-    const routes = (0, react_1.useMemo)(() => {
-        return tabOrder.map((tabId) => {
-            var _a, _b, _c, _d;
-            return {
-                accessibilityLabel: (_b = (_a = tabs[tabId]) === null || _a === void 0 ? void 0 : _a.title) !== null && _b !== void 0 ? _b : tabId,
-                icon: undefined,
-                key: tabId,
-                title: (_d = (_c = tabs[tabId]) === null || _c === void 0 ? void 0 : _c.title) !== null && _d !== void 0 ? _d : tabId
-            };
-        });
-    }, [
-        tabOrder,
-        tabs
-    ]);
-    return ((0, jsx_runtime_1.jsx)(react_web_1.ReactWebDigestAppBar, { children: (0, jsx_runtime_1.jsxs)("div", { style: appBarStyle, children: [(0, jsx_runtime_1.jsx)(DrawerToggle_1.default, { icon: icon }), (0, jsx_runtime_1.jsx)(Tabs_1.default, Object.assign({}, props, { defaultIndex: tabIndex, onSelectTab: handleSelectTab, routes: routes, style: tabBarStyle })), children] }) }));
-};
-exports.default = AppBar;
-//# sourceMappingURL=AppBar.js.map

package/dist/AppBar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AppBar.js","sourceRoot":"","sources":["../src/AppBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kEAA0C;AAC1C,kDAA0B;AAC1B,qDAK4B;AAC5B,+CAEyB;AACzB,iCAMe;AAEf,MAAM,MAAM,GAER;IACF,MAAM,EAAE;QACN,UAAU,EAAE,QAAQ;QACpB,eAAe,EAAE,MAAM;QACvB,SAAS,EAAE,iCAAiC;QAC5C,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,KAAK;QACpB,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,GAAG;KACZ;CACF,CAAC;AAEF,MAAM,MAAM,GAAmC,CAAC,EAM/C,EAAE,EAAE;QAN2C,EAC9C,WAAW,EAAE,gBAAgB,EAC7B,QAAQ,EACR,IAAI,EACJ,WAAW,OAEZ,EADI,KAAK,cALsC,kDAM/C,CADS;IAER,MAAM,WAAW,GAAkB,IAAA,eAAO,EACxC,GAAG,EAAE;QACH,uCACK,MAAM,CAAC,MAAM,GACb,gBAAgB,EACnB;IACJ,CAAC,EACD;QACE,gBAAgB;KACjB,CACF,CAAC;IAEF,MAAM,SAAS,GAAG,IAAA,2BAAY,GAAE,CAAC;IACjC,MAAM,QAAQ,GAAG,IAAA,0BAAW,GAAE,CAAC;IAE/B,MAAM,eAAe,GAAG,IAAA,mBAAW,EACjC,CACE,KAAa,EACb,EAAE;QACF,SAAS,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,EACD;QACE,SAAS;KACV,CACF,CAAC;IAEF,MAAM,QAAQ,GAAG,IAAA,0BAAW,GAAE,CAAC;IAC/B,MAAM,IAAI,GAAG,IAAA,sBAAO,GAAE,CAAC;IAEvB,MAAM,MAAM,GAAG,IAAA,eAAO,EACpB,GAAG,EAAE;QACH,OAAO,QAAQ,CAAC,GAAG,CACjB,CACE,KAAK,EACL,EAAE;;YACF,OAAO;gBACL,kBAAkB,EAAE,MAAA,MAAA,IAAI,CAAC,KAAK,CAAC,0CAAE,KAAK,mCAAI,KAAK;gBAC/C,IAAI,EAAE,SAAS;gBACf,GAAG,EAAE,KAAK;gBACV,KAAK,EAAE,MAAA,MAAA,IAAI,CAAC,KAAK,CAAC,0CAAE,KAAK,mCAAI,KAAK;aACnC,CAAC;QACJ,CAAC,CACF,CAAC;IACJ,CAAC,EACD;QACE,QAAQ;QACR,IAAI;KACL,CACF,CAAC;IAEF,OAAO,CACL,uBAAC,gCAAoB,cACnB,iCACE,KAAK,EAAE,WAAW,aAElB,uBAAC,sBAAY,IACX,IAAI,EAAE,IAAI,GACV,EACF,uBAAC,cAAI,oBACC,KAAK,IACT,YAAY,EAAE,QAAQ,EACtB,WAAW,EAAE,eAAe,EAC5B,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,WAAW,IAClB,EACD,QAAQ,IACL,GACe,CACxB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,MAAM,CAAC"}

package/dist/DrawerBar.js

@@ -1,43 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Tabs_1 = __importDefault(require("./Tabs"));
-const react_shared_1 = require("@dgui/react-shared");
-const react_web_1 = require("@dgui/react-web");
-const react_1 = require("react");
-const styles = {
-    tabBar: {
-        backgroundColor: '#CCC',
-        display: 'flex',
-        flexDirection: 'row'
-    }
-};
-const DrawerBar = () => {
-    const drawerIndex = (0, react_shared_1.useDrawerIndex)();
-    const selectDrawer = (0, react_shared_1.useSelectDrawer)();
-    const handleSelectDrawer = (0, react_1.useCallback)((tabIndex) => {
-        selectDrawer(tabIndex);
-    }, [
-        selectDrawer
-    ]);
-    const drawerOrder = (0, react_shared_1.useDrawerOrder)();
-    const drawers = (0, react_shared_1.useDrawers)();
-    const routes = (0, react_1.useMemo)(() => {
-        return drawerOrder.map((drawerId) => {
-            var _a, _b;
-            return ({
-                key: drawerId,
-                title: (_b = (_a = drawers[drawerId]) === null || _a === void 0 ? void 0 : _a.title) !== null && _b !== void 0 ? _b : drawerId
-            });
-        });
-    }, [
-        drawerOrder,
-        drawers
-    ]);
-    return ((0, jsx_runtime_1.jsx)(react_web_1.ReactWebDigestDrawerBar, { children: (0, jsx_runtime_1.jsx)("div", { style: styles.tabBar, children: (0, jsx_runtime_1.jsx)(Tabs_1.default, { defaultIndex: drawerIndex, onSelectTab: handleSelectDrawer, routes: routes }) }) }));
-};
-exports.default = DrawerBar;
-//# sourceMappingURL=DrawerBar.js.map

package/dist/DrawerBar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DrawerBar.js","sourceRoot":"","sources":["../src/DrawerBar.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,qDAK4B;AAC5B,+CAEyB;AACzB,iCAKe;AAEf,MAAM,MAAM,GAER;IACF,MAAM,EAAE;QACN,eAAe,EAAE,MAAM;QAEvB,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,KAAK;KACrB;CACF,CAAC;AAEF,MAAM,SAAS,GAAsC,GAAG,EAAE;IACxD,MAAM,WAAW,GAAG,IAAA,6BAAc,GAAE,CAAC;IACrC,MAAM,YAAY,GAAG,IAAA,8BAAe,GAAE,CAAC;IAEvC,MAAM,kBAAkB,GAAG,IAAA,mBAAW,EACpC,CACE,QAAgB,EAChB,EAAE;QACF,YAAY,CAAC,QAAQ,CAAC,CAAC;IACzB,CAAC,EACD;QACE,YAAY;KACb,CACF,CAAC;IAEF,MAAM,WAAW,GAAG,IAAA,6BAAc,GAAE,CAAC;IACrC,MAAM,OAAO,GAAG,IAAA,yBAAU,GAAE,CAAC;IAE7B,MAAM,MAAM,GAAG,IAAA,eAAO,EACpB,GAAG,EAAE;QACH,OAAO,WAAW,CAAC,GAAG,CACpB,CACE,QAAQ,EACR,EAAE;;YACF,OAAO,CACL;gBACE,GAAG,EAAE,QAAQ;gBACb,KAAK,EAAE,MAAA,MAAA,OAAO,CAAC,QAAQ,CAAC,0CAAE,KAAK,mCAAI,QAAQ;aAC5C,CACF,CAAC;QACJ,CAAC,CACF,CAAC;IACJ,CAAC,EACD;QACE,WAAW;QACX,OAAO;KACR,CACF,CAAC;IAEF,OAAO,CACL,uBAAC,mCAAuB,cACtB,gCACE,KAAK,EAAE,MAAM,CAAC,MAAM,YAEpB,uBAAC,cAAI,IACH,YAAY,EAAE,WAAW,EACzB,WAAW,EAAE,kBAAkB,EAC/B,MAAM,EAAE,MAAM,GACd,GACE,GACkB,CAC3B,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC"}

package/dist/DrawerToggle.js

@@ -1,30 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_shared_1 = require("@dgui/react-shared");
-const Menu_1 = __importDefault(require("@mui/icons-material/Menu"));
-const IconButton_1 = __importDefault(require("@mui/material/IconButton"));
-const react_1 = require("react");
-const styles = {
-    iconButton: {
-        margin: 0
-    }
-};
-const DrawerToggle = ({ icon: Icon }) => {
-    const toggleDrawer = (0, react_shared_1.useDrawerToggle)();
-    const onClick = (0, react_1.useCallback)(() => {
-        if (toggleDrawer) {
-            toggleDrawer();
-        }
-    }, [
-        toggleDrawer
-    ]);
-    return ((0, jsx_runtime_1.jsx)(IconButton_1.default, { "aria-label": 'open drawer', onClick: onClick, style: styles.iconButton, children: Icon ?
-            (0, jsx_runtime_1.jsx)(Icon, {}) :
-            (0, jsx_runtime_1.jsx)(Menu_1.default, {}) }));
-};
-exports.default = (0, react_1.memo)(DrawerToggle);
-//# sourceMappingURL=DrawerToggle.js.map

package/dist/DrawerToggle.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DrawerToggle.js","sourceRoot":"","sources":["../src/DrawerToggle.tsx"],"names":[],"mappings":";;;;;;AAAA,qDAE4B;AAC5B,oEAAgD;AAChD,0EAAkD;AAClD,iCAKe;AAEf,MAAM,MAAM,GAER;IACF,UAAU,EAAE;QACV,MAAM,EAAE,CAAC;KACV;CACF,CAAC;AAEF,MAAM,YAAY,GAAyC,CAAC,EAC1D,IAAI,EAAE,IAAI,EACX,EAAE,EAAE;IACH,MAAM,YAAY,GAAG,IAAA,8BAAe,GAAE,CAAC;IAEvC,MAAM,OAAO,GAAG,IAAA,mBAAW,EACzB,GAAG,EAAE;QACH,IAAI,YAAY,EAAE,CAAC;YACjB,YAAY,EAAE,CAAC;QACjB,CAAC;IACH,CAAC,EACD;QACE,YAAY;KACb,CACF,CAAC;IAEF,OAAO,CACL,uBAAC,oBAAU,kBACE,aAAa,EACxB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,MAAM,CAAC,UAAU,YAGtB,IAAI,CAAC,CAAC;YACJ,uBAAC,IAAI,KAAG,CAAC,CAAC;YACV,uBAAC,cAAQ,KAAG,GAEL,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,IAAA,YAAI,EACjB,YAAY,CACb,CAAC"}

package/dist/Tab.js

@@ -1,26 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Tab_1 = __importDefault(require("@mui/material/Tab"));
-const Tab = (_a) => {
-    var { label, tabIndex } = _a, rest = __rest(_a, ["label", "tabIndex"]);
-    return ((0, jsx_runtime_1.jsx)(Tab_1.default, Object.assign({ label: label, style: {
-            height: '20px'
-        }, value: tabIndex }, rest)));
-};
-exports.default = Tab;
-//# sourceMappingURL=Tab.js.map

package/dist/Tab.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tab.js","sourceRoot":"","sources":["../src/Tab.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,4DAE2B;AAM3B,MAAM,GAAG,GAAgC,CAAC,EAIzC,EAAE,EAAE;QAJqC,EACxC,KAAK,EACL,QAAQ,OAET,EADI,IAAI,cAHiC,qBAIzC,CADQ;IAEP,OAAO,CACL,uBAAC,aAAU,kBACT,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE;YACL,MAAM,EAAE,MAAM;SACf,EACD,KAAK,EAAE,QAAQ,IACX,IAAI,EACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,GAAG,CAAC"}

package/dist/Tabs.js

@@ -1,48 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const renderScene_1 = __importDefault(require("./renderScene"));
-const Tabs_1 = __importDefault(require("@mui/material/Tabs"));
-const react_1 = require("react");
-const { defaultTabStyle } = {
-    defaultTabStyle: {
-        flex: 1
-    }
-};
-const Tabs = (_a) => {
-    var { defaultIndex, onSelectTab, routes = [], style: givenStyle } = _a, props = __rest(_a, ["defaultIndex", "onSelectTab", "routes", "style"]);
-    const tabStyle = (0, react_1.useMemo)(() => {
-        return Object.assign(Object.assign({}, defaultTabStyle), givenStyle);
-    }, [
-        givenStyle
-    ]);
-    const handleWebSelectTab = (0, react_1.useCallback)((event, tabIndex) => {
-        if (onSelectTab) {
-            onSelectTab(tabIndex);
-        }
-    }, [
-        onSelectTab
-    ]);
-    const renderedScene = (0, react_1.useMemo)(() => {
-        return (0, renderScene_1.default)(routes);
-    }, [
-        routes
-    ]);
-    return ((0, jsx_runtime_1.jsx)(Tabs_1.default, Object.assign({}, props, { onChange: handleWebSelectTab, style: tabStyle, value: defaultIndex, children: renderedScene })));
-};
-exports.default = Tabs;
-//# sourceMappingURL=Tabs.js.map

package/dist/Tabs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../src/Tabs.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,gEAAwC;AACxC,8DAE4B;AAC5B,iCAMe;AAEf,MAAM,EACJ,eAAe,EAChB,GAEG;IACF,eAAe,EAAE;QACf,IAAI,EAAE,CAAC;KACR;CACF,CAAC;AAEF,MAAM,IAAI,GAAiC,CAAC,EAM3C,EAAE,EAAE;QANuC,EAC1C,YAAY,EACZ,WAAW,EACX,MAAM,GAAG,EAAE,EACX,KAAK,EAAE,UAAU,OAElB,EADI,KAAK,cALkC,kDAM3C,CADS;IAER,MAAM,QAAQ,GAAG,IAAA,eAAO,EACtB,GAAG,EAAE;QACH,uCACK,eAAe,GACf,UAAU,EACb;IACJ,CAAC,EACD;QACE,UAAU;KACX,CACF,CAAC;IAEF,MAAM,kBAAkB,GAAG,IAAA,mBAAW,EACpC,CACE,KAAqB,EACrB,QAAgB,EAChB,EAAE;QACF,IAAI,WAAW,EAAE,CAAC;YAChB,WAAW,CAAC,QAAQ,CAAC,CAAC;QACxB,CAAC;IACH,CAAC,EACD;QACE,WAAW;KACZ,CACF,CAAC;IAEF,MAAM,aAAa,GAAG,IAAA,eAAO,EAC3B,GAAG,EAAE;QACH,OAAO,IAAA,qBAAW,EAAC,MAAM,CAAC,CAAC;IAC7B,CAAC,EACD;QACE,MAAM;KACP,CACF,CAAC;IAEF,OAAO,CACL,uBAAC,cAAY,oBACP,KAAK,IACT,QAAQ,EAAE,kBAAkB,EAC5B,KAAK,EAAE,QAAQ,EACf,KAAK,EAAE,YAAY,YAElB,aAAa,IACD,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,IAAI,CAAC"}

package/dist/index.js

@@ -1,13 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ReactWebMaterialTabs = exports.ReactWebMaterialDrawerBar = exports.ReactWebMaterialAppBar = void 0;
-var AppBar_1 = require("./AppBar");
-Object.defineProperty(exports, "ReactWebMaterialAppBar", { enumerable: true, get: function () { return __importDefault(AppBar_1).default; } });
-var DrawerBar_1 = require("./DrawerBar");
-Object.defineProperty(exports, "ReactWebMaterialDrawerBar", { enumerable: true, get: function () { return __importDefault(DrawerBar_1).default; } });
-var Tabs_1 = require("./Tabs");
-Object.defineProperty(exports, "ReactWebMaterialTabs", { enumerable: true, get: function () { return __importDefault(Tabs_1).default; } });
-//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;AAAA,mCAGkB;AAFhB,iIAAA,OAAO,OAA0B;AAGnC,yCAGqB;AAFnB,uIAAA,OAAO,OAA6B;AAGtC,+BAGgB;AAFd,6HAAA,OAAO,OAAwB"}

package/dist/renderScene.js

@@ -1,18 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Tab_1 = __importDefault(require("./Tab"));
-const styles = {
-    tab: {
-        textTransform: 'initial'
-    }
-};
-exports.default = (routes) => {
-    return routes.map(({ key, title }, index) => {
-        return ((0, jsx_runtime_1.jsx)(Tab_1.default, { label: title, style: styles.tab, tabIndex: index }, key));
-    });
-};
-//# sourceMappingURL=renderScene.js.map

package/dist/renderScene.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"renderScene.js","sourceRoot":"","sources":["../src/renderScene.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAwB;AAKxB,MAAM,MAAM,GAER;IACF,GAAG,EAAE;QACH,aAAa,EAAE,SAAS;KACzB;CACF,CAAC;AAEF,kBAAe,CACb,MAGE,EACF,EAAE;IACF,OAAO,MAAM,CAAC,GAAG,CACf,CACE,EACE,GAAG,EACH,KAAK,EACN,EACD,KAAK,EACL,EAAE;QACF,OAAO,CACL,uBAAC,aAAG,IAEF,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,MAAM,CAAC,GAAG,EACjB,QAAQ,EAAE,KAAK,IAHV,GAAG,CAIR,CACH,CAAC;IACJ,CAAC,CACF,CAAC;AACJ,CAAC,CAAC"}