@appcorp/kismaa-web-ui 0.1.13 → 0.1.15

package/atoms/header-pointer-icon.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { IconProps } from './facebook-icon';
+export declare const HeaderTriangleIcon: React.FC<IconProps>;

package/atoms/header-pointer-icon.js

@@ -0,0 +1,43 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HeaderTriangleIcon = void 0;
+var React = __importStar(require("react"));
+var HeaderTriangleIcon = function (_a) {
+    var className = _a.className;
+    return (React.createElement("svg", { viewBox: "0 0 20 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className },
+        React.createElement("path", { d: "M1.00057 14.9732H19.0006C19.1828 14.9727 19.3615 14.9224 19.5173 14.8279C19.673 14.7333 19.8001 14.5981 19.8848 14.4367C19.9694 14.2753 20.0085 14.0939 19.9977 13.912C19.9869 13.73 19.9267 13.5545 19.8236 13.4042L10.8236 0.40425C10.4506 -0.13475 9.55257 -0.13475 9.17857 0.40425L0.178574 13.4042C0.0743986 13.5542 0.0133079 13.7298 0.00193892 13.912C-0.00943004 14.0943 0.0293576 14.2761 0.114088 14.4379C0.198818 14.5996 0.32625 14.735 0.482538 14.8294C0.638826 14.9238 0.817994 14.9735 1.00057 14.9732Z", fill: "white" })));
+};
+exports.HeaderTriangleIcon = HeaderTriangleIcon;

package/molecules/index.d.ts

@@ -9,3 +9,4 @@ export * from './typography';
 export * from './user-card';
 export * from './horoscope-card';
 export * from './button-group';
+export * from './mega-menu-card';

package/molecules/index.js

@@ -25,3 +25,4 @@ __exportStar(require("./typography"), exports);
 __exportStar(require("./user-card"), exports);
 __exportStar(require("./horoscope-card"), exports);
 __exportStar(require("./button-group"), exports);
+__exportStar(require("./mega-menu-card"), exports);

package/molecules/mega-menu-card/index.d.ts

@@ -0,0 +1,2 @@
+export * from './mega-menu-card';
+export * from './type';

package/molecules/mega-menu-card/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./mega-menu-card"), exports);
+__exportStar(require("./type"), exports);

package/molecules/mega-menu-card/mega-menu-card.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { MegaMenuCardProps } from './type';
+export declare const MegaMenuCard: FC<MegaMenuCardProps>;

package/molecules/mega-menu-card/mega-menu-card.js

@@ -0,0 +1,21 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MegaMenuCard = void 0;
+var react_1 = __importDefault(require("react"));
+var image_1 = __importDefault(require("next/image"));
+var typography_1 = require("../typography");
+var MegaMenuCard = function (_a) {
+    var imageSrc = _a.imageSrc, imageAlt = _a.imageAlt, label = _a.label, description = _a.description, handleCardOnClick = _a.handleCardOnClick;
+    return (react_1.default.createElement("div", { className: "flex cursor-pointer items-stretch gap-2", onClick: handleCardOnClick },
+        react_1.default.createElement("div", { className: "w-16 overflow-hidden rounded-xl" },
+            react_1.default.createElement(image_1.default, { src: imageSrc, alt: imageAlt, width: 64, height: 64, className: "h-full w-full object-cover" })),
+        react_1.default.createElement("div", { className: "w-[80%]" },
+            react_1.default.createElement("div", { className: "" },
+                react_1.default.createElement(typography_1.Typography, { variant: typography_1.TYPOGRAPHY_VARIANTS.SUBH5 }, label)),
+            react_1.default.createElement("div", { className: "mt-1 text-[#767676]" },
+                react_1.default.createElement(typography_1.Typography, { variant: typography_1.TYPOGRAPHY_VARIANTS.SUBH5 }, description)))));
+};
+exports.MegaMenuCard = MegaMenuCard;

package/molecules/mega-menu-card/props.d.ts

@@ -0,0 +1,2 @@
+import { MegaMenuCardProps } from './type';
+export declare const megaMenuCardData: MegaMenuCardProps;

package/molecules/mega-menu-card/props.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.megaMenuCardData = void 0;
+exports.megaMenuCardData = {
+    imageAlt: 'Person Image',
+    imageSrc: 'https://ytiwekjzaihrkrirjgpk.supabase.co/storage/v1/object/public/publicBlob/assets/psychic.webp',
+    label: 'Going Literatures',
+    description: 'Build your dream multi vendor marketplace',
+    handleCardOnClick: function () { return void 0; },
+};

package/molecules/mega-menu-card/type.d.ts

@@ -0,0 +1,7 @@
+export interface MegaMenuCardProps {
+    imageSrc: string;
+    imageAlt: string;
+    label: string;
+    description: string;
+    handleCardOnClick: () => void;
+}

package/molecules/mega-menu-card/type.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/molecules/typography/type.d.ts

@@ -16,5 +16,6 @@ export declare enum TYPOGRAPHY_VARIANTS {
     SUBH1 = "SUBH1",
     SUBH2 = "SUBH2",
     SUBH3 = "SUBH3",
-    SUBH4 = "SUBH4"
+    SUBH4 = "SUBH4",
+    SUBH5 = "SUBH5"
 }

package/molecules/typography/type.js

@@ -21,4 +21,5 @@ var TYPOGRAPHY_VARIANTS;
     TYPOGRAPHY_VARIANTS["SUBH2"] = "SUBH2";
     TYPOGRAPHY_VARIANTS["SUBH3"] = "SUBH3";
     TYPOGRAPHY_VARIANTS["SUBH4"] = "SUBH4";
+    TYPOGRAPHY_VARIANTS["SUBH5"] = "SUBH5";
 })(TYPOGRAPHY_VARIANTS || (exports.TYPOGRAPHY_VARIANTS = TYPOGRAPHY_VARIANTS = {}));

package/molecules/typography/typography.js

@@ -26,6 +26,7 @@ var variantClasses = (_a = {},
     _a[type_1.TYPOGRAPHY_VARIANTS.SUBH2] = 'lg:text-base text-sm font-medium ',
     _a[type_1.TYPOGRAPHY_VARIANTS.SUBH3] = 'lg:text-lg text-sm font-semibold',
     _a[type_1.TYPOGRAPHY_VARIANTS.SUBH4] = 'lg:text-base text-sm font-normal -tracking-[0.012em]',
+    _a[type_1.TYPOGRAPHY_VARIANTS.SUBH5] = 'lg:text-base text-sm font-semibold ',
     _a);
 var Typography = function (_a) {
     var _b = _a.as, Component = _b === void 0 ? 'p' : _b, children = _a.children, variant = _a.variant;

package/organisms/highlight-banner/highlight-banner.js

@@ -10,12 +10,12 @@ var button_1 = require("../../molecules/button");
 var solid_1 = require("@heroicons/react/24/solid");
 var HighlightBanner = function (_a) {
     var bannerButtonText = _a.bannerButtonText, bannerDescription = _a.bannerDescription, bannerTitle = _a.bannerTitle, handleCtaClick = _a.handleCtaClick, bannerBg = _a.bannerBg;
-    return (react_1.default.createElement("section", { className: "kismaa-section-spacing bg-purple-200" },
-        react_1.default.createElement("div", { className: "kismaa-container rounded-md", style: {
-                backgroundImage: "url(".concat(bannerBg, ")"),
-                backgroundPosition: '50% 15%',
-                backgroundRepeat: 'no-repeat',
-            } },
+    return (react_1.default.createElement("section", { className: "kismaa-section-spacing bg-purple-200", style: {
+            backgroundImage: "url(".concat(bannerBg, ")"),
+            backgroundPosition: '50% 15%',
+            backgroundRepeat: 'no-repeat',
+        } },
+        react_1.default.createElement("div", { className: "kismaa-container rounded-md" },
             react_1.default.createElement("div", { className: "mx-auto flex flex-col items-center justify-center px-4 pb-4 pt-5 text-center text-quaternary lg:px-32 lg:pb-5 lg:pt-7" },
                 react_1.default.createElement(typography_1.Typography, { variant: typography_1.TYPOGRAPHY_VARIANTS.H1 }, bannerTitle),
                 react_1.default.createElement("div", { className: "mt-3 flex flex-col items-center gap-4 text-gray-600" },

package/organisms/index.d.ts

@@ -32,3 +32,4 @@ export * from './user-details';
 export * from './users-list-explore';
 export * from './not-found';
 export * from './banner-slider';
+export * from './mega-menu';

package/organisms/index.js

@@ -48,3 +48,4 @@ __exportStar(require("./user-details"), exports);
 __exportStar(require("./users-list-explore"), exports);
 __exportStar(require("./not-found"), exports);
 __exportStar(require("./banner-slider"), exports);
+__exportStar(require("./mega-menu"), exports);

package/organisms/mega-menu/index.d.ts

@@ -0,0 +1,2 @@
+export * from './mega-menu';
+export * from './type';

package/organisms/mega-menu/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./mega-menu"), exports);
+__exportStar(require("./type"), exports);

package/organisms/mega-menu/mega-menu.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { MegaMenuProps } from './type';
+export declare const MegaMenu: FC<MegaMenuProps>;

package/organisms/mega-menu/mega-menu.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MegaMenu = void 0;
+var molecules_1 = require("../../molecules");
+var react_1 = __importDefault(require("react"));
+var MegaMenu = function (_a) {
+    var items = _a.items;
+    return (react_1.default.createElement("div", { className: "mx-auto grid w-full max-w-4xl grid-cols-1 gap-x-3 gap-y-10 rounded-md bg-white p-4 shadow-[0px_4px_23.8px_0px_#00000040] sm:grid-cols-2 sm:p-6 lg:grid-cols-3 lg:px-11 lg:py-10" }, items === null || items === void 0 ? void 0 : items.map(function (item, ind) { return (react_1.default.createElement(molecules_1.MegaMenuCard, { key: ind, label: item.label, description: item.description, imageAlt: item.imageAlt, imageSrc: item.imageSrc, handleCardOnClick: item.handleCardOnClick })); })));
+};
+exports.MegaMenu = MegaMenu;

package/organisms/mega-menu/props.d.ts

@@ -0,0 +1,2 @@
+import { MegaMenuProps } from './type';
+export declare const megaMenuData: MegaMenuProps;

package/organisms/mega-menu/props.js

@@ -0,0 +1,70 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.megaMenuData = void 0;
+exports.megaMenuData = {
+    items: [
+        {
+            imageAlt: 'Person Image',
+            imageSrc: 'https://ytiwekjzaihrkrirjgpk.supabase.co/storage/v1/object/public/publicBlob/assets/psychic.webp',
+            label: 'Going Literatures',
+            description: 'Build your dream multi vendor marketplace',
+            handleCardOnClick: function () { return void 0; },
+        },
+        {
+            imageAlt: 'Person Image',
+            imageSrc: 'https://ytiwekjzaihrkrirjgpk.supabase.co/storage/v1/object/public/publicBlob/assets/psychic.webp',
+            label: 'Going Literatures',
+            description: 'Build your dream multi vendor marketplace',
+            handleCardOnClick: function () { return void 0; },
+        },
+        {
+            imageAlt: 'Person Image',
+            imageSrc: 'https://ytiwekjzaihrkrirjgpk.supabase.co/storage/v1/object/public/publicBlob/assets/psychic.webp',
+            label: 'Going Literatures',
+            description: 'Build your dream multi vendor marketplace',
+            handleCardOnClick: function () { return void 0; },
+        },
+        {
+            imageAlt: 'Person Image',
+            imageSrc: 'https://ytiwekjzaihrkrirjgpk.supabase.co/storage/v1/object/public/publicBlob/assets/psychic.webp',
+            label: 'Going Literatures',
+            description: 'Handful Reproduced uses now your text',
+            handleCardOnClick: function () { return void 0; },
+        },
+        {
+            imageAlt: 'Person Image',
+            imageSrc: 'https://ytiwekjzaihrkrirjgpk.supabase.co/storage/v1/object/public/publicBlob/assets/psychic.webp',
+            label: 'Going Literatures',
+            description: 'Build your dream multi vendor marketplace',
+            handleCardOnClick: function () { return void 0; },
+        },
+        {
+            imageAlt: 'Person Image',
+            imageSrc: 'https://ytiwekjzaihrkrirjgpk.supabase.co/storage/v1/object/public/publicBlob/assets/psychic.webp',
+            label: 'Going Literatures',
+            description: 'Build your dream multi vendor marketplace',
+            handleCardOnClick: function () { return void 0; },
+        },
+        {
+            imageAlt: 'Person Image',
+            imageSrc: 'https://ytiwekjzaihrkrirjgpk.supabase.co/storage/v1/object/public/publicBlob/assets/psychic.webp',
+            label: 'Going Literatures',
+            description: 'Build your dream multi vendor marketplace',
+            handleCardOnClick: function () { return void 0; },
+        },
+        {
+            imageAlt: 'Person Image',
+            imageSrc: 'https://ytiwekjzaihrkrirjgpk.supabase.co/storage/v1/object/public/publicBlob/assets/psychic.webp',
+            label: 'Going Literatures',
+            description: 'Build your dream multi vendor marketplace',
+            handleCardOnClick: function () { return void 0; },
+        },
+        {
+            imageAlt: 'Person Image',
+            imageSrc: 'https://ytiwekjzaihrkrirjgpk.supabase.co/storage/v1/object/public/publicBlob/assets/psychic.webp',
+            label: 'Going Literatures',
+            description: 'Build your dream multi vendor marketplace',
+            handleCardOnClick: function () { return void 0; },
+        },
+    ],
+};

package/organisms/mega-menu/type.d.ts

@@ -0,0 +1,4 @@
+import { MegaMenuCardProps } from '../../molecules';
+export interface MegaMenuProps {
+    items: MegaMenuCardProps[];
+}

package/organisms/mega-menu/type.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/organisms/navbar/navbar.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
+import { FC } from 'react';
 import { NavbarProps } from './type';
-export declare const Navbar: React.FC<NavbarProps>;
+export declare const Navbar: FC<NavbarProps>;

package/organisms/navbar/navbar.js

@@ -10,9 +10,20 @@ var molecules_1 = require("../../molecules");
 var solid_1 = require("@heroicons/react/24/solid");
 var link_1 = __importDefault(require("next/link"));
 var react_1 = __importDefault(require("react"));
+var mega_menu_1 = require("../mega-menu");
+var header_pointer_icon_1 = require("../../atoms/header-pointer-icon");
 var Navbar = function (_a) {
-    var handleLogin = _a.handleLogin, handleSearch = _a.handleSearch, handleSignup = _a.handleSignup, isMobileMenuOpen = _a.isMobileMenuOpen, loginLabel = _a.loginLabel, navLinks = _a.navLinks, signupLabel = _a.signupLabel, activeIndex = _a.activeIndex, toggleMobileMenu = _a.toggleMobileMenu;
-    var displayedLinks = navLinks.slice(0, 5);
+    var handleLogin = _a.handleLogin, handleSearch = _a.handleSearch, handleSignup = _a.handleSignup, isMobileMenuOpen = _a.isMobileMenuOpen, loginLabel = _a.loginLabel, navLinks = _a.navLinks, signupLabel = _a.signupLabel, toggleMobileMenu = _a.toggleMobileMenu;
+    var renderNavLink = function (link, index) {
+        var _a;
+        return (react_1.default.createElement("div", { key: index, className: "relative w-fit" },
+            react_1.default.createElement(link_1.default, { href: link.href, className: "cursor-pointer transition-all duration-300 ease-in-out hover:text-primary ".concat(link.isActive ? 'text-primary' : 'text-[#263238]', " flex items-center gap-1") },
+                react_1.default.createElement(molecules_1.Typography, { variant: molecules_1.TYPOGRAPHY_VARIANTS.SUBH2 }, link.label)),
+            link.isActive && ((_a = link.megaMenuItems) === null || _a === void 0 ? void 0 : _a.length) && (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(header_pointer_icon_1.HeaderTriangleIcon, { className: "absolute -bottom-14 left-5 z-50 size-8" }),
+                react_1.default.createElement("div", { className: "absolute w-max pt-10" },
+                    react_1.default.createElement(mega_menu_1.MegaMenu, { items: link.megaMenuItems }))))));
+    };
     return (react_1.default.createElement("nav", { className: "fixed z-50 w-full bg-purple-200/90" },
         react_1.default.createElement("div", { className: "kismaa-container flex items-center justify-between gap-10 py-1.5 lg:py-3.5" },
             react_1.default.createElement(link_1.default, { href: "/", className: "w-[15%]" },
@@ -21,8 +32,13 @@ var Navbar = function (_a) {
                 react_1.default.createElement(search_icon_1.SearchIcon, { className: "size-5 cursor-pointer" }),
                 react_1.default.createElement("button", { onClick: toggleMobileMenu, className: "cursor-pointer" }, isMobileMenuOpen ? (react_1.default.createElement(solid_1.XMarkIcon, { className: "h-8 w-8" })) : (react_1.default.createElement(solid_1.Bars3Icon, { className: "h-8 w-8" })))),
             react_1.default.createElement("div", { className: "hidden w-[85%] items-center justify-between lg:flex" },
-                react_1.default.createElement("div", { className: "flex gap-8" }, displayedLinks === null || displayedLinks === void 0 ? void 0 : displayedLinks.map(function (link, index) { return (react_1.default.createElement(link_1.default, { key: index, href: link.href, className: "cursor-pointer transition-all duration-300 ease-in-out hover:text-primary ".concat(activeIndex === index ? 'text-primary' : 'text-[#263238]') },
-                    react_1.default.createElement(molecules_1.Typography, { variant: molecules_1.TYPOGRAPHY_VARIANTS.SUBH2 }, link.label))); })),
+                react_1.default.createElement("div", { className: "flex gap-10" }, navLinks
+                    .filter(function (_a) {
+                    var enabled = _a.enabled;
+                    return enabled;
+                })
+                    .sort(function (a, b) { return a.order - b.order; })
+                    .map(function (link, index) { return renderNavLink(link, index); })),
                 react_1.default.createElement("div", { className: "flex items-center justify-end gap-4" },
                     react_1.default.createElement("div", { className: "", onClick: handleSearch },
                         react_1.default.createElement(search_icon_1.SearchIcon, { className: "size-5 cursor-pointer" })),
@@ -32,9 +48,10 @@ var Navbar = function (_a) {
                         react_1.default.createElement("div", { className: "w-fit" },
                             react_1.default.createElement(molecules_1.Button, { type: molecules_1.BUTTON_TYPES.SECONDARY, handleOnClick: handleSignup, label: signupLabel, iconSuffix: react_1.default.createElement(solid_1.ChevronRightIcon, { className: "h-full w-6" }), size: molecules_1.BUTTON_SIZES.MD })))))),
         isMobileMenuOpen && (react_1.default.createElement("div", { className: "bg-purple-200/90 lg:hidden" },
-            react_1.default.createElement("div", { className: "flex flex-col gap-4 px-4 py-6" }, displayedLinks === null || displayedLinks === void 0 ? void 0 :
-                displayedLinks.map(function (link) { return (react_1.default.createElement(link_1.default, { key: link.label, href: link.href, className: "cursor-pointer" },
-                    react_1.default.createElement(molecules_1.Typography, { variant: molecules_1.TYPOGRAPHY_VARIANTS.SUBH2 }, link.label))); }),
+            react_1.default.createElement("div", { className: "flex flex-col gap-4 px-4 py-6" },
+                navLinks.map(function (link, index) { return (react_1.default.createElement("div", { key: index },
+                    react_1.default.createElement(link_1.default, { href: link.href, className: "flex cursor-pointer items-center justify-between" },
+                        react_1.default.createElement(molecules_1.Typography, { variant: molecules_1.TYPOGRAPHY_VARIANTS.SUBH2 }, link.label)))); }),
                 react_1.default.createElement(molecules_1.Button, { type: molecules_1.BUTTON_TYPES.TEXT, handleOnClick: handleLogin, label: loginLabel, size: molecules_1.BUTTON_SIZES.MD }),
                 react_1.default.createElement(molecules_1.Button, { type: molecules_1.BUTTON_TYPES.SECONDARY, handleOnClick: handleSignup, label: signupLabel, iconSuffix: react_1.default.createElement(solid_1.ChevronRightIcon, { className: "size-7" }), size: molecules_1.BUTTON_SIZES.MD }))))));
 };

package/organisms/navbar/props.js

@@ -1,11 +1,31 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.navbarData = void 0;
+var props_1 = require("../mega-menu/props");
 exports.navbarData = {
     navLinks: [
-        { label: 'Advisors', href: '/advisors' },
-        { label: 'Horoscope', href: '/horoscope' },
-        { label: 'Blogs', href: '/blogs' },
+        {
+            label: 'Home',
+            href: '/home',
+            isActive: false,
+            enabled: true,
+            order: 1,
+        },
+        {
+            label: 'Advisor',
+            href: '/advisor',
+            megaMenuItems: props_1.megaMenuData.items,
+            isActive: false,
+            enabled: true,
+            order: 2,
+        },
+        {
+            label: 'Blogs',
+            href: '/blogs',
+            isActive: false,
+            enabled: true,
+            order: 3,
+        },
     ],
     isMobileMenuOpen: false,
     toggleMobileMenu: function () { return void 0; },
@@ -14,5 +34,5 @@ exports.navbarData = {
     handleSearch: function () { return void 0; },
     loginLabel: 'Login',
     signupLabel: 'Sign Up',
-    activeIndex: 0,
+    handleMegaMenuToggle: function () { return void 0; },
 };

package/organisms/navbar/type.d.ts

@@ -1,14 +1,20 @@
+import { MegaMenuCardProps } from '../../molecules';
+export interface NavLinks {
+    enabled: boolean;
+    href: string;
+    isActive: boolean;
+    label: string;
+    megaMenuItems?: MegaMenuCardProps[];
+    order: number;
+}
 export interface NavbarProps {
-    isMobileMenuOpen: boolean;
-    toggleMobileMenu: () => void;
-    navLinks: {
-        label: string;
-        href: string;
-    }[];
-    loginLabel: string;
     handleLogin: () => void;
+    handleMegaMenuToggle: (index: number | null) => void;
+    handleSearch: () => void;
     handleSignup: () => void;
+    isMobileMenuOpen: boolean;
+    loginLabel: string;
+    navLinks: NavLinks[];
     signupLabel: string;
-    handleSearch: () => void;
-    activeIndex: number;
+    toggleMobileMenu: () => void;
 }

package/organisms/onboarding-step-card/onboarding-step-card.js

@@ -17,6 +17,6 @@ var OnboardingStepCard = function (props) {
             react_1.default.createElement(molecules_1.Typography, { variant: molecules_1.TYPOGRAPHY_VARIANTS.H3 }, title)),
         react_1.default.createElement("div", { className: "my-4 text-center" },
             react_1.default.createElement(molecules_1.Typography, { variant: molecules_1.TYPOGRAPHY_VARIANTS.H6 }, description)),
-        react_1.default.createElement("div", null, btnType === type_1.ONBOARDING_BTN_TYPES.BUTTON ? (react_1.default.createElement(molecules_1.Button, { label: props.buttonText, size: molecules_1.BUTTON_SIZES.MD, type: molecules_1.BUTTON_TYPES.QUATERNARY, iconSuffix: react_1.default.createElement(solid_1.ChevronRightIcon, { className: "size-6" }), handleOnClick: props.onButtonClick })) : (react_1.default.createElement(vista_comboboxes_v1_1.VistaComboboxesV1, { handleInputOnChange: props.comboInputOnChange, handleOnBlur: props.comboOnBlur, handleOnChange: props.comboOnChange, label: props.comboLabel, selectedItem: props.comboSelectedItem, listItems: props.comboListItems, nodeQueryKey: props.nodeQueryKey, nodeSelectKey: props.nodeSelectKey, query: props.comboQuery, selectKey1: props.comboSelectKey1 })))));
+        react_1.default.createElement("div", null, btnType === type_1.ONBOARDING_BTN_TYPES.BUTTON ? (react_1.default.createElement(molecules_1.Button, { label: props.buttonText, size: molecules_1.BUTTON_SIZES.MD, type: molecules_1.BUTTON_TYPES.QUATERNARY, iconSuffix: react_1.default.createElement(solid_1.ChevronRightIcon, { className: "size-6" }), handleOnClick: props.onButtonClick })) : (react_1.default.createElement(vista_comboboxes_v1_1.VistaComboboxesV1, { handleInputOnChange: props.comboInputOnChange, handleOnBlur: props.comboOnBlur, handleOnChange: props.comboOnChange, label: props.comboLabel, selectedItem: props.comboSelectedItem, listItems: props.comboListItems, nodeQueryKey: props.nodeQueryKey, nodeSelectKey: props.nodeSelectKey, query: props.comboQuery, selectKey1: props.comboSelectKey1, comboboxInputClassName: "bg-white focus:outline-purple-300 py-2 border-[1px] border-primary", placeholder: props.placeholder })))));
 };
 exports.OnboardingStepCard = OnboardingStepCard;

package/organisms/onboarding-step-card/type.d.ts

@@ -26,6 +26,7 @@ interface ComboBoxProps extends BaseProps {
     nodeSelectKey: string;
     comboQuery: string;
     comboSelectKey1: string;
+    placeholder?: string;
 }
 export type OnboardingStepCardProps = ButtonProps | ComboBoxProps;
 export {};

package/organisms/onboarding-steps/onboarding-steps.js

@@ -19,7 +19,7 @@ var OnboardingSteps = function (_a) {
                 react_1.default.createElement("div", { className: "mx-auto mt-4 w-[100%] text-center text-gray-600 lg:w-[60%]" },
                     react_1.default.createElement(molecules_1.Typography, { variant: molecules_1.TYPOGRAPHY_VARIANTS.SUBH4 }, subheading))),
             react_1.default.createElement("div", { className: "mt-16 flex flex-col justify-between gap-10 lg:flex-row lg:gap-0" }, stepsData.map(function (step, index) { return (react_1.default.createElement(react_1.default.Fragment, { key: index },
-                react_1.default.createElement("div", null, step.btnType === type_1.ONBOARDING_BTN_TYPES.BUTTON ? (react_1.default.createElement(onboarding_step_card_1.OnboardingStepCard, { title: step.title, description: step.description, buttonText: step.buttonText, onButtonClick: step.onButtonClick, headerIcon: step.headerIcon, btnType: step.btnType })) : (react_1.default.createElement(onboarding_step_card_1.OnboardingStepCard, { title: step.title, description: step.description, headerIcon: step.headerIcon, btnType: step.btnType, comboInputOnChange: step.comboInputOnChange || (function () { }), comboOnBlur: step.comboOnBlur || (function () { }), comboOnChange: step.comboOnChange || (function () { }), comboLabel: step.comboLabel || '', comboSelectedItem: step.comboSelectedItem || null, comboListItems: step.comboListItems || [], nodeQueryKey: step.nodeQueryKey || '', nodeSelectKey: step.nodeSelectKey || '', comboQuery: step.comboQuery || '', comboSelectKey1: step.comboSelectKey1 || '' }))),
+                react_1.default.createElement("div", null, step.btnType === type_1.ONBOARDING_BTN_TYPES.BUTTON ? (react_1.default.createElement(onboarding_step_card_1.OnboardingStepCard, { title: step.title, description: step.description, buttonText: step.buttonText, onButtonClick: step.onButtonClick, headerIcon: step.headerIcon, btnType: step.btnType })) : (react_1.default.createElement(onboarding_step_card_1.OnboardingStepCard, { title: step.title, description: step.description, headerIcon: step.headerIcon, btnType: step.btnType, comboInputOnChange: step.comboInputOnChange || (function () { }), comboOnBlur: step.comboOnBlur || (function () { }), comboOnChange: step.comboOnChange || (function () { }), comboLabel: step.comboLabel || '', comboSelectedItem: step.comboSelectedItem || null, comboListItems: step.comboListItems || [], nodeQueryKey: step.nodeQueryKey || '', nodeSelectKey: step.nodeSelectKey || '', comboQuery: step.comboQuery || '', comboSelectKey1: step.comboSelectKey1 || '', placeholder: step.placeholder || '' }))),
                 index < stepsData.length - 1 && (react_1.default.createElement("div", { className: "-mx-14 mt-20 hidden lg:block" },
                     react_1.default.createElement(onboarding_track_1.OnboardingTrack, { className: "w-44 ".concat(index % 2 !== 0 ? 'rotate-180' : '') }))))); })))));
 };

package/organisms/onboarding-steps/props.js

@@ -43,6 +43,7 @@ exports.onboardingStepsData = {
             nodeSelectKey: 'select-key',
             comboQuery: 'some-query',
             comboSelectKey1: 'select-key-1',
+            placeholder: 'Type 3 letters to search',
         },
         {
             title: 'Connect with Psychic',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appcorp/kismaa-web-ui",
-  "version": "0.1.13",
+  "version": "0.1.15",
   "source": "src/index.ts",
   "main": "lib/main.js",
   "module": "lib/module.js",
@@ -44,7 +44,7 @@
     "@react-pakistan/util-functions": "^1.23.33"
   },
   "devDependencies": {
-    "@appcorp/app-corp-designs": "^0.4.28",
+    "@appcorp/app-corp-designs": "^0.4.42",
     "@chromatic-com/storybook": "3.2.2",
     "@eslint/compat": "^1.2.3",
     "@headlessui/react": "^2.2.0",