@saasquatch/mint-components 1.6.8-9 → 1.6.8

package/dist/collection/components/sqm-navigation-sidebar/sqm-navigation-sidebar-view.js

@@ -1,153 +1,153 @@
 import { h } from "@stencil/core";
-const vanillaStyle = `
-
-* {
-  padding: 0;
-  margin: 0;
-  box-sizing: border-box;
-}
-
-@keyframes slideIn {
-  0% {
-    left: -350px;
-  }
-  100% {
-    left: 0;
-  }
-} 
-
-@media screen and (min-width: 800px) {
-  :host {
-    max-width: 300px;
-  }
-  .toggler,
-  .hamburger {
-     user-select: none;
-     visibility:hidden;
-  }
-  .container{
-    position: sticky;
-    top: 0;
-  }
-  .menu-items {
-    min-width: 290px;
-    max-width: 320px;
-    box-sizing: border-box;
-    padding: 0px 15px;
-  }
-  .menu-items > :not(:last-child): {
-    margin-bottom: 4px;
-  }
-}
-@media screen and (max-width: 799px) {
-  .toggler {
-    border: 2px solid #eee;
-    cursor: pointer;
-    opacity: 0;
-    z-index: 5;
-  }
-
-  .container {
-    position: sticky;
-    top: 0;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 60px;
-    width: 60px;
-    flex-direction: column;
-    z-index: 100;
-  }
-  .menu-items { 
-    display: none;
-    padding: 20px;
-    border-right: 1px solid #eaeaea;
-    padding-top: 60px;
-    background: white; 
-    width: 100vw;
-    height: 100vh;
-    position: absolute;
-    top: 0;
-    right: 0;
-    left: 0px;
-    margin: 0;
-    animation: slideIn 500ms ease-in-out;
-  }
-
-  .toggler,
-  .hamburger {
-    visibility: visible !important;
-  }
-
-  .container {
-    display: flex;
-  }
-
-  .hamburger > .line {
-    visibility: visible !important;
-  }
-
-
-  .toggler,
-  .hamburger {
-    position: absolute;
-    padding: 20px 10px;
-  }
-
-  .toggler {
-    z-index: 100;
-    width: 100%;
-    height: 100%;
-  }
-
-  .hamburger {
-    z-index: 10;
-    width: 75%;
-    height: 100%;
-  }
-
-  .toggler:checked ~ .menu-items {
-    display: block;
-  }
-
-  /***** Turn hamburger into an X *****/
-  .toggler:checked ~ .hamburger > .line:nth-child(1) {
-    opacity: 0;
-  }
-
-  .toggler:checked ~ .hamburger > .line:nth-child(2) {
-    transform: rotate(45deg) translate(0px, -0.5px);
-  }
-
-  .toggler:checked ~ .hamburger > .line:nth-child(3) {
-    transform: rotate(-45deg) translate(3px, -3.5px);
-  }
-
-  .toggler:checked ~ .hamburger > .line:nth-child(1),
-  .toggler:checked ~ .hamburger > .line:nth-child(2),
-  .toggler:checked ~ .hamburger > .line:nth-child(3) {
-    width: 75%;
-    border-bottom: 3px solid #444445;
-    margin: 0;
-  }
-
-  .hamburger > .line {
-    visibility:hidden;
-    z-index: 2;
-    height: 4px;
-    width: 100%;
-    margin-bottom: 3px;
-    border-bottom: 5px solid #444445;
-  }
-}
+const vanillaStyle = `
+
+* {
+  padding: 0;
+  margin: 0;
+  box-sizing: border-box;
+}
+
+@keyframes slideIn {
+  0% {
+    left: -350px;
+  }
+  100% {
+    left: 0;
+  }
+} 
+
+@media screen and (min-width: 800px) {
+  :host {
+    max-width: 300px;
+  }
+  .toggler,
+  .hamburger {
+     user-select: none;
+     visibility:hidden;
+  }
+  .container{
+    position: sticky;
+    top: 0;
+  }
+  .menu-items {
+    min-width: 290px;
+    max-width: 320px;
+    box-sizing: border-box;
+    padding: 0px 15px;
+  }
+  .menu-items > :not(:last-child): {
+    margin-bottom: 4px;
+  }
+}
+@media screen and (max-width: 799px) {
+  .toggler {
+    border: 2px solid #eee;
+    cursor: pointer;
+    opacity: 0;
+    z-index: 5;
+  }
+
+  .container {
+    position: sticky;
+    top: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 60px;
+    width: 60px;
+    flex-direction: column;
+    z-index: 100;
+  }
+  .menu-items { 
+    display: none;
+    padding: 20px;
+    border-right: 1px solid #eaeaea;
+    padding-top: 60px;
+    background: white; 
+    width: 100vw;
+    height: 100vh;
+    position: absolute;
+    top: 0;
+    right: 0;
+    left: 0px;
+    margin: 0;
+    animation: slideIn 500ms ease-in-out;
+  }
+
+  .toggler,
+  .hamburger {
+    visibility: visible !important;
+  }
+
+  .container {
+    display: flex;
+  }
+
+  .hamburger > .line {
+    visibility: visible !important;
+  }
+
+
+  .toggler,
+  .hamburger {
+    position: absolute;
+    padding: 20px 10px;
+  }
+
+  .toggler {
+    z-index: 100;
+    width: 100%;
+    height: 100%;
+  }
+
+  .hamburger {
+    z-index: 10;
+    width: 75%;
+    height: 100%;
+  }
+
+  .toggler:checked ~ .menu-items {
+    display: block;
+  }
+
+  /***** Turn hamburger into an X *****/
+  .toggler:checked ~ .hamburger > .line:nth-child(1) {
+    opacity: 0;
+  }
+
+  .toggler:checked ~ .hamburger > .line:nth-child(2) {
+    transform: rotate(45deg) translate(0px, -0.5px);
+  }
+
+  .toggler:checked ~ .hamburger > .line:nth-child(3) {
+    transform: rotate(-45deg) translate(3px, -3.5px);
+  }
+
+  .toggler:checked ~ .hamburger > .line:nth-child(1),
+  .toggler:checked ~ .hamburger > .line:nth-child(2),
+  .toggler:checked ~ .hamburger > .line:nth-child(3) {
+    width: 75%;
+    border-bottom: 3px solid #444445;
+    margin: 0;
+  }
+
+  .hamburger > .line {
+    visibility:hidden;
+    z-index: 2;
+    height: 4px;
+    width: 100%;
+    margin-bottom: 3px;
+    border-bottom: 5px solid #444445;
+  }
+}
 `;
 export function NavigationSidebarView(props, children) {
-  return (h("div", { class: "container", part: "sqm-navigation-container" },
+  return (h("div", { class: "container" },
     h("style", null, vanillaStyle),
     h("input", Object.assign({ type: "checkbox", class: "toggler" }, props)),
     h("div", { class: "hamburger" },
       h("div", { class: "line" }),
       h("div", { class: "line" }),
       h("div", { class: "line" })),
-    h("div", { class: "menu-items", part: "sqm-navigation-menu-items" }, children)));
+    h("div", { class: "menu-items" }, children)));
 }

package/dist/collection/components/sqm-navigation-sidebar-item/sqm-navigation-sidebar-item-view.js

@@ -30,11 +30,11 @@ export function NavigationSidebarItemView(props) {
   };
   const sheet = createStyleSheet(style);
   const styleString = sheet.toString();
-  return (h("a", { part: "sqm-navigation-item-link", href: data.path, onClick: (e) => {
+  return (h("a", { href: data.path, onClick: (e) => {
       e.preventDefault();
       navigation.push(data.path);
     }, class: sheet.classes.ItemContainer },
     h("style", { type: "text/css" }, styleString),
     h("sl-icon", { class: sheet.classes.Icon, name: data.icon }),
-    h("p", { class: sheet.classes.Label, part: "sqm-navigation-item-label" }, data.label)));
+    h("p", { class: sheet.classes.Label }, data.label)));
 }

package/dist/collection/components/sqm-password-field/sqm-password-field-view.js

@@ -9,22 +9,22 @@ const style = {
   },
   ErrorStyle: ErrorStyles,
 };
-const vanillaStyle = `
-:host {
-  margin: 0 auto;
-  width: 100%;
-  display: block;
-}
-:host([hidden]): {
-  display: none;
-}
+const vanillaStyle = `
+:host {
+  margin: 0 auto;
+  width: 100%;
+  display: block;
+}
+:host([hidden]): {
+  display: none;
+}
 `;
 const sheet = createStyleSheet(style);
 const styleString = sheet.toString();
 export function PortalResetPasswordView(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
   const { states, callbacks } = props;
-  return (h("div", { class: sheet.classes.InputContainer, part: "sqm-password-field-container" },
+  return (h("div", { class: sheet.classes.InputContainer },
     h("style", { type: "text/css" },
       vanillaStyle,
       styleString),

package/dist/collection/components/sqm-popup-container/sqm-popup-container-view.js

@@ -3,8 +3,8 @@ const PopupContainerView = (props) => {
   const { states, callbacks } = props;
   const { styles } = states;
   return (h(Host, { class: "squatch-container" },
-    h("div", { style: { padding: props.states.styles.padding }, part: "sqm-popup-container" },
-      styles.closeButton && (h("span", { part: "sqm-popup-container-close-btn", class: "close squatch-header-close", "data-close-panel": "#squatch-panel", onClick: () => callbacks.closePopup() }, styles.closeButtonText)),
+    h("div", { style: { padding: props.states.styles.padding } },
+      styles.closeButton && (h("span", { class: "close squatch-header-close", "data-close-panel": "#squatch-panel", onClick: () => callbacks.closePopup() }, styles.closeButtonText)),
       h("slot", null),
       styles.poweredBy ? (h("a", { class: "sqh-attribution", href: "https://www.saasquatch.com/?utm_source=app&utm_medium=user-widget&utm_campaign=referral-widget", target: "_blank" }, "Powered By")) : (""))));
 };

package/dist/collection/components/sqm-portal-container/sqm-portal-container-view.js

@@ -16,14 +16,14 @@ export function PortalContainerView(props, children) {
       justifyContent: props.justifyContent,
     },
   };
-  const vanillaStyle = `
-  :host{
-    width: 100%;
-    display: block;
+  const vanillaStyle = `
+  :host{
+    width: 100%;
+    display: block;
   }`;
   const sheet = createStyleSheet(style);
   const styleString = sheet.toString();
-  return (h("div", { class: sheet.classes.Container, part: 'sqm-base' },
+  return (h("div", { class: sheet.classes.Container },
     h("style", { type: "text/css" },
       vanillaStyle,
       styleString),

package/dist/collection/components/sqm-portal-container/sqm-portal-container.js

@@ -200,7 +200,7 @@ export class PortalContainer {
       "type": "string",
       "mutable": false,
       "complexType": {
-        "original": "| \"start\"\n    | \"center\"\n    | \"end\"\n    | \"space-between\"\n    | \"space-around\"\n    | \"space-evenly\"",
+        "original": "| \"start\"\r\n    | \"center\"\r\n    | \"end\"\r\n    | \"space-between\"\r\n    | \"space-around\"\r\n    | \"space-evenly\"",
         "resolved": "\"center\" | \"end\" | \"space-around\" | \"space-between\" | \"space-evenly\" | \"start\"",
         "references": {}
       },

package/dist/collection/components/sqm-portal-email-verification/sqm-portal-email-verification-view.js

@@ -26,13 +26,13 @@ const style = {
     },
   },
 };
-const vanillaStyle = `
-:host {
-  display: block;
-}
-:host([hidden]): {
-  display: none;
-}
+const vanillaStyle = `
+:host {
+  display: block;
+}
+:host([hidden]): {
+  display: none;
+}
 `;
 const sheet = createStyleSheet(style);
 const styleString = sheet.toString();

package/dist/collection/components/sqm-portal-footer/PortalFooter.stories.js

@@ -22,4 +22,3 @@ export const FooterWithTerms = () => (h(PortalFooterView, Object.assign({}, defa
 export const FooterWithFAQ = () => (h(PortalFooterView, Object.assign({}, defaultProps, { faqLink: "https://example.com", faqText: "FAQ" })));
 export const FooterWithTermsAndFAQ = () => (h(PortalFooterView, Object.assign({}, defaultProps, { termsLink: "https://example.com", termsText: "Terms and Conditions", faqLink: "https://example.com", faqText: "FAQ" })));
 export const FooterNoPoweredBy = () => (h(PortalFooterView, Object.assign({}, defaultProps, { termsLink: "https://example.com", termsText: "Terms and Conditions", faqLink: "https://example.com", faqText: "FAQ", hidePoweredBy: true })));
-export const FooterNoSupportText = () => (h(PortalFooterView, Object.assign({}, defaultProps, { termsLink: "https://example.com", termsText: "Terms and Conditions", faqLink: "https://example.com", faqText: "FAQ", hideSupportText: true })));

package/dist/collection/components/sqm-portal-footer/sqm-portal-footer-view.js

@@ -2,16 +2,16 @@ import { h } from "@stencil/core";
 import { createStyleSheet } from "../../styling/JSS";
 import { intl } from "../../global/global";
 import { PoweredByImg } from "./PoweredByImg";
-const vanillaStyle = `
-  :host{
-    margin: 0 auto;
-    width: 100%;
-  }
-  a{
-    cursor:pointer;
-    color: inherit;
-    text-decoration: none;
-  }
+const vanillaStyle = `
+  :host{
+    margin: 0 auto;
+    width: 100%;
+  }
+  a{
+    cursor:pointer;
+    color: inherit;
+    text-decoration: none;
+  }
 `;
 export function PortalFooterView(props) {
   const style = {
@@ -31,14 +31,12 @@ export function PortalFooterView(props) {
       "padding-right": `var(--sl-spacing-${props.paddingRight})`,
       "padding-bottom": `var(--sl-spacing-${props.paddingBottom})`,
       "padding-left": `var(--sl-spacing-${props.paddingLeft})`,
-      "row-gap": `var(--sl-spacing-small)`,
       "& a:hover": {
         color: "var(--sl-color-gray-900)",
       },
     },
     SupportText: {
       textAlign: "center",
-      margin: 0,
     },
     PoweredByLink: {
       color: "var(--sl-color-gray-400)",
@@ -50,19 +48,19 @@ export function PortalFooterView(props) {
   };
   const sheet = createStyleSheet(style);
   const styleString = sheet.toString();
-  return (h("div", { class: sheet.classes.Container, part: "sqm-footer-container" },
+  return (h("div", { class: sheet.classes.Container },
     h("style", { type: "text/css" },
       vanillaStyle,
       styleString),
     h("div", { class: sheet.classes.RowContainer },
       props.faqLink && (h("a", { target: "_blank", href: props.faqLink }, props.faqText)),
       props.termsLink && (h("a", { target: "_blank", href: props.termsLink }, props.termsText))),
-    !props.hideSupportText && (h("p", { class: sheet.classes.SupportText }, intl.formatMessage({
+    h("p", { class: sheet.classes.SupportText }, intl.formatMessage({
       id: "supportFooter",
       defaultMessage: props.supportText,
     }, {
       email: (h("a", { target: "_blank", href: `mailto:${props.supportEmail}` }, props.supportEmail)),
-    }))),
+    })),
     !props.hidePoweredBy && (h("a", { class: sheet.classes.PoweredByLink, target: "_blank", href: props.poweredByLink },
       h(PoweredByImg, null)))));
 }

package/dist/collection/components/sqm-portal-footer/sqm-portal-footer.js

@@ -8,10 +8,6 @@ import { PortalFooterView } from "./sqm-portal-footer-view";
 export class PortalFooter {
   constructor() {
     this.ignored = true;
-    /**
-     * @uiName Hide the support text
-     */
-    this.hideSupportText = false;
     /**
      * @uiName Support Email
      */
@@ -63,27 +59,6 @@ export class PortalFooter {
   static get encapsulation() { return "shadow"; }
   static get assetsDirs() { return ["../../assets"]; }
   static get properties() { return {
-    "hideSupportText": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Hide the support text",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "hide-support-text",
-      "reflect": false,
-      "defaultValue": "false"
-    },
     "supportEmail": {
       "type": "string",
       "mutable": false,

package/dist/collection/components/sqm-portal-forgot-password/sqm-portal-forgot-password-view.js

@@ -11,19 +11,19 @@ const style = {
     width: "25%",
   },
 };
-const vanillaStyle = `
-:host {
-  display: block;
-}
-:host([hidden]): {
-  display: none;
-}
+const vanillaStyle = `
+:host {
+  display: block;
+}
+:host([hidden]): {
+  display: none;
+}
 `;
 const sheet = createStyleSheet(style);
 const styleString = sheet.toString();
 export function PortalForgotPasswordView(props) {
   const { states, callbacks, content } = props;
-  return (h("div", { class: sheet.classes.Wrapper, part: "sqm-forgot-password-container" },
+  return (h("div", { class: sheet.classes.Wrapper },
     h("style", { type: "text/css" },
       vanillaStyle,
       styleString),

package/dist/collection/components/sqm-portal-frame/sqm-portal-frame-view.js

@@ -39,11 +39,11 @@ const sheet = createStyleSheet(style);
 const styleString = sheet.toString();
 export function PortalFrameView(props, children) {
   const { data, notFullScreen } = props;
-  return (h("div", { style: { minHeight: notFullScreen ? "100%" : "100vh" }, class: sheet.classes.Frame, part: "sqm-portal-frame-container" },
+  return (h("div", { style: { minHeight: notFullScreen ? "100%" : "100vh" }, class: sheet.classes.Frame },
     h("style", { type: "text/css" }, styleString),
-    h("div", { class: sheet.classes.HeaderWrapper, part: "sqm-portal-frame-header" },
+    h("div", { class: sheet.classes.HeaderWrapper },
       data.header,
       h("slot", { name: "sqm-navigation-menu" })),
     children,
-    h("div", { class: sheet.classes.FooterWrapper, part: "sqm-portal-frame-footer" }, data.footer)));
+    h("div", { class: sheet.classes.FooterWrapper }, data.footer)));
 }

package/dist/collection/components/sqm-portal-login/sqm-portal-login-view.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { AuthButtonsContainer, AuthColumn, AuthWrapper, } from "../../global/mixins";
+import { AuthButtonsContainer, AuthColumn, AuthWrapper } from "../../global/mixins";
 import { createStyleSheet } from "../../styling/JSS";
 import { TextSpanView } from "../sqm-text-span/sqm-text-span-view";
 const style = {
@@ -15,19 +15,19 @@ const style = {
   },
   ButtonsContainer: AuthButtonsContainer,
 };
-const vanillaStyle = `
-:host {
-  display: block;
-}
-:host([hidden]): {
-  display: none;
-}
+const vanillaStyle = `
+:host {
+  display: block;
+}
+:host([hidden]): {
+  display: none;
+}
 `;
 const sheet = createStyleSheet(style);
 const styleString = sheet.toString();
 export function PortalLoginView(props) {
   const { states, callbacks, content } = props;
-  return (h("div", { class: sheet.classes.Wrapper, part: "sqm-portal-login-container" },
+  return (h("div", { class: sheet.classes.Wrapper },
     h("style", { type: "text/css" },
       vanillaStyle,
       styleString),

package/dist/collection/components/sqm-portal-profile/sqm-portal-profile-view.js

@@ -56,7 +56,7 @@ export function PortalProfileView(props) {
     type: "region",
   })
     : "";
-  return (h("div", { class: sheet.classes.Container, part: "sqm-portal-profile-container" },
+  return (h("div", { class: sheet.classes.Container },
     h("style", { type: "text/css" }, styleString),
     h(TextSpanView, Object.assign({}, { type: "h1" }), text.editProfileHeader),
     h(TextSpanView, Object.assign({}, { type: "h2" }), text.editProfileSubHeader),