@saasquatch/mint-components 1.12.1-7 → 1.13.0-1

package/dist/cjs/sqm-tabs.cjs.entry.js

@@ -2,12 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-3cf5ef3d.js');
-const stencilHooks_module = require('./stencil-hooks.module-ece1ee46.js');
-const index_module = require('./index.module-ccf9bd9c.js');
+const index = require('./index-a29c60ef.js');
+const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
+const index_module = require('./index.module-3ae0c462.js');
 const utils = require('./utils-6847bc06.js');
-const reRender = require('./re-render-1e63c82b.js');
-const useChildElements = require('./useChildElements-438cf387.js');
+const reRender = require('./re-render-5bfdb0d3.js');
+const useChildElements = require('./useChildElements-4e04d4a0.js');
 
 const TabsView = ({ content, placement, }) => {
   // Vertical padding for top & bottom placement, horizontal for left & right.
@@ -41,7 +41,7 @@ const TabsView = ({ content, placement, }) => {
 const REVEAL_EVENT = "sq:reveal";
 function useTabs() {
   const rawTabs = useChildElements.useChildElements();
-  const host = index_module.T();
+  const host = index_module._();
   const tick = reRender.useRerenderListener();
   const tabs = stencilHooks_module.useMemo(() => rawTabs
     .filter((tab) => tab.tagName === "SQM-TAB" || tab.tagName === "RAISINS-PLOP-TARGET")

package/dist/cjs/{sqm-text-span-view-a22f50aa.js → sqm-text-span-view-0aa82125.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const index = require('./index-3cf5ef3d.js');
+const index = require('./index-a29c60ef.js');
 const JSS = require('./JSS-8503a151.js');
 
 const style = {

package/dist/cjs/sqm-text-span.cjs.entry.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-3cf5ef3d.js');
-const stencilHooks_module = require('./stencil-hooks.module-ece1ee46.js');
+const index = require('./index-a29c60ef.js');
+const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
 require('./JSS-8503a151.js');
-const sqmTextSpanView = require('./sqm-text-span-view-a22f50aa.js');
+const sqmTextSpanView = require('./sqm-text-span-view-0aa82125.js');
 
 const Text = class {
   constructor(hostRef) {

package/dist/cjs/{stencil-hooks.module-ece1ee46.js → stencil-hooks.module-3a336b0f.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const index = require('./index-3cf5ef3d.js');
+const index = require('./index-a29c60ef.js');
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 

package/dist/cjs/{useChildElements-438cf387.js → useChildElements-4e04d4a0.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-const stencilHooks_module = require('./stencil-hooks.module-ece1ee46.js');
-const index_module = require('./index.module-ccf9bd9c.js');
+const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
+const index_module = require('./index.module-3ae0c462.js');
 
 function useChildElements() {
-  const host = index_module.T();
+  const host = index_module._();
   const initialState = host.children.length
     ? Array.from(host.children)
     : [];

package/dist/cjs/{useInstantAccessRegistration-7d91867a.js → useInstantAccessRegistration-b732990f.js}

@@ -1,15 +1,15 @@
 'use strict';
 
-const stencilHooks_module = require('./stencil-hooks.module-ece1ee46.js');
-const index_module = require('./index.module-ccf9bd9c.js');
+const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
+const index_module = require('./index.module-3ae0c462.js');
 const jsonpointer = require('./jsonpointer-11327262.js');
-const useRegistrationFormState = require('./useRegistrationFormState-5911d016.js');
+const useRegistrationFormState = require('./useRegistrationFormState-2a738647.js');
 
 function useInstantAccessRegistration(props) {
   const cookie = new URLSearchParams(window.location.search);
   const cookies = cookie === null || cookie === void 0 ? void 0 : cookie.get("_saasquatch");
   const { registrationFormState, setRegistrationFormState } = useRegistrationFormState.useRegistrationFormState();
-  const [request, { loading, errors, data }] = index_module.Cn();
+  const [request, { loading, errors, data }] = index_module.mn();
   const [error, setError] = stencilHooks_module.useState("");
   const submit = async (event) => {
     var _a;

package/dist/cjs/{usePortalRegistrationForm-16151c0c.js → usePortalRegistrationForm-99ec3cc2.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-const stencilHooks_module = require('./stencil-hooks.module-ece1ee46.js');
-const index_module = require('./index.module-ccf9bd9c.js');
+const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
+const index_module = require('./index.module-3ae0c462.js');
 const jsonpointer = require('./jsonpointer-11327262.js');
-const useRegistrationFormState = require('./useRegistrationFormState-5911d016.js');
+const useRegistrationFormState = require('./useRegistrationFormState-2a738647.js');
 const AsYouType = require('./AsYouType-6788393a.js');
 
 const RegistrationFormQuery = index_module.dist.gql `
@@ -22,10 +22,10 @@ const RegistrationFormQuery = index_module.dist.gql `
 function usePortalRegistrationForm(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j;
   const formRef = stencilHooks_module.useRef(null);
-  const locale = index_module.Q();
+  const locale = index_module.L();
   const { registrationFormState, setRegistrationFormState } = useRegistrationFormState.useRegistrationFormState({});
-  const [request, { loading, errors, data, formError }] = index_module.Te();
-  const queryResponse = index_module.En(RegistrationFormQuery, { key: props.formKey });
+  const [request, { loading, errors, data, formError }] = index_module.We();
+  const queryResponse = index_module.yn(RegistrationFormQuery, { key: props.formKey });
   const formLoading = loading || queryResponse.loading;
   stencilHooks_module.useEffect(() => {
     var _a, _b, _c;
@@ -102,9 +102,11 @@ function usePortalRegistrationForm(props) {
     delete formData.password;
     delete formData.confirmPassword;
     const redirectPath = props.redirectPath;
+    const _googleOAuthIdToken = registrationFormState._googleOAuthIdToken;
     const variables = {
       key: props.formKey,
       formData: {
+        ...(_googleOAuthIdToken ? { _googleOAuthIdToken } : {}),
         locale,
         email,
         password,
@@ -128,7 +130,7 @@ function usePortalRegistrationForm(props) {
         managedIdentityResponse.result.results.length &&
         managedIdentityResponse.result.results[0].success &&
         managedIdentityResponse.result.results[0].data.token) {
-        index_module.xn.push(props.nextPage);
+        index_module.$n.push(props.nextPage);
       }
       else if (
       // check for blocked email error response
@@ -197,7 +199,6 @@ function usePortalRegistrationForm(props) {
       registrationFormState,
       confirmPassword: props.confirmPassword,
       hideInputs: props.hideInputs,
-      showNameFields: props.showNameFields,
       loginPath: props.loginPath,
       enablePasswordValidation: !props.disablePasswordValidation,
     },

package/dist/cjs/{useReferralTable-6b4920f9.js → useReferralTable-56d6576f.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-const index = require('./index-3cf5ef3d.js');
-const stencilHooks_module = require('./stencil-hooks.module-ece1ee46.js');
-const index_module = require('./index.module-ccf9bd9c.js');
-const reRender = require('./re-render-1e63c82b.js');
-const useChildElements = require('./useChildElements-438cf387.js');
+const index = require('./index-a29c60ef.js');
+const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
+const index_module = require('./index.module-3ae0c462.js');
+const reRender = require('./re-render-5bfdb0d3.js');
+const useChildElements = require('./useChildElements-4e04d4a0.js');
 
 const debug = stencilHooks_module.browser("sq:useReferralTable");
 const CSS_NAMESPACE = "sqm-referral-table";
@@ -245,8 +245,8 @@ const GET_IMPACT_TAX = index_module.dist.gql `
 `;
 function useReferralTable(props, emptyElement, loadingElement) {
   var _a, _b, _c, _d;
-  const user = index_module.K();
-  const programIdContext = index_module.z();
+  const user = index_module.Q();
+  const programIdContext = index_module.H();
   // Default to context, overriden by props
   const programId = (_a = props.programId) !== null && _a !== void 0 ? _a : programIdContext;
   // If no program ID, shows all programs
@@ -268,17 +268,17 @@ function useReferralTable(props, emptyElement, loadingElement) {
     loading: false,
     page: 0,
   });
-  const locale = index_module.Q();
-  const { data: referrerResponse, loading: referrerLoading, refetch, } = index_module.En(GET_REFERRER_DATA, {
+  const locale = index_module.L();
+  const { data: referrerResponse, loading: referrerLoading, refetch, } = index_module.yn(GET_REFERRER_DATA, {
     programId: programId === "classic" ? null : programId,
     rewardFilter,
     locale,
   }, !props.showReferrer || !(user === null || user === void 0 ? void 0 : user.jwt));
   const referrerData = (_b = referrerResponse === null || referrerResponse === void 0 ? void 0 : referrerResponse.viewer) === null || _b === void 0 ? void 0 : _b.referredByReferral;
   const showReferrerRow = props.showReferrer && !!(referrerData === null || referrerData === void 0 ? void 0 : referrerData.dateReferralStarted);
-  const { data: taxResponse, loading: taxLoading } = index_module.En(GET_IMPACT_TAX, {}, !(user === null || user === void 0 ? void 0 : user.jwt));
+  const { data: taxResponse, loading: taxLoading } = index_module.yn(GET_IMPACT_TAX, {}, !(user === null || user === void 0 ? void 0 : user.jwt));
   const taxConnection = (_c = taxResponse === null || taxResponse === void 0 ? void 0 : taxResponse.viewer) === null || _c === void 0 ? void 0 : _c.impactConnection;
-  const { envelope: referralData, states, callbacks, } = index_module.On(GET_REFERRAL_DATA, (data) => { var _a; return (_a = data === null || data === void 0 ? void 0 : data.viewer) === null || _a === void 0 ? void 0 : _a.referrals; }, {
+  const { envelope: referralData, states, callbacks, } = index_module.kn(GET_REFERRAL_DATA, (data) => { var _a; return (_a = data === null || data === void 0 ? void 0 : data.viewer) === null || _a === void 0 ? void 0 : _a.referrals; }, {
     limit: props.perPage,
     offset: 0,
   }, {

package/dist/cjs/useRegistrationFormState-2a738647.js

@@ -0,0 +1,27 @@
+'use strict';
+
+const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
+const index_module = require('./index.module-3ae0c462.js');
+
+const REGISTRATION_FORM_STATE_CONTEXT = "sq:registration-form-state";
+const REGISTRATION_FORM_STATE_CONTEXT_INTERNAL = "sq:registration-form-state-internal";
+function useRegistrationForm() {
+  const parent = stencilHooks_module.d(REGISTRATION_FORM_STATE_CONTEXT_INTERNAL);
+  const parentValue = stencilHooks_module.d(REGISTRATION_FORM_STATE_CONTEXT);
+  if (!parent)
+    return [undefined, undefined];
+  return [parentValue, parent[1]];
+}
+function useRegistrationFormState(formState) {
+  const host = index_module._();
+  const [registrationFormState, setRegistrationFormState] = stencilHooks_module.y(host, REGISTRATION_FORM_STATE_CONTEXT, formState);
+  stencilHooks_module.y(host, REGISTRATION_FORM_STATE_CONTEXT_INTERNAL, [
+    registrationFormState,
+    setRegistrationFormState,
+  ]);
+  return { registrationFormState, setRegistrationFormState };
+}
+
+exports.REGISTRATION_FORM_STATE_CONTEXT = REGISTRATION_FORM_STATE_CONTEXT;
+exports.useRegistrationForm = useRegistrationForm;
+exports.useRegistrationFormState = useRegistrationFormState;

package/dist/cjs/{utilities-27e9535b.js → utilities-7da4d59a.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-const stencilHooks_module = require('./stencil-hooks.module-ece1ee46.js');
-const index_module = require('./index.module-ccf9bd9c.js');
+const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
+const index_module = require('./index.module-3ae0c462.js');
 
 // import { IntlMessageFormat } from 'intl-messageformat';
 function isMobile(breakPoint) {

package/dist/collection/components/sqm-google-sign-in/sqm-google-sign-in.js

@@ -1,7 +1,7 @@
-import { getEnvironmentSDK } from "@saasquatch/component-boilerplate";
-import { useState, withHooks } from "@saasquatch/stencil-hooks";
-import { useEffect } from "@saasquatch/universal-hooks";
-import { Event, Component, h, Prop } from "@stencil/core";
+import { isDemo } from "@saasquatch/component-boilerplate";
+import { useEffect, useState, withHooks } from "@saasquatch/stencil-hooks";
+import { Component, Event, h, Prop } from "@stencil/core";
+import { useGoogleSignIn } from "./useGoogleSignIn";
 /**
  * @uiName Google Sign-In Button
  * @description Requires <script src="https://accounts.google.com/gsi/client" async></script> be added to the <head> section.
@@ -11,32 +11,21 @@ export class GoogleSignIn {
     withHooks(this);
   }
   disconnectedCallback() { }
+  connectedCallback() {
+    const src = "https://accounts.google.com/gsi/client";
+    if (!document.head.querySelector(`script[src="${src}"]`)) {
+      const script = document.createElement("script");
+      script.src = "https://accounts.google.com/gsi/client";
+      script.async = true;
+      document.head.appendChild(script);
+    }
+  }
   render() {
-    const sdk = getEnvironmentSDK();
-    const [googleButtonDiv, setGoogleButtonDiv] = useState(null);
-    useEffect(() => {
-      if (sdk.type !== "SquatchPortal")
-        return;
-      if (!googleButtonDiv)
-        return;
-      const cb = (res) => {
-        this.initComplete.emit(res);
-      };
-      //@ts-expect-error
-      google.accounts.id.initialize({
-        //@ts-expect-error: link component-env/boilerplate for new types
-        client_id: sdk.env.googleClientId,
-        callback: cb,
-      });
-      //@ts-expect-error
-      google.accounts.id.renderButton(googleButtonDiv, {
-        theme: "outline",
-        size: "large",
-        text: this.text,
-      });
-    }, [googleButtonDiv]);
-    // TODO: Maybe a loading placeholder while initialising
-    return h("div", { ref: setGoogleButtonDiv });
+    const { setGoogleButtonDiv } = isDemo()
+      ? useDemoGoogleSignIn(this)
+      : useGoogleSignIn(this);
+    return (h("div", null,
+      h("div", { ref: setGoogleButtonDiv })));
   }
   static get is() { return "sqm-google-sign-in"; }
   static get encapsulation() { return "shadow"; }
@@ -52,7 +41,10 @@ export class GoogleSignIn {
       "required": false,
       "optional": false,
       "docs": {
-        "tags": [],
+        "tags": [{
+            "text": "Button text",
+            "name": "uiName"
+          }],
         "text": ""
       },
       "attribute": "text",
@@ -76,3 +68,36 @@ export class GoogleSignIn {
       }
     }]; }
 }
+function useDemoGoogleSignIn(props) {
+  const [loaded, setLoaded] = useState(false);
+  const [googleButtonDiv, setGoogleButtonDiv] = useState(null);
+  useEffect(() => {
+    const cb = () => {
+      // @ts-expect-error
+      window.onGoogleLibraryLoad = null;
+      setLoaded(true);
+    };
+    // @ts-expect-error
+    if (window.google)
+      cb();
+    // @ts-expect-error
+    window.onGoogleLibraryLoad = cb;
+  }, []);
+  useEffect(() => {
+    if (!googleButtonDiv || !loaded)
+      return;
+    const cb = () => {
+      props.initComplete.emit({ credential: "PLACEHOLDERCREDENTIAL" });
+    };
+    //@ts-expect-error
+    google.accounts.id.renderButton(googleButtonDiv, {
+      theme: "outline",
+      size: "large",
+      text: props.text,
+      click_listener: cb,
+    });
+  }, [googleButtonDiv, loaded]);
+  return {
+    setGoogleButtonDiv,
+  };
+}

package/dist/collection/components/sqm-google-sign-in/useGoogleSignIn.js

@@ -0,0 +1,43 @@
+import { getEnvironmentSDK } from "@saasquatch/component-boilerplate";
+import { useState, useEffect } from "@saasquatch/stencil-hooks";
+export function useGoogleSignIn(props) {
+  const [loaded, setLoaded] = useState(false);
+  const [googleButtonDiv, setGoogleButtonDiv] = useState(null);
+  useEffect(() => {
+    const cb = () => {
+      // @ts-expect-error
+      window.onGoogleLibraryLoad = null;
+      const sdk = getEnvironmentSDK();
+      if (sdk.type !== "SquatchPortal")
+        return;
+      const cb = (res) => {
+        props.initComplete.emit(res);
+      };
+      //@ts-expect-error
+      google.accounts.id.initialize({
+        //@ts-expect-error: link component-env/boilerplate for new types
+        client_id: sdk.env.googleOAuthId,
+        callback: cb,
+      });
+      setLoaded(true);
+    };
+    // @ts-expect-error
+    if (window.google)
+      cb();
+    // @ts-expect-error
+    window.onGoogleLibraryLoad = cb;
+  }, []);
+  useEffect(() => {
+    if (!googleButtonDiv || !loaded)
+      return;
+    //@ts-expect-error
+    google.accounts.id.renderButton(googleButtonDiv, {
+      theme: "outline",
+      size: "large",
+      text: props.text,
+    });
+  }, [googleButtonDiv, loaded]);
+  return {
+    setGoogleButtonDiv,
+  };
+}

package/dist/collection/components/sqm-portal-google-registration-form/PortalGoogleRegistrationForm.stories.js

@@ -1,5 +1,6 @@
 import { h } from "@stencil/core";
 import { PortalRegistrationFormView, } from "../sqm-portal-registration-form/sqm-portal-registration-form-view";
+import { NameFieldsView } from "../sqm-name-fields/sqm-name-fields-view";
 export default {
   title: "Components/Microsite Google Register",
 };
@@ -9,7 +10,6 @@ const defaultProps = {
     loading: false,
     confirmPassword: false,
     hideInputs: false,
-    showNameFields: true,
     loginPath: "/login",
     hidePasswords: true,
     registrationFormState: {
@@ -30,6 +30,20 @@ const defaultProps = {
     passwordField: null,
     formData: (h("div", null,
       " ",
+      h(NameFieldsView, { states: {
+          registrationFormState: {
+            validationErrors: undefined,
+            disabled: true,
+            initialData: {
+              firstName: "Test",
+              lastName: "User",
+            },
+          },
+          content: {
+            firstNameLabel: "First Name",
+            lastNameLabel: "Last Name",
+          },
+        } }),
       h("sl-input", { style: { marginBottom: "var(--sl-spacing-x-large)" }, exportparts: "label: input-label, base: input-base", label: "Slotted Input", required: true }),
       h("sl-input", { exportparts: "label: input-label, base: input-base", label: "Slotted Input 2", required: true }))),
   },

package/dist/collection/components/sqm-portal-google-registration-form/sqm-portal-google-registration-form.js

@@ -58,12 +58,6 @@ export class PortalGoogleRegistrationForm {
      * @uiName Hide default fields
      */
     this.hideInputs = false;
-    /**
-     * Shows the first name and last name fields
-     *
-     * @uiName Show name fields
-     */
-    this.showNameFields = false;
     /**
      * @uiName Header text
      */
@@ -159,7 +153,7 @@ export class PortalGoogleRegistrationForm {
     const { handleGoogleInit, handleEmailSubmit, showRegistrationForm, emailValidationError, } = isDemo() ? useGoogleDemo(this) : usePortalGoogleRegistrationForm(this);
     const content = {
       formData: h("slot", { name: "formData" }),
-      googleButton: (h("sqm-google-sign-in", { onInitComplete: handleGoogleInit })),
+      googleButton: (h("sqm-google-sign-in", { text: "Register with Google", onInitComplete: handleGoogleInit })),
       secondaryButton: (h("slot", { name: "secondaryButton" },
         h("style", null, styleString),
         h("span", null,
@@ -417,27 +411,6 @@ export class PortalGoogleRegistrationForm {
       "reflect": false,
       "defaultValue": "false"
     },
-    "showNameFields": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Show name fields",
-            "name": "uiName"
-          }],
-        "text": "Shows the first name and last name fields"
-      },
-      "attribute": "show-name-fields",
-      "reflect": false,
-      "defaultValue": "false"
-    },
     "pageLabel": {
       "type": "string",
       "mutable": false,
@@ -778,7 +751,7 @@ export class PortalGoogleRegistrationForm {
       "mutable": false,
       "complexType": {
         "original": "DemoData<PortalRegistrationFormViewProps>",
-        "resolved": "{ states?: { error: string; loading: boolean; confirmPassword: boolean; hideInputs: boolean; hidePasswords?: boolean; showNameFields?: boolean; registrationFormState?: RegistrationFormState; enablePasswordValidation?: boolean; loginPath: string; }; refs?: { formRef: any; }; content?: { formData?: VNode; terms?: VNode; passwordField?: VNode; secondaryButton?: VNode; emailLabel?: string; passwordLabel?: string; submitLabel?: string; pageLabel?: string; confirmPasswordLabel?: string; networkErrorMessage?: string; passwordMismatchErrorMessage?: string; invalidEmailErrorMessage?: string; formDisabledErrorMessage?: string; requiredFieldErrorMessage?: string; meetsRequirementsText?: string; doesNotMeetRequirementsText?: string; minErrorText?: string; uppercaseErrorText?: string; lowercaseErrorText?: string; hasErrorText?: string; }; }",
+        "resolved": "{ states?: { error: string; loading: boolean; confirmPassword: boolean; hideInputs: boolean; hidePasswords?: boolean; registrationFormState?: RegistrationFormState; enablePasswordValidation?: boolean; loginPath: string; }; refs?: { formRef: any; }; content?: { formData?: VNode; terms?: VNode; passwordField?: VNode; secondaryButton?: VNode; emailLabel?: string; passwordLabel?: string; submitLabel?: string; pageLabel?: string; confirmPasswordLabel?: string; networkErrorMessage?: string; passwordMismatchErrorMessage?: string; invalidEmailErrorMessage?: string; formDisabledErrorMessage?: string; requiredFieldErrorMessage?: string; meetsRequirementsText?: string; doesNotMeetRequirementsText?: string; minErrorText?: string; uppercaseErrorText?: string; lowercaseErrorText?: string; hasErrorText?: string; }; }",
         "references": {
           "DemoData": {
             "location": "import",
@@ -808,7 +781,7 @@ export class PortalGoogleRegistrationForm {
       "mutable": false,
       "complexType": {
         "original": "DemoData<PortalRegistrationFormViewProps>",
-        "resolved": "{ states?: { error: string; loading: boolean; confirmPassword: boolean; hideInputs: boolean; hidePasswords?: boolean; showNameFields?: boolean; registrationFormState?: RegistrationFormState; enablePasswordValidation?: boolean; loginPath: string; }; refs?: { formRef: any; }; content?: { formData?: VNode; terms?: VNode; passwordField?: VNode; secondaryButton?: VNode; emailLabel?: string; passwordLabel?: string; submitLabel?: string; pageLabel?: string; confirmPasswordLabel?: string; networkErrorMessage?: string; passwordMismatchErrorMessage?: string; invalidEmailErrorMessage?: string; formDisabledErrorMessage?: string; requiredFieldErrorMessage?: string; meetsRequirementsText?: string; doesNotMeetRequirementsText?: string; minErrorText?: string; uppercaseErrorText?: string; lowercaseErrorText?: string; hasErrorText?: string; }; }",
+        "resolved": "{ states?: { error: string; loading: boolean; confirmPassword: boolean; hideInputs: boolean; hidePasswords?: boolean; registrationFormState?: RegistrationFormState; enablePasswordValidation?: boolean; loginPath: string; }; refs?: { formRef: any; }; content?: { formData?: VNode; terms?: VNode; passwordField?: VNode; secondaryButton?: VNode; emailLabel?: string; passwordLabel?: string; submitLabel?: string; pageLabel?: string; confirmPasswordLabel?: string; networkErrorMessage?: string; passwordMismatchErrorMessage?: string; invalidEmailErrorMessage?: string; formDisabledErrorMessage?: string; requiredFieldErrorMessage?: string; meetsRequirementsText?: string; doesNotMeetRequirementsText?: string; minErrorText?: string; uppercaseErrorText?: string; lowercaseErrorText?: string; hasErrorText?: string; }; }",
         "references": {
           "DemoData": {
             "location": "import",
@@ -845,7 +818,6 @@ function useRegisterDemo(props) {
       loading: false,
       confirmPassword: props.confirmPassword,
       hideInputs: props.hideInputs || false,
-      showNameFields: props.showNameFields || false,
       customPasswordField: false,
       loginPath: "/login",
     },

package/dist/collection/components/sqm-portal-google-registration-form/usePortalGoogleRegistrationForm.js

@@ -1,10 +1,10 @@
 import { useState } from "@saasquatch/universal-hooks";
 import jsonpointer from "jsonpointer";
 import decode from "jwt-decode";
-import { useRegistrationFormState } from "../sqm-portal-registration-form/useRegistrationFormState";
+import { useRegistrationForm } from "../sqm-portal-registration-form/useRegistrationFormState";
 export function usePortalGoogleRegistrationForm(props) {
   const [emailValidationError, setEmailValidationError] = useState(null);
-  const { registrationFormState, setRegistrationFormState } = useRegistrationFormState();
+  const [registrationFormState, setRegistrationFormState] = useRegistrationForm();
   const [showRegistrationForm, setShowRegistrationForm] = useState({
     mode: "base",
   });
@@ -44,15 +44,14 @@ export function usePortalGoogleRegistrationForm(props) {
   };
   const handleGoogleInit = (event) => {
     try {
-      const res = decode(event.detail);
-      // TODO: Double check
+      const res = decode(event.detail.credential);
       setRegistrationFormState({
         ...registrationFormState,
+        _googleOAuthIdToken: event.detail.credential,
         initialData: {
-          ...registrationFormState.initialData,
-          email: res.payload.email,
-          firstName: res.payload.given_name,
-          lastName: res.payload.family_name,
+          email: res.email,
+          firstName: res.given_name,
+          lastName: res.family_name,
         },
       });
       setShowRegistrationForm({ mode: "google" });

package/dist/collection/components/sqm-portal-login/PortalLogin.stories.js

@@ -61,7 +61,7 @@ h(PortalLoginView, Object.assign({}, defaultProps, { content: {
     secondaryButton: (h("span", null,
       "Don't have an account?",
       " ",
-      h("sl-button", { style: { width: "60px" }, size: "large", type: "text" }, "Register"))),
+      h("sl-button", { style: { width: "50px" }, size: "large", type: "text" }, "Register"))),
     googleButton: h("sl-button", null, "Sign in with Google"),
   } })));
 export const LoginWithError = () => h(PortalLoginView, Object.assign({}, errorProps));

package/dist/collection/components/sqm-portal-login/sqm-portal-login.js

@@ -87,7 +87,9 @@ export class PortalLogin {
     const content = {
       forgotPasswordButton: (h("slot", { name: "forgotPassword" },
         h("a", { onClick: () => navigation.push(states.forgotPasswordPath) }, this.forgotPasswordLabel))),
-      googleButton: this.showGoogleLogin ? (h("sqm-google-sign-in", { onInitComplete: (res) => console.log(res) })) : null,
+      googleButton: this.showGoogleLogin ? (h("sqm-google-sign-in", { 
+        // TODO
+        onInitComplete: (res) => console.log(res) })) : null,
       secondaryButton: (h("slot", { name: "secondaryButton" },
         h("style", null, styleString),
         this.showGoogleLogin ? (h("span", null,

package/dist/collection/components/sqm-portal-registration-form/sqm-portal-registration-form-view.js

@@ -45,7 +45,7 @@ export function PortalRegistrationFormView(props) {
       ((_a = states.registrationFormState) === null || _a === void 0 ? void 0 : _a.disabled) ? (h("sqm-form-message", { type: "error", exportparts: "erroralert-icon" },
         h("div", { part: "erroralert-text" }, states.registrationFormState.disabledMessage))) : (states.error && (h("sqm-form-message", { type: "error", exportparts: "erroralert-icon" },
         h("div", { part: "erroralert-text" }, props.states.error)))),
-      states.showNameFields && h("sqm-name-fields", null),
+      content.formData,
       !states.hideInputs && (h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", type: "email", name: "/email", label: content.emailLabel || "Email", disabled: true, required: true, validationError: ({ value }) => {
           if (!value) {
             return content.requiredFieldErrorMessage;
@@ -74,7 +74,6 @@ export function PortalRegistrationFormView(props) {
         helpText: ((_t = (_s = states.registrationFormState) === null || _s === void 0 ? void 0 : _s.validationErrors) === null || _t === void 0 ? void 0 : _t.confirmPassword) || content.requiredFieldErrorMessage,
       }
         : [])))),
-      content.formData,
       content.terms,
       h("div", { class: sheet.classes.ButtonsContainer },
         h("sl-button", { submit: true, loading: states.loading, disabled: (_u = states.registrationFormState) === null || _u === void 0 ? void 0 : _u.disabled, exportparts: "base: primarybutton-base", type: "primary" }, content.submitLabel || "Register"),

package/dist/collection/components/sqm-portal-registration-form/sqm-portal-registration-form.js

@@ -59,12 +59,6 @@ export class PortalRegistrationForm {
      * @uiName Hide default fields
      */
     this.hideInputs = false;
-    /**
-     * Shows the first name and last name fields
-     *
-     * @uiName Show name fields
-     */
-    this.showNameFields = false;
     /**
      * @uiName Header text
      */
@@ -385,27 +379,6 @@ export class PortalRegistrationForm {
       "reflect": false,
       "defaultValue": "false"
     },
-    "showNameFields": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Show name fields",
-            "name": "uiName"
-          }],
-        "text": "Shows the first name and last name fields"
-      },
-      "attribute": "show-name-fields",
-      "reflect": false,
-      "defaultValue": "false"
-    },
     "pageLabel": {
       "type": "string",
       "mutable": false,
@@ -725,7 +698,7 @@ export class PortalRegistrationForm {
       "mutable": false,
       "complexType": {
         "original": "DemoData<PortalRegistrationFormViewProps>",
-        "resolved": "{ states?: { error: string; loading: boolean; confirmPassword: boolean; hideInputs: boolean; hidePasswords?: boolean; showNameFields?: boolean; registrationFormState?: RegistrationFormState; enablePasswordValidation?: boolean; loginPath: string; }; refs?: { formRef: any; }; content?: { formData?: VNode; terms?: VNode; passwordField?: VNode; secondaryButton?: VNode; emailLabel?: string; passwordLabel?: string; submitLabel?: string; pageLabel?: string; confirmPasswordLabel?: string; networkErrorMessage?: string; passwordMismatchErrorMessage?: string; invalidEmailErrorMessage?: string; formDisabledErrorMessage?: string; requiredFieldErrorMessage?: string; meetsRequirementsText?: string; doesNotMeetRequirementsText?: string; minErrorText?: string; uppercaseErrorText?: string; lowercaseErrorText?: string; hasErrorText?: string; }; }",
+        "resolved": "{ states?: { error: string; loading: boolean; confirmPassword: boolean; hideInputs: boolean; hidePasswords?: boolean; registrationFormState?: RegistrationFormState; enablePasswordValidation?: boolean; loginPath: string; }; refs?: { formRef: any; }; content?: { formData?: VNode; terms?: VNode; passwordField?: VNode; secondaryButton?: VNode; emailLabel?: string; passwordLabel?: string; submitLabel?: string; pageLabel?: string; confirmPasswordLabel?: string; networkErrorMessage?: string; passwordMismatchErrorMessage?: string; invalidEmailErrorMessage?: string; formDisabledErrorMessage?: string; requiredFieldErrorMessage?: string; meetsRequirementsText?: string; doesNotMeetRequirementsText?: string; minErrorText?: string; uppercaseErrorText?: string; lowercaseErrorText?: string; hasErrorText?: string; }; }",
         "references": {
           "DemoData": {
             "location": "import",
@@ -762,7 +735,6 @@ function useRegisterDemo(props) {
       loading: false,
       confirmPassword: props.confirmPassword,
       hideInputs: props.hideInputs || false,
-      showNameFields: props.showNameFields || false,
       customPasswordField: false,
       loginPath: "/login",
     },