@pnkx-lib/ui 1.9.342 → 1.9.343

package/es/index.js

@@ -2,7 +2,7 @@ export { Button } from './ui/Button.js';
 export { CascaderField } from './ui/Cascader.js';
 export { ErrorMessage } from './ui/ErrorMessage.js';
 export { Typography } from './ui/Typography.js';
-export { BulkActions, Table } from './ui/index.js';
+export { ActionRowTable, BulkActions, Table } from './ui/index.js';
 export { Modal } from './ui/Modal.js';
 export { Tooltip } from './ui/Tooltip.js';
 export { Tabs } from './ui/Tabs.js';

package/es/ui/index.js

@@ -1,12 +1,12 @@
-export { Button } from './Button.js';
+import { Button } from './Button.js';
 export { CascaderField } from './Cascader.js';
 export { ErrorMessage } from './ErrorMessage.js';
 import { Typography } from './Typography.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState, useCallback, useEffect, useRef } from 'react';
 import { Select, Input, Pagination, Table as Table$1, Tooltip as Tooltip$1 } from 'antd';
-import { TypeStatusTable, TypeBulkActions } from '../constants/index.js';
-export { PAGE_NUMBER, PAGE_SIZE, SORT, START_PAGE, START_PAGE_SIZE, TypeActionRowTable } from '../constants/index.js';
+import { TypeStatusTable, TypeActionRowTable, TypeBulkActions } from '../constants/index.js';
+export { PAGE_NUMBER, PAGE_SIZE, SORT, START_PAGE, START_PAGE_SIZE } from '../constants/index.js';
 export { Modal } from './Modal.js';
 import { Tooltip } from './Tooltip.js';
 export { Tabs } from './Tabs.js';
@@ -55,8 +55,8 @@ import { ConfirmModal } from './ConfirmModal.js';
 export { ErrorBoundary } from './ErrorBoundary.js';
 import { CATEGORY_LIST_ENUM } from './CategoryStatus.js';
 export { CategoryStatus, badgeStatusCategoryConfig } from './CategoryStatus.js';
-import { isEmpty, isBoolean } from 'lodash';
 import { useToggle } from '@pnkx-lib/core';
+import { isEmpty, isBoolean } from 'lodash';
 import { t as twMerge } from '../chunks/bundle-mjs-BBFHkixS.js';
 export { BreadcrumbHeading } from './BreadcrumbHeading.js';
 export { Card } from './Card.js';
@@ -463,6 +463,15 @@ const EmptyTable = () => {
   ] });
 };
 
+const EditIcon = ({ stroke, fill = "#007BE5" }) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: 14, height: 15, fill: "none", children: /* @__PURE__ */ jsx(
+  "path",
+  {
+    fill,
+    stroke,
+    d: "m1.177 11.137.711.237-.711-.237ZM1.8 9.264l-.712-.238.712.238Zm.644-1.043.53.53-.53-.53ZM8.667 2l-.53-.53.53.53ZM12 5.333l.53.53-.53-.53Zm-6.222 6.222-.53-.53.53.53Zm-1.042.644.237.711-.237-.711Zm-1.873.624.237.712-.237-.712Zm2.574-.95-.452-.598.452.599Zm-.263.163-.333-.672.333.672Zm7.629-9.11-.672.333.672-.333Zm0 1.48-.672-.333.672.333Zm-3.21-3.21.333.673-.333-.672Zm1.48 0-.333.673.333-.672Zm-9.11 7.63.673.333-.672-.333Zm.163-.263-.599-.452.6.452Zm-1.26 4.066-.706.252.706-.252Zm.505.505-.252.706.252-.706ZM8.364 2.303a.75.75 0 0 0-1.061 1.06l1.06-1.06Zm2.272 4.394a.75.75 0 0 0 1.061-1.06l-1.06 1.06ZM7 12.917a.75.75 0 0 0 0 1.5v-1.5Zm5.833 1.5a.75.75 0 0 0 0-1.5v1.5Zm-11.656-3.28.711.237.624-1.873-.711-.237-.712-.238L.465 10.9l.712.238ZM2.445 8.22l.53.53 6.222-6.22L8.667 2l-.53-.53-6.222 6.22.53.531ZM12 5.333l-.53-.53-6.222 6.221.53.53.53.53 6.222-6.22-.53-.53ZM4.736 12.2l-.237-.712-1.873.625.237.711.237.712 1.873-.625-.237-.711Zm1.042-.644-.53-.53c-.18.18-.222.219-.263.25l.452.599.451.598c.144-.108.269-.235.42-.387l-.53-.53Zm-1.042.644.237.711c.204-.068.373-.122.535-.202l-.334-.672-.333-.672c-.047.023-.1.043-.342.123l.237.712Zm.7-.325-.451-.6a.92.92 0 0 1-.144.09l.333.672.334.672c.134-.067.261-.146.38-.236l-.451-.598ZM12 2l-.53.53c.497.497.608.622.661.73l.672-.334.672-.333c-.19-.383-.533-.712-.945-1.124L12 2Zm0 3.333.53.53c.412-.411.755-.74.945-1.124l-.672-.333-.672-.333c-.053.107-.164.233-.661.73l.53.53Zm.803-2.407-.672.333a.917.917 0 0 1 0 .814l.672.333.672.333a2.417 2.417 0 0 0 0-2.146l-.672.333ZM8.667 2l.53.53c.497-.497.622-.608.73-.661l-.334-.672L9.26.525c-.383.19-.712.533-1.124.944l.53.53ZM12 2l.53-.53c-.411-.412-.74-.755-1.124-.945l-.333.672-.333.672c.107.053.232.164.73.661L12 2Zm-2.407-.803.333.672a.917.917 0 0 1 .814 0l.333-.672.333-.672a2.417 2.417 0 0 0-2.146 0l.333.672ZM1.801 9.264l.711.237c.081-.242.1-.295.124-.342l-.672-.333-.672-.334c-.08.161-.135.33-.203.534l.712.238Zm.644-1.043-.53-.53c-.152.152-.279.276-.388.42l.6.452.598.452a2.99 2.99 0 0 1 .25-.263l-.53-.53Zm-.481.605.672.333c.025-.05.055-.1.089-.144l-.599-.452-.599-.452c-.09.12-.168.247-.235.381l.672.334Zm-.787 2.31L.465 10.9c-.13.393-.246.737-.312 1.016-.063.267-.118.617.007.966l.706-.252.706-.252c.028.078-.007.088.041-.119.046-.196.135-.463.275-.884l-.711-.237Zm1.686 1.687-.237-.711c-.421.14-.688.228-.884.274-.208.049-.197.014-.12.041l-.251.707-.252.706c.349.124.698.07.966.007.278-.066.622-.181 1.015-.312l-.237-.712ZM.866 12.63l-.706.252c.16.447.511.8.96.96l.251-.707.252-.707a.083.083 0 0 1-.05-.05l-.707.252Zm6.967-9.796-.53.53 3.333 3.334.53-.53.531-.53-3.333-3.334-.53.53ZM7 13.666v.75h5.833v-1.5H7v.75Z"
+  }
+) });
+
 const RestoreIcon = ({ stroke, fill }) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: 22, height: 22, fill: "none", children: /* @__PURE__ */ jsx(
   "path",
   {
@@ -590,6 +599,65 @@ const MoreIcon = ({ stroke, fill }) => /* @__PURE__ */ jsx("svg", { xmlns: "http
   }
 ) });
 
+const ActionRowTable = ({
+  type,
+  contentTooltip,
+  handleClick
+}) => {
+  //! State
+  const {
+    shouldRender: shouldRenderDelete,
+    open: openDelete,
+    toggle: toggleDelete
+  } = useToggle();
+  //! Function
+  const handleDelete = () => {
+    handleClick?.();
+    toggleDelete();
+  };
+  const renderAction = () => {
+    switch (type) {
+      case TypeActionRowTable.EDIT:
+        return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Tooltip, { title: contentTooltip, children: /* @__PURE__ */ jsx(
+          Button,
+          {
+            onClick: handleClick,
+            type: "text",
+            className: "cursor-pointer",
+            shape: "circle",
+            icon: /* @__PURE__ */ jsx(EditIcon, { fill: "#007BE5" })
+          }
+        ) }) });
+      case TypeActionRowTable.DELETE:
+        return /* @__PURE__ */ jsx(Tooltip, { title: contentTooltip, children: /* @__PURE__ */ jsx(
+          Button,
+          {
+            onClick: toggleDelete,
+            type: "text",
+            className: "cursor-pointer",
+            shape: "circle",
+            icon: /* @__PURE__ */ jsx(DeleteIcon, { fill: "#DD4338" })
+          }
+        ) });
+    }
+  };
+  //! Render
+  return /* @__PURE__ */ jsxs("div", { children: [
+    shouldRenderDelete && /* @__PURE__ */ jsx(
+      ConfirmModal,
+      {
+        title: "Xác nhận xóa",
+        content: "Bạn có chắc chắn muốn xóa không? Hành động này không thể hoàn tác.",
+        typeIcon: "error",
+        open: openDelete,
+        handleCancel: toggleDelete,
+        handleSubmit: handleDelete
+      }
+    ),
+    renderAction()
+  ] });
+};
+
 const BulkAction = ({
   quantity = 0,
   listIcon,
@@ -882,4 +950,4 @@ const BulkActions = ({
   ] });
 };
 
-export { BulkActions, CATEGORY_LIST_ENUM, ConfirmModal, Popover, Table, Tooltip, TypeBulkActions, TypeStatusTable, Typography };
+export { ActionRowTable, BulkActions, Button, CATEGORY_LIST_ENUM, ConfirmModal, Popover, Table, Tooltip, TypeActionRowTable, TypeBulkActions, TypeStatusTable, Typography };

package/package.json

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

package/types/components/ui/Table/ActionRowTable/index.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+import { TypeActionRowTable } from '../../../../constants/table';
+export interface ActionRowTableProps {
+    type: TypeActionRowTable;
+    handleClick?: () => void;
+    contentTooltip?: React.ReactNode;
+    content?: React.ReactNode;
+    diabled?: boolean;
+}
+export declare const ActionRowTable: ({ type, contentTooltip, handleClick, }: ActionRowTableProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -50,6 +50,7 @@ export * from './Image';
 export * from './ConfirmModal';
 export * from './ErrorBoundary';
 export * from './CategoryStatus';
+export * from '../ui/Table/ActionRowTable';
 export * from '../../constants/index';
 export * from './BulkActions';
 export * from './BreadcrumbHeading';