@zohodesk/dot 1.4.9 → 1.4.11

package/es/v1/form/fields/ValidationMessage/ValidationMessage.js

@@ -5,50 +5,50 @@ import Label from '@zohodesk/components/es/v1/Label/Label';
 import colors from '@zohodesk/components/es/Label/LabelColors.module.css';
 import style from '../../../../form/fields/ValidationMessage/ValidationMessage.module.css';
 import { Icon } from '@zohodesk/icons';
-export default class ValidationMessage extends React.Component {
-  render() {
-    let {
-      palette,
-      text,
-      htmlFor,
-      onClick,
-      type,
-      size,
-      dataId,
-      clipped,
-      a11y,
-      tooltip,
-      dataSelectorId
-    } = this.props;
-    let {
-      role = 'alert'
-    } = a11y;
-    return /*#__PURE__*/React.createElement("div", {
-      role: role,
-      onClick: onClick,
-      className: `${type === 'primary' ? style.primary : style.secondary}`,
-      "data-id": "errorMsgContainer",
-      "data-test-id": "errorMsgContainer",
-      "data-selector-id": dataSelectorId
-    }, /*#__PURE__*/React.createElement(Label, {
-      text: text,
-      htmlFor: htmlFor,
-      palette: palette,
-      size: size,
-      dataId: dataId,
-      clipped: clipped,
-      title: clipped ? text : '',
-      customClass: style.lable
-    }), tooltip ? /*#__PURE__*/React.createElement("span", {
-      className: `${style.icon} ${colors[palette]}`,
-      "data-title": tooltip
-    }, /*#__PURE__*/React.createElement(Icon, {
-      name: "ZD-information57",
-      size: "14"
-    })) : null);
-  }
 
-}
+const ValidationMessage = props => {
+  const {
+    palette,
+    text,
+    htmlFor,
+    onClick,
+    type,
+    size,
+    dataId,
+    clipped,
+    a11y,
+    tooltip,
+    dataSelectorId
+  } = props;
+  const {
+    role = 'alert'
+  } = a11y;
+  return /*#__PURE__*/React.createElement("div", {
+    role: role,
+    onClick: onClick,
+    className: `${type === 'primary' ? style.primary : style.secondary}`,
+    "data-id": "errorMsgContainer",
+    "data-test-id": "errorMsgContainer",
+    "data-selector-id": dataSelectorId
+  }, /*#__PURE__*/React.createElement(Label, {
+    text: text,
+    htmlFor: htmlFor,
+    palette: palette,
+    size: size,
+    dataId: dataId,
+    clipped: clipped,
+    title: clipped ? text : '',
+    customClass: style.lable
+  }), tooltip ? /*#__PURE__*/React.createElement("span", {
+    className: `${style.icon} ${colors[palette]}`,
+    "data-title": tooltip
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: "ZD-information57",
+    size: "14"
+  })) : null);
+};
+
+export default ValidationMessage;
 ValidationMessage.propTypes = propTypes;
 ValidationMessage.defaultProps = defaultProps; // if (__DOCS__) {
 //   ValidationMessage.docs = {

package/es/v1/form/layout/Field/Field.js

@@ -1,33 +1,29 @@
-import React, { Component } from 'react';
+import React from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 import style from '../../../../form/layout/Field/Field.module.css';
-export default class Field extends Component {
-  render() {
-    let {
-      width,
-      children,
-      rowBreak,
-      column,
-      className,
-      containerClass,
-      dataId
-    } = this.props;
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-      className: `${containerClass ? containerClass : ''} ${column == 'single' ? `${style.singleColumn}` : `${style[width]} `}`,
-      "data-id": dataId,
-      "data-test-id": dataId
-    }, /*#__PURE__*/React.createElement("div", {
-      className: `${className ? className : ''} ${`fieldWidth_${width}`}`
-    }, children)), rowBreak && /*#__PURE__*/React.createElement("div", {
-      className: style.rowBreak
-    }));
-  }
 
-}
+const Field = props => {
+  const {
+    width,
+    children,
+    rowBreak,
+    column,
+    className,
+    containerClass,
+    dataId
+  } = props;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: `${containerClass ? containerClass : ''} ${column == 'single' ? `${style.singleColumn}` : `${style[width]} `}`,
+    "data-id": dataId,
+    "data-test-id": dataId
+  }, /*#__PURE__*/React.createElement("div", {
+    className: `${className ? className : ''} ${`fieldWidth_${width}`}`
+  }, children)), rowBreak && /*#__PURE__*/React.createElement("div", {
+    className: style.rowBreak
+  }));
+};
+
 Field.propTypes = propTypes;
-Field.defaultProps = defaultProps; // if (__DOCS__) {
-//   Field.docs = {
-//     componentGroup: 'ModuleAddForm'
-//   };
-// }
+Field.defaultProps = defaultProps;
+export default Field;

package/es/v1/form/layout/Section/Section.js

@@ -1,37 +1,30 @@
-import React, { Component } from 'react';
+import React from 'react';
 import { propTypes } from './props/propTypes';
 import style from '../../../../form/layout/Section/ModuleFormSection.module.css';
-export default class Section extends Component {
-  constructor(props) {
-    super(props);
-  }
 
-  render() {
-    let {
-      title,
-      dataId,
-      containerClass,
-      titleClass,
-      className,
-      column,
-      formName
-    } = this.props;
-    return /*#__PURE__*/React.createElement("div", {
-      "data-id": dataId,
-      "data-test-id": dataId,
-      className: containerClass ? containerClass : ''
-    }, title && /*#__PURE__*/React.createElement("div", {
-      className: titleClass ? titleClass : ''
-    }, title), /*#__PURE__*/React.createElement("div", {
-      className: `${className ? className : ''} ${column == 'single' ? style.singleColumn : ''}`,
-      "data-id": formName && formName,
-      "data-test-id": formName && formName
-    }, this.props.children));
-  }
+const Section = props => {
+  const {
+    title,
+    dataId,
+    containerClass,
+    titleClass,
+    className,
+    column,
+    formName,
+    children
+  } = props;
+  return /*#__PURE__*/React.createElement("div", {
+    "data-id": dataId,
+    "data-test-id": dataId,
+    className: containerClass ? containerClass : ''
+  }, title && /*#__PURE__*/React.createElement("div", {
+    className: titleClass ? titleClass : ''
+  }, title), /*#__PURE__*/React.createElement("div", {
+    className: `${className ? className : ''} ${column == 'single' ? style.singleColumn : ''}`,
+    "data-id": formName && formName,
+    "data-test-id": formName && formName
+  }, children));
+};
 
-}
-Section.propTypes = propTypes; // if (__DOCS__) {
-//   Section.docs = {
-//     componentGroup: 'ModuleAddForm'
-//   };
-// }
+export default Section;
+Section.propTypes = propTypes;

package/es/v1/list/Subject/Subject.js

@@ -1,57 +1,48 @@
 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 React from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 import Link from '../../Link/Link';
 import style from '../../../list/Subject/Subject.module.css';
-export default class Subject extends Component {
-  constructor(props) {
-    super(props);
-  }
 
-  render() {
-    let {
-      text,
-      dataId,
-      urlName,
-      href,
-      urlData,
-      onClick,
-      isLink,
-      target,
-      fontWeight,
-      className,
-      isDotted,
-      children,
-      customProps
-    } = this.props;
-    let {
-      LinkProps = {},
-      TextProps = {}
-    } = customProps;
-    return /*#__PURE__*/React.createElement(React.Fragment, null, isLink ? /*#__PURE__*/React.createElement(Link, _extends({
-      urlName: urlName,
-      href: href,
-      urlData: urlData,
-      onClick: onClick,
-      className: `${style.subject} ${isDotted ? style.dotted : ''} ${className} ${style[`font_${fontWeight}`]} ${style.cursorPointer}`,
-      dataId: dataId,
-      title: text,
-      target: target
-    }, LinkProps), children ? children : text) : /*#__PURE__*/React.createElement("span", _extends({
-      className: `${style.subject} ${isDotted ? style.dotted : ''} ${className} ${style[`font_${fontWeight}`]}`,
-      "data-title": text,
-      "data-id": dataId,
-      "data-test-id": dataId
-    }, TextProps), text));
-  }
+const Subject = props => {
+  const {
+    text,
+    dataId,
+    urlName,
+    href,
+    urlData,
+    onClick,
+    isLink,
+    target,
+    fontWeight,
+    className,
+    isDotted,
+    children,
+    customProps
+  } = props;
+  const {
+    LinkProps = {},
+    TextProps = {}
+  } = customProps;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, isLink ? /*#__PURE__*/React.createElement(Link, _extends({
+    urlName: urlName,
+    href: href,
+    urlData: urlData,
+    onClick: onClick,
+    className: `${style.subject} ${isDotted ? style.dotted : ''} ${className} ${style[`font_${fontWeight}`]} ${style.cursorPointer}`,
+    dataId: dataId,
+    title: text,
+    target: target
+  }, LinkProps), children ? children : text) : /*#__PURE__*/React.createElement("span", _extends({
+    className: `${style.subject} ${isDotted ? style.dotted : ''} ${className} ${style[`font_${fontWeight}`]}`,
+    "data-title": text,
+    "data-id": dataId,
+    "data-test-id": dataId
+  }, TextProps), text));
+};
 
-}
+export default Subject;
 Subject.propTypes = propTypes;
-Subject.defaultProps = defaultProps; // if (__DOCS__) {
-//   Subject.docs = {
-//     folderName: 'List',
-//     componentGroup: 'Subject'
-//   };
-// }
+Subject.defaultProps = defaultProps;

package/es/v1/list/TagNew/TagNew.js

@@ -1,33 +1,24 @@
-import React, { Component } from 'react';
+import React from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 import style from '../../../list/TagNew/TagNew.module.css';
-export default class TagNew extends Component {
-  constructor(props) {
-    super(props);
-  }
 
-  render() {
-    let {
-      className,
-      text,
-      animate,
-      onClick,
-      dataId
-    } = this.props;
-    return /*#__PURE__*/React.createElement("div", {
-      className: `${style.tagStyle} ${animate ? style.bounceIn : ''} ${className ? className : ''}`,
-      onClick: onClick,
-      "data-id": dataId,
-      "data-test-id": dataId
-    }, text);
-  }
+const TagNew = props => {
+  const {
+    className,
+    text,
+    animate,
+    onClick,
+    dataId
+  } = props;
+  return /*#__PURE__*/React.createElement("div", {
+    className: `${style.tagStyle} ${animate ? style.bounceIn : ''} ${className ? className : ''}`,
+    onClick: onClick,
+    "data-id": dataId,
+    "data-test-id": dataId
+  }, text);
+};
 
-}
+export default TagNew;
 TagNew.propTypes = propTypes;
-TagNew.defaultProps = defaultProps; // if (__DOCS__) {
-//   TagNew.docs = {
-//     folderName: 'List',
-//     componentGroup: 'TagNew'
-//   };
-// }
+TagNew.defaultProps = defaultProps;

package/es/v1/list/Thread/Thread.js

@@ -1,43 +1,34 @@
-import React, { Component } from 'react';
+import React from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 import { Icon } from '@zohodesk/icons';
 import Button from '@zohodesk/components/es/v1/semantic/Button/Button';
 import style from '../../../list/Thread/Thread.module.css';
-export default class Thread extends Component {
-  constructor(props) {
-    super(props);
-  }
 
-  render() {
-    let {
-      count: threadCount,
-      className,
-      iconTitle,
-      dataId,
-      align
-    } = this.props;
-    let count = threadCount === '0' ? '1' : threadCount;
-    return /*#__PURE__*/React.createElement(Button, {
-      customClass: `${style.container} ${style[`align_${align}`]} ${className}`,
-      title: iconTitle,
-      dataId: dataId,
-      a11y: {
-        ariaLabel: iconTitle
-      }
-    }, /*#__PURE__*/React.createElement(Icon, {
-      name: "ZD-TK-thread",
-      size: "9"
-    }), /*#__PURE__*/React.createElement("span", {
-      className: style.count
-    }, count));
-  }
+const Thread = props => {
+  const {
+    count: threadCount,
+    className,
+    iconTitle,
+    dataId,
+    align
+  } = props;
+  const count = threadCount === '0' ? '1' : threadCount;
+  return /*#__PURE__*/React.createElement(Button, {
+    customClass: `${style.container} ${style[`align_${align}`]} ${className}`,
+    title: iconTitle,
+    dataId: dataId,
+    a11y: {
+      ariaLabel: iconTitle
+    }
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: "ZD-TK-thread",
+    size: "9"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: style.count
+  }, count));
+};
 
-}
+export default Thread;
 Thread.propTypes = propTypes;
-Thread.defaultProps = defaultProps; // if (__DOCS__) {
-//   Thread.docs = {
-//     folderName: 'List',
-//     componentGroup: 'Thread'
-//   };
-// }
+Thread.defaultProps = defaultProps;

package/lib/NewStar/NewStar.module.css

@@ -2,6 +2,7 @@
   position: absolute;
   height: var(--zd_size20) ;
   width: var(--zd_size21) ;
+  pointer-events: none;
 }
 .topLeft {
   top: 0 ;
@@ -90,73 +91,133 @@
   animation-delay: 1s;
 }
 
-.topLeft .starOne{top:0 }
-
-[dir=ltr] .topLeft .starOne{
-  left:0 }
-
-[dir=rtl] .topLeft .starOne{right:0 }
-.topLeft .starTwo{top:0 
-  /*  Variable:Ignore  */}
-[dir=ltr] .topLeft .starTwo{
-  left:var(--zd_size10) }
-[dir=rtl] .topLeft .starTwo{right:var(--zd_size10) }
-.topLeft .starThree{
-  /*  Variable:Ignore  */top:10px}
-[dir=ltr] .topLeft .starThree{
-  left:0 }
-[dir=rtl] .topLeft .starThree{right:0 }
-
-.topRight .starOne{top:0 }
-
-[dir=ltr] .topRight .starOne{
-  right:0 }
-
-[dir=rtl] .topRight .starOne{left:0 }
-.topRight .starTwo{top:0 
-  /*  Variable:Ignore  */}
-[dir=ltr] .topRight .starTwo{
-  right:var(--zd_size10) }
-[dir=rtl] .topRight .starTwo{left:var(--zd_size10) }
-.topRight .starThree{
-  /*  Variable:Ignore  */top:10px}
-[dir=ltr] .topRight .starThree{
-  right:0 }
-[dir=rtl] .topRight .starThree{left:0 }
-
-.bottomLeft .starOne{bottom:0 }
-
-[dir=ltr] .bottomLeft .starOne{
-  left:0 }
-
-[dir=rtl] .bottomLeft .starOne{right:0 }
-.bottomLeft .starTwo{bottom:0 
-  /*  Variable:Ignore  */}
-[dir=ltr] .bottomLeft .starTwo{
-  left:var(--zd_size10) }
-[dir=rtl] .bottomLeft .starTwo{right:var(--zd_size10) }
-.bottomLeft .starThree{
-  /*  Variable:Ignore  */bottom:10px}
-[dir=ltr] .bottomLeft .starThree{
-  left:0 }
-[dir=rtl] .bottomLeft .starThree{right:0 }
-
-.bottomRight .starOne{bottom:0 }
-
-[dir=ltr] .bottomRight .starOne{
-  right:0 }
-
-[dir=rtl] .bottomRight .starOne{left:0 }
-.bottomRight .starTwo{bottom:0 
-  /*  Variable:Ignore  */}
-[dir=ltr] .bottomRight .starTwo{
-  right:var(--zd_size10) }
-[dir=rtl] .bottomRight .starTwo{left:var(--zd_size10) }
-.bottomRight .starThree{
-  /*  Variable:Ignore  */bottom:10px}
-[dir=ltr] .bottomRight .starThree{
-  right:0 }
-[dir=rtl] .bottomRight .starThree{left:0 }
+.topLeft .starOne {
+  top: 0 ;
+}
+
+[dir=ltr] .topLeft .starOne {
+  left: 0 ;
+}
+
+[dir=rtl] .topLeft .starOne {
+  right: 0 ;
+}
+.topLeft .starTwo {
+  top: 0 ;
+  /*  Variable:Ignore  */
+}
+[dir=ltr] .topLeft .starTwo {
+  left: var(--zd_size10) ;
+}
+[dir=rtl] .topLeft .starTwo {
+  right: var(--zd_size10) ;
+}
+.topLeft .starThree {
+  /*  Variable:Ignore  */
+  top: 10px;
+}
+[dir=ltr] .topLeft .starThree {
+  left: 0 ;
+}
+[dir=rtl] .topLeft .starThree {
+  right: 0 ;
+}
+
+.topRight .starOne {
+  top: 0 ;
+}
+
+[dir=ltr] .topRight .starOne {
+  right: 0 ;
+}
+
+[dir=rtl] .topRight .starOne {
+  left: 0 ;
+}
+.topRight .starTwo {
+  top: 0 ;
+  /*  Variable:Ignore  */
+}
+[dir=ltr] .topRight .starTwo {
+  right: var(--zd_size10) ;
+}
+[dir=rtl] .topRight .starTwo {
+  left: var(--zd_size10) ;
+}
+.topRight .starThree {
+  /*  Variable:Ignore  */
+  top: 10px;
+}
+[dir=ltr] .topRight .starThree {
+  right: 0 ;
+}
+[dir=rtl] .topRight .starThree {
+  left: 0 ;
+}
+
+.bottomLeft .starOne {
+  bottom: 0 ;
+}
+
+[dir=ltr] .bottomLeft .starOne {
+  left: 0 ;
+}
+
+[dir=rtl] .bottomLeft .starOne {
+  right: 0 ;
+}
+.bottomLeft .starTwo {
+  bottom: 0 ;
+  /*  Variable:Ignore  */
+}
+[dir=ltr] .bottomLeft .starTwo {
+  left: var(--zd_size10) ;
+}
+[dir=rtl] .bottomLeft .starTwo {
+  right: var(--zd_size10) ;
+}
+.bottomLeft .starThree {
+  /*  Variable:Ignore  */
+  bottom: 10px;
+}
+[dir=ltr] .bottomLeft .starThree {
+  left: 0 ;
+}
+[dir=rtl] .bottomLeft .starThree {
+  right: 0 ;
+}
+
+.bottomRight .starOne {
+  bottom: 0 ;
+}
+
+[dir=ltr] .bottomRight .starOne {
+  right: 0 ;
+}
+
+[dir=rtl] .bottomRight .starOne {
+  left: 0 ;
+}
+.bottomRight .starTwo {
+  bottom: 0 ;
+  /*  Variable:Ignore  */
+}
+[dir=ltr] .bottomRight .starTwo {
+  right: var(--zd_size10) ;
+}
+[dir=rtl] .bottomRight .starTwo {
+  left: var(--zd_size10) ;
+}
+.bottomRight .starThree {
+  /*  Variable:Ignore  */
+  bottom: 10px;
+}
+[dir=ltr] .bottomRight .starThree {
+  right: 0 ;
+}
+[dir=rtl] .bottomRight .starThree {
+  left: 0 ;
+}
 
 @keyframes twinkle {
   0% {