@zohodesk/dot 1.2.1 → 1.2.3

package/es/list/listCommon.module.css

@@ -2,59 +2,77 @@
   display: inline-block;
   vertical-align: middle;
 }
+
 .inlineFlex {
   composes: dInflex alignVertical from '~@zohodesk/components/lib/common/common.module.css';
 }
+
 [dir=ltr] .avatarMargin {
   margin-right: var(--zd_size25) ;
 }
+
 [dir=rtl] .avatarMargin {
   margin-left: var(--zd_size25) ;
 }
+
 .subject {
   composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
   font-size: var(--zd_font_size16) ;
 }
+
 .secondaryPanel {
   line-height: var(--zd_size18);
   composes: dflex alignVertical flexwrap from '~@zohodesk/components/lib/common/common.module.css';
 }
+
 .statusColumn {
   composes: inlineBlockMiddle;
 }
+
 [dir=ltr] .statusColumn {
   text-align: right;
 }
+
 [dir=rtl] .statusColumn {
   text-align: left;
 }
+
 .classic .floatingIconContainer {
   display: none;
 }
+
 .compact .floatingIconContainer,
 .superCompact .floatingIconContainer,
 .listContainer:hover .classic .floatingIconContainer,
-.hoveredStyle .classic .floatingIconContainer {
+.hoveredStyle .classic .floatingIconContainer,
+.compact:focus-within .floatingIconContainer,
+.superCompact:focus-within .floatingIconContainer,
+.listContainer:focus-within .classic .floatingIconContainer,
+.hoveredStyle .classic:focus-within .floatingIconContainer {
   display: inline-flex;
   align-items: center;
 }
+
 .compact .floatingIconContainer,
 .superCompact .floatingIconContainer {
   opacity: 0;
   visibility: hidden;
 }
+
 .floatingIcons {
   font-size: var(--zd_font_size15) ;
 }
-.listContainer, .listLayoutContainer {
+
+.listContainer,
+.listLayoutContainer {
   position: relative;
   transition: var(--zd_transition3) all ease;
 }
+
 .listContainer:hover .compact .floatingIconContainer,
 .listContainer:hover .superCompact .floatingIconContainer,
 .hoveredStyle .compact .floatingIconContainer,
-.hoveredStyle .superCompact .floatingIconContainer 
- {
+.hoveredStyle .superCompact .floatingIconContainer {
   opacity: 1;
   visibility: visible;
-}
+}

package/es/list/status/StatusDropdown/StatusDropdown.js

@@ -306,8 +306,14 @@ export class StatusDropdown extends React.Component {
       statusColor,
       needExternalPopupState = false,
       isPopupActive = false,
-      needMultiLineText
+      needMultiLineText,
+      a11y = {}
     } = this.props;
+    const {
+      tabIndex = 0,
+      ariaLabelledby,
+      ariaLabel
+    } = a11y;
     let isPopupOpen = needExternalPopupState ? isPopupActive && isOpen : isOpen;
     let {
       searchString
@@ -330,7 +336,11 @@ export class StatusDropdown extends React.Component {
       onClick: removeClose,
       disabled: isDisabled || isReadOnly ? true : false,
       "aria-haspopup": true,
-      "aria-expanded": isPopupOpen && isEditable ? true : false
+      "aria-expanded": isPopupOpen && isEditable ? true : false,
+      tabIndex: tabIndex,
+      "aria-labelledby": ariaLabelledby,
+      "aria-label": ariaLabel,
+      "aria-disabled": isDisabled || isReadOnly
     }, isEditable ? /*#__PURE__*/React.createElement("div", {
       className: style.hiddenInput
     }, /*#__PURE__*/React.createElement(TextBox, {
@@ -452,4 +462,7 @@ export class StatusDropdown extends React.Component {
 
 StatusDropdown.defaultProps = defaultProps;
 StatusDropdown.propTypes = propTypes;
-export default Popup(StatusDropdown);
+const StatusDropdown_Component = Popup(StatusDropdown);
+StatusDropdown_Component.defaultProps = StatusDropdown.defaultProps;
+StatusDropdown_Component.propTypes = StatusDropdown.propTypes;
+export default StatusDropdown_Component;

package/es/list/status/StatusDropdown/props/propTypes.js

@@ -49,5 +49,6 @@ export const propTypes = {
   value: PropTypes.node,
   needMultiLineText: PropTypes.bool,
   onSelectLabel: PropTypes.func,
-  top: PropTypes.number
+  top: PropTypes.number,
+  a11y: PropTypes.object
 };

package/es/lookup/Lookup/Lookup.js

@@ -60,6 +60,7 @@ export default class Lookup extends Component {
       role = 'dialog',
       ariaLabelledby,
       ariaDescribedby,
+      ariaLabel,
       ariaModal = isActive ? true : undefined
     } = a11y;
     const {
@@ -79,6 +80,7 @@ export default class Lookup extends Component {
       role: role,
       "aria-labelledby": ariaLabelledby,
       "aria-describedby": ariaDescribedby,
+      "aria-label": ariaLabel,
       "aria-modal": ariaModal,
       id: htmlId,
       className: `${style.box} ${style[`${size}Size`]}`,

package/es/lookup/header/ViewDropDown/ViewDropDown.js

@@ -165,7 +165,8 @@ class DropDown extends SelectComponent {
 DropDown.propTypes = propTypes;
 DropDown.defaultProps = defaultProps;
 const ViewDropDown = Popup(DropDown);
-ViewDropDown.defaultProps = DropDown.defaultProps; // if (__DOCS__) {
+ViewDropDown.defaultProps = DropDown.defaultProps;
+ViewDropDown.propTypes = DropDown.propTypes; // if (__DOCS__) {
 //   DropDown.docs = {
 //     componentGroup: 'Lookup'
 //   };

package/es/setup/helptips/ListGroup/ListGroup.js

@@ -27,7 +27,7 @@ export default class ListGroup extends React.Component {
     }, data.map((text, index) => /*#__PURE__*/React.createElement("li", {
       className: style.unOrderData,
       key: index
-    }, data)));
+    }, text)));
   }
 
 }

package/es/v1/Attachment/Attachment.js

@@ -0,0 +1,88 @@
+import React from 'react';
+import { defaultProps } from '../../Attachment/props/defaultProps';
+import { propTypes } from '../../Attachment/props/propTypes';
+import { Icon } from '@zohodesk/icons';
+import { Container, Box } from '@zohodesk/components/lib/Layout';
+import Link from '../Link/Link';
+import style from '../../Attachment/Attachment.module.css';
+export default class Attachment extends React.Component {
+  render() {
+    let {
+      onClick,
+      dataId,
+      size,
+      iconName,
+      fileName,
+      fileSize,
+      downloadLink,
+      palette,
+      tooltip,
+      fileInfo,
+      i18nKeys,
+      dataSelectorId
+    } = this.props;
+    let {
+      downloadTitle = 'Download'
+    } = i18nKeys;
+    return /*#__PURE__*/React.createElement(Container, {
+      isInline: true,
+      className: `${style.attachment} ${onClick ? style.attachmentHover : ''} ${style[`palette_${palette}`]} ${style[size]}`,
+      onClick: onClick,
+      dataId: dataId,
+      "data-title": tooltip,
+      alignBox: "row",
+      isCover: false,
+      dataSelectorId: dataSelectorId,
+      tabIndex: "0"
+    }, iconName ? /*#__PURE__*/React.createElement(Box, {
+      className: style.attachleft
+    }, /*#__PURE__*/React.createElement(Container, {
+      align: "both"
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: iconName,
+      iconClass: style.attachIcon
+    }))) : null, /*#__PURE__*/React.createElement(Box, {
+      flexible: true,
+      className: style.attachright
+    }, /*#__PURE__*/React.createElement(Container, {
+      align: "horizontal"
+    }, fileName ? /*#__PURE__*/React.createElement(Box, {
+      className: style.atatchName,
+      "data-title": fileName
+    }, fileName) : null, /*#__PURE__*/React.createElement(Box, {
+      className: style.footer
+    }, /*#__PURE__*/React.createElement(Container, {
+      alignBox: "row",
+      align: "baseline",
+      isCover: false
+    }, fileSize ? /*#__PURE__*/React.createElement(Box, {
+      className: style.attachSize,
+      adjust: true,
+      shrink: true,
+      "data-title": fileSize
+    }, fileSize) : null, fileInfo ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, {
+      className: style.dot
+    }), /*#__PURE__*/React.createElement(Box, {
+      className: style.attachSize,
+      adjust: true,
+      shrink: true,
+      "data-title": fileInfo
+    }, fileInfo)) : null)))), downloadLink ? /*#__PURE__*/React.createElement(Link, {
+      target: "_self",
+      href: downloadLink,
+      className: style.attachDownload,
+      title: downloadTitle,
+      hasReload: true
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: "ZD-downloadNew",
+      iconClass: style.downIcon
+    })) : null);
+  }
+
+}
+Attachment.propTypes = propTypes;
+Attachment.defaultProps = defaultProps; // if (__DOCS__) {
+//   Attachment.docs = {
+//     componentGroup: 'Attachment'
+//   };
+// }

package/es/v1/AttachmentViewer/AttachmentImage.js

@@ -0,0 +1,79 @@
+/* eslint-disable css-modules/no-unused-class */
+
+/** * Libraries ** */
+import React, { Component } from 'react';
+import { AttachmentImage_defaultProps } from '../../AttachmentViewer/props/defaultProps';
+import { AttachmentImage_propTypes } from '../../AttachmentViewer/props/propTypes';
+import Image from '../Image/Image';
+/** * CSS ** */
+
+import style from '../../AttachmentViewer/AttachmentViewer.module.css';
+export default class AttachmentImage extends Component {
+  constructor(props) {
+    super(props);
+    this.imageEle = /*#__PURE__*/React.createRef();
+    this.state = {
+      isLoading: true
+    };
+    this.imgLoad = this.imgLoad.bind(this);
+  }
+
+  componentDidMount() {
+    const {
+      isImage
+    } = this.props;
+
+    if (isImage) {
+      const image = this.imageEle.current;
+      image.addEventListener('load', this.imgLoad);
+    } else {
+      this.setState({
+        isLoading: false
+      });
+    }
+  }
+
+  imgLoad() {
+    this.setState({
+      isLoading: false
+    });
+    const {
+      onLoad
+    } = this.props;
+    onLoad && onLoad();
+  }
+
+  render() {
+    const {
+      src,
+      onClick,
+      alt,
+      dataId,
+      id,
+      className,
+      isCover
+    } = this.props;
+    const {
+      isLoading
+    } = this.state;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, isLoading ? /*#__PURE__*/React.createElement("div", {
+      className: `${style.spinLoad}`,
+      "data-id": `${dataId}_loader`,
+      "data-test-id": `${dataId}_loader`
+    }, /*#__PURE__*/React.createElement("div", {
+      className: style.loader
+    })) : null, /*#__PURE__*/React.createElement(Image, {
+      htmlId: id,
+      eleRef: this.imageEle,
+      dataId: dataId,
+      src: src,
+      onClick: onClick,
+      className: `${isLoading ? style.hide : ''} ${className}`,
+      alt: alt,
+      isCover: isCover
+    }));
+  }
+
+}
+AttachmentImage.propTypes = AttachmentImage_propTypes;
+AttachmentImage.defaultProps = AttachmentImage_defaultProps;