pixel-react 1.6.7 → 1.6.9
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/.prettierrc.js +13 -13
- package/.storybook/main.ts +26 -26
- package/.storybook/preview-head.html +2 -2
- package/.storybook/preview.ts +26 -26
- package/.yarnrc.yml +1 -1
- package/README.md +75 -75
- package/index.scss +4 -4
- package/lib/components/AddVariables/types.d.ts +67 -3
- package/lib/components/AppHeader/types.d.ts +2 -0
- package/lib/components/Charts/BarChart/BarChart.d.ts +1 -0
- package/lib/components/Charts/DashboardDonutChart/types.d.ts +6 -0
- package/lib/components/CreateVariable/types.d.ts +2 -2
- package/lib/components/FileDropzone/RadioFilePreview.d.ts +4 -0
- package/lib/components/FileDropzone/types.d.ts +61 -0
- package/lib/components/InputWithDropdown/InputWithDropdown.d.ts +1 -1
- package/lib/components/MenuOption/types.d.ts +3 -2
- package/lib/components/Modal/types.d.ts +1 -1
- package/lib/components/PopUpModal/types.d.ts +2 -1
- package/lib/components/Search/Search.d.ts +1 -1
- package/lib/components/Search/types.d.ts +4 -0
- package/lib/components/Table/Types.d.ts +1 -1
- package/lib/components/Tabs/types.d.ts +1 -0
- package/lib/index.css +1 -0
- package/lib/index.d.ts +168 -31
- package/lib/index.esm.css +1 -0
- package/lib/index.esm.js +567 -327
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +568 -326
- package/lib/index.js.map +1 -1
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/lib/utils/FormatString/FormatString.d.ts +1 -0
- package/package.json +81 -81
- package/rollup.config.mjs +67 -67
- package/src/StyleGuide/ColorPalette/ColorPalette.scss +62 -62
- package/src/StyleGuide/ColorPalette/ColorPalette.stories.tsx +16 -16
- package/src/StyleGuide/ColorPalette/ColorPalette.tsx +67 -67
- package/src/StyleGuide/ColorPalette/colorPaletteList.ts +294 -279
- package/src/StyleGuide/ColorPalette/index.ts +1 -1
- package/src/StyleGuide/ColorPalette/types.ts +19 -19
- package/src/StyleGuide/Typography/Typography.scss +99 -99
- package/src/StyleGuide/Typography/Typography.stories.tsx +16 -16
- package/src/StyleGuide/Typography/Typography.tsx +60 -60
- package/src/StyleGuide/Typography/TypographyList.ts +3 -3
- package/src/StyleGuide/Typography/types.ts +9 -9
- package/src/assets/Themes/BaseTheme.scss +281 -279
- package/src/assets/Themes/DarkTheme.scss +288 -286
- package/src/assets/Themes/Theme.scss +16 -16
- package/src/assets/icons/Arrow.svg +4 -4
- package/src/assets/icons/Header_preset.svg +18 -18
- package/src/assets/icons/accordion_header_icon.svg +10 -10
- package/src/assets/icons/active_license_icon.svg +3 -3
- package/src/assets/icons/add_archive.svg +9 -9
- package/src/assets/icons/add_label_icon.svg +3 -3
- package/src/assets/icons/add_locator.svg +4 -4
- package/src/assets/icons/add_testcase.svg +3 -3
- package/src/assets/icons/add_user.svg +9 -9
- package/src/assets/icons/add_variable.svg +11 -11
- package/src/assets/icons/add_variable_icon.svg +4 -4
- package/src/assets/icons/alert.svg +17 -17
- package/src/assets/icons/all_borders.svg +3 -3
- package/src/assets/icons/all_projects.svg +3 -3
- package/src/assets/icons/android.svg +9 -9
- package/src/assets/icons/android_icon.svg +6 -6
- package/src/assets/icons/apk_file_type.svg +4 -4
- package/src/assets/icons/app_switch.svg +11 -11
- package/src/assets/icons/arrow_down.svg +3 -3
- package/src/assets/icons/arrow_right.svg +4 -4
- package/src/assets/icons/arrow_up.svg +3 -3
- package/src/assets/icons/arrows_down_icon.svg +3 -3
- package/src/assets/icons/arrows_right_icon.svg +10 -10
- package/src/assets/icons/arrows_top_icon.svg +3 -3
- package/src/assets/icons/attachment_icon.svg +3 -3
- package/src/assets/icons/authorization_icon.svg +4 -4
- package/src/assets/icons/automation_testcase.svg +4 -4
- package/src/assets/icons/back_icon.svg +3 -3
- package/src/assets/icons/backward.svg +10 -10
- package/src/assets/icons/backward_icon.svg +3 -3
- package/src/assets/icons/beautify_icon.svg +3 -3
- package/src/assets/icons/bold.svg +3 -3
- package/src/assets/icons/border_bottom.svg +3 -3
- package/src/assets/icons/border_left.svg +3 -3
- package/src/assets/icons/border_right.svg +3 -3
- package/src/assets/icons/border_top.svg +3 -3
- package/src/assets/icons/browser_stack.svg +9 -9
- package/src/assets/icons/browserstack_icon.svg +24 -24
- package/src/assets/icons/calendar_icon.svg +9 -9
- package/src/assets/icons/capture_icon.svg +2 -2
- package/src/assets/icons/check_mark.svg +3 -3
- package/src/assets/icons/chrome.svg +12 -12
- package/src/assets/icons/client_profile.svg +4 -4
- package/src/assets/icons/clock_icon.svg +11 -11
- package/src/assets/icons/clone_icon.svg +3 -3
- package/src/assets/icons/close_pill.svg +3 -3
- package/src/assets/icons/cloud_server_host_icon.svg +3 -3
- package/src/assets/icons/collapse-icon.svg +6 -6
- package/src/assets/icons/compressed_file_type.svg +4 -4
- package/src/assets/icons/continue_without_sign.svg +3 -3
- package/src/assets/icons/copy-icon.svg +3 -3
- package/src/assets/icons/csv_file_type.svg +4 -4
- package/src/assets/icons/dashboard_icon.svg +31 -31
- package/src/assets/icons/dashboard_mobile_icon.svg +47 -47
- package/src/assets/icons/dashboard_web_icon.svg +9 -9
- package/src/assets/icons/data_provider.svg +8 -8
- package/src/assets/icons/dataset_list.svg +3 -3
- package/src/assets/icons/delete.svg +3 -3
- package/src/assets/icons/delete_info.svg +17 -17
- package/src/assets/icons/details.svg +3 -3
- package/src/assets/icons/double_underline.svg +5 -5
- package/src/assets/icons/download-icon.svg +3 -3
- package/src/assets/icons/download_file_icon.svg +3 -3
- package/src/assets/icons/download_icon.svg +4 -4
- package/src/assets/icons/drag_icon.svg +4 -4
- package/src/assets/icons/drawer_maximize.svg +6 -6
- package/src/assets/icons/dropzone_icon.svg +18 -18
- package/src/assets/icons/edge.svg +30 -30
- package/src/assets/icons/edit_icon.svg +5 -5
- package/src/assets/icons/error.svg +17 -17
- package/src/assets/icons/excel_corner_menu.svg +3 -3
- package/src/assets/icons/executions_icon.svg +3 -3
- package/src/assets/icons/expand-icon.svg +6 -6
- package/src/assets/icons/export.svg +4 -4
- package/src/assets/icons/export_collection_icon.svg +13 -13
- package/src/assets/icons/eye_closed.svg +3 -3
- package/src/assets/icons/eye_open_icon.svg +3 -3
- package/src/assets/icons/failed_status_icon.svg +12 -12
- package/src/assets/icons/file.svg +11 -11
- package/src/assets/icons/fill_color.svg +7 -7
- package/src/assets/icons/filter.svg +4 -4
- package/src/assets/icons/fire_fox.svg +106 -106
- package/src/assets/icons/fireflink_finder_logo.svg +7 -7
- package/src/assets/icons/fireflink_icon.svg +4 -4
- package/src/assets/icons/fireflink_logo.svg +13 -13
- package/src/assets/icons/fireflink_platform.svg +4 -4
- package/src/assets/icons/firefox.svg +84 -84
- package/src/assets/icons/flaky_status_icon.svg +12 -12
- package/src/assets/icons/formate_painter.svg +5 -5
- package/src/assets/icons/formula_icon.svg +3 -3
- package/src/assets/icons/forward.svg +3 -3
- package/src/assets/icons/forward_icon.svg +3 -3
- package/src/assets/icons/full_access_icon.svg +4 -4
- package/src/assets/icons/gif_file_type.svg +4 -4
- package/src/assets/icons/global_variable_icon.svg +4 -4
- package/src/assets/icons/hamburger_menu.svg +3 -3
- package/src/assets/icons/hide_access_icon.svg +3 -3
- package/src/assets/icons/hide_icon.svg +9 -9
- package/src/assets/icons/history_icon.svg +19 -19
- package/src/assets/icons/html_file_type.svg +4 -4
- package/src/assets/icons/impactList.svg +6 -6
- package/src/assets/icons/import.svg +4 -4
- package/src/assets/icons/import_icon.svg +4 -0
- package/src/assets/icons/info.svg +17 -17
- package/src/assets/icons/info_icon.svg +5 -5
- package/src/assets/icons/info_user.svg +5 -5
- package/src/assets/icons/internet_explorer.svg +3 -3
- package/src/assets/icons/ipk_file_type.svg +4 -4
- package/src/assets/icons/italic.svg +3 -3
- package/src/assets/icons/jira.svg +3 -3
- package/src/assets/icons/jpg_file_type.svg +4 -4
- package/src/assets/icons/json_file_type.svg +4 -4
- package/src/assets/icons/label_icon.svg +8 -8
- package/src/assets/icons/label_plus.svg +3 -3
- package/src/assets/icons/lambda_icon.svg +3 -3
- package/src/assets/icons/left_arrow_icon.svg +3 -3
- package/src/assets/icons/license_expired.svg +20 -20
- package/src/assets/icons/license_info.svg +28 -28
- package/src/assets/icons/license_warning.svg +10 -10
- package/src/assets/icons/link_expired.svg +186 -186
- package/src/assets/icons/linked_defects.svg +11 -11
- package/src/assets/icons/linux.svg +42 -42
- package/src/assets/icons/local.svg +3 -3
- package/src/assets/icons/local_variable_icon.svg +4 -4
- package/src/assets/icons/logo.svg +17 -17
- package/src/assets/icons/mac.svg +9 -9
- package/src/assets/icons/machine_disable_icon.svg +18 -18
- package/src/assets/icons/machine_enable_icon.svg +10 -10
- package/src/assets/icons/manage_apps.svg +3 -3
- package/src/assets/icons/manual_locator.svg +7 -7
- package/src/assets/icons/manual_testcase.svg +3 -3
- package/src/assets/icons/maximize_icon.svg +5 -5
- package/src/assets/icons/maximize_script.svg +12 -12
- package/src/assets/icons/maximize_tree.svg +3 -3
- package/src/assets/icons/minimize_script.svg +5 -5
- package/src/assets/icons/mobile_icon.svg +3 -3
- package/src/assets/icons/moon_stars.svg +10 -10
- package/src/assets/icons/more.svg +10 -10
- package/src/assets/icons/move_icon.svg +5 -5
- package/src/assets/icons/ms_dynamic.svg +4 -4
- package/src/assets/icons/ms_dynamic_icon.svg +15 -15
- package/src/assets/icons/nlp_help_icon.svg +3 -3
- package/src/assets/icons/no_access_icon.svg +4 -4
- package/src/assets/icons/no_border.svg +3 -3
- package/src/assets/icons/no_data.svg +13 -13
- package/src/assets/icons/no_license_found.svg +22 -22
- package/src/assets/icons/notification_icon.svg +3 -3
- package/src/assets/icons/opera.svg +9 -9
- package/src/assets/icons/passed_status_icon.svg +12 -12
- package/src/assets/icons/pdf_file_type.svg +4 -4
- package/src/assets/icons/plus_icon.svg +11 -11
- package/src/assets/icons/plus_user_icon.svg +3 -3
- package/src/assets/icons/png_file_type.svg +4 -4
- package/src/assets/icons/project_env_variable_icon.svg +4 -4
- package/src/assets/icons/project_status_icon.svg +10 -10
- package/src/assets/icons/quick_run_setting_icon.svg +5 -5
- package/src/assets/icons/refresh-icon.svg +4 -4
- package/src/assets/icons/refresh_icon.svg +4 -4
- package/src/assets/icons/reload.svg +3 -3
- package/src/assets/icons/remove.svg +11 -11
- package/src/assets/icons/remove_user.svg +3 -3
- package/src/assets/icons/replace.svg +11 -11
- package/src/assets/icons/replace_file.svg +13 -13
- package/src/assets/icons/replace_icon.svg +6 -6
- package/src/assets/icons/reset-link.svg +52 -52
- package/src/assets/icons/right_arrow_icon.svg +4 -4
- package/src/assets/icons/rotate_icon.svg +10 -10
- package/src/assets/icons/run_automation_scripts_icon.svg +33 -33
- package/src/assets/icons/run_icon.svg +26 -26
- package/src/assets/icons/run_manual_testcase_icon.svg +4 -4
- package/src/assets/icons/safari.svg +93 -93
- package/src/assets/icons/safari_icon.svg +12 -12
- package/src/assets/icons/sales_force.svg +7 -7
- package/src/assets/icons/salesforce_icon.svg +14 -14
- package/src/assets/icons/sample_template_first.svg +29 -29
- package/src/assets/icons/sample_template_second.svg +47 -47
- package/src/assets/icons/sause_lab.svg +3 -3
- package/src/assets/icons/save_as_step.svg +3 -3
- package/src/assets/icons/search.svg +3 -3
- package/src/assets/icons/send_step.svg +4 -4
- package/src/assets/icons/skipped_status_icon.svg +12 -12
- package/src/assets/icons/standard_template.svg +30 -30
- package/src/assets/icons/strike_through.svg +3 -3
- package/src/assets/icons/success.svg +17 -17
- package/src/assets/icons/suites_icon.svg +3 -3
- package/src/assets/icons/sun_icon.svg +10 -10
- package/src/assets/icons/swipe_icon.svg +9 -9
- package/src/assets/icons/switch_license_icon.svg +123 -123
- package/src/assets/icons/system_warning.svg +61 -61
- package/src/assets/icons/tap_icon.svg +3 -3
- package/src/assets/icons/text_align_center.svg +3 -3
- package/src/assets/icons/text_align_left.svg +3 -3
- package/src/assets/icons/text_align_right.svg +3 -3
- package/src/assets/icons/text_color.svg +3 -3
- package/src/assets/icons/tick_icon.svg +4 -4
- package/src/assets/icons/toast_close.svg +3 -3
- package/src/assets/icons/txt_file_type.svg +4 -4
- package/src/assets/icons/underline.svg +4 -4
- package/src/assets/icons/update_icon.svg +3 -3
- package/src/assets/icons/user_password_lock.svg +220 -220
- package/src/assets/icons/user_profile.svg +3 -3
- package/src/assets/icons/user_warning.svg +235 -235
- package/src/assets/icons/user_with_system.svg +637 -637
- package/src/assets/icons/variable_icon.svg +4 -4
- package/src/assets/icons/vertical_separator.svg +3 -3
- package/src/assets/icons/view_access_icon.svg +4 -4
- package/src/assets/icons/view_icon.svg +3 -3
- package/src/assets/icons/warning.svg +17 -17
- package/src/assets/icons/warning_status_icon.svg +12 -12
- package/src/assets/icons/web&mobile_icon.svg +3 -3
- package/src/assets/icons/web_icon.svg +3 -3
- package/src/assets/icons/web_mobile_icon.svg +29 -29
- package/src/assets/icons/web_services_icon.svg +30 -30
- package/src/assets/icons/window_maximize.svg +3 -4
- package/src/assets/icons/window_minimize.svg +3 -3
- package/src/assets/icons/window_restore.svg +4 -0
- package/src/assets/icons/windows.svg +10 -10
- package/src/assets/icons/wrong_mark.svg +3 -3
- package/src/assets/icons/wswb_delete_icon.svg +3 -3
- package/src/assets/icons/wswb_plus_icon.svg +4 -4
- package/src/assets/icons/xls_file_type.svg +4 -4
- package/src/assets/icons/xlsx_file_type.svg +4 -4
- package/src/assets/icons/xml_file_type.svg +4 -4
- package/src/assets/styles/_colors.scss +151 -151
- package/src/assets/styles/_fonts.scss +45 -45
- package/src/assets/styles/_mixins.scss +21 -21
- package/src/assets/utils/functionUtils.ts +96 -96
- package/src/components/Accordion/Accordion.scss +46 -46
- package/src/components/Accordion/Accordion.stories.tsx +35 -35
- package/src/components/Accordion/Accordion.tsx +68 -68
- package/src/components/Accordion/index.ts +1 -1
- package/src/components/Accordion/types.ts +40 -40
- package/src/components/AddResourceButton/AddButton.scss +36 -36
- package/src/components/AddResourceButton/AddButton.stories.tsx +126 -126
- package/src/components/AddResourceButton/AddButton.tsx +121 -121
- package/src/components/AddResourceButton/ArrowsButton/ArrowsButton.scss +161 -161
- package/src/components/AddResourceButton/ArrowsButton/ArrowsButton.tsx +38 -38
- package/src/components/AddResourceButton/index.ts +1 -1
- package/src/components/AddResourceButton/type.ts +92 -92
- package/src/components/AddVariables/AddVariables.scss +14 -14
- package/src/components/AddVariables/AddVariables.stories.tsx +82 -44
- package/src/components/AddVariables/AddVariables.tsx +129 -113
- package/src/components/AddVariables/index.ts +1 -1
- package/src/components/AddVariables/types.ts +103 -36
- package/src/components/AllProjectsDropdown/AllProjectsDropdown.scss +189 -189
- package/src/components/AllProjectsDropdown/AllProjectsDropdown.stories.tsx +117 -117
- package/src/components/AllProjectsDropdown/AllProjectsDropdown.tsx +152 -152
- package/src/components/AllProjectsDropdown/types.ts +12 -12
- package/src/components/AppHeader/AppHeader.scss +215 -182
- package/src/components/AppHeader/AppHeader.stories.tsx +553 -425
- package/src/components/AppHeader/AppHeader.tsx +197 -198
- package/src/components/AppHeader/index.ts +1 -1
- package/src/components/AppHeader/types.ts +54 -52
- package/src/components/AttachImage/AttachImage.scss +76 -76
- package/src/components/AttachImage/AttachImage.stories.tsx +24 -24
- package/src/components/AttachImage/AttachImage.tsx +60 -60
- package/src/components/AttachImage/index.ts +2 -2
- package/src/components/AttachImage/types.ts +26 -26
- package/src/components/AttachmentButton/AttachmentButton.scss +9 -9
- package/src/components/AttachmentButton/AttachmentButton.stories.tsx +81 -81
- package/src/components/AttachmentButton/AttachmentButton.tsx +129 -129
- package/src/components/AttachmentButton/types.ts +13 -13
- package/src/components/Avatar/Avatar.scss +27 -27
- package/src/components/Avatar/Avatar.stories.tsx +76 -76
- package/src/components/Avatar/Avatar.tsx +41 -41
- package/src/components/Avatar/types.ts +35 -35
- package/src/components/Button/Button.scss +155 -155
- package/src/components/Button/Button.stories.tsx +81 -81
- package/src/components/Button/Button.tsx +73 -73
- package/src/components/Button/index.ts +1 -1
- package/src/components/Button/types.ts +69 -69
- package/src/components/Charts/BarChart/BarChart.scss +69 -66
- package/src/components/Charts/BarChart/BarChart.stories.tsx +67 -67
- package/src/components/Charts/BarChart/BarChart.tsx +342 -328
- package/src/components/Charts/BarChart/types.ts +12 -12
- package/src/components/Charts/DashboardDonutChart/DashboardDonutChart.scss +164 -157
- package/src/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.tsx +55 -54
- package/src/components/Charts/DashboardDonutChart/DashboardDonutChart.tsx +531 -502
- package/src/components/Charts/DashboardDonutChart/types.ts +58 -52
- package/src/components/Charts/DonutChart/DonutChart.scss +76 -76
- package/src/components/Charts/DonutChart/DonutChart.stories.tsx +30 -30
- package/src/components/Charts/DonutChart/DonutChart.tsx +246 -246
- package/src/components/Charts/DonutChart/index.ts +1 -1
- package/src/components/Charts/DonutChart/type.ts +23 -23
- package/src/components/Charts/IconRadialChart/IconRadialChart.scss +25 -25
- package/src/components/Charts/IconRadialChart/IconRadialChart.stories.tsx +51 -51
- package/src/components/Charts/IconRadialChart/IconRadialChart.tsx +173 -173
- package/src/components/Charts/IconRadialChart/types.ts +28 -28
- package/src/components/Charts/LineChart/LineChart.scss +92 -88
- package/src/components/Charts/LineChart/LineChart.stories.tsx +255 -255
- package/src/components/Charts/LineChart/LineChart.tsx +286 -282
- package/src/components/Charts/LineChart/index.ts +1 -1
- package/src/components/Charts/LineChart/types.ts +29 -29
- package/src/components/Charts/MultiRadialChart/MultiRadialChart.scss +86 -86
- package/src/components/Charts/MultiRadialChart/MultiRadialChart.stories.tsx +116 -116
- package/src/components/Charts/MultiRadialChart/MultiRadialChart.tsx +292 -292
- package/src/components/Charts/MultiRadialChart/index.ts +1 -1
- package/src/components/Charts/MultiRadialChart/types.ts +25 -25
- package/src/components/Charts/PieChart/PieChart.scss +41 -41
- package/src/components/Charts/PieChart/PieChart.stories.tsx +46 -46
- package/src/components/Charts/PieChart/PieChart.tsx +192 -192
- package/src/components/Charts/PieChart/index.ts +1 -1
- package/src/components/Charts/PieChart/types.ts +28 -28
- package/src/components/Charts/RadialChart/RadialChart.scss +16 -16
- package/src/components/Charts/RadialChart/RadialChart.stories.tsx +36 -36
- package/src/components/Charts/RadialChart/RadialChart.tsx +180 -180
- package/src/components/Charts/RadialChart/index.ts +1 -1
- package/src/components/Charts/RadialChart/types.ts +32 -32
- package/src/components/Checkbox/Checkbox.scss +146 -146
- package/src/components/Checkbox/Checkbox.stories.tsx +123 -123
- package/src/components/Checkbox/Checkbox.tsx +58 -58
- package/src/components/Checkbox/types.ts +34 -34
- package/src/components/Chip/Chip.scss +85 -85
- package/src/components/Chip/Chip.stories.tsx +116 -116
- package/src/components/Chip/Chip.tsx +35 -35
- package/src/components/Chip/index.ts +1 -1
- package/src/components/Chip/types.ts +19 -19
- package/src/components/Comment/Comments.scss +166 -166
- package/src/components/Comment/Comments.stories.tsx +212 -212
- package/src/components/Comment/Comments.tsx +51 -51
- package/src/components/Comment/comment/Comment.tsx +206 -206
- package/src/components/Comment/comment/useNode.ts +51 -51
- package/src/components/Comment/index.ts +1 -1
- package/src/components/Comment/type.ts +36 -36
- package/src/components/ConnectingBranch/BranchComponents/MachineInstances.tsx +128 -128
- package/src/components/ConnectingBranch/ConnectingBranch.scss +233 -233
- package/src/components/ConnectingBranch/ConnectingBranch.stories.tsx +21 -21
- package/src/components/ConnectingBranch/ConnectingBranch.tsx +182 -182
- package/src/components/ConnectingBranch/data.ts +137 -137
- package/src/components/ConnectingBranch/index.ts +1 -1
- package/src/components/ConnectingBranch/types.ts +21 -21
- package/src/components/CreateVariable/CreateVariableSlider.scss +18 -18
- package/src/components/CreateVariable/CreateVariableSlider.stories.tsx +66 -66
- package/src/components/CreateVariable/CreateVariableSlider.tsx +95 -95
- package/src/components/CreateVariable/index.ts +1 -1
- package/src/components/CreateVariable/types.ts +58 -58
- package/src/components/DatePicker/DatePicker.scss +413 -402
- package/src/components/DatePicker/DatePicker.stories.tsx +193 -174
- package/src/components/DatePicker/DatePicker.tsx +502 -451
- package/src/components/DatePicker/Timepicker.tsx +372 -372
- package/src/components/DatePicker/types.ts +105 -105
- package/src/components/DownloadClient/DownloadClient.scss +80 -80
- package/src/components/DownloadClient/DownloadClient.stories.tsx +26 -26
- package/src/components/DownloadClient/DownloadClient.tsx +81 -81
- package/src/components/DownloadClient/type.ts +40 -40
- package/src/components/DragAndDrop/DragAndDrop.d.ts +5 -5
- package/src/components/DragAndDrop/DragAndDrop.stories.tsx +25 -25
- package/src/components/DragAndDrop/DragAndDrop.ts +7 -7
- package/src/components/DragAndDrop/DragAndDropList.scss +69 -69
- package/src/components/DragAndDrop/DragAndDropList.tsx +151 -151
- package/src/components/Drawer/Drawer.scss +139 -139
- package/src/components/Drawer/Drawer.stories.tsx +155 -155
- package/src/components/Drawer/Drawer.tsx +232 -232
- package/src/components/Drawer/Types.ts +157 -157
- package/src/components/EditTextField/EditTextField.scss +97 -97
- package/src/components/EditTextField/EditTextField.stories.tsx +127 -127
- package/src/components/EditTextField/EditTextField.tsx +181 -181
- package/src/components/EditTextField/index.ts +1 -1
- package/src/components/EditTextField/types.ts +55 -55
- package/src/components/Editor/Editor.scss +56 -56
- package/src/components/Editor/Editor.stories.tsx +54 -54
- package/src/components/Editor/Editor.tsx +250 -250
- package/src/components/Editor/VariableDropdown.scss +27 -27
- package/src/components/Editor/VariableDropdown.tsx +57 -57
- package/src/components/Editor/constants.ts +180 -180
- package/src/components/Editor/types.ts +89 -89
- package/src/components/Excel/ColorBarSelector/ColorBarSelector.scss +15 -15
- package/src/components/Excel/ColorBarSelector/ColorBarSelector.tsx +43 -43
- package/src/components/Excel/ExcelContextMenu/ExcelContextMenu.scss +27 -27
- package/src/components/Excel/ExcelContextMenu/ExcelContextMenu.tsx +42 -42
- package/src/components/Excel/ExcelFile/ExcelFile.scss +68 -68
- package/src/components/Excel/ExcelFile/ExcelFile.tsx +491 -491
- package/src/components/Excel/ExcelFile/ExcelFileComponents/ActiveCell.tsx +131 -131
- package/src/components/Excel/ExcelFile/ExcelFileComponents/Cell.tsx +238 -238
- package/src/components/Excel/ExcelFile/ExcelFileComponents/ColumnIndicator.tsx +168 -168
- package/src/components/Excel/ExcelFile/ExcelFileComponents/Copied.tsx +25 -25
- package/src/components/Excel/ExcelFile/ExcelFileComponents/CornerIndicator.tsx +56 -56
- package/src/components/Excel/ExcelFile/ExcelFileComponents/DataEditor.tsx +37 -37
- package/src/components/Excel/ExcelFile/ExcelFileComponents/DataViewer.tsx +85 -85
- package/src/components/Excel/ExcelFile/ExcelFileComponents/FloatingRect.tsx +31 -31
- package/src/components/Excel/ExcelFile/ExcelFileComponents/HeaderRow.tsx +5 -5
- package/src/components/Excel/ExcelFile/ExcelFileComponents/Row.tsx +5 -5
- package/src/components/Excel/ExcelFile/ExcelFileComponents/RowIndicator.tsx +154 -154
- package/src/components/Excel/ExcelFile/ExcelFileComponents/Selected.tsx +32 -32
- package/src/components/Excel/ExcelFile/ExcelFileComponents/Spreadsheet.scss +146 -146
- package/src/components/Excel/ExcelFile/ExcelFileComponents/Spreadsheet.tsx +479 -479
- package/src/components/Excel/ExcelFile/ExcelFileComponents/Table.tsx +19 -19
- package/src/components/Excel/ExcelFile/ExcelFileComponents/actions.ts +548 -548
- package/src/components/Excel/ExcelFile/ExcelFileComponents/areModelsEqual.ts +18 -18
- package/src/components/Excel/ExcelFile/ExcelFileComponents/context.ts +12 -12
- package/src/components/Excel/ExcelFile/ExcelFileComponents/engine/engine.ts +153 -153
- package/src/components/Excel/ExcelFile/ExcelFileComponents/engine/formula.ts +31 -31
- package/src/components/Excel/ExcelFile/ExcelFileComponents/engine/index.ts +2 -2
- package/src/components/Excel/ExcelFile/ExcelFileComponents/engine/point-graph.ts +152 -152
- package/src/components/Excel/ExcelFile/ExcelFileComponents/engine/point-hash.ts +10 -10
- package/src/components/Excel/ExcelFile/ExcelFileComponents/engine/point-set.ts +69 -69
- package/src/components/Excel/ExcelFile/ExcelFileComponents/index.ts +49 -49
- package/src/components/Excel/ExcelFile/ExcelFileComponents/matrix.ts +382 -382
- package/src/components/Excel/ExcelFile/ExcelFileComponents/point-range.ts +82 -82
- package/src/components/Excel/ExcelFile/ExcelFileComponents/point.ts +15 -15
- package/src/components/Excel/ExcelFile/ExcelFileComponents/reducer.ts +673 -673
- package/src/components/Excel/ExcelFile/ExcelFileComponents/reducerFunctions.ts +819 -819
- package/src/components/Excel/ExcelFile/ExcelFileComponents/selection.ts +257 -257
- package/src/components/Excel/ExcelFile/ExcelFileComponents/types.ts +255 -255
- package/src/components/Excel/ExcelFile/ExcelFileComponents/typings/fast-formula-parser.d.ts +58 -58
- package/src/components/Excel/ExcelFile/ExcelFileComponents/use-dispatch.ts +8 -8
- package/src/components/Excel/ExcelFile/ExcelFileComponents/use-selector.ts +9 -9
- package/src/components/Excel/ExcelFile/ExcelFileComponents/util.ts +172 -172
- package/src/components/Excel/ExcelFile.stories.tsx +167 -167
- package/src/components/Excel/ExcelToolBar/ExcelToolBar.scss +96 -96
- package/src/components/Excel/ExcelToolBar/ExcelToolBar.tsx +397 -397
- package/src/components/Excel/Types.ts +196 -196
- package/src/components/Excel/dataConversion.ts +173 -173
- package/src/components/Excel/index.ts +1 -1
- package/src/components/ExpandableMenu/ExpandableMenu.scss +110 -110
- package/src/components/ExpandableMenu/ExpandableMenu.stories.tsx +67 -67
- package/src/components/ExpandableMenu/ExpandableMenu.tsx +101 -101
- package/src/components/ExpandableMenu/index.ts +1 -1
- package/src/components/ExpandableMenu/types.ts +34 -34
- package/src/components/FF_Captcha/Recaptcha.scss +10 -10
- package/src/components/FF_Captcha/Recaptcha.tsx +40 -40
- package/src/components/FF_Captcha/captcha.stories.tsx +40 -40
- package/src/components/FF_Captcha/types.ts +22 -22
- package/src/components/FieldSet/FieldSet.scss +10 -10
- package/src/components/FieldSet/FieldSet.stories.tsx +104 -104
- package/src/components/FieldSet/FieldSet.tsx +29 -29
- package/src/components/FieldSet/index.ts +1 -1
- package/src/components/FieldSet/types.ts +8 -8
- package/src/components/FileDropzone/Dropzone.tsx +105 -57
- package/src/components/FileDropzone/FileDropzone.scss +163 -135
- package/src/components/FileDropzone/FileDropzone.stories.tsx +219 -98
- package/src/components/FileDropzone/FileDropzone.tsx +144 -111
- package/src/components/FileDropzone/FilePreview.tsx +77 -77
- package/src/components/FileDropzone/RadioFilePreview.tsx +76 -0
- package/src/components/FileDropzone/index.ts +1 -1
- package/src/components/FileDropzone/types.ts +199 -126
- package/src/components/Form/Form.d.ts +2 -2
- package/src/components/Form/Form.scss +158 -158
- package/src/components/Form/Form.stories.tsx +508 -508
- package/src/components/Form/Form.ts +2 -2
- package/src/components/Form/Forms.tsx +41 -41
- package/src/components/Form/validation.json +29 -29
- package/src/components/GridLayout/GridLayout.scss +69 -69
- package/src/components/GridLayout/GridLayout.stories.tsx +90 -90
- package/src/components/GridLayout/GridLayout.tsx +39 -39
- package/src/components/GridLayout/GridLayoutStory.scss +25 -25
- package/src/components/GridLayout/types.ts +84 -84
- package/src/components/HighlightText/HighlightText.scss +3 -3
- package/src/components/HighlightText/HighlightText.stories.tsx +22 -22
- package/src/components/HighlightText/HighlightText.tsx +33 -33
- package/src/components/HighlightText/index.ts +1 -1
- package/src/components/HighlightText/types.ts +4 -4
- package/src/components/Icon/Icon.stories.tsx +65 -65
- package/src/components/Icon/Icon.tsx +88 -88
- package/src/components/Icon/Icons.scss +50 -50
- package/src/components/Icon/iconList.ts +494 -489
- package/src/components/Icon/index.ts +1 -1
- package/src/components/Icon/types.ts +14 -14
- package/src/components/IconButton/IconButton.scss +54 -54
- package/src/components/IconButton/IconButton.stories.tsx +34 -34
- package/src/components/IconButton/IconButton.tsx +32 -32
- package/src/components/IconButton/index.ts +1 -1
- package/src/components/IconButton/types.ts +5 -5
- package/src/components/IconRadioGroup/IconRadioGroup.scss +64 -64
- package/src/components/IconRadioGroup/IconRadioGroup.stories.tsx +108 -108
- package/src/components/IconRadioGroup/IconRadioGroup.tsx +73 -73
- package/src/components/IconRadioGroup/index.ts +1 -1
- package/src/components/IconRadioGroup/type.ts +49 -49
- package/src/components/Input/Input.scss +171 -159
- package/src/components/Input/Input.stories.tsx +141 -141
- package/src/components/Input/Input.tsx +120 -114
- package/src/components/Input/types.ts +85 -85
- package/src/components/InputWithDropdown/InputWithDropdown.scss +220 -213
- package/src/components/InputWithDropdown/InputWithDropdown.stories.tsx +169 -169
- package/src/components/InputWithDropdown/InputWithDropdown.tsx +129 -122
- package/src/components/InputWithDropdown/index.ts +1 -1
- package/src/components/InputWithDropdown/types.ts +113 -113
- package/src/components/LabelEditTextField/LabelEditTextField.scss +86 -86
- package/src/components/LabelEditTextField/LabelEditTextField.stories.tsx +192 -192
- package/src/components/LabelEditTextField/LabelEditTextField.tsx +246 -246
- package/src/components/LabelEditTextField/index.ts +1 -1
- package/src/components/LabelEditTextField/types.ts +46 -46
- package/src/components/LazyLoad/LazyLoad.d.ts +3 -3
- package/src/components/LazyLoad/LazyLoad.stories.tsx +33 -33
- package/src/components/LazyLoad/LazyLoad.ts +2 -2
- package/src/components/LazyLoad/LazyLoading.tsx +19 -19
- package/src/components/LazyLoad/index.ts +1 -1
- package/src/components/MachineInputField/MachineInputField.scss +59 -59
- package/src/components/MachineInputField/MachineInputField.stories.tsx +32 -32
- package/src/components/MachineInputField/MachineInputField.tsx +87 -87
- package/src/components/MachineInputField/index.ts +1 -1
- package/src/components/MachineInputField/types.ts +13 -13
- package/src/components/MenuOption/MenuOption.scss +97 -97
- package/src/components/MenuOption/MenuOption.stories.tsx +158 -157
- package/src/components/MenuOption/MenuOption.tsx +219 -219
- package/src/components/MenuOption/types.ts +230 -228
- package/src/components/MiniModal/MiniModal.scss +170 -170
- package/src/components/MiniModal/MiniModal.stories.tsx +735 -735
- package/src/components/MiniModal/MiniModal.tsx +344 -344
- package/src/components/MiniModal/index.ts +1 -1
- package/src/components/MiniModal/types.ts +123 -123
- package/src/components/Modal/Modal.stories.tsx +70 -70
- package/src/components/Modal/Modal.tsx +100 -100
- package/src/components/Modal/index.tsx +1 -1
- package/src/components/Modal/modal.scss +51 -51
- package/src/components/Modal/types.ts +43 -43
- package/src/components/ModulesChip/ModuleChip.scss +33 -20
- package/src/components/ModulesChip/ModuleChip.stories.tsx +41 -41
- package/src/components/ModulesChip/ModuleChip.tsx +28 -31
- package/src/components/ModulesChip/types.ts +14 -14
- package/src/components/MultiSelect/Dropdown.scss +78 -78
- package/src/components/MultiSelect/Dropdown.tsx +142 -135
- package/src/components/MultiSelect/MultiSelect.scss +246 -246
- package/src/components/MultiSelect/MultiSelect.stories.tsx +290 -287
- package/src/components/MultiSelect/MultiSelect.tsx +483 -482
- package/src/components/MultiSelect/MultiSelectTypes.ts +47 -47
- package/src/components/MultiSelect/dropdownTypes.ts +19 -19
- package/src/components/MultiSelect/index.ts +1 -1
- package/src/components/NLPInput/NLPInput.scss +246 -246
- package/src/components/NLPInput/NlpInput.stories.tsx +136 -136
- package/src/components/NLPInput/NlpInput.tsx +374 -374
- package/src/components/NLPInput/components/NlpDropDown/NlpDropDownType.ts +60 -60
- package/src/components/NLPInput/components/NlpDropDown/NlpDropdown.scss +83 -83
- package/src/components/NLPInput/components/NlpDropDown/NlpDropdown.tsx +180 -180
- package/src/components/NLPInput/index.ts +1 -1
- package/src/components/NLPInput/type.tsx +124 -124
- package/src/components/Paper/Paper.scss +13 -13
- package/src/components/Paper/Paper.stories.tsx +77 -77
- package/src/components/Paper/Paper.tsx +14 -14
- package/src/components/Paper/types.ts +19 -19
- package/src/components/PhoneInput/PhoneInput.d.ts +3 -3
- package/src/components/PhoneInput/PhoneInput.stories.tsx +95 -95
- package/src/components/PhoneInput/PhoneInput.tsx +90 -90
- package/src/components/PhoneInput/index.ts +1 -1
- package/src/components/PhoneInput/phoneInput.scss +3 -3
- package/src/components/PhoneInput/types.ts +10 -10
- package/src/components/PopUpModal/PopUpModal.scss +36 -36
- package/src/components/PopUpModal/PopUpModal.stories.tsx +67 -62
- package/src/components/PopUpModal/PopUpModal.tsx +87 -86
- package/src/components/PopUpModal/types.ts +16 -15
- package/src/components/RadioButton/RadioButton.scss +106 -106
- package/src/components/RadioButton/RadioButton.stories.tsx +43 -43
- package/src/components/RadioButton/RadioButton.tsx +41 -41
- package/src/components/RadioButton/index.ts +1 -1
- package/src/components/RadioButton/radioButtonTypes.tsx +62 -62
- package/src/components/RadioGroup/RadioGroup.scss +11 -11
- package/src/components/RadioGroup/RadioGroup.stories.tsx +150 -150
- package/src/components/RadioGroup/RadioGroup.tsx +49 -49
- package/src/components/RadioGroup/index.ts +1 -1
- package/src/components/RadioGroup/radioGroupTypes.tsx +96 -96
- package/src/components/Search/Search.scss +103 -103
- package/src/components/Search/Search.stories.tsx +45 -26
- package/src/components/Search/Search.tsx +130 -127
- package/src/components/Search/index.ts +1 -1
- package/src/components/Search/types.ts +19 -15
- package/src/components/Select/Select.scss +213 -213
- package/src/components/Select/Select.stories.tsx +355 -355
- package/src/components/Select/Select.tsx +278 -278
- package/src/components/Select/components/Dropdown.scss +61 -61
- package/src/components/Select/components/Dropdown.tsx +140 -140
- package/src/components/Select/components/types.ts +24 -24
- package/src/components/Select/index.ts +1 -1
- package/src/components/Select/types.ts +134 -134
- package/src/components/SequentialConnectingBranch/SequentialConnectingBranch.scss +128 -128
- package/src/components/SequentialConnectingBranch/SequentialConnectingBranch.stories.tsx +56 -56
- package/src/components/SequentialConnectingBranch/SequentialConnectingBranch.tsx +167 -167
- package/src/components/SequentialConnectingBranch/components/AddBrowserModal/AddBrowserModal.scss +51 -51
- package/src/components/SequentialConnectingBranch/components/AddBrowserModal/AddBrowserModal.tsx +107 -107
- package/src/components/SequentialConnectingBranch/components/AddBrowserModal/types.ts +5 -5
- package/src/components/SequentialConnectingBranch/components/Branches/Branches.scss +190 -190
- package/src/components/SequentialConnectingBranch/components/Branches/Branches.tsx +236 -236
- package/src/components/SequentialConnectingBranch/components/Branches/types.ts +25 -25
- package/src/components/SequentialConnectingBranch/components/ConnectingBranches/ConnectingBranches.scss +3 -3
- package/src/components/SequentialConnectingBranch/components/ConnectingBranches/ConnectingBranches.tsx +68 -68
- package/src/components/SequentialConnectingBranch/components/ConnectingBranches/types.ts +17 -17
- package/src/components/SequentialConnectingBranch/components/DatasetListModal/DatasetListModal.scss +31 -31
- package/src/components/SequentialConnectingBranch/components/DatasetListModal/DatasetListModal.tsx +85 -85
- package/src/components/SequentialConnectingBranch/components/DatasetListModal/types.ts +4 -4
- package/src/components/SequentialConnectingBranch/index.ts +1 -1
- package/src/components/SequentialConnectingBranch/types.ts +60 -60
- package/src/components/StateDropdown/StateDropdown.stories.tsx +104 -104
- package/src/components/StateDropdown/StateDropdown.tsx +245 -245
- package/src/components/StateDropdown/StateDropdownTypes.tsx +27 -27
- package/src/components/StatusButton/StatusButton.scss +90 -90
- package/src/components/StatusButton/StatusButton.stories.tsx +91 -91
- package/src/components/StatusButton/StatusButton.tsx +46 -46
- package/src/components/StatusButton/index.ts +1 -1
- package/src/components/StatusButton/types.ts +45 -45
- package/src/components/StatusCard/StatusCard.scss +94 -94
- package/src/components/StatusCard/StatusCard.stories.tsx +58 -58
- package/src/components/StatusCard/StatusCard.tsx +49 -49
- package/src/components/StatusCard/index.ts +1 -1
- package/src/components/StatusCard/types.ts +10 -10
- package/src/components/Table/Table.scss +117 -116
- package/src/components/Table/Table.stories.tsx +373 -373
- package/src/components/Table/Table.tsx +178 -178
- package/src/components/Table/Types.ts +124 -124
- package/src/components/Table/index.ts +1 -1
- package/src/components/TableTree/Components/TableBody.tsx +35 -35
- package/src/components/TableTree/Components/TableCell.tsx +59 -59
- package/src/components/TableTree/Components/TableHead.tsx +39 -39
- package/src/components/TableTree/Components/TableRow.tsx +37 -37
- package/src/components/TableTree/TableTree.scss +205 -205
- package/src/components/TableTree/TableTree.stories.tsx +179 -179
- package/src/components/TableTree/TableTree.tsx +245 -245
- package/src/components/TableTree/TableTreeStories.scss +22 -22
- package/src/components/TableTree/Utils/getAllChildIds.ts +12 -12
- package/src/components/TableTree/data.ts +322 -322
- package/src/components/TableTree/index.ts +1 -1
- package/src/components/TableTree/types.ts +68 -68
- package/src/components/TableWithAccordion/TableWithAccordion.scss +54 -54
- package/src/components/TableWithAccordion/TableWithAccordion.stories.tsx +94 -94
- package/src/components/TableWithAccordion/TableWithAccordion.tsx +174 -174
- package/src/components/TableWithAccordion/data.ts +36 -36
- package/src/components/TableWithAccordion/types.ts +69 -69
- package/src/components/Tabs/Tabs.scss +132 -78
- package/src/components/Tabs/Tabs.stories.tsx +153 -134
- package/src/components/Tabs/Tabs.tsx +71 -62
- package/src/components/Tabs/index.ts +1 -1
- package/src/components/Tabs/types.ts +48 -48
- package/src/components/TextArea/Textarea.scss +144 -144
- package/src/components/TextArea/Textarea.stories.tsx +92 -92
- package/src/components/TextArea/Textarea.tsx +84 -84
- package/src/components/TextArea/Types.ts +82 -82
- package/src/components/TextArea/index.tsx +1 -1
- package/src/components/ThemeProvider/ThemeProvider.tsx +27 -27
- package/src/components/ThemeProvider/index.ts +1 -1
- package/src/components/ThemeProvider/types.ts +14 -14
- package/src/components/Toast/Toast.scss +121 -121
- package/src/components/Toast/Toast.stories.tsx +144 -144
- package/src/components/Toast/Toast.tsx +117 -117
- package/src/components/Toast/index.ts +1 -1
- package/src/components/Toast/types.ts +27 -27
- package/src/components/Toastify/Toastify.stories.tsx +71 -71
- package/src/components/Toastify/Toastify.tsx +94 -94
- package/src/components/Toastify/index.ts +1 -1
- package/src/components/Toastify/types.ts +9 -9
- package/src/components/Toggle/Toggle.scss +133 -133
- package/src/components/Toggle/Toggle.stories.tsx +132 -132
- package/src/components/Toggle/Toggle.tsx +96 -96
- package/src/components/Toggle/index.ts +1 -1
- package/src/components/Toggle/types.ts +43 -43
- package/src/components/ToggleSwitch/ToggleSwitch.scss +58 -58
- package/src/components/ToggleSwitch/ToggleSwitch.stories.tsx +52 -52
- package/src/components/ToggleSwitch/ToggleSwitch.tsx +30 -30
- package/src/components/ToggleSwitch/index.ts +1 -1
- package/src/components/Tooltip/Tooltip.scss +27 -27
- package/src/components/Tooltip/Tooltip.stories.tsx +98 -98
- package/src/components/Tooltip/Tooltip.tsx +194 -194
- package/src/components/Tooltip/index.ts +1 -1
- package/src/components/Tooltip/types.ts +66 -66
- package/src/components/Typography/Typography.scss +25 -25
- package/src/components/Typography/Typography.stories.tsx +59 -59
- package/src/components/Typography/Typography.tsx +41 -41
- package/src/components/Typography/index.ts +1 -1
- package/src/components/Typography/types.ts +57 -57
- package/src/components/VariableInput/VariableInput.scss +127 -127
- package/src/components/VariableInput/VariableInput.stories.tsx +32 -32
- package/src/components/VariableInput/VariableInput.tsx +352 -352
- package/src/components/VariableInput/types.ts +56 -56
- package/src/hooks/keyboardevents/useEscKeyEvent.tsx +30 -30
- package/src/hooks/useClickOutside.tsx +30 -30
- package/src/hooks/useFileDropzone.tsx +275 -274
- package/src/hooks/usePortalPosition.tsx +53 -53
- package/src/hooks/useTheme.tsx +13 -13
- package/src/index.ts +203 -200
- package/src/utils/FormatString/FormatString.stories.tsx +58 -0
- package/src/utils/FormatString/FormatString.tsx +41 -0
- package/src/utils/TableCell/TableCell.ts +16 -16
- package/src/utils/capitalize/capitalize.stories.tsx +44 -44
- package/src/utils/capitalize/capitalize.tsx +4 -4
- package/src/utils/checkDuplicates/CheckDuplicates.stories.tsx +40 -40
- package/src/utils/checkDuplicates/checkDuplicates.ts +13 -13
- package/src/utils/checkEmpty/checkEmpty.stories.tsx +34 -34
- package/src/utils/checkEmpty/checkEmpty.ts +24 -24
- package/src/utils/compareArrays/compareArrays.stories.tsx +62 -62
- package/src/utils/compareArrays/compareArrays.ts +31 -31
- package/src/utils/compareObjects/compareObjects.stories.tsx +51 -51
- package/src/utils/compareObjects/compareObjects.ts +53 -53
- package/src/utils/debounce/debounce.stories.tsx +81 -81
- package/src/utils/debounce/debounce.ts +28 -28
- package/src/utils/downloadFile/saveFileFromBlob.stories.tsx +62 -62
- package/src/utils/downloadFile/saveFileFromBlob.ts +40 -40
- package/src/utils/ffID/ffID.stories.tsx +35 -35
- package/src/utils/ffID/ffid.ts +7 -7
- package/src/utils/findAndInsert/findAndInsert.stories.tsx +119 -119
- package/src/utils/findAndInsert/findAndInsert.ts +49 -49
- package/src/utils/getEncryptedData/getEncryptedData.stories.tsx +55 -55
- package/src/utils/getEncryptedData/getEncryptedData.ts +8 -8
- package/src/utils/getExtension/getExtension.stories.tsx +23 -23
- package/src/utils/getExtension/getExtension.ts +28 -28
- package/src/utils/getSelectOptionValue/getSelectOptionValue.ts +31 -31
- package/src/utils/getSequentialPayload/getSequentialPayload.stories.tsx +72 -72
- package/src/utils/getSequentialPayload/getSequentialPayload.ts +16 -16
- package/src/utils/getSequentialPayload/types.ts +32 -32
- package/src/utils/throttle/throttle.stories.tsx +100 -100
- package/src/utils/throttle/throttle.ts +33 -33
- package/src/utils/truncateText/truncateText.stories.tsx +37 -37
- package/src/utils/truncateText/truncateText.ts +4 -4
- package/tsconfig.json +55 -55
- package/vite.config.js +14 -14
- package/lib/StyleGuide/ColorPalette/ColorPalette.stories.d.ts +0 -6
- package/lib/StyleGuide/Typography/Typography.stories.d.ts +0 -6
- package/lib/assets/fonts/Poppins-Bold.ttf +0 -0
- package/lib/assets/fonts/Poppins-Medium.ttf +0 -0
- package/lib/assets/fonts/Poppins-Regular.ttf +0 -0
- package/lib/assets/fonts/Poppins-SemiBold.ttf +0 -0
- package/lib/components/Accordion/Accordion.stories.d.ts +0 -6
- package/lib/components/AddButton/AddButton.d.ts +0 -5
- package/lib/components/AddButton/AddButton.stories.d.ts +0 -6
- package/lib/components/AddButton/index.d.ts +0 -1
- package/lib/components/AddButton/types.d.ts +0 -4
- package/lib/components/AddResourceButton/AddButton.stories.d.ts +0 -8
- package/lib/components/AllProjectsDropdown/AllProjectsDropdown.stories.d.ts +0 -7
- package/lib/components/AppHeader/AppHeader.stories.d.ts +0 -7
- package/lib/components/AttachImage/AttachImage.stories.d.ts +0 -7
- package/lib/components/AttachmentButton/AttachmentButton.stories.d.ts +0 -9
- package/lib/components/Avatar/Avatar.stories.d.ts +0 -10
- package/lib/components/Button/Button.stories.d.ts +0 -13
- package/lib/components/Charts/BarChart/BarChart.stories.d.ts +0 -6
- package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.d.ts +0 -7
- package/lib/components/Charts/DonutChart/DonutChart.stories.d.ts +0 -6
- package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts +0 -8
- package/lib/components/Charts/LineChart/LineChart.stories.d.ts +0 -7
- package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts +0 -8
- package/lib/components/Charts/PieChart/PieChart.stories.d.ts +0 -7
- package/lib/components/Charts/RadialChart/RadialChart.stories.d.ts +0 -6
- package/lib/components/Checkbox/Checkbox.stories.d.ts +0 -8
- package/lib/components/Chip/Chip.stories.d.ts +0 -14
- package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts +0 -6
- package/lib/components/DatePicker/DatePicker.stories.d.ts +0 -9
- package/lib/components/DragAndDrop/DragAndDrop.stories.d.ts +0 -6
- package/lib/components/Drawer/Drawer.stories.d.ts +0 -12
- package/lib/components/EditTextField/EditTextField.stories.d.ts +0 -10
- package/lib/components/Editor/Editor.stories.d.ts +0 -6
- package/lib/components/Excel/ContextMenu/ContextMenu.d.ts +0 -4
- package/lib/components/Excel/ExcelFile.stories.d.ts +0 -6
- package/lib/components/ExcelFile/ChangeExcelStyles.d.ts +0 -14
- package/lib/components/ExcelFile/ColorBarSelector/ColorBarSelector.d.ts +0 -8
- package/lib/components/ExcelFile/ContextMenu/ContextMenu.d.ts +0 -4
- package/lib/components/ExcelFile/ExcelFile/Excel/ActiveCell.d.ts +0 -7
- package/lib/components/ExcelFile/ExcelFile/Excel/Cell.d.ts +0 -4
- package/lib/components/ExcelFile/ExcelFile/Excel/ColumnIndicator.d.ts +0 -5
- package/lib/components/ExcelFile/ExcelFile/Excel/Copied.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/CornerIndicator.d.ts +0 -5
- package/lib/components/ExcelFile/ExcelFile/Excel/DataEditor.d.ts +0 -5
- package/lib/components/ExcelFile/ExcelFile/Excel/DataViewer.d.ts +0 -8
- package/lib/components/ExcelFile/ExcelFile/Excel/FloatingRect.d.ts +0 -10
- package/lib/components/ExcelFile/ExcelFile/Excel/HeaderRow.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/Row.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/RowIndicator.d.ts +0 -5
- package/lib/components/ExcelFile/ExcelFile/Excel/Selected.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/Spreadsheet.d.ts +0 -80
- package/lib/components/ExcelFile/ExcelFile/Excel/Table.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/actions.d.ts +0 -174
- package/lib/components/ExcelFile/ExcelFile/Excel/areModelsEqual.d.ts +0 -1
- package/lib/components/ExcelFile/ExcelFile/Excel/context.d.ts +0 -8
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/engine.d.ts +0 -22
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/formula.d.ts +0 -17
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/index.d.ts +0 -2
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-graph.d.ts +0 -21
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-hash.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-set.d.ts +0 -24
- package/lib/components/ExcelFile/ExcelFile/Excel/index.d.ts +0 -13
- package/lib/components/ExcelFile/ExcelFile/Excel/matrix.d.ts +0 -67
- package/lib/components/ExcelFile/ExcelFile/Excel/point-range.d.ts +0 -22
- package/lib/components/ExcelFile/ExcelFile/Excel/point.d.ts +0 -11
- package/lib/components/ExcelFile/ExcelFile/Excel/reducer.d.ts +0 -27
- package/lib/components/ExcelFile/ExcelFile/Excel/selection.d.ts +0 -95
- package/lib/components/ExcelFile/ExcelFile/Excel/types.d.ts +0 -178
- package/lib/components/ExcelFile/ExcelFile/Excel/use-dispatch.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/use-selector.d.ts +0 -3
- package/lib/components/ExcelFile/ExcelFile/Excel/util.d.ts +0 -44
- package/lib/components/ExcelFile/ExcelFile/ExcelFile.d.ts +0 -19
- package/lib/components/ExcelFile/ExcelFile.stories.d.ts +0 -6
- package/lib/components/ExcelFile/ExcelSheetBar/ExcelSheetBar.d.ts +0 -12
- package/lib/components/ExcelFile/ExcelToolBar/ExcelToolBar.d.ts +0 -15
- package/lib/components/ExcelFile/ImportExcelStyles.d.ts +0 -24
- package/lib/components/ExcelFile/Types.d.ts +0 -129
- package/lib/components/ExcelFile/index.d.ts +0 -1
- package/lib/components/ExpandableMenu/ExpandableMenu.stories.d.ts +0 -7
- package/lib/components/FF_Captcha/captcha.stories.d.ts +0 -8
- package/lib/components/FileDropzone/FileDropzone.stories.d.ts +0 -8
- package/lib/components/Form/Form.stories.d.ts +0 -7
- package/lib/components/GridLayout/GridLayout.stories.d.ts +0 -8
- package/lib/components/HighlightText/HighlightText.stories.d.ts +0 -6
- package/lib/components/Icon/Icon.stories.d.ts +0 -8
- package/lib/components/IconButton/IconButton.stories.d.ts +0 -7
- package/lib/components/IconRadioGroup/IconRadioGroup.stories.d.ts +0 -7
- package/lib/components/Input/Input.stories.d.ts +0 -9
- package/lib/components/InputWithDropdown/InputWithDropdown.stories.d.ts +0 -9
- package/lib/components/LabelEditTextField/LabelEditTextField.stories.d.ts +0 -13
- package/lib/components/LazyLoad/LazyLoad.stories.d.ts +0 -6
- package/lib/components/MachineInputField/MachineInputField.stories.d.ts +0 -6
- package/lib/components/MenuOption/MenuOption.stories.d.ts +0 -16
- package/lib/components/MiniModal/MiniModal.stories.d.ts +0 -10
- package/lib/components/Modal/Modal.stories.d.ts +0 -7
- package/lib/components/ModulesChip/ModuleChip.stories.d.ts +0 -6
- package/lib/components/MultiSelect/MultiSelect.stories.d.ts +0 -11
- package/lib/components/NLPInput/NlpInput.stories.d.ts +0 -7
- package/lib/components/Paper/Paper.stories.d.ts +0 -11
- package/lib/components/RadioButton/RadioButton.stories.d.ts +0 -10
- package/lib/components/RadioGroup/RadioGroup.stories.d.ts +0 -9
- package/lib/components/Search/Search.stories.d.ts +0 -6
- package/lib/components/Select/Select.stories.d.ts +0 -14
- package/lib/components/Select/components/Dropdown/Dropdown.d.ts +0 -4
- package/lib/components/Select/components/Dropdown/dropdownTypes.d.ts +0 -17
- package/lib/components/SequentialConnectingBranch/SequentialConnectingBranch.stories.d.ts +0 -6
- package/lib/components/StateDropdown/StateDropdown.stories.d.ts +0 -10
- package/lib/components/StatusButton/StatusButton.stories.d.ts +0 -14
- package/lib/components/StatusCard/StatusCard.stories.d.ts +0 -11
- package/lib/components/Table/Table.stories.d.ts +0 -13
- package/lib/components/TableTree/TableTree.stories.d.ts +0 -7
- package/lib/components/Tabs/Tabs.stories.d.ts +0 -9
- package/lib/components/TextArea/Textarea.stories.d.ts +0 -9
- package/lib/components/Toast/Toast.stories.d.ts +0 -6
- package/lib/components/Toastify/Toastify.stories.d.ts +0 -6
- package/lib/components/Toggle/Toggle.stories.d.ts +0 -12
- package/lib/components/Tooltip/Tooltip.stories.d.ts +0 -15
- package/lib/components/Typography/Typography.stories.d.ts +0 -10
- package/lib/components/VariableInput/VariableInput.stories.d.ts +0 -6
- package/lib/utils/checkEmpty/checkEmpty.stories.d.ts +0 -6
- package/lib/utils/compareArrays/compareArrays.stories.d.ts +0 -6
- package/lib/utils/compareObjects/compareObjects.stories.d.ts +0 -6
- package/lib/utils/debounce/debounce.stories.d.ts +0 -6
- package/lib/utils/ffID/ffID.stories.d.ts +0 -6
- package/lib/utils/find/findAndInsert.d.ts +0 -7
- package/lib/utils/find/findAndInsert.stories.d.ts +0 -7
- package/lib/utils/findAndInsert/findAndInsert.stories.d.ts +0 -7
- package/lib/utils/getEncryptedData/getEncryptedData.stories.d.ts +0 -6
- package/lib/utils/getExtension/getExtension.stories.d.ts +0 -6
- package/lib/utils/getSequentialPayload/getSequentialPayload.stories.d.ts +0 -10
- package/lib/utils/throttle/throttle.stories.d.ts +0 -6
- package/lib/utils/truncateText/truncateText.stories.d.ts +0 -6
package/lib/index.esm.js
CHANGED
@@ -351,7 +351,9 @@ const SvgForwardIcon = (props) => /* @__PURE__ */ React.createElement("svg", { w
|
|
351
351
|
|
352
352
|
const SvgReload = (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: "M13.6483 2.35282C12.4042 1.10288 10.7824 0.299891 9.03527 0.0688652C7.28812 -0.16216 5.51372 0.191745 3.98832 1.07548C2.46292 1.95921 1.27213 3.32318 0.601357 4.95502C-0.0694201 6.58686 -0.182542 8.395 0.279602 10.0979C0.741747 11.8008 1.75322 13.3029 3.15655 14.3704C4.55988 15.4378 6.2763 16.0107 8.03858 15.9998C9.80085 15.989 11.5101 15.3949 12.9002 14.3102C14.2902 13.2255 15.2831 11.7111 15.7243 10.0026H13.6483C13.2813 11.0382 12.6372 11.953 11.7862 12.6469C10.9352 13.3408 9.91013 13.7871 8.82296 13.9372C7.73579 14.0872 6.62836 13.9351 5.62165 13.4976C4.61494 13.0601 3.74769 12.3539 3.11465 11.4562C2.48161 10.5586 2.10714 9.50398 2.03214 8.40764C1.95715 7.3113 2.18451 6.21541 2.6894 5.2397C3.19429 4.264 3.95728 3.44601 4.89501 2.87511C5.83273 2.30422 6.90912 2.00238 8.00656 2.00257C8.79185 2.00381 9.569 2.16189 10.2925 2.46754C11.0161 2.77319 11.6715 3.22027 12.2203 3.78264L9.00446 7.00695H16V0.00205947L13.6483 2.35282Z", fill: "currentColor" }));
|
353
353
|
|
354
|
-
const SvgWindowMaximize = (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: "
|
354
|
+
const SvgWindowMaximize = (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: "M2.13379 0H13.8662C14.4317 0.00137864 14.9737 0.229908 15.3735 0.635605C15.7734 1.0413 15.9986 1.59115 16 2.16489V13.8351C15.9986 14.4089 15.7734 14.9587 15.3735 15.3644C14.9737 15.7701 14.4317 15.9986 13.8662 16H2.13379C1.56829 15.9986 1.02634 15.7701 0.626474 15.3644C0.226604 14.9587 0.00135883 14.4089 0 13.8351V2.16489C0.00135883 1.59115 0.226604 1.0413 0.626474 0.635605C1.02634 0.229908 1.56829 0.00137864 2.13379 0ZM2.13379 13.8334H13.8662V2.16489H2.13379V13.8334Z", fill: "currentColor" }));
|
355
|
+
|
356
|
+
const SvgWindowRestore = (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: "M4.58189 0H14.2429C14.7086 0.00113232 15.1548 0.188831 15.4841 0.522043C15.8134 0.855255 15.9989 1.30686 16 1.7781V11.3632C15.9989 11.8345 15.8134 12.2861 15.4841 12.6193C15.1548 12.9525 14.7086 13.1402 14.2429 13.1413H4.58189C4.11623 13.1402 3.66997 12.9525 3.3407 12.6193C3.01143 12.2861 2.82595 11.8345 2.82483 11.3632V1.7781C2.82595 1.30686 3.01143 0.855255 3.3407 0.522043C3.66997 0.188831 4.11623 0.00113232 4.58189 0ZM4.58189 11.3618H14.2429V1.7781H4.58189V11.3618Z", fill: "currentColor" }), /* @__PURE__ */ React.createElement("path", { d: "M1.75706 2.85889H11.4181C11.8837 2.86002 12.33 3.04772 12.6593 3.38093C12.9885 3.71414 13.174 4.16575 13.1751 4.63698V14.2221C13.174 14.6933 12.9885 15.145 12.6593 15.4782C12.33 15.8114 11.8837 15.9991 11.4181 16.0002H1.75706C1.2914 15.9991 0.845138 15.8114 0.515867 15.4782C0.186597 15.145 0.00111893 14.6933 0 14.2221V4.63698C0.00111893 4.16575 0.186597 3.71414 0.515867 3.38093C0.845138 3.04772 1.2914 2.86002 1.75706 2.85889ZM1.75706 14.2207H11.4181V4.63698H1.75706V14.2207Z", fill: "currentColor" }));
|
355
357
|
|
356
358
|
const SvgWindowMinimize = (props) => /* @__PURE__ */ React.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 4", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M14.5008 0H1.5008C1.10276 0 0.721029 0.158121 0.439574 0.439575C0.15812 0.72103 0 1.10276 0 1.5008L0 2.5008C0 2.89884 0.15812 3.28057 0.439574 3.56203C0.721029 3.84348 1.10276 4.0016 1.5008 4.0016H14.5008C14.8986 4.00117 15.2799 3.84287 15.561 3.56146C15.8421 3.28005 16 2.89856 16 2.5008V1.5008C16 1.10304 15.8421 0.721548 15.561 0.44014C15.2799 0.158731 14.8986 0.000424051 14.5008 0Z", fill: "currentColor" }));
|
357
359
|
|
@@ -605,6 +607,8 @@ const SvgSuitesIcon = (props) => /* @__PURE__ */ React.createElement("svg", { wi
|
|
605
607
|
|
606
608
|
const SvgExecutionsIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M7.42014 8.97643C7.46283 8.90515 7.43976 8.81322 7.36892 8.77079L7.36865 8.77063C7.29803 8.72803 7.20609 8.75093 7.16353 8.8218L7.16352 8.82182L6.57195 9.8062L6.48624 9.94883L6.40053 9.8062L5.80905 8.82196L7.42014 8.97643ZM7.42014 8.97643L6.69178 10.1882L6.66082 10.2397L6.69178 10.2912L7.4202 11.5034C7.4202 11.5034 7.42021 11.5034 7.42021 11.5034C7.46274 11.5742 7.43983 11.6661 7.36892 11.7086L7.36827 11.709C7.34457 11.7234 7.31833 11.7303 7.29187 11.7303C7.2409 11.7303 7.19165 11.7044 7.16355 11.6576L7.16352 11.6576L6.57195 10.6732L6.48624 10.5305L6.40053 10.6732L5.80896 11.6576L5.80893 11.6576C5.7809 11.7043 5.7314 11.7303 5.6803 11.7303C5.65428 11.7303 5.62788 11.7235 5.60361 11.7088L5.60325 11.7086C5.53234 11.6661 5.50943 11.5742 5.55195 11.5034C5.55196 11.5034 5.55196 11.5034 5.55197 11.5034L6.28039 10.2912L6.31135 10.2397L6.28039 10.1882L5.55203 8.97643C5.55202 8.97642 5.55202 8.97642 5.55202 8.97641C5.50934 8.90513 5.53242 8.81321 5.60325 8.77079L5.60351 8.77063C5.67402 8.7281 5.76603 8.75082 5.80896 8.82182L7.42014 8.97643ZM10.8504 1.00273L10.8504 1.00273C10.785 0.937312 10.6962 0.9 10.6031 0.9H5.35437C4.07756 0.9 3.03905 1.93885 3.03905 3.21563V7.50031H1.19468C0.763824 7.50031 0.413428 7.85071 0.413428 8.28156V12.1978C0.413428 12.6287 0.763824 12.9791 1.19468 12.9791H3.03905V14.7844C3.03905 16.0611 4.07756 17.1 5.35437 17.1H13.2712C14.548 17.1 15.5866 16.0611 15.5866 14.7844V5.88469C15.5866 5.79207 15.5499 5.70284 15.4841 5.63711L10.8504 1.00273ZM3.45343 10.2422H3.35343V10.3422V11.3306V11.4306H3.45343H4.81405C4.89703 11.4306 4.96405 11.4978 4.96405 11.5803C4.96405 11.6632 4.89695 11.7303 4.81405 11.7303H3.20374C3.12084 11.7303 3.05374 11.6632 3.05374 11.5803V8.89906C3.05374 8.81617 3.12084 8.74906 3.20374 8.74906H4.81405C4.89695 8.74906 4.96405 8.81617 4.96405 8.89906C4.96405 8.98156 4.89703 9.04875 4.81405 9.04875H3.45343H3.35343V9.14875V9.8425V9.9425H3.45343H4.70343C4.78601 9.9425 4.85312 10.0096 4.85312 10.0922C4.85312 10.1752 4.78593 10.2422 4.70343 10.2422H3.45343ZM5.46624 9.02781C5.3953 8.90938 5.43343 8.75594 5.55187 8.685C5.66999 8.61375 5.82343 8.65219 5.89468 8.77031L5.46624 9.02781ZM8.49999 10.2422H8.39999V10.3422V11.3306V11.4306H8.49999H9.86062C9.94359 11.4306 10.0106 11.4978 10.0106 11.5803C10.0106 11.6632 9.94351 11.7303 9.86062 11.7303H8.2503C8.16741 11.7303 8.1003 11.6632 8.1003 11.5803V8.89906C8.1003 8.81617 8.16741 8.74906 8.2503 8.74906H9.86062C9.94351 8.74906 10.0106 8.81617 10.0106 8.89906C10.0106 8.98156 9.94359 9.04875 9.86062 9.04875H8.49999H8.39999V9.14875V9.8425V9.9425H8.49999H9.74999C9.83257 9.9425 9.89968 10.0096 9.89968 10.0922C9.89968 10.1752 9.83249 10.2422 9.74999 10.2422H8.49999ZM14.8869 14.7844C14.8869 15.6754 14.1619 16.4003 13.2712 16.4003H5.35437C4.46367 16.4003 3.73874 15.6754 3.73874 14.7844V12.9791H11.8697C12.3005 12.9791 12.6509 12.6287 12.6509 12.1978V8.28156C12.6509 7.85071 12.3005 7.50031 11.8697 7.50031H3.73874V3.21563C3.73874 2.32459 4.46367 1.59969 5.35437 1.59969H10.2531V5.38406C10.2531 5.85293 10.634 6.23438 11.1025 6.23438H14.8869V14.7844Z", fill: "currentColor", stroke: "currentColor", strokeWidth: 0.2 }));
|
607
609
|
|
610
|
+
const SvgImportIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10.6006 9.17662L6.68843 12.5781V11.1817C6.68843 11.1128 6.6324 11.0567 6.56343 11.0567H1.37695V7.29659H6.56343C6.63246 7.29659 6.68843 7.24065 6.68843 7.17159V5.77518L10.6006 9.17662ZM14.9394 1.55273L16.4502 3.06355H14.9394V1.55273Z", fill: "currentColor", stroke: "currentColor", strokeWidth: 0.2 }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.3145 4.21158H7.23353C7.09525 4.21158 6.98337 4.0997 6.98337 3.96158C6.98337 3.82389 7.09525 3.71173 7.23353 3.71173H12.3144C12.4526 3.71173 12.5644 3.82392 12.5644 3.96158C12.5645 4.0997 12.4526 4.21158 12.3145 4.21158ZM14.5616 14.3913C14.5616 14.5295 14.4494 14.6414 14.3116 14.6414H7.23353C7.09525 14.6414 6.98337 14.5295 6.98337 14.3913C6.98337 14.2536 7.09525 14.1413 7.23353 14.1413H14.3116C14.4494 14.1413 14.5616 14.2536 14.5616 14.3913ZM14.5616 12.3054C14.5616 12.4435 14.4494 12.5554 14.3116 12.5554H8.68625C8.54812 12.5554 8.43625 12.4435 8.43625 12.3054C8.43625 12.1676 8.54812 12.0554 8.68625 12.0554H14.3116C14.4494 12.0554 14.5616 12.1676 14.5616 12.3054ZM14.5616 8.13343C14.5616 8.27171 14.4494 8.38359 14.3116 8.38359H11.2879C11.1498 8.38359 11.0379 8.27171 11.0379 8.13343C11.0379 7.99574 11.1498 7.88355 11.2879 7.88355H14.3116C14.4494 7.88355 14.5616 7.99574 14.5616 8.13343ZM14.5616 10.2194C14.5616 10.3575 14.4494 10.4694 14.3116 10.4694H11.2879C11.1498 10.4694 11.0379 10.3575 11.0379 10.2194C11.0379 10.0817 11.1498 9.9694 11.2879 9.9694H14.3116C14.4494 9.9694 14.5616 10.0817 14.5616 10.2194ZM14.5616 6.04758C14.5616 6.18571 14.4494 6.29758 14.3116 6.29758H8.68625C8.54812 6.29758 8.43625 6.18571 8.43625 6.04758C8.43625 5.90974 8.54812 5.79758 8.68625 5.79758H14.3116C14.4494 5.79755 14.5616 5.90974 14.5616 6.04758ZM5.04287 16.501H16.5019V3.43842H14.8144C14.6763 3.43842 14.5644 3.3267 14.5644 3.18858V1.50101H5.04287V6.92158H6.31356V5.5007C6.31356 5.40295 6.37062 5.3138 6.45978 5.27324C6.54881 5.23255 6.65346 5.24789 6.72718 5.3123L10.955 8.98796C11.0097 9.03543 11.041 9.10412 11.041 9.17665C11.041 9.24887 11.0097 9.31787 10.955 9.36549L6.72718 13.041C6.6809 13.0814 6.62253 13.1026 6.56312 13.1026C6.52818 13.1026 6.49281 13.0951 6.45978 13.0801C6.37059 13.0395 6.31356 12.9503 6.31356 12.8526V11.4316H5.04287V16.501ZM1.50195 7.42158V10.9317H6.56343C6.70125 10.9317 6.81343 11.0436 6.81343 11.1817V12.3038L10.4101 9.17665L6.81343 6.04949V7.17158C6.81343 7.30986 6.70125 7.42158 6.56343 7.42158H1.50195ZM15.0644 1.85448L16.1485 2.93851H15.0644V1.85448ZM16.9288 3.01195L14.991 1.0741C14.9441 1.02723 14.8806 1.00098 14.8144 1.00098H4.79287C4.65474 1.00098 4.54287 1.11285 4.54287 1.25098V6.92155H1.25195C1.11383 6.92155 1.00195 7.03343 1.00195 7.17155V11.1817C1.00195 11.3198 1.11383 11.4315 1.25195 11.4315H4.54287V16.751C4.54287 16.8891 4.65474 17.001 4.79287 17.001H16.752C16.8901 17.001 17.002 16.8891 17.002 16.751V3.18854C17.002 3.12223 16.9757 3.05882 16.9288 3.01195Z", fill: "currentColor", stroke: "currentColor", strokeWidth: 0.2 }));
|
611
|
+
|
608
612
|
let Components = {};
|
609
613
|
Components['success'] = SvgSuccess;
|
610
614
|
Components['alert'] = SvgAlert;
|
@@ -730,6 +734,7 @@ Components['backward_icon'] = SvgBackwardIcon;
|
|
730
734
|
Components['forward_icon'] = SvgForwardIcon;
|
731
735
|
Components['reload'] = SvgReload;
|
732
736
|
Components['window_maximize'] = SvgWindowMaximize;
|
737
|
+
Components['window_restore'] = SvgWindowRestore;
|
733
738
|
Components['window_minimize'] = SvgWindowMinimize;
|
734
739
|
Components['hamburger_menu'] = SvgHamburgerMenu;
|
735
740
|
Components['app_switch'] = SvgAppSwitch;
|
@@ -844,6 +849,7 @@ Components['machine_enable_icon'] = SvgMachineEnableIcon;
|
|
844
849
|
Components['machine_disable_icon'] = SvgMachineDisableIcon;
|
845
850
|
Components['executions_icon'] = SvgExecutionsIcon;
|
846
851
|
Components['suites_icon'] = SvgSuitesIcon;
|
852
|
+
Components['import_icon'] = SvgImportIcon;
|
847
853
|
|
848
854
|
var css_248z$1f = ".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}";
|
849
855
|
styleInject(css_248z$1f);
|
@@ -1022,7 +1028,7 @@ function useEscapeKey(key) {
|
|
1022
1028
|
};
|
1023
1029
|
}
|
1024
1030
|
|
1025
|
-
var css_248z$1c = ":root {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\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: #575757;\n --ff-chip-bg: #ffffff;\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 --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_expireSoon_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: #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 --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, #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 --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n:root {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\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: #575757;\n --ff-chip-bg: #ffffff;\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 --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 --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --license_expireSoon_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 --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 --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n.ff-light-theme {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\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: #575757;\n --ff-chip-bg: #ffffff;\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 --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_expireSoon_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: #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 --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, #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 --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n.ff-dark-theme {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\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: #575757;\n --ff-chip-bg: #ffffff;\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 --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 --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --license_expireSoon_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 --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 --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}";
|
1031
|
+
var css_248z$1c = ":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: #575757;\n --ff-chip-bg: #ffffff;\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 --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_expireSoon_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: #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 --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, #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}\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: #575757;\n --ff-chip-bg: #ffffff;\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 --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 --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --license_expireSoon_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 --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}\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: #575757;\n --ff-chip-bg: #ffffff;\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 --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_expireSoon_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: #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 --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, #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}\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: #575757;\n --ff-chip-bg: #ffffff;\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 --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 --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --disabled-primary-color: #f9f9f9;\n --license_expireSoon_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 --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}";
|
1026
1032
|
styleInject(css_248z$1c);
|
1027
1033
|
|
1028
1034
|
const ThemeContext = /*#__PURE__*/createContext$1(undefined);
|
@@ -1548,9 +1554,10 @@ const Dropdown$2 = /*#__PURE__*/forwardRef(({
|
|
1548
1554
|
dropdownPosition = {},
|
1549
1555
|
zIndex,
|
1550
1556
|
withSelectButton,
|
1551
|
-
labelAccessor
|
1557
|
+
labelAccessor = 'label',
|
1558
|
+
valueAccessor = 'value'
|
1552
1559
|
}, ref) => {
|
1553
|
-
const filteredOptions = options ? options.filter(option =>
|
1560
|
+
const filteredOptions = options ? options.filter(option => getValue$1(option, valueAccessor)?.toLowerCase().includes(searchedKeyword.toLowerCase())) : [];
|
1554
1561
|
const {
|
1555
1562
|
verticalMargin,
|
1556
1563
|
optionHeight,
|
@@ -1560,6 +1567,12 @@ const Dropdown$2 = /*#__PURE__*/forwardRef(({
|
|
1560
1567
|
e.stopPropagation();
|
1561
1568
|
handleOptionChange({}, false);
|
1562
1569
|
};
|
1570
|
+
const renderOption = (info, labelAccessor) => {
|
1571
|
+
if (typeof info[labelAccessor] === 'string') {
|
1572
|
+
return truncateText(getLabel(info, labelAccessor), 25);
|
1573
|
+
}
|
1574
|
+
return info[labelAccessor];
|
1575
|
+
};
|
1563
1576
|
const topPosition = useMemo(() => {
|
1564
1577
|
let calculatedDropdownHeight = Math.min(filteredOptions.length * optionHeight, maxDropdownHeight);
|
1565
1578
|
if (filteredOptions.length < 5 && withSelectButton) {
|
@@ -1609,10 +1622,10 @@ const Dropdown$2 = /*#__PURE__*/forwardRef(({
|
|
1609
1622
|
disabled: info?.isDisabled
|
1610
1623
|
}), jsx(Tooltip, {
|
1611
1624
|
zIndex: zIndex + 1,
|
1612
|
-
title: getLabel(info, labelAccessor)
|
1625
|
+
title: typeof info[labelAccessor] === 'string' && getLabel(info, labelAccessor)?.length > 25 ? getLabel(info, labelAccessor) : '',
|
1613
1626
|
children: jsx(Typography, {
|
1614
1627
|
className: "dropdown-option-label",
|
1615
|
-
children:
|
1628
|
+
children: renderOption(info, labelAccessor)
|
1616
1629
|
})
|
1617
1630
|
})]
|
1618
1631
|
}, getLabel(info, labelAccessor)))
|
@@ -1646,7 +1659,7 @@ const ChipElement = ({
|
|
1646
1659
|
fontSize: 10,
|
1647
1660
|
lineHeight: '14px',
|
1648
1661
|
className: "stye",
|
1649
|
-
children: truncateText(label, 25)
|
1662
|
+
children: typeof label === 'string' ? truncateText(label, 25) : label
|
1650
1663
|
})
|
1651
1664
|
})
|
1652
1665
|
}), !disableChip && jsx(Icon, {
|
@@ -1678,8 +1691,8 @@ const MultiSelect = ({
|
|
1678
1691
|
className = '',
|
1679
1692
|
highlightedMachine = '',
|
1680
1693
|
onSelectButtonClick = () => {},
|
1681
|
-
labelAccessor = '',
|
1682
|
-
valueAccessor =
|
1694
|
+
labelAccessor = 'label',
|
1695
|
+
valueAccessor = 'value',
|
1683
1696
|
withSelectButton = variant === 'machines' ? true : false,
|
1684
1697
|
onEnter = () => {}
|
1685
1698
|
}) => {
|
@@ -1785,7 +1798,7 @@ const MultiSelect = ({
|
|
1785
1798
|
setSearchedKeyword(input);
|
1786
1799
|
onSearch?.(input);
|
1787
1800
|
if (input.length > 2) {
|
1788
|
-
const matchedOption = allOptions.find(option => getLabel(option,
|
1801
|
+
const matchedOption = allOptions.find(option => getLabel(option, valueAccessor)?.toLowerCase() === input.toLowerCase());
|
1789
1802
|
setDisplayIcon(!matchedOption);
|
1790
1803
|
} else {
|
1791
1804
|
setDisplayIcon(false);
|
@@ -1835,9 +1848,9 @@ const MultiSelect = ({
|
|
1835
1848
|
};
|
1836
1849
|
}, [isOpen]);
|
1837
1850
|
useEffect(() => {
|
1838
|
-
if (!checkEmpty(options
|
1851
|
+
if (!checkEmpty(options)) {
|
1839
1852
|
let initializeOptions = options;
|
1840
|
-
if (!checkEmpty(selectedOptions
|
1853
|
+
if (!checkEmpty(selectedOptions)) {
|
1841
1854
|
initializeOptions = options.map(option => ({
|
1842
1855
|
...option,
|
1843
1856
|
isChecked: selectedOptions.some(selectedOption => getValue$1(selectedOption, valueAccessor) === getValue$1(option, valueAccessor))
|
@@ -2253,7 +2266,7 @@ const Chip = ({
|
|
2253
2266
|
});
|
2254
2267
|
};
|
2255
2268
|
|
2256
|
-
var css_248z$11 = ".fontXs, .ff-input-container .ff-input::placeholder, .ff-input-container .ff-input-label-container::placeholder, .ff-input-container:focus-within .ff-input-label-container, .ff-input-container .ff-input-message {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-input-container .ff-input, .ff-input-container .ff-input-label-container {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-input-container {\n display: flex;\n flex-direction: column;\n position: relative;\n}\n.ff-input-container .ff-input, .ff-input-container .ff-input-label-container {\n padding: 6px 8px;\n border: 1px solid var(--input-default-border-color);\n border-radius: 4px;\n outline: none;\n line-height: 18px;\n}\n.ff-input-container .ff-input--medium {\n padding: 10px 9px;\n}\n.ff-input-container .ff-input:disabled, .ff-input-container .ff-input-label-container:disabled {\n cursor: not-allowed;\n}\n.ff-input-container .ff-input::placeholder, .ff-input-container .ff-input-label-container::placeholder {\n opacity: 0;\n line-height: 15px;\n}\n.ff-input-
|
2269
|
+
var css_248z$11 = ".fontXs, .ff-input-fieldset .ff-input-container .ff-input::placeholder, .ff-input-fieldset .ff-input-container .ff-input-label-container::placeholder, .ff-input-fieldset .ff-input-container:focus-within .ff-input-label-container, .ff-input-fieldset .ff-input-container .ff-input-message {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-input-fieldset .ff-input-container .ff-input, .ff-input-fieldset .ff-input-container .ff-input-label-container {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-input-fieldset {\n display: inline-block;\n border: none;\n padding: 0;\n margin: 0;\n width: 100%;\n}\n.ff-input-fieldset--disabled {\n border: 1px solid var(--input-default-border-color);\n background: var(--input-disabled-background-color);\n border-radius: 4px;\n opacity: 0.5;\n}\n.ff-input-fieldset .ff-input-container {\n display: flex;\n flex-direction: column;\n position: relative;\n}\n.ff-input-fieldset .ff-input-container .ff-input, .ff-input-fieldset .ff-input-container .ff-input-label-container {\n padding: 6px 8px;\n border: 1px solid var(--input-default-border-color);\n border-radius: 4px;\n outline: none;\n line-height: 18px;\n}\n.ff-input-fieldset .ff-input-container .ff-input--medium {\n padding: 10px 9px;\n}\n.ff-input-fieldset .ff-input-container .ff-input:disabled, .ff-input-fieldset .ff-input-container .ff-input-label-container:disabled {\n cursor: not-allowed;\n border: none;\n background: transparent;\n}\n.ff-input-fieldset .ff-input-container .ff-input::placeholder, .ff-input-fieldset .ff-input-container .ff-input-label-container::placeholder {\n opacity: 0;\n line-height: 15px;\n}\n.ff-input-fieldset .ff-input-container .ff-input--danger {\n border-color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container .ff-input--transparentBackground {\n background: transparent;\n}\n.ff-input-fieldset .ff-input-container .ff-input--no-border {\n border: none;\n}\n.ff-input-fieldset .ff-input-container .ff-input--placeholder::placeholder {\n opacity: 1;\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container {\n display: flex;\n gap: 2px;\n position: absolute;\n border: none;\n outline: none;\n line-height: 18px;\n margin-top: 1px;\n transition: all 0.3s ease-in-out;\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container--medium {\n line-height: 25px;\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container .ff-input-label {\n color: var(--input-default-label-color);\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container .ff-input-label--danger {\n color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container .ff-input-label--disabled {\n color: var(--input-default-border-color);\n background-color: var(--input-label-bg-color);\n}\n.ff-input-fieldset .ff-input-container .ff-input-label-container .required-asterisk {\n color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input-label {\n color: var(--input-default-label-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input-label--no-hover {\n color: var(--input-default-label-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input-label--disabled {\n color: var(--input-default-border-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input-label--danger {\n color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input, .ff-input-fieldset .ff-input-container:hover .ff-input-label-container {\n border-color: var(--brand-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input--no-hover {\n border-color: var(--input-default-border-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input--disabled {\n background: transparent;\n border-color: var(--input-default-border-color);\n}\n.ff-input-fieldset .ff-input-container:hover .ff-input--danger {\n border-color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input-label-container {\n top: -9px;\n background-color: var(--input-label-bg-color);\n line-height: 15px;\n padding: 0px 2px;\n margin-left: 10px;\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input-label--primary {\n color: var(--brand-color);\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input-label--danger {\n color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input, .ff-input-fieldset .ff-input-container:focus-within .ff-input-label-container {\n border-color: var(--brand-color);\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input--danger {\n border-color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container:focus-within .ff-input::placeholder, .ff-input-fieldset .ff-input-container:focus-within .ff-input-label-container::placeholder {\n opacity: 1;\n margin-bottom: 1px;\n}\n.ff-input-fieldset .ff-input-container .ff-input-message {\n padding: 0px 4px;\n margin-left: 8px;\n line-height: 15px;\n}\n.ff-input-fieldset .ff-input-container .ff-input-message--danger {\n color: var(--input-error-text-color);\n}\n.ff-input-fieldset .ff-input-container--float .ff-input-label-container {\n top: -9px;\n font-size: 10px;\n background-color: var(--input-label-bg-color);\n line-height: 15px;\n padding: 0px 2px;\n margin-left: 10px;\n}\n.ff-input-fieldset .ff-input-container--float--disabled {\n cursor: not-allowed;\n}\n.ff-input-fieldset .ff-input-container--float--disabled .ff-input-label-container {\n cursor: not-allowed;\n}";
|
2257
2270
|
styleInject(css_248z$11);
|
2258
2271
|
|
2259
2272
|
const Input = /*#__PURE__*/forwardRef(({
|
@@ -2281,57 +2294,62 @@ const Input = /*#__PURE__*/forwardRef(({
|
|
2281
2294
|
...props
|
2282
2295
|
}, ref) => {
|
2283
2296
|
const isValueFilled = !checkEmpty(value);
|
2284
|
-
return
|
2285
|
-
className: classNames('ff-input-
|
2286
|
-
'ff-input-
|
2287
|
-
'ff-input-container--disabled': !!disabled
|
2297
|
+
return jsx("fieldset", {
|
2298
|
+
className: classNames('ff-input-fieldset', {
|
2299
|
+
'ff-input-fieldset--disabled': disabled
|
2288
2300
|
}),
|
2289
|
-
children:
|
2290
|
-
|
2291
|
-
|
2292
|
-
'ff-input-
|
2301
|
+
children: jsxs("div", {
|
2302
|
+
className: classNames('ff-input-container', {
|
2303
|
+
'ff-input-container--float': isValueFilled,
|
2304
|
+
'ff-input-container--disabled': !!disabled
|
2293
2305
|
}),
|
2294
|
-
children: [
|
2295
|
-
|
2296
|
-
|
2297
|
-
|
2298
|
-
className: classNames(`ff-input-label ff-input-label--${variant}`, {
|
2299
|
-
'ff-input-label--no-hover': !!value,
|
2300
|
-
'ff-input-label--disabled': !!disabled,
|
2301
|
-
'ff-input-label--danger': !!error
|
2306
|
+
children: [isLabelRequired && jsxs("label", {
|
2307
|
+
htmlFor: name,
|
2308
|
+
className: classNames(`ff-input-label-container ff-input-label-container--${size}`, {
|
2309
|
+
'ff-input-label-container--danger': !!error
|
2302
2310
|
}),
|
2303
|
-
children:
|
2311
|
+
children: [required && jsx("span", {
|
2312
|
+
className: "required-asterisk",
|
2313
|
+
children: "*"
|
2314
|
+
}), jsx("span", {
|
2315
|
+
className: classNames(`ff-input-label ff-input-label--${variant}`, {
|
2316
|
+
'ff-input-label--no-hover': !!value,
|
2317
|
+
'ff-input-label--disabled': !!disabled,
|
2318
|
+
'ff-input-label--danger': !!error
|
2319
|
+
}),
|
2320
|
+
children: label
|
2321
|
+
})]
|
2322
|
+
}), jsx("input", {
|
2323
|
+
ref: ref,
|
2324
|
+
name: name,
|
2325
|
+
value: value,
|
2326
|
+
type: type,
|
2327
|
+
spellCheck: false,
|
2328
|
+
id: name,
|
2329
|
+
className: classNames(`ff-input ff-input-${variant} default-input ff-input--${size}`, {
|
2330
|
+
['ff-input--transparentBackground']: !!transparentBackground,
|
2331
|
+
'ff-input--no-hover': !!value,
|
2332
|
+
'ff-input--disabled': !!disabled,
|
2333
|
+
'ff-input--danger': !!error,
|
2334
|
+
'ff-input--no-border': !!noBorder,
|
2335
|
+
'ff-input--placeholder': !isLabelRequired
|
2336
|
+
}, `${className}`),
|
2337
|
+
placeholder: placeholder,
|
2338
|
+
disabled: disabled,
|
2339
|
+
onChange: onChange,
|
2340
|
+
onFocus: onFocus,
|
2341
|
+
onBlur: onBlur,
|
2342
|
+
autoComplete: autoComplete,
|
2343
|
+
min: minValue,
|
2344
|
+
max: maxValue,
|
2345
|
+
...props
|
2346
|
+
}), helperText && error && jsx("span", {
|
2347
|
+
className: classNames('ff-input-message', {
|
2348
|
+
'ff-input-message--danger': !!error
|
2349
|
+
}),
|
2350
|
+
children: helperText
|
2304
2351
|
})]
|
2305
|
-
})
|
2306
|
-
ref: ref,
|
2307
|
-
name: name,
|
2308
|
-
value: value,
|
2309
|
-
type: type,
|
2310
|
-
spellCheck: false,
|
2311
|
-
id: name,
|
2312
|
-
className: classNames(`ff-input ff-input-${variant} default-input ff-input--${size}`, {
|
2313
|
-
['ff-input--transparentBackground']: !!transparentBackground,
|
2314
|
-
'ff-input--no-hover': !!value,
|
2315
|
-
'ff-input--disabled': !!disabled,
|
2316
|
-
'ff-input--danger': !!error,
|
2317
|
-
'ff-input--no-border': !!noBorder,
|
2318
|
-
'ff-input--placeholder': !isLabelRequired
|
2319
|
-
}, `${className}`),
|
2320
|
-
placeholder: placeholder,
|
2321
|
-
disabled: disabled,
|
2322
|
-
onChange: onChange,
|
2323
|
-
onFocus: onFocus,
|
2324
|
-
onBlur: onBlur,
|
2325
|
-
autoComplete: autoComplete,
|
2326
|
-
min: minValue,
|
2327
|
-
max: maxValue,
|
2328
|
-
...props
|
2329
|
-
}), helperText && error && jsx("span", {
|
2330
|
-
className: classNames('ff-input-message', {
|
2331
|
-
'ff-input-message--danger': !!error
|
2332
|
-
}),
|
2333
|
-
children: helperText
|
2334
|
-
})]
|
2352
|
+
})
|
2335
2353
|
});
|
2336
2354
|
});
|
2337
2355
|
|
@@ -3139,7 +3157,7 @@ const OptionCard = ({
|
|
3139
3157
|
children: options.map(opt => jsx(Option$1, {
|
3140
3158
|
option: opt,
|
3141
3159
|
onClick: onClick
|
3142
|
-
}, opt.
|
3160
|
+
}, opt.value))
|
3143
3161
|
}), document.body);
|
3144
3162
|
};
|
3145
3163
|
const MenuOption = ({
|
@@ -3236,7 +3254,7 @@ const MenuOption = ({
|
|
3236
3254
|
});
|
3237
3255
|
};
|
3238
3256
|
|
3239
|
-
var css_248z$V = ".ff-fixed-header-table {\n overflow-y: auto;\n}\n\n.ff-table-icon {\n position: absolute;\n top: 10px;\n right: 0;\n margin-right: 10px;\n z-index: 100;\n cursor: pointer;\n}\n\n.ff-table {\n width: 100%;\n}\n.ff-table th,\n.ff-table td {\n text-align: left;\n font-size: 12px;\n padding: 9px 8px;\n}\n.ff-table thead tr th {\n border-bottom: 1px solid var(--slider-table-color);\n}\n.ff-table thead tr th .ff-label-checkbox-container {\n display: flex;\n align-items: center;\n}\n.ff-table thead tr th .ff-label-checkbox-container .ff-table-checkbox {\n padding-right: 8px;\n}\n.ff-table tbody tr .action-column {\n opacity: 0;\n}\n.ff-table tbody tr .icon-container {\n padding-left: 10px;\n opacity: 0;\n display: flex;\n justify-content: flex-end;\n transition: opacity 0.3s ease, transform 0.3s ease;\n transform: translateX(20px);\n}\n.ff-table tbody tr:hover {\n background-color: var(--hover-color);\n}\n.ff-table tbody tr:hover .icon-container {\n opacity: 1;\n transform: translateX(0);\n}\n.ff-table tbody tr td {\n position: relative;\n color: var(--table-column-text-color);\n}\n.ff-table tbody tr td.clickable-cell {\n cursor: pointer;\n}\n.ff-table tbody tr td .ff-data-checkbox-container {\n display: flex;\n align-items: center;\n}\n.ff-table tbody tr td .ff-data-checkbox-container .ff-table-checkbox {\n padding-right: 8px;\n}\n.ff-table .primary-bg {\n background-color: var(--brand-color);\n}\n.ff-table .secondary-bg {\n background-color: var(--slider-table-color);\n}\n.ff-table .default-bg {\n background-color: transparent;\n}\n.ff-table .default-color {\n color: var(--table-header-text-color);\n}\n.ff-table .primary-color {\n color: var(--brand-color);\n}\n\n.border-borderRadius {\n border: 1px solid var(--slider-table-color);\n border-radius: 5px;\n border-collapse: none !important;\n}\n\n.ff-fixed-header {\n position: sticky !important;\n top: 0;\n z-index: 99;\n background-color: Var(--file-details-bg);\n}\n\n.no-data-content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\ntbody tr.disabled-row {\n opacity: 0.5;\n cursor: not-allowed;\n}";
|
3257
|
+
var css_248z$V = ".ff-fixed-header-table {\n overflow-y: auto;\n}\n\n.ff-table-icon {\n position: absolute;\n top: 10px;\n right: 0;\n margin-right: 10px;\n z-index: 100;\n cursor: pointer;\n}\n\n.ff-table {\n width: 100%;\n}\n.ff-table th,\n.ff-table td {\n text-align: left;\n font-size: 12px;\n padding: 9px 8px;\n}\n.ff-table thead tr th {\n border-bottom: 1px solid var(--slider-table-color);\n}\n.ff-table thead tr th .ff-label-checkbox-container {\n display: flex;\n align-items: center;\n}\n.ff-table thead tr th .ff-label-checkbox-container .ff-table-checkbox {\n padding-right: 8px;\n}\n.ff-table tbody tr .action-column {\n opacity: 0;\n}\n.ff-table tbody tr .icon-container {\n padding-left: 10px;\n opacity: 0;\n display: flex;\n justify-content: flex-end;\n transition: opacity 0.3s ease, transform 0.3s ease;\n transform: translateX(20px);\n}\n.ff-table tbody tr:hover {\n background-color: var(--hover-color);\n}\n.ff-table tbody tr:hover .icon-container {\n opacity: 1;\n transform: translateX(0);\n}\n.ff-table tbody tr td {\n position: relative;\n color: var(--table-column-text-color);\n}\n.ff-table tbody tr td.clickable-cell {\n cursor: pointer;\n}\n.ff-table tbody tr td .ff-data-checkbox-container {\n display: flex;\n align-items: center;\n}\n.ff-table tbody tr td .ff-data-checkbox-container .ff-table-checkbox {\n padding-right: 8px;\n}\n.ff-table .primary-bg {\n background-color: var(--brand-color);\n}\n.ff-table .secondary-bg {\n background-color: var(--slider-table-color);\n}\n.ff-table .tertiary-bg {\n background-color: var(--custom-table-header-bg-color);\n}\n.ff-table .default-bg {\n background-color: transparent;\n}\n.ff-table .default-color {\n color: var(--table-header-text-color);\n}\n.ff-table .primary-color {\n color: var(--brand-color);\n}\n\n.border-borderRadius {\n border: 1px solid var(--slider-table-color);\n border-radius: 5px;\n border-collapse: none !important;\n}\n\n.ff-fixed-header {\n position: sticky !important;\n top: 0;\n z-index: 99;\n background-color: Var(--file-details-bg);\n}\n\n.no-data-content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\ntbody tr.disabled-row {\n opacity: 0.5;\n cursor: not-allowed;\n}";
|
3240
3258
|
styleInject(css_248z$V);
|
3241
3259
|
|
3242
3260
|
const isFunction$2 = functionToCheck => {
|
@@ -3806,7 +3824,8 @@ const useFileDropzone = options => {
|
|
3806
3824
|
maxSizeErrorMessage,
|
3807
3825
|
invalidFileMessage,
|
3808
3826
|
fileExistMessage,
|
3809
|
-
validateMIMEType = false
|
3827
|
+
validateMIMEType = false,
|
3828
|
+
isApiResponseError
|
3810
3829
|
} = options;
|
3811
3830
|
const [files, setFiles] = useState({
|
3812
3831
|
accepted: [],
|
@@ -3829,7 +3848,7 @@ const useFileDropzone = options => {
|
|
3829
3848
|
}
|
3830
3849
|
const extensionWithPeriod = getExtensionWithPeriod(file).toLowerCase();
|
3831
3850
|
if (validateMIMEType) {
|
3832
|
-
if (!validateFileMIMEType(file, extensionWithPeriod)) {
|
3851
|
+
if (!validateFileMIMEType(file, extensionWithPeriod) || isApiResponseError) {
|
3833
3852
|
errors.push({
|
3834
3853
|
message: invalidFileMessage ? invalidFileMessage : 'Unsupported File Format',
|
3835
3854
|
code: 'file-invalid-type'
|
@@ -3952,9 +3971,152 @@ const useFileDropzone = options => {
|
|
3952
3971
|
};
|
3953
3972
|
};
|
3954
3973
|
|
3955
|
-
var css_248z$R = ".ff-file-dropzone-wrapper {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone {\n padding: 16px 0;\n border-radius: 8px;\n background: var(--file-dropzone-default-color);\n border: 1px dashed var(--brand-color);\n display: flex;\n align-items: center;\n flex-direction: column;\n text-align: center;\n gap: 8px;\n transition: background-color 0.2s ease;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone:hover, .ff-file-dropzone-wrapper .ff-file-dropzone--active {\n background-color: var(--file-dropzone-selected-color);\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__icon {\n height: 80px;\n width: 80px;\n display: grid;\n place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn {\n margin: 0 auto;\n position: relative;\n font-weight: 600;\n line-height: 15px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper {\n display: flex;\n flex-direction: column;\n gap: 10px;\n max-height: 300px;\n overflow-y: auto;\n scroll-behavior: smooth;\n padding: 2px;\n -ms-overflow-style: none;\n scrollbar-width: thin;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper ::-webkit-scrollbar {\n width: 2px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 4px;\n border-radius: 4px;\n background-color: var(--file-details-bg);\n box-shadow: 0px 0px 4px 0px var(--file-details-container-shadow);\n overflow: hidden;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info {\n display: flex;\n align-items: center;\n gap: 4px;\n width: 87%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info .ff-file-info__icon {\n display: grid;\n place-items: center;\n height: 24px;\n width: 24px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper {\n display: flex;\n flex-direction: column;\n gap: 2px;\n justify-content: center;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n width: 100%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper__name {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n display: block;\n color: var(--text-color);\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-replace, .ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-remove {\n height: 24px;\n width: 24px;\n display: grid;\n place-items: center;\n cursor: pointer;\n}";
|
3974
|
+
var css_248z$R = ".ff-file-dropzone-wrapper {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone {\n padding: 16px 0;\n border-radius: 8px;\n background: var(--file-dropzone-default-color);\n border: 1px dashed var(--brand-color);\n display: flex;\n align-items: center;\n flex-direction: column;\n text-align: center;\n gap: 8px;\n transition: background-color 0.2s ease;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone .ff-radio-group-wrapper {\n position: relative;\n bottom: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone:hover, .ff-file-dropzone-wrapper .ff-file-dropzone--active {\n background-color: var(--file-dropzone-selected-color);\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone--webservice-file {\n display: grid;\n place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone--webservice-container {\n display: grid;\n place-items: center;\n padding: 16px 0 40px 0;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__icon {\n height: 80px;\n width: 80px;\n display: grid;\n place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn {\n margin: 0 auto;\n position: relative;\n font-weight: 600;\n line-height: 15px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__webservice-file {\n padding: 4px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper {\n display: flex;\n flex-direction: column;\n gap: 10px;\n max-height: 300px;\n overflow-y: auto;\n scroll-behavior: smooth;\n padding: 2px;\n -ms-overflow-style: none;\n scrollbar-width: thin;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper ::-webkit-scrollbar {\n width: 2px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 4px;\n border-radius: 4px;\n background-color: var(--file-details-bg);\n box-shadow: 0px 0px 4px 0px var(--file-details-container-shadow);\n overflow: hidden;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info {\n display: flex;\n align-items: center;\n gap: 4px;\n width: 87%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info .ff-file-info__icon {\n display: grid;\n place-items: center;\n height: 24px;\n width: 24px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper {\n display: flex;\n flex-direction: column;\n gap: 2px;\n justify-content: center;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n width: 100%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper__name {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n display: block;\n color: var(--text-color);\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-replace, .ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-remove {\n height: 24px;\n width: 24px;\n display: grid;\n place-items: center;\n cursor: pointer;\n}\n\n.ff-webservice-file-wrapper {\n display: flex;\n gap: 8px;\n}\n.ff-webservice-file-wrapper .ff-webservice-file-name {\n position: relative;\n bottom: 2px;\n}\n\n.ff-input-ref {\n display: none;\n}\n\n.ff-disable-file-dropzone-wrapper {\n opacity: 0.5;\n cursor: not-allowed;\n}";
|
3956
3975
|
styleInject(css_248z$R);
|
3957
3976
|
|
3977
|
+
var css_248z$Q = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-radio-wrapper .ff-radio {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-radio-wrapper {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n.ff-radio-wrapper .ff-radio {\n position: relative;\n color: var(--text-color);\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input {\n display: none;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom {\n box-sizing: content-box;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n border: 1px solid var(--radio-button-border);\n position: relative;\n margin-right: 8px;\n transition: border-color background-color;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom::before {\n content: \"\";\n width: 12px;\n height: 12px;\n border-radius: 50%;\n background: #fbfdff;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n transition: background-color 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom::after {\n content: \"\";\n width: 16px;\n height: 16px;\n border-radius: 50%;\n border: 4px solid #f7edff;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n opacity: 0;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom {\n border: 1px solid var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom::before {\n background-color: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom::after {\n opacity: 1;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked + .ff-radio-custom {\n border-color: var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked + .ff-radio-custom::before {\n background: var(--brand-color);\n height: 12px;\n width: 12px;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom {\n border: 1px solid var(--radio-button-border);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom::before {\n background: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom::after {\n border: 4px solid var(--radio-button-hover);\n opacity: 0;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom {\n border-color: var(--brand-color);\n background-color: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom::before {\n background: var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio--disabled {\n cursor: default;\n}\n.ff-radio-wrapper .ff-radio--disabled .ff-radio-custom {\n opacity: 0.5;\n}";
|
3978
|
+
styleInject(css_248z$Q);
|
3979
|
+
|
3980
|
+
const RadioButton = ({
|
3981
|
+
label,
|
3982
|
+
name,
|
3983
|
+
checked,
|
3984
|
+
onChange,
|
3985
|
+
value,
|
3986
|
+
disabled = false,
|
3987
|
+
showTooltip = false,
|
3988
|
+
tooltipChildren = 'Custom JSX',
|
3989
|
+
tooltipTitle = 'Custom JSX'
|
3990
|
+
}) => {
|
3991
|
+
return jsxs("div", {
|
3992
|
+
className: "ff-radio-wrapper",
|
3993
|
+
children: [jsxs("label", {
|
3994
|
+
className: classNames('ff-radio', {
|
3995
|
+
'ff-radio--disabled': disabled
|
3996
|
+
}),
|
3997
|
+
children: [jsx("input", {
|
3998
|
+
disabled: disabled,
|
3999
|
+
type: "radio",
|
4000
|
+
name: name,
|
4001
|
+
value: value,
|
4002
|
+
checked: checked,
|
4003
|
+
onChange: onChange,
|
4004
|
+
className: "ff-radio-input"
|
4005
|
+
}), jsx("span", {
|
4006
|
+
className: "ff-radio-custom"
|
4007
|
+
}), jsx(Typography, {
|
4008
|
+
color: "var(--text-color)",
|
4009
|
+
children: label
|
4010
|
+
})]
|
4011
|
+
}), showTooltip && jsx(Tooltip, {
|
4012
|
+
title: tooltipTitle,
|
4013
|
+
children: tooltipChildren
|
4014
|
+
})]
|
4015
|
+
});
|
4016
|
+
};
|
4017
|
+
|
4018
|
+
var css_248z$P = ".ff-radio-group {\n display: flex;\n flex-direction: row;\n gap: 12px;\n}\n\n.ff-radio-label-wrapper {\n position: relative;\n top: 2px;\n}\n\n.ff-required-asterisk {\n color: var(--input-error-text-color);\n}";
|
4019
|
+
styleInject(css_248z$P);
|
4020
|
+
|
4021
|
+
const RadioGroup = ({
|
4022
|
+
options,
|
4023
|
+
name,
|
4024
|
+
selectedValue,
|
4025
|
+
onChange,
|
4026
|
+
label,
|
4027
|
+
isLabel = false,
|
4028
|
+
isAsteriskRequired = false,
|
4029
|
+
className,
|
4030
|
+
classNameForLabel
|
4031
|
+
}) => {
|
4032
|
+
return jsxs("div", {
|
4033
|
+
className: classNames('ff-radio-group', className),
|
4034
|
+
children: [isLabel && jsxs(Typography, {
|
4035
|
+
fontWeight: 'semi-bold',
|
4036
|
+
className: classNames(classNameForLabel),
|
4037
|
+
children: [' ', isAsteriskRequired && jsxs(Typography, {
|
4038
|
+
className: classNames('ff-required-asterisk'),
|
4039
|
+
children: ["*", ' ']
|
4040
|
+
}), label, ' ']
|
4041
|
+
}), options.map(option => jsx(RadioButton, {
|
4042
|
+
label: option.label,
|
4043
|
+
showTooltip: option?.showTooltip,
|
4044
|
+
tooltipChildren: option?.tooltipChildren,
|
4045
|
+
tooltipTitle: option?.tooltipTitle,
|
4046
|
+
name: name,
|
4047
|
+
value: option.value,
|
4048
|
+
checked: selectedValue === option.value,
|
4049
|
+
onChange: () => onChange?.(option),
|
4050
|
+
disabled: option.disabled
|
4051
|
+
}, option.value))]
|
4052
|
+
});
|
4053
|
+
};
|
4054
|
+
|
4055
|
+
const RadioFilePreview = ({
|
4056
|
+
selectedFile,
|
4057
|
+
onFileRemoveClick,
|
4058
|
+
onFileReplaceClick
|
4059
|
+
}) => {
|
4060
|
+
const fileInputRef = useRef(null);
|
4061
|
+
const handleReplaceClick = () => {
|
4062
|
+
if (fileInputRef.current) {
|
4063
|
+
fileInputRef.current.click();
|
4064
|
+
}
|
4065
|
+
};
|
4066
|
+
const handleFileChange = event => {
|
4067
|
+
const file = event.target.files?.[0];
|
4068
|
+
if (file) {
|
4069
|
+
onFileReplaceClick?.(file);
|
4070
|
+
}
|
4071
|
+
};
|
4072
|
+
return jsxs("div", {
|
4073
|
+
className: "ff-webservice-file-wrapper",
|
4074
|
+
children: [jsx("div", {
|
4075
|
+
className: "ff-file-info",
|
4076
|
+
children: jsx(Fragment, {
|
4077
|
+
children: jsx(Tooltip, {
|
4078
|
+
title: selectedFile,
|
4079
|
+
children: jsx(Typography, {
|
4080
|
+
lineHeight: "18px",
|
4081
|
+
fontWeight: "semi-bold",
|
4082
|
+
color: 'var(--text-color)',
|
4083
|
+
className: "ff-webservice-file-name",
|
4084
|
+
children: selectedFile
|
4085
|
+
})
|
4086
|
+
})
|
4087
|
+
})
|
4088
|
+
}), jsx(Fragment, {
|
4089
|
+
children: jsx(Tooltip, {
|
4090
|
+
title: "Remove",
|
4091
|
+
children: jsx(Icon, {
|
4092
|
+
name: "close",
|
4093
|
+
height: 12,
|
4094
|
+
width: 12,
|
4095
|
+
hoverEffect: true,
|
4096
|
+
onClick: onFileRemoveClick
|
4097
|
+
})
|
4098
|
+
})
|
4099
|
+
}), jsxs(Fragment, {
|
4100
|
+
children: [jsx(Tooltip, {
|
4101
|
+
title: "Replace",
|
4102
|
+
children: jsx(Icon, {
|
4103
|
+
name: "replace_file",
|
4104
|
+
color: 'var(--icons-default-color)',
|
4105
|
+
height: 16,
|
4106
|
+
width: 16,
|
4107
|
+
hoverEffect: true,
|
4108
|
+
onClick: handleReplaceClick
|
4109
|
+
})
|
4110
|
+
}), jsx("input", {
|
4111
|
+
type: "file",
|
4112
|
+
ref: fileInputRef,
|
4113
|
+
className: 'ff-input-ref',
|
4114
|
+
onChange: handleFileChange
|
4115
|
+
})]
|
4116
|
+
})]
|
4117
|
+
});
|
4118
|
+
};
|
4119
|
+
|
3958
4120
|
const Dropzone = ({
|
3959
4121
|
icon,
|
3960
4122
|
primaryLabel,
|
@@ -3963,43 +4125,81 @@ const Dropzone = ({
|
|
3963
4125
|
getRootProps,
|
3964
4126
|
getInputProps,
|
3965
4127
|
isDragActive = false,
|
3966
|
-
height = 188
|
4128
|
+
height = 188,
|
4129
|
+
isWebServiceFileDropZone = false,
|
4130
|
+
selectedRadioOption,
|
4131
|
+
radioOptions,
|
4132
|
+
handleOptionChange,
|
4133
|
+
selectedFile,
|
4134
|
+
setSelectedFile,
|
4135
|
+
handleRemoveFile,
|
4136
|
+
isDisable
|
3967
4137
|
}) => {
|
3968
|
-
|
4138
|
+
const isWebServiceFile = selectedFile?.name && isWebServiceFileDropZone;
|
4139
|
+
return jsx("div", {
|
3969
4140
|
...getRootProps(),
|
3970
4141
|
className: classNames('ff-file-dropzone', {
|
3971
|
-
'ff-file-dropzone--active': isDragActive
|
4142
|
+
'ff-file-dropzone--active': isDragActive,
|
4143
|
+
'ff-file-dropzone--webservice-file': isWebServiceFile,
|
4144
|
+
'ff-file-dropzone--webservice-container': isWebServiceFileDropZone
|
3972
4145
|
}),
|
3973
4146
|
style: {
|
3974
4147
|
height: height
|
3975
4148
|
},
|
3976
|
-
children:
|
3977
|
-
|
3978
|
-
|
3979
|
-
|
3980
|
-
|
3981
|
-
|
3982
|
-
|
3983
|
-
|
3984
|
-
|
3985
|
-
|
3986
|
-
|
3987
|
-
children:
|
3988
|
-
|
3989
|
-
|
3990
|
-
|
3991
|
-
|
3992
|
-
|
3993
|
-
|
3994
|
-
|
3995
|
-
|
3996
|
-
|
3997
|
-
|
3998
|
-
|
3999
|
-
|
4000
|
-
})
|
4149
|
+
children: isWebServiceFile ? jsx(RadioFilePreview, {
|
4150
|
+
selectedFile: selectedFile.name,
|
4151
|
+
onFileRemoveClick: handleRemoveFile,
|
4152
|
+
onFileReplaceClick: setSelectedFile,
|
4153
|
+
setSelectedFile: setSelectedFile
|
4154
|
+
}) : jsxs(Fragment, {
|
4155
|
+
children: [jsx("div", {
|
4156
|
+
className: "ff-file-dropzone-content__icon",
|
4157
|
+
children: icon
|
4158
|
+
}), jsxs("div", {
|
4159
|
+
className: "ff-file-dropzone-content__labels",
|
4160
|
+
children: [jsx(Typography, {
|
4161
|
+
as: "p",
|
4162
|
+
fontWeight: "semi-bold",
|
4163
|
+
lineHeight: "18px",
|
4164
|
+
textAlign: "center",
|
4165
|
+
color: 'var(--text-color)',
|
4166
|
+
children: primaryLabel
|
4167
|
+
}), jsx(Typography, {
|
4168
|
+
as: "p",
|
4169
|
+
lineHeight: "18px",
|
4170
|
+
textAlign: "center",
|
4171
|
+
color: 'var(--text-color)',
|
4172
|
+
children: secondaryLabel
|
4173
|
+
}), isWebServiceFileDropZone ? jsxs("div", {
|
4174
|
+
className: "ff-radio-group-wrapper",
|
4175
|
+
children: [jsxs(Typography, {
|
4176
|
+
fontWeight: "semi-bold",
|
4177
|
+
children: [' ', "Choose file from", ' ']
|
4178
|
+
}), jsx(RadioGroup, {
|
4179
|
+
name: "radio_btn_file_dropzone",
|
4180
|
+
options: radioOptions ?? [{
|
4181
|
+
label: 'Default Label',
|
4182
|
+
value: 'default_value'
|
4183
|
+
}],
|
4184
|
+
selectedValue: selectedRadioOption?.value,
|
4185
|
+
onChange: handleOptionChange
|
4186
|
+
})]
|
4187
|
+
}) : jsx(Button$1, {
|
4188
|
+
variant: "primary",
|
4189
|
+
label: buttonLabel,
|
4190
|
+
className: 'choose-file-btn',
|
4191
|
+
disabled: isDisable,
|
4192
|
+
children: jsx("input", {
|
4193
|
+
...(isDisable ? {
|
4194
|
+
style: {
|
4195
|
+
cursor: 'not-allowed'
|
4196
|
+
},
|
4197
|
+
disabled: true
|
4198
|
+
} : getInputProps())
|
4199
|
+
})
|
4200
|
+
})]
|
4001
4201
|
})]
|
4002
|
-
})
|
4202
|
+
})
|
4003
4203
|
});
|
4004
4204
|
};
|
4005
4205
|
|
@@ -4095,7 +4295,17 @@ const FileDropzone = ({
|
|
4095
4295
|
width = 640,
|
4096
4296
|
height = 188,
|
4097
4297
|
getAcceptedFiles = () => {},
|
4098
|
-
getRejectedFiles = () => {}
|
4298
|
+
getRejectedFiles = () => {},
|
4299
|
+
isWebServiceFileDropZone = false,
|
4300
|
+
selectedRadioOption,
|
4301
|
+
radioOptions,
|
4302
|
+
handleOptionChange,
|
4303
|
+
selectedFile,
|
4304
|
+
setSelectedFile,
|
4305
|
+
handleFileChange,
|
4306
|
+
handleRemoveFile,
|
4307
|
+
isApiResponseError = false,
|
4308
|
+
isDisable = false
|
4099
4309
|
}) => {
|
4100
4310
|
const {
|
4101
4311
|
getRootProps,
|
@@ -4114,7 +4324,8 @@ const FileDropzone = ({
|
|
4114
4324
|
maxSizeErrorMessage,
|
4115
4325
|
invalidFileMessage,
|
4116
4326
|
fileExistMessage,
|
4117
|
-
validateMIMEType
|
4327
|
+
validateMIMEType,
|
4328
|
+
isApiResponseError
|
4118
4329
|
// onDrop: (accepted, rejected, event) => {}, //onDrop function to handle dropped or selected files explicitly.
|
4119
4330
|
});
|
4120
4331
|
getAcceptedFiles(acceptedFiles);
|
@@ -4124,6 +4335,11 @@ const FileDropzone = ({
|
|
4124
4335
|
onRemoveClick: handleRemoveClick,
|
4125
4336
|
onReplaceClick: handleReplaceClick
|
4126
4337
|
}, file.name)), [acceptedFiles, handleRemoveClick, handleReplaceClick]);
|
4338
|
+
useEffect(() => {
|
4339
|
+
if (!checkEmpty(acceptedFiles) && setSelectedFile) {
|
4340
|
+
setSelectedFile(acceptedFiles[0] || null);
|
4341
|
+
}
|
4342
|
+
}, [acceptedFiles, setSelectedFile]);
|
4127
4343
|
const rejectedFilesList = useMemo(() => rejectedFiles.map(rejectedFile => jsx(FilePreview, {
|
4128
4344
|
file: rejectedFile.file,
|
4129
4345
|
error: rejectedFile.errors[0]?.message,
|
@@ -4131,7 +4347,9 @@ const FileDropzone = ({
|
|
4131
4347
|
onReplaceClick: handleReplaceClick
|
4132
4348
|
}, rejectedFile.file.name)), [rejectedFiles, handleRemoveClick, handleReplaceClick]);
|
4133
4349
|
return jsxs("div", {
|
4134
|
-
className:
|
4350
|
+
className: classNames('ff-file-dropzone-wrapper', {
|
4351
|
+
'ff-disable-file-dropzone-wrapper': isDisable
|
4352
|
+
}),
|
4135
4353
|
style: {
|
4136
4354
|
width: `${width}px`
|
4137
4355
|
},
|
@@ -4143,8 +4361,20 @@ const FileDropzone = ({
|
|
4143
4361
|
getRootProps: getRootProps,
|
4144
4362
|
getInputProps: getInputProps,
|
4145
4363
|
isDragActive: isDragActive,
|
4146
|
-
height: `${height}px
|
4147
|
-
|
4364
|
+
height: `${height}px`,
|
4365
|
+
isWebServiceFileDropZone: isWebServiceFileDropZone,
|
4366
|
+
selectedRadioOption: selectedRadioOption,
|
4367
|
+
radioOptions: radioOptions ?? [{
|
4368
|
+
label: 'Default Label',
|
4369
|
+
value: 'default_value'
|
4370
|
+
}],
|
4371
|
+
handleOptionChange: handleOptionChange,
|
4372
|
+
selectedFile: selectedFile,
|
4373
|
+
handleFileChange: handleFileChange,
|
4374
|
+
handleRemoveFile: handleRemoveFile,
|
4375
|
+
setSelectedFile: setSelectedFile,
|
4376
|
+
isDisable: isDisable
|
4377
|
+
}), isWebServiceFileDropZone ? null : jsxs("div", {
|
4148
4378
|
className: 'ff-file-details-wrapper',
|
4149
4379
|
style: {
|
4150
4380
|
width: `${width}px`
|
@@ -7673,7 +7903,7 @@ function createFormControl(props = {}) {
|
|
7673
7903
|
timer = setTimeout(callback, wait);
|
7674
7904
|
};
|
7675
7905
|
const _updateValid = async (shouldUpdateValid) => {
|
7676
|
-
if (!
|
7906
|
+
if (!_options.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
|
7677
7907
|
const isValid = _options.resolver
|
7678
7908
|
? isEmptyObject((await _executeSchema()).errors)
|
7679
7909
|
: await executeBuiltInValidation(_fields, true);
|
@@ -7685,7 +7915,7 @@ function createFormControl(props = {}) {
|
|
7685
7915
|
}
|
7686
7916
|
};
|
7687
7917
|
const _updateIsValidating = (names, isValidating) => {
|
7688
|
-
if (!
|
7918
|
+
if (!_options.disabled &&
|
7689
7919
|
(_proxyFormState.isValidating || _proxyFormState.validatingFields)) {
|
7690
7920
|
(names || Array.from(_names.mount)).forEach((name) => {
|
7691
7921
|
if (name) {
|
@@ -7701,7 +7931,7 @@ function createFormControl(props = {}) {
|
|
7701
7931
|
}
|
7702
7932
|
};
|
7703
7933
|
const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
|
7704
|
-
if (args && method && !
|
7934
|
+
if (args && method && !_options.disabled) {
|
7705
7935
|
_state.action = true;
|
7706
7936
|
if (shouldUpdateFieldsAndState && Array.isArray(get$1(_fields, name))) {
|
7707
7937
|
const fieldValues = method(get$1(_fields, name), args.argA, args.argB);
|
@@ -7765,7 +7995,7 @@ function createFormControl(props = {}) {
|
|
7765
7995
|
const output = {
|
7766
7996
|
name,
|
7767
7997
|
};
|
7768
|
-
if (!
|
7998
|
+
if (!_options.disabled) {
|
7769
7999
|
const disabledField = !!(get$1(_fields, name) &&
|
7770
8000
|
get$1(_fields, name)._f &&
|
7771
8001
|
get$1(_fields, name)._f.disabled);
|
@@ -7901,7 +8131,7 @@ function createFormControl(props = {}) {
|
|
7901
8131
|
}
|
7902
8132
|
_names.unMount = new Set();
|
7903
8133
|
};
|
7904
|
-
const _getDirty = (name, data) => !
|
8134
|
+
const _getDirty = (name, data) => !_options.disabled &&
|
7905
8135
|
(name && data && set$1(_formValues, name, data),
|
7906
8136
|
!deepEqual(getValues(), _defaultValues));
|
7907
8137
|
const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
|
@@ -8217,7 +8447,7 @@ function createFormControl(props = {}) {
|
|
8217
8447
|
};
|
8218
8448
|
const register = (name, options = {}) => {
|
8219
8449
|
let field = get$1(_fields, name);
|
8220
|
-
const disabledIsDefined = isBoolean(options.disabled) || isBoolean(
|
8450
|
+
const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
|
8221
8451
|
set$1(_fields, name, {
|
8222
8452
|
...(field || {}),
|
8223
8453
|
_f: {
|
@@ -8233,7 +8463,7 @@ function createFormControl(props = {}) {
|
|
8233
8463
|
field,
|
8234
8464
|
disabled: isBoolean(options.disabled)
|
8235
8465
|
? options.disabled
|
8236
|
-
:
|
8466
|
+
: _options.disabled,
|
8237
8467
|
name,
|
8238
8468
|
value: options.value,
|
8239
8469
|
});
|
@@ -8243,7 +8473,7 @@ function createFormControl(props = {}) {
|
|
8243
8473
|
}
|
8244
8474
|
return {
|
8245
8475
|
...(disabledIsDefined
|
8246
|
-
? { disabled: options.disabled ||
|
8476
|
+
? { disabled: options.disabled || _options.disabled }
|
8247
8477
|
: {}),
|
8248
8478
|
...(_options.progressive
|
8249
8479
|
? {
|
@@ -8327,6 +8557,12 @@ function createFormControl(props = {}) {
|
|
8327
8557
|
e.preventDefault && e.preventDefault();
|
8328
8558
|
e.persist && e.persist();
|
8329
8559
|
}
|
8560
|
+
if (_options.disabled) {
|
8561
|
+
if (onInvalid) {
|
8562
|
+
await onInvalid({ ..._formState.errors }, e);
|
8563
|
+
}
|
8564
|
+
return;
|
8565
|
+
}
|
8330
8566
|
let fieldValues = cloneObject(_formValues);
|
8331
8567
|
_subjects.state.next({
|
8332
8568
|
isSubmitting: true,
|
@@ -8505,7 +8741,9 @@ function createFormControl(props = {}) {
|
|
8505
8741
|
: fieldReference.ref;
|
8506
8742
|
if (fieldRef.focus) {
|
8507
8743
|
fieldRef.focus();
|
8508
|
-
options.shouldSelect &&
|
8744
|
+
options.shouldSelect &&
|
8745
|
+
isFunction$1(fieldRef.select) &&
|
8746
|
+
fieldRef.select();
|
8509
8747
|
}
|
8510
8748
|
}
|
8511
8749
|
};
|
@@ -8706,11 +8944,6 @@ function useForm(props = {}) {
|
|
8706
8944
|
values: control._getWatch(),
|
8707
8945
|
});
|
8708
8946
|
}, [props.shouldUnregister, control]);
|
8709
|
-
React__default.useEffect(() => {
|
8710
|
-
if (_formControl.current) {
|
8711
|
-
_formControl.current.watch = _formControl.current.watch.bind({});
|
8712
|
-
}
|
8713
|
-
}, [formState]);
|
8714
8947
|
_formControl.current.formState = getProxyFormState(formState, control);
|
8715
8948
|
return _formControl.current;
|
8716
8949
|
}
|
@@ -8757,10 +8990,10 @@ const Forms = ({
|
|
8757
8990
|
};
|
8758
8991
|
const ForwardedForms = /*#__PURE__*/forwardRef(Forms);
|
8759
8992
|
|
8760
|
-
var css_248z$
|
8761
|
-
styleInject(css_248z$
|
8993
|
+
var css_248z$O = ".fontXs, .ff-input-with-dropdown-container .ff-helper-text {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-input-with-dropdown-container {\n display: flex;\n flex-direction: column;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown {\n display: flex;\n border: 1px solid var(--input-default-border-color);\n border-radius: 4px;\n padding: 0;\n position: relative;\n justify-content: space-between;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-input-with-dropdown--left {\n display: flex;\n flex-direction: row-reverse;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-input-with-dropdown--right {\n display: flex;\n flex-direction: row;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-input--left-dropdown {\n width: 698px;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container {\n display: flex;\n flex: 1;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label {\n position: absolute;\n z-index: 9;\n color: var(--input-default-border-color);\n top: 6px;\n left: 7px;\n transition: all 0.3s ease-in-out;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label .ff-required-asterisk {\n color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--filled {\n color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--no-hover {\n color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--error {\n color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input {\n width: 100%;\n padding: 6px 7px;\n line-height: 18px;\n border: none;\n outline: none;\n border-right: 1px solid var(--input-default-border-color);\n border-radius: 4px 0 0 4px;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::-webkit-outer-spin-button, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::placeholder {\n opacity: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input:disabled {\n cursor: not-allowed;\n background: transparent;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input--left-dropdown::placeholder {\n opacity: 1;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--no-hover {\n border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown {\n width: 100%;\n border: none;\n outline: none;\n margin: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown:disabled {\n cursor: not-allowed;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown:hover {\n background-color: var(--dropdown-bg-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown--left {\n min-width: 94px;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .seperatorline {\n height: 26px;\n margin-top: 3px;\n border-right: 0.5px solid var(--brand-color);\n flex-shrink: 0;\n border-radius: 2px;\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown {\n border-color: var(--brand-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--filled {\n border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--disabled {\n border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--left .ff-floating-label {\n color: var(--input-hover-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--left .ff-floating-label--filled {\n color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--left .ff-floating-label--disabled {\n color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--left .ff-floating-label--error {\n color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input {\n border-color: var(--brand-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--filled {\n border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--disabled {\n border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown {\n border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-label {\n top: -9px;\n background-color: var(--input-label-bg-color);\n padding: 0px 2px;\n color: var(--input-active-text-color);\n line-height: 15px;\n font-size: 10px !important;\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-label--error {\n color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input {\n border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input--error {\n border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input::placeholder {\n opacity: 1;\n}\n.ff-input-with-dropdown-container--filled .ff-input-with-dropdown .ff-floating-label-input-container {\n border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container--filled .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label {\n top: -9px;\n background-color: var(--input-label-bg-color);\n padding: 0px 2px;\n line-height: 15px;\n font-size: 10px !important;\n}\n.ff-input-with-dropdown-container--filled span {\n font-size: 8px;\n}\n.ff-input-with-dropdown-container--filled .required-asterisk {\n color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-helper-text {\n color: var(--input-error-text-color);\n padding: 0 11px;\n}";
|
8994
|
+
styleInject(css_248z$O);
|
8762
8995
|
|
8763
|
-
const InputWithDropdown = ({
|
8996
|
+
const InputWithDropdown = /*#__PURE__*/forwardRef(({
|
8764
8997
|
name = '',
|
8765
8998
|
label,
|
8766
8999
|
value,
|
@@ -8778,7 +9011,7 @@ const InputWithDropdown = ({
|
|
8778
9011
|
optionsRequired = true,
|
8779
9012
|
dropdownPosition = 'right',
|
8780
9013
|
type = 'text'
|
8781
|
-
}) => {
|
9014
|
+
}, ref) => {
|
8782
9015
|
const isValueFilled = !checkEmpty(value) || dropdownPosition === 'left';
|
8783
9016
|
return jsxs("div", {
|
8784
9017
|
className: classNames('ff-input-with-dropdown-container', {
|
@@ -8824,6 +9057,7 @@ const InputWithDropdown = ({
|
|
8824
9057
|
required: required,
|
8825
9058
|
children: label
|
8826
9059
|
}), jsx("input", {
|
9060
|
+
ref: ref,
|
8827
9061
|
name: name,
|
8828
9062
|
type: type,
|
8829
9063
|
id: name,
|
@@ -8861,85 +9095,7 @@ const InputWithDropdown = ({
|
|
8861
9095
|
children: helperText
|
8862
9096
|
})]
|
8863
9097
|
});
|
8864
|
-
};
|
8865
|
-
|
8866
|
-
var css_248z$P = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-radio-wrapper .ff-radio {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-radio-wrapper {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n.ff-radio-wrapper .ff-radio {\n position: relative;\n color: var(--text-color);\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input {\n display: none;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom {\n box-sizing: content-box;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n border: 1px solid var(--radio-button-border);\n position: relative;\n margin-right: 8px;\n transition: border-color background-color;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom::before {\n content: \"\";\n width: 12px;\n height: 12px;\n border-radius: 50%;\n background: #fbfdff;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n transition: background-color 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom::after {\n content: \"\";\n width: 16px;\n height: 16px;\n border-radius: 50%;\n border: 4px solid #f7edff;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n opacity: 0;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom {\n border: 1px solid var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom::before {\n background-color: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom::after {\n opacity: 1;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked + .ff-radio-custom {\n border-color: var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked + .ff-radio-custom::before {\n background: var(--brand-color);\n height: 12px;\n width: 12px;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom {\n border: 1px solid var(--radio-button-border);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom::before {\n background: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom::after {\n border: 4px solid var(--radio-button-hover);\n opacity: 0;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom {\n border-color: var(--brand-color);\n background-color: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom::before {\n background: var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio--disabled {\n cursor: default;\n}\n.ff-radio-wrapper .ff-radio--disabled .ff-radio-custom {\n opacity: 0.5;\n}";
|
8867
|
-
styleInject(css_248z$P);
|
8868
|
-
|
8869
|
-
const RadioButton = ({
|
8870
|
-
label,
|
8871
|
-
name,
|
8872
|
-
checked,
|
8873
|
-
onChange,
|
8874
|
-
value,
|
8875
|
-
disabled = false,
|
8876
|
-
showTooltip = false,
|
8877
|
-
tooltipChildren = 'Custom JSX',
|
8878
|
-
tooltipTitle = 'Custom JSX'
|
8879
|
-
}) => {
|
8880
|
-
return jsxs("div", {
|
8881
|
-
className: "ff-radio-wrapper",
|
8882
|
-
children: [jsxs("label", {
|
8883
|
-
className: classNames('ff-radio', {
|
8884
|
-
'ff-radio--disabled': disabled
|
8885
|
-
}),
|
8886
|
-
children: [jsx("input", {
|
8887
|
-
disabled: disabled,
|
8888
|
-
type: "radio",
|
8889
|
-
name: name,
|
8890
|
-
value: value,
|
8891
|
-
checked: checked,
|
8892
|
-
onChange: onChange,
|
8893
|
-
className: "ff-radio-input"
|
8894
|
-
}), jsx("span", {
|
8895
|
-
className: "ff-radio-custom"
|
8896
|
-
}), jsx(Typography, {
|
8897
|
-
color: "var(--text-color)",
|
8898
|
-
children: label
|
8899
|
-
})]
|
8900
|
-
}), showTooltip && jsx(Tooltip, {
|
8901
|
-
title: tooltipTitle,
|
8902
|
-
children: tooltipChildren
|
8903
|
-
})]
|
8904
|
-
});
|
8905
|
-
};
|
8906
|
-
|
8907
|
-
var css_248z$O = ".ff-radio-group {\n display: flex;\n flex-direction: row;\n gap: 12px;\n}\n\n.ff-radio-label-wrapper {\n position: relative;\n top: 2px;\n}\n\n.ff-required-asterisk {\n color: var(--input-error-text-color);\n}";
|
8908
|
-
styleInject(css_248z$O);
|
8909
|
-
|
8910
|
-
const RadioGroup = ({
|
8911
|
-
options,
|
8912
|
-
name,
|
8913
|
-
selectedValue,
|
8914
|
-
onChange,
|
8915
|
-
label,
|
8916
|
-
isLabel = false,
|
8917
|
-
isAsteriskRequired = false,
|
8918
|
-
className,
|
8919
|
-
classNameForLabel
|
8920
|
-
}) => {
|
8921
|
-
return jsxs("div", {
|
8922
|
-
className: classNames('ff-radio-group', className),
|
8923
|
-
children: [isLabel && jsxs(Typography, {
|
8924
|
-
fontWeight: 'semi-bold',
|
8925
|
-
className: classNames(classNameForLabel),
|
8926
|
-
children: [' ', isAsteriskRequired && jsxs(Typography, {
|
8927
|
-
className: classNames('ff-required-asterisk'),
|
8928
|
-
children: ["*", ' ']
|
8929
|
-
}), label, ' ']
|
8930
|
-
}), options.map(option => jsx(RadioButton, {
|
8931
|
-
label: option.label,
|
8932
|
-
showTooltip: option?.showTooltip,
|
8933
|
-
tooltipChildren: option?.tooltipChildren,
|
8934
|
-
tooltipTitle: option?.tooltipTitle,
|
8935
|
-
name: name,
|
8936
|
-
value: option.value,
|
8937
|
-
checked: selectedValue === option.value,
|
8938
|
-
onChange: () => onChange?.(option),
|
8939
|
-
disabled: option.disabled
|
8940
|
-
}, option.value))]
|
8941
|
-
});
|
8942
|
-
};
|
9098
|
+
});
|
8943
9099
|
|
8944
9100
|
var css_248z$N = ".ff-mini-modal-overlay {\n position: fixed;\n inset: 0;\n width: 100vw;\n height: 100vh;\n}\n\n.ff-mini-edit-modal-container {\n width: fit-content;\n padding: 0;\n position: absolute;\n visibility: hidden;\n}\n.ff-mini-edit-modal-container.modalVisible {\n visibility: visible;\n}\n.ff-mini-edit-modal-container.animatedModal {\n animation: slideDown 0.5s ease, opacity 0.5s ease;\n}\n.ff-mini-edit-modal-container .popover-arrow {\n position: absolute;\n width: 0;\n height: 0;\n border-style: solid;\n z-index: 102;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-top {\n bottom: 100%;\n left: 30px;\n padding: 0 3px 0 0;\n border-color: transparent transparent var(--ff-mini-modal-border) transparent;\n filter: drop-shadow(0 -1px 1px var(--ff-mini-modal-arrow-shadow));\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-top::before {\n content: \"\";\n position: absolute;\n width: 3px;\n height: 4px;\n border-radius: 50px;\n background-color: var(--ff-mini-modal-border);\n top: -0.5px;\n left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-left {\n left: -15px;\n border-color: transparent var(--ff-mini-modal-border) transparent transparent;\n filter: drop-shadow(-1px 0 1px var(--ff-mini-modal-arrow-shadow));\n padding: 3px 1px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-left::before {\n content: \"\";\n position: absolute;\n width: 4px;\n height: 3px;\n border-radius: 50px;\n background-color: var(--ff-mini-modal-border);\n top: 0;\n left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-bottom {\n top: 100%;\n left: 30px;\n border-color: var(--ff-mini-modal-border) transparent transparent transparent;\n filter: drop-shadow(0 2px 1px var(--ff-mini-modal-arrow-shadow));\n padding: 0 3px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-bottom::before {\n content: \"\";\n position: absolute;\n width: 3px;\n height: 3px;\n border-radius: 50px;\n background-color: var(--ff-mini-modal-border);\n top: -2px;\n left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-right {\n right: -10px;\n top: 66px;\n border-color: transparent transparent transparent var(--ff-mini-modal-border);\n filter: drop-shadow(2px 0 1px var(--ff-mini-modal-arrow-shadow));\n padding: 3px 1px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-right::before {\n content: \"\";\n position: absolute;\n width: 3px;\n height: 3px;\n border-radius: 50px;\n background-color: var(--ff-mini-modal-border);\n top: 0;\n left: -2px;\n}\n.ff-mini-edit-modal-container .popover-arrow.left-top-arrow {\n top: 10%;\n}\n.ff-mini-edit-modal-container .popover-arrow.left-middle-arrow {\n top: 45%;\n}\n.ff-mini-edit-modal-container .wrapped-div {\n height: 35px;\n background-color: transparent;\n outline: 8px solid var(--ff-mini-modal-border);\n outline-offset: -8px;\n position: absolute;\n top: -34px;\n border-radius: 7px 7px 0 0;\n}\n.ff-mini-edit-modal-container .wrapped-div::before, .ff-mini-edit-modal-container .wrapped-div::after {\n position: absolute;\n content: \"\";\n width: 13px;\n height: 13px;\n background: transparent;\n border-radius: 50%;\n bottom: 0;\n box-shadow: 8px 4px 0 var(--ff-mini-modal-border);\n}\n.ff-mini-edit-modal-container .wrapped-div::before {\n left: -13px;\n clip-path: polygon(100% 100%, 110% 45%, 0% 70%, 0% 100%);\n}\n.ff-mini-edit-modal-container .wrapped-div::after {\n right: -13px;\n clip-path: polygon(-5% 100%, 0% 40%, 100% 70%, 100% 100%);\n box-shadow: -8px 4px 0 var(--ff-mini-modal-border);\n}\n.ff-mini-edit-modal-container .mini-edit-modal {\n background: var(--ff-mini-modal-border);\n position: relative;\n max-height: fit-content;\n padding: 4px;\n width: 100%;\n margin: 0 0 0 -5px;\n height: 100%;\n}\n.ff-mini-edit-modal-container .mini-edit-modal.mini-edit-modal-wrapper-shadow {\n box-shadow: 0px 0px 4px 0px var(--ff-mini-modal-box-shadow);\n}\n.ff-mini-edit-modal-container .mini-edit-modal.mini-edit-modal-arrow-shadow {\n box-shadow: 0px 0px 16px 0px var(--ff-mini-modal-arrow-shadow);\n}\n.ff-mini-edit-modal-container .mini-edit-modal header {\n border-radius: 4px 4px 0 0;\n}\n.ff-mini-edit-modal-container .mini-edit-modal footer {\n border-radius: 0 0 4px 4px;\n}\n.ff-mini-edit-modal-container .mini-edit-modal .modal-footer {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 5px;\n background-color: var(--ff-mini-modal-footer-background);\n height: 24px;\n padding: 0 10px 0 0;\n transition: transform 0.3s ease-in-out;\n}\n@keyframes slideDown {\n 0% {\n transform: translateY(-50px);\n opacity: 0;\n }\n 100% {\n transform: translateY(0);\n opacity: 1;\n }\n}\n\n.ff-mini-modal-buttons-flex {\n display: flex;\n}\n\n.ff-mini-modal-gap-10 {\n gap: 10px;\n}\n\n.ff-mini-edit-model-icon {\n color: var(--ff-mini-modal-box-shadow);\n border: 2px solid var(--ff-mini-modal-box-shadow);\n border-radius: 4px;\n}";
|
8945
9101
|
styleInject(css_248z$N);
|
@@ -9395,7 +9551,7 @@ const TreeTable = ({
|
|
9395
9551
|
});
|
9396
9552
|
};
|
9397
9553
|
|
9398
|
-
var css_248z$L = ":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}\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--default {\n display: flex;\n gap: 8px;\n border-radius: 8px 8px 0 0;\n padding:
|
9554
|
+
var css_248z$L = ":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}\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--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 border: none;\n background: none;\n padding: 0 4px;\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-content {\n width: inherit;\n}";
|
9399
9555
|
styleInject(css_248z$L);
|
9400
9556
|
|
9401
9557
|
const Tabs = ({
|
@@ -9418,17 +9574,23 @@ const Tabs = ({
|
|
9418
9574
|
disabled: tab.disabled,
|
9419
9575
|
active: activeTabId === tab.id
|
9420
9576
|
}),
|
9421
|
-
children: [
|
9422
|
-
|
9423
|
-
|
9424
|
-
|
9425
|
-
|
9426
|
-
|
9427
|
-
|
9428
|
-
|
9429
|
-
|
9430
|
-
|
9431
|
-
|
9577
|
+
children: [jsxs("div", {
|
9578
|
+
className: "label-count-section",
|
9579
|
+
children: [jsx(Typography, {
|
9580
|
+
children: tab.label,
|
9581
|
+
lineHeight: "18px",
|
9582
|
+
fontWeight: activeTabId === tab.id ? 'semi-bold' : 'regular',
|
9583
|
+
color: activeTabId === tab.id ? 'var(--tabs-label-active-color)' : 'var(--tabs-label-default-color)',
|
9584
|
+
className: classNames('ff-tab-label', {
|
9585
|
+
'ff-tab-label--active': activeTabId === tab.id
|
9586
|
+
})
|
9587
|
+
}), variant === 'default' && tab.count && jsx("span", {
|
9588
|
+
className: classNames('tab-count', {
|
9589
|
+
'tab-count--active': activeTabId === tab.id
|
9590
|
+
}),
|
9591
|
+
children: tab.count
|
9592
|
+
})]
|
9593
|
+
}), jsx("div", {
|
9432
9594
|
className: classNames('ff-tab-bar', {
|
9433
9595
|
'ff-tab-bar--active': activeTabId === tab.id
|
9434
9596
|
})
|
@@ -9472,16 +9634,23 @@ const Search = ({
|
|
9472
9634
|
placeholder = 'Search',
|
9473
9635
|
onSearch,
|
9474
9636
|
disabled = false,
|
9475
|
-
width = 150
|
9637
|
+
width = 150,
|
9638
|
+
value = '',
|
9639
|
+
isExpand = false,
|
9640
|
+
onClose,
|
9641
|
+
onExpand
|
9476
9642
|
}) => {
|
9477
|
-
const [
|
9478
|
-
const [searchValue, setSearchValue] = useState('');
|
9643
|
+
const [searchValue, setSearchValue] = useState(value);
|
9479
9644
|
const inputRef = useRef(null);
|
9480
9645
|
useEffect(() => {
|
9481
|
-
if (
|
9646
|
+
if (isExpand && inputRef.current) {
|
9482
9647
|
inputRef.current.focus();
|
9483
9648
|
}
|
9484
|
-
|
9649
|
+
setSearchValue('');
|
9650
|
+
}, [isExpand]);
|
9651
|
+
useEffect(() => {
|
9652
|
+
setSearchValue(value);
|
9653
|
+
}, [value]);
|
9485
9654
|
const handleKeyDown = event => {
|
9486
9655
|
if (event.key === 'Enter' && !checkEmpty(searchValue)) {
|
9487
9656
|
onSearch(searchValue.trim());
|
@@ -9489,68 +9658,61 @@ const Search = ({
|
|
9489
9658
|
handleSearchClearAndClose('Close');
|
9490
9659
|
}
|
9491
9660
|
};
|
9492
|
-
const onChange = value => {
|
9493
|
-
setSearchValue(value);
|
9494
|
-
if (value === '') {
|
9495
|
-
onSearch('');
|
9496
|
-
}
|
9497
|
-
};
|
9498
|
-
const handleIconClick = () => {
|
9499
|
-
setIsExpanded(!disabled);
|
9500
|
-
};
|
9501
9661
|
const handleSearchClearAndClose = label => {
|
9502
9662
|
setSearchValue('');
|
9503
9663
|
onSearch('');
|
9504
9664
|
if (label === 'Close') {
|
9505
|
-
|
9665
|
+
onClose?.();
|
9506
9666
|
}
|
9507
|
-
if (label === 'Clear' &&
|
9667
|
+
if (label === 'Clear' && isExpand && inputRef.current) {
|
9508
9668
|
inputRef.current.focus();
|
9509
9669
|
}
|
9510
9670
|
};
|
9671
|
+
const handleIconClick = () => {
|
9672
|
+
if (!disabled) {
|
9673
|
+
onExpand?.(!isExpand);
|
9674
|
+
}
|
9675
|
+
};
|
9511
9676
|
return jsxs("div", {
|
9512
9677
|
className: classNames('ff-search-container', {
|
9513
|
-
expanded:
|
9678
|
+
expanded: isExpand,
|
9514
9679
|
disabled: disabled
|
9515
9680
|
}),
|
9516
9681
|
children: [jsx("div", {
|
9517
9682
|
className: classNames('ff-search-icon', {
|
9518
|
-
expanded:
|
9683
|
+
expanded: isExpand
|
9519
9684
|
}),
|
9520
9685
|
onClick: handleIconClick,
|
9521
9686
|
children: jsx(Tooltip, {
|
9522
9687
|
title: "Search",
|
9523
9688
|
children: jsx(Icon, {
|
9524
9689
|
name: "search",
|
9525
|
-
height:
|
9526
|
-
width:
|
9690
|
+
height: isExpand ? 14 : 16,
|
9691
|
+
width: isExpand ? 14 : 16
|
9527
9692
|
})
|
9528
9693
|
})
|
9529
9694
|
}), jsx("div", {
|
9530
9695
|
className: classNames('ff-vertical-line', {
|
9531
|
-
expanded:
|
9696
|
+
expanded: isExpand
|
9532
9697
|
})
|
9533
9698
|
}), jsx("input", {
|
9534
9699
|
className: "ff-search-input",
|
9535
9700
|
name: "input",
|
9536
9701
|
style: {
|
9537
|
-
width:
|
9702
|
+
width: isExpand ? `${width}px` : '0px'
|
9538
9703
|
},
|
9539
9704
|
placeholder: placeholder,
|
9540
9705
|
type: "text",
|
9541
9706
|
value: searchValue,
|
9542
9707
|
disabled: disabled,
|
9543
9708
|
ref: inputRef,
|
9544
|
-
|
9545
|
-
|
9546
|
-
},
|
9709
|
+
autoComplete: "off",
|
9710
|
+
onChange: e => setSearchValue(e.target.value),
|
9547
9711
|
onKeyDown: handleKeyDown
|
9548
|
-
}),
|
9712
|
+
}), isExpand && jsxs(Fragment, {
|
9549
9713
|
children: [jsx("div", {
|
9550
9714
|
className: "ff-search-clear-button",
|
9551
|
-
onClick: () =>
|
9552
|
-
handleSearchClearAndClose('Clear');
|
9553
|
-
},
|
9715
|
+
onClick: () => handleSearchClearAndClose('Clear'),
|
9554
9716
|
children: searchValue !== '' && jsx(Typography, {
|
9555
9717
|
children: 'Clear',
|
9556
9718
|
fontSize: 8,
|
@@ -17487,7 +17649,7 @@ const TimePicker = ({
|
|
17487
17649
|
});
|
17488
17650
|
};
|
17489
17651
|
|
17490
|
-
var css_248z$I = "@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-date-picker .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 {\n position: relative;\n}\n.ff-date-picker .rdp-root {\n --rdp-accent-color: var(--brand-color);\n --rdp-day-height: 24px;\n --rdp-day-width: 36px;\n font-family: \"Poppins\";\n font-size: 12px;\n --rdp-font-family: \"Poppins\", sans-serif;\n}\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.ff-date-picker .ff-date-picker-container {\n display: flex;\n flex-direction: column;\n position: absolute;\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 z-index: 10;\n}\n.ff-date-picker .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 .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 .ff-date-picker-container .ff-date-picker-controls .ff-date-picker-button {\n font-weight: 600;\n line-height: 15px;\n}\n.ff-date-picker .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-date-picker .ff-calendar .ff-calendar-nav-button:disabled {\n cursor: auto;\n opacity: 0.5;\n}\n.ff-date-picker .ff-calendar .ff-calendar-haeder {\n display: flex;\n align-items: center;\n gap: 5px;\n color: var(--text-color);\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid,\n.ff-date-picker .ff-calendar .ff-custom-month_grid {\n width: calc((var(--rdp-day-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-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year,\n.ff-date-picker .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: #f9f9f9;\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year--selected,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month--selected,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year--selected,\n.ff-date-picker .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-date-picker .ff-calendar .rdp-weekdays th {\n color: #6f7c8e;\n font-weight: 400;\n}\n.ff-date-picker .ff-calendar .rdp-day {\n padding: 2px;\n font-weight: 500;\n}\n.ff-date-picker .ff-calendar .rdp-day_button {\n border-radius: 4px;\n padding: 3px 9px;\n}\n.ff-date-picker .ff-calendar .rdp-day_button:hover {\n background-color: var(--hover-color);\n}\n.ff-date-picker .ff-calendar .rdp-selected {\n font: inherit;\n}\n.ff-date-picker .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-date-picker .ff-calendar .rdp-today:not(.rdp-outside) .rdp-day_button {\n border: 2px solid var(--rdp-accent-color);\n}\n.ff-date-picker .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-date-picker .ff-time-picker-container::-webkit-scrollbar {\n display: none;\n}\n.ff-date-picker .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-date-picker .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-date-picker .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-date-picker .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-date-picker .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-date-picker .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-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:hover {\n border-color: var(--input-hover-border-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within {\n border-color: var(--brand-color);\n}\n.ff-date-picker .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-date-picker .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-date-picker .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-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input:focus {\n outline: none;\n}\n.ff-date-picker .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-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container--active {\n border-color: var(--brand-color) !important;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container:hover {\n border-color: var(--input-hover-border-color);\n}\n.ff-date-picker .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-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container:hover svg path {\n fill: var(--brand-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-options {\n position: fixed;\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-date-picker .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-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-options {\n height: 86%;\n overflow-y: auto;\n padding-right: 5px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar {\n width: 4px;\n height: 12px;\n}\n.ff-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar-track {\n background-color: var(--hover-color);\n border-radius: 4px;\n}\n.ff-date-picker .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}";
|
17652
|
+
var css_248z$I = "@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-date-picker .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 {\n position: relative;\n}\n.ff-date-picker .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 .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.ff-date-picker .ff-date-picker-container {\n display: flex;\n flex-direction: column;\n position: absolute;\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 z-index: 10;\n}\n.ff-date-picker .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 .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 .ff-date-picker-container .ff-date-picker-controls .ff-date-picker-button {\n font-weight: 600;\n line-height: 15px;\n}\n.ff-date-picker .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-date-picker .ff-calendar .ff-calendar-nav-button:disabled {\n cursor: auto;\n opacity: 0.5;\n}\n.ff-date-picker .ff-calendar .ff-calendar-haeder {\n display: flex;\n align-items: center;\n gap: 5px;\n color: var(--text-color);\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid,\n.ff-date-picker .ff-calendar .ff-custom-month_grid {\n width: calc((var(--rdp-day-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-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year,\n.ff-date-picker .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: #f9f9f9;\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year--selected,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month--selected,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year--selected,\n.ff-date-picker .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-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year--disabled,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month--disabled,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year--disabled,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-month--disabled {\n color: var(--text-color-light);\n cursor: default;\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year--disabled.ff-custom-month--selected, .ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year--disabled.ff-custom-year--selected,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month--disabled.ff-custom-month--selected,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month--disabled.ff-custom-year--selected,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year--disabled.ff-custom-month--selected,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year--disabled.ff-custom-year--selected,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-month--disabled.ff-custom-month--selected,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-month--disabled.ff-custom-year--selected {\n background-color: var(--disable-color);\n}\n.ff-date-picker .ff-calendar .rdp-weekdays th {\n color: #6f7c8e;\n font-weight: 400;\n}\n.ff-date-picker .ff-calendar .rdp-day {\n padding: 2px;\n font-weight: 500;\n}\n.ff-date-picker .ff-calendar .rdp-day_button {\n border-radius: 4px;\n padding: 3px 9px;\n}\n.ff-date-picker .ff-calendar .rdp-day_button:hover {\n background-color: var(--hover-color);\n}\n.ff-date-picker .ff-calendar .rdp-selected {\n font: inherit;\n}\n.ff-date-picker .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-date-picker .ff-calendar .rdp-today:not(.rdp-outside) .rdp-day_button {\n border: 2px solid var(--rdp-accent-color);\n}\n.ff-date-picker .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-date-picker .ff-time-picker-container::-webkit-scrollbar {\n display: none;\n}\n.ff-date-picker .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-date-picker .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-date-picker .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-date-picker .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-date-picker .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-date-picker .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-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:hover {\n border-color: var(--input-hover-border-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within {\n border-color: var(--brand-color);\n}\n.ff-date-picker .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-date-picker .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-date-picker .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-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input:focus {\n outline: none;\n}\n.ff-date-picker .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-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container--active {\n border-color: var(--brand-color) !important;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container:hover {\n border-color: var(--input-hover-border-color);\n}\n.ff-date-picker .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-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container:hover svg path {\n fill: var(--brand-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-options {\n position: fixed;\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-date-picker .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-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-options {\n height: 86%;\n overflow-y: auto;\n padding-right: 5px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar {\n width: 4px;\n height: 12px;\n}\n.ff-date-picker .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-date-picker .ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar-track {\n background-color: var(--hover-color);\n border-radius: 4px;\n}\n.ff-date-picker .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}";
|
17491
17653
|
styleInject(css_248z$I);
|
17492
17654
|
|
17493
17655
|
const CustomDatePicker = ({
|
@@ -17649,6 +17811,19 @@ const CustomDatePicker = ({
|
|
17649
17811
|
setStartYear(prev => prev - 12);
|
17650
17812
|
}
|
17651
17813
|
};
|
17814
|
+
const isDisabledDate = (year, month, minDate, maxDate) => {
|
17815
|
+
const isMinDateValid = minDate instanceof Date && !isNaN(minDate.getTime());
|
17816
|
+
const isMaxDateValid = maxDate instanceof Date && !isNaN(maxDate.getTime());
|
17817
|
+
if (isMinDateValid) {
|
17818
|
+
if (year !== null && year < minDate.getFullYear()) return true;
|
17819
|
+
if (year !== null && month !== null && year === minDate.getFullYear() && month < minDate.getMonth()) return true;
|
17820
|
+
}
|
17821
|
+
if (isMaxDateValid) {
|
17822
|
+
if (year !== null && year > maxDate.getFullYear()) return true;
|
17823
|
+
if (year !== null && month !== null && year === maxDate.getFullYear() && month > maxDate.getMonth()) return true;
|
17824
|
+
}
|
17825
|
+
return false;
|
17826
|
+
};
|
17652
17827
|
useEffect(() => {
|
17653
17828
|
if (isPickerOpen && view === 'years') {
|
17654
17829
|
const currentYear = selectedMonth?.getFullYear() ?? new Date().getFullYear();
|
@@ -17686,15 +17861,19 @@ const CustomDatePicker = ({
|
|
17686
17861
|
const CustomMonthGrid = () => {
|
17687
17862
|
return jsx("div", {
|
17688
17863
|
className: "ff-custom-month_grid",
|
17689
|
-
children: months.map((month, index) =>
|
17690
|
-
|
17691
|
-
|
17692
|
-
|
17693
|
-
|
17694
|
-
|
17695
|
-
|
17696
|
-
|
17697
|
-
|
17864
|
+
children: months.map((month, index) => {
|
17865
|
+
const isDisabled = isDisabledDate(selectedMonth?.getFullYear() || null, index, minDate, maxDate);
|
17866
|
+
return jsx("div", {
|
17867
|
+
onClick: () => !isDisabled && handleMonthSelect(index),
|
17868
|
+
className: classNames('ff-custom-month', {
|
17869
|
+
'ff-custom-month--selected': index === selectedMonth?.getMonth(),
|
17870
|
+
'ff-custom-month--disabled': isDisabled
|
17871
|
+
}),
|
17872
|
+
children: jsx(Typography, {
|
17873
|
+
children: month
|
17874
|
+
})
|
17875
|
+
}, index);
|
17876
|
+
})
|
17698
17877
|
});
|
17699
17878
|
};
|
17700
17879
|
const CustomPrevButton = ({
|
@@ -17731,15 +17910,19 @@ const CustomDatePicker = ({
|
|
17731
17910
|
const CustomYearGrid = () => {
|
17732
17911
|
return jsx("div", {
|
17733
17912
|
className: "ff-custom-year_grid",
|
17734
|
-
children: years.map(year =>
|
17735
|
-
|
17736
|
-
|
17737
|
-
|
17738
|
-
|
17739
|
-
|
17740
|
-
|
17741
|
-
|
17742
|
-
|
17913
|
+
children: years.map(year => {
|
17914
|
+
const isDisabled = isDisabledDate(year, null, minDate, maxDate);
|
17915
|
+
return jsx("div", {
|
17916
|
+
onClick: () => !isDisabled && handleYearSelect(year),
|
17917
|
+
className: classNames('ff-custom-year', {
|
17918
|
+
'ff-custom-year--selected': year === selectedMonth?.getFullYear(),
|
17919
|
+
'ff-custom-year--disabled': isDisabled
|
17920
|
+
}),
|
17921
|
+
children: jsx(Typography, {
|
17922
|
+
children: year
|
17923
|
+
})
|
17924
|
+
}, year);
|
17925
|
+
})
|
17743
17926
|
});
|
17744
17927
|
};
|
17745
17928
|
return jsxs("div", {
|
@@ -23339,15 +23522,17 @@ const PieChart = ({
|
|
23339
23522
|
});
|
23340
23523
|
};
|
23341
23524
|
|
23342
|
-
var css_248z$C = ".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 background-color: var(--brand-color);\n transform: translateY(12px);\n border-radius: 20px;\n padding: 5px;\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: 100px; /* 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: 550px;\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}\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: 6px;\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 .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}";
|
23525
|
+
var css_248z$C = ".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: 5px;\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: 100px; /* 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: 550px;\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: 6px;\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}";
|
23343
23526
|
styleInject(css_248z$C);
|
23344
23527
|
|
23345
23528
|
const AppHeader = ({
|
23346
23529
|
logoIconName = 'fireflink_icon',
|
23530
|
+
width,
|
23347
23531
|
leftContent,
|
23348
23532
|
rightContent,
|
23349
23533
|
projectsList,
|
23350
23534
|
appHeaderMenuItems,
|
23535
|
+
appHeaderHiddenMenuItems,
|
23351
23536
|
selectedMenu,
|
23352
23537
|
selectedSubMenu,
|
23353
23538
|
selectedQuickMenu,
|
@@ -23363,11 +23548,6 @@ const AppHeader = ({
|
|
23363
23548
|
onProjectDropdownLabelClick = () => {},
|
23364
23549
|
onMoreMenuOptionClick = () => {}
|
23365
23550
|
}) => {
|
23366
|
-
const [appHeaderHiddenMenuItems, setAppHeaderHiddenMenuItems] = useState([]);
|
23367
|
-
const onSubMenuClickHandler = subMenu => {
|
23368
|
-
setAppHeaderHiddenMenuItems(subMenu.hiddenMenuItems ? subMenu.hiddenMenuItems : []);
|
23369
|
-
onSubMenuClick(subMenu);
|
23370
|
-
};
|
23371
23551
|
return jsx("div", {
|
23372
23552
|
className: "ff-app-header-main",
|
23373
23553
|
children: jsxs("div", {
|
@@ -23388,6 +23568,9 @@ const AppHeader = ({
|
|
23388
23568
|
})]
|
23389
23569
|
}), !checkEmpty(appHeaderMenuItems) && jsxs("div", {
|
23390
23570
|
className: "ff-app-header-nav-bar",
|
23571
|
+
style: {
|
23572
|
+
width: width
|
23573
|
+
},
|
23391
23574
|
children: [projectsList && !checkEmpty(projectsList) && jsx("div", {
|
23392
23575
|
children: jsx(AllProjectsDropdown, {
|
23393
23576
|
onClick: onProjectMenuClick,
|
@@ -23399,7 +23582,7 @@ const AppHeader = ({
|
|
23399
23582
|
}), jsx("div", {
|
23400
23583
|
className: "ff-app-header-nav-bar-items fontSm",
|
23401
23584
|
children: appHeaderMenuItems.map(menuItem => {
|
23402
|
-
return jsxs("div", {
|
23585
|
+
return !appHeaderHiddenMenuItems?.find(menu => menu.label === menuItem.label) && jsxs("div", {
|
23403
23586
|
className: classNames('ff-app-header-nav-bar-item', {
|
23404
23587
|
['ff-app-header-nav-bar-item--selected']: menuItem.label === selectedMenu
|
23405
23588
|
}),
|
@@ -23419,7 +23602,7 @@ const AppHeader = ({
|
|
23419
23602
|
['ff-app-header-nav-bar-submenu-item--selected']: subMenuItem.label === selectedSubMenu
|
23420
23603
|
}),
|
23421
23604
|
lineHeight: "18px",
|
23422
|
-
onClick: () =>
|
23605
|
+
onClick: () => onSubMenuClick(subMenuItem),
|
23423
23606
|
children: subMenuItem.label
|
23424
23607
|
})
|
23425
23608
|
}, subMenuItem.label);
|
@@ -23427,7 +23610,8 @@ const AppHeader = ({
|
|
23427
23610
|
return jsx("div", {
|
23428
23611
|
className: "ff-app-header-submenu-container",
|
23429
23612
|
children: subMenuItem.label === selectedSubMenu && subMenuItem?.quickMenuItems && jsxs("div", {
|
23430
|
-
className
|
23613
|
+
// className="ff-app-header-quickmenu-container"
|
23614
|
+
className: classNames('ff-app-header-quickmenu-container', subMenuItem.quickMenuItems?.length ? 'visible' : ''),
|
23431
23615
|
children: [jsx("div", {
|
23432
23616
|
children: jsx(Icon, {
|
23433
23617
|
name: "vertical_separator"
|
@@ -23495,7 +23679,7 @@ const Paper = ({
|
|
23495
23679
|
});
|
23496
23680
|
};
|
23497
23681
|
|
23498
|
-
var css_248z$A = ".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, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\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, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\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 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: grid;\n
|
23682
|
+
var css_248z$A = ".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, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\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, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\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: grid;\n grid-auto-rows: 1fr;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-number-legend {\n grid-template-columns: repeat(3, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-number-legend.ff-side-legend {\n grid-template-columns: repeat(2, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-number-legend .ff-legend-item {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend {\n grid-template-columns: repeat(2, 130px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend .ff-legend-item {\n display: flex;\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-container.ff-memory-legend {\n grid-template-columns: repeat(3, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-memory-legend.ff-side-legend {\n grid-template-columns: repeat(2, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-memory-legend .ff-legend-item {\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table-wrapper {\n overflow: hidden;\n border: 1px solid var(--border-color);\n border-radius: 4px;\n margin-left: 1rem;\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-table-header {\n font-weight: bold;\n background-color: var(--tabs-bg-color);\n color: var(--input-hover-border-color);\n padding: 0.5rem;\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.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: 0.5rem;\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}";
|
23499
23683
|
styleInject(css_248z$A);
|
23500
23684
|
|
23501
23685
|
const calculateArc$2 = (x, y, radius, startAngle, endAngle) => {
|
@@ -23509,6 +23693,7 @@ const calculateArc$2 = (x, y, radius, startAngle, endAngle) => {
|
|
23509
23693
|
const colorMapping = ['var(--status-success-text-color)', 'var(--status-rejected-text-color)', 'var(--status-warning-text-color)', 'var(--status-button-text-skipped)', 'var(--brand-color)'];
|
23510
23694
|
const DashboardDonutChart = ({
|
23511
23695
|
radius = 60,
|
23696
|
+
tableWidth,
|
23512
23697
|
lineWidth = 15,
|
23513
23698
|
statusValues = [],
|
23514
23699
|
gapAngle = 0,
|
@@ -23521,7 +23706,12 @@ const DashboardDonutChart = ({
|
|
23521
23706
|
labelFontSize = 24,
|
23522
23707
|
subLabelFontSize = 14,
|
23523
23708
|
legendPosition = 'bottom',
|
23524
|
-
|
23709
|
+
chartGap = 0,
|
23710
|
+
legendGap = 5,
|
23711
|
+
legendValueFontSize = 22,
|
23712
|
+
legendKeyFontSize = 12,
|
23713
|
+
labelYoffSet = -5,
|
23714
|
+
subLabelYoffSet = 20
|
23525
23715
|
}) => {
|
23526
23716
|
const [hoveredItemIndex, setHoveredItemIndex] = useState(null);
|
23527
23717
|
const [tooltipPosition, setTooltipPosition] = useState({
|
@@ -23616,7 +23806,7 @@ const DashboardDonutChart = ({
|
|
23616
23806
|
};
|
23617
23807
|
const SVG_PADDING = 3;
|
23618
23808
|
const DONUT_SVG_SIZE = radius * 2 + lineWidth + SVG_PADDING * 2;
|
23619
|
-
const LABEL_MAX_WIDTH = radius * 2 - lineWidth - SVG_PADDING;
|
23809
|
+
const LABEL_MAX_WIDTH = radius * 2 - lineWidth - SVG_PADDING * 2;
|
23620
23810
|
const renderArc = (chartItem, endAngle, i) => {
|
23621
23811
|
const isFullCircle = nonZeroValues.length === 1;
|
23622
23812
|
// Full circle handling
|
@@ -23644,7 +23834,7 @@ const DashboardDonutChart = ({
|
|
23644
23834
|
},
|
23645
23835
|
children: [jsx(Typography, {
|
23646
23836
|
fontSize: 12,
|
23647
|
-
children: hoveredItemIndex !== null && `${nonZeroValues[hoveredItemIndex]?.key}
|
23837
|
+
children: hoveredItemIndex !== null && `${nonZeroValues[hoveredItemIndex]?.key}:`
|
23648
23838
|
}), jsx(Typography, {
|
23649
23839
|
fontSize: 12,
|
23650
23840
|
children: hoveredItemIndex !== null && (legendType === 'memoryLegend' ? `${nonZeroValues[hoveredItemIndex]?.labelValue} ${nonZeroValues[hoveredItemIndex]?.unit}` : nonZeroValues[hoveredItemIndex]?.value)
|
@@ -23658,16 +23848,19 @@ const DashboardDonutChart = ({
|
|
23658
23848
|
className: classNames('ff-legend-container ff-number-legend', {
|
23659
23849
|
'ff-side-legend': legendPosition === 'left' || legendPosition === 'right'
|
23660
23850
|
}),
|
23851
|
+
style: {
|
23852
|
+
gap: `${legendGap}px`
|
23853
|
+
},
|
23661
23854
|
children: legendData.map((item, index) => jsxs("div", {
|
23662
23855
|
className: "ff-legend-item",
|
23663
23856
|
children: [jsxs(Typography, {
|
23664
|
-
fontSize:
|
23857
|
+
fontSize: legendValueFontSize,
|
23665
23858
|
fontWeight: "semi-bold",
|
23666
23859
|
className: "ff-legend-value",
|
23667
23860
|
color: item.color ? item.color : colorMapping[index % colorMapping.length],
|
23668
23861
|
children: [item.value, " ", showUnit && unit?.toUpperCase()]
|
23669
23862
|
}), jsx(Typography, {
|
23670
|
-
fontSize:
|
23863
|
+
fontSize: legendKeyFontSize,
|
23671
23864
|
className: "ff-legend-key",
|
23672
23865
|
textAlign: "center",
|
23673
23866
|
children: item.key
|
@@ -23676,7 +23869,10 @@ const DashboardDonutChart = ({
|
|
23676
23869
|
});
|
23677
23870
|
case 'pillLegend':
|
23678
23871
|
return jsx("div", {
|
23679
|
-
className: "ff-legend-container ff-pill-legend
|
23872
|
+
className: "ff-legend-container ff-pill-legend",
|
23873
|
+
style: {
|
23874
|
+
gap: `${legendGap}px`
|
23875
|
+
},
|
23680
23876
|
children: legendData.map((item, index) => jsxs("div", {
|
23681
23877
|
className: "ff-legend-item",
|
23682
23878
|
children: [jsx("span", {
|
@@ -23689,6 +23885,7 @@ const DashboardDonutChart = ({
|
|
23689
23885
|
children: item.value
|
23690
23886
|
})
|
23691
23887
|
}), jsx(Typography, {
|
23888
|
+
fontSize: legendKeyFontSize,
|
23692
23889
|
className: "ff-legend-key",
|
23693
23890
|
children: item.key
|
23694
23891
|
})]
|
@@ -23699,16 +23896,20 @@ const DashboardDonutChart = ({
|
|
23699
23896
|
className: classNames('ff-legend-container ff-memory-legend', {
|
23700
23897
|
'ff-side-legend': legendPosition === 'left' || legendPosition === 'right'
|
23701
23898
|
}),
|
23899
|
+
style: {
|
23900
|
+
gap: `${legendGap}px`
|
23901
|
+
},
|
23702
23902
|
children: legendData.map((item, index) => jsx(React__default.Fragment, {
|
23703
23903
|
children: jsxs("div", {
|
23704
23904
|
className: "ff-legend-item",
|
23705
23905
|
children: [jsxs(Typography, {
|
23706
|
-
fontSize:
|
23707
|
-
fontWeight: "
|
23906
|
+
fontSize: legendValueFontSize,
|
23907
|
+
fontWeight: "semi-bold",
|
23708
23908
|
className: "ff-legend-value",
|
23709
23909
|
color: item.color ? item.color : colorMapping[index % colorMapping.length],
|
23710
|
-
children: [item.labelValue,
|
23910
|
+
children: [Number.isInteger(item.labelValue) ? item.labelValue : item.labelValue?.toFixed(2), ' ', item.unit]
|
23711
23911
|
}), jsx(Typography, {
|
23912
|
+
fontSize: legendKeyFontSize,
|
23712
23913
|
className: "ff-legend-key",
|
23713
23914
|
textAlign: "center",
|
23714
23915
|
children: item.key
|
@@ -23725,9 +23926,12 @@ const DashboardDonutChart = ({
|
|
23725
23926
|
children: jsxs("tr", {
|
23726
23927
|
children: [jsx("th", {
|
23727
23928
|
className: "ff-table-header",
|
23929
|
+
style: {
|
23930
|
+
width: tableWidth
|
23931
|
+
},
|
23728
23932
|
children: "Name"
|
23729
23933
|
}), jsx("th", {
|
23730
|
-
className: "ff-table-header",
|
23934
|
+
className: "ff-table-header ",
|
23731
23935
|
children: "%"
|
23732
23936
|
}), jsx("th", {
|
23733
23937
|
className: "ff-table-header",
|
@@ -23805,7 +24009,7 @@ const DashboardDonutChart = ({
|
|
23805
24009
|
'legend-position-left': legendPosition === 'left'
|
23806
24010
|
}),
|
23807
24011
|
style: {
|
23808
|
-
gap: `${
|
24012
|
+
gap: `${chartGap}px`
|
23809
24013
|
},
|
23810
24014
|
children: [jsxs("div", {
|
23811
24015
|
className: "ff-dashboard-donut-chart-svg-container",
|
@@ -23835,10 +24039,10 @@ const DashboardDonutChart = ({
|
|
23835
24039
|
dy: index === 0 ? lines.length > 1 ? -8 : 0 : 24,
|
23836
24040
|
children: line
|
23837
24041
|
}, index))
|
23838
|
-
}) : (legendType !== 'tableLegend' || hoveredItemIndex !== null) && jsxs(Fragment, {
|
24042
|
+
}) : (legendType !== 'tableLegend' || hoveredItemIndex !== null || hoveredItemIndex == null) && jsxs(Fragment, {
|
23839
24043
|
children: [jsx("text", {
|
23840
24044
|
x: "0",
|
23841
|
-
y:
|
24045
|
+
y: labelYoffSet,
|
23842
24046
|
textAnchor: "middle",
|
23843
24047
|
fill: colorMapping[3],
|
23844
24048
|
style: {
|
@@ -23846,12 +24050,12 @@ const DashboardDonutChart = ({
|
|
23846
24050
|
},
|
23847
24051
|
children: wrapText(legendType === 'tableLegend' && hoveredItemIndex !== null && nonZeroValues[hoveredItemIndex] ? `${(nonZeroValues[hoveredItemIndex].value / total * 100).toFixed(1)}%` : legendType === 'memoryLegend' ? `${totalMemory}` : `${total} ${showUnit && unit ? `${unit.toUpperCase()}` : ''}`, LABEL_MAX_WIDTH, labelFontSize).map((line, index) => jsx("tspan", {
|
23848
24052
|
x: "0",
|
23849
|
-
dy: index === 0 ? 0 :
|
24053
|
+
dy: index === 0 ? 0 : labelFontSize,
|
23850
24054
|
children: line
|
23851
24055
|
}, index))
|
23852
24056
|
}), jsx("text", {
|
23853
24057
|
x: "0",
|
23854
|
-
y:
|
24058
|
+
y: subLabelYoffSet,
|
23855
24059
|
textAnchor: "middle",
|
23856
24060
|
fill: "var(--text-color)",
|
23857
24061
|
style: {
|
@@ -23859,19 +24063,12 @@ const DashboardDonutChart = ({
|
|
23859
24063
|
},
|
23860
24064
|
children: wrapText(legendType === 'tableLegend' && hoveredItemIndex !== null && nonZeroValues[hoveredItemIndex] ? nonZeroValues[hoveredItemIndex].key : legendDetailsType, LABEL_MAX_WIDTH, subLabelFontSize).map((line, index) => jsx("tspan", {
|
23861
24065
|
x: "0",
|
23862
|
-
dy: index === 0 ? 0 :
|
24066
|
+
dy: index === 0 ? 0 : subLabelFontSize,
|
23863
24067
|
children: line
|
23864
24068
|
}, index))
|
23865
24069
|
})]
|
23866
24070
|
})]
|
23867
24071
|
})
|
23868
|
-
}), legendType === 'tableLegend' && jsxs("div", {
|
23869
|
-
children: [jsxs(Typography, {
|
23870
|
-
fontWeight: "semi-bold",
|
23871
|
-
children: [legendDetailsType, " "]
|
23872
|
-
}), jsxs(Typography, {
|
23873
|
-
children: [" ", `Total ${legendDetailsType} - ${total}`, " "]
|
23874
|
-
})]
|
23875
24072
|
}), showTooltip && renderTooltip()]
|
23876
24073
|
}), isLegendDetails && renderLegend(chartValues, legendType, legendPosition)]
|
23877
24074
|
});
|
@@ -32547,7 +32744,7 @@ const ExcelFile = ({
|
|
32547
32744
|
});
|
32548
32745
|
};
|
32549
32746
|
|
32550
|
-
var css_248z$h = ".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-Module-chip {\n width:
|
32747
|
+
var css_248z$h = ".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-Module-chip {\n width: 68px;\n height: 30px;\n color: var(--table-column-text-color);\n border: 1px solid var(--ff-editor-line-bg);\n border-radius: 16px;\n cursor: pointer;\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n}\n.ff-Module-chip .module-typography {\n color: var(--table-column-text-color);\n}\n.ff-Module-chip--active {\n border: 0.5px solid var(--brand-color);\n background: var(--brand-color);\n}\n.ff-Module-chip--active .module-typography {\n color: var(--base-bg-color);\n font-weight: 600;\n}\n.ff-Module-chip--hover:hover {\n border: 0.5px solid var(--brand-color);\n background-color: var(--hover-color);\n}\n.ff-Module-chip--hover:hover .module-typography {\n color: var(--table-column-text-color);\n font-weight: 600;\n}";
|
32551
32748
|
styleInject(css_248z$h);
|
32552
32749
|
|
32553
32750
|
const ModuleChip = ({
|
@@ -32557,19 +32754,14 @@ const ModuleChip = ({
|
|
32557
32754
|
}) => {
|
32558
32755
|
return jsx("div", {
|
32559
32756
|
className: classNames('ff-Module-chip', {
|
32560
|
-
'ff-Module-chip--active': isActive
|
32757
|
+
'ff-Module-chip--active': isActive,
|
32758
|
+
'ff-Module-chip--hover': !isActive
|
32561
32759
|
}),
|
32562
32760
|
onClick: onClick,
|
32563
|
-
children: jsx(
|
32564
|
-
|
32565
|
-
|
32566
|
-
|
32567
|
-
children: jsx(Typography, {
|
32568
|
-
fontSize: '14px',
|
32569
|
-
fontWeight: "regular",
|
32570
|
-
lineHeight: "21px",
|
32571
|
-
children: label
|
32572
|
-
})
|
32761
|
+
children: jsx(Typography, {
|
32762
|
+
lineHeight: "18px",
|
32763
|
+
className: "module-typography",
|
32764
|
+
children: label
|
32573
32765
|
})
|
32574
32766
|
});
|
32575
32767
|
};
|
@@ -32886,7 +33078,7 @@ const VariableDropdown = ({
|
|
32886
33078
|
});
|
32887
33079
|
};
|
32888
33080
|
|
32889
|
-
var css_248z$c = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-line-chart-inner-tooltip, .ff--line-chart-x-line-data, .ff-line-chart-y-axis-text, .ff-line-chart-date {\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-line-chart-x-axis-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-line-chart-container {\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.ff-line-chart-text {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n}\n.ff-line-chart-text .smooth-dot {\n transition: cx 0.2s ease, cy 0.2s ease;\n}\n\n.ff-line-chart-yAxisLabel {\n display: flex;\n white-space: nowrap;\n transform: rotate(270deg) translateX(
|
33081
|
+
var css_248z$c = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-line-chart-inner-tooltip, .ff--line-chart-x-line-data, .ff-line-chart-y-axis-text, .ff-line-chart-date {\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-line-chart-x-axis-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-line-chart-container {\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.ff-line-chart-text {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n}\n.ff-line-chart-text .smooth-dot {\n transition: cx 0.2s ease, cy 0.2s ease;\n}\n\n.ff-line-chart-yAxisLabel-warpper {\n position: relative;\n min-width: 20px;\n height: 100%;\n}\n.ff-line-chart-yAxisLabel-warpper .ff-line-chart-yAxisLabel {\n position: absolute;\n right: 0;\n top: 50%;\n display: flex;\n white-space: nowrap;\n transform: rotate(270deg) translateX(60%);\n transform-origin: right center;\n}\n\n.ff-line-chart-text1 {\n transform-origin: center;\n transform: rotate(-90deg);\n transition: transform 1s ease-in-out;\n position: relative;\n left: 163px;\n min-width: 10px;\n color: var(--drawer-title-color);\n}\n\n.ff-line-chart-tooltip {\n position: absolute;\n background-color: var(--tooltip-bg-color);\n border-radius: 4px;\n pointer-events: none;\n display: flex;\n flex-direction: column;\n min-width: 30px;\n min-height: 30px;\n justify-content: center;\n align-items: flex-start;\n row-gap: 10px;\n padding: 8px !important;\n}\n\n.ff-line-chart-status-dot {\n width: 16px;\n height: 16px;\n border-radius: 100%;\n}\n\n.ff-line-chart-inner-tooltip {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 5px;\n color: var(--arrow-button-bg-color);\n}\n\n.ff-line-chart-date {\n height: 100%;\n width: 100%;\n display: flex;\n justify-content: center;\n align-items: flex-start;\n border-bottom: 1px solid var(--arrow-button-bg-color);\n color: var(--arrow-button-bg-color);\n}\n\n.ff-line-chart-x-axis-label {\n font-weight: 600;\n}";
|
32890
33082
|
styleInject(css_248z$c);
|
32891
33083
|
|
32892
33084
|
const LineChart = ({
|
@@ -32999,9 +33191,13 @@ const LineChart = ({
|
|
32999
33191
|
return jsxs("div", {
|
33000
33192
|
className: "ff-line-chart-text",
|
33001
33193
|
style: {
|
33002
|
-
width: width
|
33194
|
+
width: width + 20
|
33003
33195
|
},
|
33004
33196
|
children: [jsxs("div", {
|
33197
|
+
className: "ff-line-chart-yAxisLabel-warpper",
|
33198
|
+
style: {
|
33199
|
+
height: height
|
33200
|
+
},
|
33005
33201
|
children: [' ', jsx(Typography, {
|
33006
33202
|
className: "ff-line-chart-yAxisLabel",
|
33007
33203
|
fontSize: textSize,
|
@@ -33012,6 +33208,7 @@ const LineChart = ({
|
|
33012
33208
|
className: "ff-line-chart-svg",
|
33013
33209
|
children: [' ', jsx("svg", {
|
33014
33210
|
height: height,
|
33211
|
+
width: width,
|
33015
33212
|
onMouseMove: handleMouseMove,
|
33016
33213
|
onMouseLeave: handleMouseLeave,
|
33017
33214
|
className: "ff-line-chart-svg",
|
@@ -33308,7 +33505,7 @@ const CreateVariableSlider = ({
|
|
33308
33505
|
required: true,
|
33309
33506
|
type: "text",
|
33310
33507
|
name: "variable name",
|
33311
|
-
value: variableName,
|
33508
|
+
value: variableName || '',
|
33312
33509
|
onChange: event => onNameChange(event.target.value)
|
33313
33510
|
}), jsx(Select$1, {
|
33314
33511
|
label: "Variable Type",
|
@@ -33322,7 +33519,7 @@ const CreateVariableSlider = ({
|
|
33322
33519
|
required: true,
|
33323
33520
|
type: "text",
|
33324
33521
|
name: "value",
|
33325
|
-
value: value,
|
33522
|
+
value: value || '',
|
33326
33523
|
onChange: event => onValueChange(event.target.value)
|
33327
33524
|
}), jsxs("div", {
|
33328
33525
|
className: "ff-hide-value-content",
|
@@ -38834,7 +39031,7 @@ const throttle = (func, limit) => {
|
|
38834
39031
|
return throttled;
|
38835
39032
|
};
|
38836
39033
|
|
38837
|
-
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 .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
|
39034
|
+
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}";
|
38838
39035
|
styleInject(css_248z$7);
|
38839
39036
|
|
38840
39037
|
const BarChart = ({
|
@@ -38852,7 +39049,8 @@ const BarChart = ({
|
|
38852
39049
|
showXAxisLabels = true,
|
38853
39050
|
icons = [],
|
38854
39051
|
iconSize,
|
38855
|
-
legendPosition = 'bottom'
|
39052
|
+
legendPosition = 'bottom',
|
39053
|
+
legendGap = 5
|
38856
39054
|
}) => {
|
38857
39055
|
const [tooltip, setTooltip] = useState({
|
38858
39056
|
visible: false,
|
@@ -38865,7 +39063,7 @@ const BarChart = ({
|
|
38865
39063
|
const topPadding = 40;
|
38866
39064
|
const leftPadding = 40;
|
38867
39065
|
const totalBarWidth = data.length * barWidth + (data.length - 1) * barGap;
|
38868
|
-
const chartWidth = totalBarWidth + leftPadding * 2;
|
39066
|
+
const chartWidth = totalBarWidth + leftPadding * 2 + 10;
|
38869
39067
|
const renderGradients = gradients => {
|
38870
39068
|
return gradients.map((gradient, index) => jsx("defs", {
|
38871
39069
|
children: jsx("linearGradient", {
|
@@ -38913,13 +39111,15 @@ const BarChart = ({
|
|
38913
39111
|
return jsxs("div", {
|
38914
39112
|
className: "ff-bar-chart-container",
|
38915
39113
|
style: {
|
38916
|
-
width: chartWidth
|
38917
|
-
height
|
39114
|
+
width: chartWidth
|
38918
39115
|
},
|
38919
39116
|
children: [legend && legendPosition === 'top' && jsx("div", {
|
38920
39117
|
className: "ff-legend-container",
|
38921
39118
|
children: jsx("div", {
|
38922
39119
|
className: "ff-bar-chart-legend",
|
39120
|
+
style: {
|
39121
|
+
gap: `${legendGap}px`
|
39122
|
+
},
|
38923
39123
|
children: data.map((item, index) => jsxs("div", {
|
38924
39124
|
className: "ff-bar-chart-legend-item",
|
38925
39125
|
children: [icons[index] && typeof icons[index] === 'string' ? jsx(Icon, {
|
@@ -38943,7 +39143,7 @@ const BarChart = ({
|
|
38943
39143
|
}), jsx("div", {
|
38944
39144
|
children: jsxs("svg", {
|
38945
39145
|
width: chartWidth,
|
38946
|
-
height: height + topPadding +
|
39146
|
+
height: height + topPadding + 5 + (showXAxisLabels ? 20 : 0) + (xAxisLabel ? 20 : 0),
|
38947
39147
|
children: [Array.isArray(colors) && colors.length > 0 && renderGradients(colors), Array.from({
|
38948
39148
|
length: yAxisDivisions + 1
|
38949
39149
|
}).map((_, i) => {
|
@@ -39001,7 +39201,7 @@ const BarChart = ({
|
|
39001
39201
|
strokeWidth: "1"
|
39002
39202
|
}), xAxisLabel && jsx("text", {
|
39003
39203
|
x: chartWidth / 2,
|
39004
|
-
y: height + topPadding + 40,
|
39204
|
+
y: height + topPadding + (showXAxisLabels ? 40 : 20),
|
39005
39205
|
fontSize: "12",
|
39006
39206
|
fill: "black",
|
39007
39207
|
textAnchor: "middle",
|
@@ -39022,6 +39222,9 @@ const BarChart = ({
|
|
39022
39222
|
className: "ff-legend-container",
|
39023
39223
|
children: jsx("div", {
|
39024
39224
|
className: "ff-bar-chart-legend",
|
39225
|
+
style: {
|
39226
|
+
gap: `${legendGap}px`
|
39227
|
+
},
|
39025
39228
|
children: data.map((item, index) => jsxs("div", {
|
39026
39229
|
className: "ff-bar-chart-legend-item",
|
39027
39230
|
children: [icons[index] && typeof icons[index] === 'string' ? jsx(Icon, {
|
@@ -46747,12 +46950,13 @@ const PopUpModal = ({
|
|
46747
46950
|
subTitleMessage = 'Unsaved Changes.',
|
46748
46951
|
iconName,
|
46749
46952
|
modalMessage = 'Your web service data will be lost. Are you sure you want to exit?',
|
46750
|
-
footerMessage = 'How do you want to proceed?',
|
46751
46953
|
firstButtonLabel = 'Cancel',
|
46752
46954
|
secondButtonLabel = 'Continue',
|
46753
46955
|
buttonVariant = 'warning',
|
46754
46956
|
border = '1px solid var(--warning-modal-border-color)',
|
46755
|
-
|
46957
|
+
popupWidth = '420',
|
46958
|
+
colorForTitleMessage = 'var(--status-button-bg-warning)',
|
46959
|
+
footerContent
|
46756
46960
|
}) => {
|
46757
46961
|
return jsx(Modal, {
|
46758
46962
|
overlayClassName: "custom-overlay",
|
@@ -46786,8 +46990,8 @@ const PopUpModal = ({
|
|
46786
46990
|
fontSize: 16,
|
46787
46991
|
children: modalMessage
|
46788
46992
|
}), jsx(Typography, {
|
46789
|
-
|
46790
|
-
children:
|
46993
|
+
as: 'div',
|
46994
|
+
children: footerContent
|
46791
46995
|
})]
|
46792
46996
|
})]
|
46793
46997
|
})]
|
@@ -46806,13 +47010,36 @@ const PopUpModal = ({
|
|
46806
47010
|
}),
|
46807
47011
|
ariaHideApp: true,
|
46808
47012
|
isFooterDisplayed: false,
|
46809
|
-
customWidth:
|
47013
|
+
customWidth: `${popupWidth}px`,
|
46810
47014
|
customHeight: "226px",
|
46811
47015
|
boxShadow: "0px 1px 4px 0px var(--toaster-boxshadow)",
|
46812
47016
|
border: border
|
46813
47017
|
});
|
46814
47018
|
};
|
46815
47019
|
|
47020
|
+
function formatCamelCaseString(input, removeSections = []) {
|
47021
|
+
// Removed specified sections from the string
|
47022
|
+
const processedString = removeSections.reduce((str, section) => str.replace(new RegExp(section + '$', 'i'), ''), input);
|
47023
|
+
// Add spaces before capital letters and capitalized the first letter
|
47024
|
+
const formatted = processedString.replace(/([A-Z])/g, ' $1').trim().replace(/^./, str => str.toUpperCase());
|
47025
|
+
return formatted;
|
47026
|
+
}
|
47027
|
+
function formatSnakeOrUppercaseString(input) {
|
47028
|
+
return input.toLowerCase().replace(/_/g, ' ').replace(/^./, str => str.toUpperCase());
|
47029
|
+
}
|
47030
|
+
function formatString(input, removeSections = []) {
|
47031
|
+
if (input.toUpperCase() === input) {
|
47032
|
+
// Handled completely uppercase strings
|
47033
|
+
input = input.toLowerCase();
|
47034
|
+
}
|
47035
|
+
if (input.includes('_')) {
|
47036
|
+
// Handled snake case or uppercase strings
|
47037
|
+
return formatSnakeOrUppercaseString(input);
|
47038
|
+
}
|
47039
|
+
// Handled camel case strings
|
47040
|
+
return formatCamelCaseString(input, removeSections);
|
47041
|
+
}
|
47042
|
+
|
46816
47043
|
var css_248z$1 = ".ff-add-variable-container {\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 8px;\n position: relative;\n}\n.ff-add-variable-container .ff-add-variable-input {\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n}";
|
46817
47044
|
styleInject(css_248z$1);
|
46818
47045
|
|
@@ -46823,8 +47050,10 @@ const AddVariables = ({
|
|
46823
47050
|
onChange,
|
46824
47051
|
onCreateVariableClick,
|
46825
47052
|
value = '',
|
46826
|
-
dropdownWidth = 'inherit'
|
47053
|
+
dropdownWidth = 'inherit',
|
47054
|
+
...props
|
46827
47055
|
}) => {
|
47056
|
+
const [inputValue, setInputValue] = useState('');
|
46828
47057
|
const [showDropdown, setShowDropdown] = useState(false);
|
46829
47058
|
const [cursorPosition, setCursorPosition] = useState(null);
|
46830
47059
|
const [showCreateVariableIcon, setShowCreateVariableIcon] = useState(false);
|
@@ -46835,18 +47064,29 @@ const AddVariables = ({
|
|
46835
47064
|
inputRef.current.focus();
|
46836
47065
|
}
|
46837
47066
|
}, [cursorPosition]);
|
47067
|
+
useEffect(() => {
|
47068
|
+
const newPayload = replaceVariablesWithIds(inputValue);
|
47069
|
+
onChange(newPayload);
|
47070
|
+
}, [inputValue]);
|
47071
|
+
const replaceVariablesWithIds = input => {
|
47072
|
+
return input.replace(/\${.*?_(.*?)}/g, (_, variableName) => {
|
47073
|
+
// Find the matching variable in the list by name
|
47074
|
+
const foundVariable = variableList.find(varaible => varaible.name === variableName.trim());
|
47075
|
+
return foundVariable ? `\${${foundVariable.id}}` : `\${${variableName}}`; // Replace if found, otherwise keep as is
|
47076
|
+
});
|
47077
|
+
};
|
46838
47078
|
const handleChange = event => {
|
46839
|
-
const
|
46840
|
-
|
47079
|
+
const fieldValue = event.target.value;
|
47080
|
+
setInputValue(fieldValue);
|
46841
47081
|
// Show dropdown only if the last character typed is `$`
|
46842
47082
|
const cursorPos = inputRef.current?.selectionStart || 0;
|
46843
|
-
const isDollarTyped =
|
47083
|
+
const isDollarTyped = fieldValue[cursorPos - 1] === '$';
|
46844
47084
|
if (isDollarTyped) {
|
46845
47085
|
setShowDropdown(true);
|
46846
47086
|
} else {
|
46847
47087
|
setShowDropdown(false); // Close if it's a space or other characters
|
46848
47088
|
}
|
46849
|
-
if (
|
47089
|
+
if (fieldValue?.includes('$')) {
|
46850
47090
|
setShowCreateVariableIcon(false);
|
46851
47091
|
} else {
|
46852
47092
|
setShowCreateVariableIcon(true);
|
@@ -46859,12 +47099,11 @@ const AddVariables = ({
|
|
46859
47099
|
selectionEnd
|
46860
47100
|
} = inputRef.current;
|
46861
47101
|
const dollarSyntax = `{${item.type === 'LOCAL' ? 'LV' : item.type === 'GLOBAL' ? 'GV' : item.type === 'GROUP' ? 'SG' : 'PEV'}_${item.name}}`;
|
46862
|
-
const newValue =
|
46863
|
-
|
47102
|
+
const newValue = inputValue.slice(0, selectionStart || 0) + dollarSyntax + inputValue.slice(selectionEnd || 0);
|
47103
|
+
setInputValue(newValue);
|
46864
47104
|
setCursorPosition((selectionStart || 0) + dollarSyntax.length);
|
46865
47105
|
// Close the dropdown after inserting the variable
|
46866
47106
|
setShowDropdown(false);
|
46867
|
-
onChange?.(newValue);
|
46868
47107
|
}
|
46869
47108
|
};
|
46870
47109
|
return jsxs("div", {
|
@@ -46872,10 +47111,11 @@ const AddVariables = ({
|
|
46872
47111
|
children: [jsxs("div", {
|
46873
47112
|
className: "ff-add-variable-input",
|
46874
47113
|
children: [jsx(Input, {
|
47114
|
+
...props,
|
46875
47115
|
name: "add_variable",
|
46876
47116
|
ref: inputRef,
|
46877
47117
|
type: "text",
|
46878
|
-
value:
|
47118
|
+
value: inputValue,
|
46879
47119
|
onChange: handleChange,
|
46880
47120
|
variant: "primary",
|
46881
47121
|
label: label,
|
@@ -48856,5 +49096,5 @@ const PhoneInputField = ({
|
|
48856
49096
|
});
|
48857
49097
|
};
|
48858
49098
|
|
48859
|
-
export { Accordion, AddButton as AddResourceButton, AddVariables, AllProjectsDropdown, AppHeader, AttachImage, AttachmentButton, Avatar, BarChart, Button$1 as Button, Checkbox, Chip, Col, Comments, ConnectingBranch, Container, CreateVariableSlider, DashboardDonutChart, CustomDatePicker as DatePicker, DonutChart, DownloadClient, DragAndDrop, Drawer, Dropzone, EditTextField, Editor, ExcelFile as Excel, ExpandableMenu, FieldSet, FileDropzone, FilePreview, ForwardedForms as Form, HighlightText, Icon, IconButton, IconRadialChart, IconRadioGroup, Input, InputWithDropdown, LabelEditTextField, LazyLoad, LineChart, MachineInputField, MenuOption, MiniModal, Modal, ModuleChip, MultiRadialChart, MultiSelect, NlpInput as NLPInput, Paper, PhoneInputField, PieChart, PopUpModal, RadialChart, RadioButton, RadioGroup, Recaptcha, Row$1 as Row, Search, Select$1 as Select, SequentialConnectingBranch, StateDropdown, StatusButton, StatusCard, Table$1 as Table, TreeTable as TableTree, TableWithAccordion, Tabs, Textarea as TextArea, ThemeProvider, Toaster, Toastify, Toggle, ToggleSwitch, Tooltip, Typography, VariableDropdown, VariableInput, checkEmpty, compareArrays, compareObjects, debounce, ffid, findAndInsert, getEncryptedData, getExtension, getExtensionWithPeriod, getSequentialPayload, hasDuplicateFile, saveFileFromBlob, throttle, toast, truncateText, useFileDropzone, useTheme };
|
49099
|
+
export { Accordion, AddButton as AddResourceButton, AddVariables, AllProjectsDropdown, AppHeader, AttachImage, AttachmentButton, Avatar, BarChart, Button$1 as Button, Checkbox, Chip, Col, Comments, ConnectingBranch, Container, CreateVariableSlider, DashboardDonutChart, CustomDatePicker as DatePicker, DonutChart, DownloadClient, DragAndDrop, Drawer, Dropzone, EditTextField, Editor, ExcelFile as Excel, ExpandableMenu, FieldSet, FileDropzone, FilePreview, ForwardedForms as Form, formatString as FormatString, HighlightText, Icon, IconButton, IconRadialChart, IconRadioGroup, Input, InputWithDropdown, LabelEditTextField, LazyLoad, LineChart, MachineInputField, MenuOption, MiniModal, Modal, ModuleChip, MultiRadialChart, MultiSelect, NlpInput as NLPInput, Paper, PhoneInputField, PieChart, PopUpModal, RadialChart, RadioButton, RadioGroup, Recaptcha, Row$1 as Row, Search, Select$1 as Select, SequentialConnectingBranch, StateDropdown, StatusButton, StatusCard, Table$1 as Table, TreeTable as TableTree, TableWithAccordion, Tabs, Textarea as TextArea, ThemeProvider, Toaster, Toastify, Toggle, ToggleSwitch, Tooltip, Typography, VariableDropdown, VariableInput, capitalize, checkEmpty, compareArrays, compareObjects, debounce, ffid, findAndInsert, getEncryptedData, getExtension, getExtensionWithPeriod, getSequentialPayload, hasDuplicateFile, saveFileFromBlob, throttle, toast, truncateText, useFileDropzone, useTheme };
|
48860
49100
|
//# sourceMappingURL=index.esm.js.map
|