@saasquatch/mint-components 1.6.2-17 → 1.6.2-18

package/dist/collection/components/sqm-timeline/sqm-timeline-entry-view.js

@@ -1,77 +1,77 @@
-import { h } from "@stencil/core";
-import { createStyleSheet } from "../../styling/JSS";
-import { Circle, Gift } from "./SVGs";
-const style = {
-  TimelineReward: {
-    color: "var(--sl-color-neutral-900)",
-    lineHeight: "var(--sl-line-height-dense)",
-    "& .container": {
-      display: "flex",
-    },
-    "& .line": {
-      display: "none",
-      color: "transparent",
-      userSelect: "none",
-      background: "var(--sl-color-primary-300)",
-      width: "4px",
-      borderRadius: "4px",
-      margin: "-2px",
-      position: "relative",
-      left: "12px",
-      top: "34px",
-    },
-    "& .step": {
-      display: "flex",
-    },
-    "& .icon": {
-      position: "relative",
-      top: "4px",
-      zIndex: "1",
-      color: "var(--sl-color-primary-300)",
-      marginRight: "var(--sl-spacing-large)",
-    },
-    "& .reward": {
-      marginRight: "var(--sl-spacing-x-small)",
-      fontSize: "var(--sl-font-size-x-large)",
-      fontWeight: "var(--sl-font-weight-semibold)",
-    },
-    "& .unit": {
-      textTransform: "uppercase",
-      fontSize: "var(--sl-font-size-small)",
-    },
-    "& .description": {
-      fontSize: "var(--sl-font-size-medium)",
-    },
-  },
-};
-const sheet = createStyleSheet(style);
-const styleString = sheet.toString();
-const vanillaStyle = `
-	:host{
-		display: block; 
-	}
-
-	:host(:not(:last-of-type)) .line {
-		display: block; 
-	}
-	`;
-export function TimelineEntryView(props) {
-  var _a;
-  const timeline_icon = (_a = props.icon) !== null && _a !== void 0 ? _a : props.iconState;
-  return (h("div", { class: sheet.classes.TimelineReward },
-    h("style", { type: "text/css" },
-      styleString,
-      vanillaStyle),
-    h("div", { class: "container" },
-      h("div", { class: "line" }, "/"),
-      h("div", { class: "step" },
-        timeline_icon === "gift" && (h("div", { class: "icon" },
-          h(Gift, null))),
-        timeline_icon === "circle" && (h("div", { class: "icon" },
-          h(Circle, null))),
-        h("div", null,
-          h("div", null,
-            h("span", { class: "reward" }, props.reward),
-            h("span", { class: "unit" }, props.unit)),
-          h("div", { class: "description" }, props.desc))))));
-}
+import { h } from "@stencil/core";
+import { createStyleSheet } from "../../styling/JSS";
+import { Circle, Gift } from "./SVGs";
+const style = {
+  TimelineReward: {
+    color: "var(--sl-color-neutral-900)",
+    lineHeight: "var(--sl-line-height-dense)",
+    "& .container": {
+      display: "flex",
+    },
+    "& .line": {
+      display: "none",
+      color: "transparent",
+      userSelect: "none",
+      background: "var(--sl-color-primary-300)",
+      width: "4px",
+      borderRadius: "4px",
+      margin: "-2px",
+      position: "relative",
+      left: "12px",
+      top: "34px",
+    },
+    "& .step": {
+      display: "flex",
+    },
+    "& .icon": {
+      position: "relative",
+      top: "4px",
+      zIndex: "1",
+      color: "var(--sl-color-primary-300)",
+      marginRight: "var(--sl-spacing-large)",
+    },
+    "& .reward": {
+      marginRight: "var(--sl-spacing-x-small)",
+      fontSize: "var(--sl-font-size-x-large)",
+      fontWeight: "var(--sl-font-weight-semibold)",
+    },
+    "& .unit": {
+      textTransform: "uppercase",
+      fontSize: "var(--sl-font-size-small)",
+    },
+    "& .description": {
+      fontSize: "var(--sl-font-size-medium)",
+    },
+  },
+};
+const sheet = createStyleSheet(style);
+const styleString = sheet.toString();
+const vanillaStyle = `
+	:host{
+		display: block; 
+	}
+
+	:host(:not(:last-of-type)) .line {
+		display: block; 
+	}
+	`;
+export function TimelineEntryView(props) {
+  var _a;
+  const timeline_icon = (_a = props.icon) !== null && _a !== void 0 ? _a : props.iconState;
+  return (h("div", { class: sheet.classes.TimelineReward },
+    h("style", { type: "text/css" },
+      styleString,
+      vanillaStyle),
+    h("div", { class: "container" },
+      h("div", { class: "line" }, "/"),
+      h("div", { class: "step" },
+        timeline_icon === "gift" && (h("div", { class: "icon" },
+          h(Gift, null))),
+        timeline_icon === "circle" && (h("div", { class: "icon" },
+          h(Circle, null))),
+        h("div", null,
+          h("div", null,
+            h("span", { class: "reward" }, props.reward),
+            h("span", { class: "unit" }, props.unit)),
+          h("div", { class: "description" }, props.desc))))));
+}

package/dist/collection/components/sqm-timeline/sqm-timeline-entry.js

@@ -1,144 +1,144 @@
-import { withHooks } from "@saasquatch/stencil-hooks";
-import { Component, h, Method, Prop, State } from "@stencil/core";
-import { useRequestRerender } from "../../tables/re-render";
-import { getProps } from "../../utils/utils";
-import { TimelineEntryView } from "./sqm-timeline-entry-view";
-/**
- * @uiName Program Timeline Entry
- * @validParents ["sqm-timeline"]
- * @exampleGroup Common Components
- * @example Timeline Entry - <sqm-timeline-entry reward="$50" unit="visa giftcard" desc="You refer a friend" icon="circle" > </sqm-timeline-entry>
- */
-export class TimelineReward {
-  constructor() {
-    this.ignored = true;
-    this.iconState = "gift";
-    withHooks(this);
-  }
-  async setIcon(value) {
-    this.iconState = value;
-  }
-  disconnectedCallback() { }
-  render() {
-    useRequestRerender([this.reward]);
-    return h(TimelineEntryView, Object.assign({}, getProps(this)));
-  }
-  static get is() { return "sqm-timeline-entry"; }
-  static get encapsulation() { return "shadow"; }
-  static get properties() { return {
-    "reward": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Reward Amount",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "reward",
-      "reflect": false
-    },
-    "unit": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Reward Unit",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "unit",
-      "reflect": false
-    },
-    "desc": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Description",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "desc",
-      "reflect": false
-    },
-    "icon": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "\"gift\" | \"circle\"",
-        "resolved": "\"circle\" | \"gift\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Icon",
-            "name": "uiName"
-          }, {
-            "text": "string",
-            "name": "uiType"
-          }, {
-            "text": "[\"gift\", \"circle\"]",
-            "name": "uiEnum"
-          }, {
-            "text": "[\"Gift\", \"Circle\"]",
-            "name": "uiEnumNames"
-          }],
-        "text": ""
-      },
-      "attribute": "icon",
-      "reflect": false
-    }
-  }; }
-  static get states() { return {
-    "ignored": {},
-    "iconState": {}
-  }; }
-  static get methods() { return {
-    "setIcon": {
-      "complexType": {
-        "signature": "(value: \"gift\" | \"circle\") => Promise<void>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    }
-  }; }
-}
+import { withHooks } from "@saasquatch/stencil-hooks";
+import { Component, h, Method, Prop, State } from "@stencil/core";
+import { useRequestRerender } from "../../tables/re-render";
+import { getProps } from "../../utils/utils";
+import { TimelineEntryView } from "./sqm-timeline-entry-view";
+/**
+ * @uiName Program Timeline Entry
+ * @validParents ["sqm-timeline"]
+ * @exampleGroup Common Components
+ * @example Timeline Entry - <sqm-timeline-entry reward="$50" unit="visa giftcard" desc="You refer a friend" icon="circle" > </sqm-timeline-entry>
+ */
+export class TimelineReward {
+  constructor() {
+    this.ignored = true;
+    this.iconState = "gift";
+    withHooks(this);
+  }
+  async setIcon(value) {
+    this.iconState = value;
+  }
+  disconnectedCallback() { }
+  render() {
+    useRequestRerender([this.reward]);
+    return h(TimelineEntryView, Object.assign({}, getProps(this)));
+  }
+  static get is() { return "sqm-timeline-entry"; }
+  static get encapsulation() { return "shadow"; }
+  static get properties() { return {
+    "reward": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Reward Amount",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "reward",
+      "reflect": false
+    },
+    "unit": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Reward Unit",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "unit",
+      "reflect": false
+    },
+    "desc": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Description",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "desc",
+      "reflect": false
+    },
+    "icon": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "\"gift\" | \"circle\"",
+        "resolved": "\"circle\" | \"gift\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Icon",
+            "name": "uiName"
+          }, {
+            "text": "string",
+            "name": "uiType"
+          }, {
+            "text": "[\"gift\", \"circle\"]",
+            "name": "uiEnum"
+          }, {
+            "text": "[\"Gift\", \"Circle\"]",
+            "name": "uiEnumNames"
+          }],
+        "text": ""
+      },
+      "attribute": "icon",
+      "reflect": false
+    }
+  }; }
+  static get states() { return {
+    "ignored": {},
+    "iconState": {}
+  }; }
+  static get methods() { return {
+    "setIcon": {
+      "complexType": {
+        "signature": "(value: \"gift\" | \"circle\") => Promise<void>",
+        "parameters": [{
+            "tags": [],
+            "text": ""
+          }],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "",
+        "tags": []
+      }
+    }
+  }; }
+}

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

@@ -1,83 +1,83 @@
-import { withHooks } from "@saasquatch/stencil-hooks";
-import { Component, h, Prop, State } from "@stencil/core";
-import { useChildElements } from "../../tables/useChildElements";
-/**
- * @uiName Program Timeline
- * @slots [{"name":"","title":"Timeline","validChildren":["sqm-timeline-entry"]}]
- * @exampleGroup Common Components
- * @example Program Timeline - <sqm-timeline icon="circle"> <sqm-timeline-entry reward="$50" unit="visa giftcard" desc="You refer a friend" icon="circle" > </sqm-timeline-entry> <sqm-timeline-entry reward="$200" unit="visa giftcard" desc="Our sales team qualifies your friend as a good fit for our Enterprise plan" icon="circle" > </sqm-timeline-entry> <sqm-timeline-entry reward="$1000" unit="visa giftcard" desc="Your friend purchases an Enterprise plan" icon="circle" > </sqm-timeline-entry></sqm-timeline>
-*/
-export class Timeline {
-  constructor() {
-    this.ignored = true;
-    /**
-     * @uiName Icon
-     * @uiType string
-     * @uiEnum ["gift", "circle"]
-     * @uiEnumNames ["Gift", "Circle"]
-     */
-    this.icon = "gift";
-    withHooks(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const rewards = useChildElements();
-    rewards.forEach((reward) => {
-      try {
-        reward.setIcon(this.icon);
-      }
-      catch {
-        // incase child is not sqm-timeline-entry
-      }
-    });
-    const vanillaStyle = `
-		:host{
-			display: block;   
-		}
-
-		::slotted(*:not(:only-child):not(:last-child)) {
-			margin-bottom: var(--sl-spacing-xx-large);
-		}
-	`;
-    return (h("div", null,
-      h("style", { type: "text/css" }, vanillaStyle),
-      h("slot", null)));
-  }
-  static get is() { return "sqm-timeline"; }
-  static get encapsulation() { return "shadow"; }
-  static get properties() { return {
-    "icon": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "\"gift\" | \"circle\"",
-        "resolved": "\"circle\" | \"gift\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Icon",
-            "name": "uiName"
-          }, {
-            "text": "string",
-            "name": "uiType"
-          }, {
-            "text": "[\"gift\", \"circle\"]",
-            "name": "uiEnum"
-          }, {
-            "text": "[\"Gift\", \"Circle\"]",
-            "name": "uiEnumNames"
-          }],
-        "text": ""
-      },
-      "attribute": "icon",
-      "reflect": false,
-      "defaultValue": "\"gift\""
-    }
-  }; }
-  static get states() { return {
-    "ignored": {}
-  }; }
-}
+import { withHooks } from "@saasquatch/stencil-hooks";
+import { Component, h, Prop, State } from "@stencil/core";
+import { useChildElements } from "../../tables/useChildElements";
+/**
+ * @uiName Program Timeline
+ * @slots [{"name":"","title":"Timeline","validChildren":["sqm-timeline-entry"]}]
+ * @exampleGroup Common Components
+ * @example Program Timeline - <sqm-timeline icon="circle"> <sqm-timeline-entry reward="$50" unit="visa giftcard" desc="You refer a friend" icon="circle" > </sqm-timeline-entry> <sqm-timeline-entry reward="$200" unit="visa giftcard" desc="Our sales team qualifies your friend as a good fit for our Enterprise plan" icon="circle" > </sqm-timeline-entry> <sqm-timeline-entry reward="$1000" unit="visa giftcard" desc="Your friend purchases an Enterprise plan" icon="circle" > </sqm-timeline-entry></sqm-timeline>
+*/
+export class Timeline {
+  constructor() {
+    this.ignored = true;
+    /**
+     * @uiName Icon
+     * @uiType string
+     * @uiEnum ["gift", "circle"]
+     * @uiEnumNames ["Gift", "Circle"]
+     */
+    this.icon = "gift";
+    withHooks(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const rewards = useChildElements();
+    rewards.forEach((reward) => {
+      try {
+        reward.setIcon(this.icon);
+      }
+      catch {
+        // incase child is not sqm-timeline-entry
+      }
+    });
+    const vanillaStyle = `
+		:host{
+			display: block;   
+		}
+
+		::slotted(*:not(:only-child):not(:last-child)) {
+			margin-bottom: var(--sl-spacing-xx-large);
+		}
+	`;
+    return (h("div", null,
+      h("style", { type: "text/css" }, vanillaStyle),
+      h("slot", null)));
+  }
+  static get is() { return "sqm-timeline"; }
+  static get encapsulation() { return "shadow"; }
+  static get properties() { return {
+    "icon": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "\"gift\" | \"circle\"",
+        "resolved": "\"circle\" | \"gift\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Icon",
+            "name": "uiName"
+          }, {
+            "text": "string",
+            "name": "uiType"
+          }, {
+            "text": "[\"gift\", \"circle\"]",
+            "name": "uiEnum"
+          }, {
+            "text": "[\"Gift\", \"Circle\"]",
+            "name": "uiEnumNames"
+          }],
+        "text": ""
+      },
+      "attribute": "icon",
+      "reflect": false,
+      "defaultValue": "\"gift\""
+    }
+  }; }
+  static get states() { return {
+    "ignored": {}
+  }; }
+}