@ledgerhq/react-ui 0.25.0 → 0.26.0-next.0

package/lib/cjs/pre-ldls/components/NetworkItem/NetworkItem.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/pre-ldls/components/NetworkItem/NetworkItem.tsx"],
-  "sourcesContent": ["import React from \"react\";\nimport styled from \"styled-components\";\nimport { withTokens } from \"../../libs\";\nimport { Text } from \"../../../components\";\n\ntype NetworkItemProps = {\n  name: string;\n  onClick: () => void;\n};\n\nconst TempAssetBadge = () => (\n  // TODO: To be replaced with LIVE-18221\n  <div style={{ display: \"flex\", alignItems: \"center\" }}>\n    <span\n      style={{\n        height: 48,\n        width: 48,\n        borderRadius: 48,\n        backgroundColor: \"grey\",\n        display: \"inline-block\",\n      }}\n    />\n  </div>\n);\n\nconst Wrapper = styled.div`\n  ${withTokens(\n    \"spacing-xxs\",\n    \"margin-s\",\n    \"colors-content-default-default\",\n    \"colors-surface-transparent-hover\",\n    \"colors-surface-transparent-pressed\",\n  )}\n  display: flex;\n  padding: var(--spacing-xxs);\n  cursor: pointer;\n\n  :hover {\n    background-color: var(--colors-surface-transparent-hover);\n  }\n\n  :active {\n    background-color: var(--colors-surface-transparent-pressed);\n  }\n`;\n\nconst InfoWrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  margin-left: var(--margin-s);\n`;\n\nexport const NetworkItem = ({ name, onClick }: NetworkItemProps) => {\n  return (\n    <Wrapper onClick={onClick}>\n      <TempAssetBadge />\n      <InfoWrapper>\n        <Text\n          variant=\"largeLineHeight\"\n          fontWeight=\"semiBold\"\n          color=\"var(--colors-content-default-default)\"\n        >\n          {name}\n        </Text>\n      </InfoWrapper>\n    </Wrapper>\n  );\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,+BAAmB;AACnB,kBAA2B;AAC3B,wBAAqB;AAOrB,MAAM,iBAAiB;AAAA;AAAA,EAErB,6BAAAA,QAAA,cAAC,SAAI,OAAO,EAAE,SAAS,QAAQ,YAAY,SAAS,KAClD,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,cAAc;AAAA,QACd,iBAAiB;AAAA,QACjB,SAAS;AAAA,MACX;AAAA;AAAA,EACF,CACF;AAAA;AAGF,MAAM,UAAU,yBAAAC,QAAO;AAAA,QACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcH,MAAM,cAAc,yBAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOpB,MAAM,cAAc,CAAC,EAAE,MAAM,QAAQ,MAAwB;AAClE,SACE,6BAAAD,QAAA,cAAC,WAAQ,WACP,6BAAAA,QAAA,cAAC,oBAAe,GAChB,6BAAAA,QAAA,cAAC,mBACC,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,YAAW;AAAA,MACX,OAAM;AAAA;AAAA,IAEL;AAAA,EACH,CACF,CACF;AAEJ;",
-  "names": ["React", "styled"]
+  "sourcesContent": ["import React from \"react\";\nimport styled from \"styled-components\";\nimport { withTokens } from \"../../libs\";\nimport { Text } from \"../../../components\";\nimport { CryptoIcon } from \"../CryptoIcon/CryptoIcon\";\n\nexport type Network = { name: string; id: string; ticker: string };\n\ntype NetworkItemProps = Network & {\n  onClick: () => void;\n};\n\nconst Wrapper = styled.div`\n  ${withTokens(\n    \"spacing-xxs\",\n    \"margin-s\",\n    \"radius-s\",\n    \"colors-content-default-default\",\n    \"colors-surface-transparent-hover\",\n    \"colors-surface-transparent-pressed\",\n  )}\n  display: flex;\n  padding: var(--spacing-xxs);\n  cursor: pointer;\n  border-radius: var(--radius-s, 8px);\n  align-items: center;\n\n  :hover {\n    background-color: var(--colors-surface-transparent-hover);\n  }\n\n  :active {\n    background-color: var(--colors-surface-transparent-pressed);\n  }\n`;\n\nconst InfoWrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  margin-left: var(--margin-s);\n`;\n\nexport const NetworkItem = ({ name, onClick, id, ticker }: NetworkItemProps) => {\n  return (\n    <Wrapper onClick={onClick}>\n      <CryptoIcon size=\"48px\" ledgerId={id} ticker={ticker} />\n      <InfoWrapper>\n        <Text\n          variant=\"largeLineHeight\"\n          fontWeight=\"semiBold\"\n          color=\"var(--colors-content-default-default)\"\n        >\n          {name}\n        </Text>\n      </InfoWrapper>\n    </Wrapper>\n  );\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,+BAAmB;AACnB,kBAA2B;AAC3B,wBAAqB;AACrB,wBAA2B;AAQ3B,MAAM,UAAU,yBAAAA,QAAO;AAAA,QACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBH,MAAM,cAAc,yBAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOpB,MAAM,cAAc,CAAC,EAAE,MAAM,SAAS,IAAI,OAAO,MAAwB;AAC9E,SACE,6BAAAC,QAAA,cAAC,WAAQ,WACP,6BAAAA,QAAA,cAAC,gCAAW,MAAK,QAAO,UAAU,IAAI,QAAgB,GACtD,6BAAAA,QAAA,cAAC,mBACC,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,YAAW;AAAA,MACX,OAAM;AAAA;AAAA,IAEL;AAAA,EACH,CACF,CACF;AAEJ;",
+  "names": ["styled", "React"]
 }

package/lib/cjs/pre-ldls/components/NetworkItem/NetworkItem.stories.js

@@ -29,7 +29,7 @@ const meta = {
   component: import_NetworkItem.NetworkItem,
   title: "PreLdls/Components/NetworkItem",
   tags: ["autodocs"],
-  args: { name: "Bitcoin" }
+  args: { name: "Bitcoin", id: "bitcoin", ticker: "btc" }
 };
 var NetworkItem_stories_default = meta;
 const Default = {};

package/lib/cjs/pre-ldls/components/NetworkItem/NetworkItem.stories.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/pre-ldls/components/NetworkItem/NetworkItem.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { NetworkItem } from \"./NetworkItem\";\nimport { expect, within } from \"@storybook/test\";\n\nconst meta: Meta<typeof NetworkItem> = {\n  component: NetworkItem,\n  title: \"PreLdls/Components/NetworkItem\",\n  tags: [\"autodocs\"],\n  args: { name: \"Bitcoin\" },\n};\nexport default meta;\n\ntype Story = StoryObj<typeof NetworkItem>;\n\nexport const Default: Story = {};\n\nexport const TestNetworkItem: Story = {\n  play: async ({ canvasElement }) => {\n    const canvas = within(canvasElement);\n\n    const name = canvas.getByText(\"Bitcoin\");\n\n    await expect(name).toBeInTheDocument();\n  },\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,yBAA4B;AAC5B,kBAA+B;AAE/B,MAAM,OAAiC;AAAA,EACrC,WAAW;AAAA,EACX,OAAO;AAAA,EACP,MAAM,CAAC,UAAU;AAAA,EACjB,MAAM,EAAE,MAAM,UAAU;AAC1B;AACA,IAAO,8BAAQ;AAIR,MAAM,UAAiB,CAAC;AAExB,MAAM,kBAAyB;AAAA,EACpC,MAAM,OAAO,EAAE,cAAc,MAAM;AACjC,UAAM,aAAS,oBAAO,aAAa;AAEnC,UAAM,OAAO,OAAO,UAAU,SAAS;AAEvC,cAAM,oBAAO,IAAI,EAAE,kBAAkB;AAAA,EACvC;AACF;",
+  "sourcesContent": ["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { NetworkItem } from \"./NetworkItem\";\nimport { expect, within } from \"@storybook/test\";\n\nconst meta: Meta<typeof NetworkItem> = {\n  component: NetworkItem,\n  title: \"PreLdls/Components/NetworkItem\",\n  tags: [\"autodocs\"],\n  args: { name: \"Bitcoin\", id: \"bitcoin\", ticker: \"btc\" },\n};\nexport default meta;\n\ntype Story = StoryObj<typeof NetworkItem>;\n\nexport const Default: Story = {};\n\nexport const TestNetworkItem: Story = {\n  play: async ({ canvasElement }) => {\n    const canvas = within(canvasElement);\n\n    const name = canvas.getByText(\"Bitcoin\");\n\n    await expect(name).toBeInTheDocument();\n  },\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,yBAA4B;AAC5B,kBAA+B;AAE/B,MAAM,OAAiC;AAAA,EACrC,WAAW;AAAA,EACX,OAAO;AAAA,EACP,MAAM,CAAC,UAAU;AAAA,EACjB,MAAM,EAAE,MAAM,WAAW,IAAI,WAAW,QAAQ,MAAM;AACxD;AACA,IAAO,8BAAQ;AAIR,MAAM,UAAiB,CAAC;AAExB,MAAM,kBAAyB;AAAA,EACpC,MAAM,OAAO,EAAE,cAAc,MAAM;AACjC,UAAM,aAAS,oBAAO,aAAa;AAEnC,UAAM,OAAO,OAAO,UAAU,SAAS;AAEvC,cAAM,oBAAO,IAAI,EAAE,kBAAkB;AAAA,EACvC;AACF;",
   "names": []
 }

package/lib/cjs/pre-ldls/components/NetworkList/NetworkList.js

@@ -39,7 +39,7 @@ const NetworkList = ({
   onClick
 }) => {
   const renderNetworkItem = (0, import_react.useCallback)(
-    ({ name, id }) => /* @__PURE__ */ import_react.default.createElement(import_NetworkItem.NetworkItem, { name, onClick: () => onClick(id) }),
+    (network) => /* @__PURE__ */ import_react.default.createElement(import_NetworkItem.NetworkItem, { ...network, onClick: () => onClick(network.id) }),
     [onClick]
   );
   return /* @__PURE__ */ import_react.default.createElement(import_VirtualList.VirtualList, { items: networks, itemHeight: 64, renderItem: renderNetworkItem });

package/lib/cjs/pre-ldls/components/NetworkList/NetworkList.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/pre-ldls/components/NetworkList/NetworkList.tsx"],
-  "sourcesContent": ["import React, { useCallback } from \"react\";\nimport { NetworkItem } from \"../NetworkItem/NetworkItem\";\nimport { VirtualList } from \"../VirtualList/VirtualList\";\n\ntype Network = { name: string; id: string };\n\nexport const NetworkList = ({\n  networks,\n  onClick,\n}: {\n  networks: Network[];\n  onClick: (networkId: string) => void;\n}) => {\n  const renderNetworkItem = useCallback(\n    ({ name, id }: Network) => <NetworkItem name={name} onClick={() => onClick(id)} />,\n    [onClick],\n  );\n\n  return <VirtualList items={networks} itemHeight={64} renderItem={renderNetworkItem} />;\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAmC;AACnC,yBAA4B;AAC5B,yBAA4B;AAIrB,MAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AACF,MAGM;AACJ,QAAM,wBAAoB;AAAA,IACxB,CAAC,EAAE,MAAM,GAAG,MAAe,6BAAAA,QAAA,cAAC,kCAAY,MAAY,SAAS,MAAM,QAAQ,EAAE,GAAG;AAAA,IAChF,CAAC,OAAO;AAAA,EACV;AAEA,SAAO,6BAAAA,QAAA,cAAC,kCAAY,OAAO,UAAU,YAAY,IAAI,YAAY,mBAAmB;AACtF;",
+  "sourcesContent": ["import React, { useCallback } from \"react\";\nimport { Network, NetworkItem } from \"../NetworkItem/NetworkItem\";\nimport { VirtualList } from \"../VirtualList/VirtualList\";\n\nexport const NetworkList = ({\n  networks,\n  onClick,\n}: {\n  networks: Network[];\n  onClick: (networkId: string) => void;\n}) => {\n  const renderNetworkItem = useCallback(\n    (network: Network) => <NetworkItem {...network} onClick={() => onClick(network.id)} />,\n    [onClick],\n  );\n\n  return <VirtualList items={networks} itemHeight={64} renderItem={renderNetworkItem} />;\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAmC;AACnC,yBAAqC;AACrC,yBAA4B;AAErB,MAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AACF,MAGM;AACJ,QAAM,wBAAoB;AAAA,IACxB,CAAC,YAAqB,6BAAAA,QAAA,cAAC,kCAAa,GAAG,SAAS,SAAS,MAAM,QAAQ,QAAQ,EAAE,GAAG;AAAA,IACpF,CAAC,OAAO;AAAA,EACV;AAEA,SAAO,6BAAAA,QAAA,cAAC,kCAAY,OAAO,UAAU,YAAY,IAAI,YAAY,mBAAmB;AACtF;",
   "names": ["React"]
 }

package/lib/cjs/pre-ldls/components/NetworkList/NetworkList.stories.js

@@ -45,7 +45,11 @@ const meta = {
   title: "PreLdls/Components/NetworkList",
   tags: ["autodocs"],
   args: {
-    networks: Array.from({ length: 50 }, (_, i) => ({ name: `Bitcoin ${i}`, id: `btc${i}` })),
+    networks: Array.from({ length: 50 }, (_, i) => ({
+      name: `Bitcoin ${i}`,
+      id: `bitcoin`,
+      ticker: "btc"
+    })),
     onClick: testFn
   }
 };
@@ -56,7 +60,7 @@ const TestNetworkClick = {
     const canvas = (0, import_test.within)(canvasElement);
     const input = canvas.getByText("Bitcoin 1");
     await import_test.userEvent.click(input);
-    await (0, import_test.expect)(testFn).toHaveBeenCalledWith("btc1");
+    await (0, import_test.expect)(testFn).toHaveBeenCalledWith("bitcoin");
   }
 };
 //# sourceMappingURL=NetworkList.stories.js.map

package/lib/cjs/pre-ldls/components/NetworkList/NetworkList.stories.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/pre-ldls/components/NetworkList/NetworkList.stories.tsx"],
-  "sourcesContent": ["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { NetworkList } from \"./NetworkList\";\nimport { expect, fn, userEvent, within } from \"@storybook/test\";\n\nconst testFn = fn();\n\nconst meta: Meta<typeof NetworkList> = {\n  component: NetworkList,\n  decorators: [\n    Story => (\n      <div style={{ height: \"400px\" }}>\n        <Story />\n      </div>\n    ),\n  ],\n  title: \"PreLdls/Components/NetworkList\",\n  tags: [\"autodocs\"],\n  args: {\n    networks: Array.from({ length: 50 }, (_, i) => ({ name: `Bitcoin ${i}`, id: `btc${i}` })),\n    onClick: testFn,\n  },\n};\nexport default meta;\n\ntype Story = StoryObj<typeof NetworkList>;\n\nexport const Default: Story = {};\n\nexport const TestNetworkClick: Story = {\n  play: async ({ canvasElement }) => {\n    const canvas = within(canvasElement);\n    const input = canvas.getByText(\"Bitcoin 1\");\n    await userEvent.click(input);\n    await expect(testFn).toHaveBeenCalledWith(\"btc1\");\n  },\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAElB,yBAA4B;AAC5B,kBAA8C;AAE9C,MAAM,aAAS,gBAAG;AAElB,MAAM,OAAiC;AAAA,EACrC,WAAW;AAAA,EACX,YAAY;AAAA,IACV,WACE,6BAAAA,QAAA,cAAC,SAAI,OAAO,EAAE,QAAQ,QAAQ,KAC5B,6BAAAA,QAAA,cAAC,WAAM,CACT;AAAA,EAEJ;AAAA,EACA,OAAO;AAAA,EACP,MAAM,CAAC,UAAU;AAAA,EACjB,MAAM;AAAA,IACJ,UAAU,MAAM,KAAK,EAAE,QAAQ,GAAG,GAAG,CAAC,GAAG,OAAO,EAAE,MAAM,WAAW,CAAC,IAAI,IAAI,MAAM,CAAC,GAAG,EAAE;AAAA,IACxF,SAAS;AAAA,EACX;AACF;AACA,IAAO,8BAAQ;AAIR,MAAM,UAAiB,CAAC;AAExB,MAAM,mBAA0B;AAAA,EACrC,MAAM,OAAO,EAAE,cAAc,MAAM;AACjC,UAAM,aAAS,oBAAO,aAAa;AACnC,UAAM,QAAQ,OAAO,UAAU,WAAW;AAC1C,UAAM,sBAAU,MAAM,KAAK;AAC3B,cAAM,oBAAO,MAAM,EAAE,qBAAqB,MAAM;AAAA,EAClD;AACF;",
+  "sourcesContent": ["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { NetworkList } from \"./NetworkList\";\nimport { expect, fn, userEvent, within } from \"@storybook/test\";\n\nconst testFn = fn();\n\nconst meta: Meta<typeof NetworkList> = {\n  component: NetworkList,\n  decorators: [\n    Story => (\n      <div style={{ height: \"400px\" }}>\n        <Story />\n      </div>\n    ),\n  ],\n  title: \"PreLdls/Components/NetworkList\",\n  tags: [\"autodocs\"],\n  args: {\n    networks: Array.from({ length: 50 }, (_, i) => ({\n      name: `Bitcoin ${i}`,\n      id: `bitcoin`,\n      ticker: \"btc\",\n    })),\n    onClick: testFn,\n  },\n};\nexport default meta;\n\ntype Story = StoryObj<typeof NetworkList>;\n\nexport const Default: Story = {};\n\nexport const TestNetworkClick: Story = {\n  play: async ({ canvasElement }) => {\n    const canvas = within(canvasElement);\n    const input = canvas.getByText(\"Bitcoin 1\");\n    await userEvent.click(input);\n    await expect(testFn).toHaveBeenCalledWith(\"bitcoin\");\n  },\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAElB,yBAA4B;AAC5B,kBAA8C;AAE9C,MAAM,aAAS,gBAAG;AAElB,MAAM,OAAiC;AAAA,EACrC,WAAW;AAAA,EACX,YAAY;AAAA,IACV,WACE,6BAAAA,QAAA,cAAC,SAAI,OAAO,EAAE,QAAQ,QAAQ,KAC5B,6BAAAA,QAAA,cAAC,WAAM,CACT;AAAA,EAEJ;AAAA,EACA,OAAO;AAAA,EACP,MAAM,CAAC,UAAU;AAAA,EACjB,MAAM;AAAA,IACJ,UAAU,MAAM,KAAK,EAAE,QAAQ,GAAG,GAAG,CAAC,GAAG,OAAO;AAAA,MAC9C,MAAM,WAAW,CAAC;AAAA,MAClB,IAAI;AAAA,MACJ,QAAQ;AAAA,IACV,EAAE;AAAA,IACF,SAAS;AAAA,EACX;AACF;AACA,IAAO,8BAAQ;AAIR,MAAM,UAAiB,CAAC;AAExB,MAAM,mBAA0B;AAAA,EACrC,MAAM,OAAO,EAAE,cAAc,MAAM;AACjC,UAAM,aAAS,oBAAO,aAAa;AACnC,UAAM,QAAQ,OAAO,UAAU,WAAW;AAC1C,UAAM,sBAAU,MAAM,KAAK;AAC3B,cAAM,oBAAO,MAAM,EAAE,qBAAqB,SAAS;AAAA,EACrD;AACF;",
   "names": ["React"]
 }

package/lib/cjs/pre-ldls/components/index.js

@@ -20,6 +20,7 @@ __reExport(components_exports, require("./AccountList/AccountList"), module.expo
 __reExport(components_exports, require("./Address/Address"), module.exports);
 __reExport(components_exports, require("./AssetItem/AssetItem"), module.exports);
 __reExport(components_exports, require("./AssetList/AssetList"), module.exports);
+__reExport(components_exports, require("./CardButton/CardButton"), module.exports);
 __reExport(components_exports, require("./Input/Input"), module.exports);
 __reExport(components_exports, require("./NetworkItem/NetworkItem"), module.exports);
 __reExport(components_exports, require("./NetworkList/NetworkList"), module.exports);

package/lib/cjs/pre-ldls/components/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/pre-ldls/components/index.ts"],
-  "sourcesContent": ["export * from \"./AccountItem/AccountItem\";\nexport * from \"./AccountList/AccountList\";\nexport * from \"./Address/Address\";\nexport * from \"./AssetItem/AssetItem\";\nexport * from \"./AssetList/AssetList\";\nexport * from \"./Input/Input\";\nexport * from \"./NetworkItem/NetworkItem\";\nexport * from \"./NetworkList/NetworkList\";\nexport * from \"./Search/Search\";\nexport * from \"./Tag/Tag\";\nexport * from \"./VirtualList/VirtualList\";\n"],
-  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,+BAAc,sCAAd;AACA,+BAAc,sCADd;AAEA,+BAAc,8BAFd;AAGA,+BAAc,kCAHd;AAIA,+BAAc,kCAJd;AAKA,+BAAc,0BALd;AAMA,+BAAc,sCANd;AAOA,+BAAc,sCAPd;AAQA,+BAAc,4BARd;AASA,+BAAc,sBATd;AAUA,+BAAc,sCAVd;",
+  "sourcesContent": ["export * from \"./AccountItem/AccountItem\";\nexport * from \"./AccountList/AccountList\";\nexport * from \"./Address/Address\";\nexport * from \"./AssetItem/AssetItem\";\nexport * from \"./AssetList/AssetList\";\nexport * from \"./CardButton/CardButton\";\nexport * from \"./Input/Input\";\nexport * from \"./NetworkItem/NetworkItem\";\nexport * from \"./NetworkList/NetworkList\";\nexport * from \"./Search/Search\";\nexport * from \"./Tag/Tag\";\nexport * from \"./VirtualList/VirtualList\";\n"],
+  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,+BAAc,sCAAd;AACA,+BAAc,sCADd;AAEA,+BAAc,8BAFd;AAGA,+BAAc,kCAHd;AAIA,+BAAc,kCAJd;AAKA,+BAAc,oCALd;AAMA,+BAAc,0BANd;AAOA,+BAAc,sCAPd;AAQA,+BAAc,sCARd;AASA,+BAAc,4BATd;AAUA,+BAAc,sBAVd;AAWA,+BAAc,sCAXd;",
   "names": []
 }

package/lib/cjs/pre-ldls/libs/index.js

@@ -39,6 +39,10 @@ const overrideOther = {
   // missing from tokens
   "radius-xs": "4px",
   // missing from tokens
+  "border-width-default": "1px",
+  // missing from tokens
+  "border-width-focus": "2px",
+  // missing from tokens
   "margin-xs": "8px",
   // redefines marging-xs
   "margin-s": "16px",
@@ -55,9 +59,18 @@ const overrideOther = {
 const overrideColor = {
   light: {
     "surface-transparent-hover": "#0000000D",
-    "surface-transparent-pressed": "#0000001A"
+    // override from colours
+    "surface-transparent-pressed": "#0000001A",
+    // override from colours
+    "border-subdued-default-hover": "#D5D5D5",
+    // override from colours
+    "border-subdued-default-pressed": "#C1C1C1"
+    // missing from colours
   },
-  dark: {}
+  dark: {
+    "opacity-default-10": "#FFFFFF1A"
+    // missing from colours
+  }
 };
 const withTokens = (...usedTokens) => {
   const filterTokens = (0, import_memoize.default)((theme) => {

package/lib/cjs/pre-ldls/libs/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/pre-ldls/libs/index.ts"],
-  "sourcesContent": ["import memoize from \"lodash/memoize\";\nimport { css, DefaultTheme } from \"styled-components\";\nimport { dark, light, ModeColors, spacing, SpacingScale } from \"./design-tokens\";\n\n// Add temporarily missing and override incorrect tokens here\nconst overrideOther = {\n  \"radius-s\": \"8px\", // missing from tokens\n  \"radius-xs\": \"4px\", // missing from tokens\n  \"margin-xs\": \"8px\", // redefines marging-xs\n  \"margin-s\": \"16px\", // redefines marging-s\n  \"margin-m\": \"24px\", // redefines marging-m\n  \"margin-l\": \"32px\", // redefines marging-l\n\n  \"spacing-xs\": \"12px\", // override from \"spacing-xxs\": \"12px\"\n  \"spacing-xxs\": \"8px\", // override from \"spacing-xs\": \"8px\"\n} as const;\n\n// override colours based on Figma differing from design-tokens.ts\nconst overrideColor = {\n  light: {\n    \"surface-transparent-hover\": \"#0000000D\",\n    \"surface-transparent-pressed\": \"#0000001A\",\n  },\n  dark: {},\n} as const;\n\ntype ColorToken = `colors-${keyof ModeColors}`;\ntype OtherToken = keyof (SpacingScale & typeof overrideOther);\n\nexport const withTokens = (...usedTokens: Array<ColorToken | OtherToken>) => {\n  const filterTokens = memoize((theme: DefaultTheme[\"theme\"]) => {\n    const colors = {\n      dark: { ...dark, ...overrideColor.dark },\n      light: { ...light, ...overrideColor.light },\n    }[theme];\n\n    const colorEntries = Object.entries(colors).flatMap(([key, value]) => {\n      const color = `colors-${key}` as ColorToken;\n      if (!usedTokens.includes(color)) return [];\n      return [[`--${color}`, value]];\n    });\n    const otherEntries = [spacing, overrideOther]\n      .flatMap(Object.entries)\n      .flatMap(([key, value]) => {\n        if (!usedTokens.includes(key as OtherToken)) return [];\n        return [[`--${key}`, value]];\n      });\n\n    return Object.fromEntries([...colorEntries, ...otherEntries]);\n  });\n\n  return css(({ theme }) => filterTokens(theme.colors.type as DefaultTheme[\"theme\"]));\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAAoB;AACpB,+BAAkC;AAClC,2BAA+D;AAG/D,MAAM,gBAAgB;AAAA,EACpB,YAAY;AAAA;AAAA,EACZ,aAAa;AAAA;AAAA,EACb,aAAa;AAAA;AAAA,EACb,YAAY;AAAA;AAAA,EACZ,YAAY;AAAA;AAAA,EACZ,YAAY;AAAA;AAAA,EAEZ,cAAc;AAAA;AAAA,EACd,eAAe;AAAA;AACjB;AAGA,MAAM,gBAAgB;AAAA,EACpB,OAAO;AAAA,IACL,6BAA6B;AAAA,IAC7B,+BAA+B;AAAA,EACjC;AAAA,EACA,MAAM,CAAC;AACT;AAKO,MAAM,aAAa,IAAI,eAA+C;AAC3E,QAAM,mBAAe,eAAAA,SAAQ,CAAC,UAAiC;AAC7D,UAAM,SAAS;AAAA,MACb,MAAM,EAAE,GAAG,2BAAM,GAAG,cAAc,KAAK;AAAA,MACvC,OAAO,EAAE,GAAG,4BAAO,GAAG,cAAc,MAAM;AAAA,IAC5C,EAAE,KAAK;AAEP,UAAM,eAAe,OAAO,QAAQ,MAAM,EAAE,QAAQ,CAAC,CAAC,KAAK,KAAK,MAAM;AACpE,YAAM,QAAQ,UAAU,GAAG;AAC3B,UAAI,CAAC,WAAW,SAAS,KAAK;AAAG,eAAO,CAAC;AACzC,aAAO,CAAC,CAAC,KAAK,KAAK,IAAI,KAAK,CAAC;AAAA,IAC/B,CAAC;AACD,UAAM,eAAe,CAAC,8BAAS,aAAa,EACzC,QAAQ,OAAO,OAAO,EACtB,QAAQ,CAAC,CAAC,KAAK,KAAK,MAAM;AACzB,UAAI,CAAC,WAAW,SAAS,GAAiB;AAAG,eAAO,CAAC;AACrD,aAAO,CAAC,CAAC,KAAK,GAAG,IAAI,KAAK,CAAC;AAAA,IAC7B,CAAC;AAEH,WAAO,OAAO,YAAY,CAAC,GAAG,cAAc,GAAG,YAAY,CAAC;AAAA,EAC9D,CAAC;AAED,aAAO,8BAAI,CAAC,EAAE,MAAM,MAAM,aAAa,MAAM,OAAO,IAA6B,CAAC;AACpF;",
+  "sourcesContent": ["import memoize from \"lodash/memoize\";\nimport { css, DefaultTheme } from \"styled-components\";\nimport { dark, light, ModeColors, spacing, SpacingScale } from \"./design-tokens\";\n\n// Add temporarily missing and override incorrect tokens here\nconst overrideOther = {\n  \"radius-s\": \"8px\", // missing from tokens\n  \"radius-xs\": \"4px\", // missing from tokens\n  \"border-width-default\": \"1px\", // missing from tokens\n  \"border-width-focus\": \"2px\", // missing from tokens\n  \"margin-xs\": \"8px\", // redefines marging-xs\n  \"margin-s\": \"16px\", // redefines marging-s\n  \"margin-m\": \"24px\", // redefines marging-m\n  \"margin-l\": \"32px\", // redefines marging-l\n\n  \"spacing-xs\": \"12px\", // override from \"spacing-xxs\": \"12px\"\n  \"spacing-xxs\": \"8px\", // override from \"spacing-xs\": \"8px\"\n} as const;\n\n// Add temporarily missing and override incorrect colours here\nconst overrideColor = {\n  light: {\n    \"surface-transparent-hover\": \"#0000000D\", // override from colours\n    \"surface-transparent-pressed\": \"#0000001A\", // override from colours\n    \"border-subdued-default-hover\": \"#D5D5D5\", // override from colours\n\n    \"border-subdued-default-pressed\": \"#C1C1C1\", // missing from colours\n  },\n  dark: {\n    \"opacity-default-10\": \"#FFFFFF1A\", // missing from colours\n  },\n} as const;\n\ntype ColorToken =\n  | `colors-${keyof ModeColors}`\n  | `colors-${keyof typeof overrideColor.light}`\n  | `colors-${keyof typeof overrideColor.dark}`;\ntype OtherToken = keyof (SpacingScale & typeof overrideOther);\n\nexport const withTokens = (...usedTokens: Array<ColorToken | OtherToken>) => {\n  const filterTokens = memoize((theme: DefaultTheme[\"theme\"]) => {\n    const colors = {\n      dark: { ...dark, ...overrideColor.dark },\n      light: { ...light, ...overrideColor.light },\n    }[theme];\n\n    const colorEntries = Object.entries(colors).flatMap(([key, value]) => {\n      const color = `colors-${key}` as ColorToken;\n      if (!usedTokens.includes(color)) return [];\n      return [[`--${color}`, value]];\n    });\n    const otherEntries = [spacing, overrideOther]\n      .flatMap(Object.entries)\n      .flatMap(([key, value]) => {\n        if (!usedTokens.includes(key as OtherToken)) return [];\n        return [[`--${key}`, value]];\n      });\n\n    return Object.fromEntries([...colorEntries, ...otherEntries]);\n  });\n\n  return css(({ theme }) => filterTokens(theme.colors.type as DefaultTheme[\"theme\"]));\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAAoB;AACpB,+BAAkC;AAClC,2BAA+D;AAG/D,MAAM,gBAAgB;AAAA,EACpB,YAAY;AAAA;AAAA,EACZ,aAAa;AAAA;AAAA,EACb,wBAAwB;AAAA;AAAA,EACxB,sBAAsB;AAAA;AAAA,EACtB,aAAa;AAAA;AAAA,EACb,YAAY;AAAA;AAAA,EACZ,YAAY;AAAA;AAAA,EACZ,YAAY;AAAA;AAAA,EAEZ,cAAc;AAAA;AAAA,EACd,eAAe;AAAA;AACjB;AAGA,MAAM,gBAAgB;AAAA,EACpB,OAAO;AAAA,IACL,6BAA6B;AAAA;AAAA,IAC7B,+BAA+B;AAAA;AAAA,IAC/B,gCAAgC;AAAA;AAAA,IAEhC,kCAAkC;AAAA;AAAA,EACpC;AAAA,EACA,MAAM;AAAA,IACJ,sBAAsB;AAAA;AAAA,EACxB;AACF;AAQO,MAAM,aAAa,IAAI,eAA+C;AAC3E,QAAM,mBAAe,eAAAA,SAAQ,CAAC,UAAiC;AAC7D,UAAM,SAAS;AAAA,MACb,MAAM,EAAE,GAAG,2BAAM,GAAG,cAAc,KAAK;AAAA,MACvC,OAAO,EAAE,GAAG,4BAAO,GAAG,cAAc,MAAM;AAAA,IAC5C,EAAE,KAAK;AAEP,UAAM,eAAe,OAAO,QAAQ,MAAM,EAAE,QAAQ,CAAC,CAAC,KAAK,KAAK,MAAM;AACpE,YAAM,QAAQ,UAAU,GAAG;AAC3B,UAAI,CAAC,WAAW,SAAS,KAAK;AAAG,eAAO,CAAC;AACzC,aAAO,CAAC,CAAC,KAAK,KAAK,IAAI,KAAK,CAAC;AAAA,IAC/B,CAAC;AACD,UAAM,eAAe,CAAC,8BAAS,aAAa,EACzC,QAAQ,OAAO,OAAO,EACtB,QAAQ,CAAC,CAAC,KAAK,KAAK,MAAM;AACzB,UAAI,CAAC,WAAW,SAAS,GAAiB;AAAG,eAAO,CAAC;AACrD,aAAO,CAAC,CAAC,KAAK,GAAG,IAAI,KAAK,CAAC;AAAA,IAC7B,CAAC;AAEH,WAAO,OAAO,YAAY,CAAC,GAAG,cAAc,GAAG,YAAY,CAAC;AAAA,EAC9D,CAAC;AAED,aAAO,8BAAI,CAAC,EAAE,MAAM,MAAM,aAAa,MAAM,OAAO,IAA6B,CAAC;AACpF;",
   "names": ["memoize"]
 }

package/lib/pre-ldls/components/Address/Address.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Address.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Address/Address.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAkC1B,eAAO,MAAM,OAAO;aAMT,MAAM;cACL,OAAO;;;uBAgBlB,CAAC"}
+{"version":3,"file":"Address.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Address/Address.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,eAAO,MAAM,OAAO;aAMT,MAAM;cACL,OAAO;;;uBAgBlB,CAAC"}

package/lib/pre-ldls/components/Address/Address.js

@@ -2,16 +2,7 @@ import React from "react";
 import { Text } from "../../../components";
 import styled from "styled-components";
 import { withTokens } from "../../libs";
-const TempAssetBadge = ({ ledgerId: _ledgerId, ticker: _ticker, }) => (
-// TODO: To be replaced with LIVE-18221
-React.createElement("div", { style: { display: "flex", alignItems: "center" }, "data-testid": "address-icon" },
-    React.createElement("span", { style: {
-            height: 20,
-            width: 20,
-            borderRadius: 20,
-            backgroundColor: "grey",
-            display: "inline-block",
-        } })));
+import { CryptoIcon } from "../CryptoIcon/CryptoIcon";
 const Wrapper = styled.div `
   ${withTokens("spacing-xxxs", "colors-content-subdued-default-default")}
 
@@ -22,6 +13,6 @@ const Wrapper = styled.div `
 export const Address = ({ address, showIcon, cryptoId, ticker, }) => {
     return (React.createElement(Wrapper, null,
         React.createElement(Text, { marginRight: "var(--spacing-xxxs)", fontSize: "12px", color: "var(--colors-content-subdued-default-default)" }, address),
-        showIcon && React.createElement(TempAssetBadge, { ledgerId: cryptoId, ticker: ticker })));
+        showIcon && React.createElement(CryptoIcon, { ledgerId: cryptoId, ticker: ticker })));
 };
 //# sourceMappingURL=Address.js.map

package/lib/pre-ldls/components/Address/Address.js.map

@@ -1 +1 @@
-{"version":3,"file":"Address.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Address/Address.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAExC,MAAM,cAAc,GAAG,CAAC,EACtB,QAAQ,EAAE,SAAS,EACnB,MAAM,EAAE,OAAO,GAIhB,EAAE,EAAE,CAAC;AACJ,uCAAuC;AACvC,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,iBAAc,cAAc;IAC/E,8BACE,KAAK,EAAE;YACL,MAAM,EAAE,EAAE;YACV,KAAK,EAAE,EAAE;YACT,YAAY,EAAE,EAAE;YAChB,eAAe,EAAE,MAAM;YACvB,OAAO,EAAE,cAAc;SACxB,GACD,CACE,CACP,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;IACtB,UAAU,CAAC,cAAc,EAAE,wCAAwC,CAAC;;;;;CAKvE,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,MAAM,GAMP,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,OAAO;QACN,oBAAC,IAAI,IACH,WAAW,EAAC,qBAAqB,EACjC,QAAQ,EAAC,MAAM,EACf,KAAK,EAAC,+CAA+C,IAEpD,OAAO,CACH;QACN,QAAQ,IAAI,oBAAC,cAAc,IAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,GAAI,CAC3D,CACX,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"Address.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Address/Address.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAEtD,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;IACtB,UAAU,CAAC,cAAc,EAAE,wCAAwC,CAAC;;;;;CAKvE,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,MAAM,GAMP,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,OAAO;QACN,oBAAC,IAAI,IACH,WAAW,EAAC,qBAAqB,EACjC,QAAQ,EAAC,MAAM,EACf,KAAK,EAAC,+CAA+C,IAEpD,OAAO,CACH;QACN,QAAQ,IAAI,oBAAC,UAAU,IAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,GAAI,CACvD,CACX,CAAC;AACJ,CAAC,CAAC"}

package/lib/pre-ldls/components/AssetItem/AssetItem.d.ts

@@ -2,10 +2,11 @@ import React from "react";
 export type AssetType = {
     name: string;
     ticker: string;
+    id: string;
 };
 type AssetItemProps = AssetType & {
     onClick: (asset: AssetType) => void;
 };
-export declare const AssetItem: ({ name, ticker, onClick }: AssetItemProps) => React.JSX.Element;
+export declare const AssetItem: ({ name, ticker, id, onClick }: AssetItemProps) => React.JSX.Element;
 export {};
 //# sourceMappingURL=AssetItem.d.ts.map

package/lib/pre-ldls/components/AssetItem/AssetItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AssetItem.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AssetItem/AssetItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,KAAK,cAAc,GAAG,SAAS,GAAG;IAChC,OAAO,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CACrC,CAAC;AA+CF,eAAO,MAAM,SAAS,8BAA+B,cAAc,sBAsBlE,CAAC"}
+{"version":3,"file":"AssetItem.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AssetItem/AssetItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAEF,KAAK,cAAc,GAAG,SAAS,GAAG;IAChC,OAAO,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CACrC,CAAC;AAmCF,eAAO,MAAM,SAAS,kCAAmC,cAAc,sBAsBtE,CAAC"}

package/lib/pre-ldls/components/AssetItem/AssetItem.js

@@ -2,22 +2,15 @@ import React from "react";
 import styled from "styled-components";
 import { withTokens } from "../../libs";
 import { Text } from "../../../components";
-const TempAssetBadge = () => (
-// TODO: To be replaced with LIVE-18221
-React.createElement("div", { style: { display: "flex", alignItems: "center" } },
-    React.createElement("span", { style: {
-            height: 48,
-            width: 48,
-            borderRadius: 48,
-            backgroundColor: "grey",
-            display: "inline-block",
-        } })));
+import { CryptoIcon } from "../CryptoIcon/CryptoIcon";
 const Wrapper = styled.div `
-  ${withTokens("spacing-xxs", "margin-s", "colors-content-subdued-default-default", "colors-content-default-default", "colors-surface-transparent-hover", "colors-surface-transparent-pressed")}
+  ${withTokens("spacing-xxs", "margin-s", "radius-s", "colors-content-subdued-default-default", "colors-content-default-default", "colors-surface-transparent-hover", "colors-surface-transparent-pressed")}
 
   display: flex;
   padding: var(--spacing-xxs);
   cursor: pointer;
+  border-radius: var(--radius-s, 8px);
+  align-items: center;
 
   :hover {
     background-color: var(--colors-surface-transparent-hover);
@@ -33,9 +26,9 @@ const InfoWrapper = styled.div `
   justify-content: center;
   margin-left: var(--margin-s);
 `;
-export const AssetItem = ({ name, ticker, onClick }) => {
-    return (React.createElement(Wrapper, { onClick: () => onClick({ name, ticker }) },
-        React.createElement(TempAssetBadge, null),
+export const AssetItem = ({ name, ticker, id, onClick }) => {
+    return (React.createElement(Wrapper, { onClick: () => onClick({ name, ticker, id }) },
+        React.createElement(CryptoIcon, { size: "48px", ledgerId: id, ticker: ticker }),
         React.createElement(InfoWrapper, null,
             React.createElement(Text, { variant: "largeLineHeight", fontWeight: "semiBold", color: "var(--colors-content-default-default)" }, name),
             React.createElement(Text, { variant: "bodyLineHeight", fontWeight: "semiBold", color: "var(--colors-content-subdued-default-default)" }, ticker))));

package/lib/pre-ldls/components/AssetItem/AssetItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssetItem.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AssetItem/AssetItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAW3C,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC;AAC3B,uCAAuC;AACvC,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE;IACnD,8BACE,KAAK,EAAE;YACL,MAAM,EAAE,EAAE;YACV,KAAK,EAAE,EAAE;YACT,YAAY,EAAE,EAAE;YAChB,eAAe,EAAE,MAAM;YACvB,OAAO,EAAE,cAAc;SACxB,GACD,CACE,CACP,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;IACtB,UAAU,CACV,aAAa,EACb,UAAU,EACV,wCAAwC,EACxC,gCAAgC,EAChC,kCAAkC,EAClC,oCAAoC,CACrC;;;;;;;;;;;;;CAaF,CAAC;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAK7B,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAkB,EAAE,EAAE;IACrE,OAAO,CACL,oBAAC,OAAO,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;QAC/C,oBAAC,cAAc,OAAG;QAClB,oBAAC,WAAW;YACV,oBAAC,IAAI,IACH,OAAO,EAAC,iBAAiB,EACzB,UAAU,EAAC,UAAU,EACrB,KAAK,EAAC,uCAAuC,IAE5C,IAAI,CACA;YACP,oBAAC,IAAI,IACH,OAAO,EAAC,gBAAgB,EACxB,UAAU,EAAC,UAAU,EACrB,KAAK,EAAC,+CAA+C,IAEpD,MAAM,CACF,CACK,CACN,CACX,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"AssetItem.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AssetItem/AssetItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAYtD,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;IACtB,UAAU,CACV,aAAa,EACb,UAAU,EACV,UAAU,EACV,wCAAwC,EACxC,gCAAgC,EAChC,kCAAkC,EAClC,oCAAoC,CACrC;;;;;;;;;;;;;;;CAeF,CAAC;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAK7B,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,OAAO,EAAkB,EAAE,EAAE;IACzE,OAAO,CACL,oBAAC,OAAO,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC;QACnD,oBAAC,UAAU,IAAC,IAAI,EAAC,MAAM,EAAC,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,GAAI;QACxD,oBAAC,WAAW;YACV,oBAAC,IAAI,IACH,OAAO,EAAC,iBAAiB,EACzB,UAAU,EAAC,UAAU,EACrB,KAAK,EAAC,uCAAuC,IAE5C,IAAI,CACA;YACP,oBAAC,IAAI,IACH,OAAO,EAAC,gBAAgB,EACxB,UAAU,EAAC,UAAU,EACrB,KAAK,EAAC,+CAA+C,IAEpD,MAAM,CACF,CACK,CACN,CACX,CAAC;AACJ,CAAC,CAAC"}

package/lib/pre-ldls/components/AssetList/AssetList.d.ts

@@ -1,7 +1,8 @@
 import React from "react";
 import { AssetType } from "../AssetItem/AssetItem";
-export declare const AssetList: ({ assets, onClick, }: {
+export declare const AssetList: ({ assets, onClick, onVisibleItemsScrollEnd, }: {
     assets: AssetType[];
     onClick: (asset: AssetType) => void;
+    onVisibleItemsScrollEnd?: (() => void) | undefined;
 }) => React.JSX.Element;
 //# sourceMappingURL=AssetList.d.ts.map

package/lib/pre-ldls/components/AssetList/AssetList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AssetList.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AssetList/AssetList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAa,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAG9D,eAAO,MAAM,SAAS;YAIZ,SAAS,EAAE;qBACF,SAAS,KAAK,IAAI;uBAQpC,CAAC"}
+{"version":3,"file":"AssetList.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AssetList/AssetList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAa,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAG9D,eAAO,MAAM,SAAS;YAKZ,SAAS,EAAE;qBACF,SAAS,KAAK,IAAI;qCACH,IAAI;uBAiBrC,CAAC"}

package/lib/pre-ldls/components/AssetList/AssetList.js

@@ -1,8 +1,8 @@
 import React, { useCallback } from "react";
 import { AssetItem } from "../AssetItem/AssetItem";
 import { VirtualList } from "../VirtualList/VirtualList";
-export const AssetList = ({ assets, onClick, }) => {
-    const renderAssetItem = useCallback(({ name, ticker }) => React.createElement(AssetItem, { name: name, ticker: ticker, onClick: onClick }), [onClick]);
-    return React.createElement(VirtualList, { itemHeight: 64, items: assets, renderItem: renderAssetItem });
+export const AssetList = ({ assets, onClick, onVisibleItemsScrollEnd, }) => {
+    const renderAssetItem = useCallback(({ name, ticker, id }) => (React.createElement(AssetItem, { name: name, ticker: ticker, id: id, onClick: onClick })), [onClick]);
+    return (React.createElement(VirtualList, { itemHeight: 64, items: assets, onVisibleItemsScrollEnd: onVisibleItemsScrollEnd, renderItem: renderAssetItem }));
 };
 //# sourceMappingURL=AssetList.js.map

package/lib/pre-ldls/components/AssetList/AssetList.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssetList.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AssetList/AssetList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAa,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAEzD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EACxB,MAAM,EACN,OAAO,GAIR,EAAE,EAAE;IACH,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAa,EAAE,EAAE,CAAC,oBAAC,SAAS,IAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,GAAI,EAC5F,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,OAAO,oBAAC,WAAW,IAAC,UAAU,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,eAAe,GAAI,CAAC;AACrF,CAAC,CAAC"}
+{"version":3,"file":"AssetList.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AssetList/AssetList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAa,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAEzD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EACxB,MAAM,EACN,OAAO,EACP,uBAAuB,GAKxB,EAAE,EAAE;IACH,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAa,EAAE,EAAE,CAAC,CACnC,oBAAC,SAAS,IAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,GAAI,CACpE,EACD,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,OAAO,CACL,oBAAC,WAAW,IACV,UAAU,EAAE,EAAE,EACd,KAAK,EAAE,MAAM,EACb,uBAAuB,EAAE,uBAAuB,EAChD,UAAU,EAAE,eAAe,GAC3B,CACH,CAAC;AACJ,CAAC,CAAC"}

package/lib/pre-ldls/components/CardButton/CardButton.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+export declare const CardButton: ({ onClick, title, iconRight, variant, }: {
+    onClick: () => void;
+    title: string;
+    iconRight?: JSX.Element | undefined;
+    variant?: "default" | "dashed" | undefined;
+}) => React.JSX.Element;
+//# sourceMappingURL=CardButton.d.ts.map

package/lib/pre-ldls/components/CardButton/CardButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardButton.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/CardButton/CardButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAqD1B,eAAO,MAAM,UAAU;aAMZ,MAAM,IAAI;WACZ,MAAM;;;uBASd,CAAC"}

package/lib/pre-ldls/components/CardButton/CardButton.js

@@ -0,0 +1,43 @@
+import React from "react";
+import { withTokens } from "../../libs";
+import styled from "styled-components";
+const Button = styled.button `
+  ${withTokens("colors-content-default-default", "colors-surface-transparent-hover", "colors-surface-transparent-pressed", "colors-border-light-default", "colors-opacity-default-10", "colors-border-subdued-default-hover", "colors-border-subdued-default-pressed", "colors-border-focus-default", "radius-s", "border-width-default", "border-width-focus", "spacing-xs")}
+
+  display: flex;
+  padding: var(--spacing-xs);
+  flex-grow: 1;
+  justify-content: space-between;
+  align-items: center;
+  cursor: pointer;
+
+  background-color: transparent;
+  color: var(--colors-content-default-default);
+  font-weight: 600;
+
+  border-width: var(--border-width-default);
+  border-radius: var(--radius-s);
+  border-color: ${({ theme: { theme } }) => theme === "light" ? "var(--colors-border-light-default);" : "var(--colors-opacity-default-10);"}
+
+  :hover {
+    background-color: var(--colors-surface-transparent-hover);
+    ${({ theme: { theme } }) => theme === "light" && "border-color: var(--colors-border-subdued-default-hover);"}
+  }
+
+  :active {
+    background-color: var(--colors-surface-transparent-pressed);
+    ${({ theme: { theme } }) => theme === "light" && "border-color: var(--colors-border-subdued-default-pressed);"}
+  }
+
+  :focus-visible {
+    border-color: var(--colors-border-focus-default);
+    border-width: var(--border-width-focus);
+  }
+`;
+export const CardButton = ({ onClick, title, iconRight, variant = "default", }) => {
+    return (React.createElement(Button, { onClick: onClick, style: { borderStyle: variant === "default" ? "solid" : "dashed" } },
+        title,
+        " ",
+        iconRight));
+};
+//# sourceMappingURL=CardButton.js.map

package/lib/pre-ldls/components/CardButton/CardButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardButton.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/CardButton/CardButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAA;IACxB,UAAU,CACV,gCAAgC,EAChC,kCAAkC,EAClC,oCAAoC,EACpC,6BAA6B,EAC7B,2BAA2B,EAC3B,qCAAqC,EACrC,uCAAuC,EACvC,6BAA6B,EAC7B,UAAU,EACV,sBAAsB,EACtB,oBAAoB,EACpB,YAAY,CACb;;;;;;;;;;;;;;;kBAee,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CACvC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,qCAAqC,CAAC,CAAC,CAAC,mCAAmC;;;;MAI7F,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CACzB,KAAK,KAAK,OAAO,IAAI,2DAA2D;;;;;MAKhF,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,KAAK,KAAK,OAAO,IAAI,6DAA6D;;;;;;;CAOjH,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,OAAO,EACP,KAAK,EACL,SAAS,EACT,OAAO,GAAG,SAAS,GAMpB,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,MAAM,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,EAAE;QACzF,KAAK;;QAAG,SAAS,CACX,CACV,CAAC;AACJ,CAAC,CAAC"}

package/lib/pre-ldls/components/CryptoIcon/CryptoIcon.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { CryptoIcon as Icon } from "@ledgerhq/crypto-icons";
+export declare function CryptoIcon(props: Parameters<typeof Icon>[0]): React.JSX.Element;
+//# sourceMappingURL=CryptoIcon.d.ts.map

package/lib/pre-ldls/components/CryptoIcon/CryptoIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CryptoIcon.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/CryptoIcon/CryptoIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,IAAI,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE5D,wBAAgB,UAAU,CAAC,KAAK,EAAE,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC,CAAC,qBAE3D"}

package/lib/pre-ldls/components/CryptoIcon/CryptoIcon.js

@@ -0,0 +1,6 @@
+import React from "react";
+import { CryptoIcon as Icon } from "@ledgerhq/crypto-icons";
+export function CryptoIcon(props) {
+    return React.createElement(Icon, { ...props });
+}
+//# sourceMappingURL=CryptoIcon.js.map

package/lib/pre-ldls/components/CryptoIcon/CryptoIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CryptoIcon.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/CryptoIcon/CryptoIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,IAAI,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE5D,MAAM,UAAU,UAAU,CAAC,KAAiC;IAC1D,OAAO,oBAAC,IAAI,OAAK,KAAK,GAAI,CAAC;AAC7B,CAAC"}

package/lib/pre-ldls/components/Input/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAkC1B,eAAO,MAAM,KAAK;WA9B6C,MAAM,SAAS;mDAuC7E,CAAC"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAmC1B,eAAO,MAAM,KAAK;WA/B6C,MAAM,SAAS;mDAwC7E,CAAC"}

package/lib/pre-ldls/components/Input/Input.js

@@ -5,7 +5,6 @@ const Wrapper = styled.div `
   ${withTokens("spacing-s", "spacing-xxs", "radius-s", "colors-surface-transparent-subdued-default", "colors-content-subdued-default-default")}
 
   display: flex;
-  width: 328px;
   height: 40px;
   min-width: 328px;
   padding: 0px var(--spacing-s, 16px);
@@ -15,9 +14,11 @@ const Wrapper = styled.div `
   border-radius: var(--radius-s, 8px);
   background: var(--colors-surface-transparent-subdued-default, rgba(0, 0, 0, 0.03));
   color: var(--colors-content-subdued-default-default);
+  overflow: hidden;
 `;
 const StyledInput = styled.input `
   background: none;
+  cursor: text;
   border: none;
   width: 100%;
 `;

package/lib/pre-ldls/components/Input/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAIxC,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;IACtB,UAAU,CACV,WAAW,EACX,aAAa,EACb,UAAU,EACV,4CAA4C,EAC5C,wCAAwC,CACzC;;;;;;;;;;;;;CAaF,CAAC;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAA;;;;CAI/B,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CACnC,CAAC,EAAE,IAAI,GAAG,MAAM,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAChD,OAAO,CACL,oBAAC,OAAO;QACL,IAAI;QACL,oBAAC,WAAW,OAAK,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,GAAI,CACxC,CACX,CAAC;AACJ,CAAC,CACF,CAAC;AACF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC"}
+{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAIxC,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;IACtB,UAAU,CACV,WAAW,EACX,aAAa,EACb,UAAU,EACV,4CAA4C,EAC5C,wCAAwC,CACzC;;;;;;;;;;;;;CAaF,CAAC;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;CAK/B,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CACnC,CAAC,EAAE,IAAI,GAAG,MAAM,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAChD,OAAO,CACL,oBAAC,OAAO;QACL,IAAI;QACL,oBAAC,WAAW,OAAK,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,GAAI,CACxC,CACX,CAAC;AACJ,CAAC,CACF,CAAC;AACF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC"}

package/lib/pre-ldls/components/NetworkItem/NetworkItem.d.ts

@@ -1,8 +1,12 @@
 import React from "react";
-type NetworkItemProps = {
+export type Network = {
     name: string;
+    id: string;
+    ticker: string;
+};
+type NetworkItemProps = Network & {
     onClick: () => void;
 };
-export declare const NetworkItem: ({ name, onClick }: NetworkItemProps) => React.JSX.Element;
+export declare const NetworkItem: ({ name, onClick, id, ticker }: NetworkItemProps) => React.JSX.Element;
 export {};
 //# sourceMappingURL=NetworkItem.d.ts.map

package/lib/pre-ldls/components/NetworkItem/NetworkItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NetworkItem.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/NetworkItem/NetworkItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,KAAK,gBAAgB,GAAG;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AA6CF,eAAO,MAAM,WAAW,sBAAuB,gBAAgB,sBAe9D,CAAC"}
+{"version":3,"file":"NetworkItem.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/NetworkItem/NetworkItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,MAAM,MAAM,OAAO,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC;AAEnE,KAAK,gBAAgB,GAAG,OAAO,GAAG;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAiCF,eAAO,MAAM,WAAW,kCAAmC,gBAAgB,sBAe1E,CAAC"}

package/lib/pre-ldls/components/NetworkItem/NetworkItem.js

@@ -2,21 +2,14 @@ import React from "react";
 import styled from "styled-components";
 import { withTokens } from "../../libs";
 import { Text } from "../../../components";
-const TempAssetBadge = () => (
-// TODO: To be replaced with LIVE-18221
-React.createElement("div", { style: { display: "flex", alignItems: "center" } },
-    React.createElement("span", { style: {
-            height: 48,
-            width: 48,
-            borderRadius: 48,
-            backgroundColor: "grey",
-            display: "inline-block",
-        } })));
+import { CryptoIcon } from "../CryptoIcon/CryptoIcon";
 const Wrapper = styled.div `
-  ${withTokens("spacing-xxs", "margin-s", "colors-content-default-default", "colors-surface-transparent-hover", "colors-surface-transparent-pressed")}
+  ${withTokens("spacing-xxs", "margin-s", "radius-s", "colors-content-default-default", "colors-surface-transparent-hover", "colors-surface-transparent-pressed")}
   display: flex;
   padding: var(--spacing-xxs);
   cursor: pointer;
+  border-radius: var(--radius-s, 8px);
+  align-items: center;
 
   :hover {
     background-color: var(--colors-surface-transparent-hover);
@@ -32,9 +25,9 @@ const InfoWrapper = styled.div `
   justify-content: center;
   margin-left: var(--margin-s);
 `;
-export const NetworkItem = ({ name, onClick }) => {
+export const NetworkItem = ({ name, onClick, id, ticker }) => {
     return (React.createElement(Wrapper, { onClick: onClick },
-        React.createElement(TempAssetBadge, null),
+        React.createElement(CryptoIcon, { size: "48px", ledgerId: id, ticker: ticker }),
         React.createElement(InfoWrapper, null,
             React.createElement(Text, { variant: "largeLineHeight", fontWeight: "semiBold", color: "var(--colors-content-default-default)" }, name))));
 };

package/lib/pre-ldls/components/NetworkItem/NetworkItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"NetworkItem.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/NetworkItem/NetworkItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAO3C,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC;AAC3B,uCAAuC;AACvC,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE;IACnD,8BACE,KAAK,EAAE;YACL,MAAM,EAAE,EAAE;YACV,KAAK,EAAE,EAAE;YACT,YAAY,EAAE,EAAE;YAChB,eAAe,EAAE,MAAM;YACvB,OAAO,EAAE,cAAc;SACxB,GACD,CACE,CACP,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;IACtB,UAAU,CACV,aAAa,EACb,UAAU,EACV,gCAAgC,EAChC,kCAAkC,EAClC,oCAAoC,CACrC;;;;;;;;;;;;CAYF,CAAC;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAK7B,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,IAAI,EAAE,OAAO,EAAoB,EAAE,EAAE;IACjE,OAAO,CACL,oBAAC,OAAO,IAAC,OAAO,EAAE,OAAO;QACvB,oBAAC,cAAc,OAAG;QAClB,oBAAC,WAAW;YACV,oBAAC,IAAI,IACH,OAAO,EAAC,iBAAiB,EACzB,UAAU,EAAC,UAAU,EACrB,KAAK,EAAC,uCAAuC,IAE5C,IAAI,CACA,CACK,CACN,CACX,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"NetworkItem.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/NetworkItem/NetworkItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAQtD,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;IACtB,UAAU,CACV,aAAa,EACb,UAAU,EACV,UAAU,EACV,gCAAgC,EAChC,kCAAkC,EAClC,oCAAoC,CACrC;;;;;;;;;;;;;;CAcF,CAAC;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAK7B,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE,MAAM,EAAoB,EAAE,EAAE;IAC7E,OAAO,CACL,oBAAC,OAAO,IAAC,OAAO,EAAE,OAAO;QACvB,oBAAC,UAAU,IAAC,IAAI,EAAC,MAAM,EAAC,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,GAAI;QACxD,oBAAC,WAAW;YACV,oBAAC,IAAI,IACH,OAAO,EAAC,iBAAiB,EACzB,UAAU,EAAC,UAAU,EACrB,KAAK,EAAC,uCAAuC,IAE5C,IAAI,CACA,CACK,CACN,CACX,CAAC;AACJ,CAAC,CAAC"}

package/lib/pre-ldls/components/NetworkList/NetworkList.d.ts

@@ -1,11 +1,7 @@
 import React from "react";
-type Network = {
-    name: string;
-    id: string;
-};
+import { Network } from "../NetworkItem/NetworkItem";
 export declare const NetworkList: ({ networks, onClick, }: {
     networks: Network[];
     onClick: (networkId: string) => void;
 }) => React.JSX.Element;
-export {};
 //# sourceMappingURL=NetworkList.d.ts.map

package/lib/pre-ldls/components/NetworkList/NetworkList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NetworkList.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/NetworkList/NetworkList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAI3C,KAAK,OAAO,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CAAC;AAE5C,eAAO,MAAM,WAAW;cAIZ,OAAO,EAAE;yBACE,MAAM,KAAK,IAAI;uBAQrC,CAAC"}
+{"version":3,"file":"NetworkList.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/NetworkList/NetworkList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAe,MAAM,4BAA4B,CAAC;AAGlE,eAAO,MAAM,WAAW;cAIZ,OAAO,EAAE;yBACE,MAAM,KAAK,IAAI;uBAQrC,CAAC"}

package/lib/pre-ldls/components/NetworkList/NetworkList.js

@@ -2,7 +2,7 @@ import React, { useCallback } from "react";
 import { NetworkItem } from "../NetworkItem/NetworkItem";
 import { VirtualList } from "../VirtualList/VirtualList";
 export const NetworkList = ({ networks, onClick, }) => {
-    const renderNetworkItem = useCallback(({ name, id }) => React.createElement(NetworkItem, { name: name, onClick: () => onClick(id) }), [onClick]);
+    const renderNetworkItem = useCallback((network) => React.createElement(NetworkItem, { ...network, onClick: () => onClick(network.id) }), [onClick]);
     return React.createElement(VirtualList, { items: networks, itemHeight: 64, renderItem: renderNetworkItem });
 };
 //# sourceMappingURL=NetworkList.js.map

package/lib/pre-ldls/components/NetworkList/NetworkList.js.map

@@ -1 +1 @@
-{"version":3,"file":"NetworkList.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/NetworkList/NetworkList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAIzD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAC1B,QAAQ,EACR,OAAO,GAIR,EAAE,EAAE;IACH,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAW,EAAE,EAAE,CAAC,oBAAC,WAAW,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,CAAC,GAAI,EAClF,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,OAAO,oBAAC,WAAW,IAAC,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,iBAAiB,GAAI,CAAC;AACzF,CAAC,CAAC"}
+{"version":3,"file":"NetworkList.js","sourceRoot":"","sources":["../../../../src/pre-ldls/components/NetworkList/NetworkList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAW,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAEzD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAC1B,QAAQ,EACR,OAAO,GAIR,EAAE,EAAE;IACH,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,OAAgB,EAAE,EAAE,CAAC,oBAAC,WAAW,OAAK,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,GAAI,EACtF,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,OAAO,oBAAC,WAAW,IAAC,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,iBAAiB,GAAI,CAAC;AACzF,CAAC,CAAC"}

package/lib/pre-ldls/components/index.d.ts

@@ -3,6 +3,7 @@ export * from "./AccountList/AccountList";
 export * from "./Address/Address";
 export * from "./AssetItem/AssetItem";
 export * from "./AssetList/AssetList";
+export * from "./CardButton/CardButton";
 export * from "./Input/Input";
 export * from "./NetworkItem/NetworkItem";
 export * from "./NetworkList/NetworkList";

package/lib/pre-ldls/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pre-ldls/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,2BAA2B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pre-ldls/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,2BAA2B,CAAC"}

package/lib/pre-ldls/components/index.js

@@ -3,6 +3,7 @@ export * from "./AccountList/AccountList";
 export * from "./Address/Address";
 export * from "./AssetItem/AssetItem";
 export * from "./AssetList/AssetList";
+export * from "./CardButton/CardButton";
 export * from "./Input/Input";
 export * from "./NetworkItem/NetworkItem";
 export * from "./NetworkList/NetworkList";