@akinon/ai-modal-table 1.0.0

package/dist/esm/ai-table/utils/render-mapper-fields/index.js

@@ -0,0 +1,44 @@
+import { Input } from '@akinon/ui-input';
+import { Flex } from '@akinon/ui-layout';
+import { Select } from '@akinon/ui-select';
+import * as React from 'react';
+import { MAPPER_ITEM_TYPES } from '../../constants';
+const renderDivider = (row, index) => {
+    const isLastItem = Object.keys(row).length - 1 === index;
+    if (isLastItem)
+        return null;
+    return React.createElement("div", { className: "w-3 h-1 bg-ebonyClay-550" });
+};
+const renderSelectItem = ({ key, value, index, options, handleItemChange }) => (React.createElement(Select, { value: value || undefined, rootClassName: "w-40", size: "large", options: options || [], onChange: selectedValue => handleItemChange({
+        index,
+        key,
+        value: selectedValue
+    }) }));
+const renderTextItem = ({ key, value, index, handleItemChange }) => (React.createElement(Input, { value: value, className: "w-40", size: "large", onChange: e => handleItemChange({ index, key, value: e.target.value }) }));
+const renderItemByType = ({ key, index, item, handleItemChange }) => {
+    const { type, options, value } = item;
+    switch (type) {
+        case MAPPER_ITEM_TYPES.SELECT:
+            return renderSelectItem({
+                key,
+                value,
+                index,
+                options,
+                handleItemChange
+            });
+        case MAPPER_ITEM_TYPES.TEXT:
+            return renderTextItem({ key, value, index, handleItemChange });
+        default:
+            return renderTextItem({ key, value, index, handleItemChange });
+    }
+};
+export const renderMapperRow = ({ row, index, handleItemChange }) => {
+    return (React.createElement(Flex, { align: "center" }, Object.entries(row).map(([fieldKey, item], itemIndex) => (React.createElement(React.Fragment, { key: itemIndex },
+        renderItemByType({
+            key: fieldKey,
+            index,
+            item,
+            handleItemChange
+        }),
+        renderDivider(row, itemIndex))))));
+};

package/dist/esm/index.d.ts

@@ -0,0 +1,4 @@
+export { AiModalTable } from './ai-modal-table';
+export { AiTable } from './ai-table';
+export type { AiModalTableProps, AiTableProps } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC"}

package/dist/esm/index.js

@@ -0,0 +1,2 @@
+export { AiModalTable } from './ai-modal-table';
+export { AiTable } from './ai-table';

package/dist/esm/types/index.d.ts

@@ -0,0 +1,134 @@
+import type { ModalProps } from '@akinon/ui-modal';
+import { MAPPER_ITEM_TYPES } from '../ai-table/constants';
+type MapperItemTypes = (typeof MAPPER_ITEM_TYPES)[keyof typeof MAPPER_ITEM_TYPES];
+export type HandleMapperItemChange = ({ index, key, value }: {
+    index: number;
+    key: string;
+    value: MapperItemValue;
+}) => void;
+export type MapperItemValue = string | number;
+export type MapperSelectItemOption = {
+    label: string;
+    value: MapperItemValue;
+};
+export interface MapperRow {
+    [key: string]: {
+        value: MapperItemValue;
+        type: MapperItemTypes;
+        options?: MapperSelectItemOption[];
+    };
+}
+type Filter = {
+    key: string;
+    type: string;
+    placeholder?: string;
+};
+type Column = {
+    title: string;
+    dataIndex: string;
+    hasSparkle?: boolean;
+    hasGradientLine?: boolean;
+    render?: (value: unknown, record: Record<string, unknown>) => React.ReactNode;
+};
+export interface MapperConfig {
+    /**
+     * Callback fired when items are added to a mapper field. Receives the row ID, the dataIndex of the mapper field, and the new item to be added. The new item is an object containing 'key' and 'value' properties.
+     */
+    onAddItem: (pk: string | number, dataIndex: string) => void;
+    /**
+     * Callback fired when items are removed from a mapper field. Receives the row ID, the dataIndex of the mapper field, and the index of the item to be removed.
+     */
+    onRemoveItem: ({ pk, dataIndex, index }: {
+        pk: string | number;
+        dataIndex: string;
+        index: number;
+    }) => void;
+    /**
+     * Callback fired when a mapper item is changed. Receives the row ID, the dataIndex of the mapper field, the key of the item, the index of the item in the array, and the new value.
+     */
+    onItemChange: (pk: string | number, payload: Record<string, MapperRow[]>) => void;
+    /**
+     * Column data indexes that have mapper functionality.
+     */
+    dataIndex: string;
+}
+export interface TableBaseProps {
+    /**
+     * The unique key field name for identifying rows
+     */
+    rowKey?: string;
+    /**
+     * Array of data objects to display in the table
+     */
+    data: Record<string, unknown>[];
+    /**
+     * Array of column configurations defining table structure and appearance
+     */
+    columns: Column[];
+    /**
+     * Array of filter configurations for filtering the table data
+     */
+    filters: Filter[];
+    /**
+     * Array of data keys that should be editable in the table
+     */
+    editDataIndexes?: string[];
+    /**
+     * Callback fired when a row is edited. Returns the row ID and the modified data. To work properly, editDataIndexes prop must be provided
+     */
+    onEdit?: (pk: number | string, payload: Record<string, string>) => void;
+    /**
+     * Function to render custom action buttons for each row. Receives the row ID.
+     */
+    customActionButtons?: (rowId: number | string) => React.ReactNode;
+    /**
+     * Array of currently selected row IDs
+     */
+    selectedRows: Array<number | string>;
+    /**
+     * Callback fired when the selection of rows changes
+     */
+    onChangeSelectedRows: (rows: Array<number | string>) => void;
+    /**
+     *  Configuration for mapper functionality. If provided, the table will render mapper fields based on the specified dataIndex and use the provided callbacks to manage adding, removing, and changing items in the mapper fields.
+     */
+    mapperConfig?: MapperConfig;
+    /**
+     * CSS class name to apply to the table wrapper element
+     */
+    tableClassName?: string;
+}
+export interface AiTableProps extends TableBaseProps {
+    /**
+     * Shows loading state for the table data
+     */
+    isLoading: boolean;
+    /**
+     * Shows loading state for the submit buttons
+     */
+    isSubmitting: boolean;
+    /**
+     * Label text for the "Submit All" button
+     */
+    submitAllLabel: string;
+    /**
+     * Label text for the "Submit Selected" button
+     */
+    submitSelectedLabel: string;
+    /**
+     * Callback fired when "Submit All" button is clicked.
+     */
+    onSubmitAllData: () => void;
+    /**
+     * Callback fired when "Submit Selected" button is clicked.
+     */
+    onSubmitSelectedData: () => void;
+}
+export interface AiModalTableProps extends AiTableProps, ModalProps {
+    /**
+     * Description text displayed in the modal header
+     */
+    description: string;
+}
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"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"}

package/dist/esm/types/index.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -0,0 +1,60 @@
+{
+  "name": "@akinon/ai-modal-table",
+  "version": "1.0.0",
+  "private": false,
+  "type": "module",
+  "main": "dist/esm/index.js",
+  "module": "dist/esm/index.js",
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "@ant-design/cssinjs": "^1.24.0",
+    "antd": "^5.27.0",
+    "classnames": "^2.5.1",
+    "lodash-es": "^4.17.21",
+    "@akinon/icons": "1.2.1",
+    "@akinon/ui-input": "1.2.1",
+    "@akinon/ui-modal": "1.2.1",
+    "@akinon/ui-button": "1.4.2",
+    "@akinon/ui-pagination": "1.4.2",
+    "@akinon/ui-select": "1.4.2",
+    "@akinon/ui-theme": "1.2.1",
+    "@akinon/akilocale": "1.2.1",
+    "@akinon/ui-ai-spinner": "1.0.2",
+    "@akinon/ui-layout": "1.7.2"
+  },
+  "devDependencies": {
+    "@types/lodash-es": "^4.17.12",
+    "clean-package": "2.2.0",
+    "copyfiles": "^2.4.1",
+    "rimraf": "^5.0.5",
+    "typescript": "*",
+    "@akinon/typescript-config": "1.1.1",
+    "@akinon/vitest-config": "1.1.1"
+  },
+  "peerDependencies": {
+    "react": "^18 || ^19",
+    "react-dom": "^18 || ^19"
+  },
+  "clean-package": "../../../clean-package.config.json",
+  "types": "dist/esm/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/esm/index.d.ts",
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "scripts": {
+    "build": "pnpm run build:esm && pnpm run build:commonjs && pnpm run copy:files",
+    "build:commonjs": "tsc --module commonjs --outDir dist/cjs",
+    "build:esm": "tsc --outDir dist/esm",
+    "clean": "rimraf dist/",
+    "copy:files": "copyfiles -u 1 \"src/**/*.!(ts|tsx)\" dist/esm && copyfiles -u 1 \"src/**/*.!(ts|tsx)\" dist/cjs",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest",
+    "test:coverage": "vitest run --coverage"
+  }
+}