@dfx.swiss/react-components 1.0.1-beta.7 → 1.0.1-beta.8

package/dist/stories/StyledVideoGrid.js

@@ -0,0 +1,18 @@
+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 StyledVideoGrid(_a) {
+    var videoSources = _a.videoSources, _b = _a.numCols, numCols = _b === void 0 ? 3 : _b;
+    var gridFractal = '1fr ';
+    return (_jsx("div", __assign({ style: { gridTemplateColumns: gridFractal.repeat(numCols) }, className: "grid gap-6" }, { children: videoSources.map(function (video, index) { return (_jsxs("div", __assign({ className: "place-self-end" }, { children: [_jsx("h3", __assign({ className: "my-3 text-base font-bold" }, { children: video.title })), _jsx("video", { className: "rounded-lg border border-white/20", src: video.vidSrc, poster: video.thumbSrc, controls: true })] }), index)); }) })));
+}
+//# sourceMappingURL=StyledVideoGrid.js.map

package/dist/stories/StyledVideoGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledVideoGrid.js","sourceRoot":"","sources":["../../src/stories/StyledVideoGrid.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAWA,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAAmD;QAAjD,YAAY,kBAAA,EAAE,eAAW,EAAX,OAAO,mBAAG,CAAC,KAAA;IACjE,IAAM,WAAW,GAAG,MAAM,CAAC;IAC3B,OAAO,CACL,uBAAK,KAAK,EAAE,EAAE,mBAAmB,EAAE,WAAW,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE,SAAS,EAAC,YAAY,gBACrF,YAAY,CAAC,GAAG,CAAC,UAAC,KAAK,EAAE,KAAK,IAAK,OAAA,CAClC,wBAAiB,SAAS,EAAC,gBAAgB,iBACzC,sBAAI,SAAS,EAAC,0BAA0B,gBAAE,KAAK,CAAC,KAAK,IAAM,EAC3D,gBACE,SAAS,EAAC,mCAAmC,EAC7C,GAAG,EAAE,KAAK,CAAC,MAAM,EACjB,MAAM,EAAE,KAAK,CAAC,QAAQ,EACtB,QAAQ,SACD,MAPD,KAAK,CAQT,CACP,EAVmC,CAUnC,CAAC,IACE,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/Typography.d.ts

@@ -0,0 +1,2 @@
+export default function Typography(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Typography.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Typography.d.ts","sourceRoot":"","sources":["../../src/stories/Typography.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,UAAU,UAAU,4CAuCjC"}

package/dist/stories/Typography.js

@@ -0,0 +1,16 @@
+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 Typography() {
+    return (_jsxs("div", { children: [_jsx("h1", { children: "Heading 1 / 28px / \"text-2xl font-black\"" }), _jsx("h2", { children: "Heading 2 / 20px / \"text-lg font-bold\"" }), _jsx("h3", { children: "Heading 3 / 20px / regular" }), _jsx("h4", __assign({ className: "uppercase tracking-widest" }, { children: "Sub \u2022 Top \u2022 Heading \"uppercase tracking-widest\" " })), _jsx("h5", { children: "Heading 5 (idle) " }), _jsx("h6", { children: "Heading 6 (idle) " }), _jsx("br", {}), _jsxs("p", { children: [_jsx("strong", { children: "Normal paragraph, text-base, 16px/22px, 1rem" }), " / Aenean lacinia bibendum nulla sed consectetur. Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros."] }), _jsx("br", {}), _jsxs("p", __assign({ className: "text-sm" }, { children: [_jsx("strong", { children: "Small Text \"text-sm\", 14px / 0.875rem" }), " / Aenean lacinia bibendum nulla sed consectetur. Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros."] })), _jsx("br", {}), _jsxs("p", __assign({ className: "text-xs" }, { children: [_jsx("strong", { children: "Very Small Text \"text-xs\", 12px / 0.75rem" }), " , used for Form Labels // Aenean lacinia bibendum nulla sed consectetur. Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros."] })), _jsx("br", {}), _jsxs("p", __assign({ className: "text-2xs" }, { children: [_jsx("strong", { children: "Smallest Text, \"text-2xs\" 10px / 0.625rem" }), " , used for Form Labels // Aenean lacinia bibendum nulla sed consectetur. Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros."] }))] }));
+}
+//# sourceMappingURL=Typography.js.map

package/dist/stories/Typography.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typography.js","sourceRoot":"","sources":["../../src/stories/Typography.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,MAAM,CAAC,OAAO,UAAU,UAAU;IAChC,OAAO,CACL,0BACE,sEAAiD,EACjD,oEAA+C,EAC/C,sDAAmC,EACnC,sBAAI,SAAS,EAAC,2BAA2B,kFAAsD,EAC/F,6CAA0B,EAC1B,6CAA0B,EAC1B,cAAM,EACN,wBACE,4EAA6D,+UAI3D,EACJ,cAAM,EACN,sBAAG,SAAS,EAAC,SAAS,iBACpB,uEAAsD,gVAIpD,EACJ,cAAM,EACN,sBAAG,SAAS,EAAC,SAAS,iBACpB,2EAA0D,wWAIxD,EACJ,cAAM,EACN,sBAAG,SAAS,EAAC,UAAU,iBACrB,2EAA0D,wWAIxD,IACA,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/form/Form.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+import { Control, FieldError } from 'react-hook-form';
+export interface ControlProps {
+    control?: Control<any>;
+    name: string;
+    label?: string;
+    rules?: any;
+    error?: FieldError;
+    disabled?: boolean;
+}
+interface Props {
+    children: ReactNode;
+    control: Control<any>;
+    rules?: any;
+    errors: any;
+    disabled?: boolean;
+    onSubmit?: () => void;
+}
+declare const Form: ({ children, control, rules, errors, disabled, onSubmit }: Props) => import("react/jsx-runtime").JSX.Element;
+export default Form;
+//# sourceMappingURL=Form.d.ts.map

package/dist/stories/form/Form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../src/stories/form/Form.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,SAAS,EAAiB,MAAM,OAAO,CAAC;AAC9E,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAEtD,MAAM,WAAW,YAAY;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,KAAK;IACb,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC;IACtB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,MAAM,EAAE,GAAG,CAAC;IACZ,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAGD,QAAA,MAAM,IAAI,6DAAsE,KAAK,4CAkCpF,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/stories/form/Form.js

@@ -0,0 +1,45 @@
+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 { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { createElement } from 'react';
+// TODO: auto focus on next input field?
+var Form = function (_a) {
+    var children = _a.children, control = _a.control, rules = _a.rules, errors = _a.errors, _b = _a.disabled, disabled = _b === void 0 ? false : _b, onSubmit = _a.onSubmit;
+    var enrichElements = function (elements) {
+        if (!elements)
+            return undefined;
+        return (Array.isArray(elements) ? __spreadArray([], elements, true) : [elements]).map(function (element, i) {
+            return enrichElement(element, i);
+        });
+    };
+    var enrichElement = function (element, index) {
+        if (!(element === null || element === void 0 ? void 0 : element.props))
+            return element;
+        var props = __assign(__assign({}, element.props), { children: enrichElements(element.props.children), key: index });
+        if (element.props.name) {
+            props = __assign(__assign({}, props), { ref: element.ref, control: control, rules: rules ? rules[element.props.name] : undefined, error: errors[element.props.name], disabled: element.props.disabled || disabled, onSubmit: onSubmit });
+        }
+        return createElement(element.type, props);
+    };
+    return _jsx(_Fragment, { children: enrichElements(children) });
+};
+export default Form;
+//# sourceMappingURL=Form.js.map

package/dist/stories/form/Form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.js","sourceRoot":"","sources":["../../../src/stories/form/Form.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,aAAa,EAA0C,MAAM,OAAO,CAAC;AAqB9E,wCAAwC;AACxC,IAAM,IAAI,GAAG,UAAC,EAAuE;QAArE,QAAQ,cAAA,EAAE,OAAO,aAAA,EAAE,KAAK,WAAA,EAAE,MAAM,YAAA,EAAE,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAAE,QAAQ,cAAA;IAC1E,IAAM,cAAc,GAAG,UAAC,QAAmB;QACzC,IAAI,CAAC,QAAQ;YAAE,OAAO,SAAS,CAAC;QAEhC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,mBAAK,QAAQ,QAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,UAAC,OAAO,EAAE,CAAC;YAC3E,OAAA,aAAa,CAAC,OAAuB,EAAE,CAAC,CAAC;QAAzC,CAAyC,CAC1C,CAAC;IACJ,CAAC,CAAC;IAEF,IAAM,aAAa,GAAG,UAAC,OAA0C,EAAE,KAAa;QAC9E,IAAI,CAAC,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,CAAA;YAAE,OAAO,OAAO,CAAC;QAEpC,IAAI,KAAK,yBACJ,OAAO,CAAC,KAAK,KAChB,QAAQ,EAAE,cAAc,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,EAChD,GAAG,EAAE,KAAK,GACX,CAAC;QAEF,IAAI,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE;YACtB,KAAK,yBACA,KAAK,KACR,GAAG,EAAE,OAAO,CAAC,GAAG,EAChB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,EACpD,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,EACjC,QAAQ,EAAE,OAAO,CAAC,KAAK,CAAC,QAAQ,IAAI,QAAQ,EAC5C,QAAQ,EAAE,QAAQ,GACnB,CAAC;SACH;QAED,OAAO,aAAa,CAAC,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IAC5C,CAAC,CAAC;IAEF,OAAO,4BAAG,cAAc,CAAC,QAAQ,CAAC,GAAI,CAAC;AACzC,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/stories/form/StyledBankAccountListItem.d.ts

@@ -0,0 +1,6 @@
+import { BankAccount } from '../../definitions/bank-account';
+export interface StyledBankAccountListItemProps {
+    bankAccount: BankAccount;
+}
+export default function StyledBankAccountListItem({ bankAccount }: StyledBankAccountListItemProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledBankAccountListItem.d.ts.map

package/dist/stories/form/StyledBankAccountListItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledBankAccountListItem.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledBankAccountListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAI7D,MAAM,WAAW,8BAA8B;IAC7C,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAC,EAAE,WAAW,EAAE,EAAE,8BAA8B,2CAuBhG"}

package/dist/stories/form/StyledBankAccountListItem.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 { Utils } from '../../utils';
+import DfxIcon, { IconVariant, IconColor } from '../DfxIcon';
+export default function StyledBankAccountListItem(_a) {
+    var bankAccount = _a.bankAccount;
+    var isLabelAvailable = bankAccount.label && bankAccount.label.length > 0;
+    return (_jsx("div", __assign({ className: "flex  mb-3 last:mb-0 group justify-between rounded py-1 px-3 hover:bg-dfxGray-400/50 " }, { children: _jsxs("div", __assign({ className: "flex gap-3" }, { children: [_jsx("div", __assign({ className: "place-self-center" }, { children: _jsx(DfxIcon, { icon: IconVariant.BANK, color: IconColor.BLACK }) })), _jsxs("div", __assign({ className: "flex flex-col justify-center h-[42px]" }, { children: [isLabelAvailable && _jsx("p", __assign({ className: "text-dfxGray-800 text-xs" }, { children: bankAccount.label })), _jsx("p", __assign({ className: "text-dfxBlue-800" }, { children: Utils.formatIban(bankAccount.iban) }))] }))] })) })));
+}
+//# sourceMappingURL=StyledBankAccountListItem.js.map

package/dist/stories/form/StyledBankAccountListItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledBankAccountListItem.js","sourceRoot":"","sources":["../../../src/stories/form/StyledBankAccountListItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,OAAO,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAM7D,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAC,EAA+C;QAA7C,WAAW,iBAAA;IAC7D,IAAM,gBAAgB,GAAG,WAAW,CAAC,KAAK,IAAI,WAAW,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;IAC3E,OAAO,CACL,uBAAK,SAAS,EAAC,uFAAuF,gBACpG,wBAAK,SAAS,EAAC,YAAY,iBACzB,uBAAK,SAAS,EAAC,mBAAmB,gBAChC,KAAC,OAAO,IAAC,IAAI,EAAE,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,CAAC,KAAK,GAAI,IACvD,EACN,wBAAK,SAAS,EAAC,uCAAuC,iBACnD,gBAAgB,IAAI,qBAAG,SAAS,EAAC,0BAA0B,gBAAE,WAAW,CAAC,KAAK,IAAK,EACpF,qBAAG,SAAS,EAAC,kBAAkB,gBAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,IAAK,KACpE,KACF,IASF,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/form/StyledDropdown.d.ts

@@ -0,0 +1,17 @@
+import { ControlProps } from './Form';
+import { IconVariant } from '../DfxIcon';
+import { AssetIconVariant } from '../DfxAssetIcon';
+export interface StyledDropdownProps<T> extends ControlProps {
+    labelIcon?: IconVariant;
+    placeholder?: string;
+    full?: boolean;
+    smallLabel?: boolean;
+    items: T[];
+    labelFunc: (item: T) => string;
+    balanceFunc?: (item: T) => string;
+    descriptionFunc?: (item: T) => string;
+    priceFunc?: (item: T) => string;
+    assetIconFunc?: (item: T) => AssetIconVariant;
+}
+export default function StyledDropdown<T>({ label, labelIcon, control, name, rules, disabled, items, placeholder, full, smallLabel, labelFunc, balanceFunc, descriptionFunc, priceFunc, assetIconFunc, ...props }: StyledDropdownProps<T>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledDropdown.d.ts.map

package/dist/stories/form/StyledDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDropdown.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAEtC,OAAgB,EAAuB,WAAW,EAAE,MAAM,YAAY,CAAC;AAEvE,OAAqB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAEjE,MAAM,WAAW,mBAAmB,CAAC,CAAC,CAAE,SAAQ,YAAY;IAC1D,SAAS,CAAC,EAAE,WAAW,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAC/B,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAClC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IACtC,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAChC,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,gBAAgB,CAAC;CAC/C;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,CAAC,EAAE,EACxC,KAAK,EACL,SAAS,EACT,OAAO,EACP,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,KAAK,EACL,WAAW,EACX,IAAI,EACJ,UAAU,EACV,SAAS,EACT,WAAW,EACX,eAAe,EACf,SAAS,EACT,aAAa,EACb,GAAG,KAAK,EACT,EAAE,mBAAmB,CAAC,CAAC,CAAC,2CA0GxB"}

package/dist/stories/form/StyledDropdown.js

@@ -0,0 +1,42 @@
+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, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
+import DfxIcon, { IconColor, IconSize, IconVariant } from '../DfxIcon';
+import { Controller } from 'react-hook-form';
+import DfxAssetIcon from '../DfxAssetIcon';
+export default function StyledDropdown(_a) {
+    var label = _a.label, labelIcon = _a.labelIcon, control = _a.control, name = _a.name, rules = _a.rules, disabled = _a.disabled, items = _a.items, placeholder = _a.placeholder, full = _a.full, smallLabel = _a.smallLabel, labelFunc = _a.labelFunc, balanceFunc = _a.balanceFunc, descriptionFunc = _a.descriptionFunc, priceFunc = _a.priceFunc, assetIconFunc = _a.assetIconFunc, props = __rest(_a, ["label", "labelIcon", "control", "name", "rules", "disabled", "items", "placeholder", "full", "smallLabel", "labelFunc", "balanceFunc", "descriptionFunc", "priceFunc", "assetIconFunc"]);
+    var _b = useState(false), isOpen = _b[0], setIsOpen = _b[1];
+    var buttonClasses = 'flex justify-between border border-dfxGray-500 px-4 py-3 shadow-sm w-full';
+    isOpen ? (buttonClasses += ' rounded-x rounded-t bg-dfxGray-400/50') : (buttonClasses += ' rounded');
+    var isDisabled = disabled || items.length <= 1;
+    return (_jsx(Controller, { control: control, render: function (_a) {
+            var _b = _a.field, onChange = _b.onChange, onBlur = _b.onBlur, value = _b.value;
+            return (_jsxs("div", __assign({ className: "relative ".concat(full ? 'w-full' : '') }, { children: [_jsxs("div", __assign({ className: "flex items-center ml-3.5 mb-2.5" }, { children: [labelIcon !== undefined && _jsx(DfxIcon, { icon: labelIcon, size: IconSize.SM, color: IconColor.BLUE }), _jsx("label", __assign({ className: "text-dfxBlue-800 ".concat(smallLabel ? 'text-sm' : 'text-base', " font-semibold ").concat(labelIcon ? 'pl-3.5' : '') }, { children: label }))] })), _jsxs("button", __assign({ id: "dropDownButton", type: "button", onClick: function () { return setIsOpen(!isOpen); }, className: buttonClasses, onBlur: onBlur, disabled: isDisabled }, props, { children: [_jsxs("div", __assign({ className: "flex flex-row gap-2 items-center w-full" }, { children: [value && assetIconFunc && _jsx(DfxAssetIcon, { asset: assetIconFunc(value) }), _jsx("div", __assign({ className: "flex flex-col gap-1 justify-between text-left w-full" }, { children: value === undefined ? (_jsx("p", __assign({ className: "text-dfxGray-600 drop-shadow-none py-[0.25rem]" }, { children: placeholder }))) : (_jsxs(_Fragment, { children: [_jsxs("span", __assign({ className: "text-dfxBlue-800 leading-none font-semibold flex justify-between ".concat(!descriptionFunc && !assetIconFunc ? 'py-[0.25rem]' : '') }, { children: [labelFunc(value), balanceFunc && _jsx("p", { children: balanceFunc(value) })] })), descriptionFunc && (_jsxs("span", __assign({ className: "text-dfxGray-800 text-xs h-min leading-none flex justify-between" }, { children: [descriptionFunc(value), priceFunc && _jsx("p", { children: priceFunc(value) })] })))] })) }))] })), !isDisabled && (_jsx("div", __assign({ className: "place-self-center" }, { children: _jsx(DfxIcon, { icon: isOpen ? IconVariant.EXPAND_LESS : IconVariant.EXPAND_MORE, size: IconSize.LG }) })))] })), isOpen && (_jsx("div", __assign({ className: "absolute bg-white rounded-b w-full z-10" }, { children: items.map(function (item, index) { return (_jsx("button", __assign({ onClick: function () {
+                                onChange(item);
+                                setIsOpen(false);
+                            }, className: "flex flex-col gap-2 justify-between text-left border-x border-dfxGray-500 w-full hover:bg-dfxGray-400/50 last:border-b last:rounded-b px-3.5 py-2.5" }, { children: _jsxs("div", __assign({ className: "flex flex-row gap-2 items-center w-full" }, { children: [assetIconFunc && _jsx(DfxAssetIcon, { asset: assetIconFunc(item) }), _jsxs("div", __assign({ className: "flex flex-col gap-1 justify-between text-left w-full" }, { children: [_jsxs("span", __assign({ className: "text-dfxBlue-800 leading-none font-semibold flex justify-between ".concat(!descriptionFunc && !assetIconFunc ? 'py-[0.25rem]' : '') }, { children: [labelFunc(item), balanceFunc && _jsx("p", { children: balanceFunc(item) })] })), descriptionFunc && (_jsxs("span", __assign({ className: "text-dfxGray-800 text-xs h-min leading-none flex justify-between" }, { children: [descriptionFunc(item), priceFunc && _jsx("p", { children: priceFunc(item) })] })))] }))] })) }), index)); }) })))] })));
+        }, name: name, rules: rules }));
+}
+//# sourceMappingURL=StyledDropdown.js.map

package/dist/stories/form/StyledDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDropdown.js","sourceRoot":"","sources":["../../../src/stories/form/StyledDropdown.tsx"],"names":[],"mappings":"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"}

package/dist/stories/form/StyledInput.d.ts

@@ -0,0 +1,18 @@
+import { HTMLInputTypeAttribute } from 'react';
+import { ControlProps } from './Form';
+interface StyledInputProps extends ControlProps {
+    type?: HTMLInputTypeAttribute;
+    placeholder?: string;
+    prefix?: string;
+    forceError?: boolean;
+    forceErrorMessage?: string;
+    hideLabel?: boolean;
+    darkTheme?: boolean;
+    full?: boolean;
+    loading?: boolean;
+    small?: boolean;
+    smallLabel?: boolean;
+}
+declare const StyledInput: import("react").ForwardRefExoticComponent<StyledInputProps & import("react").RefAttributes<HTMLInputElement>>;
+export default StyledInput;
+//# sourceMappingURL=StyledInput.d.ts.map

package/dist/stories/form/StyledInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledInput.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,sBAAsB,EAAE,MAAM,OAAO,CAAC;AAG3D,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAGtC,UAAU,gBAAiB,SAAQ,YAAY;IAC7C,IAAI,CAAC,EAAE,sBAAsB,CAAC;IAC9B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAmBD,QAAA,MAAM,WAAW,+GAwFhB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/stories/form/StyledInput.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 __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 "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { Controller } from 'react-hook-form';
+import StyledVerticalStack from '../layout-helpers/StyledVerticalStack';
+import StyledLoadingSpinner from '../StyledLoadingSpinner';
+function getLeftMargin(prefix) {
+    switch (prefix.length) {
+        case 1:
+            return 'pl-7';
+        case 2:
+            return 'pl-9';
+        case 3:
+            return 'pl-12';
+        case 4:
+            return 'pl-15';
+        case 5:
+            return 'pl-16';
+        default:
+            return '';
+    }
+}
+var StyledInput = forwardRef(function (_a, ref) {
+    var control = _a.control, name = _a.name, label = _a.label, rules = _a.rules, _b = _a.disabled, disabled = _b === void 0 ? false : _b, error = _a.error, _c = _a.type, type = _c === void 0 ? 'text' : _c, placeholder = _a.placeholder, prefix = _a.prefix, _d = _a.forceError, forceError = _d === void 0 ? false : _d, forceErrorMessage = _a.forceErrorMessage, _e = _a.hideLabel, hideLabel = _e === void 0 ? false : _e, _f = _a.darkTheme, darkTheme = _f === void 0 ? false : _f, _g = _a.loading, loading = _g === void 0 ? false : _g, _h = _a.full, full = _h === void 0 ? false : _h, _j = _a.small, small = _j === void 0 ? false : _j, _k = _a.smallLabel, smallLabel = _k === void 0 ? false : _k, props = __rest(_a, ["control", "name", "label", "rules", "disabled", "error", "type", "placeholder", "prefix", "forceError", "forceErrorMessage", "hideLabel", "darkTheme", "loading", "full", "small", "smallLabel"]);
+    var textColor = darkTheme ? 'text-white' : 'text-dfxBlue-800';
+    var backgroundColor = darkTheme ? 'bg-white bg-opacity-5' : 'bg-white';
+    var placeholderColor = darkTheme ? 'placeholder:text-dfxGray-800' : 'placeholder:text-dfxGray-600';
+    var borderColor = darkTheme ? 'border-none' : 'border border-dfxGray-500';
+    var outlineColor = darkTheme ? 'outline-none' : 'outline-2 outline-dfxBlue-400';
+    var leftMargin = prefix ? getLeftMargin(prefix) : '';
+    var textOrErrorColor = forceError ? 'text-dfxRed-100' : textColor;
+    return (_jsx(Controller, { control: control, render: function (_a) {
+            var _b = _a.field, onChange = _b.onChange, onBlur = _b.onBlur, value = _b.value;
+            return (_jsxs(StyledVerticalStack, __assign({ gap: 1, full: full }, { children: [_jsx("label", __assign({ hidden: hideLabel, className: "text-start ".concat(smallLabel ? 'text-sm' : 'text-base', " font-semibold pl-3 pl- ") + [textColor].join(' ') }, { children: label })), _jsxs("div", __assign({ className: "relative" }, { children: [prefix && (_jsx("div", __assign({ className: "text-dfxGray-800 absolute h-[50px] ".concat(prefix.length > 0 ? 'left-3' : '', " flex justify-center items-center") }, { children: _jsx("p", { children: prefix }) }))), loading && (_jsx("div", __assign({ className: "absolute right-3 h-[50px] w-8 flex justify-center items-center pl-" }, { children: _jsx(StyledLoadingSpinner, {}) }))), _jsx("input", __assign({ className: "text-base font-normal rounded-md p-3 ".concat(small ? 'w-24' : 'w-full', " ") +
+                                    [textOrErrorColor, backgroundColor, placeholderColor, borderColor, outlineColor, leftMargin].join(' '), type: type, inputMode: type === 'number' ? 'decimal' : undefined, onBlur: onBlur, onChange: function (value) { return onChange(value.target.value); }, placeholder: placeholder, value: value !== null && value !== void 0 ? value : '', disabled: disabled, ref: ref, onWheel: function (e) { return type === 'number' && e.currentTarget.blur(); } }, props))] })), (forceErrorMessage || error) && (_jsx("p", __assign({ className: "text-start text-sm text-dfxRed-100 pl-3" }, { children: forceErrorMessage !== null && forceErrorMessage !== void 0 ? forceErrorMessage : error === null || error === void 0 ? void 0 : error.message })))] })));
+        }, name: name, rules: rules }));
+});
+export default StyledInput;
+//# sourceMappingURL=StyledInput.js.map

package/dist/stories/form/StyledInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledInput.js","sourceRoot":"","sources":["../../../src/stories/form/StyledInput.tsx"],"names":[],"mappings":"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"}

package/dist/stories/form/StyledModalDropdown.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { ControlProps } from './Form';
+interface StyledModalDropdownProps<T> extends ControlProps {
+    placeholder: string;
+    labelFunc: (item: T) => string;
+    descriptionFunc?: (item: T) => string | undefined;
+    modal: {
+        heading: string;
+        items: T[];
+        itemContent: (item: T) => JSX.Element;
+        form?: (onFormSubmit: (item: T) => void) => JSX.Element;
+    };
+}
+export default function StyledModalDropdown<T>({ control, name, label, rules, modal, placeholder, labelFunc, descriptionFunc, ...props }: StyledModalDropdownProps<T>): JSX.Element;
+export {};
+//# sourceMappingURL=StyledModalDropdown.d.ts.map

package/dist/stories/form/StyledModalDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledModalDropdown.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledModalDropdown.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAEtC,UAAU,wBAAwB,CAAC,CAAC,CAAE,SAAQ,YAAY;IACxD,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAC/B,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,SAAS,CAAC;IAClD,KAAK,EAAE;QACL,OAAO,EAAE,MAAM,CAAC;QAChB,KAAK,EAAE,CAAC,EAAE,CAAC;QACX,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC;QACtC,IAAI,CAAC,EAAE,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,KAAK,GAAG,CAAC,OAAO,CAAC;KACzD,CAAC;CACH;AAED,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,CAAC,EAAE,EAC7C,OAAO,EACP,IAAI,EACJ,KAAK,EACL,KAAK,EACL,KAAK,EACL,WAAW,EACX,SAAS,EACT,eAAe,EACf,GAAG,KAAK,EACT,EAAE,wBAAwB,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,CA8E3C"}

package/dist/stories/form/StyledModalDropdown.js

@@ -0,0 +1,45 @@
+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, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Controller } from 'react-hook-form';
+import DfxIcon, { IconSize, IconVariant } from '../DfxIcon';
+import StyledVerticalStack from '../layout-helpers/StyledVerticalStack';
+import StyledModal, { StyledModalColor } from '../StyledModal';
+export default function StyledModalDropdown(_a) {
+    var control = _a.control, name = _a.name, label = _a.label, rules = _a.rules, modal = _a.modal, placeholder = _a.placeholder, labelFunc = _a.labelFunc, descriptionFunc = _a.descriptionFunc, props = __rest(_a, ["control", "name", "label", "rules", "modal", "placeholder", "labelFunc", "descriptionFunc"]);
+    var _b = useState(false), showModal = _b[0], setShowModal = _b[1];
+    return (_jsx(Controller, { control: control, render: function (_a) {
+            var _b = _a.field, onChange = _b.onChange, onBlur = _b.onBlur, value = _b.value;
+            return (_jsxs(_Fragment, { children: [_jsxs(StyledModal, __assign({ isVisible: showModal, onClose: setShowModal, heading: modal.heading, color: StyledModalColor.WHITE }, { children: [modal.items.length > 0 && (_jsx(StyledVerticalStack, __assign({ gap: 4 }, { children: modal.items
+                                    .map(function (item) { return ({ item: item, content: modal.itemContent(item) }); })
+                                    .map(function (obj, index) { return (_jsx("button", __assign({ className: "text-start", onClick: function () {
+                                        onChange(obj.item);
+                                        setShowModal(false);
+                                    } }, { children: obj.content }), index)); }) }))), modal.form && (_jsxs(_Fragment, { children: [_jsx("div", { className: "h-[1px] bg-dfxGray-400 -mx-14 my-6" }), modal.form(function (item) {
+                                        onChange(item);
+                                        setShowModal(false);
+                                    })] }))] })), _jsxs(StyledVerticalStack, __assign({ gap: 1, marginY: 4 }, { children: [_jsx("label", __assign({ className: "text-dfxBlue-800 text-base font-semibold pl-4" }, { children: label })), _jsxs("button", __assign({ className: "flex justify-between border border-dfxGray-400 text-base font-normal rounded-md px-4 py-2 shadow-sm w-full", onClick: function () { return setShowModal(true); }, onBlur: onBlur }, props, { children: [_jsx("div", __assign({ className: "flex flex-col justify-between text-left gap-1" }, { children: value ? (_jsxs(_Fragment, { children: [(descriptionFunc === null || descriptionFunc === void 0 ? void 0 : descriptionFunc(value)) && (_jsx("span", __assign({ className: "text-dfxGray-800 text-xs h-min leading-none" }, { children: descriptionFunc(value) }))), _jsx("span", __assign({ className: 'text-dfxBlue-800 leading-none font-base'.concat((descriptionFunc === null || descriptionFunc === void 0 ? void 0 : descriptionFunc(value)) ? '' : ' py-2') }, { children: labelFunc(value) }))] })) : (_jsx("span", __assign({ className: "text-dfxGray-600 py-1" }, { children: placeholder }))) })), _jsx("div", __assign({ className: "place-self-center" }, { children: _jsx(DfxIcon, { icon: IconVariant.UNFOLD_MORE, size: IconSize.LG }) }))] }))] }))] }));
+        }, name: name, rules: rules }));
+}
+//# sourceMappingURL=StyledModalDropdown.js.map

package/dist/stories/form/StyledModalDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledModalDropdown.js","sourceRoot":"","sources":["../../../src/stories/form/StyledModalDropdown.tsx"],"names":[],"mappings":"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"}

package/dist/stories/layout-helpers/LayoutFunctions.d.ts

@@ -0,0 +1,2 @@
+export declare function convertToRem(value: number): string;
+//# sourceMappingURL=LayoutFunctions.d.ts.map

package/dist/stories/layout-helpers/LayoutFunctions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutFunctions.d.ts","sourceRoot":"","sources":["../../../src/stories/layout-helpers/LayoutFunctions.tsx"],"names":[],"mappings":"AAAA,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAElD"}

package/dist/stories/layout-helpers/LayoutFunctions.js

@@ -0,0 +1,4 @@
+export function convertToRem(value) {
+    return "".concat(value / 4, "rem");
+}
+//# sourceMappingURL=LayoutFunctions.js.map

package/dist/stories/layout-helpers/LayoutFunctions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutFunctions.js","sourceRoot":"","sources":["../../../src/stories/layout-helpers/LayoutFunctions.tsx"],"names":[],"mappings":"AAAA,MAAM,UAAU,YAAY,CAAC,KAAa;IACxC,OAAO,UAAG,KAAK,GAAG,CAAC,QAAK,CAAC;AAC3B,CAAC"}

package/dist/stories/layout-helpers/StyledHorizontalStack.d.ts

@@ -0,0 +1,10 @@
+import { PropsWithChildren } from 'react';
+export interface StyledHorizontalStackProps extends PropsWithChildren {
+    gap?: number;
+    spanAcross?: boolean;
+    center?: boolean;
+    marginX?: number;
+    marginY?: number;
+}
+export default function StyledHorizontalStack({ children, gap, spanAcross, marginY, marginX, center, }: StyledHorizontalStackProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledHorizontalStack.d.ts.map

package/dist/stories/layout-helpers/StyledHorizontalStack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledHorizontalStack.d.ts","sourceRoot":"","sources":["../../../src/stories/layout-helpers/StyledHorizontalStack.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG1C,MAAM,WAAW,0BAA2B,SAAQ,iBAAiB;IACnE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,QAAQ,EACR,GAAO,EACP,UAAU,EACV,OAAO,EACP,OAAO,EACP,MAAM,GACP,EAAE,0BAA0B,2CAc5B"}

package/dist/stories/layout-helpers/StyledHorizontalStack.js

@@ -0,0 +1,24 @@
+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";
+import { convertToRem } from './LayoutFunctions';
+export default function StyledHorizontalStack(_a) {
+    var children = _a.children, _b = _a.gap, gap = _b === void 0 ? 0 : _b, spanAcross = _a.spanAcross, marginY = _a.marginY, marginX = _a.marginX, center = _a.center;
+    var spacing = convertToRem(gap);
+    var mY = marginY != undefined ? convertToRem(marginY) : '0';
+    var mX = marginX != undefined ? convertToRem(marginX) : '0';
+    var classNames = 'flex ';
+    center && (classNames += 'justify-center ');
+    spanAcross && (classNames += 'justify-between ');
+    return (_jsx("div", __assign({ style: { gap: spacing, margin: mY + ' ' + mX }, className: classNames }, { children: children })));
+}
+//# sourceMappingURL=StyledHorizontalStack.js.map

package/dist/stories/layout-helpers/StyledHorizontalStack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledHorizontalStack.js","sourceRoot":"","sources":["../../../src/stories/layout-helpers/StyledHorizontalStack.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAUjD,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAOjB;QAN3B,QAAQ,cAAA,EACR,WAAO,EAAP,GAAG,mBAAG,CAAC,KAAA,EACP,UAAU,gBAAA,EACV,OAAO,aAAA,EACP,OAAO,aAAA,EACP,MAAM,YAAA;IAEN,IAAM,OAAO,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC;IAClC,IAAM,EAAE,GAAG,OAAO,IAAI,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IAC9D,IAAM,EAAE,GAAG,OAAO,IAAI,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IAE9D,IAAI,UAAU,GAAG,OAAO,CAAC;IACzB,MAAM,IAAI,CAAC,UAAU,IAAI,iBAAiB,CAAC,CAAC;IAC5C,UAAU,IAAI,CAAC,UAAU,IAAI,kBAAkB,CAAC,CAAC;IAEjD,OAAO,CACL,uBAAK,KAAK,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,GAAG,GAAG,GAAG,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,gBACvE,QAAQ,IACL,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/layout-helpers/StyledSpacer.d.ts

@@ -0,0 +1,6 @@
+export interface StyledSpacerProps {
+    showLine?: boolean;
+    spacing: number;
+}
+export default function StyledSpacer({ showLine, spacing }: StyledSpacerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledSpacer.d.ts.map

package/dist/stories/layout-helpers/StyledSpacer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledSpacer.d.ts","sourceRoot":"","sources":["../../../src/stories/layout-helpers/StyledSpacer.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,iBAAiB,2CAM5E"}

package/dist/stories/layout-helpers/StyledSpacer.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { convertToRem } from './LayoutFunctions';
+export default function StyledSpacer(_a) {
+    var showLine = _a.showLine, spacing = _a.spacing;
+    var spacerClasses = showLine ? 'border-t border-dfxGray-400' : '';
+    var margin = convertToRem(spacing);
+    return _jsx("div", { style: { margin: margin + ' 0' }, className: spacerClasses });
+}
+//# sourceMappingURL=StyledSpacer.js.map

package/dist/stories/layout-helpers/StyledSpacer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledSpacer.js","sourceRoot":"","sources":["../../../src/stories/layout-helpers/StyledSpacer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAOjD,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAAwC;QAAtC,QAAQ,cAAA,EAAE,OAAO,aAAA;IACtD,IAAM,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,EAAE,CAAC;IAEpE,IAAM,MAAM,GAAG,YAAY,CAAC,OAAO,CAAC,CAAC;IAErC,OAAO,cAAK,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,GAAQ,CAAC;AACjF,CAAC"}

package/dist/stories/layout-helpers/StyledVerticalStack.d.ts

@@ -0,0 +1,10 @@
+import { PropsWithChildren } from 'react';
+export interface StyledVerticalStackProps extends PropsWithChildren {
+    gap?: number;
+    marginY?: number;
+    marginX?: number;
+    center?: boolean;
+    full?: boolean;
+}
+export default function StyledVerticalStack({ children, gap, marginY, marginX, center, full, }: StyledVerticalStackProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledVerticalStack.d.ts.map

package/dist/stories/layout-helpers/StyledVerticalStack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledVerticalStack.d.ts","sourceRoot":"","sources":["../../../src/stories/layout-helpers/StyledVerticalStack.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG1C,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB;IACjE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,QAAQ,EACR,GAAO,EACP,OAAO,EACP,OAAO,EACP,MAAM,EACN,IAAI,GACL,EAAE,wBAAwB,2CAa1B"}

package/dist/stories/layout-helpers/StyledVerticalStack.js

@@ -0,0 +1,24 @@
+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";
+import { convertToRem } from './LayoutFunctions';
+export default function StyledVerticalStack(_a) {
+    var children = _a.children, _b = _a.gap, gap = _b === void 0 ? 0 : _b, marginY = _a.marginY, marginX = _a.marginX, center = _a.center, full = _a.full;
+    var spacing = convertToRem(gap);
+    var mY = marginY != undefined ? convertToRem(marginY) : '0';
+    var mX = marginX != undefined ? convertToRem(marginX) : '0';
+    var classNames = 'flex flex-col ';
+    center && (classNames += 'items-center ');
+    full && (classNames += 'w-full ');
+    return (_jsx("div", __assign({ style: { gap: spacing, margin: mY + ' ' + mX }, className: classNames }, { children: children })));
+}
+//# sourceMappingURL=StyledVerticalStack.js.map

package/dist/stories/layout-helpers/StyledVerticalStack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledVerticalStack.js","sourceRoot":"","sources":["../../../src/stories/layout-helpers/StyledVerticalStack.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAUjD,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAOjB;QANzB,QAAQ,cAAA,EACR,WAAO,EAAP,GAAG,mBAAG,CAAC,KAAA,EACP,OAAO,aAAA,EACP,OAAO,aAAA,EACP,MAAM,YAAA,EACN,IAAI,UAAA;IAEJ,IAAM,OAAO,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC;IAClC,IAAM,EAAE,GAAG,OAAO,IAAI,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IAC9D,IAAM,EAAE,GAAG,OAAO,IAAI,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IAC9D,IAAI,UAAU,GAAG,gBAAgB,CAAC;IAClC,MAAM,IAAI,CAAC,UAAU,IAAI,eAAe,CAAC,CAAC;IAC1C,IAAI,IAAI,CAAC,UAAU,IAAI,SAAS,CAAC,CAAC;IAElC,OAAO,CACL,uBAAK,KAAK,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,GAAG,GAAG,GAAG,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,gBACvE,QAAQ,IACL,CACP,CAAC;AACJ,CAAC"}

package/dist/utils.d.ts

@@ -0,0 +1,4 @@
+export declare class Utils {
+    static formatIban(iban?: string): string | null;
+}
+//# sourceMappingURL=utils.d.ts.map

package/dist/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAEA,qBAAa,KAAK;IAChB,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI;CAGhD"}

package/dist/utils.js

@@ -0,0 +1,11 @@
+import * as IbanTools from 'ibantools';
+var Utils = /** @class */ (function () {
+    function Utils() {
+    }
+    Utils.formatIban = function (iban) {
+        return IbanTools.friendlyFormatIBAN(iban);
+    };
+    return Utils;
+}());
+export { Utils };
+//# sourceMappingURL=utils.js.map

package/dist/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,SAAS,MAAM,WAAW,CAAC;AAEvC;IAAA;IAIA,CAAC;IAHQ,gBAAU,GAAjB,UAAkB,IAAa;QAC7B,OAAO,SAAS,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC5C,CAAC;IACH,YAAC;AAAD,CAAC,AAJD,IAIC"}