@0xsquid/ui 0.13.5 → 0.13.7

package/dist/index.css

@@ -633,10 +633,6 @@ video {
   top: -55px;
 }
 
-.-tw-top-full {
-  top: -100%;
-}
-
 .tw-bottom-0 {
   bottom: 0px;
 }
@@ -753,8 +749,8 @@ video {
   top: 1.75rem;
 }
 
-.tw-top-full {
-  top: 100%;
+.tw-top-\[52px\] {
+  top: 52px;
 }
 
 .tw-top-squid-xxs {
@@ -840,10 +836,6 @@ video {
   margin-top: 0.25rem;
 }
 
-.tw-inline-block {
-  display: inline-block;
-}
-
 .tw-flex {
   display: flex;
 }
@@ -952,6 +944,10 @@ video {
   height: 52px;
 }
 
+.tw-h-\[535px\] {
+  height: 535px;
+}
+
 .tw-h-\[536px\] {
   height: 536px;
 }
@@ -1024,12 +1020,12 @@ video {
   max-height: 205px;
 }
 
-.tw-max-h-\[535px\] {
-  max-height: 535px;
+.tw-max-h-\[413px\] {
+  max-height: 413px;
 }
 
-.tw-max-h-\[536px\] {
-  max-height: 536px;
+.tw-max-h-\[535px\] {
+  max-height: 535px;
 }
 
 .tw-max-h-\[540px\] {
@@ -1068,10 +1064,6 @@ video {
   min-height: 30px;
 }
 
-.tw-min-h-\[460px\] {
-  min-height: 460px;
-}
-
 .tw-min-h-button {
   min-height: 3.75rem;
 }
@@ -1299,6 +1291,10 @@ video {
   min-width: 30px;
 }
 
+.tw-min-w-\[400px\] {
+  min-width: 400px;
+}
+
 .tw-min-w-\[60px\] {
   min-width: 60px;
 }
@@ -1385,45 +1381,38 @@ video {
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
-.tw-rotate-90 {
-  --tw-rotate: 90deg;
-  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-
 @keyframes tw-blur-in {
   0% {
     -webkit-backdrop-filter: blur(0px) saturate(0%);
             backdrop-filter: blur(0px) saturate(0%);
-    opacity: 0;
   }
 
   100% {
     -webkit-backdrop-filter: blur(20px) saturate(150%);
             backdrop-filter: blur(20px) saturate(150%);
-    opacity: 1;
+    background-color: var(--squid-theme-material-dark-average);
   }
 }
 
 .tw-animate-blur-in {
-  animation: tw-blur-in 0.2s ease-out both;
+  animation: tw-blur-in var(--squid-animation-blur-in-duration, 0s) cubic-bezier(.165,.84,.44,1) both;
 }
 
 @keyframes tw-blur-out {
   0% {
     -webkit-backdrop-filter: blur(20px) saturate(150%);
             backdrop-filter: blur(20px) saturate(150%);
-    opacity: 1;
+    background-color: var(--squid-theme-material-dark-average);
   }
 
   100% {
     -webkit-backdrop-filter: blur(0px) saturate(0%);
             backdrop-filter: blur(0px) saturate(0%);
-    opacity: 0;
   }
 }
 
 .tw-animate-blur-out {
-  animation: tw-blur-out 0.2s ease-out both;
+  animation: tw-blur-out var(--squid-animation-blur-out-duration, 0s) cubic-bezier(.165,.84,.44,1) both;
 }
 
 @keyframes tw-collapse-route {
@@ -1536,62 +1525,30 @@ video {
 
 @keyframes tw-slide-to-bottom {
   0% {
-    transform: translateY(0);
-    opacity: 1;
+    transform: translate3d(0, 0, 0);
   }
 
   100% {
-    transform: translateY(120px);
-    opacity: 0;
+    transform: translate3d(0, 105%, 0);
   }
 }
 
 .tw-animate-slide-to-bottom {
-  animation: tw-slide-to-bottom 0.2s ease-out both;
+  animation: tw-slide-to-bottom var(--squid-animation-slide-to-bottom-duration, 0s) cubic-bezier(.165,.84,.44,1) both;
 }
 
 @keyframes tw-slide-to-top {
   0% {
-    transform: translateY(120px);
-    opacity: 0;
+    transform: translate3d(0, 105%, 0);
   }
 
   100% {
-    transform: translateY(0);
-    opacity: 1;
+    transform: translate3d(0, 0, 0);
   }
 }
 
 .tw-animate-slide-to-top {
-  animation: tw-slide-to-top 0.35s ease-out both;
-}
-
-@keyframes tw-translate-to-bottom {
-  0% {
-    transform: translateY(0);
-  }
-
-  100% {
-    transform: translateY(100%);
-  }
-}
-
-.tw-animate-translate-to-bottom {
-  animation: tw-translate-to-bottom var(--squid-animation-translate-top-or-bottom, 0s) linear both;
-}
-
-@keyframes tw-translate-to-top {
-  0% {
-    transform: translateY(0);
-  }
-
-  100% {
-    transform: translateY(-100%);
-  }
-}
-
-.tw-animate-translate-to-top {
-  animation: tw-translate-to-top var(--squid-animation-translate-top-or-bottom, 0s) linear both;
+  animation: tw-slide-to-top var(--squid-animation-slide-to-top-duration, 0s) cubic-bezier(.165,.84,.44,1) both;
 }
 
 .tw-cursor-help {
@@ -1911,10 +1868,6 @@ video {
   background-color: inherit;
 }
 
-.tw-bg-material-dark-average {
-  background-color: var(--squid-theme-material-dark-average);
-}
-
 .tw-bg-material-dark-thick {
   background-color: var(--squid-theme-material-dark-thick);
 }
@@ -2139,6 +2092,11 @@ video {
   padding-bottom: 0.5rem;
 }
 
+.tw-py-\[15px\] {
+  padding-top: 15px;
+  padding-bottom: 15px;
+}
+
 .tw-py-squid-s {
   padding-top: 0.9375rem;
   padding-bottom: 0.9375rem;
@@ -2764,8 +2722,8 @@ input[type='number'] {
   animation: tw-display 0s var(--squid-animation-display-delayed-duration, 0s) ease-out both;
 }
 
-.hover\:tw-bg-grey-700:hover {
-  background-color: var(--squid-theme-grey-700);
+.hover\:tw-border-material-light-average:hover {
+  border-color: var(--squid-theme-material-light-average);
 }
 
 .hover\:tw-bg-material-light-thin:hover {

package/dist/index.d.ts

@@ -61,22 +61,20 @@ type SwapStep = {
     descriptionBlocks: SwapStepDescriptionBlock[];
     chipContent: React.ReactNode;
     link?: string;
-    status: TransactionStatus;
+    status: SwapState;
 };
+declare enum SwapState {
+    CONFIRM = 0,
+    PROGRESS = 1,
+    COMPLETED = 2,
+    ERROR = 3,
+    PARTIAL_SUCCESS = 4,
+    CONFIRMATION_TOO_LONG = 5,
+    CONFIRMATION_REJECTED = 6,
+    NEEDS_GAS = 7
+}
 type ThemeType = 'light' | 'dark';
 type SwapStepItemStatus = 'executed' | 'progress' | 'pending';
-declare enum TransactionStatus {
-    SUCCESS = "success",
-    NEEDS_GAS = "needs_gas",
-    ONGOING = "ongoing",
-    PARTIAL_SUCCESS = "partial_success",
-    NOT_FOUND = "not_found",
-    INITIAL_LOADING = "initialLoading",
-    ERROR = "error",
-    WARNING = "warning",
-    PENDING = "pending",
-    REJECTED = "rejected"
-}
 
 interface BoostButtonProps {
     boostMode: BoostMode;
@@ -493,7 +491,7 @@ type Token = {
     logoUrl: string;
     bgColor: string;
 };
-declare function SwapProgressView({ steps, isOpen, handleClose, socialLink, supportLink, fromAmount, fromChain, fromToken, toAmount, toChain, toToken, fromAddressFormatted, toAddressFormatted, txStatus, }: {
+declare function SwapProgressView({ steps, isOpen, handleClose, socialLink, supportLink, fromAmount, fromChain, fromToken, toAmount, toChain, toToken, fromAddressFormatted, toAddressFormatted, swapState, estimatedTimeToComplete, }: {
     steps: SwapStep[];
     handleClose?: () => void;
     isOpen?: boolean;
@@ -507,7 +505,8 @@ declare function SwapProgressView({ steps, isOpen, handleClose, socialLink, supp
     toChain: ChainData;
     fromAddressFormatted: string;
     toAddressFormatted: string;
-    txStatus: TransactionStatus;
+    swapState: SwapState;
+    estimatedTimeToComplete?: string;
 }): react_jsx_runtime.JSX.Element;
 
 type SquidTheme = {
@@ -549,4 +548,4 @@ declare function useDropdownMenu(props?: {
     openDropdownButtonRef: React.RefObject<HTMLButtonElement>;
 };
 
-export { AddressButton, ArrowButton, AssetsButton, BadgeImage, BodyText, Boost, BoostButton, BorderedContainer, Button, CaptionText, Chip, DetailsToolbar, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, ErrorMessage, FeeButton, HeadingText, HistoryItem, InfoBox, Input, ListItem, LoadingSkeleton, Menu, MenuItem, Modal, ModalContent, ModalContentDivider, NavigationBar, NumericInput, ProductCard, ProfileHeaderBackground, SectionTitle, SettingsButton, type SettingsButtonProps, type SettingsControl, SettingsItem, type SettingsItemProps, SettingsSlider, type SettingsSliderProps, SquidConfigProvider, type SquidTheme, SwapConfiguration, SwapDetailListItem, SwapProgressView, SwapProgressViewHeader, SwapStepItem, SwapStepsCollapsed, Switch, TokenPair, Tooltip, type TooltipProps, type TooltipThreshold, type TooltipWidth, UsdAmount, useDropdownMenu };
+export { AddressButton, ArrowButton, AssetsButton, BadgeImage, BodyText, Boost, BoostButton, BorderedContainer, Button, CaptionText, Chip, DetailsToolbar, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, ErrorMessage, FeeButton, HeadingText, HistoryItem, InfoBox, Input, ListItem, LoadingSkeleton, Menu, MenuItem, Modal, ModalContent, ModalContentDivider, NavigationBar, NumericInput, ProductCard, ProfileHeaderBackground, SectionTitle, SettingsButton, type SettingsButtonProps, type SettingsControl, SettingsItem, type SettingsItemProps, SettingsSlider, type SettingsSliderProps, SquidConfigProvider, type SquidTheme, SwapConfiguration, SwapDetailListItem, SwapProgressView, SwapProgressViewHeader, SwapState, type SwapStep, SwapStepItem, SwapStepsCollapsed, Switch, type ThemeType, TokenPair, Tooltip, type TooltipProps, type TooltipThreshold, type TooltipWidth, UsdAmount, useDropdownMenu };

package/package.json

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