npm - @saasquatch/mint-components - Versions diffs - 1.15.0-43 → 1.15.0-45 - Mend

@saasquatch/mint-components 1.15.0-43 → 1.15.0-45

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 (605) 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-tax-and-cash.cjs.entry.js CHANGED Viewed

@@ -2,17 +2,17 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a29c60ef.js');
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-require('./global-d62c5561.js');
-const index_module = require('./index.module-ee84433d.js');
+const index = require('./index-a43a63b4.js');
+const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
+require('./global-242743b1.js');
+const index_module = require('./index.module-39955732.js');
 const cjs = require('./cjs-1066ec21.js');
 const utils$1 = require('./utils-6847bc06.js');
 require('./JSS-8503a151.js');
-const ErrorView = require('./ErrorView-b2fcf954.js');
-const utils = require('./utils-ce18d1bc.js');
+const ErrorView = require('./ErrorView-5504c2b6.js');
+const utils = require('./utils-a6957c85.js');
 const extractProps = require('./extractProps-e9c55ba8.js');
-const data = require('./data-6d96b89c.js');
+const data = require('./data-68a42a7b.js');
 function getCurrentStep(user) {
   var _a, _b;

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");

package/dist/cjs/sqm-widget-verification.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 cjs = require('./cjs-1066ec21.js');
 const utils = require('./utils-6847bc06.js');
 const extractProps = require('./extractProps-e9c55ba8.js');

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-3cca69e5.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";

package/dist/cjs/{usePortalLogin-63d896d1.js → usePortalLogin-e246988e.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 jsonpointer = require('./jsonpointer-11327262.js');
 const utils = require('./utils-6847bc06.js');

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/cjs/{utils-ce18d1bc.js → utils-a6957c85.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const index = require('./index-a29c60ef.js');
-const global = require('./global-d62c5561.js');
+const index = require('./index-a43a63b4.js');
+const global = require('./global-242743b1.js');
 const JSS = require('./JSS-8503a151.js');
 const style = {

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-invoice-table/columns/sqm-invoice-table-data-column.js CHANGED Viewed

@@ -68,7 +68,7 @@ export class InvoiceTableDataColumn {
   static get methods() { return {
     "renderCell": {
       "complexType": {
-        "signature": "(data: Invoice) => Promise<any>",
+        "signature": "(data: any) => Promise<any>",
         "parameters": [{
             "tags": [],
             "text": ""

package/dist/collection/components/sqm-invoice-table/columns/sqm-invoice-table-date-column.js CHANGED Viewed

@@ -63,7 +63,8 @@ export class InvoiceTableDateColumn {
             "location": "global"
           },
           "Invoice": {
-            "location": "global"
+            "location": "import",
+            "path": "../../../saasquatch"
           }
         },
         "return": "Promise<any>"

package/dist/collection/components/sqm-invoice-table/columns/sqm-invoice-table-download-column.js CHANGED Viewed

@@ -34,7 +34,8 @@ export class InvoiceTableGenericColumn {
             "location": "global"
           },
           "Invoice": {
-            "location": "global"
+            "location": "import",
+            "path": "../../../saasquatch"
           }
         },
         "return": "Promise<any>"

package/dist/collection/components/sqm-invoice-table/sqm-invoice-table.js CHANGED Viewed

@@ -321,7 +321,7 @@ export class InvoiceTable {
       "mutable": false,
       "complexType": {
         "original": "DemoData<GenericTableViewProps> & {\n    mockData?: { data: Invoice[] };\n  }",
-        "resolved": "Partial<Pick<GenericTableViewProps, \"states\" | \"data\" | \"elements\">> & { mockData?: { data: Invoice[]; }; }",
+        "resolved": "Partial<Pick<GenericTableViewProps, \"states\" | \"data\" | \"elements\">> & { mockData?: { data: any[]; }; }",
         "references": {
           "DemoData": {
             "location": "import",

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-name-fields/sqm-name-fields-view.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { h } from "@stencil/core";
-import { createStyleSheet } from "../../styling/JSS";
 import { ErrorStyles } from "../../global/mixins";
+import { createStyleSheet } from "../../styling/JSS";
 const style = {
   ErrorStyle: ErrorStyles,
   FieldsContainer: {
@@ -26,7 +26,7 @@ const vanillaStyle = `
   background-color: var(--sqm-input-background, #fff);
   border-radius: var(--sqm-input-border-radius, var(--sl-input-border-radius-large), 0.25rem);
   color: var(--sqm-input-color, white);
-  border-width: var(--sqm-border-width, 1px);
+  border-width: var(--sqm-border-thickness, 1px);
 }
 sl-input::part(base):focus,

package/dist/collection/components/sqm-navigation-sidebar-item/sqm-navigation-sidebar-item-view.js CHANGED Viewed

@@ -3,10 +3,10 @@ import { createStyleSheet } from "../../styling/JSS";
 import { gap } from "../../global/mixins";
 import { navigation } from "@saasquatch/component-boilerplate";
 export function NavigationSidebarItemView(props) {
-  const { states, data } = props;
+  const { states, data, padding = "x-small" } = props;
   const backgroundColor = props.backgroundColor || "var(--sqm-portal-background)";
-  const backgroundHoverColor = props.backgroundHoverColor || "var(--sl-color-gray-50)";
-  const backgroundFocusedColor = props.backgroundFocusedColor || "var(--sl-color-gray-200)";
+  const backgroundHoverColor = props.backgroundHoverColor || "var(--sqm-accent-color-background)";
+  const backgroundFocusedColor = props.backgroundFocusedColor || "var(--sqm-primary-color)";
   const textFocusedColor = props.textFocusedColor || "var(--sqm-text)";
   const style = {
     ItemContainer: {
@@ -14,8 +14,8 @@ export function NavigationSidebarItemView(props) {
       "background-color": `${states.active ? backgroundFocusedColor : backgroundColor}`,
       borderRadius: props.borderRadius
         ? `${props.borderRadius}px`
-        : "var(--sl-border-radius-large)",
-      padding: `var(--sl-spacing-${props.padding})`,
+        : "var(--sqm-border-radius-normal)",
+      padding: `var(--sl-spacing-${padding})`,
       "text-decoration": "none",
       color: states.active
         ? textFocusedColor

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-forgot-password/PortalForgotPassword.stories.js CHANGED Viewed

@@ -18,7 +18,7 @@ const defaultProps = {
     submit: async (e) => await e,
   },
   content: {
-    secondaryButton: "Cancel",
+    loginText: "Login",
     messageSlot: "Enter your email below to receive a password reset link.",
   },
 };
@@ -33,8 +33,8 @@ const errorProps = {
     submit: async (e) => await e,
   },
   content: {
-    secondaryButton: "Cancel",
     messageSlot: "Enter your email below to receive a password reset link.",
+    loginText: "Login",
   },
 };
 const loadingProps = {
@@ -48,7 +48,7 @@ const loadingProps = {
     submit: async (e) => await e,
   },
   content: {
-    secondaryButton: "Cancel",
+    loginText: "Login",
     messageSlot: "Enter your email below to receive a password reset link.",
   },
 };
@@ -63,7 +63,7 @@ const successProps = {
     submit: async (e) => await e,
   },
   content: {
-    secondaryButton: "Cancel",
+    loginText: "Login",
     messageSlot: "Enter your email below to receive a password reset link.",
   },
 };

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

@@ -12,13 +12,14 @@ const vanillaStyle = `
 }
 `;
 export function PortalForgotPasswordView(props) {
-  const { states, callbacks, content, styles } = props;
+  const { states, callbacks, content } = props;
   const style = {
     FormWrapper: {
       ...AuthWrapper,
-      background: styles.backgroundColor,
-      borderRadius: styles.borderRadius,
-      border: styles.border,
+      background: content.backgroundColor || "var(--sqm-portal-background)",
+      borderRadius: content.borderRadius || "var(--sqm-border-radius-normal)",
+      border: content.border ||
+        "var(--sqm-border-thickness) solid var(--sqm-border-color)",
     },
     Column: { ...AuthColumn },
     ButtonsContainer: AuthButtonsContainer,
@@ -34,7 +35,7 @@ export function PortalForgotPasswordView(props) {
     h("style", { type: "text/css" },
       vanillaStyle,
       styleString),
-    h(TextSpanView, { textColor: styles.textColor, type: "h3" }, content.messageSlot),
+    h(TextSpanView, { type: "h3" }, content.messageSlot),
     h("sl-form", { class: sheet.classes.Column, "onSl-submit": callbacks.submit },
       props.states.error && (h("sqm-form-message", { type: "error", exportparts: "erroralert-icon" },
         h("div", { part: "erroralert-text" }, props.states.error))),
@@ -43,5 +44,5 @@ export function PortalForgotPasswordView(props) {
       h("sl-input", { exportparts: "label: input-label, base: input-base", type: "email", name: "/email", label: content.emailLabel || "Email", disabled: states.loading, required: true }),
       h("div", { class: sheet.classes.ButtonsContainer },
         h("sl-button", { submit: true, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, content.submitLabel || "Reset Password"),
-        h("sl-button", { type: "text", exportparts: "base: tertiarybutton-base", class: sheet.classes.SecondaryButton, disabled: states.loading, onClick: () => navigation.push(states.loginPath) }, content.loginText)))));
+        h("sl-button", { type: "secondary", exportparts: "base: secondarybutton-base", class: sheet.classes.SecondaryButton, disabled: states.loading, onClick: () => navigation.push(states.loginPath) }, content.loginText)))));
 }

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

@@ -57,12 +57,12 @@ export class PortalForgotPassword {
      * @uiName Border radius
      * @uiWidget number
      */
-    this.borderRadius = "var(--sqm-border-radius-normal)";
+    this.borderRadius = "var(--sqm-border-radius-normal, 8px)";
     /**
      * @uiName Border style
      * @uiWidget textArea
      */
-    this.border = "1px solid var(--sqm-border-color, var(--sqm-text), #eaeaea)";
+    this.border = "1px solid var(--sqm-border-color, #eaeaea)";
     withHooks(this);
   }
   disconnectedCallback() { }
@@ -71,20 +71,16 @@ export class PortalForgotPassword {
       ? usePortalForgotPasswordDemo(this)
       : usePortalForgotPassword(this);
     const content = {
-      secondaryButton: (h("slot", { name: "secondaryButton" },
-        h("sl-button", { type: "text", disabled: states.loading, onClick: () => navigation.push(states.loginPath) }, this.loginText))),
       messageSlot: h("slot", { name: "messageSlot" }, this.headerText),
       emailLabel: this.emailLabel,
       submitLabel: this.submitLabel,
       successAlertText: this.successAlertText,
       loginText: this.loginText,
-    };
-    const styles = {
       backgroundColor: this.backgroundColor,
       borderRadius: this.borderRadius,
       border: this.border,
     };
-    return (h(PortalForgotPasswordView, { states: states, callbacks: callbacks, content: content, styles: styles }));
+    return (h(PortalForgotPasswordView, { states: states, callbacks: callbacks, content: content }));
   }
   static get is() { return "sqm-portal-forgot-password"; }
   static get encapsulation() { return "shadow"; }
@@ -312,7 +308,7 @@ export class PortalForgotPassword {
       },
       "attribute": "border-radius",
       "reflect": false,
-      "defaultValue": "\"var(--sqm-border-radius-normal)\""
+      "defaultValue": "\"var(--sqm-border-radius-normal, 8px)\""
     },
     "border": {
       "type": "string",
@@ -336,14 +332,14 @@ export class PortalForgotPassword {
       },
       "attribute": "border",
       "reflect": false,
-      "defaultValue": "\"1px solid var(--sqm-border-color, var(--sqm-text), #eaeaea)\""
+      "defaultValue": "\"1px solid var(--sqm-border-color, #eaeaea)\""
     },
     "demoData": {
       "type": "unknown",
       "mutable": false,
       "complexType": {
         "original": "DemoData<PortalForgotPasswordViewProps>",
-        "resolved": "{ states?: { error: string; loading: boolean; success: boolean; loginPath: string; }; content?: { secondaryButton: any; messageSlot: any; emailLabel?: string; submitLabel?: string; successAlertText?: string; loginText?: string; }; styles?: { backgroundColor?: string; borderRadius?: string; border?: string; textColor?: string; }; }",
+        "resolved": "{ states?: { error: string; loading: boolean; success: boolean; loginPath: string; }; content?: { messageSlot: any; emailLabel?: string; submitLabel?: string; successAlertText?: string; loginText?: string; backgroundColor?: string; borderRadius?: string; border?: string; textColor?: string; }; }",
         "references": {
           "DemoData": {
             "location": "import",
@@ -379,5 +375,16 @@ function usePortalForgotPasswordDemo(props) {
     callbacks: {
       submit: async (_event) => { },
     },
+    content: {
+      secondaryButton: (h("sl-button", { type: "secondary", exportparts: "base: secondarybutton-base", disabled: false, onClick: () => navigation.push(props.loginPath) }, props.loginText)),
+      messageSlot: h("span", null, props.headerText),
+      emailLabel: props.emailLabel,
+      submitLabel: props.submitLabel,
+      successAlertText: props.successAlertText,
+      loginText: props.loginText,
+      backgroundColor: props.backgroundColor,
+      borderRadius: props.borderRadius,
+      border: props.border,
+    },
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }

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

@@ -48,13 +48,18 @@ 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 Text = () => h(PortalLoginView, Object.assign({}, 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: secondarybutton-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-portal-registration-form/PortalRegistrationForm.stories.js CHANGED Viewed

@@ -3,6 +3,7 @@ import { PortalRegistrationFormView, } from "./sqm-portal-registration-form-view
 export default {
   title: "Components/Microsite Portal Register",
 };
+// TODO: Figure out if we can delete this component and it's stories since we have a duplicate
 const defaultProps = {
   states: {
     error: "",