@saasquatch/mint-components 1.3.3-5 → 1.3.3-6

package/dist/esm/sqm-portal-protected-route.entry.js

@@ -1,61 +1,61 @@
 import { r as registerInstance, h as h$1, c as Host } from './index-17b4da69.js';
 import { e as useEffect, m as h } from './extends-3a3f9fe2.js';
 import './use-callback-b38a1523.js';
-import { T, c as an, r as rn, j } from './index.module-c4098674.js';
+import { T, c as an, r as rn, j } from './index.module-9b5bb6a2.js';
 
-function usePortalProtectedRoute({ requireEmailVerification, redirectTo, redirectToUnverified, }) {
-  var _a;
-  const userIdent = T();
-  const authenticated = !!(userIdent === null || userIdent === void 0 ? void 0 : userIdent.jwt);
-  const emailVerified = (_a = userIdent === null || userIdent === void 0 ? void 0 : userIdent.managedIdentity) === null || _a === void 0 ? void 0 : _a.emailVerified;
-  const { pathname, search } = an();
-  const nextPageParam = new URLSearchParams();
-  nextPageParam.append("nextPage", `${pathname}${search}`);
-  useEffect(() => {
-    if (!authenticated) {
-      return rn.push({
-        pathname: redirectTo,
-        search: "?" + nextPageParam.toString(),
-      });
-    }
-    if (requireEmailVerification && !emailVerified) {
-      return rn.push({
-        pathname: redirectToUnverified || redirectTo,
-        search: "?" + nextPageParam.toString(),
-      });
-    }
-  }, []);
-  return !!userIdent;
+function usePortalProtectedRoute({ requireEmailVerification, redirectTo, redirectToUnverified, }) {
+  var _a;
+  const userIdent = T();
+  const authenticated = !!(userIdent === null || userIdent === void 0 ? void 0 : userIdent.jwt);
+  const emailVerified = (_a = userIdent === null || userIdent === void 0 ? void 0 : userIdent.managedIdentity) === null || _a === void 0 ? void 0 : _a.emailVerified;
+  const { pathname, search } = an();
+  const nextPageParam = new URLSearchParams();
+  nextPageParam.append("nextPage", `${pathname}${search}`);
+  useEffect(() => {
+    if (!authenticated) {
+      return rn.push({
+        pathname: redirectTo,
+        search: "?" + nextPageParam.toString(),
+      });
+    }
+    if (requireEmailVerification && !emailVerified) {
+      return rn.push({
+        pathname: redirectToUnverified || redirectTo,
+        search: "?" + nextPageParam.toString(),
+      });
+    }
+  }, []);
+  return !!userIdent;
 }
 
-const PortalProtectedRoute = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.ignored = true;
-    /**
-     * @uiName Redirect Path
-     */
-    this.redirectTo = "/";
-    /**
-     * @uiName Require Email Verification
-     */
-    this.requireEmailVerification = false;
-    /**
-     * @uiName Redirect unverified users path
-     */
-    this.redirectToUnverified = "/emailVerification";
-    h(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const hasUser = j()
-      ? usePortalProtectedRouteDemo()
-      : usePortalProtectedRoute(this);
-    return (h$1(Host, { style: { display: hasUser ? "contents" : "none" } }, h$1("slot", null)));
-  }
-};
-function usePortalProtectedRouteDemo({}) {
-  return true;
+const PortalProtectedRoute = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.ignored = true;
+    /**
+     * @uiName Redirect Path
+     */
+    this.redirectTo = "/";
+    /**
+     * @uiName Require Email Verification
+     */
+    this.requireEmailVerification = false;
+    /**
+     * @uiName Redirect unverified users path
+     */
+    this.redirectToUnverified = "/emailVerification";
+    h(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const hasUser = j()
+      ? usePortalProtectedRouteDemo()
+      : usePortalProtectedRoute(this);
+    return (h$1(Host, { style: { display: hasUser ? "contents" : "none" } }, h$1("slot", null)));
+  }
+};
+function usePortalProtectedRouteDemo({}) {
+  return true;
 }
 
 export { PortalProtectedRoute as sqm_portal_protected_route };

package/dist/esm/{sqm-portal-reset-password-view-e36b91dd.js → sqm-portal-reset-password-view-a4e50da2.js}

@@ -1,80 +1,80 @@
 import { h } from './index-17b4da69.js';
 import { j as jss, c as create } from './jss-preset-default.esm-71fae192.js';
-import { A as AuthWrapper, a as AuthColumn, b as AuthButtonsContainer } from './mixins-eba86511.js';
-import { T as TextSpanView } from './sqm-text-span-view-db65d1ea.js';
+import { A as AuthWrapper, a as AuthColumn, b as AuthButtonsContainer } from './mixins-10353a39.js';
+import { T as TextSpanView } from './sqm-text-span-view-1781df94.js';
 
-const style = {
-  Wrapper: AuthWrapper,
-  Column: AuthColumn,
-  ButtonsContainer: AuthButtonsContainer,
-  Banner: {
-    "&::part(erroralert-base)": {
-      margin: "15px 0px",
-    },
-  },
-  CodeError: {
-    "&::part(erroralert-base)": {
-      "margin-bottom": "15px",
-    },
-  },
-  CodeSuccess: {
-    "&::part(successalert-base)": {
-      "margin-bottom": "15px",
-    },
-  },
-  ContinueButton: {
-    width: "100%",
-  },
-};
-const vanillaStyle = `
-:host {
-  display: block;
-}
-:host([hidden]): {
-  display: none;
-}
-`;
-jss.setup(create());
-const sheet = jss.createStyleSheet(style);
-const styleString = sheet.toString();
-function PortalResetPasswordView(props) {
-  const { states, callbacks } = props;
-  if (states.reset) {
-    return (h("div", { class: `${sheet.classes.Wrapper} ${sheet.classes.Column}` },
-      h("style", { type: "text/css" }, styleString),
-      h(TextSpanView, { type: "h3" }, states.content.resetPasswordHeader),
-      h("sqm-form-message", { class: sheet.classes.CodeSuccess, exportparts: "success-icon" },
-        h("div", { part: "successalert-text" }, "Your password has been reset and you are being redirected. If you are not redirected, please click Continue.")),
-      h("div", null,
-        h("sl-button", { class: sheet.classes.ContinueButton, onClick: callbacks.gotoNextPage, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, states.content.continueButtonText))));
-  }
-  if (states.oobCodeValidating) {
-    return h("div", null);
-  }
-  if (!states.oobCodeValid) {
-    return (h("div", { class: `${sheet.classes.Wrapper} ${sheet.classes.Column}` },
-      h("style", { type: "text/css" }, styleString),
-      h("sqm-form-message", { class: sheet.classes.CodeError, type: "error", exportparts: "erroralert-icon" },
-        h("div", { part: "erroralert-text" }, "The password reset code is invalid or has expired, please try again.")),
-      h("div", null,
-        h("sl-button", { class: sheet.classes.ContinueButton, onClick: callbacks.failed, exportparts: "base: primarybutton-base", type: "primary" }, states.content.continueButtonText))));
-  }
-  return (h("div", { class: sheet.classes.Wrapper },
-    h("style", { type: "text/css" },
-      vanillaStyle,
-      styleString),
-    h(TextSpanView, { type: "h2" }, states.reset
-      ? states.content.passwordResetHeader
-      : states.content.resetPasswordHeader),
-    h("sl-form", { class: sheet.classes.Column, "onSl-submit": callbacks.submit },
-      props.states.error && (h("sqm-form-message", { type: "error", class: sheet.classes.Banner, exportparts: "erroralert-icon" },
-        h("div", { part: "erroralert-text" }, props.states.error))),
-      !states.reset && (h("sqm-password-field", { fieldLabel: states.content.passwordFieldLabel, demoData: states.passwordDemoData })),
-      !states.reset && states.confirmPassword && (h("sl-input", { exportparts: "label: input-label", type: "password", name: "/confirmPassword", label: states.content.confirmPasswordFieldLabel, disabled: states.loading, required: true })),
-      h("div", { class: sheet.classes.ButtonsContainer },
-        h("sl-button", { class: sheet.classes.ContinueButton, submit: true, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, states.reset
-          ? states.content.continueButtonText
-          : states.content.resetPasswordButtonText)))));
+const style = {
+  Wrapper: AuthWrapper,
+  Column: AuthColumn,
+  ButtonsContainer: AuthButtonsContainer,
+  Banner: {
+    "&::part(erroralert-base)": {
+      margin: "15px 0px",
+    },
+  },
+  CodeError: {
+    "&::part(erroralert-base)": {
+      "margin-bottom": "15px",
+    },
+  },
+  CodeSuccess: {
+    "&::part(successalert-base)": {
+      "margin-bottom": "15px",
+    },
+  },
+  ContinueButton: {
+    width: "100%",
+  },
+};
+const vanillaStyle = `
+:host {
+  display: block;
+}
+:host([hidden]): {
+  display: none;
+}
+`;
+jss.setup(create());
+const sheet = jss.createStyleSheet(style);
+const styleString = sheet.toString();
+function PortalResetPasswordView(props) {
+  const { states, callbacks } = props;
+  if (states.reset) {
+    return (h("div", { class: `${sheet.classes.Wrapper} ${sheet.classes.Column}` },
+      h("style", { type: "text/css" }, styleString),
+      h(TextSpanView, { type: "h3" }, states.content.resetPasswordHeader),
+      h("sqm-form-message", { class: sheet.classes.CodeSuccess, exportparts: "success-icon" },
+        h("div", { part: "successalert-text" }, "Your password has been reset and you are being redirected. If you are not redirected, please click Continue.")),
+      h("div", null,
+        h("sl-button", { class: sheet.classes.ContinueButton, onClick: callbacks.gotoNextPage, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, states.content.continueButtonText))));
+  }
+  if (states.oobCodeValidating) {
+    return h("div", null);
+  }
+  if (!states.oobCodeValid) {
+    return (h("div", { class: `${sheet.classes.Wrapper} ${sheet.classes.Column}` },
+      h("style", { type: "text/css" }, styleString),
+      h("sqm-form-message", { class: sheet.classes.CodeError, type: "error", exportparts: "erroralert-icon" },
+        h("div", { part: "erroralert-text" }, "The password reset code is invalid or has expired, please try again.")),
+      h("div", null,
+        h("sl-button", { class: sheet.classes.ContinueButton, onClick: callbacks.failed, exportparts: "base: primarybutton-base", type: "primary" }, states.content.continueButtonText))));
+  }
+  return (h("div", { class: sheet.classes.Wrapper },
+    h("style", { type: "text/css" },
+      vanillaStyle,
+      styleString),
+    h(TextSpanView, { type: "h2" }, states.reset
+      ? states.content.passwordResetHeader
+      : states.content.resetPasswordHeader),
+    h("sl-form", { class: sheet.classes.Column, "onSl-submit": callbacks.submit },
+      props.states.error && (h("sqm-form-message", { type: "error", class: sheet.classes.Banner, exportparts: "erroralert-icon" },
+        h("div", { part: "erroralert-text" }, props.states.error))),
+      !states.reset && (h("sqm-password-field", { fieldLabel: states.content.passwordFieldLabel, demoData: states.passwordDemoData })),
+      !states.reset && states.confirmPassword && (h("sl-input", { exportparts: "label: input-label", type: "password", name: "/confirmPassword", label: states.content.confirmPasswordFieldLabel, disabled: states.loading, required: true })),
+      h("div", { class: sheet.classes.ButtonsContainer },
+        h("sl-button", { class: sheet.classes.ContinueButton, submit: true, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, states.reset
+          ? states.content.continueButtonText
+          : states.content.resetPasswordButtonText)))));
 }
 
 export { PortalResetPasswordView as P };

package/dist/esm/sqm-portal-reset-password.entry.js

@@ -1,169 +1,165 @@
 import { r as registerInstance, h as h$1 } from './index-17b4da69.js';
 import { j as useState, e as useEffect, m as h } from './extends-3a3f9fe2.js';
 import './use-callback-b38a1523.js';
-import { i as Re, $ as $e, r as rn, j } from './index.module-c4098674.js';
+import { i as Re, $ as $e, r as rn, j } from './index.module-9b5bb6a2.js';
 import { j as jsonpointer } from './jsonpointer-388a7082.js';
 import './jss-preset-default.esm-71fae192.js';
 import { c as cjs } from './cjs-bdfb4486.js';
-import './mixins-eba86511.js';
-import './sqm-text-span-view-db65d1ea.js';
-import { P as PortalResetPasswordView } from './sqm-portal-reset-password-view-e36b91dd.js';
+import './mixins-10353a39.js';
+import './sqm-text-span-view-1781df94.js';
+import { P as PortalResetPasswordView } from './sqm-portal-reset-password-view-a4e50da2.js';
 
-function usePortalResetPassword(props) {
-  var _a, _b, _c, _d, _e, _f;
-  const [reset, setReset] = useState(false);
-  const [error, setError] = useState("");
-  const [verifyPasswordResetCode, verifyPasswordResetCodeState] = Re();
-  const [resetPassword, resetPasswordState] = $e();
-  const urlParams = new URLSearchParams(window.location.search);
-  const oobCode = urlParams.get("oobCode");
-  urlParams.delete("oobCode");
-  const nextPageOverride = urlParams.get("nextPage");
-  const submit = async (event) => {
-    setError("");
-    let formData = event.detail.formData;
-    formData === null || formData === void 0 ? void 0 : formData.forEach((value, key) => {
-      jsonpointer.set(formData, key, value);
-    });
-    const variables = { oobCode, password: formData.password };
-    if (formData.password !== formData.confirmPassword) {
-      setError("Passwords do not match.");
-      return;
-    }
-    await resetPassword(variables);
-  };
-  const gotoNextPage = () => {
-    urlParams.delete("nextPage");
-    rn.push({
-      pathname: nextPageOverride || props.nextPage,
-      search: urlParams.toString() && "?" + urlParams.toString(),
-    });
-  };
-  const failed = () => {
-    rn.push({
-      pathname: props.failedPage,
-      search: urlParams.toString() && "?" + urlParams.toString(),
-    });
-  };
-  useEffect(() => {
-    var _a;
-    if ((_a = resetPasswordState.data) === null || _a === void 0 ? void 0 : _a.resetManagedIdentityPassword) {
-      setReset(true);
-      setTimeout(() => {
-        gotoNextPage();
-      }, 5000);
-    }
-  }, [(_a = resetPasswordState.data) === null || _a === void 0 ? void 0 : _a.resetManagedIdentityPassword]);
-  useEffect(() => {
-    verifyPasswordResetCode({ oobCode });
-  }, [oobCode]);
-  useEffect(() => {
-    var _a;
-    if ((_a = verifyPasswordResetCodeState === null || verifyPasswordResetCodeState === void 0 ? void 0 : verifyPasswordResetCodeState.errors) === null || _a === void 0 ? void 0 : _a.message) {
-      setError("Network request failed.");
-    }
-  }, [verifyPasswordResetCodeState === null || verifyPasswordResetCodeState === void 0 ? void 0 : verifyPasswordResetCodeState.errors]);
-  return {
-    states: {
-      loading: resetPasswordState.loading,
-      reset,
-      confirmPassword: props.confirmPassword,
-      error: ((_e = (_d = (_c = (_b = resetPasswordState.errors) === null || _b === void 0 ? void 0 : _b.response) === null || _c === void 0 ? void 0 : _c.errors) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.message) || error,
-      oobCodeValidating: verifyPasswordResetCodeState.loading,
-      oobCodeValid: (_f = verifyPasswordResetCodeState.data) === null || _f === void 0 ? void 0 : _f.verifyManagedIdentityPasswordResetCode.success,
-      content: {
-        passwordResetHeader: props.passwordResetHeader,
-        resetPasswordHeader: props.resetPasswordHeader,
-        continueButtonText: props.continueButtonText,
-        resetPasswordButtonText: props.resetPasswordButtonText,
-        confirmPasswordFieldLabel: props.confirmPasswordFieldLabel,
-        passwordFieldLabel: props.passwordFieldLabel,
-      },
-    },
-    callbacks: { submit, failed, gotoNextPage },
-  };
+function usePortalResetPassword(props) {
+  var _a, _b, _c, _d, _e, _f;
+  const [reset, setReset] = useState(false);
+  const [error, setError] = useState("");
+  const [verifyPasswordResetCode, verifyPasswordResetCodeState] = Re();
+  const [resetPassword, resetPasswordState] = $e();
+  const urlParams = new URLSearchParams(window.location.search);
+  const oobCode = urlParams.get("oobCode");
+  urlParams.delete("oobCode");
+  const nextPageOverride = urlParams.get("nextPage");
+  const submit = async (event) => {
+    setError("");
+    let formData = event.detail.formData;
+    formData === null || formData === void 0 ? void 0 : formData.forEach((value, key) => {
+      jsonpointer.set(formData, key, value);
+    });
+    const variables = { oobCode, password: formData.password };
+    if (formData.password !== formData.confirmPassword) {
+      setError("Passwords do not match.");
+      return;
+    }
+    await resetPassword(variables);
+  };
+  const gotoNextPage = () => {
+    urlParams.delete("nextPage");
+    rn.push({
+      pathname: nextPageOverride || props.nextPage,
+      search: urlParams.toString() && "?" + urlParams.toString(),
+    });
+  };
+  const failed = () => {
+    rn.push({
+      pathname: "/",
+      search: urlParams.toString() && "?" + urlParams.toString(),
+    });
+  };
+  useEffect(() => {
+    var _a;
+    if ((_a = resetPasswordState.data) === null || _a === void 0 ? void 0 : _a.resetManagedIdentityPassword) {
+      setReset(true);
+      setTimeout(() => {
+        gotoNextPage();
+      }, 5000);
+    }
+  }, [(_a = resetPasswordState.data) === null || _a === void 0 ? void 0 : _a.resetManagedIdentityPassword]);
+  useEffect(() => {
+    verifyPasswordResetCode({ oobCode });
+  }, [oobCode]);
+  useEffect(() => {
+    var _a;
+    if ((_a = verifyPasswordResetCodeState === null || verifyPasswordResetCodeState === void 0 ? void 0 : verifyPasswordResetCodeState.errors) === null || _a === void 0 ? void 0 : _a.message) {
+      setError("Network request failed.");
+    }
+  }, [verifyPasswordResetCodeState === null || verifyPasswordResetCodeState === void 0 ? void 0 : verifyPasswordResetCodeState.errors]);
+  return {
+    states: {
+      loading: resetPasswordState.loading,
+      reset,
+      confirmPassword: props.confirmPassword,
+      error: ((_e = (_d = (_c = (_b = resetPasswordState.errors) === null || _b === void 0 ? void 0 : _b.response) === null || _c === void 0 ? void 0 : _c.errors) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.message) || error,
+      oobCodeValidating: verifyPasswordResetCodeState.loading,
+      oobCodeValid: (_f = verifyPasswordResetCodeState.data) === null || _f === void 0 ? void 0 : _f.verifyManagedIdentityPasswordResetCode.success,
+      content: {
+        passwordResetHeader: props.passwordResetHeader,
+        resetPasswordHeader: props.resetPasswordHeader,
+        continueButtonText: props.continueButtonText,
+        resetPasswordButtonText: props.resetPasswordButtonText,
+        confirmPasswordFieldLabel: props.confirmPasswordFieldLabel,
+        passwordFieldLabel: props.passwordFieldLabel,
+      },
+    },
+    callbacks: { submit, failed, gotoNextPage },
+  };
 }
 
-const PortalResetPassword = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.ignored = true;
-    /**
-     * @uiName Next page path
-     */
-    this.nextPage = "/";
-    /**
-     * @uiName Failed page path
-     */
-    this.failedPage = "/";
-    /**
-     * @uiName Show confirm password
-     */
-    this.confirmPassword = false;
-    /**
-     * @uiName Password reset header text
-     */
-    this.resetPasswordHeader = "Reset your password";
-    /**
-     * Displayed after a successful password reset
-     *
-     * @uiName Password reset header text
-     */
-    this.passwordResetHeader = "Password reset";
-    /**
-     * @uiName Password reset button text
-     */
-    this.resetPasswordButtonText = "Reset Password";
-    /**
-     * Displayed after a successful password reset
-     *
-     * @uiName Continue button text
-     */
-    this.continueButtonText = "Continue";
-    /**
-     * @uiName Confirm password field label
-     */
-    this.confirmPasswordFieldLabel = "Confirm Password";
-    /**
-     * @uiName Password field label
-     */
-    this.passwordFieldLabel = "New Password";
-    h(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const { states, callbacks } = j()
-      ? usePortalResetPasswordDemo(this)
-      : usePortalResetPassword(this);
-    return h$1(PortalResetPasswordView, { states: states, callbacks: callbacks });
-  }
-};
-function usePortalResetPasswordDemo(props) {
-  return cjs({
-    states: {
-      error: "",
-      loading: false,
-      reset: false,
-      confirmPassword: true,
-      oobCodeValidating: false,
-      oobCodeValid: true,
-      content: {
-        passwordResetHeader: "Password reset",
-        resetPasswordHeader: "Reset your password",
-        continueButtonText: "Continue",
-        resetPasswordButtonText: "Reset Password",
-        confirmPasswordFieldLabel: "Confirm Password",
-        passwordFieldLabel: "New Password",
-      },
-    },
-    callbacks: {
-      submit: async (_event) => {
-        console.log("submit");
-      },
-      failed: () => { },
-      gotoNextPage: () => { },
-    },
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+const PortalResetPassword = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.ignored = true;
+    /**
+     * @uiName Next page path
+     */
+    this.nextPage = "/";
+    /**
+     * @uiName Show confirm password
+     */
+    this.confirmPassword = false;
+    /**
+     * @uiName Password reset header text
+     */
+    this.resetPasswordHeader = "Reset your password";
+    /**
+     * Displayed after a successful password reset
+     *
+     * @uiName Password reset header text
+     */
+    this.passwordResetHeader = "Password reset";
+    /**
+     * @uiName Password reset button text
+     */
+    this.resetPasswordButtonText = "Reset Password";
+    /**
+     * Displayed after a successful password reset
+     *
+     * @uiName Continue button text
+     */
+    this.continueButtonText = "Continue";
+    /**
+     * @uiName Confirm password field label
+     */
+    this.confirmPasswordFieldLabel = "Confirm Password";
+    /**
+     * @uiName Password field label
+     */
+    this.passwordFieldLabel = "New Password";
+    h(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const { states, callbacks } = j()
+      ? usePortalResetPasswordDemo(this)
+      : usePortalResetPassword(this);
+    return h$1(PortalResetPasswordView, { states: states, callbacks: callbacks });
+  }
+};
+function usePortalResetPasswordDemo(props) {
+  return cjs({
+    states: {
+      error: "",
+      loading: false,
+      reset: false,
+      confirmPassword: true,
+      oobCodeValidating: false,
+      oobCodeValid: true,
+      content: {
+        passwordResetHeader: "Password reset",
+        resetPasswordHeader: "Reset your password",
+        continueButtonText: "Continue",
+        resetPasswordButtonText: "Reset Password",
+        confirmPasswordFieldLabel: "Confirm Password",
+        passwordFieldLabel: "New Password",
+      },
+    },
+    callbacks: {
+      submit: async (_event) => {
+        console.log("submit");
+      },
+      failed: () => { },
+      gotoNextPage: () => { },
+    },
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
 
 export { PortalResetPassword as sqm_portal_reset_password };

package/dist/esm/{sqm-portal-section-view-17ebaaf1.js → sqm-portal-section-view-f0876545.js}

@@ -1,26 +1,26 @@
 import { h } from './index-17b4da69.js';
 import { j as jss, c as create } from './jss-preset-default.esm-71fae192.js';
 
-function PortalSectionView(props) {
-  const style = {
-    LabelContainer: {
-      "margin-bottom": props.labelMargin === "none"
-        ? props.labelMargin
-        : `var(--sl-spacing-${props.labelMargin})`,
-    },
-    SectionContainer: {
-      padding: props.padding === "none"
-        ? "0"
-        : `var(--sl-spacing-${props.padding})`,
-    },
-  };
-  jss.setup(create());
-  const sheet = jss.createStyleSheet(style);
-  const styleString = sheet.toString();
-  return (h("div", { class: sheet.classes.SectionContainer },
-    h("style", { type: "text/css" }, styleString),
-    h("div", { class: sheet.classes.LabelContainer }, props.label),
-    props.content));
+function PortalSectionView(props) {
+  const style = {
+    LabelContainer: {
+      "margin-bottom": props.labelMargin === "none"
+        ? props.labelMargin
+        : `var(--sl-spacing-${props.labelMargin})`,
+    },
+    SectionContainer: {
+      padding: props.padding === "none"
+        ? "0"
+        : `var(--sl-spacing-${props.padding})`,
+    },
+  };
+  jss.setup(create());
+  const sheet = jss.createStyleSheet(style);
+  const styleString = sheet.toString();
+  return (h("div", { class: sheet.classes.SectionContainer },
+    h("style", { type: "text/css" }, styleString),
+    h("div", { class: sheet.classes.LabelContainer }, props.label),
+    props.content));
 }
 
 export { PortalSectionView as P };