@zohodesk/dot 1.0.0-temp-98 → 1.0.0-temp-100

package/es/Drawer/Drawer.module.css

@@ -1,151 +1,151 @@
-.container {
-  transition: width var(--zd_transition3);
-  box-shadow: 0 6px 12px var(--zdt_drawer_default_box_shadow);
-  background-color: var(--zdt_drawer_default_bg);
-}
-.isOverlay {
-  top: 0;
-  bottom: 0;
-  position: absolute;
-  pointer-events: none;
-}
-[dir=ltr] .isOverlay {
-  right: 0;
-}
-[dir=rtl] .isOverlay {
-  left: 0;
-}
-.columns {
-  pointer-events: initial;
-}
-.drawerModal {
-  position: relative;
-}
-.secondDrawer {
-  background-color: var(--zdt_drawer_default_bg);
-  box-shadow: 0 6px 12px var(--zdt_drawer_default_box_shadow);
-}
-.secondMobDrawer {
-  position: absolute;
-  top: 0;
-  z-index: 1;
-}
-[dir=ltr] .secondMobDrawer {
-  right: 0;
-}
-[dir=rtl] .secondMobDrawer {
-  left: 0;
-}
-.mobModal {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-}
-[dir=ltr] .mobModal {
-  right: 0;
-  left: 0;
-}
-[dir=rtl] .mobModal {
-  left: 0;
-  right: 0;
-}
-.xsmall {
-  width: var(--zd_size360);
-}
-.small {
-  width: var(--zd_size410);
-}
-.medium {
-  width: var(--zd_size660);
-}
-.xmedium {
-  width: var(--zd_size730);
-}
-.large {
-  width: var(--zd_size936);
-}
-.xlarge {
-  width: var(--zd_size840);
-}
-.xxlarge {
-  width: var(--zd_size1142);
-}
-.mbleSize,
-.default {
-  width: 100%;
-}
-.header {
-  min-height: var(--zd_size50);
-  background-color: var(--zdt_drawer_header_bg);
-  border-bottom: solid 1px var(--zdt_drawer_header_border);
-  padding-top: var(--zd_size10);
-  padding-bottom: var(--zd_size10);
-}
-.subheader {
-  min-height: var(--zd_size28);
-}
-.title {
-  color: var( --zdt_drawer_title_text);
-  font: var(--zd_font_size16) var(--zd_semibold);
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
-}
-[dir=ltr] .title {
-  padding: 0 var(--zd_size10) 0 0;
-}
-[dir=rtl] .title {
-  padding: 0 0 0 var(--zd_size10);
-}
-[dir=ltr] .smallHeaderPadding {
-  padding-right: var(--zd_size11);
-  padding-left: var(--zd_size30);
-}
-[dir=rtl] .smallHeaderPadding {
-  padding-left: var(--zd_size11);
-  padding-right: var(--zd_size30);
-}
-[dir=ltr] .smallContentPadding {
-  padding-left: var(--zd_size30);
-  padding-right: var(--zd_size30);
-}
-[dir=rtl] .smallContentPadding {
-  padding-right: var(--zd_size30);
-  padding-left: var(--zd_size30);
-}
-[dir=ltr] .mediumHeaderPadding {
-  padding-right: var(--zd_size15);
-  padding-left: var(--zd_size30);
-}
-[dir=rtl] .mediumHeaderPadding {
-  padding-left: var(--zd_size15);
-  padding-right: var(--zd_size30);
-}
-[dir=ltr] .mediumContentPadding {
-  padding-left: var(--zd_size30);
-  padding-right: var(--zd_size30);
-}
-[dir=rtl] .mediumContentPadding {
-  padding-right: var(--zd_size30);
-  padding-left: var(--zd_size30);
-}
-[dir=ltr] .largeHeaderPadding {
-  padding-right: var(--zd_size15);
-  padding-left: var(--zd_size50);
-}
-[dir=rtl] .largeHeaderPadding {
-  padding-left: var(--zd_size15);
-  padding-right: var(--zd_size50);
-}
-[dir=ltr] .largeContentPadding {
-  padding-left: var(--zd_size50);
-  padding-right: var(--zd_size50);
-}
-[dir=rtl] .largeContentPadding {
-  padding-right: var(--zd_size50);
-  padding-left: var(--zd_size50);
-}
-[dir=ltr] .iconWrapper {
-  margin-right: var(--zd_size10);
-}
-[dir=rtl] .iconWrapper {
-  margin-left: var(--zd_size10);
-}
+.container {
+  transition: width var(--zd_transition3);
+  box-shadow: 0 6px 12px var(--zdt_drawer_default_box_shadow);
+  background-color: var(--zdt_drawer_default_bg);
+}
+.isOverlay {
+  top: 0;
+  bottom: 0;
+  position: absolute;
+  pointer-events: none;
+}
+[dir=ltr] .isOverlay {
+  right: 0;
+}
+[dir=rtl] .isOverlay {
+  left: 0;
+}
+.columns {
+  pointer-events: initial;
+}
+.drawerModal {
+  position: relative;
+}
+.secondDrawer {
+  background-color: var(--zdt_drawer_default_bg);
+  box-shadow: 0 6px 12px var(--zdt_drawer_default_box_shadow);
+}
+.secondMobDrawer {
+  position: absolute;
+  top: 0;
+  z-index: 1;
+}
+[dir=ltr] .secondMobDrawer {
+  right: 0;
+}
+[dir=rtl] .secondMobDrawer {
+  left: 0;
+}
+.mobModal {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+}
+[dir=ltr] .mobModal {
+  right: 0;
+  left: 0;
+}
+[dir=rtl] .mobModal {
+  left: 0;
+  right: 0;
+}
+.xsmall {
+  width: var(--zd_size360);
+}
+.small {
+  width: var(--zd_size410);
+}
+.medium {
+  width: var(--zd_size660);
+}
+.xmedium {
+  width: var(--zd_size730);
+}
+.large {
+  width: var(--zd_size936);
+}
+.xlarge {
+  width: var(--zd_size840);
+}
+.xxlarge {
+  width: var(--zd_size1142);
+}
+.mbleSize,
+.default {
+  width: 100%;
+}
+.header {
+  min-height: var(--zd_size50);
+  background-color: var(--zdt_drawer_header_bg);
+  border-bottom: solid 1px var(--zdt_drawer_header_border);
+  padding-top: var(--zd_size10);
+  padding-bottom: var(--zd_size10);
+}
+.subheader {
+  min-height: var(--zd_size28);
+}
+.title {
+  color: var( --zdt_drawer_title_text);
+  font: var(--zd_font_size16) var(--zd_semibold);
+  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+}
+[dir=ltr] .title {
+  padding: 0 var(--zd_size10) 0 0;
+}
+[dir=rtl] .title {
+  padding: 0 0 0 var(--zd_size10);
+}
+[dir=ltr] .smallHeaderPadding {
+  padding-right: var(--zd_size11);
+  padding-left: var(--zd_size30);
+}
+[dir=rtl] .smallHeaderPadding {
+  padding-left: var(--zd_size11);
+  padding-right: var(--zd_size30);
+}
+[dir=ltr] .smallContentPadding {
+  padding-left: var(--zd_size30);
+  padding-right: var(--zd_size30);
+}
+[dir=rtl] .smallContentPadding {
+  padding-right: var(--zd_size30);
+  padding-left: var(--zd_size30);
+}
+[dir=ltr] .mediumHeaderPadding {
+  padding-right: var(--zd_size15);
+  padding-left: var(--zd_size30);
+}
+[dir=rtl] .mediumHeaderPadding {
+  padding-left: var(--zd_size15);
+  padding-right: var(--zd_size30);
+}
+[dir=ltr] .mediumContentPadding {
+  padding-left: var(--zd_size30);
+  padding-right: var(--zd_size30);
+}
+[dir=rtl] .mediumContentPadding {
+  padding-right: var(--zd_size30);
+  padding-left: var(--zd_size30);
+}
+[dir=ltr] .largeHeaderPadding {
+  padding-right: var(--zd_size15);
+  padding-left: var(--zd_size50);
+}
+[dir=rtl] .largeHeaderPadding {
+  padding-left: var(--zd_size15);
+  padding-right: var(--zd_size50);
+}
+[dir=ltr] .largeContentPadding {
+  padding-left: var(--zd_size50);
+  padding-right: var(--zd_size50);
+}
+[dir=rtl] .largeContentPadding {
+  padding-right: var(--zd_size50);
+  padding-left: var(--zd_size50);
+}
+[dir=ltr] .iconWrapper {
+  margin-right: var(--zd_size10);
+}
+[dir=rtl] .iconWrapper {
+  margin-left: var(--zd_size10);
+}

package/es/Drawer/props/defaultProps.js

@@ -0,0 +1,20 @@
+export const Header_defaultProps = {
+  flexible: false,
+  paddingSize: 'small',
+  isBoxIcon: true
+};
+export const Footer_defaultProps = {
+  size: 'small'
+};
+export const Drawer_defaultProps = {
+  isActive: false,
+  palette: 'default',
+  responsiveId: 'Helmet',
+  size: 'small',
+  subDrawerSize: 'small',
+  subDrawerActive: false,
+  subDrawerClass: '',
+  customClass: '',
+  needAutoZindex: true,
+  onBodyClick: () => {}
+};

package/es/Drawer/props/propTypes.js

@@ -0,0 +1,49 @@
+import PropTypes from 'prop-types';
+export const Header_propTypes = {
+  children: PropTypes.node,
+  className: PropTypes.string,
+  closeTitle: PropTypes.string,
+  dataId: PropTypes.string,
+  flexible: PropTypes.bool,
+  getChildren: PropTypes.func,
+  iconName: PropTypes.string,
+  iconSize: PropTypes.string,
+  iconTitle: PropTypes.string,
+  isIconBold: PropTypes.bool,
+  onClose: PropTypes.func,
+  onIconClick: PropTypes.func,
+  paddingSize: PropTypes.oneOf(['small', 'medium', 'large']),
+  title: PropTypes.string,
+  isBoxIcon: PropTypes.bool,
+  getTitleChildren: PropTypes.func
+};
+export const Content_propTypes = {
+  children: PropTypes.node,
+  className: PropTypes.string,
+  eleRef: PropTypes.func,
+  paddingSize: PropTypes.oneOf(['small', 'medium', 'large'])
+};
+export const Footer_propTypes = {
+  children: PropTypes.node,
+  paddingLeftSize: PropTypes.string,
+  paddingRightClass: PropTypes.string,
+  size: PropTypes.string
+};
+export const Drawer_propTypes = {
+  children: PropTypes.node,
+  customClass: PropTypes.string,
+  forwardRef: PropTypes.object,
+  isActive: PropTypes.bool,
+  needAutoZindex: PropTypes.bool,
+  needFreeze: PropTypes.bool,
+  onBodyClick: PropTypes.func,
+  onClose: PropTypes.func,
+  paddingSize: PropTypes.oneOf(['small', 'medium', 'large']),
+  palette: PropTypes.oneOf(['dark', 'default', 'darkLight', 'plain']),
+  responsiveId: PropTypes.string,
+  size: PropTypes.oneOf(['small', 'xsmall', 'medium', 'xmedium', 'large', 'xlarge', 'xxlarge', 'default']),
+  subDrawerActive: PropTypes.bool,
+  subDrawerChildren: PropTypes.func,
+  subDrawerClass: PropTypes.string,
+  subDrawerSize: PropTypes.oneOf(['xsmall', 'small', 'medium'])
+};

package/es/ExternalLink/ExternalLink.js

@@ -2,7 +2,8 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 /**** Libraries ****/
 import React from 'react';
-import PropTypes from 'prop-types';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 /**** CSS ****/
 
 import style from './ExternalLink.module.css';
@@ -42,22 +43,8 @@ export default class ExternalLink extends React.Component {
   }
 
 }
-ExternalLink.defaultProps = {
-  rel: 'noopener noreferrer',
-  target: '_blank',
-  customProps: {}
-};
-ExternalLink.propTypes = {
-  children: PropTypes.node,
-  className: PropTypes.string,
-  dataId: PropTypes.string,
-  href: PropTypes.string,
-  rel: PropTypes.string,
-  target: PropTypes.oneOf(['_blank', '_self']),
-  title: PropTypes.string,
-  onClick: PropTypes.func,
-  customProps: PropTypes.object
-};
+ExternalLink.defaultProps = defaultProps;
+ExternalLink.propTypes = propTypes;
 
 if (false) {
   ExternalLink.docs = {

package/es/ExternalLink/ExternalLink.module.css

@@ -1,4 +1,4 @@
-.link {
-  text-decoration: none;
-  color: inherit
+.link {
+  text-decoration: none;
+  color: inherit
 }

package/es/ExternalLink/props/defaultProps.js

@@ -0,0 +1,5 @@
+export const defaultProps = {
+  rel: 'noopener noreferrer',
+  target: '_blank',
+  customProps: {}
+};

package/es/ExternalLink/props/propTypes.js

@@ -0,0 +1,12 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  children: PropTypes.node,
+  className: PropTypes.string,
+  dataId: PropTypes.string,
+  href: PropTypes.string,
+  rel: PropTypes.string,
+  target: PropTypes.oneOf(['_blank', '_self']),
+  title: PropTypes.string,
+  onClick: PropTypes.func,
+  customProps: PropTypes.object
+};

package/es/FlipCard/FlipCard.js

@@ -1,7 +1,8 @@
 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); }
 
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import AvatarUser from '../avatar/AvatarUser/AvatarUser';
 import AvatarIcon from '../avatar/AvatarIcon/AvatarIcon';
 import CheckBox from '@zohodesk/components/lib/CheckBox/CheckBox';
@@ -134,47 +135,8 @@ export default class FlipCard extends Component {
   }
 
 }
-FlipCard.propTypes = {
-  action: PropTypes.string,
-  channel: PropTypes.string,
-  channelTitle: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
-  className: PropTypes.string,
-  customTextClass: PropTypes.string,
-  dataId: PropTypes.string,
-  frontClass: PropTypes.string,
-  icon: PropTypes.string,
-  iconClass: PropTypes.string,
-  iconColor: PropTypes.string,
-  iconSize: PropTypes.string,
-  id: PropTypes.string.isRequired,
-  initial: PropTypes.string,
-  isChecked: PropTypes.bool,
-  isFilledCheckbox: PropTypes.bool,
-  isPaidUser: PropTypes.bool,
-  isPortalUser: PropTypes.bool,
-  name: PropTypes.string,
-  needTitle: PropTypes.bool,
-  noNeedFlip: PropTypes.bool,
-  onChange: PropTypes.func,
-  palette: PropTypes.oneOf(['primary', 'secondary', 'info', 'default']),
-  size: PropTypes.string,
-  src: PropTypes.string,
-  textPalette: PropTypes.oneOf(['white', 'black']),
-  ticList: PropTypes.string,
-  ticListContainer: PropTypes.string,
-  tourId: PropTypes.string,
-  customProps: PropTypes.shape({
-    CheckBoxProps: PropTypes.object,
-    ChannelIconProps: PropTypes.object,
-    AvatarIconProps: PropTypes.object,
-    AvatarUserProps: PropTypes.object
-  })
-};
-FlipCard.defaultProps = {
-  size: 'medium',
-  needTitle: true,
-  customProps: {}
-};
+FlipCard.propTypes = propTypes;
+FlipCard.defaultProps = defaultProps;
 
 if (false) {
   FlipCard.docs = {

package/es/FlipCard/FlipCard.module.css

@@ -1,44 +1,44 @@
-.flip,
-.flipNone {
-  color: var(--zdt_flipcard_default_text);
-}.flip, .flipNone {
-  background-color: var(--zdt_flipcard_default_bg);
-}
-.container {
-  position: relative;
-  transition: var(--zd_transition3) all;
-  transform-style: preserve-3d;
-}
-.container,
-.front,
-.back {
-  width: inherit;
-  height: inherit;
-}
-.front,
-.back {
-  position: absolute;
-  backface-visibility: hidden;
-  -webkit-backface-visibility: hidden;
-}
-[dir=ltr] .front {
-  transform: rotateY(180deg) perspective(1px);
-}
-[dir=rtl] .front {
-  transform: rotateY(-180deg) perspective(1px);
-}
-.back {
-  transform: rotateY(0deg) perspective(1px);
-}
-[dir=ltr] .notFlip .container {
-  transform: rotateY(180deg);
-}
-[dir=rtl] .notFlip .container {
-  transform: rotateY(-180deg);
-}
-[dir=ltr] .flip:hover .container, [dir=ltr] .hoverContainer:hover .container {
-  transform: rotateY(180deg);
-}
-[dir=rtl] .flip:hover .container, [dir=rtl] .hoverContainer:hover .container {
-  transform: rotateY(-180deg);
-}
+.flip,
+.flipNone {
+  color: var(--zdt_flipcard_default_text);
+}.flip, .flipNone {
+  background-color: var(--zdt_flipcard_default_bg);
+}
+.container {
+  position: relative;
+  transition: var(--zd_transition3) all;
+  transform-style: preserve-3d;
+}
+.container,
+.front,
+.back {
+  width: inherit;
+  height: inherit;
+}
+.front,
+.back {
+  position: absolute;
+  backface-visibility: hidden;
+  -webkit-backface-visibility: hidden;
+}
+[dir=ltr] .front {
+  transform: rotateY(180deg) perspective(1px);
+}
+[dir=rtl] .front {
+  transform: rotateY(-180deg) perspective(1px);
+}
+.back {
+  transform: rotateY(0deg) perspective(1px);
+}
+[dir=ltr] .notFlip .container {
+  transform: rotateY(180deg);
+}
+[dir=rtl] .notFlip .container {
+  transform: rotateY(-180deg);
+}
+[dir=ltr] .flip:hover .container, [dir=ltr] .hoverContainer:hover .container {
+  transform: rotateY(180deg);
+}
+[dir=rtl] .flip:hover .container, [dir=rtl] .hoverContainer:hover .container {
+  transform: rotateY(-180deg);
+}

package/es/FlipCard/props/defaultProps.js

@@ -0,0 +1,5 @@
+export const defaultProps = {
+  size: 'medium',
+  needTitle: true,
+  customProps: {}
+};

package/es/FlipCard/props/propTypes.js

@@ -0,0 +1,37 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  action: PropTypes.string,
+  channel: PropTypes.string,
+  channelTitle: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
+  className: PropTypes.string,
+  customTextClass: PropTypes.string,
+  dataId: PropTypes.string,
+  frontClass: PropTypes.string,
+  icon: PropTypes.string,
+  iconClass: PropTypes.string,
+  iconColor: PropTypes.string,
+  iconSize: PropTypes.string,
+  id: PropTypes.string.isRequired,
+  initial: PropTypes.string,
+  isChecked: PropTypes.bool,
+  isFilledCheckbox: PropTypes.bool,
+  isPaidUser: PropTypes.bool,
+  isPortalUser: PropTypes.bool,
+  name: PropTypes.string,
+  needTitle: PropTypes.bool,
+  noNeedFlip: PropTypes.bool,
+  onChange: PropTypes.func,
+  palette: PropTypes.oneOf(['primary', 'secondary', 'info', 'default']),
+  size: PropTypes.string,
+  src: PropTypes.string,
+  textPalette: PropTypes.oneOf(['white', 'black']),
+  ticList: PropTypes.string,
+  ticListContainer: PropTypes.string,
+  tourId: PropTypes.string,
+  customProps: PropTypes.shape({
+    CheckBoxProps: PropTypes.object,
+    ChannelIconProps: PropTypes.object,
+    AvatarIconProps: PropTypes.object,
+    AvatarUserProps: PropTypes.object
+  })
+};

package/es/FormAction/FormAction.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import PropTypes from 'prop-types';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import style from './FormAction.module.css';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
 export const LeftSide = props => {
@@ -44,7 +45,7 @@ export default class FormAction extends React.Component {
       alignBox: "row",
       isCover: false,
       align: hasCenterChild ? 'around' : hasRightChild && !hasLeftChild ? 'right' : null,
-      className: ` 
+      className: `
                         ${`${style.footerParent} ${hasCenterChild ? '' : style[`${paddingLeftSize ? paddingLeftSize : size}Padding`]} ${paddingRightClass}`}
 
                         ${style[`${size}Footer`]}
@@ -65,16 +66,8 @@ export default class FormAction extends React.Component {
   }
 
 }
-FormAction.propTypes = {
-  children: PropTypes.node,
-  paddingLeftSize: PropTypes.oneOf(['large', 'medium', 'xmedium', 'small', 'xsmall']),
-  paddingRightClass: PropTypes.string,
-  size: PropTypes.oneOf(['large', 'medium', 'small'])
-};
-FormAction.defaultProps = {
-  size: 'medium',
-  paddingRightClass: ''
-};
+FormAction.propTypes = propTypes;
+FormAction.defaultProps = defaultProps;
 
 if (false) {
   FormAction.docs = {