@uncinc/uncinc-react-kitchen-sink 2.4.0 → 2.4.2

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

@@ -1,17 +1,23 @@
-import React from 'react';
-import c from 'classnames';
-const QuickLayoutClamp = ({
-  children,
-  min,
-  value,
-  max,
-  className
-}) => {
-  const classes = c('QuickLayoutClamp', className && className);
-  return /*#__PURE__*/React.createElement("div", {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var QuickLayoutClamp = function QuickLayoutClamp(_ref) {
+  var children = _ref.children,
+    min = _ref.min,
+    value = _ref.value,
+    max = _ref.max,
+    className = _ref.className;
+  var classes = (0, _classnames.default)('QuickLayoutClamp', className && className);
+  return /*#__PURE__*/_react.default.createElement("div", {
     className: classes,
     style: {
-      fontSize: `clamp(${min}, ${value}, ${max})`
+      fontSize: "clamp(".concat(min, ", ").concat(value, ", ").concat(max, ")")
     }
   }, children);
 };
@@ -20,4 +26,5 @@ QuickLayoutClamp.defaultProps = {
   value: '2.5vw',
   max: '5rem'
 };
-export default QuickLayoutClamp;
+var _default = QuickLayoutClamp;
+exports.default = _default;

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

@@ -1,18 +1,24 @@
-import React from 'react';
-import c from 'classnames';
-import './style.scss';
-const QuickLayoutSidebar = ({
-  children,
-  min,
-  max,
-  className
-}) => {
-  const classes = c('QuickLayoutSidebar', className && className);
-  return /*#__PURE__*/React.createElement("div", {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+require("./style.scss");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var QuickLayoutSidebar = function QuickLayoutSidebar(_ref) {
+  var children = _ref.children,
+    min = _ref.min,
+    max = _ref.max,
+    className = _ref.className;
+  var classes = (0, _classnames.default)('QuickLayoutSidebar', className && className);
+  return /*#__PURE__*/_react.default.createElement("div", {
     className: classes,
     style: {
       display: 'grid',
-      gridTemplateColumns: `minmax(${min}, ${max}) 1fr`
+      gridTemplateColumns: "minmax(".concat(min, ", ").concat(max, ") 1fr")
     }
   }, children);
 };
@@ -20,4 +26,5 @@ QuickLayoutSidebar.defaultProps = {
   min: '2.5rem',
   max: '25%'
 };
-export default QuickLayoutSidebar;
+var _default = QuickLayoutSidebar;
+exports.default = _default;

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

@@ -1,18 +1,24 @@
-import React from 'react';
-import c from 'classnames';
-import './style.scss';
-const QuickLayoutSpaceBetween = ({
-  children,
-  gap,
-  items,
-  className
-}) => {
-  const classes = c('QuickLayoutSpaceBetween', className && className);
-  return /*#__PURE__*/React.createElement("div", {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+require("./style.scss");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var QuickLayoutSpaceBetween = function QuickLayoutSpaceBetween(_ref) {
+  var children = _ref.children,
+    gap = _ref.gap,
+    items = _ref.items,
+    className = _ref.className;
+  var classes = (0, _classnames.default)('QuickLayoutSpaceBetween', className && className);
+  return /*#__PURE__*/_react.default.createElement("div", {
     className: classes,
     style: {
       gridGap: gap,
-      gridTemplateColumns: `repeat(${items}, 1fr)`
+      gridTemplateColumns: "repeat(".concat(items, ", 1fr)")
     }
   }, children);
 };
@@ -20,4 +26,5 @@ QuickLayoutSpaceBetween.defaultProps = {
   gap: '2.5rem',
   items: '3'
 };
-export default QuickLayoutSpaceBetween;
+var _default = QuickLayoutSpaceBetween;
+exports.default = _default;

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

@@ -1,15 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+require("./style.scss");
+var _excluded = ["children", "className"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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 './style.scss';
-const QuickLayoutStack = ({
-  children,
-  className,
-  ...props
-}) => {
-  const classes = c('QuickLayoutStack', className && className);
-  return /*#__PURE__*/React.createElement("div", _extends({
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var QuickLayoutStack = function QuickLayoutStack(_ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var classes = (0, _classnames.default)('QuickLayoutStack', className && className);
+  return /*#__PURE__*/_react.default.createElement("div", _extends({
     className: classes
   }, props), children);
 };
-export default QuickLayoutStack;
+var _default = QuickLayoutStack;
+exports.default = _default;

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

@@ -1,17 +1,23 @@
-import React from 'react';
-import c from 'classnames';
-import './style.scss';
-const QuickLayoutWrap = ({
-  children,
-  min,
-  stretched,
-  className
-}) => {
-  const classes = c('QuickLayoutWrap', className && className);
-  return /*#__PURE__*/React.createElement("div", {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+require("./style.scss");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var QuickLayoutWrap = function QuickLayoutWrap(_ref) {
+  var children = _ref.children,
+    min = _ref.min,
+    stretched = _ref.stretched,
+    className = _ref.className;
+  var classes = (0, _classnames.default)('QuickLayoutWrap', className && className);
+  return /*#__PURE__*/_react.default.createElement("div", {
     className: classes
-  }, children.map(child => {
-    return /*#__PURE__*/React.createElement("div", {
+  }, children.map(function (child) {
+    return /*#__PURE__*/_react.default.createElement("div", {
       style: {
         flexGrow: stretched ? 1 : 0,
         flexShrink: 1,
@@ -24,4 +30,5 @@ QuickLayoutWrap.defaultProps = {
   min: '2.5rem',
   stretched: true
 };
-export default QuickLayoutWrap;
+var _default = QuickLayoutWrap;
+exports.default = _default;

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

@@ -1,16 +1,25 @@
-import React from 'react';
-import QuickLayoutCentered from './Center';
-import QuickLayoutWrap from './Wrap';
-import QuickLayoutSidebar from './Sidebar';
-import QuickLayoutStack from './Stack';
-import QuickLayoutAuto from './Auto';
-import QuickLayoutSpaceBetween from './SpaceBetween';
-import QuickLayoutClamp from './Clamp';
-const QuickLayout = ({
-  type,
-  children,
-  ...props
-}) => {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Center = _interopRequireDefault(require("./Center"));
+var _Wrap = _interopRequireDefault(require("./Wrap"));
+var _Sidebar = _interopRequireDefault(require("./Sidebar"));
+var _Stack = _interopRequireDefault(require("./Stack"));
+var _Auto = _interopRequireDefault(require("./Auto"));
+var _SpaceBetween = _interopRequireDefault(require("./SpaceBetween"));
+var _Clamp = _interopRequireDefault(require("./Clamp"));
+var _excluded = ["type", "children"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var QuickLayout = function QuickLayout(_ref) {
+  var type = _ref.type,
+    children = _ref.children,
+    props = _objectWithoutProperties(_ref, _excluded);
   switch (type) {
     /**
      * @description This component centers the children horizontally and vertically within the component.
@@ -18,7 +27,7 @@ const QuickLayout = ({
      */
     case 'center':
       {
-        return /*#__PURE__*/React.createElement(QuickLayoutCentered, null, children);
+        return /*#__PURE__*/_react.default.createElement(_Center.default, null, children);
       }
 
     /**
@@ -32,7 +41,7 @@ const QuickLayout = ({
      */
     case 'wrap':
       {
-        return /*#__PURE__*/React.createElement(QuickLayoutWrap, props, children);
+        return /*#__PURE__*/_react.default.createElement(_Wrap.default, props, children);
       }
 
     /**
@@ -46,7 +55,7 @@ const QuickLayout = ({
      */
     case 'sidebar':
       {
-        return /*#__PURE__*/React.createElement(QuickLayoutSidebar, props, children);
+        return /*#__PURE__*/_react.default.createElement(_Sidebar.default, props, children);
       }
 
     /**
@@ -59,7 +68,7 @@ const QuickLayout = ({
      */
     case 'stack':
       {
-        return /*#__PURE__*/React.createElement(QuickLayoutStack, props, children);
+        return /*#__PURE__*/_react.default.createElement(_Stack.default, props, children);
       }
 
     /**
@@ -70,7 +79,7 @@ const QuickLayout = ({
      */
     case 'auto':
       {
-        return /*#__PURE__*/React.createElement(QuickLayoutAuto, props, children);
+        return /*#__PURE__*/_react.default.createElement(_Auto.default, props, children);
       }
 
     /**
@@ -85,7 +94,7 @@ const QuickLayout = ({
      */
     case 'spaceBetween':
       {
-        return /*#__PURE__*/React.createElement(QuickLayoutSpaceBetween, props, children);
+        return /*#__PURE__*/_react.default.createElement(_SpaceBetween.default, props, children);
       }
 
     /**
@@ -97,7 +106,7 @@ const QuickLayout = ({
      */
     case 'clamp':
       {
-        return /*#__PURE__*/React.createElement(QuickLayoutClamp, props, children);
+        return /*#__PURE__*/_react.default.createElement(_Clamp.default, props, children);
       }
     default:
       {
@@ -108,4 +117,5 @@ const QuickLayout = ({
 QuickLayout.defaultProps = {
   type: ''
 };
-export default QuickLayout;
+var _default = QuickLayout;
+exports.default = _default;

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

@@ -1,72 +1,104 @@
-import React from 'react';
-import QuickLayout from '.';
-export default {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Wrap = exports.Stack = exports.SpaceBetween = exports.Sidebar = exports.Clamp = exports.Center = exports.Auto = exports.AspectRatio = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = _interopRequireDefault(require("."));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _default = {
   title: 'Templates/QuickLayout'
 };
-export const Center = () => /*#__PURE__*/React.createElement(QuickLayout, {
-  type: "center"
-}, /*#__PURE__*/React.createElement("div", {
-  className: "box turqoise"
-}, "Wow, i'm centered!"));
-export const Wrap = () => /*#__PURE__*/React.createElement(QuickLayout, {
-  type: "wrap",
-  min: "150px",
-  stretched: true
-}, /*#__PURE__*/React.createElement("div", {
-  className: "box box__full-height sunflower"
-}, "1"), /*#__PURE__*/React.createElement("div", {
-  className: "box box__full-height midnightblue"
-}, "2"), /*#__PURE__*/React.createElement("div", {
-  className: "box box__full-height belizehole"
-}, "3"));
-export const Sidebar = () => /*#__PURE__*/React.createElement(QuickLayout, {
-  type: "sidebar"
-}, /*#__PURE__*/React.createElement("div", {
-  className: "box box__full-height amethyst"
-}, "Sidebar"), /*#__PURE__*/React.createElement("div", {
-  className: "box box__full-height sunflower"
-}, "Body"));
-export const Stack = () => /*#__PURE__*/React.createElement(QuickLayout, {
-  type: "stack"
-}, /*#__PURE__*/React.createElement("div", {
-  className: "box  box__full-height turqoise"
-}, "Navigation!"), /*#__PURE__*/React.createElement("div", {
-  className: "box  box__full-height pomegranate"
-}, "Body!"), /*#__PURE__*/React.createElement("div", {
-  className: "box  box__full-height belizehole"
-}, "Footer!"));
-export const Auto = () => /*#__PURE__*/React.createElement(QuickLayout, {
-  type: "auto",
-  gap: "1rem ",
-  min: "150px"
-}, /*#__PURE__*/React.createElement("div", {
-  className: "box turqoise"
-}, "1"), /*#__PURE__*/React.createElement("div", {
-  className: "box pomegranate"
-}, "2"), /*#__PURE__*/React.createElement("div", {
-  className: "box turqoise"
-}, "3"), /*#__PURE__*/React.createElement("div", {
-  className: "box belizehole"
-}, "4"), /*#__PURE__*/React.createElement("div", {
-  className: "box amethyst"
-}, "5"));
-export const SpaceBetween = () => /*#__PURE__*/React.createElement(QuickLayout, {
-  type: "spaceBetween",
-  gap: "1rem",
-  items: "3"
-}, /*#__PURE__*/React.createElement("div", {
-  className: "box sunflower"
-}, "Box 1"), /*#__PURE__*/React.createElement("div", {
-  className: "box midnightblue"
-}, "Box 2"), /*#__PURE__*/React.createElement("div", {
-  className: "box belizehole"
-}, "Box 3"));
-export const Clamp = () => /*#__PURE__*/React.createElement(QuickLayout, {
-  type: "clamp",
-  min: "2rem",
-  value: "2.5vw",
-  max: "20rem"
-}, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent urna lectus, condimentum eu neque ut, hendrerit scelerisque lorem. Aenean vehicula eleifend porta. Suspendisse viverra fermentum urna quis rhoncus. Nam lacinia risus vel purus vestibulum semper. Curabitur rutrum nisl consequat dui pretium, vel dapibus libero venenatis. Praesent non imperdiet ipsum. Suspendisse non enim mattis, blandit nunc et, suscipit magna. Duis eu blandit elit. Fusce rhoncus, augue ut pretium accumsan, quam dolor laoreet nisl, eu faucibus mi massa vulputate enim.");
-export const AspectRatio = () => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, "Coming ", /*#__PURE__*/React.createElement("a", {
-  href: "https://caniuse.com/mdn-css_properties_aspect-ratio"
-}, "soon...")), /*#__PURE__*/React.createElement("div", null));
+exports.default = _default;
+var Center = function Center() {
+  return /*#__PURE__*/_react.default.createElement(_.default, {
+    type: "center"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "box turqoise"
+  }, "Wow, i'm centered!"));
+};
+exports.Center = Center;
+var Wrap = function Wrap() {
+  return /*#__PURE__*/_react.default.createElement(_.default, {
+    type: "wrap",
+    min: "150px",
+    stretched: true
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "box box__full-height sunflower"
+  }, "1"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box box__full-height midnightblue"
+  }, "2"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box box__full-height belizehole"
+  }, "3"));
+};
+exports.Wrap = Wrap;
+var Sidebar = function Sidebar() {
+  return /*#__PURE__*/_react.default.createElement(_.default, {
+    type: "sidebar"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "box box__full-height amethyst"
+  }, "Sidebar"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box box__full-height sunflower"
+  }, "Body"));
+};
+exports.Sidebar = Sidebar;
+var Stack = function Stack() {
+  return /*#__PURE__*/_react.default.createElement(_.default, {
+    type: "stack"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "box  box__full-height turqoise"
+  }, "Navigation!"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box  box__full-height pomegranate"
+  }, "Body!"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box  box__full-height belizehole"
+  }, "Footer!"));
+};
+exports.Stack = Stack;
+var Auto = function Auto() {
+  return /*#__PURE__*/_react.default.createElement(_.default, {
+    type: "auto",
+    gap: "1rem ",
+    min: "150px"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "box turqoise"
+  }, "1"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box pomegranate"
+  }, "2"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box turqoise"
+  }, "3"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box belizehole"
+  }, "4"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box amethyst"
+  }, "5"));
+};
+exports.Auto = Auto;
+var SpaceBetween = function SpaceBetween() {
+  return /*#__PURE__*/_react.default.createElement(_.default, {
+    type: "spaceBetween",
+    gap: "1rem",
+    items: "3"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "box sunflower"
+  }, "Box 1"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box midnightblue"
+  }, "Box 2"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "box belizehole"
+  }, "Box 3"));
+};
+exports.SpaceBetween = SpaceBetween;
+var Clamp = function Clamp() {
+  return /*#__PURE__*/_react.default.createElement(_.default, {
+    type: "clamp",
+    min: "2rem",
+    value: "2.5vw",
+    max: "20rem"
+  }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent urna lectus, condimentum eu neque ut, hendrerit scelerisque lorem. Aenean vehicula eleifend porta. Suspendisse viverra fermentum urna quis rhoncus. Nam lacinia risus vel purus vestibulum semper. Curabitur rutrum nisl consequat dui pretium, vel dapibus libero venenatis. Praesent non imperdiet ipsum. Suspendisse non enim mattis, blandit nunc et, suscipit magna. Duis eu blandit elit. Fusce rhoncus, augue ut pretium accumsan, quam dolor laoreet nisl, eu faucibus mi massa vulputate enim.");
+};
+exports.Clamp = Clamp;
+var AspectRatio = function AspectRatio() {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, "Coming ", /*#__PURE__*/_react.default.createElement("a", {
+    href: "https://caniuse.com/mdn-css_properties_aspect-ratio"
+  }, "soon...")), /*#__PURE__*/_react.default.createElement("div", null));
+};
+exports.AspectRatio = AspectRatio;