create memoPanel.js, tab.js + delete panelProxy.js

+ make api inherited from tabs.js and pub_sub.js
+ remove setData() + rename reload() to refresh()

Author: biglari-test

src/com/react-dynamic-tabs/panel/memoPanel.js

@@ -0,0 +1,5 @@
+import { memo } from 'react';
+const MemoPanel = memo(function (props) {
+    return props.childComponent;
+}, () => true);
+export default MemoPanel;

src/com/react-dynamic-tabs/panel/panel.js

@@ -9,7 +9,7 @@ const Panel = memo(function Panel(props) {
         , panelProps = panelPropsManager.get({ isSelected: id === selectedTabID, api, id });
     return (
         <div {...panelProps}>
-            {api.getPanel(id)}
+            {api.getTab(id).panelComponent}
         </div>
     )
 }, (oldProps, newProps) => {

src/com/react-dynamic-tabs/tab/tab.js

@@ -6,7 +6,7 @@ const Tab = memo(
     function Tab(props) {
         React.useContext(ForceUpdateContext);
         const { id, selectedTabID } = props
-            , api = React.useContext(ApiContext), op = api.getOptions(), tabObj = op.data[id]
+            , api = React.useContext(ApiContext), op = api.getOptions(), tabObj = api.getTab(id)
             , propsManagerParam = { api, id, isSelected: selectedTabID === id }
             , clkHandler = function (e) { api.eventHandlerFactory({ e, id }); }
             , TabInnerComponent = op.tabComponent;

src/com/react-dynamic-tabs/tab/tab.test.js

@@ -167,10 +167,10 @@ describe("calling tabDidMount and tabDidUpdate  inside the useEffect", () => {
 		function MockWrapprTab() {
 			const [activeId, setActiveId] = useState({ id: '2' }), toggelActiveTab = (e) => {
 				activeId === '2' ? setActiveId('1') : setActiveId('2');
-			}, reload = id => { setActiveId({ id }); };
+			}, refresh = id => { setActiveId({ id }); };
 			return <>
 				<button id='toggelActiveTabBtn' onClick={toggelActiveTab}></button>
-				<button id='forceUpdateBtn' onClick={reload}></button>
+				<button id='forceUpdateBtn' onClick={refresh}></button>
 				<Tab selectedTabID={activeId} id="1"></Tab>
 				<Tab selectedTabID={activeId} id="2"></Tab>
 				<Tab selectedTabID={activeId} id="3"></Tab>

src/com/react-dynamic-tabs/tab/tabPropsManager/defaultTabInnerProps.js

@@ -1,7 +1,7 @@
 const DefaultTabInnerProps = Object.create({
     get: function (param) {
         const { id, isSelected, api } = param, { cssClasses, keyTemps } = api.getSetting(),
-            userIconClass = api.getTabObj(id).iconClass;
+            userIconClass = api.getTab(id).iconClass;
         Object.assign(param, { a11y: api.getOptions().accessibility, cssClasses, keyTemps, userIconClass });
         return {
             id, isSelected, api,

src/com/react-dynamic-tabs/tab/tabPropsManager/tabProps.js

@@ -1,7 +1,7 @@
 const TabProps = Object.create({
     get: function (param) {
         const { api } = param, { cssClasses, keyTemps } = api.getSetting();
-        Object.assign(param, { cssClasses, keyTemps, op: api.getOptions(), tabObj: api.getTabObj(param.id) });
+        Object.assign(param, { cssClasses, keyTemps, op: api.getOptions(), tabObj: api.getTab(param.id) });
         return this._getA11Y(this._getDisabled(this._getSelected(this._getBase(param), param), param), param);
     },
     _getBase: function ({ id, cssClasses, api }) {

src/com/react-dynamic-tabs/useDynamicTabs/index.js

@@ -13,20 +13,20 @@ function useDynamicTabs(options) {
         , [state, dispatch] = useReducer(reducer, api.getInitialState());
     api.updateReducer(state, dispatch);
     useLayoutEffect(() => {
-        api.pub_sub.trigger('onLoad');
-        return () => { api.pub_sub.trigger('onDestroy'); };
+        api.trigger('onLoad');
+        return () => { api.trigger('onDestroy'); };
     }, []);
     useLayoutEffect(() => {
         const oldState = api.getCopyPerviousData()
             , [openedTabsId, closedTabsId] = api.helper.getArraysDiff(state.openTabIDs, oldState.openTabIDs)
             , isSwitched = oldState.selectedTabID !== state.selectedTabID;
-        api.pub_sub.trigger('onChange', { newState: state, oldState, closedTabsId, openedTabsId, isSwitched });
+        api.trigger('onChange', { newState: state, oldState, closedTabsId, openedTabsId, isSwitched });
     }, [state]);
     if (!_ref.TabListComponent)
         _ref.TabListComponent = (props = {}) => {
             return (
                 <ApiContext.Provider value={_ref.api}>
-                    <StateContext.Provider value={_ref.api._stateRef}>
+                    <StateContext.Provider value={_ref.api.stateRef}>
                         <ForceUpdateContext.Provider value={_ref.api.forceUpdateState}>
                             <TabList {...props}>props.children</TabList>
                         </ForceUpdateContext.Provider>
@@ -37,7 +37,7 @@ function useDynamicTabs(options) {
     if (!_ref.PanelListCompoent)
         _ref.PanelListCompoent = props => (
             <ApiContext.Provider value={_ref.api}>
-                <StateContext.Provider value={_ref.api._stateRef}>
+                <StateContext.Provider value={_ref.api.stateRef}>
                     <ForceUpdateContext.Provider value={_ref.api.forceUpdateState}>
                         <PanelList {...props}>props.children</PanelList>
                     </ForceUpdateContext.Provider>