@dfx.swiss/react-components 1.0.1 → 1.0.2-beta.2

package/dist/stories/StyledCheckboxRow.d.ts

@@ -0,0 +1,15 @@
+import { PropsWithChildren } from 'react';
+export interface StyledCheckboxRowProps extends PropsWithChildren {
+    darkTheme?: boolean;
+    onChange: (isChecked: boolean) => any;
+    isChecked?: boolean;
+    withBackground?: boolean;
+    centered?: boolean;
+    textSize?: StyledCheckboxRowTextSize;
+}
+export declare enum StyledCheckboxRowTextSize {
+    SM = "SM",
+    MD = "MD"
+}
+export default function StyledCheckboxRow({ darkTheme, withBackground, children, onChange, centered, isChecked, textSize, }: StyledCheckboxRowProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledCheckboxRow.d.ts.map

package/dist/stories/StyledCheckboxRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledCheckboxRow.d.ts","sourceRoot":"","sources":["../../src/stories/StyledCheckboxRow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG1C,MAAM,WAAW,sBAAuB,SAAQ,iBAAiB;IAC/D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,GAAG,CAAC;IACtC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,yBAAyB,CAAC;CACtC;AAED,oBAAY,yBAAyB;IACnC,EAAE,OAAO;IACT,EAAE,OAAO;CACV;AAYD,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,SAAS,EACT,cAAc,EACd,QAAQ,EACR,QAAQ,EACR,QAAgB,EAChB,SAAiB,EACjB,QAAuC,GACxC,EAAE,sBAAsB,2CAwBxB"}

package/dist/stories/StyledCheckboxRow.js

@@ -0,0 +1,37 @@
+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 _a;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import DfxIcon, { IconVariant, IconSize } from './DfxIcon';
+export var StyledCheckboxRowTextSize;
+(function (StyledCheckboxRowTextSize) {
+    StyledCheckboxRowTextSize["SM"] = "SM";
+    StyledCheckboxRowTextSize["MD"] = "MD";
+})(StyledCheckboxRowTextSize || (StyledCheckboxRowTextSize = {}));
+var CHECKBOX_SIZE_MAPS = (_a = {},
+    _a[StyledCheckboxRowTextSize.SM] = { textClasses: 'text-sm', iconSize: IconSize.MD },
+    _a[StyledCheckboxRowTextSize.MD] = { textClasses: '', iconSize: IconSize.LG },
+    _a);
+export default function StyledCheckboxRow(_a) {
+    var darkTheme = _a.darkTheme, withBackground = _a.withBackground, children = _a.children, onChange = _a.onChange, _b = _a.centered, centered = _b === void 0 ? false : _b, _c = _a.isChecked, isChecked = _c === void 0 ? false : _c, _d = _a.textSize, textSize = _d === void 0 ? StyledCheckboxRowTextSize.MD : _d;
+    function changeCheckbox(checkBoxState) {
+        onChange === null || onChange === void 0 ? void 0 : onChange(checkBoxState);
+    }
+    var textClasses = CHECKBOX_SIZE_MAPS[textSize].textClasses;
+    textClasses += darkTheme ? ' text-white' : ' text-dfxBlue-800';
+    var wrapperClasses = 'flex gap-4 rounded';
+    wrapperClasses += centered ? ' justify-center ' : ' justify-start ';
+    if (withBackground)
+        wrapperClasses += darkTheme ? ' bg-dfxRed-100/10 p-3' : ' bg-dfxGray-400 p-3';
+    return (_jsxs("div", __assign({ className: wrapperClasses, onClick: function () { return changeCheckbox(!isChecked); } }, { children: [_jsx("div", __assign({ className: "shrink-0" }, { children: _jsx(DfxIcon, { icon: isChecked ? IconVariant.CHECKBOX_CHECKED : IconVariant.CHECKBOX_EMPTY, size: CHECKBOX_SIZE_MAPS[textSize].iconSize }) })), _jsx("p", __assign({ className: textClasses }, { children: children }))] })));
+}
+//# sourceMappingURL=StyledCheckboxRow.js.map

package/dist/stories/StyledCheckboxRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledCheckboxRow.js","sourceRoot":"","sources":["../../src/stories/StyledCheckboxRow.tsx"],"names":[],"mappings":";;;;;;;;;;;;;AACA,OAAO,OAAO,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAW3D,MAAM,CAAN,IAAY,yBAGX;AAHD,WAAY,yBAAyB;IACnC,sCAAS,CAAA;IACT,sCAAS,CAAA;AACX,CAAC,EAHW,yBAAyB,KAAzB,yBAAyB,QAGpC;AAOD,IAAM,kBAAkB;IACtB,GAAC,yBAAyB,CAAC,EAAE,IAAG,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,EAAE;IACjF,GAAC,yBAAyB,CAAC,EAAE,IAAG,EAAE,WAAW,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,EAAE;OAC3E,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EAQjB;QAPvB,SAAS,eAAA,EACT,cAAc,oBAAA,EACd,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAChB,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,gBAAuC,EAAvC,QAAQ,mBAAG,yBAAyB,CAAC,EAAE,KAAA;IAEvC,SAAS,cAAc,CAAC,aAAsB;QAC5C,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,aAAa,CAAC,CAAC;IAC5B,CAAC;IAED,IAAI,WAAW,GAAG,kBAAkB,CAAC,QAAQ,CAAC,CAAC,WAAW,CAAC;IAC3D,WAAW,IAAI,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,mBAAmB,CAAC;IAE/D,IAAI,cAAc,GAAG,oBAAoB,CAAC;IAC1C,cAAc,IAAI,QAAQ,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,iBAAiB,CAAC;IAEpE,IAAI,cAAc;QAAE,cAAc,IAAI,SAAS,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,qBAAqB,CAAC;IAElG,OAAO,CACL,wBAAK,SAAS,EAAE,cAAc,EAAE,OAAO,EAAE,cAAM,OAAA,cAAc,CAAC,CAAC,SAAS,CAAC,EAA1B,CAA0B,iBACvE,uBAAK,SAAS,EAAC,UAAU,gBACvB,KAAC,OAAO,IACN,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC,CAAC,WAAW,CAAC,cAAc,EAC3E,IAAI,EAAE,kBAAkB,CAAC,QAAQ,CAAC,CAAC,QAAQ,GAC3C,IACE,EACN,qBAAG,SAAS,EAAE,WAAW,gBAAG,QAAQ,IAAK,KACrC,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/StyledCoinList.d.ts

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from 'react';
+export interface StyledCoinListProps extends PropsWithChildren {
+    heading: string;
+}
+export default function StyledCoinList({ heading, children }: StyledCoinListProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledCoinList.d.ts.map

package/dist/stories/StyledCoinList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledCoinList.d.ts","sourceRoot":"","sources":["../../src/stories/StyledCoinList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE1C,MAAM,WAAW,mBAAoB,SAAQ,iBAAiB;IAC5D,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,mBAAmB,2CAOhF"}

package/dist/stories/StyledCoinList.js

@@ -0,0 +1,17 @@
+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, jsxs as _jsxs } from "react/jsx-runtime";
+export default function StyledCoinList(_a) {
+    var heading = _a.heading, children = _a.children;
+    return (_jsxs("div", __assign({ className: "mb-6 last:mb-0" }, { children: [_jsx("h3", __assign({ className: "text-dfxBlue-800 text-sm border-b border-dfxGray-400" }, { children: heading })), _jsx("div", __assign({ className: "grid gap-4 grid-cols-3 md:grid-cols-4 lg:grid-cols-5 my-3" }, { children: children }))] })));
+}
+//# sourceMappingURL=StyledCoinList.js.map

package/dist/stories/StyledCoinList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledCoinList.js","sourceRoot":"","sources":["../../src/stories/StyledCoinList.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAMA,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAA0C;QAAxC,OAAO,aAAA,EAAE,QAAQ,cAAA;IACxD,OAAO,CACL,wBAAK,SAAS,EAAC,gBAAgB,iBAC7B,sBAAI,SAAS,EAAC,sDAAsD,gBAAE,OAAO,IAAM,EACnF,uBAAK,SAAS,EAAC,2DAA2D,gBAAE,QAAQ,IAAO,KACvF,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/StyledCoinListItem.d.ts

@@ -0,0 +1,14 @@
+import { Asset } from '../definitions/asset';
+export interface StyledCoinListItemProps {
+    asset: Asset;
+    isToken: boolean;
+    disabled?: boolean;
+    onClick?: () => void;
+    protocol: string;
+    popupLabel?: string;
+    onAdd?: (svgData: string) => void;
+    alwaysShowDots?: boolean;
+    copy?: (value: string) => void;
+}
+export default function StyledCoinListItem({ asset, isToken, onClick, protocol, disabled, popupLabel, onAdd, alwaysShowDots, copy, }: StyledCoinListItemProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledCoinListItem.d.ts.map

package/dist/stories/StyledCoinListItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledCoinListItem.d.ts","sourceRoot":"","sources":["../../src/stories/StyledCoinListItem.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE7C,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAChC;AAED,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EACzC,KAAK,EACL,OAAO,EACP,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,KAAK,EACL,cAAc,EACd,IAAI,GACL,EAAE,uBAAuB,2CAuGzB"}

package/dist/stories/StyledCoinListItem.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);
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import DfxAssetIcon from './DfxAssetIcon';
+import DfxIcon, { IconColor, IconVariant } from './DfxIcon';
+import StyledHorizontalStack from './layout-helpers/StyledHorizontalStack';
+import StyledVerticalStack from './layout-helpers/StyledVerticalStack';
+import StyledIconButton from './StyledIconButton';
+import { useFloating, offset, flip, shift, useDismiss, useInteractions } from '@floating-ui/react';
+import { renderToString } from 'react-dom/server';
+import { useState } from 'react';
+import { CopyButton } from './CopyButton';
+export default function StyledCoinListItem(_a) {
+    var _b, _c, _d;
+    var asset = _a.asset, isToken = _a.isToken, onClick = _a.onClick, protocol = _a.protocol, disabled = _a.disabled, popupLabel = _a.popupLabel, onAdd = _a.onAdd, alwaysShowDots = _a.alwaysShowDots, copy = _a.copy;
+    var _e = useState(false), open = _e[0], setOpen = _e[1];
+    var _f = useFloating({
+        open: open,
+        placement: 'bottom-start',
+        middleware: [offset(12), flip(), shift()],
+        onOpenChange: setOpen,
+    }), x = _f.x, y = _f.y, strategy = _f.strategy, refs = _f.refs, context = _f.context;
+    var dismiss = useDismiss(context, { outsidePress: true });
+    var _g = useInteractions([dismiss]), getReferenceProps = _g.getReferenceProps, getFloatingProps = _g.getFloatingProps;
+    var name = asset.comingSoon ? 'Coming soon' : asset.description;
+    var buttonClasses = 'flex gap-2 rounded-l px-3 py-2 z-10 flex-1';
+    var wrapperClasses = 'group flex rounded place-self-start';
+    var threeDotsClasses = ' rounded-r grow-0';
+    if (!(disabled || asset.comingSoon)) {
+        buttonClasses += ' active:bg-dfxGray-400/80';
+    }
+    if (!asset.comingSoon) {
+        wrapperClasses += ' hover:bg-dfxGray-400/50 focus:bg-dfxGray-400/50 ';
+        threeDotsClasses += ' group-hover:visible active:bg-dfxGray-500';
+        if (open) {
+            threeDotsClasses += ' bg-dfxGray-500 visible';
+            wrapperClasses += ' bg-dfxGray-400/50';
+        }
+        else {
+            if (!alwaysShowDots)
+                threeDotsClasses += ' invisible hover:bg-dfxGray-400/90';
+        }
+    }
+    else {
+        threeDotsClasses += ' invisible';
+    }
+    return (_jsxs(_Fragment, { children: [_jsxs("div", __assign({ className: wrapperClasses }, { children: [_jsxs("button", __assign({ ref: refs.setReference, type: "button", onClick: onClick, className: buttonClasses, disabled: disabled || asset.comingSoon }, getReferenceProps(), { children: [_jsx("div", __assign({ className: "self-center" }, { children: _jsx(DfxAssetIcon, { asset: asset.name, disabled: asset.comingSoon }) })), _jsxs("div", __assign({ className: "flex-col text-dfxBlue-800 text-left" }, { children: [_jsxs("div", __assign({ className: "flex font-semibold gap-1 " }, { children: [_jsx("h4", __assign({ className: "leading-none" }, { children: asset.name })), isToken && _jsx("span", __assign({ className: "self-start leading-none text-2xs shrink-0" }, { children: protocol }))] })), _jsx("span", __assign({ className: "text-dfxGray-800 text-xs leading-none relative -top-1" }, { children: name }))] }))] })), popupLabel && onAdd && isToken && asset.chainId && (_jsx("button", __assign({ className: threeDotsClasses, onClick: function () { return setOpen(function (o) { return !o; }); } }, { children: _jsx(DfxIcon, { icon: IconVariant.THREE_DOTS_VERT, color: IconColor.BLUE }) })))] })), open && (_jsx("div", __assign({ ref: refs.setFloating, style: {
+                    position: strategy,
+                    top: y !== null && y !== void 0 ? y : 0,
+                    left: x !== null && x !== void 0 ? x : 0,
+                    width: 'max-content',
+                } }, getFloatingProps(), { className: "bg-white z-20 rounded shadow-xl text-sm border border-dfxGray-600/20 p-4 max-w-sm text-dfxBlue-800" }, { children: _jsxs(StyledVerticalStack, __assign({ gap: 4 }, { children: [_jsx("h4", __assign({ className: "font-bold" }, { children: asset.description })), _jsxs(StyledHorizontalStack, __assign({ spanAcross: true }, { children: [_jsx("span", __assign({ className: "font-bold" }, { children: "Contract" })), _jsxs(StyledHorizontalStack, __assign({ gap: 2 }, { children: [_jsx("span", __assign({ className: "font-bold" }, { children: "".concat((_b = asset.chainId) === null || _b === void 0 ? void 0 : _b.substring(0, 5), "...").concat((_c = asset.chainId) === null || _c === void 0 ? void 0 : _c.substring(((_d = asset.chainId) === null || _d === void 0 ? void 0 : _d.length) - 5)) })), _jsx(CopyButton, { onCopy: function () { var _a; return copy === null || copy === void 0 ? void 0 : copy((_a = asset.chainId) !== null && _a !== void 0 ? _a : ''); } }), asset.chainId && onAdd && (_jsx(StyledIconButton, { icon: IconVariant.METAMASK_LOGO, onClick: function () { return onAdd(renderToString(_jsx(DfxAssetIcon, { asset: asset.name }))); } })), asset.explorerUrl && (_jsx(StyledIconButton, { icon: IconVariant.OPEN_IN_NEW, onClick: function () { return window.open(asset.explorerUrl, '_blank'); } }))] }))] })), _jsx("p", __assign({ className: "text-dfxGray-700 text-xs" }, { children: popupLabel }))] })) })))] }));
+}
+//# sourceMappingURL=StyledCoinListItem.js.map

package/dist/stories/StyledCoinListItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledCoinListItem.js","sourceRoot":"","sources":["../../src/stories/StyledCoinListItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,YAAkC,MAAM,gBAAgB,CAAC;AAChE,OAAO,OAAO,EAAE,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAC5D,OAAO,qBAAqB,MAAM,wCAAwC,CAAC;AAC3E,OAAO,mBAAmB,MAAM,sCAAsC,CAAC;AACvE,OAAO,gBAAgB,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACnG,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAe1C,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EAUjB;;QATxB,KAAK,WAAA,EACL,OAAO,aAAA,EACP,OAAO,aAAA,EACP,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,KAAK,WAAA,EACL,cAAc,oBAAA,EACd,IAAI,UAAA;IAEE,IAAA,KAAkB,QAAQ,CAAC,KAAK,CAAC,EAAhC,IAAI,QAAA,EAAE,OAAO,QAAmB,CAAC;IAClC,IAAA,KAAoC,WAAW,CAAC;QACpD,IAAI,MAAA;QACJ,SAAS,EAAE,cAAc;QACzB,UAAU,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,CAAC;QACzC,YAAY,EAAE,OAAO;KACtB,CAAC,EALM,CAAC,OAAA,EAAE,CAAC,OAAA,EAAE,QAAQ,cAAA,EAAE,IAAI,UAAA,EAAE,OAAO,aAKnC,CAAC;IACH,IAAM,OAAO,GAAG,UAAU,CAAC,OAAO,EAAE,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC,CAAC;IACtD,IAAA,KAA0C,eAAe,CAAC,CAAC,OAAO,CAAC,CAAC,EAAlE,iBAAiB,uBAAA,EAAE,gBAAgB,sBAA+B,CAAC;IAE3E,IAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,WAAW,CAAC;IAClE,IAAI,aAAa,GAAG,4CAA4C,CAAC;IACjE,IAAI,cAAc,GAAG,qCAAqC,CAAC;IAC3D,IAAI,gBAAgB,GAAG,mBAAmB,CAAC;IAE3C,IAAI,CAAC,CAAC,QAAQ,IAAI,KAAK,CAAC,UAAU,CAAC,EAAE;QACnC,aAAa,IAAI,2BAA2B,CAAC;KAC9C;IAED,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE;QACrB,cAAc,IAAI,mDAAmD,CAAC;QACtE,gBAAgB,IAAI,4CAA4C,CAAC;QACjE,IAAI,IAAI,EAAE;YACR,gBAAgB,IAAI,yBAAyB,CAAC;YAC9C,cAAc,IAAI,oBAAoB,CAAC;SACxC;aAAM;YACL,IAAI,CAAC,cAAc;gBAAE,gBAAgB,IAAI,oCAAoC,CAAC;SAC/E;KACF;SAAM;QACL,gBAAgB,IAAI,YAAY,CAAC;KAClC;IAED,OAAO,CACL,8BACE,wBAAK,SAAS,EAAE,cAAc,iBAC5B,2BACE,GAAG,EAAE,IAAI,CAAC,YAAY,EACtB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,aAAa,EACxB,QAAQ,EAAE,QAAQ,IAAI,KAAK,CAAC,UAAU,IAClC,iBAAiB,EAAE,eAEvB,uBAAK,SAAS,EAAC,aAAa,gBAC1B,KAAC,YAAY,IAAC,KAAK,EAAE,KAAK,CAAC,IAAwB,EAAE,QAAQ,EAAE,KAAK,CAAC,UAAU,GAAI,IAC/E,EACN,wBAAK,SAAS,EAAC,qCAAqC,iBAClD,wBAAK,SAAS,EAAC,2BAA2B,iBACxC,sBAAI,SAAS,EAAC,cAAc,gBAAE,KAAK,CAAC,IAAI,IAAM,EAC7C,OAAO,IAAI,wBAAM,SAAS,EAAC,2CAA2C,gBAAE,QAAQ,IAAQ,KACrF,EACN,wBAAM,SAAS,EAAC,uDAAuD,gBAAE,IAAI,IAAQ,KACjF,KACC,EACR,UAAU,IAAI,KAAK,IAAI,OAAO,IAAI,KAAK,CAAC,OAAO,IAAI,CAClD,0BAAQ,SAAS,EAAE,gBAAgB,EAAE,OAAO,EAAE,cAAM,OAAA,OAAO,CAAC,UAAC,CAAC,IAAK,OAAA,CAAC,CAAC,EAAF,CAAE,CAAC,EAAlB,CAAkB,gBACpE,KAAC,OAAO,IAAC,IAAI,EAAE,WAAW,CAAC,eAAe,EAAE,KAAK,EAAE,SAAS,CAAC,IAAI,GAAI,IAC9D,CACV,KACG,EACL,IAAI,IAAI,CACP,uBACE,GAAG,EAAE,IAAI,CAAC,WAAW,EACrB,KAAK,EAAE;oBACL,QAAQ,EAAE,QAAQ;oBAClB,GAAG,EAAE,CAAC,aAAD,CAAC,cAAD,CAAC,GAAI,CAAC;oBACX,IAAI,EAAE,CAAC,aAAD,CAAC,cAAD,CAAC,GAAI,CAAC;oBACZ,KAAK,EAAE,aAAa;iBACrB,IACG,gBAAgB,EAAE,IACtB,SAAS,EAAC,oGAAoG,gBAE9G,MAAC,mBAAmB,aAAC,GAAG,EAAE,CAAC,iBACzB,sBAAI,SAAS,EAAC,WAAW,gBAAE,KAAK,CAAC,WAAW,IAAM,EAElD,MAAC,qBAAqB,aAAC,UAAU,uBAC/B,wBAAM,SAAS,EAAC,WAAW,8BAAgB,EAC3C,MAAC,qBAAqB,aAAC,GAAG,EAAE,CAAC,iBAC3B,wBAAM,SAAS,EAAC,WAAW,gBAAE,UAAG,MAAA,KAAK,CAAC,OAAO,0CAAE,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,gBAAM,MAAA,KAAK,CAAC,OAAO,0CAAE,SAAS,CAC1F,CAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,MAAM,IAAG,CAAC,CAC1B,CAAE,IAAQ,EACX,KAAC,UAAU,IAAC,MAAM,EAAE,sBAAM,OAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAG,MAAA,KAAK,CAAC,OAAO,mCAAI,EAAE,CAAC,CAAA,EAAA,GAAI,EACxD,KAAK,CAAC,OAAO,IAAI,KAAK,IAAI,CACzB,KAAC,gBAAgB,IACf,IAAI,EAAE,WAAW,CAAC,aAAa,EAC/B,OAAO,EAAE,cAAM,OAAA,KAAK,CAAC,cAAc,CAAC,KAAC,YAAY,IAAC,KAAK,EAAE,KAAK,CAAC,IAAwB,GAAI,CAAC,CAAC,EAA9E,CAA8E,GAC7F,CACH,EACA,KAAK,CAAC,WAAW,IAAI,CACpB,KAAC,gBAAgB,IACf,IAAI,EAAE,WAAW,CAAC,WAAW,EAC7B,OAAO,EAAE,cAAM,OAAA,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,QAAQ,CAAC,EAAxC,CAAwC,GACvD,CACH,KACqB,KACF,EACxB,qBAAG,SAAS,EAAC,0BAA0B,gBAAE,UAAU,IAAK,KACpC,IAClB,CACP,IACA,CACJ,CAAC;AACJ,CAAC"}

package/dist/stories/StyledDataBox.d.ts

@@ -0,0 +1,12 @@
+import { PropsWithChildren } from 'react';
+import { StyledIconButtonProps } from './StyledIconButton';
+interface StyledDataBoxProps extends PropsWithChildren {
+    heading: string;
+    rightIconButton?: StyledIconButtonProps;
+    boxButtonLabel?: string;
+    boxButtonOnClick?: () => void;
+    rightCornerHeading?: string;
+}
+export default function StyledDataBox({ heading, children, rightIconButton, rightCornerHeading, boxButtonLabel, boxButtonOnClick, }: StyledDataBoxProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=StyledDataBox.d.ts.map

package/dist/stories/StyledDataBox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDataBox.d.ts","sourceRoot":"","sources":["../../src/stories/StyledDataBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAyB,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAE7E,UAAU,kBAAmB,SAAQ,iBAAiB;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,eAAe,CAAC,EAAE,qBAAqB,CAAC;IACxC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,OAAO,EACP,QAAQ,EACR,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,gBAAgB,GACjB,EAAE,kBAAkB,2CAiCpB"}

package/dist/stories/StyledDataBox.js

@@ -0,0 +1,26 @@
+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, jsxs as _jsxs } from "react/jsx-runtime";
+import StyledIconButton from './StyledIconButton';
+export default function StyledDataBox(_a) {
+    var heading = _a.heading, children = _a.children, rightIconButton = _a.rightIconButton, rightCornerHeading = _a.rightCornerHeading, boxButtonLabel = _a.boxButtonLabel, boxButtonOnClick = _a.boxButtonOnClick;
+    var headingClasses = 'mb-2';
+    var containerClasses = ' border-white/20  p-3';
+    boxButtonLabel !== undefined
+        ? (containerClasses += ' rounded-t border-x border-t')
+        : (containerClasses += ' border rounded');
+    if (!children) {
+        headingClasses += ' text-white/20';
+    }
+    return (_jsxs("div", __assign({ className: "mb-6 sm:max-w-lg md:max-w-none md:w-full mx-auto" }, { children: [_jsxs("div", __assign({ className: containerClasses }, { children: [_jsxs("div", __assign({ className: "flex justify-between content-start" }, { children: [_jsx("h2", __assign({ className: headingClasses }, { children: heading })), rightIconButton && _jsx(StyledIconButton, __assign({}, rightIconButton)), rightCornerHeading && _jsx("span", __assign({ className: "text-lg font-bold" }, { children: rightCornerHeading }))] })), _jsx("div", { children: children })] })), boxButtonLabel !== undefined && (_jsx("button", __assign({ type: "button", onClick: boxButtonOnClick, className: "bg-white/10 border-white/20 uppercase p-2 font-bold border w-full rounded-b hover:bg-white/20 focus:bg-white/20 active:bg-white/30" }, { children: boxButtonLabel })))] })));
+}
+//# sourceMappingURL=StyledDataBox.js.map

package/dist/stories/StyledDataBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDataBox.js","sourceRoot":"","sources":["../../src/stories/StyledDataBox.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,gBAA2C,MAAM,oBAAoB,CAAC;AAU7E,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAOjB;QANnB,OAAO,aAAA,EACP,QAAQ,cAAA,EACR,eAAe,qBAAA,EACf,kBAAkB,wBAAA,EAClB,cAAc,oBAAA,EACd,gBAAgB,sBAAA;IAEhB,IAAI,cAAc,GAAG,MAAM,CAAC;IAC5B,IAAI,gBAAgB,GAAG,uBAAuB,CAAC;IAE/C,cAAc,KAAK,SAAS;QAC1B,CAAC,CAAC,CAAC,gBAAgB,IAAI,8BAA8B,CAAC;QACtD,CAAC,CAAC,CAAC,gBAAgB,IAAI,iBAAiB,CAAC,CAAC;IAE5C,IAAI,CAAC,QAAQ,EAAE;QACb,cAAc,IAAI,gBAAgB,CAAC;KACpC;IAED,OAAO,CACL,wBAAK,SAAS,EAAC,kDAAkD,iBAC/D,wBAAK,SAAS,EAAE,gBAAgB,iBAC9B,wBAAK,SAAS,EAAC,oCAAoC,iBACjD,sBAAI,SAAS,EAAE,cAAc,gBAAG,OAAO,IAAM,EAC5C,eAAe,IAAI,KAAC,gBAAgB,eAAK,eAAe,EAAI,EAC5D,kBAAkB,IAAI,wBAAM,SAAS,EAAC,mBAAmB,gBAAE,kBAAkB,IAAQ,KAClF,EACN,wBAAM,QAAQ,GAAO,KACjB,EACL,cAAc,KAAK,SAAS,IAAI,CAC/B,0BACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,gBAAgB,EACzB,SAAS,EAAC,oIAAoI,gBAE7I,cAAc,IACR,CACV,KACG,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/StyledDataTable.d.ts

@@ -0,0 +1,22 @@
+import { PropsWithChildren } from 'react';
+export interface StyledDataTableProps extends PropsWithChildren {
+    darkTheme?: boolean;
+    heading?: string;
+    label?: string;
+    showBorder?: boolean;
+    alignContent?: AlignContent;
+    narrow?: boolean;
+}
+export declare enum AlignContent {
+    LEFT = "LEFT",
+    RIGHT = "RIGHT",
+    BETWEEN = "BETWEEN"
+}
+export declare const ThemeContext: import("react").Context<{
+    darkTheme: boolean;
+    showBorder: boolean;
+    alignContent: AlignContent;
+    narrow: boolean;
+}>;
+export default function StyledDataTable({ showBorder, heading, label, darkTheme, children, alignContent, narrow, }: StyledDataTableProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledDataTable.d.ts.map

package/dist/stories/StyledDataTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDataTable.d.ts","sourceRoot":"","sources":["../../src/stories/StyledDataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiB,MAAM,OAAO,CAAC;AAEzD,MAAM,WAAW,oBAAqB,SAAQ,iBAAiB;IAC7D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,oBAAY,YAAY;IACtB,IAAI,SAAS;IACb,KAAK,UAAU;IACf,OAAO,YAAY;CACpB;AAQD,eAAO,MAAM,YAAY;;;;;EAA8B,CAAC;AAExD,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,UAAiB,EACjB,OAAO,EACP,KAAK,EACL,SAAiB,EACjB,QAAQ,EACR,YAAgC,EAChC,MAAc,GACf,EAAE,oBAAoB,2CAkBtB"}

package/dist/stories/StyledDataTable.js

@@ -0,0 +1,38 @@
+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, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext } from 'react';
+export var AlignContent;
+(function (AlignContent) {
+    AlignContent["LEFT"] = "LEFT";
+    AlignContent["RIGHT"] = "RIGHT";
+    AlignContent["BETWEEN"] = "BETWEEN";
+})(AlignContent || (AlignContent = {}));
+var contextProps = {
+    darkTheme: true,
+    showBorder: true,
+    alignContent: AlignContent.LEFT,
+    narrow: false,
+};
+export var ThemeContext = createContext(contextProps);
+export default function StyledDataTable(_a) {
+    var _b = _a.showBorder, showBorder = _b === void 0 ? true : _b, heading = _a.heading, label = _a.label, _c = _a.darkTheme, darkTheme = _c === void 0 ? false : _c, children = _a.children, _d = _a.alignContent, alignContent = _d === void 0 ? AlignContent.LEFT : _d, _e = _a.narrow, narrow = _e === void 0 ? false : _e;
+    var headingClasses = 'text-lg font-bold mb-2.5';
+    var labelClasses = 'font-semibold text-sm mb-1.5 ml-3.5';
+    if (!darkTheme) {
+        labelClasses += ' text-dfxBlue-800';
+        headingClasses += ' text-dfxBlue-800';
+    }
+    showBorder && (headingClasses += ' ml-3.5');
+    return (_jsx(ThemeContext.Provider, __assign({ value: { darkTheme: darkTheme, showBorder: showBorder, alignContent: alignContent, narrow: narrow } }, { children: _jsxs("div", __assign({ className: "mb-2.5" }, { children: [heading !== undefined && _jsx("h3", __assign({ className: headingClasses }, { children: heading })), label !== undefined && showBorder && _jsx("p", __assign({ className: labelClasses }, { children: label })), _jsx("div", { children: children })] })) })));
+}
+//# sourceMappingURL=StyledDataTable.js.map

package/dist/stories/StyledDataTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDataTable.js","sourceRoot":"","sources":["../../src/stories/StyledDataTable.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAqB,aAAa,EAAE,MAAM,OAAO,CAAC;AAWzD,MAAM,CAAN,IAAY,YAIX;AAJD,WAAY,YAAY;IACtB,6BAAa,CAAA;IACb,+BAAe,CAAA;IACf,mCAAmB,CAAA;AACrB,CAAC,EAJW,YAAY,KAAZ,YAAY,QAIvB;AAED,IAAM,YAAY,GAAG;IACnB,SAAS,EAAE,IAAI;IACf,UAAU,EAAE,IAAI;IAChB,YAAY,EAAE,YAAY,CAAC,IAAI;IAC/B,MAAM,EAAE,KAAK;CACd,CAAC;AACF,MAAM,CAAC,IAAM,YAAY,GAAG,aAAa,CAAC,YAAY,CAAC,CAAC;AAExD,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAQjB;QAPrB,kBAAiB,EAAjB,UAAU,mBAAG,IAAI,KAAA,EACjB,OAAO,aAAA,EACP,KAAK,WAAA,EACL,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,QAAQ,cAAA,EACR,oBAAgC,EAAhC,YAAY,mBAAG,YAAY,CAAC,IAAI,KAAA,EAChC,cAAc,EAAd,MAAM,mBAAG,KAAK,KAAA;IAEd,IAAI,cAAc,GAAG,0BAA0B,CAAC;IAChD,IAAI,YAAY,GAAG,qCAAqC,CAAC;IAEzD,IAAI,CAAC,SAAS,EAAE;QACd,YAAY,IAAI,mBAAmB,CAAC;QACpC,cAAc,IAAI,mBAAmB,CAAC;KACvC;IACD,UAAU,IAAI,CAAC,cAAc,IAAI,SAAS,CAAC,CAAC;IAC5C,OAAO,CACL,KAAC,YAAY,CAAC,QAAQ,aAAC,KAAK,EAAE,EAAE,SAAS,WAAA,EAAE,UAAU,YAAA,EAAE,YAAY,cAAA,EAAE,MAAM,QAAA,EAAE,gBAC3E,wBAAK,SAAS,EAAC,QAAQ,iBACpB,OAAO,KAAK,SAAS,IAAI,sBAAI,SAAS,EAAE,cAAc,gBAAG,OAAO,IAAM,EACtE,KAAK,KAAK,SAAS,IAAI,UAAU,IAAI,qBAAG,SAAS,EAAE,YAAY,gBAAG,KAAK,IAAK,EAC7E,wBAAM,QAAQ,GAAO,KACjB,IACgB,CACzB,CAAC;AACJ,CAAC"}

package/dist/stories/StyledDataTableRow.d.ts

@@ -0,0 +1,10 @@
+import { PropsWithChildren } from 'react';
+interface StyledDataTableRowProps extends PropsWithChildren {
+    label?: string;
+    discreet?: boolean;
+    isLoading?: boolean;
+    infoText?: string;
+}
+export default function StyledDataTableRow({ label, children, discreet, isLoading, infoText, }: StyledDataTableRowProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=StyledDataTableRow.d.ts.map

package/dist/stories/StyledDataTableRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDataTableRow.d.ts","sourceRoot":"","sources":["../../src/stories/StyledDataTableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAc,MAAM,OAAO,CAAC;AAMtD,UAAU,uBAAwB,SAAQ,iBAAiB;IACzD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAQD,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EACzC,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,QAAQ,GACT,EAAE,uBAAuB,2CA8CzB"}

package/dist/stories/StyledDataTableRow.js

@@ -0,0 +1,47 @@
+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 _a;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext } from 'react';
+import { IconColor } from './DfxIcon';
+import { AlignContent, ThemeContext } from './StyledDataTable';
+import StyledInfoText, { StyledInfoTextSize } from './StyledInfoText';
+import StyledLoadingSpinner, { SpinnerSize, SpinnerVariant } from './StyledLoadingSpinner';
+var ALIGN_MAPS = (_a = {},
+    _a[AlignContent.LEFT] = ' justify-start',
+    _a[AlignContent.RIGHT] = ' justify-end',
+    _a[AlignContent.BETWEEN] = ' justify-between',
+    _a);
+export default function StyledDataTableRow(_a) {
+    var label = _a.label, children = _a.children, discreet = _a.discreet, isLoading = _a.isLoading, infoText = _a.infoText;
+    var theme = useContext(ThemeContext);
+    var wrapperClasses = 'flex flex-col gap-3 text-sm';
+    var labelClasses = ' ';
+    var rowDataClasses = 'flex gap-3 w-full';
+    discreet && (wrapperClasses += ' opacity-70');
+    theme.showBorder
+        ? (wrapperClasses += ' px-3.5 py-2.5 border-t border-x last:border-y first:rounded-t last:rounded-b')
+        : (wrapperClasses += ' py-2');
+    !theme.showBorder && theme.narrow && (wrapperClasses += ' px-3.5');
+    if (theme.darkTheme) {
+        labelClasses += ' text-dfxGray-600';
+        wrapperClasses += ' border-white/20';
+    }
+    else {
+        labelClasses += ' text-dfxGray-800';
+        rowDataClasses += ' text-dfxBlue-800';
+        wrapperClasses += ' border-dfxGray-400';
+    }
+    rowDataClasses += ALIGN_MAPS[theme.alignContent];
+    return (_jsxs("div", __assign({ className: wrapperClasses }, { children: [_jsxs("div", __assign({ className: "flex" }, { children: [label && (_jsx("div", __assign({ className: "flex-none w-48" }, { children: _jsx("p", __assign({ className: labelClasses }, { children: label })) }))), _jsx("div", __assign({ className: rowDataClasses }, { children: isLoading ? _jsx(StyledLoadingSpinner, { size: SpinnerSize.SM, variant: SpinnerVariant.PALE }) : children }))] })), infoText && (_jsx(StyledInfoText, __assign({ textSize: StyledInfoTextSize.XS, iconColor: IconColor.GRAY, discreet: true }, { children: infoText })))] })));
+}
+//# sourceMappingURL=StyledDataTableRow.js.map

package/dist/stories/StyledDataTableRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDataTableRow.js","sourceRoot":"","sources":["../../src/stories/StyledDataTableRow.tsx"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,OAAO,EAAqB,UAAU,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,cAAc,EAAE,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtE,OAAO,oBAAoB,EAAE,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAS3F,IAAM,UAAU;IACd,GAAC,YAAY,CAAC,IAAI,IAAG,gBAAgB;IACrC,GAAC,YAAY,CAAC,KAAK,IAAG,cAAc;IACpC,GAAC,YAAY,CAAC,OAAO,IAAG,kBAAkB;OAC3C,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EAMjB;QALxB,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,QAAQ,cAAA;IAER,IAAM,KAAK,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAEvC,IAAI,cAAc,GAAG,6BAA6B,CAAC;IACnD,IAAI,YAAY,GAAG,GAAG,CAAC;IACvB,IAAI,cAAc,GAAG,mBAAmB,CAAC;IAEzC,QAAQ,IAAI,CAAC,cAAc,IAAI,aAAa,CAAC,CAAC;IAE9C,KAAK,CAAC,UAAU;QACd,CAAC,CAAC,CAAC,cAAc,IAAI,+EAA+E,CAAC;QACrG,CAAC,CAAC,CAAC,cAAc,IAAI,OAAO,CAAC,CAAC;IAEhC,CAAC,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,MAAM,IAAI,CAAC,cAAc,IAAI,SAAS,CAAC,CAAC;IAEnE,IAAI,KAAK,CAAC,SAAS,EAAE;QACnB,YAAY,IAAI,mBAAmB,CAAC;QACpC,cAAc,IAAI,kBAAkB,CAAC;KACtC;SAAM;QACL,YAAY,IAAI,mBAAmB,CAAC;QACpC,cAAc,IAAI,mBAAmB,CAAC;QACtC,cAAc,IAAI,qBAAqB,CAAC;KACzC;IAED,cAAc,IAAI,UAAU,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;IAEjD,OAAO,CACL,wBAAK,SAAS,EAAE,cAAc,iBAC5B,wBAAK,SAAS,EAAC,MAAM,iBAClB,KAAK,IAAI,CACR,uBAAK,SAAS,EAAC,gBAAgB,gBAC7B,qBAAG,SAAS,EAAE,YAAY,gBAAG,KAAK,IAAK,IACnC,CACP,EAED,uBAAK,SAAS,EAAE,cAAc,gBAC3B,SAAS,CAAC,CAAC,CAAC,KAAC,oBAAoB,IAAC,IAAI,EAAE,WAAW,CAAC,EAAE,EAAE,OAAO,EAAE,cAAc,CAAC,IAAI,GAAI,CAAC,CAAC,CAAC,QAAQ,IAChG,KACF,EACL,QAAQ,IAAI,CACX,KAAC,cAAc,aAAC,QAAQ,EAAE,kBAAkB,CAAC,EAAE,EAAE,SAAS,EAAE,SAAS,CAAC,IAAI,EAAE,QAAQ,sBACjF,QAAQ,IACM,CAClB,KACG,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/StyledDataTextRow.d.ts

@@ -0,0 +1,8 @@
+import { PropsWithChildren } from 'react';
+interface StyledDataTextRowProps extends PropsWithChildren {
+    label: string;
+    isLoading?: boolean;
+}
+export default function StyledDataTextRow({ label, children, isLoading }: StyledDataTextRowProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=StyledDataTextRow.d.ts.map

package/dist/stories/StyledDataTextRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDataTextRow.d.ts","sourceRoot":"","sources":["../../src/stories/StyledDataTextRow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG1C,UAAU,sBAAuB,SAAQ,iBAAiB;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,sBAAsB,2CAc/F"}

package/dist/stories/StyledDataTextRow.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, jsxs as _jsxs } from "react/jsx-runtime";
+import StyledLoadingSpinner, { SpinnerSize, SpinnerVariant } from './StyledLoadingSpinner';
+export default function StyledDataTextRow(_a) {
+    var label = _a.label, children = _a.children, isLoading = _a.isLoading;
+    var labelClasses = 'text-dfxGray-600';
+    var rowDataClasses = 'flex place-self-center overflow-hidden ';
+    return (_jsxs("div", __assign({ className: "flex py-1" }, { children: [_jsx("div", __assign({ className: "flex-none w-48" }, { children: _jsx("p", __assign({ className: labelClasses }, { children: label })) })), _jsx("div", __assign({ className: rowDataClasses }, { children: isLoading ? _jsx(StyledLoadingSpinner, { size: SpinnerSize.SM, variant: SpinnerVariant.PALE }) : children }))] })));
+}
+//# sourceMappingURL=StyledDataTextRow.js.map

package/dist/stories/StyledDataTextRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDataTextRow.js","sourceRoot":"","sources":["../../src/stories/StyledDataTextRow.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,oBAAoB,EAAE,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAO3F,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EAAsD;QAApD,KAAK,WAAA,EAAE,QAAQ,cAAA,EAAE,SAAS,eAAA;IACpE,IAAM,YAAY,GAAG,kBAAkB,CAAC;IACxC,IAAM,cAAc,GAAG,yCAAyC,CAAC;IAEjE,OAAO,CACL,wBAAK,SAAS,EAAC,WAAW,iBACxB,uBAAK,SAAS,EAAC,gBAAgB,gBAC7B,qBAAG,SAAS,EAAE,YAAY,gBAAG,KAAK,IAAK,IACnC,EACN,uBAAK,SAAS,EAAE,cAAc,gBAC3B,SAAS,CAAC,CAAC,CAAC,KAAC,oBAAoB,IAAC,IAAI,EAAE,WAAW,CAAC,EAAE,EAAE,OAAO,EAAE,cAAc,CAAC,IAAI,GAAI,CAAC,CAAC,CAAC,QAAQ,IAChG,KACF,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/StyledIconButton.d.ts

@@ -0,0 +1,11 @@
+import { IconVariant, IconColor, IconSize } from './DfxIcon';
+export interface StyledIconButtonProps {
+    onClick: () => void;
+    size?: IconSize;
+    icon: IconVariant;
+    color?: IconColor;
+    inline?: boolean;
+    isLoading?: boolean;
+}
+export default function StyledIconButton({ onClick, size, icon, inline, color, isLoading, }: StyledIconButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledIconButton.d.ts.map

package/dist/stories/StyledIconButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledIconButton.d.ts","sourceRoot":"","sources":["../../src/stories/StyledIconButton.tsx"],"names":[],"mappings":"AAAA,OAAgB,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAGtE,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,IAAI,EAAE,WAAW,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,OAAO,EACP,IAAkB,EAClB,IAAI,EACJ,MAAc,EACd,KAAqB,EACrB,SAAiB,GAClB,EAAE,qBAAqB,2CAavB"}

package/dist/stories/StyledIconButton.js

@@ -0,0 +1,21 @@
+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, jsxs as _jsxs } from "react/jsx-runtime";
+import DfxIcon, { IconColor, IconSize } from './DfxIcon';
+import StyledLoadingSpinner, { SpinnerSize, SpinnerVariant } from './StyledLoadingSpinner';
+export default function StyledIconButton(_a) {
+    var onClick = _a.onClick, _b = _a.size, size = _b === void 0 ? IconSize.MD : _b, icon = _a.icon, _c = _a.inline, inline = _c === void 0 ? false : _c, _d = _a.color, color = _d === void 0 ? IconColor.RED : _d, _e = _a.isLoading, isLoading = _e === void 0 ? false : _e;
+    var buttonClass = 'inline-block flex h-full align-top hover:scale-110 transition ease-in-out delay-100';
+    buttonClass += inline ? ' px-2 pt-0.5' : '';
+    return (_jsxs("button", __assign({ type: "button", className: buttonClass, onClick: onClick }, { children: [_jsx(DfxIcon, { icon: icon, color: color, size: size }), isLoading && (_jsx("div", __assign({ className: "place-self-center" }, { children: _jsx(StyledLoadingSpinner, { variant: SpinnerVariant.LIGHT_MODE, size: SpinnerSize.SM }) })))] })));
+}
+//# sourceMappingURL=StyledIconButton.js.map

package/dist/stories/StyledIconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledIconButton.js","sourceRoot":"","sources":["../../src/stories/StyledIconButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,OAAO,EAAE,EAAe,SAAS,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACtE,OAAO,oBAAoB,EAAE,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAW3F,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EAOjB;QANtB,OAAO,aAAA,EACP,YAAkB,EAAlB,IAAI,mBAAG,QAAQ,CAAC,EAAE,KAAA,EAClB,IAAI,UAAA,EACJ,cAAc,EAAd,MAAM,mBAAG,KAAK,KAAA,EACd,aAAqB,EAArB,KAAK,mBAAG,SAAS,CAAC,GAAG,KAAA,EACrB,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA;IAEjB,IAAI,WAAW,GAAG,qFAAqF,CAAC;IACxG,WAAW,IAAI,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5C,OAAO,CACL,2BAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,OAAO,iBAC5D,KAAC,OAAO,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,GAAI,EAChD,SAAS,IAAI,CACZ,uBAAK,SAAS,EAAC,mBAAmB,gBAChC,KAAC,oBAAoB,IAAC,OAAO,EAAE,cAAc,CAAC,UAAU,EAAE,IAAI,EAAE,WAAW,CAAC,EAAE,GAAI,IAC9E,CACP,KACM,CACV,CAAC;AACJ,CAAC"}

package/dist/stories/StyledInfoText.d.ts

@@ -0,0 +1,16 @@
+import { PropsWithChildren } from 'react';
+import { IconColor } from './DfxIcon';
+export interface StyledInfoTextProps extends PropsWithChildren {
+    darkTheme?: boolean;
+    textSize?: StyledInfoTextSize;
+    invertedIcon?: boolean;
+    iconColor?: IconColor;
+    discreet?: boolean;
+}
+export declare enum StyledInfoTextSize {
+    XS = "XS",
+    SM = "SM",
+    MD = "MD"
+}
+export default function StyledInfoText({ darkTheme, children, textSize, invertedIcon, iconColor, discreet, }: StyledInfoTextProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledInfoText.d.ts.map

package/dist/stories/StyledInfoText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledInfoText.d.ts","sourceRoot":"","sources":["../../src/stories/StyledInfoText.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAgB,EAAE,SAAS,EAAyB,MAAM,WAAW,CAAC;AAEtE,MAAM,WAAW,mBAAoB,SAAQ,iBAAiB;IAC5D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,oBAAY,kBAAkB;IAC5B,EAAE,OAAO;IACT,EAAE,OAAO;IACT,EAAE,OAAO;CACV;AAaD,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,SAAS,EACT,QAAQ,EACR,QAAgC,EAChC,YAAY,EACZ,SAAyB,EACzB,QAAQ,GACT,EAAE,mBAAmB,2CAmBrB"}

package/dist/stories/StyledInfoText.js

@@ -0,0 +1,39 @@
+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 _a;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import DfxIcon, { IconColor, IconSize, IconVariant } from './DfxIcon';
+export var StyledInfoTextSize;
+(function (StyledInfoTextSize) {
+    StyledInfoTextSize["XS"] = "XS";
+    StyledInfoTextSize["SM"] = "SM";
+    StyledInfoTextSize["MD"] = "MD";
+})(StyledInfoTextSize || (StyledInfoTextSize = {}));
+var TEXT_SIZE_MAPS = (_a = {},
+    _a[StyledInfoTextSize.XS] = { wrapperClasses: ' text-xs', iconSize: IconSize.SM },
+    _a[StyledInfoTextSize.SM] = { wrapperClasses: ' text-sm', iconSize: IconSize.MD },
+    _a[StyledInfoTextSize.MD] = { wrapperClasses: '', iconSize: IconSize.LG },
+    _a);
+export default function StyledInfoText(_a) {
+    var darkTheme = _a.darkTheme, children = _a.children, _b = _a.textSize, textSize = _b === void 0 ? StyledInfoTextSize.SM : _b, invertedIcon = _a.invertedIcon, _c = _a.iconColor, iconColor = _c === void 0 ? IconColor.RED : _c, discreet = _a.discreet;
+    var wrapperClasses = 'flex gap-2' + TEXT_SIZE_MAPS[textSize].wrapperClasses;
+    var iconSize = TEXT_SIZE_MAPS[textSize].iconSize;
+    var iconVariant = invertedIcon ? IconVariant.INFO : IconVariant.INFO_OUTLINE;
+    if (darkTheme) {
+        wrapperClasses += discreet ? ' text-white/50' : ' text-white';
+    }
+    else {
+        wrapperClasses += discreet ? ' text-dfxGray-700' : ' text-dfxBlue-800';
+    }
+    return (_jsxs("div", __assign({ className: wrapperClasses }, { children: [_jsx("div", __assign({ className: "shrink-0" }, { children: _jsx(DfxIcon, { icon: iconVariant, size: iconSize, color: iconColor }) })), _jsx("p", { children: children })] })));
+}
+//# sourceMappingURL=StyledInfoText.js.map

package/dist/stories/StyledInfoText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledInfoText.js","sourceRoot":"","sources":["../../src/stories/StyledInfoText.tsx"],"names":[],"mappings":";;;;;;;;;;;;;AACA,OAAO,OAAO,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAUtE,MAAM,CAAN,IAAY,kBAIX;AAJD,WAAY,kBAAkB;IAC5B,+BAAS,CAAA;IACT,+BAAS,CAAA;IACT,+BAAS,CAAA;AACX,CAAC,EAJW,kBAAkB,KAAlB,kBAAkB,QAI7B;AAOD,IAAM,cAAc;IAClB,GAAC,kBAAkB,CAAC,EAAE,IAAG,EAAE,cAAc,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,EAAE;IAC9E,GAAC,kBAAkB,CAAC,EAAE,IAAG,EAAE,cAAc,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,EAAE;IAC9E,GAAC,kBAAkB,CAAC,EAAE,IAAG,EAAE,cAAc,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,EAAE;OACvE,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAOjB;QANpB,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,gBAAgC,EAAhC,QAAQ,mBAAG,kBAAkB,CAAC,EAAE,KAAA,EAChC,YAAY,kBAAA,EACZ,iBAAyB,EAAzB,SAAS,mBAAG,SAAS,CAAC,GAAG,KAAA,EACzB,QAAQ,cAAA;IAER,IAAI,cAAc,GAAG,YAAY,GAAG,cAAc,CAAC,QAAQ,CAAC,CAAC,cAAc,CAAC;IAC5E,IAAM,QAAQ,GAAG,cAAc,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC;IACnD,IAAM,WAAW,GAAG,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,YAAY,CAAC;IAE/E,IAAI,SAAS,EAAE;QACb,cAAc,IAAI,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,aAAa,CAAC;KAC/D;SAAM;QACL,cAAc,IAAI,QAAQ,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,mBAAmB,CAAC;KACxE;IAED,OAAO,CACL,wBAAK,SAAS,EAAE,cAAc,iBAC5B,uBAAK,SAAS,EAAC,UAAU,gBACvB,KAAC,OAAO,IAAC,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,GAAI,IAC5D,EACN,sBAAI,QAAQ,GAAK,KACb,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/StyledLink.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+interface StyledLinkProps {
+    label: string;
+    url?: string;
+}
+export declare function StyledLink({ label, url }: StyledLinkProps): JSX.Element;
+export {};
+//# sourceMappingURL=StyledLink.d.ts.map

package/dist/stories/StyledLink.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledLink.d.ts","sourceRoot":"","sources":["../../src/stories/StyledLink.tsx"],"names":[],"mappings":";AAAA,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,eAAe,GAAG,GAAG,CAAC,OAAO,CAMvE"}

package/dist/stories/StyledLink.js

@@ -0,0 +1,17 @@
+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 "react/jsx-runtime";
+export function StyledLink(_a) {
+    var label = _a.label, url = _a.url;
+    return (_jsx("a", __assign({ className: "text-link opacity-30", target: "_blank", href: url, rel: "noopener noreferrer" }, { children: label })));
+}
+//# sourceMappingURL=StyledLink.js.map

package/dist/stories/StyledLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledLink.js","sourceRoot":"","sources":["../../src/stories/StyledLink.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAKA,MAAM,UAAU,UAAU,CAAC,EAA+B;QAA7B,KAAK,WAAA,EAAE,GAAG,SAAA;IACrC,OAAO,CACL,qBAAG,SAAS,EAAC,sBAAsB,EAAC,MAAM,EAAC,QAAQ,EAAC,IAAI,EAAE,GAAG,EAAE,GAAG,EAAC,qBAAqB,gBACrF,KAAK,IACJ,CACL,CAAC;AACJ,CAAC"}

package/dist/stories/StyledLoadingSpinner.d.ts

@@ -0,0 +1,16 @@
+export interface StyledLoadingSpinnerProps {
+    variant?: SpinnerVariant;
+    size?: SpinnerSize;
+}
+export declare enum SpinnerVariant {
+    DARK_MODE = "DARK_MODE",
+    LIGHT_MODE = "LIGHT_MODE",
+    PALE = "PALE"
+}
+export declare enum SpinnerSize {
+    SM = "SMALL",
+    MD = "MEDIUM",
+    LG = "LARGE"
+}
+export default function StyledLoadingSpinner({ variant, size, }: StyledLoadingSpinnerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledLoadingSpinner.d.ts.map

package/dist/stories/StyledLoadingSpinner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledLoadingSpinner.d.ts","sourceRoot":"","sources":["../../src/stories/StyledLoadingSpinner.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,yBAAyB;IACxC,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,IAAI,CAAC,EAAE,WAAW,CAAC;CACpB;AAED,oBAAY,cAAc;IACxB,SAAS,cAAc;IACvB,UAAU,eAAe;IACzB,IAAI,SAAS;CACd;AAED,oBAAY,WAAW;IACrB,EAAE,UAAU;IACZ,EAAE,WAAW;IACb,EAAE,UAAU;CACb;AAyBD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,OAAkC,EAClC,IAAqB,GACtB,EAAE,yBAAyB,2CAU3B"}