pixel-react 1.6.5 → 1.6.7

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.
Files changed (253) hide show
  1. package/lib/1fb4472b34e4fe07.css +1 -0
  2. package/lib/StyleGuide/ColorPalette/ColorPalette.stories.d.ts +6 -0
  3. package/lib/StyleGuide/Typography/Typography.stories.d.ts +6 -0
  4. package/lib/components/Accordion/Accordion.d.ts +1 -1
  5. package/lib/components/Accordion/Accordion.stories.d.ts +6 -0
  6. package/lib/components/Accordion/types.d.ts +12 -0
  7. package/lib/components/AddButton/AddButton.d.ts +5 -0
  8. package/lib/components/AddButton/AddButton.stories.d.ts +6 -0
  9. package/lib/components/AddButton/index.d.ts +1 -0
  10. package/lib/components/AddButton/types.d.ts +4 -0
  11. package/lib/components/AddResourceButton/AddButton.stories.d.ts +8 -0
  12. package/lib/components/AddVariables/AddVariables.d.ts +5 -0
  13. package/lib/components/AddVariables/index.d.ts +1 -0
  14. package/lib/components/AddVariables/types.d.ts +35 -0
  15. package/lib/components/AllProjectsDropdown/AllProjectsDropdown.stories.d.ts +7 -0
  16. package/lib/components/AppHeader/AppHeader.stories.d.ts +7 -0
  17. package/lib/components/AttachImage/AttachImage.stories.d.ts +7 -0
  18. package/lib/components/AttachmentButton/AttachmentButton.stories.d.ts +9 -0
  19. package/lib/components/Avatar/Avatar.stories.d.ts +10 -0
  20. package/lib/components/Button/Button.stories.d.ts +13 -0
  21. package/lib/components/Charts/BarChart/BarChart.stories.d.ts +6 -0
  22. package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.d.ts +7 -0
  23. package/lib/components/Charts/DonutChart/DonutChart.stories.d.ts +6 -0
  24. package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts +8 -0
  25. package/lib/components/Charts/LineChart/LineChart.stories.d.ts +7 -0
  26. package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts +8 -0
  27. package/lib/components/Charts/PieChart/PieChart.stories.d.ts +7 -0
  28. package/lib/components/Charts/RadialChart/RadialChart.stories.d.ts +6 -0
  29. package/lib/components/Checkbox/Checkbox.stories.d.ts +8 -0
  30. package/lib/components/Checkbox/types.d.ts +4 -0
  31. package/lib/components/Chip/Chip.stories.d.ts +14 -0
  32. package/lib/components/Comment/Comments.d.ts +4 -0
  33. package/lib/components/Comment/comment/Comment.d.ts +11 -0
  34. package/lib/components/Comment/comment/useNode.d.ts +7 -0
  35. package/lib/components/Comment/index.d.ts +1 -0
  36. package/lib/components/Comment/type.d.ts +25 -0
  37. package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts +6 -0
  38. package/lib/components/DatePicker/DatePicker.stories.d.ts +9 -0
  39. package/lib/components/DragAndDrop/DragAndDrop.stories.d.ts +6 -0
  40. package/lib/components/Drawer/Drawer.stories.d.ts +12 -0
  41. package/lib/components/EditTextField/EditTextField.stories.d.ts +10 -0
  42. package/lib/components/Editor/Editor.stories.d.ts +6 -0
  43. package/lib/components/Editor/constants.d.ts +1 -1
  44. package/lib/components/Editor/types.d.ts +10 -2
  45. package/lib/components/Excel/ExcelFile.stories.d.ts +6 -0
  46. package/lib/components/ExcelFile/ChangeExcelStyles.d.ts +14 -0
  47. package/lib/components/ExcelFile/ColorBarSelector/ColorBarSelector.d.ts +8 -0
  48. package/lib/components/ExcelFile/ContextMenu/ContextMenu.d.ts +4 -0
  49. package/lib/components/ExcelFile/ExcelFile/Excel/ActiveCell.d.ts +7 -0
  50. package/lib/components/ExcelFile/ExcelFile/Excel/Cell.d.ts +4 -0
  51. package/lib/components/ExcelFile/ExcelFile/Excel/ColumnIndicator.d.ts +5 -0
  52. package/lib/components/ExcelFile/ExcelFile/Excel/Copied.d.ts +3 -0
  53. package/lib/components/ExcelFile/ExcelFile/Excel/CornerIndicator.d.ts +5 -0
  54. package/lib/components/ExcelFile/ExcelFile/Excel/DataEditor.d.ts +5 -0
  55. package/lib/components/ExcelFile/ExcelFile/Excel/DataViewer.d.ts +8 -0
  56. package/lib/components/ExcelFile/ExcelFile/Excel/FloatingRect.d.ts +10 -0
  57. package/lib/components/ExcelFile/ExcelFile/Excel/HeaderRow.d.ts +3 -0
  58. package/lib/components/ExcelFile/ExcelFile/Excel/Row.d.ts +3 -0
  59. package/lib/components/ExcelFile/ExcelFile/Excel/RowIndicator.d.ts +5 -0
  60. package/lib/components/ExcelFile/ExcelFile/Excel/Selected.d.ts +3 -0
  61. package/lib/components/ExcelFile/ExcelFile/Excel/Spreadsheet.d.ts +80 -0
  62. package/lib/components/ExcelFile/ExcelFile/Excel/Table.d.ts +3 -0
  63. package/lib/components/ExcelFile/ExcelFile/Excel/actions.d.ts +174 -0
  64. package/lib/components/ExcelFile/ExcelFile/Excel/areModelsEqual.d.ts +1 -0
  65. package/lib/components/ExcelFile/ExcelFile/Excel/context.d.ts +8 -0
  66. package/lib/components/ExcelFile/ExcelFile/Excel/engine/engine.d.ts +22 -0
  67. package/lib/components/ExcelFile/ExcelFile/Excel/engine/formula.d.ts +17 -0
  68. package/lib/components/ExcelFile/ExcelFile/Excel/engine/index.d.ts +2 -0
  69. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-graph.d.ts +21 -0
  70. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-hash.d.ts +3 -0
  71. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-set.d.ts +24 -0
  72. package/lib/components/ExcelFile/ExcelFile/Excel/index.d.ts +13 -0
  73. package/lib/components/ExcelFile/ExcelFile/Excel/matrix.d.ts +67 -0
  74. package/lib/components/ExcelFile/ExcelFile/Excel/point-range.d.ts +22 -0
  75. package/lib/components/ExcelFile/ExcelFile/Excel/point.d.ts +11 -0
  76. package/lib/components/ExcelFile/ExcelFile/Excel/reducer.d.ts +27 -0
  77. package/lib/components/ExcelFile/ExcelFile/Excel/selection.d.ts +95 -0
  78. package/lib/components/ExcelFile/ExcelFile/Excel/types.d.ts +178 -0
  79. package/lib/components/ExcelFile/ExcelFile/Excel/use-dispatch.d.ts +3 -0
  80. package/lib/components/ExcelFile/ExcelFile/Excel/use-selector.d.ts +3 -0
  81. package/lib/components/ExcelFile/ExcelFile/Excel/util.d.ts +44 -0
  82. package/lib/components/ExcelFile/ExcelFile/ExcelFile.d.ts +19 -0
  83. package/lib/components/ExcelFile/ExcelFile.stories.d.ts +6 -0
  84. package/lib/components/ExcelFile/ExcelSheetBar/ExcelSheetBar.d.ts +12 -0
  85. package/lib/components/ExcelFile/ExcelToolBar/ExcelToolBar.d.ts +15 -0
  86. package/lib/components/ExcelFile/ImportExcelStyles.d.ts +24 -0
  87. package/lib/components/ExcelFile/Types.d.ts +129 -0
  88. package/lib/components/ExcelFile/index.d.ts +1 -0
  89. package/lib/components/ExpandableMenu/ExpandableMenu.stories.d.ts +7 -0
  90. package/lib/components/FF_Captcha/captcha.stories.d.ts +8 -0
  91. package/lib/components/FileDropzone/FileDropzone.stories.d.ts +8 -0
  92. package/lib/components/Form/Form.stories.d.ts +7 -0
  93. package/lib/components/GridLayout/GridLayout.stories.d.ts +8 -0
  94. package/lib/components/HighlightText/HighlightText.stories.d.ts +6 -0
  95. package/lib/components/Icon/Icon.stories.d.ts +8 -0
  96. package/lib/components/IconButton/IconButton.d.ts +1 -2
  97. package/lib/components/IconButton/IconButton.stories.d.ts +7 -0
  98. package/lib/components/IconButton/types.d.ts +1 -1
  99. package/lib/components/IconRadioGroup/IconRadioGroup.stories.d.ts +7 -0
  100. package/lib/components/Input/Input.d.ts +1 -1
  101. package/lib/components/Input/Input.stories.d.ts +9 -0
  102. package/lib/components/InputWithDropdown/InputWithDropdown.stories.d.ts +9 -0
  103. package/lib/components/LabelEditTextField/LabelEditTextField.stories.d.ts +13 -0
  104. package/lib/components/LazyLoad/LazyLoad.stories.d.ts +6 -0
  105. package/lib/components/MachineInputField/MachineInputField.stories.d.ts +6 -0
  106. package/lib/components/MenuOption/MenuOption.stories.d.ts +16 -0
  107. package/lib/components/MiniModal/MiniModal.stories.d.ts +10 -0
  108. package/lib/components/Modal/Modal.stories.d.ts +7 -0
  109. package/lib/components/ModulesChip/ModuleChip.stories.d.ts +6 -0
  110. package/lib/components/MultiSelect/MultiSelect.d.ts +1 -1
  111. package/lib/components/MultiSelect/MultiSelect.stories.d.ts +11 -0
  112. package/lib/components/NLPInput/NlpInput.stories.d.ts +7 -0
  113. package/lib/components/Paper/Paper.stories.d.ts +11 -0
  114. package/lib/components/PhoneInput/PhoneInput.d.ts +6 -0
  115. package/lib/components/PhoneInput/index.d.ts +1 -0
  116. package/lib/components/PhoneInput/types.d.ts +10 -0
  117. package/lib/components/PopUpModal/types.d.ts +1 -0
  118. package/lib/components/RadioButton/RadioButton.stories.d.ts +10 -0
  119. package/lib/components/RadioGroup/RadioGroup.stories.d.ts +9 -0
  120. package/lib/components/Search/Search.stories.d.ts +6 -0
  121. package/lib/components/Select/Select.stories.d.ts +14 -0
  122. package/lib/components/Select/components/Dropdown/Dropdown.d.ts +4 -0
  123. package/lib/components/Select/components/Dropdown/dropdownTypes.d.ts +17 -0
  124. package/lib/components/SequentialConnectingBranch/SequentialConnectingBranch.stories.d.ts +6 -0
  125. package/lib/components/StateDropdown/StateDropdown.stories.d.ts +10 -0
  126. package/lib/components/StatusButton/StatusButton.stories.d.ts +14 -0
  127. package/lib/components/StatusCard/StatusCard.stories.d.ts +11 -0
  128. package/lib/components/Table/Table.stories.d.ts +13 -0
  129. package/lib/components/TableTree/TableTree.stories.d.ts +7 -0
  130. package/lib/components/TableWithAccordion/TableWithAccordion.d.ts +5 -0
  131. package/lib/components/TableWithAccordion/data.d.ts +8 -0
  132. package/lib/components/TableWithAccordion/index.d.ts +1 -0
  133. package/lib/components/TableWithAccordion/types.d.ts +67 -0
  134. package/lib/components/Tabs/Tabs.stories.d.ts +9 -0
  135. package/lib/components/TextArea/Textarea.stories.d.ts +9 -0
  136. package/lib/components/Toast/Toast.stories.d.ts +6 -0
  137. package/lib/components/Toastify/Toastify.stories.d.ts +6 -0
  138. package/lib/components/Toggle/Toggle.stories.d.ts +12 -0
  139. package/lib/components/Tooltip/Tooltip.stories.d.ts +15 -0
  140. package/lib/components/Typography/Typography.stories.d.ts +10 -0
  141. package/lib/components/VariableInput/VariableInput.stories.d.ts +6 -0
  142. package/lib/index.d.ts +186 -12
  143. package/lib/index.esm.js +2842 -385
  144. package/lib/index.esm.js.map +1 -1
  145. package/lib/index.js +2846 -384
  146. package/lib/index.js.map +1 -1
  147. package/lib/tsconfig.tsbuildinfo +1 -1
  148. package/lib/utils/checkDuplicates/checkDuplicates.d.ts +1 -0
  149. package/lib/utils/checkEmpty/checkEmpty.stories.d.ts +6 -0
  150. package/lib/utils/compareArrays/compareArrays.stories.d.ts +6 -0
  151. package/lib/utils/compareObjects/compareObjects.stories.d.ts +6 -0
  152. package/lib/utils/debounce/debounce.stories.d.ts +6 -0
  153. package/lib/utils/ffID/ffID.stories.d.ts +6 -0
  154. package/lib/utils/find/findAndInsert.d.ts +7 -0
  155. package/lib/utils/find/findAndInsert.stories.d.ts +7 -0
  156. package/lib/utils/findAndInsert/findAndInsert.stories.d.ts +7 -0
  157. package/lib/utils/getEncryptedData/getEncryptedData.stories.d.ts +6 -0
  158. package/lib/utils/getExtension/getExtension.stories.d.ts +6 -0
  159. package/lib/utils/getSequentialPayload/getSequentialPayload.stories.d.ts +10 -0
  160. package/lib/utils/throttle/throttle.stories.d.ts +6 -0
  161. package/lib/utils/truncateText/truncateText.stories.d.ts +6 -0
  162. package/package.json +2 -1
  163. package/src/assets/Themes/BaseTheme.scss +9 -0
  164. package/src/assets/Themes/DarkTheme.scss +62 -41
  165. package/src/assets/icons/add_file.svg +4 -17
  166. package/src/assets/icons/add_variable.svg +11 -0
  167. package/src/assets/icons/approval_pending.svg +8 -8
  168. package/src/assets/icons/authorization.svg +4 -0
  169. package/src/assets/icons/capture_icon.svg +2 -5
  170. package/src/assets/icons/configuration.svg +3 -3
  171. package/src/assets/icons/defects.svg +8 -8
  172. package/src/assets/icons/depends_on_script.svg +7 -0
  173. package/src/assets/icons/element.svg +4 -4
  174. package/src/assets/icons/email_group.svg +3 -0
  175. package/src/assets/icons/executions_icon.svg +3 -0
  176. package/src/assets/icons/labels.svg +8 -0
  177. package/src/assets/icons/machine_disable_icon.svg +18 -0
  178. package/src/assets/icons/machine_enable_icon.svg +10 -0
  179. package/src/assets/icons/parameters.svg +3 -0
  180. package/src/assets/icons/pre_post_condition.svg +8 -0
  181. package/src/assets/icons/program_element.svg +8 -0
  182. package/src/assets/icons/project_element.svg +4 -4
  183. package/src/assets/icons/step_group.svg +10 -10
  184. package/src/assets/icons/suites_icon.svg +3 -0
  185. package/src/assets/icons/tap_icon.svg +3 -3
  186. package/src/assets/icons/test_data.svg +5 -0
  187. package/src/assets/icons/test_data_set.svg +7 -0
  188. package/src/assets/icons/variable.svg +3 -3
  189. package/src/assets/icons/variable_set.svg +5 -0
  190. package/src/assets/icons/web_service_icon.svg +3 -3
  191. package/src/components/Accordion/Accordion.stories.tsx +4 -0
  192. package/src/components/Accordion/Accordion.tsx +7 -1
  193. package/src/components/Accordion/types.ts +12 -0
  194. package/src/components/AddVariables/AddVariables.scss +14 -0
  195. package/src/components/AddVariables/AddVariables.stories.tsx +44 -0
  196. package/src/components/AddVariables/AddVariables.tsx +113 -0
  197. package/src/components/AddVariables/index.ts +1 -0
  198. package/src/components/AddVariables/types.ts +36 -0
  199. package/src/components/AllProjectsDropdown/AllProjectsDropdown.scss +1 -1
  200. package/src/components/AppHeader/AppHeader.scss +7 -1
  201. package/src/components/AppHeader/types.ts +8 -9
  202. package/src/components/Checkbox/Checkbox.scss +57 -0
  203. package/src/components/Checkbox/Checkbox.stories.tsx +91 -15
  204. package/src/components/Checkbox/Checkbox.tsx +4 -1
  205. package/src/components/Checkbox/types.ts +4 -0
  206. package/src/components/Comment/Comments.scss +166 -0
  207. package/src/components/Comment/Comments.stories.tsx +212 -0
  208. package/src/components/Comment/Comments.tsx +51 -0
  209. package/src/components/Comment/comment/Comment.tsx +206 -0
  210. package/src/components/Comment/comment/useNode.ts +51 -0
  211. package/src/components/Comment/index.ts +1 -0
  212. package/src/components/Comment/type.ts +36 -0
  213. package/src/components/Drawer/Drawer.scss +2 -1
  214. package/src/components/Editor/Editor.stories.tsx +2 -2
  215. package/src/components/Editor/Editor.tsx +4 -2
  216. package/src/components/Editor/VariableDropdown.scss +8 -2
  217. package/src/components/Editor/VariableDropdown.tsx +15 -7
  218. package/src/components/Editor/constants.ts +1 -1
  219. package/src/components/Editor/types.ts +12 -2
  220. package/src/components/FieldSet/FieldSet.scss +2 -1
  221. package/src/components/FieldSet/FieldSet.stories.tsx +2 -1
  222. package/src/components/Icon/iconList.ts +29 -2
  223. package/src/components/IconButton/IconButton.stories.tsx +1 -0
  224. package/src/components/IconButton/IconButton.tsx +5 -8
  225. package/src/components/IconButton/types.ts +2 -2
  226. package/src/components/IconRadioGroup/IconRadioGroup.scss +2 -1
  227. package/src/components/Input/Input.tsx +99 -88
  228. package/src/components/LabelEditTextField/LabelEditTextField.tsx +1 -1
  229. package/src/components/Modal/Modal.stories.tsx +2 -1
  230. package/src/components/MultiSelect/MultiSelect.scss +29 -0
  231. package/src/components/MultiSelect/MultiSelect.stories.tsx +19 -5
  232. package/src/components/MultiSelect/MultiSelect.tsx +29 -19
  233. package/src/components/PhoneInput/PhoneInput.d.ts +3 -0
  234. package/src/components/PhoneInput/PhoneInput.stories.tsx +95 -0
  235. package/src/components/PhoneInput/PhoneInput.tsx +90 -0
  236. package/src/components/PhoneInput/index.ts +1 -0
  237. package/src/components/PhoneInput/phoneInput.scss +3 -0
  238. package/src/components/PhoneInput/types.ts +10 -0
  239. package/src/components/PopUpModal/PopUpModal.stories.tsx +14 -13
  240. package/src/components/PopUpModal/PopUpModal.tsx +2 -1
  241. package/src/components/PopUpModal/types.ts +14 -13
  242. package/src/components/Select/Select.stories.tsx +2 -2
  243. package/src/components/TableWithAccordion/TableWithAccordion.scss +54 -0
  244. package/src/components/TableWithAccordion/TableWithAccordion.stories.tsx +94 -0
  245. package/src/components/TableWithAccordion/TableWithAccordion.tsx +174 -0
  246. package/src/components/TableWithAccordion/data.ts +37 -0
  247. package/src/components/TableWithAccordion/index.ts +1 -0
  248. package/src/components/TableWithAccordion/types.ts +70 -0
  249. package/src/components/Tabs/Tabs.scss +0 -1
  250. package/src/index.ts +12 -1
  251. package/src/utils/checkDuplicates/CheckDuplicates.stories.tsx +40 -0
  252. package/src/utils/checkDuplicates/checkDuplicates.ts +13 -0
  253. package/lib/components/TableTree/TableTree copy.d.ts +0 -25
@@ -0,0 +1,174 @@
1
+ import { useState } from 'react';
2
+ import classNames from 'classnames';
3
+ import Accordion from '../Accordion';
4
+ import './TableWithAccordion.scss';
5
+ import Icon from '../Icon';
6
+ import Tooltip from '../Tooltip';
7
+ import '../../../index.scss';
8
+ import Typography from '../Typography';
9
+ import { ColumnProps, TableProps } from './types';
10
+
11
+ const TableWithAccordion = ({
12
+ tableMeta = [],
13
+ tableData = [],
14
+ accordionType = 'row',
15
+ noDataContent,
16
+ height = '100%',
17
+ withFixedHeader = false,
18
+ headerType,
19
+ TableAccordionStateIconWidth = 4,
20
+ TableAccordionStateIconHeight = 8,
21
+ }: TableProps) => {
22
+ const [expandedRowIndex, setExpandedRowIndex] = useState(-1);
23
+ const onAccordionClick = (index: number) => {
24
+ setExpandedRowIndex(index === expandedRowIndex ? -1 : index);
25
+ };
26
+ const getAccordionTableCellContent = (
27
+ dataObj: any,
28
+ columnObj: ColumnProps
29
+ ) => {
30
+ let cellData = dataObj[columnObj.accessor];
31
+ if (columnObj.cell) {
32
+ return columnObj.cell({
33
+ value: cellData,
34
+ row: dataObj,
35
+ column: columnObj.accessor,
36
+ });
37
+ } else if (columnObj.accessor) {
38
+ return cellData;
39
+ } else if (cellData && typeof cellData !== 'object') {
40
+ return cellData;
41
+ } else {
42
+ return '--';
43
+ }
44
+ };
45
+ const getAccordionTableContent = (dataArray: any) => {
46
+ const accordionSubTable = dataArray.map((rowData: any, index: number) => {
47
+ return (
48
+ <table className="ff-accordion-table" cellSpacing={0}>
49
+ <tbody className="ff-table-body">
50
+ <tr className="ff-table-row" key={rowData.id || index}>
51
+ {tableMeta.map((column, i) => {
52
+ return (
53
+ <td
54
+ className="ff-table-cell"
55
+ key={column.accessor + i}
56
+ style={{ width: column.width }}
57
+ >
58
+ {accordionType === 'column' && i === 0 ? (
59
+ ''
60
+ ) : (
61
+ <Typography>
62
+ {getAccordionTableCellContent(rowData, column)}
63
+ </Typography>
64
+ )}
65
+ </td>
66
+ );
67
+ })}
68
+ </tr>
69
+ </tbody>
70
+ </table>
71
+ );
72
+ });
73
+ return accordionSubTable;
74
+ };
75
+ return (
76
+ <div
77
+ style={{ height: height }}
78
+ className={classNames('ff-accordion-table-container', {
79
+ 'ff-accordion-fixed-header-table': withFixedHeader,
80
+ })}
81
+ >
82
+ <table
83
+ cellSpacing={0}
84
+ className={classNames('ff-accordion-table', {
85
+ 'ff-accordion-fixed-header': withFixedHeader,
86
+ })}
87
+ >
88
+ <thead>
89
+ <tr className="ff-table-row">
90
+ {tableMeta.map((column) => (
91
+ <th
92
+ key={column.header}
93
+ style={{ width: column.width }}
94
+ className={classNames(
95
+ 'ff-table-header',
96
+ headerType && `ff-accordion-table--${headerType}-bg`
97
+ )}
98
+ >
99
+ <div>
100
+ <Typography fontWeight="medium" fontSize={12}>
101
+ {column.header}
102
+ </Typography>
103
+ </div>
104
+ </th>
105
+ ))}
106
+ </tr>
107
+ </thead>
108
+ </table>
109
+ {accordionType === 'row' &&
110
+ tableData.map((row: any) => (
111
+ <Accordion
112
+ headerTitle={row.title}
113
+ color="var(--text-color)"
114
+ accordionContent={getAccordionTableContent(row.data)}
115
+ disable={row.disable}
116
+ disableInfoMessage={row.disableInfoMessage}
117
+ accordionStateIconName="arrows_down_icon"
118
+ AccordionStateIconWidth={TableAccordionStateIconWidth}
119
+ AccordionStateIconHeight={TableAccordionStateIconHeight}
120
+ />
121
+ ))}
122
+ {accordionType === 'column' &&
123
+ tableData.map((row: any, index: number) => (
124
+ <div className="column-table-accordion">
125
+ <div className="ff-display-flex">
126
+ <Tooltip title={row?.disableInfoMessage}>
127
+ <div
128
+ className={`accordion-header ${row.disable && 'ff-disabled'}`}
129
+ >
130
+ <div className="header-title">
131
+ <span>
132
+ <Typography fontWeight="regular">{row.title}</Typography>
133
+ </span>
134
+ </div>
135
+
136
+ <div
137
+ className="accordion-arrow"
138
+ onClick={() => {
139
+ !row.disable && onAccordionClick(index);
140
+ }}
141
+ >
142
+ <Icon
143
+ name={
144
+ expandedRowIndex === index
145
+ ? 'arrows_down_icon'
146
+ : 'arrows_right_icon'
147
+ }
148
+ color="var(--table-with-accordion-icon-color)"
149
+ width={TableAccordionStateIconWidth}
150
+ height={TableAccordionStateIconHeight}
151
+ hoverEffect={false}
152
+ />
153
+ </div>
154
+ </div>
155
+ </Tooltip>
156
+ </div>
157
+ {expandedRowIndex === index && (
158
+ <div>{getAccordionTableContent(row.data)}</div>
159
+ )}
160
+ </div>
161
+ ))}
162
+ {tableData.length <= 0 && (
163
+ <div
164
+ className="no-data-content"
165
+ style={{ height: `calc(${height} - 50px)` }}
166
+ >
167
+ {noDataContent}
168
+ </div>
169
+ )}
170
+ </div>
171
+ );
172
+ };
173
+
174
+ export default TableWithAccordion;
@@ -0,0 +1,37 @@
1
+ export const sampleData = [
2
+ {
3
+ title: 'Pre conditions',
4
+ data: [
5
+ {
6
+ desc: 'Open Browser',
7
+ modifiedBy: 'Ram',
8
+ suiteName: 'test',
9
+ },
10
+ ],
11
+ },
12
+ {
13
+ title: 'Steps',
14
+ data: [
15
+ {
16
+ desc: '1. SG1',
17
+ modifiedBy: 'Ram',
18
+ suiteName: 'suite1',
19
+ },
20
+ {
21
+ desc: '2. SG2',
22
+ modifiedBy: 'Laxman',
23
+ suiteName: 'suite 2',
24
+ },
25
+ ],
26
+ },
27
+ {
28
+ title: 'Post conditions',
29
+ data: [
30
+ {
31
+ desc: 'close browser',
32
+ modifiedBy: 'Krishna',
33
+ suiteName: 'test 2',
34
+ },
35
+ ],
36
+ },
37
+ ];
@@ -0,0 +1 @@
1
+ export { default } from './TableWithAccordion';
@@ -0,0 +1,70 @@
1
+ import { ReactNode } from "react";
2
+
3
+ export interface ColumnProps {
4
+ /**
5
+ * column name
6
+ */
7
+ header: string;
8
+ /**
9
+ * data key for particular column
10
+ */
11
+ accessor: string;
12
+ /**
13
+ * className for a column
14
+ */
15
+ className?: string;
16
+ /**
17
+ * width of a column
18
+ */
19
+ width?: number;
20
+ /**
21
+ * data for the column
22
+ */
23
+ cell?: (e: any) => JSX.Element | string | ReactNode;
24
+ }
25
+
26
+ export interface DataProps {
27
+ /**
28
+ * data for each row
29
+ */
30
+ [key: string]: any;
31
+ }
32
+
33
+ export interface TableProps {
34
+ /**
35
+ * Column details for table
36
+ */
37
+ tableMeta: Array<ColumnProps>;
38
+ /**
39
+ * Data for table
40
+ */
41
+ tableData: Array<DataProps>;
42
+ /**
43
+ * Table type
44
+ */
45
+ accordionType: 'row' | 'column';
46
+ /**
47
+ * Specific sentence to be displayed data not found
48
+ */
49
+ noDataContent?: string | ReactNode;
50
+ /**
51
+ * withFixedHeader prop to have non-scrollable fixed accordion table header
52
+ */
53
+ withFixedHeader?: boolean;
54
+ /**
55
+ * Height of the table in string
56
+ */
57
+ height?: string;
58
+ /**
59
+ * Header type to have different background color
60
+ */
61
+ headerType: 'default' | 'primary' | 'secondary';
62
+ /**
63
+ * Accordion collapse and expand Icon width
64
+ */
65
+ TableAccordionStateIconWidth:number,
66
+ /**
67
+ * Accordion collapse and expand Icon height
68
+ */
69
+ TableAccordionStateIconHeight:number,
70
+ }
@@ -8,7 +8,6 @@
8
8
  &--default {
9
9
  display: flex;
10
10
  gap: 8px;
11
- border: 1px solid var(--tabs-border-color);
12
11
  border-radius: 8px 8px 0 0;
13
12
  padding: 7px 8px 0;
14
13
 
package/src/index.ts CHANGED
@@ -54,7 +54,7 @@ import SequentialConnectingBranch from './components/SequentialConnectingBranch'
54
54
  import AttachmentButton from './components/AttachmentButton';
55
55
  import { Toastify, toast } from './components/Toastify/Toastify';
56
56
  import ToggleSwitch from './components/ToggleSwitch/ToggleSwitch';
57
- import Avatar from './components/Avatar/Avatar';
57
+ import Avatar from './components/Avatar';
58
58
 
59
59
  import LabelEditTextField from './components/LabelEditTextField';
60
60
  import EditTextField from './components/EditTextField';
@@ -69,6 +69,8 @@ import LineChart from './components/Charts/LineChart';
69
69
  import DownloadClient from './components/DownloadClient/DownloadClient';
70
70
  import FieldSet from './components/FieldSet';
71
71
  import CreateVariableSlider from './components/CreateVariable/CreateVariableSlider';
72
+ import TableWithAccordion from './components/TableWithAccordion/TableWithAccordion';
73
+
72
74
  // Utils imports
73
75
  import { checkEmpty } from './utils/checkEmpty/checkEmpty';
74
76
  import {
@@ -89,8 +91,12 @@ import Editor from './components/Editor/Editor';
89
91
  import { getSequentialPayload } from './utils/getSequentialPayload/getSequentialPayload';
90
92
  import ConnectingBranch from './components/ConnectingBranch/ConnectingBranch';
91
93
  import { saveFileFromBlob } from './utils/downloadFile/saveFileFromBlob';
94
+ import Comments from './components/Comment/Comments';
92
95
  import useFileDropzone from './hooks/useFileDropzone';
93
96
  import PopUpModal from './components/PopUpModal/PopUpModal';
97
+ import AddVariables from './components/AddVariables/AddVariables';
98
+ import { hasDuplicateFile } from './utils/checkDuplicates/checkDuplicates';
99
+ import PhoneInputField from './components/PhoneInput';
94
100
 
95
101
  export {
96
102
  Button,
@@ -168,9 +174,13 @@ export {
168
174
  VariableDropdown,
169
175
  DownloadClient,
170
176
  FieldSet,
177
+ Comments,
171
178
  PopUpModal,
172
179
  CreateVariableSlider,
180
+ AddVariables,
181
+ PhoneInputField,
173
182
 
183
+ TableWithAccordion,
174
184
  // utils exports
175
185
  checkEmpty,
176
186
  getExtension,
@@ -186,4 +196,5 @@ export {
186
196
  getSequentialPayload,
187
197
  saveFileFromBlob,
188
198
  useFileDropzone,
199
+ hasDuplicateFile,
189
200
  };
@@ -0,0 +1,40 @@
1
+ import React from 'react';
2
+ import { Meta, StoryObj } from '@storybook/react';
3
+ import { hasDuplicateFile } from './checkDuplicates';
4
+
5
+ export default {
6
+ title: 'Utils/HasDuplicateFile',
7
+ argTypes: {
8
+ array: {
9
+ control: 'object',
10
+ description: 'Array of objects to check for duplicates.',
11
+ },
12
+ property: {
13
+ control: 'text',
14
+ description: 'Optional property to check for duplicates.',
15
+ },
16
+ },
17
+ } satisfies Meta;
18
+
19
+ export const Default: StoryObj = {
20
+ args: {
21
+ array: [
22
+ { id: 1, name: 'file1' },
23
+ { id: 2, name: 'file2' },
24
+ { id: 1, name: 'file1' },
25
+ ],
26
+ property: 'id',
27
+ },
28
+ render: (args) => {
29
+ const result = hasDuplicateFile(args.array, args.property);
30
+ return (
31
+ <div>
32
+ <h3>
33
+ Duplicate Check Result:{' '}
34
+ {result ? 'Duplicates Found' : 'No Duplicates'}
35
+ </h3>
36
+ <pre>{JSON.stringify(args.array, null, 2)}</pre>
37
+ </div>
38
+ );
39
+ },
40
+ };
@@ -0,0 +1,13 @@
1
+ // Will be used to find duplicate key-value pair in an array of objects.
2
+
3
+ export const hasDuplicateFile = (array: any[], property: string): boolean => {
4
+ const seen = new Set();
5
+ for (const obj of array) {
6
+ const key = property ? obj[property] : JSON.stringify(obj);
7
+ if (seen.has(key)) {
8
+ return true;
9
+ }
10
+ seen.add(key);
11
+ }
12
+ return false;
13
+ };
@@ -1,25 +0,0 @@
1
- import React, { ReactNode } from 'react';
2
- import './TableTree.scss';
3
- interface ColumnDataProps {
4
- name: string;
5
- accessor: string;
6
- width: string;
7
- isClickable?: boolean;
8
- minWidth?: string;
9
- cell?: (e: any) => JSX.Element | string | ReactNode;
10
- actions?: (e: any) => JSX.Element | string | ReactNode;
11
- }
12
- interface ObjectProps {
13
- [key: string]: any;
14
- }
15
- interface TableTreeProps {
16
- select: 'checkbox' | 'radio' | 'none';
17
- columnsData: Array<ColumnDataProps>;
18
- treeData: Array<ObjectProps>;
19
- onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>, data: any) => void;
20
- onChange?: (e: any, node: any) => void;
21
- selected: Array<string>;
22
- onPagination?: (node: ObjectProps) => void;
23
- }
24
- declare const TableTree: ({ columnsData, treeData, select, onClick, onChange, selected, onPagination, }: TableTreeProps) => import("react/jsx-runtime").JSX.Element;
25
- export default TableTree;