pixel-react 1.10.1 → 1.10.3
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/lib/ComponentProps/TreeNodeProps.d.ts +24 -22
- package/lib/components/TableTree/Components/AddModule/AddModule.d.ts +7 -0
- package/lib/components/TableTree/Components/TableBody.d.ts +1 -2
- package/lib/components/TableTree/Components/TableCell.d.ts +1 -1
- package/lib/components/TableTree/Components/TableRow.d.ts +1 -1
- package/lib/components/TableTree/Utils/addNewRow.d.ts +7 -0
- package/lib/components/TableTree/types.d.ts +20 -0
- package/lib/index.d.ts +33 -23
- package/lib/index.esm.js +1129 -1166
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +1129 -1166
- package/lib/index.js.map +1 -1
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/lib/utils/handleTreeNodeSelect/handleTreeNodeSelect.d.ts +1 -1
- package/package.json +1 -1
- package/src/ComponentProps/TreeNodeProps.ts +24 -22
- package/src/assets/icons/approval_pending.svg +8 -8
- package/src/assets/icons/configuration.svg +3 -3
- package/src/assets/icons/defects.svg +8 -8
- package/src/assets/icons/element.svg +4 -4
- package/src/assets/icons/project_element.svg +4 -4
- package/src/assets/icons/step_group.svg +10 -10
- package/src/assets/icons/variable.svg +3 -3
- package/src/assets/icons/web_service_icon.svg +3 -3
- package/src/components/TableTree/Components/AddModule/AddModule.scss +6 -0
- package/src/components/TableTree/Components/AddModule/AddModule.tsx +37 -0
- package/src/components/TableTree/Components/TableBody.tsx +40 -33
- package/src/components/TableTree/Components/TableCell.tsx +12 -5
- package/src/components/TableTree/Components/TableRow.tsx +4 -0
- package/src/components/TableTree/TableTree.tsx +43 -20
- package/src/components/TableTree/Utils/addNewRow.ts +51 -0
- package/src/components/TableTree/types.ts +20 -0
- package/src/utils/handleTreeNodeSelect/handleTreeNodeSelect.ts +6 -1
- package/lib/1fb4472b34e4fe07.css +0 -1
- package/lib/StyleGuide/ColorPalette/ColorPalette.stories.d.ts +0 -6
- package/lib/StyleGuide/Typography/Typography.stories.d.ts +0 -6
- package/lib/assets/fonts/Poppins-Bold.ttf +0 -0
- package/lib/assets/fonts/Poppins-Medium.ttf +0 -0
- package/lib/assets/fonts/Poppins-Regular.ttf +0 -0
- package/lib/assets/fonts/Poppins-SemiBold.ttf +0 -0
- package/lib/components/Accordion/Accordion.stories.d.ts +0 -6
- package/lib/components/AddButton/AddButton.d.ts +0 -5
- package/lib/components/AddButton/AddButton.stories.d.ts +0 -6
- package/lib/components/AddButton/index.d.ts +0 -1
- package/lib/components/AddButton/types.d.ts +0 -4
- package/lib/components/AddResourceButton/AddButton.stories.d.ts +0 -8
- package/lib/components/AddVariables/AddVariables.d.ts +0 -5
- package/lib/components/AddVariables/index.d.ts +0 -1
- package/lib/components/AddVariables/types.d.ts +0 -35
- package/lib/components/AllProjectsDropdown/AllProjectsDropdown.stories.d.ts +0 -7
- package/lib/components/AppHeader/AppHeader.stories.d.ts +0 -7
- package/lib/components/AttachImage/AttachImage.stories.d.ts +0 -7
- package/lib/components/AttachmentButton/AttachmentButton.stories.d.ts +0 -9
- package/lib/components/Avatar/Avatar.stories.d.ts +0 -10
- package/lib/components/Button/Button.stories.d.ts +0 -13
- package/lib/components/Charts/BarChart/BarChart.stories.d.ts +0 -6
- package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.d.ts +0 -7
- package/lib/components/Charts/DonutChart/DonutChart.stories.d.ts +0 -6
- package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts +0 -8
- package/lib/components/Charts/LineChart/LineChart.stories.d.ts +0 -7
- package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts +0 -8
- package/lib/components/Charts/PieChart/PieChart.stories.d.ts +0 -7
- package/lib/components/Charts/RadialChart/RadialChart.stories.d.ts +0 -6
- package/lib/components/Checkbox/Checkbox.stories.d.ts +0 -8
- package/lib/components/Chip/Chip.stories.d.ts +0 -14
- package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts +0 -6
- package/lib/components/DatePicker/DatePicker.stories.d.ts +0 -9
- package/lib/components/DragAndDrop/DragAndDrop.stories.d.ts +0 -6
- package/lib/components/Drawer/Drawer.stories.d.ts +0 -12
- package/lib/components/EditTextField/EditTextField.stories.d.ts +0 -10
- package/lib/components/Editor/Editor.stories.d.ts +0 -6
- package/lib/components/Excel/ContextMenu/ContextMenu.d.ts +0 -4
- package/lib/components/Excel/ExcelFile.stories.d.ts +0 -6
- package/lib/components/ExcelFile/ChangeExcelStyles.d.ts +0 -14
- package/lib/components/ExcelFile/ColorBarSelector/ColorBarSelector.d.ts +0 -8
- package/lib/components/ExcelFile/ContextMenu/ContextMenu.d.ts +0 -4
- package/lib/components/ExcelFile/ExcelFile/Excel/ActiveCell.d.ts +0 -7
- package/lib/components/ExcelFile/ExcelFile/Excel/Cell.d.ts +0 -4
- package/lib/components/ExcelFile/ExcelFile/Excel/ColumnIndicator.d.ts +0 -5
- package/lib/components/ExcelFile/ExcelFile/Excel/Copied.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/CornerIndicator.d.ts +0 -5
- package/lib/components/ExcelFile/ExcelFile/Excel/DataEditor.d.ts +0 -5
- package/lib/components/ExcelFile/ExcelFile/Excel/DataViewer.d.ts +0 -8
- package/lib/components/ExcelFile/ExcelFile/Excel/FloatingRect.d.ts +0 -10
- package/lib/components/ExcelFile/ExcelFile/Excel/HeaderRow.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/Row.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/RowIndicator.d.ts +0 -5
- package/lib/components/ExcelFile/ExcelFile/Excel/Selected.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/Spreadsheet.d.ts +0 -80
- package/lib/components/ExcelFile/ExcelFile/Excel/Table.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/actions.d.ts +0 -174
- package/lib/components/ExcelFile/ExcelFile/Excel/areModelsEqual.d.ts +0 -1
- package/lib/components/ExcelFile/ExcelFile/Excel/context.d.ts +0 -8
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/engine.d.ts +0 -22
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/formula.d.ts +0 -17
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/index.d.ts +0 -2
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-graph.d.ts +0 -21
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-hash.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-set.d.ts +0 -24
- package/lib/components/ExcelFile/ExcelFile/Excel/index.d.ts +0 -13
- package/lib/components/ExcelFile/ExcelFile/Excel/matrix.d.ts +0 -67
- package/lib/components/ExcelFile/ExcelFile/Excel/point-range.d.ts +0 -22
- package/lib/components/ExcelFile/ExcelFile/Excel/point.d.ts +0 -11
- package/lib/components/ExcelFile/ExcelFile/Excel/reducer.d.ts +0 -27
- package/lib/components/ExcelFile/ExcelFile/Excel/selection.d.ts +0 -95
- package/lib/components/ExcelFile/ExcelFile/Excel/types.d.ts +0 -178
- package/lib/components/ExcelFile/ExcelFile/Excel/use-dispatch.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/use-selector.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/util.d.ts +0 -44
- package/lib/components/ExcelFile/ExcelFile/ExcelFile.d.ts +0 -19
- package/lib/components/ExcelFile/ExcelFile.stories.d.ts +0 -6
- package/lib/components/ExcelFile/ExcelSheetBar/ExcelSheetBar.d.ts +0 -12
- package/lib/components/ExcelFile/ExcelToolBar/ExcelToolBar.d.ts +0 -15
- package/lib/components/ExcelFile/ImportExcelStyles.d.ts +0 -24
- package/lib/components/ExcelFile/Types.d.ts +0 -129
- package/lib/components/ExcelFile/index.d.ts +0 -1
- package/lib/components/ExpandableMenu/ExpandableMenu.stories.d.ts +0 -7
- package/lib/components/FF_Captcha/captcha.stories.d.ts +0 -8
- package/lib/components/FileDropzone/FileDropzone.stories.d.ts +0 -8
- package/lib/components/Form/Form.stories.d.ts +0 -7
- package/lib/components/GridLayout/GridLayout.stories.d.ts +0 -8
- package/lib/components/HighlightText/HighlightText.stories.d.ts +0 -6
- package/lib/components/Icon/Icon.stories.d.ts +0 -8
- package/lib/components/IconButton/IconButton.stories.d.ts +0 -7
- package/lib/components/IconRadioGroup/IconRadioGroup.stories.d.ts +0 -7
- package/lib/components/Input/Input.stories.d.ts +0 -9
- package/lib/components/InputWithDropdown/InputWithDropdown.stories.d.ts +0 -9
- package/lib/components/LabelEditTextField/LabelEditTextField.stories.d.ts +0 -13
- package/lib/components/LazyLoad/LazyLoad.stories.d.ts +0 -6
- package/lib/components/MachineInputField/MachineInputField.stories.d.ts +0 -6
- package/lib/components/MenuOption/MenuOption.stories.d.ts +0 -16
- package/lib/components/MiniModal/MiniModal.stories.d.ts +0 -10
- package/lib/components/Modal/Modal.stories.d.ts +0 -7
- package/lib/components/ModulesChip/ModuleChip.stories.d.ts +0 -6
- package/lib/components/MultiSelect/MultiSelect.stories.d.ts +0 -11
- package/lib/components/NLPInput/NlpInput.stories.d.ts +0 -7
- package/lib/components/NLPInput/type.d.ts +0 -70
- package/lib/components/Paper/Paper.stories.d.ts +0 -11
- package/lib/components/RadioButton/RadioButton.stories.d.ts +0 -10
- package/lib/components/RadioGroup/RadioGroup.stories.d.ts +0 -9
- package/lib/components/Search/Search.stories.d.ts +0 -6
- package/lib/components/Select/Select.stories.d.ts +0 -14
- package/lib/components/Select/components/Dropdown/Dropdown.d.ts +0 -4
- package/lib/components/Select/components/Dropdown/dropdownTypes.d.ts +0 -17
- package/lib/components/SequentialConnectingBranch/SequentialConnectingBranch.stories.d.ts +0 -6
- package/lib/components/SequentialConnectingBranch/components/AddBrowserModal/AddBrowserModal.d.ts +0 -4
- package/lib/components/SequentialConnectingBranch/components/AddBrowserModal/types.d.ts +0 -3
- package/lib/components/SequentialConnectingBranch/components/DatasetListModal/DatasetListModal.d.ts +0 -4
- package/lib/components/SequentialConnectingBranch/components/DatasetListModal/types.d.ts +0 -3
- package/lib/components/StateDropdown/StateDropdown.stories.d.ts +0 -10
- package/lib/components/StatusButton/StatusButton.stories.d.ts +0 -14
- package/lib/components/StatusCard/StatusCard.stories.d.ts +0 -11
- package/lib/components/Table/Table.stories.d.ts +0 -13
- package/lib/components/TableTree/TableTree.stories.d.ts +0 -7
- package/lib/components/Tabs/Tabs.stories.d.ts +0 -9
- package/lib/components/TextArea/Textarea.stories.d.ts +0 -9
- package/lib/components/Toast/Toast.stories.d.ts +0 -6
- package/lib/components/Toastify/Toastify.stories.d.ts +0 -6
- package/lib/components/Toggle/Toggle.stories.d.ts +0 -12
- package/lib/components/Tooltip/Tooltip.stories.d.ts +0 -15
- package/lib/components/Typography/Typography.stories.d.ts +0 -10
- package/lib/components/VariableInput/VariableInput.stories.d.ts +0 -6
- package/lib/utils/checkEmpty/checkEmpty.stories.d.ts +0 -6
- package/lib/utils/compareArrays/compareArrays.stories.d.ts +0 -6
- package/lib/utils/compareObjects/compareObjects.stories.d.ts +0 -6
- package/lib/utils/debounce/debounce.stories.d.ts +0 -6
- package/lib/utils/ffID/ffID.stories.d.ts +0 -6
- package/lib/utils/find/findAndInsert.d.ts +0 -7
- package/lib/utils/find/findAndInsert.stories.d.ts +0 -7
- package/lib/utils/findAndInsert/findAndInsert.stories.d.ts +0 -7
- package/lib/utils/getEncryptedData/getEncryptedData.stories.d.ts +0 -6
- package/lib/utils/getExtension/getExtension.stories.d.ts +0 -6
- package/lib/utils/getSequentialPayload/getSequentialPayload.stories.d.ts +0 -10
- package/lib/utils/throttle/throttle.stories.d.ts +0 -6
- package/lib/utils/truncateText/truncateText.stories.d.ts +0 -6
package/lib/index.esm.js
CHANGED
@@ -28,11 +28,11 @@ function styleInject(css, ref) {
|
|
28
28
|
}
|
29
29
|
}
|
30
30
|
|
31
|
-
var css_248z$
|
32
|
-
styleInject(css_248z$
|
31
|
+
var css_248z$1l = ":root {\n --tooltip-bg-color: #1e161f;\n --status-approved-text-color: #016102;\n --status-warning-text-color: #ff8b00;\n --status-rejected-text-color: #c60202;\n --status-skipped-text-color: #3c3838;\n --status-approved-bg-color: #c6efcd;\n --status-rejected-bg-color: #f7d9d9;\n --status-warning-bg-color: #fae2c6;\n --status-skipped-bg-color: #c4c3c3;\n --brand-color: #71347b;\n --icons-default-color: #71347b;\n --default-icon-color: #a3a3a3;\n --default-color: #747474;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --system-color--error: #c50303;\n --hover-color: #f7ebff;\n --brand2-color: #610b86;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --description-text-color: #d9d9d9;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --text-color: #1e161f;\n --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --error-light: #e42525;\n --tabs-label-default-color: tabs-label-default-color;\n --tabs-label-active-color: tabs-label-active-color;\n --tabs-border-color: tabs-border-color;\n --tabs-bg-color: tabs-bg-color;\n --tab-bg-color: tab-bg-color;\n --toggle-button-bg-color: #ffffff;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-strip-color: #cfd1e2;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --toggle-strip-color: #cfd1e2;\n --add-icon-hover-color: #431b4a;\n --arrows-button-border-color: #ded1e5;\n --arrow-button-bg-color: #ffffff;\n --text-bg-highlight: #f5fb00;\n --slider-table-color: #efe1f9;\n --variable-dropdown-bg: #($variable-dropdown-bg);\n --dataset-tooltip-title: #($dataset-tooltip-title),\n --dataset-tooltip-value: #($dataset-tooltip-value), ;\n}\n\n.fontXs, .ff-button, .ff-button--small, .ff-button--medium {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd, .ff-button--large {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-button {\n background-color: var(--primary-button-text-color);\n border-radius: 4px;\n padding: 4px 8px;\n text-align: center;\n text-decoration: none;\n font-weight: 500;\n cursor: pointer;\n display: flex;\n gap: 4px;\n justify-content: center;\n align-items: center;\n border: 2px solid transparent;\n}\n.ff-button--transparent {\n background-color: transparent;\n}\n.ff-button--primary, .ff-button--delete, .ff-button--secondary {\n position: relative;\n cursor: pointer;\n border-radius: 4px;\n z-index: 1;\n border: none;\n overflow: hidden;\n}\n.ff-button--primary:before, .ff-button--delete:before, .ff-button--secondary:before {\n content: \"\";\n position: absolute;\n inset: 0;\n border-radius: 4px;\n padding: 0.6px;\n background: var(--primary-button-border);\n mask: linear-gradient(var(--primary-button-text-color) 0 0) content-box, linear-gradient(var(--primary-button-text-color) 0 0);\n mask-composite: exclude;\n -webkit-mask: linear-gradient(var(--primary-button-text-color) 0 0) content-box, linear-gradient(var(--primary-button-text-color) 0 0);\n -webkit-mask-composite: destination-out;\n z-index: -1;\n}\n.ff-button--primary:hover, .ff-button--delete:hover, .ff-button--secondary:hover {\n background: var(--primary-button-hover);\n}\n.ff-button--primary:disabled, .ff-button--delete:disabled, .ff-button--secondary:disabled {\n opacity: 50%;\n cursor: no-drop;\n}\n.ff-button--primary:disabled:before, .ff-button--delete:disabled:before, .ff-button--secondary:disabled:before {\n content: \"\";\n position: absolute;\n inset: 0;\n border-radius: 4px;\n padding: 0.6px;\n -webkit-mask-composite: destination-out;\n mask-composite: exclude;\n z-index: -1;\n}\n.ff-button--primary {\n background: var(--primary-button-color);\n}\n.ff-button--primary:before {\n background: var(--primary-button-border);\n}\n.ff-button--primary:hover {\n background: var(--primary-button-hover);\n}\n.ff-button--delete {\n background: var(--delete-button-color);\n color: var(--primary-button-text-color);\n}\n.ff-button--delete:before {\n background: var(--delete-button-border);\n}\n.ff-button--delete:hover {\n background: var(--delete-button-hover);\n}\n.ff-button--warning {\n background: var(--warning-button-color);\n border: var(--warning-button-border);\n}\n.ff-button--secondary:before {\n background: var(--primary-button-border);\n}\n.ff-button--secondary:hover {\n background: var(--secondary-button-hover);\n}\n.ff-button--tertiary {\n border: none;\n background: var(--tertiary-button-color);\n}\n.ff-button--tertiary:hover {\n background: var(--tertiary-button-hover);\n}\n.ff-button--tertiary:disabled {\n opacity: 0.5;\n cursor: no-drop;\n}\n.ff-button--small {\n font-weight: 500;\n padding: 4.5px 8px;\n line-height: 15px;\n}\n.ff-button--medium {\n font-weight: 500;\n padding: 6px 12px;\n}\n.ff-button--large {\n padding: 8px 16px;\n}\n.ff-button-primary--text {\n color: var(--primary-button-text-color);\n}\n.ff-button-secondary--text, .ff-button-tertiary--text {\n background: var(--secondary-button-color-text);\n -webkit-background-clip: text;\n background-clip: text;\n color: transparent;\n}\n\n.ff-button-icon {\n cursor: pointer;\n}\n\n.ff-button-choose-file-text {\n color: var(--dotted-border-color);\n}\n\n.ff-button-choose-file {\n display: flex;\n justify-content: space-between;\n}";
|
32
|
+
styleInject(css_248z$1l);
|
33
33
|
|
34
|
-
var css_248z$
|
35
|
-
styleInject(css_248z$
|
34
|
+
var css_248z$1k = ":root {\n --tooltip-bg-color: #1e161f;\n --status-approved-text-color: #016102;\n --status-warning-text-color: #ff8b00;\n --status-rejected-text-color: #c60202;\n --status-skipped-text-color: #3c3838;\n --status-approved-bg-color: #c6efcd;\n --status-rejected-bg-color: #f7d9d9;\n --status-warning-bg-color: #fae2c6;\n --status-skipped-bg-color: #c4c3c3;\n --brand-color: #71347b;\n --icons-default-color: #71347b;\n --default-icon-color: #a3a3a3;\n --default-color: #747474;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --system-color--error: #c50303;\n --hover-color: #f7ebff;\n --brand2-color: #610b86;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --description-text-color: #d9d9d9;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --text-color: #1e161f;\n --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --error-light: #e42525;\n --tabs-label-default-color: tabs-label-default-color;\n --tabs-label-active-color: tabs-label-active-color;\n --tabs-border-color: tabs-border-color;\n --tabs-bg-color: tabs-bg-color;\n --tab-bg-color: tab-bg-color;\n --toggle-button-bg-color: #ffffff;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-strip-color: #cfd1e2;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --toggle-strip-color: #cfd1e2;\n --add-icon-hover-color: #431b4a;\n --arrows-button-border-color: #ded1e5;\n --arrow-button-bg-color: #ffffff;\n --text-bg-highlight: #f5fb00;\n --slider-table-color: #efe1f9;\n --variable-dropdown-bg: #($variable-dropdown-bg);\n --dataset-tooltip-title: #($dataset-tooltip-title),\n --dataset-tooltip-value: #($dataset-tooltip-value), ;\n}";
|
35
|
+
styleInject(css_248z$1k);
|
36
36
|
|
37
37
|
function getDefaultExportFromCjs (x) {
|
38
38
|
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
|
@@ -991,8 +991,8 @@ Components['closed_defects_status_icon'] = SvgCloseDefectsIcon;
|
|
991
991
|
Components['quality_score_status_icon'] = SvgQualityScoreIcon;
|
992
992
|
Components['defect_density_status_icon'] = SvgDefectDensityIcon;
|
993
993
|
|
994
|
-
var css_248z$
|
995
|
-
styleInject(css_248z$
|
994
|
+
var css_248z$1j = ".ff-icon-container {\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 4px;\n box-sizing: content-box;\n}\n.ff-icon-container.ff-icon-danger:hover {\n background-color: var(--ff-icon-color-danger-variant);\n}\n.ff-icon-container.ff-icon-dark {\n background-color: var(--brand-color);\n border-radius: 4px;\n}\n.ff-icon-container.ff-icon-dark.ff-icon-click:hover {\n background-color: white;\n}\n.ff-icon-container.ff-icon-dark.ff-icon-click:hover svg path {\n fill: var(--brand-color);\n}\n\n.ff-icon-click {\n cursor: pointer;\n box-sizing: content-box;\n}\n.ff-icon-click:hover {\n border-radius: 4px;\n background-color: var(--ff-icon-hover-fill-color);\n}\n.ff-icon-click:hover > svg {\n color: var(--brand-color);\n}\n\n.ff-icon-disabled {\n cursor: no-drop;\n}\n.ff-icon-disabled > svg {\n color: var(--toggle-strip-color);\n}\n.ff-icon-disabled:hover {\n box-shadow: none;\n}\n.ff-icon-disabled:hover > svg {\n color: var(--toggle-strip-color);\n}";
|
995
|
+
styleInject(css_248z$1j);
|
996
996
|
|
997
997
|
const Icon = /*#__PURE__*/forwardRef(({
|
998
998
|
name,
|
@@ -1068,8 +1068,8 @@ const Icon = /*#__PURE__*/forwardRef(({
|
|
1068
1068
|
});
|
1069
1069
|
});
|
1070
1070
|
|
1071
|
-
var css_248z$
|
1072
|
-
styleInject(css_248z$
|
1071
|
+
var css_248z$1i = ".ff-text {\n font-family: \"Poppins\", sans-serif;\n font-size: 16px;\n}\n.ff-text--regular {\n font-weight: 400;\n}\n.ff-text--medium {\n font-weight: 500;\n}\n.ff-text--semi-bold {\n font-weight: 600;\n}\n.ff-text--bold {\n font-weight: 700;\n}\n.ff-text .required-asterisk {\n color: var(--input-error-text-color);\n padding-right: 4px;\n}";
|
1072
|
+
styleInject(css_248z$1i);
|
1073
1073
|
|
1074
1074
|
const Typography = ({
|
1075
1075
|
fontWeight = 'regular',
|
@@ -1167,8 +1167,8 @@ const Button$1 = /*#__PURE__*/forwardRef(({
|
|
1167
1167
|
});
|
1168
1168
|
});
|
1169
1169
|
|
1170
|
-
var css_248z$
|
1171
|
-
styleInject(css_248z$
|
1170
|
+
var css_248z$1h = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-title {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-drawer-container .ff-overlay {\n position: fixed;\n inset: 0;\n background-color: var(--drawer-title-color);\n opacity: 0.5;\n z-index: 999;\n}\n.ff-drawer-container .child-drawer-overlay {\n z-index: 999;\n}\n.ff-drawer-container .ff-drawer {\n margin-bottom: 4px;\n position: fixed;\n right: 5px;\n bottom: 0;\n top: 87px;\n background-color: var(--primary-button-text-color);\n z-index: 999;\n transform: translateX(100%);\n opacity: 0;\n}\n.ff-drawer-container .ff-drawer--open {\n transform: translateX(0);\n opacity: 1;\n}\n.ff-drawer-container .ff-drawer--small {\n width: 444px;\n}\n.ff-drawer-container .ff-drawer--medium {\n width: 666px;\n}\n.ff-drawer-container .ff-drawer--large {\n width: 888px;\n}\n.ff-drawer-container .ff-drawer--x-large {\n width: calc(100vw - 10px);\n}\n.ff-drawer-container .ff-drawer--open, .ff-drawer-container .ff-drawer--medium, .ff-drawer-container .ff-drawer--large, .ff-drawer-container .ff-drawer--x-large {\n transition: all 0.4s ease-in-out;\n border-radius: 5px;\n border: 1px solid var(--border-color);\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header {\n padding: 4px 8px 4px 8px;\n display: flex;\n gap: 10px;\n border-bottom: 1px solid var(--border-color);\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-title {\n font-weight: 600;\n color: var(--drawer-title-color);\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-close-icon {\n height: 16px;\n width: 16px;\n border-radius: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n height: 24px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section .ff-action-button {\n display: flex;\n align-items: center;\n gap: 5px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section .ff-action-button .ff-expand-collapse-button {\n cursor: pointer;\n background-color: var(--button-bg-color);\n outline: none;\n border: none;\n margin: 0;\n border: 1px solid transparent;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 8px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section .ff-action-button .ff-custom-header {\n background-color: var(--drawer-footer-bg);\n width: 100%;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-body {\n background-color: var(--drawer-footer-bg);\n overflow-y: auto;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-footer {\n position: fixed;\n bottom: 0;\n left: 0;\n right: 0;\n padding: 4px 8px 4px 8px;\n display: flex;\n justify-content: space-between;\n border-top: 1px solid var(--drawer-footer-border);\n z-index: 1000;\n background-color: var(--base-bg-color);\n transform: translateY(3px);\n border-radius: 0 0 4px 4px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-footer .button-container {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-footer .ff-custom-footer {\n background-color: var(--drawer-footer-bg);\n width: 100%;\n border-radius: 0 0 8px 8px;\n}";
|
1171
|
+
styleInject(css_248z$1h);
|
1172
1172
|
|
1173
1173
|
function useEscapeKey(key) {
|
1174
1174
|
return callBack => {
|
@@ -1186,8 +1186,8 @@ function useEscapeKey(key) {
|
|
1186
1186
|
};
|
1187
1187
|
}
|
1188
1188
|
|
1189
|
-
var css_248z$1f = ":root {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\n --text-color: #1e161f;\n --description-text: #7a7a7a;\n --click-able-text-color: #71347b;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #71347b;\n --border-color: #f0e7f4;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n --slider-table-color: rgba(212, 176, 228, 0.1490196078);\n --drawer-footer-bg: #ffffff;\n --drawer-footer-border: #f0e7f4;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #1e161f;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active: #71347b;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #71347b;\n --available-memory-bg: #9f2ea1;\n --assigned-memory-bg: linear-gradient(88.75deg, #bdb7ff 1.07%, #a8a1ff 40.23%, #7e72ff 79.4%);\n --used-memory-bg: linear-gradient(90deg, #e0c6fd 0.13%, #c893fd 40.13%, #b264ff 80.13%);\n --default-icon-color: #a3a3a3;\n --tree-connecting-lines-color: #d7b5e3;\n --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-hover: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n --primary-button-disable: linear-gradient(180deg, #46164d 0%, #71347b 100%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n --secondary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-text-color: #46164d;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --error: #e42525;\n --drawer-title-color: #252c37;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\n --ff-chip-text-color: #1e161f;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #71347b;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #71347b;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #71347b;\n --delete-text-color: #c50303;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #ffb803;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #14041c;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #71347b;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #71347b;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3c3838;\n --panel-shadow: rgba(0, 0, 0, 0.1019607843);\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --pie-chart-border-color: #b6b6b6;\n --variable-dropdown-bg: #ffffff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #9c1ebb;\n --details-page-value-color: #808080;\n --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-machine-input-field-border-color: #a3a3a3;\n --ff-machine-input-field-label-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #71347b;\n --ff-connecting-branch-modal-header: #71347b;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592f7c 0%, #741ebb 100%);\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-avatar-background-color: #71347b;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --ff-progress-bar-bg-color: #f0f0f0;\n --ff-machine-partial-public-status-color: #ea850e;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(10, 13, 39, 0.1647058824);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #71347b 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922b3e;\n --follow-user-icon-orange: #ed760e;\n --follow-user-icon-black: #0a0a0a;\n --follow-user-icon-pink: #e63244;\n --follow-user-icon-blue: #3b83bd;\n --follow-user-icon-navy: #20214f;\n --follow-user-icon-lightGreen: #bdecb6;\n --follow-user-icon-gray: #d9d9d9;\n --follow-user-icon-yellow: #cda434;\n --follow-user-icon-salmon: #d36e70;\n --dataset-tooltip-title: #808080;\n --dataset-tooltip-value: #ffffff;\n --defect-trivial: #8bc34a;\n --defect-text: #9e9e9e;\n --defect-tweak: #ffc107;\n --defect-minor: #ffeb3b;\n --defect-majour: #ff9800;\n --defect-crash: #f44336;\n --defect-block: #d32f2f;\n --defect-blocker: #b71c1c;\n --defect-critical: #c2185b;\n --defect-catastrophic: #6a1b9a;\n --defect-serious: #7b1fa2;\n --defect-normal: #03a9f4;\n --defect-small-or-trivial: #4dd0e1;\n}\n\n:root {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\n --text-color: #e8e0e9;\n --description-text: #d9d9d9;\n --click-able-text-color: #e8e0e9;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #e8e0e9;\n --border-color: #333234;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(18, 18, 18, 0.6);\n --slider-table-color: #272428;\n --drawer-footer-bg: rgba(27, 24, 28, 0.6);\n --drawer-footer-border: #333234;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #2a2a2a;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active-color: #71347b;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(18, 18, 18, 0.6);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #71347b;\n --tree-connecting-lines-color: #d7b5e3;\n --available-memory-bg: #9f2ea1;\n --assigned-memory-bg: linear-gradient(88.75deg, #bdb7ff 1.07%, #a8a1ff 40.23%, #7e72ff 79.4%);\n --used-memory-bg: linear-gradient(90deg, #e0c6fd 0.13%, #c893fd 40.13%, #b264ff 80.13%);\n --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-hover: linear-gradient(188.79deg, #7c4685 2.94%, #582d5f 93.09%);\n --primary-button-disable: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n --secondary-button-border: linear-gradient(360deg, #46164d 0%, #71347b 100%);\n --secondary-button-text-color: #71347b;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(180deg, rgba(70, 22, 77, 0.05) 0%, rgba(113, 52, 123, 0.05) 100%);\n --tertiary-button-hover: linear-gradient(180deg, rgba(70, 22, 77, 0.1) 0%, rgba(113, 52, 123, 0.1) 100%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --drawer-title-color: #252c37;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --default-icon-color: #a3a3a3;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(130, 60, 141, 0.1019607843);\n --file-dropzone-selected-color: rgba(130, 60, 141, 0.2);\n --file-details-container-shadow: rgba(255, 252, 255, 0.6);\n --file-details-bg: #0d0d0d;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\n --ff-chip-text-color: #1e161f;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #71347b;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #71347b;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #71347b;\n --delete-text-color: #c50303;\n --ff-progress-bar-bg-color: #f0f0f0;\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #ffb803;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #14041c;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #71347b;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #71347b;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3c3838;\n --panel-shadow: rgba(0, 0, 0, 0.1019607843);\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --pie-chart-border-color: #b6b6b6;\n --button-bg-color: #f6ebff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #9c1ebb;\n --details-page-value-color: #808080;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592f7c 0%, #741ebb 100%);\n --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-icon-color-dark-variant: #ffffff;\n --avatar-background-color: #71347b;\n --avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #333234;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(207, 209, 226, 0.4431372549);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-search-field-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-active-status-color: #4caf50;\n --ff-machine-running-status-color: #2055de;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --ff-machine-input-field-border-color: #a3a3a3;\n --ff-machine-input-field-label-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #71347b;\n --ff-connecting-branch-modal-header: #71347b;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922b3e;\n --follow-user-icon-orange: #ed760e;\n --follow-user-icon-black: #0a0a0a;\n --follow-user-icon-pink: #e63244;\n --follow-user-icon-blue: #3b83bd;\n --follow-user-icon-navy: #20214f;\n --follow-user-icon-lightGreen: #bdecb6;\n --follow-user-icon-gray: #d9d9d9;\n --follow-user-icon-yellow: #cda434;\n --follow-user-icon-salmon: #d36e70;\n --dataset-tooltip-title: #808080;\n --dataset-tooltip-value: #ffffff;\n --defect-trivial: #8bc34a;\n --defect-text: #9e9e9e;\n --defect-tweak: #ffc107;\n --defect-minor: #ffeb3b;\n --defect-majour: #ff9800;\n --defect-crash: #f44336;\n --defect-block: #d32f2f;\n --defect-blocker: #b71c1c;\n --defect-critical: #c2185b;\n --defect-catastrophic: #6a1b9a;\n --defect-serious: #7b1fa2;\n --defect-normal: #03a9f4;\n --defect-small-or-trivial: #4dd0e1;\n}\n\n:root {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #434db8;\n --text-color: #3c3838;\n --description-text: #7a7a7a;\n --click-able-text-color: #434db8;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #434db8;\n --border-color: #c2d2fb;\n --disable-color: rgba(67, 77, 184, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n --slider-table-color: #e9ebfb;\n --drawer-footer-bg: #ffffff;\n --drawer-footer-border: #f0e7f4;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #1e161f;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active: #434db8;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #434db8;\n --default-icon-color: #a3a3a3;\n --tree-connecting-lines-color: #434db8;\n --primary-button-color: linear-gradient(188.79deg, #434db8 2.94%, #434db8 93.09%);\n --primary-button-hover: linear-gradient(179.06deg, #434db8 3.49%, #434db8 99.22%);\n --primary-button-disable: linear-gradient(180deg, #46164d 0%, #434db8 100%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #434db8 3.04%, #434db8 100%);\n --secondary-button-color-text: #6f7070;\n --secondary-button-border: #6f7070;\n --secondary-button-text-color: #46164d;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --error: #e42525;\n --drawer-title-color: #1e161f;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(67, 77, 184, 0.1019607843);\n --file-dropzone-selected-color: rgba(67, 77, 184, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-comment-input-border-color: #434db8;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #434db8;\n --ff-chips-blur-color: #575757;\n --ff-chip-bg: #ffffff;\n --ff-chip-text-color: #ffffff;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #434db8;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #434db8;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #434db8;\n --delete-text-color: #c50303;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #fcce46;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #808080;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #434db8;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #434db8;\n --ff-search-field-hover-color: #edecf8;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #434db8;\n --disabled-primary-color: #f9f9f9;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --pie-chart-border-color: #b6b6b6;\n --variable-dropdown-bg: #ffffff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #434db8;\n --details-page-value-color: #808080;\n --table-header-text-color: #252c37;\n --table-column-text-color: #1e161f;\n --ff-machine-input-field-border-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #434db8;\n --ff-connecting-branch-modal-header: #434db8;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #434db8 0%, #434db8 100%);\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --label-edit-text-label-color: #434db8;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #edecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-avatar-background-color: #434db8;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #434db8 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922B3E;\n --follow-user-icon-orange: #ED760E;\n --follow-user-icon-black: #0A0A0A;\n --follow-user-icon-pink: #E63244;\n --follow-user-icon-blue: #3B83BD;\n --follow-user-icon-navy: #20214F;\n --follow-user-icon-lightGreen: #BDECB6;\n --follow-user-icon-gray: #D9D9D9;\n --follow-user-icon-yellow: #CDA434;\n --follow-user-icon-salmon: #D36E70;\n}\n\n.ff-light-theme {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\n --text-color: #1e161f;\n --description-text: #7a7a7a;\n --click-able-text-color: #71347b;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #71347b;\n --border-color: #f0e7f4;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n --slider-table-color: rgba(212, 176, 228, 0.1490196078);\n --drawer-footer-bg: #ffffff;\n --drawer-footer-border: #f0e7f4;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #1e161f;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active: #71347b;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #71347b;\n --available-memory-bg: #9f2ea1;\n --assigned-memory-bg: linear-gradient(88.75deg, #bdb7ff 1.07%, #a8a1ff 40.23%, #7e72ff 79.4%);\n --used-memory-bg: linear-gradient(90deg, #e0c6fd 0.13%, #c893fd 40.13%, #b264ff 80.13%);\n --default-icon-color: #a3a3a3;\n --tree-connecting-lines-color: #d7b5e3;\n --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-hover: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n --primary-button-disable: linear-gradient(180deg, #46164d 0%, #71347b 100%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n --secondary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-text-color: #46164d;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --error: #e42525;\n --drawer-title-color: #252c37;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\n --ff-chip-text-color: #1e161f;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #71347b;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #71347b;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #71347b;\n --delete-text-color: #c50303;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #ffb803;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #14041c;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #71347b;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #71347b;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3c3838;\n --panel-shadow: rgba(0, 0, 0, 0.1019607843);\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --pie-chart-border-color: #b6b6b6;\n --variable-dropdown-bg: #ffffff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #9c1ebb;\n --details-page-value-color: #808080;\n --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-machine-input-field-border-color: #a3a3a3;\n --ff-machine-input-field-label-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #71347b;\n --ff-connecting-branch-modal-header: #71347b;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592f7c 0%, #741ebb 100%);\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-avatar-background-color: #71347b;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --ff-progress-bar-bg-color: #f0f0f0;\n --ff-machine-partial-public-status-color: #ea850e;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(10, 13, 39, 0.1647058824);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #71347b 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922b3e;\n --follow-user-icon-orange: #ed760e;\n --follow-user-icon-black: #0a0a0a;\n --follow-user-icon-pink: #e63244;\n --follow-user-icon-blue: #3b83bd;\n --follow-user-icon-navy: #20214f;\n --follow-user-icon-lightGreen: #bdecb6;\n --follow-user-icon-gray: #d9d9d9;\n --follow-user-icon-yellow: #cda434;\n --follow-user-icon-salmon: #d36e70;\n --dataset-tooltip-title: #808080;\n --dataset-tooltip-value: #ffffff;\n --defect-trivial: #8bc34a;\n --defect-text: #9e9e9e;\n --defect-tweak: #ffc107;\n --defect-minor: #ffeb3b;\n --defect-majour: #ff9800;\n --defect-crash: #f44336;\n --defect-block: #d32f2f;\n --defect-blocker: #b71c1c;\n --defect-critical: #c2185b;\n --defect-catastrophic: #6a1b9a;\n --defect-serious: #7b1fa2;\n --defect-normal: #03a9f4;\n --defect-small-or-trivial: #4dd0e1;\n}\n\n.ff-dark-theme {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\n --text-color: #e8e0e9;\n --description-text: #d9d9d9;\n --click-able-text-color: #e8e0e9;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #e8e0e9;\n --border-color: #333234;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(18, 18, 18, 0.6);\n --slider-table-color: #272428;\n --drawer-footer-bg: rgba(27, 24, 28, 0.6);\n --drawer-footer-border: #333234;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #2a2a2a;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active-color: #71347b;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(18, 18, 18, 0.6);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #71347b;\n --tree-connecting-lines-color: #d7b5e3;\n --available-memory-bg: #9f2ea1;\n --assigned-memory-bg: linear-gradient(88.75deg, #bdb7ff 1.07%, #a8a1ff 40.23%, #7e72ff 79.4%);\n --used-memory-bg: linear-gradient(90deg, #e0c6fd 0.13%, #c893fd 40.13%, #b264ff 80.13%);\n --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-hover: linear-gradient(188.79deg, #7c4685 2.94%, #582d5f 93.09%);\n --primary-button-disable: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n --secondary-button-border: linear-gradient(360deg, #46164d 0%, #71347b 100%);\n --secondary-button-text-color: #71347b;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(180deg, rgba(70, 22, 77, 0.05) 0%, rgba(113, 52, 123, 0.05) 100%);\n --tertiary-button-hover: linear-gradient(180deg, rgba(70, 22, 77, 0.1) 0%, rgba(113, 52, 123, 0.1) 100%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --drawer-title-color: #252c37;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --default-icon-color: #a3a3a3;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(130, 60, 141, 0.1019607843);\n --file-dropzone-selected-color: rgba(130, 60, 141, 0.2);\n --file-details-container-shadow: rgba(255, 252, 255, 0.6);\n --file-details-bg: #0d0d0d;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\n --ff-chip-text-color: #1e161f;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #71347b;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #71347b;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #71347b;\n --delete-text-color: #c50303;\n --ff-progress-bar-bg-color: #f0f0f0;\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #ffb803;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #14041c;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #71347b;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #71347b;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3c3838;\n --panel-shadow: rgba(0, 0, 0, 0.1019607843);\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --pie-chart-border-color: #b6b6b6;\n --button-bg-color: #f6ebff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #9c1ebb;\n --details-page-value-color: #808080;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592f7c 0%, #741ebb 100%);\n --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-icon-color-dark-variant: #ffffff;\n --avatar-background-color: #71347b;\n --avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #333234;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(207, 209, 226, 0.4431372549);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-search-field-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-active-status-color: #4caf50;\n --ff-machine-running-status-color: #2055de;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --ff-machine-input-field-border-color: #a3a3a3;\n --ff-machine-input-field-label-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #71347b;\n --ff-connecting-branch-modal-header: #71347b;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922b3e;\n --follow-user-icon-orange: #ed760e;\n --follow-user-icon-black: #0a0a0a;\n --follow-user-icon-pink: #e63244;\n --follow-user-icon-blue: #3b83bd;\n --follow-user-icon-navy: #20214f;\n --follow-user-icon-lightGreen: #bdecb6;\n --follow-user-icon-gray: #d9d9d9;\n --follow-user-icon-yellow: #cda434;\n --follow-user-icon-salmon: #d36e70;\n --dataset-tooltip-title: #808080;\n --dataset-tooltip-value: #ffffff;\n --defect-trivial: #8bc34a;\n --defect-text: #9e9e9e;\n --defect-tweak: #ffc107;\n --defect-minor: #ffeb3b;\n --defect-majour: #ff9800;\n --defect-crash: #f44336;\n --defect-block: #d32f2f;\n --defect-blocker: #b71c1c;\n --defect-critical: #c2185b;\n --defect-catastrophic: #6a1b9a;\n --defect-serious: #7b1fa2;\n --defect-normal: #03a9f4;\n --defect-small-or-trivial: #4dd0e1;\n}\n\n.ff-blue-theme {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #434db8;\n --text-color: #3c3838;\n --description-text: #7a7a7a;\n --click-able-text-color: #434db8;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #434db8;\n --border-color: #c2d2fb;\n --disable-color: rgba(67, 77, 184, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n --slider-table-color: #e9ebfb;\n --drawer-footer-bg: #ffffff;\n --drawer-footer-border: #f0e7f4;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #1e161f;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active: #434db8;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #434db8;\n --default-icon-color: #a3a3a3;\n --tree-connecting-lines-color: #434db8;\n --primary-button-color: linear-gradient(188.79deg, #434db8 2.94%, #434db8 93.09%);\n --primary-button-hover: linear-gradient(179.06deg, #434db8 3.49%, #434db8 99.22%);\n --primary-button-disable: linear-gradient(180deg, #46164d 0%, #434db8 100%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #434db8 3.04%, #434db8 100%);\n --secondary-button-color-text: #6f7070;\n --secondary-button-border: #6f7070;\n --secondary-button-text-color: #46164d;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --error: #e42525;\n --drawer-title-color: #1e161f;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(67, 77, 184, 0.1019607843);\n --file-dropzone-selected-color: rgba(67, 77, 184, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-comment-input-border-color: #434db8;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #434db8;\n --ff-chips-blur-color: #575757;\n --ff-chip-bg: #ffffff;\n --ff-chip-text-color: #ffffff;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #434db8;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #434db8;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #434db8;\n --delete-text-color: #c50303;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #fcce46;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #808080;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #434db8;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #434db8;\n --ff-search-field-hover-color: #edecf8;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #434db8;\n --disabled-primary-color: #f9f9f9;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --pie-chart-border-color: #b6b6b6;\n --variable-dropdown-bg: #ffffff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #434db8;\n --details-page-value-color: #808080;\n --table-header-text-color: #252c37;\n --table-column-text-color: #1e161f;\n --ff-machine-input-field-border-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #434db8;\n --ff-connecting-branch-modal-header: #434db8;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #434db8 0%, #434db8 100%);\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --label-edit-text-label-color: #434db8;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #edecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-avatar-background-color: #434db8;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #434db8 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922B3E;\n --follow-user-icon-orange: #ED760E;\n --follow-user-icon-black: #0A0A0A;\n --follow-user-icon-pink: #E63244;\n --follow-user-icon-blue: #3B83BD;\n --follow-user-icon-navy: #20214F;\n --follow-user-icon-lightGreen: #BDECB6;\n --follow-user-icon-gray: #D9D9D9;\n --follow-user-icon-yellow: #CDA434;\n --follow-user-icon-salmon: #D36E70;\n}";
|
1190
|
-
styleInject(css_248z$
|
1189
|
+
var css_248z$1g = ":root {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\n --text-color: #1e161f;\n --description-text: #7a7a7a;\n --click-able-text-color: #71347b;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #71347b;\n --border-color: #f0e7f4;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n --slider-table-color: rgba(212, 176, 228, 0.1490196078);\n --drawer-footer-bg: #ffffff;\n --drawer-footer-border: #f0e7f4;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #1e161f;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active: #71347b;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #71347b;\n --available-memory-bg: #9f2ea1;\n --assigned-memory-bg: linear-gradient(88.75deg, #bdb7ff 1.07%, #a8a1ff 40.23%, #7e72ff 79.4%);\n --used-memory-bg: linear-gradient(90deg, #e0c6fd 0.13%, #c893fd 40.13%, #b264ff 80.13%);\n --default-icon-color: #a3a3a3;\n --tree-connecting-lines-color: #d7b5e3;\n --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-hover: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n --primary-button-disable: linear-gradient(180deg, #46164d 0%, #71347b 100%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n --secondary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-text-color: #46164d;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --error: #e42525;\n --drawer-title-color: #252c37;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\n --ff-chip-text-color: #1e161f;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #71347b;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #71347b;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #71347b;\n --delete-text-color: #c50303;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #ffb803;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #14041c;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #71347b;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #71347b;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3c3838;\n --panel-shadow: rgba(0, 0, 0, 0.1019607843);\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --pie-chart-border-color: #b6b6b6;\n --variable-dropdown-bg: #ffffff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #9c1ebb;\n --details-page-value-color: #808080;\n --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-machine-input-field-border-color: #a3a3a3;\n --ff-machine-input-field-label-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #71347b;\n --ff-connecting-branch-modal-header: #71347b;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592f7c 0%, #741ebb 100%);\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-avatar-background-color: #71347b;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --ff-progress-bar-bg-color: #f0f0f0;\n --ff-machine-partial-public-status-color: #ea850e;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(10, 13, 39, 0.1647058824);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #71347b 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922b3e;\n --follow-user-icon-orange: #ed760e;\n --follow-user-icon-black: #0a0a0a;\n --follow-user-icon-pink: #e63244;\n --follow-user-icon-blue: #3b83bd;\n --follow-user-icon-navy: #20214f;\n --follow-user-icon-lightGreen: #bdecb6;\n --follow-user-icon-gray: #d9d9d9;\n --follow-user-icon-yellow: #cda434;\n --follow-user-icon-salmon: #d36e70;\n --dataset-tooltip-title: #808080;\n --dataset-tooltip-value: #ffffff;\n --defect-trivial: #8bc34a;\n --defect-text: #9e9e9e;\n --defect-tweak: #ffc107;\n --defect-minor: #ffeb3b;\n --defect-majour: #ff9800;\n --defect-crash: #f44336;\n --defect-block: #d32f2f;\n --defect-blocker: #b71c1c;\n --defect-critical: #c2185b;\n --defect-catastrophic: #6a1b9a;\n --defect-serious: #7b1fa2;\n --defect-normal: #03a9f4;\n --defect-small-or-trivial: #4dd0e1;\n}\n\n:root {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\n --text-color: #e8e0e9;\n --description-text: #d9d9d9;\n --click-able-text-color: #e8e0e9;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #e8e0e9;\n --border-color: #333234;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(18, 18, 18, 0.6);\n --slider-table-color: #272428;\n --drawer-footer-bg: rgba(27, 24, 28, 0.6);\n --drawer-footer-border: #333234;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #2a2a2a;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active-color: #71347b;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(18, 18, 18, 0.6);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #71347b;\n --tree-connecting-lines-color: #d7b5e3;\n --available-memory-bg: #9f2ea1;\n --assigned-memory-bg: linear-gradient(88.75deg, #bdb7ff 1.07%, #a8a1ff 40.23%, #7e72ff 79.4%);\n --used-memory-bg: linear-gradient(90deg, #e0c6fd 0.13%, #c893fd 40.13%, #b264ff 80.13%);\n --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-hover: linear-gradient(188.79deg, #7c4685 2.94%, #582d5f 93.09%);\n --primary-button-disable: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n --secondary-button-border: linear-gradient(360deg, #46164d 0%, #71347b 100%);\n --secondary-button-text-color: #71347b;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(180deg, rgba(70, 22, 77, 0.05) 0%, rgba(113, 52, 123, 0.05) 100%);\n --tertiary-button-hover: linear-gradient(180deg, rgba(70, 22, 77, 0.1) 0%, rgba(113, 52, 123, 0.1) 100%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --drawer-title-color: #252c37;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --default-icon-color: #a3a3a3;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(130, 60, 141, 0.1019607843);\n --file-dropzone-selected-color: rgba(130, 60, 141, 0.2);\n --file-details-container-shadow: rgba(255, 252, 255, 0.6);\n --file-details-bg: #0d0d0d;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\n --ff-chip-text-color: #1e161f;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #71347b;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #71347b;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #71347b;\n --delete-text-color: #c50303;\n --ff-progress-bar-bg-color: #f0f0f0;\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #ffb803;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #14041c;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #71347b;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #71347b;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3c3838;\n --panel-shadow: rgba(0, 0, 0, 0.1019607843);\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --pie-chart-border-color: #b6b6b6;\n --button-bg-color: #f6ebff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #9c1ebb;\n --details-page-value-color: #808080;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592f7c 0%, #741ebb 100%);\n --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-icon-color-dark-variant: #ffffff;\n --avatar-background-color: #71347b;\n --avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #333234;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(207, 209, 226, 0.4431372549);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-search-field-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-active-status-color: #4caf50;\n --ff-machine-running-status-color: #2055de;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --ff-machine-input-field-border-color: #a3a3a3;\n --ff-machine-input-field-label-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #71347b;\n --ff-connecting-branch-modal-header: #71347b;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922b3e;\n --follow-user-icon-orange: #ed760e;\n --follow-user-icon-black: #0a0a0a;\n --follow-user-icon-pink: #e63244;\n --follow-user-icon-blue: #3b83bd;\n --follow-user-icon-navy: #20214f;\n --follow-user-icon-lightGreen: #bdecb6;\n --follow-user-icon-gray: #d9d9d9;\n --follow-user-icon-yellow: #cda434;\n --follow-user-icon-salmon: #d36e70;\n --dataset-tooltip-title: #808080;\n --dataset-tooltip-value: #ffffff;\n --defect-trivial: #8bc34a;\n --defect-text: #9e9e9e;\n --defect-tweak: #ffc107;\n --defect-minor: #ffeb3b;\n --defect-majour: #ff9800;\n --defect-crash: #f44336;\n --defect-block: #d32f2f;\n --defect-blocker: #b71c1c;\n --defect-critical: #c2185b;\n --defect-catastrophic: #6a1b9a;\n --defect-serious: #7b1fa2;\n --defect-normal: #03a9f4;\n --defect-small-or-trivial: #4dd0e1;\n}\n\n:root {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #434db8;\n --text-color: #3c3838;\n --description-text: #7a7a7a;\n --click-able-text-color: #434db8;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #434db8;\n --border-color: #c2d2fb;\n --disable-color: rgba(67, 77, 184, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n --slider-table-color: #e9ebfb;\n --drawer-footer-bg: #ffffff;\n --drawer-footer-border: #f0e7f4;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #1e161f;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active: #434db8;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #434db8;\n --default-icon-color: #a3a3a3;\n --tree-connecting-lines-color: #434db8;\n --primary-button-color: linear-gradient(188.79deg, #434db8 2.94%, #434db8 93.09%);\n --primary-button-hover: linear-gradient(179.06deg, #434db8 3.49%, #434db8 99.22%);\n --primary-button-disable: linear-gradient(180deg, #46164d 0%, #434db8 100%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #434db8 3.04%, #434db8 100%);\n --secondary-button-color-text: #6f7070;\n --secondary-button-border: #6f7070;\n --secondary-button-text-color: #46164d;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --error: #e42525;\n --drawer-title-color: #1e161f;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(67, 77, 184, 0.1019607843);\n --file-dropzone-selected-color: rgba(67, 77, 184, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-comment-input-border-color: #434db8;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #434db8;\n --ff-chips-blur-color: #575757;\n --ff-chip-bg: #ffffff;\n --ff-chip-text-color: #ffffff;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #434db8;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #434db8;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #434db8;\n --delete-text-color: #c50303;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #fcce46;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #808080;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #434db8;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #434db8;\n --ff-search-field-hover-color: #edecf8;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #434db8;\n --disabled-primary-color: #f9f9f9;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --pie-chart-border-color: #b6b6b6;\n --variable-dropdown-bg: #ffffff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #434db8;\n --details-page-value-color: #808080;\n --table-header-text-color: #252c37;\n --table-column-text-color: #1e161f;\n --ff-machine-input-field-border-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #434db8;\n --ff-connecting-branch-modal-header: #434db8;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #434db8 0%, #434db8 100%);\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --label-edit-text-label-color: #434db8;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #edecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-avatar-background-color: #434db8;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #434db8 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922B3E;\n --follow-user-icon-orange: #ED760E;\n --follow-user-icon-black: #0A0A0A;\n --follow-user-icon-pink: #E63244;\n --follow-user-icon-blue: #3B83BD;\n --follow-user-icon-navy: #20214F;\n --follow-user-icon-lightGreen: #BDECB6;\n --follow-user-icon-gray: #D9D9D9;\n --follow-user-icon-yellow: #CDA434;\n --follow-user-icon-salmon: #D36E70;\n}\n\n.ff-light-theme {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\n --text-color: #1e161f;\n --description-text: #7a7a7a;\n --click-able-text-color: #71347b;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #71347b;\n --border-color: #f0e7f4;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n --slider-table-color: rgba(212, 176, 228, 0.1490196078);\n --drawer-footer-bg: #ffffff;\n --drawer-footer-border: #f0e7f4;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #1e161f;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active: #71347b;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #71347b;\n --available-memory-bg: #9f2ea1;\n --assigned-memory-bg: linear-gradient(88.75deg, #bdb7ff 1.07%, #a8a1ff 40.23%, #7e72ff 79.4%);\n --used-memory-bg: linear-gradient(90deg, #e0c6fd 0.13%, #c893fd 40.13%, #b264ff 80.13%);\n --default-icon-color: #a3a3a3;\n --tree-connecting-lines-color: #d7b5e3;\n --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-hover: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n --primary-button-disable: linear-gradient(180deg, #46164d 0%, #71347b 100%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n --secondary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-text-color: #46164d;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --error: #e42525;\n --drawer-title-color: #252c37;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\n --ff-chip-text-color: #1e161f;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #71347b;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #71347b;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #71347b;\n --delete-text-color: #c50303;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #ffb803;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #14041c;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #71347b;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #71347b;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3c3838;\n --panel-shadow: rgba(0, 0, 0, 0.1019607843);\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --pie-chart-border-color: #b6b6b6;\n --variable-dropdown-bg: #ffffff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #9c1ebb;\n --details-page-value-color: #808080;\n --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-machine-input-field-border-color: #a3a3a3;\n --ff-machine-input-field-label-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #71347b;\n --ff-connecting-branch-modal-header: #71347b;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592f7c 0%, #741ebb 100%);\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-avatar-background-color: #71347b;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --ff-progress-bar-bg-color: #f0f0f0;\n --ff-machine-partial-public-status-color: #ea850e;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(10, 13, 39, 0.1647058824);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #71347b 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922b3e;\n --follow-user-icon-orange: #ed760e;\n --follow-user-icon-black: #0a0a0a;\n --follow-user-icon-pink: #e63244;\n --follow-user-icon-blue: #3b83bd;\n --follow-user-icon-navy: #20214f;\n --follow-user-icon-lightGreen: #bdecb6;\n --follow-user-icon-gray: #d9d9d9;\n --follow-user-icon-yellow: #cda434;\n --follow-user-icon-salmon: #d36e70;\n --dataset-tooltip-title: #808080;\n --dataset-tooltip-value: #ffffff;\n --defect-trivial: #8bc34a;\n --defect-text: #9e9e9e;\n --defect-tweak: #ffc107;\n --defect-minor: #ffeb3b;\n --defect-majour: #ff9800;\n --defect-crash: #f44336;\n --defect-block: #d32f2f;\n --defect-blocker: #b71c1c;\n --defect-critical: #c2185b;\n --defect-catastrophic: #6a1b9a;\n --defect-serious: #7b1fa2;\n --defect-normal: #03a9f4;\n --defect-small-or-trivial: #4dd0e1;\n}\n\n.ff-dark-theme {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\n --text-color: #e8e0e9;\n --description-text: #d9d9d9;\n --click-able-text-color: #e8e0e9;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #e8e0e9;\n --border-color: #333234;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(18, 18, 18, 0.6);\n --slider-table-color: #272428;\n --drawer-footer-bg: rgba(27, 24, 28, 0.6);\n --drawer-footer-border: #333234;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #2a2a2a;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active-color: #71347b;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(18, 18, 18, 0.6);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #71347b;\n --tree-connecting-lines-color: #d7b5e3;\n --available-memory-bg: #9f2ea1;\n --assigned-memory-bg: linear-gradient(88.75deg, #bdb7ff 1.07%, #a8a1ff 40.23%, #7e72ff 79.4%);\n --used-memory-bg: linear-gradient(90deg, #e0c6fd 0.13%, #c893fd 40.13%, #b264ff 80.13%);\n --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-hover: linear-gradient(188.79deg, #7c4685 2.94%, #582d5f 93.09%);\n --primary-button-disable: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n --secondary-button-border: linear-gradient(360deg, #46164d 0%, #71347b 100%);\n --secondary-button-text-color: #71347b;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(180deg, rgba(70, 22, 77, 0.05) 0%, rgba(113, 52, 123, 0.05) 100%);\n --tertiary-button-hover: linear-gradient(180deg, rgba(70, 22, 77, 0.1) 0%, rgba(113, 52, 123, 0.1) 100%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --drawer-title-color: #252c37;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --default-icon-color: #a3a3a3;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(130, 60, 141, 0.1019607843);\n --file-dropzone-selected-color: rgba(130, 60, 141, 0.2);\n --file-details-container-shadow: rgba(255, 252, 255, 0.6);\n --file-details-bg: #0d0d0d;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\n --ff-chip-text-color: #1e161f;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #71347b;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #71347b;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #71347b;\n --delete-text-color: #c50303;\n --ff-progress-bar-bg-color: #f0f0f0;\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #ffb803;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #14041c;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #71347b;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #71347b;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3c3838;\n --panel-shadow: rgba(0, 0, 0, 0.1019607843);\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --pie-chart-border-color: #b6b6b6;\n --button-bg-color: #f6ebff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #9c1ebb;\n --details-page-value-color: #808080;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592f7c 0%, #741ebb 100%);\n --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-icon-color-dark-variant: #ffffff;\n --avatar-background-color: #71347b;\n --avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #333234;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(207, 209, 226, 0.4431372549);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-search-field-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-active-status-color: #4caf50;\n --ff-machine-running-status-color: #2055de;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --ff-machine-input-field-border-color: #a3a3a3;\n --ff-machine-input-field-label-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #71347b;\n --ff-connecting-branch-modal-header: #71347b;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922b3e;\n --follow-user-icon-orange: #ed760e;\n --follow-user-icon-black: #0a0a0a;\n --follow-user-icon-pink: #e63244;\n --follow-user-icon-blue: #3b83bd;\n --follow-user-icon-navy: #20214f;\n --follow-user-icon-lightGreen: #bdecb6;\n --follow-user-icon-gray: #d9d9d9;\n --follow-user-icon-yellow: #cda434;\n --follow-user-icon-salmon: #d36e70;\n --dataset-tooltip-title: #808080;\n --dataset-tooltip-value: #ffffff;\n --defect-trivial: #8bc34a;\n --defect-text: #9e9e9e;\n --defect-tweak: #ffc107;\n --defect-minor: #ffeb3b;\n --defect-majour: #ff9800;\n --defect-crash: #f44336;\n --defect-block: #d32f2f;\n --defect-blocker: #b71c1c;\n --defect-critical: #c2185b;\n --defect-catastrophic: #6a1b9a;\n --defect-serious: #7b1fa2;\n --defect-normal: #03a9f4;\n --defect-small-or-trivial: #4dd0e1;\n}\n\n.ff-blue-theme {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #434db8;\n --text-color: #3c3838;\n --description-text: #7a7a7a;\n --click-able-text-color: #434db8;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #434db8;\n --border-color: #c2d2fb;\n --disable-color: rgba(67, 77, 184, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n --slider-table-color: #e9ebfb;\n --drawer-footer-bg: #ffffff;\n --drawer-footer-border: #f0e7f4;\n --text-bg-highlight: #f5fb00;\n --tooltip-bg-color: #1e161f;\n --tooltip-text-color: #ffffff;\n --toggle-strip-color: #cfd1e2;\n --toggle-strip-active: #434db8;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-button-bg-color: #ffffff;\n --toggle-disable-icon-color: #767994;\n --text-area-default-color: #747474;\n --add-icon-hover-color: #431b4a;\n --arrow-button-bg-color: #ffffff;\n --arrows-button-border-color: #ded1e5;\n --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n --chip-fill-color: #f9d5ff;\n --chip-text-color: #1e161f;\n --icon-color: #434db8;\n --default-icon-color: #a3a3a3;\n --tree-connecting-lines-color: #434db8;\n --primary-button-color: linear-gradient(188.79deg, #434db8 2.94%, #434db8 93.09%);\n --primary-button-hover: linear-gradient(179.06deg, #434db8 3.49%, #434db8 99.22%);\n --primary-button-disable: linear-gradient(180deg, #46164d 0%, #434db8 100%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #434db8 3.04%, #434db8 100%);\n --secondary-button-color-text: #6f7070;\n --secondary-button-border: #6f7070;\n --secondary-button-text-color: #46164d;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n --error: #e42525;\n --drawer-title-color: #1e161f;\n --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n --error_light: #e42525;\n --ff-success: #079455;\n --ff-warning: #f79009;\n --ff-header-text-color: #fdfaff;\n --ff-header-submenu-text-color: #666468;\n --ff-header-submenu-highlight-text-color: #170328;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --file-dropzone-default-color: rgba(67, 77, 184, 0.1019607843);\n --file-dropzone-selected-color: rgba(67, 77, 184, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --ff-mini-modal-border: #ffffff;\n --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n --ff-comment-input-border-color: #434db8;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #434db8;\n --ff-chips-blur-color: #575757;\n --ff-chip-bg: #ffffff;\n --ff-chip-text-color: #ffffff;\n --ff-mini-modal-footer-background: #aeb0c0;\n --input-default-border-color: #a3a3a3;\n --input-hover-border-color: #1e161f;\n --input-default-label-color: #747474;\n --input-label-bg-color: #ffffff;\n --input-active-text-color: #434db8;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #434db8;\n --tabs-border-color: #f1ebf2;\n --tabs-bg-color: #ede6f2;\n --tab-bg-color: #ffffff;\n --toast-close-icon-wrapper-bg: #fafafa;\n --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n --option-card-border-color: #ded1e5;\n --option-card-bg-color: #ffffff;\n --checkbox-bg-color: #fbfdff;\n --checkbox-border-color: #b5b5b5;\n --checkbox-partial-color: #ffffff;\n --checkbox-hover-color: #f7edff;\n --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n --multi-select-label-bg: #ffffff;\n --text-color-light: rgba(30, 22, 31, 0.5019607843);\n --radio-button-border: #b5b5b5;\n --radio-button-hover: #d3d3d3;\n --menu-variant-dark-icon-color: #ffffff;\n --menu-option-icon-color: #ffffff;\n --menu-option-icon-clicked: #434db8;\n --delete-text-color: #c50303;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\n --status-success-bg-color: #c6efcd;\n --status-success-text-color: #016102;\n --status-warning-bg-color: #ffe380;\n --status-warning-text-color: #ff8b00;\n --status-rejected-bg-color: #f7d9d9;\n --status-rejected-text-color: #c60202;\n --status-skipped-bg-color: #c4c3c3;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --status-button-bg-passed: #c6efcd;\n --status-button-bg-failed: #f7d9d9;\n --status-button-bg-running: #ecedf8;\n --status-button-bg-skipped: #c4c3c3;\n --status-button-bg-warning: #fcce46;\n --status-button-bg-terminated: #f7d9d9;\n --status-button-bg-partiallyExecuted: #dee7f1;\n --status-button-bg-aborted: #f7d9d9;\n --status-button-bg-notExecuted: #f7d9d9;\n --status-button-text-passed: #016102;\n --status-button-text-failed: #c50303;\n --status-button-text-running: #434db8;\n --status-button-text-skipped: #3c3838;\n --status-button-text-warning: #ffffff;\n --status-button-text-terminated: #c50303;\n --status-button-text-partiallyExecuted: #0d69d4;\n --status-button-text-aborted: #c50303;\n --status-button-text-notExecuted: #c50303;\n --ff-select-option-border-color: #ded1e5;\n --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n --ff-select-background-color: #ffffff;\n --ff-select-scroll-thumb-color: #d9d9d9;\n --ff-select-scroll-track-bg: #f1f1f1;\n --ff-select-scroll-thumb-hover: #b8b8b8;\n --ff-select-text-color: #808080;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #434db8;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #434db8;\n --ff-search-field-hover-color: #edecf8;\n --ff-search-filed-placeholder-text: #a3a3a3;\n --ff-search-filed-close-Icon: #14041c;\n --ff-paper-background-color: #f5f5f5;\n --ff-paper-dark-background-color: #d1c4e9;\n --sub-header-primary: #301349;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #434db8;\n --disabled-primary-color: #f9f9f9;\n --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n --license_expires_soon_color: #ba7422;\n --license_active_color: #268735;\n --license_expired_color: #e34242;\n --license_header_text_color: #592f7c;\n --license_active_status_color: #518e18;\n --license_expired_status_color: #ab3425;\n --pie-chart-border-color: #b6b6b6;\n --variable-dropdown-bg: #ffffff;\n --modal-header-text-color: #ffc600;\n --switch-license-text-color: #61296a;\n --switch-license-header-text-color: #610b86;\n --dotted-border-color: #000000;\n --select-license-header-text-color: #5f2868;\n --in-active-button-color: #808080;\n --button-background-gradient-color: #434db8;\n --details-page-value-color: #808080;\n --table-header-text-color: #252c37;\n --table-column-text-color: #1e161f;\n --ff-machine-input-field-border-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #434db8;\n --ff-connecting-branch-modal-header: #434db8;\n --ff-connecting-branch-modal-border: #e0e0e0;\n --ff-connecting-branch-scope-color: #079455;\n --ff-connecting-branch-delete-color: #e42525;\n --ff-app-header-menu-border-bottom-color: #ffffff;\n --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #434db8 0%, #434db8 100%);\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --label-edit-text-label-color: #434db8;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #edecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-avatar-background-color: #434db8;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4b494c;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #434db8 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --card-total-defect-color: #71347b;\n --card-defect-density: #5dc70c;\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n --plugins-header-bg-color: rgba(89, 47, 124, 0.1);\n --follow-user-icon-red: #922B3E;\n --follow-user-icon-orange: #ED760E;\n --follow-user-icon-black: #0A0A0A;\n --follow-user-icon-pink: #E63244;\n --follow-user-icon-blue: #3B83BD;\n --follow-user-icon-navy: #20214F;\n --follow-user-icon-lightGreen: #BDECB6;\n --follow-user-icon-gray: #D9D9D9;\n --follow-user-icon-yellow: #CDA434;\n --follow-user-icon-salmon: #D36E70;\n}";
|
1190
|
+
styleInject(css_248z$1g);
|
1191
1191
|
|
1192
1192
|
const ThemeContext = /*#__PURE__*/createContext$1(undefined);
|
1193
1193
|
const ThemeProvider = ({
|
@@ -1393,15 +1393,15 @@ const Drawer = ({
|
|
1393
1393
|
}), document.body);
|
1394
1394
|
};
|
1395
1395
|
|
1396
|
-
var css_248z$
|
1396
|
+
var css_248z$1f = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-accordion {\n border: 1px solid var(--border-color);\n border-radius: 4px;\n min-width: fit-content;\n}\n.ff-accordion .accordion-header {\n display: flex;\n justify-content: space-between;\n min-height: 32px;\n align-items: center;\n cursor: pointer;\n}\n.ff-accordion .accordion-header .header-title {\n padding: 8px;\n}\n.ff-accordion .accordion-header .accordion-arrow {\n display: flex;\n padding: 8px;\n align-items: center;\n transition: transform 0.3s ease;\n}\n.ff-accordion .accordion-header .accordion-arrow.expanded {\n transform: rotate(180deg);\n}\n.ff-accordion .accordion-header .accordion-arrow:hover {\n color: var(--tooltip-bg-color);\n}\n.ff-accordion .accordion-header.expanded {\n background-color: var(--hover-color);\n border-bottom: 1px solid var(--hover-color);\n}\n.ff-accordion .accordion-header:hover {\n background-color: var(--hover-color);\n}\n.ff-accordion .accordion-content {\n padding: 8px;\n}";
|
1397
|
+
styleInject(css_248z$1f);
|
1398
|
+
|
1399
|
+
var css_248z$1e = "/* global.css or component CSS */\nbody {\n font-family: \"Poppins\", sans-serif;\n}";
|
1397
1400
|
styleInject(css_248z$1e);
|
1398
1401
|
|
1399
|
-
var css_248z$1d = "
|
1402
|
+
var css_248z$1d = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-tooltip {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-tooltip-container {\n cursor: pointer;\n display: inline-block;\n}\n\n.ff-tooltip {\n position: fixed;\n width: max-content;\n max-width: 60vw;\n word-wrap: break-word;\n background-color: var(--tooltip-bg-color);\n line-height: 18px;\n color: var(--tooltip-text-color);\n text-align: center;\n border-radius: 5px;\n padding: 4px 8px;\n opacity: 0;\n z-index: 10000;\n}\n.ff-tooltip--visible {\n opacity: 1;\n transition: opacity 0.3s;\n}";
|
1400
1403
|
styleInject(css_248z$1d);
|
1401
1404
|
|
1402
|
-
var css_248z$1c = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-tooltip {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-tooltip-container {\n cursor: pointer;\n display: inline-block;\n}\n\n.ff-tooltip {\n position: fixed;\n width: max-content;\n max-width: 60vw;\n word-wrap: break-word;\n background-color: var(--tooltip-bg-color);\n line-height: 18px;\n color: var(--tooltip-text-color);\n text-align: center;\n border-radius: 5px;\n padding: 4px 8px;\n opacity: 0;\n z-index: 10000;\n}\n.ff-tooltip--visible {\n opacity: 1;\n transition: opacity 0.3s;\n}";
|
1403
|
-
styleInject(css_248z$1c);
|
1404
|
-
|
1405
1405
|
const checkEmpty = value => {
|
1406
1406
|
// Check for null or undefined
|
1407
1407
|
if (value == null) return true;
|
@@ -1637,8 +1637,8 @@ const Accordion = ({
|
|
1637
1637
|
});
|
1638
1638
|
};
|
1639
1639
|
|
1640
|
-
var css_248z$1b = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .default-label {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .active-default-label, .ff-multiselect-container-with-icon .ff-multiselect-wrapper .error-text {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-multiselect-container-with-icon {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n width: 100%;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper {\n flex-grow: 1;\n box-sizing: border-box;\n transition: all 0.3s ease;\n cursor: pointer;\n position: relative;\n border: 1px solid var(--default-icon-color);\n border-radius: 4px;\n background: var(--drawer-footer-bg);\n min-width: 150px;\n height: 32px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect {\n position: relative;\n padding: 6px 3px;\n border: none;\n border-radius: 4px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main {\n display: flex;\n flex: 1;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .default-label {\n font-family: Poppins;\n font-weight: 400;\n letter-spacing: 0.5px;\n transition: all 0.3s ease;\n color: var(--default-icon-color);\n line-height: 18px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .active-default-label {\n font-size: 8px !important;\n height: 8px;\n font-family: Poppins;\n font-weight: 400;\n letter-spacing: 0.5px;\n transition: all 0.3s ease;\n background-color: var(--multi-select-label-bg);\n line-height: 12px;\n color: var(--default-icon-color);\n padding: 0 4px;\n position: absolute;\n left: 8px;\n top: -6px;\n pointer-events: none;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n overflow-y: auto;\n max-height: 64px;\n gap: 5px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container::-webkit-scrollbar {\n width: 4px;\n height: 40px;\n border-radius: 12px 0px 0px 0px;\n background: var(--description-text);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container::-webkit-scrollbar-track {\n background: var(--ff-select-scroll-track-bg);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container::-webkit-scrollbar-thumb {\n background: var(--ff-select-scroll-thumb-color);\n border-radius: 10px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container::-webkit-scrollbar-thumb:hover {\n background: var(--ff-select-scroll-thumb-hover);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip {\n display: flex;\n align-items: center;\n justify-content: space-between;\n box-sizing: border-box;\n border: 0.5px solid var(--tabs-border-color);\n padding-left: 4px;\n gap: 4px;\n height: 16px;\n border-radius: 15px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label {\n line-height: 14px;\n color: var(--tooltip-bg-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label.label-padding {\n padding-right: 3px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-close-icon {\n color: var(--brand-color);\n cursor: pointer;\n padding: 0px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container {\n flex: 1;\n min-width: 20px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container input {\n width: 100%;\n min-width: 30px;\n max-width: calc(100% - 0px);\n padding: 2px;\n box-sizing: border-box;\n border: none;\n font-size: 12px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container input:focus {\n outline: none;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect .ff-multiselect-more-chip {\n display: flex;\n align-items: center;\n width: 16px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__toggle {\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow {\n transition: transform 0.3s ease;\n transform: rotate(360deg);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow svg path {\n transition: all 0.3s ease;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow--opened-dropdown {\n transform: rotate(180deg);\n transition: transform 0.3s ease;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper:hover {\n border: 1px solid var(--tooltip-bg-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--tooltip-bg-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper:hover .ff-select-arrow svg path {\n fill: var(--tooltip-bg-color);\n transition: all 0.3s ease;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--with-options {\n height: fit-content;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--opened-dropdown {\n border: 1px solid var(--brand-color);\n height: fit-content;\n cursor: default;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--opened-dropdown .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--brand-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--opened-dropdown:hover {\n border: 1px solid var(--brand-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--opened-dropdown:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--opened-dropdown:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--brand-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--error {\n border: 1px solid var(--error-light);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--error .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--error-light);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--error:hover {\n border: 1px solid var(--error-light);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--error:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--error:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--error-light);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled {\n opacity: 0.5;\n pointer-events: none;\n border: 1px solid var(--multi-select-border);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--multi-select-border);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled:hover {\n border: 1px solid var(--multi-select-border);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--multi-select-border);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled .ff-select-arrow svg path {\n fill: var(--multi-select-border);\n transition: all 0.3s ease;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled:hover .ff-select-arrow svg path {\n fill: var(--multi-select-border);\n transition: all 0.3s ease;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label {\n color: var(--text-color-light);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .error-text {\n position: absolute;\n margin-top: 4px;\n left: 12px;\n color: var(--error-light);\n letter-spacing: 0.5px;\n}\n.ff-multiselect-container-with-icon .ff-manage-labels-text {\n position: absolute;\n right: 0;\n margin-top: 4px;\n}\n.ff-multiselect-container-with-icon .ff-label-plus-icon {\n cursor: pointer;\n}";
|
1641
|
-
styleInject(css_248z$
|
1640
|
+
var css_248z$1c = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .default-label {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .active-default-label, .ff-multiselect-container-with-icon .ff-multiselect-wrapper .error-text {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-multiselect-container-with-icon {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n width: 100%;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper {\n flex-grow: 1;\n box-sizing: border-box;\n transition: all 0.3s ease;\n cursor: pointer;\n position: relative;\n border: 1px solid var(--default-icon-color);\n border-radius: 4px;\n background: var(--drawer-footer-bg);\n min-width: 150px;\n height: 32px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect {\n position: relative;\n padding: 6px 3px;\n border: none;\n border-radius: 4px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main {\n display: flex;\n flex: 1;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .default-label {\n font-family: Poppins;\n font-weight: 400;\n letter-spacing: 0.5px;\n transition: all 0.3s ease;\n color: var(--default-icon-color);\n line-height: 18px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .active-default-label {\n font-size: 8px !important;\n height: 8px;\n font-family: Poppins;\n font-weight: 400;\n letter-spacing: 0.5px;\n transition: all 0.3s ease;\n background-color: var(--multi-select-label-bg);\n line-height: 12px;\n color: var(--default-icon-color);\n padding: 0 4px;\n position: absolute;\n left: 8px;\n top: -6px;\n pointer-events: none;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n overflow-y: auto;\n max-height: 64px;\n gap: 5px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container::-webkit-scrollbar {\n width: 4px;\n height: 40px;\n border-radius: 12px 0px 0px 0px;\n background: var(--description-text);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container::-webkit-scrollbar-track {\n background: var(--ff-select-scroll-track-bg);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container::-webkit-scrollbar-thumb {\n background: var(--ff-select-scroll-thumb-color);\n border-radius: 10px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container::-webkit-scrollbar-thumb:hover {\n background: var(--ff-select-scroll-thumb-hover);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip {\n display: flex;\n align-items: center;\n justify-content: space-between;\n box-sizing: border-box;\n border: 0.5px solid var(--tabs-border-color);\n padding-left: 4px;\n gap: 4px;\n height: 16px;\n border-radius: 15px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label {\n line-height: 14px;\n color: var(--tooltip-bg-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label.label-padding {\n padding-right: 3px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-close-icon {\n color: var(--brand-color);\n cursor: pointer;\n padding: 0px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container {\n flex: 1;\n min-width: 20px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container input {\n width: 100%;\n min-width: 30px;\n max-width: calc(100% - 0px);\n padding: 2px;\n box-sizing: border-box;\n border: none;\n font-size: 12px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container input:focus {\n outline: none;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect .ff-multiselect-more-chip {\n display: flex;\n align-items: center;\n width: 16px;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__toggle {\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow {\n transition: transform 0.3s ease;\n transform: rotate(360deg);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow svg path {\n transition: all 0.3s ease;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow--opened-dropdown {\n transform: rotate(180deg);\n transition: transform 0.3s ease;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper:hover {\n border: 1px solid var(--tooltip-bg-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--tooltip-bg-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper:hover .ff-select-arrow svg path {\n fill: var(--tooltip-bg-color);\n transition: all 0.3s ease;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--with-options {\n height: fit-content;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--opened-dropdown {\n border: 1px solid var(--brand-color);\n height: fit-content;\n cursor: default;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--opened-dropdown .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--brand-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--opened-dropdown:hover {\n border: 1px solid var(--brand-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--opened-dropdown:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--opened-dropdown:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--brand-color);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--error {\n border: 1px solid var(--error-light);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--error .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--error-light);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--error:hover {\n border: 1px solid var(--error-light);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--error:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--error:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--error-light);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled {\n opacity: 0.5;\n pointer-events: none;\n border: 1px solid var(--multi-select-border);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--multi-select-border);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled:hover {\n border: 1px solid var(--multi-select-border);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n color: var(--multi-select-border);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled .ff-select-arrow svg path {\n fill: var(--multi-select-border);\n transition: all 0.3s ease;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled:hover .ff-select-arrow svg path {\n fill: var(--multi-select-border);\n transition: all 0.3s ease;\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper--disabled .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label {\n color: var(--text-color-light);\n}\n.ff-multiselect-container-with-icon .ff-multiselect-wrapper .error-text {\n position: absolute;\n margin-top: 4px;\n left: 12px;\n color: var(--error-light);\n letter-spacing: 0.5px;\n}\n.ff-multiselect-container-with-icon .ff-manage-labels-text {\n position: absolute;\n right: 0;\n margin-top: 4px;\n}\n.ff-multiselect-container-with-icon .ff-label-plus-icon {\n cursor: pointer;\n}";
|
1641
|
+
styleInject(css_248z$1c);
|
1642
1642
|
|
1643
1643
|
const dropdownDefaultCSSData$1 = {
|
1644
1644
|
verticalMargin: 4,
|
@@ -1646,11 +1646,11 @@ const dropdownDefaultCSSData$1 = {
|
|
1646
1646
|
maxDropdownHeight: 160
|
1647
1647
|
};
|
1648
1648
|
|
1649
|
-
var css_248z$
|
1650
|
-
styleInject(css_248z$
|
1649
|
+
var css_248z$1b = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd, .ff-multiselect-dropdown-container .dropdown-option-container .dropdown-option-label {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-multiselect-dropdown-container {\n position: absolute;\n background: var(--drawer-footer-bg);\n z-index: 1000;\n box-shadow: 0px 1px 4px 0px var(--ff-select-option-wrapper-box-shadow);\n border: 0.5px solid var(--ff-select-option-border-color);\n border-radius: 4px;\n box-sizing: border-box;\n margin-block: 4px;\n max-height: 160px;\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper {\n max-height: 128px;\n overflow-y: auto;\n border-radius: 2px;\n overflow-x: hidden;\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar {\n width: 4px;\n height: 40px;\n border-radius: 12px 0px 0px 0px;\n background: var(--description-text);\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar-track {\n background: var(--ff-select-scroll-track-bg);\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar-thumb {\n background: var(--ff-select-scroll-thumb-color);\n border-radius: 10px;\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar-thumb:hover {\n background: var(--ff-select-scroll-thumb-hover);\n}\n.ff-multiselect-dropdown-container .no-options {\n color: var(--ff-select-text-color);\n text-align: center;\n margin: 0;\n padding: 7px;\n line-height: 12px;\n}\n.ff-multiselect-dropdown-container .dropdown-option-container {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n height: 32px;\n padding: 4px 8px;\n gap: 4px;\n border-radius: 4px 0px 0px 0px;\n background-color: white;\n}\n.ff-multiselect-dropdown-container .dropdown-option-container .dropdown-option-label {\n color: var(--ff-select-text-color);\n}\n.ff-multiselect-dropdown-container .dropdown-option-container:hover {\n background-color: var(--hover-color);\n}\n.ff-multiselect-dropdown-container:focus {\n outline: none;\n}\n.ff-multiselect-dropdown-container .select-button-container {\n box-sizing: border-box;\n width: 100%;\n border-top: 1px solid var(--slider-table-color);\n height: 30px;\n display: flex;\n justify-content: center;\n align-items: center;\n}";
|
1650
|
+
styleInject(css_248z$1b);
|
1651
1651
|
|
1652
|
-
var css_248z$
|
1653
|
-
styleInject(css_248z$
|
1652
|
+
var css_248z$1a = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-checkbox--overlay {\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n cursor: pointer;\n position: relative;\n}\n.ff-checkbox--overlay .ff-checkbox-input {\n display: none;\n}\n.ff-checkbox--overlay .ff-checkbox-custom {\n width: 16px;\n height: 16px;\n border: 1px solid var(--checkbox-border-color);\n box-sizing: border-box;\n border-radius: 2px;\n margin-right: 4px;\n background-color: var(--checkbox-bg-color);\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n transition: border-color background-color;\n}\n.ff-checkbox--overlay .ff-checkbox-custom .ff-tick-icon {\n padding: 2px !important;\n}\n.ff-checkbox--overlay .ff-checkbox-custom::before {\n content: \"\";\n width: 9px;\n height: 2px;\n background-color: var(--checkbox-partial-color);\n border-radius: 2px;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(180deg);\n opacity: 0;\n transition: border-color background-color;\n}\n.ff-checkbox--overlay .ff-checkbox-custom::after {\n content: \"\";\n width: 16px;\n height: 16px;\n border: 4px solid var(--checkbox-hover-color);\n border-radius: 4px;\n position: absolute;\n opacity: 0;\n background-color: var(--checkbox-hover-color);\n z-index: -1;\n transition: border-color background-color;\n}\n.ff-checkbox--overlay .ff-checkbox-custom:hover::after {\n opacity: 1;\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked + .ff-checkbox-custom {\n background: var(--brand-color);\n border-color: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked + .ff-checkbox-custom.ff-checkbox-checked--passed {\n background-color: var(--ff-card-passed-status-bg-color);\n border-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked + .ff-checkbox-custom.ff-checkbox-checked--failed {\n background-color: var(--ff-card-failed-status-bg-color);\n border-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked + .ff-checkbox-custom.ff-checkbox-checked--warning {\n background-color: var(--ff-card-warning-status-bg-color);\n border-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked + .ff-checkbox-custom.ff-checkbox-checked--skipped {\n background-color: var(--ff-card-skipped-status-bg-color);\n border-color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked + .ff-checkbox-custom.ff-checkbox-checked--flaky {\n background-color: var(--ff-card-flaky-status-bg-color);\n border-color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom {\n background: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom.ff-checkbox-checked--passed {\n background: var(--ff-card-passed-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom.ff-checkbox-checked--failed {\n background: var(--ff-card-failed-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom.ff-checkbox-checked--warning {\n background: var(--ff-card-warning-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom.ff-checkbox-checked--skipped {\n background: var(--ff-card-skipped-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom.ff-checkbox-checked--flaky {\n background: var(--ff-card-flaky-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom::after {\n opacity: 1;\n}\n.ff-checkbox--overlay .ff-checkbox-input:disabled + .ff-checkbox-custom {\n opacity: 0.5;\n cursor: not-allowed;\n border: 1px solid var(--checkbox-border-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:disabled + .ff-checkbox-custom::after {\n opacity: 0;\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial {\n background-color: var(--brand-color);\n border: none;\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial::before {\n opacity: 1;\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial:hover {\n background-color: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial:hover::after {\n opacity: 1;\n}\n.ff-checkbox--overlay .ff-checkbox--passed {\n border-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox--failed {\n border-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox--warning {\n border-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox--skipped {\n border-color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-checkbox--overlay .ff-checkbox--flaky {\n border-color: var(--ff-card-flaky-status-bg-color);\n}";
|
1653
|
+
styleInject(css_248z$1a);
|
1654
1654
|
|
1655
1655
|
const Checkbox = ({
|
1656
1656
|
id,
|
@@ -2227,8 +2227,8 @@ const MultiSelect = ({
|
|
2227
2227
|
});
|
2228
2228
|
};
|
2229
2229
|
|
2230
|
-
var css_248z$
|
2231
|
-
styleInject(css_248z$
|
2230
|
+
var css_248z$19 = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-toaster-overlay {\n position: fixed;\n bottom: 0;\n right: 0;\n width: 100%;\n height: 100%;\n display: flex;\n pointer-events: none;\n justify-content: flex-end;\n align-items: flex-end;\n}\n.ff-toaster-overlay .ff-toaster {\n background-color: var(--drawer-footer-bg);\n display: flex;\n border-radius: 10px;\n margin: 16px;\n pointer-events: auto;\n min-width: 320px;\n max-width: 600px;\n gap: 8px;\n box-shadow: 0px 1px 4px 0px var(--toaster-boxshadow);\n animation: slideInToasterBottomRight 0.5s forwards;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container {\n padding: 8px;\n display: flex;\n border-radius: 10px;\n gap: 8px;\n width: 100%;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container::before {\n content: \"\";\n position: absolute;\n inset: 0;\n border-radius: 8px;\n padding: 1px;\n -webkit-mask: linear-gradient(var(--drawer-footer-bg) 0 0) content-box, linear-gradient(var(--drawer-footer-bg) 0 0);\n -webkit-mask-composite: xor;\n mask-composite: exclude;\n z-index: -1;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: center;\n gap: 4px;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content__title {\n max-width: 500px;\n word-wrap: break-word;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content__message {\n max-width: 500px;\n word-wrap: break-word;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content__prompt {\n margin-top: 4px;\n display: flex;\n gap: 10px;\n}\n.ff-toaster-overlay .ff-toaster--success::before {\n background: var(--toaster-success-border);\n}\n.ff-toaster-overlay .ff-toaster--warning::before {\n background: var(--toaster-warning-border);\n}\n.ff-toaster-overlay .ff-toaster--info::before {\n background: var(--toaster-info-border);\n}\n.ff-toaster-overlay .ff-toaster--danger::before, .ff-toaster-overlay .ff-toaster--confirm::before {\n background: var(--toaster-danger_confirm-border);\n}\n.ff-toaster-overlay .ff-toaster .ff-close-icon-wrapper {\n box-sizing: border-box;\n cursor: pointer;\n height: fit-content;\n width: fit-content;\n border-radius: 8px;\n padding: 8px;\n background: var(--toast-close-icon-wrapper-bg);\n margin-left: auto;\n}\n.ff-toaster-overlay.exiting {\n animation: slideOutToasterBottomRight 0.5s forwards;\n}\n\n@keyframes slideOutToasterBottomRight {\n from {\n transform: translateX(0%);\n }\n to {\n transform: translateX(100%);\n }\n}\n@keyframes slideInToasterBottomRight {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0%);\n }\n}\n.fireflink-stories-toaster-container .fireflink-stories-toaster-container-row {\n display: flex;\n gap: 5px;\n margin: 15px;\n}";
|
2231
|
+
styleInject(css_248z$19);
|
2232
2232
|
|
2233
2233
|
const Toaster = ({
|
2234
2234
|
isOpen = false,
|
@@ -2337,8 +2337,8 @@ const Toaster = ({
|
|
2337
2337
|
}), document.body);
|
2338
2338
|
};
|
2339
2339
|
|
2340
|
-
var css_248z$
|
2341
|
-
styleInject(css_248z$
|
2340
|
+
var css_248z$18 = "/* Container */\n.ff-container {\n margin-right: auto;\n margin-left: auto;\n width: 90%;\n display: grid;\n}\n\n.ff-container-fluid {\n width: 100%;\n margin-right: auto;\n margin-left: auto;\n display: grid;\n}\n\n/* Row */\n.ff-row {\n display: grid;\n grid-template-columns: repeat(12, 1fr);\n}\n\n/* Column sizes based on a 12-column layout */\n.ff-col {\n grid-column: span 12;\n}\n\n.ff-col-1 {\n grid-column: span 1;\n}\n\n.ff-col-2 {\n grid-column: span 2;\n}\n\n.ff-col-3 {\n grid-column: span 3;\n}\n\n.ff-col-4 {\n grid-column: span 4;\n}\n\n.ff-col-5 {\n grid-column: span 5;\n}\n\n.ff-col-6 {\n grid-column: span 6;\n}\n\n.ff-col-7 {\n grid-column: span 7;\n}\n\n.ff-col-8 {\n grid-column: span 8;\n}\n\n.ff-col-9 {\n grid-column: span 9;\n}\n\n.ff-col-10 {\n grid-column: span 10;\n}\n\n.ff-col-11 {\n grid-column: span 11;\n}\n\n.ff-col-12 {\n grid-column: span 12;\n}\n\n@media (max-width: 768px) {\n /* Stacking columns on small screens */\n .ff-col {\n grid-column: span 12;\n }\n}";
|
2341
|
+
styleInject(css_248z$18);
|
2342
2342
|
|
2343
2343
|
const Container = ({
|
2344
2344
|
children,
|
@@ -2380,8 +2380,8 @@ const Col = ({
|
|
2380
2380
|
});
|
2381
2381
|
};
|
2382
2382
|
|
2383
|
-
var css_248z$
|
2384
|
-
styleInject(css_248z$
|
2383
|
+
var css_248z$17 = ".ff--switch-container {\n position: relative;\n display: flex;\n align-items: center;\n}\n.ff--switch-container .ff--switch-checkbox {\n height: 0;\n width: 0;\n display: none;\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label .ff--switch-button {\n right: -1px;\n border: 1px solid var(--brand-color);\n background: var(--toggle-button-bg-color);\n transition: all 0.3s;\n box-shadow: 0px 0px 2px 0px var(--toggle-strip-shadow);\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label .ff--switch-button .ff-checked-icon--primary svg path {\n fill: var(--brand-color);\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label--primary {\n background: var(--brand-color);\n transition: all 0.3s;\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label:disabled {\n cursor: default;\n color: var(--disable-color);\n background: var(--disable-color);\n}\n.ff--switch-container .ff--switch-checkbox:disabled {\n cursor: no-drop;\n}\n.ff--switch-container .ff--switch-label {\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n border-radius: 8px;\n position: relative;\n background: var(--toggle-strip-color);\n transition: all 0.3s;\n}\n.ff--switch-container .ff--switch-label--disabled {\n opacity: 0.5;\n cursor: no-drop;\n}\n.ff--switch-container .ff--switch-label .ff--switch-button {\n position: absolute;\n left: 0;\n border: 1px solid var(--toggle-strip-color);\n display: flex;\n background: var(--toggle-button-bg-color);\n border-radius: 50%;\n box-shadow: 0px 0px 2px 0px var(--toggle-strip-shadow);\n transition: all 0.3s;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n}\n.ff--switch-container .ff--switch-label .ff--switch-button .ff-unchecked-icon--primary svg path {\n fill: var(--toggle-disable-icon-color);\n}\n.ff--switch-container .default--small {\n width: 24px;\n height: 10px;\n}\n.ff--switch-container .default--small .ff--switch-button {\n width: 16px;\n height: 16px;\n transform: translateX(0);\n}\n.ff--switch-container .default--small .ff--switch-button.checked {\n transform: translateX(10px);\n}\n.ff--switch-container .default--medium {\n width: 32px;\n height: 14px;\n}\n.ff--switch-container .default--medium .ff--switch-button {\n width: 20px;\n height: 20px;\n transform: translateX(0);\n}\n.ff--switch-container .default--medium .ff--switch-button.checked {\n transform: translateX(14px);\n}\n.ff--switch-container .default--large {\n width: 40px;\n height: 16px;\n}\n.ff--switch-container .default--large .ff--switch-button {\n width: 24px;\n height: 24px;\n transform: translateX(0);\n}\n.ff--switch-container .default--large .ff--switch-button.checked {\n transform: translateX(16px);\n}";
|
2384
|
+
styleInject(css_248z$17);
|
2385
2385
|
|
2386
2386
|
const Toggle = ({
|
2387
2387
|
onChange,
|
@@ -2459,8 +2459,8 @@ const Toggle = ({
|
|
2459
2459
|
});
|
2460
2460
|
};
|
2461
2461
|
|
2462
|
-
var css_248z$
|
2463
|
-
styleInject(css_248z$
|
2462
|
+
var css_248z$16 = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-chip-wrapper .ff-default-chip-style--custom {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-chip-wrapper {\n display: inline-flex;\n margin: 5px;\n justify-content: center;\n align-items: center;\n}\n.ff-chip-wrapper .ff-default-chip-style {\n display: flex;\n align-items: center;\n justify-content: space-around;\n width: fit-content;\n gap: 5px;\n height: 17px;\n border-radius: 25px;\n padding: 1px 6px;\n line-height: 15px;\n border: none;\n transition: transform 0.4s ease-in-out, box-shadow 0.4s ease-in-out, padding 0.4s ease-in-out;\n box-shadow: 1px 1px 3px 0px var(--ff-chips-blur-color) inset, -1px -1px 2px 0px var(--ff-chip-bg) inset, 1px -1px 2px 0px var(--ff-chips-blur-color) inset, -1px -1px 2px 0px var(--ff-chips-blur-color), 1px 1px 2px 0px var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--fullText:hover {\n box-shadow: 1px 1px 3px 0px var(--ff-chips-blur-color) inset, -1px -1px 2px 0px var(--ff-chip-bg) inset, 1px -1px 2px 0px var(--ff-chips-blur-color) inset, -1px -1px 2px 0px var(--ff-chips-blur-color), 1px 1px 2px 0px var(--ff-chip-bg);\n padding-right: 7px;\n}\n.ff-chip-wrapper .ff-default-chip-style--primary {\n background-color: var(--ff-chips-fill-color);\n color: var(--ff-chip-bg);\n color: var(--ff-chip-text-color);\n}\n.ff-chip-wrapper .ff-default-chip-style--success {\n background-color: var(--ff-success);\n color: var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--error {\n background-color: var(--ff-error-light);\n color: var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--warning {\n background-color: var(--ff-warning);\n color: var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--custom {\n background: rgba(97, 11, 134, 0.1019607843);\n color: #610b86;\n padding: 2px 8px;\n border-radius: 12px;\n cursor: pointer;\n white-space: nowrap;\n box-shadow: none;\n transition: background-color 0.3s ease, color 0.3s ease;\n}\n.ff-chip-wrapper .ff-default-chip-style--custom:hover {\n background-color: #610b86;\n color: #fdfaff;\n}\n.ff-chip-wrapper .ff-default-chip-style--public {\n background-color: var(--public-chip-bg-color);\n color: var(--ff-chip-bg);\n color: var(--license_header_text_color);\n}\n.ff-chip-wrapper .ff-default-chip-style--partial-public {\n background-color: var(--partial-public-chip-bg-color);\n color: var(--ff-chip-bg);\n color: var(--license_header_text_color);\n}\n.ff-chip-wrapper .ff-default-chip-style--private {\n background-color: var(--private-chip-bg-color);\n color: var(--ff-chip-bg);\n color: var(--license_header_text_color);\n}\n.ff-chip-wrapper .ff-default-chip-style--disabled {\n background-color: var(--disabled-chip-bg-color);\n color: var(--ff-chip-bg);\n color: var(--table-column-text-color);\n}\n.ff-chip-wrapper .ff-default-chip-style--count {\n background-color: var(--impact-list-chip-bg-color);\n color: var(--ff-chip-bg);\n color: var(--ff-chip-text-color);\n}";
|
2463
|
+
styleInject(css_248z$16);
|
2464
2464
|
|
2465
2465
|
const Chip = ({
|
2466
2466
|
label = '',
|
@@ -2491,8 +2491,8 @@ const Chip = ({
|
|
2491
2491
|
});
|
2492
2492
|
};
|
2493
2493
|
|
2494
|
-
var css_248z$
|
2495
|
-
styleInject(css_248z$
|
2494
|
+
var css_248z$15 = ".fontXs, .ff-input-fieldset .ff-input-container .ff-input::placeholder, .ff-input-fieldset .ff-input-container .ff-input-label-container::placeholder, .ff-input-fieldset .ff-input-container:focus-within .ff-input-label-container, .ff-input-fieldset .ff-input-container .ff-input-message {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-input-fieldset .ff-input-container .ff-input, .ff-input-fieldset .ff-input-container .ff-input-label-container {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-input-fieldset {\n display: inline-block;\n border: none;\n padding: 0;\n margin: 0;\n width: 100%;\n}\n.ff-input-fieldset--disabled {\n border: 1px solid var(--input-default-border-color);\n background: var(--input-disabled-background-color);\n border-radius: 4px;\n opacity: 0.5;\n}\n.ff-input-fieldset .ff-input-container {\n display: flex;\n flex-direction: column;\n position: relative;\n}\n.ff-input-fieldset .ff-input-container .ff-input, .ff-input-fieldset .ff-input-container .ff-input-label-container {\n padding: 6px 8px;\n border: 1px solid var(--input-default-border-color);\n border-radius: 4px;\n outline: none;\n line-height: 18px;\n}\n.ff-input-fieldset .ff-input-container .ff-input--medium {\n padding: 10px 9px;\n}\n.ff-input-fieldset .ff-input-container .ff-input:disabled, .ff-input-fieldset .ff-input-container .ff-input-label-container:disabled {\n cursor: not-allowed;\n border: none;\n background: transparent;\n}\n.ff-input-fieldset .ff-input-container .ff-input::placeholder, .ff-input-fieldset .ff-input-container .ff-input-label-container::placeholder {\n opacity: 0;\n line-height: 15px;\n}\n.ff-input-fieldset .ff-input-container .ff-input--danger {\n border-color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container .ff-input--transparentBackground {\n background: transparent;\n}\n.ff-input-fieldset .ff-input-container .ff-input--no-border {\n border: none;\n}\n.ff-input-fieldset .ff-input-container .ff-input--placeholder::placeholder {\n opacity: 1;\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container {\n display: flex;\n gap: 2px;\n position: absolute;\n border: none;\n outline: none;\n line-height: 18px;\n margin-top: 1px;\n transition: all 0.3s ease-in-out;\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container--medium {\n line-height: 25px;\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container .ff-input-label {\n color: var(--input-default-label-color);\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container .ff-input-label--danger {\n color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container .ff-input-label--disabled {\n color: var(--input-default-border-color);\n background-color: var(--input-label-bg-color);\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container .required-asterisk {\n color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input-label {\n color: var(--input-default-label-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input-label--no-hover {\n color: var(--input-default-label-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input-label--disabled {\n color: var(--input-default-border-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input-label--danger {\n color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input, .ff-input-fieldset .ff-input-container:hover .ff-input-label-container {\n border-color: var(--brand-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input--no-hover {\n border-color: var(--input-default-border-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input--disabled {\n background: transparent;\n border-color: var(--input-default-border-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input--danger {\n border-color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input-label-container {\n top: -9px;\n background-color: var(--input-label-bg-color);\n line-height: 15px;\n padding: 0px 2px;\n margin-left: 10px;\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input-label--primary {\n color: var(--brand-color);\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input-label--danger {\n color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input, .ff-input-fieldset .ff-input-container:focus-within .ff-input-label-container {\n border-color: var(--brand-color);\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input--danger {\n border-color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input::placeholder, .ff-input-fieldset .ff-input-container:focus-within .ff-input-label-container::placeholder {\n opacity: 1;\n margin-bottom: 1px;\n}\n.ff-input-fieldset .ff-input-container .ff-input-message {\n padding: 0px 4px;\n margin-left: 8px;\n line-height: 15px;\n}\n.ff-input-fieldset .ff-input-container .ff-input-message--danger {\n color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container--float .ff-input-label-container {\n top: -9px;\n font-size: 10px;\n background-color: var(--input-label-bg-color);\n line-height: 15px;\n padding: 0px 2px;\n margin-left: 10px;\n}\n.ff-input-fieldset .ff-input-container--float--disabled {\n cursor: not-allowed;\n}\n.ff-input-fieldset .ff-input-container--float--disabled .ff-input-label-container {\n cursor: not-allowed;\n}";
|
2495
|
+
styleInject(css_248z$15);
|
2496
2496
|
|
2497
2497
|
const Input = /*#__PURE__*/forwardRef(({
|
2498
2498
|
type = 'text',
|
@@ -2584,8 +2584,8 @@ const Input = /*#__PURE__*/forwardRef(({
|
|
2584
2584
|
});
|
2585
2585
|
});
|
2586
2586
|
|
2587
|
-
var css_248z$
|
2588
|
-
styleInject(css_248z$
|
2587
|
+
var css_248z$14 = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-radial-chart-container svg text {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-radial-chart-container {\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n.ff-radial-chart-container svg {\n vertical-align: middle;\n}\n.ff-radial-chart-container svg text {\n font-size: var(--fontSize) !important;\n font-weight: 400;\n}";
|
2588
|
+
styleInject(css_248z$14);
|
2589
2589
|
|
2590
2590
|
const useColorMappings$1 = () => useMemo(() => {
|
2591
2591
|
return {
|
@@ -2731,8 +2731,8 @@ const RadialChart = ({
|
|
2731
2731
|
});
|
2732
2732
|
};
|
2733
2733
|
|
2734
|
-
var css_248z$
|
2735
|
-
styleInject(css_248z$
|
2734
|
+
var css_248z$13 = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-expandable-chip-menu--medium, .ff-expandable-chip-menu .ff-sub-chip--medium {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-expandable-chip-menu {\n display: inline-flex;\n gap: 16px;\n align-items: center;\n border-radius: 16px;\n cursor: pointer;\n overflow: hidden;\n width: auto;\n padding: 4px 8px;\n transition: all 0.3s ease;\n}\n.ff-expandable-chip-menu--primary {\n border: 0.5px solid var(--brand-color);\n background-color: var(--expandable-menu-default-bg);\n}\n.ff-expandable-chip-menu .ff-label-chip {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 4px;\n white-space: nowrap;\n padding: 2px 0;\n}\n.ff-expandable-chip-menu .ff-label-chip .arrow-icon {\n height: 14px;\n width: 14px;\n display: grid;\n place-items: center;\n}\n.ff-expandable-chip-menu .ff-label-chip--primary {\n color: var(--brand-color);\n}\n.ff-expandable-chip-menu--disabled {\n opacity: 0.5;\n}\n.ff-expandable-chip-menu--disabled:disabled {\n pointer-events: none;\n}\n.ff-expandable-chip-menu--medium {\n line-height: 18px;\n}\n.ff-expandable-chip-menu .ff-sub-chips {\n display: flex;\n gap: 8px;\n max-width: 500px;\n overflow-x: auto;\n -ms-overflow-style: none;\n transform: scaleX(0);\n transform-origin: left;\n transition: transform 0.3s ease, opacity 0.3s ease;\n opacity: 0;\n}\n.ff-expandable-chip-menu .ff-sub-chips::-webkit-scrollbar {\n display: none;\n}\n.ff-expandable-chip-menu.expanded .ff-sub-chips {\n transform: scaleX(1);\n opacity: 1;\n}\n.ff-expandable-chip-menu .ff-sub-chip {\n padding: 2px 8px;\n border-radius: 12px;\n white-space: nowrap;\n transition: background-color 0.3s ease, color 0.3s ease;\n opacity: 0;\n transform: translateX(-10px);\n animation: fadeIn 0.5s ease forwards;\n}\n.ff-expandable-chip-menu .ff-sub-chip--primary {\n background: var(--expandable-menu-option-bg);\n color: var(--brand-color);\n}\n.ff-expandable-chip-menu .ff-sub-chip--primary:hover, .ff-expandable-chip-menu .ff-sub-chip--primary.selected {\n background-color: var(--brand-color);\n color: var(--expandable-menu-default-bg);\n}\n.ff-expandable-chip-menu .ff-sub-chip--medium {\n line-height: 18px;\n}\n@keyframes fadeIn {\n 0% {\n opacity: 0;\n transform: translateX(-10px);\n }\n 100% {\n opacity: 1;\n transform: translateX(0);\n }\n}\n.ff-expandable-chip-menu.expanded .ff-sub-chip {\n animation: fadeIn 0.5s ease forwards;\n}";
|
2735
|
+
styleInject(css_248z$13);
|
2736
2736
|
|
2737
2737
|
const ExpandableMenu = ({
|
2738
2738
|
label = '',
|
@@ -2799,8 +2799,8 @@ const ExpandableMenu = ({
|
|
2799
2799
|
});
|
2800
2800
|
};
|
2801
2801
|
|
2802
|
-
var css_248z$
|
2803
|
-
styleInject(css_248z$
|
2802
|
+
var css_248z$12 = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-select-wrapper .ff-select .ff-select-inputField, .ff-select-wrapper .ff-select .ff-select-labels {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-select-wrapper .ff-select__focus .ff-select-labels, .ff-select-wrapper .ff-select__error .ff-select-labels {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-select-wrapper {\n min-height: 24px;\n min-width: 50px;\n}\n.ff-select-wrapper .ff-select {\n height: 100%;\n border: 1px solid var(--ff-select-border-color);\n border-radius: 4px;\n display: flex;\n align-items: center;\n justify-content: space-evenly;\n position: relative;\n box-sizing: border-box;\n}\n.ff-select-wrapper .ff-select:hover {\n border-color: var(--ff-select-brand-color);\n}\n.ff-select-wrapper .ff-select:hover .ff-select-labels {\n color: var(--ff-select-default-color);\n}\n.ff-select-wrapper .ff-select:hover .ff-select-arrows-wrapper .ff-select-arrows svg path {\n fill: var(--ff-select-text-hover-color);\n transition: all 0.18s ease;\n}\n.ff-select-wrapper .ff-select .ff-select-input-icon {\n margin-left: 6px;\n}\n.ff-select-wrapper .ff-select .ff-select-inputField {\n width: calc(100% - 8px);\n height: 100%;\n padding: 0 0 0 8px;\n border: none;\n outline: none;\n letter-spacing: 0.5px;\n z-index: 10;\n background: transparent;\n}\n.ff-select-wrapper .ff-select .ff-select-inputField__disabled {\n cursor: not-allowed;\n color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select .ff-select-inputField__readonly {\n cursor: pointer;\n}\n.ff-select-wrapper .ff-select .ff-select-inputField__icon {\n width: calc(100% - 36px);\n padding: 4;\n}\n.ff-select-wrapper .ff-select .ff-select-arrows-wrapper {\n cursor: pointer;\n height: 100%;\n padding: 0 8px 0 0;\n display: flex;\n align-items: center;\n}\n.ff-select-wrapper .ff-select .ff-select-arrows-wrapper .ff-select-arrows svg path {\n fill: var(--ff-select-border-color);\n transition: all 0.18s ease;\n}\n.ff-select-wrapper .ff-select .ff-select-arrows-wrapper__disabled {\n cursor: not-allowed;\n border-color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select .ff-select-labels {\n position: absolute;\n left: 8px;\n color: var(--ff-select-border-color);\n letter-spacing: 0.5px;\n line-height: 18px;\n transition: 0.18s ease all;\n border-radius: 4px;\n}\n.ff-select-wrapper .ff-select .ff-select-labels__icon {\n left: 24px;\n}\n.ff-select-wrapper .ff-select .ff-select-labels__active {\n transform: translateY(-16px);\n transition: 0.18s ease all;\n background-color: var(--ff-select-background-color);\n padding: 0 2px;\n z-index: 100000;\n left: 8px;\n}\n.ff-select-wrapper .ff-select__focus {\n border-color: var(--ff-select-brand-color);\n}\n.ff-select-wrapper .ff-select__focus:hover {\n border-color: var(--ff-select-brand-color);\n}\n.ff-select-wrapper .ff-select__focus:hover .ff-select-labels {\n color: var(--ff-select-brand-color);\n}\n.ff-select-wrapper .ff-select__focus:hover .ff-select-arrows-wrapper .ff-select-arrows svg path {\n fill: var(--ff-select-brand-color);\n transition: all 0.18s ease;\n}\n.ff-select-wrapper .ff-select__focus .ff-select-labels {\n transform: translateY(-16px);\n transition: 0.18s ease all;\n color: var(--ff-select-brand-color);\n background-color: var(--ff-select-background-color);\n padding: 0 2px;\n line-height: 18px;\n z-index: 100000;\n left: 8px;\n}\n.ff-select-wrapper .ff-select__focus .ff-select-arrows-wrapper .ff-select-arrows {\n transform: rotate(180deg);\n transition: 0.18s ease all;\n}\n.ff-select-wrapper .ff-select__focus .ff-select-arrows-wrapper .ff-select-arrows svg path {\n fill: var(--ff-select-brand-color);\n transition: all 0.18s ease;\n}\n.ff-select-wrapper .ff-select__disabled {\n cursor: not-allowed;\n}\n.ff-select-wrapper .ff-select__disabled:hover {\n border-color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select__disabled:hover .ff-select-labels {\n color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select__disabled:hover .ff-select-arrows-wrapper .ff-select-arrows svg path {\n fill: var(--ff-select-border-color);\n transition: all 0.18s ease;\n}\n.ff-select-wrapper .ff-select__error {\n border-color: var(--error_light);\n}\n.ff-select-wrapper .ff-select__error:hover {\n border-color: var(--error_light);\n}\n.ff-select-wrapper .ff-select__error:hover .ff-select-labels {\n color: var(--error_light);\n}\n.ff-select-wrapper .ff-select__error:hover .ff-select-arrows-wrapper .ff-select-arrows svg path {\n fill: var(--ff-select-default-color);\n transition: all 0.18s ease;\n}\n.ff-select-wrapper .ff-select__error__focused:hover .ff-select-arrows-wrapper .ff-select-arrows svg path {\n fill: var(--ff-select-brand-color);\n transition: all 0.18s ease;\n}\n.ff-select-wrapper .ff-select__error .ff-select-labels {\n transform: translateY(-16px);\n transition: 0.3s ease all;\n color: var(--error_light);\n background-color: var(--ff-select-background-color);\n padding: 0 2px;\n line-height: 18px;\n left: 8px;\n}\n.ff-select-wrapper .ff-select__no_border {\n border-color: transparent;\n}\n.ff-select-wrapper .ff-select__no_border:hover {\n border-color: transparent;\n}\n.ff-select-wrapper .ff-select-error-msg {\n padding-left: 8px;\n letter-spacing: 0.5px;\n}";
|
2803
|
+
styleInject(css_248z$12);
|
2804
2804
|
|
2805
2805
|
const dropdownDefaultCSSData = {
|
2806
2806
|
margin: 6,
|
@@ -2809,8 +2809,8 @@ const dropdownDefaultCSSData = {
|
|
2809
2809
|
dropDownWrapperPadding: 0
|
2810
2810
|
};
|
2811
2811
|
|
2812
|
-
var css_248z$
|
2813
|
-
styleInject(css_248z$
|
2812
|
+
var css_248z$11 = ".ff-select-dropdown-wrapper {\n max-height: 160px;\n z-index: 999999;\n position: absolute;\n min-width: 50px;\n border-radius: 4px;\n border: 1px solid var(--ff-select-option-border-color);\n margin-top: 4px;\n box-shadow: 0px 1px 4px 0px var(--ff-select-option-wrapper-box-shadow);\n background-color: var(--ff-select-background-color);\n overflow: hidden auto;\n}\n.ff-select-dropdown-wrapper::-webkit-scrollbar {\n width: 4px;\n height: 12px;\n}\n.ff-select-dropdown-wrapper::-webkit-scrollbar-thumb {\n background-color: var(--ff-select-scroll-thumb-color);\n border-radius: 4px;\n}\n.ff-select-dropdown-wrapper::-webkit-scrollbar-track {\n background: var(--ff-select-scroll-track-bg);\n border-radius: 4px;\n}\n.ff-select-dropdown-wrapper .ff-select-dropdown-option {\n box-sizing: border-box;\n cursor: pointer;\n padding: 0px 8px;\n border-radius: 4px;\n min-height: 32px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.ff-select-dropdown-wrapper .ff-select-dropdown-option .ff-select-dropdown-icon-container {\n display: flex;\n align-items: center;\n}\n.ff-select-dropdown-wrapper .ff-select-dropdown-option .ff-select-dropdown-icon-container__icon {\n margin-right: 4px;\n}\n.ff-select-dropdown-wrapper .ff-select-dropdown-option__selected, .ff-select-dropdown-wrapper .ff-select-dropdown-option:hover {\n background-color: var(--ff-select-option-hover-color);\n}\n.ff-select-dropdown-wrapper .ff-select-no-option {\n box-sizing: border-box;\n padding: 0px 8px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n cursor: not-allowed;\n}";
|
2813
|
+
styleInject(css_248z$11);
|
2814
2814
|
|
2815
2815
|
const ffid = () => 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, char => ((char === 'x' ? Math.random() * 16 : Math.random() * 16 & 0x3 | 0x8) | 0).toString(16));
|
2816
2816
|
|
@@ -3213,8 +3213,8 @@ const Select$1 = ({
|
|
3213
3213
|
});
|
3214
3214
|
};
|
3215
3215
|
|
3216
|
-
var css_248z
|
3217
|
-
styleInject(css_248z
|
3216
|
+
var css_248z$10 = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-textarea-container {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-textarea-container .msg-character-count, .ff-textarea-container:focus-within .ff-textarea-label-container, .ff-textarea-container:focus-within .ff-textarea::placeholder, .ff-textarea-container:focus-within .ff-textarea-label-container::placeholder, .ff-textarea-container .ff-textarea-message, .ff-textarea-container--float .ff-textarea-label-container {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-textarea-container {\n display: flex;\n flex-direction: column;\n position: relative;\n gap: 5px;\n}\n.ff-textarea-container .msg-character-count {\n display: flex;\n color: var(--text-area-default-color);\n justify-content: flex-end;\n}\n.ff-textarea-container .ff-textarea, .ff-textarea-container .ff-textarea-label-container {\n padding: 8px;\n gap: 0px;\n border: 1px solid var(--default-icon-color);\n border-radius: 4px;\n outline: none;\n line-height: 18px;\n font-weight: 400;\n overflow: auto;\n -ms-overflow-style: none;\n scrollbar-width: none;\n}\n.ff-textarea-container .ff-textarea ::-webkit-scrollbar, .ff-textarea-container .ff-textarea-label-container ::-webkit-scrollbar {\n display: none;\n}\n.ff-textarea-container .ff-textarea--resize {\n resize: none;\n}\n.ff-textarea-container .ff-textarea:disabled, .ff-textarea-container .ff-textarea-label-container:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.ff-textarea-container .ff-textarea:disabled:hover, .ff-textarea-container .ff-textarea-label-container:disabled:hover {\n border-color: var(--default-icon-color);\n color: inherit;\n}\n.ff-textarea-container .ff-textarea::placeholder, .ff-textarea-container .ff-textarea-label-container::placeholder {\n opacity: 0;\n}\n.ff-textarea-container .ff-textarea--danger {\n border-color: var(--ff-error-light);\n}\n.ff-textarea-container .ff-textarea--transparentBackground {\n background: transparent;\n}\n.ff-textarea-container .ff-textarea-label-container {\n display: flex;\n position: absolute;\n border: none;\n outline: none;\n margin-top: 1px;\n transition: all 0.3s ease-in-out;\n}\n.ff-textarea-container .ff-textarea-label-container .ff-textarea-label {\n padding: 1px;\n height: 10px;\n width: auto;\n background-color: var(--drawer-footer-bg);\n color: var(--text-area-default-color);\n}\n.ff-textarea-container .ff-textarea-label-container .ff-textarea-label--danger {\n color: var(--ff-error-light);\n}\n.ff-textarea-container .ff-textarea-label-container .required-asterisk {\n color: var(--ff-error-light);\n}\n.ff-textarea-container:hover .ff-textarea-label {\n color: var(--text-color);\n}\n.ff-textarea-container:hover .ff-textarea, .ff-textarea-container:hover .ff-textarea-label-container {\n border-color: var(--text-color);\n}\n.ff-textarea-container:focus-within .ff-textarea-label-container {\n font-weight: 400;\n line-height: 12px;\n letter-spacing: 0.5px;\n text-align: left;\n top: -6px;\n background-color: transparent;\n padding: 0px 2px;\n margin-left: 7px;\n}\n.ff-textarea-container:focus-within .ff-textarea-label--primary {\n color: var(--brand-color);\n}\n.ff-textarea-container:focus-within .ff-textarea--primary {\n border-color: var(--brand-color);\n}\n.ff-textarea-container:focus-within .ff-textarea::placeholder, .ff-textarea-container:focus-within .ff-textarea-label-container::placeholder {\n opacity: 1;\n margin-bottom: 1px;\n}\n.ff-textarea-container .ff-textarea-message {\n padding: 0px 4px;\n margin-left: 8px;\n line-height: 12px;\n}\n.ff-textarea-container .ff-textarea-message--danger {\n color: var(--ff-error-light);\n}\n.ff-textarea-container--float .ff-textarea-label-container {\n letter-spacing: 0.5px;\n top: -6px;\n background-color: transparent;\n line-height: 12px;\n padding: 0px 2px;\n margin-left: 7px;\n}\n.ff-textarea-container--disabled {\n cursor: not-allowed;\n}\n.ff-textarea-container--disabled:hover .ff-textarea-label {\n color: var(--text-area-default-color);\n}\n.ff-textarea-container--disabled:hover .ff-textarea, .ff-textarea-container--disabled:hover .ff-textarea-container .ff-textarea-label-container, .ff-textarea-container .ff-textarea-container--disabled:hover .ff-textarea-label-container {\n border-color: var(--default-icon-color);\n}\n.ff-textarea-container--disabled .ff-textarea-label-container {\n cursor: not-allowed;\n}";
|
3217
|
+
styleInject(css_248z$10);
|
3218
3218
|
|
3219
3219
|
const Textarea = ({
|
3220
3220
|
capacity = 200,
|
@@ -3286,8 +3286,8 @@ const Textarea = ({
|
|
3286
3286
|
});
|
3287
3287
|
};
|
3288
3288
|
|
3289
|
-
var css_248z
|
3290
|
-
styleInject(css_248z
|
3289
|
+
var css_248z$$ = ".ff-status-button {\n border: none;\n border-radius: 4px;\n padding: 0 4px;\n cursor: pointer;\n width: 80px;\n height: 16px;\n}\n.ff-status-button__text {\n color: inherit;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 76px;\n text-transform: capitalize;\n}\n.ff-status-button--passed {\n background-color: var(--status-button-bg-passed);\n color: var(--status-button-text-passed);\n}\n.ff-status-button--failed {\n background-color: var(--status-button-bg-failed);\n color: var(--status-button-text-failed);\n}\n.ff-status-button--running {\n background-color: var(--status-button-bg-running);\n color: var(--status-button-text-running);\n}\n.ff-status-button--skipped {\n background-color: var(--status-button-bg-skipped);\n color: var(--status-button-text-skipped);\n}\n.ff-status-button--warning {\n background-color: var(--status-button-bg-warning);\n color: var(--status-button-text-warning);\n}\n.ff-status-button--terminated {\n background-color: var(--status-button-bg-terminated);\n color: var(--status-button-text-terminated);\n}\n.ff-status-button--partially-executed {\n background-color: var(--status-button-bg-partiallyExecuted);\n color: var(--status-button-text-partiallyExecuted);\n}\n.ff-status-button--aborted {\n background-color: var(--status-button-bg-aborted);\n color: var(--status-button-text-aborted);\n}\n.ff-status-button--not-executed {\n background-color: var(--status-button-bg-notExecuted);\n color: var(--status-button-text-notExecuted);\n}\n.ff-status-button:disabled {\n opacity: 50%;\n cursor: not-allowed;\n}";
|
3290
|
+
styleInject(css_248z$$);
|
3291
3291
|
|
3292
3292
|
const StatusButton = ({
|
3293
3293
|
status = 'passed',
|
@@ -3320,8 +3320,8 @@ const StatusButton = ({
|
|
3320
3320
|
});
|
3321
3321
|
};
|
3322
3322
|
|
3323
|
-
var css_248z$
|
3324
|
-
styleInject(css_248z$
|
3323
|
+
var css_248z$_ = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-option-card .ff-options {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-menu-option-container {\n cursor: pointer;\n position: relative;\n}\n.ff-menu-option-container .ff-icon-label {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container {\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container:hover {\n background-color: var(--hover-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container.dark {\n background-color: var(--brand-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container.dark:hover {\n background-color: var(--menu-variant-dark-icon-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container.dark:hover svg path {\n fill: var(--brand-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container-clicked {\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: var(--brand-color);\n cursor: pointer;\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container-clicked:hover {\n background-color: var(--brand-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container-clicked.dark {\n background-color: var(--menu-variant-dark-icon-color);\n}\n\n.ff-option-card {\n position: absolute;\n margin: 4px;\n border: 1px solid var(--option-card-border-color);\n background: var(--option-card-bg-color);\n overflow: hidden;\n min-height: 32px;\n min-width: 110px;\n width: max-content;\n border-radius: 4px;\n}\n.ff-option-card--primary {\n background: var(--brand-color);\n color: var(--primary-button-text-color);\n}\n.ff-option-card--primary svg path {\n fill: var(--primary-icon-color);\n}\n.ff-option-card--primary :hover {\n color: var(--brand-color);\n}\n.ff-option-card--primary :hover svg path {\n fill: var(--brand-color);\n}\n.ff-option-card .ff-options {\n cursor: pointer;\n border-radius: 3px;\n display: flex;\n align-items: center;\n padding: 4px;\n gap: 8px;\n}\n.ff-option-card .ff-options:hover {\n background-color: var(--hover-color);\n}\n.ff-option-card .ff-options label {\n cursor: pointer;\n}\n.ff-option-card .ff-disable-option {\n opacity: 0.5;\n cursor: no-drop;\n}\n.ff-option-card .ff-disable-option label {\n cursor: no-drop;\n}";
|
3324
|
+
styleInject(css_248z$_);
|
3325
3325
|
|
3326
3326
|
const Option$1 = ({
|
3327
3327
|
option,
|
@@ -3507,8 +3507,8 @@ const MenuOption = ({
|
|
3507
3507
|
});
|
3508
3508
|
};
|
3509
3509
|
|
3510
|
-
var css_248z$
|
3511
|
-
styleInject(css_248z$
|
3510
|
+
var css_248z$Z = ".ff-fixed-header-table {\n overflow-y: auto;\n}\n\n.ff-table-icon {\n position: absolute;\n top: 10px;\n right: 0;\n margin-right: 10px;\n z-index: 100;\n cursor: pointer;\n}\n\n.ff-table {\n width: 100%;\n}\n.ff-table th,\n.ff-table td {\n text-align: left;\n font-size: 12px;\n padding: 9px 8px;\n}\n.ff-table thead tr th {\n border-bottom: 1px solid var(--slider-table-color);\n}\n.ff-table thead tr th .ff-label-checkbox-container {\n display: flex;\n align-items: center;\n}\n.ff-table thead tr th .ff-label-checkbox-container .ff-table-checkbox {\n padding-right: 8px;\n}\n.ff-table tbody tr .action-column {\n opacity: 0;\n}\n.ff-table tbody tr .icon-container {\n padding-left: 8px;\n opacity: 0;\n display: flex;\n justify-content: flex-end;\n transition: opacity 0.3s ease, transform 0.3s ease;\n transform: translateX(20px);\n}\n.ff-table tbody tr .ff-data-checkbox-container {\n display: flex;\n align-items: center;\n}\n.ff-table tbody tr .ff-data-checkbox-container .ff-table-checkbox {\n padding-right: 8px;\n}\n.ff-table tbody tr .ff-data-checkbox-container .ff-table-drag {\n opacity: 0;\n transition: opacity 0.3s ease, transform 0.3s ease;\n}\n.ff-table tbody tr .ff-data-checkbox-container .ff-table-drag-icon {\n opacity: 0;\n transition: opacity 0.3s ease, transform 0.3s ease;\n cursor: grab;\n}\n.ff-table tbody tr:hover {\n background-color: var(--hover-color);\n}\n.ff-table tbody tr:hover .icon-container {\n opacity: 1;\n transform: translateX(0);\n}\n.ff-table tbody tr:hover .ff-table-drag,\n.ff-table tbody tr:hover .ff-table-drag-icon {\n opacity: 1;\n}\n.ff-table tbody tr td {\n position: relative;\n color: var(--table-column-text-color);\n}\n.ff-table tbody tr td.clickable-cell {\n cursor: pointer;\n}\n.ff-table .primary-bg {\n background-color: var(--brand-color);\n}\n.ff-table .secondary-bg {\n background-color: var(--slider-table-color);\n}\n.ff-table .tertiary-bg {\n background-color: var(--custom-table-header-bg-color);\n}\n.ff-table .default-bg {\n background-color: transparent;\n}\n.ff-table .default-color {\n color: var(--table-header-text-color);\n}\n.ff-table .primary-color {\n color: var(--brand-color);\n}\n\n.border-borderRadius {\n border: 1px solid var(--slider-table-color);\n border-radius: 5px;\n border-collapse: none !important;\n}\n\n.ff-fixed-header {\n position: sticky !important;\n top: 0;\n z-index: 99;\n background-color: Var(--file-details-bg);\n}\n\n.no-data-content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\ntbody tr.disabled-row {\n opacity: 0.5;\n cursor: not-allowed;\n}";
|
3511
|
+
styleInject(css_248z$Z);
|
3512
3512
|
|
3513
3513
|
const isFunction$2 = functionToCheck => {
|
3514
3514
|
return functionToCheck && {}.toString.call(functionToCheck) === '[object Function]';
|
@@ -3930,6 +3930,8 @@ function LiveRegion(_ref) {
|
|
3930
3930
|
// Hide element visually but keep it readable by screen readers
|
3931
3931
|
const visuallyHidden = {
|
3932
3932
|
position: 'fixed',
|
3933
|
+
top: 0,
|
3934
|
+
left: 0,
|
3933
3935
|
width: 1,
|
3934
3936
|
height: 1,
|
3935
3937
|
margin: -1,
|
@@ -4919,11 +4921,12 @@ var KeyboardCode;
|
|
4919
4921
|
KeyboardCode["Up"] = "ArrowUp";
|
4920
4922
|
KeyboardCode["Esc"] = "Escape";
|
4921
4923
|
KeyboardCode["Enter"] = "Enter";
|
4924
|
+
KeyboardCode["Tab"] = "Tab";
|
4922
4925
|
})(KeyboardCode || (KeyboardCode = {}));
|
4923
4926
|
const defaultKeyboardCodes = {
|
4924
4927
|
start: [KeyboardCode.Space, KeyboardCode.Enter],
|
4925
4928
|
cancel: [KeyboardCode.Esc],
|
4926
|
-
end: [KeyboardCode.Space, KeyboardCode.Enter]
|
4929
|
+
end: [KeyboardCode.Space, KeyboardCode.Enter, KeyboardCode.Tab]
|
4927
4930
|
};
|
4928
4931
|
const defaultKeyboardCoordinateGetter = (event, _ref) => {
|
4929
4932
|
let {
|
@@ -5222,6 +5225,9 @@ class AbstractPointerSensor {
|
|
5222
5225
|
passive: false
|
5223
5226
|
});
|
5224
5227
|
this.listeners.add(events.end.name, this.handleEnd);
|
5228
|
+
if (events.cancel) {
|
5229
|
+
this.listeners.add(events.cancel.name, this.handleCancel);
|
5230
|
+
}
|
5225
5231
|
this.windowListeners.add(EventName.Resize, this.handleCancel);
|
5226
5232
|
this.windowListeners.add(EventName.DragStart, preventDefault);
|
5227
5233
|
this.windowListeners.add(EventName.VisibilityChange, this.handleCancel);
|
@@ -5237,9 +5243,11 @@ class AbstractPointerSensor {
|
|
5237
5243
|
}
|
5238
5244
|
if (isDelayConstraint(activationConstraint)) {
|
5239
5245
|
this.timeoutId = setTimeout(this.handleStart, activationConstraint.delay);
|
5246
|
+
this.handlePending(activationConstraint);
|
5240
5247
|
return;
|
5241
5248
|
}
|
5242
5249
|
if (isDistanceConstraint(activationConstraint)) {
|
5250
|
+
this.handlePending(activationConstraint);
|
5243
5251
|
return;
|
5244
5252
|
}
|
5245
5253
|
}
|
@@ -5256,6 +5264,13 @@ class AbstractPointerSensor {
|
|
5256
5264
|
this.timeoutId = null;
|
5257
5265
|
}
|
5258
5266
|
}
|
5267
|
+
handlePending(constraint, offset) {
|
5268
|
+
const {
|
5269
|
+
active,
|
5270
|
+
onPending
|
5271
|
+
} = this.props;
|
5272
|
+
onPending(active, constraint, this.initialCoordinates, offset);
|
5273
|
+
}
|
5259
5274
|
handleStart() {
|
5260
5275
|
const {
|
5261
5276
|
initialCoordinates
|
@@ -5309,6 +5324,7 @@ class AbstractPointerSensor {
|
|
5309
5324
|
return this.handleCancel();
|
5310
5325
|
}
|
5311
5326
|
}
|
5327
|
+
this.handlePending(activationConstraint, delta);
|
5312
5328
|
return;
|
5313
5329
|
}
|
5314
5330
|
if (event.cancelable) {
|
@@ -5318,16 +5334,24 @@ class AbstractPointerSensor {
|
|
5318
5334
|
}
|
5319
5335
|
handleEnd() {
|
5320
5336
|
const {
|
5337
|
+
onAbort,
|
5321
5338
|
onEnd
|
5322
5339
|
} = this.props;
|
5323
5340
|
this.detach();
|
5341
|
+
if (!this.activated) {
|
5342
|
+
onAbort(this.props.active);
|
5343
|
+
}
|
5324
5344
|
onEnd();
|
5325
5345
|
}
|
5326
5346
|
handleCancel() {
|
5327
5347
|
const {
|
5348
|
+
onAbort,
|
5328
5349
|
onCancel
|
5329
5350
|
} = this.props;
|
5330
5351
|
this.detach();
|
5352
|
+
if (!this.activated) {
|
5353
|
+
onAbort(this.props.active);
|
5354
|
+
}
|
5331
5355
|
onCancel();
|
5332
5356
|
}
|
5333
5357
|
handleKeydown(event) {
|
@@ -5341,6 +5365,9 @@ class AbstractPointerSensor {
|
|
5341
5365
|
}
|
5342
5366
|
}
|
5343
5367
|
const events = {
|
5368
|
+
cancel: {
|
5369
|
+
name: 'pointercancel'
|
5370
|
+
},
|
5344
5371
|
move: {
|
5345
5372
|
name: 'pointermove'
|
5346
5373
|
},
|
@@ -5413,6 +5440,9 @@ MouseSensor.activators = [{
|
|
5413
5440
|
}
|
5414
5441
|
}];
|
5415
5442
|
const events$2 = {
|
5443
|
+
cancel: {
|
5444
|
+
name: 'touchcancel'
|
5445
|
+
},
|
5416
5446
|
move: {
|
5417
5447
|
name: 'touchmove'
|
5418
5448
|
},
|
@@ -5614,11 +5644,11 @@ function useScrollIntent(_ref2) {
|
|
5614
5644
|
}, [disabled, delta, previousDelta]);
|
5615
5645
|
}
|
5616
5646
|
function useCachedNode(draggableNodes, id) {
|
5617
|
-
const draggableNode = id
|
5647
|
+
const draggableNode = id != null ? draggableNodes.get(id) : undefined;
|
5618
5648
|
const node = draggableNode ? draggableNode.node.current : null;
|
5619
5649
|
return useLazyMemo(cachedNode => {
|
5620
5650
|
var _ref;
|
5621
|
-
if (id
|
5651
|
+
if (id == null) {
|
5622
5652
|
return null;
|
5623
5653
|
} // In some cases, the draggable node can unmount while dragging
|
5624
5654
|
// This is the case for virtualized lists. In those situations,
|
@@ -5826,7 +5856,26 @@ function useRect(element, measure, fallbackRect) {
|
|
5826
5856
|
if (measure === void 0) {
|
5827
5857
|
measure = defaultMeasure;
|
5828
5858
|
}
|
5829
|
-
const [rect,
|
5859
|
+
const [rect, setRect] = useState(null);
|
5860
|
+
function measureRect() {
|
5861
|
+
setRect(currentRect => {
|
5862
|
+
if (!element) {
|
5863
|
+
return null;
|
5864
|
+
}
|
5865
|
+
if (element.isConnected === false) {
|
5866
|
+
var _ref;
|
5867
|
+
|
5868
|
+
// Fall back to last rect we measured if the element is
|
5869
|
+
// no longer connected to the DOM.
|
5870
|
+
return (_ref = currentRect != null ? currentRect : fallbackRect) != null ? _ref : null;
|
5871
|
+
}
|
5872
|
+
const newRect = measure(element);
|
5873
|
+
if (JSON.stringify(currentRect) === JSON.stringify(newRect)) {
|
5874
|
+
return currentRect;
|
5875
|
+
}
|
5876
|
+
return newRect;
|
5877
|
+
});
|
5878
|
+
}
|
5830
5879
|
const mutationObserver = useMutationObserver({
|
5831
5880
|
callback(records) {
|
5832
5881
|
if (!element) {
|
@@ -5861,23 +5910,6 @@ function useRect(element, measure, fallbackRect) {
|
|
5861
5910
|
}
|
5862
5911
|
}, [element]);
|
5863
5912
|
return rect;
|
5864
|
-
function reducer(currentRect) {
|
5865
|
-
if (!element) {
|
5866
|
-
return null;
|
5867
|
-
}
|
5868
|
-
if (element.isConnected === false) {
|
5869
|
-
var _ref;
|
5870
|
-
|
5871
|
-
// Fall back to last rect we measured if the element is
|
5872
|
-
// no longer connected to the DOM.
|
5873
|
-
return (_ref = currentRect != null ? currentRect : fallbackRect) != null ? _ref : null;
|
5874
|
-
}
|
5875
|
-
const newRect = measure(element);
|
5876
|
-
if (JSON.stringify(currentRect) === JSON.stringify(newRect)) {
|
5877
|
-
return currentRect;
|
5878
|
-
}
|
5879
|
-
return newRect;
|
5880
|
-
}
|
5881
5913
|
}
|
5882
5914
|
function useRectDelta(rect) {
|
5883
5915
|
const initialRect = useInitialValue(rect);
|
@@ -6023,28 +6055,24 @@ function useRects(elements, measure) {
|
|
6023
6055
|
}
|
6024
6056
|
const [firstElement] = elements;
|
6025
6057
|
const windowRect = useWindowRect(firstElement ? getWindow(firstElement) : null);
|
6026
|
-
const [rects,
|
6058
|
+
const [rects, setRects] = useState(defaultValue$2);
|
6059
|
+
function measureRects() {
|
6060
|
+
setRects(() => {
|
6061
|
+
if (!elements.length) {
|
6062
|
+
return defaultValue$2;
|
6063
|
+
}
|
6064
|
+
return elements.map(element => isDocumentScrollingElement(element) ? windowRect : new Rect(measure(element), element));
|
6065
|
+
});
|
6066
|
+
}
|
6027
6067
|
const resizeObserver = useResizeObserver({
|
6028
6068
|
callback: measureRects
|
6029
6069
|
});
|
6030
|
-
if (elements.length > 0 && rects === defaultValue$2) {
|
6031
|
-
measureRects();
|
6032
|
-
}
|
6033
6070
|
useIsomorphicLayoutEffect$1(() => {
|
6034
|
-
|
6035
|
-
|
6036
|
-
|
6037
|
-
resizeObserver == null ? void 0 : resizeObserver.disconnect();
|
6038
|
-
measureRects();
|
6039
|
-
}
|
6071
|
+
resizeObserver == null ? void 0 : resizeObserver.disconnect();
|
6072
|
+
measureRects();
|
6073
|
+
elements.forEach(element => resizeObserver == null ? void 0 : resizeObserver.observe(element));
|
6040
6074
|
}, [elements]);
|
6041
6075
|
return rects;
|
6042
|
-
function reducer() {
|
6043
|
-
if (!elements.length) {
|
6044
|
-
return defaultValue$2;
|
6045
|
-
}
|
6046
|
-
return elements.map(element => isDocumentScrollingElement(element) ? windowRect : new Rect(measure(element), element));
|
6047
|
-
}
|
6048
6076
|
}
|
6049
6077
|
function getMeasurableNode(node) {
|
6050
6078
|
if (!node) {
|
@@ -6211,7 +6239,7 @@ function reducer$1(state, action) {
|
|
6211
6239
|
}
|
6212
6240
|
};
|
6213
6241
|
case Action.DragMove:
|
6214
|
-
if (
|
6242
|
+
if (state.draggable.active == null) {
|
6215
6243
|
return state;
|
6216
6244
|
}
|
6217
6245
|
return {
|
@@ -6483,7 +6511,7 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
6483
6511
|
containers: droppableContainers
|
6484
6512
|
}
|
6485
6513
|
} = state;
|
6486
|
-
const node = activeId ? draggableNodes.get(activeId) : null;
|
6514
|
+
const node = activeId != null ? draggableNodes.get(activeId) : null;
|
6487
6515
|
const activeRects = useRef({
|
6488
6516
|
initial: null,
|
6489
6517
|
translated: null
|
@@ -6518,7 +6546,7 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
6518
6546
|
const autoScrollOptions = getAutoScrollerOptions();
|
6519
6547
|
const initialActiveNodeRect = useInitialRect(activeNode, measuringConfiguration.draggable.measure);
|
6520
6548
|
useLayoutShiftScrollCompensation({
|
6521
|
-
activeNode: activeId ? draggableNodes.get(activeId) : null,
|
6549
|
+
activeNode: activeId != null ? draggableNodes.get(activeId) : null,
|
6522
6550
|
config: autoScrollOptions.layoutShiftCompensation,
|
6523
6551
|
initialRect: initialActiveNodeRect,
|
6524
6552
|
measure: measuringConfiguration.draggable.measure
|
@@ -6596,6 +6624,7 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
6596
6624
|
|
6597
6625
|
const appliedTranslate = usesDragOverlay ? modifiedTranslate : add(modifiedTranslate, activeNodeScrollDelta);
|
6598
6626
|
const transform = adjustScale(appliedTranslate, (_over$rect = over == null ? void 0 : over.rect) != null ? _over$rect : null, activeNodeRect);
|
6627
|
+
const activeSensorRef = useRef(null);
|
6599
6628
|
const instantiateSensor = useCallback((event, _ref2) => {
|
6600
6629
|
let {
|
6601
6630
|
sensor: Sensor,
|
@@ -6617,6 +6646,43 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
6617
6646
|
// Sensors need to be instantiated with refs for arguments that change over time
|
6618
6647
|
// otherwise they are frozen in time with the stale arguments
|
6619
6648
|
context: sensorContext,
|
6649
|
+
onAbort(id) {
|
6650
|
+
const draggableNode = draggableNodes.get(id);
|
6651
|
+
if (!draggableNode) {
|
6652
|
+
return;
|
6653
|
+
}
|
6654
|
+
const {
|
6655
|
+
onDragAbort
|
6656
|
+
} = latestProps.current;
|
6657
|
+
const event = {
|
6658
|
+
id
|
6659
|
+
};
|
6660
|
+
onDragAbort == null ? void 0 : onDragAbort(event);
|
6661
|
+
dispatchMonitorEvent({
|
6662
|
+
type: 'onDragAbort',
|
6663
|
+
event
|
6664
|
+
});
|
6665
|
+
},
|
6666
|
+
onPending(id, constraint, initialCoordinates, offset) {
|
6667
|
+
const draggableNode = draggableNodes.get(id);
|
6668
|
+
if (!draggableNode) {
|
6669
|
+
return;
|
6670
|
+
}
|
6671
|
+
const {
|
6672
|
+
onDragPending
|
6673
|
+
} = latestProps.current;
|
6674
|
+
const event = {
|
6675
|
+
id,
|
6676
|
+
constraint,
|
6677
|
+
initialCoordinates,
|
6678
|
+
offset
|
6679
|
+
};
|
6680
|
+
onDragPending == null ? void 0 : onDragPending(event);
|
6681
|
+
dispatchMonitorEvent({
|
6682
|
+
type: 'onDragPending',
|
6683
|
+
event
|
6684
|
+
});
|
6685
|
+
},
|
6620
6686
|
onStart(initialCoordinates) {
|
6621
6687
|
const id = activeRef.current;
|
6622
6688
|
if (id == null) {
|
@@ -6630,6 +6696,7 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
6630
6696
|
onDragStart
|
6631
6697
|
} = latestProps.current;
|
6632
6698
|
const event = {
|
6699
|
+
activatorEvent,
|
6633
6700
|
active: {
|
6634
6701
|
id,
|
6635
6702
|
data: draggableNode.data,
|
@@ -6648,6 +6715,8 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
6648
6715
|
type: 'onDragStart',
|
6649
6716
|
event
|
6650
6717
|
});
|
6718
|
+
setActiveSensor(activeSensorRef.current);
|
6719
|
+
setActivatorEvent(activatorEvent);
|
6651
6720
|
});
|
6652
6721
|
},
|
6653
6722
|
onMove(coordinates) {
|
@@ -6659,10 +6728,7 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
6659
6728
|
onEnd: createHandler(Action.DragEnd),
|
6660
6729
|
onCancel: createHandler(Action.DragCancel)
|
6661
6730
|
});
|
6662
|
-
|
6663
|
-
setActiveSensor(sensorInstance);
|
6664
|
-
setActivatorEvent(event.nativeEvent);
|
6665
|
-
});
|
6731
|
+
activeSensorRef.current = sensorInstance;
|
6666
6732
|
function createHandler(type) {
|
6667
6733
|
return async function handler() {
|
6668
6734
|
const {
|
@@ -6699,6 +6765,7 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
6699
6765
|
setOver(null);
|
6700
6766
|
setActiveSensor(null);
|
6701
6767
|
setActivatorEvent(null);
|
6768
|
+
activeSensorRef.current = null;
|
6702
6769
|
const eventName = type === Action.DragEnd ? 'onDragEnd' : 'onDragCancel';
|
6703
6770
|
if (event) {
|
6704
6771
|
const handler = latestProps.current[eventName];
|
@@ -6920,7 +6987,7 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
6920
6987
|
});
|
6921
6988
|
const NullContext = /*#__PURE__*/createContext$1(null);
|
6922
6989
|
const defaultRole = 'button';
|
6923
|
-
const ID_PREFIX$1 = '
|
6990
|
+
const ID_PREFIX$1 = 'Draggable';
|
6924
6991
|
function useDraggable(_ref) {
|
6925
6992
|
let {
|
6926
6993
|
id,
|
@@ -7067,7 +7134,7 @@ function useDroppable(_ref) {
|
|
7067
7134
|
resizeObserverConnected.current = false;
|
7068
7135
|
resizeObserver.observe(nodeRef.current);
|
7069
7136
|
}, [nodeRef, resizeObserver]);
|
7070
|
-
|
7137
|
+
useEffect(() => {
|
7071
7138
|
dispatch({
|
7072
7139
|
type: Action.RegisterDroppable,
|
7073
7140
|
element: {
|
@@ -7482,6 +7549,7 @@ var DNDCore = /*#__PURE__*/Object.freeze({
|
|
7482
7549
|
defaultCoordinates: defaultCoordinates,
|
7483
7550
|
defaultDropAnimation: defaultDropAnimationConfiguration,
|
7484
7551
|
defaultDropAnimationSideEffects: defaultDropAnimationSideEffects,
|
7552
|
+
defaultKeyboardCoordinateGetter: defaultKeyboardCoordinateGetter,
|
7485
7553
|
defaultScreenReaderInstructions: defaultScreenReaderInstructions,
|
7486
7554
|
getClientRect: getClientRect,
|
7487
7555
|
getFirstCollision: getFirstCollision,
|
@@ -8394,11 +8462,11 @@ const Table$1 = ({
|
|
8394
8462
|
});
|
8395
8463
|
};
|
8396
8464
|
|
8397
|
-
var css_248z$
|
8398
|
-
styleInject(css_248z$
|
8465
|
+
var css_248z$Y = ".ff-add-button-container {\n position: relative;\n border: none;\n width: 24px;\n height: 24px;\n border-radius: 4px;\n background-color: transparent;\n}\n.ff-add-button-container.ff-hovered-add-button--primary {\n background-color: var(--hover-color);\n}\n.ff-add-button-container .ff-hovered-add-icon--primary svg path {\n fill: var(--add-icon-hover-color);\n}\n.ff-add-button-container .ff-add-icon--primary svg path {\n fill: var(--brand-color);\n}\n.ff-add-button-container .ff-add-button {\n position: absolute;\n border: none;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 4px;\n background: none;\n}";
|
8466
|
+
styleInject(css_248z$Y);
|
8399
8467
|
|
8400
|
-
var css_248z$
|
8401
|
-
styleInject(css_248z$
|
8468
|
+
var css_248z$X = ".ff-arrow-buttons-container {\n position: absolute;\n transition: opacity 0.3s ease;\n pointer-events: none;\n}\n.ff-arrow-buttons-container.ff-down-right-top, .ff-arrow-buttons-container.ff-down-top {\n height: 80px;\n width: 52px;\n transform: translateY(calc(-50% + 12px));\n}\n.ff-arrow-buttons-container.ff-down-right-top .ff-arrow-button--right, .ff-arrow-buttons-container.ff-down-top .ff-arrow-button--right {\n top: 28px;\n right: 2px;\n animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right-top .ff-arrow-button--top, .ff-arrow-buttons-container.ff-down-top .ff-arrow-button--top {\n top: 2px;\n animation: slideTop 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right-top .ff-arrow-button--down, .ff-arrow-buttons-container.ff-down-top .ff-arrow-button--down {\n bottom: 2px;\n animation: slideDown 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-right-top {\n height: 52px;\n width: 52px;\n transform: translateY(-54%);\n}\n.ff-arrow-buttons-container.ff-right-top .ff-arrow-button--right {\n top: 28px;\n right: 2px;\n animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-right-top .ff-arrow-button--top {\n top: 2px;\n animation: slideTop 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right {\n height: 52px;\n width: 52px;\n}\n.ff-arrow-buttons-container.ff-down-right .ff-arrow-button--right {\n top: 0px;\n right: 2px;\n animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right .ff-arrow-button--down {\n bottom: 2px;\n animation: slideDown 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-top {\n height: 52px;\n width: 24px;\n transform: translateY(-54%);\n}\n.ff-arrow-buttons-container.ff-top .ff-arrow-button--top {\n top: 2px;\n animation: slideTop 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-right {\n height: 24px;\n width: 52px;\n}\n.ff-arrow-buttons-container.ff-right .ff-arrow-button--right {\n right: 2px;\n animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down {\n height: 52px;\n width: 24px;\n}\n.ff-arrow-buttons-container.ff-down .ff-arrow-button--down {\n bottom: 2px;\n animation: slideDown 0.4s ease-out;\n}\n.ff-arrow-buttons-container .ff-arrow-button {\n background: var(--arrow-button-bg-color);\n border: 0.5px solid var(--arrows-button-border-color);\n padding: 0;\n cursor: pointer;\n width: 24px;\n height: 24px;\n display: flex;\n border-radius: 4px;\n justify-content: center;\n align-items: center;\n transition: all 0.3s ease;\n position: absolute;\n}\n.ff-arrow-buttons-container .ff-arrow-button--top {\n top: 0px;\n left: 0;\n}\n.ff-arrow-buttons-container .ff-arrow-button--down {\n bottom: 0px;\n left: 0;\n}\n@keyframes slideTop {\n from {\n transform: translateY(20px);\n opacity: 0;\n }\n 50% {\n transform: translateY(-10px);\n opacity: 0.5;\n }\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}\n@keyframes slideRight {\n from {\n transform: translateX(-20px);\n opacity: 0;\n }\n 50% {\n transform: translateX(10px);\n opacity: 0.5;\n }\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n@keyframes slideDown {\n from {\n transform: translateY(-20px);\n opacity: 0;\n }\n 50% {\n transform: translateY(10px);\n opacity: 0.5;\n }\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}";
|
8469
|
+
styleInject(css_248z$X);
|
8402
8470
|
|
8403
8471
|
const ArrowsButton = ({
|
8404
8472
|
direction,
|
@@ -8535,8 +8603,8 @@ const AddButton = ({
|
|
8535
8603
|
});
|
8536
8604
|
};
|
8537
8605
|
|
8538
|
-
var css_248z$
|
8539
|
-
styleInject(css_248z$
|
8606
|
+
var css_248z$W = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-donut-chart-svg-container svg text:nth-of-type(1), .ff-status-item {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL, .ff-donut-chart-svg-container svg text:nth-of-type(2) {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-donut-chart-svg-container svg text:nth-of-type(3) {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-donut-chart-section {\n display: flex;\n align-items: center;\n padding: 8px;\n}\n\n.ff-donut-chart-svg-container {\n display: flex;\n}\n.ff-donut-chart-svg-container svg text:nth-of-type(1) {\n font-weight: 600;\n}\n.ff-donut-chart-svg-container svg text:nth-of-type(2) {\n font-weight: 600;\n}\n.ff-donut-chart-svg-container svg text:nth-of-type(3) {\n font-weight: 500;\n}\n\n.ff-status-container {\n display: flex;\n flex-direction: column;\n gap: 20px;\n}\n\n.ff-status-item {\n display: flex;\n gap: 40px;\n justify-content: space-between;\n opacity: 1;\n}\n.ff-status-item.ff-highlighted {\n opacity: 1;\n}\n.ff-status-item.ff-fade {\n opacity: 10%;\n}\n.ff-status-item .ff-status-text {\n font-weight: 500;\n color: var(--status-skipped-text-color);\n}\n.ff-status-item .ff-status-details-script-count {\n display: flex;\n gap: 4px;\n font-weight: 600;\n}\n.ff-status-item .ff-status-details-script-percentage {\n font-weight: 400;\n color: var(--brand2-color);\n}\n\n.ff-status-label {\n display: flex;\n gap: 8px;\n align-items: center;\n}\n\n.ff-status-details {\n display: flex;\n gap: 4px;\n}\n\n.ff-status-color {\n width: 16px;\n height: 16px;\n border-radius: 4px;\n opacity: 80%;\n}";
|
8607
|
+
styleInject(css_248z$W);
|
8540
8608
|
|
8541
8609
|
const calculateArc$4 = (x, y, radius, startAngle, endAngle) => {
|
8542
8610
|
const startX = x + radius * Math.cos(startAngle);
|
@@ -8892,11 +8960,11 @@ const useFileDropzone = options => {
|
|
8892
8960
|
};
|
8893
8961
|
};
|
8894
8962
|
|
8895
|
-
var css_248z$
|
8896
|
-
styleInject(css_248z$
|
8963
|
+
var css_248z$V = ".ff-file-dropzone-wrapper {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone {\n padding: 16px 0;\n border-radius: 8px;\n background: var(--file-dropzone-default-color);\n border: 1px dashed var(--brand-color);\n display: flex;\n align-items: center;\n flex-direction: column;\n text-align: center;\n gap: 8px;\n transition: background-color 0.2s ease;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone .ff-radio-group-wrapper {\n position: relative;\n bottom: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone:hover, .ff-file-dropzone-wrapper .ff-file-dropzone--active {\n background-color: var(--file-dropzone-selected-color);\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone--webservice-file {\n display: grid;\n place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone--webservice-container {\n display: grid;\n place-items: center;\n padding: 16px 0 40px 0;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__icon {\n height: 80px;\n width: 80px;\n display: grid;\n place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn {\n margin: 0 auto;\n position: relative;\n font-weight: 600;\n line-height: 15px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__webservice-file {\n padding: 4px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper {\n display: flex;\n flex-direction: column;\n gap: 10px;\n max-height: 300px;\n overflow-y: auto;\n scroll-behavior: smooth;\n padding: 2px;\n -ms-overflow-style: none;\n scrollbar-width: thin;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper ::-webkit-scrollbar {\n width: 2px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 4px;\n border-radius: 4px;\n background-color: var(--file-details-bg);\n box-shadow: 0px 0px 4px 0px var(--file-details-container-shadow);\n overflow: hidden;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info {\n display: flex;\n align-items: center;\n gap: 4px;\n width: 87%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info .ff-file-info__icon {\n display: grid;\n place-items: center;\n height: 24px;\n width: 24px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper {\n display: flex;\n flex-direction: column;\n gap: 2px;\n justify-content: center;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n width: 100%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper__name {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n display: block;\n color: var(--text-color);\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-replace, .ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-remove {\n height: 24px;\n width: 24px;\n display: grid;\n place-items: center;\n cursor: pointer;\n}\n\n.ff-webservice-file-wrapper {\n display: flex;\n gap: 8px;\n}\n.ff-webservice-file-wrapper .ff-webservice-file-name {\n position: relative;\n bottom: 2px;\n}\n\n.ff-input-ref {\n display: none;\n}\n\n.ff-disable-file-dropzone-wrapper {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.footer_basic_button {\n width: 100%;\n position: absolute;\n bottom: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n justify-content: flex-end;\n gap: 16px;\n border-top: 1px solid var(--border-color);\n padding: 4px 8px;\n background-color: var(--primary-icon-color);\n}";
|
8964
|
+
styleInject(css_248z$V);
|
8897
8965
|
|
8898
|
-
var css_248z$
|
8899
|
-
styleInject(css_248z$
|
8966
|
+
var css_248z$U = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-radio-wrapper .ff-radio {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-radio-wrapper {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n.ff-radio-wrapper .ff-radio {\n position: relative;\n color: var(--text-color);\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input {\n display: none;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom {\n box-sizing: content-box;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n border: 1px solid var(--radio-button-border);\n position: relative;\n margin-right: 8px;\n transition: border-color background-color;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom::before {\n content: \"\";\n width: 12px;\n height: 12px;\n border-radius: 50%;\n background: #fbfdff;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n transition: background-color 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom::after {\n content: \"\";\n width: 16px;\n height: 16px;\n border-radius: 50%;\n border: 4px solid #f7edff;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n opacity: 0;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom {\n border: 1px solid var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom::before {\n background-color: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom::after {\n opacity: 1;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked + .ff-radio-custom {\n border-color: var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked + .ff-radio-custom::before {\n background: var(--brand-color);\n height: 12px;\n width: 12px;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom {\n border: 1px solid var(--radio-button-border);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom::before {\n background: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom::after {\n border: 4px solid var(--radio-button-hover);\n opacity: 0;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom {\n border-color: var(--brand-color);\n background-color: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom::before {\n background: var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio--disabled {\n cursor: default;\n}\n.ff-radio-wrapper .ff-radio--disabled .ff-radio-custom {\n opacity: 0.5;\n}";
|
8967
|
+
styleInject(css_248z$U);
|
8900
8968
|
|
8901
8969
|
const RadioButton = ({
|
8902
8970
|
label,
|
@@ -8937,8 +9005,8 @@ const RadioButton = ({
|
|
8937
9005
|
});
|
8938
9006
|
};
|
8939
9007
|
|
8940
|
-
var css_248z$
|
8941
|
-
styleInject(css_248z$
|
9008
|
+
var css_248z$T = ".ff-radio-group {\n display: flex;\n flex-direction: row;\n gap: 12px;\n}\n\n.ff-radio-label-wrapper {\n position: relative;\n top: 2px;\n}\n\n.ff-required-asterisk {\n color: var(--input-error-text-color);\n}";
|
9009
|
+
styleInject(css_248z$T);
|
8942
9010
|
|
8943
9011
|
const RadioGroup = ({
|
8944
9012
|
options,
|
@@ -11262,13 +11330,14 @@ var isWeb = typeof window !== 'undefined' &&
|
|
11262
11330
|
function cloneObject(data) {
|
11263
11331
|
let copy;
|
11264
11332
|
const isArray = Array.isArray(data);
|
11333
|
+
const isFileListInstance = typeof FileList !== 'undefined' ? data instanceof FileList : false;
|
11265
11334
|
if (data instanceof Date) {
|
11266
11335
|
copy = new Date(data);
|
11267
11336
|
}
|
11268
11337
|
else if (data instanceof Set) {
|
11269
11338
|
copy = new Set(data);
|
11270
11339
|
}
|
11271
|
-
else if (!(isWeb && (data instanceof Blob ||
|
11340
|
+
else if (!(isWeb && (data instanceof Blob || isFileListInstance)) &&
|
11272
11341
|
(isArray || isObject$2(data))) {
|
11273
11342
|
copy = isArray ? [] : {};
|
11274
11343
|
if (!isArray && !isPlainObject(data)) {
|
@@ -11327,7 +11396,7 @@ var set$1 = (object, path, value) => {
|
|
11327
11396
|
? []
|
11328
11397
|
: {};
|
11329
11398
|
}
|
11330
|
-
if (key === '__proto__') {
|
11399
|
+
if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
|
11331
11400
|
return;
|
11332
11401
|
}
|
11333
11402
|
object[key] = newValue;
|
@@ -11546,7 +11615,7 @@ function useFormState(props) {
|
|
11546
11615
|
_mounted.current = false;
|
11547
11616
|
};
|
11548
11617
|
}, [control]);
|
11549
|
-
return getProxyFormState(formState, control, _localProxyFormState.current, false);
|
11618
|
+
return React__default.useMemo(() => getProxyFormState(formState, control, _localProxyFormState.current, false), [formState, control]);
|
11550
11619
|
}
|
11551
11620
|
|
11552
11621
|
var isString = (value) => typeof value === 'string';
|
@@ -11642,6 +11711,67 @@ function useController(props) {
|
|
11642
11711
|
value,
|
11643
11712
|
...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}),
|
11644
11713
|
}));
|
11714
|
+
const fieldState = React__default.useMemo(() => Object.defineProperties({}, {
|
11715
|
+
invalid: {
|
11716
|
+
enumerable: true,
|
11717
|
+
get: () => !!get$1(formState.errors, name),
|
11718
|
+
},
|
11719
|
+
isDirty: {
|
11720
|
+
enumerable: true,
|
11721
|
+
get: () => !!get$1(formState.dirtyFields, name),
|
11722
|
+
},
|
11723
|
+
isTouched: {
|
11724
|
+
enumerable: true,
|
11725
|
+
get: () => !!get$1(formState.touchedFields, name),
|
11726
|
+
},
|
11727
|
+
isValidating: {
|
11728
|
+
enumerable: true,
|
11729
|
+
get: () => !!get$1(formState.validatingFields, name),
|
11730
|
+
},
|
11731
|
+
error: {
|
11732
|
+
enumerable: true,
|
11733
|
+
get: () => get$1(formState.errors, name),
|
11734
|
+
},
|
11735
|
+
}), [formState, name]);
|
11736
|
+
const field = React__default.useMemo(() => ({
|
11737
|
+
name,
|
11738
|
+
value,
|
11739
|
+
...(isBoolean(disabled) || formState.disabled
|
11740
|
+
? { disabled: formState.disabled || disabled }
|
11741
|
+
: {}),
|
11742
|
+
onChange: (event) => _registerProps.current.onChange({
|
11743
|
+
target: {
|
11744
|
+
value: getEventValue(event),
|
11745
|
+
name: name,
|
11746
|
+
},
|
11747
|
+
type: EVENTS.CHANGE,
|
11748
|
+
}),
|
11749
|
+
onBlur: () => _registerProps.current.onBlur({
|
11750
|
+
target: {
|
11751
|
+
value: get$1(control._formValues, name),
|
11752
|
+
name: name,
|
11753
|
+
},
|
11754
|
+
type: EVENTS.BLUR,
|
11755
|
+
}),
|
11756
|
+
ref: (elm) => {
|
11757
|
+
const field = get$1(control._fields, name);
|
11758
|
+
if (field && elm) {
|
11759
|
+
field._f.ref = {
|
11760
|
+
focus: () => elm.focus(),
|
11761
|
+
select: () => elm.select(),
|
11762
|
+
setCustomValidity: (message) => elm.setCustomValidity(message),
|
11763
|
+
reportValidity: () => elm.reportValidity(),
|
11764
|
+
};
|
11765
|
+
}
|
11766
|
+
},
|
11767
|
+
}), [
|
11768
|
+
name,
|
11769
|
+
control._formValues,
|
11770
|
+
disabled,
|
11771
|
+
formState.disabled,
|
11772
|
+
value,
|
11773
|
+
control._fields,
|
11774
|
+
]);
|
11645
11775
|
React__default.useEffect(() => {
|
11646
11776
|
const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
|
11647
11777
|
const updateMounted = (name, value) => {
|
@@ -11667,7 +11797,7 @@ function useController(props) {
|
|
11667
11797
|
};
|
11668
11798
|
}, [name, control, isArrayField, shouldUnregister]);
|
11669
11799
|
React__default.useEffect(() => {
|
11670
|
-
if (get$1(control._fields, name)) {
|
11800
|
+
if (isBoolean(disabled) && get$1(control._fields, name)) {
|
11671
11801
|
control._updateDisabledField({
|
11672
11802
|
disabled,
|
11673
11803
|
fields: control._fields,
|
@@ -11676,63 +11806,11 @@ function useController(props) {
|
|
11676
11806
|
});
|
11677
11807
|
}
|
11678
11808
|
}, [disabled, name, control]);
|
11679
|
-
return {
|
11680
|
-
field
|
11681
|
-
name,
|
11682
|
-
value,
|
11683
|
-
...(isBoolean(disabled) || formState.disabled
|
11684
|
-
? { disabled: formState.disabled || disabled }
|
11685
|
-
: {}),
|
11686
|
-
onChange: React__default.useCallback((event) => _registerProps.current.onChange({
|
11687
|
-
target: {
|
11688
|
-
value: getEventValue(event),
|
11689
|
-
name: name,
|
11690
|
-
},
|
11691
|
-
type: EVENTS.CHANGE,
|
11692
|
-
}), [name]),
|
11693
|
-
onBlur: React__default.useCallback(() => _registerProps.current.onBlur({
|
11694
|
-
target: {
|
11695
|
-
value: get$1(control._formValues, name),
|
11696
|
-
name: name,
|
11697
|
-
},
|
11698
|
-
type: EVENTS.BLUR,
|
11699
|
-
}), [name, control]),
|
11700
|
-
ref: React__default.useCallback((elm) => {
|
11701
|
-
const field = get$1(control._fields, name);
|
11702
|
-
if (field && elm) {
|
11703
|
-
field._f.ref = {
|
11704
|
-
focus: () => elm.focus(),
|
11705
|
-
select: () => elm.select(),
|
11706
|
-
setCustomValidity: (message) => elm.setCustomValidity(message),
|
11707
|
-
reportValidity: () => elm.reportValidity(),
|
11708
|
-
};
|
11709
|
-
}
|
11710
|
-
}, [control._fields, name]),
|
11711
|
-
},
|
11809
|
+
return React__default.useMemo(() => ({
|
11810
|
+
field,
|
11712
11811
|
formState,
|
11713
|
-
fieldState
|
11714
|
-
|
11715
|
-
enumerable: true,
|
11716
|
-
get: () => !!get$1(formState.errors, name),
|
11717
|
-
},
|
11718
|
-
isDirty: {
|
11719
|
-
enumerable: true,
|
11720
|
-
get: () => !!get$1(formState.dirtyFields, name),
|
11721
|
-
},
|
11722
|
-
isTouched: {
|
11723
|
-
enumerable: true,
|
11724
|
-
get: () => !!get$1(formState.touchedFields, name),
|
11725
|
-
},
|
11726
|
-
isValidating: {
|
11727
|
-
enumerable: true,
|
11728
|
-
get: () => !!get$1(formState.validatingFields, name),
|
11729
|
-
},
|
11730
|
-
error: {
|
11731
|
-
enumerable: true,
|
11732
|
-
get: () => get$1(formState.errors, name),
|
11733
|
-
},
|
11734
|
-
}),
|
11735
|
-
};
|
11812
|
+
fieldState,
|
11813
|
+
}), [field, formState, fieldState]);
|
11736
11814
|
}
|
11737
11815
|
|
11738
11816
|
/**
|
@@ -11782,7 +11860,7 @@ const Controller = (props) => props.render(useController(props));
|
|
11782
11860
|
const flatten = (obj) => {
|
11783
11861
|
const output = {};
|
11784
11862
|
for (const key of Object.keys(obj)) {
|
11785
|
-
if (isObjectType(obj[key])) {
|
11863
|
+
if (isObjectType(obj[key]) && obj[key] !== null) {
|
11786
11864
|
const nested = flatten(obj[key]);
|
11787
11865
|
for (const nestedKey of Object.keys(nested)) {
|
11788
11866
|
output[`${key}.${nestedKey}`] = nested[nestedKey];
|
@@ -11851,7 +11929,7 @@ function Form(props) {
|
|
11851
11929
|
headers && headers['Content-Type'],
|
11852
11930
|
encType,
|
11853
11931
|
].some((value) => value && value.includes('json'));
|
11854
|
-
const response = await fetch(action, {
|
11932
|
+
const response = await fetch(String(action), {
|
11855
11933
|
method,
|
11856
11934
|
headers: {
|
11857
11935
|
...headers,
|
@@ -12349,7 +12427,7 @@ var updateAt = (fieldValues, index, value) => {
|
|
12349
12427
|
*/
|
12350
12428
|
function useFieldArray(props) {
|
12351
12429
|
const methods = useFormContext();
|
12352
|
-
const { control = methods.control, name, keyName = 'id', shouldUnregister, } = props;
|
12430
|
+
const { control = methods.control, name, keyName = 'id', shouldUnregister, rules, } = props;
|
12353
12431
|
const [fields, setFields] = React__default.useState(control._getFieldArray(name));
|
12354
12432
|
const ids = React__default.useRef(control._getFieldArray(name).map(generateId));
|
12355
12433
|
const _fieldIds = React__default.useRef(fields);
|
@@ -12358,8 +12436,8 @@ function useFieldArray(props) {
|
|
12358
12436
|
_name.current = name;
|
12359
12437
|
_fieldIds.current = fields;
|
12360
12438
|
control._names.array.add(name);
|
12361
|
-
|
12362
|
-
control.register(name,
|
12439
|
+
rules &&
|
12440
|
+
control.register(name, rules);
|
12363
12441
|
useSubscribe({
|
12364
12442
|
next: ({ values, name: fieldArrayName, }) => {
|
12365
12443
|
if (fieldArrayName === _name.current || !fieldArrayName) {
|
@@ -12403,6 +12481,8 @@ function useFieldArray(props) {
|
|
12403
12481
|
ids.current = removeArrayAt(ids.current, index);
|
12404
12482
|
updateValues(updatedFieldArrayValues);
|
12405
12483
|
setFields(updatedFieldArrayValues);
|
12484
|
+
!Array.isArray(get$1(control._fields, name)) &&
|
12485
|
+
set$1(control._fields, name, undefined);
|
12406
12486
|
control._updateFieldArray(name, updatedFieldArrayValues, removeArrayAt, {
|
12407
12487
|
argA: index,
|
12408
12488
|
});
|
@@ -12717,7 +12797,8 @@ var getRuleValue = (rule) => isUndefined(rule)
|
|
12717
12797
|
: rule;
|
12718
12798
|
|
12719
12799
|
const ASYNC_FUNCTION = 'AsyncFunction';
|
12720
|
-
var hasPromiseValidation = (fieldReference) =>
|
12800
|
+
var hasPromiseValidation = (fieldReference) => !!fieldReference &&
|
12801
|
+
!!fieldReference.validate &&
|
12721
12802
|
!!((isFunction$1(fieldReference.validate) &&
|
12722
12803
|
fieldReference.validate.constructor.name === ASYNC_FUNCTION) ||
|
12723
12804
|
(isObject$2(fieldReference.validate) &&
|
@@ -12846,7 +12927,7 @@ function createFormControl(props = {}) {
|
|
12846
12927
|
timer = setTimeout(callback, wait);
|
12847
12928
|
};
|
12848
12929
|
const _updateValid = async (shouldUpdateValid) => {
|
12849
|
-
if (!
|
12930
|
+
if (!_options.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
|
12850
12931
|
const isValid = _options.resolver
|
12851
12932
|
? isEmptyObject((await _executeSchema()).errors)
|
12852
12933
|
: await executeBuiltInValidation(_fields, true);
|
@@ -12858,7 +12939,7 @@ function createFormControl(props = {}) {
|
|
12858
12939
|
}
|
12859
12940
|
};
|
12860
12941
|
const _updateIsValidating = (names, isValidating) => {
|
12861
|
-
if (!
|
12942
|
+
if (!_options.disabled &&
|
12862
12943
|
(_proxyFormState.isValidating || _proxyFormState.validatingFields)) {
|
12863
12944
|
(names || Array.from(_names.mount)).forEach((name) => {
|
12864
12945
|
if (name) {
|
@@ -12874,7 +12955,7 @@ function createFormControl(props = {}) {
|
|
12874
12955
|
}
|
12875
12956
|
};
|
12876
12957
|
const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
|
12877
|
-
if (args && method && !
|
12958
|
+
if (args && method && !_options.disabled) {
|
12878
12959
|
_state.action = true;
|
12879
12960
|
if (shouldUpdateFieldsAndState && Array.isArray(get$1(_fields, name))) {
|
12880
12961
|
const fieldValues = method(get$1(_fields, name), args.argA, args.argB);
|
@@ -12938,7 +13019,7 @@ function createFormControl(props = {}) {
|
|
12938
13019
|
const output = {
|
12939
13020
|
name,
|
12940
13021
|
};
|
12941
|
-
if (!
|
13022
|
+
if (!_options.disabled) {
|
12942
13023
|
const disabledField = !!(get$1(_fields, name) &&
|
12943
13024
|
get$1(_fields, name)._f &&
|
12944
13025
|
get$1(_fields, name)._f.disabled);
|
@@ -12979,9 +13060,9 @@ function createFormControl(props = {}) {
|
|
12979
13060
|
const shouldUpdateValid = _proxyFormState.isValid &&
|
12980
13061
|
isBoolean(isValid) &&
|
12981
13062
|
_formState.isValid !== isValid;
|
12982
|
-
if (
|
13063
|
+
if (_options.delayError && error) {
|
12983
13064
|
delayErrorCallback = debounce(() => updateErrors(name, error));
|
12984
|
-
delayErrorCallback(
|
13065
|
+
delayErrorCallback(_options.delayError);
|
12985
13066
|
}
|
12986
13067
|
else {
|
12987
13068
|
clearTimeout(timer);
|
@@ -13074,7 +13155,7 @@ function createFormControl(props = {}) {
|
|
13074
13155
|
}
|
13075
13156
|
_names.unMount = new Set();
|
13076
13157
|
};
|
13077
|
-
const _getDirty = (name, data) => !
|
13158
|
+
const _getDirty = (name, data) => !_options.disabled &&
|
13078
13159
|
(name && data && set$1(_formValues, name, data),
|
13079
13160
|
!deepEqual(getValues(), _defaultValues));
|
13080
13161
|
const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
|
@@ -13086,7 +13167,7 @@ function createFormControl(props = {}) {
|
|
13086
13167
|
? { [names]: defaultValue }
|
13087
13168
|
: defaultValue),
|
13088
13169
|
}, isGlobal, defaultValue);
|
13089
|
-
const _getFieldArray = (name) => compact(get$1(_state.mount ? _formValues : _defaultValues, name,
|
13170
|
+
const _getFieldArray = (name) => compact(get$1(_state.mount ? _formValues : _defaultValues, name, _options.shouldUnregister ? get$1(_defaultValues, name, []) : []));
|
13090
13171
|
const setFieldValue = (name, value, options = {}) => {
|
13091
13172
|
const field = get$1(_fields, name);
|
13092
13173
|
let fieldValue = value;
|
@@ -13219,7 +13300,7 @@ function createFormControl(props = {}) {
|
|
13219
13300
|
});
|
13220
13301
|
if (shouldSkipValidation) {
|
13221
13302
|
if (_proxyFormState.isValid) {
|
13222
|
-
if (
|
13303
|
+
if (_options.mode === 'onBlur') {
|
13223
13304
|
if (isBlurEvent) {
|
13224
13305
|
_updateValid();
|
13225
13306
|
}
|
@@ -13384,13 +13465,15 @@ function createFormControl(props = {}) {
|
|
13384
13465
|
: isUndefined(value)
|
13385
13466
|
? getFieldValue(field ? field._f : get$1(fields, name)._f)
|
13386
13467
|
: value;
|
13387
|
-
|
13468
|
+
if (disabled || (!disabled && !isUndefined(inputValue))) {
|
13469
|
+
set$1(_formValues, name, inputValue);
|
13470
|
+
}
|
13388
13471
|
updateTouchAndDirty(name, inputValue, false, false, true);
|
13389
13472
|
}
|
13390
13473
|
};
|
13391
13474
|
const register = (name, options = {}) => {
|
13392
13475
|
let field = get$1(_fields, name);
|
13393
|
-
const disabledIsDefined = isBoolean(options.disabled) || isBoolean(
|
13476
|
+
const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
|
13394
13477
|
set$1(_fields, name, {
|
13395
13478
|
...(field || {}),
|
13396
13479
|
_f: {
|
@@ -13406,7 +13489,7 @@ function createFormControl(props = {}) {
|
|
13406
13489
|
field,
|
13407
13490
|
disabled: isBoolean(options.disabled)
|
13408
13491
|
? options.disabled
|
13409
|
-
:
|
13492
|
+
: _options.disabled,
|
13410
13493
|
name,
|
13411
13494
|
value: options.value,
|
13412
13495
|
});
|
@@ -13416,7 +13499,7 @@ function createFormControl(props = {}) {
|
|
13416
13499
|
}
|
13417
13500
|
return {
|
13418
13501
|
...(disabledIsDefined
|
13419
|
-
? { disabled: options.disabled ||
|
13502
|
+
? { disabled: options.disabled || _options.disabled }
|
13420
13503
|
: {}),
|
13421
13504
|
...(_options.progressive
|
13422
13505
|
? {
|
@@ -13500,6 +13583,12 @@ function createFormControl(props = {}) {
|
|
13500
13583
|
e.preventDefault && e.preventDefault();
|
13501
13584
|
e.persist && e.persist();
|
13502
13585
|
}
|
13586
|
+
if (_options.disabled) {
|
13587
|
+
if (onInvalid) {
|
13588
|
+
await onInvalid({ ..._formState.errors }, e);
|
13589
|
+
}
|
13590
|
+
return;
|
13591
|
+
}
|
13503
13592
|
let fieldValues = cloneObject(_formValues);
|
13504
13593
|
_subjects.state.next({
|
13505
13594
|
isSubmitting: true,
|
@@ -13607,7 +13696,7 @@ function createFormControl(props = {}) {
|
|
13607
13696
|
}
|
13608
13697
|
_fields = {};
|
13609
13698
|
}
|
13610
|
-
_formValues =
|
13699
|
+
_formValues = _options.shouldUnregister
|
13611
13700
|
? keepStateOptions.keepDefaultValues
|
13612
13701
|
? cloneObject(_defaultValues)
|
13613
13702
|
: {}
|
@@ -13631,7 +13720,7 @@ function createFormControl(props = {}) {
|
|
13631
13720
|
!_proxyFormState.isValid ||
|
13632
13721
|
!!keepStateOptions.keepIsValid ||
|
13633
13722
|
!!keepStateOptions.keepDirtyValues;
|
13634
|
-
_state.watch = !!
|
13723
|
+
_state.watch = !!_options.shouldUnregister;
|
13635
13724
|
_subjects.state.next({
|
13636
13725
|
submitCount: keepStateOptions.keepSubmitCount
|
13637
13726
|
? _formState.submitCount
|
@@ -13678,7 +13767,9 @@ function createFormControl(props = {}) {
|
|
13678
13767
|
: fieldReference.ref;
|
13679
13768
|
if (fieldRef.focus) {
|
13680
13769
|
fieldRef.focus();
|
13681
|
-
options.shouldSelect &&
|
13770
|
+
options.shouldSelect &&
|
13771
|
+
isFunction$1(fieldRef.select) &&
|
13772
|
+
fieldRef.select();
|
13682
13773
|
}
|
13683
13774
|
}
|
13684
13775
|
};
|
@@ -13800,8 +13891,8 @@ function createFormControl(props = {}) {
|
|
13800
13891
|
* ```
|
13801
13892
|
*/
|
13802
13893
|
function useForm(props = {}) {
|
13803
|
-
const _formControl = React__default.useRef();
|
13804
|
-
const _values = React__default.useRef();
|
13894
|
+
const _formControl = React__default.useRef(undefined);
|
13895
|
+
const _values = React__default.useRef(undefined);
|
13805
13896
|
const [formState, updateFormState] = React__default.useState({
|
13806
13897
|
isDirty: false,
|
13807
13898
|
isValidating: false,
|
@@ -13879,11 +13970,6 @@ function useForm(props = {}) {
|
|
13879
13970
|
values: control._getWatch(),
|
13880
13971
|
});
|
13881
13972
|
}, [props.shouldUnregister, control]);
|
13882
|
-
React__default.useEffect(() => {
|
13883
|
-
if (_formControl.current) {
|
13884
|
-
_formControl.current.watch = _formControl.current.watch.bind({});
|
13885
|
-
}
|
13886
|
-
}, [formState]);
|
13887
13973
|
_formControl.current.formState = getProxyFormState(formState, control);
|
13888
13974
|
return _formControl.current;
|
13889
13975
|
}
|
@@ -13930,8 +14016,8 @@ const Forms = ({
|
|
13930
14016
|
};
|
13931
14017
|
const ForwardedForms = /*#__PURE__*/forwardRef(Forms);
|
13932
14018
|
|
13933
|
-
var css_248z$
|
13934
|
-
styleInject(css_248z$
|
14019
|
+
var css_248z$S = ".fontXs, .ff-input-with-dropdown-container .ff-helper-text {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-input-with-dropdown-container {\n display: flex;\n flex-direction: column;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown {\n display: flex;\n border: 1px solid var(--input-default-border-color);\n border-radius: 4px;\n padding: 0;\n position: relative;\n justify-content: space-between;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-input-with-dropdown--left {\n display: flex;\n flex-direction: row-reverse;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-input-with-dropdown--right {\n display: flex;\n flex-direction: row;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-input--left-dropdown {\n width: 698px;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container {\n display: flex;\n flex: 1;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label {\n position: absolute;\n z-index: 9;\n color: var(--input-default-border-color);\n top: 6px;\n left: 7px;\n transition: all 0.3s ease-in-out;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label .ff-required-asterisk {\n color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--filled {\n color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--no-hover {\n color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--error {\n color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input {\n width: 100%;\n padding: 6px 7px;\n line-height: 18px;\n border: none;\n outline: none;\n border-right: 1px solid var(--input-default-border-color);\n border-radius: 4px 0 0 4px;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::-webkit-outer-spin-button, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::placeholder {\n opacity: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input:disabled {\n cursor: not-allowed;\n background: transparent;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input--left-dropdown::placeholder {\n opacity: 1;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--no-hover {\n border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown {\n width: 100%;\n border: none;\n outline: none;\n margin: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown:disabled {\n cursor: not-allowed;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown:hover {\n background-color: var(--dropdown-bg-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown--left {\n min-width: 94px;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .seperatorline {\n height: 26px;\n margin-top: 3px;\n border-right: 0.5px solid var(--brand-color);\n flex-shrink: 0;\n border-radius: 2px;\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown {\n border-color: var(--brand-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--filled {\n border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--disabled {\n border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--left .ff-floating-label {\n color: var(--input-hover-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--left .ff-floating-label--filled {\n color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--left .ff-floating-label--disabled {\n color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--left .ff-floating-label--error {\n color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input {\n border-color: var(--brand-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--filled {\n border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--disabled {\n border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown {\n border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-label {\n top: -9px;\n background-color: var(--input-label-bg-color);\n padding: 0px 2px;\n color: var(--input-active-text-color);\n line-height: 15px;\n font-size: 10px !important;\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-label--error {\n color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input {\n border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input::placeholder {\n opacity: 1;\n}\n.ff-input-with-dropdown-container--filled .ff-input-with-dropdown .ff-floating-label-input-container {\n border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container--filled .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label {\n top: -9px;\n background-color: var(--input-label-bg-color);\n padding: 0px 2px;\n line-height: 15px;\n font-size: 10px !important;\n}\n.ff-input-with-dropdown-container--filled span {\n font-size: 8px;\n}\n.ff-input-with-dropdown-container--filled .required-asterisk {\n color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-helper-text {\n color: var(--input-error-text-color);\n padding: 0 11px;\n}";
|
14020
|
+
styleInject(css_248z$S);
|
13935
14021
|
|
13936
14022
|
const InputWithDropdown = /*#__PURE__*/forwardRef(({
|
13937
14023
|
name = '',
|
@@ -14041,8 +14127,8 @@ const InputWithDropdown = /*#__PURE__*/forwardRef(({
|
|
14041
14127
|
});
|
14042
14128
|
});
|
14043
14129
|
|
14044
|
-
var css_248z$
|
14045
|
-
styleInject(css_248z$
|
14130
|
+
var css_248z$R = ".ff-mini-modal-overlay {\n position: fixed;\n inset: 0;\n width: 100vw;\n height: 100vh;\n}\n\n.ff-mini-edit-modal-container {\n width: fit-content;\n padding: 0;\n position: absolute;\n visibility: hidden;\n}\n.ff-mini-edit-modal-container.modalVisible {\n visibility: visible;\n}\n.ff-mini-edit-modal-container.animatedModal {\n animation: slideDown 0.5s ease, opacity 0.5s ease;\n}\n.ff-mini-edit-modal-container .popover-arrow {\n position: absolute;\n width: 0;\n height: 0;\n border-style: solid;\n z-index: 102;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-top {\n bottom: 100%;\n left: 30px;\n padding: 0 3px 0 0;\n border-color: transparent transparent var(--ff-mini-modal-border) transparent;\n filter: drop-shadow(0 -1px 1px var(--ff-mini-modal-arrow-shadow));\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-top::before {\n content: \"\";\n position: absolute;\n width: 3px;\n height: 4px;\n border-radius: 50px;\n background-color: var(--ff-mini-modal-border);\n top: -0.5px;\n left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-left {\n left: -15px;\n border-color: transparent var(--ff-mini-modal-border) transparent transparent;\n filter: drop-shadow(-1px 0 1px var(--ff-mini-modal-arrow-shadow));\n padding: 3px 1px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-left::before {\n content: \"\";\n position: absolute;\n width: 4px;\n height: 3px;\n border-radius: 50px;\n background-color: var(--ff-mini-modal-border);\n top: 0;\n left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-bottom {\n top: 100%;\n left: 30px;\n border-color: var(--ff-mini-modal-border) transparent transparent transparent;\n filter: drop-shadow(0 2px 1px var(--ff-mini-modal-arrow-shadow));\n padding: 0 3px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-bottom::before {\n content: \"\";\n position: absolute;\n width: 3px;\n height: 3px;\n border-radius: 50px;\n background-color: var(--ff-mini-modal-border);\n top: -2px;\n left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-right {\n right: -10px;\n top: 66px;\n border-color: transparent transparent transparent var(--ff-mini-modal-border);\n filter: drop-shadow(2px 0 1px var(--ff-mini-modal-arrow-shadow));\n padding: 3px 1px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-right::before {\n content: \"\";\n position: absolute;\n width: 3px;\n height: 3px;\n border-radius: 50px;\n background-color: var(--ff-mini-modal-border);\n top: 0;\n left: -2px;\n}\n.ff-mini-edit-modal-container .popover-arrow.left-top-arrow {\n top: 10%;\n}\n.ff-mini-edit-modal-container .popover-arrow.left-middle-arrow {\n top: 45%;\n}\n.ff-mini-edit-modal-container .wrapped-div {\n height: 35px;\n background-color: transparent;\n outline: 8px solid var(--ff-mini-modal-border);\n outline-offset: -8px;\n position: absolute;\n top: -34px;\n border-radius: 7px 7px 0 0;\n}\n.ff-mini-edit-modal-container .wrapped-div::before, .ff-mini-edit-modal-container .wrapped-div::after {\n position: absolute;\n content: \"\";\n width: 13px;\n height: 13px;\n background: transparent;\n border-radius: 50%;\n bottom: 0;\n box-shadow: 8px 4px 0 var(--ff-mini-modal-border);\n}\n.ff-mini-edit-modal-container .wrapped-div::before {\n left: -13px;\n clip-path: polygon(100% 100%, 110% 45%, 0% 70%, 0% 100%);\n}\n.ff-mini-edit-modal-container .wrapped-div::after {\n right: -13px;\n clip-path: polygon(-5% 100%, 0% 40%, 100% 70%, 100% 100%);\n box-shadow: -8px 4px 0 var(--ff-mini-modal-border);\n}\n.ff-mini-edit-modal-container .mini-edit-modal {\n background: var(--ff-mini-modal-border);\n position: relative;\n max-height: fit-content;\n width: 100%;\n margin: 0 0 0 -5px;\n height: 100%;\n}\n.ff-mini-edit-modal-container .mini-edit-modal.mini-edit-modal-wrapper-shadow {\n box-shadow: 0px 0px 4px 0px var(--ff-mini-modal-box-shadow);\n}\n.ff-mini-edit-modal-container .mini-edit-modal.mini-edit-modal-arrow-shadow {\n box-shadow: 0px 0px 16px 0px var(--ff-mini-modal-arrow-shadow);\n}\n.ff-mini-edit-modal-container .mini-edit-modal header {\n border-radius: 4px 4px 0 0;\n}\n.ff-mini-edit-modal-container .mini-edit-modal footer {\n border-radius: 0 0 4px 4px;\n}\n.ff-mini-edit-modal-container .mini-edit-modal .modal-footer {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 5px;\n background-color: var(--ff-mini-modal-footer-background);\n height: 24px;\n padding: 0 10px 0 0;\n transition: transform 0.3s ease-in-out;\n}\n@keyframes slideDown {\n 0% {\n transform: translateY(-50px);\n opacity: 0;\n }\n 100% {\n transform: translateY(0);\n opacity: 1;\n }\n}\n\n.ff-mini-modal-buttons-flex {\n display: flex;\n}\n\n.ff-mini-modal-gap-10 {\n gap: 10px;\n}\n\n.ff-mini-edit-model-icon {\n color: var(--ff-mini-modal-box-shadow);\n border: 2px solid var(--ff-mini-modal-box-shadow);\n border-radius: 4px;\n}";
|
14131
|
+
styleInject(css_248z$R);
|
14046
14132
|
|
14047
14133
|
const MiniModal = /*#__PURE__*/forwardRef(({
|
14048
14134
|
anchorRef,
|
@@ -14316,8 +14402,8 @@ const MiniModal = /*#__PURE__*/forwardRef(({
|
|
14316
14402
|
}), document.body);
|
14317
14403
|
});
|
14318
14404
|
|
14319
|
-
var css_248z$
|
14320
|
-
styleInject(css_248z$
|
14405
|
+
var css_248z$Q = ":root {\n --table-height: auto;\n}\n\n.tree-table-space-block {\n display: inline-block;\n width: 20px;\n height: 16px;\n text-align: center;\n line-height: 16px;\n vertical-align: top;\n font-size: 19px;\n position: relative;\n box-sizing: border-box;\n border-radius: 50%;\n}\n.tree-table-space-block.btn-toggle {\n position: relative;\n cursor: pointer;\n width: 22px;\n height: 18px;\n z-index: 12;\n}\n.tree-table-space-block.btn-toggle::before {\n display: none;\n}\n.tree-table-space-block.last-block::after, .tree-table-space-block.no-folder::after {\n position: absolute;\n content: \"\";\n height: 1px;\n background: var(--tree-connecting-lines-color);\n top: 50%;\n margin-top: -1px;\n}\n.tree-table-space-block.last-block::after {\n width: 12px;\n left: -10px;\n}\n.tree-table-space-block.no-folder {\n width: 8px;\n}\n.tree-table-space-block.no-folder::after {\n width: 18px;\n left: -10px;\n}\n.tree-table-space-block:not(.last-block, .no-lines, .last-node)::before {\n position: absolute;\n content: \"\";\n width: 1px;\n height: 40px;\n background: var(--tree-connecting-lines-color);\n left: 50%;\n top: -4px;\n z-index: 99;\n}\n.tree-table-space-block.last-node::before {\n position: absolute;\n content: \"\";\n width: 1px;\n height: 12px;\n background: var(--tree-connecting-lines-color);\n left: 50%;\n top: -4px;\n z-index: -1;\n}\n\n.hidden {\n display: none;\n}\n\n.show {\n display: table-row;\n visibility: visible;\n}\n\n.btn-toggle {\n cursor: pointer;\n}\n.btn-toggle.is-close {\n background: #f1f1f1;\n border: 1px solid transparent;\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n}\n.btn-toggle::before, .btn-toggle::after {\n display: none;\n}\n\n.tree-table-wrap {\n width: 100%;\n padding-left: 4px;\n overflow: hidden;\n overflow-x: auto;\n}\n\n.table-scrollable {\n height: var(--table-height); /* Adjust height as needed */\n overflow-y: auto;\n position: relative;\n}\n\n.ff-table-tree-body {\n overflow: scroll;\n}\n\ntr:hover {\n background-color: var(--hover-color);\n}\n\n.tree-table {\n table-layout: fixed;\n width: 100%;\n border-collapse: collapse;\n overflow: scroll;\n}\n.tree-table thead {\n position: sticky;\n top: 0;\n z-index: 2;\n}\n.tree-table tr {\n background-color: var(--base-bg-color);\n}\n.tree-table tr .table-tree-row-action {\n display: none;\n}\n.tree-table tr .table-tree-row-action {\n display: inline-flex;\n align-items: center;\n}\n.tree-table::after {\n content: \"\";\n display: block;\n visibility: hidden;\n clear: both;\n}\n\nth,\ntd {\n text-align: left;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\nth {\n color: var(--brand-color);\n background: var(--slider-table-color);\n font-size: 13px;\n width: 400px;\n height: 32px;\n box-sizing: border-box;\n}\nth:first-child {\n width: 400px !important;\n position: sticky;\n left: 0;\n}\n\ntd {\n font-size: 14px;\n color: var(--brand-color);\n height: 18px;\n}\ntd:first-child {\n overflow: initial;\n position: sticky;\n left: 0;\n background-color: white;\n}\ntd:first-child:hover {\n background-color: var(--hover-color);\n}\ntd:first-child .tree-table-default-content {\n margin-left: 8px;\n}\ntd:first-child .tree-table-td-content {\n padding-left: 4px;\n}\ntd:first-child .tree-table-td-content .tree-table-td-content-text {\n margin-left: 4px;\n}\ntd.folder {\n height: 28px;\n}\n\n.tree-table-td-content {\n display: inline-flex;\n align-items: center;\n font-size: 12px;\n font-family: \"Poppins\", sans-serif;\n}\n.tree-table-td-content.folder {\n font-weight: 600;\n}\n\n.tree-row-expanded span svg,\n.tree-row-collapsed span svg {\n height: 12px;\n width: 12px;\n}\n.tree-row-expanded span svg path,\n.tree-row-collapsed span svg path {\n fill: var(--brand-color);\n}\n\n.tree-row-collapsed svg {\n transform: rotate(-90deg);\n transition: transform 0.3s ease;\n}\n\n.tree-table-space-container {\n display: inline-flex;\n}\n\n.tree-title-container {\n display: inline-flex;\n align-items: center;\n}";
|
14406
|
+
styleInject(css_248z$Q);
|
14321
14407
|
|
14322
14408
|
const TableHead = /*#__PURE__*/React__default.memo(({
|
14323
14409
|
columnsData
|
@@ -14353,9 +14439,347 @@ const TableHead = /*#__PURE__*/React__default.memo(({
|
|
14353
14439
|
});
|
14354
14440
|
});
|
14355
14441
|
|
14356
|
-
var css_248z$
|
14442
|
+
var css_248z$P = ".add-module-container {\n display: flex;\n}\n.add-module-container .icons {\n cursor: pointer;\n}";
|
14443
|
+
styleInject(css_248z$P);
|
14444
|
+
|
14445
|
+
const AddModule = ({
|
14446
|
+
onConfirm,
|
14447
|
+
onCancel,
|
14448
|
+
error,
|
14449
|
+
value = ''
|
14450
|
+
}) => {
|
14451
|
+
console.log('🚀 ~ value:', value);
|
14452
|
+
const [text, setText] = useState(value);
|
14453
|
+
return jsxs(Fragment, {
|
14454
|
+
children: [jsxs("div", {
|
14455
|
+
className: "add-module-container",
|
14456
|
+
children: [jsx("input", {
|
14457
|
+
type: "text",
|
14458
|
+
className: "add-module-input",
|
14459
|
+
onChange: e => setText(e.target.value),
|
14460
|
+
value: text
|
14461
|
+
}), jsx(Icon, {
|
14462
|
+
className: "icons",
|
14463
|
+
name: "update_icon",
|
14464
|
+
onClick: () => onConfirm && onConfirm(text)
|
14465
|
+
}), jsx(Icon, {
|
14466
|
+
className: "icons",
|
14467
|
+
name: "close",
|
14468
|
+
onClick: onCancel
|
14469
|
+
})]
|
14470
|
+
}), jsx("small", {
|
14471
|
+
children: error
|
14472
|
+
})]
|
14473
|
+
});
|
14474
|
+
};
|
14475
|
+
|
14476
|
+
const renderSpaces = (level, parentSiblings = [], isLast) => {
|
14477
|
+
let siblingsArray = parentSiblings;
|
14478
|
+
let isLastNode = isLast;
|
14479
|
+
if (checkEmpty(parentSiblings)) {
|
14480
|
+
isLastNode = false;
|
14481
|
+
if (!isNaN(level)) {
|
14482
|
+
siblingsArray = Array(level).fill(true);
|
14483
|
+
}
|
14484
|
+
}
|
14485
|
+
return jsx("div", {
|
14486
|
+
className: "tree-table-space-container",
|
14487
|
+
children: siblingsArray?.reverse()?.map((line, i) => jsx("span", {
|
14488
|
+
className: `tree-table-space-block ${!line ? 'no-lines' : ''} ${isLastNode && i === level - 1 ? 'last-node' : ''}`
|
14489
|
+
}, i))
|
14490
|
+
});
|
14491
|
+
};
|
14492
|
+
const TableCell = /*#__PURE__*/React__default.memo(({
|
14493
|
+
col,
|
14494
|
+
node,
|
14495
|
+
selected,
|
14496
|
+
select,
|
14497
|
+
onCheckBoxChange,
|
14498
|
+
onToggleExpand,
|
14499
|
+
index,
|
14500
|
+
onAddConfirm,
|
14501
|
+
onAddCancel
|
14502
|
+
}) => jsxs("td", {
|
14503
|
+
className: `${col.isTree && node.folder ? 'folder' : ''}`,
|
14504
|
+
children: [col.isTree && renderSpaces(node.hierarchy + 1, node.parentSiblings, node.last), jsxs("div", {
|
14505
|
+
className: "tree-title-container",
|
14506
|
+
children: [col.isTree && jsx("span", {
|
14507
|
+
className: `tree-table-space-block last-block ${node.expand ? 'tree-row-expanded' : 'tree-row-collapsed'} ${node.container ? '' : 'no-folder'}`,
|
14508
|
+
onClick: () => onToggleExpand(node),
|
14509
|
+
children: node.container && node?.resourceCount + node?.subContainerCount > 0 && jsxs("span", {
|
14510
|
+
onClick: () => onToggleExpand(node),
|
14511
|
+
children: [' ', jsx(SvgArrowsDownIcon, {})]
|
14512
|
+
})
|
14513
|
+
}), jsxs("span", {
|
14514
|
+
className: `tree-table-td-content ${col.isTree && node.folder ? 'folder' : ''}`,
|
14515
|
+
children: [!node?.isNewNode && jsxs(Fragment, {
|
14516
|
+
children: [col.isTree && select === 'checkbox' && jsx(Checkbox, {
|
14517
|
+
checked: node?.checked || false,
|
14518
|
+
partial: node?.checked === 'partial',
|
14519
|
+
onChange: e => onCheckBoxChange(e, node)
|
14520
|
+
}), col.isTree && select === 'radio' && jsx(RadioButton, {
|
14521
|
+
name: node.title,
|
14522
|
+
checked: selected.includes(node.id),
|
14523
|
+
value: node.id,
|
14524
|
+
onChange: e => onCheckBoxChange(e, node)
|
14525
|
+
})]
|
14526
|
+
}), node.isNewNode && col.isTree ? jsx(AddModule, {
|
14527
|
+
onCancel: onAddCancel,
|
14528
|
+
onConfirm: onAddConfirm,
|
14529
|
+
error: node?.error || '',
|
14530
|
+
value: node.value
|
14531
|
+
}) : jsx("span", {
|
14532
|
+
className: "tree-table-td-content-text",
|
14533
|
+
children: prepareData(node, col)
|
14534
|
+
})]
|
14535
|
+
})]
|
14536
|
+
}), col.actions && !node?.isNewNode && jsx("div", {
|
14537
|
+
className: "table-tree-row-action",
|
14538
|
+
children: col.actions(node, index)
|
14539
|
+
})]
|
14540
|
+
}));
|
14541
|
+
|
14542
|
+
const TableRow = /*#__PURE__*/React__default.memo(({
|
14543
|
+
node,
|
14544
|
+
columnsData,
|
14545
|
+
selected,
|
14546
|
+
select,
|
14547
|
+
onRowClick,
|
14548
|
+
onToggleExpand,
|
14549
|
+
onCheckBoxChange,
|
14550
|
+
index,
|
14551
|
+
onAddConfirm,
|
14552
|
+
onAddCancel
|
14553
|
+
}) => jsx("tr", {
|
14554
|
+
"data-level": node.hierarchy,
|
14555
|
+
className: "show",
|
14556
|
+
onClick: e => onRowClick(e, node),
|
14557
|
+
children: columnsData.map(col => jsx(TableCell, {
|
14558
|
+
col: col,
|
14559
|
+
node: node,
|
14560
|
+
selected: selected,
|
14561
|
+
select: select,
|
14562
|
+
onCheckBoxChange: onCheckBoxChange,
|
14563
|
+
onToggleExpand: onToggleExpand,
|
14564
|
+
index: index,
|
14565
|
+
onAddConfirm: onAddConfirm,
|
14566
|
+
onAddCancel: onAddCancel
|
14567
|
+
}, col.name))
|
14568
|
+
}));
|
14569
|
+
|
14570
|
+
const addNewRow = (treeData, newNode) => {
|
14571
|
+
const {
|
14572
|
+
sourceId,
|
14573
|
+
action,
|
14574
|
+
value = '',
|
14575
|
+
error = ''
|
14576
|
+
} = newNode;
|
14577
|
+
if (!sourceId || !action) return treeData;
|
14578
|
+
const nodeMap = new Map(treeData.map(node => [node.key, node]));
|
14579
|
+
const sourceNode = nodeMap.get(sourceId);
|
14580
|
+
if (!sourceNode) return treeData;
|
14581
|
+
const updatedTreeData = [...treeData];
|
14582
|
+
const sourceIndex = treeData.findIndex(node => node.key === sourceId);
|
14583
|
+
const newNodeBase = {
|
14584
|
+
hierarchy: sourceNode.hierarchy,
|
14585
|
+
sourceId: sourceNode.key,
|
14586
|
+
isNewNode: true,
|
14587
|
+
key: 'new-node',
|
14588
|
+
value,
|
14589
|
+
error
|
14590
|
+
};
|
14591
|
+
switch (action) {
|
14592
|
+
case 'addAbove':
|
14593
|
+
updatedTreeData.splice(sourceIndex, 0, newNodeBase);
|
14594
|
+
break;
|
14595
|
+
case 'addBelow':
|
14596
|
+
updatedTreeData.splice(sourceIndex + 1, 0, newNodeBase);
|
14597
|
+
break;
|
14598
|
+
case 'addInside':
|
14599
|
+
updatedTreeData.splice(sourceIndex + 1, 0, {
|
14600
|
+
...newNodeBase,
|
14601
|
+
hierarchy: sourceNode.hierarchy + 1
|
14602
|
+
});
|
14603
|
+
break;
|
14604
|
+
}
|
14605
|
+
return updatedTreeData;
|
14606
|
+
};
|
14607
|
+
|
14608
|
+
const TableBody = ({
|
14609
|
+
flattenedTreeData,
|
14610
|
+
columnsData,
|
14611
|
+
selected,
|
14612
|
+
select,
|
14613
|
+
onRowClick,
|
14614
|
+
onToggleExpand,
|
14615
|
+
onCheckBoxChange,
|
14616
|
+
newNode = {},
|
14617
|
+
onAddConfirm,
|
14618
|
+
onAddCancel
|
14619
|
+
}) => {
|
14620
|
+
if (checkEmpty(flattenedTreeData)) {
|
14621
|
+
return null;
|
14622
|
+
}
|
14623
|
+
return jsxs("tbody", {
|
14624
|
+
className: "ff-table-tree-body",
|
14625
|
+
children: [jsx("tr", {
|
14626
|
+
id: "ff-table-tree-first-node"
|
14627
|
+
}), addNewRow(flattenedTreeData, newNode)?.map((node, index) => jsx(TableRow, {
|
14628
|
+
node: node,
|
14629
|
+
columnsData: columnsData,
|
14630
|
+
selected: selected,
|
14631
|
+
select: select,
|
14632
|
+
onRowClick: onRowClick,
|
14633
|
+
onToggleExpand: node => onToggleExpand(node, index),
|
14634
|
+
onCheckBoxChange: onCheckBoxChange,
|
14635
|
+
index: index,
|
14636
|
+
onAddConfirm: onAddConfirm,
|
14637
|
+
onAddCancel: onAddCancel
|
14638
|
+
}, node.key)), jsx("tr", {
|
14639
|
+
id: "ff-table-tree-last-node"
|
14640
|
+
})]
|
14641
|
+
});
|
14642
|
+
};
|
14643
|
+
|
14644
|
+
const TreeTable = ({
|
14645
|
+
treeData,
|
14646
|
+
columnsData,
|
14647
|
+
selected = [],
|
14648
|
+
select = null,
|
14649
|
+
onChange,
|
14650
|
+
onClick,
|
14651
|
+
onExpand,
|
14652
|
+
loadMore = () => {},
|
14653
|
+
tableBorder,
|
14654
|
+
height = 'auto',
|
14655
|
+
newNode = {
|
14656
|
+
action: 'addInside',
|
14657
|
+
sourceId: 'PAG1013',
|
14658
|
+
value: 'newNode'
|
14659
|
+
},
|
14660
|
+
onAddConfirm = _name => {},
|
14661
|
+
onAddCancel = () => {}
|
14662
|
+
}) => {
|
14663
|
+
const observerRef = useRef(null);
|
14664
|
+
useEffect(() => {
|
14665
|
+
const scrollContainer = document.getElementById('ff-table-tree-scroll-container');
|
14666
|
+
const firstNode = document.getElementById('ff-table-tree-first-node');
|
14667
|
+
const lastNode = document.getElementById('ff-table-tree-last-node');
|
14668
|
+
// Exit early if treeData is empty or elements are missing
|
14669
|
+
if (!scrollContainer || !firstNode || !lastNode || !treeData?.length) {
|
14670
|
+
return;
|
14671
|
+
}
|
14672
|
+
observerRef.current = new IntersectionObserver(entries => {
|
14673
|
+
entries.forEach(entry => {
|
14674
|
+
if (entry.isIntersecting) {
|
14675
|
+
const direction = entry.target.id === 'ff-table-tree-last-node' ? 'below' : 'above';
|
14676
|
+
loadMore(direction);
|
14677
|
+
}
|
14678
|
+
});
|
14679
|
+
}, {
|
14680
|
+
root: scrollContainer,
|
14681
|
+
rootMargin: '8px',
|
14682
|
+
threshold: 0.1
|
14683
|
+
});
|
14684
|
+
observerRef.current.observe(firstNode);
|
14685
|
+
observerRef.current.observe(lastNode);
|
14686
|
+
return () => {
|
14687
|
+
// Cleanup observer
|
14688
|
+
observerRef.current?.disconnect();
|
14689
|
+
};
|
14690
|
+
}, [treeData, loadMore]);
|
14691
|
+
const handleToggleExpand = useCallback((node, index) => onExpand?.(node, index), [onExpand]);
|
14692
|
+
const handleCheckBoxChange = useCallback((e, node) => {
|
14693
|
+
onChange?.(e, node);
|
14694
|
+
}, [onChange]);
|
14695
|
+
const handleRowClick = useCallback((e, node) => onClick?.(e, node), [onClick]);
|
14696
|
+
return jsx("div", {
|
14697
|
+
className: "tree-table-wrap",
|
14698
|
+
children: jsx("div", {
|
14699
|
+
className: "table-scrollable",
|
14700
|
+
id: "ff-table-tree-scroll-container",
|
14701
|
+
style: {
|
14702
|
+
'--table-height': `${height !== 'auto' ? height + 'px' : height}`,
|
14703
|
+
border: tableBorder
|
14704
|
+
},
|
14705
|
+
children: jsxs("table", {
|
14706
|
+
className: "tree-table",
|
14707
|
+
children: [jsx(TableHead, {
|
14708
|
+
columnsData: columnsData
|
14709
|
+
}), jsx(TableBody, {
|
14710
|
+
flattenedTreeData: treeData,
|
14711
|
+
columnsData: columnsData,
|
14712
|
+
selected: selected,
|
14713
|
+
select: select,
|
14714
|
+
onRowClick: handleRowClick,
|
14715
|
+
onToggleExpand: handleToggleExpand,
|
14716
|
+
onCheckBoxChange: handleCheckBoxChange,
|
14717
|
+
newNode: newNode,
|
14718
|
+
onAddConfirm: onAddConfirm,
|
14719
|
+
onAddCancel: onAddCancel
|
14720
|
+
})]
|
14721
|
+
})
|
14722
|
+
})
|
14723
|
+
});
|
14724
|
+
};
|
14725
|
+
var TableTree = /*#__PURE__*/memo(TreeTable);
|
14726
|
+
|
14727
|
+
var css_248z$O = ":root {\n --tooltip-bg-color: #1e161f;\n --status-approved-text-color: #016102;\n --status-warning-text-color: #ff8b00;\n --status-rejected-text-color: #c60202;\n --status-skipped-text-color: #3c3838;\n --status-approved-bg-color: #c6efcd;\n --status-rejected-bg-color: #f7d9d9;\n --status-warning-bg-color: #fae2c6;\n --status-skipped-bg-color: #c4c3c3;\n --brand-color: #71347b;\n --icons-default-color: #71347b;\n --default-icon-color: #a3a3a3;\n --default-color: #747474;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --system-color--error: #c50303;\n --hover-color: #f7ebff;\n --brand2-color: #610b86;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --description-text-color: #d9d9d9;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --text-color: #1e161f;\n --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --error-light: #e42525;\n --tabs-label-default-color: tabs-label-default-color;\n --tabs-label-active-color: tabs-label-active-color;\n --tabs-border-color: tabs-border-color;\n --tabs-bg-color: tabs-bg-color;\n --tab-bg-color: tab-bg-color;\n --toggle-button-bg-color: #ffffff;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-strip-color: #cfd1e2;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --toggle-strip-color: #cfd1e2;\n --add-icon-hover-color: #431b4a;\n --arrows-button-border-color: #ded1e5;\n --arrow-button-bg-color: #ffffff;\n --text-bg-highlight: #f5fb00;\n --slider-table-color: #efe1f9;\n --variable-dropdown-bg: #($variable-dropdown-bg);\n --dataset-tooltip-title: #($dataset-tooltip-title),\n --dataset-tooltip-value: #($dataset-tooltip-value), ;\n}\n\n.fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-tabs-container {\n box-sizing: border-box;\n}\n.ff-tabs-container .ff-tab-row {\n flex: 0 1 auto;\n}\n.ff-tabs-container .ff-tab-row--default {\n display: flex;\n gap: 8px;\n border-radius: 8px 8px 0 0;\n padding: 6px 8px 0;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default {\n position: relative;\n border: none;\n background: none;\n padding: 0 8px;\n display: flex;\n flex-direction: column;\n gap: 4px;\n cursor: pointer;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .label-count-section {\n display: flex;\n align-items: center;\n gap: 5px;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .label-count-section .tab-count {\n background-color: var(--input-default-label-color);\n color: var(--tab-bg-color);\n height: 12px;\n border-radius: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 8px;\n font-weight: 600;\n padding: 0 2px;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .label-count-section .tab-count--active {\n background-color: var(--tabs-label-active-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .ff-tab-bar {\n width: 100%;\n border-radius: 2px 2px 0 0;\n border-color: var(--input-default-label-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .ff-tab-bar--active {\n border-top: 2px solid var(--tabs-label-active-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .ff-tab-bar {\n border-top: 2px solid var(--input-hover-border-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .ff-tab-bar--active {\n border-top: 2px solid var(--tabs-label-active-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .ff-tab-label {\n color: var(--input-hover-border-color) !important;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .ff-tab-label--active {\n color: var(--tabs-label-active-color) !important;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .tab-count {\n background-color: var(--input-hover-border-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .tab-count--active {\n background-color: var(--tabs-label-active-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default.disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.ff-tabs-container .ff-tab-row--capsule {\n display: flex;\n gap: 8px;\n border: 1px solid var(--tabs-border-color);\n border-radius: 8px;\n padding: 3px 4px;\n background-color: var(--tabs-bg-color);\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule {\n background: transparent;\n border: none;\n padding: 3px 4px;\n border-radius: 4px;\n cursor: pointer;\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule:hover .ff-tab-label {\n color: var(--input-hover-border-color) !important;\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule:hover .ff-tab-label--active {\n color: var(--tabs-label-active-color) !important;\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule.active {\n background-color: var(--tab-bg-color);\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule .ff-tab-bar {\n display: none;\n}\n.ff-tabs-container .ff-tab-row--no-border {\n border: none;\n}\n.ff-tabs-container .ff-tab-row--no-padding {\n border-radius: 8px;\n background: white;\n padding: 0px;\n justify-content: flex-start;\n margin-right: 8px;\n}\n.ff-tabs-container .ff-tab-row--no-padding .ff-tab-button--capsule {\n background: transparent;\n border: none;\n padding: 3px 4px;\n border-radius: 7px;\n cursor: pointer;\n}\n.ff-tabs-container .ff-tab-row--no-padding .ff-tab-button--capsule:hover .ff-tab-label {\n color: var(--input-hover-border-color) !important;\n}\n.ff-tabs-container .ff-tab-row--no-padding .ff-tab-button--capsule:hover .ff-tab-label--active {\n color: var(--tabs-label-active-color) !important;\n}\n.ff-tabs-container .ff-tab-row--no-padding .ff-tab-button--capsule.active {\n background-color: var(--slider-table-color);\n}\n.ff-tabs-container .ff-tab-row--no-padding .ff-tab-button--capsule .ff-tab-bar {\n display: none;\n}\n.ff-tabs-container .ff-tab-content {\n width: inherit;\n}\n.ff-tabs-container .ff-defaultStatus {\n position: absolute;\n top: 2px;\n right: 0px;\n width: 6px;\n height: 6px;\n background-color: transparent;\n border-radius: 50%;\n}\n.ff-tabs-container .ff-defaultStatus.ff-successStatus {\n background-color: var(--confirm-tick-icon-color);\n box-shadow: 0px 1px 1px 0px var(--toggle-strip-shadow);\n}\n.ff-tabs-container .ff-defaultStatus.ff-dangerStatus {\n background-color: var(--delete-text-color);\n box-shadow: 0px 1px 1px 0px var(--toggle-strip-shadow);\n}";
|
14357
14728
|
styleInject(css_248z$O);
|
14358
14729
|
|
14730
|
+
const Tabs = ({
|
14731
|
+
variant = 'default',
|
14732
|
+
tabsData,
|
14733
|
+
activeTabId,
|
14734
|
+
onTabClick,
|
14735
|
+
noBorder = false,
|
14736
|
+
noPadding = false
|
14737
|
+
}) => {
|
14738
|
+
return jsxs("div", {
|
14739
|
+
className: `ff-tabs-container`,
|
14740
|
+
children: [jsx("div", {
|
14741
|
+
className: classNames(`ff-tab-row--${variant}`, {
|
14742
|
+
'ff-tab-row--no-border': noBorder,
|
14743
|
+
'ff-tab-row--no-padding': noPadding
|
14744
|
+
}),
|
14745
|
+
children: tabsData.map(tab => jsxs("button", {
|
14746
|
+
onClick: () => !tab.disabled && onTabClick(tab.id),
|
14747
|
+
disabled: tab.disabled,
|
14748
|
+
className: classNames(`ff-tab-button--${variant}`, {
|
14749
|
+
disabled: tab.disabled,
|
14750
|
+
active: activeTabId === tab.id
|
14751
|
+
}),
|
14752
|
+
children: [jsxs("div", {
|
14753
|
+
className: "label-count-section",
|
14754
|
+
children: [jsx(Typography, {
|
14755
|
+
children: tab.label,
|
14756
|
+
lineHeight: "18px",
|
14757
|
+
fontWeight: activeTabId === tab.id ? 'semi-bold' : 'regular',
|
14758
|
+
color: activeTabId === tab.id ? 'var(--tabs-label-active-color)' : 'var(--tabs-label-default-color)',
|
14759
|
+
className: classNames('ff-tab-label', {
|
14760
|
+
'ff-tab-label--active': activeTabId === tab.id
|
14761
|
+
})
|
14762
|
+
}), variant === 'default' && tab.count && jsx("span", {
|
14763
|
+
className: classNames('tab-count', {
|
14764
|
+
'tab-count--active': activeTabId === tab.id
|
14765
|
+
}),
|
14766
|
+
children: tab.count
|
14767
|
+
})]
|
14768
|
+
}), jsx("div", {
|
14769
|
+
className: classNames('ff-tab-bar', {
|
14770
|
+
'ff-tab-bar--active': activeTabId === tab.id
|
14771
|
+
})
|
14772
|
+
}), jsx("span", {
|
14773
|
+
className: `ff-defaultStatus ${tab.status === 'success' ? 'ff-successStatus' : tab.status === 'error' ? 'ff-dangerStatus' : ''}`
|
14774
|
+
})]
|
14775
|
+
}, tab.id))
|
14776
|
+
}), jsx("div", {
|
14777
|
+
className: `ff-tab-content`,
|
14778
|
+
children: tabsData.find(tab => tab.id === activeTabId)?.component
|
14779
|
+
})]
|
14780
|
+
});
|
14781
|
+
};
|
14782
|
+
|
14359
14783
|
var css_248z$N = ".ff-highlight-bg {\n background-color: var(--text-bg-highlight);\n}";
|
14360
14784
|
styleInject(css_248z$N);
|
14361
14785
|
|
@@ -14380,459 +14804,9 @@ const HighlightText = ({
|
|
14380
14804
|
});
|
14381
14805
|
};
|
14382
14806
|
|
14383
|
-
|
14384
|
-
if (inputValue === text) {
|
14385
|
-
return 'No changes were made.';
|
14386
|
-
} else if (!inputValue) {
|
14387
|
-
return 'Text is required';
|
14388
|
-
} else if (inputValue.length < 3) {
|
14389
|
-
return 'Please enter at least 3 characters.';
|
14390
|
-
} else ;
|
14391
|
-
return '';
|
14392
|
-
};
|
14393
|
-
const LabelEditTextField = ({
|
14394
|
-
label,
|
14395
|
-
placeholder,
|
14396
|
-
text,
|
14397
|
-
showText = true,
|
14398
|
-
highlightText,
|
14399
|
-
customError,
|
14400
|
-
confirmIcon,
|
14401
|
-
customErrorCondition,
|
14402
|
-
cancelIcon,
|
14403
|
-
variant = 'textField',
|
14404
|
-
onInputChange,
|
14405
|
-
dropdownData = [],
|
14406
|
-
// width,
|
14407
|
-
className,
|
14408
|
-
height,
|
14409
|
-
isOpen = false,
|
14410
|
-
confirmAction,
|
14411
|
-
onClick,
|
14412
|
-
tooltip
|
14413
|
-
}) => {
|
14414
|
-
const [isEditing, setIsEditing] = useState(isOpen ?? false);
|
14415
|
-
const [inputValue, setInputValue] = useState(text ?? '');
|
14416
|
-
const [dropdownValue, setDropdownValue] = useState(dropdownData[0]?.value ?? '');
|
14417
|
-
const [showError, setShowError] = useState('');
|
14418
|
-
const [disabled, isDisabled] = useState(true);
|
14419
|
-
const [isTextFieldModified, setIsTextFieldModified] = useState(false);
|
14420
|
-
const isThrowingError = showError && isEditing ? true : false;
|
14421
|
-
const containerRef = useRef(null);
|
14422
|
-
const cancelRef = useRef(null);
|
14423
|
-
const [clickTimeout, setClickTimeout] = useState(null);
|
14424
|
-
const handleEsc = useEscapeKey('Escape');
|
14425
|
-
useEffect(() => {
|
14426
|
-
return () => {
|
14427
|
-
if (clickTimeout) {
|
14428
|
-
clearTimeout(clickTimeout);
|
14429
|
-
}
|
14430
|
-
};
|
14431
|
-
}, [clickTimeout]);
|
14432
|
-
const handleDoubleClick = () => {
|
14433
|
-
if (clickTimeout) {
|
14434
|
-
clearTimeout(clickTimeout);
|
14435
|
-
setClickTimeout(null);
|
14436
|
-
}
|
14437
|
-
setIsEditing(true);
|
14438
|
-
setShowError('');
|
14439
|
-
};
|
14440
|
-
const handleSingleClick = () => {
|
14441
|
-
if (onClick) onClick();
|
14442
|
-
};
|
14443
|
-
const handleClick = () => {
|
14444
|
-
if (clickTimeout) {
|
14445
|
-
clearTimeout(clickTimeout);
|
14446
|
-
setClickTimeout(null);
|
14447
|
-
}
|
14448
|
-
const timeout = window.setTimeout(() => {
|
14449
|
-
handleSingleClick();
|
14450
|
-
setClickTimeout(null);
|
14451
|
-
}, 1000);
|
14452
|
-
setClickTimeout(timeout);
|
14453
|
-
};
|
14454
|
-
const handleConfirm = () => {
|
14455
|
-
let errorMessage = '';
|
14456
|
-
if (inputValue.length === 0 || inputValue.trim().length === 0) {
|
14457
|
-
errorMessage = 'Please type any text.';
|
14458
|
-
} else if (inputValue.length < 3) {
|
14459
|
-
errorMessage = 'Please enter at least 3 characters.';
|
14460
|
-
} else if (customErrorCondition) {
|
14461
|
-
errorMessage = customError ?? 'Invalid input.';
|
14462
|
-
}
|
14463
|
-
if (errorMessage) {
|
14464
|
-
setShowError(errorMessage);
|
14465
|
-
} else {
|
14466
|
-
setIsEditing(false);
|
14467
|
-
setShowError('');
|
14468
|
-
if (confirmAction) confirmAction(inputValue, dropdownValue);
|
14469
|
-
}
|
14470
|
-
};
|
14471
|
-
const handleCancel = () => {
|
14472
|
-
setInputValue(text ?? '');
|
14473
|
-
setDropdownValue(dropdownData[0]?.value ?? '');
|
14474
|
-
setIsEditing(false);
|
14475
|
-
setShowError('');
|
14476
|
-
setIsTextFieldModified(false);
|
14477
|
-
};
|
14478
|
-
const handleTextFieldChange = e => {
|
14479
|
-
const newValue = e.target.value;
|
14480
|
-
setInputValue(newValue);
|
14481
|
-
isDisabled(false);
|
14482
|
-
if (newValue.length === 0 || newValue.trim().length === 0) {
|
14483
|
-
setShowError('Please type any text.');
|
14484
|
-
} else if (newValue.length < 3) {
|
14485
|
-
setShowError('Please enter at least 3 characters.');
|
14486
|
-
} else if (customErrorCondition) {
|
14487
|
-
setShowError(customError ?? 'Invalid input.');
|
14488
|
-
} else {
|
14489
|
-
setShowError('');
|
14490
|
-
}
|
14491
|
-
setIsTextFieldModified(newValue !== text);
|
14492
|
-
if (onInputChange) {
|
14493
|
-
onInputChange(newValue);
|
14494
|
-
}
|
14495
|
-
};
|
14496
|
-
const handleBlur = e => {
|
14497
|
-
if (containerRef.current && !containerRef.current.contains(e.target) && cancelRef.current !== e.target) {
|
14498
|
-
const errorMessage = getErrorMessage$1(inputValue, text ?? '');
|
14499
|
-
if (errorMessage && isEditing) {
|
14500
|
-
setShowError(errorMessage);
|
14501
|
-
} else {
|
14502
|
-
setIsEditing(false);
|
14503
|
-
setShowError('');
|
14504
|
-
}
|
14505
|
-
}
|
14506
|
-
};
|
14507
|
-
useEffect(() => {
|
14508
|
-
document.addEventListener('click', handleBlur);
|
14509
|
-
return () => {
|
14510
|
-
document.removeEventListener('click', handleBlur);
|
14511
|
-
};
|
14512
|
-
}, [inputValue]);
|
14513
|
-
handleEsc(handleCancel);
|
14514
|
-
return jsxs("div", {
|
14515
|
-
className: "ff-label-edit-text-field",
|
14516
|
-
ref: containerRef,
|
14517
|
-
children: [isEditing ? jsxs("div", {
|
14518
|
-
className: "ff-label-text-field",
|
14519
|
-
children: [variant === 'textFieldWithDropdown' ? jsxs("div", {
|
14520
|
-
className: `ff-label-text-field-with-dropdown ${isEditing ? 'open' : ''}`,
|
14521
|
-
style: {
|
14522
|
-
height
|
14523
|
-
},
|
14524
|
-
children: [jsx(Input, {
|
14525
|
-
name: "input",
|
14526
|
-
type: "text",
|
14527
|
-
label: label ? label : '',
|
14528
|
-
disabled: false,
|
14529
|
-
error: isThrowingError,
|
14530
|
-
placeholder: placeholder ? placeholder : '',
|
14531
|
-
value: inputValue,
|
14532
|
-
onChange: handleTextFieldChange,
|
14533
|
-
className: `${className}
|
14534
|
-
|
14535
|
-
${isTextFieldModified ? 'modified' : ''}`
|
14536
|
-
}), jsx(Select$1, {
|
14537
|
-
label: '',
|
14538
|
-
optionsList: dropdownData,
|
14539
|
-
selectedOption: {
|
14540
|
-
value: dropdownValue,
|
14541
|
-
label: dropdownValue
|
14542
|
-
},
|
14543
|
-
onChange: option => setDropdownValue(option.value)
|
14544
|
-
})]
|
14545
|
-
}) : jsx("div", {
|
14546
|
-
className: "ff-label-text-field-without-dropdown",
|
14547
|
-
children: jsx(Input, {
|
14548
|
-
name: "input",
|
14549
|
-
type: "text",
|
14550
|
-
label: label ? label : '',
|
14551
|
-
disabled: false,
|
14552
|
-
placeholder: placeholder ? placeholder : '',
|
14553
|
-
value: inputValue,
|
14554
|
-
onChange: handleTextFieldChange,
|
14555
|
-
className: `${className}
|
14556
|
-
|
14557
|
-
${isTextFieldModified ? 'modified' : ''}`
|
14558
|
-
})
|
14559
|
-
}), jsxs("div", {
|
14560
|
-
className: "ff-icon-container",
|
14561
|
-
children: [confirmIcon && jsx(Icon, {
|
14562
|
-
color: "var(--label-edit-confirm-icon)",
|
14563
|
-
height: 20,
|
14564
|
-
width: 20,
|
14565
|
-
name: confirmIcon.name,
|
14566
|
-
disabled: disabled,
|
14567
|
-
className: `${disabled ? 'disabled-confirm-icon' : 'confirm-icon'}`,
|
14568
|
-
onClick: handleConfirm
|
14569
|
-
}), cancelIcon && jsx(Icon, {
|
14570
|
-
color: "var(--label-edit-cancel-icon)",
|
14571
|
-
height: 12,
|
14572
|
-
width: 20,
|
14573
|
-
name: cancelIcon.name,
|
14574
|
-
className: "cancel-icon",
|
14575
|
-
onClick: handleCancel,
|
14576
|
-
ref: cancelRef
|
14577
|
-
})]
|
14578
|
-
})]
|
14579
|
-
}) : jsx(Tooltip, {
|
14580
|
-
title: tooltip?.tooltipTitle ? tooltip?.tooltipTitle : '',
|
14581
|
-
placement: 'bottom',
|
14582
|
-
children: showText && jsx("span", {
|
14583
|
-
className: "display-text",
|
14584
|
-
onDoubleClick: handleDoubleClick,
|
14585
|
-
role: "button",
|
14586
|
-
onClick: handleClick,
|
14587
|
-
children: jsx(HighlightText, {
|
14588
|
-
text: inputValue,
|
14589
|
-
highlight: highlightText
|
14590
|
-
})
|
14591
|
-
})
|
14592
|
-
}), showError && isEditing && jsx(Typography, {
|
14593
|
-
as: "p",
|
14594
|
-
fontSize: 8,
|
14595
|
-
className: "error-text",
|
14596
|
-
children: showError
|
14597
|
-
})]
|
14598
|
-
});
|
14599
|
-
};
|
14600
|
-
|
14601
|
-
const renderSpaces = (level, parentSiblings = [], isLast) => {
|
14602
|
-
let siblingsArray = parentSiblings;
|
14603
|
-
let isLastNode = isLast;
|
14604
|
-
if (checkEmpty(parentSiblings)) {
|
14605
|
-
isLastNode = false;
|
14606
|
-
if (!isNaN(level)) {
|
14607
|
-
siblingsArray = Array(level).fill(true);
|
14608
|
-
}
|
14609
|
-
}
|
14610
|
-
return jsx("div", {
|
14611
|
-
className: "tree-table-space-container",
|
14612
|
-
children: siblingsArray?.reverse()?.map((line, i) => jsx("span", {
|
14613
|
-
className: `tree-table-space-block ${!line ? 'no-lines' : ''} ${isLastNode && i === level - 1 ? 'last-node' : ''}`
|
14614
|
-
}, i))
|
14615
|
-
});
|
14616
|
-
};
|
14617
|
-
const TableCell = /*#__PURE__*/React__default.memo(({
|
14618
|
-
col,
|
14619
|
-
node,
|
14620
|
-
selected,
|
14621
|
-
select,
|
14622
|
-
onCheckBoxChange,
|
14623
|
-
onToggleExpand,
|
14624
|
-
index
|
14625
|
-
}) => jsxs("td", {
|
14626
|
-
className: `${col.isTree && node.folder ? 'folder' : ''}`,
|
14627
|
-
children: [col.isTree && renderSpaces(node.hierarchy + 1, node.parentSiblings, node.last), jsxs("div", {
|
14628
|
-
className: "tree-title-container",
|
14629
|
-
children: [col.isTree && jsx("span", {
|
14630
|
-
className: `tree-table-space-block last-block ${node.expand ? 'tree-row-expanded' : 'tree-row-collapsed'} ${node.container ? '' : 'no-folder'}`,
|
14631
|
-
onClick: () => onToggleExpand(node),
|
14632
|
-
children: node.container && node?.resourceCount + node?.subContainerCount > 0 && jsxs("span", {
|
14633
|
-
onClick: () => onToggleExpand(node),
|
14634
|
-
children: [' ', jsx(SvgArrowsDownIcon, {})]
|
14635
|
-
})
|
14636
|
-
}), jsxs("span", {
|
14637
|
-
className: `tree-table-td-content ${col.isTree && node.folder ? 'folder' : ''}`,
|
14638
|
-
children: [!node?.showInput && jsxs(Fragment, {
|
14639
|
-
children: [col.isTree && select === 'checkbox' && jsx(Checkbox, {
|
14640
|
-
checked: node?.checked || false,
|
14641
|
-
partial: node?.checked === 'partial',
|
14642
|
-
onChange: e => onCheckBoxChange(e, node)
|
14643
|
-
}), col.isTree && select === 'radio' && jsx(RadioButton, {
|
14644
|
-
name: node.title,
|
14645
|
-
checked: selected.includes(node.id),
|
14646
|
-
value: node.id,
|
14647
|
-
onChange: e => onCheckBoxChange(e, node)
|
14648
|
-
})]
|
14649
|
-
}), node.showInput && col.isTree ? jsx(LabelEditTextField, {
|
14650
|
-
isOpen: true
|
14651
|
-
}) : jsx("span", {
|
14652
|
-
className: "tree-table-td-content-text",
|
14653
|
-
children: prepareData(node, col)
|
14654
|
-
})]
|
14655
|
-
})]
|
14656
|
-
}), col.actions && !node?.showInput && jsx("div", {
|
14657
|
-
className: "table-tree-row-action",
|
14658
|
-
children: col.actions(node, index)
|
14659
|
-
})]
|
14660
|
-
}));
|
14661
|
-
|
14662
|
-
const TableRow = /*#__PURE__*/React__default.memo(({
|
14663
|
-
node,
|
14664
|
-
columnsData,
|
14665
|
-
selected,
|
14666
|
-
select,
|
14667
|
-
onRowClick,
|
14668
|
-
onToggleExpand,
|
14669
|
-
onCheckBoxChange,
|
14670
|
-
index
|
14671
|
-
}) => jsx("tr", {
|
14672
|
-
"data-level": node.hierarchy,
|
14673
|
-
className: "show",
|
14674
|
-
onClick: e => onRowClick(e, node),
|
14675
|
-
children: columnsData.map(col => jsx(TableCell, {
|
14676
|
-
col: col,
|
14677
|
-
node: node,
|
14678
|
-
selected: selected,
|
14679
|
-
select: select,
|
14680
|
-
onCheckBoxChange: onCheckBoxChange,
|
14681
|
-
onToggleExpand: onToggleExpand,
|
14682
|
-
index: index
|
14683
|
-
}, col.name))
|
14684
|
-
}));
|
14685
|
-
|
14686
|
-
const TableBody = /*#__PURE__*/React__default.memo(({
|
14687
|
-
flattenedTreeData,
|
14688
|
-
columnsData,
|
14689
|
-
selected,
|
14690
|
-
select,
|
14691
|
-
onRowClick,
|
14692
|
-
onToggleExpand,
|
14693
|
-
onCheckBoxChange
|
14694
|
-
}) => checkEmpty(flattenedTreeData) ? null : jsxs("tbody", {
|
14695
|
-
className: "ff-table-tree-body",
|
14696
|
-
children: [jsx("tr", {
|
14697
|
-
id: "ff-table-tree-first-node"
|
14698
|
-
}), flattenedTreeData?.map((node, index) => {
|
14699
|
-
return jsx(TableRow, {
|
14700
|
-
node: node,
|
14701
|
-
columnsData: columnsData,
|
14702
|
-
selected: selected,
|
14703
|
-
select: select,
|
14704
|
-
onRowClick: onRowClick,
|
14705
|
-
onToggleExpand: node => onToggleExpand(node, index),
|
14706
|
-
onCheckBoxChange: onCheckBoxChange,
|
14707
|
-
index: index
|
14708
|
-
}, node.key);
|
14709
|
-
}), jsx("tr", {
|
14710
|
-
id: "ff-table-tree-last-node"
|
14711
|
-
})]
|
14712
|
-
}));
|
14713
|
-
|
14714
|
-
const TreeTable = ({
|
14715
|
-
treeData,
|
14716
|
-
columnsData,
|
14717
|
-
selected = [],
|
14718
|
-
select = null,
|
14719
|
-
onChange,
|
14720
|
-
onClick,
|
14721
|
-
onExpand,
|
14722
|
-
loadMore = () => {},
|
14723
|
-
tableBorder,
|
14724
|
-
height = 'auto'
|
14725
|
-
}) => {
|
14726
|
-
// const treeRef = useRef(null);
|
14727
|
-
useIntersectionObserver(['ff-table-tree-last-node', 'ff-table-tree-first-node'], {
|
14728
|
-
root: document.getElementById('ff-table-tree-scroll-container'),
|
14729
|
-
rootMargin: '8px',
|
14730
|
-
threshold: 0.1,
|
14731
|
-
onIntersect: entry => {
|
14732
|
-
if (entry.isIntersecting) {
|
14733
|
-
if (loadMore) {
|
14734
|
-
let direction = 'above';
|
14735
|
-
if (entry.target.id === 'ff-table-tree-last-node') {
|
14736
|
-
direction = 'below';
|
14737
|
-
}
|
14738
|
-
loadMore(direction);
|
14739
|
-
}
|
14740
|
-
}
|
14741
|
-
}
|
14742
|
-
});
|
14743
|
-
const handleToggleExpand = useCallback((node, index) => onExpand?.(node, index), [onExpand]);
|
14744
|
-
const handleCheckBoxChange = useCallback((e, node) => {
|
14745
|
-
onChange?.(e, node);
|
14746
|
-
}, [onChange]);
|
14747
|
-
const handleRowClick = useCallback((e, node) => onClick?.(e, node), [onClick]);
|
14748
|
-
return jsx("div", {
|
14749
|
-
className: "tree-table-wrap",
|
14750
|
-
children: jsx("div", {
|
14751
|
-
className: "table-scrollable",
|
14752
|
-
id: "ff-table-tree-scroll-container",
|
14753
|
-
// ref={treeRef}
|
14754
|
-
style: {
|
14755
|
-
'--table-height': `${height !== 'auto' ? height + 'px' : height}`,
|
14756
|
-
border: tableBorder
|
14757
|
-
},
|
14758
|
-
children: jsxs("table", {
|
14759
|
-
className: "tree-table",
|
14760
|
-
children: [jsx(TableHead, {
|
14761
|
-
columnsData: columnsData
|
14762
|
-
}), jsx(TableBody, {
|
14763
|
-
flattenedTreeData: treeData,
|
14764
|
-
columnsData: columnsData,
|
14765
|
-
selected: selected,
|
14766
|
-
select: select,
|
14767
|
-
onRowClick: handleRowClick,
|
14768
|
-
onToggleExpand: handleToggleExpand,
|
14769
|
-
onCheckBoxChange: handleCheckBoxChange
|
14770
|
-
})]
|
14771
|
-
})
|
14772
|
-
})
|
14773
|
-
});
|
14774
|
-
};
|
14775
|
-
var TableTree = /*#__PURE__*/memo(TreeTable);
|
14776
|
-
|
14777
|
-
var css_248z$M = ":root {\n --tooltip-bg-color: #1e161f;\n --status-approved-text-color: #016102;\n --status-warning-text-color: #ff8b00;\n --status-rejected-text-color: #c60202;\n --status-skipped-text-color: #3c3838;\n --status-approved-bg-color: #c6efcd;\n --status-rejected-bg-color: #f7d9d9;\n --status-warning-bg-color: #fae2c6;\n --status-skipped-bg-color: #c4c3c3;\n --brand-color: #71347b;\n --icons-default-color: #71347b;\n --default-icon-color: #a3a3a3;\n --default-color: #747474;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --system-color--error: #c50303;\n --hover-color: #f7ebff;\n --brand2-color: #610b86;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --description-text-color: #d9d9d9;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --text-color: #1e161f;\n --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --error-light: #e42525;\n --tabs-label-default-color: tabs-label-default-color;\n --tabs-label-active-color: tabs-label-active-color;\n --tabs-border-color: tabs-border-color;\n --tabs-bg-color: tabs-bg-color;\n --tab-bg-color: tab-bg-color;\n --toggle-button-bg-color: #ffffff;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-strip-color: #cfd1e2;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --toggle-strip-color: #cfd1e2;\n --add-icon-hover-color: #431b4a;\n --arrows-button-border-color: #ded1e5;\n --arrow-button-bg-color: #ffffff;\n --text-bg-highlight: #f5fb00;\n --slider-table-color: #efe1f9;\n --variable-dropdown-bg: #($variable-dropdown-bg);\n --dataset-tooltip-title: #($dataset-tooltip-title),\n --dataset-tooltip-value: #($dataset-tooltip-value), ;\n}\n\n.fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-tabs-container {\n box-sizing: border-box;\n}\n.ff-tabs-container .ff-tab-row {\n flex: 0 1 auto;\n}\n.ff-tabs-container .ff-tab-row--default {\n display: flex;\n gap: 8px;\n border-radius: 8px 8px 0 0;\n padding: 6px 8px 0;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default {\n position: relative;\n border: none;\n background: none;\n padding: 0 8px;\n display: flex;\n flex-direction: column;\n gap: 4px;\n cursor: pointer;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .label-count-section {\n display: flex;\n align-items: center;\n gap: 5px;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .label-count-section .tab-count {\n background-color: var(--input-default-label-color);\n color: var(--tab-bg-color);\n height: 12px;\n border-radius: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 8px;\n font-weight: 600;\n padding: 0 2px;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .label-count-section .tab-count--active {\n background-color: var(--tabs-label-active-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .ff-tab-bar {\n width: 100%;\n border-radius: 2px 2px 0 0;\n border-color: var(--input-default-label-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .ff-tab-bar--active {\n border-top: 2px solid var(--tabs-label-active-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .ff-tab-bar {\n border-top: 2px solid var(--input-hover-border-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .ff-tab-bar--active {\n border-top: 2px solid var(--tabs-label-active-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .ff-tab-label {\n color: var(--input-hover-border-color) !important;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .ff-tab-label--active {\n color: var(--tabs-label-active-color) !important;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .tab-count {\n background-color: var(--input-hover-border-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default:hover .tab-count--active {\n background-color: var(--tabs-label-active-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default.disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.ff-tabs-container .ff-tab-row--capsule {\n display: flex;\n gap: 8px;\n border: 1px solid var(--tabs-border-color);\n border-radius: 8px;\n padding: 3px 4px;\n background-color: var(--tabs-bg-color);\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule {\n background: transparent;\n border: none;\n padding: 3px 4px;\n border-radius: 4px;\n cursor: pointer;\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule:hover .ff-tab-label {\n color: var(--input-hover-border-color) !important;\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule:hover .ff-tab-label--active {\n color: var(--tabs-label-active-color) !important;\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule.active {\n background-color: var(--tab-bg-color);\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule .ff-tab-bar {\n display: none;\n}\n.ff-tabs-container .ff-tab-row--no-border {\n border: none;\n}\n.ff-tabs-container .ff-tab-row--no-padding {\n border-radius: 8px;\n background: white;\n padding: 0px;\n justify-content: flex-start;\n margin-right: 8px;\n}\n.ff-tabs-container .ff-tab-row--no-padding .ff-tab-button--capsule {\n background: transparent;\n border: none;\n padding: 3px 4px;\n border-radius: 7px;\n cursor: pointer;\n}\n.ff-tabs-container .ff-tab-row--no-padding .ff-tab-button--capsule:hover .ff-tab-label {\n color: var(--input-hover-border-color) !important;\n}\n.ff-tabs-container .ff-tab-row--no-padding .ff-tab-button--capsule:hover .ff-tab-label--active {\n color: var(--tabs-label-active-color) !important;\n}\n.ff-tabs-container .ff-tab-row--no-padding .ff-tab-button--capsule.active {\n background-color: var(--slider-table-color);\n}\n.ff-tabs-container .ff-tab-row--no-padding .ff-tab-button--capsule .ff-tab-bar {\n display: none;\n}\n.ff-tabs-container .ff-tab-content {\n width: inherit;\n}\n.ff-tabs-container .ff-defaultStatus {\n position: absolute;\n top: 2px;\n right: 0px;\n width: 6px;\n height: 6px;\n background-color: transparent;\n border-radius: 50%;\n}\n.ff-tabs-container .ff-defaultStatus.ff-successStatus {\n background-color: var(--confirm-tick-icon-color);\n box-shadow: 0px 1px 1px 0px var(--toggle-strip-shadow);\n}\n.ff-tabs-container .ff-defaultStatus.ff-dangerStatus {\n background-color: var(--delete-text-color);\n box-shadow: 0px 1px 1px 0px var(--toggle-strip-shadow);\n}";
|
14807
|
+
var css_248z$M = ".fontXs, .ff-search-container .ff-search-input {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-search-container {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.ff-search-container .ff-search-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border-radius: 4px;\n}\n.ff-search-container .ff-search-icon:hover {\n background-color: var(--ff-search-field-hover-color);\n}\n.ff-search-container .ff-search-icon .ff-icon-container svg path {\n fill: var(--brand-color);\n}\n.ff-search-container .ff-search-input {\n border: none;\n color: var(--tooltip-bg-color);\n line-height: 12px;\n visibility: hidden;\n transition: width 0.4s ease;\n}\n.ff-search-container .ff-search-input:focus {\n outline: none;\n border: none;\n}\n.ff-search-container .ff-search-input:hover {\n border: none;\n}\n.ff-search-container.disabled {\n opacity: 0.5;\n}\n.ff-search-container.expanded {\n border: 1px solid var(--border-color);\n border-radius: 4px;\n background-color: var(--ff-search-filed-bg-color);\n}\n.ff-search-container.expanded .ff-search-icon:hover {\n background-color: var(--ff-search-filed-bg-color);\n}\n.ff-search-container.expanded .ff-vertical-line {\n height: 8px;\n width: 1px;\n border-radius: 1px;\n background-color: var(--border-color);\n}\n.ff-search-container.expanded .ff-search-input {\n visibility: visible;\n margin-left: 4px;\n}\n.ff-search-container.expanded .ff-search-input::placeholder {\n color: var(--ff-search-filed-placeholder-text);\n}\n.ff-search-container.expanded .ff-search-icon {\n border: none;\n cursor: default;\n margin-right: 4px;\n}\n.ff-search-container.expanded .ff-search-clear-button {\n display: grid;\n place-items: center;\n cursor: pointer;\n width: 22px;\n padding-top: 1px;\n}\n.ff-search-container.expanded .ff-search-clear-button.showClose {\n display: none;\n}\n.ff-search-container.expanded .ff-search-close-icon {\n margin: 4px;\n cursor: pointer;\n}\n.ff-search-container.expanded .ff-search-close-icon.showClose {\n display: none;\n}\n.ff-search-container.expanded .ff-search-close-icon .ff-icon-container svg path {\n fill: var(--ff-search-filed-close-Icon);\n}";
|
14778
14808
|
styleInject(css_248z$M);
|
14779
14809
|
|
14780
|
-
const Tabs = ({
|
14781
|
-
variant = 'default',
|
14782
|
-
tabsData,
|
14783
|
-
activeTabId,
|
14784
|
-
onTabClick,
|
14785
|
-
noBorder = false,
|
14786
|
-
noPadding = false
|
14787
|
-
}) => {
|
14788
|
-
return jsxs("div", {
|
14789
|
-
className: `ff-tabs-container`,
|
14790
|
-
children: [jsx("div", {
|
14791
|
-
className: classNames(`ff-tab-row--${variant}`, {
|
14792
|
-
'ff-tab-row--no-border': noBorder,
|
14793
|
-
'ff-tab-row--no-padding': noPadding
|
14794
|
-
}),
|
14795
|
-
children: tabsData.map(tab => jsxs("button", {
|
14796
|
-
onClick: () => !tab.disabled && onTabClick(tab.id),
|
14797
|
-
disabled: tab.disabled,
|
14798
|
-
className: classNames(`ff-tab-button--${variant}`, {
|
14799
|
-
disabled: tab.disabled,
|
14800
|
-
active: activeTabId === tab.id
|
14801
|
-
}),
|
14802
|
-
children: [jsxs("div", {
|
14803
|
-
className: "label-count-section",
|
14804
|
-
children: [jsx(Typography, {
|
14805
|
-
children: tab.label,
|
14806
|
-
lineHeight: "18px",
|
14807
|
-
fontWeight: activeTabId === tab.id ? 'semi-bold' : 'regular',
|
14808
|
-
color: activeTabId === tab.id ? 'var(--tabs-label-active-color)' : 'var(--tabs-label-default-color)',
|
14809
|
-
className: classNames('ff-tab-label', {
|
14810
|
-
'ff-tab-label--active': activeTabId === tab.id
|
14811
|
-
})
|
14812
|
-
}), variant === 'default' && tab.count && jsx("span", {
|
14813
|
-
className: classNames('tab-count', {
|
14814
|
-
'tab-count--active': activeTabId === tab.id
|
14815
|
-
}),
|
14816
|
-
children: tab.count
|
14817
|
-
})]
|
14818
|
-
}), jsx("div", {
|
14819
|
-
className: classNames('ff-tab-bar', {
|
14820
|
-
'ff-tab-bar--active': activeTabId === tab.id
|
14821
|
-
})
|
14822
|
-
}), jsx("span", {
|
14823
|
-
className: `ff-defaultStatus ${tab.status === 'success' ? 'ff-successStatus' : tab.status === 'error' ? 'ff-dangerStatus' : ''}`
|
14824
|
-
})]
|
14825
|
-
}, tab.id))
|
14826
|
-
}), jsx("div", {
|
14827
|
-
className: `ff-tab-content`,
|
14828
|
-
children: tabsData.find(tab => tab.id === activeTabId)?.component
|
14829
|
-
})]
|
14830
|
-
});
|
14831
|
-
};
|
14832
|
-
|
14833
|
-
var css_248z$L = ".fontXs, .ff-search-container .ff-search-input {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-search-container {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.ff-search-container .ff-search-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border-radius: 4px;\n}\n.ff-search-container .ff-search-icon:hover {\n background-color: var(--ff-search-field-hover-color);\n}\n.ff-search-container .ff-search-icon .ff-icon-container svg path {\n fill: var(--brand-color);\n}\n.ff-search-container .ff-search-input {\n border: none;\n color: var(--tooltip-bg-color);\n line-height: 12px;\n visibility: hidden;\n transition: width 0.4s ease;\n}\n.ff-search-container .ff-search-input:focus {\n outline: none;\n border: none;\n}\n.ff-search-container .ff-search-input:hover {\n border: none;\n}\n.ff-search-container.disabled {\n opacity: 0.5;\n}\n.ff-search-container.expanded {\n border: 1px solid var(--border-color);\n border-radius: 4px;\n background-color: var(--ff-search-filed-bg-color);\n}\n.ff-search-container.expanded .ff-search-icon:hover {\n background-color: var(--ff-search-filed-bg-color);\n}\n.ff-search-container.expanded .ff-vertical-line {\n height: 8px;\n width: 1px;\n border-radius: 1px;\n background-color: var(--border-color);\n}\n.ff-search-container.expanded .ff-search-input {\n visibility: visible;\n margin-left: 4px;\n}\n.ff-search-container.expanded .ff-search-input::placeholder {\n color: var(--ff-search-filed-placeholder-text);\n}\n.ff-search-container.expanded .ff-search-icon {\n border: none;\n cursor: default;\n margin-right: 4px;\n}\n.ff-search-container.expanded .ff-search-clear-button {\n display: grid;\n place-items: center;\n cursor: pointer;\n width: 22px;\n padding-top: 1px;\n}\n.ff-search-container.expanded .ff-search-clear-button.showClose {\n display: none;\n}\n.ff-search-container.expanded .ff-search-close-icon {\n margin: 4px;\n cursor: pointer;\n}\n.ff-search-container.expanded .ff-search-close-icon.showClose {\n display: none;\n}\n.ff-search-container.expanded .ff-search-close-icon .ff-icon-container svg path {\n fill: var(--ff-search-filed-close-Icon);\n}";
|
14834
|
-
styleInject(css_248z$L);
|
14835
|
-
|
14836
14810
|
const Search = ({
|
14837
14811
|
placeholder = 'Search',
|
14838
14812
|
onSearch,
|
@@ -18317,6 +18291,53 @@ function setYear(date, year, options) {
|
|
18317
18291
|
return date_;
|
18318
18292
|
}
|
18319
18293
|
|
18294
|
+
const FIVE_WEEKS = 5;
|
18295
|
+
const FOUR_WEEKS = 4;
|
18296
|
+
/**
|
18297
|
+
* Return the number of weeks to display in the broadcast calendar.
|
18298
|
+
*
|
18299
|
+
* @since 9.4.0
|
18300
|
+
*/
|
18301
|
+
function getBroadcastWeeksInMonth(month, dateLib) {
|
18302
|
+
// Get the first day of the month
|
18303
|
+
const firstDayOfMonth = dateLib.startOfMonth(month);
|
18304
|
+
// Get the day of the week for the first day of the month (1-7, where 1 is Monday)
|
18305
|
+
const firstDayOfWeek = firstDayOfMonth.getDay() > 0 ? firstDayOfMonth.getDay() : 7;
|
18306
|
+
const broadcastStartDate = dateLib.addDays(month, -firstDayOfWeek + 1);
|
18307
|
+
const lastDateOfLastWeek = dateLib.addDays(broadcastStartDate, FIVE_WEEKS * 7 - 1);
|
18308
|
+
const numberOfWeeks = month.getMonth() === lastDateOfLastWeek.getMonth() ? FIVE_WEEKS : FOUR_WEEKS;
|
18309
|
+
return numberOfWeeks;
|
18310
|
+
}
|
18311
|
+
|
18312
|
+
/**
|
18313
|
+
* Return the start date of the week in the broadcast calendar.
|
18314
|
+
*
|
18315
|
+
* @since 9.4.0
|
18316
|
+
*/
|
18317
|
+
function startOfBroadcastWeek(date, dateLib) {
|
18318
|
+
const firstOfMonth = dateLib.startOfMonth(date);
|
18319
|
+
const dayOfWeek = firstOfMonth.getDay();
|
18320
|
+
if (dayOfWeek === 1) {
|
18321
|
+
return firstOfMonth;
|
18322
|
+
} else if (dayOfWeek === 0) {
|
18323
|
+
return dateLib.addDays(firstOfMonth, -1 * 6);
|
18324
|
+
} else {
|
18325
|
+
return dateLib.addDays(firstOfMonth, -1 * (dayOfWeek - 1));
|
18326
|
+
}
|
18327
|
+
}
|
18328
|
+
|
18329
|
+
/**
|
18330
|
+
* Return the end date of the week in the broadcast calendar.
|
18331
|
+
*
|
18332
|
+
* @since 9.4.0
|
18333
|
+
*/
|
18334
|
+
function endOfBroadcastWeek(date, dateLib) {
|
18335
|
+
const startDate = startOfBroadcastWeek(date, dateLib);
|
18336
|
+
const numberOfWeeks = getBroadcastWeeksInMonth(date, dateLib);
|
18337
|
+
const endDate = dateLib.addDays(startDate, numberOfWeeks * 7 - 1);
|
18338
|
+
return endDate;
|
18339
|
+
}
|
18340
|
+
|
18320
18341
|
/**
|
18321
18342
|
* A wrapper class around [date-fns](http://date-fns.org) sharing the same
|
18322
18343
|
* options. Methods of this class can be overridden using the
|
@@ -18397,6 +18418,15 @@ class DateLib {
|
|
18397
18418
|
this.differenceInCalendarMonths = (dateLeft, dateRight) => {
|
18398
18419
|
return this.overrides?.differenceInCalendarMonths ? this.overrides.differenceInCalendarMonths(dateLeft, dateRight) : differenceInCalendarMonths(dateLeft, dateRight);
|
18399
18420
|
};
|
18421
|
+
/**
|
18422
|
+
* Returns the end of the broadcast week for the given date.
|
18423
|
+
*
|
18424
|
+
* @param date The original date.
|
18425
|
+
* @returns The end of the broadcast week.
|
18426
|
+
*/
|
18427
|
+
this.endOfBroadcastWeek = date => {
|
18428
|
+
return this.overrides?.endOfBroadcastWeek ? this.overrides.endOfBroadcastWeek(date, this) : endOfBroadcastWeek(date, this);
|
18429
|
+
};
|
18400
18430
|
/**
|
18401
18431
|
* Returns the end of the ISO week for the given date.
|
18402
18432
|
*
|
@@ -18558,6 +18588,15 @@ class DateLib {
|
|
18558
18588
|
this.setYear = (date, year) => {
|
18559
18589
|
return this.overrides?.setYear ? this.overrides.setYear(date, year) : setYear(date, year);
|
18560
18590
|
};
|
18591
|
+
/**
|
18592
|
+
* Returns the start of the broadcast week for the given date.
|
18593
|
+
*
|
18594
|
+
* @param date The original date.
|
18595
|
+
* @returns The start of the broadcast week.
|
18596
|
+
*/
|
18597
|
+
this.startOfBroadcastWeek = date => {
|
18598
|
+
return this.overrides?.startOfBroadcastWeek ? this.overrides.startOfBroadcastWeek(date, this) : startOfBroadcastWeek(date, this);
|
18599
|
+
};
|
18561
18600
|
/**
|
18562
18601
|
* Returns the start of the day for the given date.
|
18563
18602
|
*
|
@@ -19040,7 +19079,9 @@ function Weekday(props) {
|
|
19040
19079
|
* @see https://daypicker.dev/guides/custom-components
|
19041
19080
|
*/
|
19042
19081
|
function Weekdays(props) {
|
19043
|
-
return /*#__PURE__*/React__default.createElement("thead",
|
19082
|
+
return /*#__PURE__*/React__default.createElement("thead", {
|
19083
|
+
"aria-hidden": true
|
19084
|
+
}, /*#__PURE__*/React__default.createElement("tr", {
|
19044
19085
|
...props
|
19045
19086
|
}));
|
19046
19087
|
}
|
@@ -19143,7 +19184,8 @@ function getDataAttributes(props) {
|
|
19143
19184
|
"data-mode": props.mode ?? undefined,
|
19144
19185
|
"data-required": "required" in props ? props.required : undefined,
|
19145
19186
|
"data-multiple-months": props.numberOfMonths && props.numberOfMonths > 1 || undefined,
|
19146
|
-
"data-week-numbers": props.showWeekNumber || undefined
|
19187
|
+
"data-week-numbers": props.showWeekNumber || undefined,
|
19188
|
+
"data-broadcast-calendar": props.broadcastCalendar || undefined
|
19147
19189
|
};
|
19148
19190
|
Object.entries(props).forEach(([key, val]) => {
|
19149
19191
|
if (key.startsWith("data-")) {
|
@@ -19209,7 +19251,7 @@ function formatDay(date, options, dateLib) {
|
|
19209
19251
|
*/
|
19210
19252
|
function formatMonthDropdown(/** The month number to format. */
|
19211
19253
|
monthNumber, /** The locale to use for formatting. */
|
19212
|
-
locale
|
19254
|
+
locale) {
|
19213
19255
|
return locale.localize?.month(monthNumber);
|
19214
19256
|
}
|
19215
19257
|
|
@@ -19299,13 +19341,12 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
|
|
19299
19341
|
if (!navEnd) return undefined;
|
19300
19342
|
const {
|
19301
19343
|
addMonths,
|
19302
|
-
startOfMonth
|
19303
|
-
isBefore
|
19344
|
+
startOfMonth
|
19304
19345
|
} = dateLib;
|
19305
19346
|
const year = displayMonth.getFullYear();
|
19306
19347
|
const months = [];
|
19307
19348
|
let month = navStart;
|
19308
|
-
while (months.length < 12
|
19349
|
+
while (months.length < 12) {
|
19309
19350
|
months.push(month.getMonth());
|
19310
19351
|
month = addMonths(month, 1);
|
19311
19352
|
}
|
@@ -19313,7 +19354,7 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
|
|
19313
19354
|
return a - b;
|
19314
19355
|
});
|
19315
19356
|
const options = sortedMonths.map(value => {
|
19316
|
-
const label = formatters.formatMonthDropdown(value, dateLib.options.locale);
|
19357
|
+
const label = formatters.formatMonthDropdown(value, dateLib.options.locale ?? enUS$1);
|
19317
19358
|
const month = dateLib.Date ? new dateLib.Date(year, value) : new Date(year, value);
|
19318
19359
|
const disabled = navStart && month < startOfMonth(navStart) || navEnd && month > startOfMonth(navEnd) || false;
|
19319
19360
|
return {
|
@@ -19688,7 +19729,8 @@ function tzName(tz, date) {
|
|
19688
19729
|
*/
|
19689
19730
|
function getWeekdays(/** The date library. */
|
19690
19731
|
dateLib, /** Use ISOWeek instead of locale/ */
|
19691
|
-
ISOWeek, timeZone
|
19732
|
+
ISOWeek, timeZone, /** @since 9.4.0 */
|
19733
|
+
broadcastCalendar) {
|
19692
19734
|
const date = timeZone ? TZDate.tz(timeZone) : dateLib.Date ? new dateLib.Date() : new Date();
|
19693
19735
|
const start = ISOWeek ? dateLib.startOfISOWeek(date) : dateLib.startOfWeek(date);
|
19694
19736
|
const days = [];
|
@@ -19700,20 +19742,18 @@ ISOWeek, timeZone) {
|
|
19700
19742
|
}
|
19701
19743
|
|
19702
19744
|
/** Return the years to show in the dropdown. */
|
19703
|
-
function getYearOptions(
|
19704
|
-
if (!
|
19705
|
-
if (!
|
19745
|
+
function getYearOptions(navStart, navEnd, formatters, dateLib) {
|
19746
|
+
if (!navStart) return undefined;
|
19747
|
+
if (!navEnd) return undefined;
|
19706
19748
|
const {
|
19707
|
-
startOfMonth,
|
19708
19749
|
startOfYear,
|
19709
19750
|
endOfYear,
|
19710
19751
|
addYears,
|
19711
19752
|
isBefore,
|
19712
19753
|
isSameYear
|
19713
19754
|
} = dateLib;
|
19714
|
-
const
|
19715
|
-
const
|
19716
|
-
const lastNavYear = endOfYear(calendarEnd);
|
19755
|
+
const firstNavYear = startOfYear(navStart);
|
19756
|
+
const lastNavYear = endOfYear(navEnd);
|
19717
19757
|
const years = [];
|
19718
19758
|
let year = firstNavYear;
|
19719
19759
|
while (isBefore(year, lastNavYear) || isSameYear(year, lastNavYear)) {
|
@@ -19721,13 +19761,11 @@ function getYearOptions(displayMonth, calendarStart, calendarEnd, formatters, da
|
|
19721
19761
|
year = addYears(year, 1);
|
19722
19762
|
}
|
19723
19763
|
return years.map(value => {
|
19724
|
-
const year = dateLib.Date ? new dateLib.Date(value, month) : new Date(value, month);
|
19725
|
-
const disabled = calendarStart && year < startOfMonth(calendarStart) || month && calendarEnd && year > startOfMonth(calendarEnd) || false;
|
19726
19764
|
const label = formatters.formatYearDropdown(value);
|
19727
19765
|
return {
|
19728
19766
|
value,
|
19729
19767
|
label,
|
19730
|
-
disabled
|
19768
|
+
disabled: false
|
19731
19769
|
};
|
19732
19770
|
});
|
19733
19771
|
}
|
@@ -19891,29 +19929,30 @@ var defaultLabels = /*#__PURE__*/Object.freeze({
|
|
19891
19929
|
labelYearDropdown: labelYearDropdown
|
19892
19930
|
});
|
19893
19931
|
|
19894
|
-
/** The number of days in a month when having 6 weeks. */
|
19895
|
-
const NrOfDaysWithFixedWeeks = 42;
|
19896
19932
|
/** Return all the dates to display in the calendar. */
|
19897
19933
|
function getDates(displayMonths, maxDate, props, dateLib) {
|
19898
19934
|
const firstMonth = displayMonths[0];
|
19899
19935
|
const lastMonth = displayMonths[displayMonths.length - 1];
|
19900
19936
|
const {
|
19901
19937
|
ISOWeek,
|
19902
|
-
fixedWeeks
|
19938
|
+
fixedWeeks,
|
19939
|
+
broadcastCalendar
|
19903
19940
|
} = props ?? {};
|
19904
19941
|
const {
|
19905
|
-
startOfWeek,
|
19906
|
-
endOfWeek,
|
19907
|
-
startOfISOWeek,
|
19908
|
-
endOfISOWeek,
|
19909
19942
|
addDays,
|
19910
19943
|
differenceInCalendarDays,
|
19911
19944
|
differenceInCalendarMonths,
|
19945
|
+
endOfBroadcastWeek,
|
19946
|
+
endOfISOWeek,
|
19947
|
+
endOfMonth,
|
19948
|
+
endOfWeek,
|
19912
19949
|
isAfter,
|
19913
|
-
|
19950
|
+
startOfBroadcastWeek,
|
19951
|
+
startOfISOWeek,
|
19952
|
+
startOfWeek
|
19914
19953
|
} = dateLib;
|
19915
|
-
const startWeekFirstDate = ISOWeek ? startOfISOWeek(firstMonth) : startOfWeek(firstMonth);
|
19916
|
-
const endWeekLastDate = ISOWeek ? endOfISOWeek(endOfMonth(lastMonth)) : endOfWeek(endOfMonth(lastMonth));
|
19954
|
+
const startWeekFirstDate = broadcastCalendar ? startOfBroadcastWeek(firstMonth, dateLib) : ISOWeek ? startOfISOWeek(firstMonth) : startOfWeek(firstMonth);
|
19955
|
+
const endWeekLastDate = broadcastCalendar ? endOfBroadcastWeek(lastMonth, dateLib) : ISOWeek ? endOfISOWeek(endOfMonth(lastMonth)) : endOfWeek(endOfMonth(lastMonth));
|
19917
19956
|
const nOfDays = differenceInCalendarDays(endWeekLastDate, startWeekFirstDate);
|
19918
19957
|
const nOfMonths = differenceInCalendarMonths(lastMonth, firstMonth) + 1;
|
19919
19958
|
const dates = [];
|
@@ -19925,9 +19964,11 @@ function getDates(displayMonths, maxDate, props, dateLib) {
|
|
19925
19964
|
dates.push(date);
|
19926
19965
|
}
|
19927
19966
|
// If fixed weeks is enabled, add the extra dates to the array
|
19928
|
-
const
|
19967
|
+
const nrOfDaysWithFixedWeeks = broadcastCalendar ? 35 : 42;
|
19968
|
+
const extraDates = nrOfDaysWithFixedWeeks * nOfMonths;
|
19929
19969
|
if (fixedWeeks && dates.length < extraDates) {
|
19930
|
-
|
19970
|
+
const daysToAdd = extraDates - dates.length;
|
19971
|
+
for (let i = 0; i < daysToAdd; i++) {
|
19931
19972
|
const date = addDays(dates[dates.length - 1], 1);
|
19932
19973
|
dates.push(date);
|
19933
19974
|
}
|
@@ -20038,25 +20079,29 @@ displayMonths, /** The dates to display in the calendar. */
|
|
20038
20079
|
dates, /** Options from the props context. */
|
20039
20080
|
props, dateLib) {
|
20040
20081
|
const {
|
20041
|
-
|
20042
|
-
|
20043
|
-
startOfISOWeek,
|
20082
|
+
addDays,
|
20083
|
+
endOfBroadcastWeek,
|
20044
20084
|
endOfISOWeek,
|
20045
20085
|
endOfMonth,
|
20046
|
-
|
20086
|
+
endOfWeek,
|
20087
|
+
getISOWeek,
|
20047
20088
|
getWeek,
|
20048
|
-
|
20089
|
+
startOfBroadcastWeek,
|
20090
|
+
startOfISOWeek,
|
20091
|
+
startOfWeek
|
20049
20092
|
} = dateLib;
|
20050
20093
|
const dayPickerMonths = displayMonths.reduce((months, month) => {
|
20051
|
-
const firstDateOfFirstWeek = props.ISOWeek ? startOfISOWeek(month) : startOfWeek(month);
|
20052
|
-
const lastDateOfLastWeek = props.ISOWeek ? endOfISOWeek(endOfMonth(month)) : endOfWeek(endOfMonth(month));
|
20094
|
+
const firstDateOfFirstWeek = props.broadcastCalendar ? startOfBroadcastWeek(month, dateLib) : props.ISOWeek ? startOfISOWeek(month) : startOfWeek(month);
|
20095
|
+
const lastDateOfLastWeek = props.broadcastCalendar ? endOfBroadcastWeek(month, dateLib) : props.ISOWeek ? endOfISOWeek(endOfMonth(month)) : endOfWeek(endOfMonth(month));
|
20053
20096
|
/** The dates to display in the month. */
|
20054
20097
|
const monthDates = dates.filter(date => {
|
20055
20098
|
return date >= firstDateOfFirstWeek && date <= lastDateOfLastWeek;
|
20056
20099
|
});
|
20057
|
-
|
20100
|
+
const nrOfDaysWithFixedWeeks = props.broadcastCalendar ? 35 : 42;
|
20101
|
+
if (props.fixedWeeks && monthDates.length < nrOfDaysWithFixedWeeks) {
|
20058
20102
|
const extraDates = dates.filter(date => {
|
20059
|
-
|
20103
|
+
const daysToAdd = nrOfDaysWithFixedWeeks - monthDates.length;
|
20104
|
+
return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, daysToAdd);
|
20060
20105
|
});
|
20061
20106
|
monthDates.push(...extraDates);
|
20062
20107
|
}
|
@@ -20494,27 +20539,30 @@ function dateMatchModifiers(date, matchers, dateLib = defaultDateLib) {
|
|
20494
20539
|
/** Return the next date that should be focused. */
|
20495
20540
|
function getFocusableDate(moveBy, moveDir, refDate, navStart, navEnd, props, dateLib) {
|
20496
20541
|
const {
|
20497
|
-
ISOWeek
|
20542
|
+
ISOWeek,
|
20543
|
+
broadcastCalendar
|
20498
20544
|
} = props;
|
20499
20545
|
const {
|
20500
20546
|
addDays,
|
20501
20547
|
addMonths,
|
20502
|
-
addYears,
|
20503
20548
|
addWeeks,
|
20504
|
-
|
20549
|
+
addYears,
|
20550
|
+
endOfBroadcastWeek,
|
20505
20551
|
endOfISOWeek,
|
20506
|
-
startOfWeek,
|
20507
20552
|
endOfWeek,
|
20508
20553
|
max,
|
20509
|
-
min
|
20554
|
+
min,
|
20555
|
+
startOfBroadcastWeek,
|
20556
|
+
startOfISOWeek,
|
20557
|
+
startOfWeek
|
20510
20558
|
} = dateLib;
|
20511
20559
|
const moveFns = {
|
20512
20560
|
day: addDays,
|
20513
20561
|
week: addWeeks,
|
20514
20562
|
month: addMonths,
|
20515
20563
|
year: addYears,
|
20516
|
-
startOfWeek: date => ISOWeek ? startOfISOWeek(date) : startOfWeek(date),
|
20517
|
-
endOfWeek: date => ISOWeek ? endOfISOWeek(date) : endOfWeek(date)
|
20564
|
+
startOfWeek: date => broadcastCalendar ? startOfBroadcastWeek(date, dateLib) : ISOWeek ? startOfISOWeek(date) : startOfWeek(date),
|
20565
|
+
endOfWeek: date => broadcastCalendar ? endOfBroadcastWeek(date, dateLib) : ISOWeek ? endOfISOWeek(date) : endOfWeek(date)
|
20518
20566
|
};
|
20519
20567
|
let focusableDate = moveFns[moveBy](refDate, moveDir === "after" ? 1 : -1);
|
20520
20568
|
if (moveDir === "before" && navStart) {
|
@@ -20580,6 +20628,8 @@ function useFocus(props, calendar, getModifiers, isSelected, dateLib) {
|
|
20580
20628
|
/**
|
20581
20629
|
* Return a function to get the modifiers for a given day.
|
20582
20630
|
*
|
20631
|
+
* NOTE: this is not an hook, but a factory for `getModifiers`.
|
20632
|
+
*
|
20583
20633
|
* @private
|
20584
20634
|
*/
|
20585
20635
|
function useGetModifiers(days, props, dateLib) {
|
@@ -20588,12 +20638,19 @@ function useGetModifiers(days, props, dateLib) {
|
|
20588
20638
|
hidden,
|
20589
20639
|
modifiers,
|
20590
20640
|
showOutsideDays,
|
20641
|
+
broadcastCalendar,
|
20591
20642
|
today
|
20592
20643
|
} = props;
|
20593
20644
|
const {
|
20594
20645
|
isSameDay,
|
20595
|
-
isSameMonth
|
20646
|
+
isSameMonth,
|
20647
|
+
startOfMonth,
|
20648
|
+
isBefore,
|
20649
|
+
endOfMonth,
|
20650
|
+
isAfter
|
20596
20651
|
} = dateLib;
|
20652
|
+
const startMonth = props.startMonth && startOfMonth(props.startMonth);
|
20653
|
+
const endMonth = props.endMonth && endOfMonth(props.endMonth);
|
20597
20654
|
const internalModifiersMap = {
|
20598
20655
|
[DayFlag.focused]: [],
|
20599
20656
|
[DayFlag.outside]: [],
|
@@ -20602,20 +20659,18 @@ function useGetModifiers(days, props, dateLib) {
|
|
20602
20659
|
[DayFlag.today]: []
|
20603
20660
|
};
|
20604
20661
|
const customModifiersMap = {};
|
20605
|
-
const selectionModifiersMap = {
|
20606
|
-
[SelectionState.range_end]: [],
|
20607
|
-
[SelectionState.range_middle]: [],
|
20608
|
-
[SelectionState.range_start]: [],
|
20609
|
-
[SelectionState.selected]: []
|
20610
|
-
};
|
20611
20662
|
for (const day of days) {
|
20612
20663
|
const {
|
20613
20664
|
date,
|
20614
20665
|
displayMonth
|
20615
20666
|
} = day;
|
20616
20667
|
const isOutside = Boolean(displayMonth && !isSameMonth(date, displayMonth));
|
20668
|
+
const isBeforeStartMonth = Boolean(startMonth && isBefore(date, startMonth));
|
20669
|
+
const isAfterEndMonth = Boolean(endMonth && isAfter(date, endMonth));
|
20617
20670
|
const isDisabled = Boolean(disabled && dateMatchModifiers(date, disabled, dateLib));
|
20618
|
-
const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) ||
|
20671
|
+
const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) || isBeforeStartMonth || isAfterEndMonth ||
|
20672
|
+
// Broadcast calendar will show outside days as default
|
20673
|
+
!broadcastCalendar && !showOutsideDays && isOutside || broadcastCalendar && showOutsideDays === false && isOutside;
|
20619
20674
|
const isToday = isSameDay(date, today ?? (props.timeZone ? TZDate.tz(props.timeZone) : dateLib.Date ? new dateLib.Date() : new Date()));
|
20620
20675
|
if (isOutside) internalModifiersMap.outside.push(day);
|
20621
20676
|
if (isDisabled) internalModifiersMap.disabled.push(day);
|
@@ -20644,27 +20699,16 @@ function useGetModifiers(days, props, dateLib) {
|
|
20644
20699
|
[DayFlag.outside]: false,
|
20645
20700
|
[DayFlag.today]: false
|
20646
20701
|
};
|
20647
|
-
const selectionStates = {
|
20648
|
-
[SelectionState.range_end]: false,
|
20649
|
-
[SelectionState.range_middle]: false,
|
20650
|
-
[SelectionState.range_start]: false,
|
20651
|
-
[SelectionState.selected]: false
|
20652
|
-
};
|
20653
20702
|
const customModifiers = {};
|
20654
20703
|
// Find the modifiers for the given day
|
20655
20704
|
for (const name in internalModifiersMap) {
|
20656
20705
|
const days = internalModifiersMap[name];
|
20657
20706
|
dayFlags[name] = days.some(d => d === day);
|
20658
20707
|
}
|
20659
|
-
for (const name in selectionModifiersMap) {
|
20660
|
-
const days = selectionModifiersMap[name];
|
20661
|
-
selectionStates[name] = days.some(d => d === day);
|
20662
|
-
}
|
20663
20708
|
for (const name in customModifiersMap) {
|
20664
20709
|
customModifiers[name] = customModifiersMap[name].some(d => d === day);
|
20665
20710
|
}
|
20666
20711
|
return {
|
20667
|
-
...selectionStates,
|
20668
20712
|
...dayFlags,
|
20669
20713
|
// custom modifiers should override all the previous ones
|
20670
20714
|
...customModifiers
|
@@ -21069,7 +21113,7 @@ function DayPicker(props) {
|
|
21069
21113
|
};
|
21070
21114
|
const dateLib = new DateLib({
|
21071
21115
|
locale,
|
21072
|
-
weekStartsOn: props.weekStartsOn,
|
21116
|
+
weekStartsOn: props.broadcastCalendar ? 1 : props.weekStartsOn,
|
21073
21117
|
firstWeekContainsDate: props.firstWeekContainsDate,
|
21074
21118
|
useAdditionalWeekYearTokens: props.useAdditionalWeekYearTokens,
|
21075
21119
|
useAdditionalDayOfYearTokens: props.useAdditionalDayOfYearTokens
|
@@ -21088,7 +21132,7 @@ function DayPicker(props) {
|
|
21088
21132
|
...props.classNames
|
21089
21133
|
}
|
21090
21134
|
};
|
21091
|
-
}, [props.classNames, props.components, props.dateLib, props.firstWeekContainsDate, props.formatters, props.labels, props.locale, props.useAdditionalDayOfYearTokens, props.useAdditionalWeekYearTokens, props.weekStartsOn]);
|
21135
|
+
}, [props.classNames, props.components, props.dateLib, props.firstWeekContainsDate, props.formatters, props.labels, props.locale, props.useAdditionalDayOfYearTokens, props.useAdditionalWeekYearTokens, props.weekStartsOn, props.broadcastCalendar]);
|
21092
21136
|
const {
|
21093
21137
|
captionLayout,
|
21094
21138
|
mode,
|
@@ -21198,6 +21242,16 @@ function DayPicker(props) {
|
|
21198
21242
|
const handleDayMouseLeave = useCallback((day, modifiers) => e => {
|
21199
21243
|
onDayMouseLeave?.(day.date, modifiers, e);
|
21200
21244
|
}, [onDayMouseLeave]);
|
21245
|
+
const handleMonthChange = useCallback(date => e => {
|
21246
|
+
const selectedMonth = Number(e.target.value);
|
21247
|
+
const month = dateLib.setMonth(dateLib.startOfMonth(date), selectedMonth);
|
21248
|
+
goToMonth(month);
|
21249
|
+
}, [dateLib, goToMonth]);
|
21250
|
+
const handleYearChange = useCallback(date => e => {
|
21251
|
+
const selectedYear = Number(e.target.value);
|
21252
|
+
const month = dateLib.setYear(dateLib.startOfMonth(date), selectedYear);
|
21253
|
+
goToMonth(month);
|
21254
|
+
}, [dateLib, goToMonth]);
|
21201
21255
|
const {
|
21202
21256
|
className,
|
21203
21257
|
style
|
@@ -21235,6 +21289,8 @@ function DayPicker(props) {
|
|
21235
21289
|
lang: props.lang,
|
21236
21290
|
nonce: props.nonce,
|
21237
21291
|
title: props.title,
|
21292
|
+
role: props.role,
|
21293
|
+
"aria-label": props["aria-label"],
|
21238
21294
|
...dataAttributes
|
21239
21295
|
}, /*#__PURE__*/React__default.createElement(components.Months, {
|
21240
21296
|
className: classNames[UI.Months],
|
@@ -21248,17 +21304,8 @@ function DayPicker(props) {
|
|
21248
21304
|
previousMonth: previousMonth,
|
21249
21305
|
nextMonth: nextMonth
|
21250
21306
|
})), months.map((calendarMonth, displayIndex) => {
|
21251
|
-
const handleMonthChange = e => {
|
21252
|
-
const selectedMonth = Number(e.target.value);
|
21253
|
-
const month = dateLib.setMonth(dateLib.startOfMonth(calendarMonth.date), selectedMonth);
|
21254
|
-
goToMonth(month);
|
21255
|
-
};
|
21256
|
-
const handleYearChange = e => {
|
21257
|
-
const month = dateLib.setYear(dateLib.startOfMonth(calendarMonth.date), Number(e.target.value));
|
21258
|
-
goToMonth(month);
|
21259
|
-
};
|
21260
21307
|
const dropdownMonths = getMonthOptions(calendarMonth.date, navStart, navEnd, formatters, dateLib);
|
21261
|
-
const dropdownYears = getYearOptions(
|
21308
|
+
const dropdownYears = getYearOptions(navStart, navEnd, formatters, dateLib);
|
21262
21309
|
return /*#__PURE__*/React__default.createElement(components.Month, {
|
21263
21310
|
className: classNames[UI.Month],
|
21264
21311
|
style: styles?.[UI.Month],
|
@@ -21279,7 +21326,7 @@ function DayPicker(props) {
|
|
21279
21326
|
classNames: classNames,
|
21280
21327
|
components: components,
|
21281
21328
|
disabled: Boolean(props.disableNavigation),
|
21282
|
-
onChange: handleMonthChange,
|
21329
|
+
onChange: handleMonthChange(calendarMonth.date),
|
21283
21330
|
options: dropdownMonths,
|
21284
21331
|
style: styles?.[UI.Dropdown],
|
21285
21332
|
value: calendarMonth.date.getMonth()
|
@@ -21292,7 +21339,7 @@ function DayPicker(props) {
|
|
21292
21339
|
classNames: classNames,
|
21293
21340
|
components: components,
|
21294
21341
|
disabled: Boolean(props.disableNavigation),
|
21295
|
-
onChange: handleYearChange,
|
21342
|
+
onChange: handleYearChange(calendarMonth.date),
|
21296
21343
|
options: dropdownYears,
|
21297
21344
|
style: styles?.[UI.Dropdown],
|
21298
21345
|
value: calendarMonth.date.getFullYear()
|
@@ -21339,7 +21386,8 @@ function DayPicker(props) {
|
|
21339
21386
|
locale
|
21340
21387
|
}),
|
21341
21388
|
className: classNames[UI.WeekNumber],
|
21342
|
-
scope: "row"
|
21389
|
+
scope: "row",
|
21390
|
+
role: "rowheader"
|
21343
21391
|
}, formatWeekNumber(week.weekNumber))), week.days.map(day => {
|
21344
21392
|
const {
|
21345
21393
|
date
|
@@ -21359,14 +21407,14 @@ function DayPicker(props) {
|
|
21359
21407
|
}
|
21360
21408
|
const style = getStyleForModifiers(modifiers, styles, props.modifiersStyles);
|
21361
21409
|
const className = getClassNamesForModifiers(modifiers, classNames, props.modifiersClassNames);
|
21362
|
-
const ariaLabel = !isInteractive ? labelGridcell(date, modifiers, dateLib.options, dateLib) : undefined;
|
21410
|
+
const ariaLabel = !isInteractive && !modifiers.hidden ? labelGridcell(date, modifiers, dateLib.options, dateLib) : undefined;
|
21363
21411
|
return /*#__PURE__*/React__default.createElement(components.Day, {
|
21364
21412
|
key: `${dateLib.format(date, "yyyy-MM-dd")}_${dateLib.format(day.displayMonth, "yyyy-MM")}`,
|
21365
21413
|
day: day,
|
21366
21414
|
modifiers: modifiers,
|
21367
21415
|
className: className.join(" "),
|
21368
21416
|
style: style,
|
21369
|
-
"
|
21417
|
+
role: "gridcell",
|
21370
21418
|
"aria-selected": modifiers.selected || undefined,
|
21371
21419
|
"aria-label": ariaLabel,
|
21372
21420
|
"data-day": dateLib.format(date, "yyyy-MM-dd"),
|
@@ -21377,7 +21425,7 @@ function DayPicker(props) {
|
|
21377
21425
|
"data-outside": day.outside || undefined,
|
21378
21426
|
"data-focused": modifiers.focused || undefined,
|
21379
21427
|
"data-today": modifiers.today || undefined
|
21380
|
-
}, isInteractive ? (/*#__PURE__*/React__default.createElement(components.DayButton, {
|
21428
|
+
}, !modifiers.hidden && isInteractive ? (/*#__PURE__*/React__default.createElement(components.DayButton, {
|
21381
21429
|
className: classNames[UI.DayButton],
|
21382
21430
|
style: styles?.[UI.DayButton],
|
21383
21431
|
type: "button",
|
@@ -21392,7 +21440,7 @@ function DayPicker(props) {
|
|
21392
21440
|
onKeyDown: handleDayKeyDown(day, modifiers),
|
21393
21441
|
onMouseEnter: handleDayMouseEnter(day, modifiers),
|
21394
21442
|
onMouseLeave: handleDayMouseLeave(day, modifiers)
|
21395
|
-
}, formatDay(date, dateLib.options, dateLib))) : formatDay(day.date, dateLib.options, dateLib));
|
21443
|
+
}, formatDay(date, dateLib.options, dateLib))) : !modifiers.hidden && formatDay(day.date, dateLib.options, dateLib));
|
21396
21444
|
}));
|
21397
21445
|
}))));
|
21398
21446
|
})), props.footer && (/*#__PURE__*/React__default.createElement(components.Footer, {
|
@@ -25591,8 +25639,8 @@ const TimePicker = ({
|
|
25591
25639
|
});
|
25592
25640
|
};
|
25593
25641
|
|
25594
|
-
var css_248z$K = "@import 'react-day-picker/style.css';\n.fontXs, .ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n/* Custom date picker styling */\n.ff-date-picker .ff-cursor-pointer {\n cursor: pointer;\n}\n.ff-date-picker .ff-datepicker-input-container {\n display: flex;\n gap: 10px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input {\n padding: 4px 8px;\n padding-left: 2rem;\n height: 32px;\n border-radius: 5px;\n border: 1px solid var(--border-color);\n color: var(--status-skipped-text-color);\n line-height: 15px;\n box-sizing: border-box;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input:focus,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input:focus {\n outline: none;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-calendar-icon,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-clock-icon {\n position: absolute;\n top: 50%;\n transform: translate(25%, -50%);\n display: flex;\n align-items: center;\n pointer-events: none;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field {\n flex: 1;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input {\n width: 100%;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message {\n padding: 0px 4px;\n margin-left: 8px;\n line-height: 12px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message--danger {\n color: var(--input-error-text-color);\n}\n.ff-date-picker .ff-datepicker-input-container .ff-time-input-field {\n flex: 0 0 120px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-time-input-field .ff-time-input {\n width: 100%;\n}\n\n.ff-date-picker-container {\n display: flex;\n flex-direction: column;\n position: fixed;\n border-radius: 8px;\n padding: 4px;\n box-sizing: border-box;\n background-color: var(--tab-bg-color);\n box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.2);\n gap: 8px;\n}\n.ff-date-picker-container .rdp-root {\n --rdp-accent-color: var(--brand-color);\n --rdp-day-height: 24px;\n --rdp-day-width: 36px;\n --rdp-day_button-height: 24px;\n --rdp-day_button-width: 36px;\n font-family: \"Poppins\";\n font-size: 12px;\n --rdp-font-family: \"Poppins\", sans-serif;\n}\n.ff-date-picker-container .ff-calendar-container {\n display: flex;\n align-items: flex-start;\n gap: 4px;\n height: 240px;\n}\n.ff-date-picker-container .ff-date-picker-controls {\n padding: 4px;\n display: flex;\n justify-content: end;\n gap: 8px;\n border-top: 1px solid var(--border-color);\n}\n.ff-date-picker-container .ff-date-picker-controls .ff-date-picker-button {\n font-weight: 600;\n line-height: 15px;\n}\n\n.ff-calendar .ff-calendar-nav-button {\n margin: 0 5px;\n border: 1px solid var(--border-color);\n background-color: var(--toggle-button-bg-color);\n box-shadow: 0 -1px 2px 0 var(--ff-mini-modal-box-shadow);\n padding: 0px;\n border-radius: 30%;\n cursor: pointer;\n}\n.ff-calendar .ff-calendar-nav-button:disabled {\n cursor: auto;\n opacity: 0.5;\n}\n.ff-calendar .ff-calendar-haeder {\n display: flex;\n align-items: center;\n gap: 5px;\n color: var(--text-color);\n}\n.ff-calendar .ff-custom-year_grid,\n.ff-calendar .ff-custom-month_grid {\n width: calc((var(--rdp-day_button-width) + 4px) * 7);\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 10px;\n padding: 5px;\n max-width: 100%;\n}\n.ff-calendar .ff-custom-year_grid .ff-custom-year,\n.ff-calendar .ff-custom-year_grid .ff-custom-month,\n.ff-calendar .ff-custom-month_grid .ff-custom-year,\n.ff-calendar .ff-custom-month_grid .ff-custom-month {\n padding: 10px 0;\n text-align: center;\n cursor: pointer;\n border-radius: 8px;\n background-color: var(--disabled-primary-color);\n}\n.ff-calendar .ff-custom-year_grid .ff-custom-year--selected,\n.ff-calendar .ff-custom-year_grid .ff-custom-month--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-year--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-month--selected {\n background-color: var(--brand-color);\n color: var(--primary-button-text-color);\n}\n.ff-calendar .ff-custom-year_grid .ff-custom-year--disabled,\n.ff-calendar .ff-custom-year_grid .ff-custom-month--disabled,\n.ff-calendar .ff-custom-month_grid .ff-custom-year--disabled,\n.ff-calendar .ff-custom-month_grid .ff-custom-month--disabled {\n color: var(--text-color-light);\n cursor: default;\n}\n.ff-calendar .ff-custom-year_grid .ff-custom-year--disabled.ff-custom-month--selected, .ff-calendar .ff-custom-year_grid .ff-custom-year--disabled.ff-custom-year--selected,\n.ff-calendar .ff-custom-year_grid .ff-custom-month--disabled.ff-custom-month--selected,\n.ff-calendar .ff-custom-year_grid .ff-custom-month--disabled.ff-custom-year--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-year--disabled.ff-custom-month--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-year--disabled.ff-custom-year--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-month--disabled.ff-custom-month--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-month--disabled.ff-custom-year--selected {\n background-color: var(--disable-color);\n}\n.ff-calendar .rdp-weekdays th {\n color: #6f7c8e;\n font-weight: 400;\n}\n.ff-calendar .rdp-day {\n padding: 2px;\n font-weight: 500;\n}\n.ff-calendar .rdp-day_button {\n border-radius: 4px;\n padding: 3px 9px;\n}\n.ff-calendar .rdp-day_button:hover {\n background-color: var(--hover-color);\n}\n.ff-calendar .rdp-selected {\n font: inherit;\n}\n.ff-calendar .rdp-selected .rdp-day_button {\n background: var(--rdp-accent-color);\n color: var(--drawer-footer-bg);\n border: none;\n}\n.ff-calendar .rdp-today:not(.rdp-outside) .rdp-day_button {\n border: 2px solid var(--rdp-accent-color);\n}\n\n.ff-time-picker-container {\n position: relative;\n width: 150px;\n height: 100%;\n overflow-y: hidden;\n border-left: 1px solid #ccc;\n padding: 10px 5px;\n box-sizing: border-box;\n}\n.ff-time-picker-container::-webkit-scrollbar {\n display: none;\n}\n.ff-time-picker-container .ff-time-picker-fields {\n display: flex;\n height: 14%;\n width: 100%;\n margin-bottom: 5px;\n box-sizing: border-box;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container {\n display: flex;\n border: 1px solid var(--border-color);\n border-right: 0;\n border-radius: 4px 0 0 4px;\n width: 55%;\n position: relative;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input {\n border: none;\n padding: 5px;\n width: 100%;\n text-align: center;\n border-radius: 4px 0 0 4px;\n font-weight: 400;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input::placeholder {\n opacity: 0;\n line-height: 18px;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input-label {\n position: absolute;\n left: 10px;\n top: 50%;\n transform: translateY(-50%);\n transition: 0.2s ease all;\n color: var(--input-default-label-color);\n pointer-events: none;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--float .ff-time-input-label {\n top: 0;\n left: 5px;\n color: var(--brand-color);\n background-color: var(--input-label-bg-color);\n line-height: 12px;\n padding: 0 2px;\n font-size: 8px !important;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--float .ff-time-input-label--danger {\n color: var(--input-error-text-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:hover {\n border-color: var(--input-hover-border-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within {\n border-color: var(--brand-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input-label {\n top: 0;\n left: 5px;\n color: var(--brand-color);\n background-color: var(--input-label-bg-color);\n line-height: 12px;\n padding: 0 2px;\n font-size: 8px !important;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input-label--danger {\n color: var(--input-error-text-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input::placeholder {\n opacity: 1;\n margin-bottom: 1px;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--danger {\n border-color: var(--input-error-text-color) !important;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input:focus {\n outline: none;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container {\n position: relative;\n width: 45%;\n display: flex;\n border: 1px solid var(--border-color);\n border-radius: 0 4px 4px 0;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-select {\n display: flex;\n align-items: center;\n padding: 0 5px;\n width: 100%;\n border-radius: 4px;\n background-color: white;\n cursor: pointer;\n border: none;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container--active {\n border-color: var(--brand-color) !important;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container:hover {\n border-color: var(--input-hover-border-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-icon {\n margin-left: auto;\n pointer-events: none;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-icon svg path {\n fill: var(--default-icon-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container:hover svg path {\n fill: var(--brand-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-options {\n position: absolute;\n top: 100%;\n left: 0;\n z-index: 100;\n min-width: 60px;\n margin: 4px 0 0;\n padding: 0;\n list-style: none;\n border: 1px solid var(--ff-select-background-color);\n border-radius: 4px;\n background-color: var(--primary-button-text-color);\n box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-option-item {\n padding: 8px;\n color: var(--text-color);\n border-radius: 4px;\n cursor: pointer;\n transition: background-color 0.2s ease;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-option-item:hover {\n background-color: var(--ff-select-option-hover-color);\n}\n.ff-time-picker-container .ff-time-picker-options {\n height: 86%;\n overflow-y: auto;\n padding-right: 5px;\n}\n.ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar {\n width: 4px;\n height: 12px;\n}\n.ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar-thumb {\n background-color: var(--ff-select-scroll-thumb-color);\n border-radius: 4px;\n}\n.ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar-track {\n background-color: var(--hover-color);\n border-radius: 4px;\n}\n.ff-time-picker-container .ff-time-picker-options .ff-time-option {\n padding: 10px 12px;\n cursor: pointer;\n text-align: center;\n border-radius: 8px;\n background-color: rgb(249, 249, 249);\n margin: 10px 0;\n}\n\n/* Variables declaration */\n/* prettier-ignore */\n.rdp-root {\n --rdp-accent-color: blue;\n /* The accent color used for selected days and UI elements. */\n --rdp-accent-background-color: #f0f0ff;\n /* The accent background color used for selected days and UI elements. */\n --rdp-font-family: system-ui;\n /* The font family used by the calendar. Note that `inherit`does not work here. */\n --rdp-day-font: inherit;\n /* The font used for the day cells. */\n --rdp-day-height: 2.75rem;\n /* The height of the day cells. */\n --rdp-day-width: 2.75rem;\n /* The width of the day cells. */\n --rdp-day_button-border-radius: 100%;\n /* The border radius of the day cells. */\n --rdp-day_button-border: 2px solid transparent;\n /* The border of the day cells. */\n --rdp-day_button-height: var(--rdp-day-height);\n /* The height of the day cells. */\n --rdp-day_button-width: var(--rdp-day-width);\n /* The width of the day cells. */\n --rdp-selected-border: 2px solid var(--rdp-accent-color);\n /* The border of the selected days. */\n --rdp-selected-font: bold large var(--rdp-font-family);\n /* The font of the selected days. */\n --rdp-disabled-opacity: 0.5;\n /* The opacity of the disabled days. */\n --rdp-outside-opacity: 0.75;\n /* The opacity of the days outside the current month. */\n --rdp-today-color: var(--rdp-accent-color);\n /* The color of the today's date. */\n --rdp-dropdown-gap: 0.5rem;\n /* The gap between the dropdowns used in the month captons. */\n --rdp-month_caption-font: bold larger var(--rdp-font-family);\n /* The font of the month caption. */\n --rdp-months-gap: 2rem;\n /* The gap between the months in the multi-month view. */\n --rdp-nav_button-disabled-opacity: 0.5;\n /* The opacity of the disabled navigation buttons. */\n --rdp-nav_button-height: 2.25rem;\n /* The height of the navigation buttons. */\n --rdp-nav_button-width: 2.25rem;\n /* The width of the navigation buttons. */\n --rdp-nav-height: 2.75rem;\n /* The height of the navigation bar. */\n --rdp-range_middle-background-color: var(--rdp-accent-background-color);\n /* The color of the background for days in the middle of a range. */\n --rdp-range_middle-font: normal medium var(--rdp-font-family);\n /* The font for days in the middle of a range. */\n --rdp-range_middle-foreground-color: white;\n /* The font for days in the middle of a range. */\n --rdp-range_middle-color: inherit;\n /* The color of the range text. */\n --rdp-range_start-color: white;\n /* The color of the range text. */\n --rdp-range_start-background: linear-gradient(var(--rdp-gradient-direction), transparent 50%, var(--rdp-range_middle-background-color) 50%);\n /* Used for the background of the start of the selected range. */\n --rdp-range_start-date-background-color: var(--rdp-accent-color);\n /* The background color of the date when at the start of the selected range. */\n --rdp-range_end-background: linear-gradient(var(--rdp-gradient-direction), var(--rdp-range_middle-background-color) 50%, transparent 50%);\n /* Used for the background of the end of the selected range. */\n --rdp-range_end-color: white;\n /* The color of the range text. */\n --rdp-range_end-date-background-color: var(--rdp-accent-color);\n /* The background color of the date when at the end of the selected range. */\n --rdp-week_number-border-radius: 100%;\n /* The border radius of the week number. */\n --rdp-week_number-border: 2px solid transparent;\n /* The border of the week number. */\n --rdp-week_number-font: 400 small var(--rdp-font-family);\n /* The font of the week number cells. */\n --rdp-week_number-height: var(--rdp-day-height);\n /* The height of the week number cells. */\n --rdp-week_number-opacity: 0.75;\n /* The opacity of the week number. */\n --rdp-week_number-width: var(--rdp-day-width);\n /* The width of the week number cells. */\n --rdp-weeknumber-text-align: center;\n /* The text alignment of the weekday cells. */\n --rdp-weekday-font: 500 smaller var(--rdp-font-family);\n /* The font of the weekday. */\n --rdp-weekday-opacity: 0.75;\n /* The opacity of the weekday. */\n --rdp-weekday-padding: 0.5rem 0rem;\n /* The padding of the weekday. */\n --rdp-weekday-text-align: center;\n /* The text alignment of the weekday cells. */\n --rdp-gradient-direction: 90deg;\n}\n\n.rdp-root[dir=rtl] {\n --rdp-gradient-direction: -90deg;\n}\n\n/* Root of the component. */\n.rdp-root {\n position: relative;\n /* Required to position the navigation toolbar. */\n box-sizing: border-box;\n}\n\n.rdp-root * {\n box-sizing: border-box;\n}\n\n.rdp-day {\n width: var(--rdp-day-width);\n height: var(--rdp-day-height);\n font: var(--rdp-day-font);\n text-align: center;\n}\n\n.rdp-day_button {\n background: none;\n padding: 0;\n margin: 0;\n cursor: pointer;\n font: inherit;\n color: inherit;\n justify-content: center;\n align-items: center;\n display: flex;\n width: var(--rdp-day_button-width);\n height: var(--rdp-day_button-height);\n border: var(--rdp-day_button-border);\n border-radius: var(--rdp-day_button-border-radius);\n}\n\n.rdp-day_button:disabled {\n cursor: revert;\n}\n\n.rdp-caption_label {\n z-index: 1;\n position: relative;\n display: inline-flex;\n align-items: center;\n white-space: nowrap;\n border: 0;\n}\n\n.rdp-button_next,\n.rdp-button_previous {\n border: none;\n background: none;\n padding: 0;\n margin: 0;\n cursor: pointer;\n font: inherit;\n color: inherit;\n -moz-appearance: none;\n -webkit-appearance: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n position: relative;\n appearance: none;\n width: var(--rdp-nav_button-width);\n height: var(--rdp-nav_button-height);\n}\n\n.rdp-button_next:disabled,\n.rdp-button_previous:disabled {\n cursor: revert;\n opacity: var(--rdp-nav_button-disabled-opacity);\n}\n\n.rdp-chevron {\n display: inline-block;\n fill: var(--rdp-accent-color);\n}\n\n.rdp-root[dir=rtl] .rdp-nav .rdp-chevron {\n transform: rotate(180deg);\n}\n\n.rdp-root[dir=rtl] .rdp-nav .rdp-chevron {\n transform: rotate(180deg);\n transform-origin: 50%;\n}\n\n.rdp-dropdowns {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: var(--rdp-dropdown-gap);\n}\n\n.rdp-dropdown {\n z-index: 2;\n /* Reset */\n opacity: 0;\n appearance: none;\n position: absolute;\n inset-block-start: 0;\n inset-block-end: 0;\n inset-inline-start: 0;\n width: 100%;\n margin: 0;\n padding: 0;\n cursor: inherit;\n border: none;\n line-height: inherit;\n}\n\n.rdp-dropdown_root {\n position: relative;\n display: inline-flex;\n align-items: center;\n}\n\n.rdp-dropdown_root[data-disabled=true] .rdp-chevron {\n opacity: var(--rdp-disabled-opacity);\n}\n\n.rdp-month_caption {\n display: flex;\n align-content: center;\n height: var(--rdp-nav-height);\n font: var(--rdp-month_caption-font);\n}\n\n.rdp-months {\n position: relative;\n display: flex;\n flex-wrap: wrap;\n gap: var(--rdp-months-gap);\n max-width: fit-content;\n}\n\n.rdp-month_grid {\n border-collapse: collapse;\n}\n\n.rdp-nav {\n position: absolute;\n inset-block-start: 0;\n inset-inline-end: 0;\n display: flex;\n align-items: center;\n height: var(--rdp-nav-height);\n}\n\n.rdp-weekday {\n opacity: var(--rdp-weekday-opacity);\n padding: var(--rdp-weekday-padding);\n font: var(--rdp-weekday-font);\n text-align: var(--rdp-weekday-text-align);\n text-transform: var(--rdp-weekday-text-transform);\n}\n\n.rdp-week_number {\n opacity: var(--rdp-week_number-opacity);\n font: var(--rdp-week_number-font);\n height: var(--rdp-week_number-height);\n width: var(--rdp-week_number-width);\n border: var(--rdp-week_number-border);\n border-radius: var(--rdp-week_number-border-radius);\n text-align: var(--rdp-weeknumber-text-align);\n}\n\n/* DAY MODIFIERS */\n.rdp-today:not(.rdp-outside) {\n color: var(--rdp-today-color);\n}\n\n.rdp-selected {\n font: var(--rdp-selected-font);\n}\n\n.rdp-selected .rdp-day_button {\n border: var(--rdp-selected-border);\n}\n\n.rdp-outside {\n opacity: var(--rdp-outside-opacity);\n}\n\n.rdp-disabled {\n opacity: var(--rdp-disabled-opacity);\n}\n\n.rdp-hidden {\n visibility: hidden;\n color: var(--rdp-range_start-color);\n}\n\n.rdp-range_start {\n background: var(--rdp-range_start-background);\n}\n\n.rdp-range_start .rdp-day_button {\n background-color: var(--rdp-range_start-date-background-color);\n color: var(--rdp-range_start-color);\n}\n\n.rdp-range_middle {\n background-color: var(--rdp-range_middle-background-color);\n font: var(--rdp-range_middle-font);\n}\n\n.rdp-range_middle .rdp-day_button {\n border-color: transparent;\n border: unset;\n border-radius: unset;\n color: var(--rdp-range_middle-color);\n}\n\n.rdp-range_end {\n background: var(--rdp-range_end-background);\n color: var(--rdp-range_end-color);\n}\n\n.rdp-range_end .rdp-day_button {\n color: var(--rdp-range_start-color);\n background-color: var(--rdp-range_end-date-background-color);\n}\n\n.rdp-range_start.rdp-range_end {\n background: revert;\n}\n\n.rdp-focusable {\n cursor: pointer;\n}";
|
25595
|
-
styleInject(css_248z$
|
25642
|
+
var css_248z$L = "@import 'react-day-picker/style.css';\n.fontXs, .ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n/* Custom date picker styling */\n.ff-date-picker .ff-cursor-pointer {\n cursor: pointer;\n}\n.ff-date-picker .ff-datepicker-input-container {\n display: flex;\n gap: 10px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input {\n padding: 4px 8px;\n padding-left: 2rem;\n height: 32px;\n border-radius: 5px;\n border: 1px solid var(--border-color);\n color: var(--status-skipped-text-color);\n line-height: 15px;\n box-sizing: border-box;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input:focus,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input:focus {\n outline: none;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-calendar-icon,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-clock-icon {\n position: absolute;\n top: 50%;\n transform: translate(25%, -50%);\n display: flex;\n align-items: center;\n pointer-events: none;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field {\n flex: 1;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input {\n width: 100%;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message {\n padding: 0px 4px;\n margin-left: 8px;\n line-height: 12px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message--danger {\n color: var(--input-error-text-color);\n}\n.ff-date-picker .ff-datepicker-input-container .ff-time-input-field {\n flex: 0 0 120px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-time-input-field .ff-time-input {\n width: 100%;\n}\n\n.ff-date-picker-container {\n display: flex;\n flex-direction: column;\n position: fixed;\n border-radius: 8px;\n padding: 4px;\n box-sizing: border-box;\n background-color: var(--tab-bg-color);\n box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.2);\n gap: 8px;\n}\n.ff-date-picker-container .rdp-root {\n --rdp-accent-color: var(--brand-color);\n --rdp-day-height: 24px;\n --rdp-day-width: 36px;\n --rdp-day_button-height: 24px;\n --rdp-day_button-width: 36px;\n font-family: \"Poppins\";\n font-size: 12px;\n --rdp-font-family: \"Poppins\", sans-serif;\n}\n.ff-date-picker-container .ff-calendar-container {\n display: flex;\n align-items: flex-start;\n gap: 4px;\n height: 240px;\n}\n.ff-date-picker-container .ff-date-picker-controls {\n padding: 4px;\n display: flex;\n justify-content: end;\n gap: 8px;\n border-top: 1px solid var(--border-color);\n}\n.ff-date-picker-container .ff-date-picker-controls .ff-date-picker-button {\n font-weight: 600;\n line-height: 15px;\n}\n\n.ff-calendar .ff-calendar-nav-button {\n margin: 0 5px;\n border: 1px solid var(--border-color);\n background-color: var(--toggle-button-bg-color);\n box-shadow: 0 -1px 2px 0 var(--ff-mini-modal-box-shadow);\n padding: 0px;\n border-radius: 30%;\n cursor: pointer;\n}\n.ff-calendar .ff-calendar-nav-button:disabled {\n cursor: auto;\n opacity: 0.5;\n}\n.ff-calendar .ff-calendar-haeder {\n display: flex;\n align-items: center;\n gap: 5px;\n color: var(--text-color);\n}\n.ff-calendar .ff-custom-year_grid,\n.ff-calendar .ff-custom-month_grid {\n width: calc((var(--rdp-day_button-width) + 4px) * 7);\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 10px;\n padding: 5px;\n max-width: 100%;\n}\n.ff-calendar .ff-custom-year_grid .ff-custom-year,\n.ff-calendar .ff-custom-year_grid .ff-custom-month,\n.ff-calendar .ff-custom-month_grid .ff-custom-year,\n.ff-calendar .ff-custom-month_grid .ff-custom-month {\n padding: 10px 0;\n text-align: center;\n cursor: pointer;\n border-radius: 8px;\n background-color: var(--disabled-primary-color);\n}\n.ff-calendar .ff-custom-year_grid .ff-custom-year--selected,\n.ff-calendar .ff-custom-year_grid .ff-custom-month--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-year--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-month--selected {\n background-color: var(--brand-color);\n color: var(--primary-button-text-color);\n}\n.ff-calendar .ff-custom-year_grid .ff-custom-year--disabled,\n.ff-calendar .ff-custom-year_grid .ff-custom-month--disabled,\n.ff-calendar .ff-custom-month_grid .ff-custom-year--disabled,\n.ff-calendar .ff-custom-month_grid .ff-custom-month--disabled {\n color: var(--text-color-light);\n cursor: default;\n}\n.ff-calendar .ff-custom-year_grid .ff-custom-year--disabled.ff-custom-month--selected, .ff-calendar .ff-custom-year_grid .ff-custom-year--disabled.ff-custom-year--selected,\n.ff-calendar .ff-custom-year_grid .ff-custom-month--disabled.ff-custom-month--selected,\n.ff-calendar .ff-custom-year_grid .ff-custom-month--disabled.ff-custom-year--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-year--disabled.ff-custom-month--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-year--disabled.ff-custom-year--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-month--disabled.ff-custom-month--selected,\n.ff-calendar .ff-custom-month_grid .ff-custom-month--disabled.ff-custom-year--selected {\n background-color: var(--disable-color);\n}\n.ff-calendar .rdp-weekdays th {\n color: #6f7c8e;\n font-weight: 400;\n}\n.ff-calendar .rdp-day {\n padding: 2px;\n font-weight: 500;\n}\n.ff-calendar .rdp-day_button {\n border-radius: 4px;\n padding: 3px 9px;\n}\n.ff-calendar .rdp-day_button:hover {\n background-color: var(--hover-color);\n}\n.ff-calendar .rdp-selected {\n font: inherit;\n}\n.ff-calendar .rdp-selected .rdp-day_button {\n background: var(--rdp-accent-color);\n color: var(--drawer-footer-bg);\n border: none;\n}\n.ff-calendar .rdp-today:not(.rdp-outside) .rdp-day_button {\n border: 2px solid var(--rdp-accent-color);\n}\n\n.ff-time-picker-container {\n position: relative;\n width: 150px;\n height: 100%;\n overflow-y: hidden;\n border-left: 1px solid #ccc;\n padding: 10px 5px;\n box-sizing: border-box;\n}\n.ff-time-picker-container::-webkit-scrollbar {\n display: none;\n}\n.ff-time-picker-container .ff-time-picker-fields {\n display: flex;\n height: 14%;\n width: 100%;\n margin-bottom: 5px;\n box-sizing: border-box;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container {\n display: flex;\n border: 1px solid var(--border-color);\n border-right: 0;\n border-radius: 4px 0 0 4px;\n width: 55%;\n position: relative;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input {\n border: none;\n padding: 5px;\n width: 100%;\n text-align: center;\n border-radius: 4px 0 0 4px;\n font-weight: 400;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input::placeholder {\n opacity: 0;\n line-height: 18px;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input-label {\n position: absolute;\n left: 10px;\n top: 50%;\n transform: translateY(-50%);\n transition: 0.2s ease all;\n color: var(--input-default-label-color);\n pointer-events: none;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--float .ff-time-input-label {\n top: 0;\n left: 5px;\n color: var(--brand-color);\n background-color: var(--input-label-bg-color);\n line-height: 12px;\n padding: 0 2px;\n font-size: 8px !important;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--float .ff-time-input-label--danger {\n color: var(--input-error-text-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:hover {\n border-color: var(--input-hover-border-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within {\n border-color: var(--brand-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input-label {\n top: 0;\n left: 5px;\n color: var(--brand-color);\n background-color: var(--input-label-bg-color);\n line-height: 12px;\n padding: 0 2px;\n font-size: 8px !important;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input-label--danger {\n color: var(--input-error-text-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input::placeholder {\n opacity: 1;\n margin-bottom: 1px;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--danger {\n border-color: var(--input-error-text-color) !important;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input:focus {\n outline: none;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container {\n position: relative;\n width: 45%;\n display: flex;\n border: 1px solid var(--border-color);\n border-radius: 0 4px 4px 0;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-select {\n display: flex;\n align-items: center;\n padding: 0 5px;\n width: 100%;\n border-radius: 4px;\n background-color: white;\n cursor: pointer;\n border: none;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container--active {\n border-color: var(--brand-color) !important;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container:hover {\n border-color: var(--input-hover-border-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-icon {\n margin-left: auto;\n pointer-events: none;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-icon svg path {\n fill: var(--default-icon-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container:hover svg path {\n fill: var(--brand-color);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-options {\n position: absolute;\n top: 100%;\n left: 0;\n z-index: 100;\n min-width: 60px;\n margin: 4px 0 0;\n padding: 0;\n list-style: none;\n border: 1px solid var(--ff-select-background-color);\n border-radius: 4px;\n background-color: var(--primary-button-text-color);\n box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-option-item {\n padding: 8px;\n color: var(--text-color);\n border-radius: 4px;\n cursor: pointer;\n transition: background-color 0.2s ease;\n}\n.ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-option-item:hover {\n background-color: var(--ff-select-option-hover-color);\n}\n.ff-time-picker-container .ff-time-picker-options {\n height: 86%;\n overflow-y: auto;\n padding-right: 5px;\n}\n.ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar {\n width: 4px;\n height: 12px;\n}\n.ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar-thumb {\n background-color: var(--ff-select-scroll-thumb-color);\n border-radius: 4px;\n}\n.ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar-track {\n background-color: var(--hover-color);\n border-radius: 4px;\n}\n.ff-time-picker-container .ff-time-picker-options .ff-time-option {\n padding: 10px 12px;\n cursor: pointer;\n text-align: center;\n border-radius: 8px;\n background-color: rgb(249, 249, 249);\n margin: 10px 0;\n}\n\n/* Variables declaration */\n/* prettier-ignore */\n.rdp-root {\n --rdp-accent-color: blue;\n /* The accent color used for selected days and UI elements. */\n --rdp-accent-background-color: #f0f0ff;\n /* The accent background color used for selected days and UI elements. */\n --rdp-font-family: system-ui;\n /* The font family used by the calendar. Note that `inherit`does not work here. */\n --rdp-day-font: inherit;\n /* The font used for the day cells. */\n --rdp-day-height: 2.75rem;\n /* The height of the day cells. */\n --rdp-day-width: 2.75rem;\n /* The width of the day cells. */\n --rdp-day_button-border-radius: 100%;\n /* The border radius of the day cells. */\n --rdp-day_button-border: 2px solid transparent;\n /* The border of the day cells. */\n --rdp-day_button-height: var(--rdp-day-height);\n /* The height of the day cells. */\n --rdp-day_button-width: var(--rdp-day-width);\n /* The width of the day cells. */\n --rdp-selected-border: 2px solid var(--rdp-accent-color);\n /* The border of the selected days. */\n --rdp-selected-font: bold large var(--rdp-font-family);\n /* The font of the selected days. */\n --rdp-disabled-opacity: 0.5;\n /* The opacity of the disabled days. */\n --rdp-outside-opacity: 0.75;\n /* The opacity of the days outside the current month. */\n --rdp-today-color: var(--rdp-accent-color);\n /* The color of the today's date. */\n --rdp-dropdown-gap: 0.5rem;\n /* The gap between the dropdowns used in the month captons. */\n --rdp-month_caption-font: bold larger var(--rdp-font-family);\n /* The font of the month caption. */\n --rdp-months-gap: 2rem;\n /* The gap between the months in the multi-month view. */\n --rdp-nav_button-disabled-opacity: 0.5;\n /* The opacity of the disabled navigation buttons. */\n --rdp-nav_button-height: 2.25rem;\n /* The height of the navigation buttons. */\n --rdp-nav_button-width: 2.25rem;\n /* The width of the navigation buttons. */\n --rdp-nav-height: 2.75rem;\n /* The height of the navigation bar. */\n --rdp-range_middle-background-color: var(--rdp-accent-background-color);\n /* The color of the background for days in the middle of a range. */\n --rdp-range_middle-font: normal medium var(--rdp-font-family);\n /* The font for days in the middle of a range. */\n --rdp-range_middle-foreground-color: white;\n /* The font for days in the middle of a range. */\n --rdp-range_middle-color: inherit;\n /* The color of the range text. */\n --rdp-range_start-color: white;\n /* The color of the range text. */\n --rdp-range_start-background: linear-gradient(var(--rdp-gradient-direction), transparent 50%, var(--rdp-range_middle-background-color) 50%);\n /* Used for the background of the start of the selected range. */\n --rdp-range_start-date-background-color: var(--rdp-accent-color);\n /* The background color of the date when at the start of the selected range. */\n --rdp-range_end-background: linear-gradient(var(--rdp-gradient-direction), var(--rdp-range_middle-background-color) 50%, transparent 50%);\n /* Used for the background of the end of the selected range. */\n --rdp-range_end-color: white;\n /* The color of the range text. */\n --rdp-range_end-date-background-color: var(--rdp-accent-color);\n /* The background color of the date when at the end of the selected range. */\n --rdp-week_number-border-radius: 100%;\n /* The border radius of the week number. */\n --rdp-week_number-border: 2px solid transparent;\n /* The border of the week number. */\n --rdp-week_number-font: 400 small var(--rdp-font-family);\n /* The font of the week number cells. */\n --rdp-week_number-height: var(--rdp-day-height);\n /* The height of the week number cells. */\n --rdp-week_number-opacity: 0.75;\n /* The opacity of the week number. */\n --rdp-week_number-width: var(--rdp-day-width);\n /* The width of the week number cells. */\n --rdp-weeknumber-text-align: center;\n /* The text alignment of the weekday cells. */\n --rdp-weekday-font: 500 smaller var(--rdp-font-family);\n /* The font of the weekday. */\n --rdp-weekday-opacity: 0.75;\n /* The opacity of the weekday. */\n --rdp-weekday-padding: 0.5rem 0rem;\n /* The padding of the weekday. */\n --rdp-weekday-text-align: center;\n /* The text alignment of the weekday cells. */\n --rdp-gradient-direction: 90deg;\n}\n\n.rdp-root[dir=rtl] {\n --rdp-gradient-direction: -90deg;\n}\n\n/* Root of the component. */\n.rdp-root {\n position: relative;\n /* Required to position the navigation toolbar. */\n box-sizing: border-box;\n}\n\n.rdp-root * {\n box-sizing: border-box;\n}\n\n.rdp-day {\n width: var(--rdp-day-width);\n height: var(--rdp-day-height);\n font: var(--rdp-day-font);\n text-align: center;\n}\n\n.rdp-day_button {\n background: none;\n padding: 0;\n margin: 0;\n cursor: pointer;\n font: inherit;\n color: inherit;\n justify-content: center;\n align-items: center;\n display: flex;\n width: var(--rdp-day_button-width);\n height: var(--rdp-day_button-height);\n border: var(--rdp-day_button-border);\n border-radius: var(--rdp-day_button-border-radius);\n}\n\n.rdp-day_button:disabled {\n cursor: revert;\n}\n\n.rdp-caption_label {\n z-index: 1;\n position: relative;\n display: inline-flex;\n align-items: center;\n white-space: nowrap;\n border: 0;\n}\n\n.rdp-button_next,\n.rdp-button_previous {\n border: none;\n background: none;\n padding: 0;\n margin: 0;\n cursor: pointer;\n font: inherit;\n color: inherit;\n -moz-appearance: none;\n -webkit-appearance: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n position: relative;\n appearance: none;\n width: var(--rdp-nav_button-width);\n height: var(--rdp-nav_button-height);\n}\n\n.rdp-button_next:disabled,\n.rdp-button_previous:disabled {\n cursor: revert;\n opacity: var(--rdp-nav_button-disabled-opacity);\n}\n\n.rdp-chevron {\n display: inline-block;\n fill: var(--rdp-accent-color);\n}\n\n.rdp-root[dir=rtl] .rdp-nav .rdp-chevron {\n transform: rotate(180deg);\n}\n\n.rdp-root[dir=rtl] .rdp-nav .rdp-chevron {\n transform: rotate(180deg);\n transform-origin: 50%;\n}\n\n.rdp-dropdowns {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: var(--rdp-dropdown-gap);\n}\n\n.rdp-dropdown {\n z-index: 2;\n /* Reset */\n opacity: 0;\n appearance: none;\n position: absolute;\n inset-block-start: 0;\n inset-block-end: 0;\n inset-inline-start: 0;\n width: 100%;\n margin: 0;\n padding: 0;\n cursor: inherit;\n border: none;\n line-height: inherit;\n}\n\n.rdp-dropdown_root {\n position: relative;\n display: inline-flex;\n align-items: center;\n}\n\n.rdp-dropdown_root[data-disabled=true] .rdp-chevron {\n opacity: var(--rdp-disabled-opacity);\n}\n\n.rdp-month_caption {\n display: flex;\n align-content: center;\n height: var(--rdp-nav-height);\n font: var(--rdp-month_caption-font);\n}\n\n.rdp-months {\n position: relative;\n display: flex;\n flex-wrap: wrap;\n gap: var(--rdp-months-gap);\n max-width: fit-content;\n}\n\n.rdp-month_grid {\n border-collapse: collapse;\n}\n\n.rdp-nav {\n position: absolute;\n inset-block-start: 0;\n inset-inline-end: 0;\n display: flex;\n align-items: center;\n height: var(--rdp-nav-height);\n}\n\n.rdp-weekday {\n opacity: var(--rdp-weekday-opacity);\n padding: var(--rdp-weekday-padding);\n font: var(--rdp-weekday-font);\n text-align: var(--rdp-weekday-text-align);\n text-transform: var(--rdp-weekday-text-transform);\n}\n\n.rdp-week_number {\n opacity: var(--rdp-week_number-opacity);\n font: var(--rdp-week_number-font);\n height: var(--rdp-week_number-height);\n width: var(--rdp-week_number-width);\n border: var(--rdp-week_number-border);\n border-radius: var(--rdp-week_number-border-radius);\n text-align: var(--rdp-weeknumber-text-align);\n}\n\n/* DAY MODIFIERS */\n.rdp-today:not(.rdp-outside) {\n color: var(--rdp-today-color);\n}\n\n.rdp-selected {\n font: var(--rdp-selected-font);\n}\n\n.rdp-selected .rdp-day_button {\n border: var(--rdp-selected-border);\n}\n\n.rdp-outside {\n opacity: var(--rdp-outside-opacity);\n}\n\n.rdp-disabled {\n opacity: var(--rdp-disabled-opacity);\n}\n\n.rdp-hidden {\n visibility: hidden;\n color: var(--rdp-range_start-color);\n}\n\n.rdp-range_start {\n background: var(--rdp-range_start-background);\n}\n\n.rdp-range_start .rdp-day_button {\n background-color: var(--rdp-range_start-date-background-color);\n color: var(--rdp-range_start-color);\n}\n\n.rdp-range_middle {\n background-color: var(--rdp-range_middle-background-color);\n font: var(--rdp-range_middle-font);\n}\n\n.rdp-range_middle .rdp-day_button {\n border-color: transparent;\n border: unset;\n border-radius: unset;\n color: var(--rdp-range_middle-color);\n}\n\n.rdp-range_end {\n background: var(--rdp-range_end-background);\n color: var(--rdp-range_end-color);\n}\n\n.rdp-range_end .rdp-day_button {\n color: var(--rdp-range_start-color);\n background-color: var(--rdp-range_end-date-background-color);\n}\n\n.rdp-range_start.rdp-range_end {\n background: revert;\n}\n\n.rdp-focusable {\n cursor: pointer;\n}";
|
25643
|
+
styleInject(css_248z$L);
|
25596
25644
|
|
25597
25645
|
const CustomDatePicker = ({
|
25598
25646
|
minDate,
|
@@ -26190,8 +26238,8 @@ const StateDropdown = ({
|
|
26190
26238
|
});
|
26191
26239
|
};
|
26192
26240
|
|
26193
|
-
var css_248z$
|
26194
|
-
styleInject(css_248z$
|
26241
|
+
var css_248z$K = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-plus-icon {\n border-radius: 16px;\n border-style: none;\n text-align: center;\n text-decoration: none;\n cursor: pointer;\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n gap: 8px;\n background-color: var(--hover-color);\n padding: 2px 8px 2px 2px;\n border: 1px solid var(--secondary-icon-color);\n}\n.ff-plus-icon .button-icon {\n width: 20px;\n height: 20px;\n border: 1px solid var(--primary-icon-color);\n border-radius: 50%;\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n background-color: var(--secondary-icon-color);\n}\n.ff-plus-icon .button-icon .ff-icon-color path {\n color: var(--primary-icon-color);\n}\n.ff-plus-icon .icon-name {\n color: var(--secondary-icon-color);\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n}\n.ff-plus-icon:hover {\n border: 1px solid transparent;\n background-color: var(--secondary-icon-color);\n}\n.ff-plus-icon:hover .icon-name {\n font-weight: 600;\n color: var(--primary-icon-color);\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n}\n.ff-plus-icon:hover .button-icon {\n width: 20px;\n height: 20px;\n border: 1px solid transparent;\n border-radius: 50%;\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n background-color: var(--hover-color);\n}\n.ff-plus-icon:hover .button-icon .ff-icon-color path {\n color: var(--secondary-icon-color);\n}";
|
26242
|
+
styleInject(css_248z$K);
|
26195
26243
|
|
26196
26244
|
const IconButton = /*#__PURE__*/forwardRef(({
|
26197
26245
|
label,
|
@@ -26220,8 +26268,8 @@ const IconButton = /*#__PURE__*/forwardRef(({
|
|
26220
26268
|
});
|
26221
26269
|
});
|
26222
26270
|
|
26223
|
-
var css_248z$
|
26224
|
-
styleInject(css_248z$
|
26271
|
+
var css_248z$J = ".ff-modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: var(--modal-background-color);\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n flex-direction: column;\n}\n\n.ff-modal-container {\n border-radius: 8px;\n overflow: hidden;\n}\n\n.ff-modal-content {\n background: var(--ff-mini-modal-border);\n position: relative;\n max-width: 100%;\n padding: 16px;\n}\n.ff-modal-content .ff-modal-header {\n height: 32px;\n width: 100%;\n}\n\n.modal-bottom-border {\n border-bottom-left-radius: 8px;\n border-bottom-right-radius: 8px;\n}\n\n.modal-top-border {\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n}\n\n.ff-modal-footer {\n background-color: var(--expandable-menu-option-bg);\n max-width: 100%;\n width: 100%;\n height: 32px;\n display: flex;\n flex-direction: row;\n justify-content: end;\n align-items: center;\n gap: 8px;\n padding: 4px 16px;\n}";
|
26272
|
+
styleInject(css_248z$J);
|
26225
26273
|
|
26226
26274
|
const useKeyboardActions = actions => {
|
26227
26275
|
useEffect(() => {
|
@@ -26320,8 +26368,8 @@ const DragAndDrop = {
|
|
26320
26368
|
DNDUtilities
|
26321
26369
|
};
|
26322
26370
|
|
26323
|
-
var css_248z$
|
26324
|
-
styleInject(css_248z$
|
26371
|
+
var css_248z$I = ".ff_variable_input_container .ff_label_container {\n display: flex;\n align-items: center;\n margin-bottom: 4px;\n}\n.ff_variable_input_container .ff_label_container.ff_danger_label .ff_input_label {\n color: var(--error);\n}\n.ff_variable_input_container .ff_label_container.ff_danger_label .ff_required_asterisk {\n color: var(--error);\n}\n.ff_variable_input_container .ff_required_asterisk {\n color: var(--input-error-text-color);\n font-size: 1.1em;\n margin-right: 4px;\n}\n.ff_variable_input_container .ff_input_label {\n font-size: 14px;\n font-weight: 500;\n color: var(--text-color);\n}\n.ff_variable_input_container .ff_input_label.ff_no_hover {\n color: var(--toggle-disable-icon-color);\n}\n.ff_variable_input_container .ff_input_label.ff_disabled_label {\n color: var(--toggle-disable-icon-color);\n cursor: not-allowed;\n}\n.ff_variable_input_container .ff_input_label.ff_danger_label {\n color: var(--error);\n}\n.ff_variable_input_container .ff_content_editable {\n min-width: 8rem;\n border: 1px solid var(--input-default-border-color);\n padding: 8px;\n min-height: 30px;\n border-radius: 4px;\n font-size: 14px;\n line-height: 20px;\n transition: border-color 0.2s ease;\n position: relative;\n text-align: left;\n display: flex;\n align-items: center;\n overflow: auto;\n}\n.ff_variable_input_container .ff_content_editable .ff_var_red {\n color: var(--status-rejected-text-color);\n}\n.ff_variable_input_container .ff_content_editable .ff_var_def_color {\n color: var(--text-color);\n}\n.ff_variable_input_container .ff_content_editable .ff_var_green {\n color: var(--status-success-text-color);\n}\n.ff_variable_input_container .ff_content_editable::after {\n content: \"*\";\n color: var(--input-error-text-color);\n font-size: 1.2em;\n position: absolute;\n top: 2px;\n right: 2px;\n display: none;\n}\n.ff_variable_input_container .ff_content_editable.ff_required::after {\n display: inline;\n}\n.ff_variable_input_container .ff_content_editable.ff_required_empty:focus-within, .ff_variable_input_container .ff_content_editable.ff_required_empty:focus {\n border-color: var(--input-error-text-color);\n}\n.ff_variable_input_container .ff_content_editable:empty::before {\n content: attr(data-placeholder);\n color: var(--ff-search-filed-placeholder-text);\n position: absolute;\n user-select: none;\n pointer-events: none;\n font-size: medium;\n}\n.ff_variable_input_container .ff_content_editable.ff_disabled {\n pointer-events: none;\n opacity: 0.5;\n background-color: var(--input-default-border-color);\n}\n.ff_variable_input_container .ff_content_editable.ff_invalid_input {\n border: 1px solid var(--input-error-text-color);\n}\n.ff_variable_input_container .ff_suggestions {\n border: 1px solid var(--input-default-border-color);\n margin-top: 4px;\n padding: 4px;\n border-radius: 4px;\n list-style-type: none;\n background-color: var(--ff-select-background-color);\n max-height: 150px;\n overflow-y: auto;\n}\n.ff_variable_input_container .ff_suggestion_item {\n padding: 4px;\n cursor: pointer;\n}\n.ff_variable_input_container .ff_suggestion_item:hover {\n background-color: var(--ff-select-background-color);\n}";
|
26372
|
+
styleInject(css_248z$I);
|
26325
26373
|
|
26326
26374
|
const VariableInput = ({
|
26327
26375
|
type = 'url',
|
@@ -26599,8 +26647,8 @@ const VariableInput = ({
|
|
26599
26647
|
});
|
26600
26648
|
};
|
26601
26649
|
|
26602
|
-
var css_248z$
|
26603
|
-
styleInject(css_248z$
|
26650
|
+
var css_248z$H = ".ff-all-project {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n}\n.ff-all-project .ff-all-project-dropdown {\n width: fit-content;\n border-radius: 16px;\n color: var(--expandable-menu-default-bg);\n line-height: 18px;\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n padding: 3px;\n cursor: pointer;\n}\n.ff-all-project .ff-all-project-dropdown--selected {\n background-color: var(--primary-icon-color);\n border-radius: 20px;\n}\n.ff-all-project .ff-all-project-dropdown--selected .ff-all-project-container {\n border-radius: 20px;\n box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2509803922) inset;\n background: linear-gradient(90deg, var(--brand-color) 0%, var(--button-background-gradient-color) 100%);\n text-wrap-mode: nowrap;\n}\n.ff-all-project .ff-all-project-dropdown:not(.ff-all-project-dropdown--selected):hover .projects-label {\n position: relative;\n white-space: nowrap;\n}\n.ff-all-project .ff-all-project-dropdown:not(.ff-all-project-dropdown--selected):hover .projects-label:hover::after {\n animation: oscillate-border-width 0.5s ease-in-out forwards;\n}\n.ff-all-project .ff-all-project-dropdown:not(.ff-all-project-dropdown--selected):hover .projects-label::after {\n content: \"\";\n position: absolute;\n top: 20px;\n left: 0%;\n width: 0%;\n height: 2px;\n background-color: var(--ff-app-header-menu-border-bottom-color);\n border-radius: 4px;\n transition: width 0.15s ease-in-out;\n}\n.ff-all-project .ff-all-project-dropdown .ff-all-project-container {\n display: flex;\n padding: 4px;\n gap: 4px;\n justify-content: center;\n text-wrap-mode: nowrap;\n}\n.ff-all-project .ff-all-project-dropdown .ff-all-project-container .label-icon {\n height: 16px;\n width: 16px;\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n}\n.ff-all-project .ff-projects-dropdown {\n width: 202px;\n position: absolute;\n top: 50px;\n padding: 1px;\n border: 0.5px solid var(--expandable-menu-default-bg);\n border-radius: 4px;\n background-color: var(--secondary-icon-color);\n color: var(--primary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .scroll {\n max-height: 150px;\n overflow-x: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ff-all-project .ff-projects-dropdown .scroll::-webkit-scrollbar {\n width: 2px;\n}\n.ff-all-project .ff-projects-dropdown .scroll::-webkit-scrollbar-thumb {\n background: var(--primary-icon-color);\n border-radius: 2px;\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options {\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n justify-content: flex-start;\n gap: 4px;\n white-space: nowrap;\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options .ff-projects-icons {\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n height: 24px;\n width: 24px;\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options .ff-projects-icons svg path {\n fill: var(--primary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options.ff-selected-option,\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options:hover {\n background-color: var(--primary-icon-color);\n color: var(--secondary-icon-color);\n border-radius: 4px;\n margin: 1px;\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options.ff-selected-option svg path,\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options:hover svg path {\n fill: var(--secondary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .ff-all-projects-option {\n margin-top: 1px;\n}\n.ff-all-project .ff-projects-dropdown .ff-all-projects-option,\n.ff-all-project .ff-projects-dropdown .ff-selected-option {\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n justify-content: flex-start;\n gap: 4px;\n background-color: var(--primary-icon-color);\n color: var(--secondary-icon-color);\n border-radius: 4px;\n}\n.ff-all-project .ff-projects-dropdown .ff-all-projects-option .ff-projects-icons svg path,\n.ff-all-project .ff-projects-dropdown .ff-selected-option .ff-projects-icons svg path {\n fill: var(--secondary-icon-color);\n}\n\n@keyframes oscillate-border-width {\n 0% {\n width: 50%;\n left: 25%;\n }\n 50% {\n width: 70%;\n left: 15%;\n }\n 100% {\n width: 50%;\n left: 25%;\n }\n}";
|
26651
|
+
styleInject(css_248z$H);
|
26604
26652
|
|
26605
26653
|
const AllProjectsDropdown = ({
|
26606
26654
|
onClick = () => {},
|
@@ -26736,8 +26784,8 @@ const AllProjectsDropdown = ({
|
|
26736
26784
|
});
|
26737
26785
|
};
|
26738
26786
|
|
26739
|
-
var css_248z$
|
26740
|
-
styleInject(css_248z$
|
26787
|
+
var css_248z$G = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-pie-chart-container .ff-pie-chart-tooltip {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-pie-chart-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n font-size: var(--fontSize);\n}\n.ff-pie-chart-container .ff-pie-chart-border {\n display: inline-block;\n border: 2px solid var(--pie-chart-border-color);\n border-radius: 50%;\n}\n.ff-pie-chart-container .ff-pie-chart-tooltip {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -100%);\n padding: 8px;\n border-radius: 4px;\n background-color: var(--tooltip-bg-color);\n color: var(--primary-icon-color);\n font-weight: 400;\n pointer-events: none;\n}\n.ff-pie-chart-container .ff-pie-chart-legend {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 16px;\n}\n.ff-pie-chart-container .ff-pie-chart-legend .ff-pie-chart-legend-item {\n display: flex;\n flex-direction: column;\n align-items: center;\n text-align: center;\n}\n.ff-pie-chart-container .ff-pie-chart-legend .ff-pie-chart-legend-value {\n color: var(--drawer-title-color);\n}";
|
26788
|
+
styleInject(css_248z$G);
|
26741
26789
|
|
26742
26790
|
const calculateArc$3 = ({
|
26743
26791
|
x,
|
@@ -26891,8 +26939,8 @@ const PieChart = ({
|
|
26891
26939
|
});
|
26892
26940
|
};
|
26893
26941
|
|
26894
|
-
var css_248z$
|
26895
|
-
styleInject(css_248z$
|
26942
|
+
var css_248z$F = ".ff-app-header-main {\n display: flex;\n}\n.ff-app-header-main .ff-app-header {\n display: flex;\n flex-basis: 100%;\n justify-content: space-between;\n background-color: var(--brand-color);\n padding-left: 8px;\n height: 40px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-left-container {\n display: flex;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-left-container .ff-app-header-logo-icon {\n padding: 4px;\n height: 24px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar {\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--brand-color);\n transform: translateY(12px);\n border-radius: 20px;\n padding: 4px;\n padding-bottom: 16px;\n z-index: 1000;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items {\n display: flex;\n align-items: center;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item {\n margin-left: 8px;\n padding: 7px;\n color: var(--ff-header-text-color);\n cursor: pointer;\n display: flex;\n position: relative;\n flex: 1 1 auto;\n overflow: hidden;\n transition: flex-grow 1s ease, opacity 1s ease, max-width 1s ease;\n max-width: 150px; /* Initial max-width */\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item:not(.ff-app-header-nav-bar-item--selected):hover::after {\n animation: oscillate-border-width 0.5s ease-in-out forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 25%;\n width: 0%;\n height: 2px;\n background: var(--ff-app-header-menu-border-bottom-color);\n border-radius: 4px;\n transition: width 0.15s ease-in-out;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-nav-bar-item-label {\n white-space: nowrap;\n align-content: center;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected {\n padding: 3px;\n background-color: var(--primary-icon-color);\n border-radius: 20px;\n flex-grow: 12; /* Increase size on hover */\n max-width: 700px;\n opacity: 1;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected .ff-app-header-nav-bar-item-label {\n box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2509803922) inset;\n background: linear-gradient(90deg, var(--brand-color) 0%, var(--button-background-gradient-color) 100%);\n border-radius: 20px;\n padding: 4px 8px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected :last-child {\n margin-right: 3px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected :first-child {\n margin: 0;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container {\n display: flex;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item {\n color: var(--ff-header-submenu-text-color);\n align-content: center;\n position: relative;\n white-space: nowrap;\n padding-left: 8px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item:not(.ff-app-header-nav-bar-submenu-item--selected):hover::after {\n animation: oscillate-border-width 0.5s ease-in-out forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 25%;\n width: 0%;\n height: 2px;\n border-radius: 4px;\n transition: width 0.15s ease-in-out;\n background: var(--ff-app-header-submenu-border-bottom-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected {\n color: var(--ff-header-submenu-highlight-text-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 20%;\n width: 70%;\n height: 2px;\n border-radius: 4px;\n box-shadow: 0px 1px 0.2px 0px rgba(0, 0, 0, 0.1607843137);\n background: var(--ff-app-header-submenu-border-bottom-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container {\n display: flex;\n align-items: center;\n overflow: hidden;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item {\n margin-right: 8px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item:last-child {\n margin: 0px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item .ff-tooltip-container {\n display: inline;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item .ff-tooltip-container .ff-icon-container {\n padding: 2px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item--selected {\n background: var(--brand-color);\n border-radius: 5px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item--selected :hover {\n background: transparent;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item--selected svg path {\n fill: var(--primary-button-text-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected .ff-app-header-quickmenu-container {\n animation: quickmenu-expand 1s ease forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item:not(.ff-app-header-nav-bar-item--selected) .ff-app-header-quickmenu-container {\n animation: quickmenu-collapse 1s ease forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .more-menu {\n width: 40px;\n display: flex;\n justify-content: center;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .more-menu .ff-app-header-more-icon svg {\n cursor: pointer;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .more-menu .ff-app-header-more-icon svg path {\n fill: var(--primary-icon-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-left-content,\n.ff-app-header-main .ff-app-header .ff-app-header-right-content {\n height: 24px;\n padding: 8px;\n align-content: center;\n}\n\n@keyframes oscillate-border-width {\n 0% {\n width: 50%;\n left: 25%;\n }\n 50% {\n width: 70%;\n left: 15%;\n }\n 100% {\n width: 50%;\n left: 25%;\n }\n}\n@keyframes quickmenu-expand {\n from {\n max-height: 0;\n opacity: 0;\n }\n to {\n max-height: 500px; /* Ensure this value covers the full height of your quick menu */\n opacity: 1;\n }\n}\n@keyframes quickmenu-collapse {\n from {\n max-height: 500px;\n opacity: 1;\n }\n to {\n max-height: 0;\n opacity: 0;\n }\n}";
|
26943
|
+
styleInject(css_248z$F);
|
26896
26944
|
|
26897
26945
|
const AppHeader = ({
|
26898
26946
|
logoIconName = 'fireflink_icon',
|
@@ -27034,8 +27082,8 @@ const AppHeader = ({
|
|
27034
27082
|
});
|
27035
27083
|
};
|
27036
27084
|
|
27037
|
-
var css_248z$
|
27038
|
-
styleInject(css_248z$
|
27085
|
+
var css_248z$E = ".ff_rounded_lg {\n border-radius: 8px;\n}\n\n.ff_paper_basic_style {\n padding: 20px;\n background-color: var(--ff-paper-dark-background-color);\n}\n\n.ff_paper_default_style {\n padding: 20px;\n background-color: var(--ff-paper-background-color);\n}";
|
27086
|
+
styleInject(css_248z$E);
|
27039
27087
|
|
27040
27088
|
const Paper = ({
|
27041
27089
|
children,
|
@@ -27051,8 +27099,8 @@ const Paper = ({
|
|
27051
27099
|
});
|
27052
27100
|
};
|
27053
27101
|
|
27054
|
-
var css_248z$
|
27055
|
-
styleInject(css_248z$
|
27102
|
+
var css_248z$D = ".fontXs, .ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header, .ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-dashboard-donut-chart-section {\n display: flex;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section.legend-position-bottom {\n flex-direction: column;\n}\n.ff-dashboard-donut-chart-section.legend-position-left {\n flex-direction: row-reverse;\n}\n.ff-dashboard-donut-chart-section-table-legend {\n flex-direction: row;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container {\n text-align: center;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg {\n display: block;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\n font-weight: 600;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\n font-weight: 500;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container .ff-donut-chart-tooltip {\n position: absolute;\n padding: 5px;\n border-radius: 4px;\n pointer-events: none;\n background-color: var(--tooltip-bg-color);\n color: var(--tooltip-text-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container {\n display: flex;\n flex-wrap: wrap;\n width: 100%;\n gap: var(--donut-legend-gap, 5px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container .ff-legend-item {\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n align-items: center;\n flex: 1 1 calc(33.33% - var(--donut-legend-gap, 5px));\n}\n.ff-dashboard-donut-chart-section .ff-legend-container .ff-legend-item .ff-legend-value {\n white-space: nowrap;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-count-2 .ff-legend-item, .ff-dashboard-donut-chart-section .ff-legend-container.ff-count-4 .ff-legend-item {\n flex: 1 1 calc(50% - var(--donut-legend-gap, 5px));\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-count-5 .ff-legend-item:nth-child(-n+3) {\n flex: 1 1 calc(33.33% - var(--donut-legend-gap, 5px));\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-count-5 .ff-legend-item:nth-child(n+4) {\n flex: 1 1 calc(50% - var(--donut-legend-gap, 5px));\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-count-3 .ff-legend-item, .ff-dashboard-donut-chart-section .ff-legend-container.ff-count-6 .ff-legend-item, .ff-dashboard-donut-chart-section .ff-legend-container.ff-count-more .ff-legend-item {\n flex: 1 1 calc(33.33% - var(--donut-legend-gap, 5px));\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-side-legend {\n flex-direction: column;\n flex-wrap: wrap;\n height: 200px;\n width: auto;\n justify-content: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-side-legend .ff-legend-item {\n flex: 0 0 auto !important;\n width: 100%;\n justify-content: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-side-legend.ff-count-2 .ff-legend-item, .ff-dashboard-donut-chart-section .ff-legend-container.ff-side-legend.ff-count-4 .ff-legend-item {\n height: calc(50% - var(--donut-legend-gap, 5px));\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-side-legend.ff-count-3 .ff-legend-item, .ff-dashboard-donut-chart-section .ff-legend-container.ff-side-legend.ff-count-5 .ff-legend-item, .ff-dashboard-donut-chart-section .ff-legend-container.ff-side-legend.ff-count-6 .ff-legend-item, .ff-dashboard-donut-chart-section .ff-legend-container.ff-side-legend.ff-count-more .ff-legend-item {\n height: calc(33.33% - var(--donut-legend-gap, 5px));\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: var(--donut-legend-gap, 5px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend .ff-legend-item {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend .ff-legend-item .ff-legend-capsule {\n background-color: var(--status-success-text-color);\n color: var(--tooltip-text-color);\n border-radius: 15px;\n min-width: 25px;\n height: 18px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend .ff-legend-item .ff-legend-key {\n margin-left: 8px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table-wrapper {\n border: 1px solid var(--border-color);\n border-radius: 4px;\n margin-left: 1rem;\n overflow-y: auto;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table {\n width: 100%;\n min-width: 300px;\n border-collapse: collapse;\n text-align: left;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-table-thead {\n position: static;\n top: auto;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header {\n font-weight: bold;\n background-color: var(--tabs-bg-color);\n color: var(--input-hover-border-color);\n padding: 7px 5px 9px 20px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header:last-child {\n text-align: right;\n padding-right: 10px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header:nth-last-child(2) {\n width: 58px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-capsule {\n background-color: var(--status-success-text-color);\n color: var(--tooltip-text-color);\n border-radius: 1rem;\n min-width: 22px;\n height: 16px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name {\n margin-left: 10px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n padding: 4px 8px 4px 8px;\n color: var(--input-hover-border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name:last-child,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage:last-child,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count:last-child {\n padding-right: 22px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name {\n display: flex;\n align-items: baseline;\n gap: 5px;\n color: var(--input-hover-border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n text-align: right;\n}";
|
27103
|
+
styleInject(css_248z$D);
|
27056
27104
|
|
27057
27105
|
const calculateArc$2 = (x, y, radius, startAngle, endAngle) => {
|
27058
27106
|
const startX = x + radius * Math.cos(startAngle);
|
@@ -27468,9 +27516,9 @@ const DashboardDonutChart = ({
|
|
27468
27516
|
|
27469
27517
|
var propTypes = {exports: {}};
|
27470
27518
|
|
27471
|
-
var reactIs
|
27519
|
+
var reactIs = {exports: {}};
|
27472
27520
|
|
27473
|
-
var reactIs_production_min
|
27521
|
+
var reactIs_production_min = {};
|
27474
27522
|
|
27475
27523
|
/** @license React v16.13.1
|
27476
27524
|
* react-is.production.min.js
|
@@ -27480,10 +27528,10 @@ var reactIs_production_min$1 = {};
|
|
27480
27528
|
* This source code is licensed under the MIT license found in the
|
27481
27529
|
* LICENSE file in the root directory of this source tree.
|
27482
27530
|
*/
|
27483
|
-
var hasRequiredReactIs_production_min
|
27484
|
-
function requireReactIs_production_min
|
27485
|
-
if (hasRequiredReactIs_production_min
|
27486
|
-
hasRequiredReactIs_production_min
|
27531
|
+
var hasRequiredReactIs_production_min;
|
27532
|
+
function requireReactIs_production_min() {
|
27533
|
+
if (hasRequiredReactIs_production_min) return reactIs_production_min;
|
27534
|
+
hasRequiredReactIs_production_min = 1;
|
27487
27535
|
var b = "function" === typeof Symbol && Symbol.for,
|
27488
27536
|
c = b ? Symbol.for("react.element") : 60103,
|
27489
27537
|
d = b ? Symbol.for("react.portal") : 60106,
|
@@ -27536,64 +27584,64 @@ function requireReactIs_production_min$1() {
|
|
27536
27584
|
function A(a) {
|
27537
27585
|
return z(a) === m;
|
27538
27586
|
}
|
27539
|
-
reactIs_production_min
|
27540
|
-
reactIs_production_min
|
27541
|
-
reactIs_production_min
|
27542
|
-
reactIs_production_min
|
27543
|
-
reactIs_production_min
|
27544
|
-
reactIs_production_min
|
27545
|
-
reactIs_production_min
|
27546
|
-
reactIs_production_min
|
27547
|
-
reactIs_production_min
|
27548
|
-
reactIs_production_min
|
27549
|
-
reactIs_production_min
|
27550
|
-
reactIs_production_min
|
27551
|
-
reactIs_production_min
|
27552
|
-
reactIs_production_min
|
27587
|
+
reactIs_production_min.AsyncMode = l;
|
27588
|
+
reactIs_production_min.ConcurrentMode = m;
|
27589
|
+
reactIs_production_min.ContextConsumer = k;
|
27590
|
+
reactIs_production_min.ContextProvider = h;
|
27591
|
+
reactIs_production_min.Element = c;
|
27592
|
+
reactIs_production_min.ForwardRef = n;
|
27593
|
+
reactIs_production_min.Fragment = e;
|
27594
|
+
reactIs_production_min.Lazy = t;
|
27595
|
+
reactIs_production_min.Memo = r;
|
27596
|
+
reactIs_production_min.Portal = d;
|
27597
|
+
reactIs_production_min.Profiler = g;
|
27598
|
+
reactIs_production_min.StrictMode = f;
|
27599
|
+
reactIs_production_min.Suspense = p;
|
27600
|
+
reactIs_production_min.isAsyncMode = function (a) {
|
27553
27601
|
return A(a) || z(a) === l;
|
27554
27602
|
};
|
27555
|
-
reactIs_production_min
|
27556
|
-
reactIs_production_min
|
27603
|
+
reactIs_production_min.isConcurrentMode = A;
|
27604
|
+
reactIs_production_min.isContextConsumer = function (a) {
|
27557
27605
|
return z(a) === k;
|
27558
27606
|
};
|
27559
|
-
reactIs_production_min
|
27607
|
+
reactIs_production_min.isContextProvider = function (a) {
|
27560
27608
|
return z(a) === h;
|
27561
27609
|
};
|
27562
|
-
reactIs_production_min
|
27610
|
+
reactIs_production_min.isElement = function (a) {
|
27563
27611
|
return "object" === typeof a && null !== a && a.$$typeof === c;
|
27564
27612
|
};
|
27565
|
-
reactIs_production_min
|
27613
|
+
reactIs_production_min.isForwardRef = function (a) {
|
27566
27614
|
return z(a) === n;
|
27567
27615
|
};
|
27568
|
-
reactIs_production_min
|
27616
|
+
reactIs_production_min.isFragment = function (a) {
|
27569
27617
|
return z(a) === e;
|
27570
27618
|
};
|
27571
|
-
reactIs_production_min
|
27619
|
+
reactIs_production_min.isLazy = function (a) {
|
27572
27620
|
return z(a) === t;
|
27573
27621
|
};
|
27574
|
-
reactIs_production_min
|
27622
|
+
reactIs_production_min.isMemo = function (a) {
|
27575
27623
|
return z(a) === r;
|
27576
27624
|
};
|
27577
|
-
reactIs_production_min
|
27625
|
+
reactIs_production_min.isPortal = function (a) {
|
27578
27626
|
return z(a) === d;
|
27579
27627
|
};
|
27580
|
-
reactIs_production_min
|
27628
|
+
reactIs_production_min.isProfiler = function (a) {
|
27581
27629
|
return z(a) === g;
|
27582
27630
|
};
|
27583
|
-
reactIs_production_min
|
27631
|
+
reactIs_production_min.isStrictMode = function (a) {
|
27584
27632
|
return z(a) === f;
|
27585
27633
|
};
|
27586
|
-
reactIs_production_min
|
27634
|
+
reactIs_production_min.isSuspense = function (a) {
|
27587
27635
|
return z(a) === p;
|
27588
27636
|
};
|
27589
|
-
reactIs_production_min
|
27637
|
+
reactIs_production_min.isValidElementType = function (a) {
|
27590
27638
|
return "string" === typeof a || "function" === typeof a || a === e || a === m || a === g || a === f || a === p || a === q || "object" === typeof a && null !== a && (a.$$typeof === t || a.$$typeof === r || a.$$typeof === h || a.$$typeof === k || a.$$typeof === n || a.$$typeof === w || a.$$typeof === x || a.$$typeof === y || a.$$typeof === v);
|
27591
27639
|
};
|
27592
|
-
reactIs_production_min
|
27593
|
-
return reactIs_production_min
|
27640
|
+
reactIs_production_min.typeOf = z;
|
27641
|
+
return reactIs_production_min;
|
27594
27642
|
}
|
27595
27643
|
|
27596
|
-
var reactIs_development
|
27644
|
+
var reactIs_development = {};
|
27597
27645
|
|
27598
27646
|
/** @license React v16.13.1
|
27599
27647
|
* react-is.development.js
|
@@ -27603,10 +27651,10 @@ var reactIs_development$1 = {};
|
|
27603
27651
|
* This source code is licensed under the MIT license found in the
|
27604
27652
|
* LICENSE file in the root directory of this source tree.
|
27605
27653
|
*/
|
27606
|
-
var hasRequiredReactIs_development
|
27607
|
-
function requireReactIs_development
|
27608
|
-
if (hasRequiredReactIs_development
|
27609
|
-
hasRequiredReactIs_development
|
27654
|
+
var hasRequiredReactIs_development;
|
27655
|
+
function requireReactIs_development() {
|
27656
|
+
if (hasRequiredReactIs_development) return reactIs_development;
|
27657
|
+
hasRequiredReactIs_development = 1;
|
27610
27658
|
if (process.env.NODE_ENV !== "production") {
|
27611
27659
|
(function () {
|
27612
27660
|
|
@@ -27733,49 +27781,49 @@ function requireReactIs_development$1() {
|
|
27733
27781
|
function isSuspense(object) {
|
27734
27782
|
return typeOf(object) === REACT_SUSPENSE_TYPE;
|
27735
27783
|
}
|
27736
|
-
reactIs_development
|
27737
|
-
reactIs_development
|
27738
|
-
reactIs_development
|
27739
|
-
reactIs_development
|
27740
|
-
reactIs_development
|
27741
|
-
reactIs_development
|
27742
|
-
reactIs_development
|
27743
|
-
reactIs_development
|
27744
|
-
reactIs_development
|
27745
|
-
reactIs_development
|
27746
|
-
reactIs_development
|
27747
|
-
reactIs_development
|
27748
|
-
reactIs_development
|
27749
|
-
reactIs_development
|
27750
|
-
reactIs_development
|
27751
|
-
reactIs_development
|
27752
|
-
reactIs_development
|
27753
|
-
reactIs_development
|
27754
|
-
reactIs_development
|
27755
|
-
reactIs_development
|
27756
|
-
reactIs_development
|
27757
|
-
reactIs_development
|
27758
|
-
reactIs_development
|
27759
|
-
reactIs_development
|
27760
|
-
reactIs_development
|
27761
|
-
reactIs_development
|
27762
|
-
reactIs_development
|
27763
|
-
reactIs_development
|
27784
|
+
reactIs_development.AsyncMode = AsyncMode;
|
27785
|
+
reactIs_development.ConcurrentMode = ConcurrentMode;
|
27786
|
+
reactIs_development.ContextConsumer = ContextConsumer;
|
27787
|
+
reactIs_development.ContextProvider = ContextProvider;
|
27788
|
+
reactIs_development.Element = Element;
|
27789
|
+
reactIs_development.ForwardRef = ForwardRef;
|
27790
|
+
reactIs_development.Fragment = Fragment;
|
27791
|
+
reactIs_development.Lazy = Lazy;
|
27792
|
+
reactIs_development.Memo = Memo;
|
27793
|
+
reactIs_development.Portal = Portal;
|
27794
|
+
reactIs_development.Profiler = Profiler;
|
27795
|
+
reactIs_development.StrictMode = StrictMode;
|
27796
|
+
reactIs_development.Suspense = Suspense;
|
27797
|
+
reactIs_development.isAsyncMode = isAsyncMode;
|
27798
|
+
reactIs_development.isConcurrentMode = isConcurrentMode;
|
27799
|
+
reactIs_development.isContextConsumer = isContextConsumer;
|
27800
|
+
reactIs_development.isContextProvider = isContextProvider;
|
27801
|
+
reactIs_development.isElement = isElement;
|
27802
|
+
reactIs_development.isForwardRef = isForwardRef;
|
27803
|
+
reactIs_development.isFragment = isFragment;
|
27804
|
+
reactIs_development.isLazy = isLazy;
|
27805
|
+
reactIs_development.isMemo = isMemo;
|
27806
|
+
reactIs_development.isPortal = isPortal;
|
27807
|
+
reactIs_development.isProfiler = isProfiler;
|
27808
|
+
reactIs_development.isStrictMode = isStrictMode;
|
27809
|
+
reactIs_development.isSuspense = isSuspense;
|
27810
|
+
reactIs_development.isValidElementType = isValidElementType;
|
27811
|
+
reactIs_development.typeOf = typeOf;
|
27764
27812
|
})();
|
27765
27813
|
}
|
27766
|
-
return reactIs_development
|
27814
|
+
return reactIs_development;
|
27767
27815
|
}
|
27768
27816
|
|
27769
|
-
var hasRequiredReactIs
|
27770
|
-
function requireReactIs
|
27771
|
-
if (hasRequiredReactIs
|
27772
|
-
hasRequiredReactIs
|
27817
|
+
var hasRequiredReactIs;
|
27818
|
+
function requireReactIs() {
|
27819
|
+
if (hasRequiredReactIs) return reactIs.exports;
|
27820
|
+
hasRequiredReactIs = 1;
|
27773
27821
|
if (process.env.NODE_ENV === 'production') {
|
27774
|
-
reactIs
|
27822
|
+
reactIs.exports = requireReactIs_production_min();
|
27775
27823
|
} else {
|
27776
|
-
reactIs
|
27824
|
+
reactIs.exports = requireReactIs_development();
|
27777
27825
|
}
|
27778
|
-
return reactIs
|
27826
|
+
return reactIs.exports;
|
27779
27827
|
}
|
27780
27828
|
|
27781
27829
|
/*
|
@@ -27990,7 +28038,7 @@ var hasRequiredFactoryWithTypeCheckers;
|
|
27990
28038
|
function requireFactoryWithTypeCheckers() {
|
27991
28039
|
if (hasRequiredFactoryWithTypeCheckers) return factoryWithTypeCheckers;
|
27992
28040
|
hasRequiredFactoryWithTypeCheckers = 1;
|
27993
|
-
var ReactIs = requireReactIs
|
28041
|
+
var ReactIs = requireReactIs();
|
27994
28042
|
var assign = requireObjectAssign();
|
27995
28043
|
var ReactPropTypesSecret = /*@__PURE__*/requireReactPropTypesSecret();
|
27996
28044
|
var has = /*@__PURE__*/requireHas();
|
@@ -28603,7 +28651,7 @@ function requirePropTypes() {
|
|
28603
28651
|
if (hasRequiredPropTypes) return propTypes.exports;
|
28604
28652
|
hasRequiredPropTypes = 1;
|
28605
28653
|
if (process.env.NODE_ENV !== 'production') {
|
28606
|
-
var ReactIs = requireReactIs
|
28654
|
+
var ReactIs = requireReactIs();
|
28607
28655
|
|
28608
28656
|
// By explicitly using `prop-types` you are opting into new development behavior.
|
28609
28657
|
// http://fb.me/prop-types-in-prod
|
@@ -28838,316 +28886,6 @@ ReCAPTCHA.defaultProps = {
|
|
28838
28886
|
badge: "bottomright"
|
28839
28887
|
};
|
28840
28888
|
|
28841
|
-
var reactIs = {exports: {}};
|
28842
|
-
|
28843
|
-
var reactIs_production_min = {};
|
28844
|
-
|
28845
|
-
/** @license React v16.13.1
|
28846
|
-
* react-is.production.min.js
|
28847
|
-
*
|
28848
|
-
* Copyright (c) Facebook, Inc. and its affiliates.
|
28849
|
-
*
|
28850
|
-
* This source code is licensed under the MIT license found in the
|
28851
|
-
* LICENSE file in the root directory of this source tree.
|
28852
|
-
*/
|
28853
|
-
var hasRequiredReactIs_production_min;
|
28854
|
-
function requireReactIs_production_min() {
|
28855
|
-
if (hasRequiredReactIs_production_min) return reactIs_production_min;
|
28856
|
-
hasRequiredReactIs_production_min = 1;
|
28857
|
-
var b = "function" === typeof Symbol && Symbol.for,
|
28858
|
-
c = b ? Symbol.for("react.element") : 60103,
|
28859
|
-
d = b ? Symbol.for("react.portal") : 60106,
|
28860
|
-
e = b ? Symbol.for("react.fragment") : 60107,
|
28861
|
-
f = b ? Symbol.for("react.strict_mode") : 60108,
|
28862
|
-
g = b ? Symbol.for("react.profiler") : 60114,
|
28863
|
-
h = b ? Symbol.for("react.provider") : 60109,
|
28864
|
-
k = b ? Symbol.for("react.context") : 60110,
|
28865
|
-
l = b ? Symbol.for("react.async_mode") : 60111,
|
28866
|
-
m = b ? Symbol.for("react.concurrent_mode") : 60111,
|
28867
|
-
n = b ? Symbol.for("react.forward_ref") : 60112,
|
28868
|
-
p = b ? Symbol.for("react.suspense") : 60113,
|
28869
|
-
q = b ? Symbol.for("react.suspense_list") : 60120,
|
28870
|
-
r = b ? Symbol.for("react.memo") : 60115,
|
28871
|
-
t = b ? Symbol.for("react.lazy") : 60116,
|
28872
|
-
v = b ? Symbol.for("react.block") : 60121,
|
28873
|
-
w = b ? Symbol.for("react.fundamental") : 60117,
|
28874
|
-
x = b ? Symbol.for("react.responder") : 60118,
|
28875
|
-
y = b ? Symbol.for("react.scope") : 60119;
|
28876
|
-
function z(a) {
|
28877
|
-
if ("object" === typeof a && null !== a) {
|
28878
|
-
var u = a.$$typeof;
|
28879
|
-
switch (u) {
|
28880
|
-
case c:
|
28881
|
-
switch (a = a.type, a) {
|
28882
|
-
case l:
|
28883
|
-
case m:
|
28884
|
-
case e:
|
28885
|
-
case g:
|
28886
|
-
case f:
|
28887
|
-
case p:
|
28888
|
-
return a;
|
28889
|
-
default:
|
28890
|
-
switch (a = a && a.$$typeof, a) {
|
28891
|
-
case k:
|
28892
|
-
case n:
|
28893
|
-
case t:
|
28894
|
-
case r:
|
28895
|
-
case h:
|
28896
|
-
return a;
|
28897
|
-
default:
|
28898
|
-
return u;
|
28899
|
-
}
|
28900
|
-
}
|
28901
|
-
case d:
|
28902
|
-
return u;
|
28903
|
-
}
|
28904
|
-
}
|
28905
|
-
}
|
28906
|
-
function A(a) {
|
28907
|
-
return z(a) === m;
|
28908
|
-
}
|
28909
|
-
reactIs_production_min.AsyncMode = l;
|
28910
|
-
reactIs_production_min.ConcurrentMode = m;
|
28911
|
-
reactIs_production_min.ContextConsumer = k;
|
28912
|
-
reactIs_production_min.ContextProvider = h;
|
28913
|
-
reactIs_production_min.Element = c;
|
28914
|
-
reactIs_production_min.ForwardRef = n;
|
28915
|
-
reactIs_production_min.Fragment = e;
|
28916
|
-
reactIs_production_min.Lazy = t;
|
28917
|
-
reactIs_production_min.Memo = r;
|
28918
|
-
reactIs_production_min.Portal = d;
|
28919
|
-
reactIs_production_min.Profiler = g;
|
28920
|
-
reactIs_production_min.StrictMode = f;
|
28921
|
-
reactIs_production_min.Suspense = p;
|
28922
|
-
reactIs_production_min.isAsyncMode = function (a) {
|
28923
|
-
return A(a) || z(a) === l;
|
28924
|
-
};
|
28925
|
-
reactIs_production_min.isConcurrentMode = A;
|
28926
|
-
reactIs_production_min.isContextConsumer = function (a) {
|
28927
|
-
return z(a) === k;
|
28928
|
-
};
|
28929
|
-
reactIs_production_min.isContextProvider = function (a) {
|
28930
|
-
return z(a) === h;
|
28931
|
-
};
|
28932
|
-
reactIs_production_min.isElement = function (a) {
|
28933
|
-
return "object" === typeof a && null !== a && a.$$typeof === c;
|
28934
|
-
};
|
28935
|
-
reactIs_production_min.isForwardRef = function (a) {
|
28936
|
-
return z(a) === n;
|
28937
|
-
};
|
28938
|
-
reactIs_production_min.isFragment = function (a) {
|
28939
|
-
return z(a) === e;
|
28940
|
-
};
|
28941
|
-
reactIs_production_min.isLazy = function (a) {
|
28942
|
-
return z(a) === t;
|
28943
|
-
};
|
28944
|
-
reactIs_production_min.isMemo = function (a) {
|
28945
|
-
return z(a) === r;
|
28946
|
-
};
|
28947
|
-
reactIs_production_min.isPortal = function (a) {
|
28948
|
-
return z(a) === d;
|
28949
|
-
};
|
28950
|
-
reactIs_production_min.isProfiler = function (a) {
|
28951
|
-
return z(a) === g;
|
28952
|
-
};
|
28953
|
-
reactIs_production_min.isStrictMode = function (a) {
|
28954
|
-
return z(a) === f;
|
28955
|
-
};
|
28956
|
-
reactIs_production_min.isSuspense = function (a) {
|
28957
|
-
return z(a) === p;
|
28958
|
-
};
|
28959
|
-
reactIs_production_min.isValidElementType = function (a) {
|
28960
|
-
return "string" === typeof a || "function" === typeof a || a === e || a === m || a === g || a === f || a === p || a === q || "object" === typeof a && null !== a && (a.$$typeof === t || a.$$typeof === r || a.$$typeof === h || a.$$typeof === k || a.$$typeof === n || a.$$typeof === w || a.$$typeof === x || a.$$typeof === y || a.$$typeof === v);
|
28961
|
-
};
|
28962
|
-
reactIs_production_min.typeOf = z;
|
28963
|
-
return reactIs_production_min;
|
28964
|
-
}
|
28965
|
-
|
28966
|
-
var reactIs_development = {};
|
28967
|
-
|
28968
|
-
/** @license React v16.13.1
|
28969
|
-
* react-is.development.js
|
28970
|
-
*
|
28971
|
-
* Copyright (c) Facebook, Inc. and its affiliates.
|
28972
|
-
*
|
28973
|
-
* This source code is licensed under the MIT license found in the
|
28974
|
-
* LICENSE file in the root directory of this source tree.
|
28975
|
-
*/
|
28976
|
-
var hasRequiredReactIs_development;
|
28977
|
-
function requireReactIs_development() {
|
28978
|
-
if (hasRequiredReactIs_development) return reactIs_development;
|
28979
|
-
hasRequiredReactIs_development = 1;
|
28980
|
-
if (process.env.NODE_ENV !== "production") {
|
28981
|
-
(function () {
|
28982
|
-
|
28983
|
-
// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
|
28984
|
-
// nor polyfill, then a plain number is used for performance.
|
28985
|
-
var hasSymbol = typeof Symbol === 'function' && Symbol.for;
|
28986
|
-
var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
|
28987
|
-
var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
|
28988
|
-
var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
|
28989
|
-
var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
|
28990
|
-
var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
|
28991
|
-
var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
|
28992
|
-
var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace; // TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary
|
28993
|
-
// (unstable) APIs that have been removed. Can we remove the symbols?
|
28994
|
-
|
28995
|
-
var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
|
28996
|
-
var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
|
28997
|
-
var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
|
28998
|
-
var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
|
28999
|
-
var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
|
29000
|
-
var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
|
29001
|
-
var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
|
29002
|
-
var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for('react.block') : 0xead9;
|
29003
|
-
var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
|
29004
|
-
var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
|
29005
|
-
var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
|
29006
|
-
function isValidElementType(type) {
|
29007
|
-
return typeof type === 'string' || typeof type === 'function' ||
|
29008
|
-
// Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
|
29009
|
-
type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
|
29010
|
-
}
|
29011
|
-
function typeOf(object) {
|
29012
|
-
if (typeof object === 'object' && object !== null) {
|
29013
|
-
var $$typeof = object.$$typeof;
|
29014
|
-
switch ($$typeof) {
|
29015
|
-
case REACT_ELEMENT_TYPE:
|
29016
|
-
var type = object.type;
|
29017
|
-
switch (type) {
|
29018
|
-
case REACT_ASYNC_MODE_TYPE:
|
29019
|
-
case REACT_CONCURRENT_MODE_TYPE:
|
29020
|
-
case REACT_FRAGMENT_TYPE:
|
29021
|
-
case REACT_PROFILER_TYPE:
|
29022
|
-
case REACT_STRICT_MODE_TYPE:
|
29023
|
-
case REACT_SUSPENSE_TYPE:
|
29024
|
-
return type;
|
29025
|
-
default:
|
29026
|
-
var $$typeofType = type && type.$$typeof;
|
29027
|
-
switch ($$typeofType) {
|
29028
|
-
case REACT_CONTEXT_TYPE:
|
29029
|
-
case REACT_FORWARD_REF_TYPE:
|
29030
|
-
case REACT_LAZY_TYPE:
|
29031
|
-
case REACT_MEMO_TYPE:
|
29032
|
-
case REACT_PROVIDER_TYPE:
|
29033
|
-
return $$typeofType;
|
29034
|
-
default:
|
29035
|
-
return $$typeof;
|
29036
|
-
}
|
29037
|
-
}
|
29038
|
-
case REACT_PORTAL_TYPE:
|
29039
|
-
return $$typeof;
|
29040
|
-
}
|
29041
|
-
}
|
29042
|
-
return undefined;
|
29043
|
-
} // AsyncMode is deprecated along with isAsyncMode
|
29044
|
-
|
29045
|
-
var AsyncMode = REACT_ASYNC_MODE_TYPE;
|
29046
|
-
var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
|
29047
|
-
var ContextConsumer = REACT_CONTEXT_TYPE;
|
29048
|
-
var ContextProvider = REACT_PROVIDER_TYPE;
|
29049
|
-
var Element = REACT_ELEMENT_TYPE;
|
29050
|
-
var ForwardRef = REACT_FORWARD_REF_TYPE;
|
29051
|
-
var Fragment = REACT_FRAGMENT_TYPE;
|
29052
|
-
var Lazy = REACT_LAZY_TYPE;
|
29053
|
-
var Memo = REACT_MEMO_TYPE;
|
29054
|
-
var Portal = REACT_PORTAL_TYPE;
|
29055
|
-
var Profiler = REACT_PROFILER_TYPE;
|
29056
|
-
var StrictMode = REACT_STRICT_MODE_TYPE;
|
29057
|
-
var Suspense = REACT_SUSPENSE_TYPE;
|
29058
|
-
var hasWarnedAboutDeprecatedIsAsyncMode = false; // AsyncMode should be deprecated
|
29059
|
-
|
29060
|
-
function isAsyncMode(object) {
|
29061
|
-
{
|
29062
|
-
if (!hasWarnedAboutDeprecatedIsAsyncMode) {
|
29063
|
-
hasWarnedAboutDeprecatedIsAsyncMode = true; // Using console['warn'] to evade Babel and ESLint
|
29064
|
-
|
29065
|
-
console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
|
29066
|
-
}
|
29067
|
-
}
|
29068
|
-
return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
|
29069
|
-
}
|
29070
|
-
function isConcurrentMode(object) {
|
29071
|
-
return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
|
29072
|
-
}
|
29073
|
-
function isContextConsumer(object) {
|
29074
|
-
return typeOf(object) === REACT_CONTEXT_TYPE;
|
29075
|
-
}
|
29076
|
-
function isContextProvider(object) {
|
29077
|
-
return typeOf(object) === REACT_PROVIDER_TYPE;
|
29078
|
-
}
|
29079
|
-
function isElement(object) {
|
29080
|
-
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
29081
|
-
}
|
29082
|
-
function isForwardRef(object) {
|
29083
|
-
return typeOf(object) === REACT_FORWARD_REF_TYPE;
|
29084
|
-
}
|
29085
|
-
function isFragment(object) {
|
29086
|
-
return typeOf(object) === REACT_FRAGMENT_TYPE;
|
29087
|
-
}
|
29088
|
-
function isLazy(object) {
|
29089
|
-
return typeOf(object) === REACT_LAZY_TYPE;
|
29090
|
-
}
|
29091
|
-
function isMemo(object) {
|
29092
|
-
return typeOf(object) === REACT_MEMO_TYPE;
|
29093
|
-
}
|
29094
|
-
function isPortal(object) {
|
29095
|
-
return typeOf(object) === REACT_PORTAL_TYPE;
|
29096
|
-
}
|
29097
|
-
function isProfiler(object) {
|
29098
|
-
return typeOf(object) === REACT_PROFILER_TYPE;
|
29099
|
-
}
|
29100
|
-
function isStrictMode(object) {
|
29101
|
-
return typeOf(object) === REACT_STRICT_MODE_TYPE;
|
29102
|
-
}
|
29103
|
-
function isSuspense(object) {
|
29104
|
-
return typeOf(object) === REACT_SUSPENSE_TYPE;
|
29105
|
-
}
|
29106
|
-
reactIs_development.AsyncMode = AsyncMode;
|
29107
|
-
reactIs_development.ConcurrentMode = ConcurrentMode;
|
29108
|
-
reactIs_development.ContextConsumer = ContextConsumer;
|
29109
|
-
reactIs_development.ContextProvider = ContextProvider;
|
29110
|
-
reactIs_development.Element = Element;
|
29111
|
-
reactIs_development.ForwardRef = ForwardRef;
|
29112
|
-
reactIs_development.Fragment = Fragment;
|
29113
|
-
reactIs_development.Lazy = Lazy;
|
29114
|
-
reactIs_development.Memo = Memo;
|
29115
|
-
reactIs_development.Portal = Portal;
|
29116
|
-
reactIs_development.Profiler = Profiler;
|
29117
|
-
reactIs_development.StrictMode = StrictMode;
|
29118
|
-
reactIs_development.Suspense = Suspense;
|
29119
|
-
reactIs_development.isAsyncMode = isAsyncMode;
|
29120
|
-
reactIs_development.isConcurrentMode = isConcurrentMode;
|
29121
|
-
reactIs_development.isContextConsumer = isContextConsumer;
|
29122
|
-
reactIs_development.isContextProvider = isContextProvider;
|
29123
|
-
reactIs_development.isElement = isElement;
|
29124
|
-
reactIs_development.isForwardRef = isForwardRef;
|
29125
|
-
reactIs_development.isFragment = isFragment;
|
29126
|
-
reactIs_development.isLazy = isLazy;
|
29127
|
-
reactIs_development.isMemo = isMemo;
|
29128
|
-
reactIs_development.isPortal = isPortal;
|
29129
|
-
reactIs_development.isProfiler = isProfiler;
|
29130
|
-
reactIs_development.isStrictMode = isStrictMode;
|
29131
|
-
reactIs_development.isSuspense = isSuspense;
|
29132
|
-
reactIs_development.isValidElementType = isValidElementType;
|
29133
|
-
reactIs_development.typeOf = typeOf;
|
29134
|
-
})();
|
29135
|
-
}
|
29136
|
-
return reactIs_development;
|
29137
|
-
}
|
29138
|
-
|
29139
|
-
var hasRequiredReactIs;
|
29140
|
-
function requireReactIs() {
|
29141
|
-
if (hasRequiredReactIs) return reactIs.exports;
|
29142
|
-
hasRequiredReactIs = 1;
|
29143
|
-
if (process.env.NODE_ENV === 'production') {
|
29144
|
-
reactIs.exports = requireReactIs_production_min();
|
29145
|
-
} else {
|
29146
|
-
reactIs.exports = requireReactIs_development();
|
29147
|
-
}
|
29148
|
-
return reactIs.exports;
|
29149
|
-
}
|
29150
|
-
|
29151
28889
|
var hoistNonReactStatics_cjs;
|
29152
28890
|
var hasRequiredHoistNonReactStatics_cjs;
|
29153
28891
|
function requireHoistNonReactStatics_cjs() {
|
@@ -29493,8 +29231,8 @@ var RecaptchaWrapper = makeAsyncScript(getURL, {
|
|
29493
29231
|
} : {}
|
29494
29232
|
})(ReCAPTCHA);
|
29495
29233
|
|
29496
|
-
var css_248z$
|
29497
|
-
styleInject(css_248z$
|
29234
|
+
var css_248z$C = ".ff-recaptcha-wrapper {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.ff-recaptcha-wrapper .ff-recaptcha-error {\n color: var(--input-error-text-color);\n font-size: 12px;\n margin-top: 4px;\n}";
|
29235
|
+
styleInject(css_248z$C);
|
29498
29236
|
|
29499
29237
|
// Extend the props to include React.RefAttributes
|
29500
29238
|
const FixedReCAPTCHA = RecaptchaWrapper;
|
@@ -29539,8 +29277,8 @@ const nlpDropdownDefaultCSSData = {
|
|
29539
29277
|
dropDownWrapperPadding: 0
|
29540
29278
|
};
|
29541
29279
|
|
29542
|
-
var css_248z$
|
29543
|
-
styleInject(css_248z$
|
29280
|
+
var css_248z$B = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-nlp-option {\n color: var(--nlp-option-color);\n display: flex;\n gap: 4px;\n align-items: center;\n}\n\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper {\n max-height: 256px;\n z-index: 999;\n position: absolute;\n border: 1px solid var(--nlp-border-color);\n box-sizing: border-box;\n margin-top: 4px;\n border-radius: 4px;\n background-color: var(--primary-icon-color);\n overflow: hidden auto;\n display: flex;\n justify-content: space-between;\n overflow: hidden;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-options-primary-wrapper {\n max-height: 240px;\n z-index: 100;\n min-width: 290px;\n box-sizing: border-box;\n overflow: scroll;\n scrollbar-width: none;\n flex-grow: 1;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-options-primary-wrapper::-webkit-scrollbar {\n display: none;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-option {\n width: calc(100% - 10px);\n border: 1px solid transparent;\n padding: 0 4px;\n overflow: hidden;\n white-space: nowrap;\n height: 32px;\n text-overflow: ellipsis;\n cursor: pointer;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-option:hover {\n background-color: var(--nlp-hover-color);\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-no-option {\n width: calc(100% - 16px);\n margin: 0;\n overflow: hidden;\n padding: 0 8px;\n white-space: nowrap;\n text-overflow: ellipsis;\n cursor: not-allowed;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-data-show {\n width: 380px;\n height: 235px;\n border: 1px solid transparent;\n overflow: scroll;\n scrollbar-width: none;\n padding: 8px;\n border: 1px solid var(--nlp-border-color);\n position: relative;\n border-radius: 4px;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-data-hide {\n display: none;\n}\n.ff-nlp-dropdown-wrapper .nlp-categories {\n padding: 0px 2px;\n gap: 10px;\n border-radius: 2px;\n background: var(--nlp-background-color);\n color: var(--nlp-color);\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-data-side-menu {\n display: flex;\n flex-direction: column;\n row-gap: 8px;\n color: var(--nlp-option-color);\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-data-show::-webkit-scrollbar {\n display: none;\n}\n.ff-nlp-dropdown-wrapper .nlp-details-header {\n color: var(--status-skipped-text-color);\n display: flex;\n flex-direction: column;\n}\n.ff-nlp-dropdown-wrapper .nlp-details {\n color: var(--status-skipped-text-color);\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper-main {\n display: flex;\n flex-direction: column;\n width: 302px;\n justify-content: space-between;\n flex-grow: 1;\n}\n\n.ff-nlp {\n color: var(--nlp-color);\n}\n\n.ff-sg {\n color: var(--nlp-step-group-color);\n background-color: var(--nlp-step-group-background);\n}\n\n.ff-pe {\n color: var(--nlp-pe-color);\n background-color: var(--nlp-pe-background);\n}\n\n.ff-nlp-web-service-div {\n display: flex;\n justify-content: center;\n align-items: center;\n}";
|
29281
|
+
styleInject(css_248z$B);
|
29544
29282
|
|
29545
29283
|
const NlpDropdown = ({
|
29546
29284
|
onSelectBlur,
|
@@ -29793,8 +29531,8 @@ const NlpDropdown = ({
|
|
29793
29531
|
});
|
29794
29532
|
};
|
29795
29533
|
|
29796
|
-
var css_248z$
|
29797
|
-
styleInject(css_248z$
|
29534
|
+
var css_248z$A = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-nlp-input-wrapper {\n position: relative;\n}\n.ff-nlp-input-wrapper .ff-nlp-input {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n min-height: 32px;\n min-width: 482px;\n display: flex;\n align-items: end;\n position: relative;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset {\n margin: 0;\n padding: 25px 0px 0px 8px;\n border: 1px solid transparent;\n box-sizing: border-box;\n height: 32px;\n width: 100%;\n border-radius: 4px;\n display: block;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--border-radius {\n border-radius: 0px 4px 4px 0px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--no-label {\n padding: 30px 0px 0px 8px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--default {\n opacity: 0;\n border-color: var(--nlp-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--active {\n opacity: 1;\n border-color: var(--nlp-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--option {\n opacity: 1;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--no-border {\n border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--error {\n border-color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend {\n padding: 0 2px;\n letter-spacing: 0.5px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--default {\n transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n opacity: 0;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--active {\n transition: opacity 0.25s ease-out, transform 0.25s ease-out, font-size 0.25s ease-out, padding 0.25s ease-out;\n opacity: 1;\n color: var(--nlp-input-placeholder-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--option {\n opacity: 1;\n color: var(--nlp-input-placeholder-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--error {\n color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--required {\n margin-right: 2px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container {\n position: absolute;\n top: 6px;\n right: auto;\n bottom: auto;\n left: auto;\n width: calc(100% - 38px);\n height: 32px;\n padding: 0 28px 0 8px;\n border-radius: 4px;\n border: 1px solid transparent;\n z-index: 100;\n background: transparent;\n outline: none;\n color: var(--ff-nlp-input-text-color);\n text-indent: 22px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container:hover ~ .ff-nlp-input-label {\n color: var(--nlp-input-placeholder-color);\n padding-left: 26px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--border-radius {\n border-radius: 0px 4px 4px 0px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--default {\n opacity: 1;\n border-color: var(--nlp-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--default:hover {\n border-color: var(--nlp-input-placeholder-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--default:hover ~ .ff-nlp-input-fieldset--option {\n border-color: var(--ff-nlp-input-text-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--default:hover ~ .ff-nlp-input-fieldset--option .ff-nlp-input-legend--option {\n color: var(--ff-nlp-input-text-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--no-label {\n min-height: calc(100% - 2px);\n margin-top: 0px;\n top: 0px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--active {\n border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--active:hover {\n border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--no-border {\n border: none;\n border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--no-border:hover {\n border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--no-border:hover ~ .ff-nlp-input-fieldset--no-border {\n border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--disable {\n border-color: var(--ff-nlp-input-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--disable:hover {\n border-color: var(--ff-nlp-input-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--disable:hover ~ .ff-nlp-input-label--default {\n color: var(--ff-nlp-input-default-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--error {\n border-color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-container--error:hover {\n border-color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label {\n position: absolute;\n top: 13px;\n right: auto;\n bottom: auto;\n left: 8px;\n z-index: 1;\n font-size: 12px;\n top: 60%;\n padding-left: 8px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label--default {\n transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n opacity: 1;\n color: var(--nlp-input-placeholder-color);\n transform: translateY(-50%);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label--active {\n transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n opacity: 0;\n transform: translateY(-150%);\n padding: 0 6px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label--required {\n margin-right: 2px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-arrow {\n position: absolute;\n top: 60%;\n height: 100%;\n right: 10px;\n transform: rotateX(0deg) translateY(-50%);\n cursor: pointer;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-arrow--no-label {\n top: 50%;\n}\n.ff-nlp-input-wrapper-error-text {\n position: absolute;\n top: auto;\n right: auto;\n bottom: -14px;\n left: 12px;\n white-space: nowrap;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label {\n display: flex;\n align-items: center;\n padding-left: 26px;\n gap: 4px;\n}\n.ff-nlp-input-wrapper .ff-nlp-help_icon {\n position: absolute;\n bottom: 2px;\n left: 8px;\n width: 30px;\n height: 30px;\n z-index: 100;\n cursor: pointer;\n}\n\n.ff-nlp-input-arrow {\n z-index: 111;\n}\n\n.icon-container {\n position: relative;\n display: inline-block;\n}\n\n.icon-label {\n position: absolute;\n bottom: 100%;\n left: 50%;\n transform: translateX(-55%);\n transform: translateY(-145%);\n margin-bottom: 5px;\n visibility: hidden;\n opacity: 0;\n transition: opacity 0.3s ease, visibility 0s linear 0.3s;\n background-color: var(--tooltip-bg-color);\n color: var(--tooltip-text-color);\n padding: 2px 5px;\n border-radius: 3px;\n white-space: nowrap;\n}\n\n.icon-container:hover .icon-label {\n visibility: visible;\n opacity: 1;\n transition-delay: 0s;\n}\n\n.help-icon-label {\n position: absolute;\n bottom: 80%;\n left: 96%;\n transform: translateX(-50%);\n margin-bottom: 5px;\n visibility: hidden;\n opacity: 0;\n transition: opacity 0.3s ease, visibility 0s linear 0.3s;\n background-color: var(--tooltip-bg-color);\n color: var(--tooltip-text-color);\n padding: 2px 5px;\n border-radius: 3px;\n white-space: nowrap;\n}\n\n.help-icon-container:hover .help-icon-label {\n visibility: visible;\n opacity: 1;\n transition-delay: 0s;\n}";
|
29535
|
+
styleInject(css_248z$A);
|
29798
29536
|
|
29799
29537
|
const nlpInputReducer = (state, action) => {
|
29800
29538
|
switch (action.type) {
|
@@ -30133,8 +29871,8 @@ const NlpInput = ({
|
|
30133
29871
|
});
|
30134
29872
|
};
|
30135
29873
|
|
30136
|
-
var css_248z$
|
30137
|
-
styleInject(css_248z$
|
29874
|
+
var css_248z$z = ".ff-icon-radio-group {\n width: 237px;\n height: 24px;\n display: flex;\n align-items: center;\n gap: 47px;\n position: relative;\n}\n\n.ff-icon-radio-button {\n width: 24px;\n height: 24px;\n border-radius: 4px;\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n position: relative;\n z-index: 5;\n}\n.ff-icon-radio-button.selected {\n background-color: var(--brand-color);\n}\n.ff-icon-radio-button.disabled {\n opacity: 50%;\n cursor: not-allowed;\n}\n.ff-icon-radio-button .icon-container {\n width: 24px;\n height: 24px;\n border-radius: 4px;\n display: flex;\n justify-content: center;\n align-items: center;\n border: 1px solid var(--border-color);\n background: var(--drawer-footer-bg);\n}\n.ff-icon-radio-button .icon-container:hover {\n background: var(--border-color);\n}\n.ff-icon-radio-button .icon-container.selected {\n background-color: var(--brand-color);\n}\n.ff-icon-radio-button .icon-container .icon {\n width: 14px;\n height: 14px;\n}\n\n.line-connector {\n position: absolute;\n top: 50%;\n left: 0;\n right: 0;\n height: 1px;\n background-color: var(--border-color);\n z-index: 3;\n border-radius: 2px 0px 0px 0px;\n opacity: 0px;\n}";
|
29875
|
+
styleInject(css_248z$z);
|
30138
29876
|
|
30139
29877
|
const IconRadioGroup = ({
|
30140
29878
|
items,
|
@@ -30185,8 +29923,8 @@ const IconRadioGroup = ({
|
|
30185
29923
|
});
|
30186
29924
|
};
|
30187
29925
|
|
30188
|
-
var css_248z$
|
30189
|
-
styleInject(css_248z$
|
29926
|
+
var css_248z$y = ".ff-machine-input-field-wrapper {\n min-width: 100px;\n height: 32px;\n position: relative;\n cursor: pointer;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse {\n height: 100%;\n width: 100%;\n border: 1px solid var(--ff-machine-input-field-border-color);\n padding: 0 8px 0 0;\n border-radius: 4px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field:hover,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse:hover {\n border-color: var(--ff-connecting-branch-color);\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse {\n display: flex;\n align-items: center;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse .ff-machine-icon {\n margin-left: 4px;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper .ff-machine-text,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse .ff-machine-text,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper .ff-machine-text,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse .ff-machine-text {\n max-width: fit-content;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse .ff-machine-text-reverse {\n direction: ltr;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse {\n flex-direction: row-reverse;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse {\n flex-direction: row-reverse;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-label {\n position: absolute;\n top: -6px;\n left: 8px;\n background-color: var(--ff-machine-input-field-label-color);\n border-radius: 4px;\n padding: 1px 2px;\n height: 12px;\n}";
|
29927
|
+
styleInject(css_248z$y);
|
30190
29928
|
|
30191
29929
|
const MachineInputField = ({
|
30192
29930
|
width = '',
|
@@ -30255,11 +29993,11 @@ const MachineInputField = ({
|
|
30255
29993
|
};
|
30256
29994
|
MachineInputField.displayName = 'MachineInputField';
|
30257
29995
|
|
30258
|
-
var css_248z$
|
30259
|
-
styleInject(css_248z$
|
29996
|
+
var css_248z$x = ".ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper {\n height: 66px;\n box-sizing: border-box;\n width: fit-content;\n margin-bottom: 16px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper {\n position: relative;\n display: flex;\n box-sizing: border-box;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-sequential-select-branch {\n width: 240px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow {\n display: flex;\n align-items: center;\n position: relative;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-branch-arrow-wrapper {\n margin: 0;\n width: 40px;\n border-top: 1px solid var(--ff-connecting-branch-color);\n position: relative;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-branch-arrow-wrapper .ff-branch-arrow {\n width: 6px;\n height: 6px;\n background-color: var(--ff-connecting-branch-color);\n clip-path: polygon(100% 50%, 0 100%, 0 0);\n position: absolute;\n right: -1px;\n top: -3px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-select-branch-point {\n width: 5px;\n height: 5px;\n border-radius: 50%;\n background-color: var(--ff-connecting-branch-color);\n position: absolute;\n left: -3px;\n z-index: 102;\n top: 50%;\n transform: translateY(-50%);\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down {\n position: absolute;\n height: 38px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down .ff-select-branch-point {\n width: 5px;\n height: 5px;\n border-radius: 50%;\n background-color: var(--ff-connecting-branch-color);\n position: absolute;\n left: -2px;\n z-index: 102;\n top: 50%;\n transform: translateY(-50%);\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down .ff-select-branch-arrow {\n width: 0;\n height: 62px;\n top: calc(50% + 1px);\n border-left: 1px solid var(--ff-connecting-branch-color);\n z-index: 102;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist {\n box-sizing: border-box;\n width: 240px;\n display: flex;\n justify-content: space-between;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-scope-wrapper {\n display: flex;\n align-items: center;\n margin-right: 12px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-scope-wrapper .ff-scope-text {\n text-transform: capitalize;\n margin: 0;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper {\n display: flex;\n align-items: center;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper #ff-sequential-machine-datalist {\n display: flex;\n align-items: center;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-dataset-icon,\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-run-delete-icon,\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-datalist-text {\n cursor: pointer;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-datalist-text {\n margin: 0 12px 0 0;\n}\n.ff-sequential-connecting-branch-wrapper .ff-sequential-branches-wrapper {\n box-sizing: border-box;\n width: fit-content;\n height: fit-content;\n}";
|
29997
|
+
styleInject(css_248z$x);
|
30260
29998
|
|
30261
|
-
var css_248z$
|
30262
|
-
styleInject(css_248z$
|
29999
|
+
var css_248z$w = ".ff-connecting-branch-grid,\n.ff-connecting-branch-grid-reverse {\n box-sizing: border-box;\n display: grid;\n grid-template-columns: 24px 180px 40px 180px 24px;\n height: 66px;\n margin-bottom: 16px;\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper {\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow {\n position: absolute;\n height: 6px;\n width: 6px;\n background-color: var(--ff-connecting-branch-color);\n z-index: 2;\n clip-path: polygon(0 0, 0% 100%, 100% 50%);\n top: calc(25% - 3px);\n right: -2px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow-reverse {\n position: absolute;\n height: 6px;\n width: 6px;\n background-color: var(--ff-connecting-branch-color);\n z-index: 2;\n left: -2px;\n top: calc(25% - 3px);\n clip-path: polygon(0 50%, 100% 100%, 100% 0);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-container,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-container {\n width: 100%;\n height: 25%;\n border: 1px solid var(--ff-connecting-branch-color);\n border-top: none;\n border-right: none;\n border-bottom-left-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-container-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-container-reverse {\n width: 100%;\n height: 25%;\n border: 1px solid var(--ff-connecting-branch-color);\n border-top: none;\n border-left: none;\n border-bottom-right-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist {\n display: flex;\n padding-top: 4px;\n height: 24px;\n justify-content: flex-end;\n width: 100%;\n align-items: center;\n flex-direction: row;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-dataset-list-branch,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-dataset-list-branch {\n display: flex;\n align-items: center;\n flex-direction: row;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-icon {\n margin-right: 4px;\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-text,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-text {\n margin-right: 8px;\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-delete-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-delete-icon {\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse {\n display: flex;\n padding-top: 4px;\n height: 24px;\n justify-content: flex-end;\n width: 100%;\n align-items: center;\n flex-direction: row-reverse;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-dataset-list-branch,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-dataset-list-branch {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-icon {\n margin-right: 4px;\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-text,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-text {\n margin-right: 8px;\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-delete-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-delete-icon {\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper {\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n border-radius: 50%;\n z-index: 2;\n right: -2px;\n top: calc(50% - 1px);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point-reverse {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n border-radius: 50%;\n z-index: 2;\n left: -2px;\n top: calc(50% - 1px);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow {\n height: 0;\n width: 100%;\n margin-top: calc(50% - 3px);\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n clip-path: polygon(0 0, 0% 100%, 100% 50%);\n top: calc(25% - 3px);\n right: -2px;\n z-index: 2;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow-reverse {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n clip-path: polygon(0 50%, 100% 100%, 100% 0);\n top: calc(25% - 3px);\n left: -1px;\n z-index: 2;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-end-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-end-arrow {\n width: 100%;\n height: 100%;\n margin-top: 17px;\n border-top: 1px solid var(--ff-connecting-branch-color);\n border-right: 1px solid var(--ff-connecting-branch-color);\n border-top-right-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-end-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-end-arrow-reverse {\n width: 100%;\n height: 100%;\n margin-top: 17px;\n border-top: 1px solid var(--ff-connecting-branch-color);\n border-left: 1px solid var(--ff-connecting-branch-color);\n border-top-left-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-browser-button,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-browser-button {\n height: 32px;\n display: flex;\n align-items: center;\n}\n\n.ff-connecting-branch-grid-reverse {\n direction: rtl;\n margin: 0 0 16px 0;\n}";
|
30000
|
+
styleInject(css_248z$w);
|
30263
30001
|
|
30264
30002
|
const DataSetTooltip = ({
|
30265
30003
|
datSetToolTip: {
|
@@ -30522,8 +30260,8 @@ const Branches = ({
|
|
30522
30260
|
});
|
30523
30261
|
};
|
30524
30262
|
|
30525
|
-
var css_248z$
|
30526
|
-
styleInject(css_248z$
|
30263
|
+
var css_248z$v = ".ff-connecting-branch-grid-wrapper {\n box-sizing: border-box;\n}";
|
30264
|
+
styleInject(css_248z$v);
|
30527
30265
|
|
30528
30266
|
const ConnectingBranches = ({
|
30529
30267
|
machineBranchInstances,
|
@@ -30737,8 +30475,8 @@ const SequentialConnectingBranch = ({
|
|
30737
30475
|
});
|
30738
30476
|
};
|
30739
30477
|
|
30740
|
-
var css_248z$
|
30741
|
-
styleInject(css_248z$
|
30478
|
+
var css_248z$u = ".ff-input-field {\n display: none;\n}\n\n.ff-attachment-files {\n display: flex;\n align-items: center;\n gap: 4px;\n line-height: 15px;\n}";
|
30479
|
+
styleInject(css_248z$u);
|
30742
30480
|
|
30743
30481
|
const AttachmentButton = ({
|
30744
30482
|
label,
|
@@ -30915,8 +30653,8 @@ const toast = {
|
|
30915
30653
|
alert: (arg1, arg2) => openToast('alert', arg1, arg2)
|
30916
30654
|
};
|
30917
30655
|
|
30918
|
-
var css_248z$
|
30919
|
-
styleInject(css_248z$
|
30656
|
+
var css_248z$t = "/* Container Styling */\n.toggle-container {\n display: flex;\n background-color: var(--base-bg-color);\n height: 24px;\n border-radius: 6px;\n padding: 4px 2px;\n overflow: hidden;\n width: fit-content;\n box-shadow: 1px 1px 2px 0px var(--base-bg-color), inset -1px -1px 2px var(--base-bg-color), inset 1px -1px 2px var(--ff-toggle-switch-shadow-color), inset -1px 2px 0px var(--ff-toggle-switch-shadow-color);\n align-items: center;\n justify-content: center;\n gap: 4px;\n}\n\n/* Button Styling */\n.toggle-button {\n padding: 4px 2px;\n font-size: 10px;\n font-weight: 500;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n background-color: var(--base-bg-color);\n color: var(--ff-toggle-switch-off-color);\n outline: none;\n transition: all 0.3s ease;\n min-width: 24px;\n height: 20px;\n text-align: center;\n box-shadow: inset 1px 1px 2px 0 var(--base-bg-color), 1px 1px 3px 0 var(--ff-chips-blur-color), -1px -1px 2px 0 var(--base-bg-color), 1px -1px 2px 0 var(--ff-chips-blur-color), -1px 1px 2px 0 var(--ff-chips-blur-color);\n}\n\n/* Active Button */\n.toggle-button.active {\n background-color: var(--ff-line-number-bg);\n color: var(--base-bg-color);\n box-shadow: inset -1px -1px 2px 0 var(--ff-chips-blur-color), 1px 1px 3px 0 var(--ff-chips-blur-color), -1px -1px 2px 0 var(--base-bg-color), -1px 1px 2px 0 var(--ff-chips-blur-color);\n}\n\n/* Button Hover Effect */\n.toggle-button:hover {\n background-color: var(--hover-color);\n color: var(--brand-color);\n}";
|
30657
|
+
styleInject(css_248z$t);
|
30920
30658
|
|
30921
30659
|
const ToggleSwitch = ({
|
30922
30660
|
selected = "text",
|
@@ -30938,8 +30676,8 @@ const ToggleSwitch = ({
|
|
30938
30676
|
});
|
30939
30677
|
};
|
30940
30678
|
|
30941
|
-
var css_248z$
|
30942
|
-
styleInject(css_248z$
|
30679
|
+
var css_248z$s = ".ff-avatar {\n border-radius: 50%;\n overflow: hidden;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n background-color: var(--ff-avatar-background-color);\n}\n.ff-avatar--small {\n width: 32px;\n height: 32px;\n}\n.ff-avatar--medium {\n width: 48px;\n height: 48px;\n}\n.ff-avatar--large {\n width: 64px;\n height: 64px;\n}\n.ff-avatar .ff-avatar-label {\n font-weight: bold;\n text-align: center;\n}";
|
30680
|
+
styleInject(css_248z$s);
|
30943
30681
|
|
30944
30682
|
const Avatar = ({
|
30945
30683
|
variant = "small",
|
@@ -30975,6 +30713,227 @@ const Avatar = ({
|
|
30975
30713
|
});
|
30976
30714
|
};
|
30977
30715
|
|
30716
|
+
var css_248z$r = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-label-edit-text-field .ff-text-field,\n.ff-label-edit-text-field .dropdown, .ff-label-edit-text-field .ff-text-dropdown-field {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-label-edit-text-field .ff-label, .ff-label-edit-text-field .ff-textfield-label {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-label-edit-text-field {\n display: flex;\n flex-direction: column;\n position: relative;\n width: 100%;\n}\n.ff-label-edit-text-field .ff-label-text-field {\n display: flex;\n gap: 5px;\n}\n.ff-label-edit-text-field .ff-label-text-field-with-dropdown,\n.ff-label-edit-text-field .ff-label-text-field-without-dropdown {\n position: relative;\n display: flex;\n align-items: center;\n}\n.ff-label-edit-text-field .ff-label, .ff-label-edit-text-field .ff-textfield-label {\n position: absolute;\n top: 0;\n left: 10px;\n transform: translateY(-50%);\n transition: all 0.2s ease;\n color: var(--label-edit-text-label-color);\n background: var(--label-edit-text-background-color);\n padding: 0 4px;\n}\n.ff-label-edit-text-field .ff-textfield-label {\n top: 5px;\n}\n.ff-label-edit-text-field .display-text {\n padding: 4px;\n border-radius: 4px;\n cursor: pointer;\n display: flex;\n align-items: center;\n}\n.ff-label-edit-text-field .ff-text-field,\n.ff-label-edit-text-field .dropdown {\n border: 1px solid var(--label-edit-text-label-color);\n outline: none;\n width: fit-content;\n}\n.ff-label-edit-text-field .ff-text-field {\n position: relative;\n padding: 0 4px;\n border-radius: 4px;\n}\n.ff-label-edit-text-field .ff-text-dropdown-field {\n flex: 2;\n border: 1px solid var(--label-edit-text-label-color);\n border-radius: 4px 0 0 4px;\n border-right: none;\n border-width: thin;\n padding-left: 5px;\n}\n.ff-label-edit-text-field .ff-text-dropdown-field:focus-visible {\n outline: none;\n}\n.ff-label-edit-text-field .dropdown {\n border-radius: 0 4px 4px 0;\n flex: 1;\n height: inherit;\n}\n.ff-label-edit-text-field .ff-icon-container {\n display: flex;\n gap: 8px;\n align-items: center;\n}\n.ff-label-edit-text-field .ff-icon-container .confirm-icon,\n.ff-label-edit-text-field .ff-icon-container .cancel-icon {\n cursor: pointer;\n}\n.ff-label-edit-text-field .ff-icon-container .disabled-confirm-icon {\n cursor: default;\n opacity: 0.5;\n}\n.ff-label-edit-text-field .error-text {\n margin: 0;\n color: var(--label-edit-error-text);\n}\n\n.custom-edit-text-field {\n height: 10px;\n width: 100px;\n}";
|
30717
|
+
styleInject(css_248z$r);
|
30718
|
+
|
30719
|
+
const getErrorMessage$1 = (inputValue, text, customError, customErrorCondition) => {
|
30720
|
+
if (inputValue === text) {
|
30721
|
+
return 'No changes were made.';
|
30722
|
+
} else if (!inputValue) {
|
30723
|
+
return 'Text is required';
|
30724
|
+
} else if (inputValue.length < 3) {
|
30725
|
+
return 'Please enter at least 3 characters.';
|
30726
|
+
} else ;
|
30727
|
+
return '';
|
30728
|
+
};
|
30729
|
+
const LabelEditTextField = ({
|
30730
|
+
label,
|
30731
|
+
placeholder,
|
30732
|
+
text,
|
30733
|
+
showText = true,
|
30734
|
+
highlightText,
|
30735
|
+
customError,
|
30736
|
+
confirmIcon,
|
30737
|
+
customErrorCondition,
|
30738
|
+
cancelIcon,
|
30739
|
+
variant = 'textField',
|
30740
|
+
onInputChange,
|
30741
|
+
dropdownData = [],
|
30742
|
+
// width,
|
30743
|
+
className,
|
30744
|
+
height,
|
30745
|
+
isOpen = false,
|
30746
|
+
confirmAction,
|
30747
|
+
onClick,
|
30748
|
+
tooltip
|
30749
|
+
}) => {
|
30750
|
+
const [isEditing, setIsEditing] = useState(isOpen ?? false);
|
30751
|
+
const [inputValue, setInputValue] = useState(text ?? '');
|
30752
|
+
const [dropdownValue, setDropdownValue] = useState(dropdownData[0]?.value ?? '');
|
30753
|
+
const [showError, setShowError] = useState('');
|
30754
|
+
const [disabled, isDisabled] = useState(true);
|
30755
|
+
const [isTextFieldModified, setIsTextFieldModified] = useState(false);
|
30756
|
+
const isThrowingError = showError && isEditing ? true : false;
|
30757
|
+
const containerRef = useRef(null);
|
30758
|
+
const cancelRef = useRef(null);
|
30759
|
+
const [clickTimeout, setClickTimeout] = useState(null);
|
30760
|
+
const handleEsc = useEscapeKey('Escape');
|
30761
|
+
useEffect(() => {
|
30762
|
+
return () => {
|
30763
|
+
if (clickTimeout) {
|
30764
|
+
clearTimeout(clickTimeout);
|
30765
|
+
}
|
30766
|
+
};
|
30767
|
+
}, [clickTimeout]);
|
30768
|
+
const handleDoubleClick = () => {
|
30769
|
+
if (clickTimeout) {
|
30770
|
+
clearTimeout(clickTimeout);
|
30771
|
+
setClickTimeout(null);
|
30772
|
+
}
|
30773
|
+
setIsEditing(true);
|
30774
|
+
setShowError('');
|
30775
|
+
};
|
30776
|
+
const handleSingleClick = () => {
|
30777
|
+
if (onClick) onClick();
|
30778
|
+
};
|
30779
|
+
const handleClick = () => {
|
30780
|
+
if (clickTimeout) {
|
30781
|
+
clearTimeout(clickTimeout);
|
30782
|
+
setClickTimeout(null);
|
30783
|
+
}
|
30784
|
+
const timeout = window.setTimeout(() => {
|
30785
|
+
handleSingleClick();
|
30786
|
+
setClickTimeout(null);
|
30787
|
+
}, 1000);
|
30788
|
+
setClickTimeout(timeout);
|
30789
|
+
};
|
30790
|
+
const handleConfirm = () => {
|
30791
|
+
let errorMessage = '';
|
30792
|
+
if (inputValue.length === 0 || inputValue.trim().length === 0) {
|
30793
|
+
errorMessage = 'Please type any text.';
|
30794
|
+
} else if (inputValue.length < 3) {
|
30795
|
+
errorMessage = 'Please enter at least 3 characters.';
|
30796
|
+
} else if (customErrorCondition) {
|
30797
|
+
errorMessage = customError ?? 'Invalid input.';
|
30798
|
+
}
|
30799
|
+
if (errorMessage) {
|
30800
|
+
setShowError(errorMessage);
|
30801
|
+
} else {
|
30802
|
+
setIsEditing(false);
|
30803
|
+
setShowError('');
|
30804
|
+
if (confirmAction) confirmAction(inputValue, dropdownValue);
|
30805
|
+
}
|
30806
|
+
};
|
30807
|
+
const handleCancel = () => {
|
30808
|
+
setInputValue(text ?? '');
|
30809
|
+
setDropdownValue(dropdownData[0]?.value ?? '');
|
30810
|
+
setIsEditing(false);
|
30811
|
+
setShowError('');
|
30812
|
+
setIsTextFieldModified(false);
|
30813
|
+
};
|
30814
|
+
const handleTextFieldChange = e => {
|
30815
|
+
const newValue = e.target.value;
|
30816
|
+
setInputValue(newValue);
|
30817
|
+
isDisabled(false);
|
30818
|
+
if (newValue.length === 0 || newValue.trim().length === 0) {
|
30819
|
+
setShowError('Please type any text.');
|
30820
|
+
} else if (newValue.length < 3) {
|
30821
|
+
setShowError('Please enter at least 3 characters.');
|
30822
|
+
} else if (customErrorCondition) {
|
30823
|
+
setShowError(customError ?? 'Invalid input.');
|
30824
|
+
} else {
|
30825
|
+
setShowError('');
|
30826
|
+
}
|
30827
|
+
setIsTextFieldModified(newValue !== text);
|
30828
|
+
if (onInputChange) {
|
30829
|
+
onInputChange(newValue);
|
30830
|
+
}
|
30831
|
+
};
|
30832
|
+
const handleBlur = e => {
|
30833
|
+
if (containerRef.current && !containerRef.current.contains(e.target) && cancelRef.current !== e.target) {
|
30834
|
+
const errorMessage = getErrorMessage$1(inputValue, text ?? '');
|
30835
|
+
if (errorMessage && isEditing) {
|
30836
|
+
setShowError(errorMessage);
|
30837
|
+
} else {
|
30838
|
+
setIsEditing(false);
|
30839
|
+
setShowError('');
|
30840
|
+
}
|
30841
|
+
}
|
30842
|
+
};
|
30843
|
+
useEffect(() => {
|
30844
|
+
document.addEventListener('click', handleBlur);
|
30845
|
+
return () => {
|
30846
|
+
document.removeEventListener('click', handleBlur);
|
30847
|
+
};
|
30848
|
+
}, [inputValue]);
|
30849
|
+
handleEsc(handleCancel);
|
30850
|
+
return jsxs("div", {
|
30851
|
+
className: "ff-label-edit-text-field",
|
30852
|
+
ref: containerRef,
|
30853
|
+
children: [isEditing ? jsxs("div", {
|
30854
|
+
className: "ff-label-text-field",
|
30855
|
+
children: [variant === 'textFieldWithDropdown' ? jsxs("div", {
|
30856
|
+
className: `ff-label-text-field-with-dropdown ${isEditing ? 'open' : ''}`,
|
30857
|
+
style: {
|
30858
|
+
height
|
30859
|
+
},
|
30860
|
+
children: [jsx(Input, {
|
30861
|
+
name: "input",
|
30862
|
+
type: "text",
|
30863
|
+
label: label ? label : '',
|
30864
|
+
disabled: false,
|
30865
|
+
error: isThrowingError,
|
30866
|
+
placeholder: placeholder ? placeholder : '',
|
30867
|
+
value: inputValue,
|
30868
|
+
onChange: handleTextFieldChange,
|
30869
|
+
className: `${className}
|
30870
|
+
|
30871
|
+
${isTextFieldModified ? 'modified' : ''}`
|
30872
|
+
}), jsx(Select$1, {
|
30873
|
+
label: '',
|
30874
|
+
optionsList: dropdownData,
|
30875
|
+
selectedOption: {
|
30876
|
+
value: dropdownValue,
|
30877
|
+
label: dropdownValue
|
30878
|
+
},
|
30879
|
+
onChange: option => setDropdownValue(option.value)
|
30880
|
+
})]
|
30881
|
+
}) : jsx("div", {
|
30882
|
+
className: "ff-label-text-field-without-dropdown",
|
30883
|
+
children: jsx(Input, {
|
30884
|
+
name: "input",
|
30885
|
+
type: "text",
|
30886
|
+
label: label ? label : '',
|
30887
|
+
disabled: false,
|
30888
|
+
placeholder: placeholder ? placeholder : '',
|
30889
|
+
value: inputValue,
|
30890
|
+
onChange: handleTextFieldChange,
|
30891
|
+
className: `${className}
|
30892
|
+
|
30893
|
+
${isTextFieldModified ? 'modified' : ''}`
|
30894
|
+
})
|
30895
|
+
}), jsxs("div", {
|
30896
|
+
className: "ff-icon-container",
|
30897
|
+
children: [confirmIcon && jsx(Icon, {
|
30898
|
+
color: "var(--label-edit-confirm-icon)",
|
30899
|
+
height: 20,
|
30900
|
+
width: 20,
|
30901
|
+
name: confirmIcon.name,
|
30902
|
+
disabled: disabled,
|
30903
|
+
className: `${disabled ? 'disabled-confirm-icon' : 'confirm-icon'}`,
|
30904
|
+
onClick: handleConfirm
|
30905
|
+
}), cancelIcon && jsx(Icon, {
|
30906
|
+
color: "var(--label-edit-cancel-icon)",
|
30907
|
+
height: 12,
|
30908
|
+
width: 20,
|
30909
|
+
name: cancelIcon.name,
|
30910
|
+
className: "cancel-icon",
|
30911
|
+
onClick: handleCancel,
|
30912
|
+
ref: cancelRef
|
30913
|
+
})]
|
30914
|
+
})]
|
30915
|
+
}) : jsx(Tooltip, {
|
30916
|
+
title: tooltip?.tooltipTitle ? tooltip?.tooltipTitle : '',
|
30917
|
+
placement: 'bottom',
|
30918
|
+
children: showText && jsx("span", {
|
30919
|
+
className: "display-text",
|
30920
|
+
onDoubleClick: handleDoubleClick,
|
30921
|
+
role: "button",
|
30922
|
+
onClick: handleClick,
|
30923
|
+
children: jsx(HighlightText, {
|
30924
|
+
text: inputValue,
|
30925
|
+
highlight: highlightText
|
30926
|
+
})
|
30927
|
+
})
|
30928
|
+
}), showError && isEditing && jsx(Typography, {
|
30929
|
+
as: "p",
|
30930
|
+
fontSize: 8,
|
30931
|
+
className: "error-text",
|
30932
|
+
children: showError
|
30933
|
+
})]
|
30934
|
+
});
|
30935
|
+
};
|
30936
|
+
|
30978
30937
|
var css_248z$q = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-label-edit-text-field .ff-text-field {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-label-edit-text-field .ff-label, .ff-label-edit-text-field .ff-textfield-label {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-label-edit-text-field {\n display: flex;\n flex-direction: column;\n position: relative;\n width: 100%;\n}\n.ff-label-edit-text-field .display-text-container {\n display: flex;\n align-items: center;\n gap: 5px;\n}\n.ff-label-edit-text-field .display-text-container .edit-button {\n padding: 4px 8px;\n background-color: var(--button-background-color);\n color: var(--button-text-color);\n border: 1px solid var(--button-border-color);\n border-radius: 4px;\n cursor: pointer;\n font-size: 12px;\n}\n.ff-label-edit-text-field .display-text-container .edit-button:hover {\n background-color: var(--button-hover-background-color);\n}\n.ff-label-edit-text-field .ff-label-text-field {\n display: flex;\n}\n.ff-label-edit-text-field .ff-label-text-field-with-dropdown,\n.ff-label-edit-text-field .ff-label-text-field-without-dropdown {\n position: relative;\n display: flex;\n align-items: center;\n}\n.ff-label-edit-text-field .ff-label, .ff-label-edit-text-field .ff-textfield-label {\n position: absolute;\n top: 0;\n left: 10px;\n transform: translateY(-50%);\n transition: all 0.2s ease;\n color: var(--label-edit-text-label-color);\n background: var(--label-edit-text-background-color);\n padding: 0 4px;\n}\n.ff-label-edit-text-field .ff-textfield-label {\n top: 5px;\n}\n.ff-label-edit-text-field .display-text {\n border-radius: 4px;\n cursor: pointer;\n display: flex;\n align-items: center;\n}\n.ff-label-edit-text-field .ff-text-field {\n outline: none;\n width: fit-content;\n}\n.ff-label-edit-text-field .ff-text-field-error-border {\n border: 1px solid var(--label-edit-error-text);\n}\n.ff-label-edit-text-field .ff-text-field-border {\n border: 1px solid var(--label-edit-text-label-color);\n}\n.ff-label-edit-text-field .ff-text-field-error-text {\n color: var(--label-edit-error-text);\n}\n.ff-label-edit-text-field .ff-text-field-text {\n color: var(--label-edit-text-label-color);\n}\n.ff-label-edit-text-field .ff-text-field {\n padding: 0 4px;\n border-radius: 4px;\n}\n.ff-label-edit-text-field .ff-icon-container {\n display: flex;\n gap: 8px;\n align-items: center;\n}\n.ff-label-edit-text-field .ff-icon-container .confirm-icon,\n.ff-label-edit-text-field .ff-icon-container .cancel-icon {\n cursor: pointer;\n}\n.ff-label-edit-text-field .error-text {\n color: var(--label-edit-error-text);\n margin: 0;\n}";
|
30979
30938
|
styleInject(css_248z$q);
|
30980
30939
|
|
@@ -54122,6 +54081,10 @@ const getTreeDetails = (action, oldData, newData, index) => {
|
|
54122
54081
|
};
|
54123
54082
|
|
54124
54083
|
const handleTreeNodeSect = (data, key, isChecked) => {
|
54084
|
+
if (!key) {
|
54085
|
+
// Handle the case where key is undefined (e.g., return early or throw an error)
|
54086
|
+
throw new Error('Key is required');
|
54087
|
+
}
|
54125
54088
|
const nodesMap = new Map();
|
54126
54089
|
// Build a map for quick access to nodes by key
|
54127
54090
|
data.forEach(node => nodesMap.set(node.key, node));
|