@zohodesk/dot 1.0.0-temp-60 → 1.0.0-temp-63

package/lib/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css

@@ -5,20 +5,27 @@
     composes: varClass;
     min-height: var(--zd_size54);
     position: relative;
+    color: var(--zdt_desktopnotification_text);
     background-color: var(--alert_lookup_bg_color);
     border-style: solid;
     border-color: var(--commonalert_border_color);
     border-width: 2px 0 0 0;
-    color: var(--zdt_desktopnotification_text);
   }
   
   .title {
-    margin: 0 var(--zd_size5) 0 var(--zd_size10);
     font-size: var(--zd_font_size18);
     line-height: var(--zd_size22);
     font-family: var(--zd_bold);
     composes: ftsmooth wbreak from '~@zohodesk/components/lib/common/common.module.css';
   }
+  
+  [dir=ltr] .title {
+  margin: 0 var(--zd_size5) 0 var(--zd_size10);
+  }
+  
+  [dir=rtl] .title {
+    margin: 0 var(--zd_size10) 0 var(--zd_size5);
+  }
 
   .infoText {
     font-size: var(--zd_font_size14);
@@ -50,8 +57,11 @@
 
 
 /* Primary Header */
-.primary {
-    padding: var(--zd_size15) var(--zd_size45) 0 var(--zd_size20);
+[dir=ltr] .primary {
+  padding: var(--zd_size15) var(--zd_size45) 0 var(--zd_size20);
+}
+[dir=rtl] .primary {
+    padding: var(--zd_size15) var(--zd_size20) 0 var(--zd_size45);
 }
 
 .primary .iconContainer {
@@ -66,14 +76,26 @@
   .primary .close {
     position: absolute;
     top: var(--zd_size12);
-    right: var(--zd_size12);
+  }
+  
+  [dir=ltr] .primary .close {
+  right: var(--zd_size12);
+  }
+  
+  [dir=rtl] .primary .close {
+    left: var(--zd_size12);
   }
 
   /* Secondary Header */
   .secondary {
-    padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
-    border-radius: 0 0 var(--zd_size10) var(--zd_size10);
     composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
+    border-radius: 0 0 var(--zd_size10) var(--zd_size10);
+  }
+  [dir=ltr] .secondary {
+  padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
+  }
+  [dir=rtl] .secondary {
+    padding: var(--zd_size18) var(--zd_size75) var(--zd_size19) var(--zd_size70);
   }
 
   .secondary .infoText {
@@ -86,15 +108,30 @@
     position: absolute;
     top: 0;
     bottom: 0;
-    left: var(--zd_size18);
     margin: auto 0;
   }
 
+  [dir=ltr] .secondary .iconContainer {
+  left: var(--zd_size18);
+  }
+
+  [dir=rtl] .secondary .iconContainer {
+    right: var(--zd_size18);
+  }
+
   .secondary .close {
     position: absolute;
     top: 0;
     bottom: 0;
-    right: var(--zd_size12);
-    margin: auto 0 auto var(--zd_size25);
     height: var(--zd_size25);
+  }
+
+  [dir=ltr] .secondary .close {
+  right: var(--zd_size12);
+  margin: auto 0 auto var(--zd_size25);
+  }
+
+  [dir=rtl] .secondary .close {
+    left: var(--zd_size12);
+    margin: auto var(--zd_size25) auto 0;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/dot",
-  "version": "1.0.0-temp-60",
+  "version": "1.0.0-temp-63",
   "main": "lib/index",
   "module": "es/index.js",
   "jsnext:main": "es/index.js",
@@ -31,21 +31,21 @@
   "dependencies": {},
   "devDependencies": {
     "velocity-react": "^1.4.3",
-    "@zohodesk/variables": "1.0.0-beta.28",
+    "@zohodesk/variables": "1.0.0-beta.29",
     "@zohodesk/i18n": "^1.0.0-beta.7",
-    "@zohodesk/components": "1.0.0-alpha-224",
-    "@zohodesk/icons": "1.0.0-beta.85",
-    "@zohodesk/svg": "1.0.0-beta.38",
+    "@zohodesk/components": "1.0.0-alpha-227",
+    "@zohodesk/icons": "1.0.0-beta.92",
+    "@zohodesk/svg": "1.0.0-beta.41",
     "@zohodesk/virtualizer": "1.0.3",
     "react-sortable-hoc": "^0.8.3"
   },
   "peerDependencies": {
     "velocity-react": "^1.4.3",
-    "@zohodesk/variables": "^1.0.0-beta.28",
+    "@zohodesk/variables": "^1.0.0-beta.29",
     "@zohodesk/i18n": "^1.0.0-beta.7",
-    "@zohodesk/components": "1.0.0-alpha-224",
+    "@zohodesk/components": "1.0.0-alpha-227",
     "@zohodesk/icons": "^1.0.0-beta.85",
-    "@zohodesk/svg": "^1.0.0-beta.38"
+    "@zohodesk/svg": "1.0.0-beta.41"
   },
   "react-cli": {
     "preprocessor": {

package/build/Unusedfiles.json

@@ -1 +0,0 @@
-["/Users/bharathi-zt93/git/library/jsapps/dot/src/actions/index.js","/Users/bharathi-zt93/git/library/jsapps/dot/src/form/fields/CurrencyField/CurrencyField.js","/Users/bharathi-zt93/git/library/jsapps/dot/src/form/fields/RadioField/RadioField.js","/Users/bharathi-zt93/git/library/jsapps/dot/src/list/BluePrintStatus/BluePrintStatus.js","/Users/bharathi-zt93/git/library/jsapps/dot/src/list/BluePrintStatus/BluePrintStatus.module.css","/Users/bharathi-zt93/git/library/jsapps/dot/src/list/DepartmentDropDown/DepartmentDropDown.js","/Users/bharathi-zt93/git/library/jsapps/dot/src/list/DepartmentDropDown/DepartmentDropDown.module.css","/Users/bharathi-zt93/git/library/jsapps/dot/src/list/Icons/AddNewIcon.js","/Users/bharathi-zt93/git/library/jsapps/dot/src/list/Icons/CompleteIcon.js","/Users/bharathi-zt93/git/library/jsapps/dot/src/lookup/header/Close/LookupClose.module.css","/Users/bharathi-zt93/git/library/jsapps/dot/src/version2/alertIcons/ErrorAlertIcon.js","/Users/bharathi-zt93/git/library/jsapps/dot/src/version2/lookup/alertLookupCommonNew.module.css"]

package/es/ActionButton/docs/ActionButton__default.docs.js

@@ -1,134 +0,0 @@
-import React from 'react';
-import ActionButton from '../ActionButton';
-export default class ActionButton__default extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      text: "Reply",
-      size: "small"
-    })), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      text: "Reply",
-      size: "medium"
-    })), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      text: "Reply",
-      size: "large"
-    })), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      text: "Reply",
-      size: "large",
-      isLoading: true
-    })), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      iconName: "ZD-replyall",
-      iconSize: "9",
-      onClick: () => '',
-      dropdownChildren: 'children',
-      dropBoxPosition: "bottomRight",
-      size: "small",
-      isDisabled: true
-    })), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      text: "Reply all",
-      iconName: "ZD-replyall",
-      iconSize: "9",
-      onClick: () => '',
-      dropBoxPosition: "bottomRight",
-      size: "small"
-    }, "children")), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      text: "Reply all",
-      iconName: "ZD-replyall",
-      iconSize: "9",
-      onClick: () => '',
-      dropBoxPosition: "bottomRight",
-      size: "small",
-      onHover: true
-    }, "children")), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      text: "Reply all",
-      iconName: "ZD-replyall",
-      iconSize: "9",
-      dropBoxPosition: "bottomRight",
-      size: "small",
-      onHover: true
-    }, "children")), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      text: "Reply all",
-      iconName: "ZD-replyall",
-      iconSize: "9",
-      dropBoxPosition: "bottomRight",
-      size: "small"
-    }, "children")), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      text: "Comment",
-      subText: "Public"
-    })), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px',
-        display: 'inline-block'
-      }
-    }, /*#__PURE__*/React.createElement(ActionButton, {
-      text: "Reply all",
-      iconName: "ZD-replyall",
-      iconSize: "9",
-      onClick: () => '',
-      dropBoxPosition: "bottomRight",
-      size: "small",
-      palette: "primary"
-    }, "children")), /*#__PURE__*/React.createElement("div", {
-      style: {
-        margin: '20px'
-      }
-    }));
-  }
-
-}
-ActionButton__default.docs = {
-  componentGroup: 'Atom'
-};

package/es/AlphabeticList/docs/AlphabeticList__default.docs.js

@@ -1,34 +0,0 @@
-/*** Libraries ***/
-import React, { Component } from 'react';
-/*** Components ***/
-
-import AlphabeticList from '../AlphabeticList';
-export default class AlphabeticList__default extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      selectedCharacter: 'C'
-    };
-    this.handleSelect = this.handleSelect.bind(this);
-  }
-
-  handleSelect(selectedCharacter) {
-    this.setState({
-      selectedCharacter
-    });
-  }
-
-  render() {
-    let {
-      selectedCharacter
-    } = this.state;
-    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(AlphabeticList, {
-      selectedCharacter: selectedCharacter,
-      onSelect: this.handleSelect
-    }));
-  }
-
-}
-AlphabeticList__default.docs = {
-  componentGroup: 'Atom'
-};

package/es/AlphabeticList/docs/AlphabeticList__horizontal.docs.js

@@ -1,43 +0,0 @@
-/*** Libraries ***/
-import React, { Component } from 'react';
-/*** Components ***/
-
-import AlphabeticList from '../AlphabeticList';
-export default class AlphabeticList__horizontal extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      selectedCharacter: 'C'
-    };
-    this.handleSelect = this.handleSelect.bind(this);
-  }
-
-  handleSelect(selectedCharacter) {
-    this.setState({
-      selectedCharacter
-    });
-  }
-
-  render() {
-    let {
-      selectedCharacter
-    } = this.state;
-    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(AlphabeticList, {
-      selectedCharacter: selectedCharacter,
-      onSelect: this.handleSelect,
-      align: "horizontal"
-    }), /*#__PURE__*/React.createElement(AlphabeticList, {
-      type: "numerals",
-      selectedCharacter: selectedCharacter,
-      onSelect: this.handleSelect,
-      align: "horizontal"
-    }));
-  }
-
-}
-
-if (false) {
-  AlphabeticList__horizontal.docs = {
-    componentGroup: 'Atom'
-  };
-}

package/es/Appearance/dark/themes/orange/orangeDarkDotTheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='dark'][data-theme='orange'] {
-	/* freezelayer */
-	--zdt_freezelayer_darklight_bg: rgba(27, 33, 43, 0.9);
-	
-	/* common empty state */
-	--zdt_commonEmptyState_dark_title: var(--dot_white);
-	--zdt_commonEmptyState_dark_description: var(--dot_white);
-	--zdt_commonEmptyState_dark_link: #ff801f;
-	--zdt_commonEmptyState_dark_link_hover: #a85100;
-}

package/es/Attachment/docs/Attachment__default.docs.js

@@ -1,54 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import Attachment from '../Attachment';
-export default class Attachment__default extends React.Component {
-  render() {
-    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Attachment, {
-      fileName: "20993016_1413168518775205_8593331352042442533_n.jpg",
-      fileSize: "31.5 KB",
-      downloadLink: "https://d1ydxa2xvtn0b5.cloudfront.net/app/images/smartapplogo.c9bf244c1c797161b30a.png",
-      tooltip: "Attachment",
-      iconName: "ZD-filePicture",
-      fileInfo: "2 days ago"
-    }), /*#__PURE__*/React.createElement(Attachment, {
-      fileName: "20993016_1413168518775205_8593331352042442533_n.jpg",
-      fileSize: "31.5 KB",
-      downloadLink: "https://d1ydxa2xvtn0b5.cloudfront.net/app/images/smartapplogo.c9bf244c1c797161b30a.png",
-      tooltip: "Attachment",
-      iconName: "ZD-filePicture"
-    }), /*#__PURE__*/React.createElement(Attachment, {
-      fileName: "20993016_1413168518775205_8593331352042442533_n.jpg",
-      downloadLink: "https://d1ydxa2xvtn0b5.cloudfront.net/app/images/smartapplogo.c9bf244c1c797161b30a.png",
-      tooltip: "Attachment",
-      iconName: "ZD-filePicture"
-    }), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Attachment, {
-      fileName: "20993016_1413168518775205_8593331352042442533_n.jpg",
-      fileSize: "31.5 KB",
-      downloadLink: "https://d1ydxa2xvtn0b5.cloudfront.net/app/images/smartapplogo.c9bf244c1c797161b30a.png",
-      tooltip: "Attachment",
-      iconName: "ZD-filePicture",
-      size: "small",
-      fileInfo: "15 days ago"
-    }), /*#__PURE__*/React.createElement(Attachment, {
-      fileName: "20993016_1413168518775205_8593331352042442533_n.jpg",
-      fileSize: "31.5 KB",
-      downloadLink: "https://d1ydxa2xvtn0b5.cloudfront.net/app/images/smartapplogo.c9bf244c1c797161b30a.png",
-      tooltip: "Attachment",
-      iconName: "ZD-filePicture",
-      size: "small"
-    }), /*#__PURE__*/React.createElement(Attachment, {
-      fileName: "20993016_1413168518775205_8593331352042442533_n.jpg",
-      downloadLink: "https://d1ydxa2xvtn0b5.cloudfront.net/app/images/smartapplogo.c9bf244c1c797161b30a.png",
-      tooltip: "Attachment",
-      iconName: "ZD-filePicture",
-      size: "small"
-    }));
-  }
-
-}
-
-if (false) {
-  Attachment__default.docs = {
-    componentGroup: 'Attachment'
-  };
-}

package/es/ChannelIcon/docs/ChannelIcon__default.docs.js

@@ -1,57 +0,0 @@
-import React, { Component } from 'react';
-import ChannelIcon from '../ChannelIcon';
-import { getChannelMappingObj } from '../../utils/ChannelIconMapping';
-import { Container, Box } from '@zohodesk/components/lib/Layout';
-export default class ChannelIcon__default extends Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    let boxStyle = {},
-        style = {
-      border: '1px solid #c3c1c1',
-      padding: '10px',
-      margin: '1px 10px',
-      textAlign: 'center'
-    },
-        titleStyle = {
-      'font-size': '13px',
-      'padding-bottom': '5px',
-      'border-bottom': '1px solid #c3c1c1',
-      margin: '10px 0 5px',
-      textAlign: 'center'
-    };
-    let channels = getChannelMappingObj();
-    return /*#__PURE__*/React.createElement(Container, null, Object.keys(channels).map((item, i) => /*#__PURE__*/React.createElement(Box, {
-      key: i,
-      scroll: "none",
-      style: {
-        padding: '5px'
-      }
-    }, /*#__PURE__*/React.createElement("p", {
-      style: titleStyle
-    }, item), /*#__PURE__*/React.createElement(Container, {
-      alignBox: "row",
-      align: "vertical",
-      isCover: false,
-      wrap: "wrap"
-    }, Object.keys(channels[item]).map((channel, j) => /*#__PURE__*/React.createElement(Box, {
-      flexible: true,
-      style: style,
-      key: j
-    }, /*#__PURE__*/React.createElement("h6", null, channel), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ChannelIcon, {
-      name: item,
-      action: channel,
-      iconSize: "21",
-      size: "medium"
-    }))))))), /*#__PURE__*/React.createElement("br", null));
-  }
-
-}
-
-if (false) {
-  ChannelIcon__default.docs = {
-    componentGroup: 'Atom'
-  };
-}

package/es/Drawer/docs/Drawer__default.docs.js

@@ -1,87 +0,0 @@
-import React from 'react';
-import Drawer, { Header, Content, Footer } from '../Drawer';
-import Button from '@zohodesk/components/lib/Button/Button';
-import style from '../Drawer.module.css';
-export default class Drawer__default extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      isActive: true,
-      size: 'xsmall'
-    };
-    this.onClose = this.onClose.bind(this);
-    this.getFooter = this.getFooter.bind();
-  }
-
-  onClose() {
-    this.setState({
-      isActive: false
-    });
-  }
-
-  changeSize(drawersize) {
-    this.setState({
-      size: drawersize
-    });
-  }
-
-  getFooter() {
-    return /*#__PURE__*/React.createElement("p", null, "getChildren");
-  }
-
-  render() {
-    let {
-      isActive,
-      size
-    } = this.state;
-    return /*#__PURE__*/React.createElement(Drawer, {
-      isActive: isActive,
-      needFreeze: false,
-      paddingSize: "small",
-      size: size
-    }, /*#__PURE__*/React.createElement(Header, {
-      title: "Add Component",
-      onClose: this.onClose,
-      iconName: "ZD-zdDuetimeQueueNew",
-      iconSize: "15",
-      align: "column",
-      getChildren: this.getFooter
-    }, /*#__PURE__*/React.createElement("span", null, "children")), /*#__PURE__*/React.createElement(Content, {
-      className: style.headerTest
-    }, /*#__PURE__*/React.createElement(Button, {
-      text: "small",
-      onClick: this.changeSize.bind(this, 'small')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xsmall",
-      onClick: this.changeSize.bind(this, 'xsmall')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "medium",
-      onClick: this.changeSize.bind(this, 'medium')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xmedium",
-      onClick: this.changeSize.bind(this, 'xmedium')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "large",
-      onClick: this.changeSize.bind(this, 'large')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xlarge",
-      onClick: this.changeSize.bind(this, 'xlarge')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xxlarge",
-      onClick: this.changeSize.bind(this, 'xxlarge')
-    })), /*#__PURE__*/React.createElement(Footer, null, /*#__PURE__*/React.createElement(Button, {
-      text: "Save",
-      palette: "primaryFilled"
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "Cancel",
-      palette: "secondary"
-    })));
-  }
-
-}
-
-if (false) {
-  Drawer__default.docs = {
-    componentGroup: 'Template'
-  };
-}

package/es/Drawer/docs/Drawer__multiDrawer.docs.js

@@ -1,112 +0,0 @@
-import React from 'react';
-import Drawer, { Header, Content } from '../Drawer';
-import Button from '@zohodesk/components/lib/Button/Button';
-import style from '../Drawer.module.css';
-export default class Drawer__multiDrawer extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      isActive: true,
-      subDrawerActive: true,
-      size: 'xsmall'
-    };
-    this.onClose = this.onClose.bind(this);
-    this.openSecondDrawer = this.openSecondDrawer.bind(this);
-    this.closeDrawers = this.closeDrawers.bind(this);
-    this.closeSubDrawer = this.closeSubDrawer.bind(this);
-    this.subDrawerChildren = this.subDrawerChildren.bind(this);
-  }
-
-  onClose() {
-    this.setState({
-      isActive: false
-    });
-  }
-
-  openSecondDrawer() {
-    this.setState({
-      subDrawerActive: true
-    });
-  }
-
-  closeDrawers() {
-    this.setState({
-      isActive: false
-    });
-  }
-
-  closeSubDrawer() {
-    this.setState({
-      subDrawerActive: false
-    });
-  }
-
-  changeSize(drawersize) {
-    this.setState({
-      size: drawersize
-    });
-  }
-
-  subDrawerChildren() {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
-      title: "Second Drawer",
-      onClose: this.closeSubDrawer
-    }), /*#__PURE__*/React.createElement(Content, {
-      paddingSize: "small"
-    }, /*#__PURE__*/React.createElement("div", null, "Hi, I am Second Drawer Content Area")));
-  }
-
-  render() {
-    let {
-      isActive,
-      subDrawerActive,
-      size
-    } = this.state;
-    return /*#__PURE__*/React.createElement(Drawer, {
-      isActive: isActive,
-      needFreeze: true,
-      paddingSize: "small",
-      subDrawerActive: subDrawerActive,
-      subDrawerSize: "small",
-      onClose: this.closeDrawers,
-      subDrawerChildren: this.subDrawerChildren(),
-      size: size,
-      needAutoZindex: true
-    }, /*#__PURE__*/React.createElement(Header, {
-      title: "First Drawer",
-      onClose: this.onClose
-    }), /*#__PURE__*/React.createElement(Content, {
-      className: style.headerTest
-    }, /*#__PURE__*/React.createElement("div", {
-      onClick: this.openSecondDrawer
-    }, "Click here to Open Second Drawer ..:-)"), /*#__PURE__*/React.createElement(Button, {
-      text: "small",
-      onClick: this.changeSize.bind(this, 'small')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xsmall",
-      onClick: this.changeSize.bind(this, 'xsmall')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "medium",
-      onClick: this.changeSize.bind(this, 'medium')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xmedium",
-      onClick: this.changeSize.bind(this, 'xmedium')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "large",
-      onClick: this.changeSize.bind(this, 'large')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xlarge",
-      onClick: this.changeSize.bind(this, 'xlarge')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xxlarge",
-      onClick: this.changeSize.bind(this, 'xxlarge')
-    })));
-  }
-
-}
-
-if (false) {
-  Drawer__multiDrawer.docs = {
-    componentGroup: 'Template'
-  };
-}