@yosgo/swap-ui 1.0.142 → 2.0.0-beta.1

package/build/index.cjs

@@ -0,0 +1,3693 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __commonJS = (cb, mod) => function __require() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// node_modules/react-is/cjs/react-is.production.js
+var require_react_is_production = __commonJS({
+  "node_modules/react-is/cjs/react-is.production.js"(exports2) {
+    "use strict";
+    var REACT_ELEMENT_TYPE = /* @__PURE__ */ Symbol.for("react.transitional.element");
+    var REACT_PORTAL_TYPE = /* @__PURE__ */ Symbol.for("react.portal");
+    var REACT_FRAGMENT_TYPE = /* @__PURE__ */ Symbol.for("react.fragment");
+    var REACT_STRICT_MODE_TYPE = /* @__PURE__ */ Symbol.for("react.strict_mode");
+    var REACT_PROFILER_TYPE = /* @__PURE__ */ Symbol.for("react.profiler");
+    var REACT_CONSUMER_TYPE = /* @__PURE__ */ Symbol.for("react.consumer");
+    var REACT_CONTEXT_TYPE = /* @__PURE__ */ Symbol.for("react.context");
+    var REACT_FORWARD_REF_TYPE = /* @__PURE__ */ Symbol.for("react.forward_ref");
+    var REACT_SUSPENSE_TYPE = /* @__PURE__ */ Symbol.for("react.suspense");
+    var REACT_SUSPENSE_LIST_TYPE = /* @__PURE__ */ Symbol.for("react.suspense_list");
+    var REACT_MEMO_TYPE = /* @__PURE__ */ Symbol.for("react.memo");
+    var REACT_LAZY_TYPE = /* @__PURE__ */ Symbol.for("react.lazy");
+    var REACT_VIEW_TRANSITION_TYPE = /* @__PURE__ */ Symbol.for("react.view_transition");
+    var REACT_CLIENT_REFERENCE = /* @__PURE__ */ Symbol.for("react.client.reference");
+    function typeOf(object) {
+      if ("object" === typeof object && null !== object) {
+        var $$typeof = object.$$typeof;
+        switch ($$typeof) {
+          case REACT_ELEMENT_TYPE:
+            switch (object = object.type, object) {
+              case REACT_FRAGMENT_TYPE:
+              case REACT_PROFILER_TYPE:
+              case REACT_STRICT_MODE_TYPE:
+              case REACT_SUSPENSE_TYPE:
+              case REACT_SUSPENSE_LIST_TYPE:
+              case REACT_VIEW_TRANSITION_TYPE:
+                return object;
+              default:
+                switch (object = object && object.$$typeof, object) {
+                  case REACT_CONTEXT_TYPE:
+                  case REACT_FORWARD_REF_TYPE:
+                  case REACT_LAZY_TYPE:
+                  case REACT_MEMO_TYPE:
+                    return object;
+                  case REACT_CONSUMER_TYPE:
+                    return object;
+                  default:
+                    return $$typeof;
+                }
+            }
+          case REACT_PORTAL_TYPE:
+            return $$typeof;
+        }
+      }
+    }
+    exports2.ContextConsumer = REACT_CONSUMER_TYPE;
+    exports2.ContextProvider = REACT_CONTEXT_TYPE;
+    exports2.Element = REACT_ELEMENT_TYPE;
+    exports2.ForwardRef = REACT_FORWARD_REF_TYPE;
+    exports2.Fragment = REACT_FRAGMENT_TYPE;
+    exports2.Lazy = REACT_LAZY_TYPE;
+    exports2.Memo = REACT_MEMO_TYPE;
+    exports2.Portal = REACT_PORTAL_TYPE;
+    exports2.Profiler = REACT_PROFILER_TYPE;
+    exports2.StrictMode = REACT_STRICT_MODE_TYPE;
+    exports2.Suspense = REACT_SUSPENSE_TYPE;
+    exports2.SuspenseList = REACT_SUSPENSE_LIST_TYPE;
+    exports2.isContextConsumer = function(object) {
+      return typeOf(object) === REACT_CONSUMER_TYPE;
+    };
+    exports2.isContextProvider = function(object) {
+      return typeOf(object) === REACT_CONTEXT_TYPE;
+    };
+    exports2.isElement = function(object) {
+      return "object" === typeof object && null !== object && object.$$typeof === REACT_ELEMENT_TYPE;
+    };
+    exports2.isForwardRef = function(object) {
+      return typeOf(object) === REACT_FORWARD_REF_TYPE;
+    };
+    exports2.isFragment = function(object) {
+      return typeOf(object) === REACT_FRAGMENT_TYPE;
+    };
+    exports2.isLazy = function(object) {
+      return typeOf(object) === REACT_LAZY_TYPE;
+    };
+    exports2.isMemo = function(object) {
+      return typeOf(object) === REACT_MEMO_TYPE;
+    };
+    exports2.isPortal = function(object) {
+      return typeOf(object) === REACT_PORTAL_TYPE;
+    };
+    exports2.isProfiler = function(object) {
+      return typeOf(object) === REACT_PROFILER_TYPE;
+    };
+    exports2.isStrictMode = function(object) {
+      return typeOf(object) === REACT_STRICT_MODE_TYPE;
+    };
+    exports2.isSuspense = function(object) {
+      return typeOf(object) === REACT_SUSPENSE_TYPE;
+    };
+    exports2.isSuspenseList = function(object) {
+      return typeOf(object) === REACT_SUSPENSE_LIST_TYPE;
+    };
+    exports2.isValidElementType = function(type) {
+      return "string" === typeof type || "function" === typeof type || type === REACT_FRAGMENT_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || "object" === typeof type && null !== type && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_CONSUMER_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_CLIENT_REFERENCE || void 0 !== type.getModuleId) ? true : false;
+    };
+    exports2.typeOf = typeOf;
+  }
+});
+
+// node_modules/react-is/cjs/react-is.development.js
+var require_react_is_development = __commonJS({
+  "node_modules/react-is/cjs/react-is.development.js"(exports2) {
+    "use strict";
+    "production" !== process.env.NODE_ENV && (function() {
+      function typeOf(object) {
+        if ("object" === typeof object && null !== object) {
+          var $$typeof = object.$$typeof;
+          switch ($$typeof) {
+            case REACT_ELEMENT_TYPE:
+              switch (object = object.type, object) {
+                case REACT_FRAGMENT_TYPE:
+                case REACT_PROFILER_TYPE:
+                case REACT_STRICT_MODE_TYPE:
+                case REACT_SUSPENSE_TYPE:
+                case REACT_SUSPENSE_LIST_TYPE:
+                case REACT_VIEW_TRANSITION_TYPE:
+                  return object;
+                default:
+                  switch (object = object && object.$$typeof, object) {
+                    case REACT_CONTEXT_TYPE:
+                    case REACT_FORWARD_REF_TYPE:
+                    case REACT_LAZY_TYPE:
+                    case REACT_MEMO_TYPE:
+                      return object;
+                    case REACT_CONSUMER_TYPE:
+                      return object;
+                    default:
+                      return $$typeof;
+                  }
+              }
+            case REACT_PORTAL_TYPE:
+              return $$typeof;
+          }
+        }
+      }
+      var REACT_ELEMENT_TYPE = /* @__PURE__ */ Symbol.for("react.transitional.element"), REACT_PORTAL_TYPE = /* @__PURE__ */ Symbol.for("react.portal"), REACT_FRAGMENT_TYPE = /* @__PURE__ */ Symbol.for("react.fragment"), REACT_STRICT_MODE_TYPE = /* @__PURE__ */ Symbol.for("react.strict_mode"), REACT_PROFILER_TYPE = /* @__PURE__ */ Symbol.for("react.profiler"), REACT_CONSUMER_TYPE = /* @__PURE__ */ Symbol.for("react.consumer"), REACT_CONTEXT_TYPE = /* @__PURE__ */ Symbol.for("react.context"), REACT_FORWARD_REF_TYPE = /* @__PURE__ */ Symbol.for("react.forward_ref"), REACT_SUSPENSE_TYPE = /* @__PURE__ */ Symbol.for("react.suspense"), REACT_SUSPENSE_LIST_TYPE = /* @__PURE__ */ Symbol.for("react.suspense_list"), REACT_MEMO_TYPE = /* @__PURE__ */ Symbol.for("react.memo"), REACT_LAZY_TYPE = /* @__PURE__ */ Symbol.for("react.lazy"), REACT_VIEW_TRANSITION_TYPE = /* @__PURE__ */ Symbol.for("react.view_transition"), REACT_CLIENT_REFERENCE = /* @__PURE__ */ Symbol.for("react.client.reference");
+      exports2.ContextConsumer = REACT_CONSUMER_TYPE;
+      exports2.ContextProvider = REACT_CONTEXT_TYPE;
+      exports2.Element = REACT_ELEMENT_TYPE;
+      exports2.ForwardRef = REACT_FORWARD_REF_TYPE;
+      exports2.Fragment = REACT_FRAGMENT_TYPE;
+      exports2.Lazy = REACT_LAZY_TYPE;
+      exports2.Memo = REACT_MEMO_TYPE;
+      exports2.Portal = REACT_PORTAL_TYPE;
+      exports2.Profiler = REACT_PROFILER_TYPE;
+      exports2.StrictMode = REACT_STRICT_MODE_TYPE;
+      exports2.Suspense = REACT_SUSPENSE_TYPE;
+      exports2.SuspenseList = REACT_SUSPENSE_LIST_TYPE;
+      exports2.isContextConsumer = function(object) {
+        return typeOf(object) === REACT_CONSUMER_TYPE;
+      };
+      exports2.isContextProvider = function(object) {
+        return typeOf(object) === REACT_CONTEXT_TYPE;
+      };
+      exports2.isElement = function(object) {
+        return "object" === typeof object && null !== object && object.$$typeof === REACT_ELEMENT_TYPE;
+      };
+      exports2.isForwardRef = function(object) {
+        return typeOf(object) === REACT_FORWARD_REF_TYPE;
+      };
+      exports2.isFragment = function(object) {
+        return typeOf(object) === REACT_FRAGMENT_TYPE;
+      };
+      exports2.isLazy = function(object) {
+        return typeOf(object) === REACT_LAZY_TYPE;
+      };
+      exports2.isMemo = function(object) {
+        return typeOf(object) === REACT_MEMO_TYPE;
+      };
+      exports2.isPortal = function(object) {
+        return typeOf(object) === REACT_PORTAL_TYPE;
+      };
+      exports2.isProfiler = function(object) {
+        return typeOf(object) === REACT_PROFILER_TYPE;
+      };
+      exports2.isStrictMode = function(object) {
+        return typeOf(object) === REACT_STRICT_MODE_TYPE;
+      };
+      exports2.isSuspense = function(object) {
+        return typeOf(object) === REACT_SUSPENSE_TYPE;
+      };
+      exports2.isSuspenseList = function(object) {
+        return typeOf(object) === REACT_SUSPENSE_LIST_TYPE;
+      };
+      exports2.isValidElementType = function(type) {
+        return "string" === typeof type || "function" === typeof type || type === REACT_FRAGMENT_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || "object" === typeof type && null !== type && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_CONSUMER_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_CLIENT_REFERENCE || void 0 !== type.getModuleId) ? true : false;
+      };
+      exports2.typeOf = typeOf;
+    })();
+  }
+});
+
+// node_modules/react-is/index.js
+var require_react_is = __commonJS({
+  "node_modules/react-is/index.js"(exports2, module2) {
+    "use strict";
+    if (process.env.NODE_ENV === "production") {
+      module2.exports = require_react_is_production();
+    } else {
+      module2.exports = require_react_is_development();
+    }
+  }
+});
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  AutoComplete: () => AutoComplete_default,
+  Banner: () => Banner_default,
+  Breadcrumb: () => Breadcrumb_default,
+  BreadcrumbItem: () => BreadcrumbItem_default,
+  Card: () => Card_default,
+  CheckBox: () => CheckBox_default,
+  CheckBoxList: () => CheckBoxList_default,
+  Chip: () => Chip_default,
+  CircularProgress: () => CircularProgress_default,
+  Container: () => Container_default,
+  DatePicker: () => DatePicker_default,
+  Dropdown: () => Dropdown_default,
+  IconButton: () => IconButton_default,
+  Link: () => Link_default,
+  MenuItem: () => MenuItem_default,
+  Modal: () => Modal_default,
+  Paper: () => Paper_default,
+  Progress: () => Progress_default,
+  RadioButton: () => RadioButton_default,
+  RadioList: () => RadioList_default,
+  SWAPExpenseTypes: () => SWAPExpenseTypes,
+  SWAPIncomeTypes: () => SWAPIncomeTypes,
+  SWAPLogo: () => SWAPLogo_default,
+  SWAPShare: () => SWAPShare_default,
+  SWAPTaxDescription: () => SWAPTaxDescription,
+  SWAPTaxExpenseLabel: () => SWAPTaxExpenseLabel,
+  SWAPTaxIncomeLabel: () => SWAPTaxIncomeLabel,
+  SWAPThemeProvider: () => SWAPThemeProvider,
+  SWAP_UI_VERSION: () => SWAP_UI_VERSION,
+  SegmentedTab: () => SegmentedTab_default,
+  SegmentedTabs: () => SegmentedTabs_default,
+  Select: () => Select_default,
+  Snackbar: () => Snackbar_default,
+  Switch: () => Switch_default,
+  Tab: () => Tab_default,
+  TabPanel: () => TabPanel_default,
+  Tabs: () => Tabs_default,
+  TaxTextField: () => TaxTextField_default,
+  TextField: () => TextField_default,
+  Tooltip: () => Tooltip_default,
+  Typography: () => Typography_default,
+  createSwapTheme: () => createSwapTheme,
+  swapBreakpoints: () => swapBreakpoints,
+  swapColors: () => swapColors,
+  swapFontFamily: () => swapFontFamily,
+  swapRadius: () => swapRadius,
+  swapShadows: () => swapShadows,
+  useBreakpoints: () => useBreakpoints
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/theme/SWAPThemeProvider.tsx
+var import_styles2 = require("@mui/material/styles");
+var import_CssBaseline = __toESM(require("@mui/material/CssBaseline"), 1);
+
+// src/theme/createSwapTheme.ts
+var import_styles = require("@mui/material/styles");
+
+// node_modules/@mui/utils/deepmerge/deepmerge.mjs
+var React = __toESM(require("react"), 1);
+var import_react_is = __toESM(require_react_is(), 1);
+function isPlainObject(item) {
+  if (typeof item !== "object" || item === null) {
+    return false;
+  }
+  const prototype = Object.getPrototypeOf(item);
+  return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in item) && !(Symbol.iterator in item);
+}
+function deepClone(source) {
+  if (/* @__PURE__ */ React.isValidElement(source) || (0, import_react_is.isValidElementType)(source) || !isPlainObject(source)) {
+    return source;
+  }
+  const output = {};
+  Object.keys(source).forEach((key) => {
+    output[key] = deepClone(source[key]);
+  });
+  return output;
+}
+function deepmerge(target, source, options = {
+  clone: true
+}) {
+  const output = options.clone ? {
+    ...target
+  } : target;
+  if (isPlainObject(target) && isPlainObject(source)) {
+    Object.keys(source).forEach((key) => {
+      if (/* @__PURE__ */ React.isValidElement(source[key]) || (0, import_react_is.isValidElementType)(source[key])) {
+        output[key] = source[key];
+      } else if (isPlainObject(source[key]) && // Avoid prototype pollution
+      Object.prototype.hasOwnProperty.call(target, key) && isPlainObject(target[key])) {
+        output[key] = deepmerge(target[key], source[key], options);
+      } else if (options.clone) {
+        output[key] = isPlainObject(source[key]) ? deepClone(source[key]) : source[key];
+      } else {
+        output[key] = source[key];
+      }
+    });
+  }
+  return output;
+}
+
+// src/theme/tokens.ts
+var swapColors = {
+  primary: {
+    primary50: "#E6E9F8",
+    primary100: "#C1C7ED",
+    primary200: "#97A3E1",
+    primary300: "#6C7FD5",
+    primary400: "#4862CC",
+    primary500: "#1747C2",
+    primary600: "#0F3FB8",
+    primary700: "#0035AC",
+    primary800: "#1F3C8E",
+    primary900: "#002BA1",
+    primaryA11y: "#071E60"
+  },
+  secondary: {
+    secondary50: "#FEF8E3",
+    secondary100: "#FCECB7",
+    secondary200: "#FBDF8A",
+    secondary300: "#FAD45C",
+    secondary400: "#F9C93F",
+    secondary500: "#F8C131",
+    secondary600: "#F7B52C",
+    secondary700: "#F6A128",
+    secondary800: "#F59225",
+    secondary900: "#F27521",
+    secondaryA11y: "#E5640C"
+  },
+  danger: {
+    danger50: "#FFEBED",
+    danger100: "#FFCCD0",
+    danger200: "#F99894",
+    danger300: "#F26E6A",
+    danger400: "#FC4A43",
+    danger500: "#FF3622",
+    danger600: "#F32A23",
+    danger700: "#E11C1E",
+    danger800: "#D40F14",
+    danger900: "#C60003",
+    dangerA11y: "#A80003"
+  },
+  success: {
+    success50: "#E6F6E8",
+    success100: "#C3E8C6",
+    success200: "#9BD9A1",
+    success300: "#70CB7A",
+    success400: "#4CC05D",
+    success500: "#1EB43F",
+    success600: "#10A535",
+    success700: "#00932A",
+    success800: "#00821E",
+    success900: "#006305",
+    successA11y: "#015C16"
+  },
+  black: {
+    white: "#FFFFFF",
+    black100: "#F9F9F9",
+    black200: "#F6F6F6",
+    black300: "#F2F2F2",
+    black400: "#ECECEC",
+    black500: "#CCCCCC",
+    black600: "#909090",
+    black700: "#6F6F6F",
+    black800: "#4B4B4B",
+    black900: "#2D2D2D",
+    black1000: "#000000"
+  }
+};
+var swapRadius = {
+  s: "4px",
+  m: "8px",
+  l: "12px",
+  xl: "20px"
+};
+var swapShadows = {
+  s: "0px 2px 4px rgba(0, 0, 0, 0.12)",
+  m: "0px 4px 12px rgba(0, 0, 0, 0.1)",
+  l: "0px 6px 24px rgba(0, 0, 0, 0.1)",
+  xl: "0px 8px 40px rgba(0, 0, 0, 0.12)"
+};
+var swapBreakpoints = {
+  xxs: 0,
+  xs: 375,
+  sm: 576,
+  md: 768,
+  lg: 992,
+  xl: 1200,
+  xxl: 1400
+};
+var swapFontFamily = ['"M PLUS Rounded 1c"', '"Noto Sans TC"', "sans-serif"].join(", ");
+
+// src/theme/button.styles.ts
+var c = swapColors;
+var buttonRootStyles = {
+  textTransform: "unset",
+  borderRadius: "8px",
+  fontWeight: 700,
+  lineHeight: 1.125,
+  whiteSpace: "nowrap"
+  // v1 將 children 包 nowrap 容器：按鈕文字不換行
+};
+var variantColor = [
+  {
+    variant: "primary",
+    color: c.black.white,
+    backgroundColor: c.primary.primary400,
+    border: `1px solid ${c.primary.primary600}`,
+    hoverBg: c.primary.primary300,
+    activeBg: c.primary.primary500,
+    focusShadow: "0px 0px 0px 4px #D7DFF8"
+  },
+  {
+    variant: "secondary",
+    color: c.primary.primary400,
+    backgroundColor: c.black.white,
+    border: `1px solid ${c.primary.primary400}`,
+    hoverBg: c.primary.primary50,
+    activeBg: c.primary.primary100,
+    focusShadow: "0px 0px 0px 4px #D7DFF8"
+  },
+  {
+    variant: "tertiary",
+    color: c.black.black800,
+    backgroundColor: c.black.black400,
+    border: "none",
+    hoverBg: c.black.black500,
+    activeBg: c.black.black600,
+    focusShadow: "0px 0px 0px 4px rgba(0, 0, 0, 0.1)"
+  },
+  {
+    variant: "text",
+    color: c.primary.primary400,
+    backgroundColor: c.black.white,
+    border: "none",
+    hoverBg: c.primary.primary50,
+    activeBg: c.primary.primary100,
+    focusShadow: "0px 0px 0px 4px #D7DFF8"
+  },
+  {
+    variant: "black",
+    color: c.black.black800,
+    backgroundColor: c.black.white,
+    border: "none",
+    hoverBg: c.black.black400,
+    activeBg: c.black.black500,
+    focusShadow: "0px 0px 0px 4px #CCCCCC"
+  },
+  {
+    variant: "danger",
+    color: c.black.white,
+    backgroundColor: c.danger.danger800,
+    border: `1px solid ${c.danger.dangerA11y}`,
+    hoverBg: c.danger.danger600,
+    activeBg: c.danger.danger900,
+    focusShadow: "0px 0px 0px 4px #FFCCD0"
+  }
+];
+var sizeStyle = [
+  { size: "small", height: "40px", padding: "12px 16px", fontSize: 14 },
+  { size: "medium", height: "48px", padding: "15px 24px", fontSize: 16 },
+  { size: "large", height: "56px", padding: "19px 32px", fontSize: 16 }
+];
+var buttonVariants = [
+  ...variantColor.map((v) => ({
+    props: { variant: v.variant },
+    style: {
+      color: v.color,
+      backgroundColor: v.backgroundColor,
+      border: v.border,
+      "&:hover": { backgroundColor: v.hoverBg },
+      "&:active": { backgroundColor: v.activeBg },
+      "&:focus-visible": { boxShadow: v.focusShadow },
+      // 只夾透明度：文字色/底色由 root 提供，覆蓋會擋掉 MUI loading 時隱藏文字的機制
+      "&:disabled": { opacity: 0.4 },
+      // loading spinner 顏色跟隨 variant 文字色（否則 MUI 預設灰 rgba(0,0,0,0.26) 幾乎隱形）
+      "& .MuiButton-loadingIndicator": { color: v.color }
+    }
+  })),
+  ...sizeStyle.map((s) => ({
+    props: { size: s.size },
+    style: { height: s.height, padding: s.padding, fontSize: s.fontSize }
+  }))
+];
+
+// src/theme/typography.styles.ts
+var FONT_SIZE = {
+  d1: "4.5rem",
+  d2: "4rem",
+  d3: "3.5rem",
+  d4: "3rem",
+  h1: "2.5rem",
+  h2: "2rem",
+  h3: "1.75rem",
+  h4: "1.5rem",
+  h5: "1.25rem",
+  h6: "1.125rem",
+  title: "1rem",
+  subtitle: "0.875rem",
+  body1: "1rem",
+  body2: "0.875rem",
+  caption1: "0.75rem",
+  caption2: "0.75rem",
+  small1: "0.6875rem",
+  small2: "0.6875rem",
+  tiny1: "0.625rem",
+  tiny2: "0.625rem",
+  button_l: "1rem",
+  button_s: "0.875rem"
+};
+var LOOSE_BASES = [
+  "title",
+  "subtitle",
+  "body1",
+  "body2",
+  "caption1",
+  "caption2",
+  "small1",
+  "small2",
+  "tiny1",
+  "tiny2"
+];
+var WEIGHT_400 = /* @__PURE__ */ new Set(["body1", "body2", "caption2", "small2", "tiny2"]);
+var LH_125 = /* @__PURE__ */ new Set(["d1", "d2", "d3", "h1", "h2", "h3"]);
+var LH_1125 = /* @__PURE__ */ new Set(["button_l", "button_s"]);
+function baseName(variant) {
+  return variant.endsWith("_loose") ? variant.slice(0, -"_loose".length) : variant;
+}
+function weightOf(variant) {
+  return WEIGHT_400.has(baseName(variant)) ? 400 : 700;
+}
+function lineHeightOf(variant) {
+  if (variant.endsWith("_loose")) return 1.6;
+  if (LH_125.has(variant)) return 1.25;
+  if (LH_1125.has(variant)) return 1.125;
+  return 1.4;
+}
+var ALL_VARIANTS = [
+  "d1",
+  "d2",
+  "d3",
+  "d4",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  ...Object.keys(FONT_SIZE).filter((k) => !/^d\d|^h\d/.test(k)),
+  ...LOOSE_BASES.map((b) => `${b}_loose`)
+];
+var SWAP_TYPOGRAPHY_VARIANTS = Array.from(new Set(ALL_VARIANTS));
+var swapTypographyVariants = Object.fromEntries(
+  SWAP_TYPOGRAPHY_VARIANTS.map((v) => [
+    v,
+    {
+      fontSize: FONT_SIZE[baseName(v)],
+      fontWeight: weightOf(v),
+      lineHeight: lineHeightOf(v),
+      letterSpacing: "0em"
+    }
+  ])
+);
+var swapTypographyVariantMapping = Object.fromEntries(
+  SWAP_TYPOGRAPHY_VARIANTS.map((v) => {
+    if (/^h[1-6]$/.test(v)) return [v, v];
+    if (/^d[1-4]$/.test(v)) return [v, "h1"];
+    if (v.startsWith("button")) return [v, "span"];
+    return [v, "p"];
+  })
+);
+
+// src/theme/createSwapTheme.ts
+var c2 = swapColors;
+function createSwapTheme(options) {
+  const base = {
+    cssVariables: true,
+    palette: {
+      primary: { main: c2.primary.primary400 },
+      error: { main: c2.danger.danger800 },
+      success: { main: c2.success.success500 },
+      warning: { main: c2.secondary.secondary500 },
+      swap: c2
+    },
+    breakpoints: {
+      values: {
+        xxs: swapBreakpoints.xxs,
+        xs: swapBreakpoints.xs,
+        sm: swapBreakpoints.sm,
+        md: swapBreakpoints.md,
+        lg: swapBreakpoints.lg,
+        xl: swapBreakpoints.xl,
+        xxl: swapBreakpoints.xxl
+      }
+    },
+    shape: { borderRadius: 8 },
+    typography: { fontFamily: swapFontFamily, ...swapTypographyVariants },
+    components: {
+      MuiTypography: {
+        defaultProps: { variantMapping: swapTypographyVariantMapping }
+      },
+      MuiSkeleton: {
+        styleOverrides: {
+          root: { backgroundColor: c2.black.black400, transform: "unset" }
+        }
+      },
+      MuiPagination: {
+        defaultProps: { shape: "rounded", variant: "outlined" }
+      },
+      MuiPaginationItem: {
+        styleOverrides: {
+          root: {
+            minWidth: 24,
+            width: 24,
+            height: 24,
+            borderRadius: "5px",
+            borderColor: c2.black.black500,
+            color: c2.black.black800,
+            padding: 0,
+            margin: "0px 2px",
+            fontSize: 11,
+            fontWeight: 700,
+            lineHeight: 1.4,
+            transition: "color 250ms, background-color 250ms",
+            "&:hover": {
+              borderColor: c2.black.black800,
+              backgroundColor: c2.black.white
+            },
+            "&.Mui-selected": {
+              color: c2.black.white,
+              backgroundColor: c2.primary.primary400,
+              border: "none",
+              boxShadow: swapShadows.s,
+              "&:hover": { backgroundColor: c2.primary.primary400 }
+            }
+          }
+        }
+      },
+      MuiButton: {
+        defaultProps: {
+          variant: "primary",
+          disableElevation: true,
+          disableFocusRipple: true
+        },
+        styleOverrides: {
+          root: { ...buttonRootStyles, variants: buttonVariants }
+        }
+      },
+      MuiCard: {
+        styleOverrides: {
+          root: { borderRadius: "18px", border: "1px solid rgba(0, 0, 0, 0.13)" }
+        }
+      },
+      MuiPaper: {
+        styleOverrides: {
+          root: { border: `1px solid ${c2.black.black500}` },
+          rounded: { borderRadius: swapRadius.m },
+          elevation8: { boxShadow: swapShadows.m }
+        }
+      },
+      MuiOutlinedInput: {
+        styleOverrides: { root: { borderRadius: swapRadius.m } }
+      },
+      MuiFormHelperText: {
+        styleOverrides: {
+          root: {
+            marginTop: 4,
+            fontSize: 14,
+            color: c2.black.black700,
+            "&.Mui-error": { color: c2.danger.danger800 }
+          }
+        }
+      },
+      MuiIconButton: {
+        styleOverrides: { root: { padding: 0 } }
+      }
+    }
+  };
+  return (0, import_styles.createTheme)(deepmerge(base, options ?? {}));
+}
+
+// src/theme/SWAPThemeProvider.tsx
+var import__ = require("@fontsource/m-plus-rounded-1c/400.css");
+var import__2 = require("@fontsource/m-plus-rounded-1c/700.css");
+var import__3 = require("@fontsource/noto-sans-tc/400.css");
+var import__4 = require("@fontsource/noto-sans-tc/700.css");
+var import_jsx_runtime = require("react/jsx-runtime");
+var defaultTheme = createSwapTheme();
+var SWAPThemeProvider = ({ theme, children }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles2.ThemeProvider, { theme: theme ?? defaultTheme, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_CssBaseline.default, {}),
+  children
+] });
+
+// src/components/Typography.tsx
+var React2 = __toESM(require("react"), 1);
+var import_Typography = __toESM(require("@mui/material/Typography"), 1);
+
+// src/theme/textColor.ts
+var c3 = swapColors;
+var swapTokenMap = {
+  ...c3.primary,
+  ...c3.secondary,
+  ...c3.danger,
+  ...c3.success,
+  ...c3.black
+};
+function resolveSwapTextColor(color, mode) {
+  const dark = mode === "dark";
+  if (color === "primary") return dark ? c3.black.white : c3.black.black1000;
+  if (color === "secondary") return dark ? c3.black.black500 : c3.black.black800;
+  if (color === "tertiary") return dark ? c3.black.black600 : c3.black.black700;
+  if (color && color in swapTokenMap) return swapTokenMap[color];
+  return c3.black.black1000;
+}
+
+// src/components/Typography.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Typography = React2.memo(function Typography2({
+  variant = "body1",
+  color,
+  mode,
+  children,
+  style
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_Typography.default, { variant, sx: { color: resolveSwapTextColor(color, mode) }, style, children });
+});
+var Typography_default = Typography;
+
+// src/components/Chip.tsx
+var React3 = __toESM(require("react"), 1);
+var import_Box = __toESM(require("@mui/material/Box"), 1);
+
+// src/utils/cssSize.ts
+function cssSize(v) {
+  if (typeof v === "string" && /^\d+(\.\d+)?$/.test(v.trim())) return Number(v);
+  return v;
+}
+
+// src/components/Chip.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var SHADE = {
+  neutral: { fill: swapColors.black.black300, border: swapColors.black.black500, text: swapColors.black.black800 },
+  primary: { fill: swapColors.primary.primary50, border: swapColors.primary.primary800, text: swapColors.primary.primary800 },
+  success: { fill: swapColors.success.success50, border: swapColors.success.success800, text: swapColors.success.success800 },
+  danger: { fill: swapColors.danger.danger50, border: swapColors.danger.danger800, text: swapColors.danger.danger800 }
+};
+var successIcon = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  "path",
+  {
+    d: "M14 4.66666L6 12.6667L2.33333 9L3.27333 8.06L6 10.78L13.06 3.72666L14 4.66666Z",
+    fill: "#00821E"
+  }
+) });
+var Chip = React3.forwardRef(function Chip2({ variant = "primary", outlined, contained, width, height, label, icon, sx, ...rest }, ref) {
+  const s = SHADE[variant];
+  const isOutlined = outlined || !contained;
+  const ourStyles = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: "4px",
+    fontSize: "0.75rem",
+    lineHeight: "17px",
+    fontWeight: 700,
+    width: cssSize(width) ?? "fit-content",
+    height: cssSize(height) ?? 24,
+    padding: isOutlined ? "0px 8px" : "0px 9px",
+    backgroundColor: isOutlined ? swapColors.black.white : s.fill,
+    border: isOutlined ? `1px solid ${s.border}` : "none",
+    color: s.text
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_Box.default, { ref, sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]], ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_Box.default, { component: "span", sx: { marginRight: variant === "success" ? "4px" : 0 }, children: label }),
+    variant === "success" && !icon ? successIcon : icon
+  ] });
+});
+var Chip_default = Chip;
+
+// src/components/CircularProgress.tsx
+var React4 = __toESM(require("react"), 1);
+var import_CircularProgress = __toESM(require("@mui/material/CircularProgress"), 1);
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var CircularProgress = React4.forwardRef(
+  function CircularProgress2({ dark, size = 20, thickness = 5, style, ...rest }, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { ref, style: { position: "relative", width: cssSize(size), height: cssSize(size), ...style }, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        import_CircularProgress.default,
+        {
+          variant: "determinate",
+          value: 100,
+          size,
+          thickness,
+          style: {
+            position: "absolute",
+            left: 0,
+            top: 0,
+            color: dark ? swapColors.black.white : swapColors.black.black500,
+            opacity: dark ? 0.4 : 1
+          }
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        import_CircularProgress.default,
+        {
+          variant: "indeterminate",
+          size,
+          thickness,
+          style: {
+            position: "absolute",
+            left: 0,
+            top: 0,
+            color: dark ? swapColors.black.white : swapColors.primary.primary800
+          }
+        }
+      )
+    ] });
+  }
+);
+var CircularProgress_default = CircularProgress;
+
+// src/components/Tooltip.tsx
+var import_Tooltip = __toESM(require("@mui/material/Tooltip"), 1);
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function resolveMargin(p) {
+  if (p.margin) return p.margin;
+  if (p.marginTop) return `0px 0px ${p.marginTop}px 0px`;
+  if (p.marginBottom) return `${p.marginBottom}px 0px 0px 0px`;
+  if (p.marginRight) return `0px 0px 0px ${p.marginRight}px`;
+  if (p.marginLeft) return `0px ${p.marginLeft}px 0px 0px`;
+  return "10px 0px";
+}
+var Tooltip = (props) => {
+  const {
+    dark,
+    light,
+    arrow,
+    margin,
+    marginTop,
+    marginBottom,
+    marginRight,
+    marginLeft,
+    width = 240,
+    children,
+    childrenStyle,
+    slotProps: userSlotProps,
+    ...other
+  } = props;
+  const bg = light ? swapColors.black.white : swapColors.black.black900;
+  const fg = light ? swapColors.black.black800 : swapColors.black.white;
+  const ourTooltipSx = {
+    margin: resolveMargin(props),
+    backgroundColor: bg,
+    color: fg,
+    padding: arrow ? "7.5px 12px" : "12px",
+    boxShadow: swapShadows.m,
+    border: light ? `1px solid ${swapColors.black.black500}` : "none",
+    maxWidth: cssSize(width),
+    fontSize: 12,
+    lineHeight: 1.4,
+    fontWeight: arrow ? 700 : 400
+  };
+  const us = userSlotProps ?? {};
+  const asArr = (v) => Array.isArray(v) ? v : v ? [v] : [];
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    import_Tooltip.default,
+    {
+      ...other,
+      arrow,
+      slotProps: {
+        ...us,
+        tooltip: { ...us.tooltip, sx: [ourTooltipSx, ...asArr(us.tooltip?.sx)] },
+        arrow: { ...us.arrow, sx: [{ color: bg }, ...asArr(us.arrow?.sx)] }
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        "span",
+        {
+          style: {
+            width: "fit-content",
+            height: "fit-content",
+            display: "inline-flex",
+            alignItems: "center",
+            justifyContent: "center",
+            ...childrenStyle
+          },
+          children
+        }
+      )
+    }
+  );
+};
+var Tooltip_default = Tooltip;
+
+// src/components/Container.tsx
+var React5 = __toESM(require("react"), 1);
+var import_Box2 = __toESM(require("@mui/material/Box"), 1);
+var import_useMediaQuery = __toESM(require("@mui/material/useMediaQuery"), 1);
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var MAXW = { lg: 960, xl: 1140, xxl: 1320 };
+var PAD = { xxs: "0px 8px", xs: "0px 16px", sm: "0px 24px", md: "0px 24px" };
+var Container = React5.forwardRef(function Container2({ children, maxWidth, padding, sx, ...rest }, ref) {
+  const upXXL = (0, import_useMediaQuery.default)(`(min-width:${swapBreakpoints.xxl}px)`);
+  const upXL = (0, import_useMediaQuery.default)(`(min-width:${swapBreakpoints.xl}px)`);
+  const upLG = (0, import_useMediaQuery.default)(`(min-width:${swapBreakpoints.lg}px)`);
+  const upMD = (0, import_useMediaQuery.default)(`(min-width:${swapBreakpoints.md}px)`);
+  const upSM = (0, import_useMediaQuery.default)(`(min-width:${swapBreakpoints.sm}px)`);
+  const upXS = (0, import_useMediaQuery.default)(`(min-width:${swapBreakpoints.xs}px)`);
+  const resolvedMaxWidth = typeof maxWidth === "number" ? maxWidth : maxWidth ? MAXW[maxWidth] : upXXL ? 1320 : upXL ? 1140 : upLG ? 960 : void 0;
+  const resolvedPadding = typeof padding === "number" ? padding : padding ? PAD[padding] : upXXL || upXL || upLG ? "0px 0px" : upMD || upSM ? "0px 24px" : upXS ? "0px 16px" : "0px 8px";
+  const ourStyles = {
+    marginLeft: "auto",
+    marginRight: "auto",
+    width: "100%",
+    maxWidth: resolvedMaxWidth,
+    padding: resolvedPadding
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_Box2.default, { ref, sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]], ...rest, children });
+});
+var Container_default = Container;
+
+// src/components/Paper.tsx
+var React6 = __toESM(require("react"), 1);
+var import_Paper = __toESM(require("@mui/material/Paper"), 1);
+var import_useMediaQuery2 = __toESM(require("@mui/material/useMediaQuery"), 1);
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var Paper = React6.forwardRef(function Paper2({ width, height, sx, ...rest }, ref) {
+  const upSM = (0, import_useMediaQuery2.default)(`(min-width:${swapBreakpoints.sm}px)`);
+  const upXS = (0, import_useMediaQuery2.default)(`(min-width:${swapBreakpoints.xs}px)`);
+  const padding = upSM ? 40 : upXS ? 24 : 16;
+  const ourStyles = {
+    boxShadow: swapShadows.xl,
+    borderRadius: "12px",
+    border: `1px solid ${swapColors.black.black500}`,
+    width: cssSize(width) ?? "100%",
+    height: cssSize(height) ?? "100%",
+    padding: `${padding}px`
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    import_Paper.default,
+    {
+      ref,
+      variant: "outlined",
+      sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+      ...rest
+    }
+  );
+});
+var Paper_default = Paper;
+
+// src/components/Link.tsx
+var React7 = __toESM(require("react"), 1);
+var import_Link = __toESM(require("@mui/material/Link"), 1);
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var Link = React7.forwardRef(function Link2({ color, sx, ...rest }, ref) {
+  const ourStyles = {
+    cursor: "pointer",
+    color: color && swapTokenMap[color] || swapColors.black.black1000,
+    fontWeight: 700,
+    borderRadius: "4px",
+    lineHeight: 1.4,
+    outline: "none",
+    boxSizing: "border-box",
+    "&:focus-visible": {
+      padding: "8px",
+      border: `1px solid ${swapColors.primary.primary400}`
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    import_Link.default,
+    {
+      ref,
+      underline: "hover",
+      tabIndex: 0,
+      sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+      ...rest
+    }
+  );
+});
+var Link_default = Link;
+
+// src/components/IconButton.tsx
+var React8 = __toESM(require("react"), 1);
+var import_IconButton = __toESM(require("@mui/material/IconButton"), 1);
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var resolve = (v) => v ? swapTokenMap[v] ?? v : void 0;
+var IconButton = React8.forwardRef(function IconButton2({ width = 32, height = 32, hoverColor, hoverIconColor, sx, ...rest }, ref) {
+  const hoverBg = resolve(hoverColor) ?? swapColors.black.black400;
+  const hoverFill = resolve(hoverIconColor);
+  const ourStyles = {
+    width: cssSize(width),
+    height: cssSize(height),
+    borderRadius: "8px",
+    "&:hover": {
+      backgroundColor: hoverBg,
+      ...hoverFill ? { "& svg path": { fill: hoverFill } } : {}
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_IconButton.default, { ref, sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]], ...rest });
+});
+var IconButton_default = IconButton;
+
+// src/components/Breadcrumb.tsx
+var React9 = __toESM(require("react"), 1);
+var import_Menu = __toESM(require("@mui/material/Menu"), 1);
+var import_MenuItem = __toESM(require("@mui/material/MenuItem"), 1);
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var Sep = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Typography_default, { variant: "body2", style: { margin: "0 8px" }, children });
+var dotsPath = "M1.946 16.182C2.45 16.182 2.87 15.79 2.87 15.216C2.87 14.642 2.45 14.222 1.946 14.222C1.442 14.222 1.022 14.642 1.022 15.216C1.022 15.79 1.442 16.182 1.946 16.182ZM5.84248 16.182C6.34648 16.182 6.76648 15.79 6.76648 15.216C6.76648 14.642 6.34648 14.222 5.84248 14.222C5.33848 14.222 4.91848 14.642 4.91848 15.216C4.91848 15.79 5.33848 16.182 5.84248 16.182ZM9.73897 16.182C10.243 16.182 10.663 15.79 10.663 15.216C10.663 14.642 10.243 14.222 9.73897 14.222C9.23497 14.222 8.81497 14.642 8.81497 15.216C8.81497 15.79 9.23497 16.182 9.73897 16.182Z";
+var ThreeDots = ({ hover }) => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("svg", { width: "12", height: "20", viewBox: "0 0 12 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", { d: dotsPath, fill: "#4B4B4B" }),
+  hover && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", { d: "M0 18.1H11.685V18.8H0V18.1Z", fill: "#4B4B4B" })
+] });
+var Breadcrumb = React9.forwardRef(function Breadcrumb2({ maxItems, separator = "/", children, style, ...rest }, ref) {
+  const [anchorEl, setAnchorEl] = React9.useState(null);
+  const [hoverDots, setHoverDots] = React9.useState(false);
+  const items = React9.Children.toArray(children);
+  const collapsed = !!maxItems && items.length > maxItems;
+  const tail = collapsed ? items.slice(items.length - maxItems + 1) : items;
+  const hidden = collapsed ? items.slice(1, items.length - maxItems + 1) : [];
+  const row = (node, isLast, key) => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    "div",
+    {
+      style: { display: "flex", alignItems: "center", fontSize: 14, fontWeight: isLast ? 700 : 400 },
+      children: [
+        node,
+        !isLast && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Sep, { children: separator })
+      ]
+    },
+    key
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { ref, style: { display: "flex", alignItems: "center", ...style }, ...rest, children: [
+    collapsed ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { style: { display: "flex", alignItems: "center", fontSize: 14 }, children: [
+        items[0],
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Sep, { children: separator }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          "div",
+          {
+            "data-testid": "breadcrumb-ellipsis",
+            onClick: (e) => setAnchorEl(e.currentTarget),
+            onMouseEnter: () => setHoverDots(true),
+            onMouseLeave: () => setHoverDots(false),
+            style: { cursor: "pointer" },
+            children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ThreeDots, { hover: hoverDots })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Sep, { children: separator })
+      ] }),
+      tail.map((node, i) => row(node, i === tail.length - 1, i))
+    ] }) : items.map((node, i) => row(node, i === items.length - 1, i)),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_Menu.default, { anchorEl, open: Boolean(anchorEl), onClose: () => setAnchorEl(null), children: hidden.map((node, i) => {
+      const el = node;
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+        import_MenuItem.default,
+        {
+          onClick: () => {
+            const { href, target } = el.props;
+            if (href) {
+              if (target === "_blank") window.open(href);
+              else window.location.href = href;
+            }
+            setAnchorEl(null);
+          },
+          children: el.props.children
+        },
+        i
+      );
+    }) })
+  ] });
+});
+var Breadcrumb_default = Breadcrumb;
+
+// src/components/BreadcrumbItem.tsx
+var React10 = __toESM(require("react"), 1);
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var BreadcrumbItem = React10.forwardRef(
+  function BreadcrumbItem2({ last, sx, ...rest }, ref) {
+    const ourStyles = {
+      fontWeight: last ? 700 : 400,
+      ...last ? { cursor: "unset", textDecoration: "none", "&:hover": { textDecoration: "none" } } : {}
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      Link_default,
+      {
+        ref,
+        color: last ? "black1000" : "black800",
+        sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+        ...rest
+      }
+    );
+  }
+);
+var BreadcrumbItem_default = BreadcrumbItem;
+
+// src/components/TextField.tsx
+var React11 = __toESM(require("react"), 1);
+var import_TextField = __toESM(require("@mui/material/TextField"), 1);
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var TextField = React11.forwardRef(function TextField2({ width, height, sx, ...rest }, ref) {
+  const resolvedHeight = cssSize(height) ?? (rest.multiline ? void 0 : 48);
+  const ourStyles = {
+    "& .MuiFormHelperText-root": { marginLeft: "16px", marginRight: "16px" },
+    "& .MuiOutlinedInput-root": {
+      width: cssSize(width),
+      height: resolvedHeight,
+      padding: "0px 16px",
+      backgroundColor: "white",
+      fontSize: 16,
+      fontWeight: 400,
+      "& fieldset": { borderColor: swapColors.black.black500, "& legend": { width: "0.01px" } },
+      "&.Mui-focused": {
+        boxShadow: "0px 0px 0px 4px #D7DFF8",
+        "& fieldset": { border: `1px solid ${swapColors.primary.primary400} !important` },
+        "&.Mui-error": {
+          boxShadow: "none",
+          "& fieldset": { border: `1px solid ${swapColors.danger.danger800} !important` }
+        }
+      },
+      "&.Mui-error fieldset": { border: `1px solid ${swapColors.danger.danger800} !important` }
+    },
+    "& .MuiInputBase-input": {
+      padding: 0,
+      "&::placeholder": { color: swapColors.black.black700, opacity: 1 },
+      "&:-webkit-autofill": { WebkitBoxShadow: "0 0 0 100px #FFFFFF inset" }
+    },
+    // resting label 垂直置中隨欄位高度自適應（MUI 預設偏移是按 56px 高算的，
+    // 48px 下會偏下 ~3.5px；label 行高約 23px）
+    ...typeof resolvedHeight === "number" ? {
+      "& .MuiInputLabel-root:not(.MuiInputLabel-shrink)": {
+        transform: `translate(14px, ${Math.round((resolvedHeight - 23) / 2)}px)`
+      }
+    } : {},
+    "& .MuiInputLabel-root.MuiInputLabel-shrink": {
+      transform: "translate(14px, -10px)",
+      backgroundColor: "white",
+      padding: "0 4px",
+      fontSize: 14,
+      fontWeight: 700,
+      color: swapColors.black.black800,
+      "&.Mui-focused, &.Mui-error": { color: swapColors.black.black800 }
+    },
+    // select 模式（v1 selectRoot）
+    "& .MuiSelect-select": {
+      borderRadius: "8px",
+      fontWeight: 400,
+      minWidth: rest.fullWidth ? "100%" : "unset",
+      display: "flex",
+      alignItems: "center",
+      "&:focus": { backgroundColor: "white", borderRadius: "8px" }
+    },
+    "& .MuiSelect-icon": { color: swapColors.black.black700 }
+  };
+  const slotProps = rest.select ? {
+    ...rest.slotProps,
+    select: {
+      MenuProps: { anchorOrigin: { vertical: -9, horizontal: -16 } },
+      ...rest.slotProps?.select
+    }
+  } : rest.slotProps;
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    import_TextField.default,
+    {
+      ref,
+      variant: "outlined",
+      sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+      ...rest,
+      slotProps
+    }
+  );
+});
+var TextField_default = TextField;
+
+// src/components/CheckBox.tsx
+var React12 = __toESM(require("react"), 1);
+var import_Checkbox = __toESM(require("@mui/material/Checkbox"), 1);
+var import_FormControlLabel = __toESM(require("@mui/material/FormControlLabel"), 1);
+var import_Box3 = __toESM(require("@mui/material/Box"), 1);
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var checkSvg = /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { width: "17", height: "16", viewBox: "0 0 17 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M1.5 8.5L7 13L15 2", stroke: "white", strokeWidth: "3", strokeLinecap: "round" }) });
+function iconSx(disableHover) {
+  return {
+    position: "absolute",
+    width: 24,
+    height: 24,
+    borderRadius: "4px",
+    backgroundColor: swapColors.black.white,
+    border: `1px solid ${swapColors.black.black500}`,
+    "input:hover ~ &": {
+      border: `1px solid ${disableHover ? swapColors.black.black500 : swapColors.black.black1000}`
+    },
+    "input:focus-visible ~ &": { boxShadow: "0px 0px 0px 4px #D7DFF8" },
+    "input:disabled ~ &": { opacity: 0.4 },
+    "input:disabled:hover ~ &": { border: `1px solid ${swapColors.black.black500}` }
+  };
+}
+function checkedIconSx(disableHover) {
+  return {
+    position: "absolute",
+    width: 24,
+    height: 24,
+    borderRadius: "4px",
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    backgroundColor: swapColors.primary.primary400,
+    border: `1px solid ${swapColors.primary.primary600}`,
+    "input:hover ~ &": {
+      border: `1px solid ${disableHover ? swapColors.primary.primary600 : swapColors.primary.primaryA11y}`
+    },
+    "input:focus-visible ~ &": { boxShadow: "0px 0px 0px 4px #D7DFF8" },
+    "input:disabled ~ &": { opacity: 0.4 },
+    "input:disabled:hover ~ &": { border: `1px solid ${swapColors.primary.primary600}` }
+  };
+}
+var CheckBox = React12.forwardRef(function CheckBox2({ disableHover, label, labelPlacement, checkedIcon, icon, sx, ...rest }, ref) {
+  const ourStyles = {
+    width: 40,
+    height: 40,
+    boxShadow: "none",
+    "&:hover, &.Mui-checked:hover": {
+      backgroundColor: disableHover ? "unset" : swapColors.black.black300
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    import_FormControlLabel.default,
+    {
+      label,
+      labelPlacement,
+      style: { marginRight: 0 },
+      control: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        import_Checkbox.default,
+        {
+          ref,
+          disableFocusRipple: true,
+          disableTouchRipple: true,
+          sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+          checkedIcon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_Box3.default, { component: "span", sx: checkedIconSx(disableHover), children: checkedIcon ?? checkSvg }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_Box3.default, { component: "span", sx: iconSx(disableHover), children: icon ?? null }),
+          ...rest
+        }
+      )
+    }
+  );
+});
+var CheckBox_default = CheckBox;
+
+// src/components/RadioButton.tsx
+var React13 = __toESM(require("react"), 1);
+var import_Radio = __toESM(require("@mui/material/Radio"), 1);
+var import_FormControlLabel2 = __toESM(require("@mui/material/FormControlLabel"), 1);
+var import_Box4 = __toESM(require("@mui/material/Box"), 1);
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var dotSvg = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("circle", { cx: "5", cy: "5", r: "5", fill: "white" }) });
+function iconSx2(disableHover) {
+  return {
+    position: "absolute",
+    width: 24,
+    height: 24,
+    borderRadius: "100px",
+    backgroundColor: swapColors.black.white,
+    border: `1px solid ${swapColors.black.black500}`,
+    "input:hover ~ &": {
+      border: `1px solid ${disableHover ? swapColors.black.black500 : swapColors.black.black1000}`
+    },
+    "input:focus-visible ~ &": { boxShadow: "0px 0px 0px 4px #D7DFF8" },
+    "input:disabled ~ &": { opacity: 0.4 },
+    "input:disabled:hover ~ &": { border: `1px solid ${swapColors.black.black500}` }
+  };
+}
+function checkedIconSx2(disableHover) {
+  return {
+    position: "absolute",
+    width: 24,
+    height: 24,
+    borderRadius: "100px",
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    backgroundColor: swapColors.primary.primary400,
+    border: `1px solid ${swapColors.primary.primary600}`,
+    "input:hover ~ &": {
+      border: `1px solid ${disableHover ? swapColors.primary.primary600 : swapColors.primary.primaryA11y}`
+    },
+    "input:focus-visible ~ &": { boxShadow: "0px 0px 0px 4px #D7DFF8" },
+    "input:disabled ~ &": { opacity: 0.4 },
+    "input:disabled:hover ~ &": { border: `1px solid ${swapColors.primary.primary600}` }
+  };
+}
+var RadioButton = React13.forwardRef(function RadioButton2({ disableHover, label, labelPlacement, sx, ...rest }, ref) {
+  const ourStyles = {
+    width: 40,
+    height: 40,
+    boxShadow: "none",
+    "&:hover, &.Mui-checked:hover": {
+      backgroundColor: disableHover ? "unset" : swapColors.black.black300
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    import_FormControlLabel2.default,
+    {
+      label,
+      labelPlacement,
+      style: { marginRight: 0 },
+      control: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        import_Radio.default,
+        {
+          ref,
+          disableFocusRipple: true,
+          disableTouchRipple: true,
+          sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+          checkedIcon: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_Box4.default, { component: "span", sx: checkedIconSx2(disableHover), children: dotSvg }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_Box4.default, { component: "span", sx: iconSx2(disableHover) }),
+          ...rest
+        }
+      )
+    }
+  );
+});
+var RadioButton_default = RadioButton;
+
+// src/components/Switch.tsx
+var React14 = __toESM(require("react"), 1);
+var import_Switch = __toESM(require("@mui/material/Switch"), 1);
+var import_Fade = __toESM(require("@mui/material/Fade"), 1);
+var import_Box5 = __toESM(require("@mui/material/Box"), 1);
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var checkSvg2 = /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  "path",
+  {
+    d: "M4.5 10.21L1.395 7.105L2.81 5.69L4.5 7.385L9.44 2.44L10.855 3.855L4.5 10.21Z",
+    fill: "#4862CC"
+  }
+) });
+var Switch = React14.forwardRef(function Switch2({ disabled, sx, ...rest }, ref) {
+  const ourStyles = {
+    width: 40,
+    height: 24,
+    padding: 0,
+    "& .MuiSwitch-switchBase": {
+      padding: "2px",
+      transition: "left 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms",
+      "&.Mui-checked": {
+        transform: "translateX(16px)",
+        "& + .MuiSwitch-track": {
+          border: `1px solid ${swapColors.primary.primary800}`,
+          backgroundColor: swapColors.primary.primary400,
+          opacity: 1
+        },
+        "&:hover + .MuiSwitch-track": { backgroundColor: swapColors.primary.primary600 }
+      },
+      "&:hover + .MuiSwitch-track": { backgroundColor: swapColors.black.black800 },
+      "&.Mui-disabled + .MuiSwitch-track": {
+        opacity: 1,
+        border: `1px solid ${swapColors.black.black800}`,
+        backgroundColor: swapColors.black.black600
+      }
+    },
+    "& .MuiSwitch-thumb": {
+      width: 20,
+      height: 20,
+      backgroundColor: "white",
+      boxShadow: "0px 2px 2px rgba(0, 0, 0, 0.15)"
+    },
+    "& .MuiSwitch-track": {
+      borderRadius: "12px",
+      border: `1px solid ${swapColors.black.black800}`,
+      backgroundColor: swapColors.black.black600,
+      opacity: 1,
+      transition: "all 200ms ease-out"
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    import_Box5.default,
+    {
+      component: "span",
+      tabIndex: 0,
+      sx: {
+        display: "inline-block",
+        width: "fit-content",
+        borderRadius: "12px",
+        opacity: disabled ? 0.4 : 1,
+        "&:focus-visible": {
+          boxShadow: disabled ? "unset" : "0px 0px 0px 4px #D7DFF8",
+          outline: "none"
+        }
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        import_Switch.default,
+        {
+          ref,
+          disabled,
+          disableRipple: true,
+          sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+          checkedIcon: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            import_Box5.default,
+            {
+              sx: {
+                width: 20,
+                height: 20,
+                display: "flex",
+                justifyContent: "center",
+                alignItems: "center",
+                backgroundColor: "white",
+                borderRadius: "50%",
+                boxShadow: "0px 2px 2px rgba(0, 0, 0, 0.15)"
+              },
+              children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_Fade.default, { in: true, timeout: { enter: 200, exit: 200 }, children: checkSvg2 })
+            }
+          ),
+          ...rest
+        }
+      )
+    }
+  );
+});
+var Switch_default = Switch;
+
+// src/components/Select.tsx
+var import_Select = __toESM(require("@mui/material/Select"), 1);
+var import_FormControl = __toESM(require("@mui/material/FormControl"), 1);
+var import_FormHelperText = __toESM(require("@mui/material/FormHelperText"), 1);
+var import_InputLabel = __toESM(require("@mui/material/InputLabel"), 1);
+var import_OutlinedInput = __toESM(require("@mui/material/OutlinedInput"), 1);
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var Select = ({
+  children,
+  style,
+  value,
+  onChange,
+  defaultValue,
+  error,
+  disabled,
+  type,
+  InputProps,
+  autoFocus,
+  placeholder,
+  fullWidth,
+  required,
+  helperText,
+  width,
+  height,
+  horizontal = "left",
+  vertical = "bottom",
+  open,
+  placeholderStyle,
+  selectStyle,
+  helperTextStyle,
+  onClick,
+  transformOrigin,
+  paddingTop,
+  paddingLeft,
+  dropdown
+}) => {
+  const hasCustomPadding = Boolean(paddingTop || paddingLeft);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+    import_FormControl.default,
+    {
+      variant: "outlined",
+      style,
+      sx: { width: cssSize(width) ?? "100%" },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          import_InputLabel.default,
+          {
+            style: placeholderStyle,
+            sx: {
+              "&.MuiInputLabel-outlined:not(.MuiInputLabel-shrink)": {
+                transform: hasCustomPadding ? `translate(${(paddingLeft ?? 0) - 4}px, ${(paddingTop ?? 0) + 2}px) scale(1)` : "translate(12px, 14px) scale(1)"
+              },
+              "&.MuiInputLabel-shrink": {
+                width: "fit-content",
+                padding: "0 4px",
+                backgroundColor: "white",
+                fontSize: 12,
+                fontWeight: 700,
+                color: swapColors.black.black800,
+                "&.Mui-focused": { fontWeight: 700, color: swapColors.black.black800 }
+              }
+            },
+            children: placeholder
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          import_Select.default,
+          {
+            style: selectStyle,
+            open,
+            value,
+            onChange,
+            label: placeholder,
+            defaultValue,
+            error,
+            disabled,
+            type,
+            autoFocus,
+            required,
+            fullWidth,
+            onClick,
+            inputProps: InputProps,
+            input: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+              import_OutlinedInput.default,
+              {
+                sx: {
+                  "& .MuiOutlinedInput-notchedOutline": { borderColor: swapColors.black.black500 },
+                  "&:hover": {
+                    borderColor: swapColors.black.black1000,
+                    "& svg": { color: swapColors.black.black1000 }
+                  },
+                  "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
+                    borderColor: swapColors.black.black1000,
+                    borderWidth: 1
+                  },
+                  "&.Mui-focused svg": { color: swapColors.black.black1000 }
+                }
+              }
+            ),
+            sx: {
+              "& .MuiSelect-select": {
+                height: height ? height - 32 : 16,
+                padding: hasCustomPadding ? `${paddingTop ?? 12}px ${paddingLeft ?? 16}px` : "12px 16px",
+                display: "flex",
+                alignItems: "center",
+                fontSize: dropdown ? 14 : 16,
+                fontWeight: dropdown ? 700 : 400,
+                border: "none",
+                color: swapColors.black.black800,
+                "&:focus": { backgroundColor: "white", color: swapColors.black.black1000 },
+                "&:hover": { backgroundColor: "white", color: swapColors.black.black1000 }
+              },
+              "& .MuiSelect-icon": { color: swapColors.black.black800 }
+            },
+            MenuProps: {
+              transformOrigin,
+              anchorOrigin: { vertical, horizontal },
+              slotProps: { paper: { sx: { marginTop: "8px" } } }
+            },
+            children
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_FormHelperText.default, { style: helperTextStyle, children: helperText })
+      ]
+    }
+  );
+};
+var Select_default = Select;
+
+// src/components/MenuItem.tsx
+var React15 = __toESM(require("react"), 1);
+var import_MenuItem2 = __toESM(require("@mui/material/MenuItem"), 1);
+var import_ListItemIcon = __toESM(require("@mui/material/ListItemIcon"), 1);
+var import_jsx_runtime17 = require("react/jsx-runtime");
+var MenuItem2 = React15.forwardRef(function MenuItem3({
+  children,
+  width,
+  height,
+  hoverBackgroundColor,
+  hoverFontColor,
+  hoverIconColor,
+  rippleColor,
+  iconChildren,
+  button: _button,
+  // v4 遺留 prop，丟棄避免流入 DOM
+  sx,
+  ...rest
+}, ref) {
+  const ourStyles = {
+    fontSize: 14,
+    fontWeight: 700,
+    width: cssSize(width),
+    minHeight: cssSize(height),
+    "&:focus": { backgroundColor: "unset" },
+    "&:hover": {
+      backgroundColor: hoverBackgroundColor ?? swapColors.primary.primary50,
+      color: hoverFontColor ?? swapColors.primary.primary800,
+      "& svg path": { fill: hoverIconColor ?? swapColors.primary.primary800 }
+    },
+    "& span": { color: rippleColor ?? void 0 }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_MenuItem2.default, { ref, sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]], ...rest, children: [
+    children,
+    iconChildren != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_ListItemIcon.default, { style: { justifyContent: "flex-end" }, children: iconChildren })
+  ] });
+});
+var MenuItem_default = MenuItem2;
+
+// src/components/Tab.tsx
+var React16 = __toESM(require("react"), 1);
+var import_Tab = __toESM(require("@mui/material/Tab"), 1);
+var import_Box6 = __toESM(require("@mui/material/Box"), 1);
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var Tab = React16.forwardRef(function Tab2({ label, selected, width, height, margin, fontSize, noIndicator, animation, sx, ...rest }, ref) {
+  const ourStyles = {
+    minWidth: 0,
+    minHeight: 0,
+    padding: 0,
+    margin: margin ?? "0px 12px",
+    fontWeight: 700,
+    fontSize: fontSize ?? 14,
+    lineHeight: 1.4,
+    opacity: 1,
+    color: swapColors.black.black700,
+    "&:hover": { color: "#000000" },
+    "&.Mui-selected": { color: "#000000" }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    import_Tab.default,
+    {
+      ref,
+      disableRipple: true,
+      sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+      label: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+        import_Box6.default,
+        {
+          sx: {
+            width: cssSize(width) ?? 56,
+            height: cssSize(height) ?? 56,
+            display: "flex",
+            justifyContent: "center",
+            alignItems: "center",
+            position: "relative"
+          },
+          children: [
+            label,
+            selected && !noIndicator ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+              import_Box6.default,
+              {
+                sx: {
+                  height: "4px",
+                  width: "100%",
+                  backgroundColor: swapColors.primary.primary400,
+                  position: "absolute",
+                  bottom: 0,
+                  borderRadius: "100px 100px 0px 0px",
+                  ...animation ? {
+                    animation: "swap-tab-selected 300ms",
+                    "@keyframes swap-tab-selected": {
+                      from: { width: 0 },
+                      to: { width: "100%" }
+                    }
+                  } : {}
+                }
+              }
+            ) : null
+          ]
+        }
+      ),
+      ...rest
+    }
+  );
+});
+var Tab_default = Tab;
+
+// src/components/Tabs.tsx
+var React17 = __toESM(require("react"), 1);
+var import_Tabs = __toESM(require("@mui/material/Tabs"), 1);
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var Tabs = React17.forwardRef(function Tabs2({ children, sx, ...rest }, ref) {
+  const ourStyles = {
+    "& .MuiTabs-indicator": { backgroundColor: "transparent" }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_Tabs.default, { ref, sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]], ...rest, children });
+});
+var Tabs_default = Tabs;
+
+// src/components/TabPanel.tsx
+var import_Box7 = __toESM(require("@mui/material/Box"), 1);
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var TabPanel = ({ children, value, index, ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  "div",
+  {
+    role: "tabpanel",
+    hidden: value !== index,
+    id: `scrollable-auto-tabpanel-${index}`,
+    "aria-labelledby": `scrollable-auto-tab-${index}`,
+    ...rest,
+    children: value === index && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_Box7.default, { children })
+  }
+);
+var TabPanel_default = TabPanel;
+
+// src/components/Banner.tsx
+var React18 = __toESM(require("react"), 1);
+var import_Box8 = __toESM(require("@mui/material/Box"), 1);
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var PALETTE = {
+  normal: { bg: swapColors.black.black100, border: swapColors.black.black500, iconFill: swapColors.black.black700 },
+  info: { bg: swapColors.primary.primary50, border: swapColors.primary.primary200, iconFill: swapColors.primary.primary400 },
+  success: { bg: swapColors.success.success50, border: swapColors.success.success400, iconFill: "#00932A" },
+  warning: { bg: swapColors.secondary.secondary50, border: swapColors.secondary.secondary600, iconFill: "#E5640C" },
+  error: { bg: swapColors.danger.danger50, border: swapColors.danger.danger300, iconFill: swapColors.danger.danger700 }
+};
+var infoPath = "M13 9H11V7H13V9ZM13 17H11V11H13V17ZM12 2C10.6868 2 9.38642 2.25866 8.17317 2.7612C6.95991 3.26375 5.85752 4.00035 4.92893 4.92893C3.05357 6.8043 2 9.34784 2 12C2 14.6522 3.05357 17.1957 4.92893 19.0711C5.85752 19.9997 6.95991 20.7362 8.17317 21.2388C9.38642 21.7413 10.6868 22 12 22C14.6522 22 17.1957 20.9464 19.0711 19.0711C20.9464 17.1957 22 14.6522 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7362 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2Z";
+var successPath = "M12 2C6.5 2 2 6.5 2 12C2 17.5 6.5 22 12 22C17.5 22 22 17.5 22 12C22 6.5 17.5 2 12 2ZM10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z";
+var warningPath = "M13 14H11V9H13V14ZM13 18H11V16H13V18ZM1 21H23L12 2L1 21Z";
+function defaultIcon(variant) {
+  const path = variant === "success" ? successPath : variant === "warning" ? warningPath : infoPath;
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("path", { d: path, fill: PALETTE[variant].iconFill }) });
+}
+var Banner = React18.forwardRef(function Banner2({ icon, variant = "info", width, height, mobile, children, sx, ...rest }, ref) {
+  const innerRef = React18.useRef(null);
+  const [alignStart, setAlignStart] = React18.useState(false);
+  React18.useEffect(() => {
+    if (innerRef.current && innerRef.current.offsetHeight > 60) setAlignStart(true);
+  }, []);
+  const p = PALETTE[variant];
+  const ourStyles = {
+    backgroundColor: p.bg,
+    border: `1px solid ${p.border}`,
+    borderRadius: "8px",
+    padding: "12px 16px",
+    width: cssSize(width),
+    height: cssSize(height),
+    display: "flex",
+    alignItems: mobile || alignStart ? "flex-start" : "center"
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+    import_Box8.default,
+    {
+      ref: (node) => {
+        innerRef.current = node;
+        if (typeof ref === "function") ref(node);
+        else if (ref) ref.current = node;
+      },
+      sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+      ...rest,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_Box8.default, { sx: { width: 24, height: 24, marginRight: "8px", flexShrink: 0 }, children: icon ?? defaultIcon(variant) }),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Typography_default, { variant: "caption2", children })
+      ]
+    }
+  );
+});
+var Banner_default = Banner;
+
+// src/components/Card.tsx
+var React19 = __toESM(require("react"), 1);
+var import_Box9 = __toESM(require("@mui/material/Box"), 1);
+var import_Button = __toESM(require("@mui/material/Button"), 1);
+var import_Skeleton = __toESM(require("@mui/material/Skeleton"), 1);
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var Card = React19.forwardRef(function Card2({ width, height, children, buttons, bodyStyle, loading, sx, ...rest }, ref) {
+  const ourStyles = {
+    width: cssSize(width) ?? 350,
+    height: cssSize(height) ?? "100%",
+    backgroundColor: swapColors.black.white,
+    boxSizing: "border-box",
+    border: `1px solid ${swapColors.black.black500}`,
+    borderRadius: "8px",
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "space-between",
+    overflow: "hidden"
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_Box9.default, { ref, sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]], ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_Box9.default, { sx: { padding: "24px", width: "100%", height: "100%" }, style: bodyStyle, children: !loading ? children : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_Box9.default, { sx: { width: "100%", height: "100%" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_Skeleton.default, { width: "40%", height: "calc((100% - 16px) / 3)" }),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_Box9.default, { sx: { height: "8px" } }),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_Skeleton.default, { width: "100%", height: "calc((100% - 16px) / 3)" }),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_Box9.default, { sx: { height: "8px" } }),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+        import_Box9.default,
+        {
+          sx: {
+            display: "flex",
+            justifyContent: "space-between",
+            width: "100%",
+            height: "calc((100% - 16px) / 3)"
+          },
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_Skeleton.default, { width: "26.4%", height: "100%" }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_Skeleton.default, { width: "26.4%", height: "100%" })
+          ]
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      import_Box9.default,
+      {
+        sx: {
+          width: "100%",
+          boxShadow: `0px -1px 0px ${swapColors.black.black400}`,
+          borderRadius: "0px 0px 8px 8px",
+          display: "flex",
+          padding: 0
+        },
+        children: !loading ? buttons?.map((b, index) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          import_Button.default,
+          {
+            fullWidth: true,
+            variant: b.variant ?? "black",
+            style: {
+              borderRight: index + 1 === buttons.length ? void 0 : `1px solid ${swapColors.black.black400}`,
+              borderRadius: "0px 0px 0px 0px",
+              ...b.style
+            },
+            onClick: b.onClick,
+            disabled: b.disabled,
+            loading: b.loading,
+            children: b.title
+          },
+          index
+        )) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_Box9.default, { sx: { padding: "16px 24px", width: "100%", height: 48 }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_Skeleton.default, { width: "100%", height: "100%" }) })
+      }
+    )
+  ] });
+});
+var Card_default = Card;
+
+// src/components/Progress.tsx
+var React20 = __toESM(require("react"), 1);
+var import_Box10 = __toESM(require("@mui/material/Box"), 1);
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var Progress = React20.forwardRef(function Progress2({ width, size, label, step, count, sx, ...rest }, ref) {
+  const circle = cssSize(size) ?? 24;
+  const ourStyles = {
+    width: cssSize(width) ?? "100%",
+    display: "flex",
+    alignItems: "flex-start"
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_Box10.default, { ref, sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]], ...rest, children: Array.from(Array(count).keys()).map((i) => {
+    const isCurrent = i === step - 1;
+    const isDone = i + 1 < step;
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+      import_Box10.default,
+      {
+        sx: { width: "100%", display: "flex", flexDirection: "column", textAlign: "center" },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_Box10.default, { sx: { width: "100%", display: "flex", alignItems: "center" }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              import_Box10.default,
+              {
+                sx: {
+                  height: "2px",
+                  width: "calc((100% - 24px)/2)",
+                  backgroundColor: i !== 0 ? i + 1 <= step ? swapColors.primary.primary800 : swapColors.black.black500 : "transparent"
+                }
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              import_Box10.default,
+              {
+                sx: {
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  fontSize: 12,
+                  lineHeight: 1.4,
+                  fontWeight: 700,
+                  width: circle,
+                  height: circle,
+                  borderRadius: "50%",
+                  boxSizing: "border-box",
+                  backgroundColor: isCurrent ? "white" : isDone ? swapColors.primary.primary800 : swapColors.black.black600,
+                  color: isCurrent ? swapColors.primary.primary800 : "white",
+                  border: isCurrent ? `2px solid ${swapColors.primary.primary800}` : "none",
+                  boxShadow: isCurrent ? "0px 0px 0px 4px #D7DFF8" : "unset"
+                },
+                children: i + 1
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              import_Box10.default,
+              {
+                sx: {
+                  height: "2px",
+                  width: "calc((100% - 24px)/2)",
+                  backgroundColor: i + 1 !== count ? i + 1 < step ? swapColors.primary.primary800 : swapColors.black.black500 : "transparent"
+                }
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            Typography_default,
+            {
+              variant: "caption1",
+              color: i + 1 === step ? "black1000" : "black700",
+              style: { marginTop: 8 },
+              children: label ? label[i] : null
+            }
+          )
+        ]
+      },
+      i
+    );
+  }) });
+});
+var Progress_default = Progress;
+
+// src/components/Modal.tsx
+var React21 = __toESM(require("react"), 1);
+var import_Modal = __toESM(require("@mui/material/Modal"), 1);
+var import_Paper2 = __toESM(require("@mui/material/Paper"), 1);
+var import_Divider = __toESM(require("@mui/material/Divider"), 1);
+var import_Slide = __toESM(require("@mui/material/Slide"), 1);
+var import_Box11 = __toESM(require("@mui/material/Box"), 1);
+
+// node_modules/@mui/icons-material/utils/createSvgIcon.mjs
+var import_SvgIcon = require("@mui/material/SvgIcon");
+
+// node_modules/@mui/icons-material/Close.mjs
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var Close_default = (0, import_SvgIcon.createSvgIcon)(/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("path", {
+  d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
+}), "Close");
+
+// node_modules/@mui/icons-material/CheckCircle.mjs
+var import_jsx_runtime25 = require("react/jsx-runtime");
+var CheckCircle_default = (0, import_SvgIcon.createSvgIcon)(/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", {
+  d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8z"
+}), "CheckCircle");
+
+// node_modules/@mui/icons-material/Warning.mjs
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var Warning_default = (0, import_SvgIcon.createSvgIcon)(/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("path", {
+  d: "M1 21h22L12 2zm12-3h-2v-2h2zm0-4h-2v-4h2z"
+}), "Warning");
+
+// src/hooks/useBreakpoints.ts
+var import_useMediaQuery3 = __toESM(require("@mui/material/useMediaQuery"), 1);
+function useBreakpoints(breakpoint) {
+  const px = typeof breakpoint === "number" ? breakpoint : swapBreakpoints[breakpoint ?? "xxs"];
+  return (0, import_useMediaQuery3.default)(`(min-width:${px}px)`);
+}
+
+// src/components/Modal.tsx
+var import_Button2 = __toESM(require("@mui/material/Button"), 1);
+var import_jsx_runtime27 = require("react/jsx-runtime");
+var SIZE_WIDTH = { large: 800, medium: 640, small: 480, extraSmall: 320 };
+function FooterButton({
+  item,
+  fullWidth,
+  fallbackVariant
+}) {
+  const btn = /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    import_Button2.default,
+    {
+      fullWidth,
+      variant: item.variant ?? fallbackVariant,
+      size: "small",
+      onClick: item.onClick,
+      disabled: item.disabled,
+      loading: item.loading,
+      style: item.style,
+      children: item.title
+    }
+  );
+  return item.tooltip ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Tooltip_default, { ...item.tooltip, children: btn }) : btn;
+}
+var Modal = React21.forwardRef(function Modal2(props, ref) {
+  const {
+    width,
+    height,
+    open,
+    onClose,
+    title,
+    helpText,
+    size,
+    headpadding,
+    headChildren,
+    checked,
+    failed,
+    icon,
+    checkIconColor,
+    iconColor,
+    children,
+    label,
+    buttonFullWidth,
+    footerDisplayColumn,
+    secondaryButton,
+    primaryButton,
+    mobile,
+    fullWidth,
+    fullScreen,
+    bodyPadding,
+    maxWidth,
+    disCloseIcon,
+    titleStyle,
+    bodyStyle,
+    onExit,
+    bodyMaxHeight,
+    multiline,
+    disUnderLine,
+    footer
+  } = props;
+  const [clientHeight, setClientHeight] = React21.useState(0);
+  const [scrollbarWidth, setScrollbarWidth] = React21.useState(0);
+  React21.useEffect(() => {
+    if (mobile || fullWidth) {
+      if ((helpText || multiline) && !label) setClientHeight(window.innerHeight - 64 - 73 - 64);
+      else if (!helpText && label) setClientHeight(window.innerHeight - 64 - 56 - 99);
+      else if ((helpText || multiline) && label) setClientHeight(window.innerHeight - 64 - 73 - 99);
+      else setClientHeight(window.innerHeight - 64 - 56 - 64);
+    }
+  }, [fullWidth, mobile, helpText, multiline, label]);
+  React21.useEffect(() => {
+    setScrollbarWidth((window.innerWidth - document.body.clientWidth) / 2);
+  }, []);
+  const matchXS = useBreakpoints("xs");
+  const slide = fullWidth || fullScreen;
+  const resolvedWidth = fullScreen ? "100vw" : cssSize(width) ?? (size ? SIZE_WIDTH[size] : "100%");
+  const iconSx3 = {
+    "& path": { width: 20, height: 20 },
+    color: iconColor && swapTokenMap[iconColor] || checkIconColor && swapTokenMap[checkIconColor] || swapColors.black.black700,
+    marginRight: "10px"
+  };
+  const headPad = headpadding ? headpadding : mobile ? disCloseIcon && !helpText && !multiline ? "17px 16px" : "12px 16px" : disCloseIcon && !helpText && !multiline ? "19.5px 24px" : "16px 24px";
+  const bodyPad = bodyPadding ?? (mobile ? 16 : 24);
+  const panel = /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+    import_Paper2.default,
+    {
+      sx: {
+        width: resolvedWidth,
+        maxWidth: cssSize(maxWidth),
+        borderRadius: fullScreen ? 0 : fullWidth ? "12px 12px 0px 0px" : "12px",
+        border: "unset",
+        boxShadow: fullScreen ? "unset" : swapShadows.l,
+        display: "flex",
+        flexDirection: "column",
+        outline: 0,
+        // v1 用 react-spring 做 200ms 淡入+上移；v2 以 CSS keyframes 等效（少一依賴）
+        ...slide ? {} : {
+          animation: open ? "swap-modal-in 200ms ease-in-out" : "none",
+          "@keyframes swap-modal-in": {
+            from: { opacity: 0, transform: "translateY(50px)" },
+            to: { opacity: 1, transform: "translateY(0px)" }
+          }
+        }
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+          import_Box11.default,
+          {
+            sx: {
+              borderRadius: fullScreen ? 0 : "12px 12px 0px 0px",
+              padding: headPad,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+              position: "relative",
+              pointerEvents: onExit ? "none" : "unset"
+            },
+            style: titleStyle,
+            children: [
+              onExit ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                import_Box11.default,
+                {
+                  sx: {
+                    position: "absolute",
+                    width: "100%",
+                    height: "100%",
+                    background: "black",
+                    top: 0,
+                    left: 0,
+                    opacity: 0.5,
+                    borderRadius: "12px 12px 0px 0px",
+                    zIndex: 10
+                  }
+                }
+              ) : null,
+              headChildren ?? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_Box11.default, { sx: { display: "flex", alignItems: "center", justifyContent: "center" }, children: [
+                icon ?? null,
+                checked ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(CheckCircle_default, { sx: iconSx3 }) : null,
+                failed ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Warning_default, { sx: iconSx3 }) : null,
+                /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Typography_default, { variant: !mobile ? "h6" : "title", children: title }),
+                  helpText ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Typography_default, { variant: "body2_loose", color: "black800", style: { marginTop: 4 }, children: helpText }) : null
+                ] })
+              ] }),
+              disCloseIcon ? null : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(IconButton_default, { sx: { marginLeft: "16px" }, onClick: () => onClose(), "aria-label": "\u95DC\u9589", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Close_default, { sx: { color: swapColors.black.black1000, width: 20, height: 20 } }) })
+            ]
+          }
+        ),
+        children ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_Divider.default, { sx: { backgroundColor: onExit ? "#6d6d6d" : "#DADADA" } }),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+            import_Box11.default,
+            {
+              sx: {
+                transition: "all 0.2s ease-in-out",
+                height: fullScreen ? "calc(100dvh - 146px)" : cssSize(height) ?? "100%",
+                padding: `${bodyPad}px`,
+                position: "relative",
+                pointerEvents: onExit ? "none" : "unset",
+                maxHeight: fullScreen ? "calc(100dvh - 146px)" : cssSize(bodyMaxHeight) ?? (fullWidth ? clientHeight : "unset"),
+                overflowY: !onExit ? "scroll" : "hidden",
+                "&::-webkit-scrollbar": { backgroundColor: "transparent", width: 5 },
+                "&::-webkit-scrollbar-thumb": {
+                  backgroundColor: swapColors.black.black600,
+                  borderRadius: "100px"
+                },
+                "&::-webkit-scrollbar-track-piece:start": { marginTop: "12px" },
+                "&::-webkit-scrollbar-track-piece:end": { marginBottom: "12px" }
+              },
+              style: bodyStyle,
+              children: [
+                onExit ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                  import_Box11.default,
+                  {
+                    sx: {
+                      marginLeft: `${-bodyPad}px`,
+                      marginTop: `${-bodyPad}px`,
+                      position: bodyMaxHeight || height || mobile && fullWidth || fullScreen ? "fixed" : "absolute",
+                      width: resolvedWidth,
+                      height: fullScreen ? "100dvh" : cssSize(bodyMaxHeight) ?? cssSize(height) ?? (mobile && fullWidth ? clientHeight : "100%"),
+                      background: "black",
+                      opacity: 0.5,
+                      zIndex: 10
+                    }
+                  }
+                ) : null,
+                children
+              ]
+            }
+          )
+        ] }) : null,
+        (label || secondaryButton || primaryButton) && !disUnderLine ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_Divider.default, {}) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+          import_Box11.default,
+          {
+            sx: {
+              padding: label || secondaryButton || primaryButton ? mobile ? "12px 16px" : "16px 24px" : void 0,
+              borderRadius: "0px 0px 12px 12px",
+              display: "flex",
+              flexDirection: mobile ? "column" : "row",
+              alignItems: "center",
+              justifyContent: "space-between"
+            },
+            children: footer ?? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
+              !buttonFullWidth || !footerDisplayColumn ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                import_Box11.default,
+                {
+                  sx: {
+                    marginBottom: mobile && label ? "12px" : 0,
+                    fontSize: mobile ? 16 : 18,
+                    fontWeight: 700,
+                    lineHeight: 1.4
+                  },
+                  children: label
+                }
+              ) : null,
+              secondaryButton || primaryButton ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+                import_Box11.default,
+                {
+                  sx: {
+                    width: buttonFullWidth || footerDisplayColumn || mobile ? "100%" : void 0,
+                    display: "flex",
+                    flexDirection: footerDisplayColumn ? "column-reverse" : "row",
+                    alignItems: "center"
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                      import_Box11.default,
+                      {
+                        sx: {
+                          width: mobile && !buttonFullWidth && !footerDisplayColumn ? void 0 : "100%",
+                          marginRight: !footerDisplayColumn && secondaryButton ? "8px" : 0
+                        },
+                        children: secondaryButton ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                          FooterButton,
+                          {
+                            item: secondaryButton,
+                            fullWidth: Boolean(buttonFullWidth || footerDisplayColumn),
+                            fallbackVariant: "secondary"
+                          }
+                        ) : null
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_Box11.default, { sx: { width: "100%", marginBottom: footerDisplayColumn ? "8px" : 0 }, children: primaryButton ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                      FooterButton,
+                      {
+                        item: primaryButton,
+                        fullWidth: Boolean(buttonFullWidth || footerDisplayColumn || mobile),
+                        fallbackVariant: "primary"
+                      }
+                    ) : null })
+                  ]
+                }
+              ) : null
+            ] })
+          }
+        )
+      ]
+    }
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    import_Modal.default,
+    {
+      ref,
+      open,
+      onClose: () => onClose(),
+      sx: {
+        display: "flex",
+        alignItems: fullWidth ? "flex-end" : "center",
+        justifyContent: "center",
+        border: "unset",
+        margin: fullWidth || fullScreen ? 0 : matchXS ? "0px 24px" : "0px 16px"
+      },
+      slotProps: {
+        backdrop: {
+          sx: { transition: "all 0.2s ease-in-out !important" },
+          style: { overflow: "auto", WebkitOverflowScrolling: "touch" }
+        }
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        import_Box11.default,
+        {
+          sx: {
+            outline: "none",
+            width: "100%",
+            display: "flex",
+            justifyContent: "center",
+            alignItems: "center",
+            left: open ? 0 : scrollbarWidth,
+            position: "absolute",
+            ...fullWidth ? { bottom: 0 } : {}
+          },
+          children: slide ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_Slide.default, { in: open, direction: "up", mountOnEnter: true, unmountOnExit: true, timeout: { enter: 300, exit: 300 }, children: panel }) : panel
+        }
+      )
+    }
+  );
+});
+var Modal_default = Modal;
+
+// src/components/Snackbar.tsx
+var import_Snackbar = __toESM(require("@mui/material/Snackbar"), 1);
+var import_Slide2 = __toESM(require("@mui/material/Slide"), 1);
+var import_Fade2 = __toESM(require("@mui/material/Fade"), 1);
+var import_Box12 = __toESM(require("@mui/material/Box"), 1);
+var import_jsx_runtime28 = require("react/jsx-runtime");
+var TransitionLeft = (p) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_Slide2.default, { ...p, direction: "left" });
+var TransitionRight = (p) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_Slide2.default, { ...p, direction: "right" });
+var TransitionUp = (p) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_Slide2.default, { ...p, direction: "up" });
+var TransitionDown = (p) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_Slide2.default, { ...p, direction: "down" });
+var TransitionFade = (p) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_Fade2.default, { ...p });
+var iconClose = /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  "path",
+  {
+    d: "M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41Z",
+    fill: "white"
+  }
+) });
+var iconChecked = /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M21 7.00003L9 19L3.5 13.5L4.91 12.09L9 16.17L19.59 5.59003L21 7.00003Z", fill: "white" }) });
+var iconError = /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  "path",
+  {
+    d: "M13 13H11V7H13V13ZM13 17H11V15H13V17ZM12 2C10.6868 2 9.38642 2.25866 8.17317 2.7612C6.95991 3.26375 5.85752 4.00035 4.92893 4.92893C3.05357 6.8043 2 9.34784 2 12C2 14.6522 3.05357 17.1957 4.92893 19.0711C5.85752 19.9997 6.95991 20.7362 8.17317 21.2388C9.38642 21.7413 10.6868 22 12 22C14.6522 22 17.1957 20.9464 19.0711 19.0711C20.9464 17.1957 22 14.6522 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7362 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2Z",
+    fill: "white"
+  }
+) });
+var Snackbar = ({
+  message,
+  transitionDirection,
+  transitionDuration,
+  width,
+  height,
+  variant,
+  action,
+  revertButton,
+  closeIcon,
+  icon,
+  checkIcon,
+  errorIcon,
+  sx,
+  ...rest
+}) => {
+  const bg = variant === "success" ? swapColors.success.success800 : variant === "error" ? swapColors.danger.danger900 : swapColors.black.black1000;
+  const border = variant === "success" ? swapColors.success.successA11y : variant === "error" ? swapColors.danger.dangerA11y : swapColors.black.black1000;
+  const leadingIcon = checkIcon ? iconChecked : errorIcon ? icon ?? iconError : icon;
+  const ourStyles = {
+    "@media only screen and (min-width: 600px)": { width: "fit-content", marginRight: "24px" },
+    "@media only screen and (max-width: 600px)": {
+      width: "unset",
+      bottom: 16,
+      left: 16,
+      right: 16
+    },
+    "& .MuiSnackbarContent-root": {
+      flexWrap: "nowrap",
+      minWidth: 320,
+      maxWidth: 640,
+      width: cssSize(width) ?? "unset",
+      height: cssSize(height) ?? "unset",
+      boxShadow: swapShadows.l,
+      borderRadius: swapRadius.m,
+      backgroundColor: bg,
+      border: `1px solid ${border}`,
+      padding: "12px 16px",
+      boxSizing: "border-box"
+    },
+    "& .MuiSnackbarContent-message": { padding: 0 },
+    "& .MuiSnackbarContent-action": { padding: 0 }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    import_Snackbar.default,
+    {
+      ...rest,
+      sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+      message: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+        import_Box12.default,
+        {
+          sx: {
+            display: "flex",
+            alignItems: "center",
+            fontSize: 14,
+            fontWeight: 400,
+            lineHeight: 1.6,
+            color: "#ffffff"
+          },
+          children: [
+            leadingIcon ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
+              leadingIcon,
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_Box12.default, { sx: { width: "8px", height: "100%" } })
+            ] }) : null,
+            message
+          ]
+        }
+      ),
+      action: action ?? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
+        revertButton ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+          import_Box12.default,
+          {
+            sx: {
+              fontSize: 14,
+              fontWeight: 700,
+              lineHeight: 1.4,
+              color: swapColors.secondary.secondary600,
+              cursor: "pointer",
+              whiteSpace: "nowrap",
+              marginLeft: "8px"
+            },
+            onClick: revertButton.onClick,
+            children: revertButton.label ?? "\u6536\u56DE\u64CD\u4F5C"
+          }
+        ) : null,
+        closeIcon ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+          IconButton_default,
+          {
+            hoverColor: variant === "success" ? "#006818" : variant === "error" ? "#A00204" : closeIcon.hoverColor ?? "#333333",
+            onClick: closeIcon.onClick,
+            sx: { marginLeft: "8px" },
+            children: closeIcon.icon ?? iconClose
+          }
+        ) : null
+      ] }),
+      slots: {
+        transition: transitionDirection === "left" ? TransitionLeft : transitionDirection === "right" ? TransitionRight : transitionDirection === "up" ? TransitionUp : transitionDirection === "down" ? TransitionDown : TransitionFade,
+        ...rest.slots
+      },
+      transitionDuration
+    }
+  );
+};
+var Snackbar_default = Snackbar;
+
+// src/components/RadioList.tsx
+var React22 = __toESM(require("react"), 1);
+var import_Box13 = __toESM(require("@mui/material/Box"), 1);
+
+// src/components/selectionList.styles.ts
+function selectionListStyles(opts) {
+  const { checked, multiline, line, width, height } = opts;
+  return {
+    width: cssSize(width) ?? (multiline ? 240 : line ? 342 : 327),
+    height: cssSize(height) ?? (multiline ? 69 : line ? 76 : 54),
+    padding: line ? "16px" : multiline ? "12px 16px" : "15px 16px",
+    border: checked ? `1px solid ${swapColors.primary.primary400}` : `1px solid ${swapColors.black.black500}`,
+    boxSizing: "border-box",
+    borderRadius: "8px",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    cursor: "pointer",
+    backgroundColor: checked ? swapColors.primary.primary50 : "white",
+    WebkitTapHighlightColor: "transparent",
+    "&:hover": {
+      backgroundColor: checked ? swapColors.primary.primary50 : swapColors.black.black100,
+      border: checked ? `1px solid ${swapColors.primary.primary400}` : `1px solid ${swapColors.black.black600}`
+    }
+  };
+}
+
+// src/components/RadioList.tsx
+var import_jsx_runtime29 = require("react/jsx-runtime");
+function SelectionListInner({
+  control,
+  title,
+  subtitle,
+  multiline,
+  line
+}) {
+  const ref = React22.useRef(null);
+  const [lineHeight, setLineHeight] = React22.useState(44);
+  React22.useEffect(() => {
+    if (ref.current) setLineHeight(Math.max(ref.current.offsetHeight, 44));
+  }, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_jsx_runtime29.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_Box13.default, { sx: { display: "flex", alignItems: "center" }, children: [
+      control,
+      line ? /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_Box13.default, { sx: { display: "flex", alignItems: "center", marginLeft: "4px" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+          Typography_default,
+          {
+            variant: "title",
+            style: { maxWidth: 56, minWidth: 56, textAlign: "center", wordBreak: "break-word" },
+            children: title
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_Box13.default, { sx: { height: lineHeight, width: "1px", margin: "0 12px", backgroundColor: "#909090" } }),
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { ref, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+          Typography_default,
+          {
+            variant: "body2_loose",
+            color: "black800",
+            style: { width: "100%", wordBreak: "break-word" },
+            children: subtitle
+          }
+        ) })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_Box13.default, { sx: { display: "flex", flexDirection: "column" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Typography_default, { variant: "title", children: title }),
+        multiline ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Typography_default, { variant: "body2_loose", color: "black800", children: subtitle }) : null
+      ] })
+    ] }),
+    !multiline && !line ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Typography_default, { variant: "body2_loose", color: "black800", children: subtitle }) : null
+  ] });
+}
+var RadioList = React22.forwardRef(function RadioList2({ width, height, title, subtitle, multiline, checked, line, sx, ...rest }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    import_Box13.default,
+    {
+      ref,
+      sx: [
+        selectionListStyles({ checked, multiline, line, width, height }),
+        ...Array.isArray(sx) ? sx : [sx]
+      ],
+      ...rest,
+      children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+        SelectionListInner,
+        {
+          control: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(RadioButton_default, { disableHover: true, checked: Boolean(checked), sx: { marginLeft: "4px" } }),
+          title,
+          subtitle,
+          multiline,
+          line
+        }
+      )
+    }
+  );
+});
+var RadioList_default = RadioList;
+
+// src/components/CheckBoxList.tsx
+var React23 = __toESM(require("react"), 1);
+var import_Box14 = __toESM(require("@mui/material/Box"), 1);
+var import_jsx_runtime30 = require("react/jsx-runtime");
+var CheckBoxList = React23.forwardRef(function CheckBoxList2({ width, height, title, subtitle, multiline, checked, line, sx, ...rest }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    import_Box14.default,
+    {
+      ref,
+      sx: [
+        selectionListStyles({ checked, multiline, line, width, height }),
+        ...Array.isArray(sx) ? sx : [sx]
+      ],
+      ...rest,
+      children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        SelectionListInner,
+        {
+          control: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(CheckBox_default, { disableHover: true, checked: Boolean(checked), sx: { marginLeft: "4px" } }),
+          title,
+          subtitle,
+          multiline,
+          line
+        }
+      )
+    }
+  );
+});
+var CheckBoxList_default = CheckBoxList;
+
+// src/components/AutoComplete.tsx
+var React24 = __toESM(require("react"), 1);
+var import_Autocomplete = __toESM(require("@mui/material/Autocomplete"), 1);
+var import_InputBase = __toESM(require("@mui/material/InputBase"), 1);
+var import_Popper = __toESM(require("@mui/material/Popper"), 1);
+var import_Box15 = __toESM(require("@mui/material/Box"), 1);
+var import_styles3 = require("@mui/material/styles");
+var import_jsx_runtime31 = require("react/jsx-runtime");
+var checkSvg3 = /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  "path",
+  {
+    d: "M17.4998 5.83345L7.49984 15.8334L2.9165 11.2501L4.0915 10.0751L7.49984 13.4751L16.3248 4.65845L17.4998 5.83345Z",
+    fill: "#4862CC"
+  }
+) });
+var AutoComplete = (props) => {
+  const [inputValue, setInputValue] = React24.useState("");
+  const {
+    open = false,
+    helperText,
+    value,
+    handleNoOptionsValueChange,
+    options = [],
+    placeholder,
+    placement,
+    title,
+    width,
+    anchorEl,
+    disableFreeInput,
+    renderOption,
+    getOptionLabel,
+    noOptionsText,
+    renderInput,
+    optionsMaxHeight,
+    anchorOrigin,
+    addNewOptionsText,
+    ...other
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+    import_Popper.default,
+    {
+      open,
+      anchorEl,
+      placement: placement ?? "bottom-start",
+      sx: {
+        border: `1px solid ${swapColors.black.black500}`,
+        boxShadow: swapShadows.m,
+        borderRadius: "8px",
+        width: cssSize(width) ?? 320,
+        zIndex: 1301,
+        fontSize: 13,
+        color: "#586069",
+        backgroundColor: "#fff",
+        marginTop: `${anchorOrigin?.vertical ?? -65}px !important`,
+        marginLeft: `${anchorOrigin?.horizontal ?? 0}px !important`,
+        boxSizing: "border-box"
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_Box15.default, { sx: { padding: "16px 16px 8px 16px", fontWeight: 600 }, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Typography_default, { variant: "caption1", color: "black800", children: title }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+          import_Autocomplete.default,
+          {
+            disablePortal: true,
+            ...other,
+            open: true,
+            options,
+            renderOption,
+            getOptionLabel,
+            onInputChange: (_, v) => setInputValue(v),
+            slotProps: {
+              paper: {
+                sx: {
+                  boxShadow: "none",
+                  margin: 0,
+                  color: "#586069",
+                  fontSize: 13,
+                  border: "none",
+                  paddingRight: "5px"
+                }
+              },
+              listbox: {
+                sx: {
+                  maxHeight: cssSize(optionsMaxHeight),
+                  "& .MuiAutocomplete-option": {
+                    fontSize: 14,
+                    fontWeight: 700,
+                    minHeight: "auto",
+                    alignItems: "flex-start",
+                    padding: "8px 16px",
+                    color: "#000",
+                    '&[aria-selected="true"]': { display: "none" },
+                    "&.Mui-focused": {
+                      backgroundColor: swapColors.primary.primary50,
+                      color: swapColors.primary.primary800
+                    }
+                  },
+                  "&::-webkit-scrollbar": { backgroundColor: "transparent", width: 5 },
+                  "&::-webkit-scrollbar-thumb": {
+                    backgroundColor: swapColors.black.black600,
+                    borderRadius: "100px"
+                  },
+                  "&::-webkit-scrollbar-track-piece:start": { marginTop: "12px" },
+                  "&::-webkit-scrollbar-track-piece:end": { marginBottom: "12px" }
+                }
+              },
+              // popper.js 會寫入 inline 的 absolute/transform，需 !important 拉回文流，
+              // 讓清單留在面板內、排在已選面板下方
+              popper: {
+                sx: {
+                  position: "static !important",
+                  transform: "none !important",
+                  width: "100% !important"
+                }
+              }
+            },
+            noOptionsText: disableFreeInput ? "\u7121\u6B64\u9078\u9805" : /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+              import_Box15.default,
+              {
+                sx: {
+                  fontSize: 14,
+                  fontWeight: 700,
+                  lineHeight: 1.4,
+                  display: "flex",
+                  justifyContent: "space-between",
+                  alignItems: "center",
+                  flexWrap: "wrap"
+                },
+                children: [
+                  noOptionsText ?? "\u7121\u6B64\u9078\u9805",
+                  /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+                    import_Box15.default,
+                    {
+                      sx: {
+                        color: swapColors.primary.primary400,
+                        cursor: "pointer",
+                        "&:hover": { textDecoration: "underline" }
+                      },
+                      onMouseDown: () => handleNoOptionsValueChange?.(inputValue),
+                      children: [
+                        addNewOptionsText ?? "\u4F7F\u7528",
+                        " \u300C",
+                        inputValue,
+                        "\u300D"
+                      ]
+                    }
+                  )
+                ]
+              }
+            ),
+            renderInput: renderInput ?? ((params) => /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_jsx_runtime31.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+                import_InputBase.default,
+                {
+                  placeholder,
+                  ref: params.slotProps.input.ref,
+                  inputProps: params.slotProps.htmlInput,
+                  autoFocus: true,
+                  sx: {
+                    padding: "0 16px 16px 16px",
+                    width: "100%",
+                    borderBottom: "1px solid #dfe2e5",
+                    "& input": {
+                      height: 16,
+                      borderRadius: "8px",
+                      backgroundColor: swapColors.black.white,
+                      padding: "13px 16px",
+                      border: "1px solid #ced4da",
+                      fontSize: 14,
+                      "&:focus": {
+                        boxShadow: `${(0, import_styles3.alpha)(swapColors.primary.primary400, 0.25)} 0 0 0 0.2rem`,
+                        borderColor: swapColors.primary.primary400
+                      }
+                    }
+                  }
+                }
+              ),
+              value ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+                import_Box15.default,
+                {
+                  sx: {
+                    minHeight: 52,
+                    padding: "16px 16px",
+                    display: "grid",
+                    gap: "10px",
+                    alignItems: "center",
+                    gridTemplateColumns: "auto 20px",
+                    backgroundColor: "transparent",
+                    color: swapColors.primary.primary400,
+                    fontSize: 14,
+                    fontWeight: 700,
+                    lineHeight: 1.4,
+                    boxShadow: "inset 0px -1px 0px #ECECEC"
+                  },
+                  children: [
+                    value,
+                    checkSvg3
+                  ]
+                }
+              ) : null
+            ] }))
+          }
+        )
+      ]
+    }
+  ) });
+};
+var AutoComplete_default = AutoComplete;
+
+// src/components/Dropdown.tsx
+var import_Select2 = __toESM(require("@mui/material/Select"), 1);
+var import_FormControl2 = __toESM(require("@mui/material/FormControl"), 1);
+var import_FormHelperText2 = __toESM(require("@mui/material/FormHelperText"), 1);
+var import_OutlinedInput2 = __toESM(require("@mui/material/OutlinedInput"), 1);
+var import_jsx_runtime32 = require("react/jsx-runtime");
+var Dropdown = ({
+  children,
+  formControlStyle,
+  inputProps,
+  MenuProps,
+  helperText,
+  width,
+  height,
+  helperTextStyle,
+  sx,
+  ...rest
+}) => {
+  const large = (height ?? 0) >= 56;
+  const ourStyles = {
+    "& .MuiSelect-select": {
+      height: height ? large ? height - 38 : height - 24 : 16,
+      display: "flex",
+      alignItems: "center",
+      padding: large ? "19px 8px 19px 24px" : "12px 4px 12px 16px",
+      fontSize: large ? 16 : 14,
+      lineHeight: large ? "18px" : "15.75px",
+      fontWeight: 700,
+      color: swapColors.black.black800,
+      "&:hover": { color: swapColors.black.black1000, backgroundColor: "white", fontWeight: 700 },
+      "&:focus-visible": { color: swapColors.black.black1000, backgroundColor: "white", fontWeight: 700 }
+    },
+    "& .MuiSelect-icon": { marginTop: "2px", width: 20, height: 20, color: swapColors.black.black800 }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_FormControl2.default, { variant: "outlined", style: formControlStyle, sx: { width: cssSize(width) ?? "100%" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      import_Select2.default,
+      {
+        ...rest,
+        inputProps,
+        input: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          import_OutlinedInput2.default,
+          {
+            sx: {
+              "& .MuiOutlinedInput-notchedOutline": { borderColor: swapColors.black.black500 },
+              "&:hover": { borderColor: swapColors.black.black1000, "& svg": { color: swapColors.black.black1000 } },
+              "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
+                borderColor: swapColors.black.black1000,
+                borderWidth: 1
+              },
+              "&.Mui-focused svg": { color: swapColors.black.black1000 }
+            }
+          }
+        ),
+        sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+        MenuProps: {
+          slotProps: { paper: { sx: { marginTop: "8px" } } },
+          ...MenuProps
+        },
+        children
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_FormHelperText2.default, { style: helperTextStyle, children: helperText })
+  ] });
+};
+var Dropdown_default = Dropdown;
+
+// src/components/SegmentedTab.tsx
+var React25 = __toESM(require("react"), 1);
+var import_Tab2 = __toESM(require("@mui/material/Tab"), 1);
+var import_jsx_runtime33 = require("react/jsx-runtime");
+var SegmentedTab = React25.forwardRef(function SegmentedTab2({ width, height, fontSize, flex, sx, ...rest }, ref) {
+  const ourStyles = {
+    textTransform: "unset",
+    padding: "12px 16px",
+    minWidth: 0,
+    minHeight: cssSize(height) ?? 40,
+    width: cssSize(width) ?? "fit-content",
+    fontWeight: 700,
+    fontSize: fontSize ?? 14,
+    lineHeight: 1.4,
+    color: "#6F6F6F",
+    opacity: 1,
+    whiteSpace: "nowrap",
+    flex,
+    "&:hover": { color: "#000000" },
+    // 讓文字墊在 slide 指示層之上
+    "& .MuiTab-wrapper, &": { position: "relative", zIndex: 5 }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_Tab2.default, { ref, disableRipple: true, sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]], ...rest });
+});
+var SegmentedTab_default = SegmentedTab;
+
+// src/components/SegmentedTabs.tsx
+var React26 = __toESM(require("react"), 1);
+var import_Tabs2 = __toESM(require("@mui/material/Tabs"), 1);
+var import_jsx_runtime34 = require("react/jsx-runtime");
+var SegmentedTabs = React26.forwardRef(function SegmentedTabs2({ children, width, slide, sx, ...rest }, ref) {
+  const innerRef = React26.useRef(null);
+  React26.useEffect(() => {
+    if (innerRef.current && rest.variant === "scrollable") {
+      const el = innerRef.current.querySelector(".MuiTab-root.Mui-selected");
+      if (el) {
+        setTimeout(() => {
+          el.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "center" });
+        }, 1e3);
+      }
+    }
+  }, []);
+  const ourStyles = {
+    width: cssSize(width),
+    boxSizing: "border-box",
+    border: `1px solid ${swapColors.black.black500}`,
+    borderRadius: "9px",
+    padding: "4px 0",
+    "& button": {
+      borderRadius: "8px",
+      margin: "0 4px",
+      "&.Mui-selected": {
+        backgroundColor: slide ? "unset" : swapColors.primary.primary50,
+        color: swapColors.primary.primary500
+      }
+    },
+    "& .MuiTabs-indicator": {
+      borderRadius: "8px",
+      height: slide ? "100%" : 0,
+      backgroundColor: swapColors.primary.primary50
+    },
+    "& .MuiTabs-scrollButtons": {
+      width: 32,
+      overflow: "hidden",
+      "&.Mui-disabled": { width: "4px" }
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+    import_Tabs2.default,
+    {
+      ref: (node) => {
+        innerRef.current = node;
+        if (typeof ref === "function") ref(node);
+        else if (ref) ref.current = node;
+      },
+      sx: [ourStyles, ...Array.isArray(sx) ? sx : [sx]],
+      ...rest,
+      children
+    }
+  );
+});
+var SegmentedTabs_default = SegmentedTabs;
+
+// src/components/SWAPLogo.tsx
+var import_Box16 = __toESM(require("@mui/material/Box"), 1);
+
+// src/components/assets/SWAP_web logo.svg
+var SWAP_web_logo_default = 'data:image/svg+xml,<?xml version="1.0" encoding="utf-8"?>%0A<!-- Generator: Adobe Illustrator 21.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->%0A<svg version="1.1" id="\u5716\u5C64_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"%0A%09 viewBox="70 0 430 226.8" style="enable-background:new 0 0 566.9 226.8;" xml:space="preserve">%0A<style type="text/css">%0A%09.st0{fill:none;}%0A%09.st1{fill:%23F7B52C;}%0A%09.st2{fill:%234862CC;}%0A</style>%0A<g>%0A%09<g>%0A%09%09<g>%0A%09%09%09<path class="st0" d="M126.6,126.9c-13.7,2.6-27.6,4.3-41.5,5.7c-0.1,2.5-0.1,4.9,0.3,7.4c1.8,13.2,10.4,24.2,22.6,29.2%0A%09%09%09%09c11.3,4.7,24.3,2.8,34.4-3.8c-3.5-8.1-6.9-16.1-10.2-24.4C130.2,136.6,128.3,131.7,126.6,126.9z"/>%0A%09%09%09<path class="st0" d="M118.6,100c-0.3-1.5-0.6-3-0.9-4.6c-7.4,2.8-14.7,6.2-20.5,11.4c-5.3,4.8-9,11-10.9,17.8%0A%09%09%09%09c12.6-1.4,25.1-3,37.5-5.2C121.8,113,120,106.5,118.6,100z"/>%0A%09%09%09<path class="st0" d="M164,107.5c2.4-1.3,4.6-2.8,6.5-4.6c6-5.3,9.4-13.4,9.3-21.4c-7.4,1-14.8,2.2-22.2,3.6%0A%09%09%09%09C160,92.4,162.2,99.9,164,107.5z"/>%0A%09%09%09<path class="st0" d="M163.1,56.6c-5.3-2.3-11.2-2.6-16.7-1.3c1.1,2.7,2.1,5.2,3.2,7.9c1.9,4.8,3.7,9.5,5.4,14.4%0A%09%09%09%09c7.8-1.5,15.7-2.8,23.6-3.9C176.2,66.1,170.6,59.9,163.1,56.6z"/>%0A%09%09%09<path class="st1" d="M158.1,118.8c-0.4-2.7-1-5.2-1.6-7.9c-1.1-4.7-2.3-9.2-3.7-13.7c-1.1-3.6-2.2-7-3.3-10.5%0A%09%09%09%09c-0.8-2.5-1.7-5-2.6-7.5c-2.5-7-5.1-14.1-7.9-21c-1,0.6-2,1.2-3,1.9c-8.6,6.2-11.4,15.1-11.4,24.7c0,2.7,0.2,5.4,0.6,8.2%0A%09%09%09%09c0.9,6.2,2.6,12.5,4.3,18c0.7,2.3,1.4,4.7,2.2,6.9c0.8,2.5,1.7,5,2.6,7.5c4.3,11.9,9.2,23.6,14.2,35.1%0A%09%09%09%09c6.6-6.7,10.3-15.7,10.7-25.3C159.5,129.7,159,124.2,158.1,118.8z"/>%0A%09%09%09<path class="st2" d="M187.6,80.6c-0.1-2.7-0.5-5.3-1.2-7.9c-2-7.5-6.4-14.3-12.8-19c-8.7-6.5-20-8.7-30.4-5.7%0A%09%09%09%09c-0.5,0.1-0.9,0.3-1.4,0.4c-2,0.7-4,1.5-5.8,2.5c-8.2,4.4-14.6,11.7-17.6,20.5c-1.6,5.1-2,10.6-1.6,16%0A%09%09%09%09c-7.6,2.7-14.9,6.1-21.3,10.9c-9.1,6.7-15.2,16.5-17.4,27.4c-0.5,2.6-0.9,5.1-1,7.8c0,0.1,0,0.2,0,0.3%0A%09%09%09%09c-0.5,14.5,6,28.6,17.6,37.3c11.9,8.9,27.4,11.5,41.5,6.5c3.3-1.2,6.3-2.7,9.3-4.5c2.3-1.4,4.5-3.1,6.5-4.9%0A%09%09%09%09c6.2-5.5,11-12.6,13.5-20.7c3.1-10.2,2.2-21.5,0.2-32c3-1.5,5.7-3.2,8.3-5.1c8.5-6.4,13.4-16.7,13.8-27.3%0A%09%09%09%09C187.7,82.1,187.7,81.3,187.6,80.6z M163.1,56.6c7.5,3.3,13.1,9.5,15.4,17.1c-7.9,1.1-15.7,2.4-23.6,3.9%0A%09%09%09%09c-1.8-4.9-3.6-9.6-5.4-14.4c-1-2.7-2.1-5.2-3.2-7.9C151.9,54,157.7,54.2,163.1,56.6z M97.4,106.8c5.8-5.1,13.1-8.7,20.5-11.4%0A%09%09%09%09c0.3,1.5,0.5,3.1,0.9,4.6c1.4,6.6,3.2,13.1,5.3,19.5c-12.4,2.3-24.9,3.9-37.5,5.2C88.3,117.8,92,111.5,97.4,106.8z M108,169.5%0A%09%09%09%09c-12.3-5-20.8-16.1-22.6-29.2c-0.3-2.5-0.4-5-0.3-7.4c13.9-1.6,27.8-3.3,41.5-5.7c1.8,4.9,3.7,9.6,5.5,14.4%0A%09%09%09%09c3.3,8.2,6.7,16.2,10.2,24.4C132.2,172.2,119.2,174.1,108,169.5z M159.3,135.2c-0.4,9.6-4.1,18.6-10.7,25.3%0A%09%09%09%09c-5-11.6-9.9-23.3-14.2-35.1c-0.9-2.5-1.8-5-2.6-7.5c-0.8-2.3-1.5-4.6-2.2-6.9c-1.7-5.6-3.4-11.8-4.3-18%0A%09%09%09%09c-0.4-2.8-0.6-5.4-0.6-8.2c0-9.5,2.8-18.3,11.4-24.7c0.9-0.7,1.9-1.3,3-1.9c2.8,6.9,5.4,14,7.9,21c0.9,2.5,1.8,5,2.6,7.5%0A%09%09%09%09c1.2,3.5,2.3,7,3.3,10.5c1.3,4.5,2.6,9,3.7,13.7c0.6,2.6,1.1,5.2,1.6,7.9C159,124.2,159.5,129.7,159.3,135.2z M170.5,102.9%0A%09%09%09%09c-2,1.8-4.2,3.3-6.5,4.6c-1.8-7.5-4-14.9-6.4-22.4c7.3-1.4,14.8-2.6,22.2-3.6C179.8,89.6,176.6,97.6,170.5,102.9z"/>%0A%09%09</g>%0A%09%09<g>%0A%09%09%09<path class="st2" d="M234.1,161.1c-10.1,0-18-1.9-24.8-7.4c-1.6-1.3-1.6-3.6-0.2-5l4.8-4.8c1.2-1.2,3.1-1.3,4.5-0.3%0A%09%09%09%09c4.5,3.3,10,4.5,15.9,4.5c8.7,0,13.4-3.3,13.4-9.3c0-2.7-0.7-4.9-2.4-6.3c-1.5-1.4-3.2-2.1-6.6-2.7l-9.1-1.3%0A%09%09%09%09c-6.4-1-11.2-3-14.7-6.2c-3.6-3.6-5.4-8.5-5.4-14.8c0-13.5,10-22.9,26.2-22.9c8.9,0,15.6,1.9,21.5,6.3c1.6,1.2,1.7,3.7,0.3,5%0A%09%09%09%09l-4.6,4.6c-1.2,1.2-3,1.3-4.4,0.3c-4.3-3-9-3.4-13.3-3.4c-7.8,0-11.7,4.4-11.7,9.5c0,1.9,0.6,4,2.2,5.4c1.5,1.4,4,2.6,7,3%0A%09%09%09%09l8.9,1.3c6.9,1,11.2,2.9,14.4,5.8c4.1,3.9,5.8,9.3,5.8,16C262,152.8,249.8,161.1,234.1,161.1z"/>%0A%09%09%09<path class="st2" d="M337.5,160.4h-7.1c-1.5,0-2.8-1-3.3-2.4l-9.9-32.7c-1-3.2-5.5-3.2-6.5,0l-9.9,32.7c-0.4,1.4-1.8,2.4-3.3,2.4%0A%09%09%09%09h-7.1c-1.6,0-2.9-1-3.3-2.5l-18.3-68.6c-0.6-2.2,1.1-4.3,3.3-4.3h8.3c1.6,0,3,1.1,3.3,2.6l8,32.7c0.8,3.4,5.5,3.5,6.5,0.1%0A%09%09%09%09l9.5-32.9c0.4-1.5,1.8-2.5,3.3-2.5h5.9c1.5,0,2.9,1,3.3,2.5l9.5,33c1,3.4,5.7,3.3,6.5-0.1l8.1-32.7c0.4-1.5,1.8-2.6,3.3-2.6h8.3%0A%09%09%09%09c2.3,0,3.9,2.1,3.3,4.3l-18.4,68.6C340.4,159.5,339.1,160.4,337.5,160.4z"/>%0A%09%09%09<path class="st2" d="M410.2,158.2l-2.9-8.7c-0.5-1.4-1.8-2.3-3.3-2.3h-21.9c-1.5,0-2.8,0.9-3.2,2.3l-3,8.7%0A%09%09%09%09c-0.5,1.4-1.8,2.3-3.2,2.3h-8.2c-2.4,0-4-2.4-3.2-4.6l24.9-68.6c0.5-1.4,1.8-2.3,3.2-2.3h6.8c1.4,0,2.7,0.9,3.2,2.3l25,68.6%0A%09%09%09%09c0.8,2.2-0.8,4.6-3.2,4.6h-8C412,160.4,410.7,159.6,410.2,158.2z M390.2,116.7l-4.8,13.6c-0.8,2.2,0.9,4.6,3.2,4.6h9.2%0A%09%09%09%09c2.3,0,4-2.3,3.3-4.5l-4.6-13.6C395.5,113.7,391.2,113.6,390.2,116.7z"/>%0A%09%09%09<path class="st2" d="M464.9,132.1h-11.2c-1.9,0-3.4,1.5-3.4,3.4v21.6c0,1.9-1.5,3.4-3.4,3.4h-7.9c-1.9,0-3.4-1.5-3.4-3.4V88.5%0A%09%09%09%09c0-1.9,1.5-3.4,3.4-3.4h25.8c15.5,0,24.8,10.7,24.8,23.5C489.8,121.4,480.5,132.1,464.9,132.1z M464.2,98.2h-10.4%0A%09%09%09%09c-1.9,0-3.4,1.5-3.4,3.4v13.9c0,1.9,1.5,3.4,3.4,3.4h10.4c6.6,0,10.9-4.2,10.9-10.3C475,102.4,470.8,98.2,464.2,98.2z"/>%0A%09%09</g>%0A%09</g>%0A</g>%0A</svg>%0A';
+
+// src/components/assets/SWAP_web logo-white.svg
+var SWAP_web_logo_white_default = 'data:image/svg+xml,<?xml version="1.0" encoding="utf-8"?>%0A<!-- Generator: Adobe Illustrator 21.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->%0A<svg version="1.1" id="\u5716\u5C64_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"%0A%09 viewBox="0 0 566.9 226.8" style="enable-background:new 0 0 566.9 226.8;" xml:space="preserve">%0A<style type="text/css">%0A%09.st0{fill:%234862CC;}%0A%09.st1{fill:none;}%0A%09.st2{fill:%23F7B52C;}%0A%09.st3{fill:%23FFFFFF;}%0A</style>%0A<rect x="-24.3" y="-18.3" class="st0" width="615.5" height="263.3"/>%0A<g>%0A%09<g>%0A%09%09<g>%0A%09%09%09<path class="st1" d="M126.6,126.9c-13.7,2.6-27.6,4.3-41.5,5.7c-0.1,2.5-0.1,4.9,0.3,7.4c1.8,13.2,10.4,24.2,22.6,29.2%0A%09%09%09%09c11.3,4.7,24.3,2.8,34.4-3.8c-3.5-8.1-6.9-16.1-10.2-24.4C130.2,136.6,128.3,131.7,126.6,126.9z"/>%0A%09%09%09<path class="st1" d="M118.6,100c-0.3-1.5-0.6-3-0.9-4.6c-7.4,2.8-14.7,6.2-20.5,11.4c-5.3,4.8-9,11-10.9,17.8%0A%09%09%09%09c12.6-1.4,25.1-3,37.5-5.2C121.8,113,120,106.5,118.6,100z"/>%0A%09%09%09<path class="st1" d="M164,107.5c2.4-1.3,4.6-2.8,6.5-4.6c6-5.3,9.4-13.4,9.3-21.4c-7.4,1-14.8,2.2-22.2,3.6%0A%09%09%09%09C160,92.4,162.2,99.9,164,107.5z"/>%0A%09%09%09<path class="st1" d="M163.1,56.6c-5.3-2.3-11.2-2.6-16.7-1.3c1.1,2.7,2.1,5.2,3.2,7.9c1.9,4.8,3.7,9.5,5.4,14.4%0A%09%09%09%09c7.8-1.5,15.7-2.8,23.6-3.9C176.2,66.1,170.6,59.9,163.1,56.6z"/>%0A%09%09%09<path class="st2" d="M158.1,118.8c-0.4-2.7-1-5.2-1.6-7.9c-1.1-4.7-2.3-9.2-3.7-13.7c-1.1-3.6-2.2-7-3.3-10.5%0A%09%09%09%09c-0.8-2.5-1.7-5-2.6-7.5c-2.5-7-5.1-14.1-7.9-21c-1,0.6-2,1.2-3,1.9c-8.6,6.2-11.4,15.1-11.4,24.7c0,2.7,0.2,5.4,0.6,8.2%0A%09%09%09%09c0.9,6.2,2.6,12.5,4.3,18c0.7,2.3,1.4,4.7,2.2,6.9c0.8,2.5,1.7,5,2.6,7.5c4.3,11.9,9.2,23.6,14.2,35.1%0A%09%09%09%09c6.6-6.7,10.3-15.7,10.7-25.3C159.5,129.7,159,124.2,158.1,118.8z"/>%0A%09%09%09<path class="st3" d="M187.6,80.6c-0.1-2.7-0.5-5.3-1.2-7.9c-2-7.5-6.4-14.3-12.8-19c-8.7-6.5-20-8.7-30.4-5.7%0A%09%09%09%09c-0.5,0.1-0.9,0.3-1.4,0.4c-2,0.7-4,1.5-5.8,2.5c-8.2,4.4-14.6,11.7-17.6,20.5c-1.6,5.1-2,10.6-1.6,16%0A%09%09%09%09c-7.6,2.7-14.9,6.1-21.3,10.9c-9.1,6.7-15.2,16.5-17.4,27.4c-0.5,2.6-0.9,5.1-1,7.8c0,0.1,0,0.2,0,0.3%0A%09%09%09%09c-0.5,14.5,6,28.6,17.6,37.3c11.9,8.9,27.4,11.5,41.5,6.5c3.3-1.2,6.3-2.7,9.3-4.5c2.3-1.4,4.5-3.1,6.5-4.9%0A%09%09%09%09c6.2-5.5,11-12.6,13.5-20.7c3.1-10.2,2.2-21.5,0.2-32c3-1.5,5.7-3.2,8.3-5.1c8.5-6.4,13.4-16.7,13.8-27.3%0A%09%09%09%09C187.7,82.1,187.7,81.3,187.6,80.6z M163.1,56.6c7.5,3.3,13.1,9.5,15.4,17.1c-7.9,1.1-15.7,2.4-23.6,3.9%0A%09%09%09%09c-1.8-4.9-3.6-9.6-5.4-14.4c-1-2.7-2.1-5.2-3.2-7.9C151.9,54,157.7,54.2,163.1,56.6z M97.4,106.8c5.8-5.1,13.1-8.7,20.5-11.4%0A%09%09%09%09c0.3,1.5,0.5,3.1,0.9,4.6c1.4,6.6,3.2,13.1,5.3,19.5c-12.4,2.3-24.9,3.9-37.5,5.2C88.3,117.8,92,111.5,97.4,106.8z M108,169.5%0A%09%09%09%09c-12.3-5-20.8-16.1-22.6-29.2c-0.3-2.5-0.4-5-0.3-7.4c13.9-1.6,27.8-3.3,41.5-5.7c1.8,4.9,3.7,9.6,5.5,14.4%0A%09%09%09%09c3.3,8.2,6.7,16.2,10.2,24.4C132.2,172.2,119.2,174.1,108,169.5z M159.3,135.2c-0.4,9.6-4.1,18.6-10.7,25.3%0A%09%09%09%09c-5-11.6-9.9-23.3-14.2-35.1c-0.9-2.5-1.8-5-2.6-7.5c-0.8-2.3-1.5-4.6-2.2-6.9c-1.7-5.6-3.4-11.8-4.3-18%0A%09%09%09%09c-0.4-2.8-0.6-5.4-0.6-8.2c0-9.5,2.8-18.3,11.4-24.7c0.9-0.7,1.9-1.3,3-1.9c2.8,6.9,5.4,14,7.9,21c0.9,2.5,1.8,5,2.6,7.5%0A%09%09%09%09c1.2,3.5,2.3,7,3.3,10.5c1.3,4.5,2.6,9,3.7,13.7c0.6,2.6,1.1,5.2,1.6,7.9C159,124.2,159.5,129.7,159.3,135.2z M170.5,102.9%0A%09%09%09%09c-2,1.8-4.2,3.3-6.5,4.6c-1.8-7.5-4-14.9-6.4-22.4c7.3-1.4,14.8-2.6,22.2-3.6C179.8,89.6,176.6,97.6,170.5,102.9z"/>%0A%09%09</g>%0A%09%09<g>%0A%09%09%09<path class="st3" d="M234.1,161.1c-10.1,0-18-1.9-24.8-7.4c-1.6-1.3-1.6-3.6-0.2-5l4.8-4.8c1.2-1.2,3.1-1.3,4.5-0.3%0A%09%09%09%09c4.5,3.3,10,4.5,15.9,4.5c8.7,0,13.4-3.3,13.4-9.3c0-2.7-0.7-4.9-2.4-6.3c-1.5-1.4-3.2-2.1-6.6-2.7l-9.1-1.3%0A%09%09%09%09c-6.4-1-11.2-3-14.7-6.2c-3.6-3.6-5.4-8.5-5.4-14.8c0-13.5,10-22.9,26.2-22.9c8.9,0,15.6,1.9,21.5,6.3c1.6,1.2,1.7,3.7,0.3,5%0A%09%09%09%09l-4.6,4.6c-1.2,1.2-3,1.3-4.4,0.3c-4.3-3-9-3.4-13.3-3.4c-7.8,0-11.7,4.4-11.7,9.5c0,1.9,0.6,4,2.2,5.4c1.5,1.4,4,2.6,7,3%0A%09%09%09%09l8.9,1.3c6.9,1,11.2,2.9,14.4,5.8c4.1,3.9,5.8,9.3,5.8,16C262,152.8,249.8,161.1,234.1,161.1z"/>%0A%09%09%09<path class="st3" d="M337.5,160.4h-7.1c-1.5,0-2.8-1-3.3-2.4l-9.9-32.7c-1-3.2-5.5-3.2-6.5,0l-9.9,32.7c-0.4,1.4-1.8,2.4-3.3,2.4%0A%09%09%09%09h-7.1c-1.6,0-2.9-1-3.3-2.5l-18.3-68.6c-0.6-2.2,1.1-4.3,3.3-4.3h8.3c1.6,0,3,1.1,3.3,2.6l8,32.7c0.8,3.4,5.5,3.5,6.5,0.1%0A%09%09%09%09l9.5-32.9c0.4-1.5,1.8-2.5,3.3-2.5h5.9c1.5,0,2.9,1,3.3,2.5l9.5,33c1,3.4,5.7,3.3,6.5-0.1l8.1-32.7c0.4-1.5,1.8-2.6,3.3-2.6h8.3%0A%09%09%09%09c2.3,0,3.9,2.1,3.3,4.3l-18.4,68.6C340.4,159.5,339.1,160.4,337.5,160.4z"/>%0A%09%09%09<path class="st3" d="M410.2,158.2l-2.9-8.7c-0.5-1.4-1.8-2.3-3.3-2.3h-21.9c-1.5,0-2.8,0.9-3.2,2.3l-3,8.7%0A%09%09%09%09c-0.5,1.4-1.8,2.3-3.2,2.3h-8.2c-2.4,0-4-2.4-3.2-4.6l24.9-68.6c0.5-1.4,1.8-2.3,3.2-2.3h6.8c1.4,0,2.7,0.9,3.2,2.3l25,68.6%0A%09%09%09%09c0.8,2.2-0.8,4.6-3.2,4.6h-8C412,160.4,410.7,159.6,410.2,158.2z M390.2,116.7l-4.8,13.6c-0.8,2.2,0.9,4.6,3.2,4.6h9.2%0A%09%09%09%09c2.3,0,4-2.3,3.3-4.5l-4.6-13.6C395.5,113.7,391.2,113.6,390.2,116.7z"/>%0A%09%09%09<path class="st3" d="M464.9,132.1h-11.2c-1.9,0-3.4,1.5-3.4,3.4v21.6c0,1.9-1.5,3.4-3.4,3.4h-7.9c-1.9,0-3.4-1.5-3.4-3.4V88.5%0A%09%09%09%09c0-1.9,1.5-3.4,3.4-3.4h25.8c15.5,0,24.8,10.7,24.8,23.5C489.8,121.4,480.5,132.1,464.9,132.1z M464.2,98.2h-10.4%0A%09%09%09%09c-1.9,0-3.4,1.5-3.4,3.4v13.9c0,1.9,1.5,3.4,3.4,3.4h10.4c6.6,0,10.9-4.2,10.9-10.3C475,102.4,470.8,98.2,464.2,98.2z"/>%0A%09%09</g>%0A%09</g>%0A</g>%0A</svg>%0A';
+
+// src/components/assets/SWAP BIZ_web logo_test-01.svg
+var SWAP_BIZ_web_logo_test_01_default = 'data:image/svg+xml,<?xml version="1.0" encoding="utf-8"?>%0A<!-- Generator: Adobe Illustrator 21.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->%0A<svg version="1.1" id="\u5716\u5C64_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"%0A%09 viewBox="75 0 680.3 226.8" style="enable-background:new 0 0 680.3 226.8;" xml:space="preserve">%0A<style type="text/css">%0A%09.st0{fill:%234862CC;}%0A%09.st1{fill:%23F59225;}%0A%09.st2{fill:none;}%0A%09.st3{fill:%23F7B52C;}%0A%09.st4{fill:%2397A3E1;}%0A%09.st5{fill:%23FFFFFF;}%0A%09.st6{fill:%23C1C7ED;}%0A</style>%0A<g>%0A%09<g>%0A%09%09<path class="st1" d="M531.8,160.6H515c-1.1,0-2-0.9-2-2v-41c0-1.1,0.9-2,2-2H531c8.8,0,13.9,4.9,13.9,12.7c0,3.5-1.6,6.1-3.3,7.7%0A%09%09%09c-0.9,0.8-0.8,2.3,0.2,3c2,1.6,3.8,4.3,3.8,8.6C545.6,156,539.8,160.6,531.8,160.6z M530.3,123.4h-6.6c-1.1,0-2,0.9-2,2v6.3%0A%09%09%09c0,1.1,0.9,2,2,2h6.6c3.7,0,5.8-2.1,5.8-5.2C536.2,125.5,534.1,123.4,530.3,123.4z M530.9,141.7h-7.1c-1.1,0-2,0.9-2,2v7%0A%09%09%09c0,1.1,0.9,2,2,2h7.1c4,0,5.9-2.5,5.9-5.6C536.8,144.1,534.9,141.7,530.9,141.7z"/>%0A%09%09<path class="st1" d="M554.6,158.6v-41c0-1.1,0.9-2,2-2h4.7c1.1,0,2,0.9,2,2v41c0,1.1-0.9,2-2,2h-4.7%0A%09%09%09C555.5,160.6,554.6,159.7,554.6,158.6z"/>%0A%09%09<path class="st1" d="M571.2,158.6v-4.5c0-0.4,0.1-0.8,0.3-1.1l16.9-26.5c0.9-1.4-0.1-3.1-1.7-3.1H574c-1.1,0-2-0.9-2-2v-3.8%0A%09%09%09c0-1.1,0.9-2,2-2h24.7c1.1,0,2,0.9,2,2v4.3c0,0.4-0.1,0.8-0.3,1.1l-17,26.6c-0.9,1.4,0.1,3.1,1.7,3.1h13.6c1.1,0,2,0.9,2,2v3.8%0A%09%09%09c0,1.1-0.9,2-2,2h-25.6C572.1,160.6,571.2,159.7,571.2,158.6z"/>%0A%09</g>%0A%09<g>%0A%09%09<path class="st0" d="M236.7,161.2c-10.1,0-18-1.9-24.8-7.5c-1.5-1.3-1.6-3.6-0.2-5l4.8-4.8c1.2-1.2,3.1-1.3,4.5-0.3%0A%09%09%09c4.5,3.3,10,4.4,16,4.4c8.7,0,13.4-3.3,13.4-9.3c0-2.6-0.7-4.9-2.3-6.4c-1.5-1.4-3.2-2.1-6.7-2.7l-9.1-1.3c-6.5-1-11.2-3-14.6-6.3%0A%09%09%09c-3.6-3.6-5.4-8.5-5.4-14.8c0-13.5,10-22.9,26.3-22.9c8.9,0,15.7,1.9,21.5,6.3c1.6,1.2,1.7,3.6,0.3,5.1l-4.6,4.5%0A%09%09%09c-1.2,1.2-3,1.3-4.4,0.3c-4.3-2.9-9-3.4-13.3-3.4c-7.8,0-11.7,4.3-11.7,9.5c0,1.9,0.6,3.9,2.2,5.4c1.5,1.4,3.9,2.5,7,3l8.9,1.3%0A%09%09%09c6.9,1,11.2,2.9,14.4,5.8c4,3.8,5.8,9.3,5.8,16C264.6,153,252.4,161.2,236.7,161.2z"/>%0A%09%09<path class="st0" d="M340.3,160.6h-7.2c-1.5,0-2.8-1-3.3-2.4l-9.9-32.7c-1-3.2-5.5-3.2-6.5,0l-9.9,32.7c-0.4,1.4-1.8,2.4-3.3,2.4%0A%09%09%09h-7.2c-1.5,0-2.9-1-3.3-2.5l-18.3-68.7c-0.6-2.2,1.1-4.3,3.3-4.3h8.3c1.6,0,2.9,1.1,3.3,2.6l8,32.7c0.8,3.4,5.6,3.5,6.6,0.1%0A%09%09%09l9.5-32.9c0.4-1.5,1.8-2.5,3.3-2.5h5.9c1.5,0,2.8,1,3.3,2.5l9.5,33c1,3.3,5.7,3.2,6.6-0.1l8.1-32.7c0.4-1.5,1.7-2.6,3.3-2.6h8.3%0A%09%09%09c2.2,0,3.9,2.1,3.3,4.3l-18.4,68.7C343.1,159.6,341.8,160.6,340.3,160.6z"/>%0A%09%09<path class="st0" d="M413,158.3l-2.9-8.7c-0.5-1.4-1.8-2.3-3.2-2.3h-21.9c-1.5,0-2.7,0.9-3.2,2.3l-3,8.8c-0.5,1.4-1.8,2.3-3.2,2.3%0A%09%09%09h-8.1c-2.4,0-4-2.3-3.2-4.6l25-68.7c0.5-1.3,1.8-2.2,3.2-2.2h6.8c1.4,0,2.7,0.9,3.2,2.2l25.1,68.7c0.8,2.2-0.8,4.6-3.2,4.6h-8.1%0A%09%09%09C414.8,160.6,413.5,159.6,413,158.3z M392.9,116.8l-4.7,13.5c-0.8,2.2,0.9,4.5,3.2,4.5h9.3c2.3,0,4-2.3,3.2-4.5l-4.6-13.5%0A%09%09%09C398.3,113.7,394,113.7,392.9,116.8z"/>%0A%09%09<path class="st0" d="M467.7,132.2h-11.1c-1.9,0-3.4,1.5-3.4,3.4v21.6c0,1.9-1.5,3.4-3.4,3.4h-7.9c-1.9,0-3.4-1.5-3.4-3.4V88.5%0A%09%09%09c0-1.9,1.5-3.4,3.4-3.4h25.9c15.6,0,24.9,10.7,24.9,23.5C492.6,121.5,483.3,132.2,467.7,132.2z M467,98.3h-10.4%0A%09%09%09c-1.9,0-3.4,1.5-3.4,3.4v13.9c0,1.9,1.5,3.4,3.4,3.4H467c6.7,0,10.9-4.1,10.9-10.3C477.9,102.5,473.7,98.3,467,98.3z"/>%0A%09</g>%0A%09<g>%0A%09%09<path class="st2" d="M129.1,127c-13.7,2.6-27.6,4.2-41.5,5.8c-0.1,2.5-0.1,5,0.3,7.5c1.8,13.2,10.4,24.2,22.6,29.3%0A%09%09%09c11.3,4.7,24.3,2.8,34.4-3.8c-3.5-8.1-6.9-16.2-10.2-24.4C132.8,136.6,130.9,131.8,129.1,127z"/>%0A%09%09<path class="st2" d="M121.2,99.9c-0.3-1.5-0.6-3-0.8-4.5c-7.4,2.7-14.7,6.3-20.5,11.4c-5.3,4.7-9,11-10.9,17.8%0A%09%09%09c12.6-1.4,25.2-2.9,37.6-5.2C124.4,113,122.5,106.5,121.2,99.9z"/>%0A%09%09<path class="st2" d="M166.5,107.5c2.3-1.3,4.5-2.8,6.5-4.5c6.1-5.3,9.4-13.3,9.3-21.4c-7.4,1-14.9,2.2-22.2,3.6%0A%09%09%09C162.6,92.5,164.8,99.9,166.5,107.5z"/>%0A%09%09<path class="st2" d="M165.7,56.6c-5.3-2.3-11.2-2.6-16.7-1.2c1.1,2.6,2.1,5.3,3.1,7.9c1.9,4.8,3.7,9.5,5.4,14.4%0A%09%09%09c7.8-1.5,15.7-2.7,23.6-3.9C178.8,66.1,173.2,59.9,165.7,56.6z"/>%0A%09%09<path class="st3" d="M160.7,118.8c-0.4-2.6-1-5.3-1.6-7.9c-1.1-4.6-2.3-9.2-3.7-13.7c-1-3.5-2.2-7-3.3-10.5%0A%09%09%09c-0.8-2.5-1.7-5-2.6-7.5c-2.5-7-5.2-14-8-21c-1,0.6-2,1.2-2.9,1.9c-8.6,6.3-11.4,15.2-11.4,24.6c0,2.7,0.2,5.4,0.6,8.2%0A%09%09%09c0.9,6.2,2.6,12.4,4.3,18.1c0.7,2.3,1.4,4.6,2.2,6.9c0.8,2.5,1.7,5,2.6,7.5c4.2,11.9,9.2,23.6,14.2,35.2%0A%09%09%09c6.6-6.8,10.3-15.7,10.7-25.3C162.1,129.7,161.6,124.2,160.7,118.8z"/>%0A%09%09<path class="st0" d="M190.3,80.5c-0.1-2.7-0.5-5.3-1.2-7.9c-2-7.5-6.4-14.3-12.8-19c-8.7-6.5-20-8.7-30.4-5.7%0A%09%09%09c-0.5,0.1-0.9,0.3-1.4,0.4c-2,0.7-4,1.5-5.8,2.5c-8.2,4.4-14.6,11.6-17.6,20.6c-1.7,5.1-2.1,10.5-1.7,15.9%0A%09%09%09c-7.6,2.7-14.9,6.1-21.4,10.9c-9.1,6.7-15.2,16.5-17.5,27.4c-0.5,2.5-0.8,5.1-0.9,7.8c0,0.1,0,0.2,0,0.3%0A%09%09%09c-0.5,14.5,6,28.6,17.7,37.4c11.9,8.9,27.5,11.5,41.5,6.5c3.3-1.2,6.4-2.7,9.3-4.5c2.3-1.4,4.5-3,6.5-4.8%0A%09%09%09c6.2-5.5,11-12.6,13.5-20.7c3.1-10.2,2.2-21.5,0.2-32c2.9-1.5,5.7-3.2,8.3-5.2c8.5-6.5,13.4-16.7,13.7-27.4%0A%09%09%09C190.3,82.2,190.3,81.3,190.3,80.5z M165.7,56.6c7.5,3.3,13.1,9.5,15.5,17.2c-7.9,1.1-15.8,2.4-23.6,3.9%0A%09%09%09c-1.7-4.8-3.6-9.6-5.4-14.4c-1-2.6-2.1-5.3-3.1-7.9C154.4,54,160.3,54.3,165.7,56.6z M99.8,106.9c5.8-5.2,13.1-8.7,20.5-11.4%0A%09%09%09c0.3,1.5,0.5,3,0.8,4.5c1.3,6.6,3.2,13.1,5.3,19.5c-12.4,2.3-25,3.8-37.6,5.2C90.8,117.9,94.5,111.6,99.8,106.9z M110.5,169.5%0A%09%09%09c-12.3-5.1-20.8-16.1-22.6-29.3c-0.3-2.5-0.4-5-0.3-7.5c13.9-1.6,27.8-3.2,41.5-5.8c1.8,4.8,3.6,9.6,5.6,14.4%0A%09%09%09c3.3,8.2,6.7,16.3,10.2,24.4C134.8,172.3,121.7,174.2,110.5,169.5z M161.9,135.2c-0.4,9.6-4.1,18.6-10.7,25.3%0A%09%09%09c-5-11.6-9.9-23.3-14.2-35.2c-0.9-2.5-1.8-5-2.6-7.5c-0.8-2.3-1.5-4.6-2.2-6.9c-1.7-5.6-3.4-11.8-4.3-18.1%0A%09%09%09c-0.4-2.7-0.6-5.5-0.6-8.2c0-9.5,2.8-18.4,11.4-24.6c0.9-0.7,1.9-1.3,2.9-1.9c2.8,6.9,5.5,13.9,8,21c0.9,2.5,1.7,5,2.6,7.5%0A%09%09%09c1.2,3.5,2.3,7,3.3,10.5c1.3,4.5,2.6,9,3.7,13.7c0.6,2.6,1.1,5.3,1.6,7.9C161.6,124.2,162.1,129.7,161.9,135.2z M173.1,103%0A%09%09%09c-2,1.7-4.2,3.2-6.5,4.5c-1.7-7.5-4-15-6.4-22.3c7.4-1.4,14.8-2.5,22.2-3.6C182.4,89.6,179.1,97.6,173.1,103z"/>%0A%09</g>%0A</g>%0A</svg>%0A';
+
+// src/components/assets/Blue - Biz.svg
+var Blue_Biz_default = 'data:image/svg+xml,<svg width="132" height="40" viewBox="0 0 132 40" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M97.966 22.542H101.704V21.044H97.966V18.16H96.202V25.342H94.242V20.456H92.59V25.342H91.078V26.84H102.978V25.342H97.966V22.542ZM96.762 14.016C95.362 16.116 92.8 17.782 90.294 18.762C90.714 19.14 91.19 19.742 91.428 20.176C93.458 19.252 95.446 17.936 97 16.284C98.904 18.314 100.752 19.336 102.684 20.176C102.88 19.672 103.328 19.084 103.734 18.734C101.746 18.034 99.8 17.082 97.966 15.15C98.064 15.024 98.162 14.884 98.26 14.758L96.762 14.016ZM108.648 24.502C107.794 25.02 106.17 25.496 104.77 25.692C105.106 26 105.54 26.546 105.75 26.896C107.192 26.56 108.872 25.832 109.824 25.034L108.648 24.502ZM112.414 25.202C113.59 25.692 115.228 26.434 116.04 26.896L117.216 25.986C116.32 25.538 114.668 24.838 113.534 24.418L112.414 25.202ZM113.002 17.726C112.806 18.062 112.512 18.482 112.288 18.804L112.792 18.958H108.97L109.726 18.776C109.614 18.482 109.39 18.076 109.166 17.726H113.002ZM111.812 22.668V22.052H116.012V20.848H111.812V20.218H116.67V18.958H113.968C114.22 18.706 114.514 18.398 114.822 18.062L113.506 17.726H117.202V16.424H115.396C115.746 15.934 116.124 15.304 116.516 14.66L114.766 14.254C114.57 14.856 114.192 15.71 113.87 16.27L114.374 16.424H113.128V14.142H111.56V16.424H110.51V14.142H108.97V16.424H107.682L108.354 16.172C108.172 15.64 107.71 14.8 107.29 14.212L105.862 14.688C106.184 15.22 106.548 15.892 106.758 16.424H104.854V17.726H108.424L107.486 17.936C107.668 18.244 107.878 18.636 108.004 18.958H105.428V20.218H110.16V20.848H106.128V22.052H110.16V22.668H104.826V24.04H110.16V27.232H111.812V24.04H117.244V22.668H111.812ZM120.758 19.7H123.628V14.548H122.13V18.244H120.758V14.254H119.288V19.784C119.288 21.828 119.19 24.544 118.378 26.28C118.714 26.504 119.26 26.994 119.526 27.288C120.254 25.958 120.562 24.138 120.688 22.318H122.018V27.176H123.53V20.848H120.744C120.758 20.484 120.758 20.134 120.758 19.784V19.7ZM125.546 25.748C126.022 24.25 126.176 22.472 126.218 20.918C126.568 22.038 126.974 23.074 127.506 23.998C126.932 24.726 126.288 25.328 125.546 25.748ZM129.396 19.84C129.172 20.806 128.85 21.716 128.43 22.528C127.996 21.702 127.632 20.792 127.366 19.84H129.396ZM130.18 18.272L129.9 18.328H126.232V16.438H131.006V14.94H124.678V19.882C124.678 21.814 124.566 24.642 123.572 26.434C123.964 26.616 124.566 27.05 124.86 27.33C125.098 26.938 125.294 26.504 125.448 26.042C125.77 26.378 126.148 26.882 126.344 27.246C127.142 26.77 127.856 26.14 128.472 25.412C129.06 26.112 129.732 26.7 130.516 27.148C130.768 26.728 131.272 26.084 131.65 25.776C130.81 25.356 130.068 24.754 129.452 24.026C130.306 22.57 130.894 20.764 131.202 18.594L130.18 18.272Z" fill="black"/>%0A<path d="M18.4791 20.6971C18.3985 20.1529 18.2776 19.6289 18.1566 19.0847C17.9349 18.1373 17.6931 17.2102 17.4109 16.3032C17.1892 15.5776 16.9675 14.8722 16.7457 14.1667C16.5845 13.6628 16.4031 13.1388 16.2217 12.6349C15.7178 11.2039 15.1736 9.77282 14.6093 8.36194C14.4077 8.48287 14.2062 8.6038 14.0046 8.74489C12.2511 10.0147 11.6867 11.8287 11.6867 13.7636C11.6867 14.3078 11.727 14.8722 11.8077 15.4365C11.9891 16.7063 12.3317 17.9761 12.6743 19.1048C12.8154 19.5684 12.9565 20.0521 13.1178 20.5157C13.279 21.0196 13.4604 21.5436 13.6418 22.0475C14.5085 24.4662 15.5163 26.8445 16.524 29.2027C17.8745 27.8321 18.6202 25.998 18.7008 24.0429C18.7613 22.9142 18.6605 21.8056 18.4791 20.6971Z" fill="%23F7B52C"/>%0A<path d="M24.4856 12.9169C24.4654 12.3727 24.3848 11.8286 24.2437 11.3045C23.8406 9.77269 22.9336 8.40212 21.6436 7.43466C19.8699 6.10439 17.5722 5.66097 15.4559 6.26564C15.3551 6.28579 15.2745 6.3261 15.1737 6.34626C14.7706 6.48735 14.3675 6.64859 13.9845 6.85015C12.3116 7.73699 11.0217 9.22849 10.3969 11.0223C10.0744 12.0704 9.99376 13.179 10.0744 14.2875C8.52241 14.8317 7.03091 15.5372 5.74096 16.5046C3.88665 17.8752 2.63701 19.8706 2.19359 22.0877C2.09281 22.6117 2.01219 23.1358 1.99203 23.68C1.99203 23.7001 1.99203 23.7203 1.99203 23.7404C1.89126 26.6831 3.22152 29.5654 5.57971 31.3391C7.99837 33.1531 11.1628 33.6771 14.0249 32.6693C14.69 32.4275 15.3148 32.1251 15.9195 31.7623C16.383 31.4801 16.8265 31.1375 17.2497 30.7747C18.5195 29.646 19.487 28.215 19.9909 26.5622C20.6157 24.4862 20.4343 22.1885 20.0312 20.052C20.6359 19.7497 21.2002 19.407 21.7243 19.0039C23.4576 17.6938 24.4452 15.5976 24.5259 13.441C24.5057 13.2394 24.5057 13.0782 24.4856 12.9169ZM19.487 8.03932C21.0188 8.70445 22.1475 9.97425 22.6312 11.5262C21.0188 11.7479 19.4265 12.01 17.8342 12.3123C17.4714 11.3247 17.1086 10.3572 16.7257 9.38974C16.5241 8.84554 16.3024 8.3215 16.0807 7.7773C17.2094 7.51528 18.3986 7.55559 19.487 8.03932ZM6.10375 18.2582C7.29293 17.2101 8.76428 16.4845 10.2759 15.9403C10.3364 16.2426 10.3767 16.5651 10.4573 16.8674C10.7395 18.2178 11.1023 19.5279 11.5457 20.8381C9.0263 21.3016 6.46655 21.6241 3.90681 21.9063C4.2696 20.4954 5.01536 19.2256 6.10375 18.2582ZM8.26039 31.0166C5.76111 29.9886 4.02774 27.7312 3.66494 25.0707C3.60447 24.5668 3.58432 24.0629 3.60447 23.559C6.42624 23.2366 9.26816 22.8939 12.0496 22.39C12.4124 23.3776 12.7954 24.3451 13.1783 25.3126C13.8435 26.9855 14.5489 28.6181 15.2543 30.2708C13.1985 31.5809 10.5581 31.9639 8.26039 31.0166ZM18.7211 24.0428C18.6405 25.9979 17.8947 27.832 16.5443 29.2026C15.5164 26.8444 14.5287 24.466 13.6621 22.0474C13.4807 21.5435 13.2993 21.0195 13.138 20.5156C12.9768 20.052 12.8357 19.5884 12.6946 19.1047C12.352 17.9558 12.0093 16.7062 11.8279 15.4364C11.7473 14.872 11.707 14.3278 11.707 13.7635C11.707 11.8286 12.2713 10.0347 14.0249 8.74476C14.2063 8.60367 14.4078 8.48274 14.6295 8.36181C15.1939 9.77269 15.7381 11.2037 16.242 12.6348C16.4234 13.1387 16.6048 13.6627 16.766 14.1666C17.0079 14.872 17.2296 15.5976 17.4311 16.3031C17.6932 17.2101 17.9552 18.1372 18.1769 19.0845C18.2978 19.6086 18.3986 20.1528 18.4994 20.697C18.6606 21.8055 18.7614 22.9141 18.7211 24.0428ZM20.9987 17.4721C20.5955 17.8349 20.1521 18.1372 19.6684 18.3992C19.3056 16.8674 18.8622 15.3558 18.3583 13.8441C19.8498 13.5619 21.3615 13.3201 22.8731 13.1185C22.8933 14.7511 22.2281 16.3837 20.9987 17.4721Z" fill="%234862CC"/>%0A<path d="M33.9386 29.3236C31.8828 29.3236 30.2703 28.9406 28.8796 27.8119C28.5571 27.5499 28.5571 27.0863 28.8393 26.8041L29.8067 25.8367C30.0486 25.5948 30.4316 25.5746 30.7137 25.7762C31.6207 26.4413 32.7494 26.6832 33.9588 26.6832C35.7325 26.6832 36.6798 26.0181 36.6798 24.7886C36.6798 24.2444 36.5387 23.801 36.196 23.4986C35.8937 23.2165 35.5511 23.0754 34.8456 22.9544L32.9913 22.6924C31.6812 22.4909 30.7137 22.0877 30.0083 21.4226C29.2827 20.697 28.8997 19.6892 28.8997 18.3993C28.8997 15.6581 30.9354 13.7434 34.2409 13.7434C36.0549 13.7434 37.4255 14.1263 38.6147 15.0333C38.9372 15.2752 38.9573 15.7791 38.6752 16.0613L37.748 16.9884C37.5061 17.2303 37.1433 17.2504 36.8612 17.0489C35.9945 16.4442 35.027 16.3636 34.1603 16.3636C32.568 16.3636 31.782 17.2504 31.782 18.2985C31.782 18.6815 31.9029 19.1047 32.2254 19.4071C32.5277 19.6892 33.0316 19.9311 33.6564 20.0117L35.4704 20.2738C36.8813 20.4753 37.748 20.8583 38.393 21.4629C39.2193 22.249 39.5821 23.3575 39.5821 24.7281C39.6225 27.6305 37.1433 29.3236 33.9386 29.3236Z" fill="%234862CC"/>%0A<path d="M55.0008 29.1825H53.5496C53.2473 29.1825 52.9853 28.9809 52.8845 28.6987L50.869 22.0474C50.6674 21.4025 49.7403 21.4025 49.5387 22.0474L47.5232 28.6987C47.4425 28.9809 47.1604 29.1825 46.858 29.1825H45.4068C45.0843 29.1825 44.8223 28.9809 44.7417 28.6786L41.0129 14.7108C40.892 14.2674 41.2346 13.8441 41.6781 13.8441H43.3711C43.6936 13.8441 43.9758 14.0659 44.0363 14.3682L45.6689 21.0195C45.8301 21.7048 46.7976 21.7249 46.9991 21.0397L48.934 14.348C49.0147 14.0457 49.2968 13.8441 49.5992 13.8441H50.8085C51.1108 13.8441 51.393 14.0457 51.4736 14.348L53.4086 21.0598C53.6101 21.7451 54.5776 21.7249 54.7388 21.0397L56.3916 14.3883C56.4722 14.086 56.7544 13.8643 57.0567 13.8643H58.7498C59.2133 13.8643 59.5358 14.2876 59.4149 14.731L55.666 28.6987C55.5854 28.9809 55.3233 29.1825 55.0008 29.1825Z" fill="%234862CC"/>%0A<path d="M69.7949 28.7188L69.2104 26.9452C69.1096 26.663 68.8476 26.4816 68.5453 26.4816H64.0909C63.7886 26.4816 63.5265 26.663 63.4459 26.9452L62.8413 28.7188C62.7405 29.001 62.4785 29.1824 62.1963 29.1824H60.5234C60.0396 29.1824 59.7172 28.6987 59.8784 28.2553L64.9576 14.2875C65.0584 14.0053 65.3204 13.8239 65.6026 13.8239H66.9933C67.2755 13.8239 67.5375 14.0053 67.6383 14.2875L72.7376 28.2553C72.8988 28.6987 72.5764 29.1824 72.0926 29.1824H70.46C70.1577 29.1824 69.8957 29.001 69.7949 28.7188ZM65.7235 20.2737L64.756 23.035C64.5948 23.4784 64.9374 23.9622 65.401 23.9622H67.2755C67.739 23.9622 68.0817 23.4986 67.9406 23.0552L67.0134 20.2939C66.8119 19.669 65.925 19.6489 65.7235 20.2737Z" fill="%234862CC"/>%0A<path d="M80.941 23.418H78.6634C78.2805 23.418 77.9781 23.7203 77.9781 24.1033V28.4972C77.9781 28.8801 77.6758 29.1825 77.2928 29.1825H75.6804C75.2975 29.1825 74.9951 28.8801 74.9951 28.4972V14.5294C74.9951 14.1465 75.2975 13.8441 75.6804 13.8441H80.941C84.1054 13.8441 86 16.0209 86 18.621C86 21.2412 84.1054 23.418 80.941 23.418ZM80.7797 16.5047H78.6634C78.2805 16.5047 77.9781 16.807 77.9781 17.19V20.0117C77.9781 20.3947 78.2805 20.697 78.6634 20.697H80.7797C82.1302 20.697 82.9968 19.8505 82.9968 18.6008C82.9968 17.3714 82.1302 16.5047 80.7797 16.5047Z" fill="%234862CC"/>%0A</svg>%0A';
+
+// src/components/assets/Color=Black.svg
+var Color_Black_default = 'data:image/svg+xml,<svg width="88" height="40" viewBox="0 0 88 40" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<rect width="88" height="40" fill="white"/>%0A<path d="M18.4924 20.6971C18.4118 20.1529 18.2909 19.6289 18.1699 19.0847C17.9482 18.1373 17.7064 17.2102 17.4242 16.3032C17.2025 15.5776 16.9808 14.8722 16.7591 14.1667C16.5978 13.6628 16.4164 13.1388 16.235 12.6349C15.7311 11.2039 15.1869 9.77282 14.6226 8.36194C14.421 8.48287 14.2195 8.6038 14.0179 8.74489C12.2644 10.0147 11.7 11.8287 11.7 13.7636C11.7 14.3078 11.7403 14.8722 11.821 15.4365C12.0024 16.7063 12.345 17.9761 12.6876 19.1048C12.8287 19.5684 12.9698 20.0521 13.1311 20.5157C13.2923 21.0196 13.4737 21.5436 13.6551 22.0475C14.5218 24.4662 15.5296 26.8445 16.5373 29.2027C17.8878 27.8321 18.6335 25.998 18.7141 24.0429C18.7746 22.9142 18.6738 21.8056 18.4924 20.6971Z" fill="%23CCCCCC"/>%0A<path d="M24.4989 12.9169C24.4787 12.3727 24.3981 11.8286 24.257 11.3045C23.8539 9.77269 22.9469 8.40212 21.6569 7.43466C19.8833 6.10439 17.5855 5.66097 15.4692 6.26564C15.3684 6.28579 15.2878 6.3261 15.187 6.34626C14.7839 6.48735 14.3808 6.64859 13.9979 6.85015C12.3249 7.73699 11.035 9.22849 10.4102 11.0223C10.0877 12.0704 10.0071 13.179 10.0877 14.2875C8.53572 14.8317 7.04421 15.5372 5.75426 16.5046C3.89996 17.8752 2.65032 19.8706 2.2069 22.0877C2.10612 22.6117 2.0255 23.1358 2.00534 23.68C2.00534 23.7001 2.00534 23.7203 2.00534 23.7404C1.90456 26.6831 3.23483 29.5654 5.59302 31.3391C8.01167 33.1531 11.1761 33.6771 14.0382 32.6693C14.7033 32.4275 15.3281 32.1251 15.9328 31.7623C16.3964 31.4801 16.8398 31.1375 17.263 30.7747C18.5328 29.646 19.5003 28.215 20.0042 26.5622C20.629 24.4862 20.4476 22.1885 20.0445 20.052C20.6492 19.7497 21.2135 19.407 21.7376 19.0039C23.4709 17.6938 24.4585 15.5976 24.5392 13.441C24.519 13.2394 24.519 13.0782 24.4989 12.9169ZM19.5003 8.03932C21.0321 8.70445 22.1608 9.97425 22.6446 11.5262C21.0321 11.7479 19.4398 12.01 17.8475 12.3123C17.4848 11.3247 17.122 10.3572 16.739 9.38974C16.5374 8.84554 16.3157 8.3215 16.094 7.7773C17.2227 7.51528 18.4119 7.55559 19.5003 8.03932ZM6.11706 18.2582C7.30623 17.2101 8.77758 16.4845 10.2892 15.9403C10.3497 16.2426 10.39 16.5651 10.4706 16.8674C10.7528 18.2178 11.1156 19.5279 11.559 20.8381C9.0396 21.3016 6.47986 21.6241 3.92011 21.9063C4.28291 20.4954 5.02866 19.2256 6.11706 18.2582ZM8.2737 31.0166C5.77442 29.9886 4.04104 27.7312 3.67825 25.0707C3.61778 24.5668 3.59762 24.0629 3.61778 23.559C6.43955 23.2366 9.28147 22.8939 12.0629 22.39C12.4257 23.3776 12.8087 24.3451 13.1916 25.3126C13.8568 26.9855 14.5622 28.6181 15.2676 30.2708C13.2118 31.5809 10.5714 31.9639 8.2737 31.0166ZM18.7344 24.0428C18.6538 25.9979 17.908 27.832 16.5576 29.2026C15.5297 26.8444 14.5421 24.466 13.6754 22.0474C13.494 21.5435 13.3126 21.0195 13.1513 20.5156C12.9901 20.052 12.849 19.5884 12.7079 19.1047C12.3653 17.9558 12.0226 16.7062 11.8412 15.4364C11.7606 14.872 11.7203 14.3278 11.7203 13.7635C11.7203 11.8286 12.2846 10.0347 14.0382 8.74476C14.2196 8.60367 14.4211 8.48274 14.6428 8.36181C15.2072 9.77269 15.7514 11.2037 16.2553 12.6348C16.4367 13.1387 16.6181 13.6627 16.7793 14.1666C17.0212 14.872 17.2429 15.5976 17.4444 16.3031C17.7065 17.2101 17.9685 18.1372 18.1902 19.0845C18.3111 19.6086 18.4119 20.1528 18.5127 20.697C18.6739 21.8055 18.7747 22.9141 18.7344 24.0428ZM21.012 17.4721C20.6089 17.8349 20.1654 18.1372 19.6817 18.3992C19.3189 16.8674 18.8755 15.3558 18.3716 13.8441C19.8631 13.5619 21.3748 13.3201 22.8864 13.1185C22.9066 14.7511 22.2414 16.3837 21.012 17.4721Z" fill="%234B4B4B"/>%0A<path d="M33.9519 29.3236C31.8961 29.3236 30.2836 28.9406 28.8929 27.8119C28.5704 27.5499 28.5704 27.0863 28.8526 26.8041L29.82 25.8367C30.0619 25.5948 30.4449 25.5747 30.727 25.7762C31.634 26.4413 32.7627 26.6832 33.9721 26.6832C35.7458 26.6832 36.6931 26.0181 36.6931 24.7886C36.6931 24.2444 36.552 23.801 36.2093 23.4986C35.907 23.2165 35.5644 23.0754 34.8589 22.9544L33.0046 22.6924C31.6945 22.4909 30.727 22.0878 30.0216 21.4226C29.296 20.697 28.913 19.6893 28.913 18.3993C28.913 15.6582 30.9488 13.7434 34.2543 13.7434C36.0682 13.7434 37.4388 14.1263 38.628 15.0333C38.9505 15.2752 38.9706 15.7791 38.6885 16.0613L37.7613 16.9884C37.5194 17.2303 37.1566 17.2504 36.8745 17.0489C36.0078 16.4442 35.0403 16.3636 34.1736 16.3636C32.5813 16.3636 31.7953 17.2504 31.7953 18.2985C31.7953 18.6815 31.9162 19.1048 32.2387 19.4071C32.541 19.6893 33.0449 19.9311 33.6697 20.0117L35.4837 20.2738C36.8946 20.4753 37.7613 20.8583 38.4063 21.4629C39.2327 22.249 39.5955 23.3576 39.5955 24.7281C39.6358 27.6305 37.1566 29.3236 33.9519 29.3236Z" fill="%234B4B4B"/>%0A<path d="M55.0141 29.1825H53.563C53.2606 29.1825 52.9986 28.9809 52.8978 28.6987L50.8823 22.0474C50.6807 21.4025 49.7536 21.4025 49.552 22.0474L47.5365 28.6987C47.4558 28.9809 47.1737 29.1825 46.8713 29.1825H45.4201C45.0977 29.1825 44.8356 28.9809 44.755 28.6786L41.0262 14.7108C40.9053 14.2674 41.248 13.8441 41.6914 13.8441H43.3844C43.7069 13.8441 43.9891 14.0659 44.0496 14.3682L45.6822 21.0195C45.8434 21.7048 46.8109 21.7249 47.0124 21.0397L48.9473 14.348C49.028 14.0457 49.3101 13.8441 49.6125 13.8441H50.8218C51.1241 13.8441 51.4063 14.0457 51.4869 14.348L53.4219 21.0598C53.6234 21.7451 54.5909 21.7249 54.7521 21.0397L56.4049 14.3883C56.4855 14.086 56.7677 13.8643 57.07 13.8643H58.7631C59.2266 13.8643 59.5491 14.2876 59.4282 14.731L55.6793 28.6987C55.5987 28.9809 55.3366 29.1825 55.0141 29.1825Z" fill="%234B4B4B"/>%0A<path d="M69.8082 28.7189L69.2237 26.9452C69.1229 26.663 68.8609 26.4816 68.5586 26.4816H64.1042C63.8019 26.4816 63.5399 26.663 63.4592 26.9452L62.8546 28.7189C62.7538 29.001 62.4918 29.1824 62.2096 29.1824H60.5367C60.053 29.1824 59.7305 28.6987 59.8917 28.2553L64.9709 14.2875C65.0717 14.0054 65.3337 13.824 65.6159 13.824H67.0066C67.2888 13.824 67.5508 14.0054 67.6516 14.2875L72.7509 28.2553C72.9122 28.6987 72.5897 29.1824 72.1059 29.1824H70.4733C70.171 29.1824 69.909 29.001 69.8082 28.7189ZM65.7368 20.2737L64.7693 23.035C64.6081 23.4784 64.9507 23.9622 65.4143 23.9622H67.2888C67.7523 23.9622 68.095 23.4986 67.9539 23.0552L67.0268 20.2939C66.8252 19.6691 65.9384 19.6489 65.7368 20.2737Z" fill="%234B4B4B"/>%0A<path d="M80.9543 23.418H78.6767C78.2938 23.418 77.9914 23.7203 77.9914 24.1033V28.4972C77.9914 28.8801 77.6891 29.1825 77.3062 29.1825H75.6937C75.3108 29.1825 75.0084 28.8801 75.0084 28.4972V14.5294C75.0084 14.1465 75.3108 13.8441 75.6937 13.8441H80.9543C84.1187 13.8441 86.0133 16.0209 86.0133 18.621C86.0133 21.2412 84.1187 23.418 80.9543 23.418ZM80.793 16.5047H78.6767C78.2938 16.5047 77.9914 16.807 77.9914 17.19V20.0117C77.9914 20.3947 78.2938 20.697 78.6767 20.697H80.793C82.1435 20.697 83.0102 19.8505 83.0102 18.6008C83.0102 17.3714 82.1435 16.5047 80.793 16.5047Z" fill="%234B4B4B"/>%0A</svg>%0A';
+
+// src/components/assets/Color=White.svg
+var Color_White_default = 'data:image/svg+xml,<svg width="88" height="40" viewBox="0 0 88 40" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<rect width="88" height="40" fill="black"/>%0A<path d="M18.4924 20.6971C18.4118 20.1529 18.2909 19.6289 18.1699 19.0847C17.9482 18.1373 17.7064 17.2102 17.4242 16.3032C17.2025 15.5776 16.9808 14.8722 16.7591 14.1667C16.5978 13.6628 16.4164 13.1388 16.235 12.6349C15.7311 11.2039 15.1869 9.77282 14.6226 8.36194C14.421 8.48287 14.2195 8.6038 14.0179 8.74489C12.2644 10.0147 11.7 11.8287 11.7 13.7636C11.7 14.3078 11.7403 14.8722 11.821 15.4365C12.0024 16.7063 12.345 17.9761 12.6876 19.1048C12.8287 19.5684 12.9698 20.0521 13.1311 20.5157C13.2923 21.0196 13.4737 21.5436 13.6551 22.0475C14.5218 24.4662 15.5296 26.8445 16.5373 29.2027C17.8878 27.8321 18.6335 25.998 18.7141 24.0429C18.7746 22.9142 18.6738 21.8056 18.4924 20.6971Z" fill="%23F7B52C"/>%0A<path d="M24.4989 12.9169C24.4787 12.3727 24.3981 11.8286 24.257 11.3045C23.8539 9.77269 22.9469 8.40212 21.6569 7.43466C19.8833 6.10439 17.5855 5.66097 15.4692 6.26564C15.3684 6.28579 15.2878 6.3261 15.187 6.34626C14.7839 6.48735 14.3808 6.64859 13.9979 6.85015C12.3249 7.73699 11.035 9.22849 10.4102 11.0223C10.0877 12.0704 10.0071 13.179 10.0877 14.2875C8.53572 14.8317 7.04421 15.5372 5.75426 16.5046C3.89996 17.8752 2.65032 19.8706 2.2069 22.0877C2.10612 22.6117 2.0255 23.1358 2.00534 23.68C2.00534 23.7001 2.00534 23.7203 2.00534 23.7404C1.90456 26.6831 3.23483 29.5654 5.59302 31.3391C8.01167 33.1531 11.1761 33.6771 14.0382 32.6693C14.7033 32.4275 15.3281 32.1251 15.9328 31.7623C16.3964 31.4801 16.8398 31.1375 17.263 30.7747C18.5328 29.646 19.5003 28.215 20.0042 26.5622C20.629 24.4862 20.4476 22.1885 20.0445 20.052C20.6492 19.7497 21.2135 19.407 21.7376 19.0039C23.4709 17.6938 24.4585 15.5976 24.5392 13.441C24.519 13.2394 24.519 13.0782 24.4989 12.9169ZM19.5003 8.03932C21.0321 8.70445 22.1608 9.97425 22.6446 11.5262C21.0321 11.7479 19.4398 12.01 17.8475 12.3123C17.4848 11.3247 17.122 10.3572 16.739 9.38974C16.5374 8.84554 16.3157 8.3215 16.094 7.7773C17.2227 7.51528 18.4119 7.55559 19.5003 8.03932ZM6.11706 18.2582C7.30623 17.2101 8.77758 16.4845 10.2892 15.9403C10.3497 16.2426 10.39 16.5651 10.4706 16.8674C10.7528 18.2178 11.1156 19.5279 11.559 20.8381C9.0396 21.3016 6.47986 21.6241 3.92011 21.9063C4.28291 20.4954 5.02866 19.2256 6.11706 18.2582ZM8.2737 31.0166C5.77442 29.9886 4.04104 27.7312 3.67825 25.0707C3.61778 24.5668 3.59762 24.0629 3.61778 23.559C6.43955 23.2366 9.28147 22.8939 12.0629 22.39C12.4257 23.3776 12.8087 24.3451 13.1916 25.3126C13.8568 26.9855 14.5622 28.6181 15.2676 30.2708C13.2118 31.5809 10.5714 31.9639 8.2737 31.0166ZM18.7344 24.0428C18.6538 25.9979 17.908 27.832 16.5576 29.2026C15.5297 26.8444 14.5421 24.466 13.6754 22.0474C13.494 21.5435 13.3126 21.0195 13.1513 20.5156C12.9901 20.052 12.849 19.5884 12.7079 19.1047C12.3653 17.9558 12.0226 16.7062 11.8412 15.4364C11.7606 14.872 11.7203 14.3278 11.7203 13.7635C11.7203 11.8286 12.2846 10.0347 14.0382 8.74476C14.2196 8.60367 14.4211 8.48274 14.6428 8.36181C15.2072 9.77269 15.7514 11.2037 16.2553 12.6348C16.4367 13.1387 16.6181 13.6627 16.7793 14.1666C17.0212 14.872 17.2429 15.5976 17.4444 16.3031C17.7065 17.2101 17.9685 18.1372 18.1902 19.0845C18.3111 19.6086 18.4119 20.1528 18.5127 20.697C18.6739 21.8055 18.7747 22.9141 18.7344 24.0428ZM21.012 17.4721C20.6089 17.8349 20.1654 18.1372 19.6817 18.3992C19.3189 16.8674 18.8755 15.3558 18.3716 13.8441C19.8631 13.5619 21.3748 13.3201 22.8864 13.1185C22.9066 14.7511 22.2414 16.3837 21.012 17.4721Z" fill="white"/>%0A<path d="M33.9519 29.3236C31.8961 29.3236 30.2836 28.9406 28.8929 27.8119C28.5704 27.5499 28.5704 27.0863 28.8526 26.8041L29.82 25.8367C30.0619 25.5948 30.4449 25.5747 30.727 25.7762C31.634 26.4413 32.7627 26.6832 33.9721 26.6832C35.7458 26.6832 36.6931 26.0181 36.6931 24.7886C36.6931 24.2444 36.552 23.801 36.2093 23.4986C35.907 23.2165 35.5644 23.0754 34.8589 22.9544L33.0046 22.6924C31.6945 22.4909 30.727 22.0878 30.0216 21.4226C29.296 20.697 28.913 19.6893 28.913 18.3993C28.913 15.6582 30.9488 13.7434 34.2543 13.7434C36.0682 13.7434 37.4388 14.1263 38.628 15.0333C38.9505 15.2752 38.9706 15.7791 38.6885 16.0613L37.7613 16.9884C37.5194 17.2303 37.1566 17.2504 36.8745 17.0489C36.0078 16.4442 35.0403 16.3636 34.1736 16.3636C32.5813 16.3636 31.7953 17.2504 31.7953 18.2985C31.7953 18.6815 31.9162 19.1048 32.2387 19.4071C32.541 19.6893 33.0449 19.9311 33.6697 20.0117L35.4837 20.2738C36.8946 20.4753 37.7613 20.8583 38.4063 21.4629C39.2327 22.249 39.5955 23.3576 39.5955 24.7281C39.6358 27.6305 37.1566 29.3236 33.9519 29.3236Z" fill="white"/>%0A<path d="M55.0141 29.1825H53.563C53.2606 29.1825 52.9986 28.9809 52.8978 28.6987L50.8823 22.0474C50.6807 21.4025 49.7536 21.4025 49.552 22.0474L47.5365 28.6987C47.4558 28.9809 47.1737 29.1825 46.8713 29.1825H45.4201C45.0977 29.1825 44.8356 28.9809 44.755 28.6786L41.0262 14.7108C40.9053 14.2674 41.248 13.8441 41.6914 13.8441H43.3844C43.7069 13.8441 43.9891 14.0659 44.0496 14.3682L45.6822 21.0195C45.8434 21.7048 46.8109 21.7249 47.0124 21.0397L48.9473 14.348C49.028 14.0457 49.3101 13.8441 49.6125 13.8441H50.8218C51.1241 13.8441 51.4063 14.0457 51.4869 14.348L53.4219 21.0598C53.6234 21.7451 54.5909 21.7249 54.7521 21.0397L56.4049 14.3883C56.4855 14.086 56.7677 13.8643 57.07 13.8643H58.7631C59.2266 13.8643 59.5491 14.2876 59.4282 14.731L55.6793 28.6987C55.5987 28.9809 55.3366 29.1825 55.0141 29.1825Z" fill="white"/>%0A<path d="M69.8082 28.7189L69.2237 26.9452C69.1229 26.663 68.8609 26.4816 68.5586 26.4816H64.1042C63.8019 26.4816 63.5399 26.663 63.4592 26.9452L62.8546 28.7189C62.7538 29.001 62.4918 29.1824 62.2096 29.1824H60.5367C60.053 29.1824 59.7305 28.6987 59.8917 28.2553L64.9709 14.2875C65.0717 14.0054 65.3337 13.824 65.6159 13.824H67.0066C67.2888 13.824 67.5508 14.0054 67.6516 14.2875L72.7509 28.2553C72.9122 28.6987 72.5897 29.1824 72.1059 29.1824H70.4733C70.171 29.1824 69.909 29.001 69.8082 28.7189ZM65.7368 20.2737L64.7693 23.035C64.6081 23.4784 64.9507 23.9622 65.4143 23.9622H67.2888C67.7523 23.9622 68.095 23.4986 67.9539 23.0552L67.0268 20.2939C66.8252 19.6691 65.9384 19.6489 65.7368 20.2737Z" fill="white"/>%0A<path d="M80.9543 23.418H78.6767C78.2938 23.418 77.9914 23.7203 77.9914 24.1033V28.4972C77.9914 28.8801 77.6891 29.1825 77.3062 29.1825H75.6937C75.3108 29.1825 75.0084 28.8801 75.0084 28.4972V14.5294C75.0084 14.1465 75.3108 13.8441 75.6937 13.8441H80.9543C84.1187 13.8441 86.0133 16.0209 86.0133 18.621C86.0133 21.2412 84.1187 23.418 80.9543 23.418ZM80.793 16.5047H78.6767C78.2938 16.5047 77.9914 16.807 77.9914 17.19V20.0117C77.9914 20.3947 78.2938 20.697 78.6767 20.697H80.793C82.1435 20.697 83.0102 19.8505 83.0102 18.6008C83.0102 17.3714 82.1435 16.5047 80.793 16.5047Z" fill="white"/>%0A</svg>%0A';
+
+// src/components/assets/Color=Blue.svg
+var Color_Blue_default = 'data:image/svg+xml,<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M27.3482 21.9154C27.239 21.178 27.0751 20.4679 26.9112 19.7305C26.6108 18.4468 26.283 17.1905 25.9007 15.9614C25.6002 14.9782 25.2998 14.0223 24.9994 13.0664C24.7809 12.3836 24.5351 11.6735 24.2893 10.9907C23.6065 9.05153 22.8691 7.11238 22.1043 5.20055C21.8312 5.36443 21.5581 5.5283 21.285 5.71948C18.9088 7.44013 18.1441 9.89819 18.1441 12.5201C18.1441 13.2576 18.1987 14.0223 18.308 14.787C18.5538 16.5077 19.0181 18.2283 19.4824 19.7578C19.6736 20.3859 19.8648 21.0414 20.0832 21.6696C20.3017 22.3524 20.5475 23.0625 20.7934 23.7453C21.9678 27.0227 23.3334 30.2455 24.699 33.441C26.5288 31.5838 27.5394 29.0984 27.6486 26.4492C27.7306 24.9197 27.594 23.4176 27.3482 21.9154Z" fill="%23F7B52C"/>%0A<path d="M35.4873 11.3729C35.46 10.6355 35.3507 9.89803 35.1595 9.18792C34.6133 7.11222 33.3843 5.25501 31.6363 3.94404C29.2329 2.14146 26.1193 1.5406 23.2516 2.35996C23.115 2.38727 23.0058 2.44189 22.8692 2.4692C22.323 2.66039 21.7767 2.87888 21.2578 3.152C18.9909 4.35372 17.243 6.3748 16.3963 8.80556C15.9593 10.2258 15.85 11.7279 15.9593 13.2301C13.8563 13.9675 11.8352 14.9234 10.0872 16.2344C7.57455 18.0916 5.88122 20.7955 5.28036 23.7998C5.1438 24.5099 5.03455 25.22 5.00724 25.9574C5.00724 25.9847 5.00724 26.012 5.00724 26.0393C4.87068 30.0269 6.67326 33.9325 9.86875 36.3359C13.1462 38.794 17.4341 39.5041 21.3124 38.1385C22.2137 37.8108 23.0604 37.4011 23.8797 36.9095C24.5079 36.5271 25.1088 36.0628 25.6823 35.5712C27.403 34.0417 28.7139 32.1026 29.3967 29.863C30.2434 27.0499 29.9976 23.9363 29.4514 21.0413C30.2707 20.6316 31.0354 20.1673 31.7456 19.6211C34.0944 17.8458 35.4327 15.0054 35.5419 12.083C35.5146 11.8099 35.5146 11.5914 35.4873 11.3729ZM28.7139 4.7634C30.7896 5.66469 32.3191 7.38534 32.9746 9.48835C30.7896 9.78878 28.632 10.1438 26.4744 10.5535C25.9827 9.21523 25.4911 7.90426 24.9722 6.5933C24.6991 5.85588 24.3987 5.14577 24.0982 4.40835C25.6277 4.05329 27.2391 4.10792 28.7139 4.7634ZM10.5789 18.6105C12.1903 17.1903 14.184 16.2071 16.2324 15.4697C16.3143 15.8793 16.369 16.3163 16.4782 16.726C16.8606 18.5559 17.3522 20.3312 17.9531 22.1064C14.5391 22.7346 11.0705 23.1716 7.60186 23.554C8.09348 21.6421 9.10402 19.9215 10.5789 18.6105ZM13.5012 35.8989C10.1146 34.506 7.76574 31.4471 7.27412 27.8419C7.19219 27.1591 7.16487 26.4763 7.19219 25.7935C11.0158 25.3565 14.8668 24.8922 18.6359 24.2094C19.1275 25.5477 19.6464 26.8587 20.1653 28.1697C21.0666 30.4366 22.0225 32.6488 22.9784 34.8884C20.1926 36.6637 16.6148 37.1826 13.5012 35.8989ZM27.6761 26.449C27.5668 29.0983 26.5563 31.5837 24.7264 33.4409C23.3335 30.2454 21.9952 27.0226 20.8208 23.7451C20.575 23.0623 20.3292 22.3522 20.1107 21.6694C19.8922 21.0413 19.701 20.4131 19.5098 19.7576C19.0455 18.2008 18.5812 16.5075 18.3354 14.7869C18.2262 14.0221 18.1716 13.2847 18.1716 12.52C18.1716 9.89803 18.9363 7.46727 21.3124 5.71932C21.5582 5.52813 21.8313 5.36426 22.1318 5.20039C22.8965 7.11222 23.6339 9.05136 24.3167 10.9905C24.5625 11.6733 24.8083 12.3834 25.0268 13.0662C25.3546 14.0221 25.655 15.0053 25.9281 15.9613C26.2832 17.1903 26.6382 18.4466 26.9387 19.7303C27.1025 20.4404 27.2391 21.1778 27.3757 21.9153C27.5941 23.4174 27.7307 24.9196 27.6761 26.449ZM30.7623 17.5454C30.2161 18.037 29.6152 18.4466 28.9597 18.8017C28.4681 16.726 27.8673 14.6776 27.1845 12.6292C29.2055 12.2469 31.2539 11.9191 33.3023 11.646C33.3296 13.8582 32.4284 16.0705 30.7623 17.5454Z" fill="%234862CC"/>%0A</svg>%0A';
+
+// src/components/assets/Color=White_icon.svg
+var Color_White_icon_default = 'data:image/svg+xml,<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<rect width="40" height="40" fill="black"/>%0A<path d="M27.3482 21.9154C27.239 21.178 27.0751 20.4679 26.9112 19.7305C26.6108 18.4468 26.283 17.1905 25.9007 15.9614C25.6002 14.9782 25.2998 14.0223 24.9994 13.0664C24.7809 12.3836 24.5351 11.6735 24.2893 10.9907C23.6065 9.05153 22.8691 7.11238 22.1043 5.20055C21.8312 5.36443 21.5581 5.5283 21.285 5.71948C18.9088 7.44013 18.1441 9.89819 18.1441 12.5201C18.1441 13.2576 18.1987 14.0223 18.308 14.787C18.5538 16.5077 19.0181 18.2283 19.4824 19.7578C19.6736 20.3859 19.8648 21.0414 20.0832 21.6696C20.3017 22.3524 20.5475 23.0625 20.7934 23.7453C21.9678 27.0227 23.3334 30.2455 24.699 33.441C26.5288 31.5838 27.5394 29.0984 27.6486 26.4492C27.7306 24.9197 27.594 23.4176 27.3482 21.9154Z" fill="%23F7B52C"/>%0A<path d="M35.4873 11.3729C35.46 10.6355 35.3507 9.89803 35.1595 9.18792C34.6133 7.11222 33.3843 5.25501 31.6363 3.94404C29.2329 2.14146 26.1193 1.5406 23.2516 2.35996C23.115 2.38727 23.0058 2.44189 22.8692 2.4692C22.323 2.66039 21.7767 2.87888 21.2578 3.152C18.9909 4.35372 17.243 6.3748 16.3963 8.80556C15.9593 10.2258 15.85 11.7279 15.9593 13.2301C13.8563 13.9675 11.8352 14.9234 10.0872 16.2344C7.57455 18.0916 5.88122 20.7955 5.28036 23.7998C5.1438 24.5099 5.03455 25.22 5.00724 25.9574C5.00724 25.9847 5.00724 26.012 5.00724 26.0393C4.87068 30.0269 6.67326 33.9325 9.86875 36.3359C13.1462 38.794 17.4341 39.5041 21.3124 38.1385C22.2137 37.8108 23.0604 37.4011 23.8797 36.9095C24.5079 36.5271 25.1088 36.0628 25.6823 35.5712C27.403 34.0417 28.7139 32.1026 29.3967 29.863C30.2434 27.0499 29.9976 23.9363 29.4514 21.0413C30.2707 20.6316 31.0354 20.1673 31.7456 19.6211C34.0944 17.8458 35.4327 15.0054 35.5419 12.083C35.5146 11.8099 35.5146 11.5914 35.4873 11.3729ZM28.7139 4.7634C30.7896 5.66469 32.3191 7.38534 32.9746 9.48835C30.7896 9.78878 28.632 10.1438 26.4744 10.5535C25.9827 9.21523 25.4911 7.90426 24.9722 6.5933C24.6991 5.85588 24.3987 5.14577 24.0982 4.40835C25.6277 4.05329 27.2391 4.10792 28.7139 4.7634ZM10.5789 18.6105C12.1903 17.1903 14.184 16.2071 16.2324 15.4697C16.3143 15.8793 16.369 16.3163 16.4782 16.726C16.8606 18.5559 17.3522 20.3312 17.9531 22.1064C14.5391 22.7346 11.0705 23.1716 7.60186 23.554C8.09348 21.6421 9.10402 19.9215 10.5789 18.6105ZM13.5012 35.8989C10.1146 34.506 7.76574 31.4471 7.27412 27.8419C7.19219 27.1591 7.16487 26.4763 7.19219 25.7935C11.0158 25.3565 14.8668 24.8922 18.6359 24.2094C19.1275 25.5477 19.6464 26.8587 20.1653 28.1697C21.0666 30.4366 22.0225 32.6488 22.9784 34.8884C20.1926 36.6637 16.6148 37.1826 13.5012 35.8989ZM27.6761 26.449C27.5668 29.0983 26.5563 31.5837 24.7264 33.4409C23.3335 30.2454 21.9952 27.0226 20.8208 23.7451C20.575 23.0623 20.3292 22.3522 20.1107 21.6694C19.8922 21.0413 19.701 20.4131 19.5098 19.7576C19.0455 18.2008 18.5812 16.5075 18.3354 14.7869C18.2262 14.0221 18.1716 13.2847 18.1716 12.52C18.1716 9.89803 18.9363 7.46727 21.3124 5.71932C21.5582 5.52813 21.8313 5.36426 22.1318 5.20039C22.8965 7.11222 23.6339 9.05136 24.3167 10.9905C24.5625 11.6733 24.8083 12.3834 25.0268 13.0662C25.3546 14.0221 25.655 15.0053 25.9281 15.9613C26.2832 17.1903 26.6382 18.4466 26.9387 19.7303C27.1025 20.4404 27.2391 21.1778 27.3757 21.9153C27.5941 23.4174 27.7307 24.9196 27.6761 26.449ZM30.7623 17.5454C30.2161 18.037 29.6152 18.4466 28.9597 18.8017C28.4681 16.726 27.8673 14.6776 27.1845 12.6292C29.2055 12.2469 31.2539 11.9191 33.3023 11.646C33.3296 13.8582 32.4284 16.0705 30.7623 17.5454Z" fill="white"/>%0A</svg>%0A';
+
+// src/components/SWAPLogo.tsx
+var import_jsx_runtime35 = require("react/jsx-runtime");
+function pickSrc(p) {
+  if (p.business) return p.chinese ? Blue_Biz_default : SWAP_BIZ_web_logo_test_01_default;
+  if (p.black) {
+    if (p.iconOnly) return Color_White_icon_default;
+    if (p.dark) return Color_White_default;
+    return Color_Black_default;
+  }
+  if (p.iconOnly) return Color_Blue_default;
+  if (p.dark) return SWAP_web_logo_white_default;
+  return SWAP_web_logo_default;
+}
+function logoHeight(size, business) {
+  const map = business ? { small: "48px", middle: "72px", large: "81px" } : { small: "30px", middle: "40px", large: "48px" };
+  if (size === "small" || size === "middle" || size === "large") return map[size];
+  if (typeof size === "number") return `${size}px`;
+  if (typeof size === "string") return size;
+  return business ? "42px" : "100%";
+}
+var SWAPLogo = (props) => {
+  const { size = "middle", width, height } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_Box16.default, { component: "span", sx: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+    "img",
+    {
+      src: pickSrc(props),
+      alt: props.business ? "SWAP BIZ" : "SWAP",
+      style: {
+        height: cssSize(height) ?? logoHeight(size, props.business),
+        width: cssSize(width)
+      }
+    }
+  ) });
+};
+var SWAPLogo_default = SWAPLogo;
+
+// src/components/SWAPShare.tsx
+var import_react = require("react");
+var import_Box17 = __toESM(require("@mui/material/Box"), 1);
+var import_react_share = require("react-share");
+var import_jsx_runtime36 = require("react/jsx-runtime");
+var SWAPShare = ({
+  url,
+  size = 36,
+  emailSubject = "",
+  sharedContent = ""
+}) => {
+  const [sharedUrl, setSharedUrl] = (0, import_react.useState)("");
+  (0, import_react.useEffect)(() => {
+    if (url && url.length > 0) {
+      setSharedUrl(url);
+    } else {
+      setSharedUrl(window.location.href);
+    }
+  }, []);
+  const handleEmailOnClick = () => {
+    const email = encodeURI(`mailto:
+    ?subject=${emailSubject}&body=${sharedContent}
+
+${sharedUrl}`);
+    window.location.href = email;
+  };
+  const handleMessengerOnClick = () => {
+    const appId = 549090209290719;
+    const mobileDevide = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
+    const mobile = "fb-messenger://share?link=" + encodeURIComponent(`${sharedUrl}`) + `&app_id=` + encodeURIComponent(appId);
+    const desktop = `https://www.facebook.com/dialog/send?link=${encodeURIComponent(
+      sharedUrl
+    )}&redirect_uri=${encodeURIComponent(sharedUrl)}&app_id=${appId}`;
+    window.open(mobileDevide ? mobile : desktop, "_blank");
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+    import_Box17.default,
+    {
+      sx: {
+        height: 40,
+        position: "relative",
+        display: "flex",
+        gap: "8px",
+        "& .swap_share_icon": { cursor: "pointer", width: 40, height: 40 }
+      },
+      children: [
+        {
+          el: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+            "div",
+            {
+              className: "swap_share_icon",
+              onClick: () => handleMessengerOnClick(),
+              children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+                "svg",
+                {
+                  width: "40",
+                  height: "40",
+                  viewBox: "0 0 40 40",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                      "path",
+                      {
+                        d: "M0 10C0 4.47715 4.47715 0 10 0H30C35.5228 0 40 4.47715 40 10V30C40 35.5228 35.5228 40 30 40H10C4.47715 40 0 35.5228 0 30V10Z",
+                        fill: "#ECECEC"
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                      "path",
+                      {
+                        d: "M19.9999 10C14.3599 10 9.99988 14.13 9.99988 19.7C9.99988 22.61 11.1899 25.14 13.1399 26.87C13.2999 27 13.3999 27.22 13.4099 27.44L13.4599 29.22C13.4999 29.79 14.0699 30.16 14.5899 29.93L16.5699 29.06C16.7399 29 16.9299 28.97 17.0999 29C17.9999 29.27 18.9999 29.4 19.9999 29.4C25.6399 29.4 29.9999 25.27 29.9999 19.7C29.9999 14.13 25.6399 10 19.9999 10ZM25.9999 17.46L23.0699 22.13C22.5999 22.86 21.5999 23.05 20.8999 22.5L18.5599 20.77C18.3499 20.61 18.0499 20.61 17.8399 20.77L14.6799 23.17C14.2599 23.5 13.7099 23 13.9999 22.54L16.9299 17.87C17.3999 17.14 18.3999 16.95 19.0999 17.47L21.4399 19.23C21.6599 19.39 21.9499 19.39 22.1599 19.23L25.3199 16.83C25.7399 16.5 26.2899 17 25.9999 17.46Z",
+                        fill: "#6F6F6F"
+                      }
+                    )
+                  ]
+                }
+              )
+            }
+          )
+        },
+        {
+          el: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_share.LineShareButton, { url: sharedUrl, title: sharedContent, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+            "svg",
+            {
+              width: "40",
+              height: "40",
+              viewBox: "0 0 40 40",
+              fill: "none",
+              xmlns: "http://www.w3.org/2000/svg",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                  "path",
+                  {
+                    d: "M0 10C0 4.47715 4.47715 0 10 0H30C35.5228 0 40 4.47715 40 10V30C40 35.5228 35.5228 40 30 40H10C4.47715 40 0 35.5228 0 30V10Z",
+                    fill: "#ECECEC"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                  "path",
+                  {
+                    d: "M10 20C10 14.4772 14.4772 10 20 10C25.5228 10 30 14.4772 30 20C30 25.5228 25.5228 30 20 30C14.4772 30 10 25.5228 10 20Z",
+                    fill: "#6F6F6F"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                  "path",
+                  {
+                    d: "M20.1666 14.667C16.7666 14.667 14 16.8957 14 19.6352C14 22.0912 16.1938 24.148 19.1573 24.5369C19.3581 24.5799 19.6314 24.6683 19.7006 24.8388C19.7628 24.9936 19.7413 25.236 19.7205 25.3924C19.7205 25.3924 19.6481 25.8244 19.6325 25.9164C19.6057 26.0712 19.5086 26.5218 20.1666 26.2464C20.8248 25.9711 23.718 24.1704 25.0118 22.6919C25.9053 21.719 26.3333 20.7316 26.3333 19.6352C26.3333 16.8957 23.5671 14.667 20.1666 14.667Z",
+                    fill: "white"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                  "path",
+                  {
+                    d: "M18.4525 18.3335C18.3868 18.3335 18.3334 18.3886 18.3334 18.4564V21.2106C18.3334 21.2785 18.3868 21.3335 18.4525 21.3335H18.881C18.9468 21.3335 19 21.2785 19 21.2106V18.4564C19 18.3886 18.9468 18.3335 18.881 18.3335H18.4525Z",
+                    fill: "#6F6F6F"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                  "path",
+                  {
+                    d: "M21.8746 18.3335H21.4235C21.3543 18.3335 21.2982 18.3886 21.2982 18.4564V20.0927L20.014 18.3881C20.011 18.3838 20.0077 18.3797 20.0042 18.3757L20.0034 18.3749C20.0009 18.3722 19.9984 18.3697 19.9958 18.3673C19.9951 18.3666 19.9944 18.366 19.9935 18.3652C19.9914 18.3633 19.9892 18.3615 19.9868 18.3598C19.9859 18.3588 19.9848 18.3581 19.9836 18.3572C19.9814 18.3558 19.9793 18.3542 19.9771 18.3529C19.9759 18.352 19.9746 18.3513 19.9733 18.3507C19.9711 18.3494 19.9688 18.348 19.9666 18.3469C19.9653 18.3463 19.964 18.3456 19.9627 18.3451C19.9603 18.344 19.958 18.3429 19.9555 18.3421C19.9541 18.3416 19.9528 18.3411 19.9515 18.3406C19.949 18.3398 19.9465 18.3389 19.9439 18.3383C19.9426 18.3379 19.9411 18.3376 19.9396 18.3371C19.9372 18.3366 19.9348 18.336 19.9325 18.3356C19.9307 18.3353 19.9289 18.3351 19.9272 18.335C19.925 18.3345 19.9227 18.3343 19.9205 18.3341C19.9184 18.3339 19.9163 18.3339 19.9141 18.3337C19.9125 18.3337 19.9113 18.3335 19.9097 18.3335H19.4586C19.3895 18.3335 19.3333 18.3886 19.3333 18.4564V21.2106C19.3333 21.2785 19.3895 21.3335 19.4586 21.3335H19.9097C19.979 21.3335 20.0351 21.2785 20.0351 21.2106V19.5748L21.3209 21.2815C21.3298 21.2939 21.3408 21.3039 21.3527 21.3119C21.3531 21.3122 21.3536 21.3125 21.354 21.3129C21.3566 21.3145 21.3591 21.316 21.3617 21.3175C21.363 21.3182 21.3641 21.3187 21.3653 21.3193C21.3672 21.3204 21.3693 21.3214 21.3712 21.3222C21.3733 21.3231 21.3752 21.3239 21.3774 21.3248C21.3786 21.3253 21.3799 21.3257 21.3811 21.3261C21.3841 21.3272 21.3868 21.328 21.3896 21.3289C21.3902 21.3289 21.3908 21.3291 21.3914 21.3293C21.4017 21.3319 21.4124 21.3335 21.4235 21.3335H21.8746C21.9439 21.3335 21.9999 21.2785 21.9999 21.2106V18.4564C21.9999 18.3886 21.9439 18.3335 21.8746 18.3335Z",
+                    fill: "#6F6F6F"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                  "path",
+                  {
+                    d: "M17.8782 20.6438H16.6837V18.4566C16.6837 18.3886 16.6291 18.3335 16.5618 18.3335H16.1221C16.0547 18.3335 16 18.3886 16 18.4566V21.2103V21.2105C16 21.2436 16.0131 21.2735 16.0341 21.2956C16.0346 21.2962 16.0351 21.2968 16.0358 21.2974C16.0364 21.298 16.037 21.2985 16.0376 21.2991C16.0596 21.3204 16.0891 21.3335 16.1219 21.3335H17.8782C17.9456 21.3335 18 21.2782 18 21.2103V20.7669C18 20.6989 17.9456 20.6438 17.8782 20.6438Z",
+                    fill: "#6F6F6F"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                  "path",
+                  {
+                    d: "M24.2115 19.0232C24.2789 19.0232 24.3334 18.9682 24.3334 18.9001V18.4567C24.3334 18.3887 24.2789 18.3335 24.2115 18.3335H22.4554H22.4552C22.4223 18.3335 22.3926 18.3468 22.3706 18.3683C22.3701 18.3688 22.3695 18.3691 22.3692 18.3696C22.3685 18.3703 22.3679 18.3711 22.3673 18.3718C22.3463 18.3938 22.3334 18.4236 22.3334 18.4566V18.4567V21.2104V21.2105C22.3334 21.2436 22.3465 21.2735 22.3675 21.2956C22.368 21.2962 22.3686 21.2969 22.3692 21.2974C22.3697 21.298 22.3704 21.2986 22.371 21.2991C22.3928 21.3203 22.4225 21.3335 22.4552 21.3335H24.2115C24.2789 21.3335 24.3334 21.2782 24.3334 21.2104V20.7669C24.3334 20.6991 24.2789 20.6438 24.2115 20.6438H23.0172V20.1783H24.2115C24.2789 20.1783 24.3334 20.1231 24.3334 20.0552V19.6118C24.3334 19.5438 24.2789 19.4886 24.2115 19.4886H23.0172V19.0232H24.2115Z",
+                    fill: "#6F6F6F"
+                  }
+                )
+              ]
+            }
+          ) })
+        },
+        {
+          el: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "swap_share_icon", onClick: handleEmailOnClick, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+            "svg",
+            {
+              width: "40",
+              height: "40",
+              viewBox: "0 0 40 40",
+              fill: "none",
+              xmlns: "http://www.w3.org/2000/svg",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                  "path",
+                  {
+                    d: "M0 10C0 4.47715 4.47715 0 10 0H30C35.5228 0 40 4.47715 40 10V30C40 35.5228 35.5228 40 30 40H10C4.47715 40 0 35.5228 0 30V10Z",
+                    fill: "#ECECEC"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+                  "path",
+                  {
+                    d: "M28 16L20 21L12 16V14L20 19L28 14V16ZM28 12H12C10.89 12 10 12.89 10 14V26C10 26.5304 10.2107 27.0391 10.5858 27.4142C10.9609 27.7893 11.4696 28 12 28H28C28.5304 28 29.0391 27.7893 29.4142 27.4142C29.7893 27.0391 30 26.5304 30 26V14C30 12.89 29.1 12 28 12Z",
+                    fill: "#6F6F6F"
+                  }
+                )
+              ]
+            }
+          ) })
+        }
+      ].map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { children: item.el }, `share_btn_${index}`))
+    }
+  );
+};
+var SWAPShare_default = SWAPShare;
+
+// src/components/TaxTextField.tsx
+var React27 = __toESM(require("react"), 1);
+var import_react2 = require("react");
+
+// src/tax/constants.ts
+var SWAPIncomeTypes = [
+  {
+    code: "9A",
+    label: "\u57F7\u884C\u696D\u52D9\u6240\u5F97"
+  },
+  {
+    code: "9B",
+    label: "\u7A3F\u8CBB"
+  },
+  {
+    code: "50",
+    label: "\u85AA\u8CC7\u6240\u5F97"
+  }
+];
+var SWAPExpenseTypes = [
+  { label: "\u5F8B\u5E2B", expenseRatio: "30%", code: "10", source: "9A" },
+  { label: "\u6703\u8A08\u5E2B", expenseRatio: "30%", code: "11", source: "9A" },
+  { label: "\u7CBE\u7B97\u5E2B", expenseRatio: "20%", code: "12", source: "9A" },
+  { label: "\u5730\u653F\u58EB", expenseRatio: "30%", code: "13", source: "9A" },
+  { label: "\u8A18\u5E33\u58EB", expenseRatio: "30%", code: "14", source: "9A" },
+  { label: "\u4EF2\u88C1\u4EBA", expenseRatio: "15%", code: "15", source: "9A" },
+  { label: "\u6C11\u9593\u516C\u8B49\u4EBA", expenseRatio: "30%", code: "16", source: "9A" },
+  { label: "\u4E0D\u52D5\u7522\u4F30\u50F9\u5E2B", expenseRatio: "35%", code: "17", source: "9A" },
+  {
+    label: "\u53D7\u59D4\u8A17\u4EE3\u8FA6\u570B\u6709\u975E\u516C\u7528\u4E0D\u52D5\u7522\u4E4B\u627F\u79DF\u3001\u7E8C\u79DF\u3001\u904E\u6236\u53CA\u7E7C\u627F\u7B49\u7533\u8ACB\u8005",
+    expenseRatio: "30%",
+    code: "18",
+    source: "9A"
+  },
+  {
+    label: "\u8A18\u5E33\u53CA\u5831\u7A05\u4EE3\u7406\u696D\u4EBA",
+    expenseRatio: "30%",
+    code: "19",
+    source: "9A"
+  },
+  { label: "\u6280\u5E2B", expenseRatio: "35%", code: "20", source: "9A" },
+  { label: "\u5EFA\u7BC9\u5E2B", expenseRatio: "35%", code: "21", source: "9A" },
+  { label: "\u516C\u5171\u5B89\u6AA2\u4EBA\u54E1", expenseRatio: "35%", code: "22", source: "9A" },
+  {
+    label: "\u672A\u5177\u6703\u8A08\u5E2B\u8CC7\u683C\uFF0C\u8FA6\u7406\u5DE5\u5546\u767B\u8A18\u7B49\u696D\u52D9\u8005",
+    expenseRatio: "30%",
+    code: "23",
+    source: "9A"
+  },
+  { label: "\u5DE5\u5320\uFF08\u5DE5\u8CC7\u6536\u5165\uFF09", expenseRatio: "20%", code: "24", source: "9A" },
+  { label: "\u5DE5\u5320\uFF08\u5DE5\u6599\u6536\u5165\uFF09", expenseRatio: "62%", code: "25", source: "9A" },
+  { label: "\u5F15\u6C34\u4EBA", expenseRatio: "25%", code: "26", source: "9A" },
+  {
+    label: "\u5F8B\u5E2B\u914D\u5408\u653F\u5E9C\u653F\u7B56\u8FA6\u7406\u6CD5\u5F8B\u6276\u52A9\u6848\u4EF6\u4E4B\u6536\u5165",
+    expenseRatio: "50%",
+    code: "27",
+    source: "9A"
+  },
+  { label: "\u5167\u79D1\u91AB\u5E2B", expenseRatio: "40%", code: "30", source: "9A" },
+  { label: "\u5916\u79D1\u91AB\u5E2B", expenseRatio: "45%", code: "31", source: "9A" },
+  { label: "\u5C0F\u5152\u79D1\u91AB\u5E2B", expenseRatio: "40%", code: "32", source: "9A" },
+  { label: "\u5A66\u7522\u79D1\u91AB\u5E2B", expenseRatio: "45%", code: "33", source: "9A" },
+  { label: "\u773C\u79D1\u91AB\u5E2B", expenseRatio: "40%", code: "34", source: "9A" },
+  { label: "\u8033\u9F3B\u5589\u79D1\u91AB\u5E2B", expenseRatio: "40%", code: "35", source: "9A" },
+  { label: "\u7259\u79D1\u91AB\u5E2B", expenseRatio: "40%", code: "36", source: "9A" },
+  { label: "\u7CBE\u795E\u79D1\u91AB\u5E2B", expenseRatio: "46%", code: "37", source: "9A" },
+  { label: "\u9AA8\u79D1\u91AB\u5E2B", expenseRatio: "45%", code: "38", source: "9A" },
+  { label: "\u5176\u4ED6\u79D1\u5225\u91AB\u5E2B", expenseRatio: "43%", code: "39", source: "9A" },
+  {
+    label: "\u52A9\u7522\u5E2B\uFF08\u58EB\uFF09",
+    expenseRatio: "31%",
+    code: "40",
+    source: "9A"
+  },
+  { label: "\u85E5\u5E2B", expenseRatio: "20%", code: "41", source: "9A" },
+  {
+    label: "\u91AB\u4E8B\u6AA2\u9A57\u5E2B\uFF08\u751F\uFF09",
+    expenseRatio: "43%",
+    code: "42",
+    source: "9A"
+  },
+  { label: "\u71DF\u990A\u5E2B", expenseRatio: "20%", code: "45", source: "9A" },
+  {
+    label: "\u91AB\u7642\u6A5F\u69CB\u91AB\u5E2B\u7D93\u6838\u51C6\u524D\u5F80\u4ED6\u91AB\u7642\u6A5F\u69CB\u5F9E\u4E8B\u91AB\u7642\u696D\u52D9\u4E14\u4E0D\u5177\u50F1\u50AD\u95DC\u4FC2\u8005",
+    expenseRatio: "10%",
+    code: "46",
+    source: "9A"
+  },
+  { label: "\u7378\u91AB\u5E2B", expenseRatio: "32%", code: "47", source: "9A" },
+  { label: "\u76AE\u819A\u79D1\u91AB\u5E2B", expenseRatio: "40%", code: "48", source: "9A" },
+  { label: "\u5BB6\u5EAD\u91AB\u5B78\u79D1\u91AB\u5E2B", expenseRatio: "40%", code: "49", source: "9A" },
+  { label: "\u4E2D\u91AB\u5E2B", expenseRatio: "20%", code: "50", source: "9A" },
+  { label: "\u8A9E\u8A00\u6CBB\u7642\u5E2B", expenseRatio: "20%", code: "51", source: "9A" },
+  { label: "\u4EBA\u58FD\u4FDD\u96AA\u91AB\u7642\u6AA2\u67E5", expenseRatio: "35%", code: "52", source: "9A" },
+  { label: "\u7269\u7406\u6CBB\u7642\u5E2B", expenseRatio: "43%", code: "53", source: "9A" },
+  { label: "\u8077\u80FD\u6CBB\u7642\u5E2B", expenseRatio: "43%", code: "54", source: "9A" },
+  { label: "\u5FC3\u7406\u5E2B", expenseRatio: "20%", code: "55", source: "9A" },
+  { label: "\u7259\u9AD4\u6280\u8853\u5E2B", expenseRatio: "40%", code: "56", source: "9A" },
+  {
+    label: "\u897F\u91AB\u5E2B\uFF08\u914D\u5408\u653F\u5E9C\u653F\u7B56\u8FA6\u7406\u8001\u4EBA\u3001\u5152\u7AE5\u3001\u5A66\u5973\u3001\u4E2D\u4F4E\u6536\u5165\u8005\u3001\u8EAB\u5FC3\u969C\u7919\u8005\u53CA\u5176\u4ED6\u7279\u5B9A\u5C0D\u8C61\u88DC\u52A9\u8A08\u756B\u4E4B\u696D\u52D9\u6536\u5165\uFF09",
+    expenseRatio: "78%",
+    code: "57",
+    source: "9A"
+  },
+  {
+    label: "\u897F\u91AB\u5E2B\uFF08\u81EA\u8CBB\u75AB\u82D7\u6CE8\u5C04\u6536\u5165\uFF09",
+    expenseRatio: "78%",
+    code: "58",
+    source: "9A"
+  },
+  {
+    label: "\u897F\u91AB\u5E2B\uFF08C\u578B\u809D\u708E\u5168\u53E3\u670D\u65B0\u85E5\u5065\u4FDD\u7D66\u4ED8\u6536\u5165\uFF09",
+    expenseRatio: "96%",
+    code: "59",
+    source: "9A"
+  },
+  { label: "\u66F8\u756B\u5BB6\u3001\u7248\u756B\u5BB6", expenseRatio: "30%", code: "61", source: "9A" },
+  { label: "\u547D\u7406\u535C\u5366", expenseRatio: "20%", code: "62", source: "9A" },
+  {
+    label: "\u8868\u6F14\u4EBA\uFF08\u6F14\u54E1\u3001\u6B4C\u624B\u3001\u6A21\u7279\u5152\u3001\u7BC0\u76EE\u4E3B\u6301\u4EBA\u3001\u821E\u8E48\u8868\u6F14\u4EBA\u3001\u76F8\u8072\u8868\u6F14\u4EBA\u3001\u7279\u6280\u8868\u6F14\u4EBA\u3001\u6A02\u5668\u8868\u6F14\u4EBA\u3001\u9B54\u8853\u8868\u6F14\u4EBA\u3001\u5176\u4ED6\u8868\u6F14\u4EBA\uFF09",
+    expenseRatio: "45%",
+    code: "70",
+    source: "9A"
+  },
+  { label: "\u4FDD\u96AA\u7D93\u7D00\u4EBA", expenseRatio: "26%", code: "71", source: "9A" },
+  { label: "\u7BC0\u76EE\u88FD\u4F5C\u4EBA", expenseRatio: "45%", code: "72", source: "9A" },
+  {
+    label: "\u516C\u76CA\u5F69\u5238\u7ACB\u5373\u578B\u5F69\u5238\u7D93\u92B7\u5546",
+    expenseRatio: "60%",
+    code: "73",
+    source: "9A"
+  },
+  { label: "\u4E00\u822C\u7D93\u7D00\u4EBA", expenseRatio: "20%", code: "76", source: "9A" },
+  { label: "\u5176\u4ED6", expenseRatio: "0%", code: "90", source: "9A" },
+  { label: "\u5546\u6A19\u4EE3\u7406\u4EBA", expenseRatio: "30%", code: "91", source: "9A" },
+  { label: "\u7A0B\u5F0F\u8A2D\u8A08\u5E2B", expenseRatio: "20%", code: "92", source: "9A" },
+  { label: "\u5C08\u5229\u5E2B\u53CA\u5C08\u5229\u4EE3\u7406", expenseRatio: "30%", code: "93", source: "9A" },
+  {
+    label: "\u672A\u5177\u5F8B\u5E2B\u8CC7\u683C\uFF0C\u8FA6\u7406\u8A34\u8A1F\u4EE3\u7406\u4EBA\u696D\u52D9",
+    expenseRatio: "23%",
+    code: "94",
+    source: "9A"
+  },
+  {
+    label: "\u672A\u5177\u5EFA\u7BC9\u5E2B\u8CC7\u683C\uFF0C\u8FA6\u7406\u5EFA\u7BC9\u898F\u5283\u8A2D\u8A08\u53CA\u76E3\u9020\u7B49\u696D\u52D9\u8005",
+    expenseRatio: "35%",
+    code: "95",
+    source: "9A"
+  },
+  {
+    label: "\u672A\u5177\u5730\u653F\u58EB\u8CC7\u683C\uFF0C\u8FA6\u7406\u571F\u5730\u767B\u8A18\u7B49\u696D\u52D9\u8005",
+    expenseRatio: "30%",
+    code: "96",
+    source: "9A"
+  },
+  {
+    label: "\u53D7\u5927\u9678\u5730\u5340\u4EBA\u6C11\u59D4\u8A17\u8FA6\u7406\u7E7C\u627F\u3001\u516C\u6CD5\u7D66\u4ED8\u6216\u5176\u4ED6\u4E8B\u52D9\u8005",
+    expenseRatio: "23%",
+    code: "97",
+    source: "9A"
+  },
+  { label: "\u81EA\u884C\u51FA\u7248", expenseRatio: "30%", code: "99", source: "9B" },
+  { label: "\u975E\u81EA\u884C\u51FA\u7248", expenseRatio: "75%", code: "98", source: "9B" }
+];
+var SWAPTaxIncomeLabel = (incomeCode) => {
+  if (incomeCode) {
+    return SWAPIncomeTypes.filter((type) => type.code === incomeCode)[0]?.label || "";
+  } else {
+    return "";
+  }
+};
+var SWAPTaxExpenseLabel = (expenseCode) => {
+  if (expenseCode) {
+    return SWAPExpenseTypes.filter((type) => type.code === expenseCode)[0]?.label || "";
+  } else {
+    return "";
+  }
+};
+var SWAPTaxDescription = (incomeCode, expenseCode) => {
+  let incomeLabel = SWAPTaxIncomeLabel(incomeCode);
+  let expenseLabel = SWAPTaxExpenseLabel(expenseCode);
+  let taxDescription = `${incomeCode} ${incomeLabel}${expenseLabel.length > 0 ? ` - [${expenseCode}] ${expenseLabel}` : ""}`;
+  if (incomeCode && expenseCode) {
+    return taxDescription;
+  } else if (incomeCode === "50") {
+    return `${incomeCode} ${incomeLabel}`;
+  } else {
+    return "";
+  }
+};
+
+// src/components/TaxTextField.tsx
+var import_jsx_runtime37 = require("react/jsx-runtime");
+var checkSvg4 = /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  "path",
+  {
+    d: "M17.4998 5.83345L7.49984 15.8334L2.9165 11.2501L4.0915 10.0751L7.49984 13.4751L16.3248 4.65845L17.4998 5.83345Z",
+    fill: "#4862CC"
+  }
+) });
+var headerItemStyle = {
+  fontSize: 12,
+  fontWeight: 700,
+  lineHeight: 1.4,
+  color: "#4b4b4b",
+  opacity: 1,
+  backgroundColor: "white"
+};
+var TaxTextField = ({
+  onChange,
+  codeValue,
+  domainValue,
+  domainCodeValue,
+  codeError,
+  codeHelperText,
+  domainError,
+  domainHelperText,
+  codeOnClick,
+  domainOnClick,
+  mobile,
+  codeFocused,
+  domainFocused
+}) => {
+  const [modalIncome, setModalIncome] = (0, import_react2.useState)("");
+  const [modalExpense, setModalExpense] = (0, import_react2.useState)("");
+  const [anchorEl, setAnchorEl] = React27.useState(null);
+  (0, import_react2.useEffect)(() => {
+    if (!modalIncome) return;
+    onChange?.({
+      incomeCode: modalIncome,
+      expenseCode: modalExpense,
+      incomeLabel: SWAPTaxIncomeLabel(modalIncome),
+      expenseLabel: SWAPTaxExpenseLabel(modalExpense),
+      taxDescription: SWAPTaxDescription(modalIncome, modalExpense),
+      expenseCodeAndLabel: modalExpense ? `[${modalExpense}] ${SWAPTaxExpenseLabel(modalExpense)}` : ""
+    });
+  }, [modalIncome, modalExpense]);
+  const handleCodeClick = () => {
+    codeOnClick?.();
+    setAnchorEl(null);
+  };
+  const handleDomainClick = (event) => {
+    setAnchorEl(anchorEl ? null : event.currentTarget);
+    if (codeValue) setModalIncome(codeValue);
+    domainOnClick?.();
+  };
+  const handleClose = (_e, reason) => {
+    if (reason === "toggleInput") return;
+    anchorEl?.focus();
+    setAnchorEl(null);
+  };
+  const selectedIcon = (active) => active ? checkSvg4 : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: mobile ? "column" : "row",
+        alignItems: "flex-start",
+        justifyContent: "space-between"
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { style: { width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+          TextField_default,
+          {
+            focused: codeFocused,
+            fullWidth: true,
+            select: true,
+            error: codeError,
+            helperText: codeHelperText,
+            height: 56,
+            label: "\u9078\u64C7\u7533\u5831\u985E\u5225",
+            value: codeValue ?? "",
+            onClick: handleCodeClick,
+            onChange: (e) => {
+              setModalIncome(e.target.value);
+              setModalExpense("");
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(MenuItem_default, { height: 36, disabled: true, style: headerItemStyle, children: "\u8ACB\u9078\u64C7\u7533\u5831\u985E\u5225" }),
+              SWAPIncomeTypes.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+                MenuItem_default,
+                {
+                  height: 36,
+                  value: option.code,
+                  style: {
+                    backgroundColor: modalIncome === option.code ? "white" : void 0,
+                    opacity: modalIncome === option.code ? 1 : void 0,
+                    display: "flex",
+                    justifyContent: "space-between",
+                    flexWrap: "nowrap",
+                    color: modalIncome === option.code ? swapColors.primary.primary400 : void 0
+                  },
+                  disabled: modalIncome === option.code,
+                  iconChildren: selectedIcon(modalIncome === option.code),
+                  children: [
+                    option.code,
+                    " ",
+                    option.label
+                  ]
+                },
+                `case_${index}`
+              ))
+            ]
+          }
+        ) }),
+        codeValue === "9A" || codeValue === "9B" ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { style: { width: "100%", margin: mobile ? "24px 0 0 0" : "0 0 0 8px" }, children: codeValue === "9B" ? (
+          // 9B：下拉選單
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+            TextField_default,
+            {
+              focused: domainFocused,
+              select: true,
+              fullWidth: true,
+              error: domainError,
+              helperText: domainHelperText,
+              height: 56,
+              label: "\u8F38\u5165\u57F7\u884C\u696D\u52D9\u985E\u5225",
+              value: domainCodeValue ?? "",
+              onClick: handleDomainClick,
+              onChange: (e) => {
+                setModalExpense(e.target.value);
+                setAnchorEl(null);
+              },
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(MenuItem_default, { height: 36, disabled: true, style: headerItemStyle, children: "\u9078\u64C7\u57F7\u884C\u696D\u52D9\u985E\u5225" }),
+                SWAPExpenseTypes.filter((i) => i.source === codeValue).map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+                  MenuItem_default,
+                  {
+                    height: 36,
+                    value: option.code,
+                    style: {
+                      backgroundColor: modalExpense === option.code ? "white" : void 0,
+                      opacity: modalExpense === option.code ? 1 : void 0,
+                      display: "flex",
+                      justifyContent: "space-between",
+                      flexWrap: "nowrap",
+                      color: modalExpense === option.code ? swapColors.primary.primary400 : void 0
+                    },
+                    disabled: modalExpense === option.code,
+                    iconChildren: selectedIcon(modalExpense === option.code),
+                    children: [
+                      "[",
+                      option.code,
+                      "] ",
+                      option.label
+                    ]
+                  },
+                  `case_${index}`
+                ))
+              ]
+            }
+          )
+        ) : (
+          // 9A：搜尋式選單
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_jsx_runtime37.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+              TextField_default,
+              {
+                focused: domainFocused,
+                error: domainError,
+                helperText: domainHelperText,
+                fullWidth: true,
+                label: "\u8F38\u5165\u57F7\u884C\u696D\u52D9\u985E\u5225",
+                height: 56,
+                value: domainValue ?? "",
+                onClick: handleDomainClick,
+                slotProps: {
+                  input: {
+                    readOnly: true,
+                    endAdornment: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { style: { width: 24, height: 24 }, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("path", { d: "M7 10L12 15L17 10H7Z", fill: "black" }) }) })
+                  }
+                }
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+              AutoComplete_default,
+              {
+                width: mobile ? "calc(100% - 32px)" : "292px",
+                optionsMaxHeight: 150,
+                disableFreeInput: true,
+                multiple: true,
+                disableCloseOnSelect: true,
+                anchorEl,
+                open: Boolean(anchorEl),
+                onClose: handleClose,
+                onChange: (_, newValue) => {
+                  const arr = newValue;
+                  const last = arr[arr.length - 1];
+                  if (last?.code) setModalExpense(last.code);
+                  setAnchorEl(null);
+                },
+                value: domainValue,
+                options: SWAPExpenseTypes.filter((i) => i.source === codeValue),
+                placement: "bottom-start",
+                placeholder: "\u8F38\u5165\u57F7\u884C\u696D\u52D9\u985E\u5225",
+                title: "\u9078\u64C7\u57F7\u884C\u696D\u52D9\u985E\u5225",
+                renderOption: (liProps, option) => {
+                  const o = option;
+                  const { key, ...rest } = liProps;
+                  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("li", { ...rest, children: [
+                    "[",
+                    o.code,
+                    "] ",
+                    o.label
+                  ] }, key);
+                },
+                getOptionLabel: (option) => {
+                  const o = option;
+                  return o.code + o.label;
+                }
+              }
+            )
+          ] })
+        ) }) : null
+      ]
+    }
+  );
+};
+var TaxTextField_default = TaxTextField;
+
+// src/components/DatePicker.tsx
+var import_dayjs = __toESM(require("dayjs"), 1);
+var import_LocalizationProvider = require("@mui/x-date-pickers/LocalizationProvider");
+var import_AdapterDayjs = require("@mui/x-date-pickers/AdapterDayjs");
+var import_DateCalendar = require("@mui/x-date-pickers/DateCalendar");
+var import_jsx_runtime38 = require("react/jsx-runtime");
+var VIEWS = {
+  year: ["year"],
+  month: ["year", "month"],
+  day: ["year", "month", "day"]
+};
+function toV1String(d, format) {
+  if (format === "year") return String(d.year());
+  if (format === "month") return `${d.year()}-${d.month() + 1}`;
+  return `${d.year()}-${d.month() + 1}-${d.date()}`;
+}
+var DatePicker = ({
+  format = "day",
+  open = false,
+  onClose,
+  mobile,
+  ModalProps,
+  min,
+  max,
+  defaultValue,
+  value,
+  getValue
+}) => {
+  const parsed = value ? (0, import_dayjs.default)(value) : defaultValue ? (0, import_dayjs.default)(defaultValue) : void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+    Modal_default,
+    {
+      open,
+      onClose: () => onClose?.(),
+      title: "\u9078\u64C7\u65E5\u671F",
+      width: "fit-content",
+      bodyPadding: 8,
+      mobile,
+      ...ModalProps,
+      children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_LocalizationProvider.LocalizationProvider, { dateAdapter: import_AdapterDayjs.AdapterDayjs, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+        import_DateCalendar.DateCalendar,
+        {
+          views: [...VIEWS[format]],
+          openTo: format,
+          value: parsed && parsed.isValid() ? parsed : null,
+          minDate: min ? (0, import_dayjs.default)(min) : void 0,
+          maxDate: max ? (0, import_dayjs.default)(max) : void 0,
+          onChange: (newValue, selectionState) => {
+            if (!newValue) return;
+            const finished = format === "day" ? selectionState === "finish" : true;
+            const isTargetView = format === "day" || selectionState === "finish";
+            if (finished && isTargetView) {
+              getValue?.(toV1String(newValue, format));
+              onClose?.();
+            }
+          }
+        }
+      ) })
+    }
+  );
+};
+var DatePicker_default = DatePicker;
+
+// src/index.ts
+var SWAP_UI_VERSION = "2.0.0-beta.1";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AutoComplete,
+  Banner,
+  Breadcrumb,
+  BreadcrumbItem,
+  Card,
+  CheckBox,
+  CheckBoxList,
+  Chip,
+  CircularProgress,
+  Container,
+  DatePicker,
+  Dropdown,
+  IconButton,
+  Link,
+  MenuItem,
+  Modal,
+  Paper,
+  Progress,
+  RadioButton,
+  RadioList,
+  SWAPExpenseTypes,
+  SWAPIncomeTypes,
+  SWAPLogo,
+  SWAPShare,
+  SWAPTaxDescription,
+  SWAPTaxExpenseLabel,
+  SWAPTaxIncomeLabel,
+  SWAPThemeProvider,
+  SWAP_UI_VERSION,
+  SegmentedTab,
+  SegmentedTabs,
+  Select,
+  Snackbar,
+  Switch,
+  Tab,
+  TabPanel,
+  Tabs,
+  TaxTextField,
+  TextField,
+  Tooltip,
+  Typography,
+  createSwapTheme,
+  swapBreakpoints,
+  swapColors,
+  swapFontFamily,
+  swapRadius,
+  swapShadows,
+  useBreakpoints
+});
+/*! Bundled license information:
+
+react-is/cjs/react-is.production.js:
+  (**
+   * @license React
+   * react-is.production.js
+   *
+   * Copyright (c) Meta Platforms, Inc. and affiliates.
+   *
+   * This source code is licensed under the MIT license found in the
+   * LICENSE file in the root directory of this source tree.
+   *)
+
+react-is/cjs/react-is.development.js:
+  (**
+   * @license React
+   * react-is.development.js
+   *
+   * Copyright (c) Meta Platforms, Inc. and affiliates.
+   *
+   * This source code is licensed under the MIT license found in the
+   * LICENSE file in the root directory of this source tree.
+   *)
+
+@mui/utils/index.mjs:
+  (**
+   * @mui/utils v9.2.0
+   *
+   * @license MIT
+   * This source code is licensed under the MIT license found in the
+   * LICENSE file in the root directory of this source tree.
+   *)
+*/
+//# sourceMappingURL=index.cjs.map