pixel-react 1.8.0 → 1.8.2

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 (188) hide show
  1. package/.yarn/install-state.gz +0 -0
  2. package/lib/components/Accordion/Accordion.d.ts +1 -1
  3. package/lib/components/Accordion/types.d.ts +4 -0
  4. package/lib/components/ConditionalDropdown/ConditionalDropdown.d.ts +1 -2
  5. package/lib/components/ConditionalDropdown/types.d.ts +3 -3
  6. package/lib/components/LabelEditTextField/types.d.ts +1 -1
  7. package/lib/components/ScriptSwitchButton/ScriptSwitchButton.d.ts +9 -0
  8. package/lib/components/ScriptSwitchButton/index.d.ts +1 -0
  9. package/lib/components/TableTree/Components/TableCell.d.ts +1 -1
  10. package/lib/components/TableTree/Components/TableRow.d.ts +1 -1
  11. package/lib/components/TableTree/TableTree copy.d.ts +25 -0
  12. package/lib/components/TableTree/data.d.ts +48 -8
  13. package/lib/components/TableTree/types.d.ts +2 -2
  14. package/lib/index.d.ts +64 -7
  15. package/lib/index.esm.js +536 -324
  16. package/lib/index.esm.js.map +1 -1
  17. package/lib/index.js +581 -323
  18. package/lib/index.js.map +1 -1
  19. package/lib/tsconfig.tsbuildinfo +1 -1
  20. package/lib/validations/regex.d.ts +46 -0
  21. package/package.json +2 -2
  22. package/src/StyleGuide/ColorPalette/colorPaletteList.ts +5 -0
  23. package/src/assets/Themes/BaseTheme.scss +1 -1
  24. package/src/assets/Themes/BlueTheme.scss +1 -1
  25. package/src/assets/Themes/DarkTheme.scss +1 -1
  26. package/src/assets/icons/approval_pending.svg +8 -8
  27. package/src/assets/icons/configuration.svg +3 -3
  28. package/src/assets/icons/defects.svg +8 -8
  29. package/src/assets/icons/element.svg +4 -4
  30. package/src/assets/icons/project_element.svg +4 -4
  31. package/src/assets/icons/step_group.svg +10 -10
  32. package/src/assets/icons/variable.svg +3 -3
  33. package/src/assets/icons/web_service_icon.svg +3 -3
  34. package/src/components/Accordion/Accordion.stories.tsx +13 -0
  35. package/src/components/Accordion/Accordion.tsx +2 -1
  36. package/src/components/Accordion/types.ts +4 -0
  37. package/src/components/ConditionalDropdown/ConditionalDropdown.stories.tsx +8 -5
  38. package/src/components/ConditionalDropdown/ConditionalDropdown.tsx +133 -135
  39. package/src/components/ConditionalDropdown/types.ts +8 -8
  40. package/src/components/DatePicker/DatePicker.scss +310 -0
  41. package/src/components/LabelEditTextField/LabelEditTextField.scss +4 -0
  42. package/src/components/LabelEditTextField/LabelEditTextField.tsx +14 -7
  43. package/src/components/LabelEditTextField/types.ts +1 -1
  44. package/src/components/ScriptSwitchButton/ScriptSwitchButton.scss +33 -0
  45. package/src/components/ScriptSwitchButton/ScriptSwitchButton.stories.tsx +48 -0
  46. package/src/components/ScriptSwitchButton/ScriptSwitchButton.tsx +65 -0
  47. package/src/components/ScriptSwitchButton/index.ts +1 -0
  48. package/src/components/TableTree/Components/TableBody.tsx +3 -3
  49. package/src/components/TableTree/Components/TableCell.tsx +7 -7
  50. package/src/components/TableTree/Components/TableRow.tsx +2 -2
  51. package/src/components/TableTree/TableTree.scss +2 -3
  52. package/src/components/TableTree/data.ts +43 -12
  53. package/src/components/TableTree/types.ts +2 -2
  54. package/src/index.ts +95 -1
  55. package/src/validations/regex.stories.tsx +362 -0
  56. package/src/validations/regex.ts +194 -0
  57. package/lib/1fb4472b34e4fe07.css +0 -1
  58. package/lib/StyleGuide/ColorPalette/ColorPalette.stories.d.ts +0 -6
  59. package/lib/StyleGuide/Typography/Typography.stories.d.ts +0 -6
  60. package/lib/components/Accordion/Accordion.stories.d.ts +0 -6
  61. package/lib/components/AddButton/AddButton.d.ts +0 -5
  62. package/lib/components/AddButton/AddButton.stories.d.ts +0 -6
  63. package/lib/components/AddButton/index.d.ts +0 -1
  64. package/lib/components/AddButton/types.d.ts +0 -4
  65. package/lib/components/AddResourceButton/AddButton.stories.d.ts +0 -8
  66. package/lib/components/AddVariables/AddVariables.d.ts +0 -5
  67. package/lib/components/AddVariables/index.d.ts +0 -1
  68. package/lib/components/AddVariables/types.d.ts +0 -35
  69. package/lib/components/AllProjectsDropdown/AllProjectsDropdown.stories.d.ts +0 -7
  70. package/lib/components/AppHeader/AppHeader.stories.d.ts +0 -7
  71. package/lib/components/AttachImage/AttachImage.stories.d.ts +0 -7
  72. package/lib/components/AttachmentButton/AttachmentButton.stories.d.ts +0 -9
  73. package/lib/components/Avatar/Avatar.stories.d.ts +0 -10
  74. package/lib/components/Button/Button.stories.d.ts +0 -13
  75. package/lib/components/Charts/BarChart/BarChart.stories.d.ts +0 -6
  76. package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.d.ts +0 -7
  77. package/lib/components/Charts/DonutChart/DonutChart.stories.d.ts +0 -6
  78. package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts +0 -8
  79. package/lib/components/Charts/LineChart/LineChart.stories.d.ts +0 -7
  80. package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts +0 -8
  81. package/lib/components/Charts/PieChart/PieChart.stories.d.ts +0 -7
  82. package/lib/components/Charts/RadialChart/RadialChart.stories.d.ts +0 -6
  83. package/lib/components/Checkbox/Checkbox.stories.d.ts +0 -8
  84. package/lib/components/Chip/Chip.stories.d.ts +0 -14
  85. package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts +0 -6
  86. package/lib/components/DatePicker/DatePicker.stories.d.ts +0 -9
  87. package/lib/components/DragAndDrop/DragAndDrop.stories.d.ts +0 -6
  88. package/lib/components/Drawer/Drawer.stories.d.ts +0 -12
  89. package/lib/components/EditTextField/EditTextField.stories.d.ts +0 -10
  90. package/lib/components/Editor/Editor.stories.d.ts +0 -6
  91. package/lib/components/Excel/ExcelFile.stories.d.ts +0 -6
  92. package/lib/components/ExcelFile/ChangeExcelStyles.d.ts +0 -14
  93. package/lib/components/ExcelFile/ColorBarSelector/ColorBarSelector.d.ts +0 -8
  94. package/lib/components/ExcelFile/ContextMenu/ContextMenu.d.ts +0 -4
  95. package/lib/components/ExcelFile/ExcelFile/Excel/ActiveCell.d.ts +0 -7
  96. package/lib/components/ExcelFile/ExcelFile/Excel/Cell.d.ts +0 -4
  97. package/lib/components/ExcelFile/ExcelFile/Excel/ColumnIndicator.d.ts +0 -5
  98. package/lib/components/ExcelFile/ExcelFile/Excel/Copied.d.ts +0 -3
  99. package/lib/components/ExcelFile/ExcelFile/Excel/CornerIndicator.d.ts +0 -5
  100. package/lib/components/ExcelFile/ExcelFile/Excel/DataEditor.d.ts +0 -5
  101. package/lib/components/ExcelFile/ExcelFile/Excel/DataViewer.d.ts +0 -8
  102. package/lib/components/ExcelFile/ExcelFile/Excel/FloatingRect.d.ts +0 -10
  103. package/lib/components/ExcelFile/ExcelFile/Excel/HeaderRow.d.ts +0 -3
  104. package/lib/components/ExcelFile/ExcelFile/Excel/Row.d.ts +0 -3
  105. package/lib/components/ExcelFile/ExcelFile/Excel/RowIndicator.d.ts +0 -5
  106. package/lib/components/ExcelFile/ExcelFile/Excel/Selected.d.ts +0 -3
  107. package/lib/components/ExcelFile/ExcelFile/Excel/Spreadsheet.d.ts +0 -80
  108. package/lib/components/ExcelFile/ExcelFile/Excel/Table.d.ts +0 -3
  109. package/lib/components/ExcelFile/ExcelFile/Excel/actions.d.ts +0 -174
  110. package/lib/components/ExcelFile/ExcelFile/Excel/areModelsEqual.d.ts +0 -1
  111. package/lib/components/ExcelFile/ExcelFile/Excel/context.d.ts +0 -8
  112. package/lib/components/ExcelFile/ExcelFile/Excel/engine/engine.d.ts +0 -22
  113. package/lib/components/ExcelFile/ExcelFile/Excel/engine/formula.d.ts +0 -17
  114. package/lib/components/ExcelFile/ExcelFile/Excel/engine/index.d.ts +0 -2
  115. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-graph.d.ts +0 -21
  116. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-hash.d.ts +0 -3
  117. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-set.d.ts +0 -24
  118. package/lib/components/ExcelFile/ExcelFile/Excel/index.d.ts +0 -13
  119. package/lib/components/ExcelFile/ExcelFile/Excel/matrix.d.ts +0 -67
  120. package/lib/components/ExcelFile/ExcelFile/Excel/point-range.d.ts +0 -22
  121. package/lib/components/ExcelFile/ExcelFile/Excel/point.d.ts +0 -11
  122. package/lib/components/ExcelFile/ExcelFile/Excel/reducer.d.ts +0 -27
  123. package/lib/components/ExcelFile/ExcelFile/Excel/selection.d.ts +0 -95
  124. package/lib/components/ExcelFile/ExcelFile/Excel/types.d.ts +0 -178
  125. package/lib/components/ExcelFile/ExcelFile/Excel/use-dispatch.d.ts +0 -3
  126. package/lib/components/ExcelFile/ExcelFile/Excel/use-selector.d.ts +0 -3
  127. package/lib/components/ExcelFile/ExcelFile/Excel/util.d.ts +0 -44
  128. package/lib/components/ExcelFile/ExcelFile/ExcelFile.d.ts +0 -19
  129. package/lib/components/ExcelFile/ExcelFile.stories.d.ts +0 -6
  130. package/lib/components/ExcelFile/ExcelSheetBar/ExcelSheetBar.d.ts +0 -12
  131. package/lib/components/ExcelFile/ExcelToolBar/ExcelToolBar.d.ts +0 -15
  132. package/lib/components/ExcelFile/ImportExcelStyles.d.ts +0 -24
  133. package/lib/components/ExcelFile/Types.d.ts +0 -129
  134. package/lib/components/ExcelFile/index.d.ts +0 -1
  135. package/lib/components/ExpandableMenu/ExpandableMenu.stories.d.ts +0 -7
  136. package/lib/components/FF_Captcha/captcha.stories.d.ts +0 -8
  137. package/lib/components/FileDropzone/FileDropzone.stories.d.ts +0 -8
  138. package/lib/components/Form/Form.stories.d.ts +0 -7
  139. package/lib/components/GridLayout/GridLayout.stories.d.ts +0 -8
  140. package/lib/components/HighlightText/HighlightText.stories.d.ts +0 -6
  141. package/lib/components/Icon/Icon.stories.d.ts +0 -8
  142. package/lib/components/IconButton/IconButton.stories.d.ts +0 -7
  143. package/lib/components/IconRadioGroup/IconRadioGroup.stories.d.ts +0 -7
  144. package/lib/components/Input/Input.stories.d.ts +0 -9
  145. package/lib/components/InputWithDropdown/InputWithDropdown.stories.d.ts +0 -9
  146. package/lib/components/LabelEditTextField/LabelEditTextField.stories.d.ts +0 -13
  147. package/lib/components/LazyLoad/LazyLoad.stories.d.ts +0 -6
  148. package/lib/components/MachineInputField/MachineInputField.stories.d.ts +0 -6
  149. package/lib/components/MenuOption/MenuOption.stories.d.ts +0 -16
  150. package/lib/components/MiniModal/MiniModal.stories.d.ts +0 -10
  151. package/lib/components/Modal/Modal.stories.d.ts +0 -7
  152. package/lib/components/ModulesChip/ModuleChip.stories.d.ts +0 -6
  153. package/lib/components/MultiSelect/MultiSelect.stories.d.ts +0 -11
  154. package/lib/components/NLPInput/NlpInput.stories.d.ts +0 -7
  155. package/lib/components/Paper/Paper.stories.d.ts +0 -11
  156. package/lib/components/RadioButton/RadioButton.stories.d.ts +0 -10
  157. package/lib/components/RadioGroup/RadioGroup.stories.d.ts +0 -9
  158. package/lib/components/Search/Search.stories.d.ts +0 -6
  159. package/lib/components/Select/Select.stories.d.ts +0 -14
  160. package/lib/components/Select/components/Dropdown/Dropdown.d.ts +0 -4
  161. package/lib/components/Select/components/Dropdown/dropdownTypes.d.ts +0 -17
  162. package/lib/components/SequentialConnectingBranch/SequentialConnectingBranch.stories.d.ts +0 -6
  163. package/lib/components/StateDropdown/StateDropdown.stories.d.ts +0 -10
  164. package/lib/components/StatusButton/StatusButton.stories.d.ts +0 -14
  165. package/lib/components/StatusCard/StatusCard.stories.d.ts +0 -11
  166. package/lib/components/Table/Table.stories.d.ts +0 -13
  167. package/lib/components/TableTree/TableTree.stories.d.ts +0 -7
  168. package/lib/components/Tabs/Tabs.stories.d.ts +0 -9
  169. package/lib/components/TextArea/Textarea.stories.d.ts +0 -9
  170. package/lib/components/Toast/Toast.stories.d.ts +0 -6
  171. package/lib/components/Toastify/Toastify.stories.d.ts +0 -6
  172. package/lib/components/Toggle/Toggle.stories.d.ts +0 -12
  173. package/lib/components/Tooltip/Tooltip.stories.d.ts +0 -15
  174. package/lib/components/Typography/Typography.stories.d.ts +0 -10
  175. package/lib/components/VariableInput/VariableInput.stories.d.ts +0 -6
  176. package/lib/utils/checkEmpty/checkEmpty.stories.d.ts +0 -6
  177. package/lib/utils/compareArrays/compareArrays.stories.d.ts +0 -6
  178. package/lib/utils/compareObjects/compareObjects.stories.d.ts +0 -6
  179. package/lib/utils/debounce/debounce.stories.d.ts +0 -6
  180. package/lib/utils/ffID/ffID.stories.d.ts +0 -6
  181. package/lib/utils/find/findAndInsert.d.ts +0 -7
  182. package/lib/utils/find/findAndInsert.stories.d.ts +0 -7
  183. package/lib/utils/findAndInsert/findAndInsert.stories.d.ts +0 -7
  184. package/lib/utils/getEncryptedData/getEncryptedData.stories.d.ts +0 -6
  185. package/lib/utils/getExtension/getExtension.stories.d.ts +0 -6
  186. package/lib/utils/getSequentialPayload/getSequentialPayload.stories.d.ts +0 -10
  187. package/lib/utils/throttle/throttle.stories.d.ts +0 -6
  188. package/lib/utils/truncateText/truncateText.stories.d.ts +0 -6
@@ -7,6 +7,7 @@ import Icon from '../Icon';
7
7
  import Tooltip from '../Tooltip';
8
8
  import Input from '../Input/Input';
9
9
  import Select from '../Select/Select';
10
+ import useEscapeKey from '../../hooks/keyboardevents/useEscKeyEvent.js';
10
11
 
11
12
  const getErrorMessage = (
12
13
  inputValue: string,
@@ -45,17 +46,19 @@ const LabelEditTextField: FC<LabelEditTextFieldTypes> = ({
45
46
  tooltip,
46
47
  }) => {
47
48
  const [isEditing, setIsEditing] = useState(isOpen ?? false);
48
- const [inputValue, setInputValue] = useState(text);
49
+ const [inputValue, setInputValue] = useState(text ?? '');
49
50
  const [dropdownValue, setDropdownValue] = useState(
50
51
  dropdownData[0]?.value ?? ''
51
52
  );
52
53
  const [showError, setShowError] = useState('');
54
+ const [disabled, isDisabled] = useState(true);
53
55
  const [isTextFieldModified, setIsTextFieldModified] = useState(false);
54
56
  const isThrowingError = showError && isEditing ? true : false;
55
57
 
56
58
  const containerRef = useRef<HTMLDivElement | null>(null);
57
- const cancelRef = useRef<HTMLDivElement | null>(null); // New ref for cancel icon
59
+ const cancelRef = useRef<HTMLDivElement | null>(null);
58
60
  const [clickTimeout, setClickTimeout] = useState<number | null>(null);
61
+ const handleEsc = useEscapeKey('Escape');
59
62
  useEffect(() => {
60
63
  return () => {
61
64
  if (clickTimeout) {
@@ -107,7 +110,7 @@ const LabelEditTextField: FC<LabelEditTextFieldTypes> = ({
107
110
  };
108
111
 
109
112
  const handleCancel = () => {
110
- setInputValue(text);
113
+ setInputValue(text ?? '');
111
114
  setDropdownValue(dropdownData[0]?.value ?? '');
112
115
  setIsEditing(false);
113
116
  setShowError('');
@@ -117,6 +120,7 @@ const LabelEditTextField: FC<LabelEditTextFieldTypes> = ({
117
120
  const handleTextFieldChange = (e: React.ChangeEvent<HTMLInputElement>) => {
118
121
  const newValue = e.target.value;
119
122
  setInputValue(newValue);
123
+ isDisabled(false);
120
124
  if (newValue.length === 0 || newValue.trim().length === 0) {
121
125
  setShowError('Please type any text.');
122
126
  } else if (newValue.length < 3) {
@@ -138,9 +142,9 @@ const LabelEditTextField: FC<LabelEditTextFieldTypes> = ({
138
142
  if (
139
143
  containerRef.current &&
140
144
  !containerRef.current.contains(e.target as Node) &&
141
- cancelRef.current !== e.target // Exclude clicks on cancel icon
145
+ cancelRef.current !== e.target
142
146
  ) {
143
- const errorMessage = getErrorMessage(inputValue, text, customError);
147
+ const errorMessage = getErrorMessage(inputValue, text ?? '', customError);
144
148
 
145
149
  if (errorMessage && isEditing) {
146
150
  setShowError(errorMessage);
@@ -157,7 +161,7 @@ const LabelEditTextField: FC<LabelEditTextFieldTypes> = ({
157
161
  document.removeEventListener('click', handleBlur);
158
162
  };
159
163
  }, [inputValue]);
160
-
164
+ handleEsc(handleCancel);
161
165
  return (
162
166
  <div className="ff-label-edit-text-field" ref={containerRef}>
163
167
  {isEditing ? (
@@ -212,7 +216,10 @@ const LabelEditTextField: FC<LabelEditTextFieldTypes> = ({
212
216
  height={20}
213
217
  width={20}
214
218
  name={confirmIcon.name}
215
- className="confirm-icon"
219
+ disabled={disabled}
220
+ className={`${
221
+ disabled ? 'disabled-confirm-icon' : 'confirm-icon'
222
+ }`}
216
223
  onClick={handleConfirm}
217
224
  />
218
225
  )}
@@ -16,7 +16,7 @@ export interface LabelEditTextFieldTypes {
16
16
  /** Label text displayed above the input field. */
17
17
  label?: string;
18
18
  /** Initial text displayed in the input field. */
19
- text: string;
19
+ text?: string;
20
20
  /** Text to be highlighted within the displayed text, if provided. */
21
21
  highlightText?: string;
22
22
  /** Custom error message to be displayed, if applicable. */
@@ -0,0 +1,33 @@
1
+ /* Container Styling */
2
+ .ff-script-switch-container {
3
+ display: flex;
4
+ background-color: var(--base-bg-color);
5
+ height: 24px;
6
+ width: 48px;
7
+ border-radius: 6px;
8
+ border: 1px solid var(--border-color);
9
+ align-items: center;
10
+ justify-content: center;
11
+
12
+ /* Button Styling */
13
+ .ff-script-switch-button {
14
+ padding: 0.1px;
15
+ border: none;
16
+ border-radius: 4px;
17
+ cursor: pointer;
18
+ outline: none;
19
+ transition: all 0.3s ease;
20
+
21
+ /* Button Hover Effect */
22
+ &:hover {
23
+ background-color: var(--hover-color);
24
+ color: var(--brand-color);
25
+ }
26
+ }
27
+
28
+ /* Active Button */
29
+ .ff-script-switch-button.active {
30
+ background-color: var(--ff-line-number-bg);
31
+ color: var(--base-bg-color);
32
+ }
33
+ }
@@ -0,0 +1,48 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import React, { useState } from 'react';
3
+ import ScriptSwitchButton from './ScriptSwitchButton';
4
+
5
+ const meta: Meta<typeof ScriptSwitchButton> = {
6
+ title: 'Components/ScriptSwitchButton',
7
+ component: ScriptSwitchButton,
8
+ tags: ['autodocs'],
9
+ argTypes: {
10
+ selected: {
11
+ control: { type: 'radio' },
12
+ options: ['Automation', 'Manual'],
13
+ },
14
+ },
15
+ };
16
+
17
+ export default meta;
18
+
19
+ type Story = StoryObj<typeof ScriptSwitchButton>;
20
+
21
+ export const Default: Story = {
22
+ args: {
23
+ selected: 'Automation',
24
+ tabList: ['Automation', 'Manual'],
25
+ handleClick: () => {},
26
+ },
27
+ };
28
+
29
+ export const Switch: Story = {
30
+ render: () => {
31
+ const [selected, setSelected] = useState<string>('Automation');
32
+ const handleChange = (selectedSwitch: string) => {
33
+ if (selectedSwitch.includes('Automation')) {
34
+ !selectedSwitch.includes('Add') && setSelected(selectedSwitch);
35
+ } else {
36
+ !selectedSwitch.includes('Add') && setSelected(selectedSwitch);
37
+ }
38
+ };
39
+
40
+ return (
41
+ <ScriptSwitchButton
42
+ selected={selected}
43
+ tabList={['Automation', 'Manual']}
44
+ handleClick={handleChange}
45
+ />
46
+ );
47
+ },
48
+ };
@@ -0,0 +1,65 @@
1
+ import React, { type JSX } from 'react';
2
+ import './ScriptSwitchButton.scss';
3
+ import Icon from '../Icon';
4
+ import Tooltip from '../Tooltip';
5
+
6
+ interface ScriptSwitchButtonProps {
7
+ handleClick: (selected: string) => void;
8
+ selected: string;
9
+ tabList: Array<'Automation' | 'Manual'>;
10
+ }
11
+
12
+ const ScriptSwitchButton: React.FC<ScriptSwitchButtonProps> = ({
13
+ selected = 'text',
14
+ handleClick,
15
+ tabList, // ['Automation' , 'Manual']
16
+ }): JSX.Element => {
17
+ const isAutomation = tabList?.includes('Automation');
18
+ const isManual = tabList?.includes('Manual');
19
+
20
+ return (
21
+ <div className="ff-script-switch-container">
22
+ <Tooltip
23
+ title={isAutomation ? 'Automation' : 'Add Automation'}
24
+ zIndex={1000}
25
+ >
26
+ <div
27
+ className={`ff-script-switch-button ${
28
+ selected === 'Automation' ? 'active' : ''
29
+ }`}
30
+ onClick={() =>
31
+ handleClick(isAutomation ? 'Automation' : 'Add Automation')
32
+ }
33
+ >
34
+ <Icon
35
+ name={isAutomation ? 'automation_testcase' : 'add_testcase'}
36
+ color={
37
+ selected === 'Automation'
38
+ ? 'var(--primary-button-text-color)'
39
+ : 'var(--description-text)'
40
+ }
41
+ />
42
+ </div>
43
+ </Tooltip>
44
+ <Tooltip title={isManual ? 'Manual' : 'Add Manual'} zIndex={1000}>
45
+ <div
46
+ className={`ff-script-switch-button ${
47
+ selected === 'Manual' ? 'active' : ''
48
+ }`}
49
+ onClick={() => handleClick(isManual ? 'Manual' : 'Add Manual')}
50
+ >
51
+ <Icon
52
+ name={isManual ? 'manual_testcase' : 'add_testcase'}
53
+ color={
54
+ selected === 'Manual'
55
+ ? 'var(--primary-button-text-color)'
56
+ : 'var(--description-text)'
57
+ }
58
+ />
59
+ </div>
60
+ </Tooltip>
61
+ </div>
62
+ );
63
+ };
64
+
65
+ export default ScriptSwitchButton;
@@ -0,0 +1 @@
1
+ export { default } from './ScriptSwitchButton';
@@ -12,10 +12,10 @@ const TableBody = React.memo(
12
12
  onToggleExpand,
13
13
  onCheckBoxChange,
14
14
  }: TableBodyProps) => (
15
- <tbody>
15
+ <tbody className='ff-table-tree-body'>
16
16
  <tr id="ff-table-tree-first-node" />
17
17
  {flattenedTreeData?.map(
18
- ({ node, level, lines = level + 1, isLast = false }) => {
18
+ ({ node, level, parentSiblings = [], isLast = false }) => {
19
19
  return (
20
20
  <TableRow
21
21
  key={node.id}
@@ -27,7 +27,7 @@ const TableBody = React.memo(
27
27
  onRowClick={onRowClick}
28
28
  onToggleExpand={onToggleExpand}
29
29
  onCheckBoxChange={onCheckBoxChange}
30
- lines={lines}
30
+ parentSiblings={parentSiblings}
31
31
  isLast={isLast}
32
32
  />
33
33
  );
@@ -7,15 +7,15 @@ import React from 'react';
7
7
 
8
8
  const renderSpaces = (
9
9
  level: number,
10
- lines: number,
10
+ parentSiblings: boolean[],
11
11
  isLast?: boolean | undefined
12
12
  ) => (
13
13
  <div className="tree-table-space-container">
14
- {Array.from({ length: level }).map((_, i) => (
14
+ {parentSiblings.reverse().map((line, i) => (
15
15
  <span
16
16
  key={i}
17
- className={`tree-table-space-block ${i >= lines ? 'no-lines' : ''} ${
18
- isLast && i === 0 ? 'last-node' : ''
17
+ className={`tree-table-space-block ${!line ? 'no-lines' : ''} ${
18
+ isLast && i === level-1 ? 'last-node' : ''
19
19
  }`}
20
20
  />
21
21
  ))}
@@ -31,12 +31,12 @@ const TableCell = React.memo(
31
31
  select,
32
32
  onCheckBoxChange,
33
33
  onToggleExpand,
34
- lines,
34
+ parentSiblings,
35
35
  isLast,
36
36
  }: TableCellProps) => (
37
37
  <td>
38
- {col.isTree && renderSpaces(level + 1, lines, isLast)}
39
- <div className='tree-title-container'>
38
+ {col.isTree && renderSpaces(level + 1, parentSiblings, isLast)}
39
+ <div className="tree-title-container">
40
40
  {col.isTree && (
41
41
  <span
42
42
  className={`tree-table-space-block last-block ${
@@ -12,7 +12,7 @@ const TableRow = React.memo(
12
12
  onRowClick,
13
13
  onToggleExpand,
14
14
  onCheckBoxChange,
15
- lines,
15
+ parentSiblings,
16
16
  isLast,
17
17
  }: TableRowProps) => (
18
18
  <tr
@@ -30,7 +30,7 @@ const TableRow = React.memo(
30
30
  select={select}
31
31
  onCheckBoxChange={onCheckBoxChange}
32
32
  onToggleExpand={onToggleExpand}
33
- lines={lines}
33
+ parentSiblings={parentSiblings}
34
34
  isLast={isLast}
35
35
  />
36
36
  ))}
@@ -98,9 +98,8 @@
98
98
  width: 100%;
99
99
  }
100
100
 
101
- tbody {
101
+ .ff-table-tree-body {
102
102
  overflow: scroll;
103
- height: 300px;
104
103
  }
105
104
 
106
105
  .tree-table {
@@ -209,7 +208,7 @@ tr:after {
209
208
 
210
209
  .tree-table-space-container {
211
210
  display: inline-flex;
212
- flex-direction: row-reverse;
211
+ // flex-direction: row-reverse;
213
212
  }
214
213
 
215
214
  .tree-title-container {
@@ -28,8 +28,8 @@ const data = [
28
28
  id: 'MOD1001', // Unique ID
29
29
  },
30
30
  level: 0,
31
- lines: 1,
32
31
  isLast: true,
32
+ parentSiblings: [true],
33
33
  },
34
34
  {
35
35
  node: {
@@ -59,7 +59,7 @@ const data = [
59
59
  parentId: 'MOD1001', // Root has no parent
60
60
  id: 'MOD1002', // Unique ID
61
61
  },
62
- level: 1,
62
+ parentSiblings: [true, false],
63
63
  lines: 1,
64
64
  },
65
65
  {
@@ -76,8 +76,7 @@ const data = [
76
76
  id: 'MOD1003', // Unique ID
77
77
  },
78
78
  level: 1,
79
- lines: 1,
80
- isLast: true,
79
+ parentSiblings: [true, false],
81
80
  },
82
81
  {
83
82
  node: {
@@ -109,7 +108,7 @@ const data = [
109
108
  id: 'MOD1004', // Unique ID
110
109
  },
111
110
  level: 2,
112
- lines: 1,
111
+ parentSiblings: [true, true, false],
113
112
  },
114
113
  {
115
114
  node: {
@@ -140,7 +139,7 @@ const data = [
140
139
  id: 'MOD1101', // Unique ID
141
140
  },
142
141
  level: 3,
143
- lines: 2,
142
+ parentSiblings: [true, true, true, false],
144
143
  },
145
144
  {
146
145
  node: {
@@ -171,7 +170,7 @@ const data = [
171
170
  id: 'MOD1102', // Unique ID
172
171
  },
173
172
  level: 3,
174
- lines: 2,
173
+ parentSiblings: [true, true, true, false],
175
174
  },
176
175
  {
177
176
  node: {
@@ -202,7 +201,7 @@ const data = [
202
201
  id: 'MOD1103', // Unique ID
203
202
  },
204
203
  level: 3,
205
- lines: 2,
204
+ parentSiblings: [true, true, true, false],
206
205
  isLast: true,
207
206
  },
208
207
  {
@@ -235,7 +234,7 @@ const data = [
235
234
  id: 'MOD1005', // Unique ID
236
235
  },
237
236
  level: 2,
238
- lines: 1,
237
+ parentSiblings: [true, true, false],
239
238
  isLast: true,
240
239
  },
241
240
  {
@@ -267,7 +266,7 @@ const data = [
267
266
  id: 'MOD1201', // Unique ID
268
267
  },
269
268
  level: 3,
270
- lines: 1,
269
+ parentSiblings: [true, false, true, false],
271
270
  },
272
271
  {
273
272
  node: {
@@ -298,7 +297,7 @@ const data = [
298
297
  id: 'MOD1202', // Unique ID
299
298
  },
300
299
  level: 3,
301
- lines: 1,
300
+ parentSiblings: [true, false, true, false],
302
301
  },
303
302
  {
304
303
  node: {
@@ -329,7 +328,39 @@ const data = [
329
328
  id: 'MOD1203', // Unique ID
330
329
  },
331
330
  level: 3,
332
- lines: 1,
331
+ parentSiblings: [true, false, true, false],
332
+ isLast: true,
333
+ },
334
+ {
335
+ node: {
336
+ subModuleCount: 15,
337
+ title: 'mod3',
338
+ scriptCount: 0,
339
+ path: '/Root',
340
+ expanded: true,
341
+ modifiedOn: '19-12-2023 15:32',
342
+ children: false,
343
+ lastExecutionOrder: 3,
344
+ imported: false,
345
+ modifiedBy: '--',
346
+ moduleCountWithScript: 1,
347
+ state: 'NEW',
348
+ key: 'MOD1001',
349
+ ver: 1,
350
+ hierarchy: 0,
351
+ assigneeCount: 0,
352
+ searchKey: '/MOD1001111110000000000',
353
+ modifiedByUname: '--',
354
+ executionOrder: 0,
355
+ createdByUname: 'Shivaprasad',
356
+ folder: true,
357
+ moduleLevelScriptCount: 0,
358
+ name: 'Root Module111',
359
+ parentId: 'MOD1001', // Root has no parent
360
+ id: 'MOD100222', // Unique ID
361
+ },
362
+ level: 1,
363
+ parentSiblings: [true, false],
333
364
  isLast: true,
334
365
  },
335
366
  ];
@@ -17,7 +17,7 @@ export interface TableCellProps {
17
17
  select: string | null;
18
18
  onCheckBoxChange: (type: string, node: any) => void;
19
19
  onToggleExpand: (node: any) => void;
20
- lines: number;
20
+ parentSiblings: boolean[];
21
21
  isLast: boolean | undefined;
22
22
  }
23
23
 
@@ -44,7 +44,7 @@ export interface TableRowProps {
44
44
  onRowClick: (e: any, node: any) => void;
45
45
  onToggleExpand: (node: any) => void;
46
46
  onCheckBoxChange: (type: string, node: any) => void;
47
- lines: number;
47
+ parentSiblings: boolean[];
48
48
  isLast: boolean | undefined;
49
49
  }
50
50
 
package/src/index.ts CHANGED
@@ -72,6 +72,7 @@ import CreateVariableSlider from './components/CreateVariable/CreateVariableSlid
72
72
  import TableWithAccordion from './components/TableWithAccordion/TableWithAccordion';
73
73
  import ProgressBar from './components/ProgressBar';
74
74
  import ChooseFile from './components/ChooseFile/ChooseFile';
75
+ import ScriptSwitchButton from './components/ScriptSwitchButton';
75
76
 
76
77
  // Utils imports
77
78
  import { checkEmpty } from './utils/checkEmpty/checkEmpty';
@@ -101,6 +102,53 @@ import FormatString from './utils/FormatString/FormatString';
101
102
  import ConditionalDropdown from './components/ConditionalDropdown/ConditionalDropdown';
102
103
  import { hasDuplicateFile } from './utils/checkDuplicates/checkDuplicates';
103
104
  import PhoneInputField from './components/PhoneInput';
105
+ import {
106
+ EMAIL_REGEX,
107
+ URL_REGEX,
108
+ PHONE_REGEX,
109
+ POSTAL_CODE_REGEX,
110
+ IPV4_REGEX,
111
+ IPV6_REGEX,
112
+ HEX_COLOR_REGEX,
113
+ PASSWORD_SIMPLE_REGEX,
114
+ PASSWORD_COMPLEX_REGEX,
115
+ ALPHABET_ONLY_REGEX,
116
+ NUMBERS_ONLY_REGEX,
117
+ ALPHANUMERIC_REGEX,
118
+ DATE_REGEX,
119
+ TIME_REGEX,
120
+ FILE_EXTENSION_REGEX,
121
+ MAC_ADDRESS_REGEX,
122
+ CREDIT_CARD_REGEX,
123
+ SSN_REGEX,
124
+ UUID_REGEX,
125
+ HTML_TAG_REGEX,
126
+ WHITESPACE_REGEX,
127
+ US_ZIP_CODE_REGEX,
128
+ USERNAME_REGEX,
129
+ INDIAN_PHONE_REGEX,
130
+ INDIAN_PIN_CODE_REGEX,
131
+ GSTIN_REGEX,
132
+ PAN_CARD_REGEX,
133
+ AADHAAR_REGEX,
134
+ VEHICLE_REGISTRATION_REGEX,
135
+ INDIAN_CURRENCY_REGEX,
136
+ INTERNATIONAL_PHONE_REGEX,
137
+ INDIAN_PASSPORT_REGEX,
138
+ DRIVING_LICENSE_REGEX,
139
+ USERNAME_SPECIAL_REGEX,
140
+ DECIMAL_NUMBER_REGEX,
141
+ HTML_ATTRIBUTE_REGEX,
142
+ RGB_COLOR_REGEX,
143
+ HSL_COLOR_REGEX,
144
+ BASE64_REGEX,
145
+ BINARY_NUMBER_REGEX,
146
+ HEXADECIMAL_NUMBER_REGEX,
147
+ ROMAN_NUMERALS_REGEX,
148
+ CURRENCY_GENERIC_REGEX,
149
+ LINKEDIN_PROFILE_REGEX,
150
+ TWITTER_HANDLE_REGEX,
151
+ } from './validations/regex';
104
152
 
105
153
  export {
106
154
  Button,
@@ -186,7 +234,8 @@ export {
186
234
  TableWithAccordion,
187
235
  ProgressBar,
188
236
  ChooseFile,
189
-
237
+ ScriptSwitchButton,
238
+
190
239
  // utils exports
191
240
  checkEmpty,
192
241
  getExtension,
@@ -205,4 +254,49 @@ export {
205
254
  useFileDropzone,
206
255
  FormatString,
207
256
  hasDuplicateFile,
257
+ EMAIL_REGEX,
258
+ URL_REGEX,
259
+ PHONE_REGEX,
260
+ POSTAL_CODE_REGEX,
261
+ IPV4_REGEX,
262
+ IPV6_REGEX,
263
+ HEX_COLOR_REGEX,
264
+ PASSWORD_SIMPLE_REGEX,
265
+ PASSWORD_COMPLEX_REGEX,
266
+ ALPHABET_ONLY_REGEX,
267
+ NUMBERS_ONLY_REGEX,
268
+ ALPHANUMERIC_REGEX,
269
+ DATE_REGEX,
270
+ TIME_REGEX,
271
+ FILE_EXTENSION_REGEX,
272
+ MAC_ADDRESS_REGEX,
273
+ CREDIT_CARD_REGEX,
274
+ SSN_REGEX,
275
+ UUID_REGEX,
276
+ HTML_TAG_REGEX,
277
+ WHITESPACE_REGEX,
278
+ US_ZIP_CODE_REGEX,
279
+ USERNAME_REGEX,
280
+ INDIAN_PHONE_REGEX,
281
+ INDIAN_PIN_CODE_REGEX,
282
+ GSTIN_REGEX,
283
+ PAN_CARD_REGEX,
284
+ AADHAAR_REGEX,
285
+ VEHICLE_REGISTRATION_REGEX,
286
+ INDIAN_CURRENCY_REGEX,
287
+ INTERNATIONAL_PHONE_REGEX,
288
+ INDIAN_PASSPORT_REGEX,
289
+ DRIVING_LICENSE_REGEX,
290
+ USERNAME_SPECIAL_REGEX,
291
+ DECIMAL_NUMBER_REGEX,
292
+ HTML_ATTRIBUTE_REGEX,
293
+ RGB_COLOR_REGEX,
294
+ HSL_COLOR_REGEX,
295
+ BASE64_REGEX,
296
+ BINARY_NUMBER_REGEX,
297
+ HEXADECIMAL_NUMBER_REGEX,
298
+ ROMAN_NUMERALS_REGEX,
299
+ CURRENCY_GENERIC_REGEX,
300
+ LINKEDIN_PROFILE_REGEX,
301
+ TWITTER_HANDLE_REGEX,
208
302
  };