fis-component 0.0.51 → 0.0.53
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/dist/cjs/index.js +313 -214
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/src/assets/icons/LineArrowsDown.d.ts +2 -0
- package/dist/cjs/types/src/assets/icons/LineArrowsUp.d.ts +3 -0
- package/dist/cjs/types/src/assets/icons/PositiveIcon.d.ts +3 -0
- package/dist/cjs/types/src/assets/icons/SortTableIcon.d.ts +3 -0
- package/dist/cjs/types/src/assets/icons/index.d.ts +4 -0
- package/dist/cjs/types/src/components/Input/InputField/index.d.ts +2 -0
- package/dist/cjs/types/src/components/Input/InputField/styles.d.ts +3 -1
- package/dist/cjs/types/src/components/MenuSelect/types.d.ts +2 -0
- package/dist/cjs/types/src/components/Pagination/styles.d.ts +18 -6
- package/dist/cjs/types/src/components/Select/Select.stories.d.ts +10 -4
- package/dist/cjs/types/src/components/Select/types.d.ts +20 -17
- package/dist/cjs/types/src/components/Table/Sorter/FISSorter.d.ts +1 -2
- package/dist/esm/index.js +313 -214
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/src/assets/icons/LineArrowsDown.d.ts +2 -0
- package/dist/esm/types/src/assets/icons/LineArrowsUp.d.ts +3 -0
- package/dist/esm/types/src/assets/icons/PositiveIcon.d.ts +3 -0
- package/dist/esm/types/src/assets/icons/SortTableIcon.d.ts +3 -0
- package/dist/esm/types/src/assets/icons/index.d.ts +4 -0
- package/dist/esm/types/src/components/Input/InputField/index.d.ts +2 -0
- package/dist/esm/types/src/components/Input/InputField/styles.d.ts +3 -1
- package/dist/esm/types/src/components/MenuSelect/types.d.ts +2 -0
- package/dist/esm/types/src/components/Pagination/styles.d.ts +18 -6
- package/dist/esm/types/src/components/Select/Select.stories.d.ts +10 -4
- package/dist/esm/types/src/components/Select/types.d.ts +20 -17
- package/dist/esm/types/src/components/Table/Sorter/FISSorter.d.ts +1 -2
- package/dist/index.d.ts +27 -22
- package/package.json +1 -1
package/dist/cjs/index.js
CHANGED
|
@@ -12160,9 +12160,9 @@ var CheckCircleFilled = function CheckCircleFilled(props, ref) {
|
|
|
12160
12160
|
};
|
|
12161
12161
|
|
|
12162
12162
|
/** */
|
|
12163
|
-
var RefIcon$
|
|
12163
|
+
var RefIcon$r = /*#__PURE__*/React__namespace.forwardRef(CheckCircleFilled);
|
|
12164
12164
|
if (process.env.NODE_ENV !== 'production') {
|
|
12165
|
-
RefIcon$
|
|
12165
|
+
RefIcon$r.displayName = 'CheckCircleFilled';
|
|
12166
12166
|
}
|
|
12167
12167
|
|
|
12168
12168
|
// This icon file is generated automatically.
|
|
@@ -12176,9 +12176,9 @@ var CloseCircleFilled = function CloseCircleFilled(props, ref) {
|
|
|
12176
12176
|
};
|
|
12177
12177
|
|
|
12178
12178
|
/** */
|
|
12179
|
-
var RefIcon$
|
|
12179
|
+
var RefIcon$q = /*#__PURE__*/React__namespace.forwardRef(CloseCircleFilled);
|
|
12180
12180
|
if (process.env.NODE_ENV !== 'production') {
|
|
12181
|
-
RefIcon$
|
|
12181
|
+
RefIcon$q.displayName = 'CloseCircleFilled';
|
|
12182
12182
|
}
|
|
12183
12183
|
|
|
12184
12184
|
// This icon file is generated automatically.
|
|
@@ -12192,9 +12192,9 @@ var CloseOutlined = function CloseOutlined(props, ref) {
|
|
|
12192
12192
|
};
|
|
12193
12193
|
|
|
12194
12194
|
/** */
|
|
12195
|
-
var RefIcon$
|
|
12195
|
+
var RefIcon$p = /*#__PURE__*/React__namespace.forwardRef(CloseOutlined);
|
|
12196
12196
|
if (process.env.NODE_ENV !== 'production') {
|
|
12197
|
-
RefIcon$
|
|
12197
|
+
RefIcon$p.displayName = 'CloseOutlined';
|
|
12198
12198
|
}
|
|
12199
12199
|
|
|
12200
12200
|
// This icon file is generated automatically.
|
|
@@ -12208,9 +12208,9 @@ var ExclamationCircleFilled = function ExclamationCircleFilled(props, ref) {
|
|
|
12208
12208
|
};
|
|
12209
12209
|
|
|
12210
12210
|
/** */
|
|
12211
|
-
var RefIcon$
|
|
12211
|
+
var RefIcon$o = /*#__PURE__*/React__namespace.forwardRef(ExclamationCircleFilled);
|
|
12212
12212
|
if (process.env.NODE_ENV !== 'production') {
|
|
12213
|
-
RefIcon$
|
|
12213
|
+
RefIcon$o.displayName = 'ExclamationCircleFilled';
|
|
12214
12214
|
}
|
|
12215
12215
|
|
|
12216
12216
|
// This icon file is generated automatically.
|
|
@@ -12224,9 +12224,9 @@ var InfoCircleFilled = function InfoCircleFilled(props, ref) {
|
|
|
12224
12224
|
};
|
|
12225
12225
|
|
|
12226
12226
|
/** */
|
|
12227
|
-
var RefIcon$
|
|
12227
|
+
var RefIcon$n = /*#__PURE__*/React__namespace.forwardRef(InfoCircleFilled);
|
|
12228
12228
|
if (process.env.NODE_ENV !== 'production') {
|
|
12229
|
-
RefIcon$
|
|
12229
|
+
RefIcon$n.displayName = 'InfoCircleFilled';
|
|
12230
12230
|
}
|
|
12231
12231
|
|
|
12232
12232
|
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";
|
|
@@ -13145,9 +13145,9 @@ var LoadingOutlined = function LoadingOutlined(props, ref) {
|
|
|
13145
13145
|
};
|
|
13146
13146
|
|
|
13147
13147
|
/** */
|
|
13148
|
-
var RefIcon$
|
|
13148
|
+
var RefIcon$m = /*#__PURE__*/React__namespace.forwardRef(LoadingOutlined);
|
|
13149
13149
|
if (process.env.NODE_ENV !== 'production') {
|
|
13150
|
-
RefIcon$
|
|
13150
|
+
RefIcon$m.displayName = 'LoadingOutlined';
|
|
13151
13151
|
}
|
|
13152
13152
|
|
|
13153
13153
|
const zIndexContext = /*#__PURE__*/React.createContext(undefined);
|
|
@@ -14334,7 +14334,7 @@ const InnerLoadingIcon = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
14334
14334
|
className: mergedIconCls,
|
|
14335
14335
|
style: style,
|
|
14336
14336
|
ref: ref
|
|
14337
|
-
}, /*#__PURE__*/React.createElement(RefIcon$
|
|
14337
|
+
}, /*#__PURE__*/React.createElement(RefIcon$m, {
|
|
14338
14338
|
className: iconClassName
|
|
14339
14339
|
}));
|
|
14340
14340
|
});
|
|
@@ -15202,9 +15202,9 @@ var RightOutlined = function RightOutlined(props, ref) {
|
|
|
15202
15202
|
};
|
|
15203
15203
|
|
|
15204
15204
|
/** */
|
|
15205
|
-
var RefIcon$
|
|
15205
|
+
var RefIcon$l = /*#__PURE__*/React__namespace.forwardRef(RightOutlined);
|
|
15206
15206
|
if (process.env.NODE_ENV !== 'production') {
|
|
15207
|
-
RefIcon$
|
|
15207
|
+
RefIcon$l.displayName = 'RightOutlined';
|
|
15208
15208
|
}
|
|
15209
15209
|
|
|
15210
15210
|
var PanelContent = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
@@ -16380,7 +16380,7 @@ const Collapse = /*#__PURE__*/React__namespace.forwardRef((props, ref) => {
|
|
|
16380
16380
|
const mergedExpandIcon = expandIcon !== null && expandIcon !== void 0 ? expandIcon : contextExpandIcon;
|
|
16381
16381
|
const renderExpandIcon = React__namespace.useCallback(function () {
|
|
16382
16382
|
let panelProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
16383
|
-
const icon = typeof mergedExpandIcon === 'function' ? mergedExpandIcon(panelProps) : (/*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
16383
|
+
const icon = typeof mergedExpandIcon === 'function' ? mergedExpandIcon(panelProps) : (/*#__PURE__*/React__namespace.createElement(RefIcon$l, {
|
|
16384
16384
|
rotate: panelProps.isActive ? direction === 'rtl' ? -90 : 90 : undefined,
|
|
16385
16385
|
"aria-label": panelProps.isActive ? 'expanded' : 'collapsed'
|
|
16386
16386
|
}));
|
|
@@ -21872,15 +21872,15 @@ function getCloseIcon(prefixCls, closeIcon) {
|
|
|
21872
21872
|
if (closeIcon === null || closeIcon === false) {
|
|
21873
21873
|
return null;
|
|
21874
21874
|
}
|
|
21875
|
-
return closeIcon || /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
21875
|
+
return closeIcon || /*#__PURE__*/React__namespace.createElement(RefIcon$p, {
|
|
21876
21876
|
className: `${prefixCls}-close-icon`
|
|
21877
21877
|
});
|
|
21878
21878
|
}
|
|
21879
21879
|
const typeToIcon = {
|
|
21880
|
-
success: RefIcon$
|
|
21881
|
-
info: RefIcon$
|
|
21882
|
-
error: RefIcon$
|
|
21883
|
-
warning: RefIcon$
|
|
21880
|
+
success: RefIcon$r,
|
|
21881
|
+
info: RefIcon$n,
|
|
21882
|
+
error: RefIcon$q,
|
|
21883
|
+
warning: RefIcon$o
|
|
21884
21884
|
};
|
|
21885
21885
|
const PureContent = props => {
|
|
21886
21886
|
const {
|
|
@@ -30195,9 +30195,9 @@ var CheckOutlined = function CheckOutlined(props, ref) {
|
|
|
30195
30195
|
};
|
|
30196
30196
|
|
|
30197
30197
|
/** */
|
|
30198
|
-
var RefIcon$
|
|
30198
|
+
var RefIcon$k = /*#__PURE__*/React__namespace.forwardRef(CheckOutlined);
|
|
30199
30199
|
if (process.env.NODE_ENV !== 'production') {
|
|
30200
|
-
RefIcon$
|
|
30200
|
+
RefIcon$k.displayName = 'CheckOutlined';
|
|
30201
30201
|
}
|
|
30202
30202
|
|
|
30203
30203
|
// This icon file is generated automatically.
|
|
@@ -30211,9 +30211,9 @@ var DownOutlined = function DownOutlined(props, ref) {
|
|
|
30211
30211
|
};
|
|
30212
30212
|
|
|
30213
30213
|
/** */
|
|
30214
|
-
var RefIcon$
|
|
30214
|
+
var RefIcon$j = /*#__PURE__*/React__namespace.forwardRef(DownOutlined);
|
|
30215
30215
|
if (process.env.NODE_ENV !== 'production') {
|
|
30216
|
-
RefIcon$
|
|
30216
|
+
RefIcon$j.displayName = 'DownOutlined';
|
|
30217
30217
|
}
|
|
30218
30218
|
|
|
30219
30219
|
// This icon file is generated automatically.
|
|
@@ -30227,9 +30227,9 @@ var SearchOutlined = function SearchOutlined(props, ref) {
|
|
|
30227
30227
|
};
|
|
30228
30228
|
|
|
30229
30229
|
/** */
|
|
30230
|
-
var RefIcon$
|
|
30230
|
+
var RefIcon$i = /*#__PURE__*/React__namespace.forwardRef(SearchOutlined);
|
|
30231
30231
|
if (process.env.NODE_ENV !== 'production') {
|
|
30232
|
-
RefIcon$
|
|
30232
|
+
RefIcon$i.displayName = 'SearchOutlined';
|
|
30233
30233
|
}
|
|
30234
30234
|
|
|
30235
30235
|
function useIcons$1(_ref) {
|
|
@@ -30252,7 +30252,7 @@ function useIcons$1(_ref) {
|
|
|
30252
30252
|
warning.deprecated(!clearIcon, 'clearIcon', 'allowClear={{ clearIcon: React.ReactNode }}');
|
|
30253
30253
|
}
|
|
30254
30254
|
// Clear Icon
|
|
30255
|
-
const mergedClearIcon = clearIcon !== null && clearIcon !== void 0 ? clearIcon : /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
30255
|
+
const mergedClearIcon = clearIcon !== null && clearIcon !== void 0 ? clearIcon : /*#__PURE__*/React__namespace.createElement(RefIcon$q, null);
|
|
30256
30256
|
// Validation Feedback Icon
|
|
30257
30257
|
const getSuffixIconNode = arrowIcon => {
|
|
30258
30258
|
if (suffixIcon === null && !hasFeedback && !showArrow) {
|
|
@@ -30265,7 +30265,7 @@ function useIcons$1(_ref) {
|
|
|
30265
30265
|
if (suffixIcon !== undefined) {
|
|
30266
30266
|
mergedSuffixIcon = getSuffixIconNode(suffixIcon);
|
|
30267
30267
|
} else if (loading) {
|
|
30268
|
-
mergedSuffixIcon = getSuffixIconNode(/*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
30268
|
+
mergedSuffixIcon = getSuffixIconNode(/*#__PURE__*/React__namespace.createElement(RefIcon$m, {
|
|
30269
30269
|
spin: true
|
|
30270
30270
|
}));
|
|
30271
30271
|
} else {
|
|
@@ -30276,11 +30276,11 @@ function useIcons$1(_ref) {
|
|
|
30276
30276
|
showSearch
|
|
30277
30277
|
} = _ref2;
|
|
30278
30278
|
if (open && showSearch) {
|
|
30279
|
-
return getSuffixIconNode(/*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
30279
|
+
return getSuffixIconNode(/*#__PURE__*/React__namespace.createElement(RefIcon$i, {
|
|
30280
30280
|
className: iconCls
|
|
30281
30281
|
}));
|
|
30282
30282
|
}
|
|
30283
|
-
return getSuffixIconNode(/*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
30283
|
+
return getSuffixIconNode(/*#__PURE__*/React__namespace.createElement(RefIcon$j, {
|
|
30284
30284
|
className: iconCls
|
|
30285
30285
|
}));
|
|
30286
30286
|
};
|
|
@@ -30290,7 +30290,7 @@ function useIcons$1(_ref) {
|
|
|
30290
30290
|
if (menuItemSelectedIcon !== undefined) {
|
|
30291
30291
|
mergedItemIcon = menuItemSelectedIcon;
|
|
30292
30292
|
} else if (multiple) {
|
|
30293
|
-
mergedItemIcon = /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
30293
|
+
mergedItemIcon = /*#__PURE__*/React__namespace.createElement(RefIcon$k, null);
|
|
30294
30294
|
} else {
|
|
30295
30295
|
mergedItemIcon = null;
|
|
30296
30296
|
}
|
|
@@ -30298,7 +30298,7 @@ function useIcons$1(_ref) {
|
|
|
30298
30298
|
if (removeIcon !== undefined) {
|
|
30299
30299
|
mergedRemoveIcon = removeIcon;
|
|
30300
30300
|
} else {
|
|
30301
|
-
mergedRemoveIcon = /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
30301
|
+
mergedRemoveIcon = /*#__PURE__*/React__namespace.createElement(RefIcon$p, null);
|
|
30302
30302
|
}
|
|
30303
30303
|
return {
|
|
30304
30304
|
clearIcon: mergedClearIcon,
|
|
@@ -31619,9 +31619,9 @@ var LeftOutlined = function LeftOutlined(props, ref) {
|
|
|
31619
31619
|
};
|
|
31620
31620
|
|
|
31621
31621
|
/** */
|
|
31622
|
-
var RefIcon$
|
|
31622
|
+
var RefIcon$h = /*#__PURE__*/React__namespace.forwardRef(LeftOutlined);
|
|
31623
31623
|
if (process.env.NODE_ENV !== 'production') {
|
|
31624
|
-
RefIcon$
|
|
31624
|
+
RefIcon$h.displayName = 'LeftOutlined';
|
|
31625
31625
|
}
|
|
31626
31626
|
|
|
31627
31627
|
var ESC$1 = KeyCode.ESC,
|
|
@@ -33819,9 +33819,9 @@ var BarsOutlined = function BarsOutlined(props, ref) {
|
|
|
33819
33819
|
};
|
|
33820
33820
|
|
|
33821
33821
|
/** */
|
|
33822
|
-
var RefIcon$
|
|
33822
|
+
var RefIcon$g = /*#__PURE__*/React__namespace.forwardRef(BarsOutlined);
|
|
33823
33823
|
if (process.env.NODE_ENV !== 'production') {
|
|
33824
|
-
RefIcon$
|
|
33824
|
+
RefIcon$g.displayName = 'BarsOutlined';
|
|
33825
33825
|
}
|
|
33826
33826
|
|
|
33827
33827
|
const LayoutContext = /*#__PURE__*/React__namespace.createContext({
|
|
@@ -34175,11 +34175,11 @@ const Sider = /*#__PURE__*/React__namespace.forwardRef((props, ref) => {
|
|
|
34175
34175
|
onClick: toggle,
|
|
34176
34176
|
className: classNames(`${prefixCls}-zero-width-trigger`, `${prefixCls}-zero-width-trigger-${reverseArrow ? 'right' : 'left'}`),
|
|
34177
34177
|
style: zeroWidthTriggerStyle
|
|
34178
|
-
}, trigger || /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
34178
|
+
}, trigger || /*#__PURE__*/React__namespace.createElement(RefIcon$g, null))) : null;
|
|
34179
34179
|
const reverseIcon = direction === 'rtl' === !reverseArrow;
|
|
34180
34180
|
const iconObj = {
|
|
34181
|
-
expanded: reverseIcon ? /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
34182
|
-
collapsed: reverseIcon ? /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
34181
|
+
expanded: reverseIcon ? /*#__PURE__*/React__namespace.createElement(RefIcon$l, null) : /*#__PURE__*/React__namespace.createElement(RefIcon$h, null),
|
|
34182
|
+
collapsed: reverseIcon ? /*#__PURE__*/React__namespace.createElement(RefIcon$h, null) : /*#__PURE__*/React__namespace.createElement(RefIcon$l, null)
|
|
34183
34183
|
};
|
|
34184
34184
|
const status = collapsed ? 'collapsed' : 'expanded';
|
|
34185
34185
|
const defaultTrigger = iconObj[status];
|
|
@@ -34231,9 +34231,9 @@ var EllipsisOutlined = function EllipsisOutlined(props, ref) {
|
|
|
34231
34231
|
};
|
|
34232
34232
|
|
|
34233
34233
|
/** */
|
|
34234
|
-
var RefIcon$
|
|
34234
|
+
var RefIcon$f = /*#__PURE__*/React__namespace.forwardRef(EllipsisOutlined);
|
|
34235
34235
|
if (process.env.NODE_ENV !== 'production') {
|
|
34236
|
-
RefIcon$
|
|
34236
|
+
RefIcon$f.displayName = 'EllipsisOutlined';
|
|
34237
34237
|
}
|
|
34238
34238
|
|
|
34239
34239
|
const MenuContext = /*#__PURE__*/React.createContext({
|
|
@@ -35554,7 +35554,7 @@ const InternalMenu = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
35554
35554
|
value: contextValue
|
|
35555
35555
|
}, /*#__PURE__*/React__namespace.createElement(ExportMenu, Object.assign({
|
|
35556
35556
|
getPopupContainer: getPopupContainer,
|
|
35557
|
-
overflowedIndicator: /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
35557
|
+
overflowedIndicator: /*#__PURE__*/React__namespace.createElement(RefIcon$f, null),
|
|
35558
35558
|
overflowedIndicatorPopupClassName: classNames(prefixCls, `${prefixCls}-${theme}`, overflowedIndicatorPopupClassName),
|
|
35559
35559
|
mode: mergedMode,
|
|
35560
35560
|
selectable: mergedSelectable,
|
|
@@ -36044,9 +36044,9 @@ const Dropdown$1 = props => {
|
|
|
36044
36044
|
rootClassName: classNames(cssVarCls, rootCls),
|
|
36045
36045
|
expandIcon: /*#__PURE__*/React__namespace.createElement("span", {
|
|
36046
36046
|
className: `${prefixCls}-menu-submenu-arrow`
|
|
36047
|
-
}, direction === 'rtl' ? (/*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
36047
|
+
}, direction === 'rtl' ? (/*#__PURE__*/React__namespace.createElement(RefIcon$h, {
|
|
36048
36048
|
className: `${prefixCls}-menu-submenu-arrow-icon`
|
|
36049
|
-
})) : (/*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
36049
|
+
})) : (/*#__PURE__*/React__namespace.createElement(RefIcon$l, {
|
|
36050
36050
|
className: `${prefixCls}-menu-submenu-arrow-icon`
|
|
36051
36051
|
}))),
|
|
36052
36052
|
mode: "vertical",
|
|
@@ -46659,22 +46659,6 @@ if (process.env.NODE_ENV !== 'production') {
|
|
|
46659
46659
|
Checkbox.displayName = 'Checkbox';
|
|
46660
46660
|
}
|
|
46661
46661
|
|
|
46662
|
-
// This icon file is generated automatically.
|
|
46663
|
-
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" };
|
|
46664
|
-
|
|
46665
|
-
var UpOutlined = function UpOutlined(props, ref) {
|
|
46666
|
-
return /*#__PURE__*/React__namespace.createElement(Icon$2, _extends({}, props, {
|
|
46667
|
-
ref: ref,
|
|
46668
|
-
icon: UpOutlined$1
|
|
46669
|
-
}));
|
|
46670
|
-
};
|
|
46671
|
-
|
|
46672
|
-
/** */
|
|
46673
|
-
var RefIcon$f = /*#__PURE__*/React__namespace.forwardRef(UpOutlined);
|
|
46674
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
46675
|
-
RefIcon$f.displayName = 'UpOutlined';
|
|
46676
|
-
}
|
|
46677
|
-
|
|
46678
46662
|
function hasAddon(props) {
|
|
46679
46663
|
return !!(props.addonBefore || props.addonAfter);
|
|
46680
46664
|
}
|
|
@@ -47139,7 +47123,7 @@ const getAllowClear = allowClear => {
|
|
|
47139
47123
|
mergedAllowClear = allowClear;
|
|
47140
47124
|
} else if (allowClear) {
|
|
47141
47125
|
mergedAllowClear = {
|
|
47142
|
-
clearIcon: /*#__PURE__*/React.createElement(RefIcon$
|
|
47126
|
+
clearIcon: /*#__PURE__*/React.createElement(RefIcon$q, null)
|
|
47143
47127
|
};
|
|
47144
47128
|
}
|
|
47145
47129
|
return mergedAllowClear;
|
|
@@ -47962,7 +47946,7 @@ const DropdownButton = props => {
|
|
|
47962
47946
|
placement,
|
|
47963
47947
|
getPopupContainer,
|
|
47964
47948
|
href,
|
|
47965
|
-
icon = /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
47949
|
+
icon = /*#__PURE__*/React__namespace.createElement(RefIcon$f, null),
|
|
47966
47950
|
title,
|
|
47967
47951
|
buttonsRender = buttons => buttons,
|
|
47968
47952
|
mouseEnterDelay,
|
|
@@ -49416,12 +49400,12 @@ const Pagination = props => {
|
|
|
49416
49400
|
className: `${prefixCls}-item-link`,
|
|
49417
49401
|
type: "button",
|
|
49418
49402
|
tabIndex: -1
|
|
49419
|
-
}, direction === 'rtl' ? /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
49403
|
+
}, direction === 'rtl' ? /*#__PURE__*/React__namespace.createElement(RefIcon$l, null) : /*#__PURE__*/React__namespace.createElement(RefIcon$h, null));
|
|
49420
49404
|
const nextIcon = /*#__PURE__*/React__namespace.createElement("button", {
|
|
49421
49405
|
className: `${prefixCls}-item-link`,
|
|
49422
49406
|
type: "button",
|
|
49423
49407
|
tabIndex: -1
|
|
49424
|
-
}, direction === 'rtl' ? /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
49408
|
+
}, direction === 'rtl' ? /*#__PURE__*/React__namespace.createElement(RefIcon$h, null) : /*#__PURE__*/React__namespace.createElement(RefIcon$l, null));
|
|
49425
49409
|
const jumpPrevIcon =
|
|
49426
49410
|
/*#__PURE__*/
|
|
49427
49411
|
// biome-ignore lint/a11y/useValidAnchor: it is hard to refactor
|
|
@@ -54613,7 +54597,7 @@ const useSelection = (config, rowSelection) => {
|
|
|
54613
54597
|
}, /*#__PURE__*/React__namespace.createElement(Dropdown, {
|
|
54614
54598
|
menu: menu,
|
|
54615
54599
|
getPopupContainer: getPopupContainer
|
|
54616
|
-
}, /*#__PURE__*/React__namespace.createElement("span", null, /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
54600
|
+
}, /*#__PURE__*/React__namespace.createElement("span", null, /*#__PURE__*/React__namespace.createElement(RefIcon$j, null))));
|
|
54617
54601
|
}
|
|
54618
54602
|
const allDisabledData = flattedData.map((record, index) => {
|
|
54619
54603
|
const key = getRowKey(record, index);
|
|
@@ -57066,7 +57050,7 @@ const SwitcherIconCom = props => {
|
|
|
57066
57050
|
if (/*#__PURE__*/React__namespace.isValidElement(switcherLoadingIcon)) {
|
|
57067
57051
|
return switcherLoadingIcon;
|
|
57068
57052
|
}
|
|
57069
|
-
return /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
57053
|
+
return /*#__PURE__*/React__namespace.createElement(RefIcon$m, {
|
|
57070
57054
|
className: `${prefixCls}-switcher-loading-icon`
|
|
57071
57055
|
});
|
|
57072
57056
|
}
|
|
@@ -57459,7 +57443,7 @@ const FilterSearch = props => {
|
|
|
57459
57443
|
return /*#__PURE__*/React__namespace.createElement("div", {
|
|
57460
57444
|
className: `${tablePrefixCls}-filter-dropdown-search`
|
|
57461
57445
|
}, /*#__PURE__*/React__namespace.createElement(Input, {
|
|
57462
|
-
prefix: /*#__PURE__*/React__namespace.createElement(RefIcon$
|
|
57446
|
+
prefix: /*#__PURE__*/React__namespace.createElement(RefIcon$i, null),
|
|
57463
57447
|
placeholder: locale.filterSearchPlaceholder,
|
|
57464
57448
|
onChange: onChange,
|
|
57465
57449
|
value: value,
|
|
@@ -61568,7 +61552,7 @@ function ExitIcon(props) {
|
|
|
61568
61552
|
}
|
|
61569
61553
|
|
|
61570
61554
|
function InfoIcon(props) {
|
|
61571
|
-
return (jsxRuntime.
|
|
61555
|
+
return (jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M7.99996 0.666626C3.94987 0.666626 0.666626 3.94987 0.666626 7.99996C0.666626 12.05 3.94987 15.3333 7.99996 15.3333C12.05 15.3333 15.3333 12.05 15.3333 7.99996C15.3333 3.94987 12.05 0.666626 7.99996 0.666626ZM7.99996 4.66663C7.63177 4.66663 7.33329 4.9651 7.33329 5.33329C7.33329 5.70148 7.63177 5.99996 7.99996 5.99996H8.00663C8.37482 5.99996 8.67329 5.70148 8.67329 5.33329C8.67329 4.9651 8.37482 4.66663 8.00663 4.66663H7.99996ZM8.66663 7.99996C8.66663 7.63177 8.36815 7.33329 7.99996 7.33329C7.63177 7.33329 7.33329 7.63177 7.33329 7.99996V10.6666C7.33329 11.0348 7.63177 11.3333 7.99996 11.3333C8.36815 11.3333 8.66663 11.0348 8.66663 10.6666V7.99996Z", fill: "#0055C2" }) }));
|
|
61572
61556
|
}
|
|
61573
61557
|
|
|
61574
61558
|
function CheckIcon(props) {
|
|
@@ -61578,12 +61562,17 @@ function CheckIcon(props) {
|
|
|
61578
61562
|
|
|
61579
61563
|
function WarningIcon(props) {
|
|
61580
61564
|
const { width = 16, height = 16, ...rest } = props;
|
|
61581
|
-
return (jsxRuntime.jsx("svg", { width: width, height: height, viewBox: "0 0
|
|
61565
|
+
return (jsxRuntime.jsx("svg", { width: width, height: height, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest, children: jsxRuntime.jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M7.99996 0.666626C3.94987 0.666626 0.666626 3.94987 0.666626 7.99996C0.666626 12.05 3.94987 15.3333 7.99996 15.3333C12.05 15.3333 15.3333 12.05 15.3333 7.99996C15.3333 3.94987 12.05 0.666626 7.99996 0.666626ZM8.66663 5.33329C8.66663 4.9651 8.36815 4.66663 7.99996 4.66663C7.63177 4.66663 7.33329 4.9651 7.33329 5.33329V7.99996C7.33329 8.36815 7.63177 8.66663 7.99996 8.66663C8.36815 8.66663 8.66663 8.36815 8.66663 7.99996V5.33329ZM7.99996 9.99996C7.63177 9.99996 7.33329 10.2984 7.33329 10.6666C7.33329 11.0348 7.63177 11.3333 7.99996 11.3333H8.00663C8.37482 11.3333 8.67329 11.0348 8.67329 10.6666C8.67329 10.2984 8.37482 9.99996 8.00663 9.99996H7.99996Z", fill: "#893700" }) }));
|
|
61582
61566
|
}
|
|
61583
61567
|
|
|
61584
61568
|
function ErrorIcon(props) {
|
|
61585
61569
|
const { width = 16, height = 16, ...rest } = props;
|
|
61586
|
-
return (jsxRuntime.jsx("svg", { width:
|
|
61570
|
+
return (jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M7.99996 0.666626C3.94987 0.666626 0.666626 3.94987 0.666626 7.99996C0.666626 12.05 3.94987 15.3333 7.99996 15.3333C12.05 15.3333 15.3333 12.05 15.3333 7.99996C15.3333 3.94987 12.05 0.666626 7.99996 0.666626ZM8.66663 5.33329C8.66663 4.9651 8.36815 4.66663 7.99996 4.66663C7.63177 4.66663 7.33329 4.9651 7.33329 5.33329V7.99996C7.33329 8.36815 7.63177 8.66663 7.99996 8.66663C8.36815 8.66663 8.66663 8.36815 8.66663 7.99996V5.33329ZM7.99996 9.99996C7.63177 9.99996 7.33329 10.2984 7.33329 10.6666C7.33329 11.0348 7.63177 11.3333 7.99996 11.3333H8.00663C8.37482 11.3333 8.67329 11.0348 8.67329 10.6666C8.67329 10.2984 8.37482 9.99996 8.00663 9.99996H7.99996Z", fill: "#A80A12" }) }));
|
|
61571
|
+
}
|
|
61572
|
+
|
|
61573
|
+
function PositiveIcon(props) {
|
|
61574
|
+
const { width = 16, height = 16, ...rest } = props;
|
|
61575
|
+
return (jsxRuntime.jsx("svg", { width: width, height: height, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M7.99996 0.666626C3.94987 0.666626 0.666626 3.94987 0.666626 7.99996C0.666626 12.05 3.94987 15.3333 7.99996 15.3333C12.05 15.3333 15.3333 12.05 15.3333 7.99996C15.3333 3.94987 12.05 0.666626 7.99996 0.666626ZM11.4714 6.47136C11.7317 6.21101 11.7317 5.7889 11.4714 5.52855C11.211 5.26821 10.7889 5.26821 10.5286 5.52855L6.99996 9.05715L5.47136 7.52855C5.21101 7.2682 4.7889 7.2682 4.52855 7.52855C4.26821 7.7889 4.26821 8.21101 4.52855 8.47136L6.52855 10.4714C6.7889 10.7317 7.21101 10.7317 7.47136 10.4714L11.4714 6.47136Z", fill: "#00652A" }) }));
|
|
61587
61576
|
}
|
|
61588
61577
|
|
|
61589
61578
|
function ArrowDownIcon(props) {
|
|
@@ -61650,6 +61639,12 @@ function ChevronRightIcon(props) {
|
|
|
61650
61639
|
return (jsxRuntime.jsx("svg", { width: width, height: height, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...rest, children: jsxRuntime.jsx("path", { d: "M6 12L10 8L6 4", stroke: "currentColor", "stroke-linecap": "round", "stroke-linejoin": "round" }) }));
|
|
61651
61640
|
}
|
|
61652
61641
|
|
|
61642
|
+
const SortTableIcon = (props) => (jsxRuntime.jsx("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: jsxRuntime.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" }) }));
|
|
61643
|
+
|
|
61644
|
+
const LineArrowsDown = (props) => (jsxRuntime.jsx("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: jsxRuntime.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" }) }));
|
|
61645
|
+
|
|
61646
|
+
const LineArrowsUp = (props) => (jsxRuntime.jsx("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: jsxRuntime.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" }) }));
|
|
61647
|
+
|
|
61653
61648
|
const renderSystemNotification = ({ title, description, imgUrl, okText = "ok", cancelText = "Dismiss", moreOption, onMoreClick, onOk, onCancel, onClose, }) => {
|
|
61654
61649
|
return (jsxRuntime.jsxs(DivNotificationSystemWrapperSC, { children: [jsxRuntime.jsx(ImgNotificationSystemSC, { src: imgUrl }), jsxRuntime.jsxs(DivNotificationSystemContainerSC, { children: [jsxRuntime.jsxs(DivNotificationContentWrapperSC, { children: [jsxRuntime.jsxs(DivNotificationContentSC, { children: [jsxRuntime.jsxs(DivNotificationHeaderSC, { children: [jsxRuntime.jsx(DivNotificationTitleSC, { children: title }), moreOption && (jsxRuntime.jsx(DivIconActionSC, { children: jsxRuntime.jsx(FISIconButton, { variant: "tertiary-invisible", size: "xs", icon: jsxRuntime.jsx(MoreIcon, {}), onClick: onMoreClick }) }))] }), jsxRuntime.jsx(DivNotificationDescriptionSC, { children: description })] }), jsxRuntime.jsxs(DivNotificationActionsSC, { children: [jsxRuntime.jsx(FISLinkButton, { size: "xs", variant: "hight-priority", onClick: onOk, children: okText }), jsxRuntime.jsx(FISLinkButton, { size: "xs", onClick: onCancel, children: cancelText })] })] }), jsxRuntime.jsx(DivIconActionSC, { children: jsxRuntime.jsx(FISIconButton, { icon: jsxRuntime.jsx(CloseIcon, {}), size: "xs", variant: "tertiary-invisible", onClick: onClose }) })] })] }));
|
|
61655
61650
|
};
|
|
@@ -62533,7 +62528,7 @@ const FISDivider = (props) => {
|
|
|
62533
62528
|
|
|
62534
62529
|
const themeIcons = {
|
|
62535
62530
|
info: jsxRuntime.jsx(InfoIcon, {}),
|
|
62536
|
-
positive: jsxRuntime.jsx(
|
|
62531
|
+
positive: jsxRuntime.jsx(PositiveIcon, {}),
|
|
62537
62532
|
caution: jsxRuntime.jsx(WarningIcon, {}),
|
|
62538
62533
|
negative: jsxRuntime.jsx(ErrorIcon, {}),
|
|
62539
62534
|
};
|
|
@@ -64230,6 +64225,7 @@ const InputSC$2 = styled.input `
|
|
|
64230
64225
|
border: none;
|
|
64231
64226
|
background: transparent;
|
|
64232
64227
|
outline: none;
|
|
64228
|
+
cursor: ${(props) => (props.$isPointer ? "pointer" : "text")};
|
|
64233
64229
|
padding-right: calc(
|
|
64234
64230
|
${getTheme("com/input/field/size-md/label/sub-spacing")} +
|
|
64235
64231
|
${getTheme("com/input/field/right-padding")}
|
|
@@ -64586,32 +64582,41 @@ const DivContainerSC$7 = styled.div `
|
|
|
64586
64582
|
pointer-events: auto;
|
|
64587
64583
|
}
|
|
64588
64584
|
|
|
64589
|
-
&:has(${InputSC$2}:disabled)
|
|
64590
|
-
&:has(${InputSC$2}:read-only) {
|
|
64585
|
+
&:has(${InputSC$2}:disabled) {
|
|
64591
64586
|
outline-color: ${getTheme("com/input/field/disable/stroke-color")};
|
|
64592
64587
|
background-color: ${getTheme("com/input/field/disable/background-color")};
|
|
64593
64588
|
cursor: not-allowed;
|
|
64594
64589
|
|
|
64590
|
+
${InputSC$2} {
|
|
64591
|
+
cursor: not-allowed;
|
|
64592
|
+
}
|
|
64593
|
+
|
|
64595
64594
|
${DivIconSC$2} {
|
|
64596
64595
|
color: ${getTheme("com/input/field/disable/icon-color")};
|
|
64596
|
+
cursor: not-allowed;
|
|
64597
64597
|
}
|
|
64598
64598
|
${DivIconSuffixSC$1} {
|
|
64599
64599
|
color: ${getTheme("com/input/field/disable/icon-color")};
|
|
64600
|
+
cursor: not-allowed;
|
|
64600
64601
|
}
|
|
64601
64602
|
${DivIconPrefixSC$1} {
|
|
64602
64603
|
color: ${getTheme("com/input/field/disable/icon-color")};
|
|
64604
|
+
cursor: not-allowed;
|
|
64603
64605
|
}
|
|
64604
64606
|
|
|
64605
64607
|
.icon-suffix {
|
|
64606
64608
|
pointer-events: none;
|
|
64607
64609
|
color: ${getTheme("com/button/disable/icon-color")};
|
|
64610
|
+
cursor: not-allowed;
|
|
64608
64611
|
}
|
|
64609
64612
|
|
|
64610
64613
|
${SpanTextPrefixSC} {
|
|
64611
64614
|
color: ${getTheme("com/input/field/disable/label-color")};
|
|
64615
|
+
cursor: not-allowed;
|
|
64612
64616
|
}
|
|
64613
64617
|
${SpanTextSuffixSC} {
|
|
64614
64618
|
color: ${getTheme("com/input/field/disable/label-color")};
|
|
64619
|
+
cursor: not-allowed;
|
|
64615
64620
|
}
|
|
64616
64621
|
|
|
64617
64622
|
&::placeholder {
|
|
@@ -64619,11 +64624,49 @@ const DivContainerSC$7 = styled.div `
|
|
|
64619
64624
|
}
|
|
64620
64625
|
}
|
|
64621
64626
|
|
|
64622
|
-
&:has(${InputSC$2}:read-only) {
|
|
64627
|
+
&:has(${InputSC$2}:read-only):not(:has(${InputSC$2}:disabled)) {
|
|
64623
64628
|
cursor: default;
|
|
64629
|
+
outline-color: ${getTheme("com/input/field/disable/stroke-color")};
|
|
64630
|
+
background-color: ${getTheme("com/input/field/disable/background-color")};
|
|
64631
|
+
|
|
64632
|
+
${InputSC$2} {
|
|
64633
|
+
cursor: default;
|
|
64634
|
+
}
|
|
64635
|
+
|
|
64636
|
+
${DivIconSC$2} {
|
|
64637
|
+
color: ${getTheme("com/input/field/disable/icon-color")};
|
|
64638
|
+
cursor: default;
|
|
64639
|
+
}
|
|
64640
|
+
${DivIconSuffixSC$1} {
|
|
64641
|
+
color: ${getTheme("com/input/field/disable/icon-color")};
|
|
64642
|
+
cursor: default;
|
|
64643
|
+
}
|
|
64644
|
+
${DivIconPrefixSC$1} {
|
|
64645
|
+
color: ${getTheme("com/input/field/disable/icon-color")};
|
|
64646
|
+
cursor: default;
|
|
64647
|
+
}
|
|
64648
|
+
|
|
64649
|
+
.icon-suffix {
|
|
64650
|
+
pointer-events: none;
|
|
64651
|
+
color: ${getTheme("com/button/disable/icon-color")};
|
|
64652
|
+
cursor: default;
|
|
64653
|
+
}
|
|
64654
|
+
|
|
64655
|
+
${SpanTextPrefixSC} {
|
|
64656
|
+
color: ${getTheme("com/input/field/disable/label-color")};
|
|
64657
|
+
cursor: default;
|
|
64658
|
+
}
|
|
64659
|
+
${SpanTextSuffixSC} {
|
|
64660
|
+
color: ${getTheme("com/input/field/disable/label-color")};
|
|
64661
|
+
cursor: default;
|
|
64662
|
+
}
|
|
64663
|
+
|
|
64664
|
+
&::placeholder {
|
|
64665
|
+
color: ${getTheme("com/input/field/disable/label-color")};
|
|
64666
|
+
}
|
|
64624
64667
|
}
|
|
64625
64668
|
|
|
64626
|
-
&:hover:not(
|
|
64669
|
+
&:hover:not(:has(${InputSC$2}:disabled)):not(:has(.icon-suffix:hover)) {
|
|
64627
64670
|
outline-color: ${getTheme("com/input/field/default/border/hover")};
|
|
64628
64671
|
background-color: ${getTheme("com/input/field/default/background/hover")};
|
|
64629
64672
|
|
|
@@ -64693,7 +64736,7 @@ const FISInputField = React.forwardRef(({ onClickSuffix, onClickPrefix, ...props
|
|
|
64693
64736
|
"active-dropdown": activeDropdown,
|
|
64694
64737
|
disabled: disabled,
|
|
64695
64738
|
"input-text-lg": sizeInput === "lg",
|
|
64696
|
-
}), onClick: onClickPrefix, children: [iconPrefix && jsxRuntime.jsx(DivIconDropSC, { children: iconPrefix }), labelPrefix && jsxRuntime.jsx(SpanTextDropSC, { children: labelPrefix }), jsxRuntime.jsx(DivIconPrefixSC$1, { children: jsxRuntime.jsx(DropdownIcon, {}) })] })), jsxRuntime.jsx(InputSC$2, { ...rest, ref: ref, disabled: disabled, className: classNames({
|
|
64739
|
+
}), onClick: onClickPrefix, children: [iconPrefix && jsxRuntime.jsx(DivIconDropSC, { children: iconPrefix }), labelPrefix && jsxRuntime.jsx(SpanTextDropSC, { children: labelPrefix }), jsxRuntime.jsx(DivIconPrefixSC$1, { children: jsxRuntime.jsx(DropdownIcon, {}) })] })), jsxRuntime.jsx(InputSC$2, { ...rest, ref: ref, disabled: disabled, "$isPointer": props.$isPointer, className: classNames({
|
|
64697
64740
|
negative: negative,
|
|
64698
64741
|
"input-text-lg": sizeInput === "lg",
|
|
64699
64742
|
prefix: iconPrefix,
|
|
@@ -66314,7 +66357,7 @@ const PTitleSC$2 = styled.p `
|
|
|
66314
66357
|
${getTheme("Paragraph/Sm")}
|
|
66315
66358
|
color: ${getTheme("com/menu/item/action/label/color-text/default")};
|
|
66316
66359
|
`;
|
|
66317
|
-
styled.div `
|
|
66360
|
+
const DivWrapperMenuSC = styled.div `
|
|
66318
66361
|
display: flex;
|
|
66319
66362
|
flex-direction: column;
|
|
66320
66363
|
height: 100%;
|
|
@@ -67344,62 +67387,64 @@ const FISMenuSection = ({ label, withAction = false, actionText, actionLabel = f
|
|
|
67344
67387
|
};
|
|
67345
67388
|
FISMenuSection.displayName = "FISMenuSection";
|
|
67346
67389
|
|
|
67347
|
-
const FISMenuSelect = ({ placeholder, groups, size = "md", multi = false, selectedValues = [], onChangeSelected, loading = false, noData = false, noResult = false, combobox, className, onClickMenu, loadingText = "Data loading...", noDataText = "No data", noResultText = "No result", removeSelectedText = "Remove selected", selectedGroupLabel = "Selected", }) => {
|
|
67348
|
-
const [
|
|
67349
|
-
|
|
67350
|
-
|
|
67351
|
-
|
|
67352
|
-
|
|
67353
|
-
|
|
67354
|
-
|
|
67355
|
-
|
|
67356
|
-
|
|
67357
|
-
|
|
67358
|
-
|
|
67359
|
-
|
|
67360
|
-
|
|
67361
|
-
|
|
67362
|
-
|
|
67363
|
-
item
|
|
67364
|
-
|
|
67365
|
-
|
|
67366
|
-
|
|
67367
|
-
|
|
67368
|
-
|
|
67369
|
-
|
|
67370
|
-
|
|
67371
|
-
|
|
67372
|
-
|
|
67373
|
-
|
|
67374
|
-
|
|
67375
|
-
|
|
67376
|
-
value: "__remove_selected__",
|
|
67377
|
-
},
|
|
67378
|
-
],
|
|
67379
|
-
}
|
|
67380
|
-
: null;
|
|
67390
|
+
const FISMenuSelect = ({ placeholder, groups, size = "md", multi = false, selectedValues = [], onChangeSelected, searchValue = "", onSearchChange, loading = false, noData = false, noResult = false, combobox, className, onClickMenu, loadingText = "Data loading...", noDataText = "No data", noResultText = "No result", removeSelectedText = "Remove selected", selectedGroupLabel = "Selected", }) => {
|
|
67391
|
+
const [localSearch, setLocalSearch] = React.useState(searchValue);
|
|
67392
|
+
React.useEffect(() => {
|
|
67393
|
+
setLocalSearch(searchValue);
|
|
67394
|
+
}, [searchValue]);
|
|
67395
|
+
const search = localSearch;
|
|
67396
|
+
const filteredGroups = React.useMemo(() => {
|
|
67397
|
+
let filteredItems = groups.map((group) => ({
|
|
67398
|
+
groupLabel: group.groupLabel,
|
|
67399
|
+
items: multi
|
|
67400
|
+
? group.items.filter((item) => !selectedValues.includes(item.value))
|
|
67401
|
+
: group.items,
|
|
67402
|
+
}));
|
|
67403
|
+
if (search.trim()) {
|
|
67404
|
+
filteredItems = filteredItems.map((group) => ({
|
|
67405
|
+
...group,
|
|
67406
|
+
items: group.items.filter((item) => item.label.toLowerCase().includes(search.toLowerCase())),
|
|
67407
|
+
}));
|
|
67408
|
+
}
|
|
67409
|
+
return filteredItems.filter((group) => group.items.length > 0);
|
|
67410
|
+
}, [groups, multi, selectedValues, search]);
|
|
67411
|
+
const selectedItemsGroup = React.useMemo(() => {
|
|
67412
|
+
if (!multi)
|
|
67413
|
+
return null;
|
|
67414
|
+
const selectedItems = groups
|
|
67415
|
+
.flatMap((g) => g.items)
|
|
67416
|
+
.filter((item) => selectedValues.includes(item.value));
|
|
67417
|
+
if (selectedItems.length === 0)
|
|
67418
|
+
return null;
|
|
67381
67419
|
return {
|
|
67382
|
-
|
|
67383
|
-
|
|
67384
|
-
otherGroups,
|
|
67385
|
-
filteredGroups,
|
|
67386
|
-
removeSelectedGroup,
|
|
67420
|
+
groupLabel: selectedGroupLabel,
|
|
67421
|
+
items: selectedItems,
|
|
67387
67422
|
};
|
|
67388
|
-
}, [
|
|
67389
|
-
|
|
67390
|
-
|
|
67391
|
-
|
|
67392
|
-
|
|
67393
|
-
|
|
67394
|
-
|
|
67395
|
-
|
|
67423
|
+
}, [groups, multi, selectedValues, selectedGroupLabel]);
|
|
67424
|
+
const groupsToRender = selectedItemsGroup
|
|
67425
|
+
? [selectedItemsGroup, ...filteredGroups]
|
|
67426
|
+
: filteredGroups;
|
|
67427
|
+
const removeSelectedGroup = multi && selectedValues.length > 0
|
|
67428
|
+
? {
|
|
67429
|
+
groupLabel: "",
|
|
67430
|
+
items: [
|
|
67431
|
+
{
|
|
67432
|
+
label: removeSelectedText,
|
|
67433
|
+
description: "",
|
|
67434
|
+
value: "__remove_selected__",
|
|
67435
|
+
},
|
|
67436
|
+
],
|
|
67437
|
+
}
|
|
67438
|
+
: null;
|
|
67396
67439
|
const totalItems = groups.reduce((acc, group) => acc + group.items.length, 0);
|
|
67397
|
-
const showInput = totalItems >= 7;
|
|
67398
67440
|
const hasSearch = search.trim() !== "";
|
|
67399
|
-
const
|
|
67441
|
+
const showInput = totalItems >= 7 || hasSearch;
|
|
67442
|
+
const hasFilteredResult = groupsToRender.length > 0;
|
|
67400
67443
|
const shouldShowNoResult = hasSearch && !hasFilteredResult;
|
|
67401
67444
|
const handleSearchChange = (e) => {
|
|
67402
|
-
|
|
67445
|
+
const value = e.target.value;
|
|
67446
|
+
setLocalSearch(value);
|
|
67447
|
+
onSearchChange?.(value);
|
|
67403
67448
|
};
|
|
67404
67449
|
const handleItemClick = (item) => {
|
|
67405
67450
|
if (multi) {
|
|
@@ -67408,22 +67453,22 @@ const FISMenuSelect = ({ placeholder, groups, size = "md", multi = false, select
|
|
|
67408
67453
|
return;
|
|
67409
67454
|
}
|
|
67410
67455
|
let newValues;
|
|
67411
|
-
if (selectedValues
|
|
67456
|
+
if (selectedValues.includes(item.value)) {
|
|
67412
67457
|
newValues = selectedValues.filter((v) => v !== item.value);
|
|
67413
67458
|
}
|
|
67414
67459
|
else {
|
|
67415
|
-
newValues = [...
|
|
67460
|
+
newValues = [...selectedValues, item.value];
|
|
67416
67461
|
}
|
|
67417
67462
|
onChangeSelected?.(newValues);
|
|
67418
67463
|
return;
|
|
67419
67464
|
}
|
|
67420
67465
|
else {
|
|
67421
|
-
const newValues = selectedValues
|
|
67466
|
+
const newValues = selectedValues[0] === item.value ? [] : [item.value];
|
|
67422
67467
|
onChangeSelected?.(newValues);
|
|
67423
67468
|
onClickMenu?.();
|
|
67424
67469
|
}
|
|
67425
67470
|
};
|
|
67426
|
-
return (jsxRuntime.
|
|
67471
|
+
return (jsxRuntime.jsx(DivContainerSC$4, { className: className, children: jsxRuntime.jsxs(DivWrapperMenuSC, { children: [showInput && !combobox && (jsxRuntime.jsx(DivSearchSC, { children: jsxRuntime.jsx(FISInputText, { iconPrefix: jsxRuntime.jsx(SearchIcon, {}), placeholder: placeholder, value: search, onChange: handleSearchChange }) })), (shouldShowNoResult || noResult) && (jsxRuntime.jsxs(DivLoaderSC, { children: [jsxRuntime.jsx(DivIconDataSC, { children: jsxRuntime.jsx(NoResultIcon, {}) }), jsxRuntime.jsx(PTitleSC$2, { children: noResultText })] })), noData && (jsxRuntime.jsxs(DivLoaderSC, { children: [jsxRuntime.jsx(DivIconDataSC, { children: jsxRuntime.jsx(NoDataIcon, {}) }), jsxRuntime.jsx(PTitleSC$2, { children: noDataText })] })), loading && (jsxRuntime.jsxs(DivLoaderSC, { children: [jsxRuntime.jsx(FISProgressCircular, { size: size, variant: "indeterminate" }), jsxRuntime.jsx(PTitleSC$2, { children: loadingText })] })), !shouldShowNoResult && !noData && !loading && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(MenuContent, { "$removeSelectedGroup": !!removeSelectedGroup, children: groupsToRender.map((group, index) => (jsxRuntime.jsxs(DivWrapperSC$4, { children: [index !== 0 && jsxRuntime.jsx(FISMenuSection, { withDivider: true }), jsxRuntime.jsx(FISMenuSection, { label: group?.groupLabel }), group.items.map((item, idx) => (jsxRuntime.jsx(FISMenuItem, { title: item.label, description: item.description, size: size, onClickMenu: () => handleItemClick(item), selected: selectedValues.includes(item.value), type: "select" }, idx)))] }, index))) }), removeSelectedGroup && (jsxRuntime.jsx(FixedBottomSection, { children: jsxRuntime.jsx(DivWrapperSC$4, { children: removeSelectedGroup.items.map((item, idx) => (jsxRuntime.jsx(FISMenuItem, { title: item.label, description: item.description, size: size, onClickMenu: () => onChangeSelected?.([]), type: "select", iconPrefix: jsxRuntime.jsx(RemoveIcon, {}), negative: true }, idx))) }) }))] }))] }) }));
|
|
67427
67472
|
};
|
|
67428
67473
|
FISMenuSelect.displayName = "FISMenuSelect";
|
|
67429
67474
|
|
|
@@ -70824,7 +70869,7 @@ const FISCombobox = React.forwardRef(({ className, options, value, disabled = fa
|
|
|
70824
70869
|
}, [filteredOptions, searchValue]);
|
|
70825
70870
|
return (jsxRuntime.jsxs(DivWrapperSC$3, { className: className, children: [(textLabel || iconLabel) && (jsxRuntime.jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsxRuntime.jsx(DivInputWrapperSC$2, { ref: setReferenceElement, onClick: handleToggle, children: jsxRuntime.jsx(FISInputField, { ...restProps, ref: ref, iconSuffix: isOpen ? jsxRuntime.jsx(ArrowUpIcon, {}) : jsxRuntime.jsx(ArrowDownIcon, {}), value: isOpen && searchValue !== undefined
|
|
70826
70871
|
? searchValue
|
|
70827
|
-
: computedDisplayValue, disabled: disabled, onClickSuffix: handleToggle, onChange: handleInputChange, onKeyDown: handleInputKeyDown }) }), message && (jsxRuntime.jsx(SpanHintSC$3, { className: classNames({ disabled, negative, positive }), children: message })), multi && value.length > 0 && (jsxRuntime.jsx(SelectedTagsWrapper$1, { children: jsxRuntime.jsx(MultipleValue, { options: selectedOptions, onRemove: handleOptionRemove }) })), isOpen && (jsxRuntime.jsx(Portal, { children: jsxRuntime.jsx(DivDropdownMenuSC$1, { ref: setPopperElement, style: { ...styles.popper, width: referenceElement?.offsetWidth }, ...attributes.popper, children: jsxRuntime.jsx(FISMenuSelect, { groups: filteredOptions, placeholder: placeholderSearch, loading: loading, multi: multi, combobox: true, noResult: hasNoResults, noResultText: noResultText, selectedValues: multi ? value : value ? [value] : [], onChangeSelected: (values) => {
|
|
70872
|
+
: computedDisplayValue, disabled: disabled, onClickSuffix: handleToggle, onChange: handleInputChange, onKeyDown: handleInputKeyDown, "$isPointer": true }) }), message && (jsxRuntime.jsx(SpanHintSC$3, { className: classNames({ disabled, negative, positive }), children: message })), multi && value.length > 0 && (jsxRuntime.jsx(SelectedTagsWrapper$1, { children: jsxRuntime.jsx(MultipleValue, { options: selectedOptions, onRemove: handleOptionRemove }) })), isOpen && (jsxRuntime.jsx(Portal, { children: jsxRuntime.jsx(DivDropdownMenuSC$1, { ref: setPopperElement, style: { ...styles.popper, width: referenceElement?.offsetWidth }, ...attributes.popper, children: jsxRuntime.jsx(FISMenuSelect, { groups: filteredOptions, placeholder: placeholderSearch, loading: loading, multi: multi, combobox: true, noResult: hasNoResults, noResultText: noResultText, selectedValues: multi ? value : value ? [value] : [], onChangeSelected: (values) => {
|
|
70828
70873
|
if (multi) {
|
|
70829
70874
|
onChange(values);
|
|
70830
70875
|
}
|
|
@@ -71255,13 +71300,10 @@ const DivHeaderCellContainerSC = styled.div `
|
|
|
71255
71300
|
|
|
71256
71301
|
.right-component-father {
|
|
71257
71302
|
display: flex;
|
|
71303
|
+
align-items: center;
|
|
71258
71304
|
justify-content: center;
|
|
71259
71305
|
width: ${getTheme("com/button/size-xs/icon/size-icon")};
|
|
71260
71306
|
height: ${getTheme("com/button/size-xs/icon/size-icon")};
|
|
71261
|
-
.right-component-child {
|
|
71262
|
-
flex-shrink: 0;
|
|
71263
|
-
align-self: center;
|
|
71264
|
-
}
|
|
71265
71307
|
}
|
|
71266
71308
|
|
|
71267
71309
|
${(props) => {
|
|
@@ -71288,7 +71330,7 @@ const DivHeaderCellContainerSC = styled.div `
|
|
|
71288
71330
|
`;
|
|
71289
71331
|
|
|
71290
71332
|
const FISTableHeaderCell = React.forwardRef(({ className, label, description, rightComponent, disabled, hasRightDivider = true, hasTruncateLabel = false, onlyIcon = false, textAlign = "left", ...rest }, ref) => {
|
|
71291
|
-
return (jsxRuntime.jsx(DivHeaderCellContainerSC, { ref: ref, className: classNames("header-cell-container", className), "$textAlign": textAlign, "$disabled": disabled, "$hasTruncateLabel": hasTruncateLabel, "$hasRightDivider": hasRightDivider, "$onlyIcon": onlyIcon, ...rest, children: jsxRuntime.jsxs("div", { className: "header-cell-content", children: [jsxRuntime.jsxs("div", { className: "cell-content title", children: [label && jsxRuntime.jsx("div", { className: "label", children: label }), rightComponent && (jsxRuntime.jsx("div", { className: "right-component-father", children:
|
|
71333
|
+
return (jsxRuntime.jsx(DivHeaderCellContainerSC, { ref: ref, className: classNames("header-cell-container", className), "$textAlign": textAlign, "$disabled": disabled, "$hasTruncateLabel": hasTruncateLabel, "$hasRightDivider": hasRightDivider, "$onlyIcon": onlyIcon, ...rest, children: jsxRuntime.jsxs("div", { className: "header-cell-content", children: [jsxRuntime.jsxs("div", { className: "cell-content title", children: [label && jsxRuntime.jsx("div", { className: "label", children: label }), rightComponent && (jsxRuntime.jsx("div", { className: "right-component-father", children: rightComponent }))] }), description && (jsxRuntime.jsx("div", { className: "cell-content", children: jsxRuntime.jsx("div", { className: "description", children: description }) }))] }) }));
|
|
71292
71334
|
});
|
|
71293
71335
|
FISTableHeaderCell.displayName = "FISTableHeaderCell";
|
|
71294
71336
|
|
|
@@ -71598,20 +71640,7 @@ const SORT_ORDERS = {
|
|
|
71598
71640
|
DESCEND: "descend",
|
|
71599
71641
|
NONE: null,
|
|
71600
71642
|
};
|
|
71601
|
-
const
|
|
71602
|
-
margin-top: -2px;
|
|
71603
|
-
.sort-icon {
|
|
71604
|
-
display: flex;
|
|
71605
|
-
flex-direction: column;
|
|
71606
|
-
align-items: center;
|
|
71607
|
-
|
|
71608
|
-
span {
|
|
71609
|
-
width: 6px;
|
|
71610
|
-
height: 5px;
|
|
71611
|
-
}
|
|
71612
|
-
}
|
|
71613
|
-
`;
|
|
71614
|
-
const FISSorter = ({ columnKey, onSort, sortedInfo, colorActive = "#2489e1", UpIcon = RefIcon$f, DownIcon = RefIcon$k, }) => {
|
|
71643
|
+
const FISSorter = ({ columnKey, onSort, sortedInfo, UpIcon = LineArrowsUp, DownIcon = LineArrowsDown, }) => {
|
|
71615
71644
|
const currentOrder = sortedInfo.columnKey === columnKey ? sortedInfo.order : SORT_ORDERS.NONE;
|
|
71616
71645
|
const handleSort = () => {
|
|
71617
71646
|
const newOrder = currentOrder === SORT_ORDERS.ASCEND
|
|
@@ -71621,11 +71650,16 @@ const FISSorter = ({ columnKey, onSort, sortedInfo, colorActive = "#2489e1", UpI
|
|
|
71621
71650
|
: SORT_ORDERS.ASCEND;
|
|
71622
71651
|
onSort(columnKey, newOrder);
|
|
71623
71652
|
};
|
|
71624
|
-
|
|
71625
|
-
|
|
71626
|
-
|
|
71627
|
-
|
|
71628
|
-
|
|
71653
|
+
const renderSortIcon = () => {
|
|
71654
|
+
if (currentOrder === SORT_ORDERS.ASCEND) {
|
|
71655
|
+
return jsxRuntime.jsx(UpIcon, {});
|
|
71656
|
+
}
|
|
71657
|
+
if (currentOrder === SORT_ORDERS.DESCEND) {
|
|
71658
|
+
return jsxRuntime.jsx(DownIcon, {});
|
|
71659
|
+
}
|
|
71660
|
+
return jsxRuntime.jsx(SortTableIcon, {});
|
|
71661
|
+
};
|
|
71662
|
+
return (jsxRuntime.jsx(FISIconButton, { onClick: handleSort, variant: "tertiary-invisible", size: "xs", icon: renderSortIcon() }));
|
|
71629
71663
|
};
|
|
71630
71664
|
|
|
71631
71665
|
const DivDateRangeContainerSC = styled.div `
|
|
@@ -73022,7 +73056,7 @@ const DivInputWrapperSC = styled.div `
|
|
|
73022
73056
|
width: 100%;
|
|
73023
73057
|
`;
|
|
73024
73058
|
const DivDropdownMenuSC = styled.div `
|
|
73025
|
-
margin-top: ${getTheme("com/select/vertical-gap")};
|
|
73059
|
+
/* margin-top: ${getTheme("com/select/vertical-gap")}; */
|
|
73026
73060
|
`;
|
|
73027
73061
|
const SelectedTagsWrapper = styled.div `
|
|
73028
73062
|
display: flex;
|
|
@@ -73037,6 +73071,7 @@ const SelectedTagsWrapper = styled.div `
|
|
|
73037
73071
|
|
|
73038
73072
|
const InputSC = styled.input `
|
|
73039
73073
|
width: 100%;
|
|
73074
|
+
cursor: pointer;
|
|
73040
73075
|
color: ${getTheme("com/select/field/default/label/color-text/inputed")};
|
|
73041
73076
|
caret-color: ${getTheme("com/typing-cursor/default")};
|
|
73042
73077
|
border: none;
|
|
@@ -73220,12 +73255,17 @@ const DivContainerSC = styled.div `
|
|
|
73220
73255
|
`;
|
|
73221
73256
|
}
|
|
73222
73257
|
}}
|
|
73258
|
+
&:has(${InputSC}:read-only) {
|
|
73259
|
+
cursor: default;
|
|
73260
|
+
}
|
|
73261
|
+
&:has(${InputSC}:disabled) {
|
|
73262
|
+
cursor: not-allowed;
|
|
73263
|
+
}
|
|
73223
73264
|
|
|
73224
73265
|
&:has(${InputSC}:disabled),
|
|
73225
73266
|
&:has(${InputSC}:read-only) {
|
|
73226
73267
|
outline-color: ${getTheme("com/select/field/disable/stroke-color")};
|
|
73227
73268
|
background-color: ${getTheme("com/select/field/disable/background-color")};
|
|
73228
|
-
cursor: not-allowed;
|
|
73229
73269
|
|
|
73230
73270
|
${DivIconPrefixSC} {
|
|
73231
73271
|
color: ${getTheme("com/select/field/disable/color-icon")};
|
|
@@ -73239,11 +73279,7 @@ const DivContainerSC = styled.div `
|
|
|
73239
73279
|
}
|
|
73240
73280
|
}
|
|
73241
73281
|
|
|
73242
|
-
&:has(${InputSC}:
|
|
73243
|
-
cursor: default;
|
|
73244
|
-
}
|
|
73245
|
-
|
|
73246
|
-
&:hover:not(:has(.icon-suffix:hover)) {
|
|
73282
|
+
&:hover:not(:has(.icon-suffix:hover)):not(:has(${InputSC}:disabled)) {
|
|
73247
73283
|
outline-color: ${getTheme("com/select/field/default/border/hover")};
|
|
73248
73284
|
background-color: ${getTheme("com/select/field/default/background/hover")};
|
|
73249
73285
|
|
|
@@ -73275,80 +73311,143 @@ function isMenuSize(value) {
|
|
|
73275
73311
|
return value === "sm" || value === "md";
|
|
73276
73312
|
}
|
|
73277
73313
|
|
|
73278
|
-
const FISSelect = React.forwardRef(({ className, size = "md", options, value, disabled = false, textLabel = "", iconLabel, required, negative, message, positive, multi, placeholderSearch, loading, onChange, renderOption, onClickIconLabel, displayValue, multiDisplayText, portal, ...restProps }, ref) => {
|
|
73314
|
+
const FISSelect = React.forwardRef(({ className, size = "md", options, value, disabled = false, textLabel = "", iconLabel, required, negative, message, positive, multi, placeholderSearch, loading, onChange, renderOption, onClickIconLabel, displayValue, multiDisplayText, searchValue, onSearchChange, portal, ...restProps }, ref) => {
|
|
73279
73315
|
const [isOpen, setIsOpen] = React.useState(false);
|
|
73280
73316
|
const [referenceElement, setReferenceElement] = React.useState(null);
|
|
73281
73317
|
const [popperElement, setPopperElement] = React.useState(null);
|
|
73282
|
-
const
|
|
73318
|
+
const popperOptions = React.useMemo(() => ({
|
|
73283
73319
|
modifiers: [
|
|
73284
73320
|
{ name: "preventOverflow", options: { padding: 0, altAxis: true } },
|
|
73321
|
+
{
|
|
73322
|
+
name: "offset",
|
|
73323
|
+
options: {
|
|
73324
|
+
offset: [0, 4],
|
|
73325
|
+
},
|
|
73326
|
+
},
|
|
73285
73327
|
],
|
|
73286
73328
|
placement: "bottom-start",
|
|
73287
73329
|
strategy: "fixed",
|
|
73288
|
-
});
|
|
73289
|
-
const
|
|
73290
|
-
|
|
73291
|
-
setIsOpen((prev) => !prev);
|
|
73292
|
-
}, [disabled]);
|
|
73330
|
+
}), []);
|
|
73331
|
+
const { styles, attributes } = usePopper(referenceElement, popperElement, popperOptions);
|
|
73332
|
+
const originalOptionsRef = React.useRef(options);
|
|
73293
73333
|
React.useEffect(() => {
|
|
73294
|
-
|
|
73295
|
-
|
|
73296
|
-
|
|
73297
|
-
|
|
73298
|
-
|
|
73299
|
-
|
|
73300
|
-
}
|
|
73301
|
-
};
|
|
73302
|
-
|
|
73303
|
-
|
|
73304
|
-
|
|
73305
|
-
|
|
73334
|
+
// Keep track of all items including selected ones
|
|
73335
|
+
const allItems = new Map();
|
|
73336
|
+
// Add items from current options
|
|
73337
|
+
options.forEach((group) => {
|
|
73338
|
+
group.items.forEach((item) => {
|
|
73339
|
+
allItems.set(item.value, item);
|
|
73340
|
+
});
|
|
73341
|
+
});
|
|
73342
|
+
// Add selected items that might not be in current options
|
|
73343
|
+
if (multi && Array.isArray(value)) {
|
|
73344
|
+
const selectedItems = originalOptionsRef.current
|
|
73345
|
+
.flatMap((group) => group.items)
|
|
73346
|
+
.filter((item) => value.includes(item.value));
|
|
73347
|
+
selectedItems.forEach((item) => {
|
|
73348
|
+
allItems.set(item.value, item);
|
|
73349
|
+
});
|
|
73350
|
+
}
|
|
73351
|
+
// Update originalOptionsRef with all items
|
|
73352
|
+
originalOptionsRef.current = [
|
|
73353
|
+
{
|
|
73354
|
+
items: Array.from(allItems.values()),
|
|
73355
|
+
},
|
|
73356
|
+
];
|
|
73357
|
+
}, [options, value, multi]);
|
|
73358
|
+
const selectedItems = React.useMemo(() => {
|
|
73359
|
+
const allItems = originalOptionsRef.current.flatMap((group) => group.items);
|
|
73360
|
+
if (multi) {
|
|
73361
|
+
return allItems.filter((item) => value.includes(item.value));
|
|
73362
|
+
}
|
|
73363
|
+
else {
|
|
73364
|
+
const found = allItems.find((item) => item.value === value);
|
|
73365
|
+
return found ? [found] : [];
|
|
73366
|
+
}
|
|
73367
|
+
}, [value, multi]);
|
|
73306
73368
|
const computedDisplayValue = React.useMemo(() => {
|
|
73307
73369
|
if (multi) {
|
|
73308
|
-
const
|
|
73309
|
-
const count = selected.length;
|
|
73370
|
+
const count = value.length;
|
|
73310
73371
|
return multiDisplayText
|
|
73311
73372
|
? multiDisplayText(count)
|
|
73312
73373
|
: `Selected ${count.toString().padStart(2, "0")} option${count !== 1 ? "s" : ""}`;
|
|
73313
73374
|
}
|
|
73314
73375
|
else {
|
|
73315
|
-
|
|
73316
|
-
if (!selected)
|
|
73376
|
+
if (!selectedItems[0])
|
|
73317
73377
|
return "";
|
|
73318
|
-
return displayValue?.(
|
|
73378
|
+
return (displayValue?.(selectedItems[0]) || selectedItems[0].label);
|
|
73319
73379
|
}
|
|
73320
|
-
}, [value,
|
|
73321
|
-
const
|
|
73322
|
-
if (
|
|
73323
|
-
|
|
73324
|
-
|
|
73325
|
-
.map((item) => ({ label: item.label, value: item.value }));
|
|
73326
|
-
}
|
|
73327
|
-
return value
|
|
73328
|
-
? flatItems
|
|
73329
|
-
.filter((item) => item.value === value)
|
|
73330
|
-
.map((item) => ({ label: item.label, value: item.value }))
|
|
73331
|
-
: [];
|
|
73332
|
-
}, [flatItems, value, multi]);
|
|
73380
|
+
}, [value, multi, displayValue, multiDisplayText, selectedItems]);
|
|
73381
|
+
const handleToggle = React.useCallback(() => {
|
|
73382
|
+
if (!disabled)
|
|
73383
|
+
setIsOpen((prev) => !prev);
|
|
73384
|
+
}, [disabled]);
|
|
73333
73385
|
const handleOptionRemove = React.useCallback((option) => {
|
|
73334
73386
|
if (multi) {
|
|
73335
73387
|
const newValues = value.filter((v) => v !== option.value);
|
|
73336
73388
|
onChange(newValues);
|
|
73337
73389
|
}
|
|
73338
73390
|
}, [multi, onChange, value]);
|
|
73339
|
-
|
|
73340
|
-
|
|
73341
|
-
|
|
73342
|
-
|
|
73343
|
-
|
|
73344
|
-
|
|
73345
|
-
|
|
73346
|
-
|
|
73347
|
-
|
|
73348
|
-
|
|
73349
|
-
|
|
73350
|
-
|
|
73351
|
-
|
|
73391
|
+
const handleMenuChange = React.useCallback((values) => {
|
|
73392
|
+
if (multi) {
|
|
73393
|
+
onChange(values);
|
|
73394
|
+
}
|
|
73395
|
+
else {
|
|
73396
|
+
onChange(values[0]);
|
|
73397
|
+
setIsOpen(false);
|
|
73398
|
+
}
|
|
73399
|
+
}, [multi, onChange]);
|
|
73400
|
+
const handleMenuClick = React.useCallback(() => {
|
|
73401
|
+
if (!multi) {
|
|
73402
|
+
setIsOpen(false);
|
|
73403
|
+
}
|
|
73404
|
+
}, [multi]);
|
|
73405
|
+
const menuProps = React.useMemo(() => ({
|
|
73406
|
+
groups: options,
|
|
73407
|
+
placeholder: placeholderSearch,
|
|
73408
|
+
loading,
|
|
73409
|
+
multi,
|
|
73410
|
+
size: isMenuSize(size) ? size : "md",
|
|
73411
|
+
selectedValues: multi
|
|
73412
|
+
? value
|
|
73413
|
+
: value
|
|
73414
|
+
? [value]
|
|
73415
|
+
: [],
|
|
73416
|
+
onChangeSelected: handleMenuChange,
|
|
73417
|
+
onClickMenu: handleMenuClick,
|
|
73418
|
+
searchValue,
|
|
73419
|
+
onSearchChange,
|
|
73420
|
+
...restProps,
|
|
73421
|
+
}), [
|
|
73422
|
+
options,
|
|
73423
|
+
placeholderSearch,
|
|
73424
|
+
loading,
|
|
73425
|
+
multi,
|
|
73426
|
+
size,
|
|
73427
|
+
value,
|
|
73428
|
+
handleMenuChange,
|
|
73429
|
+
handleMenuClick,
|
|
73430
|
+
searchValue,
|
|
73431
|
+
onSearchChange,
|
|
73432
|
+
restProps,
|
|
73433
|
+
]);
|
|
73434
|
+
React.useEffect(() => {
|
|
73435
|
+
const handleClickOutside = (event) => {
|
|
73436
|
+
if (referenceElement &&
|
|
73437
|
+
!referenceElement.contains(event.target) &&
|
|
73438
|
+
popperElement &&
|
|
73439
|
+
!popperElement.contains(event.target)) {
|
|
73440
|
+
setIsOpen(false);
|
|
73441
|
+
}
|
|
73442
|
+
};
|
|
73443
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
73444
|
+
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
73445
|
+
}, [referenceElement, popperElement]);
|
|
73446
|
+
return (jsxRuntime.jsxs(DivWrapperSC$1, { className: className, children: [(textLabel || iconLabel) && (jsxRuntime.jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsxRuntime.jsx(DivInputWrapperSC, { ref: setReferenceElement, onClick: handleToggle, children: jsxRuntime.jsx(FISSelectItem, { ...restProps, ref: ref, size: size, iconSuffix: isOpen ? jsxRuntime.jsx(ArrowUpIcon, {}) : jsxRuntime.jsx(ArrowDownIcon, {}), value: computedDisplayValue, disabled: disabled, activeDropdown: isOpen }) }), message && (jsxRuntime.jsx(SpanHintSC$3, { className: classNames({ disabled, negative, positive }), children: message })), multi && value.length > 0 && (jsxRuntime.jsx(SelectedTagsWrapper, { children: jsxRuntime.jsx(MultipleValue, { options: selectedItems, onRemove: handleOptionRemove }) })), isOpen && (jsxRuntime.jsx(Portal, { portal: portal, children: jsxRuntime.jsx(DivDropdownMenuSC, { ref: setPopperElement, style: {
|
|
73447
|
+
...styles.popper,
|
|
73448
|
+
width: referenceElement?.offsetWidth,
|
|
73449
|
+
zIndex: 9999,
|
|
73450
|
+
}, ...attributes.popper, children: jsxRuntime.jsx(FISMenuSelect, { ...menuProps }) }) }))] }));
|
|
73352
73451
|
});
|
|
73353
73452
|
FISSelect.displayName = "FISSelect";
|
|
73354
73453
|
|