summit-registration-lite 2.0.0 → 2.0.1

package/README.md

@@ -14,6 +14,10 @@ React component for the summit registration lite widget
 
    **supportEmail**           = string with the email address for support
 
+   **allowsNativeAuth**       = boolean to show/hide native auth
+
+   **allowsOtpAuth**          = boolean to show/hide OTP auth
+
    **loginOptions**           = array with the options to show on the login screen
 
    **loading**                = boolean to show/hide a loader on the widget
@@ -42,6 +46,8 @@ React component for the summit registration lite widget
    **loginWithCode**          = method passed that will be called when the user tries to login with a code
 
    **onPurchaseComplete**     = method passed that will be called after the purchase of a ticket it's completed
+
+   **handleCompanyError**     = method passed that will be called if the company dropdown can't be fetched
    
 
 ## PUBLISH TO NPM:

package/dist/index.css

@@ -2,13 +2,13 @@
 
 :root{--color_primary: lightgray;--color_primary50: lightgray;--color_primary_contrast: #fff;--color_primary_contrast50: #ffffff50;--color_secondary: lightgray;--color_secondary_contrast: lightgray;--color_text_dark: #212121;--color_text_light: #ffffff;--color_text_input_hints: #212121}.step-wrapper{padding:10px;margin:10px;border:1px solid lightgray;border-radius:5px}.summit-registration-lite{color:var(--color_text_dark);font-size:15px}input{outline:none}
 
-.loginWrapper___sxUEn{display:flex;justify-content:center;font-weight:bold;text-align:center;padding:20px 0 30px}.innerWrapper___GQRkq{display:flex;flex-direction:column;justify-content:center;width:300px}.innerWrapper___GQRkq span{margin:10px 0}.button___QMZPu{padding:10px 30px;background-color:red;color:white;font-weight:normal;display:inline-flex;justify-content:center;margin:5px 0;border-radius:5px;cursor:pointer;background-position:28px center;background-repeat:no-repeat;background-size:16px;line-height:1.4}.loginCode___dDBup{margin-bottom:10px;font-size:16px}.loginCode___dDBup>div{margin-top:10px}.loginCode___dDBup span{display:inline-block;font-weight:normal;font-size:14px;color:#e5424d}.input___QR9sA{display:flex;height:40px;margin-top:5px}.input___QR9sA input{border:1px solid var(--color_primary);border-radius:5px;padding:5px;width:100%}.input___QR9sA input::placeholder{color:var(--color_text_input_hints)}.input___QR9sA button{margin-left:5px;background-color:var(--color_secondary_contrast);padding:0px 15px;border:1px solid var(--color_secondary_contrast);color:#fff;box-shadow:none;text-align:center;white-space:nowrap;font-weight:bold;border-radius:5px;cursor:pointer;display:flex;align-items:center;justify-content:center}
+.loginWrapper___sxUEn{display:flex;justify-content:center;font-weight:bold;text-align:center;padding:20px 0 30px}.innerWrapper___GQRkq{display:flex;flex-direction:column;justify-content:center;width:300px}.innerWrapper___GQRkq span{margin:10px 0}.button___QMZPu{padding:10px 30px;background-color:red;color:white;font-weight:normal;display:inline-flex;justify-content:center;margin:5px 0;border-radius:5px;cursor:pointer;background-position:28px center;background-repeat:no-repeat;background-size:16px;line-height:1.4;box-shadow:0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)}.button___QMZPu:hover{box-shadow:0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)}.loginCode___dDBup{margin-bottom:10px;font-size:16px}.loginCode___dDBup>div{margin-top:10px}.loginCode___dDBup span{display:inline-block;font-weight:normal;font-size:14px;color:#e5424d}.input___QR9sA{display:flex;height:40px;margin-top:5px}.input___QR9sA input{border:1px solid var(--color_primary);border-radius:5px;padding:5px;width:100%}.input___QR9sA input::placeholder{color:var(--color_text_input_hints)}.input___QR9sA button{margin-left:5px;background-color:var(--color_secondary_contrast);padding:0px 15px;border:1px solid var(--color_secondary_contrast);color:#fff;box-shadow:none;text-align:center;white-space:nowrap;font-weight:bold;border-radius:5px;cursor:pointer;display:flex;align-items:center;justify-content:center}
 
 .title___LksVm{font-weight:bold;cursor:pointer}.form___v5GIx{display:flex;flex-wrap:wrap;justify-content:space-between;margin:10px 0}.form___v5GIx div.fieldWrapper___Eoe61{width:48%;border-radius:5px;background-color:#e6f3ff;border:1px solid #3fa2f7;height:36px;padding:5px;display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}.form___v5GIx div.fieldWrapper___Eoe61:first-of-type{width:100%}.form___v5GIx div.fieldWrapper___Eoe61 input{width:100%;background-color:transparent;border:none}.form___v5GIx div.fieldWrapper___Eoe61 input:focus-visible{outline:none}.form___v5GIx div.fieldWrapper___Eoe61 i{position:relative;padding-right:5px}.form___v5GIx div.fieldWrapper___Eoe61>div{width:100%;padding-left:5px}.form___v5GIx div.fieldWrapper___Eoe61>div:first-of-type{width:95%}.form___v5GIx input{width:48%;border-radius:5px;border:1px solid #3fa2f7;color:#3486cd;font-size:16px;background-color:#e6f3ff;height:36px;padding:5px;display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;font-weight:bold}.form___v5GIx input::placeholder{color:#3486cd}
 
 .form___DoT3x{display:flex;flex-wrap:wrap;justify-content:space-between;margin:10px 0}.form___DoT3x div.fieldWrapper___wa1Ks{display:flex;width:48%;border-radius:5px;border:1px solid var(--color_primary);height:36px;padding:5px;display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}.form___DoT3x div.fieldWrapper___wa1Ks:first-of-type{width:100%}.form___DoT3x div.fieldWrapper___wa1Ks:last-of-type{flex-direction:column}.form___DoT3x div.fieldWrapper___wa1Ks input{width:100%;background-color:transparent;border:none}.form___DoT3x div.fieldWrapper___wa1Ks input:focus-visible{outline:none}.form___DoT3x div.fieldWrapper___wa1Ks i{position:relative;padding-right:5px}.form___DoT3x div.fieldWrapper___wa1Ks>div{width:100%;padding-left:5px}.form___DoT3x div.fieldWrapper___wa1Ks>div:first-of-type{width:95%}.form___DoT3x div.fieldWrapper___wa1Ks span{display:inline-block;color:#e5424d;font-size:14px;align-self:flex-start}.form___DoT3x input{width:48%;border-radius:5px;color:#3486cd;font-size:16px;height:36px;padding:5px;display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}.form___DoT3x input::placeholder{color:var(--color_text_input_hints);font-size:16px}
 
-.title___ECoNz{font-weight:bold;cursor:pointer;display:flex;justify-content:space-between}.title___ECoNz div{font-weight:normal}.form___lDFka{display:flex;flex-wrap:wrap;justify-content:space-between;margin:10px 0}.form___lDFka div{width:48%}.form___lDFka div input{width:100%;border-radius:5px;border:1px solid var(--color_primary);height:36px;padding:5px;display:flex;justify-content:space-between;align-items:center;font-size:15px}.form___lDFka div input::placeholder{color:var(--color_text_input_hints)}.form___lDFka div .readOnly___WRazF{opacity:0.6;cursor:default}.form___lDFka div span{display:inline-block;color:#e5424d}.form___lDFka div>:last-child{margin-bottom:5px}
+.title___ECoNz{font-weight:bold;cursor:pointer;display:flex;justify-content:space-between}.title___ECoNz div{font-weight:normal}.form___lDFka{display:flex;flex-wrap:wrap;justify-content:space-between;margin:10px 0}.form___lDFka>div{width:48%}.form___lDFka>div input{width:100%;border-radius:5px;border:1px solid var(--color_primary);height:36px;padding:5px;display:flex;justify-content:space-between;align-items:center;font-size:15px}.form___lDFka>div input::placeholder{color:var(--color_text_input_hints)}.form___lDFka>div .readOnly___WRazF{opacity:0.6;cursor:default}.form___lDFka>div span{display:inline-block;color:#e5424d}.form___lDFka>div>:last-child{margin-bottom:5px}.form___lDFka .companies___kmGFB{width:48%}.form___lDFka .companies___kmGFB>div{position:relative;width:100%;border-radius:5px;display:flex;justify-content:space-between;align-items:center;font-size:15px}.form___lDFka .companies___kmGFB>div::placeholder{color:var(--color_text_input_hints)}.form___lDFka .companies___kmGFB>div>div{height:100%;width:100%}.form___lDFka .companies___kmGFB>div>div>div{height:36px;padding:0px;border:1px solid var(--color_primary)}.form___lDFka .companies___kmGFB>div>div>div>div{height:36px}.form___lDFka .companies___kmGFB>div input{padding:5px;border:1px solid var(--color_primary);padding-right:0px !important;background-color:transparent}.form___lDFka .companies___kmGFB>div i{right:10px !important}
 
 .title___DNZyl{font-weight:bold;cursor:pointer;display:flex;justify-content:space-between}.summary___quWdZ{text-align:right}.crossOut___QZ7dy{text-decoration:line-through}.discount___sEK_Q{color:green}.promo___F8lPO{font-weight:bold;display:flex;justify-content:flex-end}.dropdown____HWg0{margin-top:5px}.inPersonDisclaimer___PXGTz{margin-top:15px}
 

package/dist/index.js

@@ -87,6 +87,12 @@ const methods_namespaceObject = require("openstack-uicore-foundation/lib/utils/m
 const external_sweetalert2_namespaceObject = require("sweetalert2");
 var external_sweetalert2_default = /*#__PURE__*/__webpack_require__.n(external_sweetalert2_namespaceObject);
 ;// CONCATENATED MODULE: ./src/actions.js
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : 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; }
+
 /**
  * Copyright 2020 OpenStack Foundation
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -192,7 +198,7 @@ const reserveTicket = (personalInformation, ticket) => async (dispatch, getState
     access_token,
     expand: 'tickets,tickets.owner,tickets.ticket_type,tickets.ticket_type.taxes'
   };
-  let normalizedEntity = {
+  let normalizedEntity = normalizeReservation({
     owner_email: email,
     owner_first_name: firstName,
     owner_last_name: lastName,
@@ -204,7 +210,7 @@ const reserveTicket = (personalInformation, ticket) => async (dispatch, getState
       attendee_last_name: lastName,
       attendee_email: email
     }]
-  };
+  });
   return (0,actions_namespaceObject.postRequest)((0,actions_namespaceObject.createAction)(CREATE_RESERVATION), (0,actions_namespaceObject.createAction)(CREATE_RESERVATION_SUCCESS), `${apiBaseUrl}/api/v1/summits/${summitId}/orders/reserve`, normalizedEntity, methods_namespaceObject.authErrorHandler // entity
   )(params)(dispatch).then(payload => {
     dispatch(stopWidgetLoading());
@@ -384,12 +390,25 @@ const isInPersonTicketType = ticketType => {
 
   return false;
 };
+
+const normalizeReservation = entity => {
+  const normalizedEntity = _objectSpread({}, entity);
+
+  if (!entity.owner_company.id) {
+    normalizedEntity['owner_company'] = entity.owner_company.name;
+  } else {
+    delete normalizedEntity['owner_company'];
+    normalizedEntity['owner_company_id'] = entity.owner_company.id;
+  }
+
+  return normalizedEntity;
+};
 ;// CONCATENATED MODULE: ./src/reducer.js
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function reducer_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? reducer_ownKeys(Object(source), !0).forEach(function (key) { reducer_defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : reducer_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; }
+function reducer_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; }
 
 /**
  * Copyright 2020 OpenStack Foundation
@@ -434,14 +453,14 @@ const RegistrationLiteReducer = (state = DEFAULT_STATE, action) => {
   switch (type) {
     case START_WIDGET_LOADING:
       {
-        return _objectSpread(_objectSpread({}, state), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
           widgetLoading: true
         });
       }
 
     case STOP_WIDGET_LOADING:
       {
-        return _objectSpread(_objectSpread({}, state), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
           widgetLoading: false
         });
       }
@@ -459,11 +478,11 @@ const RegistrationLiteReducer = (state = DEFAULT_STATE, action) => {
           document.documentElement.style.setProperty(`--${setting}50`, `${marketingData[setting]}50`);
         }
       });
-      return _objectSpread(_objectSpread({}, state), {}, {
+      return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
         reservation: null,
         checkout: null,
-        passwordless: _objectSpread({}, DEFAULT_STATE.passwordless),
-        settings: _objectSpread(_objectSpread({}, DEFAULT_STATE.settings), {}, {
+        passwordless: reducer_objectSpread({}, DEFAULT_STATE.passwordless),
+        settings: reducer_objectSpread(reducer_objectSpread({}, DEFAULT_STATE.settings), {}, {
           marketingData: marketingData,
           summitId: summitData.id,
           userProfile: profileData,
@@ -473,29 +492,29 @@ const RegistrationLiteReducer = (state = DEFAULT_STATE, action) => {
 
     case CHANGE_STEP:
       {
-        return _objectSpread(_objectSpread({}, state), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
           step: payload
         });
       }
 
     case GET_TICKET_TYPES:
       {
-        return _objectSpread(_objectSpread({}, state), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
           ticketTypes: payload.response.data
         });
       }
 
     case GET_TAX_TYPES:
       {
-        return _objectSpread(_objectSpread({}, state), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
           taxTypes: payload.response.data
         });
       }
 
     case GO_TO_LOGIN:
       {
-        return _objectSpread(_objectSpread({}, state), {}, {
-          passwordless: _objectSpread(_objectSpread({}, state.passwordless), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
+          passwordless: reducer_objectSpread(reducer_objectSpread({}, state.passwordless), {}, {
             code_sent: false,
             error: false
           })
@@ -504,8 +523,8 @@ const RegistrationLiteReducer = (state = DEFAULT_STATE, action) => {
 
     case SET_PASSWORDLESS_LOGIN:
       {
-        return _objectSpread(_objectSpread({}, state), {}, {
-          passwordless: _objectSpread(_objectSpread({}, state.passwordless), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
+          passwordless: reducer_objectSpread(reducer_objectSpread({}, state.passwordless), {}, {
             email: payload,
             error: false
           })
@@ -517,8 +536,8 @@ const RegistrationLiteReducer = (state = DEFAULT_STATE, action) => {
         const {
           otp_length
         } = payload;
-        return _objectSpread(_objectSpread({}, state), {}, {
-          passwordless: _objectSpread(_objectSpread({}, state.passwordless), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
+          passwordless: reducer_objectSpread(reducer_objectSpread({}, state.passwordless), {}, {
             otp_length,
             code_sent: true,
             error: false
@@ -528,8 +547,8 @@ const RegistrationLiteReducer = (state = DEFAULT_STATE, action) => {
 
     case SET_PASSWORDLESS_ERROR:
       {
-        return _objectSpread(_objectSpread({}, state), {}, {
-          passwordless: _objectSpread(_objectSpread({}, state.passwordless), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
+          passwordless: reducer_objectSpread(reducer_objectSpread({}, state.passwordless), {}, {
             error: true
           })
         });
@@ -538,26 +557,26 @@ const RegistrationLiteReducer = (state = DEFAULT_STATE, action) => {
     case CREATE_RESERVATION_SUCCESS:
       {
         const reservation = payload.response;
-        return _objectSpread(_objectSpread({}, state), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
           reservation
         });
       }
 
     case DELETE_RESERVATION_SUCCESS:
-      return _objectSpread(_objectSpread({}, state), {}, {
+      return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
         reservation: null
       });
 
     case CLEAR_RESERVATION:
       {
-        return _objectSpread(_objectSpread({}, state), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
           reservation: null
         });
       }
 
     case PAY_RESERVATION:
       {
-        return _objectSpread(_objectSpread({}, state), {}, {
+        return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
           checkout: payload.response,
           reservation: null,
           userProfile: null
@@ -653,7 +672,8 @@ const stripe_js_namespaceObject = require("@stripe/stripe-js");
 
 const LoginComponent = ({
   options,
-  login,
+  allowsNativeAuth,
+  allowsOtpAuthlogin,
   getLoginCode,
   getPasswordlessCode
 }) => {
@@ -694,23 +714,52 @@ const LoginComponent = ({
   }, ">"), /*#__PURE__*/external_react_default().createElement("br", null)), emailError && /*#__PURE__*/external_react_default().createElement("span", {
     "data-testid": "email-error"
   }, "Please enter a valid email adress")), /*#__PURE__*/external_react_default().createElement("span", null, "Or you may signup or login with a social provider:"), options.map((o, index) => {
-    return /*#__PURE__*/external_react_default().createElement("div", {
+    return o.provider_param ? /*#__PURE__*/external_react_default().createElement("div", {
       className: `${index_module.button}`,
-      key: `provider-${o.provider_param ? o.provider_param : 'fnid'}`,
+      key: `provider-${o.provider_param}`,
       "data-testid": "login-button",
       style: {
         color: o.button_border_color ? o.button_border_color : '#ffffff',
         border: `thin solid ${o.button_border_color ? o.button_border_color : o.button_color}`,
         backgroundColor: o.button_color,
+        color: o.font_color,
         backgroundImage: o.provider_logo ? `url(${o.provider_logo})` : 'none',
         backgroundSize: o.provider_logo_size ? o.provider_logo_size : ''
       },
       onClick: () => login(o.provider_param)
-    }, o.provider_label);
-  }))));
+    }, o.provider_label) : allowsNativeAuth ? /*#__PURE__*/external_react_default().createElement("div", {
+      className: `${index_module.button}`,
+      key: `provider-fnid`,
+      "data-testid": "login-button",
+      style: {
+        color: o.button_border_color ? o.button_border_color : '#ffffff',
+        border: `thin solid ${o.button_border_color ? o.button_border_color : o.button_color}`,
+        backgroundColor: o.button_color,
+        color: o.font_color,
+        backgroundImage: o.provider_logo ? `url(${o.provider_logo})` : 'none',
+        backgroundSize: o.provider_logo_size ? o.provider_logo_size : ''
+      },
+      onClick: () => login(o.provider_param)
+    }, o.provider_label) : null;
+  }), allowsOtpAuthlogin && /*#__PURE__*/external_react_default().createElement("div", {
+    className: index_module.loginCode
+  }, "or get a login code emailed to you", /*#__PURE__*/external_react_default().createElement("div", {
+    className: index_module.input
+  }, /*#__PURE__*/external_react_default().createElement("input", {
+    placeholder: "youremail@example.com",
+    value: email,
+    onChange: e => setEmail(e.target.value),
+    onKeyPress: ev => ev.key === 'Enter' ? loginCode() : null,
+    "data-testid": "email-input"
+  }), /*#__PURE__*/external_react_default().createElement("button", {
+    onClick: () => loginCode(),
+    "data-testid": "email-button"
+  }, ">"), /*#__PURE__*/external_react_default().createElement("br", null)), emailError && /*#__PURE__*/external_react_default().createElement("span", {
+    "data-testid": "email-error"
+  }, "Please enter a valid email adress")))));
 };
 
-/* harmony default export */ const login = (LoginComponent);
+/* harmony default export */ const components_login = (LoginComponent);
 ;// CONCATENATED MODULE: external "prop-types"
 const external_prop_types_namespaceObject = require("prop-types");
 ;// CONCATENATED MODULE: external "@stripe/react-stripe-js"
@@ -924,11 +973,13 @@ const PaymentComponent = ({
 };
 
 /* harmony default export */ const payment = (PaymentComponent);
+;// CONCATENATED MODULE: external "openstack-uicore-foundation/lib/components"
+const components_namespaceObject = require("openstack-uicore-foundation/lib/components");
 ;// CONCATENATED MODULE: external "react-hook-form"
 const external_react_hook_form_namespaceObject = require("react-hook-form");
 ;// CONCATENATED MODULE: ./src/components/personal-information/index.module.scss
 // extracted by mini-css-extract-plugin
-/* harmony default export */ const personal_information_index_module = ({"title":"title___ECoNz","form":"form___lDFka","readOnly":"readOnly___WRazF"});
+/* harmony default export */ const personal_information_index_module = ({"title":"title___ECoNz","form":"form___lDFka","readOnly":"readOnly___WRazF","companies":"companies___kmGFB"});
 ;// CONCATENATED MODULE: ./src/components/personal-information/index.js
 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); }
 
@@ -957,11 +1008,14 @@ function personal_information_defineProperty(obj, key, value) { if (key in obj)
 
 
 
+
 const PersonalInfoComponent = ({
   isActive,
   changeForm,
   reservation,
-  userProfile
+  userProfile,
+  summitId,
+  handleCompanyError
 }) => {
   var _errors$email, _errors$email2;
 
@@ -969,9 +1023,13 @@ const PersonalInfoComponent = ({
     firstName: userProfile.given_name || '',
     lastName: userProfile.family_name || '',
     email: userProfile.email || '',
-    company: userProfile.company || '',
+    company: {
+      id: null,
+      name: userProfile.company || ''
+    },
     promoCode: ''
   });
+  const [companyError, setCompanyError] = (0,external_react_namespaceObject.useState)(false);
   const {
     register,
     handleSubmit,
@@ -985,14 +1043,30 @@ const PersonalInfoComponent = ({
         firstName: reservation.owner_first_name ? reservation.owner_first_name : personalInfo.firstName,
         lastName: reservation.owner_last_name ? reservation.owner_last_name : personalInfo.lastName,
         email: reservation.owner_email ? reservation.owner_email : personalInfo.email,
-        company: reservation.owner_company ? reservation.owner_company : personalInfo.company
+        company: {
+          id: null,
+          name: reservation.owner_company ? reservation.owner_company : personalInfo.company
+        }
       });
     }
   }, []);
 
+  const onCompanyChange = ev => {
+    const newCompany = ev.target.value;
+    setCompanyError(false);
+    setPersonalInfo(personal_information_objectSpread(personal_information_objectSpread({}, personalInfo), {}, {
+      company: newCompany
+    }));
+  };
+
   const onSubmit = data => {
-    setPersonalInfo(data);
-    changeForm(data);
+    if (!personalInfo.company.name) {
+      setCompanyError(true);
+      return;
+    }
+
+    setPersonalInfo(personal_information_objectSpread(personal_information_objectSpread({}, personalInfo), data));
+    changeForm(personal_information_objectSpread(personal_information_objectSpread({}, personalInfo), data));
   };
 
   const [ref, {
@@ -1020,7 +1094,7 @@ const PersonalInfoComponent = ({
     className: personal_information_index_module.title
   }, /*#__PURE__*/external_react_default().createElement("span", null, "Personal Information"), !isActive && /*#__PURE__*/external_react_default().createElement("div", {
     "data-testid": "personal-info"
-  }, /*#__PURE__*/external_react_default().createElement("span", null, `${personalInfo.firstName} ${personalInfo.lastName} ${personalInfo.company ? `- ${personalInfo.company}` : ''}`), /*#__PURE__*/external_react_default().createElement("br", null), /*#__PURE__*/external_react_default().createElement("span", null, personalInfo.email))), /*#__PURE__*/external_react_default().createElement(external_react_spring_namespaceObject.animated.div, {
+  }, /*#__PURE__*/external_react_default().createElement("span", null, `${personalInfo.firstName} ${personalInfo.lastName} ${personalInfo.company.name ? `- ${personalInfo.company.name}` : ''}`), /*#__PURE__*/external_react_default().createElement("br", null), /*#__PURE__*/external_react_default().createElement("span", null, personalInfo.email))), /*#__PURE__*/external_react_default().createElement(external_react_spring_namespaceObject.animated.div, {
     style: personal_information_objectSpread({
       overflow: 'hidden'
     }, toggleAnimation)
@@ -1068,15 +1142,15 @@ const PersonalInfoComponent = ({
     "data-testid": "email-error-required"
   }, "This field is required"), ((_errors$email2 = errors.email) === null || _errors$email2 === void 0 ? void 0 : _errors$email2.type) === 'pattern' && /*#__PURE__*/external_react_default().createElement("span", {
     "data-testid": "email-error-invalid"
-  }, "The email is invalid")), /*#__PURE__*/external_react_default().createElement("div", null, /*#__PURE__*/external_react_default().createElement("input", _extends({
-    type: "text",
-    placeholder: "Company *",
-    defaultValue: personalInfo.company || ''
-  }, register("company", {
-    required: true
-  }), {
-    "data-testid": "company"
-  })), errors.company && /*#__PURE__*/external_react_default().createElement("span", {
+  }, "The email is invalid")), /*#__PURE__*/external_react_default().createElement("div", {
+    className: personal_information_index_module.companies
+  }, /*#__PURE__*/external_react_default().createElement(components_namespaceObject.RegistrationCompanyInput, {
+    id: "company",
+    summitId: summitId,
+    onChange: onCompanyChange,
+    onError: handleCompanyError,
+    value: personalInfo.company
+  }), companyError && /*#__PURE__*/external_react_default().createElement("span", {
     "data-testid": "company-error"
   }, "This field is required")), /*#__PURE__*/external_react_default().createElement("div", null, /*#__PURE__*/external_react_default().createElement("input", _extends({
     type: "text",
@@ -1526,7 +1600,7 @@ const TicketOwnedComponent = ({
 
 /* harmony default export */ const ticket_owned = (TicketOwnedComponent);
 ;// CONCATENATED MODULE: ./src/components/registration-lite.js
-const _excluded = ["loadSession", "setMarketingSettings", "changeStep", "removeReservedTicket", "reserveTicket", "payTicket", "onPurchaseComplete", "getTicketTypes", "getTaxesTypes", "getLoginCode", "passwordlessLogin", "goToLogin", "loginOptions", "reservation", "checkout", "ticketTypes", "taxTypes", "step", "passwordlessCodeSent", "passwordlessEmail", "passwordlessCode", "getPasswordlessCode", "passwordlessCodeError", "loginWithCode", "goToExtraQuestions", "goToEvent", "goToRegistration", "profileData", "summitData", "supportEmail", "ticketOwned", "widgetLoading", "loading", "inPersonDisclaimer", "userProfile"];
+const _excluded = ["loadSession", "setMarketingSettings", "changeStep", "removeReservedTicket", "reserveTicket", "payTicket", "onPurchaseComplete", "getTicketTypes", "getTaxesTypes", "getLoginCode", "passwordlessLogin", "goToLogin", "loginOptions", "allowsNativeAuth", "allowsOtpAuth", "reservation", "checkout", "ticketTypes", "taxTypes", "step", "passwordlessCodeSent", "passwordlessEmail", "passwordlessCode", "getPasswordlessCode", "passwordlessCodeError", "loginWithCode", "goToExtraQuestions", "goToEvent", "goToRegistration", "profileData", "summitData", "supportEmail", "ticketOwned", "widgetLoading", "loading", "inPersonDisclaimer", "userProfile", "handleCompanyError"];
 
 function registration_lite_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -1585,6 +1659,8 @@ const RegistrationLite = _ref => {
     passwordlessLogin,
     goToLogin,
     loginOptions,
+    allowsNativeAuth,
+    allowsOtpAuth,
     reservation,
     checkout,
     ticketTypes,
@@ -1606,7 +1682,8 @@ const RegistrationLite = _ref => {
     widgetLoading,
     loading,
     inPersonDisclaimer,
-    userProfile
+    userProfile,
+    handleCompanyError
   } = _ref,
       rest = _objectWithoutProperties(_ref, _excluded);
 
@@ -1694,8 +1771,10 @@ const RegistrationLite = _ref => {
     goToRegistration: goToRegistration
   })), !ticketOwned && /*#__PURE__*/external_react_default().createElement("div", {
     className: general_module.stepsWrapper
-  }, !profileData && !passwordlessCodeSent && /*#__PURE__*/external_react_default().createElement(login, {
+  }, !profileData && !passwordlessCodeSent && /*#__PURE__*/external_react_default().createElement(components_login, {
     options: loginOptions,
+    allowsNativeAuth: allowsNativeAuth,
+    allowsOtpAuth: allowsOtpAuth,
     login: provider => rest.authUser(provider),
     getLoginCode: getLoginCode,
     getPasswordlessCode: getPasswordlessCode
@@ -1721,9 +1800,11 @@ const RegistrationLite = _ref => {
     isActive: step === 1,
     reservation: reservation,
     userProfile: profileData,
+    summitId: summitData.id,
     changeForm: personalForm => setRegistrationForm(registration_lite_objectSpread(registration_lite_objectSpread({}, registrationForm), {}, {
       personalInformation: personalForm
-    }))
+    })),
+    handleCompanyError: handleCompanyError
   }), /*#__PURE__*/external_react_default().createElement(external_react_spring_namespaceObject.animated.div, {
     style: registration_lite_objectSpread({}, toggleAnimation)
   }, /*#__PURE__*/external_react_default().createElement("div", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "summit-registration-lite",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "Summit Registration Lite",
   "main": "index.js",
   "scripts": {
@@ -58,7 +58,7 @@
     "moment": "^2.22.2",
     "moment-timezone": "^0.5.21",
     "node-sass": "^7.0.1",
-    "openstack-uicore-foundation": "^4.0.7",
+    "openstack-uicore-foundation": "^4.0.14",
     "optimize-css-assets-webpack-plugin": "^6.0.1",
     "path": "^0.12.7",
     "react": "^16.8.4",
@@ -102,7 +102,7 @@
     "lodash": "^4.17.14",
     "moment": "^2.22.2",
     "moment-timezone": "^0.5.21",
-    "openstack-uicore-foundation": "^4.0.7",
+    "openstack-uicore-foundation": "^4.0.14",
     "react": "^16.8.4",
     "react-bootstrap": "^0.31.5",
     "react-datetime": "^2.16.2",