pixel-react 1.9.5 → 1.9.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.yarn/install-state.gz +0 -0
- package/lib/ComponentProps/TreeNodeProps.d.ts +31 -0
- package/lib/components/TableTree/Components/TableBody.d.ts +1 -1
- package/lib/components/TableTree/types.d.ts +2 -30
- package/lib/index.d.ts +13 -69
- package/lib/index.esm.js +7 -8
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +7 -8
- package/lib/index.js.map +1 -1
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/lib/utils/getTreeDetails/getTreeDetails.d.ts +1 -29
- package/lib/utils/handleTreeNodeSelect/handleTreeNodeSelect.d.ts +1 -30
- package/package.json +1 -1
- package/src/ComponentProps/TreeNodeProps.ts +31 -0
- package/src/components/TableTree/Components/TableBody.tsx +22 -20
- package/src/components/TableTree/Components/TableCell.tsx +3 -3
- package/src/components/TableTree/Components/TableRow.tsx +0 -3
- package/src/components/TableTree/TableTree.tsx +5 -3
- package/src/components/TableTree/types.ts +2 -31
- package/src/index.ts +7 -0
- package/src/utils/getTreeDetails/getTreeDetails.ts +1 -29
- package/src/utils/handleTreeNodeSelect/handleTreeNodeSelect.ts +1 -30
package/.yarn/install-state.gz
CHANGED
Binary file
|
@@ -0,0 +1,31 @@
|
|
1
|
+
export type TreeNodeProps = {
|
2
|
+
createdBy: string;
|
3
|
+
modifiedBy: string;
|
4
|
+
createdByUname: string;
|
5
|
+
modifiedByUname: string;
|
6
|
+
createdOn: string;
|
7
|
+
modifiedOn: string;
|
8
|
+
state: string;
|
9
|
+
path: string;
|
10
|
+
searchKey: string;
|
11
|
+
key: string;
|
12
|
+
name: string;
|
13
|
+
projectId: string;
|
14
|
+
hierarchy: number;
|
15
|
+
executionOrder: number;
|
16
|
+
subContainerCount: number;
|
17
|
+
resourceCount: number;
|
18
|
+
totalSubContainerCount: number;
|
19
|
+
totalResourceCount: number;
|
20
|
+
totalProjectElementCount: number;
|
21
|
+
totalSharedElementCount: number;
|
22
|
+
container: boolean;
|
23
|
+
localDelete: boolean;
|
24
|
+
defaultEntity: boolean;
|
25
|
+
lastResource: boolean;
|
26
|
+
platform?: string;
|
27
|
+
parentId?: string;
|
28
|
+
parentName?: string;
|
29
|
+
checked?: boolean | 'partial';
|
30
|
+
expand?: boolean;
|
31
|
+
};
|
@@ -1,4 +1,4 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { TableBodyProps } from '../types';
|
3
|
-
declare const TableBody: React.MemoExoticComponent<({ flattenedTreeData, columnsData, selected, select, onRowClick, onToggleExpand, onCheckBoxChange, }: TableBodyProps) => import("react/jsx-runtime").JSX.Element>;
|
3
|
+
declare const TableBody: React.MemoExoticComponent<({ flattenedTreeData, columnsData, selected, select, onRowClick, onToggleExpand, onCheckBoxChange, }: TableBodyProps) => import("react/jsx-runtime").JSX.Element | null>;
|
4
4
|
export default TableBody;
|
@@ -1,33 +1,5 @@
|
|
1
1
|
import { ReactNode } from 'react';
|
2
|
-
|
3
|
-
createdBy: string;
|
4
|
-
modifiedBy: string;
|
5
|
-
createdByUname: string;
|
6
|
-
modifiedByUname: string;
|
7
|
-
createdOn: string;
|
8
|
-
modifiedOn: string;
|
9
|
-
state: string;
|
10
|
-
path: string;
|
11
|
-
searchKey: string;
|
12
|
-
key: string;
|
13
|
-
name: string;
|
14
|
-
projectId: string;
|
15
|
-
hierarchy: number;
|
16
|
-
executionOrder: number;
|
17
|
-
subContainerCount: number;
|
18
|
-
resourceCount: number;
|
19
|
-
totalSubContainerCount: number;
|
20
|
-
totalResourceCount: number;
|
21
|
-
totalProjectElementCount: number;
|
22
|
-
totalSharedElementCount: number;
|
23
|
-
container: boolean;
|
24
|
-
localDelete: boolean;
|
25
|
-
defaultEntity: boolean;
|
26
|
-
lastResource: boolean;
|
27
|
-
platform: string;
|
28
|
-
parentId?: string;
|
29
|
-
parentName?: string;
|
30
|
-
}
|
2
|
+
import { TreeNodeProps as TreeNode } from '../../ComponentProps/TreeNodeProps';
|
31
3
|
declare type JSX = ReactNode | JSX.Element[] | string | null;
|
32
4
|
export interface TableCellProps {
|
33
5
|
col: any;
|
@@ -76,7 +48,7 @@ export interface TreeTableProps {
|
|
76
48
|
select?: 'radio' | 'checkbox' | 'none';
|
77
49
|
onChange?: (e: any, node: string[] | any) => void;
|
78
50
|
onClick?: (e: React.MouseEvent<HTMLDivElement>, row: TreeNode) => void;
|
79
|
-
onExpand?: (
|
51
|
+
onExpand?: (node: TreeNode) => void;
|
80
52
|
loadMore?: (_direction?: string) => void;
|
81
53
|
height?: number | string;
|
82
54
|
}
|
package/lib/index.d.ts
CHANGED
@@ -1711,7 +1711,7 @@ interface MiniEditModalProps {
|
|
1711
1711
|
|
1712
1712
|
declare const MiniModal: React$1.ForwardRefExoticComponent<MiniEditModalProps & React$1.RefAttributes<HTMLDivElement>>;
|
1713
1713
|
|
1714
|
-
|
1714
|
+
type TreeNodeProps = {
|
1715
1715
|
createdBy: string;
|
1716
1716
|
modifiedBy: string;
|
1717
1717
|
createdByUname: string;
|
@@ -1736,10 +1736,13 @@ interface TreeNode$2 {
|
|
1736
1736
|
localDelete: boolean;
|
1737
1737
|
defaultEntity: boolean;
|
1738
1738
|
lastResource: boolean;
|
1739
|
-
platform
|
1739
|
+
platform?: string;
|
1740
1740
|
parentId?: string;
|
1741
1741
|
parentName?: string;
|
1742
|
-
|
1742
|
+
checked?: boolean | 'partial';
|
1743
|
+
expand?: boolean;
|
1744
|
+
};
|
1745
|
+
|
1743
1746
|
declare type JSX$1 = ReactNode | JSX$1.Element[] | string | null;
|
1744
1747
|
interface Column {
|
1745
1748
|
name: string;
|
@@ -1758,8 +1761,8 @@ interface TreeTableProps {
|
|
1758
1761
|
selected?: string[];
|
1759
1762
|
select?: 'radio' | 'checkbox' | 'none';
|
1760
1763
|
onChange?: (e: any, node: string[] | any) => void;
|
1761
|
-
onClick?: (e: React.MouseEvent<HTMLDivElement>, row:
|
1762
|
-
onExpand?: (
|
1764
|
+
onClick?: (e: React.MouseEvent<HTMLDivElement>, row: TreeNodeProps) => void;
|
1765
|
+
onExpand?: (node: TreeNodeProps) => void;
|
1763
1766
|
loadMore?: (_direction?: string) => void;
|
1764
1767
|
height?: number | string;
|
1765
1768
|
}
|
@@ -3306,76 +3309,17 @@ declare const useKeyboardActions: (actions: KeyboardAction[]) => void;
|
|
3306
3309
|
|
3307
3310
|
declare const rearrangeDragItem: (initialArray: any[], oldIndex: number, newIndex: number) => any[];
|
3308
3311
|
|
3309
|
-
interface TreeNode$1 {
|
3310
|
-
createdBy: string;
|
3311
|
-
modifiedBy: string;
|
3312
|
-
createdByUname: string;
|
3313
|
-
modifiedByUname: string;
|
3314
|
-
createdOn: string;
|
3315
|
-
modifiedOn: string;
|
3316
|
-
state: string;
|
3317
|
-
path: string;
|
3318
|
-
searchKey: string;
|
3319
|
-
key: string;
|
3320
|
-
name: string;
|
3321
|
-
projectId: string;
|
3322
|
-
hierarchy: number;
|
3323
|
-
executionOrder: number;
|
3324
|
-
subContainerCount: number;
|
3325
|
-
resourceCount: number;
|
3326
|
-
totalSubContainerCount: number;
|
3327
|
-
totalResourceCount: number;
|
3328
|
-
totalProjectElementCount: number;
|
3329
|
-
totalSharedElementCount: number;
|
3330
|
-
container: boolean;
|
3331
|
-
localDelete: boolean;
|
3332
|
-
defaultEntity: boolean;
|
3333
|
-
lastResource: boolean;
|
3334
|
-
platform: string;
|
3335
|
-
parentId?: string;
|
3336
|
-
parentName?: string;
|
3337
|
-
}
|
3338
3312
|
interface TreeDetailsResult {
|
3339
|
-
treeDataList:
|
3313
|
+
treeDataList: TreeNodeProps[];
|
3340
3314
|
next: boolean;
|
3341
3315
|
previous: boolean;
|
3342
3316
|
startId: string;
|
3343
3317
|
endId: string;
|
3344
|
-
root?:
|
3318
|
+
root?: TreeNodeProps;
|
3345
3319
|
}
|
3346
|
-
declare const getTreeDetails: (action: "above" | "below" | "expand" | "collapse" | "start", oldData:
|
3320
|
+
declare const getTreeDetails: (action: "above" | "below" | "expand" | "collapse" | "start", oldData: TreeNodeProps[], newData: TreeNodeProps[], index?: number) => TreeDetailsResult;
|
3347
3321
|
|
3348
|
-
|
3349
|
-
createdBy: string;
|
3350
|
-
modifiedBy: string;
|
3351
|
-
createdByUname: string;
|
3352
|
-
modifiedByUname: string;
|
3353
|
-
createdOn: string;
|
3354
|
-
modifiedOn: string;
|
3355
|
-
state: string;
|
3356
|
-
path: string;
|
3357
|
-
searchKey: string;
|
3358
|
-
key: string;
|
3359
|
-
name: string;
|
3360
|
-
projectId: string;
|
3361
|
-
hierarchy: number;
|
3362
|
-
executionOrder: number;
|
3363
|
-
subContainerCount: number;
|
3364
|
-
resourceCount: number;
|
3365
|
-
totalSubContainerCount: number;
|
3366
|
-
totalResourceCount: number;
|
3367
|
-
totalProjectElementCount: number;
|
3368
|
-
totalSharedElementCount: number;
|
3369
|
-
container: boolean;
|
3370
|
-
localDelete: boolean;
|
3371
|
-
defaultEntity: boolean;
|
3372
|
-
lastResource: boolean;
|
3373
|
-
platform?: string;
|
3374
|
-
parentId?: string;
|
3375
|
-
parentName?: string;
|
3376
|
-
checked?: boolean | 'partial';
|
3377
|
-
};
|
3378
|
-
declare const handleTreeNodeSect: (data: TreeNode[], key: string, isChecked: boolean | "partial") => TreeNode[];
|
3322
|
+
declare const handleTreeNodeSect: (data: TreeNodeProps[], key: string, isChecked: boolean | "partial") => TreeNodeProps[];
|
3379
3323
|
|
3380
3324
|
declare const EMAIL_REGEX: RegExp;
|
3381
3325
|
declare const URL_REGEX: RegExp;
|
@@ -3436,4 +3380,4 @@ declare const PARAMETER_ALPHANUMERIC_REGEX: RegExp;
|
|
3436
3380
|
declare function saveToIndexedDB(key: string, value: string): Promise<void>;
|
3437
3381
|
declare function getFromIndexedDB(key: string): Promise<string | null>;
|
3438
3382
|
|
3439
|
-
export { AADHAAR_REGEX, ALPHABET_ONLY_REGEX, ALPHANUMERIC_REGEX, ALPHANUMERIC_WITH_ROUND_BRACES_REGEX, Accordion, AddButton as AddResourceButton, AllProjectsDropdown, AppHeader, AttachImage, AttachmentButton, Avatar, BASE64_REGEX, BINARY_NUMBER_REGEX, BarChart, Button, CREDIT_CARD_REGEX, CURRENCY_GENERIC_REGEX, Checkbox, Chip, ChooseFile, Col, Comments, ConditionalDropdown, ConnectingBranch, Container, CreateVariableSlider, DATE_REGEX, DECIMAL_NUMBER_REGEX, DRIVING_LICENSE_REGEX, DashboardDonutChart, CustomDatePicker as DatePicker, DonutChart, DownloadClient, DragAndDrop, Drawer, Dropzone, ELEMENTS_TRAILING_SPACE_REGEX, ELEMENTS_WHITE_SPACE_REGEX, EMAIL_REGEX, EditTextField, Editor, ExcelFile as Excel, ExpandableMenu, FILE_EXTENSION_REGEX, FILE_NAME_REGEX, FieldSet, FileDropzone, FilePreview, ForwardedForms as Form, formatString as FormatString, GSTIN_REGEX, HEXADECIMAL_NUMBER_REGEX, HEX_COLOR_REGEX, HSL_COLOR_REGEX, HTML_ATTRIBUTE_REGEX, HTML_TAG_REGEX, HighlightText, INDIAN_CURRENCY_REGEX, INDIAN_PASSPORT_REGEX, INDIAN_PHONE_REGEX, INDIAN_PIN_CODE_REGEX, INTERNATIONAL_PHONE_REGEX, IPV4_REGEX, IPV6_REGEX, Icon, IconButton, IconRadialChart, IconRadioGroup, Input, InputWithDropdown, LINKEDIN_PROFILE_REGEX, LabelEditTextField, LineChart, MAC_ADDRESS_REGEX, MEMORY_VALIDATION_REGEX, MachineInputField, MenuOption, MiniModal, MobileSkin, Modal, ModuleChip, MultiRadialChart, MultiSelect, NlpInput as NLPInput, NLP_DESCRIPTION_REGEX, NUMBERS_ONLY_REGEX, NUMBER_REGEX, PAN_CARD_REGEX, PARAMETER_ALPHANUMERIC_REGEX, PASSWORD_COMPLEX_REGEX, PASSWORD_SIMPLE_REGEX, PHONE_REGEX, POSTAL_CODE_REGEX, Paper, PhoneInputField, PieChart, PopUpModal, ProgressBar, RGB_COLOR_REGEX, ROMAN_NUMERALS_REGEX, RadialChart, RadioButton, RadioGroup, Recaptcha, Row, SSN_REGEX, STEP_GROUP_NAME_REGEX, ScriptSwitchButton, Search, Select, SequentialConnectingBranch, StateDropdown, StatusButton, StatusCard, TIME_REGEX, TWITTER_HANDLE_REGEX, Table, _default as TableTree, TableWithAccordion, Tabs, Textarea as TextArea, ThemeProvider, Toaster, Toastify, Toggle, ToggleSwitch, Tooltip, Typography, UNIT_REGEX, URL_REGEX, USERNAME_REGEX, USERNAME_SPECIAL_REGEX, US_ZIP_CODE_REGEX, UUID_REGEX, VEHICLE_REGISTRATION_REGEX, VariableDropdown, VariableInput, WHITESPACE_REGEX, capitalize, checkEmpty, compareArrays, compareObjects, debounce, ffid, findAndInsert, getEncryptedData, getExtension, getExtensionWithPeriod, getFromIndexedDB, getSequentialPayload, getTreeDetails, handleTreeNodeSect, hasDuplicateFile, rearrangeDragItem, saveFileFromBlob, saveToIndexedDB, throttle, toast, truncateText, useClickOutside, useFileDropzone, useKeyboardActions, useTheme };
|
3383
|
+
export { AADHAAR_REGEX, ALPHABET_ONLY_REGEX, ALPHANUMERIC_REGEX, ALPHANUMERIC_WITH_ROUND_BRACES_REGEX, Accordion, AddButton as AddResourceButton, AllProjectsDropdown, AppHeader, AttachImage, AttachmentButton, Avatar, BASE64_REGEX, BINARY_NUMBER_REGEX, BarChart, Button, CREDIT_CARD_REGEX, CURRENCY_GENERIC_REGEX, Checkbox, Chip, ChooseFile, Col, Comments, ConditionalDropdown, ConnectingBranch, Container, CreateVariableSlider, DATE_REGEX, DECIMAL_NUMBER_REGEX, DRIVING_LICENSE_REGEX, DashboardDonutChart, CustomDatePicker as DatePicker, DonutChart, DownloadClient, DragAndDrop, Drawer, Dropzone, ELEMENTS_TRAILING_SPACE_REGEX, ELEMENTS_WHITE_SPACE_REGEX, EMAIL_REGEX, EditTextField, Editor, ExcelFile as Excel, ExpandableMenu, FILE_EXTENSION_REGEX, FILE_NAME_REGEX, FieldSet, FileDropzone, FilePreview, ForwardedForms as Form, formatString as FormatString, GSTIN_REGEX, HEXADECIMAL_NUMBER_REGEX, HEX_COLOR_REGEX, HSL_COLOR_REGEX, HTML_ATTRIBUTE_REGEX, HTML_TAG_REGEX, HighlightText, INDIAN_CURRENCY_REGEX, INDIAN_PASSPORT_REGEX, INDIAN_PHONE_REGEX, INDIAN_PIN_CODE_REGEX, INTERNATIONAL_PHONE_REGEX, IPV4_REGEX, IPV6_REGEX, Icon, IconButton, IconRadialChart, IconRadioGroup, Input, InputWithDropdown, LINKEDIN_PROFILE_REGEX, LabelEditTextField, LineChart, MAC_ADDRESS_REGEX, MEMORY_VALIDATION_REGEX, MachineInputField, MenuOption, MiniModal, MobileSkin, Modal, ModuleChip, MultiRadialChart, MultiSelect, NlpInput as NLPInput, NLP_DESCRIPTION_REGEX, NUMBERS_ONLY_REGEX, NUMBER_REGEX, PAN_CARD_REGEX, PARAMETER_ALPHANUMERIC_REGEX, PASSWORD_COMPLEX_REGEX, PASSWORD_SIMPLE_REGEX, PHONE_REGEX, POSTAL_CODE_REGEX, Paper, PhoneInputField, PieChart, PopUpModal, ProgressBar, RGB_COLOR_REGEX, ROMAN_NUMERALS_REGEX, RadialChart, RadioButton, RadioGroup, Recaptcha, Row, SSN_REGEX, STEP_GROUP_NAME_REGEX, ScriptSwitchButton, Search, Select, SequentialConnectingBranch, StateDropdown, StatusButton, StatusCard, TIME_REGEX, TWITTER_HANDLE_REGEX, Table, _default as TableTree, TableWithAccordion, Tabs, Textarea as TextArea, ThemeProvider, Toaster, Toastify, Toggle, ToggleSwitch, Tooltip, type TreeNodeProps, Typography, UNIT_REGEX, URL_REGEX, USERNAME_REGEX, USERNAME_SPECIAL_REGEX, US_ZIP_CODE_REGEX, UUID_REGEX, VEHICLE_REGISTRATION_REGEX, VariableDropdown, VariableInput, WHITESPACE_REGEX, capitalize, checkEmpty, compareArrays, compareObjects, debounce, ffid, findAndInsert, getEncryptedData, getExtension, getExtensionWithPeriod, getFromIndexedDB, getSequentialPayload, getTreeDetails, handleTreeNodeSect, hasDuplicateFile, rearrangeDragItem, saveFileFromBlob, saveToIndexedDB, throttle, toast, truncateText, useClickOutside, useFileDropzone, useKeyboardActions, useTheme };
|
package/lib/index.esm.js
CHANGED
@@ -14427,9 +14427,9 @@ const TableCell = /*#__PURE__*/React__default.memo(({
|
|
14427
14427
|
children: [col.isTree && renderSpaces(node.hierarchy + 1, node.parentSiblings, node.last), jsxs("div", {
|
14428
14428
|
className: "tree-title-container",
|
14429
14429
|
children: [col.isTree && jsx("span", {
|
14430
|
-
className: `tree-table-space-block last-block ${node.
|
14430
|
+
className: `tree-table-space-block last-block ${node.expand ? 'tree-row-expanded' : 'tree-row-collapsed'} ${node.container ? '' : 'no-folder'}`,
|
14431
14431
|
onClick: () => onToggleExpand(node),
|
14432
|
-
children: node.
|
14432
|
+
children: node.container && node?.totalResourceCount > 0 && jsx(SvgArrowsDownIcon, {})
|
14433
14433
|
}), jsxs("span", {
|
14434
14434
|
className: "tree-table-td-content",
|
14435
14435
|
children: [col.isTree && select === 'checkbox' && jsx(Checkbox, {
|
@@ -14450,15 +14450,12 @@ const TableCell = /*#__PURE__*/React__default.memo(({
|
|
14450
14450
|
|
14451
14451
|
const TableRow = /*#__PURE__*/React__default.memo(({
|
14452
14452
|
node,
|
14453
|
-
// level,
|
14454
14453
|
columnsData,
|
14455
14454
|
selected,
|
14456
14455
|
select,
|
14457
14456
|
onRowClick,
|
14458
14457
|
onToggleExpand,
|
14459
14458
|
onCheckBoxChange
|
14460
|
-
// parentSiblings,
|
14461
|
-
// isLast,
|
14462
14459
|
}) => jsx("tr", {
|
14463
14460
|
"data-level": node.hierarchy,
|
14464
14461
|
className: "show",
|
@@ -14481,7 +14478,7 @@ const TableBody = /*#__PURE__*/React__default.memo(({
|
|
14481
14478
|
onRowClick,
|
14482
14479
|
onToggleExpand,
|
14483
14480
|
onCheckBoxChange
|
14484
|
-
}) => jsxs("tbody", {
|
14481
|
+
}) => checkEmpty(flattenedTreeData) ? null : jsxs("tbody", {
|
14485
14482
|
className: "ff-table-tree-body",
|
14486
14483
|
children: [jsx("tr", {
|
14487
14484
|
id: "ff-table-tree-first-node"
|
@@ -14513,8 +14510,9 @@ const TreeTable = ({
|
|
14513
14510
|
loadMore = () => {},
|
14514
14511
|
height = 'auto'
|
14515
14512
|
}) => {
|
14513
|
+
const treeRef = useRef(null);
|
14516
14514
|
useIntersectionObserver(['ff-table-tree-last-node', 'ff-table-tree-first-node'], {
|
14517
|
-
root:
|
14515
|
+
root: treeRef?.current || null,
|
14518
14516
|
rootMargin: '0px',
|
14519
14517
|
threshold: 0.1,
|
14520
14518
|
onIntersect: entry => {
|
@@ -14530,7 +14528,7 @@ const TreeTable = ({
|
|
14530
14528
|
}
|
14531
14529
|
}
|
14532
14530
|
});
|
14533
|
-
const handleToggleExpand = useCallback(node => onExpand?.(
|
14531
|
+
const handleToggleExpand = useCallback(node => onExpand?.(node), [onExpand]);
|
14534
14532
|
const handleCheckBoxChange = useCallback((e, node) => {
|
14535
14533
|
onChange?.(e, node);
|
14536
14534
|
}, [onChange]);
|
@@ -14540,6 +14538,7 @@ const TreeTable = ({
|
|
14540
14538
|
children: jsx("div", {
|
14541
14539
|
className: "table-scrollable",
|
14542
14540
|
id: "ff-table-tree-scroll-container",
|
14541
|
+
ref: treeRef,
|
14543
14542
|
style: {
|
14544
14543
|
'--table-height': `${height !== 'auto' ? height + 'px' : height}`
|
14545
14544
|
},
|