@0xsquid/ui 0.13.10 → 0.14.0

package/dist/index.css

@@ -581,14 +581,6 @@ video {
   bottom: 0px;
 }
 
-.-tw-bottom-1 {
-  bottom: -0.25rem;
-}
-
-.-tw-bottom-1\.5 {
-  bottom: -0.375rem;
-}
-
 .-tw-bottom-20 {
   bottom: -5rem;
 }
@@ -609,14 +601,6 @@ video {
   right: -33.333333%;
 }
 
-.-tw-top-1 {
-  top: -0.25rem;
-}
-
-.-tw-top-1\.5 {
-  top: -0.375rem;
-}
-
 .-tw-top-8 {
   top: -2rem;
 }
@@ -960,6 +944,10 @@ video {
   height: 60px;
 }
 
+.tw-h-\[640px\] {
+  height: 640px;
+}
+
 .tw-h-\[660px\] {
   height: 660px;
 }
@@ -1831,8 +1819,16 @@ video {
   background-color: var(--squid-theme-grey-800) !important;
 }
 
-.\!tw-bg-royal-400 {
-  background-color: var(--squid-theme-royal-400) !important;
+.\!tw-bg-status-negative {
+  background-color: var(--squid-theme-status-negative) !important;
+}
+
+.\!tw-bg-status-partial {
+  background-color: var(--squid-theme-status-partial) !important;
+}
+
+.\!tw-bg-status-positive {
+  background-color: var(--squid-theme-status-positive) !important;
 }
 
 .tw-bg-grey-100 {
@@ -1985,6 +1981,10 @@ video {
   padding: 3px;
 }
 
+.tw-p-squid-l {
+  padding: 1.875rem;
+}
+
 .tw-p-squid-s {
   padding: 0.9375rem;
 }
@@ -1993,6 +1993,10 @@ video {
   padding: 0.625rem;
 }
 
+.tw-p-squid-xxl {
+  padding: 3.75rem;
+}
+
 .\!tw-px-2 {
   padding-left: 0.5rem !important;
   padding-right: 0.5rem !important;
@@ -2428,6 +2432,10 @@ video {
   color: var(--squid-theme-grey-900);
 }
 
+.tw-text-material-dark-thin {
+  color: var(--squid-theme-material-dark-thin);
+}
+
 .tw-text-material-light-average {
   color: var(--squid-theme-material-light-average);
 }
@@ -2629,7 +2637,7 @@ li {
   list-style-type: none;
 }
 
-.tw-swap-detail-list-item-gradient:nth-child(even) > div {
+.tw-swap-detail-list-item-gradient:nth-child(odd) > div {
   background: linear-gradient(
     91deg,
     /* grey-100 with 0.05 opacity */ var(--squid-theme-grey-100-005) 0%,
@@ -2898,26 +2906,10 @@ input[type='number'] {
   color: var(--squid-theme-material-light-average);
 }
 
-.tw-group[data-squid-theme-type=dark] .group-data-\[squid-theme-type\=dark\]\:tw-text-material-light-thick {
-  color: var(--squid-theme-material-light-thick);
-}
-
-.tw-group[data-squid-theme-type=dark] .group-data-\[squid-theme-type\=dark\]\:tw-text-material-light-thin {
-  color: var(--squid-theme-material-light-thin);
-}
-
 .tw-group[data-squid-theme-type=light] .group-data-\[squid-theme-type\=light\]\:tw-text-grey-900 {
   color: var(--squid-theme-grey-900);
 }
 
-.tw-group[data-squid-theme-type=light] .group-data-\[squid-theme-type\=light\]\:tw-text-material-dark-thick {
-  color: var(--squid-theme-material-dark-thick);
-}
-
-.tw-group[data-squid-theme-type=light] .group-data-\[squid-theme-type\=light\]\:tw-text-material-dark-thin {
-  color: var(--squid-theme-material-dark-thin);
-}
-
 .tw-group[data-squid-theme-type=light] .group-data-\[squid-theme-type\=light\]\:tw-text-transparent {
   color: transparent;
 }

package/dist/index.d.ts

@@ -59,9 +59,8 @@ type SwapStepDescriptionBlock = {
 };
 type SwapStep = {
     descriptionBlocks: SwapStepDescriptionBlock[];
-    chipContent: React.ReactNode;
     link?: string;
-    status: SwapState;
+    status: SwapStepItemStatus;
 };
 declare enum SwapState {
     CONFIRM = 0,
@@ -74,7 +73,7 @@ declare enum SwapState {
     NEEDS_GAS = 7
 }
 type ThemeType = 'light' | 'dark';
-type SwapStepItemStatus = 'executed' | 'progress' | 'pending';
+type SwapStepItemStatus = 'pending' | 'waiting' | 'ongoing' | 'executed' | 'success' | 'error' | 'warning';
 
 interface BoostButtonProps {
     boostMode: BoostMode;
@@ -318,12 +317,11 @@ declare function SwapDetailListItem({ label, detail, icon, isLoading, }: SwapDet
 
 interface SwapStepItemProps {
     descriptionBlocks: SwapStepDescriptionBlock[];
-    chipContent: React.ReactNode;
     showStepSeparator?: boolean;
     link?: string;
     status?: SwapStepItemStatus;
 }
-declare function SwapStepItem({ descriptionBlocks, chipContent, showStepSeparator, link, status, }: SwapStepItemProps): react_jsx_runtime.JSX.Element;
+declare function SwapStepItem({ descriptionBlocks, showStepSeparator, link, status, }: SwapStepItemProps): react_jsx_runtime.JSX.Element;
 
 interface DropdownMenuProps {
     dropdownRef?: React.RefObject<HTMLDivElement>;
@@ -491,9 +489,10 @@ type Token = {
     logoUrl: string;
     bgColor: string;
 };
-declare function SwapProgressView({ steps, isOpen, handleClose, socialLink, supportLink, fromAmount, fromChain, fromToken, toAmount, toChain, toToken, fromAddressFormatted, toAddressFormatted, swapState, estimatedTimeToComplete, }: {
+declare function SwapProgressView({ steps, isOpen, handleClose, handleComplete, socialLink, supportLink, fromAmount, fromChain, fromToken, toAmount, toChain, toToken, fromAddressFormatted, toAddressFormatted, swapState, estimatedTimeToComplete, }: {
     steps: SwapStep[];
     handleClose?: () => void;
+    handleComplete?: () => void;
     isOpen?: boolean;
     socialLink?: string;
     supportLink?: string;

package/package.json

@@ -5,7 +5,7 @@
     "url": "git+https://github.com/0xsquid/squid-ui.git"
   },
   "description": "Squid's UI components",
-  "version": "0.13.10",
+  "version": "0.14.0",
   "author": "",
   "license": "MIT",
   "resolutions": {