@manifoldco/web-components - npm Package Compare versions

Comparing version 0.0.30 to 0.0.31

dist/cjs/loader.cjs.js

@@ -8,5 +8,5 @@ 'use strict';
 const defineCustomElements = (win, options) => index.patchEsm().then(() => {
-  return index.bootstrapLazy([["manifold-plan-table.cjs",[[1,"manifold-plan-table",{"embed":[1],"ctaText":[1,"cta-text"],"cta":[16],"baseUrl":[1,"base-url"],"productData":[16],"env":[1],"featureSelections":[32],"featureErrors":[32],"product":[32],"client":[32],"breakpoint":[32]}]]]], options);
+  return index.bootstrapLazy([["manifold-plan-table.cjs",[[1,"manifold-plan-table",{"embed":[1],"ctaText":[1,"cta-text"],"planOptions":[16],"baseUrl":[1,"base-url"],"productData":[16],"env":[1],"featureSelections":[32],"featureErrors":[32],"product":[32],"client":[32],"breakpoint":[32]}]]]], options);
 });
 
 exports.defineCustomElements = defineCustomElements;

dist/cjs/manifold.cjs.js

@@ -6,3 +6,3 @@ 'use strict';
 index.patchBrowser().then(options => {
-  return index.bootstrapLazy([["manifold-plan-table.cjs",[[1,"manifold-plan-table",{"embed":[1],"ctaText":[1,"cta-text"],"cta":[16],"baseUrl":[1,"base-url"],"productData":[16],"env":[1],"featureSelections":[32],"featureErrors":[32],"product":[32],"client":[32],"breakpoint":[32]}]]]], options);
+  return index.bootstrapLazy([["manifold-plan-table.cjs",[[1,"manifold-plan-table",{"embed":[1],"ctaText":[1,"cta-text"],"planOptions":[16],"baseUrl":[1,"base-url"],"productData":[16],"env":[1],"featureSelections":[32],"featureErrors":[32],"product":[32],"client":[32],"breakpoint":[32]}]]]], options);
 });

dist/collection/components/manifold-plan-table/manifold-plan-table.js

@@ -8,3 +8,3 @@ import { Component, Element, Event, Host, State, Prop, h, Watch, } from '@stencil/core';
 import planQuery from '../../graphql/EmbeddedProductPlan.graphql';
-import { toUSD, compareRange, displayRange } from '../../utils/cost';
+import { toUSD, planCost, compareRange, displayRange } from '../../utils/cost';
 import ConfiguredTiers from './configured-tiers';
@@ -320,7 +320,8 @@ import StringSelect from './string-select';
                         h("th", null),
-                        this.plans.map(({ slug, name, cost }) => (h("th", { part: `plan--${slug}` },
-                            h("h3", { class: "Manifold-Typography--Heading" }, name),
-                            h("label", { class: "Manifold-Typography--SubheadingSmall" },
-                                toUSD(cost),
-                                "/mo")))))),
+                        this.plans.map(({ slug, name, cost }) => {
+                            var _a, _b;
+                            return (h("th", { part: `plan--${slug}` },
+                                h("h3", { class: "Manifold-Typography--Heading" }, name),
+                                h("label", { class: "Manifold-Typography--SubheadingSmall" }, ((_b = (_a = this.planOptions) === null || _a === void 0 ? void 0 : _a[slug]) === null || _b === void 0 ? void 0 : _b.cost) || planCost(cost))));
+                        }))),
                 h("tbody", null,
@@ -334,3 +335,3 @@ this.featureSlugs.map((featureSlug) => (h("tr", null,
                         this.plans.map((p) => {
-                            var _a, _b, _c;
+                            var _a, _b, _c, _d;
                             const eventDetails = {
@@ -341,5 +342,5 @@ planSlug: p.slug,
                             };
-                            const cta = (_a = this.cta) === null || _a === void 0 ? void 0 : _a[p.slug];
-                            const ctaText = (cta === null || cta === void 0 ? void 0 : cta.text) || this.ctaText || ((_b = p.cta) === null || _b === void 0 ? void 0 : _b.text) || 'Get Started';
-                            const uri = this.baseUrl || ((_c = p.cta) === null || _c === void 0 ? void 0 : _c.uri);
+                            const cta = (_b = (_a = this.planOptions) === null || _a === void 0 ? void 0 : _a[p.slug]) === null || _b === void 0 ? void 0 : _b.cta;
+                            const ctaText = (cta === null || cta === void 0 ? void 0 : cta.text) || this.ctaText || ((_c = p.cta) === null || _c === void 0 ? void 0 : _c.text) || 'Get Started';
+                            const uri = this.baseUrl || ((_d = p.cta) === null || _d === void 0 ? void 0 : _d.uri);
                             if (uri) {
@@ -409,10 +410,10 @@ const params = new URLSearchParams();
         },
-        "cta": {
+        "planOptions": {
             "type": "unknown",
             "mutable": false,
             "complexType": {
-                "original": "CTAOptions",
-                "resolved": "CTAOptions | undefined",
+                "original": "PlanOptions",
+                "resolved": "PlanOptions | undefined",
                 "references": {
-                    "CTAOptions": {
+                    "PlanOptions": {
                         "location": "local"
@@ -419,0 +420,0 @@ }

dist/collection/components/manifold-plan-table/manifold-plan-table.stories.js

@@ -42,9 +42,12 @@ import { withKnobs, text, select } from '@storybook/addon-knobs';
 export const withCTATextOverride = () => `<manifold-plan-table embed="${demoEmbedId}" cta-text="Custom text"></manifold-plan-table>`;
-export const withCTAOptions = () => {
+export const withPlanOptions = () => {
     const table = document.createElement('manifold-plan-table');
     table.productData = sampleProduct.data.product;
-    table.cta = {
+    table.planOptions = {
         'plan-1': {
-            disabled: true,
-            text: 'Current Plan',
+            cta: {
+                disabled: true,
+                text: 'Current Plan',
+            },
+            cost: 'Custom Pricing',
         },
@@ -51,0 +54,0 @@ };

dist/collection/utils/cost.js

@@ -6,2 +6,8 @@ export function toUSD(cents) {
 }
+export function planCost(cents) {
+    if (cents === 0) {
+        return 'FREE';
+    }
+    return `${toUSD(cents)}/mo`;
+}
 export const compareRange = (a, b) => {
@@ -8,0 +14,0 @@ if (a.max === null || a.max === undefined) {

dist/manifold/manifold.esm.js

@@ -1,1 +0,1 @@
-import{p as e,b as a}from"./p-ec676345.js";e().then(e=>a([["p-0c56a4c3",[[1,"manifold-plan-table",{embed:[1],ctaText:[1,"cta-text"],cta:[16],baseUrl:[1,"base-url"],productData:[16],env:[1],featureSelections:[32],featureErrors:[32],product:[32],client:[32],breakpoint:[32]}]]]],e));
+import{p as e,b as a}from"./p-ec676345.js";e().then(e=>a([["p-1a86fe61",[[1,"manifold-plan-table",{embed:[1],ctaText:[1,"cta-text"],planOptions:[16],baseUrl:[1,"base-url"],productData:[16],env:[1],featureSelections:[32],featureErrors:[32],product:[32],client:[32],breakpoint:[32]}]]]],e));

dist/manifold/p-8e528c93.system.js

@@ -1,1 +0,1 @@
-System.register(["./p-281b5a52.system.js"],(function(){"use strict";var e,t;return{setters:[function(r){e=r.p;t=r.b}],execute:function(){e().then((function(e){return t([["p-cc80d4e7.system",[[1,"manifold-plan-table",{embed:[1],ctaText:[1,"cta-text"],cta:[16],baseUrl:[1,"base-url"],productData:[16],env:[1],featureSelections:[32],featureErrors:[32],product:[32],client:[32],breakpoint:[32]}]]]],e)}))}}}));
+System.register(["./p-281b5a52.system.js"],(function(){"use strict";var t,e;return{setters:[function(n){t=n.p;e=n.b}],execute:function(){t().then((function(t){return e([["p-c74ab4b9.system",[[1,"manifold-plan-table",{embed:[1],ctaText:[1,"cta-text"],planOptions:[16],baseUrl:[1,"base-url"],productData:[16],env:[1],featureSelections:[32],featureErrors:[32],product:[32],client:[32],breakpoint:[32]}]]]],t)}))}}}));

dist/types/components.d.ts

@@ -8,3 +8,3 @@ /* eslint-disable */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { CTAOptions, PlanTableEvent, } from "./components/manifold-plan-table/manifold-plan-table";
+import { PlanOptions, PlanTableEvent, } from "./components/manifold-plan-table/manifold-plan-table";
 import { EmbeddedProductQuery, } from "./types/graphql";
@@ -14,6 +14,6 @@ export namespace Components {
         "baseUrl"?: string;
-        "cta"?: CTAOptions;
         "ctaText"?: string;
         "embed": string;
         "env": "prod" | "local";
+        "planOptions"?: PlanOptions;
         "productData"?: EmbeddedProductQuery["embeddedProduct"];
@@ -36,3 +36,2 @@ }
         "baseUrl"?: string;
-        "cta"?: CTAOptions;
         "ctaText"?: string;
@@ -43,2 +42,3 @@ "embed"?: string;
         "onFeatureSelected"?: (event: CustomEvent<PlanTableEvent>) => void;
+        "planOptions"?: PlanOptions;
         "productData"?: EmbeddedProductQuery["embeddedProduct"];
@@ -45,0 +45,0 @@ }

dist/types/components/manifold-plan-table/manifold-plan-table.d.ts

@@ -11,8 +11,12 @@ import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
 }
-export interface CTAOptions {
+export interface PlanOptions {
     [planSlug: string]: {
-        text?: string;
-        disabled?: boolean;
+        cta?: CTAOptions;
+        cost?: string;
     };
 }
+export interface CTAOptions {
+    text?: string;
+    disabled?: boolean;
+}
 declare type breakpointLabel = 'lg' | 'md' | 'sm' | 'xs';
@@ -25,3 +29,3 @@ export declare class ManifoldPlanTable implements ComponentInterface {
     ctaText?: string;
-    cta?: CTAOptions;
+    planOptions?: PlanOptions;
     baseUrl?: string;
@@ -28,0 +32,0 @@ productData?: EmbeddedProductQuery['embeddedProduct'];

dist/types/components/manifold-plan-table/manifold-plan-table.stories.d.ts

@@ -9,4 +9,4 @@ declare const _default: {
 export declare const withCTATextOverride: () => string;
-export declare const withCTAOptions: () => HTMLManifoldPlanTableElement;
+export declare const withPlanOptions: () => HTMLManifoldPlanTableElement;
 export declare const withURLOverride: () => string;
 export declare const withCTAEventHandler: () => HTMLDivElement;

dist/types/utils/cost.d.ts

 import { IntRangeFeatureValue } from '../types/graphql';
 export declare function toUSD(cents: number): string;
+export declare function planCost(cents: number): string;
 export declare const compareRange: (a: IntRangeFeatureValue, b: IntRangeFeatureValue) => 1 | -1;
 export declare function displayRange(lower: number, upper: number | undefined | null, idx: number): string;

package.json

 {
   "name": "@manifoldco/web-components",
-  "version": "0.0.30",
+  "version": "0.0.31",
   "description": "Manifold's Web Components",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

No alert changes

Improved metrics

Total package byte prevSize

1751603

increased by0.12%

Lines of code

29076

increased by0.14%

No dependency changes