@simplybusiness/mobius 4.8.7 → 4.8.8

package/dist/cjs/components/List/List.stories.js

@@ -0,0 +1,82 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WithCustomIcons = exports.Reversed = exports.StartingFromASpecificNumber = exports.Ordered = exports.Unordered = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const icons_1 = require("@simplybusiness/icons");
+const index_1 = require("../index");
+const _1 = require(".");
+const utils_1 = require("../../utils");
+const meta = {
+    title: "Components/List",
+    component: _1.List,
+    argTypes: Object.assign({ liststyletype: {
+            control: { type: "radio" },
+            if: {
+                arg: "isOrdered",
+                truthy: false,
+            },
+        }, isReversed: {
+            if: {
+                arg: "isOrdered",
+            },
+        }, start: {
+            if: {
+                arg: "isOrdered",
+            },
+        } }, (0, utils_1.excludeControls)("icon")),
+};
+exports.Unordered = {
+    render: (args) => ((0, jsx_runtime_1.jsxs)(_1.List, Object.assign({}, args, { children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Foo" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Bar" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Baz" })] }))),
+    args: {
+        isOrdered: false,
+        isReversed: false,
+        liststyletype: "disc",
+    },
+};
+exports.Ordered = {
+    render: (args) => ((0, jsx_runtime_1.jsxs)(_1.List, Object.assign({}, args, { children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Foo" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Bar" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Baz" })] }))),
+    args: {
+        isOrdered: true,
+        isReversed: false,
+        start: 1,
+    },
+};
+exports.StartingFromASpecificNumber = {
+    render: (args) => ((0, jsx_runtime_1.jsxs)(_1.List, Object.assign({}, args, { children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Foo" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Bar" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Baz" })] }))),
+    args: {
+        isOrdered: true,
+        start: 12,
+        isReversed: false,
+    },
+    parameters: {
+        controls: {
+            exclude: ["liststyletype"],
+        },
+    },
+};
+exports.Reversed = {
+    render: (args) => ((0, jsx_runtime_1.jsxs)(_1.List, Object.assign({}, args, { children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Foo" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Bar" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Baz" })] }))),
+    args: {
+        isOrdered: true,
+        isReversed: true,
+        start: 3,
+    },
+    parameters: {
+        controls: {
+            exclude: ["liststyletype"],
+        },
+    },
+};
+exports.WithCustomIcons = {
+    render: (args) => ((0, jsx_runtime_1.jsxs)(_1.List, Object.assign({}, args, { children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: (0, jsx_runtime_1.jsx)(index_1.Text, { variant: "body", spacing: "tight", children: "Morbi eget sapien nulla. Mauris sodales est vel ullamcorper efficitur. Nam lobortis metus et ultricies imperdiet. Phasellus at sapien pharetra, commodo lorem eu, malesuada dui. Curabitur vulputate massa nec massa blandit, auctor elementum dolor ultricies." }) }), (0, jsx_runtime_1.jsx)(_1.ListItem, { icon: (0, jsx_runtime_1.jsx)(index_1.Icon, { icon: icons_1.cross, color: "red" }), children: "Etiam feugiat neque vel nulla semper ultrices. Phasellus lobortis nisl id mollis malesuada. Suspendisse ut porttitor purus. Praesent ornare felis a mattis pharetra. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec venenatis tristique condimentum." }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Nunc at turpis iaculis, finibus tellus eget, tempus mi. Vestibulum eget egestas mauris, non porttitor nisl. Nam a facilisis sem. Interdum et malesuada fames ac ante ipsum primis in faucibus. Suspendisse sit amet neque tempor, vestibulum eros ut, vulputate quam." })] }))),
+    args: {
+        icon: (0, jsx_runtime_1.jsx)(index_1.Icon, { icon: icons_1.tick, color: "green" }),
+    },
+    parameters: {
+        controls: {
+            exclude: ["isOrdered", "liststyletype"],
+        },
+    },
+};
+exports.default = meta;
+//# sourceMappingURL=List.stories.js.map

package/dist/cjs/components/List/List.stories.js.map

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

package/dist/cjs/components/List/List.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/components/List/List.test.js

@@ -0,0 +1,95 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
+const _1 = require(".");
+const LIST_CLASS_NAME = "mobius/List";
+const ITEM_CLASS_NAME = "mobius/ListItem";
+const ICON_CLASS_NAME = "--has-icon";
+const ITEM_CONTENT_CLASSNAME = "mobius/ListItemContent";
+const LIST_ICON_CLASS_NAME = "mobius/ListIcon";
+describe("List", () => {
+    it("should render without errors", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.List, { children: "Sample text" }));
+    });
+    it("renders an unordered list of items", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsxs)(_1.List, { "data-testid": "test", children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "One" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Two" })] }));
+        const list = react_1.screen.getByTestId("test").closest("ul");
+        expect(list).toBeTruthy();
+        expect(list === null || list === void 0 ? void 0 : list.childNodes.length).toEqual(2);
+    });
+    it("renders an ordered list of items", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsxs)(_1.List, { isOrdered: true, "data-testid": "test", children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "One" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Two" })] }));
+        const unorderedList = react_1.screen.getByTestId("test").closest("ul");
+        const orderedList = react_1.screen.getByTestId("test").closest("ol");
+        expect(unorderedList).not.toBeTruthy();
+        expect(orderedList).toBeTruthy();
+        expect(orderedList === null || orderedList === void 0 ? void 0 : orderedList.childNodes.length).toEqual(2);
+    });
+    it("renders a reversed list of items", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsxs)(_1.List, { isOrdered: true, isReversed: true, children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "One" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Two" })] }));
+        const list = react_1.screen.getByRole("list");
+        expect(list).toHaveAttribute("reversed", "");
+    });
+    it("renders list style", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsxs)(_1.List, { isOrdered: true, liststyletype: "disc", "data-testid": "test", children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "One" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Two" })] }));
+        expect(react_1.screen.getByTestId("test").closest("ol")).not.toHaveAttribute("liststyletype", "disc");
+    });
+    describe("given the liststyletype prop is set", () => {
+        it.each([
+            "disc",
+            "circle",
+            "square",
+            "decimal",
+            "georgian",
+            "trad-chinese-informal",
+            "kannada",
+        ])("it should render with --is-%s class name", liststyletype => {
+            const { container } = (0, react_1.render)((0, jsx_runtime_1.jsxs)(_1.List, { isOrdered: true, liststyletype: liststyletype, children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "One" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Two" })] }));
+            expect(container.firstChild).toHaveClass(`--is-${liststyletype}`);
+        });
+    });
+    it("renders list with custom icons", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsxs)(_1.List, { icon: "\u2705", children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "One" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Two" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { icon: "\u26A0\uFE0F", children: "Three" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Four" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { icon: "\u274C", children: "Five" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Six" })] }));
+        expect(react_1.screen.queryAllByText("✅")).toHaveLength(4);
+        expect(react_1.screen.queryAllByText("⚠️")).toHaveLength(1);
+        expect(react_1.screen.queryAllByText("❌")).toHaveLength(1);
+    });
+    describe("uses correct class names", () => {
+        it("uses Mobius class", () => {
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.List, { "data-testid": "test", children: "Sample text" }));
+            expect(react_1.screen.getByTestId("test")).toHaveClass("mobius");
+        });
+        it("uses base Mobius class", () => {
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.List, { "data-testid": "test", children: "Sample text" }));
+            expect(react_1.screen.getByTestId("test")).toHaveClass(LIST_CLASS_NAME);
+        });
+        it("includes custom class name", () => {
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.List, { className: "my-class", "data-testid": "test", children: "Sample Text" }));
+            expect(react_1.screen.getByTestId("test")).toHaveClass("my-class");
+            expect(react_1.screen.getByTestId("test")).toHaveClass(LIST_CLASS_NAME);
+        });
+        it("uses base Mobius class for list items", () => {
+            (0, react_1.render)((0, jsx_runtime_1.jsxs)(_1.List, { isOrdered: true, "data-testid": "test", children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { children: "One" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "Two" })] }));
+            const orderedList = react_1.screen.getByTestId("test").closest("ol");
+            expect(orderedList === null || orderedList === void 0 ? void 0 : orderedList.childNodes[0]).toHaveClass(ITEM_CLASS_NAME);
+            expect(orderedList === null || orderedList === void 0 ? void 0 : orderedList.childNodes[1]).toHaveClass(ITEM_CLASS_NAME);
+        });
+        it("includes custom class names for list items", () => {
+            (0, react_1.render)((0, jsx_runtime_1.jsxs)(_1.List, { isOrdered: true, "data-testid": "test", children: [(0, jsx_runtime_1.jsx)(_1.ListItem, { className: "item-1", children: "One" }), (0, jsx_runtime_1.jsx)(_1.ListItem, { className: "item-2", children: "Two" })] }));
+            const orderedList = react_1.screen.getByTestId("test").closest("ol");
+            expect(orderedList === null || orderedList === void 0 ? void 0 : orderedList.childNodes[0]).toHaveClass(ITEM_CLASS_NAME);
+            expect(orderedList === null || orderedList === void 0 ? void 0 : orderedList.childNodes[0]).toHaveClass("item-1");
+            expect(orderedList === null || orderedList === void 0 ? void 0 : orderedList.childNodes[1]).toHaveClass(ITEM_CLASS_NAME);
+            expect(orderedList === null || orderedList === void 0 ? void 0 : orderedList.childNodes[1]).toHaveClass("item-2");
+        });
+        it("includes custom class name when icon prop is provided", () => {
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.List, { icon: "\u2705", children: (0, jsx_runtime_1.jsx)(_1.ListItem, { children: "One" }) }));
+            expect(react_1.screen.getByRole("list")).toHaveClass(ICON_CLASS_NAME);
+            expect(react_1.screen.getByRole("listitem")).toHaveClass(ICON_CLASS_NAME);
+            expect(react_1.screen.getByRole("listitem").firstChild).toHaveClass(ITEM_CONTENT_CLASSNAME);
+            expect(react_1.screen.getByText("✅")).toHaveClass(LIST_ICON_CLASS_NAME);
+        });
+    });
+});
+//# sourceMappingURL=List.test.js.map

package/dist/cjs/components/List/List.test.js.map

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

package/dist/cjs/components/List/ListItem.d.ts

@@ -0,0 +1,14 @@
+import { Ref, ReactNode, RefAttributes } from "react";
+import { DOMProps } from "../../types/dom";
+import { ForwardedRefComponent } from "../../types/components";
+export type ListItemElementType = HTMLLIElement;
+export interface ListItemProps extends DOMProps, RefAttributes<ListItemElementType> {
+    children?: ReactNode;
+    value?: number;
+    className?: string;
+    parentIcon?: ReactNode;
+    icon?: ReactNode;
+}
+export type ListItemRef = Ref<ListItemElementType>;
+declare const ListItem: ForwardedRefComponent<ListItemProps, ListItemElementType>;
+export { ListItem };

package/dist/cjs/components/List/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./List";
+export * from "./ListItem";

package/dist/cjs/components/LoadingIndicator/LoadingIndicator.d.ts

@@ -0,0 +1,8 @@
+import { Ref, RefAttributes } from "react";
+import { ForwardedRefComponent } from "../../types/components";
+import { IconProps } from "../Icon";
+export interface LoadingIndicatorProps extends RefAttributes<SVGSVGElement>, IconProps {
+}
+export type LoadingIndicatorRef = Ref<SVGSVGElement>;
+declare const LoadingIndicator: ForwardedRefComponent<LoadingIndicatorProps, SVGSVGElement>;
+export { LoadingIndicator };

package/dist/cjs/components/LoadingIndicator/LoadingIndicator.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { LoadingIndicator } from "./LoadingIndicator";
+type StoryType = StoryObj<typeof LoadingIndicator>;
+declare const meta: Meta<typeof LoadingIndicator>;
+export declare const Normal: StoryType;
+export declare const Large: StoryType;
+export declare const WithCustomColour: StoryType;
+export declare const WithCustomIcon: StoryType;
+export default meta;

package/dist/cjs/components/LoadingIndicator/LoadingIndicator.stories.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WithCustomIcon = exports.WithCustomColour = exports.Large = exports.Normal = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const icons_1 = require("@simplybusiness/icons");
+const LoadingIndicator_1 = require("./LoadingIndicator");
+const iconOptions = { loading: icons_1.loading, refreshArrow: icons_1.refreshArrow, home: icons_1.home };
+const meta = {
+    title: "Components/LoadingIndicator",
+    component: LoadingIndicator_1.LoadingIndicator,
+    argTypes: {
+        icon: {
+            options: Object.keys(iconOptions),
+            mapping: iconOptions,
+            control: { type: "radio" },
+        },
+        color: {
+            options: ["darkcyan", "deeppink", "royalblue", "tomato"],
+            control: { type: "radio" },
+        },
+    },
+};
+exports.Normal = {
+    render: (args) => (0, jsx_runtime_1.jsx)(LoadingIndicator_1.LoadingIndicator, Object.assign({}, args)),
+    args: {
+        icon: icons_1.loading,
+        size: "md",
+    },
+};
+exports.Large = {
+    render: (args) => (0, jsx_runtime_1.jsx)(LoadingIndicator_1.LoadingIndicator, Object.assign({}, args)),
+    args: {
+        icon: icons_1.loading,
+        size: "lg",
+    },
+};
+exports.WithCustomColour = {
+    render: (args) => (0, jsx_runtime_1.jsx)(LoadingIndicator_1.LoadingIndicator, Object.assign({}, args)),
+    args: {
+        icon: icons_1.loading,
+        size: "md",
+        color: "tomato",
+    },
+};
+exports.WithCustomIcon = {
+    render: (args) => (0, jsx_runtime_1.jsx)(LoadingIndicator_1.LoadingIndicator, Object.assign({}, args)),
+    args: {
+        icon: icons_1.refreshArrow,
+        size: "md",
+    },
+};
+exports.default = meta;
+//# sourceMappingURL=LoadingIndicator.stories.js.map

package/dist/cjs/components/LoadingIndicator/LoadingIndicator.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingIndicator.stories.js","sourceRoot":"","sources":["../../../../src/components/LoadingIndicator/LoadingIndicator.stories.tsx"],"names":[],"mappings":";;;;AAAA,iDAAoE;AAEpE,yDAA6E;AAE7E,MAAM,WAAW,GAAG,EAAE,OAAO,EAAP,eAAO,EAAE,YAAY,EAAZ,oBAAY,EAAE,IAAI,EAAJ,YAAI,EAAE,CAAC;AAIpD,MAAM,IAAI,GAAkC;IAC1C,KAAK,EAAE,6BAA6B;IACpC,SAAS,EAAE,mCAAgB;IAC3B,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;YACjC,OAAO,EAAE,WAAW;YACpB,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;SAC3B;QACD,KAAK,EAAE;YACL,OAAO,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,QAAQ,CAAC;YACxD,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;SAC3B;KACF;CACF,CAAC;AAEW,QAAA,MAAM,GAAc;IAC/B,MAAM,EAAE,CAAC,IAA2B,EAAE,EAAE,CAAC,uBAAC,mCAAgB,oBAAK,IAAI,EAAI;IACvE,IAAI,EAAE;QACJ,IAAI,EAAE,eAAO;QACb,IAAI,EAAE,IAAI;KACX;CACF,CAAC;AAEW,QAAA,KAAK,GAAc;IAC9B,MAAM,EAAE,CAAC,IAA2B,EAAE,EAAE,CAAC,uBAAC,mCAAgB,oBAAK,IAAI,EAAI;IACvE,IAAI,EAAE;QACJ,IAAI,EAAE,eAAO;QACb,IAAI,EAAE,IAAI;KACX;CACF,CAAC;AAEW,QAAA,gBAAgB,GAAc;IACzC,MAAM,EAAE,CAAC,IAA2B,EAAE,EAAE,CAAC,uBAAC,mCAAgB,oBAAK,IAAI,EAAI;IACvE,IAAI,EAAE;QACJ,IAAI,EAAE,eAAO;QACb,IAAI,EAAE,IAAI;QACV,KAAK,EAAE,QAAQ;KAChB;CACF,CAAC;AAEW,QAAA,cAAc,GAAc;IACvC,MAAM,EAAE,CAAC,IAA2B,EAAE,EAAE,CAAC,uBAAC,mCAAgB,oBAAK,IAAI,EAAI;IACvE,IAAI,EAAE;QACJ,IAAI,EAAE,oBAAY;QAClB,IAAI,EAAE,IAAI;KACX;CACF,CAAC;AAEF,kBAAe,IAAI,CAAC"}

package/dist/cjs/components/LoadingIndicator/LoadingIndicator.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/components/LoadingIndicator/LoadingIndicator.test.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+/* eslint-disable no-restricted-syntax */
+const react_1 = require("@testing-library/react");
+const _1 = require(".");
+const CLASS_NAME = "mobius/LoadingIndicator";
+describe("Test for LoadingIndicator", () => {
+    it("should render the LoadingIndicator component", () => {
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.LoadingIndicator, {}));
+        expect(container).toBeTruthy();
+    });
+    describe("uses correct class names", () => {
+        it("uses Mobius class", () => {
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.LoadingIndicator, { "data-testid": "test" }));
+            expect(react_1.screen.getByTestId("test")).toHaveClass("mobius");
+        });
+        it("uses base Mobius class", () => {
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.LoadingIndicator, { "data-testid": "test" }));
+            expect(react_1.screen.getByTestId("test")).toHaveClass(CLASS_NAME);
+        });
+        it("includes custom class name", () => {
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.LoadingIndicator, { "data-testid": "test", className: "my-class" }));
+            expect(react_1.screen.getByTestId("test")).toHaveClass("my-class");
+            expect(react_1.screen.getByTestId("test")).toHaveClass(CLASS_NAME);
+        });
+    });
+});
+//# sourceMappingURL=LoadingIndicator.test.js.map

package/dist/cjs/components/LoadingIndicator/LoadingIndicator.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingIndicator.test.js","sourceRoot":"","sources":["../../../../src/components/LoadingIndicator/LoadingIndicator.test.tsx"],"names":[],"mappings":";;;AAAA,yCAAyC;AACzC,kDAAwD;AACxD,wBAAqC;AAErC,MAAM,UAAU,GAAG,yBAAyB,CAAC;AAE7C,QAAQ,CAAC,2BAA2B,EAAE,GAAG,EAAE;IACzC,EAAE,CAAC,8CAA8C,EAAE,GAAG,EAAE;QACtD,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,uBAAC,mBAAgB,KAAG,CAAC,CAAC;QACnD,MAAM,CAAC,SAAS,CAAC,CAAC,UAAU,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,QAAQ,CAAC,0BAA0B,EAAE,GAAG,EAAE;QACxC,EAAE,CAAC,mBAAmB,EAAE,GAAG,EAAE;YAC3B,IAAA,cAAM,EAAC,uBAAC,mBAAgB,mBAAa,MAAM,GAAG,CAAC,CAAC;YAChD,MAAM,CAAC,cAAM,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;QAC3D,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,wBAAwB,EAAE,GAAG,EAAE;YAChC,IAAA,cAAM,EAAC,uBAAC,mBAAgB,mBAAa,MAAM,GAAG,CAAC,CAAC;YAChD,MAAM,CAAC,cAAM,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;QAC7D,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,4BAA4B,EAAE,GAAG,EAAE;YACpC,IAAA,cAAM,EAAC,uBAAC,mBAAgB,mBAAa,MAAM,EAAC,SAAS,EAAC,UAAU,GAAG,CAAC,CAAC;YACrE,MAAM,CAAC,cAAM,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;YAC3D,MAAM,CAAC,cAAM,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;QAC7D,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/cjs/components/LoadingIndicator/index.d.ts

@@ -0,0 +1 @@
+export * from "./LoadingIndicator";

package/dist/cjs/components/Logo/Logo.d.ts

@@ -0,0 +1,14 @@
+import { Ref, RefAttributes } from "react";
+import { DOMProps } from "../../types/dom";
+import { ForwardedRefComponent } from "../../types/components";
+export type LogoElementType = SVGSVGElement;
+export interface LogoProps extends DOMProps, RefAttributes<LogoElementType> {
+    /** Custom class name for setting specific CSS */
+    className?: string;
+    /** Custom width. When defined along with height, it will scale proportionally */
+    width?: string;
+    /** Custom height. When defined along with width, it will scale proportionally */
+    height?: string;
+}
+export type LogoRef = Ref<LogoElementType>;
+export declare const Logo: ForwardedRefComponent<LogoProps, LogoElementType>;

package/dist/cjs/components/Logo/Logo.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { Logo } from "..";
+type StoryType = StoryObj<typeof Logo>;
+declare const meta: Meta<typeof Logo>;
+export declare const Normal: StoryType;
+export default meta;

package/dist/cjs/components/Logo/Logo.stories.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Normal = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const __1 = require("..");
+const utils_1 = require("../../utils");
+const meta = {
+    title: "Components/Logo",
+    component: __1.Logo,
+    argTypes: Object.assign({ width: {
+            control: "number",
+        } }, (0, utils_1.excludeControls)("height")),
+    args: {
+        width: "144",
+    },
+};
+exports.Normal = {
+    render: (args) => (0, jsx_runtime_1.jsx)(__1.Logo, Object.assign({}, args)),
+    args: {},
+};
+exports.default = meta;
+//# sourceMappingURL=Logo.stories.js.map

package/dist/cjs/components/Logo/Logo.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Logo.stories.js","sourceRoot":"","sources":["../../../../src/components/Logo/Logo.stories.tsx"],"names":[],"mappings":";;;;AACA,0BAAqC;AACrC,uCAA8C;AAI9C,MAAM,IAAI,GAAsB;IAC9B,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,QAAI;IACf,QAAQ,kBACN,KAAK,EAAE;YACL,OAAO,EAAE,QAAQ;SAClB,IACE,IAAA,uBAAe,EAAC,QAAQ,CAAC,CAC7B;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,KAAK;KACb;CACF,CAAC;AAEW,QAAA,MAAM,GAAc;IAC/B,MAAM,EAAE,CAAC,IAAe,EAAE,EAAE,CAAC,uBAAC,QAAI,oBAAK,IAAI,EAAI;IAC/C,IAAI,EAAE,EAAE;CACT,CAAC;AAEF,kBAAe,IAAI,CAAC"}

package/dist/cjs/components/Logo/Logo.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/components/Logo/Logo.test.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
+const _1 = require(".");
+const MOBIUS_CLASS_NAME = "mobius";
+const LOGO_CLASS_NAME = "mobius/Logo";
+describe("Logo", () => {
+    it("should render without errors", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Logo, {}));
+    });
+    describe("classes", () => {
+        it("should render with Mobius classes", () => {
+            const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Logo, {}));
+            expect(container.firstChild).toHaveClass(MOBIUS_CLASS_NAME);
+            expect(container.firstChild).toHaveClass(LOGO_CLASS_NAME);
+        });
+        it("should pass custom class name", () => {
+            const customClassName = "custom-class-name";
+            const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Logo, { className: customClassName }));
+            expect(container.firstChild).toHaveClass(customClassName);
+        });
+    });
+});
+//# sourceMappingURL=Logo.test.js.map

package/dist/cjs/components/Logo/Logo.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Logo.test.js","sourceRoot":"","sources":["../../../../src/components/Logo/Logo.test.tsx"],"names":[],"mappings":";;;AAAA,kDAAgD;AAChD,wBAAyB;AAEzB,MAAM,iBAAiB,GAAG,QAAQ,CAAC;AACnC,MAAM,eAAe,GAAG,aAAa,CAAC;AAEtC,QAAQ,CAAC,MAAM,EAAE,GAAG,EAAE;IACpB,EAAE,CAAC,8BAA8B,EAAE,GAAG,EAAE;QACtC,IAAA,cAAM,EAAC,uBAAC,OAAI,KAAG,CAAC,CAAC;IACnB,CAAC,CAAC,CAAC;IAEH,QAAQ,CAAC,SAAS,EAAE,GAAG,EAAE;QACvB,EAAE,CAAC,mCAAmC,EAAE,GAAG,EAAE;YAC3C,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,uBAAC,OAAI,KAAG,CAAC,CAAC;YAEvC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;YAC5D,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC;QAC5D,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,+BAA+B,EAAE,GAAG,EAAE;YACvC,MAAM,eAAe,GAAG,mBAAmB,CAAC;YAE5C,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,uBAAC,OAAI,IAAC,SAAS,EAAE,eAAe,GAAI,CAAC,CAAC;YAEnE,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC;QAC5D,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/cjs/components/Logo/index.d.ts

@@ -0,0 +1 @@
+export * from "./Logo";

package/dist/cjs/components/Modal/Content.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode, Ref, RefAttributes } from "react";
+import { DOMProps } from "../../types/dom";
+export type DivRef = Ref<HTMLDivElement>;
+export type DivElementType = HTMLDivElement;
+export interface ContentProps extends DOMProps, RefAttributes<DivElementType> {
+    children?: ReactNode;
+    onClose?: () => void;
+    closeLabel?: string;
+}
+declare const Content: import("react").ForwardRefExoticComponent<Omit<ContentProps, "ref"> & RefAttributes<HTMLDivElement>>;
+export { Content };

package/dist/cjs/components/Modal/Header.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode, Ref, RefAttributes } from "react";
+import { DOMProps } from "../../types/dom";
+export type HeaderElementType = HTMLDivElement;
+export type HeaderRef = Ref<HTMLElement>;
+export interface HeaderProps extends DOMProps, RefAttributes<HeaderElementType> {
+    children?: ReactNode;
+    onClose?: () => void;
+    closeLabel?: string;
+}
+declare const Header: import("react").ForwardRefExoticComponent<Omit<HeaderProps, "ref"> & RefAttributes<HTMLElement>>;
+export { Header };

package/dist/cjs/components/Modal/Modal.d.ts

@@ -0,0 +1,35 @@
+import { ReactNode } from "react";
+export interface ModalProps {
+    isOpen: boolean;
+    onClose?: () => void;
+    children?: ReactNode;
+    className?: string;
+    closeLabel?: string;
+    animation?: "slideUp" | "fade";
+    isFullScreen?: boolean;
+    /**
+     * **Deprecated:** No longer needed
+     */
+    size?: string;
+    /**
+     * **Deprecated:** No longer needed
+     */
+    appElement?: string;
+    /**
+     * **Deprecated:** No longer needed
+     */
+    preventCloseOnEsc?: boolean;
+    /**
+     * **Deprecated:** No longer needed
+     */
+    shouldFocusAfterRender?: boolean;
+    /**
+     * **Deprecated:** No longer needed
+     */
+    parentSelector?: () => HTMLElement;
+}
+declare const Modal: {
+    ({ isOpen, onClose, children, className, closeLabel, isFullScreen, animation, size, appElement, preventCloseOnEsc, shouldFocusAfterRender, parentSelector, }: ModalProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Modal };

package/dist/cjs/components/Modal/Modal.js

@@ -16,6 +16,7 @@ const _polyfilltests = require("../../utils/polyfill-tests");
 const _utils = require("../../utils");
 const _ModalContext = require("./ModalContext");
 const _hooks = require("../../hooks");
+const _useDeprecationWarning = require("../../hooks/useDeprecationWarning");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -25,14 +26,13 @@ const TRANSITION_CSS_VARIABLE = "--modal-transition-duration";
 const Modal = /*#__PURE__*/ (0, _react.forwardRef)((props, ref)=>{
     const { isOpen, onClose, onOpen, children, className, closeLabel, isFullScreen, animation, // Deprecated props below
     size, appElement, preventCloseOnEsc, shouldFocusAfterRender, parentSelector } = props;
-    const hasWarnedAboutMissingLabels = (0, _react.useRef)(false);
-    // Handle deprecated props
-    if (!hasWarnedAboutMissingLabels.current) {
-        if (size || appElement || preventCloseOnEsc || shouldFocusAfterRender || parentSelector) {
-            console.warn(`Deprecation warning: Mobius Modal no longer supports the following props: size, appElement, preventCloseOnEsc, shouldFocusAfterRender and parentSelector.`);
-            hasWarnedAboutMissingLabels.current = true;
-        }
-    }
+    (0, _useDeprecationWarning.useDeprecationWarning)({
+        size,
+        appElement,
+        preventCloseOnEsc,
+        shouldFocusAfterRender,
+        parentSelector
+    });
     const shouldTransition = (0, _polyfilltests.supportsDialog)();
     const dialogRef = (0, _react.useRef)(null);
     const { close } = (0, _hooks.useDialog)({

package/dist/cjs/components/Modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["\"use client\";\n\nimport classNames from \"classnames/dedupe\";\nimport { Ref, forwardRef, useMemo, useRef } from \"react\";\nimport { supportsDialog } from \"../../utils/polyfill-tests\";\nimport { ModalProps } from \"./types\";\nimport { mergeRefs } from \"../../utils\";\nimport { ModalContext } from \"./ModalContext\";\nimport { useDialog } from \"../../hooks\";\n\nexport type ModalElementType = HTMLDialogElement;\nexport type ModalRef = Ref<ModalElementType>;\n\nconst TRANSITION_CSS_VARIABLE = \"--modal-transition-duration\";\n\nconst Modal = forwardRef((props: ModalProps, ref: ModalRef) => {\n  const {\n    isOpen,\n    onClose,\n    onOpen,\n    children,\n    className,\n    closeLabel,\n    isFullScreen,\n    animation,\n    // Deprecated props below\n    size,\n    appElement,\n    preventCloseOnEsc,\n    shouldFocusAfterRender,\n    parentSelector,\n  } = props;\n  const hasWarnedAboutMissingLabels = useRef<boolean>(false);\n  // Handle deprecated props\n  if (!hasWarnedAboutMissingLabels.current) {\n    if (\n      size ||\n      appElement ||\n      preventCloseOnEsc ||\n      shouldFocusAfterRender ||\n      parentSelector\n    ) {\n      console.warn(\n        `Deprecation warning: Mobius Modal no longer supports the following props: size, appElement, preventCloseOnEsc, shouldFocusAfterRender and parentSelector.`,\n      );\n      hasWarnedAboutMissingLabels.current = true;\n    }\n  }\n\n  const shouldTransition = supportsDialog();\n  const dialogRef = useRef<HTMLDialogElement | null>(null);\n  const { close } = useDialog({\n    ref: dialogRef,\n    isOpen,\n    onOpen,\n    onClose,\n    transition: {\n      isEnabled: !!animation,\n      CSSVariable: TRANSITION_CSS_VARIABLE,\n    },\n  });\n\n  const modalClasses = classNames(\n    \"mobius\",\n    \"mobius/Modal\",\n    {\n      \"--no-dialog-support\": !shouldTransition, // This class is used to correctly position modal in x/y middle on iOS <= 15.2\n      \"--should-transition\": shouldTransition && animation,\n      \"--slide-up\": animation === \"slideUp\",\n      \"--fade\": animation === \"fade\",\n      \"--is-fullscreen\": isFullScreen,\n    },\n    className,\n  );\n\n  const contextValue = useMemo(\n    () => ({\n      onClose: close,\n      closeLabel,\n    }),\n    [close, closeLabel],\n  );\n\n  return (\n    <dialog\n      ref={mergeRefs([dialogRef, ref])}\n      onCancel={close}\n      className={modalClasses}\n    >\n      <ModalContext.Provider value={contextValue}>\n        {children}\n      </ModalContext.Provider>\n    </dialog>\n  );\n});\n\nModal.displayName = \"Modal\";\nexport { Modal };\n"],"names":["Modal","TRANSITION_CSS_VARIABLE","forwardRef","props","ref","isOpen","onClose","onOpen","children","className","closeLabel","isFullScreen","animation","size","appElement","preventCloseOnEsc","shouldFocusAfterRender","parentSelector","hasWarnedAboutMissingLabels","useRef","current","console","warn","shouldTransition","supportsDialog","dialogRef","close","useDialog","transition","isEnabled","CSSVariable","modalClasses","classNames","contextValue","useMemo","dialog","mergeRefs","onCancel","ModalContext","Provider","value","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;;;;+BAiGSA;;;eAAAA;;;;+DA/Fc;uBAC0B;+BAClB;uBAEL;8BACG;uBACH;;;;;;AAK1B,MAAMC,0BAA0B;AAEhC,MAAMD,sBAAQE,IAAAA,iBAAU,EAAC,CAACC,OAAmBC;IAC3C,MAAM,EACJC,MAAM,EACNC,OAAO,EACPC,MAAM,EACNC,QAAQ,EACRC,SAAS,EACTC,UAAU,EACVC,YAAY,EACZC,SAAS,EACT,yBAAyB;IACzBC,IAAI,EACJC,UAAU,EACVC,iBAAiB,EACjBC,sBAAsB,EACtBC,cAAc,EACf,GAAGd;IACJ,MAAMe,8BAA8BC,IAAAA,aAAM,EAAU;IACpD,0BAA0B;IAC1B,IAAI,CAACD,4BAA4BE,OAAO,EAAE;QACxC,IACEP,QACAC,cACAC,qBACAC,0BACAC,gBACA;YACAI,QAAQC,IAAI,CACV,CAAC,yJAAyJ,CAAC;YAE7JJ,4BAA4BE,OAAO,GAAG;QACxC;IACF;IAEA,MAAMG,mBAAmBC,IAAAA,6BAAc;IACvC,MAAMC,YAAYN,IAAAA,aAAM,EAA2B;IACnD,MAAM,EAAEO,KAAK,EAAE,GAAGC,IAAAA,gBAAS,EAAC;QAC1BvB,KAAKqB;QACLpB;QACAE;QACAD;QACAsB,YAAY;YACVC,WAAW,CAAC,CAACjB;YACbkB,aAAa7B;QACf;IACF;IAEA,MAAM8B,eAAeC,IAAAA,eAAU,EAC7B,UACA,gBACA;QACE,uBAAuB,CAACT;QACxB,uBAAuBA,oBAAoBX;QAC3C,cAAcA,cAAc;QAC5B,UAAUA,cAAc;QACxB,mBAAmBD;IACrB,GACAF;IAGF,MAAMwB,eAAeC,IAAAA,cAAO,EAC1B,IAAO,CAAA;YACL5B,SAASoB;YACThB;QACF,CAAA,GACA;QAACgB;QAAOhB;KAAW;IAGrB,qBACE,qBAACyB;QACC/B,KAAKgC,IAAAA,gBAAS,EAAC;YAACX;YAAWrB;SAAI;QAC/BiC,UAAUX;QACVjB,WAAWsB;kBAEX,cAAA,qBAACO,0BAAY,CAACC,QAAQ;YAACC,OAAOP;sBAC3BzB;;;AAIT;AAEAR,MAAMyC,WAAW,GAAG"}
+{"version":3,"sources":["../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["\"use client\";\n\nimport classNames from \"classnames/dedupe\";\nimport { Ref, forwardRef, useMemo, useRef } from \"react\";\nimport { supportsDialog } from \"../../utils/polyfill-tests\";\nimport { ModalProps } from \"./types\";\nimport { mergeRefs } from \"../../utils\";\nimport { ModalContext } from \"./ModalContext\";\nimport { useDialog } from \"../../hooks\";\nimport { useDeprecationWarning } from \"../../hooks/useDeprecationWarning\";\n\nexport type ModalElementType = HTMLDialogElement;\nexport type ModalRef = Ref<ModalElementType>;\n\nconst TRANSITION_CSS_VARIABLE = \"--modal-transition-duration\";\n\nconst Modal = forwardRef((props: ModalProps, ref: ModalRef) => {\n  const {\n    isOpen,\n    onClose,\n    onOpen,\n    children,\n    className,\n    closeLabel,\n    isFullScreen,\n    animation,\n    // Deprecated props below\n    size,\n    appElement,\n    preventCloseOnEsc,\n    shouldFocusAfterRender,\n    parentSelector,\n  } = props;\n\n  useDeprecationWarning({\n    size,\n    appElement,\n    preventCloseOnEsc,\n    shouldFocusAfterRender,\n    parentSelector,\n  });\n\n  const shouldTransition = supportsDialog();\n  const dialogRef = useRef<HTMLDialogElement | null>(null);\n  const { close } = useDialog({\n    ref: dialogRef,\n    isOpen,\n    onOpen,\n    onClose,\n    transition: {\n      isEnabled: !!animation,\n      CSSVariable: TRANSITION_CSS_VARIABLE,\n    },\n  });\n\n  const modalClasses = classNames(\n    \"mobius\",\n    \"mobius/Modal\",\n    {\n      \"--no-dialog-support\": !shouldTransition, // This class is used to correctly position modal in x/y middle on iOS <= 15.2\n      \"--should-transition\": shouldTransition && animation,\n      \"--slide-up\": animation === \"slideUp\",\n      \"--fade\": animation === \"fade\",\n      \"--is-fullscreen\": isFullScreen,\n    },\n    className,\n  );\n\n  const contextValue = useMemo(\n    () => ({\n      onClose: close,\n      closeLabel,\n    }),\n    [close, closeLabel],\n  );\n\n  return (\n    <dialog\n      ref={mergeRefs([dialogRef, ref])}\n      onCancel={close}\n      className={modalClasses}\n    >\n      <ModalContext.Provider value={contextValue}>\n        {children}\n      </ModalContext.Provider>\n    </dialog>\n  );\n});\n\nModal.displayName = \"Modal\";\nexport { Modal };\n"],"names":["Modal","TRANSITION_CSS_VARIABLE","forwardRef","props","ref","isOpen","onClose","onOpen","children","className","closeLabel","isFullScreen","animation","size","appElement","preventCloseOnEsc","shouldFocusAfterRender","parentSelector","useDeprecationWarning","shouldTransition","supportsDialog","dialogRef","useRef","close","useDialog","transition","isEnabled","CSSVariable","modalClasses","classNames","contextValue","useMemo","dialog","mergeRefs","onCancel","ModalContext","Provider","value","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;;;;+BA0FSA;;;eAAAA;;;;+DAxFc;uBAC0B;+BAClB;uBAEL;8BACG;uBACH;uCACY;;;;;;AAKtC,MAAMC,0BAA0B;AAEhC,MAAMD,sBAAQE,IAAAA,iBAAU,EAAC,CAACC,OAAmBC;IAC3C,MAAM,EACJC,MAAM,EACNC,OAAO,EACPC,MAAM,EACNC,QAAQ,EACRC,SAAS,EACTC,UAAU,EACVC,YAAY,EACZC,SAAS,EACT,yBAAyB;IACzBC,IAAI,EACJC,UAAU,EACVC,iBAAiB,EACjBC,sBAAsB,EACtBC,cAAc,EACf,GAAGd;IAEJe,IAAAA,4CAAqB,EAAC;QACpBL;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,MAAME,mBAAmBC,IAAAA,6BAAc;IACvC,MAAMC,YAAYC,IAAAA,aAAM,EAA2B;IACnD,MAAM,EAAEC,KAAK,EAAE,GAAGC,IAAAA,gBAAS,EAAC;QAC1BpB,KAAKiB;QACLhB;QACAE;QACAD;QACAmB,YAAY;YACVC,WAAW,CAAC,CAACd;YACbe,aAAa1B;QACf;IACF;IAEA,MAAM2B,eAAeC,IAAAA,eAAU,EAC7B,UACA,gBACA;QACE,uBAAuB,CAACV;QACxB,uBAAuBA,oBAAoBP;QAC3C,cAAcA,cAAc;QAC5B,UAAUA,cAAc;QACxB,mBAAmBD;IACrB,GACAF;IAGF,MAAMqB,eAAeC,IAAAA,cAAO,EAC1B,IAAO,CAAA;YACLzB,SAASiB;YACTb;QACF,CAAA,GACA;QAACa;QAAOb;KAAW;IAGrB,qBACE,qBAACsB;QACC5B,KAAK6B,IAAAA,gBAAS,EAAC;YAACZ;YAAWjB;SAAI;QAC/B8B,UAAUX;QACVd,WAAWmB;kBAEX,cAAA,qBAACO,0BAAY,CAACC,QAAQ;YAACC,OAAOP;sBAC3BtB;;;AAIT;AAEAR,MAAMsC,WAAW,GAAG"}

package/dist/cjs/components/Modal/Modal.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { Modal } from ".";
+type StoryType = StoryObj<typeof Modal>;
+declare const meta: Meta<typeof Modal>;
+export declare const Normal: StoryType;
+export declare const FullScreen: StoryType;
+export declare const WithAnimation: StoryType;
+export declare const WithLongContent: StoryType;
+export declare const WithNested: StoryType;
+export default meta;