@kirill.konshin/bootstrap 0.0.1 → 0.0.3

package/dist/footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"footer.js","sources":["../src/footer.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { Nav, Navbar } from 'react-bootstrap';\nimport { useBreakpoint } from './responsiveHelper';\nimport { AdaptiveContainer } from './adaptiveContainer';\n\nexport type FooterNavItemProps = {\n    href: any;\n    icon: any;\n    active?: boolean | undefined;\n    children?: string | undefined;\n};\n\nexport const FooterNavItem: FC<FooterNavItemProps> = function FooterNavItem({\n    href,\n    icon,\n    active = false,\n    children = '',\n}) {\n    // const pathname = usePathname();\n\n    const isFilepath = icon.includes('.');\n    let iconElement;\n\n    if (isFilepath) {\n        iconElement = <img src={icon} alt=\"icon\" className=\"me-lg-2\" />;\n    } else {\n        iconElement = <span className={`lead me-lg-2 ${icon}`} />;\n    }\n\n    // const active = isActivePath(href, pathname);\n\n    const link = (\n        <Nav.Link\n            // as={Link}\n            href={href}\n            // active={active} // has no effect when not pills or tabs\n            className={`px-0 px-lg-3 d-flex align-items-center flex-column flex-lg-row ${active ? 'text-primary' : ''}`}\n        >\n            {iconElement}\n            {children}\n        </Nav.Link>\n    );\n\n    return <Nav.Item style={{ flex: 1 }}>{link}</Nav.Item>;\n};\n\nexport const Footer: FC<any> = function Footer({ children }) {\n    const { isDesktop } = useBreakpoint();\n\n    return (\n        // border-bottom\n        <div className={isDesktop ? '' : 'border-top'}>\n            <Navbar className={isDesktop ? '' : 'py-0'}>\n                <AdaptiveContainer>\n                    {isDesktop && <Navbar.Brand href=\"/\">Le Brand</Navbar.Brand>}\n                    <Nav className={isDesktop ? 'me-auto' : 'justify-content-center flex-nowrap w-100'}>{children}</Nav>\n                </AdaptiveContainer>\n            </Navbar>\n        </div>\n    );\n};\n"],"names":["FooterNavItem","Footer"],"mappings":";;;;AAYO,MAAM,gBAAwC,SAASA,eAAc;AAAA,EACxE;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,WAAW;AACf,GAAG;AAGC,QAAM,aAAa,KAAK,SAAS,GAAG;AACpC,MAAI;AAEJ,MAAI,YAAY;AACZ,sCAAe,OAAA,EAAI,KAAK,MAAM,KAAI,QAAO,WAAU,WAAU;AAAA,EACjE,OAAO;AACH,kBAAc,oBAAC,QAAA,EAAK,WAAW,gBAAgB,IAAI,IAAI;AAAA,EAC3D;AAIA,QAAM,OACF;AAAA,IAAC,IAAI;AAAA,IAAJ;AAAA,MAEG;AAAA,MAEA,WAAW,kEAAkE,SAAS,iBAAiB,EAAE;AAAA,MAExG,UAAA;AAAA,QAAA;AAAA,QACA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIT,SAAO,oBAAC,IAAI,MAAJ,EAAS,OAAO,EAAE,MAAM,EAAA,GAAM,UAAA,MAAK;AAC/C;AAEO,MAAM,SAAkB,SAASC,QAAO,EAAE,YAAY;AACzD,QAAM,EAAE,UAAA,IAAc,cAAA;AAEtB;AAAA;AAAA,IAEI,oBAAC,OAAA,EAAI,WAAW,YAAY,KAAK,cAC7B,UAAA,oBAAC,QAAA,EAAO,WAAW,YAAY,KAAK,QAChC,+BAAC,mBAAA,EACI,UAAA;AAAA,MAAA,iCAAc,OAAO,OAAP,EAAa,MAAK,KAAI,UAAA,YAAQ;AAAA,0BAC5C,KAAA,EAAI,WAAW,YAAY,YAAY,4CAA6C,SAAA,CAAS;AAAA,IAAA,EAAA,CAClG,GACJ,EAAA,CACJ;AAAA;AAER;"}
+{"version":3,"file":"footer.js","names":[],"sources":["../src/footer.tsx"],"sourcesContent":["import React, { type FC, memo } from 'react';\nimport { Nav, Navbar } from 'react-bootstrap';\nimport { useBreakpoint } from './responsiveHelper';\nimport { AdaptiveContainer } from './adaptiveContainer';\n\nexport type FooterNavItemProps = {\n    href: any;\n    icon: any;\n    active?: boolean | undefined;\n    children?: string | undefined;\n};\n\nexport const FooterNavItem: FC<FooterNavItemProps> = memo(function FooterNavItem({\n    href,\n    icon,\n    active = false,\n    children = '',\n}) {\n    // const pathname = usePathname();\n\n    const isFilepath = icon.includes('.');\n    let iconElement;\n\n    if (isFilepath) {\n        iconElement = <img src={icon} alt=\"icon\" className=\"me-lg-2\" />;\n    } else {\n        iconElement = <span className={`lead me-lg-2 ${icon}`} />;\n    }\n\n    // const active = isActivePath(href, pathname);\n\n    const link = (\n        <Nav.Link\n            // as={Link}\n            href={href}\n            // active={active} // has no effect when not pills or tabs\n            className={`px-0 px-lg-3 d-flex align-items-center flex-column flex-lg-row ${active ? 'text-primary' : ''}`}\n        >\n            {iconElement}\n            {children}\n        </Nav.Link>\n    );\n\n    return <Nav.Item style={{ flex: 1 }}>{link}</Nav.Item>;\n});\n\nexport type FooterProps = {\n    children: any;\n};\n\nexport const Footer: FC<FooterProps> = memo(function Footer({ children }) {\n    const { isDesktop } = useBreakpoint();\n\n    return (\n        // border-bottom\n        <div className={isDesktop ? '' : 'border-top'}>\n            <Navbar className={isDesktop ? '' : 'py-0'}>\n                <AdaptiveContainer>\n                    {isDesktop && <Navbar.Brand href=\"/\">Le Brand</Navbar.Brand>}\n                    <Nav className={isDesktop ? 'me-auto' : 'justify-content-center flex-nowrap w-100'}>{children}</Nav>\n                </AdaptiveContainer>\n            </Navbar>\n        </div>\n    );\n});\n"],"mappings":";;;;;;AAYA,IAAa,gBAAwC,KAAK,SAAS,cAAc,EAC7E,MACA,MACA,SAAS,OACT,WAAW,MACZ;CAGC,MAAM,aAAa,KAAK,SAAS,GAAG;CACpC,IAAI;CAEJ,IAAI,YACA,cAAc,oBAAC,OAAD;EAAK,KAAK;EAAM,KAAI;EAAO,WAAU;CAAW,CAAA;MAE9D,cAAc,oBAAC,QAAD,EAAM,WAAW,gBAAgB,OAAS,CAAA;CAK5D,MAAM,OACF,qBAAC,IAAI,MAAL;EAEU;EAEN,WAAW,kEAAkE,SAAS,iBAAiB;YAJ3G,CAMK,aACA,QACK;;CAGd,OAAO,oBAAC,IAAI,MAAL;EAAU,OAAO,EAAE,MAAM,EAAE;YAAI;CAAe,CAAA;AACzD,CAAC;AAMD,IAAa,SAA0B,KAAK,SAAS,OAAO,EAAE,YAAY;CACtE,MAAM,EAAE,cAAc,cAAc;CAEpC,OAEI,oBAAC,OAAD;EAAK,WAAW,YAAY,KAAK;YAC7B,oBAAC,QAAD;GAAQ,WAAW,YAAY,KAAK;aAChC,qBAAC,mBAAD,EAAA,UAAA,CACK,aAAa,oBAAC,OAAO,OAAR;IAAc,MAAK;cAAI;GAAsB,CAAA,GAC3D,oBAAC,KAAD;IAAK,WAAW,YAAY,YAAY;IAA6C;GAAc,CAAA,CACpF,EAAA,CAAA;EACf,CAAA;CACP,CAAA;AAEb,CAAC"}

package/dist/footer.stories.d.ts

@@ -0,0 +1,12 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { Footer, FooterNavItem } from './footer.js';
+declare const meta: Meta<typeof Footer>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const WithActiveItem: Story;
+export declare const ManyItems: Story;
+export declare const NavItemDefault: StoryObj<typeof FooterNavItem>;
+export declare const NavItemActive: StoryObj<typeof FooterNavItem>;
+export declare const NavItemIconOnly: StoryObj<typeof FooterNavItem>;
+//# sourceMappingURL=footer.stories.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"footer.stories.d.ts","sourceRoot":"","sources":["../src/footer.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEjD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAQ7B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAgBrB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAmB5B,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAsBvB,CAAC;AAGF,eAAO,MAAM,cAAc,EAAE,QAAQ,CAAC,OAAO,aAAa,CAWzD,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,QAAQ,CAAC,OAAO,aAAa,CAYxD,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,QAAQ,CAAC,OAAO,aAAa,CAU1D,CAAC"}

package/dist/globalLoading.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"globalLoading.d.ts","sourceRoot":"","sources":["../src/globalLoading.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAIlC,MAAM,MAAM,kBAAkB,GAAG;IAAE,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC;AAEtD,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAYhD,CAAC"}
+{"version":3,"file":"globalLoading.d.ts","sourceRoot":"","sources":["../src/globalLoading.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,EAAE,EAAQ,MAAM,OAAO,CAAC;AAI7C,MAAM,MAAM,kBAAkB,GAAG;IAAE,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC;AAEtD,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAY/C,CAAC"}

package/dist/globalLoading.js

@@ -1,10 +1,15 @@
-import { jsx } from "react/jsx-runtime";
 import { Loading } from "./loading.js";
-const GlobalLoading = function GlobalLoading2({ loading }) {
-  if (!loading) return null;
-  return /* @__PURE__ */ jsx("div", { className: "bg-white position-absolute top-0 start-0 w-100 h-100 z-3 d-flex align-items-center justify-content-center", children: /* @__PURE__ */ jsx(Loading, {}) });
-};
-export {
-  GlobalLoading
-};
-//# sourceMappingURL=globalLoading.js.map
+import { memo } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/globalLoading.tsx
+var GlobalLoading = memo(function GlobalLoading({ loading }) {
+	if (!loading) return null;
+	return /* @__PURE__ */ jsx("div", {
+		className: "bg-white position-absolute top-0 start-0 w-100 h-100 z-3 d-flex align-items-center justify-content-center",
+		children: /* @__PURE__ */ jsx(Loading, {})
+	});
+});
+//#endregion
+export { GlobalLoading };
+
+//# sourceMappingURL=globalLoading.js.map

package/dist/globalLoading.js.map

@@ -1 +1 @@
-{"version":3,"file":"globalLoading.js","sources":["../src/globalLoading.tsx"],"sourcesContent":["import React, { FC } from 'react';\n// import { useLoading, useLoadingTimeout } from '../redux/loadingSlice';\nimport { Loading } from './loading';\n\nexport type GlobalLoadingProps = { loading: boolean };\n\nexport const GlobalLoading: FC<GlobalLoadingProps> = function GlobalLoading({ loading }) {\n    // const { loading } = useLoading();\n\n    // useLoadingTimeout(15000); // escape latch if something is stuck\n\n    if (!loading) return null;\n\n    return (\n        <div className=\"bg-white position-absolute top-0 start-0 w-100 h-100 z-3 d-flex align-items-center justify-content-center\">\n            <Loading />\n        </div>\n    );\n};\n"],"names":["GlobalLoading"],"mappings":";;AAMO,MAAM,gBAAwC,SAASA,eAAc,EAAE,WAAW;AAKrF,MAAI,CAAC,QAAS,QAAO;AAErB,6BACK,OAAA,EAAI,WAAU,6GACX,UAAA,oBAAC,WAAQ,GACb;AAER;"}
+{"version":3,"file":"globalLoading.js","names":[],"sources":["../src/globalLoading.tsx"],"sourcesContent":["import React, { type FC, memo } from 'react';\n// import { useLoading, useLoadingTimeout } from '../redux/loadingSlice';\nimport { Loading } from './loading';\n\nexport type GlobalLoadingProps = { loading: boolean };\n\nexport const GlobalLoading: FC<GlobalLoadingProps> = memo(function GlobalLoading({ loading }) {\n    // const { loading } = useLoading();\n\n    // useLoadingTimeout(15000); // escape latch if something is stuck\n\n    if (!loading) return null;\n\n    return (\n        <div className=\"bg-white position-absolute top-0 start-0 w-100 h-100 z-3 d-flex align-items-center justify-content-center\">\n            <Loading />\n        </div>\n    );\n});\n"],"mappings":";;;;AAMA,IAAa,gBAAwC,KAAK,SAAS,cAAc,EAAE,WAAW;CAK1F,IAAI,CAAC,SAAS,OAAO;CAErB,OACI,oBAAC,OAAD;EAAK,WAAU;YACX,oBAAC,SAAD,CAAU,CAAA;CACT,CAAA;AAEb,CAAC"}

package/dist/globalLoading.stories.d.ts

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

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

@@ -1 +1 @@
-{"version":3,"file":"globalLoading.stories.d.ts","sourceRoot":"","sources":["../src/globalLoading.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,aAAa,CAUpC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC"}
+{"version":3,"file":"globalLoading.stories.d.ts","sourceRoot":"","sources":["../src/globalLoading.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,aAAa,CAUpC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC"}

package/dist/index.d.ts

@@ -1,13 +1,13 @@
-export * from './adaptiveContainer';
-export * from './controls';
-export * from './error';
-export * from './field';
-export * from './footer';
-export * from './globalLoading';
-export * from './loading';
-export * from './responsiveHelper';
-export * from './screen';
-export * from './toaster';
-export * from './useModal';
-export * from './useWrappedForm';
+export * from './adaptiveContainer.js';
+export * from './controls.js';
+export * from './error.js';
+export * from './field.js';
+export * from './footer.js';
+export * from './globalLoading.js';
+export * from './loading.js';
+export * from './responsiveHelper.js';
+export * from './screen.js';
+export * from './toaster.js';
+export * from './useModal.js';
+export * from './useWrappedForm.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -1,35 +1,13 @@
+import { ResponsiveHelperBS, useBreakpoint } from "./responsiveHelper.js";
 import { AdaptiveContainer } from "./adaptiveContainer.js";
 import { Checkbox, Control, Label, Range, Select } from "./controls.js";
 import { ErrorAlert } from "./error.js";
 import { FieldGroup } from "./field.js";
 import { Footer, FooterNavItem } from "./footer.js";
-import { GlobalLoading } from "./globalLoading.js";
 import { Loading } from "./loading.js";
-import { ResponsiveHelperBS, useBreakpoint } from "./responsiveHelper.js";
+import { GlobalLoading } from "./globalLoading.js";
 import { Screen } from "./screen.js";
 import { Toaster } from "./toaster.js";
 import { useModal } from "./useModal.js";
 import { isFormLoading, stopPropagation, useWrappedForm } from "./useWrappedForm.js";
-export {
-  AdaptiveContainer,
-  Checkbox,
-  Control,
-  ErrorAlert,
-  FieldGroup,
-  Footer,
-  FooterNavItem,
-  GlobalLoading,
-  Label,
-  Loading,
-  Range,
-  ResponsiveHelperBS,
-  Screen,
-  Select,
-  Toaster,
-  isFormLoading,
-  stopPropagation,
-  useBreakpoint,
-  useModal,
-  useWrappedForm
-};
-//# sourceMappingURL=index.js.map
+export { AdaptiveContainer, Checkbox, Control, ErrorAlert, FieldGroup, Footer, FooterNavItem, GlobalLoading, Label, Loading, Range, ResponsiveHelperBS, Screen, Select, Toaster, isFormLoading, stopPropagation, useBreakpoint, useModal, useWrappedForm };

package/dist/loading.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"loading.d.ts","sourceRoot":"","sources":["../src/loading.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAW,YAAY,EAAS,MAAM,iBAAiB,CAAC;AAC/D,OAAc,EAAE,EAAE,EAAQ,MAAM,OAAO,CAAC;AAExC,MAAM,MAAM,YAAY,GAAG;IACvB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CAanC,CAAC"}
+{"version":3,"file":"loading.d.ts","sourceRoot":"","sources":["../src/loading.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,YAAY,EAAS,MAAM,iBAAiB,CAAC;AACpE,OAAc,EAAE,KAAK,EAAE,EAAQ,MAAM,OAAO,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG;IACvB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CAanC,CAAC"}

package/dist/loading.js

@@ -1,19 +1,21 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { Stack, Spinner } from "react-bootstrap";
 import { memo } from "react";
-const Loading = memo(function Loading2({
-  children = "Loading...",
-  show = true,
-  className = "",
-  size
-}) {
-  if (!show) return null;
-  return /* @__PURE__ */ jsxs(Stack, { direction: "horizontal", gap: 3, className: `align-self-auto ${className}`, children: [
-    /* @__PURE__ */ jsx(Spinner, { animation: "border", role: "status", size }),
-    /* @__PURE__ */ jsx("span", { children })
-  ] });
+import { Spinner, Stack } from "react-bootstrap";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/loading.tsx
+var Loading = memo(function Loading({ children = "Loading...", show = true, className = "", size }) {
+	if (!show) return null;
+	return /* @__PURE__ */ jsxs(Stack, {
+		direction: "horizontal",
+		gap: 3,
+		className: `align-self-auto ${className}`,
+		children: [/* @__PURE__ */ jsx(Spinner, {
+			animation: "border",
+			role: "status",
+			size
+		}), /* @__PURE__ */ jsx("span", { children })]
+	});
 });
-export {
-  Loading
-};
-//# sourceMappingURL=loading.js.map
+//#endregion
+export { Loading };
+
+//# sourceMappingURL=loading.js.map

package/dist/loading.js.map

@@ -1 +1 @@
-{"version":3,"file":"loading.js","sources":["../src/loading.tsx"],"sourcesContent":["import { Spinner, SpinnerProps, Stack } from 'react-bootstrap';\nimport React, { FC, memo } from 'react';\n\nexport type LoadingProps = {\n    children?: any;\n    show?: boolean;\n    className?: string;\n    size?: SpinnerProps['size'];\n};\n\nexport const Loading: FC<LoadingProps> = memo(function Loading({\n    children = 'Loading...' as any,\n    show = true,\n    className = '',\n    size,\n}) {\n    if (!show) return null;\n    return (\n        <Stack direction=\"horizontal\" gap={3} className={`align-self-auto ${className}`}>\n            <Spinner animation=\"border\" role=\"status\" size={size as any} />\n            <span>{children}</span>\n        </Stack>\n    );\n});\n"],"names":["Loading"],"mappings":";;;AAUO,MAAM,UAA4B,KAAK,SAASA,SAAQ;AAAA,EAC3D,WAAW;AAAA,EACX,OAAO;AAAA,EACP,YAAY;AAAA,EACZ;AACJ,GAAG;AACC,MAAI,CAAC,KAAM,QAAO;AAClB,SACI,qBAAC,SAAM,WAAU,cAAa,KAAK,GAAG,WAAW,mBAAmB,SAAS,IACzE,UAAA;AAAA,IAAA,oBAAC,SAAA,EAAQ,WAAU,UAAS,MAAK,UAAS,MAAmB;AAAA,IAC7D,oBAAC,UAAM,SAAA,CAAS;AAAA,EAAA,GACpB;AAER,CAAC;"}
+{"version":3,"file":"loading.js","names":[],"sources":["../src/loading.tsx"],"sourcesContent":["import { Spinner, type SpinnerProps, Stack } from 'react-bootstrap';\nimport React, { type FC, memo } from 'react';\n\nexport type LoadingProps = {\n    children?: any;\n    show?: boolean;\n    className?: string;\n    size?: SpinnerProps['size'];\n};\n\nexport const Loading: FC<LoadingProps> = memo(function Loading({\n    children = 'Loading...' as any,\n    show = true,\n    className = '',\n    size,\n}) {\n    if (!show) return null;\n    return (\n        <Stack direction=\"horizontal\" gap={3} className={`align-self-auto ${className}`}>\n            <Spinner animation=\"border\" role=\"status\" size={size as any} />\n            <span>{children}</span>\n        </Stack>\n    );\n});\n"],"mappings":";;;;AAUA,IAAa,UAA4B,KAAK,SAAS,QAAQ,EAC3D,WAAW,cACX,OAAO,MACP,YAAY,IACZ,QACD;CACC,IAAI,CAAC,MAAM,OAAO;CAClB,OACI,qBAAC,OAAD;EAAO,WAAU;EAAa,KAAK;EAAG,WAAW,mBAAmB;YAApE,CACI,oBAAC,SAAD;GAAS,WAAU;GAAS,MAAK;GAAe;EAAc,CAAA,GAC9D,oBAAC,QAAD,EAAO,SAAe,CAAA,CACnB;;AAEf,CAAC"}

package/dist/loading.stories.d.ts

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

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

@@ -1 +1 @@
-{"version":3,"file":"loading.stories.d.ts","sourceRoot":"","sources":["../src/loading.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAY9B,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,QAAQ,EAAE,KAItB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAIlB,CAAC"}
+{"version":3,"file":"loading.stories.d.ts","sourceRoot":"","sources":["../src/loading.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAY9B,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,QAAQ,EAAE,KAItB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAIlB,CAAC"}

package/dist/responsiveHelper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"responsiveHelper.d.ts","sourceRoot":"","sources":["../src/responsiveHelper.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAE,EAAE,EAAuB,MAAM,OAAO,CAAC;AAEvD,wBAAgB,aAAa,IAAI;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;CACtB,CAiCA;AAED,eAAO,MAAM,kBAAkB,EAAE,EAWhC,CAAC"}
+{"version":3,"file":"responsiveHelper.d.ts","sourceRoot":"","sources":["../src/responsiveHelper.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAE,KAAK,EAAE,EAA6B,MAAM,OAAO,CAAC;AAElE,wBAAgB,aAAa,IAAI;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;CACtB,CAiCA;AAED,eAAO,MAAM,kBAAkB,EAAE,EAW/B,CAAC"}

package/dist/responsiveHelper.js

@@ -1,46 +1,73 @@
 "use client";
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useState, useEffect } from "react";
+import { memo, useEffect, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/responsiveHelper.tsx
 function useBreakpoint() {
-  const [breakpoint, setBreakpoint] = useState("xs");
-  useEffect(() => {
-    const updateBreakpoint = () => {
-      const width = window.innerWidth;
-      if (width < 576) {
-        setBreakpoint("xs");
-      } else if (width < 768) {
-        setBreakpoint("sm");
-      } else if (width < 992) {
-        setBreakpoint("md");
-      } else if (width < 1200) {
-        setBreakpoint("lg");
-      } else if (width < 1400) {
-        setBreakpoint("xl");
-      } else {
-        setBreakpoint("xxl");
-      }
-    };
-    updateBreakpoint();
-    window.addEventListener("resize", updateBreakpoint);
-    return () => {
-      window.removeEventListener("resize", updateBreakpoint);
-    };
-  }, []);
-  const isMobile = ["xs", "sm", "md"].includes(breakpoint);
-  return { breakpoint, isMobile, isDesktop: !isMobile };
+	const [breakpoint, setBreakpoint] = useState("xs");
+	useEffect(() => {
+		const updateBreakpoint = () => {
+			const width = window.innerWidth;
+			if (width < 576) setBreakpoint("xs");
+			else if (width < 768) setBreakpoint("sm");
+			else if (width < 992) setBreakpoint("md");
+			else if (width < 1200) setBreakpoint("lg");
+			else if (width < 1400) setBreakpoint("xl");
+			else setBreakpoint("xxl");
+		};
+		updateBreakpoint();
+		window.addEventListener("resize", updateBreakpoint);
+		return () => {
+			window.removeEventListener("resize", updateBreakpoint);
+		};
+	}, []);
+	const isMobile = [
+		"xs",
+		"sm",
+		"md"
+	].includes(breakpoint);
+	return {
+		breakpoint,
+		isMobile,
+		isDesktop: !isMobile
+	};
 }
-const ResponsiveHelperBS = function ResponsiveHelperBS2() {
-  return /* @__PURE__ */ jsxs("span", { className: "small position-fixed bottom-0 z-3", style: { fontSize: "9px", right: 1, lineHeight: 1 }, children: [
-    /* @__PURE__ */ jsx("small", { className: "d-block d-sm-none", children: "XS" }),
-    /* @__PURE__ */ jsx("small", { className: "d-none d-sm-block d-md-none", children: "SM" }),
-    /* @__PURE__ */ jsx("small", { className: "d-none d-md-block d-lg-none", children: "MD" }),
-    /* @__PURE__ */ jsx("small", { className: "d-none d-lg-block d-xl-none", children: "LG" }),
-    /* @__PURE__ */ jsx("small", { className: "d-none d-xl-block d-xxl-none", children: "XL" }),
-    /* @__PURE__ */ jsx("small", { className: "d-none d-xxl-block", children: "XXL" })
-  ] });
-};
-export {
-  ResponsiveHelperBS,
-  useBreakpoint
-};
-//# sourceMappingURL=responsiveHelper.js.map
+var ResponsiveHelperBS = memo(function ResponsiveHelperBS() {
+	return /* @__PURE__ */ jsxs("span", {
+		className: "small position-fixed bottom-0 z-3",
+		style: {
+			fontSize: "9px",
+			right: 1,
+			lineHeight: 1
+		},
+		children: [
+			/* @__PURE__ */ jsx("small", {
+				className: "d-block d-sm-none",
+				children: "XS"
+			}),
+			/* @__PURE__ */ jsx("small", {
+				className: "d-none d-sm-block d-md-none",
+				children: "SM"
+			}),
+			/* @__PURE__ */ jsx("small", {
+				className: "d-none d-md-block d-lg-none",
+				children: "MD"
+			}),
+			/* @__PURE__ */ jsx("small", {
+				className: "d-none d-lg-block d-xl-none",
+				children: "LG"
+			}),
+			/* @__PURE__ */ jsx("small", {
+				className: "d-none d-xl-block d-xxl-none",
+				children: "XL"
+			}),
+			/* @__PURE__ */ jsx("small", {
+				className: "d-none d-xxl-block",
+				children: "XXL"
+			})
+		]
+	});
+});
+//#endregion
+export { ResponsiveHelperBS, useBreakpoint };
+
+//# sourceMappingURL=responsiveHelper.js.map

package/dist/responsiveHelper.js.map

@@ -1 +1 @@
-{"version":3,"file":"responsiveHelper.js","sources":["../src/responsiveHelper.tsx"],"sourcesContent":["'use client';\n\nimport React, { FC, useEffect, useState } from 'react';\n\nexport function useBreakpoint(): {\n    breakpoint: string;\n    isMobile: boolean;\n    isDesktop: boolean;\n} {\n    const [breakpoint, setBreakpoint] = useState('xs');\n\n    useEffect(() => {\n        const updateBreakpoint = () => {\n            const width = window.innerWidth;\n            if (width < 576) {\n                setBreakpoint('xs');\n            } else if (width < 768) {\n                setBreakpoint('sm');\n            } else if (width < 992) {\n                setBreakpoint('md');\n            } else if (width < 1200) {\n                setBreakpoint('lg');\n            } else if (width < 1400) {\n                setBreakpoint('xl');\n            } else {\n                setBreakpoint('xxl');\n            }\n        };\n\n        updateBreakpoint();\n\n        window.addEventListener('resize', updateBreakpoint);\n\n        return () => {\n            window.removeEventListener('resize', updateBreakpoint);\n        };\n    }, []);\n\n    const isMobile = ['xs', 'sm', 'md'].includes(breakpoint);\n\n    return { breakpoint, isMobile, isDesktop: !isMobile };\n}\n\nexport const ResponsiveHelperBS: FC = function ResponsiveHelperBS() {\n    return (\n        <span className=\"small position-fixed bottom-0 z-3\" style={{ fontSize: '9px', right: 1, lineHeight: 1 }}>\n            <small className=\"d-block d-sm-none\">XS</small>\n            <small className=\"d-none d-sm-block d-md-none\">SM</small>\n            <small className=\"d-none d-md-block d-lg-none\">MD</small>\n            <small className=\"d-none d-lg-block d-xl-none\">LG</small>\n            <small className=\"d-none d-xl-block d-xxl-none\">XL</small>\n            <small className=\"d-none d-xxl-block\">XXL</small>\n        </span>\n    );\n};\n"],"names":["ResponsiveHelperBS"],"mappings":";;;AAIO,SAAS,gBAId;AACE,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,IAAI;AAEjD,YAAU,MAAM;AACZ,UAAM,mBAAmB,MAAM;AAC3B,YAAM,QAAQ,OAAO;AACrB,UAAI,QAAQ,KAAK;AACb,sBAAc,IAAI;AAAA,MACtB,WAAW,QAAQ,KAAK;AACpB,sBAAc,IAAI;AAAA,MACtB,WAAW,QAAQ,KAAK;AACpB,sBAAc,IAAI;AAAA,MACtB,WAAW,QAAQ,MAAM;AACrB,sBAAc,IAAI;AAAA,MACtB,WAAW,QAAQ,MAAM;AACrB,sBAAc,IAAI;AAAA,MACtB,OAAO;AACH,sBAAc,KAAK;AAAA,MACvB;AAAA,IACJ;AAEA,qBAAA;AAEA,WAAO,iBAAiB,UAAU,gBAAgB;AAElD,WAAO,MAAM;AACT,aAAO,oBAAoB,UAAU,gBAAgB;AAAA,IACzD;AAAA,EACJ,GAAG,CAAA,CAAE;AAEL,QAAM,WAAW,CAAC,MAAM,MAAM,IAAI,EAAE,SAAS,UAAU;AAEvD,SAAO,EAAE,YAAY,UAAU,WAAW,CAAC,SAAA;AAC/C;AAEO,MAAM,qBAAyB,SAASA,sBAAqB;AAChE,SACI,qBAAC,QAAA,EAAK,WAAU,qCAAoC,OAAO,EAAE,UAAU,OAAO,OAAO,GAAG,YAAY,EAAA,GAChG,UAAA;AAAA,IAAA,oBAAC,SAAA,EAAM,WAAU,qBAAoB,UAAA,MAAE;AAAA,IACvC,oBAAC,SAAA,EAAM,WAAU,+BAA8B,UAAA,MAAE;AAAA,IACjD,oBAAC,SAAA,EAAM,WAAU,+BAA8B,UAAA,MAAE;AAAA,IACjD,oBAAC,SAAA,EAAM,WAAU,+BAA8B,UAAA,MAAE;AAAA,IACjD,oBAAC,SAAA,EAAM,WAAU,gCAA+B,UAAA,MAAE;AAAA,IAClD,oBAAC,SAAA,EAAM,WAAU,sBAAqB,UAAA,MAAA,CAAG;AAAA,EAAA,GAC7C;AAER;"}
+{"version":3,"file":"responsiveHelper.js","names":[],"sources":["../src/responsiveHelper.tsx"],"sourcesContent":["'use client';\n\nimport React, { type FC, memo, useEffect, useState } from 'react';\n\nexport function useBreakpoint(): {\n    breakpoint: string;\n    isMobile: boolean;\n    isDesktop: boolean;\n} {\n    const [breakpoint, setBreakpoint] = useState('xs');\n\n    useEffect(() => {\n        const updateBreakpoint = () => {\n            const width = window.innerWidth;\n            if (width < 576) {\n                setBreakpoint('xs');\n            } else if (width < 768) {\n                setBreakpoint('sm');\n            } else if (width < 992) {\n                setBreakpoint('md');\n            } else if (width < 1200) {\n                setBreakpoint('lg');\n            } else if (width < 1400) {\n                setBreakpoint('xl');\n            } else {\n                setBreakpoint('xxl');\n            }\n        };\n\n        updateBreakpoint();\n\n        window.addEventListener('resize', updateBreakpoint);\n\n        return () => {\n            window.removeEventListener('resize', updateBreakpoint);\n        };\n    }, []);\n\n    const isMobile = ['xs', 'sm', 'md'].includes(breakpoint);\n\n    return { breakpoint, isMobile, isDesktop: !isMobile };\n}\n\nexport const ResponsiveHelperBS: FC = memo(function ResponsiveHelperBS() {\n    return (\n        <span className=\"small position-fixed bottom-0 z-3\" style={{ fontSize: '9px', right: 1, lineHeight: 1 }}>\n            <small className=\"d-block d-sm-none\">XS</small>\n            <small className=\"d-none d-sm-block d-md-none\">SM</small>\n            <small className=\"d-none d-md-block d-lg-none\">MD</small>\n            <small className=\"d-none d-lg-block d-xl-none\">LG</small>\n            <small className=\"d-none d-xl-block d-xxl-none\">XL</small>\n            <small className=\"d-none d-xxl-block\">XXL</small>\n        </span>\n    );\n});\n"],"mappings":";;;;AAIA,SAAgB,gBAId;CACE,MAAM,CAAC,YAAY,iBAAiB,SAAS,IAAI;CAEjD,gBAAgB;EACZ,MAAM,yBAAyB;GAC3B,MAAM,QAAQ,OAAO;GACrB,IAAI,QAAQ,KACR,cAAc,IAAI;QACf,IAAI,QAAQ,KACf,cAAc,IAAI;QACf,IAAI,QAAQ,KACf,cAAc,IAAI;QACf,IAAI,QAAQ,MACf,cAAc,IAAI;QACf,IAAI,QAAQ,MACf,cAAc,IAAI;QAElB,cAAc,KAAK;EAE3B;EAEA,iBAAiB;EAEjB,OAAO,iBAAiB,UAAU,gBAAgB;EAElD,aAAa;GACT,OAAO,oBAAoB,UAAU,gBAAgB;EACzD;CACJ,GAAG,CAAC,CAAC;CAEL,MAAM,WAAW;EAAC;EAAM;EAAM;CAAI,CAAC,CAAC,SAAS,UAAU;CAEvD,OAAO;EAAE;EAAY;EAAU,WAAW,CAAC;CAAS;AACxD;AAEA,IAAa,qBAAyB,KAAK,SAAS,qBAAqB;CACrE,OACI,qBAAC,QAAD;EAAM,WAAU;EAAoC,OAAO;GAAE,UAAU;GAAO,OAAO;GAAG,YAAY;EAAE;YAAtG;GACI,oBAAC,SAAD;IAAO,WAAU;cAAoB;GAAS,CAAA;GAC9C,oBAAC,SAAD;IAAO,WAAU;cAA8B;GAAS,CAAA;GACxD,oBAAC,SAAD;IAAO,WAAU;cAA8B;GAAS,CAAA;GACxD,oBAAC,SAAD;IAAO,WAAU;cAA8B;GAAS,CAAA;GACxD,oBAAC,SAAD;IAAO,WAAU;cAA+B;GAAS,CAAA;GACzD,oBAAC,SAAD;IAAO,WAAU;cAAqB;GAAU,CAAA;EAC9C;;AAEd,CAAC"}

package/dist/responsiveHelper.stories.d.ts

@@ -0,0 +1,9 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { ResponsiveHelperBS } from './responsiveHelper.js';
+declare const meta: Meta<typeof ResponsiveHelperBS>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const UseBreakpointHook: Story;
+export declare const CombinedDemo: Story;
+//# sourceMappingURL=responsiveHelper.stories.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"responsiveHelper.stories.d.ts","sourceRoot":"","sources":["../src/responsiveHelper.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,kBAAkB,EAAiB,MAAM,oBAAoB,CAAC;AAEvE,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,kBAAkB,CAQzC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAkBrB,CAAC;AA8CF,eAAO,MAAM,iBAAiB,EAAE,KAS/B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAc1B,CAAC"}

package/dist/screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"screen.d.ts","sourceRoot":"","sources":["../src/screen.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAQ,MAAM,OAAO,CAAC;AAKxC,MAAM,MAAM,WAAW,GAAG;IACtB,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,QAAQ,EAAE,GAAG,CAAC;IACd,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;CAEpB,CAAC;AAGF,eAAO,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CAsHjC,CAAC"}
+{"version":3,"file":"screen.d.ts","sourceRoot":"","sources":["../src/screen.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,EAAE,EAAQ,MAAM,OAAO,CAAC;AAK7C,MAAM,MAAM,WAAW,GAAG;IACtB,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,QAAQ,EAAE,GAAG,CAAC;IACd,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;CAEpB,CAAC;AAGF,eAAO,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CAsHjC,CAAC"}

package/dist/screen.js

@@ -1,80 +1,87 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { memo } from "react";
-import { Navbar, Nav, Stack, Button } from "react-bootstrap";
 import { useBreakpoint } from "./responsiveHelper.js";
 import { AdaptiveContainer } from "./adaptiveContainer.js";
-const Screen = memo(function Screen2({
-  backBtn,
-  backCb,
-  backIcon,
-  forwardBtn,
-  forwardIcon,
-  forwardCb,
-  footer,
-  menu,
-  header,
-  children,
-  noContentPadding = false,
-  contentClassName = "",
-  title = "",
-  centerContent = false,
-  noHeader = false,
-  noFooter = false,
-  noMenu = false
-  // noFolders = false,
-}) {
-  backBtn = backBtn || (backCb ? (
-    // backCb === true ? () => router.back() : backCb
-    /* @__PURE__ */ jsx(Button, { onClick: backCb, variant: "nav", children: /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("span", { className: backIcon || "bi-chevron-left icon-thick" }),
-      /* @__PURE__ */ jsx("span", { className: "d-none d-lg-inline ms-2", children: "Back" })
-    ] }) })
-  ) : null);
-  forwardBtn = forwardBtn || (forwardCb ? /* @__PURE__ */ jsx(Button, { onClick: forwardCb, children: forwardIcon ? /* @__PURE__ */ jsx("span", { className: forwardIcon }) : "Next" }) : null);
-  const { isMobile, isDesktop } = useBreakpoint();
-  return /* @__PURE__ */ jsxs("div", { className: `d-flex flex-column flex-grow-1 flex-lg-grow-0 ${isMobile ? "vh-100" : ""}`, "data-id": "screen", children: [
-    !noHeader && /* @__PURE__ */ jsxs("header", { className: isDesktop ? "" : "shadow-sm border-bottom", "data-id": "header", children: [
-      isDesktop && !noMenu && menu,
-      title && // (isDesktop ? 'border-bottom' : '')
-      /* @__PURE__ */ jsx(Navbar, { expand: true, className: "main-nav", children: /* @__PURE__ */ jsxs(AdaptiveContainer, { className: "gap-2", children: [
-        backBtn && /* @__PURE__ */ jsx(Nav, { className: "hstack gap-3", children: backBtn }),
-        /* @__PURE__ */ jsx(Navbar.Brand, { className: "me-auto", children: title }),
-        forwardBtn && /* @__PURE__ */ jsx(Nav, { className: "hstack gap-3", children: forwardBtn })
-      ] }) }),
-      header
-    ] }),
-    /* @__PURE__ */ jsxs(
-      AdaptiveContainer,
-      {
-        as: "main",
-        className: [
-          isMobile ? "overflow-y-auto overflow-x-hidden" : "gap-3",
-          `flex-grow-1 d-flex flex-column`,
-          centerContent ? "align-items-center justify-content-center" : "justify-content-start",
-          contentClassName,
-          noContentPadding ? "p-0" : "py-3"
-        ].filter(Boolean).join(" "),
-        "data-id": "content",
-        children: [
-          children,
-          isDesktop && !noFooter && /* @__PURE__ */ jsxs(Fragment, { children: [
-            footer,
-            (forwardBtn || backBtn) && // Navbar screws up the popper
-            /* @__PURE__ */ jsxs(Stack, { gap: 3, direction: "horizontal", children: [
-              backBtn && /* @__PURE__ */ jsx(Nav, { className: "hstack gap-3", children: backBtn }),
-              forwardBtn && /* @__PURE__ */ jsx(Nav, { className: "hstack gap-3 flex-grow-1", children: forwardBtn })
-            ] })
-          ] })
-        ]
-      }
-    ),
-    !noMenu && !noFooter && /* @__PURE__ */ jsxs("footer", { className: "shadow-lg border-top d-block d-lg-none", "data-id": "footer", children: [
-      !noFooter && footer,
-      !noMenu && menu
-    ] })
-  ] });
+import { memo } from "react";
+import { Button, Nav, Navbar, Stack } from "react-bootstrap";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/screen.tsx
+var Screen = memo(function Screen({ backBtn, backCb, backIcon, forwardBtn, forwardIcon, forwardCb, footer, menu, header, children, noContentPadding = false, contentClassName = "", title = "", centerContent = false, noHeader = false, noFooter = false, noMenu = false }) {
+	backBtn = backBtn || (backCb ? /* @__PURE__ */ jsx(Button, {
+		onClick: backCb,
+		variant: "nav",
+		children: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", { className: backIcon || "bi-chevron-left icon-thick" }), /* @__PURE__ */ jsx("span", {
+			className: "d-none d-lg-inline ms-2",
+			children: "Back"
+		})] })
+	}) : null);
+	forwardBtn = forwardBtn || (forwardCb ? /* @__PURE__ */ jsx(Button, {
+		onClick: forwardCb,
+		children: forwardIcon ? /* @__PURE__ */ jsx("span", { className: forwardIcon }) : "Next"
+	}) : null);
+	const { isMobile, isDesktop } = useBreakpoint();
+	return /* @__PURE__ */ jsxs("div", {
+		className: `d-flex flex-column flex-grow-1 flex-lg-grow-0 ${isMobile ? "vh-100" : ""}`,
+		"data-id": "screen",
+		children: [
+			!noHeader && /* @__PURE__ */ jsxs("header", {
+				className: isDesktop ? "" : "shadow-sm border-bottom",
+				"data-id": "header",
+				children: [
+					isDesktop && !noMenu && menu,
+					title && /* @__PURE__ */ jsx(Navbar, {
+						expand: true,
+						className: "main-nav",
+						children: /* @__PURE__ */ jsxs(AdaptiveContainer, {
+							className: "gap-2",
+							children: [
+								backBtn && /* @__PURE__ */ jsx(Nav, {
+									className: "hstack gap-3",
+									children: backBtn
+								}),
+								/* @__PURE__ */ jsx(Navbar.Brand, {
+									className: "me-auto",
+									children: title
+								}),
+								forwardBtn && /* @__PURE__ */ jsx(Nav, {
+									className: "hstack gap-3",
+									children: forwardBtn
+								})
+							]
+						})
+					}),
+					header
+				]
+			}),
+			/* @__PURE__ */ jsxs(AdaptiveContainer, {
+				as: "main",
+				className: [
+					isMobile ? "overflow-y-auto overflow-x-hidden" : "gap-3",
+					`flex-grow-1 d-flex flex-column`,
+					centerContent ? "align-items-center justify-content-center" : "justify-content-start",
+					contentClassName,
+					noContentPadding ? "p-0" : "py-3"
+				].filter(Boolean).join(" "),
+				"data-id": "content",
+				children: [children, isDesktop && !noFooter && /* @__PURE__ */ jsxs(Fragment, { children: [footer, (forwardBtn || backBtn) && /* @__PURE__ */ jsxs(Stack, {
+					gap: 3,
+					direction: "horizontal",
+					children: [backBtn && /* @__PURE__ */ jsx(Nav, {
+						className: "hstack gap-3",
+						children: backBtn
+					}), forwardBtn && /* @__PURE__ */ jsx(Nav, {
+						className: "hstack gap-3 flex-grow-1",
+						children: forwardBtn
+					})]
+				})] })]
+			}),
+			!noMenu && !noFooter && /* @__PURE__ */ jsxs("footer", {
+				className: "shadow-lg border-top d-block d-lg-none",
+				"data-id": "footer",
+				children: [!noFooter && footer, !noMenu && menu]
+			})
+		]
+	});
 });
-export {
-  Screen
-};
-//# sourceMappingURL=screen.js.map
+//#endregion
+export { Screen };
+
+//# sourceMappingURL=screen.js.map