@antscorp/antsomi-ui 1.3.5-beta.366 → 1.3.5-beta.368

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/es/components/molecules/SelectAccount/AccountChip.js +2 -2
  2. package/es/components/molecules/SelectAccount/AccountList.js +8 -4
  3. package/es/components/molecules/SelectAccount/ButtonAdd.js +1 -1
  4. package/es/components/molecules/SelectAccount/styled.js +1 -0
  5. package/package.json +2 -2
package/es/components/molecules/SelectAccount/AccountChip.js CHANGED
@@ -5,7 +5,7 @@ import { SelectAccountContext } from './context';
5
5
  // Components
6
6
  import { AccountChipWrapper } from './styled';
7
7
  import Icon from '@antscorp/icons';
8
- import { Tooltip } from '../../atoms';
8
+ import { Tooltip, Typography } 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);
@@ -18,7 +18,7 @@ const AccountChip = props => {
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
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
- React.createElement("div", { className: "name" }, label),
21
+ React.createElement(Typography.Text, { className: "name", ellipsis: { tooltip: { title: label } }, style: { maxWidth: '150px' } }, 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" }))))));
24
24
  };
package/es/components/molecules/SelectAccount/AccountList.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import React, { useContext, useState } from 'react';
2
2
  import { AccountListBody, AccountListContent, AccountListFooter, AccountListTitleGroup, AccountListWrapper, CheckboxStyled, } from './styled';
3
- import { Button, Icon, Input } from '../../atoms';
3
+ import { Button, Icon, Input, Typography } from '../../atoms';
4
4
  import { Dropdown } from '../Dropdown';
5
5
  import { SelectAccountContext } from './context/SelectAccountContext';
6
6
  const AccountList = () => {
@@ -20,11 +20,13 @@ const AccountList = () => {
20
20
  const handleSearch = text => {
21
21
  dispatch({ type: 'UPDATE_SEARCH_TEXT', payload: text });
22
22
  };
23
+ const TextLabel = ({ children }) => (React.createElement(Typography.Text, { ellipsis: { tooltip: { title: children } }, style: { maxWidth: '230px' } }, children));
23
24
  return (React.createElement(AccountListWrapper, null,
24
25
  React.createElement(AccountListBody, null,
25
26
  React.createElement(Input, { value: searchText, placeholder: "Search", suffix: React.createElement(Icon, { type: "icon-ants-search-2" }), onAfterChange: value => handleSearch(value), debounce: 500 }),
26
27
  (state === null || state === void 0 ? void 0 : state.type) === 'group' ? (React.createElement(React.Fragment, null,
27
- React.createElement(Dropdown, { open: openGroup, getPopupContainer: () => document.getElementById('account-group-list') || document.body, overlayStyle: { position: 'initial' }, trigger: ['click'], dropdownRender: () => (React.createElement(AccountListContent, null, listAccountGroupDisplay === null || listAccountGroupDisplay === void 0 ? void 0 : listAccountGroupDisplay.map((item, idx) => (React.createElement(CheckboxStyled, { key: item === null || item === void 0 ? void 0 : item[state === null || state === void 0 ? void 0 : state.groupIdKey], disabled: disabledAccount === null || disabledAccount === void 0 ? void 0 : disabledAccount.includes(item === null || item === void 0 ? void 0 : item[state === null || state === void 0 ? void 0 : state.groupIdKey]), defaultChecked: draftUsersSelected.includes(item === null || item === void 0 ? void 0 : item[state === null || state === void 0 ? void 0 : state.groupIdKey]), onChange: () => handleCheckbox(item === null || item === void 0 ? void 0 : item[state === null || state === void 0 ? void 0 : state.groupIdKey]) }, item === null || item === void 0 ? void 0 : item[state === null || state === void 0 ? void 0 : state.groupNameKey]))))) },
28
+ React.createElement(Dropdown, { open: openGroup, getPopupContainer: () => document.getElementById('account-group-list') || document.body, overlayStyle: { position: 'initial' }, trigger: ['click'], dropdownRender: () => (React.createElement(AccountListContent, null, listAccountGroupDisplay === null || listAccountGroupDisplay === void 0 ? void 0 : listAccountGroupDisplay.map((item, idx) => (React.createElement(CheckboxStyled, { key: item === null || item === void 0 ? void 0 : item[state === null || state === void 0 ? void 0 : state.groupIdKey], disabled: disabledAccount === null || disabledAccount === void 0 ? void 0 : disabledAccount.includes(item === null || item === void 0 ? void 0 : item[state === null || state === void 0 ? void 0 : state.groupIdKey]), defaultChecked: draftUsersSelected.includes(item === null || item === void 0 ? void 0 : item[state === null || state === void 0 ? void 0 : state.groupIdKey]), onChange: () => handleCheckbox(item === null || item === void 0 ? void 0 : item[state === null || state === void 0 ? void 0 : state.groupIdKey]) },
29
+ React.createElement(TextLabel, null, item === null || item === void 0 ? void 0 : item[state === null || state === void 0 ? void 0 : state.groupNameKey])))))) },
28
30
  React.createElement(AccountListTitleGroup, { onClick: () => setOpenGroup(!openGroup) },
29
31
  React.createElement("div", null, "Account Group"),
30
32
  React.createElement(Icon, { type: "icon-ants-expand-more", size: 20, style: {
@@ -32,14 +34,16 @@ const AccountList = () => {
32
34
  transition: '0.3s',
33
35
  } }))),
34
36
  React.createElement("div", { id: "account-group-list" }),
35
- React.createElement(Dropdown, { open: openAccount, getPopupContainer: () => document.getElementById('account-list') || document.body, overlayStyle: { position: 'initial' }, trigger: ['click'], dropdownRender: () => (React.createElement(AccountListContent, null, usersDisplay === null || usersDisplay === void 0 ? void 0 : usersDisplay.map(item => (React.createElement(CheckboxStyled, { key: item === null || item === void 0 ? void 0 : item[userIdKey], disabled: disabledAccount === null || disabledAccount === void 0 ? void 0 : disabledAccount.includes(item === null || item === void 0 ? void 0 : item[userIdKey]), defaultChecked: draftUsersSelected.includes(item === null || item === void 0 ? void 0 : item[userIdKey]), onChange: () => handleCheckbox(item === null || item === void 0 ? void 0 : item[userIdKey]) }, item === null || item === void 0 ? void 0 : item[nameKey]))))) },
37
+ React.createElement(Dropdown, { open: openAccount, getPopupContainer: () => document.getElementById('account-list') || document.body, overlayStyle: { position: 'initial' }, trigger: ['click'], dropdownRender: () => (React.createElement(AccountListContent, null, usersDisplay === null || usersDisplay === void 0 ? void 0 : usersDisplay.map(item => (React.createElement(CheckboxStyled, { key: item === null || item === void 0 ? void 0 : item[userIdKey], disabled: disabledAccount === null || disabledAccount === void 0 ? void 0 : disabledAccount.includes(item === null || item === void 0 ? void 0 : item[userIdKey]), defaultChecked: draftUsersSelected.includes(item === null || item === void 0 ? void 0 : item[userIdKey]), onChange: () => handleCheckbox(item === null || item === void 0 ? void 0 : item[userIdKey]) },
38
+ React.createElement(TextLabel, null, item === null || item === void 0 ? void 0 : item[nameKey])))))) },
36
39
  React.createElement(AccountListTitleGroup, { onClick: () => setOpenAccount(!openAccount) },
37
40
  React.createElement("div", null, "Account"),
38
41
  React.createElement(Icon, { type: "icon-ants-expand-more", size: 20, style: {
39
42
  transform: openAccount ? 'rotate(180deg)' : 'rotate(0deg)',
40
43
  transition: '0.3s',
41
44
  } }))),
42
- React.createElement("div", { id: "account-list" }))) : (React.createElement(AccountListContent, { style: { marginTop: 15 } }, usersDisplay === null || usersDisplay === void 0 ? void 0 : usersDisplay.map(item => (React.createElement(CheckboxStyled, { key: item === null || item === void 0 ? void 0 : item[userIdKey], disabled: disabledAccount === null || disabledAccount === void 0 ? void 0 : disabledAccount.includes(item === null || item === void 0 ? void 0 : item[userIdKey]), defaultChecked: draftUsersSelected.includes(item === null || item === void 0 ? void 0 : item[userIdKey]), onChange: () => handleCheckbox(item === null || item === void 0 ? void 0 : item[userIdKey]) }, item === null || item === void 0 ? void 0 : item[nameKey])))))),
45
+ React.createElement("div", { id: "account-list" }))) : (React.createElement(AccountListContent, { style: { marginTop: 15 } }, usersDisplay === null || usersDisplay === void 0 ? void 0 : usersDisplay.map(item => (React.createElement(CheckboxStyled, { key: item === null || item === void 0 ? void 0 : item[userIdKey], disabled: disabledAccount === null || disabledAccount === void 0 ? void 0 : disabledAccount.includes(item === null || item === void 0 ? void 0 : item[userIdKey]), defaultChecked: draftUsersSelected.includes(item === null || item === void 0 ? void 0 : item[userIdKey]), onChange: () => handleCheckbox(item === null || item === void 0 ? void 0 : item[userIdKey]) },
46
+ React.createElement(TextLabel, null, item === null || item === void 0 ? void 0 : item[nameKey]))))))),
43
47
  React.createElement(AccountListFooter, null,
44
48
  React.createElement(Button, { onClick: () => handleCancel() }, "Cancel"),
45
49
  React.createElement(Button, { type: "primary", onClick: () => handleApply() }, "Apply"))));
package/es/components/molecules/SelectAccount/ButtonAdd.js CHANGED
@@ -19,7 +19,7 @@ const ButtonAdd = () => {
19
19
  dispatch({ type: 'UPDATE_SEARCH_TEXT', payload: '' });
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
+ return (React.createElement(Popover, { open: state.openAccountList, content: React.createElement(AccountList, null), trigger: "click", arrow: false, overlayInnerStyle: { padding: 0 }, onOpenChange: handleClose, afterOpenChange: handleAfterClose },
23
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
24
24
  ? dispatch({ type: 'CLOSE_ACCOUNT_LIST' })
25
25
  : dispatch({ type: 'OPEN_ACCOUNT_LIST' }) },
package/es/components/molecules/SelectAccount/styled.js CHANGED
@@ -22,6 +22,7 @@ export const AccountChipWrapper = styled.div `
22
22
  margin: 0px;
23
23
  padding: 0px;
24
24
 
25
+ line-height: 14px;
25
26
  width: 100%;
26
27
  text-align: center;
27
28
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@antscorp/antsomi-ui",
3
- "version": "1.3.5-beta.366",
3
+ "version": "1.3.5-beta.368",
4
4
  "description": "An enterprise-class UI design language and React UI library.",
5
5
  "sideEffects": [
6
6
  "dist/*",
@@ -59,7 +59,7 @@
59
59
  "not op_mini all"
60
60
  ],
61
61
  "dependencies": {
62
- "@antscorp/icons": "0.27.30",
62
+ "@antscorp/icons": "0.27.36",
63
63
  "@antscorp/image-editor": "1.0.2",
64
64
  "@antscorp/processing-notification": "^1.0.3",
65
65
  "@dnd-kit/core": "^6.1.0",