@zohodesk/dot 1.4.12 → 1.4.14
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/.cli/propValidation_report.html +1 -1
- package/README.md +13 -0
- package/coverage/ExternalLink/ExternalLink.js.html +1 -1
- package/coverage/ExternalLink/ExternalLink.module.css.html +1 -1
- package/coverage/ExternalLink/index.html +1 -1
- package/coverage/ExternalLink/props/defaultProps.js.html +1 -1
- package/coverage/ExternalLink/props/index.html +1 -1
- package/coverage/ExternalLink/props/propTypes.js.html +1 -1
- package/coverage/IconButton/IconButton.js.html +1 -1
- package/coverage/IconButton/IconButton.module.css.html +2 -5
- package/coverage/IconButton/index.html +1 -1
- package/coverage/IconButton/props/defaultProps.js.html +1 -1
- package/coverage/IconButton/props/index.html +1 -1
- package/coverage/IconButton/props/propTypes.js.html +1 -1
- package/coverage/Image/Image.js.html +1 -1
- package/coverage/Image/Image.module.css.html +1 -1
- package/coverage/Image/index.html +1 -1
- package/coverage/Image/props/defaultProps.js.html +1 -1
- package/coverage/Image/props/index.html +1 -1
- package/coverage/Image/props/propTypes.js.html +1 -1
- package/coverage/avatar/AvatarWithTeam/AvatarWithTeam.js.html +1 -1
- package/coverage/avatar/AvatarWithTeam/AvatarWithTeam.module.css.html +1 -1
- package/coverage/avatar/AvatarWithTeam/index.html +1 -1
- package/coverage/avatar/AvatarWithTeam/props/defaultProps.js.html +1 -1
- package/coverage/avatar/AvatarWithTeam/props/index.html +1 -1
- package/coverage/avatar/AvatarWithTeam/props/propTypes.js.html +1 -1
- package/coverage/index.html +1 -1
- package/es/ActionButton/ActionButton.module.css +51 -4
- package/es/AlphabeticList/AlphabeticList.module.css +0 -2
- package/es/AttachmentViewer/AttachmentViewer.module.css +0 -2
- package/es/ChannelIcon/ChannelIcon.module.css +9 -4
- package/es/Drawer/Drawer.js +4 -5
- package/es/ExternalLink/ExternalLink.js +4 -5
- package/es/FlipCard/FlipCard.js +14 -12
- package/es/FormAction/FormAction.module.css +18 -1
- package/es/FreezeLayer/FreezeLayer.js +1 -1
- package/es/IconButton/IconButton.js +4 -5
- package/es/IconButton/IconButton.module.css +0 -1
- package/es/Link/Link.js +8 -10
- package/es/Message/Message.js +4 -5
- package/es/TagWithIcon/TagWithIcon.module.css +0 -3
- package/es/ToastMessage/ToastMessage.js +2 -4
- package/es/actions/AutoClose.js +2 -1
- package/es/alert/AlertLookup/AlertLookup.js +14 -12
- package/es/avatar/AvatarClose/AvatarClose.js +7 -7
- package/es/avatar/AvatarCollision/AvatarCollision.js +7 -7
- package/es/avatar/AvatarIcon/AvatarIcon.js +4 -5
- package/es/avatar/AvatarIcon/AvatarIcon.module.css +0 -6
- package/es/avatar/AvatarStatus/AvatarStatus.js +7 -8
- package/es/avatar/AvatarThread/AvatarThread.js +7 -7
- package/es/avatar/AvatarUser/AvatarUser.js +10 -9
- package/es/avatar/AvatarWithTeam/AvatarWithTeam.js +17 -14
- package/es/dropdown/ToggleDropDown/ToggleDropDown.js +36 -24
- package/es/dropdown/ToggleDropDown/props/defaultProps.js +2 -0
- package/es/dropdown/ToggleDropDown/props/propTypes.js +4 -0
- package/es/emptystate/CommonEmptyState/CommonEmptyState.module.css +0 -4
- package/es/form/fields/CheckBoxField/CheckBoxField.js +15 -13
- package/es/form/fields/CurrencyField/CurrencyField.js +14 -12
- package/es/form/fields/DateField/DateField.js +14 -14
- package/es/form/fields/MultiSelectField/MultiSelectField.js +13 -12
- package/es/form/fields/PhoneField/PhoneField.js +7 -7
- package/es/form/fields/RadioField/RadioField.js +21 -15
- package/es/form/fields/SelectField/SelectField.js +14 -14
- package/es/form/fields/TagsMultiSelect/TagsMultiSelect.js +13 -10
- package/es/form/fields/TagsMultiSelectField/TagsMultiSelectField.js +11 -11
- package/es/form/fields/TextBoxField/TextBoxField.js +14 -14
- package/es/form/fields/TextEditorField/TextEditorField.js +11 -10
- package/es/form/fields/TextEditorWrapper/TextEditorWrapper.js +11 -10
- package/es/form/fields/TextareaField/TextareaField.js +16 -13
- package/es/form/fields/TextareaField/props/propTypes.js +1 -0
- package/es/form/fields/ValidationMessage/ValidationMessage.module.css +0 -1
- package/es/layout/SubtabLayout/SubtabLayout.js +4 -6
- package/es/layout/SubtabLayout/SubtabLayout.module.css +0 -2
- package/es/list/Comment/Comment.module.css +0 -1
- package/es/list/Dot/Dot.module.css +0 -1
- package/es/list/ListLayout/ListLayout.js +4 -5
- package/es/list/ListLayout/ListLayout.module.css +0 -6
- package/es/list/SecondaryText/AccountName.js +12 -12
- package/es/list/SecondaryText/ContactName.js +8 -9
- package/es/list/SecondaryText/Email.js +8 -8
- package/es/list/SecondaryText/PhoneNumber.js +8 -8
- package/es/list/SecondaryText/SecondaryText.js +4 -5
- package/es/list/SecondaryText/TicketId.js +7 -7
- package/es/list/Subject/Subject.js +7 -7
- package/es/list/Subject/Subject.module.css +8 -1
- package/es/list/Thread/Thread.module.css +0 -1
- package/es/list/status/StatusListItem/StatusListItem.js +5 -5
- package/es/lookup/Lookup/Lookup.js +7 -7
- package/es/lookup/Lookup/Lookup.module.css +4 -1
- package/es/lookup/Lookup/props/propTypes.js +3 -2
- package/es/lookup/header/Search/Search.js +5 -3
- package/es/lookup/header/TicketHeader/TicketHeader.js +88 -73
- package/es/lookup/header/TicketHeader/props/defaultProps.js +7 -1
- package/es/lookup/header/TicketHeader/props/propTypes.js +2 -1
- package/es/v1/ActionButton/ActionButton.js +1 -1
- package/es/v1/AttachmentViewer/AttachmentViewer.js +2 -2
- package/es/v1/Drawer/Drawer.js +6 -7
- package/es/v1/ExternalLink/ExternalLink.js +4 -5
- package/es/v1/FlipCard/FlipCard.js +15 -13
- package/es/v1/FreezeLayer/FreezeLayer.js +2 -2
- package/es/v1/GlobalNotification/GlobalNotification.js +6 -7
- package/es/v1/IconButton/IconButton.js +4 -5
- package/es/v1/Link/Link.js +8 -10
- package/es/v1/Loader/Loader.js +1 -1
- package/es/v1/Message/Message.js +4 -5
- package/es/v1/ToastMessage/ToastMessage.js +4 -6
- package/es/v1/actions/AutoClose.js +2 -1
- package/es/v1/alert/AlertLookup/AlertLookup.js +16 -16
- package/es/v1/avatar/AvatarClose/AvatarClose.js +7 -7
- package/es/v1/avatar/AvatarCollision/AvatarCollision.js +7 -7
- package/es/v1/avatar/AvatarIcon/AvatarIcon.js +5 -6
- package/es/v1/avatar/AvatarStatus/AvatarStatus.js +7 -8
- package/es/v1/avatar/AvatarThread/AvatarThread.js +7 -7
- package/es/v1/avatar/AvatarUser/AvatarUser.js +10 -9
- package/es/v1/avatar/AvatarWithTeam/AvatarWithTeam.js +17 -14
- package/es/v1/dropdown/ToggleDropDown/ToggleDropDown.js +39 -27
- package/es/v1/dropdown/ToggleDropDown/props/defaultProps.js +2 -0
- package/es/v1/dropdown/ToggleDropDown/props/propTypes.js +4 -0
- package/es/v1/form/fields/CheckBoxField/CheckBoxField.js +15 -13
- package/es/v1/form/fields/CurrencyField/CurrencyField.js +15 -13
- package/es/v1/form/fields/DateField/DateField.js +15 -15
- package/es/v1/form/fields/MultiSelectField/MultiSelectField.js +14 -13
- package/es/v1/form/fields/PhoneField/PhoneField.js +7 -7
- package/es/v1/form/fields/RadioField/RadioField.js +21 -16
- package/es/v1/form/fields/SelectField/SelectField.js +15 -15
- package/es/v1/form/fields/TagsMultiSelect/TagsMultiSelect.js +14 -11
- package/es/v1/form/fields/TagsMultiSelectField/TagsMultiSelectField.js +11 -11
- package/es/v1/form/fields/TextBoxField/TextBoxField.js +15 -15
- package/es/v1/form/fields/TextEditorField/TextEditorField.js +11 -10
- package/es/v1/form/fields/TextEditorWrapper/TextEditorWrapper.js +11 -10
- package/es/v1/form/fields/TextareaField/TextareaField.js +17 -14
- package/es/v1/form/fields/TextareaField/props/propTypes.js +1 -0
- package/es/v1/layout/SubtabLayout/SubtabLayout.js +4 -6
- package/es/v1/list/ListLayout/ListLayout.js +4 -5
- package/es/v1/list/SecondaryText/AccountName.js +12 -12
- package/es/v1/list/SecondaryText/ContactName.js +8 -9
- package/es/v1/list/SecondaryText/Email.js +8 -8
- package/es/v1/list/SecondaryText/PhoneNumber.js +8 -8
- package/es/v1/list/SecondaryText/SecondaryText.js +4 -5
- package/es/v1/list/SecondaryText/TicketId.js +7 -7
- package/es/v1/list/Subject/Subject.js +7 -7
- package/es/v1/list/status/StatusDropdown/StatusDropdown.js +2 -2
- package/es/v1/list/status/StatusListItem/StatusListItem.js +6 -6
- package/es/v1/lookup/Lookup/Lookup.js +7 -7
- package/es/v1/lookup/Lookup/props/propTypes.js +3 -2
- package/es/v1/lookup/header/Search/Search.js +5 -3
- package/es/v1/lookup/header/TicketHeader/TicketHeader.js +30 -12
- package/es/v1/lookup/header/TicketHeader/props/defaultProps.js +7 -1
- package/es/v1/lookup/header/TicketHeader/props/propTypes.js +2 -1
- package/es/v1/lookup/header/ViewDropDown/ViewDropDown.js +1 -1
- package/es/v1/notification/DesktopNotification/DesktopNotification.js +7 -8
- package/es/v1/notification/DesktopNotification/props/defaultProps.js +1 -1
- package/es/v1/notification/DesktopNotificationHeader/props/defaultProps.js +1 -1
- package/es/version2/GlobalNotification/GlobalNotification.js +6 -7
- package/es/version2/GlobalNotification/GlobalNotification.module.css +0 -4
- package/es/version2/lookup/AlertHeader/css/AlertHeaderNew.module.css +0 -1
- package/es/version2/lookup/AlertLookup/AlertLookup.js +15 -15
- package/es/version2/notification/DesktopNotification/DesktopNotification.js +6 -7
- package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +0 -2
- package/lib/ActionButton/ActionButton.module.css +51 -4
- package/lib/AlphabeticList/AlphabeticList.module.css +0 -2
- package/lib/AttachmentViewer/AttachmentViewer.module.css +0 -2
- package/lib/ChannelIcon/ChannelIcon.module.css +9 -4
- package/lib/FormAction/FormAction.module.css +18 -1
- package/lib/FreezeLayer/FreezeLayer.js +1 -1
- package/lib/IconButton/IconButton.module.css +0 -1
- package/lib/TagWithIcon/TagWithIcon.module.css +0 -3
- package/lib/avatar/AvatarIcon/AvatarIcon.module.css +0 -6
- package/lib/dropdown/ToggleDropDown/ToggleDropDown.js +8 -0
- package/lib/dropdown/ToggleDropDown/props/defaultProps.js +2 -0
- package/lib/dropdown/ToggleDropDown/props/propTypes.js +4 -0
- package/lib/emptystate/CommonEmptyState/CommonEmptyState.module.css +0 -4
- package/lib/form/fields/RadioField/RadioField.js +3 -0
- package/lib/form/fields/TextareaField/TextareaField.js +2 -0
- package/lib/form/fields/TextareaField/props/propTypes.js +1 -0
- package/lib/form/fields/ValidationMessage/ValidationMessage.module.css +0 -1
- package/lib/layout/SubtabLayout/SubtabLayout.module.css +0 -2
- package/lib/list/Comment/Comment.module.css +0 -1
- package/lib/list/Dot/Dot.module.css +0 -1
- package/lib/list/ListLayout/ListLayout.module.css +0 -6
- package/lib/list/Subject/Subject.module.css +8 -1
- package/lib/list/Thread/Thread.module.css +0 -1
- package/lib/lookup/Lookup/Lookup.js +3 -2
- package/lib/lookup/Lookup/Lookup.module.css +4 -1
- package/lib/lookup/Lookup/props/propTypes.js +3 -2
- package/lib/lookup/header/TicketHeader/TicketHeader.js +93 -106
- package/lib/lookup/header/TicketHeader/props/defaultProps.js +7 -1
- package/lib/lookup/header/TicketHeader/props/propTypes.js +2 -1
- package/lib/v1/ActionButton/ActionButton.js +1 -1
- package/lib/v1/AttachmentViewer/AttachmentViewer.js +2 -2
- package/lib/v1/Drawer/Drawer.js +2 -2
- package/lib/v1/FlipCard/FlipCard.js +1 -1
- package/lib/v1/FreezeLayer/FreezeLayer.js +2 -2
- package/lib/v1/Loader/Loader.js +1 -1
- package/lib/v1/ToastMessage/ToastMessage.js +2 -2
- package/lib/v1/alert/AlertLookup/AlertLookup.js +1 -1
- package/lib/v1/avatar/AvatarIcon/AvatarIcon.js +1 -1
- package/lib/v1/dropdown/ToggleDropDown/ToggleDropDown.js +11 -3
- package/lib/v1/dropdown/ToggleDropDown/props/defaultProps.js +2 -0
- package/lib/v1/dropdown/ToggleDropDown/props/propTypes.js +4 -0
- package/lib/v1/form/fields/CurrencyField/CurrencyField.js +1 -1
- package/lib/v1/form/fields/DateField/DateField.js +1 -1
- package/lib/v1/form/fields/MultiSelectField/MultiSelectField.js +1 -1
- package/lib/v1/form/fields/RadioField/RadioField.js +3 -0
- package/lib/v1/form/fields/SelectField/SelectField.js +1 -1
- package/lib/v1/form/fields/TagsMultiSelect/TagsMultiSelect.js +1 -1
- package/lib/v1/form/fields/TextBoxField/TextBoxField.js +1 -1
- package/lib/v1/form/fields/TextareaField/TextareaField.js +3 -1
- package/lib/v1/form/fields/TextareaField/props/propTypes.js +1 -0
- package/lib/v1/list/status/StatusDropdown/StatusDropdown.js +2 -2
- package/lib/v1/list/status/StatusListItem/StatusListItem.js +1 -1
- package/lib/v1/lookup/Lookup/Lookup.js +3 -2
- package/lib/v1/lookup/Lookup/props/propTypes.js +3 -2
- package/lib/v1/lookup/header/TicketHeader/TicketHeader.js +37 -12
- package/lib/v1/lookup/header/TicketHeader/props/defaultProps.js +7 -1
- package/lib/v1/lookup/header/TicketHeader/props/propTypes.js +2 -1
- package/lib/v1/lookup/header/ViewDropDown/ViewDropDown.js +1 -1
- package/lib/v1/notification/DesktopNotification/DesktopNotification.js +1 -1
- package/lib/v1/notification/DesktopNotification/props/defaultProps.js +1 -1
- package/lib/v1/notification/DesktopNotificationHeader/props/defaultProps.js +1 -1
- package/lib/version2/GlobalNotification/GlobalNotification.module.css +0 -4
- package/lib/version2/lookup/AlertHeader/css/AlertHeaderNew.module.css +0 -1
- package/lib/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +0 -2
- package/package.json +11 -11
- package/result.json +1 -1
- package/es/v1/Provider/Config.js +0 -20
- package/lib/v1/Provider/Config.js +0 -29
- /package/es/{FreezeLayer → Hooks}/useFreezeLayer.js +0 -0
- /package/lib/{FreezeLayer → Hooks}/useFreezeLayer.js +0 -0
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
1
|
import React, { Component, Fragment } from 'react';
|
|
4
2
|
import { defaultProps } from './props/defaultProps';
|
|
5
3
|
import { propTypes } from './props/propTypes';
|
|
@@ -13,13 +11,13 @@ import TextBoxIcon from '@zohodesk/components/es/v1/TextBoxIcon/TextBoxIcon';
|
|
|
13
11
|
import Loader from '@zohodesk/svg/lib/Loader/Loader';
|
|
14
12
|
import CommonEmptyState from '../../emptystate/CommonEmptyState/CommonEmptyState';
|
|
15
13
|
import EmptySearch from '@zohodesk/svg/lib/emptystate/version3/EmptySearch';
|
|
16
|
-
import CssProvider from '@zohodesk/components/es/
|
|
14
|
+
import CssProvider from '@zohodesk/components/es/Provider/CssProvider';
|
|
17
15
|
import { scrollTo, findScrollEnd } from '@zohodesk/components/es/utils/Common';
|
|
18
|
-
import { getUniqueId } from '@zohodesk/components/es/
|
|
16
|
+
import { getUniqueId } from '@zohodesk/components/es/Provider/IdProvider';
|
|
19
17
|
import btnStyle from '@zohodesk/components/es/semantic/Button/semanticButton.module.css';
|
|
20
18
|
import RippleEffect from '@zohodesk/components/es/v1/RippleEffect/RippleEffect';
|
|
21
19
|
import ResponsiveDropBox from '@zohodesk/components/es/v1/ResponsiveDropBox/ResponsiveDropBox';
|
|
22
|
-
import { ResponsiveReceiver } from '@zohodesk/components/es/
|
|
20
|
+
import { ResponsiveReceiver } from '@zohodesk/components/es/Responsive/CustomResponsive';
|
|
23
21
|
import style from '../../../dropdown/ToggleDropDown/ToggleDropDown.module.css';
|
|
24
22
|
export class ToggleDropDown extends Component {
|
|
25
23
|
constructor(props) {
|
|
@@ -522,6 +520,10 @@ export class ToggleDropDown extends Component {
|
|
|
522
520
|
getFooter,
|
|
523
521
|
customProps,
|
|
524
522
|
needMultiLineText,
|
|
523
|
+
isAbsolutePositioningNeeded,
|
|
524
|
+
positionsOffset,
|
|
525
|
+
targetOffset,
|
|
526
|
+
isRestrictScroll,
|
|
525
527
|
customClass
|
|
526
528
|
} = this.props;
|
|
527
529
|
let {
|
|
@@ -546,21 +548,22 @@ export class ToggleDropDown extends Component {
|
|
|
546
548
|
let listIndex = -1;
|
|
547
549
|
const ariaTitleId = this.getAriaId(); // const allyOptionsArr = this.getOptionsArray();
|
|
548
550
|
|
|
549
|
-
return /*#__PURE__*/React.createElement("div",
|
|
551
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
550
552
|
className: style.wrapper,
|
|
551
553
|
onMouseEnter: showOnHover && !isDisabled && !isReadOnly && isEditable ? this.showTogglePopup : undefined,
|
|
552
554
|
onMouseLeave: showOnHover && !isDisabled && !isReadOnly && isEditable ? this.hideTogglePopup : undefined,
|
|
553
|
-
"data-selector-id": dataSelectorId
|
|
554
|
-
|
|
555
|
+
"data-selector-id": dataSelectorId,
|
|
556
|
+
...ToggleDropDownProps
|
|
557
|
+
}, /*#__PURE__*/React.createElement(Container, {
|
|
555
558
|
alignBox: "row",
|
|
556
559
|
onClick: !showOnHover && !isDisabled && !isReadOnly && isEditable && this.handleTogglePopup,
|
|
557
560
|
eleRef: getTargetRef,
|
|
558
561
|
align: "vertical",
|
|
559
562
|
isCover: false,
|
|
560
563
|
dataId: dataId
|
|
561
|
-
}, children ? isToggleStateNeeded ? /*#__PURE__*/React.createElement(Component,
|
|
564
|
+
}, children ? isToggleStateNeeded ? /*#__PURE__*/React.createElement(Component, { ...componentProps,
|
|
562
565
|
isActive: isPopupOpen
|
|
563
|
-
})
|
|
566
|
+
}) : children : /*#__PURE__*/React.createElement(RippleEffect, {
|
|
564
567
|
hoverType: hoverType,
|
|
565
568
|
isActive: isPopupOpen,
|
|
566
569
|
isNeedEffect: isEditable && isNeedEffect
|
|
@@ -598,7 +601,7 @@ export class ToggleDropDown extends Component {
|
|
|
598
601
|
let {
|
|
599
602
|
tabletMode
|
|
600
603
|
} = _ref4;
|
|
601
|
-
return /*#__PURE__*/React.createElement(ResponsiveDropBox,
|
|
604
|
+
return /*#__PURE__*/React.createElement(ResponsiveDropBox, {
|
|
602
605
|
boxPosition: position,
|
|
603
606
|
isActive: isPopupReady,
|
|
604
607
|
onClick: removeClose,
|
|
@@ -624,18 +627,22 @@ export class ToggleDropDown extends Component {
|
|
|
624
627
|
palette: palette,
|
|
625
628
|
isResponsivePadding: true,
|
|
626
629
|
needFocusScope: true,
|
|
630
|
+
isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
|
|
631
|
+
positionsOffset: positionsOffset,
|
|
632
|
+
targetOffset: targetOffset,
|
|
633
|
+
isRestrictScroll: isRestrictScroll,
|
|
627
634
|
customProps: {
|
|
628
635
|
focusScopeProps: {
|
|
629
636
|
loadNextOptions: this.handleGetNextOptions,
|
|
630
637
|
searchValue: searchValue,
|
|
631
638
|
isFetchingOptions: isFetchingOptions
|
|
632
639
|
}
|
|
633
|
-
}
|
|
634
|
-
|
|
640
|
+
},
|
|
641
|
+
...DropBoxProps,
|
|
635
642
|
onClose: this.handleTogglePopup
|
|
636
|
-
}
|
|
643
|
+
}, /*#__PURE__*/React.createElement(React.Fragment, null, isSearch ? /*#__PURE__*/React.createElement(Box, {
|
|
637
644
|
className: style.search
|
|
638
|
-
}, /*#__PURE__*/React.createElement(TextBoxIcon,
|
|
645
|
+
}, /*#__PURE__*/React.createElement(TextBoxIcon, {
|
|
639
646
|
placeHolder: placeHolderText,
|
|
640
647
|
onChange: this.handleChange,
|
|
641
648
|
value: searchValue,
|
|
@@ -656,8 +663,9 @@ export class ToggleDropDown extends Component {
|
|
|
656
663
|
ariaAutocomplete: 'list',
|
|
657
664
|
ariaHaspopup: true,
|
|
658
665
|
ariaExpanded: true
|
|
659
|
-
}
|
|
660
|
-
|
|
666
|
+
},
|
|
667
|
+
...TextBoxIconProps
|
|
668
|
+
})) : null, title && options.length != 0 && /*#__PURE__*/React.createElement(Box, {
|
|
661
669
|
className: style.title
|
|
662
670
|
}, /*#__PURE__*/React.createElement(DropDownHeading, {
|
|
663
671
|
text: title,
|
|
@@ -708,7 +716,7 @@ export class ToggleDropDown extends Component {
|
|
|
708
716
|
isDisabled = false
|
|
709
717
|
} = item;
|
|
710
718
|
listIndex += 1;
|
|
711
|
-
return iconName ? /*#__PURE__*/React.createElement(ListItemWithIcon,
|
|
719
|
+
return iconName ? /*#__PURE__*/React.createElement(ListItemWithIcon, {
|
|
712
720
|
key: listIndex,
|
|
713
721
|
dataId: item[keyName],
|
|
714
722
|
value: item[keyName],
|
|
@@ -734,8 +742,9 @@ export class ToggleDropDown extends Component {
|
|
|
734
742
|
role: isSearch ? 'option' : 'menuitem',
|
|
735
743
|
ariaSelected: selectedId === item[idName],
|
|
736
744
|
ariaLabel: item[keyName]
|
|
737
|
-
}
|
|
738
|
-
|
|
745
|
+
},
|
|
746
|
+
...ListItemWithIconProps
|
|
747
|
+
}) : /*#__PURE__*/React.createElement(ListItem, {
|
|
739
748
|
key: listIndex,
|
|
740
749
|
dataId: item[keyName],
|
|
741
750
|
value: item[keyName],
|
|
@@ -758,8 +767,9 @@ export class ToggleDropDown extends Component {
|
|
|
758
767
|
role: isSearch ? 'option' : 'menuitem',
|
|
759
768
|
ariaSelected: selectedId === item[idName],
|
|
760
769
|
ariaLabel: item[keyName]
|
|
761
|
-
}
|
|
762
|
-
|
|
770
|
+
},
|
|
771
|
+
...ListItemProps
|
|
772
|
+
});
|
|
763
773
|
}));
|
|
764
774
|
}), isFetchingOptions && /*#__PURE__*/React.createElement(Container, {
|
|
765
775
|
isCover: false,
|
|
@@ -783,7 +793,7 @@ export class ToggleDropDown extends Component {
|
|
|
783
793
|
key: i
|
|
784
794
|
}, needDivider ? /*#__PURE__*/React.createElement("div", {
|
|
785
795
|
className: style.seperatedLine
|
|
786
|
-
}) : iconName ? /*#__PURE__*/React.createElement(ListItemWithIcon,
|
|
796
|
+
}) : iconName ? /*#__PURE__*/React.createElement(ListItemWithIcon, {
|
|
787
797
|
dataId: item[keyName],
|
|
788
798
|
value: item[keyName],
|
|
789
799
|
id: item[idName],
|
|
@@ -809,8 +819,9 @@ export class ToggleDropDown extends Component {
|
|
|
809
819
|
role: isSearch ? 'option' : 'menuitem',
|
|
810
820
|
ariaSelected: selectedId === item[idName],
|
|
811
821
|
ariaLabel: item[keyName]
|
|
812
|
-
}
|
|
813
|
-
|
|
822
|
+
},
|
|
823
|
+
...ListItemWithIconProps
|
|
824
|
+
}) : /*#__PURE__*/React.createElement(ListItem, {
|
|
814
825
|
key: listIndex,
|
|
815
826
|
dataId: item[keyName],
|
|
816
827
|
value: item[keyName],
|
|
@@ -833,8 +844,9 @@ export class ToggleDropDown extends Component {
|
|
|
833
844
|
role: isSearch ? 'option' : 'menuitem',
|
|
834
845
|
ariaSelected: selectedId === item[idName],
|
|
835
846
|
ariaLabel: item[keyName]
|
|
836
|
-
}
|
|
837
|
-
|
|
847
|
+
},
|
|
848
|
+
...ListItemProps
|
|
849
|
+
}));
|
|
838
850
|
}), isFetchingOptions && /*#__PURE__*/React.createElement(Container, {
|
|
839
851
|
isCover: false,
|
|
840
852
|
align: "both"
|
|
@@ -74,6 +74,10 @@ export const propTypes = {
|
|
|
74
74
|
customListBox: PropTypes.string
|
|
75
75
|
}),
|
|
76
76
|
onSelectLabel: PropTypes.func,
|
|
77
|
+
isAbsolutePositioningNeeded: PropTypes.bool,
|
|
78
|
+
isRestrictScroll: PropTypes.bool,
|
|
79
|
+
positionsOffset: PropTypes.object,
|
|
80
|
+
targetOffset: PropTypes.object,
|
|
77
81
|
from: PropTypes.string,
|
|
78
82
|
top: PropTypes.number
|
|
79
83
|
};
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
1
|
/**** Libraries ****/
|
|
4
2
|
import React, { memo } from 'react';
|
|
5
3
|
import { defaultProps } from './props/defaultProps';
|
|
@@ -58,7 +56,7 @@ function CheckBoxField(props) {
|
|
|
58
56
|
lockedInfoText: lockedInfoText,
|
|
59
57
|
infoText: infoText,
|
|
60
58
|
renderProps: renderLabelProps
|
|
61
|
-
}, /*#__PURE__*/React.createElement(Label,
|
|
59
|
+
}, /*#__PURE__*/React.createElement(Label, {
|
|
62
60
|
text: labelName,
|
|
63
61
|
id: id,
|
|
64
62
|
size: fieldSize === 'small' ? 'small' : 'medium',
|
|
@@ -68,8 +66,9 @@ function CheckBoxField(props) {
|
|
|
68
66
|
title: labelName,
|
|
69
67
|
onClick: !removeEvent ? handleLabelClick : null,
|
|
70
68
|
variant: isDirectCol ? 'default' : 'primary',
|
|
71
|
-
dataId: isDisabled ? `${dataId}_label_disabled` : isMandatory ? `${dataId}_label_mandatory` : `${dataId}_label
|
|
72
|
-
|
|
69
|
+
dataId: isDisabled ? `${dataId}_label_disabled` : isMandatory ? `${dataId}_label_mandatory` : `${dataId}_label`,
|
|
70
|
+
...LabelProps
|
|
71
|
+
}));
|
|
73
72
|
|
|
74
73
|
function handleChange(value) {
|
|
75
74
|
onChange && onChange(id, value);
|
|
@@ -95,27 +94,30 @@ function CheckBoxField(props) {
|
|
|
95
94
|
align: "top"
|
|
96
95
|
}, /*#__PURE__*/React.createElement(Box, {
|
|
97
96
|
className: isDirectCol ? style.checkbox : style.checkboxRow
|
|
98
|
-
}, /*#__PURE__*/React.createElement(CheckBox,
|
|
97
|
+
}, /*#__PURE__*/React.createElement(CheckBox, {
|
|
99
98
|
id: id,
|
|
100
99
|
onChange: handleChange,
|
|
101
100
|
disabled: removeEvent,
|
|
102
101
|
checked: checked,
|
|
103
102
|
getRef: handleGetRef,
|
|
104
103
|
dataId: dataId,
|
|
105
|
-
getContainerRef: getContainerRef
|
|
106
|
-
|
|
104
|
+
getContainerRef: getContainerRef,
|
|
105
|
+
...CheckBoxProps
|
|
106
|
+
})), !isDirectCol && /*#__PURE__*/React.createElement(Box, {
|
|
107
107
|
flexible: true
|
|
108
|
-
}, labelElement)), validationMessage && /*#__PURE__*/React.createElement(ValidationMessage,
|
|
108
|
+
}, labelElement)), validationMessage && /*#__PURE__*/React.createElement(ValidationMessage, {
|
|
109
109
|
text: validationMessage,
|
|
110
110
|
palette: validationPalette,
|
|
111
111
|
type: errorType,
|
|
112
|
-
dataId: `${dataId}_ValidationMessage
|
|
113
|
-
|
|
112
|
+
dataId: `${dataId}_ValidationMessage`,
|
|
113
|
+
...ValidationMessageProps1
|
|
114
|
+
}), validationRuleMessage && /*#__PURE__*/React.createElement(ValidationMessage, {
|
|
114
115
|
text: validationRuleMessage,
|
|
115
116
|
palette: validationRulePalette,
|
|
116
117
|
type: errorType,
|
|
117
|
-
dataId: `${dataId}_ValidationRuleMessage
|
|
118
|
-
|
|
118
|
+
dataId: `${dataId}_ValidationRuleMessage`,
|
|
119
|
+
...ValidationMessageProps2
|
|
120
|
+
})));
|
|
119
121
|
}
|
|
120
122
|
|
|
121
123
|
CheckBoxField.propTypes = propTypes;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
1
|
/**** Libraries ****/
|
|
4
2
|
import React, { memo, useRef, useState } from 'react';
|
|
5
3
|
import { defaultProps } from './props/defaultProps';
|
|
@@ -9,7 +7,7 @@ import { propTypes } from './props/propTypes';
|
|
|
9
7
|
import Label from '@zohodesk/components/es/v1/Label/Label';
|
|
10
8
|
import TextBox from '@zohodesk/components/es/v1/TextBox/TextBox';
|
|
11
9
|
import ValidationMessage from '../ValidationMessage/ValidationMessage';
|
|
12
|
-
import { useUniqueId } from '@zohodesk/components/es/
|
|
10
|
+
import { useUniqueId } from '@zohodesk/components/es/Provider/IdProvider';
|
|
13
11
|
import FieldContainer from '../FieldContainer/FieldContainer';
|
|
14
12
|
/**** CSS ****/
|
|
15
13
|
|
|
@@ -103,16 +101,17 @@ function CurrencyField(props) {
|
|
|
103
101
|
isLocked: isLocked,
|
|
104
102
|
lockedInfoText: lockedInfoText,
|
|
105
103
|
renderProps: renderLabelProps
|
|
106
|
-
}, /*#__PURE__*/React.createElement(Label,
|
|
104
|
+
}, /*#__PURE__*/React.createElement(Label, {
|
|
107
105
|
text: labelName,
|
|
108
106
|
size: fieldSize === 'small' ? 'small' : 'medium',
|
|
109
107
|
palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette,
|
|
110
108
|
customClass: `${style.fieldLabel} ${labelCustomClass} ${isMandatory ? style.labelMandatory : ''}`,
|
|
111
109
|
htmlFor: uniqueId,
|
|
112
|
-
dataId: isDisabled ? `${dataId}_label_disabled` : isMandatory ? `${dataId}_label_mandatory` : `${dataId}_label
|
|
113
|
-
|
|
110
|
+
dataId: isDisabled ? `${dataId}_label_disabled` : isMandatory ? `${dataId}_label_mandatory` : `${dataId}_label`,
|
|
111
|
+
...LabelProps
|
|
112
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
114
113
|
className: `${style.fieldContainer} ${labelName ? style[`fieldMargin_${fieldSize}`] : ''}`
|
|
115
|
-
}, /*#__PURE__*/React.createElement(TextBox,
|
|
114
|
+
}, /*#__PURE__*/React.createElement(TextBox, {
|
|
116
115
|
htmlId: uniqueId,
|
|
117
116
|
id: id,
|
|
118
117
|
type: textBoxType,
|
|
@@ -132,20 +131,23 @@ function CurrencyField(props) {
|
|
|
132
131
|
isDisabled: isDisabled,
|
|
133
132
|
needEffect: isReadOnly || isDisabled ? false : true,
|
|
134
133
|
isClickable: isClickable,
|
|
135
|
-
needReadOnlyStyle: needReadOnlyStyle
|
|
136
|
-
|
|
134
|
+
needReadOnlyStyle: needReadOnlyStyle,
|
|
135
|
+
...TextBoxProps
|
|
136
|
+
}), validationMessage && /*#__PURE__*/React.createElement(ValidationMessage, {
|
|
137
137
|
text: validationMessage,
|
|
138
138
|
palette: validationPalette,
|
|
139
139
|
type: errorType,
|
|
140
140
|
dataId: `${dataId}_ValidationMessage`,
|
|
141
|
-
htmlFor: uniqueId
|
|
142
|
-
|
|
141
|
+
htmlFor: uniqueId,
|
|
142
|
+
...ValidationMessageProps1
|
|
143
|
+
}), validationRuleMessage && /*#__PURE__*/React.createElement(ValidationMessage, {
|
|
143
144
|
text: validationRuleMessage,
|
|
144
145
|
palette: validationRulePalette,
|
|
145
146
|
type: errorType,
|
|
146
147
|
htmlFor: uniqueId,
|
|
147
|
-
dataId: `${dataId}_ValidationRuleMessage
|
|
148
|
-
|
|
148
|
+
dataId: `${dataId}_ValidationRuleMessage`,
|
|
149
|
+
...ValidationMessageProps2
|
|
150
|
+
})));
|
|
149
151
|
}
|
|
150
152
|
|
|
151
153
|
CurrencyField.propTypes = propTypes;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
1
|
/**** Libraries ****/
|
|
4
2
|
import React, { memo, useEffect, useRef } from 'react';
|
|
5
3
|
import { defaultProps } from './props/defaultProps';
|
|
@@ -9,7 +7,7 @@ import { propTypes } from './props/propTypes';
|
|
|
9
7
|
import Label from '@zohodesk/components/es/v1/Label/Label';
|
|
10
8
|
import DateWidget from '@zohodesk/components/es/v1/DateTime/DateWidget';
|
|
11
9
|
import ValidationMessage from '../ValidationMessage/ValidationMessage';
|
|
12
|
-
import { useUniqueId } from '@zohodesk/components/es/
|
|
10
|
+
import { useUniqueId } from '@zohodesk/components/es/Provider/IdProvider';
|
|
13
11
|
import FieldContainer from '../FieldContainer/FieldContainer';
|
|
14
12
|
/**** CSS ****/
|
|
15
13
|
|
|
@@ -103,21 +101,21 @@ function DateField(props) {
|
|
|
103
101
|
isLocked: isLocked,
|
|
104
102
|
lockedInfoText: lockedInfoText,
|
|
105
103
|
renderProps: renderLabelProps
|
|
106
|
-
}, /*#__PURE__*/React.createElement(Label,
|
|
104
|
+
}, /*#__PURE__*/React.createElement(Label, {
|
|
107
105
|
text: labelName,
|
|
108
106
|
htmlFor: getAriaId,
|
|
109
107
|
size: fieldSize === 'small' ? 'small' : 'medium',
|
|
110
108
|
palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette,
|
|
111
109
|
onClick: isDisabled || isReadOnly ? null : handleLabelClick,
|
|
112
110
|
customClass: `${style.fieldLabel} ${labelCustomClass} ${isMandatory ? style.labelMandatory : ''}`,
|
|
113
|
-
dataId: isDisabled ? `${dataId}_label_disabled` : isMandatory ? `${dataId}_label_mandatory` : `${dataId}_label
|
|
114
|
-
|
|
111
|
+
dataId: isDisabled ? `${dataId}_label_disabled` : isMandatory ? `${dataId}_label_mandatory` : `${dataId}_label`,
|
|
112
|
+
...LabelProps,
|
|
115
113
|
id: labelName
|
|
116
|
-
}))
|
|
114
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
117
115
|
className: `${style.fieldContainer} ${labelName ? style[`fieldMargin_${fieldSize}`] : ''}`
|
|
118
116
|
}, isLocked && lockedValueText ? /*#__PURE__*/React.createElement("div", {
|
|
119
117
|
className: style.lockText
|
|
120
|
-
}, lockedValueText) : /*#__PURE__*/React.createElement(DateWidget,
|
|
118
|
+
}, lockedValueText) : /*#__PURE__*/React.createElement(DateWidget, {
|
|
121
119
|
textBoxSize: fieldSize === 'medium' ? textBoxSize : 'xsmall',
|
|
122
120
|
textBoxVariant: textBoxVariant,
|
|
123
121
|
isDateTime: isDateTime,
|
|
@@ -135,24 +133,26 @@ function DateField(props) {
|
|
|
135
133
|
isEditable: true,
|
|
136
134
|
htmlId: getAriaId,
|
|
137
135
|
i18nKeys: i18nKeys,
|
|
138
|
-
iconOnHover: iconOnHover
|
|
139
|
-
|
|
136
|
+
iconOnHover: iconOnHover,
|
|
137
|
+
...DateWidgetProps,
|
|
140
138
|
a11y: {
|
|
141
139
|
ariaLabelledby: labelName
|
|
142
140
|
}
|
|
143
|
-
})
|
|
141
|
+
}), validationMessage && /*#__PURE__*/React.createElement(ValidationMessage, {
|
|
144
142
|
text: validationMessage,
|
|
145
143
|
palette: validationPalette,
|
|
146
144
|
type: errorType,
|
|
147
145
|
htmlFor: getAriaId,
|
|
148
|
-
dataId: `${dataId}_ValidationMessage
|
|
149
|
-
|
|
146
|
+
dataId: `${dataId}_ValidationMessage`,
|
|
147
|
+
...ValidationMessageProps1
|
|
148
|
+
}), validationRuleMessage && /*#__PURE__*/React.createElement(ValidationMessage, {
|
|
150
149
|
text: validationRuleMessage,
|
|
151
150
|
palette: validationRulePalette,
|
|
152
151
|
type: errorType,
|
|
153
152
|
htmlFor: getAriaId,
|
|
154
|
-
dataId: `${dataId}_ValidationRuleMessage
|
|
155
|
-
|
|
153
|
+
dataId: `${dataId}_ValidationRuleMessage`,
|
|
154
|
+
...ValidationMessageProps2
|
|
155
|
+
})));
|
|
156
156
|
}
|
|
157
157
|
|
|
158
158
|
DateField.propTypes = propTypes;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
1
|
/**** Libraries ****/
|
|
4
2
|
import React, { memo, useRef } from 'react';
|
|
5
3
|
import { defaultProps } from './props/defaultProps';
|
|
@@ -9,7 +7,7 @@ import { propTypes } from './props/propTypes';
|
|
|
9
7
|
import Label from '@zohodesk/components/es/v1/Label/Label';
|
|
10
8
|
import MultiSelect from '@zohodesk/components/es/v1/MultiSelect/MultiSelect';
|
|
11
9
|
import ValidationMessage from '../ValidationMessage/ValidationMessage';
|
|
12
|
-
import { useUniqueId } from '@zohodesk/components/es/
|
|
10
|
+
import { useUniqueId } from '@zohodesk/components/es/Provider/IdProvider';
|
|
13
11
|
import FieldContainer from '../FieldContainer/FieldContainer';
|
|
14
12
|
/** CSS */
|
|
15
13
|
|
|
@@ -122,7 +120,7 @@ function MultiSelectField(props) {
|
|
|
122
120
|
isLocked: isLocked,
|
|
123
121
|
lockedInfoText: lockedInfoText,
|
|
124
122
|
renderProps: renderLabelProps
|
|
125
|
-
}, /*#__PURE__*/React.createElement(Label,
|
|
123
|
+
}, /*#__PURE__*/React.createElement(Label, {
|
|
126
124
|
text: labelName,
|
|
127
125
|
id: id,
|
|
128
126
|
size: fieldSize === 'small' ? 'small' : 'medium',
|
|
@@ -130,8 +128,9 @@ function MultiSelectField(props) {
|
|
|
130
128
|
,
|
|
131
129
|
customClass: `${style.fieldLabel} ${isMandatory ? style.labelMandatory : ''}`,
|
|
132
130
|
dataId: isDisabled ? `${dataId}_label_disabled` : isMandatory ? `${dataId}_label_mandatory` : `${dataId}_label`,
|
|
133
|
-
htmlFor: uniqueId
|
|
134
|
-
|
|
131
|
+
htmlFor: uniqueId,
|
|
132
|
+
...LabelProps
|
|
133
|
+
})), /*#__PURE__*/React.createElement(MultiSelect, {
|
|
135
134
|
options: options,
|
|
136
135
|
onChange: handleChange,
|
|
137
136
|
selectedOptions: selectedOptions,
|
|
@@ -162,22 +161,24 @@ function MultiSelectField(props) {
|
|
|
162
161
|
i18nKeys: i18nKeys,
|
|
163
162
|
htmlId: uniqueId,
|
|
164
163
|
customChildrenClass: customChildrenClass,
|
|
165
|
-
onFocus: onFocus
|
|
166
|
-
|
|
164
|
+
onFocus: onFocus,
|
|
165
|
+
...MultiSelectProps,
|
|
167
166
|
ariaLabelledby: uniqueId
|
|
168
|
-
}
|
|
167
|
+
}, children ? children : null), validationMessage && /*#__PURE__*/React.createElement(ValidationMessage, {
|
|
169
168
|
text: validationMessage,
|
|
170
169
|
palette: validationPalette,
|
|
171
170
|
type: errorType,
|
|
172
171
|
dataId: `${dataId}_ValidationMessage`,
|
|
173
|
-
htmlFor: uniqueId
|
|
174
|
-
|
|
172
|
+
htmlFor: uniqueId,
|
|
173
|
+
...ValidationMessageProps1
|
|
174
|
+
}), validationRuleMessage && /*#__PURE__*/React.createElement(ValidationMessage, {
|
|
175
175
|
text: validationRuleMessage,
|
|
176
176
|
palette: validationRulePalette,
|
|
177
177
|
type: errorType,
|
|
178
178
|
dataId: `${dataId}_ValidationRuleMessage`,
|
|
179
|
-
htmlFor: uniqueId
|
|
180
|
-
|
|
179
|
+
htmlFor: uniqueId,
|
|
180
|
+
...ValidationMessageProps2
|
|
181
|
+
}));
|
|
181
182
|
}
|
|
182
183
|
|
|
183
184
|
MultiSelectField.propTypes = propTypes;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
1
|
/**** Libraries ****/
|
|
4
2
|
import React, { memo, useState, useRef } from 'react';
|
|
5
3
|
import { defaultProps } from './props/defaultProps';
|
|
@@ -106,7 +104,7 @@ function PhoneField(props) {
|
|
|
106
104
|
dataSelectorId: dataSelectorId
|
|
107
105
|
}, /*#__PURE__*/React.createElement(Box, {
|
|
108
106
|
flexible: true
|
|
109
|
-
}, /*#__PURE__*/React.createElement(TextBoxField,
|
|
107
|
+
}, /*#__PURE__*/React.createElement(TextBoxField, {
|
|
110
108
|
labelName: labelName,
|
|
111
109
|
id: id,
|
|
112
110
|
palette: isMandatory ? 'mandatory' : 'default',
|
|
@@ -133,8 +131,9 @@ function PhoneField(props) {
|
|
|
133
131
|
labelPalette: labelPalette,
|
|
134
132
|
labelCustomClass: labelCustomClass,
|
|
135
133
|
errorType: errorType,
|
|
136
|
-
ePhiData: ePhiData
|
|
137
|
-
|
|
134
|
+
ePhiData: ePhiData,
|
|
135
|
+
...TextBoxFieldProps
|
|
136
|
+
})), /*#__PURE__*/React.createElement(Box, null, isTelephony && value ? /*#__PURE__*/React.createElement(Link, {
|
|
138
137
|
className: style.phoneIcon,
|
|
139
138
|
callfrom: "phone",
|
|
140
139
|
pbxname: providerName,
|
|
@@ -145,8 +144,9 @@ function PhoneField(props) {
|
|
|
145
144
|
callto: 'RequestPhoneNumber',
|
|
146
145
|
href: true,
|
|
147
146
|
onClick: onCall,
|
|
148
|
-
type: type
|
|
149
|
-
|
|
147
|
+
type: type,
|
|
148
|
+
...LinkProps
|
|
149
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
150
150
|
name: "ZD-GN-phone",
|
|
151
151
|
size: "14"
|
|
152
152
|
})) : null));
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
1
|
/**** Libraries ****/
|
|
4
2
|
import React, { memo } from 'react';
|
|
5
3
|
import { defaultProps } from './props/defaultProps';
|
|
@@ -65,27 +63,29 @@ const RadioField = props => {
|
|
|
65
63
|
className: `${style.container} ${isDisabled ? style.disabled : isReadOnly ? style.readonly : ''}`,
|
|
66
64
|
"data-title": isDisabled ? title : null,
|
|
67
65
|
"data-selector-id": dataSelectorId
|
|
68
|
-
}, labelName && /*#__PURE__*/React.createElement(Label,
|
|
66
|
+
}, labelName && /*#__PURE__*/React.createElement(Label, {
|
|
69
67
|
text: labelName,
|
|
70
68
|
size: "medium",
|
|
71
69
|
id: id,
|
|
72
70
|
palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : 'default',
|
|
73
71
|
customClass: `${style.fieldLabel} ${isMandatory ? style.labelMandatory : ''}`,
|
|
74
|
-
dataId: isDisabled ? `${dataId}_label_disabled` : isMandatory ? `${dataId}_label_mandatory` : `${dataId}_label
|
|
75
|
-
|
|
72
|
+
dataId: isDisabled ? `${dataId}_label_disabled` : isMandatory ? `${dataId}_label_mandatory` : `${dataId}_label`,
|
|
73
|
+
...LabelProps
|
|
74
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
76
75
|
className: `${style.fieldContainer} ${isBoxStyle ? style.radiosWrapper : ''} ${labelName ? style.fieldMargin_medium : ''} ${style.radioContainer}`
|
|
77
76
|
}, options.map((option, index) => {
|
|
78
77
|
let {
|
|
79
78
|
text,
|
|
80
79
|
value,
|
|
81
80
|
disabled = false,
|
|
81
|
+
tooltip,
|
|
82
82
|
infoTooltip
|
|
83
83
|
} = option;
|
|
84
84
|
let isChecked = selectedValue == value;
|
|
85
85
|
return /*#__PURE__*/React.createElement("span", {
|
|
86
86
|
key: index,
|
|
87
87
|
className: `${!isBoxStyle ? style.radio : ''} ${style.radioWrap}`
|
|
88
|
-
}, /*#__PURE__*/React.createElement(Radio,
|
|
88
|
+
}, /*#__PURE__*/React.createElement(Radio, {
|
|
89
89
|
id: index,
|
|
90
90
|
value: value,
|
|
91
91
|
name: id,
|
|
@@ -94,14 +94,16 @@ const RadioField = props => {
|
|
|
94
94
|
labelSize: labelSize,
|
|
95
95
|
active: isActive || isBoxStyle && isChecked,
|
|
96
96
|
disabled: disabled || isDisabled,
|
|
97
|
+
disabledTitle: tooltip,
|
|
98
|
+
title: tooltip,
|
|
97
99
|
onChange: handleChange,
|
|
98
100
|
getRef: handleGetRef,
|
|
99
101
|
size: size,
|
|
100
102
|
checked: isChecked,
|
|
101
103
|
dataId: dataId,
|
|
102
104
|
isReadOnly: isReadOnly,
|
|
103
|
-
variant: variant
|
|
104
|
-
|
|
105
|
+
variant: variant,
|
|
106
|
+
...RadioProps,
|
|
105
107
|
a11y: {
|
|
106
108
|
tabIndex: !!selectedValue ? isChecked ? '0' : '-1' : index === 0 ? '0' : '-1',
|
|
107
109
|
...RadioProps.a11y
|
|
@@ -110,23 +112,26 @@ const RadioField = props => {
|
|
|
110
112
|
customRadioWrap: `${isBoxStyle ? style.radioBox : ''} ${isBoxStyle && isChecked ? style.radioBoxActive : ''}`,
|
|
111
113
|
...RadioProps.customClass
|
|
112
114
|
}
|
|
113
|
-
}
|
|
115
|
+
}, !!infoTooltip ? /*#__PURE__*/React.createElement(Icon, {
|
|
114
116
|
name: "ZD-GN-info",
|
|
115
117
|
size: "16",
|
|
116
118
|
title: infoTooltip,
|
|
117
|
-
iconClass: style.infoIcon
|
|
118
|
-
|
|
119
|
-
|
|
119
|
+
iconClass: style.infoIcon,
|
|
120
|
+
...InfoIconProps
|
|
121
|
+
}) : null));
|
|
122
|
+
})), validationMessage && /*#__PURE__*/React.createElement(ValidationMessage, {
|
|
120
123
|
text: validationMessage,
|
|
121
124
|
palette: validationPalette,
|
|
122
125
|
type: errorType,
|
|
123
|
-
dataId: `${dataId}_ValidationMessage
|
|
124
|
-
|
|
126
|
+
dataId: `${dataId}_ValidationMessage`,
|
|
127
|
+
...ValidationMessageProps1
|
|
128
|
+
}), validationRuleMessage && /*#__PURE__*/React.createElement(ValidationMessage, {
|
|
125
129
|
text: validationRuleMessage,
|
|
126
130
|
palette: validationRulePalette,
|
|
127
131
|
type: errorType,
|
|
128
|
-
dataId: `${dataId}_ValidationRuleMessage
|
|
129
|
-
|
|
132
|
+
dataId: `${dataId}_ValidationRuleMessage`,
|
|
133
|
+
...ValidationMessageProps2
|
|
134
|
+
}));
|
|
130
135
|
};
|
|
131
136
|
|
|
132
137
|
RadioField.propTypes = propTypes;
|