@zohodesk/components 1.0.0-temp-234 → 1.0.0-temp-236

package/es/Provider/LibraryContext.js

@@ -1,57 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import LibraryContextInit from "./LibraryContextInit";
-import { getLibraryConfig } from "./Config";
-
-const LibraryContextProvider = _ref => {
-  let {
-    isReducedMotion,
-    direction,
-    coloredTagVariant,
-    hasTagColorInheritedToText,
-    shouldIndicateSwitchState,
-    shouldStrikeThroughDisabledButton,
-    children
-  } = _ref;
-  const [value, setValue] = useState({
-    isReducedMotion,
-    direction,
-    coloredTagVariant,
-    hasTagColorInheritedToText,
-    shouldIndicateSwitchState,
-    shouldStrikeThroughDisabledButton
-  });
-
-  function setGlobalContext(key, data) {
-    if (value[key] != data) {
-      setValue({ ...value,
-        [key]: data
-      });
-    }
-  }
-
-  return /*#__PURE__*/React.createElement(LibraryContextInit.Provider, {
-    value: { ...value,
-      setGlobalContext
-    }
-  }, children);
-};
-
-LibraryContextProvider.propTypes = {
-  children: PropTypes.node.isRequired,
-  isReducedMotion: PropTypes.bool,
-  coloredTagVariant: PropTypes.oneOf(['bold', 'subtle', 'minimal']),
-  hasTagColorInheritedToText: PropTypes.bool,
-  direction: PropTypes.string,
-  shouldIndicateSwitchState: PropTypes.bool,
-  shouldStrikeThroughDisabledButton: PropTypes.bool
-};
-LibraryContextProvider.defaultProps = {
-  isReducedMotion: getLibraryConfig('isReducedMotion'),
-  direction: getLibraryConfig('direction'),
-  coloredTagVariant: 'bold',
-  hasTagColorInheritedToText: true,
-  shouldIndicateSwitchState: false,
-  shouldStrikeThroughDisabledButton: false
-};
-export default LibraryContextProvider;

package/es/Provider/LibraryContextInit.js

@@ -1,3 +0,0 @@
-import React from 'react';
-const LibraryContext = /*#__PURE__*/React.createContext({});
-export default LibraryContext;

package/es/Provider/NumberGenerator/NumberGenerator.js

@@ -1,136 +0,0 @@
-import React, { useRef, useEffect } from 'react';
-export function addGlobalId(globalId) {
-  if (Number.isSafeInteger(Number(globalId)) && Number.isSafeInteger(Number(globalId) + 1)) {
-    globalId = Number(globalId) + 1;
-  } else {
-    globalId = `${globalId}1`;
-  }
-
-  return globalId;
-}
-
-function decreaseGlobalId(number, globalId) {
-  if (`${number}` == `${globalId}`) {
-    if (Number.isSafeInteger(Number(globalId)) && Number.isSafeInteger(Number(globalId) - 1)) {
-      globalId = Number(globalId) - 1;
-    } else {
-      globalId = `${globalId}`;
-      globalId = globalId.substring(0, globalId.length - 1);
-    }
-
-    return {
-      isDeleted: true,
-      globalId
-    };
-  }
-
-  return {
-    isDeleted: false,
-    globalId
-  };
-}
-
-export function decreaseGlobalIds(numbers, deletedIndexes, globalId) {
-  deletedIndexes = [...deletedIndexes];
-  [...numbers].reverse().map(number => {
-    let result = decreaseGlobalId(number, globalId);
-    globalId = result.globalId;
-    !result.isDeleted && deletedIndexes.push(number);
-  });
-
-  for (; deletedIndexes.indexOf(globalId) != -1;) {
-    let presentHighValue = globalId;
-    let result = decreaseGlobalId(globalId, globalId);
-    globalId = result.globalId;
-    deletedIndexes = deletedIndexes.filter(ele => `${ele}` != `${presentHighValue}`);
-  }
-
-  return {
-    globalId,
-    deletedIndexes
-  };
-}
-export function useNumberGenerator(_ref) {
-  let {
-    getGlobalId,
-    prefix,
-    getGlobalPrefix,
-    getDeletedIndexes,
-    callback
-  } = _ref;
-  let presentValues = useRef([]),
-      presentIndex = useRef(0);
-  prefix = typeof prefix === 'undefined' ? '' : `${prefix}_`;
-  let globalPrefix = typeof getGlobalPrefix() === 'undefined' ? '' : `${getGlobalPrefix()}_`;
-
-  function getNextId() {
-    presentIndex.current = presentIndex.current + 1;
-    let currentIndex = presentIndex.current;
-    let isValuePresent = typeof presentValues.current[currentIndex] !== 'undefined';
-    let result = isValuePresent ? presentValues.current[currentIndex] : presentValues.current[currentIndex] = addGlobalId(getGlobalId());
-    !isValuePresent && callback({
-      globalId: result,
-      deletedIndexes: getDeletedIndexes()
-    });
-    return `${globalPrefix}${prefix}${presentValues.current[currentIndex]}`;
-  }
-
-  useEffect(() => {
-    presentValues.current = presentValues.current.filter((value, index) => index <= presentIndex.current);
-  });
-  useEffect(() => () => {
-    callback(decreaseGlobalIds(presentValues.current, getDeletedIndexes(), getGlobalId()));
-  }, []);
-  presentIndex.current = -1;
-  return getNextId;
-}
-export function getNumberGenerators(_ref2) {
-  let {
-    Component,
-    prefix,
-    getGlobalPrefix,
-    getGlobalId,
-    getDeletedIndexes,
-    callback
-  } = _ref2;
-  let presentIndex = 0,
-      presentValues = [],
-      {
-    name
-  } = Component.props;
-  let didUpdateRef = Component.componentDidUpdate ? Component.componentDidUpdate.bind(Component) : undefined,
-      renderRef = Component.render.bind(Component),
-      willUnMountRef = Component.componentWillUnmount ? Component.componentWillUnmount.bind(Component) : undefined;
-  prefix = typeof prefix !== 'undefined' ? `${prefix}_` : '';
-
-  Component.componentDidUpdate = function () {
-    didUpdateRef && didUpdateRef(...arguments);
-    presentValues = presentValues.filter((value, index) => index <= presentIndex);
-  };
-
-  Component.componentWillUnmount = function () {
-    callback(decreaseGlobalIds(presentValues, getDeletedIndexes(), getGlobalId()));
-    willUnMountRef && willUnMountRef();
-    didUpdateRef = null, renderRef = null, willUnMountRef = null;
-  };
-
-  Component.render = function () {
-    presentIndex = -1;
-    return renderRef();
-  };
-
-  function getNextId() {
-    presentIndex += 1;
-    let isValuePresent = typeof presentValues[presentIndex] !== 'undefined';
-    let result = isValuePresent ? presentValues[presentIndex] : presentValues[presentIndex] = addGlobalId(getGlobalId(getGlobalId()));
-    let globalPrefix = getGlobalPrefix();
-    globalPrefix = typeof globalPrefix === 'undefined' ? '' : `${globalPrefix}_`;
-    !isValuePresent && callback({
-      globalId: result,
-      deletedIndexes: getDeletedIndexes()
-    });
-    return `${globalPrefix}${prefix}${result}`;
-  }
-
-  return getNextId;
-}

package/es/Provider/ZindexProvider.js

@@ -1,57 +0,0 @@
-import { useNumberGenerator, getNumberGenerators } from "./NumberGenerator/NumberGenerator";
-import { getLibraryConfig } from "./Config";
-let globalId = getLibraryConfig('zindexCounter'),
-    deletedIndexes = [],
-    globalPrefix;
-export function removeGlobalZIndexPrefix() {
-  globalPrefix = undefined;
-}
-
-function getGlobalZIndexPrefix() {
-  return globalPrefix;
-}
-
-export function setInitialZIndex(id) {
-  globalId = id;
-}
-
-function getGlobalId() {
-  return globalId;
-}
-
-function setDeletedIndexes(array) {
-  deletedIndexes = array;
-}
-
-function getDeletedIndexes() {
-  return deletedIndexes;
-}
-
-function callback(_ref) {
-  let {
-    globalId,
-    deletedIndexes
-  } = _ref;
-  setInitialZIndex(globalId);
-  setDeletedIndexes(deletedIndexes);
-}
-
-export function useZIndex(prefix) {
-  return useNumberGenerator({
-    getGlobalId,
-    prefix,
-    getGlobalPrefix: getGlobalZIndexPrefix,
-    getDeletedIndexes,
-    callback
-  });
-}
-export function getZIndex(Component, prefix) {
-  return getNumberGenerators({
-    Component,
-    prefix,
-    getGlobalPrefix: getGlobalZIndexPrefix,
-    getGlobalId,
-    getDeletedIndexes,
-    callback
-  });
-}

package/es/Provider/index.js

@@ -1,4 +0,0 @@
-export { getLibraryConfig, setLibraryConfig } from "./Config";
-export { default as LibraryContextProvider } from "./LibraryContext";
-export { removeGlobalZIndexPrefix, setInitialZIndex, useZIndex, getZIndex } from "./ZindexProvider";
-export { setGlobalIdPrefix, removeGlobalIdPrefix, useUniqueId, getUniqueId } from "./IdProvider";

package/es/Radio/Radio.js

@@ -1,138 +0,0 @@
-/* eslint css-modules/no-unused-class: [2, { markAsUsed: ['small', 'medium'] }] */
-import React from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
-import Label from "../Label/Label";
-import { Container, Box } from "../Layout";
-import CssProvider from "../Provider/CssProvider";
-import style from "./Radio.module.css";
-export default class Radio extends React.Component {
-  constructor(props) {
-    super(props);
-    this.onChange = this.onChange.bind(this);
-    this.handleGetRef = this.handleGetRef.bind(this);
-  }
-
-  onChange(e) {
-    let {
-      onChange,
-      value
-    } = this.props;
-    onChange && onChange(value, e);
-  }
-
-  handleGetRef(ele) {
-    let {
-      getRef,
-      value
-    } = this.props;
-    getRef && getRef(ele, value);
-  }
-
-  render() {
-    let {
-      id,
-      name,
-      value,
-      checked,
-      disabled,
-      isReadOnly,
-      palette,
-      disabledTitle,
-      title,
-      text,
-      labelPalette,
-      size,
-      labelSize,
-      variant,
-      active,
-      isFilled,
-      customClass,
-      customProps,
-      children,
-      a11y,
-      renderRightPlaceholderNode
-    } = this.props;
-    let {
-      customRadioWrap = '',
-      customRadio = '',
-      customLabel = ''
-    } = customClass;
-    let accessMode = isReadOnly ? style.readonly : disabled ? CssProvider('isDisabled') : style.pointer;
-    let toolTip = disabled ? disabledTitle : title ? title : null;
-    const isEditable = !(isReadOnly || disabled);
-    let {
-      ariaHidden,
-      role = 'radio',
-      tabIndex,
-      ariaChecked = checked,
-      ariaLabel,
-      ariaLabelledby,
-      ariaReadonly = !isEditable ? true : false
-    } = a11y;
-    let {
-      ContainerProps = {},
-      LabelProps = {}
-    } = customProps;
-    return /*#__PURE__*/React.createElement(Container, {
-      dataId: value ? value.toLowerCase() : 'RadioComp',
-      isCover: false,
-      isInline: text ? false : true,
-      alignBox: "row",
-      align: "both",
-      className: `${style.container} ${active && !disabled ? style.active : ''} ${accessMode} ${!isEditable ? '' : style.hoverEfffect} ${checked ? style.checked : ''} ${customRadioWrap}`,
-      "data-title": toolTip,
-      onClick: !isReadOnly && !disabled ? this.onChange : '',
-      "aria-checked": ariaChecked,
-      tabindex: !isEditable || ariaHidden ? '-1' : tabIndex || '0',
-      eleRef: this.handleGetRef,
-      role: role,
-      "aria-Hidden": ariaHidden,
-      "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabelledby,
-      "aria-readonly": ariaReadonly,
-      ...ContainerProps
-    }, /*#__PURE__*/React.createElement(Box, {
-      className: `${style.radio} ${checked ? `${style[`rdBox${palette}`]}` : ''} 
-            ${!isEditable ? '' : `${style[`hover${palette}`]}`} ${style[size]} ${isFilled ? style.filled : ''} ${style[`centerPath${palette}`]} ${customRadio} ${!isEditable ? `${style.disabled}` : ''}`
-    }, /*#__PURE__*/React.createElement("input", {
-      type: "hidden",
-      id: id,
-      name: name,
-      value: value
-    }), /*#__PURE__*/React.createElement("label", {
-      className: `${style.radioLabel} ${accessMode}`
-    }, /*#__PURE__*/React.createElement("svg", {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 40 40"
-    }, /*#__PURE__*/React.createElement("circle", {
-      cx: "20",
-      cy: "20",
-      r: "19",
-      className: `${style.rdBox}`
-    }), checked ? /*#__PURE__*/React.createElement("circle", {
-      cx: "20",
-      cy: "20",
-      r: "11.03",
-      className: `${style.centerPath}`
-    }) : null))), text && /*#__PURE__*/React.createElement(Box, {
-      flexible: true,
-      className: `${style.text} ${disabled ? `${style.disabled}` : ''}`
-    }, /*#__PURE__*/React.createElement(Label, {
-      text: text,
-      palette: labelPalette,
-      size: labelSize,
-      type: "title",
-      clipped: true,
-      dataId: `${text}_label`,
-      variant: variant,
-      title: toolTip ? toolTip : text,
-      customClass: `${checked && active ? `${style[`${palette}checkedActive`]}` : ''} 
-              ${style[`${palette}Label`]} ${isEditable ? style.pointer : ''} ${isReadOnly ? style.readonly : ''}  ${customLabel}`,
-      ...LabelProps
-    })), children, renderRightPlaceholderNode ? renderRightPlaceholderNode : null);
-  }
-
-}
-Radio.defaultProps = defaultProps;
-Radio.propTypes = propTypes;

package/es/Radio/Radio.module.css

@@ -1,115 +0,0 @@
-.varClass {
-  /* radio default variables */
-  --radio_width: var(--zd_size16);
-  --radio_height: var(--zd_size16);
-  --radio_bg_color: none;
-  --radio_stroke_width: 2px;
-  --radio_stroke_color: var(--zdt_radio_default_stroke);
-  --radio_fill: none;
-  --radio_inner_stroke_width: 0;
-}[dir=ltr] .varClass {
-  --radio_label_margin: 0 0 0 var(--zd_size6);
-}[dir=rtl] .varClass {
-  --radio_label_margin: 0 var(--zd_size6) 0 0;
-}
-.container {
-  composes: varClass;
-}
-.pointer {
-  cursor: pointer;
-}
-.readonly, .disabled {
-  cursor: default;
-}
-.disabled {
-  opacity: 0.7
-}
-.radio {
-  composes: offSelection from '../common/common.module.css';
-  width: var(--radio_width);
-  height: var(--radio_height);
-  stroke: var(--radio_stroke_color);
-  background: var(--radio_bg_color);
-  border-radius: 50%;
-}
-.radio,
-.centerPath {
-  fill: var(--radio_fill);
-}
-.filled {
-  --radio_bg_color: var(--zdt_radio_default_bg);
-}
-
-.medium {
-  --radio_width: var(--zd_size16);
-  --radio_height: var(--zd_size16);
-}
-.small {
-  --radio_width: var(--zd_size13);
-  --radio_height: var(--zd_size13);
-}
-.radioLabel {
-  font-size: 0 ;
-  display: block;
-}
-.rdBox {
-  fill: none;
-  stroke-width: var(--radio_stroke_width);
-  stroke-linecap: round;
-  stroke: inherit;
-}
-.centerPath {
-  --radio_fill: inherit;
-  stroke-width: var(--radio_inner_stroke_width);
-  transform-origin: center;
-}
-[dir=ltr] .checked .centerPath {
-  animation: circleAnimate var(--zd_transition3) ease forwards;
-}
-[dir=rtl] .checked .centerPath {
-  animation: circleAnimate var(--zd_transition3) ease forwards;
-}
-.rdBoxprimary,
-.hoverEfffect:hover .hoverprimary
-/* .hoverEfffect:focus .hoverprimary  */
-{
-  --radio_stroke_color: var(--zdt_radio_primary_stroke);
-}
-
-.rdBoxdanger,
-.hoverEfffect:hover .hoverdanger
-/* .hoverEfffect:focus .hoverdanger */
- {
-  --radio_stroke_color: var(--zdt_radio_danger_stroke);
-}
-
-.centerPathprimary {
-  --radio_fill: var(--zdt_radio_primary_fill);
-}
-.centerPathdanger {
-  --radio_fill: var(--zdt_radio_danger_fill);
-}
-
-.active:hover .primaryLabel,
-/* .active:focus .primaryLabel, */
-.primarycheckedActive {
-  --label_text_color: var(--zdt_radio_label_primary_text);
-}
-
-.active:hover .dangerLabel,
-/* .active:focus .dangerLabel, */
-.dangercheckedActive {
-  --label_text_color: var(--zdt_radio_label_danger_text);
-}
-
-.text {
-  margin: var(--radio_label_margin);
-}
-@keyframes circleAnimate {
-  0% {
-    transform: scale(0);
-  }
-  100% {
-    transform: scale(1);
-  }
-}