diff --git a/packages/ui/.size-limit.js b/packages/ui/.size-limit.js
index 5b15f26e6..f87a3d3e2 100644
--- a/packages/ui/.size-limit.js
+++ b/packages/ui/.size-limit.js
@@ -2,11 +2,11 @@ const path = require("path");
module.exports = [
{
path: path.join(path.resolve("./"), "./dist/es/**/*.mjs"),
- limit: "700 KB",
+ limit: "750 KB",
},
{
path: path.join(path.resolve("./"), "./dist/cjs/**/*.cjs"),
- limit: "700 KB",
+ limit: "750 KB",
},
{
path:path.join(path.resolve("./"), "./dist/styles.css"),
diff --git a/packages/ui/src/components/erc20-token-picker/index.tsx b/packages/ui/src/components/erc20-token-picker/index.tsx
index 46d507f60..be2e67c66 100644
--- a/packages/ui/src/components/erc20-token-picker/index.tsx
+++ b/packages/ui/src/components/erc20-token-picker/index.tsx
@@ -96,6 +96,16 @@ export function ERC20TokenPicker({
[onSelectedTokenChange],
);
+ const handleSelectedListChange = useCallback(
+ (list: TokenListWithBalance) => {
+ if (onSelectedListChange) {
+ setCurrentView("search");
+ onSelectedListChange(list);
+ }
+ },
+ [onSelectedListChange],
+ );
+
const handleManageListsClick = useCallback(() => {
setCurrentView("manage-lists");
}, []);
@@ -131,7 +141,7 @@ export function ERC20TokenPicker({
= 0) {
- onSelectedListChange(lists[parsedIndex]);
- if (!!onDismiss) onDismiss();
- }
+ if (parsedIndex >= 0) onSelectedListChange(lists[parsedIndex]);
}
},
- [lists, onDismiss, onSelectedListChange],
+ [lists, onSelectedListChange],
);
return (
diff --git a/packages/ui/src/components/markdown-input/index.tsx b/packages/ui/src/components/markdown-input/index.tsx
index 2204fed25..6395c471f 100644
--- a/packages/ui/src/components/markdown-input/index.tsx
+++ b/packages/ui/src/components/markdown-input/index.tsx
@@ -37,7 +37,7 @@ export const markdownInputContentStyles = mergedCva(
"cui-overflow-y-auto",
"cui-overflow-x-hidden",
"cui-p-3",
- "cui-text-sm",
+ "cui-text-lg",
"cui-font-normal",
"cui-cursor-text",
"focus:cui-outline-none",
@@ -84,12 +84,12 @@ export const MarkdownInput = ({
Placeholder.configure({
placeholder,
emptyEditorClass:
- "before:cui-content-[attr(data-placeholder)] before:cui-absolute before:cui-opacity-30 dark:before:cui-opacity-20 cui-text-sm cui-font-normal",
+ "before:cui-content-[attr(data-placeholder)] before:cui-absolute before:cui-opacity-30 dark:before:cui-opacity-20 cui-text-base cui-font-normal",
}),
],
editorProps: {
attributes: {
- class: "cui-prose cui-prose-sm focus:cui-outline-none cui-font-mono cui-h-full dark:cui-prose-invert prose-pre:dark:cui-bg-gray-700",
+ class: "cui-prose cui-prose-base focus:cui-outline-none cui-font-mono cui-h-full dark:cui-prose-invert prose-pre:dark:cui-bg-gray-700",
},
},
onUpdate: ({ editor }) => {
diff --git a/packages/ui/stories/erc20-token-picker.stories.tsx b/packages/ui/stories/erc20-token-picker.stories.tsx
index 325f1fdc4..74f64c855 100644
--- a/packages/ui/stories/erc20-token-picker.stories.tsx
+++ b/packages/ui/stories/erc20-token-picker.stories.tsx
@@ -67,10 +67,9 @@ const Component = (props: ERC20TokenPickerProps) => {
const [open, setOpen] = useState(false);
const [value, setValue] = useState(null);
+ const [lists, setLists] = useState([]);
const [list, setList] = useState(null);
- const lists = useMemo(() => (list ? [list] : []), [list]);
-
const {
data: rawBalances,
isLoading: loadingBalances,
@@ -113,15 +112,29 @@ const Component = (props: ERC20TokenPickerProps) => {
useEffect(() => {
let cancelled = false;
const fetchData = async () => {
- const response = await fetch(
+ let response = await fetch(
`${getServiceURL(Service.STATIC_CDN, false)}/token-list.json`,
);
if (!response.ok) {
console.warn("could not fetch carrot token list");
return;
}
- if (!cancelled)
- setList((await response.json()) as TokenListWithBalance);
+ const carrotList = (await response.json()) as TokenListWithBalance;
+
+ response = await fetch(
+ "https://tokens.coingecko.com/uniswap/all.json",
+ );
+ if (!response.ok) {
+ console.warn("could not fetch coingecko token list");
+ return;
+ }
+ const coingeckoList =
+ (await response.json()) as TokenListWithBalance;
+
+ if (!cancelled) {
+ setLists([carrotList, coingeckoList]);
+ setList(carrotList);
+ }
};
void fetchData();
return () => {
@@ -176,6 +189,7 @@ const Component = (props: ERC20TokenPickerProps) => {
onDismiss={handleDismiss}
lists={lists}
selectedList={selectedListWithBalances}
+ onSelectedListChange={setList}
chainId={CHAIN_ID}
messages={{
search: {