awing-library 2.1.2-dev.98 → 2.1.2-preview.1

package/dist/AWING/DirectoryPermission/components/SchemaRow.js

@@ -0,0 +1,169 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Box, Checkbox, CircularProgress, IconButton, TableCell, TableRow, Typography } from "@mui/material";
+import { Clear, ExpandLess, ExpandMore } from "@mui/icons-material";
+import { Constants, OBJECT_TYPE_CODE_NONE } from "../constants.js";
+import { rootSchemasState } from "../Atoms.js";
+import StatePicker from "./StatePicker.js";
+import { useAtomValue } from "jotai";
+import SchemaDetail from "./SchemaDetail.js";
+import { useGetDirectoryContext } from "../context.js";
+function Container(props) {
+    const { index, schemas, schemaId, onChangePermission, disableSelectSchema, onDeleteSchema, inheritedPermissions, explicitPermission, workflow, onChangeStates, objectTypeCodeSelected } = props;
+    const rootSchemas = useAtomValue(rootSchemasState);
+    const inherit = inheritedPermissions?.find((i)=>i.schemaId === explicitPermission.schemaId);
+    const iPermissions = inherit?.permissions || [];
+    const iWorkflowStateIds = inherit?.workflowStateIds || [];
+    const ePermissions = explicitPermission.permissions;
+    const eWorkflowStateIds = explicitPermission.workflowStateIds;
+    const { services, isCampaignPermissions } = useGetDirectoryContext();
+    const [typeDefinitions, setTypeDefinitions] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const [open, setOpen] = useState(false);
+    const handleOpen = ()=>{
+        setOpen(!open);
+        setLoading(true);
+        objectTypeCodeSelected && objectTypeCodeSelected !== OBJECT_TYPE_CODE_NONE && services?.getSchemaDetails && services.getSchemaDetails({
+            objectTypeCode: objectTypeCodeSelected
+        }).then((schemas)=>{
+            const typeDefinitions = schemas.flatMap((s)=>s.schemaObjectDefinitions ?? []).map((d)=>({
+                    ...d.typeDefinition,
+                    fieldPath: d.fieldPath,
+                    isReadOnly: d.isReadOnly
+                }));
+            setTypeDefinitions(typeDefinitions);
+        }).finally(()=>setLoading(false));
+    };
+    const handleChangeStates = (stateId)=>{
+        onChangeStates(stateId, schemaId);
+    };
+    return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            /*#__PURE__*/ jsxs(TableRow, {
+                style: {
+                    borderBottom: 'none'
+                },
+                children: [
+                    /*#__PURE__*/ jsx(TableCell, {
+                        sx: {
+                            fontWeight: '500',
+                            minWidth: '160px',
+                            borderBottom: open ? 'none' : '',
+                            cursor: 'pointer'
+                        },
+                        onClick: handleOpen,
+                        children: /*#__PURE__*/ jsxs(Box, {
+                            style: {
+                                display: 'flex',
+                                flexDirection: 'row',
+                                alignItems: 'center'
+                            },
+                            children: [
+                                isCampaignPermissions ? null : open ? /*#__PURE__*/ jsx(ExpandLess, {
+                                    sx: {
+                                        marginRight: 0.5
+                                    }
+                                }) : /*#__PURE__*/ jsx(ExpandMore, {
+                                    sx: {
+                                        marginRight: 0.5
+                                    }
+                                }),
+                                /*#__PURE__*/ jsx(Typography, {
+                                    variant: "body1",
+                                    sx: {
+                                        fontWeight: 'bold'
+                                    },
+                                    children: ([
+                                        ...rootSchemas,
+                                        ...schemas
+                                    ].find((s)=>s.id === schemaId) || {
+                                        name: 'Default'
+                                    }).name
+                                })
+                            ]
+                        })
+                    }),
+                    Object.values(Constants.PERMISSION_CODE).map((code)=>/*#__PURE__*/ jsxs(TableCell, {
+                            padding: "checkbox",
+                            style: {
+                                width: '160px',
+                                minWidth: '100px',
+                                borderBottom: open ? 'none' : ''
+                            },
+                            children: [
+                                /*#__PURE__*/ jsx(Checkbox, {
+                                    disabled: true,
+                                    color: "primary",
+                                    checked: -1 !== iPermissions.indexOf(code),
+                                    value: code
+                                }),
+                                /*#__PURE__*/ jsx(Checkbox, {
+                                    color: "primary",
+                                    checked: -1 !== ePermissions.indexOf(code),
+                                    onChange: ()=>{
+                                        onChangePermission(code, schemaId);
+                                    },
+                                    value: code
+                                })
+                            ]
+                        }, `per_${code}`)),
+                    /*#__PURE__*/ jsx(TableCell, {
+                        style: {
+                            borderBottom: open ? 'none' : ''
+                        },
+                        children: /*#__PURE__*/ jsx(Box, {
+                            sx: {
+                                display: 'flex',
+                                justifyContent: 'flex-end',
+                                alignItems: 'center',
+                                height: '100%'
+                            },
+                            children: disableSelectSchema ? /*#__PURE__*/ jsx(Clear, {
+                                color: "action",
+                                sx: {
+                                    opacity: '0',
+                                    margin: 1
+                                }
+                            }) : /*#__PURE__*/ jsx(IconButton, {
+                                onClick: ()=>{
+                                    onDeleteSchema(schemaId);
+                                },
+                                children: /*#__PURE__*/ jsx(Clear, {
+                                    color: "action"
+                                })
+                            })
+                        })
+                    })
+                ]
+            }, index),
+            workflow && open && /*#__PURE__*/ jsx(TableRow, {
+                children: /*#__PURE__*/ jsx(TableCell, {
+                    colSpan: 8,
+                    children: workflow?.workflowStates?.filter((w)=>!w.parentId).map((state)=>/*#__PURE__*/ jsx(StatePicker, {
+                            rootState: state,
+                            states: workflow.workflowStates ?? [],
+                            iWorkflowStateIds: iWorkflowStateIds,
+                            eWorkflowStateIds: eWorkflowStateIds,
+                            onChangeStates: handleChangeStates
+                        }, `state_${state.id}`))
+                })
+            }),
+            open && schemas.map((schema)=>/*#__PURE__*/ jsx(TableRow, {
+                    children: loading ? /*#__PURE__*/ jsx(CircularProgress, {
+                        size: 20
+                    }) : /*#__PURE__*/ jsx(TableCell, {
+                        colSpan: 8,
+                        children: /*#__PURE__*/ jsx(SchemaDetail, {
+                            id: `SchemaView_${schema.id}`,
+                            objectDefinitions: typeDefinitions,
+                            schema: schema,
+                            selectedSchemaIds: [
+                                schemaId ?? 0
+                            ]
+                        })
+                    })
+                }, `schema_view_row_${schema.id}`))
+        ]
+    });
+}
+export { Container as default };

package/dist/AWING/DirectoryPermission/components/StatePicker.d.ts

@@ -0,0 +1,10 @@
+import { WorkflowState } from '../types';
+export type OwnProps = {
+    rootState: WorkflowState;
+    states: WorkflowState[];
+    iWorkflowStateIds: string[];
+    eWorkflowStateIds: string[];
+    onChangeStates: (stateId: string) => void;
+};
+export default function StatePicker(props: OwnProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StatePicker.d.ts.map

package/dist/AWING/DirectoryPermission/components/StatePicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatePicker.d.ts","sourceRoot":"","sources":["../../../../src/AWING/DirectoryPermission/components/StatePicker.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAGzC,MAAM,MAAM,QAAQ,GAAG;IACnB,SAAS,EAAE,aAAa,CAAC;IACzB,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,iBAAiB,EAAE,MAAM,EAAE,CAAC;IAC5B,iBAAiB,EAAE,MAAM,EAAE,CAAC;IAC5B,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CAC7C,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAAK,EAAE,QAAQ,2CAqElD"}

package/dist/AWING/DirectoryPermission/components/StatePicker.js

@@ -0,0 +1,72 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { SimpleTreeView, TreeItem } from "@mui/x-tree-view";
+import { ChevronRight, ExpandLess } from "@mui/icons-material";
+import { Box, Checkbox, Typography } from "@mui/material";
+import StatePickerItem from "./StatePickerItem.js";
+function StatePicker(props) {
+    const { rootState, states, eWorkflowStateIds, iWorkflowStateIds, onChangeStates } = props;
+    const [expanded, setExpanded] = useState([
+        'root'
+    ]);
+    const handleToggle = (_event, nodeIds)=>{
+        setExpanded(nodeIds);
+    };
+    return /*#__PURE__*/ jsx(SimpleTreeView, {
+        "aria-label": "controlled",
+        slots: {
+            collapseIcon: ExpandLess,
+            expandIcon: ChevronRight
+        },
+        expandedItems: expanded,
+        onExpandedItemsChange: handleToggle,
+        sx: {
+            paddingBottom: 2,
+            marginLeft: 20
+        },
+        disableSelection: true,
+        children: /*#__PURE__*/ jsx(TreeItem, {
+            itemId: 'root',
+            label: /*#__PURE__*/ jsx("div", {
+                style: {
+                    display: 'flex',
+                    flexDirection: 'row',
+                    justifyContent: 'space-between',
+                    alignItems: 'center'
+                },
+                children: /*#__PURE__*/ jsxs(Box, {
+                    sx: {
+                        display: 'flex',
+                        alignItems: 'center'
+                    },
+                    children: [
+                        /*#__PURE__*/ jsx(Checkbox, {
+                            onClick: (e)=>e.stopPropagation(),
+                            checked: iWorkflowStateIds.includes(rootState.id ?? '-1'),
+                            disabled: true
+                        }),
+                        /*#__PURE__*/ jsx(Checkbox, {
+                            onClick: (e)=>e.stopPropagation(),
+                            checked: eWorkflowStateIds.includes(rootState.id ?? '-1'),
+                            onChange: ()=>{
+                                rootState.id && onChangeStates(rootState.id);
+                            }
+                        }),
+                        /*#__PURE__*/ jsx(Typography, {
+                            children: rootState.name
+                        })
+                    ]
+                })
+            }),
+            children: states.filter((s)=>s.parentId === rootState.id).map((child, index)=>/*#__PURE__*/ jsx(StatePickerItem, {
+                    rootState: rootState,
+                    state: child,
+                    states: states,
+                    iWorkflowStateIds: iWorkflowStateIds,
+                    eWorkflowStateIds: eWorkflowStateIds,
+                    onChangeStates: onChangeStates
+                }, index))
+        })
+    });
+}
+export { StatePicker as default };

package/dist/AWING/DirectoryPermission/components/StatePickerItem.d.ts

@@ -0,0 +1,12 @@
+import { WorkflowState } from '../types';
+export type OwnProps = {
+    rootState: WorkflowState;
+    state: WorkflowState;
+    states: WorkflowState[];
+    iWorkflowStateIds: string[];
+    eWorkflowStateIds: string[];
+    onChangeStates: (stateId: string) => void;
+    key?: number;
+};
+export default function StatePickerItem(props: OwnProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=StatePickerItem.d.ts.map

package/dist/AWING/DirectoryPermission/components/StatePickerItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatePickerItem.d.ts","sourceRoot":"","sources":["../../../../src/AWING/DirectoryPermission/components/StatePickerItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,MAAM,MAAM,QAAQ,GAAG;IACnB,SAAS,EAAE,aAAa,CAAC;IACzB,KAAK,EAAE,aAAa,CAAC;IACrB,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,iBAAiB,EAAE,MAAM,EAAE,CAAC;IAC5B,iBAAiB,EAAE,MAAM,EAAE,CAAC;IAC5B,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,GAAG,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,QAAQ,kDAkDtD"}

package/dist/AWING/DirectoryPermission/components/StatePickerItem.js

@@ -0,0 +1,48 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { TreeItem } from "@mui/x-tree-view";
+import { Box, Checkbox, Typography } from "@mui/material";
+function StatePickerItem(props) {
+    const { rootState, state, states, iWorkflowStateIds, eWorkflowStateIds, onChangeStates } = props;
+    return state.id ? /*#__PURE__*/ jsx(TreeItem, {
+        "id-key": state.id,
+        itemId: state.id,
+        label: /*#__PURE__*/ jsxs(Box, {
+            sx: {
+                display: 'flex',
+                alignItems: 'center',
+                marginLeft: 2
+            },
+            "data-testid": "root-label-container",
+            children: [
+                /*#__PURE__*/ jsx(Checkbox, {
+                    onClick: (e)=>e.stopPropagation(),
+                    checked: iWorkflowStateIds.includes(rootState.id ?? '-1') || iWorkflowStateIds.includes(state.id),
+                    disabled: true,
+                    "data-testid": "StatePickerItem-iWorkflowState-Checkbox"
+                }),
+                /*#__PURE__*/ jsx(Checkbox, {
+                    onClick: (e)=>e.stopPropagation(),
+                    checked: eWorkflowStateIds.includes(rootState.id ?? '-1') || eWorkflowStateIds.includes(state.id),
+                    onChange: ()=>{
+                        state.id && onChangeStates(state.id);
+                    },
+                    "data-testid": "StatePickerItem-eWorkflowState-Checkbox"
+                }),
+                /*#__PURE__*/ jsx(Typography, {
+                    "data-testid": "TreeItem-label",
+                    children: state.name
+                })
+            ]
+        }),
+        "data-testid": "StatePickerItem-TreeItem-root",
+        children: states.filter((s)=>s.parentId === state.id).map((s, index)=>/*#__PURE__*/ jsx(StatePickerItem, {
+                rootState: rootState,
+                state: s,
+                states: states,
+                iWorkflowStateIds: iWorkflowStateIds,
+                eWorkflowStateIds: eWorkflowStateIds,
+                onChangeStates: onChangeStates
+            }, index))
+    }) : null;
+}
+export { StatePickerItem as default };

package/dist/AWING/DirectoryPermission/components/TabPermissionStates.d.ts

@@ -0,0 +1,14 @@
+export type TabPermissionStatesProps = {
+    isShow?: boolean;
+    hasBorderBottom?: boolean;
+    style?: React.CSSProperties;
+    tabOptions?: {
+        key?: string;
+        value?: string | number;
+    }[];
+    tabValue?: string;
+    onChangeTab?: (value: string) => void;
+};
+export declare function TabPermissionStates(props: TabPermissionStatesProps): false | import("react/jsx-runtime").JSX.Element;
+export default TabPermissionStates;
+//# sourceMappingURL=TabPermissionStates.d.ts.map

package/dist/AWING/DirectoryPermission/components/TabPermissionStates.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabPermissionStates.d.ts","sourceRoot":"","sources":["../../../../src/AWING/DirectoryPermission/components/TabPermissionStates.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,wBAAwB,GAAG;IACnC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,UAAU,CAAC,EAAE;QAAE,GAAG,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,EAAE,CAAC;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,mDA0BlE;AAED,eAAe,mBAAmB,CAAC"}

package/dist/AWING/DirectoryPermission/components/TabPermissionStates.js

@@ -0,0 +1,26 @@
+import { jsx } from "react/jsx-runtime";
+import { Box, Tab, Tabs } from "@mui/material";
+import { BORDER_LIGHTGRAY } from "../constants.js";
+function TabPermissionStates_TabPermissionStates(props) {
+    const { isShow = false, hasBorderBottom, style, tabValue = '', tabOptions = [], onChangeTab } = props;
+    const handleChangeTab = (_e, newValue)=>onChangeTab && onChangeTab(newValue);
+    return isShow && '' !== tabValue && /*#__PURE__*/ jsx(Box, {
+        sx: {
+            border: hasBorderBottom ? 'none' : BORDER_LIGHTGRAY,
+            borderBottom: hasBorderBottom ? BORDER_LIGHTGRAY : 'none',
+            borderRadius: '4px 4px 0px 0px',
+            width: '100%'
+        },
+        style: style,
+        children: /*#__PURE__*/ jsx(Tabs, {
+            value: tabValue,
+            onChange: handleChangeTab,
+            children: tabOptions.map((o, idx)=>/*#__PURE__*/ jsx(Tab, {
+                    label: o.key,
+                    value: o.value
+                }, idx))
+        })
+    });
+}
+const TabPermissionStates = TabPermissionStates_TabPermissionStates;
+export { TabPermissionStates_TabPermissionStates as TabPermissionStates, TabPermissionStates as default };

package/dist/AWING/DirectoryPermission/components/TableHeader.d.ts

@@ -0,0 +1,8 @@
+import { type HeadCell } from './PermissionTable';
+export type OwnProps = {
+    headCells: HeadCell[];
+};
+export declare const getCellWidth: (id?: string) => "10%" | "5%" | "18%" | "16%";
+declare const TableHeader: (props: OwnProps) => import("react/jsx-runtime").JSX.Element;
+export default TableHeader;
+//# sourceMappingURL=TableHeader.d.ts.map

package/dist/AWING/DirectoryPermission/components/TableHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHeader.d.ts","sourceRoot":"","sources":["../../../../src/AWING/DirectoryPermission/components/TableHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,MAAM,QAAQ,GAAG;IACnB,SAAS,EAAE,QAAQ,EAAE,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,YAAY,QAAS,MAAM,iCAgBvC,CAAC;AAEF,QAAA,MAAM,WAAW,UAAW,QAAQ,4CAmCnC,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/AWING/DirectoryPermission/components/TableHeader.js

@@ -0,0 +1,59 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Grid, TableCell, TableHead, TableRow, Tooltip, Typography } from "@mui/material";
+import { Info } from "@mui/icons-material";
+const getCellWidth = (id)=>{
+    switch(id){
+        case 'stt':
+        case 'authenType':
+            return '5%';
+        case 'authenName':
+            return '18%';
+        case 'readAndExecute':
+        case 'listFolderContents':
+            return '16%';
+        default:
+            return '10%';
+    }
+};
+const TableHeader = (props)=>{
+    const { headCells } = props;
+    return /*#__PURE__*/ jsx(TableHead, {
+        children: /*#__PURE__*/ jsx(TableRow, {
+            sx: {
+                flex: '1 1 100%'
+            },
+            children: headCells.map((headCell, index)=>/*#__PURE__*/ jsx(TableCell, {
+                    sx: (theme)=>({
+                            width: getCellWidth(headCell?.id),
+                            fontWeight: 'bold',
+                            paddingLeft: theme.spacing(1),
+                            paddingRight: theme.spacing(1)
+                        }),
+                    children: /*#__PURE__*/ jsxs(Grid, {
+                        direction: "row",
+                        container: true,
+                        sx: {
+                            alignItems: 'center'
+                        },
+                        children: [
+                            /*#__PURE__*/ jsx(Typography, {
+                                children: headCell.label
+                            }),
+                            headCell?.explain && /*#__PURE__*/ jsx(Tooltip, {
+                                title: headCell.explain,
+                                children: /*#__PURE__*/ jsx(Info, {
+                                    color: "secondary",
+                                    sx: {
+                                        fontSize: '16px',
+                                        margin: 0.2
+                                    }
+                                })
+                            })
+                        ]
+                    })
+                }, index))
+        })
+    });
+};
+const components_TableHeader = TableHeader;
+export { components_TableHeader as default, getCellWidth };

package/dist/AWING/DirectoryPermission/components/ViewPermission/Container.d.ts

@@ -0,0 +1,9 @@
+import { Constants } from '../../constants';
+import type { OwnProps } from './types';
+/** Lấy icon theo loại quyền và hiển thị tooltip tương ứng */
+export declare const getAuthenIcon: (authenType?: string) => import("react/jsx-runtime").JSX.Element;
+/** Kiểm tra quyền và render checked */
+export declare const getCellCheckbox: (permission: number, permissionName: keyof typeof Constants.PERMISSION_CODE) => import("react/jsx-runtime").JSX.Element;
+declare function ViewPermission(props: OwnProps): import("react/jsx-runtime").JSX.Element;
+export default ViewPermission;
+//# sourceMappingURL=Container.d.ts.map

package/dist/AWING/DirectoryPermission/components/ViewPermission/Container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.d.ts","sourceRoot":"","sources":["../../../../../src/AWING/DirectoryPermission/components/ViewPermission/Container.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAG5C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAGxC,6DAA6D;AAC7D,eAAO,MAAM,aAAa,gBAAiB,MAAM,4CAgBhD,CAAC;AAEF,uCAAuC;AACvC,eAAO,MAAM,eAAe,eAAgB,MAAM,kBAAkB,MAAM,OAAO,SAAS,CAAC,eAAe,4CAQzG,CAAC;AAEF,iBAAS,cAAc,CAAC,KAAK,EAAE,QAAQ,2CAuGtC;AAED,eAAe,cAAc,CAAC"}

package/dist/AWING/DirectoryPermission/components/ViewPermission/Container.js

@@ -0,0 +1,143 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { Box, TableRow, Tooltip, Typography } from "@mui/material";
+import { Constants } from "../../constants.js";
+import { ArrowRightAlt, CallSplit, Close, ManageAccounts, People, Person } from "@mui/icons-material";
+import { StyledCheck, StyledTableCell } from "./Styled.js";
+const getAuthenIcon = (authenType)=>{
+    let icon = /*#__PURE__*/ jsx(ManageAccounts, {});
+    switch(authenType){
+        case Constants.AUTHEN_TYPE.USER:
+            icon = /*#__PURE__*/ jsx(Person, {});
+            break;
+        case Constants.AUTHEN_TYPE.GROUP:
+            icon = /*#__PURE__*/ jsx(People, {});
+            break;
+        case Constants.AUTHEN_TYPE.ROLE:
+            icon = /*#__PURE__*/ jsx(ManageAccounts, {});
+            break;
+    }
+    return /*#__PURE__*/ jsx(Tooltip, {
+        title: /*#__PURE__*/ jsx(Typography, {
+            children: authenType
+        }),
+        children: icon
+    });
+};
+const getCellCheckbox = (permission, permissionName)=>/*#__PURE__*/ jsx(StyledTableCell, {
+        style: {
+            textAlign: 'left'
+        },
+        children: (permission & Constants.PERMISSION_CODE[permissionName]) === Constants.PERMISSION_CODE[permissionName] ? /*#__PURE__*/ jsx(StyledCheck, {
+            color: "primary"
+        }) : null
+    });
+function ViewPermission(props) {
+    const { permission, index, onEdit, onDelete } = props;
+    const { t } = useTranslation();
+    const handleDelete = (event, permission)=>{
+        event.stopPropagation();
+        onDelete && onDelete(permission);
+    };
+    return /*#__PURE__*/ jsxs(TableRow, {
+        hover: true,
+        tabIndex: -1,
+        sx: (theme)=>({
+                padding: theme.spacing(1.7, 2),
+                borderBottom: '1px solid #a3a3a345',
+                '&.MuiTableRow-root.MuiTableRow-hover:hover': {
+                    cursor: "pointer",
+                    '& .isShowIcon': {
+                        visibility: 'visible'
+                    }
+                },
+                maxWidth: '300px',
+                wordBreak: 'break-all',
+                cursor: 'pointer'
+            }),
+        onClick: ()=>onEdit(permission.authenValue, permission.authenType),
+        children: [
+            /*#__PURE__*/ jsx(StyledTableCell, {
+                children: index + 1
+            }),
+            /*#__PURE__*/ jsx(StyledTableCell, {
+                children: getAuthenIcon(permission.authenType)
+            }),
+            /*#__PURE__*/ jsx(StyledTableCell, {
+                children: permission.name
+            }),
+            getCellCheckbox(permission.permission, 'FULL_CONTROL'),
+            getCellCheckbox(permission.permission, 'MODIFY'),
+            getCellCheckbox(permission.permission, 'WRITE'),
+            getCellCheckbox(permission.permission, 'READ_AND_EXECUTE'),
+            getCellCheckbox(permission.permission, 'READ'),
+            getCellCheckbox(permission.permission, 'LIST_FOLDER_CONTENTS'),
+            /*#__PURE__*/ jsx(StyledTableCell, {
+                sx: {
+                    width: 20,
+                    padding: "0px",
+                    position: 'relative',
+                    textAlign: 'end'
+                },
+                children: /*#__PURE__*/ jsxs("div", {
+                    style: {
+                        display: 'flex',
+                        justifyContent: 'flex-end'
+                    },
+                    children: [
+                        permission.matrices?.length ? /*#__PURE__*/ jsx(Tooltip, {
+                            title: /*#__PURE__*/ jsx(Box, {
+                                children: permission.matrices.map((matrix)=>/*#__PURE__*/ jsxs(Box, {
+                                        sx: {
+                                            display: 'flex',
+                                            flexDirection: 'row'
+                                        },
+                                        children: [
+                                            /*#__PURE__*/ jsx(Typography, {
+                                                children: matrix.stateStartNavigation?.name
+                                            }),
+                                            /*#__PURE__*/ jsx(ArrowRightAlt, {
+                                                sx: {
+                                                    margin: '0px 8px'
+                                                }
+                                            }),
+                                            /*#__PURE__*/ jsx(Typography, {
+                                                children: matrix.stateEndNavigation?.name
+                                            })
+                                        ]
+                                    }, `per_${matrix.stateStartNavigation?.id}_${matrix.stateEndNavigation?.id}`))
+                            }),
+                            children: /*#__PURE__*/ jsx(CallSplit, {
+                                sx: {
+                                    margin: '0px 16px'
+                                },
+                                onClick: (event)=>event.stopPropagation()
+                            })
+                        }) : null,
+                        permission.canDelete ? /*#__PURE__*/ jsx(Tooltip, {
+                            sx: {
+                                backgroundColor: '#ffffff',
+                                color: '#212121',
+                                borderRadius: 0,
+                                border: '1px solid rgba(0, 0, 0, 0.23)',
+                                fontSize: '11px',
+                                fontWeight: 'normal'
+                            },
+                            title: t('Common.Delete'),
+                            children: /*#__PURE__*/ jsx(Close, {
+                                className: "isShowIcon",
+                                sx: {
+                                    marginRight: 2,
+                                    visibility: 'hidden'
+                                },
+                                onClick: (event)=>handleDelete(event, permission)
+                            })
+                        }) : null
+                    ]
+                })
+            })
+        ]
+    }, index);
+}
+const Container = ViewPermission;
+export { Container as default, getAuthenIcon, getCellCheckbox };

package/dist/AWING/DirectoryPermission/components/ViewPermission/Styled.d.ts

@@ -0,0 +1,3 @@
+export declare const StyledCheck: import("@emotion/styled").StyledComponent<import("@mui/material").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").SVGProps<SVGSVGElement>, "className" | "style" | "classes" | "children" | "sx" | "color" | "fontSize" | "shapeRendering" | "htmlColor" | "inheritViewBox" | "titleAccess" | "viewBox"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const StyledTableCell: import("@emotion/styled").StyledComponent<import("@mui/material").TableCellProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+//# sourceMappingURL=Styled.d.ts.map

package/dist/AWING/DirectoryPermission/components/ViewPermission/Styled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styled.d.ts","sourceRoot":"","sources":["../../../../../src/AWING/DirectoryPermission/components/ViewPermission/Styled.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,WAAW,ibAA8C,CAAC;AAEvE,eAAO,MAAM,eAAe,uKAa1B,CAAC"}

package/dist/AWING/DirectoryPermission/components/ViewPermission/Styled.js

@@ -0,0 +1,19 @@
+import { TableCell } from "@mui/material";
+import { Check } from "@mui/icons-material";
+import { styled } from "@mui/material/styles";
+const StyledCheck = styled(Check)(()=>({
+        fontSize: '22px'
+    }));
+const StyledTableCell = styled(TableCell)(({ theme })=>({
+        padding: theme.spacing(1.7, 2),
+        borderBottom: '1px solid #a3a3a345',
+        '&.MuiTableRow-root.MuiTableRow-hover:hover': {
+            cursor: "pointer",
+            '& .isShowIcon': {
+                visibility: 'visible'
+            }
+        },
+        maxWidth: '300px',
+        wordBreak: 'break-all'
+    }));
+export { StyledCheck, StyledTableCell };

package/dist/AWING/DirectoryPermission/components/ViewPermission/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './Container';
+export * from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/AWING/DirectoryPermission/components/ViewPermission/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/AWING/DirectoryPermission/components/ViewPermission/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,cAAc,SAAS,CAAC"}

package/dist/AWING/DirectoryPermission/components/ViewPermission/index.js

@@ -0,0 +1,3 @@
+import Container from "./Container.js";
+export * from "./types.js";
+export { Container as default };

package/dist/AWING/DirectoryPermission/components/ViewPermission/types.d.ts

@@ -0,0 +1,8 @@
+import { PermissionView } from '../../types';
+export type OwnProps = {
+    permission: PermissionView;
+    index: number;
+    onEdit: (authenValue: PermissionView['authenValue'], authenType: PermissionView['authenType']) => void;
+    onDelete: (permission: PermissionView) => void;
+};
+//# sourceMappingURL=types.d.ts.map