@gearbox-protocol/ui-kit 4.0.0-next.4 → 4.0.0-next.5

package/dist/esm/components/base/history-chart/history-chart.js

@@ -1,70 +1,110 @@
-import { jsx as p } from "react/jsx-runtime";
+import { jsx as h } from "react/jsx-runtime";
 import { useMemo as g } from "react";
+import { useTitleText as E } from "../text/use-title-text.js";
 import "@gearbox-protocol/static";
 import "../../checkbox/checkbox.js";
 import "../../checkbox/checkbox-labeled.js";
 import "../../select/select.js";
-import { TradingView as h } from "../../trading-view/trading-view.js";
-import { useIntlTyped as A } from "../../typed-intl/index.js";
-import { HistoryChartTest as v } from "./constants.js";
-const M = ["1d", "1w", "1m", "1y", "max"], x = {
+import { TradingView as G } from "../../trading-view/trading-view.js";
+import { useIntlTyped as O } from "../../typed-intl/index.js";
+import { HistoryChartTest as R } from "./constants.js";
+const Y = ["1d", "1w", "1m", "1y", "max"], j = {
   "1d": "1D",
-  "1w": "1W",
+  "1w": "7D",
   "1m": "1M",
   "1y": "1Y",
   max: "MAX"
 };
-function N({
+function q({
   data: t,
-  range: r,
-  onRange: m,
-  isLoading: d = !1,
-  error: c,
-  yMeasureUnit: e = "none",
-  height: f,
-  seriesTitles: i,
-  priceLines: a,
-  zones: s,
-  showCurrentValue: y = !1,
-  yScaleMin: l
+  range: o,
+  onRange: a,
+  isLoading: v = !1,
+  error: x,
+  yMeasureUnit: i = "none",
+  height: S,
+  seriesTitles: c,
+  priceLines: f,
+  zones: u,
+  showCurrentValue: I = !1,
+  yScaleMin: w,
+  title: A,
+  trailing: C,
+  dualYAxis: L
 }) {
-  const n = A(), u = g(() => t ? (Array.isArray(t) ? t : [t]).map(C(i)) : void 0, [t, i]);
-  return /* @__PURE__ */ p("div", { "data-testid": v.root, children: /* @__PURE__ */ p(
-    h,
+  const y = O(), b = E(), e = g(
+    () => Array.isArray(i) ? [...i] : void 0,
+    [i]
+  ), p = e != null && new Set(e).size > 1, d = L ?? p, l = e?.[0], D = g(() => {
+    const r = (n, m) => {
+      if (!d) return n;
+      if (p && e != null && l != null) {
+        const s = e[m] ?? l;
+        return {
+          ...n,
+          priceScaleId: s === l ? "left" : "right"
+        };
+      }
+      return {
+        ...n,
+        priceScaleId: m === 0 ? "left" : "right"
+      };
+    };
+    if (t)
+      return (Array.isArray(t) ? t : [t]).map(
+        (m, s) => r(H(c)(m), s)
+      );
+    if (c)
+      return Object.entries(c).map(
+        ([n, m], s) => r(
+          {
+            id: n,
+            title: m,
+            data: []
+          },
+          s
+        )
+      );
+  }, [t, c, p, d, l, e]);
+  return /* @__PURE__ */ h("div", { "data-testid": R.root, children: /* @__PURE__ */ h(
+    G,
     {
-      data: u,
-      isLoading: d,
-      error: c ? n.formatMessage({ messageId: "components.historyChart.error" }) : void 0,
-      emptyMessage: n.formatMessage({
+      data: D,
+      isLoading: v,
+      error: x ? y.formatMessage({ messageId: "components.historyChart.error" }) : void 0,
+      emptyMessage: y.formatMessage({
         messageId: "components.historyChart.empty"
       }),
-      yMeasureUnit: Array.isArray(e) ? [...e] : e,
-      height: f,
-      rangeList: M.map((o) => ({
-        value: o,
-        label: x[o]
+      dualYAxis: d,
+      yMeasureUnit: Array.isArray(i) ? [...i] : i,
+      height: S,
+      rangeList: Y.map((r) => ({
+        value: r,
+        label: j[r]
       })),
-      range: r,
-      setRange: (o) => m(o),
-      priceLineOptions: a ? [...a] : void 0,
-      zoneOptions: s ? [...s] : void 0,
-      showCurrentValue: y,
-      yScaleMin: l,
-      disableZoom: !0
+      range: o,
+      setRange: (r) => a(r),
+      priceLineOptions: f ? [...f] : void 0,
+      zoneOptions: u ? [...u] : void 0,
+      showCurrentValue: I,
+      yScaleMin: w,
+      disableZoom: !0,
+      title: A != null ? b(A) : void 0,
+      trailing: C
     }
   ) });
 }
-function C(t) {
-  return (r) => ({
-    id: r.metric,
-    title: t?.[r.metric] ?? r.metric,
-    data: r.points.map((m) => ({
-      time: m.timestamp,
-      value: m.value
+function H(t) {
+  return (o) => ({
+    id: o.metric,
+    title: t?.[o.metric] ?? o.metric,
+    data: o.points.map((a) => ({
+      time: a.timestamp,
+      value: a.value
     }))
   });
 }
 export {
-  N as HistoryChart,
-  v as HistoryChartTest
+  q as HistoryChart,
+  R as HistoryChartTest
 };

package/dist/esm/components/base/index.js

@@ -9,72 +9,75 @@ import { AsideAlignAnchor as S } from "./details-view/detail-aside/detail-aside-
 import { DetailAsideScreenLayout as g } from "./details-view/detail-aside/detail-aside-screen-layout.js";
 import { DetailsView as k, DetailsViewLeftPane as B, DetailsViewManagePane as A } from "./details-view/details-view.js";
 import { HealthFactorBlockTest as L } from "./health-factor-block/constants.js";
-import { HealthFactorBlock as C } from "./health-factor-block/health-factor-block.js";
-import { HistoryChart as w } from "./history-chart/history-chart.js";
-import { InfoLine as V, InfoList as h, InfoSectionTitle as D, PointsInfoLine as H } from "./info-list/info-list.js";
+import { HealthFactorBlock as y } from "./health-factor-block/health-factor-block.js";
+import { HistoryChart as h } from "./history-chart/history-chart.js";
+import { InfoLine as M, InfoList as V, InfoSectionTitle as D, PointsInfoLine as H } from "./info-list/info-list.js";
 import { InfoPortalOut as E, InfoPortalProvider as q } from "./info-portal/info-portal.js";
 import { LeverageInput as N } from "./leverage-input/leverage-input.js";
-import { LiquidationParamsTableTest as F } from "./liquidation-params-table/constants.js";
-import { LiquidationParamsTable as U } from "./liquidation-params-table/liquidation-params-table.js";
-import { LiquidationPriceBlockTest as W } from "./liquidation-price-block/constants.js";
-import { LiquidationPriceBlock as X } from "./liquidation-price-block/liquidation-price-block.js";
-import { ManagePane as J, ManagePaneActionTab as K, ManagePaneMessage as Q, ManagePaneTab as Y, ManagePaneTabDropdown as Z } from "./manage-pane/manage-pane.js";
-import { MoreAccordionTest as ee } from "./more-accordion/constants.js";
-import { MoreAccordion as re } from "./more-accordion/more-accordion.js";
-import { NestedInfoStackTest as ae } from "./nested-info-stack/constants.js";
-import { NestedInfoStack as pe } from "./nested-info-stack/nested-info-stack.js";
-import { PageHeadProvider as fe, PageTitle as ne } from "./page-title/page-title.js";
-import { PoolApyBreakdownCardTest as Te } from "./pool-apy-breakdown-card/constants.js";
-import { PoolApyBreakdownCard as le } from "./pool-apy-breakdown-card/pool-apy-breakdown-card.js";
-import { ReviewButton as Pe } from "./review-button/review-button.js";
-import { SectionHeading as ce } from "./section-heading/section-heading.js";
-import { SEGMENTED_TABS_INACTIVE_BUTTON_CLASS as ue, SegmentedTabs as ke } from "./segmented-tabs/segmented-tabs.js";
-import { SideCardTest as Ae } from "./side-card/constants.js";
-import { SideCard as Le } from "./side-card/side-card.js";
-import { SPACE_HEIGHT as Ce, SPACE_PX as Ie } from "./spacing.js";
-import { Stack as Me } from "./stack/stack.js";
-import { StatBadge as he, StatBadgeGrid as De } from "./stat-badge/stat-badge.js";
-import { StickyBar as ve } from "./sticky-bar/sticky-bar.js";
-import { StrategyApyBreakdownCardTest as qe } from "./strategy-apy-breakdown-card/constants.js";
-import { StrategyApyBreakdownCard as Ne } from "./strategy-apy-breakdown-card/strategy-apy-breakdown-card.js";
-import { Tabber as Fe, TabberSection as Ge, isTabber as Ue } from "./tabber/tabber.js";
-import { useDetailScrollSpy as We } from "./tabber/use-detail-scroll-spy.js";
-import { useTitleText as Xe } from "./text/use-title-text.js";
-import { TimeToLiquidationBlockTest as Je } from "./time-to-liquidation-block/constants.js";
-import { TimeToLiquidationBlock as Qe } from "./time-to-liquidation-block/time-to-liquidation-block.js";
-import { TitleMetaTest as Ze } from "./title-meta/constants.js";
-import { TitleMeta as eo } from "./title-meta/title-meta.js";
-import { TokenAmount as ro } from "./token-amount/token-amount.js";
-import { TokenPairSymbolTest as ao } from "./token-pair-symbol/constants.js";
-import { TokenPairSymbol as po } from "./token-pair-symbol/token-pair-symbol.js";
-import { TokenPairTitleTest as fo } from "./token-pair-title/constants.js";
-import { TokenPairTitle as xo } from "./token-pair-title/token-pair-title.js";
-import { PositionShortLabelTest as so, ValueTest as lo } from "./values/constants.js";
-import { PnlValue as So } from "./values/pnl-value.js";
-import { PointsValue as go } from "./values/points-value.js";
-import { PositionShortLabel as ko } from "./values/position-short-label.js";
-import { PositionTypeBadge as Ao } from "./values/position-type-badge.js";
-import { ApyValue as Lo, HealthFactorValue as yo, LeverageValue as Co, TokenBigint as Io, UsdValue as wo, UtilizationValue as Mo, bps as Vo } from "./values/scalars.js";
-import { AmountInputTest as Do } from "./amount-input/constants.js";
-import { DetailedPageTitleTest as vo } from "./detailed-page-title/constants.js";
-import { DetailsViewTest as qo } from "./details-view/constants.js";
-import { HistoryChartTest as No } from "./history-chart/constants.js";
-import { InfoListTest as Fo } from "./info-list/constants.js";
-import { LeverageInputTest as Uo } from "./leverage-input/constants.js";
-import { ManagePaneTest as Wo } from "./manage-pane/constants.js";
-import { PageTitleTest as Xo } from "./page-title/constants.js";
-import { ReviewButtonTest as Jo } from "./review-button/constants.js";
-import { SectionHeadingTest as Qo } from "./section-heading/constants.js";
-import { SegmentedTabsTest as Zo } from "./segmented-tabs/constants.js";
-import { StackTest as er } from "./stack/constants.js";
-import { StatBadgeTest as rr } from "./stat-badge/constants.js";
-import { StickyBarTest as ar } from "./sticky-bar/constants.js";
-import { TabberTest as pr } from "./tabber/constants.js";
-import { TokenAmountTest as fr } from "./token-amount/constants.js";
+import { LeveragePresetChipsTest as F } from "./leverage-preset-chips/constants.js";
+import { LeveragePresetChips as U } from "./leverage-preset-chips/leverage-preset-chips.js";
+import { LiquidationParamsTableTest as W } from "./liquidation-params-table/constants.js";
+import { LiquidationParamsTable as X } from "./liquidation-params-table/liquidation-params-table.js";
+import { LiquidationPriceBlockTest as J } from "./liquidation-price-block/constants.js";
+import { LiquidationPriceBlock as Q } from "./liquidation-price-block/liquidation-price-block.js";
+import { ManagePane as Z, ManagePaneActionTab as $, ManagePaneMessage as ee, ManagePaneTab as oe, ManagePaneTabDropdown as re } from "./manage-pane/manage-pane.js";
+import { MoreAccordionTest as ae } from "./more-accordion/constants.js";
+import { MoreAccordion as pe } from "./more-accordion/more-accordion.js";
+import { NestedInfoStackTest as fe } from "./nested-info-stack/constants.js";
+import { NestedInfoStack as xe } from "./nested-info-stack/nested-info-stack.js";
+import { PageHeadProvider as se, PageTitle as le } from "./page-title/page-title.js";
+import { PoolApyBreakdownCardTest as Pe } from "./pool-apy-breakdown-card/constants.js";
+import { PoolApyBreakdownCard as ce } from "./pool-apy-breakdown-card/pool-apy-breakdown-card.js";
+import { ReviewButton as ue } from "./review-button/review-button.js";
+import { SectionHeading as Be } from "./section-heading/section-heading.js";
+import { SEGMENTED_TABS_INACTIVE_BUTTON_CLASS as be, SegmentedTabs as Le } from "./segmented-tabs/segmented-tabs.js";
+import { SideCardTest as ye } from "./side-card/constants.js";
+import { SideCard as he } from "./side-card/side-card.js";
+import { SPACE_HEIGHT as Me, SPACE_PX as Ve } from "./spacing.js";
+import { Stack as He } from "./stack/stack.js";
+import { StatBadge as Ee, StatBadgeGrid as qe } from "./stat-badge/stat-badge.js";
+import { StickyBar as Ne } from "./sticky-bar/sticky-bar.js";
+import { StrategyApyBreakdownCardTest as Fe } from "./strategy-apy-breakdown-card/constants.js";
+import { StrategyApyBreakdownCard as Ue } from "./strategy-apy-breakdown-card/strategy-apy-breakdown-card.js";
+import { Tabber as We, TabberSection as ze, isTabber as Xe } from "./tabber/tabber.js";
+import { useDetailScrollSpy as Je } from "./tabber/use-detail-scroll-spy.js";
+import { useTitleText as Qe } from "./text/use-title-text.js";
+import { TimeToLiquidationBlockTest as Ze } from "./time-to-liquidation-block/constants.js";
+import { TimeToLiquidationBlock as eo } from "./time-to-liquidation-block/time-to-liquidation-block.js";
+import { TitleMetaTest as ro } from "./title-meta/constants.js";
+import { TitleMeta as ao } from "./title-meta/title-meta.js";
+import { TokenAmount as po } from "./token-amount/token-amount.js";
+import { TokenPairSymbolTest as fo } from "./token-pair-symbol/constants.js";
+import { TokenPairSymbol as xo } from "./token-pair-symbol/token-pair-symbol.js";
+import { TokenPairTitleTest as so } from "./token-pair-title/constants.js";
+import { TokenPairTitle as Po } from "./token-pair-title/token-pair-title.js";
+import { PositionShortLabelTest as co, ValueTest as go } from "./values/constants.js";
+import { PnlValue as ko } from "./values/pnl-value.js";
+import { PointsValue as Ao } from "./values/points-value.js";
+import { PositionShortLabel as Lo } from "./values/position-short-label.js";
+import { PositionStatusBadge as yo } from "./values/position-status-badge.js";
+import { PositionTypeBadge as ho } from "./values/position-type-badge.js";
+import { ApyValue as Mo, HealthFactorValue as Vo, LeverageValue as Do, TokenBigint as Ho, UsdValue as vo, UtilizationValue as Eo, bps as qo } from "./values/scalars.js";
+import { AmountInputTest as No } from "./amount-input/constants.js";
+import { DetailedPageTitleTest as Fo } from "./detailed-page-title/constants.js";
+import { DetailsViewTest as Uo } from "./details-view/constants.js";
+import { HistoryChartTest as Wo } from "./history-chart/constants.js";
+import { InfoListTest as Xo } from "./info-list/constants.js";
+import { LeverageInputTest as Jo } from "./leverage-input/constants.js";
+import { ManagePaneTest as Qo } from "./manage-pane/constants.js";
+import { PageTitleTest as Zo } from "./page-title/constants.js";
+import { ReviewButtonTest as er } from "./review-button/constants.js";
+import { SectionHeadingTest as rr } from "./section-heading/constants.js";
+import { SegmentedTabsTest as ar } from "./segmented-tabs/constants.js";
+import { StackTest as pr } from "./stack/constants.js";
+import { StatBadgeTest as fr } from "./stat-badge/constants.js";
+import { StickyBarTest as xr } from "./sticky-bar/constants.js";
+import { TabberTest as sr } from "./tabber/constants.js";
+import { TokenAmountTest as dr } from "./token-amount/constants.js";
 export {
   r as AmountInput,
-  Do as AmountInputTest,
-  Lo as ApyValue,
+  No as AmountInputTest,
+  Mo as ApyValue,
   S as AsideAlignAnchor,
   p as BorrowRateBlock,
   f as BorrowRateBlockTest,
@@ -82,90 +85,93 @@ export {
   s as ChartWithSideCardTest,
   g as DetailAsideScreenLayout,
   d as DetailedPageTitle,
-  vo as DetailedPageTitleTest,
+  Fo as DetailedPageTitleTest,
   k as DetailsView,
   B as DetailsViewLeftPane,
   A as DetailsViewManagePane,
-  qo as DetailsViewTest,
-  C as HealthFactorBlock,
+  Uo as DetailsViewTest,
+  y as HealthFactorBlock,
   L as HealthFactorBlockTest,
-  yo as HealthFactorValue,
-  w as HistoryChart,
-  No as HistoryChartTest,
-  V as InfoLine,
-  h as InfoList,
-  Fo as InfoListTest,
+  Vo as HealthFactorValue,
+  h as HistoryChart,
+  Wo as HistoryChartTest,
+  M as InfoLine,
+  V as InfoList,
+  Xo as InfoListTest,
   E as InfoPortalOut,
   q as InfoPortalProvider,
   D as InfoSectionTitle,
   N as LeverageInput,
-  Uo as LeverageInputTest,
-  Co as LeverageValue,
-  U as LiquidationParamsTable,
-  F as LiquidationParamsTableTest,
-  X as LiquidationPriceBlock,
-  W as LiquidationPriceBlockTest,
-  J as ManagePane,
-  K as ManagePaneActionTab,
-  Q as ManagePaneMessage,
-  Y as ManagePaneTab,
-  Z as ManagePaneTabDropdown,
-  Wo as ManagePaneTest,
-  re as MoreAccordion,
-  ee as MoreAccordionTest,
-  pe as NestedInfoStack,
-  ae as NestedInfoStackTest,
-  fe as PageHeadProvider,
-  ne as PageTitle,
-  Xo as PageTitleTest,
-  So as PnlValue,
+  Jo as LeverageInputTest,
+  U as LeveragePresetChips,
+  F as LeveragePresetChipsTest,
+  Do as LeverageValue,
+  X as LiquidationParamsTable,
+  W as LiquidationParamsTableTest,
+  Q as LiquidationPriceBlock,
+  J as LiquidationPriceBlockTest,
+  Z as ManagePane,
+  $ as ManagePaneActionTab,
+  ee as ManagePaneMessage,
+  oe as ManagePaneTab,
+  re as ManagePaneTabDropdown,
+  Qo as ManagePaneTest,
+  pe as MoreAccordion,
+  ae as MoreAccordionTest,
+  xe as NestedInfoStack,
+  fe as NestedInfoStackTest,
+  se as PageHeadProvider,
+  le as PageTitle,
+  Zo as PageTitleTest,
+  ko as PnlValue,
   H as PointsInfoLine,
-  go as PointsValue,
-  le as PoolApyBreakdownCard,
-  Te as PoolApyBreakdownCardTest,
-  ko as PositionShortLabel,
-  so as PositionShortLabelTest,
-  Ao as PositionTypeBadge,
-  Pe as ReviewButton,
-  Jo as ReviewButtonTest,
-  ue as SEGMENTED_TABS_INACTIVE_BUTTON_CLASS,
-  Ce as SPACE_HEIGHT,
-  Ie as SPACE_PX,
-  ce as SectionHeading,
-  Qo as SectionHeadingTest,
-  ke as SegmentedTabs,
-  Zo as SegmentedTabsTest,
-  Le as SideCard,
-  Ae as SideCardTest,
-  Me as Stack,
-  er as StackTest,
-  he as StatBadge,
-  De as StatBadgeGrid,
-  rr as StatBadgeTest,
-  ve as StickyBar,
-  ar as StickyBarTest,
-  Ne as StrategyApyBreakdownCard,
-  qe as StrategyApyBreakdownCardTest,
-  Fe as Tabber,
-  Ge as TabberSection,
-  pr as TabberTest,
-  Qe as TimeToLiquidationBlock,
-  Je as TimeToLiquidationBlockTest,
-  eo as TitleMeta,
-  Ze as TitleMetaTest,
-  ro as TokenAmount,
-  fr as TokenAmountTest,
-  Io as TokenBigint,
-  po as TokenPairSymbol,
-  ao as TokenPairSymbolTest,
-  xo as TokenPairTitle,
-  fo as TokenPairTitleTest,
+  Ao as PointsValue,
+  ce as PoolApyBreakdownCard,
+  Pe as PoolApyBreakdownCardTest,
+  Lo as PositionShortLabel,
+  co as PositionShortLabelTest,
+  yo as PositionStatusBadge,
+  ho as PositionTypeBadge,
+  ue as ReviewButton,
+  er as ReviewButtonTest,
+  be as SEGMENTED_TABS_INACTIVE_BUTTON_CLASS,
+  Me as SPACE_HEIGHT,
+  Ve as SPACE_PX,
+  Be as SectionHeading,
+  rr as SectionHeadingTest,
+  Le as SegmentedTabs,
+  ar as SegmentedTabsTest,
+  he as SideCard,
+  ye as SideCardTest,
+  He as Stack,
+  pr as StackTest,
+  Ee as StatBadge,
+  qe as StatBadgeGrid,
+  fr as StatBadgeTest,
+  Ne as StickyBar,
+  xr as StickyBarTest,
+  Ue as StrategyApyBreakdownCard,
+  Fe as StrategyApyBreakdownCardTest,
+  We as Tabber,
+  ze as TabberSection,
+  sr as TabberTest,
+  eo as TimeToLiquidationBlock,
+  Ze as TimeToLiquidationBlockTest,
+  ao as TitleMeta,
+  ro as TitleMetaTest,
+  po as TokenAmount,
+  dr as TokenAmountTest,
+  Ho as TokenBigint,
+  xo as TokenPairSymbol,
+  fo as TokenPairSymbolTest,
+  Po as TokenPairTitle,
+  so as TokenPairTitleTest,
   a as TokenSelectPanel,
-  wo as UsdValue,
-  Mo as UtilizationValue,
-  lo as ValueTest,
-  Vo as bps,
-  Ue as isTabber,
-  We as useDetailScrollSpy,
-  Xe as useTitleText
+  vo as UsdValue,
+  Eo as UtilizationValue,
+  go as ValueTest,
+  qo as bps,
+  Xe as isTabber,
+  Je as useDetailScrollSpy,
+  Qe as useTitleText
 };

package/dist/esm/components/base/info-list/info-list.js

@@ -13,16 +13,15 @@ import "../../../utils/z-index.js";
 import { PointsValue as l } from "../values/points-value.js";
 import "../../points-icon/points-icon.js";
 import "../../token-icon/token-icon.js";
-import "@fortawesome/free-solid-svg-icons";
-import "../../icons/fa-icon.js";
 import "../../tooltip/simple-tooltip.js";
 import "../../tooltip/tooltip.js";
 import "react-intl";
 import "../../badge/badge.js";
+import "../../badge/chip.js";
 import { Typography as u } from "../../typography/typography.js";
 import { VerticalIndicator as d } from "../../vertical-indicator/vertical-indicator.js";
 import { InfoListTest as i } from "./constants.js";
-function G({
+function F({
   children: t
 }) {
   return /* @__PURE__ */ r(c, { gap: "sm", "data-testid": i.root, children: t });
@@ -50,7 +49,7 @@ function g({
     }
   );
 }
-function H({
+function G({
   title: t
 }) {
   const o = n();
@@ -67,7 +66,7 @@ function H({
     }
   );
 }
-function J({
+function H({
   data: t,
   title: o = "components.yieldBreakdown.points"
 }) {
@@ -75,8 +74,8 @@ function J({
 }
 export {
   g as InfoLine,
-  G as InfoList,
+  F as InfoList,
   i as InfoListTest,
-  H as InfoSectionTitle,
-  J as PointsInfoLine
+  G as InfoSectionTitle,
+  H as PointsInfoLine
 };

package/dist/esm/components/base/leverage-input/leverage-input.js

@@ -54,7 +54,7 @@ function ee({
             {
               value: f,
               placeholder: "0",
-              label: `×${b(h)}`,
+              label: `${b(h)}x`,
               textButtonProps: {
                 className: "inline-flex items-center whitespace-nowrap"
               },

package/dist/esm/components/base/leverage-preset-chips/constants.js

@@ -0,0 +1,7 @@
+const e = {
+  root: "leverage-preset-chips-root",
+  chip: "leverage-preset-chips-chip"
+};
+export {
+  e as LeveragePresetChipsTest
+};

package/dist/esm/components/base/leverage-preset-chips/index.js

@@ -0,0 +1,6 @@
+import { LeveragePresetChipsTest as s } from "./constants.js";
+import { LeveragePresetChips as o } from "./leverage-preset-chips.js";
+export {
+  o as LeveragePresetChips,
+  s as LeveragePresetChipsTest
+};

package/dist/esm/components/base/leverage-preset-chips/leverage-preset-chips.js

@@ -0,0 +1,39 @@
+import { jsxs as n, jsx as m } from "react/jsx-runtime";
+import { SegmentedTabs as g } from "../segmented-tabs/segmented-tabs.js";
+import { FormattedMessageTyped as d } from "../../typed-intl/index.js";
+import { formatChipLeverage as l } from "../../../utils/leverage-presets.js";
+import { LeveragePresetChipsTest as s } from "./constants.js";
+function u({
+  options: e,
+  value: r,
+  onChange: a
+}) {
+  if (e.length === 0) return null;
+  const i = r != null && e.includes(r) ? String(r) : String(e[e.length - 1]);
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      className: "flex items-center gap-2",
+      "data-testid": s.root,
+      children: [
+        /* @__PURE__ */ m("span", { className: "text-sm text-muted-foreground", children: /* @__PURE__ */ m(d, { messageId: "components.leveragePresetChips.label" }) }),
+        /* @__PURE__ */ m(
+          g,
+          {
+            items: e.map((t) => ({
+              id: String(t),
+              item: `${l(t)}×`,
+              testId: s.chip
+            })),
+            activeTab: i,
+            onTabChange: (t) => a(Number(t))
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  u as LeveragePresetChips,
+  s as LeveragePresetChipsTest
+};