@appcorp/kismaa-web-ui 0.2.17 → 0.2.19

package/molecules/disclaimer/disclaimer.js

@@ -11,13 +11,13 @@ var link_1 = __importDefault(require("next/link"));
 var Disclaimer = function () {
     var currentYear = new Date().getFullYear();
     return (react_1.default.createElement("section", { className: "kismaa-section-spacing bg-gray-200 !py-4" },
-        react_1.default.createElement("div", { className: "kismaa-container grid grid-cols-5 items-center text-gray-600" },
-            react_1.default.createElement("div", { className: "col-span-4 flex justify-start" },
+        react_1.default.createElement("div", { className: "kismaa-container grid grid-cols-1 items-center gap-4 text-gray-600 md:grid-cols-5" },
+            react_1.default.createElement("div", { className: "col-span-1 flex justify-start md:col-span-4" },
                 react_1.default.createElement(typography_1.Typography, { variant: typography_1.TYPOGRAPHY_VARIANTS.P3, className: "text-gray-500" },
                     "\u00A9 ",
                     currentYear,
                     " Kismaa, Inc. Kismaa is a platform for spiritual and personal guidance. Readings provided by advisors are for informational and entertainment purposes only and should not be considered a substitute for professional advice in legal, medical, financial, or psychological matters. Users are responsible for their own decisions and actions.")),
-            react_1.default.createElement("div", { className: "col-span-1 flex justify-end" },
+            react_1.default.createElement("div", { className: "col-span-1 flex justify-center md:justify-end" },
                 react_1.default.createElement(typography_1.Typography, { variant: typography_1.TYPOGRAPHY_VARIANTS.P3 },
                     react_1.default.createElement(link_1.default, { className: "text-primary hover:text-secondary font-medium hover:underline", target: "_blank", href: "https://appcorp.org" }, "\uD83D\uDE80 Tech Partners"))))));
 };

package/organisms/get-app-banner/get-app-banner.js

@@ -10,7 +10,7 @@ var GetAppBanner = function (_a) {
     var backgroundImageUrl = _a.backgroundImageUrl, _b = _a.bannerBgEnabled, bannerBgEnabled = _b === void 0 ? true : _b, getAppDescription = _a.getAppDescription, getAppHeading = _a.getAppHeading, handleAppStoreClick = _a.handleAppStoreClick, handlePlayStoreClick = _a.handlePlayStoreClick;
     return (react_1.default.createElement("section", { className: "".concat(!bannerBgEnabled ? 'kismaa-section-spacing bg-white' : 'bg-gray-100') },
         react_1.default.createElement("div", { className: "kismaa-container bg-gray-100" },
-            react_1.default.createElement("div", { className: "grid grid-cols-2" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2" },
                 react_1.default.createElement("div", { className: "w-full px-4 py-8 lg:py-16 lg:pl-14" },
                     react_1.default.createElement("div", { className: "text-slate-900/95" },
                         react_1.default.createElement(molecules_1.Typography, { variant: molecules_1.TYPOGRAPHY_VARIANTS.H2 }, getAppHeading)),
@@ -19,7 +19,7 @@ var GetAppBanner = function (_a) {
                     react_1.default.createElement("div", { className: "mt-8 flex gap-5 lg:mt-16" },
                         react_1.default.createElement(molecules_1.PlayStoreButton, { handleOnClick: handlePlayStoreClick }),
                         react_1.default.createElement(molecules_1.AppStoreButton, { handleOnClick: handleAppStoreClick }))),
-                react_1.default.createElement("div", { className: "rounded-md bg-gray-100 bg-cover ".concat(backgroundImageUrl ? 'lg:bg-[image:var(--bg-image)]' : ''), style: {
+                react_1.default.createElement("div", { className: "hidden rounded-md bg-gray-100 bg-cover sm:block ".concat(backgroundImageUrl ? 'sm:bg-[image:var(--bg-image)]' : ''), style: {
                         '--bg-image': "url(".concat(backgroundImageUrl, ")"),
                         backgroundRepeat: 'no-repeat',
                         backgroundSize: 'cover',

package/organisms/section-header/section-header.js

@@ -9,8 +9,10 @@ var react_1 = __importDefault(require("react"));
 var solid_1 = require("@heroicons/react/24/solid");
 var type_1 = require("../../molecules/badge/type");
 var breadcrumbs_1 = require("../../molecules/breadcrumbs");
+var vista_badge_v1_1 = require("@appcorp/app-corp-vista/atoms/vista-badge-v1/vista-badge-v1");
+var vista_badge_type_1 = require("@appcorp/app-corp-vista/type/vista-badge-type");
 var SectionHeader = function (_a) {
-    var _b = _a.badgeText, badgeText = _b === void 0 ? '' : _b, breadcrumbs = _a.breadcrumbs, _c = _a.btnIcon, btnIcon = _c === void 0 ? react_1.default.createElement(solid_1.ChevronRightIcon, { className: "size-7" }) : _c, _d = _a.btnOutlined, btnOutlined = _d === void 0 ? false : _d, btnText = _a.btnText, _e = _a.btnType, btnType = _e === void 0 ? molecules_1.BUTTON_TYPES.QUATERNARY : _e, handleButtonClick = _a.handleButtonClick, heading = _a.heading, renderCtaButton = _a.renderCtaButton, subheading = _a.subheading;
+    var _b = _a.badgeText, badgeText = _b === void 0 ? '' : _b, breadcrumbs = _a.breadcrumbs, _c = _a.btnIcon, btnIcon = _c === void 0 ? react_1.default.createElement(solid_1.ChevronRightIcon, { className: "size-7" }) : _c, _d = _a.btnOutlined, btnOutlined = _d === void 0 ? false : _d, btnText = _a.btnText, _e = _a.btnType, btnType = _e === void 0 ? molecules_1.BUTTON_TYPES.QUATERNARY : _e, handleButtonClick = _a.handleButtonClick, heading = _a.heading, numberOfFilters = _a.numberOfFilters, renderCtaButton = _a.renderCtaButton, subheading = _a.subheading;
     return (react_1.default.createElement(react_1.default.Fragment, null,
         (breadcrumbs === null || breadcrumbs === void 0 ? void 0 : breadcrumbs.items) && breadcrumbs.items.length > 0 && (react_1.default.createElement("div", { className: "mb-14" },
             react_1.default.createElement(breadcrumbs_1.BreadCrumbs, { items: breadcrumbs.items }))),
@@ -23,7 +25,9 @@ var SectionHeader = function (_a) {
                 subheading && (react_1.default.createElement("div", { className: "mt-3 text-black/45" },
                     react_1.default.createElement(molecules_1.Typography, { variant: molecules_1.TYPOGRAPHY_VARIANTS.P1 }, subheading)))),
             renderCtaButton && (react_1.default.createElement("div", { className: "flex w-full justify-start lg:w-[50%] lg:justify-end" },
-                react_1.default.createElement("div", { className: "w-fit" },
-                    react_1.default.createElement(molecules_1.Button, { handleOnClick: handleButtonClick, iconSuffix: btnIcon, label: btnText, outlined: btnOutlined, size: molecules_1.BUTTON_SIZES.MD, type: btnType })))))));
+                react_1.default.createElement("div", { className: "relative w-fit" },
+                    react_1.default.createElement(molecules_1.Button, { handleOnClick: handleButtonClick, iconSuffix: btnIcon, label: btnText, outlined: btnOutlined, size: molecules_1.BUTTON_SIZES.MD, type: btnType }),
+                    numberOfFilters && (react_1.default.createElement("div", { className: "absolute -top-4 -right-4" },
+                        react_1.default.createElement(vista_badge_v1_1.VistaBadgeV1, { label: String(numberOfFilters), type: vista_badge_type_1.VISTA_BADGE_TYPE.INFO })))))))));
 };
 exports.SectionHeader = SectionHeader;

package/organisms/section-header/type.d.ts

@@ -2,14 +2,15 @@ import { ReactElement } from 'react';
 import { BreadcrumbsProps } from '../../molecules/breadcrumbs';
 import { BUTTON_TYPES } from '../../molecules';
 export interface SectionHeaderProps {
-    heading: string;
-    subheading: string;
-    renderCtaButton: boolean;
-    btnText?: string;
-    handleButtonClick: () => void;
-    btnType?: BUTTON_TYPES;
-    btnIcon?: ReactElement;
     badgeText?: string;
-    btnOutlined?: boolean;
     breadcrumbs?: BreadcrumbsProps;
+    btnIcon?: ReactElement;
+    btnOutlined?: boolean;
+    btnText?: string;
+    btnType?: BUTTON_TYPES;
+    handleButtonClick: () => void;
+    heading: string;
+    numberOfFilters?: number;
+    renderCtaButton: boolean;
+    subheading: string;
 }

package/organisms/users-list-explore/props.js

@@ -10,20 +10,21 @@ var props_1 = require("../user-cards-grid/props");
 var filter_icon_1 = require("../../atoms/filter-icon");
 var props_2 = require("../../molecules/breadcrumbs/props");
 exports.userListExploreData = {
-    heading: 'Advisors',
-    subheading: 'Getting started with Kismaa is quick, easy, and free. Start with a 14 day free trial, and end with countless happy patients.',
     badgeText: '9/40',
-    btnText: '',
+    breadcrumbs: props_2.breadCrumbsData,
     btnIcon: react_1.default.createElement(filter_icon_1.FilterIcon, { className: 'size-4' }),
     btnOutlined: true,
+    btnText: '',
     btnType: molecules_1.BUTTON_TYPES.PRIMARY,
-    handleButtonClick: function () { return void 0; },
     cardItems: props_1.userCardGridData,
     cardsLimit: 9,
     currentPage: 1,
-    totalPages: 3,
+    handleButtonClick: function () { return void 0; },
+    heading: 'Advisors',
+    numberOfFilters: 3,
     onNext: function () { return void 0; },
     onPageChange: function () { return void 0; },
     onPrevious: function () { return void 0; },
-    breadcrumbs: props_2.breadCrumbsData,
+    subheading: 'Getting started with Kismaa is quick, easy, and free. Start with a 14 day free trial, and end with countless happy patients.',
+    totalPages: 3,
 };

package/organisms/users-list-explore/type.d.ts

@@ -13,6 +13,7 @@ export type UsersListExploreProps = {
     currentPage: number;
     handleButtonClick: () => void;
     heading: string;
+    numberOfFilters: number;
     onNext: () => void;
     onPageChange: (page: number) => void;
     onPrevious: () => void;

package/organisms/users-list-explore/users-list-explore.js

@@ -9,10 +9,10 @@ var section_header_1 = require("../section-header");
 var user_cards_grid_1 = require("../user-cards-grid");
 var pagination_1 = require("../pagination/pagination");
 var UsersListExplore = function (_a) {
-    var badgeText = _a.badgeText, breadcrumbs = _a.breadcrumbs, btnIcon = _a.btnIcon, btnOutlined = _a.btnOutlined, btnText = _a.btnText, btnType = _a.btnType, cardItems = _a.cardItems, cardsLimit = _a.cardsLimit, currentPage = _a.currentPage, handleButtonClick = _a.handleButtonClick, heading = _a.heading, onNext = _a.onNext, onPageChange = _a.onPageChange, onPrevious = _a.onPrevious, subheading = _a.subheading, totalPages = _a.totalPages;
+    var badgeText = _a.badgeText, breadcrumbs = _a.breadcrumbs, btnIcon = _a.btnIcon, btnOutlined = _a.btnOutlined, btnText = _a.btnText, btnType = _a.btnType, cardItems = _a.cardItems, cardsLimit = _a.cardsLimit, currentPage = _a.currentPage, handleButtonClick = _a.handleButtonClick, heading = _a.heading, numberOfFilters = _a.numberOfFilters, onNext = _a.onNext, onPageChange = _a.onPageChange, onPrevious = _a.onPrevious, subheading = _a.subheading, totalPages = _a.totalPages;
     return (react_1.default.createElement("section", { className: "kismaa-section-spacing bg-white" },
         react_1.default.createElement("div", { className: "kismaa-container" },
-            react_1.default.createElement(section_header_1.SectionHeader, { heading: heading, subheading: subheading, renderCtaButton: true, handleButtonClick: handleButtonClick, btnText: btnText, btnOutlined: btnOutlined, badgeText: badgeText, btnType: btnType, btnIcon: btnIcon, breadcrumbs: breadcrumbs }),
+            react_1.default.createElement(section_header_1.SectionHeader, { badgeText: badgeText, breadcrumbs: breadcrumbs, btnIcon: btnIcon, btnOutlined: btnOutlined, btnText: btnText, btnType: btnType, handleButtonClick: handleButtonClick, heading: heading, numberOfFilters: numberOfFilters, renderCtaButton: true, subheading: subheading }),
             react_1.default.createElement(user_cards_grid_1.UserCardsGrid, { cardItems: cardItems, cardsLimit: cardsLimit }),
             react_1.default.createElement("div", { className: "mt-12" },
                 react_1.default.createElement(pagination_1.Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: onPageChange, onPrevious: onPrevious, onNext: onNext })))));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appcorp/kismaa-web-ui",
-  "version": "0.2.17",
+  "version": "0.2.19",
   "source": "src/index.ts",
   "main": "lib/main.js",
   "module": "lib/module.js",
@@ -43,9 +43,9 @@
     }
   },
   "devDependencies": {
-    "@appcorp/app-corp-designs": "^0.4.80",
-    "@appcorp/app-corp-vista": "^0.2.75",
-    "@appcorp/kismaa-utils": "^0.2.17",
+    "@appcorp/app-corp-designs": "^0.4.89",
+    "@appcorp/app-corp-vista": "^0.2.76",
+    "@appcorp/kismaa-utils": "^0.2.22",
     "@chromatic-com/storybook": "3.2.6",
     "@eslint/compat": "^1.2.8",
     "@headlessui/react": "^2",
@@ -55,7 +55,7 @@
     "@mdx-js/react": "^3",
     "@next/eslint-plugin-next": "^15",
     "@next/mdx": "^15",
-    "@react-pakistan/util-functions": "^1.24.33",
+    "@react-pakistan/util-functions": "^1.24.35",
     "@storybook/addon-essentials": "^8",
     "@storybook/addon-interactions": "^8",
     "@storybook/addon-links": "^8",
@@ -103,7 +103,8 @@
     "tailwindcss": "^4",
     "ts-jest": "^29",
     "ts-node": "^10",
-    "typescript": "^5"
+    "typescript": "^5",
+    "zod": "^4"
   },
   "packageManager": "yarn@4.9.2"
 }