@sky-mavis/tanto-widget/dist/mjs/WidgetContent.mjs

Tanto Widget

import _styled from'@emotion/styled/base';import {jsx,jsxs}from'@emotion/react/jsx-runtime';import {useBalance}from'wagmi';import {ArrowLeftIcon}from'./assets/ArrowLeftIcon.mjs';import {SmoothHeight}from'./components/animated-containers/SmoothHeight.mjs';import {TransitionedView}from'./components/animated-containers/TransitionedView.mjs';import {Box}from'./components/box/Box.mjs';import {IconButton}from'./components/button/Button.mjs';import {CSSReset}from'./components/css-reset/CSSReset.mjs';import {WidgetConnectProvider}from'./contexts/widget-connect/WidgetConnectProvider.mjs';import {useWidgetRouter}from'./contexts/widget-router/useWidgetRouter.mjs';import {useAccount}from'./hooks/useAccount.mjs';import {Route}from'./types/route.mjs';function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
const ActionSection = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
  target: "e1ashkrp1"
} : {
  target: "e1ashkrp1",
  label: "ActionSection"
})(process.env.NODE_ENV === "production" ? {
  name: "ay38es",
  styles: "min-width:44px;width:44px"
} : {
  name: "ay38es",
  styles: "min-width:44px;width:44px/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIldpZGdldENvbnRlbnQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWFzQiIsImZpbGUiOiJXaWRnZXRDb250ZW50LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGpzeCBhcyBfanN4LCBqc3hzIGFzIF9qc3hzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0L2pzeC1ydW50aW1lXCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyB1c2VCYWxhbmNlIH0gZnJvbSAnd2FnbWknO1xuaW1wb3J0IHsgQXJyb3dMZWZ0SWNvbiB9IGZyb20gJy4vYXNzZXRzL0Fycm93TGVmdEljb24nO1xuaW1wb3J0IHsgU21vb3RoSGVpZ2h0IH0gZnJvbSAnLi9jb21wb25lbnRzL2FuaW1hdGVkLWNvbnRhaW5lcnMvU21vb3RoSGVpZ2h0JztcbmltcG9ydCB7IFRyYW5zaXRpb25lZFZpZXcgfSBmcm9tICcuL2NvbXBvbmVudHMvYW5pbWF0ZWQtY29udGFpbmVycy9UcmFuc2l0aW9uZWRWaWV3JztcbmltcG9ydCB7IEJveCB9IGZyb20gJy4vY29tcG9uZW50cy9ib3gvQm94JztcbmltcG9ydCB7IEljb25CdXR0b24gfSBmcm9tICcuL2NvbXBvbmVudHMvYnV0dG9uL0J1dHRvbic7XG5pbXBvcnQgeyBDU1NSZXNldCB9IGZyb20gJy4vY29tcG9uZW50cy9jc3MtcmVzZXQvQ1NTUmVzZXQnO1xuaW1wb3J0IHsgV2lkZ2V0Q29ubmVjdFByb3ZpZGVyIH0gZnJvbSAnLi9jb250ZXh0cy93aWRnZXQtY29ubmVjdC9XaWRnZXRDb25uZWN0UHJvdmlkZXInO1xuaW1wb3J0IHsgdXNlV2lkZ2V0Um91dGVyIH0gZnJvbSAnLi9jb250ZXh0cy93aWRnZXQtcm91dGVyL3VzZVdpZGdldFJvdXRlcic7XG5pbXBvcnQgeyB1c2VBY2NvdW50IH0gZnJvbSAnLi9ob29rcy91c2VBY2NvdW50JztcbmltcG9ydCB7IFJvdXRlIH0gZnJvbSAnLi90eXBlcy9yb3V0ZSc7XG5jb25zdCBBY3Rpb25TZWN0aW9uID0gc3R5bGVkLmRpdih7XG4gICAgbWluV2lkdGg6IDQ0LFxuICAgIHdpZHRoOiA0NCxcbn0pO1xuY29uc3QgVGl0bGUgPSBzdHlsZWQuZGl2KHtcbiAgICBmbGV4OiAxLFxuICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICBhbGlnbkl0ZW1zOiAnY2VudGVyJyxcbiAgICBmb250U2l6ZTogJzEuMjVlbScsXG4gICAgZm9udFdlaWdodDogNTAwLFxuICAgIHdvcmRCcmVhazogJ2JyZWFrLXdvcmQnLFxufSk7XG5leHBvcnQgZnVuY3Rpb24gV2lkZ2V0Q29udGVudCh7IGNsb3NlIH0pIHtcbiAgICBjb25zdCB7IHZpZXcsIGdvQmFjayB9ID0gdXNlV2lkZ2V0Um91dGVyKCk7XG4gICAgY29uc3QgeyBhZGRyZXNzLCBjaGFpbklkIH0gPSB1c2VBY2NvdW50KCk7XG4gICAgY29uc3QgaGVhZGVyTWFyZ2luQm90dG9tID0gKCgpID0+IHtcbiAgICAgICAgaWYgKHZpZXcucm91dGUgPT09IFJvdXRlLlBST0ZJTEUpXG4gICAgICAgICAgICByZXR1cm4gMzI7XG4gICAgICAgIGlmICh2aWV3LnNob3dCYWNrQnV0dG9uIHx8IGNsb3NlKVxuICAgICAgICAgICAgcmV0dXJuIDg7XG4gICAgICAgIGlmICghdmlldy5zaG93QmFja0J1dHRvbiAmJiAhY2xvc2UpXG4gICAgICAgICAgICByZXR1cm4gNjtcbiAgICAgICAgcmV0dXJuIDEyO1xuICAgIH0pKCk7XG4gICAgdXNlQmFsYW5jZSh7IGFkZHJlc3MsIGNoYWluSWQgfSk7XG4gICAgcmV0dXJuIChfanN4KENTU1Jlc2V0LCB7IGNoaWxkcmVuOiBfanN4cyhTbW9vdGhIZWlnaHQsIHsgY2hpbGRyZW46IFtfanN4cyhCb3gsIHsgYWxpZ246IFwic3RyZXRjaFwiLCBnYXA6IDgsIG1iOiBoZWFkZXJNYXJnaW5Cb3R0b20sIGNoaWxkcmVuOiBbX2pzeChBY3Rpb25TZWN0aW9uLCB7IGNoaWxkcmVuOiB2aWV3LnNob3dCYWNrQnV0dG9uICYmIChfanN4KEljb25CdXR0b24sIHsgXCJhcmlhLWxhYmVsXCI6IFwiQmFja1wiLCBpbnRlbnQ6IFwic2Vjb25kYXJ5XCIsIHZhcmlhbnQ6IFwicGxhaW5cIiwgaWNvbjogX2pzeChBcnJvd0xlZnRJY29uLCB7fSksIG9uQ2xpY2s6IGdvQmFjayB9KSkgfSksIF9qc3goVGl0bGUsIHsgY2hpbGRyZW46IHZpZXcudGl0bGUgfSksIF9qc3goQWN0aW9uU2VjdGlvbiwgeyBjaGlsZHJlbjogY2xvc2UgJiYgY2xvc2UgfSldIH0pLCBfanN4KFdpZGdldENvbm5lY3RQcm92aWRlciwgeyBjaGlsZHJlbjogX2pzeChUcmFuc2l0aW9uZWRWaWV3LCB7IHZpZXdLZXk6IHZpZXcucm91dGUsIGNoaWxkcmVuOiB2aWV3LmNvbnRlbnQgfSkgfSldIH0pIH0pKTtcbn1cbiJdfQ== */",
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
});
const Title = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
  target: "e1ashkrp0"
} : {
  target: "e1ashkrp0",
  label: "Title"
})(process.env.NODE_ENV === "production" ? {
  name: "cwh8up",
  styles: "flex:1;display:flex;align-items:center;font-size:1.25em;font-weight:500;word-break:break-word"
} : {
  name: "cwh8up",
  styles: "flex:1;display:flex;align-items:center;font-size:1.25em;font-weight:500;word-break:break-word/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIldpZGdldENvbnRlbnQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlCYyIsImZpbGUiOiJXaWRnZXRDb250ZW50LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGpzeCBhcyBfanN4LCBqc3hzIGFzIF9qc3hzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0L2pzeC1ydW50aW1lXCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyB1c2VCYWxhbmNlIH0gZnJvbSAnd2FnbWknO1xuaW1wb3J0IHsgQXJyb3dMZWZ0SWNvbiB9IGZyb20gJy4vYXNzZXRzL0Fycm93TGVmdEljb24nO1xuaW1wb3J0IHsgU21vb3RoSGVpZ2h0IH0gZnJvbSAnLi9jb21wb25lbnRzL2FuaW1hdGVkLWNvbnRhaW5lcnMvU21vb3RoSGVpZ2h0JztcbmltcG9ydCB7IFRyYW5zaXRpb25lZFZpZXcgfSBmcm9tICcuL2NvbXBvbmVudHMvYW5pbWF0ZWQtY29udGFpbmVycy9UcmFuc2l0aW9uZWRWaWV3JztcbmltcG9ydCB7IEJveCB9IGZyb20gJy4vY29tcG9uZW50cy9ib3gvQm94JztcbmltcG9ydCB7IEljb25CdXR0b24gfSBmcm9tICcuL2NvbXBvbmVudHMvYnV0dG9uL0J1dHRvbic7XG5pbXBvcnQgeyBDU1NSZXNldCB9IGZyb20gJy4vY29tcG9uZW50cy9jc3MtcmVzZXQvQ1NTUmVzZXQnO1xuaW1wb3J0IHsgV2lkZ2V0Q29ubmVjdFByb3ZpZGVyIH0gZnJvbSAnLi9jb250ZXh0cy93aWRnZXQtY29ubmVjdC9XaWRnZXRDb25uZWN0UHJvdmlkZXInO1xuaW1wb3J0IHsgdXNlV2lkZ2V0Um91dGVyIH0gZnJvbSAnLi9jb250ZXh0cy93aWRnZXQtcm91dGVyL3VzZVdpZGdldFJvdXRlcic7XG5pbXBvcnQgeyB1c2VBY2NvdW50IH0gZnJvbSAnLi9ob29rcy91c2VBY2NvdW50JztcbmltcG9ydCB7IFJvdXRlIH0gZnJvbSAnLi90eXBlcy9yb3V0ZSc7XG5jb25zdCBBY3Rpb25TZWN0aW9uID0gc3R5bGVkLmRpdih7XG4gICAgbWluV2lkdGg6IDQ0LFxuICAgIHdpZHRoOiA0NCxcbn0pO1xuY29uc3QgVGl0bGUgPSBzdHlsZWQuZGl2KHtcbiAgICBmbGV4OiAxLFxuICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICBhbGlnbkl0ZW1zOiAnY2VudGVyJyxcbiAgICBmb250U2l6ZTogJzEuMjVlbScsXG4gICAgZm9udFdlaWdodDogNTAwLFxuICAgIHdvcmRCcmVhazogJ2JyZWFrLXdvcmQnLFxufSk7XG5leHBvcnQgZnVuY3Rpb24gV2lkZ2V0Q29udGVudCh7IGNsb3NlIH0pIHtcbiAgICBjb25zdCB7IHZpZXcsIGdvQmFjayB9ID0gdXNlV2lkZ2V0Um91dGVyKCk7XG4gICAgY29uc3QgeyBhZGRyZXNzLCBjaGFpbklkIH0gPSB1c2VBY2NvdW50KCk7XG4gICAgY29uc3QgaGVhZGVyTWFyZ2luQm90dG9tID0gKCgpID0+IHtcbiAgICAgICAgaWYgKHZpZXcucm91dGUgPT09IFJvdXRlLlBST0ZJTEUpXG4gICAgICAgICAgICByZXR1cm4gMzI7XG4gICAgICAgIGlmICh2aWV3LnNob3dCYWNrQnV0dG9uIHx8IGNsb3NlKVxuICAgICAgICAgICAgcmV0dXJuIDg7XG4gICAgICAgIGlmICghdmlldy5zaG93QmFja0J1dHRvbiAmJiAhY2xvc2UpXG4gICAgICAgICAgICByZXR1cm4gNjtcbiAgICAgICAgcmV0dXJuIDEyO1xuICAgIH0pKCk7XG4gICAgdXNlQmFsYW5jZSh7IGFkZHJlc3MsIGNoYWluSWQgfSk7XG4gICAgcmV0dXJuIChfanN4KENTU1Jlc2V0LCB7IGNoaWxkcmVuOiBfanN4cyhTbW9vdGhIZWlnaHQsIHsgY2hpbGRyZW46IFtfanN4cyhCb3gsIHsgYWxpZ246IFwic3RyZXRjaFwiLCBnYXA6IDgsIG1iOiBoZWFkZXJNYXJnaW5Cb3R0b20sIGNoaWxkcmVuOiBbX2pzeChBY3Rpb25TZWN0aW9uLCB7IGNoaWxkcmVuOiB2aWV3LnNob3dCYWNrQnV0dG9uICYmIChfanN4KEljb25CdXR0b24sIHsgXCJhcmlhLWxhYmVsXCI6IFwiQmFja1wiLCBpbnRlbnQ6IFwic2Vjb25kYXJ5XCIsIHZhcmlhbnQ6IFwicGxhaW5cIiwgaWNvbjogX2pzeChBcnJvd0xlZnRJY29uLCB7fSksIG9uQ2xpY2s6IGdvQmFjayB9KSkgfSksIF9qc3goVGl0bGUsIHsgY2hpbGRyZW46IHZpZXcudGl0bGUgfSksIF9qc3goQWN0aW9uU2VjdGlvbiwgeyBjaGlsZHJlbjogY2xvc2UgJiYgY2xvc2UgfSldIH0pLCBfanN4KFdpZGdldENvbm5lY3RQcm92aWRlciwgeyBjaGlsZHJlbjogX2pzeChUcmFuc2l0aW9uZWRWaWV3LCB7IHZpZXdLZXk6IHZpZXcucm91dGUsIGNoaWxkcmVuOiB2aWV3LmNvbnRlbnQgfSkgfSldIH0pIH0pKTtcbn1cbiJdfQ== */",
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
});
function WidgetContent({
  close
}) {
  const {
    view,
    goBack
  } = useWidgetRouter();
  const {
    address,
    chainId
  } = useAccount();
  const headerMarginBottom = (() => {
    if (view.route === Route.PROFILE) return 32;
    if (view.showBackButton || close) return 8;
    if (!view.showBackButton && !close) return 6;
    return 12;
  })();
  useBalance({
    address,
    chainId
  });
  return jsx(CSSReset, {
    children: jsxs(SmoothHeight, {
      children: [jsxs(Box, {
        align: "stretch",
        gap: 8,
        mb: headerMarginBottom,
        children: [jsx(ActionSection, {
          children: view.showBackButton && jsx(IconButton, {
            "aria-label": "Back",
            intent: "secondary",
            variant: "plain",
            icon: jsx(ArrowLeftIcon, {}),
            onClick: goBack
          })
        }), jsx(Title, {
          children: view.title
        }), jsx(ActionSection, {
          children: close && close
        })]
      }), jsx(WidgetConnectProvider, {
        children: jsx(TransitionedView, {
          viewKey: view.route,
          children: view.content
        })
      })]
    })
  });
}export{WidgetContent};