@ape.swap/bonds-sdk 1.0.15-test → 1.0.16-seedify

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.
package/dist/main.js CHANGED
@@ -7730,9 +7730,11 @@ const getDefaultTransition = (valueKey, { keyframes }) => {
7730
7730
  };
7731
7731
 
7732
7732
  function getValueTransition(transition, key) {
7733
- return (transition[key] ||
7734
- transition["default"] ||
7735
- transition);
7733
+ return transition
7734
+ ? transition[key] ||
7735
+ transition["default"] ||
7736
+ transition
7737
+ : undefined;
7736
7738
  }
7737
7739
 
7738
7740
  const MotionGlobalConfig = {
@@ -9358,6 +9360,8 @@ const isEasingArray = (ease) => {
9358
9360
  return Array.isArray(ease) && typeof ease[0] !== "number";
9359
9361
  };
9360
9362
 
9363
+ const isBezierDefinition = (easing) => Array.isArray(easing) && typeof easing[0] === "number";
9364
+
9361
9365
  const easingLookup = {
9362
9366
  linear: noop,
9363
9367
  easeIn,
@@ -9372,7 +9376,7 @@ const easingLookup = {
9372
9376
  anticipate,
9373
9377
  };
9374
9378
  const easingDefinitionToFunction = (definition) => {
9375
- if (Array.isArray(definition)) {
9379
+ if (isBezierDefinition(definition)) {
9376
9380
  // If cubic bezier definition, create bezier curve
9377
9381
  invariant(definition.length === 4, `Cubic bezier arrays must contain four numerical values.`);
9378
9382
  const [x1, y1, x2, y2] = definition;
@@ -10163,8 +10167,6 @@ const acceleratedValues = new Set([
10163
10167
  // "background-color"
10164
10168
  ]);
10165
10169
 
10166
- const isBezierDefinition = (easing) => Array.isArray(easing) && typeof easing[0] === "number";
10167
-
10168
10170
  // Create a linear easing point for every 10 ms
10169
10171
  const resolution = 10;
10170
10172
  const generateLinearEasing = (easing, duration // as milliseconds
@@ -10839,7 +10841,7 @@ class MotionValue {
10839
10841
  * This will be replaced by the build step with the latest version number.
10840
10842
  * When MotionValues are provided to motion components, warn if versions are mixed.
10841
10843
  */
10842
- this.version = "11.11.0";
10844
+ this.version = "11.11.7";
10843
10845
  /**
10844
10846
  * Tracks whether this value can output a velocity. Currently this is only true
10845
10847
  * if the value is numerical, but we might be able to widen the scope here and support
@@ -15544,9 +15546,8 @@ const useIsomorphicLayoutEffect = isBrowser$1 ? useLayoutEffect : useEffect;
15544
15546
 
15545
15547
  const LazyContext = createContext({ strict: false });
15546
15548
 
15547
- let scheduleHandoffComplete = false;
15548
15549
  function useVisualElement(Component, visualState, props, createVisualElement, ProjectionNodeConstructor) {
15549
- var _a;
15550
+ var _a, _b;
15550
15551
  const { visualElement: parent } = useContext(MotionContext);
15551
15552
  const lazyContext = useContext(LazyContext);
15552
15553
  const presenceContext = useContext(PresenceContext);
@@ -15589,11 +15590,12 @@ function useVisualElement(Component, visualState, props, createVisualElement, Pr
15589
15590
  */
15590
15591
  const optimisedAppearId = props[optimizedAppearDataAttribute];
15591
15592
  const wantsHandoff = useRef(Boolean(optimisedAppearId) &&
15592
- !window.MotionHandoffIsComplete &&
15593
- ((_a = window.MotionHasOptimisedAnimation) === null || _a === void 0 ? void 0 : _a.call(window, optimisedAppearId)));
15593
+ !((_a = window.MotionHandoffIsComplete) === null || _a === void 0 ? void 0 : _a.call(window, optimisedAppearId)) &&
15594
+ ((_b = window.MotionHasOptimisedAnimation) === null || _b === void 0 ? void 0 : _b.call(window, optimisedAppearId)));
15594
15595
  useIsomorphicLayoutEffect(() => {
15595
15596
  if (!visualElement)
15596
15597
  return;
15598
+ window.MotionIsMounted = true;
15597
15599
  visualElement.updateFeatures();
15598
15600
  microtask.render(visualElement.render);
15599
15601
  /**
@@ -15616,18 +15618,17 @@ function useVisualElement(Component, visualState, props, createVisualElement, Pr
15616
15618
  if (!wantsHandoff.current && visualElement.animationState) {
15617
15619
  visualElement.animationState.animateChanges();
15618
15620
  }
15619
- wantsHandoff.current = false;
15620
- // This ensures all future calls to animateChanges() will run in useEffect
15621
- if (!scheduleHandoffComplete) {
15622
- scheduleHandoffComplete = true;
15623
- queueMicrotask(completeHandoff);
15621
+ if (wantsHandoff.current) {
15622
+ // This ensures all future calls to animateChanges() in this component will run in useEffect
15623
+ queueMicrotask(() => {
15624
+ var _a;
15625
+ (_a = window.MotionHandoffMarkAsComplete) === null || _a === void 0 ? void 0 : _a.call(window, optimisedAppearId);
15626
+ });
15627
+ wantsHandoff.current = false;
15624
15628
  }
15625
15629
  });
15626
15630
  return visualElement;
15627
15631
  }
15628
- function completeHandoff() {
15629
- window.MotionHandoffIsComplete = true;
15630
- }
15631
15632
  function createProjectionNode(visualElement, props, ProjectionNodeConstructor, initialPromotionConfig) {
15632
15633
  const { layoutId, layout, drag, dragConstraints, layoutScroll, layoutRoot, } = props;
15633
15634
  visualElement.projection = new ProjectionNodeConstructor(visualElement.latestValues, props["data-framer-portal-id"]
@@ -16616,7 +16617,7 @@ function updateMotionValuesFromProps(element, next, prev) {
16616
16617
  * and warn against mismatches.
16617
16618
  */
16618
16619
  if (process.env.NODE_ENV === "development") {
16619
- warnOnce(nextValue.version === "11.11.0", `Attempting to mix Framer Motion versions ${nextValue.version} with 11.11.0 may not work as expected.`);
16620
+ warnOnce(nextValue.version === "11.11.7", `Attempting to mix Framer Motion versions ${nextValue.version} with 11.11.7 may not work as expected.`);
16620
16621
  }
16621
16622
  }
16622
16623
  else if (isMotionValue(prevValue)) {
@@ -17319,19 +17320,20 @@ function PopChild({ children, isPresent }) {
17319
17320
  const PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, presenceAffectsLayout, mode, }) => {
17320
17321
  const presenceChildren = useConstant(newChildrenMap);
17321
17322
  const id = useId();
17323
+ const memoizedOnExitComplete = useCallback((childId) => {
17324
+ presenceChildren.set(childId, true);
17325
+ for (const isComplete of presenceChildren.values()) {
17326
+ if (!isComplete)
17327
+ return; // can stop searching when any is incomplete
17328
+ }
17329
+ onExitComplete && onExitComplete();
17330
+ }, [presenceChildren, onExitComplete]);
17322
17331
  const context = useMemo(() => ({
17323
17332
  id,
17324
17333
  initial,
17325
17334
  isPresent,
17326
17335
  custom,
17327
- onExitComplete: (childId) => {
17328
- presenceChildren.set(childId, true);
17329
- for (const isComplete of presenceChildren.values()) {
17330
- if (!isComplete)
17331
- return; // can stop searching when any is incomplete
17332
- }
17333
- onExitComplete && onExitComplete();
17334
- },
17336
+ onExitComplete: memoizedOnExitComplete,
17335
17337
  register: (childId) => {
17336
17338
  presenceChildren.set(childId, false);
17337
17339
  return () => presenceChildren.delete(childId);
@@ -17342,7 +17344,9 @@ const PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, p
17342
17344
  * we want to make a new context value to ensure they get re-rendered
17343
17345
  * so they can detect that layout change.
17344
17346
  */
17345
- presenceAffectsLayout ? [Math.random()] : [isPresent]);
17347
+ presenceAffectsLayout
17348
+ ? [Math.random(), memoizedOnExitComplete]
17349
+ : [isPresent, memoizedOnExitComplete]);
17346
17350
  useMemo(() => {
17347
17351
  presenceChildren.forEach((_, key) => presenceChildren.set(key, false));
17348
17352
  }, [isPresent]);
@@ -25097,7 +25101,7 @@ const useModal = (modal, closeOnOverlayClick = true, updateOnPropsChange = false
25097
25101
  return [onPresentCallback, handleClose];
25098
25102
  };
25099
25103
 
25100
- const StyledHeadingText = newStyled(Text) `
25104
+ newStyled(Text) `
25101
25105
  font-size: 12px;
25102
25106
  align-self: center;
25103
25107
  @media screen and (min-width: 1180px) {
@@ -25185,7 +25189,7 @@ const getBondNFTData = (id, billNftAddress, chainId) => __awaiter$9(void 0, void
25185
25189
  });
25186
25190
 
25187
25191
  const YourBondsModal = ({ onDismiss, userBill }) => {
25188
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
25192
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
25189
25193
  const chainId = useChainId();
25190
25194
  const { data: bondNFTData } = useBondNFTData(userBill === null || userBill === void 0 ? void 0 : userBill.id, userBill === null || userBill === void 0 ? void 0 : userBill.billNftAddress, (_a = userBill === null || userBill === void 0 ? void 0 : userBill.bond) === null || _a === void 0 ? void 0 : _a.chainId);
25191
25195
  const { switchChain } = useSwitchChain();
@@ -25235,12 +25239,18 @@ const YourBondsModal = ({ onDismiss, userBill }) => {
25235
25239
  var _a;
25236
25240
  return getFirstNonZeroDigits(parseFloat((_a = bond === null || bond === void 0 ? void 0 : bond.payoutTokenPrice) !== null && _a !== void 0 ? _a : '0'));
25237
25241
  };
25242
+ const tokenPayoutPrice = (price) => {
25243
+ return getFirstNonZeroDigits(parseFloat(price !== null && price !== void 0 ? price : '0'));
25244
+ };
25238
25245
  const BILL_ATTRIBUTES = ['The Legend', 'The Location', 'The Moment', 'The Trend', 'The Innovation'];
25239
25246
  const [isOpenTraits, setIsOpenTraits] = useState(false);
25240
25247
  const attributes = (_b = bondNFTData === null || bondNFTData === void 0 ? void 0 : bondNFTData.attributes) === null || _b === void 0 ? void 0 : _b.filter((attrib) => BILL_ATTRIBUTES.includes(attrib.trait_type));
25241
25248
  const [isImageLoaded, setIsImageLoaded] = useState(false);
25242
25249
  const [imageSrc, setImageSrc] = useState(null);
25243
25250
  useEffect(() => {
25251
+ console.log('Scott Tests-----!-');
25252
+ console.log(bondNFTData);
25253
+ console.log('-----------------');
25244
25254
  const loadImage = () => __awaiter$9(void 0, void 0, void 0, function* () {
25245
25255
  var _a;
25246
25256
  try {
@@ -25261,32 +25271,30 @@ const YourBondsModal = ({ onDismiss, userBill }) => {
25261
25271
  });
25262
25272
  loadImage();
25263
25273
  }, [bondNFTData]);
25264
- return (jsx$2(Fragment$1, { children: jsx$2(React__default.Fragment, { children: jsx$2(Flex$1, { className: "yourbondsmodal-backdrop", onClick: onDismiss, children: jsxs(Flex$1, { className: "yourbondsmodal-content", onClick: (event) => event.stopPropagation(), children: [toastMessage && jsx$2(Flex$1, { className: "toast", children: toastMessage }), jsx$2(Flex$1, { className: "yourbondsmodal-header", children: jsx$2(Flex$1, { className: "svg-close", onClick: onDismiss, children: jsx$2(Svg, { icon: "close" }) }) }), jsxs(Flex$1, { className: "yourbondsmodal table-container", children: [jsx$2(Flex$1, { className: "yourbondsmodal bondimage", children: jsx$2("img", { src: imageSrc, style: { display: isImageLoaded ? 'block' : 'none' } }) }), jsxs(Flex$1, { className: "yourbondsmodal yourbondinfo", children: [jsxs(Flex$1, { className: "yourbondinfo title-container", children: [jsx$2(Flex$1, { className: "title-container bondicon", children: jsxs("div", { className: "icon-container", children: [jsx$2(Svg, { width: 18, height: 18, icon: (_c = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _c !== void 0 ? _c : 'question' }), jsx$2(TokenImage, { symbol: (_d = userBill.bond.showcaseTokenName) !== null && _d !== void 0 ? _d : userBill.bond.earnToken.symbol, size: 40 })] }) }), jsx$2(Flex$1, { className: "title-container tokenname", children: jsx$2(StyledHeadingText, { children: (_e = userBill.bond) === null || _e === void 0 ? void 0 : _e.showcaseTokenName }) }), jsx$2(Flex$1, { className: "title-container tokentags", children: (_f = userBill.bond.tags) === null || _f === void 0 ? void 0 : _f.slice(0, 1).map((tag) => {
25265
- return (jsx$2(Flex$1, { sx: { marginRight: '10px' }, children: jsx$2(ListTag, { variant: tag === 'Cex Fund' ? 'cex_fund' : 'liquidity', text: tag === null || tag === void 0 ? void 0 : tag.toUpperCase() }) }, tag));
25266
- }) }), jsxs(Text, { sx: { color: 'text', opacity: '0.6', fontSize: ['12px', '12px', '12px', '16px'] }, children: ["#", userBill.id] })] }), jsxs(Flex$1, { className: "yourbondinfo blocks-container", children: [jsxs(Flex$1, { className: "attributes-container", children: [jsxs(Flex$1, { className: "attributes-header", sx: {
25274
+ return (jsx$2(Fragment$1, { children: jsx$2(React__default.Fragment, { children: jsx$2(Flex$1, { className: "modal-backdrop", onClick: (event) => event.stopPropagation(), children: jsxs(Flex$1, { className: "modal-content font-small gpt", onClick: (event) => event.stopPropagation(), children: [jsx$2(ModalHeader, { hideDivider: true, onDismiss: onDismiss }), toastMessage && jsx$2(Flex$1, { className: "toast", children: toastMessage }), jsxs(Flex$1, { className: "modaltable-container", sx: { flexDirection: 'row', gap: '20px' }, children: [jsxs(Flex$1, { sx: { width: '500px', flexDirection: 'column' }, children: [jsx$2("img", { src: imageSrc, style: { display: isImageLoaded ? 'block' : 'none' } }), jsx$2(Flex$1, { className: "modaltable-container description-container paragraph-spaced", sx: { marginTop: '20px' }, children: (_c = userBill === null || userBill === void 0 ? void 0 : userBill.bond) === null || _c === void 0 ? void 0 : _c.shortDescription })] }), jsxs(Flex$1, { sx: { flexDirection: 'column', width: '600px' }, children: [jsxs(Flex$1, { sx: { alignItems: 'center' }, children: [jsx$2(Flex$1, { className: "modal-chainicon", sx: { minWidth: '300px' }, children: jsxs("h2", { sx: { margin: '0px' }, children: [(_d = userBill === null || userBill === void 0 ? void 0 : userBill.bond.showcaseTokenName) !== null && _d !== void 0 ? _d : userBill === null || userBill === void 0 ? void 0 : userBill.bond.earnToken.symbol, ' ', jsx$2(Svg, { width: 20, height: 20, icon: (_e = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill === null || userBill === void 0 ? void 0 : userBill.bond.chainId]) !== null && _e !== void 0 ? _e : 'question' })] }) }), jsxs(Flex$1, { sx: { justifyContent: 'space-between', flexGrow: 1 }, children: [jsx$2(TokenImage, { symbol: (_f = userBill === null || userBill === void 0 ? void 0 : userBill.bond.showcaseTokenName) !== null && _f !== void 0 ? _f : userBill === null || userBill === void 0 ? void 0 : userBill.bond.earnToken.symbol, size: 20 }), jsx$2("span", { children: userBill === null || userBill === void 0 ? void 0 : userBill.bond.earnToken.symbol }), " ", jsx$2("span", { children: "|" }), ' ', jsxs("span", { children: ["Price Paid: $", tokenPayoutPrice((_h = (_g = userBill === null || userBill === void 0 ? void 0 : userBill.bond) === null || _g === void 0 ? void 0 : _g.payoutTokenPrice) !== null && _h !== void 0 ? _h : '0')] })] })] }), jsxs(Flex$1, { sx: { flexDirection: 'column', marginTop: '20px' }, children: [jsxs(Flex$1, { className: "attributes-container", children: [jsxs(Flex$1, { className: "attributes-header", sx: {
25267
25275
  borderRadius: `${isOpenTraits ? '6px 6px 0px 0px' : 'normal'}`,
25268
25276
  display: ['none', 'none', 'none', 'flex'],
25269
25277
  }, onClick: () => setIsOpenTraits(!isOpenTraits), children: [jsxs(Flex$1, { sx: { gap: '10px', alignItems: 'center' }, children: [jsx$2(Svg, { icon: "tag", direction: "down" }), jsx$2(Text, { sx: { fontSize: '12px', fontWeight: 400, color: 'text', opacity: '0.6' }, children: "Traits" })] }), jsx$2(Svg, { icon: "caret", direction: isOpenTraits ? 'up' : 'down' })] }), jsx$2(AnimatePresence, { children: isOpenTraits && (jsx$2(motion.div, { initial: { height: 0 }, animate: { height: 'fit-content' }, transition: { opacity: { duration: 0.2 } }, exit: { height: 0 }, sx: { overflow: 'hidden', width: '100%' }, children: jsx$2(Flex$1, { sx: { flexDirection: 'column', gap: '1px' }, children: attributes
25270
25278
  ? attributes.map((a) => (jsxs(TraitsContentContainer, { children: [jsx$2(Text, { sx: { fontSize: '10px', fontWeight: 500 }, children: a === null || a === void 0 ? void 0 : a.trait_type }), jsx$2(Text, { sx: { fontSize: '10px', fontWeight: 500 }, children: a === null || a === void 0 ? void 0 : a.value })] }, a.value)))
25271
25279
  : BILL_ATTRIBUTES.map((attrib) => {
25272
25280
  return (jsxs(TraitsContentContainer, { children: [jsx$2(Text, { sx: { fontSize: '10px', fontWeight: 500 }, children: attrib }), jsx$2(Skeleton, { width: "150px" })] }, attrib));
25273
- }) }) })) })] }), jsxs(Flex$1, { className: "yourbondinfo-block row-vested", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Fully Vested" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.FullyVested }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon" }), jsx$2(Flex$1, { className: "block-info text", children: jsx$2(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: getPendingVesting((_g = userBill.lastBlockTimestamp) !== null && _g !== void 0 ? _g : '', (_h = userBill.vesting) !== null && _h !== void 0 ? _h : '') }) })] })] }), jsxs(Flex$1, { className: "yourbondinfo-block row-pending", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Pending" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.Pending }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon", children: jsxs("div", { className: "icon-container-small", children: [jsx$2(Svg, { width: 10, height: 10, icon: (_j = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _j !== void 0 ? _j : 'question' }), jsx$2(TokenImage, { symbol: (_k = userBill.bond.showcaseTokenName) !== null && _k !== void 0 ? _k : userBill.bond.earnToken.symbol, size: 25 })] }) }), jsxs(Flex$1, { className: "block-info text", children: [jsx$2(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4) }), jsx$2(Text, { sx: {
25281
+ }) }) })) })] }), jsxs(Flex$1, { className: "yourbondinfo-block row-vested", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Price Paid For Bond" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: 'The amount you paid for the original bond' }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon" }), jsx$2(Flex$1, { className: "block-info text", children: jsxs(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: ["$", parseFloat((_j = bondNFTData === null || bondNFTData === void 0 ? void 0 : bondNFTData.data.dollarValue.toString()) !== null && _j !== void 0 ? _j : '0').toFixed(2)] }) })] })] }), jsxs(Flex$1, { className: "yourbondinfo-block row-vested", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Fully Vested" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.FullyVested }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon" }), jsx$2(Flex$1, { className: "block-info text", children: jsx$2(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: getPendingVesting((_k = userBill.lastBlockTimestamp) !== null && _k !== void 0 ? _k : '', (_l = userBill.vesting) !== null && _l !== void 0 ? _l : '') }) })] })] }), jsxs(Flex$1, { className: "yourbondinfo-block row-pending", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Pending" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.Pending }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon", children: jsxs("div", { className: "icon-container-small", children: [jsx$2(Svg, { width: 10, height: 10, icon: (_m = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _m !== void 0 ? _m : 'question' }), jsx$2(TokenImage, { symbol: (_o = userBill.bond.showcaseTokenName) !== null && _o !== void 0 ? _o : userBill.bond.earnToken.symbol, size: 25 })] }) }), jsxs(Flex$1, { className: "block-info text", children: [jsx$2(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4) }), jsx$2(Text, { sx: {
25274
25282
  fontSize: ['10px', '10px', '10px', '12px'],
25275
25283
  fontWeight: [500, 500, 500, 400],
25276
25284
  paddingLeft: '10px',
25277
- }, children: `($${(totalPending(userBill) * ((_l = parseFloat(earnTokenPrice(userBill.bond))) !== null && _l !== void 0 ? _l : 0)).toFixed(2)})` })] })] })] }), jsxs(Flex$1, { className: "yourbondinfo-block row-claimable", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Claimable" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.Claimable }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon", children: jsxs("div", { className: "icon-container-small", children: [jsx$2(Svg, { width: 10, height: 10, icon: (_m = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _m !== void 0 ? _m : 'question' }), jsx$2(TokenImage, { symbol: (_o = userBill.bond.showcaseTokenName) !== null && _o !== void 0 ? _o : userBill.bond.earnToken.symbol, size: 25 })] }) }), jsxs(Flex$1, { className: "block-info text", children: [jsx$2(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: formatNumberSI(parseFloat(claimable(userBill).toFixed(4)), 4) }), jsx$2(Text, { sx: {
25285
+ }, children: `($${(totalPending(userBill) * ((_p = parseFloat(earnTokenPrice(userBill.bond))) !== null && _p !== void 0 ? _p : 0)).toFixed(2)})` })] })] })] }), jsxs(Flex$1, { className: "yourbondinfo-block row-claimable", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Claimable" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.Claimable }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon", children: jsxs("div", { className: "icon-container-small", children: [jsx$2(Svg, { width: 10, height: 10, icon: (_q = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _q !== void 0 ? _q : 'question' }), jsx$2(TokenImage, { symbol: (_r = userBill.bond.showcaseTokenName) !== null && _r !== void 0 ? _r : userBill.bond.earnToken.symbol, size: 25 })] }) }), jsxs(Flex$1, { className: "block-info text", children: [jsx$2(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: formatNumberSI(parseFloat(claimable(userBill).toFixed(4)), 4) }), jsx$2(Text, { sx: {
25278
25286
  fontSize: ['10px', '10px', '10px', '12px'],
25279
25287
  fontWeight: [500, 500, 500, 400],
25280
25288
  paddingLeft: '10px',
25281
- }, children: `($${(claimable(userBill) * ((_p = parseFloat(earnTokenPrice(userBill.bond))) !== null && _p !== void 0 ? _p : 0)).toFixed(2)})` })] })] })] })] }), jsxs(Flex$1, { className: "yourbondinfo button-container", children: [jsx$2(Flex$1, { className: "button-container claim", children: chainId !== (userBill === null || userBill === void 0 ? void 0 : userBill.bond.chainId) ? (jsxs(Button, { className: "switch-button", disabled: claimable(userBill) === 0 || isPending, onClick: (event) => {
25282
- event.stopPropagation();
25283
- switchChain({ chainId: userBill.bond.chainId });
25284
- }, children: ["Switch to ", NETWORK_LABEL[userBill.bond.chainId]] })) : (jsx$2(Button, { className: "claim-button", disabled: claimable(userBill) === 0 || isPending, onClick: (event) => {
25285
- event.stopPropagation();
25286
- handleClaim(userBill.id, userBill.address);
25287
- }, children: "Claim" })) }), jsx$2(Flex$1, { className: "button-container transfer", children: jsx$2(Button, { className: "transfer-button", variant: "secondary", disabled: true, onClick: () => {
25288
- window.open('https://ape.bond/swap', '_blank');
25289
- }, children: "TRANSFER" }) })] })] })] })] }) }) }, userBill.address) }));
25289
+ }, children: `($${(claimable(userBill) * ((_s = parseFloat(earnTokenPrice(userBill.bond))) !== null && _s !== void 0 ? _s : 0)).toFixed(2)})` })] })] })] }), jsxs(Flex$1, { className: "yourbondinfo button-container", children: [jsx$2(Flex$1, { className: "button-container claim", children: chainId !== (userBill === null || userBill === void 0 ? void 0 : userBill.bond.chainId) ? (jsxs(Button, { className: "switch-button", disabled: claimable(userBill) === 0 || isPending, onClick: (event) => {
25290
+ event.stopPropagation();
25291
+ switchChain({ chainId: userBill.bond.chainId });
25292
+ }, children: ["Switch to ", NETWORK_LABEL[userBill.bond.chainId]] })) : (jsx$2(Button, { className: "claim-button", disabled: claimable(userBill) === 0 || isPending, onClick: (event) => {
25293
+ event.stopPropagation();
25294
+ handleClaim(userBill.id, userBill.address);
25295
+ }, children: "Claim" })) }), jsx$2(Flex$1, { className: "button-container transfer", children: jsx$2(Button, { className: "transfer-button", variant: "secondary", disabled: true, onClick: () => {
25296
+ window.open('https://ape.bond/swap', '_blank');
25297
+ }, children: "TRANSFER" }) })] })] })] })] }), jsx$2(Flex$1, { className: "footer-details" })] }) }) }, userBill.address) }));
25290
25298
  };
25291
25299
 
25292
25300
  const WNATIVE = {
@@ -64823,6 +64831,8 @@ const YourBonds = () => {
64823
64831
  }
64824
64832
  return 0;
64825
64833
  });
64834
+ // console.log('Bills Tests')
64835
+ // console.log(sortedBills[0])
64826
64836
  setSortedBonds(sortedBills);
64827
64837
  return;
64828
64838
  }
@@ -66039,7 +66049,7 @@ const useApproval = (amount, currency, spender, account, chainId) => {
66039
66049
  return [approvalState !== null && approvalState !== void 0 ? approvalState : ApprovalState.NOT_APPROVED, handleApprove];
66040
66050
  };
66041
66051
 
66042
- const version = '2.21.17';
66052
+ const version = '2.21.21';
66043
66053
 
66044
66054
  let errorConfig = {
66045
66055
  getDocsUrl: ({ docsBaseUrl, docsPath = '', docsSlug, }) => docsPath
@@ -72171,7 +72181,7 @@ const getBondsData = () => __awaiter$9(void 0, void 0, void 0, function* () {
72171
72181
  }
72172
72182
  });
72173
72183
 
72174
- const BondModal = ({ bondAddress, bondChain, accordionTitle = 'What are Bonds?', accordionBody = 'Body', accordionVisible = false, variant = 'standard', onDismiss, }) => {
72184
+ const BondModal = ({ bondAddress, bondChain, accordionTitle = 'What are Bonds?', accordionBody = 'Body', accordionVisible = false, variant = 'alternative', onDismiss, }) => {
72175
72185
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
72176
72186
  // Hooks
72177
72187
  const userChainId = useChainId();
@@ -72202,6 +72212,7 @@ const BondModal = ({ bondAddress, bondChain, accordionTitle = 'What are Bonds?',
72202
72212
  hash: buyTxHash,
72203
72213
  });
72204
72214
  const load = loadingTx || (isConfirming && !isConfirmed);
72215
+ const [bondsDescriptionVisibile, setBondsDescriptionVisibile] = useState(false);
72205
72216
  // State Handlers
72206
72217
  const handleCurrencySelect = useCallback((newInputToken) => {
72207
72218
  setInputValue('');
@@ -72338,17 +72349,23 @@ const BondModal = ({ bondAddress, bondChain, accordionTitle = 'What are Bonds?',
72338
72349
  // ALTERNATIVE VIEW!!
72339
72350
  //
72340
72351
  //
72341
- jsx$2(Flex, { className: "modal-backdrop", onClick: handleClose, children: jsxs(Flex, { className: "modal-content font-small gpt", onClick: (event) => event.stopPropagation(), children: [jsx$2(ModalHeader, { hideDivider: true, onDismiss: handleClose, children: jsx$2(Flex, { className: "slippage-cog alt", onClick: onOpenSlippageModal, children: jsx$2(Svg, { icon: "cog", width: "16px" }) }) }), window.location.origin === 'http://localhost:5173' && (jsxs(Text, { sx: { borderBottom: '1px solid white' }, children: ["Dev Mode - Current view: \"", modalVariant, "\"", jsx$2(Text, { onClick: () => setModalVariant('standard'), sx: { ml: '15px', textDecoration: 'underline', cursor: 'pointer' }, children: "Switch view" })] })), toastMessage && jsx$2(Flex, { className: "toast", children: toastMessage }), jsxs(Flex, { className: "modaltable-container", sx: { flexDirection: 'row', gap: '20px' }, children: [jsxs(Flex, { sx: { width: '500px', flexDirection: 'column' }, children: [jsx$2("img", { src: "https://placehold.co/400x200" }), jsx$2(Flex, { className: "modaltable-container description-container paragraph-spaced", sx: { marginTop: '20px' }, children: bondData === null || bondData === void 0 ? void 0 : bondData.shortDescription })] }), jsxs(Flex, { sx: { flexDirection: 'column', width: '600px' }, children: [jsxs(Flex, { sx: { alignItems: 'center' }, children: [jsx$2(Flex, { className: "modal-chainicon", sx: { minWidth: '300px' }, children: jsxs("h2", { sx: { margin: '0px' }, children: [bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, ' ', jsx$2(Svg, { width: 20, height: 20, icon: (_s = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[bondData.chainId]) !== null && _s !== void 0 ? _s : 'question' })] }) }), jsxs(Flex, { sx: { justifyContent: 'space-between', flexGrow: 1 }, children: [jsx$2(TokenImage, { symbol: (_t = bondData.showcaseTokenName) !== null && _t !== void 0 ? _t : bondData.earnToken.symbol, size: 20 }), jsx$2("span", { children: bondData.earnToken.symbol }), " ", jsx$2("span", { children: "|" }), ' ', jsxs("span", { children: ["Market Price: $", earnTokenPrice(bondData)] })] })] }), jsxs(Flex, { sx: { flexDirection: 'column', marginTop: '20px' }, children: [jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleMaxBtn: () => { var _a; return setInputValue((_a = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: true, bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price }), jsxs(Flex, { sx: { justifyContent: 'space-between', alignItems: 'center' }, children: [jsxs(Flex, { children: ["You will receive:", jsx$2(Flex, { sx: { marginLeft: '15px', marginRight: '5px' }, children: jsx$2(TokenImage, { symbol: (_u = bondData.showcaseTokenName) !== null && _u !== void 0 ? _u : bondData.earnToken.symbol, size: 20 }) }), (lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0), ' ', bondData.earnToken.symbol, " + \u00A0", (youGet(bondData, inputValue) -
72342
- lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0), jsx$2("span", { className: "text-highlight", children: "\u00A0additional" })] }), jsx$2(Flex, { className: "button-container buy alt", sx: { justifyContent: 'end' }, children: userChainId !== bondData.chainId ? (jsx$2(Button, { className: "switch-button button-narrow", disabled: loadingTx || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) || !account, onClick: (event) => {
72343
- event.stopPropagation();
72344
- switchChain({ chainId: bondData.chainId });
72345
- }, children: !account ? 'Connect Wallet' : `Switch to ${NETWORK_LABEL[bondData.chainId]}` })) : approvalState === ApprovalState.APPROVED ? (jsxs(Button, { className: "action-button", load: load, disabled: load || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) || !account || !inputValue || parseFloat(inputValue) === 0, onClick: handleBothPurchases, children: ["buy ", isZap ? 'zap' : 'normal'] })) : (jsxs(Button, { className: "action-button", load: approvalState === ApprovalState.PENDING, disabled: approvalState === ApprovalState.PENDING ||
72346
- (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
72347
- !account ||
72348
- !inputValue ||
72349
- parseFloat(inputValue) === 0, onClick: approveCallback, children: ["approve ", isZap ? 'zap' : 'normal'] })) })] }), jsx$2(Flex, { sx: { width: '100%', marginTop: '10px', marginBottom: '10px' }, children: jsx$2("hr", { className: "fading-hr" }) }), jsxs(Flex, { sx: { width: '100%' }, children: [jsxs(Flex, { sx: { width: '50%', flexDirection: 'column' }, children: ["Market Price: $", formatUSDNumber((youGet(bondData, inputValue) * lodashExports.toNumber(earnTokenPrice(bondData))).toString()), jsx$2("hr", { className: "fading-hr" }), jsx$2("span", { className: "text-highlight flex-inline", children: "Our price: " }), jsxs("span", { className: "flex-inline", children: ["$", formatUSDNumber((lodashExports.toNumber(inputValue) * lodashExports.toNumber(bondData.principalTokenPrice)).toString()), ' '] }), jsxs("span", { className: "text-highlight flex-inline", children: ["(discount rate ", bondData === null || bondData === void 0 ? void 0 : bondData.discount.toFixed(2), "%)"] })] }), jsx$2(Flex, { sx: { width: '50px', alignItems: 'center', justifyContent: 'center' }, children: "vs." }), jsxs(Flex, { sx: { width: '50%', flexDirection: 'column' }, children: ["If purchased from market:", ' ', (lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0), ' ', bondData.earnToken.symbol, jsx$2("hr", { className: "fading-hr" }), jsx$2("span", { className: "text-highlight flex-inline", children: "Amount you will get:" }), ' ', youGet(bondData, inputValue).toFixed(0), " ", jsx$2("span", { className: "flex-inline", children: bondData.earnToken.symbol })] })] })] })] })] }), jsxs(Flex, { className: "footer-details", children: [jsxs(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: ["Vesting start date: ", moment().format('DD-MMM-YYYY')] }), jsxs(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: ["Vesting end date:", ' ', moment()
72350
- .add(vestingTime((_v = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _v !== void 0 ? _v : 0).days, 'days')
72351
- .format('DD-MMM-YYYY')] }), jsx$2(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: "Vesting type: Linear" }), jsx$2(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: "What are bonds?" })] }), accordionVisible && (jsx$2(Flex, { className: "modaltable-container accordion-container", children: jsx$2(AccordionText, { title: accordionTitle, body: accordionBody, isVisible: accordionVisible }) }))] }) })) })) }));
72352
+ jsxs(Flex, { className: "modal-backdrop", onClick: handleClose, children: [jsxs(Flex, { className: "modal-content font-small gpt", onClick: (event) => event.stopPropagation(), children: [jsx$2(ModalHeader, { hideDivider: true, onDismiss: handleClose, children: jsx$2(Flex, { className: "slippage-cog alt", onClick: onOpenSlippageModal, children: jsx$2(Svg, { icon: "cog", width: "16px" }) }) }), window.location.origin === 'http://localhost:5173' && (jsxs(Text, { sx: { borderBottom: '1px solid white' }, children: ["Dev Mode - Current view: \"", modalVariant, "\"", jsx$2(Text, { onClick: () => setModalVariant('standard'), sx: { ml: '15px', textDecoration: 'underline', cursor: 'pointer' }, children: "Switch view" })] })), toastMessage && jsx$2(Flex, { className: "toast", children: toastMessage }), jsxs(Flex, { className: "modaltable-container", sx: { flexDirection: 'row', gap: '20px' }, children: [jsxs(Flex, { sx: { width: '500px', flexDirection: 'column' }, children: [jsx$2("img", { src: "https://placehold.co/400x200" }), jsx$2(Flex, { className: "modaltable-container description-container paragraph-spaced", sx: { marginTop: '20px' }, children: bondData === null || bondData === void 0 ? void 0 : bondData.shortDescription })] }), jsxs(Flex, { sx: { flexDirection: 'column', width: '600px' }, children: [jsxs(Flex, { sx: { alignItems: 'center' }, children: [jsx$2(Flex, { className: "modal-chainicon", sx: { minWidth: '300px' }, children: jsxs("h2", { sx: { margin: '0px' }, children: [bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, ' ', jsx$2(Svg, { width: 20, height: 20, icon: (_s = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[bondData.chainId]) !== null && _s !== void 0 ? _s : 'question' })] }) }), jsxs(Flex, { sx: { justifyContent: 'space-between', flexGrow: 1 }, children: [jsx$2(TokenImage, { symbol: (_t = bondData.showcaseTokenName) !== null && _t !== void 0 ? _t : bondData.earnToken.symbol, size: 20 }), jsx$2("span", { children: bondData.earnToken.symbol }), " ", jsx$2("span", { children: "|" }), ' ', jsxs("span", { children: ["Market Price: $", earnTokenPrice(bondData)] })] })] }), jsxs(Flex, { sx: { flexDirection: 'column', marginTop: '20px' }, children: [jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleMaxBtn: () => { var _a; return setInputValue((_a = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: true, bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price }), jsxs(Flex, { sx: { justifyContent: 'space-between', alignItems: 'center' }, children: [jsxs(Flex, { children: ["You will receive:", jsx$2(Flex, { sx: { marginLeft: '15px', marginRight: '5px' }, children: jsx$2(TokenImage, { symbol: (_u = bondData.showcaseTokenName) !== null && _u !== void 0 ? _u : bondData.earnToken.symbol, size: 20 }) }), (lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0), ' ', bondData.earnToken.symbol, " + \u00A0", (youGet(bondData, inputValue) -
72353
+ lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0), jsx$2("span", { className: "text-highlight", children: "\u00A0additional" })] }), jsx$2(Flex, { className: "button-container buy alt", sx: { justifyContent: 'end' }, children: userChainId !== bondData.chainId ? (jsx$2(Button, { className: "switch-button button-narrow", disabled: loadingTx || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) || !account, onClick: (event) => {
72354
+ event.stopPropagation();
72355
+ switchChain({ chainId: bondData.chainId });
72356
+ }, children: !account ? 'Connect Wallet' : `Switch to ${NETWORK_LABEL[bondData.chainId]}` })) : approvalState === ApprovalState.APPROVED ? (jsxs(Button, { className: "action-button", load: load, disabled: load || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) || !account || !inputValue || parseFloat(inputValue) === 0, onClick: handleBothPurchases, children: ["buy ", isZap ? 'zap' : 'normal'] })) : (jsxs(Button, { className: "action-button", load: approvalState === ApprovalState.PENDING, disabled: approvalState === ApprovalState.PENDING ||
72357
+ (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
72358
+ !account ||
72359
+ !inputValue ||
72360
+ parseFloat(inputValue) === 0, onClick: approveCallback, children: ["approve ", isZap ? 'zap' : 'normal'] })) })] }), jsx$2(Flex, { sx: { width: '100%', marginTop: '10px', marginBottom: '10px' }, children: jsx$2("hr", { className: "fading-hr" }) }), jsxs(Flex, { sx: { width: '100%' }, children: [jsxs(Flex, { sx: { width: '50%', flexDirection: 'column' }, children: ["Market Price: $", formatUSDNumber((youGet(bondData, inputValue) * lodashExports.toNumber(earnTokenPrice(bondData))).toString()), jsx$2("hr", { className: "fading-hr" }), jsx$2("span", { className: "text-highlight flex-inline", children: "Our price: " }), jsxs("span", { className: "flex-inline", children: ["$", formatUSDNumber((lodashExports.toNumber(inputValue) * lodashExports.toNumber(bondData.principalTokenPrice)).toString()), ' '] }), jsxs("span", { className: "text-highlight flex-inline", children: ["(discount rate ", bondData === null || bondData === void 0 ? void 0 : bondData.discount.toFixed(2), "%)"] })] }), jsx$2(Flex, { sx: { width: '50px', alignItems: 'center', justifyContent: 'center' }, children: "vs." }), jsxs(Flex, { sx: { width: '50%', flexDirection: 'column' }, children: ["If purchased from market:", ' ', (lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0), ' ', bondData.earnToken.symbol, jsx$2("hr", { className: "fading-hr" }), jsx$2("span", { className: "text-highlight flex-inline", children: "Amount you will get:" }), ' ', youGet(bondData, inputValue).toFixed(0), ' ', jsx$2("span", { className: "flex-inline", children: bondData.earnToken.symbol })] })] })] })] })] }), jsxs(Flex, { className: "footer-details", children: [jsxs(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: ["Vesting start date: ", moment().format('DD-MMM-YYYY')] }), jsxs(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: ["Vesting end date:", ' ', moment()
72361
+ .add(vestingTime((_v = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _v !== void 0 ? _v : 0).days, 'days')
72362
+ .format('DD-MMM-YYYY')] }), jsx$2(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: "Vesting type: Linear" }), jsx$2(Flex, { sx: { width: '25%', justifyContent: 'center', cursor: 'pointer' }, onClick: () => {
72363
+ setBondsDescriptionVisibile(!bondsDescriptionVisibile ? true : false);
72364
+ }, children: "What are bonds?" })] })] }), bondsDescriptionVisibile && (jsxs(Flex, { className: "what-are-bonds-container", children: [jsx$2("h3", { children: "Bonds at Seedify are an exciting new product!" }), jsx$2("p", { children: "Are you a strong believer in a project? Do you want to buy project tokens at a discount compared to the market? If so, you've arrived at the right place!" }), jsx$2("p", { children: "Bonds allow you to purchase project tokens at a discounted price with a short-term linear vesting. Its a perfect solution for projects you're planning to buy and hold tokens of!" }), jsx$2("p", { children: "When you buy a Bond, you essentially are given an NFT (which you can transfer across your wallets). Whichever wallet owns the NFT will be able to Claim tokens of that project post-purchase until vesting period ends. Bonds at Seedify can range their vesting from 7 Days to 90 Days, with 30 Days being the standard." })] })
72365
+ // <Flex className="modaltable-container accordion-container">
72366
+ // <AccordionText title={accordionTitle} body={accordionBody} isVisible={accordionVisible} />
72367
+ // </Flex>
72368
+ )] })) })) }));
72352
72369
  };
72353
72370
 
72354
72371
  const BondRow = ({ bond, hotBonds, modalVariant }) => {
@@ -9,6 +9,31 @@
9
9
  justify-content: center;
10
10
  align-items: center;
11
11
  z-index: 100;
12
+ flex-direction: column;
13
+ }
14
+
15
+ .what-are-bonds-container {
16
+ background-color: #151320;
17
+ color: #ffffff;
18
+ max-width: 1050px;
19
+ justify-content: center;
20
+ padding: 15px 20px 10px 20px;
21
+ font-weight: 400;
22
+ flex-direction: column;
23
+ border-radius: 0 0 10px 10px;
24
+ font-size: 14px;
25
+ line-height: 21px;
26
+ border-top: 1px solid #333333;
27
+
28
+ p {
29
+ margin: 10px 0px;
30
+ }
31
+
32
+ h3 {
33
+ font-size: 120%;
34
+ margin: 0px;
35
+ }
36
+
12
37
  }
13
38
 
14
39
  .modal {
@@ -9,4 +9,7 @@
9
9
  @use 'ProgressBar';
10
10
  @use 'TokenInfoName';
11
11
  @use 'YourBonds';
12
- @use 'YourBondsModal';
12
+ @use 'YourBondsModal';
13
+
14
+
15
+
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Ape Bond SDK",
4
4
  "author": "Ape Bond",
5
5
  "license": "MIT",
6
- "version": "1.0.15-test",
6
+ "version": "1.0.16-seedify",
7
7
  "module": "dist/main.js",
8
8
  "type": "module",
9
9
  "types": "dist/main.d.ts",