@appcorp/fusion-storybook 0.4.16 → 0.4.18

package/base-modules/student-fee/auto-post-payload.d.ts

@@ -0,0 +1,13 @@
+interface BuildAutoPostPayloadInput {
+    schoolId: string;
+    computerNumbers: string[];
+    paidAt: string;
+    skipFine: boolean;
+}
+export declare function buildAutoPostPayload(input: BuildAutoPostPayloadInput): {
+    skipFine?: boolean | undefined;
+    schoolId: string;
+    computerNumbers: string[];
+    paidAt: string;
+};
+export {};

package/base-modules/student-fee/auto-post-payload.js

@@ -0,0 +1,3 @@
+export function buildAutoPostPayload(input) {
+    return Object.assign({ schoolId: input.schoolId, computerNumbers: input.computerNumbers, paidAt: input.paidAt }, (input.skipFine ? { skipFine: true } : {}));
+}

package/base-modules/student-fee/constants.d.ts

@@ -39,4 +39,5 @@ export declare const formatStudentName: (_: unknown, row: unknown) => string;
 export declare const formatCurrency: (amount: number) => string;
 export declare const formatAmount: (_: unknown, row: unknown) => string;
 export declare const formatAmountPaid: (_: unknown, row: unknown) => string;
+export declare const formatFine: (_: unknown, row: unknown) => string;
 export declare const formatAmountDue: (_: unknown, row: unknown) => string;

package/base-modules/student-fee/constants.js

@@ -65,6 +65,10 @@ export const formatAmountPaid = (_, row) => {
     var _a;
     return formatCurrency((_a = row.amountPaid) !== null && _a !== void 0 ? _a : 0);
 };
+export const formatFine = (_, row) => {
+    var _a;
+    return formatCurrency((_a = row.fine) !== null && _a !== void 0 ? _a : 0);
+};
 export const formatAmountDue = (_, row) => {
     var _a;
     return formatCurrency((_a = row.amountDue) !== null && _a !== void 0 ? _a : 0);

package/base-modules/student-fee/context/shared.d.ts

@@ -39,6 +39,7 @@ export declare const STUDENT_FEE_ACTION_TYPES: {
     amount: number;
     amountDue: number;
     amountPaid: number;
+    fine: number;
     discountAmount: number;
     discountCodeId: string | null;
     dueDate: string;
@@ -79,6 +80,7 @@ export declare const STUDENT_FEE_ACTION_TYPES: {
     amount: number;
     amountDue: number;
     amountPaid: number;
+    fine: number;
     discountAmount: number;
     discountCodeId: string | null;
     dueDate: string;
@@ -121,6 +123,7 @@ export declare const STUDENT_FEE_ACTION_TYPES: {
     amount: number;
     amountDue: number;
     amountPaid: number;
+    fine: number;
     discountAmount: number;
     discountCodeId: string | null;
     dueDate: string;
@@ -161,6 +164,7 @@ export declare const STUDENT_FEE_ACTION_TYPES: {
     amount: number;
     amountDue: number;
     amountPaid: number;
+    fine: number;
     discountAmount: number;
     discountCodeId: string | null;
     dueDate: string;
@@ -201,6 +205,7 @@ export declare const STUDENT_FEE_ACTION_TYPES: {
     amount: number;
     amountDue: number;
     amountPaid: number;
+    fine: number;
     discountAmount: number;
     discountCodeId: string | null;
     dueDate: string;

package/base-modules/student-fee/context/shared.js

@@ -37,6 +37,7 @@ const studentFeeConfig = {
         amount: 0,
         amountDue: 0,
         amountPaid: 0,
+        fine: 0,
         discountAmount: 0,
         discountCodeId: null,
         dueDate: (() => {

package/base-modules/student-fee/context/use-student-fee-module.d.ts

@@ -51,6 +51,7 @@ export declare const useStudentFeeModule: () => {
         amount: number;
         amountDue: number;
         amountPaid: number;
+        fine: number;
         discountAmount: number;
         discountCodeId: string | null;
         dueDate: string;

package/base-modules/student-fee/context/use-student-fee-module.js

@@ -70,6 +70,7 @@ export const useStudentFeeModule = () => {
                     amount: 0,
                     amountDue: 0,
                     amountPaid: 0,
+                    fine: 0,
                     discountAmount: 0,
                     discountCodeId: null,
                     dueDate: `${dueDate.getFullYear()}-${String(dueDate.getMonth() + 1).padStart(2, "0")}-${String(dueDate.getDate()).padStart(2, "0")}`,

package/base-modules/student-fee/misc-2.js

@@ -22,6 +22,12 @@ import { DISCOUNT_TYPE, PAYMENT_STATUS } from "../../types";
 import { PAYMENT_STATUS_OPTIONS } from "./constants";
 import { Loader2 } from "lucide-react";
 import { DATE_FORMATS, formatDate, } from "@react-pakistan/util-functions/general/format-date";
+function toLocalDateString(date) {
+    const year = date.getFullYear();
+    const month = String(date.getMonth() + 1).padStart(2, "0");
+    const day = String(date.getDate()).padStart(2, "0");
+    return `${year}-${month}-${day}`;
+}
 export const StudentFeeSingle = () => {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     const { dispatch, handleChange, state } = useStudentFeeModule();
@@ -40,13 +46,14 @@ export const StudentFeeSingle = () => {
         var _a;
         if (!debouncedComputerNumber)
             return;
+        // When the chosen payment date differs from today, ask the API to recompute
+        // the fines as of that back-dated (or future) payment date.
+        const today = toLocalDateString(new Date());
+        const useAsOf = state.paidAt && state.paidAt !== today;
         fetchByCNRef.current(undefined, {
-            params: {
-                computerNumber: debouncedComputerNumber,
-                schoolId: (_a = workspace === null || workspace === void 0 ? void 0 : workspace.school) === null || _a === void 0 ? void 0 : _a.id,
-            },
+            params: Object.assign({ computerNumber: debouncedComputerNumber, schoolId: (_a = workspace === null || workspace === void 0 ? void 0 : workspace.school) === null || _a === void 0 ? void 0 : _a.id }, (useAsOf ? { asOf: state.paidAt } : {})),
         });
-    }, [debouncedComputerNumber, (_c = workspace === null || workspace === void 0 ? void 0 : workspace.school) === null || _c === void 0 ? void 0 : _c.id]);
+    }, [debouncedComputerNumber, (_c = workspace === null || workspace === void 0 ? void 0 : workspace.school) === null || _c === void 0 ? void 0 : _c.id, state.paidAt]);
     const accumulatedAmount = useMemo(() => {
         var _a;
         if (!((_a = feeByComputerNumber === null || feeByComputerNumber === void 0 ? void 0 : feeByComputerNumber.studentFees) === null || _a === void 0 ? void 0 : _a.length))

package/base-modules/student-fee/more-actions.js

@@ -4,12 +4,14 @@ import { showErrorToast, showSuccessToast, showInfoToast, } from "@appcorp/shadc
 import { getCachedWorkspaceSync } from "../workspace/cache";
 import { useTranslations } from "next-intl";
 import { STUDENT_FEE_API_ROUTES } from "../../constants";
+import { buildAutoPostPayload } from "./auto-post-payload";
 import { STUDENT_FEE_ACTION_TYPES, useStudentFeeModule } from "./context";
 import { useRef, useEffect, useCallback, useState } from "react";
 import { Button } from "@appcorp/shadcn/components/ui/button";
 import { Separator } from "@appcorp/shadcn/components/ui/separator";
 import { EnhancedInput } from "@appcorp/shadcn/components/enhanced-input";
 import { EnhancedTextarea } from "@appcorp/shadcn/components/enhanced-textarea";
+import { EnhancedCheckbox } from "@appcorp/shadcn/components/enhanced-checkbox";
 const workspace = getCachedWorkspaceSync();
 const POLL_INTERVAL_MS = 2000;
 const POLL_TIMEOUT_MS = 300000;
@@ -61,6 +63,7 @@ export const StudentFeeMoreActions = () => {
     const abortRef = useRef(null);
     const [autoPostDate, setAutoPostDate] = useState("");
     const [computerNumbersText, setComputerNumbersText] = useState("");
+    const [skipFine, setSkipFine] = useState(false);
     const [submitting, setSubmitting] = useState(false);
     useEffect(() => {
         return () => {
@@ -127,11 +130,12 @@ export const StudentFeeMoreActions = () => {
                     headers: {
                         "Content-Type": "application/json",
                     },
-                    body: JSON.stringify({
+                    body: JSON.stringify(buildAutoPostPayload({
                         schoolId,
                         computerNumbers: uniqueNumbers,
                         paidAt: autoPostDate,
-                    }),
+                        skipFine,
+                    })),
                     signal,
                 });
                 if (!res.ok) {
@@ -187,9 +191,9 @@ export const StudentFeeMoreActions = () => {
         finally {
             setSubmitting(false);
         }
-    }, [t, dispatch, closeDrawer, refreshList, computerNumbersText, autoPostDate]);
+    }, [t, dispatch, closeDrawer, refreshList, computerNumbersText, autoPostDate, skipFine]);
     const canSubmit = autoPostDate.trim() !== "" &&
         computerNumbersText.trim() !== "" &&
         !submitting;
-    return (_jsxs("div", { className: "space-y-4", children: [_jsx(Button, { disabled: new Date().getDate() !== 1, onClick: handleCreateMonthly, children: t("actionsButtonCreateMonthly") }), _jsx(Button, { onClick: handleCreateSingleEntry, children: t("actionsButtonSingleEntry") }), _jsx(Separator, {}), _jsxs("div", { className: "space-y-4", children: [_jsx(EnhancedInput, { id: "autoPostDate", info: t("formAutoPostDateInfo"), label: t("formAutoPostDateLabel"), onChange: (e) => setAutoPostDate(e.target.value), onClick: (e) => { var _a, _b; return (_b = (_a = e.currentTarget).showPicker) === null || _b === void 0 ? void 0 : _b.call(_a); }, type: "date", value: autoPostDate }), _jsx(EnhancedTextarea, { id: "autoPostComputerNumbers", info: t("formAutoPostComputerNumbersInfo"), label: t("formAutoPostComputerNumbersLabel"), onChange: (e) => setComputerNumbersText(e.target.value), placeholder: t("formAutoPostComputerNumbersPlaceholder"), rows: 8, value: computerNumbersText }), _jsx(Button, { disabled: !canSubmit, onClick: handleAutoPost, children: t("actionsButtonAutoPost") })] })] }));
+    return (_jsxs("div", { className: "space-y-4", children: [_jsx(Button, { disabled: new Date().getDate() !== 1, onClick: handleCreateMonthly, children: t("actionsButtonCreateMonthly") }), _jsx(Button, { onClick: handleCreateSingleEntry, children: t("actionsButtonSingleEntry") }), _jsx(Separator, {}), _jsxs("div", { className: "space-y-4", children: [_jsx(EnhancedInput, { id: "autoPostDate", info: t("formAutoPostDateInfo"), label: t("formAutoPostDateLabel"), onChange: (e) => setAutoPostDate(e.target.value), onClick: (e) => { var _a, _b; return (_b = (_a = e.currentTarget).showPicker) === null || _b === void 0 ? void 0 : _b.call(_a); }, type: "date", value: autoPostDate }), _jsx(EnhancedTextarea, { id: "autoPostComputerNumbers", info: t("formAutoPostComputerNumbersInfo"), label: t("formAutoPostComputerNumbersLabel"), onChange: (e) => setComputerNumbersText(e.target.value), placeholder: t("formAutoPostComputerNumbersPlaceholder"), rows: 8, value: computerNumbersText }), _jsx(EnhancedCheckbox, { id: "autoPostSkipFine", checked: skipFine, info: t("formSkipFineInfo"), label: t("formSkipFineLabel"), onCheckedChange: (checked) => setSkipFine(!!checked) }), _jsx(Button, { disabled: !canSubmit, onClick: handleAutoPost, children: t("actionsButtonAutoPost") })] })] }));
 };

package/base-modules/student-fee/page.d.ts

@@ -34,6 +34,7 @@ interface ConfigProps {
     tableColumnHeaderAmount: string;
     tableColumnHeaderAmountDue: string;
     tableColumnHeaderAmountPaid: string;
+    tableColumnHeaderFine: string;
     tableColumnHeaderDueDate: string;
     tableColumnHeaderFeeStructure: string;
     tableColumnHeaderId: string;

package/base-modules/student-fee/page.js

@@ -26,7 +26,7 @@ import { StudentFeeMoreActions } from "./more-actions";
 import { StudentFeeView } from "./view";
 import { resolveRbacPermissions } from "../../utils/resolve-rbac-permissions";
 import { RbacNoAccess } from "../../components/rbac-no-access";
-import { formatStudentName, formatAmount, formatAmountPaid, formatAmountDue, } from "./constants";
+import { formatStudentName, formatAmount, formatAmountPaid, formatAmountDue, formatFine, } from "./constants";
 import { StudentFeeMonthly } from "./misc-1";
 import { StudentFeeSingle } from "./misc-2";
 // ============================================================================
@@ -50,6 +50,11 @@ const tableBodyCols = [
         key: "amountPaid",
         textFormatter: formatAmountPaid,
     },
+    {
+        componentType: COMPONENT_TYPE.TEXT,
+        key: "fine",
+        textFormatter: formatFine,
+    },
     {
         componentType: COMPONENT_TYPE.TEXT,
         key: "amountDue",
@@ -79,7 +84,7 @@ const createComponentInstances = () => ({
     misc1: _jsx(StudentFeeMonthly, {}),
     misc2: _jsx(StudentFeeSingle, {}),
 });
-const createStudentFeeConfig = ({ clearFilters, drawerButtonCancel, drawerButtonSave, drawerFilterDescription, drawerFilterTitle, drawerFormDescription, drawerFormTitle, drawerMisc1Description, drawerMisc1Title, drawerMisc2Description, drawerMisc2Title, drawerMoreActionsDescription, drawerMoreActionsTitle, drawerViewDescription, drawerViewTitle, tableColumnHeaderActions, tableColumnHeaderAmount, tableColumnHeaderAmountDue, tableColumnHeaderAmountPaid, tableColumnHeaderDueDate, tableColumnHeaderFeeStructure, tableColumnHeaderId, tableColumnHeaderRemarks, tableColumnHeaderStatus, tableColumnHeaderStudent, tableDescription, tableSearchPlaceholder, tableTitle, }) => {
+const createStudentFeeConfig = ({ clearFilters, drawerButtonCancel, drawerButtonSave, drawerFilterDescription, drawerFilterTitle, drawerFormDescription, drawerFormTitle, drawerMisc1Description, drawerMisc1Title, drawerMisc2Description, drawerMisc2Title, drawerMoreActionsDescription, drawerMoreActionsTitle, drawerViewDescription, drawerViewTitle, tableColumnHeaderActions, tableColumnHeaderAmount, tableColumnHeaderAmountDue, tableColumnHeaderAmountPaid, tableColumnHeaderFine, tableColumnHeaderDueDate, tableColumnHeaderFeeStructure, tableColumnHeaderId, tableColumnHeaderRemarks, tableColumnHeaderStatus, tableColumnHeaderStudent, tableDescription, tableSearchPlaceholder, tableTitle, }) => {
     const components = createComponentInstances();
     return {
         cancelLabel: drawerButtonCancel,
@@ -110,6 +115,7 @@ const createStudentFeeConfig = ({ clearFilters, drawerButtonCancel, drawerButton
             { label: tableColumnHeaderFeeStructure, width: "12%" },
             { label: tableColumnHeaderAmount, width: "10%" },
             { label: tableColumnHeaderAmountPaid, width: "10%" },
+            { label: tableColumnHeaderFine, width: "8%" },
             { label: tableColumnHeaderAmountDue, width: "10%" },
             { label: tableColumnHeaderDueDate, width: "10%" },
             { label: tableColumnHeaderStatus, width: "10%" },
@@ -151,6 +157,7 @@ const StudentFeePageInner = (props) => {
         tableColumnHeaderAmount: props.tableColumnHeaderAmount,
         tableColumnHeaderAmountDue: props.tableColumnHeaderAmountDue,
         tableColumnHeaderAmountPaid: props.tableColumnHeaderAmountPaid,
+        tableColumnHeaderFine: props.tableColumnHeaderFine,
         tableColumnHeaderDueDate: props.tableColumnHeaderDueDate,
         tableColumnHeaderFeeStructure: props.tableColumnHeaderFeeStructure,
         tableColumnHeaderId: props.tableColumnHeaderId,
@@ -179,6 +186,7 @@ const StudentFeePageInner = (props) => {
         props.tableColumnHeaderAmount,
         props.tableColumnHeaderAmountDue,
         props.tableColumnHeaderAmountPaid,
+        props.tableColumnHeaderFine,
         props.tableColumnHeaderDueDate,
         props.tableColumnHeaderFeeStructure,
         props.tableColumnHeaderId,

package/base-modules/student-fee/view.js

@@ -14,7 +14,7 @@ import { useTranslations } from "next-intl";
 export const StudentFeeView = () => {
     var _a, _b, _c;
     const { state } = useStudentFeeModule();
-    const { amount, amountDue, amountPaid, dueDate, enabled, feeStructureId, paidAt, remarks, status, studentProfileId, } = state;
+    const { amount, amountDue, amountPaid, fine, dueDate, enabled, feeStructureId, paidAt, remarks, status, studentProfileId, } = state;
     const workspace = getCachedWorkspaceSync();
     const currency = (_b = (_a = workspace === null || workspace === void 0 ? void 0 : workspace.school) === null || _a === void 0 ? void 0 : _a.currency) !== null && _b !== void 0 ? _b : "";
     const t = useTranslations("studentFee");
@@ -30,5 +30,5 @@ export const StudentFeeView = () => {
                                             ? `${studentProfile.firstName} ${studentProfile.lastName}`
                                             : "—" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("viewFieldComputerNumber") }), _jsx("p", { className: "text-base", children: ((_c = studentProfile === null || studentProfile === void 0 ? void 0 : studentProfile.computerNumber) !== null && _c !== void 0 ? _c : "").split(":")[1] ||
                                             (studentProfile === null || studentProfile === void 0 ? void 0 : studentProfile.computerNumber) ||
-                                            "—" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formFeeStructureLabel") }), _jsx("p", { className: "text-base", children: (feeStructure === null || feeStructure === void 0 ? void 0 : feeStructure.name) || "—" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formTotalAmountLabel") }), _jsxs("p", { className: "text-base", children: [currency, " ", (amount !== null && amount !== void 0 ? amount : 0).toFixed(2)] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formAmountPaidLabel") }), _jsxs("p", { className: "text-base", children: [currency, " ", (amountPaid !== null && amountPaid !== void 0 ? amountPaid : 0).toFixed(2)] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formAmountDueLabel") }), _jsxs("p", { className: "text-base", children: [currency, " ", (amountDue !== null && amountDue !== void 0 ? amountDue : 0).toFixed(2)] })] }), _jsxs("div", { className: "space-y-1", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Calendar, { className: "text-muted-foreground h-4 w-4" }), _jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formDueDateLabel") })] }), _jsx("p", { className: "text-base", children: formatDate(dueDate, DATE_FORMATS.LOCALE_DATE) })] }), paidAt && (_jsxs("div", { className: "space-y-1", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Calendar, { className: "text-muted-foreground h-4 w-4" }), _jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formPaidAtLabel") })] }), _jsx("p", { className: "text-base", children: formatDate(paidAt, DATE_FORMATS.LOCALE_DATE) })] })), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formStatusLabel") }), _jsx(Badge, { variant: "secondary", children: status || "—" })] }), remarks && (_jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formRemarksLabel") }), _jsx("p", { className: "text-base", children: remarks })] })), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("viewFieldRecordState") }), _jsxs(Badge, { className: "gap-1", variant: enabled ? "default" : "destructive", children: [enabled ? (_jsx(CheckCircle2, { className: "h-3 w-3" })) : (_jsx(XCircle, { className: "h-3 w-3" })), enabled ? t("badgeActive") : t("badgeInactive")] })] })] }) })] }) }));
+                                            "—" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formFeeStructureLabel") }), _jsx("p", { className: "text-base", children: (feeStructure === null || feeStructure === void 0 ? void 0 : feeStructure.name) || "—" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formTotalAmountLabel") }), _jsxs("p", { className: "text-base", children: [currency, " ", (amount !== null && amount !== void 0 ? amount : 0).toFixed(2)] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formAmountPaidLabel") }), _jsxs("p", { className: "text-base", children: [currency, " ", (amountPaid !== null && amountPaid !== void 0 ? amountPaid : 0).toFixed(2)] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("viewFieldFine") }), _jsxs("p", { className: "text-base", children: [currency, " ", (fine !== null && fine !== void 0 ? fine : 0).toFixed(2)] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formAmountDueLabel") }), _jsxs("p", { className: "text-base", children: [currency, " ", (amountDue !== null && amountDue !== void 0 ? amountDue : 0).toFixed(2)] })] }), _jsxs("div", { className: "space-y-1", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Calendar, { className: "text-muted-foreground h-4 w-4" }), _jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formDueDateLabel") })] }), _jsx("p", { className: "text-base", children: formatDate(dueDate, DATE_FORMATS.LOCALE_DATE) })] }), paidAt && (_jsxs("div", { className: "space-y-1", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Calendar, { className: "text-muted-foreground h-4 w-4" }), _jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formPaidAtLabel") })] }), _jsx("p", { className: "text-base", children: formatDate(paidAt, DATE_FORMATS.LOCALE_DATE) })] })), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formStatusLabel") }), _jsx(Badge, { variant: "secondary", children: status || "—" })] }), remarks && (_jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("formRemarksLabel") }), _jsx("p", { className: "text-base", children: remarks })] })), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("viewFieldRecordState") }), _jsxs(Badge, { className: "gap-1", variant: enabled ? "default" : "destructive", children: [enabled ? (_jsx(CheckCircle2, { className: "h-3 w-3" })) : (_jsx(XCircle, { className: "h-3 w-3" })), enabled ? t("badgeActive") : t("badgeInactive")] })] })] }) })] }) }));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appcorp/fusion-storybook",
-  "version": "0.4.16",
+  "version": "0.4.18",
   "scripts": {
     "build-storybook": "storybook build",
     "build:next": "next build",