@microcosmmoney/portal-react 3.12.1 → 3.12.2

package/dist/components/mcd/mcd-page.js

@@ -133,7 +133,7 @@ function MicrocosmMCDPage({ basePath = '', onNavigate }) {
     if (!mcdData && !mcdLoading) {
         return ((0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center h-[60vh]", children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg p-8 text-center", children: [(0, jsx_runtime_1.jsx)(IconWallet, { className: "w-12 h-12 mx-auto mb-4 text-neutral-500" }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400", children: t('loginRequired', 'Please log in to view your MCD balance') })] }) }));
     }
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "max-w-7xl mx-auto p-6 space-y-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-2xl font-bold text-white tracking-wider", children: t('title', 'MCD Credits') }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400 mt-1", children: t('subtitle', 'Microcosm Dollar - Ecosystem consumption credits') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("button", { onClick: () => handleNav('/mcc/wallet'), className: "flex items-center px-3 py-1.5 text-sm border border-neutral-700 rounded text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent transition-colors", children: [(0, jsx_runtime_1.jsx)(IconWallet, { className: "w-4 h-4 mr-2" }), t('manageWallet', 'Manage Wallet')] }), (0, jsx_runtime_1.jsxs)("button", { onClick: () => setShowHelp(!showHelp), className: "flex items-center px-3 py-1.5 text-sm border border-neutral-700 rounded text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent transition-colors", children: [(0, jsx_runtime_1.jsx)(IconHelpCircle, { className: "w-4 h-4 mr-2" }), t('helpGuide', 'Help Guide')] }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleRefresh, disabled: refreshing, className: "flex items-center px-3 py-1.5 text-sm border border-neutral-700 rounded text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent transition-colors disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)(IconRefresh, { className: `w-4 h-4 mr-2 ${refreshing ? 'animate-spin' : ''}` }), t('refresh', 'Refresh')] })] })] }), showHelp && ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg p-6 hover:border-cyan-400/50 transition-colors", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-white font-bold tracking-wider mb-4", children: t('mcdGuideTitle', 'MCD Credits Guide') }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-4 text-sm", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("h4", { className: "font-medium text-white mb-2 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconGift, { className: "w-4 h-4 text-white" }), t('howToGetMcd', 'How to Earn MCD')] }), (0, jsx_runtime_1.jsxs)("ul", { className: "list-disc list-inside text-neutral-400 space-y-1", children: [(0, jsx_runtime_1.jsx)("li", { children: "Daily distribution from territory vault (1% of vault balance)" }), (0, jsx_runtime_1.jsx)("li", { children: "Companion yield from mining operations" }), (0, jsx_runtime_1.jsx)("li", { children: "Ecosystem service rewards" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("h4", { className: "font-medium text-white mb-2 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconCoins, { className: "w-4 h-4 text-white" }), t('mcdUsage', 'MCD Usage')] }), (0, jsx_runtime_1.jsxs)("ul", { className: "list-disc list-inside text-neutral-400 space-y-1", children: [(0, jsx_runtime_1.jsx)("li", { children: "Spend on ecosystem services (Double Helix, xSocial, etc.)" }), (0, jsx_runtime_1.jsx)("li", { children: "Transfer between users" }), (0, jsx_runtime_1.jsx)("li", { children: "Future governance participation" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("h4", { className: "font-medium text-white mb-2 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconHistory, { className: "w-4 h-4 text-white" }), t('notes', 'Notes')] }), (0, jsx_runtime_1.jsxs)("ul", { className: "list-disc list-inside text-neutral-400 space-y-1", children: [(0, jsx_runtime_1.jsx)("li", { children: "MCD is an internal ecosystem token, not tradeable on exchanges" }), (0, jsx_runtime_1.jsx)("li", { children: "Daily distribution happens automatically at 00:15 UTC" }), (0, jsx_runtime_1.jsx)("li", { children: "Check your territory page for vault balance details" })] })] })] })] })), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg p-6 hover:border-cyan-400/50 transition-colors", children: (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-6", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-neutral-400 text-xs font-mono tracking-wider mb-1", children: "available_balance" }), mcdLoading ? ((0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2 h-10", children: (0, jsx_runtime_1.jsx)(Spinner, {}) })) : ((0, jsx_runtime_1.jsx)("div", { className: "text-4xl font-bold font-mono text-cyan-400", children: fmt(mcdAmount) })), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500 mt-1", children: "MCD" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-neutral-400 text-xs font-mono tracking-wider mb-1", children: "total_received" }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold font-mono text-white", children: fmt(mcdReceived, 0) }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500 mt-1", children: "lifetime income" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-neutral-400 text-xs font-mono tracking-wider mb-1", children: "total_spent" }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold font-mono text-neutral-400", children: fmt(mcdSpent, 0) }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500 mt-1", children: "lifetime spent" })] })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg p-6 hover:border-cyan-400/50 transition-colors", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconCoins, { className: "w-5 h-5 text-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-400 tracking-wider", children: t('onChainBalance', 'On-chain MCD Balance (Helius RPC)') })] }), walletList.length > 1 && ((0, jsx_runtime_1.jsxs)("button", { onClick: () => setWalletsExpanded(!walletsExpanded), className: "flex items-center text-sm text-neutral-400 hover:text-cyan-400 transition-colors", children: [walletList.length, " ", t('walletsCount', 'wallets'), walletsExpanded
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "max-w-7xl mx-auto p-6 space-y-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-2xl font-bold text-white tracking-wider", children: t('title', 'MCD Credits') }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400 mt-1", children: t('subtitle', 'Microcosm Dollar - Ecosystem consumption credits') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("button", { onClick: () => handleNav('/mcc/wallet'), className: "flex items-center px-3 py-1.5 text-sm border border-neutral-700 rounded text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent transition-colors", children: [(0, jsx_runtime_1.jsx)(IconWallet, { className: "w-4 h-4 mr-2" }), t('manageWallet', 'Manage Wallet')] }), (0, jsx_runtime_1.jsxs)("button", { onClick: () => setShowHelp(!showHelp), className: "flex items-center px-3 py-1.5 text-sm border border-neutral-700 rounded text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent transition-colors", children: [(0, jsx_runtime_1.jsx)(IconHelpCircle, { className: "w-4 h-4 mr-2" }), t('helpGuide', 'Help Guide')] }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleRefresh, disabled: refreshing, className: "flex items-center px-3 py-1.5 text-sm border border-neutral-700 rounded text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent transition-colors disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)(IconRefresh, { className: `w-4 h-4 mr-2 ${refreshing ? 'animate-spin' : ''}` }), t('refresh', 'Refresh')] })] })] }), showHelp && ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg p-6 hover:border-cyan-400/50 transition-colors", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-white font-bold tracking-wider mb-4", children: t('mcdGuideTitle', 'MCD Credits Guide') }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-4 text-sm", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("h4", { className: "font-medium text-white mb-2 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconGift, { className: "w-4 h-4 text-white" }), t('howToGetMcd', 'How to Earn MCD')] }), (0, jsx_runtime_1.jsxs)("ul", { className: "list-disc list-inside text-neutral-400 space-y-1", children: [(0, jsx_runtime_1.jsx)("li", { children: "Daily distribution from territory vault (1% of vault balance)" }), (0, jsx_runtime_1.jsx)("li", { children: "Companion yield from mining operations" }), (0, jsx_runtime_1.jsx)("li", { children: "Ecosystem service rewards" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("h4", { className: "font-medium text-white mb-2 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconCoins, { className: "w-4 h-4 text-white" }), t('mcdUsage', 'MCD Usage')] }), (0, jsx_runtime_1.jsxs)("ul", { className: "list-disc list-inside text-neutral-400 space-y-1", children: [(0, jsx_runtime_1.jsx)("li", { children: "Spend on ecosystem services (Double Helix, xSocial, etc.)" }), (0, jsx_runtime_1.jsx)("li", { children: "Transfer between users" }), (0, jsx_runtime_1.jsx)("li", { children: "Future governance participation" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("h4", { className: "font-medium text-white mb-2 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconHistory, { className: "w-4 h-4 text-white" }), t('notes', 'Notes')] }), (0, jsx_runtime_1.jsxs)("ul", { className: "list-disc list-inside text-neutral-400 space-y-1", children: [(0, jsx_runtime_1.jsx)("li", { children: "MCD is an internal ecosystem token, not tradeable on exchanges" }), (0, jsx_runtime_1.jsx)("li", { children: "Daily distribution happens automatically at 00:15 UTC" }), (0, jsx_runtime_1.jsx)("li", { children: "Check your territory page for vault balance details" })] })] })] })] })), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg p-6 hover:border-cyan-400/50 transition-colors", children: (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-6", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-neutral-400 text-xs font-mono tracking-wider mb-1", children: "available_balance" }), mcdLoading ? ((0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2 h-10", children: (0, jsx_runtime_1.jsx)(Spinner, {}) })) : ((0, jsx_runtime_1.jsx)("div", { className: "text-4xl font-bold font-mono text-cyan-400", children: fmt(mcdAmount) })), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500 mt-1", children: "MCD" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-neutral-400 text-xs font-mono tracking-wider mb-1", children: "total_received" }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold font-mono text-white", children: fmt(mcdReceived, 0) }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500 mt-1", children: "lifetime income" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-neutral-400 text-xs font-mono tracking-wider mb-1", children: "total_spent" }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold font-mono text-neutral-400", children: fmt(mcdSpent, 0) }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500 mt-1", children: "lifetime spent" })] })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg p-6 hover:border-cyan-400/50 transition-colors", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconCoins, { className: "w-5 h-5 text-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-400 tracking-wider", children: t('onChainBalance', 'On-chain MCD Balance') })] }), walletList.length > 1 && ((0, jsx_runtime_1.jsxs)("button", { onClick: () => setWalletsExpanded(!walletsExpanded), className: "flex items-center text-sm text-neutral-400 hover:text-cyan-400 transition-colors", children: [walletList.length, " ", t('walletsCount', 'wallets'), walletsExpanded
                                         ? (0, jsx_runtime_1.jsx)(IconChevronUp, { className: "w-4 h-4 ml-1" })
                                         : (0, jsx_runtime_1.jsx)(IconChevronDown, { className: "w-4 h-4 ml-1" })] }))] }), walletsLoading ? ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(Spinner, {}), (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-500 text-sm", children: t('loadingOnChain', 'Loading on-chain balance...') })] })) : walletList.length === 0 ? ((0, jsx_runtime_1.jsxs)("div", { className: "text-center py-4", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-neutral-500 mb-3", children: t('noWalletBound', 'No Solana wallet bound yet') }), (0, jsx_runtime_1.jsxs)("button", { onClick: () => handleNav('/mcc/wallet'), className: "flex items-center mx-auto px-3 py-1.5 text-sm border border-neutral-700 rounded text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent transition-colors", children: [(0, jsx_runtime_1.jsx)(IconWallet, { className: "w-4 h-4 mr-2" }), t('connectWallet', 'Connect Wallet')] })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [walletList.length === 1 && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-2 text-xs text-neutral-500 font-mono", children: [walletList[0].wallet_address.slice(0, 4), "...", walletList[0].wallet_address.slice(-4), walletList[0].is_primary && ((0, jsx_runtime_1.jsx)("span", { className: "inline-block text-[10px] border border-cyan-400/30 text-cyan-400 px-1.5 py-0 ml-2 rounded", children: t('primaryWallet', 'Primary') }))] })), walletsExpanded && walletList.length > 1 && ((0, jsx_runtime_1.jsx)("div", { className: "mt-4 space-y-2 border-t border-neutral-700 pt-4", children: walletList.map((w) => ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between p-2 bg-neutral-800 rounded hover:bg-neutral-700 transition-colors", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-xs font-mono text-neutral-400", children: [w.wallet_address.slice(0, 4), "...", w.wallet_address.slice(-4)] }), w.is_primary && ((0, jsx_runtime_1.jsx)("span", { className: "inline-block text-[10px] border border-cyan-400/30 text-cyan-400 px-1.5 py-0 rounded", children: t('primaryWallet', 'Primary') }))] }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm font-mono text-white", children: "MCD" })] }, w.wallet_address))) }))] }))] }), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors", children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-1", children: [(0, jsx_runtime_1.jsx)(IconTrendingUp, { className: "w-5 h-5 text-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm font-medium text-neutral-300 tracking-wider", children: t('mcdMinting', 'MCD Minting') })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 text-sm mb-4", children: t('mintMccWithMcd', 'Consume MCD to mint MCC Token') }), (0, jsx_runtime_1.jsxs)("button", { onClick: () => handleNav('/mcc/mining'), className: "w-full flex items-center justify-center gap-2 h-10 rounded-md bg-cyan-700 hover:bg-cyan-600 transition-all text-white text-sm font-medium cursor-pointer", children: [(0, jsx_runtime_1.jsx)(IconCoins, { className: "w-4 h-4" }), t('useMcdToMintMcc', 'Mint MCC with MCD')] }), (0, jsx_runtime_1.jsx)("div", { className: "mt-3 p-3 bg-neutral-800 rounded", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-2 text-xs text-cyan-400/70", children: [(0, jsx_runtime_1.jsx)(IconAlertTriangle, { className: "w-3.5 h-3.5 mt-0.5 shrink-0 text-cyan-400" }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-1", children: [(0, jsx_runtime_1.jsx)("p", { children: "MCD mining requires Miner level or above" }), (0, jsx_runtime_1.jsx)("p", { children: "Mining price = Oracle price x 2, MCD companion yield included" })] })] }) })] }) }), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors", children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-1", children: [(0, jsx_runtime_1.jsx)(IconGift, { className: "w-5 h-5 text-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm font-medium text-neutral-300 tracking-wider", children: t('ecoServices', 'Ecosystem Services') })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 text-sm mb-4", children: t('ecoServicesDesc', 'Use MCD to access ecosystem project services') }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: ECOSYSTEM_SERVICES.map((p) => ((0, jsx_runtime_1.jsxs)("a", { href: p.url, target: "_blank", rel: "noopener noreferrer", className: "block p-4 bg-neutral-800 rounded-lg hover:bg-neutral-700 transition-colors group", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3 mb-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-10 h-10 rounded-lg bg-cyan-400/20 flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(p.Icon, { className: "w-5 h-5 text-cyan-400" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 min-w-0", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-medium text-white text-sm", children: p.name }), (0, jsx_runtime_1.jsx)(IconExternalLink, { className: "w-3 h-3 text-neutral-600 opacity-0 group-hover:opacity-100 transition-opacity" })] }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-500", children: p.tagline })] }), (0, jsx_runtime_1.jsx)("span", { className: `text-[10px] ${p.statusColor}`, children: p.status })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400 leading-relaxed", children: p.desc })] }, p.name))) })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 border border-neutral-700 rounded-lg p-1 inline-flex", children: [(0, jsx_runtime_1.jsxs)("button", { onClick: () => setActiveTab('daily'), className: `flex items-center px-4 py-2 text-sm rounded-md transition-colors ${activeTab === 'daily'
                             ? 'bg-neutral-700 text-white'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@microcosmmoney/portal-react",
-  "version": "3.12.1",
+  "version": "3.12.2",
   "description": "Microcosm Portal UI components for React/Next.js",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",