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

package/assets/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css

@@ -1,34 +0,0 @@
-[data-mode='default'][data-theme='yellow'] {
-	--zdt_cta_primary_text: #b68c07;
-	--zdt_cta_primary_hover_text: #826800;
-	--zdt_cta_primary_bg: #e8b923;
-	--zdt_cta_primary_hover_bg: #b59100;
-	--zdt_cta_primary_border: #e8b923;
-	--zdt_cta_primary_hover_border: #b59100;
-	--zdt_cta_primary_box_shadow: rgba(232, 185, 35, 0.2);
-	--zdt_cta_primary_hover_box_shadow: rgba(181, 145, 0, 0.25);
-	--zdt_cta_primary_light_bg: #fdf8e9;
-	--zdt_cta_primary_light_hover_bg: #f8eabd;
-	--zdt_cta_primary_light_border: #f8eabd;
-	--zdt_cta_secondary_bg: #e8b923;
-	--zdt_cta_secondary_text: var(--dot_black);
-	--zdt_cta_secondary_border: rgba(255, 255, 255, 0.2);
-	--zdt_cta_secondary_light_border: #f6e3a7;
-	--zdt_cta_alpha_text: #b68c07;
-	--zdt_cta_alpha_hover_text: #826800;
-	--zdt_cta_alpha_border: #b68c07;
-	--zdt_cta_alpha_hover_border: #826800;
-	--zdt_cta_alpha_bg: #f8eabd;
-	--zdt_cta_beta_border: #b68c07;
-	--zdt_cta_grey_10_bg: #f8f8f6;
-	--zdt_cta_grey_10_border: #f8f8f6;
-	--zdt_cta_grey_15_bg: #edede3;
-	--zdt_cta_grey_15_border: #edede3;
-	--zdt_cta_grey_20_bg: #efefec;
-	--zdt_cta_grey_35_bg: #e0dbcc;
-	--zdt_cta_grey_35_text: #e0dbcc;
-	--zdt_cta_grey_35_border: #e0dbcc;
-	--zdt_cta_grey_40_bg: #ccc2a4;
-	--zdt_cta_grey_40_text: #ccc2a4;
-	--zdt_cta_grey_40_border: #ccc2a4
-}

package/assets/Appearance/default/themes/yellow/yellowDefaultComponentTheme.module.css

@@ -1,42 +0,0 @@
-[data-mode='default'][data-theme='yellow'] {
-	/* stencil */
-	--zdt_stencil_dark_bg: rgba(255, 255, 255, 0.07);
-	--zdt_stencil_dark_gradient_bg: linear-gradient(to left, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.03) 33.33%, rgba(255, 255, 255, 0.03) 66.66%, rgba(255, 255, 255, 0.07) 100%);
-	
-	/* dropbox */
-	--zdt_dropbox_dark_bg: #313323;
-	
-	/* listitem */
-	--zdt_listitem_dark_bg: #313323;
-	--zdt_listitem_dark_text: #d0d0d4;
-	--zdt_listitem_dark_effect_bg: rgba(255, 255, 255, 0.12);
-	--zdt_listitem_dark_active_bg: #494c34;
-	--zdt_listitem_dark_tickicon: #e8b923;
-	
-	/* tag */
-	--zdt_tag_dark_text: #d0d0d4;
-	--zdt_tag_dark_bg: rgba(255, 255, 255, 0.07);
-	--zdt_tag_dark_hover_text: #d0d0d4;
-	--zdt_tag_dark_hover_bg: var(--dot_matterhorn);
-	--zdt_tag_dark_close_bg: #864654;
-	--zdt_tag_dark_close_text: var(--dot_brightRed);
-	
-	/* multiselect */
-	--zdt_multiselect_dark_border: rgba(255, 255, 255, 0.2);
-	--zdt_multiselect_darkmsg_bg: rgba(255, 255, 255, 0.02);
-	--zdt_multiselect_darkmsg_text: #d0d0d4;
-	--zdt_multiselect_darkdelete_hover_text: var(--dot_white);
-	
-	/* avatar */
-	--zdt_avatar_white_border: rgba(255, 255, 255, 0.2);
-	--zdt_avatar_white_text: var(--dot_white);
-	
-	/* label */
-	--zdt_label_dark_text: #d0d0d4;
-	
-	/* textbox */
-	--zdt_textbox_light_text: var(--dot_white);
-	
-	/* dropdown */
-	--zdt_dropdown_darkheading_text: var(--dot_white);
-}

package/es/ListItem/ListContainer.js

@@ -1,123 +0,0 @@
-function _extends() { _extends = Object.assign || 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); }
-
-/**** Libraries ****/
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Container } from '../Layout';
-import CssProvider from '../Provider/CssProvider';
-import style from './ListItem.module.css';
-
-const ListContainer = props => {
-  const {
-    size,
-    active,
-    highlight,
-    autoHover,
-    palette,
-    title,
-    disableTitle,
-    needTick,
-    isLink,
-    href,
-    target,
-    needBorder,
-    isDisabled,
-    children,
-    dataId,
-    a11y,
-    customClass,
-    customProps,
-    onClick,
-    onMouseEnter,
-    onMouseOver,
-    eleRef
-  } = props;
-  const {
-    role,
-    ariaSelected
-  } = a11y;
-  const options = {};
-
-  if (isLink) {
-    options.href = href;
-    options.target = `_${target}`;
-  }
-
-  if (active) {
-    options['data-selected'] = active;
-  }
-
-  if (!isDisabled && !isLink && active) {
-    options.tabindex = '0';
-  }
-
-  return /*#__PURE__*/React.createElement(Container, _extends({
-    role: role,
-    "aria-selected": ariaSelected,
-    isCover: false,
-    align: "vertical",
-    alignBox: "row",
-    className: `${style.list} ${style[size]} ${style[palette]} ${active ? style[`active${palette}`] : highlight && !isDisabled ? style[`${palette}Hover`] : ''} ${autoHover && !isDisabled ? style[`${palette}Effect`] : ''} ${needTick ? style[`${size}withTick`] : ''} ${isDisabled ? CssProvider('isDisable') : ''} ${needBorder ? active ? style.activewithBorder : style.withBorder : ''} ${customClass}`,
-    dataId: dataId,
-    onClick: !isDisabled && onClick,
-    onMouseEnter: onMouseEnter,
-    onMouseOver: onMouseOver,
-    eleRef: eleRef,
-    tagName: isLink ? 'a' : 'li',
-    "data-title": isDisabled ? disableTitle : title
-  }, options, customProps), children);
-};
-
-ListContainer.defaultProps = {
-  active: false,
-  autoHover: false,
-  highlight: false,
-  needTick: false,
-  palette: 'default',
-  size: 'medium',
-  isLink: false,
-  target: 'blank',
-  needBorder: true,
-  a11y: {},
-  customClass: {},
-  customProps: {}
-};
-export default ListContainer;
-ListContainer.propTypes = {
-  active: PropTypes.bool,
-  autoHover: PropTypes.bool,
-  children: PropTypes.node,
-  dataId: PropTypes.string,
-  disableTitle: PropTypes.string,
-  highlight: PropTypes.bool,
-  href: PropTypes.string,
-  isDisabled: PropTypes.bool,
-  isLink: PropTypes.bool,
-  needBorder: PropTypes.bool,
-  needTick: PropTypes.bool,
-  onClick: PropTypes.func,
-  onMouseEnter: PropTypes.func,
-  onMouseOver: PropTypes.func,
-  palette: PropTypes.oneOf(['default', 'primary', 'secondary', 'dark']),
-  size: PropTypes.oneOf(['small', 'medium', 'large']),
-  target: PropTypes.oneOf(['blank', 'self']),
-  title: PropTypes.string,
-  a11y: PropTypes.shape({
-    role: PropTypes.string,
-    ariaSelected: PropTypes.bool
-  }),
-  customClass: PropTypes.shape({
-    customListItem: PropTypes.string,
-    customTickIcon: PropTypes.string
-  }),
-  customProps: PropTypes.shape({
-    ListItemProps: PropTypes.object
-  })
-};
-
-if (false) {
-  ListContainer.docs = {
-    componentGroup: 'Molecule',
-    folderName: 'Style Guide'
-  };
-}

package/lib/ListItem/ListContainer.js

@@ -1,132 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _Layout = require("../Layout");
-
-var _CssProvider = _interopRequireDefault(require("../Provider/CssProvider"));
-
-var _ListItemModule = _interopRequireDefault(require("./ListItem.module.css"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _extends() { _extends = Object.assign || 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); }
-
-var ListContainer = function ListContainer(props) {
-  var size = props.size,
-      active = props.active,
-      highlight = props.highlight,
-      autoHover = props.autoHover,
-      palette = props.palette,
-      title = props.title,
-      disableTitle = props.disableTitle,
-      needTick = props.needTick,
-      isLink = props.isLink,
-      href = props.href,
-      target = props.target,
-      needBorder = props.needBorder,
-      isDisabled = props.isDisabled,
-      children = props.children,
-      dataId = props.dataId,
-      a11y = props.a11y,
-      customClass = props.customClass,
-      customProps = props.customProps,
-      onClick = props.onClick,
-      onMouseEnter = props.onMouseEnter,
-      onMouseOver = props.onMouseOver,
-      eleRef = props.eleRef;
-  var role = a11y.role,
-      ariaSelected = a11y.ariaSelected;
-  var options = {};
-
-  if (isLink) {
-    options.href = href;
-    options.target = "_".concat(target);
-  }
-
-  if (active) {
-    options['data-selected'] = active;
-  }
-
-  if (!isDisabled && !isLink && active) {
-    options.tabindex = '0';
-  }
-
-  return /*#__PURE__*/_react["default"].createElement(_Layout.Container, _extends({
-    role: role,
-    "aria-selected": ariaSelected,
-    isCover: false,
-    align: "vertical",
-    alignBox: "row",
-    className: "".concat(_ListItemModule["default"].list, " ").concat(_ListItemModule["default"][size], " ").concat(_ListItemModule["default"][palette], " ").concat(active ? _ListItemModule["default"]["active".concat(palette)] : highlight && !isDisabled ? _ListItemModule["default"]["".concat(palette, "Hover")] : '', " ").concat(autoHover && !isDisabled ? _ListItemModule["default"]["".concat(palette, "Effect")] : '', " ").concat(needTick ? _ListItemModule["default"]["".concat(size, "withTick")] : '', " ").concat(isDisabled ? (0, _CssProvider["default"])('isDisable') : '', " ").concat(needBorder ? active ? _ListItemModule["default"].activewithBorder : _ListItemModule["default"].withBorder : '', " ").concat(customClass),
-    dataId: dataId,
-    onClick: !isDisabled && onClick,
-    onMouseEnter: onMouseEnter,
-    onMouseOver: onMouseOver,
-    eleRef: eleRef,
-    tagName: isLink ? 'a' : 'li',
-    "data-title": isDisabled ? disableTitle : title
-  }, options, customProps), children);
-};
-
-ListContainer.defaultProps = {
-  active: false,
-  autoHover: false,
-  highlight: false,
-  needTick: false,
-  palette: 'default',
-  size: 'medium',
-  isLink: false,
-  target: 'blank',
-  needBorder: true,
-  a11y: {},
-  customClass: {},
-  customProps: {}
-};
-var _default = ListContainer;
-exports["default"] = _default;
-ListContainer.propTypes = {
-  active: _propTypes["default"].bool,
-  autoHover: _propTypes["default"].bool,
-  children: _propTypes["default"].node,
-  dataId: _propTypes["default"].string,
-  disableTitle: _propTypes["default"].string,
-  highlight: _propTypes["default"].bool,
-  href: _propTypes["default"].string,
-  isDisabled: _propTypes["default"].bool,
-  isLink: _propTypes["default"].bool,
-  needBorder: _propTypes["default"].bool,
-  needTick: _propTypes["default"].bool,
-  onClick: _propTypes["default"].func,
-  onMouseEnter: _propTypes["default"].func,
-  onMouseOver: _propTypes["default"].func,
-  palette: _propTypes["default"].oneOf(['default', 'primary', 'secondary', 'dark']),
-  size: _propTypes["default"].oneOf(['small', 'medium', 'large']),
-  target: _propTypes["default"].oneOf(['blank', 'self']),
-  title: _propTypes["default"].string,
-  a11y: _propTypes["default"].shape({
-    role: _propTypes["default"].string,
-    ariaSelected: _propTypes["default"].bool
-  }),
-  customClass: _propTypes["default"].shape({
-    customListItem: _propTypes["default"].string,
-    customTickIcon: _propTypes["default"].string
-  }),
-  customProps: _propTypes["default"].shape({
-    ListItemProps: _propTypes["default"].object
-  })
-};
-
-if (false) {
-  ListContainer.docs = {
-    componentGroup: 'Molecule',
-    folderName: 'Style Guide'
-  };
-}