pixel-react 1.9.8 → 1.10.0
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/1fb4472b34e4fe07.css +1 -0
- package/lib/StyleGuide/ColorPalette/ColorPalette.stories.d.ts +6 -0
- package/lib/StyleGuide/Typography/Typography.stories.d.ts +6 -0
- 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.d.ts +1 -1
- package/lib/components/Accordion/Accordion.stories.d.ts +6 -0
- package/lib/components/Accordion/types.d.ts +10 -2
- package/lib/components/AddButton/AddButton.d.ts +5 -0
- package/lib/components/AddButton/AddButton.stories.d.ts +6 -0
- package/lib/components/AddButton/index.d.ts +1 -0
- package/lib/components/AddButton/types.d.ts +4 -0
- package/lib/components/AddResourceButton/AddButton.stories.d.ts +8 -0
- package/lib/components/AddVariables/AddVariables.d.ts +5 -0
- package/lib/components/AddVariables/index.d.ts +1 -0
- package/lib/components/AddVariables/types.d.ts +35 -0
- package/lib/components/AllProjectsDropdown/AllProjectsDropdown.stories.d.ts +7 -0
- package/lib/components/AppHeader/AppHeader.stories.d.ts +7 -0
- package/lib/components/AppHeader/types.d.ts +1 -1
- package/lib/components/AttachImage/AttachImage.stories.d.ts +7 -0
- package/lib/components/AttachmentButton/AttachmentButton.stories.d.ts +9 -0
- package/lib/components/Avatar/Avatar.stories.d.ts +10 -0
- package/lib/components/Button/Button.stories.d.ts +13 -0
- package/lib/components/Charts/BarChart/BarChart.d.ts +2 -0
- package/lib/components/Charts/BarChart/BarChart.stories.d.ts +6 -0
- package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.d.ts +7 -0
- package/lib/components/Charts/DonutChart/DonutChart.stories.d.ts +6 -0
- package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts +8 -0
- package/lib/components/Charts/IconRadialChart/types.d.ts +4 -3
- package/lib/components/Charts/LineChart/LineChart.stories.d.ts +7 -0
- package/lib/components/Charts/LineChart/types.d.ts +1 -0
- package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts +8 -0
- package/lib/components/Charts/MultiRadialChart/types.d.ts +3 -2
- package/lib/components/Charts/PieChart/PieChart.stories.d.ts +7 -0
- package/lib/components/Charts/RadialChart/RadialChart.stories.d.ts +6 -0
- package/lib/components/Checkbox/Checkbox.stories.d.ts +8 -0
- package/lib/components/Chip/Chip.stories.d.ts +14 -0
- package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts +6 -0
- package/lib/components/DatePicker/DatePicker.stories.d.ts +9 -0
- package/lib/components/DragAndDrop/DragAndDrop.stories.d.ts +6 -0
- package/lib/components/Drawer/Drawer.stories.d.ts +12 -0
- package/lib/components/EditTextField/EditTextField.stories.d.ts +10 -0
- package/lib/components/Editor/Editor.stories.d.ts +6 -0
- package/lib/components/Excel/ContextMenu/ContextMenu.d.ts +4 -0
- package/lib/components/Excel/ExcelFile.stories.d.ts +6 -0
- package/lib/components/ExcelFile/ChangeExcelStyles.d.ts +14 -0
- package/lib/components/ExcelFile/ColorBarSelector/ColorBarSelector.d.ts +8 -0
- package/lib/components/ExcelFile/ContextMenu/ContextMenu.d.ts +4 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/ActiveCell.d.ts +7 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/Cell.d.ts +4 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/ColumnIndicator.d.ts +5 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/Copied.d.ts +3 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/CornerIndicator.d.ts +5 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/DataEditor.d.ts +5 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/DataViewer.d.ts +8 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/FloatingRect.d.ts +10 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/HeaderRow.d.ts +3 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/Row.d.ts +3 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/RowIndicator.d.ts +5 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/Selected.d.ts +3 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/Spreadsheet.d.ts +80 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/Table.d.ts +3 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/actions.d.ts +174 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/areModelsEqual.d.ts +1 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/context.d.ts +8 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/engine.d.ts +22 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/formula.d.ts +17 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/index.d.ts +2 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-graph.d.ts +21 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-hash.d.ts +3 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-set.d.ts +24 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/index.d.ts +13 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/matrix.d.ts +67 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/point-range.d.ts +22 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/point.d.ts +11 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/reducer.d.ts +27 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/selection.d.ts +95 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/types.d.ts +178 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/use-dispatch.d.ts +3 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/use-selector.d.ts +3 -0
- package/lib/components/ExcelFile/ExcelFile/Excel/util.d.ts +44 -0
- package/lib/components/ExcelFile/ExcelFile/ExcelFile.d.ts +19 -0
- package/lib/components/ExcelFile/ExcelFile.stories.d.ts +6 -0
- package/lib/components/ExcelFile/ExcelSheetBar/ExcelSheetBar.d.ts +12 -0
- package/lib/components/ExcelFile/ExcelToolBar/ExcelToolBar.d.ts +15 -0
- package/lib/components/ExcelFile/ImportExcelStyles.d.ts +24 -0
- package/lib/components/ExcelFile/Types.d.ts +129 -0
- package/lib/components/ExcelFile/index.d.ts +1 -0
- package/lib/components/ExpandableMenu/ExpandableMenu.stories.d.ts +7 -0
- package/lib/components/FF_Captcha/captcha.stories.d.ts +8 -0
- package/lib/components/FileDropzone/FileDropzone.stories.d.ts +8 -0
- package/lib/components/Form/Form.stories.d.ts +7 -0
- package/lib/components/GridLayout/GridLayout.stories.d.ts +8 -0
- package/lib/components/HighlightText/HighlightText.stories.d.ts +6 -0
- package/lib/components/Icon/Icon.stories.d.ts +8 -0
- package/lib/components/IconButton/IconButton.stories.d.ts +7 -0
- package/lib/components/IconRadioGroup/IconRadioGroup.stories.d.ts +7 -0
- package/lib/components/Input/Input.stories.d.ts +9 -0
- package/lib/components/InputWithDropdown/InputWithDropdown.stories.d.ts +9 -0
- package/lib/components/LabelEditTextField/LabelEditTextField.stories.d.ts +13 -0
- package/lib/components/LazyLoad/LazyLoad.stories.d.ts +6 -0
- package/lib/components/MachineInputField/MachineInputField.stories.d.ts +6 -0
- package/lib/components/MenuOption/MenuOption.stories.d.ts +16 -0
- package/lib/components/MiniModal/MiniModal.stories.d.ts +10 -0
- package/lib/components/Modal/Modal.stories.d.ts +7 -0
- package/lib/components/ModulesChip/ModuleChip.stories.d.ts +6 -0
- package/lib/components/MultiSelect/MultiSelect.stories.d.ts +11 -0
- package/lib/components/NLPInput/NlpInput.stories.d.ts +7 -0
- package/lib/components/NLPInput/type.d.ts +70 -0
- package/lib/components/Paper/Paper.stories.d.ts +11 -0
- package/lib/components/RadioButton/RadioButton.stories.d.ts +10 -0
- package/lib/components/RadioGroup/RadioGroup.stories.d.ts +9 -0
- package/lib/components/Search/Search.stories.d.ts +6 -0
- package/lib/components/Select/Select.stories.d.ts +14 -0
- package/lib/components/Select/components/Dropdown/Dropdown.d.ts +4 -0
- package/lib/components/Select/components/Dropdown/dropdownTypes.d.ts +17 -0
- package/lib/components/SequentialConnectingBranch/SequentialConnectingBranch.stories.d.ts +6 -0
- package/lib/components/SequentialConnectingBranch/components/AddBrowserModal/AddBrowserModal.d.ts +4 -0
- package/lib/components/SequentialConnectingBranch/components/AddBrowserModal/types.d.ts +3 -0
- package/lib/components/SequentialConnectingBranch/components/DatasetListModal/DatasetListModal.d.ts +4 -0
- package/lib/components/SequentialConnectingBranch/components/DatasetListModal/types.d.ts +3 -0
- package/lib/components/StateDropdown/StateDropdown.stories.d.ts +10 -0
- package/lib/components/StatusButton/StatusButton.stories.d.ts +14 -0
- package/lib/components/StatusCard/StatusCard.d.ts +1 -1
- package/lib/components/StatusCard/StatusCard.stories.d.ts +11 -0
- package/lib/components/StatusCard/types.d.ts +1 -1
- package/lib/components/Table/Table.stories.d.ts +13 -0
- package/lib/components/TableTree/Components/TableCell.d.ts +1 -1
- package/lib/components/TableTree/Components/TableRow.d.ts +1 -1
- package/lib/components/TableTree/TableTree.stories.d.ts +7 -0
- package/lib/components/TableTree/types.d.ts +2 -0
- package/lib/components/Tabs/Tabs.stories.d.ts +9 -0
- package/lib/components/TextArea/Textarea.stories.d.ts +9 -0
- package/lib/components/Toast/Toast.stories.d.ts +6 -0
- package/lib/components/Toastify/Toastify.stories.d.ts +6 -0
- package/lib/components/Toggle/Toggle.stories.d.ts +12 -0
- package/lib/components/Tooltip/Tooltip.stories.d.ts +15 -0
- package/lib/components/Typography/Typography.stories.d.ts +10 -0
- package/lib/components/VariableInput/VariableInput.stories.d.ts +6 -0
- package/lib/index.d.ts +23 -10
- package/lib/index.esm.js +1287 -1064
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +1287 -1064
- package/lib/index.js.map +1 -1
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/lib/utils/checkEmpty/checkEmpty.stories.d.ts +6 -0
- package/lib/utils/compareArrays/compareArrays.stories.d.ts +6 -0
- package/lib/utils/compareObjects/compareObjects.stories.d.ts +6 -0
- package/lib/utils/debounce/debounce.stories.d.ts +6 -0
- package/lib/utils/ffID/ffID.stories.d.ts +6 -0
- package/lib/utils/find/findAndInsert.d.ts +7 -0
- package/lib/utils/find/findAndInsert.stories.d.ts +7 -0
- package/lib/utils/findAndInsert/findAndInsert.stories.d.ts +7 -0
- package/lib/utils/getEncryptedData/getEncryptedData.stories.d.ts +6 -0
- package/lib/utils/getExtension/getExtension.stories.d.ts +6 -0
- package/lib/utils/getSequentialPayload/getSequentialPayload.stories.d.ts +10 -0
- package/lib/utils/throttle/throttle.stories.d.ts +6 -0
- package/lib/utils/truncateText/truncateText.stories.d.ts +6 -0
- package/package.json +1 -1
- package/src/assets/Themes/BaseTheme.scss +32 -11
- package/src/assets/Themes/BlueTheme.scss +3 -0
- package/src/assets/Themes/DarkTheme.scss +32 -13
- package/src/assets/icons/approval_pending.svg +8 -8
- package/src/assets/icons/close_defects_icon.svg +12 -0
- package/src/assets/icons/configuration.svg +3 -3
- package/src/assets/icons/defect_density_icon.svg +12 -0
- package/src/assets/icons/defects.svg +8 -8
- package/src/assets/icons/element.svg +4 -4
- package/src/assets/icons/open_defects_icon.svg +12 -0
- package/src/assets/icons/project_element.svg +4 -4
- package/src/assets/icons/quality_score_icon.svg +12 -0
- package/src/assets/icons/sause_lab_icon.svg +3 -0
- package/src/assets/icons/step_group.svg +10 -10
- package/src/assets/icons/total_defects_status_icon.svg +13 -0
- package/src/assets/icons/variable.svg +3 -3
- package/src/assets/icons/web_service_icon.svg +3 -3
- package/src/components/Accordion/Accordion.stories.tsx +14 -4
- package/src/components/Accordion/Accordion.tsx +22 -11
- package/src/components/Accordion/types.ts +14 -6
- package/src/components/AppHeader/AppHeader.tsx +1 -1
- package/src/components/AppHeader/types.ts +1 -1
- package/src/components/Charts/BarChart/BarChart.scss +1 -0
- package/src/components/Charts/BarChart/BarChart.stories.tsx +91 -1
- package/src/components/Charts/BarChart/BarChart.tsx +91 -86
- package/src/components/Charts/DashboardDonutChart/DashboardDonutChart.tsx +2 -0
- package/src/components/Charts/IconRadialChart/IconRadialChart.stories.tsx +1 -0
- package/src/components/Charts/IconRadialChart/IconRadialChart.tsx +2 -1
- package/src/components/Charts/IconRadialChart/types.ts +4 -3
- package/src/components/Charts/LineChart/LineChart.stories.tsx +3 -2
- package/src/components/Charts/LineChart/LineChart.tsx +7 -3
- package/src/components/Charts/LineChart/types.ts +1 -0
- package/src/components/Charts/MultiRadialChart/MultiRadialChart.scss +1 -0
- package/src/components/Charts/MultiRadialChart/MultiRadialChart.stories.tsx +53 -6
- package/src/components/Charts/MultiRadialChart/MultiRadialChart.tsx +74 -34
- package/src/components/Charts/MultiRadialChart/types.ts +5 -4
- package/src/components/Checkbox/Checkbox.scss +4 -5
- package/src/components/Checkbox/Checkbox.stories.tsx +40 -10
- package/src/components/Icon/iconList.ts +14 -0
- package/src/components/StatusCard/StatusCard.scss +56 -93
- package/src/components/StatusCard/StatusCard.stories.tsx +77 -4
- package/src/components/StatusCard/StatusCard.tsx +89 -35
- package/src/components/StatusCard/types.ts +1 -1
- package/src/components/Table/Table.tsx +2 -2
- package/src/components/TableTree/Components/TableBody.tsx +2 -1
- package/src/components/TableTree/Components/TableCell.tsx +29 -18
- package/src/components/TableTree/Components/TableRow.tsx +2 -0
- package/src/components/TableTree/types.ts +2 -0
- package/src/components/TextArea/Textarea.scss +6 -7
- package/src/utils/handleTreeNodeSelect/handleTreeNodeSelect.ts +0 -3
package/lib/index.esm.js
CHANGED
|
@@ -691,6 +691,18 @@ const SvgDeleteFilled = (props) => /* @__PURE__ */ React.createElement("svg", {
|
|
|
691
691
|
|
|
692
692
|
const SvgPrimaryCalendarIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M9.33333 12H8C7.26467 12 6.66667 12.598 6.66667 13.3333V14.6667C6.66667 15.402 7.26467 16 8 16H9.33333C10.0687 16 10.6667 15.402 10.6667 14.6667V13.3333C10.6667 12.598 10.0687 12 9.33333 12ZM8 14.6667V13.3333H9.33333V14.6667H8ZM16.6667 5.33333H16V4.66667C16 4.29867 15.702 4 15.3333 4C14.9647 4 14.6667 4.29867 14.6667 4.66667V5.33333H9.33333V4.66667C9.33333 4.29867 9.03533 4 8.66667 4C8.298 4 8 4.29867 8 4.66667V5.33333H7.33333C5.49533 5.33333 4 6.82867 4 8.66667V16.6667C4 18.5047 5.49533 20 7.33333 20H16.6667C18.5047 20 20 18.5047 20 16.6667V8.66667C20 6.82867 18.5047 5.33333 16.6667 5.33333ZM7.33333 6.66667H16.6667C17.7693 6.66667 18.6667 7.564 18.6667 8.66667V9.33333H5.33333V8.66667C5.33333 7.564 6.23067 6.66667 7.33333 6.66667ZM16.6667 18.6667H7.33333C6.23067 18.6667 5.33333 17.7693 5.33333 16.6667V10.6667H18.6667V16.6667C18.6667 17.7693 17.7693 18.6667 16.6667 18.6667Z", fill: "currentColor" }));
|
|
693
693
|
|
|
694
|
+
const SvgSauseLabIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M1.95052 10.3182C1.66316 9.57636 1.51722 8.78726 1.52023 7.9917C1.52436 7.13661 1.69693 6.29071 2.02808 5.50233C2.35922 4.71395 2.84245 3.99854 3.45016 3.39697C4.05787 2.7954 4.77816 2.31945 5.56986 1.99633C6.36156 1.67321 7.20917 1.50924 8.06426 1.51379C8.37072 1.51497 8.67678 1.5363 8.98044 1.57766L8.24709 2.31927H8.04798C6.26244 2.31827 4.58035 3.15531 3.50337 4.57993C2.4264 6.00455 2.07976 7.85144 2.56665 9.5691H7.55457L5.43517 13.4653L10.4549 8.38192H3.60231L11.3227 0.717079C10.2852 0.242691 9.15731 -0.001912 8.01642 1.1254e-05C6.26845 0.00182586 4.56887 0.574325 3.17606 1.63048C1.78324 2.68663 0.773361 4.16868 0.299937 5.85131C-0.173487 7.53395 -0.0845626 9.32515 0.553193 10.9526C1.19095 12.5801 2.34265 13.9548 3.83323 14.8678L6.22362 10.35L1.95052 10.3182ZM12.1994 1.14712L9.80921 5.66542H14.0878C14.4651 6.64903 14.5975 7.70966 14.4735 8.75583C14.3495 9.802 13.9729 10.8023 13.3761 11.6705C12.7793 12.5386 11.9803 13.2485 11.0479 13.739C10.1156 14.2295 9.07793 14.4858 8.02443 14.4859C7.70732 14.4847 7.3906 14.4634 7.07619 14.422L7.80127 13.6889H8.02669C9.53771 13.6889 10.9866 13.0888 12.0551 12.0204C13.1236 10.9519 13.7237 9.50323 13.7237 7.99195C13.7169 7.46969 13.6446 6.95035 13.5085 6.44611H8.51834L10.5979 2.51789L5.48276 7.60899H12.3511L4.71811 15.3056C6.57721 16.1338 8.68151 16.2246 10.605 15.5597C12.5286 14.8948 14.1276 13.5239 15.0785 11.7244C16.0293 9.925 16.2609 7.83151 15.7264 5.86775C15.1919 3.90399 13.9313 2.21667 12.1996 1.14737L12.1994 1.14712Z", fill: "#E1251B" }));
|
|
695
|
+
|
|
696
|
+
const SvgTotalDefectsStatusIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("g", { clipPath: "url(#clip0_1919_99688)" }, /* @__PURE__ */ React.createElement("path", { d: "M16.6256 16.6281C20.2862 12.9675 20.2862 7.03249 16.6256 3.37187C12.965 -0.288739 7.02995 -0.288739 3.36934 3.37187C-0.291277 7.03249 -0.291277 12.9675 3.36934 16.6281C7.02995 20.2887 12.965 20.2887 16.6256 16.6281Z", fill: "#C459D5" }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M19.2394 11.5903C18.5723 15.4934 15.4928 18.5728 11.5898 19.2399L6.54285 14.193C5.33516 13.1963 4.56543 11.688 4.56543 9.99986C4.56543 6.99873 6.99824 4.56592 9.99938 4.56592C11.6875 4.56592 13.1958 5.33568 14.1925 6.54334L19.2394 11.5903Z", fill: "#71347B" }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10.0004 4.56592C6.99876 4.56592 4.56543 6.99925 4.56543 10.0009C4.56543 13.0026 6.99876 15.4359 10.0004 15.4359C13.0021 15.4359 15.4354 13.0026 15.4354 10.0009C15.4354 6.99925 13.0021 4.56592 10.0004 4.56592ZM7.11706 12.0256L8.26556 10.8774C8.35265 10.7904 8.43875 10.723 8.54478 10.659L8.97598 10.3992C8.74138 10.0444 8.61535 9.62877 8.61535 9.19368C8.61535 8.60807 8.84346 8.05746 9.25763 7.64329C9.67165 7.22909 10.2222 7.00098 10.8079 7.00098C11.3936 7.00098 11.9442 7.22909 12.3582 7.64329C12.7724 8.05746 13.0005 8.60811 13.0005 9.19368C13.0005 9.77925 12.7724 10.3298 12.3582 10.7438C11.9442 11.158 11.3936 11.3861 10.8079 11.3861C10.3728 11.3861 9.95706 11.2601 9.6023 11.0255L9.34247 11.457C9.2788 11.5627 9.21144 11.6489 9.12403 11.7363L7.97587 12.8844C7.90068 12.9596 7.80045 13.001 7.69362 13.001C7.58679 13.001 7.48656 12.9596 7.41136 12.8844L7.11707 12.5901C6.96165 12.4347 6.9616 12.1815 7.11707 12.0256L7.11706 12.0256ZM12.2185 10.6041C12.5954 10.2274 12.803 9.72651 12.803 9.19367C12.803 8.66083 12.5954 8.15981 12.2185 7.78293C11.8418 7.40605 11.3409 7.1985 10.8079 7.1985C10.275 7.1985 9.77406 7.40605 9.39734 7.78293C9.02047 8.15981 8.8129 8.66081 8.8129 9.19367C8.8129 9.72652 9.02045 10.2274 9.39736 10.6041C9.77406 10.981 10.275 11.1886 10.8079 11.1886C11.3409 11.1886 11.8418 10.981 12.2185 10.6041ZM9.44204 10.9087C9.37805 10.8575 9.31644 10.8026 9.25766 10.7438C9.19886 10.685 9.14395 10.6234 9.09277 10.5594L8.6577 10.8216L8.65772 10.8216L9.09262 10.5596C9.14381 10.6236 9.19872 10.6852 9.25751 10.744H9.25752C9.31629 10.8027 9.37791 10.8577 9.44189 10.9088L9.17995 11.3438L9.18 11.3439L9.44205 10.9087H9.44204ZM7.25673 12.4504L7.55101 12.7447C7.58889 12.7826 7.63953 12.8035 7.69361 12.8035C7.74768 12.8035 7.7983 12.7826 7.83617 12.7448L8.98434 11.5966C9.01391 11.567 9.04044 11.5381 9.06513 11.5084L8.49325 10.9365C8.46357 10.9612 8.43468 10.9877 8.40523 11.0171L7.25683 12.1652C7.17827 12.244 7.17822 12.3719 7.25673 12.4504ZM9.56602 9.22099C9.5817 9.16874 9.63672 9.13909 9.689 9.15474L9.81521 9.19258L9.99721 9.05622C10.0143 9.04342 10.0351 9.03649 10.0564 9.03649H10.2016V8.98067H10.1464C10.0918 8.98067 10.0476 8.93644 10.0476 8.8819V8.65395L9.93062 8.56773C9.88671 8.53536 9.87736 8.47353 9.90973 8.42961C9.94209 8.38571 10.0039 8.37635 10.0478 8.40873L10.205 8.52455C10.2302 8.54317 10.2451 8.57268 10.2451 8.60405V8.78313H10.4238C10.4204 8.76244 10.4185 8.74144 10.4185 8.72023C10.4185 8.60785 10.4664 8.5065 10.5428 8.43533C10.4464 8.29297 10.329 8.18129 10.1857 8.09569C10.1388 8.06772 10.1235 8.00708 10.1515 7.96025C10.1795 7.91343 10.2401 7.89814 10.2869 7.92609C10.4588 8.02876 10.6034 8.16827 10.7175 8.3414C10.7466 8.33445 10.7769 8.33066 10.8081 8.33066C10.8393 8.33066 10.8694 8.33443 10.8984 8.34135C11.0126 8.16825 11.1571 8.02876 11.3289 7.92611C11.3758 7.89815 11.4364 7.91344 11.4644 7.96027C11.4923 8.00709 11.477 8.06774 11.4302 8.0957C11.2869 8.18129 11.1695 8.29296 11.0731 8.43528C11.1495 8.50645 11.1973 8.60784 11.1973 8.72025C11.1973 8.7415 11.1955 8.76251 11.1922 8.78315H11.3708V8.60406C11.3708 8.57269 11.3857 8.54318 11.4109 8.52457L11.568 8.40874C11.6119 8.37637 11.6738 8.38573 11.7061 8.42963C11.7385 8.47353 11.7292 8.53536 11.6853 8.56774L11.5683 8.65396V8.88193C11.5683 8.93647 11.5241 8.98069 11.4695 8.98069H11.4143V9.03652H11.5595C11.5808 9.03652 11.6016 9.04344 11.6187 9.05625L11.8007 9.19261L11.9269 9.15477C11.9791 9.13911 12.0342 9.16877 12.0499 9.22101C12.0655 9.27326 12.0359 9.32831 11.9836 9.34398L11.8097 9.39613C11.8004 9.39892 11.7908 9.40029 11.7813 9.40029C11.7602 9.40029 11.7394 9.39352 11.7221 9.38056L11.5266 9.23405H11.4143V9.31108L11.6142 9.41725C11.6464 9.43439 11.6666 9.46793 11.6666 9.50447V9.84172L11.8246 9.98807C11.8647 10.0251 11.8671 10.0876 11.83 10.1276C11.8105 10.1486 11.784 10.1593 11.7575 10.1593C11.7335 10.1593 11.7094 10.1506 11.6904 10.133L11.5008 9.95731C11.4806 9.93862 11.4691 9.91236 11.4691 9.88486V9.56384L11.4143 9.53474V9.6343C11.4143 9.96875 11.1424 10.2408 10.8081 10.2408C10.4739 10.2408 10.2016 9.96875 10.2016 9.6343V9.53474L10.1468 9.56384V9.88486C10.1468 9.91236 10.1353 9.93862 10.1152 9.95731L9.9255 10.133C9.90648 10.1506 9.88242 10.1593 9.8584 10.1593C9.83185 10.1593 9.80537 10.1486 9.78591 10.1276C9.74884 10.0876 9.75124 10.0251 9.79127 9.98807L9.94929 9.84172V9.50447C9.94929 9.46794 9.96946 9.43439 10.0017 9.41725L10.2016 9.31108V9.23404H10.0893L9.89379 9.38055C9.8765 9.39351 9.85567 9.40027 9.83456 9.40027C9.82506 9.40027 9.81552 9.3989 9.8062 9.39611L9.63227 9.34397C9.58004 9.3283 9.55037 9.27324 9.56604 9.221L9.56602 9.22099ZM10.9998 8.72023C10.9998 8.61434 10.9138 8.52819 10.8081 8.52819C10.7024 8.52819 10.6161 8.61434 10.6161 8.72023C10.6161 8.74184 10.6198 8.76301 10.6268 8.78313H10.9892C10.9961 8.76316 10.9998 8.74199 10.9998 8.72023ZM10.7093 10.0312V9.36098C10.7093 9.30643 10.7536 9.26221 10.8081 9.26221C10.8626 9.26221 10.9069 9.30643 10.9069 9.36098V10.0311C11.0846 9.98681 11.2168 9.82573 11.2168 9.63429V8.98068H10.3991V9.63429C10.3991 9.82576 10.5314 9.98686 10.7093 10.0312ZM9.5376 7.92323C9.87682 7.58383 10.328 7.39693 10.808 7.39693C11.288 7.39693 11.7392 7.58383 12.0786 7.92322C12.7788 8.62378 12.7788 9.76363 12.0786 10.4642C11.7392 10.8036 11.288 10.9905 10.808 10.9905C10.328 10.9905 9.8768 10.8036 9.53762 10.4642C9.19824 10.1248 9.01133 9.67361 9.01133 9.19371C9.01133 8.7138 9.19824 8.26259 9.5376 7.92323ZM9.67731 10.3245C9.97921 10.6266 10.3808 10.7929 10.808 10.7929C11.2352 10.7929 11.6369 10.6266 11.9389 10.3245C12.5621 9.70099 12.5621 8.68641 11.9389 8.06287C11.6368 7.76085 11.2352 7.59446 10.808 7.59446C10.3808 7.59446 9.97921 7.76081 9.6773 8.06288C9.37521 8.36496 9.20886 8.76655 9.20886 9.19371C9.20886 9.62086 9.37522 10.0225 9.67731 10.3245Z", fill: "white" })), /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("clipPath", { id: "clip0_1919_99688" }, /* @__PURE__ */ React.createElement("rect", { width: 20, height: 20, fill: "white", transform: "translate(-0.000488281)" }))));
|
|
697
|
+
|
|
698
|
+
const SvgOpenDefectsIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 21 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("g", { clipPath: "url(#clip0_2699_12939)" }, /* @__PURE__ */ React.createElement("path", { d: "M16.8937 16.6281C20.4813 12.9675 20.4813 7.03249 16.8937 3.37187C13.3062 -0.28874 7.48963 -0.28874 3.90208 3.37187C0.314532 7.03249 0.314532 12.9675 3.90208 16.6281C7.48963 20.2887 13.3062 20.2887 16.8937 16.6281Z", fill: "#F64C6E" }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M19.4558 11.5903C18.802 15.4934 15.7839 18.5728 11.9588 19.2399L7.01266 14.193C5.82907 13.1963 5.07471 11.688 5.07471 9.99986C5.07471 6.99873 7.45896 4.56592 10.4002 4.56592C12.0546 4.56592 13.5328 5.33568 14.5096 6.54334L19.4558 11.5903Z", fill: "#9C1732" }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.7257 9.99986C15.7257 6.99873 13.3414 4.56592 10.4002 4.56592C7.45896 4.56592 5.07471 6.99873 5.07471 9.99986C5.07471 13.001 7.45896 15.4338 10.4002 15.4338C13.3414 15.4338 15.7257 13.001 15.7257 9.99986ZM12.9249 9.64978C12.9249 9.55787 12.9648 9.46879 13.0318 9.41147L13.4001 9.09613L13.3734 8.9905C13.3412 8.86285 13.2994 8.73668 13.2493 8.61531C13.199 8.49419 13.1393 8.37544 13.0718 8.26239L13.016 8.16883L12.534 8.20618C12.446 8.21298 12.3546 8.17811 12.2893 8.11256C12.2243 8.04761 12.1896 7.95637 12.1964 7.8685L12.2338 7.38509L12.1403 7.32926C12.0272 7.2618 11.9085 7.20211 11.7872 7.15177C11.666 7.10163 11.5398 7.05987 11.4121 7.02765L11.3065 7.00098L10.9921 7.36816C10.9348 7.4351 10.8452 7.47502 10.7524 7.47502L10.5758 7.47471V9.23258H10.7515C10.9808 9.23258 11.1674 9.41912 11.1674 9.64842C11.1674 9.87772 10.9808 10.0643 10.7515 10.0643H10.576L10.5742 11.8219L10.7502 11.8218C10.8422 11.8218 10.9312 11.8618 10.9885 11.9287L11.3038 12.297L11.4095 12.2703C11.5371 12.2381 11.6632 12.1963 11.7846 12.1461C11.9058 12.0959 12.0245 12.0362 12.1376 11.9687L12.2311 11.9129L12.1938 11.4309C12.187 11.3429 12.2219 11.2515 12.2874 11.1862C12.3524 11.1212 12.4435 11.0864 12.5315 11.0932L13.0149 11.1307L13.0707 11.0371C13.1382 10.9241 13.1979 10.8054 13.2482 10.684C13.2983 10.5628 13.3401 10.4367 13.3723 10.309L13.399 10.2034L13.0318 9.889C12.9647 9.83159 12.9248 9.74231 12.9249 9.64978ZM11.5188 9.64842C11.5188 9.28581 11.2659 8.98113 10.9272 8.90146V8.54357C11.4609 8.62813 11.8702 9.09135 11.8702 9.64842C11.8702 10.2057 11.4606 10.669 10.9267 10.7534L10.9271 10.3954C11.2658 10.3158 11.5188 10.0111 11.5188 9.64842ZM12.9235 10.5496C12.8934 10.6221 12.8594 10.6937 12.822 10.7633L12.5586 10.7429C12.3668 10.728 12.1774 10.7991 12.0391 10.9376C11.8998 11.0763 11.8285 11.266 11.8434 11.4581L11.8637 11.7201C11.7941 11.7575 11.7225 11.7914 11.6501 11.8215C11.5776 11.8515 11.5029 11.8781 11.4273 11.9008L11.2554 11.7001C11.1687 11.5989 11.0537 11.5276 10.9259 11.4934L10.9263 11.1081C11.6548 11.0214 12.2216 10.3999 12.2216 9.64842C12.2216 8.89727 11.6553 8.27598 10.9272 8.18886V7.80386C11.0561 7.76983 11.172 7.69838 11.2591 7.59671L11.4299 7.39711C11.5056 7.4199 11.5802 7.44645 11.6527 7.47641C11.7252 7.5065 11.7967 7.54049 11.8664 7.57789L11.846 7.84134C11.8311 8.03306 11.9022 8.22252 12.0406 8.36087C12.1794 8.50012 12.3691 8.57147 12.5612 8.55654L12.8232 8.53624C12.8606 8.60589 12.8945 8.67741 12.9246 8.7498C12.9546 8.82235 12.9811 8.89698 13.0039 8.97269L12.8032 9.14454C12.6571 9.26959 12.5734 9.45381 12.5735 9.64955C12.5731 9.8461 12.6569 10.0307 12.8032 10.156L13.0028 10.3269C12.98 10.4025 12.9535 10.4771 12.9235 10.5496ZM9.63312 10.351C9.63312 10.1217 9.81966 9.93512 10.049 9.93512H10.2247V8.1775L10.0489 8.17756C9.95646 8.17756 9.87016 8.13861 9.81201 8.0707L9.49667 7.70239L9.39104 7.72907C9.26342 7.76128 9.13725 7.80304 9.01585 7.85324C8.8947 7.90351 8.77596 7.9632 8.66292 8.03066L8.56936 8.0865L8.6067 8.56846C8.61352 8.65649 8.57864 8.74787 8.51309 8.81318C8.44813 8.87819 8.35696 8.91292 8.26901 8.90614L7.7856 8.86868L7.72976 8.96224C7.6623 9.07528 7.60262 9.19402 7.55229 9.31536C7.50216 9.43655 7.46041 9.56272 7.42818 9.69035L7.4015 9.79599L7.76871 10.1104C7.83577 10.1678 7.87572 10.2571 7.87556 10.3496C7.87559 10.4415 7.83565 10.5306 7.7687 10.5879L7.40039 10.9033L7.42706 11.0089C7.4593 11.1365 7.50106 11.2627 7.55125 11.3841C7.60151 11.5052 7.66119 11.6239 7.72866 11.737L7.78449 11.8306L8.26646 11.7932C8.35447 11.7864 8.44587 11.8213 8.51118 11.8868C8.57619 11.9518 8.61094 12.043 8.60413 12.1309L8.56667 12.6143L8.66023 12.6701C8.77326 12.7376 8.89201 12.7973 9.01334 12.8476C9.13455 12.8977 9.26072 12.9395 9.38835 12.9717L9.49399 12.9984L9.80837 12.6312C9.86568 12.5643 9.95473 12.5244 10.0467 12.5244L10.2231 12.5247L10.2249 10.7668H10.049C9.81967 10.7668 9.63312 10.5803 9.63312 10.351ZM9.2817 10.351C9.2817 10.7135 9.53451 11.0182 9.87309 11.0979L9.87272 11.4557C9.33932 11.3709 8.93028 10.9078 8.93028 10.351C8.93028 9.79389 9.33959 9.33068 9.87325 9.24611V9.604C9.5346 9.68365 9.2817 9.98833 9.2817 10.351ZM9.54142 12.4027L9.37052 12.6023C9.29484 12.5795 9.22026 12.5529 9.14782 12.523C9.07529 12.4929 9.00373 12.4589 8.93407 12.4215L8.95449 12.158C8.96936 11.9663 8.89831 11.7769 8.75984 11.6385C8.62111 11.4993 8.43138 11.428 8.23931 11.4428L7.97731 11.4631C7.93991 11.3935 7.90595 11.322 7.87592 11.2496C7.84591 11.177 7.81934 11.1024 7.79653 11.0267L7.99725 10.8548C8.14332 10.7298 8.22706 10.5456 8.22697 10.3498C8.22732 10.1533 8.14359 9.9687 7.99726 9.84342L7.79766 9.67251C7.82045 9.59684 7.84701 9.52225 7.87697 9.44981C7.90707 9.37728 7.94105 9.30572 7.97845 9.23606L8.2419 9.25648C8.43362 9.27135 8.62308 9.20028 8.76143 9.06182C8.90067 8.92309 8.97198 8.73336 8.9571 8.54129L8.9368 8.27929C9.00643 8.2419 9.07796 8.20793 9.15035 8.1779C9.22293 8.14789 9.29756 8.12132 9.37324 8.09852L9.5451 8.29924C9.63163 8.40031 9.7462 8.47153 9.87327 8.50579V8.89138C9.14519 8.9785 8.57888 9.59978 8.57888 10.3509C8.57888 11.1018 9.14474 11.7229 9.87238 11.8104L9.872 12.1957C9.7438 12.2298 9.62835 12.3011 9.54142 12.4027ZM10.225 7.29932H9.87354V7.65073H10.225V7.29932ZM9.17041 7.00098H9.52183V7.3524H9.17041V7.00098ZM10.9276 12.3489H10.5762V12.7003H10.9276V12.3489ZM11.2788 12.647H11.6302V12.9984H11.2788V12.647Z", fill: "white" })), /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("clipPath", { id: "clip0_2699_12939" }, /* @__PURE__ */ React.createElement("rect", { width: 19.6008, height: 20, fill: "white", transform: "translate(0.599609)" }))));
|
|
699
|
+
|
|
700
|
+
const SvgCloseDefectsIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("g", { clipPath: "url(#clip0_2699_12924)" }, /* @__PURE__ */ React.createElement("path", { d: "M16.4538 16.6281C20.0413 12.9675 20.0413 7.03249 16.4538 3.37187C12.8662 -0.28874 7.04968 -0.28874 3.46214 3.37187C-0.12541 7.03249 -0.12541 12.9675 3.46214 16.6281C7.04968 20.2887 12.8662 20.2887 16.4538 16.6281Z", fill: "#46CC6B" }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M19.0159 11.5903C18.3621 15.4934 15.344 18.5728 11.5189 19.2399L6.57272 14.193C5.38913 13.1963 4.63477 11.688 4.63477 9.99986C4.63477 6.99873 7.01902 4.56592 9.96025 4.56592C11.6147 4.56592 13.0929 5.33568 14.0697 6.54334L19.0159 11.5903Z", fill: "#179C5F" }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.2857 9.99986C15.2857 6.99873 12.9015 4.56592 9.96025 4.56592C7.01902 4.56592 4.63477 6.99873 4.63477 9.99986C4.63477 13.001 7.01902 15.4338 9.96025 15.4338C12.9015 15.4338 15.2857 13.001 15.2857 9.99986ZM9.07719 6.65167H9.42861V7.00309H9.07719V6.65167ZM10.1317 6.95001H9.78032V7.30143H10.1317V6.95001ZM12.1381 9.99945C12.1381 9.90754 12.1781 9.81846 12.245 9.76114L12.6133 9.4458L12.5867 9.34016C12.5544 9.21252 12.5127 9.08635 12.4625 8.96498C12.4122 8.84386 12.3525 8.72511 12.2851 8.61206L12.2292 8.5185L11.7473 8.55584C11.6592 8.56265 11.5678 8.52778 11.5025 8.46223C11.4375 8.39727 11.4028 8.30603 11.4096 8.21817L11.447 7.73476L11.3535 7.67893C11.2405 7.61147 11.1217 7.55177 11.0004 7.50144C10.8792 7.4513 10.753 7.40954 10.6254 7.37732L10.5197 7.35064L10.2053 7.71783C10.148 7.78476 10.0584 7.82468 9.96562 7.82468L9.90689 7.82458C9.83332 7.81342 9.76656 7.77718 9.71879 7.7214L9.40345 7.35309L9.29782 7.37976C9.17021 7.41197 9.04404 7.45373 8.92263 7.50394C8.80149 7.5542 8.68274 7.6139 8.5697 7.68136L8.47614 7.7372L8.51349 8.21916C8.52031 8.30719 8.48542 8.39857 8.41987 8.46387C8.35492 8.52888 8.26375 8.56362 8.1758 8.55683L7.69239 8.51937L7.63655 8.61293C7.56909 8.72597 7.5094 8.84472 7.45907 8.96605C7.40894 9.08724 7.3672 9.21341 7.33496 9.34105L7.30829 9.44668L7.6755 9.76107C7.74256 9.8185 7.7825 9.90778 7.78234 10.0003C7.78237 10.0922 7.74243 10.1813 7.67548 10.2386L7.30717 10.5539L7.33385 10.6596C7.36608 10.7872 7.40784 10.9134 7.45804 11.0348C7.50829 11.1559 7.56797 11.2746 7.63545 11.3877L7.69127 11.4812L8.17324 11.4439C8.26125 11.4371 8.35265 11.472 8.41796 11.5375C8.48297 11.6025 8.51773 11.6937 8.51091 11.7816L8.47345 12.265L8.56701 12.3208C8.68005 12.3883 8.79879 12.448 8.92013 12.4983C9.04133 12.5484 9.1675 12.5902 9.29514 12.6224L9.40077 12.6491L9.71515 12.2819C9.77247 12.215 9.86152 12.175 9.95345 12.175L10.0116 12.1751C10.0858 12.1864 10.1545 12.2232 10.2017 12.2783L10.517 12.6467L10.6227 12.62C10.7503 12.5878 10.8765 12.546 10.9979 12.4958C11.119 12.4455 11.2377 12.3858 11.3508 12.3184L11.4443 12.2625L11.407 11.7806C11.4002 11.6926 11.4351 11.6012 11.5006 11.5359C11.5656 11.4709 11.6567 11.4361 11.7447 11.4429L12.2281 11.4804L12.2839 11.3868C12.3514 11.2738 12.4111 11.155 12.4614 11.0337C12.5115 10.9125 12.5533 10.7863 12.5855 10.6587L12.6122 10.5531L12.245 10.2387C12.1779 10.1813 12.138 10.092 12.1381 9.99945ZM10.3806 9.99809C10.3806 9.78728 10.2229 9.61262 10.0193 9.58581H9.95574C9.72644 9.58581 9.5399 9.77235 9.5399 10.0017C9.5399 10.2125 9.69761 10.3872 9.90125 10.4139H9.96473C10.194 10.4139 10.3806 10.2274 10.3806 9.99809ZM10.732 9.99809C10.732 9.63547 10.4791 9.33079 10.1404 9.25113V8.89324C10.6741 8.97779 11.0834 9.44102 11.0834 9.99809C11.0834 10.5553 10.6738 11.0187 10.1399 11.103L10.1403 10.7451C10.4791 10.6655 10.732 10.3608 10.732 9.99809ZM12.1367 10.8992C12.1066 10.9718 12.0727 11.0433 12.0353 11.113L11.7718 11.0926C11.58 11.0777 11.3906 11.1487 11.2523 11.2872C11.113 11.4259 11.0417 11.6157 11.0566 11.8078L11.0769 12.0697C11.0073 12.1071 10.9357 12.1411 10.8634 12.1711C10.7908 12.2012 10.7161 12.2277 10.6405 12.2505L10.4686 12.0498C10.3819 11.9486 10.2669 11.8773 10.1392 11.8431L10.1395 11.4578C10.868 11.371 11.4348 10.7496 11.4348 9.99809C11.4348 9.24693 10.8685 8.62565 10.1404 8.53853V8.15353C10.2693 8.1195 10.3852 8.04805 10.4723 7.94638L10.6432 7.74677C10.7188 7.76957 10.7934 7.79611 10.8659 7.82608C10.9384 7.85617 11.01 7.89015 11.0796 7.92756L11.0592 8.191C11.0443 8.38272 11.1154 8.57219 11.2538 8.71054C11.3926 8.84978 11.5823 8.92113 11.7744 8.90621L12.0364 8.88591C12.0738 8.95556 12.1077 9.02707 12.1378 9.09947C12.1678 9.17202 12.1943 9.24665 12.2171 9.32236L12.0164 9.4942C11.8704 9.61926 11.7866 9.80347 11.7867 9.99921C11.7864 10.1958 11.8701 10.3804 12.0164 10.5056L12.216 10.6765C12.1933 10.7522 12.1667 10.8268 12.1367 10.8992ZM9.18848 10.0017C9.18848 10.3642 9.44129 10.6689 9.77987 10.7486L9.77951 11.1064C9.2461 11.0216 8.83706 10.5585 8.83706 10.0017C8.83706 9.44459 9.24637 8.98137 9.78003 8.89681V9.25469C9.44138 9.33435 9.18848 9.63903 9.18848 10.0017ZM9.4482 12.0534L9.27731 12.253C9.20162 12.2302 9.12704 12.2036 9.0546 12.1737C8.98207 12.1436 8.91051 12.1096 8.84086 12.0722L8.86127 11.8087C8.87614 11.617 8.80509 11.4276 8.66662 11.2892C8.5279 11.15 8.33816 11.0787 8.14609 11.0935L7.8841 11.1138C7.84669 11.0442 7.81274 10.9727 7.7827 10.9003C7.75269 10.8277 7.72612 10.7531 7.70332 10.6774L7.90403 10.5055C8.05011 10.3805 8.13384 10.1963 8.13376 10.0005C8.13411 9.80398 8.05038 9.61939 7.90405 9.49411L7.70444 9.32321C7.72724 9.24753 7.75379 9.17294 7.78376 9.1005C7.81385 9.02797 7.84783 8.95641 7.88523 8.88676L8.14868 8.90717C8.3404 8.92204 8.52986 8.85097 8.66822 8.71251C8.80745 8.57378 8.87876 8.38405 8.86389 8.19198L8.84359 7.92999C8.91321 7.89259 8.98474 7.85862 9.05713 7.82859C9.12971 7.79858 9.20434 7.77201 9.28002 7.74922L9.45188 7.94993C9.53841 8.051 9.65298 8.12222 9.78006 8.15649V8.54207C9.05198 8.62919 8.48567 9.25047 8.48567 10.0016C8.48567 10.7525 9.05152 11.3736 9.77917 11.4611L9.77878 11.8463C9.65058 11.8805 9.53513 11.9518 9.4482 12.0534ZM10.1408 12.6985H9.78938V13.05H10.1408V12.6985ZM10.492 12.9966H10.8434V13.3481H10.492V12.9966Z", fill: "white" })), /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("clipPath", { id: "clip0_2699_12924" }, /* @__PURE__ */ React.createElement("rect", { width: 19.6008, height: 20, fill: "white", transform: "translate(0.159668)" }))));
|
|
701
|
+
|
|
702
|
+
const SvgQualityScoreIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 21 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("g", { clipPath: "url(#clip0_2699_12934)" }, /* @__PURE__ */ React.createElement("path", { d: "M16.8537 16.6281C20.4412 12.9675 20.4412 7.03249 16.8537 3.37187C13.2661 -0.28874 7.44959 -0.28874 3.86204 3.37187C0.274492 7.03249 0.274492 12.9675 3.86204 16.6281C7.44959 20.2887 13.2661 20.2887 16.8537 16.6281Z", fill: "#FFC38B" }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M19.4158 11.4833C18.762 15.3864 15.7439 18.4659 11.9188 19.133L6.97262 14.0861C5.78903 13.0894 5.03467 11.5811 5.03467 9.89293C5.03467 6.8918 7.41892 4.45898 10.3602 4.45898C12.0146 4.45898 13.4928 5.22875 14.4696 6.43641L19.4158 11.4833Z", fill: "#E2750F" }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10.3602 4.45898C13.3014 4.45898 15.6856 6.8918 15.6856 9.89293C15.6856 12.8941 13.3014 15.3269 10.3602 15.3269C7.41892 15.3269 5.03467 12.8941 5.03467 9.89293C5.03467 6.8918 7.41892 4.45898 10.3602 4.45898ZM8.49928 7.73264H8.96833L9.05285 7.48502H8.36952L7.45166 8.8243H7.75166L8.49928 7.73264ZM9.72904 12.3981L7.45166 9.07192H8.5969L9.72904 12.3981ZM11.8624 8.8243L11.4064 7.48502H9.31357L8.85761 8.8243H11.8624ZM10.36 13.485L8.85761 9.07192H11.8624L10.36 13.485ZM12.2207 7.73264L12.9683 8.8243H13.2683L12.3505 7.48502H11.6671L11.7517 7.73264H12.2207ZM10.9909 12.3981L12.1231 9.07192H13.2683L10.9909 12.3981Z", fill: "white" })), /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("clipPath", { id: "clip0_2699_12934" }, /* @__PURE__ */ React.createElement("rect", { width: 19.6008, height: 20, fill: "white", transform: "translate(0.55957)" }))));
|
|
703
|
+
|
|
704
|
+
const SvgDefectDensityIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("g", { clipPath: "url(#clip0_2699_12904)" }, /* @__PURE__ */ React.createElement("path", { d: "M16.6535 16.6281C20.241 12.9675 20.241 7.03249 16.6535 3.37187C13.066 -0.28874 7.24939 -0.28874 3.66184 3.37187C0.0742969 7.03249 0.0742969 12.9675 3.66184 16.6281C7.24939 20.2887 13.066 20.2887 16.6535 16.6281Z", fill: "#ADE780" }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M19.2156 11.5903C18.5618 15.4934 15.5437 18.5728 11.7186 19.2399L6.77243 14.193C5.58884 13.1963 4.83447 11.688 4.83447 9.99986C4.83447 6.99873 7.21873 4.56592 10.16 4.56592C11.8144 4.56592 13.2926 5.33568 14.2694 6.54334L19.2156 11.5903Z", fill: "#5DC70C" }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.4854 9.99986C15.4854 6.99873 13.1012 4.56592 10.16 4.56592C7.21873 4.56592 4.83447 6.99873 4.83447 9.99986C4.83447 13.001 7.21873 15.4338 10.16 15.4338C13.1012 15.4338 15.4854 13.001 15.4854 9.99986ZM12.7113 11.158L13.5239 11.6271C13.6545 11.7025 13.6992 11.8694 13.6238 12C13.5733 12.0876 13.4815 12.1365 13.3872 12.1365C13.3409 12.1365 13.2939 12.1248 13.2509 12.0999L12.4382 11.6307L12.4307 12.4485C12.4293 12.5984 12.3073 12.7189 12.1577 12.7189L12.1552 12.7189C12.0044 12.7175 11.8833 12.5942 11.8847 12.4434L11.8951 11.3171L10.4327 10.4728V12.1614L11.4132 12.7156C11.5444 12.7897 11.5907 12.9563 11.5165 13.0876C11.4663 13.1764 11.3738 13.2263 11.2786 13.2263C11.2331 13.2263 11.187 13.2149 11.1445 13.1909L10.4327 12.7886V13.727C10.4327 13.8778 10.3105 14 10.1597 14C10.0089 14 9.88669 13.8778 9.88669 13.727V12.7886L9.17485 13.1909C9.13241 13.2149 9.08625 13.2263 9.04075 13.2263C8.94553 13.2263 8.85304 13.1764 8.80284 13.0876C8.72866 12.9563 8.77493 12.7897 8.90618 12.7156L9.88665 12.1614V10.4728L8.42418 11.3171L8.43433 12.4434C8.43572 12.5942 8.31458 12.7175 8.16381 12.7189L8.1613 12.7189C8.01169 12.7189 7.88972 12.5983 7.88837 12.4483L7.88098 11.6307L7.06843 12.0999C7.02544 12.1247 6.97848 12.1365 6.93218 12.1365C6.83783 12.1365 6.74607 12.0876 6.69551 12C6.62013 11.8694 6.66486 11.7024 6.79543 11.6271L7.60798 11.1579L6.90372 10.7427C6.77384 10.6661 6.73064 10.4988 6.80722 10.3689C6.88381 10.239 7.05125 10.1958 7.18105 10.2724L8.15118 10.8445L9.61372 10.0001L8.15143 9.1558L7.18105 9.72767C7.13751 9.7533 7.08979 9.76549 7.04269 9.76549C6.94918 9.76549 6.85815 9.71745 6.80722 9.63107C6.73067 9.50116 6.77392 9.33379 6.90379 9.25724L7.60816 8.8421L6.79546 8.37287C6.6649 8.29749 6.62016 8.13052 6.69555 7.99995C6.77093 7.86939 6.9379 7.82462 7.06846 7.90004L7.88102 8.36919L7.88841 7.55165C7.88975 7.40169 8.01173 7.28109 8.16133 7.28109H8.16384C8.31461 7.28244 8.43575 7.40576 8.43437 7.55653L8.42421 8.68278L9.88665 9.52715V7.83859L8.90618 7.28444C8.77493 7.21026 8.72866 7.04369 8.80284 6.91244C8.87706 6.78114 9.04352 6.73488 9.17485 6.8091L9.88669 7.21139V6.273C9.88669 6.12223 10.0089 6 10.1597 6C10.3105 6 10.4327 6.12223 10.4327 6.273V7.21139L11.1445 6.80906C11.2758 6.73484 11.4423 6.78114 11.5165 6.9124C11.5907 7.04369 11.5444 7.21022 11.4132 7.28441L10.4327 7.83856V9.52715L11.8951 8.68278L11.885 7.55653C11.8836 7.40576 12.0047 7.28244 12.1555 7.28109C12.3059 7.27902 12.4296 7.40085 12.4309 7.55162L12.4383 8.36919L13.2509 7.90004C13.3814 7.82462 13.5484 7.86935 13.6238 7.99995C13.6992 8.13052 13.6544 8.29749 13.5239 8.37287L12.7111 8.8421L13.4154 9.25717C13.5453 9.33376 13.5885 9.50112 13.512 9.631C13.461 9.71737 13.37 9.76542 13.2765 9.76542C13.2294 9.76542 13.1817 9.75326 13.1382 9.7276L12.1679 9.15572L10.7056 9.99998L12.1682 10.8444L13.1381 10.2724C13.2681 10.1959 13.4354 10.2391 13.512 10.3689C13.5886 10.4988 13.5453 10.6662 13.4155 10.7428L12.7113 11.158Z", fill: "white" })), /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("clipPath", { id: "clip0_2699_12904" }, /* @__PURE__ */ React.createElement("rect", { width: 19.6008, height: 20, fill: "white", transform: "translate(0.359375)" }))));
|
|
705
|
+
|
|
694
706
|
let Components = {};
|
|
695
707
|
Components['success'] = SvgSuccess;
|
|
696
708
|
Components['alert'] = SvgAlert;
|
|
@@ -972,6 +984,12 @@ Components['jira_colored'] = SvgJiraColored;
|
|
|
972
984
|
Components['screenshot'] = SvgScreenshot;
|
|
973
985
|
Components['delete_filled'] = SvgDeleteFilled;
|
|
974
986
|
Components['primary_calendar_icon'] = SvgPrimaryCalendarIcon;
|
|
987
|
+
Components['sause_lab_icon'] = SvgSauseLabIcon;
|
|
988
|
+
Components['total_defects_status_icon'] = SvgTotalDefectsStatusIcon;
|
|
989
|
+
Components['open_defects_status_icon'] = SvgOpenDefectsIcon;
|
|
990
|
+
Components['closed_defects_status_icon'] = SvgCloseDefectsIcon;
|
|
991
|
+
Components['quality_score_status_icon'] = SvgQualityScoreIcon;
|
|
992
|
+
Components['defect_density_status_icon'] = SvgDefectDensityIcon;
|
|
975
993
|
|
|
976
994
|
var css_248z$1i = ".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}";
|
|
977
995
|
styleInject(css_248z$1i);
|
|
@@ -1168,7 +1186,7 @@ function useEscapeKey(key) {
|
|
|
1168
1186
|
};
|
|
1169
1187
|
}
|
|
1170
1188
|
|
|
1171
|
-
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 --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 --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}\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 --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 --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}\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 --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 --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 --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}\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 --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 --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}\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 --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}";
|
|
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}";
|
|
1172
1190
|
styleInject(css_248z$1f);
|
|
1173
1191
|
|
|
1174
1192
|
const ThemeContext = /*#__PURE__*/createContext$1(undefined);
|
|
@@ -1569,22 +1587,27 @@ const Accordion = ({
|
|
|
1569
1587
|
accordionStateIconName = 'arrow_down',
|
|
1570
1588
|
AccordionStateIconWidth = 12,
|
|
1571
1589
|
AccordionStateIconHeight = 8,
|
|
1572
|
-
isExpand
|
|
1590
|
+
isExpand,
|
|
1591
|
+
onClick,
|
|
1592
|
+
className = ''
|
|
1573
1593
|
}) => {
|
|
1574
1594
|
const [isAccordionExpanded, setIsAccordionExpanded] = useState(isExpand ?? true);
|
|
1575
1595
|
const onAccordionClick = () => {
|
|
1576
|
-
|
|
1596
|
+
if (onClick) {
|
|
1597
|
+
onClick();
|
|
1598
|
+
}
|
|
1599
|
+
if (!disable) {
|
|
1600
|
+
setIsAccordionExpanded(!isAccordionExpanded);
|
|
1601
|
+
}
|
|
1577
1602
|
};
|
|
1578
1603
|
return jsxs("div", {
|
|
1579
|
-
className:
|
|
1604
|
+
className: `ff-accordion ${className}`,
|
|
1580
1605
|
children: [jsxs("div", {
|
|
1581
|
-
className: `accordion-header ${disable && 'ff-disabled'} ${isAccordionExpanded && 'expanded'}`,
|
|
1606
|
+
className: `accordion-header ${disable && 'ff-disabled'} ${isAccordionExpanded && 'expanded'} `,
|
|
1582
1607
|
style: {
|
|
1583
1608
|
color: color || '--tooltip-bg-color'
|
|
1584
1609
|
},
|
|
1585
|
-
onClick:
|
|
1586
|
-
!disable && onAccordionClick();
|
|
1587
|
-
},
|
|
1610
|
+
onClick: onAccordionClick,
|
|
1588
1611
|
children: [jsx(Tooltip, {
|
|
1589
1612
|
title: disableInfoMessage,
|
|
1590
1613
|
children: jsx(Typography, {
|
|
@@ -1597,10 +1620,12 @@ const Accordion = ({
|
|
|
1597
1620
|
}), jsx(Icon, {
|
|
1598
1621
|
name: accordionStateIconName,
|
|
1599
1622
|
hoverEffect: false,
|
|
1600
|
-
className:
|
|
1623
|
+
className: classNames('accordion-arrow', {
|
|
1624
|
+
expanded: isAccordionExpanded
|
|
1625
|
+
}),
|
|
1601
1626
|
width: AccordionStateIconWidth,
|
|
1602
1627
|
height: AccordionStateIconHeight,
|
|
1603
|
-
color:
|
|
1628
|
+
color: "var(--table-with-accordion-icon-color)"
|
|
1604
1629
|
})]
|
|
1605
1630
|
}), !disable && isAccordionExpanded && jsx("div", {
|
|
1606
1631
|
style: {
|
|
@@ -1624,7 +1649,7 @@ const dropdownDefaultCSSData$1 = {
|
|
|
1624
1649
|
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, .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}";
|
|
1625
1650
|
styleInject(css_248z$1a);
|
|
1626
1651
|
|
|
1627
|
-
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-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
|
|
1652
|
+
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-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}";
|
|
1628
1653
|
styleInject(css_248z$19);
|
|
1629
1654
|
|
|
1630
1655
|
const Checkbox = ({
|
|
@@ -3188,7 +3213,7 @@ const Select$1 = ({
|
|
|
3188
3213
|
});
|
|
3189
3214
|
};
|
|
3190
3215
|
|
|
3191
|
-
var css_248z$$ = ".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
|
|
3216
|
+
var css_248z$$ = ".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}";
|
|
3192
3217
|
styleInject(css_248z$$);
|
|
3193
3218
|
|
|
3194
3219
|
const Textarea = ({
|
|
@@ -3905,8 +3930,6 @@ function LiveRegion(_ref) {
|
|
|
3905
3930
|
// Hide element visually but keep it readable by screen readers
|
|
3906
3931
|
const visuallyHidden = {
|
|
3907
3932
|
position: 'fixed',
|
|
3908
|
-
top: 0,
|
|
3909
|
-
left: 0,
|
|
3910
3933
|
width: 1,
|
|
3911
3934
|
height: 1,
|
|
3912
3935
|
margin: -1,
|
|
@@ -4896,12 +4919,11 @@ var KeyboardCode;
|
|
|
4896
4919
|
KeyboardCode["Up"] = "ArrowUp";
|
|
4897
4920
|
KeyboardCode["Esc"] = "Escape";
|
|
4898
4921
|
KeyboardCode["Enter"] = "Enter";
|
|
4899
|
-
KeyboardCode["Tab"] = "Tab";
|
|
4900
4922
|
})(KeyboardCode || (KeyboardCode = {}));
|
|
4901
4923
|
const defaultKeyboardCodes = {
|
|
4902
4924
|
start: [KeyboardCode.Space, KeyboardCode.Enter],
|
|
4903
4925
|
cancel: [KeyboardCode.Esc],
|
|
4904
|
-
end: [KeyboardCode.Space, KeyboardCode.Enter
|
|
4926
|
+
end: [KeyboardCode.Space, KeyboardCode.Enter]
|
|
4905
4927
|
};
|
|
4906
4928
|
const defaultKeyboardCoordinateGetter = (event, _ref) => {
|
|
4907
4929
|
let {
|
|
@@ -5200,9 +5222,6 @@ class AbstractPointerSensor {
|
|
|
5200
5222
|
passive: false
|
|
5201
5223
|
});
|
|
5202
5224
|
this.listeners.add(events.end.name, this.handleEnd);
|
|
5203
|
-
if (events.cancel) {
|
|
5204
|
-
this.listeners.add(events.cancel.name, this.handleCancel);
|
|
5205
|
-
}
|
|
5206
5225
|
this.windowListeners.add(EventName.Resize, this.handleCancel);
|
|
5207
5226
|
this.windowListeners.add(EventName.DragStart, preventDefault);
|
|
5208
5227
|
this.windowListeners.add(EventName.VisibilityChange, this.handleCancel);
|
|
@@ -5218,11 +5237,9 @@ class AbstractPointerSensor {
|
|
|
5218
5237
|
}
|
|
5219
5238
|
if (isDelayConstraint(activationConstraint)) {
|
|
5220
5239
|
this.timeoutId = setTimeout(this.handleStart, activationConstraint.delay);
|
|
5221
|
-
this.handlePending(activationConstraint);
|
|
5222
5240
|
return;
|
|
5223
5241
|
}
|
|
5224
5242
|
if (isDistanceConstraint(activationConstraint)) {
|
|
5225
|
-
this.handlePending(activationConstraint);
|
|
5226
5243
|
return;
|
|
5227
5244
|
}
|
|
5228
5245
|
}
|
|
@@ -5239,13 +5256,6 @@ class AbstractPointerSensor {
|
|
|
5239
5256
|
this.timeoutId = null;
|
|
5240
5257
|
}
|
|
5241
5258
|
}
|
|
5242
|
-
handlePending(constraint, offset) {
|
|
5243
|
-
const {
|
|
5244
|
-
active,
|
|
5245
|
-
onPending
|
|
5246
|
-
} = this.props;
|
|
5247
|
-
onPending(active, constraint, this.initialCoordinates, offset);
|
|
5248
|
-
}
|
|
5249
5259
|
handleStart() {
|
|
5250
5260
|
const {
|
|
5251
5261
|
initialCoordinates
|
|
@@ -5299,7 +5309,6 @@ class AbstractPointerSensor {
|
|
|
5299
5309
|
return this.handleCancel();
|
|
5300
5310
|
}
|
|
5301
5311
|
}
|
|
5302
|
-
this.handlePending(activationConstraint, delta);
|
|
5303
5312
|
return;
|
|
5304
5313
|
}
|
|
5305
5314
|
if (event.cancelable) {
|
|
@@ -5309,24 +5318,16 @@ class AbstractPointerSensor {
|
|
|
5309
5318
|
}
|
|
5310
5319
|
handleEnd() {
|
|
5311
5320
|
const {
|
|
5312
|
-
onAbort,
|
|
5313
5321
|
onEnd
|
|
5314
5322
|
} = this.props;
|
|
5315
5323
|
this.detach();
|
|
5316
|
-
if (!this.activated) {
|
|
5317
|
-
onAbort(this.props.active);
|
|
5318
|
-
}
|
|
5319
5324
|
onEnd();
|
|
5320
5325
|
}
|
|
5321
5326
|
handleCancel() {
|
|
5322
5327
|
const {
|
|
5323
|
-
onAbort,
|
|
5324
5328
|
onCancel
|
|
5325
5329
|
} = this.props;
|
|
5326
5330
|
this.detach();
|
|
5327
|
-
if (!this.activated) {
|
|
5328
|
-
onAbort(this.props.active);
|
|
5329
|
-
}
|
|
5330
5331
|
onCancel();
|
|
5331
5332
|
}
|
|
5332
5333
|
handleKeydown(event) {
|
|
@@ -5340,9 +5341,6 @@ class AbstractPointerSensor {
|
|
|
5340
5341
|
}
|
|
5341
5342
|
}
|
|
5342
5343
|
const events = {
|
|
5343
|
-
cancel: {
|
|
5344
|
-
name: 'pointercancel'
|
|
5345
|
-
},
|
|
5346
5344
|
move: {
|
|
5347
5345
|
name: 'pointermove'
|
|
5348
5346
|
},
|
|
@@ -5415,9 +5413,6 @@ MouseSensor.activators = [{
|
|
|
5415
5413
|
}
|
|
5416
5414
|
}];
|
|
5417
5415
|
const events$2 = {
|
|
5418
|
-
cancel: {
|
|
5419
|
-
name: 'touchcancel'
|
|
5420
|
-
},
|
|
5421
5416
|
move: {
|
|
5422
5417
|
name: 'touchmove'
|
|
5423
5418
|
},
|
|
@@ -5619,11 +5614,11 @@ function useScrollIntent(_ref2) {
|
|
|
5619
5614
|
}, [disabled, delta, previousDelta]);
|
|
5620
5615
|
}
|
|
5621
5616
|
function useCachedNode(draggableNodes, id) {
|
|
5622
|
-
const draggableNode = id
|
|
5617
|
+
const draggableNode = id !== null ? draggableNodes.get(id) : undefined;
|
|
5623
5618
|
const node = draggableNode ? draggableNode.node.current : null;
|
|
5624
5619
|
return useLazyMemo(cachedNode => {
|
|
5625
5620
|
var _ref;
|
|
5626
|
-
if (id
|
|
5621
|
+
if (id === null) {
|
|
5627
5622
|
return null;
|
|
5628
5623
|
} // In some cases, the draggable node can unmount while dragging
|
|
5629
5624
|
// This is the case for virtualized lists. In those situations,
|
|
@@ -5831,26 +5826,7 @@ function useRect(element, measure, fallbackRect) {
|
|
|
5831
5826
|
if (measure === void 0) {
|
|
5832
5827
|
measure = defaultMeasure;
|
|
5833
5828
|
}
|
|
5834
|
-
const [rect,
|
|
5835
|
-
function measureRect() {
|
|
5836
|
-
setRect(currentRect => {
|
|
5837
|
-
if (!element) {
|
|
5838
|
-
return null;
|
|
5839
|
-
}
|
|
5840
|
-
if (element.isConnected === false) {
|
|
5841
|
-
var _ref;
|
|
5842
|
-
|
|
5843
|
-
// Fall back to last rect we measured if the element is
|
|
5844
|
-
// no longer connected to the DOM.
|
|
5845
|
-
return (_ref = currentRect != null ? currentRect : fallbackRect) != null ? _ref : null;
|
|
5846
|
-
}
|
|
5847
|
-
const newRect = measure(element);
|
|
5848
|
-
if (JSON.stringify(currentRect) === JSON.stringify(newRect)) {
|
|
5849
|
-
return currentRect;
|
|
5850
|
-
}
|
|
5851
|
-
return newRect;
|
|
5852
|
-
});
|
|
5853
|
-
}
|
|
5829
|
+
const [rect, measureRect] = useReducer(reducer, null);
|
|
5854
5830
|
const mutationObserver = useMutationObserver({
|
|
5855
5831
|
callback(records) {
|
|
5856
5832
|
if (!element) {
|
|
@@ -5885,6 +5861,23 @@ function useRect(element, measure, fallbackRect) {
|
|
|
5885
5861
|
}
|
|
5886
5862
|
}, [element]);
|
|
5887
5863
|
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
|
+
}
|
|
5888
5881
|
}
|
|
5889
5882
|
function useRectDelta(rect) {
|
|
5890
5883
|
const initialRect = useInitialValue(rect);
|
|
@@ -6030,24 +6023,28 @@ function useRects(elements, measure) {
|
|
|
6030
6023
|
}
|
|
6031
6024
|
const [firstElement] = elements;
|
|
6032
6025
|
const windowRect = useWindowRect(firstElement ? getWindow(firstElement) : null);
|
|
6033
|
-
const [rects,
|
|
6034
|
-
function measureRects() {
|
|
6035
|
-
setRects(() => {
|
|
6036
|
-
if (!elements.length) {
|
|
6037
|
-
return defaultValue$2;
|
|
6038
|
-
}
|
|
6039
|
-
return elements.map(element => isDocumentScrollingElement(element) ? windowRect : new Rect(measure(element), element));
|
|
6040
|
-
});
|
|
6041
|
-
}
|
|
6026
|
+
const [rects, measureRects] = useReducer(reducer, defaultValue$2);
|
|
6042
6027
|
const resizeObserver = useResizeObserver({
|
|
6043
6028
|
callback: measureRects
|
|
6044
6029
|
});
|
|
6045
|
-
|
|
6046
|
-
resizeObserver == null ? void 0 : resizeObserver.disconnect();
|
|
6030
|
+
if (elements.length > 0 && rects === defaultValue$2) {
|
|
6047
6031
|
measureRects();
|
|
6048
|
-
|
|
6032
|
+
}
|
|
6033
|
+
useIsomorphicLayoutEffect$1(() => {
|
|
6034
|
+
if (elements.length) {
|
|
6035
|
+
elements.forEach(element => resizeObserver == null ? void 0 : resizeObserver.observe(element));
|
|
6036
|
+
} else {
|
|
6037
|
+
resizeObserver == null ? void 0 : resizeObserver.disconnect();
|
|
6038
|
+
measureRects();
|
|
6039
|
+
}
|
|
6049
6040
|
}, [elements]);
|
|
6050
6041
|
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
|
+
}
|
|
6051
6048
|
}
|
|
6052
6049
|
function getMeasurableNode(node) {
|
|
6053
6050
|
if (!node) {
|
|
@@ -6214,7 +6211,7 @@ function reducer$1(state, action) {
|
|
|
6214
6211
|
}
|
|
6215
6212
|
};
|
|
6216
6213
|
case Action.DragMove:
|
|
6217
|
-
if (state.draggable.active
|
|
6214
|
+
if (!state.draggable.active) {
|
|
6218
6215
|
return state;
|
|
6219
6216
|
}
|
|
6220
6217
|
return {
|
|
@@ -6486,7 +6483,7 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
|
6486
6483
|
containers: droppableContainers
|
|
6487
6484
|
}
|
|
6488
6485
|
} = state;
|
|
6489
|
-
const node = activeId
|
|
6486
|
+
const node = activeId ? draggableNodes.get(activeId) : null;
|
|
6490
6487
|
const activeRects = useRef({
|
|
6491
6488
|
initial: null,
|
|
6492
6489
|
translated: null
|
|
@@ -6521,7 +6518,7 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
|
6521
6518
|
const autoScrollOptions = getAutoScrollerOptions();
|
|
6522
6519
|
const initialActiveNodeRect = useInitialRect(activeNode, measuringConfiguration.draggable.measure);
|
|
6523
6520
|
useLayoutShiftScrollCompensation({
|
|
6524
|
-
activeNode: activeId
|
|
6521
|
+
activeNode: activeId ? draggableNodes.get(activeId) : null,
|
|
6525
6522
|
config: autoScrollOptions.layoutShiftCompensation,
|
|
6526
6523
|
initialRect: initialActiveNodeRect,
|
|
6527
6524
|
measure: measuringConfiguration.draggable.measure
|
|
@@ -6599,7 +6596,6 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
|
6599
6596
|
|
|
6600
6597
|
const appliedTranslate = usesDragOverlay ? modifiedTranslate : add(modifiedTranslate, activeNodeScrollDelta);
|
|
6601
6598
|
const transform = adjustScale(appliedTranslate, (_over$rect = over == null ? void 0 : over.rect) != null ? _over$rect : null, activeNodeRect);
|
|
6602
|
-
const activeSensorRef = useRef(null);
|
|
6603
6599
|
const instantiateSensor = useCallback((event, _ref2) => {
|
|
6604
6600
|
let {
|
|
6605
6601
|
sensor: Sensor,
|
|
@@ -6621,43 +6617,6 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
|
6621
6617
|
// Sensors need to be instantiated with refs for arguments that change over time
|
|
6622
6618
|
// otherwise they are frozen in time with the stale arguments
|
|
6623
6619
|
context: sensorContext,
|
|
6624
|
-
onAbort(id) {
|
|
6625
|
-
const draggableNode = draggableNodes.get(id);
|
|
6626
|
-
if (!draggableNode) {
|
|
6627
|
-
return;
|
|
6628
|
-
}
|
|
6629
|
-
const {
|
|
6630
|
-
onDragAbort
|
|
6631
|
-
} = latestProps.current;
|
|
6632
|
-
const event = {
|
|
6633
|
-
id
|
|
6634
|
-
};
|
|
6635
|
-
onDragAbort == null ? void 0 : onDragAbort(event);
|
|
6636
|
-
dispatchMonitorEvent({
|
|
6637
|
-
type: 'onDragAbort',
|
|
6638
|
-
event
|
|
6639
|
-
});
|
|
6640
|
-
},
|
|
6641
|
-
onPending(id, constraint, initialCoordinates, offset) {
|
|
6642
|
-
const draggableNode = draggableNodes.get(id);
|
|
6643
|
-
if (!draggableNode) {
|
|
6644
|
-
return;
|
|
6645
|
-
}
|
|
6646
|
-
const {
|
|
6647
|
-
onDragPending
|
|
6648
|
-
} = latestProps.current;
|
|
6649
|
-
const event = {
|
|
6650
|
-
id,
|
|
6651
|
-
constraint,
|
|
6652
|
-
initialCoordinates,
|
|
6653
|
-
offset
|
|
6654
|
-
};
|
|
6655
|
-
onDragPending == null ? void 0 : onDragPending(event);
|
|
6656
|
-
dispatchMonitorEvent({
|
|
6657
|
-
type: 'onDragPending',
|
|
6658
|
-
event
|
|
6659
|
-
});
|
|
6660
|
-
},
|
|
6661
6620
|
onStart(initialCoordinates) {
|
|
6662
6621
|
const id = activeRef.current;
|
|
6663
6622
|
if (id == null) {
|
|
@@ -6671,7 +6630,6 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
|
6671
6630
|
onDragStart
|
|
6672
6631
|
} = latestProps.current;
|
|
6673
6632
|
const event = {
|
|
6674
|
-
activatorEvent,
|
|
6675
6633
|
active: {
|
|
6676
6634
|
id,
|
|
6677
6635
|
data: draggableNode.data,
|
|
@@ -6690,8 +6648,6 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
|
6690
6648
|
type: 'onDragStart',
|
|
6691
6649
|
event
|
|
6692
6650
|
});
|
|
6693
|
-
setActiveSensor(activeSensorRef.current);
|
|
6694
|
-
setActivatorEvent(activatorEvent);
|
|
6695
6651
|
});
|
|
6696
6652
|
},
|
|
6697
6653
|
onMove(coordinates) {
|
|
@@ -6703,7 +6659,10 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
|
6703
6659
|
onEnd: createHandler(Action.DragEnd),
|
|
6704
6660
|
onCancel: createHandler(Action.DragCancel)
|
|
6705
6661
|
});
|
|
6706
|
-
|
|
6662
|
+
unstable_batchedUpdates(() => {
|
|
6663
|
+
setActiveSensor(sensorInstance);
|
|
6664
|
+
setActivatorEvent(event.nativeEvent);
|
|
6665
|
+
});
|
|
6707
6666
|
function createHandler(type) {
|
|
6708
6667
|
return async function handler() {
|
|
6709
6668
|
const {
|
|
@@ -6740,7 +6699,6 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
|
6740
6699
|
setOver(null);
|
|
6741
6700
|
setActiveSensor(null);
|
|
6742
6701
|
setActivatorEvent(null);
|
|
6743
|
-
activeSensorRef.current = null;
|
|
6744
6702
|
const eventName = type === Action.DragEnd ? 'onDragEnd' : 'onDragCancel';
|
|
6745
6703
|
if (event) {
|
|
6746
6704
|
const handler = latestProps.current[eventName];
|
|
@@ -6962,7 +6920,7 @@ const DndContext = /*#__PURE__*/memo(function DndContext(_ref) {
|
|
|
6962
6920
|
});
|
|
6963
6921
|
const NullContext = /*#__PURE__*/createContext$1(null);
|
|
6964
6922
|
const defaultRole = 'button';
|
|
6965
|
-
const ID_PREFIX$1 = '
|
|
6923
|
+
const ID_PREFIX$1 = 'Droppable';
|
|
6966
6924
|
function useDraggable(_ref) {
|
|
6967
6925
|
let {
|
|
6968
6926
|
id,
|
|
@@ -7109,7 +7067,7 @@ function useDroppable(_ref) {
|
|
|
7109
7067
|
resizeObserverConnected.current = false;
|
|
7110
7068
|
resizeObserver.observe(nodeRef.current);
|
|
7111
7069
|
}, [nodeRef, resizeObserver]);
|
|
7112
|
-
|
|
7070
|
+
useIsomorphicLayoutEffect$1(() => {
|
|
7113
7071
|
dispatch({
|
|
7114
7072
|
type: Action.RegisterDroppable,
|
|
7115
7073
|
element: {
|
|
@@ -7524,7 +7482,6 @@ var DNDCore = /*#__PURE__*/Object.freeze({
|
|
|
7524
7482
|
defaultCoordinates: defaultCoordinates,
|
|
7525
7483
|
defaultDropAnimation: defaultDropAnimationConfiguration,
|
|
7526
7484
|
defaultDropAnimationSideEffects: defaultDropAnimationSideEffects,
|
|
7527
|
-
defaultKeyboardCoordinateGetter: defaultKeyboardCoordinateGetter,
|
|
7528
7485
|
defaultScreenReaderInstructions: defaultScreenReaderInstructions,
|
|
7529
7486
|
getClientRect: getClientRect,
|
|
7530
7487
|
getFirstCollision: getFirstCollision,
|
|
@@ -8262,7 +8219,7 @@ const SortableRow = ({
|
|
|
8262
8219
|
transform,
|
|
8263
8220
|
transition
|
|
8264
8221
|
} = useSortable({
|
|
8265
|
-
id: row
|
|
8222
|
+
id: row?._id || row?.id,
|
|
8266
8223
|
disabled: row.disabled
|
|
8267
8224
|
});
|
|
8268
8225
|
const style = {
|
|
@@ -11305,14 +11262,13 @@ var isWeb = typeof window !== 'undefined' &&
|
|
|
11305
11262
|
function cloneObject(data) {
|
|
11306
11263
|
let copy;
|
|
11307
11264
|
const isArray = Array.isArray(data);
|
|
11308
|
-
const isFileListInstance = typeof FileList !== 'undefined' ? data instanceof FileList : false;
|
|
11309
11265
|
if (data instanceof Date) {
|
|
11310
11266
|
copy = new Date(data);
|
|
11311
11267
|
}
|
|
11312
11268
|
else if (data instanceof Set) {
|
|
11313
11269
|
copy = new Set(data);
|
|
11314
11270
|
}
|
|
11315
|
-
else if (!(isWeb && (data instanceof Blob ||
|
|
11271
|
+
else if (!(isWeb && (data instanceof Blob || data instanceof FileList)) &&
|
|
11316
11272
|
(isArray || isObject$2(data))) {
|
|
11317
11273
|
copy = isArray ? [] : {};
|
|
11318
11274
|
if (!isArray && !isPlainObject(data)) {
|
|
@@ -11371,7 +11327,7 @@ var set$1 = (object, path, value) => {
|
|
|
11371
11327
|
? []
|
|
11372
11328
|
: {};
|
|
11373
11329
|
}
|
|
11374
|
-
if (key === '__proto__'
|
|
11330
|
+
if (key === '__proto__') {
|
|
11375
11331
|
return;
|
|
11376
11332
|
}
|
|
11377
11333
|
object[key] = newValue;
|
|
@@ -11590,7 +11546,7 @@ function useFormState(props) {
|
|
|
11590
11546
|
_mounted.current = false;
|
|
11591
11547
|
};
|
|
11592
11548
|
}, [control]);
|
|
11593
|
-
return
|
|
11549
|
+
return getProxyFormState(formState, control, _localProxyFormState.current, false);
|
|
11594
11550
|
}
|
|
11595
11551
|
|
|
11596
11552
|
var isString = (value) => typeof value === 'string';
|
|
@@ -11686,67 +11642,6 @@ function useController(props) {
|
|
|
11686
11642
|
value,
|
|
11687
11643
|
...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}),
|
|
11688
11644
|
}));
|
|
11689
|
-
const fieldState = React__default.useMemo(() => Object.defineProperties({}, {
|
|
11690
|
-
invalid: {
|
|
11691
|
-
enumerable: true,
|
|
11692
|
-
get: () => !!get$1(formState.errors, name),
|
|
11693
|
-
},
|
|
11694
|
-
isDirty: {
|
|
11695
|
-
enumerable: true,
|
|
11696
|
-
get: () => !!get$1(formState.dirtyFields, name),
|
|
11697
|
-
},
|
|
11698
|
-
isTouched: {
|
|
11699
|
-
enumerable: true,
|
|
11700
|
-
get: () => !!get$1(formState.touchedFields, name),
|
|
11701
|
-
},
|
|
11702
|
-
isValidating: {
|
|
11703
|
-
enumerable: true,
|
|
11704
|
-
get: () => !!get$1(formState.validatingFields, name),
|
|
11705
|
-
},
|
|
11706
|
-
error: {
|
|
11707
|
-
enumerable: true,
|
|
11708
|
-
get: () => get$1(formState.errors, name),
|
|
11709
|
-
},
|
|
11710
|
-
}), [formState, name]);
|
|
11711
|
-
const field = React__default.useMemo(() => ({
|
|
11712
|
-
name,
|
|
11713
|
-
value,
|
|
11714
|
-
...(isBoolean(disabled) || formState.disabled
|
|
11715
|
-
? { disabled: formState.disabled || disabled }
|
|
11716
|
-
: {}),
|
|
11717
|
-
onChange: (event) => _registerProps.current.onChange({
|
|
11718
|
-
target: {
|
|
11719
|
-
value: getEventValue(event),
|
|
11720
|
-
name: name,
|
|
11721
|
-
},
|
|
11722
|
-
type: EVENTS.CHANGE,
|
|
11723
|
-
}),
|
|
11724
|
-
onBlur: () => _registerProps.current.onBlur({
|
|
11725
|
-
target: {
|
|
11726
|
-
value: get$1(control._formValues, name),
|
|
11727
|
-
name: name,
|
|
11728
|
-
},
|
|
11729
|
-
type: EVENTS.BLUR,
|
|
11730
|
-
}),
|
|
11731
|
-
ref: (elm) => {
|
|
11732
|
-
const field = get$1(control._fields, name);
|
|
11733
|
-
if (field && elm) {
|
|
11734
|
-
field._f.ref = {
|
|
11735
|
-
focus: () => elm.focus(),
|
|
11736
|
-
select: () => elm.select(),
|
|
11737
|
-
setCustomValidity: (message) => elm.setCustomValidity(message),
|
|
11738
|
-
reportValidity: () => elm.reportValidity(),
|
|
11739
|
-
};
|
|
11740
|
-
}
|
|
11741
|
-
},
|
|
11742
|
-
}), [
|
|
11743
|
-
name,
|
|
11744
|
-
control._formValues,
|
|
11745
|
-
disabled,
|
|
11746
|
-
formState.disabled,
|
|
11747
|
-
value,
|
|
11748
|
-
control._fields,
|
|
11749
|
-
]);
|
|
11750
11645
|
React__default.useEffect(() => {
|
|
11751
11646
|
const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
|
|
11752
11647
|
const updateMounted = (name, value) => {
|
|
@@ -11772,7 +11667,7 @@ function useController(props) {
|
|
|
11772
11667
|
};
|
|
11773
11668
|
}, [name, control, isArrayField, shouldUnregister]);
|
|
11774
11669
|
React__default.useEffect(() => {
|
|
11775
|
-
if (
|
|
11670
|
+
if (get$1(control._fields, name)) {
|
|
11776
11671
|
control._updateDisabledField({
|
|
11777
11672
|
disabled,
|
|
11778
11673
|
fields: control._fields,
|
|
@@ -11781,11 +11676,63 @@ function useController(props) {
|
|
|
11781
11676
|
});
|
|
11782
11677
|
}
|
|
11783
11678
|
}, [disabled, name, control]);
|
|
11784
|
-
return
|
|
11785
|
-
field
|
|
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
|
+
},
|
|
11786
11712
|
formState,
|
|
11787
|
-
fieldState,
|
|
11788
|
-
|
|
11713
|
+
fieldState: Object.defineProperties({}, {
|
|
11714
|
+
invalid: {
|
|
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
|
+
};
|
|
11789
11736
|
}
|
|
11790
11737
|
|
|
11791
11738
|
/**
|
|
@@ -11835,7 +11782,7 @@ const Controller = (props) => props.render(useController(props));
|
|
|
11835
11782
|
const flatten = (obj) => {
|
|
11836
11783
|
const output = {};
|
|
11837
11784
|
for (const key of Object.keys(obj)) {
|
|
11838
|
-
if (isObjectType(obj[key])
|
|
11785
|
+
if (isObjectType(obj[key])) {
|
|
11839
11786
|
const nested = flatten(obj[key]);
|
|
11840
11787
|
for (const nestedKey of Object.keys(nested)) {
|
|
11841
11788
|
output[`${key}.${nestedKey}`] = nested[nestedKey];
|
|
@@ -11904,7 +11851,7 @@ function Form(props) {
|
|
|
11904
11851
|
headers && headers['Content-Type'],
|
|
11905
11852
|
encType,
|
|
11906
11853
|
].some((value) => value && value.includes('json'));
|
|
11907
|
-
const response = await fetch(
|
|
11854
|
+
const response = await fetch(action, {
|
|
11908
11855
|
method,
|
|
11909
11856
|
headers: {
|
|
11910
11857
|
...headers,
|
|
@@ -12402,7 +12349,7 @@ var updateAt = (fieldValues, index, value) => {
|
|
|
12402
12349
|
*/
|
|
12403
12350
|
function useFieldArray(props) {
|
|
12404
12351
|
const methods = useFormContext();
|
|
12405
|
-
const { control = methods.control, name, keyName = 'id', shouldUnregister,
|
|
12352
|
+
const { control = methods.control, name, keyName = 'id', shouldUnregister, } = props;
|
|
12406
12353
|
const [fields, setFields] = React__default.useState(control._getFieldArray(name));
|
|
12407
12354
|
const ids = React__default.useRef(control._getFieldArray(name).map(generateId));
|
|
12408
12355
|
const _fieldIds = React__default.useRef(fields);
|
|
@@ -12411,8 +12358,8 @@ function useFieldArray(props) {
|
|
|
12411
12358
|
_name.current = name;
|
|
12412
12359
|
_fieldIds.current = fields;
|
|
12413
12360
|
control._names.array.add(name);
|
|
12414
|
-
rules &&
|
|
12415
|
-
control.register(name, rules);
|
|
12361
|
+
props.rules &&
|
|
12362
|
+
control.register(name, props.rules);
|
|
12416
12363
|
useSubscribe({
|
|
12417
12364
|
next: ({ values, name: fieldArrayName, }) => {
|
|
12418
12365
|
if (fieldArrayName === _name.current || !fieldArrayName) {
|
|
@@ -12456,8 +12403,6 @@ function useFieldArray(props) {
|
|
|
12456
12403
|
ids.current = removeArrayAt(ids.current, index);
|
|
12457
12404
|
updateValues(updatedFieldArrayValues);
|
|
12458
12405
|
setFields(updatedFieldArrayValues);
|
|
12459
|
-
!Array.isArray(get$1(control._fields, name)) &&
|
|
12460
|
-
set$1(control._fields, name, undefined);
|
|
12461
12406
|
control._updateFieldArray(name, updatedFieldArrayValues, removeArrayAt, {
|
|
12462
12407
|
argA: index,
|
|
12463
12408
|
});
|
|
@@ -12772,8 +12717,7 @@ var getRuleValue = (rule) => isUndefined(rule)
|
|
|
12772
12717
|
: rule;
|
|
12773
12718
|
|
|
12774
12719
|
const ASYNC_FUNCTION = 'AsyncFunction';
|
|
12775
|
-
var hasPromiseValidation = (fieldReference) =>
|
|
12776
|
-
!!fieldReference.validate &&
|
|
12720
|
+
var hasPromiseValidation = (fieldReference) => (!fieldReference || !fieldReference.validate) &&
|
|
12777
12721
|
!!((isFunction$1(fieldReference.validate) &&
|
|
12778
12722
|
fieldReference.validate.constructor.name === ASYNC_FUNCTION) ||
|
|
12779
12723
|
(isObject$2(fieldReference.validate) &&
|
|
@@ -12902,7 +12846,7 @@ function createFormControl(props = {}) {
|
|
|
12902
12846
|
timer = setTimeout(callback, wait);
|
|
12903
12847
|
};
|
|
12904
12848
|
const _updateValid = async (shouldUpdateValid) => {
|
|
12905
|
-
if (!
|
|
12849
|
+
if (!props.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
|
|
12906
12850
|
const isValid = _options.resolver
|
|
12907
12851
|
? isEmptyObject((await _executeSchema()).errors)
|
|
12908
12852
|
: await executeBuiltInValidation(_fields, true);
|
|
@@ -12914,7 +12858,7 @@ function createFormControl(props = {}) {
|
|
|
12914
12858
|
}
|
|
12915
12859
|
};
|
|
12916
12860
|
const _updateIsValidating = (names, isValidating) => {
|
|
12917
|
-
if (!
|
|
12861
|
+
if (!props.disabled &&
|
|
12918
12862
|
(_proxyFormState.isValidating || _proxyFormState.validatingFields)) {
|
|
12919
12863
|
(names || Array.from(_names.mount)).forEach((name) => {
|
|
12920
12864
|
if (name) {
|
|
@@ -12930,7 +12874,7 @@ function createFormControl(props = {}) {
|
|
|
12930
12874
|
}
|
|
12931
12875
|
};
|
|
12932
12876
|
const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
|
|
12933
|
-
if (args && method && !
|
|
12877
|
+
if (args && method && !props.disabled) {
|
|
12934
12878
|
_state.action = true;
|
|
12935
12879
|
if (shouldUpdateFieldsAndState && Array.isArray(get$1(_fields, name))) {
|
|
12936
12880
|
const fieldValues = method(get$1(_fields, name), args.argA, args.argB);
|
|
@@ -12994,7 +12938,7 @@ function createFormControl(props = {}) {
|
|
|
12994
12938
|
const output = {
|
|
12995
12939
|
name,
|
|
12996
12940
|
};
|
|
12997
|
-
if (!
|
|
12941
|
+
if (!props.disabled) {
|
|
12998
12942
|
const disabledField = !!(get$1(_fields, name) &&
|
|
12999
12943
|
get$1(_fields, name)._f &&
|
|
13000
12944
|
get$1(_fields, name)._f.disabled);
|
|
@@ -13035,9 +12979,9 @@ function createFormControl(props = {}) {
|
|
|
13035
12979
|
const shouldUpdateValid = _proxyFormState.isValid &&
|
|
13036
12980
|
isBoolean(isValid) &&
|
|
13037
12981
|
_formState.isValid !== isValid;
|
|
13038
|
-
if (
|
|
12982
|
+
if (props.delayError && error) {
|
|
13039
12983
|
delayErrorCallback = debounce(() => updateErrors(name, error));
|
|
13040
|
-
delayErrorCallback(
|
|
12984
|
+
delayErrorCallback(props.delayError);
|
|
13041
12985
|
}
|
|
13042
12986
|
else {
|
|
13043
12987
|
clearTimeout(timer);
|
|
@@ -13130,7 +13074,7 @@ function createFormControl(props = {}) {
|
|
|
13130
13074
|
}
|
|
13131
13075
|
_names.unMount = new Set();
|
|
13132
13076
|
};
|
|
13133
|
-
const _getDirty = (name, data) => !
|
|
13077
|
+
const _getDirty = (name, data) => !props.disabled &&
|
|
13134
13078
|
(name && data && set$1(_formValues, name, data),
|
|
13135
13079
|
!deepEqual(getValues(), _defaultValues));
|
|
13136
13080
|
const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
|
|
@@ -13142,7 +13086,7 @@ function createFormControl(props = {}) {
|
|
|
13142
13086
|
? { [names]: defaultValue }
|
|
13143
13087
|
: defaultValue),
|
|
13144
13088
|
}, isGlobal, defaultValue);
|
|
13145
|
-
const _getFieldArray = (name) => compact(get$1(_state.mount ? _formValues : _defaultValues, name,
|
|
13089
|
+
const _getFieldArray = (name) => compact(get$1(_state.mount ? _formValues : _defaultValues, name, props.shouldUnregister ? get$1(_defaultValues, name, []) : []));
|
|
13146
13090
|
const setFieldValue = (name, value, options = {}) => {
|
|
13147
13091
|
const field = get$1(_fields, name);
|
|
13148
13092
|
let fieldValue = value;
|
|
@@ -13275,7 +13219,7 @@ function createFormControl(props = {}) {
|
|
|
13275
13219
|
});
|
|
13276
13220
|
if (shouldSkipValidation) {
|
|
13277
13221
|
if (_proxyFormState.isValid) {
|
|
13278
|
-
if (
|
|
13222
|
+
if (props.mode === 'onBlur') {
|
|
13279
13223
|
if (isBlurEvent) {
|
|
13280
13224
|
_updateValid();
|
|
13281
13225
|
}
|
|
@@ -13440,15 +13384,13 @@ function createFormControl(props = {}) {
|
|
|
13440
13384
|
: isUndefined(value)
|
|
13441
13385
|
? getFieldValue(field ? field._f : get$1(fields, name)._f)
|
|
13442
13386
|
: value;
|
|
13443
|
-
|
|
13444
|
-
set$1(_formValues, name, inputValue);
|
|
13445
|
-
}
|
|
13387
|
+
set$1(_formValues, name, inputValue);
|
|
13446
13388
|
updateTouchAndDirty(name, inputValue, false, false, true);
|
|
13447
13389
|
}
|
|
13448
13390
|
};
|
|
13449
13391
|
const register = (name, options = {}) => {
|
|
13450
13392
|
let field = get$1(_fields, name);
|
|
13451
|
-
const disabledIsDefined = isBoolean(options.disabled) || isBoolean(
|
|
13393
|
+
const disabledIsDefined = isBoolean(options.disabled) || isBoolean(props.disabled);
|
|
13452
13394
|
set$1(_fields, name, {
|
|
13453
13395
|
...(field || {}),
|
|
13454
13396
|
_f: {
|
|
@@ -13464,7 +13406,7 @@ function createFormControl(props = {}) {
|
|
|
13464
13406
|
field,
|
|
13465
13407
|
disabled: isBoolean(options.disabled)
|
|
13466
13408
|
? options.disabled
|
|
13467
|
-
:
|
|
13409
|
+
: props.disabled,
|
|
13468
13410
|
name,
|
|
13469
13411
|
value: options.value,
|
|
13470
13412
|
});
|
|
@@ -13474,7 +13416,7 @@ function createFormControl(props = {}) {
|
|
|
13474
13416
|
}
|
|
13475
13417
|
return {
|
|
13476
13418
|
...(disabledIsDefined
|
|
13477
|
-
? { disabled: options.disabled ||
|
|
13419
|
+
? { disabled: options.disabled || props.disabled }
|
|
13478
13420
|
: {}),
|
|
13479
13421
|
...(_options.progressive
|
|
13480
13422
|
? {
|
|
@@ -13558,12 +13500,6 @@ function createFormControl(props = {}) {
|
|
|
13558
13500
|
e.preventDefault && e.preventDefault();
|
|
13559
13501
|
e.persist && e.persist();
|
|
13560
13502
|
}
|
|
13561
|
-
if (_options.disabled) {
|
|
13562
|
-
if (onInvalid) {
|
|
13563
|
-
await onInvalid({ ..._formState.errors }, e);
|
|
13564
|
-
}
|
|
13565
|
-
return;
|
|
13566
|
-
}
|
|
13567
13503
|
let fieldValues = cloneObject(_formValues);
|
|
13568
13504
|
_subjects.state.next({
|
|
13569
13505
|
isSubmitting: true,
|
|
@@ -13671,7 +13607,7 @@ function createFormControl(props = {}) {
|
|
|
13671
13607
|
}
|
|
13672
13608
|
_fields = {};
|
|
13673
13609
|
}
|
|
13674
|
-
_formValues =
|
|
13610
|
+
_formValues = props.shouldUnregister
|
|
13675
13611
|
? keepStateOptions.keepDefaultValues
|
|
13676
13612
|
? cloneObject(_defaultValues)
|
|
13677
13613
|
: {}
|
|
@@ -13695,7 +13631,7 @@ function createFormControl(props = {}) {
|
|
|
13695
13631
|
!_proxyFormState.isValid ||
|
|
13696
13632
|
!!keepStateOptions.keepIsValid ||
|
|
13697
13633
|
!!keepStateOptions.keepDirtyValues;
|
|
13698
|
-
_state.watch = !!
|
|
13634
|
+
_state.watch = !!props.shouldUnregister;
|
|
13699
13635
|
_subjects.state.next({
|
|
13700
13636
|
submitCount: keepStateOptions.keepSubmitCount
|
|
13701
13637
|
? _formState.submitCount
|
|
@@ -13742,9 +13678,7 @@ function createFormControl(props = {}) {
|
|
|
13742
13678
|
: fieldReference.ref;
|
|
13743
13679
|
if (fieldRef.focus) {
|
|
13744
13680
|
fieldRef.focus();
|
|
13745
|
-
options.shouldSelect &&
|
|
13746
|
-
isFunction$1(fieldRef.select) &&
|
|
13747
|
-
fieldRef.select();
|
|
13681
|
+
options.shouldSelect && fieldRef.select();
|
|
13748
13682
|
}
|
|
13749
13683
|
}
|
|
13750
13684
|
};
|
|
@@ -13866,8 +13800,8 @@ function createFormControl(props = {}) {
|
|
|
13866
13800
|
* ```
|
|
13867
13801
|
*/
|
|
13868
13802
|
function useForm(props = {}) {
|
|
13869
|
-
const _formControl = React__default.useRef(
|
|
13870
|
-
const _values = React__default.useRef(
|
|
13803
|
+
const _formControl = React__default.useRef();
|
|
13804
|
+
const _values = React__default.useRef();
|
|
13871
13805
|
const [formState, updateFormState] = React__default.useState({
|
|
13872
13806
|
isDirty: false,
|
|
13873
13807
|
isValidating: false,
|
|
@@ -13945,6 +13879,11 @@ function useForm(props = {}) {
|
|
|
13945
13879
|
values: control._getWatch(),
|
|
13946
13880
|
});
|
|
13947
13881
|
}, [props.shouldUnregister, control]);
|
|
13882
|
+
React__default.useEffect(() => {
|
|
13883
|
+
if (_formControl.current) {
|
|
13884
|
+
_formControl.current.watch = _formControl.current.watch.bind({});
|
|
13885
|
+
}
|
|
13886
|
+
}, [formState]);
|
|
13948
13887
|
_formControl.current.formState = getProxyFormState(formState, control);
|
|
13949
13888
|
return _formControl.current;
|
|
13950
13889
|
}
|
|
@@ -14414,230 +14353,9 @@ const TableHead = /*#__PURE__*/React__default.memo(({
|
|
|
14414
14353
|
});
|
|
14415
14354
|
});
|
|
14416
14355
|
|
|
14417
|
-
|
|
14418
|
-
let siblingsArray = parentSiblings;
|
|
14419
|
-
let isLastNode = isLast;
|
|
14420
|
-
if (checkEmpty(parentSiblings)) {
|
|
14421
|
-
isLastNode = false;
|
|
14422
|
-
if (!isNaN(level)) {
|
|
14423
|
-
siblingsArray = Array(level).fill(true);
|
|
14424
|
-
}
|
|
14425
|
-
}
|
|
14426
|
-
return jsx("div", {
|
|
14427
|
-
className: "tree-table-space-container",
|
|
14428
|
-
children: siblingsArray?.reverse()?.map((line, i) => jsx("span", {
|
|
14429
|
-
className: `tree-table-space-block ${!line ? 'no-lines' : ''} ${isLastNode && i === level - 1 ? 'last-node' : ''}`
|
|
14430
|
-
}, i))
|
|
14431
|
-
});
|
|
14432
|
-
};
|
|
14433
|
-
const TableCell = /*#__PURE__*/React__default.memo(({
|
|
14434
|
-
col,
|
|
14435
|
-
node,
|
|
14436
|
-
selected,
|
|
14437
|
-
select,
|
|
14438
|
-
onCheckBoxChange,
|
|
14439
|
-
onToggleExpand
|
|
14440
|
-
}) => jsxs("td", {
|
|
14441
|
-
className: `${col.isTree && node.folder ? 'folder' : ''}`,
|
|
14442
|
-
children: [col.isTree && renderSpaces(node.hierarchy + 1, node.parentSiblings, node.last), jsxs("div", {
|
|
14443
|
-
className: "tree-title-container",
|
|
14444
|
-
children: [col.isTree && jsx("span", {
|
|
14445
|
-
className: `tree-table-space-block last-block ${node.expand ? 'tree-row-expanded' : 'tree-row-collapsed'} ${node.container ? '' : 'no-folder'}`,
|
|
14446
|
-
onClick: () => onToggleExpand(node),
|
|
14447
|
-
children: node.container && node?.resourceCount + node?.subContainerCount > 0 && jsxs("span", {
|
|
14448
|
-
onClick: () => onToggleExpand(node),
|
|
14449
|
-
children: [' ', jsx(SvgArrowsDownIcon, {})]
|
|
14450
|
-
})
|
|
14451
|
-
}), jsxs("span", {
|
|
14452
|
-
className: `tree-table-td-content ${col.isTree && node.folder ? 'folder' : ''}`,
|
|
14453
|
-
children: [col.isTree && select === 'checkbox' && jsx(Checkbox, {
|
|
14454
|
-
checked: node?.checked || false,
|
|
14455
|
-
partial: node?.checked === 'partial',
|
|
14456
|
-
onChange: e => onCheckBoxChange(e, node)
|
|
14457
|
-
}), col.isTree && select === 'radio' && jsx(RadioButton, {
|
|
14458
|
-
name: node.title,
|
|
14459
|
-
checked: selected.includes(node.id),
|
|
14460
|
-
value: node.id,
|
|
14461
|
-
onChange: e => onCheckBoxChange(e, node)
|
|
14462
|
-
}), jsx("span", {
|
|
14463
|
-
className: "tree-table-td-content-text",
|
|
14464
|
-
children: prepareData(node, col)
|
|
14465
|
-
})]
|
|
14466
|
-
})]
|
|
14467
|
-
}), col.actions && jsx("div", {
|
|
14468
|
-
className: "table-tree-row-action",
|
|
14469
|
-
children: col.actions(node)
|
|
14470
|
-
})]
|
|
14471
|
-
}));
|
|
14472
|
-
|
|
14473
|
-
const TableRow = /*#__PURE__*/React__default.memo(({
|
|
14474
|
-
node,
|
|
14475
|
-
columnsData,
|
|
14476
|
-
selected,
|
|
14477
|
-
select,
|
|
14478
|
-
onRowClick,
|
|
14479
|
-
onToggleExpand,
|
|
14480
|
-
onCheckBoxChange
|
|
14481
|
-
}) => jsx("tr", {
|
|
14482
|
-
"data-level": node.hierarchy,
|
|
14483
|
-
className: "show",
|
|
14484
|
-
onClick: e => onRowClick(e, node),
|
|
14485
|
-
children: columnsData.map(col => jsx(TableCell, {
|
|
14486
|
-
col: col,
|
|
14487
|
-
node: node,
|
|
14488
|
-
selected: selected,
|
|
14489
|
-
select: select,
|
|
14490
|
-
onCheckBoxChange: onCheckBoxChange,
|
|
14491
|
-
onToggleExpand: onToggleExpand
|
|
14492
|
-
}, col.name))
|
|
14493
|
-
}));
|
|
14494
|
-
|
|
14495
|
-
const TableBody = /*#__PURE__*/React__default.memo(({
|
|
14496
|
-
flattenedTreeData,
|
|
14497
|
-
columnsData,
|
|
14498
|
-
selected,
|
|
14499
|
-
select,
|
|
14500
|
-
onRowClick,
|
|
14501
|
-
onToggleExpand,
|
|
14502
|
-
onCheckBoxChange
|
|
14503
|
-
}) => checkEmpty(flattenedTreeData) ? null : jsxs("tbody", {
|
|
14504
|
-
className: "ff-table-tree-body",
|
|
14505
|
-
children: [jsx("tr", {
|
|
14506
|
-
id: "ff-table-tree-first-node"
|
|
14507
|
-
}), flattenedTreeData?.map((node, index) => {
|
|
14508
|
-
return jsx(TableRow, {
|
|
14509
|
-
node: node,
|
|
14510
|
-
columnsData: columnsData,
|
|
14511
|
-
selected: selected,
|
|
14512
|
-
select: select,
|
|
14513
|
-
onRowClick: onRowClick,
|
|
14514
|
-
onToggleExpand: node => onToggleExpand(node, index),
|
|
14515
|
-
onCheckBoxChange: onCheckBoxChange
|
|
14516
|
-
}, node.searchKey);
|
|
14517
|
-
}), jsx("tr", {
|
|
14518
|
-
id: "ff-table-tree-last-node"
|
|
14519
|
-
})]
|
|
14520
|
-
}));
|
|
14521
|
-
|
|
14522
|
-
const TreeTable = ({
|
|
14523
|
-
treeData,
|
|
14524
|
-
columnsData,
|
|
14525
|
-
selected = [],
|
|
14526
|
-
select = null,
|
|
14527
|
-
onChange,
|
|
14528
|
-
onClick,
|
|
14529
|
-
onExpand,
|
|
14530
|
-
loadMore = () => {},
|
|
14531
|
-
tableBorder,
|
|
14532
|
-
height = 'auto'
|
|
14533
|
-
}) => {
|
|
14534
|
-
// const treeRef = useRef(null);
|
|
14535
|
-
useIntersectionObserver(['ff-table-tree-last-node', 'ff-table-tree-first-node'], {
|
|
14536
|
-
root: document.getElementById('ff-table-tree-scroll-container'),
|
|
14537
|
-
rootMargin: '8px',
|
|
14538
|
-
threshold: 0.1,
|
|
14539
|
-
onIntersect: entry => {
|
|
14540
|
-
if (entry.isIntersecting) {
|
|
14541
|
-
if (loadMore) {
|
|
14542
|
-
let direction = 'above';
|
|
14543
|
-
if (entry.target.id === 'ff-table-tree-last-node') {
|
|
14544
|
-
direction = 'below';
|
|
14545
|
-
}
|
|
14546
|
-
loadMore(direction);
|
|
14547
|
-
}
|
|
14548
|
-
}
|
|
14549
|
-
}
|
|
14550
|
-
});
|
|
14551
|
-
const handleToggleExpand = useCallback((node, index) => onExpand?.(node, index), [onExpand]);
|
|
14552
|
-
const handleCheckBoxChange = useCallback((e, node) => {
|
|
14553
|
-
onChange?.(e, node);
|
|
14554
|
-
}, [onChange]);
|
|
14555
|
-
const handleRowClick = useCallback((e, node) => onClick?.(e, node), [onClick]);
|
|
14556
|
-
return jsx("div", {
|
|
14557
|
-
className: "tree-table-wrap",
|
|
14558
|
-
children: jsx("div", {
|
|
14559
|
-
className: "table-scrollable",
|
|
14560
|
-
id: "ff-table-tree-scroll-container",
|
|
14561
|
-
// ref={treeRef}
|
|
14562
|
-
style: {
|
|
14563
|
-
'--table-height': `${height !== 'auto' ? height + 'px' : height}`,
|
|
14564
|
-
border: tableBorder
|
|
14565
|
-
},
|
|
14566
|
-
children: jsxs("table", {
|
|
14567
|
-
className: "tree-table",
|
|
14568
|
-
children: [jsx(TableHead, {
|
|
14569
|
-
columnsData: columnsData
|
|
14570
|
-
}), jsx(TableBody, {
|
|
14571
|
-
flattenedTreeData: treeData,
|
|
14572
|
-
columnsData: columnsData,
|
|
14573
|
-
selected: selected,
|
|
14574
|
-
select: select,
|
|
14575
|
-
onRowClick: handleRowClick,
|
|
14576
|
-
onToggleExpand: handleToggleExpand,
|
|
14577
|
-
onCheckBoxChange: handleCheckBoxChange
|
|
14578
|
-
})]
|
|
14579
|
-
})
|
|
14580
|
-
})
|
|
14581
|
-
});
|
|
14582
|
-
};
|
|
14583
|
-
var TableTree = /*#__PURE__*/memo(TreeTable);
|
|
14584
|
-
|
|
14585
|
-
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}";
|
|
14356
|
+
var css_248z$O = ".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}";
|
|
14586
14357
|
styleInject(css_248z$O);
|
|
14587
14358
|
|
|
14588
|
-
const Tabs = ({
|
|
14589
|
-
variant = 'default',
|
|
14590
|
-
tabsData,
|
|
14591
|
-
activeTabId,
|
|
14592
|
-
onTabClick,
|
|
14593
|
-
noBorder = false,
|
|
14594
|
-
noPadding = false
|
|
14595
|
-
}) => {
|
|
14596
|
-
return jsxs("div", {
|
|
14597
|
-
className: `ff-tabs-container`,
|
|
14598
|
-
children: [jsx("div", {
|
|
14599
|
-
className: classNames(`ff-tab-row--${variant}`, {
|
|
14600
|
-
'ff-tab-row--no-border': noBorder,
|
|
14601
|
-
'ff-tab-row--no-padding': noPadding
|
|
14602
|
-
}),
|
|
14603
|
-
children: tabsData.map(tab => jsxs("button", {
|
|
14604
|
-
onClick: () => !tab.disabled && onTabClick(tab.id),
|
|
14605
|
-
disabled: tab.disabled,
|
|
14606
|
-
className: classNames(`ff-tab-button--${variant}`, {
|
|
14607
|
-
disabled: tab.disabled,
|
|
14608
|
-
active: activeTabId === tab.id
|
|
14609
|
-
}),
|
|
14610
|
-
children: [jsxs("div", {
|
|
14611
|
-
className: "label-count-section",
|
|
14612
|
-
children: [jsx(Typography, {
|
|
14613
|
-
children: tab.label,
|
|
14614
|
-
lineHeight: "18px",
|
|
14615
|
-
fontWeight: activeTabId === tab.id ? 'semi-bold' : 'regular',
|
|
14616
|
-
color: activeTabId === tab.id ? 'var(--tabs-label-active-color)' : 'var(--tabs-label-default-color)',
|
|
14617
|
-
className: classNames('ff-tab-label', {
|
|
14618
|
-
'ff-tab-label--active': activeTabId === tab.id
|
|
14619
|
-
})
|
|
14620
|
-
}), variant === 'default' && tab.count && jsx("span", {
|
|
14621
|
-
className: classNames('tab-count', {
|
|
14622
|
-
'tab-count--active': activeTabId === tab.id
|
|
14623
|
-
}),
|
|
14624
|
-
children: tab.count
|
|
14625
|
-
})]
|
|
14626
|
-
}), jsx("div", {
|
|
14627
|
-
className: classNames('ff-tab-bar', {
|
|
14628
|
-
'ff-tab-bar--active': activeTabId === tab.id
|
|
14629
|
-
})
|
|
14630
|
-
}), jsx("span", {
|
|
14631
|
-
className: `ff-defaultStatus ${tab.status === 'success' ? 'ff-successStatus' : tab.status === 'error' ? 'ff-dangerStatus' : ''}`
|
|
14632
|
-
})]
|
|
14633
|
-
}, tab.id))
|
|
14634
|
-
}), jsx("div", {
|
|
14635
|
-
className: `ff-tab-content`,
|
|
14636
|
-
children: tabsData.find(tab => tab.id === activeTabId)?.component
|
|
14637
|
-
})]
|
|
14638
|
-
});
|
|
14639
|
-
};
|
|
14640
|
-
|
|
14641
14359
|
var css_248z$N = ".ff-highlight-bg {\n background-color: var(--text-bg-highlight);\n}";
|
|
14642
14360
|
styleInject(css_248z$N);
|
|
14643
14361
|
|
|
@@ -14662,9 +14380,459 @@ const HighlightText = ({
|
|
|
14662
14380
|
});
|
|
14663
14381
|
};
|
|
14664
14382
|
|
|
14665
|
-
|
|
14383
|
+
const getErrorMessage$1 = (inputValue, text, customError, customErrorCondition) => {
|
|
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}";
|
|
14666
14778
|
styleInject(css_248z$M);
|
|
14667
14779
|
|
|
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
|
+
|
|
14668
14836
|
const Search = ({
|
|
14669
14837
|
placeholder = 'Search',
|
|
14670
14838
|
onSearch,
|
|
@@ -18149,53 +18317,6 @@ function setYear(date, year, options) {
|
|
|
18149
18317
|
return date_;
|
|
18150
18318
|
}
|
|
18151
18319
|
|
|
18152
|
-
const FIVE_WEEKS = 5;
|
|
18153
|
-
const FOUR_WEEKS = 4;
|
|
18154
|
-
/**
|
|
18155
|
-
* Return the number of weeks to display in the broadcast calendar.
|
|
18156
|
-
*
|
|
18157
|
-
* @since 9.4.0
|
|
18158
|
-
*/
|
|
18159
|
-
function getBroadcastWeeksInMonth(month, dateLib) {
|
|
18160
|
-
// Get the first day of the month
|
|
18161
|
-
const firstDayOfMonth = dateLib.startOfMonth(month);
|
|
18162
|
-
// Get the day of the week for the first day of the month (1-7, where 1 is Monday)
|
|
18163
|
-
const firstDayOfWeek = firstDayOfMonth.getDay() > 0 ? firstDayOfMonth.getDay() : 7;
|
|
18164
|
-
const broadcastStartDate = dateLib.addDays(month, -firstDayOfWeek + 1);
|
|
18165
|
-
const lastDateOfLastWeek = dateLib.addDays(broadcastStartDate, FIVE_WEEKS * 7 - 1);
|
|
18166
|
-
const numberOfWeeks = month.getMonth() === lastDateOfLastWeek.getMonth() ? FIVE_WEEKS : FOUR_WEEKS;
|
|
18167
|
-
return numberOfWeeks;
|
|
18168
|
-
}
|
|
18169
|
-
|
|
18170
|
-
/**
|
|
18171
|
-
* Return the start date of the week in the broadcast calendar.
|
|
18172
|
-
*
|
|
18173
|
-
* @since 9.4.0
|
|
18174
|
-
*/
|
|
18175
|
-
function startOfBroadcastWeek(date, dateLib) {
|
|
18176
|
-
const firstOfMonth = dateLib.startOfMonth(date);
|
|
18177
|
-
const dayOfWeek = firstOfMonth.getDay();
|
|
18178
|
-
if (dayOfWeek === 1) {
|
|
18179
|
-
return firstOfMonth;
|
|
18180
|
-
} else if (dayOfWeek === 0) {
|
|
18181
|
-
return dateLib.addDays(firstOfMonth, -1 * 6);
|
|
18182
|
-
} else {
|
|
18183
|
-
return dateLib.addDays(firstOfMonth, -1 * (dayOfWeek - 1));
|
|
18184
|
-
}
|
|
18185
|
-
}
|
|
18186
|
-
|
|
18187
|
-
/**
|
|
18188
|
-
* Return the end date of the week in the broadcast calendar.
|
|
18189
|
-
*
|
|
18190
|
-
* @since 9.4.0
|
|
18191
|
-
*/
|
|
18192
|
-
function endOfBroadcastWeek(date, dateLib) {
|
|
18193
|
-
const startDate = startOfBroadcastWeek(date, dateLib);
|
|
18194
|
-
const numberOfWeeks = getBroadcastWeeksInMonth(date, dateLib);
|
|
18195
|
-
const endDate = dateLib.addDays(startDate, numberOfWeeks * 7 - 1);
|
|
18196
|
-
return endDate;
|
|
18197
|
-
}
|
|
18198
|
-
|
|
18199
18320
|
/**
|
|
18200
18321
|
* A wrapper class around [date-fns](http://date-fns.org) sharing the same
|
|
18201
18322
|
* options. Methods of this class can be overridden using the
|
|
@@ -18276,15 +18397,6 @@ class DateLib {
|
|
|
18276
18397
|
this.differenceInCalendarMonths = (dateLeft, dateRight) => {
|
|
18277
18398
|
return this.overrides?.differenceInCalendarMonths ? this.overrides.differenceInCalendarMonths(dateLeft, dateRight) : differenceInCalendarMonths(dateLeft, dateRight);
|
|
18278
18399
|
};
|
|
18279
|
-
/**
|
|
18280
|
-
* Returns the end of the broadcast week for the given date.
|
|
18281
|
-
*
|
|
18282
|
-
* @param date The original date.
|
|
18283
|
-
* @returns The end of the broadcast week.
|
|
18284
|
-
*/
|
|
18285
|
-
this.endOfBroadcastWeek = date => {
|
|
18286
|
-
return this.overrides?.endOfBroadcastWeek ? this.overrides.endOfBroadcastWeek(date, this) : endOfBroadcastWeek(date, this);
|
|
18287
|
-
};
|
|
18288
18400
|
/**
|
|
18289
18401
|
* Returns the end of the ISO week for the given date.
|
|
18290
18402
|
*
|
|
@@ -18446,15 +18558,6 @@ class DateLib {
|
|
|
18446
18558
|
this.setYear = (date, year) => {
|
|
18447
18559
|
return this.overrides?.setYear ? this.overrides.setYear(date, year) : setYear(date, year);
|
|
18448
18560
|
};
|
|
18449
|
-
/**
|
|
18450
|
-
* Returns the start of the broadcast week for the given date.
|
|
18451
|
-
*
|
|
18452
|
-
* @param date The original date.
|
|
18453
|
-
* @returns The start of the broadcast week.
|
|
18454
|
-
*/
|
|
18455
|
-
this.startOfBroadcastWeek = date => {
|
|
18456
|
-
return this.overrides?.startOfBroadcastWeek ? this.overrides.startOfBroadcastWeek(date, this) : startOfBroadcastWeek(date, this);
|
|
18457
|
-
};
|
|
18458
18561
|
/**
|
|
18459
18562
|
* Returns the start of the day for the given date.
|
|
18460
18563
|
*
|
|
@@ -18937,9 +19040,7 @@ function Weekday(props) {
|
|
|
18937
19040
|
* @see https://daypicker.dev/guides/custom-components
|
|
18938
19041
|
*/
|
|
18939
19042
|
function Weekdays(props) {
|
|
18940
|
-
return /*#__PURE__*/React__default.createElement("thead", {
|
|
18941
|
-
"aria-hidden": true
|
|
18942
|
-
}, /*#__PURE__*/React__default.createElement("tr", {
|
|
19043
|
+
return /*#__PURE__*/React__default.createElement("thead", null, /*#__PURE__*/React__default.createElement("tr", {
|
|
18943
19044
|
...props
|
|
18944
19045
|
}));
|
|
18945
19046
|
}
|
|
@@ -19042,8 +19143,7 @@ function getDataAttributes(props) {
|
|
|
19042
19143
|
"data-mode": props.mode ?? undefined,
|
|
19043
19144
|
"data-required": "required" in props ? props.required : undefined,
|
|
19044
19145
|
"data-multiple-months": props.numberOfMonths && props.numberOfMonths > 1 || undefined,
|
|
19045
|
-
"data-week-numbers": props.showWeekNumber || undefined
|
|
19046
|
-
"data-broadcast-calendar": props.broadcastCalendar || undefined
|
|
19146
|
+
"data-week-numbers": props.showWeekNumber || undefined
|
|
19047
19147
|
};
|
|
19048
19148
|
Object.entries(props).forEach(([key, val]) => {
|
|
19049
19149
|
if (key.startsWith("data-")) {
|
|
@@ -19109,7 +19209,7 @@ function formatDay(date, options, dateLib) {
|
|
|
19109
19209
|
*/
|
|
19110
19210
|
function formatMonthDropdown(/** The month number to format. */
|
|
19111
19211
|
monthNumber, /** The locale to use for formatting. */
|
|
19112
|
-
locale) {
|
|
19212
|
+
locale = enUS$1) {
|
|
19113
19213
|
return locale.localize?.month(monthNumber);
|
|
19114
19214
|
}
|
|
19115
19215
|
|
|
@@ -19199,12 +19299,13 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
|
|
|
19199
19299
|
if (!navEnd) return undefined;
|
|
19200
19300
|
const {
|
|
19201
19301
|
addMonths,
|
|
19202
|
-
startOfMonth
|
|
19302
|
+
startOfMonth,
|
|
19303
|
+
isBefore
|
|
19203
19304
|
} = dateLib;
|
|
19204
19305
|
const year = displayMonth.getFullYear();
|
|
19205
19306
|
const months = [];
|
|
19206
19307
|
let month = navStart;
|
|
19207
|
-
while (months.length < 12) {
|
|
19308
|
+
while (months.length < 12 && isBefore(month, addMonths(navEnd, 1))) {
|
|
19208
19309
|
months.push(month.getMonth());
|
|
19209
19310
|
month = addMonths(month, 1);
|
|
19210
19311
|
}
|
|
@@ -19212,7 +19313,7 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
|
|
|
19212
19313
|
return a - b;
|
|
19213
19314
|
});
|
|
19214
19315
|
const options = sortedMonths.map(value => {
|
|
19215
|
-
const label = formatters.formatMonthDropdown(value, dateLib.options.locale
|
|
19316
|
+
const label = formatters.formatMonthDropdown(value, dateLib.options.locale);
|
|
19216
19317
|
const month = dateLib.Date ? new dateLib.Date(year, value) : new Date(year, value);
|
|
19217
19318
|
const disabled = navStart && month < startOfMonth(navStart) || navEnd && month > startOfMonth(navEnd) || false;
|
|
19218
19319
|
return {
|
|
@@ -19587,8 +19688,7 @@ function tzName(tz, date) {
|
|
|
19587
19688
|
*/
|
|
19588
19689
|
function getWeekdays(/** The date library. */
|
|
19589
19690
|
dateLib, /** Use ISOWeek instead of locale/ */
|
|
19590
|
-
ISOWeek, timeZone
|
|
19591
|
-
broadcastCalendar) {
|
|
19691
|
+
ISOWeek, timeZone) {
|
|
19592
19692
|
const date = timeZone ? TZDate.tz(timeZone) : dateLib.Date ? new dateLib.Date() : new Date();
|
|
19593
19693
|
const start = ISOWeek ? dateLib.startOfISOWeek(date) : dateLib.startOfWeek(date);
|
|
19594
19694
|
const days = [];
|
|
@@ -19600,18 +19700,20 @@ broadcastCalendar) {
|
|
|
19600
19700
|
}
|
|
19601
19701
|
|
|
19602
19702
|
/** Return the years to show in the dropdown. */
|
|
19603
|
-
function getYearOptions(
|
|
19604
|
-
if (!
|
|
19605
|
-
if (!
|
|
19703
|
+
function getYearOptions(displayMonth, calendarStart, calendarEnd, formatters, dateLib) {
|
|
19704
|
+
if (!calendarStart) return undefined;
|
|
19705
|
+
if (!calendarEnd) return undefined;
|
|
19606
19706
|
const {
|
|
19707
|
+
startOfMonth,
|
|
19607
19708
|
startOfYear,
|
|
19608
19709
|
endOfYear,
|
|
19609
19710
|
addYears,
|
|
19610
19711
|
isBefore,
|
|
19611
19712
|
isSameYear
|
|
19612
19713
|
} = dateLib;
|
|
19613
|
-
const
|
|
19614
|
-
const
|
|
19714
|
+
const month = displayMonth.getMonth();
|
|
19715
|
+
const firstNavYear = startOfYear(calendarStart);
|
|
19716
|
+
const lastNavYear = endOfYear(calendarEnd);
|
|
19615
19717
|
const years = [];
|
|
19616
19718
|
let year = firstNavYear;
|
|
19617
19719
|
while (isBefore(year, lastNavYear) || isSameYear(year, lastNavYear)) {
|
|
@@ -19619,11 +19721,13 @@ function getYearOptions(navStart, navEnd, formatters, dateLib) {
|
|
|
19619
19721
|
year = addYears(year, 1);
|
|
19620
19722
|
}
|
|
19621
19723
|
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;
|
|
19622
19726
|
const label = formatters.formatYearDropdown(value);
|
|
19623
19727
|
return {
|
|
19624
19728
|
value,
|
|
19625
19729
|
label,
|
|
19626
|
-
disabled
|
|
19730
|
+
disabled
|
|
19627
19731
|
};
|
|
19628
19732
|
});
|
|
19629
19733
|
}
|
|
@@ -19787,30 +19891,29 @@ var defaultLabels = /*#__PURE__*/Object.freeze({
|
|
|
19787
19891
|
labelYearDropdown: labelYearDropdown
|
|
19788
19892
|
});
|
|
19789
19893
|
|
|
19894
|
+
/** The number of days in a month when having 6 weeks. */
|
|
19895
|
+
const NrOfDaysWithFixedWeeks = 42;
|
|
19790
19896
|
/** Return all the dates to display in the calendar. */
|
|
19791
19897
|
function getDates(displayMonths, maxDate, props, dateLib) {
|
|
19792
19898
|
const firstMonth = displayMonths[0];
|
|
19793
19899
|
const lastMonth = displayMonths[displayMonths.length - 1];
|
|
19794
19900
|
const {
|
|
19795
19901
|
ISOWeek,
|
|
19796
|
-
fixedWeeks
|
|
19797
|
-
broadcastCalendar
|
|
19902
|
+
fixedWeeks
|
|
19798
19903
|
} = props ?? {};
|
|
19799
19904
|
const {
|
|
19905
|
+
startOfWeek,
|
|
19906
|
+
endOfWeek,
|
|
19907
|
+
startOfISOWeek,
|
|
19908
|
+
endOfISOWeek,
|
|
19800
19909
|
addDays,
|
|
19801
19910
|
differenceInCalendarDays,
|
|
19802
19911
|
differenceInCalendarMonths,
|
|
19803
|
-
endOfBroadcastWeek,
|
|
19804
|
-
endOfISOWeek,
|
|
19805
|
-
endOfMonth,
|
|
19806
|
-
endOfWeek,
|
|
19807
19912
|
isAfter,
|
|
19808
|
-
|
|
19809
|
-
startOfISOWeek,
|
|
19810
|
-
startOfWeek
|
|
19913
|
+
endOfMonth
|
|
19811
19914
|
} = dateLib;
|
|
19812
|
-
const startWeekFirstDate =
|
|
19813
|
-
const endWeekLastDate =
|
|
19915
|
+
const startWeekFirstDate = ISOWeek ? startOfISOWeek(firstMonth) : startOfWeek(firstMonth);
|
|
19916
|
+
const endWeekLastDate = ISOWeek ? endOfISOWeek(endOfMonth(lastMonth)) : endOfWeek(endOfMonth(lastMonth));
|
|
19814
19917
|
const nOfDays = differenceInCalendarDays(endWeekLastDate, startWeekFirstDate);
|
|
19815
19918
|
const nOfMonths = differenceInCalendarMonths(lastMonth, firstMonth) + 1;
|
|
19816
19919
|
const dates = [];
|
|
@@ -19822,11 +19925,9 @@ function getDates(displayMonths, maxDate, props, dateLib) {
|
|
|
19822
19925
|
dates.push(date);
|
|
19823
19926
|
}
|
|
19824
19927
|
// If fixed weeks is enabled, add the extra dates to the array
|
|
19825
|
-
const
|
|
19826
|
-
const extraDates = nrOfDaysWithFixedWeeks * nOfMonths;
|
|
19928
|
+
const extraDates = NrOfDaysWithFixedWeeks * nOfMonths;
|
|
19827
19929
|
if (fixedWeeks && dates.length < extraDates) {
|
|
19828
|
-
|
|
19829
|
-
for (let i = 0; i < daysToAdd; i++) {
|
|
19930
|
+
for (let i = 0; i < 7; i++) {
|
|
19830
19931
|
const date = addDays(dates[dates.length - 1], 1);
|
|
19831
19932
|
dates.push(date);
|
|
19832
19933
|
}
|
|
@@ -19937,29 +20038,25 @@ displayMonths, /** The dates to display in the calendar. */
|
|
|
19937
20038
|
dates, /** Options from the props context. */
|
|
19938
20039
|
props, dateLib) {
|
|
19939
20040
|
const {
|
|
19940
|
-
|
|
19941
|
-
|
|
20041
|
+
startOfWeek,
|
|
20042
|
+
endOfWeek,
|
|
20043
|
+
startOfISOWeek,
|
|
19942
20044
|
endOfISOWeek,
|
|
19943
20045
|
endOfMonth,
|
|
19944
|
-
|
|
19945
|
-
getISOWeek,
|
|
20046
|
+
addDays,
|
|
19946
20047
|
getWeek,
|
|
19947
|
-
|
|
19948
|
-
startOfISOWeek,
|
|
19949
|
-
startOfWeek
|
|
20048
|
+
getISOWeek
|
|
19950
20049
|
} = dateLib;
|
|
19951
20050
|
const dayPickerMonths = displayMonths.reduce((months, month) => {
|
|
19952
|
-
const firstDateOfFirstWeek = props.
|
|
19953
|
-
const lastDateOfLastWeek = props.
|
|
20051
|
+
const firstDateOfFirstWeek = props.ISOWeek ? startOfISOWeek(month) : startOfWeek(month);
|
|
20052
|
+
const lastDateOfLastWeek = props.ISOWeek ? endOfISOWeek(endOfMonth(month)) : endOfWeek(endOfMonth(month));
|
|
19954
20053
|
/** The dates to display in the month. */
|
|
19955
20054
|
const monthDates = dates.filter(date => {
|
|
19956
20055
|
return date >= firstDateOfFirstWeek && date <= lastDateOfLastWeek;
|
|
19957
20056
|
});
|
|
19958
|
-
|
|
19959
|
-
if (props.fixedWeeks && monthDates.length < nrOfDaysWithFixedWeeks) {
|
|
20057
|
+
if (props.fixedWeeks && monthDates.length < 42) {
|
|
19960
20058
|
const extraDates = dates.filter(date => {
|
|
19961
|
-
|
|
19962
|
-
return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, daysToAdd);
|
|
20059
|
+
return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, 7);
|
|
19963
20060
|
});
|
|
19964
20061
|
monthDates.push(...extraDates);
|
|
19965
20062
|
}
|
|
@@ -20397,30 +20494,27 @@ function dateMatchModifiers(date, matchers, dateLib = defaultDateLib) {
|
|
|
20397
20494
|
/** Return the next date that should be focused. */
|
|
20398
20495
|
function getFocusableDate(moveBy, moveDir, refDate, navStart, navEnd, props, dateLib) {
|
|
20399
20496
|
const {
|
|
20400
|
-
ISOWeek
|
|
20401
|
-
broadcastCalendar
|
|
20497
|
+
ISOWeek
|
|
20402
20498
|
} = props;
|
|
20403
20499
|
const {
|
|
20404
20500
|
addDays,
|
|
20405
20501
|
addMonths,
|
|
20406
|
-
addWeeks,
|
|
20407
20502
|
addYears,
|
|
20408
|
-
|
|
20503
|
+
addWeeks,
|
|
20504
|
+
startOfISOWeek,
|
|
20409
20505
|
endOfISOWeek,
|
|
20506
|
+
startOfWeek,
|
|
20410
20507
|
endOfWeek,
|
|
20411
20508
|
max,
|
|
20412
|
-
min
|
|
20413
|
-
startOfBroadcastWeek,
|
|
20414
|
-
startOfISOWeek,
|
|
20415
|
-
startOfWeek
|
|
20509
|
+
min
|
|
20416
20510
|
} = dateLib;
|
|
20417
20511
|
const moveFns = {
|
|
20418
20512
|
day: addDays,
|
|
20419
20513
|
week: addWeeks,
|
|
20420
20514
|
month: addMonths,
|
|
20421
20515
|
year: addYears,
|
|
20422
|
-
startOfWeek: date =>
|
|
20423
|
-
endOfWeek: date =>
|
|
20516
|
+
startOfWeek: date => ISOWeek ? startOfISOWeek(date) : startOfWeek(date),
|
|
20517
|
+
endOfWeek: date => ISOWeek ? endOfISOWeek(date) : endOfWeek(date)
|
|
20424
20518
|
};
|
|
20425
20519
|
let focusableDate = moveFns[moveBy](refDate, moveDir === "after" ? 1 : -1);
|
|
20426
20520
|
if (moveDir === "before" && navStart) {
|
|
@@ -20486,8 +20580,6 @@ function useFocus(props, calendar, getModifiers, isSelected, dateLib) {
|
|
|
20486
20580
|
/**
|
|
20487
20581
|
* Return a function to get the modifiers for a given day.
|
|
20488
20582
|
*
|
|
20489
|
-
* NOTE: this is not an hook, but a factory for `getModifiers`.
|
|
20490
|
-
*
|
|
20491
20583
|
* @private
|
|
20492
20584
|
*/
|
|
20493
20585
|
function useGetModifiers(days, props, dateLib) {
|
|
@@ -20496,19 +20588,12 @@ function useGetModifiers(days, props, dateLib) {
|
|
|
20496
20588
|
hidden,
|
|
20497
20589
|
modifiers,
|
|
20498
20590
|
showOutsideDays,
|
|
20499
|
-
broadcastCalendar,
|
|
20500
20591
|
today
|
|
20501
20592
|
} = props;
|
|
20502
20593
|
const {
|
|
20503
20594
|
isSameDay,
|
|
20504
|
-
isSameMonth
|
|
20505
|
-
startOfMonth,
|
|
20506
|
-
isBefore,
|
|
20507
|
-
endOfMonth,
|
|
20508
|
-
isAfter
|
|
20595
|
+
isSameMonth
|
|
20509
20596
|
} = dateLib;
|
|
20510
|
-
const startMonth = props.startMonth && startOfMonth(props.startMonth);
|
|
20511
|
-
const endMonth = props.endMonth && endOfMonth(props.endMonth);
|
|
20512
20597
|
const internalModifiersMap = {
|
|
20513
20598
|
[DayFlag.focused]: [],
|
|
20514
20599
|
[DayFlag.outside]: [],
|
|
@@ -20517,18 +20602,20 @@ function useGetModifiers(days, props, dateLib) {
|
|
|
20517
20602
|
[DayFlag.today]: []
|
|
20518
20603
|
};
|
|
20519
20604
|
const customModifiersMap = {};
|
|
20605
|
+
const selectionModifiersMap = {
|
|
20606
|
+
[SelectionState.range_end]: [],
|
|
20607
|
+
[SelectionState.range_middle]: [],
|
|
20608
|
+
[SelectionState.range_start]: [],
|
|
20609
|
+
[SelectionState.selected]: []
|
|
20610
|
+
};
|
|
20520
20611
|
for (const day of days) {
|
|
20521
20612
|
const {
|
|
20522
20613
|
date,
|
|
20523
20614
|
displayMonth
|
|
20524
20615
|
} = day;
|
|
20525
20616
|
const isOutside = Boolean(displayMonth && !isSameMonth(date, displayMonth));
|
|
20526
|
-
const isBeforeStartMonth = Boolean(startMonth && isBefore(date, startMonth));
|
|
20527
|
-
const isAfterEndMonth = Boolean(endMonth && isAfter(date, endMonth));
|
|
20528
20617
|
const isDisabled = Boolean(disabled && dateMatchModifiers(date, disabled, dateLib));
|
|
20529
|
-
const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) ||
|
|
20530
|
-
// Broadcast calendar will show outside days as default
|
|
20531
|
-
!broadcastCalendar && !showOutsideDays && isOutside || broadcastCalendar && showOutsideDays === false && isOutside;
|
|
20618
|
+
const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) || !showOutsideDays && isOutside;
|
|
20532
20619
|
const isToday = isSameDay(date, today ?? (props.timeZone ? TZDate.tz(props.timeZone) : dateLib.Date ? new dateLib.Date() : new Date()));
|
|
20533
20620
|
if (isOutside) internalModifiersMap.outside.push(day);
|
|
20534
20621
|
if (isDisabled) internalModifiersMap.disabled.push(day);
|
|
@@ -20557,16 +20644,27 @@ function useGetModifiers(days, props, dateLib) {
|
|
|
20557
20644
|
[DayFlag.outside]: false,
|
|
20558
20645
|
[DayFlag.today]: false
|
|
20559
20646
|
};
|
|
20647
|
+
const selectionStates = {
|
|
20648
|
+
[SelectionState.range_end]: false,
|
|
20649
|
+
[SelectionState.range_middle]: false,
|
|
20650
|
+
[SelectionState.range_start]: false,
|
|
20651
|
+
[SelectionState.selected]: false
|
|
20652
|
+
};
|
|
20560
20653
|
const customModifiers = {};
|
|
20561
20654
|
// Find the modifiers for the given day
|
|
20562
20655
|
for (const name in internalModifiersMap) {
|
|
20563
20656
|
const days = internalModifiersMap[name];
|
|
20564
20657
|
dayFlags[name] = days.some(d => d === day);
|
|
20565
20658
|
}
|
|
20659
|
+
for (const name in selectionModifiersMap) {
|
|
20660
|
+
const days = selectionModifiersMap[name];
|
|
20661
|
+
selectionStates[name] = days.some(d => d === day);
|
|
20662
|
+
}
|
|
20566
20663
|
for (const name in customModifiersMap) {
|
|
20567
20664
|
customModifiers[name] = customModifiersMap[name].some(d => d === day);
|
|
20568
20665
|
}
|
|
20569
20666
|
return {
|
|
20667
|
+
...selectionStates,
|
|
20570
20668
|
...dayFlags,
|
|
20571
20669
|
// custom modifiers should override all the previous ones
|
|
20572
20670
|
...customModifiers
|
|
@@ -20971,7 +21069,7 @@ function DayPicker(props) {
|
|
|
20971
21069
|
};
|
|
20972
21070
|
const dateLib = new DateLib({
|
|
20973
21071
|
locale,
|
|
20974
|
-
weekStartsOn: props.
|
|
21072
|
+
weekStartsOn: props.weekStartsOn,
|
|
20975
21073
|
firstWeekContainsDate: props.firstWeekContainsDate,
|
|
20976
21074
|
useAdditionalWeekYearTokens: props.useAdditionalWeekYearTokens,
|
|
20977
21075
|
useAdditionalDayOfYearTokens: props.useAdditionalDayOfYearTokens
|
|
@@ -20990,7 +21088,7 @@ function DayPicker(props) {
|
|
|
20990
21088
|
...props.classNames
|
|
20991
21089
|
}
|
|
20992
21090
|
};
|
|
20993
|
-
}, [props.classNames, props.components, props.dateLib, props.firstWeekContainsDate, props.formatters, props.labels, props.locale, props.useAdditionalDayOfYearTokens, props.useAdditionalWeekYearTokens, props.weekStartsOn
|
|
21091
|
+
}, [props.classNames, props.components, props.dateLib, props.firstWeekContainsDate, props.formatters, props.labels, props.locale, props.useAdditionalDayOfYearTokens, props.useAdditionalWeekYearTokens, props.weekStartsOn]);
|
|
20994
21092
|
const {
|
|
20995
21093
|
captionLayout,
|
|
20996
21094
|
mode,
|
|
@@ -21100,16 +21198,6 @@ function DayPicker(props) {
|
|
|
21100
21198
|
const handleDayMouseLeave = useCallback((day, modifiers) => e => {
|
|
21101
21199
|
onDayMouseLeave?.(day.date, modifiers, e);
|
|
21102
21200
|
}, [onDayMouseLeave]);
|
|
21103
|
-
const handleMonthChange = useCallback(date => e => {
|
|
21104
|
-
const selectedMonth = Number(e.target.value);
|
|
21105
|
-
const month = dateLib.setMonth(dateLib.startOfMonth(date), selectedMonth);
|
|
21106
|
-
goToMonth(month);
|
|
21107
|
-
}, [dateLib, goToMonth]);
|
|
21108
|
-
const handleYearChange = useCallback(date => e => {
|
|
21109
|
-
const selectedYear = Number(e.target.value);
|
|
21110
|
-
const month = dateLib.setYear(dateLib.startOfMonth(date), selectedYear);
|
|
21111
|
-
goToMonth(month);
|
|
21112
|
-
}, [dateLib, goToMonth]);
|
|
21113
21201
|
const {
|
|
21114
21202
|
className,
|
|
21115
21203
|
style
|
|
@@ -21147,8 +21235,6 @@ function DayPicker(props) {
|
|
|
21147
21235
|
lang: props.lang,
|
|
21148
21236
|
nonce: props.nonce,
|
|
21149
21237
|
title: props.title,
|
|
21150
|
-
role: props.role,
|
|
21151
|
-
"aria-label": props["aria-label"],
|
|
21152
21238
|
...dataAttributes
|
|
21153
21239
|
}, /*#__PURE__*/React__default.createElement(components.Months, {
|
|
21154
21240
|
className: classNames[UI.Months],
|
|
@@ -21162,8 +21248,17 @@ function DayPicker(props) {
|
|
|
21162
21248
|
previousMonth: previousMonth,
|
|
21163
21249
|
nextMonth: nextMonth
|
|
21164
21250
|
})), 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
|
+
};
|
|
21165
21260
|
const dropdownMonths = getMonthOptions(calendarMonth.date, navStart, navEnd, formatters, dateLib);
|
|
21166
|
-
const dropdownYears = getYearOptions(navStart, navEnd, formatters, dateLib);
|
|
21261
|
+
const dropdownYears = getYearOptions(months[0].date, navStart, navEnd, formatters, dateLib);
|
|
21167
21262
|
return /*#__PURE__*/React__default.createElement(components.Month, {
|
|
21168
21263
|
className: classNames[UI.Month],
|
|
21169
21264
|
style: styles?.[UI.Month],
|
|
@@ -21184,7 +21279,7 @@ function DayPicker(props) {
|
|
|
21184
21279
|
classNames: classNames,
|
|
21185
21280
|
components: components,
|
|
21186
21281
|
disabled: Boolean(props.disableNavigation),
|
|
21187
|
-
onChange: handleMonthChange
|
|
21282
|
+
onChange: handleMonthChange,
|
|
21188
21283
|
options: dropdownMonths,
|
|
21189
21284
|
style: styles?.[UI.Dropdown],
|
|
21190
21285
|
value: calendarMonth.date.getMonth()
|
|
@@ -21197,7 +21292,7 @@ function DayPicker(props) {
|
|
|
21197
21292
|
classNames: classNames,
|
|
21198
21293
|
components: components,
|
|
21199
21294
|
disabled: Boolean(props.disableNavigation),
|
|
21200
|
-
onChange: handleYearChange
|
|
21295
|
+
onChange: handleYearChange,
|
|
21201
21296
|
options: dropdownYears,
|
|
21202
21297
|
style: styles?.[UI.Dropdown],
|
|
21203
21298
|
value: calendarMonth.date.getFullYear()
|
|
@@ -21244,8 +21339,7 @@ function DayPicker(props) {
|
|
|
21244
21339
|
locale
|
|
21245
21340
|
}),
|
|
21246
21341
|
className: classNames[UI.WeekNumber],
|
|
21247
|
-
scope: "row"
|
|
21248
|
-
role: "rowheader"
|
|
21342
|
+
scope: "row"
|
|
21249
21343
|
}, formatWeekNumber(week.weekNumber))), week.days.map(day => {
|
|
21250
21344
|
const {
|
|
21251
21345
|
date
|
|
@@ -21265,14 +21359,14 @@ function DayPicker(props) {
|
|
|
21265
21359
|
}
|
|
21266
21360
|
const style = getStyleForModifiers(modifiers, styles, props.modifiersStyles);
|
|
21267
21361
|
const className = getClassNamesForModifiers(modifiers, classNames, props.modifiersClassNames);
|
|
21268
|
-
const ariaLabel = !isInteractive
|
|
21362
|
+
const ariaLabel = !isInteractive ? labelGridcell(date, modifiers, dateLib.options, dateLib) : undefined;
|
|
21269
21363
|
return /*#__PURE__*/React__default.createElement(components.Day, {
|
|
21270
21364
|
key: `${dateLib.format(date, "yyyy-MM-dd")}_${dateLib.format(day.displayMonth, "yyyy-MM")}`,
|
|
21271
21365
|
day: day,
|
|
21272
21366
|
modifiers: modifiers,
|
|
21273
21367
|
className: className.join(" "),
|
|
21274
21368
|
style: style,
|
|
21275
|
-
|
|
21369
|
+
"aria-hidden": modifiers.hidden || undefined,
|
|
21276
21370
|
"aria-selected": modifiers.selected || undefined,
|
|
21277
21371
|
"aria-label": ariaLabel,
|
|
21278
21372
|
"data-day": dateLib.format(date, "yyyy-MM-dd"),
|
|
@@ -21283,7 +21377,7 @@ function DayPicker(props) {
|
|
|
21283
21377
|
"data-outside": day.outside || undefined,
|
|
21284
21378
|
"data-focused": modifiers.focused || undefined,
|
|
21285
21379
|
"data-today": modifiers.today || undefined
|
|
21286
|
-
},
|
|
21380
|
+
}, isInteractive ? (/*#__PURE__*/React__default.createElement(components.DayButton, {
|
|
21287
21381
|
className: classNames[UI.DayButton],
|
|
21288
21382
|
style: styles?.[UI.DayButton],
|
|
21289
21383
|
type: "button",
|
|
@@ -21298,7 +21392,7 @@ function DayPicker(props) {
|
|
|
21298
21392
|
onKeyDown: handleDayKeyDown(day, modifiers),
|
|
21299
21393
|
onMouseEnter: handleDayMouseEnter(day, modifiers),
|
|
21300
21394
|
onMouseLeave: handleDayMouseLeave(day, modifiers)
|
|
21301
|
-
}, formatDay(date, dateLib.options, dateLib))) :
|
|
21395
|
+
}, formatDay(date, dateLib.options, dateLib))) : formatDay(day.date, dateLib.options, dateLib));
|
|
21302
21396
|
}));
|
|
21303
21397
|
}))));
|
|
21304
21398
|
})), props.footer && (/*#__PURE__*/React__default.createElement(components.Footer, {
|
|
@@ -25497,8 +25591,8 @@ const TimePicker = ({
|
|
|
25497
25591
|
});
|
|
25498
25592
|
};
|
|
25499
25593
|
|
|
25500
|
-
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}";
|
|
25501
|
-
styleInject(css_248z$
|
|
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$K);
|
|
25502
25596
|
|
|
25503
25597
|
const CustomDatePicker = ({
|
|
25504
25598
|
minDate,
|
|
@@ -26096,8 +26190,8 @@ const StateDropdown = ({
|
|
|
26096
26190
|
});
|
|
26097
26191
|
};
|
|
26098
26192
|
|
|
26099
|
-
var css_248z$
|
|
26100
|
-
styleInject(css_248z$
|
|
26193
|
+
var css_248z$J = ".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}";
|
|
26194
|
+
styleInject(css_248z$J);
|
|
26101
26195
|
|
|
26102
26196
|
const IconButton = /*#__PURE__*/forwardRef(({
|
|
26103
26197
|
label,
|
|
@@ -26126,8 +26220,8 @@ const IconButton = /*#__PURE__*/forwardRef(({
|
|
|
26126
26220
|
});
|
|
26127
26221
|
});
|
|
26128
26222
|
|
|
26129
|
-
var css_248z$
|
|
26130
|
-
styleInject(css_248z$
|
|
26223
|
+
var css_248z$I = ".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}";
|
|
26224
|
+
styleInject(css_248z$I);
|
|
26131
26225
|
|
|
26132
26226
|
const useKeyboardActions = actions => {
|
|
26133
26227
|
useEffect(() => {
|
|
@@ -26226,8 +26320,8 @@ const DragAndDrop = {
|
|
|
26226
26320
|
DNDUtilities
|
|
26227
26321
|
};
|
|
26228
26322
|
|
|
26229
|
-
var css_248z$
|
|
26230
|
-
styleInject(css_248z$
|
|
26323
|
+
var css_248z$H = ".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}";
|
|
26324
|
+
styleInject(css_248z$H);
|
|
26231
26325
|
|
|
26232
26326
|
const VariableInput = ({
|
|
26233
26327
|
type = 'url',
|
|
@@ -26505,8 +26599,8 @@ const VariableInput = ({
|
|
|
26505
26599
|
});
|
|
26506
26600
|
};
|
|
26507
26601
|
|
|
26508
|
-
var css_248z$
|
|
26509
|
-
styleInject(css_248z$
|
|
26602
|
+
var css_248z$G = ".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}";
|
|
26603
|
+
styleInject(css_248z$G);
|
|
26510
26604
|
|
|
26511
26605
|
const AllProjectsDropdown = ({
|
|
26512
26606
|
onClick = () => {},
|
|
@@ -26642,8 +26736,8 @@ const AllProjectsDropdown = ({
|
|
|
26642
26736
|
});
|
|
26643
26737
|
};
|
|
26644
26738
|
|
|
26645
|
-
var css_248z$
|
|
26646
|
-
styleInject(css_248z$
|
|
26739
|
+
var css_248z$F = ".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}";
|
|
26740
|
+
styleInject(css_248z$F);
|
|
26647
26741
|
|
|
26648
26742
|
const calculateArc$3 = ({
|
|
26649
26743
|
x,
|
|
@@ -26797,8 +26891,8 @@ const PieChart = ({
|
|
|
26797
26891
|
});
|
|
26798
26892
|
};
|
|
26799
26893
|
|
|
26800
|
-
var css_248z$
|
|
26801
|
-
styleInject(css_248z$
|
|
26894
|
+
var css_248z$E = ".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}";
|
|
26895
|
+
styleInject(css_248z$E);
|
|
26802
26896
|
|
|
26803
26897
|
const AppHeader = ({
|
|
26804
26898
|
logoIconName = 'fireflink_icon',
|
|
@@ -26902,7 +26996,7 @@ const AppHeader = ({
|
|
|
26902
26996
|
children: jsx(Tooltip, {
|
|
26903
26997
|
title: quickMenuItem?.label,
|
|
26904
26998
|
children: jsx(Icon, {
|
|
26905
|
-
name: quickMenuItem.
|
|
26999
|
+
name: quickMenuItem.path,
|
|
26906
27000
|
height: 16,
|
|
26907
27001
|
width: 16,
|
|
26908
27002
|
hoverEffect: true
|
|
@@ -26940,8 +27034,8 @@ const AppHeader = ({
|
|
|
26940
27034
|
});
|
|
26941
27035
|
};
|
|
26942
27036
|
|
|
26943
|
-
var css_248z$
|
|
26944
|
-
styleInject(css_248z$
|
|
27037
|
+
var css_248z$D = ".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}";
|
|
27038
|
+
styleInject(css_248z$D);
|
|
26945
27039
|
|
|
26946
27040
|
const Paper = ({
|
|
26947
27041
|
children,
|
|
@@ -26957,8 +27051,8 @@ const Paper = ({
|
|
|
26957
27051
|
});
|
|
26958
27052
|
};
|
|
26959
27053
|
|
|
26960
|
-
var css_248z$
|
|
26961
|
-
styleInject(css_248z$
|
|
27054
|
+
var css_248z$C = ".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}";
|
|
27055
|
+
styleInject(css_248z$C);
|
|
26962
27056
|
|
|
26963
27057
|
const calculateArc$2 = (x, y, radius, startAngle, endAngle) => {
|
|
26964
27058
|
const startX = x + radius * Math.cos(startAngle);
|
|
@@ -27257,7 +27351,7 @@ const DashboardDonutChart = ({
|
|
|
27257
27351
|
className: "ff-legend-percentage",
|
|
27258
27352
|
children: jsx("td", {
|
|
27259
27353
|
className: "ff-legend-percentage",
|
|
27260
|
-
children: item.percentage ? item.percentage : typeof item.value === 'string' ? (parseFloat(item.value) / total * 100).toFixed(1) : (item.value / total * 100).toFixed(1)
|
|
27354
|
+
children: item.percentage ? item.percentage : typeof item.value === 'string' ? (parseFloat(item.value) / total * 100).toFixed(1) : total === 0 ? 0 : (item.value / total * 100).toFixed(1)
|
|
27261
27355
|
})
|
|
27262
27356
|
}), jsx("td", {
|
|
27263
27357
|
className: "ff-legend-count",
|
|
@@ -27374,9 +27468,9 @@ const DashboardDonutChart = ({
|
|
|
27374
27468
|
|
|
27375
27469
|
var propTypes = {exports: {}};
|
|
27376
27470
|
|
|
27377
|
-
var reactIs = {exports: {}};
|
|
27471
|
+
var reactIs$1 = {exports: {}};
|
|
27378
27472
|
|
|
27379
|
-
var reactIs_production_min = {};
|
|
27473
|
+
var reactIs_production_min$1 = {};
|
|
27380
27474
|
|
|
27381
27475
|
/** @license React v16.13.1
|
|
27382
27476
|
* react-is.production.min.js
|
|
@@ -27386,10 +27480,10 @@ var reactIs_production_min = {};
|
|
|
27386
27480
|
* This source code is licensed under the MIT license found in the
|
|
27387
27481
|
* LICENSE file in the root directory of this source tree.
|
|
27388
27482
|
*/
|
|
27389
|
-
var hasRequiredReactIs_production_min;
|
|
27390
|
-
function requireReactIs_production_min() {
|
|
27391
|
-
if (hasRequiredReactIs_production_min) return reactIs_production_min;
|
|
27392
|
-
hasRequiredReactIs_production_min = 1;
|
|
27483
|
+
var hasRequiredReactIs_production_min$1;
|
|
27484
|
+
function requireReactIs_production_min$1() {
|
|
27485
|
+
if (hasRequiredReactIs_production_min$1) return reactIs_production_min$1;
|
|
27486
|
+
hasRequiredReactIs_production_min$1 = 1;
|
|
27393
27487
|
var b = "function" === typeof Symbol && Symbol.for,
|
|
27394
27488
|
c = b ? Symbol.for("react.element") : 60103,
|
|
27395
27489
|
d = b ? Symbol.for("react.portal") : 60106,
|
|
@@ -27442,64 +27536,64 @@ function requireReactIs_production_min() {
|
|
|
27442
27536
|
function A(a) {
|
|
27443
27537
|
return z(a) === m;
|
|
27444
27538
|
}
|
|
27445
|
-
reactIs_production_min.AsyncMode = l;
|
|
27446
|
-
reactIs_production_min.ConcurrentMode = m;
|
|
27447
|
-
reactIs_production_min.ContextConsumer = k;
|
|
27448
|
-
reactIs_production_min.ContextProvider = h;
|
|
27449
|
-
reactIs_production_min.Element = c;
|
|
27450
|
-
reactIs_production_min.ForwardRef = n;
|
|
27451
|
-
reactIs_production_min.Fragment = e;
|
|
27452
|
-
reactIs_production_min.Lazy = t;
|
|
27453
|
-
reactIs_production_min.Memo = r;
|
|
27454
|
-
reactIs_production_min.Portal = d;
|
|
27455
|
-
reactIs_production_min.Profiler = g;
|
|
27456
|
-
reactIs_production_min.StrictMode = f;
|
|
27457
|
-
reactIs_production_min.Suspense = p;
|
|
27458
|
-
reactIs_production_min.isAsyncMode = function (a) {
|
|
27539
|
+
reactIs_production_min$1.AsyncMode = l;
|
|
27540
|
+
reactIs_production_min$1.ConcurrentMode = m;
|
|
27541
|
+
reactIs_production_min$1.ContextConsumer = k;
|
|
27542
|
+
reactIs_production_min$1.ContextProvider = h;
|
|
27543
|
+
reactIs_production_min$1.Element = c;
|
|
27544
|
+
reactIs_production_min$1.ForwardRef = n;
|
|
27545
|
+
reactIs_production_min$1.Fragment = e;
|
|
27546
|
+
reactIs_production_min$1.Lazy = t;
|
|
27547
|
+
reactIs_production_min$1.Memo = r;
|
|
27548
|
+
reactIs_production_min$1.Portal = d;
|
|
27549
|
+
reactIs_production_min$1.Profiler = g;
|
|
27550
|
+
reactIs_production_min$1.StrictMode = f;
|
|
27551
|
+
reactIs_production_min$1.Suspense = p;
|
|
27552
|
+
reactIs_production_min$1.isAsyncMode = function (a) {
|
|
27459
27553
|
return A(a) || z(a) === l;
|
|
27460
27554
|
};
|
|
27461
|
-
reactIs_production_min.isConcurrentMode = A;
|
|
27462
|
-
reactIs_production_min.isContextConsumer = function (a) {
|
|
27555
|
+
reactIs_production_min$1.isConcurrentMode = A;
|
|
27556
|
+
reactIs_production_min$1.isContextConsumer = function (a) {
|
|
27463
27557
|
return z(a) === k;
|
|
27464
27558
|
};
|
|
27465
|
-
reactIs_production_min.isContextProvider = function (a) {
|
|
27559
|
+
reactIs_production_min$1.isContextProvider = function (a) {
|
|
27466
27560
|
return z(a) === h;
|
|
27467
27561
|
};
|
|
27468
|
-
reactIs_production_min.isElement = function (a) {
|
|
27562
|
+
reactIs_production_min$1.isElement = function (a) {
|
|
27469
27563
|
return "object" === typeof a && null !== a && a.$$typeof === c;
|
|
27470
27564
|
};
|
|
27471
|
-
reactIs_production_min.isForwardRef = function (a) {
|
|
27565
|
+
reactIs_production_min$1.isForwardRef = function (a) {
|
|
27472
27566
|
return z(a) === n;
|
|
27473
27567
|
};
|
|
27474
|
-
reactIs_production_min.isFragment = function (a) {
|
|
27568
|
+
reactIs_production_min$1.isFragment = function (a) {
|
|
27475
27569
|
return z(a) === e;
|
|
27476
27570
|
};
|
|
27477
|
-
reactIs_production_min.isLazy = function (a) {
|
|
27571
|
+
reactIs_production_min$1.isLazy = function (a) {
|
|
27478
27572
|
return z(a) === t;
|
|
27479
27573
|
};
|
|
27480
|
-
reactIs_production_min.isMemo = function (a) {
|
|
27574
|
+
reactIs_production_min$1.isMemo = function (a) {
|
|
27481
27575
|
return z(a) === r;
|
|
27482
27576
|
};
|
|
27483
|
-
reactIs_production_min.isPortal = function (a) {
|
|
27577
|
+
reactIs_production_min$1.isPortal = function (a) {
|
|
27484
27578
|
return z(a) === d;
|
|
27485
27579
|
};
|
|
27486
|
-
reactIs_production_min.isProfiler = function (a) {
|
|
27580
|
+
reactIs_production_min$1.isProfiler = function (a) {
|
|
27487
27581
|
return z(a) === g;
|
|
27488
27582
|
};
|
|
27489
|
-
reactIs_production_min.isStrictMode = function (a) {
|
|
27583
|
+
reactIs_production_min$1.isStrictMode = function (a) {
|
|
27490
27584
|
return z(a) === f;
|
|
27491
27585
|
};
|
|
27492
|
-
reactIs_production_min.isSuspense = function (a) {
|
|
27586
|
+
reactIs_production_min$1.isSuspense = function (a) {
|
|
27493
27587
|
return z(a) === p;
|
|
27494
27588
|
};
|
|
27495
|
-
reactIs_production_min.isValidElementType = function (a) {
|
|
27589
|
+
reactIs_production_min$1.isValidElementType = function (a) {
|
|
27496
27590
|
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);
|
|
27497
27591
|
};
|
|
27498
|
-
reactIs_production_min.typeOf = z;
|
|
27499
|
-
return reactIs_production_min;
|
|
27592
|
+
reactIs_production_min$1.typeOf = z;
|
|
27593
|
+
return reactIs_production_min$1;
|
|
27500
27594
|
}
|
|
27501
27595
|
|
|
27502
|
-
var reactIs_development = {};
|
|
27596
|
+
var reactIs_development$1 = {};
|
|
27503
27597
|
|
|
27504
27598
|
/** @license React v16.13.1
|
|
27505
27599
|
* react-is.development.js
|
|
@@ -27509,10 +27603,10 @@ var reactIs_development = {};
|
|
|
27509
27603
|
* This source code is licensed under the MIT license found in the
|
|
27510
27604
|
* LICENSE file in the root directory of this source tree.
|
|
27511
27605
|
*/
|
|
27512
|
-
var hasRequiredReactIs_development;
|
|
27513
|
-
function requireReactIs_development() {
|
|
27514
|
-
if (hasRequiredReactIs_development) return reactIs_development;
|
|
27515
|
-
hasRequiredReactIs_development = 1;
|
|
27606
|
+
var hasRequiredReactIs_development$1;
|
|
27607
|
+
function requireReactIs_development$1() {
|
|
27608
|
+
if (hasRequiredReactIs_development$1) return reactIs_development$1;
|
|
27609
|
+
hasRequiredReactIs_development$1 = 1;
|
|
27516
27610
|
if (process.env.NODE_ENV !== "production") {
|
|
27517
27611
|
(function () {
|
|
27518
27612
|
|
|
@@ -27639,49 +27733,49 @@ function requireReactIs_development() {
|
|
|
27639
27733
|
function isSuspense(object) {
|
|
27640
27734
|
return typeOf(object) === REACT_SUSPENSE_TYPE;
|
|
27641
27735
|
}
|
|
27642
|
-
reactIs_development.AsyncMode = AsyncMode;
|
|
27643
|
-
reactIs_development.ConcurrentMode = ConcurrentMode;
|
|
27644
|
-
reactIs_development.ContextConsumer = ContextConsumer;
|
|
27645
|
-
reactIs_development.ContextProvider = ContextProvider;
|
|
27646
|
-
reactIs_development.Element = Element;
|
|
27647
|
-
reactIs_development.ForwardRef = ForwardRef;
|
|
27648
|
-
reactIs_development.Fragment = Fragment;
|
|
27649
|
-
reactIs_development.Lazy = Lazy;
|
|
27650
|
-
reactIs_development.Memo = Memo;
|
|
27651
|
-
reactIs_development.Portal = Portal;
|
|
27652
|
-
reactIs_development.Profiler = Profiler;
|
|
27653
|
-
reactIs_development.StrictMode = StrictMode;
|
|
27654
|
-
reactIs_development.Suspense = Suspense;
|
|
27655
|
-
reactIs_development.isAsyncMode = isAsyncMode;
|
|
27656
|
-
reactIs_development.isConcurrentMode = isConcurrentMode;
|
|
27657
|
-
reactIs_development.isContextConsumer = isContextConsumer;
|
|
27658
|
-
reactIs_development.isContextProvider = isContextProvider;
|
|
27659
|
-
reactIs_development.isElement = isElement;
|
|
27660
|
-
reactIs_development.isForwardRef = isForwardRef;
|
|
27661
|
-
reactIs_development.isFragment = isFragment;
|
|
27662
|
-
reactIs_development.isLazy = isLazy;
|
|
27663
|
-
reactIs_development.isMemo = isMemo;
|
|
27664
|
-
reactIs_development.isPortal = isPortal;
|
|
27665
|
-
reactIs_development.isProfiler = isProfiler;
|
|
27666
|
-
reactIs_development.isStrictMode = isStrictMode;
|
|
27667
|
-
reactIs_development.isSuspense = isSuspense;
|
|
27668
|
-
reactIs_development.isValidElementType = isValidElementType;
|
|
27669
|
-
reactIs_development.typeOf = typeOf;
|
|
27736
|
+
reactIs_development$1.AsyncMode = AsyncMode;
|
|
27737
|
+
reactIs_development$1.ConcurrentMode = ConcurrentMode;
|
|
27738
|
+
reactIs_development$1.ContextConsumer = ContextConsumer;
|
|
27739
|
+
reactIs_development$1.ContextProvider = ContextProvider;
|
|
27740
|
+
reactIs_development$1.Element = Element;
|
|
27741
|
+
reactIs_development$1.ForwardRef = ForwardRef;
|
|
27742
|
+
reactIs_development$1.Fragment = Fragment;
|
|
27743
|
+
reactIs_development$1.Lazy = Lazy;
|
|
27744
|
+
reactIs_development$1.Memo = Memo;
|
|
27745
|
+
reactIs_development$1.Portal = Portal;
|
|
27746
|
+
reactIs_development$1.Profiler = Profiler;
|
|
27747
|
+
reactIs_development$1.StrictMode = StrictMode;
|
|
27748
|
+
reactIs_development$1.Suspense = Suspense;
|
|
27749
|
+
reactIs_development$1.isAsyncMode = isAsyncMode;
|
|
27750
|
+
reactIs_development$1.isConcurrentMode = isConcurrentMode;
|
|
27751
|
+
reactIs_development$1.isContextConsumer = isContextConsumer;
|
|
27752
|
+
reactIs_development$1.isContextProvider = isContextProvider;
|
|
27753
|
+
reactIs_development$1.isElement = isElement;
|
|
27754
|
+
reactIs_development$1.isForwardRef = isForwardRef;
|
|
27755
|
+
reactIs_development$1.isFragment = isFragment;
|
|
27756
|
+
reactIs_development$1.isLazy = isLazy;
|
|
27757
|
+
reactIs_development$1.isMemo = isMemo;
|
|
27758
|
+
reactIs_development$1.isPortal = isPortal;
|
|
27759
|
+
reactIs_development$1.isProfiler = isProfiler;
|
|
27760
|
+
reactIs_development$1.isStrictMode = isStrictMode;
|
|
27761
|
+
reactIs_development$1.isSuspense = isSuspense;
|
|
27762
|
+
reactIs_development$1.isValidElementType = isValidElementType;
|
|
27763
|
+
reactIs_development$1.typeOf = typeOf;
|
|
27670
27764
|
})();
|
|
27671
27765
|
}
|
|
27672
|
-
return reactIs_development;
|
|
27766
|
+
return reactIs_development$1;
|
|
27673
27767
|
}
|
|
27674
27768
|
|
|
27675
|
-
var hasRequiredReactIs;
|
|
27676
|
-
function requireReactIs() {
|
|
27677
|
-
if (hasRequiredReactIs) return reactIs.exports;
|
|
27678
|
-
hasRequiredReactIs = 1;
|
|
27769
|
+
var hasRequiredReactIs$1;
|
|
27770
|
+
function requireReactIs$1() {
|
|
27771
|
+
if (hasRequiredReactIs$1) return reactIs$1.exports;
|
|
27772
|
+
hasRequiredReactIs$1 = 1;
|
|
27679
27773
|
if (process.env.NODE_ENV === 'production') {
|
|
27680
|
-
reactIs.exports = requireReactIs_production_min();
|
|
27774
|
+
reactIs$1.exports = requireReactIs_production_min$1();
|
|
27681
27775
|
} else {
|
|
27682
|
-
reactIs.exports = requireReactIs_development();
|
|
27776
|
+
reactIs$1.exports = requireReactIs_development$1();
|
|
27683
27777
|
}
|
|
27684
|
-
return reactIs.exports;
|
|
27778
|
+
return reactIs$1.exports;
|
|
27685
27779
|
}
|
|
27686
27780
|
|
|
27687
27781
|
/*
|
|
@@ -27896,7 +27990,7 @@ var hasRequiredFactoryWithTypeCheckers;
|
|
|
27896
27990
|
function requireFactoryWithTypeCheckers() {
|
|
27897
27991
|
if (hasRequiredFactoryWithTypeCheckers) return factoryWithTypeCheckers;
|
|
27898
27992
|
hasRequiredFactoryWithTypeCheckers = 1;
|
|
27899
|
-
var ReactIs = requireReactIs();
|
|
27993
|
+
var ReactIs = requireReactIs$1();
|
|
27900
27994
|
var assign = requireObjectAssign();
|
|
27901
27995
|
var ReactPropTypesSecret = /*@__PURE__*/requireReactPropTypesSecret();
|
|
27902
27996
|
var has = /*@__PURE__*/requireHas();
|
|
@@ -28509,7 +28603,7 @@ function requirePropTypes() {
|
|
|
28509
28603
|
if (hasRequiredPropTypes) return propTypes.exports;
|
|
28510
28604
|
hasRequiredPropTypes = 1;
|
|
28511
28605
|
if (process.env.NODE_ENV !== 'production') {
|
|
28512
|
-
var ReactIs = requireReactIs();
|
|
28606
|
+
var ReactIs = requireReactIs$1();
|
|
28513
28607
|
|
|
28514
28608
|
// By explicitly using `prop-types` you are opting into new development behavior.
|
|
28515
28609
|
// http://fb.me/prop-types-in-prod
|
|
@@ -28744,6 +28838,316 @@ ReCAPTCHA.defaultProps = {
|
|
|
28744
28838
|
badge: "bottomright"
|
|
28745
28839
|
};
|
|
28746
28840
|
|
|
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
|
+
|
|
28747
29151
|
var hoistNonReactStatics_cjs;
|
|
28748
29152
|
var hasRequiredHoistNonReactStatics_cjs;
|
|
28749
29153
|
function requireHoistNonReactStatics_cjs() {
|
|
@@ -29089,8 +29493,8 @@ var RecaptchaWrapper = makeAsyncScript(getURL, {
|
|
|
29089
29493
|
} : {}
|
|
29090
29494
|
})(ReCAPTCHA);
|
|
29091
29495
|
|
|
29092
|
-
var css_248z$
|
|
29093
|
-
styleInject(css_248z$
|
|
29496
|
+
var css_248z$B = ".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}";
|
|
29497
|
+
styleInject(css_248z$B);
|
|
29094
29498
|
|
|
29095
29499
|
// Extend the props to include React.RefAttributes
|
|
29096
29500
|
const FixedReCAPTCHA = RecaptchaWrapper;
|
|
@@ -29135,8 +29539,8 @@ const nlpDropdownDefaultCSSData = {
|
|
|
29135
29539
|
dropDownWrapperPadding: 0
|
|
29136
29540
|
};
|
|
29137
29541
|
|
|
29138
|
-
var css_248z$
|
|
29139
|
-
styleInject(css_248z$
|
|
29542
|
+
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 {\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}";
|
|
29543
|
+
styleInject(css_248z$A);
|
|
29140
29544
|
|
|
29141
29545
|
const NlpDropdown = ({
|
|
29142
29546
|
onSelectBlur,
|
|
@@ -29389,8 +29793,8 @@ const NlpDropdown = ({
|
|
|
29389
29793
|
});
|
|
29390
29794
|
};
|
|
29391
29795
|
|
|
29392
|
-
var css_248z$
|
|
29393
|
-
styleInject(css_248z$
|
|
29796
|
+
var css_248z$z = ".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}";
|
|
29797
|
+
styleInject(css_248z$z);
|
|
29394
29798
|
|
|
29395
29799
|
const nlpInputReducer = (state, action) => {
|
|
29396
29800
|
switch (action.type) {
|
|
@@ -29729,8 +30133,8 @@ const NlpInput = ({
|
|
|
29729
30133
|
});
|
|
29730
30134
|
};
|
|
29731
30135
|
|
|
29732
|
-
var css_248z$
|
|
29733
|
-
styleInject(css_248z$
|
|
30136
|
+
var css_248z$y = ".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}";
|
|
30137
|
+
styleInject(css_248z$y);
|
|
29734
30138
|
|
|
29735
30139
|
const IconRadioGroup = ({
|
|
29736
30140
|
items,
|
|
@@ -29781,8 +30185,8 @@ const IconRadioGroup = ({
|
|
|
29781
30185
|
});
|
|
29782
30186
|
};
|
|
29783
30187
|
|
|
29784
|
-
var css_248z$
|
|
29785
|
-
styleInject(css_248z$
|
|
30188
|
+
var css_248z$x = ".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}";
|
|
30189
|
+
styleInject(css_248z$x);
|
|
29786
30190
|
|
|
29787
30191
|
const MachineInputField = ({
|
|
29788
30192
|
width = '',
|
|
@@ -29851,12 +30255,12 @@ const MachineInputField = ({
|
|
|
29851
30255
|
};
|
|
29852
30256
|
MachineInputField.displayName = 'MachineInputField';
|
|
29853
30257
|
|
|
29854
|
-
var css_248z$
|
|
29855
|
-
styleInject(css_248z$x);
|
|
29856
|
-
|
|
29857
|
-
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}";
|
|
30258
|
+
var css_248z$w = ".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}";
|
|
29858
30259
|
styleInject(css_248z$w);
|
|
29859
30260
|
|
|
30261
|
+
var css_248z$v = ".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}";
|
|
30262
|
+
styleInject(css_248z$v);
|
|
30263
|
+
|
|
29860
30264
|
const DataSetTooltip = ({
|
|
29861
30265
|
datSetToolTip: {
|
|
29862
30266
|
globalVariableSetName = '',
|
|
@@ -30118,8 +30522,8 @@ const Branches = ({
|
|
|
30118
30522
|
});
|
|
30119
30523
|
};
|
|
30120
30524
|
|
|
30121
|
-
var css_248z$
|
|
30122
|
-
styleInject(css_248z$
|
|
30525
|
+
var css_248z$u = ".ff-connecting-branch-grid-wrapper {\n box-sizing: border-box;\n}";
|
|
30526
|
+
styleInject(css_248z$u);
|
|
30123
30527
|
|
|
30124
30528
|
const ConnectingBranches = ({
|
|
30125
30529
|
machineBranchInstances,
|
|
@@ -30333,8 +30737,8 @@ const SequentialConnectingBranch = ({
|
|
|
30333
30737
|
});
|
|
30334
30738
|
};
|
|
30335
30739
|
|
|
30336
|
-
var css_248z$
|
|
30337
|
-
styleInject(css_248z$
|
|
30740
|
+
var css_248z$t = ".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}";
|
|
30741
|
+
styleInject(css_248z$t);
|
|
30338
30742
|
|
|
30339
30743
|
const AttachmentButton = ({
|
|
30340
30744
|
label,
|
|
@@ -30511,8 +30915,8 @@ const toast = {
|
|
|
30511
30915
|
alert: (arg1, arg2) => openToast('alert', arg1, arg2)
|
|
30512
30916
|
};
|
|
30513
30917
|
|
|
30514
|
-
var css_248z$
|
|
30515
|
-
styleInject(css_248z$
|
|
30918
|
+
var css_248z$s = "/* 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}";
|
|
30919
|
+
styleInject(css_248z$s);
|
|
30516
30920
|
|
|
30517
30921
|
const ToggleSwitch = ({
|
|
30518
30922
|
selected = "text",
|
|
@@ -30534,8 +30938,8 @@ const ToggleSwitch = ({
|
|
|
30534
30938
|
});
|
|
30535
30939
|
};
|
|
30536
30940
|
|
|
30537
|
-
var css_248z$
|
|
30538
|
-
styleInject(css_248z$
|
|
30941
|
+
var css_248z$r = ".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}";
|
|
30942
|
+
styleInject(css_248z$r);
|
|
30539
30943
|
|
|
30540
30944
|
const Avatar = ({
|
|
30541
30945
|
variant = "small",
|
|
@@ -30571,227 +30975,6 @@ const Avatar = ({
|
|
|
30571
30975
|
});
|
|
30572
30976
|
};
|
|
30573
30977
|
|
|
30574
|
-
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}";
|
|
30575
|
-
styleInject(css_248z$r);
|
|
30576
|
-
|
|
30577
|
-
const getErrorMessage$1 = (inputValue, text, customError, customErrorCondition) => {
|
|
30578
|
-
if (inputValue === text) {
|
|
30579
|
-
return 'No changes were made.';
|
|
30580
|
-
} else if (!inputValue) {
|
|
30581
|
-
return 'Text is required';
|
|
30582
|
-
} else if (inputValue.length < 3) {
|
|
30583
|
-
return 'Please enter at least 3 characters.';
|
|
30584
|
-
} else ;
|
|
30585
|
-
return '';
|
|
30586
|
-
};
|
|
30587
|
-
const LabelEditTextField = ({
|
|
30588
|
-
label,
|
|
30589
|
-
placeholder,
|
|
30590
|
-
text,
|
|
30591
|
-
showText = true,
|
|
30592
|
-
highlightText,
|
|
30593
|
-
customError,
|
|
30594
|
-
confirmIcon,
|
|
30595
|
-
customErrorCondition,
|
|
30596
|
-
cancelIcon,
|
|
30597
|
-
variant = 'textField',
|
|
30598
|
-
onInputChange,
|
|
30599
|
-
dropdownData = [],
|
|
30600
|
-
// width,
|
|
30601
|
-
className,
|
|
30602
|
-
height,
|
|
30603
|
-
isOpen = false,
|
|
30604
|
-
confirmAction,
|
|
30605
|
-
onClick,
|
|
30606
|
-
tooltip
|
|
30607
|
-
}) => {
|
|
30608
|
-
const [isEditing, setIsEditing] = useState(isOpen ?? false);
|
|
30609
|
-
const [inputValue, setInputValue] = useState(text ?? '');
|
|
30610
|
-
const [dropdownValue, setDropdownValue] = useState(dropdownData[0]?.value ?? '');
|
|
30611
|
-
const [showError, setShowError] = useState('');
|
|
30612
|
-
const [disabled, isDisabled] = useState(true);
|
|
30613
|
-
const [isTextFieldModified, setIsTextFieldModified] = useState(false);
|
|
30614
|
-
const isThrowingError = showError && isEditing ? true : false;
|
|
30615
|
-
const containerRef = useRef(null);
|
|
30616
|
-
const cancelRef = useRef(null);
|
|
30617
|
-
const [clickTimeout, setClickTimeout] = useState(null);
|
|
30618
|
-
const handleEsc = useEscapeKey('Escape');
|
|
30619
|
-
useEffect(() => {
|
|
30620
|
-
return () => {
|
|
30621
|
-
if (clickTimeout) {
|
|
30622
|
-
clearTimeout(clickTimeout);
|
|
30623
|
-
}
|
|
30624
|
-
};
|
|
30625
|
-
}, [clickTimeout]);
|
|
30626
|
-
const handleDoubleClick = () => {
|
|
30627
|
-
if (clickTimeout) {
|
|
30628
|
-
clearTimeout(clickTimeout);
|
|
30629
|
-
setClickTimeout(null);
|
|
30630
|
-
}
|
|
30631
|
-
setIsEditing(true);
|
|
30632
|
-
setShowError('');
|
|
30633
|
-
};
|
|
30634
|
-
const handleSingleClick = () => {
|
|
30635
|
-
if (onClick) onClick();
|
|
30636
|
-
};
|
|
30637
|
-
const handleClick = () => {
|
|
30638
|
-
if (clickTimeout) {
|
|
30639
|
-
clearTimeout(clickTimeout);
|
|
30640
|
-
setClickTimeout(null);
|
|
30641
|
-
}
|
|
30642
|
-
const timeout = window.setTimeout(() => {
|
|
30643
|
-
handleSingleClick();
|
|
30644
|
-
setClickTimeout(null);
|
|
30645
|
-
}, 1000);
|
|
30646
|
-
setClickTimeout(timeout);
|
|
30647
|
-
};
|
|
30648
|
-
const handleConfirm = () => {
|
|
30649
|
-
let errorMessage = '';
|
|
30650
|
-
if (inputValue.length === 0 || inputValue.trim().length === 0) {
|
|
30651
|
-
errorMessage = 'Please type any text.';
|
|
30652
|
-
} else if (inputValue.length < 3) {
|
|
30653
|
-
errorMessage = 'Please enter at least 3 characters.';
|
|
30654
|
-
} else if (customErrorCondition) {
|
|
30655
|
-
errorMessage = customError ?? 'Invalid input.';
|
|
30656
|
-
}
|
|
30657
|
-
if (errorMessage) {
|
|
30658
|
-
setShowError(errorMessage);
|
|
30659
|
-
} else {
|
|
30660
|
-
setIsEditing(false);
|
|
30661
|
-
setShowError('');
|
|
30662
|
-
if (confirmAction) confirmAction(inputValue, dropdownValue);
|
|
30663
|
-
}
|
|
30664
|
-
};
|
|
30665
|
-
const handleCancel = () => {
|
|
30666
|
-
setInputValue(text ?? '');
|
|
30667
|
-
setDropdownValue(dropdownData[0]?.value ?? '');
|
|
30668
|
-
setIsEditing(false);
|
|
30669
|
-
setShowError('');
|
|
30670
|
-
setIsTextFieldModified(false);
|
|
30671
|
-
};
|
|
30672
|
-
const handleTextFieldChange = e => {
|
|
30673
|
-
const newValue = e.target.value;
|
|
30674
|
-
setInputValue(newValue);
|
|
30675
|
-
isDisabled(false);
|
|
30676
|
-
if (newValue.length === 0 || newValue.trim().length === 0) {
|
|
30677
|
-
setShowError('Please type any text.');
|
|
30678
|
-
} else if (newValue.length < 3) {
|
|
30679
|
-
setShowError('Please enter at least 3 characters.');
|
|
30680
|
-
} else if (customErrorCondition) {
|
|
30681
|
-
setShowError(customError ?? 'Invalid input.');
|
|
30682
|
-
} else {
|
|
30683
|
-
setShowError('');
|
|
30684
|
-
}
|
|
30685
|
-
setIsTextFieldModified(newValue !== text);
|
|
30686
|
-
if (onInputChange) {
|
|
30687
|
-
onInputChange(newValue);
|
|
30688
|
-
}
|
|
30689
|
-
};
|
|
30690
|
-
const handleBlur = e => {
|
|
30691
|
-
if (containerRef.current && !containerRef.current.contains(e.target) && cancelRef.current !== e.target) {
|
|
30692
|
-
const errorMessage = getErrorMessage$1(inputValue, text ?? '');
|
|
30693
|
-
if (errorMessage && isEditing) {
|
|
30694
|
-
setShowError(errorMessage);
|
|
30695
|
-
} else {
|
|
30696
|
-
setIsEditing(false);
|
|
30697
|
-
setShowError('');
|
|
30698
|
-
}
|
|
30699
|
-
}
|
|
30700
|
-
};
|
|
30701
|
-
useEffect(() => {
|
|
30702
|
-
document.addEventListener('click', handleBlur);
|
|
30703
|
-
return () => {
|
|
30704
|
-
document.removeEventListener('click', handleBlur);
|
|
30705
|
-
};
|
|
30706
|
-
}, [inputValue]);
|
|
30707
|
-
handleEsc(handleCancel);
|
|
30708
|
-
return jsxs("div", {
|
|
30709
|
-
className: "ff-label-edit-text-field",
|
|
30710
|
-
ref: containerRef,
|
|
30711
|
-
children: [isEditing ? jsxs("div", {
|
|
30712
|
-
className: "ff-label-text-field",
|
|
30713
|
-
children: [variant === 'textFieldWithDropdown' ? jsxs("div", {
|
|
30714
|
-
className: `ff-label-text-field-with-dropdown ${isEditing ? 'open' : ''}`,
|
|
30715
|
-
style: {
|
|
30716
|
-
height
|
|
30717
|
-
},
|
|
30718
|
-
children: [jsx(Input, {
|
|
30719
|
-
name: "input",
|
|
30720
|
-
type: "text",
|
|
30721
|
-
label: label ? label : '',
|
|
30722
|
-
disabled: false,
|
|
30723
|
-
error: isThrowingError,
|
|
30724
|
-
placeholder: placeholder ? placeholder : '',
|
|
30725
|
-
value: inputValue,
|
|
30726
|
-
onChange: handleTextFieldChange,
|
|
30727
|
-
className: `${className}
|
|
30728
|
-
|
|
30729
|
-
${isTextFieldModified ? 'modified' : ''}`
|
|
30730
|
-
}), jsx(Select$1, {
|
|
30731
|
-
label: '',
|
|
30732
|
-
optionsList: dropdownData,
|
|
30733
|
-
selectedOption: {
|
|
30734
|
-
value: dropdownValue,
|
|
30735
|
-
label: dropdownValue
|
|
30736
|
-
},
|
|
30737
|
-
onChange: option => setDropdownValue(option.value)
|
|
30738
|
-
})]
|
|
30739
|
-
}) : jsx("div", {
|
|
30740
|
-
className: "ff-label-text-field-without-dropdown",
|
|
30741
|
-
children: jsx(Input, {
|
|
30742
|
-
name: "input",
|
|
30743
|
-
type: "text",
|
|
30744
|
-
label: label ? label : '',
|
|
30745
|
-
disabled: false,
|
|
30746
|
-
placeholder: placeholder ? placeholder : '',
|
|
30747
|
-
value: inputValue,
|
|
30748
|
-
onChange: handleTextFieldChange,
|
|
30749
|
-
className: `${className}
|
|
30750
|
-
|
|
30751
|
-
${isTextFieldModified ? 'modified' : ''}`
|
|
30752
|
-
})
|
|
30753
|
-
}), jsxs("div", {
|
|
30754
|
-
className: "ff-icon-container",
|
|
30755
|
-
children: [confirmIcon && jsx(Icon, {
|
|
30756
|
-
color: "var(--label-edit-confirm-icon)",
|
|
30757
|
-
height: 20,
|
|
30758
|
-
width: 20,
|
|
30759
|
-
name: confirmIcon.name,
|
|
30760
|
-
disabled: disabled,
|
|
30761
|
-
className: `${disabled ? 'disabled-confirm-icon' : 'confirm-icon'}`,
|
|
30762
|
-
onClick: handleConfirm
|
|
30763
|
-
}), cancelIcon && jsx(Icon, {
|
|
30764
|
-
color: "var(--label-edit-cancel-icon)",
|
|
30765
|
-
height: 12,
|
|
30766
|
-
width: 20,
|
|
30767
|
-
name: cancelIcon.name,
|
|
30768
|
-
className: "cancel-icon",
|
|
30769
|
-
onClick: handleCancel,
|
|
30770
|
-
ref: cancelRef
|
|
30771
|
-
})]
|
|
30772
|
-
})]
|
|
30773
|
-
}) : jsx(Tooltip, {
|
|
30774
|
-
title: tooltip?.tooltipTitle ? tooltip?.tooltipTitle : '',
|
|
30775
|
-
placement: 'bottom',
|
|
30776
|
-
children: showText && jsx("span", {
|
|
30777
|
-
className: "display-text",
|
|
30778
|
-
onDoubleClick: handleDoubleClick,
|
|
30779
|
-
role: "button",
|
|
30780
|
-
onClick: handleClick,
|
|
30781
|
-
children: jsx(HighlightText, {
|
|
30782
|
-
text: inputValue,
|
|
30783
|
-
highlight: highlightText
|
|
30784
|
-
})
|
|
30785
|
-
})
|
|
30786
|
-
}), showError && isEditing && jsx(Typography, {
|
|
30787
|
-
as: "p",
|
|
30788
|
-
fontSize: 8,
|
|
30789
|
-
className: "error-text",
|
|
30790
|
-
children: showError
|
|
30791
|
-
})]
|
|
30792
|
-
});
|
|
30793
|
-
};
|
|
30794
|
-
|
|
30795
30978
|
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}";
|
|
30796
30979
|
styleInject(css_248z$q);
|
|
30797
30980
|
|
|
@@ -36989,6 +37172,7 @@ const IconRadialChart = ({
|
|
|
36989
37172
|
percentageValue,
|
|
36990
37173
|
icon,
|
|
36991
37174
|
fontSize = 10,
|
|
37175
|
+
labelColor = '',
|
|
36992
37176
|
arcColor = 'var(--brand-color)',
|
|
36993
37177
|
backgroundArcColor = 'var(--ff-select-scroll-thumb-color)'
|
|
36994
37178
|
}) => {
|
|
@@ -37075,7 +37259,7 @@ const IconRadialChart = ({
|
|
|
37075
37259
|
}) : jsx("text", {
|
|
37076
37260
|
x: "0",
|
|
37077
37261
|
y: "0",
|
|
37078
|
-
fill: arcColor,
|
|
37262
|
+
fill: labelColor || arcColor,
|
|
37079
37263
|
textAnchor: "middle",
|
|
37080
37264
|
dominantBaseline: "central",
|
|
37081
37265
|
children: `${Math.round(percentageValue)}%`
|
|
@@ -37160,7 +37344,7 @@ const AttachImage = ({
|
|
|
37160
37344
|
});
|
|
37161
37345
|
};
|
|
37162
37346
|
|
|
37163
|
-
var css_248z$h = ".ff-card-container {\n height: 78px;\n display: flex;\n align-items: center;\n border: 1px solid var(--border-color);\n border-radius: 4px;\n overflow: hidden;\n cursor: pointer;\n}\n.ff-card-container:hover.passed {\n border-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container:hover.failed {\n border-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container:hover.warning {\n border-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container:hover.skipped {\n border-color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container:hover.flaky {\n border-color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container .ff-status-bar {\n width: 12%;\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: start;\n align-items: center;\n border-right: 1px solid var(--border-color);\n gap: 17px;\n}\n.ff-card-container .ff-status-bar .ff-status-text {\n transform: rotate(-90deg);\n transform-origin: center;\n display: inline-block;\n}\n.ff-card-container.passed .ff-status-bar {\n background-color: var(--ff-card-passed-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.failed .ff-status-bar {\n background-color: var(--ff-card-failed-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.warning .ff-status-bar {\n background-color: var(--ff-card-warning-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.skipped .ff-status-bar {\n background-color: var(--ff-card-skipped-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.flaky .ff-status-bar {\n background-color: var(--ff-card-flaky-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container .ff-content {\n height: 100%;\n flex: 1;\n padding: 0px 8px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n}\n.ff-card-container .ff-content .ff-number {\n margin-bottom: 4px;\n color: inherit;\n}\n.ff-card-container.passed .ff-number {\n color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.failed .ff-number {\n color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.warning .ff-number {\n color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.skipped .ff-number {\n color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.flaky .ff-number {\n color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container.toggled.passed .ff-status-bar {\n background-color: var(--base-bg-color);\n color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.toggled.failed .ff-status-bar {\n background-color: var(--base-bg-color);\n color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.toggled.warning .ff-status-bar {\n background-color: var(--base-bg-color);\n color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.toggled.skipped .ff-status-bar {\n background-color: var(--base-bg-color);\n color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.toggled.flaky .ff-status-bar {\n background-color: var(--base-bg-color);\n color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container.toggled.passed .ff-content {\n background-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.toggled.failed .ff-content {\n background-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.toggled.warning .ff-content {\n background-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.toggled.skipped .ff-content {\n background-color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.toggled.flaky .ff-content {\n background-color: var(--ff-card-flaky-status-bg-color);\n}";
|
|
37347
|
+
var css_248z$h = ".ff-card-container {\n height: 78px;\n display: flex;\n align-items: center;\n border: 1px solid var(--border-color);\n border-radius: 4px;\n overflow: hidden;\n cursor: pointer;\n}\n.ff-card-container:hover.passed {\n border-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container:hover.passed .ff-status-bar {\n border-right: 1px solid var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container:hover.failed {\n border-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container:hover.failed .ff-status-bar {\n border-right: 1px solid var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container:hover.warning {\n border-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container:hover.warning .ff-status-bar {\n border-right: 1px solid var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container:hover.skipped {\n border-color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container:hover.skipped .ff-status-bar {\n border-right: 1px solid var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container:hover.flaky {\n border-color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container:hover.flaky .ff-status-bar {\n border-right: 1px solid var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container:hover.total {\n border-color: var(--card-total-defect-color);\n}\n.ff-card-container:hover.total .ff-status-bar {\n border-right: 1px solid var(--card-total-defect-color);\n}\n.ff-card-container:hover.defect {\n border-color: var(--card-defect-density);\n}\n.ff-card-container:hover.defect .ff-status-bar {\n border-right: 1px solid var(--card-defect-density);\n}\n.ff-card-container:hover.open {\n border-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container:hover.open .ff-status-bar {\n border-right: 1px solid var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container:hover.closed {\n border-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container:hover.closed .ff-status-bar {\n border-right: 1px solid var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container:hover.quality {\n border-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container:hover.quality .ff-status-bar {\n border-right: 1px solid var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container .ff-status-bar {\n width: 12%;\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: center;\n border-right: 1px solid var(--border-color);\n border-radius: 3px;\n}\n.ff-card-container .ff-status-bar .ff-status-text {\n transform: rotate(-90deg);\n transform-origin: center;\n display: flex;\n align-items: start;\n height: 16px;\n width: 6px;\n}\n.ff-card-container.passed .ff-status-bar {\n background-color: var(--ff-card-passed-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.passed .ff-content .ff-number {\n color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.passed.toggled {\n background-color: var(--ff-card-passed-status-bg-color);\n border: 1px solid var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.passed.toggled .ff-status-bar {\n border-right: 1px solid var(--ff-card-passed-status-bg-color);\n background-color: var(--base-bg-color);\n color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.passed.toggled .ff-content {\n background-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.failed .ff-status-bar {\n background-color: var(--ff-card-failed-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.failed .ff-content .ff-number {\n color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.failed.toggled {\n background-color: var(--ff-card-failed-status-bg-color);\n border: 1px solid var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.failed.toggled .ff-status-bar {\n border-right: 1px solid var(--ff-card-failed-status-bg-color);\n background-color: var(--base-bg-color);\n color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.failed.toggled .ff-content {\n background-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.warning .ff-status-bar {\n background-color: var(--ff-card-warning-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.warning .ff-content .ff-number {\n color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.warning.toggled {\n background-color: var(--ff-card-warning-status-bg-color);\n border: 1px solid var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.warning.toggled .ff-status-bar {\n border-right: 1px solid var(--ff-card-warning-status-bg-color);\n background-color: var(--base-bg-color);\n color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.warning.toggled .ff-content {\n background-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.skipped .ff-status-bar {\n background-color: var(--ff-card-skipped-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.skipped .ff-content .ff-number {\n color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.skipped.toggled {\n background-color: var(--ff-card-skipped-status-bg-color);\n border: 1px solid var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.skipped.toggled .ff-status-bar {\n border-right: 1px solid var(--ff-card-skipped-status-bg-color);\n background-color: var(--base-bg-color);\n color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.skipped.toggled .ff-content {\n background-color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.flaky .ff-status-bar {\n background-color: var(--ff-card-flaky-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.flaky .ff-content .ff-number {\n color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container.flaky.toggled {\n background-color: var(--ff-card-flaky-status-bg-color);\n border: 1px solid var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container.flaky.toggled .ff-status-bar {\n border-right: 1px solid var(--ff-card-flaky-status-bg-color);\n background-color: var(--base-bg-color);\n color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container.flaky.toggled .ff-content {\n background-color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container.total .ff-status-bar {\n background-color: var(--card-total-defect-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.total .ff-content .ff-number {\n color: var(--card-total-defect-color);\n}\n.ff-card-container.total.toggled {\n background-color: var(--card-total-defect-color);\n border: 1px solid var(--card-total-defect-color);\n}\n.ff-card-container.total.toggled .ff-status-bar {\n border-right: 1px solid var(--card-total-defect-color);\n background-color: var(--base-bg-color);\n color: var(--card-total-defect-color);\n}\n.ff-card-container.total.toggled .ff-content {\n background-color: var(--card-total-defect-color);\n}\n.ff-card-container.defect .ff-status-bar {\n background-color: var(--card-defect-density);\n color: var(--base-bg-color);\n}\n.ff-card-container.defect .ff-content .ff-number {\n color: var(--card-defect-density);\n}\n.ff-card-container.defect.toggled {\n background-color: var(--card-defect-density);\n border: 1px solid var(--card-defect-density);\n}\n.ff-card-container.defect.toggled .ff-status-bar {\n border-right: 1px solid var(--card-defect-density);\n background-color: var(--base-bg-color);\n color: var(--card-defect-density);\n}\n.ff-card-container.defect.toggled .ff-content {\n background-color: var(--card-defect-density);\n}\n.ff-card-container.open .ff-status-bar {\n background-color: var(--ff-card-failed-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.open .ff-content .ff-number {\n color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.open.toggled {\n background-color: var(--ff-card-failed-status-bg-color);\n border: 1px solid var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.open.toggled .ff-status-bar {\n border-right: 1px solid var(--ff-card-failed-status-bg-color);\n background-color: var(--base-bg-color);\n color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.open.toggled .ff-content {\n background-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.closed .ff-status-bar {\n background-color: var(--ff-card-passed-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.closed .ff-content .ff-number {\n color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.closed.toggled {\n background-color: var(--ff-card-passed-status-bg-color);\n border: 1px solid var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.closed.toggled .ff-status-bar {\n border-right: 1px solid var(--ff-card-passed-status-bg-color);\n background-color: var(--base-bg-color);\n color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.closed.toggled .ff-content {\n background-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.quality .ff-status-bar {\n background-color: var(--ff-card-warning-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.quality .ff-content .ff-number {\n color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.quality.toggled {\n background-color: var(--ff-card-warning-status-bg-color);\n border: 1px solid var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.quality.toggled .ff-status-bar {\n border-right: 1px solid var(--ff-card-warning-status-bg-color);\n background-color: var(--base-bg-color);\n color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.quality.toggled .ff-content {\n background-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container .ff-content {\n height: 100%;\n flex: 1;\n padding: 0px 8px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n}\n.ff-card-container .ff-content .ff-number {\n margin-bottom: 4px;\n color: inherit;\n}\n.ff-card-container .ff-content.red-background {\n gap: 8px;\n}";
|
|
37164
37348
|
styleInject(css_248z$h);
|
|
37165
37349
|
|
|
37166
37350
|
const StatusCard = ({
|
|
@@ -37175,7 +37359,13 @@ const StatusCard = ({
|
|
|
37175
37359
|
onSelectedStatus = _status => {}
|
|
37176
37360
|
}) => {
|
|
37177
37361
|
const [isToggled, setIsToggled] = useState(false);
|
|
37362
|
+
const hideStatusText = ['total defects', 'defect density', 'open defects', 'closed defects', 'quality score'];
|
|
37363
|
+
const swapCountAndText = hideStatusText.includes(status.toLowerCase());
|
|
37364
|
+
const redBackground = hideStatusText.includes(status.toLowerCase());
|
|
37178
37365
|
const handleSelectStatus = status => {
|
|
37366
|
+
if (hideStatusText.includes(status.toLowerCase())) {
|
|
37367
|
+
return;
|
|
37368
|
+
}
|
|
37179
37369
|
setIsToggled(true);
|
|
37180
37370
|
onSelectedStatus(status);
|
|
37181
37371
|
};
|
|
@@ -37184,8 +37374,23 @@ const StatusCard = ({
|
|
|
37184
37374
|
setIsToggled(false);
|
|
37185
37375
|
}
|
|
37186
37376
|
}, [resetToggle]);
|
|
37377
|
+
const handleStaticCard = () => {
|
|
37378
|
+
if (status.toLowerCase() === 'defect density') {
|
|
37379
|
+
return jsxs(Fragment, {
|
|
37380
|
+
children: [count.toString().padStart(2, '0'), jsx(Typography, {
|
|
37381
|
+
fontSize: "15px",
|
|
37382
|
+
fontWeight: "semi-bold",
|
|
37383
|
+
children: "/ Modules"
|
|
37384
|
+
})]
|
|
37385
|
+
});
|
|
37386
|
+
} else if (status.toLowerCase() === 'quality score') {
|
|
37387
|
+
return `${parseFloat(count.toString()).toFixed(2)}%`;
|
|
37388
|
+
} else {
|
|
37389
|
+
return count.toString().padStart(2, '0');
|
|
37390
|
+
}
|
|
37391
|
+
};
|
|
37187
37392
|
return jsxs("div", {
|
|
37188
|
-
className: `ff-card-container ${status.toLowerCase()} ${isToggled ?
|
|
37393
|
+
className: `ff-card-container ${status.toLowerCase()} ${isToggled ? 'toggled' : ''}`,
|
|
37189
37394
|
style: style,
|
|
37190
37395
|
onClick: () => handleSelectStatus(status),
|
|
37191
37396
|
children: [jsxs("div", {
|
|
@@ -37197,32 +37402,47 @@ const StatusCard = ({
|
|
|
37197
37402
|
width: 20,
|
|
37198
37403
|
hoverEffect: false
|
|
37199
37404
|
})
|
|
37200
|
-
}), jsx(Typography, {
|
|
37405
|
+
}), !hideStatusText.includes(status.toLowerCase()) && jsx(Typography, {
|
|
37201
37406
|
fontWeight: "semi-bold",
|
|
37202
37407
|
fontSize: "10px",
|
|
37203
37408
|
textAlign: "center",
|
|
37204
37409
|
lineHeight: "15px",
|
|
37205
37410
|
className: "ff-status-text",
|
|
37206
37411
|
as: "div",
|
|
37207
|
-
children: status
|
|
37208
|
-
})]
|
|
37209
|
-
}), jsxs("div", {
|
|
37210
|
-
className: "ff-content",
|
|
37211
|
-
children: [jsx(Typography, {
|
|
37212
|
-
fontWeight: "semi-bold",
|
|
37213
|
-
fontSize: "24px",
|
|
37214
|
-
className: "ff-number",
|
|
37215
|
-
lineHeight: "36px",
|
|
37216
|
-
color: isToggled ? 'var(--base-bg-color)' : '',
|
|
37217
|
-
children: count
|
|
37218
|
-
}), jsx(Typography, {
|
|
37219
|
-
fontWeight: "regular",
|
|
37220
|
-
fontSize: "10px",
|
|
37221
|
-
className: "ff-text",
|
|
37222
|
-
lineHeight: "15px",
|
|
37223
|
-
color: isToggled ? 'var(--base-bg-color)' : 'var(--ff-card-status-text-color)',
|
|
37224
|
-
children: text
|
|
37412
|
+
children: status.charAt(0).toUpperCase() + status.slice(1).toLowerCase()
|
|
37225
37413
|
})]
|
|
37414
|
+
}), jsx("div", {
|
|
37415
|
+
className: `ff-content ${redBackground ? 'red-background' : ''}`,
|
|
37416
|
+
children: swapCountAndText ? jsxs(Fragment, {
|
|
37417
|
+
children: [jsx(Typography, {
|
|
37418
|
+
fontWeight: "semi-bold",
|
|
37419
|
+
fontSize: "10px",
|
|
37420
|
+
className: "ff-text",
|
|
37421
|
+
lineHeight: "15px",
|
|
37422
|
+
color: 'var(--ff-chip-text-color)',
|
|
37423
|
+
children: text
|
|
37424
|
+
}), jsx(Typography, {
|
|
37425
|
+
fontWeight: "semi-bold",
|
|
37426
|
+
fontSize: "24px",
|
|
37427
|
+
className: "ff-number",
|
|
37428
|
+
lineHeight: "36px",
|
|
37429
|
+
children: handleStaticCard()
|
|
37430
|
+
})]
|
|
37431
|
+
}) : jsxs(Fragment, {
|
|
37432
|
+
children: [jsx(Typography, {
|
|
37433
|
+
fontWeight: "semi-bold",
|
|
37434
|
+
fontSize: "24px",
|
|
37435
|
+
className: "ff-number",
|
|
37436
|
+
lineHeight: "24px",
|
|
37437
|
+
color: isToggled ? 'var(--base-bg-color)' : '',
|
|
37438
|
+
children: count.toString().padStart(2, '0')
|
|
37439
|
+
}), jsx(Typography, {
|
|
37440
|
+
className: "ff-text",
|
|
37441
|
+
lineHeight: "18px",
|
|
37442
|
+
color: isToggled ? 'var(--base-bg-color)' : 'var(--ff-chip-text-color)',
|
|
37443
|
+
children: text
|
|
37444
|
+
})]
|
|
37445
|
+
})
|
|
37226
37446
|
})]
|
|
37227
37447
|
});
|
|
37228
37448
|
};
|
|
@@ -37391,7 +37611,8 @@ const LineChart = ({
|
|
|
37391
37611
|
fontWeight,
|
|
37392
37612
|
numberSize,
|
|
37393
37613
|
proportionalSpacing,
|
|
37394
|
-
chartName
|
|
37614
|
+
chartName,
|
|
37615
|
+
xAxisLabelGap = 16
|
|
37395
37616
|
}) => {
|
|
37396
37617
|
const margin = 40;
|
|
37397
37618
|
const xMax = width - margin * 2;
|
|
@@ -37542,7 +37763,8 @@ const LineChart = ({
|
|
|
37542
37763
|
return jsxs("div", {
|
|
37543
37764
|
className: "ff-line-chart-text",
|
|
37544
37765
|
style: {
|
|
37545
|
-
width: width + 20
|
|
37766
|
+
width: width + 20 + xAxisLabelGap,
|
|
37767
|
+
gap: xAxisLabelGap
|
|
37546
37768
|
},
|
|
37547
37769
|
children: [jsxs("div", {
|
|
37548
37770
|
className: "ff-line-chart-yAxisLabel-warpper",
|
|
@@ -37624,10 +37846,10 @@ const LineChart = ({
|
|
|
37624
37846
|
strokeDasharray: "4"
|
|
37625
37847
|
})]
|
|
37626
37848
|
})]
|
|
37627
|
-
}, index) : null), data[0].data.filter((_, index) => index % xTickInterval === 0).map(point => jsx("text", {
|
|
37849
|
+
}, index) : null), data[0].data.filter((_, index) => index % xTickInterval === 0).map((point, index) => jsx("text", {
|
|
37628
37850
|
x: xScale(point[xKey]),
|
|
37629
37851
|
y: yMax + 15,
|
|
37630
|
-
textAnchor:
|
|
37852
|
+
textAnchor: index === 0 ? 'start' : 'middle',
|
|
37631
37853
|
fill: yAxisColor,
|
|
37632
37854
|
className: "ff--line-chart-x-line-data",
|
|
37633
37855
|
style: {
|
|
@@ -43565,7 +43787,7 @@ const throttle = (func, limit) => {
|
|
|
43565
43787
|
return throttled;
|
|
43566
43788
|
};
|
|
43567
43789
|
|
|
43568
|
-
var css_248z$7 = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-bar-chart-container .ff-bar-chart-labels, .ff-bar-chart-container .ff-bar-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-bar-chart-container {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ff-bar-chart-container svg {\n display: block;\n}\n.ff-bar-chart-container .ff-legend-container {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n padding-right: 10px;\n}\n.ff-bar-chart-container .ff-legend-container .ff-bar-chart-legend {\n width: 290px;\n margin-top: 10px;\n display: flex;\n justify-content: flex-end;\n}\n.ff-bar-chart-container .ff-legend-container .ff-bar-chart-legend .ff-bar-chart-legend-item {\n display: flex;\n align-items: center;\n}\n.ff-bar-chart-container .ff-legend-container .ff-bar-chart-legend .ff-bar-chart-legend-item .ff-bar-chart-legend-item-circle {\n display: inline-block;\n width: 12px;\n height: 12px;\n margin-right: 5px;\n border-radius: 50%;\n}\n.ff-bar-chart-container .ff-legend-container .ff-bar-chart-legend .ff-legend-label {\n margin-left: 5px;\n}\n.ff-bar-chart-container .ff-bar-chart-icon {\n position: absolute;\n pointer-events: none;\n width: 24px;\n height: 24px;\n}\n.ff-bar-chart-container .ff-bar-chart-icon-wrapper {\n position: absolute;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ff-bar-chart-container .ff-bar-chart-labels {\n font-weight: 400;\n color: var(--text-color);\n}\n.ff-bar-chart-container .ff-bar-chart-tooltip {\n position: absolute;\n padding: 5px 10px;\n background-color: var(--tooltip-bg-color);\n color: var(--primary-icon-color);\n border-radius: 4px;\n pointer-events: none;\n font-weight: 600;\n}";
|
|
43790
|
+
var css_248z$7 = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-bar-chart-container .ff-bar-chart-labels, .ff-bar-chart-container .ff-bar-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-bar-chart-container {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ff-bar-chart-container svg {\n display: block;\n}\n.ff-bar-chart-container .ff-legend-container {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n padding-right: 10px;\n}\n.ff-bar-chart-container .ff-legend-container .ff-bar-chart-legend {\n width: 290px;\n margin-top: 10px;\n display: flex;\n justify-content: flex-end;\n}\n.ff-bar-chart-container .ff-legend-container .ff-bar-chart-legend .ff-bar-chart-legend-item {\n display: flex;\n align-items: center;\n}\n.ff-bar-chart-container .ff-legend-container .ff-bar-chart-legend .ff-bar-chart-legend-item .ff-bar-chart-legend-item-circle {\n display: inline-block;\n width: 12px;\n height: 12px;\n margin-right: 5px;\n border-radius: 50%;\n}\n.ff-bar-chart-container .ff-legend-container .ff-bar-chart-legend .ff-legend-label {\n margin-left: 5px;\n}\n.ff-bar-chart-container .ff-bar-chart-icon {\n position: absolute;\n pointer-events: none;\n width: 24px;\n height: 24px;\n}\n.ff-bar-chart-container .ff-bar-chart-icon-wrapper {\n position: absolute;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ff-bar-chart-container .ff-bar-chart-labels {\n font-weight: 400;\n color: var(--text-color);\n}\n.ff-bar-chart-container .ff-bar-chart-tooltip {\n display: none;\n position: absolute;\n padding: 5px 10px;\n background-color: var(--tooltip-bg-color);\n color: var(--primary-icon-color);\n border-radius: 4px;\n pointer-events: none;\n font-weight: 600;\n}";
|
|
43569
43791
|
styleInject(css_248z$7);
|
|
43570
43792
|
|
|
43571
43793
|
const BarChart = ({
|
|
@@ -43586,65 +43808,65 @@ const BarChart = ({
|
|
|
43586
43808
|
iconSize,
|
|
43587
43809
|
legendPosition = 'bottom',
|
|
43588
43810
|
legendGap = 5,
|
|
43811
|
+
extendBarChartRightWidth = 0,
|
|
43812
|
+
isYAxisValuePercentage = false,
|
|
43589
43813
|
onSelectedBar = _label => {}
|
|
43590
43814
|
}) => {
|
|
43591
|
-
const
|
|
43592
|
-
|
|
43593
|
-
content: '',
|
|
43594
|
-
x: 0,
|
|
43595
|
-
y: 0,
|
|
43596
|
-
borderColor: 'transparent'
|
|
43597
|
-
});
|
|
43815
|
+
const tooltipRef = useRef(null);
|
|
43816
|
+
const [selectedBar, setSelectedBar] = useState(null);
|
|
43598
43817
|
const maxValue = Math.max(...data.map(item => item.value));
|
|
43599
43818
|
const topPadding = 40;
|
|
43600
43819
|
const leftPadding = 40;
|
|
43601
43820
|
const totalBarWidth = data.length * barWidth + (data.length - 1) * barGap;
|
|
43602
|
-
const chartWidth = totalBarWidth + leftPadding * 2 + 10;
|
|
43821
|
+
const chartWidth = totalBarWidth + leftPadding * 2 + 10 + extendBarChartRightWidth;
|
|
43603
43822
|
const renderGradients = gradients => {
|
|
43604
|
-
|
|
43605
|
-
|
|
43606
|
-
|
|
43607
|
-
|
|
43608
|
-
|
|
43609
|
-
|
|
43610
|
-
|
|
43611
|
-
|
|
43612
|
-
|
|
43613
|
-
|
|
43614
|
-
|
|
43615
|
-
|
|
43616
|
-
|
|
43823
|
+
const generateKey = Date.now();
|
|
43824
|
+
return gradients.map((gradient, index) => {
|
|
43825
|
+
return jsx("defs", {
|
|
43826
|
+
children: jsx("linearGradient", {
|
|
43827
|
+
id: `gradient-${index}`,
|
|
43828
|
+
x1: "0%",
|
|
43829
|
+
y1: "0%",
|
|
43830
|
+
x2: "0%",
|
|
43831
|
+
y2: "100%",
|
|
43832
|
+
children: gradient.map((color, i) => {
|
|
43833
|
+
return jsx("stop", {
|
|
43834
|
+
offset: `${i / (gradient.length - 1) * 100}%`,
|
|
43835
|
+
stopColor: color
|
|
43836
|
+
}, `${generateKey}-${index}-${i}`);
|
|
43837
|
+
})
|
|
43838
|
+
})
|
|
43839
|
+
}, `${generateKey}-${index}`);
|
|
43840
|
+
});
|
|
43617
43841
|
};
|
|
43618
43842
|
const getFillColor = index => colors?.[index % colors.length]?.[0] ? `url(#gradient-${index % colors.length})` : 'grey';
|
|
43619
|
-
const
|
|
43620
|
-
|
|
43621
|
-
|
|
43622
|
-
|
|
43623
|
-
|
|
43624
|
-
|
|
43625
|
-
content: `${label}: ${value}`,
|
|
43626
|
-
x: e.clientX,
|
|
43627
|
-
y: e.clientY,
|
|
43628
|
-
borderColor: color
|
|
43629
|
-
});
|
|
43843
|
+
const handleMouseEnter = (label, value) => {
|
|
43844
|
+
const tooltip = tooltipRef.current;
|
|
43845
|
+
if (tooltip) {
|
|
43846
|
+
tooltip.style.display = 'block';
|
|
43847
|
+
tooltip.innerHTML = `<strong>${label}</strong>: ${value} ${isYAxisValuePercentage ? '%' : ''}`;
|
|
43848
|
+
}
|
|
43630
43849
|
};
|
|
43631
43850
|
const handleMouseMove = e => {
|
|
43632
|
-
|
|
43633
|
-
|
|
43634
|
-
|
|
43635
|
-
|
|
43636
|
-
|
|
43851
|
+
const tooltip = tooltipRef.current;
|
|
43852
|
+
if (tooltip) {
|
|
43853
|
+
const rect = tooltip.parentElement?.getBoundingClientRect();
|
|
43854
|
+
const xOffset = window.scrollX;
|
|
43855
|
+
const yOffset = window.scrollY;
|
|
43856
|
+
const tooltipX = e.clientX - (rect?.left || 0) + xOffset + 10;
|
|
43857
|
+
const tooltipY = e.clientY - (rect?.top || 0) + yOffset + 10;
|
|
43858
|
+
tooltip.style.left = `${tooltipX}px`;
|
|
43859
|
+
tooltip.style.top = `${tooltipY}px`;
|
|
43860
|
+
}
|
|
43637
43861
|
};
|
|
43638
43862
|
const handleMouseLeave = () => {
|
|
43639
|
-
|
|
43640
|
-
|
|
43641
|
-
|
|
43642
|
-
|
|
43643
|
-
y: 0,
|
|
43644
|
-
borderColor: 'transparent'
|
|
43645
|
-
});
|
|
43863
|
+
const tooltip = tooltipRef.current;
|
|
43864
|
+
if (tooltip) {
|
|
43865
|
+
tooltip.style.display = 'none';
|
|
43866
|
+
}
|
|
43646
43867
|
};
|
|
43647
43868
|
const handleSelectLabel = label => {
|
|
43869
|
+
setSelectedBar(label);
|
|
43648
43870
|
onSelectedBar(label);
|
|
43649
43871
|
};
|
|
43650
43872
|
return jsxs("div", {
|
|
@@ -43652,7 +43874,10 @@ const BarChart = ({
|
|
|
43652
43874
|
style: {
|
|
43653
43875
|
width: chartWidth
|
|
43654
43876
|
},
|
|
43655
|
-
children: [
|
|
43877
|
+
children: [jsx("div", {
|
|
43878
|
+
ref: tooltipRef,
|
|
43879
|
+
className: "ff-bar-chart-tooltip"
|
|
43880
|
+
}), legend && legendPosition === 'top' && jsx("div", {
|
|
43656
43881
|
className: "ff-legend-container",
|
|
43657
43882
|
children: jsx("div", {
|
|
43658
43883
|
className: "ff-bar-chart-legend",
|
|
@@ -43693,7 +43918,7 @@ const BarChart = ({
|
|
|
43693
43918
|
fill: "black",
|
|
43694
43919
|
textAnchor: "middle",
|
|
43695
43920
|
className: "ff-bar-chart-labels",
|
|
43696
|
-
children: (i * maxValue / yAxisDivisions).toFixed(
|
|
43921
|
+
children: `${isYAxisValuePercentage ? `${(i * maxValue / yAxisDivisions).toFixed(0).toString().padStart(2, '0')}%` : (i * maxValue / yAxisDivisions).toFixed(0).toString().padStart(2, '0')}`
|
|
43697
43922
|
}, i);
|
|
43698
43923
|
}), data.map((item, index) => {
|
|
43699
43924
|
const barHeight = item.value / maxValue * height;
|
|
@@ -43703,6 +43928,7 @@ const BarChart = ({
|
|
|
43703
43928
|
const iconWidth = iconSize || 20;
|
|
43704
43929
|
const iconX = barX + barWidth / 2 - iconWidth / 2;
|
|
43705
43930
|
const iconY = barY - iconWidth;
|
|
43931
|
+
const isSelected = selectedBar === item.label;
|
|
43706
43932
|
return jsxs("g", {
|
|
43707
43933
|
children: [icons[index] && typeof icons[index] === 'string' && jsx(Icon, {
|
|
43708
43934
|
name: String(icons[index]),
|
|
@@ -43719,15 +43945,20 @@ const BarChart = ({
|
|
|
43719
43945
|
fill: getFillColor(index),
|
|
43720
43946
|
rx: barBorderRadius,
|
|
43721
43947
|
ry: barBorderRadius,
|
|
43722
|
-
|
|
43948
|
+
style: {
|
|
43949
|
+
fill: isSelected ? 'blue' : getFillColor(index),
|
|
43950
|
+
strokeWidth: isSelected ? 3 : 0,
|
|
43951
|
+
opacity: isSelected ? 0.9 : 1
|
|
43952
|
+
},
|
|
43953
|
+
onMouseEnter: () => handleMouseEnter(item.label, item.value),
|
|
43723
43954
|
onMouseMove: handleMouseMove,
|
|
43724
43955
|
onMouseLeave: handleMouseLeave,
|
|
43725
43956
|
onClick: () => handleSelectLabel(item.label)
|
|
43726
43957
|
}), showXAxisLabels && jsx("text", {
|
|
43727
|
-
x: barX + barWidth / 2,
|
|
43958
|
+
x: index == 0 ? barX : index === data.length - 1 ? barX + barWidth : barX + barWidth / 2,
|
|
43728
43959
|
y: height + topPadding + 15,
|
|
43729
43960
|
fill: "black",
|
|
43730
|
-
textAnchor:
|
|
43961
|
+
textAnchor: index == 0 ? 'start' : 'middle',
|
|
43731
43962
|
className: "ff-bar-chart-labels",
|
|
43732
43963
|
children: isTruncateText ? truncateText(item.label, 10) : item.label
|
|
43733
43964
|
})]
|
|
@@ -43785,18 +44016,11 @@ const BarChart = ({
|
|
|
43785
44016
|
})]
|
|
43786
44017
|
}, item.label))
|
|
43787
44018
|
})
|
|
43788
|
-
}), tooltip.visible && jsx("div", {
|
|
43789
|
-
className: "ff-bar-chart-tooltip",
|
|
43790
|
-
style: {
|
|
43791
|
-
top: tooltip.y - 20,
|
|
43792
|
-
left: tooltip.x + 10
|
|
43793
|
-
},
|
|
43794
|
-
children: tooltip.content
|
|
43795
44019
|
})]
|
|
43796
44020
|
});
|
|
43797
44021
|
};
|
|
43798
44022
|
|
|
43799
|
-
var css_248z$6 = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-multi-radial-chart-container .ff-center-text-tooltip, .ff-multi-radial-chart-container .ff-multi-radial-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, .ff-multi-radial-chart-container .ff-center-first-text {\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-multi-radial-chart-container {\n cursor: pointer;\n display: flex;\n align-items: center;\n}\n.ff-multi-radial-chart-container.ff-multi-radial-chart-number {\n flex-direction: column;\n}\n.ff-multi-radial-chart-container.ff-multi-radial-chart-pill {\n flex-direction: row;\n}\n.ff-multi-radial-chart-container .ff-center-first-text {\n color: var(--text-color);\n font-weight: 600;\n}\n.ff-multi-radial-chart-container .ff-center-text {\n color: var(--text-color);\n font-weight: 400;\n}\n.ff-multi-radial-chart-container .ff-center-text-tooltip {\n font-weight: 600;\n}\n.ff-multi-radial-chart-container .ff-multi-radial-tooltip {\n position: absolute;\n font-weight: 400;\n background-color: var(--tooltip-bg-color);\n color: var(--primary-icon-color);\n padding: 5px 10px;\n border-radius: 4px;\n pointer-events: none;\n z-index: 1000;\n}\n.ff-multi-radial-chart-container .ff-legend-container {\n display: grid;\n gap: 10px;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-number-legend {\n grid-template-columns: repeat(3, 1fr);\n margin-top: 21px;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-number-legend .ff-legend-item {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-pill-legend {\n grid-template-columns: auto;\n display: flex;\n flex-direction: column;\n justify-content: center;\n margin-left: 8px;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-pill-legend .ff-legend-item {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-pill-legend .ff-legend-item .ff-legend-capsule {\n background-color: var(--status-success-text-color);\n color: var(--text-color);\n border-radius: 15px;\n min-width: 21px;\n height: 15px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-pill-legend .ff-legend-item .ff-legend-key {\n margin-left: 8px;\n color: var(--text-color);\n}";
|
|
44023
|
+
var css_248z$6 = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-multi-radial-chart-container .ff-center-text-tooltip, .ff-multi-radial-chart-container .ff-multi-radial-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, .ff-multi-radial-chart-container .ff-center-first-text {\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-multi-radial-chart-container {\n position: relative;\n cursor: pointer;\n display: flex;\n align-items: center;\n}\n.ff-multi-radial-chart-container.ff-multi-radial-chart-number {\n flex-direction: column;\n}\n.ff-multi-radial-chart-container.ff-multi-radial-chart-pill {\n flex-direction: row;\n}\n.ff-multi-radial-chart-container .ff-center-first-text {\n color: var(--text-color);\n font-weight: 600;\n}\n.ff-multi-radial-chart-container .ff-center-text {\n color: var(--text-color);\n font-weight: 400;\n}\n.ff-multi-radial-chart-container .ff-center-text-tooltip {\n font-weight: 600;\n}\n.ff-multi-radial-chart-container .ff-multi-radial-tooltip {\n position: absolute;\n font-weight: 400;\n background-color: var(--tooltip-bg-color);\n color: var(--primary-icon-color);\n padding: 5px 10px;\n border-radius: 4px;\n pointer-events: none;\n z-index: 1000;\n}\n.ff-multi-radial-chart-container .ff-legend-container {\n display: grid;\n gap: 10px;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-number-legend {\n grid-template-columns: repeat(3, 1fr);\n margin-top: 21px;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-number-legend .ff-legend-item {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-pill-legend {\n grid-template-columns: auto;\n display: flex;\n flex-direction: column;\n justify-content: center;\n margin-left: 8px;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-pill-legend .ff-legend-item {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-pill-legend .ff-legend-item .ff-legend-capsule {\n background-color: var(--status-success-text-color);\n color: var(--text-color);\n border-radius: 15px;\n min-width: 21px;\n height: 15px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ff-multi-radial-chart-container .ff-legend-container.ff-pill-legend .ff-legend-item .ff-legend-key {\n margin-left: 8px;\n color: var(--text-color);\n}";
|
|
43800
44024
|
styleInject(css_248z$6);
|
|
43801
44025
|
|
|
43802
44026
|
const calculateArc = (centerX, centerY, radius, startAngle, endAngle) => {
|
|
@@ -43815,10 +44039,11 @@ const MultiRadialChart = ({
|
|
|
43815
44039
|
labelHeading,
|
|
43816
44040
|
legendType = 'numberLegend',
|
|
43817
44041
|
isLegendDetails = true,
|
|
43818
|
-
|
|
43819
|
-
|
|
44042
|
+
chartToLegendGap = '16px',
|
|
44043
|
+
legendGap = '8px',
|
|
43820
44044
|
labelFontSize = 12,
|
|
43821
|
-
subLabelFontSize = 8
|
|
44045
|
+
subLabelFontSize = 8,
|
|
44046
|
+
gapBetweenArch = 10
|
|
43822
44047
|
}) => {
|
|
43823
44048
|
const [tooltip, setTooltip] = useState({
|
|
43824
44049
|
visible: false,
|
|
@@ -43828,7 +44053,7 @@ const MultiRadialChart = ({
|
|
|
43828
44053
|
});
|
|
43829
44054
|
const totalBarValue = barValues.reduce((acc, status) => acc + status.value, 0);
|
|
43830
44055
|
const baseRadius = radius;
|
|
43831
|
-
const radiusIncrement = lineWidth +
|
|
44056
|
+
const radiusIncrement = lineWidth + gapBetweenArch;
|
|
43832
44057
|
const maxRadius = baseRadius + radiusIncrement * (barValues.length - 1);
|
|
43833
44058
|
const svgSize = 2 * (maxRadius + lineWidth);
|
|
43834
44059
|
const reversedBarValues = [...barValues].reverse();
|
|
@@ -43839,7 +44064,7 @@ const MultiRadialChart = ({
|
|
|
43839
44064
|
return jsx("div", {
|
|
43840
44065
|
className: "ff-legend-container ff-number-legend",
|
|
43841
44066
|
style: {
|
|
43842
|
-
gap:
|
|
44067
|
+
gap: legendGap
|
|
43843
44068
|
},
|
|
43844
44069
|
children: legendData.map((item, index) => jsxs("div", {
|
|
43845
44070
|
className: "ff-legend-item",
|
|
@@ -43861,7 +44086,7 @@ const MultiRadialChart = ({
|
|
|
43861
44086
|
return jsx("div", {
|
|
43862
44087
|
className: "ff-legend-container ff-pill-legend",
|
|
43863
44088
|
style: {
|
|
43864
|
-
gap:
|
|
44089
|
+
gap: legendGap
|
|
43865
44090
|
},
|
|
43866
44091
|
children: legendData.reverse().map((item, index) => jsxs("div", {
|
|
43867
44092
|
className: "ff-legend-item",
|
|
@@ -43890,10 +44115,11 @@ const MultiRadialChart = ({
|
|
|
43890
44115
|
clientX,
|
|
43891
44116
|
clientY
|
|
43892
44117
|
} = e;
|
|
44118
|
+
const container = e.currentTarget.getBoundingClientRect();
|
|
43893
44119
|
setTooltip({
|
|
43894
44120
|
visible: true,
|
|
43895
|
-
x: clientX,
|
|
43896
|
-
y: clientY,
|
|
44121
|
+
x: clientX - container.left,
|
|
44122
|
+
y: clientY - container.top,
|
|
43897
44123
|
content: content
|
|
43898
44124
|
});
|
|
43899
44125
|
};
|
|
@@ -43902,10 +44128,11 @@ const MultiRadialChart = ({
|
|
|
43902
44128
|
clientX,
|
|
43903
44129
|
clientY
|
|
43904
44130
|
} = e;
|
|
44131
|
+
const container = e.currentTarget.getBoundingClientRect();
|
|
43905
44132
|
setTooltip(prev => ({
|
|
43906
44133
|
...prev,
|
|
43907
|
-
x: clientX,
|
|
43908
|
-
y: clientY
|
|
44134
|
+
x: clientX - container.left,
|
|
44135
|
+
y: clientY - container.top
|
|
43909
44136
|
}));
|
|
43910
44137
|
};
|
|
43911
44138
|
const handleMouseLeave = () => {
|
|
@@ -43921,16 +44148,15 @@ const MultiRadialChart = ({
|
|
|
43921
44148
|
};
|
|
43922
44149
|
const getArcColorFromTooltip = () => {
|
|
43923
44150
|
if (!tooltip.visible) return '';
|
|
43924
|
-
const valueString = tooltip.content.split(':')[
|
|
43925
|
-
|
|
43926
|
-
|
|
43927
|
-
const matchingBar = barValues.find(val => val.value === value);
|
|
44151
|
+
const valueString = tooltip.content.split(':')[0]?.trim();
|
|
44152
|
+
if (valueString === undefined) return '';
|
|
44153
|
+
const matchingBar = barValues.find(val => val.barLabel === valueString);
|
|
43928
44154
|
return matchingBar?.arcColor || '';
|
|
43929
44155
|
};
|
|
43930
44156
|
return jsxs("div", {
|
|
43931
44157
|
className: `ff-multi-radial-chart-container ${legendType === 'numberLegend' ? 'ff-multi-radial-chart-number' : 'ff-multi-radial-chart-pill'}`,
|
|
43932
44158
|
style: {
|
|
43933
|
-
gap:
|
|
44159
|
+
gap: chartToLegendGap
|
|
43934
44160
|
},
|
|
43935
44161
|
children: [jsxs("div", {
|
|
43936
44162
|
className: "relative",
|
|
@@ -43944,7 +44170,7 @@ const MultiRadialChart = ({
|
|
|
43944
44170
|
viewBox: `0 0 ${svgSize} ${svgSize}`,
|
|
43945
44171
|
className: "absolute top-0 left-0",
|
|
43946
44172
|
children: jsxs("g", {
|
|
43947
|
-
transform: `translate(${svgSize / 2}, ${svgSize / 2})`,
|
|
44173
|
+
transform: `translate(${svgSize / 2 + 1}, ${svgSize / 2 + 1})`,
|
|
43948
44174
|
children: [reversedBarValues.map((values, i) => {
|
|
43949
44175
|
const originalIndex = barValues.length - 1 - i;
|
|
43950
44176
|
const percentage = values.value / totalBarValue;
|
|
@@ -43971,7 +44197,7 @@ const MultiRadialChart = ({
|
|
|
43971
44197
|
}), jsx("circle", {
|
|
43972
44198
|
cx: dotX,
|
|
43973
44199
|
cy: dotY,
|
|
43974
|
-
r:
|
|
44200
|
+
r: lineWidth + 1,
|
|
43975
44201
|
fill: values.arcColor,
|
|
43976
44202
|
onMouseEnter: e => handleMouseEnter(e, `${values.barLabel || 'Data'}: ${values.value}`),
|
|
43977
44203
|
onMouseMove: handleMouseMove,
|
|
@@ -44003,19 +44229,19 @@ const MultiRadialChart = ({
|
|
|
44003
44229
|
}, originalIndex);
|
|
44004
44230
|
}), jsx("text", {
|
|
44005
44231
|
x: "0",
|
|
44006
|
-
y:
|
|
44232
|
+
y: `-${lineWidth + gapBetweenArch + 2}`,
|
|
44007
44233
|
fill: getArcColorFromTooltip(),
|
|
44008
44234
|
textAnchor: "middle",
|
|
44009
44235
|
dominantBaseline: "central",
|
|
44010
44236
|
children: tooltip.visible ? jsxs(Fragment, {
|
|
44011
44237
|
children: [jsx("tspan", {
|
|
44012
44238
|
x: "0",
|
|
44013
|
-
dy:
|
|
44239
|
+
dy: `${lineWidth + gapBetweenArch - 5}`,
|
|
44014
44240
|
className: "ff-center-text-tooltip",
|
|
44015
44241
|
children: textData(tooltip.content.split(':')[1]?.trim() || '', 5)
|
|
44016
44242
|
}), jsx("tspan", {
|
|
44017
44243
|
x: "0",
|
|
44018
|
-
dy:
|
|
44244
|
+
dy: `${lineWidth + gapBetweenArch + 5}`,
|
|
44019
44245
|
className: "ff-center-text-tooltip",
|
|
44020
44246
|
children: textData(tooltip.content.split(':')[0] ?? '', 8)
|
|
44021
44247
|
})]
|
|
@@ -44060,7 +44286,7 @@ const MultiRadialChart = ({
|
|
|
44060
44286
|
className: "ff-multi-radial-tooltip",
|
|
44061
44287
|
style: {
|
|
44062
44288
|
top: tooltip.y + 10,
|
|
44063
|
-
left: tooltip.x +
|
|
44289
|
+
left: tooltip.x + 100,
|
|
44064
44290
|
zIndex: 1000
|
|
44065
44291
|
},
|
|
44066
44292
|
children: tooltip.content
|
|
@@ -53922,13 +54148,10 @@ const handleTreeNodeSect = (data, key, isChecked) => {
|
|
|
53922
54148
|
}
|
|
53923
54149
|
}
|
|
53924
54150
|
}
|
|
53925
|
-
// Find the target node and update its state
|
|
53926
54151
|
const targetNode = nodesMap.get(key);
|
|
53927
54152
|
if (targetNode) {
|
|
53928
54153
|
targetNode.checked = isChecked;
|
|
53929
|
-
// Update children recursively
|
|
53930
54154
|
updateChildren(key, isChecked);
|
|
53931
|
-
// Update parents recursively
|
|
53932
54155
|
updateParents(key);
|
|
53933
54156
|
}
|
|
53934
54157
|
return data;
|