@zohodesk/dot 1.0.0-temp-49 → 1.0.0-temp-53

package/src/form/fields/TagsMultiSelect/TagsMultiSelect.module.css

@@ -1,95 +1,95 @@
-.tag {
-  max-width: 100%;
-}
-.moreLess,
-.tag {
-  margin: 0 var(--zd_size6) var(--zd_size6) 0;
-}
-.input {
-  height: var(--zd_size20);
-  margin-bottom: var(--zd_size4);
-  width: 100%;
-}
-.viewpopNew {
-  max-height: var(--zd_size250);
-}
-.tagDiv {
-  margin-top: var(--zd_size5);
-  max-height: var(--zd_size160);
-}
-.hasBorder {
-  border-bottom-style: solid;
-  border-bottom-width: 1px;
-  transition: border var(--zd_transition2) linear 0s;
-}
-.borderColor_transparent {
-  border-bottom-color: var(--zdt_tagsmultiselect_transparent_border);
-}
-.borderColor_transparent:hover {
-  border-bottom-color: var(--zdt_tagsmultiselect_transparent_hover_border);
-}
-.borderColor_transparent.active {
-  border-bottom-color: var(--zdt_tagsmultiselect_transparent_active_border);
-}
-.borderColor_default {
-  border-bottom-color: var(--zdt_tagsmultiselect_default_border);
-}
-.borderColor_default:hover {
-  border-bottom-color: var(--zdt_tagsmultiselect_default_hover_border);
-}
-.borderColor_default.active {
-  border-bottom-color: var(--zdt_tagsmultiselect_default_active_border);
-}
-.borderColor_dark {
-  border-bottom-color: var(--zdt_tagsmultiselect_dark_border);
-}
-.borderColor_dark:hover {
-  border-bottom-color: var(--zdt_tagsmultiselect_dark_hover_border);
-}
-.borderColor_dark.active {
-  border-bottom-color: var(--zdt_tagsmultiselect_dark_active_border);
-}
-.moreLess {
-  color: var(--zdt_tagsmultiselect_more_text);
-  font-size: var(--zd_font_size13);
-  cursor: pointer;
-}
-.moreLess:hover {
-  color: var(--zdt_tagsmultiselect_more_hover_text);
-}
-.inputWrapper {
-  position: relative;
-  max-width: 100%;
-  min-width: var(--zd_size5);
-  font-size: 0;
-}
-.newTagLabel {
-  margin-right: var(--zd_size5);
-  color: var(--zdt_tagsmultiselect_labelt_text);
-  composes: semibold from '~@zohodesk/components/lib/common/common.module.css';
-}
-.dotted {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
-}
-.dropdown {
-  margin-top: var(--zd_size1);
-}
-.custmSpan {
-  height: var(--zd_size25);
-  display: inline-block;
-  vertical-align: middle;
-  opacity: 0;
-  overflow: hidden;
-  white-space: nowrap;
-  max-width: 100%;
-  visibility: hidden;
-}
-.custmInp {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-}
-.newTagText {
-  color: var(--zdt_tagsmultiselect_more_text);
-}
+.tag {
+  max-width: 100%;
+}
+.moreLess,
+.tag {
+  margin: 0 var(--zd_size6) var(--zd_size6) 0;
+}
+.input {
+  height: var(--zd_size20);
+  margin-bottom: var(--zd_size4);
+  width: 100%;
+}
+.viewpopNew {
+  max-height: var(--zd_size250);
+}
+.tagDiv {
+  margin-top: var(--zd_size5);
+  max-height: var(--zd_size160);
+}
+.hasBorder {
+  border-bottom-style: solid;
+  border-bottom-width: 1px;
+  transition: border var(--zd_transition2) linear 0s;
+}
+.borderColor_transparent {
+  border-bottom-color: var(--zdt_tagsmultiselect_transparent_border);
+}
+.borderColor_transparent:hover {
+  border-bottom-color: var(--zdt_tagsmultiselect_transparent_hover_border);
+}
+.borderColor_transparent.active {
+  border-bottom-color: var(--zdt_tagsmultiselect_transparent_active_border);
+}
+.borderColor_default {
+  border-bottom-color: var(--zdt_tagsmultiselect_default_border);
+}
+.borderColor_default:hover {
+  border-bottom-color: var(--zdt_tagsmultiselect_default_hover_border);
+}
+.borderColor_default.active {
+  border-bottom-color: var(--zdt_tagsmultiselect_default_active_border);
+}
+.borderColor_dark {
+  border-bottom-color: var(--zdt_tagsmultiselect_dark_border);
+}
+.borderColor_dark:hover {
+  border-bottom-color: var(--zdt_tagsmultiselect_dark_hover_border);
+}
+.borderColor_dark.active {
+  border-bottom-color: var(--zdt_tagsmultiselect_dark_active_border);
+}
+.moreLess {
+  color: var(--zdt_tagsmultiselect_more_text);
+  font-size: var(--zd_font_size13);
+  cursor: pointer;
+}
+.moreLess:hover {
+  color: var(--zdt_tagsmultiselect_more_hover_text);
+}
+.inputWrapper {
+  position: relative;
+  max-width: 100%;
+  min-width: var(--zd_size5);
+  font-size: 0;
+}
+.newTagLabel {
+  margin-right: var(--zd_size5);
+  color: var(--zdt_tagsmultiselect_labelt_text);
+  composes: semibold from '~@zohodesk/components/lib/common/common.module.css';
+}
+.dotted {
+  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+}
+.dropdown {
+  margin-top: var(--zd_size1);
+}
+.custmSpan {
+  height: var(--zd_size25);
+  display: inline-block;
+  vertical-align: middle;
+  opacity: 0;
+  overflow: hidden;
+  white-space: nowrap;
+  max-width: 100%;
+  visibility: hidden;
+}
+.custmInp {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+}
+.newTagText {
+  color: var(--zdt_tagsmultiselect_more_text);
+}

package/src/form/fields/TagsMultiSelect/docs/TagsMultiSelect__default.docs.js

@@ -1,55 +1,55 @@
-import React from 'react';
-import TagsMultiSelect from '../TagsMultiSelect';
-import Icon from '@zohodesk/icons/lib/Icon';
-
-export default class TagsMultiSelect__default extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {isPopupOpen: false}
-    this.handleTogglePopup = this.handleTogglePopup.bind(this)
-    this.getCustomChildren = this.getCustomChildren.bind(this)
-  }
-  handleTogglePopup() {
-    this.setState({isPopupOpen: !this.state.isPopupOpen})
-  }
-  getCustomChildren() {
-    return (
-      <Icon name='ZD-SE-setpracket' size='18'/>
-    )
-  }
-  render() {
-    let { isPopupOpen } = this.state;
-    return (
-      <div style={{ position: 'relative' }}>
-        <TagsMultiSelect
-          addTag={() => { }}
-          closeSearch={() => { }}
-          deleteTag={() => { }}
-          handleChange={() => { }}
-          handleKeyUp={() => { }}
-          isReadOnly={false}
-          name=''
-          noMoreData
-          searchList={[]}
-          searchTags={() => { }}
-          selectSearchIndex='-1'
-          tagsList={[
-            { name: 'Tag1', tagType: 'MANUAL', id: '5853000007033049' },
-            { name: 'Tag2', tagType: 'MANUAL', id: '5853000007033069' }
-          ]}
-          handleTogglePopup={this.handleTogglePopup}
-          isPopupOpen={isPopupOpen}
-          isPopupReady={isPopupOpen}
-          i18nKeys={{ newTagText: 'New Tag', emptyTitleText: 'OOPS', emptyDescription: 'No tag available', deleteText: 'Delete tag', lessText: 'Less', moreText: 'More' }}
-          getTextBoxChildren={this.getCustomChildren}
-        />
-      </div>
-    );
-  }
-}
-
-if (__DOCS__) {
-  TagsMultiSelect__default.docs = {
-    componentGroup: 'TagsMultiSelect',
-  };
-}
+import React from 'react';
+import TagsMultiSelect from '../TagsMultiSelect';
+import Icon from '@zohodesk/icons/lib/Icon';
+
+export default class TagsMultiSelect__default extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {isPopupOpen: false}
+    this.handleTogglePopup = this.handleTogglePopup.bind(this)
+    this.getCustomChildren = this.getCustomChildren.bind(this)
+  }
+  handleTogglePopup() {
+    this.setState({isPopupOpen: !this.state.isPopupOpen})
+  }
+  getCustomChildren() {
+    return (
+      <Icon name='ZD-SE-setpracket' size='18'/>
+    )
+  }
+  render() {
+    let { isPopupOpen } = this.state;
+    return (
+      <div style={{ position: 'relative' }}>
+        <TagsMultiSelect
+          addTag={() => { }}
+          closeSearch={() => { }}
+          deleteTag={() => { }}
+          handleChange={() => { }}
+          handleKeyUp={() => { }}
+          isReadOnly={false}
+          name=''
+          noMoreData
+          searchList={[]}
+          searchTags={() => { }}
+          selectSearchIndex='-1'
+          tagsList={[
+            { name: 'Tag1', tagType: 'MANUAL', id: '5853000007033049' },
+            { name: 'Tag2', tagType: 'MANUAL', id: '5853000007033069' }
+          ]}
+          handleTogglePopup={this.handleTogglePopup}
+          isPopupOpen={isPopupOpen}
+          isPopupReady={isPopupOpen}
+          i18nKeys={{ newTagText: 'New Tag', emptyTitleText: 'OOPS', emptyDescription: 'No tag available', deleteText: 'Delete tag', lessText: 'Less', moreText: 'More' }}
+          getTextBoxChildren={this.getCustomChildren}
+        />
+      </div>
+    );
+  }
+}
+
+if (__DOCS__) {
+  TagsMultiSelect__default.docs = {
+    componentGroup: 'TagsMultiSelect',
+  };
+}