diff --git a/.env.example b/.env.example
index 7bfb065f4..b30fc7a9c 100644
--- a/.env.example
+++ b/.env.example
@@ -20,6 +20,9 @@ REACT_APP_CHAIN_137_PROVIDER_URL=
 # E.g. https://arbitrum-mainnet.g.alchemy.com/v2/YOUR-API-KEY
 REACT_APP_CHAIN_42161_PROVIDER_URL=
 
+# Create a project on https://walletconnect.com/ and add the project ID to this variable.
+REACT_APP_WALLET_CONNECT_PROJECT_ID=
+
 #########################
 ### OPTIONAL ENV VARS ###
 #########################
diff --git a/.gitignore b/.gitignore
index 6cbb19ee7..b8a0cf20c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -40,6 +40,7 @@ yarn-error.log*
 
 # storybook
 build-storybook.log
+storybook-static
 
 # Amplitude
 ampli.json
diff --git a/api/_utils.ts b/api/_utils.ts
index 1455706a7..586076971 100644
--- a/api/_utils.ts
+++ b/api/_utils.ts
@@ -1246,3 +1246,31 @@ export function getDefaultRelayerAddress(
     return sdk.constants.DEFAULT_SIMULATED_RELAYER_ADDRESS;
   }
 }
+
+/**
+ * Performs the needed function calls to return a Vercel Response
+ * @param response The response client provided by Vercel
+ * @param body A payload in JSON format to send to the client
+ * @param statusCode The status code - defaults to 200
+ * @param cacheSeconds The cache time in non-negative whole seconds
+ * @param staleWhileRevalidateSeconds The stale while revalidate time in non-negative whole seconds
+ * @returns The response object
+ * @see https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control
+ * @see https://datatracker.ietf.org/doc/html/rfc7234
+ * @note Be careful to not set anything negative please. The comment in the fn explains why
+ */
+export function sendResponse(
+  response: VercelResponse,
+  body: Record<string, unknown>,
+  statusCode: number,
+  cacheSeconds: number,
+  staleWhileRevalidateSeconds: number
+) {
+  // Invalid (non-positive/non-integer) values will be considered undefined per RFC-7234.
+  // Most browsers will consider these invalid and will request fresh data.
+  response.setHeader(
+    "Cache-Control",
+    `s-maxage=${cacheSeconds}, stale-while-revalidate=${staleWhileRevalidateSeconds}`
+  );
+  return response.status(statusCode).json(body);
+}
diff --git a/api/limits.ts b/api/limits.ts
index 4660c4ae1..c1e6a2152 100644
--- a/api/limits.ts
+++ b/api/limits.ts
@@ -31,6 +31,7 @@ import {
   HUB_POOL_CHAIN_ID,
   ENABLED_ROUTES,
   getDefaultRelayerAddress,
+  sendResponse,
 } from "./_utils";
 
 const LimitsQueryParamsSchema = object({
@@ -225,18 +226,14 @@ const handler = async (
         liquidReserves
       ).toString(),
     };
-
-    // Instruct Vercel to cache limit data for this token for 5 minutes. Caching can be used to limit number of
-    // Vercel invocations and run time for this serverless function and trades off potential inaccuracy in times of
-    // high volume. "max-age=0" instructs browsers not to cache, while s-maxage instructs Vercel edge caching
-    // to cache the responses and invalidate when deployments update.
     logger.debug({
       at: "Limits",
       message: "Response data",
       responseJson,
     });
-    response.setHeader("Cache-Control", "s-maxage=300");
-    response.status(200).json(responseJson);
+    // Respond with a 200 status code and 4 minutes of cache cache with
+    // a minute of stale-while-revalidate.
+    sendResponse(response, responseJson, 200, 240, 60);
   } catch (error: unknown) {
     return handleErrorCondition("limits", response, logger, error);
   }
diff --git a/package.json b/package.json
index 16b8b7caf..102d26e04 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
     "@fortawesome/free-solid-svg-icons": "^6.1.1",
     "@fortawesome/react-fontawesome": "^0.2.0",
     "@google-cloud/logging": "^10.1.1",
+    "@radix-ui/react-dropdown-menu": "^2.0.6",
     "@reach/dialog": "^0.16.2",
     "@safe-global/safe-apps-provider": "^0.18.0",
     "@safe-global/safe-apps-sdk": "^8.1.0",
@@ -94,16 +95,15 @@
     "@esbuild-plugins/node-globals-polyfill": "^0.2.3",
     "@esbuild-plugins/node-modules-polyfill": "^0.2.2",
     "@ethersproject/experimental": "^5.6.3",
-    "@storybook/addon-actions": "^7.5.1",
-    "@storybook/addon-essentials": "^7.5.1",
-    "@storybook/addon-interactions": "^7.5.1",
-    "@storybook/addon-links": "^7.5.1",
+    "@storybook/addon-actions": "^7.5.3",
+    "@storybook/addon-essentials": "^7.5.3",
+    "@storybook/addon-interactions": "^7.5.3",
+    "@storybook/addon-links": "^7.5.3",
     "@storybook/addon-onboarding": "^1.0.8",
-    "@storybook/blocks": "^7.5.1",
-    "@storybook/builder-vite": "^7.5.1",
-    "@storybook/node-logger": "^7.5.1",
-    "@storybook/react": "^7.5.1",
-    "@storybook/react-vite": "^7.5.1",
+    "@storybook/blocks": "^7.5.3",
+    "@storybook/node-logger": "^7.5.3",
+    "@storybook/react": "^7.5.3",
+    "@storybook/react-vite": "^7.5.3",
     "@storybook/testing-library": "^0.2.2",
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "12.1.5",
@@ -144,7 +144,7 @@
     "postinstall-postinstall": "^2.1.0",
     "prettier": "^2.4.1",
     "serve": "^14.0.1",
-    "storybook": "^7.5.1",
+    "storybook": "^7.5.3",
     "ts-jest": "^29.1.1",
     "ts-node": "^10.9.1",
     "tsconfig-paths-webpack-plugin": "^4.0.0",
diff --git a/src/components/DepositsTable/DataRow.tsx b/src/components/DepositsTable/DataRow.tsx
new file mode 100644
index 000000000..3216424d6
--- /dev/null
+++ b/src/components/DepositsTable/DataRow.tsx
@@ -0,0 +1,141 @@
+import styled from "@emotion/styled";
+import { BigNumber, utils } from "ethers";
+import { DateTime } from "luxon";
+
+import { Deposit } from "hooks/useDeposits";
+import {
+  COLORS,
+  getConfig,
+  fallbackSuggestedRelayerFeePct,
+  suggestedFeesDeviationBufferMultiplier,
+  fixedPointAdjustment,
+} from "utils";
+
+import { HeaderCells, ColumnKey } from "./HeadRow";
+import { AssetCell } from "./cells/AssetCell";
+import { AmountCell } from "./cells/AmountCell";
+import { RouteCell } from "./cells/RouteCell";
+import { AddressCell } from "./cells/AddressCell";
+import { DateCell } from "./cells/DateCell";
+import { StatusCell } from "./cells/StatusCell";
+import { TxCell } from "./cells/TxCell";
+import { FeeCell } from "./cells/FeeCell";
+import { RateCell } from "./cells/RateCell";
+import { RewardsCell } from "./cells/RewardsCell";
+import { ActionsCell } from "./cells/ActionsCell";
+
+type Props = {
+  deposit: Deposit;
+  headerCells: HeaderCells;
+  disabledColumns?: ColumnKey[];
+  onClickSpeedUp?: () => void;
+};
+
+const config = getConfig();
+
+const MAX_PENDING_STATE_TIME_UNTIL_SLOW = 15 * 60; // 15 mins
+
+function isColumnDisabled(disabledColumns: ColumnKey[], column: ColumnKey) {
+  return disabledColumns.includes(column);
+}
+
+export function DataRow({
+  deposit,
+  headerCells,
+  disabledColumns = [],
+  onClickSpeedUp,
+}: Props) {
+  const token = config.getTokenInfoByAddressSafe(
+    deposit.sourceChainId,
+    deposit.assetAddr
+  );
+
+  const isProfitable = BigNumber.from(
+    deposit.suggestedRelayerFeePct || fallbackSuggestedRelayerFeePct
+  ).lte(
+    BigNumber.from(deposit.depositRelayerFeePct)
+      .mul(utils.parseEther(String(suggestedFeesDeviationBufferMultiplier)))
+      .div(fixedPointAdjustment)
+  );
+  const isSlowRelay =
+    deposit.status === "pending" &&
+    DateTime.fromSeconds(deposit.depositTime).diffNow("seconds").as("seconds") <
+      MAX_PENDING_STATE_TIME_UNTIL_SLOW;
+
+  // Hide unsupported or unknown token deposits
+  if (!token) {
+    return null;
+  }
+
+  return (
+    <StyledRow>
+      {isColumnDisabled(disabledColumns, "asset") ? null : (
+        <AssetCell token={token} width={headerCells.asset.width} />
+      )}
+      {isColumnDisabled(disabledColumns, "amount") ? null : (
+        <AmountCell
+          deposit={deposit}
+          token={token}
+          width={headerCells.amount.width}
+        />
+      )}
+      {isColumnDisabled(disabledColumns, "route") ? null : (
+        <RouteCell
+          deposit={deposit}
+          token={token}
+          width={headerCells.route.width}
+        />
+      )}
+      {isColumnDisabled(disabledColumns, "address") ? null : (
+        <AddressCell deposit={deposit} width={headerCells.address.width} />
+      )}
+      {isColumnDisabled(disabledColumns, "date") ? null : (
+        <DateCell deposit={deposit} width={headerCells.date.width} />
+      )}
+      {isColumnDisabled(disabledColumns, "status") ? null : (
+        <StatusCell
+          deposit={deposit}
+          width={headerCells.status.width}
+          isProfitable={isProfitable}
+        />
+      )}
+      {isColumnDisabled(disabledColumns, "transactions") ? null : (
+        <TxCell deposit={deposit} width={headerCells.transactions.width} />
+      )}
+      {isColumnDisabled(disabledColumns, "netFee") ? null : (
+        <FeeCell deposit={deposit} width={headerCells.netFee.width} />
+      )}
+      {isColumnDisabled(disabledColumns, "loyaltyRate") ? null : (
+        <RateCell deposit={deposit} width={headerCells.loyaltyRate.width} />
+      )}
+      {isColumnDisabled(disabledColumns, "rewards") ? null : (
+        <RewardsCell deposit={deposit} width={headerCells.rewards.width} />
+      )}
+      {isColumnDisabled(disabledColumns, "actions") ? null : (
+        <ActionsCell
+          deposit={deposit}
+          isProfitable={isProfitable}
+          isSlowRelay={isSlowRelay}
+          onClickSpeedUp={onClickSpeedUp}
+        />
+      )}
+    </StyledRow>
+  );
+}
+
+const StyledRow = styled.tr`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 16px;
+  padding: 0px 24px;
+  border-width: 0px 1px 1px 1px;
+  border-style: solid;
+  border-color: ${COLORS["grey-600"]};
+
+  :hover {
+    #speed-up-icon {
+      display: block;
+    }
+  }
+`;
diff --git a/src/components/DepositsTable/DepositsTable.tsx b/src/components/DepositsTable/DepositsTable.tsx
new file mode 100644
index 000000000..0caceea7a
--- /dev/null
+++ b/src/components/DepositsTable/DepositsTable.tsx
@@ -0,0 +1,48 @@
+import styled from "@emotion/styled";
+
+import { HeadRow, headerCells, ColumnKey } from "./HeadRow";
+import { DataRow } from "./DataRow";
+import { Deposit } from "hooks/useDeposits";
+
+type Props = {
+  disabledColumns?: ColumnKey[];
+  onClickSpeedUp?: () => void;
+  deposits: Deposit[];
+};
+
+export function DepositsTable({
+  disabledColumns = [],
+  deposits,
+  onClickSpeedUp,
+}: Props) {
+  return (
+    <Wrapper>
+      <StyledTable>
+        <HeadRow disabledColumns={disabledColumns} />
+        <tbody>
+          {deposits.map((deposit) => (
+            <DataRow
+              disabledColumns={disabledColumns}
+              headerCells={headerCells}
+              key={deposit.depositId}
+              deposit={deposit}
+              onClickSpeedUp={onClickSpeedUp}
+            />
+          ))}
+        </tbody>
+      </StyledTable>
+    </Wrapper>
+  );
+}
+
+const Wrapper = styled.div`
+  display: flex;
+  flex-direction: column;
+  overflow-x: auto;
+`;
+
+const StyledTable = styled.table`
+  width: 1666px;
+  white-space: nowrap;
+  table-layout: fixed;
+`;
diff --git a/src/components/DepositsTable/HeadRow.tsx b/src/components/DepositsTable/HeadRow.tsx
new file mode 100644
index 000000000..c29f59a86
--- /dev/null
+++ b/src/components/DepositsTable/HeadRow.tsx
@@ -0,0 +1,92 @@
+import styled from "@emotion/styled";
+import { Text } from "components/Text";
+import { COLORS } from "utils";
+
+export type HeaderCells = typeof headerCells;
+export type ColumnKey = keyof HeaderCells;
+
+export const headerCells = {
+  asset: {
+    label: "Asset",
+    width: 124,
+  },
+  amount: {
+    label: "Amount",
+    width: 104,
+  },
+  route: {
+    label: "Route",
+    width: 206,
+  },
+  address: {
+    label: "Address",
+    width: 112,
+  },
+  date: {
+    label: "Date",
+    width: 104,
+  },
+  status: {
+    label: "Status",
+    width: 144,
+  },
+  transactions: {
+    label: "Transactions",
+    width: 176,
+  },
+  netFee: {
+    label: "Net fee",
+    width: 136,
+  },
+  loyaltyRate: {
+    label: "Loyalty rate",
+    width: 104,
+  },
+  rewards: {
+    label: "Rewards",
+    width: 136,
+  },
+  actions: {
+    label: "",
+    width: 64,
+  },
+};
+
+export function HeadRow({
+  disabledColumns = [],
+}: {
+  disabledColumns?: ColumnKey[];
+}) {
+  return (
+    <StyledHead>
+      <StyledRow>
+        {Object.entries(headerCells).map(([key, value]) =>
+          disabledColumns.includes(key as ColumnKey) ? null : (
+            <StyledCell key={key} width={value.width}>
+              <Text color="grey-400">{value.label}</Text>
+            </StyledCell>
+          )
+        )}
+      </StyledRow>
+    </StyledHead>
+  );
+}
+
+const StyledHead = styled.thead``;
+
+const StyledRow = styled.tr`
+  display: flex;
+  height: 40px;
+  align-items: center;
+  padding: 0px 24px;
+  gap: 16px;
+
+  background-color: ${COLORS["black-700"]};
+  border-radius: 12px 12px 0px 0px;
+  border: ${COLORS["grey-600"]} 1px solid;
+`;
+
+const StyledCell = styled.th<{ width: number }>`
+  display: flex;
+  width: ${({ width }) => width}px;
+`;
diff --git a/src/components/DepositsTable/cells/ActionsCell.tsx b/src/components/DepositsTable/cells/ActionsCell.tsx
new file mode 100644
index 000000000..05c7d94ff
--- /dev/null
+++ b/src/components/DepositsTable/cells/ActionsCell.tsx
@@ -0,0 +1,125 @@
+import styled from "@emotion/styled";
+
+import { ReactComponent as ZapIcon } from "assets/zap.svg";
+import { ReactComponent as InfoIcon } from "assets/icons/info-16.svg";
+import { Text } from "components/Text";
+import { Tooltip } from "components/Tooltip";
+import { Deposit } from "hooks/useDeposits";
+import { COLORS } from "utils";
+
+type Props = {
+  deposit: Deposit;
+  isSlowRelay?: boolean;
+  isProfitable?: boolean;
+  onClickSpeedUp?: () => void;
+};
+
+export function ActionsCell({
+  deposit,
+  isProfitable,
+  isSlowRelay,
+  onClickSpeedUp,
+}: Props) {
+  const slowRelayInfo =
+    isSlowRelay && isProfitable ? (
+      <Tooltip
+        tooltipId="slow-relay-info"
+        title="Relayer running out of funds"
+        maxWidth={320}
+        placement="left"
+        offset={60}
+        icon={<SlowRelayInfoIconTooltip />}
+        body={
+          <Text size="sm" color="light-300">
+            Due to low relay funds this transaction may take up to 3 hours to
+            complete. Your full relayer fee will be refunded for the
+            inconvenience.
+          </Text>
+        }
+      >
+        <SlowRelayInfoIcon />
+      </Tooltip>
+    ) : null;
+
+  const speedUp =
+    deposit.status === "pending" ? (
+      isProfitable ? (
+        <ZapIconOnHover id="speed-up-icon" onClick={onClickSpeedUp} />
+      ) : (
+        <ZapIconPersistent onClick={onClickSpeedUp} />
+      )
+    ) : null;
+
+  return (
+    <StyledActionsCell>
+      <Blur />
+      <ActionsContainer>
+        {speedUp}
+        {slowRelayInfo}
+      </ActionsContainer>
+    </StyledActionsCell>
+  );
+}
+
+const StyledActionsCell = styled.td`
+  display: flex;
+  flex-direction: row;
+  gap: 2px;
+
+  right: 0;
+  position: sticky;
+  background-color: ${COLORS["black-800"]};
+  height: 64px;
+`;
+
+const ActionsContainer = styled.div`
+  height: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16px;
+
+  svg {
+    cursor: pointer;
+    height: 24px;
+    width: 24px;
+  }
+`;
+
+const Blur = styled.div`
+  width: 20px;
+  height: 64px;
+  background-color: ${COLORS["black-800"]};
+  filter: blur(4px);
+`;
+
+const SlowRelayInfoIcon = styled(InfoIcon)`
+  width: 24px;
+  height: 24px;
+  path {
+    stroke: ${COLORS.yellow};
+  }
+`;
+
+const SlowRelayInfoIconTooltip = styled(InfoIcon)`
+  width: 16px;
+  height: 16px;
+  path {
+    stroke: ${COLORS.yellow};
+  }
+`;
+
+const ZapIconOnHover = styled(ZapIcon)`
+  display: none;
+
+  path {
+    stroke: ${COLORS["grey-400"]};
+  }
+`;
+
+const ZapIconPersistent = styled(ZapIcon)`
+  path {
+    stroke: ${COLORS.yellow};
+  }
+`;
diff --git a/src/components/DepositsTable/cells/AddressCell.tsx b/src/components/DepositsTable/cells/AddressCell.tsx
new file mode 100644
index 000000000..3556cdc7d
--- /dev/null
+++ b/src/components/DepositsTable/cells/AddressCell.tsx
@@ -0,0 +1,31 @@
+import styled from "@emotion/styled";
+
+import { Text } from "components/Text";
+import { Deposit } from "hooks/useDeposits";
+
+import { BaseCell } from "./BaseCell";
+import { shortenAddress } from "utils";
+
+type Props = {
+  deposit: Deposit;
+  width: number;
+};
+
+export function AddressCell({ deposit, width }: Props) {
+  return (
+    <StyledAddressCell width={width}>
+      <Text color="light-200">
+        → {shortenAddress(deposit.recipientAddr, "...", 4)}
+      </Text>
+      <Text size="sm" color="grey-400">
+        {shortenAddress(deposit.depositorAddr, "...", 4)}
+      </Text>
+    </StyledAddressCell>
+  );
+}
+
+const StyledAddressCell = styled(BaseCell)`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+`;
diff --git a/src/components/DepositsTable/cells/AmountCell.tsx b/src/components/DepositsTable/cells/AmountCell.tsx
new file mode 100644
index 000000000..a8cc684bc
--- /dev/null
+++ b/src/components/DepositsTable/cells/AmountCell.tsx
@@ -0,0 +1,31 @@
+import styled from "@emotion/styled";
+
+import { Text } from "components/Text";
+import { Deposit } from "hooks/useDeposits";
+import { formatUnits, Token } from "utils";
+
+import { BaseCell } from "./BaseCell";
+
+type Props = {
+  deposit: Deposit;
+  token: Token;
+  width: number;
+};
+
+export function AmountCell({ deposit, token, width }: Props) {
+  return (
+    <StyledAmountCell width={width}>
+      <Text color="light-200">
+        {formatUnits(deposit.amount, token.decimals)}
+      </Text>
+    </StyledAmountCell>
+  );
+}
+
+const StyledAmountCell = styled(BaseCell)`
+  > div {
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+  }
+`;
diff --git a/src/components/DepositsTable/cells/AssetCell.tsx b/src/components/DepositsTable/cells/AssetCell.tsx
new file mode 100644
index 000000000..72e530042
--- /dev/null
+++ b/src/components/DepositsTable/cells/AssetCell.tsx
@@ -0,0 +1,38 @@
+import styled from "@emotion/styled";
+
+import { Text } from "components/Text";
+import { QUERIESV2, Token } from "utils";
+
+import { BaseCell } from "./BaseCell";
+
+type Props = {
+  token: Token;
+  width: number;
+};
+
+export function AssetCell({ token, width }: Props) {
+  return (
+    <StyledAssetCell width={width}>
+      <img src={token.logoURI} alt="" />
+      <Text color="light-200">{token.symbol}</Text>
+    </StyledAssetCell>
+  );
+}
+
+const StyledAssetCell = styled(BaseCell)`
+  gap: 24px;
+
+  img {
+    width: 32px;
+    height: 32px;
+  }
+
+  @media ${QUERIESV2.sm.andDown} {
+    gap: 16px;
+
+    img {
+      width: 24px;
+      height: 24px;
+    }
+  }
+`;
diff --git a/src/components/DepositsTable/cells/BaseCell.tsx b/src/components/DepositsTable/cells/BaseCell.tsx
new file mode 100644
index 000000000..ba57baee1
--- /dev/null
+++ b/src/components/DepositsTable/cells/BaseCell.tsx
@@ -0,0 +1,9 @@
+import styled from "@emotion/styled";
+
+export const BaseCell = styled.td<{ width: number }>`
+  padding: 16px 0px;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  width: ${({ width }) => width}px;
+`;
diff --git a/src/components/DepositsTable/cells/DateCell.tsx b/src/components/DepositsTable/cells/DateCell.tsx
new file mode 100644
index 000000000..eb1725584
--- /dev/null
+++ b/src/components/DepositsTable/cells/DateCell.tsx
@@ -0,0 +1,31 @@
+import styled from "@emotion/styled";
+import { DateTime } from "luxon";
+
+import { Text } from "components/Text";
+import { Deposit } from "hooks/useDeposits";
+
+import { BaseCell } from "./BaseCell";
+
+type Props = {
+  deposit: Deposit;
+  width: number;
+};
+
+export function DateCell({ deposit, width }: Props) {
+  return (
+    <StyledDateCell width={width}>
+      <Text color="light-200">
+        {DateTime.fromSeconds(deposit.depositTime).toFormat("dd LLL, yyyy")}
+      </Text>
+      <Text size="sm" color="grey-400">
+        {DateTime.fromSeconds(deposit.depositTime).toFormat("hh:mm a")}
+      </Text>
+    </StyledDateCell>
+  );
+}
+
+const StyledDateCell = styled(BaseCell)`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+`;
diff --git a/src/components/DepositsTable/cells/FeeCell.tsx b/src/components/DepositsTable/cells/FeeCell.tsx
new file mode 100644
index 000000000..eda2f2681
--- /dev/null
+++ b/src/components/DepositsTable/cells/FeeCell.tsx
@@ -0,0 +1,217 @@
+import styled from "@emotion/styled";
+
+import { ReactComponent as InfoIcon } from "assets/icons/info-16.svg";
+import { BigNumber } from "ethers";
+
+import { Text } from "components/Text";
+import { Tooltip } from "components/Tooltip";
+import { Deposit } from "hooks/useDeposits";
+
+import { BaseCell } from "./BaseCell";
+import {
+  COLORS,
+  fixedPointAdjustment,
+  formatUnits,
+  formatWeiPct,
+  getConfig,
+  getToken,
+} from "utils";
+
+type Props = {
+  deposit: Deposit;
+  width: number;
+};
+
+export function FeeCell({ deposit, width }: Props) {
+  const feeCellValue = !deposit.feeBreakdown ? (
+    <FeeWithoutBreakdown deposit={deposit} />
+  ) : (
+    <FeeWithBreakdown deposit={deposit} />
+  );
+
+  return <StyledFeeCell width={width}>{feeCellValue}</StyledFeeCell>;
+}
+
+function FeeWithoutBreakdown({ deposit }: { deposit: Deposit }) {
+  const tokenInfo = getConfig().getTokenInfoByAddress(
+    deposit.sourceChainId,
+    deposit.assetAddr
+  );
+
+  return (
+    <>
+      <Text color="light-200">
+        {formatUnits(
+          BigNumber.from(deposit.amount)
+            .mul(deposit.depositRelayerFeePct)
+            .div(fixedPointAdjustment),
+          tokenInfo.decimals
+        )}{" "}
+        {tokenInfo.symbol}
+      </Text>
+      <Text size="sm" color="grey-400">
+        {formatWeiPct(deposit.depositRelayerFeePct, 3)}%
+      </Text>
+    </>
+  );
+}
+
+function FeeWithBreakdown({ deposit }: { deposit: Deposit }) {
+  const netFee = BigNumber.from(deposit.feeBreakdown?.bridgeFee.usd || 0)
+    .add(BigNumber.from(deposit.feeBreakdown?.destinationGasFee.usd || 0))
+    .sub(BigNumber.from(deposit.rewards?.usd || 0));
+
+  const tokenInfo = getConfig().getTokenInfoByAddress(
+    deposit.sourceChainId,
+    deposit.assetAddr
+  );
+  const rewardToken = deposit.rewards
+    ? getToken(deposit.rewards.type === "op-rebates" ? "OP" : "ACX")
+    : undefined;
+
+  return (
+    <>
+      <Text color="light-200">${formatUnits(netFee, 18)}</Text>
+      <LowerRow>
+        <Text size="sm" color="grey-400">
+          Fee breakdown
+        </Text>
+        <Tooltip
+          tooltipId="fee-breakdown"
+          placement="bottom-start"
+          title="Fee breakdown"
+          maxWidth={400}
+          body={
+            <FeeBreakdownTooltipBody>
+              <FeeBreakdownRow>
+                <Text size="sm" color="grey-400">
+                  Net fee
+                </Text>
+                <Text size="sm" color="light-100">
+                  ${formatUnits(netFee, 18)}
+                </Text>
+              </FeeBreakdownRow>
+              <Divider />
+              <FeeBreakdownRow>
+                <Text size="sm" color="grey-400">
+                  Bridge fee
+                </Text>
+                <FeeValueWrapper>
+                  <Text size="sm" color="grey-400">
+                    ${formatUnits(deposit.feeBreakdown?.bridgeFee.usd || 0, 18)}
+                  </Text>
+                  <Text size="sm" color="light-200">
+                    {formatUnits(
+                      BigNumber.from(deposit.feeBreakdown?.bridgeFee.pct || 0)
+                        .mul(deposit.amount)
+                        .div(fixedPointAdjustment),
+                      tokenInfo.decimals
+                    )}{" "}
+                    {tokenInfo.symbol}
+                  </Text>
+                  <img src={tokenInfo.logoURI} alt={tokenInfo.symbol} />
+                </FeeValueWrapper>
+              </FeeBreakdownRow>
+              <FeeBreakdownRow>
+                <Text size="sm" color="grey-400">
+                  Destination gas fee
+                </Text>
+                <FeeValueWrapper>
+                  <Text size="sm" color="grey-400">
+                    $
+                    {formatUnits(
+                      deposit.feeBreakdown?.destinationGasFee.usd || 0,
+                      18
+                    )}
+                  </Text>
+                  <Text size="sm" color="light-200">
+                    {formatUnits(
+                      BigNumber.from(
+                        deposit.feeBreakdown?.destinationGasFee.pct || 0
+                      )
+                        .mul(deposit.amount)
+                        .div(fixedPointAdjustment),
+                      tokenInfo.decimals
+                    )}{" "}
+                    {tokenInfo.symbol}
+                  </Text>
+                  <img src={tokenInfo.logoURI} alt={tokenInfo.symbol} />
+                </FeeValueWrapper>
+              </FeeBreakdownRow>
+              {deposit.rewards && rewardToken && (
+                <FeeBreakdownRow>
+                  <Text size="sm" color="grey-400">
+                    Rewards
+                  </Text>
+                  <FeeValueWrapper>
+                    <Text size="sm" color="aqua">
+                      ${formatUnits(deposit.rewards.usd, rewardToken.decimals)}
+                    </Text>
+                    <img src={rewardToken.logoURI} alt={rewardToken.symbol} />
+                  </FeeValueWrapper>
+                </FeeBreakdownRow>
+              )}
+            </FeeBreakdownTooltipBody>
+          }
+        >
+          <StyledInfoIcon />
+        </Tooltip>
+      </LowerRow>
+    </>
+  );
+}
+
+const StyledFeeCell = styled(BaseCell)`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+`;
+
+const LowerRow = styled.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 4px;
+`;
+
+const StyledInfoIcon = styled(InfoIcon)`
+  height: 16px;
+  width: 16px;
+
+  > path {
+    stroke: ${COLORS["grey-400"]};
+  }
+`;
+
+const FeeBreakdownTooltipBody = styled.div`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  padding: 8px 0px;
+  gap: 12px;
+  width: 320px;
+`;
+
+const FeeBreakdownRow = styled.div`
+  display: flex;
+  width: 100%;
+  flex-direction: row;
+  justify-content: space-between;
+`;
+
+const Divider = styled.div`
+  width: 100%;
+  border-top: 1px solid ${COLORS["black-800"]};
+`;
+
+const FeeValueWrapper = styled.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 8px;
+
+  > img {
+    height: 16px;
+    width: 16px;
+  }
+`;
diff --git a/src/components/DepositsTable/cells/RateCell.tsx b/src/components/DepositsTable/cells/RateCell.tsx
new file mode 100644
index 000000000..06947aed5
--- /dev/null
+++ b/src/components/DepositsTable/cells/RateCell.tsx
@@ -0,0 +1,27 @@
+import styled from "@emotion/styled";
+
+import { Text } from "components/Text";
+import { Deposit } from "hooks/useDeposits";
+
+import { BaseCell } from "./BaseCell";
+
+type Props = {
+  deposit: Deposit;
+  width: number;
+};
+
+export function RateCell({ deposit, width }: Props) {
+  return (
+    <StyledRateCell width={width}>
+      <Text color="light-200">
+        {deposit.rewards ? `${deposit.rewards.rate * 100}%` : "-"}
+      </Text>
+    </StyledRateCell>
+  );
+}
+
+const StyledRateCell = styled(BaseCell)`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+`;
diff --git a/src/components/DepositsTable/cells/RewardsCell.tsx b/src/components/DepositsTable/cells/RewardsCell.tsx
new file mode 100644
index 000000000..3c9a84033
--- /dev/null
+++ b/src/components/DepositsTable/cells/RewardsCell.tsx
@@ -0,0 +1,47 @@
+import styled from "@emotion/styled";
+
+import { Text } from "components/Text";
+import { Deposit } from "hooks/useDeposits";
+
+import { BaseCell } from "./BaseCell";
+import { formatUnits, getToken } from "utils";
+
+type Props = {
+  deposit: Deposit;
+  width: number;
+};
+
+export function RewardsCell({ deposit, width }: Props) {
+  const rewardToken = deposit.rewards
+    ? getToken(deposit.rewards?.type === "op-rebates" ? "OP" : "ACX")
+    : undefined;
+
+  return (
+    <StyledRewardsCell width={width}>
+      {deposit.rewards && rewardToken ? (
+        <>
+          <img src={rewardToken.logoURI} alt={rewardToken.symbol} />
+          <Text color="light-200">
+            {formatUnits(deposit.rewards.amount, rewardToken.decimals)}{" "}
+            {rewardToken.symbol}
+          </Text>
+          <Text color="grey-400">${formatUnits(deposit.rewards.usd, 18)}</Text>
+        </>
+      ) : (
+        <Text>-</Text>
+      )}
+    </StyledRewardsCell>
+  );
+}
+
+const StyledRewardsCell = styled(BaseCell)`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+
+  > img {
+    width: 16px;
+    height: 16px;
+  }
+`;
diff --git a/src/components/DepositsTable/cells/RouteCell.tsx b/src/components/DepositsTable/cells/RouteCell.tsx
new file mode 100644
index 000000000..843ee9e7d
--- /dev/null
+++ b/src/components/DepositsTable/cells/RouteCell.tsx
@@ -0,0 +1,59 @@
+import styled from "@emotion/styled";
+
+import { Text } from "components/Text";
+import { IconPair } from "components/IconPair";
+import { Deposit } from "hooks/useDeposits";
+import { getChainInfo, Token } from "utils";
+
+import { BaseCell } from "./BaseCell";
+
+type Props = {
+  deposit: Deposit;
+  token: Token;
+  width: number;
+};
+
+export function RouteCell({ deposit, token, width }: Props) {
+  const sourceChain = getChainInfo(deposit.sourceChainId);
+  const destinationChain = getChainInfo(deposit.destinationChainId);
+
+  return (
+    <StyledRouteCell width={width}>
+      <IconPairContainer>
+        <IconPair
+          LeftIcon={
+            <img src={sourceChain.logoURI} alt={`${sourceChain.name} logo`} />
+          }
+          RightIcon={
+            <img
+              src={destinationChain.logoURI}
+              alt={`${destinationChain.name} logo`}
+            />
+          }
+          iconSize={20}
+        />
+      </IconPairContainer>
+      <ChainNamesContainer>
+        <Text color="light-200">→ {destinationChain.name}</Text>
+        <Text size="sm" color="grey-400">
+          {sourceChain.name}
+        </Text>
+      </ChainNamesContainer>
+    </StyledRouteCell>
+  );
+}
+
+const StyledRouteCell = styled(BaseCell)`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 24px;
+`;
+
+const IconPairContainer = styled.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+`;
+
+const ChainNamesContainer = styled.div``;
diff --git a/src/components/DepositsTable/cells/StatusCell.tsx b/src/components/DepositsTable/cells/StatusCell.tsx
new file mode 100644
index 000000000..16d64e2e9
--- /dev/null
+++ b/src/components/DepositsTable/cells/StatusCell.tsx
@@ -0,0 +1,135 @@
+import styled from "@emotion/styled";
+import { keyframes } from "@emotion/react";
+
+import { ReactComponent as CheckIcon } from "assets/check.svg";
+import { ReactComponent as LoadingIcon } from "assets/loading.svg";
+import { ReactComponent as InfoIcon } from "assets/icons/info-16.svg";
+import { Text } from "components/Text";
+import { Tooltip } from "components/Tooltip";
+import { Deposit } from "hooks/useDeposits";
+import { useElapsedSeconds } from "hooks/useElapsedSeconds";
+import { formatSeconds, COLORS } from "utils";
+
+import { BaseCell } from "./BaseCell";
+
+type Props = {
+  deposit: Deposit;
+  width: number;
+  isProfitable?: boolean;
+};
+
+export function StatusCell({ deposit, width, isProfitable }: Props) {
+  if (deposit.status === "pending") {
+    return (
+      <PendingStatusCell
+        deposit={deposit}
+        width={width}
+        isProfitable={isProfitable}
+      />
+    );
+  }
+
+  return <FilledStatusCell deposit={deposit} width={width} />;
+}
+
+function FilledStatusCell({ deposit, width }: Props) {
+  const { elapsedSeconds } = useElapsedSeconds(
+    deposit.depositTime,
+    deposit.fillTime || 1
+  );
+
+  const doesFillTimeExist = deposit.fillTime !== undefined;
+
+  return (
+    <StyledFilledStatusCell width={width}>
+      {doesFillTimeExist ? (
+        <Text color="aqua">{formatSeconds(elapsedSeconds || 0)}</Text>
+      ) : null}
+      <FinalizedText color="aqua" size={doesFillTimeExist ? "sm" : "md"}>
+        Finalized
+        <CheckIcon />
+      </FinalizedText>
+    </StyledFilledStatusCell>
+  );
+}
+
+function PendingStatusCell({ deposit, width, isProfitable }: Props) {
+  return (
+    <StyledPendingStatusCell width={width}>
+      <Text color={isProfitable ? "light-200" : "yellow"}>
+        {isProfitable ? "Processing..." : "Fee too low"}
+      </Text>
+      {isProfitable ? (
+        <StyledLoadingIcon />
+      ) : (
+        <Tooltip
+          tooltipId="fee-too-low"
+          placement="bottom"
+          title="Relayer fee is too low"
+          body={
+            <FeeTooLowTooltipTextContainer>
+              <Text size="sm" color="light-300">
+                Click the button in the right end of the table to increase fee.
+              </Text>
+            </FeeTooLowTooltipTextContainer>
+          }
+        >
+          <StyledInfoIcon />
+        </Tooltip>
+      )}
+    </StyledPendingStatusCell>
+  );
+}
+
+const StyledFilledStatusCell = styled(BaseCell)`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+`;
+
+const FinalizedText = styled(Text)`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 4px;
+`;
+
+const StyledPendingStatusCell = styled(BaseCell)`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 4px;
+`;
+
+const StyledInfoIcon = styled(InfoIcon)`
+  height: 16px;
+  width: 16px;
+
+  > path {
+    stroke: ${COLORS.yellow};
+  }
+`;
+
+const FeeTooLowTooltipTextContainer = styled.div`
+  display: flex;
+  flex-direction: row;
+`;
+
+const RotationKeyframes = keyframes`
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+`;
+
+const StyledLoadingIcon = styled(LoadingIcon)`
+  height: 16px;
+  width: 16px;
+
+  path {
+    stroke: ${COLORS["light-200"]};
+  }
+  animation: ${RotationKeyframes} 2.5s linear infinite;
+`;
diff --git a/src/components/DepositsTable/cells/TxCell.tsx b/src/components/DepositsTable/cells/TxCell.tsx
new file mode 100644
index 000000000..2f1e7a8d3
--- /dev/null
+++ b/src/components/DepositsTable/cells/TxCell.tsx
@@ -0,0 +1,175 @@
+import styled from "@emotion/styled";
+import { useState } from "react";
+import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
+
+import { ReactComponent as ArrowDownIcon } from "assets/icons/arrow-16.svg";
+import { ReactComponent as ArrowExternalLink } from "assets/icons/external-link-16.svg";
+import { Text } from "components/Text";
+import { Deposit } from "hooks/useDeposits";
+
+import { BaseCell } from "./BaseCell";
+import { COLORS, getChainInfo, shortenAddress, shortenString } from "utils";
+
+type Props = {
+  deposit: Deposit;
+  width: number;
+};
+
+export function TxCell({ deposit, width }: Props) {
+  const fillTxRow =
+    deposit.fillTxs.length === 0 ? null : deposit.fillTxs.length === 1 ? (
+      <DepositTxWrapper>
+        <Text color="grey-400">Fill:</Text>
+        <ExplorerLink
+          chainId={deposit.destinationChainId}
+          txHash={deposit.fillTxs[0]}
+        >
+          <Text color="light-200">
+            {shortenString(deposit.fillTxs[0], "..", 4)}
+          </Text>
+        </ExplorerLink>
+      </DepositTxWrapper>
+    ) : (
+      <FillTxDropdownMenu deposit={deposit} />
+    );
+
+  return (
+    <StyledTxCell width={width}>
+      <DepositTxWrapper>
+        <Text color="grey-400">Deposit:</Text>
+        <ExplorerLink
+          chainId={deposit.sourceChainId}
+          txHash={deposit.depositTxHash}
+        >
+          <Text color="light-200">
+            {shortenString(deposit.depositTxHash, "..", 4)}
+          </Text>
+        </ExplorerLink>
+      </DepositTxWrapper>
+      {fillTxRow}
+    </StyledTxCell>
+  );
+}
+
+function FillTxDropdownMenu({ deposit }: { deposit: Deposit }) {
+  const [isOpen, setIsOpen] = useState(false);
+
+  return (
+    <DropdownMenu.Root open={isOpen} onOpenChange={setIsOpen}>
+      <DropdownMenuTrigger asChild>
+        <FillTxWrapper>
+          <Text color="grey-400">Fill:</Text>
+          <Text color="light-200">
+            {shortenString(deposit.fillTxs[0], "..", 4)}
+          </Text>
+          <Text color="grey-400">+{deposit.fillTxs.length - 1}</Text>
+          {isOpen ? <ArrowUpIcon /> : <ArrowDownIcon />}
+        </FillTxWrapper>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent side="bottom">
+        {deposit.fillTxs.map((txHash) => (
+          <ExplorerLink
+            key={txHash}
+            chainId={deposit.destinationChainId}
+            txHash={txHash}
+          >
+            <DropdownMenuItem>
+              <DropdownMenuItemContentLeft>
+                <Text color="grey-400">Fill</Text>
+                <Text color="light-200">
+                  {shortenAddress(deposit.depositTxHash, ". .", 4)}
+                </Text>
+              </DropdownMenuItemContentLeft>
+              <ArrowExternalLink />
+            </DropdownMenuItem>
+          </ExplorerLink>
+        ))}
+      </DropdownMenuContent>
+    </DropdownMenu.Root>
+  );
+}
+
+function ExplorerLink({
+  txHash,
+  chainId,
+  children,
+}: {
+  txHash: string;
+  chainId: number;
+  children: React.ReactNode;
+}) {
+  const explorerUrl = getChainInfo(chainId).constructExplorerLink(txHash);
+
+  return (
+    <ExplorerLinkWrapper href={explorerUrl} target="_blank" rel="noreferrer">
+      {children}
+    </ExplorerLinkWrapper>
+  );
+}
+
+const StyledTxCell = styled(BaseCell)`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+`;
+
+const DepositTxWrapper = styled.div`
+  display: flex;
+  flex-direction: row;
+  gap: 4px;
+  align-items: center;
+`;
+
+const FillTxWrapper = styled.div`
+  display: flex;
+  flex-direction: row;
+  gap: 4px;
+  align-items: center;
+`;
+
+const ArrowUpIcon = styled(ArrowDownIcon)`
+  transform: rotate(180deg);
+`;
+
+const ExplorerLinkWrapper = styled.a`
+  text-decoration: none;
+`;
+
+const DropdownMenuTrigger = styled(DropdownMenu.Trigger)`
+  cursor: pointer;
+`;
+
+const DropdownMenuContent = styled(DropdownMenu.Content)`
+  display: flex;
+  width: 240px;
+  flex-direction: column;
+
+  border-radius: 10px;
+  border: 1px solid ${COLORS["black-700"]};
+  background: ${COLORS["black-900"]};
+  box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.2);
+`;
+
+const DropdownMenuItem = styled(DropdownMenu.Item)`
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  padding: 14px 16px;
+  cursor: pointer;
+  border: none;
+
+  &:hover {
+    background: ${COLORS["black-800"]};
+  }
+
+  > svg {
+    height: 16px;
+    width: 16px;
+  }
+`;
+
+const DropdownMenuItemContentLeft = styled.div`
+  display: flex;
+  flex-direction: column;
+`;
diff --git a/src/components/DepositsTable/index.tsx b/src/components/DepositsTable/index.tsx
new file mode 100644
index 000000000..06e80a0c1
--- /dev/null
+++ b/src/components/DepositsTable/index.tsx
@@ -0,0 +1,3 @@
+export * from "./DataRow";
+export * from "./HeadRow";
+export * from "./DepositsTable";
diff --git a/src/components/IconPair/IconPair.tsx b/src/components/IconPair/IconPair.tsx
index 4aec15a12..4a40ba105 100644
--- a/src/components/IconPair/IconPair.tsx
+++ b/src/components/IconPair/IconPair.tsx
@@ -1,39 +1,59 @@
 import styled from "@emotion/styled";
 import React from "react";
 
+import { COLORS } from "utils";
+
+type BorderColor = keyof typeof COLORS;
+
 type Props = {
   LeftIcon: React.ReactElement;
   RightIcon: React.ReactElement;
+  iconSize?: number;
+  borderColor?: BorderColor;
 };
 
 export function IconPair(props: Props) {
   return (
-    <Container>
-      <LeftIconContainer>{props.LeftIcon}</LeftIconContainer>
-      <RightIconContainer>{props.RightIcon}</RightIconContainer>
+    <Container borderColor={props.borderColor}>
+      <LeftIconContainer iconSize={props.iconSize}>
+        {props.LeftIcon}
+      </LeftIconContainer>
+      <RightIconContainer iconSize={props.iconSize}>
+        {props.RightIcon}
+      </RightIconContainer>
     </Container>
   );
 }
 
-const Container = styled.div`
+const Container = styled.div<{ borderColor?: BorderColor }>`
   position: relative;
 
   img,
   svg {
-    border: 2px solid #2d2e33ff;
+    border: 2px solid ${({ borderColor }) => COLORS[borderColor || "black-800"]};
     border-radius: 50%;
   }
 `;
 
-const LeftIconContainer = styled.div`
-  height: 32px;
-  width: 32px;
+const LeftIconContainer = styled.div<{ iconSize?: number }>`
+  height: ${({ iconSize = 32 }) => iconSize}px;
+  width: ${({ iconSize = 32 }) => iconSize}px;
+
+  img {
+    height: ${({ iconSize = 32 }) => iconSize}px;
+    width: ${({ iconSize = 32 }) => iconSize}px;
+  }
 `;
 
-const RightIconContainer = styled.div`
+const RightIconContainer = styled.div<{ iconSize?: number }>`
   position: absolute;
-  right: -18px;
+  right: -${({ iconSize = 32 }) => iconSize / 1.75}px;
   bottom: 0px;
-  height: 32px;
-  width: 32px;
+  height: ${({ iconSize = 32 }) => iconSize}px;
+  width: ${({ iconSize = 32 }) => iconSize}px;
+
+  img {
+    height: ${({ iconSize = 32 }) => iconSize}px;
+    width: ${({ iconSize = 32 }) => iconSize}px;
+  }
 `;
diff --git a/src/components/Tooltip/Tooltip.styles.tsx b/src/components/Tooltip/Tooltip.styles.tsx
index d07479434..b0ffb0e84 100644
--- a/src/components/Tooltip/Tooltip.styles.tsx
+++ b/src/components/Tooltip/Tooltip.styles.tsx
@@ -14,9 +14,9 @@ export const StyledTooltip = styled(Tooltip)`
   border-radius: 50%;
 `;
 
-export const Wrapper = styled.div`
+export const Wrapper = styled.div<{ maxWidth?: number }>`
   padding: 16px;
-  max-width: 320px;
+  max-width: ${({ maxWidth = 320 }) => maxWidth}px;
   background: #202024;
   border: 1px solid #34353b;
   box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.32);
diff --git a/src/components/Tooltip/Tooltip.tsx b/src/components/Tooltip/Tooltip.tsx
index c1b51c371..9639fd591 100644
--- a/src/components/Tooltip/Tooltip.tsx
+++ b/src/components/Tooltip/Tooltip.tsx
@@ -1,5 +1,5 @@
 /* eslint-disable jsx-a11y/anchor-is-valid */
-import React from "react";
+import React, { ReactNode } from "react";
 import { PlacesType } from "react-tooltip";
 import {
   Wrapper,
@@ -16,20 +16,26 @@ import { ReactComponent as ReferrerIcon } from "assets/icons/referrer.svg";
 import { ReactComponent as SelfReferralIcon } from "assets/icons/self-referral.svg";
 import { ReactComponent as ClockIcon } from "assets/icons/clock.svg";
 
-export type TooltipIcon =
-  | "green-checkmark"
-  | "grey-checkmark"
-  | "referee"
-  | "referral"
-  | "self-referral"
-  | "clock";
+const iconMap = {
+  "green-checkmark": <RoundedCheckmark16 />,
+  "grey-checkmark": <GreyRoundedCheckmark16 />,
+  "self-referral": <SelfReferralIcon />,
+  referral: <ReferrerIcon />,
+  referee: <RefereeIcon />,
+  clock: <ClockIcon />,
+};
+
+export type TooltipIcon = keyof typeof iconMap;
+
 export interface TooltipProps {
   tooltipId?: string;
-  icon?: TooltipIcon;
+  icon?: TooltipIcon | ReactNode;
   title?: string;
   titleSecondary?: string;
   body: string | JSX.Element;
   placement?: PlacesType;
+  maxWidth?: number;
+  offset?: number;
 }
 
 export const Tooltip: React.FC<TooltipProps> = ({
@@ -40,26 +46,25 @@ export const Tooltip: React.FC<TooltipProps> = ({
   icon,
   placement,
   titleSecondary,
+  maxWidth,
+  offset,
 }) => {
   const id = tooltipId || title;
 
   if (!children) return null;
 
+  const iconElement = iconMap[icon as TooltipIcon] || icon;
+
   return (
     <>
       <StyledAnchor data-tooltip-id={id} data-tooltip-place={placement}>
         {children}
       </StyledAnchor>
-      <StyledTooltip id={id} noArrow opacity={1}>
-        <Wrapper>
+      <StyledTooltip id={id} noArrow opacity={1} offset={offset}>
+        <Wrapper maxWidth={maxWidth}>
           {title && (
             <TitleRow>
-              {icon === "green-checkmark" && <RoundedCheckmark16 />}
-              {icon === "grey-checkmark" && <GreyRoundedCheckmark16 />}
-              {icon === "self-referral" && <SelfReferralIcon />}
-              {icon === "referral" && <ReferrerIcon />}
-              {icon === "referee" && <RefereeIcon />}
-              {icon === "clock" && <ClockIcon />}
+              {iconElement}
               {title}
               {titleSecondary && (
                 <TitleSecondary>{titleSecondary}</TitleSecondary>
diff --git a/src/hooks/useDeposits.ts b/src/hooks/useDeposits.ts
index feeebedd5..db0fae2c7 100644
--- a/src/hooks/useDeposits.ts
+++ b/src/hooks/useDeposits.ts
@@ -36,6 +36,13 @@ export type Deposit = {
   depositRelayerFeePct: string;
   initialRelayerFeePct?: string;
   suggestedRelayerFeePct?: string;
+  fillTime?: number;
+  rewards?: {
+    type: "referrals" | "op-rebates";
+    rate: number;
+    amount: string;
+    usd: string;
+  };
   feeBreakdown?: {
     bridgeFee: {
       pct: string;
diff --git a/src/views/DepositStatus/hooks/useElapsedSeconds.ts b/src/hooks/useElapsedSeconds.ts
similarity index 100%
rename from src/views/DepositStatus/hooks/useElapsedSeconds.ts
rename to src/hooks/useElapsedSeconds.ts
diff --git a/src/stories/DepositsTable.stories.tsx b/src/stories/DepositsTable.stories.tsx
new file mode 100644
index 000000000..7f6c9c840
--- /dev/null
+++ b/src/stories/DepositsTable.stories.tsx
@@ -0,0 +1,132 @@
+import type { Meta, StoryObj } from "@storybook/react";
+
+import { DepositsTable } from "../components/DepositsTable";
+import { Deposit } from "../hooks/useDeposits";
+
+const deposits: Deposit[] = [
+  {
+    depositId: 1180880,
+    depositTime: 1698275877,
+    status: "pending",
+    filled: "0",
+    sourceChainId: 324,
+    destinationChainId: 42161,
+    assetAddr: "0x5AEa5775959fBC2557Cc8789bC1bf90A239D9a91",
+    depositorAddr: "0x9A8f92a830A5cB89a3816e3D267CB7791c16b04D",
+    recipientAddr: "0xe35e9842fceaCA96570B734083f4a58e8F7C5f2A",
+    message: "0x",
+    amount: "50000000000000000",
+    depositTxHash:
+      "0x13a619b510e643d51f74f5a01f98c16161e1d93c2db6f689478472a3f42ec7e0",
+    fillTxs: [],
+    speedUps: [],
+    depositRelayerFeePct: "4952678372124980",
+    initialRelayerFeePct: "4952678372124980",
+    suggestedRelayerFeePct: "4952678372124980",
+  },
+  // Fee too low, i.e. unprofitable
+  {
+    depositId: 1144678,
+    depositTime: 1696447947,
+    status: "pending",
+    filled: "0",
+    sourceChainId: 42161,
+    destinationChainId: 324,
+    assetAddr: "0xFF970A61A04b1cA14834A43f5dE4533eBDDB5CC8",
+    depositorAddr: "0x9A8f92a830A5cB89a3816e3D267CB7791c16b04D",
+    recipientAddr: "0x9A8f92a830A5cB89a3816e3D267CB7791c16b04D",
+    message: "0x",
+    amount: "2000000000000000000000",
+    depositTxHash:
+      "0x66a7c4e34f91325d0c17bc7bb98350e15c61166d6138a0e89e002637b36fe3e5",
+    fillTxs: [],
+    speedUps: [],
+    depositRelayerFeePct: "0",
+    initialRelayerFeePct: "0",
+    suggestedRelayerFeePct: "156172500000000000",
+  },
+  // Finalized with fill time
+  {
+    depositId: 1205910,
+    depositTime: 1698998623,
+    fillTime: 1698998623 + 99,
+    status: "filled",
+    filled: "12000000",
+    sourceChainId: 324,
+    destinationChainId: 8453,
+    assetAddr: "0x3355df6D4c9C3035724Fd0e3914dE96A5a83aaf4",
+    depositorAddr: "0x9A8f92a830A5cB89a3816e3D267CB7791c16b04D",
+    recipientAddr: "0x9A8f92a830A5cB89a3816e3D267CB7791c16b04D",
+    message: "0x",
+    amount: "12000000",
+    depositTxHash:
+      "0xe8a2d8ed449a6a2fe7fa3dc24e699a951f945280c27df259a910008683b1e296",
+    fillTxs: [
+      "0x8caf6a0e38a8788f47dfad89e709f1c0854783987558af9c34d0fadb61c20941",
+    ],
+    speedUps: [],
+    depositRelayerFeePct: "24394417866666666",
+    initialRelayerFeePct: "24394417866666666",
+    suggestedRelayerFeePct: "28289667866666666",
+  },
+  // Finalized without fill time
+  {
+    depositId: 1199308,
+    depositTime: 1698831959,
+    status: "filled",
+    filled: "12000000",
+    sourceChainId: 42161,
+    destinationChainId: 8453,
+    assetAddr: "0xFF970A61A04b1cA14834A43f5dE4533eBDDB5CC8",
+    depositorAddr: "0x9A8f92a830A5cB89a3816e3D267CB7791c16b04D",
+    recipientAddr: "0x9A8f92a830A5cB89a3816e3D267CB7791c16b04D",
+    message: "0x",
+    amount: "12000000",
+    depositTxHash:
+      "0x4eecaeee9b6d2df9d06d249b99ce042dd16dbf7bf2fd5d0cc6938e336fdaadd3",
+    fillTxs: [
+      "0xb88ad8d998f0b453c351b0415475e197847e73911bcfb41cab2ee9b0ceb4806a",
+      "0xb88ad8d998f0b453c351b0415475e197847e73911bcfb41cab2ee9b0ceb4806b",
+      "0xb88ad8d998f0b453c351b0415475e197847e73911bcfb41cab2ee9b0ceb4806c",
+    ],
+    speedUps: [],
+    depositRelayerFeePct: "28434751200000000",
+    initialRelayerFeePct: "28434751200000000",
+    suggestedRelayerFeePct: "28443917866666666",
+    feeBreakdown: {
+      bridgeFee: {
+        pct: "28434751200000000",
+        usd: "341217014400000000",
+      },
+      destinationGasFee: {
+        pct: "28434751200000000",
+        usd: "341217014400000000",
+      },
+    },
+    rewards: {
+      type: "referrals",
+      rate: 0.4,
+      amount: "341217014400000000",
+      usd: "341217014400000000",
+    },
+  },
+];
+
+const meta: Meta<typeof DepositsTable> = {
+  component: DepositsTable,
+  argTypes: {
+    disabledColumns: {
+      control: {
+        type: "select",
+      },
+    },
+  },
+};
+
+export default meta;
+
+type Story = StoryObj<typeof DepositsTable>;
+
+export const Default: Story = {
+  render: (args) => <DepositsTable {...args} deposits={deposits} />,
+};
diff --git a/src/stories/Introduction.stories.mdx b/src/stories/Introduction.stories.mdx
deleted file mode 100644
index edc33ed69..000000000
--- a/src/stories/Introduction.stories.mdx
+++ /dev/null
@@ -1,211 +0,0 @@
-import { Meta } from '@storybook/addon-docs';
-import Code from './assets/code-brackets.svg';
-import Colors from './assets/colors.svg';
-import Comments from './assets/comments.svg';
-import Direction from './assets/direction.svg';
-import Flow from './assets/flow.svg';
-import Plugin from './assets/plugin.svg';
-import Repo from './assets/repo.svg';
-import StackAlt from './assets/stackalt.svg';
-
-<Meta title="Example/Introduction" />
-
-<style>
-  {`
-    .subheading {
-      --mediumdark: '#999999';
-      font-weight: 900;
-      font-size: 13px;
-      color: #999;
-      letter-spacing: 6px;
-      line-height: 24px;
-      text-transform: uppercase;
-      margin-bottom: 12px;
-      margin-top: 40px;
-    }
-
-    .link-list {
-      display: grid;
-      grid-template-columns: 1fr;
-      grid-template-rows: 1fr 1fr;
-      row-gap: 10px;
-    }
-
-    @media (min-width: 620px) {
-      .link-list {
-        row-gap: 20px;
-        column-gap: 20px;
-        grid-template-columns: 1fr 1fr;
-      }
-    }
-
-    @media all and (-ms-high-contrast:none) {
-    .link-list {
-        display: -ms-grid;
-        -ms-grid-columns: 1fr 1fr;
-        -ms-grid-rows: 1fr 1fr;
-      }
-    }
-
-    .link-item {
-      display: block;
-      padding: 20px 30px 20px 15px;
-      border: 1px solid #00000010;
-      border-radius: 5px;
-      transition: background 150ms ease-out, border 150ms ease-out, transform 150ms ease-out;
-      color: #333333;
-      display: flex;
-      align-items: flex-start;
-    }
-
-    .link-item:hover {
-      border-color: #1EA7FD50;
-      transform: translate3d(0, -3px, 0);
-      box-shadow: rgba(0, 0, 0, 0.08) 0 3px 10px 0;
-    }
-
-    .link-item:active {
-      border-color: #1EA7FD;
-      transform: translate3d(0, 0, 0);
-    }
-
-    .link-item strong {
-      font-weight: 700;
-      display: block;
-      margin-bottom: 2px;
-    }
-
-    .link-item img {
-      height: 40px;
-      width: 40px;
-      margin-right: 15px;
-      flex: none;
-    }
-
-    .link-item span {
-      font-size: 14px;
-      line-height: 20px;
-    }
-
-    .tip {
-      display: inline-block;
-      border-radius: 1em;
-      font-size: 11px;
-      line-height: 12px;
-      font-weight: 700;
-      background: #E7FDD8;
-      color: #66BF3C;
-      padding: 4px 12px;
-      margin-right: 10px;
-      vertical-align: top;
-    }
-
-    .tip-wrapper {
-      font-size: 13px;
-      line-height: 20px;
-      margin-top: 40px;
-      margin-bottom: 40px;
-    }
-
-    .tip-wrapper code {
-      font-size: 12px;
-      display: inline-block;
-    }
-  `}
-</style>
-
-# Welcome to Storybook
-
-Storybook helps you build UI components in isolation from your app's business logic, data, and context.
-That makes it easy to develop hard-to-reach states. Save these UI states as **stories** to revisit during development, testing, or QA.
-
-Browse example stories now by navigating to them in the sidebar.
-View their code in the `stories` directory to learn how they work.
-We recommend building UIs with a [**component-driven**](https://componentdriven.org) process starting with atomic components and ending with pages.
-
-<div className="subheading">Configure</div>
-
-<div className="link-list">
-  <a
-    className="link-item"
-    href="https://storybook.js.org/docs/react/addons/addon-types"
-    target="_blank"
-  >
-    <img src={Plugin} alt="plugin" />
-    <span>
-      <strong>Presets for popular tools</strong>
-      Easy setup for TypeScript, SCSS and more.
-    </span>
-  </a>
-  <a
-    className="link-item"
-    href="https://storybook.js.org/docs/react/configure/webpack"
-    target="_blank"
-  >
-    <img src={StackAlt} alt="Build" />
-    <span>
-      <strong>Build configuration</strong>
-      How to customize webpack and Babel
-    </span>
-  </a>
-  <a
-    className="link-item"
-    href="https://storybook.js.org/docs/react/configure/styling-and-css"
-    target="_blank"
-  >
-    <img src={Colors} alt="colors" />
-    <span>
-      <strong>Styling</strong>
-      How to load and configure CSS libraries
-    </span>
-  </a>
-  <a
-    className="link-item"
-    href="https://storybook.js.org/docs/react/get-started/setup#configure-storybook-for-your-stack"
-    target="_blank"
-  >
-    <img src={Flow} alt="flow" />
-    <span>
-      <strong>Data</strong>
-      Providers and mocking for data libraries
-    </span>
-  </a>
-</div>
-
-<div className="subheading">Learn</div>
-
-<div className="link-list">
-  <a className="link-item" href="https://storybook.js.org/docs" target="_blank">
-    <img src={Repo} alt="repo" />
-    <span>
-      <strong>Storybook documentation</strong>
-      Configure, customize, and extend
-    </span>
-  </a>
-  <a className="link-item" href="https://storybook.js.org/tutorials/" target="_blank">
-    <img src={Direction} alt="direction" />
-    <span>
-      <strong>In-depth guides</strong>
-      Best practices from leading teams
-    </span>
-  </a>
-  <a className="link-item" href="https://github.com/storybookjs/storybook" target="_blank">
-    <img src={Code} alt="code" />
-    <span>
-      <strong>GitHub project</strong>
-      View the source and add issues
-    </span>
-  </a>
-  <a className="link-item" href="https://discord.gg/storybook" target="_blank">
-    <img src={Comments} alt="comments" />
-    <span>
-      <strong>Discord chat</strong>
-      Chat with maintainers and the community
-    </span>
-  </a>
-</div>
-
-<div className="tip-wrapper">
-  <span className="tip">Tip</span>Edit the Markdown in{' '}
-  <code>stories/Introduction.stories.mdx</code>
-</div>
diff --git a/src/utils/config.ts b/src/utils/config.ts
index 370027e93..3f5a7b932 100644
--- a/src/utils/config.ts
+++ b/src/utils/config.ts
@@ -345,6 +345,16 @@ export class ConfigClient {
     );
     return token;
   }
+  getTokenInfoByAddressSafe(
+    chainId: number,
+    address: string
+  ): Token | undefined {
+    try {
+      return this.getTokenInfoByAddress(chainId, address);
+    } catch (error) {
+      return undefined;
+    }
+  }
   getTokenInfoBySymbol(chainId: number, symbol: string): Token {
     const tokens = this.getTokenList(chainId);
     return this._getTokenInfoBySymbol(chainId, symbol, tokens);
diff --git a/src/views/Bridge/hooks/useBridgeAction.ts b/src/views/Bridge/hooks/useBridgeAction.ts
index 0b8c66257..7f246bf57 100644
--- a/src/views/Bridge/hooks/useBridgeAction.ts
+++ b/src/views/Bridge/hooks/useBridgeAction.ts
@@ -107,6 +107,7 @@ export function useBridgeAction(
       originChainId: String(frozenPayload.fromChain),
       destinationChainId: String(frozenPayload.toChain),
       bridgeTokenSymbol: tokenSymbol,
+      referrer,
     }).toString();
     history.push(
       `/bridge/${tx.hash}?${statusPageSearchParams}`,
diff --git a/src/views/DepositStatus/components/DepositStatusUpperCard.tsx b/src/views/DepositStatus/components/DepositStatusUpperCard.tsx
index 80d28a89c..0493db7db 100644
--- a/src/views/DepositStatus/components/DepositStatusUpperCard.tsx
+++ b/src/views/DepositStatus/components/DepositStatusUpperCard.tsx
@@ -15,8 +15,8 @@ import { ReactComponent as BaseGrayscaleLogo } from "assets/grayscale-logos/base
 import { Text, Badge } from "components";
 
 import { ChainId, QUERIESV2, COLORS, NoFundsDepositedLogError } from "utils";
+import { useElapsedSeconds } from "hooks/useElapsedSeconds";
 
-import { useElapsedSeconds } from "../hooks/useElapsedSeconds";
 import { useDepositTracking } from "../hooks/useDepositTracking";
 import { DepositTimesCard } from "./DepositTimesCard";
 import { ElapsedTime } from "./ElapsedTime";
diff --git a/yarn.lock b/yarn.lock
index 32ac97031..d2a77071f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6134,6 +6134,32 @@
     "@radix-ui/react-use-callback-ref" "1.0.1"
     "@radix-ui/react-use-escape-keydown" "1.0.3"
 
+"@radix-ui/react-dismissable-layer@1.0.5":
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.0.5.tgz#3f98425b82b9068dfbab5db5fff3df6ebf48b9d4"
+  integrity sha512-aJeDjQhywg9LBu2t/At58hCvr7pEm0o2Ke1x33B+MhjNmmZ17sy4KImo0KPLgsnc/zN7GPdce8Cnn0SWvwZO7g==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/primitive" "1.0.1"
+    "@radix-ui/react-compose-refs" "1.0.1"
+    "@radix-ui/react-primitive" "1.0.3"
+    "@radix-ui/react-use-callback-ref" "1.0.1"
+    "@radix-ui/react-use-escape-keydown" "1.0.3"
+
+"@radix-ui/react-dropdown-menu@^2.0.6":
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-dropdown-menu/-/react-dropdown-menu-2.0.6.tgz#cdf13c956c5e263afe4e5f3587b3071a25755b63"
+  integrity sha512-i6TuFOoWmLWq+M/eCLGd/bQ2HfAX1RJgvrBQ6AQLmzfvsLdefxbWu8G9zczcPFfcSPehz9GcpF6K9QYreFV8hA==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/primitive" "1.0.1"
+    "@radix-ui/react-compose-refs" "1.0.1"
+    "@radix-ui/react-context" "1.0.1"
+    "@radix-ui/react-id" "1.0.1"
+    "@radix-ui/react-menu" "2.0.6"
+    "@radix-ui/react-primitive" "1.0.3"
+    "@radix-ui/react-use-controllable-state" "1.0.1"
+
 "@radix-ui/react-focus-guards@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-guards/-/react-focus-guards-1.0.1.tgz#1ea7e32092216b946397866199d892f71f7f98ad"
@@ -6151,6 +6177,16 @@
     "@radix-ui/react-primitive" "1.0.3"
     "@radix-ui/react-use-callback-ref" "1.0.1"
 
+"@radix-ui/react-focus-scope@1.0.4":
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-scope/-/react-focus-scope-1.0.4.tgz#2ac45fce8c5bb33eb18419cdc1905ef4f1906525"
+  integrity sha512-sL04Mgvf+FmyvZeYfNu1EPAaaxD+aw7cYeIB9L9Fvq8+urhltTRaEo5ysKOpHuKPclsZcSUMKlN05x4u+CINpA==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-compose-refs" "1.0.1"
+    "@radix-ui/react-primitive" "1.0.3"
+    "@radix-ui/react-use-callback-ref" "1.0.1"
+
 "@radix-ui/react-id@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-id/-/react-id-1.0.1.tgz#73cdc181f650e4df24f0b6a5b7aa426b912c88c0"
@@ -6159,6 +6195,31 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-use-layout-effect" "1.0.1"
 
+"@radix-ui/react-menu@2.0.6":
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-menu/-/react-menu-2.0.6.tgz#2c9e093c1a5d5daa87304b2a2f884e32288ae79e"
+  integrity sha512-BVkFLS+bUC8HcImkRKPSiVumA1VPOOEC5WBMiT+QAVsPzW1FJzI9KnqgGxVDPBcql5xXrHkD3JOVoXWEXD8SYA==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/primitive" "1.0.1"
+    "@radix-ui/react-collection" "1.0.3"
+    "@radix-ui/react-compose-refs" "1.0.1"
+    "@radix-ui/react-context" "1.0.1"
+    "@radix-ui/react-direction" "1.0.1"
+    "@radix-ui/react-dismissable-layer" "1.0.5"
+    "@radix-ui/react-focus-guards" "1.0.1"
+    "@radix-ui/react-focus-scope" "1.0.4"
+    "@radix-ui/react-id" "1.0.1"
+    "@radix-ui/react-popper" "1.1.3"
+    "@radix-ui/react-portal" "1.0.4"
+    "@radix-ui/react-presence" "1.0.1"
+    "@radix-ui/react-primitive" "1.0.3"
+    "@radix-ui/react-roving-focus" "1.0.4"
+    "@radix-ui/react-slot" "1.0.2"
+    "@radix-ui/react-use-callback-ref" "1.0.1"
+    aria-hidden "^1.1.1"
+    react-remove-scroll "2.5.5"
+
 "@radix-ui/react-popper@1.1.2":
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-popper/-/react-popper-1.1.2.tgz#4c0b96fcd188dc1f334e02dba2d538973ad842e9"
@@ -6176,6 +6237,23 @@
     "@radix-ui/react-use-size" "1.0.1"
     "@radix-ui/rect" "1.0.1"
 
+"@radix-ui/react-popper@1.1.3":
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-popper/-/react-popper-1.1.3.tgz#24c03f527e7ac348fabf18c89795d85d21b00b42"
+  integrity sha512-cKpopj/5RHZWjrbF2846jBNacjQVwkP068DfmgrNJXpvVWrOvlAmE9xSiy5OqeE+Gi8D9fP+oDhUnPqNMY8/5w==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@floating-ui/react-dom" "^2.0.0"
+    "@radix-ui/react-arrow" "1.0.3"
+    "@radix-ui/react-compose-refs" "1.0.1"
+    "@radix-ui/react-context" "1.0.1"
+    "@radix-ui/react-primitive" "1.0.3"
+    "@radix-ui/react-use-callback-ref" "1.0.1"
+    "@radix-ui/react-use-layout-effect" "1.0.1"
+    "@radix-ui/react-use-rect" "1.0.1"
+    "@radix-ui/react-use-size" "1.0.1"
+    "@radix-ui/rect" "1.0.1"
+
 "@radix-ui/react-portal@1.0.3":
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-portal/-/react-portal-1.0.3.tgz#ffb961244c8ed1b46f039e6c215a6c4d9989bda1"
@@ -6184,6 +6262,23 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-primitive" "1.0.3"
 
+"@radix-ui/react-portal@1.0.4":
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-portal/-/react-portal-1.0.4.tgz#df4bfd353db3b1e84e639e9c63a5f2565fb00e15"
+  integrity sha512-Qki+C/EuGUVCQTOTD5vzJzJuMUlewbzuKyUy+/iHM2uwGiru9gZeBJtHAPKAEkB5KWGi9mP/CHKcY0wt1aW45Q==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-primitive" "1.0.3"
+
+"@radix-ui/react-presence@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-presence/-/react-presence-1.0.1.tgz#491990ba913b8e2a5db1b06b203cb24b5cdef9ba"
+  integrity sha512-UXLW4UAbIY5ZjcvzjfRFo5gxva8QirC9hF7wRE4U5gz+TP0DbRk+//qyuAQ1McDxBt1xNMBTaciFGvEmJvAZCg==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-compose-refs" "1.0.1"
+    "@radix-ui/react-use-layout-effect" "1.0.1"
+
 "@radix-ui/react-primitive@1.0.3":
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-1.0.3.tgz#d49ea0f3f0b2fe3ab1cb5667eb03e8b843b914d0"
@@ -6922,19 +7017,19 @@
     "@stablelib/random" "^1.0.2"
     "@stablelib/wipe" "^1.0.1"
 
-"@storybook/addon-actions@7.5.1", "@storybook/addon-actions@^7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-7.5.1.tgz#5d3591f0c63e16cca90a5faddaf05169dbf64f94"
-  integrity sha512-GieD3ru6EslKvwol1cE4lvszQCLB/AkQdnLofnqy1nnYso+hRxmPAw9/O+pWfpUBFdjXsQ7GX09+wEUpOJzepw==
+"@storybook/addon-actions@7.5.3", "@storybook/addon-actions@^7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-7.5.3.tgz#e0d0d819488d1d19918b23469b3ea6610fee5f07"
+  integrity sha512-v3yL6Eq/jCiXfA24JjRdbEQUuorms6tmrywaKcd1tAy4Ftgof0KHB4tTcTyiajrI5bh6PVJoRBkE8IDqmNAHkA==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/components" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/components" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/global" "^5.0.0"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/theming" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/theming" "7.5.3"
+    "@storybook/types" "7.5.3"
     dequal "^2.0.2"
     lodash "^4.17.21"
     polished "^4.2.2"
@@ -6944,141 +7039,141 @@
     ts-dedent "^2.0.0"
     uuid "^9.0.0"
 
-"@storybook/addon-backgrounds@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-backgrounds/-/addon-backgrounds-7.5.1.tgz#0af99c6217e8e406103b4f1f469c05adf41f1257"
-  integrity sha512-XZoyJw/WoUlVvQHPTbSAZjKy2SEUjaSmAWgcRync25vp+q0obthjx6UnZHEUuH8Ud07HA3FYzlFtMicH5y/OIQ==
+"@storybook/addon-backgrounds@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-backgrounds/-/addon-backgrounds-7.5.3.tgz#a6aa9df791220cff6290e7f93e04c546063f5407"
+  integrity sha512-UCOVd4UNIL5FRiwi9nyiWFocn/7ewwS6bIWnq66AaHg/sv92YwsPmgQJn0DMBGDOvUAWpiHdVsZNOTX6nvw4gA==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/components" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/components" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/global" "^5.0.0"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/theming" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/theming" "7.5.3"
+    "@storybook/types" "7.5.3"
     memoizerific "^1.11.3"
     ts-dedent "^2.0.0"
 
-"@storybook/addon-controls@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-controls/-/addon-controls-7.5.1.tgz#606443cf792d98e8b2d61c94e5ffb359b253c119"
-  integrity sha512-Xag1e7TZo04LjUenfobkShpKMxTtwa4xM4bXQA8LjaAGZQ7jipbQ4PE73a17K59S2vqq89VAhkuMJWiyaOFqpw==
-  dependencies:
-    "@storybook/blocks" "7.5.1"
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/components" "7.5.1"
-    "@storybook/core-common" "7.5.1"
-    "@storybook/core-events" "7.5.1"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/node-logger" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/theming" "7.5.1"
-    "@storybook/types" "7.5.1"
+"@storybook/addon-controls@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-controls/-/addon-controls-7.5.3.tgz#03ce5a31603b360fe906cefb3fe4945ef7188e62"
+  integrity sha512-KEuU4X5Xr6cJI9xrzOUVGEmUf1iHPfK7cj0GACKv0GElsdIsQryv+OZ7gRnvmNax/e2hm2t9cJcFxB24/p6rVg==
+  dependencies:
+    "@storybook/blocks" "7.5.3"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/components" "7.5.3"
+    "@storybook/core-common" "7.5.3"
+    "@storybook/core-events" "7.5.3"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/node-logger" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/theming" "7.5.3"
+    "@storybook/types" "7.5.3"
     lodash "^4.17.21"
     ts-dedent "^2.0.0"
 
-"@storybook/addon-docs@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-docs/-/addon-docs-7.5.1.tgz#e62765c96ff3d2d97414b69973842fbe93ba9e00"
-  integrity sha512-+wE67oWIhGK9+kv2sxoY2KDXm3v62RfEgxiksdhtffTP/joOK3p88S0lO+8g0G4xfNGUnBhPtzGMuUxWwaH2Pw==
+"@storybook/addon-docs@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-docs/-/addon-docs-7.5.3.tgz#36c28c9a54b28e3b4b1450e821d65e07be6da45b"
+  integrity sha512-JVQ6iCXKESij/SbE4Wq47dkSSgBRulvA8SUf8NWL5m9qpiHrg0lPSERHfoTLiB5uC/JwF0OKIlhxoWl+zCmtYg==
   dependencies:
     "@jest/transform" "^29.3.1"
     "@mdx-js/react" "^2.1.5"
-    "@storybook/blocks" "7.5.1"
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/components" "7.5.1"
-    "@storybook/csf-plugin" "7.5.1"
-    "@storybook/csf-tools" "7.5.1"
+    "@storybook/blocks" "7.5.3"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/components" "7.5.3"
+    "@storybook/csf-plugin" "7.5.3"
+    "@storybook/csf-tools" "7.5.3"
     "@storybook/global" "^5.0.0"
     "@storybook/mdx2-csf" "^1.0.0"
-    "@storybook/node-logger" "7.5.1"
-    "@storybook/postinstall" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/react-dom-shim" "7.5.1"
-    "@storybook/theming" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/node-logger" "7.5.3"
+    "@storybook/postinstall" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/react-dom-shim" "7.5.3"
+    "@storybook/theming" "7.5.3"
+    "@storybook/types" "7.5.3"
     fs-extra "^11.1.0"
     remark-external-links "^8.0.0"
     remark-slug "^6.0.0"
     ts-dedent "^2.0.0"
 
-"@storybook/addon-essentials@^7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-essentials/-/addon-essentials-7.5.1.tgz#41bef1d405e5f9797cd5b5fbc7c60f7f48de194a"
-  integrity sha512-/jaUZXV+mE/2G5PgEpFKm4lFEHluWn6GFR/pg+hphvHOzBGA3Y75JMgUfJ5CDYHB1dAVSf9JrPOd8Eb1tpESfA==
-  dependencies:
-    "@storybook/addon-actions" "7.5.1"
-    "@storybook/addon-backgrounds" "7.5.1"
-    "@storybook/addon-controls" "7.5.1"
-    "@storybook/addon-docs" "7.5.1"
-    "@storybook/addon-highlight" "7.5.1"
-    "@storybook/addon-measure" "7.5.1"
-    "@storybook/addon-outline" "7.5.1"
-    "@storybook/addon-toolbars" "7.5.1"
-    "@storybook/addon-viewport" "7.5.1"
-    "@storybook/core-common" "7.5.1"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/node-logger" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
+"@storybook/addon-essentials@^7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-essentials/-/addon-essentials-7.5.3.tgz#e6e3ea266181b42e15b4c57fc303adc238c102a4"
+  integrity sha512-PYj6swEI4nEzIbOTyHJB8u3K8ABYKoaW8XB5emMwsnrzB/TN7auHVhze2bQ/+ax5wyPKZpArPjxbWlSHtSws+A==
+  dependencies:
+    "@storybook/addon-actions" "7.5.3"
+    "@storybook/addon-backgrounds" "7.5.3"
+    "@storybook/addon-controls" "7.5.3"
+    "@storybook/addon-docs" "7.5.3"
+    "@storybook/addon-highlight" "7.5.3"
+    "@storybook/addon-measure" "7.5.3"
+    "@storybook/addon-outline" "7.5.3"
+    "@storybook/addon-toolbars" "7.5.3"
+    "@storybook/addon-viewport" "7.5.3"
+    "@storybook/core-common" "7.5.3"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/node-logger" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
     ts-dedent "^2.0.0"
 
-"@storybook/addon-highlight@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-highlight/-/addon-highlight-7.5.1.tgz#575152b8e54464ef6a29f5f58c19c14bfd45730c"
-  integrity sha512-js9OV17kpjRowuaGAPfI9aOn/zzt8P589ACZE+/eYBO9jT65CADwAUxg//Uq0/he+Ac9495pcK3BcYyDeym7/g==
+"@storybook/addon-highlight@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-highlight/-/addon-highlight-7.5.3.tgz#ff1041aa1e9d76100ce6fb0b11e0d30078f858f7"
+  integrity sha512-jb+aNRhj+tFK7EqqTlNCjGkTrkWqWHGdD1ubgnj29v8XhRuCR9YboPS+306KYwBEkuF4kNCHZofLiEBPf6nCJg==
   dependencies:
-    "@storybook/core-events" "7.5.1"
+    "@storybook/core-events" "7.5.3"
     "@storybook/global" "^5.0.0"
-    "@storybook/preview-api" "7.5.1"
+    "@storybook/preview-api" "7.5.3"
 
-"@storybook/addon-interactions@^7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-interactions/-/addon-interactions-7.5.1.tgz#09436839f80b6ac5a961708b7c0501b0d5476019"
-  integrity sha512-m9yohFYil+UBwYKFxHYdsAsn8PBCPl6HY/FSgfrDc5PiqT1Ya7paXopimyy9ok+VQt/RC8sEWIm809ONEoxosw==
+"@storybook/addon-interactions@^7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-interactions/-/addon-interactions-7.5.3.tgz#5aef96b3fa24aaafb88c0fc501f6a7e8cfa2a342"
+  integrity sha512-gD3cU8sYSM/mdbA9ooYIb4c689JkDsJbZ17vfYJ5RjNkSmqKehybdpZOfkj27sVIyFtmscSi75t+pzK4Pv4rZw==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/components" "7.5.1"
-    "@storybook/core-common" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/components" "7.5.3"
+    "@storybook/core-common" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/global" "^5.0.0"
-    "@storybook/instrumenter" "7.5.1"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/theming" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/instrumenter" "7.5.3"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/theming" "7.5.3"
+    "@storybook/types" "7.5.3"
     jest-mock "^27.0.6"
     polished "^4.2.2"
     ts-dedent "^2.2.0"
 
-"@storybook/addon-links@^7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-links/-/addon-links-7.5.1.tgz#18404cc71d3ceaf5f9e2ce4501a275be11bf6eaa"
-  integrity sha512-KDiQYAVNXxuVTB3QLFZxHlfT8q4KnlNKY+0OODvgD5o1FqFpIyUiR5mIBL4SZMRj2EtwrR3KmZ2UPccFZdu9vw==
+"@storybook/addon-links@^7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-links/-/addon-links-7.5.3.tgz#4ed55c932db0b25197a16c30723307f6d20d7141"
+  integrity sha512-NcigW0HX8AllZ/KJ4u1KMiK30QvjqtC+zApI6Yc3tTaa6+BldbLv06fEgHgMY0yC8R+Ly9mUN7S1HiU7LQ7Qxg==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/csf" "^0.1.0"
     "@storybook/global" "^5.0.0"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/router" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/router" "7.5.3"
+    "@storybook/types" "7.5.3"
     prop-types "^15.7.2"
     ts-dedent "^2.0.0"
 
-"@storybook/addon-measure@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-measure/-/addon-measure-7.5.1.tgz#bc8d2beedc9f6a1170cd90a013012b89d0971aa5"
-  integrity sha512-yR6oELJe0UHYxRijd1YMuGaQRlZ3uABjmrXaFCPnd6agahgTwIJLiK4XamtkVur//LaiJMvtmM2XXrkJ1BvNJw==
+"@storybook/addon-measure@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-measure/-/addon-measure-7.5.3.tgz#9cfc34d88807afba6bc36990aef26be8ca8f8567"
+  integrity sha512-fun9BqUTGXgcMpcbX9wUowGDkjCL8oKasZbjp/MvGM3vPTM6HQdwzHTLJGPBnmJ1xK92NhwFRs0BrQX6uF1yrg==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/components" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/components" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/global" "^5.0.0"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/types" "7.5.3"
     tiny-invariant "^1.3.1"
 
 "@storybook/addon-onboarding@^1.0.8":
@@ -7089,62 +7184,62 @@
     "@storybook/telemetry" "^7.1.0-alpha.32"
     react-confetti "^6.1.0"
 
-"@storybook/addon-outline@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-outline/-/addon-outline-7.5.1.tgz#f0681fb26ab4811a0351ef360478a04dc1465250"
-  integrity sha512-IMi5Bo34/Q5YUG5uD8ZUTBwlpGrkDIV+PUgkyNIbmn9OgozoCH80Fs7YlGluRFODQISpHwio9qvSFRGdSNT56A==
+"@storybook/addon-outline@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-outline/-/addon-outline-7.5.3.tgz#8b42758349ab07b5d39bf7e1b9cb2f83e173824a"
+  integrity sha512-c9vCi1SCGrtWr8qaOu/1GNWlrlrpl2lg4F9r+xtYf/KopenI3jSMz0YeTfmepZGAl+6Yc2Ywhm60jgpQ6SKciA==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/components" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/components" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/global" "^5.0.0"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/types" "7.5.3"
     ts-dedent "^2.0.0"
 
-"@storybook/addon-toolbars@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-toolbars/-/addon-toolbars-7.5.1.tgz#5b224dc042171717f40f255e793e1424e5b0bbd6"
-  integrity sha512-T88hEEQicV6eCovr5TN2nFgKt7wU0o7pAunP5cU01iiVRj63+oQiVIBB8Xtm4tN+/DsqtyP0BTa6rFwt2ULy8A==
+"@storybook/addon-toolbars@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-toolbars/-/addon-toolbars-7.5.3.tgz#754e818935f08f05d4e06aefafe40a1080c4d575"
+  integrity sha512-KdLr4sGMJzhtjNTNE2ocfu58yOHHUyZ/cI3BTp7a0gq9YbUpHmC3XTNr26/yOYYrdjkiMD26XusJUjXe+/V2xw==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/components" "7.5.1"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/theming" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/components" "7.5.3"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/theming" "7.5.3"
 
-"@storybook/addon-viewport@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-viewport/-/addon-viewport-7.5.1.tgz#1df1a7b9d9f9243ed5b8de604da667ed62ebf036"
-  integrity sha512-L57lOGB3LfKgAdLinaZojRQ9W9w2RC0iP9bVaXwrRVeJdpNayfuW4Kh1C8dmacZroB4Zp2U/nEjkSmdcp6uUWg==
+"@storybook/addon-viewport@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-viewport/-/addon-viewport-7.5.3.tgz#05fb97114d0186977e25a5a448dea5fba66042ce"
+  integrity sha512-gT2XX0NNBrzSs1nrxadl6LnvcwgN7z2R0LzTK8/hxvx4D0EnXrV3feXLzjewr8ZYjzfEeSpO+W+bQTVNm3fNsg==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/components" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/components" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/global" "^5.0.0"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/theming" "7.5.1"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/theming" "7.5.3"
     memoizerific "^1.11.3"
     prop-types "^15.7.2"
 
-"@storybook/blocks@7.5.1", "@storybook/blocks@^7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/blocks/-/blocks-7.5.1.tgz#c215da2e82234a703912410c52334fbade163b48"
-  integrity sha512-7b69p6kDdgmlejEMM2mW6/Lz4OmU/R3Qr+TpKnPcV5iS7ADxRQEQCTEMoQ5RyLJf0vDRh/7Ljn/RMo8Ux3X7JA==
+"@storybook/blocks@7.5.3", "@storybook/blocks@^7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/blocks/-/blocks-7.5.3.tgz#be754f60a91e95b8c72cbeadf9c5c7e7ab78920f"
+  integrity sha512-Z8yF820v78clQWkwG5OA5qugbQn7rtutq9XCsd03NDB+IEfDaTFQAZG8gs62ZX2ZaXAJsqJSr/mL9oURzXto2A==
   dependencies:
-    "@storybook/channels" "7.5.1"
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/components" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/channels" "7.5.3"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/components" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/csf" "^0.1.0"
-    "@storybook/docs-tools" "7.5.1"
+    "@storybook/docs-tools" "7.5.3"
     "@storybook/global" "^5.0.0"
-    "@storybook/manager-api" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/theming" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/manager-api" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/theming" "7.5.3"
+    "@storybook/types" "7.5.3"
     "@types/lodash" "^4.14.167"
     color-convert "^2.0.1"
     dequal "^2.0.2"
@@ -7158,15 +7253,15 @@
     ts-dedent "^2.0.0"
     util-deprecate "^1.0.2"
 
-"@storybook/builder-manager@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/builder-manager/-/builder-manager-7.5.1.tgz#9cf9ee235c1a16677b7cdc34b96e353226be83b8"
-  integrity sha512-a02kg/DCcYgiTz+7rw4KdvQzif+2lZ+NIFF5U5u8SDoCQuoe3wRT6QBrFYQTxJexA4WfO6cpyRLDJ1rx6NLo8A==
+"@storybook/builder-manager@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/builder-manager/-/builder-manager-7.5.3.tgz#dc667fd6d450988bc33c246686822a87c1b95558"
+  integrity sha512-uf4Vyj8ofHaq94m065SMvFKak1XrrxgI83VZAxc2QjiPcbRwcVOZd+wcKFdZydqqA6FlBDdJrU+k9INA4Qkfcw==
   dependencies:
     "@fal-works/esbuild-plugin-global-externals" "^2.1.2"
-    "@storybook/core-common" "7.5.1"
-    "@storybook/manager" "7.5.1"
-    "@storybook/node-logger" "7.5.1"
+    "@storybook/core-common" "7.5.3"
+    "@storybook/manager" "7.5.3"
+    "@storybook/node-logger" "7.5.3"
     "@types/ejs" "^3.1.1"
     "@types/find-cache-dir" "^3.2.1"
     "@yarnpkg/esbuild-plugin-pnp" "^3.0.0-rc.10"
@@ -7180,19 +7275,19 @@
     process "^0.11.10"
     util "^0.12.4"
 
-"@storybook/builder-vite@7.5.1", "@storybook/builder-vite@^7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/builder-vite/-/builder-vite-7.5.1.tgz#c4771d68da5a9c8a4fafd00186326532b6816c8c"
-  integrity sha512-fsF4LsxroVvjBJoI5AvRA6euhpYrb5euii5kPzrsWXLOn6gDBK0jQ0looep/io7J45MisDjRTPp14A02pi1bkw==
-  dependencies:
-    "@storybook/channels" "7.5.1"
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/core-common" "7.5.1"
-    "@storybook/csf-plugin" "7.5.1"
-    "@storybook/node-logger" "7.5.1"
-    "@storybook/preview" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/types" "7.5.1"
+"@storybook/builder-vite@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/builder-vite/-/builder-vite-7.5.3.tgz#4a0adce7451948c6496379f9ab3b786315bd3a0e"
+  integrity sha512-c104V3O75OCVnfZj0Jr70V09g0KSbPGvQK2Zh31omXGvakG8XrhWolYxkmjOcForJmAqsXnKs/nw3F75Gp853g==
+  dependencies:
+    "@storybook/channels" "7.5.3"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/core-common" "7.5.3"
+    "@storybook/csf-plugin" "7.5.3"
+    "@storybook/node-logger" "7.5.3"
+    "@storybook/preview" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/types" "7.5.3"
     "@types/find-cache-dir" "^3.2.1"
     browser-assert "^1.2.1"
     es-module-lexer "^0.9.3"
@@ -7214,23 +7309,35 @@
     telejson "^7.2.0"
     tiny-invariant "^1.3.1"
 
-"@storybook/cli@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/cli/-/cli-7.5.1.tgz#11df3114fbfadb74c7ea1777b3f79c6a045e9bec"
-  integrity sha512-qKIJs8gqXTy0eSEbt0OW5nsJqiV/2+N1eWoiBiIxoZ+8b0ACXIAUcE/N6AsEDUqIq8AMK7lebqjEfIAt2Sp7Mg==
+"@storybook/channels@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-7.5.3.tgz#cbd178b0778f3484b970d0fd0edd294db6969e0f"
+  integrity sha512-dhWuV2o2lmxH0RKuzND8jxYzvSQTSmpE13P0IT/k8+I1up/rSNYOBQJT6SalakcNWXFAMXguo/8E7ApmnKKcEw==
+  dependencies:
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/core-events" "7.5.3"
+    "@storybook/global" "^5.0.0"
+    qs "^6.10.0"
+    telejson "^7.2.0"
+    tiny-invariant "^1.3.1"
+
+"@storybook/cli@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/cli/-/cli-7.5.3.tgz#127ae3bcad169bf8c3eb3e1e6c9d587ad5f57e81"
+  integrity sha512-XysHSnknZTAcTbQ0bQsbfv5J8ifHpOBsmXjk1HCA05E9WGGrn9JrQRCfpDUQJ6O6UWq0bpMqzP8gFLWXFE7hug==
   dependencies:
     "@babel/core" "^7.22.9"
     "@babel/preset-env" "^7.22.9"
     "@babel/types" "^7.22.5"
     "@ndelangen/get-tarball" "^3.0.7"
-    "@storybook/codemod" "7.5.1"
-    "@storybook/core-common" "7.5.1"
-    "@storybook/core-events" "7.5.1"
-    "@storybook/core-server" "7.5.1"
-    "@storybook/csf-tools" "7.5.1"
-    "@storybook/node-logger" "7.5.1"
-    "@storybook/telemetry" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/codemod" "7.5.3"
+    "@storybook/core-common" "7.5.3"
+    "@storybook/core-events" "7.5.3"
+    "@storybook/core-server" "7.5.3"
+    "@storybook/csf-tools" "7.5.3"
+    "@storybook/node-logger" "7.5.3"
+    "@storybook/telemetry" "7.5.3"
+    "@storybook/types" "7.5.3"
     "@types/semver" "^7.3.4"
     "@yarnpkg/fslib" "2.10.3"
     "@yarnpkg/libzip" "2.3.0"
@@ -7268,18 +7375,25 @@
   dependencies:
     "@storybook/global" "^5.0.0"
 
-"@storybook/codemod@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/codemod/-/codemod-7.5.1.tgz#40b7b8ab74945eff7b8206c5944025d82e01cd57"
-  integrity sha512-PqHGOz/CZnRG9pWgshezCacu524CrXOJrCOwMUP9OMpH0Jk/NhBkHaBZrB8wMjn5hekTj0UmRa/EN8wJm9CCUQ==
+"@storybook/client-logger@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-7.5.3.tgz#5a33a8a1785dbe6beff60654bc8947724c0cd62e"
+  integrity sha512-vUFYALypjix5FoJ5M/XUP6KmyTnQJNW1poHdW7WXUVSg+lBM6E5eAtjTm0hdxNNDH8KSrdy24nCLra5h0X0BWg==
+  dependencies:
+    "@storybook/global" "^5.0.0"
+
+"@storybook/codemod@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/codemod/-/codemod-7.5.3.tgz#8a294b8d12f304a2a9db902848977147394d451c"
+  integrity sha512-gzycFdqnF4drUjfzMTrLNHqi2jkw1lDeACUzQdug5uWxynZKAvMTHAgU0q9wvoYRR9Xhq8PhfKtXtYCCj2Er4Q==
   dependencies:
     "@babel/core" "^7.22.9"
     "@babel/preset-env" "^7.22.9"
     "@babel/types" "^7.22.5"
     "@storybook/csf" "^0.1.0"
-    "@storybook/csf-tools" "7.5.1"
-    "@storybook/node-logger" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/csf-tools" "7.5.3"
+    "@storybook/node-logger" "7.5.3"
+    "@storybook/types" "7.5.3"
     "@types/cross-spawn" "^6.0.2"
     cross-spawn "^7.0.3"
     globby "^11.0.2"
@@ -7288,29 +7402,29 @@
     prettier "^2.8.0"
     recast "^0.23.1"
 
-"@storybook/components@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/components/-/components-7.5.1.tgz#677eae0e7976939434b5c391fe841ced9b66e082"
-  integrity sha512-fdzzxGBV/Fj9pYwfYL3RZsVUHeBqlfLMBP/L6mPmjaZSwHFqkaRZZUajZc57lCtI+TOy2gY6WH3cPavEtqtgLw==
+"@storybook/components@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/components/-/components-7.5.3.tgz#3fa282252e02973ead9f537f5ae3b5aeee5be4c4"
+  integrity sha512-M3+cjvEsDGLUx8RvK5wyF6/13LNlUnKbMgiDE8Sxk/v/WPpyhOAIh/B8VmrU1psahS61Jd4MTkFmLf1cWau1vw==
   dependencies:
     "@radix-ui/react-select" "^1.2.2"
     "@radix-ui/react-toolbar" "^1.0.4"
-    "@storybook/client-logger" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
     "@storybook/csf" "^0.1.0"
     "@storybook/global" "^5.0.0"
-    "@storybook/theming" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/theming" "7.5.3"
+    "@storybook/types" "7.5.3"
     memoizerific "^1.11.3"
     use-resize-observer "^9.1.0"
     util-deprecate "^1.0.2"
 
-"@storybook/core-client@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/core-client/-/core-client-7.5.1.tgz#06bc3711767fa131800d1a0827dd120e89019ccd"
-  integrity sha512-K651UnNKkW8U078CH5rcUqf0siGcfEhwya2yQN5RBb/H78HSLBLdYgzKqxaKtmz+S8DFyWhrgbXZLdBjavozJg==
+"@storybook/core-client@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/core-client/-/core-client-7.5.3.tgz#81e2d5343401f9caab9eaed28b649073937d5190"
+  integrity sha512-sIviDytbhos02TVXxU8XLymzty7IAtLs5e16hv49JSdBp47iBajRaNBmBj/l+sgTH+3M+R6gP8yGFMsZSCnU2g==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
 
 "@storybook/core-common@7.5.1":
   version "7.5.1"
@@ -7341,6 +7455,35 @@
     resolve-from "^5.0.0"
     ts-dedent "^2.0.0"
 
+"@storybook/core-common@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/core-common/-/core-common-7.5.3.tgz#baaf4cb8e2e29ebd74626ee8cd5971f337ac4e23"
+  integrity sha512-WGMwjtVUxUzFwQz7Mgs0gLuNebIGNV55dCdZgurx2/y6QOkJ2v8D0b3iL+xKMV4B5Nwoc2DsM418Y+Hy3UQd+w==
+  dependencies:
+    "@storybook/core-events" "7.5.3"
+    "@storybook/node-logger" "7.5.3"
+    "@storybook/types" "7.5.3"
+    "@types/find-cache-dir" "^3.2.1"
+    "@types/node" "^18.0.0"
+    "@types/node-fetch" "^2.6.4"
+    "@types/pretty-hrtime" "^1.0.0"
+    chalk "^4.1.0"
+    esbuild "^0.18.0"
+    esbuild-register "^3.5.0"
+    file-system-cache "2.3.0"
+    find-cache-dir "^3.0.0"
+    find-up "^5.0.0"
+    fs-extra "^11.1.0"
+    glob "^10.0.0"
+    handlebars "^4.7.7"
+    lazy-universal-dotenv "^4.0.0"
+    node-fetch "^2.0.0"
+    picomatch "^2.3.0"
+    pkg-dir "^5.0.0"
+    pretty-hrtime "^1.0.3"
+    resolve-from "^5.0.0"
+    ts-dedent "^2.0.0"
+
 "@storybook/core-events@7.5.1":
   version "7.5.1"
   resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-7.5.1.tgz#a6bf057e4605fb8360c76d28a3c36daa676a81a4"
@@ -7348,26 +7491,33 @@
   dependencies:
     ts-dedent "^2.0.0"
 
-"@storybook/core-server@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/core-server/-/core-server-7.5.1.tgz#6fffa20ad2952dcd1fc790ea49e9f8ad615d57e1"
-  integrity sha512-DD4BXCH91aZJoFuu0cQwG1ZUmE59kG5pazuE3S89zH1GwKS1jWyeAv4EwEfvynT5Ah1ctd8QdCZCSXVzjq0qcw==
+"@storybook/core-events@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-7.5.3.tgz#210089576844569a914cc0cd1e07119bac6eb0e4"
+  integrity sha512-DFOpyQ22JD5C1oeOFzL8wlqSWZzrqgDfDbUGP8xdO4wJu+FVTxnnWN6ZYLdTPB1u27DOhd7TzjQMfLDHLu7kbQ==
+  dependencies:
+    ts-dedent "^2.0.0"
+
+"@storybook/core-server@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/core-server/-/core-server-7.5.3.tgz#23ea0757d6ffc0e9acc269b58efd7f75f5d781f6"
+  integrity sha512-Gmq1w7ulN/VIeTDboNcb6GNM+S8T0SqhJUqeoHzn0vLGnzxeuYRJ0V3ZJhGZiJfSmCNqYAjC8QUBf6uU1gLipw==
   dependencies:
     "@aw-web-design/x-default-browser" "1.4.126"
     "@discoveryjs/json-ext" "^0.5.3"
-    "@storybook/builder-manager" "7.5.1"
-    "@storybook/channels" "7.5.1"
-    "@storybook/core-common" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/builder-manager" "7.5.3"
+    "@storybook/channels" "7.5.3"
+    "@storybook/core-common" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/csf" "^0.1.0"
-    "@storybook/csf-tools" "7.5.1"
+    "@storybook/csf-tools" "7.5.3"
     "@storybook/docs-mdx" "^0.1.0"
     "@storybook/global" "^5.0.0"
-    "@storybook/manager" "7.5.1"
-    "@storybook/node-logger" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/telemetry" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/manager" "7.5.3"
+    "@storybook/node-logger" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/telemetry" "7.5.3"
+    "@storybook/types" "7.5.3"
     "@types/detect-port" "^1.3.0"
     "@types/node" "^18.0.0"
     "@types/pretty-hrtime" "^1.0.0"
@@ -7395,12 +7545,12 @@
     watchpack "^2.2.0"
     ws "^8.2.3"
 
-"@storybook/csf-plugin@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/csf-plugin/-/csf-plugin-7.5.1.tgz#c20783772f116005471e21cbc84a3820f2ddfd35"
-  integrity sha512-jhV2aCZhSIXUiQDcHtuCg3dyYMzjYHTwLb4cJtkNw4sXqQoTGydTSWYwWigcHFfKGoyQp82rSgE1hE4YYx6iew==
+"@storybook/csf-plugin@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/csf-plugin/-/csf-plugin-7.5.3.tgz#803197a2042323323528014878e9f9f0cc50c193"
+  integrity sha512-yQ3S/IOT08Y7XTnlc3SPkrJKZ6Xld6liAlHn+ddjge4oZa0hUqwYLb+piXUhFMfL6Ij65cj4hu3vMbw89azIhg==
   dependencies:
-    "@storybook/csf-tools" "7.5.1"
+    "@storybook/csf-tools" "7.5.3"
     unplugin "^1.3.1"
 
 "@storybook/csf-tools@7.5.1":
@@ -7418,6 +7568,21 @@
     recast "^0.23.1"
     ts-dedent "^2.0.0"
 
+"@storybook/csf-tools@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/csf-tools/-/csf-tools-7.5.3.tgz#1b2a393b3402a4c2fdfb2eb4eb90c63463c106ae"
+  integrity sha512-676C3ISn7FQJKjb3DBWXhjGN2OQEv4s71dx+5D0TlmswDCOOGS8dYFjP8wVx51+mAIE8CROAw7vLHLtVKU7SwQ==
+  dependencies:
+    "@babel/generator" "^7.22.9"
+    "@babel/parser" "^7.22.7"
+    "@babel/traverse" "^7.22.8"
+    "@babel/types" "^7.22.5"
+    "@storybook/csf" "^0.1.0"
+    "@storybook/types" "7.5.3"
+    fs-extra "^11.1.0"
+    recast "^0.23.1"
+    ts-dedent "^2.0.0"
+
 "@storybook/csf@^0.0.1":
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/@storybook/csf/-/csf-0.0.1.tgz#95901507dc02f0bc6f9ac8ee1983e2fc5bb98ce6"
@@ -7437,14 +7602,14 @@
   resolved "https://registry.yarnpkg.com/@storybook/docs-mdx/-/docs-mdx-0.1.0.tgz#33ba0e39d1461caf048b57db354b2cc410705316"
   integrity sha512-JDaBR9lwVY4eSH5W8EGHrhODjygPd6QImRbwjAuJNEnY0Vw4ie3bPkeGfnacB3OBW6u/agqPv2aRlR46JcAQLg==
 
-"@storybook/docs-tools@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/docs-tools/-/docs-tools-7.5.1.tgz#a1266314e64929498d3c41483ac9794cf3707102"
-  integrity sha512-tDtQGeKU5Kc2XoqZ5vpeGQrOkRg2UoDiSRS6cLy+M/sMB03Annq0ZngnJXaMiv0DLi2zpWSgWqPgYA3TJTZHBw==
+"@storybook/docs-tools@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/docs-tools/-/docs-tools-7.5.3.tgz#1d1aec4a7546d70a2273ad99814a1dbecb8e80f7"
+  integrity sha512-f20EUQlwamcSPrOFn42fj9gpkZIDNCZkC3N19yGzLYiE4UMyaYQgRl18oLvqd3M6aBm6UW6SCoIIgeaOViBSqg==
   dependencies:
-    "@storybook/core-common" "7.5.1"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/core-common" "7.5.3"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/types" "7.5.3"
     "@types/doctrine" "^0.0.3"
     doctrine "^3.0.0"
     lodash "^4.17.21"
@@ -7454,30 +7619,30 @@
   resolved "https://registry.yarnpkg.com/@storybook/global/-/global-5.0.0.tgz#b793d34b94f572c1d7d9e0f44fac4e0dbc9572ed"
   integrity sha512-FcOqPAXACP0I3oJ/ws6/rrPT9WGhu915Cg8D02a9YxLo0DE9zI+a9A5gRGvmQ09fiWPukqI8ZAEoQEdWUKMQdQ==
 
-"@storybook/instrumenter@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/instrumenter/-/instrumenter-7.5.1.tgz#a63d9d7f9623cc9994e4772990742b13892e0f40"
-  integrity sha512-bxRoWVVLlevqTFappXj1JfZlvEceBiBPdQQqTTeeA09VL3UyFWDpPFRn8Wf2C43Vt4V18w+krMyb1KfTk37ROQ==
+"@storybook/instrumenter@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/instrumenter/-/instrumenter-7.5.3.tgz#de875ba10db3b5a06a1acbc27a8b1f8fb1d875ff"
+  integrity sha512-p6b+/6ohTCKxWn00bXT8KBqVjXUOxeILnJtLlG83USLQCpI+XVkpmK57HYuydqEwy/1XjG+4S4ntPk9VVz3u7w==
   dependencies:
-    "@storybook/channels" "7.5.1"
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/channels" "7.5.3"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/global" "^5.0.0"
-    "@storybook/preview-api" "7.5.1"
+    "@storybook/preview-api" "7.5.3"
 
-"@storybook/manager-api@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/manager-api/-/manager-api-7.5.1.tgz#ebc5c0efc3f9c3451882e61b9b982d898a1fc6c9"
-  integrity sha512-ygwJywluhhE1dpA0jC2D/3NFhMXzFCt+iW4m3cOwexYTuiDWF66AbGOFBx9peE7Wk/Z9doKkf9E3v11enwaidA==
+"@storybook/manager-api@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/manager-api/-/manager-api-7.5.3.tgz#6e9e791a8996631dc77f3a0cecc34ce4f4869647"
+  integrity sha512-d8mVLr/5BEG4bAS2ZeqYTy/aX4jPEpZHdcLaWoB4mAM+PAL9wcWsirUyApKtDVYLITJf/hd8bb2Dm2ok6E45gA==
   dependencies:
-    "@storybook/channels" "7.5.1"
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/channels" "7.5.3"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/csf" "^0.1.0"
     "@storybook/global" "^5.0.0"
-    "@storybook/router" "7.5.1"
-    "@storybook/theming" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/router" "7.5.3"
+    "@storybook/theming" "7.5.3"
+    "@storybook/types" "7.5.3"
     dequal "^2.0.2"
     lodash "^4.17.21"
     memoizerific "^1.11.3"
@@ -7486,37 +7651,42 @@
     telejson "^7.2.0"
     ts-dedent "^2.0.0"
 
-"@storybook/manager@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/manager/-/manager-7.5.1.tgz#c8b73b17e10c2c96fbc2ab736abcdc57bb8f4143"
-  integrity sha512-Jo83sj7KvsZ78vvqjH72ErmQ31Frx6GBLbpeYXZtbAXWl0/LHsxAEVz0Mke+DixzWDyP0/cn+Nw8QUfA+Oz1fg==
+"@storybook/manager@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/manager/-/manager-7.5.3.tgz#e185fc056546c19d255cdc26b6f2698e04d3f8ab"
+  integrity sha512-3ZZrHYcXWAQXpDQZBvKyScGgQaAaBc63i+KC2mXqzTdXuJhVDUiylvqLRprBnrEprgePQLFrxGC2JSHUwH7dqg==
 
 "@storybook/mdx2-csf@^1.0.0":
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/@storybook/mdx2-csf/-/mdx2-csf-1.1.0.tgz#97f6df04d0bf616991cc1005a073ac004a7281e5"
   integrity sha512-TXJJd5RAKakWx4BtpwvSNdgTDkKM6RkXU8GK34S/LhidQ5Pjz3wcnqb0TxEkfhK/ztbP8nKHqXFwLfa2CYkvQw==
 
-"@storybook/node-logger@7.5.1", "@storybook/node-logger@^7.5.1":
+"@storybook/node-logger@7.5.1":
   version "7.5.1"
   resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-7.5.1.tgz#a2cce2c2122180523cbd5b5727e9e48a8e44b5c2"
   integrity sha512-xRMdL5YPe8C9sgJ1R0QD3YbiLjDGrfQk91+GplRD8N9FVCT5dki55Bv5Kp0FpemLYYg6uxAZL5nHmsZHKDKQoA==
 
-"@storybook/postinstall@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/postinstall/-/postinstall-7.5.1.tgz#956a4e6460f330e0cac51650c38ab25d0d3b2ec0"
-  integrity sha512-+LFUe2nNbmmLPKNt34RXSSC1r40yGGOoP/qlaPFwNOgQN2AZUrfqk6ZYnw6LjmcuHpQInZ4y4WDgbzg6QQL3+w==
+"@storybook/node-logger@7.5.3", "@storybook/node-logger@^7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-7.5.3.tgz#23133787f5b3427cef7301e10c6caf9132969fc1"
+  integrity sha512-7ZZDw/q3hakBj1FngsBjaHNIBguYAWojp7R1fFTvwkeunCi21EUzZjRBcqp10kB6BP3/NLX32bIQknsCWD76rQ==
 
-"@storybook/preview-api@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/preview-api/-/preview-api-7.5.1.tgz#c21697587d7202941e0f90538115d9c3be21f781"
-  integrity sha512-8xjUbuGmHLmw8tfTUCjXSvMM9r96JaexPFmHdwW6XLe71KKdWp8u96vRDRE5648cd+/of15OjaRtakRKqluA/A==
+"@storybook/postinstall@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/postinstall/-/postinstall-7.5.3.tgz#66b9add9e315646dde2289d77c87118c3c8596a6"
+  integrity sha512-r+H3xGMu2A9yOSsygc3bDFhku8wpOZF3SqO19B7eAML12viHwUtYfyGL74svw4TMcKukyQ+KPn5QsSG+4bjZMg==
+
+"@storybook/preview-api@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/preview-api/-/preview-api-7.5.3.tgz#eaf70f9b6888d0dac42ce39a296afd6acacf6156"
+  integrity sha512-LNmEf7oBRnZ1wG3bQ+P+TO29+NN5pSDJiAA6FabZBrtIVm+psc2lxBCDQvFYyAFzQSlt60toGKNW8+RfFNdR5Q==
   dependencies:
-    "@storybook/channels" "7.5.1"
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/core-events" "7.5.1"
+    "@storybook/channels" "7.5.3"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/core-events" "7.5.3"
     "@storybook/csf" "^0.1.0"
     "@storybook/global" "^5.0.0"
-    "@storybook/types" "7.5.1"
+    "@storybook/types" "7.5.3"
     "@types/qs" "^6.9.5"
     dequal "^2.0.2"
     lodash "^4.17.21"
@@ -7526,41 +7696,41 @@
     ts-dedent "^2.0.0"
     util-deprecate "^1.0.2"
 
-"@storybook/preview@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/preview/-/preview-7.5.1.tgz#97d8de1a4780eb7640a0f74d88302871728160b7"
-  integrity sha512-nfZC103z9Cy27FrJKUr2IjDuVt8Mvn1Z5gZ0TtJihoK7sfLTv29nd/XU9zzrb/epM3o8UEzc63xZZsMaToDbAw==
+"@storybook/preview@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/preview/-/preview-7.5.3.tgz#9abe434ea9fb280a7d2141b72be2958f7eb9cc5b"
+  integrity sha512-Hf90NlLaSrdMZXPOHDCMPjTywVrQKK0e5CtzqWx/ZQz91JDINxJD+sGj2wZU+wuBtQcTtlsXc9OewlJ+9ETwIw==
 
-"@storybook/react-dom-shim@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/react-dom-shim/-/react-dom-shim-7.5.1.tgz#1dd868782f2ed52828691a221b0f9e99f5427ef8"
-  integrity sha512-bzTIfLm91O9h3rPYJLtRbmsPARerY3z7MoyvadGp8TikvIvf+WyT/vHujw+20SxnqiZVq5Jv65FFlxc46GGB1Q==
+"@storybook/react-dom-shim@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/react-dom-shim/-/react-dom-shim-7.5.3.tgz#54fc7bda589be5f630738fd08d2a37d5bb7815fa"
+  integrity sha512-9aNcKdhoP36jMrcXgfzE9jVg/SpqPpWnUJM70upYoZXytG2wQSPtawLHHyC6kycvTzwncyfF3rwUnOFBB8zmig==
 
-"@storybook/react-vite@^7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/react-vite/-/react-vite-7.5.1.tgz#7460a05845e568c155fced120e56fbca29012fcf"
-  integrity sha512-996/CtOqTjDWMKBGcHG8pwIVlORnoknLD+OTkPXl+aAl9oM9jUtc7psVKLJKGHSHTlVElM2wMTwIHnJ4yeP7bw==
+"@storybook/react-vite@^7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/react-vite/-/react-vite-7.5.3.tgz#1c0f471e624b0e077916fcd11f62b1aaaedf1448"
+  integrity sha512-ArPyHgiPbT5YvcyK4xK/DfqBOpn4R4/EP3kfIGhx8QKJyOtxPEYFdkLIZ5xu3KnPX7/z7GT+4a6Rb+8sk9gliA==
   dependencies:
     "@joshwooding/vite-plugin-react-docgen-typescript" "0.3.0"
     "@rollup/pluginutils" "^5.0.2"
-    "@storybook/builder-vite" "7.5.1"
-    "@storybook/react" "7.5.1"
+    "@storybook/builder-vite" "7.5.3"
+    "@storybook/react" "7.5.3"
     "@vitejs/plugin-react" "^3.0.1"
     magic-string "^0.30.0"
     react-docgen "^6.0.2"
 
-"@storybook/react@7.5.1", "@storybook/react@^7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/react/-/react-7.5.1.tgz#56227f2dbb7c3a5fafc7f3e61a3e4268ec1c5fde"
-  integrity sha512-IG97c30fFSmPyGpJ1awHC/+9XnCTqleeOQwROXjroMHSm8m/JTWpHMVLyM1x7b6VAnBhNHWJ+oXLZe/hXkXfpA==
+"@storybook/react@7.5.3", "@storybook/react@^7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/react/-/react-7.5.3.tgz#fe01ff2057826bdf55b0852deea7e76859757c01"
+  integrity sha512-dZILdM36xMFDjdmmy421G5X+sOIncB2qF3IPTooniG1i1Z6v/dVNo57ovdID9lDTNa+AWr2fLB9hANiISMqmjQ==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
-    "@storybook/core-client" "7.5.1"
-    "@storybook/docs-tools" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/core-client" "7.5.3"
+    "@storybook/docs-tools" "7.5.3"
     "@storybook/global" "^5.0.0"
-    "@storybook/preview-api" "7.5.1"
-    "@storybook/react-dom-shim" "7.5.1"
-    "@storybook/types" "7.5.1"
+    "@storybook/preview-api" "7.5.3"
+    "@storybook/react-dom-shim" "7.5.3"
+    "@storybook/types" "7.5.3"
     "@types/escodegen" "^0.0.6"
     "@types/estree" "^0.0.51"
     "@types/node" "^18.0.0"
@@ -7576,16 +7746,30 @@
     type-fest "~2.19"
     util-deprecate "^1.0.2"
 
-"@storybook/router@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/router/-/router-7.5.1.tgz#1d09daa1c7414061fe8c47415b7750a874ad1d9b"
-  integrity sha512-BvKo+IxWwo3dfIG1+vLtZLT4qqkNHL5GTIozTyX04uqt9ByYZL6SJEzxEa1Xn6Qq/fbdQwzCanNHbTlwiTMf7Q==
+"@storybook/router@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/router/-/router-7.5.3.tgz#e024ad96bc4bbf7250239921a251e828729e4747"
+  integrity sha512-/iNYCFore7R5n6eFHbBYoB0P2/sybTVpA+uXTNUd3UEt7Ro6CEslTaFTEiH2RVQwOkceBp/NpyWon74xZuXhMg==
   dependencies:
-    "@storybook/client-logger" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
     memoizerific "^1.11.3"
     qs "^6.10.0"
 
-"@storybook/telemetry@7.5.1", "@storybook/telemetry@^7.1.0-alpha.32":
+"@storybook/telemetry@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/telemetry/-/telemetry-7.5.3.tgz#67d77c5cb33360c6f483a7cc89897fea160ca446"
+  integrity sha512-X6alII3o0jCb5xALuw+qcWmvyrbhlkmPeNZ6ZQXknOfB4DkwponFdWN5y6W7yGvr01xa5QBepJRV79isl97d8g==
+  dependencies:
+    "@storybook/client-logger" "7.5.3"
+    "@storybook/core-common" "7.5.3"
+    "@storybook/csf-tools" "7.5.3"
+    chalk "^4.1.0"
+    detect-package-manager "^2.0.1"
+    fetch-retry "^5.0.2"
+    fs-extra "^11.1.0"
+    read-pkg-up "^7.0.1"
+
+"@storybook/telemetry@^7.1.0-alpha.32":
   version "7.5.1"
   resolved "https://registry.yarnpkg.com/@storybook/telemetry/-/telemetry-7.5.1.tgz#299bc0c03b1b68a7cd274ff443c7f13783153c87"
   integrity sha512-z9PGouNqvZ2F7vD79qDF4PN7iW3kE3MO7YX0iKTmzgLi4ImKuXIJRF04GRH8r+WYghnbomAyA4o6z9YJMdNuVw==
@@ -7608,13 +7792,13 @@
     "@testing-library/user-event" "^14.4.0"
     ts-dedent "^2.2.0"
 
-"@storybook/theming@7.5.1":
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-7.5.1.tgz#b3a78f493d644ac8cba5136e04479a58a9ba5546"
-  integrity sha512-ETLAOn10hI4Mkmjsr0HGcM6HbzaURrrPBYmfXOrdbrzEVN+AHW4FlvP9d8fYyP1gdjPE1F39XvF0jYgt1zXiHQ==
+"@storybook/theming@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-7.5.3.tgz#bbcf547c8b3ec1e59e641c58155a44781d5f310d"
+  integrity sha512-Cjmthe1MAk0z4RKCZ7m72gAD8YD0zTAH97z5ryM1Qv84QXjiCQ143fGOmYz1xEQdNFpOThPcwW6FEccLHTkVcg==
   dependencies:
     "@emotion/use-insertion-effect-with-fallbacks" "^1.0.0"
-    "@storybook/client-logger" "7.5.1"
+    "@storybook/client-logger" "7.5.3"
     "@storybook/global" "^5.0.0"
     memoizerific "^1.11.3"
 
@@ -7628,6 +7812,16 @@
     "@types/express" "^4.7.0"
     file-system-cache "2.3.0"
 
+"@storybook/types@7.5.3":
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/@storybook/types/-/types-7.5.3.tgz#be956805dafc09fa9a7a3dd4e0e5097ef08e4fd4"
+  integrity sha512-iu5W0Kdd6nysN5CPkY4GRl+0BpxRTdSfBIJak7mb6xCIHSB5t1tw4BOuqMQ5EgpikRY3MWJ4gY647QkWBX3MNQ==
+  dependencies:
+    "@storybook/channels" "7.5.3"
+    "@types/babel__core" "^7.0.0"
+    "@types/express" "^4.7.0"
+    file-system-cache "2.3.0"
+
 "@svgr/babel-plugin-add-jsx-attribute@^7.0.0":
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-7.0.0.tgz#80856c1b7a3b7422d232f6e079f0beb90c4a13e9"
@@ -25308,12 +25502,12 @@ store2@^2.14.2:
   resolved "https://registry.yarnpkg.com/store2/-/store2-2.14.2.tgz#56138d200f9fe5f582ad63bc2704dbc0e4a45068"
   integrity sha512-siT1RiqlfQnGqgT/YzXVUNsom9S0H1OX+dpdGN1xkyYATo4I6sep5NmsRD/40s3IIOvlCq6akxkqG82urIZW1w==
 
-storybook@^7.5.1:
-  version "7.5.1"
-  resolved "https://registry.yarnpkg.com/storybook/-/storybook-7.5.1.tgz#e7554aa674355fedb1f49f9651f0650b8f9ee13b"
-  integrity sha512-Wg3j3z5H03PYnEcmlnhf6bls0OtjmsNPsQ93dTV8F4AweqBECwzjf94Wj++NrP3X+WbfMoCbBU6LRFuEyzCCxw==
+storybook@^7.5.3:
+  version "7.5.3"
+  resolved "https://registry.yarnpkg.com/storybook/-/storybook-7.5.3.tgz#0003b072736b8b15c3b7205e9775d0c5ec898b4d"
+  integrity sha512-lkn9hcedNmSNCzbDIrky2LpZJqlpS7Fy1KpGBZmLY34g5Mb0+KnXaUqzY0dxsd7aFm8Oa7Du/emceMYNNL4DMA==
   dependencies:
-    "@storybook/cli" "7.5.1"
+    "@storybook/cli" "7.5.3"
 
 stream-browserify@^3.0.0:
   version "3.0.0"