pixel-react 1.5.5 → 1.5.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 (97) hide show
  1. package/.storybook/main.ts +7 -1
  2. package/lib/components/Charts/LineChart/types.d.ts +3 -0
  3. package/lib/components/DatePicker/types.d.ts +4 -0
  4. package/lib/components/Excel/ExcelContextMenu/ExcelContextMenu.d.ts +1 -7
  5. package/lib/components/Excel/ExcelFile/ExcelFileComponents/DataViewer.d.ts +1 -1
  6. package/lib/components/Excel/ExcelFile/ExcelFileComponents/Spreadsheet.d.ts +1 -0
  7. package/lib/components/Excel/ExcelFile/ExcelFileComponents/reducerFunctions.d.ts +1 -0
  8. package/lib/components/Excel/ExcelFile/ExcelFileComponents/types.d.ts +5 -0
  9. package/lib/components/FileDropzone/types.d.ts +3 -0
  10. package/lib/components/LabelEditTextField/LabelEditTextField.stories.d.ts +0 -2
  11. package/lib/components/MultiSelect/MultiSelect.stories.d.ts +0 -1
  12. package/lib/components/Select/Select.stories.d.ts +0 -1
  13. package/lib/components/StateDropdown/StateDropdown.d.ts +1 -1
  14. package/lib/components/StateDropdown/StateDropdownTypes.d.ts +3 -0
  15. package/lib/index.d.ts +52 -2
  16. package/lib/index.esm.js +950 -581
  17. package/lib/index.esm.js.map +1 -1
  18. package/lib/index.js +950 -580
  19. package/lib/index.js.map +1 -1
  20. package/package.json +1 -1
  21. package/src/assets/icons/approval_pending.svg +8 -8
  22. package/src/assets/icons/configuration.svg +3 -3
  23. package/src/assets/icons/dashboard_icon.svg +31 -0
  24. package/src/assets/icons/defects.svg +8 -8
  25. package/src/assets/icons/element.svg +4 -4
  26. package/src/assets/icons/info_user.svg +5 -0
  27. package/src/assets/icons/project_element.svg +4 -4
  28. package/src/assets/icons/step_group.svg +10 -10
  29. package/src/assets/icons/variable.svg +3 -3
  30. package/src/assets/styles/_colors.scss +1 -0
  31. package/src/components/AllProjectsDropdown/AllProjectsDropdown.scss +1 -1
  32. package/src/components/Charts/LineChart/LineChart.scss +8 -7
  33. package/src/components/Charts/LineChart/LineChart.stories.tsx +170 -51
  34. package/src/components/Charts/LineChart/LineChart.tsx +30 -27
  35. package/src/components/Charts/LineChart/types.ts +22 -20
  36. package/src/components/DatePicker/DatePicker.scss +4 -3
  37. package/src/components/DatePicker/DatePicker.stories.tsx +27 -14
  38. package/src/components/DatePicker/DatePicker.tsx +62 -49
  39. package/src/components/DatePicker/types.ts +5 -0
  40. package/src/components/Excel/ColorBarSelector/ColorBarSelector.scss +8 -4
  41. package/src/components/Excel/ColorBarSelector/ColorBarSelector.tsx +2 -2
  42. package/src/components/Excel/ExcelContextMenu/ExcelContextMenu.scss +23 -35
  43. package/src/components/Excel/ExcelContextMenu/ExcelContextMenu.tsx +3 -12
  44. package/src/components/Excel/ExcelFile/ExcelFile.scss +31 -25
  45. package/src/components/Excel/ExcelFile/ExcelFile.tsx +157 -47
  46. package/src/components/Excel/ExcelFile/ExcelFileComponents/Cell.tsx +5 -4
  47. package/src/components/Excel/ExcelFile/ExcelFileComponents/ColumnIndicator.tsx +3 -3
  48. package/src/components/Excel/ExcelFile/ExcelFileComponents/DataViewer.tsx +40 -1
  49. package/src/components/Excel/ExcelFile/ExcelFileComponents/RowIndicator.tsx +3 -3
  50. package/src/components/Excel/ExcelFile/ExcelFileComponents/Spreadsheet.scss +10 -0
  51. package/src/components/Excel/ExcelFile/ExcelFileComponents/Spreadsheet.tsx +9 -45
  52. package/src/components/Excel/ExcelFile/ExcelFileComponents/reducer.ts +43 -2
  53. package/src/components/Excel/ExcelFile/ExcelFileComponents/reducerFunctions.ts +40 -5
  54. package/src/components/Excel/ExcelFile/ExcelFileComponents/types.ts +3 -1
  55. package/src/components/Excel/ExcelFile.stories.tsx +42 -43
  56. package/src/components/Excel/ExcelToolBar/ExcelToolBar.scss +80 -20
  57. package/src/components/Excel/ExcelToolBar/ExcelToolBar.tsx +171 -159
  58. package/src/components/FileDropzone/Dropzone.tsx +2 -0
  59. package/src/components/FileDropzone/FileDropzone.scss +1 -2
  60. package/src/components/FileDropzone/FileDropzone.stories.tsx +3 -0
  61. package/src/components/FileDropzone/FileDropzone.tsx +11 -3
  62. package/src/components/FileDropzone/types.ts +5 -0
  63. package/src/components/Icon/Icon.stories.tsx +5 -4
  64. package/src/components/Icon/iconList.ts +4 -0
  65. package/src/components/MultiSelect/MultiSelect.scss +41 -50
  66. package/src/components/MultiSelect/MultiSelect.tsx +48 -48
  67. package/src/components/Select/Select.scss +11 -1
  68. package/src/components/Select/Select.tsx +2 -2
  69. package/src/components/StateDropdown/StateDropdown.stories.tsx +5 -0
  70. package/src/components/StateDropdown/StateDropdown.tsx +27 -12
  71. package/src/components/StateDropdown/StateDropdownTypes.tsx +6 -0
  72. package/src/components/TableTree/TableTree.scss +17 -15
  73. package/src/components/TableTree/TableTree.tsx +42 -40
  74. package/src/index.ts +2 -0
  75. package/lib/assets/fonts/Poppins-Bold.ttf +0 -0
  76. package/lib/assets/fonts/Poppins-Medium.ttf +0 -0
  77. package/lib/assets/fonts/Poppins-Regular.ttf +0 -0
  78. package/lib/assets/fonts/Poppins-SemiBold.ttf +0 -0
  79. package/lib/components/AddButton/AddButton.d.ts +0 -5
  80. package/lib/components/AddButton/AddButton.stories.d.ts +0 -6
  81. package/lib/components/AddButton/index.d.ts +0 -1
  82. package/lib/components/AddButton/types.d.ts +0 -4
  83. package/lib/components/AttachImage/AttachImage.stories.d.ts +0 -7
  84. package/lib/components/Charts/BarChart/BarChart.stories.d.ts +0 -6
  85. package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts +0 -8
  86. package/lib/components/Charts/LineChart/LineChart.stories.d.ts +0 -7
  87. package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts +0 -8
  88. package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts +0 -6
  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/ContextMenu/ContextMenu.d.ts +0 -4
  92. package/lib/components/Excel/ExcelFile.stories.d.ts +0 -6
  93. package/lib/components/ExcelFile/ChangeExcelStyles.d.ts +0 -14
  94. package/lib/components/ExcelFile/ImportExcelStyles.d.ts +0 -24
  95. package/lib/components/StatusCard/StatusCard.stories.d.ts +0 -11
  96. package/lib/utils/getSequentialPayload/getSequentialPayload.stories.d.ts +0 -10
  97. /package/lib/components/ExcelFile/{ColorBarSelector → ColorBarselector}/ColorBarSelector.d.ts +0 -0
@@ -79,64 +79,55 @@
79
79
  top: -6px;
80
80
  pointer-events: none;
81
81
  }
82
- .ff-multiselect-chip-parent-container{
83
- width: 100%;
82
+ .ff-multiselect-chip-container {
84
83
  display: flex;
85
- justify-content: space-between;
86
- .ff-multiselect-chip-container {
87
- display: flex;
88
- flex-wrap: wrap;
89
- align-items: center;
90
- gap: 5px;
91
- .ff-multiselect-chip {
92
- @include flex-center;
93
- box-sizing: border-box;
94
- border: 0.5px solid #f1ebf2;
95
- padding: 0 1px 0 4px;
96
- gap: 4px;
97
- height: 16px;
98
- border-radius: 15px;
99
- .ff-multiselect-chip-label {
100
- @extend .fontXs;
101
- line-height: 14px;
102
- color: var(--tooltip-bg-color);
103
- &.label-padding {
104
- padding: 5px 2px;
105
- }
106
- }
107
- .ff-multiselect-chip-close-icon {
108
- color: var(--brand-color);
109
- cursor: pointer;
84
+ flex-wrap: wrap;
85
+ align-items: center;
86
+ gap: 5px;
87
+ .ff-multiselect-chip {
88
+ @include flex-center;
89
+ box-sizing: border-box;
90
+ border: 0.5px solid var(--tabs-border-color);
91
+ padding-left: 4px;
92
+ gap: 4px;
93
+ height: 16px;
94
+ border-radius: 15px;
95
+ .ff-multiselect-chip-label {
96
+ line-height: 14px;
97
+ color: var(--tooltip-bg-color);
98
+ &.label-padding {
99
+ padding-right: 3px;
110
100
  }
111
101
  }
112
- .ff-multiselect-input-container {
113
- flex: 1;
114
- min-width: 20px;
115
- input {
116
- width: 100%;
117
- min-width: 30px;
118
- max-width: calc(100% - 0px);
119
- padding: 2px;
120
- box-sizing: border-box;
121
- border: none;
122
- font-size: 12px;
123
- &:focus {
124
- outline: none;
125
- }
126
- }
102
+ .ff-multiselect-chip-close-icon {
103
+ color: var(--brand-color);
104
+ cursor: pointer;
105
+ padding: 0px;
127
106
  }
128
107
  }
129
- .ff-multiselect-more-chip {
130
- display: flex;
131
- align-items: center;
132
- width: 16px;
133
- @extend .fontSm;
134
- font-weight: 600;
135
- line-height: 16px;
136
- color: var(--brand-color);
108
+ .ff-multiselect-input-container {
109
+ flex: 1;
110
+ min-width: 20px;
111
+ input {
112
+ width: 100%;
113
+ min-width: 30px;
114
+ max-width: calc(100% - 0px);
115
+ padding: 2px;
116
+ box-sizing: border-box;
117
+ border: none;
118
+ font-size: 12px;
119
+ &:focus {
120
+ outline: none;
121
+ }
122
+ }
137
123
  }
138
124
  }
139
125
  }
126
+ .ff-multiselect-more-chip {
127
+ display: flex;
128
+ align-items: center;
129
+ width: 16px;
130
+ }
140
131
  &__toggle {
141
132
  display: flex;
142
133
  align-items: center;
@@ -38,7 +38,9 @@ const ChipElement = ({
38
38
  title={label?.length > 25 ? label : ''}
39
39
  zIndex={zIndex + 1}
40
40
  >
41
- {truncateText(label, 25)}
41
+ <Typography fontSize={10} lineHeight={'14px'} className="stye">
42
+ {truncateText(label, 25)}
43
+ </Typography>
42
44
  </Tooltip>
43
45
  </span>
44
46
  {!disableChip && (
@@ -342,6 +344,7 @@ const MultiSelect = ({
342
344
  (isFieldSkipped && required),
343
345
  'default-label': !isOpen && !selectedOptions?.length,
344
346
  })}
347
+ required={required}
345
348
  children={label}
346
349
  />
347
350
  ) : (
@@ -355,26 +358,10 @@ const MultiSelect = ({
355
358
  )}
356
359
 
357
360
  {!withSelectButton && (
358
- <div className='ff-multiselect-chip-parent-container'>
359
- <div className="ff-multiselect-chip-container">
360
- {displayCount ? (
361
- <>
362
- {selectedOptions
363
- .slice(0, maxVisibleChips)
364
- .map((option) => (
365
- <ChipElement
366
- zIndex={zIndex}
367
- key={getLabel(option, labelAccessor)}
368
- label={getLabel(option, labelAccessor) || ''}
369
- onChipCloseClick={(e) =>
370
- handleChipCloseClick(option, e)
371
- }
372
- disableChip={option?.isDisabled || false}
373
- />
374
- ))}
375
- </>
376
- ) : (
377
- selectedOptions.map((option) => (
361
+ <div className="ff-multiselect-chip-container">
362
+ {displayCount ? (
363
+ <>
364
+ {selectedOptions.slice(0, maxVisibleChips).map((option) => (
378
365
  <ChipElement
379
366
  zIndex={zIndex}
380
367
  key={getLabel(option, labelAccessor)}
@@ -384,38 +371,51 @@ const MultiSelect = ({
384
371
  }
385
372
  disableChip={option?.isDisabled || false}
386
373
  />
387
- ))
388
- )}
389
- <div className="ff-multiselect-input-container">
390
- <input
391
- value={searchedKeyword}
392
- type={type}
393
- autoComplete="off"
394
- placeholder={placeholderForSearching}
395
- ref={inputRef}
396
- onChange={handleSearch}
397
- onKeyDown={handleKeyEnter}
398
- id="input-ele"
399
- className="ff-select-input"
400
- style={{
401
- display:
402
- isOpen || selectedOptions.length ? 'inherit' : 'none',
403
- }}
374
+ ))}
375
+ </>
376
+ ) : (
377
+ selectedOptions.map((option) => (
378
+ <ChipElement
379
+ zIndex={zIndex}
380
+ key={getLabel(option, labelAccessor)}
381
+ label={getLabel(option, labelAccessor) || ''}
382
+ onChipCloseClick={(e) => handleChipCloseClick(option, e)}
383
+ disableChip={option?.isDisabled || false}
404
384
  />
405
- </div>
406
- </div>
407
- {hiddenCount > 0 && displayCount && (
408
- <div
409
- className="ff-multiselect-more-chip"
410
- onClick={toggleDropdown}
411
- >
412
- +{hiddenCount}
413
- </div>
385
+ ))
414
386
  )}
387
+ <div className="ff-multiselect-input-container">
388
+ <input
389
+ value={searchedKeyword}
390
+ type={type}
391
+ autoComplete="off"
392
+ placeholder={placeholderForSearching}
393
+ ref={inputRef}
394
+ onChange={handleSearch}
395
+ onKeyDown={handleKeyEnter}
396
+ id="input-ele"
397
+ className="ff-select-input"
398
+ style={{
399
+ display:
400
+ isOpen || selectedOptions.length ? 'inherit' : 'none',
401
+ }}
402
+ />
403
+ </div>
415
404
  </div>
416
405
  )}
417
406
  </div>
418
-
407
+ {hiddenCount > 0 && displayCount && (
408
+ <div className="ff-multiselect-more-chip" onClick={toggleDropdown}>
409
+ <Typography
410
+ fontSize={12}
411
+ fontWeight="semi-bold"
412
+ lineHeight="16px"
413
+ color="var(--brand-color)"
414
+ >
415
+ +{hiddenCount}
416
+ </Typography>
417
+ </div>
418
+ )}
419
419
  <div
420
420
  onClick={(e) => {
421
421
  toggleDropdown(e);
@@ -38,7 +38,17 @@
38
38
  box-sizing: border-box;
39
39
 
40
40
  &:hover {
41
- @include select-state-style(var(--ff-select-brand-color));
41
+ border-color: var(--ff-select-brand-color);
42
+
43
+ .ff-select-labels {
44
+ color: var(--ff-select-default-color);
45
+ }
46
+
47
+ .ff-select-arrows-wrapper {
48
+ .ff-select-arrows {
49
+ @include svg-path-style(var(--ff-select-text-hover-color));
50
+ }
51
+ }
42
52
  }
43
53
 
44
54
  .ff-select-inputField {
@@ -216,8 +216,8 @@ const Select: FC<SelectProps> = ({
216
216
  {errorMsg && (
217
217
  <Typography
218
218
  as="div"
219
- lineHeight="12px"
220
- fontSize={8}
219
+ lineHeight="15px"
220
+ fontSize={10}
221
221
  color="var(--error_light)"
222
222
  className="ff-select-error-msg"
223
223
  >
@@ -1,5 +1,6 @@
1
1
  import type { Meta, StoryObj } from '@storybook/react';
2
2
  import StateDropdown from './StateDropdown';
3
+ import React from 'react';
3
4
 
4
5
  const meta: Meta<typeof StateDropdown> = {
5
6
  title: 'Components/StateDropdown',
@@ -23,6 +24,8 @@ export const Disable: Story = {
23
24
  isApprovePage: false,
24
25
  disabled: true,
25
26
  userHasOnlyViewAccess: true,
27
+ showBorder: true,
28
+ height:24,
26
29
  },
27
30
  };
28
31
 
@@ -91,6 +94,8 @@ export const NewState: Story = {
91
94
  disabled={false}
92
95
  isOnlyReviewer={false}
93
96
  userHasOnlyViewAccess={false}
97
+ showBorder={true}
98
+ height={24}
94
99
  />
95
100
  );
96
101
  },
@@ -11,6 +11,9 @@ const StateDropdown = ({
11
11
  disabled = false,
12
12
  isOnlyReviewer = false,
13
13
  userHasOnlyViewAccess = false,
14
+ showBorder=true,
15
+ height=24,
16
+ zIndex=100,
14
17
  }: StateDropdownProps) => {
15
18
  let currentState = value.toUpperCase();
16
19
  let content;
@@ -129,9 +132,11 @@ const StateDropdown = ({
129
132
  optionsList={options}
130
133
  selectedOption={selectedOption}
131
134
  showLabel={false}
132
- showBorder={false}
135
+ showBorder={showBorder}
133
136
  disableInput={true}
134
- height={24}
137
+ height={height}
138
+ selectedOptionColor={'var(--brand-color'}
139
+ optionZIndex={zIndex}
135
140
  />
136
141
  ) : (
137
142
  <Select
@@ -141,9 +146,11 @@ const StateDropdown = ({
141
146
  optionsList={options}
142
147
  selectedOption={selectedOption}
143
148
  showLabel={false}
144
- showBorder={false}
149
+ showBorder={showBorder}
145
150
  disableInput={true}
146
- height={24}
151
+ height={height}
152
+ selectedOptionColor={'var(--brand-color'}
153
+ optionZIndex={zIndex}
147
154
  />
148
155
  );
149
156
  } else if (
@@ -158,9 +165,11 @@ const StateDropdown = ({
158
165
  optionsList={options}
159
166
  selectedOption={selectedOption}
160
167
  showLabel={false}
161
- showBorder={false}
168
+ showBorder={showBorder}
162
169
  disableInput={true}
163
- height={24}
170
+ height={height}
171
+ selectedOptionColor={'var(--brand-color'}
172
+ optionZIndex={zIndex}
164
173
  />
165
174
  );
166
175
  } else if (currentState === 'APPROVED') {
@@ -172,9 +181,11 @@ const StateDropdown = ({
172
181
  optionsList={options}
173
182
  selectedOption={selectedOption}
174
183
  showLabel={false}
175
- showBorder={false}
184
+ showBorder={showBorder}
176
185
  disableInput={true}
177
- height={24}
186
+ height={height}
187
+ selectedOptionColor={'var(--brand-color'}
188
+ optionZIndex={zIndex}
178
189
  />
179
190
  );
180
191
  } else if (currentState === 'REJECTED' && userHasOnlyViewAccess) {
@@ -186,9 +197,11 @@ const StateDropdown = ({
186
197
  optionsList={options}
187
198
  selectedOption={selectedOption}
188
199
  showLabel={false}
189
- showBorder={false}
200
+ showBorder={showBorder}
190
201
  disableInput={true}
191
- height={24}
202
+ height={height}
203
+ selectedOptionColor={'var(--brand-color'}
204
+ optionZIndex={zIndex}
192
205
  />
193
206
  );
194
207
  } else if (currentState === 'NEW' && userHasOnlyViewAccess) {
@@ -200,9 +213,11 @@ const StateDropdown = ({
200
213
  optionsList={options}
201
214
  selectedOption={selectedOption}
202
215
  showLabel={false}
203
- showBorder={false}
216
+ showBorder={showBorder}
204
217
  disableInput={true}
205
- height={24}
218
+ height={height}
219
+ selectedOptionColor={'var(--brand-color'}
220
+ optionZIndex={zIndex}
206
221
  />
207
222
  );
208
223
  } else {
@@ -17,5 +17,11 @@ export interface StateDropdownProps{
17
17
  userHasOnlyViewAccess:boolean;
18
18
 
19
19
  handleStateValueClick:()=>void;
20
+
21
+ showBorder?:boolean;
22
+
23
+ height?:number;
24
+
25
+ zIndex?:number;
20
26
  }
21
27
 
@@ -108,17 +108,21 @@
108
108
  padding: 0 8px;
109
109
  white-space: nowrap;
110
110
  text-overflow: ellipsis;
111
-
112
111
  &:first-child {
113
- position: sticky;
114
-
115
112
  padding-left: calc(var(--level) * var(--indent-size));
116
113
  height: 32px;
117
- position: sticky; /* Make first td sticky */
118
- left: 0;
119
- z-index: 10; /* Ensure it stays on top of the other cells */
120
- background-color: var(--slider-table-color);
121
- // Vertical line connecting the node to the parent
114
+ z-index: 0;
115
+ }
116
+
117
+ .first-div {
118
+ background-color: white;
119
+ display: flex;
120
+ width: 100%;
121
+ height: 32px;
122
+
123
+ &:hover {
124
+ background-color: var(--hover-color);
125
+ }
122
126
  &::before {
123
127
  content: '';
124
128
  position: absolute;
@@ -126,7 +130,6 @@
126
130
  left: calc(var(--level) * var(--indent-size) - 4px);
127
131
  width: 1px;
128
132
  height: calc(var(--total-children-height));
129
- // background-color: var(--tree-connecting-lines-color);
130
133
  background-color: var(--tree-connecting-lines-color);
131
134
  z-index: 9999;
132
135
  }
@@ -155,15 +158,14 @@
155
158
  content: none;
156
159
  }
157
160
  }
158
-
159
- th:first-child,
160
- td:first-child {
161
- position: sticky;
162
- left: 0;
163
- }
164
161
  }
165
162
 
166
163
  .ff-title-action-container {
167
164
  display: none;
168
165
  align-items: center;
169
166
  }
167
+ th:first-child,
168
+ td:first-child {
169
+ position: sticky;
170
+ left: 0;
171
+ }
@@ -169,46 +169,48 @@ const TableTree = ({
169
169
  if (column.accessor === 'title') {
170
170
  return (
171
171
  <td className={`ff-title-container ${isLast ? 'ff-is-last' : ''}`}>
172
- <span className="ff-toggle-folder" onClick={handleToggleExpand}>
173
- {node.folder && (
174
- <span
175
- className={`ff-toggle-arrow-icon ${
176
- isExpanded ? 'ff-expanded' : 'ff-collapsed'
177
- }`}
178
- >
179
- <Arrow />
180
- </span>
181
- )}
182
- </span>
183
-
184
- <div
185
- className="ff-title"
186
- style={{ fontWeight: node.folder ? 600 : 400 }}
187
- onClick={(event) => onClick(event, node)}
188
- >
189
- {select === 'checkbox' && (
190
- <Checkbox
191
- checked={selected.includes(node.key)}
192
- onChange={(e) => handleCheckBoxChange(e, node)}
193
- />
194
- )}
195
- {select === 'radio' && (
196
- <RadioButton
197
- name={node.title}
198
- value={node.key}
199
- onChange={(e) => handleCheckBoxChange(e, node)}
200
- />
201
- )}
202
-
203
- <Typography className="ff-title-label" fontWeight="medium">
204
- {prepareData(node, column)}
205
- </Typography>
206
-
207
- {column.actions && (
208
- <div className="ff-title-action-container">
209
- {column.actions(node)}
210
- </div>
211
- )}
172
+ <div className="first-div">
173
+ {' '}
174
+ <span className="ff-toggle-folder" onClick={handleToggleExpand}>
175
+ {node.folder && (
176
+ <span
177
+ className={`ff-toggle-arrow-icon ${
178
+ isExpanded ? 'ff-expanded' : 'ff-collapsed'
179
+ }`}
180
+ >
181
+ <Arrow />
182
+ </span>
183
+ )}
184
+ </span>
185
+ <div
186
+ className="ff-title"
187
+ style={{ fontWeight: node.folder ? 600 : 400 }}
188
+ onClick={(event) => onClick(event, node)}
189
+ >
190
+ {select === 'checkbox' && (
191
+ <Checkbox
192
+ checked={selected.includes(node.key)}
193
+ onChange={(e) => handleCheckBoxChange(e, node)}
194
+ />
195
+ )}
196
+ {select === 'radio' && (
197
+ <RadioButton
198
+ name={node.title}
199
+ value={node.key}
200
+ onChange={(e) => handleCheckBoxChange(e, node)}
201
+ />
202
+ )}
203
+
204
+ <Typography className="ff-title-label" fontWeight="medium">
205
+ {prepareData(node, column)}
206
+ </Typography>
207
+
208
+ {column.actions && (
209
+ <div className="ff-title-action-container">
210
+ {column.actions(node)}
211
+ </div>
212
+ )}
213
+ </div>
212
214
  </div>
213
215
  </td>
214
216
  );
package/src/index.ts CHANGED
@@ -64,6 +64,7 @@ import StatusCard from './components/StatusCard';
64
64
  import VariableDropdown from './components/Editor/VariableDropdown';
65
65
 
66
66
  import LineChart from './components/Charts/LineChart';
67
+ import DownloadClient from './components/DownloadClient/DownloadClient';
67
68
  // Utils imports
68
69
  import { checkEmpty } from './utils/checkEmpty/checkEmpty';
69
70
  import {
@@ -157,6 +158,7 @@ export {
157
158
  ToggleSwitch,
158
159
  Avatar,
159
160
  VariableDropdown,
161
+ DownloadClient,
160
162
  // utils exports
161
163
  checkEmpty,
162
164
  getExtension,
Binary file
Binary file
@@ -1,5 +0,0 @@
1
- import React from 'react';
2
- import './AddButton.scss';
3
- import { AddButtonProps } from './types';
4
- declare const AddButton: React.FC<AddButtonProps>;
5
- export default AddButton;
@@ -1,6 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react';
2
- import AddButton from './AddButton';
3
- declare const meta: Meta<typeof AddButton>;
4
- type Story = StoryObj<typeof AddButton>;
5
- export declare const PrimaryAddButton: Story;
6
- export default meta;
@@ -1 +0,0 @@
1
- export { default } from './AddButton';
@@ -1,4 +0,0 @@
1
- export interface AddButtonProps {
2
- name: string;
3
- onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
4
- }
@@ -1,7 +0,0 @@
1
- import { Meta, StoryObj } from '@storybook/react';
2
- import AttachImage from './AttachImage';
3
- import { AttachImageProps } from './types';
4
- declare const meta: Meta<typeof AttachImage>;
5
- export default meta;
6
- type Story = StoryObj<AttachImageProps>;
7
- export declare const Default: Story;
@@ -1,6 +0,0 @@
1
- import { Meta, StoryObj } from '@storybook/react';
2
- import BarChart from './BarChart';
3
- declare const meta: Meta<typeof BarChart>;
4
- export default meta;
5
- type Story = StoryObj<typeof BarChart>;
6
- export declare const BarChartDashboard: Story;
@@ -1,8 +0,0 @@
1
- import { Meta, StoryObj } from '@storybook/react';
2
- import IconRadialChart from './IconRadialChart';
3
- declare const meta: Meta<typeof IconRadialChart>;
4
- export default meta;
5
- type Story = StoryObj<typeof IconRadialChart>;
6
- export declare const Default: Story;
7
- export declare const Mobile: Story;
8
- export declare const WithoutIcon: Story;
@@ -1,7 +0,0 @@
1
- import { Meta, StoryObj } from '@storybook/react';
2
- import LineChart from './LineChart';
3
- import { LineChartProps } from './types';
4
- declare const meta: Meta<typeof LineChart>;
5
- export default meta;
6
- export declare const DefaultLineChart: StoryObj<LineChartProps>;
7
- export declare const StatusLineChart: StoryObj<LineChartProps>;
@@ -1,8 +0,0 @@
1
- import { Meta, StoryObj } from '@storybook/react';
2
- import MultiRadialChart from './MultiRadialChart';
3
- declare const meta: Meta<typeof MultiRadialChart>;
4
- export default meta;
5
- type Story = StoryObj<typeof MultiRadialChart>;
6
- export declare const Default: Story;
7
- export declare const numberLegend: Story;
8
- export declare const PillLegend: Story;
@@ -1,6 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react';
2
- import ConnectingBranch from './ConnectingBranch';
3
- declare const meta: Meta<typeof ConnectingBranch>;
4
- export default meta;
5
- type Story = StoryObj<typeof ConnectingBranch>;
6
- export declare const Default: Story;
@@ -1,10 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react';
2
- import EditTextField from './EditTextField';
3
- import '../../assets/styles/_colors.scss';
4
- import './EditTextField.scss';
5
- declare const meta: Meta<typeof EditTextField>;
6
- type Story = StoryObj<typeof EditTextField>;
7
- export declare const textFieldWithLabel: Story;
8
- export declare const textFieldWithOutLabel: Story;
9
- export declare const openTextField: Story;
10
- export default meta;