@saasquatch/mint-components 1.6.8-9 → 1.6.9

package/dist/esm/sqm-close-button-view-dc65b4e3.js

@@ -0,0 +1,26 @@
+import { h } from './index-17b4da69.js';
+import { H as HostBlock } from './mixins-f60a614c.js';
+import { c as createStyleSheet } from './JSS-67b5cff8.js';
+
+const style = {
+  HostBlock: HostBlock,
+  icon: {
+    cursor: "pointer",
+    position: "absolute",
+    right: "var(--sl-spacing-medium)",
+    top: "var(--sl-spacing-x-small)",
+    zIndex: "100",
+  },
+};
+const sheet = createStyleSheet(style);
+const styleString = sheet.toString();
+function CloseButtonView(props) {
+  const { onClick } = props;
+  return (h("div", null,
+    h("style", { type: "text/css" }, styleString),
+    h("span", { class: sheet.classes.icon, onClick: onClick },
+      h("svg", { width: "16", height: "16", viewBox: "0 0 56 56", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+        h("path", { d: "M56 5.64L50.36 0L28 22.36L5.64 0L0 5.64L22.36 28L0 50.36L5.64 56L28 33.64L50.36 56L56 50.36L33.64 28L56 5.64Z", fill: props.color || "black" })))));
+}
+
+export { CloseButtonView as C };

package/dist/esm/sqm-close-button.entry.js

@@ -0,0 +1,37 @@
+import { r as registerInstance, h as h$1 } from './index-17b4da69.js';
+import { m as h } from './stencil-hooks.module-14b87f98.js';
+import { g as getEnvironmentSDK } from './index.module-bbce47bd.js';
+import './mixins-f60a614c.js';
+import './JSS-67b5cff8.js';
+import { C as CloseButtonView } from './sqm-close-button-view-dc65b4e3.js';
+
+const CloseButton = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    /**
+     * @uiName Color
+     * @uiWidget color
+     * @uiType string
+     */
+    this.color = "#000000";
+    h(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    var _a;
+    const sdk = getEnvironmentSDK();
+    const isPopup = sdk.type === "SquatchJS2" &&
+      ((_a = sdk.widgetIdent) === null || _a === void 0 ? void 0 : _a.engagementMedium) === "POPUP";
+    if (!isPopup)
+      return h$1("div", { style: { display: "none" } });
+    const onClick = () => {
+      var _a, _b;
+      if (sdk.type === "SquatchJS2") {
+        (_b = (_a = sdk.api).close) === null || _b === void 0 ? void 0 : _b.call(_a);
+      }
+    };
+    return h$1(CloseButtonView, { onClick: onClick, color: this.color });
+  }
+};
+
+export { CloseButton as sqm_close_button };

package/dist/esm/sqm-empty_5.entry.js

@@ -1,12 +1,12 @@
 import { h, r as registerInstance, c as Host } from './index-17b4da69.js';
-import { m as h$1 } from './stencil-hooks.module-b48b45ec.js';
+import { m as h$1 } from './stencil-hooks.module-14b87f98.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import { g as getProps } from './utils-334c1e34.js';
-import { P as PortalContainerView, a as PortalSectionView } from './sqm-portal-container-view-83b417f0.js';
+import { P as PortalContainerView, a as PortalSectionView } from './sqm-portal-container-view-ab89c6cc.js';
 
 function EmptyStateView(props) {
   const { emptyStateHeader, emptyStateImage, emptyStateText } = props;
-  return (h("sqm-portal-container", { padding: "large", gap: "medium", part: "sqm-empty-container" },
+  return (h("sqm-portal-container", { padding: "large", gap: "medium", part: "sqm-base" },
     h("sqm-image", { "image-url": emptyStateImage }),
     h("sqm-titled-section", { "label-margin": "xxx-small", "text-align": "center" },
       h("sqm-text", { slot: "label" },
@@ -50,7 +50,7 @@ function ImageView(props) {
     h("style", { type: "text/css" },
       styleString,
       vanillaStyle),
-    h("div", { class: sheet.classes.Container, part: "sqm-image-container" },
+    h("div", { class: sheet.classes.Container, part: "sqm-base" },
       h("img", { part: "sqm-image", src: props.imageUrl, class: sheet.classes.Image }))));
 }
 
@@ -58,7 +58,7 @@ const Image = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     /**
-     * @uiName Position Alignment
+     * @uiName Position alignment
      * @uiType string
      * @uiEnum ["left", "center", "right"]
      * @uiEnumNames ["Left", "Center", "Right"]
@@ -99,6 +99,13 @@ const PortalContainer = class {
      * @uiName Maximum width
      */
     this.maxWidth = "100%";
+    /**
+     * @uiName Background color
+     * @uiWidget color
+     * @uiGroup Card style
+     * @uiType string
+     */
+    this.backgroundColor = "#ffffff00";
     h$1(this);
   }
   disconnectedCallback() { }
@@ -171,7 +178,7 @@ const TitledSection = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     /**
-     * @uiName Text Alignment
+     * @uiName Text alignment
      * @uiType string
      * @uiEnum ["left", "center", "right"]
      * @uiEnumNames ["Left", "Center", "Right"]
@@ -180,7 +187,7 @@ const TitledSection = class {
     /**
      * Margin applied to the bottom of the label slot
      *
-     * @uiName Label Bottom Margin
+     * @uiName Label bottom margin
      * @uiType string
      * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
      * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
@@ -189,7 +196,7 @@ const TitledSection = class {
     /**
      * Padding applied to all 4 sides of the container
      *
-     * @uiName Section Padding
+     * @uiName Section padding
      * @uiType string
      * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
      * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]

package/dist/esm/sqm-form-message.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, h as h$1 } from './index-17b4da69.js';
-import { m as h } from './stencil-hooks.module-b48b45ec.js';
+import { m as h } from './stencil-hooks.module-14b87f98.js';
 
-const sqmFormMessageCss = "sl-alert::part(base){border:1px solid;border-radius:3px;-webkit-box-shadow:0 1px 2px rgba(20, 20, 20, 0.1);box-shadow:0 1px 2px rgba(20, 20, 20, 0.1)}.Error::part(base){background-color:var(--sl-color-danger-100);border-color:var(--sl-color-danger-200)}.Success::part(base){background-color:var(--sl-color-success-100);border-color:var(--sl-color-success-200)}.Info::part(base){background-color:var(--sl-color-primary-100);border-color:var(--sl-color-primary-200)}";
+const sqmFormMessageCss = "sl-alert::part(base){border:1px solid;border-radius:3px;-webkit-box-shadow:0 1px 2px rgba(20, 20, 20, 0.1);box-shadow:0 1px 2px rgba(20, 20, 20, 0.1)}.Error::part(base){background-color:var(--sl-color-danger-100);border-color:var(--sl-color-danger-200)}.Warning::part(base){background-color:var(--sl-color-warning-100);border-color:var(--sl-color-warning-200)}.Success::part(base){background-color:var(--sl-color-success-100);border-color:var(--sl-color-success-200)}.Info::part(base){background-color:var(--sl-color-primary-100);border-color:var(--sl-color-primary-200)}";
 
 const FormMessage = class {
   constructor(hostRef) {
@@ -17,6 +17,9 @@ const FormMessage = class {
     else if (this.type === "info") {
       return (h$1("sl-alert", { exportparts: "base: infoalert-base, icon:infoalert-icon", class: "Info", type: "primary", open: true }, h$1("sl-icon", { slot: "icon", name: `${this.icon ? this.icon : "info-circle"}` }), h$1("slot", null)));
     }
+    else if (this.type === "warning") {
+      return (h$1("sl-alert", { exportparts: "base: warningalert-base, icon:warningalert-icon", class: "Warning", type: "warning", open: true }, h$1("sl-icon", { slot: "icon", name: `${this.icon ? this.icon : "exclamation-triangle"}` }), h$1("slot", null)));
+    }
     else {
       return (h$1("sl-alert", { exportparts: "base: successalert-base, icon:successalert-icon", class: "Success", type: "success", open: true }, h$1("sl-icon", { slot: "icon", name: `${this.icon ? this.icon : "check2-circle"}` }), h$1("slot", null)));
     }

package/dist/esm/sqm-graphql-client-provider.entry.js

@@ -1,15 +1,14 @@
 import { r as registerInstance, h as h$1, c as Host } from './index-17b4da69.js';
-import { n as m, u as useEffect, m as h } from './stencil-hooks.module-b48b45ec.js';
-import './use-callback-051c06c6.js';
-import { U, y as ye, H, b as he } from './index.module-0ba0774e.js';
+import { n as m, f as useEffect, m as h } from './stencil-hooks.module-14b87f98.js';
+import { H, C as Ce, _, c as ye } from './index.module-bbce47bd.js';
 
 async function useGraphQLClientProvider({ domain }) {
-  const token = U();
+  const token = H();
   const appDomain = domain;
-  const tenantAlias = H();
+  const tenantAlias = _();
   // Memoization is shared. One client per domain, tenant and token (or null)
-  const managedIdentityClient = ye(appDomain, tenantAlias, token);
-  const [, setGraphQLClient] = m(he, managedIdentityClient);
+  const managedIdentityClient = Ce(appDomain, tenantAlias, token);
+  const [, setGraphQLClient] = m(ye, managedIdentityClient);
   useEffect(() => {
     setGraphQLClient(managedIdentityClient);
   }, [managedIdentityClient]);

package/dist/esm/sqm-header-logo.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h as h$1, c as Host } from './index-17b4da69.js';
-import { m as h } from './stencil-hooks.module-b48b45ec.js';
+import { m as h } from './stencil-hooks.module-14b87f98.js';
 
 const HeroImage = class {
   constructor(hostRef) {
@@ -7,19 +7,19 @@ const HeroImage = class {
     /**
      * Page participants are navigated to after clicking the header logo.
      *
-     * @uiName Redirect Path
+     * @uiName Redirect path
      * @uiWidget pageSelect
      */
     this.nextPage = "/";
     /**
-     * @uiName Logo Height
+     * @uiName Logo height
      */
     this.height = 60;
     h(this);
   }
   disconnectedCallback() { }
   render() {
-    return (h$1(Host, null, h$1("a", { href: this.nextPage, part: "sqm-header-logo-link" }, h$1("img", { style: { height: `${this === null || this === void 0 ? void 0 : this.height}px` }, src: this === null || this === void 0 ? void 0 : this.imageUrl }))));
+    return (h$1(Host, null, h$1("a", { href: this.nextPage, part: "sqm-link" }, h$1("img", { style: { height: `${this === null || this === void 0 ? void 0 : this.height}px` }, src: this === null || this === void 0 ? void 0 : this.imageUrl }))));
   }
 };
 

package/dist/esm/sqm-instant-access-registration.entry.js

@@ -0,0 +1,154 @@
+import { r as registerInstance, h as h$1 } from './index-17b4da69.js';
+import { m as h } from './stencil-hooks.module-14b87f98.js';
+import { i as isDemo, e as setUserIdentity } from './index.module-bbce47bd.js';
+import './jsonpointer-388a7082.js';
+import { c as cjs } from './cjs-bdfb4486.js';
+import './mixins-f60a614c.js';
+import './JSS-67b5cff8.js';
+import { E as EmailRegistrationView } from './email-registration-view-0a11e959.js';
+import './useRegistrationFormState-7bf6c145.js';
+import { u as useInstantAccessRegistration } from './useInstantAccessRegistration-175820dc.js';
+
+const InstantAccessRegistration = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.ignored = true;
+    /**
+     * @uiName Email field label
+     */
+    this.emailLabel = "Email";
+    /**
+     * @uiName First name field label
+     */
+    this.firstNameLabel = "First Name";
+    /**
+     * @uiName Last name field label
+     */
+    this.lastNameLabel = "Last Name";
+    /**
+     * @uiName Register button text
+     */
+    this.registerLabel = "Start Referring";
+    /**
+     * Require your participants to enter their first and last name.
+     *
+     * @uiName Include name fields
+     */
+    this.includeName = false;
+    /**
+     * @uiName Hide border
+     * @uiGroup Card style
+     */
+    this.hideBorder = false;
+    /**
+     * Display this message when a required field has not been filled out.
+     *
+     * @uiName Required field message
+     * @uiWidget textArea
+     * @uiGroup Error messages
+     */
+    this.requiredFieldErrorMessage = "Cannot be empty";
+    /**
+     * Display this message when the given email is invalid.
+     *
+     * @uiName Invalid email message
+     * @uiWidget textArea
+     * @uiGroup Error messages
+     */
+    this.invalidEmailErrorMessage = "Please enter a valid email address";
+    /**
+     * Display this message when the form submission unexpectedly fails.
+     *
+     * @uiName Network error message
+     * @uiWidget textArea
+     * @uiGroup Error messages
+     */
+    this.networkErrorMessage = "There was a problem signing you in. Please wait a moment and try again. If this problem continues, contact Support for help resolving this issue.";
+    /**
+     * @uiName Top padding
+     * @uiGroup Card style
+     * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
+     * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+     */
+    this.paddingTop = "large";
+    /**
+     * @uiName Right padding
+     * @uiGroup Card style
+     * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
+     * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+     */
+    this.paddingRight = "large";
+    /**
+     * @uiName Bottom padding
+     * @uiGroup Card style
+     * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
+     * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+     */
+    this.paddingBottom = "large";
+    /**
+     * @uiName Left padding
+     * @uiGroup Card style
+     * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
+     * @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
+     * @uiGroup Card style
+     * @uiType string
+     */
+    this.backgroundColor = "#ffffff";
+    /**
+     * @undocumented
+     * @uiType boolean
+     */
+    this.includeCookies = false;
+    h(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const { states, callbacks } = isDemo()
+      ? useRegistrationDemo(this)
+      : useInstantAccessRegistration(this);
+    const content = {
+      emailLabel: this.emailLabel,
+      registerLabel: this.registerLabel,
+      firstNameLabel: this.firstNameLabel,
+      lastNameLabel: this.lastNameLabel,
+      includeName: this.includeName,
+      hideBorder: this.hideBorder,
+      invalidEmailErrorMessage: this.invalidEmailErrorMessage,
+      requiredFieldErrorMessage: this.requiredFieldErrorMessage,
+      paddingTop: this.paddingTop,
+      paddingBottom: this.paddingBottom,
+      paddingLeft: this.paddingLeft,
+      paddingRight: this.paddingRight,
+      backgroundColor: this.backgroundColor,
+      // slots
+      topSlot: h$1("slot", { name: "top" }),
+      bottomSlot: h$1("slot", { name: "bottom" }),
+    };
+    return (h$1(EmailRegistrationView, { states: states, callbacks: callbacks, content: content }));
+  }
+};
+function useRegistrationDemo(props) {
+  const submit = async (_event) => {
+    setUserIdentity({
+      id: "referrer@example.com",
+      accountId: "referrer@example.com",
+      jwt: "eyJraWQiOiJlNjI2NzQxNy1jMzZlLTRlM2EtYjM5NS1lYTFmY2YyNmU3YzIiLCJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJzdWIiOiJjbVZtWlhKeVpYSkFaWGhoYlhCc1pTNWpiMjA9OmNtVm1aWEp5WlhKQVpYaGhiWEJzWlM1amIyMD1AdGVzdF9heGJndGF0dzF0Y2NwOnVzZXJzIiwicGFzc3dvcmRsZXNzIjp0cnVlLCJpc3MiOiJodHRwczovL3N0YWdpbmcucmVmZXJyYWxzYWFzcXVhdGNoLmNvbS8iLCJleHAiOjE2ODA4ODU5MTksImlhdCI6MTY4MDc5OTUxOX0.kjmTVVf_BTb-uMNKnadLyNLxMFwpkefsY02O3iAfBVIJJZZfeZMwunPlKsS3Vbp28aYRClBjH5Wj4pYxDn23D0CdZx8KNCqiJ8yF6149O9SPMkRseoJkliqS6LyvMOEDjGDkuLfcC8_hq1AHBXFt5BdCtWOk1gwf_5R9A0w5gXEIvprBzbNDLbuo88bVAlrmFNvfttXXryrpUeruMal7cBKuy02YblBrB4kKoyJiprU5GLEjciBA4A56u8TwQc0kbsPf2YcQaJsY_IvkC7S1u4sPyObpq6iF6Ed8UYHAo6nU5KjZXyVtoUyeIS11mf_6OtDO6LyMNHV2FtEUUDdPCg",
+    });
+  };
+  return cjs({
+    states: {
+      loading: false,
+      error: "",
+    },
+    callbacks: {
+      submit,
+    },
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+}
+
+export { InstantAccessRegistration as sqm_instant_access_registration };

package/dist/esm/sqm-leaderboard-rank.entry.js

@@ -1,8 +1,7 @@
 import { r as registerInstance, h as h$1 } from './index-17b4da69.js';
-import { m as h } from './stencil-hooks.module-b48b45ec.js';
-import { i as intl } from './global-170c4499.js';
-import './use-callback-051c06c6.js';
-import { d as dist, O, W, f as fn, i as isDemo } from './index.module-0ba0774e.js';
+import { m as h } from './stencil-hooks.module-14b87f98.js';
+import { i as intl } from './global-9992475a.js';
+import { d as dist, O, L, b as mn, i as isDemo } from './index.module-bbce47bd.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { L as LeaderboardRankView } from './sqm-leaderboard-rank-view-10657658.js';
 
@@ -24,7 +23,7 @@ function useLeaderboardRank(props) {
   const programIdContext = O();
   // Default to context, overriden by props
   const programId = (_a = props.programId) !== null && _a !== void 0 ? _a : programIdContext;
-  const user = W();
+  const user = L();
   const rankVariables = programId
     ? {
       type: props.leaderboardType,
@@ -37,7 +36,7 @@ function useLeaderboardRank(props) {
   if (props.interval) {
     rankVariables.filter["interval"] = props.interval;
   }
-  const { data: rankData } = fn(GET_RANK, rankVariables, !(user === null || user === void 0 ? void 0 : user.jwt));
+  const { data: rankData } = mn(GET_RANK, rankVariables, !(user === null || user === void 0 ? void 0 : user.jwt));
   const fullRankText = ((_b = rankData === null || rankData === void 0 ? void 0 : rankData.viewer) === null || _b === void 0 ? void 0 : _b.leaderboardRank) ? intl.formatMessage({ id: "rankText", defaultMessage: props.rankText }, {
     rank: (_d = (_c = rankData === null || rankData === void 0 ? void 0 : rankData.viewer) === null || _c === void 0 ? void 0 : _c.leaderboardRank) === null || _d === void 0 ? void 0 : _d[props.rankType],
   })
@@ -55,7 +54,7 @@ const LeaderboardRank = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     /**
-     * @uiName Rank Text
+     * @uiName Rank text
      * @uiWidget textArea
      */
     this.rankText = "You are currently in {rank, selectordinal, one {#st} two {#nd} few {#rd} other {#th} } place!";

package/dist/esm/{sqm-user-identifier-view-dbf71a5e.js → sqm-logout-current-user-view-2d740794.js}

@@ -6,28 +6,30 @@ const style = {
   Link: {
     textDecoration: "none",
     color: "var(--sl-color-primary-700)",
+    cursor: "pointer",
     "&:hover": {
       color: "var(--sl-color-primary-800)",
     },
   },
 };
 const vanillaStyle = `
-:host{
+:host, sqm-logout-current-user{
   display: inline;   
 }
+
 `;
 const sheet = createStyleSheet(style);
 const styleString = sheet.toString();
-function UserIdentifierView(props) {
-  const { userIdentificationText, switchUserLink, switchUserText } = props;
+function LogoutCurrentUserView(props) {
+  const { filledInEmailText, onSwitchClick, switchUserText } = props;
   return (h("span", { class: sheet.classes.Container, part: "sqm-base" },
     h("style", { type: "text/css" },
       styleString,
       vanillaStyle),
-    userIdentificationText,
+    filledInEmailText,
     " (",
-    h("a", { class: sheet.classes.Link, href: switchUserLink, part: "sqm-link" }, switchUserText),
+    h("a", { class: sheet.classes.Link, onClick: onSwitchClick, part: "sqm-link" }, switchUserText),
     ")"));
 }
 
-export { UserIdentifierView as U };
+export { LogoutCurrentUserView as L };

package/dist/esm/sqm-logout-current-user.entry.js

@@ -0,0 +1,58 @@
+import { r as registerInstance, h as h$1 } from './index-17b4da69.js';
+import { m as h } from './stencil-hooks.module-14b87f98.js';
+import { L, e as setUserIdentity, i as isDemo } from './index.module-bbce47bd.js';
+import { c as cjs } from './cjs-bdfb4486.js';
+import './JSS-67b5cff8.js';
+import { g as getProps } from './utils-334c1e34.js';
+import { L as LogoutCurrentUserView } from './sqm-logout-current-user-view-2d740794.js';
+
+function useLogoutCurrentUser(props) {
+  var _a;
+  const user = L();
+  const onSwitchClick = () => {
+    setUserIdentity(undefined);
+  };
+  const filledInEmailText = (_a = props.userIdentificationText) === null || _a === void 0 ? void 0 : _a.replace("{email}", (user === null || user === void 0 ? void 0 : user.id) || "Error fetching email");
+  return {
+    onSwitchClick,
+    filledInEmailText,
+    ...props,
+  };
+}
+
+const LogoutCurrentUser = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    /**
+     * @required
+     * @uiName User identification text
+     */
+    this.userIdentificationText = "{email}";
+    /**
+     * @required
+     * @uiName Switch user button label
+     */
+    this.switchUserText = "not you?";
+    h(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const props = isDemo()
+      ? useDemoLogoutCurrentUser(this)
+      : useLogoutCurrentUser(getProps(this));
+    const content = {
+      userIdentificationText: this.userIdentificationText,
+      switchUserText: this.switchUserText,
+    };
+    return h$1(LogoutCurrentUserView, Object.assign({}, props, content));
+  }
+};
+function useDemoLogoutCurrentUser(props) {
+  return cjs({
+    onSwitchClick: () => setUserIdentity(undefined),
+    filledInEmailText: "john@example.com",
+    switchUserText: props.switchUserText,
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+}
+
+export { LogoutCurrentUser as sqm_logout_current_user };

package/dist/esm/{sqm-navigation-sidebar-item-view-5a4ac267.js → sqm-navigation-sidebar-item-view-debb6dfe.js}

@@ -1,5 +1,5 @@
 import { h } from './index-17b4da69.js';
-import { g as gn } from './index.module-0ba0774e.js';
+import { p as pn } from './index.module-bbce47bd.js';
 import { g as gap } from './mixins-f60a614c.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 
@@ -31,13 +31,13 @@ function NavigationSidebarItemView(props) {
   };
   const sheet = createStyleSheet(style);
   const styleString = sheet.toString();
-  return (h("a", { part: "sqm-navigation-item-link", href: data.path, onClick: (e) => {
+  return (h("a", { part: "sqm-link", href: data.path, onClick: (e) => {
       e.preventDefault();
-      gn.push(data.path);
+      pn.push(data.path);
     }, class: sheet.classes.ItemContainer },
     h("style", { type: "text/css" }, styleString),
     h("sl-icon", { class: sheet.classes.Icon, name: data.icon }),
-    h("p", { class: sheet.classes.Label, part: "sqm-navigation-item-label" }, data.label)));
+    h("p", { class: sheet.classes.Label, part: "sqm-label" }, data.label)));
 }
 
 export { NavigationSidebarItemView as N };

package/dist/esm/sqm-navigation-sidebar-item.entry.js

@@ -1,15 +1,14 @@
 import { r as registerInstance, h as h$1 } from './index-17b4da69.js';
-import { m as h } from './stencil-hooks.module-b48b45ec.js';
-import './use-callback-051c06c6.js';
-import { c as mn, i as isDemo } from './index.module-0ba0774e.js';
+import { m as h } from './stencil-hooks.module-14b87f98.js';
+import { v as vn, i as isDemo } from './index.module-bbce47bd.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import './mixins-f60a614c.js';
 import './JSS-67b5cff8.js';
 import { g as getProps } from './utils-334c1e34.js';
-import { N as NavigationSidebarItemView } from './sqm-navigation-sidebar-item-view-5a4ac267.js';
+import { N as NavigationSidebarItemView } from './sqm-navigation-sidebar-item-view-debb6dfe.js';
 
 function useNavigationSidebarItem(props) {
-  const currentPage = mn();
+  const currentPage = vn();
   return {
     states: {
       active: currentPage.pathname === props.path,

package/dist/esm/{sqm-navigation-sidebar-view-feb719ce.js → sqm-navigation-sidebar-view-414bcb19.js}

@@ -143,14 +143,14 @@ const vanillaStyle = `
 }
 `;
 function NavigationSidebarView(props, children) {
-  return (h("div", { class: "container", part: "sqm-navigation-container" },
+  return (h("div", { class: "container", part: "sqm-base" },
     h("style", null, vanillaStyle),
     h("input", Object.assign({ type: "checkbox", class: "toggler" }, props)),
     h("div", { class: "hamburger" },
       h("div", { class: "line" }),
       h("div", { class: "line" }),
       h("div", { class: "line" })),
-    h("div", { class: "menu-items", part: "sqm-navigation-menu-items" }, children)));
+    h("div", { class: "menu-items", part: "sqm-items-container" }, children)));
 }
 
 export { NavigationSidebarView as N };

package/dist/esm/sqm-navigation-sidebar.entry.js

@@ -1,8 +1,7 @@
 import { r as registerInstance, h as h$1 } from './index-17b4da69.js';
-import { m as h, i as useState, u as useEffect } from './stencil-hooks.module-b48b45ec.js';
-import './use-callback-051c06c6.js';
-import { c as mn, O } from './index.module-0ba0774e.js';
-import { N as NavigationSidebarView } from './sqm-navigation-sidebar-view-feb719ce.js';
+import { m as h, j as useState, f as useEffect } from './stencil-hooks.module-14b87f98.js';
+import { v as vn, O } from './index.module-bbce47bd.js';
+import { N as NavigationSidebarView } from './sqm-navigation-sidebar-view-414bcb19.js';
 
 const NavigationSidebar = class {
   constructor(hostRef) {
@@ -17,7 +16,7 @@ const NavigationSidebar = class {
   }
 };
 function useNavigationSidebar() {
-  const location = mn();
+  const location = vn();
   const programId = O();
   const [checked, setChecked] = useState(false);
   // Close hamburger menu after navigation

package/dist/esm/sqm-password-field.entry.js

@@ -1,11 +1,10 @@
 import { h, r as registerInstance } from './index-17b4da69.js';
-import { o as d, i as useState, m as h$1 } from './stencil-hooks.module-b48b45ec.js';
-import './use-callback-051c06c6.js';
-import { i as isDemo } from './index.module-0ba0774e.js';
+import { o as d, j as useState, m as h$1 } from './stencil-hooks.module-14b87f98.js';
+import { i as isDemo } from './index.module-bbce47bd.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { E as ErrorStyles } from './mixins-f60a614c.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
-import { R as REGISTRATION_FORM_STATE_CONTEXT } from './useRegistrationFormState-29e30121.js';
+import { R as REGISTRATION_FORM_STATE_CONTEXT } from './useRegistrationFormState-7bf6c145.js';
 
 var constants = {
   error: {
@@ -485,7 +484,7 @@ const styleString$1 = sheet$1.toString();
 function PortalResetPasswordView(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
   const { states, callbacks } = props;
-  return (h("div", { class: sheet$1.classes.InputContainer, part: "sqm-password-field-container" },
+  return (h("div", { class: sheet$1.classes.InputContainer, part: "sqm-base" },
     h("style", { type: "text/css" },
       vanillaStyle,
       styleString$1),
@@ -534,12 +533,12 @@ const PortalPasswordField = class {
     /**
      * Label for password field
      *
-     * @uiName Password Label
+     * @uiName Password label
      */
     this.fieldLabel = "Password";
     /**
      * Disable live password validation
-     * @uiName Disable Validation
+     * @uiName Disable validation
      */
     this.disableValidation = false;
     h$1(this);