@saasquatch/mint-components 1.15.0-61 → 1.15.0-62

package/dist/cjs/{ErrorView-5504c2b6.js → ErrorView-0f564e2a.js}

@@ -7,7 +7,7 @@ const styles = {
   Alert: {
     "&::part(base)": {
       backgroundColor: "var(--sl-color-danger-100)",
-      border: "1px solid var(--sl-color-danger-200)",
+      border: "var(--sqm-border-thickness, 1px) solid var(--sl-color-danger-200)",
       padding: "0 16px",
     },
     "& sl-icon": {

package/dist/cjs/{GenericTableView-107ade89.js → GenericTableView-a9845e80.js}

@@ -18,9 +18,9 @@ function GenericTableView(props) {
       tableLayout: "fixed",
       width: "100%",
       "& tbody tr": {
-        borderBottom: "1px solid var(--sqm-border-color)",
+        borderBottom: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
         "&:first-child": {
-          borderTop: "1px solid var(--sqm-border-color)",
+          borderTop: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
         },
       },
       "& th": {
@@ -42,7 +42,7 @@ function GenericTableView(props) {
         "& tr": {
           display: "block",
           background: "inherit",
-          border: "1px solid var(--sqm-border-color)",
+          border: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
           boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
           borderRadius: "var(--sl-border-radius-large)",
           padding: "var(--sl-spacing-medium)",

package/dist/cjs/{IndirectTaxDetailsView-14d6e170.js → IndirectTaxDetailsView-d7d3a220.js}

@@ -513,7 +513,7 @@ const style$1 = {
     gap: "16px",
   },
   HR: {
-    border: "1px solid #E0E0E0",
+    border: "var(--sqm-border-thickness, 1px) solid #E0E0E0",
     margin: "10px 0",
   },
   Input: { maxWidth: "500px" },
@@ -528,7 +528,7 @@ const style$1 = {
   ErrorInput: {
     maxWidth: "500px",
     "&::part(base)": {
-      border: "1px solid var(--sl-color-danger-500)",
+      border: "var(--sqm-border-thickness, 1px) solid var(--sl-color-danger-500)",
       borderRadius: "var(--sl-input-border-radius-medium)",
     },
     "&::part(help-text)": {

package/dist/cjs/{ShadowViewAddon-8ec56e95.js → ShadowViewAddon-dbc78438.js}

@@ -9,7 +9,7 @@ const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
 const useReferralCodes = require('./useReferralCodes-11cdf43b.js');
 const mixins = require('./mixins-4761d472.js');
-const copyTextView = require('./copy-text-view-95cf4875.js');
+const copyTextView = require('./copy-text-view-e5223a96.js');
 const useChildElements = require('./useChildElements-966c9041.js');
 const luxon = require('./luxon-949beaf2.js');
 const sqmTextSpanView = require('./sqm-text-span-view-7a61ae4c.js');
@@ -160,7 +160,7 @@ function StatContainerView(props, children) {
       "& > *": {
         "border-right": props.hideBorder
           ? "none"
-          : "1px solid var(--sqm-text-subdued)",
+          : "var(--sqm-border-thickness) solid var(--sqm-border-color)",
         "padding-right": divideSpace(),
       },
       "& > :last-child": {
@@ -169,7 +169,7 @@ function StatContainerView(props, children) {
       "& > ::slotted(*)": {
         "border-right": props.hideBorder
           ? "none"
-          : "1px solid var(--sqm-text-subdued)",
+          : "var(--sqm-border-thickness) solid var(--sqm-border-color)",
         "padding-right": divideSpace(),
       },
       "& > ::slotted(*:last-child)": {
@@ -185,7 +185,7 @@ function StatContainerView(props, children) {
       display: "flex",
     },
     BorderFix: {
-      "border-right": "1px solid transparent",
+      "border-right": "var(--sqm-border-thickness) solid transparent",
       width: "0px",
       "margin-left": "-1px",
     },
@@ -1798,7 +1798,7 @@ function TaskCardView(props) {
         position: "relative",
         boxSizing: "border-box",
         background: content.backgroundColor || "var(--sqm-portal-background)",
-        border: `1px solid ${content.borderColor || "var(--sqm-border-color)"}`,
+        border: `var(--sqm-border-thickness) solid ${content.borderColor || "var(--sqm-border-color)"}`,
         borderRadius: "var(--sqm-border-radius-normal)",
         boxShadow: "1px 2px 4px rgba(211, 211, 211, 0.2)",
         fontSize: "var(--sl-font-size-small)",
@@ -1831,7 +1831,7 @@ function TaskCardView(props) {
       fontSize: "var(--sl-font-size-small)",
       padding: "var(--sl-spacing-medium)",
       color: content.textColor || "var(--sl-color-primary-600)",
-      border: `1px solid ${content.borderColor || "var(--sl-color-neutral-200)"}`,
+      border: `var(--sqm-border-thickness, 1px) solid ${content.borderColor || "var(--sl-color-neutral-200)"}`,
       borderRadius: "var(--sqm-border-radius-normal) var(--sqm-border-radius-normal) 0 0",
       borderBottom: "none",
       background: content.backgroundColor || "var(--sl-color-primary-50)",
@@ -1848,7 +1848,7 @@ function TaskCardView(props) {
       fontSize: "var(--sl-font-size-small)",
       padding: "var(--sl-spacing-medium)",
       color: content.textColor || "var(--sl-color-warning-600)",
-      border: `1px solid ${content.borderColor || "var(--sl-color-neutral-200)"}`,
+      border: `var(--sqm-border-thickness, 1px) solid ${content.borderColor || "var(--sl-color-neutral-200)"}`,
       borderRadius: "var(--sqm-border-radius-normal) var(--sqm-border-radius-normal) 0 0",
       borderBottom: "none",
       background: content.backgroundColor || "var(--sl-color-warning-50)",
@@ -2643,7 +2643,7 @@ sl-input::part(base):focus,
 sl-select::part(form-control-wrapper):focus,
 sl-textare::part(textarea-label):focus {
   border-color: none;
-  border: var(--sqm-input-focus-border, 1px solid var(--sl-input-border-color-focus));
+  border: var(--sqm-input-focus-border, var(--sqm-border-thickness) solid var(--sl-input-border-color-focus));
 }
 
 *::part(input-label):disabled, *::part(select-label):disabled, *::part(textarea-label):disabled{

package/dist/cjs/{copy-text-view-95cf4875.js → copy-text-view-e5223a96.js}

@@ -37,10 +37,10 @@ function CopyTextView(props) {
         color: props.textColor || "var(--sqm-text)",
       },
       "&::part(base)": {
-        "--sl-input-border-radius": "var(--sqm-border-radius-normal)",
-        "--sl-input-background-color": "var(--sl-color-white)",
+        "--sl-input-border-radius": `${props.borderRadius}px` || "var(--sqm-border-radius-normal)",
+        "--sl-input-background-color": props.backgroundColor || "var(--sqm-portal-background)",
         "--sl-input-color": "var(--sqm-text)",
-        "--sl-input-border-color": "#D6D8F0",
+        "--sl-input-border-color": "var(--sqm-border-color)",
         "--sl-input-border-color-hover": "#999999",
         "--sl-input-border-color-focus": "#999999",
         "--sl-input-color-hover": "var(--sqm-input-color-hover)",
@@ -52,7 +52,7 @@ function CopyTextView(props) {
         overflow: "visible",
         borderRadius: `${props.borderRadius}px` || "var(--sqm-border-radius-normal)",
         background: props.backgroundColor || "var(--sqm-portal-background)",
-        border: `1px solid ${props.borderColor || "#d4d4d8"}`,
+        border: `var(--sqm-border-thickness) solid ${props.borderColor || "var(--sqm-border-color)"}`,
       },
       width: "100%",
     },

package/dist/cjs/{email-registration-view-996fb438.js → email-registration-view-ace50780.js}

@@ -46,7 +46,9 @@ function EmailRegistrationView(props) {
   };
   const emailValidationRegex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
   return (index.h("div", { part: "sqm-base", class: sheet.classes.Wrapper, style: {
-      border: `${content.hideBorder ? "none" : "1px solid var(--sqm-border-color)"}`,
+      border: `${content.hideBorder
+        ? "none"
+        : "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)"}`,
       backgroundColor: content.backgroundColor,
       "padding-top": `var(--sl-spacing-${content.paddingTop})`,
       "padding-right": `var(--sl-spacing-${content.paddingRight})`,

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

@@ -11,12 +11,12 @@ const cjs = require('./cjs-1066ec21.js');
 const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
 require('./mixins-4761d472.js');
-const GenericTableView = require('./GenericTableView-107ade89.js');
+const GenericTableView = require('./GenericTableView-a9845e80.js');
 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 IndirectTaxDetailsView = require('./IndirectTaxDetailsView-14d6e170.js');
+const IndirectTaxDetailsView = require('./IndirectTaxDetailsView-d7d3a220.js');
 const utils$1 = require('./utils-940abb91.js');
 const data = require('./data-d4339c2e.js');
 const keys = require('./keys-cff24974.js');
@@ -614,8 +614,8 @@ const style = {
   InputContainer: {
     padding: "16px",
     margin: "16px 0px 16px 0px",
-    borderTop: "1px solid var(--sqm-border-color)",
-    borderBottom: "1px solid var(--sqm-border-color)",
+    borderTop: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
+    borderBottom: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
     display: "flex",
     flexDirection: "column",
     width: "100%",
@@ -1861,7 +1861,7 @@ const style$1 = {
     gap: "10px",
     margin: "auto",
     textAlign: "center",
-    border: "1px solid var(--sqm-border-color)",
+    border: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
     justifyContent: "center",
   },
   MessageContainer: {
@@ -2504,7 +2504,7 @@ const vanillaStyle$2 = `
     }
 
     hr {
-      border: 1px solid var(--sqm-border-color);
+      border: var(--sqm-border-thickness, 1px) solid var(--sqm-border-color);
     }
 
     a {
@@ -3503,7 +3503,7 @@ const style$4 = {
     borderRadius: "var(--sqm-border-radius-normal)",
     padding: "var(--sl-spacing-large)",
     minHeight: "150px",
-    border: "1px solid var(--sqm-border-color)",
+    border: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
     maxWidth: "450px",
   },
   StatusContainer: {
@@ -3527,7 +3527,7 @@ const style$4 = {
     width: "auto",
   },
   PaypalEmail: {
-    borderRight: "1px solid var(--sqm-border-color)",
+    borderRight: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
     paddingRight: "var(--sl-spacing-small)",
     "@media (max-width: 499px)": {
       borderRight: "none",
@@ -3569,7 +3569,7 @@ const style$4 = {
     gap: "var(--sl-spacing-xx-small) var(--sl-spacing-small)",
     paddingTop: "var(--sq-spacing-xx-small)",
     "& > :not(:last-child)": {
-      borderRight: "1px solid var(--sqm-border-color)",
+      borderRight: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
     },
     "& > :nth-child(3)": {
       border: "none",
@@ -3586,7 +3586,7 @@ const style$4 = {
   },
   W9Container: {
     paddingTop: "var(--sl-spacing-large)",
-    borderTop: "1px solid var(--sqm-border-color)",
+    borderTop: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
   },
   SkeletonOne: {
     width: "25%",
@@ -3603,7 +3603,7 @@ const style$4 = {
   Alert: {
     "&::part(base)": {
       backgroundColor: "var(--sqm-warning-color-background)",
-      border: "1px solid var(--sqm-warning-color-border)",
+      border: "var(--sqm-border-thickness, 1px) solid var(--sqm-warning-color-border)",
       padding: "0 16px",
     },
     "& sl-icon": {
@@ -3868,7 +3868,7 @@ const style$5 = {
   },
   IndirectTaxPreviewContainer: {
     marginTop: "var(--sl-spacing-x-large)",
-    borderTop: "1px solid var(--sqm-border-color)",
+    borderTop: "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color)",
   },
   IndirectTaxPreviewHeaderContainer: {
     marginTop: "var(--sl-spacing-large)",
@@ -5725,7 +5725,7 @@ const style$6 = {
   FormWrapper: {},
   ErrorInput: {
     "&::part(base)": {
-      border: "1px solid var(--sqm-danger-color-icon)",
+      border: "var(--sqm-border-thickness, 1px) solid var(--sqm-danger-color-icon)",
       borderRadius: "var(--sl-input-border-radius-medium)",
     },
     "&::part(help-text)": {

package/dist/cjs/sqm-big-stat_42.cjs.entry.js

@@ -12,7 +12,7 @@ const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
 require('./useReferralCodes-11cdf43b.js');
 require('./mixins-4761d472.js');
-const copyTextView = require('./copy-text-view-95cf4875.js');
+const copyTextView = require('./copy-text-view-e5223a96.js');
 const reRender = require('./re-render-d516138a.js');
 const useChildElements = require('./useChildElements-966c9041.js');
 require('./luxon-949beaf2.js');
@@ -23,7 +23,7 @@ const sqmPortalLoginView = require('./sqm-portal-login-view-bb50304c.js');
 const usePortalLogin = require('./usePortalLogin-1c022d8d.js');
 const AsYouType = require('./AsYouType-6788393a.js');
 const utilities = require('./utilities-9a0c5e91.js');
-const ShadowViewAddon = require('./ShadowViewAddon-8ec56e95.js');
+const ShadowViewAddon = require('./ShadowViewAddon-dbc78438.js');
 require('./sqm-portal-container-view-07e4343f.js');
 const usePayoutStatus = require('./usePayoutStatus-3b34dab1.js');
 
@@ -1141,14 +1141,14 @@ function DividedLayoutView(props, children) {
       return {
         "border-right": props.borderless
           ? "none"
-          : `1px solid ${props.borderColor || "var(--sqm-text)"}`,
+          : `var(--sqm-border-thickness) solid ${props.borderColor || "var(--sqm-border-color)"}`,
       };
     }
     else {
       return {
         "border-bottom": props.borderless
           ? "none"
-          : `1px solid ${props.borderColor || "var(--sqm-text)"}`,
+          : `var(--sqm-border-thickness) solid ${props.borderColor || "var(--sqm-border-color)"}`,
       };
     }
   };
@@ -1209,7 +1209,7 @@ const DividedLayout = class {
      * Uses Shorthand CSS border syntax allowing specification of thickness, fill style and color.
      * @uiName Border style
      */
-    this.dividerStyle = "1px solid #EAEAEA";
+    this.dividerStyle = "var(--sqm-border-thickness) solid var(--sqm-border-color)";
     /**
      * Background color of the divider
      * @uiName Divider Background Color
@@ -3241,21 +3241,20 @@ const PortalFrame = class {
      * @uiWidget color
      * @uiType string
      */
-    this.backgroundColor = "var(--sqm-portal-background, #fff);";
-    // TODO: Replace with border variable later
+    this.backgroundColor = "var(--sqm-portal-background, #fff)";
     /**
      * Borders placed to seperate the header and footer from the body content.
      * @uiName Border
      * @uiType string
      */
-    this.border = "1px solid var(--sqm-text, #eaeaea);";
+    this.border = "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color, #eaeaea)";
     /**
      * Background color for the header and footer.
      * @uiName Header and Footer Background Color
      * @uiWidget color
      * @uiType string
      */
-    this.headerAndFooterBackgroundColor = "var(--sqm-portal-background, #fff);";
+    this.headerAndFooterBackgroundColor = "var(--sqm-portal-background, #fff)";
     domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
@@ -3904,7 +3903,9 @@ function ReferralCardView(props) {
   const styleString = sheet.toString();
   const borderColor = props.borderColor || "var(--sqm-border-color)";
   return (index.h("div", { part: "sqm-base", class: sheet.classes.Container, style: {
-      border: `${props.hideBorder ? "none" : "1px solid " + borderColor}`,
+      border: `${props.hideBorder
+        ? "none"
+        : `var(--sqm-border-thickness) solid ${borderColor}`}`,
       "padding-top": `var(--sl-spacing-${props.paddingTop})`,
       "padding-right": `var(--sl-spacing-${props.paddingRight})`,
       "padding-bottom": `var(--sl-spacing-${props.paddingBottom})`,

package/dist/cjs/sqm-instant-access-registration.cjs.entry.js

@@ -9,7 +9,7 @@ require('./jsonpointer-11327262.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./JSS-8503a151.js');
 require('./mixins-4761d472.js');
-const emailRegistrationView = require('./email-registration-view-996fb438.js');
+const emailRegistrationView = require('./email-registration-view-ace50780.js');
 require('./useRegistrationFormState-bbee6e7b.js');
 const useInstantAccessRegistration = require('./useInstantAccessRegistration-08bcb487.js');
 

package/dist/cjs/sqm-invoice-table-data-cell_5.cjs.entry.js

@@ -70,7 +70,7 @@ const TableRow = class {
     /**
      * @uiName Border
      */
-    this.border = "1px solid #EAEAEA";
+    this.border = "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color, #eaeaea)";
   }
   render() {
     return (index.h(index.Host, { style: { display: "contents" } }, index.h("tr", { style: { border: this.border } }, index.h("slot", null))));

package/dist/cjs/{sqm-navigation-sidebar-view-50ee8796.js → sqm-navigation-sidebar-view-de90ef03.js}

@@ -75,7 +75,7 @@ function NavigationSidebarView(props, children) {
   .menu-items {
     display: none;
     padding: 20px;
-    border-right: 1px solid #eaeaea;
+    border-right: var(--sqm-border-thickness) solid var(--sqm-border-color);
     padding-top: 60px;
     background: var(--sqm-portal-background); 
     width: 100vw;

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

@@ -6,7 +6,7 @@ const index = require('./index-a43a63b4.js');
 const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
 const index_module = require('./index.module-4f54e412.js');
 const cjs = require('./cjs-1066ec21.js');
-const sqmNavigationSidebarView = require('./sqm-navigation-sidebar-view-50ee8796.js');
+const sqmNavigationSidebarView = require('./sqm-navigation-sidebar-view-de90ef03.js');
 
 const NavigationSidebar = class {
   constructor(hostRef) {

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

@@ -11,7 +11,7 @@ const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
 const useReferralCodes = require('./useReferralCodes-11cdf43b.js');
 require('./mixins-4761d472.js');
-const copyTextView = require('./copy-text-view-95cf4875.js');
+const copyTextView = require('./copy-text-view-e5223a96.js');
 
 const style = {
   Container: {

package/dist/cjs/sqm-portal-forgot-password.cjs.entry.js

@@ -112,7 +112,7 @@ const PortalForgotPassword = class {
      * @uiName Border style
      * @uiWidget textArea
      */
-    this.border = "1px solid var(--sqm-border-color, #eaeaea)";
+    this.border = "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color, #eaeaea)";
     domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }

package/dist/cjs/{sqm-qr-code-view-2cca145e.js → sqm-qr-code-view-af9f6df7.js}

@@ -2,7 +2,7 @@
 
 const index = require('./index-a43a63b4.js');
 const JSS = require('./JSS-8503a151.js');
-const ErrorView = require('./ErrorView-5504c2b6.js');
+const ErrorView = require('./ErrorView-0f564e2a.js');
 
 const style = {
   DialogContainer: {

package/dist/cjs/sqm-qr-code.cjs.entry.js

@@ -9,8 +9,8 @@ const cjs = require('./cjs-1066ec21.js');
 const utils = require('./utils-6847bc06.js');
 require('./JSS-8503a151.js');
 const useReferralCodes = require('./useReferralCodes-11cdf43b.js');
-require('./ErrorView-5504c2b6.js');
-const sqmQrCodeView = require('./sqm-qr-code-view-2cca145e.js');
+require('./ErrorView-0f564e2a.js');
+const sqmQrCodeView = require('./sqm-qr-code-view-af9f6df7.js');
 
 const ShareLinkQuery = index_module.dist.gql `
   query shareLink($programId: ID, $engagementMedium: UserEngagementMedium!) {

package/dist/cjs/sqm-referral-table_11.cjs.entry.js

@@ -10,7 +10,7 @@ const cjs = require('./cjs-1066ec21.js');
 const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
 require('./mixins-4761d472.js');
-const GenericTableView = require('./GenericTableView-107ade89.js');
+const GenericTableView = require('./GenericTableView-a9845e80.js');
 const reRender = require('./re-render-d516138a.js');
 const useChildElements = require('./useChildElements-966c9041.js');
 const luxon = require('./luxon-949beaf2.js');
@@ -457,7 +457,7 @@ const ReferralTableRewardsCell = class {
           padding: "var(--sl-spacing-x-small) var(--sl-spacing-medium)",
         },
         "&::part(base)": {
-          border: "1px solid var(--sqm-border-color)",
+          border: "var(--sqm-border-thickness) solid var(--sqm-border-color)",
           opacity: "1",
         },
         "&::part(summary-icon)": {

package/dist/cjs/sqm-referred-registration.cjs.entry.js

@@ -9,7 +9,7 @@ require('./jsonpointer-11327262.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./JSS-8503a151.js');
 require('./mixins-4761d472.js');
-const emailRegistrationView = require('./email-registration-view-996fb438.js');
+const emailRegistrationView = require('./email-registration-view-ace50780.js');
 require('./useRegistrationFormState-bbee6e7b.js');
 const useInstantAccessRegistration = require('./useInstantAccessRegistration-08bcb487.js');
 

package/dist/cjs/sqm-rewards-table_9.cjs.entry.js

@@ -10,7 +10,7 @@ const cjs = require('./cjs-1066ec21.js');
 const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
 require('./mixins-4761d472.js');
-const GenericTableView = require('./GenericTableView-107ade89.js');
+const GenericTableView = require('./GenericTableView-a9845e80.js');
 const reRender = require('./re-render-d516138a.js');
 const useChildElements = require('./useChildElements-966c9041.js');
 const luxon = require('./luxon-949beaf2.js');