@bosonprotocol/react-kit 0.34.0-alpha.2 → 0.34.0-alpha.20

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 (199) hide show
  1. package/dist/cjs/components/connection/utils.d.ts.map +1 -1
  2. package/dist/cjs/components/connection/utils.js +0 -1
  3. package/dist/cjs/components/connection/utils.js.map +1 -1
  4. package/dist/cjs/components/currencyDisplay/CurrencyDisplay.d.ts +5 -2
  5. package/dist/cjs/components/currencyDisplay/CurrencyDisplay.d.ts.map +1 -1
  6. package/dist/cjs/components/currencyDisplay/CurrencyDisplay.js +6 -7
  7. package/dist/cjs/components/currencyDisplay/CurrencyDisplay.js.map +1 -1
  8. package/dist/cjs/components/exchangeCard/ExchangeCard.d.ts +1 -1
  9. package/dist/cjs/components/image/Image.styles.d.ts.map +1 -1
  10. package/dist/cjs/components/image/Image.styles.js +0 -2
  11. package/dist/cjs/components/image/Image.styles.js.map +1 -1
  12. package/dist/cjs/components/modal/components/Redeem/MyItems/Exchange.js +1 -1
  13. package/dist/cjs/components/modal/components/Redeem/MyItems/Exchange.js.map +1 -1
  14. package/dist/cjs/components/productCard/ProductCard.d.ts +5 -2
  15. package/dist/cjs/components/productCard/ProductCard.d.ts.map +1 -1
  16. package/dist/cjs/components/productCard/ProductCard.js +42 -34
  17. package/dist/cjs/components/productCard/ProductCard.js.map +1 -1
  18. package/dist/cjs/components/productCard/ProductCard.styles.d.ts +111 -4
  19. package/dist/cjs/components/productCard/ProductCard.styles.d.ts.map +1 -1
  20. package/dist/cjs/components/productCard/ProductCard.styles.js +51 -26
  21. package/dist/cjs/components/productCard/ProductCard.styles.js.map +1 -1
  22. package/dist/cjs/components/productCard/commonStyles.d.ts.map +1 -1
  23. package/dist/cjs/components/productCard/commonStyles.js +0 -1
  24. package/dist/cjs/components/productCard/commonStyles.js.map +1 -1
  25. package/dist/cjs/components/queryClient/withQueryClientProvider.d.ts +0 -4
  26. package/dist/cjs/components/queryClient/withQueryClientProvider.d.ts.map +1 -1
  27. package/dist/cjs/components/queryClient/withQueryClientProvider.js +3 -26
  28. package/dist/cjs/components/queryClient/withQueryClientProvider.js.map +1 -1
  29. package/dist/cjs/components/skeleton/CollectionsCardSkeleton.d.ts.map +1 -1
  30. package/dist/cjs/components/skeleton/CollectionsCardSkeleton.js +39 -17
  31. package/dist/cjs/components/skeleton/CollectionsCardSkeleton.js.map +1 -1
  32. package/dist/cjs/components/skeleton/ProductCardSkeleton.d.ts.map +1 -1
  33. package/dist/cjs/components/skeleton/ProductCardSkeleton.js +18 -19
  34. package/dist/cjs/components/skeleton/ProductCardSkeleton.js.map +1 -1
  35. package/dist/cjs/components/wallet/wallet-connection.d.ts +9559 -9559
  36. package/dist/cjs/components/wallet2/accountDrawer/AuthenticatedHeader.d.ts +3 -3
  37. package/dist/cjs/components/wallet2/accountDrawer/AuthenticatedHeader.d.ts.map +1 -1
  38. package/dist/cjs/components/wallet2/accountDrawer/AuthenticatedHeader.js +2 -2
  39. package/dist/cjs/components/wallet2/accountDrawer/AuthenticatedHeader.js.map +1 -1
  40. package/dist/cjs/components/wallet2/accountDrawer/miniPortfolio/index.d.ts +3 -3
  41. package/dist/cjs/components/wallet2/accountDrawer/miniPortfolio/index.d.ts.map +1 -1
  42. package/dist/cjs/components/wallet2/accountDrawer/miniPortfolio/index.js +2 -2
  43. package/dist/cjs/components/wallet2/accountDrawer/miniPortfolio/index.js.map +1 -1
  44. package/dist/cjs/components/wallet2/accountDrawer/miniPortfolio/tokens/index.d.ts +5 -2
  45. package/dist/cjs/components/wallet2/accountDrawer/miniPortfolio/tokens/index.d.ts.map +1 -1
  46. package/dist/cjs/components/wallet2/accountDrawer/miniPortfolio/tokens/index.js +3 -2
  47. package/dist/cjs/components/wallet2/accountDrawer/miniPortfolio/tokens/index.js.map +1 -1
  48. package/dist/cjs/components/wallet2/selector/ChainSelector.d.ts +4 -1
  49. package/dist/cjs/components/wallet2/selector/ChainSelector.d.ts.map +1 -1
  50. package/dist/cjs/components/wallet2/selector/ChainSelector.js +2 -4
  51. package/dist/cjs/components/wallet2/selector/ChainSelector.js.map +1 -1
  52. package/dist/cjs/components/wallet2/walletModal/ConnectionErrorView.d.ts +6 -1
  53. package/dist/cjs/components/wallet2/walletModal/ConnectionErrorView.d.ts.map +1 -1
  54. package/dist/cjs/components/wallet2/walletModal/ConnectionErrorView.js +7 -5
  55. package/dist/cjs/components/wallet2/walletModal/ConnectionErrorView.js.map +1 -1
  56. package/dist/cjs/components/wallet2/walletModal/Option.d.ts +5 -1
  57. package/dist/cjs/components/wallet2/walletModal/Option.d.ts.map +1 -1
  58. package/dist/cjs/components/wallet2/walletModal/Option.js +5 -2
  59. package/dist/cjs/components/wallet2/walletModal/Option.js.map +1 -1
  60. package/dist/cjs/components/wallet2/walletModal/index.d.ts +5 -2
  61. package/dist/cjs/components/wallet2/walletModal/index.d.ts.map +1 -1
  62. package/dist/cjs/components/wallet2/walletModal/index.js +3 -3
  63. package/dist/cjs/components/wallet2/walletModal/index.js.map +1 -1
  64. package/dist/cjs/components/wallet2/web3Status/index.d.ts +14 -2
  65. package/dist/cjs/components/wallet2/web3Status/index.d.ts.map +1 -1
  66. package/dist/cjs/components/wallet2/web3Status/index.js +13 -5
  67. package/dist/cjs/components/wallet2/web3Status/index.js.map +1 -1
  68. package/dist/cjs/hooks/connection/useSyncChainQuery.js.map +1 -1
  69. package/dist/cjs/hooks/index.d.ts +5 -0
  70. package/dist/cjs/hooks/index.d.ts.map +1 -1
  71. package/dist/cjs/hooks/index.js +11 -1
  72. package/dist/cjs/hooks/index.js.map +1 -1
  73. package/dist/cjs/hooks/useCtaClickHandler.d.ts +1 -1
  74. package/dist/cjs/hooks/useCtaClickHandler.d.ts.map +1 -1
  75. package/dist/cjs/hooks/useCtaClickHandler.js.map +1 -1
  76. package/dist/cjs/hooks/useMetaTx.d.ts +1 -1
  77. package/dist/cjs/hooks/useMetaTx.d.ts.map +1 -1
  78. package/dist/cjs/hooks/useMetaTx.js.map +1 -1
  79. package/dist/cjs/index.d.ts +4 -0
  80. package/dist/cjs/index.d.ts.map +1 -1
  81. package/dist/cjs/index.js +4 -0
  82. package/dist/cjs/index.js.map +1 -1
  83. package/dist/cjs/lib/signer/externalSigner.d.ts.map +1 -1
  84. package/dist/cjs/lib/signer/externalSigner.js +7 -0
  85. package/dist/cjs/lib/signer/externalSigner.js.map +1 -1
  86. package/dist/esm/components/connection/utils.d.ts.map +1 -1
  87. package/dist/esm/components/connection/utils.js +0 -1
  88. package/dist/esm/components/connection/utils.js.map +1 -1
  89. package/dist/esm/components/currencyDisplay/CurrencyDisplay.d.ts +5 -2
  90. package/dist/esm/components/currencyDisplay/CurrencyDisplay.d.ts.map +1 -1
  91. package/dist/esm/components/currencyDisplay/CurrencyDisplay.js +6 -7
  92. package/dist/esm/components/currencyDisplay/CurrencyDisplay.js.map +1 -1
  93. package/dist/esm/components/exchangeCard/ExchangeCard.d.ts +1 -1
  94. package/dist/esm/components/image/Image.styles.d.ts.map +1 -1
  95. package/dist/esm/components/image/Image.styles.js +0 -2
  96. package/dist/esm/components/image/Image.styles.js.map +1 -1
  97. package/dist/esm/components/modal/components/Redeem/MyItems/Exchange.js +1 -1
  98. package/dist/esm/components/modal/components/Redeem/MyItems/Exchange.js.map +1 -1
  99. package/dist/esm/components/productCard/ProductCard.d.ts +5 -2
  100. package/dist/esm/components/productCard/ProductCard.d.ts.map +1 -1
  101. package/dist/esm/components/productCard/ProductCard.js +20 -32
  102. package/dist/esm/components/productCard/ProductCard.js.map +1 -1
  103. package/dist/esm/components/productCard/ProductCard.styles.d.ts +111 -4
  104. package/dist/esm/components/productCard/ProductCard.styles.d.ts.map +1 -1
  105. package/dist/esm/components/productCard/ProductCard.styles.js +50 -24
  106. package/dist/esm/components/productCard/ProductCard.styles.js.map +1 -1
  107. package/dist/esm/components/productCard/commonStyles.d.ts.map +1 -1
  108. package/dist/esm/components/productCard/commonStyles.js +0 -1
  109. package/dist/esm/components/productCard/commonStyles.js.map +1 -1
  110. package/dist/esm/components/queryClient/withQueryClientProvider.d.ts +0 -4
  111. package/dist/esm/components/queryClient/withQueryClientProvider.d.ts.map +1 -1
  112. package/dist/esm/components/queryClient/withQueryClientProvider.js +1 -11
  113. package/dist/esm/components/queryClient/withQueryClientProvider.js.map +1 -1
  114. package/dist/esm/components/skeleton/CollectionsCardSkeleton.d.ts.map +1 -1
  115. package/dist/esm/components/skeleton/CollectionsCardSkeleton.js +39 -17
  116. package/dist/esm/components/skeleton/CollectionsCardSkeleton.js.map +1 -1
  117. package/dist/esm/components/skeleton/ProductCardSkeleton.d.ts.map +1 -1
  118. package/dist/esm/components/skeleton/ProductCardSkeleton.js +19 -20
  119. package/dist/esm/components/skeleton/ProductCardSkeleton.js.map +1 -1
  120. package/dist/esm/components/wallet/wallet-connection.d.ts +9559 -9559
  121. package/dist/esm/components/wallet2/accountDrawer/AuthenticatedHeader.d.ts +3 -3
  122. package/dist/esm/components/wallet2/accountDrawer/AuthenticatedHeader.d.ts.map +1 -1
  123. package/dist/esm/components/wallet2/accountDrawer/AuthenticatedHeader.js +2 -2
  124. package/dist/esm/components/wallet2/accountDrawer/AuthenticatedHeader.js.map +1 -1
  125. package/dist/esm/components/wallet2/accountDrawer/miniPortfolio/index.d.ts +3 -3
  126. package/dist/esm/components/wallet2/accountDrawer/miniPortfolio/index.d.ts.map +1 -1
  127. package/dist/esm/components/wallet2/accountDrawer/miniPortfolio/index.js +2 -2
  128. package/dist/esm/components/wallet2/accountDrawer/miniPortfolio/index.js.map +1 -1
  129. package/dist/esm/components/wallet2/accountDrawer/miniPortfolio/tokens/index.d.ts +5 -2
  130. package/dist/esm/components/wallet2/accountDrawer/miniPortfolio/tokens/index.d.ts.map +1 -1
  131. package/dist/esm/components/wallet2/accountDrawer/miniPortfolio/tokens/index.js +3 -2
  132. package/dist/esm/components/wallet2/accountDrawer/miniPortfolio/tokens/index.js.map +1 -1
  133. package/dist/esm/components/wallet2/selector/ChainSelector.d.ts +4 -1
  134. package/dist/esm/components/wallet2/selector/ChainSelector.d.ts.map +1 -1
  135. package/dist/esm/components/wallet2/selector/ChainSelector.js +3 -5
  136. package/dist/esm/components/wallet2/selector/ChainSelector.js.map +1 -1
  137. package/dist/esm/components/wallet2/walletModal/ConnectionErrorView.d.ts +6 -1
  138. package/dist/esm/components/wallet2/walletModal/ConnectionErrorView.d.ts.map +1 -1
  139. package/dist/esm/components/wallet2/walletModal/ConnectionErrorView.js +7 -5
  140. package/dist/esm/components/wallet2/walletModal/ConnectionErrorView.js.map +1 -1
  141. package/dist/esm/components/wallet2/walletModal/Option.d.ts +5 -1
  142. package/dist/esm/components/wallet2/walletModal/Option.d.ts.map +1 -1
  143. package/dist/esm/components/wallet2/walletModal/Option.js +5 -2
  144. package/dist/esm/components/wallet2/walletModal/Option.js.map +1 -1
  145. package/dist/esm/components/wallet2/walletModal/index.d.ts +5 -2
  146. package/dist/esm/components/wallet2/walletModal/index.d.ts.map +1 -1
  147. package/dist/esm/components/wallet2/walletModal/index.js +3 -3
  148. package/dist/esm/components/wallet2/walletModal/index.js.map +1 -1
  149. package/dist/esm/components/wallet2/web3Status/index.d.ts +14 -2
  150. package/dist/esm/components/wallet2/web3Status/index.d.ts.map +1 -1
  151. package/dist/esm/components/wallet2/web3Status/index.js +14 -6
  152. package/dist/esm/components/wallet2/web3Status/index.js.map +1 -1
  153. package/dist/esm/hooks/connection/useSyncChainQuery.js.map +1 -1
  154. package/dist/esm/hooks/index.d.ts +5 -0
  155. package/dist/esm/hooks/index.d.ts.map +1 -1
  156. package/dist/esm/hooks/index.js +5 -0
  157. package/dist/esm/hooks/index.js.map +1 -1
  158. package/dist/esm/hooks/useCtaClickHandler.d.ts +1 -1
  159. package/dist/esm/hooks/useCtaClickHandler.d.ts.map +1 -1
  160. package/dist/esm/hooks/useCtaClickHandler.js.map +1 -1
  161. package/dist/esm/hooks/useMetaTx.d.ts +1 -1
  162. package/dist/esm/hooks/useMetaTx.d.ts.map +1 -1
  163. package/dist/esm/hooks/useMetaTx.js.map +1 -1
  164. package/dist/esm/index.d.ts +4 -0
  165. package/dist/esm/index.d.ts.map +1 -1
  166. package/dist/esm/index.js +4 -0
  167. package/dist/esm/index.js.map +1 -1
  168. package/dist/esm/lib/signer/externalSigner.d.ts.map +1 -1
  169. package/dist/esm/lib/signer/externalSigner.js +7 -0
  170. package/dist/esm/lib/signer/externalSigner.js.map +1 -1
  171. package/package.json +5 -5
  172. package/src/components/connection/utils.ts +0 -1
  173. package/src/components/currencyDisplay/CurrencyDisplay.tsx +21 -18
  174. package/src/components/exchangeCard/ExchangeCard.tsx +1 -1
  175. package/src/components/image/Image.styles.ts +0 -2
  176. package/src/components/modal/components/Redeem/MyItems/Exchange.tsx +1 -1
  177. package/src/components/productCard/ProductCard.styles.ts +57 -26
  178. package/src/components/productCard/ProductCard.tsx +54 -56
  179. package/src/components/productCard/commonStyles.ts +0 -1
  180. package/src/components/queryClient/withQueryClientProvider.tsx +1 -26
  181. package/src/components/skeleton/CollectionsCardSkeleton.tsx +63 -39
  182. package/src/components/skeleton/ProductCardSkeleton.tsx +24 -37
  183. package/src/components/wallet2/accountDrawer/AuthenticatedHeader.tsx +5 -6
  184. package/src/components/wallet2/accountDrawer/miniPortfolio/index.tsx +8 -4
  185. package/src/components/wallet2/accountDrawer/miniPortfolio/tokens/index.tsx +8 -2
  186. package/src/components/wallet2/selector/ChainSelector.tsx +25 -13
  187. package/src/components/wallet2/walletModal/ConnectionErrorView.tsx +21 -6
  188. package/src/components/wallet2/walletModal/Option.tsx +9 -2
  189. package/src/components/wallet2/walletModal/index.tsx +11 -4
  190. package/src/components/wallet2/web3Status/index.tsx +43 -15
  191. package/src/hooks/connection/useSyncChainQuery.ts +1 -1
  192. package/src/hooks/index.ts +10 -0
  193. package/src/hooks/useCtaClickHandler.ts +4 -1
  194. package/src/hooks/useMetaTx.ts +3 -1
  195. package/src/index.tsx +4 -0
  196. package/src/lib/signer/externalSigner.ts +7 -0
  197. package/src/stories/ConnectWallet.stories.tsx +63 -6
  198. package/src/stories/ProductCard.stories.tsx +1 -7
  199. package/src/stories/buttons/Upload.stories.tsx +1 -3
@@ -22,18 +22,18 @@ var __importStar = (this && this.__importStar) || function (mod) {
22
22
  __setModuleDefault(result, mod);
23
23
  return result;
24
24
  };
25
- var _a;
26
25
  Object.defineProperty(exports, "__esModule", { value: true });
27
- exports.ProductCardImageWrapper = exports.BottomText = exports.ProductCardTop = exports.ProductCardWrapper = exports.ProductCardTitleWrapper = exports.ProductCardBottomContent = exports.ProductCardBottom = exports.ProductCardData = exports.ProductCardPrice = exports.ProductCardPriceWrapper = exports.ProductCardTitle = exports.ProductCardCreatorName = exports.ProductCardCreatorAvatar = exports.ProductCardCreator = exports.TopLeftRibbon = exports.ProductCardLabelWrapper = void 0;
26
+ exports.CTAOnHoverContainer = exports.ProductCardImageAndCTAContainer = exports.ProductCardImageWrapper = exports.BottomText = exports.ProductCardTop = exports.ProductCardWrapper = exports.ProductCardTitleWrapper = exports.ProductCardBottomContent = exports.ProductCardBottom = exports.ProductCardPrice = exports.ProductCardPriceWrapper = exports.ProductCardTitle = exports.ProductCardCreatorName = exports.ProductCardCreatorAvatar = exports.ProductCardCreator = exports.TopLeftRibbon = exports.ProductCardLabelWrapper = void 0;
28
27
  const styled_components_1 = __importStar(require("styled-components"));
29
28
  const theme_1 = require("../../theme");
30
29
  const commonStyles_1 = require("./commonStyles");
30
+ const Typography_1 = require("../ui/Typography");
31
+ const zIndex_1 = require("../ui/zIndex");
31
32
  exports.ProductCardLabelWrapper = styled_components_1.default.div `
32
33
  position: absolute;
33
34
  top: 0.5rem;
34
35
  left: 0.5rem;
35
36
  background: white;
36
- padding: 0.25rem 0.5rem 0.25rem 0.5rem;
37
37
  font-weight: 600;
38
38
  color: ${({ theme }) => { var _a; return (_a = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _a === void 0 ? void 0 : _a.light.darkGrey; }};
39
39
  z-index: 1;
@@ -95,28 +95,33 @@ exports.ProductCardCreatorAvatar = styled_components_1.default.div `
95
95
  `;
96
96
  exports.ProductCardCreatorName = styled_components_1.default.div `
97
97
  font-weight: 600;
98
- font-size: 0.75rem;
98
+ font-size: 0.625rem;
99
99
  line-height: 150%;
100
- min-height: 3em;
101
- color: ${({ theme }) => { var _a; return (_a = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _a === void 0 ? void 0 : _a.light.accent; }};
100
+ color: ${({ theme }) => { var _a; return (_a = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _a === void 0 ? void 0 : _a.light.darkGrey; }};
102
101
  flex: none;
103
102
  order: 1;
104
103
  flex-grow: 0;
105
- justify-self: flex-end;
106
- margin-bottom: 0.25rem;
104
+ justify-self: flex-start;
105
+ margin-right: auto;
106
+ > span {
107
+ font-weight: 600;
108
+ font-size: 0.625rem;
109
+ color: ${({ theme }) => { var _a; return (_a = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _a === void 0 ? void 0 : _a.light.darkGrey; }};
110
+ }
107
111
  `;
108
- exports.ProductCardTitle = styled_components_1.default.div.attrs({ className: "title" }) `
109
- font-weight: 600;
110
- font-size: 1.25rem;
112
+ exports.ProductCardTitle = (0, styled_components_1.default)(Typography_1.Typography).attrs({
113
+ className: "title"
114
+ }) `
111
115
  color: ${({ theme }) => { var _a; return (_a = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _a === void 0 ? void 0 : _a.light.black; }};
112
116
  word-break: break-word;
113
117
  overflow: hidden;
114
- text-overflow: ellipsis;
115
118
  display: -webkit-box;
116
119
  -webkit-box-orient: vertical;
117
120
  -webkit-line-clamp: 2;
118
121
  line-height: 1.5em;
119
122
  max-height: calc(1.5em * 2);
123
+ white-space: nowrap;
124
+ text-overflow: ellipsis;
120
125
  `;
121
126
  exports.ProductCardPriceWrapper = styled_components_1.default.div `
122
127
  display: flex;
@@ -135,31 +140,26 @@ exports.ProductCardPrice = styled_components_1.default.div `
135
140
  margin-bottom: 0.25rem;
136
141
  color: ${({ theme }) => { var _a; return (_a = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _a === void 0 ? void 0 : _a.light.darkGrey; }};
137
142
  `;
138
- exports.ProductCardData = styled_components_1.default.div `
139
- display: flex;
140
- flex-direction: column;
141
- `;
142
143
  exports.ProductCardBottom = styled_components_1.default.div.attrs({ className: "bottom" }) `
143
144
  width: 100%;
144
- background: ${(_a = theme_1.theme === null || theme_1.theme === void 0 ? void 0 : theme_1.theme.colors) === null || _a === void 0 ? void 0 : _a.light.white};
145
145
  height: 12rem;
146
146
  display: flex;
147
147
  flex-direction: column;
148
- justify-content: space-between;
148
+ justify-content: flex-end;
149
+ z-index: ${zIndex_1.zIndex.ChatSeparator};
150
+ flex: 0;
149
151
  `;
150
152
  exports.ProductCardBottomContent = styled_components_1.default.div `
151
153
  display: flex;
152
154
  justify-content: space-between;
155
+ flex-direction: column;
153
156
  width: 100%;
154
- padding: 1rem 1.5rem 0.5rem 1.5rem;
155
157
  box-sizing: border-box;
156
158
  align-items: flex-start;
157
159
  column-gap: 0.25rem;
158
- border-top: 2px solid ${theme_1.theme.colors.light.border};
159
160
  `;
160
161
  exports.ProductCardTitleWrapper = styled_components_1.default.div `
161
162
  width: 100%;
162
- padding: 0 1.5rem 0.5rem 1.5rem;
163
163
  box-sizing: border-box;
164
164
  `;
165
165
  exports.ProductCardWrapper = styled_components_1.default.div `
@@ -171,6 +171,9 @@ exports.ProductCardWrapper = styled_components_1.default.div `
171
171
  justify-content: space-between;
172
172
  flex-direction: column;
173
173
  cursor: pointer;
174
+ min-height: 286px;
175
+ height: 286px;
176
+ padding: 0 1rem 1rem 1rem;
174
177
  [data-image-wrapper] {
175
178
  position: static;
176
179
  padding-top: 0;
@@ -178,6 +181,14 @@ exports.ProductCardWrapper = styled_components_1.default.div `
178
181
  display: flex;
179
182
  justify-content: center;
180
183
  align-items: center;
184
+ ${({ $isImageFitCover }) => $isImageFitCover
185
+ ? (0, styled_components_1.css) `
186
+ width: 100%;
187
+ img {
188
+ object-fit: cover;
189
+ }
190
+ `
191
+ : ""}
181
192
  }
182
193
  ${({ $isHoverDisabled }) => !$isHoverDisabled
183
194
  ? (0, styled_components_1.css) `
@@ -190,8 +201,10 @@ exports.ProductCardWrapper = styled_components_1.default.div `
190
201
  16px 16px 16px rgba(0, 0, 0, 0.05);
191
202
 
192
203
  [data-image-wrapper] {
204
+ width: 110%;
193
205
  img {
194
- transform: scale(1.05);
206
+ transform: scale(1.5);
207
+ object-position: center;
195
208
  transition: all 300ms ease-in-out;
196
209
  }
197
210
  }
@@ -204,21 +217,33 @@ exports.ProductCardTop = styled_components_1.default.div `
204
217
  overflow: hidden;
205
218
  width: 100%;
206
219
  align-self: stretch;
207
- z-index: 0;
220
+ z-index: ${zIndex_1.zIndex.Default};
208
221
  `;
209
222
  exports.BottomText = styled_components_1.default.p `
210
223
  font-size: 0.75rem;
211
224
  font-weight: 600;
212
225
  line-height: 0.975rem;
213
226
  margin: 0;
214
- padding: 0 1.5rem 1rem 1.5rem;
215
227
  letter-spacing: 0.5px;
216
228
  color: ${theme_1.theme.colors.light.darkGrey};
217
229
  `;
218
230
  exports.ProductCardImageWrapper = styled_components_1.default.div `
219
231
  width: 100%;
220
- min-height: 0;
221
- height: auto;
232
+ height: 13.125rem;
233
+ display: flex;
234
+ justify-content: center;
235
+ align-items: center;
236
+ padding-top: 0.9375rem;
237
+ padding-bottom: 0.9375rem;
222
238
  flex: 1;
223
239
  `;
240
+ exports.ProductCardImageAndCTAContainer = styled_components_1.default.div `
241
+ position: relative;
242
+ `;
243
+ exports.CTAOnHoverContainer = styled_components_1.default.div `
244
+ position: absolute;
245
+ z-index: ${zIndex_1.zIndex.OfferCard};
246
+ bottom: ${({ $isHovered }) => ($isHovered ? "95px" : "1.875rem")};
247
+ transition: all 300ms ease-in-out;
248
+ `;
224
249
  //# sourceMappingURL=ProductCard.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ProductCard.styles.js","sourceRoot":"","sources":["../../../../src/components/productCard/ProductCard.styles.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ProductCard.styles.js","sourceRoot":"","sources":["../../../../src/components/productCard/ProductCard.styles.ts"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"commonStyles.d.ts","sourceRoot":"","sources":["../../../../src/components/productCard/commonStyles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB,6CAO7B,CAAC"}
1
+ {"version":3,"file":"commonStyles.d.ts","sourceRoot":"","sources":["../../../../src/components/productCard/commonStyles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB,6CAM7B,CAAC"}
@@ -7,7 +7,6 @@ exports.cardWrapperStyles = (0, styled_components_1.css) `
7
7
  padding: 0px;
8
8
  isolation: isolate;
9
9
  width: 100%;
10
- min-height: 31.25rem;
11
10
  box-shadow: 0px 4.31783px 107.946px rgba(21, 30, 52, 0.1);
12
11
  background: ${theme_1.theme.colors.light.white};
13
12
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"commonStyles.js","sourceRoot":"","sources":["../../../../src/components/productCard/commonStyles.ts"],"names":[],"mappings":";;;AAAA,yDAAwC;AACxC,uCAAoC;AAEvB,QAAA,iBAAiB,GAAG,IAAA,uBAAG,EAAA;;;;;;gBAMpB,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK;CACvC,CAAC"}
1
+ {"version":3,"file":"commonStyles.js","sourceRoot":"","sources":["../../../../src/components/productCard/commonStyles.ts"],"names":[],"mappings":";;;AAAA,yDAAwC;AACxC,uCAAoC;AAEvB,QAAA,iBAAiB,GAAG,IAAA,uBAAG,EAAA;;;;;gBAKpB,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK;CACvC,CAAC"}
@@ -1,7 +1,3 @@
1
- import { QueryClientProviderProps } from "react-query";
2
1
  import React from "react";
3
- type QueryClientProviderCustomProps = Partial<QueryClientProviderProps>;
4
- export declare const QueryClientProviderCustom: React.FC<QueryClientProviderCustomProps>;
5
2
  export declare const withQueryClientProvider: <P extends object>(WrappedComponent: React.ComponentType<P>) => React.FC<P>;
6
- export {};
7
3
  //# sourceMappingURL=withQueryClientProvider.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"withQueryClientProvider.d.ts","sourceRoot":"","sources":["../../../../src/components/queryClient/withQueryClientProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,wBAAwB,EACzB,MAAM,aAAa,CAAC;AAErB,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,KAAK,8BAA8B,GAAG,OAAO,CAAC,wBAAwB,CAAC,CAAC;AAExE,eAAO,MAAM,yBAAyB,EAAE,KAAK,CAAC,EAAE,CAC9C,8BAA8B,CAO/B,CAAC;AAEF,eAAO,MAAM,uBAAuB,6EAqBnC,CAAC"}
1
+ {"version":3,"file":"withQueryClientProvider.d.ts","sourceRoot":"","sources":["../../../../src/components/queryClient/withQueryClientProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,eAAO,MAAM,uBAAuB,6EAqBnC,CAAC"}
@@ -1,38 +1,15 @@
1
1
  "use strict";
2
- var __rest = (this && this.__rest) || function (s, e) {
3
- var t = {};
4
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
5
- t[p] = s[p];
6
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
7
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
8
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
9
- t[p[i]] = s[p[i]];
10
- }
11
- return t;
12
- };
13
2
  var __importDefault = (this && this.__importDefault) || function (mod) {
14
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
15
4
  };
16
5
  Object.defineProperty(exports, "__esModule", { value: true });
17
- exports.withQueryClientProvider = exports.QueryClientProviderCustom = void 0;
18
- const react_query_1 = require("react-query");
6
+ exports.withQueryClientProvider = void 0;
19
7
  const react_1 = __importDefault(require("react"));
20
- const queryClient = new react_query_1.QueryClient({
21
- defaultOptions: {
22
- queries: {
23
- refetchOnWindowFocus: false
24
- }
25
- }
26
- });
27
- const QueryClientProviderCustom = (_a) => {
28
- var props = __rest(_a, []);
29
- return (react_1.default.createElement(react_query_1.QueryClientProvider, Object.assign({ client: queryClient }, props), props.children));
30
- };
31
- exports.QueryClientProviderCustom = QueryClientProviderCustom;
8
+ const QueryClientProviderCustom_1 = require("./QueryClientProviderCustom");
32
9
  const withQueryClientProvider = (WrappedComponent) => {
33
10
  // Return a new component
34
11
  const WithQueryClientProvider = (props) => {
35
- return (react_1.default.createElement(exports.QueryClientProviderCustom, null,
12
+ return (react_1.default.createElement(QueryClientProviderCustom_1.QueryClientProviderCustom, null,
36
13
  react_1.default.createElement(WrappedComponent, Object.assign({}, props))));
37
14
  };
38
15
  // Set display name for debugging purposes
@@ -1 +1 @@
1
- {"version":3,"file":"withQueryClientProvider.js","sourceRoot":"","sources":["../../../../src/components/queryClient/withQueryClientProvider.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,6CAIqB;AAErB,kDAA0B;AAE1B,MAAM,WAAW,GAAG,IAAI,yBAAW,CAAC;IAClC,cAAc,EAAE;QACd,OAAO,EAAE;YACP,oBAAoB,EAAE,KAAK;SAC5B;KACF;CACF,CAAC,CAAC;AAII,MAAM,yBAAyB,GAElC,CAAC,EAAY,EAAE,EAAE;QAAX,KAAK,cAAV,EAAY,CAAF;IACb,OAAO,CACL,8BAAC,iCAAmB,kBAAC,MAAM,EAAE,WAAW,IAAM,KAAK,GAChD,KAAK,CAAC,QAAQ,CACK,CACvB,CAAC;AACJ,CAAC,CAAC;AARW,QAAA,yBAAyB,6BAQpC;AAEK,MAAM,uBAAuB,GAAG,CACrC,gBAAwC,EACxC,EAAE;IAIF,yBAAyB;IACzB,MAAM,uBAAuB,GAAoB,CAAC,KAAK,EAAE,EAAE;QACzD,OAAO,CACL,8BAAC,iCAAyB;YACxB,8BAAC,gBAAgB,oBAAK,KAAK,EAAI,CACL,CAC7B,CAAC;IACJ,CAAC,CAAC;IAEF,0CAA0C;IAC1C,MAAM,WAAW,GACf,gBAAgB,CAAC,WAAW,IAAI,gBAAgB,CAAC,IAAI,IAAI,WAAW,CAAC;IACvE,uBAAuB,CAAC,WAAW,GAAG,iCAAiC,WAAW,GAAG,CAAC;IAEtF,OAAO,uBAAuB,CAAC;AACjC,CAAC,CAAC;AArBW,QAAA,uBAAuB,2BAqBlC"}
1
+ {"version":3,"file":"withQueryClientProvider.js","sourceRoot":"","sources":["../../../../src/components/queryClient/withQueryClientProvider.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,2EAAwE;AAEjE,MAAM,uBAAuB,GAAG,CACrC,gBAAwC,EACxC,EAAE;IAIF,yBAAyB;IACzB,MAAM,uBAAuB,GAAoB,CAAC,KAAK,EAAE,EAAE;QACzD,OAAO,CACL,8BAAC,qDAAyB;YACxB,8BAAC,gBAAgB,oBAAK,KAAK,EAAI,CACL,CAC7B,CAAC;IACJ,CAAC,CAAC;IAEF,0CAA0C;IAC1C,MAAM,WAAW,GACf,gBAAgB,CAAC,WAAW,IAAI,gBAAgB,CAAC,IAAI,IAAI,WAAW,CAAC;IACvE,uBAAuB,CAAC,WAAW,GAAG,iCAAiC,WAAW,GAAG,CAAC;IAEtF,OAAO,uBAAuB,CAAC;AACjC,CAAC,CAAC;AArBW,QAAA,uBAAuB,2BAqBlC"}
@@ -1 +1 @@
1
- {"version":3,"file":"CollectionsCardSkeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/skeleton/CollectionsCardSkeleton.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AA0BpD,KAAK,iBAAiB,GAAG,oBAAoB,CAAC,cAAc,CAAC,GAAG;IAC9D,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AACF,eAAO,MAAM,uBAAuB,UAAW,iBAAiB,gBAoC/D,CAAC"}
1
+ {"version":3,"file":"CollectionsCardSkeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/skeleton/CollectionsCardSkeleton.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AA4CpD,KAAK,iBAAiB,GAAG,oBAAoB,CAAC,cAAc,CAAC,GAAG;IAC9D,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AACF,eAAO,MAAM,uBAAuB,UAAW,iBAAiB,gBA0C/D,CAAC"}
@@ -9,34 +9,56 @@ const styled_components_1 = __importDefault(require("styled-components"));
9
9
  const theme_1 = require("../../theme");
10
10
  const commonStyles_1 = require("../productCard/commonStyles");
11
11
  const common_1 = require("./common");
12
+ const Grid_1 = require("../ui/Grid");
13
+ const colors = theme_1.theme.colors.light;
12
14
  const Container = styled_components_1.default.div `
13
- display: grid;
14
- grid-template-columns: 1fr;
15
- grid-template-rows: repeat(2, min-content);
15
+ display: flex;
16
+ flex-direction: column;
16
17
  ${commonStyles_1.cardWrapperStyles}
18
+ /* REMs gives bad height here on smaller views */
19
+ height: 279px;
20
+ min-width: 265px;
17
21
  `;
18
22
  const ImagesContainer = styled_components_1.default.div `
19
23
  width: 100%;
20
- display: grid;
21
- grid-template-columns: repeat(2, 1fr);
22
- grid-template-rows: repeat(2, 1fr);
23
- grid-column-gap: 1px;
24
- grid-row-gap: 1px;
24
+ position: relative;
25
+ /* REMs gives bad height here on smaller views */
26
+ height: 208px;
27
+ background-color: ${colors.lightGrey};
25
28
  `;
26
29
  const BottomCard = styled_components_1.default.div `
27
- padding: 1rem 1.5rem 1rem 1.5rem;
30
+ padding: 1rem 1.5rem 1rem 0.3125rem;
31
+ `;
32
+ const ImageOne = styled_components_1.default.div `
33
+ position: absolute;
34
+ top: 50%;
35
+ left: 10%;
36
+ transform: translateY(-50%);
37
+ `;
38
+ const ImageTwo = styled_components_1.default.div `
39
+ position: absolute;
40
+ right: 10%;
41
+ top: 5%;
42
+ `;
43
+ const ImageThree = styled_components_1.default.div `
44
+ position: absolute;
45
+ right: 10%;
46
+ bottom: 5%;
28
47
  `;
29
48
  const CollectionsCardSkeleton = (props) => {
30
49
  return (react_1.default.createElement(Container, null,
31
50
  react_1.default.createElement(ImagesContainer, null,
32
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "100%", "$height": "170px", "$borderRadius": "0px", "$backgroundColor": theme_1.theme.colors.light.darkGrey }),
33
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "100%", "$height": "170px", "$borderRadius": "0px", "$backgroundColor": theme_1.theme.colors.light.darkGrey }),
34
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "100%", "$height": "170px", "$borderRadius": "0px", "$backgroundColor": theme_1.theme.colors.light.darkGrey }),
35
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "100%", "$height": "170px", "$borderRadius": "0px", "$backgroundColor": theme_1.theme.colors.light.darkGrey })),
36
- react_1.default.createElement(BottomCard, null,
37
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "50%", "$height": "26px", "$margin": "0 0 8.75px 0" }),
38
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "52px", "$height": "18px", "$margin": "0 0 4.375px 0" }),
39
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "30px", "$height": "30px" }))));
51
+ react_1.default.createElement(ImageOne, null,
52
+ react_1.default.createElement(common_1.LoadingBubble, { "$width": "140px", "$height": "102px", "$borderRadius": "0px", "$backgroundColor": theme_1.theme.colors.light.darkGrey })),
53
+ react_1.default.createElement(ImageTwo, null,
54
+ react_1.default.createElement(common_1.LoadingBubble, { "$width": "60px", "$height": "50px", "$borderRadius": "0px", "$backgroundColor": theme_1.theme.colors.light.darkGrey })),
55
+ react_1.default.createElement(ImageThree, null,
56
+ react_1.default.createElement(common_1.LoadingBubble, { "$width": "60px", "$height": "50px", "$borderRadius": "0px", "$backgroundColor": theme_1.theme.colors.light.darkGrey }))),
57
+ react_1.default.createElement(Grid_1.Grid, { justifyContent: "flex-start", "align-items": "center", marginLeft: "1.5rem" },
58
+ react_1.default.createElement(common_1.LoadingBubble, { "$width": "43px", "$height": "43px", "$borderRadius": "100%" }),
59
+ react_1.default.createElement(BottomCard, null,
60
+ react_1.default.createElement(common_1.LoadingBubble, { "$width": "52px", "$height": "18px", "$margin": "0 0 4.375px 0" }),
61
+ react_1.default.createElement(common_1.LoadingBubble, { "$width": "30px", "$height": "25px" })))));
40
62
  };
41
63
  exports.CollectionsCardSkeleton = CollectionsCardSkeleton;
42
64
  //# sourceMappingURL=CollectionsCardSkeleton.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CollectionsCardSkeleton.js","sourceRoot":"","sources":["../../../../src/components/skeleton/CollectionsCardSkeleton.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAoD;AACpD,0EAAuC;AACvC,uCAAoC;AACpC,8DAAgE;AAChE,qCAAyC;AAEzC,MAAM,SAAS,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;IAIxB,gCAAiB;CACpB,CAAC;AAEF,MAAM,eAAe,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;;;;CAOjC,CAAC;AAEF,MAAM,UAAU,GAAG,2BAAM,CAAC,GAAG,CAAA;;CAE5B,CAAC;AAKK,MAAM,uBAAuB,GAAG,CAAC,KAAwB,EAAE,EAAE;IAClE,OAAO,CACL,8BAAC,SAAS;QACR,8BAAC,eAAe;YACd,8BAAC,sBAAa,cACL,MAAM,aACL,OAAO,mBACD,KAAK,sBACD,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAC7C;YACF,8BAAC,sBAAa,cACL,MAAM,aACL,OAAO,mBACD,KAAK,sBACD,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAC7C;YACF,8BAAC,sBAAa,cACL,MAAM,aACL,OAAO,mBACD,KAAK,sBACD,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAC7C;YACF,8BAAC,sBAAa,cACL,MAAM,aACL,OAAO,mBACD,KAAK,sBACD,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAC7C,CACc;QAClB,8BAAC,UAAU;YACT,8BAAC,sBAAa,cAAQ,KAAK,aAAS,MAAM,aAAS,cAAc,GAAG;YACpE,8BAAC,sBAAa,cAAQ,MAAM,aAAS,MAAM,aAAS,eAAe,GAAG;YACtE,8BAAC,sBAAa,cAAQ,MAAM,aAAS,MAAM,GAAG,CACnC,CACH,CACb,CAAC;AACJ,CAAC,CAAC;AApCW,QAAA,uBAAuB,2BAoClC"}
1
+ {"version":3,"file":"CollectionsCardSkeleton.js","sourceRoot":"","sources":["../../../../src/components/skeleton/CollectionsCardSkeleton.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAoD;AACpD,0EAAuC;AACvC,uCAAoC;AACpC,8DAAgE;AAChE,qCAAyC;AACzC,qCAAkC;AAClC,MAAM,MAAM,GAAG,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC;AAClC,MAAM,SAAS,GAAG,2BAAM,CAAC,GAAG,CAAA;;;IAGxB,gCAAiB;;;;CAIpB,CAAC;AAEF,MAAM,eAAe,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;;sBAKZ,MAAM,CAAC,SAAS;CACrC,CAAC;AAEF,MAAM,UAAU,GAAG,2BAAM,CAAC,GAAG,CAAA;;CAE5B,CAAC;AAEF,MAAM,QAAQ,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;;CAK1B,CAAC;AACF,MAAM,QAAQ,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;CAI1B,CAAC;AACF,MAAM,UAAU,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;CAI5B,CAAC;AAIK,MAAM,uBAAuB,GAAG,CAAC,KAAwB,EAAE,EAAE;IAClE,OAAO,CACL,8BAAC,SAAS;QACR,8BAAC,eAAe;YACd,8BAAC,QAAQ;gBACP,8BAAC,sBAAa,cACL,OAAO,aACN,OAAO,mBACD,KAAK,sBACD,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAC7C,CACO;YACX,8BAAC,QAAQ;gBACP,8BAAC,sBAAa,cACL,MAAM,aACL,MAAM,mBACA,KAAK,sBACD,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAC7C,CACO;YACX,8BAAC,UAAU;gBACT,8BAAC,sBAAa,cACL,MAAM,aACL,MAAM,mBACA,KAAK,sBACD,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAC7C,CACS,CACG;QAClB,8BAAC,WAAI,IACH,cAAc,EAAC,YAAY,iBACf,QAAQ,EACpB,UAAU,EAAE,QAAQ;YAEpB,8BAAC,sBAAa,cAAQ,MAAM,aAAS,MAAM,mBAAgB,MAAM,GAAI;YACrE,8BAAC,UAAU;gBACT,8BAAC,sBAAa,cAAQ,MAAM,aAAS,MAAM,aAAS,eAAe,GAAG;gBACtE,8BAAC,sBAAa,cAAQ,MAAM,aAAS,MAAM,GAAG,CACnC,CACR,CACG,CACb,CAAC;AACJ,CAAC,CAAC;AA1CW,QAAA,uBAAuB,2BA0ClC"}
@@ -1 +1 @@
1
- {"version":3,"file":"ProductCardSkeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/skeleton/ProductCardSkeleton.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAoBpD,KAAK,iBAAiB,GAAG,oBAAoB,CAAC,cAAc,CAAC,GAAG;IAC9D,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AACF,eAAO,MAAM,mBAAmB,UAAW,iBAAiB,gBAoD3D,CAAC"}
1
+ {"version":3,"file":"ProductCardSkeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/skeleton/ProductCardSkeleton.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAapD,KAAK,iBAAiB,GAAG,oBAAoB,CAAC,cAAc,CAAC,GAAG;IAC9D,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAaF,eAAO,MAAM,mBAAmB,UAAW,iBAAiB,gBAkC3D,CAAC"}
@@ -6,35 +6,34 @@ Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.ProductCardSkeleton = void 0;
7
7
  const react_1 = __importDefault(require("react"));
8
8
  const ProductCard_styles_1 = require("../productCard/ProductCard.styles");
9
- const Grid_1 = require("../ui/Grid");
10
9
  const theme_1 = require("../../theme");
11
10
  const common_1 = require("./common");
11
+ const styled_components_1 = __importDefault(require("styled-components"));
12
+ const ProductCardImageWrapperStyled = (0, styled_components_1.default)(ProductCard_styles_1.ProductCardImageWrapper) `
13
+ overflow: hidden;
14
+ width: 100%;
15
+ /* REMs gives bad height here on smaller views */
16
+ max-height: 210px;
17
+ min-height: 11.25rem;
18
+ `;
19
+ const ProductCardTitleWrapperStyled = (0, styled_components_1.default)(ProductCard_styles_1.ProductCardTitleWrapper) `
20
+ margin-bottom: 5px;
21
+ `;
12
22
  const ProductCardSkeleton = (props) => {
13
23
  const { withBottomText } = props;
14
24
  return (react_1.default.createElement(ProductCard_styles_1.ProductCardWrapper, Object.assign({}, props, { "$isHoverDisabled": true }),
15
- react_1.default.createElement(ProductCard_styles_1.ProductCardImageWrapper, null,
25
+ react_1.default.createElement(ProductCardImageWrapperStyled, null,
16
26
  react_1.default.createElement(common_1.LoadingBubble, { "$width": "100%", "$height": "340px", "$borderRadius": "0px", "$backgroundColor": theme_1.theme.colors.light.darkGrey })),
17
27
  react_1.default.createElement(ProductCard_styles_1.ProductCardBottom, null,
18
28
  react_1.default.createElement("div", null,
19
- react_1.default.createElement(ProductCard_styles_1.ProductCardBottomContent, null,
20
- react_1.default.createElement(ProductCard_styles_1.ProductCardData, null,
21
- react_1.default.createElement(ProductCard_styles_1.ProductCardCreator, null,
22
- react_1.default.createElement(ProductCard_styles_1.ProductCardCreatorAvatar, null,
23
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "16px", "$height": "16px" })),
24
- react_1.default.createElement(ProductCard_styles_1.ProductCardCreatorName, { "data-avatarname": "product-card" },
25
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "50px", "$height": "12.5px" })))),
26
- react_1.default.createElement(ProductCard_styles_1.ProductCardPriceWrapper, null,
27
- react_1.default.createElement(ProductCard_styles_1.ProductCardPrice, null,
28
- react_1.default.createElement(Grid_1.Grid, { justifyContent: "flex-end" },
29
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "30px", "$height": "10px" }))),
30
- react_1.default.createElement(Grid_1.Grid, { justifyContent: "flex-end", gap: "8px" },
31
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "24px", "$height": "24px" }),
32
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "calc(100% - 24px - 8px)" })))),
33
- react_1.default.createElement(ProductCard_styles_1.ProductCardTitleWrapper, null,
29
+ react_1.default.createElement(ProductCardTitleWrapperStyled, null,
34
30
  react_1.default.createElement(ProductCard_styles_1.ProductCardTitle, null,
35
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "100%", "$height": "30px" })))),
31
+ react_1.default.createElement(common_1.LoadingBubble, { "$width": "50%", "$height": "12px" }))),
32
+ react_1.default.createElement(ProductCardTitleWrapperStyled, null,
33
+ react_1.default.createElement(ProductCard_styles_1.ProductCardTitle, null,
34
+ react_1.default.createElement(common_1.LoadingBubble, { "$width": "20%", "$height": "8px" })))),
36
35
  withBottomText && (react_1.default.createElement(ProductCard_styles_1.BottomText, null,
37
- react_1.default.createElement(common_1.LoadingBubble, { "$width": "100%", "$height": "15.5px" }))))));
36
+ react_1.default.createElement(common_1.LoadingBubble, { "$width": "15%", "$height": "13px" }))))));
38
37
  };
39
38
  exports.ProductCardSkeleton = ProductCardSkeleton;
40
39
  //# sourceMappingURL=ProductCardSkeleton.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ProductCardSkeleton.js","sourceRoot":"","sources":["../../../../src/components/skeleton/ProductCardSkeleton.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAoD;AACpD,0EAc2C;AAC3C,qCAAkC;AAClC,uCAAoC;AACpC,qCAAyC;AAKlC,MAAM,mBAAmB,GAAG,CAAC,KAAwB,EAAE,EAAE;IAC9D,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAEjC,OAAO,CACL,8BAAC,uCAAkB,oBAAK,KAAK,wBAAoB,IAAI;QACnD,8BAAC,4CAAuB;YACtB,8BAAC,sBAAa,cACL,MAAM,aACL,OAAO,mBACD,KAAK,sBACD,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAC7C,CACsB;QAC1B,8BAAC,sCAAiB;YAChB;gBACE,8BAAC,6CAAwB;oBACvB,8BAAC,oCAAe;wBACd,8BAAC,uCAAkB;4BACjB,8BAAC,6CAAwB;gCACvB,8BAAC,sBAAa,cAAQ,MAAM,aAAS,MAAM,GAAG,CACrB;4BAC3B,8BAAC,2CAAsB,uBAAiB,cAAc;gCACpD,8BAAC,sBAAa,cAAQ,MAAM,aAAS,QAAQ,GAAG,CACzB,CACN,CACL;oBAClB,8BAAC,4CAAuB;wBACtB,8BAAC,qCAAgB;4BACf,8BAAC,WAAI,IAAC,cAAc,EAAC,UAAU;gCAC7B,8BAAC,sBAAa,cAAQ,MAAM,aAAS,MAAM,GAAG,CACzC,CACU;wBACnB,8BAAC,WAAI,IAAC,cAAc,EAAC,UAAU,EAAC,GAAG,EAAC,KAAK;4BACvC,8BAAC,sBAAa,cAAQ,MAAM,aAAS,MAAM,GAAG;4BAC9C,8BAAC,sBAAa,cAAQ,yBAAyB,GAAG,CAC7C,CACiB,CACD;gBAC3B,8BAAC,4CAAuB;oBACtB,8BAAC,qCAAgB;wBACf,8BAAC,sBAAa,cAAQ,MAAM,aAAS,MAAM,GAAG,CAC7B,CACK,CACtB;YACL,cAAc,IAAI,CACjB,8BAAC,+BAAU;gBACT,8BAAC,sBAAa,cAAQ,MAAM,aAAS,QAAQ,GAAG,CACrC,CACd,CACiB,CACD,CACtB,CAAC;AACJ,CAAC,CAAC;AApDW,QAAA,mBAAmB,uBAoD9B"}
1
+ {"version":3,"file":"ProductCardSkeleton.js","sourceRoot":"","sources":["../../../../src/components/skeleton/ProductCardSkeleton.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAoD;AACpD,0EAO2C;AAC3C,uCAAoC;AACpC,qCAAyC;AACzC,0EAAuC;AAMvC,MAAM,6BAA6B,GAAG,IAAA,2BAAM,EAAC,4CAAuB,CAAC,CAAA;;;;;;CAMpE,CAAC;AAEF,MAAM,6BAA6B,GAAG,IAAA,2BAAM,EAAC,4CAAuB,CAAC,CAAA;;CAEpE,CAAC;AACK,MAAM,mBAAmB,GAAG,CAAC,KAAwB,EAAE,EAAE;IAC9D,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAEjC,OAAO,CACL,8BAAC,uCAAkB,oBAAK,KAAK,wBAAoB,IAAI;QACnD,8BAAC,6BAA6B;YAC5B,8BAAC,sBAAa,cACL,MAAM,aACL,OAAO,mBACD,KAAK,sBACD,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAC7C,CAC4B;QAChC,8BAAC,sCAAiB;YAChB;gBACE,8BAAC,6BAA6B;oBAC5B,8BAAC,qCAAgB;wBACf,8BAAC,sBAAa,cAAQ,KAAK,aAAS,MAAM,GAAG,CAC5B,CACW;gBAChC,8BAAC,6BAA6B;oBAC5B,8BAAC,qCAAgB;wBACf,8BAAC,sBAAa,cAAQ,KAAK,aAAS,KAAK,GAAG,CAC3B,CACW,CAC5B;YACL,cAAc,IAAI,CACjB,8BAAC,+BAAU;gBACT,8BAAC,sBAAa,cAAQ,KAAK,aAAS,MAAM,GAAG,CAClC,CACd,CACiB,CACD,CACtB,CAAC;AACJ,CAAC,CAAC;AAlCW,QAAA,mBAAmB,uBAkC9B"}