npm - mithril-materialized - Versions diffs - 2.0.0-beta.6 → 2.0.0-beta.7 - Mend

mithril-materialized 2.0.0-beta.6 → 2.0.0-beta.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/index.esm.js CHANGED Viewed

@@ -4379,13 +4379,9 @@ const Switch = () => {
 /** CSS-only Tabs component - no MaterializeCSS dependencies */
 const Tabs = () => {
     const toAnchored = () => {
-        let activeTabFound = false;
         return (tab) => {
-            const active = activeTabFound ? false : tab.active;
-            if (active)
-                activeTabFound = true;
             const tabId = createId(tab.title, tab.id);
-            return Object.assign(Object.assign({}, tab), { active, tabId, anchorId: `anchor-${tabId}` });
+            return Object.assign(Object.assign({}, tab), { tabId, anchorId: `anchor-${tabId}` });
         };
     };
     const state = {
@@ -4396,7 +4392,9 @@ const Tabs = () => {
         indicatorStyle: {
             left: '0px',
             width: '0px',
-        }};
+        },
+        lastIndicatorUpdate: '',
+    };
     const createId = (title, id) => (id ? id : title.replace(/ /g, '').toLowerCase());
     const updateIndicator = () => {
         const tabElement = document.getElementById(state.activeTabId);
@@ -4418,6 +4416,7 @@ const Tabs = () => {
         }
     };
     const handleTabClick = (tabId, tabElement, attrs) => {
+        console.log({ state, tabId });
         if (state.activeTabId === tabId)
             return;
         state.activeTabId = tabId;
@@ -4477,20 +4476,15 @@ const Tabs = () => {
         const selectedTab = selectedTabId ? anchoredTabs.find((a) => a.tabId === selectedTabId) : undefined;
         if (selectedTab) {
             state.activeTabId = selectedTab.tabId;
-            selectedTab.active = true;
             return selectedTab;
         }
-        const activeTab = anchoredTabs.find((t) => t.active);
-        if (activeTab) {
-            // Active tab property takes precedence over selectedTabId
-            state.activeTabId = activeTab.tabId;
-            return activeTab;
-        }
+        const curTab = state.activeTabId && anchoredTabs.find((a) => a.tabId === state.activeTabId);
+        if (curTab)
+            return curTab;
         // Default to first non-disabled tab
-        const firstAvailableTab = anchoredTabs.find((t) => !t.disabled && !t.href);
+        const firstAvailableTab = anchoredTabs.find((a) => !a.disabled && !a.href);
         if (firstAvailableTab) {
             state.activeTabId = firstAvailableTab.tabId;
-            firstAvailableTab.active = true;
             return firstAvailableTab;
         }
         return undefined;
@@ -4529,7 +4523,7 @@ const Tabs = () => {
                             disabled,
                         }, m('a', {
                             id: anchorId,
-                            className: tab.active ? 'active' : undefined,
+                            className: tab.tabId === state.activeTabId ? 'active' : undefined,
                             target,
                             href: href || `#${anchorId}`,
                             onclick: disabled || href

package/dist/index.js CHANGED Viewed

@@ -4381,13 +4381,9 @@ const Switch = () => {
 /** CSS-only Tabs component - no MaterializeCSS dependencies */
 const Tabs = () => {
     const toAnchored = () => {
-        let activeTabFound = false;
         return (tab) => {
-            const active = activeTabFound ? false : tab.active;
-            if (active)
-                activeTabFound = true;
             const tabId = createId(tab.title, tab.id);
-            return Object.assign(Object.assign({}, tab), { active, tabId, anchorId: `anchor-${tabId}` });
+            return Object.assign(Object.assign({}, tab), { tabId, anchorId: `anchor-${tabId}` });
         };
     };
     const state = {
@@ -4398,7 +4394,9 @@ const Tabs = () => {
         indicatorStyle: {
             left: '0px',
             width: '0px',
-        }};
+        },
+        lastIndicatorUpdate: '',
+    };
     const createId = (title, id) => (id ? id : title.replace(/ /g, '').toLowerCase());
     const updateIndicator = () => {
         const tabElement = document.getElementById(state.activeTabId);
@@ -4420,6 +4418,7 @@ const Tabs = () => {
         }
     };
     const handleTabClick = (tabId, tabElement, attrs) => {
+        console.log({ state, tabId });
         if (state.activeTabId === tabId)
             return;
         state.activeTabId = tabId;
@@ -4479,20 +4478,15 @@ const Tabs = () => {
         const selectedTab = selectedTabId ? anchoredTabs.find((a) => a.tabId === selectedTabId) : undefined;
         if (selectedTab) {
             state.activeTabId = selectedTab.tabId;
-            selectedTab.active = true;
             return selectedTab;
         }
-        const activeTab = anchoredTabs.find((t) => t.active);
-        if (activeTab) {
-            // Active tab property takes precedence over selectedTabId
-            state.activeTabId = activeTab.tabId;
-            return activeTab;
-        }
+        const curTab = state.activeTabId && anchoredTabs.find((a) => a.tabId === state.activeTabId);
+        if (curTab)
+            return curTab;
         // Default to first non-disabled tab
-        const firstAvailableTab = anchoredTabs.find((t) => !t.disabled && !t.href);
+        const firstAvailableTab = anchoredTabs.find((a) => !a.disabled && !a.href);
         if (firstAvailableTab) {
             state.activeTabId = firstAvailableTab.tabId;
-            firstAvailableTab.active = true;
             return firstAvailableTab;
         }
         return undefined;
@@ -4531,7 +4525,7 @@ const Tabs = () => {
                             disabled,
                         }, m('a', {
                             id: anchorId,
-                            className: tab.active ? 'active' : undefined,
+                            className: tab.tabId === state.activeTabId ? 'active' : undefined,
                             target,
                             href: href || `#${anchorId}`,
                             onclick: disabled || href

package/dist/index.umd.js CHANGED Viewed

@@ -4383,13 +4383,9 @@
     /** CSS-only Tabs component - no MaterializeCSS dependencies */
     const Tabs = () => {
         const toAnchored = () => {
-            let activeTabFound = false;
             return (tab) => {
-                const active = activeTabFound ? false : tab.active;
-                if (active)
-                    activeTabFound = true;
                 const tabId = createId(tab.title, tab.id);
-                return Object.assign(Object.assign({}, tab), { active, tabId, anchorId: `anchor-${tabId}` });
+                return Object.assign(Object.assign({}, tab), { tabId, anchorId: `anchor-${tabId}` });
             };
         };
         const state = {
@@ -4400,7 +4396,9 @@
             indicatorStyle: {
                 left: '0px',
                 width: '0px',
-            }};
+            },
+            lastIndicatorUpdate: '',
+        };
         const createId = (title, id) => (id ? id : title.replace(/ /g, '').toLowerCase());
         const updateIndicator = () => {
             const tabElement = document.getElementById(state.activeTabId);
@@ -4422,6 +4420,7 @@
             }
         };
         const handleTabClick = (tabId, tabElement, attrs) => {
+            console.log({ state, tabId });
             if (state.activeTabId === tabId)
                 return;
             state.activeTabId = tabId;
@@ -4481,20 +4480,15 @@
             const selectedTab = selectedTabId ? anchoredTabs.find((a) => a.tabId === selectedTabId) : undefined;
             if (selectedTab) {
                 state.activeTabId = selectedTab.tabId;
-                selectedTab.active = true;
                 return selectedTab;
             }
-            const activeTab = anchoredTabs.find((t) => t.active);
-            if (activeTab) {
-                // Active tab property takes precedence over selectedTabId
-                state.activeTabId = activeTab.tabId;
-                return activeTab;
-            }
+            const curTab = state.activeTabId && anchoredTabs.find((a) => a.tabId === state.activeTabId);
+            if (curTab)
+                return curTab;
             // Default to first non-disabled tab
-            const firstAvailableTab = anchoredTabs.find((t) => !t.disabled && !t.href);
+            const firstAvailableTab = anchoredTabs.find((a) => !a.disabled && !a.href);
             if (firstAvailableTab) {
                 state.activeTabId = firstAvailableTab.tabId;
-                firstAvailableTab.active = true;
                 return firstAvailableTab;
             }
             return undefined;
@@ -4533,7 +4527,7 @@
                                 disabled,
                             }, m('a', {
                                 id: anchorId,
-                                className: tab.active ? 'active' : undefined,
+                                className: tab.tabId === state.activeTabId ? 'active' : undefined,
                                 target,
                                 href: href || `#${anchorId}`,
                                 onclick: disabled || href

package/dist/tabs.d.ts CHANGED Viewed

@@ -14,8 +14,6 @@ export interface TabItem {
     vnode?: Vnode<any, any>;
     /** ID of the tab element. Default the title in lowercase */
     id?: string;
-    /** If the tab should be active */
-    active?: boolean;
     /** If the tab should be disabled */
     disabled?: boolean;
     /** CSS class for the tab (li), default `.tab.col.s3` */

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "mithril-materialized",
-  "version": "2.0.0-beta.6",
+  "version": "2.0.0-beta.7",
   "description": "A materialize library for mithril.",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",