@deframe-sdk/components 0.1.36 → 0.1.38

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 (8) hide show
  1. package/dist/index.d.mts +2 -0
  2. package/dist/index.d.ts +2 -0
  3. package/dist/index.js +53 -61
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +53 -61
  6. package/dist/index.mjs.map +1 -1
  7. package/dist/styles.css +9 -12
  8. package/package.json +1 -1
package/dist/index.mjs CHANGED
@@ -9353,7 +9353,6 @@ var ImageBannerCard = ({
9353
9353
  );
9354
9354
  };
9355
9355
  var GRID_COLS = "grid grid-cols-[1fr_100px_130px] gap-x-[var(--deframe-widget-size-gap-md)]";
9356
- var HISTORY_PAGE_SIZE = 5;
9357
9356
  var HISTORY_CONFIG = {
9358
9357
  deposit: { label: "Depositado", color: "var(--deframe-widget-color-state-info)" },
9359
9358
  withdraw: { label: "Sacado", color: "var(--deframe-widget-color-text-secondary)" },
@@ -9371,14 +9370,11 @@ var EarnHubStrategyCard = ({
9371
9370
  history = [],
9372
9371
  labels
9373
9372
  }) => {
9374
- var _a, _b, _c, _d, _e;
9373
+ var _a, _b, _c, _d;
9375
9374
  const [expanded, setExpanded] = React6__default.useState(false);
9376
- const [showAll, setShowAll] = React6__default.useState(false);
9377
9375
  const investLabel = (_a = labels == null ? void 0 : labels.investLabel) != null ? _a : "Depositar";
9378
9376
  const withdrawLabel = (_b = labels == null ? void 0 : labels.withdrawLabel) != null ? _b : "Sacar";
9379
9377
  const historyTitle = (_c = labels == null ? void 0 : labels.historyTitle) != null ? _c : "Hist\xF3rico";
9380
- const visibleHistory = showAll ? history : history.slice(0, HISTORY_PAGE_SIZE);
9381
- const hasMore = history.length > HISTORY_PAGE_SIZE && !showAll;
9382
9378
  return /* @__PURE__ */ jsxs(
9383
9379
  "li",
9384
9380
  {
@@ -9471,7 +9467,7 @@ var EarnHubStrategyCard = ({
9471
9467
  ),
9472
9468
  history.length > 0 && /* @__PURE__ */ jsxs("div", { "data-test-id": "earn-hub-strategy-card-history", children: [
9473
9469
  /* @__PURE__ */ jsx("span", { className: "text-[length:var(--deframe-widget-font-size-xs)] [font-weight:var(--deframe-widget-font-weight-medium)] uppercase tracking-[0.08em] text-[color:var(--deframe-widget-color-text-tertiary)]", children: historyTitle }),
9474
- /* @__PURE__ */ jsx("ol", { className: "list-none m-0 p-0", children: visibleHistory.map((entry) => {
9470
+ /* @__PURE__ */ jsx("ol", { className: "list-none m-0 p-0 max-h-[200px] overflow-y-auto", children: history.map((entry) => {
9475
9471
  var _a2;
9476
9472
  const config = (_a2 = HISTORY_CONFIG[entry.type]) != null ? _a2 : HISTORY_CONFIG.deposit;
9477
9473
  const isClickable = !!entry.onClick;
@@ -9510,26 +9506,7 @@ var EarnHubStrategyCard = ({
9510
9506
  },
9511
9507
  entry.id
9512
9508
  );
9513
- }) }),
9514
- hasMore && /* @__PURE__ */ jsx(
9515
- "button",
9516
- {
9517
- type: "button",
9518
- onClick: () => setShowAll(true),
9519
- className: twMerge(
9520
- "mt-[var(--deframe-widget-size-gap-sm)] w-full",
9521
- "text-[length:var(--deframe-widget-font-size-xs)] [font-weight:var(--deframe-widget-font-weight-medium)]",
9522
- "text-[color:var(--deframe-widget-color-text-secondary)]",
9523
- "font-[var(--deframe-widget-font-family)]",
9524
- "hover:text-[color:var(--deframe-widget-color-brand-primary)]",
9525
- "transition-colors duration-150 cursor-pointer",
9526
- "py-[var(--deframe-widget-size-padding-y-xs)]",
9527
- "border-t border-[color:var(--deframe-widget-color-border-tertiary)]",
9528
- "outline-none bg-transparent border-x-0 border-b-0"
9529
- ),
9530
- children: (_e = labels == null ? void 0 : labels.showMoreLabel) != null ? _e : `Ver mais (${history.length - HISTORY_PAGE_SIZE} itens)`
9531
- }
9532
- )
9509
+ }) })
9533
9510
  ] })
9534
9511
  ]
9535
9512
  }
@@ -10692,21 +10669,33 @@ var EarnNoBalanceNotificationView = ({
10692
10669
  prompt,
10693
10670
  actionLabel,
10694
10671
  onAction
10695
- }) => /* @__PURE__ */ jsx("div", { className: "px-[var(--deframe-widget-size-padding-x-md)] mt-[var(--deframe-widget-size-gap-md)]", children: /* @__PURE__ */ jsx(SectionCard, { className: "bg-[var(--deframe-widget-color-state-warning)]/10 border border-[var(--deframe-widget-color-state-warning)]/20", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-[var(--deframe-widget-size-gap-sm)]", children: [
10696
- /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-[var(--deframe-widget-size-gap-sm)]", children: [
10697
- /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 text-[color:var(--deframe-widget-color-state-warning)] flex-shrink-0 mt-0.5", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z", clipRule: "evenodd" }) }),
10698
- /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx(TextBody, { variant: "text-small", className: "text-[color:var(--deframe-widget-color-text-primary)]", children: prompt }) })
10699
- ] }),
10700
- /* @__PURE__ */ jsx(
10701
- PrimaryButton,
10702
- {
10703
- type: "button",
10704
- onClick: onAction,
10705
- className: "w-full mt-[var(--deframe-widget-size-gap-sm)]",
10706
- children: actionLabel
10707
- }
10708
- )
10709
- ] }) }) });
10672
+ }) => /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-md)]", children: /* @__PURE__ */ jsxs(
10673
+ "div",
10674
+ {
10675
+ "data-test-id": "earn-no-balance-notification",
10676
+ className: [
10677
+ "bg-[color-mix(in_srgb,var(--deframe-widget-color-state-warning)_16%,transparent)]",
10678
+ "border border-[var(--deframe-widget-color-state-warning)]",
10679
+ "rounded-[var(--deframe-widget-size-radius-sm)]",
10680
+ "px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]",
10681
+ "flex flex-col gap-[var(--deframe-widget-size-gap-md)]"
10682
+ ].join(" "),
10683
+ children: [
10684
+ /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-[var(--deframe-widget-size-gap-sm)]", children: [
10685
+ /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 text-[color:var(--deframe-widget-color-state-warning)] flex-shrink-0 mt-0.5", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z", clipRule: "evenodd" }) }),
10686
+ /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx(TextBody, { variant: "text-small", children: prompt }) })
10687
+ ] }),
10688
+ /* @__PURE__ */ jsx(
10689
+ PrimaryButton,
10690
+ {
10691
+ type: "button",
10692
+ onClick: onAction,
10693
+ children: actionLabel
10694
+ }
10695
+ )
10696
+ ]
10697
+ }
10698
+ ) });
10710
10699
  var EarnTxStatusCardView = ({
10711
10700
  statusLabel,
10712
10701
  isProcessing,
@@ -11313,6 +11302,8 @@ var EarnDepositFormViewSimple = ({
11313
11302
  isTxError,
11314
11303
  txSuccessMessage,
11315
11304
  txErrorMessage,
11305
+ // Insufficient balance
11306
+ insufficientBalanceMessage,
11316
11307
  // Bytecode error
11317
11308
  bytecodeErrorMessage,
11318
11309
  // Submit button
@@ -11320,7 +11311,7 @@ var EarnDepositFormViewSimple = ({
11320
11311
  submitButtonText
11321
11312
  }) => {
11322
11313
  const hasToken = selectedToken != null;
11323
- const hasError = !!bytecodeErrorMessage;
11314
+ const hasError = !!insufficientBalanceMessage || !!bytecodeErrorMessage;
11324
11315
  const isSubmitDisabled = !hasToken || submitDisabled || !amountValue || amountValue === "0" || amountValue === "";
11325
11316
  const [cardHovered, setCardHovered] = React6__default.useState(false);
11326
11317
  const hideTimerRef = React6__default.useRef(void 0);
@@ -11481,7 +11472,21 @@ var EarnDepositFormViewSimple = ({
11481
11472
  children: selectTokenLabel
11482
11473
  }
11483
11474
  ),
11484
- /* @__PURE__ */ jsx(AnimatePresence, { children: hasToken && cardHovered && /* @__PURE__ */ jsx(
11475
+ hasError && /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx(
11476
+ EarnInlineNotificationSimpleView,
11477
+ {
11478
+ variant: "error",
11479
+ message: insufficientBalanceMessage || bytecodeErrorMessage
11480
+ }
11481
+ ) }),
11482
+ showNoBalanceNotification ? /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx(
11483
+ EarnNoBalanceNotificationView,
11484
+ {
11485
+ prompt: noBalancePrompt,
11486
+ actionLabel: goToSwapLabel,
11487
+ onAction: onGoToSwap
11488
+ }
11489
+ ) }) : /* @__PURE__ */ jsx(AnimatePresence, { children: hasToken && cardHovered && /* @__PURE__ */ jsx(
11485
11490
  motion.div,
11486
11491
  {
11487
11492
  "data-slot": "deposit-simple-chips-row",
@@ -11501,21 +11506,6 @@ var EarnDepositFormViewSimple = ({
11501
11506
  }
11502
11507
  )
11503
11508
  }
11504
- ) }),
11505
- showNoBalanceNotification && /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx(
11506
- EarnNoBalanceNotificationView,
11507
- {
11508
- prompt: noBalancePrompt,
11509
- actionLabel: goToSwapLabel,
11510
- onAction: onGoToSwap
11511
- }
11512
- ) }),
11513
- bytecodeErrorMessage && /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx(
11514
- EarnInlineNotificationSimpleView,
11515
- {
11516
- variant: "error",
11517
- message: bytecodeErrorMessage
11518
- }
11519
11509
  ) })
11520
11510
  ]
11521
11511
  }
@@ -11771,6 +11761,8 @@ var EarnWithdrawFormViewSimple = ({
11771
11761
  isTxError,
11772
11762
  txSuccessMessage,
11773
11763
  txErrorMessage,
11764
+ // Insufficient balance
11765
+ insufficientBalanceMessage,
11774
11766
  // Bytecode error
11775
11767
  bytecodeErrorMessage,
11776
11768
  // Submit button
@@ -11778,7 +11770,7 @@ var EarnWithdrawFormViewSimple = ({
11778
11770
  submitButtonText
11779
11771
  }) => {
11780
11772
  const hasToken = selectedToken != null;
11781
- const hasError = !!bytecodeErrorMessage;
11773
+ const hasError = !!insufficientBalanceMessage || !!bytecodeErrorMessage;
11782
11774
  const isSubmitDisabled = !hasToken || submitDisabled || !amountValue || amountValue === "0" || amountValue === "";
11783
11775
  const [cardHovered, setCardHovered] = React6__default.useState(false);
11784
11776
  const hideTimerRef = React6__default.useRef(void 0);
@@ -11957,11 +11949,11 @@ var EarnWithdrawFormViewSimple = ({
11957
11949
  )
11958
11950
  }
11959
11951
  ) }),
11960
- bytecodeErrorMessage && /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx(
11952
+ hasError && /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx(
11961
11953
  EarnInlineNotificationSimpleView,
11962
11954
  {
11963
11955
  variant: "error",
11964
- message: bytecodeErrorMessage
11956
+ message: insufficientBalanceMessage || bytecodeErrorMessage
11965
11957
  }
11966
11958
  ) })
11967
11959
  ]