@ohos-ports/sprucelabs-react-heartwood-components 9.1.0-beta.0

package/lib/components/Core/components/Sidebar/components/SidebarExpander/SidebarExpander.js

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Button = _interopRequireDefault(require("../../../../../Button/Button"));
+
+var ToggleCollapseIcon = function ToggleCollapseIcon(props) {
+  return _react["default"].createElement("svg", props, _react["default"].createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6-1.41-1.41z"
+  }));
+};
+
+ToggleCollapseIcon.defaultProps = {
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+
+var SidebarExpander = function SidebarExpander(props) {
+  var toggleExpanded = props.toggleExpanded,
+      forceCloseSidebar = props.forceCloseSidebar;
+  return _react["default"].createElement("div", {
+    className: "sidebar-collapse"
+  }, _react["default"].createElement(_Button["default"], {
+    icon: {
+      customIcon: ToggleCollapseIcon
+    },
+    onClick: function onClick() {
+      toggleExpanded();
+      forceCloseSidebar();
+    },
+    isSmall: true
+  }));
+};
+
+var _default = SidebarExpander;
+exports["default"] = _default;
+//# sourceMappingURL=SidebarExpander.js.map

package/lib/components/Core/components/Sidebar/components/SidebarExpander/SidebarExpander.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Core/components/Sidebar/components/SidebarExpander/SidebarExpander.js"],"names":["ToggleCollapseIcon","SidebarExpander","props","toggleExpanded","forceCloseSidebar","customIcon"],"mappings":";;;;;;;;;AACA;;AACA;;IACOA,kB,YAAAA,kB;;;;;;;;AAAAA,kB;;;;;;;AAaP,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,CAACC,KAAD,EAAkB;AAAA,MACjCC,cADiC,GACKD,KADL,CACjCC,cADiC;AAAA,MACjBC,iBADiB,GACKF,KADL,CACjBE,iBADiB;AAEzC,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,gCAAC,kBAAD;AACC,IAAA,IAAI,EAAE;AACLC,MAAAA,UAAU,EAAEL;AADP,KADP;AAIC,IAAA,OAAO,EAAE,mBAAM;AACdG,MAAAA,cAAc;AACdC,MAAAA,iBAAiB;AACjB,KAPF;AAQC,IAAA,OAAO;AARR,IADD,CADD;AAcA,CAhBD;;eAkBeH,e","sourcesContent":["// @flow\nimport React from 'react'\nimport Button from '../../../../../Button/Button'\nimport ToggleCollapseIcon from '../../../../../../../static/assets/icons/ic_keyboard_arrow_right.svg'\n\ntype Props = {\n\t/** Set true to expand the sidebar */\n\tisExpanded: boolean,\n\n\t/** Handler to toggle sidebar visibility (large screens only) */\n\ttoggleExpanded: Function,\n\n\t/** Handler to force the sidebar closed */\n\tforceCloseSidebar: Function\n}\n\nconst SidebarExpander = (props: Props) => {\n\tconst { toggleExpanded, forceCloseSidebar } = props\n\treturn (\n\t\t<div className=\"sidebar-collapse\">\n\t\t\t<Button\n\t\t\t\ticon={{\n\t\t\t\t\tcustomIcon: ToggleCollapseIcon\n\t\t\t\t}}\n\t\t\t\tonClick={() => {\n\t\t\t\t\ttoggleExpanded()\n\t\t\t\t\tforceCloseSidebar()\n\t\t\t\t}}\n\t\t\t\tisSmall\n\t\t\t/>\n\t\t</div>\n\t)\n}\n\nexport default SidebarExpander\n"],"file":"SidebarExpander.js"}

package/lib/components/Core/components/Sidebar/components/SidebarFooter/SidebarFooter.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _FooterPrimary = require("../../../FooterPrimary");
+
+var SidebarFooter = function SidebarFooter() {
+  return _react["default"].createElement("div", {
+    className: "sidebar__footer"
+  }, _react["default"].createElement(_FooterPrimary.Legal, {
+    className: "sidebar__footer-text",
+    linkClassName: "sidebar__footer-link"
+  }));
+};
+
+var _default = SidebarFooter;
+exports["default"] = _default;
+//# sourceMappingURL=SidebarFooter.js.map

package/lib/components/Core/components/Sidebar/components/SidebarFooter/SidebarFooter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Core/components/Sidebar/components/SidebarFooter/SidebarFooter.js"],"names":["SidebarFooter"],"mappings":";;;;;;;;;AACA;;AACA;;AAEA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB;AAAA,SACrB;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,gCAAC,oBAAD;AACC,IAAA,SAAS,EAAC,sBADX;AAEC,IAAA,aAAa,EAAC;AAFf,IADD,CADqB;AAAA,CAAtB;;eASeA,a","sourcesContent":["// @flow\nimport React from 'react'\nimport { Legal } from '../../../FooterPrimary'\n\nconst SidebarFooter = () => (\n\t<div className=\"sidebar__footer\">\n\t\t<Legal\n\t\t\tclassName=\"sidebar__footer-text\"\n\t\t\tlinkClassName=\"sidebar__footer-link\"\n\t\t/>\n\t</div>\n)\n\nexport default SidebarFooter\n"],"file":"SidebarFooter.js"}

package/lib/components/Core/components/Sidebar/components/SidebarHeader/SidebarHeader.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+interface ISidebarHeaderProps {
+    /** The title to show in the sidebar header */
+    title: string;
+    /** Optional; callback on close */
+    onClose?: () => void;
+    /** Optional; adds a back arrow and destination */
+    onGoBack?: (destination: string) => void;
+}
+declare const SidebarHeader: (props: ISidebarHeaderProps) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
+export default SidebarHeader;
+//# sourceMappingURL=SidebarHeader.d.ts.map

package/lib/components/Core/components/Sidebar/components/SidebarHeader/SidebarHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarHeader.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/Core/components/Sidebar/components/SidebarHeader/SidebarHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,UAAU,mBAAmB;IAC5B,8CAA8C;IAC9C,KAAK,EAAE,MAAM,CAAA;IAEb,kCAAkC;IAClC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IAEpB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;CACxC;AAED,QAAA,MAAM,aAAa,gPAkBlB,CAAA;AAED,eAAe,aAAa,CAAA"}

package/lib/components/Core/components/Sidebar/components/SidebarHeader/SidebarHeader.js

@@ -0,0 +1,47 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _SidebarSection = _interopRequireDefault(require("../SidebarSection/SidebarSection"));
+
+var _Button = _interopRequireDefault(require("../../../../../Button/Button"));
+
+var _Text = _interopRequireDefault(require("../../../../../Text/Text"));
+
+var SidebarHeader = function SidebarHeader(props) {
+  var title = props.title,
+      onClose = props.onClose,
+      onGoBack = props.onGoBack;
+  return _react["default"].createElement(_SidebarSection["default"], {
+    className: "sidebar-header"
+  }, _react["default"].createElement("div", {
+    className: "sidebar-header__action-wrapper"
+  }, onGoBack && _react["default"].createElement(_Button["default"], {
+    icon: {
+      name: 'arrow_back'
+    },
+    onClick: onGoBack,
+    isSmall: true
+  })), _react["default"].createElement(_Text["default"], {
+    className: "sidebar-header__title"
+  }, title), _react["default"].createElement("div", {
+    className: "sidebar-header__action-wrapper"
+  }, onClose && _react["default"].createElement(_Button["default"], {
+    icon: {
+      name: 'close'
+    },
+    onClick: onClose,
+    isSmall: true
+  })));
+};
+
+var _default = SidebarHeader;
+exports["default"] = _default;
+//# sourceMappingURL=SidebarHeader.js.map

package/lib/components/Core/components/Sidebar/components/SidebarHeader/SidebarHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Core/components/Sidebar/components/SidebarHeader/SidebarHeader.tsx"],"names":["SidebarHeader","props","title","onClose","onGoBack","name"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAaA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAoD;AAAA,MACjEC,KADiE,GACpCD,KADoC,CACjEC,KADiE;AAAA,MAC1DC,OAD0D,GACpCF,KADoC,CAC1DE,OAD0D;AAAA,MACjDC,QADiD,GACpCH,KADoC,CACjDG,QADiD;AAGzE,SACC,gCAAC,0BAAD;AAAgB,IAAA,SAAS,EAAC;AAA1B,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACEA,QAAQ,IACR,gCAAC,kBAAD;AAAQ,IAAA,IAAI,EAAE;AAAEC,MAAAA,IAAI,EAAE;AAAR,KAAd;AAAsC,IAAA,OAAO,EAAED,QAA/C;AAAyD,IAAA,OAAO;AAAhE,IAFF,CADD,EAMC,gCAAC,gBAAD;AAAM,IAAA,SAAS,EAAC;AAAhB,KAAyCF,KAAzC,CAND,EAOC;AAAK,IAAA,SAAS,EAAC;AAAf,KACEC,OAAO,IACP,gCAAC,kBAAD;AAAQ,IAAA,IAAI,EAAE;AAAEE,MAAAA,IAAI,EAAE;AAAR,KAAd;AAAiC,IAAA,OAAO,EAAEF,OAA1C;AAAmD,IAAA,OAAO;AAA1D,IAFF,CAPD,CADD;AAeA,CAlBD;;eAoBeH,a","sourcesContent":["import React from 'react'\nimport SidebarSection from '../SidebarSection/SidebarSection'\nimport Button from '../../../../../Button/Button'\nimport Text from '../../../../../Text/Text'\n\ninterface ISidebarHeaderProps {\n\t/** The title to show in the sidebar header */\n\ttitle: string\n\n\t/** Optional; callback on close */\n\tonClose?: () => void\n\n\t/** Optional; adds a back arrow and destination */\n\tonGoBack?: (destination: string) => void\n}\n\nconst SidebarHeader = (props: ISidebarHeaderProps): React.ReactElement => {\n\tconst { title, onClose, onGoBack } = props\n\n\treturn (\n\t\t<SidebarSection className=\"sidebar-header\">\n\t\t\t<div className=\"sidebar-header__action-wrapper\">\n\t\t\t\t{onGoBack && (\n\t\t\t\t\t<Button icon={{ name: 'arrow_back' }} onClick={onGoBack} isSmall />\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<Text className=\"sidebar-header__title\">{title}</Text>\n\t\t\t<div className=\"sidebar-header__action-wrapper\">\n\t\t\t\t{onClose && (\n\t\t\t\t\t<Button icon={{ name: 'close' }} onClick={onClose} isSmall />\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</SidebarSection>\n\t)\n}\n\nexport default SidebarHeader\n"],"file":"SidebarHeader.js"}

package/lib/components/Core/components/Sidebar/components/SidebarItem/SidebarItem.js

@@ -0,0 +1,115 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _Button = _interopRequireDefault(require("../../../../../Button/Button"));
+
+var _Icon = _interopRequireDefault(require("../../../../../Icon/Icon"));
+
+var isCurrentParent = function isCurrentParent(props) {
+  var items = props.items;
+
+  if (items) {
+    if (items.find(function (item) {
+      return item.isCurrent;
+    })) {
+      return true;
+    }
+
+    items.forEach(function (item) {
+      if (item.items) {
+        if (item.items.find(function (item) {
+          return item.isCurrent;
+        })) {
+          return true;
+        }
+      }
+    });
+  }
+
+  return false;
+};
+
+var SidebarItem = function SidebarItem(props) {
+  var text = props.text,
+      href = props.href,
+      action = props.action,
+      icon = props.icon,
+      isCurrent = props.isCurrent,
+      items = props.items,
+      className = props.className;
+  var parentClass = (0, _classnames["default"])('sidebar-item', className, {
+    'sidebar-item--is-current': isCurrent,
+    'sidebar-item--is-current-parent': items && isCurrentParent({
+      items: items
+    })
+  });
+  return _react["default"].createElement("li", {
+    className: parentClass
+  }, _react["default"].createElement("div", {
+    className: "sidebar-item__inner"
+  }, _react["default"].createElement("a", {
+    className: "sidebar-item__link",
+    href: href
+  }, icon && _react["default"].createElement(_Icon["default"], (0, _extends2["default"])({}, icon, {
+    className: (0, _classnames["default"])('sidebar-item__icon', icon.className)
+  })), _react["default"].createElement("span", {
+    className: "sidebar-item__text"
+  }, text)), action && _react["default"].createElement(_Button["default"], action)), items && items.length > 0 && _react["default"].createElement("ul", {
+    className: "sidebar__sub-list"
+  }, items.map(function (item, idx) {
+    var subClass = (0, _classnames["default"])('sidebar__sub-list-item', {
+      'sidebar-item--is-current': item.isCurrent,
+      'sidebar-item--is-current-parent': item.items && isCurrentParent({
+        items: item.items
+      })
+    });
+    return _react["default"].createElement("li", {
+      key: idx,
+      className: subClass
+    }, _react["default"].createElement("div", {
+      className: "sidebar-item__inner"
+    }, _react["default"].createElement("a", {
+      href: item.href,
+      className: "sidebar-item__link"
+    }, item.text)), item.items && isCurrentParent({
+      items: item.items
+    }) && _react["default"].createElement("ul", {
+      className: "sidebar__sub-list"
+    }, item.items.map(function (item, idx) {
+      var subSubClass = (0, _classnames["default"])('sidebar__sub-list-item', item.className, {
+        'sidebar-item--is-current': item.isCurrent
+      });
+      return _react["default"].createElement("li", {
+        key: idx,
+        className: subSubClass
+      }, _react["default"].createElement("div", {
+        className: "sidebar-item__inner"
+      }, _react["default"].createElement("a", {
+        className: "sidebar-item__link",
+        href: item.href
+      }, item.text)));
+    })));
+  })));
+};
+
+SidebarItem.defaultProps = {
+  icon: null,
+  isCurrent: false,
+  items: [],
+  action: null
+};
+var _default = SidebarItem;
+exports["default"] = _default;
+//# sourceMappingURL=SidebarItem.js.map

package/lib/components/Core/components/Sidebar/components/SidebarItem/SidebarItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Core/components/Sidebar/components/SidebarItem/SidebarItem.js"],"names":["isCurrentParent","props","items","find","item","isCurrent","forEach","SidebarItem","text","href","action","icon","className","parentClass","length","map","idx","subClass","subSubClass","defaultProps"],"mappings":"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","sourcesContent":["// @flow\nimport React from 'react'\nimport type { Node } from 'react'\nimport cx from 'classnames'\nimport Button from '../../../../../Button/Button'\nimport type { Props as ButtonProps } from '../../../../../Button/Button'\nimport Icon from '../../../../../Icon/Icon'\n\ntype ItemProps = {\n\ttext: string,\n\thref: string,\n\tclassName?: string,\n\taction?: ButtonProps,\n\ticon?: Node,\n\tisCurrent?: boolean,\n\titems: Array<ItemProps>\n}\n\nexport type Props = {\n\titems?: Array<ItemProps>,\n\tclassName?: string,\n\ttext: string,\n\thref: string,\n\taction?: Object,\n\ticon?: any,\n\tisCurrent?: boolean\n}\n\nconst isCurrentParent = (props: Props) => {\n\tconst { items } = props\n\tif (items) {\n\t\tif (items.find(item => item.isCurrent)) {\n\t\t\treturn true\n\t\t}\n\t\titems.forEach(item => {\n\t\t\tif (item.items) {\n\t\t\t\tif (item.items.find(item => item.isCurrent)) {\n\t\t\t\t\treturn true\n\t\t\t\t}\n\t\t\t}\n\t\t})\n\t}\n\treturn false\n}\n\nconst SidebarItem = (props: Props) => {\n\tconst { text, href, action, icon, isCurrent, items, className } = props\n\tconst parentClass = cx('sidebar-item', className, {\n\t\t'sidebar-item--is-current': isCurrent,\n\t\t'sidebar-item--is-current-parent': items && isCurrentParent({ items })\n\t})\n\treturn (\n\t\t<li className={parentClass}>\n\t\t\t<div className=\"sidebar-item__inner\">\n\t\t\t\t<a className=\"sidebar-item__link\" href={href}>\n\t\t\t\t\t{icon && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t{...icon}\n\t\t\t\t\t\t\tclassName={cx('sidebar-item__icon', icon.className)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t<span className=\"sidebar-item__text\">{text}</span>\n\t\t\t\t</a>\n\t\t\t\t{action && <Button {...action} />}\n\t\t\t</div>\n\t\t\t{items && items.length > 0 && (\n\t\t\t\t<ul className=\"sidebar__sub-list\">\n\t\t\t\t\t{items.map((item, idx) => {\n\t\t\t\t\t\tconst subClass = cx('sidebar__sub-list-item', {\n\t\t\t\t\t\t\t'sidebar-item--is-current': item.isCurrent,\n\t\t\t\t\t\t\t'sidebar-item--is-current-parent':\n\t\t\t\t\t\t\t\titem.items && isCurrentParent({ items: item.items })\n\t\t\t\t\t\t})\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<li key={idx} className={subClass}>\n\t\t\t\t\t\t\t\t<div className=\"sidebar-item__inner\">\n\t\t\t\t\t\t\t\t\t<a href={item.href} className=\"sidebar-item__link\">\n\t\t\t\t\t\t\t\t\t\t{item.text}\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{item.items && isCurrentParent({ items: item.items }) && (\n\t\t\t\t\t\t\t\t\t<ul className=\"sidebar__sub-list\">\n\t\t\t\t\t\t\t\t\t\t{item.items.map((item, idx) => {\n\t\t\t\t\t\t\t\t\t\t\tconst subSubClass = cx(\n\t\t\t\t\t\t\t\t\t\t\t\t'sidebar__sub-list-item',\n\t\t\t\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t'sidebar-item--is-current': item.isCurrent\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t<li key={idx} className={subSubClass}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"sidebar-item__inner\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a className=\"sidebar-item__link\" href={item.href}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{item.text}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t)\n\t\t\t\t\t})}\n\t\t\t\t</ul>\n\t\t\t)}\n\t\t</li>\n\t)\n}\n\nSidebarItem.defaultProps = {\n\ticon: null,\n\tisCurrent: false,\n\titems: [],\n\taction: null\n}\n\nexport default SidebarItem\n"],"file":"SidebarItem.js"}

package/lib/components/Core/components/Sidebar/components/SidebarSection/SidebarSection.js

@@ -0,0 +1,38 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var SidebarSection = function SidebarSection(props) {
+  var children = props.children,
+      className = props.className,
+      isCentered = props.isCentered,
+      isOnlyForMobile = props.isOnlyForMobile,
+      horizontalSpacing = props.horizontalSpacing,
+      verticalSpacing = props.verticalSpacing;
+  return _react["default"].createElement("div", {
+    className: (0, _classnames["default"])('sidebar-section', className, {
+      'sidebar-section--show-only-on-mobile': isOnlyForMobile,
+      'sidebar-section--centered': isCentered,
+      'sidebar-section--horizontal-loose': horizontalSpacing === 'loose',
+      'sidebar-section--vertical-loose': verticalSpacing === 'loose'
+    })
+  }, children);
+};
+
+SidebarSection.defaultProps = {
+  className: '',
+  isCentered: false,
+  spacing: 'base'
+};
+var _default = SidebarSection;
+exports["default"] = _default;
+//# sourceMappingURL=SidebarSection.js.map

package/lib/components/Core/components/Sidebar/components/SidebarSection/SidebarSection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Core/components/Sidebar/components/SidebarSection/SidebarSection.js"],"names":["SidebarSection","props","children","className","isCentered","isOnlyForMobile","horizontalSpacing","verticalSpacing","defaultProps","spacing"],"mappings":";;;;;;;;;AACA;;AACA;;AAoBA,IAAMA,cAAc,GAAG,SAAjBA,cAAiB,CAACC,KAAD,EAAkB;AAAA,MAEvCC,QAFuC,GAQpCD,KARoC,CAEvCC,QAFuC;AAAA,MAGvCC,SAHuC,GAQpCF,KARoC,CAGvCE,SAHuC;AAAA,MAIvCC,UAJuC,GAQpCH,KARoC,CAIvCG,UAJuC;AAAA,MAKvCC,eALuC,GAQpCJ,KARoC,CAKvCI,eALuC;AAAA,MAMvCC,iBANuC,GAQpCL,KARoC,CAMvCK,iBANuC;AAAA,MAOvCC,eAPuC,GAQpCN,KARoC,CAOvCM,eAPuC;AASxC,SACC;AACC,IAAA,SAAS,EAAE,4BAAG,iBAAH,EAAsBJ,SAAtB,EAAiC;AAC3C,8CAAwCE,eADG;AAE3C,mCAA6BD,UAFc;AAG3C,2CAAqCE,iBAAiB,KAAK,OAHhB;AAI3C,yCAAmCC,eAAe,KAAK;AAJZ,KAAjC;AADZ,KAQEL,QARF,CADD;AAYA,CArBD;;AAuBAF,cAAc,CAACQ,YAAf,GAA8B;AAC7BL,EAAAA,SAAS,EAAE,EADkB;AAE7BC,EAAAA,UAAU,EAAE,KAFiB;AAG7BK,EAAAA,OAAO,EAAE;AAHoB,CAA9B;eAMeT,c","sourcesContent":["// @flow\nimport React from 'react'\nimport cx from 'classnames'\nimport type { Node } from 'react'\n\ntype Props = {\n\t/** Children to show in the sidebar section */\n\tchildren: Node,\n\n\t/** Optional classname to add to the section */\n\tclassName?: string,\n\n\t/** Set true to center align horizontally */\n\tisCentered?: boolean,\n\n\t/** Horizontal Spacing options */\n\thorizontalSpacing?: 'base' | 'loose',\n\n\t/** Vertical Spacing options */\n\tverticalSpacing?: 'base' | 'loose'\n}\n\nconst SidebarSection = (props: Props) => {\n\tconst {\n\t\tchildren,\n\t\tclassName,\n\t\tisCentered,\n\t\tisOnlyForMobile,\n\t\thorizontalSpacing,\n\t\tverticalSpacing\n\t} = props\n\treturn (\n\t\t<div\n\t\t\tclassName={cx('sidebar-section', className, {\n\t\t\t\t'sidebar-section--show-only-on-mobile': isOnlyForMobile,\n\t\t\t\t'sidebar-section--centered': isCentered,\n\t\t\t\t'sidebar-section--horizontal-loose': horizontalSpacing === 'loose',\n\t\t\t\t'sidebar-section--vertical-loose': verticalSpacing === 'loose'\n\t\t\t})}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t)\n}\n\nSidebarSection.defaultProps = {\n\tclassName: '',\n\tisCentered: false,\n\tspacing: 'base'\n}\n\nexport default SidebarSection\n"],"file":"SidebarSection.js"}

package/lib/components/Core/index.js

@@ -0,0 +1,80 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "FeedBuilder", {
+  enumerable: true,
+  get: function get() {
+    return _FeedBuilder2["default"];
+  }
+});
+Object.defineProperty(exports, "FooterPrimary", {
+  enumerable: true,
+  get: function get() {
+    return _FooterPrimary2["default"];
+  }
+});
+Object.defineProperty(exports, "HeaderPrimary", {
+  enumerable: true,
+  get: function get() {
+    return _HeaderPrimary2["default"];
+  }
+});
+Object.defineProperty(exports, "Sidebar", {
+  enumerable: true,
+  get: function get() {
+    return _Sidebar2["default"];
+  }
+});
+Object.defineProperty(exports, "SidebarFooter", {
+  enumerable: true,
+  get: function get() {
+    return _SidebarFooter2["default"];
+  }
+});
+Object.defineProperty(exports, "SidebarSection", {
+  enumerable: true,
+  get: function get() {
+    return _SidebarSection2["default"];
+  }
+});
+Object.defineProperty(exports, "SidebarHeader", {
+  enumerable: true,
+  get: function get() {
+    return _SidebarHeader2["default"];
+  }
+});
+Object.defineProperty(exports, "SaveBar", {
+  enumerable: true,
+  get: function get() {
+    return _SaveBar2["default"];
+  }
+});
+Object.defineProperty(exports, "ProfileSummary", {
+  enumerable: true,
+  get: function get() {
+    return _ProfileSummary2["default"];
+  }
+});
+
+var _FeedBuilder2 = _interopRequireDefault(require("./components/FeedBuilder/FeedBuilder"));
+
+var _FooterPrimary2 = _interopRequireDefault(require("./components/FooterPrimary/FooterPrimary"));
+
+var _HeaderPrimary2 = _interopRequireDefault(require("./components/HeaderPrimary/HeaderPrimary"));
+
+var _Sidebar2 = _interopRequireDefault(require("./components/Sidebar/Sidebar"));
+
+var _SidebarFooter2 = _interopRequireDefault(require("./components/Sidebar/components/SidebarFooter/SidebarFooter"));
+
+var _SidebarSection2 = _interopRequireDefault(require("./components/Sidebar/components/SidebarSection/SidebarSection"));
+
+var _SidebarHeader2 = _interopRequireDefault(require("./components/Sidebar/components/SidebarHeader/SidebarHeader"));
+
+var _SaveBar2 = _interopRequireDefault(require("./components/SaveBar/SaveBar"));
+
+var _ProfileSummary2 = _interopRequireDefault(require("./components/ProfileSummary/ProfileSummary"));
+//# sourceMappingURL=index.js.map

package/lib/components/Core/index.js.map

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

package/lib/components/Dropzone/Dropzone-story.js

@@ -0,0 +1,119 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _react2 = require("@storybook/react");
+
+var _react3 = require("@storybook/addon-knobs/react");
+
+var _Dropzone = _interopRequireDefault(require("./Dropzone"));
+
+var DropzoneExample =
+/*#__PURE__*/
+function (_Component) {
+  (0, _inherits2["default"])(DropzoneExample, _Component);
+
+  function DropzoneExample() {
+    var _getPrototypeOf2;
+
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, DropzoneExample);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = (0, _possibleConstructorReturn2["default"])(this, (_getPrototypeOf2 = (0, _getPrototypeOf3["default"])(DropzoneExample)).call.apply(_getPrototypeOf2, [this].concat(args)));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
+      uploadProgress: 0,
+      fileWasUploaded: false
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "fakeUpload", function () {
+      var uploadProgress = _this.state.uploadProgress;
+
+      if (uploadProgress >= 100) {
+        clearInterval(_this.interval);
+
+        _this.setState({
+          uploadProgress: 0,
+          fileWasUploaded: true
+        });
+      } else {
+        _this.setState(function (prevState) {
+          return {
+            uploadProgress: prevState.uploadProgress + 1
+          };
+        });
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onDropAccepted", function () {
+      _this.interval = setInterval(_this.fakeUpload, 10);
+    });
+    return _this;
+  }
+
+  (0, _createClass2["default"])(DropzoneExample, [{
+    key: "render",
+    value: function render() {
+      var _this$state = this.state,
+          uploadProgress = _this$state.uploadProgress,
+          fileWasUploaded = _this$state.fileWasUploaded;
+      return _react["default"].createElement(_Dropzone["default"], {
+        id: (0, _react3.text)('id', 'photos'),
+        label: (0, _react3.text)('label', 'Profile Photo'),
+        postLabel: (0, _react3.text)('postLabel', ''),
+        accept: (0, _react3.text)('accpet', 'image/*'),
+        onDropAccepted: this.onDropAccepted,
+        buttonText: (0, _react3.text)('buttonText', 'Upload an Image'),
+        fileWasUploaded: fileWasUploaded,
+        uploadProgress: uploadProgress,
+        error: (0, _react3.text)('error', 'Please upload an image file.'),
+        isSmall: (0, _react3["boolean"])('isSmall', false),
+        isCircular: (0, _react3["boolean"])('isCircular', false)
+      });
+    }
+  }]);
+  return DropzoneExample;
+}(_react.Component);
+
+var stories = (0, _react2.storiesOf)('Dropzone', module);
+stories.addDecorator(_react3.withKnobs);
+stories.add('Static', function () {
+  return _react["default"].createElement(_Dropzone["default"], {
+    id: (0, _react3.text)('id', 'photos'),
+    label: (0, _react3.text)('label', 'Profile Photo'),
+    postLabel: (0, _react3.text)('postLabel', ''),
+    accept: (0, _react3.text)('accpet', 'image/*'),
+    onDropAccepted: function onDropAccepted() {
+      return console.log('onDropAccepted');
+    },
+    buttonText: (0, _react3.text)('buttonText', 'Upload an Image'),
+    fileWasUploaded: (0, _react3["boolean"])('fileWasUploaded', false),
+    uploadProgress: (0, _react3.number)('uploadProgress', 0),
+    error: (0, _react3.text)('error', 'Please upload an image file.'),
+    isSmall: (0, _react3["boolean"])('isSmall', false),
+    isCircular: (0, _react3["boolean"])('isCircular', false)
+  });
+}).add('Dynamic', function () {
+  return _react["default"].createElement(DropzoneExample, null);
+});
+//# sourceMappingURL=Dropzone-story.js.map

package/lib/components/Dropzone/Dropzone-story.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Dropzone/Dropzone-story.js"],"names":["DropzoneExample","uploadProgress","fileWasUploaded","state","clearInterval","interval","setState","prevState","setInterval","fakeUpload","onDropAccepted","Component","stories","module","addDecorator","withKnobs","add","console","log"],"mappings":";;;;;;;;;;;;;;;;;;;;AACA;;AACA;;AACA;;AACA;;IAQMA,e;;;;;;;;;;;;;;;;;8FAEG;AACPC,MAAAA,cAAc,EAAE,CADT;AAEPC,MAAAA,eAAe,EAAE;AAFV,K;mGAKK,YAAM;AAAA,UACVD,cADU,GACS,MAAKE,KADd,CACVF,cADU;;AAElB,UAAIA,cAAc,IAAI,GAAtB,EAA2B;AAC1BG,QAAAA,aAAa,CAAC,MAAKC,QAAN,CAAb;;AACA,cAAKC,QAAL,CAAc;AACbL,UAAAA,cAAc,EAAE,CADH;AAEbC,UAAAA,eAAe,EAAE;AAFJ,SAAd;AAIA,OAND,MAMO;AACN,cAAKI,QAAL,CAAc,UAAAC,SAAS;AAAA,iBAAK;AAC3BN,YAAAA,cAAc,EAAEM,SAAS,CAACN,cAAV,GAA2B;AADhB,WAAL;AAAA,SAAvB;AAGA;AACD,K;uGAEgB,YAAM;AACtB,YAAKI,QAAL,GAAgBG,WAAW,CAAC,MAAKC,UAAN,EAAkB,EAAlB,CAA3B;AACA,K;;;;;;6BAEQ;AAAA,wBACoC,KAAKN,KADzC;AAAA,UACAF,cADA,eACAA,cADA;AAAA,UACgBC,eADhB,eACgBA,eADhB;AAER,aACC,gCAAC,oBAAD;AACC,QAAA,EAAE,EAAE,kBAAK,IAAL,EAAW,QAAX,CADL;AAEC,QAAA,KAAK,EAAE,kBAAK,OAAL,EAAc,eAAd,CAFR;AAGC,QAAA,SAAS,EAAE,kBAAK,WAAL,EAAkB,EAAlB,CAHZ;AAIC,QAAA,MAAM,EAAE,kBAAK,QAAL,EAAe,SAAf,CAJT;AAKC,QAAA,cAAc,EAAE,KAAKQ,cALtB;AAMC,QAAA,UAAU,EAAE,kBAAK,YAAL,EAAmB,iBAAnB,CANb;AAOC,QAAA,eAAe,EAAER,eAPlB;AAQC,QAAA,cAAc,EAAED,cARjB;AASC,QAAA,KAAK,EAAE,kBAAK,OAAL,EAAc,8BAAd,CATR;AAUC,QAAA,OAAO,EAAE,wBAAQ,SAAR,EAAmB,KAAnB,CAVV;AAWC,QAAA,UAAU,EAAE,wBAAQ,YAAR,EAAsB,KAAtB;AAXb,QADD;AAeA;;;EA3C4BU,gB;;AA8C9B,IAAMC,OAAO,GAAG,uBAAU,UAAV,EAAsBC,MAAtB,CAAhB;AAEAD,OAAO,CAACE,YAAR,CAAqBC,iBAArB;AAEAH,OAAO,CAELI,GAFF,CAEM,QAFN,EAEgB;AAAA,SACd,gCAAC,oBAAD;AACC,IAAA,EAAE,EAAE,kBAAK,IAAL,EAAW,QAAX,CADL;AAEC,IAAA,KAAK,EAAE,kBAAK,OAAL,EAAc,eAAd,CAFR;AAGC,IAAA,SAAS,EAAE,kBAAK,WAAL,EAAkB,EAAlB,CAHZ;AAIC,IAAA,MAAM,EAAE,kBAAK,QAAL,EAAe,SAAf,CAJT;AAKC,IAAA,cAAc,EAAE;AAAA,aAAMC,OAAO,CAACC,GAAR,CAAY,gBAAZ,CAAN;AAAA,KALjB;AAMC,IAAA,UAAU,EAAE,kBAAK,YAAL,EAAmB,iBAAnB,CANb;AAOC,IAAA,eAAe,EAAE,wBAAQ,iBAAR,EAA2B,KAA3B,CAPlB;AAQC,IAAA,cAAc,EAAE,oBAAO,gBAAP,EAAyB,CAAzB,CARjB;AASC,IAAA,KAAK,EAAE,kBAAK,OAAL,EAAc,8BAAd,CATR;AAUC,IAAA,OAAO,EAAE,wBAAQ,SAAR,EAAmB,KAAnB,CAVV;AAWC,IAAA,UAAU,EAAE,wBAAQ,YAAR,EAAsB,KAAtB;AAXb,IADc;AAAA,CAFhB,EAiBEF,GAjBF,CAiBM,SAjBN,EAiBiB;AAAA,SAAM,gCAAC,eAAD,OAAN;AAAA,CAjBjB","sourcesContent":["// @flow\nimport React, { Component } from 'react'\nimport { storiesOf } from '@storybook/react'\nimport { withKnobs, text, boolean, number } from '@storybook/addon-knobs/react'\nimport Dropzone from './Dropzone'\n\ntype Props = {}\ntype State = {\n\tuploadProgress: number,\n\tfileWasUploaded: boolean\n}\n\nclass DropzoneExample extends Component<Props, State> {\n\tinterval: any\n\tstate = {\n\t\tuploadProgress: 0,\n\t\tfileWasUploaded: false\n\t}\n\n\tfakeUpload = () => {\n\t\tconst { uploadProgress } = this.state\n\t\tif (uploadProgress >= 100) {\n\t\t\tclearInterval(this.interval)\n\t\t\tthis.setState({\n\t\t\t\tuploadProgress: 0,\n\t\t\t\tfileWasUploaded: true\n\t\t\t})\n\t\t} else {\n\t\t\tthis.setState(prevState => ({\n\t\t\t\tuploadProgress: prevState.uploadProgress + 1\n\t\t\t}))\n\t\t}\n\t}\n\n\tonDropAccepted = () => {\n\t\tthis.interval = setInterval(this.fakeUpload, 10)\n\t}\n\n\trender() {\n\t\tconst { uploadProgress, fileWasUploaded } = this.state\n\t\treturn (\n\t\t\t<Dropzone\n\t\t\t\tid={text('id', 'photos')}\n\t\t\t\tlabel={text('label', 'Profile Photo')}\n\t\t\t\tpostLabel={text('postLabel', '')}\n\t\t\t\taccept={text('accpet', 'image/*')}\n\t\t\t\tonDropAccepted={this.onDropAccepted}\n\t\t\t\tbuttonText={text('buttonText', 'Upload an Image')}\n\t\t\t\tfileWasUploaded={fileWasUploaded}\n\t\t\t\tuploadProgress={uploadProgress}\n\t\t\t\terror={text('error', 'Please upload an image file.')}\n\t\t\t\tisSmall={boolean('isSmall', false)}\n\t\t\t\tisCircular={boolean('isCircular', false)}\n\t\t\t/>\n\t\t)\n\t}\n}\n\nconst stories = storiesOf('Dropzone', module)\n\nstories.addDecorator(withKnobs)\n\nstories\n\n\t.add('Static', () => (\n\t\t<Dropzone\n\t\t\tid={text('id', 'photos')}\n\t\t\tlabel={text('label', 'Profile Photo')}\n\t\t\tpostLabel={text('postLabel', '')}\n\t\t\taccept={text('accpet', 'image/*')}\n\t\t\tonDropAccepted={() => console.log('onDropAccepted')}\n\t\t\tbuttonText={text('buttonText', 'Upload an Image')}\n\t\t\tfileWasUploaded={boolean('fileWasUploaded', false)}\n\t\t\tuploadProgress={number('uploadProgress', 0)}\n\t\t\terror={text('error', 'Please upload an image file.')}\n\t\t\tisSmall={boolean('isSmall', false)}\n\t\t\tisCircular={boolean('isCircular', false)}\n\t\t/>\n\t))\n\t.add('Dynamic', () => <DropzoneExample />)\n"],"file":"Dropzone-story.js"}