@saasquatch/mint-components 1.15.0-40 → 1.15.0-42

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

@@ -1,39 +1,37 @@
-import { h, r as registerInstance, c as Host } from './index-91e7729f.js';
-import { a as commonjsGlobal, u as useMemo, k as useState, f as useEffect, c as createCommonjsModule, n as h$1 } from './stencil-hooks.module-4bc38af4.js';
-import './global-66746c30.js';
-import { j as jn, k as kn, b as setUserIdentity, d as dist, X as Xe, p as setProgramId } from './index.module-89a79f66.js';
+import { h, r as registerInstance, c as Host } from './index-b3a06de8.js';
+import { a as commonjsGlobal, u as useMemo, k as useState, f as useEffect, c as createCommonjsModule, n as h$1 } from './stencil-hooks.module-20ad2b5f.js';
+import './global-16971a34.js';
+import { j as jn, k as kn, b as setUserIdentity, d as dist, X as Xe, p as setProgramId } from './index.module-d49ae5e7.js';
 import './cjs-bdfb4486.js';
 import './utils-334c1e34.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
-import './useReferralCodes-8f75921a.js';
+import './useReferralCodes-0b798295.js';
 import './mixins-f750863a.js';
-import { C as CopyTextView } from './copy-text-view-4a207b17.js';
-import { G as GenericTableView } from './GenericTableView-3b6f9ccc.js';
-import './useChildElements-7945ae56.js';
-import { l as luxon } from './luxon-8d51c92b.js';
-import './sqm-text-span-view-cd3902e5.js';
-import { A as AssetCardView } from './sqm-asset-card-view-fe5db3c0.js';
-import { C as CloseButtonView } from './sqm-close-button-view-bc2bc10e.js';
+import { C as CopyTextView } from './copy-text-view-38c7c3d5.js';
+import { G as GenericTableView } from './GenericTableView-dd9be3ea.js';
+import './useChildElements-0ca9a015.js';
+import { l as luxon } from './luxon-793b7f13.js';
+import './sqm-text-span-view-4c17b8c9.js';
+import { C as CloseButtonView } from './sqm-close-button-view-2fa57229.js';
 import './index-ffa26b43.js';
-import { E as EmailRegistrationView } from './email-registration-view-b1c858ee.js';
-import { L as LeaderboardRankView } from './sqm-leaderboard-rank-view-84b3c539.js';
-import { L as LogoutCurrentUserView } from './sqm-logout-current-user-view-8ef8180f.js';
-import { N as NavigationSidebarView } from './sqm-navigation-sidebar-view-f898265a.js';
-import { N as NavigationSidebarItemView } from './sqm-navigation-sidebar-item-view-6e046743.js';
-import { P as PortalEmailVerificationView } from './sqm-portal-email-verification-view-00f03873.js';
-import { P as PortalForgotPasswordView } from './sqm-portal-forgot-password-view-55fc0873.js';
-import { P as PortalLoginView } from './sqm-portal-login-view-e870b4b0.js';
-import { B as BaseRegistrationFormView } from './sqm-base-registration-form-view-d732a5df.js';
-import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-5d651c04.js';
-import { P as PortalProfileView } from './sqm-portal-profile-view-0d45de87.js';
-import './utilities-5b0ca040.js';
-import { P as PortalResetPasswordView } from './sqm-portal-reset-password-view-6903828e.js';
-import { P as PortalVerifyEmailView } from './sqm-portal-verify-email-view-01ac711f.js';
-import './ErrorView-48e2b969.js';
-import { Q as QrCodeView } from './sqm-qr-code-view-62c10948.js';
-import { S as ShareButtonView, L as LeaderboardView, B as BigStatView, P as PortalFrameView, E as EditProfileView, u as useShareLink, a as useShareButton, b as useDemoBigStat, c as StatContainerView, d as PortalChangePasswordView, e as PortalRegisterView, C as ChangeMarktingView, T as TaskCardView, f as ProgressBarView, g as PoweredByImg$1, h as PortalFooterView, H as HeroView, R as ReferralIframeView, N as NameFieldsView, i as CheckboxFieldView, D as DropdownFieldView, I as InputFieldView, j as RewardExchangeView, r as rewardExchangeCustomErrorMsg, k as rewardExchangeLongText, l as rewardExchangeSelected, m as chooseAmountFixed, n as chooseAmountFixedNoDescription, o as chooseAmountVariable, p as chooseAmountVariableNoDescription, q as chooseAmountVariableDisabled, s as chooseAmountVariableUnavailable, t as confirmFixed, v as confirmVariable, w as redemptionError, x as queryError, y as success, z as successVariable, A as loading, F as empty$1, G as rewardExchange, J as CardFeedView, K as CouponCodeView, M as ProgressBar$2, O as autoColorScaleCss, Q as ShadowViewAddon } from './ShadowViewAddon-5f9b6d07.js';
-import { P as PortalContainerView, a as PortalSectionView } from './sqm-portal-container-view-1683ae32.js';
-import { O as OtherRegionSlotView, I as InvoiceTableView, T as TaxForm } from './sqm-invoice-table-view-b7e91eef.js';
+import { E as EmailRegistrationView } from './email-registration-view-db81655f.js';
+import { L as LeaderboardRankView } from './sqm-leaderboard-rank-view-18baae5b.js';
+import { L as LogoutCurrentUserView } from './sqm-logout-current-user-view-f21e54e3.js';
+import { N as NavigationSidebarView } from './sqm-navigation-sidebar-view-6c13798c.js';
+import { N as NavigationSidebarItemView } from './sqm-navigation-sidebar-item-view-48b224fa.js';
+import { P as PortalEmailVerificationView } from './sqm-portal-email-verification-view-7ac99890.js';
+import { P as PortalForgotPasswordView } from './sqm-portal-forgot-password-view-2628bc62.js';
+import { B as BaseRegistrationFormView } from './sqm-base-registration-form-view-193f1721.js';
+import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-8bdc3804.js';
+import { P as PortalProfileView } from './sqm-portal-profile-view-c68753ea.js';
+import './utilities-6341d9fd.js';
+import { P as PortalResetPasswordView } from './sqm-portal-reset-password-view-abef7286.js';
+import { P as PortalVerifyEmailView } from './sqm-portal-verify-email-view-33805220.js';
+import './ErrorView-eaafd6f5.js';
+import { Q as QrCodeView } from './sqm-qr-code-view-358607d1.js';
+import { S as ShareButtonView, L as LeaderboardView, B as BigStatView, P as PortalFrameView, E as EditProfileView, u as useShareLink, a as useShareButton, b as useDemoBigStat, c as StatContainerView, d as PortalChangePasswordView, e as PortalRegisterView, C as ChangeMarktingView, T as TaskCardView, f as ProgressBarView, g as PoweredByImg$1, h as PortalFooterView, H as HeroView, R as ReferralIframeView, N as NameFieldsView, i as CheckboxFieldView, D as DropdownFieldView, I as InputFieldView, j as RewardExchangeView, r as rewardExchangeCustomErrorMsg, k as rewardExchangeLongText, l as rewardExchangeSelected, m as chooseAmountFixed, n as chooseAmountFixedNoDescription, o as chooseAmountVariable, p as chooseAmountVariableNoDescription, q as chooseAmountVariableDisabled, s as chooseAmountVariableUnavailable, t as confirmFixed, v as confirmVariable, w as redemptionError, x as queryError, y as success, z as successVariable, A as loading, F as empty$1, G as rewardExchange, J as CardFeedView, K as CouponCodeView, M as ProgressBar$2, O as ShadowViewAddon } from './ShadowViewAddon-173ce794.js';
+import { P as PortalContainerView, a as PortalSectionView } from './sqm-portal-container-view-f0b1ccfc.js';
+import { O as OtherRegionSlotView, I as InvoiceTableView, T as TaxForm } from './sqm-invoice-table-view-e43241aa.js';
 
 /**
  * lodash (Custom Build) <https://lodash.com/>
@@ -7389,16 +7387,20 @@ const loadingProps = {
     pageLabel: "Sign in to your account",
   },
 };
-const Default$3 = () => (h("sqm-portal-login", { demoData: { ...defaultProps$2 } }));
-const IsGoogle = () => (h(PortalLoginView, Object.assign({}, defaultProps$2, { content: {
+const googleProps = {
+  ...defaultProps$2,
+  content: {
     secondaryButton: (h("span", null,
       "Don't have an account?",
       " ",
       h("sl-button", { style: { width: "50px" }, size: "large", type: "text" }, "Register"))),
     googleButton: h("sl-button", null, "Sign in with Google"),
-  } })));
-const LoginWithError = () => h(PortalLoginView, Object.assign({}, errorProps));
-const LoginLoading = () => h(PortalLoginView, Object.assign({}, loadingProps));
+  },
+};
+const Default$3 = () => (h("sqm-portal-login", { demoData: { ...defaultProps$2 } }));
+const IsGoogle = () => (h("sqm-portal-login", { demoData: { ...googleProps } }));
+const LoginWithError = () => (h("sqm-portal-login", { demoData: { ...errorProps } }));
+const LoginLoading = () => (h("sqm-portal-login", { demoData: { ...loadingProps } }));
 
 const PortalLogin = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -8041,42 +8043,6 @@ const PortalVerifyEmail = /*#__PURE__*/Object.freeze({
   EmailVerificationSuccess: EmailVerificationSuccess$1
 });
 
-const AssetCard_stories = {
-  title: "Components/Asset Card",
-};
-const Default$9 = () => {
-  const props = {
-    text: { titleText: "Marketing Banner" },
-    imgUrl: "https://res.cloudinary.com/saasquatch/image/upload/v1634255445/squatch-assets/Copy_of_saasquatch-logo-tree-large-horizontal.png",
-    callbacks: {},
-  };
-  return h(AssetCardView, Object.assign({}, props));
-};
-const CardWithLongText = () => {
-  const props = {
-    text: { titleText: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam, sunt dolores? Dolore temporibus autem officia blanditiis minus in voluptatem molestiae!" },
-    imgUrl: "https://res.cloudinary.com/saasquatch/image/upload/v1634255445/squatch-assets/Copy_of_saasquatch-logo-tree-large-horizontal.png",
-    callbacks: {},
-  };
-  return h(AssetCardView, Object.assign({}, props));
-};
-const CardWithNoImg = () => {
-  const props = {
-    text: { titleText: "Marketing Banner" },
-    imgUrl: "",
-    callbacks: {},
-  };
-  return h(AssetCardView, Object.assign({}, props));
-};
-
-const AssetCard = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  'default': AssetCard_stories,
-  Default: Default$9,
-  CardWithLongText: CardWithLongText,
-  CardWithNoImg: CardWithNoImg
-});
-
 const DividedLayout_stories = {
   title: "Components/Divided Layout",
 };
@@ -8293,7 +8259,7 @@ const successProps$3 = {
     submit: (e) => console.log("Submit", e),
   },
 };
-const Default$a = () => h(PortalChangePasswordView, Object.assign({}, defaultProps$8));
+const Default$9 = () => h(PortalChangePasswordView, Object.assign({}, defaultProps$8));
 const Open = () => h(PortalChangePasswordView, Object.assign({}, openProps));
 const Error$2 = () => h(PortalChangePasswordView, Object.assign({}, errorProps$7));
 const PaswordError = () => (h(PortalChangePasswordView, Object.assign({}, passwordErrorProps)));
@@ -8303,7 +8269,7 @@ const Success = () => h(PortalChangePasswordView, Object.assign({}, successProps
 const ChangePassword = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': ChangePassword_stories,
-  Default: Default$a,
+  Default: Default$9,
   Open: Open,
   Error: Error$2,
   PaswordError: PaswordError,
@@ -8341,7 +8307,7 @@ const defaultProps$9 = {
     setChecked: (value) => console.log(value),
   },
 };
-const Default$b = () => {
+const Default$a = () => {
   return h("sqm-portal-change-marketing", null);
 };
 const Loading$2 = () => {
@@ -8367,7 +8333,7 @@ const Success$1 = () => {
 const ChangeMarketing = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': ChangeMarketing_stories,
-  Default: Default$b,
+  Default: Default$a,
   Loading: Loading$2,
   Error: Error$3,
   Success: Success$1
@@ -8592,7 +8558,7 @@ const successProps$4 = {
     onChange: (e) => console.log(e),
   },
 };
-const Default$c = () => h(PortalProfileView, Object.assign({}, defaultProps$a));
+const Default$b = () => h(PortalProfileView, Object.assign({}, defaultProps$a));
 const DefaultNoCountry = () => h(PortalProfileView, Object.assign({}, noCountry));
 const Loading$3 = () => h(PortalProfileView, Object.assign({}, loadingProps$7));
 const Disabled$1 = () => h(PortalProfileView, Object.assign({}, disabledProps));
@@ -8602,7 +8568,7 @@ const Success$2 = () => h(PortalProfileView, Object.assign({}, successProps$4));
 const PortalProfile = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': PortalProfile_stories,
-  Default: Default$c,
+  Default: Default$b,
   DefaultNoCountry: DefaultNoCountry,
   Loading: Loading$3,
   Disabled: Disabled$1,
@@ -9838,31 +9804,6 @@ const scenarioTaskCard = "@author:derek\n@owner:kutay\nFeature: Task Card\n\n\t@
 
 const scenarioProgressBar = "@author:kutay\n@owner:kutay\nFeature: The progress bar can be shown as a continuous line with progress and end goal. \n\n\t@motivating\n\t@ui\n\tScenario Outline: The progress bar displays a continuous bar with the goal represented by a present\n\t\tGiven a Task Card component\n\t\tAnd the users progress is <progress>\n\t\tAnd the task goal is \"500\"\n\t\tAnd the task is not repeatable\n\t\tThen I have <progressBar>\n\t\tAnd the <progressBar> shows <progress> with <unit> on the right\n\t\tAnd the circle on the progress bar is brand colour\n\t\tAnd the line behind the circle is brand colour\n\t\tAnd the line infront of the circle is grey\n\t\tAnd the gift icon has <color>\n\t\tAnd the gift icon shows \"500\" with <unit> below\n\t\tExamples:\n\t\t\t| progress | progressBar           | unit | color |\n\t\t\t| 0        | ●――――――――――――――――――🎁 | $    | no    |\n\t\t\t| 100      | ―――●―――――――――――――――🎁 | $    | no    |\n\t\t\t| 500      | ―――――――――――――――――――🎁 | $    | yes   |\n\t\t\t| 650      | ―――――――――――――――――――🎁 | $    | yes   |\n\t\t\t| 1200     | ―――――――――――――――――――🎁 | $    | yes   |\n\n\t@motivating\n\t@ui\n\tScenario Outline: The progress bar can be displayed with steps instead of a continuous line\n\t\tGiven a Task Card component\n\t\tAnd the user progress is <progress>\n\t\tAnd the goal is \"5\"\n\t\tAnd steps are enabled\n\t\tThen I have <progressBar>\n\t\tAnd the <progressBar> has incrementing steps up to \"5\" in increments of 1\n\t\tAnd the steps behind the users progress are brand colour\n\t\tAnd the steps infront of the users progress are grey\n\t\tAnd the gift icon has <color>\n\t\tAnd the gift icon shows \"5\" below\n\t\tExamples:\n\t\t\t| progress | progressBar           | color |\n\t\t\t| 0        | ―――○―――○―――○―――○―――🎁 | no    |\n\t\t\t| 1        | ―――●―――○―――○―――○―――🎁 | no    |\n\t\t\t| 5        | ―――●―――●―――●―――●―――🎁 | yes   |\n\t\t\t| 7        | ―――●―――●―――●―――●―――🎁 | yes   |\n\t\t\t| 12       | ―――●―――●―――●―――●―――🎁 | yes   |\n\n\t@motivating\n\t@ui\n\tScenario Outline: The continuous progress bar will continue to progress for repeatable rewards\n\t\tGiven a Task Card component\n\t\tAnd the user progress is <progress>\n\t\tAnd the goal is \"500\"\n\t\tAnd it is repeatable\n\t\tThen I have <progressBar>\n\t\tAnd the <progressBar> shows <progress> with <unit> to the right\n\t\tAnd the first <icon1> is <color1> with <text1> displayed below\n\t\tAnd the second <icon2> is <color2> with <text2> displayed below\n\t\tAnd the third <icon3> is <color3> with <text3> displayed below\n\t\tAnd the circle on the progress bar is brand colour\n\t\tAnd the line behind the circle is brand colour\n\t\tAnd the line infront of the circle is grey\n\t\tExamples:\n\t\t\t| progress | progressBar          | unit | icon1 | color1   | text1 | icon2 | color2    | text 2 | icon3 | color3    | text 3 |\n\t\t\t| 250      | ――――●――――🎁―――――――🎁 | $    | NA    | NA       | NA    | gift  | greyscale | 500    | gift  | greyscale | 1000   |\n\t\t\t| 500      | ―――――――――🎁―――――――🎁 | $    | NA    | NA       | NA    | gift  | colorful  | 500    | gift  | greyscale | 1000   |\n\t\t\t| 750      | ―――――――――🎁―――●―――🎁 | $    | NA    | NA       | NA    | gift  | colorful  | 500    | gift  | greyscale | 1000   |\n\t\t\t| 1000     | 🎁―――――――🎁―――――――🎁 | $    | gift  | colorful | 500   | gift  | colorful  | 1000   | gift  | greyscale | 1500   |\n\t\t\t| 1250     | 🎁―――――――🎁―――●―――🎁 | $    | gift  | colorful | 500   | gift  | colorful  | 1000   | gift  | greyscale | 1500   |\n\n\t@motivating\n\t@ui\n\tScenario Outline: The stepped progress bar will continue to progress for repeatable rewards\n\t\tGiven a Task Card component\n\t\tAnd the user progress is <progress>\n\t\tAnd the goal is \"5\"\n\t\tAnd steps are enabled\n\t\tAnd it is repeatable\n\t\tThen I have <progressBar>\n\t\tAnd the <progressBar> has incrementing steps up to \"5\" in increments of 1\n\t\tAnd the first <icon1> is <color1>\n\t\tAnd the second <icon2> is <color2>\n\t\tAnd the third <icon3> is <color3>\n\t\tAnd the steps behind the users progress are brand colour\n\t\tAnd the steps infront of the users progress are grey\n\t\tExamples:\n\t\t\t| progress | progressBar              | icon1 | color1   | icon2 | color2    | icon3 | color3    |\n\t\t\t| 0        | ―――○―○―○―○―🎁―○―○―○―○―🎁 | NA    | NA       | gift  | greyscale | gift  | greyscale |\n\t\t\t| 1        | ―――●―○―○―○―🎁―○―○―○―○―🎁 | NA    | NA       | gift  | greyscale | gift  | greyscale |\n\t\t\t| 5        | ―――●―●―●―●―🎁―○―○―○―○―🎁 | NA    | NA       | gift  | colorful  | gift  | greyscale |\n\t\t\t| 7        | ―――●―●―●―●―🎁―●―●―○―○―🎁 | NA    | NA       | gift  | colorful  | gift  | greyscale |\n\t\t\t| 12       | 🎁―●―●―●―●―🎁―●―●―○―○―🎁 | gift  | colorful | gift  | colorful  | gift  | greyscale |";
 
-const ResizerStylesheet = `
-
-:root{
-    --checker-color-1: #ffffff00;
-    --checker-color-2: #ffffff00;
-    --checker-size: 7px;
-    --checker-gradient: linear-gradient(45deg, var(--checker-color-1) 25%, transparent 25%, transparent 75%, var(--checker-color-1) 75%);
-}
-.resizer{
-    resize: horizontal;
-    border: 2px dashed gray;
-	margin: -2px;
-    padding: 12px;
-    height: fit-content;
-    overflow: hidden;
-	width: 100%;
-}
-
-.resizer{
-    background-color: var(--checker-color-2);
-    background-image: var(--checker-gradient), var(--checker-gradient);
-    background-position: 0 0, var(--checker-size) var(--checker-size);
-    background-size: calc(var(--checker-size) * 2) calc(var(--checker-size) * 2);
-}
-`;
 const Resizer = (_, children) => (h("div", { class: "resizer" }, children));
 
 const scenario$e = scenarioTaskCard + scenarioProgressBar;
@@ -10581,7 +10522,7 @@ const ProgramMenu = /*#__PURE__*/Object.freeze({
 const PoweredByImg_stories = {
   title: "Powered By",
 };
-const Default$d = () => {
+const Default$c = () => {
   return h(PoweredByImg$1, null);
 };
 const CustomColor = () => {
@@ -10594,7 +10535,7 @@ const CustomWidthAndHeight = () => {
 const PoweredByImg = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': PoweredByImg_stories,
-  Default: Default$d,
+  Default: Default$c,
   CustomColor: CustomColor,
   CustomWidthAndHeight: CustomWidthAndHeight
 });
@@ -10981,7 +10922,7 @@ const defaultRegisterProps = {
     invalidEmailErrorMessage: "Must be a valid email address",
   },
 };
-const Default$e = createHookStory(() => (h(CheckboxFieldView, Object.assign({}, defaultProps$c))));
+const Default$d = createHookStory(() => (h(CheckboxFieldView, Object.assign({}, defaultProps$c))));
 const DefaultChecked = createHookStory(() => (h(CheckboxFieldView, Object.assign({}, defaultProps$c, { states: {
     ...defaultProps$c.states,
     checked: true,
@@ -11036,7 +10977,7 @@ const TermsAndConditionsLongCustomLabel = createHookStory(() => (h(PortalRegiste
 const CheckboxField = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': CheckboxField_stories,
-  Default: Default$e,
+  Default: Default$d,
   DefaultChecked: DefaultChecked,
   CustomLabel: CustomLabel,
   Error: Error$5,
@@ -11054,14 +10995,14 @@ const MarketingEmailsCheckbox_stories = {
     scenario: scenario$k,
   },
 };
-const Default$f = () => {
+const Default$e = () => {
   return h("sqm-marketing-emails-checkbox", null);
 };
 
 const MarketingEmailsCheckbox = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': MarketingEmailsCheckbox_stories,
-  Default: Default$f
+  Default: Default$e
 });
 
 const UseCheckboxField_stories = {
@@ -11156,7 +11097,7 @@ const defaultProps$d = {
     ],
   },
 };
-const Default$g = createHookStory(() => (h(DropdownFieldView, Object.assign({}, defaultProps$d))));
+const Default$f = createHookStory(() => (h(DropdownFieldView, Object.assign({}, defaultProps$d))));
 const CustomLabel$1 = createHookStory(() => (h(DropdownFieldView, Object.assign({}, defaultProps$d, { content: {
     ...defaultProps$d.content,
     dropdownLabel: "Pick your favorite",
@@ -11184,7 +11125,7 @@ const CustomError$1 = createHookStory(() => (h(DropdownFieldView, Object.assign(
 const DropdownField = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': DropdownField_stories,
-  Default: Default$g,
+  Default: Default$f,
   CustomLabel: CustomLabel$1,
   Error: Error$6,
   CustomError: CustomError$1
@@ -11294,7 +11235,7 @@ const defaultRegisterProps$1 = {
     invalidEmailErrorMessage: "Must be a valid email address",
   },
 };
-const Default$h = () => h(InputFieldView, Object.assign({}, defaultProps$e));
+const Default$g = () => h(InputFieldView, Object.assign({}, defaultProps$e));
 const CustomLabel$2 = () => (h(InputFieldView, Object.assign({}, defaultProps$e, { content: { ...defaultProps$e.content, fieldLabel: "My Label" } })));
 const Error$7 = () => (h(InputFieldView, Object.assign({}, defaultProps$e, { states: {
     ...defaultProps$e.states,
@@ -11344,7 +11285,7 @@ const RegistrationFieldCustomLabel = () => (h(PortalRegisterView, Object.assign(
 const InputField = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': InputField_stories,
-  Default: Default$h,
+  Default: Default$g,
   CustomLabel: CustomLabel$2,
   Error: Error$7,
   CustomError: CustomError$2,
@@ -14303,7 +14244,7 @@ const defaultProps$f = {
     fraudErrorMessageTitle: "Looks like you tried referring yourself",
   },
 };
-const Default$i = () => h(EmailRegistrationView, Object.assign({}, defaultProps$f));
+const Default$h = () => h(EmailRegistrationView, Object.assign({}, defaultProps$f));
 const HasFirstNameLastName = () => (h(EmailRegistrationView, Object.assign({}, {
   ...defaultProps$f,
   content: {
@@ -14368,7 +14309,7 @@ const EmptyEmailError = () => (h(EmailRegistrationView, Object.assign({}, {
 const EmailRegistration = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': EmailRegistration_stories,
-  Default: Default$i,
+  Default: Default$h,
   HasFirstNameLastName: HasFirstNameLastName,
   WithSlots: WithSlots,
   NoBorder: NoBorder$1,
@@ -14498,14 +14439,14 @@ const defaultProps$h = {
   loading: false,
   emailErrorText: "Error fetching email",
 };
-const Default$j = () => {
+const Default$i = () => {
   return h(LogoutCurrentUserView, Object.assign({}, defaultProps$h));
 };
 
 const LogoutCurrentUser = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': LogoutCurrentUser_stories,
-  Default: Default$j
+  Default: Default$i
 });
 
 const scenario$E = "@author:noah\n@owner:noah\n\nFeature: Link Button\n\n\t@ui\n\tScenario: Links can be opened in the same tab\n\t\tWhen a user clicks the button\n\t\tThen a link opens in the same tab\n\t\tAnd if the component is in an iFrame then the link is opened in the parent window not the iFrame\n\n\t@ui\n\tScenario: Links can be opened in a new tab\n\t\tWhen a user clicks the button\n\t\tThen a link opens in a new tab\n\t\tAnd if the component is in an iFrame then the link is still opened in a new tab\n\n\n\t@ui\n\tScenario: Props control the link and button text\n\t\tGiven the \"link\" prop is set to \"https://www.example.com\"\n\t\tAnd the \"buttonText\" prop is set to \"Click me!\"\n\t\tThen a button is shown with the text \"Click me!\"\n\t\tAnd when clicked the button opens https://www.example.com\n\n\t@ui\n\tScenario Outline: The button type can be set\n\t\tGiven the button type is set to <value>\n\t\tThen a <buttonType> is shown\n\t\tExamples:\n\t\t\t| value   | buttonType |\n\t\t\t| <null>  | primary    |\n\t\t\t| default | default    |\n\t\t\t| primary | primary    |\n\t\t\t| success | success    |\n\t\t\t| neutral | neutral    |\n\t\t\t| warning | warning    |\n\t\t\t| danger  | danger     |";
@@ -14521,7 +14462,7 @@ const defaultProps$i = {
   openInNewTab: false,
   buttonText: "Button Text",
 };
-const Default$k = () => {
+const Default$j = () => {
   return h("sqm-link-button", Object.assign({}, defaultProps$i));
 };
 const OpenInNewTab = () => {
@@ -14531,7 +14472,7 @@ const OpenInNewTab = () => {
 const LinkButton = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': LinkButton_stories,
-  Default: Default$k,
+  Default: Default$j,
   OpenInNewTab: OpenInNewTab
 });
 
@@ -14549,7 +14490,7 @@ const containerStyles = {
   border: "1px solid black",
   padding: "25px",
 };
-const Default$l = () => {
+const Default$k = () => {
   return h(CloseButtonView, Object.assign({}, defaultProps$j));
 };
 const InAContainer = () => {
@@ -14564,7 +14505,7 @@ const CustomColor$2 = () => {
 const CloseButton = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': CloseButton_stories,
-  Default: Default$l,
+  Default: Default$k,
   InAContainer: InAContainer,
   CustomColor: CustomColor$2
 });
@@ -15476,7 +15417,7 @@ const defaultProps$m = {
   initialLoading: false,
   sendCodeError: false,
 };
-const Default$m = () => (h("sqm-email-verification", { demoData: {} }));
+const Default$l = () => (h("sqm-email-verification", { demoData: {} }));
 const EmailIsPrefilled = () => (h("div", null,
   h("sqm-text", null,
     h("h4", null, "Verify your email")),
@@ -15527,7 +15468,7 @@ const SendCodeError = () => (h("sqm-email-verification", { demoData: {
 const WidgetEmailVerification = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': WidgetEmailVerification_stories,
-  Default: Default$m,
+  Default: Default$l,
   EmailIsPrefilled: EmailIsPrefilled,
   Loading: Loading$8,
   SaveLoading: SaveLoading,
@@ -15546,7 +15487,7 @@ const defaultProps$n = {
   verifyFailed: false,
   emailResent: false,
 };
-const Default$n = () => (h("sqm-code-verification", { demoData: { states: defaultProps$n } }));
+const Default$m = () => (h("sqm-code-verification", { demoData: { states: defaultProps$n } }));
 const InitialLoading = () => (h("sqm-code-verification", { demoData: {
     states: {
       ...defaultProps$n,
@@ -15575,7 +15516,7 @@ const VerificationFailed = () => (h("sqm-code-verification", { demoData: {
 const WidgetCodeVerification = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': WidgetCodeVerification_stories,
-  Default: Default$n,
+  Default: Default$m,
   InitialLoading: InitialLoading,
   Loading: Loading$9,
   CodeResent: CodeResent,
@@ -15746,7 +15687,7 @@ const errorProps$a = {
     error: "Something went wrong. Please try again.",
   },
 };
-const Default$o = () => {
+const Default$n = () => {
   return h(BaseRegistrationFormView, Object.assign({}, defaultProps$q));
 };
 const EmailError = () => {
@@ -15756,7 +15697,7 @@ const EmailError = () => {
 const BaseRegistrationForm = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': BaseRegistrationForm_stories,
-  Default: Default$o,
+  Default: Default$n,
   EmailError: EmailError
 });
 
@@ -15839,7 +15780,7 @@ const loadingProps$8 = {
     },
   },
 };
-const Default$p = () => (h(PortalRegistrationFormView, Object.assign({}, defaultProps$r)));
+const Default$o = () => (h(PortalRegistrationFormView, Object.assign({}, defaultProps$r)));
 const RegisterWithError$2 = () => (h(PortalRegistrationFormView, Object.assign({}, errorProps$b)));
 const RegisterLoading$2 = () => (h(PortalRegistrationFormView, Object.assign({}, loadingProps$8)));
 const TermsAndConditions$4 = () => (h(PortalRegistrationFormView, Object.assign({}, defaultProps$r, { content: {
@@ -15853,7 +15794,7 @@ const TermsAndConditions$4 = () => (h(PortalRegistrationFormView, Object.assign(
 const PortalGoogleRegistrationFormStories = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': PortalGoogleRegistrationForm_stories,
-  Default: Default$p,
+  Default: Default$o,
   RegisterWithError: RegisterWithError$2,
   RegisterLoading: RegisterLoading$2,
   TermsAndConditions: TermsAndConditions$4
@@ -15880,7 +15821,7 @@ const defaultProps$s = {
   errorHeaderText: "There was an error loading your QR code",
   errorDescriptionText: "Please refresh this page and try again",
 };
-const Default$q = () => {
+const Default$p = () => {
   return h(QrCodeView, Object.assign({}, defaultProps$s));
 };
 const HideTitle = () => {
@@ -15908,7 +15849,7 @@ const DownloadError = () => {
 const QRCode = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': QRCode_stories,
-  Default: Default$q,
+  Default: Default$p,
   HideTitle: HideTitle,
   LeftAlign: LeftAlign$1,
   CenterAlign: CenterAlign,
@@ -15937,60 +15878,6 @@ const Text = /*#__PURE__*/Object.freeze({
   CustomFontSize: CustomFontSize
 });
 
-/**
- *
- * Themes
- *
- * Export only valid CSS. Those will be injected into style tags.
- *
- * Useful links:
- *  - https://brandcolors.net/
- *  - Shoelace color generator: https://codepen.io/claviska/full/QWveRgL
- *
- */
-//
-const Default$r = `
- // No CSS
-`;
-const Orangey = `
-:root{
-    ${autoColorScaleCss("orange")}
-}
-`;
-const Netflix = `
-:root{
-    ${autoColorScaleCss("#e50914")}
-}
-`;
-const SaaSquatchCorporate = `
-:root{
-    ${autoColorScaleCss("#65bd60")}
-    --sl-font-sans: Arial;
-}
-`;
-const NYTimes = `
-:root{
-    ${autoColorScaleCss("black")}
-    --sl-font-sans: Georgia, 'Times New Roman', serif;
-}
-`;
-const Klip = `
-:root{
-    ${autoColorScaleCss("#4225C4")};
-}
-
-`;
-
-const Themes = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  Default: Default$r,
-  Orangey: Orangey,
-  Netflix: Netflix,
-  SaaSquatchCorporate: SaaSquatchCorporate,
-  NYTimes: NYTimes,
-  Klip: Klip
-});
-
 function deepFreeze(obj) {
     if (obj instanceof Map) {
         obj.clear = obj.delete = obj.set = function () {
@@ -18609,7 +18496,6 @@ const stories = [
   PortalEmailVerification,
   PortalResetPassword,
   PortalVerifyEmail,
-  AssetCard,
   DividedLayout,
   ChangePassword,
   PortalProfile,
@@ -18691,26 +18577,8 @@ const StencilStorybook = class {
     });
     const [selectedTheme, setSelected] = useState("Default");
     const [checkerboard, setCheckerboard] = useState(true);
-    const themes = Object.keys(Themes);
-    const theme = Themes[selectedTheme];
-    return (h(Host, { class: Style, onClick: {} }, h("div", { style: {
-        position: "absolute",
-        top: "0",
-        right: "0",
-        zIndex: "999999",
-      } }, "Branding:", h("select", { onChange: (e) => setSelected(e.target.value) }, themes.map((t) => (h("option", { selected: t === selectedTheme }, t)))), h("div", null, h("div", null)), h(ColorScale, null), h("br", null), h("input", { type: "checkbox", id: "checkerboard", onClick: () => setCheckerboard(!checkerboard), onChange: () => document.documentElement.style.setProperty("--checker-color-1", checkerboard ? "#ebebeb" : "#ffffff00") }), h("label", { htmlFor: "checkerboard" }, "Checkerboard?")), h("style", null, theme), h("style", null, ResizerStylesheet), children));
+    return (h(Host, { class: Style, onClick: {} }, h("sqm-brand-selector", null), children));
   }
 };
-function ColorScale() {
-  return (h("span", null, h(ColorToken, null), h(ColorToken, { type: "success" }), h(ColorToken, { type: "warning" }), h(ColorToken, { type: "danger" }), h(ColorToken, { type: "neutral" })));
-}
-function ColorToken({ type = "primary" }) {
-  return (h("span", { style: {
-      background: `var(--sl-color-${type}-500)`,
-      width: "1em",
-      marginRight: "2px",
-      padding: "0 4px",
-    }, title: type }, type.charAt(0)));
-}
 
 export { StencilStorybook as sqm_stencilbook };

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

@@ -1,7 +1,7 @@
-import { h, c as Host, r as registerInstance } from './index-91e7729f.js';
-import { n as h$1 } from './stencil-hooks.module-4bc38af4.js';
-import './index.module-89a79f66.js';
-import { a as useRequestRerender } from './re-render-cc945f38.js';
+import { h, c as Host, r as registerInstance } from './index-b3a06de8.js';
+import { n as h$1 } from './stencil-hooks.module-20ad2b5f.js';
+import './index.module-d49ae5e7.js';
+import { a as useRequestRerender } from './re-render-789f9123.js';
 
 const TabView = ({}, children) => {
   return h(Host, null, children);

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

@@ -1,9 +1,9 @@
-import { h, c as Host, r as registerInstance } from './index-91e7729f.js';
-import { u as useMemo, f as useEffect, n as h$1 } from './stencil-hooks.module-4bc38af4.js';
-import { _ } from './index.module-89a79f66.js';
+import { h, c as Host, r as registerInstance } from './index-b3a06de8.js';
+import { u as useMemo, f as useEffect, n as h$1 } from './stencil-hooks.module-20ad2b5f.js';
+import { _ } from './index.module-d49ae5e7.js';
 import { g as getProps } from './utils-334c1e34.js';
-import { u as useRerenderListener } from './re-render-cc945f38.js';
-import { u as useChildElements } from './useChildElements-7945ae56.js';
+import { u as useRerenderListener } from './re-render-789f9123.js';
+import { u as useChildElements } from './useChildElements-0ca9a015.js';
 
 const TabsView = ({ content, placement, textColor = "var(--sqm-text)", }) => {
   // Vertical padding for top & bottom placement, horizontal for left & right.

package/dist/esm/{sqm-text-span-view-cd3902e5.js → sqm-text-span-view-4c17b8c9.js}

@@ -1,4 +1,4 @@
-import { h } from './index-91e7729f.js';
+import { h } from './index-b3a06de8.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 
 function TextSpanView(props, children) {

package/dist/esm/sqm-text-span.entry.js

@@ -1,7 +1,7 @@
-import { r as registerInstance, h as h$1 } from './index-91e7729f.js';
-import { n as h } from './stencil-hooks.module-4bc38af4.js';
+import { r as registerInstance, h as h$1 } from './index-b3a06de8.js';
+import { n as h } from './stencil-hooks.module-20ad2b5f.js';
 import './JSS-67b5cff8.js';
-import { T as TextSpanView } from './sqm-text-span-view-cd3902e5.js';
+import { T as TextSpanView } from './sqm-text-span-view-4c17b8c9.js';
 
 const TextSpan = class {
   constructor(hostRef) {

package/dist/esm/sqm-widget-verification-controller.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, h as h$1, c as Host } from './index-91e7729f.js';
-import { b as browser, n as h, k as useState, f as useEffect } from './stencil-hooks.module-4bc38af4.js';
-import { I as In, u as useCallback } from './index.module-89a79f66.js';
+import { r as registerInstance, h as h$1, c as Host } from './index-b3a06de8.js';
+import { b as browser, n as h, k as useState, f as useEffect } from './stencil-hooks.module-20ad2b5f.js';
+import { I as In, u as useCallback } from './index.module-d49ae5e7.js';
 import { a as VERIFICATION_PARENT_NAMESPACE } from './keys-406491dc.js';
 
 const debug = browser("sq:widget-verification");

package/dist/esm/sqm-widget-verification.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, h as h$1 } from './index-91e7729f.js';
-import { k as useState, f as useEffect, n as h } from './stencil-hooks.module-4bc38af4.js';
-import { d as dist, J, I as In, q as En, X as Xe, i as isDemo } from './index.module-89a79f66.js';
+import { r as registerInstance, h as h$1 } from './index-b3a06de8.js';
+import { k as useState, f as useEffect, n as h } from './stencil-hooks.module-20ad2b5f.js';
+import { d as dist, J, I as In, q as En, X as Xe, i as isDemo } from './index.module-d49ae5e7.js';
 import { g as getProps } from './utils-334c1e34.js';
 import { e as extractProps } from './extractProps-ae1afbb3.js';
 import { S as SHOW_CODE_NAMESPACE, V as VERIFICATION_EMAIL_NAMESPACE, a as VERIFICATION_PARENT_NAMESPACE } from './keys-406491dc.js';

package/dist/esm/{stencil-hooks.module-4bc38af4.js → stencil-hooks.module-20ad2b5f.js}

@@ -1,4 +1,4 @@
-import { g as getElement, a as getRenderingRef, f as forceUpdate } from './index-91e7729f.js';
+import { g as getElement, a as getRenderingRef, f as forceUpdate } from './index-b3a06de8.js';
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};