pixel-react 1.8.9 → 1.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (120) hide show
  1. package/lib/components/Button/Button.stories.d.ts +0 -1
  2. package/lib/components/Drawer/Drawer.stories.d.ts +0 -5
  3. package/lib/components/Form/Form.stories.d.ts +5 -6
  4. package/lib/components/Icon/Icon.stories.d.ts +0 -1
  5. package/lib/components/IconButton/IconButton.stories.d.ts +0 -1
  6. package/lib/components/MenuOption/MenuOption.stories.d.ts +0 -1
  7. package/lib/components/MiniModal/MiniModal.stories.d.ts +1 -2
  8. package/lib/components/MultiSelect/MultiSelect.stories.d.ts +0 -2
  9. package/lib/components/RadioGroup/RadioGroup.stories.d.ts +1 -2
  10. package/lib/components/Select/Select.stories.d.ts +0 -1
  11. package/lib/components/Select/components/Dropdown/Dropdown.d.ts +1 -1
  12. package/lib/components/Select/components/Dropdown/dropdownTypes.d.ts +0 -2
  13. package/lib/components/Table/Table.stories.d.ts +0 -2
  14. package/lib/components/Tabs/types.d.ts +1 -0
  15. package/lib/components/ThemeProvider/CustomThemeProvider.d.ts +8 -0
  16. package/lib/hooks/useCustomThemeProvider.d.ts +11 -0
  17. package/lib/index.d.ts +1 -0
  18. package/lib/index.esm.js +3 -1
  19. package/lib/index.esm.js.map +1 -1
  20. package/lib/index.js +3 -1
  21. package/lib/index.js.map +1 -1
  22. package/lib/utils/ffID/ffID.stories.d.ts +1 -1
  23. package/package.json +1 -1
  24. package/src/assets/icons/approval_pending.svg +8 -8
  25. package/src/assets/icons/configuration.svg +3 -3
  26. package/src/assets/icons/defects.svg +8 -8
  27. package/src/assets/icons/element.svg +4 -4
  28. package/src/assets/icons/project_element.svg +4 -4
  29. package/src/assets/icons/step_group.svg +10 -10
  30. package/src/assets/icons/variable.svg +3 -3
  31. package/src/assets/icons/web_service_icon.svg +3 -3
  32. package/src/components/Tabs/Tabs.scss +19 -0
  33. package/src/components/Tabs/Tabs.tsx +9 -0
  34. package/src/components/Tabs/types.ts +1 -0
  35. package/lib/1fb4472b34e4fe07.css +0 -1
  36. package/lib/assets/fonts/Poppins-Bold.ttf +0 -0
  37. package/lib/assets/fonts/Poppins-Medium.ttf +0 -0
  38. package/lib/assets/fonts/Poppins-Regular.ttf +0 -0
  39. package/lib/assets/fonts/Poppins-SemiBold.ttf +0 -0
  40. package/lib/components/AddButton/AddButton.d.ts +0 -5
  41. package/lib/components/AddButton/AddButton.stories.d.ts +0 -6
  42. package/lib/components/AddButton/index.d.ts +0 -1
  43. package/lib/components/AddButton/types.d.ts +0 -4
  44. package/lib/components/AddVariables/AddVariables.d.ts +0 -5
  45. package/lib/components/AddVariables/index.d.ts +0 -1
  46. package/lib/components/AddVariables/types.d.ts +0 -35
  47. package/lib/components/AllProjectsDropdown/AllProjectsDropdown.stories.d.ts +0 -7
  48. package/lib/components/AppHeader/AppHeader.stories.d.ts +0 -7
  49. package/lib/components/AttachImage/AttachImage.stories.d.ts +0 -7
  50. package/lib/components/AttachmentButton/AttachmentButton.stories.d.ts +0 -9
  51. package/lib/components/Avatar/Avatar.stories.d.ts +0 -10
  52. package/lib/components/Charts/BarChart/BarChart.stories.d.ts +0 -6
  53. package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.d.ts +0 -7
  54. package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts +0 -8
  55. package/lib/components/Charts/LineChart/LineChart.stories.d.ts +0 -7
  56. package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts +0 -8
  57. package/lib/components/Charts/PieChart/PieChart.stories.d.ts +0 -7
  58. package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts +0 -6
  59. package/lib/components/EditTextField/EditTextField.stories.d.ts +0 -10
  60. package/lib/components/Editor/Editor.stories.d.ts +0 -6
  61. package/lib/components/Excel/ContextMenu/ContextMenu.d.ts +0 -4
  62. package/lib/components/Excel/ExcelFile.stories.d.ts +0 -6
  63. package/lib/components/ExcelFile/ChangeExcelStyles.d.ts +0 -14
  64. package/lib/components/ExcelFile/ColorBarSelector/ColorBarSelector.d.ts +0 -8
  65. package/lib/components/ExcelFile/ContextMenu/ContextMenu.d.ts +0 -4
  66. package/lib/components/ExcelFile/ExcelFile/Excel/ActiveCell.d.ts +0 -7
  67. package/lib/components/ExcelFile/ExcelFile/Excel/Cell.d.ts +0 -4
  68. package/lib/components/ExcelFile/ExcelFile/Excel/ColumnIndicator.d.ts +0 -5
  69. package/lib/components/ExcelFile/ExcelFile/Excel/Copied.d.ts +0 -3
  70. package/lib/components/ExcelFile/ExcelFile/Excel/CornerIndicator.d.ts +0 -5
  71. package/lib/components/ExcelFile/ExcelFile/Excel/DataEditor.d.ts +0 -5
  72. package/lib/components/ExcelFile/ExcelFile/Excel/DataViewer.d.ts +0 -8
  73. package/lib/components/ExcelFile/ExcelFile/Excel/FloatingRect.d.ts +0 -10
  74. package/lib/components/ExcelFile/ExcelFile/Excel/HeaderRow.d.ts +0 -3
  75. package/lib/components/ExcelFile/ExcelFile/Excel/Row.d.ts +0 -3
  76. package/lib/components/ExcelFile/ExcelFile/Excel/RowIndicator.d.ts +0 -5
  77. package/lib/components/ExcelFile/ExcelFile/Excel/Selected.d.ts +0 -3
  78. package/lib/components/ExcelFile/ExcelFile/Excel/Spreadsheet.d.ts +0 -80
  79. package/lib/components/ExcelFile/ExcelFile/Excel/Table.d.ts +0 -3
  80. package/lib/components/ExcelFile/ExcelFile/Excel/actions.d.ts +0 -174
  81. package/lib/components/ExcelFile/ExcelFile/Excel/areModelsEqual.d.ts +0 -1
  82. package/lib/components/ExcelFile/ExcelFile/Excel/context.d.ts +0 -8
  83. package/lib/components/ExcelFile/ExcelFile/Excel/engine/engine.d.ts +0 -22
  84. package/lib/components/ExcelFile/ExcelFile/Excel/engine/formula.d.ts +0 -17
  85. package/lib/components/ExcelFile/ExcelFile/Excel/engine/index.d.ts +0 -2
  86. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-graph.d.ts +0 -21
  87. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-hash.d.ts +0 -3
  88. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-set.d.ts +0 -24
  89. package/lib/components/ExcelFile/ExcelFile/Excel/index.d.ts +0 -13
  90. package/lib/components/ExcelFile/ExcelFile/Excel/matrix.d.ts +0 -67
  91. package/lib/components/ExcelFile/ExcelFile/Excel/point-range.d.ts +0 -22
  92. package/lib/components/ExcelFile/ExcelFile/Excel/point.d.ts +0 -11
  93. package/lib/components/ExcelFile/ExcelFile/Excel/reducer.d.ts +0 -27
  94. package/lib/components/ExcelFile/ExcelFile/Excel/selection.d.ts +0 -95
  95. package/lib/components/ExcelFile/ExcelFile/Excel/types.d.ts +0 -178
  96. package/lib/components/ExcelFile/ExcelFile/Excel/use-dispatch.d.ts +0 -3
  97. package/lib/components/ExcelFile/ExcelFile/Excel/use-selector.d.ts +0 -3
  98. package/lib/components/ExcelFile/ExcelFile/Excel/util.d.ts +0 -44
  99. package/lib/components/ExcelFile/ExcelFile/ExcelFile.d.ts +0 -19
  100. package/lib/components/ExcelFile/ExcelFile.stories.d.ts +0 -6
  101. package/lib/components/ExcelFile/ExcelSheetBar/ExcelSheetBar.d.ts +0 -12
  102. package/lib/components/ExcelFile/ExcelToolBar/ExcelToolBar.d.ts +0 -15
  103. package/lib/components/ExcelFile/ImportExcelStyles.d.ts +0 -24
  104. package/lib/components/ExcelFile/Types.d.ts +0 -129
  105. package/lib/components/ExcelFile/index.d.ts +0 -1
  106. package/lib/components/FF_Captcha/captcha.stories.d.ts +0 -8
  107. package/lib/components/IconRadioGroup/IconRadioGroup.stories.d.ts +0 -7
  108. package/lib/components/LabelEditTextField/LabelEditTextField.stories.d.ts +0 -13
  109. package/lib/components/MachineInputField/MachineInputField.stories.d.ts +0 -6
  110. package/lib/components/ModulesChip/ModuleChip.stories.d.ts +0 -6
  111. package/lib/components/NLPInput/NlpInput.stories.d.ts +0 -7
  112. package/lib/components/NLPInput/type.d.ts +0 -70
  113. package/lib/components/Paper/Paper.stories.d.ts +0 -11
  114. package/lib/components/SequentialConnectingBranch/SequentialConnectingBranch.stories.d.ts +0 -6
  115. package/lib/components/StatusCard/StatusCard.stories.d.ts +0 -11
  116. package/lib/components/Toastify/Toastify.stories.d.ts +0 -6
  117. package/lib/components/VariableInput/VariableInput.stories.d.ts +0 -6
  118. package/lib/utils/findAndInsert/findAndInsert.stories.d.ts +0 -7
  119. package/lib/utils/getEncryptedData/getEncryptedData.stories.d.ts +0 -6
  120. package/lib/utils/getSequentialPayload/getSequentialPayload.stories.d.ts +0 -10
@@ -6,7 +6,6 @@ export declare const Primary: Story;
6
6
  export declare const Secondary: Story;
7
7
  export declare const Tertiary: Story;
8
8
  export declare const Delete: Story;
9
- export declare const Warning: Story;
10
9
  export declare const PrimaryWithIcon: Story;
11
10
  export declare const SecondaryWithIcon: Story;
12
11
  export declare const TertiaryWithIcon: Story;
@@ -4,9 +4,4 @@ declare const meta: Meta<typeof Drawer>;
4
4
  export default meta;
5
5
  type Story = StoryObj<typeof Drawer>;
6
6
  export declare const Default: Story;
7
- export declare const WithoutHeader: Story;
8
- export declare const WithCustomHeader: Story;
9
- export declare const WithCustomFooter: Story;
10
- export declare const WithTertiaryButtons: Story;
11
- export declare const WithCustomZIndex: Story;
12
7
  export declare const Controlled: Story;
@@ -1,7 +1,6 @@
1
- import Forms from './Forms';
2
- import { Meta, StoryObj } from '@storybook/react/*';
3
- import './Form.scss';
4
- declare const meta: Meta<typeof Forms>;
5
- type Story = StoryObj<typeof Forms>;
6
- export declare const WithDefaultValues: Story;
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import Form from './Form';
3
+ declare const meta: Meta<typeof Form>;
4
+ type Story = StoryObj<typeof Form>;
5
+ export declare const WithControlledState: Story;
7
6
  export default meta;
@@ -4,5 +4,4 @@ declare const meta: Meta<typeof Icon>;
4
4
  type Story = StoryObj<typeof Icon>;
5
5
  export declare const Icons: Story;
6
6
  export declare const AllIcons: Story;
7
- export declare const DarkVariantIcons: Story;
8
7
  export default meta;
@@ -2,6 +2,5 @@ import type { Meta, StoryObj } from '@storybook/react';
2
2
  import IconButton from './IconButton';
3
3
  declare const meta: Meta<typeof IconButton>;
4
4
  type Story = StoryObj<typeof IconButton>;
5
- export declare const Default: Story;
6
5
  export declare const PrimaryIconButton: Story;
7
6
  export default meta;
@@ -12,5 +12,4 @@ export declare const MenuOptionPlacementTop: Story;
12
12
  export declare const MenuOptionPlacementDown: Story;
13
13
  export declare const MenuOptionPlacementLeft: Story;
14
14
  export declare const MenuOptionPlacementRight: Story;
15
- export declare const MenuOptionCustom: Story;
16
15
  export default meta;
@@ -4,7 +4,6 @@ import './MiniModal.scss';
4
4
  declare const meta: Meta<typeof MiniModal>;
5
5
  type Story = StoryObj<typeof MiniModal>;
6
6
  export declare const BasicModal: Story;
7
- export declare const CustomModalWithArrow: () => import("react/jsx-runtime").JSX.Element;
8
7
  export declare const CustomModalWithWrapper: () => import("react/jsx-runtime").JSX.Element;
9
- export declare const normalModalFollowedByIcon: () => import("react/jsx-runtime").JSX.Element;
8
+ export declare const CustomModalWithArrow: () => import("react/jsx-runtime").JSX.Element;
10
9
  export default meta;
@@ -5,7 +5,5 @@ type Story = StoryObj<typeof MultiSelect>;
5
5
  export declare const Default: Story;
6
6
  export declare const Default2: Story;
7
7
  export declare const Default3: Story;
8
- export declare const EmailGroup: Story;
9
8
  export declare const Controlled: Story;
10
- export declare const Labels: Story;
11
9
  export default meta;
@@ -4,6 +4,5 @@ declare const meta: Meta<typeof RadioGroup>;
4
4
  type Story = StoryObj<typeof RadioGroup>;
5
5
  export declare const Controlled: Story;
6
6
  export declare const WithDisabledOption: Story;
7
- export declare const DisabledSelected: Story;
8
- export declare const WithToolTipIcon: Story;
7
+ export declare const DisabledSelcted: Story;
9
8
  export default meta;
@@ -10,5 +10,4 @@ export declare const Disable: Story;
10
10
  export declare const WithInitialValue: Story;
11
11
  export declare const OptionSelection: Story;
12
12
  export declare const CustomJSX: Story;
13
- export declare const updateOptionFromOutside: Story;
14
13
  export default meta;
@@ -1,4 +1,4 @@
1
1
  import { DropDownListProps } from './dropdownTypes';
2
2
  import './Dropdown.scss';
3
- declare const Dropdown: ({ onSelectBlur, onSelectOptionSelector, dropdownPosition, options, optionZIndex, inputRef, labelAccessor, }: DropDownListProps) => import("react/jsx-runtime").JSX.Element;
3
+ declare const Dropdown: ({ onSelectBlur, onSelectOptionSelector, dropdownPosition, options, optionZIndex, inputRef, }: DropDownListProps) => import("react/jsx-runtime").JSX.Element;
4
4
  export default Dropdown;
@@ -6,8 +6,6 @@ export interface DropDownListProps {
6
6
  options?: Option[];
7
7
  optionZIndex?: number;
8
8
  inputRef?: React.RefObject<HTMLInputElement>;
9
- labelAccessor?: string;
10
- valueAccessor?: string;
11
9
  }
12
10
  export declare const dropdownDefaultCSSData: {
13
11
  margin: number;
@@ -3,8 +3,6 @@ import Table from './Table';
3
3
  declare const meta: Meta<typeof Table>;
4
4
  type Story = StoryObj<typeof Table>;
5
5
  export declare const Default: Story;
6
- export declare const PrimaryHeaderTextColor: Story;
7
- export declare const TableDataTextColor: Story;
8
6
  export declare const PageTable: Story;
9
7
  export declare const PrimaryHeader: Story;
10
8
  export declare const FixedHeaderWithBorder: Story;
@@ -26,6 +26,7 @@ export interface TabsProps {
26
26
  component?: JSX.Element;
27
27
  disabled?: boolean;
28
28
  count?: number | string;
29
+ status?: 'success' | 'error' | 'transparent';
29
30
  }[];
30
31
  /**
31
32
  * Defines the styling variant of the tabs.
@@ -0,0 +1,8 @@
1
+ import React, { ReactNode } from 'react';
2
+ import { ThemeContextType } from './types';
3
+ declare const ThemeContext: React.Context<ThemeContextType | undefined>;
4
+ declare const CustomThemeProvider: React.FC<{
5
+ children: ReactNode;
6
+ }>;
7
+ export { ThemeContext };
8
+ export default CustomThemeProvider;
@@ -0,0 +1,11 @@
1
+ import React, { ReactNode } from 'react';
2
+ interface ThemeContextType {
3
+ currentTheme: string;
4
+ setCurrentTheme: React.Dispatch<React.SetStateAction<string>>;
5
+ applyTheme: (newTheme: string) => void;
6
+ }
7
+ export declare const useCustomThemeProvider: React.FC<{
8
+ children: ReactNode;
9
+ }>;
10
+ export declare const useTheme: () => ThemeContextType;
11
+ export {};
package/lib/index.d.ts CHANGED
@@ -1744,6 +1744,7 @@ interface TabsProps {
1744
1744
  component?: JSX.Element;
1745
1745
  disabled?: boolean;
1746
1746
  count?: number | string;
1747
+ status?: 'success' | 'error' | 'transparent';
1747
1748
  }[];
1748
1749
  /**
1749
1750
  * Defines the styling variant of the tabs.
package/lib/index.esm.js CHANGED
@@ -9714,7 +9714,7 @@ const TreeTable = ({
9714
9714
  };
9715
9715
  var TableTree = /*#__PURE__*/memo(TreeTable);
9716
9716
 
9717
- var css_248z$O = ":root {\n --tooltip-bg-color: #1e161f;\n --status-approved-text-color: #016102;\n --status-warning-text-color: #ff8b00;\n --status-rejected-text-color: #c60202;\n --status-skipped-text-color: #3c3838;\n --status-approved-bg-color: #c6efcd;\n --status-rejected-bg-color: #f7d9d9;\n --status-warning-bg-color: #fae2c6;\n --status-skipped-bg-color: #c4c3c3;\n --brand-color: #71347b;\n --icons-default-color: #71347b;\n --default-icon-color: #a3a3a3;\n --default-color: #747474;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --system-color--error: #c50303;\n --hover-color: #f7ebff;\n --brand2-color: #610b86;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --description-text-color: #d9d9d9;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --text-color: #1e161f;\n --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --error-light: #e42525;\n --tabs-label-default-color: tabs-label-default-color;\n --tabs-label-active-color: tabs-label-active-color;\n --tabs-border-color: tabs-border-color;\n --tabs-bg-color: tabs-bg-color;\n --tab-bg-color: tab-bg-color;\n --toggle-button-bg-color: #ffffff;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-strip-color: #cfd1e2;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --toggle-strip-color: #cfd1e2;\n --add-icon-hover-color: #431b4a;\n --arrows-button-border-color: #ded1e5;\n --arrow-button-bg-color: #ffffff;\n --text-bg-highlight: #f5fb00;\n --slider-table-color: #efe1f9;\n --variable-dropdown-bg: #($variable-dropdown-bg);\n}\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}";
9717
+ var css_248z$O = ":root {\n --tooltip-bg-color: #1e161f;\n --status-approved-text-color: #016102;\n --status-warning-text-color: #ff8b00;\n --status-rejected-text-color: #c60202;\n --status-skipped-text-color: #3c3838;\n --status-approved-bg-color: #c6efcd;\n --status-rejected-bg-color: #f7d9d9;\n --status-warning-bg-color: #fae2c6;\n --status-skipped-bg-color: #c4c3c3;\n --brand-color: #71347b;\n --icons-default-color: #71347b;\n --default-icon-color: #a3a3a3;\n --default-color: #747474;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --system-color--error: #c50303;\n --hover-color: #f7ebff;\n --brand2-color: #610b86;\n --status-warning-hover-bg-color: #fcd8ac;\n --status-percentage-growth-bg-color: #ecedf8;\n --primary-icon-color: #ffffff;\n --secondary-icon-color: #71347b;\n --description-text-color: #d9d9d9;\n --expandable-menu-default-bg: #fdfaff;\n --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n --text-color: #1e161f;\n --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n --file-details-bg: #ffffff;\n --error-light: #e42525;\n --tabs-label-default-color: tabs-label-default-color;\n --tabs-label-active-color: tabs-label-active-color;\n --tabs-border-color: tabs-border-color;\n --tabs-bg-color: tabs-bg-color;\n --tab-bg-color: tab-bg-color;\n --toggle-button-bg-color: #ffffff;\n --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n --toggle-strip-color: #cfd1e2;\n --disable-color: rgba(113, 52, 123, 0.5019607843);\n --toggle-strip-color: #cfd1e2;\n --add-icon-hover-color: #431b4a;\n --arrows-button-border-color: #ded1e5;\n --arrow-button-bg-color: #ffffff;\n --text-bg-highlight: #f5fb00;\n --slider-table-color: #efe1f9;\n --variable-dropdown-bg: #($variable-dropdown-bg);\n}\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 position: relative;\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}\n.ff-tabs-container .ff-defaultStatus {\n position: absolute;\n top: 2px;\n right: 0px;\n width: 6px;\n height: 6px;\n background-color: transparent;\n border-radius: 50%;\n}\n.ff-tabs-container .ff-defaultStatus.ff-successStatus {\n background-color: var(--confirm-tick-icon-color);\n box-shadow: 0px 1px 1px 0px var(--toggle-strip-shadow);\n}\n.ff-tabs-container .ff-defaultStatus.ff-dangerStatus {\n background-color: var(--delete-text-color);\n box-shadow: 0px 1px 1px 0px var(--toggle-strip-shadow);\n}";
9718
9718
  styleInject(css_248z$O);
9719
9719
 
9720
9720
  const Tabs = ({
@@ -9757,6 +9757,8 @@ const Tabs = ({
9757
9757
  className: classNames('ff-tab-bar', {
9758
9758
  'ff-tab-bar--active': activeTabId === tab.id
9759
9759
  })
9760
+ }), jsx("span", {
9761
+ className: `ff-defaultStatus ${tab.status === 'success' ? 'ff-successStatus' : tab.status === 'error' ? 'ff-dangerStatus' : ''}`
9760
9762
  })]
9761
9763
  }, tab.id))
9762
9764
  }), jsx("div", {