@ntbjs/react-components 2.0.0-rc.3 → 2.0.0-rc.30

package/cjs/components/inputs/CompactStarRating/CompactStarRating.styled.js

@@ -1,258 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var styled = require('styled-components');
-var defaultTheme = require('../../../utils/defaultTheme.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-let _ = t => t,
-  _t,
-  _t2,
-  _t3,
-  _t4,
-  _t5,
-  _t6,
-  _t7,
-  _t8,
-  _t9,
-  _t10,
-  _t11,
-  _t12,
-  _t13,
-  _t14,
-  _t15,
-  _t16,
-  _t17,
-  _t18,
-  _t19,
-  _t20,
-  _t21,
-  _t22,
-  _t23;
-const fadeIn = styled.keyframes(_t || (_t = _`
-  from {
-    background-color: ${0};
-  }
-  to {
-    background-color: ${0};
-  }
-`), props => props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)'), props => props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)'));
-const fadeOut = styled.keyframes(_t2 || (_t2 = _`
-  from {
-    background-color: ${0};
-  }
-  to {
-    background-color: ${0};
-  }
-`), props => props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)'), props => props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)'));
-const fadeInCheck = styled.keyframes(_t3 || (_t3 = _`
-  from {
-    opacity: 0
-  }
-  to {
-    opacity: 1
-  }
-`));
-const fadeOutCheck = styled.keyframes(_t4 || (_t4 = _`
-  from {
-    opacity: 1
-  }
-  to {
-    opacity: 0
-  }
-`));
-const CompactStarRating = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_t5 || (_t5 = _`
-  font-family: ${0};
-  font-size: 1rem;
-  font-weight: 500;
-  height: 24px;
-  width: 100%;
-  display: flex;
-
-  align-items: center;
-  input[type='number'] {
-    position: absolute;
-    opacity: 0;
-    pointer-events: none;
-    margin: 0;
-  }
-
-  ${0}
-
-  ${0}
-`), props => props.theme.primaryFontFamily, props => props.readOnly && styled.css(_t6 || (_t6 = _`
-      pointer-events: none;
-    `)), props => props.disabled && styled.css(_t7 || (_t7 = _`
-      opacity: 0.5;
-      cursor: not-allowed;
-    `)));
-const labelWidth = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_t8 || (_t8 = _`
-  width: 33.33%;
-  display: flex;
-  align-items: center;
-  text-align: left;
-  font: normal normal normal 14px/16px Roboto;
-  letter-spacing: 0px;
-  padding: 0;
-  height: 19px;
-  cursor: default;
-  justify-content: space-between;
-  ${0};
-  ${0}
-`), props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700')), props => props.disabled && styled.css(_t9 || (_t9 = _`
-      cursor: not-allowed;
-    `)));
-const SuccessContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_t10 || (_t10 = _`
-  opacity: 1;
-  pointer-events: none;
-  display: flex;
-  opacity: ${0};
-  animation: ${0} 0.5s ease-in-out;
-  transition: opacity 0.5s ease-in-out;
-  margin-right: 5px;
-  ${0}
-  > svg {
-    width: 13px;
-  }
-`), props => props.fadeIn ? 0 : 1, props => props.fadeIn ? fadeOutCheck : fadeInCheck, props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500')));
-const starsWidth = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_t11 || (_t11 = _`
-  display: flex;
-  width: 66.66%;
-  border-radius: 3px;
-  height: 24px;
-  align-items: center;
-  padding-left: 8px;
-  box-sizing: border-box;
-  border: 1px solid;
-
-  ${0}
-
-  ${0}
-
-  ${0}
-
-  ${0}
-
-  ${0}
-  &&:not(:hover):not(:focus) {
-    ${0};
-    ${0};
-  }
-  &&:hover:not(:focus) {
-    ${0}
-
-    ${0};
-
-    ${0};
-
-    ${0};
-  }
-
-  ${0}
-`), props => props.readOnly && styled.css(_t12 || (_t12 = _`
-      border: none;
-    `)), props => props.theme.themeProp('border-color', props.theme.getColor('gray-900'), props.theme.getColor('white')), props => props.type === 'success' && styled.css(_t13 || (_t13 = _`
-      animation: ${0} 0.5s ease-in-out;
-    `), props => props.success ? fadeIn : fadeOut), props => props.type === 'error' && styled.css(_t14 || (_t14 = _`
-      ${0};
-      ${0}
-    `), props.theme.themeProp('background', '#7F1B1B', '#FBEAE6'), props.theme.themeProp('border-color', '#7f1b1b', '#FBEAE6')), props => props.type === 'warning' && styled.css(_t15 || (_t15 = _`
-      ${0};
-      ${0}
-    `), props.theme.themeProp('background', '#634E01', '#FFFDE8'), props.theme.themeProp('border-color', '#2F2402 ', '#FFFDE8')), props => props.edit && props.theme.themeProp('background', 'rgba(39,39,42, 0.7)', 'rgba(244,244,245, 0.3)'), props => props.edit && props.theme.themeProp('border-color', 'rgba(39,39,42, 0.7)', 'rgba(228,228,231, 0.3)'), props => props.edit && props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100')), props => props.edit && props.theme.themeProp('border-color', props.theme.getColor('gray-700'), props.theme.getColor('gray-100')), props => props.type === 'warning' && !props.readOnly && props.theme.themeProp('background', '#806403', '#FFFEBF'), props => props.type === 'error' && !props.readOnly && props.theme.themeProp('background', '#901d1d', '#f7d5d0'), props => props.readOnly && styled.css(_t16 || (_t16 = _`
-      cursor: default;
-      ${0}
-    `), props => props.theme.themeProp('border-color', 'rgba(0, 0, 0, 0)', props.theme.getColor('white'))));
-const Star = styled__default["default"].button.attrs(defaultTheme.applyDefaultTheme)(_t17 || (_t17 = _`
-  display: flex;
-  align-items: center;
-  background: none;
-  border: none;
-  cursor: pointer;
-  padding: 0;
-
-  svg {
-    height: 12px;
-    padding-left: 4px;
-    transition: color 250ms;
-  }
-
-  ${0};
-
-  ${0};
-
-  ${0};
-
-  ${0};
-
-  ${0}
-
-  ${0}
-`), props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black')), props => props.type === 'warning' && props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black')), props => props.type === 'warning' && props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black')), props => props.hover && props.theme.themeProp('color', props.theme.getColor('orange-500'), props.theme.getColor('orange-500')), props => props.readOnly && styled.css(_t18 || (_t18 = _`
-      pointer-events: none;
-    `)), props => props.disabled && styled.css(_t19 || (_t19 = _`
-      button {
-        cursor: not-allowed;
-      }
-      > * {
-        cursor: not-allowed;
-      }
-    `)));
-const StarFill = styled__default["default"].button.attrs(defaultTheme.applyDefaultTheme)(_t20 || (_t20 = _`
-  display: flex;
-  align-items: center;
-  background: none;
-  border: none;
-  cursor: pointer;
-  padding: 0;
-
-  svg {
-    height: 12px;
-    padding-left: 4px;
-    transition: color 250ms;
-  }
-
-  ${0};
-
-  ${0};
-
-  ${0};
-
-  ${0};
-
-  ${0}
-
-  ${0}
-`), props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black')), props => props.type === 'error' && props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black')), props => props.type === 'warning' && props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black')), props => props.hover && props.theme.themeProp('color', props.theme.getColor('orange-500'), props.theme.getColor('orange-500')), props => props.readOnly && styled.css(_t21 || (_t21 = _`
-      pointer-events: none;
-    `)), props => props.disabled && styled.css(_t22 || (_t22 = _`
-      button {
-        cursor: not-allowed;
-      }
-      > * {
-        cursor: not-allowed;
-      }
-    `)));
-styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_t23 || (_t23 = _`
-  opacity: 1;
-  pointer-events: none;
-  margin-left: auto;
-  opacity: ${0};
-  animation: ${0} 0.5s ease-in-out;
-  transition: opacity 0.5s ease-in-out;
-  ${0}
-  > svg {
-    width: 13px;
-  }
-`), props => props.type === 'success' ? 0 : 1, props => props.type === 'success' ? fadeOutCheck : fadeInCheck, props => props.theme.themeProp('color', props.theme.getColor('emerald-200'), props.theme.getColor('emerald-500')));
-
-exports.CompactStarRating = CompactStarRating;
-exports.Star = Star;
-exports.StarFill = StarFill;
-exports.SuccessContainer = SuccessContainer;
-exports.labelWidth = labelWidth;
-exports.starsWidth = starsWidth;

package/cjs/components/inputs/CompactStarRating/inputs/CompactStarRating/index.js

@@ -1,9 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var CompactStarRating = require('../../CompactStarRating.js');
-
-
-
-exports["default"] = CompactStarRating["default"];

package/cjs/components/inputs/CompactTextInput/CompactTextInput.js

@@ -1,187 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
-var lodash = require('lodash');
-var nanoid = require('nanoid');
-var index$2 = require('../../../node_modules/prop-types/index.js');
-var index = require('../../../node_modules/react/index.js');
-var editNote = require('../../../icons/edit-note.svg.js');
-var link = require('../../../icons/link.svg.js');
-var CompactTextInput_styled = require('./CompactTextInput.styled.js');
-var index$1 = require('../../../_virtual/index.js');
-var Tooltip = require('../../data/Tooltip/Tooltip.js');
-var Popover = require('../../data/Popover/Popover.js');
-
-const _excluded = ["label", "inputType", "name", "defaultValue", "value", "placeholder", "link", "linkTarget", "linkHandler", "activeLinkHandler", "autoSelect", "readOnly", "disabled", "edit", "type", "descriptionToolTip", "bold", "hidden", "onChange", "onFocus", "onBlur", "loadingIcon", "successIcon"];
-const CompactTextInput = index["default"].forwardRef(function CompactTextInput(_ref, forwardedRef) {
-  let {
-      label,
-      inputType,
-      name,
-      defaultValue,
-      value,
-      placeholder,
-      link: link$1,
-      linkTarget,
-      linkHandler,
-      activeLinkHandler,
-      autoSelect,
-      readOnly,
-      disabled,
-      edit,
-      type,
-      descriptionToolTip,
-      bold,
-      hidden,
-      onChange: onChangeProp,
-      onFocus: onFocusProp,
-      onBlur: onBlurProp,
-      loadingIcon,
-      successIcon
-    } = _ref,
-    props = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  const [uniqueId] = index$1.react.exports.useState(nanoid.nanoid());
-  const [currentValue, setCurrentValue] = index$1.react.exports.useState();
-  const [autoFocus, setAutoFocus] = index$1.react.exports.useState(false);
-  const memoizedDescriptionToolTip = index$1.react.exports.useMemo(() => {
-    return descriptionToolTip;
-  }, [descriptionToolTip]);
-  index$1.react.exports.useEffect(() => {
-    setCurrentValue(value || defaultValue);
-    setAutoFocus(false);
-  }, [value, defaultValue]);
-  const onChange = index$1.react.exports.useCallback(event => {
-    setCurrentValue(event.target.value);
-    if (!autoFocus) {
-      setAutoFocus(true);
-    }
-    if (lodash.isFunction(onChangeProp)) {
-      onChangeProp(event);
-    }
-  }, [onChangeProp]);
-  const onFocus = index$1.react.exports.useCallback(event => {
-    if (autoSelect) {
-      event.target.select();
-    }
-    if (lodash.isFunction(onFocusProp)) {
-      onFocusProp(event);
-    }
-  }, [autoSelect, readOnly, onFocusProp]);
-  const onBlur = index$1.react.exports.useCallback(event => {
-    if (lodash.isFunction(onBlurProp)) {
-      onBlurProp(event);
-    }
-  }, [onBlurProp]);
-  const input = () => {
-    return index["default"].createElement(CompactTextInput_styled.Input, {
-      ref: forwardedRef,
-      id: uniqueId,
-      key: uniqueId,
-      autoFocus: autoFocus,
-      inputType: inputType,
-      name: name,
-      readOnly: readOnly,
-      disabled: disabled,
-      edit: edit,
-      placeholder: placeholder,
-      defaultValue: defaultValue,
-      value: value,
-      type: type,
-      bold: bold,
-      hasLink: !lodash.isEmpty(link$1),
-      onFocus: onFocus,
-      onChange: onChange,
-      onBlur: onBlur
-    });
-  };
-  if (hidden) return null;
-  return index["default"].createElement(CompactTextInput_styled.CompactTextInput, props, label && index["default"].createElement(CompactTextInput_styled.Label, {
-    htmlFor: uniqueId,
-    disabled: disabled
-  }, label, index["default"].createElement(CompactTextInput_styled.SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), index["default"].createElement(CompactTextInput_styled.InputContainer, {
-    $hasLabel: !lodash.isEmpty(label)
-  }, !memoizedDescriptionToolTip && !link$1 && input(), memoizedDescriptionToolTip && !link$1 && index["default"].createElement("div", null, index["default"].createElement(Tooltip["default"], {
-    content: memoizedDescriptionToolTip,
-    key: "tooltip1",
-    placement: "bottom-end",
-    trigger: 'mouseenter',
-    zIndex: 999999
-  }, input())), link$1 && !readOnly && index["default"].createElement("div", null, index["default"].createElement(Popover["default"], {
-    arrow: false,
-    content: index["default"].createElement(CompactTextInput_styled.LinkPopoverContainer, null, activeLinkHandler ? index["default"].createElement(CompactTextInput_styled.StyledLink, {
-      href: link$1,
-      target: linkTarget,
-      onClick: e => {
-        if (activeLinkHandler) {
-          e.preventDefault();
-          linkHandler();
-        }
-      },
-      rel: "noreferrer"
-    }, index["default"].createElement(link.ReactComponent, null), currentValue) : index["default"].createElement(CompactTextInput_styled.StyledLink, {
-      href: link$1,
-      target: linkTarget,
-      rel: "noreferrer"
-    }, index["default"].createElement(link.ReactComponent, null), currentValue)),
-    key: "tooltip2",
-    placement: "bottom-start",
-    trigger: "focusin",
-    zIndex: 999999,
-    interactive: true
-  }, input())), link$1 && readOnly && index["default"].createElement(CompactTextInput_styled.ReadOnlyLinkContainer, null, index["default"].createElement(CompactTextInput_styled.StyledLink, {
-    href: link$1,
-    rel: "noreferrer",
-    style: {
-      display: 'inline-block'
-    },
-    target: linkTarget
-  }, currentValue)), !readOnly && !disabled && index["default"].createElement(index["default"].Fragment, null, index["default"].createElement(CompactTextInput_styled.InputIconContainer, {
-    type: type
-  }, index["default"].createElement(editNote.ReactComponent, null)), lodash.isEmpty(label) && index["default"].createElement(CompactTextInput_styled.InputSuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon))));
-});
-CompactTextInput.propTypes = process.env.NODE_ENV !== "production" ? {
-  label: index$2["default"].string,
-  success: index$2["default"].bool,
-  inputType: index$2["default"].string,
-  name: index$2["default"].string,
-  defaultValue: index$2["default"].string,
-  value: index$2["default"].string,
-  placeholder: index$2["default"].string,
-  link: index$2["default"].string,
-  linkTarget: index$2["default"].oneOf(['_self', '_blank', '_parent', '_top']),
-  linkHandler: index$2["default"].func,
-  activeLinkHandler: index$2["default"].bool,
-  autoSelect: index$2["default"].bool,
-  readOnly: index$2["default"].bool,
-  disabled: index$2["default"].bool,
-  edit: index$2["default"].bool,
-  warning: index$2["default"].oneOfType([index$2["default"].bool, index$2["default"].string]),
-  bold: index$2["default"].bool,
-  hidden: index$2["default"].bool,
-  onChange: index$2["default"].func,
-  onFocus: index$2["default"].func,
-  onBlur: index$2["default"].func,
-  type: index$2["default"].oneOf(['', 'error', 'warning', 'loading', 'success']),
-  descriptionToolTip: index$2["default"].string,
-  loadingIcon: index$2["default"].element,
-  successIcon: index$2["default"].element
-} : {};
-CompactTextInput.defaultProps = {
-  inputType: 'text',
-  autoSelect: true,
-  linkTarget: '_self',
-  bold: false,
-  readOnly: false,
-  descriptionToolTip: '',
-  edit: false,
-  hidden: false,
-  type: '',
-  linkHandler: () => {},
-  activeLinkHandler: false,
-  onChange: () => {}
-};
-var CompactTextInput$1 = CompactTextInput;
-
-exports["default"] = CompactTextInput$1;