capacitor-native-tabbar 0.0.1

package/dist/esm/web.js

@@ -0,0 +1,128 @@
+import { WebPlugin } from '@capacitor/core';
+export class CapTabbarWeb extends WebPlugin {
+    constructor() {
+        super(...arguments);
+        this.tabBarContainer = null;
+        this.tabItems = [];
+        this.selectedId = '';
+        this.labelColor = '#000000';
+        this.labelColorActive = '#007AFF';
+        this.tabElements = new Map();
+    }
+    async show(options) {
+        var _a, _b;
+        this.tabItems = options.tabs;
+        this.selectedId = options.selectedId;
+        this.labelColor = (_a = options.label_color) !== null && _a !== void 0 ? _a : '#000000';
+        this.labelColorActive = (_b = options.label_color_active) !== null && _b !== void 0 ? _b : '#007AFF';
+        this.removeTabBar();
+        this.createTabBar();
+    }
+    async hide() {
+        this.removeTabBar();
+    }
+    async setSelectedTab(options) {
+        if (this.selectedId === options.tabId)
+            return;
+        this.selectedId = options.tabId;
+        this.updateTabBarSelection();
+        this.notifyListeners('tabChange', { tabId: options.tabId });
+    }
+    async getState() {
+        const visible = this.tabBarContainer != null;
+        return {
+            visible,
+            activeTabId: visible ? this.selectedId : '',
+        };
+    }
+    base64ToDataUrl(base64, mime = 'image/png') {
+        var _a, _b;
+        const clean = base64.startsWith('data:') ? ((_b = (_a = base64.match(/base64,(.+)$/)) === null || _a === void 0 ? void 0 : _a[1]) !== null && _b !== void 0 ? _b : base64) : base64;
+        return `data:${mime};base64,${clean}`;
+    }
+    removeTabBar() {
+        if (this.tabBarContainer) {
+            this.tabBarContainer.remove();
+            this.tabBarContainer = null;
+            this.tabElements.clear();
+        }
+    }
+    createTabBar() {
+        const container = document.createElement('div');
+        container.id = 'capacitor-native-tabbar-web';
+        Object.assign(container.style, {
+            position: 'fixed',
+            bottom: '0',
+            left: '0',
+            right: '0',
+            height: '56px',
+            display: 'flex',
+            backgroundColor: '#ffffff',
+            borderTop: '1px solid #e0e0e0',
+            boxShadow: '0 -2px 10px rgba(0,0,0,0.1)',
+            zIndex: '9999',
+        });
+        this.tabItems.forEach((tab) => {
+            var _a, _b;
+            const tabEl = document.createElement('button');
+            tabEl.dataset.tabId = tab.id;
+            tabEl.type = 'button';
+            Object.assign(tabEl.style, {
+                flex: '1',
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center',
+                justifyContent: 'center',
+                gap: '4px',
+                border: 'none',
+                background: 'transparent',
+                cursor: 'pointer',
+                padding: '8px 4px',
+            });
+            const iconEl = document.createElement('img');
+            iconEl.style.width = '24px';
+            iconEl.style.height = '24px';
+            iconEl.style.objectFit = 'contain';
+            const isActive = tab.id === this.selectedId;
+            const iconData = isActive ? ((_a = tab.base64_active_icon) !== null && _a !== void 0 ? _a : tab.base64_icon) : ((_b = tab.base64_icon) !== null && _b !== void 0 ? _b : tab.base64_active_icon);
+            iconEl.src = iconData ? this.base64ToDataUrl(iconData) : 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><circle cx="12" cy="12" r="8"/></svg>';
+            const labelEl = document.createElement('span');
+            labelEl.textContent = tab.label;
+            Object.assign(labelEl.style, {
+                fontSize: '10px',
+                color: isActive ? this.labelColorActive : this.labelColor,
+            });
+            tabEl.appendChild(iconEl);
+            tabEl.appendChild(labelEl);
+            tabEl.addEventListener('click', () => {
+                this.handleTabClick(tab.id);
+            });
+            container.appendChild(tabEl);
+            this.tabElements.set(tab.id, { iconEl, labelEl });
+        });
+        document.body.appendChild(container);
+        this.tabBarContainer = container;
+    }
+    handleTabClick(tabId) {
+        const tab = this.tabItems.find((t) => t.id === tabId);
+        if (!tab || this.selectedId === tabId)
+            return;
+        this.selectedId = tabId;
+        this.updateTabBarSelection();
+        this.notifyListeners('tabChange', { tabId });
+    }
+    updateTabBarSelection() {
+        this.tabItems.forEach((tab) => {
+            var _a, _b;
+            const entry = this.tabElements.get(tab.id);
+            if (entry) {
+                const isActive = tab.id === this.selectedId;
+                const iconData = isActive ? ((_a = tab.base64_active_icon) !== null && _a !== void 0 ? _a : tab.base64_icon) : ((_b = tab.base64_icon) !== null && _b !== void 0 ? _b : tab.base64_active_icon);
+                if (iconData)
+                    entry.iconEl.src = this.base64ToDataUrl(iconData);
+                entry.labelEl.style.color = isActive ? this.labelColorActive : this.labelColor;
+            }
+        });
+    }
+}
+//# sourceMappingURL=web.js.map

package/dist/esm/web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"web.js","sourceRoot":"","sources":["../../src/web.ts"],"names":[],"mappings":"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","sourcesContent":["import { WebPlugin } from '@capacitor/core';\n\nimport type {\n  CapTabbarPlugin,\n  GetStateResult,\n  ShowOptions,\n  SetSelectedTabOptions,\n  TabChangeEvent,\n} from './definitions';\n\nexport class CapTabbarWeb extends WebPlugin implements CapTabbarPlugin {\n  private tabBarContainer: HTMLElement | null = null;\n  private tabItems: { id: string; label: string; base64_icon?: string; base64_active_icon?: string }[] = [];\n  private selectedId: string = '';\n  private labelColor: string = '#000000';\n  private labelColorActive: string = '#007AFF';\n  private tabElements: Map<\n    string,\n    { iconEl: HTMLImageElement; labelEl: HTMLSpanElement }\n  > = new Map();\n\n  async show(options: ShowOptions): Promise<void> {\n    this.tabItems = options.tabs;\n    this.selectedId = options.selectedId;\n    this.labelColor = options.label_color ?? '#000000';\n    this.labelColorActive = options.label_color_active ?? '#007AFF';\n\n    this.removeTabBar();\n    this.createTabBar();\n  }\n\n  async hide(): Promise<void> {\n    this.removeTabBar();\n  }\n\n  async setSelectedTab(options: SetSelectedTabOptions): Promise<void> {\n    if (this.selectedId === options.tabId) return;\n    this.selectedId = options.tabId;\n    this.updateTabBarSelection();\n    this.notifyListeners('tabChange', { tabId: options.tabId });\n  }\n\n  async getState(): Promise<GetStateResult> {\n    const visible = this.tabBarContainer != null;\n    return {\n      visible,\n      activeTabId: visible ? this.selectedId : '',\n    };\n  }\n\n  private base64ToDataUrl(base64: string, mime = 'image/png'): string {\n    const clean = base64.startsWith('data:') ? (base64.match(/base64,(.+)$/)?.[1] ?? base64) : base64;\n    return `data:${mime};base64,${clean}`;\n  }\n\n  private removeTabBar(): void {\n    if (this.tabBarContainer) {\n      this.tabBarContainer.remove();\n      this.tabBarContainer = null;\n      this.tabElements.clear();\n    }\n  }\n\n  private createTabBar(): void {\n    const container = document.createElement('div');\n    container.id = 'capacitor-native-tabbar-web';\n    Object.assign(container.style, {\n      position: 'fixed',\n      bottom: '0',\n      left: '0',\n      right: '0',\n      height: '56px',\n      display: 'flex',\n      backgroundColor: '#ffffff',\n      borderTop: '1px solid #e0e0e0',\n      boxShadow: '0 -2px 10px rgba(0,0,0,0.1)',\n      zIndex: '9999',\n    });\n\n    this.tabItems.forEach((tab) => {\n      const tabEl = document.createElement('button');\n      tabEl.dataset.tabId = tab.id;\n      tabEl.type = 'button';\n      Object.assign(tabEl.style, {\n        flex: '1',\n        display: 'flex',\n        flexDirection: 'column',\n        alignItems: 'center',\n        justifyContent: 'center',\n        gap: '4px',\n        border: 'none',\n        background: 'transparent',\n        cursor: 'pointer',\n        padding: '8px 4px',\n      });\n\n      const iconEl = document.createElement('img');\n      iconEl.style.width = '24px';\n      iconEl.style.height = '24px';\n      iconEl.style.objectFit = 'contain';\n      const isActive = tab.id === this.selectedId;\n      const iconData = isActive ? (tab.base64_active_icon ?? tab.base64_icon) : (tab.base64_icon ?? tab.base64_active_icon);\n      iconEl.src = iconData ? this.base64ToDataUrl(iconData) : 'data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><circle cx=\"12\" cy=\"12\" r=\"8\"/></svg>';\n\n      const labelEl = document.createElement('span');\n      labelEl.textContent = tab.label;\n      Object.assign(labelEl.style, {\n        fontSize: '10px',\n        color: isActive ? this.labelColorActive : this.labelColor,\n      });\n\n      tabEl.appendChild(iconEl);\n      tabEl.appendChild(labelEl);\n\n      tabEl.addEventListener('click', () => {\n        this.handleTabClick(tab.id);\n      });\n\n      container.appendChild(tabEl);\n      this.tabElements.set(tab.id, { iconEl, labelEl });\n    });\n\n    document.body.appendChild(container);\n    this.tabBarContainer = container;\n  }\n\n  private handleTabClick(tabId: string): void {\n    const tab = this.tabItems.find((t) => t.id === tabId);\n    if (!tab || this.selectedId === tabId) return;\n\n    this.selectedId = tabId;\n    this.updateTabBarSelection();\n    this.notifyListeners('tabChange', { tabId } as TabChangeEvent);\n  }\n\n  private updateTabBarSelection(): void {\n    this.tabItems.forEach((tab) => {\n      const entry = this.tabElements.get(tab.id);\n      if (entry) {\n        const isActive = tab.id === this.selectedId;\n        const iconData = isActive ? (tab.base64_active_icon ?? tab.base64_icon) : (tab.base64_icon ?? tab.base64_active_icon);\n        if (iconData) entry.iconEl.src = this.base64ToDataUrl(iconData);\n        entry.labelEl.style.color = isActive ? this.labelColorActive : this.labelColor;\n      }\n    });\n  }\n}\n"]}

package/dist/plugin.cjs.js

@@ -0,0 +1,142 @@
+'use strict';
+
+var core = require('@capacitor/core');
+
+const CapTabbar = core.registerPlugin('CapTabbar', {
+    web: () => Promise.resolve().then(function () { return web; }).then((m) => new m.CapTabbarWeb()),
+});
+
+class CapTabbarWeb extends core.WebPlugin {
+    constructor() {
+        super(...arguments);
+        this.tabBarContainer = null;
+        this.tabItems = [];
+        this.selectedId = '';
+        this.labelColor = '#000000';
+        this.labelColorActive = '#007AFF';
+        this.tabElements = new Map();
+    }
+    async show(options) {
+        var _a, _b;
+        this.tabItems = options.tabs;
+        this.selectedId = options.selectedId;
+        this.labelColor = (_a = options.label_color) !== null && _a !== void 0 ? _a : '#000000';
+        this.labelColorActive = (_b = options.label_color_active) !== null && _b !== void 0 ? _b : '#007AFF';
+        this.removeTabBar();
+        this.createTabBar();
+    }
+    async hide() {
+        this.removeTabBar();
+    }
+    async setSelectedTab(options) {
+        if (this.selectedId === options.tabId)
+            return;
+        this.selectedId = options.tabId;
+        this.updateTabBarSelection();
+        this.notifyListeners('tabChange', { tabId: options.tabId });
+    }
+    async getState() {
+        const visible = this.tabBarContainer != null;
+        return {
+            visible,
+            activeTabId: visible ? this.selectedId : '',
+        };
+    }
+    base64ToDataUrl(base64, mime = 'image/png') {
+        var _a, _b;
+        const clean = base64.startsWith('data:') ? ((_b = (_a = base64.match(/base64,(.+)$/)) === null || _a === void 0 ? void 0 : _a[1]) !== null && _b !== void 0 ? _b : base64) : base64;
+        return `data:${mime};base64,${clean}`;
+    }
+    removeTabBar() {
+        if (this.tabBarContainer) {
+            this.tabBarContainer.remove();
+            this.tabBarContainer = null;
+            this.tabElements.clear();
+        }
+    }
+    createTabBar() {
+        const container = document.createElement('div');
+        container.id = 'capacitor-native-tabbar-web';
+        Object.assign(container.style, {
+            position: 'fixed',
+            bottom: '0',
+            left: '0',
+            right: '0',
+            height: '56px',
+            display: 'flex',
+            backgroundColor: '#ffffff',
+            borderTop: '1px solid #e0e0e0',
+            boxShadow: '0 -2px 10px rgba(0,0,0,0.1)',
+            zIndex: '9999',
+        });
+        this.tabItems.forEach((tab) => {
+            var _a, _b;
+            const tabEl = document.createElement('button');
+            tabEl.dataset.tabId = tab.id;
+            tabEl.type = 'button';
+            Object.assign(tabEl.style, {
+                flex: '1',
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center',
+                justifyContent: 'center',
+                gap: '4px',
+                border: 'none',
+                background: 'transparent',
+                cursor: 'pointer',
+                padding: '8px 4px',
+            });
+            const iconEl = document.createElement('img');
+            iconEl.style.width = '24px';
+            iconEl.style.height = '24px';
+            iconEl.style.objectFit = 'contain';
+            const isActive = tab.id === this.selectedId;
+            const iconData = isActive ? ((_a = tab.base64_active_icon) !== null && _a !== void 0 ? _a : tab.base64_icon) : ((_b = tab.base64_icon) !== null && _b !== void 0 ? _b : tab.base64_active_icon);
+            iconEl.src = iconData ? this.base64ToDataUrl(iconData) : 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><circle cx="12" cy="12" r="8"/></svg>';
+            const labelEl = document.createElement('span');
+            labelEl.textContent = tab.label;
+            Object.assign(labelEl.style, {
+                fontSize: '10px',
+                color: isActive ? this.labelColorActive : this.labelColor,
+            });
+            tabEl.appendChild(iconEl);
+            tabEl.appendChild(labelEl);
+            tabEl.addEventListener('click', () => {
+                this.handleTabClick(tab.id);
+            });
+            container.appendChild(tabEl);
+            this.tabElements.set(tab.id, { iconEl, labelEl });
+        });
+        document.body.appendChild(container);
+        this.tabBarContainer = container;
+    }
+    handleTabClick(tabId) {
+        const tab = this.tabItems.find((t) => t.id === tabId);
+        if (!tab || this.selectedId === tabId)
+            return;
+        this.selectedId = tabId;
+        this.updateTabBarSelection();
+        this.notifyListeners('tabChange', { tabId });
+    }
+    updateTabBarSelection() {
+        this.tabItems.forEach((tab) => {
+            var _a, _b;
+            const entry = this.tabElements.get(tab.id);
+            if (entry) {
+                const isActive = tab.id === this.selectedId;
+                const iconData = isActive ? ((_a = tab.base64_active_icon) !== null && _a !== void 0 ? _a : tab.base64_icon) : ((_b = tab.base64_icon) !== null && _b !== void 0 ? _b : tab.base64_active_icon);
+                if (iconData)
+                    entry.iconEl.src = this.base64ToDataUrl(iconData);
+                entry.labelEl.style.color = isActive ? this.labelColorActive : this.labelColor;
+            }
+        });
+    }
+}
+
+var web = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    CapTabbarWeb: CapTabbarWeb
+});
+
+exports.CapTabbar = CapTabbar;
+//# sourceMappingURL=plugin.cjs.js.map

package/dist/plugin.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin.cjs.js","sources":["esm/index.js","esm/web.js"],"sourcesContent":["import { registerPlugin } from '@capacitor/core';\nconst CapTabbar = registerPlugin('CapTabbar', {\n    web: () => import('./web').then((m) => new m.CapTabbarWeb()),\n});\nexport * from './definitions';\nexport { CapTabbar };\n//# sourceMappingURL=index.js.map","import { WebPlugin } from '@capacitor/core';\nexport class CapTabbarWeb extends WebPlugin {\n    constructor() {\n        super(...arguments);\n        this.tabBarContainer = null;\n        this.tabItems = [];\n        this.selectedId = '';\n        this.labelColor = '#000000';\n        this.labelColorActive = '#007AFF';\n        this.tabElements = new Map();\n    }\n    async show(options) {\n        var _a, _b;\n        this.tabItems = options.tabs;\n        this.selectedId = options.selectedId;\n        this.labelColor = (_a = options.label_color) !== null && _a !== void 0 ? _a : '#000000';\n        this.labelColorActive = (_b = options.label_color_active) !== null && _b !== void 0 ? _b : '#007AFF';\n        this.removeTabBar();\n        this.createTabBar();\n    }\n    async hide() {\n        this.removeTabBar();\n    }\n    async setSelectedTab(options) {\n        if (this.selectedId === options.tabId)\n            return;\n        this.selectedId = options.tabId;\n        this.updateTabBarSelection();\n        this.notifyListeners('tabChange', { tabId: options.tabId });\n    }\n    async getState() {\n        const visible = this.tabBarContainer != null;\n        return {\n            visible,\n            activeTabId: visible ? this.selectedId : '',\n        };\n    }\n    base64ToDataUrl(base64, mime = 'image/png') {\n        var _a, _b;\n        const clean = base64.startsWith('data:') ? ((_b = (_a = base64.match(/base64,(.+)$/)) === null || _a === void 0 ? void 0 : _a[1]) !== null && _b !== void 0 ? _b : base64) : base64;\n        return `data:${mime};base64,${clean}`;\n    }\n    removeTabBar() {\n        if (this.tabBarContainer) {\n            this.tabBarContainer.remove();\n            this.tabBarContainer = null;\n            this.tabElements.clear();\n        }\n    }\n    createTabBar() {\n        const container = document.createElement('div');\n        container.id = 'capacitor-native-tabbar-web';\n        Object.assign(container.style, {\n            position: 'fixed',\n            bottom: '0',\n            left: '0',\n            right: '0',\n            height: '56px',\n            display: 'flex',\n            backgroundColor: '#ffffff',\n            borderTop: '1px solid #e0e0e0',\n            boxShadow: '0 -2px 10px rgba(0,0,0,0.1)',\n            zIndex: '9999',\n        });\n        this.tabItems.forEach((tab) => {\n            var _a, _b;\n            const tabEl = document.createElement('button');\n            tabEl.dataset.tabId = tab.id;\n            tabEl.type = 'button';\n            Object.assign(tabEl.style, {\n                flex: '1',\n                display: 'flex',\n                flexDirection: 'column',\n                alignItems: 'center',\n                justifyContent: 'center',\n                gap: '4px',\n                border: 'none',\n                background: 'transparent',\n                cursor: 'pointer',\n                padding: '8px 4px',\n            });\n            const iconEl = document.createElement('img');\n            iconEl.style.width = '24px';\n            iconEl.style.height = '24px';\n            iconEl.style.objectFit = 'contain';\n            const isActive = tab.id === this.selectedId;\n            const iconData = isActive ? ((_a = tab.base64_active_icon) !== null && _a !== void 0 ? _a : tab.base64_icon) : ((_b = tab.base64_icon) !== null && _b !== void 0 ? _b : tab.base64_active_icon);\n            iconEl.src = iconData ? this.base64ToDataUrl(iconData) : 'data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><circle cx=\"12\" cy=\"12\" r=\"8\"/></svg>';\n            const labelEl = document.createElement('span');\n            labelEl.textContent = tab.label;\n            Object.assign(labelEl.style, {\n                fontSize: '10px',\n                color: isActive ? this.labelColorActive : this.labelColor,\n            });\n            tabEl.appendChild(iconEl);\n            tabEl.appendChild(labelEl);\n            tabEl.addEventListener('click', () => {\n                this.handleTabClick(tab.id);\n            });\n            container.appendChild(tabEl);\n            this.tabElements.set(tab.id, { iconEl, labelEl });\n        });\n        document.body.appendChild(container);\n        this.tabBarContainer = container;\n    }\n    handleTabClick(tabId) {\n        const tab = this.tabItems.find((t) => t.id === tabId);\n        if (!tab || this.selectedId === tabId)\n            return;\n        this.selectedId = tabId;\n        this.updateTabBarSelection();\n        this.notifyListeners('tabChange', { tabId });\n    }\n    updateTabBarSelection() {\n        this.tabItems.forEach((tab) => {\n            var _a, _b;\n            const entry = this.tabElements.get(tab.id);\n            if (entry) {\n                const isActive = tab.id === this.selectedId;\n                const iconData = isActive ? ((_a = tab.base64_active_icon) !== null && _a !== void 0 ? _a : tab.base64_icon) : ((_b = tab.base64_icon) !== null && _b !== void 0 ? _b : tab.base64_active_icon);\n                if (iconData)\n                    entry.iconEl.src = this.base64ToDataUrl(iconData);\n                entry.labelEl.style.color = isActive ? this.labelColorActive : this.labelColor;\n            }\n        });\n    }\n}\n//# sourceMappingURL=web.js.map"],"names":["registerPlugin","WebPlugin"],"mappings":"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"}

package/dist/plugin.js

@@ -0,0 +1,145 @@
+var capacitorCapTabbar = (function (exports, core) {
+    'use strict';
+
+    const CapTabbar = core.registerPlugin('CapTabbar', {
+        web: () => Promise.resolve().then(function () { return web; }).then((m) => new m.CapTabbarWeb()),
+    });
+
+    class CapTabbarWeb extends core.WebPlugin {
+        constructor() {
+            super(...arguments);
+            this.tabBarContainer = null;
+            this.tabItems = [];
+            this.selectedId = '';
+            this.labelColor = '#000000';
+            this.labelColorActive = '#007AFF';
+            this.tabElements = new Map();
+        }
+        async show(options) {
+            var _a, _b;
+            this.tabItems = options.tabs;
+            this.selectedId = options.selectedId;
+            this.labelColor = (_a = options.label_color) !== null && _a !== void 0 ? _a : '#000000';
+            this.labelColorActive = (_b = options.label_color_active) !== null && _b !== void 0 ? _b : '#007AFF';
+            this.removeTabBar();
+            this.createTabBar();
+        }
+        async hide() {
+            this.removeTabBar();
+        }
+        async setSelectedTab(options) {
+            if (this.selectedId === options.tabId)
+                return;
+            this.selectedId = options.tabId;
+            this.updateTabBarSelection();
+            this.notifyListeners('tabChange', { tabId: options.tabId });
+        }
+        async getState() {
+            const visible = this.tabBarContainer != null;
+            return {
+                visible,
+                activeTabId: visible ? this.selectedId : '',
+            };
+        }
+        base64ToDataUrl(base64, mime = 'image/png') {
+            var _a, _b;
+            const clean = base64.startsWith('data:') ? ((_b = (_a = base64.match(/base64,(.+)$/)) === null || _a === void 0 ? void 0 : _a[1]) !== null && _b !== void 0 ? _b : base64) : base64;
+            return `data:${mime};base64,${clean}`;
+        }
+        removeTabBar() {
+            if (this.tabBarContainer) {
+                this.tabBarContainer.remove();
+                this.tabBarContainer = null;
+                this.tabElements.clear();
+            }
+        }
+        createTabBar() {
+            const container = document.createElement('div');
+            container.id = 'capacitor-native-tabbar-web';
+            Object.assign(container.style, {
+                position: 'fixed',
+                bottom: '0',
+                left: '0',
+                right: '0',
+                height: '56px',
+                display: 'flex',
+                backgroundColor: '#ffffff',
+                borderTop: '1px solid #e0e0e0',
+                boxShadow: '0 -2px 10px rgba(0,0,0,0.1)',
+                zIndex: '9999',
+            });
+            this.tabItems.forEach((tab) => {
+                var _a, _b;
+                const tabEl = document.createElement('button');
+                tabEl.dataset.tabId = tab.id;
+                tabEl.type = 'button';
+                Object.assign(tabEl.style, {
+                    flex: '1',
+                    display: 'flex',
+                    flexDirection: 'column',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    gap: '4px',
+                    border: 'none',
+                    background: 'transparent',
+                    cursor: 'pointer',
+                    padding: '8px 4px',
+                });
+                const iconEl = document.createElement('img');
+                iconEl.style.width = '24px';
+                iconEl.style.height = '24px';
+                iconEl.style.objectFit = 'contain';
+                const isActive = tab.id === this.selectedId;
+                const iconData = isActive ? ((_a = tab.base64_active_icon) !== null && _a !== void 0 ? _a : tab.base64_icon) : ((_b = tab.base64_icon) !== null && _b !== void 0 ? _b : tab.base64_active_icon);
+                iconEl.src = iconData ? this.base64ToDataUrl(iconData) : 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><circle cx="12" cy="12" r="8"/></svg>';
+                const labelEl = document.createElement('span');
+                labelEl.textContent = tab.label;
+                Object.assign(labelEl.style, {
+                    fontSize: '10px',
+                    color: isActive ? this.labelColorActive : this.labelColor,
+                });
+                tabEl.appendChild(iconEl);
+                tabEl.appendChild(labelEl);
+                tabEl.addEventListener('click', () => {
+                    this.handleTabClick(tab.id);
+                });
+                container.appendChild(tabEl);
+                this.tabElements.set(tab.id, { iconEl, labelEl });
+            });
+            document.body.appendChild(container);
+            this.tabBarContainer = container;
+        }
+        handleTabClick(tabId) {
+            const tab = this.tabItems.find((t) => t.id === tabId);
+            if (!tab || this.selectedId === tabId)
+                return;
+            this.selectedId = tabId;
+            this.updateTabBarSelection();
+            this.notifyListeners('tabChange', { tabId });
+        }
+        updateTabBarSelection() {
+            this.tabItems.forEach((tab) => {
+                var _a, _b;
+                const entry = this.tabElements.get(tab.id);
+                if (entry) {
+                    const isActive = tab.id === this.selectedId;
+                    const iconData = isActive ? ((_a = tab.base64_active_icon) !== null && _a !== void 0 ? _a : tab.base64_icon) : ((_b = tab.base64_icon) !== null && _b !== void 0 ? _b : tab.base64_active_icon);
+                    if (iconData)
+                        entry.iconEl.src = this.base64ToDataUrl(iconData);
+                    entry.labelEl.style.color = isActive ? this.labelColorActive : this.labelColor;
+                }
+            });
+        }
+    }
+
+    var web = /*#__PURE__*/Object.freeze({
+        __proto__: null,
+        CapTabbarWeb: CapTabbarWeb
+    });
+
+    exports.CapTabbar = CapTabbar;
+
+    return exports;
+
+})({}, capacitorExports);
+//# sourceMappingURL=plugin.js.map

package/dist/plugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin.js","sources":["esm/index.js","esm/web.js"],"sourcesContent":["import { registerPlugin } from '@capacitor/core';\nconst CapTabbar = registerPlugin('CapTabbar', {\n    web: () => import('./web').then((m) => new m.CapTabbarWeb()),\n});\nexport * from './definitions';\nexport { CapTabbar };\n//# sourceMappingURL=index.js.map","import { WebPlugin } from '@capacitor/core';\nexport class CapTabbarWeb extends WebPlugin {\n    constructor() {\n        super(...arguments);\n        this.tabBarContainer = null;\n        this.tabItems = [];\n        this.selectedId = '';\n        this.labelColor = '#000000';\n        this.labelColorActive = '#007AFF';\n        this.tabElements = new Map();\n    }\n    async show(options) {\n        var _a, _b;\n        this.tabItems = options.tabs;\n        this.selectedId = options.selectedId;\n        this.labelColor = (_a = options.label_color) !== null && _a !== void 0 ? _a : '#000000';\n        this.labelColorActive = (_b = options.label_color_active) !== null && _b !== void 0 ? _b : '#007AFF';\n        this.removeTabBar();\n        this.createTabBar();\n    }\n    async hide() {\n        this.removeTabBar();\n    }\n    async setSelectedTab(options) {\n        if (this.selectedId === options.tabId)\n            return;\n        this.selectedId = options.tabId;\n        this.updateTabBarSelection();\n        this.notifyListeners('tabChange', { tabId: options.tabId });\n    }\n    async getState() {\n        const visible = this.tabBarContainer != null;\n        return {\n            visible,\n            activeTabId: visible ? this.selectedId : '',\n        };\n    }\n    base64ToDataUrl(base64, mime = 'image/png') {\n        var _a, _b;\n        const clean = base64.startsWith('data:') ? ((_b = (_a = base64.match(/base64,(.+)$/)) === null || _a === void 0 ? void 0 : _a[1]) !== null && _b !== void 0 ? _b : base64) : base64;\n        return `data:${mime};base64,${clean}`;\n    }\n    removeTabBar() {\n        if (this.tabBarContainer) {\n            this.tabBarContainer.remove();\n            this.tabBarContainer = null;\n            this.tabElements.clear();\n        }\n    }\n    createTabBar() {\n        const container = document.createElement('div');\n        container.id = 'capacitor-native-tabbar-web';\n        Object.assign(container.style, {\n            position: 'fixed',\n            bottom: '0',\n            left: '0',\n            right: '0',\n            height: '56px',\n            display: 'flex',\n            backgroundColor: '#ffffff',\n            borderTop: '1px solid #e0e0e0',\n            boxShadow: '0 -2px 10px rgba(0,0,0,0.1)',\n            zIndex: '9999',\n        });\n        this.tabItems.forEach((tab) => {\n            var _a, _b;\n            const tabEl = document.createElement('button');\n            tabEl.dataset.tabId = tab.id;\n            tabEl.type = 'button';\n            Object.assign(tabEl.style, {\n                flex: '1',\n                display: 'flex',\n                flexDirection: 'column',\n                alignItems: 'center',\n                justifyContent: 'center',\n                gap: '4px',\n                border: 'none',\n                background: 'transparent',\n                cursor: 'pointer',\n                padding: '8px 4px',\n            });\n            const iconEl = document.createElement('img');\n            iconEl.style.width = '24px';\n            iconEl.style.height = '24px';\n            iconEl.style.objectFit = 'contain';\n            const isActive = tab.id === this.selectedId;\n            const iconData = isActive ? ((_a = tab.base64_active_icon) !== null && _a !== void 0 ? _a : tab.base64_icon) : ((_b = tab.base64_icon) !== null && _b !== void 0 ? _b : tab.base64_active_icon);\n            iconEl.src = iconData ? this.base64ToDataUrl(iconData) : 'data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><circle cx=\"12\" cy=\"12\" r=\"8\"/></svg>';\n            const labelEl = document.createElement('span');\n            labelEl.textContent = tab.label;\n            Object.assign(labelEl.style, {\n                fontSize: '10px',\n                color: isActive ? this.labelColorActive : this.labelColor,\n            });\n            tabEl.appendChild(iconEl);\n            tabEl.appendChild(labelEl);\n            tabEl.addEventListener('click', () => {\n                this.handleTabClick(tab.id);\n            });\n            container.appendChild(tabEl);\n            this.tabElements.set(tab.id, { iconEl, labelEl });\n        });\n        document.body.appendChild(container);\n        this.tabBarContainer = container;\n    }\n    handleTabClick(tabId) {\n        const tab = this.tabItems.find((t) => t.id === tabId);\n        if (!tab || this.selectedId === tabId)\n            return;\n        this.selectedId = tabId;\n        this.updateTabBarSelection();\n        this.notifyListeners('tabChange', { tabId });\n    }\n    updateTabBarSelection() {\n        this.tabItems.forEach((tab) => {\n            var _a, _b;\n            const entry = this.tabElements.get(tab.id);\n            if (entry) {\n                const isActive = tab.id === this.selectedId;\n                const iconData = isActive ? ((_a = tab.base64_active_icon) !== null && _a !== void 0 ? _a : tab.base64_icon) : ((_b = tab.base64_icon) !== null && _b !== void 0 ? _b : tab.base64_active_icon);\n                if (iconData)\n                    entry.iconEl.src = this.base64ToDataUrl(iconData);\n                entry.labelEl.style.color = isActive ? this.labelColorActive : this.labelColor;\n            }\n        });\n    }\n}\n//# sourceMappingURL=web.js.map"],"names":["registerPlugin","WebPlugin"],"mappings":"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"}