npm - @saasquatch/mint-components - Versions diffs - 1.15.0-41 → 1.15.0-42 - Mend

@saasquatch/mint-components 1.15.0-41 → 1.15.0-42

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (596) hide show

package/dist/cjs/sqm-tab.cjs.entry.js CHANGED Viewed

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a29c60ef.js');
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-require('./index.module-ee84433d.js');
-const reRender = require('./re-render-b324deab.js');
+const index = require('./index-a43a63b4.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+require('./index.module-39955732.js');
+const reRender = require('./re-render-28fed959.js');
 const TabView = ({}, children) => {
   return index.h(index.Host, null, children);

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

@@ -2,12 +2,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a29c60ef.js');
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
+const index = require('./index-a43a63b4.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 const utils = require('./utils-6847bc06.js');
-const reRender = require('./re-render-b324deab.js');
-const useChildElements = require('./useChildElements-1b35d945.js');
+const reRender = require('./re-render-28fed959.js');
+const useChildElements = require('./useChildElements-e5fa605c.js');
 const TabsView = ({ content, placement, textColor = "var(--sqm-text)", }) => {
   // Vertical padding for top & bottom placement, horizontal for left & right.

package/dist/cjs/{sqm-text-span-view-ce4c0178.js → sqm-text-span-view-7a61ae4c.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-const index = require('./index-a29c60ef.js');
+const index = require('./index-a43a63b4.js');
 const JSS = require('./JSS-8503a151.js');
 function TextSpanView(props, children) {

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

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a29c60ef.js');
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
+const index = require('./index-a43a63b4.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
 require('./JSS-8503a151.js');
-const sqmTextSpanView = require('./sqm-text-span-view-ce4c0178.js');
+const sqmTextSpanView = require('./sqm-text-span-view-7a61ae4c.js');
 const TextSpan = class {
   constructor(hostRef) {

package/dist/cjs/sqm-widget-verification-controller.cjs.entry.js CHANGED Viewed

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a29c60ef.js');
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
+const index = require('./index-a43a63b4.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 const keys = require('./keys-cff24974.js');
 const debug = stencilHooks_module.browser("sq:widget-verification");
@@ -37,26 +37,18 @@ function useTemplateChildren({ parent, callback }) {
 const WidgetVerificationController = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    /**
-     * @componentState { "title": "Not Verified", "slot": "not-verified", "props": { "isAuth": false } }
-     * @componentState { "title": "Verified", "slot": "verified", "props": { "isAuth": true } }
-     */
-    this.stateController = "{}";
     stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
-    var _a;
     const [context, setContext] = index_module.In({
       namespace: keys.VERIFICATION_PARENT_NAMESPACE,
       initialValue: false,
     });
-    const props = JSON.parse(this.stateController);
-    const demoIsAuth = index_module.isDemo() && ((_a = props["sqm-widget-verification-controller"]) === null || _a === void 0 ? void 0 : _a.isAuth);
     const [container, setContainer] = stencilHooks_module.useState(undefined);
     const [slot, setSlot] = stencilHooks_module.useState(undefined);
     const updateTemplates = index_module.useCallback(() => {
-      const isAuth = demoIsAuth || context;
+      const isAuth = context;
       const templates = slot.querySelectorAll(`template`);
       const template = Array.from(templates).find((t) => t.slot === (isAuth ? "verified" : "not-verified"));
       if (template) {
@@ -104,7 +96,7 @@ const WidgetVerificationController = class {
           target.style.height = "25px";
         });
       }
-    }, [container, slot, context, demoIsAuth]);
+    }, [container, slot, context]);
     stencilHooks_module.useEffect(() => {
       if (!container || !slot) {
         debug("DOM not ready:");
@@ -113,7 +105,7 @@ const WidgetVerificationController = class {
       // Run on first render
       updateTemplates();
       return useTemplateChildren({ parent: slot, callback: updateTemplates });
-    }, [slot, container, context, demoIsAuth]);
+    }, [slot, container, context]);
     return (index.h(index.Host, null, index.h("div", { ref: setSlot, style: { display: "contents" } }, index.h("slot", { name: "not-verified" }), index.h("slot", { name: "verified" })), index.h("div", { ref: setContainer }, index.h("slot", { name: "shown" }))));
   }
 };

package/dist/cjs/sqm-widget-verification.cjs.entry.js CHANGED Viewed

@@ -2,12 +2,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a29c60ef.js');
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
-const cjs = require('./cjs-1066ec21.js');
+const index = require('./index-a43a63b4.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 const utils = require('./utils-6847bc06.js');
-const parseStates = require('./parseStates-d1effc19.js');
 const extractProps = require('./extractProps-fd93ba62.js');
 const keys = require('./keys-cff24974.js');
@@ -165,11 +163,6 @@ const WidgetVerification = class {
      * @uiGroup Code Verification Step
      */
     this.codeStep_networkErrorMessage = "An error occurred while verifying your email. Please refresh the page and try again.";
-    /**
-     * @componentState { "title": "Email Step", "props": { "showCode": false }, "dependencies": ["sqm-email-verification"] }
-     * @componentState { "title": "Code Step", "props": { "showCode": true }, "dependencies": ["sqm-code-verification"] }
-     */
-    this.stateController = "{}";
     stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
@@ -178,20 +171,20 @@ const WidgetVerification = class {
     return extractProps.extractProps(props, prefix);
   }
   render() {
-    const props = index_module.isDemo()
-      ? useDemoWidgetVerificationInternal(this)
+    const { showCode, onVerification, loading } = index_module.isDemo()
+      ? useDemoWidgetVerificationInternal()
       : useWidgetVerification();
-    if (props.loading)
+    if (loading)
       return index.h("sl-spinner", null);
     const generalText = this.getStepTextProps("general_");
     return (index.h("div", null, index.h("h3", { style: { fontSize: "24px", margin: "0" } }, generalText.verifyEmailHeader), index.h("p", { style: {
         color: "var(--sl-color-neutral-500)",
         fontSize: "var(--sl-font-size-medium)",
         margin: "0",
-      } }, generalText.verifyEmailDescription), props.showCode ? (index.h("sqm-code-verification", Object.assign({ onVerification: props.onVerification }, this.getStepTextProps("codeStep_"), extractProps.extractProps(props, "sqm-code-verification_")))) : (index.h("sqm-email-verification", Object.assign({}, this.getStepTextProps("emailStep_"), extractProps.extractProps(props, "sqm-email-verification_"))))));
+      } }, generalText.verifyEmailDescription), showCode ? (index.h("sqm-code-verification", Object.assign({ onVerification: onVerification }, this.getStepTextProps("codeStep_")))) : (index.h("sqm-email-verification", Object.assign({}, this.getStepTextProps("emailStep_"))))));
   }
 };
-function useDemoWidgetVerificationInternal(props) {
+function useDemoWidgetVerificationInternal() {
   const [showCode, setShowCode] = index_module.In({
     namespace: keys.SHOW_CODE_NAMESPACE,
     initialValue: false,
@@ -201,14 +194,10 @@ function useDemoWidgetVerificationInternal(props) {
     initialValue: undefined,
   });
   const setContext = index_module.En(keys.VERIFICATION_PARENT_NAMESPACE);
-  const states = parseStates.parseStates(props.stateController);
-  const formatted = Object.keys(states).reduce((prev, key) => key === "sqm-widget-verification"
-    ? { ...prev, ...states[key] }
-    : { ...prev, [`${key}_stateController`]: states[key] }, {});
   const onVerification = () => {
     setContext(true);
   };
-  return cjs.cjs({ showCode, onVerification, loading: false }, formatted || {}, { arrayMerge: (_, a) => a });
+  return { showCode, onVerification, loading: false };
 }
 exports.sqm_widget_verification = WidgetVerification;

package/dist/cjs/{stencil-hooks.module-3a336b0f.js → stencil-hooks.module-62264802.js} RENAMED Viewed

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

package/dist/cjs/{useChildElements-1b35d945.js → useChildElements-e5fa605c.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 function useChildElements() {
   const host = index_module._();

package/dist/cjs/{useInstantAccessRegistration-0537e28e.js → useInstantAccessRegistration-86b7164c.js} RENAMED Viewed

@@ -1,9 +1,9 @@
 'use strict';
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 const jsonpointer = require('./jsonpointer-11327262.js');
-const useRegistrationFormState = require('./useRegistrationFormState-7b820f0c.js');
+const useRegistrationFormState = require('./useRegistrationFormState-5f44ca80.js');
 function useInstantAccessRegistration(props) {
   const locale = index_module.L();

package/dist/cjs/{usePayoutStatus-feeac99b.js → usePayoutStatus-f26f0467.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 const TAX_FORM_UPDATED_EVENT_KEY = "sqm:tax-form-updated";
@@ -986,20 +986,17 @@ const GET_USER_STATUS = index_module.dist.gql `
   }
 `;
 function getStatus(data) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+  var _a, _b, _c, _d, _e, _f, _g, _h;
   const account = (_b = (_a = data.user.impactConnection) === null || _a === void 0 ? void 0 : _a.publisher) === null || _b === void 0 ? void 0 : _b.payoutsAccount;
   if (!((_d = (_c = data.user) === null || _c === void 0 ? void 0 : _c.impactConnection) === null || _d === void 0 ? void 0 : _d.connected) || !account)
     return "INFORMATION_REQUIRED";
-  if (((_e = account.holdReasons) === null || _e === void 0 ? void 0 : _e.length) === 1 && ((_f = account.holdReasons) === null || _f === void 0 ? void 0 : _f.includes("NEW_PAYEE_REVIEW"))) {
-    return "DONE";
-  }
-  if ((_g = account.holdReasons) === null || _g === void 0 ? void 0 : _g.includes("IDV_CHECK_REQUIRED"))
+  if ((_e = account.holdReasons) === null || _e === void 0 ? void 0 : _e.includes("IDV_CHECK_REQUIRED"))
     return "VERIFICATION:REQUIRED";
-  if ((_h = account.holdReasons) === null || _h === void 0 ? void 0 : _h.includes("IDV_CHECK_REQUIRED_INTERNAL"))
+  if ((_f = account.holdReasons) === null || _f === void 0 ? void 0 : _f.includes("IDV_CHECK_REQUIRED_INTERNAL"))
     return "VERIFICATION:INTERNAL";
-  if ((_j = account.holdReasons) === null || _j === void 0 ? void 0 : _j.includes("IDV_CHECK_REVIEW_INTERNAL"))
+  if ((_g = account.holdReasons) === null || _g === void 0 ? void 0 : _g.includes("IDV_CHECK_REVIEW_INTERNAL"))
     return "VERIFICATION:REVIEW";
-  if ((_k = account.holdReasons) === null || _k === void 0 ? void 0 : _k.includes("IDV_CHECK_FAILED_INTERNAL"))
+  if ((_h = account.holdReasons) === null || _h === void 0 ? void 0 : _h.includes("IDV_CHECK_FAILED_INTERNAL"))
     return "VERIFICATION:FAILED";
   if (account.hold)
     return "HOLD";

package/dist/cjs/{usePortalLogin-63d896d1.js → usePortalLogin-bd975a79.js} RENAMED Viewed

@@ -1,9 +1,63 @@
 'use strict';
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
+const index = require('./index-a43a63b4.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 const jsonpointer = require('./jsonpointer-11327262.js');
 const utils = require('./utils-6847bc06.js');
+const JSS = require('./JSS-8503a151.js');
+const mixins = require('./mixins-4761d472.js');
+const sqmTextSpanView = require('./sqm-text-span-view-7a61ae4c.js');
+const style = {
+  Wrapper: mixins.AuthWrapper,
+  Column: mixins.AuthColumn,
+  ForgotButtonContainer: {
+    display: "inline",
+    cursor: "pointer",
+    "font-size": "13px",
+    "font-weight": "600",
+    color: "var(--sqm-text-subdued)",
+    margin: "0",
+  },
+  ButtonsContainer: {
+    ...mixins.AuthButtonsContainer,
+    gap: "var(--sl-spacing-medium)",
+    "& > *": {
+      margin: "0 !important",
+    },
+  },
+};
+const vanillaStyle = `
+:host {
+  display: block;
+}
+:host([hidden]): {
+  display: none;
+}
+`;
+const sheet = JSS.createStyleSheet(style);
+const styleString = sheet.toString();
+function PortalLoginView(props) {
+  const { states, callbacks, content } = props;
+  return (index.h("div", { class: sheet.classes.Wrapper, part: "sqm-base" },
+    index.h("style", { type: "text/css" },
+      vanillaStyle,
+      styleString),
+    index.h(sqmTextSpanView.TextSpanView, { type: "h3" }, content.pageLabel),
+    index.h("sl-form", { class: sheet.classes.Column, "onSl-submit": callbacks.submit },
+      props.states.error && (index.h("sqm-form-message", { type: "error", exportparts: "erroralert-icon" },
+        index.h("div", { part: "erroralert-text" }, props.states.error))),
+      index.h("sl-input", { exportparts: "label: input-label, base: input-base", type: "email", name: "/email", label: content.emailLabel || "Email", disabled: states.loading, required: true }),
+      index.h("div", null,
+        index.h("sl-input", { exportparts: "label: input-label, base: input-base", type: "password", name: "/password", label: content.passwordLabel || "Password", disabled: states.loading, required: true }),
+        index.h("div", { class: sheet.classes.ForgotButtonContainer }, content.forgotPasswordButton)),
+      index.h("div", { class: sheet.classes.ButtonsContainer },
+        index.h("sl-button", { submit: true, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, content.submitLabel || "Login"),
+        content.googleButton && index.h("sl-menu-divider", null),
+        content.googleButton,
+        content.secondaryButton))));
+}
 function usePortalLogin(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
@@ -71,4 +125,5 @@ function usePortalLogin(props) {
   };
 }
+exports.PortalLoginView = PortalLoginView;
 exports.usePortalLogin = usePortalLogin;

package/dist/cjs/{usePortalRegistrationForm-f25d89e7.js → usePortalRegistrationForm-d28621de.js} RENAMED Viewed

@@ -1,9 +1,9 @@
 'use strict';
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 const jsonpointer = require('./jsonpointer-11327262.js');
-const useRegistrationFormState = require('./useRegistrationFormState-7b820f0c.js');
+const useRegistrationFormState = require('./useRegistrationFormState-5f44ca80.js');
 const AsYouType = require('./AsYouType-6788393a.js');
 const RegistrationFormQuery = index_module.dist.gql `

package/dist/cjs/{useReferralCodes-82e8797b.js → useReferralCodes-a47dcbc2.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 const GET_REFERRAL_CODES = index_module.dist.gql `
   query getCodes(

package/dist/cjs/{useReferralTable-7c3f9600.js → useReferralTable-19e7523a.js} RENAMED Viewed

@@ -1,10 +1,10 @@
 'use strict';
-const index = require('./index-a29c60ef.js');
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
-const reRender = require('./re-render-b324deab.js');
-const useChildElements = require('./useChildElements-1b35d945.js');
+const index = require('./index-a43a63b4.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
+const reRender = require('./re-render-28fed959.js');
+const useChildElements = require('./useChildElements-e5fa605c.js');
 const debug = stencilHooks_module.browser("sq:useReferralTable");
 const CSS_NAMESPACE = "sqm-referral-table";

package/dist/cjs/{useRegistrationFormState-7b820f0c.js → useRegistrationFormState-5f44ca80.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 const REGISTRATION_FORM_STATE_CONTEXT = "sq:registration-form-state";
 const REGISTRATION_FORM_STATE_CONTEXT_INTERNAL = "sq:registration-form-state-internal";

package/dist/cjs/{useVerificationEmail-95a82767.js → useVerificationEmail-1496b993.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+const index_module = require('./index.module-39955732.js');
 const UserLookupQuery = index_module.dist.gql `
   query userLookup {

package/dist/cjs/{utilities-78f5e169.js → utilities-be3ce1f8.js} RENAMED Viewed

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

package/dist/collection/collection-manifest.json CHANGED Viewed

@@ -12,7 +12,6 @@
     "./components/tax-and-cash/sqm-tax-and-cash-dashboard/sqm-tax-and-cash-dashboard.js",
     "./components/tax-and-cash/sqm-user-info-form/sqm-user-info-form.js",
     "./components/raisins-plop-target/raisins-plop-target.js",
-    "./components/sqm-asset-card/sqm-asset-card.js",
     "./components/sqm-big-stat/sqm-big-stat.js",
     "./components/sqm-brand/sqm-brand.js",
     "./components/sqm-card-feed/sqm-card-feed.js",

package/dist/collection/components/sqm-edit-profile/sqm-edit-profile-view.js CHANGED Viewed

@@ -32,7 +32,7 @@ const EditProfileView = (props) => {
             }, submit: true, exportparts: "base: primarybutton-base" }, text.updatetext),
           h("sl-button", { onClick: () => {
               callbacks.setShowEdit(false);
-            }, exportparts: "base: secondarybutton-base" }, text.canceltext)))));
+            }, type: "secondary", exportparts: "base: secondarybutton-base" }, text.canceltext)))));
   }
   return (h("div", { class: `CardWrapper FormWrapper ${!states.showEdit && "ShowEdit"}`, part: "sqm-base" },
     h("div", { class: "FormSection" },

package/dist/collection/components/sqm-leaderboard/sqm-leaderboard-view.js CHANGED Viewed

@@ -21,7 +21,7 @@ export function LeaderboardView(props) {
         fontWeight: "var(--sl-font-weight-semibold)",
       },
       "& tr:not(:first-child)": {
-        borderTop: `1px solid ${styles.borderColor || "var(--sl-color-neutral-200)"}`,
+        borderTop: `var(--sqm-bordr-thickness) solid ${styles.borderColor || "var(--sqm-border-color)"}`,
       },
       "& td": {
         fontSize: "var(--sl-font-size-medium)",

package/dist/collection/components/sqm-portal-change-password/sqm-portal-change-password-view.js CHANGED Viewed

@@ -66,13 +66,13 @@ export function PortalChangePasswordView(props) {
               h("sl-input", { exportparts: "label: input-label, base: input-base", name: "/confirmPassword", label: states.content.confirmPasswordFieldLabel, required: true, togglePassword: true, disabled: states.loading, type: "password" })),
             h(PortalContainerView, Object.assign({}, { direction: "row", padding: "none", gap: "20px" }),
               h("sl-button", { class: sheet.classes.ChangePasswordButton, type: "primary", exportparts: "base: primarybutton-base", submit: true, loading: states.loading }, states.content.changePasswordButtonText),
-              h("sl-button", { class: sheet.classes.CancelButton, type: "text", exportparts: "base: secondarybutton-base", onClick: () => callbacks.setOpen(false) }, states.content.cancelText))))),
+              h("sl-button", { class: sheet.classes.CancelButton, type: "secondary", exportparts: "base: secondarybutton-base", onClick: () => callbacks.setOpen(false) }, states.content.cancelText))))),
       }))),
     h(PortalSectionView, Object.assign({}, {
       labelMargin: "x-large",
       padding: "xxx-large",
       label: (h(TextSpanView, Object.assign({}, { type: "h2" }), states.content.portalChangePasswordHeader)),
-      content: (h("sl-button", { exportparts: "base: primarybutton-base", onClick: () => callbacks.setOpen(true) }, states.content.portalChangePasswordButtonText)),
+      content: (h("sl-button", { type: "primary", exportparts: "base: primarybutton-base", onClick: () => callbacks.setOpen(true) }, states.content.portalChangePasswordButtonText)),
     }),
       h("style", { type: "text/css" }, styleString))));
 }

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

@@ -1,5 +1,4 @@
 import { h } from "@stencil/core";
-import { PortalLoginView } from "./sqm-portal-login-view";
 export default {
   title: "Components/Microsite Login",
 };
@@ -48,13 +47,17 @@ const loadingProps = {
     pageLabel: "Sign in to your account",
   },
 };
-export const Default = () => (h("sqm-portal-login", { demoData: { ...defaultProps } }));
-export const IsGoogle = () => (h(PortalLoginView, Object.assign({}, defaultProps, { content: {
+const googleProps = {
+  ...defaultProps,
+  content: {
     secondaryButton: (h("span", null,
       "Don't have an account?",
       " ",
       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));
-export const LoginLoading = () => h(PortalLoginView, Object.assign({}, loadingProps));
+  },
+};
+export const Default = () => (h("sqm-portal-login", { demoData: { ...defaultProps } }));
+export const IsGoogle = () => (h("sqm-portal-login", { demoData: { ...googleProps } }));
+export const LoginWithError = () => (h("sqm-portal-login", { demoData: { ...errorProps } }));
+export const LoginLoading = () => (h("sqm-portal-login", { demoData: { ...loadingProps } }));

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

@@ -87,7 +87,7 @@ export class PortalLogin {
       googleButton: null,
       secondaryButton: (h("slot", { name: "secondaryButton" },
         h("style", null, styleString),
-        h("sl-button", { type: "text", disabled: states.loading, onClick: () => navigation.push(states.registerPath) }, this.registerLabel))),
+        h("sl-button", { exportparts: "base: tertiarybutton-base", type: "text", disabled: states.loading, onClick: () => navigation.push(states.registerPath) }, this.registerLabel))),
       emailLabel: this.emailLabel,
       passwordLabel: this.passwordLabel,
       submitLabel: this.submitLabel,

package/dist/collection/components/sqm-portal-register/sqm-portal-register.js CHANGED Viewed

@@ -10,7 +10,7 @@ import { usePortalRegister } from "./usePortalRegister";
  */
 export class PortalRegister {
   constructor() {
-    this.ignored = true;
+    this.ignored = false;
     /**
      * Redirect participants to this page from their verification email
      *
@@ -151,7 +151,6 @@ export class PortalRegister {
     return (h(PortalRegisterView, { states: states, callbacks: callbacks, content: content, refs: refs }));
   }
   static get is() { return "sqm-portal-register"; }
-  static get encapsulation() { return "shadow"; }
   static get properties() { return {
     "nextPage": {
       "type": "string",

package/dist/collection/components/sqm-referral-card/sqm-referral-card.js CHANGED Viewed

@@ -54,12 +54,6 @@ export class ReferralCard {
      * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
      */
     this.paddingLeft = "large";
-    /**
-     * @uiName Background color
-     * @uiWidget color
-     * @uiType string
-     */
-    this.backgroundColor = "#ffffff";
     /**
      * @uiName Limit width
      * @uiType boolean
@@ -267,7 +261,7 @@ export class ReferralCard {
         "references": {}
       },
       "required": false,
-      "optional": false,
+      "optional": true,
       "docs": {
         "tags": [{
             "text": "Background color",
@@ -282,8 +276,7 @@ export class ReferralCard {
         "text": ""
       },
       "attribute": "background-color",
-      "reflect": false,
-      "defaultValue": "\"#ffffff\""
+      "reflect": false
     },
     "borderColor": {
       "type": "string",

package/dist/collection/components/sqm-referral-table/cells/sqm-referral-table-rewards-cell.js CHANGED Viewed

@@ -60,7 +60,7 @@ export class ReferralTableRewardsCell {
           textAlign: "center",
           maxWidth: "170px",
           whiteSpace: "pre-line",
-          background: "var(--sqm-informative-color-background)",
+          background: "var(--sqm-informative-color-icon)",
           color: "var(--sqm-informative-color-text)",
         },
       },
@@ -70,7 +70,7 @@ export class ReferralTableRewardsCell {
           textAlign: "center",
           maxWidth: "170px",
           whiteSpace: "pre-line",
-          background: "var(--sqm-danger-color-background)",
+          background: "var(--sqm-danger-color-icon)",
           color: "var(--sqm-danger-color-text)",
         },
       },
@@ -80,7 +80,7 @@ export class ReferralTableRewardsCell {
           textAlign: "center",
           maxWidth: "170px",
           whiteSpace: "pre-line",
-          background: "var(--sqm-warning-color-background)",
+          background: "var(--sqm-warning-color-icon)",
           color: "var(--sqm-warning-color-text)",
         },
       },
@@ -90,7 +90,7 @@ export class ReferralTableRewardsCell {
           textAlign: "center",
           maxWidth: "170px",
           whiteSpace: "pre-line",
-          background: "var(--sqm-success-color-background)",
+          background: "var(--sqm-success-color-icon)",
           color: "var(--sqm-success-color-text)",
         },
       },

package/dist/collection/components/sqm-referral-table/cells/sqm-referral-table-status-cell.js CHANGED Viewed

@@ -13,7 +13,7 @@ const style = {
       textAlign: "center",
       maxWidth: "170px",
       whiteSpace: "pre-line",
-      background: "var(--sqm-informative-color-background)",
+      background: "var(--sqm-informative-color-icon)",
       color: "var(--sqm-informative-color-text)",
     },
   },
@@ -24,7 +24,7 @@ const style = {
       textAlign: "center",
       maxWidth: "170px",
       whiteSpace: "pre-line",
-      background: "var(--sqm-danger-color-background)",
+      background: "var(--sqm-danger-color-icon)",
       color: "var(--sqm-danger-color-text)",
     },
   },
@@ -35,7 +35,7 @@ const style = {
       textAlign: "center",
       maxWidth: "170px",
       whiteSpace: "pre-line",
-      background: "var(--sqm-warning-color-background)",
+      background: "var(--sqm-warning-color-icon)",
       color: "var(--sqm-warning-color-text)",
     },
   },
@@ -46,7 +46,7 @@ const style = {
       textAlign: "center",
       maxWidth: "170px",
       whiteSpace: "pre-line",
-      background: "var(--sqm-success-color-background)",
+      background: "var(--sqm-success-color-icon)",
       color: "var(--sqm-success-color-text)",
     },
   },

package/dist/collection/components/sqm-reward-exchange-list/sqm-reward-exchange-list-view.js CHANGED Viewed

@@ -495,7 +495,7 @@ export function RewardExchangeView(props) {
             ((_d = states.selectedItem) === null || _d === void 0 ? void 0 : _d.ruleType) === "FIXED_GLOBAL_REWARD" ? (h("div", { class: "description" }, selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.description)) : (h("div", null, input)),
             h("div", { class: "space" }))),
         h("div", { class: sheet.classes.Button },
-          h("sl-button", { exportparts: "base: secondarybutton-base", class: "cancel", size: "large", type: "text", onClick: () => callbacks.resetState() }, states.content.text.cancelText),
+          h("sl-button", { exportparts: "base: secondarybutton-base", class: "cancel", size: "large", type: "secondary", onClick: () => callbacks.resetState() }, states.content.text.cancelText),
           h("sl-button", { exportparts: "base: primarybutton-base", class: "continue", size: "large", onClick: () => callbacks.setStage("confirmation"), disabled: isDisabled }, states.content.text.continueToConfirmationText)))));
   }
   function confirmation() {