@pnkx-lib/ui 1.9.196 → 1.9.197

package/es/chunks/useBreadcrumb-IwFmXF85.js

@@ -0,0 +1,55 @@
+import { jsx } from 'react/jsx-runtime';
+import { useLocation, Link } from 'react-router';
+
+const useBreadcrumb = (menuRouter, customBreadcrumb) => {
+  const location = useLocation();
+  const pathUrl = location.pathname;
+  const findPath = (items, targetPath, parentTrail = []) => {
+    for (const item of items) {
+      const currentTrail = [...parentTrail, item];
+      if (item.path === targetPath) {
+        return currentTrail;
+      }
+      if (item.path?.includes(":") && matchDynamicPath(item.path, targetPath)) {
+        return currentTrail;
+      }
+      if (item.children) {
+        const found = findPath(item.children, targetPath, currentTrail);
+        if (found) return found;
+      }
+    }
+    return null;
+  };
+  const matchDynamicPath = (routePath, currentPath) => {
+    const regex = new RegExp(
+      "^" + routePath.replace(/:[^\s/]+/g, "([^/]+)").replace(/\/$/, "") + "$"
+    );
+    return regex.test(currentPath);
+  };
+  const matchedTrail = findPath(menuRouter, pathUrl) || [];
+  const visibleTrail = matchedTrail.filter((item) => item.isShowLabel === true);
+  const lastIndex = visibleTrail.length - 1;
+  const baseItems = visibleTrail.map((item, index) => {
+    const isLast = index === lastIndex;
+    if (customBreadcrumb?.length) {
+      return {
+        title: /* @__PURE__ */ jsx(Link, { to: item.path, children: item.name })
+      };
+    }
+    return {
+      title: isLast ? /* @__PURE__ */ jsx("span", { style: { fontWeight: "bold" }, children: item.name }) : /* @__PURE__ */ jsx(Link, { to: item.path, children: item.name })
+    };
+  });
+  const breadcrumbItems = [
+    { title: /* @__PURE__ */ jsx(Link, { to: "/", children: "Trang chủ" }) },
+    ...baseItems,
+    ...customBreadcrumb?.length ? [
+      {
+        title: /* @__PURE__ */ jsx("span", { style: { fontWeight: "bold" }, children: customBreadcrumb[customBreadcrumb.length - 1].title })
+      }
+    ] : []
+  ];
+  return breadcrumbItems;
+};
+
+export { useBreadcrumb as u };

package/es/fields/TimePicker.js

@@ -6,23 +6,18 @@ import { g as get } from '../chunks/get-C880miVG.js';
 
 const TimePicker = (props) => {
   const { field, afterOnChange, formState, label, required, ...rest } = props;
-  const fieldName = field?.name;
-  const fieldValue = field?.value;
-  const fieldOnChange = field?.onChange;
-  const fieldOnBlur = field?.onBlur;
+  const { name, value, onChange, onBlur } = field || {};
   const { touchedFields, errors, isSubmitted } = formState || {};
-  const isTouched = fieldName ? get(touchedFields, fieldName) : false;
-  const errorMessage = fieldName ? get(errors, fieldName)?.message : void 0;
+  const isTouched = get(touchedFields, name);
+  const errorMessage = get(errors, name)?.message;
   const handleChange = (dates) => {
-    if (fieldOnChange) {
-      fieldOnChange(dates);
+    if (onChange) {
+      onChange(dates);
     }
     afterOnChange?.(dates);
   };
   const handleBlur = () => {
-    if (fieldOnBlur) {
-      fieldOnBlur();
-    }
+    onBlur?.();
   };
   const renderErrorMessage = () => {
     if (!errorMessage) return null;
@@ -40,11 +35,11 @@ const TimePicker = (props) => {
     /* @__PURE__ */ jsx(
       TimePicker$1,
       {
-        ...rest,
-        value: fieldValue || null,
+        value: value || null,
         onChange: handleChange,
         onBlur: handleBlur,
-        status: (isTouched || isSubmitted) && errorMessage ? "error" : void 0
+        status: (isTouched || isSubmitted) && errorMessage ? "error" : void 0,
+        ...rest
       }
     ),
     renderErrorMessage()

package/es/ui/BreadcrumbHeading.js

@@ -1,54 +1,13 @@
 import { jsx } from 'react/jsx-runtime';
 import { c as className } from '../chunks/index-mzHK7Za8.js';
 import { Breadcrumb } from './Breadcrumb.js';
-import { useLocation, Link } from 'react-router';
+import { u as useBreadcrumb } from '../chunks/useBreadcrumb-IwFmXF85.js';
 
 const BreadcrumbHeading = (props) => {
   const { menu, customBreadcum } = props;
-  const location = useLocation();
-  const pathUrl = location.pathname;
-  const breadcrumbsItem = [
-    { title: /* @__PURE__ */ jsx(Link, { to: "/", children: "Trang chủ" }) }
-  ];
-  function findBreadcrumbs(items, currentPath, trail = []) {
-    for (const item of items) {
-      if (!item || !item.path) continue;
-      if (currentPath === item.path) {
-        document.title = item.name;
-        if (!Object.prototype.hasOwnProperty.call(item, "isShowLabel") || item.isShowLabel) {
-          return [...trail, { title: /* @__PURE__ */ jsx(Link, { to: item.path, children: item.name }) }];
-        }
-        return trail;
-      }
-      if (currentPath.startsWith(item.path)) {
-        const newTrail = [...trail];
-        if (!Object.prototype.hasOwnProperty.call(item, "isShowLabel") || item.isShowLabel) {
-          newTrail.push({
-            title: /* @__PURE__ */ jsx(Link, { to: item.path, children: item.name })
-          });
-        }
-        if (item.children && item.children.length > 0) {
-          const childTrail = findBreadcrumbs(
-            item.children,
-            currentPath,
-            newTrail
-          );
-          if (childTrail) return childTrail;
-        }
-      }
-    }
-    return null;
-  }
-  const dynamicBreadcrumbs = findBreadcrumbs(menu, pathUrl);
-  if (dynamicBreadcrumbs) {
-    breadcrumbsItem.push(...dynamicBreadcrumbs);
-  }
-  const dataBreadcum = [
-    ...breadcrumbsItem,
-    ...customBreadcum ?? []
-  ];
+  const mappingBreadcrumb = useBreadcrumb(menu, customBreadcum);
   //! Render
-  return /* @__PURE__ */ jsx("div", { className: className("flex justify-between items-end"), children: /* @__PURE__ */ jsx(Breadcrumb, { items: dataBreadcum }) });
+  return /* @__PURE__ */ jsx("div", { className: className("flex justify-between items-center"), children: /* @__PURE__ */ jsx(Breadcrumb, { items: mappingBreadcrumb }) });
 };
 
 export { BreadcrumbHeading };

package/es/ui/Heading.js

@@ -1,49 +1,12 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { c as className } from '../chunks/index-mzHK7Za8.js';
 import { Breadcrumb } from './Breadcrumb.js';
-import { useLocation, Link } from 'react-router';
+import { u as useBreadcrumb } from '../chunks/useBreadcrumb-IwFmXF85.js';
 
 const Heading = (props) => {
   const { rightContent, children, noBreadcum, classNameWrapHeading, menu } = props;
   //! State
-  const location = useLocation();
-  const pathUrl = location.pathname;
-  const breadcrumbsItem = [
-    { title: /* @__PURE__ */ jsx(Link, { to: "/", children: "Trang chủ" }) }
-  ];
-  function findBreadcrumbs(items, currentPath, trail = []) {
-    for (const item of items) {
-      if (!item || !item.path) continue;
-      if (currentPath === item.path) {
-        if (!Object.prototype.hasOwnProperty.call(item, "isShowLabel") || item.isShowLabel) {
-          return [...trail, { title: /* @__PURE__ */ jsx(Link, { to: item.path, children: item.name }) }];
-        }
-        return trail;
-      }
-      if (currentPath.startsWith(item.path)) {
-        const newTrail = [...trail];
-        if (!Object.prototype.hasOwnProperty.call(item, "isShowLabel") || item.isShowLabel) {
-          newTrail.push({
-            title: /* @__PURE__ */ jsx(Link, { to: item.path, children: item.name })
-          });
-        }
-        if (item.children && item.children.length > 0) {
-          const childTrail = findBreadcrumbs(
-            item.children,
-            currentPath,
-            newTrail
-          );
-          if (childTrail) return childTrail;
-        }
-        document.title = item.name;
-      }
-    }
-    return null;
-  }
-  const dynamicBreadcrumbs = findBreadcrumbs(menu, pathUrl);
-  if (dynamicBreadcrumbs) {
-    breadcrumbsItem.push(...dynamicBreadcrumbs);
-  }
+  const mappingBreadcrumb = useBreadcrumb(menu);
   //! Function
   //! Render
   return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -55,7 +18,7 @@ const Heading = (props) => {
           classNameWrapHeading
         ),
         children: [
-          !noBreadcum && /* @__PURE__ */ jsx(Breadcrumb, { items: breadcrumbsItem }),
+          !noBreadcum && /* @__PURE__ */ jsx(Breadcrumb, { items: mappingBreadcrumb }),
           rightContent
         ]
       }

package/es/ui/index.js

@@ -4878,7 +4878,7 @@ const BulkActions = ({
   handleApprove,
   handleCancelApproval,
   handleReject,
-  handleDeactivate,
+  handleDeActivate,
   handleActivate,
   handleRestore,
   status
@@ -4981,7 +4981,7 @@ const BulkActions = ({
       icon: /* @__PURE__ */ jsx(InActiveIcon, { stroke: "white" }),
       iconDropList: /* @__PURE__ */ jsx(InActiveIcon, { stroke: "#0F1D40" }),
       iconDisable: /* @__PURE__ */ jsx(InActiveIcon, { stroke: "#B2B7C2" }),
-      action: handleDeactivate,
+      action: handleDeActivate,
       name: "Vô hiệu hóa",
       typeIcon: "info",
       title: "Xác nhận vô hiệu hóa",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pnkx-lib/ui",
   "private": false,
-  "version": "1.9.196",
+  "version": "1.9.197",
   "type": "module",
   "main": "./es/index.js",
   "module": "./es/index.js",

package/types/components/hooks/useBreadcrumb.d.ts

@@ -0,0 +1,6 @@
+import { MenuType, BreadcrumbItemType } from '../ui';
+type CustomBreadcrumbItem = {
+    title: React.ReactNode;
+};
+export declare const useBreadcrumb: (menuRouter: MenuType[], customBreadcrumb?: CustomBreadcrumbItem[]) => BreadcrumbItemType[];
+export {};

package/types/components/ui/BulkActions/index.d.ts

@@ -18,5 +18,5 @@ export type TListIcon = {
     typeIcon?: ConfirmModalProps["typeIcon"];
     name?: string;
 };
-export declare const BulkActions: ({ quantity, handleDelete, handleSubmitForApproval, handleCancelSubmission, handleApprove, handleCancelApproval, handleReject, handleDeactivate, handleActivate, handleRestore, status, }: IBulkActionsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BulkActions: ({ quantity, handleDelete, handleSubmitForApproval, handleCancelSubmission, handleApprove, handleCancelApproval, handleReject, handleDeActivate, handleActivate, handleRestore, status, }: IBulkActionsProps) => import("react/jsx-runtime").JSX.Element;
 export {};