@stokr/components-library 0.5.6 → 0.5.7

package/dist/ComponentWrapper/ComponentWrapper.styles.js

@@ -1,128 +0,0 @@
-import styled, { css } from 'styled-components/macro';
-import rwd from 'styles/rwd';
-import theme from 'styles/theme';
-export const ComponentWrapper = styled.div`
-  position: relative;
-  padding: 32px;
- // text-align left only from ID
-      text-align: left !important;
-   
-
-  ${rwd.Large`
-    padding: 32px 64px;
-  `}
-
-  ${props => props.borderLeft && css`
-      border-left: 1px solid ${theme.cLightGrey};
-    `}
-
-  ${props => props.borderRight && css`
-      border-right: 1px solid ${theme.cLightGrey};
-    `}
-
-  ${props => props.borderTop && css`
-      border-top: 1px solid ${theme.cLightGrey};
-    `}
-
-  ${props => props.borderBottom && css`
-      border-bottom: 1px solid ${theme.cLightGrey};
-    `}
-
-  ${props => props.noPaddingLeft && css`
-      padding-left: 0 !important;
-    `}
-
-  ${props => props.noPaddingRight && css`
-      padding-right: 0 !important;
-    `}
-
-  ${props => props.noPaddingTop && css`
-      padding-top: 0 !important;
-    `}
-
-  ${props => props.noPaddingBottom && css`
-      padding-bottom: 0 !important;
-    `}
-
-  ${props => props.noPaddingVertical && css`
-      padding-top: 0 !important;
-      padding-bottom: 0 !important;
-    `}
-
-  ${props => props.horizontalPaddingHalf && css`
-      padding-left: 18px !important;
-      padding-right: 18px !important;
-    `}
-
-  ${props => props.noPaddingHorizontal && css`
-      padding-left: 0 !important;
-      padding-right: 0 !important;
-    `}
-
-  ${props => props.paddingVeticalHalf && css`
-      padding-top: 16px !important;
-      padding-bottom: 16px !important;
-    `}
-
-  ${props => props.noPadding && css`
-      padding: 0 !important;
-    `}
-
-  ${props => props.center && css`
-      text-align: center !important;
-    `}
-
-  ${props => props.grow && css`
-      flex-grow: 1;
-    `}
-
-  ${props => props.wrap && css`
-      flex-wrap: wrap;
-    `}
-
-  ${props => props.background && css`
-      background-color: ${theme.cGrey};
-    `}
-
-  ${props => props.fluid && css`
-      width: 100%;
-    `}
-    
-      ${props => props.fluidcenter && css`
-          width: 100% !important;
-          text-align: center !important;
-        `}
-  
-  h4 {
-    width: 50%;
-
-    @media screen and (max-width: 767px) {
-      width: 100%;
-    }
-  }
-
-  @media screen and (max-width: 767px) {
-    padding: 32px;
-
-    ${props => props.investmentNotifications && css`
-        padding: 0;
-      `}
-  }
-
-  ${props => props.alignVertically && css`
-      display: flex;
-      align-items: center;
-    `}
-
-  ${props => props.marginTop && css`
-      margin-top: ${props.marginTop};
-    `}
-
-    ${props => props.isAddMember && css`
-        @media screen and (min-width: 768px) {
-          padding-left: 10px !important;
-          padding-right: 10px !important;
-        }
-      `}
-`;
-export default ComponentWrapper;

package/dist/CryptoAddress/ComponentWrap.js

@@ -1,24 +0,0 @@
-import React, { Fragment } from 'react';
-import PropTypes from 'prop-types';
-import ComponentWrapper from 'components/ComponentWrapper/ComponentWrapper.styles';
-export const ComponentWrap = ({
-  children,
-  wrapped,
-  borderTop,
-  borderBottom
-}) => wrapped ? /*#__PURE__*/React.createElement(ComponentWrapper, {
-  borderTop: borderTop,
-  borderBottom: borderBottom
-}, children) : /*#__PURE__*/React.createElement(Fragment, null, children);
-ComponentWrap.propTypes = {
-  children: PropTypes.node.isRequired,
-  wrapped: PropTypes.bool,
-  borderTop: PropTypes.bool,
-  borderBottom: PropTypes.bool
-};
-ComponentWrap.defaultProps = {
-  wrapped: false,
-  borderTop: false,
-  borderBottom: false
-};
-export default ComponentWrap;

package/dist/CryptoAddress/CryptoAddress.js

@@ -1,124 +0,0 @@
-import React, { useState } from 'react';
-import PropTypes from 'prop-types';
-import { Tooltip } from 'react-tippy';
-import { CopyToClipboard } from 'react-copy-to-clipboard';
-import { Container, Head, Body, Title, Status, TitleSide, AddressWrap, Address, CopyToClipboardButton, DataBox, Value, Equal, InfoBox, DataWrapper, CheckMark, OptionsWrapper } from './CryptoAddress.styles';
-
-// import './tooltip.css' is added in SUF which file? where?
-import RadioWrap from './RadioWrap';
-import ComponentWrap from './ComponentWrap';
-import getShortAddress from '../../utils/get-short-address';
-export const CryptoAddress = ({
-  title,
-  status,
-  address,
-  data,
-  info,
-  wrapped,
-  borderTop,
-  borderBottom,
-  radio,
-  sideOptions,
-  src,
-  //merge from SUF
-  noBody,
-  noBorderBottom,
-  flexHead,
-  //merge from IIS
-  fontSize,
-  titleColor
-}) => {
-  const [copiedAddressToClipboard, setCopiedAddressToClipboard] = useState(false);
-  return /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(RadioWrap, {
-    radio: radio
-  }, /*#__PURE__*/React.createElement(ComponentWrap, {
-    wrapped: wrapped,
-    borderTop: borderTop,
-    borderBottom: !noBorderBottom && borderBottom
-  }, /*#__PURE__*/React.createElement(DataWrapper, {
-    withOptions: !!sideOptions
-  }, radio && !radio.hide && /*#__PURE__*/React.createElement(CheckMark, null), /*#__PURE__*/React.createElement(Head, {
-    noBody: noBody,
-    flexHead: flexHead
-  }, /*#__PURE__*/React.createElement(Title, {
-    color: titleColor
-  }, title, status && /*#__PURE__*/React.createElement(Status, null, status)), /*#__PURE__*/React.createElement(TitleSide, null, address && /*#__PURE__*/React.createElement(AddressWrap, null, /*#__PURE__*/React.createElement(Tooltip, {
-    position: "top",
-    title: address,
-    theme: "light",
-    arrow: true,
-    duration: 200
-  }, /*#__PURE__*/React.createElement(Address, null, getShortAddress(address))), /*#__PURE__*/React.createElement("div", {
-    onClick: e => e.preventDefault()
-  }, /*#__PURE__*/React.createElement(Tooltip, {
-    position: "top",
-    title: copiedAddressToClipboard ? 'Copied to clipboard!' : 'Click to copy address to clipboard',
-    theme: "light",
-    arrow: true,
-    hideOnClick: false,
-    onHidden: () => setCopiedAddressToClipboard(false),
-    duration: 200
-  }, /*#__PURE__*/React.createElement(CopyToClipboard, {
-    text: address,
-    onCopy: () => setCopiedAddressToClipboard(true)
-  }, /*#__PURE__*/React.createElement(CopyToClipboardButton, null))))), src && /*#__PURE__*/React.createElement("img", {
-    src: src,
-    alt: "project logo",
-    height: "50",
-    width: 100,
-    style: {
-      objectFit: 'contain'
-    }
-  }))), /*#__PURE__*/React.createElement(Body, {
-    noBody: noBody
-  }, /*#__PURE__*/React.createElement(DataBox, null, data.value && /*#__PURE__*/React.createElement(Value, null, data.unit && `${data.unit} `, data.value), data.eqValue && /*#__PURE__*/React.createElement(Equal, null, '= ', data.eqUnit && `${data.eqUnit} `, data.eqValue)), /*#__PURE__*/React.createElement(InfoBox, null, /*#__PURE__*/React.createElement(Value, null, info.unit && /*#__PURE__*/React.createElement("strong", null, info.unit), info.value), info.eqValue && /*#__PURE__*/React.createElement(Equal, null, info.noEqualsToSign ? ' ' : '= ', info.eqUnit && /*#__PURE__*/React.createElement("strong", null, info.eqUnit), info.eqValue))), sideOptions && /*#__PURE__*/React.createElement(OptionsWrapper, null, sideOptions)))));
-};
-const dataShape = PropTypes.shape({
-  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
-  unit: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  eqValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  eqUnit: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
-});
-CryptoAddress.propTypes = {
-  title: PropTypes.string.isRequired,
-  status: PropTypes.string,
-  address: PropTypes.string.isRequired,
-  wrapped: PropTypes.bool,
-  borderTop: PropTypes.bool,
-  borderBottom: PropTypes.bool,
-  radio: RadioWrap.propTypes.radio,
-  data: dataShape,
-  info: dataShape,
-  sideOptions: PropTypes.node,
-  // fontSize from IIS
-  fontSize: PropTypes.number
-};
-//address not required in IIS, instead wrapping {address &&( .. now doing both which is redundant
-
-CryptoAddress.defaultProps = {
-  status: '',
-  wrapped: false,
-  borderTop: false,
-  borderBottom: false,
-  radio: null,
-  address: '',
-  data: {
-    value: '',
-    unit: '',
-    eqValue: '',
-    eqUnit: ''
-  },
-  info: {
-    value: '',
-    unit: '',
-    eqValue: '',
-    eqUnit: ''
-  },
-  // fontSize from IIS
-  fontSize: 22,
-  sideOptions: null
-};
-export const MemoCryptoAddress = /*#__PURE__*/React.memo(CryptoAddress);
-export default CryptoAddress;
-
-//defaultValue of info: { value:'-'} in ISS and VD

package/dist/CryptoAddress/CryptoAddress.stories.js

@@ -1,163 +0,0 @@
-import React from 'react';
-import CryptoAddress from './CryptoAddress';
-import { ComponentWrapper } from '../ComponentWrapper/ComponentWrapper.styles';
-export default {
-  title: 'Components Library/Crypto Address',
-  component: CryptoAddress,
-  argTypes: {
-    title: {
-      type: 'string',
-      defaultValue: '',
-      required: true
-    },
-    status: {
-      type: 'string',
-      defaultValue: ''
-    },
-    address: {
-      type: 'string',
-      defaultValue: '',
-      required: true
-    },
-    capital: {
-      type: 'number',
-      defaultValue: 0,
-      required: true
-    },
-    wrapped: {
-      type: 'boolean',
-      defaultValue: false
-    },
-    borderTop: {
-      type: 'boolean',
-      defaultValue: false
-    },
-    borderBottom: {
-      type: 'boolean',
-      defaultValue: false
-    },
-    radio: {
-      type: 'shape',
-      defaultValue: null
-    },
-    data: {
-      type: 'shape',
-      defaultValue: {}
-    },
-    info: {
-      type: 'shape',
-      defaultValue: {}
-    },
-    sideOptions: {
-      type: 'node',
-      defaultValue: null
-    }
-  }
-};
-//  info & data Shape defaults {
-//     value: '',
-//     unit: '',
-//     eqValue: '',
-//     eqUnit: '',
-//   },
-
-//  From Radiowrap.js - Radio shape
-//   radio: PropTypes.shape({
-//     id: PropTypes.string.isRequired,
-//     name: PropTypes.string,
-//     value: PropTypes.string,
-//     checked: PropTypes.bool,
-//     onChange: PropTypes.func,
-//     onBlur: PropTypes.func,
-//     hide: PropTypes.bool,
-//   }),
-// }
-
-const Template = args => /*#__PURE__*/React.createElement(ComponentWrapper, null, /*#__PURE__*/React.createElement(CryptoAddress, args));
-export const CryptoAddressOverview = Template.bind({});
-CryptoAddressOverview.args = {
-  title: 'A Title',
-  status: 'Status',
-  address: 'Address',
-  capital: 100,
-  data: {
-    value: '1',
-    unit: '€',
-    eqValue: '2',
-    eqUnit: '$'
-  },
-  info: {
-    value: '3',
-    unit: '$',
-    eqValue: '4',
-    eqUnit: '€'
-  }
-};
-export const CryptoAddressBorders = Template.bind({});
-CryptoAddressBorders.args = {
-  title: 'A Title',
-  status: 'Status',
-  address: 'Address',
-  capital: 100,
-  data: {
-    value: '1',
-    unit: '€',
-    eqValue: '2',
-    eqUnit: '$'
-  },
-  info: {
-    value: '3',
-    unit: '$',
-    eqValue: '4',
-    eqUnit: '€'
-  },
-  wrapped: true,
-  borderTop: true,
-  borderBottom: true
-};
-export const CryptoAddressRadioWrap = Template.bind({});
-CryptoAddressRadioWrap.args = {
-  title: 'A Title',
-  status: 'Status',
-  address: 'Address',
-  capital: 100,
-  data: {
-    value: '1',
-    unit: '€',
-    eqValue: '2',
-    eqUnit: '$'
-  },
-  info: {
-    value: '3',
-    unit: '$',
-    eqValue: '4',
-    eqUnit: '€'
-  },
-  wrapped: true,
-  borderTop: true,
-  borderBottom: true,
-  radio: {
-    id: '',
-    name: 'hover to see',
-    value: 'radiochoice',
-    checked: true,
-    hide: false,
-    onChange: () => {}
-  }
-};
-
-//  From Radiowrap.js - Radio shape
-//   radio: PropTypes.shape({
-//     id: PropTypes.string.isRequired,
-//     name: PropTypes.string,
-//     value: PropTypes.string,
-//     checked: PropTypes.bool,
-//     onChange: PropTypes.func,
-//     onBlur: PropTypes.func,
-//     hide: PropTypes.bool,
-//   }),
-// }
-
-// doublecheck:
-// weird 'Address' showing up
-// radio checked not working