@saasquatch/mint-components 2.0.6-0 → 2.0.6-1

package/dist/cjs/sqm-banking-info-form_10.cjs.entry.js

@@ -16,7 +16,7 @@ const reRender = require('./re-render-d516138a.js');
 const useChildElements = require('./useChildElements-966c9041.js');
 const luxon = require('./luxon-949beaf2.js');
 const useReferralTable = require('./useReferralTable-90d4d6e9.js');
-const sqmUserInfoFormView = require('./sqm-user-info-form-view-c14ba407.js');
+const sqmUserInfoFormView = require('./sqm-user-info-form-view-7446bcdd.js');
 const data = require('./data-24028727.js');
 const keys = require('./keys-cff24974.js');
 const usePayoutStatus = require('./usePayoutStatus-98f2ca76.js');

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

@@ -36,7 +36,7 @@ require('./ErrorView-3f91e5ab.js');
 const sqmQrCodeView = require('./sqm-qr-code-view-4ccf89da.js');
 const ShadowViewAddon = require('./ShadowViewAddon-ae3a32c3.js');
 const sqmPortalContainerView = require('./sqm-portal-container-view-07e4343f.js');
-const sqmUserInfoFormView = require('./sqm-user-info-form-view-c14ba407.js');
+const sqmUserInfoFormView = require('./sqm-user-info-form-view-7446bcdd.js');
 const data = require('./data-24028727.js');
 const sqmLeadInputFieldView = require('./sqm-lead-input-field-view-2006001f.js');
 

package/dist/cjs/{sqm-user-info-form-view-c14ba407.js → sqm-user-info-form-view-7446bcdd.js}

@@ -1688,6 +1688,35 @@ const style$2 = {
       fontWeight: "var(--sl-font-weight-semibold)",
     },
   },
+  DropdownContent: {
+    padding: "var(--sl-spacing-xxx-small) var(--sl-spacing-x-small)",
+    fontSize: "var(--sl-font-size-small)",
+    fontFamily: "var(--sl-font-sans)",
+    fontWeight: "var(--sl-font-weight-normal)",
+    lineHeight: "var(--sl-line-height-dense)",
+    minWidth: "225px",
+    backgroundColor: "var(--sl-color-gray-900)",
+    color: "var(--sl-color-white)",
+    borderRadius: "var(--sl-border-radius-medium)",
+    position: "relative",
+    marginLeft: "5px",
+  },
+  DropdownArrow: {
+    position: "absolute",
+    left: "-5px",
+    top: "50%",
+    transform: "translateY(-50%)",
+    width: "0",
+    height: "0",
+    borderTop: "5px solid transparent",
+    borderBottom: "5px solid transparent",
+    borderRight: "5px solid var(--sl-color-gray-900)",
+    zIndex: "1",
+  },
+  DropdownLink: {
+    color: "var(--sl-color-white)",
+    textDecoration: "underline",
+  },
   PhoneInputsContainer: {
     display: "flex",
     gap: "4px",
@@ -1913,6 +1942,27 @@ const UserInfoFormView = (props) => {
     var _a;
     return states.isUser && !!((_a = data$1.userData) === null || _a === void 0 ? void 0 : _a[field]);
   }
+  const dropdownHover = (el) => {
+    var _a;
+    if (!el)
+      return;
+    const trigger = el.querySelector('[slot="trigger"]');
+    const panel = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".dropdown__panel");
+    if (!trigger || !panel)
+      return;
+    let hideTimeout;
+    const show = () => {
+      clearTimeout(hideTimeout);
+      el.show();
+    };
+    const scheduleHide = () => {
+      hideTimeout = setTimeout(() => el.hide(), 100);
+    };
+    trigger.addEventListener("mouseenter", show);
+    trigger.addEventListener("mouseleave", scheduleHide);
+    panel.addEventListener("mouseenter", show);
+    panel.addEventListener("mouseleave", scheduleHide);
+  };
   return (index.h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
     index.h("style", { type: "text/css" },
       styleString$1,
@@ -1951,6 +2001,16 @@ const UserInfoFormView = (props) => {
         }, {
           supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
         })))),
+      index.h("sl-dropdown", { placement: "right", distance: 1, ref: dropdownHover, style: { top: "-4px" } },
+        index.h("sl-icon", { slot: "trigger", name: "info-circle", style: { cursor: "pointer", width: "16px", height: "16px" } }),
+        index.h("div", { class: sheet$1.classes.DropdownContent },
+          index.h("div", { class: sheet$1.classes.DropdownArrow }),
+          "This is a test tooltip with a",
+          " ",
+          index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com`, style: {
+              color: "var(--sl-color-white)",
+              textDecoration: "underline",
+            } }, "clickable link"))),
       index.h("div", null,
         index.h("div", { class: classes.InputContainer },
           index.h("sl-input", Object.assign({ class: "ErrorInput", exportparts: "label: input-label, base: input-base", value: formState.firstName, label: text.firstName, disabled: states.disabled || isDisabledUserInput("firstName") }, (((_b = formState.errors) === null || _b === void 0 ? void 0 : _b.firstName) ? {

package/dist/collection/components/tax-and-cash/sqm-user-info-form/sqm-user-info-form-view.js

@@ -70,6 +70,35 @@ const style = {
       fontWeight: "var(--sl-font-weight-semibold)",
     },
   },
+  DropdownContent: {
+    padding: "var(--sl-spacing-xxx-small) var(--sl-spacing-x-small)",
+    fontSize: "var(--sl-font-size-small)",
+    fontFamily: "var(--sl-font-sans)",
+    fontWeight: "var(--sl-font-weight-normal)",
+    lineHeight: "var(--sl-line-height-dense)",
+    minWidth: "225px",
+    backgroundColor: "var(--sl-color-gray-900)",
+    color: "var(--sl-color-white)",
+    borderRadius: "var(--sl-border-radius-medium)",
+    position: "relative",
+    marginLeft: "5px",
+  },
+  DropdownArrow: {
+    position: "absolute",
+    left: "-5px",
+    top: "50%",
+    transform: "translateY(-50%)",
+    width: "0",
+    height: "0",
+    borderTop: "5px solid transparent",
+    borderBottom: "5px solid transparent",
+    borderRight: "5px solid var(--sl-color-gray-900)",
+    zIndex: "1",
+  },
+  DropdownLink: {
+    color: "var(--sl-color-white)",
+    textDecoration: "underline",
+  },
   PhoneInputsContainer: {
     display: "flex",
     gap: "4px",
@@ -295,6 +324,27 @@ export const UserInfoFormView = (props) => {
     var _a;
     return states.isUser && !!((_a = data.userData) === null || _a === void 0 ? void 0 : _a[field]);
   }
+  const dropdownHover = (el) => {
+    var _a;
+    if (!el)
+      return;
+    const trigger = el.querySelector('[slot="trigger"]');
+    const panel = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".dropdown__panel");
+    if (!trigger || !panel)
+      return;
+    let hideTimeout;
+    const show = () => {
+      clearTimeout(hideTimeout);
+      el.show();
+    };
+    const scheduleHide = () => {
+      hideTimeout = setTimeout(() => el.hide(), 100);
+    };
+    trigger.addEventListener("mouseenter", show);
+    trigger.addEventListener("mouseleave", scheduleHide);
+    panel.addEventListener("mouseenter", show);
+    panel.addEventListener("mouseleave", scheduleHide);
+  };
   return (h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
     h("style", { type: "text/css" },
       styleString,
@@ -333,6 +383,16 @@ export const UserInfoFormView = (props) => {
         }, {
           supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
         })))),
+      h("sl-dropdown", { placement: "right", distance: 1, ref: dropdownHover, style: { top: "-4px" } },
+        h("sl-icon", { slot: "trigger", name: "info-circle", style: { cursor: "pointer", width: "16px", height: "16px" } }),
+        h("div", { class: sheet.classes.DropdownContent },
+          h("div", { class: sheet.classes.DropdownArrow }),
+          "This is a test tooltip with a",
+          " ",
+          h("a", { target: "_blank", href: `mailto:advocate-support@impact.com`, style: {
+              color: "var(--sl-color-white)",
+              textDecoration: "underline",
+            } }, "clickable link"))),
       h("div", null,
         h("div", { class: classes.InputContainer },
           h("sl-input", Object.assign({ class: "ErrorInput", exportparts: "label: input-label, base: input-base", value: formState.firstName, label: text.firstName, disabled: states.disabled || isDisabledUserInput("firstName") }, (((_b = formState.errors) === null || _b === void 0 ? void 0 : _b.firstName) ? {

package/dist/esm/sqm-banking-info-form_10.entry.js

@@ -12,7 +12,7 @@ import { u as useRerenderListener, a as useRequestRerender } from './re-render-7
 import { u as useChildElements } from './useChildElements-3d872cef.js';
 import { l as luxon } from './luxon-bbf75a9d.js';
 import { g as generateUserError } from './useReferralTable-909ccb28.js';
-import { a as INDIRECT_TAX_SPAIN_REGIONS, b as INDIRECT_TAX_PROVINCES, O as OtherRegionSlotView, I as InvoiceTableView, v as vatLabels, A as ADDRESS_REGIONS, U as UserInfoFormView } from './sqm-user-info-form-view-9a3048d9.js';
+import { a as INDIRECT_TAX_SPAIN_REGIONS, b as INDIRECT_TAX_PROVINCES, O as OtherRegionSlotView, I as InvoiceTableView, v as vatLabels, A as ADDRESS_REGIONS, U as UserInfoFormView } from './sqm-user-info-form-view-0b068018.js';
 import { F as FORM_STEPS, a as TAX_FORM_CONTEXT_NAMESPACE, S as SORTED_COUNTRIES_NAMESPACE, c as USER_QUERY_NAMESPACE, T as TAX_CONTEXT_NAMESPACE, h as FINANCE_NETWORK_SETTINGS_NAMESPACE, t as taxTypeToName, l as validTaxDocument, U as USER_FORM_CONTEXT_NAMESPACE, d as COUNTRIES_QUERY_NAMESPACE, g as getCountryObj, C as CURRENCIES_NAMESPACE, o as objectIsFull } from './data-a581119a.js';
 import { b as VERIFICATION_EVENT_KEY } from './keys-406491dc.js';
 import { T as TAX_FORM_UPDATED_EVENT_KEY, a as useVeriffApp, g as getStatus, V as VERIFF_COMPLETE_EVENT_KEY } from './usePayoutStatus-7404eb9d.js';

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

@@ -32,7 +32,7 @@ import './ErrorView-bbf0a042.js';
 import { Q as QrCodeView } from './sqm-qr-code-view-ea505213.js';
 import { S as StatContainerView, B as BigStatView, a as ShareButtonView, P as PortalChangePasswordView, b as PoweredByImg$1, u as useDemoBigStat, T as TaskCardView, C as CardFeedView, c as CheckboxFieldView, d as PortalRegisterView, e as CouponCodeView, D as DropdownFieldView, E as EditProfileView, L as LeaderboardView, H as HeroView, I as InputFieldView, N as NameFieldsView, f as ChangeMarktingView, g as PortalFooterView, h as PortalForgotPasswordView, i as PortalFrameView, R as ReferralIframeView, 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 useShareButton, K as useShareLink, M as ProgressBarView, O as ProgressBar$2, Q as LeadFormView, U as LeadDropdownFieldView, V as ShadowViewAddon } from './ShadowViewAddon-78a1c35c.js';
 import { P as PortalContainerView, a as PortalSectionView } from './sqm-portal-container-view-176e92e3.js';
-import { I as InvoiceTableView, a as INDIRECT_TAX_SPAIN_REGIONS, b as INDIRECT_TAX_PROVINCES, O as OtherRegionSlotView, U as UserInfoFormView$1 } from './sqm-user-info-form-view-9a3048d9.js';
+import { I as InvoiceTableView, a as INDIRECT_TAX_SPAIN_REGIONS, b as INDIRECT_TAX_PROVINCES, O as OtherRegionSlotView, U as UserInfoFormView$1 } from './sqm-user-info-form-view-0b068018.js';
 import { t as taxTypeToName, L as LoadingView } from './data-a581119a.js';
 import { L as LeadInputFieldView } from './sqm-lead-input-field-view-d543d939.js';
 

package/dist/esm/{sqm-user-info-form-view-9a3048d9.js → sqm-user-info-form-view-0b068018.js}

@@ -1686,6 +1686,35 @@ const style$2 = {
       fontWeight: "var(--sl-font-weight-semibold)",
     },
   },
+  DropdownContent: {
+    padding: "var(--sl-spacing-xxx-small) var(--sl-spacing-x-small)",
+    fontSize: "var(--sl-font-size-small)",
+    fontFamily: "var(--sl-font-sans)",
+    fontWeight: "var(--sl-font-weight-normal)",
+    lineHeight: "var(--sl-line-height-dense)",
+    minWidth: "225px",
+    backgroundColor: "var(--sl-color-gray-900)",
+    color: "var(--sl-color-white)",
+    borderRadius: "var(--sl-border-radius-medium)",
+    position: "relative",
+    marginLeft: "5px",
+  },
+  DropdownArrow: {
+    position: "absolute",
+    left: "-5px",
+    top: "50%",
+    transform: "translateY(-50%)",
+    width: "0",
+    height: "0",
+    borderTop: "5px solid transparent",
+    borderBottom: "5px solid transparent",
+    borderRight: "5px solid var(--sl-color-gray-900)",
+    zIndex: "1",
+  },
+  DropdownLink: {
+    color: "var(--sl-color-white)",
+    textDecoration: "underline",
+  },
   PhoneInputsContainer: {
     display: "flex",
     gap: "4px",
@@ -1911,6 +1940,27 @@ const UserInfoFormView = (props) => {
     var _a;
     return states.isUser && !!((_a = data.userData) === null || _a === void 0 ? void 0 : _a[field]);
   }
+  const dropdownHover = (el) => {
+    var _a;
+    if (!el)
+      return;
+    const trigger = el.querySelector('[slot="trigger"]');
+    const panel = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".dropdown__panel");
+    if (!trigger || !panel)
+      return;
+    let hideTimeout;
+    const show = () => {
+      clearTimeout(hideTimeout);
+      el.show();
+    };
+    const scheduleHide = () => {
+      hideTimeout = setTimeout(() => el.hide(), 100);
+    };
+    trigger.addEventListener("mouseenter", show);
+    trigger.addEventListener("mouseleave", scheduleHide);
+    panel.addEventListener("mouseenter", show);
+    panel.addEventListener("mouseleave", scheduleHide);
+  };
   return (h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
     h("style", { type: "text/css" },
       styleString$1,
@@ -1949,6 +1999,16 @@ const UserInfoFormView = (props) => {
         }, {
           supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
         })))),
+      h("sl-dropdown", { placement: "right", distance: 1, ref: dropdownHover, style: { top: "-4px" } },
+        h("sl-icon", { slot: "trigger", name: "info-circle", style: { cursor: "pointer", width: "16px", height: "16px" } }),
+        h("div", { class: sheet$1.classes.DropdownContent },
+          h("div", { class: sheet$1.classes.DropdownArrow }),
+          "This is a test tooltip with a",
+          " ",
+          h("a", { target: "_blank", href: `mailto:advocate-support@impact.com`, style: {
+              color: "var(--sl-color-white)",
+              textDecoration: "underline",
+            } }, "clickable link"))),
       h("div", null,
         h("div", { class: classes.InputContainer },
           h("sl-input", Object.assign({ class: "ErrorInput", exportparts: "label: input-label, base: input-base", value: formState.firstName, label: text.firstName, disabled: states.disabled || isDisabledUserInput("firstName") }, (((_b = formState.errors) === null || _b === void 0 ? void 0 : _b.firstName) ? {