@kirill.konshin/bootstrap 0.0.1 → 0.0.3

package/dist/screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"screen.js","sources":["../src/screen.tsx"],"sourcesContent":["import React, { FC, memo } from 'react';\nimport { Button, Navbar, Nav, Stack } from 'react-bootstrap';\nimport { useBreakpoint } from './responsiveHelper';\nimport { AdaptiveContainer } from './adaptiveContainer';\n\nexport type ScreenProps = {\n    backBtn?: any;\n    backCb?: any;\n    backIcon?: any;\n    forwardBtn?: any;\n    forwardIcon?: any;\n    forwardCb?: any;\n    children: any;\n    contentClassName?: string;\n    noContentPadding?: boolean;\n    header?: any; // resides on top panel in mobile, does not scroll, before content on desktop\n    footer?: any; // resides on bottom menu panel in mobile, does not scroll, or after content on desktop\n    menu?: any;\n    title?: any;\n    centerContent?: boolean;\n    noHeader?: boolean;\n    noFooter?: boolean;\n    noMenu?: boolean;\n    // noFolders?: boolean;\n};\n\n//TODO Footer -> menu\nexport const Screen: FC<ScreenProps> = memo(function Screen({\n    backBtn,\n    backCb,\n    backIcon,\n    forwardBtn,\n    forwardIcon,\n    forwardCb,\n    footer,\n    menu,\n    header,\n    children,\n    noContentPadding = false,\n    contentClassName = '',\n    title = '',\n    centerContent = false,\n    noHeader = false,\n    noFooter = false,\n    noMenu = false,\n    // noFolders = false,\n}) {\n    // const router = useRouter();\n\n    backBtn =\n        backBtn ||\n        (backCb ? (\n            // backCb === true ? () => router.back() : backCb\n            <Button onClick={backCb} variant=\"nav\">\n                {\n                    <>\n                        <span className={backIcon || 'bi-chevron-left icon-thick'} />\n                        <span className=\"d-none d-lg-inline ms-2\">Back</span>\n                    </>\n                }\n            </Button>\n        ) : null);\n\n    forwardBtn =\n        forwardBtn ||\n        (forwardCb ? (\n            <Button onClick={forwardCb}>{forwardIcon ? <span className={forwardIcon}></span> : 'Next'}</Button>\n        ) : null);\n\n    const { isMobile, isDesktop } = useBreakpoint();\n\n    // useLoadingTimeout(1000); // less jerky UI\n\n    return (\n        <div className={`d-flex flex-column flex-grow-1 flex-lg-grow-0 ${isMobile ? 'vh-100' : ''}`} data-id=\"screen\">\n            {/* HEADER */}\n\n            {/* FIXME postition fixed does not assign z-index automatically https://getbootstrap.com/docs/4.0/layout/overview/#z-index*/}\n            {!noHeader && (\n                <header className={isDesktop ? '' : 'shadow-sm border-bottom'} data-id=\"header\">\n                    {/* {!noFolders && <FolderBar />} */}\n\n                    {/* {isDesktop && !noFooter && <Footer />} */}\n                    {isDesktop && !noMenu && menu}\n\n                    {title && (\n                        // (isDesktop ? 'border-bottom' : '')\n                        <Navbar expand className=\"main-nav\">\n                            <AdaptiveContainer className=\"gap-2\">\n                                {backBtn && <Nav className=\"hstack gap-3\">{backBtn}</Nav>}\n                                <Navbar.Brand className=\"me-auto\">{title}</Navbar.Brand>\n                                {forwardBtn && <Nav className=\"hstack gap-3\">{forwardBtn}</Nav>}\n                            </AdaptiveContainer>\n                        </Navbar>\n                    )}\n\n                    {header}\n                </header>\n            )}\n\n            {/* CONTENT */}\n\n            <AdaptiveContainer\n                as=\"main\"\n                className={[\n                    isMobile ? 'overflow-y-auto overflow-x-hidden' : 'gap-3',\n                    `flex-grow-1 d-flex flex-column`,\n                    centerContent ? 'align-items-center justify-content-center' : 'justify-content-start',\n                    contentClassName,\n                    noContentPadding ? 'p-0' : 'py-3',\n                ]\n                    .filter(Boolean)\n                    .join(' ')}\n                data-id=\"content\"\n            >\n                {children}\n\n                {/* Repeat screen buttons at the bottom on desktop */}\n                {isDesktop && !noFooter && (\n                    <>\n                        {footer}\n\n                        {/* TODO Possibly introduce a prop desktopFooterBeforeButtons */}\n                        {(forwardBtn || backBtn) && (\n                            // Navbar screws up the popper\n                            <Stack gap={3} direction=\"horizontal\">\n                                {/* No container since already in container */}\n                                {backBtn && <Nav className=\"hstack gap-3\">{backBtn}</Nav>}\n                                {forwardBtn && <Nav className=\"hstack gap-3 flex-grow-1\">{forwardBtn}</Nav>}\n                            </Stack>\n                        )}\n                    </>\n                )}\n            </AdaptiveContainer>\n\n            {/* FOOTER */}\n\n            {!noMenu && !noFooter && (\n                <footer className=\"shadow-lg border-top d-block d-lg-none\" data-id=\"footer\">\n                    {!noFooter && footer}\n                    {!noMenu && menu}\n                </footer>\n            )}\n        </div>\n    );\n});\n"],"names":["Screen"],"mappings":";;;;;AA2BO,MAAM,SAA0B,KAAK,SAASA,QAAO;AAAA,EACxD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB,mBAAmB;AAAA,EACnB,QAAQ;AAAA,EACR,gBAAgB;AAAA,EAChB,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA;AAEb,GAAG;AAGC,YACI,YACC;AAAA;AAAA,wBAEI,QAAA,EAAO,SAAS,QAAQ,SAAQ,OAEzB,UAAA,qBAAA,UAAA,EACI,UAAA;AAAA,MAAA,oBAAC,QAAA,EAAK,WAAW,YAAY,6BAAA,CAA8B;AAAA,MAC3D,oBAAC,QAAA,EAAK,WAAU,2BAA0B,UAAA,OAAA,CAAI;AAAA,IAAA,EAAA,CAClD,EAAA,CAER;AAAA,MACA;AAER,eACI,eACC,YACG,oBAAC,QAAA,EAAO,SAAS,WAAY,UAAA,cAAc,oBAAC,QAAA,EAAK,WAAW,YAAA,CAAa,IAAU,QAAO,IAC1F;AAER,QAAM,EAAE,UAAU,UAAA,IAAc,cAAA;AAIhC,SACI,qBAAC,SAAI,WAAW,iDAAiD,WAAW,WAAW,EAAE,IAAI,WAAQ,UAIhG,UAAA;AAAA,IAAA,CAAC,iCACG,UAAA,EAAO,WAAW,YAAY,KAAK,2BAA2B,WAAQ,UAIlE,UAAA;AAAA,MAAA,aAAa,CAAC,UAAU;AAAA,MAExB;AAAA,MAEG,oBAAC,UAAO,QAAM,MAAC,WAAU,YACrB,UAAA,qBAAC,mBAAA,EAAkB,WAAU,SACxB,UAAA;AAAA,QAAA,WAAW,oBAAC,KAAA,EAAI,WAAU,gBAAgB,UAAA,SAAQ;AAAA,4BAClD,OAAO,OAAP,EAAa,WAAU,WAAW,UAAA,OAAM;AAAA,QACxC,cAAc,oBAAC,KAAA,EAAI,WAAU,gBAAgB,UAAA,WAAA,CAAW;AAAA,MAAA,EAAA,CAC7D,EAAA,CACJ;AAAA,MAGH;AAAA,IAAA,GACL;AAAA,IAKJ;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,IAAG;AAAA,QACH,WAAW;AAAA,UACP,WAAW,sCAAsC;AAAA,UACjD;AAAA,UACA,gBAAgB,8CAA8C;AAAA,UAC9D;AAAA,UACA,mBAAmB,QAAQ;AAAA,QAAA,EAE1B,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,QACb,WAAQ;AAAA,QAEP,UAAA;AAAA,UAAA;AAAA,UAGA,aAAa,CAAC,YACX,qBAAA,UAAA,EACK,UAAA;AAAA,YAAA;AAAA,aAGC,cAAc;AAAA,YAEZ,qBAAC,OAAA,EAAM,KAAK,GAAG,WAAU,cAEpB,UAAA;AAAA,cAAA,WAAW,oBAAC,KAAA,EAAI,WAAU,gBAAgB,UAAA,SAAQ;AAAA,cAClD,cAAc,oBAAC,KAAA,EAAI,WAAU,4BAA4B,UAAA,WAAA,CAAW;AAAA,YAAA,EAAA,CACzE;AAAA,UAAA,EAAA,CAER;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAMP,CAAC,UAAU,CAAC,iCACR,UAAA,EAAO,WAAU,0CAAyC,WAAQ,UAC9D,UAAA;AAAA,MAAA,CAAC,YAAY;AAAA,MACb,CAAC,UAAU;AAAA,IAAA,EAAA,CAChB;AAAA,EAAA,GAER;AAER,CAAC;"}
+{"version":3,"file":"screen.js","names":[],"sources":["../src/screen.tsx"],"sourcesContent":["import React, { type FC, memo } from 'react';\nimport { Button, Navbar, Nav, Stack } from 'react-bootstrap';\nimport { useBreakpoint } from './responsiveHelper';\nimport { AdaptiveContainer } from './adaptiveContainer';\n\nexport type ScreenProps = {\n    backBtn?: any;\n    backCb?: any;\n    backIcon?: any;\n    forwardBtn?: any;\n    forwardIcon?: any;\n    forwardCb?: any;\n    children: any;\n    contentClassName?: string;\n    noContentPadding?: boolean;\n    header?: any; // resides on top panel in mobile, does not scroll, before content on desktop\n    footer?: any; // resides on bottom menu panel in mobile, does not scroll, or after content on desktop\n    menu?: any;\n    title?: any;\n    centerContent?: boolean;\n    noHeader?: boolean;\n    noFooter?: boolean;\n    noMenu?: boolean;\n    // noFolders?: boolean;\n};\n\n//TODO Footer -> menu\nexport const Screen: FC<ScreenProps> = memo(function Screen({\n    backBtn,\n    backCb,\n    backIcon,\n    forwardBtn,\n    forwardIcon,\n    forwardCb,\n    footer,\n    menu,\n    header,\n    children,\n    noContentPadding = false,\n    contentClassName = '',\n    title = '',\n    centerContent = false,\n    noHeader = false,\n    noFooter = false,\n    noMenu = false,\n    // noFolders = false,\n}) {\n    // const router = useRouter();\n\n    backBtn =\n        backBtn ||\n        (backCb ? (\n            // backCb === true ? () => router.back() : backCb\n            <Button onClick={backCb} variant=\"nav\">\n                {\n                    <>\n                        <span className={backIcon || 'bi-chevron-left icon-thick'} />\n                        <span className=\"d-none d-lg-inline ms-2\">Back</span>\n                    </>\n                }\n            </Button>\n        ) : null);\n\n    forwardBtn =\n        forwardBtn ||\n        (forwardCb ? (\n            <Button onClick={forwardCb}>{forwardIcon ? <span className={forwardIcon}></span> : 'Next'}</Button>\n        ) : null);\n\n    const { isMobile, isDesktop } = useBreakpoint();\n\n    // useLoadingTimeout(1000); // less jerky UI\n\n    return (\n        <div className={`d-flex flex-column flex-grow-1 flex-lg-grow-0 ${isMobile ? 'vh-100' : ''}`} data-id=\"screen\">\n            {/* HEADER */}\n\n            {/* FIXME postition fixed does not assign z-index automatically https://getbootstrap.com/docs/4.0/layout/overview/#z-index*/}\n            {!noHeader && (\n                <header className={isDesktop ? '' : 'shadow-sm border-bottom'} data-id=\"header\">\n                    {/* {!noFolders && <FolderBar />} */}\n\n                    {/* {isDesktop && !noFooter && <Footer />} */}\n                    {isDesktop && !noMenu && menu}\n\n                    {title && (\n                        // (isDesktop ? 'border-bottom' : '')\n                        <Navbar expand className=\"main-nav\">\n                            <AdaptiveContainer className=\"gap-2\">\n                                {backBtn && <Nav className=\"hstack gap-3\">{backBtn}</Nav>}\n                                <Navbar.Brand className=\"me-auto\">{title}</Navbar.Brand>\n                                {forwardBtn && <Nav className=\"hstack gap-3\">{forwardBtn}</Nav>}\n                            </AdaptiveContainer>\n                        </Navbar>\n                    )}\n\n                    {header}\n                </header>\n            )}\n\n            {/* CONTENT */}\n\n            <AdaptiveContainer\n                as=\"main\"\n                className={[\n                    isMobile ? 'overflow-y-auto overflow-x-hidden' : 'gap-3',\n                    `flex-grow-1 d-flex flex-column`,\n                    centerContent ? 'align-items-center justify-content-center' : 'justify-content-start',\n                    contentClassName,\n                    noContentPadding ? 'p-0' : 'py-3',\n                ]\n                    .filter(Boolean)\n                    .join(' ')}\n                data-id=\"content\"\n            >\n                {children}\n\n                {/* Repeat screen buttons at the bottom on desktop */}\n                {isDesktop && !noFooter && (\n                    <>\n                        {footer}\n\n                        {/* TODO Possibly introduce a prop desktopFooterBeforeButtons */}\n                        {(forwardBtn || backBtn) && (\n                            // Navbar screws up the popper\n                            <Stack gap={3} direction=\"horizontal\">\n                                {/* No container since already in container */}\n                                {backBtn && <Nav className=\"hstack gap-3\">{backBtn}</Nav>}\n                                {forwardBtn && <Nav className=\"hstack gap-3 flex-grow-1\">{forwardBtn}</Nav>}\n                            </Stack>\n                        )}\n                    </>\n                )}\n            </AdaptiveContainer>\n\n            {/* FOOTER */}\n\n            {!noMenu && !noFooter && (\n                <footer className=\"shadow-lg border-top d-block d-lg-none\" data-id=\"footer\">\n                    {!noFooter && footer}\n                    {!noMenu && menu}\n                </footer>\n            )}\n        </div>\n    );\n});\n"],"mappings":";;;;;;AA2BA,IAAa,SAA0B,KAAK,SAAS,OAAO,EACxD,SACA,QACA,UACA,YACA,aACA,WACA,QACA,MACA,QACA,UACA,mBAAmB,OACnB,mBAAmB,IACnB,QAAQ,IACR,gBAAgB,OAChB,WAAW,OACX,WAAW,OACX,SAAS,SAEV;CAGC,UACI,YACC,SAEG,oBAAC,QAAD;EAAQ,SAAS;EAAQ,SAAQ;YAEzB,qBAAA,UAAA,EAAA,UAAA,CACI,oBAAC,QAAD,EAAM,WAAW,YAAY,6BAA+B,CAAA,GAC5D,oBAAC,QAAD;GAAM,WAAU;aAA0B;EAAU,CAAA,CACtD,EAAA,CAAA;CAEF,CAAA,IACR;CAER,aACI,eACC,YACG,oBAAC,QAAD;EAAQ,SAAS;YAAY,cAAc,oBAAC,QAAD,EAAM,WAAW,YAAmB,CAAA,IAAI;CAAe,CAAA,IAClG;CAER,MAAM,EAAE,UAAU,cAAc,cAAc;CAI9C,OACI,qBAAC,OAAD;EAAK,WAAW,iDAAiD,WAAW,WAAW;EAAM,WAAQ;YAArG;GAIK,CAAC,YACE,qBAAC,UAAD;IAAQ,WAAW,YAAY,KAAK;IAA2B,WAAQ;cAAvE;KAIK,aAAa,CAAC,UAAU;KAExB,SAEG,oBAAC,QAAD;MAAQ,QAAA;MAAO,WAAU;gBACrB,qBAAC,mBAAD;OAAmB,WAAU;iBAA7B;QACK,WAAW,oBAAC,KAAD;SAAK,WAAU;mBAAgB;QAAa,CAAA;QACxD,oBAAC,OAAO,OAAR;SAAc,WAAU;mBAAW;QAAoB,CAAA;QACtD,cAAc,oBAAC,KAAD;SAAK,WAAU;mBAAgB;QAAgB,CAAA;OAC/C;;KACf,CAAA;KAGX;IACG;;GAKZ,qBAAC,mBAAD;IACI,IAAG;IACH,WAAW;KACP,WAAW,sCAAsC;KACjD;KACA,gBAAgB,8CAA8C;KAC9D;KACA,mBAAmB,QAAQ;IAC/B,CAAC,CACI,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;IACb,WAAQ;cAXZ,CAaK,UAGA,aAAa,CAAC,YACX,qBAAA,UAAA,EAAA,UAAA,CACK,SAGC,cAAc,YAEZ,qBAAC,OAAD;KAAO,KAAK;KAAG,WAAU;eAAzB,CAEK,WAAW,oBAAC,KAAD;MAAK,WAAU;gBAAgB;KAAa,CAAA,GACvD,cAAc,oBAAC,KAAD;MAAK,WAAU;gBAA4B;KAAgB,CAAA,CACvE;MAEb,EAAA,CAAA,CAES;;GAIlB,CAAC,UAAU,CAAC,YACT,qBAAC,UAAD;IAAQ,WAAU;IAAyC,WAAQ;cAAnE,CACK,CAAC,YAAY,QACb,CAAC,UAAU,IACR;;EAEX;;AAEb,CAAC"}

package/dist/screen.stories.d.ts

@@ -1,5 +1,5 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { Screen } from './screen';
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { Screen } from './screen.js';
 declare const meta: Meta<typeof Screen>;
 export default meta;
 type Story = StoryObj<typeof meta>;

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

@@ -1 +1 @@
-{"version":3,"file":"screen.stories.d.ts","sourceRoot":"","sources":["../src/screen.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AA2ClC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CA8B7B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAEjC,eAAO,MAAM,WAAW,EAAE,KAKzB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAcpB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAKtB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAKzB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAgBxB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAaxB,CAAC"}
+{"version":3,"file":"screen.stories.d.ts","sourceRoot":"","sources":["../src/screen.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAG5D,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AA2ClC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CA8B7B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAEjC,eAAO,MAAM,WAAW,EAAE,KAKzB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAcpB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAKtB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAKzB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAgBxB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAaxB,CAAC"}

package/dist/toaster.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toaster.d.ts","sourceRoot":"","sources":["../src/toaster.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAY,EAAE,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAS,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAGpD,MAAM,MAAM,YAAY,GAAG;IACvB,KAAK,EAAE,MAAM,GAAG;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAA;KAAE,CAAC;CAChG,GAAG,UAAU,CAAC;AAEf,eAAO,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CA6BpC,CAAC"}
+{"version":3,"file":"toaster.d.ts","sourceRoot":"","sources":["../src/toaster.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAY,KAAK,EAAE,EAAQ,MAAM,OAAO,CAAC;AACvD,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAGzD,MAAM,MAAM,YAAY,GAAG;IACvB,KAAK,EAAE,MAAM,GAAG;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAA;KAAE,CAAC;CAChG,GAAG,UAAU,CAAC;AAEf,eAAO,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CA6BnC,CAAC"}

package/dist/toaster.js

@@ -1,34 +1,33 @@
 "use client";
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useState } from "react";
+import { memo, useState } from "react";
 import { Toast } from "react-bootstrap";
-const Toaster = function Toaster2({ toast }) {
-  const [dismissed, setDismissed] = useState(false);
-  const msg = typeof toast === "string" ? toast : toast?.message;
-  const variant = typeof toast === "string" ? "" : toast?.variant;
-  return /* @__PURE__ */ jsxs(
-    Toast,
-    {
-      onClose: () => setDismissed(true),
-      show: !dismissed,
-      delay: 1e4,
-      autohide: true,
-      bg: variant?.toLowerCase(),
-      className: "position-fixed top-50 right-50 min-w-200px z-3",
-      children: [
-        /* @__PURE__ */ jsx(Toast.Header, { children: /* @__PURE__ */ jsx("strong", { className: "me-auto", children: "Notification" }) }),
-        /* @__PURE__ */ jsx(
-          Toast.Body,
-          {
-            className: ["dark", "success", "danger"].includes(variant?.toLowerCase()) ? "text-white" : "",
-            children: msg
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  Toaster
-};
-//# sourceMappingURL=toaster.js.map
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/toaster.tsx
+var Toaster = memo(function Toaster({ toast }) {
+	const [dismissed, setDismissed] = useState(false);
+	const msg = typeof toast === "string" ? toast : toast?.message;
+	const variant = typeof toast === "string" ? "" : toast?.variant;
+	return /* @__PURE__ */ jsxs(Toast, {
+		onClose: () => setDismissed(true),
+		show: !dismissed,
+		delay: 1e4,
+		autohide: true,
+		bg: variant?.toLowerCase(),
+		className: "position-fixed top-50 right-50 min-w-200px z-3",
+		children: [/* @__PURE__ */ jsx(Toast.Header, { children: /* @__PURE__ */ jsx("strong", {
+			className: "me-auto",
+			children: "Notification"
+		}) }), /* @__PURE__ */ jsx(Toast.Body, {
+			className: [
+				"dark",
+				"success",
+				"danger"
+			].includes(variant?.toLowerCase()) ? "text-white" : "",
+			children: msg
+		})]
+	});
+});
+//#endregion
+export { Toaster };
+
+//# sourceMappingURL=toaster.js.map

package/dist/toaster.js.map

@@ -1 +1 @@
-{"version":3,"file":"toaster.js","sources":["../src/toaster.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState, FC } from 'react';\nimport { Toast, ToastProps } from 'react-bootstrap';\n// import { useToaster } from '../redux/toasterSlice';\n\nexport type ToasterProps = {\n    toast: string | { message: string; title?: string; variant?: 'dark' | 'success' | 'danger' };\n} & ToastProps;\n\nexport const Toaster: FC<ToasterProps> = function Toaster({ toast }) {\n    //const { toast, setToast } = useToaster();\n    const [dismissed, setDismissed] = useState(false);\n\n    const msg = typeof toast === 'string' ? toast : toast?.message;\n    // const title = typeof toast === 'string' ? 'Notification' : toast?.title;\n    const variant = typeof toast === 'string' ? '' : toast?.variant;\n\n    return (\n        <Toast\n            onClose={() => setDismissed(true)}\n            show={!dismissed}\n            delay={10000}\n            autohide\n            bg={variant?.toLowerCase()}\n            className=\"position-fixed top-50 right-50 min-w-200px z-3\"\n        >\n            <Toast.Header>\n                <strong className=\"me-auto\">Notification</strong>\n            </Toast.Header>\n            <Toast.Body\n                className={\n                    ['dark', 'success', 'danger'].includes((variant as string)?.toLowerCase()) ? 'text-white' : ''\n                }\n            >\n                {msg}\n            </Toast.Body>\n        </Toast>\n    );\n};\n"],"names":["Toaster"],"mappings":";;;;AAUO,MAAM,UAA4B,SAASA,SAAQ,EAAE,SAAS;AAEjE,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,QAAM,MAAM,OAAO,UAAU,WAAW,QAAQ,OAAO;AAEvD,QAAM,UAAU,OAAO,UAAU,WAAW,KAAK,OAAO;AAExD,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,SAAS,MAAM,aAAa,IAAI;AAAA,MAChC,MAAM,CAAC;AAAA,MACP,OAAO;AAAA,MACP,UAAQ;AAAA,MACR,IAAI,SAAS,YAAA;AAAA,MACb,WAAU;AAAA,MAEV,UAAA;AAAA,QAAA,oBAAC,MAAM,QAAN,EACG,UAAA,oBAAC,YAAO,WAAU,WAAU,0BAAY,EAAA,CAC5C;AAAA,QACA;AAAA,UAAC,MAAM;AAAA,UAAN;AAAA,YACG,WACI,CAAC,QAAQ,WAAW,QAAQ,EAAE,SAAU,SAAoB,YAAA,CAAa,IAAI,eAAe;AAAA,YAG/F,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACL;AAAA,IAAA;AAAA,EAAA;AAGZ;"}
+{"version":3,"file":"toaster.js","names":[],"sources":["../src/toaster.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState, type FC, memo } from 'react';\nimport { Toast, type ToastProps } from 'react-bootstrap';\n// import { useToaster } from '../redux/toasterSlice';\n\nexport type ToasterProps = {\n    toast: string | { message: string; title?: string; variant?: 'dark' | 'success' | 'danger' };\n} & ToastProps;\n\nexport const Toaster: FC<ToasterProps> = memo(function Toaster({ toast }) {\n    //const { toast, setToast } = useToaster();\n    const [dismissed, setDismissed] = useState(false);\n\n    const msg = typeof toast === 'string' ? toast : toast?.message;\n    // const title = typeof toast === 'string' ? 'Notification' : toast?.title;\n    const variant = typeof toast === 'string' ? '' : toast?.variant;\n\n    return (\n        <Toast\n            onClose={() => setDismissed(true)}\n            show={!dismissed}\n            delay={10000}\n            autohide\n            bg={variant?.toLowerCase()}\n            className=\"position-fixed top-50 right-50 min-w-200px z-3\"\n        >\n            <Toast.Header>\n                <strong className=\"me-auto\">Notification</strong>\n            </Toast.Header>\n            <Toast.Body\n                className={\n                    ['dark', 'success', 'danger'].includes((variant as string)?.toLowerCase()) ? 'text-white' : ''\n                }\n            >\n                {msg}\n            </Toast.Body>\n        </Toast>\n    );\n});\n"],"mappings":";;;;;AAUA,IAAa,UAA4B,KAAK,SAAS,QAAQ,EAAE,SAAS;CAEtE,MAAM,CAAC,WAAW,gBAAgB,SAAS,KAAK;CAEhD,MAAM,MAAM,OAAO,UAAU,WAAW,QAAQ,OAAO;CAEvD,MAAM,UAAU,OAAO,UAAU,WAAW,KAAK,OAAO;CAExD,OACI,qBAAC,OAAD;EACI,eAAe,aAAa,IAAI;EAChC,MAAM,CAAC;EACP,OAAO;EACP,UAAA;EACA,IAAI,SAAS,YAAY;EACzB,WAAU;YANd,CAQI,oBAAC,MAAM,QAAP,EAAA,UACI,oBAAC,UAAD;GAAQ,WAAU;aAAU;EAAoB,CAAA,EACtC,CAAA,GACd,oBAAC,MAAM,MAAP;GACI,WACI;IAAC;IAAQ;IAAW;GAAQ,CAAC,CAAC,SAAU,SAAoB,YAAY,CAAC,IAAI,eAAe;aAG/F;EACO,CAAA,CACT;;AAEf,CAAC"}

package/dist/toaster.stories.d.ts

@@ -1,5 +1,5 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { Toaster } from './toaster';
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { Toaster } from './toaster.js';
 declare const meta: Meta<typeof Toaster>;
 export default meta;
 type Story = StoryObj<typeof meta>;

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

@@ -1 +1 @@
-{"version":3,"file":"toaster.stories.d.ts","sourceRoot":"","sources":["../src/toaster.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAGpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAS9B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAIpB,CAAC"}
+{"version":3,"file":"toaster.stories.d.ts","sourceRoot":"","sources":["../src/toaster.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAG5D,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAGpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAS9B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAIpB,CAAC"}

package/dist/useModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useModal.d.ts","sourceRoot":"","sources":["../src/useModal.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAuC,EAAE,EAAQ,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAiB,UAAU,EAAa,cAAc,EAAS,MAAM,iBAAiB,CAAC;AAE9F,MAAM,MAAM,YAAY,GAAG;IAAE,OAAO,CAAC,EAAE,GAAG,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAEpE,MAAM,MAAM,aAAa,GAAG;IACxB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;IACrB,cAAc,CAAC,EAAE,UAAU,GAAG,cAAc,CAAC;CAChD,CAAC;AAEF,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,GAAE,YAAiB,GAAG;IACnE,IAAI,EAAE,OAAO,GAAG,SAAS,CAAC;IAC1B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,WAAW,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC;CAC/B,CAuEA"}
+{"version":3,"file":"useModal.d.ts","sourceRoot":"","sources":["../src/useModal.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAkC,KAAK,EAAE,EAAQ,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAiB,KAAK,UAAU,EAAa,KAAK,cAAc,EAAS,MAAM,iBAAiB,CAAC;AAExG,MAAM,MAAM,YAAY,GAAG;IAAE,OAAO,CAAC,EAAE,GAAG,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAEpE,MAAM,MAAM,aAAa,GAAG;IACxB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;IACrB,cAAc,CAAC,EAAE,UAAU,GAAG,cAAc,CAAC;CAChD,CAAC;AAEF,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,GAAE,YAAiB,GAAG;IACnE,IAAI,EAAE,OAAO,GAAG,SAAS,CAAC;IAC1B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,WAAW,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC;CAC/B,CAuEA"}

package/dist/useModal.js

@@ -1,50 +1,61 @@
+import { memo, useCallback, useMemo, useState } from "react";
+import { Button, Modal, Offcanvas, Stack } from "react-bootstrap";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useState, useCallback, useMemo, memo } from "react";
-import { Offcanvas, Modal, Stack, Button } from "react-bootstrap";
+//#region src/useModal.tsx
 function useModal({ onClose, showOnMount } = {}) {
-  const [show, setShow] = useState(showOnMount);
-  const close = useCallback(() => {
-    setShow(false);
-    onClose?.();
-  }, [onClose]);
-  const open = useCallback(() => setShow(true), []);
-  const defaultOnSubmit = useCallback(
-    (e) => {
-      e.preventDefault();
-      close();
-    },
-    [close]
-  );
-  const ModalDialog = useMemo(
-    () => memo(function ModalDialog2({
-      children,
-      show: show2,
-      onSubmit = defaultOnSubmit,
-      submitButton = "Done",
-      cancelButton = "Cancel",
-      offcanvas = false,
-      title = null,
-      containerProps = {}
-    }) {
-      const Container = offcanvas ? Offcanvas : Modal;
-      const containerDefaultProps = offcanvas ? { style: { maxWidth: "85%" } } : {};
-      const Body = offcanvas ? Offcanvas.Body : Modal.Body;
-      const Header = offcanvas ? Offcanvas.Header : Modal.Header;
-      const Title = offcanvas ? Offcanvas.Title : Modal.Title;
-      return /* @__PURE__ */ jsx(Container, { ...{ ...containerDefaultProps, ...containerProps }, show: show2, onHide: close, children: /* @__PURE__ */ jsxs("form", { onSubmit, children: [
-        title && /* @__PURE__ */ jsx(Header, { closeButton: true, children: /* @__PURE__ */ jsx(Title, { children: title }) }),
-        /* @__PURE__ */ jsx(Body, { as: Stack, gap: 3, children: show2 && children }),
-        !offcanvas && (submitButton || cancelButton) && /* @__PURE__ */ jsxs(Modal.Footer, { children: [
-          cancelButton && /* @__PURE__ */ jsx(Button, { variant: "outline-secondary", onClick: close, children: cancelButton }),
-          submitButton && /* @__PURE__ */ jsx(Button, { variant: "secondary", type: "submit", children: submitButton })
-        ] })
-      ] }) });
-    }),
-    [close, defaultOnSubmit]
-  );
-  return { show, close, open, ModalDialog };
+	const [show, setShow] = useState(showOnMount);
+	const close = useCallback(() => {
+		setShow(false);
+		onClose?.();
+	}, [onClose]);
+	const open = useCallback(() => setShow(true), []);
+	const defaultOnSubmit = useCallback((e) => {
+		e.preventDefault();
+		close();
+	}, [close]);
+	return {
+		show,
+		close,
+		open,
+		ModalDialog: useMemo(() => memo(function ModalDialog({ children, show, onSubmit = defaultOnSubmit, submitButton = "Done", cancelButton = "Cancel", offcanvas = false, title = null, containerProps = {} }) {
+			const Container = offcanvas ? Offcanvas : Modal;
+			const containerDefaultProps = offcanvas ? { style: { maxWidth: "85%" } } : {};
+			const Body = offcanvas ? Offcanvas.Body : Modal.Body;
+			const Header = offcanvas ? Offcanvas.Header : Modal.Header;
+			const Title = offcanvas ? Offcanvas.Title : Modal.Title;
+			return /* @__PURE__ */ jsx(Container, {
+				...containerDefaultProps,
+				...containerProps,
+				show,
+				onHide: close,
+				children: /* @__PURE__ */ jsxs("form", {
+					onSubmit,
+					children: [
+						title && /* @__PURE__ */ jsx(Header, {
+							closeButton: true,
+							children: /* @__PURE__ */ jsx(Title, { children: title })
+						}),
+						/* @__PURE__ */ jsx(Body, {
+							as: Stack,
+							gap: 3,
+							children: show && children
+						}),
+						!offcanvas && (submitButton || cancelButton) && /* @__PURE__ */ jsxs(Modal.Footer, { children: [cancelButton && /* @__PURE__ */ jsx(Button, {
+							variant: "outline-secondary",
+							onClick: close,
+							children: cancelButton
+						}), submitButton && /* @__PURE__ */ jsx(Button, {
+							variant: "secondary",
+							type: "submit",
+							children: submitButton
+						})] })
+					]
+				})
+			});
+		}), [close, defaultOnSubmit])
+	};
 }
-export {
-  useModal
-};
-//# sourceMappingURL=useModal.js.map
+//#endregion
+export { useModal };
+
+//# sourceMappingURL=useModal.js.map

package/dist/useModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"useModal.js","sources":["../src/useModal.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState, JSX, FC, memo } from 'react';\nimport { Button, Modal, ModalProps, Offcanvas, OffcanvasProps, Stack } from 'react-bootstrap';\n\nexport type UseModalArgs = { onClose?: any; showOnMount?: boolean };\n\nexport type UseModalProps = {\n    children?: any;\n    show?: boolean;\n    onSubmit?: (e: any) => void;\n    submitButton?: string | any;\n    cancelButton?: string | any;\n    offcanvas?: boolean;\n    title?: string | any;\n    containerProps?: ModalProps | OffcanvasProps;\n};\n\nexport function useModal({ onClose, showOnMount }: UseModalArgs = {}): {\n    show: boolean | undefined;\n    close: () => void;\n    open: () => void;\n    ModalDialog: FC<ModalProps>;\n} {\n    const [show, setShow] = useState(showOnMount);\n\n    const close = useCallback((): void => {\n        setShow(false);\n        onClose?.();\n    }, [onClose]);\n\n    const open = useCallback((): void => setShow(true), []);\n\n    const defaultOnSubmit = useCallback(\n        (e: any) => {\n            e.preventDefault();\n            close();\n        },\n        [close],\n    );\n\n    const ModalDialog = useMemo(\n        () =>\n            memo(function ModalDialog({\n                children,\n                show,\n                onSubmit = defaultOnSubmit,\n                submitButton = 'Done',\n                cancelButton = 'Cancel',\n                offcanvas = false,\n                title = null as any,\n                containerProps = {},\n            }: ModalProps) {\n                const Container = offcanvas ? Offcanvas : Modal;\n                const containerDefaultProps = offcanvas ? { style: { maxWidth: '85%' } } : {};\n                const Body = offcanvas ? Offcanvas.Body : Modal.Body;\n                const Header = offcanvas ? Offcanvas.Header : Modal.Header;\n                const Title = offcanvas ? Offcanvas.Title : Modal.Title;\n\n                return (\n                    <Container {...{ ...containerDefaultProps, ...containerProps }} show={show} onHide={close}>\n                        <form onSubmit={onSubmit}>\n                            {title && (\n                                <Header closeButton>\n                                    <Title>{title}</Title>\n                                </Header>\n                            )}\n\n                            <Body as={Stack} gap={3}>\n                                {show && children}\n                            </Body>\n\n                            {!offcanvas && (submitButton || cancelButton) && (\n                                <Modal.Footer>\n                                    {cancelButton && (\n                                        <Button variant=\"outline-secondary\" onClick={close}>\n                                            {cancelButton}\n                                        </Button>\n                                    )}\n                                    {submitButton && (\n                                        <Button variant=\"secondary\" type=\"submit\">\n                                            {submitButton}\n                                        </Button>\n                                    )}\n                                </Modal.Footer>\n                            )}\n                        </form>\n                    </Container>\n                );\n            }),\n        [close, defaultOnSubmit],\n    );\n\n    return { show, close, open, ModalDialog };\n}\n"],"names":["ModalDialog","show"],"mappings":";;;AAgBO,SAAS,SAAS,EAAE,SAAS,YAAA,IAA8B,CAAA,GAKhE;AACE,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,WAAW;AAE5C,QAAM,QAAQ,YAAY,MAAY;AAClC,YAAQ,KAAK;AACb,cAAA;AAAA,EACJ,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,OAAO,YAAY,MAAY,QAAQ,IAAI,GAAG,CAAA,CAAE;AAEtD,QAAM,kBAAkB;AAAA,IACpB,CAAC,MAAW;AACR,QAAE,eAAA;AACF,YAAA;AAAA,IACJ;AAAA,IACA,CAAC,KAAK;AAAA,EAAA;AAGV,QAAM,cAAc;AAAA,IAChB,MACI,KAAK,SAASA,aAAY;AAAA,MACtB;AAAA,MACA,MAAAC;AAAAA,MACA,WAAW;AAAA,MACX,eAAe;AAAA,MACf,eAAe;AAAA,MACf,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,iBAAiB,CAAA;AAAA,IAAC,GACP;AACX,YAAM,YAAY,YAAY,YAAY;AAC1C,YAAM,wBAAwB,YAAY,EAAE,OAAO,EAAE,UAAU,MAAA,EAAM,IAAM,CAAA;AAC3E,YAAM,OAAO,YAAY,UAAU,OAAO,MAAM;AAChD,YAAM,SAAS,YAAY,UAAU,SAAS,MAAM;AACpD,YAAM,QAAQ,YAAY,UAAU,QAAQ,MAAM;AAElD,aACI,oBAAC,WAAA,EAAW,GAAG,EAAE,GAAG,uBAAuB,GAAG,kBAAkB,MAAMA,OAAM,QAAQ,OAChF,UAAA,qBAAC,UAAK,UACD,UAAA;AAAA,QAAA,6BACI,QAAA,EAAO,aAAW,MACf,UAAA,oBAAC,OAAA,EAAO,iBAAM,EAAA,CAClB;AAAA,QAGJ,oBAAC,QAAK,IAAI,OAAO,KAAK,GACjB,UAAAA,SAAQ,UACb;AAAA,QAEC,CAAC,cAAc,gBAAgB,iBAC5B,qBAAC,MAAM,QAAN,EACI,UAAA;AAAA,UAAA,oCACI,QAAA,EAAO,SAAQ,qBAAoB,SAAS,OACxC,UAAA,cACL;AAAA,UAEH,gBACG,oBAAC,QAAA,EAAO,SAAQ,aAAY,MAAK,UAC5B,UAAA,aAAA,CACL;AAAA,QAAA,EAAA,CAER;AAAA,MAAA,EAAA,CAER,EAAA,CACJ;AAAA,IAER,CAAC;AAAA,IACL,CAAC,OAAO,eAAe;AAAA,EAAA;AAG3B,SAAO,EAAE,MAAM,OAAO,MAAM,YAAA;AAChC;"}
+{"version":3,"file":"useModal.js","names":[],"sources":["../src/useModal.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState, type FC, memo } from 'react';\nimport { Button, Modal, type ModalProps, Offcanvas, type OffcanvasProps, Stack } from 'react-bootstrap';\n\nexport type UseModalArgs = { onClose?: any; showOnMount?: boolean };\n\nexport type UseModalProps = {\n    children?: any;\n    show?: boolean;\n    onSubmit?: (e: any) => void;\n    submitButton?: string | any;\n    cancelButton?: string | any;\n    offcanvas?: boolean;\n    title?: string | any;\n    containerProps?: ModalProps | OffcanvasProps;\n};\n\nexport function useModal({ onClose, showOnMount }: UseModalArgs = {}): {\n    show: boolean | undefined;\n    close: () => void;\n    open: () => void;\n    ModalDialog: FC<ModalProps>;\n} {\n    const [show, setShow] = useState(showOnMount);\n\n    const close = useCallback((): void => {\n        setShow(false);\n        onClose?.();\n    }, [onClose]);\n\n    const open = useCallback((): void => setShow(true), []);\n\n    const defaultOnSubmit = useCallback(\n        (e: any) => {\n            e.preventDefault();\n            close();\n        },\n        [close],\n    );\n\n    const ModalDialog: FC<UseModalProps> = useMemo(\n        () =>\n            memo(function ModalDialog({\n                children,\n                show,\n                onSubmit = defaultOnSubmit,\n                submitButton = 'Done',\n                cancelButton = 'Cancel',\n                offcanvas = false,\n                title = null as any,\n                containerProps = {},\n            }) {\n                const Container = offcanvas ? Offcanvas : Modal;\n                const containerDefaultProps = offcanvas ? { style: { maxWidth: '85%' } } : {};\n                const Body = offcanvas ? Offcanvas.Body : Modal.Body;\n                const Header = offcanvas ? Offcanvas.Header : Modal.Header;\n                const Title = offcanvas ? Offcanvas.Title : Modal.Title;\n\n                return (\n                    <Container {...{ ...containerDefaultProps, ...containerProps }} show={show} onHide={close}>\n                        <form onSubmit={onSubmit}>\n                            {title && (\n                                <Header closeButton>\n                                    <Title>{title}</Title>\n                                </Header>\n                            )}\n\n                            <Body as={Stack} gap={3}>\n                                {show && children}\n                            </Body>\n\n                            {!offcanvas && (submitButton || cancelButton) && (\n                                <Modal.Footer>\n                                    {cancelButton && (\n                                        <Button variant=\"outline-secondary\" onClick={close}>\n                                            {cancelButton}\n                                        </Button>\n                                    )}\n                                    {submitButton && (\n                                        <Button variant=\"secondary\" type=\"submit\">\n                                            {submitButton}\n                                        </Button>\n                                    )}\n                                </Modal.Footer>\n                            )}\n                        </form>\n                    </Container>\n                );\n            }),\n        [close, defaultOnSubmit],\n    );\n\n    return { show, close, open, ModalDialog };\n}\n"],"mappings":";;;;AAgBA,SAAgB,SAAS,EAAE,SAAS,gBAA8B,CAAC,GAKjE;CACE,MAAM,CAAC,MAAM,WAAW,SAAS,WAAW;CAE5C,MAAM,QAAQ,kBAAwB;EAClC,QAAQ,KAAK;EACb,UAAU;CACd,GAAG,CAAC,OAAO,CAAC;CAEZ,MAAM,OAAO,kBAAwB,QAAQ,IAAI,GAAG,CAAC,CAAC;CAEtD,MAAM,kBAAkB,aACnB,MAAW;EACR,EAAE,eAAe;EACjB,MAAM;CACV,GACA,CAAC,KAAK,CACV;CAsDA,OAAO;EAAE;EAAM;EAAO;EAAM,aApDW,cAE/B,KAAK,SAAS,YAAY,EACtB,UACA,MACA,WAAW,iBACX,eAAe,QACf,eAAe,UACf,YAAY,OACZ,QAAQ,MACR,iBAAiB,CAAC,KACnB;GACC,MAAM,YAAY,YAAY,YAAY;GAC1C,MAAM,wBAAwB,YAAY,EAAE,OAAO,EAAE,UAAU,MAAM,EAAE,IAAI,CAAC;GAC5E,MAAM,OAAO,YAAY,UAAU,OAAO,MAAM;GAChD,MAAM,SAAS,YAAY,UAAU,SAAS,MAAM;GACpD,MAAM,QAAQ,YAAY,UAAU,QAAQ,MAAM;GAElD,OACI,oBAAC,WAAD;IAAiB,GAAG;IAAuB,GAAG;IAAwB;IAAM,QAAQ;cAChF,qBAAC,QAAD;KAAgB;eAAhB;MACK,SACG,oBAAC,QAAD;OAAQ,aAAA;iBACJ,oBAAC,OAAD,EAAA,UAAQ,MAAa,CAAA;MACjB,CAAA;MAGZ,oBAAC,MAAD;OAAM,IAAI;OAAO,KAAK;iBACjB,QAAQ;MACP,CAAA;MAEL,CAAC,cAAc,gBAAgB,iBAC5B,qBAAC,MAAM,QAAP,EAAA,UAAA,CACK,gBACG,oBAAC,QAAD;OAAQ,SAAQ;OAAoB,SAAS;iBACxC;MACG,CAAA,GAEX,gBACG,oBAAC,QAAD;OAAQ,SAAQ;OAAY,MAAK;iBAC5B;MACG,CAAA,CAEF,EAAA,CAAA;KAEhB;;GACC,CAAA;EAEnB,CAAC,GACL,CAAC,OAAO,eAAe,CAGC;CAAY;AAC5C"}

package/dist/useModal.stories.d.ts

@@ -1,6 +1,6 @@
 import { FC } from 'react';
-import { Meta, StoryObj } from '@storybook/react';
-import { UseModalProps } from './useModal';
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { UseModalProps } from './useModal.js';
 declare const meta: Meta<FC<UseModalProps>>;
 export default meta;
 type Story = StoryObj<typeof meta>;

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

@@ -1 +1 @@
-{"version":3,"file":"useModal.stories.d.ts","sourceRoot":"","sources":["../src/useModal.stories.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAY,aAAa,EAAE,MAAM,YAAY,CAAC;AAIrD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,CA8BjC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAC"}
+{"version":3,"file":"useModal.stories.d.ts","sourceRoot":"","sources":["../src/useModal.stories.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAI1D,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,CA8BjC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAC"}

package/dist/useWrappedForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useWrappedForm.d.ts","sourceRoot":"","sources":["../src/useWrappedForm.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAGrD,eAAO,MAAM,aAAa,GAAI,WAAW,SAAS,CAAC,GAAG,CAAC,KAAG,OAAwD,CAAC;AAEnH,eAAO,MAAM,cAAc,EAAE,OAAO,OAmBnC,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,eAAe,GACvB,UAAU,GAAG,MACb,GAAG,KAAK,KAAG,IAIX,CAAC"}
+{"version":3,"file":"useWrappedForm.d.ts","sourceRoot":"","sources":["../src/useWrappedForm.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAG1D,eAAO,MAAM,aAAa,GAAI,WAAW,SAAS,CAAC,GAAG,CAAC,KAAG,OAAwD,CAAC;AAEnH,eAAO,MAAM,cAAc,EAAE,OAAO,OAmBnC,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,eAAe,GACvB,UAAU,GAAG,MACb,GAAG,KAAK,KAAG,IAIX,CAAC"}

package/dist/useWrappedForm.js

@@ -1,32 +1,43 @@
-import { useForm } from "react-hook-form";
 import { useCallback } from "react";
-const isFormLoading = (formState) => formState.isLoading || formState.isSubmitting;
-const useWrappedForm = (options) => {
-  const form = useForm(options);
-  const handleSubmit = useCallback(
-    (onSubmit, onError) => {
-      const wrappedSubmit = async (data) => {
-        try {
-          await onSubmit(data);
-        } catch (e) {
-          form.setError("root", { type: "server", message: e.message });
-          console.error("Error submitting form", e);
-        }
-      };
-      return form.handleSubmit(wrappedSubmit, onError);
-    },
-    [form]
-  );
-  return { ...form, handleSubmit };
-};
-const stopPropagation = (callback) => (e) => {
-  e.stopPropagation();
-  e.preventDefault();
-  callback(e);
+import { useForm } from "react-hook-form";
+//#region src/useWrappedForm.ts
+var isFormLoading = (formState) => formState.isLoading || formState.isSubmitting;
+var useWrappedForm = (options) => {
+	const form = useForm(options);
+	const handleSubmit = useCallback((onSubmit, onError) => {
+		const wrappedSubmit = async (data) => {
+			try {
+				await onSubmit(data);
+			} catch (e) {
+				form.setError("root", {
+					type: "server",
+					message: e.message
+				});
+				console.error("Error submitting form", e);
+			}
+		};
+		return form.handleSubmit(wrappedSubmit, onError);
+	}, [form]);
+	return {
+		...form,
+		handleSubmit
+	};
 };
-export {
-  isFormLoading,
-  stopPropagation,
-  useWrappedForm
+/**
+* Issue #3: Submit event still propagates to parent when using portal
+* https://reactjs.org/docs/portals.html#event-bubbling-through-portals
+* Event bubbling goes through React DOM instead of HTML DOM
+* Portals don't have an effect on this one, we need to stop event propagation
+* This should be our default form handling method
+* https://codesandbox.io/s/react-hook-form-nested-portal-6x3fvy?file=/src/App.tsx:1905-2261
+* https://github.com/react-hook-form/react-hook-form/issues/1005#issuecomment-988380981
+*/
+var stopPropagation = (callback) => (e) => {
+	e.stopPropagation();
+	e.preventDefault();
+	callback(e);
 };
-//# sourceMappingURL=useWrappedForm.js.map
+//#endregion
+export { isFormLoading, stopPropagation, useWrappedForm };
+
+//# sourceMappingURL=useWrappedForm.js.map

package/dist/useWrappedForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useWrappedForm.js","sources":["../src/useWrappedForm.ts"],"sourcesContent":["import { useForm, FormState } from 'react-hook-form';\nimport { useCallback } from 'react';\n\nexport const isFormLoading = (formState: FormState<any>): boolean => formState.isLoading || formState.isSubmitting;\n\nexport const useWrappedForm: typeof useForm = (options) => {\n    const form = useForm(options);\n\n    const handleSubmit: typeof form.handleSubmit = useCallback(\n        (onSubmit, onError) => {\n            const wrappedSubmit: typeof onSubmit = async (data) => {\n                try {\n                    await onSubmit(data);\n                } catch (e) {\n                    form.setError('root', { type: 'server', message: (e as Error).message });\n                    console.error('Error submitting form', e);\n                }\n            };\n            return form.handleSubmit(wrappedSubmit, onError);\n        },\n        [form],\n    );\n\n    return { ...form, handleSubmit };\n};\n\n/**\n * Issue #3: Submit event still propagates to parent when using portal\n * https://reactjs.org/docs/portals.html#event-bubbling-through-portals\n * Event bubbling goes through React DOM instead of HTML DOM\n * Portals don't have an effect on this one, we need to stop event propagation\n * This should be our default form handling method\n * https://codesandbox.io/s/react-hook-form-nested-portal-6x3fvy?file=/src/App.tsx:1905-2261\n * https://github.com/react-hook-form/react-hook-form/issues/1005#issuecomment-988380981\n */\nexport const stopPropagation =\n    (callback: any) =>\n    (e: Event): void => {\n        e.stopPropagation();\n        e.preventDefault();\n        callback(e);\n    };\n"],"names":[],"mappings":";;AAGO,MAAM,gBAAgB,CAAC,cAAuC,UAAU,aAAa,UAAU;AAE/F,MAAM,iBAAiC,CAAC,YAAY;AACvD,QAAM,OAAO,QAAQ,OAAO;AAE5B,QAAM,eAAyC;AAAA,IAC3C,CAAC,UAAU,YAAY;AACnB,YAAM,gBAAiC,OAAO,SAAS;AACnD,YAAI;AACA,gBAAM,SAAS,IAAI;AAAA,QACvB,SAAS,GAAG;AACR,eAAK,SAAS,QAAQ,EAAE,MAAM,UAAU,SAAU,EAAY,SAAS;AACvE,kBAAQ,MAAM,yBAAyB,CAAC;AAAA,QAC5C;AAAA,MACJ;AACA,aAAO,KAAK,aAAa,eAAe,OAAO;AAAA,IACnD;AAAA,IACA,CAAC,IAAI;AAAA,EAAA;AAGT,SAAO,EAAE,GAAG,MAAM,aAAA;AACtB;AAWO,MAAM,kBACT,CAAC,aACD,CAAC,MAAmB;AAChB,IAAE,gBAAA;AACF,IAAE,eAAA;AACF,WAAS,CAAC;AACd;"}
+{"version":3,"file":"useWrappedForm.js","names":[],"sources":["../src/useWrappedForm.ts"],"sourcesContent":["import { useForm, type FormState } from 'react-hook-form';\nimport { useCallback } from 'react';\n\nexport const isFormLoading = (formState: FormState<any>): boolean => formState.isLoading || formState.isSubmitting;\n\nexport const useWrappedForm: typeof useForm = (options) => {\n    const form = useForm(options);\n\n    const handleSubmit: typeof form.handleSubmit = useCallback(\n        (onSubmit, onError) => {\n            const wrappedSubmit: typeof onSubmit = async (data) => {\n                try {\n                    await onSubmit(data);\n                } catch (e) {\n                    form.setError('root', { type: 'server', message: (e as Error).message });\n                    console.error('Error submitting form', e);\n                }\n            };\n            return form.handleSubmit(wrappedSubmit, onError);\n        },\n        [form],\n    );\n\n    return { ...form, handleSubmit };\n};\n\n/**\n * Issue #3: Submit event still propagates to parent when using portal\n * https://reactjs.org/docs/portals.html#event-bubbling-through-portals\n * Event bubbling goes through React DOM instead of HTML DOM\n * Portals don't have an effect on this one, we need to stop event propagation\n * This should be our default form handling method\n * https://codesandbox.io/s/react-hook-form-nested-portal-6x3fvy?file=/src/App.tsx:1905-2261\n * https://github.com/react-hook-form/react-hook-form/issues/1005#issuecomment-988380981\n */\nexport const stopPropagation =\n    (callback: any) =>\n    (e: Event): void => {\n        e.stopPropagation();\n        e.preventDefault();\n        callback(e);\n    };\n"],"mappings":";;;AAGA,IAAa,iBAAiB,cAAuC,UAAU,aAAa,UAAU;AAEtG,IAAa,kBAAkC,YAAY;CACvD,MAAM,OAAO,QAAQ,OAAO;CAE5B,MAAM,eAAyC,aAC1C,UAAU,YAAY;EACnB,MAAM,gBAAiC,OAAO,SAAS;GACnD,IAAI;IACA,MAAM,SAAS,IAAI;GACvB,SAAS,GAAG;IACR,KAAK,SAAS,QAAQ;KAAE,MAAM;KAAU,SAAU,EAAY;IAAQ,CAAC;IACvE,QAAQ,MAAM,yBAAyB,CAAC;GAC5C;EACJ;EACA,OAAO,KAAK,aAAa,eAAe,OAAO;CACnD,GACA,CAAC,IAAI,CACT;CAEA,OAAO;EAAE,GAAG;EAAM;CAAa;AACnC;;;;;;;;;;AAWA,IAAa,mBACR,cACA,MAAmB;CAChB,EAAE,gBAAgB;CAClB,EAAE,eAAe;CACjB,SAAS,CAAC;AACd"}

package/package.json

@@ -1,18 +1,17 @@
 {
   "name": "@kirill.konshin/bootstrap",
   "description": "Utilities",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "type": "module",
+  "hasStorybook": true,
   "scripts": {
     "----- BUILD -----": "",
     "clean": "rm -rf dist .tscache tsconfig.tsbuildinfo",
     "build": "vite build",
-    "build:index": "cti create ./src",
-    "build:check-types": "attw --pack .",
     "start": "yarn build --watch",
     "wait": "wait-on ./dist/index.js",
     "----- TEST -----": "",
-    "test:disabled": "vitest run --coverage",
+    "test": "vitest run --coverage",
     "test:watch": "vitest watch --coverage",
     "----- STORYBOOK -----": "",
     "storybook:start": "storybook dev -p 6006",
@@ -64,5 +63,18 @@
   },
   "main": "./dist/index.js",
   "module": "./dist/index.js",
-  "types": "./dist/index.d.ts"
+  "types": "./dist/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/kirill-konshin/utils.git",
+    "directory": "packages/bootstrap"
+  },
+  "nx": {
+    "tags": [
+      "platform:react"
+    ]
+  },
+  "files": [
+    "dist"
+  ]
 }

package/.ctirc

@@ -1,11 +0,0 @@
-{
-  "addNewline": true,
-  "fileExcludePatterns": [
-    "*.stories.*",
-    "*.test.*",
-    "*.fixture.*"
-  ],
-  "verbose": false,
-  "withoutBackupFile": true,
-  "withoutComment": true
-}

package/.storybook/main.ts

@@ -1,2 +0,0 @@
-import config from '../../utils-private/.storybook/main';
-export default config;

package/.storybook/preview.ts

@@ -1,2 +0,0 @@
-import preview from '../../utils-private/.storybook/preview';
-export default preview;

package/.turbo/turbo-build.log

@@ -1,24 +0,0 @@
-vite v7.0.6 building SSR bundle for production...
-create succeeded: /home/runner/work/utils/utils/packages/bootstrap/src
-transforming...
-✓ 13 modules transformed.
-rendering chunks...
-
-[vite:dts] Start generate declaration files...
-dist/adaptiveContainer.js  0.42 kB │ map: 0.71 kB
-dist/globalLoading.js      0.45 kB │ map: 0.92 kB
-dist/loading.js            0.59 kB │ map: 1.12 kB
-dist/error.js              0.81 kB │ map: 1.70 kB
-dist/field.js              0.81 kB │ map: 1.66 kB
-dist/useWrappedForm.js     0.90 kB │ map: 2.27 kB
-dist/index.js              0.97 kB │ map: 0.10 kB
-dist/toaster.js            1.08 kB │ map: 2.12 kB
-dist/footer.js             1.58 kB │ map: 2.87 kB
-dist/responsiveHelper.js   1.82 kB │ map: 3.02 kB
-dist/useModal.js           2.08 kB │ map: 4.90 kB
-dist/controls.js           2.69 kB │ map: 5.90 kB
-dist/screen.js             3.42 kB │ map: 7.17 kB
-[vite:dts] Declaration files built in 3375ms.
-
-✓ built in 4.10s
-Updated package.json with exports

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/src/adaptiveContainer.tsx

@@ -1,12 +0,0 @@
-import React, { FC } from 'react';
-import { Container, ContainerProps } from 'react-bootstrap';
-import { useBreakpoint } from './responsiveHelper';
-
-export const AdaptiveContainer: FC<ContainerProps> = function AdaptiveContainer({ children, ...props }) {
-    const { isMobile } = useBreakpoint();
-    return (
-        <Container fluid={isMobile} {...props}>
-            {children}
-        </Container>
-    );
-};

package/src/controls.stories.tsx

@@ -1,62 +0,0 @@
-import React, { cloneElement, useCallback, useState } from 'react';
-import type { Meta, StoryObj } from '@storybook/react';
-import { fn } from '@storybook/test';
-
-import { Select, Control, Range, Checkbox } from './controls';
-
-const defaultOptions = { num: 1, bool: false, select: 'bar' };
-
-// More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export
-const meta: Meta<typeof Control> = {
-    title: 'Bootstrap / Controls',
-    parameters: {
-        layout: 'centered',
-    },
-    tags: ['autodocs'],
-    argTypes: {},
-    args: { options: { ...defaultOptions }, setOptions: fn(), defaultOptions: { ...defaultOptions }, name: 'unused' },
-    render: function Demo(args) {
-        const [options, setOptionsRaw] = useState(args.options);
-
-        const setOptions = useCallback(
-            (options: any) =>
-                setOptionsRaw((currentOptions) => {
-                    return { ...currentOptions, ...options };
-                }),
-            [],
-        );
-
-        const controlProps = { options, setOptions, defaultOptions };
-
-        const { children, name, ...safeArgs } = args;
-
-        return <div style={{ width: '300px' }}>{cloneElement(children as any, { ...safeArgs, ...controlProps })}</div>;
-    },
-};
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const RangeControl: Story = {
-    args: {
-        children: <Range name="Num" min={0} max={1} />,
-    },
-};
-
-export const CheckboxControl: Story = {
-    args: {
-        children: <Checkbox name="Bool" />,
-    },
-};
-
-export const SelectControl: Story = {
-    args: {
-        children: (
-            <Select name="Select">
-                <option value="foo">Foo</option>
-                <option value="bar">Bar</option>
-            </Select>
-        ),
-    },
-};