@antscorp/antsomi-ui 1.3.5-beta.360 → 1.3.5-beta.362

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.
@@ -9,7 +9,7 @@ import { Tooltip } from '../../atoms';
9
9
  const AccountChip = props => {
10
10
  const { user, label, value, disabled, isViewMode, isError, errorMsg, onRemove } = props;
11
11
  const { state } = useContext(SelectAccountContext);
12
- const { disabledAccount, userIdKey } = state;
12
+ const { disabledAccount, userIdKey, styles } = state;
13
13
  const handleRemove = () => {
14
14
  if (typeof onRemove === 'function') {
15
15
  onRemove({ value, user });
@@ -17,7 +17,7 @@ const AccountChip = props => {
17
17
  };
18
18
  const isDisabled = disabled || (state === null || state === void 0 ? void 0 : state.disabled) || (disabledAccount === null || disabledAccount === void 0 ? void 0 : disabledAccount.includes(user === null || user === void 0 ? void 0 : user[userIdKey]));
19
19
  return (React.createElement(Tooltip, { open: isError ? undefined : false, title: errorMsg },
20
- React.createElement(AccountChipWrapper, { disabled: isDisabled, isError: isError },
20
+ React.createElement(AccountChipWrapper, { className: "select-account-chip", style: Object.assign({}, ((styles === null || styles === void 0 ? void 0 : styles.accountChip) || {})), disabled: isDisabled, isError: isError },
21
21
  React.createElement("div", { className: "name" }, label),
22
22
  !isViewMode && !(state === null || state === void 0 ? void 0 : state.isViewMode) && !isDisabled && (React.createElement("div", { className: "icon-remove", onClick: handleRemove },
23
23
  React.createElement(Icon, { type: "icon-ants-remove-slim" }))))));
@@ -7,6 +7,7 @@ import { ButtonAddStyled } from './styled';
7
7
  import { Icon, Popover } from '../../atoms';
8
8
  import AccountList from './AccountList';
9
9
  const ButtonAdd = () => {
10
+ var _a;
10
11
  const { state, dispatch } = useContext(SelectAccountContext);
11
12
  const handleClose = visible => {
12
13
  if (!visible) {
@@ -19,7 +20,7 @@ const ButtonAdd = () => {
19
20
  }
20
21
  };
21
22
  return (React.createElement(Popover, { open: state.openAccountList, content: React.createElement(AccountList, null), trigger: "click", arrow: false, overlayInnerStyle: { padding: 0 }, destroyTooltipOnHide: true, onOpenChange: handleClose, afterOpenChange: handleAfterClose },
22
- React.createElement(ButtonAddStyled, { loading: !state.isInitDone, onClick: () => state.openAccountList
23
+ React.createElement(ButtonAddStyled, { className: "select-account-btn-add", style: Object.assign({}, (((_a = state === null || state === void 0 ? void 0 : state.styles) === null || _a === void 0 ? void 0 : _a.btnAdd) || {})), loading: !state.isInitDone, onClick: () => state.openAccountList
23
24
  ? dispatch({ type: 'CLOSE_ACCOUNT_LIST' })
24
25
  : dispatch({ type: 'OPEN_ACCOUNT_LIST' }) },
25
26
  React.createElement("div", { className: "icon" },
@@ -8,7 +8,7 @@ import { Popover } from '../../atoms';
8
8
  import AccountChip from './AccountChip';
9
9
  const ButtonViewAll = () => {
10
10
  const { state, dispatch } = useContext(SelectAccountContext);
11
- const { usersSelected, nameKey, userIdKey, users } = state;
11
+ const { usersSelected, nameKey, userIdKey, users, styles } = state;
12
12
  const handleRemove = ({ userId, index }) => {
13
13
  dispatch({ type: 'REMOVE_USER', payload: { userId, index } });
14
14
  };
@@ -32,6 +32,6 @@ const ButtonViewAll = () => {
32
32
  return (React.createElement(AccountChip, { key: user === null || user === void 0 ? void 0 : user[userIdKey], user: user, value: user === null || user === void 0 ? void 0 : user[userIdKey], label: user === null || user === void 0 ? void 0 : user[nameKey], onRemove: () => handleRemove({ userId: user === null || user === void 0 ? void 0 : user[userIdKey], index }) }));
33
33
  })));
34
34
  return (React.createElement(Popover, { content: () => contentViewAll(), trigger: "click", arrow: false, overlayInnerStyle: { padding: 0 }, destroyTooltipOnHide: true },
35
- React.createElement(ButtonViewAllStyled, { type: "text" }, "View all")));
35
+ React.createElement(ButtonViewAllStyled, { className: "select-account-view-all", style: Object.assign({}, ((styles === null || styles === void 0 ? void 0 : styles.btnViewAll) || {})), type: "text" }, "View all")));
36
36
  };
37
37
  export default ButtonViewAll;
@@ -10,11 +10,11 @@ import ButtonViewAll from './ButtonViewAll';
10
10
  export const Content = () => {
11
11
  var _a;
12
12
  const { state, dispatch } = useContext(SelectAccountContext);
13
- const { usersSelected, nameKey, userIdKey, users, disabled } = state;
13
+ const { usersSelected, nameKey, userIdKey, users, disabled, className, styles } = state;
14
14
  const handleRemove = ({ userId, index }) => {
15
15
  dispatch({ type: 'REMOVE_USER', payload: { userId, index } });
16
16
  };
17
- return (React.createElement(Wrapper, { disabled: !!disabled },
17
+ return (React.createElement(Wrapper, { className: `select-account ${className}`, style: Object.assign({}, ((styles === null || styles === void 0 ? void 0 : styles.wrapper) || {})), disabled: !!disabled },
18
18
  state.type === 'group'
19
19
  ? usersSelected === null || usersSelected === void 0 ? void 0 : usersSelected.map((id, index) => {
20
20
  var _a;
@@ -22,7 +22,7 @@ export const Content = () => {
22
22
  return null;
23
23
  const group = (_a = state === null || state === void 0 ? void 0 : state.listAccountGroup) === null || _a === void 0 ? void 0 : _a.find(u => (u === null || u === void 0 ? void 0 : u[state === null || state === void 0 ? void 0 : state.groupIdKey]) === id);
24
24
  if (!group) {
25
- const user = users.find(u => (u === null || u === void 0 ? void 0 : u[userIdKey]) === id);
25
+ const user = users === null || users === void 0 ? void 0 : users.find(u => (u === null || u === void 0 ? void 0 : u[userIdKey]) === id);
26
26
  if (!user)
27
27
  return null;
28
28
  return (React.createElement(AccountChip, { key: user === null || user === void 0 ? void 0 : user[userIdKey], user: user, value: user === null || user === void 0 ? void 0 : user[userIdKey], label: user === null || user === void 0 ? void 0 : user[nameKey], onRemove: () => handleRemove({ userId: user === null || user === void 0 ? void 0 : user[userIdKey], index }) }));
@@ -32,7 +32,9 @@ export const Content = () => {
32
32
  : usersSelected === null || usersSelected === void 0 ? void 0 : usersSelected.map((id, index) => {
33
33
  if (index >= (state === null || state === void 0 ? void 0 : state.limitShow))
34
34
  return null;
35
- const user = users.find(u => (u === null || u === void 0 ? void 0 : u[userIdKey]) === id);
35
+ const user = users === null || users === void 0 ? void 0 : users.find(u => (u === null || u === void 0 ? void 0 : u[userIdKey]) === id);
36
+ if (!user)
37
+ return null;
36
38
  return (React.createElement(AccountChip, { key: user === null || user === void 0 ? void 0 : user[userIdKey], user: user, value: user === null || user === void 0 ? void 0 : user[userIdKey], label: user === null || user === void 0 ? void 0 : user[nameKey], onRemove: () => handleRemove({ userId: user === null || user === void 0 ? void 0 : user[userIdKey], index }) }));
37
39
  }),
38
40
  ((_a = state === null || state === void 0 ? void 0 : state.usersSelected) === null || _a === void 0 ? void 0 : _a.length) > (state === null || state === void 0 ? void 0 : state.limitShow) && React.createElement(ButtonViewAll, null),
@@ -11,7 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
11
11
  };
12
12
  // Libraries
13
13
  import React, { createContext, useEffect, useMemo, useReducer } from 'react';
14
- import { uniq } from 'lodash';
14
+ import { uniq, get } from 'lodash';
15
15
  // Reducer
16
16
  import { initialState, reducer } from './reducer';
17
17
  // Hooks
@@ -37,8 +37,12 @@ export const SelectAccountProvider = props => {
37
37
  }, []);
38
38
  useEffect(() => {
39
39
  if (!isLoading) {
40
- dispatch({ type: 'UPDATE_USERS', payload: (data === null || data === void 0 ? void 0 : data[state === null || state === void 0 ? void 0 : state.dataAccountsKey]) || [] });
41
- dispatch({ type: 'UPDATE_USERS_DISPLAY', payload: (data === null || data === void 0 ? void 0 : data[state === null || state === void 0 ? void 0 : state.dataAccountsKey]) || [] });
40
+ const newData = get(data, state === null || state === void 0 ? void 0 : state.dataAccountsKey, Array.isArray(data) ? data : []);
41
+ dispatch({
42
+ type: 'UPDATE_USERS',
43
+ payload: newData,
44
+ });
45
+ dispatch({ type: 'UPDATE_USERS_DISPLAY', payload: newData });
42
46
  }
43
47
  }, [data]);
44
48
  // Callback OnChange
@@ -38,13 +38,19 @@ export const reducer = (state, action) => produce(state, draft => {
38
38
  draft.openAccountList = false;
39
39
  break;
40
40
  case 'UPDATE_USERS':
41
- draft.users = action.payload;
41
+ if (Array.isArray(action.payload)) {
42
+ draft.users = action.payload;
43
+ }
42
44
  break;
43
45
  case 'UPDATE_USERS_DISPLAY':
44
- draft.usersDisplay = action.payload;
46
+ if (Array.isArray(action.payload)) {
47
+ draft.usersDisplay = action.payload;
48
+ }
45
49
  break;
46
50
  case 'UPDATE_USERS_SELECTED':
47
- draft.usersSelected = action.payload;
51
+ if (Array.isArray(action.payload)) {
52
+ draft.usersSelected = action.payload;
53
+ }
48
54
  break;
49
55
  case 'UPDATE_DRAFT_USERS_SELECTED': {
50
56
  const { userId } = action.payload;
@@ -17,5 +17,7 @@ SelectAccount.defaultProps = {
17
17
  type: 'default',
18
18
  searchType: 'client',
19
19
  dataAccountsKey: 'data',
20
+ className: '',
21
+ styles: {},
20
22
  };
21
23
  export default SelectAccount;
@@ -15,6 +15,13 @@ export type SelectAccountProps = {
15
15
  disabled?: boolean;
16
16
  disabledAccount?: any[];
17
17
  limitShow?: number;
18
+ className?: string;
19
+ styles?: {
20
+ wrapper?: React.CSSProperties;
21
+ accountChip?: React.CSSProperties;
22
+ btnAdd?: React.CSSProperties;
23
+ btnViewAll?: React.CSSProperties;
24
+ };
18
25
  nameKey: string;
19
26
  userIdKey: string;
20
27
  dataAccountsKey: string;
@@ -356,7 +356,7 @@ export const AccountSharing = props => {
356
356
  xhr.send(JSON.stringify(data));
357
357
  });
358
358
  const selectNetwork = network => {
359
- if (networkId === network.networkId) {
359
+ if (+networkId === +network.networkId) {
360
360
  return;
361
361
  }
362
362
  loginNetworkWithToken(network);
@@ -399,7 +399,10 @@ export const AccountSharing = props => {
399
399
  React.createElement(Flex, { gap: 10 },
400
400
  React.createElement(Button, { type: "text", onClick: () => setTab('account'), icon: React.createElement(Icon, { type: "icon-ants-angle-left", style: { fontSize: '12px' } }) }, translateLang('KEY_BACK')),
401
401
  React.createElement(InputSearch, { className: "--portal", value: portalSearch, onChange: value => setPortalSearch(value), onClickRemove: () => setPortalSearch('') })),
402
- React.createElement("div", { className: "network-select" }, filterListNetwork === null || filterListNetwork === void 0 ? void 0 : filterListNetwork.map((network) => (React.createElement("div", { key: network.networkId, className: `network-item ${networkId === +network.networkId ? 'disabled' : ''}`, onClick: () => selectNetwork(network) },
402
+ React.createElement("div", { className: "network-select" }, filterListNetwork === null || filterListNetwork === void 0 ? void 0 : filterListNetwork.map((network) => (React.createElement("div", { key: network.networkId, className: `network-item ${+networkId === +network.networkId ||
403
+ +(currentNetwork === null || currentNetwork === void 0 ? void 0 : currentNetwork.networkId) === +network.networkId
404
+ ? 'disabled'
405
+ : ''}`, onClick: () => selectNetwork(network) },
403
406
  React.createElement("div", { className: "image-wrapper" },
404
407
  React.createElement("img", { src: network.logo, style: {
405
408
  borderRadius: 0,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@antscorp/antsomi-ui",
3
- "version": "1.3.5-beta.360",
3
+ "version": "1.3.5-beta.362",
4
4
  "description": "An enterprise-class UI design language and React UI library.",
5
5
  "sideEffects": [
6
6
  "dist/*",