@dfx.swiss/react-components 1.3.0-beta.2 → 1.3.0-beta.200

package/dist/stories/StyledTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"StyledTab.js","sourceRoot":"","sources":["../../src/stories/StyledTab.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,OAAO,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAe,MAAM,WAAW,CAAC;AAWtE,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAQjB;QAPf,QAAQ,cAAA,EACR,MAAM,YAAA,EACN,SAAS,eAAA,EACT,mBAAmB,EAAnB,WAAW,mBAAG,KAAK,KAAA,EACnB,IAAI,UAAA,EACJ,SAAS,eAAA,EACT,SAAS,eAAA;IAET,IAAI,UAAU,GAAG,+DAA+D,CAAC;IACjF,IAAI,CAAC,WAAW,EAAE;QAChB,MAAM,CAAC,CAAC,CAAC,CAAC,UAAU,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,UAAU,IAAI,qCAAqC,CAAC,CAAC;KAC7F;SAAM;QACL,UAAU,IAAI,oCAAoC,CAAC;KACpD;IAED,OAAO,CACL,sBAAI,SAAS,EAAC,wBAAwB,gBACpC,sBACE,SAAS,EAAE,UAAU,EACrB,OAAO,EAAE,UAAC,CAAC;gBACT,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,IAAI,CAAC,WAAW,EAAE;oBAChB,SAAS,EAAE,CAAC;iBACb;YACH,CAAC,iBACW,KAAK,EACjB,IAAI,EAAC,GAAG,EACR,IAAI,EAAC,SAAS,iBAEb,QAAQ,EAER,IAAI,KAAK,SAAS,IAAI,KAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,GAAI,EAE9C,SAAS,KAAK,SAAS,IAAI,KAAC,WAAW,IAAC,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,GAAI,KAC7E,IACD,CACN,CAAC;AACJ,CAAC;AAOD,SAAS,WAAW,CAAC,EAAkC;QAAhC,KAAK,WAAA,EAAE,KAAK,WAAA;IACjC,IAAI,WAAW,GAAG,yDAAyD,CAAC;IAE5E,IAAI,KAAK,KAAK,SAAS,EAAE;QACvB,WAAW,IAAI,oBAAoB,CAAC;KACrC;SAAM;QACL,WAAW,IAAI,wBAAwB,CAAC;KACzC;IAED,OAAO,CACL,wBAAK,SAAS,EAAE,WAAW,iBACxB,KAAK,EACL,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,cAAM,CAAC,CAAC,CAAC,IAAI,EACnC,KAAK,KACF,CACP,CAAC;AACJ,CAAC;AAMD,SAAS,QAAQ,CAAC,EAAuB;QAArB,IAAI,UAAA;IACtB,OAAO,CACL,uBAAK,SAAS,EAAC,wBAAwB,gBACrC,KAAC,OAAO,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,GAAI,IAC7D,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"StyledTab.js","sourceRoot":"","sources":["../../src/stories/StyledTab.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,OAAO,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAe,MAAM,WAAW,CAAC;AActE,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAWjB;QAVf,QAAQ,cAAA,EACR,MAAM,YAAA,EACN,SAAS,eAAA,EACT,mBAAmB,EAAnB,WAAW,mBAAG,KAAK,KAAA,EACnB,IAAI,UAAA,EACJ,SAAS,eAAA,EACT,SAAS,eAAA,EACT,SAAS,eAAA,EACT,MAAM,YAAA,EACN,KAAK,WAAA;IAEL,IAAI,UAAU,GAAG,sEAAsE,CAAC;IACxF,UAAU,IAAI,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,sBAAsB,CAAC;IAC5D,IAAI,CAAC,WAAW,EAAE;QAChB,IAAI,MAAM,EAAE;YACV,UAAU,IAAI,SAAS,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,UAAU,CAAC;SACzD;aAAM;YACL,UAAU,IAAI,SAAS;gBACrB,CAAC,CAAC,iDAAiD;gBACnD,CAAC,CAAC,qCAAqC,CAAC;SAC3C;KACF;SAAM;QACL,UAAU,IAAI,oCAAoC,CAAC;KACpD;IAED,MAAM,IAAI,CAAC,UAAU,IAAI,iBAAiB,CAAC,CAAC;IAE5C,OAAO,CACL,sBAAI,SAAS,EAAE,eAAQ,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,iBAAc,gBACxD,sBACE,SAAS,EAAE,UAAU,EACrB,OAAO,EAAE,UAAC,CAAC;gBACT,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,IAAI,CAAC,WAAW,EAAE;oBAChB,SAAS,EAAE,CAAC;iBACb;YACH,CAAC,iBACW,KAAK,EACjB,IAAI,EAAC,GAAG,EACR,IAAI,EAAC,SAAS,iBAEb,QAAQ,EAER,IAAI,KAAK,SAAS,IAAI,KAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,GAAI,EAE9C,SAAS,KAAK,SAAS,IAAI,KAAC,WAAW,IAAC,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,GAAI,KAC7E,IACD,CACN,CAAC;AACJ,CAAC;AAOD,SAAS,WAAW,CAAC,EAAkC;QAAhC,KAAK,WAAA,EAAE,KAAK,WAAA;IACjC,IAAI,WAAW,GAAG,yDAAyD,CAAC;IAE5E,IAAI,KAAK,KAAK,SAAS,EAAE;QACvB,WAAW,IAAI,oBAAoB,CAAC;KACrC;SAAM;QACL,WAAW,IAAI,wBAAwB,CAAC;KACzC;IAED,OAAO,CACL,wBAAK,SAAS,EAAE,WAAW,iBACxB,KAAK,EACL,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,cAAM,CAAC,CAAC,CAAC,IAAI,EACnC,KAAK,KACF,CACP,CAAC;AACJ,CAAC;AAMD,SAAS,QAAQ,CAAC,EAAuB;QAArB,IAAI,UAAA;IACtB,OAAO,CACL,uBAAK,SAAS,EAAC,wBAAwB,gBACrC,KAAC,OAAO,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,GAAI,IAC7D,CACP,CAAC;AACJ,CAAC"}

package/dist/stories/StyledTabContainer.d.ts

@@ -3,6 +3,9 @@ import { IconVariant } from './DfxIcon';
 interface StyledTabContainerProps {
     tabs: Array<StyledTabProps>;
     activeTab?: number;
+    darkTheme?: boolean;
+    spread?: boolean;
+    small?: boolean;
 }
 export interface StyledTabProps {
     title: string;
@@ -13,6 +16,6 @@ export interface StyledTabProps {
     flagWord2?: string;
     onActivate?: () => void;
 }
-export default function StyledTabContainer({ tabs, activeTab }: StyledTabContainerProps): import("react/jsx-runtime").JSX.Element;
+export default function StyledTabContainer({ tabs, activeTab, darkTheme, spread, small }: StyledTabContainerProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=StyledTabContainer.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"StyledTabContainer.d.ts","sourceRoot":"","sources":["../../src/stories/StyledTabContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAGxC,UAAU,uBAAuB;IAC/B,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,SAAS,GAAG,SAAS,CAAC;IAC/B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EAAE,IAAI,EAAE,SAAa,EAAE,EAAE,uBAAuB,2CAoC1F"}
+{"version":3,"file":"StyledTabContainer.d.ts","sourceRoot":"","sources":["../../src/stories/StyledTabContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAGxC,UAAU,uBAAuB;IAC/B,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,SAAS,GAAG,SAAS,CAAC;IAC/B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EAAE,IAAI,EAAE,SAAa,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,uBAAuB,2CA4CpH"}

package/dist/stories/StyledTabContainer.js

@@ -13,14 +13,14 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useState } from 'react';
 import StyledTab from './StyledTab';
 export default function StyledTabContainer(_a) {
-    var tabs = _a.tabs, _b = _a.activeTab, activeTab = _b === void 0 ? 0 : _b;
+    var tabs = _a.tabs, _b = _a.activeTab, activeTab = _b === void 0 ? 0 : _b, darkTheme = _a.darkTheme, spread = _a.spread, small = _a.small;
     var _c = useState(activeTab), active = _c[0], setActive = _c[1];
-    return (_jsx(_Fragment, { children: _jsx("div", __assign({ className: "flex flex-wrap text-dfxBlue-800 mt-6" }, { children: _jsxs("div", __assign({ className: "w-full" }, { children: [_jsx("ul", __assign({ className: "flex mb-0 rounded-t-lg list-none bg-white/50 flex-wrap p-0 flex-row", role: "tablist" }, { children: tabs.map(function (tab, index) {
+    return (_jsx(_Fragment, { children: _jsx("div", __assign({ className: "flex flex-wrap text-dfxBlue-800" }, { children: _jsxs("div", __assign({ className: "w-full rounded-lg ".concat(darkTheme ? 'border border-dfxGray-400' : '') }, { children: [_jsx("ul", __assign({ className: "flex mb-0 rounded-t-lg list-none flex-wrap p-0 flex-row ".concat(darkTheme ? 'bg-dfxGray-400' : 'bg-white/50'), role: "tablist" }, { children: tabs.map(function (tab, index) {
                             return (_jsx(StyledTab, __assign({ setActive: function () {
                                     var _a;
                                     setActive(index);
                                     (_a = tab.onActivate) === null || _a === void 0 ? void 0 : _a.call(tab);
-                                }, active: index === active, deactivated: tab.deactivated, icon: tab.icon, flagWord1: tab.flagWord1, flagWord2: tab.flagWord2 }, { children: tab.title }), index));
-                        }) })), _jsx("div", __assign({ className: "relative flex flex-col min-w-0 break-words bg-white w-full mb-6 rounded-b-lg" }, { children: _jsx("div", __assign({ className: "p-8 flex-auto" }, { children: _jsx("div", __assign({ className: "tab-content tab-space" }, { children: tabs[active].content })) })) }))] })) })) }));
+                                }, active: index === active, deactivated: tab.deactivated, icon: tab.icon, flagWord1: tab.flagWord1, flagWord2: tab.flagWord2, darkTheme: darkTheme, spread: spread, small: small }, { children: tab.title }), index));
+                        }) })), _jsx("div", __assign({ className: "relative flex flex-col min-w-0 break-words bg-white w-full rounded-b-lg" }, { children: _jsx("div", __assign({ className: "p-8 flex-auto" }, { children: _jsx("div", __assign({ className: "tab-content tab-space" }, { children: tabs[active].content })) })) }))] })) })) }));
 }
 //# sourceMappingURL=StyledTabContainer.js.map

package/dist/stories/StyledTabContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"StyledTabContainer.js","sourceRoot":"","sources":["../../src/stories/StyledTabContainer.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,SAAS,MAAM,aAAa,CAAC;AAiBpC,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EAAgD;QAA9C,IAAI,UAAA,EAAE,iBAAa,EAAb,SAAS,mBAAG,CAAC,KAAA;IACxD,IAAA,KAAsB,QAAQ,CAAC,SAAS,CAAC,EAAxC,MAAM,QAAA,EAAE,SAAS,QAAuB,CAAC;IAEhD,OAAO,CACL,4BACE,uBAAK,SAAS,EAAC,sCAAsC,gBACnD,wBAAK,SAAS,EAAC,QAAQ,iBACrB,sBAAI,SAAS,EAAC,qEAAqE,EAAC,IAAI,EAAC,SAAS,gBAC/F,IAAI,CAAC,GAAG,CAAC,UAAC,GAAmB,EAAE,KAAa;4BAC3C,OAAO,CACL,KAAC,SAAS,aACR,SAAS,EAAE;;oCACT,SAAS,CAAC,KAAK,CAAC,CAAC;oCACjB,MAAA,GAAG,CAAC,UAAU,mDAAI,CAAC;gCACrB,CAAC,EACD,MAAM,EAAE,KAAK,KAAK,MAAM,EACxB,WAAW,EAAE,GAAG,CAAC,WAAW,EAE5B,IAAI,EAAE,GAAG,CAAC,IAAI,EACd,SAAS,EAAE,GAAG,CAAC,SAAS,EACxB,SAAS,EAAE,GAAG,CAAC,SAAS,gBAEvB,GAAG,CAAC,KAAK,KALL,KAAK,CAMA,CACb,CAAC;wBACJ,CAAC,CAAC,IACC,EACL,uBAAK,SAAS,EAAC,8EAA8E,gBAC3F,uBAAK,SAAS,EAAC,eAAe,gBAC5B,uBAAK,SAAS,EAAC,uBAAuB,gBAAE,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,IAAO,IAC/D,IACF,KACF,IACF,GACL,CACJ,CAAC;AACJ,CAAC"}
+{"version":3,"file":"StyledTabContainer.js","sourceRoot":"","sources":["../../src/stories/StyledTabContainer.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,SAAS,MAAM,aAAa,CAAC;AAoBpC,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EAA0E;QAAxE,IAAI,UAAA,EAAE,iBAAa,EAAb,SAAS,mBAAG,CAAC,KAAA,EAAE,SAAS,eAAA,EAAE,MAAM,YAAA,EAAE,KAAK,WAAA;IAClF,IAAA,KAAsB,QAAQ,CAAC,SAAS,CAAC,EAAxC,MAAM,QAAA,EAAE,SAAS,QAAuB,CAAC;IAEhD,OAAO,CACL,4BACE,uBAAK,SAAS,EAAC,iCAAiC,gBAC9C,wBAAK,SAAS,EAAE,4BAAqB,SAAS,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,EAAE,CAAE,iBACjF,sBACE,SAAS,EAAE,kEACT,SAAS,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,aAAa,CAC5C,EACF,IAAI,EAAC,SAAS,gBAEb,IAAI,CAAC,GAAG,CAAC,UAAC,GAAmB,EAAE,KAAa;4BAC3C,OAAO,CACL,KAAC,SAAS,aACR,SAAS,EAAE;;oCACT,SAAS,CAAC,KAAK,CAAC,CAAC;oCACjB,MAAA,GAAG,CAAC,UAAU,mDAAI,CAAC;gCACrB,CAAC,EACD,MAAM,EAAE,KAAK,KAAK,MAAM,EACxB,WAAW,EAAE,GAAG,CAAC,WAAW,EAE5B,IAAI,EAAE,GAAG,CAAC,IAAI,EACd,SAAS,EAAE,GAAG,CAAC,SAAS,EACxB,SAAS,EAAE,GAAG,CAAC,SAAS,EACxB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,gBAEX,GAAG,CAAC,KAAK,KARL,KAAK,CASA,CACb,CAAC;wBACJ,CAAC,CAAC,IACC,EACL,uBAAK,SAAS,EAAC,yEAAyE,gBACtF,uBAAK,SAAS,EAAC,eAAe,gBAC5B,uBAAK,SAAS,EAAC,uBAAuB,gBAAE,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,IAAO,IAC/D,IACF,KACF,IACF,GACL,CACJ,CAAC;AACJ,CAAC"}

package/dist/stories/StyledTabContentWrapper.d.ts

@@ -3,6 +3,7 @@ export interface StyledTabContentWrapperProps extends PropsWithChildren {
     showBackArrow?: boolean;
     leftBorder?: boolean;
     onBackClick?: () => void;
+    className?: string;
 }
-export default function StyledTabContentWrapper({ showBackArrow, leftBorder, children, onBackClick, }: StyledTabContentWrapperProps): import("react/jsx-runtime").JSX.Element;
+export default function StyledTabContentWrapper({ showBackArrow, leftBorder, children, onBackClick, className, }: StyledTabContentWrapperProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=StyledTabContentWrapper.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"StyledTabContentWrapper.d.ts","sourceRoot":"","sources":["../../src/stories/StyledTabContentWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAI1C,MAAM,WAAW,4BAA6B,SAAQ,iBAAiB;IACrE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,EAC9C,aAAqB,EACrB,UAAkB,EAClB,QAAQ,EACR,WAAW,GACZ,EAAE,4BAA4B,2CAW9B"}
+{"version":3,"file":"StyledTabContentWrapper.d.ts","sourceRoot":"","sources":["../../src/stories/StyledTabContentWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAI1C,MAAM,WAAW,4BAA6B,SAAQ,iBAAiB;IACrE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,EAC9C,aAAqB,EACrB,UAAkB,EAClB,QAAQ,EACR,WAAW,EACX,SAAc,GACf,EAAE,4BAA4B,2CAW9B"}

package/dist/stories/StyledTabContentWrapper.js

@@ -13,7 +13,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { IconVariant } from './DfxIcon';
 import StyledIconButton from './StyledIconButton';
 export default function StyledTabContentWrapper(_a) {
-    var _b = _a.showBackArrow, showBackArrow = _b === void 0 ? false : _b, _c = _a.leftBorder, leftBorder = _c === void 0 ? false : _c, children = _a.children, onBackClick = _a.onBackClick;
-    return (_jsxs("div", __assign({ className: "w-full ".concat(leftBorder ? 'border-l border-dfxGray-400' : '') }, { children: [showBackArrow && onBackClick && (_jsx("div", __assign({ className: "absolute" }, { children: _jsx(StyledIconButton, { icon: IconVariant.BACK, onClick: onBackClick }) }))), _jsx("div", __assign({ className: "m-auto max-w-lg" }, { children: children }))] })));
+    var _b = _a.showBackArrow, showBackArrow = _b === void 0 ? false : _b, _c = _a.leftBorder, leftBorder = _c === void 0 ? false : _c, children = _a.children, onBackClick = _a.onBackClick, _d = _a.className, className = _d === void 0 ? '' : _d;
+    return (_jsxs("div", __assign({ className: "w-full ".concat(leftBorder ? 'border-l border-dfxGray-400' : '') }, { children: [showBackArrow && onBackClick && (_jsx("div", __assign({ className: "absolute" }, { children: _jsx(StyledIconButton, { icon: IconVariant.BACK, onClick: onBackClick }) }))), _jsx("div", __assign({ className: "m-auto max-w-lg ".concat(className) }, { children: children }))] })));
 }
 //# sourceMappingURL=StyledTabContentWrapper.js.map

package/dist/stories/StyledTabContentWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"StyledTabContentWrapper.js","sourceRoot":"","sources":["../../src/stories/StyledTabContentWrapper.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,gBAAgB,MAAM,oBAAoB,CAAC;AAQlD,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,EAKjB;QAJ7B,qBAAqB,EAArB,aAAa,mBAAG,KAAK,KAAA,EACrB,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA,EAClB,QAAQ,cAAA,EACR,WAAW,iBAAA;IAEX,OAAO,CACL,wBAAK,SAAS,EAAE,iBAAU,UAAU,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,EAAE,CAAE,iBACxE,aAAa,IAAI,WAAW,IAAI,CAC/B,uBAAK,SAAS,EAAC,UAAU,gBACvB,KAAC,gBAAgB,IAAC,IAAI,EAAE,WAAW,CAAC,IAAI,EAAE,OAAO,EAAE,WAAW,GAAI,IAC9D,CACP,EACD,uBAAK,SAAS,EAAC,iBAAiB,gBAAE,QAAQ,IAAO,KAC7C,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"StyledTabContentWrapper.js","sourceRoot":"","sources":["../../src/stories/StyledTabContentWrapper.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,gBAAgB,MAAM,oBAAoB,CAAC;AASlD,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,EAMjB;QAL7B,qBAAqB,EAArB,aAAa,mBAAG,KAAK,KAAA,EACrB,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA,EAClB,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA;IAEd,OAAO,CACL,wBAAK,SAAS,EAAE,iBAAU,UAAU,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,EAAE,CAAE,iBACxE,aAAa,IAAI,WAAW,IAAI,CAC/B,uBAAK,SAAS,EAAC,UAAU,gBACvB,KAAC,gBAAgB,IAAC,IAAI,EAAE,WAAW,CAAC,IAAI,EAAE,OAAO,EAAE,WAAW,GAAI,IAC9D,CACP,EACD,uBAAK,SAAS,EAAE,0BAAmB,SAAS,CAAE,gBAAG,QAAQ,IAAO,KAC5D,CACP,CAAC;AACJ,CAAC"}

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { ControlProps } from './Form';
+interface StyledDateAndTimePickerProps extends ControlProps {
+    hideLabel?: boolean;
+    smallLabel?: boolean;
+}
+declare const StyledDateAndTimePicker: import("react").ForwardRefExoticComponent<StyledDateAndTimePickerProps & import("react").RefAttributes<HTMLDivElement>>;
+export default StyledDateAndTimePicker;
+//# sourceMappingURL=StyledDateAndTimePicker.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDateAndTimePicker.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledDateAndTimePicker.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAEtC,UAAU,4BAA6B,SAAQ,YAAY;IACzD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAOD,QAAA,MAAM,uBAAuB,yHAW5B,CAAC;AAoHF,eAAe,uBAAuB,CAAC"}

package/dist/stories/form/StyledDateAndTimePicker.js

@@ -0,0 +1,65 @@
+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 { forwardRef, useState, useEffect } from 'react';
+import { Controller } from 'react-hook-form';
+var StyledDateAndTimePicker = forwardRef(function (props, ref) {
+    return (_jsx(Controller, { control: props.control, render: function (_a) {
+            var _b = _a.field, onChange = _b.onChange, value = _b.value;
+            return _jsx(Content, __assign({}, props, { onChange: onChange, value: value }));
+        }, name: props.name, rules: props.rules }));
+});
+var Content = forwardRef(function (_a, ref) {
+    var control = _a.control, name = _a.name, label = _a.label, rules = _a.rules, disabled = _a.disabled, error = _a.error, hideLabel = _a.hideLabel, smallLabel = _a.smallLabel, onChange = _a.onChange, value = _a.value, props = __rest(_a, ["control", "name", "label", "rules", "disabled", "error", "hideLabel", "smallLabel", "onChange", "value"]);
+    var _b = useState(''), selectedDateTime = _b[0], setSelectedDateTime = _b[1];
+    useEffect(function () {
+        var toLocalISOString = function (date) {
+            var tzoffset = date.getTimezoneOffset() * 60000;
+            return new Date(date.getTime() - tzoffset).toISOString().slice(0, -5);
+        };
+        if (value) {
+            var localISOTime = toLocalISOString(value);
+            setSelectedDateTime(localISOTime);
+        }
+        else {
+            var now = new Date();
+            now.setHours(now.getHours() + 1);
+            now.setMinutes(now.getMinutes() + 1);
+            now.setSeconds(0);
+            var defaultDateTime = toLocalISOString(now);
+            setSelectedDateTime(defaultDateTime);
+            onChange(now);
+        }
+    }, [value, onChange]);
+    var handleDateTimeChange = function (event) {
+        var dateTime = event.target.value;
+        setSelectedDateTime(dateTime);
+        var newDate = new Date(dateTime);
+        if (!isNaN(newDate.getTime())) {
+            onChange(newDate);
+        }
+    };
+    return (_jsxs(_Fragment, { children: [_jsx("style", { children: "\n          input::-webkit-datetime-edit-day-field:focus,\n          input::-webkit-datetime-edit-month-field:focus,\n          input::-webkit-datetime-edit-year-field:focus {\n              background-color: #f5516c; /* text-dfxRed-100 */\n              color: white;\n              outline: none;\n          }\n\n          input::-webkit-datetime-edit-hour-field:focus,\n          input::-webkit-datetime-edit-minute-field:focus,\n          input::-webkit-datetime-edit-second-field:focus {\n              background-color: #f5516c;\n              color: white;\n              outline: none;\n          }\n\n          .custom-date-input,\n          .custom-time-input {\n            color: ".concat(error ? '#f5516c' : '#2a4365', "; /* text-dfxRed-100 or text-dfxBlue-800 */\n          }\n\n          .custom-date-input::placeholder,\n          .custom-time-input::placeholder {\n            color: #a0aec0; /* text-dfxGray-600 */\n          }\n        ") }), _jsx("div", __assign({}, props, { className: "flex flex-col gap-4 w-full" }, { children: _jsx("div", __assign({ className: "flex flex-row gap-4" }, { children: _jsxs("div", __assign({ className: "flex-1" }, { children: [label && (_jsx("label", __assign({ hidden: hideLabel, className: "text-start ".concat(smallLabel ? 'text-sm' : 'text-base', " font-semibold pl-3 text-dfxBlue-800") }, { children: label }))), _jsx("div", { className: "h-1" }), _jsx("input", { ref: ref, type: "datetime-local", value: selectedDateTime, onChange: handleDateTimeChange, step: "1", disabled: disabled, onKeyDown: function (e) { return e.preventDefault(); }, className: "custom-date-input text-base font-normal rounded-md p-4 w-full bg-white border border-dfxGray-500 focus:outline-dfxBlue-800 ".concat(disabled ? 'opacity-50 cursor-not-allowed focus:outline-none' : '') })] })) })) })), error && _jsx("p", __assign({ className: "text-start text-sm text-dfxRed-100 pl-3" }, { children: error === null || error === void 0 ? void 0 : error.message }))] }));
+});
+export default StyledDateAndTimePicker;
+//# sourceMappingURL=StyledDateAndTimePicker.js.map

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"StyledDropdown.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAC/D,OAAgB,EAAuB,WAAW,EAAE,MAAM,YAAY,CAAC;AAEvE,OAAqB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAGjE,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;IAC9C,OAAO,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;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,OAAO,EACP,WAAW,EACX,qBAAqB,EACrB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,CAAC,CAAC,CAAC,2CA8IxB"}
+{"version":3,"file":"StyledDropdown.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAC/D,OAAgB,EAAuB,WAAW,EAAE,MAAM,YAAY,CAAC;AAEvE,OAAqB,EAAiB,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAGhF,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;IAC9C,OAAO,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;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,OAAO,EACP,WAAW,EACX,qBAAqB,EACrB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,CAAC,CAAC,CAAC,2CAoJxB"}

package/dist/stories/form/StyledDropdown.js

@@ -54,10 +54,13 @@ export default function StyledDropdown(_a) {
     }
     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: [label && (_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({ ref: buttonRef, 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 h-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: "".concat(error ? 'text-dfxRed-100' : 'text-dfxBlue-800', " leading-none font-semibold flex justify-between ").concat(!descriptionFunc && !assetIconFunc ? 'py-[0.25rem]' : '') }, { children: [labelFunc(value), balanceFunc && !hideBalanceWhenClosed && _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({ ref: dropdownRef, className: "absolute bg-white rounded-b border-x border-b border-dfxGray-500 w-full z-10 overflow-y-auto max-h-[15rem]" }, { children: items.map(function (item, index) { return (_jsx("button", __assign({ type: "button", onClick: function () {
-                                onChange(item);
-                                setIsOpen(false);
-                            }, className: "flex flex-col gap-2 justify-between text-left w-full hover:bg-dfxGray-400/50 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)); }) }))), error && _jsx("p", __assign({ className: "text-start text-sm text-dfxRed-100 pl-3" }, { children: error === null || error === void 0 ? void 0 : error.message }))] })));
+            return (_jsxs("div", __assign({ className: "relative ".concat(full ? 'w-full' : '') }, { children: [label && (_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({ ref: buttonRef, 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-3 items-center w-full h-full" }, { children: [value != null && assetIconFunc && _jsx(DfxAssetIcon, { asset: assetIconFunc(value) }), _jsx("div", __assign({ className: "flex flex-col gap-1 justify-between text-left w-full pt-0.5" }, { 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: "".concat(error ? 'text-dfxRed-100' : 'text-dfxBlue-800', " leading-none font-semibold flex justify-between ").concat(!descriptionFunc && !assetIconFunc ? 'py-[0.25rem]' : '') }, { children: [_jsx("p", __assign({ className: "line-clamp-1 pb-0.5" }, { children: labelFunc(value) })), balanceFunc && !hideBalanceWhenClosed && _jsx("p", { children: balanceFunc(value) })] })), descriptionFunc && (_jsxs("span", __assign({ className: "text-dfxGray-800 text-xs h-min leading-tight flex justify-between" }, { children: [_jsx("p", __assign({ className: "pb-0.5 line-clamp-1 leading-tight" }, { 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({ ref: dropdownRef, className: "absolute bg-white rounded-b border-x border-b border-dfxGray-500 w-full z-10 overflow-y-auto max-h-[15rem]" }, { children: items.map(function (item, index) {
+                            var isSelected = value !== undefined && JSON.stringify(value) === JSON.stringify(item);
+                            return (_jsx("button", __assign({ type: "button", onClick: function () {
+                                    onChange(item);
+                                    setIsOpen(false);
+                                }, className: "flex flex-col gap-2 justify-between text-left w-full hover:bg-dfxGray-400 px-3.5 py-2.5 ".concat(isSelected ? 'bg-dfxGray-400/50' : '') }, { children: _jsxs("div", __assign({ className: "flex flex-row gap-3 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));
+                        }) }))), error && _jsx("p", __assign({ className: "text-start text-sm text-dfxRed-100 pl-3" }, { children: error === null || error === void 0 ? void 0 : error.message }))] })));
         }, name: name, rules: rules }));
 }
 //# sourceMappingURL=StyledDropdown.js.map

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

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

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

@@ -0,0 +1,21 @@
+import { ControlProps } from './Form';
+import { RefObject } from 'react';
+import { IconVariant } from '../DfxIcon';
+import { AssetIconVariant } from '../DfxAssetIcon';
+export interface StyledDropdownMultiChoiceProps<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;
+    rootRef?: RefObject<HTMLElement>;
+    forceEnable?: boolean;
+    hideBalanceWhenClosed?: boolean;
+}
+export default function StyledDropdownMultiChoice<T>({ label, labelIcon, control, name, rules, disabled, items, placeholder, full, smallLabel, labelFunc, balanceFunc, descriptionFunc, priceFunc, assetIconFunc, rootRef, forceEnable, hideBalanceWhenClosed, error, ...props }: StyledDropdownMultiChoiceProps<T>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StyledDropdownMultiChoice.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StyledDropdownMultiChoice.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledDropdownMultiChoice.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAC/D,OAAgB,EAAuB,WAAW,EAAE,MAAM,YAAY,CAAC;AAEvE,OAAqB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAGjE,MAAM,WAAW,8BAA8B,CAAC,CAAC,CAAE,SAAQ,YAAY;IACrE,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;IAC9C,OAAO,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAC,CAAC,EAAE,EACnD,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,OAAO,EACP,WAAW,EACX,qBAAqB,EACrB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,8BAA8B,CAAC,CAAC,CAAC,2CAyJnC"}

package/dist/stories/form/StyledDropdownMultiChoice.js

@@ -0,0 +1,81 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import DfxIcon, { IconColor, IconSize, IconVariant } from '../DfxIcon';
+import { Controller } from 'react-hook-form';
+import DfxAssetIcon from '../DfxAssetIcon';
+import { Utils } from '../../utils';
+export default function StyledDropdownMultiChoice(_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, rootRef = _a.rootRef, forceEnable = _a.forceEnable, hideBalanceWhenClosed = _a.hideBalanceWhenClosed, error = _a.error, props = __rest(_a, ["label", "labelIcon", "control", "name", "rules", "disabled", "items", "placeholder", "full", "smallLabel", "labelFunc", "balanceFunc", "descriptionFunc", "priceFunc", "assetIconFunc", "rootRef", "forceEnable", "hideBalanceWhenClosed", "error"]);
+    var buttonRef = useRef(null);
+    var dropdownRef = useRef(null);
+    var _b = useState(false), isOpen = _b[0], setIsOpen = _b[1];
+    var buttonClasses = 'flex justify-between items-center border border-dfxGray-500 px-4 py-2 shadow-sm w-full min-h-[58px]';
+    isOpen ? (buttonClasses += ' rounded-x rounded-t bg-dfxGray-400/50') : (buttonClasses += ' rounded');
+    var isDisabled = disabled || (items.length <= 1 && !forceEnable);
+    useEffect(function () {
+        var _a;
+        var element = (_a = rootRef === null || rootRef === void 0 ? void 0 : rootRef.current) !== null && _a !== void 0 ? _a : document;
+        if (element) {
+            element.addEventListener('mousedown', closeDropdown);
+            return function () { return element.removeEventListener('mousedown', closeDropdown); };
+        }
+    }, [rootRef, isOpen]);
+    function closeDropdown(e) {
+        if (isOpen &&
+            Utils.isNode(e.target) &&
+            dropdownRef.current &&
+            !dropdownRef.current.contains(e.target) &&
+            buttonRef.current &&
+            !buttonRef.current.contains(e.target)) {
+            setIsOpen(false);
+        }
+    }
+    return (_jsx(Controller, { control: control, render: function (_a) {
+            var _b = _a.field, onChange = _b.onChange, onBlur = _b.onBlur, value = _b.value;
+            var selectedItems = value || [];
+            var isEqual = function (a, b) { return JSON.stringify(a) === JSON.stringify(b); };
+            var toggleSelection = function (item) {
+                var isSelected = selectedItems.some(function (selected) { return isEqual(selected, item); });
+                var newValue = isSelected
+                    ? selectedItems.filter(function (selected) { return !isEqual(selected, item); })
+                    : __spreadArray(__spreadArray([], selectedItems, true), [item], false);
+                onChange(newValue);
+            };
+            return (_jsxs("div", __assign({ className: "relative ".concat(full ? 'w-full' : '') }, { children: [label && (_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 }))] }))), _jsx("button", __assign({ ref: buttonRef, 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 h-full" }, { children: [selectedItems.length > 0 && assetIconFunc && _jsx(DfxAssetIcon, { asset: assetIconFunc(selectedItems[0]) }), _jsx("div", __assign({ className: "flex flex-col gap-1 justify-between text-left w-full" }, { children: selectedItems.length === 0 ? (_jsx("p", __assign({ className: "text-dfxGray-600 drop-shadow-none py-[0.25rem]" }, { children: placeholder }))) : (_jsx(_Fragment, { children: _jsx("span", __assign({ className: "".concat(error ? 'text-dfxRed-100' : 'text-dfxBlue-800', " leading-none font-semibold flex justify-between ").concat(!descriptionFunc && !assetIconFunc ? 'py-[0.25rem]' : '') }, { children: selectedItems.map(function (item) { return labelFunc(item); }).join(', ') })) })) })), !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({ ref: dropdownRef, className: "absolute bg-white rounded-b border-x border-b border-dfxGray-500 w-full z-10 overflow-y-auto max-h-[15rem]" }, { children: items.map(function (item, index) {
+                            var isSelected = selectedItems.some(function (selected) { return isEqual(selected, item); });
+                            return (_jsx("button", __assign({ type: "button", onClick: function () { return toggleSelection(item); }, className: "flex flex-col gap-2 justify-between text-left w-full px-3.5 py-2.5 hover:bg-dfxGray-400 ".concat(isSelected ? 'bg-dfxGray-400/50' : '') }, { 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));
+                        }) }))), error && _jsx("p", __assign({ className: "text-start text-sm text-dfxRed-100 pl-3" }, { children: error === null || error === void 0 ? void 0 : error.message }))] })));
+        }, name: name, rules: rules }));
+}
+//# sourceMappingURL=StyledDropdownMultiChoice.js.map

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

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

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

@@ -15,6 +15,7 @@ interface StyledInputProps extends ControlProps {
     small?: boolean;
     smallLabel?: boolean;
     autocomplete?: string;
+    multiLine?: boolean;
 }
 declare const StyledInput: import("react").ForwardRefExoticComponent<StyledInputProps & import("react").RefAttributes<HTMLInputElement>>;
 export default StyledInput;

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

@@ -1 +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,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,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;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAMD,QAAA,MAAM,WAAW,+GA8GhB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"StyledInput.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,sBAAsB,EAAa,MAAM,OAAO,CAAC;AAGtE,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,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,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;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAMD,QAAA,MAAM,WAAW,+GAsHhB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/stories/form/StyledInput.js

@@ -30,7 +30,7 @@ function getMargin(affix) {
     return 12 + ((_a = affix === null || affix === void 0 ? void 0 : affix.length) !== null && _a !== void 0 ? _a : 0) * 14;
 }
 var StyledInput = forwardRef(function (_a, ref) {
-    var control = _a.control, name = _a.name, autocomplete = _a.autocomplete, 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, buttonLabel = _a.buttonLabel, buttonClick = _a.buttonClick, _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", "autocomplete", "label", "rules", "disabled", "error", "type", "placeholder", "prefix", "buttonLabel", "buttonClick", "forceError", "forceErrorMessage", "hideLabel", "darkTheme", "loading", "full", "small", "smallLabel"]);
+    var control = _a.control, name = _a.name, autocomplete = _a.autocomplete, 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, buttonLabel = _a.buttonLabel, buttonClick = _a.buttonClick, _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, multiLine = _a.multiLine, props = __rest(_a, ["control", "name", "autocomplete", "label", "rules", "disabled", "error", "type", "placeholder", "prefix", "buttonLabel", "buttonClick", "forceError", "forceErrorMessage", "hideLabel", "darkTheme", "loading", "full", "small", "smallLabel", "multiLine"]);
     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';
@@ -41,8 +41,9 @@ var StyledInput = forwardRef(function (_a, ref) {
     var textOrErrorColor = error || 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: [label && (_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 ".concat(prefix.length > 0 ? 'left-3' : '', " flex justify-center items-center h-[3.6rem]") }, { children: _jsx("p", { children: prefix }) }))), loading && (_jsx("div", __assign({ className: "absolute right-3 h-w-8 flex justify-center items-center h-[3.6rem]" }, { children: _jsx(StyledLoadingSpinner, {}) }))), buttonLabel && !loading && (_jsx("div", __assign({ className: "text-dfxRed-100 absolute ".concat(buttonLabel.length > 0 ? 'right-3' : '', " flex justify-center items-center h-[3.6rem]") }, { children: _jsx("button", __assign({ type: "button", onClick: buttonClick }, { children: buttonLabel })) }))), _jsx("input", __assign({ className: "text-base font-normal rounded-md p-4 ".concat(small ? 'w-24' : 'w-full', " ") +
-                                    [textOrErrorColor, backgroundColor, placeholderColor, borderColor, outlineColor].join(' '), style: { paddingLeft: paddingLeft, paddingRight: paddingRight }, type: type, name: autocomplete !== null && autocomplete !== void 0 ? autocomplete : name, 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 })))] })));
+            var inputProps = __assign({ className: "text-base font-normal rounded-md p-4 ".concat(small ? 'w-24' : 'w-full', " ") +
+                    [textOrErrorColor, backgroundColor, placeholderColor, borderColor, outlineColor].join(' '), style: { paddingLeft: paddingLeft, paddingRight: paddingRight }, type: type, name: autocomplete, 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);
+            return (_jsxs(StyledVerticalStack, __assign({ gap: 1, full: full }, { children: [label && (_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 ".concat(prefix.length > 0 ? 'left-3' : '', " flex justify-center items-center h-[3.6rem]") }, { children: _jsx("p", { children: prefix }) }))), loading && (_jsx("div", __assign({ className: "absolute right-3 h-w-8 flex justify-center items-center h-[3.6rem]" }, { children: _jsx(StyledLoadingSpinner, {}) }))), buttonLabel && !loading && (_jsx("div", __assign({ className: "text-dfxRed-100 absolute ".concat(buttonLabel.length > 0 ? 'right-3' : '', " flex justify-center items-center h-[3.6rem]") }, { children: _jsx("button", __assign({ type: "button", onClick: buttonClick }, { children: buttonLabel })) }))), multiLine ? (_jsx("textarea", __assign({}, inputProps))) : (_jsx("input", __assign({}, inputProps)))] })), (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;

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

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

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

@@ -1,12 +1,12 @@
 /// <reference types="react" />
 import { Noop } from 'react-hook-form';
 export interface StyledModalButtonProps {
-    label?: string;
     onClick: () => void;
     onBlur: Noop;
+    label?: string;
     value?: string;
     description?: string;
     placeholder: string;
 }
-export default function StyledModalButton({ label, onClick, onBlur, value, description, placeholder, ...props }: StyledModalButtonProps): JSX.Element;
+export default function StyledModalButton({ onClick, onBlur, label, value, description, placeholder, ...props }: StyledModalButtonProps): JSX.Element;
 //# sourceMappingURL=StyledModalButton.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"StyledModalButton.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledModalButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAIvC,MAAM,WAAW,sBAAsB;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,KAAK,EACL,OAAO,EACP,MAAM,EACN,KAAK,EACL,WAAW,EACX,WAAW,EACX,GAAG,KAAK,EACT,EAAE,sBAAsB,GAAG,GAAG,CAAC,OAAO,CA6BtC"}
+{"version":3,"file":"StyledModalButton.d.ts","sourceRoot":"","sources":["../../../src/stories/form/StyledModalButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAIvC,MAAM,WAAW,sBAAsB;IACrC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,OAAO,EACP,MAAM,EACN,KAAK,EACL,KAAK,EACL,WAAW,EACX,WAAW,EACX,GAAG,KAAK,EACT,EAAE,sBAAsB,GAAG,GAAG,CAAC,OAAO,CA6BtC"}

package/dist/stories/form/StyledModalButton.js

@@ -24,7 +24,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import StyledVerticalStack from '../layout-helpers/StyledVerticalStack';
 import DfxIcon, { IconSize, IconVariant } from '../DfxIcon';
 export default function StyledModalButton(_a) {
-    var label = _a.label, onClick = _a.onClick, onBlur = _a.onBlur, value = _a.value, description = _a.description, placeholder = _a.placeholder, props = __rest(_a, ["label", "onClick", "onBlur", "value", "description", "placeholder"]);
-    return (_jsxs(StyledVerticalStack, __assign({ gap: 1 }, { children: [_jsx("label", __assign({ className: "text-dfxBlue-800 text-base font-semibold pl-4 text-start" }, { children: label })), _jsxs("button", __assign({ type: "button", className: "flex justify-between border border-dfxGray-400 text-base font-normal rounded-md px-4 py-2 shadow-sm w-full h-[58px]", onClick: onClick, onBlur: onBlur }, props, { children: [_jsx("div", __assign({ className: "h-full flex flex-col justify-center text-left gap-1" }, { children: value ? (_jsxs(_Fragment, { children: [description && _jsx("span", __assign({ className: "text-dfxGray-800 text-xs h-min leading-none" }, { children: description })), _jsx("span", __assign({ className: 'text-dfxBlue-800 leading-none font-base'.concat(description ? '' : ' py-2') }, { children: value }))] })) : (_jsx("span", __assign({ className: "text-dfxGray-600" }, { children: placeholder }))) })), _jsx("div", __assign({ className: "place-self-center" }, { children: _jsx(DfxIcon, { icon: IconVariant.UNFOLD_MORE, size: IconSize.LG }) }))] }))] })));
+    var onClick = _a.onClick, onBlur = _a.onBlur, label = _a.label, value = _a.value, description = _a.description, placeholder = _a.placeholder, props = __rest(_a, ["onClick", "onBlur", "label", "value", "description", "placeholder"]);
+    return (_jsxs(StyledVerticalStack, __assign({ gap: 1 }, { children: [label && _jsx("label", __assign({ className: "text-dfxBlue-800 text-base font-semibold pl-4 text-start" }, { children: label })), _jsxs("button", __assign({ type: "button", className: "flex justify-between border border-dfxGray-400 text-base font-normal rounded-md px-4 py-2 shadow-sm w-full h-[58px]", onClick: onClick, onBlur: onBlur }, props, { children: [_jsx("div", __assign({ className: "h-full flex flex-col justify-center text-left gap-1" }, { children: value ? (_jsxs(_Fragment, { children: [description && _jsx("span", __assign({ className: "text-dfxGray-800 text-xs h-min leading-none" }, { children: description })), _jsx("span", __assign({ className: 'text-dfxBlue-800 leading-none font-base'.concat(description ? '' : ' py-2') }, { children: value }))] })) : (_jsx("span", __assign({ className: "text-dfxGray-600" }, { children: placeholder }))) })), _jsx("div", __assign({ className: "place-self-center" }, { children: _jsx(DfxIcon, { icon: IconVariant.UNFOLD_MORE, size: IconSize.LG }) }))] }))] })));
 }
 //# sourceMappingURL=StyledModalButton.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"StyledModalButton.js","sourceRoot":"","sources":["../../../src/stories/form/StyledModalButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,mBAAmB,MAAM,uCAAuC,CAAC;AACxE,OAAO,OAAO,EAAE,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAW5D,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EAQjB;IAPvB,IAAA,KAAK,WAAA,EACL,OAAO,aAAA,EACP,MAAM,YAAA,EACN,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,WAAW,iBAAA,EACR,KAAK,cAPgC,qEAQzC,CADS;IAER,OAAO,CACL,MAAC,mBAAmB,aAAC,GAAG,EAAE,CAAC,iBACzB,yBAAO,SAAS,EAAC,0DAA0D,gBAAE,KAAK,IAAS,EAC3F,2BACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,qHAAqH,EAC/H,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,IACV,KAAK,eAET,uBAAK,SAAS,EAAC,qDAAqD,gBACjE,KAAK,CAAC,CAAC,CAAC,CACP,8BACG,WAAW,IAAI,wBAAM,SAAS,EAAC,6CAA6C,gBAAE,WAAW,IAAQ,EAClG,wBAAM,SAAS,EAAE,yCAAyC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,gBAC1F,KAAK,IACD,IACN,CACJ,CAAC,CAAC,CAAC,CACF,wBAAM,SAAS,EAAC,kBAAkB,gBAAE,WAAW,IAAQ,CACxD,IACG,EACN,uBAAK,SAAS,EAAC,mBAAmB,gBAChC,KAAC,OAAO,IAAC,IAAI,EAAE,WAAW,CAAC,WAAW,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,GAAI,IACzD,KACC,KACW,CACvB,CAAC;AACJ,CAAC"}
+{"version":3,"file":"StyledModalButton.js","sourceRoot":"","sources":["../../../src/stories/form/StyledModalButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,mBAAmB,MAAM,uCAAuC,CAAC;AACxE,OAAO,OAAO,EAAE,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAW5D,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EAQjB;IAPvB,IAAA,OAAO,aAAA,EACP,MAAM,YAAA,EACN,KAAK,WAAA,EACL,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,WAAW,iBAAA,EACR,KAAK,cAPgC,qEAQzC,CADS;IAER,OAAO,CACL,MAAC,mBAAmB,aAAC,GAAG,EAAE,CAAC,iBACxB,KAAK,IAAI,yBAAO,SAAS,EAAC,0DAA0D,gBAAE,KAAK,IAAS,EACrG,2BACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,qHAAqH,EAC/H,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,IACV,KAAK,eAET,uBAAK,SAAS,EAAC,qDAAqD,gBACjE,KAAK,CAAC,CAAC,CAAC,CACP,8BACG,WAAW,IAAI,wBAAM,SAAS,EAAC,6CAA6C,gBAAE,WAAW,IAAQ,EAClG,wBAAM,SAAS,EAAE,yCAAyC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,gBAC1F,KAAK,IACD,IACN,CACJ,CAAC,CAAC,CAAC,CACF,wBAAM,SAAS,EAAC,kBAAkB,gBAAE,WAAW,IAAQ,CACxD,IACG,EACN,uBAAK,SAAS,EAAC,mBAAmB,gBAChC,KAAC,OAAO,IAAC,IAAI,EAAE,WAAW,CAAC,WAAW,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,GAAI,IACzD,KACC,KACW,CACvB,CAAC;AACJ,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "private": false,
   "name": "@dfx.swiss/react-components",
-  "version": "1.3.0-beta.2",
+  "version": "1.3.0-beta.200",
   "license": "MIT",
   "publishConfig": {
     "access": "public"
@@ -32,7 +32,8 @@
     "build": "tsc -b ./tsconfig.build.json",
     "storybook": "start-storybook -p 6006 -s public",
     "build-storybook": "build-storybook -s public",
-    "clean": "rm -rf ./dist/ && rm -rf ./tsconfig.build.tsbuildinfo"
+    "clean": "rm -rf ./dist/ && rm -rf ./tsconfig.build.tsbuildinfo",
+    "pack": "npm pack"
   },
   "eslintConfig": {
     "extends": [
@@ -88,5 +89,5 @@
     "tailwindcss": "^3.2.4",
     "webpack": "^5.75.0"
   },
-  "gitHead": "ccc11b7984d50eaa82e83eafeffd4592b1592fbb"
+  "gitHead": "cb4cd1f47bdc05da90f636fa65d0ce710060c3fe"
 }