@rango-dev/ui 0.29.1-next.10 → 0.29.1-next.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/dist/index.js +2 -2
  2. package/dist/index.js.map +3 -3
  3. package/dist/widget/ui/src/components/ChainToken/ChainToken.constants.d.ts.map +1 -1
  4. package/dist/widget/ui/src/components/ChainToken/ChainToken.styles.d.ts +1 -1
  5. package/dist/widget/ui/src/components/ChainToken/ChainToken.styles.d.ts.map +1 -1
  6. package/dist/widget/ui/src/components/FullExpandedQuote/FullExpandedQuote.d.ts.map +1 -1
  7. package/package.json +1 -1
  8. package/src/components/ChainToken/ChainToken.constants.ts +1 -0
  9. package/src/components/ChainToken/ChainToken.styles.ts +4 -0
  10. package/src/components/FullExpandedQuote/FullExpandedQuote.styles.ts +8 -8
  11. package/src/components/FullExpandedQuote/FullExpandedQuote.tsx +7 -5
  12. package/src/components/Header/Header.styles.ts +1 -1
package/dist/widget/ui/src/components/ChainToken/ChainToken.constants.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ChainToken.constants.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ChainToken/ChainToken.constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD,eAAO,MAAM,iBAAiB,EAAE;KAC7B,GAAG,IAAI,SAAS,CAAC,MAAM,CAAC,GAAG;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE;CAK7D,CAAC"}
1
+ {"version":3,"file":"ChainToken.constants.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ChainToken/ChainToken.constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD,eAAO,MAAM,iBAAiB,EAAE;KAC7B,GAAG,IAAI,SAAS,CAAC,MAAM,CAAC,GAAG;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE;CAM7D,CAAC"}
package/dist/widget/ui/src/components/ChainToken/ChainToken.styles.d.ts CHANGED
@@ -161,7 +161,7 @@ export declare const Container: import("@stitches/react/types/styled-component")
161
161
  transitions: {};
162
162
  }, import("@stitches/react/types/config").DefaultThemeMap, {}>>;
163
163
  export declare const ChainImageContainer: import("@stitches/react/types/styled-component").StyledComponent<"div", {
164
- size?: "small" | "medium" | "large" | undefined;
164
+ size?: "small" | "medium" | "large" | "xmedium" | undefined;
165
165
  }, {
166
166
  xs: string;
167
167
  sm: string;
package/dist/widget/ui/src/components/ChainToken/ChainToken.styles.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ChainToken.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ChainToken/ChainToken.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAIpB,CAAC;AAEH,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAqB9B,CAAC"}
1
+ {"version":3,"file":"ChainToken.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ChainToken/ChainToken.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAIpB,CAAC;AAEH,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DAyB9B,CAAC"}
package/dist/widget/ui/src/components/FullExpandedQuote/FullExpandedQuote.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"FullExpandedQuote.d.ts","sourceRoot":"","sources":["../../../../../../src/components/FullExpandedQuote/FullExpandedQuote.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAmB,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAE5E,OAAO,KAAK,MAAM,OAAO,CAAC;AAsC1B,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,SAAS,qBA6IjD"}
1
+ {"version":3,"file":"FullExpandedQuote.d.ts","sourceRoot":"","sources":["../../../../../../src/components/FullExpandedQuote/FullExpandedQuote.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAmB,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAE5E,OAAO,KAAK,MAAM,OAAO,CAAC;AAsC1B,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,SAAS,qBA+IjD"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rango-dev/ui",
3
- "version": "0.29.1-next.10",
3
+ "version": "0.29.1-next.11",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "source": "./src/index.ts",
package/src/components/ChainToken/ChainToken.constants.ts CHANGED
@@ -4,6 +4,7 @@ export const tokenChainSizeMap: {
4
4
  [key in PropTypes['size']]: { token: number; chain: number };
5
5
  } = {
6
6
  small: { token: 17, chain: 10 },
7
+ xmedium: { token: 22, chain: 10 },
7
8
  medium: { token: 27, chain: 10 },
8
9
  large: { token: 30, chain: 15 },
9
10
  };
package/src/components/ChainToken/ChainToken.styles.ts CHANGED
@@ -18,6 +18,10 @@ export const ChainImageContainer = styled('div', {
18
18
  right: '-3px',
19
19
  bottom: '-3px',
20
20
  },
21
+ xmedium: {
22
+ right: '-3px',
23
+ bottom: '-3px',
24
+ },
21
25
  medium: {
22
26
  right: '0',
23
27
  bottom: '0',
package/src/components/FullExpandedQuote/FullExpandedQuote.styles.ts CHANGED
@@ -55,7 +55,7 @@ export const TagsContainer = styled('div', {
55
55
 
56
56
  export const Steps = styled('div', {
57
57
  display: 'flex',
58
- height: '85px',
58
+ height: '102px',
59
59
  });
60
60
 
61
61
  export const StepItem = styled('div', {
@@ -109,8 +109,8 @@ export const SwapperContainer = styled(FlexCenter, {
109
109
  export const SwapperImage = styled(FlexCenter, {
110
110
  borderRadius: '$lg',
111
111
  position: 'relative',
112
- width: '$18',
113
- height: '$18',
112
+ width: '$24',
113
+ height: '$24',
114
114
  border: '1px solid transparent',
115
115
  variants: {
116
116
  state: {
@@ -127,10 +127,10 @@ export const SwapperImage = styled(FlexCenter, {
127
127
  export const IconHighlight = styled(FlexCenter, {
128
128
  borderRadius: '$lg',
129
129
  position: 'absolute',
130
- width: '$8',
131
- height: '$8',
132
- bottom: -2,
133
- right: -2,
130
+ width: '$10',
131
+ height: '$10',
132
+ bottom: -3,
133
+ right: -3,
134
134
  variants: {
135
135
  type: {
136
136
  warning: {
@@ -153,7 +153,7 @@ export const IconHighlight = styled(FlexCenter, {
153
153
 
154
154
  export const OutputSection = styled(FlexCenter, {
155
155
  flexDirection: 'column',
156
- paddingLeft: '$4',
156
+ paddingLeft: '$8',
157
157
  });
158
158
 
159
159
  export const VerticalLine = styled('div', {
package/src/components/FullExpandedQuote/FullExpandedQuote.tsx CHANGED
@@ -85,7 +85,7 @@ export function FullExpandedQuote(props: PropTypes) {
85
85
  ) : (
86
86
  <LeftSection>
87
87
  <ChainToken
88
- size="small"
88
+ size="xmedium"
89
89
  chainImage={step.from.chain.image}
90
90
  tokenImage={step.from.token.image}
91
91
  />
@@ -116,20 +116,21 @@ export function FullExpandedQuote(props: PropTypes) {
116
116
  <SwapperContainer>
117
117
  <SwapperImage state={step.state}>
118
118
  <Image
119
- size={15}
119
+ size={22}
120
120
  type="circular"
121
121
  src={step.swapper.image}
122
122
  />
123
123
  {step.state && (
124
124
  <IconHighlight type={step.state}>
125
125
  {step.state === 'error' ? (
126
- <ErrorIcon size={6} color="error" />
126
+ <ErrorIcon size={8} color="error" />
127
127
  ) : (
128
- <WarningIcon size={6} color="warning" />
128
+ <WarningIcon size={8} color="warning" />
129
129
  )}
130
130
  </IconHighlight>
131
131
  )}
132
132
  </SwapperImage>
133
+ <Divider size={2} />
133
134
  <Typography size="xsmall" variant="body" align="center">
134
135
  {step.swapper.displayName}
135
136
  </Typography>
@@ -149,6 +150,7 @@ export function FullExpandedQuote(props: PropTypes) {
149
150
  tokenImage={steps[numberOfSteps - 1].to.token.image}
150
151
  size="medium"
151
152
  />
153
+ <Divider size={4} />
152
154
  <div>
153
155
  <Tooltip
154
156
  content={props.outputPrice.realValue}
@@ -158,7 +160,7 @@ export function FullExpandedQuote(props: PropTypes) {
158
160
  {props.outputPrice.value}
159
161
  </Typography>
160
162
  <Divider size={4} direction="horizontal" />
161
- <Typography size="large" variant="body">
163
+ <Typography size="xmedium" variant="title">
162
164
  {steps[numberOfSteps - 1].to.token.displayName}
163
165
  </Typography>
164
166
  </Tooltip>
package/src/components/Header/Header.styles.ts CHANGED
@@ -16,7 +16,7 @@ export const Container = styled('div', {
16
16
  display: 'flex',
17
17
  justifyContent: 'space-between',
18
18
  alignItems: 'center',
19
- padding: '$15 $20',
19
+ padding: '$20 $20 $15 $20',
20
20
  $$color: '$colors$neutral100',
21
21
  [`.${darkTheme} &`]: {
22
22
  $$color: '$colors$neutral300',