@unite-us/app-create-referral 0.1.16 → 0.1.17

package/dist/components/Stepper.js

@@ -6,30 +6,110 @@ _Object$defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = Stepper;
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+var _findIndex = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/find-index"));
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
 var _lodash = require("lodash");
 var _react = _interopRequireDefault(require("react"));
-function Stepper(_ref) {
+var _getBaseUrl = _interopRequireDefault(require("../utils/getBaseUrl"));
+var _api = require("../config/api");
+var _ui = require("@unite-us/ui");
+var steps = [{
+  route: "search",
+  label: "Search",
+  onStepClick: function onStepClick() {},
+  stepDisabled: true
+}, {
+  route: "referrals",
+  label: "Refer",
+  onStepClick: function onStepClick() {
+    _api.browserHistory.push("".concat((0, _getBaseUrl.default)(), "/referrals"));
+  }
+}, {
+  route: "supporting-info",
+  label: "Complete Assessments",
+  onStepClick: function onStepClick() {
+    _api.browserHistory.push("".concat((0, _getBaseUrl.default)(), "/supporting-info"));
+  }
+}, {
+  route: "review",
+  label: "Review",
+  onStepClick: function onStepClick() {
+    _api.browserHistory.push("".concat((0, _getBaseUrl.default)(), "/review"));
+  }
+}];
+function Step(_ref) {
   var _context;
-  var location = _ref.location;
+  var active = _ref.active,
+    completed = _ref.completed,
+    disabled = _ref.disabled,
+    icon = _ref.icon,
+    label = _ref.label,
+    onClick = _ref.onClick;
+  var iconBgColorClass = "";
+  if (active) {
+    iconBgColorClass = "bg-dark-blue";
+  } else if (completed) {
+    iconBgColorClass = "bg-action-blue";
+  } else {
+    iconBgColorClass = "bg-brand-blue";
+  }
+  var textColorClass = active || completed ? "text-dark-blue" : "text-brand-blue";
+  return /*#__PURE__*/_react.default.createElement("button", {
+    disabled: disabled,
+    className: (0, _concat.default)(_context = "flex items-center p-4 ".concat(disabled ? "cursor-default" : "", " ")).call(_context, !active && !completed ? "opacity-50" : ""),
+    onClick: onClick
+  }, completed ? /*#__PURE__*/_react.default.createElement(_ui.Icon, {
+    icon: "V2CheckCircle",
+    color: "#4467AB",
+    size: 24
+  }) : /*#__PURE__*/_react.default.createElement("div", {
+    className: "text-white text-base flex items-center justify-center font-black w-6 h-6 rounded-full ".concat(iconBgColorClass)
+  }, icon), /*#__PURE__*/_react.default.createElement("span", {
+    className: "font-black whitespace-no-wrap ml-2 text-base ".concat(textColorClass)
+  }, label));
+}
+function Stepper(_ref2) {
+  var location = _ref2.location;
   var pathname = location.pathname;
-  var route = (0, _lodash.get)(pathname.split('create-referral/'), '[1]');
+  var route = (0, _lodash.get)(pathname.split("create-referral/"), "[1]");
+  var currentStep = (0, _findIndex.default)(steps).call(steps, function (s) {
+    return s.route == route;
+  });
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "flex justify-around my-10"
-  }, (0, _map.default)(_context = ["search", "referrals", "supporting-info", "review"]).call(_context, function (step, i) {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: route === step ? 'bg-red' : 'bg-blue',
-      style: {
-        height: '40px',
-        width: '40px',
-        borderRadius: '60px',
-        justifyContent: 'center',
-        display: 'flex',
-        alignItems: 'center'
-      }
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      className: "text-white"
-    }, i + 1));
+    className: "flex justify-around items-center p-8",
+    activeStep: currentStep
+  }, (0, _map.default)(steps).call(steps, function (step, index) {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(Step, {
+      key: "step-".concat(index),
+      active: index === currentStep,
+      completed: isStepCompleted(steps[index], currentStep, index),
+      disabled: isStepDisabled(steps[index], currentStep),
+      icon: index + 1,
+      label: step.label,
+      onClick: step.onStepClick
+    }), index < steps.length - 1 && /*#__PURE__*/_react.default.createElement("div", {
+      key: "divider-".concat(index),
+      className: "h-px w-full bg-grey"
+    }));
   }));
 }
+function isStepCompleted(step, currentStep, index) {
+  if ((0, _lodash.isFunction)(step.stepCompleted)) {
+    return step.stepCompleted(currentStep);
+  }
+  if ((0, _lodash.isBoolean)(step.stepCompleted)) {
+    return step.stepCompleted;
+  }
+  return currentStep > index;
+}
+function isStepDisabled(step, currentStep) {
+  if ((0, _lodash.isFunction)(step.stepDisabled)) {
+    return step.stepDisabled(currentStep);
+  }
+  if ((0, _lodash.isBoolean)(step.stepDisabled)) {
+    return step.stepDisabled;
+  }
+  return false;
+}
 //# sourceMappingURL=Stepper.js.map

package/dist/components/Stepper.js.map

@@ -1 +1 @@
-{"version":3,"file":"Stepper.js","names":["_lodash","require","_react","_interopRequireDefault","Stepper","_ref","_context","location","pathname","route","get","split","default","createElement","className","_map","call","step","i","style","height","width","borderRadius","justifyContent","display","alignItems"],"sources":["../../src/components/Stepper.js"],"sourcesContent":["import { get } from 'lodash';\nimport React from 'react';\n\nexport default function Stepper({ location }) {\n\n  const pathname = location.pathname;\n  const route = get(pathname.split('create-referral/'), '[1]');\n  return (\n    <div className=\"flex justify-around my-10\">\n      {[\"search\", \"referrals\", \"supporting-info\", \"review\"].map((step, i) => (\n        <div\n          className={route === step ? 'bg-red' : 'bg-blue'}\n          style={{\n            height: '40px',\n            width: '40px',\n            borderRadius: '60px',\n            justifyContent: 'center',\n            display: 'flex',\n            alignItems: 'center',\n          }}>\n          <span className='text-white'>{i + 1}</span>\n        </div>)\n      )\n      }\n    </div >\n  )\n}"],"mappings":";;;;;;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEe,SAASG,OAAOA,CAAAC,IAAA,EAAe;EAAA,IAAAC,QAAA;EAAA,IAAZC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;EAExC,IAAMC,QAAQ,GAAGD,QAAQ,CAACC,QAAQ;EAClC,IAAMC,KAAK,GAAG,IAAAC,WAAG,EAACF,QAAQ,CAACG,KAAK,CAAC,kBAAkB,CAAC,EAAE,KAAK,CAAC;EAC5D,oBACET,MAAA,CAAAU,OAAA,CAAAC,aAAA;IAAKC,SAAS,EAAC;EAA2B,GACvC,IAAAC,IAAA,CAAAH,OAAA,EAAAN,QAAA,IAAC,QAAQ,EAAE,WAAW,EAAE,iBAAiB,EAAE,QAAQ,CAAC,EAAAU,IAAA,CAAAV,QAAA,EAAK,UAACW,IAAI,EAAEC,CAAC;IAAA,oBAChEhB,MAAA,CAAAU,OAAA,CAAAC,aAAA;MACEC,SAAS,EAAEL,KAAK,KAAKQ,IAAI,GAAG,QAAQ,GAAG,SAAU;MACjDE,KAAK,EAAE;QACLC,MAAM,EAAE,MAAM;QACdC,KAAK,EAAE,MAAM;QACbC,YAAY,EAAE,MAAM;QACpBC,cAAc,EAAE,QAAQ;QACxBC,OAAO,EAAE,MAAM;QACfC,UAAU,EAAE;MACd;IAAE,gBACFvB,MAAA,CAAAU,OAAA,CAAAC,aAAA;MAAMC,SAAS,EAAC;IAAY,GAAEI,CAAC,GAAG,CAAC,CAAQ,CACvC;EAAA,CAAC,CACR,CAEI;AAEX"}
+{"version":3,"file":"Stepper.js","names":["_lodash","require","_react","_interopRequireDefault","_getBaseUrl","_api","_ui","steps","route","label","onStepClick","stepDisabled","browserHistory","push","concat","getBaseUrl","Step","_ref","_context","active","completed","disabled","icon","onClick","iconBgColorClass","textColorClass","default","createElement","className","_concat","call","Icon","color","size","Stepper","_ref2","location","pathname","get","split","currentStep","_findIndex","s","activeStep","_map","step","index","Fragment","key","isStepCompleted","isStepDisabled","length","isFunction","stepCompleted","isBoolean"],"sources":["../../src/components/Stepper.js"],"sourcesContent":["import { get, isFunction, isBoolean } from \"lodash\";\nimport React from \"react\";\nimport getBaseUrl from \"../utils/getBaseUrl\";\nimport { browserHistory } from \"../config/api\";\nimport { Icon } from \"@unite-us/ui\";\n\nconst steps = [\n  {\n    route: \"search\",\n    label: \"Search\",\n    onStepClick: () => {},\n    stepDisabled: true,\n  },\n  {\n    route: \"referrals\",\n    label: \"Refer\",\n    onStepClick: () => {\n      browserHistory.push(`${getBaseUrl()}/referrals`);\n    },\n  },\n  {\n    route: \"supporting-info\",\n    label: \"Complete Assessments\",\n    onStepClick: () => {\n      browserHistory.push(`${getBaseUrl()}/supporting-info`);\n    },\n  },\n  {\n    route: \"review\",\n    label: \"Review\",\n    onStepClick: () => {\n      browserHistory.push(`${getBaseUrl()}/review`);\n    },\n  },\n];\n\nfunction Step({ active, completed, disabled, icon, label, onClick }) {\n  let iconBgColorClass = \"\";\n\n  if (active) {\n    iconBgColorClass = \"bg-dark-blue\";\n  } else if (completed) {\n    iconBgColorClass = \"bg-action-blue\";\n  } else {\n    iconBgColorClass = \"bg-brand-blue\";\n  }\n\n  let textColorClass =\n    active || completed ? \"text-dark-blue\" : \"text-brand-blue\";\n\n  return (\n    <button\n      disabled={disabled}\n      className={`flex items-center p-4 ${disabled ? \"cursor-default\" : \"\"} ${\n        !active && !completed ? \"opacity-50\" : \"\"\n      }`}\n      onClick={onClick}\n    >\n      {completed ? (\n        <Icon icon=\"V2CheckCircle\" color=\"#4467AB\" size={24} />\n      ) : (\n        <div\n          className={`text-white text-base flex items-center justify-center font-black w-6 h-6 rounded-full ${iconBgColorClass}`}\n        >\n          {icon}\n        </div>\n      )}\n\n      <span className={`font-black whitespace-no-wrap ml-2 text-base ${textColorClass}`}>{label}</span>\n    </button>\n  );\n}\n\nexport default function Stepper({ location }) {\n  const pathname = location.pathname;\n  const route = get(pathname.split(\"create-referral/\"), \"[1]\");\n  const currentStep = steps.findIndex((s) => s.route == route);\n\n  return (\n    <div className=\"flex justify-around items-center p-8\" activeStep={currentStep}>\n      {steps.map((step, index) => {\n        return (\n          <>\n            <Step\n              key={`step-${index}`}\n              active={index === currentStep}\n              completed={isStepCompleted(steps[index], currentStep, index)}\n              disabled={isStepDisabled(steps[index], currentStep)}\n              icon={index + 1}\n              label={step.label}\n              onClick={step.onStepClick}\n            />\n            {index < steps.length - 1 && (\n              <div\n                key={`divider-${index}`}\n                className=\"h-px w-full bg-grey\"\n              />\n            )}\n          </>\n        );\n      })}\n    </div>\n  );\n}\n\nfunction isStepCompleted(step, currentStep, index) {\n  if (isFunction(step.stepCompleted)) {\n    return step.stepCompleted(currentStep);\n  }\n  if (isBoolean(step.stepCompleted)) {\n    return step.stepCompleted;\n  }\n  return currentStep > index;\n}\n\nfunction isStepDisabled(step, currentStep) {\n  if (isFunction(step.stepDisabled)) {\n    return step.stepDisabled(currentStep);\n  }\n  if (isBoolean(step.stepDisabled)) {\n    return step.stepDisabled;\n  }\n  return false;\n}\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unite-us/app-create-referral",
-  "version": "0.1.16",
+  "version": "0.1.17",
   "main": "build/index.js",
   "author": "Alex Morales",
   "dependencies": {