fis-component 0.0.52 → 0.0.53

package/dist/cjs/types/src/assets/icons/LineArrowsDown.d.ts

@@ -0,0 +1,2 @@
+declare const LineArrowsDown: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export default LineArrowsDown;

package/dist/cjs/types/src/assets/icons/LineArrowsUp.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const LineArrowsUp: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export default LineArrowsUp;

package/dist/cjs/types/src/assets/icons/SortTableIcon.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const SortTableIcon: React.FC<React.SVGProps<SVGSVGElement>>;
+export default SortTableIcon;

package/dist/cjs/types/src/assets/icons/index.d.ts

@@ -40,3 +40,6 @@ export { default as NoResultIcon } from "./NoResultIcon";
 export { default as RemoveIcon } from "./RemoveIcon";
 export { default as ChevronLeftIcon } from "./ChevronLeftIcon";
 export { default as ChevronRightIcon } from "./ChevronRightIcon";
+export { default as SortTableIcon } from "./SortTableIcon";
+export { default as LineArrowsDownIcon } from "./LineArrowsDown";
+export { default as LineArrowsUpIcon } from "./LineArrowsUp";

package/dist/cjs/types/src/components/Table/Sorter/FISSorter.d.ts

@@ -6,7 +6,6 @@ interface FISSorterProps {
         columnKey: string | null;
         order: string | null;
     };
-    colorActive?: string;
     UpIcon?: ComponentType<{
         style?: React.CSSProperties;
     }>;
@@ -14,5 +13,5 @@ interface FISSorterProps {
         style?: React.CSSProperties;
     }>;
 }
-declare const FISSorter: ({ columnKey, onSort, sortedInfo, colorActive, UpIcon, DownIcon, }: FISSorterProps) => import("react/jsx-runtime").JSX.Element;
+declare const FISSorter: ({ columnKey, onSort, sortedInfo, UpIcon, DownIcon, }: FISSorterProps) => import("react/jsx-runtime").JSX.Element;
 export default FISSorter;

package/dist/esm/index.js

@@ -12140,9 +12140,9 @@ var CheckCircleFilled = function CheckCircleFilled(props, ref) {
 };
 
 /**![check-circle](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjY0IDY0IDg5NiA4OTYiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTUxMiA2NEMyNjQuNiA2NCA2NCAyNjQuNiA2NCA1MTJzMjAwLjYgNDQ4IDQ0OCA0NDggNDQ4LTIwMC42IDQ0OC00NDhTNzU5LjQgNjQgNTEyIDY0em0xOTMuNSAzMDEuN2wtMjEwLjYgMjkyYTMxLjggMzEuOCAwIDAxLTUxLjcgMEwzMTguNSA0ODQuOWMtMy44LTUuMyAwLTEyLjcgNi41LTEyLjdoNDYuOWMxMC4yIDAgMTkuOSA0LjkgMjUuOSAxMy4zbDcxLjIgOTguOCAxNTcuMi0yMThjNi04LjMgMTUuNi0xMy4zIDI1LjktMTMuM0g2OTljNi41IDAgMTAuMyA3LjQgNi41IDEyLjd6IiAvPjwvc3ZnPg==) */
-var RefIcon$s = /*#__PURE__*/React.forwardRef(CheckCircleFilled);
+var RefIcon$r = /*#__PURE__*/React.forwardRef(CheckCircleFilled);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$s.displayName = 'CheckCircleFilled';
+  RefIcon$r.displayName = 'CheckCircleFilled';
 }
 
 // This icon file is generated automatically.
@@ -12156,9 +12156,9 @@ var CloseCircleFilled = function CloseCircleFilled(props, ref) {
 };
 
 /**![close-circle](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIGZpbGwtcnVsZT0iZXZlbm9kZCIgdmlld0JveD0iNjQgNjQgODk2IDg5NiIgZm9jdXNhYmxlPSJmYWxzZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNNTEyIDY0YzI0Ny40IDAgNDQ4IDIwMC42IDQ0OCA0NDhTNzU5LjQgOTYwIDUxMiA5NjAgNjQgNzU5LjQgNjQgNTEyIDI2NC42IDY0IDUxMiA2NHptMTI3Ljk4IDI3NC44MmgtLjA0bC0uMDguMDZMNTEyIDQ2Ni43NSAzODQuMTQgMzM4Ljg4Yy0uMDQtLjA1LS4wNi0uMDYtLjA4LS4wNmEuMTIuMTIgMCAwMC0uMDcgMGMtLjAzIDAtLjA1LjAxLS4wOS4wNWwtNDUuMDIgNDUuMDJhLjIuMiAwIDAwLS4wNS4wOS4xMi4xMiAwIDAwMCAuMDd2LjAyYS4yNy4yNyAwIDAwLjA2LjA2TDQ2Ni43NSA1MTIgMzM4Ljg4IDYzOS44NmMtLjA1LjA0LS4wNi4wNi0uMDYuMDhhLjEyLjEyIDAgMDAwIC4wN2MwIC4wMy4wMS4wNS4wNS4wOWw0NS4wMiA0NS4wMmEuMi4yIDAgMDAuMDkuMDUuMTIuMTIgMCAwMC4wNyAwYy4wMiAwIC4wNC0uMDEuMDgtLjA1TDUxMiA1NTcuMjVsMTI3Ljg2IDEyNy44N2MuMDQuMDQuMDYuMDUuMDguMDVhLjEyLjEyIDAgMDAuMDcgMGMuMDMgMCAuMDUtLjAxLjA5LS4wNWw0NS4wMi00NS4wMmEuMi4yIDAgMDAuMDUtLjA5LjEyLjEyIDAgMDAwLS4wN3YtLjAyYS4yNy4yNyAwIDAwLS4wNS0uMDZMNTU3LjI1IDUxMmwxMjcuODctMTI3Ljg2Yy4wNC0uMDQuMDUtLjA2LjA1LS4wOGEuMTIuMTIgMCAwMDAtLjA3YzAtLjAzLS4wMS0uMDUtLjA1LS4wOWwtNDUuMDItNDUuMDJhLjIuMiAwIDAwLS4wOS0uMDUuMTIuMTIgMCAwMC0uMDcgMHoiIC8+PC9zdmc+) */
-var RefIcon$r = /*#__PURE__*/React.forwardRef(CloseCircleFilled);
+var RefIcon$q = /*#__PURE__*/React.forwardRef(CloseCircleFilled);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$r.displayName = 'CloseCircleFilled';
+  RefIcon$q.displayName = 'CloseCircleFilled';
 }
 
 // This icon file is generated automatically.
@@ -12172,9 +12172,9 @@ var CloseOutlined = function CloseOutlined(props, ref) {
 };
 
 /**![close](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIGZpbGwtcnVsZT0iZXZlbm9kZCIgdmlld0JveD0iNjQgNjQgODk2IDg5NiIgZm9jdXNhYmxlPSJmYWxzZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNNzk5Ljg2IDE2Ni4zMWMuMDIgMCAuMDQuMDIuMDguMDZsNTcuNjkgNTcuN2MuMDQuMDMuMDUuMDUuMDYuMDhhLjEyLjEyIDAgMDEwIC4wNmMwIC4wMy0uMDIuMDUtLjA2LjA5TDU2OS45MyA1MTJsMjg3LjcgMjg3LjdjLjA0LjA0LjA1LjA2LjA2LjA5YS4xMi4xMiAwIDAxMCAuMDdjMCAuMDItLjAyLjA0LS4wNi4wOGwtNTcuNyA1Ny42OWMtLjAzLjA0LS4wNS4wNS0uMDcuMDZhLjEyLjEyIDAgMDEtLjA3IDBjLS4wMyAwLS4wNS0uMDItLjA5LS4wNkw1MTIgNTY5LjkzbC0yODcuNyAyODcuN2MtLjA0LjA0LS4wNi4wNS0uMDkuMDZhLjEyLjEyIDAgMDEtLjA3IDBjLS4wMiAwLS4wNC0uMDItLjA4LS4wNmwtNTcuNjktNTcuN2MtLjA0LS4wMy0uMDUtLjA1LS4wNi0uMDdhLjEyLjEyIDAgMDEwLS4wN2MwLS4wMy4wMi0uMDUuMDYtLjA5TDQ1NC4wNyA1MTJsLTI4Ny43LTI4Ny43Yy0uMDQtLjA0LS4wNS0uMDYtLjA2LS4wOWEuMTIuMTIgMCAwMTAtLjA3YzAtLjAyLjAyLS4wNC4wNi0uMDhsNTcuNy01Ny42OWMuMDMtLjA0LjA1LS4wNS4wNy0uMDZhLjEyLjEyIDAgMDEuMDcgMGMuMDMgMCAuMDUuMDIuMDkuMDZMNTEyIDQ1NC4wN2wyODcuNy0yODcuN2MuMDQtLjA0LjA2LS4wNS4wOS0uMDZhLjEyLjEyIDAgMDEuMDcgMHoiIC8+PC9zdmc+) */
-var RefIcon$q = /*#__PURE__*/React.forwardRef(CloseOutlined);
+var RefIcon$p = /*#__PURE__*/React.forwardRef(CloseOutlined);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$q.displayName = 'CloseOutlined';
+  RefIcon$p.displayName = 'CloseOutlined';
 }
 
 // This icon file is generated automatically.
@@ -12188,9 +12188,9 @@ var ExclamationCircleFilled = function ExclamationCircleFilled(props, ref) {
 };
 
 /**![exclamation-circle](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjY0IDY0IDg5NiA4OTYiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTUxMiA2NEMyNjQuNiA2NCA2NCAyNjQuNiA2NCA1MTJzMjAwLjYgNDQ4IDQ0OCA0NDggNDQ4LTIwMC42IDQ0OC00NDhTNzU5LjQgNjQgNTEyIDY0em0tMzIgMjMyYzAtNC40IDMuNi04IDgtOGg0OGM0LjQgMCA4IDMuNiA4IDh2MjcyYzAgNC40LTMuNiA4LTggOGgtNDhjLTQuNCAwLTgtMy42LTgtOFYyOTZ6bTMyIDQ0MGE0OC4wMSA0OC4wMSAwIDAxMC05NiA0OC4wMSA0OC4wMSAwIDAxMCA5NnoiIC8+PC9zdmc+) */
-var RefIcon$p = /*#__PURE__*/React.forwardRef(ExclamationCircleFilled);
+var RefIcon$o = /*#__PURE__*/React.forwardRef(ExclamationCircleFilled);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$p.displayName = 'ExclamationCircleFilled';
+  RefIcon$o.displayName = 'ExclamationCircleFilled';
 }
 
 // This icon file is generated automatically.
@@ -12204,9 +12204,9 @@ var InfoCircleFilled = function InfoCircleFilled(props, ref) {
 };
 
 /**![info-circle](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjY0IDY0IDg5NiA4OTYiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTUxMiA2NEMyNjQuNiA2NCA2NCAyNjQuNiA2NCA1MTJzMjAwLjYgNDQ4IDQ0OCA0NDggNDQ4LTIwMC42IDQ0OC00NDhTNzU5LjQgNjQgNTEyIDY0em0zMiA2NjRjMCA0LjQtMy42IDgtOCA4aC00OGMtNC40IDAtOC0zLjYtOC04VjQ1NmMwLTQuNCAzLjYtOCA4LThoNDhjNC40IDAgOCAzLjYgOCA4djI3MnptLTMyLTM0NGE0OC4wMSA0OC4wMSAwIDAxMC05NiA0OC4wMSA0OC4wMSAwIDAxMCA5NnoiIC8+PC9zdmc+) */
-var RefIcon$o = /*#__PURE__*/React.forwardRef(InfoCircleFilled);
+var RefIcon$n = /*#__PURE__*/React.forwardRef(InfoCircleFilled);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$o.displayName = 'InfoCircleFilled';
+  RefIcon$n.displayName = 'InfoCircleFilled';
 }
 
 var attributes = "accept acceptCharset accessKey action allowFullScreen allowTransparency\n    alt async autoComplete autoFocus autoPlay capture cellPadding cellSpacing challenge\n    charSet checked classID className colSpan cols content contentEditable contextMenu\n    controls coords crossOrigin data dateTime default defer dir disabled download draggable\n    encType form formAction formEncType formMethod formNoValidate formTarget frameBorder\n    headers height hidden high href hrefLang htmlFor httpEquiv icon id inputMode integrity\n    is keyParams keyType kind label lang list loop low manifest marginHeight marginWidth max maxLength media\n    mediaGroup method min minLength multiple muted name noValidate nonce open\n    optimum pattern placeholder poster preload radioGroup readOnly rel required\n    reversed role rowSpan rows sandbox scope scoped scrolling seamless selected\n    shape size sizes span spellCheck src srcDoc srcLang srcSet start step style\n    summary tabIndex target title type useMap value width wmode wrap";
@@ -13125,9 +13125,9 @@ var LoadingOutlined = function LoadingOutlined(props, ref) {
 };
 
 /**![loading](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTk4OCA1NDhjLTE5LjkgMC0zNi0xNi4xLTM2LTM2IDAtNTkuNC0xMS42LTExNy0zNC42LTE3MS4zYTQ0MC40NSA0NDAuNDUgMCAwMC05NC4zLTEzOS45IDQzNy43MSA0MzcuNzEgMCAwMC0xMzkuOS05NC4zQzYyOSA4My42IDU3MS40IDcyIDUxMiA3MmMtMTkuOSAwLTM2LTE2LjEtMzYtMzZzMTYuMS0zNiAzNi0zNmM2OS4xIDAgMTM2LjIgMTMuNSAxOTkuMyA0MC4zQzc3Mi4zIDY2IDgyNyAxMDMgODc0IDE1MGM0NyA0NyA4My45IDEwMS44IDEwOS43IDE2Mi43IDI2LjcgNjMuMSA0MC4yIDEzMC4yIDQwLjIgMTk5LjMuMSAxOS45LTE2IDM2LTM1LjkgMzZ6IiAvPjwvc3ZnPg==) */
-var RefIcon$n = /*#__PURE__*/React.forwardRef(LoadingOutlined);
+var RefIcon$m = /*#__PURE__*/React.forwardRef(LoadingOutlined);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$n.displayName = 'LoadingOutlined';
+  RefIcon$m.displayName = 'LoadingOutlined';
 }
 
 const zIndexContext = /*#__PURE__*/React__default.createContext(undefined);
@@ -14314,7 +14314,7 @@ const InnerLoadingIcon = /*#__PURE__*/forwardRef((props, ref) => {
     className: mergedIconCls,
     style: style,
     ref: ref
-  }, /*#__PURE__*/React__default.createElement(RefIcon$n, {
+  }, /*#__PURE__*/React__default.createElement(RefIcon$m, {
     className: iconClassName
   }));
 });
@@ -15182,9 +15182,9 @@ var RightOutlined = function RightOutlined(props, ref) {
 };
 
 /**![right](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjY0IDY0IDg5NiA4OTYiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTc2NS43IDQ4Ni44TDMxNC45IDEzNC43QTcuOTcgNy45NyAwIDAwMzAyIDE0MXY3Ny4zYzAgNC45IDIuMyA5LjYgNi4xIDEyLjZsMzYwIDI4MS4xLTM2MCAyODEuMWMtMy45IDMtNi4xIDcuNy02LjEgMTIuNlY4ODNjMCA2LjcgNy43IDEwLjQgMTIuOSA2LjNsNDUwLjgtMzUyLjFhMzEuOTYgMzEuOTYgMCAwMDAtNTAuNHoiIC8+PC9zdmc+) */
-var RefIcon$m = /*#__PURE__*/React.forwardRef(RightOutlined);
+var RefIcon$l = /*#__PURE__*/React.forwardRef(RightOutlined);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$m.displayName = 'RightOutlined';
+  RefIcon$l.displayName = 'RightOutlined';
 }
 
 var PanelContent = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
@@ -16360,7 +16360,7 @@ const Collapse = /*#__PURE__*/React.forwardRef((props, ref) => {
   const mergedExpandIcon = expandIcon !== null && expandIcon !== void 0 ? expandIcon : contextExpandIcon;
   const renderExpandIcon = React.useCallback(function () {
     let panelProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    const icon = typeof mergedExpandIcon === 'function' ? mergedExpandIcon(panelProps) : (/*#__PURE__*/React.createElement(RefIcon$m, {
+    const icon = typeof mergedExpandIcon === 'function' ? mergedExpandIcon(panelProps) : (/*#__PURE__*/React.createElement(RefIcon$l, {
       rotate: panelProps.isActive ? direction === 'rtl' ? -90 : 90 : undefined,
       "aria-label": panelProps.isActive ? 'expanded' : 'collapsed'
     }));
@@ -21852,15 +21852,15 @@ function getCloseIcon(prefixCls, closeIcon) {
   if (closeIcon === null || closeIcon === false) {
     return null;
   }
-  return closeIcon || /*#__PURE__*/React.createElement(RefIcon$q, {
+  return closeIcon || /*#__PURE__*/React.createElement(RefIcon$p, {
     className: `${prefixCls}-close-icon`
   });
 }
 const typeToIcon = {
-  success: RefIcon$s,
-  info: RefIcon$o,
-  error: RefIcon$r,
-  warning: RefIcon$p
+  success: RefIcon$r,
+  info: RefIcon$n,
+  error: RefIcon$q,
+  warning: RefIcon$o
 };
 const PureContent = props => {
   const {
@@ -30175,9 +30175,9 @@ var CheckOutlined = function CheckOutlined(props, ref) {
 };
 
 /**![check](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjY0IDY0IDg5NiA4OTYiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTkxMiAxOTBoLTY5LjljLTkuOCAwLTE5LjEgNC41LTI1LjEgMTIuMkw0MDQuNyA3MjQuNSAyMDcgNDc0YTMyIDMyIDAgMDAtMjUuMS0xMi4ySDExMmMtNi43IDAtMTAuNCA3LjctNi4zIDEyLjlsMjczLjkgMzQ3YzEyLjggMTYuMiAzNy40IDE2LjIgNTAuMyAwbDQ4OC40LTYxOC45YzQuMS01LjEuNC0xMi44LTYuMy0xMi44eiIgLz48L3N2Zz4=) */
-var RefIcon$l = /*#__PURE__*/React.forwardRef(CheckOutlined);
+var RefIcon$k = /*#__PURE__*/React.forwardRef(CheckOutlined);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$l.displayName = 'CheckOutlined';
+  RefIcon$k.displayName = 'CheckOutlined';
 }
 
 // This icon file is generated automatically.
@@ -30191,9 +30191,9 @@ var DownOutlined = function DownOutlined(props, ref) {
 };
 
 /**![down](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjY0IDY0IDg5NiA4OTYiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTg4NCAyNTZoLTc1Yy01LjEgMC05LjkgMi41LTEyLjkgNi42TDUxMiA2NTQuMiAyMjcuOSAyNjIuNmMtMy00LjEtNy44LTYuNi0xMi45LTYuNmgtNzVjLTYuNSAwLTEwLjMgNy40LTYuNSAxMi43bDM1Mi42IDQ4Ni4xYzEyLjggMTcuNiAzOSAxNy42IDUxLjcgMGwzNTIuNi00ODYuMWMzLjktNS4zLjEtMTIuNy02LjQtMTIuN3oiIC8+PC9zdmc+) */
-var RefIcon$k = /*#__PURE__*/React.forwardRef(DownOutlined);
+var RefIcon$j = /*#__PURE__*/React.forwardRef(DownOutlined);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$k.displayName = 'DownOutlined';
+  RefIcon$j.displayName = 'DownOutlined';
 }
 
 // This icon file is generated automatically.
@@ -30207,9 +30207,9 @@ var SearchOutlined = function SearchOutlined(props, ref) {
 };
 
 /**![search](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjY0IDY0IDg5NiA4OTYiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTkwOS42IDg1NC41TDY0OS45IDU5NC44QzY5MC4yIDU0Mi43IDcxMiA0NzkgNzEyIDQxMmMwLTgwLjItMzEuMy0xNTUuNC04Ny45LTIxMi4xLTU2LjYtNTYuNy0xMzItODcuOS0yMTIuMS04Ny45cy0xNTUuNSAzMS4zLTIxMi4xIDg3LjlDMTQzLjIgMjU2LjUgMTEyIDMzMS44IDExMiA0MTJjMCA4MC4xIDMxLjMgMTU1LjUgODcuOSAyMTIuMUMyNTYuNSA2ODAuOCAzMzEuOCA3MTIgNDEyIDcxMmM2NyAwIDEzMC42LTIxLjggMTgyLjctNjJsMjU5LjcgMjU5LjZhOC4yIDguMiAwIDAwMTEuNiAwbDQzLjYtNDMuNWE4LjIgOC4yIDAgMDAwLTExLjZ6TTU3MC40IDU3MC40QzUyOCA2MTIuNyA0NzEuOCA2MzYgNDEyIDYzNnMtMTE2LTIzLjMtMTU4LjQtNjUuNkMyMTEuMyA1MjggMTg4IDQ3MS44IDE4OCA0MTJzMjMuMy0xMTYuMSA2NS42LTE1OC40QzI5NiAyMTEuMyAzNTIuMiAxODggNDEyIDE4OHMxMTYuMSAyMy4yIDE1OC40IDY1LjZTNjM2IDM1Mi4yIDYzNiA0MTJzLTIzLjMgMTE2LjEtNjUuNiAxNTguNHoiIC8+PC9zdmc+) */
-var RefIcon$j = /*#__PURE__*/React.forwardRef(SearchOutlined);
+var RefIcon$i = /*#__PURE__*/React.forwardRef(SearchOutlined);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$j.displayName = 'SearchOutlined';
+  RefIcon$i.displayName = 'SearchOutlined';
 }
 
 function useIcons$1(_ref) {
@@ -30232,7 +30232,7 @@ function useIcons$1(_ref) {
     warning.deprecated(!clearIcon, 'clearIcon', 'allowClear={{ clearIcon: React.ReactNode }}');
   }
   // Clear Icon
-  const mergedClearIcon = clearIcon !== null && clearIcon !== void 0 ? clearIcon : /*#__PURE__*/React.createElement(RefIcon$r, null);
+  const mergedClearIcon = clearIcon !== null && clearIcon !== void 0 ? clearIcon : /*#__PURE__*/React.createElement(RefIcon$q, null);
   // Validation Feedback Icon
   const getSuffixIconNode = arrowIcon => {
     if (suffixIcon === null && !hasFeedback && !showArrow) {
@@ -30245,7 +30245,7 @@ function useIcons$1(_ref) {
   if (suffixIcon !== undefined) {
     mergedSuffixIcon = getSuffixIconNode(suffixIcon);
   } else if (loading) {
-    mergedSuffixIcon = getSuffixIconNode(/*#__PURE__*/React.createElement(RefIcon$n, {
+    mergedSuffixIcon = getSuffixIconNode(/*#__PURE__*/React.createElement(RefIcon$m, {
       spin: true
     }));
   } else {
@@ -30256,11 +30256,11 @@ function useIcons$1(_ref) {
         showSearch
       } = _ref2;
       if (open && showSearch) {
-        return getSuffixIconNode(/*#__PURE__*/React.createElement(RefIcon$j, {
+        return getSuffixIconNode(/*#__PURE__*/React.createElement(RefIcon$i, {
           className: iconCls
         }));
       }
-      return getSuffixIconNode(/*#__PURE__*/React.createElement(RefIcon$k, {
+      return getSuffixIconNode(/*#__PURE__*/React.createElement(RefIcon$j, {
         className: iconCls
       }));
     };
@@ -30270,7 +30270,7 @@ function useIcons$1(_ref) {
   if (menuItemSelectedIcon !== undefined) {
     mergedItemIcon = menuItemSelectedIcon;
   } else if (multiple) {
-    mergedItemIcon = /*#__PURE__*/React.createElement(RefIcon$l, null);
+    mergedItemIcon = /*#__PURE__*/React.createElement(RefIcon$k, null);
   } else {
     mergedItemIcon = null;
   }
@@ -30278,7 +30278,7 @@ function useIcons$1(_ref) {
   if (removeIcon !== undefined) {
     mergedRemoveIcon = removeIcon;
   } else {
-    mergedRemoveIcon = /*#__PURE__*/React.createElement(RefIcon$q, null);
+    mergedRemoveIcon = /*#__PURE__*/React.createElement(RefIcon$p, null);
   }
   return {
     clearIcon: mergedClearIcon,
@@ -31599,9 +31599,9 @@ var LeftOutlined = function LeftOutlined(props, ref) {
 };
 
 /**![left](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjY0IDY0IDg5NiA4OTYiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcyNCAyMTguM1YxNDFjMC02LjctNy43LTEwLjQtMTIuOS02LjNMMjYwLjMgNDg2LjhhMzEuODYgMzEuODYgMCAwMDAgNTAuM2w0NTAuOCAzNTIuMWM1LjMgNC4xIDEyLjkuNCAxMi45LTYuM3YtNzcuM2MwLTQuOS0yLjMtOS42LTYuMS0xMi42bC0zNjAtMjgxIDM2MC0yODEuMWMzLjgtMyA2LjEtNy43IDYuMS0xMi42eiIgLz48L3N2Zz4=) */
-var RefIcon$i = /*#__PURE__*/React.forwardRef(LeftOutlined);
+var RefIcon$h = /*#__PURE__*/React.forwardRef(LeftOutlined);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$i.displayName = 'LeftOutlined';
+  RefIcon$h.displayName = 'LeftOutlined';
 }
 
 var ESC$1 = KeyCode.ESC,
@@ -33799,9 +33799,9 @@ var BarsOutlined = function BarsOutlined(props, ref) {
 };
 
 /**![bars](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTkxMiAxOTJIMzI4Yy00LjQgMC04IDMuNi04IDh2NTZjMCA0LjQgMy42IDggOCA4aDU4NGM0LjQgMCA4LTMuNiA4LTh2LTU2YzAtNC40LTMuNi04LTgtOHptMCAyODRIMzI4Yy00LjQgMC04IDMuNi04IDh2NTZjMCA0LjQgMy42IDggOCA4aDU4NGM0LjQgMCA4LTMuNiA4LTh2LTU2YzAtNC40LTMuNi04LTgtOHptMCAyODRIMzI4Yy00LjQgMC04IDMuNi04IDh2NTZjMCA0LjQgMy42IDggOCA4aDU4NGM0LjQgMCA4LTMuNiA4LTh2LTU2YzAtNC40LTMuNi04LTgtOHpNMTA0IDIyOGE1NiA1NiAwIDEwMTEyIDAgNTYgNTYgMCAxMC0xMTIgMHptMCAyODRhNTYgNTYgMCAxMDExMiAwIDU2IDU2IDAgMTAtMTEyIDB6bTAgMjg0YTU2IDU2IDAgMTAxMTIgMCA1NiA1NiAwIDEwLTExMiAweiIgLz48L3N2Zz4=) */
-var RefIcon$h = /*#__PURE__*/React.forwardRef(BarsOutlined);
+var RefIcon$g = /*#__PURE__*/React.forwardRef(BarsOutlined);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$h.displayName = 'BarsOutlined';
+  RefIcon$g.displayName = 'BarsOutlined';
 }
 
 const LayoutContext = /*#__PURE__*/React.createContext({
@@ -34155,11 +34155,11 @@ const Sider = /*#__PURE__*/React.forwardRef((props, ref) => {
     onClick: toggle,
     className: classNames(`${prefixCls}-zero-width-trigger`, `${prefixCls}-zero-width-trigger-${reverseArrow ? 'right' : 'left'}`),
     style: zeroWidthTriggerStyle
-  }, trigger || /*#__PURE__*/React.createElement(RefIcon$h, null))) : null;
+  }, trigger || /*#__PURE__*/React.createElement(RefIcon$g, null))) : null;
   const reverseIcon = direction === 'rtl' === !reverseArrow;
   const iconObj = {
-    expanded: reverseIcon ? /*#__PURE__*/React.createElement(RefIcon$m, null) : /*#__PURE__*/React.createElement(RefIcon$i, null),
-    collapsed: reverseIcon ? /*#__PURE__*/React.createElement(RefIcon$i, null) : /*#__PURE__*/React.createElement(RefIcon$m, null)
+    expanded: reverseIcon ? /*#__PURE__*/React.createElement(RefIcon$l, null) : /*#__PURE__*/React.createElement(RefIcon$h, null),
+    collapsed: reverseIcon ? /*#__PURE__*/React.createElement(RefIcon$h, null) : /*#__PURE__*/React.createElement(RefIcon$l, null)
   };
   const status = collapsed ? 'collapsed' : 'expanded';
   const defaultTrigger = iconObj[status];
@@ -34211,9 +34211,9 @@ var EllipsisOutlined = function EllipsisOutlined(props, ref) {
 };
 
 /**![ellipsis](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjY0IDY0IDg5NiA4OTYiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE3NiA1MTFhNTYgNTYgMCAxMDExMiAwIDU2IDU2IDAgMTAtMTEyIDB6bTI4MCAwYTU2IDU2IDAgMTAxMTIgMCA1NiA1NiAwIDEwLTExMiAwem0yODAgMGE1NiA1NiAwIDEwMTEyIDAgNTYgNTYgMCAxMC0xMTIgMHoiIC8+PC9zdmc+) */
-var RefIcon$g = /*#__PURE__*/React.forwardRef(EllipsisOutlined);
+var RefIcon$f = /*#__PURE__*/React.forwardRef(EllipsisOutlined);
 if (process.env.NODE_ENV !== 'production') {
-  RefIcon$g.displayName = 'EllipsisOutlined';
+  RefIcon$f.displayName = 'EllipsisOutlined';
 }
 
 const MenuContext = /*#__PURE__*/createContext$1({
@@ -35534,7 +35534,7 @@ const InternalMenu = /*#__PURE__*/forwardRef((props, ref) => {
     value: contextValue
   }, /*#__PURE__*/React.createElement(ExportMenu, Object.assign({
     getPopupContainer: getPopupContainer,
-    overflowedIndicator: /*#__PURE__*/React.createElement(RefIcon$g, null),
+    overflowedIndicator: /*#__PURE__*/React.createElement(RefIcon$f, null),
     overflowedIndicatorPopupClassName: classNames(prefixCls, `${prefixCls}-${theme}`, overflowedIndicatorPopupClassName),
     mode: mergedMode,
     selectable: mergedSelectable,
@@ -36024,9 +36024,9 @@ const Dropdown$1 = props => {
       rootClassName: classNames(cssVarCls, rootCls),
       expandIcon: /*#__PURE__*/React.createElement("span", {
         className: `${prefixCls}-menu-submenu-arrow`
-      }, direction === 'rtl' ? (/*#__PURE__*/React.createElement(RefIcon$i, {
+      }, direction === 'rtl' ? (/*#__PURE__*/React.createElement(RefIcon$h, {
         className: `${prefixCls}-menu-submenu-arrow-icon`
-      })) : (/*#__PURE__*/React.createElement(RefIcon$m, {
+      })) : (/*#__PURE__*/React.createElement(RefIcon$l, {
         className: `${prefixCls}-menu-submenu-arrow-icon`
       }))),
       mode: "vertical",
@@ -46639,22 +46639,6 @@ if (process.env.NODE_ENV !== 'production') {
   Checkbox.displayName = 'Checkbox';
 }
 
-// This icon file is generated automatically.
-var UpOutlined$1 = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z" } }] }, "name": "up", "theme": "outlined" };
-
-var UpOutlined = function UpOutlined(props, ref) {
-  return /*#__PURE__*/React.createElement(Icon$2, _extends({}, props, {
-    ref: ref,
-    icon: UpOutlined$1
-  }));
-};
-
-/**![up](data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHZpZXdCb3g9IjY0IDY0IDg5NiA4OTYiIGZvY3VzYWJsZT0iZmFsc2UiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTg5MC41IDc1NS4zTDUzNy45IDI2OS4yYy0xMi44LTE3LjYtMzktMTcuNi01MS43IDBMMTMzLjUgNzU1LjNBOCA4IDAgMDAxNDAgNzY4aDc1YzUuMSAwIDkuOS0yLjUgMTIuOS02LjZMNTEyIDM2OS44bDI4NC4xIDM5MS42YzMgNC4xIDcuOCA2LjYgMTIuOSA2LjZoNzVjNi41IDAgMTAuMy03LjQgNi41LTEyLjd6IiAvPjwvc3ZnPg==) */
-var RefIcon$f = /*#__PURE__*/React.forwardRef(UpOutlined);
-if (process.env.NODE_ENV !== 'production') {
-  RefIcon$f.displayName = 'UpOutlined';
-}
-
 function hasAddon(props) {
   return !!(props.addonBefore || props.addonAfter);
 }
@@ -47119,7 +47103,7 @@ const getAllowClear = allowClear => {
     mergedAllowClear = allowClear;
   } else if (allowClear) {
     mergedAllowClear = {
-      clearIcon: /*#__PURE__*/React__default.createElement(RefIcon$r, null)
+      clearIcon: /*#__PURE__*/React__default.createElement(RefIcon$q, null)
     };
   }
   return mergedAllowClear;
@@ -47942,7 +47926,7 @@ const DropdownButton = props => {
       placement,
       getPopupContainer,
       href,
-      icon = /*#__PURE__*/React.createElement(RefIcon$g, null),
+      icon = /*#__PURE__*/React.createElement(RefIcon$f, null),
       title,
       buttonsRender = buttons => buttons,
       mouseEnterDelay,
@@ -49396,12 +49380,12 @@ const Pagination = props => {
       className: `${prefixCls}-item-link`,
       type: "button",
       tabIndex: -1
-    }, direction === 'rtl' ? /*#__PURE__*/React.createElement(RefIcon$m, null) : /*#__PURE__*/React.createElement(RefIcon$i, null));
+    }, direction === 'rtl' ? /*#__PURE__*/React.createElement(RefIcon$l, null) : /*#__PURE__*/React.createElement(RefIcon$h, null));
     const nextIcon = /*#__PURE__*/React.createElement("button", {
       className: `${prefixCls}-item-link`,
       type: "button",
       tabIndex: -1
-    }, direction === 'rtl' ? /*#__PURE__*/React.createElement(RefIcon$i, null) : /*#__PURE__*/React.createElement(RefIcon$m, null));
+    }, direction === 'rtl' ? /*#__PURE__*/React.createElement(RefIcon$h, null) : /*#__PURE__*/React.createElement(RefIcon$l, null));
     const jumpPrevIcon =
     /*#__PURE__*/
     // biome-ignore lint/a11y/useValidAnchor: it is hard to refactor
@@ -54593,7 +54577,7 @@ const useSelection = (config, rowSelection) => {
         }, /*#__PURE__*/React.createElement(Dropdown, {
           menu: menu,
           getPopupContainer: getPopupContainer
-        }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(RefIcon$k, null))));
+        }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(RefIcon$j, null))));
       }
       const allDisabledData = flattedData.map((record, index) => {
         const key = getRowKey(record, index);
@@ -57046,7 +57030,7 @@ const SwitcherIconCom = props => {
     if (/*#__PURE__*/React.isValidElement(switcherLoadingIcon)) {
       return switcherLoadingIcon;
     }
-    return /*#__PURE__*/React.createElement(RefIcon$n, {
+    return /*#__PURE__*/React.createElement(RefIcon$m, {
       className: `${prefixCls}-switcher-loading-icon`
     });
   }
@@ -57439,7 +57423,7 @@ const FilterSearch = props => {
   return /*#__PURE__*/React.createElement("div", {
     className: `${tablePrefixCls}-filter-dropdown-search`
   }, /*#__PURE__*/React.createElement(Input, {
-    prefix: /*#__PURE__*/React.createElement(RefIcon$j, null),
+    prefix: /*#__PURE__*/React.createElement(RefIcon$i, null),
     placeholder: locale.filterSearchPlaceholder,
     onChange: onChange,
     value: value,
@@ -61635,6 +61619,12 @@ function ChevronRightIcon(props) {
     return (jsx("svg", { width: width, height: height, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest, children: jsx("path", { d: "M6 12L10 8L6 4", stroke: "currentColor", "stroke-linecap": "round", "stroke-linejoin": "round" }) }));
 }
 
+const SortTableIcon = (props) => (jsx("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: jsx("path", { d: "M4.66666 9.99996L7.99999 13.3333L11.3333 9.99996M4.66666 5.99996L7.99999 2.66663L11.3333 5.99996", stroke: "#505A5F", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+
+const LineArrowsDown = (props) => (jsx("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: jsx("path", { d: "M11.3333 2.66663V9.99996M11.3333 9.99996L8.66667 7.33329M11.3333 9.99996L14 7.33329M4.66667 2.66663V13.3333M4.66667 13.3333L2 10.6666M4.66667 13.3333L7.33333 10.6666", stroke: "#505A5F", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+
+const LineArrowsUp = (props) => (jsx("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: jsx("path", { d: "M4.66667 13.3333V2.66663M4.66667 2.66663L2 5.33329M4.66667 2.66663L7.33333 5.33329M11.3333 13.3333V5.99996M11.3333 5.99996L8.66667 8.66663M11.3333 5.99996L14 8.66663", stroke: "#505A5F", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+
 const renderSystemNotification = ({ title, description, imgUrl, okText = "ok", cancelText = "Dismiss", moreOption, onMoreClick, onOk, onCancel, onClose, }) => {
     return (jsxs(DivNotificationSystemWrapperSC, { children: [jsx(ImgNotificationSystemSC, { src: imgUrl }), jsxs(DivNotificationSystemContainerSC, { children: [jsxs(DivNotificationContentWrapperSC, { children: [jsxs(DivNotificationContentSC, { children: [jsxs(DivNotificationHeaderSC, { children: [jsx(DivNotificationTitleSC, { children: title }), moreOption && (jsx(DivIconActionSC, { children: jsx(FISIconButton, { variant: "tertiary-invisible", size: "xs", icon: jsx(MoreIcon, {}), onClick: onMoreClick }) }))] }), jsx(DivNotificationDescriptionSC, { children: description })] }), jsxs(DivNotificationActionsSC, { children: [jsx(FISLinkButton, { size: "xs", variant: "hight-priority", onClick: onOk, children: okText }), jsx(FISLinkButton, { size: "xs", onClick: onCancel, children: cancelText })] })] }), jsx(DivIconActionSC, { children: jsx(FISIconButton, { icon: jsx(CloseIcon, {}), size: "xs", variant: "tertiary-invisible", onClick: onClose }) })] })] }));
 };
@@ -71290,13 +71280,10 @@ const DivHeaderCellContainerSC = styled.div `
 
       .right-component-father {
         display: flex;
+        align-items: center;
         justify-content: center;
         width: ${getTheme("com/button/size-xs/icon/size-icon")};
         height: ${getTheme("com/button/size-xs/icon/size-icon")};
-        .right-component-child {
-          flex-shrink: 0;
-          align-self: center;
-        }
       }
 
       ${(props) => {
@@ -71323,7 +71310,7 @@ const DivHeaderCellContainerSC = styled.div `
 `;
 
 const FISTableHeaderCell = forwardRef(({ className, label, description, rightComponent, disabled, hasRightDivider = true, hasTruncateLabel = false, onlyIcon = false, textAlign = "left", ...rest }, ref) => {
-    return (jsx(DivHeaderCellContainerSC, { ref: ref, className: classNames("header-cell-container", className), "$textAlign": textAlign, "$disabled": disabled, "$hasTruncateLabel": hasTruncateLabel, "$hasRightDivider": hasRightDivider, "$onlyIcon": onlyIcon, ...rest, children: jsxs("div", { className: "header-cell-content", children: [jsxs("div", { className: "cell-content title", children: [label && jsx("div", { className: "label", children: label }), rightComponent && (jsx("div", { className: "right-component-father", children: jsx("div", { className: "right-component-child", children: rightComponent }) }))] }), description && (jsx("div", { className: "cell-content", children: jsx("div", { className: "description", children: description }) }))] }) }));
+    return (jsx(DivHeaderCellContainerSC, { ref: ref, className: classNames("header-cell-container", className), "$textAlign": textAlign, "$disabled": disabled, "$hasTruncateLabel": hasTruncateLabel, "$hasRightDivider": hasRightDivider, "$onlyIcon": onlyIcon, ...rest, children: jsxs("div", { className: "header-cell-content", children: [jsxs("div", { className: "cell-content title", children: [label && jsx("div", { className: "label", children: label }), rightComponent && (jsx("div", { className: "right-component-father", children: rightComponent }))] }), description && (jsx("div", { className: "cell-content", children: jsx("div", { className: "description", children: description }) }))] }) }));
 });
 FISTableHeaderCell.displayName = "FISTableHeaderCell";
 
@@ -71633,20 +71620,7 @@ const SORT_ORDERS = {
     DESCEND: "descend",
     NONE: null,
 };
-const SortAction = styled(FISIconButton) `
-  margin-top: -2px;
-  .sort-icon {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-
-    span {
-      width: 6px;
-      height: 5px;
-    }
-  }
-`;
-const FISSorter = ({ columnKey, onSort, sortedInfo, colorActive = "#2489e1", UpIcon = RefIcon$f, DownIcon = RefIcon$k, }) => {
+const FISSorter = ({ columnKey, onSort, sortedInfo, UpIcon = LineArrowsUp, DownIcon = LineArrowsDown, }) => {
     const currentOrder = sortedInfo.columnKey === columnKey ? sortedInfo.order : SORT_ORDERS.NONE;
     const handleSort = () => {
         const newOrder = currentOrder === SORT_ORDERS.ASCEND
@@ -71656,11 +71630,16 @@ const FISSorter = ({ columnKey, onSort, sortedInfo, colorActive = "#2489e1", UpI
                 : SORT_ORDERS.ASCEND;
         onSort(columnKey, newOrder);
     };
-    return (jsx(SortAction, { size: "xs", variant: "tertiary-invisible", onClick: handleSort, icon: jsxs("div", { className: "sort-icon", children: [jsx(UpIcon, { style: {
-                        color: currentOrder === SORT_ORDERS.ASCEND ? colorActive : "inherit",
-                    } }), jsx(DownIcon, { style: {
-                        color: currentOrder === SORT_ORDERS.DESCEND ? colorActive : "inherit",
-                    } })] }) }));
+    const renderSortIcon = () => {
+        if (currentOrder === SORT_ORDERS.ASCEND) {
+            return jsx(UpIcon, {});
+        }
+        if (currentOrder === SORT_ORDERS.DESCEND) {
+            return jsx(DownIcon, {});
+        }
+        return jsx(SortTableIcon, {});
+    };
+    return (jsx(FISIconButton, { onClick: handleSort, variant: "tertiary-invisible", size: "xs", icon: renderSortIcon() }));
 };
 
 const DivDateRangeContainerSC = styled.div `