@saasquatch/mint-components 1.12.1-7 → 1.12.1-9

package/dist/cjs/sqm-portal-registration-form-view-0502824e.js

@@ -1,87 +0,0 @@
-'use strict';
-
-const index = require('./index-3cf5ef3d.js');
-const JSS = require('./JSS-8503a151.js');
-const mixins = require('./mixins-f7e0377a.js');
-const sqmTextSpanView = require('./sqm-text-span-view-a22f50aa.js');
-
-const style = {
-  Wrapper: { ...mixins.AuthWrapper, "max-width": "600px" },
-  Column: mixins.AuthColumn,
-  HostBlock: mixins.HostBlock,
-  ":host": {
-    margin: "0 auto",
-    width: "100%",
-  },
-  ButtonsContainer: mixins.AuthButtonsContainer,
-  ErrorStyle: mixins.ErrorStyles,
-};
-const vanillaStyle = `
-sqm-portal-register {
-  margin: 0 auto;
-  width: 100%;
-  display: block;
-}
-
-:host{
-  display: block;
-}
-
-:host([hidden]) {
-  display: none;
-}
-`;
-const sheet = JSS.createStyleSheet(style);
-const styleString = sheet.toString();
-function PortalRegistrationFormView(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
-  const { states, refs, callbacks, content } = props;
-  if (states.error) {
-    window.scrollTo({ top: 0, left: 0, behavior: "smooth" });
-  }
-  return (index.h("div", { class: sheet.classes.Wrapper, part: "sqm-base" },
-    index.h("style", { type: "text/css" },
-      vanillaStyle,
-      styleString),
-    index.h(sqmTextSpanView.TextSpanView, { type: "h3" }, content.pageLabel),
-    index.h("sl-form", { class: sheet.classes.Column, "onSl-submit": callbacks.submit, ref: (el) => (refs.formRef.current = el), novalidate: true },
-      ((_a = states.registrationFormState) === null || _a === void 0 ? void 0 : _a.disabled) ? (index.h("sqm-form-message", { type: "error", exportparts: "erroralert-icon" },
-        index.h("div", { part: "erroralert-text" }, states.registrationFormState.disabledMessage))) : (states.error && (index.h("sqm-form-message", { type: "error", exportparts: "erroralert-icon" },
-        index.h("div", { part: "erroralert-text" }, props.states.error)))),
-      states.showNameFields && index.h("sqm-name-fields", null),
-      !states.hideInputs && (index.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", type: "email", name: "/email", label: content.emailLabel || "Email", disabled: true, required: true, validationError: ({ value }) => {
-          if (!value) {
-            return content.requiredFieldErrorMessage;
-          }
-          // this matches shoelace validation, but could be better
-          if (!value.includes("@")) {
-            return content.invalidEmailErrorMessage;
-          }
-        } }, (((_c = (_b = states.registrationFormState) === null || _b === void 0 ? void 0 : _b.initialData) === null || _c === void 0 ? void 0 : _c.email) ? {
-        value: (_e = (_d = states.registrationFormState) === null || _d === void 0 ? void 0 : _d.initialData) === null || _e === void 0 ? void 0 : _e.email,
-      }
-        : {}), (((_g = (_f = states.registrationFormState) === null || _f === void 0 ? void 0 : _f.validationErrors) === null || _g === void 0 ? void 0 : _g.email) ? {
-        class: sheet.classes.ErrorStyle,
-        helpText: ((_j = (_h = states.registrationFormState) === null || _h === void 0 ? void 0 : _h.validationErrors) === null || _j === void 0 ? void 0 : _j.email) ||
-          content.requiredFieldErrorMessage,
-      }
-        : [])))),
-      !(states.hideInputs || states.hidePasswords) && (index.h("sqm-password-field", { fieldLabel: content.passwordLabel, "disable-validation": !states.enablePasswordValidation, meetsRequirementsText: content.meetsRequirementsText, doesNotMeetRequirementsText: content.doesNotMeetRequirementsText, minErrorText: content.minErrorText, uppercaseErrorText: content.uppercaseErrorText, lowercaseErrorText: content.lowercaseErrorText, hasErrorText: content.hasErrorText })),
-      content.passwordField,
-      !(states.hideInputs || states.hidePasswords) &&
-        states.confirmPassword && (index.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", type: "password", name: "/confirmPassword", label: content.confirmPasswordLabel, disabled: states.loading || ((_k = states.registrationFormState) === null || _k === void 0 ? void 0 : _k.disabled), required: true }, (((_m = (_l = states.registrationFormState) === null || _l === void 0 ? void 0 : _l.initialData) === null || _m === void 0 ? void 0 : _m.confirmPassword) ? {
-        value: (_p = (_o = states.registrationFormState) === null || _o === void 0 ? void 0 : _o.initialData) === null || _p === void 0 ? void 0 : _p.confirmPassword,
-      }
-        : {}), (((_r = (_q = states.registrationFormState) === null || _q === void 0 ? void 0 : _q.validationErrors) === null || _r === void 0 ? void 0 : _r.confirmPassword) ? {
-        class: sheet.classes.ErrorStyle,
-        helpText: ((_t = (_s = states.registrationFormState) === null || _s === void 0 ? void 0 : _s.validationErrors) === null || _t === void 0 ? void 0 : _t.confirmPassword) || content.requiredFieldErrorMessage,
-      }
-        : [])))),
-      content.formData,
-      content.terms,
-      index.h("div", { class: sheet.classes.ButtonsContainer },
-        index.h("sl-button", { submit: true, loading: states.loading, disabled: (_u = states.registrationFormState) === null || _u === void 0 ? void 0 : _u.disabled, exportparts: "base: primarybutton-base", type: "primary" }, content.submitLabel || "Register"),
-        content.secondaryButton))));
-}
-
-exports.PortalRegistrationFormView = PortalRegistrationFormView;

package/dist/cjs/usePortalRegistrationForm-16151c0c.js

@@ -1,214 +0,0 @@
-'use strict';
-
-const stencilHooks_module = require('./stencil-hooks.module-ece1ee46.js');
-const index_module = require('./index.module-ccf9bd9c.js');
-const jsonpointer = require('./jsonpointer-11327262.js');
-const useRegistrationFormState = require('./useRegistrationFormState-5911d016.js');
-const AsYouType = require('./AsYouType-6788393a.js');
-
-const RegistrationFormQuery = index_module.dist.gql `
-  query RegistrationFormQuery($key: String!) {
-    form(key: $key) {
-      key
-      type
-      initialData {
-        initialData
-        isEnabled
-        isEnabledErrorMessage
-      }
-    }
-  }
-`;
-function usePortalRegistrationForm(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-  const formRef = stencilHooks_module.useRef(null);
-  const locale = index_module.Q();
-  const { registrationFormState, setRegistrationFormState } = useRegistrationFormState.useRegistrationFormState({});
-  const [request, { loading, errors, data, formError }] = index_module.Te();
-  const queryResponse = index_module.En(RegistrationFormQuery, { key: props.formKey });
-  const formLoading = loading || queryResponse.loading;
-  stencilHooks_module.useEffect(() => {
-    var _a, _b, _c;
-    const initialData = (_a = queryResponse === null || queryResponse === void 0 ? void 0 : queryResponse.data) === null || _a === void 0 ? void 0 : _a.form.initialData.initialData;
-    const disabled = ((_b = queryResponse === null || queryResponse === void 0 ? void 0 : queryResponse.data) === null || _b === void 0 ? void 0 : _b.form.initialData.isEnabled) === false;
-    const disabledMessage = ((_c = queryResponse === null || queryResponse === void 0 ? void 0 : queryResponse.data) === null || _c === void 0 ? void 0 : _c.form.initialData.isEnabledErrorMessage) ||
-      props.formDisabledErrorMessage;
-    const formState = {
-      loading: formLoading,
-      disabled,
-      disabledMessage,
-      initialData,
-    };
-    setRegistrationFormState(formState);
-  }, [(_a = queryResponse === null || queryResponse === void 0 ? void 0 : queryResponse.data) === null || _a === void 0 ? void 0 : _a.form.initialData]);
-  stencilHooks_module.useEffect(() => {
-    if (!formRef.current)
-      return;
-    const form = formRef.current;
-    form.addEventListener("sl-input", inputFunction);
-    return () => {
-      form.removeEventListener("sl-input", inputFunction);
-    };
-  }, [formRef.current]);
-  const submit = async (event) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
-    let formControls = event.target.getFormControls();
-    let formData = {};
-    let validationErrors = {};
-    formControls === null || formControls === void 0 ? void 0 : formControls.forEach((control) => {
-      if (!control.name)
-        return;
-      const key = control.name;
-      const value = control.value;
-      // control.value = initialData[key] || control.value;
-      jsonpointer.jsonpointer.set(formData, key, value);
-      // required validation
-      if (control.required && !value) {
-        jsonpointer.jsonpointer.set(validationErrors, key, props.requiredFieldErrorMessage);
-      }
-      // custom validation
-      if (typeof control.validationError === "function") {
-        const validate = control.validationError;
-        const validationError = validate({ control, key, value });
-        if (validationError)
-          jsonpointer.jsonpointer.set(validationErrors, key, validationError);
-      }
-    });
-    if ((props.confirmPassword || formData.confirmPassword) &&
-      formData.password !== formData.confirmPassword) {
-      validationErrors = {
-        ...validationErrors,
-        confirmPassword: props.passwordMismatchErrorMessage,
-      };
-    }
-    if (Object.keys(validationErrors).length) {
-      // early return for validation errors
-      setRegistrationFormState({
-        ...registrationFormState,
-        loading: false,
-        error: "",
-        validationErrors,
-      });
-      return;
-    }
-    setRegistrationFormState({
-      ...registrationFormState,
-      loading: true,
-      error: "",
-      validationErrors: {},
-    });
-    const { email, password } = formData;
-    delete formData.email;
-    delete formData.password;
-    delete formData.confirmPassword;
-    const redirectPath = props.redirectPath;
-    const variables = {
-      key: props.formKey,
-      formData: {
-        locale,
-        email,
-        password,
-        redirectPath,
-        ...formData,
-      },
-    };
-    try {
-      const result = await request(variables);
-      if (result instanceof Error) {
-        throw result;
-      }
-      setRegistrationFormState({
-        ...registrationFormState,
-        loading: false,
-        error: "",
-        validationErrors: {},
-      });
-      const managedIdentityResponse = (_a = result.submitForm) === null || _a === void 0 ? void 0 : _a.results.find((result) => { var _a; return ((_a = result === null || result === void 0 ? void 0 : result.formHandler) === null || _a === void 0 ? void 0 : _a.namespace) === "identity"; });
-      if (managedIdentityResponse &&
-        managedIdentityResponse.result.results.length &&
-        managedIdentityResponse.result.results[0].success &&
-        managedIdentityResponse.result.results[0].data.token) {
-        index_module.xn.push(props.nextPage);
-      }
-      else if (
-      // check for blocked email error response
-      ((_b = result.submitForm) === null || _b === void 0 ? void 0 : _b.results.length) === 1 &&
-        ((_f = (_e = (_d = (_c = result.submitForm) === null || _c === void 0 ? void 0 : _c.results[0]) === null || _d === void 0 ? void 0 : _d.result) === null || _e === void 0 ? void 0 : _e.results) === null || _f === void 0 ? void 0 : _f.length) === 1 &&
-        ((_l = (_k = (_j = (_h = (_g = result.submitForm) === null || _g === void 0 ? void 0 : _g.results[0]) === null || _h === void 0 ? void 0 : _h.result) === null || _j === void 0 ? void 0 : _j.results) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l.success) ===
-          false && ((_s = (_r = (_q = (_p = (_o = (_m = result.submitForm) === null || _m === void 0 ? void 0 : _m.results[0]) === null || _o === void 0 ? void 0 : _o.result) === null || _p === void 0 ? void 0 : _p.results) === null || _q === void 0 ? void 0 : _q[0]) === null || _r === void 0 ? void 0 : _r.message) === null || _s === void 0 ? void 0 : _s.startsWith("Blocked email"))) {
-        setRegistrationFormState({
-          ...registrationFormState,
-          loading: false,
-          error: "",
-          validationErrors: {
-            email: props.invalidEmailErrorMessage,
-          },
-        });
-      }
-    }
-    catch (error) {
-      // check for invalid email
-      if ((_t = error === null || error === void 0 ? void 0 : error.message) === null || _t === void 0 ? void 0 : _t.includes("is not a valid email address")) {
-        setRegistrationFormState({
-          ...registrationFormState,
-          loading: false,
-          error: "",
-          validationErrors: { email: props.invalidEmailErrorMessage },
-        });
-      }
-      else {
-        setRegistrationFormState({
-          ...registrationFormState,
-          loading: false,
-          error: props.networkErrorMessage,
-          validationErrors: {},
-        });
-      }
-    }
-  };
-  const inputFunction = index_module.useCallback((e) => {
-    var _a, _b;
-    const name = (_b = (_a = e.target) === null || _a === void 0 ? void 0 : _a.type) === null || _b === void 0 ? void 0 : _b.toLowerCase();
-    if (name !== "tel")
-      return;
-    const asYouType = new AsYouType.AsYouType("US");
-    e.target.value = asYouType.input(e.target.value);
-  }, []);
-  let errorMessage = "";
-  if (((_b = queryResponse === null || queryResponse === void 0 ? void 0 : queryResponse.data) === null || _b === void 0 ? void 0 : _b.form.initialData.isEnabled) === false) {
-    errorMessage =
-      ((_c = queryResponse === null || queryResponse === void 0 ? void 0 : queryResponse.data) === null || _c === void 0 ? void 0 : _c.form.initialData.isEnabledErrorMessage) ||
-        props.formDisabledErrorMessage;
-  }
-  else if ((_d = errors === null || errors === void 0 ? void 0 : errors.response) === null || _d === void 0 ? void 0 : _d["error"]) {
-    errorMessage = props.networkErrorMessage;
-  }
-  else if ((errors === null || errors === void 0 ? void 0 : errors.message) && !((_e = errors === null || errors === void 0 ? void 0 : errors.response) === null || _e === void 0 ? void 0 : _e.errors.length)) {
-    errorMessage = props.networkErrorMessage;
-  }
-  else {
-    errorMessage =
-      formError || ((_j = (_h = (_g = (_f = queryResponse === null || queryResponse === void 0 ? void 0 : queryResponse.errors) === null || _f === void 0 ? void 0 : _f.response) === null || _g === void 0 ? void 0 : _g.errors) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.message) || (registrationFormState === null || registrationFormState === void 0 ? void 0 : registrationFormState.error);
-  }
-  return {
-    states: {
-      loading: loading || queryResponse.loading,
-      error: errorMessage,
-      registrationFormState,
-      confirmPassword: props.confirmPassword,
-      hideInputs: props.hideInputs,
-      showNameFields: props.showNameFields,
-      loginPath: props.loginPath,
-      enablePasswordValidation: !props.disablePasswordValidation,
-    },
-    callbacks: {
-      submit,
-      inputFunction,
-    },
-    refs: {
-      formRef,
-    },
-  };
-}
-
-exports.usePortalRegistrationForm = usePortalRegistrationForm;

package/dist/collection/components/sqm-base-registration/BaseRegistrationForm.stories.js

@@ -1,36 +0,0 @@
-import { h } from "@stencil/core";
-import { BaseRegistrationFormView, } from "./sqm-base-registration-form-view";
-export default {
-  title: "Components/Microsite Base Registration",
-};
-const defaultProps = {
-  states: {
-    error: "",
-  },
-  callbacks: {
-    handleEmailSubmit: () => console.log("Submit!"),
-  },
-  content: {
-    pageLabel: "Register",
-    requiredFieldErrorMessage: "Cannot be empty",
-    invalidEmailErrorMessage: "Must be a valid email address",
-    googleButton: h("sl-button", null, "Register with Google"),
-    secondaryButton: (h("span", null,
-      "Already have an account?",
-      " ",
-      h("sl-button", { padding: "0", style: { width: "60px" }, size: "large", type: "text" }, "Sign in"),
-      " ")),
-  },
-};
-const errorProps = {
-  ...defaultProps,
-  states: {
-    error: "Something went wrong. Please try again.",
-  },
-};
-export const Default = () => {
-  return h(BaseRegistrationFormView, Object.assign({}, defaultProps));
-};
-export const EmailError = () => {
-  return h(BaseRegistrationFormView, Object.assign({}, errorProps));
-};

package/dist/collection/components/sqm-base-registration/sqm-base-registration-form-view.js

@@ -1,63 +0,0 @@
-import { h } from "@stencil/core";
-import { AuthButtonsContainer, AuthColumn, AuthWrapper, ErrorStyles, HostBlock, } from "../../global/mixins";
-import { createStyleSheet } from "../../styling/JSS";
-import { TextSpanView } from "../sqm-text-span/sqm-text-span-view";
-const style = {
-  Wrapper: { ...AuthWrapper, "max-width": "600px" },
-  Column: AuthColumn,
-  HostBlock: HostBlock,
-  ":host": {
-    margin: "0 auto",
-    width: "100%",
-  },
-  ButtonsContainer: {
-    ...AuthButtonsContainer,
-    gap: "var(--sl-spacing-medium)",
-    "& > *": {
-      margin: "0 !important",
-    },
-  },
-  ErrorStyle: ErrorStyles,
-};
-const vanillaStyle = `
-sqm-portal-register {
-  margin: 0 auto;
-  width: 100%;
-  display: block;
-}
-
-:host{
-  display: block;
-}
-
-:host([hidden]) {
-  display: none;
-}
-`;
-const sheet = createStyleSheet(style);
-const styleString = sheet.toString();
-export function BaseRegistrationFormView(props) {
-  const { states, content, callbacks } = props;
-  return (h("div", { class: sheet.classes.Wrapper },
-    h("style", { type: "text/css" },
-      vanillaStyle,
-      styleString),
-    h(TextSpanView, { type: "h3" }, content.pageLabel),
-    h("sl-form", { class: sheet.classes.Column, "onSl-submit": callbacks.handleEmailSubmit, novalidate: true },
-      states.error && (h("sqm-form-message", { type: "error", exportparts: "erroralert-icon" },
-        h("div", { part: "erroralert-text" }, props.states.error))),
-      h("sl-input", { exportparts: "label: input-label, base: input-base", type: "email", name: "/email", label: content.emailLabel || "Email", required: true, validationError: ({ value }) => {
-          if (!value) {
-            return content.requiredFieldErrorMessage;
-          }
-          // this matches shoelace validation, but could be better
-          if (!value.includes("@")) {
-            return content.invalidEmailErrorMessage;
-          }
-        } }),
-      h("div", { class: sheet.classes.ButtonsContainer },
-        h("sl-button", { submit: true, exportparts: "base: primarybutton-base", type: "primary", style: { margin: "0" } }, content.submitLabel || "Register"),
-        h("sl-menu-divider", { style: { margin: "0" } }),
-        content.googleButton,
-        content.secondaryButton))));
-}

package/dist/collection/components/sqm-google-sign-in/sqm-google-sign-in.js

@@ -1,78 +0,0 @@
-import { getEnvironmentSDK } from "@saasquatch/component-boilerplate";
-import { useState, withHooks } from "@saasquatch/stencil-hooks";
-import { useEffect } from "@saasquatch/universal-hooks";
-import { Event, Component, h, Prop } from "@stencil/core";
-/**
- * @uiName Google Sign-In Button
- * @description Requires <script src="https://accounts.google.com/gsi/client" async></script> be added to the <head> section.
- */
-export class GoogleSignIn {
-  constructor() {
-    withHooks(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const sdk = getEnvironmentSDK();
-    const [googleButtonDiv, setGoogleButtonDiv] = useState(null);
-    useEffect(() => {
-      if (sdk.type !== "SquatchPortal")
-        return;
-      if (!googleButtonDiv)
-        return;
-      const cb = (res) => {
-        this.initComplete.emit(res);
-      };
-      //@ts-expect-error
-      google.accounts.id.initialize({
-        //@ts-expect-error: link component-env/boilerplate for new types
-        client_id: sdk.env.googleClientId,
-        callback: cb,
-      });
-      //@ts-expect-error
-      google.accounts.id.renderButton(googleButtonDiv, {
-        theme: "outline",
-        size: "large",
-        text: this.text,
-      });
-    }, [googleButtonDiv]);
-    // TODO: Maybe a loading placeholder while initialising
-    return h("div", { ref: setGoogleButtonDiv });
-  }
-  static get is() { return "sqm-google-sign-in"; }
-  static get encapsulation() { return "shadow"; }
-  static get properties() { return {
-    "text": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "text",
-      "reflect": false
-    }
-  }; }
-  static get events() { return [{
-      "method": "initComplete",
-      "name": "initComplete",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-}

package/dist/collection/components/sqm-pagination/Pagination.stories.js

@@ -1,12 +0,0 @@
-import { h } from "@stencil/core";
-export default {
-  title: "Components/Link Button",
-};
-const defaultProps = {
-  link: "https://example.com",
-  openInNewTab: false,
-  buttonText: "Button Text",
-};
-export const Default = () => {
-  return h("sqm-pagination", null);
-};

package/dist/collection/components/sqm-pagination/sqm-pagination-view.js

@@ -1,32 +0,0 @@
-import { Fragment, h } from "@stencil/core";
-import { createStyleSheet } from "../../styling/JSS";
-const style = {
-  Container: {
-    display: "flex",
-    justifyContent: "flex-end",
-    alignItems: "center",
-    gap: "var(--sl-spacing-small)",
-    width: "100%",
-  },
-  TextContainer: {
-    display: "flex",
-    gap: "var(--sl-spacing-xx-small)",
-  },
-};
-const sheet = createStyleSheet(style);
-const styleString = sheet.toString();
-export function PaginationView(props) {
-  const { states, callbacks, text } = props;
-  const { onNext, onPrev } = callbacks;
-  const { currentPage, totalPages, loading } = states;
-  if (totalPages === 1)
-    return h(Fragment, null);
-  return (h("span", { class: sheet.classes.Container, part: "sqm-base" },
-    h("style", { type: "text/css" }, styleString),
-    !loading && (h(Fragment, null,
-      h("sl-button", { onClick: onPrev, part: "sqm-pagination-button", circle: true, disabled: currentPage === 1 },
-        h("sl-icon", { name: "chevron-left", label: "Previous Page" })),
-      h("div", { class: sheet.classes.TextContainer }, text.paginationText))),
-    h("sl-button", { onClick: onNext, part: "sqm-pagination-button", circle: true, disabled: currentPage === totalPages },
-      h("sl-icon", { name: "chevron-right", label: "Previous Page" }))));
-}

package/dist/collection/components/sqm-pagination/sqm-pagination.js

@@ -1,112 +0,0 @@
-import { isDemo } from "@saasquatch/component-boilerplate";
-import { withHooks } from "@saasquatch/stencil-hooks";
-import { useState } from "@saasquatch/universal-hooks";
-import { Component, h, Prop, State } from "@stencil/core";
-import deepmerge from "deepmerge";
-import { intl } from "../../global/global";
-import { getProps } from "../../utils/utils";
-import { PaginationView } from "./sqm-pagination-view";
-import { usePagination } from "./usePagination";
-/**
- * @uiName Pagination
- * @exampleGroup Common Components
- * @example Link Button - <sqm-pagination></sqm-pagination>
- */
-export class Pagination {
-  constructor() {
-    this.ignored = true;
-    /**
-     * @uiName Pagination text
-     */
-    this.paginationText = "{currentPage} of {totalPages}";
-    withHooks(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const hookProps = isDemo()
-      ? useDemoPagination(getProps(this))
-      : usePagination(getProps(this));
-    return h(PaginationView, Object.assign({}, hookProps));
-  }
-  static get is() { return "sqm-pagination"; }
-  static get encapsulation() { return "shadow"; }
-  static get properties() { return {
-    "paginationText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Pagination text",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "pagination-text",
-      "reflect": false,
-      "defaultValue": "\"{currentPage} of {totalPages}\""
-    },
-    "demoData": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "DemoData<UsePagination>",
-        "resolved": "{}",
-        "references": {
-          "DemoData": {
-            "location": "import",
-            "path": "../../global/demo"
-          },
-          "UsePagination": {
-            "location": "import",
-            "path": "./usePagination"
-          }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "text": undefined,
-            "name": "undocumented"
-          }, {
-            "text": "object",
-            "name": "uiType"
-          }],
-        "text": ""
-      }
-    }
-  }; }
-  static get states() { return {
-    "ignored": {}
-  }; }
-}
-function useDemoPagination(props) {
-  const [currentPage, setCurrentPage] = useState(1);
-  return deepmerge({
-    states: {
-      currentPage,
-      totalPages: 5,
-      loading: false,
-    },
-    callbacks: {
-      onNext: () => setCurrentPage(currentPage + 1),
-      onPrev: () => setCurrentPage(currentPage - 1),
-    },
-    text: {
-      paginationText: intl.formatMessage({
-        id: `paginationText`,
-        defaultMessage: props.paginationText || "{currentPage} of {totalPages}",
-      }, {
-        currentPage: currentPage,
-        totalPages: 5,
-      }),
-    },
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
-}

package/dist/collection/components/sqm-pagination/usePagination.js

@@ -1,29 +0,0 @@
-import { useParentValue } from "@saasquatch/component-boilerplate";
-import { REFERRAL_CODES_PAGINATION_CONTEXT, } from "../sqm-referral-codes/useReferralCodes";
-import { intl } from "../../global/global";
-export function usePagination(props) {
-  var _a;
-  const context = useParentValue(REFERRAL_CODES_PAGINATION_CONTEXT);
-  const currentPage = context.states.currentPage + 1;
-  const totalPages = (_a = context.states) === null || _a === void 0 ? void 0 : _a.pageCount;
-  return {
-    states: {
-      currentPage,
-      totalPages,
-      loading: context.states.loading,
-    },
-    callbacks: {
-      onNext: () => { var _a, _b; return (_a = context.callbacks) === null || _a === void 0 ? void 0 : _a.setCurrentPage(((_b = context.states) === null || _b === void 0 ? void 0 : _b.currentPage) + 1); },
-      onPrev: () => { var _a, _b; return (_a = context.callbacks) === null || _a === void 0 ? void 0 : _a.setCurrentPage(((_b = context.states) === null || _b === void 0 ? void 0 : _b.currentPage) - 1); },
-    },
-    text: {
-      paginationText: intl.formatMessage({
-        id: `paginationText`,
-        defaultMessage: props.paginationText,
-      }, {
-        currentPage,
-        totalPages,
-      }),
-    },
-  };
-}