@uncinc/uncinc-react-kitchen-sink 2.3.2 → 2.3.4

package/dist/components/Form/Select/Input/index.js

@@ -3,7 +3,6 @@ import SelectStyled from 'react-select';
 import c from 'classnames';
 import { Field } from 'formik';
 import './style.scss';
-
 const SelectInput = props => {
   const {
     fieldName,
@@ -23,10 +22,10 @@ const SelectInput = props => {
   } = props;
   let {
     selectedOption
-  } = props; // Check if options is [{value, label}] or {value: label}.
+  } = props;
 
+  // Check if options is [{value, label}] or {value: label}.
   let optionsTransformed = options;
-
   if (!Array.isArray(options)) {
     optionsTransformed = Object.keys(options).map(value => {
       const label = options[value];
@@ -35,25 +34,22 @@ const SelectInput = props => {
         label: label
       };
     });
-  } // If the selected option is not set, find the currently selected option by value.
-
+  }
 
+  // If the selected option is not set, find the currently selected option by value.
   if (!selectedOption) {
     if (multiple) {
       const _value = value !== undefined ? value : defaultValue || [];
-
       selectedOption = optionsTransformed.filter(option => {
         return _value.includes(option.value);
       });
     } else {
       const _value = value !== undefined ? value : defaultValue || '';
-
       selectedOption = optionsTransformed.find(option => {
         return option.value === _value;
       });
     }
   }
-
   return /*#__PURE__*/React.createElement(Field, {
     required: true,
     name: fieldName,
@@ -72,7 +68,6 @@ const SelectInput = props => {
       disabled: disabled,
       onChange: e => {
         let value = '';
-
         if (e) {
           if (multiple) {
             value = e.map(item => {
@@ -86,11 +81,9 @@ const SelectInput = props => {
             value = [];
           }
         }
-
         if (onChange) {
           onChange(value);
         }
-
         form.setFieldValue(fieldName, value);
       },
       options: optionsTransformed,
@@ -99,11 +92,9 @@ const SelectInput = props => {
         if (option.disabled) {
           return true;
         }
-
         if (size && selectedOption.length >= size) {
           return true;
         }
-
         return false;
       },
       placeholder: placeholder,
@@ -133,5 +124,4 @@ const SelectInput = props => {
     });
   });
 };
-
 export default SelectInput;

package/dist/components/Form/Select/index.js

@@ -1,11 +1,9 @@
-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); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
 import React from 'react';
 import c from 'classnames';
 import GenericFormElement from '../GenericFormElement';
 import SelectInput from './Input';
 import './style.scss';
-
 const Select = props => {
   const {
     title,
@@ -37,5 +35,4 @@ const Select = props => {
     multiple: multiple
   })));
 };
-
 export default Select;

package/dist/components/Form/Select/stories.js

@@ -20,11 +20,9 @@ export const Select = () => {
     defaultValue: "wine",
     validation: value => {
       let error;
-
       if (!value) {
         error = 'Dit is een vereist veld.';
       }
-
       return error;
     },
     onChange: e => {
@@ -50,11 +48,9 @@ export const SelectMultiple = () => {
     defaultValue: ['wine'],
     validation: value => {
       let error;
-
       if (!value) {
         error = 'Dit is een vereist veld.';
       }
-
       return error;
     },
     onChange: e => {

package/dist/components/Form/TextField/index.js

@@ -4,7 +4,6 @@ import c from 'classnames';
 import withMapping from '../../../Context/withMapping';
 import GenericFormElement from '../GenericFormElement';
 import './style.scss';
-
 const TextField = props => {
   const {
     title,
@@ -23,21 +22,17 @@ const TextField = props => {
     disabled = false
   } = props;
   const type = props.type || "text";
-
   const handleChange = e => {
     const {
       handleChange
     } = props;
-
     if (handleChange) {
       handleChange(e);
     }
-
     if (onChange) {
       onChange(e);
     }
   };
-
   return /*#__PURE__*/React.createElement(GenericFormElement, {
     className: c("TextField", wrapperClassName),
     title: title,
@@ -60,5 +55,4 @@ const TextField = props => {
     disabled: disabled
   }));
 };
-
 export default withMapping(TextField);

package/dist/components/Form/TextField/index.test.js

@@ -4,8 +4,9 @@ import { mount } from 'enzyme';
 import { act } from '@testing-library/react';
 import sinon from 'sinon';
 import sinonChai from 'sinon-chai';
-import { TextField } from './stories'; // Use sinon-chai for spies.
+import { TextField } from './stories';
 
+// Use sinon-chai for spies.
 chai.use(sinonChai);
 describe('<TextField />', () => {
   it('renders a label element', () => {
@@ -41,17 +42,20 @@ describe('<TextField />', () => {
       input.simulate('change');
       await new Promise(resolve => {
         setTimeout(resolve);
-      }); // Submit values, and wait for Formik to complete.
+      });
 
+      // Submit values, and wait for Formik to complete.
       wrapper.find('Formik').simulate('submit');
       await new Promise(resolve => {
         setTimeout(resolve);
       });
     });
-    wrapper.update(); // Should not display an error message.
+    wrapper.update();
 
-    expect(wrapper.find('div.TextField__error')).to.have.lengthOf(0); // Submitted values should contain my value.
+    // Should not display an error message.
+    expect(wrapper.find('div.TextField__error')).to.have.lengthOf(0);
 
+    // Submitted values should contain my value.
     expect(onSubmitCallback).to.have.been.calledWith({
       firstname: value
     });

package/dist/components/Form/TextField/stories.js

@@ -1,5 +1,4 @@
-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); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
 import React from 'react';
 import FormikWrapper from '../FormikWrapper';
 import FormikTextField from '.';
@@ -20,11 +19,9 @@ export const TextField = props => {
     fieldName: "firstname",
     validation: value => {
       let error;
-
       if (!value) {
         error = 'Dit is een vereist veld.';
       }
-
       return error;
     },
     onChange: e => console.log(e.target.value)

package/dist/components/Form/Textarea/index.js

@@ -3,7 +3,6 @@ import { Field } from 'formik';
 import c from 'classnames';
 import GenericFormElement from '../GenericFormElement';
 import './style.scss';
-
 const Textarea = props => {
   const {
     title,
@@ -43,5 +42,4 @@ const Textarea = props => {
     disabled: disabled
   }));
 };
-
 export default Textarea;

package/dist/components/Form/Textarea/stories.js

@@ -13,11 +13,9 @@ export const Textarea = () => {
     fieldName: "message",
     validation: value => {
       let error;
-
       if (!value) {
         error = 'Dit is een vereist veld.';
       }
-
       return error;
     }
   }));

package/dist/components/Hamburger/index.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import './style.scss';
-
 const Hamburger = ({
   onClick,
   numberOfLines
@@ -16,7 +15,6 @@ const Hamburger = ({
 }).map((item, index) => /*#__PURE__*/React.createElement("span", {
   key: index
 }))));
-
 Hamburger.defaultProps = {
   onClick: () => {},
   numberOfLines: 3

package/dist/components/Header/index.js

@@ -4,7 +4,6 @@ import Container from '../Layout/Container';
 import Hamburger from '../Hamburger';
 import NavigationScroll from '../NavigationScroll';
 import './style.scss';
-
 const Header = ({
   logo,
   menu,
@@ -24,18 +23,17 @@ const Header = ({
     "Header--force-hamburger": forceHamburger,
     "show-nav": active
   });
-
   if (forceHamburger) {
-    import('./style-force-hamburger.scss').then(() => {// Do nothing.
+    import('./style-force-hamburger.scss').then(() => {
+      // Do nothing.
     });
   } else {
-    import('./style-default.scss').then(() => {// Do nothing.
+    import('./style-default.scss').then(() => {
+      // Do nothing.
     });
   }
-
   const onUpdateNavigationScroll = (isVisible, hasReachedTop, scrolledPastNavHeight) => {
     const shouldUpdate = state.visible !== isVisible || state.reachedTop !== hasReachedTop || state.scrolledPastNavHeight !== scrolledPastNavHeight;
-
     if (shouldUpdate) {
       setState({
         scrolledPastNavHeight,
@@ -44,7 +42,6 @@ const Header = ({
       });
     }
   };
-
   const headerComponent = /*#__PURE__*/React.createElement("header", {
     className: className
   }, /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement("div", {
@@ -64,7 +61,6 @@ const Header = ({
   }))))), subMenu && /*#__PURE__*/React.createElement("div", {
     className: "Header__subMenu"
   }, /*#__PURE__*/React.createElement(Container, null, subMenu)));
-
   if (withAnimation) {
     return /*#__PURE__*/React.createElement(NavigationScroll, {
       onUpdate: onUpdateNavigationScroll,
@@ -74,5 +70,4 @@ const Header = ({
     return headerComponent;
   }
 };
-
 export default Header;

package/dist/components/Image/Background/index.js

@@ -1,10 +1,8 @@
-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); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
 import React, { useRef } from 'react';
 import c from 'classnames';
 import Picture from '../Picture';
 import './style.scss';
-
 const ImageBackground = ({
   className,
   children,
@@ -13,17 +11,14 @@ const ImageBackground = ({
 }) => {
   const bgElem = useRef(null);
   const imgElement = useRef(null);
-
   const onLoad = e => {
     const src = typeof imgElement.current.currentSrc !== 'undefined' ? imgElement.current.currentSrc : imgElement.current.src;
-
     if (withGradient) {
       bgElem.current.style.backgroundImage = `${withGradient}, url("${src}")`;
     } else {
       bgElem.current.style.backgroundImage = `url("${src}")`;
     }
   };
-
   const classes = c('ImageBackground', className);
   return /*#__PURE__*/React.createElement("div", {
     className: classes,
@@ -35,5 +30,4 @@ const ImageBackground = ({
     imageRef: imgElement
   }, props)), children);
 };
-
 export default ImageBackground;

package/dist/components/Image/LazyLoadWrapper/index.js

@@ -3,7 +3,6 @@ import classNames from 'classnames';
 import LazyLoad from 'react-lazyload';
 import { Map } from 'immutable';
 import './style.scss';
-
 class LazyLoadWrapper extends Component {
   constructor(props) {
     super(props);
@@ -12,7 +11,6 @@ class LazyLoadWrapper extends Component {
       error: false
     };
   }
-
   render() {
     const {
       lazyload: shouldLazyLoad,
@@ -23,38 +21,30 @@ class LazyLoadWrapper extends Component {
       src: "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==",
       alt: "placeholder"
     });
-
     if (!shouldLazyLoad) {
       return children;
     }
-
     const addOnLoadCallback = element => {
       const newProps = {};
-
       newProps.onLoad = event => {
         this.setState({
           loaded: true
         });
       };
-
       newProps.onError = event => {
         this.setState({
           error: true
         });
       };
-
       let elements = [];
       const elementMap = Map(element);
-
       if (Array.isArray(elementMap.getIn(['props', 'children']))) {
         elements = React.Children.map(element.props.children, child => {
           return addOnLoadCallback(child);
         });
       }
-
       return /*#__PURE__*/React.cloneElement(element, newProps, ...elements);
     };
-
     const {
       loaded,
       error
@@ -75,7 +65,5 @@ class LazyLoadWrapper extends Component {
       return addOnLoadCallback(child);
     }))));
   }
-
 }
-
 export default LazyLoadWrapper;

package/dist/components/Image/Picture/index.js

@@ -1,12 +1,10 @@
-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); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
 import React from 'react';
 import Immutable from 'immutable';
 import path from 'path';
 import mimeTypes from './data/ext-to-mime-types.json';
 import './style.scss';
 const FALLBACK_MIME_TYPE = 'image/jpg';
-
 const Picture = ({
   src,
   className,
@@ -29,26 +27,21 @@ const Picture = ({
     alt,
     title
   };
-
   const getImageExtension = url => {
     const sanitizedUrl = url.replace(/\?.*/, '');
     return path.extname(sanitizedUrl).toLowerCase();
   };
-
   const getMimeType = url => {
     const extension = getImageExtension(url);
     return mimeTypes[extension] ? mimeTypes[extension] : FALLBACK_MIME_TYPE;
   };
-
   const isValidImage = url => {
     if (!url) {
       return false;
     }
-
     const extension = getImageExtension(url);
     return Object.keys(mimeTypes).includes(extension);
   };
-
   if (Immutable.Iterable.isIterable(Immutable.fromJS(src))) {
     // Sources have to be defined in a descending order.
     // We sort them from best to worst quality.
@@ -61,20 +54,17 @@ const Picture = ({
       if (image !== false) {
         return image;
       }
-
       ;
       return null;
-    }); // Only render if all our image sources are valid
+    });
 
+    // Only render if all our image sources are valid
     const hasValidSources = sources.count() > 0;
-
     if (!hasValidSources) {
       return null;
     }
-
     const fallback = sources.valueSeq().first();
     let renderedSourcesWebP = [];
-
     if (includeWebP) {
       /* eslint-disable react/no-array-index-key */
       renderedSourcesWebP = sources.map((url, breakpoint) => {
@@ -87,9 +77,8 @@ const Picture = ({
         });
       }).valueSeq();
     }
-    /* eslint-disable react/no-array-index-key */
-
 
+    /* eslint-disable react/no-array-index-key */
     const renderedSources = sources.map((url, breakpoint) => /*#__PURE__*/React.createElement("source", {
       key: breakpoint,
       srcSet: url,
@@ -103,7 +92,6 @@ const Picture = ({
       src: fallback
     })));
   }
-
   if (src && isValidImage(src)) {
     if (includeWebP) {
       const webpUrl = src.replace(/\.(png|gif|jp(e?)g)/, '.webp');
@@ -120,17 +108,14 @@ const Picture = ({
         src: src
       })));
     }
-
     return /*#__PURE__*/React.createElement("img", _extends({}, attrs, {
       onLoad: e => onLoad(e),
       ref: imageRef,
       src: src
     }));
   }
-
   return null;
 };
-
 Picture.defaultProps = {
   onLoad: () => {}
 };

package/dist/components/Image/index.js

@@ -3,21 +3,17 @@ import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import LazyLoadWrapper from './LazyLoadWrapper';
 import Picture from './Picture';
-
 const Image = props => {
   const {
     lazyload
   } = props;
-
   if (lazyload) {
     return /*#__PURE__*/React.createElement(LazyLoadWrapper, {
       lazyload: lazyload
     }, /*#__PURE__*/React.createElement(Picture, props));
   }
-
   return /*#__PURE__*/React.createElement(Picture, props);
 };
-
 Image.propTypes = {
   src: PropTypes.oneOfType([PropTypes.string, ImmutablePropTypes.map]).isRequired,
   lazyload: PropTypes.bool

package/dist/components/InlineMenu/index.js

@@ -1,18 +1,15 @@
 import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import './style.scss';
-
 const InlineMenu = ({
   items,
   scrollToTopOffset
 }) => {
   const [scrollPosition, setSrollPosition] = useState(0);
-
   const handleScroll = () => {
     const position = window.pageYOffset;
     setSrollPosition(position);
   };
-
   useEffect(() => {
     window.addEventListener('scroll', handleScroll);
     return () => {
@@ -20,7 +17,6 @@ const InlineMenu = ({
     };
   }, []);
   if (!items) return null;
-
   const offset = el => {
     const rect = el.getBoundingClientRect();
     const scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
@@ -30,7 +26,6 @@ const InlineMenu = ({
       left: rect.left + scrollLeft
     };
   };
-
   const handleClick = id => {
     const element = document.getElementById(id);
     if (!element) return null;
@@ -39,20 +34,17 @@ const InlineMenu = ({
       behavior: "smooth"
     });
   };
-
   const handleActiveState = (currentId, nextId, activeByDefault) => {
     const element = document.getElementById(currentId);
     const nextElement = document.getElementById(nextId);
     if (!element && activeByDefault) return true;
     if (!element) return null;
-
     if (!nextElement) {
       return scrollPosition > offset(element).top - (scrollToTopOffset + 10);
     } else {
       return (scrollPosition > offset(element).top - (scrollToTopOffset + 10) || activeByDefault) && scrollPosition < offset(nextElement).top - (scrollToTopOffset + 10);
     }
   };
-
   return /*#__PURE__*/React.createElement("nav", {
     className: "InlineMenu"
   }, /*#__PURE__*/React.createElement("ul", {
@@ -67,7 +59,6 @@ const InlineMenu = ({
     key: elementId
   }, menuItemName || 'missing menuItemName'))));
 };
-
 InlineMenu.defaultProps = {
   items: [],
   scrollToTopOffset: 0,

package/dist/components/Layout/Container/index.js

@@ -1,10 +1,8 @@
-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); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import './style.scss';
-
 const Container = ({
   className,
   fluid,
@@ -27,7 +25,6 @@ const Container = ({
     className: classes
   }, props), children);
 };
-
 Container.defaultProps = {
   small: false,
   large: false,

package/dist/components/Layout/Container/stories.js

@@ -4,11 +4,9 @@ import './stories.scss';
 export default {
   title: 'Templates/Grid'
 };
-
 const Filler = () => /*#__PURE__*/React.createElement("div", {
   className: "Filler"
 });
-
 const Columns = () => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
   className: "row"
 }, /*#__PURE__*/React.createElement("div", {
@@ -78,7 +76,6 @@ const Columns = () => /*#__PURE__*/React.createElement(React.Fragment, null, /*#
 }, /*#__PURE__*/React.createElement(Filler, null)), /*#__PURE__*/React.createElement("div", {
   class: "col-1"
 }, /*#__PURE__*/React.createElement(Filler, null))));
-
 export const Default = () => /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(Columns, null));
 export const Small = () => /*#__PURE__*/React.createElement(Container, {
   small: true

package/dist/components/Layout/QuickLayout/Auto/index.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import c from 'classnames';
-
 const QuickLayoutAuto = ({
   children,
   min,
@@ -17,7 +16,6 @@ const QuickLayoutAuto = ({
     }
   }, children);
 };
-
 QuickLayoutAuto.defaultProps = {
   min: '150px',
   gap: '1rem'

package/dist/components/Layout/QuickLayout/Center/index.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import c from 'classnames';
 import './style.scss';
-
 const QuickLayoutCentered = ({
   children,
   className
@@ -11,5 +10,4 @@ const QuickLayoutCentered = ({
     className: classes
   }, children);
 };
-
 export default QuickLayoutCentered;

package/dist/components/Layout/QuickLayout/Clamp/index.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import c from 'classnames';
-
 const QuickLayoutClamp = ({
   children,
   min,
@@ -16,7 +15,6 @@ const QuickLayoutClamp = ({
     }
   }, children);
 };
-
 QuickLayoutClamp.defaultProps = {
   min: '1rem',
   value: '2.5vw',