@activecollab/components 1.0.5 → 1.0.9

package/dist/cjs/components/Transitions/Slide/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _Slide = require("./Slide");
+
+Object.keys(_Slide).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Slide[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Slide[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Transitions/Slide/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/Transitions/Slide/index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from \"./Slide\";\n"],"file":"index.js"}

package/dist/cjs/components/Transitions/SlideFromTop/SlideFromTop.js

@@ -0,0 +1,79 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SlideFromTop = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactTransitionGroup = require("react-transition-group");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var defaultStyle = {
+  transitionProperty: "opacity, transform",
+  transitionTimingFunction: "linear ease-out",
+  transform: "translateY(-100%)",
+  opacity: 0
+};
+var transitionStyles = {
+  entering: {
+    opacity: 1,
+    transform: "translateY(0)",
+    transitionDuration: ".3s"
+  },
+  entered: {
+    opacity: 1,
+    transform: "translateY(0)",
+    transitionDuration: ".3s"
+  },
+  exiting: {
+    opacity: 0,
+    transform: "translateY(-100%)",
+    transitionDuration: ".2s"
+  },
+  exited: {
+    opacity: 0,
+    transform: "translateY(-100%)",
+    transitionDuration: ".2s"
+  }
+};
+
+var SlideFromTop = function SlideFromTop(_ref) {
+  var _ref$in = _ref.in,
+      inProp = _ref$in === void 0 ? false : _ref$in,
+      onEnter = _ref.onEnter,
+      onExited = _ref.onExited,
+      children = _ref.children,
+      style = _ref.style,
+      _ref$timeout = _ref.timeout,
+      timeout = _ref$timeout === void 0 ? 400 : _ref$timeout;
+  return /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.Transition, {
+    appear: true,
+    in: inProp,
+    timeout: timeout,
+    onEnter: onEnter,
+    onExited: onExited
+  }, function (state) {
+    return /*#__PURE__*/(0, _react.cloneElement)(children, {
+      style: _objectSpread(_objectSpread(_objectSpread(_objectSpread({
+        visibility: state === "exited" && !inProp ? "hidden" : undefined
+      }, defaultStyle), transitionStyles[state]), style), children.props.style)
+    });
+  });
+};
+
+exports.SlideFromTop = SlideFromTop;
+SlideFromTop.displayName = "SlideFromTop";
+//# sourceMappingURL=SlideFromTop.js.map

package/dist/cjs/components/Transitions/SlideFromTop/SlideFromTop.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/Transitions/SlideFromTop/SlideFromTop.tsx"],"names":["defaultStyle","transitionProperty","transitionTimingFunction","transform","opacity","transitionStyles","entering","transitionDuration","entered","exiting","exited","SlideFromTop","in","inProp","onEnter","onExited","children","style","timeout","state","visibility","undefined","props","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;;;;;;;;;;;AAQA,IAAMA,YAAY,GAAG;AACnBC,EAAAA,kBAAkB,EAAE,oBADD;AAEnBC,EAAAA,wBAAwB,EAAE,iBAFP;AAGnBC,EAAAA,SAAS,EAAE,mBAHQ;AAInBC,EAAAA,OAAO,EAAE;AAJU,CAArB;AAOA,IAAMC,gBAAgB,GAAG;AACvBC,EAAAA,QAAQ,EAAE;AACRF,IAAAA,OAAO,EAAE,CADD;AAERD,IAAAA,SAAS,EAAE,eAFH;AAGRI,IAAAA,kBAAkB,EAAE;AAHZ,GADa;AAMvBC,EAAAA,OAAO,EAAE;AACPJ,IAAAA,OAAO,EAAE,CADF;AAEPD,IAAAA,SAAS,EAAE,eAFJ;AAGPI,IAAAA,kBAAkB,EAAE;AAHb,GANc;AAWvBE,EAAAA,OAAO,EAAE;AACPL,IAAAA,OAAO,EAAE,CADF;AAEPD,IAAAA,SAAS,EAAE,mBAFJ;AAGPI,IAAAA,kBAAkB,EAAE;AAHb,GAXc;AAgBvBG,EAAAA,MAAM,EAAE;AACNN,IAAAA,OAAO,EAAE,CADH;AAEND,IAAAA,SAAS,EAAE,mBAFL;AAGNI,IAAAA,kBAAkB,EAAE;AAHd;AAhBe,CAAzB;;AAuBO,IAAMI,YAA+B,GAAG,SAAlCA,YAAkC;AAAA,qBAC7CC,EAD6C;AAAA,MACzCC,MADyC,wBAChC,KADgC;AAAA,MAE7CC,OAF6C,QAE7CA,OAF6C;AAAA,MAG7CC,QAH6C,QAG7CA,QAH6C;AAAA,MAI7CC,QAJ6C,QAI7CA,QAJ6C;AAAA,MAK7CC,KAL6C,QAK7CA,KAL6C;AAAA,0BAM7CC,OAN6C;AAAA,MAM7CA,OAN6C,6BAMnC,GANmC;AAAA,sBAQ7C,6BAAC,gCAAD;AACE,IAAA,MAAM,MADR;AAEE,IAAA,EAAE,EAAEL,MAFN;AAGE,IAAA,OAAO,EAAEK,OAHX;AAIE,IAAA,OAAO,EAAEJ,OAJX;AAKE,IAAA,QAAQ,EAAEC;AALZ,KAOG,UAACI,KAAD,EAAyB;AACxB,wBAAO,yBAAaH,QAAb,EAAuB;AAC5BC,MAAAA,KAAK;AACHG,QAAAA,UAAU,EAAED,KAAK,KAAK,QAAV,IAAsB,CAACN,MAAvB,GAAgC,QAAhC,GAA2CQ;AADpD,SAEArB,YAFA,GAGAK,gBAAgB,CAACc,KAAD,CAHhB,GAIAF,KAJA,GAKAD,QAAQ,CAACM,KAAT,CAAeL,KALf;AADuB,KAAvB,CAAP;AASD,GAjBH,CAR6C;AAAA,CAAxC;;;AA6BPN,YAAY,CAACY,WAAb,GAA2B,cAA3B","sourcesContent":["import React, { FC, ReactElement, cloneElement } from \"react\";\nimport { Transition } from \"react-transition-group\";\nimport { TransitionProps } from \"../types\";\n\ninterface ISlideFromTop extends Omit<TransitionProps, \"timeout\"> {\n  children: ReactElement;\n  timeout?: number;\n}\n\nconst defaultStyle = {\n  transitionProperty: \"opacity, transform\",\n  transitionTimingFunction: \"linear ease-out\",\n  transform: \"translateY(-100%)\",\n  opacity: 0,\n};\n\nconst transitionStyles = {\n  entering: {\n    opacity: 1,\n    transform: \"translateY(0)\",\n    transitionDuration: \".3s\",\n  },\n  entered: {\n    opacity: 1,\n    transform: \"translateY(0)\",\n    transitionDuration: \".3s\",\n  },\n  exiting: {\n    opacity: 0,\n    transform: \"translateY(-100%)\",\n    transitionDuration: \".2s\",\n  },\n  exited: {\n    opacity: 0,\n    transform: \"translateY(-100%)\",\n    transitionDuration: \".2s\",\n  },\n};\n\nexport const SlideFromTop: FC<ISlideFromTop> = ({\n  in: inProp = false,\n  onEnter,\n  onExited,\n  children,\n  style,\n  timeout = 400,\n}) => (\n  <Transition\n    appear\n    in={inProp}\n    timeout={timeout}\n    onEnter={onEnter}\n    onExited={onExited}\n  >\n    {(state): ReactElement => {\n      return cloneElement(children, {\n        style: {\n          visibility: state === \"exited\" && !inProp ? \"hidden\" : undefined,\n          ...defaultStyle,\n          ...transitionStyles[state],\n          ...style,\n          ...children.props.style,\n        },\n      });\n    }}\n  </Transition>\n);\n\nSlideFromTop.displayName = \"SlideFromTop\";\n"],"file":"SlideFromTop.js"}

package/dist/cjs/components/Transitions/SlideFromTop/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _SlideFromTop = require("./SlideFromTop");
+
+Object.keys(_SlideFromTop).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SlideFromTop[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _SlideFromTop[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Transitions/SlideFromTop/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/Transitions/SlideFromTop/index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from \"./SlideFromTop\";\n"],"file":"index.js"}

package/dist/cjs/components/Transitions/SlideLeftRightTransition/SlideLeftRightTransition.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SlideLeftRightTransition = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Styles = require("./Styles");
+
+var _excluded = ["children", "direction"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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 _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 SlideLeftRightTransition = function SlideLeftRightTransition(_ref) {
+  var children = _ref.children,
+      _ref$direction = _ref.direction,
+      direction = _ref$direction === void 0 ? "left" : _ref$direction,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/_react.default.createElement(_Styles.StyledSlideLeftRightTransition, _extends({
+    timeout: 200,
+    classNames: "c-slide",
+    unmountOnExit: true,
+    $direction: direction
+  }, props), children);
+};
+
+exports.SlideLeftRightTransition = SlideLeftRightTransition;
+SlideLeftRightTransition.displayName = "SlideLeftRightTransition";
+//# sourceMappingURL=SlideLeftRightTransition.js.map

package/dist/cjs/components/Transitions/SlideLeftRightTransition/SlideLeftRightTransition.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/Transitions/SlideLeftRightTransition/SlideLeftRightTransition.tsx"],"names":["SlideLeftRightTransition","children","direction","props","displayName"],"mappings":";;;;;;;AAAA;;AAEA;;;;;;;;;;;;AAOO,IAAMA,wBAAuD,GAAG,SAA1DA,wBAA0D,OAIjE;AAAA,MAHJC,QAGI,QAHJA,QAGI;AAAA,4BAFJC,SAEI;AAAA,MAFJA,SAEI,+BAFQ,MAER;AAAA,MADDC,KACC;;AACJ,sBACE,6BAAC,sCAAD;AACE,IAAA,OAAO,EAAE,GADX;AAEE,IAAA,UAAU,EAAC,SAFb;AAGE,IAAA,aAAa,MAHf;AAIE,IAAA,UAAU,EAAED;AAJd,KAKMC,KALN,GAOGF,QAPH,CADF;AAWD,CAhBM;;;AAkBPD,wBAAwB,CAACI,WAAzB,GAAuC,0BAAvC","sourcesContent":["import React, { FC, ReactElement } from \"react\";\nimport { TransitionProps } from \"../types\";\nimport { StyledSlideLeftRightTransition } from \"./Styles\";\n\ninterface ISlideLeftRightTransition extends TransitionProps {\n  children: ReactElement;\n  direction?: \"left\" | \"right\";\n}\n\nexport const SlideLeftRightTransition: FC<ISlideLeftRightTransition> = ({\n  children,\n  direction = \"left\",\n  ...props\n}) => {\n  return (\n    <StyledSlideLeftRightTransition\n      timeout={200}\n      classNames=\"c-slide\"\n      unmountOnExit\n      $direction={direction}\n      {...props}\n    >\n      {children}\n    </StyledSlideLeftRightTransition>\n  );\n};\n\nSlideLeftRightTransition.displayName = \"SlideLeftRightTransition\";\n"],"file":"SlideLeftRightTransition.js"}

package/dist/cjs/components/Transitions/SlideLeftRightTransition/Styles.js

@@ -0,0 +1,28 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledSlideLeftRightTransition = void 0;
+
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
+var _reactTransitionGroup = require("react-transition-group");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var StyledSlideLeftRightTransition = (0, _styledComponents.default)(_reactTransitionGroup.CSSTransition).withConfig({
+  displayName: "Styles__StyledSlideLeftRightTransition",
+  componentId: "sc-ewkpq8-0"
+})(["", " ", ""], function (props) {
+  return props.$direction === "left" && (0, _styledComponents.css)(["&.c-slide-enter{position:absolute;transform:translateX(100%);}&.c-slide-enter-active{transform:translateX(0%);transition:all 200ms ease;}&.c-slide-exit{position:absolute;}&.c-slide-exit-active{transform:translateX(-100%);transition:all 200ms ease;}"]);
+}, function (props) {
+  return props.$direction === "right" && (0, _styledComponents.css)(["&.c-slide-enter{position:absolute;transform:translateX(-100%);}&.c-slide-enter-active{transform:translateX(0%);transition:all 200ms ease;}&.c-slide-exit{position:absolute;}&.c-slide-exit-active{transform:translateX(100%);transition:all 200ms ease;}"]);
+});
+exports.StyledSlideLeftRightTransition = StyledSlideLeftRightTransition;
+StyledSlideLeftRightTransition.displayName = "StyledSlideLeftRightTransition";
+//# sourceMappingURL=Styles.js.map

package/dist/cjs/components/Transitions/SlideLeftRightTransition/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/Transitions/SlideLeftRightTransition/Styles.ts"],"names":["StyledSlideLeftRightTransition","CSSTransition","props","$direction","css","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;;;;;AAEO,IAAMA,8BAA8B,GAAG,+BAAOC,mCAAP,CAAH;AAAA;AAAA;AAAA,kBAGvC,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,KAAqB,MAArB,QACAC,qBADA,+PADA;AAAA,CAHuC,EAuBvC,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,KAAqB,OAArB,QACAC,qBADA,+PADA;AAAA,CAvBuC,CAApC;;AA8CPJ,8BAA8B,CAACK,WAA/B,GAA6C,gCAA7C","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { CSSTransition } from \"react-transition-group\";\n\nexport const StyledSlideLeftRightTransition = styled(CSSTransition)<{\n  $direction: \"left\" | \"right\";\n}>`\n  ${(props) =>\n    props.$direction === \"left\" &&\n    css`\n      &.c-slide-enter {\n        position: absolute;\n        transform: translateX(100%);\n      }\n      &.c-slide-enter-active {\n        transform: translateX(0%);\n        transition: all 200ms ease;\n      }\n      &.c-slide-exit {\n        position: absolute;\n      }\n      &.c-slide-exit-active {\n        transform: translateX(-100%);\n        transition: all 200ms ease;\n      }\n    `}\n\n  ${(props) =>\n    props.$direction === \"right\" &&\n    css`\n      &.c-slide-enter {\n        position: absolute;\n        transform: translateX(-100%);\n      }\n      &.c-slide-enter-active {\n        transform: translateX(0%);\n        transition: all 200ms ease;\n      }\n\n      &.c-slide-exit {\n        position: absolute;\n      }\n\n      &.c-slide-exit-active {\n        transform: translateX(100%);\n        transition: all 200ms ease;\n      }\n    `}\n`;\n\nStyledSlideLeftRightTransition.displayName = \"StyledSlideLeftRightTransition\";\n"],"file":"Styles.js"}

package/dist/cjs/components/Transitions/SlideLeftRightTransition/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _SlideLeftRightTransition = require("./SlideLeftRightTransition");
+
+Object.keys(_SlideLeftRightTransition).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SlideLeftRightTransition[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _SlideLeftRightTransition[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Transitions/SlideLeftRightTransition/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/Transitions/SlideLeftRightTransition/index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from \"./SlideLeftRightTransition\";\n"],"file":"index.js"}

package/dist/cjs/components/Transitions/index.js

@@ -0,0 +1,123 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _Fade = require("./Fade");
+
+Object.keys(_Fade).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Fade[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Fade[key];
+    }
+  });
+});
+
+var _Slide = require("./Slide");
+
+Object.keys(_Slide).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Slide[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Slide[key];
+    }
+  });
+});
+
+var _FromElement = require("./FromElement");
+
+Object.keys(_FromElement).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _FromElement[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _FromElement[key];
+    }
+  });
+});
+
+var _SlideFromTop = require("./SlideFromTop");
+
+Object.keys(_SlideFromTop).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SlideFromTop[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _SlideFromTop[key];
+    }
+  });
+});
+
+var _SlideLeftRightTransition = require("./SlideLeftRightTransition");
+
+Object.keys(_SlideLeftRightTransition).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SlideLeftRightTransition[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _SlideLeftRightTransition[key];
+    }
+  });
+});
+
+var _ResizeTransition = require("./ResizeTransition");
+
+Object.keys(_ResizeTransition).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ResizeTransition[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ResizeTransition[key];
+    }
+  });
+});
+
+var _Reveal = require("./Reveal");
+
+Object.keys(_Reveal).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Reveal[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Reveal[key];
+    }
+  });
+});
+
+var _Scale = require("./Scale");
+
+Object.keys(_Scale).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Scale[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Scale[key];
+    }
+  });
+});
+
+var _types = require("./types");
+
+Object.keys(_types).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _types[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _types[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Transitions/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Transitions/index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from \"./Fade\";\nexport * from \"./Slide\";\nexport * from \"./FromElement\";\nexport * from \"./SlideFromTop\";\nexport * from \"./SlideLeftRightTransition\";\nexport * from \"./ResizeTransition\";\nexport * from \"./Reveal\";\nexport * from \"./Scale\";\nexport * from \"./types\";\n"],"file":"index.js"}

package/dist/cjs/components/Transitions/types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=types.js.map

package/dist/cjs/components/Transitions/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"types.js"}

package/dist/cjs/components/Typography/Styles.js

@@ -0,0 +1,140 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledTypography = void 0;
+
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
+var _BoxSizingStyle = require("../BoxSizingStyle");
+
+var _FontStyle = require("../FontStyle");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var colors = {
+  primary: {
+    "color": "var(--color-theme-900)"
+  },
+  secondary: {
+    "color": "var(--color-theme-700)"
+  },
+  tertiary: {
+    "color": "var(--color-theme-600)"
+  },
+  quaternary: {
+    "color": "var(--color-theme-600)",
+    "opacity": "0.5"
+  },
+  "theme-primary": {
+    "color": "var(--color-primary)"
+  },
+  "theme-secondary": {
+    "color": "var(--color-secondary)"
+  },
+  "page-paper": {
+    "color": "var(--page-paper-main)"
+  },
+  "only-white": {
+    "color": "var(--only-white)"
+  },
+  "only-black": {
+    "color": "var(--only-black)"
+  },
+  success: {
+    "color": "var(--color-sucess-green)"
+  },
+  alert: {
+    "color": "var(--red-alert)"
+  }
+};
+
+var StyledTypography = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledTypography",
+  componentId: "sc-mskw5w-0"
+})(["", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle, function (props) {
+  return colors[props.$color];
+}, function (props) {
+  return props.$variant === "Title 1" && (0, _styledComponents.css)(["font-size:2rem;"]);
+}, function (props) {
+  return props.$variant === "Header 2" && (0, _styledComponents.css)(["font-size:1.125rem;"]);
+}, function (props) {
+  return (props.$variant === "Header 3" || props.$variant === "Body 1") && (0, _styledComponents.css)(["font-size:1rem;"]);
+}, function (props) {
+  return props.$variant === "Body 2" && (0, _styledComponents.css)(["font-size:0.875rem;"]);
+}, function (props) {
+  return props.$variant === "Caption 1" && (0, _styledComponents.css)(["font-size:0.75rem;"]);
+}, function (props) {
+  return props.$variant === "Caption 2" && (0, _styledComponents.css)(["font-size:0.625rem;"]);
+}, function (props) {
+  return props.$italic ? (0, _styledComponents.css)(["font-style:italic;"]) : (0, _styledComponents.css)(["font-style:normal;"]);
+}, function (props) {
+  return props.$tabularNums ? (0, _styledComponents.css)(["font-variant-numeric:tabular-nums;"]) : (0, _styledComponents.css)(["font-variant-numeric:normal;"]);
+}, function (props) {
+  return props.$letterSpacing === "regular" && (0, _styledComponents.css)(["letter-spacing:0.02em;"]);
+}, function (props) {
+  return props.$letterSpacing === "tight" && (0, _styledComponents.css)(["letter-spacing:0em;"]);
+}, function (props) {
+  return props.$letterSpacing === "wide" && (0, _styledComponents.css)(["letter-spacing:0.08em;"]);
+}, function (props) {
+  return props.$lineHeight === "regular" && (0, _styledComponents.css)(["line-height:1.375;"]);
+}, function (props) {
+  return props.$lineHeight === "tight" && (0, _styledComponents.css)(["line-height:1;"]);
+}, function (props) {
+  return props.$lineHeight === "loose" && (0, _styledComponents.css)(["line-height:1.625;"]);
+}, function (props) {
+  return props.$align === "left" && (0, _styledComponents.css)(["text-align:left;"]);
+}, function (props) {
+  return props.$align === "right" && (0, _styledComponents.css)(["text-align:right;"]);
+}, function (props) {
+  return props.$align === "center" && (0, _styledComponents.css)(["text-align:center;"]);
+}, function (props) {
+  return props.$align === "justify" && (0, _styledComponents.css)(["text-align:justify;"]);
+}, function (props) {
+  return props.$decoration === "none" && (0, _styledComponents.css)(["text-decoration:none;"]);
+}, function (props) {
+  return props.$decoration === "underline" && (0, _styledComponents.css)(["text-decoration:underline;"]);
+}, function (props) {
+  return props.$decoration === "line-through" && (0, _styledComponents.css)(["text-decoration:line-through;"]);
+}, function (props) {
+  return props.$transform === "regular" && (0, _styledComponents.css)(["text-transform:none;"]);
+}, function (props) {
+  return props.$transform === "uppercase" && (0, _styledComponents.css)(["text-transform:uppercase;"]);
+}, function (props) {
+  return props.$transform === "lowercase" && (0, _styledComponents.css)(["text-transform:lowercase;"]);
+}, function (props) {
+  return props.$transform === "capitalize" && (0, _styledComponents.css)(["text-transform:capitalize;"]);
+}, function (props) {
+  return props.$overflow === "visible" && (0, _styledComponents.css)(["overflow:visible;"]);
+}, function (props) {
+  return props.$overflow === "ellipsis" && (0, _styledComponents.css)(["text-overflow:ellipsis;"]);
+}, function (props) {
+  return props.$overflow === "truncate" && (0, _styledComponents.css)(["overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"]);
+}, function (props) {
+  return props.$whitespace === "regular" && (0, _styledComponents.css)(["white-space:normal;"]);
+}, function (props) {
+  return props.$whitespace === "no-wrap" && (0, _styledComponents.css)(["white-space:nowrap;"]);
+}, function (props) {
+  return props.$wordBreak === "regular" && (0, _styledComponents.css)(["overflow-wrap:normal;word-break:normal;"]);
+}, function (props) {
+  return props.$wordBreak === "smart" && (0, _styledComponents.css)(["overflow-wrap:break-word;"]);
+}, function (props) {
+  return props.$wordBreak === "all" && (0, _styledComponents.css)(["word-break:break-all;"]);
+}, function (props) {
+  return props.$weight === "regular" && (0, _styledComponents.css)(["font-weight:400;"]);
+}, function (props) {
+  return props.$weight === "light" && (0, _styledComponents.css)(["font-weight:300;"]);
+}, function (props) {
+  return props.$weight === "medium" && (0, _styledComponents.css)(["font-weight:500;"]);
+}, function (props) {
+  return props.$weight === "bold" && (0, _styledComponents.css)(["font-weight:700;"]);
+});
+
+exports.StyledTypography = StyledTypography;
+StyledTypography.displayName = "StyledTypography";
+//# sourceMappingURL=Styles.js.map

package/dist/cjs/components/Typography/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Typography/Styles.ts"],"names":["colors","primary","secondary","tertiary","quaternary","success","alert","StyledTypography","styled","div","FontStyle","BoxSizingStyle","props","$color","$variant","css","$italic","$tabularNums","$letterSpacing","$lineHeight","$align","$decoration","$transform","$overflow","$whitespace","$wordBreak","$weight","displayName"],"mappings":"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","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\ninterface IStyledTypographyProps {\n  $variant:\n    | \"Title 1\"\n    | \"Header 2\"\n    | \"Header 3\"\n    | \"Body 1\"\n    | \"Body 2\"\n    | \"Caption 1\"\n    | \"Caption 2\";\n  $italic: boolean;\n  $tabularNums: boolean;\n  $letterSpacing: \"tight\" | \"regular\" | \"wide\";\n  $lineHeight: \"tight\" | \"regular\" | \"loose\";\n  $align: \"left\" | \"center\" | \"right\" | \"justify\";\n  $decoration: \"underline\" | \"line-through\" | \"none\";\n  $transform: \"uppercase\" | \"lowercase\" | \"capitalize\" | \"regular\";\n  $overflow: \"truncate\" | \"ellipsis\" | \"visible\";\n  $whitespace: \"regular\" | \"no-wrap\";\n  $wordBreak: \"regular\" | \"smart\" | \"all\";\n  $color:\n    | \"primary\"\n    | \"secondary\"\n    | \"tertiary\"\n    | \"quaternary\"\n    | \"theme-primary\"\n    | \"theme-secondary\"\n    | \"only-white\"\n    | \"only-black\"\n    | \"page-paper\"\n    | \"success\"\n    | \"alert\";\n  $weight?: \"light\" | \"regular\" | \"medium\" | \"bold\";\n}\n\nconst colors = {\n  primary: tw`tw-text-theme-900`,\n  secondary: tw`tw-text-theme-700`,\n  tertiary: tw`tw-text-theme-600`,\n  quaternary: tw`tw-text-theme-600 tw-opacity-50`,\n  \"theme-primary\": tw`tw-text-primary`,\n  \"theme-secondary\": tw`tw-text-secondary`,\n  \"page-paper\": tw`tw-text-page-paper-main`,\n  \"only-white\": tw`tw-text-only-white`,\n  \"only-black\": tw`tw-text-only-black`,\n  success: tw`tw-text-success`,\n  alert: tw`tw-text-alert`,\n};\n\nexport const StyledTypography = styled.div<IStyledTypographyProps>`\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  //color\n  ${(props) => colors[props.$color]}\n\n  //variant - font size\n  ${(props) =>\n    props.$variant === \"Title 1\" &&\n    css`\n      font-size: 2rem;\n    `}\n  ${(props) =>\n    props.$variant === \"Header 2\" &&\n    css`\n      font-size: 1.125rem;\n    `}\n  ${(props) =>\n    (props.$variant === \"Header 3\" || props.$variant === \"Body 1\") &&\n    css`\n      font-size: 1rem;\n    `}\n  ${(props) =>\n    props.$variant === \"Body 2\" &&\n    css`\n      font-size: 0.875rem;\n    `}\n  ${(props) =>\n    props.$variant === \"Caption 1\" &&\n    css`\n      font-size: 0.75rem;\n    `}\n  ${(props) =>\n    props.$variant === \"Caption 2\" &&\n    css`\n      font-size: 0.625rem;\n    `}\n\n  //italic\n  ${(props) =>\n    props.$italic\n      ? css`\n          font-style: italic;\n        `\n      : css`\n          font-style: normal;\n        `}\n\n  //tabularNums\n  ${(props) =>\n    props.$tabularNums\n      ? css`\n          font-variant-numeric: tabular-nums;\n        `\n      : css`\n          font-variant-numeric: normal;\n        `}\n\n  //letterSpacing\n  ${(props) =>\n    props.$letterSpacing === \"regular\" &&\n    css`\n      letter-spacing: 0.02em;\n    `}\n  ${(props) =>\n    props.$letterSpacing === \"tight\" &&\n    css`\n      letter-spacing: 0em;\n    `}\n  ${(props) =>\n    props.$letterSpacing === \"wide\" &&\n    css`\n      letter-spacing: 0.08em;\n    `}\n\n  //lineHeight\n  ${(props) =>\n    props.$lineHeight === \"regular\" &&\n    css`\n      line-height: 1.375;\n    `}\n  ${(props) =>\n    props.$lineHeight === \"tight\" &&\n    css`\n      line-height: 1;\n    `}\n  ${(props) =>\n    props.$lineHeight === \"loose\" &&\n    css`\n      line-height: 1.625;\n    `}\n\n  //align\n  ${(props) =>\n    props.$align === \"left\" &&\n    css`\n      text-align: left;\n    `}\n  ${(props) =>\n    props.$align === \"right\" &&\n    css`\n      text-align: right;\n    `}\n  ${(props) =>\n    props.$align === \"center\" &&\n    css`\n      text-align: center;\n    `}\n  ${(props) =>\n    props.$align === \"justify\" &&\n    css`\n      text-align: justify;\n    `}\n\n  //decoration\n  ${(props) =>\n    props.$decoration === \"none\" &&\n    css`\n      text-decoration: none;\n    `}\n  ${(props) =>\n    props.$decoration === \"underline\" &&\n    css`\n      text-decoration: underline;\n    `}\n  ${(props) =>\n    props.$decoration === \"line-through\" &&\n    css`\n      text-decoration: line-through;\n    `}\n\n  //transform\n  ${(props) =>\n    props.$transform === \"regular\" &&\n    css`\n      text-transform: none;\n    `}\n  ${(props) =>\n    props.$transform === \"uppercase\" &&\n    css`\n      text-transform: uppercase;\n    `}\n  ${(props) =>\n    props.$transform === \"lowercase\" &&\n    css`\n      text-transform: lowercase;\n    `}\n  ${(props) =>\n    props.$transform === \"capitalize\" &&\n    css`\n      text-transform: capitalize;\n    `}\n\n  //overflow\n  ${(props) =>\n    props.$overflow === \"visible\" &&\n    css`\n      overflow: visible;\n    `}\n  ${(props) =>\n    props.$overflow === \"ellipsis\" &&\n    css`\n      text-overflow: ellipsis;\n    `}\n  ${(props) =>\n    props.$overflow === \"truncate\" &&\n    css`\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    `}\n\n  //whitespace\n  ${(props) =>\n    props.$whitespace === \"regular\" &&\n    css`\n      white-space: normal;\n    `}\n  ${(props) =>\n    props.$whitespace === \"no-wrap\" &&\n    css`\n      white-space: nowrap;\n    `}\n\n  //wordBreak\n  ${(props) =>\n    props.$wordBreak === \"regular\" &&\n    css`\n      overflow-wrap: normal;\n      word-break: normal;\n    `}\n  ${(props) =>\n    props.$wordBreak === \"smart\" &&\n    css`\n      overflow-wrap: break-word;\n    `}\n  ${(props) =>\n    props.$wordBreak === \"all\" &&\n    css`\n      word-break: break-all;\n    `}\n\n  //weight\n  ${(props) =>\n    props.$weight === \"regular\" &&\n    css`\n      font-weight: 400;\n    `}\n  ${(props) =>\n    props.$weight === \"light\" &&\n    css`\n      font-weight: 300;\n    `}\n  ${(props) =>\n    props.$weight === \"medium\" &&\n    css`\n      font-weight: 500;\n    `}\n  ${(props) =>\n    props.$weight === \"bold\" &&\n    css`\n      font-weight: 700;\n    `}\n`;\n\nStyledTypography.displayName = \"StyledTypography\";\n"],"file":"Styles.js"}