@zohodesk/components 1.0.0-temp-70 → 1.0.0-temp-71

package/es/ResponsiveDropBox/ResponsiveDropBox.js

@@ -1,8 +1,7 @@
 function _extends() { _extends = Object.assign || 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); }
 
 import React, { Component } from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import PropTypes from 'prop-types';
 import DropBox from '../DropBox/DropBox';
 import { Container } from '../Layout';
 import { ResponsiveReceiver } from '../Responsive/CustomResponsive';
@@ -63,5 +62,13 @@ export default class ResponsiveDropBox extends Component {
   }
 
 }
-ResponsiveDropBox.propTypes = propTypes;
-ResponsiveDropBox.defaultProps = defaultProps;
+ResponsiveDropBox.propTypes = {
+  children: PropTypes.element,
+  customClass: PropTypes.object,
+  isResponsivePadding: PropTypes.bool,
+  alignBox: PropTypes.oneOf(['column', 'row'])
+};
+ResponsiveDropBox.defaultProps = {
+  isResponsivePadding: false,
+  alignBox: 'column'
+};

package/es/Ribbon/Ribbon.js

@@ -1,6 +1,5 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import PropTypes from 'prop-types';
 /* eslint css-modules/no-unused-class: [2, { markAsUsed: [default, flag, plain, ribbon, box, stamp, sticker, small, medium, large, xlarge, palette_default, palette_danger, palette_primary, palette_secondary, palette_info, palette_dark, plain_default, plain_danger, plain_primary, plain_secondary, plain_info, plain_dark, tag] }] */
 
 import style from './Ribbon.module.css';
@@ -31,8 +30,30 @@ export default class Ribbon extends React.Component {
   }
 
 }
-Ribbon.propTypes = propTypes;
-Ribbon.defaultProps = defaultProps;
+Ribbon.propTypes = {
+  children: PropTypes.element,
+  dataId: PropTypes.string,
+  palette: PropTypes.oneOf(['default', 'danger', 'primary', 'secondary', 'info', 'dark']),
+  size: PropTypes.oneOf(['small', 'medium', 'large', 'xlarge']),
+  text: PropTypes.string,
+  type: PropTypes.oneOf(['default', 'flag', 'plain', 'ribbon', 'box', 'stamp', 'sticker', 'tag']),
+  customClass: PropTypes.string
+}; // Ribbon.propTypesDescription = {
+//   text: ' ',
+//   type: ' ',
+//   children: ' ',
+//   palette: ' ',
+//   size: ' '
+// };
+
+Ribbon.defaultProps = {
+  palette: 'default',
+  size: 'large',
+  text: 'Ribbon',
+  type: 'default',
+  dataId: 'ribbonComp',
+  customClass: ''
+};
 
 if (false) {
   Ribbon.docs = {

package/es/Ribbon/Ribbon.module.css

@@ -11,35 +11,31 @@
   --ribbon_line_height: normal;
 
   /* flag ribbon default variable */
+  --ribbon_flag_border_width: var(--zd_size14) var(--zd_size12) var(--zd_size14) 0/*rtl: var(--zd_size14) 0 var(--zd_size14) var(--zd_size12)*/;
 
   /* tag ribbon default variables */
   --ribbon_tag_before_top: var(--zd_size3);
+  --ribbon_tag_before_border_width: 1px 0 0 1px/*rtl: 1px 1px 0 0*/;
   --ribbon_tag_before_border_style: solid;
   --ribbon_tag_before_border_color: var(--zdt_ribbon_default_tag_border);
   --ribbon_tag_before_width: var(--zd_size20);
   --ribbon_tag_before_height: var(--zd_size20);
   --ribbon_tag_before_left: calc(var(--zd_size10) * -1);
   --ribbon_tag_before_border_radius: 3px 0 0 0;
-}[dir=ltr] .varClass {
-  --ribbon_flag_border_width: var(--zd_size14) var(--zd_size12) var(--zd_size14) 0/*rtl: var(--zd_size14) 0 var(--zd_size14) var(--zd_size12)*/;
-  --ribbon_tag_before_border_width: 1px 0 0 1px/*rtl: 1px 1px 0 0*/;
-}[dir=rtl] .varClass {
-  --ribbon_flag_border_width: var(--zd_size14) 0 var(--zd_size14) var(--zd_size12);
-  --ribbon_tag_before_border_width: 1px 1px 0 0;
 }
 .basic {
   composes: varClass;
   position: relative;
+  padding: var(--ribbon_padding);
   color: var(--ribbon_text_color);
   text-transform: var(--ribbon_text_transform);
   font-size: var(--ribbon_font_size);
-  line-height: var(--ribbon_line_height);
-  padding: var(--ribbon_padding);
   background-color: var(--ribbon_bg_color);
   box-shadow: var(--ribbon_box_shadow);
   border-width: var(--ribbon_border_width);
   border-style: solid;
   border-color: var(--ribbon_border_color);
+  line-height: var(--ribbon_line_height);
 }
 .default,
 .flag,
@@ -53,11 +49,11 @@
 
 .default {
   composes: semibold from '../common/common.module.css';
+  text-align: center;
   display: block;
   --ribbon_padding: var(--zd_size5) var(--zd_size20);
   --ribbon_text_color: var(--zdt_ribbon_white_text);
   --ribbon_text_transform: uppercase;
-  text-align: center;
 }
 .small {
   --ribbon_font_size: var(--zd_font_size9);
@@ -172,36 +168,23 @@
 .flag {
   composes: dotted from '../common/common.module.css';
   display: block;
+  --ribbon_padding: var(--zd_size4) var(--zd_size24) var(--zd_size4) var(--zd_size6)/*rtl: var(--zd_size4) var(--zd_size6) var(--zd_size4) var(--zd_size24)*/;
   --ribbon_text_color: var(--zdt_ribbon_white_text);
   --ribbon_line_height: var(--zd_size20);
   --ribbon_text_transform: uppercase;
 }
-
-[dir=ltr] .flag {
-  --ribbon_padding: var(--zd_size4) var(--zd_size24) var(--zd_size4) var(--zd_size6)/*rtl: var(--zd_size4) var(--zd_size6) var(--zd_size4) var(--zd_size24)*/;
-}
-
-[dir=rtl] .flag {
-  --ribbon_padding: var(--zd_size4) var(--zd_size6) var(--zd_size4) var(--zd_size24);
-}
 .flag::after {
   position: absolute;
   top: -1px;
+  right: -1px;
   bottom: -1px;
   content: '';
   width: var(--zd_size12);
   border-style: solid;
-  transform: translateZ(0);
-  border-width: var(--ribbon_flag_border_width);
-}
-[dir=ltr] .flag::after {
-  right: -1px;
   border-color: var(--zdt_ribbon_flag_mirror_border) var(--zdt_ribbon_flag_white_border)
     var(--zdt_ribbon_flag_mirror_border) var(--zdt_ribbon_flag_mirror_border);
-}
-[dir=rtl] .flag::after {
-  left: -1px;
-  border-color: var(--zdt_ribbon_flag_mirror_border) var(--zdt_ribbon_flag_mirror_border)    var(--zdt_ribbon_flag_mirror_border) var(--zdt_ribbon_flag_white_border);
+  transform: translateZ(0);
+  border-width: var(--ribbon_flag_border_width);
 }
 .plain {
   display: inline-block;
@@ -210,11 +193,11 @@
 .ribbon {
   composes: semibold from '../common/common.module.css';
   display: block;
+  text-align: center;
   --ribbon_text_color: var(--zdt_ribbon_white_text);
   --ribbon_text_transform: uppercase;
   --ribbon_padding: var(--zd_size6) var(--zd_size10);
   --ribbon_line_height: var(--zd_size20);
-  text-align: center;
 }
 .ribbon::after,
 .ribbon::before {
@@ -223,81 +206,51 @@
   top: 100%;
   height: var(--zd_size10);
   width: var(--zd_size10);
-}
-.ribbon::after, .ribbon::before {
   border-style: solid;
   border-width: 5px;
-  background-color: inherit;
-}
-[dir=ltr] .ribbon::after, [dir=ltr] .ribbon::before {
   border-color: transparent transparent var(--zdt_ribbon_flag_white_border)
     var(--zdt_ribbon_flag_white_border);
+  background-color: inherit;
 }
-[dir=rtl] .ribbon::after, [dir=rtl] .ribbon::before {
-  border-color: transparent var(--zdt_ribbon_flag_white_border) var(--zdt_ribbon_flag_white_border)    transparent;
-}
-[dir=ltr] .ribbon::after {
+.ribbon::after {
   right: 0;
 }
-[dir=rtl] .ribbon::after {
-  left: 0;
-}
-[dir=ltr] .ribbon::before {
+.ribbon::before {
   left: 0;
   transform: rotateY(180deg);
 }
-[dir=rtl] .ribbon::before {
-  right: 0;
-  transform: rotateY(-180deg);
-}
 
 .tag {
   composes: semibold from '../common/common.module.css';
   display: inline-block;
-  height: var(--zd_size28);
   border-style: solid;
   border-color: var(--zdt_ribbon_default_tag_border);
-}
-
-[dir=ltr] .tag {
   border-width: 1px 1px 1px 0/*rtl: 1px 0 1px 1px*/;
   border-radius: 0 3px 3px 0/*rtl: 3px 0 0 3px*/;
   margin-left: var(--zd_size13);
+  height: var(--zd_size28);
   padding: var(--zd_size6) var(--zd_size8) var(--zd_size6) var(--zd_size5)/*rtl: var(--zd_size6) var(--zd_size5) var(--zd_size6) var(--zd_size8)*/;
 }
-
-[dir=rtl] .tag {
-  border-width: 1px 0 1px 1px;
-  border-radius: 3px 0 0 3px;
-  margin-right: var(--zd_size13);
-  padding: var(--zd_size6) var(--zd_size5) var(--zd_size6) var(--zd_size8);
-}
 .tag::before {
   position: absolute;
   content: '';
-  top: var(--ribbon_tag_before_top);
-  width: var(--ribbon_tag_before_width);
-  height: var(--ribbon_tag_before_height);
+  transform: rotate(-45deg);
   background-color: inherit;
+  top: var(--ribbon_tag_before_top);
   border-style: var(--ribbon_tag_before_border_style);
   border-color: var(--ribbon_tag_before_border_color);
   border-width: var(--ribbon_tag_before_border_width);
-  border-radius: var(--ribbon_tag_before_border_radius);
-}
-[dir=ltr] .tag::before {
-  transform: rotate(-45deg);
+  width: var(--ribbon_tag_before_width);
+  height: var(--ribbon_tag_before_height);
   left: var(--ribbon_tag_before_left);
-}
-[dir=rtl] .tag::before {
-  transform: rotate(45deg);
-  right: var(--ribbon_tag_before_left);
+  border-radius: var(--ribbon_tag_before_border_radius);
 }
 
 .box {
   display: inline-block;
+  border-radius: 3px;
   --ribbon_bg_color: var(--zdt_ribbon_white_bg);
   --ribbon_padding: var(--zd_size5) var(--zd_size8);
-  border-radius: 3px;
 }
 .stamp {
   display: inline-block;
@@ -306,15 +259,15 @@
 }
 .sticker {
   display: block;
-  height: var(--zd_size18);
-  line-height: var(--zd_size11);
-  --ribbon_text_color: var(--zdt_ribbon_white_text);
-  --ribbon_text_transform: uppercase;
   text-align: center;
   border-width: 1px 0;
   border-style: solid;
   border-color: var(--zdt_ribbon_flag_white_border);
+  height: var(--zd_size18);
   padding: var(--zd_size3) var(--zd_size10);
+  line-height: var(--zd_size11);
+  --ribbon_text_color: var(--zdt_ribbon_white_text);
+  --ribbon_text_transform: uppercase;
 }
 .after,
 .before {
@@ -323,18 +276,12 @@
   bottom: 0;
   width: var(--zd_size10);
 }
-[dir=ltr] .after {
+.after {
   right: calc(var(--zd_size2) * -1);
 }
-[dir=rtl] .after {
-  left: calc(var(--zd_size2) * -1);
-}
-[dir=ltr] .before {
+.before {
   left: calc(var(--zd_size8) * -1);
 }
-[dir=rtl] .before {
-  right: calc(var(--zd_size8) * -1);
-}
 .after::after,
 .after::before,
 .before::after,
@@ -343,15 +290,8 @@
   height: var(--zd_size7);
   width: var(--zd_size7);
   content: '';
-}
-.after::after, .after::before, .before::after, .before::before {
-  background-color: var(--zdt_ribbon_white_bg);
-}
-[dir=ltr] .after::after, [dir=ltr] .after::before, [dir=ltr] .before::after, [dir=ltr] .before::before {
   transform: rotate(45deg);
-}
-[dir=rtl] .after::after, [dir=rtl] .after::before, [dir=rtl] .before::after, [dir=rtl] .before::before {
-  transform: rotate(-45deg);
+  background-color: var(--zdt_ribbon_white_bg);
 }
 .after::after,
 .before::after {
@@ -363,15 +303,10 @@
 }
 .children {
   display: inline-block;
+  margin-right: var(--zd_size4);
   vertical-align: top;
   line-height: 0;
 }
-[dir=ltr] .children {
-  margin-right: var(--zd_size4);
-}
-[dir=rtl] .children {
-  margin-left: var(--zd_size4);
-}
 .childText {
   position: relative;
 }

package/es/RippleEffect/RippleEffect.js

@@ -1,6 +1,5 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import PropTypes from 'prop-types';
 import CssProvider from '../Provider/CssProvider';
 import style from './RippleEffect.module.css';
 export default function RippleEffect(props) {
@@ -20,8 +19,25 @@ export default function RippleEffect(props) {
     className: `${child.props.className || ''} ${className}`
   });
 }
-RippleEffect.defaultProps = defaultProps;
-RippleEffect.propTypes = propTypes;
+RippleEffect.defaultProps = {
+  isActive: false,
+  isDisabled: false,
+  isNeedEffect: true,
+  needBorder: true,
+  hoverType: 'default',
+  palette: 'default',
+  isCopyTextEnabled: false
+};
+RippleEffect.propTypes = {
+  children: PropTypes.node,
+  hoverType: PropTypes.oneOf(['default', 'border', 'bg']),
+  isActive: PropTypes.bool,
+  isDisabled: PropTypes.bool,
+  isNeedEffect: PropTypes.bool,
+  needBorder: PropTypes.bool,
+  palette: PropTypes.oneOf(['default', 'primary', 'primaryLight', 'primaryFilled', 'primaryDark', 'green', 'danger']),
+  isCopyTextEnabled: PropTypes.bool
+};
 
 if (false) {
   RippleEffect.docs = {

package/es/RippleEffect/RippleEffect.module.css

@@ -8,61 +8,67 @@
 .default.defaultHover {
   border-color: var(--zdt_rippleeffect_hover_border);
 }
-.hoverEffect:hover.primary.defaultHover, .hoverEffect:hover.primary.borderHover
-/* .hoverEffect:focus.primary.borderHover  */
-{
+.hoverEffect:hover.primary.defaultHover,
+.hoverEffect:focus.primary.defaultHover,
+.hoverEffect:hover.primary.borderHover,
+.hoverEffect:focus.primary.borderHover {
   border-color: var(--zdt_rippleeffect_primary_border);
 }
-.primary.defaultHover, .hoverEffect:hover.primary.active.border
-/* .hoverEffect:focus.primary.active.border  */
-{
+.primary.defaultHover,
+.hoverEffect:hover.primary.active.border,
+.hoverEffect:focus.primary.active.border {
   border-color: var(--zdt_rippleeffect_primary_active_border);
 }
-.primaryLight.defaultHover, .hoverEffect:hover.primaryLight.borderHover
-/* .hoverEffect:focus.primaryLight.borderHover  */
-{
+.primaryLight.defaultHover,
+.hoverEffect:hover.primaryLight.borderHover,
+.hoverEffect:focus.primaryLight.borderHover {
   border-color: var(--zdt_rippleeffect_primary_light_border);
 }
-.green.defaultHover, .hoverEffect:hover.green.borderHover
-/* .hoverEffect:focus.green.borderHover  */
-{
+.green.defaultHover,
+.hoverEffect:hover.green.borderHover,
+.hoverEffect:focus.green.borderHover {
   border-color: var(--zdt_rippleeffect_green_border);
 }
-.hoverEffect:hover.default.defaultHover
-/* .hoverEffect:focus.default.defaultHover */
- {
+.hoverEffect:hover.default.defaultHover,
+.hoverEffect:focus.default.defaultHover {
   border-color: var(--zdt_rippleeffect_slate_border);
 }
-.hoverEffect:hover.default.borderHover
-/* .hoverEffect:focus.default.borderHover */
- {
+.hoverEffect:hover.default.borderHover,
+.hoverEffect:focus.default.borderHover {
   border-color: var(--zdt_rippleeffect_navy_border);
 }
-.hoverEffect:hover.default.bgHover
-/* .hoverEffect:focus.default.bgHover */
- {
+.hoverEffect:hover.default.bgHover,
+.hoverEffect:focus.default.bgHover {
   background-color: var(--zdt_rippleeffect_hover_bg);
 }
-.hoverEffect:hover.primaryLight.bgHover
-/* .hoverEffect:focus.primaryLight.bgHover  */
-{
+.hoverEffect:hover.primaryLight.bgHover,
+.hoverEffect:focus.primaryLight.bgHover {
   background-color: var(--zdt_rippleeffect_primary_light_bg);
 }
 .primaryFilled {
   background-color: var(--zdt_rippleeffect_primary_bg);
 }
-.hoverEffect:hover.primaryFilled, .primaryFilled.active {
+.hoverEffect:hover.primaryFilled,
+.hoverEffect:focus.primaryFilled,
+.primaryFilled.active {
   background-color: var(--zdt_rippleeffect_primaryfilled_bg);
 }
-.hoverEffect:hover.green.bgHover
-/* .hoverEffect:focus.green.bgHover */
- {
+.hoverEffect:hover.green.bgHover,
+.hoverEffect:focus.green.bgHover {
   background-color: var(--zdt_rippleeffect_green_bg);
 }
-.default.active, .hoverEffect:hover.default.active, .primaryLight.active, .primaryDark.active {
+.default.active,
+.hoverEffect:hover.default.active,
+.hoverEffect:focus.default.active,
+.primaryLight.active,
+.primaryDark.active {
   background-color: var(--zdt_rippleeffect_primary_light_bg);
 }
-.default.active.border, .hoverEffect:hover.default.active.border, .primaryLight.active.border, .primaryDark.active.border {
+.default.active.border,
+.hoverEffect:hover.default.active.border,
+.hoverEffect:focus.default.active.border,
+.primaryLight.active.border,
+.primaryDark.active.border {
   border-color: var(--zdt_rippleeffect_primary_light_border);
 }
 .green.active {
@@ -74,17 +80,18 @@
 .primary.active {
   background-color: var(--zdt_rippleeffect_primary_bg);
 }
-.danger.defaultHover, .hoverEffect:hover.danger.borderHover
-/* .hoverEffect:focus.danger.borderHover */
- {
+.danger.defaultHover,
+.hoverEffect:hover.danger.borderHover,
+.hoverEffect:focus.danger.borderHover {
   border-color: var(--zdt_rippleeffect_danger_border);
 }
-.hoverEffect:hover.danger.bgHover, .danger.active {
+.hoverEffect:hover.danger.bgHover,
+.hoverEffect:focus.danger.bgHover,
+.danger.active {
   background-color: var(--zdt_rippleeffect_danger_bg);
 }
-.hoverEffect:hover.primaryDark.bgHover
-/* .hoverEffect:focus.primaryDark.bgHover */
- {
+.hoverEffect:hover.primaryDark.bgHover,
+.hoverEffect:focus.primaryDark.bgHover {
   background-color: var(--zdt_rippleeffect_primary_dark_bg);
 }
 .notAllowed {

package/es/Select/GroupSelect.js

@@ -1,7 +1,6 @@
 /**** Libraries ****/
 import React, { PureComponent } from 'react';
-import { GroupSelect_defaultProps } from './props/defaultProps';
-import { GroupSelect_propTypes } from './props/propTypes';
+import PropTypes from 'prop-types';
 /**** Components ****/
 
 import Popup from '../Popup/Popup';
@@ -774,8 +773,114 @@ export class GroupSelectComponent extends PureComponent {
   }
 
 }
-GroupSelectComponent.propTypes = GroupSelect_propTypes;
-GroupSelectComponent.defaultProps = GroupSelect_defaultProps;
+GroupSelectComponent.propTypes = {
+  groupedOptions: PropTypes.arrayOf(PropTypes.shape({
+    id: PropTypes.string.isRequired,
+    name: PropTypes.string.isRequired,
+    valueField: PropTypes.string,
+    textField: PropTypes.string,
+    options: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), PropTypes.arrayOf(PropTypes.shape({
+      id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+      text: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+    }))])
+  })),
+  selectedOption: PropTypes.shape({
+    groupId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    selected: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+  }),
+  emptyMessage: PropTypes.string.isRequired,
+  placeHolder: PropTypes.string,
+  onChange: PropTypes.func.isRequired,
+  onKeyDown: PropTypes.func,
+  searchBoxPlaceHolder: PropTypes.string,
+  needSearch: PropTypes.bool,
+  searchEmptyMessage: PropTypes.string,
+  getRef: PropTypes.func,
+  isDisabled: PropTypes.bool,
+  isReadOnly: PropTypes.bool,
+  needSelectDownIcon: PropTypes.bool,
+  isPopupOpenOnEnter: PropTypes.bool,
+  maxLength: PropTypes.string,
+  needBorder: PropTypes.bool,
+  autoSelectOnType: PropTypes.bool,
+  autoSelectDebouneTime: PropTypes.number,
+  dataId: PropTypes.string,
+  dataIdSlctComp: PropTypes.string,
+  dataIdDownIcon: PropTypes.string,
+  dataIdSrchEmptyMsg: PropTypes.string,
+  isNextOptions: PropTypes.bool,
+  getNextOptions: PropTypes.func,
+  searchDebounceTime: PropTypes.func,
+  needLocalSearch: PropTypes.bool,
+  onSearch: PropTypes.func,
+  isSearchClearOnClose: PropTypes.bool,
+  animationStyle: PropTypes.string,
+  dropBoxSize: PropTypes.oneOf(['small', 'medium', 'large']),
+  defaultDropBoxPosition: PropTypes.oneOf(['bottom', 'top', 'left', 'right']),
+  isAnimate: PropTypes.bool,
+  onFocus: PropTypes.func,
+  size: PropTypes.oneOf(['medium', 'xmedium']),
+  textBoxSize: PropTypes.oneOf(['small', 'medium', 'xmedium']),
+  title: PropTypes.string,
+  variant: PropTypes.string,
+  needResponsive: PropTypes.bool,
+  className: PropTypes.string,
+  textBoxVariant: PropTypes.string,
+  searchBoxSize: PropTypes.string,
+  borderColor: PropTypes.oneOf(['transparent', 'default']),
+  needTick: PropTypes.bool,
+  children: PropTypes.node,
+  getFooter: PropTypes.func,
+  htmlId: PropTypes.string,
+  iconOnHover: PropTypes.bool,
+
+  /**** Popup Props ****/
+  isPopupOpen: PropTypes.bool,
+  isPopupReady: PropTypes.bool,
+  togglePopup: PropTypes.func,
+  getTargetRef: PropTypes.func,
+  getContainerRef: PropTypes.func,
+  closePopupOnly: PropTypes.func,
+  position: PropTypes.string,
+  removeClose: PropTypes.func,
+  i18nKeys: PropTypes.shape({
+    loadingText: PropTypes.string,
+    emptyText: PropTypes.string,
+    noMoreText: PropTypes.string,
+    searchEmptyText: PropTypes.string
+  })
+};
+GroupSelectComponent.defaultProps = {
+  animationStyle: 'bounce',
+  defaultDropBoxPosition: 'bottom',
+  dropBoxSize: 'small',
+  isDefaultSelectValue: true,
+  isDisabled: false,
+  isReadOnly: false,
+  needBorder: true,
+  needSearch: false,
+  needSelectDownIcon: true,
+  placeHolder: '',
+  searchBoxPlaceHolder: 'Search',
+  searchBoxSize: 'small',
+  size: 'medium',
+  textBoxSize: 'medium',
+  textBoxVariant: 'default',
+  textField: 'text',
+  valueField: 'id',
+  autoSelectOnType: true,
+  dataIdSlctComp: 'selectComponent',
+  dataIdDownIcon: 'downIcon',
+  dataIdLoading: 'loading',
+  dataIdSrchEmptyMsg: 'searchEmptyMessage',
+  isPopupOpenOnEnter: false,
+  borderColor: 'default',
+  needTick: true,
+  needLocalSearch: true,
+  isSearchClearOnClose: true,
+  i18nKeys: {},
+  iconOnHover: false
+};
 GroupSelectComponent.displayName = 'GroupSelect';
 let GroupSelect = Popup(GroupSelectComponent);
 GroupSelect.defaultProps = GroupSelectComponent.defaultProps;