@skip-go/widget 2.3.2 → 2.3.4
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.
- package/build/index.es.js +9 -4
- package/build/index.es.js.map +1 -1
- package/package.json +1 -1
package/build/index.es.js
CHANGED
|
@@ -976,6 +976,10 @@ const StyledSearchInput = styled.input `
|
|
|
976
976
|
|
|
977
977
|
function AssetSelectContent({ assets = [], balances, onChange, onClose, showChainInfo, isBalancesLoading, }) {
|
|
978
978
|
const inputRef = useRef(null);
|
|
979
|
+
const { data: chains } = useChains();
|
|
980
|
+
const getChain = (chainID) => {
|
|
981
|
+
return chains === null || chains === void 0 ? void 0 : chains.find((chain) => chain.chainID === chainID);
|
|
982
|
+
};
|
|
979
983
|
useEffect(() => {
|
|
980
984
|
setTimeout(() => {
|
|
981
985
|
var _a;
|
|
@@ -1019,8 +1023,9 @@ function AssetSelectContent({ assets = [], balances, onChange, onClose, showChai
|
|
|
1019
1023
|
}, [searchValue, sortedAssets]);
|
|
1020
1024
|
return (jsxs("div", { className: "isolate flex h-full flex-col p-6 pb-2 font-diatype", children: [jsxs("div", { className: "mb-4 flex items-center gap-4", children: [jsx(StyledThemedButton, { className: "flex h-8 w-8 items-center justify-center rounded-full transition-colors", onClick: onClose, children: jsx(ArrowLeftIcon, { className: "h-6 w-6" }) }), jsx("p", { className: "text-xl font-bold", children: "Select Token" }), isBalancesLoading && (jsx(SpinnerIcon, { className: "h-4 w-4 animate-spin text-neutral-400" }))] }), jsx(StyledSearchInput, { className: "z-20 w-full rounded-md border px-4 py-2", type: "text", placeholder: "Search name or paste address", onChange: (e) => setSearchValue(e.target.value), value: searchValue, ref: inputRef }), jsxs(StyledScrollAreaRoot, { className: cn('relative isolate flex-grow overflow-hidden', 'before:absolute before:inset-x-0 before:top-0 before:z-10 before:h-2', 'after:absolute after:inset-x-0 after:bottom-0 after:z-10 after:h-2'), children: [jsx(ScrollArea.Viewport, { className: "h-full w-full py-4", children: filteredAssets.map((asset) => {
|
|
1021
1025
|
var _a;
|
|
1026
|
+
const chain = getChain(asset.chainID);
|
|
1022
1027
|
return (jsxs(StyledThemedButton, { "data-testid": "asset-item", className: "flex w-full items-center gap-4 rounded-xl p-4 text-left transition-colors focus:-outline-offset-2", onClick: () => (onClose(), onChange === null || onChange === void 0 ? void 0 : onChange(asset)), children: [jsx("img", { height: 48, width: 48, alt: asset.recommendedSymbol || 'symbol', className: "h-12 w-12 rounded-full object-contain", src: asset.logoURI || 'https://api.dicebear.com/6.x/shapes/svg', onError: (e) => (e.currentTarget.src =
|
|
1023
|
-
'https://api.dicebear.com/6.x/shapes/svg') }), jsxs("div", { className: "flex-1", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx("p", { className: "text-lg font-semibold", children: asset.recommendedSymbol || asset.symbol }), asset.isCW20 && (jsx("p", { className: "rounded bg-yellow-600 px-1.5 text-xs font-semibold text-white", children: "CW20" }))] }), showChainInfo && (jsx("p", { className: "text-sm text-neutral-400", children:
|
|
1028
|
+
'https://api.dicebear.com/6.x/shapes/svg') }), jsxs("div", { className: "flex-1", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx("p", { className: "text-lg font-semibold", children: asset.recommendedSymbol || asset.symbol }), asset.isCW20 && (jsx("p", { className: "rounded bg-yellow-600 px-1.5 text-xs font-semibold text-white", children: "CW20" }))] }), showChainInfo && (jsx("p", { className: "text-sm text-neutral-400", children: chain === null || chain === void 0 ? void 0 : chain.prettyName }))] }), jsx("div", { children: balances[asset.denom] && (jsx("p", { className: "text-sm font-medium text-neutral-400", children: parseFloat(formatUnits(BigInt(balances[asset.denom]), (_a = asset.decimals) !== null && _a !== void 0 ? _a : 6)).toLocaleString('en-US', { maximumFractionDigits: 6 }) })) })] }, `${asset.chainID}-${asset.denom}`));
|
|
1024
1029
|
}) }), jsx(ScrollArea.Scrollbar, { className: "z-20 flex touch-none select-none py-4 transition-colors ease-out data-[orientation=horizontal]:h-2 data-[orientation=vertical]:w-2 data-[orientation=horizontal]:flex-col", orientation: "vertical", children: jsx(ScrollArea.Thumb, { className: "relative flex-1 rounded-[10px] bg-neutral-500/50 transition-colors before:absolute before:left-1/2 before:top-1/2 before:h-2 before:w-2 before:-translate-x-1/2 before:-translate-y-1/2 before:content-[''] hover:bg-neutral-500" }) }), jsx(ScrollArea.Corner, {})] })] }));
|
|
1025
1030
|
}
|
|
1026
1031
|
const StyledScrollAreaRoot = styled(ScrollArea.Root) `
|
|
@@ -2345,7 +2350,7 @@ function useSwapWidget(persistSwapWidgetState = true) {
|
|
|
2345
2350
|
return GasPrice.fromString(gas);
|
|
2346
2351
|
}
|
|
2347
2352
|
catch (error) {
|
|
2348
|
-
|
|
2353
|
+
console.error('Unable to parse gas price asset');
|
|
2349
2354
|
return undefined;
|
|
2350
2355
|
}
|
|
2351
2356
|
})();
|
|
@@ -2387,7 +2392,7 @@ function useSwapWidget(persistSwapWidgetState = true) {
|
|
|
2387
2392
|
}
|
|
2388
2393
|
})();
|
|
2389
2394
|
if (!_gasPrice) {
|
|
2390
|
-
|
|
2395
|
+
console.error(`Unable to parse gas price for ${srcFeeAsset.denom} on ${srcChain.chainName}`);
|
|
2391
2396
|
return;
|
|
2392
2397
|
}
|
|
2393
2398
|
srcGasPrice = _gasPrice;
|
|
@@ -2820,7 +2825,7 @@ function AssetInput({ amount, amountUSD, diffPercentage = 0, onAmountChange, onA
|
|
|
2820
2825
|
return parseFloat(selectedAssetBalance) <= 0;
|
|
2821
2826
|
}, [selectedAssetBalance]);
|
|
2822
2827
|
return (jsxs(StyledBorderDiv, { className: cn('rounded-lg border p-4 transition-[border,shadow]', 'focus-within:border-neutral-300 focus-within:shadow-sm', 'hover:border-neutral-300 hover:shadow-sm', !!isError &&
|
|
2823
|
-
'border-red-400 focus-within:border-red-500 hover:border-red-500'), children: [jsxs("div", { className: "mb-4 grid grid-cols-1 gap-2 sm:grid-cols-2 sm:gap-4", children: [jsx("div", { children: jsx(ChainSelect, { chain: chain, chains: chains, onChange: onChainChange }) }), jsx("div", { children: jsx(AssetSelect, { asset: asset, assets: assets, balances: balances, onChange: onAssetChange, showChainInfo:
|
|
2828
|
+
'border-red-400 focus-within:border-red-500 hover:border-red-500'), children: [jsxs("div", { className: "mb-4 grid grid-cols-1 gap-2 sm:grid-cols-2 sm:gap-4", children: [jsx("div", { children: jsx(ChainSelect, { chain: chain, chains: chains, onChange: onChainChange }) }), jsx("div", { children: jsx(AssetSelect, { asset: asset, assets: assets, balances: balances, onChange: onAssetChange, showChainInfo: true, isBalancesLoading: isBalancesLoading }) })] }), jsxs("div", { className: "relative isolate", children: [isLoading && (jsx(SpinnerIcon, { className: "absolute right-2 top-2 z-10 h-4 w-4 animate-spin text-neutral-300" })), amount && !isLoading && (jsx("button", { className: "absolute right-2 top-2 z-10", children: jsx(BackspaceIcon, { className: "h-4 w-4 text-neutral-300 transition-colors hover:text-neutral-400", onClick: () => onAmountChange === null || onAmountChange === void 0 ? void 0 : onAmountChange('') }) })), jsx(StyledThemedDiv, { as: "input", "data-testid": "amount", className: cn('h-10 w-full text-3xl font-medium tabular-nums', 'placeholder:text-neutral-300 focus:outline-none', isLoading && 'animate-pulse text-neutral-500'), type: "text", placeholder: "0", value: formatNumberWithCommas(amount), inputMode: "numeric", onChange: (e) => {
|
|
2824
2829
|
if (!onAmountChange)
|
|
2825
2830
|
return;
|
|
2826
2831
|
let latest = e.target.value;
|