linkedunion-design-kit 1.5.2 → 1.5.3

package/dist/src/components/MediaCard/PostByCategory/PostByCategoryTheme1.test.jsx

@@ -0,0 +1,87 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { render, screen } from "@testing-library/react";
+import "@testing-library/jest-dom";
+import { PostByCategoryTheme1 } from "./PostByCategoryTheme1";
+import userEvent from "@testing-library/user-event";
+describe("PostByCategoryTheme1 Component", function () {
+    var mockProps = {
+        id: 1,
+        heading: "John Doe",
+        body: "Software Engineer",
+        image: "https://via.placeholder.com/150",
+        btnLabel: "View Profile",
+        href: "/profile",
+        className: "custom-class",
+    };
+    it("Render the post by category theme1 with correct body and heading text", function () {
+        render(<PostByCategoryTheme1 {...mockProps}/>);
+        var headingElement = screen.getByText(mockProps.heading);
+        var bodyElement = screen.getByText(mockProps.body);
+        expect(headingElement).toBeInTheDocument();
+        expect(bodyElement).toBeInTheDocument();
+    });
+    it("renders the button with correct label and icon", function () {
+        render(<PostByCategoryTheme1 {...mockProps}/>);
+        var buttonElement = screen.getByRole("button", {
+            name: mockProps.btnLabel,
+        });
+        expect(buttonElement).toBeInTheDocument();
+        expect(buttonElement).toHaveTextContent(mockProps.btnLabel);
+    });
+    it("renders the link with the correct href", function () {
+        render(<PostByCategoryTheme1 {...mockProps}/>);
+        var linkElement = screen.getByRole("link");
+        expect(linkElement).toHaveAttribute("href", mockProps.href);
+    });
+    it("triggers navigation when the button is clicked", function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, linkElement;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    render(<PostByCategoryTheme1 {...mockProps}/>);
+                    user = userEvent.setup();
+                    linkElement = screen.getByRole("link");
+                    return [4 /*yield*/, user.click(linkElement)];
+                case 1:
+                    _a.sent();
+                    expect(linkElement).toHaveAttribute("href", mockProps.href);
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+});

package/dist/{components → src/components}/MediaCard/PostByCategory/PostByCategoryTheme2.d.ts

@@ -1,2 +1,2 @@
-import { CardProps } from "@/types/interface";
+import { CardProps } from "../type";
 export declare const PostByCategoryTheme2: (props: CardProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/MediaCard/PostByCategory/PostByCategoryTheme2.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Link from "next/link";
+import LuImage from "../../../components/Images/LuImage";
+import Button from "../../../components/Button/Button";
+import LUIcon from "../../../components/Icons/LUIcon";
+export var PostByCategoryTheme2 = function (props) {
+    return (_jsxs("div", { "data-testid": "postByCategory-theme2", className: "p-8 card_bg_PostByCategory_".concat(props.id, " rounded-xl ").concat(props.className, " card_shadow_PostByCategory_").concat(props.id, " flex flex-col items-center w-full"), children: [_jsx("div", { className: "w-full max-w-[240px] overflow-hidden aspect-square", children: _jsx(LuImage, { src: props.image, width: 240, height: 240, className: "w-full h-full object-cover card_PostByCategory_theme2_image_".concat(props === null || props === void 0 ? void 0 : props.id), alt: "Post By Category" }) }), _jsxs("div", { className: "flex flex-col items-center flex-grow m-5 text-center h-[100px]", children: [_jsx("div", { className: "text-default card_PostByCategory_title_color_".concat(props.id, " text-2xl font-semibold capitalize line-clamp-1"), children: props.heading }), _jsx("p", { className: "card_PostByCategory_description_color_".concat(props.id, " text-base font-extralight line-clamp-2 max-xs:line-clamp-1 max-sm:mt-[7px]"), children: props.body })] }), _jsx(Link, { href: props.href, passHref: true, className: "w-full no-underline", children: _jsx(Button, { endIcon: _jsx(LUIcon, { icon: "angle-right", size: "sm" }), size: "lg", className: "rounded justify-between w-full card_PostByCategory_btn_".concat(props.id), children: props.btnLabel }) })] }));
+};

package/dist/src/components/MediaCard/PostByCategory/PostByCategoryTheme2.jsx

@@ -0,0 +1,24 @@
+import Link from "next/link";
+import LuImage from "../../../components/Images/LuImage";
+import Button from "../../../components/Button/Button";
+import LUIcon from "../../../components/Icons/LUIcon";
+export var PostByCategoryTheme2 = function (props) {
+    return (<div data-testid="postByCategory-theme2" className={"p-8 card_bg_PostByCategory_".concat(props.id, " rounded-xl ").concat(props.className, " card_shadow_PostByCategory_").concat(props.id, " flex flex-col items-center w-full")}>
+      <div className="w-full max-w-[240px] overflow-hidden aspect-square">
+        <LuImage src={props.image} width={240} height={240} className={"w-full h-full object-cover card_PostByCategory_theme2_image_".concat(props === null || props === void 0 ? void 0 : props.id)} alt="Post By Category"/>
+      </div>
+      <div className={"flex flex-col items-center flex-grow m-5 text-center h-[100px]"}>
+        <div className={"text-default card_PostByCategory_title_color_".concat(props.id, " text-2xl font-semibold capitalize line-clamp-1")}>
+          {props.heading}
+        </div>
+        <p className={"card_PostByCategory_description_color_".concat(props.id, " text-base font-extralight line-clamp-2 max-xs:line-clamp-1 max-sm:mt-[7px]")}>
+          {props.body}
+        </p>
+      </div>
+      <Link href={props.href} passHref className="w-full no-underline">
+        <Button endIcon={<LUIcon icon="angle-right" size="sm"/>} size="lg" className={"rounded justify-between w-full card_PostByCategory_btn_".concat(props.id)}>
+          {props.btnLabel}
+        </Button>
+      </Link>
+    </div>);
+};

package/dist/{components → src/components}/MediaCard/PostByCategory/PostByCategoryTheme2.test.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -46,16 +45,12 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("@testing-library/react");
-require("@testing-library/jest-dom");
-var PostByCategoryTheme2_1 = require("./PostByCategoryTheme2");
-var user_event_1 = __importDefault(require("@testing-library/user-event"));
-describe("ContactProfileTheme1 Component", function () {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from "@testing-library/react";
+import "@testing-library/jest-dom";
+import { PostByCategoryTheme2 } from "./PostByCategoryTheme2";
+import userEvent from "@testing-library/user-event";
+describe("PostByCategoryTheme2 Component", function () {
     var mockProps = {
         id: 1,
         heading: "John Doe",
@@ -65,37 +60,24 @@ describe("ContactProfileTheme1 Component", function () {
         href: "/profile",
         className: "custom-class",
     };
-    jest.mock("next/image", function () { return ({
-        __esModule: true,
-        default: function (props) {
-            var _a;
-            return ((0, jsx_runtime_1.jsx)("img", __assign({}, props, { id: (_a = props.id) === null || _a === void 0 ? void 0 : _a.toString(), alt: props.btnLabel || "" })));
-        }, // Renders a normal <img> tag
-    }); });
     it("Render the post by category theme2 with correct body and heading text", function () {
-        (0, react_1.render)((0, jsx_runtime_1.jsx)(PostByCategoryTheme2_1.PostByCategoryTheme2, __assign({}, mockProps)));
-        var headingElement = react_1.screen.getByText(mockProps.heading);
-        var bodyElement = react_1.screen.getByText(mockProps.body);
+        render(_jsx(PostByCategoryTheme2, __assign({}, mockProps)));
+        var headingElement = screen.getByText(mockProps.heading);
+        var bodyElement = screen.getByText(mockProps.body);
         expect(headingElement).toBeInTheDocument();
         expect(bodyElement).toBeInTheDocument();
     });
-    it("renders the profile image", function () {
-        (0, react_1.render)((0, jsx_runtime_1.jsx)(PostByCategoryTheme2_1.PostByCategoryTheme2, __assign({}, mockProps)));
-        var profileImage = react_1.screen.getByAltText("Image");
-        expect(profileImage).toBeInTheDocument();
-        expect(profileImage).toHaveAttribute("alt", "Image"); // Matches the default alt in LuImage
-    });
     it("renders the button with correct label and icon", function () {
-        (0, react_1.render)((0, jsx_runtime_1.jsx)(PostByCategoryTheme2_1.PostByCategoryTheme2, __assign({}, mockProps)));
-        var buttonElement = react_1.screen.getByRole("button", {
+        render(_jsx(PostByCategoryTheme2, __assign({}, mockProps)));
+        var buttonElement = screen.getByRole("button", {
             name: mockProps.btnLabel,
         });
         expect(buttonElement).toBeInTheDocument();
         expect(buttonElement).toHaveTextContent(mockProps.btnLabel);
     });
     it("renders the link with the correct href", function () {
-        (0, react_1.render)((0, jsx_runtime_1.jsx)(PostByCategoryTheme2_1.PostByCategoryTheme2, __assign({}, mockProps)));
-        var linkElement = react_1.screen.getByRole("link");
+        render(_jsx(PostByCategoryTheme2, __assign({}, mockProps)));
+        var linkElement = screen.getByRole("link");
         expect(linkElement).toHaveAttribute("href", mockProps.href);
     });
     it("triggers navigation when the button is clicked", function () { return __awaiter(void 0, void 0, void 0, function () {
@@ -103,9 +85,9 @@ describe("ContactProfileTheme1 Component", function () {
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    (0, react_1.render)((0, jsx_runtime_1.jsx)(PostByCategoryTheme2_1.PostByCategoryTheme2, __assign({}, mockProps)));
-                    user = user_event_1.default.setup();
-                    linkElement = react_1.screen.getByRole("link");
+                    render(_jsx(PostByCategoryTheme2, __assign({}, mockProps)));
+                    user = userEvent.setup();
+                    linkElement = screen.getByRole("link");
                     return [4 /*yield*/, user.click(linkElement)];
                 case 1:
                     _a.sent();
@@ -114,9 +96,4 @@ describe("ContactProfileTheme1 Component", function () {
             }
         });
     }); });
-    it("renders without crashing when href is undefined", function () {
-        var propsWithoutHref = __assign(__assign({}, mockProps), { href: undefined });
-        (0, react_1.render)((0, jsx_runtime_1.jsx)(PostByCategoryTheme2_1.PostByCategoryTheme2, __assign({}, propsWithoutHref)));
-        expect(react_1.screen.getByRole("button")).toBeInTheDocument();
-    });
 });

package/dist/src/components/MediaCard/PostByCategory/PostByCategoryTheme2.test.jsx

@@ -0,0 +1,87 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { render, screen } from "@testing-library/react";
+import "@testing-library/jest-dom";
+import { PostByCategoryTheme2 } from "./PostByCategoryTheme2";
+import userEvent from "@testing-library/user-event";
+describe("PostByCategoryTheme2 Component", function () {
+    var mockProps = {
+        id: 1,
+        heading: "John Doe",
+        body: "Software Engineer",
+        image: "https://via.placeholder.com/150",
+        btnLabel: "View Profile",
+        href: "/profile",
+        className: "custom-class",
+    };
+    it("Render the post by category theme2 with correct body and heading text", function () {
+        render(<PostByCategoryTheme2 {...mockProps}/>);
+        var headingElement = screen.getByText(mockProps.heading);
+        var bodyElement = screen.getByText(mockProps.body);
+        expect(headingElement).toBeInTheDocument();
+        expect(bodyElement).toBeInTheDocument();
+    });
+    it("renders the button with correct label and icon", function () {
+        render(<PostByCategoryTheme2 {...mockProps}/>);
+        var buttonElement = screen.getByRole("button", {
+            name: mockProps.btnLabel,
+        });
+        expect(buttonElement).toBeInTheDocument();
+        expect(buttonElement).toHaveTextContent(mockProps.btnLabel);
+    });
+    it("renders the link with the correct href", function () {
+        render(<PostByCategoryTheme2 {...mockProps}/>);
+        var linkElement = screen.getByRole("link");
+        expect(linkElement).toHaveAttribute("href", mockProps.href);
+    });
+    it("triggers navigation when the button is clicked", function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, linkElement;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    render(<PostByCategoryTheme2 {...mockProps}/>);
+                    user = userEvent.setup();
+                    linkElement = screen.getByRole("link");
+                    return [4 /*yield*/, user.click(linkElement)];
+                case 1:
+                    _a.sent();
+                    expect(linkElement).toHaveAttribute("href", mockProps.href);
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+});

package/dist/{components → src/components}/MediaCard/index.js

@@ -1,7 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SectionTypeEnum = void 0;
-var SectionTypeEnum;
+export var SectionTypeEnum;
 (function (SectionTypeEnum) {
     SectionTypeEnum["multiplePostsTheme"] = "multiple posts";
     SectionTypeEnum["singlePostTheme"] = "single post";
@@ -9,4 +6,4 @@ var SectionTypeEnum;
     SectionTypeEnum["contactsProfileTheme"] = "contacts profile";
     SectionTypeEnum["galleryTheme"] = "gallery";
     SectionTypeEnum["albumTheme"] = "album";
-})(SectionTypeEnum || (exports.SectionTypeEnum = SectionTypeEnum = {}));
+})(SectionTypeEnum || (SectionTypeEnum = {}));

package/dist/src/components/MediaCard/type.d.ts

@@ -0,0 +1,26 @@
+import { OrientationEnum } from "../../utils/enums";
+type layout = keyof typeof OrientationEnum;
+export interface CardProps {
+    image: string;
+    layout?: layout;
+    heading?: string;
+    body?: string;
+    className?: string;
+    btnLabel?: string;
+    type?: string;
+    href: string;
+    cardStyle?: {
+        card_title_color?: string;
+        card_description_color?: string;
+        card_shadow_toggle?: number;
+        card_shadow_color?: string;
+        card_background_color?: string;
+        card_button_background_color?: string;
+        card_button_text_color?: string;
+        card_image_border_color?: string;
+        card_image_border_radius?: string;
+        card_image_border?: string;
+    };
+    id?: number;
+}
+export {};

package/dist/src/components/MediaCard/type.js

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

package/dist/src/components/Switch/Switch.d.ts

@@ -0,0 +1,3 @@
+import { SwitchProps } from "./type";
+declare const Switch: ({ size, variant }: SwitchProps) => import("react/jsx-runtime").JSX.Element;
+export default Switch;

package/dist/src/components/Switch/Switch.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Switch as ShadSwitch } from "../ui/switch";
+var Switch = function (_a) {
+    var size = _a.size, variant = _a.variant;
+    return _jsx(ShadSwitch, { size: size, variant: variant });
+};
+export default Switch;

package/dist/src/components/Switch/Switch.jsx

@@ -0,0 +1,6 @@
+import { Switch as ShadSwitch } from "../ui/switch";
+var Switch = function (_a) {
+    var size = _a.size, variant = _a.variant;
+    return <ShadSwitch size={size} variant={variant}/>;
+};
+export default Switch;

package/dist/src/components/Switch/Switch.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta } from "@storybook/react";
+import { SwitchProps } from "./type";
+declare const _default: Meta;
+export default _default;
+export declare const _Switch: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, SwitchProps>;

package/dist/src/components/Switch/Switch.stories.js

@@ -0,0 +1,44 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import Switch from "./Switch";
+import { size, variant } from "../ui/switch";
+export default {
+    title: "Components/Switch",
+    component: Switch,
+    tags: ["autodocs"],
+};
+var Template = function (args) { return _jsx(Switch, __assign({}, args)); };
+export var _Switch = Template.bind({});
+_Switch.args = {
+    size: "md",
+};
+_Switch.argTypes = {
+    variant: {
+        control: { type: "select" },
+        options: Object.keys(variant),
+        description: "Switch variant",
+        table: {
+            defaultValue: { summary: "default" },
+            type: { summary: "string" },
+        },
+    },
+    size: {
+        control: { type: "select" },
+        options: Object.keys(size),
+        description: "Switch size",
+        table: {
+            defaultValue: { summary: "md" },
+            type: { summary: "string" },
+        },
+    },
+};

package/dist/src/components/Switch/Switch.stories.jsx

@@ -0,0 +1,32 @@
+import Switch from "./Switch";
+import { size, variant } from "../ui/switch";
+export default {
+    title: "Components/Switch",
+    component: Switch,
+    tags: ["autodocs"],
+};
+var Template = function (args) { return <Switch {...args}></Switch>; };
+export var _Switch = Template.bind({});
+_Switch.args = {
+    size: "md",
+};
+_Switch.argTypes = {
+    variant: {
+        control: { type: "select" },
+        options: Object.keys(variant),
+        description: "Switch variant",
+        table: {
+            defaultValue: { summary: "default" },
+            type: { summary: "string" },
+        },
+    },
+    size: {
+        control: { type: "select" },
+        options: Object.keys(size),
+        description: "Switch size",
+        table: {
+            defaultValue: { summary: "md" },
+            type: { summary: "string" },
+        },
+    },
+};

package/dist/src/components/Switch/type.d.ts

@@ -0,0 +1,5 @@
+import { size, variant } from "../ui/switch";
+export interface SwitchProps {
+    size: keyof typeof size;
+    variant?: keyof typeof variant;
+}

package/dist/src/components/Switch/type.js

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

package/dist/src/components/Title/Title.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Dummy_Title } from "../../utils/constants";
+import TitleStyles from "./Title.module.css";
+var Title = function (_a) {
+    var _b = _a.className, className = _b === void 0 ? "" : _b, _c = _a.children, children = _c === void 0 ? Dummy_Title : _c;
+    return (_jsx("h2", { className: "".concat(TitleStyles["main-title"], " ").concat(className), children: children }));
+};
+export default Title;

package/dist/src/components/Title/Title.jsx

@@ -0,0 +1,8 @@
+import React from "react";
+import { Dummy_Title } from "../../utils/constants";
+import TitleStyles from "./Title.module.css";
+var Title = function (_a) {
+    var _b = _a.className, className = _b === void 0 ? "" : _b, _c = _a.children, children = _c === void 0 ? Dummy_Title : _c;
+    return (<h2 className={"".concat(TitleStyles["main-title"], " ").concat(className)}>{children}</h2>);
+};
+export default Title;

package/dist/src/components/Title/Title.module.css

@@ -0,0 +1,43 @@
+/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+.main-title {
+  position: relative;
+  z-index: 10;
+  overflow: hidden;
+  text-align: center;
+  font-size: var(--text-3xl, 1.875rem);
+  line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
+  --tw-font-weight: var(--font-weight-bold, 700);
+  font-weight: var(--font-weight-bold, 700);
+  color: var(--color-black, #000);
+  text-transform: capitalize;
+  @media (width >= 40rem) {
+    font-size: var(--text-4xl, 2.25rem);
+    line-height: var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));
+  }
+}
+.main-title::before,
+.main-title::after {
+  content: "";
+  position: absolute;
+  top: calc(1/2 * 100%);
+  display: none;
+  height: 1px;
+  width: calc(1/2 * 100%);
+  background-color: var(--color-black, #000);
+  @media (width >= 64rem) {
+    display: block;
+  }
+  transform: translateY(-50%);
+}
+.main-title::before {
+  left: calc(var(--spacing, 0.25rem) * 0);
+  margin-left: -15%;
+}
+.main-title::after {
+  right: calc(var(--spacing, 0.25rem) * 0);
+  margin-right: -15%;
+}
+@property --tw-font-weight {
+  syntax: "*";
+  inherits: false;
+}

package/dist/{components → src/components}/Title/Title.stories.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,17 +9,12 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports._Title = void 0;
-var jsx_runtime_1 = require("react/jsx-runtime");
-var constants_1 = require("../../utils/constants");
-var Title_1 = __importDefault(require("./Title"));
-exports.default = {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Dummy_Title } from "../../utils/constants";
+import Title from "./Title";
+export default {
     title: "Components/Title",
-    component: Title_1.default,
+    component: Title,
     parameters: {
         docs: {
             description: {
@@ -47,9 +41,9 @@ exports.default = {
         },
     },
 };
-var Template = function (args) { return (0, jsx_runtime_1.jsx)(Title_1.default, __assign({}, args)); };
-exports._Title = Template.bind({});
-exports._Title.args = {
-    children: constants_1.Dummy_Title,
+var Template = function (args) { return _jsx(Title, __assign({}, args)); };
+export var _Title = Template.bind({});
+_Title.args = {
+    children: Dummy_Title,
     className: "",
 };

package/dist/src/components/Title/Title.stories.jsx

@@ -0,0 +1,37 @@
+import { Dummy_Title } from "../../utils/constants";
+import Title from "./Title";
+export default {
+    title: "Components/Title",
+    component: Title,
+    parameters: {
+        docs: {
+            description: {
+                component: "A configurable body text component with design system-approved styling variants",
+            },
+        },
+    },
+    argTypes: {
+        className: {
+            description: "Additional CSS classes",
+            control: "text",
+            table: {
+                type: { summary: "string" },
+                defaultValue: { summary: "" },
+            },
+        },
+        children: {
+            description: "Text to be displayed",
+            control: "text",
+            table: {
+                type: { summary: "string" },
+                defaultValue: { summary: "Title" },
+            },
+        },
+    },
+};
+var Template = function (args) { return <Title {...args}/>; };
+export var _Title = Template.bind({});
+_Title.args = {
+    children: Dummy_Title,
+    className: "",
+};

package/dist/src/components/Title/Title.test.d.ts

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

package/dist/src/components/Title/Title.test.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from "@testing-library/react";
+import { Dummy_Title } from "../../utils/constants";
+import Title from "./Title";
+describe("Title Component", function () {
+    it("renders with default props", function () {
+        render(_jsx(Title, {}));
+        expect(screen.getByText(Dummy_Title)).toBeInTheDocument();
+    });
+    it("renders with custom children", function () {
+        var customText = "Custom Title";
+        render(_jsx(Title, { children: customText }));
+        expect(screen.getByText(customText)).toBeInTheDocument();
+    });
+    it("applies custom className", function () {
+        var customClass = "custom-class";
+        render(_jsx(Title, { className: customClass }));
+        var titleElement = screen.getByText(Dummy_Title);
+        expect(titleElement).toHaveClass("main-title custom-class");
+    });
+    it("renders without crashing", function () {
+        var container = render(_jsx(Title, {})).container;
+        expect(container).toBeDefined();
+    });
+});