@ape.swap/bonds-sdk 1.0.61 → 1.0.62

package/dist/components/uikit/Toggle/index.js

@@ -0,0 +1,63 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
+import { useState, useEffect, useRef, useCallback } from 'react';
+import { Box } from 'theme-ui';
+import { Button } from '../Button';
+import { sizes, togglePadding, fontSizes } from './types';
+import styles from './styles';
+import Text from '../Text';
+var isBrowser = typeof window === 'object';
+var Toggle = function (_a) {
+    var checked = _a.checked, labels = _a.labels, _b = _a.size, size = _b === void 0 ? sizes.MEDIUM : _b, className = _a.className, props = __rest(_a, ["checked", "labels", "size", "className"]);
+    var inputRef = useRef(null);
+    var leftRef = useRef(null);
+    var rightRef = useRef(null);
+    var _c = useState(checked), isChecked = _c[0], setIsChecked = _c[1];
+    var _d = useState({}), activeStyle = _d[0], setActiveStyle = _d[1];
+    var getActiveStyles = useCallback(function () {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        return isBrowser
+            ? {
+                width: ((_d = (_c = (_b = (_a = (isChecked && size ? rightRef : leftRef)) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect) === null || _c === void 0 ? void 0 : _c.call(_b)) === null || _d === void 0 ? void 0 : _d.width) || 'fit-content',
+                left: isChecked && (rightRef === null || rightRef === void 0 ? void 0 : rightRef.current)
+                    ? ((_g = (_f = (_e = rightRef === null || rightRef === void 0 ? void 0 : rightRef.current) === null || _e === void 0 ? void 0 : _e.getBoundingClientRect) === null || _f === void 0 ? void 0 : _f.call(_e)) === null || _g === void 0 ? void 0 : _g.x) -
+                        ((_l = (_k = (_j = (_h = rightRef === null || rightRef === void 0 ? void 0 : rightRef.current) === null || _h === void 0 ? void 0 : _h.parentNode) === null || _j === void 0 ? void 0 : _j.getBoundingClientRect) === null || _k === void 0 ? void 0 : _k.call(_j)) === null || _l === void 0 ? void 0 : _l.x)
+                    : 0,
+            }
+            : {
+                right: isChecked ? 0 : undefined,
+                left: isChecked ? undefined : 0,
+            };
+    }, [isChecked, size]);
+    useEffect(function () {
+        setActiveStyle(function () { return getActiveStyles(); });
+    }, [getActiveStyles]);
+    var handleClick = function () {
+        var _a;
+        setIsChecked(!isChecked);
+        (_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.click();
+    };
+    return (_jsxs(Box, __assign({ className: className, sx: styles.container }, { children: [_jsx(Box, __assign({ ref: leftRef, sx: __assign(__assign({}, styles.switch), { background: 'white3', color: 'primaryButtonDisable', px: togglePadding[size].x, py: togglePadding[size].y, fontSize: fontSizes[size] }), onClick: handleClick }, { children: _jsx(Text, __assign({ variant: "sm", sx: { fontSize: fontSizes[size] }, weight: "bold" }, { children: labels[0] })) })), _jsx(Box, __assign({ ref: rightRef, sx: __assign(__assign({}, styles.switch), { background: 'white3', color: 'primaryButtonDisable', px: togglePadding[size].x, py: togglePadding[size].y, fontSize: fontSizes[size] }), onClick: handleClick }, { children: _jsx(Text, __assign({ variant: "sm", sx: { fontSize: fontSizes[size] }, weight: "bold" }, { children: labels[1] })) })), _jsx(Button, __assign({ sx: __assign(__assign(__assign({}, styles.button), activeStyle), { fontSize: fontSizes[size], px: togglePadding[size].x, py: togglePadding[size].y }) }, { children: isChecked ? labels[1] : labels[0] })), _jsx("input", __assign({ type: "checkbox", ref: inputRef, checked: isChecked, "aria-hidden": "true", tabIndex: -1 }, props, { sx: styles.input }))] })));
+};
+export default Toggle;

package/dist/components/uikit/Toggle/styles.d.ts

@@ -0,0 +1,3 @@
+import { ThemeUIStyleObject } from 'theme-ui';
+declare const styles: Record<string, ThemeUIStyleObject>;
+export default styles;

package/dist/components/uikit/Toggle/styles.js

@@ -0,0 +1,39 @@
+var styles = {
+    container: {
+        display: 'flex',
+        borderRadius: '10px',
+        background: 'white3',
+        width: 'fit-content',
+        position: 'relative',
+        justifyItems: 'center',
+    },
+    switch: {
+        borderRadius: '10px',
+        px: '14px',
+        py: '9px',
+        cursor: 'pointer',
+        '&:hover': {
+            filter: '20%',
+        },
+    },
+    button: {
+        position: 'absolute',
+        border: 0,
+        top: 0,
+        height: '100%',
+        transition: 'left 0.2s linear',
+        textTransform: 'none',
+        '&:hover': {
+            filter: 'none',
+        },
+    },
+    input: {
+        bottom: 0,
+        left: 0,
+        position: 'absolute',
+        opacity: 0,
+        pointerEvents: 'none',
+        width: '100%',
+    },
+};
+export default styles;

package/dist/components/uikit/Toggle/types.d.ts

@@ -0,0 +1,31 @@
+import { InputHTMLAttributes } from 'react';
+export declare enum sizes {
+    SMALL = "sm",
+    MEDIUM = "md",
+    LARGE = "lg"
+}
+export declare const togglePadding: {
+    sm: {
+        x: number;
+        y: number;
+    };
+    md: {
+        x: number;
+        y: number;
+    };
+    lg: {
+        x: number;
+        y: number;
+    };
+};
+export declare const fontSizes: {
+    sm: number;
+    md: number;
+    lg: number;
+};
+export type sizeProps = `${sizes}`;
+export interface ToggleProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    checked?: boolean;
+    labels: [string, string];
+    size?: sizeProps;
+}

package/dist/components/uikit/Toggle/types.js

@@ -0,0 +1,17 @@
+var _a, _b;
+export var sizes;
+(function (sizes) {
+    sizes["SMALL"] = "sm";
+    sizes["MEDIUM"] = "md";
+    sizes["LARGE"] = "lg";
+})(sizes || (sizes = {}));
+export var togglePadding = (_a = {},
+    _a[sizes.SMALL] = { x: 4, y: 2 },
+    _a[sizes.MEDIUM] = { x: 6, y: 3 },
+    _a[sizes.LARGE] = { x: 8, y: 4 },
+    _a);
+export var fontSizes = (_b = {},
+    _b[sizes.SMALL] = 0,
+    _b[sizes.MEDIUM] = 1,
+    _b[sizes.LARGE] = 2,
+    _b);

package/dist/components/uikit/Tooltip/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TooltipProps } from './types';
+declare const TooltipBubble: React.FC<TooltipProps>;
+export default TooltipBubble;

package/dist/components/uikit/Tooltip/index.js

@@ -0,0 +1,66 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var _a;
+import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
+import { Box } from 'theme-ui';
+import { placements } from './types';
+import style, { container } from './styles';
+var placementStyles = (_a = {},
+    _a[placements.BOTTOMLEFT] = {
+        top: 'calc(100% + 15px)',
+        left: 0,
+    },
+    _a[placements.BOTTOMRIGHT] = {
+        top: 'calc(100% + 15px)',
+        right: 0,
+    },
+    _a[placements.TOPLEFT] = {
+        bottom: 'calc(100% + 15px)',
+        left: 0,
+    },
+    _a[placements.TOPRIGHT] = {
+        bottom: 'calc(100% + 15px)',
+        right: 0,
+    },
+    _a[placements.ONLYCONTAINERRIGHT] = {
+        top: 'calc(100% + 15px)',
+        right: 0,
+    },
+    _a);
+var TooltipBubble = function (_a) {
+    var width = _a.width, _b = _a.placement, placement = _b === void 0 ? placements.BOTTOMRIGHT : _b, body = _a.body, backgroundColor = _a.backgroundColor, hideTooltip = _a.hideTooltip, children = _a.children, transformTip = _a.transformTip, props = __rest(_a, ["width", "placement", "body", "backgroundColor", "hideTooltip", "children", "transformTip"]);
+    var backgroundColorStyle = backgroundColor
+        ? {
+            backgroundColor: backgroundColor,
+            '&:before': {
+                borderBottomColor: placement === placements.BOTTOMLEFT || placement === placements.BOTTOMRIGHT ? backgroundColor : undefined,
+                borderTopColor: placement === placements.TOPLEFT || placement === placements.TOPRIGHT ? backgroundColor : undefined,
+            },
+        }
+        : {};
+    var handleClick = function (event) {
+        event.stopPropagation();
+    };
+    return (_jsxs(Box, __assign({ sx: container(hideTooltip), onClick: handleClick }, { children: [_jsx(Box, __assign({ sx: __assign({ position: 'absolute' }, (placementStyles[placement] || {})) }, { children: _jsx(Box, __assign({ sx: __assign(__assign(__assign(__assign({ position: 'relative' }, style.default), style[placement]), backgroundColorStyle), { width: width, transform: transformTip }) }, props, { children: body })) })), children] })));
+};
+export default TooltipBubble;

package/dist/components/uikit/Tooltip/styles.d.ts

@@ -0,0 +1,4 @@
+import { ThemeUIStyleObject } from 'theme-ui';
+export declare const container: (hide?: boolean) => ThemeUIStyleObject;
+declare const styles: Record<string, ThemeUIStyleObject>;
+export default styles;

package/dist/components/uikit/Tooltip/styles.js

@@ -0,0 +1,60 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var baseStyle = {
+    p: 9,
+    borderRadius: 'normal',
+    background: 'white2',
+    width: 'max-content',
+    zIndex: 'modal',
+    boxShadow: "0px 0px 30px rgb(200,200,200, .4)",
+};
+var baseDirectionArrow = {
+    content: '""',
+    display: 'block',
+    width: 0,
+    border: '12px solid transparent',
+};
+var topArrow = __assign(__assign({ bottom: 0 }, baseDirectionArrow), { borderBottom: 0, borderTopWidth: '15px', borderTopStyle: 'solid', transform: 'translate(-50%, calc(100%))' });
+var bottomArrow = __assign(__assign({ top: 0 }, baseDirectionArrow), { borderTop: 0, borderBottomWidth: '15px', borderBottomStyle: 'solid', transform: 'translate(-50%, calc(-100%))' });
+export var container = function (hide) { return ({
+    position: 'relative',
+    display: 'inline-block',
+    '& > div:first-of-type': {
+        display: 'none',
+    },
+    '&:hover > div:first-of-type': {
+        display: hide ? 'none' : 'block',
+    },
+}); };
+var styles = {
+    default: __assign({ color: 'text', fontSize: 0, lineHeight: '18px', fontWeight: 'normal' }, baseStyle),
+    bottomRight: {
+        '&::before': __assign(__assign({ position: 'absolute' }, bottomArrow), { right: '3%', borderBottomColor: 'white2' }),
+    },
+    bottomLeft: {
+        '&::before': __assign(__assign({ position: 'absolute' }, bottomArrow), { left: 'calc(3% + 15px)', borderBottomColor: 'white2' }),
+    },
+    topRight: {
+        '&::before': __assign(__assign({ position: 'absolute' }, topArrow), { right: '3%', borderTopColor: 'white2' }),
+    },
+    topLeft: {
+        '&::before': __assign(__assign({ position: 'absolute' }, topArrow), { left: 'calc(3% + 15px)', borderTopColor: 'white2' }),
+    },
+    onlyContainerRight: {
+        '&::before': {
+            position: 'absolute',
+            right: '3%',
+            borderBottomColor: 'white2',
+        },
+    },
+};
+export default styles;

package/dist/components/uikit/Tooltip/types.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+import { BoxProps } from 'theme-ui';
+export declare enum placements {
+    TOPRIGHT = "topRight",
+    TOPLEFT = "topLeft",
+    BOTTOMRIGHT = "bottomRight",
+    BOTTOMLEFT = "bottomLeft",
+    ONLYCONTAINERRIGHT = "onlyContainerRight"
+}
+export type placementProps = `${placements}`;
+export interface TooltipProps extends BoxProps {
+    width?: string;
+    placement?: placementProps;
+    body: ReactNode;
+    hideTooltip?: boolean;
+    transformTip?: string;
+}

package/dist/components/uikit/Tooltip/types.js

@@ -0,0 +1,8 @@
+export var placements;
+(function (placements) {
+    placements["TOPRIGHT"] = "topRight";
+    placements["TOPLEFT"] = "topLeft";
+    placements["BOTTOMRIGHT"] = "bottomRight";
+    placements["BOTTOMLEFT"] = "bottomLeft";
+    placements["ONLYCONTAINERRIGHT"] = "onlyContainerRight";
+})(placements || (placements = {}));

package/dist/components/uikit/TutorialModal/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TModalProps } from './types';
+declare const TutorialModal: React.FC<TModalProps>;
+export default TutorialModal;

package/dist/components/uikit/TutorialModal/index.js

@@ -0,0 +1,52 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
+import { useState } from 'react';
+import { Box } from 'theme-ui';
+import { styles, dynamicStyles } from './styles';
+import { Button, Flex, Modal, Text } from '../../uikit';
+import { useIsAbond } from '../../../hooks/useIsAbond';
+var Circle = function (_a) {
+    var index = _a.index, goToStep = _a.goToStep, isActive = _a.isActive;
+    return (_jsx(Flex, { sx: dynamicStyles.allCircle({ isActive: isActive }), onClick: goToStep }, "circle-".concat(index)));
+};
+var TutorialModal = function (_a) {
+    var type = _a.type, title = _a.title, description = _a.description, children = _a.children, onDismiss = _a.onDismiss, t = _a.t, isConnected = _a.isConnected;
+    var _b = useState(0), step = _b[0], setStep = _b[1];
+    var slideNumber = isConnected ? step + 1 : step;
+    var isAbond = useIsAbond();
+    var handleNext = function () {
+        setStep(step + 1);
+    };
+    var renderChildren = function () {
+        return children === null || children === void 0 ? void 0 : children.map(function (element, i) { return (_jsx(Flex, { children: step === i && (_jsx(Flex, __assign({ sx: { width: '100%', flexWrap: 'wrap', mt: ['15px', '15px', '15px', '30px'] } }, { children: element }))) }, i)); });
+    };
+    var renderDots = function () {
+        return __spreadArray([], Array(children === null || children === void 0 ? void 0 : children.length), true).map(function (_, index) { return (_jsx(Circle, { index: index, goToStep: function () { return setStep(index); }, isActive: index === step }, index)); });
+    };
+    return (_jsx(Modal, __assign({ zIndex: 101, onDismiss: onDismiss, sx: {
+            width: ['280px', '280px', '280px', '873px'],
+            minWidth: ['280px', '280px', '280px', '873px'],
+            height: ['', '', '', '500px'],
+            overflow: 'visible',
+        } }, { children: _jsxs(Flex, __assign({ className: "tutorial-modal", sx: styles.modalCon }, { children: [_jsx(Flex, __assign({ width: 22, onClick: onDismiss, sx: { cursor: 'pointer', position: 'absolute', right: '20px' } }, { children: _jsx(Text, { children: "x" }) })), _jsxs(Flex, __assign({ sx: styles.contentBody }, { children: [_jsx(Box, { sx: dynamicStyles.showApe({ slideNumber: slideNumber, type: type, isAbond: isAbond }) }), _jsxs(Flex, __assign({ sx: __assign(__assign({}, styles.rightCon), { maxWidth: ['', '', '', '55%'] }) }, { children: [_jsxs(Flex, __assign({ sx: styles.right }, { children: [_jsxs(Flex, __assign({ sx: styles.modalHeader }, { children: [_jsx(Text, __assign({ sx: styles.title }, { children: t("".concat(title)) })), _jsx(Text, __assign({ sx: styles.description }, { children: t("".concat(description)) }))] })), renderChildren()] })), _jsxs(Flex, __assign({ sx: __assign(__assign({}, styles.modalFooter), { alignItems: ['center', 'center', 'center', 'flex-start'] }) }, { children: [_jsx(Flex, __assign({ sx: styles.circles }, { children: renderDots() })), _jsx(Button, __assign({ onClick: step >= ((children === null || children === void 0 ? void 0 : children.length) || 0) - 1 ? onDismiss : handleNext, sx: styles.readyBtn }, { children: step >= ((children === null || children === void 0 ? void 0 : children.length) || 0) - 1 ? t("I'm Ready") : t('Next') }))] }))] }))] }))] })) })));
+};
+export default TutorialModal;

package/dist/components/uikit/TutorialModal/styles.d.ts

@@ -0,0 +1,8 @@
+import { ThemeUIStyleObject } from 'theme-ui';
+export declare const dynamicStyles: Record<'showApe' | 'allCircle', (props: {
+    slideNumber?: number;
+    type?: string;
+    isActive?: boolean;
+    isAbond?: boolean;
+}) => ThemeUIStyleObject>;
+export declare const styles: Record<'modalCon' | 'contentBody' | 'rightCon' | 'right' | 'modalHeader' | 'title' | 'description' | 'circles' | 'readyBtn' | 'modalFooter', ThemeUIStyleObject>;

package/dist/components/uikit/TutorialModal/styles.js

@@ -0,0 +1,86 @@
+export var dynamicStyles = {
+    showApe: function (_a) {
+        var slideNumber = _a.slideNumber, type = _a.type, isAbond = _a.isAbond;
+        return ({
+            alignSelf: ['center', 'center', ''],
+            width: ['200px', '200px', '200px', '340px'],
+            height: ['200px', '200px', '200px', '340px'],
+            background: isAbond
+                ? "url(images/tutorial-modals/abond/".concat(type, "-").concat(slideNumber, ".svg)")
+                : "url(images/tutorial-modals/".concat(type, "-").concat(slideNumber, ".svg)"),
+            backgroundRepeat: 'no-repeat',
+            backgroundPosition: 'center',
+            backgroundSize: 'cover',
+        });
+    },
+    allCircle: function (_a) {
+        var isActive = _a.isActive;
+        return ({
+            width: '8px',
+            height: '8px',
+            background: isActive ? 'home.title' : 'white4',
+            borderRadius: '50%',
+            mr: '10px',
+            cursor: 'pointer',
+            '&.last-child': {
+                mr: 0,
+            },
+        });
+    },
+};
+export var styles = {
+    modalCon: {
+        height: '100%',
+    },
+    contentBody: {
+        flexDirection: ['column', 'column', 'column', 'row'],
+        width: '100%',
+        alignItems: 'center',
+        height: '100%',
+        justifyContent: ['', '', '', 'space-between'],
+    },
+    rightCon: {
+        width: '100%',
+        flexDirection: 'column',
+        flex: 1,
+        mr: ['', '', '', '10px'],
+    },
+    right: {
+        flexDirection: 'column',
+        height: '100%',
+        minHeight: '270px',
+    },
+    modalHeader: {
+        flexDirection: ['column'],
+    },
+    title: {
+        fontWeight: 700,
+        fontSize: ['18px', '18px', '18px', '24px'],
+        lineHeight: ['22px', '22px', '22px', '36px'],
+        textTransform: ['capitalize', 'capitalize', 'capitalize', 'uppercase'],
+        mt: ['10px'],
+    },
+    description: {
+        fontWeight: 400,
+        fontSize: '12px',
+        lineHeight: '18px',
+        textTransform: 'none',
+        opacity: 0.5,
+        mt: ['7px', '7px', '7px', 0],
+    },
+    circles: {
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        padding: ['8px', '8px', '8px', '8px 8px 8px 0px'],
+    },
+    readyBtn: {
+        mt: '10px',
+        textTransform: 'uppercase',
+        height: '40px',
+        width: ['100%', '100%', '100%', '240px'],
+    },
+    modalFooter: {
+        flexDirection: 'column',
+        justifyContent: 'center',
+    },
+};

package/dist/components/uikit/TutorialModal/types.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+export type ActionHandler = () => void;
+export interface TModalProps {
+    t: (key: string) => string;
+    onDismiss: ActionHandler;
+    type: string;
+    title: string;
+    description?: string;
+    children: React.ReactNode[];
+    isConnected: boolean;
+    width?: string;
+}
+export interface CountProps {
+    index: number;
+    goToStep: ActionHandler;
+    isActive: boolean;
+}
+export interface ShowApeType {
+    slideNumber?: number;
+    type?: string;
+    isAbond?: boolean;
+}

package/dist/components/uikit/TutorialModal/types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/uikit/TutorialModal/useTutorialModal.d.ts

@@ -0,0 +1,6 @@
+import { TModalProps } from './types';
+interface ReturnType {
+    onPresentTutorialModal: () => void;
+}
+declare const useTutorialModal: ({ type, children, title, description, onDismiss, t, isConnected, width, }: TModalProps) => ReturnType;
+export default useTutorialModal;

package/dist/components/uikit/TutorialModal/useTutorialModal.js

@@ -0,0 +1,20 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "theme-ui/jsx-runtime";
+import useModal from '../../../hooks/useModal';
+import TutorialModal from '.';
+var useTutorialModal = function (_a) {
+    var type = _a.type, children = _a.children, title = _a.title, description = _a.description, onDismiss = _a.onDismiss, t = _a.t, isConnected = _a.isConnected, width = _a.width;
+    var onPresentTutorialModal = useModal(_jsx(TutorialModal, __assign({ type: type, title: title, description: description, onDismiss: onDismiss, t: t, isConnected: isConnected, width: width }, { children: children })), true, false, 'TutorialModal')[0];
+    return { onPresentTutorialModal: onPresentTutorialModal };
+};
+export default useTutorialModal;

package/dist/components/uikit/index.d.ts

@@ -0,0 +1,18 @@
+export { default as Svg } from './Svg';
+export { default as Flex } from './Flex';
+export { default as Text } from './Text';
+export { default as Skeleton } from './Skeleton';
+export { default as Modal } from './Modal';
+export { default as CheckBox } from './Checkbox';
+export { default as Tooltip } from './Tooltip';
+export { default as TutorialModal } from './TutorialModal';
+export { default as Spinner } from './Spinner';
+export { default as Link } from './Link';
+export { default as Toggle } from './Toggle';
+export { default as SwiperDots } from './SwiperDots';
+export { Button, IconButton } from './Button';
+export { Select, SelectItem } from './Select';
+export { NumericInput, Input, StyledInput } from './Input';
+export { Tabs, Tab } from './Tabs';
+export { Tag, ListTag } from './Tag';
+export { Dropdown, DropdownItem } from './Dropdown';

package/dist/components/uikit/index.js

@@ -0,0 +1,20 @@
+// Defaults
+export { default as Svg } from './Svg';
+export { default as Flex } from './Flex';
+export { default as Text } from './Text';
+export { default as Skeleton } from './Skeleton';
+export { default as Modal } from './Modal';
+export { default as CheckBox } from './Checkbox';
+export { default as Tooltip } from './Tooltip';
+export { default as TutorialModal } from './TutorialModal';
+export { default as Spinner } from './Spinner';
+export { default as Link } from './Link';
+export { default as Toggle } from './Toggle';
+export { default as SwiperDots } from './SwiperDots';
+// Exports
+export { Button, IconButton } from './Button';
+export { Select, SelectItem } from './Select';
+export { NumericInput, Input, StyledInput } from './Input';
+export { Tabs, Tab } from './Tabs';
+export { Tag, ListTag } from './Tag';
+export { Dropdown, DropdownItem } from './Dropdown';

package/dist/contexts/ModalContext.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+interface ModalsContext {
+    nodeId: string[];
+    modalNode: React.ReactNode[];
+    setModalNode: React.Dispatch<React.SetStateAction<React.ReactNode[]>>;
+    onPresent: (node: React.ReactNode, newNodeId: string, clearModalStack: boolean) => void;
+    handleClose: () => void;
+    setCloseOnOverlayClick: React.Dispatch<React.SetStateAction<boolean>>;
+}
+export declare const Context: React.Context<ModalsContext>;
+declare const ModalProvider: ({ children }: {
+    children: React.ReactNode;
+}) => React.JSX.Element;
+export default ModalProvider;