@saasquatch/mint-components 1.15.0-43 → 1.15.0-45

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@saasquatch/mint-components",
   "title": "Mint Components",
-  "version": "1.15.0-43",
+  "version": "1.15.0-45",
   "description": "A minimal design library with components for referral and loyalty experiences. Built with Shoelace components by Saasquatch.",
   "icon": "https://res.cloudinary.com/saasquatch/image/upload/v1652219900/squatch-assets/For_Mint.svg",
   "raisins": "docs/raisins.json",

package/dist/cjs/sqm-asset-card-view-21ddf04f.js

@@ -1,51 +0,0 @@
-'use strict';
-
-const index = require('./index-a29c60ef.js');
-const JSS = require('./JSS-8503a151.js');
-
-const style = {
-  CardContainer: {
-    "box-sizing": "border-box",
-    width: "100%",
-    "max-width": "260px",
-    border: "1px solid #EAEAEA",
-    padding: "0px 16px 16px 16px",
-    "border-radius": "8px",
-  },
-  TextContainer: {
-    display: "flex",
-    "justify-content": "space-between",
-    "align-items": "center",
-  },
-  Title: {
-    "font-weight": 600,
-    color: "var(--sl-color-gray-800)",
-    "max-width": "85%",
-    "overflow-wrap": "break-word",
-  },
-  CardImg: {
-    width: "100%",
-    height: "228px",
-    "border-radius": "4px",
-  },
-  Icon: {
-    "&:hover": {
-      cursor: "pointer",
-    },
-  },
-};
-const sheet = JSS.createStyleSheet(style);
-const styleString = sheet.toString();
-const AssetCardView = (props) => {
-  const { text: { titleText }, imgUrl, } = props;
-  return (index.h("div", { class: sheet.classes.CardContainer, part: "sqm-base" },
-    index.h("style", { type: "text/css" }, styleString),
-    index.h("div", { class: sheet.classes.TextContainer },
-      index.h("p", { class: sheet.classes.Title, part: "sqm-title" }, titleText),
-      index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "#000000", class: `bi bi-download ${sheet.classes.Icon}`, viewBox: "0 0 16 16" },
-        index.h("path", { d: "M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z" }),
-        index.h("path", { d: "M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z" }))),
-    index.h("img", { src: index.getAssetPath(imgUrl), class: sheet.classes.CardImg })));
-};
-
-exports.AssetCardView = AssetCardView;

package/dist/cjs/sqm-asset-card.cjs.entry.js

@@ -1,45 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-a29c60ef.js');
-const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
-const index_module = require('./index.module-ee84433d.js');
-const cjs = require('./cjs-1066ec21.js');
-require('./JSS-8503a151.js');
-const sqmAssetCardView = require('./sqm-asset-card-view-21ddf04f.js');
-
-const useAssetCard = (_props) => {
-  return {
-    text: {
-      titleText: "Marketing Banner",
-    },
-    imgUrl: null,
-    callbacks: {},
-  };
-};
-
-const AssetCard = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.ignored = true;
-    stencilHooks_module.h$1(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const props = index_module.isDemo() ? useAssetCardDemo(this) : useAssetCard();
-    return index.h(sqmAssetCardView.AssetCardView, Object.assign({}, props));
-  }
-  static get assetsDirs() { return ["../../assets"]; }
-};
-function useAssetCardDemo(props) {
-  return cjs.cjs({
-    text: {
-      titleText: "Marketing Banner",
-    },
-    imgUrl: "https://res.cloudinary.com/saasquatch/image/upload/v1634255445/squatch-assets/Copy_of_saasquatch-logo-tree-large-horizontal.png",
-    callbacks: {},
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
-}
-
-exports.sqm_asset_card = AssetCard;

package/dist/collection/components/sqm-asset-card/AssetCard.stories.js

@@ -1,29 +0,0 @@
-import { h } from "@stencil/core";
-import { AssetCardView } from "./sqm-asset-card-view";
-export default {
-  title: "Components/Asset Card",
-};
-export const Default = () => {
-  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));
-};
-export 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));
-};
-export const CardWithNoImg = () => {
-  const props = {
-    text: { titleText: "Marketing Banner" },
-    imgUrl: "",
-    callbacks: {},
-  };
-  return h(AssetCardView, Object.assign({}, props));
-};

package/dist/collection/components/sqm-asset-card/sqm-asset-card-view.js

@@ -1,46 +0,0 @@
-import { getAssetPath, h } from "@stencil/core";
-import { createStyleSheet } from "../../styling/JSS";
-const style = {
-  CardContainer: {
-    "box-sizing": "border-box",
-    width: "100%",
-    "max-width": "260px",
-    border: "1px solid #EAEAEA",
-    padding: "0px 16px 16px 16px",
-    "border-radius": "8px",
-  },
-  TextContainer: {
-    display: "flex",
-    "justify-content": "space-between",
-    "align-items": "center",
-  },
-  Title: {
-    "font-weight": 600,
-    color: "var(--sl-color-gray-800)",
-    "max-width": "85%",
-    "overflow-wrap": "break-word",
-  },
-  CardImg: {
-    width: "100%",
-    height: "228px",
-    "border-radius": "4px",
-  },
-  Icon: {
-    "&:hover": {
-      cursor: "pointer",
-    },
-  },
-};
-const sheet = createStyleSheet(style);
-const styleString = sheet.toString();
-export const AssetCardView = (props) => {
-  const { text: { titleText }, imgUrl, } = props;
-  return (h("div", { class: sheet.classes.CardContainer, part: "sqm-base" },
-    h("style", { type: "text/css" }, styleString),
-    h("div", { class: sheet.classes.TextContainer },
-      h("p", { class: sheet.classes.Title, part: "sqm-title" }, titleText),
-      h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "#000000", class: `bi bi-download ${sheet.classes.Icon}`, viewBox: "0 0 16 16" },
-        h("path", { d: "M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z" }),
-        h("path", { d: "M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z" }))),
-    h("img", { src: getAssetPath(imgUrl), class: sheet.classes.CardImg })));
-};

package/dist/collection/components/sqm-asset-card/sqm-asset-card.js

@@ -1,107 +0,0 @@
-import { isDemo } from "@saasquatch/component-boilerplate";
-import { withHooks } from "@saasquatch/stencil-hooks";
-import { Component, Prop, h, State } from "@stencil/core";
-import { AssetCardView } from "./sqm-asset-card-view";
-import { useAssetCard } from "./useAssetCard";
-import deepmerge from "deepmerge";
-/**
- * @uiName Asset Card
- */
-export class AssetCard {
-  constructor() {
-    this.ignored = true;
-    withHooks(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const props = isDemo() ? useAssetCardDemo(this) : useAssetCard(this);
-    return h(AssetCardView, Object.assign({}, props));
-  }
-  static get is() { return "sqm-asset-card"; }
-  static get encapsulation() { return "shadow"; }
-  static get assetsDirs() { return ["../../assets"]; }
-  static get properties() { return {
-    "titleText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Banner title",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "title-text",
-      "reflect": false
-    },
-    "imgUrl": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Banner image",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "img-url",
-      "reflect": false
-    },
-    "demoData": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "DemoData<AssetCardViewProps>",
-        "resolved": "{ imgUrl?: string; }",
-        "references": {
-          "DemoData": {
-            "location": "import",
-            "path": "../../global/demo"
-          },
-          "AssetCardViewProps": {
-            "location": "import",
-            "path": "./sqm-asset-card-view"
-          }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "text": undefined,
-            "name": "undocumented"
-          }, {
-            "text": "object",
-            "name": "uiType"
-          }],
-        "text": ""
-      }
-    }
-  }; }
-  static get states() { return {
-    "ignored": {}
-  }; }
-}
-function useAssetCardDemo(props) {
-  return deepmerge({
-    text: {
-      titleText: "Marketing Banner",
-    },
-    imgUrl: "https://res.cloudinary.com/saasquatch/image/upload/v1634255445/squatch-assets/Copy_of_saasquatch-logo-tree-large-horizontal.png",
-    callbacks: {},
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
-}

package/dist/collection/components/sqm-asset-card/useAssetCard.js

@@ -1,9 +0,0 @@
-export const useAssetCard = (_props) => {
-  return {
-    text: {
-      titleText: "Marketing Banner",
-    },
-    imgUrl: null,
-    callbacks: {},
-  };
-};

package/dist/esm/sqm-asset-card-view-fe5db3c0.js

@@ -1,49 +0,0 @@
-import { h, d as getAssetPath } from './index-91e7729f.js';
-import { c as createStyleSheet } from './JSS-67b5cff8.js';
-
-const style = {
-  CardContainer: {
-    "box-sizing": "border-box",
-    width: "100%",
-    "max-width": "260px",
-    border: "1px solid #EAEAEA",
-    padding: "0px 16px 16px 16px",
-    "border-radius": "8px",
-  },
-  TextContainer: {
-    display: "flex",
-    "justify-content": "space-between",
-    "align-items": "center",
-  },
-  Title: {
-    "font-weight": 600,
-    color: "var(--sl-color-gray-800)",
-    "max-width": "85%",
-    "overflow-wrap": "break-word",
-  },
-  CardImg: {
-    width: "100%",
-    height: "228px",
-    "border-radius": "4px",
-  },
-  Icon: {
-    "&:hover": {
-      cursor: "pointer",
-    },
-  },
-};
-const sheet = createStyleSheet(style);
-const styleString = sheet.toString();
-const AssetCardView = (props) => {
-  const { text: { titleText }, imgUrl, } = props;
-  return (h("div", { class: sheet.classes.CardContainer, part: "sqm-base" },
-    h("style", { type: "text/css" }, styleString),
-    h("div", { class: sheet.classes.TextContainer },
-      h("p", { class: sheet.classes.Title, part: "sqm-title" }, titleText),
-      h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "#000000", class: `bi bi-download ${sheet.classes.Icon}`, viewBox: "0 0 16 16" },
-        h("path", { d: "M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z" }),
-        h("path", { d: "M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z" }))),
-    h("img", { src: getAssetPath(imgUrl), class: sheet.classes.CardImg })));
-};
-
-export { AssetCardView as A };

package/dist/esm/sqm-asset-card.entry.js

@@ -1,41 +0,0 @@
-import { r as registerInstance, h as h$1 } from './index-91e7729f.js';
-import { n as h } from './stencil-hooks.module-4bc38af4.js';
-import { i as isDemo } from './index.module-89a79f66.js';
-import { c as cjs } from './cjs-bdfb4486.js';
-import './JSS-67b5cff8.js';
-import { A as AssetCardView } from './sqm-asset-card-view-fe5db3c0.js';
-
-const useAssetCard = (_props) => {
-  return {
-    text: {
-      titleText: "Marketing Banner",
-    },
-    imgUrl: null,
-    callbacks: {},
-  };
-};
-
-const AssetCard = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.ignored = true;
-    h(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const props = isDemo() ? useAssetCardDemo(this) : useAssetCard();
-    return h$1(AssetCardView, Object.assign({}, props));
-  }
-  static get assetsDirs() { return ["../../assets"]; }
-};
-function useAssetCardDemo(props) {
-  return cjs({
-    text: {
-      titleText: "Marketing Banner",
-    },
-    imgUrl: "https://res.cloudinary.com/saasquatch/image/upload/v1634255445/squatch-assets/Copy_of_saasquatch-logo-tree-large-horizontal.png",
-    callbacks: {},
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
-}
-
-export { AssetCard as sqm_asset_card };