@saasquatch/mint-components 1.6.8-9 → 1.6.9

package/dist/cjs/sqm-close-button-view-fd6e8f60.js

@@ -0,0 +1,28 @@
+'use strict';
+
+const index = require('./index-b0129cd6.js');
+const mixins = require('./mixins-fe9d4112.js');
+const JSS = require('./JSS-8503a151.js');
+
+const style = {
+  HostBlock: mixins.HostBlock,
+  icon: {
+    cursor: "pointer",
+    position: "absolute",
+    right: "var(--sl-spacing-medium)",
+    top: "var(--sl-spacing-x-small)",
+    zIndex: "100",
+  },
+};
+const sheet = JSS.createStyleSheet(style);
+const styleString = sheet.toString();
+function CloseButtonView(props) {
+  const { onClick } = props;
+  return (index.h("div", null,
+    index.h("style", { type: "text/css" }, styleString),
+    index.h("span", { class: sheet.classes.icon, onClick: onClick },
+      index.h("svg", { width: "16", height: "16", viewBox: "0 0 56 56", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+        index.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" })))));
+}
+
+exports.CloseButtonView = CloseButtonView;

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

@@ -0,0 +1,41 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-b0129cd6.js');
+const stencilHooks_module = require('./stencil-hooks.module-e4bf7f2d.js');
+const index_module = require('./index.module-4314dfb1.js');
+require('./mixins-fe9d4112.js');
+require('./JSS-8503a151.js');
+const sqmCloseButtonView = require('./sqm-close-button-view-fd6e8f60.js');
+
+const CloseButton = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    /**
+     * @uiName Color
+     * @uiWidget color
+     * @uiType string
+     */
+    this.color = "#000000";
+    stencilHooks_module.h$1(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    var _a;
+    const sdk = index_module.getEnvironmentSDK();
+    const isPopup = sdk.type === "SquatchJS2" &&
+      ((_a = sdk.widgetIdent) === null || _a === void 0 ? void 0 : _a.engagementMedium) === "POPUP";
+    if (!isPopup)
+      return index.h("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 index.h(sqmCloseButtonView.CloseButtonView, { onClick: onClick, color: this.color });
+  }
+};
+
+exports.sqm_close_button = CloseButton;

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

@@ -6,11 +6,11 @@ const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-e4bf7f2d.js');
 const JSS = require('./JSS-8503a151.js');
 const utils = require('./utils-6847bc06.js');
-const sqmPortalContainerView = require('./sqm-portal-container-view-6accb54a.js');
+const sqmPortalContainerView = require('./sqm-portal-container-view-5fb2ad49.js');
 
 function EmptyStateView(props) {
   const { emptyStateHeader, emptyStateImage, emptyStateText } = props;
-  return (index.h("sqm-portal-container", { padding: "large", gap: "medium", part: "sqm-empty-container" },
+  return (index.h("sqm-portal-container", { padding: "large", gap: "medium", part: "sqm-base" },
     index.h("sqm-image", { "image-url": emptyStateImage }),
     index.h("sqm-titled-section", { "label-margin": "xxx-small", "text-align": "center" },
       index.h("sqm-text", { slot: "label" },
@@ -54,7 +54,7 @@ function ImageView(props) {
     index.h("style", { type: "text/css" },
       styleString,
       vanillaStyle),
-    index.h("div", { class: sheet.classes.Container, part: "sqm-image-container" },
+    index.h("div", { class: sheet.classes.Container, part: "sqm-base" },
       index.h("img", { part: "sqm-image", src: props.imageUrl, class: sheet.classes.Image }))));
 }
 
@@ -62,7 +62,7 @@ const Image = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     /**
-     * @uiName Position Alignment
+     * @uiName Position alignment
      * @uiType string
      * @uiEnum ["left", "center", "right"]
      * @uiEnumNames ["Left", "Center", "Right"]
@@ -103,6 +103,13 @@ const PortalContainer = class {
      * @uiName Maximum width
      */
     this.maxWidth = "100%";
+    /**
+     * @uiName Background color
+     * @uiWidget color
+     * @uiGroup Card style
+     * @uiType string
+     */
+    this.backgroundColor = "#ffffff00";
     stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
@@ -175,7 +182,7 @@ const TitledSection = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     /**
-     * @uiName Text Alignment
+     * @uiName Text alignment
      * @uiType string
      * @uiEnum ["left", "center", "right"]
      * @uiEnumNames ["Left", "Center", "Right"]
@@ -184,7 +191,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"]
@@ -193,7 +200,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/cjs/sqm-form-message.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-e4bf7f2d.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) {
@@ -21,6 +21,9 @@ const FormMessage = class {
     else if (this.type === "info") {
       return (index.h("sl-alert", { exportparts: "base: infoalert-base, icon:infoalert-icon", class: "Info", type: "primary", open: true }, index.h("sl-icon", { slot: "icon", name: `${this.icon ? this.icon : "info-circle"}` }), index.h("slot", null)));
     }
+    else if (this.type === "warning") {
+      return (index.h("sl-alert", { exportparts: "base: warningalert-base, icon:warningalert-icon", class: "Warning", type: "warning", open: true }, index.h("sl-icon", { slot: "icon", name: `${this.icon ? this.icon : "exclamation-triangle"}` }), index.h("slot", null)));
+    }
     else {
       return (index.h("sl-alert", { exportparts: "base: successalert-base, icon:successalert-icon", class: "Success", type: "success", open: true }, index.h("sl-icon", { slot: "icon", name: `${this.icon ? this.icon : "check2-circle"}` }), index.h("slot", null)));
     }

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

@@ -4,16 +4,15 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-e4bf7f2d.js');
-require('./use-callback-86e9ac75.js');
-const index_module = require('./index.module-f6afc139.js');
+const index_module = require('./index.module-4314dfb1.js');
 
 async function useGraphQLClientProvider({ domain }) {
-  const token = index_module.U();
+  const token = index_module.H();
   const appDomain = domain;
-  const tenantAlias = index_module.H();
+  const tenantAlias = index_module._();
   // Memoization is shared. One client per domain, tenant and token (or null)
-  const managedIdentityClient = index_module.ye(appDomain, tenantAlias, token);
-  const [, setGraphQLClient] = stencilHooks_module.m(index_module.he, managedIdentityClient);
+  const managedIdentityClient = index_module.Ce(appDomain, tenantAlias, token);
+  const [, setGraphQLClient] = stencilHooks_module.m(index_module.ye, managedIdentityClient);
   stencilHooks_module.useEffect(() => {
     setGraphQLClient(managedIdentityClient);
   }, [managedIdentityClient]);

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

@@ -11,19 +11,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;
     stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
-    return (index.h(index.Host, null, index.h("a", { href: this.nextPage, part: "sqm-header-logo-link" }, index.h("img", { style: { height: `${this === null || this === void 0 ? void 0 : this.height}px` }, src: this === null || this === void 0 ? void 0 : this.imageUrl }))));
+    return (index.h(index.Host, null, index.h("a", { href: this.nextPage, part: "sqm-link" }, index.h("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/cjs/sqm-instant-access-registration.cjs.entry.js

@@ -0,0 +1,158 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-b0129cd6.js');
+const stencilHooks_module = require('./stencil-hooks.module-e4bf7f2d.js');
+const index_module = require('./index.module-4314dfb1.js');
+require('./jsonpointer-11327262.js');
+const cjs = require('./cjs-1066ec21.js');
+require('./mixins-fe9d4112.js');
+require('./JSS-8503a151.js');
+const emailRegistrationView = require('./email-registration-view-f347daa7.js');
+require('./useRegistrationFormState-67c0b5ff.js');
+const useInstantAccessRegistration = require('./useInstantAccessRegistration-1fea58e7.js');
+
+const InstantAccessRegistration = class {
+  constructor(hostRef) {
+    index.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;
+    stencilHooks_module.h$1(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const { states, callbacks } = index_module.isDemo()
+      ? useRegistrationDemo(this)
+      : useInstantAccessRegistration.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: index.h("slot", { name: "top" }),
+      bottomSlot: index.h("slot", { name: "bottom" }),
+    };
+    return (index.h(emailRegistrationView.EmailRegistrationView, { states: states, callbacks: callbacks, content: content }));
+  }
+};
+function useRegistrationDemo(props) {
+  const submit = async (_event) => {
+    index_module.setUserIdentity({
+      id: "referrer@example.com",
+      accountId: "referrer@example.com",
+      jwt: "eyJraWQiOiJlNjI2NzQxNy1jMzZlLTRlM2EtYjM5NS1lYTFmY2YyNmU3YzIiLCJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJzdWIiOiJjbVZtWlhKeVpYSkFaWGhoYlhCc1pTNWpiMjA9OmNtVm1aWEp5WlhKQVpYaGhiWEJzWlM1amIyMD1AdGVzdF9heGJndGF0dzF0Y2NwOnVzZXJzIiwicGFzc3dvcmRsZXNzIjp0cnVlLCJpc3MiOiJodHRwczovL3N0YWdpbmcucmVmZXJyYWxzYWFzcXVhdGNoLmNvbS8iLCJleHAiOjE2ODA4ODU5MTksImlhdCI6MTY4MDc5OTUxOX0.kjmTVVf_BTb-uMNKnadLyNLxMFwpkefsY02O3iAfBVIJJZZfeZMwunPlKsS3Vbp28aYRClBjH5Wj4pYxDn23D0CdZx8KNCqiJ8yF6149O9SPMkRseoJkliqS6LyvMOEDjGDkuLfcC8_hq1AHBXFt5BdCtWOk1gwf_5R9A0w5gXEIvprBzbNDLbuo88bVAlrmFNvfttXXryrpUeruMal7cBKuy02YblBrB4kKoyJiprU5GLEjciBA4A56u8TwQc0kbsPf2YcQaJsY_IvkC7S1u4sPyObpq6iF6Ed8UYHAo6nU5KjZXyVtoUyeIS11mf_6OtDO6LyMNHV2FtEUUDdPCg",
+    });
+  };
+  return cjs.cjs({
+    states: {
+      loading: false,
+      error: "",
+    },
+    callbacks: {
+      submit,
+    },
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+}
+
+exports.sqm_instant_access_registration = InstantAccessRegistration;

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

@@ -4,9 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-e4bf7f2d.js');
-const global = require('./global-48c25606.js');
-require('./use-callback-86e9ac75.js');
-const index_module = require('./index.module-f6afc139.js');
+const global = require('./global-40232313.js');
+const index_module = require('./index.module-4314dfb1.js');
 const cjs = require('./cjs-1066ec21.js');
 const sqmLeaderboardRankView = require('./sqm-leaderboard-rank-view-5a3d4a88.js');
 
@@ -28,7 +27,7 @@ function useLeaderboardRank(props) {
   const programIdContext = index_module.O();
   // Default to context, overriden by props
   const programId = (_a = props.programId) !== null && _a !== void 0 ? _a : programIdContext;
-  const user = index_module.W();
+  const user = index_module.L();
   const rankVariables = programId
     ? {
       type: props.leaderboardType,
@@ -41,7 +40,7 @@ function useLeaderboardRank(props) {
   if (props.interval) {
     rankVariables.filter["interval"] = props.interval;
   }
-  const { data: rankData } = index_module.fn(GET_RANK, rankVariables, !(user === null || user === void 0 ? void 0 : user.jwt));
+  const { data: rankData } = index_module.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) ? global.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],
   })
@@ -59,7 +58,7 @@ const LeaderboardRank = class {
   constructor(hostRef) {
     index.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/cjs/{sqm-user-identifier-view-90b36758.js → sqm-logout-current-user-view-555c7729.js}

@@ -8,28 +8,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 = JSS.createStyleSheet(style);
 const styleString = sheet.toString();
-function UserIdentifierView(props) {
-  const { userIdentificationText, switchUserLink, switchUserText } = props;
+function LogoutCurrentUserView(props) {
+  const { filledInEmailText, onSwitchClick, switchUserText } = props;
   return (index.h("span", { class: sheet.classes.Container, part: "sqm-base" },
     index.h("style", { type: "text/css" },
       styleString,
       vanillaStyle),
-    userIdentificationText,
+    filledInEmailText,
     " (",
-    index.h("a", { class: sheet.classes.Link, href: switchUserLink, part: "sqm-link" }, switchUserText),
+    index.h("a", { class: sheet.classes.Link, onClick: onSwitchClick, part: "sqm-link" }, switchUserText),
     ")"));
 }
 
-exports.UserIdentifierView = UserIdentifierView;
+exports.LogoutCurrentUserView = LogoutCurrentUserView;

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

@@ -0,0 +1,62 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-b0129cd6.js');
+const stencilHooks_module = require('./stencil-hooks.module-e4bf7f2d.js');
+const index_module = require('./index.module-4314dfb1.js');
+const cjs = require('./cjs-1066ec21.js');
+require('./JSS-8503a151.js');
+const utils = require('./utils-6847bc06.js');
+const sqmLogoutCurrentUserView = require('./sqm-logout-current-user-view-555c7729.js');
+
+function useLogoutCurrentUser(props) {
+  var _a;
+  const user = index_module.L();
+  const onSwitchClick = () => {
+    index_module.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) {
+    index.registerInstance(this, hostRef);
+    /**
+     * @required
+     * @uiName User identification text
+     */
+    this.userIdentificationText = "{email}";
+    /**
+     * @required
+     * @uiName Switch user button label
+     */
+    this.switchUserText = "not you?";
+    stencilHooks_module.h$1(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const props = index_module.isDemo()
+      ? useDemoLogoutCurrentUser(this)
+      : useLogoutCurrentUser(utils.getProps(this));
+    const content = {
+      userIdentificationText: this.userIdentificationText,
+      switchUserText: this.switchUserText,
+    };
+    return index.h(sqmLogoutCurrentUserView.LogoutCurrentUserView, Object.assign({}, props, content));
+  }
+};
+function useDemoLogoutCurrentUser(props) {
+  return cjs.cjs({
+    onSwitchClick: () => index_module.setUserIdentity(undefined),
+    filledInEmailText: "john@example.com",
+    switchUserText: props.switchUserText,
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+}
+
+exports.sqm_logout_current_user = LogoutCurrentUser;

package/dist/cjs/{sqm-navigation-sidebar-item-view-c39b695c.js → sqm-navigation-sidebar-item-view-f66a1735.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 const index = require('./index-b0129cd6.js');
-const index_module = require('./index.module-f6afc139.js');
+const index_module = require('./index.module-4314dfb1.js');
 const mixins = require('./mixins-fe9d4112.js');
 const JSS = require('./JSS-8503a151.js');
 
@@ -33,13 +33,13 @@ function NavigationSidebarItemView(props) {
   };
   const sheet = JSS.createStyleSheet(style);
   const styleString = sheet.toString();
-  return (index.h("a", { part: "sqm-navigation-item-link", href: data.path, onClick: (e) => {
+  return (index.h("a", { part: "sqm-link", href: data.path, onClick: (e) => {
       e.preventDefault();
-      index_module.gn.push(data.path);
+      index_module.pn.push(data.path);
     }, class: sheet.classes.ItemContainer },
     index.h("style", { type: "text/css" }, styleString),
     index.h("sl-icon", { class: sheet.classes.Icon, name: data.icon }),
-    index.h("p", { class: sheet.classes.Label, part: "sqm-navigation-item-label" }, data.label)));
+    index.h("p", { class: sheet.classes.Label, part: "sqm-label" }, data.label)));
 }
 
 exports.NavigationSidebarItemView = NavigationSidebarItemView;

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

@@ -4,16 +4,15 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-e4bf7f2d.js');
-require('./use-callback-86e9ac75.js');
-const index_module = require('./index.module-f6afc139.js');
+const index_module = require('./index.module-4314dfb1.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./mixins-fe9d4112.js');
 require('./JSS-8503a151.js');
 const utils = require('./utils-6847bc06.js');
-const sqmNavigationSidebarItemView = require('./sqm-navigation-sidebar-item-view-c39b695c.js');
+const sqmNavigationSidebarItemView = require('./sqm-navigation-sidebar-item-view-f66a1735.js');
 
 function useNavigationSidebarItem(props) {
-  const currentPage = index_module.mn();
+  const currentPage = index_module.vn();
   return {
     states: {
       active: currentPage.pathname === props.path,

package/dist/cjs/{sqm-navigation-sidebar-view-b830e8d8.js → sqm-navigation-sidebar-view-dd53f947.js}

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

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

@@ -4,9 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-e4bf7f2d.js');
-require('./use-callback-86e9ac75.js');
-const index_module = require('./index.module-f6afc139.js');
-const sqmNavigationSidebarView = require('./sqm-navigation-sidebar-view-b830e8d8.js');
+const index_module = require('./index.module-4314dfb1.js');
+const sqmNavigationSidebarView = require('./sqm-navigation-sidebar-view-dd53f947.js');
 
 const NavigationSidebar = class {
   constructor(hostRef) {
@@ -21,7 +20,7 @@ const NavigationSidebar = class {
   }
 };
 function useNavigationSidebar() {
-  const location = index_module.mn();
+  const location = index_module.vn();
   const programId = index_module.O();
   const [checked, setChecked] = stencilHooks_module.useState(false);
   // Close hamburger menu after navigation

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

@@ -4,12 +4,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-e4bf7f2d.js');
-require('./use-callback-86e9ac75.js');
-const index_module = require('./index.module-f6afc139.js');
+const index_module = require('./index.module-4314dfb1.js');
 const cjs = require('./cjs-1066ec21.js');
 const mixins = require('./mixins-fe9d4112.js');
 const JSS = require('./JSS-8503a151.js');
-const useRegistrationFormState = require('./useRegistrationFormState-99160dad.js');
+const useRegistrationFormState = require('./useRegistrationFormState-67c0b5ff.js');
 
 var constants = {
   error: {
@@ -489,7 +488,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 (index.h("div", { class: sheet$1.classes.InputContainer, part: "sqm-password-field-container" },
+  return (index.h("div", { class: sheet$1.classes.InputContainer, part: "sqm-base" },
     index.h("style", { type: "text/css" },
       vanillaStyle,
       styleString$1),
@@ -538,12 +537,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;
     stencilHooks_module.h$1(this);