@zohodesk/components 1.0.0-temp-154 → 1.0.0-temp-156
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/README.md +4 -0
- package/es/Accordion/Accordion.js +7 -3
- package/es/Accordion/AccordionItem.js +4 -2
- package/es/Animation/Animation.js +3 -3
- package/es/AppContainer/AppContainer.js +13 -5
- package/es/AppContainer/AppContainer.module.css +2 -2
- package/es/Avatar/Avatar.js +23 -11
- package/es/Avatar/Avatar.module.css +10 -10
- package/es/AvatarTeam/AvatarTeam.js +3 -3
- package/es/AvatarTeam/AvatarTeam.module.css +22 -21
- package/es/Button/Button.js +4 -3
- package/es/Button/css/Button.module.css +51 -50
- package/es/Buttongroup/Buttongroup.js +3 -3
- package/es/Buttongroup/Buttongroup.module.css +13 -14
- package/es/Card/Card.js +21 -10
- package/es/CheckBox/CheckBox.js +5 -3
- package/es/CheckBox/CheckBox.module.css +16 -16
- package/es/DateTime/CalendarView.js +32 -20
- package/es/DateTime/DateTime.js +67 -6
- package/es/DateTime/DateTime.module.css +39 -39
- package/es/DateTime/DateTimePopupFooter.js +4 -2
- package/es/DateTime/DateTimePopupHeader.js +8 -2
- package/es/DateTime/DateWidget.js +98 -35
- package/es/DateTime/DateWidget.module.css +5 -5
- package/es/DateTime/DaysRow.js +4 -2
- package/es/DateTime/Time.js +10 -2
- package/es/DateTime/YearView.js +28 -4
- package/es/DateTime/YearView.module.css +15 -15
- package/es/DateTime/__tests__/CalendarView.spec.js +1 -0
- package/es/DateTime/__tests__/DateTime.spec.js +1 -0
- package/es/DateTime/__tests__/DateWidget.spec.js +2 -3
- package/es/DateTime/common.js +3 -0
- package/es/DateTime/constants.js +1 -0
- package/es/DateTime/dateFormatUtils/dateFormat.js +63 -30
- package/es/DateTime/dateFormatUtils/dateFormats.js +0 -1
- package/es/DateTime/dateFormatUtils/dayChange.js +13 -4
- package/es/DateTime/dateFormatUtils/index.js +32 -2
- package/es/DateTime/dateFormatUtils/monthChange.js +8 -0
- package/es/DateTime/dateFormatUtils/timeChange.js +22 -6
- package/es/DateTime/dateFormatUtils/yearChange.js +11 -2
- package/es/DateTime/objectUtils.js +14 -20
- package/es/DateTime/typeChecker.js +3 -0
- package/es/DateTime/validator.js +58 -6
- package/es/DropBox/DropBox.js +6 -2
- package/es/DropBox/DropBoxElement/DropBoxElement.js +7 -0
- package/es/DropBox/DropBoxElement/css/DropBoxElement.module.css +74 -73
- package/es/DropBox/DropBoxElement/css/cssJSLogic.js +5 -3
- package/es/DropBox/DropBoxElement/useDropboxPosCalc.js +3 -0
- package/es/DropBox/css/DropBox.module.css +6 -6
- package/es/DropBox/props/defaultProps.js +1 -2
- package/es/DropBox/props/propTypes.js +1 -2
- package/es/DropDown/DropDown.js +8 -4
- package/es/DropDown/DropDown.module.css +2 -2
- package/es/DropDown/DropDownHeading.js +4 -5
- package/es/DropDown/DropDownHeading.module.css +3 -3
- package/es/DropDown/DropDownItem.js +6 -0
- package/es/DropDown/DropDownItem.module.css +9 -9
- package/es/DropDown/DropDownSearch.js +4 -0
- package/es/DropDown/DropDownSeparator.js +1 -0
- package/es/DropDown/DropDownSeparator.module.css +2 -2
- package/es/DropDown/__tests__/DropDown.spec.js +1 -2
- package/es/Heading/Heading.js +2 -3
- package/es/Heading/Heading.module.css +2 -2
- package/es/Label/Label.js +2 -3
- package/es/Label/Label.module.css +1 -1
- package/es/Layout/Box.js +13 -0
- package/es/Layout/Container.js +12 -1
- package/es/Layout/Layout.module.css +15 -15
- package/es/Layout/index.js +1 -2
- package/es/ListItem/ListContainer.js +8 -3
- package/es/ListItem/ListItem.js +9 -3
- package/es/ListItem/ListItem.module.css +26 -26
- package/es/ListItem/ListItemWithAvatar.js +9 -3
- package/es/ListItem/ListItemWithCheckBox.js +7 -2
- package/es/ListItem/ListItemWithIcon.js +8 -3
- package/es/ListItem/ListItemWithRadio.js +7 -3
- package/es/Modal/Modal.js +28 -11
- package/es/MultiSelect/AdvancedGroupMultiSelect.js +89 -13
- package/es/MultiSelect/AdvancedMultiSelect.js +32 -9
- package/es/MultiSelect/EmptyState.js +2 -0
- package/es/MultiSelect/MultiSelect.js +99 -32
- package/es/MultiSelect/MultiSelect.module.css +32 -31
- package/es/MultiSelect/MultiSelectHeader.js +3 -0
- package/es/MultiSelect/MultiSelectWithAvatar.js +12 -6
- package/es/MultiSelect/SelectedOptions.js +6 -3
- package/es/MultiSelect/SelectedOptions.module.css +5 -5
- package/es/MultiSelect/Suggestions.js +7 -3
- package/es/MultiSelect/__tests__/MultiSelect.spec.js +4 -6
- package/es/MultiSelect/props/propTypes.js +2 -0
- package/es/PopOver/PopOver.js +18 -2
- package/es/PopOver/__tests__/PopOver.spec.js +2 -1
- package/es/Popup/Popup.js +77 -24
- package/es/Popup/__tests__/Popup.spec.js +17 -5
- package/es/Popup/viewPort.js +16 -4
- package/es/Provider/IdProvider.js +10 -5
- package/es/Provider/LibraryContext.js +6 -4
- package/es/Provider/NumberGenerator/NumberGenerator.js +21 -7
- package/es/Provider/ZindexProvider.js +9 -2
- package/es/Radio/Radio.js +4 -2
- package/es/Radio/Radio.module.css +3 -3
- package/es/Responsive/CustomResponsive.js +30 -18
- package/es/Responsive/RefWrapper.js +6 -7
- package/es/Responsive/ResizeComponent.js +35 -25
- package/es/Responsive/ResizeObserver.js +26 -6
- package/es/Responsive/Responsive.js +34 -20
- package/es/Responsive/index.js +1 -3
- package/es/Responsive/sizeObservers.js +28 -7
- package/es/Responsive/utils/index.js +7 -5
- package/es/Responsive/utils/shallowCompare.js +7 -2
- package/es/Responsive/windowResizeObserver.js +7 -0
- package/es/ResponsiveDropBox/ResponsiveDropBox.js +4 -0
- package/es/ResponsiveDropBox/ResponsiveDropBox.module.css +2 -2
- package/es/Ribbon/Ribbon.js +3 -2
- package/es/Ribbon/Ribbon.module.css +42 -42
- package/es/RippleEffect/RippleEffect.js +1 -3
- package/es/Select/GroupSelect.js +58 -14
- package/es/Select/Select.js +79 -33
- package/es/Select/Select.module.css +23 -23
- package/es/Select/SelectWithAvatar.js +17 -4
- package/es/Select/SelectWithIcon.js +46 -5
- package/es/Select/__tests__/Select.spec.js +6 -8
- package/es/Select/props/propTypes.js +1 -0
- package/es/Stencils/Stencils.js +3 -3
- package/es/Stencils/Stencils.module.css +2 -2
- package/es/Switch/Switch.js +5 -3
- package/es/Switch/Switch.module.css +23 -23
- package/es/Tab/Tab.js +4 -4
- package/es/Tab/Tab.module.css +14 -14
- package/es/Tab/TabContent.js +1 -0
- package/es/Tab/TabContentWrapper.js +2 -0
- package/es/Tab/TabWrapper.js +5 -2
- package/es/Tab/Tabs.js +54 -7
- package/es/Tab/Tabs.module.css +23 -23
- package/es/Tab/__tests__/Tab.spec.js +1 -3
- package/es/Tab/__tests__/TabWrapper.spec.js +1 -0
- package/es/Tag/Tag.js +6 -3
- package/es/Tag/Tag.module.css +10 -10
- package/es/TextBox/TextBox.js +15 -3
- package/es/TextBox/TextBox.module.css +6 -5
- package/es/TextBox/__tests__/TextBox.spec.js +1 -4
- package/es/TextBoxIcon/TextBoxIcon.js +9 -2
- package/es/TextBoxIcon/TextBoxIcon.module.css +7 -6
- package/es/TextBoxIcon/__tests__/TextBoxIcon.spec.js +2 -7
- package/es/Textarea/Textarea.js +12 -3
- package/es/Textarea/Textarea.module.css +6 -6
- package/es/Textarea/__tests__/Textarea.spec.js +2 -2
- package/es/Tooltip/Tooltip.js +58 -14
- package/es/Tooltip/Tooltip.module.css +12 -5
- package/es/Tooltip/__tests__/Tooltip.spec.js +5 -0
- package/es/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +3 -2
- package/es/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +7 -5
- package/es/common/animation.module.css +8 -8
- package/es/common/basicReset.module.css +3 -3
- package/es/common/boxShadow.module.css +1 -3
- package/es/common/common.module.css +24 -24
- package/es/common/customscroll.module.css +4 -2
- package/es/common/reset.module.css +1 -0
- package/es/deprecated/AdvancedMultiSelect.module.css +18 -18
- package/es/deprecated/PortalLayer/PortalLayer.js +25 -20
- package/es/semantic/Button/Button.js +3 -2
- package/es/semantic/Button/semanticButton.module.css +1 -1
- package/es/utils/Common.js +54 -9
- package/es/utils/ContextOptimizer.js +4 -5
- package/es/utils/__tests__/debounce.spec.js +2 -2
- package/es/utils/constructFullName.js +2 -0
- package/es/utils/css/compileClassNames.js +5 -0
- package/es/utils/css/mergeStyle.js +7 -6
- package/es/utils/css/utils.js +1 -0
- package/es/utils/datetime/common.js +16 -5
- package/es/utils/debounce.js +5 -1
- package/es/utils/dropDownUtils.js +68 -11
- package/es/utils/getInitial.js +4 -0
- package/es/utils/shallowEqual.js +6 -0
- package/lib/Accordion/Accordion.js +42 -18
- package/lib/Accordion/AccordionItem.js +40 -18
- package/lib/Accordion/__tests__/Accordion.spec.js +3 -0
- package/lib/Accordion/index.js +3 -0
- package/lib/Accordion/props/propTypes.js +3 -0
- package/lib/Animation/Animation.js +38 -18
- package/lib/Animation/__tests__/Animation.spec.js +11 -7
- package/lib/Animation/props/propTypes.js +3 -0
- package/lib/AppContainer/AppContainer.js +56 -21
- package/lib/AppContainer/AppContainer.module.css +2 -2
- package/lib/AppContainer/props/propTypes.js +3 -0
- package/lib/Avatar/Avatar.js +78 -38
- package/lib/Avatar/Avatar.module.css +10 -10
- package/lib/Avatar/__tests__/Avatar.spec.js +44 -0
- package/lib/Avatar/props/propTypes.js +3 -0
- package/lib/AvatarTeam/AvatarTeam.js +52 -30
- package/lib/AvatarTeam/AvatarTeam.module.css +22 -21
- package/lib/AvatarTeam/__tests__/AvatarTeam.spec.js +13 -0
- package/lib/AvatarTeam/props/propTypes.js +3 -0
- package/lib/Button/Button.js +31 -20
- package/lib/Button/css/Button.module.css +51 -50
- package/lib/Button/css/cssJSLogic.js +18 -17
- package/lib/Button/index.js +3 -0
- package/lib/Button/props/defaultProps.js +2 -0
- package/lib/Button/props/propTypes.js +3 -0
- package/lib/Buttongroup/Buttongroup.js +32 -12
- package/lib/Buttongroup/Buttongroup.module.css +13 -14
- package/lib/Buttongroup/__test__/Buttongroup.spec.js +10 -0
- package/lib/Buttongroup/props/propTypes.js +3 -0
- package/lib/Card/Card.js +102 -46
- package/lib/Card/__tests__/Card.spec.js +10 -1
- package/lib/Card/index.js +4 -0
- package/lib/Card/props/propTypes.js +3 -0
- package/lib/CheckBox/CheckBox.js +71 -47
- package/lib/CheckBox/CheckBox.module.css +16 -16
- package/lib/CheckBox/__tests__/CheckBox.spec.js +3 -0
- package/lib/CheckBox/props/propTypes.js +3 -0
- package/lib/DateTime/CalendarView.js +82 -42
- package/lib/DateTime/DateTime.js +239 -155
- package/lib/DateTime/DateTime.module.css +39 -39
- package/lib/DateTime/DateTimePopupFooter.js +31 -8
- package/lib/DateTime/DateTimePopupHeader.js +48 -17
- package/lib/DateTime/DateWidget.js +352 -250
- package/lib/DateTime/DateWidget.module.css +5 -5
- package/lib/DateTime/DaysRow.js +27 -5
- package/lib/DateTime/Time.js +73 -32
- package/lib/DateTime/YearView.js +77 -28
- package/lib/DateTime/YearView.module.css +15 -15
- package/lib/DateTime/__tests__/CalendarView.spec.js +13 -5
- package/lib/DateTime/__tests__/DateTime.spec.js +51 -37
- package/lib/DateTime/__tests__/DateWidget.spec.js +10 -8
- package/lib/DateTime/common.js +6 -0
- package/lib/DateTime/constants.js +1 -0
- package/lib/DateTime/dateFormatUtils/dateFormat.js +184 -122
- package/lib/DateTime/dateFormatUtils/dateFormats.js +0 -1
- package/lib/DateTime/dateFormatUtils/dayChange.js +14 -7
- package/lib/DateTime/dateFormatUtils/index.js +74 -16
- package/lib/DateTime/dateFormatUtils/monthChange.js +19 -9
- package/lib/DateTime/dateFormatUtils/timeChange.js +54 -22
- package/lib/DateTime/dateFormatUtils/yearChange.js +22 -11
- package/lib/DateTime/index.js +2 -0
- package/lib/DateTime/objectUtils.js +24 -20
- package/lib/DateTime/props/propTypes.js +11 -1
- package/lib/DateTime/typeChecker.js +4 -0
- package/lib/DateTime/validator.js +73 -10
- package/lib/DropBox/DropBox.js +34 -10
- package/lib/DropBox/DropBoxElement/DropBoxElement.js +58 -37
- package/lib/DropBox/DropBoxElement/css/DropBoxElement.module.css +74 -73
- package/lib/DropBox/DropBoxElement/css/cssJSLogic.js +41 -33
- package/lib/DropBox/DropBoxElement/props/propTypes.js +3 -0
- package/lib/DropBox/DropBoxElement/useDropboxPosCalc.js +14 -9
- package/lib/DropBox/__tests__/DropBox.spec.js +6 -2
- package/lib/DropBox/css/DropBox.module.css +6 -6
- package/lib/DropBox/css/cssJSLogic.js +3 -1
- package/lib/DropBox/props/defaultProps.js +8 -4
- package/lib/DropBox/props/propTypes.js +10 -4
- package/lib/DropDown/DropDown.js +52 -8
- package/lib/DropDown/DropDown.module.css +2 -2
- package/lib/DropDown/DropDownHeading.js +39 -20
- package/lib/DropDown/DropDownHeading.module.css +3 -3
- package/lib/DropDown/DropDownItem.js +42 -20
- package/lib/DropDown/DropDownItem.module.css +9 -9
- package/lib/DropDown/DropDownSearch.js +40 -17
- package/lib/DropDown/DropDownSeparator.js +24 -4
- package/lib/DropDown/DropDownSeparator.module.css +2 -2
- package/lib/DropDown/__tests__/DropDown.spec.js +15 -9
- package/lib/DropDown/__tests__/DropDownItem.spec.js +9 -4
- package/lib/DropDown/__tests__/DropDownSearch.spec.js +3 -0
- package/lib/DropDown/index.js +9 -0
- package/lib/DropDown/props/propTypes.js +6 -4
- package/lib/Heading/Heading.js +37 -15
- package/lib/Heading/Heading.module.css +2 -2
- package/lib/Heading/props/propTypes.js +3 -0
- package/lib/Label/Label.js +39 -19
- package/lib/Label/Label.module.css +1 -1
- package/lib/Label/__tests__/Label.spec.js +14 -1
- package/lib/Label/props/propTypes.js +3 -0
- package/lib/Layout/Box.js +31 -11
- package/lib/Layout/Container.js +29 -10
- package/lib/Layout/Layout.module.css +15 -15
- package/lib/Layout/__tests__/Box.spec.js +65 -49
- package/lib/Layout/__tests__/Container.spec.js +67 -50
- package/lib/Layout/index.js +3 -0
- package/lib/Layout/props/propTypes.js +3 -0
- package/lib/Layout/utils.js +10 -0
- package/lib/ListItem/ListContainer.js +48 -27
- package/lib/ListItem/ListItem.js +69 -45
- package/lib/ListItem/ListItem.module.css +26 -26
- package/lib/ListItem/ListItemWithAvatar.js +75 -48
- package/lib/ListItem/ListItemWithCheckBox.js +64 -39
- package/lib/ListItem/ListItemWithIcon.js +68 -44
- package/lib/ListItem/ListItemWithRadio.js +65 -41
- package/lib/ListItem/index.js +7 -0
- package/lib/ListItem/props/propTypes.js +6 -4
- package/lib/Modal/Modal.js +45 -10
- package/lib/Modal/props/propTypes.js +3 -0
- package/lib/MultiSelect/AdvancedGroupMultiSelect.js +294 -166
- package/lib/MultiSelect/AdvancedMultiSelect.js +202 -125
- package/lib/MultiSelect/EmptyState.js +45 -24
- package/lib/MultiSelect/MultiSelect.js +323 -206
- package/lib/MultiSelect/MultiSelect.module.css +32 -31
- package/lib/MultiSelect/MultiSelectHeader.js +30 -8
- package/lib/MultiSelect/MultiSelectWithAvatar.js +105 -63
- package/lib/MultiSelect/SelectedOptions.js +43 -17
- package/lib/MultiSelect/SelectedOptions.module.css +5 -5
- package/lib/MultiSelect/Suggestions.js +64 -32
- package/lib/MultiSelect/__tests__/MultiSelect.spec.js +86 -75
- package/lib/MultiSelect/index.js +5 -0
- package/lib/MultiSelect/props/defaultProps.js +2 -0
- package/lib/MultiSelect/props/propTypes.js +5 -0
- package/lib/PopOver/PopOver.js +95 -49
- package/lib/PopOver/__tests__/PopOver.spec.js +4 -1
- package/lib/PopOver/index.js +4 -0
- package/lib/PopOver/props/propTypes.js +3 -0
- package/lib/Popup/Popup.js +158 -81
- package/lib/Popup/__tests__/Popup.spec.js +43 -8
- package/lib/Popup/viewPort.js +28 -14
- package/lib/Provider/AvatarSize.js +4 -0
- package/lib/Provider/Config.js +2 -0
- package/lib/Provider/CssProvider.js +4 -0
- package/lib/Provider/IdProvider.js +17 -6
- package/lib/Provider/LibraryContext.js +35 -15
- package/lib/Provider/LibraryContextInit.js +4 -0
- package/lib/Provider/NumberGenerator/NumberGenerator.js +44 -15
- package/lib/Provider/ZindexProvider.js +15 -3
- package/lib/Provider/index.js +5 -0
- package/lib/Radio/Radio.js +61 -38
- package/lib/Radio/Radio.module.css +3 -3
- package/lib/Radio/__tests__/Radiospec.js +9 -5
- package/lib/Radio/props/propTypes.js +3 -0
- package/lib/Responsive/CustomResponsive.js +73 -29
- package/lib/Responsive/RefWrapper.js +17 -11
- package/lib/Responsive/ResizeComponent.js +62 -36
- package/lib/Responsive/ResizeObserver.js +24 -10
- package/lib/Responsive/Responsive.js +80 -30
- package/lib/Responsive/index.js +4 -0
- package/lib/Responsive/props/propTypes.js +3 -0
- package/lib/Responsive/sizeObservers.js +53 -17
- package/lib/Responsive/utils/index.js +11 -3
- package/lib/Responsive/utils/shallowCompare.js +11 -2
- package/lib/Responsive/windowResizeObserver.js +8 -0
- package/lib/ResponsiveDropBox/ResponsiveDropBox.js +45 -17
- package/lib/ResponsiveDropBox/ResponsiveDropBox.module.css +2 -2
- package/lib/ResponsiveDropBox/props/propTypes.js +3 -0
- package/lib/Ribbon/Ribbon.js +33 -13
- package/lib/Ribbon/Ribbon.module.css +42 -42
- package/lib/Ribbon/__tests__/Ribbon.spec.js +22 -0
- package/lib/Ribbon/props/propTypes.js +3 -0
- package/lib/RippleEffect/RippleEffect.js +18 -10
- package/lib/RippleEffect/props/propTypes.js +3 -0
- package/lib/Select/GroupSelect.js +229 -130
- package/lib/Select/Select.js +290 -209
- package/lib/Select/Select.module.css +23 -23
- package/lib/Select/SelectWithAvatar.js +102 -56
- package/lib/Select/SelectWithIcon.js +132 -76
- package/lib/Select/__tests__/Select.spec.js +133 -91
- package/lib/Select/index.js +5 -0
- package/lib/Select/props/defaultProps.js +5 -4
- package/lib/Select/props/propTypes.js +4 -0
- package/lib/Stencils/Stencils.js +29 -10
- package/lib/Stencils/Stencils.module.css +2 -2
- package/lib/Stencils/__tests__/Stencils.spec.js +12 -0
- package/lib/Stencils/props/propTypes.js +3 -0
- package/lib/Switch/Switch.js +57 -34
- package/lib/Switch/Switch.module.css +23 -23
- package/lib/Switch/props/propTypes.js +3 -0
- package/lib/Tab/Tab.js +40 -27
- package/lib/Tab/Tab.module.css +14 -14
- package/lib/Tab/TabContent.js +12 -5
- package/lib/Tab/TabContentWrapper.js +13 -6
- package/lib/Tab/TabWrapper.js +37 -19
- package/lib/Tab/Tabs.js +171 -91
- package/lib/Tab/Tabs.module.css +23 -23
- package/lib/Tab/__tests__/Tab.spec.js +67 -58
- package/lib/Tab/__tests__/TabContent.spec.js +10 -6
- package/lib/Tab/__tests__/TabContentWrapper.spec.js +28 -20
- package/lib/Tab/__tests__/TabWrapper.spec.js +12 -0
- package/lib/Tab/__tests__/Tabs.spec.js +53 -39
- package/lib/Tab/index.js +6 -0
- package/lib/Tab/props/propTypes.js +3 -0
- package/lib/Tag/Tag.js +72 -43
- package/lib/Tag/Tag.module.css +10 -10
- package/lib/Tag/__tests__/Tag.spec.js +14 -8
- package/lib/Tag/props/propTypes.js +3 -0
- package/lib/TextBox/TextBox.js +85 -59
- package/lib/TextBox/TextBox.module.css +6 -5
- package/lib/TextBox/__tests__/TextBox.spec.js +14 -4
- package/lib/TextBox/props/propTypes.js +6 -4
- package/lib/TextBoxIcon/TextBoxIcon.js +79 -52
- package/lib/TextBoxIcon/TextBoxIcon.module.css +7 -6
- package/lib/TextBoxIcon/__tests__/TextBoxIcon.spec.js +14 -5
- package/lib/TextBoxIcon/props/propTypes.js +3 -0
- package/lib/Textarea/Textarea.js +54 -29
- package/lib/Textarea/Textarea.module.css +6 -6
- package/lib/Textarea/__tests__/Textarea.spec.js +14 -2
- package/lib/Textarea/props/propTypes.js +3 -0
- package/lib/Tooltip/Tooltip.js +94 -31
- package/lib/Tooltip/Tooltip.module.css +12 -5
- package/lib/Tooltip/__tests__/Tooltip.spec.js +24 -3
- package/lib/Tooltip/props/propTypes.js +3 -0
- package/lib/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +40 -16
- package/lib/VelocityAnimation/VelocityAnimation/props/propTypes.js +3 -0
- package/lib/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +53 -25
- package/lib/VelocityAnimation/VelocityAnimationGroup/props/propTypes.js +3 -0
- package/lib/VelocityAnimation/index.js +3 -0
- package/lib/common/animation.module.css +8 -8
- package/lib/common/basicReset.module.css +3 -3
- package/lib/common/boxShadow.module.css +1 -3
- package/lib/common/common.module.css +24 -24
- package/lib/common/customscroll.module.css +4 -2
- package/lib/common/reset.module.css +1 -0
- package/lib/css.js +40 -0
- package/lib/deprecated/AdvancedMultiSelect.module.css +18 -18
- package/lib/deprecated/PortalLayer/PortalLayer.js +46 -23
- package/lib/deprecated/PortalLayer/props/propTypes.js +3 -0
- package/lib/index.js +57 -0
- package/lib/semantic/Button/Button.js +42 -22
- package/lib/semantic/Button/props/propTypes.js +3 -0
- package/lib/semantic/Button/semanticButton.module.css +1 -1
- package/lib/semantic/index.js +2 -0
- package/lib/utils/Common.js +108 -18
- package/lib/utils/ContextOptimizer.js +16 -10
- package/lib/utils/__tests__/constructFullName.spec.js +1 -0
- package/lib/utils/__tests__/debounce.spec.js +3 -2
- package/lib/utils/__tests__/getInitial.spec.js +1 -0
- package/lib/utils/constructFullName.js +13 -4
- package/lib/utils/css/compileClassNames.js +6 -0
- package/lib/utils/css/mergeStyle.js +10 -7
- package/lib/utils/css/utils.js +8 -0
- package/lib/utils/datetime/common.js +32 -5
- package/lib/utils/debounce.js +6 -1
- package/lib/utils/dropDownUtils.js +175 -59
- package/lib/utils/dummyFunction.js +2 -0
- package/lib/utils/getHTMLFontSize.js +1 -0
- package/lib/utils/getInitial.js +6 -0
- package/lib/utils/index.js +4 -0
- package/lib/utils/scrollTo.js +2 -0
- package/lib/utils/shallowEqual.js +8 -0
- package/package.json +20 -13
|
@@ -1,9 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _react = _interopRequireDefault(require("react"));
|
|
4
|
+
|
|
4
5
|
var _TextBox = _interopRequireDefault(require("../TextBox"));
|
|
6
|
+
|
|
5
7
|
var _reactTestRenderer = _interopRequireDefault(require("react-test-renderer"));
|
|
8
|
+
|
|
6
9
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
10
|
+
|
|
7
11
|
describe('TextBox component', function () {
|
|
8
12
|
it('should display size small', function () {
|
|
9
13
|
var ele = _reactTestRenderer["default"].create( /*#__PURE__*/_react["default"].createElement(_TextBox["default"], {
|
|
@@ -12,6 +16,7 @@ describe('TextBox component', function () {
|
|
|
12
16
|
size: "small",
|
|
13
17
|
variant: "default"
|
|
14
18
|
}));
|
|
19
|
+
|
|
15
20
|
var tree = ele.toJSON();
|
|
16
21
|
expect(tree).toMatchSnapshot();
|
|
17
22
|
});
|
|
@@ -22,6 +27,7 @@ describe('TextBox component', function () {
|
|
|
22
27
|
size: "medium",
|
|
23
28
|
variant: "default"
|
|
24
29
|
}));
|
|
30
|
+
|
|
25
31
|
var tree = ele.toJSON();
|
|
26
32
|
expect(tree).toMatchSnapshot();
|
|
27
33
|
});
|
|
@@ -32,6 +38,7 @@ describe('TextBox component', function () {
|
|
|
32
38
|
size: "xmedium",
|
|
33
39
|
variant: "default"
|
|
34
40
|
}));
|
|
41
|
+
|
|
35
42
|
var tree = ele.toJSON();
|
|
36
43
|
expect(tree).toMatchSnapshot();
|
|
37
44
|
});
|
|
@@ -42,6 +49,7 @@ describe('TextBox component', function () {
|
|
|
42
49
|
size: "small",
|
|
43
50
|
variant: "primary"
|
|
44
51
|
}));
|
|
52
|
+
|
|
45
53
|
var tree = ele.toJSON();
|
|
46
54
|
expect(tree).toMatchSnapshot();
|
|
47
55
|
});
|
|
@@ -52,6 +60,7 @@ describe('TextBox component', function () {
|
|
|
52
60
|
size: "medium",
|
|
53
61
|
variant: "primary"
|
|
54
62
|
}));
|
|
63
|
+
|
|
55
64
|
var tree = ele.toJSON();
|
|
56
65
|
expect(tree).toMatchSnapshot();
|
|
57
66
|
});
|
|
@@ -62,6 +71,7 @@ describe('TextBox component', function () {
|
|
|
62
71
|
size: "xmedium",
|
|
63
72
|
variant: "primary"
|
|
64
73
|
}));
|
|
74
|
+
|
|
65
75
|
var tree = ele.toJSON();
|
|
66
76
|
expect(tree).toMatchSnapshot();
|
|
67
77
|
});
|
|
@@ -72,6 +82,7 @@ describe('TextBox component', function () {
|
|
|
72
82
|
size: "small",
|
|
73
83
|
variant: "secondary"
|
|
74
84
|
}));
|
|
85
|
+
|
|
75
86
|
var tree = ele.toJSON();
|
|
76
87
|
expect(tree).toMatchSnapshot();
|
|
77
88
|
});
|
|
@@ -82,6 +93,7 @@ describe('TextBox component', function () {
|
|
|
82
93
|
size: "medium",
|
|
83
94
|
variant: "secondary"
|
|
84
95
|
}));
|
|
96
|
+
|
|
85
97
|
var tree = ele.toJSON();
|
|
86
98
|
expect(tree).toMatchSnapshot();
|
|
87
99
|
});
|
|
@@ -92,6 +104,7 @@ describe('TextBox component', function () {
|
|
|
92
104
|
size: "xmedium",
|
|
93
105
|
variant: "secondary"
|
|
94
106
|
}));
|
|
107
|
+
|
|
95
108
|
var tree = ele.toJSON();
|
|
96
109
|
expect(tree).toMatchSnapshot();
|
|
97
110
|
});
|
|
@@ -114,9 +127,7 @@ describe('TextBox component', function () {
|
|
|
114
127
|
text: "Text Box Working"
|
|
115
128
|
}));
|
|
116
129
|
expect(TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'textBox').getAttribute('placeholder')).toMatch(/Text Box/);
|
|
117
|
-
});
|
|
118
|
-
|
|
119
|
-
// it('Check disabled works', () => {
|
|
130
|
+
}); // it('Check disabled works', () => {
|
|
120
131
|
// let renderedDOM = TestUtils.renderIntoDocument(
|
|
121
132
|
// <TextBox maxLength='100' placeHolder='Text Box' size='medium' variant='primary' value='Text Box Working' disabled />
|
|
122
133
|
// );
|
|
@@ -132,7 +143,6 @@ describe('TextBox component', function () {
|
|
|
132
143
|
// pass
|
|
133
144
|
// ).toBe(true);
|
|
134
145
|
// });
|
|
135
|
-
|
|
136
146
|
// it('Check readOnly works', () => {
|
|
137
147
|
// let renderedDOM = TestUtils.renderIntoDocument(
|
|
138
148
|
// <TextBox maxLength='100' placeHolder='Text Box' size='medium' variant='primary' value='Text Box Working' readOnly />
|
|
@@ -4,13 +4,15 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.propTypes = void 0;
|
|
7
|
+
|
|
7
8
|
var _propTypes2 = _interopRequireDefault(require("prop-types"));
|
|
9
|
+
|
|
8
10
|
var _propTypes;
|
|
11
|
+
|
|
9
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
10
|
-
|
|
11
|
-
function _defineProperty(obj, key, value) {
|
|
12
|
-
|
|
13
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
13
|
+
|
|
14
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
15
|
+
|
|
14
16
|
var propTypes = (_propTypes = {
|
|
15
17
|
autofocus: _propTypes2["default"].bool,
|
|
16
18
|
borderColor: _propTypes2["default"].oneOf(['transparent', 'default']),
|
|
@@ -1,39 +1,63 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports["default"] = void 0;
|
|
9
|
+
|
|
8
10
|
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
9
12
|
var _defaultProps = require("./props/defaultProps");
|
|
13
|
+
|
|
10
14
|
var _propTypes = require("./props/propTypes");
|
|
15
|
+
|
|
11
16
|
var _TextBox = _interopRequireDefault(require("../TextBox/TextBox"));
|
|
17
|
+
|
|
12
18
|
var _Layout = require("../Layout");
|
|
19
|
+
|
|
13
20
|
var _icons = require("@zohodesk/icons");
|
|
21
|
+
|
|
14
22
|
var _semanticButtonModule = _interopRequireDefault(require("../semantic/Button/semanticButton.module.css"));
|
|
23
|
+
|
|
15
24
|
var _TextBoxIconModule = _interopRequireDefault(require("./TextBoxIcon.module.css"));
|
|
25
|
+
|
|
16
26
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
27
|
+
|
|
17
28
|
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); }
|
|
29
|
+
|
|
18
30
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
19
|
-
|
|
31
|
+
|
|
32
|
+
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
33
|
+
|
|
20
34
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
21
|
-
|
|
22
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
35
|
+
|
|
23
36
|
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
|
37
|
+
|
|
24
38
|
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
|
39
|
+
|
|
25
40
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
41
|
+
|
|
26
42
|
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
|
|
43
|
+
|
|
27
44
|
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
|
45
|
+
|
|
28
46
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
47
|
+
|
|
29
48
|
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
|
49
|
+
|
|
30
50
|
/* eslint-disable react/forbid-component-props */
|
|
31
51
|
var TextBoxIcon = /*#__PURE__*/function (_React$Component) {
|
|
32
52
|
_inherits(TextBoxIcon, _React$Component);
|
|
53
|
+
|
|
33
54
|
var _super = _createSuper(TextBoxIcon);
|
|
55
|
+
|
|
34
56
|
function TextBoxIcon(props) {
|
|
35
57
|
var _this;
|
|
58
|
+
|
|
36
59
|
_classCallCheck(this, TextBoxIcon);
|
|
60
|
+
|
|
37
61
|
_this = _super.call(this, props);
|
|
38
62
|
_this.state = {
|
|
39
63
|
isActive: false
|
|
@@ -44,6 +68,7 @@ var TextBoxIcon = /*#__PURE__*/function (_React$Component) {
|
|
|
44
68
|
_this.handleClear = _this.handleClear.bind(_assertThisInitialized(_this));
|
|
45
69
|
return _this;
|
|
46
70
|
}
|
|
71
|
+
|
|
47
72
|
_createClass(TextBoxIcon, [{
|
|
48
73
|
key: "handleRef",
|
|
49
74
|
value: function handleRef(ele) {
|
|
@@ -64,9 +89,10 @@ var TextBoxIcon = /*#__PURE__*/function (_React$Component) {
|
|
|
64
89
|
key: "handleFocus",
|
|
65
90
|
value: function handleFocus(e) {
|
|
66
91
|
var _this$props = this.props,
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
92
|
+
onFocus = _this$props.onFocus,
|
|
93
|
+
needReadOnlyStyle = _this$props.needReadOnlyStyle,
|
|
94
|
+
isReadOnly = _this$props.isReadOnly;
|
|
95
|
+
|
|
70
96
|
if (!needReadOnlyStyle || !isReadOnly && needReadOnlyStyle) {
|
|
71
97
|
this.setState({
|
|
72
98
|
isActive: true
|
|
@@ -87,54 +113,54 @@ var TextBoxIcon = /*#__PURE__*/function (_React$Component) {
|
|
|
87
113
|
key: "render",
|
|
88
114
|
value: function render() {
|
|
89
115
|
var _this$props2 = this.props,
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
116
|
+
type = _this$props2.type,
|
|
117
|
+
name = _this$props2.name,
|
|
118
|
+
id = _this$props2.id,
|
|
119
|
+
maxLength = _this$props2.maxLength,
|
|
120
|
+
placeHolder = _this$props2.placeHolder,
|
|
121
|
+
size = _this$props2.size,
|
|
122
|
+
onKeyUp = _this$props2.onKeyUp,
|
|
123
|
+
isReadOnly = _this$props2.isReadOnly,
|
|
124
|
+
isDisabled = _this$props2.isDisabled,
|
|
125
|
+
children = _this$props2.children,
|
|
126
|
+
onKeyDown = _this$props2.onKeyDown,
|
|
127
|
+
onClick = _this$props2.onClick,
|
|
128
|
+
value = _this$props2.value,
|
|
129
|
+
iconRotated = _this$props2.iconRotated,
|
|
130
|
+
needBorder = _this$props2.needBorder,
|
|
131
|
+
variant = _this$props2.variant,
|
|
132
|
+
onClear = _this$props2.onClear,
|
|
133
|
+
onChange = _this$props2.onChange,
|
|
134
|
+
title = _this$props2.title,
|
|
135
|
+
dataId = _this$props2.dataId,
|
|
136
|
+
dataSelectorId = _this$props2.dataSelectorId,
|
|
137
|
+
needReadOnlyStyle = _this$props2.needReadOnlyStyle,
|
|
138
|
+
isClickable = _this$props2.isClickable,
|
|
139
|
+
needEffect = _this$props2.needEffect,
|
|
140
|
+
onKeyPress = _this$props2.onKeyPress,
|
|
141
|
+
borderColor = _this$props2.borderColor,
|
|
142
|
+
onMouseDown = _this$props2.onMouseDown,
|
|
143
|
+
showClearIcon = _this$props2.showClearIcon,
|
|
144
|
+
htmlId = _this$props2.htmlId,
|
|
145
|
+
i18nKeys = _this$props2.i18nKeys,
|
|
146
|
+
customClass = _this$props2.customClass,
|
|
147
|
+
iconOnHover = _this$props2.iconOnHover,
|
|
148
|
+
isFocus = _this$props2.isFocus,
|
|
149
|
+
onClearMouseDown = _this$props2.onClearMouseDown,
|
|
150
|
+
customProps = _this$props2.customProps;
|
|
125
151
|
var isActive = this.state.isActive;
|
|
126
152
|
var _customClass$customTB = customClass.customTBoxWrap,
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
153
|
+
customTBoxWrap = _customClass$customTB === void 0 ? '' : _customClass$customTB,
|
|
154
|
+
_customClass$customTe = customClass.customTextBox,
|
|
155
|
+
customTextBox = _customClass$customTe === void 0 ? '' : _customClass$customTe,
|
|
156
|
+
_customClass$customTB2 = customClass.customTBoxIcon,
|
|
157
|
+
customTBoxIcon = _customClass$customTB2 === void 0 ? '' : _customClass$customTB2,
|
|
158
|
+
_customClass$customTB3 = customClass.customTBoxLine,
|
|
159
|
+
customTBoxLine = _customClass$customTB3 === void 0 ? '' : _customClass$customTB3;
|
|
134
160
|
var _i18nKeys$clearText = i18nKeys.clearText,
|
|
135
|
-
|
|
161
|
+
clearText = _i18nKeys$clearText === void 0 ? 'Clear' : _i18nKeys$clearText;
|
|
136
162
|
var _customProps$TextBoxP = customProps.TextBoxProps,
|
|
137
|
-
|
|
163
|
+
TextBoxProps = _customProps$TextBoxP === void 0 ? {} : _customProps$TextBoxP;
|
|
138
164
|
return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
|
|
139
165
|
alignBox: "row",
|
|
140
166
|
isCover: false,
|
|
@@ -194,12 +220,13 @@ var TextBoxIcon = /*#__PURE__*/function (_React$Component) {
|
|
|
194
220
|
}));
|
|
195
221
|
}
|
|
196
222
|
}]);
|
|
223
|
+
|
|
197
224
|
return TextBoxIcon;
|
|
198
225
|
}(_react["default"].Component);
|
|
226
|
+
|
|
199
227
|
exports["default"] = TextBoxIcon;
|
|
200
228
|
TextBoxIcon.defaultProps = _defaultProps.defaultProps;
|
|
201
|
-
TextBoxIcon.propTypes = _propTypes.propTypes;
|
|
202
|
-
// if (__DOCS__) {
|
|
229
|
+
TextBoxIcon.propTypes = _propTypes.propTypes; // if (__DOCS__) {
|
|
203
230
|
// TextBoxIcon.docs = {
|
|
204
231
|
// componentGroup: 'Form Elements',
|
|
205
232
|
// folderName: 'Style Guide',
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
.varClass {
|
|
2
2
|
/* textboxicon default variables */
|
|
3
|
-
--textboxicon_line_height:
|
|
3
|
+
--textboxicon_line_height: var(--zd_size1);
|
|
4
4
|
--textboxicon_line_color: var(--zdt_textboxicon_default_line_bg);
|
|
5
5
|
|
|
6
6
|
/* textboxicon icon default variables */
|
|
@@ -35,19 +35,20 @@
|
|
|
35
35
|
}
|
|
36
36
|
.line {
|
|
37
37
|
position: absolute;
|
|
38
|
-
bottom: 0;
|
|
38
|
+
bottom: 0 ;
|
|
39
|
+
/* Variable:Ignore */
|
|
39
40
|
min-height: 1px;
|
|
40
41
|
transition: var(--zd_transition2);
|
|
41
42
|
height: var(--textboxicon_line_height);
|
|
42
43
|
transform: perspective(1px);
|
|
43
44
|
}
|
|
44
45
|
[dir=ltr] .line {
|
|
45
|
-
left: 0;
|
|
46
|
-
right: 0;
|
|
46
|
+
left: 0 ;
|
|
47
|
+
right: 0 ;
|
|
47
48
|
}
|
|
48
49
|
[dir=rtl] .line {
|
|
49
|
-
right: 0;
|
|
50
|
-
left: 0;
|
|
50
|
+
right: 0 ;
|
|
51
|
+
left: 0 ;
|
|
51
52
|
}
|
|
52
53
|
.line, .borderColor_default {
|
|
53
54
|
background-color: var(--textboxicon_line_color);
|
|
@@ -1,9 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _react = _interopRequireDefault(require("react"));
|
|
4
|
+
|
|
4
5
|
var _TextBoxIcon = _interopRequireDefault(require("../TextBoxIcon"));
|
|
6
|
+
|
|
5
7
|
var _reactTestRenderer = _interopRequireDefault(require("react-test-renderer"));
|
|
8
|
+
|
|
6
9
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
10
|
+
|
|
7
11
|
// children: PropTypes.node,
|
|
8
12
|
// disabled: PropTypes.bool,
|
|
9
13
|
// iconRotated: PropTypes.bool,
|
|
@@ -27,7 +31,6 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
|
|
|
27
31
|
// type: PropTypes.oneOf(['text', 'password', 'number']),
|
|
28
32
|
// value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
29
33
|
// variant: PropTypes.oneOf(['primary', 'secondary', 'default'])
|
|
30
|
-
|
|
31
34
|
describe('TextBoxIcon component', function () {
|
|
32
35
|
it('should display size small', function () {
|
|
33
36
|
var ele = _reactTestRenderer["default"].create( /*#__PURE__*/_react["default"].createElement(_TextBoxIcon["default"], {
|
|
@@ -36,6 +39,7 @@ describe('TextBoxIcon component', function () {
|
|
|
36
39
|
size: "small",
|
|
37
40
|
variant: "default"
|
|
38
41
|
}));
|
|
42
|
+
|
|
39
43
|
var tree = ele.toJSON();
|
|
40
44
|
expect(tree).toMatchSnapshot();
|
|
41
45
|
});
|
|
@@ -46,6 +50,7 @@ describe('TextBoxIcon component', function () {
|
|
|
46
50
|
size: "medium",
|
|
47
51
|
variant: "default"
|
|
48
52
|
}));
|
|
53
|
+
|
|
49
54
|
var tree = ele.toJSON();
|
|
50
55
|
expect(tree).toMatchSnapshot();
|
|
51
56
|
});
|
|
@@ -56,6 +61,7 @@ describe('TextBoxIcon component', function () {
|
|
|
56
61
|
size: "xmedium",
|
|
57
62
|
variant: "default"
|
|
58
63
|
}));
|
|
64
|
+
|
|
59
65
|
var tree = ele.toJSON();
|
|
60
66
|
expect(tree).toMatchSnapshot();
|
|
61
67
|
});
|
|
@@ -66,6 +72,7 @@ describe('TextBoxIcon component', function () {
|
|
|
66
72
|
size: "small",
|
|
67
73
|
variant: "primary"
|
|
68
74
|
}));
|
|
75
|
+
|
|
69
76
|
var tree = ele.toJSON();
|
|
70
77
|
expect(tree).toMatchSnapshot();
|
|
71
78
|
});
|
|
@@ -76,6 +83,7 @@ describe('TextBoxIcon component', function () {
|
|
|
76
83
|
size: "medium",
|
|
77
84
|
variant: "primary"
|
|
78
85
|
}));
|
|
86
|
+
|
|
79
87
|
var tree = ele.toJSON();
|
|
80
88
|
expect(tree).toMatchSnapshot();
|
|
81
89
|
});
|
|
@@ -86,6 +94,7 @@ describe('TextBoxIcon component', function () {
|
|
|
86
94
|
size: "xmedium",
|
|
87
95
|
variant: "primary"
|
|
88
96
|
}));
|
|
97
|
+
|
|
89
98
|
var tree = ele.toJSON();
|
|
90
99
|
expect(tree).toMatchSnapshot();
|
|
91
100
|
});
|
|
@@ -96,6 +105,7 @@ describe('TextBoxIcon component', function () {
|
|
|
96
105
|
size: "small",
|
|
97
106
|
variant: "secondary"
|
|
98
107
|
}));
|
|
108
|
+
|
|
99
109
|
var tree = ele.toJSON();
|
|
100
110
|
expect(tree).toMatchSnapshot();
|
|
101
111
|
});
|
|
@@ -106,6 +116,7 @@ describe('TextBoxIcon component', function () {
|
|
|
106
116
|
size: "medium",
|
|
107
117
|
variant: "secondary"
|
|
108
118
|
}));
|
|
119
|
+
|
|
109
120
|
var tree = ele.toJSON();
|
|
110
121
|
expect(tree).toMatchSnapshot();
|
|
111
122
|
});
|
|
@@ -116,6 +127,7 @@ describe('TextBoxIcon component', function () {
|
|
|
116
127
|
size: "xmedium",
|
|
117
128
|
variant: "secondary"
|
|
118
129
|
}));
|
|
130
|
+
|
|
119
131
|
var tree = ele.toJSON();
|
|
120
132
|
expect(tree).toMatchSnapshot();
|
|
121
133
|
});
|
|
@@ -138,9 +150,7 @@ describe('TextBoxIcon component', function () {
|
|
|
138
150
|
text: "Text Box Working"
|
|
139
151
|
}));
|
|
140
152
|
expect(TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'textBoxIcon').getAttribute('placeholder')).toMatch(/Text Box/);
|
|
141
|
-
});
|
|
142
|
-
|
|
143
|
-
// it('Check disabled works', () => {
|
|
153
|
+
}); // it('Check disabled works', () => {
|
|
144
154
|
// let renderedDOM = TestUtils.renderIntoDocument(
|
|
145
155
|
// <TextBoxIcon maxLength='100' placeHolder='Text Box' size='medium' variant='primary' value='Text Box Working' disabled />
|
|
146
156
|
// );
|
|
@@ -156,7 +166,6 @@ describe('TextBoxIcon component', function () {
|
|
|
156
166
|
// pass
|
|
157
167
|
// ).toBe(true);
|
|
158
168
|
// });
|
|
159
|
-
|
|
160
169
|
// it('Check readOnly works', () => {
|
|
161
170
|
// let renderedDOM = TestUtils.renderIntoDocument(
|
|
162
171
|
// <TextBoxIcon maxLength='100' placeHolder='Text Box' size='medium' variant='primary' value='Text Box Working' readOnly />
|
|
@@ -4,8 +4,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.propTypes = void 0;
|
|
7
|
+
|
|
7
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
+
|
|
8
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
11
|
+
|
|
9
12
|
var propTypes = {
|
|
10
13
|
borderColor: _propTypes["default"].oneOf(['transparent', 'default', 'error']),
|
|
11
14
|
children: _propTypes["default"].node,
|
package/lib/Textarea/Textarea.js
CHANGED
|
@@ -1,40 +1,61 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports["default"] = void 0;
|
|
9
|
+
|
|
8
10
|
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
9
12
|
var _defaultProps = require("./props/defaultProps");
|
|
13
|
+
|
|
10
14
|
var _propTypes = require("./props/propTypes");
|
|
15
|
+
|
|
11
16
|
var _TextareaModule = _interopRequireDefault(require("./Textarea.module.css"));
|
|
17
|
+
|
|
12
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
|
+
|
|
13
20
|
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); }
|
|
21
|
+
|
|
14
22
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
15
|
-
|
|
23
|
+
|
|
24
|
+
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
25
|
+
|
|
16
26
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
17
|
-
|
|
18
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
27
|
+
|
|
19
28
|
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
|
29
|
+
|
|
20
30
|
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
|
31
|
+
|
|
21
32
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
33
|
+
|
|
22
34
|
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
|
|
35
|
+
|
|
23
36
|
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
|
37
|
+
|
|
24
38
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
39
|
+
|
|
25
40
|
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
|
41
|
+
|
|
26
42
|
var Textarea = /*#__PURE__*/function (_React$Component) {
|
|
27
43
|
_inherits(Textarea, _React$Component);
|
|
44
|
+
|
|
28
45
|
var _super = _createSuper(Textarea);
|
|
46
|
+
|
|
29
47
|
function Textarea(props) {
|
|
30
48
|
var _this;
|
|
49
|
+
|
|
31
50
|
_classCallCheck(this, Textarea);
|
|
51
|
+
|
|
32
52
|
_this = _super.call(this, props);
|
|
33
53
|
_this.onChange = _this.onChange.bind(_assertThisInitialized(_this));
|
|
34
54
|
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
|
|
35
55
|
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
|
|
36
56
|
return _this;
|
|
37
57
|
}
|
|
58
|
+
|
|
38
59
|
_createClass(Textarea, [{
|
|
39
60
|
key: "onChange",
|
|
40
61
|
value: function onChange(e) {
|
|
@@ -59,30 +80,30 @@ var Textarea = /*#__PURE__*/function (_React$Component) {
|
|
|
59
80
|
key: "render",
|
|
60
81
|
value: function render() {
|
|
61
82
|
var _this$props = this.props,
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
83
|
+
size = _this$props.size,
|
|
84
|
+
placeHolder = _this$props.placeHolder,
|
|
85
|
+
needBorder = _this$props.needBorder,
|
|
86
|
+
text = _this$props.text,
|
|
87
|
+
isDisabled = _this$props.isDisabled,
|
|
88
|
+
resize = _this$props.resize,
|
|
89
|
+
maxLength = _this$props.maxLength,
|
|
90
|
+
animated = _this$props.animated,
|
|
91
|
+
variant = _this$props.variant,
|
|
92
|
+
getRef = _this$props.getRef,
|
|
93
|
+
onFocus = _this$props.onFocus,
|
|
94
|
+
dataId = _this$props.dataId,
|
|
95
|
+
dataSelectorId = _this$props.dataSelectorId,
|
|
96
|
+
isReadOnly = _this$props.isReadOnly,
|
|
97
|
+
needAppearance = _this$props.needAppearance,
|
|
98
|
+
needReadOnlyStyle = _this$props.needReadOnlyStyle,
|
|
99
|
+
borderColor = _this$props.borderColor,
|
|
100
|
+
needEffect = _this$props.needEffect,
|
|
101
|
+
autoFocus = _this$props.autoFocus,
|
|
102
|
+
htmlId = _this$props.htmlId,
|
|
103
|
+
a11y = _this$props.a11y,
|
|
104
|
+
customClass = _this$props.customClass;
|
|
84
105
|
var ariaLabel = a11y.ariaLabel,
|
|
85
|
-
|
|
106
|
+
ariaLabelledby = a11y.ariaLabelledby;
|
|
86
107
|
var resizes = {
|
|
87
108
|
horizontal: 'resizeX',
|
|
88
109
|
vertical: 'resizeY',
|
|
@@ -90,15 +111,19 @@ var Textarea = /*#__PURE__*/function (_React$Component) {
|
|
|
90
111
|
none: 'noresize'
|
|
91
112
|
};
|
|
92
113
|
var options = {};
|
|
114
|
+
|
|
93
115
|
if (isReadOnly) {
|
|
94
116
|
options.readOnly = 'readOnly';
|
|
95
117
|
}
|
|
118
|
+
|
|
96
119
|
if (isDisabled) {
|
|
97
120
|
options.disabled = 'disabled';
|
|
98
121
|
}
|
|
122
|
+
|
|
99
123
|
if (autoFocus) {
|
|
100
124
|
options.autoFocus = true;
|
|
101
125
|
}
|
|
126
|
+
|
|
102
127
|
var classList = needAppearance ? "".concat(_TextareaModule["default"].container, " ").concat(_TextareaModule["default"][size], " ").concat(_TextareaModule["default"][variant], " ").concat(needBorder ? _TextareaModule["default"].needBorder : _TextareaModule["default"].noBorder, " ").concat(resize ? _TextareaModule["default"][resizes[resize]] : _TextareaModule["default"][resizes.none], " ").concat(animated ? "".concat(_TextareaModule["default"]["".concat(size, "animated")]) : '', " ").concat(isDisabled && !needEffect || isReadOnly && !needEffect ? '' : _TextareaModule["default"].effect) : "".concat(_TextareaModule["default"].basic);
|
|
103
128
|
return /*#__PURE__*/_react["default"].createElement("textarea", _extends({
|
|
104
129
|
"aria-label": ariaLabel,
|
|
@@ -119,13 +144,13 @@ var Textarea = /*#__PURE__*/function (_React$Component) {
|
|
|
119
144
|
}));
|
|
120
145
|
}
|
|
121
146
|
}]);
|
|
147
|
+
|
|
122
148
|
return Textarea;
|
|
123
149
|
}(_react["default"].Component);
|
|
150
|
+
|
|
124
151
|
exports["default"] = Textarea;
|
|
125
152
|
Textarea.defaultProps = _defaultProps.defaultProps;
|
|
126
|
-
Textarea.propTypes = _propTypes.propTypes;
|
|
127
|
-
|
|
128
|
-
// if (__DOCS__) {
|
|
153
|
+
Textarea.propTypes = _propTypes.propTypes; // if (__DOCS__) {
|
|
129
154
|
// Textarea.docs = {
|
|
130
155
|
// componentGroup: 'Form Elements',
|
|
131
156
|
// folderName: 'Style Guide',
|