@zohodesk/components 1.0.0-temp-47 → 1.0.0-temp-48

package/es/Tag/docs/Tag__custom.docs.js

@@ -0,0 +1,368 @@
+import React, { Component } from 'react';
+import Tag from '../Tag';
+import Icon from '@zohodesk/icons/lib/Icon';
+import styles from '../../common/docStyle.module.css';
+export default class Tag__custom extends Component {
+  render() {
+    let style = {
+      margin: '10px'
+    },
+        titleStyle = {
+      fontSize: '13px',
+      padding: '15px 0',
+      textTransform: 'upperCase'
+    },
+        spanStyle = {
+      display: 'inline-block',
+      margin: '10px 10px 10px 0'
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      style: style
+    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Default Tag"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      tooltip: "Bharathi Kannan",
+      customClass: {
+        customTag: styles.customTag
+      }
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Active"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag
+      },
+      text: "Default",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      active: true
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Danger",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true,
+      active: true,
+      palette: "danger"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Secondary",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true,
+      active: true,
+      palette: "secondary"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose,
+        customAvatar: styles.tagAvatar
+      },
+      onRemove: () => {},
+      text: "Secondary Active",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true,
+      active: true,
+      palette: "secondary"
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Disabled"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.tagDisabled
+      },
+      text: "Bharathi",
+      disabled: true
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Icon Palette"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Default",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      active: true,
+      closePalette: "danger",
+      onRemove: () => {}
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Danger",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true,
+      active: true,
+      palette: "danger",
+      closePalette: "primary",
+      onRemove: () => {}
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Default",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      active: true,
+      closePalette: "danger",
+      onRemove: () => {}
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: "ZD-open",
+      isBold: true,
+      size: "10"
+    }))))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Palette"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Bharathi",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      palette: "default"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Bharathi",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true,
+      palette: "danger"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag
+      },
+      text: "Bharathi",
+      palette: "secondary"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag
+      },
+      text: "Bharathi",
+      palette: "pureDotted"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag
+      },
+      text: "Bharathi",
+      palette: "primaryDotted"
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Rounded"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Bharathi",
+      onRemove: () => {},
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Bharathi",
+      onRemove: () => {},
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Size"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Medium",
+      onRemove: () => {},
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      size: "medium"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Small",
+      onRemove: () => {},
+      initial: "SM",
+      hasAvatar: true,
+      size: "small"
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "With Avatar"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Bharathi",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Bharathi",
+      initial: "TT",
+      hasAvatar: true
+    })), /*#__PURE__*/React.createElement("span", {
+      style: {
+        marginRight: '10px'
+      }
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Bharathi",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      rounded: false
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customAvatar: styles.tagAvatar
+      },
+      text: "Bharathi",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "With Close"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose
+      },
+      text: "Desk",
+      onRemove: () => {}
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose
+      },
+      text: "Desk",
+      onRemove: () => {},
+      size: "small"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose
+      },
+      text: "Desk",
+      onRemove: () => {},
+      rounded: false
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose
+      },
+      text: "Desk",
+      onRemove: () => {},
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      closePalette: "primary"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose
+      },
+      text: "Bharathi",
+      palette: "pureDotted",
+      onRemove: () => {}
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      customClass: {
+        customTag: styles.customTag,
+        customTagClose: styles.customClose
+      },
+      text: "Bharathi",
+      palette: "primaryDotted",
+      onRemove: () => {}
+    })))));
+  }
+
+}
+
+if (false) {
+  Tag__custom.docs = {
+    componentGroup: 'Molecule',
+    folderName: 'Style Guide',
+    description: ' '
+  };
+}

package/es/Tag/docs/Tag__default.docs.js

@@ -0,0 +1,253 @@
+import React, { Component } from 'react';
+import Tag from '../Tag';
+import Icon from '@zohodesk/icons/lib/Icon';
+export default class Tag__default extends Component {
+  render() {
+    let style = {
+      margin: '10px'
+    },
+        titleStyle = {
+      fontSize: '13px',
+      padding: '15px 0',
+      textTransform: 'upperCase'
+    },
+        spanStyle = {
+      display: 'inline-block',
+      margin: '10px 10px 10px 0'
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      style: style
+    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Default Tag"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      tooltip: "Bharathi Kannan"
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Active"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Default",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      active: true
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Danger",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true,
+      active: true,
+      palette: "danger"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Secondary",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true,
+      active: true,
+      palette: "secondary"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      onRemove: () => {},
+      text: "Secondary Active",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true,
+      active: true,
+      palette: "secondary"
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Disabled"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      disabled: true
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Icon Palette"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Default",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      active: true,
+      closePalette: "danger",
+      onRemove: () => {}
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Danger",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true,
+      active: true,
+      palette: "danger",
+      closePalette: "primary",
+      onRemove: () => {}
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Default",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      active: true,
+      closePalette: "danger",
+      onRemove: () => {}
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: "ZD-open",
+      isBold: true,
+      size: "10"
+    }))))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Palette"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      palette: "default"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true,
+      palette: "danger"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      palette: "secondary"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      palette: "pureDotted"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      palette: "primaryDotted"
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Rounded"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      onRemove: () => {},
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      onRemove: () => {},
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "Size"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Medium",
+      onRemove: () => {},
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      size: "medium"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Small",
+      onRemove: () => {},
+      initial: "SM",
+      hasAvatar: true,
+      size: "small"
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "With Avatar"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      initial: "TT",
+      hasAvatar: true
+    })), /*#__PURE__*/React.createElement("span", {
+      style: {
+        marginRight: '10px'
+      }
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      rounded: false
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      rounded: false,
+      initial: "TT",
+      hasAvatar: true
+    })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+      style: titleStyle
+    }, "With Close"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Desk",
+      onRemove: () => {}
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Desk",
+      onRemove: () => {},
+      size: "small"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Desk",
+      onRemove: () => {},
+      rounded: false
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Desk",
+      onRemove: () => {},
+      imageURL: "https://iz.zohostatic.com/sites/default/files/styles/product-home-page/public/Desk-logo.png?itok=NW1geavh",
+      hasAvatar: true,
+      closePalette: "primary"
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      palette: "pureDotted",
+      onRemove: () => {}
+    })), /*#__PURE__*/React.createElement("span", {
+      style: spanStyle
+    }, /*#__PURE__*/React.createElement(Tag, {
+      text: "Bharathi",
+      palette: "primaryDotted",
+      onRemove: () => {}
+    })))));
+  }
+
+}
+
+if (false) {
+  Tag__default.docs = {
+    componentGroup: 'Molecule',
+    folderName: 'Style Guide',
+    description: ' '
+  };
+}

package/es/TextBox/__tests__/TextBox.spec.js

@@ -1,4 +1,3 @@
-import "core-js/modules/web.url.to-json";
 import React from 'react';
 import TextBox from '../TextBox';
 import renderer from 'react-test-renderer';

package/es/TextBox/docs/TextBox__custom.docs.js

@@ -0,0 +1,43 @@
+import React, { Component } from 'react';
+import TextBox from '../TextBox';
+import style from '../../common/docStyle.module.css';
+import CodeExtract from '@zohodesk/docstool/lib/CodeExtractor/CodeExtractor';
+export default class TextBox__custom extends Component {
+  render() {
+    return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("span", {
+      className: `${style.w350} ${style.docspan}`
+    }, /*#__PURE__*/React.createElement(CodeExtract, null, /*#__PURE__*/React.createElement(TextBox, {
+      name: "Test",
+      maxLength: 150,
+      placeHolder: "Input",
+      customClass: style.customTextBox
+    }), /*#__PURE__*/React.createElement(TextBox, {
+      name: "Test",
+      id: "Test",
+      maxLength: 150,
+      placeHolder: "readOnly",
+      isReadOnly: true,
+      needEffect: false,
+      value: "Readonly",
+      customClass: style.txtBoxReadOnly
+    }), /*#__PURE__*/React.createElement(TextBox, {
+      name: "Test",
+      id: "Test",
+      maxLength: 150,
+      placeHolder: "disabled",
+      isDisabled: true,
+      needEffect: false,
+      value: "Disabled",
+      customClass: style.customTextBox
+    }))));
+  }
+
+}
+
+if (false) {
+  TextBox__custom.docs = {
+    componentGroup: 'Form Elements',
+    folderName: 'Style Guide',
+    description: ' '
+  };
+}