npm - @justifi/webcomponents - Versions diffs - 4.7.0-rc.1 → 4.7.0 - Mend

@justifi/webcomponents 4.7.0-rc.1 → 4.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (158) hide show

package/dist/collection/components/business-list/business-list.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"business-list.stories.js","sourceRoot":"","sources":["../../../../src/components/business-list/business-list.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,6BAA6B;EACpC,SAAS,EAAE,uBAAuB;EAClC,UAAU,EAAE,EAAE;CACf,CAAC;AAEF,MAAM,gBAAgB;EAIpB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,cAAc,CAAC;IACjE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,~~wBAAwB~~,CAAC;~~EAC7E~~,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAsB,EAAE,EAAE;EAC1C,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AAEtC,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AACvC,MAAM,CAAC,UAAU,GAAG;EAClB,CAAC,KAAK,EAAE,EAAE,CAAC;MACP,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BV;CACF,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,UAAU,GAAG;EACrB,CAAC,KAAK,EAAE,EAAE,CAAC;;QAEL,KAAK,EAAE;;GAEZ;CACF,CAAA;AACD,SAAS,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'dev/Components/BusinessList',\n component: 'justifi-business-list',\n parameters: {}\n};\n\nclass BusinessListArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.proxyAuthToken;\n this['account-id'] = args['account-id'] \|\| config.~~exampleBusinessAccountId~~;\n }\n}\n\nconst Template = (args: BusinessListArgs) => {\n return (`\n <justifi-business-list\n data-testid=\"justifi-business-list\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new BusinessListArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new BusinessListArgs({});\nStyled.decorators = [\n (Story) => `\n ${Story()}\n <style>\n justifi-business-list::part(table-head-cell) {\n background-color: #F4F4F6;\n }\n justifi-business-list::part(pagination-bar) {\n background-color: #F4F4F6;\n }\n justifi-business-list::part(arrow) {\n --bs-btn-disabled-bg: #212529;\n --bs-btn-disabled-border-color: #212529;\n --bs-btn-bg: #212529;\n --bs-btn-border-color: #212529;\n --bs-btn-hover-bg: #fccc32;\n --bs-btn-hover-border-color: #fccc32;\n }\n justifi-business-list::part(error-state) {\n color: red;\n background-color: #EEEEF5;\n }\n justifi-business-list::part(loading-state-cell) {\n background-color: #EEEEF5;\n }\n justifi-business-list::part(table-row) {\n background-color: #EEEEF5;\n }\n justifi-business-list::part(table-row-even) {\n background-color: #F4F4F6;\n }\n </style>\n `\n]\n\nexport const Contained = Template.bind({});\nContained.decorators = [\n (Story) => `\n <div style=\"position: relative; width: 900px; height: 300px; overflow-x: hidden;\">\n ${Story()}\n </div>\n `\n]\nContained.args = new BusinessListArgs({});\n"]}
1	+ {"version":3,"file":"business-list.stories.js","sourceRoot":"","sources":["../../../../src/components/business-list/business-list.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,6BAA6B;EACpC,SAAS,EAAE,uBAAuB;EAClC,UAAU,EAAE,EAAE;CACf,CAAC;AAEF,MAAM,gBAAgB;EAIpB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,cAAc,CAAC;IACjE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;EACrE,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAsB,EAAE,EAAE;EAC1C,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AAEtC,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AACvC,MAAM,CAAC,UAAU,GAAG;EAClB,CAAC,KAAK,EAAE,EAAE,CAAC;MACP,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BV;CACF,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,UAAU,GAAG;EACrB,CAAC,KAAK,EAAE,EAAE,CAAC;;QAEL,KAAK,EAAE;;GAEZ;CACF,CAAA;AACD,SAAS,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'dev/Components/BusinessList',\n component: 'justifi-business-list',\n parameters: {}\n};\n\nclass BusinessListArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.proxyAuthToken;\n this['account-id'] = args['account-id'] \|\| config.exampleAccountId;\n }\n}\n\nconst Template = (args: BusinessListArgs) => {\n return (`\n <justifi-business-list\n data-testid=\"justifi-business-list\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new BusinessListArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new BusinessListArgs({});\nStyled.decorators = [\n (Story) => `\n ${Story()}\n <style>\n justifi-business-list::part(table-head-cell) {\n background-color: #F4F4F6;\n }\n justifi-business-list::part(pagination-bar) {\n background-color: #F4F4F6;\n }\n justifi-business-list::part(arrow) {\n --bs-btn-disabled-bg: #212529;\n --bs-btn-disabled-border-color: #212529;\n --bs-btn-bg: #212529;\n --bs-btn-border-color: #212529;\n --bs-btn-hover-bg: #fccc32;\n --bs-btn-hover-border-color: #fccc32;\n }\n justifi-business-list::part(error-state) {\n color: red;\n background-color: #EEEEF5;\n }\n justifi-business-list::part(loading-state-cell) {\n background-color: #EEEEF5;\n }\n justifi-business-list::part(table-row) {\n background-color: #EEEEF5;\n }\n justifi-business-list::part(table-row-even) {\n background-color: #F4F4F6;\n }\n </style>\n `\n]\n\nexport const Contained = Template.bind({});\nContained.decorators = [\n (Story) => `\n <div style=\"position: relative; width: 900px; height: 300px; overflow-x: hidden;\">\n ${Story()}\n </div>\n `\n]\nContained.args = new BusinessListArgs({});\n"]}

package/dist/collection/components/gross-payment-chart/gross-payment-chart.js CHANGED Viewed

@@ -3,6 +3,7 @@ import { Api } from "../../api";
 import { Chart, BarController, Colors, BarElement, CategoryScale, LinearScale, Legend, Tooltip, Title } from "chart.js";
 import { generateChartOptions } from "./chart-utils";
 import { ErrorState } from "../details/utils";
+import { config } from "../../../config";
 export class GrossPaymentChart {
   constructor() {
     this.accountId = undefined;
@@ -30,7 +31,7 @@ export class GrossPaymentChart {
       return;
     }
     this.loading = true;
-    const api = Api(this.authToken, process.env.PRIVATE_API_ORIGIN);
+    const api = Api(this.authToken, config.proxyApiOrigin);
     const endpoint = `account/${this.accountId}/reports/gross_volume`;
     const response = await api.get(endpoint);
     if (!response.error) {

package/dist/collection/components/gross-payment-chart/gross-payment-chart.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"gross-payment-chart.js","sourceRoot":"","sources":["../../../../src/components/gross-payment-chart/gross-payment-chart.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACvE,OAAO,EAAE,GAAG,EAA0B,MAAM,WAAW,CAAC;AACxD,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,~~EAAqB~~,MAAM,UAAU,CAAA;~~AAE1I~~,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;~~AAO9C~~,MAAM,OAAO,iBAAiB;;;;;;;;mBAUA,IAAI;wBACA,EAAE;;EAIlC,kBAAkB;IAChB,IAAI,CAAC,SAAS,EAAE,CAAC;EACnB,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,SAAS,EAAE,CAAC;EACnB,CAAC;EAED,kBAAkB;IAChB,IAAI,CAAC,WAAW,EAAE,CAAC;EACrB,CAAC;EAED,KAAK,CAAC,SAAS;IACb,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;MACtC,IAAI,CAAC,YAAY,GAAG,8DAA8D,CAAC;MACnF,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;MACrB,OAAO;KACR;IACD,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IAEpB,MAAM,GAAG,GAAG,GAAG,CAAC,IAAI,CAAC,SAAS,EAAE,~~OAAO~~,CAAC,~~GAAG~~,CAAC,~~kBAAkB,~~CAAC~~,CAAC~~;~~IAChE~~,MAAM,QAAQ,GAAG,WAAW,IAAI,CAAC,SAAS,uBAAuB,CAAC;IAClE,MAAM,QAAQ,GAA8C,MAAM,GAAG,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IAEpF,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE;MACnB,IAAI,CAAC,KAAK,GAAG,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI,CAAC,KAAK,CAAC;MAClC,IAAI,CAAC,KAAK,GAAG,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;MAC5C,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;KACvD;IAED,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;EACvB,CAAC;EAED,WAAW;IACT,IAAI,IAAI,CAAC,KAAK,EAAE;MACd,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAA;KACpB;SAAM,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,EAAE;MACxC,KAAK,CAAC,QAAQ,CACZ,MAAM,EACN,aAAa,EACb,UAAU,EACV,aAAa,EACb,WAAW,EACX,MAAM,EACN,OAAO,EACP,KAAK,CACN,CAAA;MACD,IAAI,CAAC,KAAK,GAAG,IAAI,KAAK,CACpB,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,EAC9B,oBAAoB,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAuB,CACjF,CAAC;MACF,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAA;KACpB;EACH,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,QAED,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC;MAC/C,CAAC,CAAC,cAAQ,EAAE,EAAC,OAAO,EAAC,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAI,CAE3D,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { Api, IApiResponseCollection } from '../../api';\nimport { Chart, BarController, Colors, BarElement, CategoryScale, LinearScale, Legend, Tooltip, Title, ChartConfiguration} from 'chart.js'\nimport { GrossVolumeReport, GrossVolumeReportDate } from '../../api/GrossVolume';\nimport { generateChartOptions } from './chart-utils';\nimport { ErrorState } from '../details/utils';\n\n@Component({\n tag: 'justifi-gross-payment-chart',\n styleUrl: 'gross-payment-chart.scss',\n shadow: true,\n})\nexport class GrossPaymentChart {\n chart: Chart\n chartRef: HTMLCanvasElement\n\n @Prop() accountId: string;\n @Prop() authToken: string;\n @State() data: GrossVolumeReport;\n @State() total: number;\n @State() dates: GrossVolumeReportDate[];\n @State() endDate: string;\n @State() loading: boolean = true;\n @State() errorMessage: string = '';\n\n @Watch('accountId')\n @Watch('authToken')\n updateOnPropChange() {\n this.fetchData();\n }\n\n connectedCallback() {\n this.fetchData();\n }\n \n componentDidRender() {\n this.renderChart();\n }\n\n async fetchData(): Promise<void> {\n if (!this.accountId \|\| !this.authToken) {\n this.errorMessage = \"Can not fetch any data without an AccountID and an AuthToken\";\n this.loading = false;\n return;\n }\n this.loading = true;\n\n const api = Api(this.authToken, ~~process~~.~~env.PRIVATE_API_ORIGIN~~);\n const endpoint = `account/${this.accountId}/reports/gross_volume`;\n const response: IApiResponseCollection<GrossVolumeReport> = await api.get(endpoint);\n\n if (!response.error) {\n this.total = response?.data.total;\n this.dates = response?.data.dates.reverse();\n this.endDate = this.dates[this.dates.length - 1].date;\n }\n\n this.loading = false;\n }\n\n renderChart() {\n if (this.chart) {\n this.chart.update()\n } else if (this.chartRef && this.endDate) {\n Chart.register(\n Colors,\n BarController,\n BarElement,\n CategoryScale,\n LinearScale,\n Legend,\n Tooltip,\n Title\n )\n this.chart = new Chart(\n this.chartRef.getContext(\"2d\"),\n generateChartOptions(this.total, this.dates, this.endDate) as ChartConfiguration\n );\n this.chart.render()\n }\n }\n\n render() {\n return (\n <Host>\n {\n this.errorMessage ? ErrorState(this.errorMessage) \n : <canvas id=\"chart\" ref={(elem) => this.chartRef = elem} />\n }\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"gross-payment-chart.js","sourceRoot":"","sources":["../../../../src/components/gross-payment-chart/gross-payment-chart.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { Api, IApiResponseCollection } from '../../api';\nimport { Chart, BarController, Colors, BarElement, CategoryScale, LinearScale, Legend, Tooltip, Title, ChartConfiguration } from 'chart.js'\nimport { GrossVolumeReport, GrossVolumeReportDate } from '../../api/GrossVolume';\nimport { generateChartOptions } from './chart-utils';\nimport { ErrorState } from '../details/utils';\nimport { config } from '../../../config';\n\n@Component({\n tag: 'justifi-gross-payment-chart',\n styleUrl: 'gross-payment-chart.scss',\n shadow: true,\n})\nexport class GrossPaymentChart {\n chart: Chart\n chartRef: HTMLCanvasElement\n\n @Prop() accountId: string;\n @Prop() authToken: string;\n @State() data: GrossVolumeReport;\n @State() total: number;\n @State() dates: GrossVolumeReportDate[];\n @State() endDate: string;\n @State() loading: boolean = true;\n @State() errorMessage: string = '';\n\n @Watch('accountId')\n @Watch('authToken')\n updateOnPropChange() {\n this.fetchData();\n }\n\n connectedCallback() {\n this.fetchData();\n }\n\n componentDidRender() {\n this.renderChart();\n }\n\n async fetchData(): Promise<void> {\n if (!this.accountId \|\| !this.authToken) {\n this.errorMessage = \"Can not fetch any data without an AccountID and an AuthToken\";\n this.loading = false;\n return;\n }\n this.loading = true;\n\n const api = Api(this.authToken, config.proxyApiOrigin);\n const endpoint = `account/${this.accountId}/reports/gross_volume`;\n const response: IApiResponseCollection<GrossVolumeReport> = await api.get(endpoint);\n\n if (!response.error) {\n this.total = response?.data.total;\n this.dates = response?.data.dates.reverse();\n this.endDate = this.dates[this.dates.length - 1].date;\n }\n\n this.loading = false;\n }\n\n renderChart() {\n if (this.chart) {\n this.chart.update()\n } else if (this.chartRef && this.endDate) {\n Chart.register(\n Colors,\n BarController,\n BarElement,\n CategoryScale,\n LinearScale,\n Legend,\n Tooltip,\n Title\n )\n this.chart = new Chart(\n this.chartRef.getContext(\"2d\"),\n generateChartOptions(this.total, this.dates, this.endDate) as ChartConfiguration\n );\n this.chart.render()\n }\n }\n\n render() {\n return (\n <Host>\n {\n this.errorMessage ? ErrorState(this.errorMessage)\n : <canvas id=\"chart\" ref={(elem) => this.chartRef = elem} />\n }\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/gross-payment-chart/gross-payment-chart.stories.js CHANGED Viewed

@@ -1,3 +1,4 @@
+import { config } from "../../../config";
 export default {
   title: 'dev/Components/GrossPaymentChart',
   component: 'justifi-gross-payment-chart',
@@ -5,8 +6,8 @@ export default {
 };
 class GrossChartArgs {
   constructor(args) {
-    this['auth-token'] = args['auth-token'] || '';
-    this['account-id'] = args['account-id'] || '';
+    this['auth-token'] = args['auth-token'] || config.proxyAuthToken;
+    this['account-id'] = args['account-id'] || config.exampleAccountId;
   }
 }
 const Template = (args) => {

package/dist/collection/components/gross-payment-chart/gross-payment-chart.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"gross-payment-chart.stories.js","sourceRoot":"","sources":["../../../../src/components/gross-payment-chart/gross-payment-chart.stories.ts"],"names":[],"mappings":"AAAA,eAAe;EACb,KAAK,EAAE,kCAAkC;EACzC,SAAS,EAAE,6BAA6B;EACxC,UAAU,EAAE,EAAE;CACf,CAAC;AAEF,MAAM,cAAc;EAIlB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,~~EAAE~~,CAAC;~~IAC9C~~,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,~~EAAE~~,CAAC;~~EAChD~~,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAoB,EAAE,EAAE;EACxC,OAAO,CAAC;;oBAEU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAA;AACJ,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,cAAc,CAAC,EAAE,CAAC,CAAC","sourcesContent":["~~export~~ default {\n title: 'dev/Components/GrossPaymentChart',\n component: 'justifi-gross-payment-chart',\n parameters: {}\n};\n\nclass GrossChartArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| '';\n this['account-id'] = args['account-id'] \|\| '';\n }\n}\n\nconst Template = (args: GrossChartArgs) => {\n return (`\n <justifi-gross-payment-chart \n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `)\n}\n\nexport const Basic = Template.bind({});\nBasic.args = new GrossChartArgs({});\n"]}
1	+ {"version":3,"file":"gross-payment-chart.stories.js","sourceRoot":"","sources":["../../../../src/components/gross-payment-chart/gross-payment-chart.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,kCAAkC;EACzC,SAAS,EAAE,6BAA6B;EACxC,UAAU,EAAE,EAAE;CACf,CAAC;AAEF,MAAM,cAAc;EAIlB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,cAAc,CAAC;IACjE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;EACrE,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAoB,EAAE,EAAE;EACxC,OAAO,CAAC;;oBAEU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAA;AACJ,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,cAAc,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { config } from \"../../../config\";\n\nexport default {\n title: 'dev/Components/GrossPaymentChart',\n component: 'justifi-gross-payment-chart',\n parameters: {}\n};\n\nclass GrossChartArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.proxyAuthToken;\n this['account-id'] = args['account-id'] \|\| config.exampleAccountId;\n }\n}\n\nconst Template = (args: GrossChartArgs) => {\n return (`\n <justifi-gross-payment-chart \n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `)\n}\n\nexport const Basic = Template.bind({});\nBasic.args = new GrossChartArgs({});\n"]}

package/dist/collection/components/payment-balance-transactions/payment-balance-transactions.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { Host, h } from "@stencil/core";
 import { Api, PaymentBalanceTransaction, pagingDefaults, } from "../../api";
 import { formatCurrency, formatDate, formatTime, snakeCaseToHumanReadable, } from "../../utils/utils";
+import { config } from "../../../config";
 export class PaymentBalanceTransactions {
   constructor() {
     this.handleClickPrevious = (beforeCursor) => {
@@ -36,7 +37,7 @@ export class PaymentBalanceTransactions {
       return;
     }
     const endpoint = `account/${this.accountId}/payments/${this.paymentId}/payment_balance_transactions`;
-    const response = await Api(this.authToken).get(endpoint, this.params);
+    const response = await Api(this.authToken, config.proxyApiOrigin).get(endpoint, this.params);
     if (!response.error) {
       this.paging = Object.assign(Object.assign({}, this.paging), response.page_info);
       this.balanceTransactions = response.data.map(dataItem => new PaymentBalanceTransaction(dataItem));

package/dist/collection/components/payment-balance-transactions/payment-balance-transactions.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"payment-balance-transactions.js","sourceRoot":"","sources":["../../../../src/components/payment-balance-transactions/payment-balance-transactions.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACvE,OAAO,EACL,GAAG,EAIH,yBAAyB,EACzB,cAAc,GACf,MAAM,WAAW,CAAC;AAEnB,OAAO,EACL,cAAc,EACd,UAAU,EACV,UAAU,EACV,wBAAwB,GACzB,MAAM,mBAAmB,CAAC;~~AAO3B~~,MAAM,OAAO,0BAA0B;;IAmBrC,wBAAmB,GAAG,CAAC,YAAoB,EAAE,EAAE;MAC7C,MAAM,SAAS,qBAAa,IAAI,CAAC,MAAM,CAAE,CAAC;MAC1C,OAAO,SAAS,CAAC,YAAY,CAAC;MAC9B,IAAI,CAAC,MAAM,GAAG,iCAAM,SAAS,KAAE,aAAa,EAAE,YAAY,IAAG,CAAC;IAChE,CAAC,CAAC;IAEF,oBAAe,GAAG,CAAC,WAAmB,EAAE,EAAE;MACxC,MAAM,SAAS,qBAAa,IAAI,CAAC,MAAM,CAAE,CAAC;MAC1C,OAAO,SAAS,CAAC,aAAa,CAAC;MAC/B,IAAI,CAAC,MAAM,GAAG,iCAAM,SAAS,KAAE,YAAY,EAAE,WAAW,IAAG,CAAC;IAC9D,CAAC,CAAC;;;;+BAzB2D,EAAE;mBACnC,IAAI;;kBAEF,cAAc;;;EAI5C,kBAAkB;IAChB,IAAI,CAAC,SAAS,EAAE,CAAC;EACnB,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,SAAS,EAAE,CAAC;EACnB,CAAC;EAcD,KAAK,CAAC,SAAS;IACb,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IAEpB,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;MACtC,IAAI,CAAC,YAAY,GAAG,gDAAgD,CAAC;MACrE,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;MACrB,OAAO;KACR;IACD,MAAM,QAAQ,GAAG,WAAW,IAAI,CAAC,SAAS,aAAa,IAAI,CAAC,SAAS,+BAA+B,CAAC;IAErG,MAAM,QAAQ,GACZ,MAAM,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;~~IAEvD~~,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE;MACnB,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,GACX,QAAQ,CAAC,SAAS,CACtB,CAAC;MACF,IAAI,CAAC,mBAAmB,GAAG,QAAQ,CAAC,IAAI,CAAC,GAAG,CAC1C,QAAQ,CAAC,EAAE,CAAC,IAAI,yBAAyB,CAAC,QAAQ,CAAC,CACpD,CAAC;KACH;SAAM;MACL,IAAI,CAAC,YAAY;QACf,OAAO,QAAQ,CAAC,KAAK,KAAK,QAAQ;UAChC,CAAC,CAAC,QAAQ,CAAC,KAAK;UAChB,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC;KAC9B;IACD,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;EACvB,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,qBACE,UAAU,EAAE;UACV,CAAC,cAAc,EAAE,oCAAoC,CAAC;UACtD,CAAC,MAAM,EAAE,8BAA8B,CAAC;UACxC,CAAC,IAAI,EAAE,2CAA2C,CAAC;UACnD,CAAC,OAAO,EAAE,uCAAuC,CAAC;UAClD;YACE,SAAS;YACT,8DAA8D;WAC/D;SACF,EACD,QAAQ,EAAE,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,WAAW,CAAC,EAAE,CAAC,EACrE,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,kBAAkB,CAAC,EAAE,CAAC;UAC1D;YACE,eAAM,UAAU,CAAC,kBAAkB,CAAC,UAAU,CAAC,CAAO;YACtD,eAAM,UAAU,CAAC,kBAAkB,CAAC,UAAU,CAAC,CAAO,CAClD;UACN,wBAAwB,CACtB,kBAAkB,CAAC,wBAAwB,CAC5C;UACD,kBAAkB,CAAC,UAAU;UAC7B,cAAc,CAAC,kBAAkB,CAAC,MAAM,CAAC;UACzC,cAAc,CAAC,kBAAkB,CAAC,OAAO,CAAC;SAC3C,CAAC,EACF,OAAO,EAAE,IAAI,CAAC,OAAO,mBACN,IAAI,CAAC,YAAY,EAChC,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,MAAM,kCACD,IAAI,CAAC,MAAM,KACd,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,mBAAmB,EAAE,IAAI,CAAC,mBAAmB,MAE/C,CACG,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, State, Watch } from '@stencil/core';\nimport {\n Api,\n IApiResponseCollection,\n IPaymentBalanceTransaction,\n PagingInfo,\n PaymentBalanceTransaction,\n pagingDefaults,\n} from '../../api';\n\nimport {\n formatCurrency,\n formatDate,\n formatTime,\n snakeCaseToHumanReadable,\n} from '../../utils/utils';\n\n@Component({\n tag: 'justifi-payment-balance-transactions',\n styleUrl: 'payment-balance-transactions.scss',\n shadow: true,\n})\nexport class PaymentBalanceTransactions {\n @Prop() accountId: string;\n @Prop() authToken: string;\n @Prop() paymentId: string;\n @State() balanceTransactions: IPaymentBalanceTransaction[] = [];\n @State() loading: boolean = true;\n @State() errorMessage: string;\n @State() paging: PagingInfo = pagingDefaults;\n @State() params: any\n\n @Watch('params')\n updateOnPropChange() {\n this.fetchData();\n }\n\n connectedCallback() {\n this.fetchData();\n }\n\n handleClickPrevious = (beforeCursor: string) => {\n const newParams: any = { ...this.params };\n delete newParams.after_cursor;\n this.params = ({ ...newParams, before_cursor: beforeCursor });\n };\n\n handleClickNext = (afterCursor: string) => {\n const newParams: any = { ...this.params };\n delete newParams.before_cursor;\n this.params = ({ ...newParams, after_cursor: afterCursor });\n }~~; \~~n\n async fetchData(): Promise<void> {\n this.loading = true;\n\n if (!this.accountId \|\| !this.paymentId) {\n this.errorMessage = 'Missing required props: accountId or paymentId';\n this.loading = false;\n return;\n }\n const endpoint = `account/${this.accountId}/payments/${this.paymentId}/payment_balance_transactions`;\n\n const response: IApiResponseCollection<IPaymentBalanceTransaction[]> =\n await Api(this.authToken).get(endpoint, this.params);\n\n if (!response.error) {\n this.paging = {\n ...this.paging,\n ...response.page_info,\n };\n this.balanceTransactions = response.data.map(\n dataItem => new PaymentBalanceTransaction(dataItem),\n );\n } else {\n this.errorMessage =\n typeof response.error === 'string'\n ? response.error\n : response.error.message;\n }\n this.loading = false;\n }\n\n render() {\n return (\n <Host>\n <justifi-table\n columnData={[\n ['Processed On', 'The date each transaction occurred'],\n ['Type', 'The type of each transaction'],\n ['ID', 'The unique identifier of each transaction'],\n ['Amout', 'The dollar amount of each transaction'],\n [\n 'Balance',\n 'The running total amount of this payment that belongs to you',\n ],\n ]}\n entityId={this.balanceTransactions.map(transaction => transaction.id)}\n rowData={this.balanceTransactions.map(balanceTransaction => [\n <div>\n <div>{formatDate(balanceTransaction.created_at)}</div>\n <div>{formatTime(balanceTransaction.created_at)}</div>\n </div>,\n snakeCaseToHumanReadable(\n balanceTransaction.payment_balance_txn_type,\n ),\n balanceTransaction.payment_id,\n formatCurrency(balanceTransaction.amount),\n formatCurrency(balanceTransaction.balance),\n ])}\n loading={this.loading}\n error-message={this.errorMessage}\n params={this.params}\n paging={{\n ...this.paging,\n handleClickNext: this.handleClickNext,\n handleClickPrevious: this.handleClickPrevious\n }}\n />\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"payment-balance-transactions.js","sourceRoot":"","sources":["../../../../src/components/payment-balance-transactions/payment-balance-transactions.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch } from '@stencil/core';\nimport {\n Api,\n IApiResponseCollection,\n IPaymentBalanceTransaction,\n PagingInfo,\n PaymentBalanceTransaction,\n pagingDefaults,\n} from '../../api';\n\nimport {\n formatCurrency,\n formatDate,\n formatTime,\n snakeCaseToHumanReadable,\n} from '../../utils/utils';\nimport { config } from '../../../config';\n\n@Component({\n tag: 'justifi-payment-balance-transactions',\n styleUrl: 'payment-balance-transactions.scss',\n shadow: true,\n})\nexport class PaymentBalanceTransactions {\n @Prop() accountId: string;\n @Prop() authToken: string;\n @Prop() paymentId: string;\n @State() balanceTransactions: IPaymentBalanceTransaction[] = [];\n @State() loading: boolean = true;\n @State() errorMessage: string;\n @State() paging: PagingInfo = pagingDefaults;\n @State() params: any\n\n @Watch('params')\n updateOnPropChange() {\n this.fetchData();\n }\n\n connectedCallback() {\n this.fetchData();\n }\n\n handleClickPrevious = (beforeCursor: string) => {\n const newParams: any = { ...this.params };\n delete newParams.after_cursor;\n this.params = ({ ...newParams, before_cursor: beforeCursor });\n };\n\n handleClickNext = (afterCursor: string) => {\n const newParams: any = { ...this.params };\n delete newParams.before_cursor;\n this.params = ({ ...newParams, after_cursor: afterCursor });\n };\n\n async fetchData(): Promise<void> {\n this.loading = true;\n\n if (!this.accountId \|\| !this.paymentId) {\n this.errorMessage = 'Missing required props: accountId or paymentId';\n this.loading = false;\n return;\n }\n const endpoint = `account/${this.accountId}/payments/${this.paymentId}/payment_balance_transactions`;\n\n const response: IApiResponseCollection<IPaymentBalanceTransaction[]> =\n await Api(this.authToken, config.proxyApiOrigin).get(endpoint, this.params);\n\n if (!response.error) {\n this.paging = {\n ...this.paging,\n ...response.page_info,\n };\n this.balanceTransactions = response.data.map(\n dataItem => new PaymentBalanceTransaction(dataItem),\n );\n } else {\n this.errorMessage =\n typeof response.error === 'string'\n ? response.error\n : response.error.message;\n }\n this.loading = false;\n }\n\n render() {\n return (\n <Host>\n <justifi-table\n columnData={[\n ['Processed On', 'The date each transaction occurred'],\n ['Type', 'The type of each transaction'],\n ['ID', 'The unique identifier of each transaction'],\n ['Amout', 'The dollar amount of each transaction'],\n [\n 'Balance',\n 'The running total amount of this payment that belongs to you',\n ],\n ]}\n entityId={this.balanceTransactions.map(transaction => transaction.id)}\n rowData={this.balanceTransactions.map(balanceTransaction => [\n <div>\n <div>{formatDate(balanceTransaction.created_at)}</div>\n <div>{formatTime(balanceTransaction.created_at)}</div>\n </div>,\n snakeCaseToHumanReadable(\n balanceTransaction.payment_balance_txn_type,\n ),\n balanceTransaction.payment_id,\n formatCurrency(balanceTransaction.amount),\n formatCurrency(balanceTransaction.balance),\n ])}\n loading={this.loading}\n error-message={this.errorMessage}\n params={this.params}\n paging={{\n ...this.paging,\n handleClickNext: this.handleClickNext,\n handleClickPrevious: this.handleClickPrevious\n }}\n />\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/payment-balance-transactions/payment-balance-transactions.stories.js CHANGED Viewed

@@ -1,13 +1,14 @@
+import { config } from "../../../config";
 export default {
-  title: 'Components/PaymentBalanceTransactions',
+  title: 'dev/Components/PaymentBalanceTransactions',
   component: 'justifi-payment-balance-transactions',
   parameters: {},
 };
 class PaymentBalanceTransactionsArgs {
   constructor(args) {
-    this['auth-token'] = args['auth-token'] || '';
-    this['payment-id'] = args['payment-id'] || '';
-    this['account-id'] = args['account-id'] || '';
+    this['auth-token'] = args['auth-token'] || config.proxyAuthToken;
+    this['payment-id'] = args['payment-id'] || config.examplePaymentId;
+    this['account-id'] = args['account-id'] || config.exampleAccountId;
   }
 }
 const Template = (args) => {

package/dist/collection/components/payment-balance-transactions/payment-balance-transactions.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"payment-balance-transactions.stories.js","sourceRoot":"","sources":["../../../../src/components/payment-balance-transactions/payment-balance-transactions.stories.ts"],"names":[],"mappings":"AAAA,eAAe;EACb,KAAK,EAAE,~~uCAAuC~~;~~EAC9C~~,SAAS,EAAE,sCAAsC;EACjD,UAAU,EAAE,EAAE;CACf,CAAC;AAEF,MAAM,8BAA8B;EAKlC,YAAc,IAAI;IAChB,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,~~EAAE~~,CAAC;~~IAC9C~~,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,~~EAAE~~,CAAC;~~IAC9C~~,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,~~EAAE~~,CAAC;~~EAChD~~,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAoC,EAAE,EAAE;EACxD,OAAO;;;oBAGW,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,8BAA8B,CAAC,EAAE,CAAC,CAAC;AAEpD,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,8BAA8B,CAAC,EAAE,CAAC,CAAC;AACrD,MAAM,CAAC,UAAU,GAAG;EAClB,KAAK,CAAC,EAAE,CAAC;MACL,KAAK,EAAE;GACV;CACF,CAAC","sourcesContent":["~~export~~ default {\n title: 'Components/PaymentBalanceTransactions',\n component: 'justifi-payment-balance-transactions',\n parameters: {},\n};\n\nclass PaymentBalanceTransactionsArgs {\n 'auth-token': string;\n 'payment-id': string;\n 'account-id': string;\n\n 'constructor'(args) {\n this['auth-token'] = args['auth-token'] \|\| '';\n this['payment-id'] = args['payment-id'] \|\| '';\n this['account-id'] = args['account-id'] \|\| '';\n }\n}\n\nconst Template = (args: PaymentBalanceTransactionsArgs) => {\n return `\n <justifi-payment-balance-transactions\n data-testid=\"justifi-payment-balance-transactions\"\n auth-token=\"${args['auth-token']}\"\n payment-id=\"${args['payment-id']}\"\n account-id=\"${args['account-id']}\"\n />\n `;\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new PaymentBalanceTransactionsArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new PaymentBalanceTransactionsArgs({});\nStyled.decorators = [\n Story => `\n ${Story()}\n `,\n];\n"]}
1	+ {"version":3,"file":"payment-balance-transactions.stories.js","sourceRoot":"","sources":["../../../../src/components/payment-balance-transactions/payment-balance-transactions.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,2CAA2C;EAClD,SAAS,EAAE,sCAAsC;EACjD,UAAU,EAAE,EAAE;CACf,CAAC;AAEF,MAAM,8BAA8B;EAKlC,YAAc,IAAI;IAChB,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,cAAc,CAAC;IACjE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;IACnE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;EACrE,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAoC,EAAE,EAAE;EACxD,OAAO;;;oBAGW,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,8BAA8B,CAAC,EAAE,CAAC,CAAC;AAEpD,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,8BAA8B,CAAC,EAAE,CAAC,CAAC;AACrD,MAAM,CAAC,UAAU,GAAG;EAClB,KAAK,CAAC,EAAE,CAAC;MACL,KAAK,EAAE;GACV;CACF,CAAC","sourcesContent":["import { config } from \"../../../config\";\n\nexport default {\n title: 'dev/Components/PaymentBalanceTransactions',\n component: 'justifi-payment-balance-transactions',\n parameters: {},\n};\n\nclass PaymentBalanceTransactionsArgs {\n 'auth-token': string;\n 'payment-id': string;\n 'account-id': string;\n\n 'constructor'(args) {\n this['auth-token'] = args['auth-token'] \|\| config.proxyAuthToken;\n this['payment-id'] = args['payment-id'] \|\| config.examplePaymentId;\n this['account-id'] = args['account-id'] \|\| config.exampleAccountId;\n }\n}\n\nconst Template = (args: PaymentBalanceTransactionsArgs) => {\n return `\n <justifi-payment-balance-transactions\n data-testid=\"justifi-payment-balance-transactions\"\n auth-token=\"${args['auth-token']}\"\n payment-id=\"${args['payment-id']}\"\n account-id=\"${args['account-id']}\"\n />\n `;\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new PaymentBalanceTransactionsArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new PaymentBalanceTransactionsArgs({});\nStyled.decorators = [\n Story => `\n ${Story()}\n `,\n];\n"]}

package/dist/collection/components/payment-details/payment-details.js CHANGED Viewed

@@ -60,10 +60,8 @@ export class PaymentDetails {
     this.loading = false;
   }
   render() {
-    var _a;
-    return (h(Host, null, this.loading ? LoadingState :
-      !this.payment ? ErrorState(this.errorMessage) :
-        h("justifi-details", { "error-message": this.errorMessage }, h(EntityHeadInfo, { slot: "head-info", badge: h("span", { slot: 'badge', innerHTML: MapPaymentStatusToBadge((_a = this.payment) === null || _a === void 0 ? void 0 : _a.status) }), title: `${formatCurrency(this.payment.amount)} ${this.payment.currency.toUpperCase()}` }, h(EntityHeadInfoItem, { classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payment.updated_at)} ${formatTime(this.payment.updated_at)}` }), h(EntityHeadInfoItem, { classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payment.created_at)} ${formatTime(this.payment.created_at)}` }), h(EntityHeadInfoItem, { title: "ID", value: this.payment.id })), h("div", { slot: 'detail-sections' }, h(DetailSection, { sectionTitle: "Details" }, h(DetailItem, { title: "Amount", value: formatCurrency(this.payment.amount) }), h(DetailItem, { title: "Fees", value: formatCurrency(this.payment.fee_amount) }), h(DetailItem, { title: "Refunded", value: formatCurrency(this.payment.amount_refunded) }), h(DetailItem, { title: "Net", value: formatCurrency(this.payment.balance) }), h(DetailItem, { title: "Status", value: MapPaymentStatusToBadge(this.payment.status) }), h(DetailItem, { title: "Payment ID", value: this.payment.id }), h(DetailItem, { title: "Processing Fees", value: formatCurrency(this.payment.fee_amount) }), h(DetailItem, { title: "Statement Descriptor", value: this.payment.statement_descriptor }), h(DetailItem, { title: "Description", value: this.payment.description })), h(DetailSection, { sectionTitle: "Payment Method" }, h(DetailItem, { title: "ID", value: this.payment.payment_method.card.id }), h(DetailItem, { title: "Payment Type", value: "Card" }), h(DetailItem, { title: "Last 4 Numbers", value: this.payment.payment_method.card.acct_last_four }), h(DetailItem, { title: "Brand", value: this.payment.payment_method.card.brand }), h(DetailItem, { title: "Cardholder", value: this.payment.payment_method.card.name })), h(DetailSection, { sectionTitle: 'Metadata' }, h(CodeBlock, { metadata: this.payment.metadata }))))));
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
+    return (h(Host, null, this.loading && LoadingState, !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && this.payment && (h("justifi-details", { "error-message": this.errorMessage }, h(EntityHeadInfo, { slot: "head-info", badge: h("span", { slot: 'badge', innerHTML: MapPaymentStatusToBadge((_a = this.payment) === null || _a === void 0 ? void 0 : _a.status) }), title: `${formatCurrency(this.payment.amount)} ${this.payment.currency.toUpperCase()}` }, h(EntityHeadInfoItem, { classes: "border-1 border-end", title: "Updated At", value: `${formatDate((_b = this.payment) === null || _b === void 0 ? void 0 : _b.updated_at)} ${formatTime((_c = this.payment) === null || _c === void 0 ? void 0 : _c.updated_at)}` }), h(EntityHeadInfoItem, { classes: "border-1 border-end", title: "Created At", value: `${formatDate((_d = this.payment) === null || _d === void 0 ? void 0 : _d.created_at)} ${formatTime((_e = this.payment) === null || _e === void 0 ? void 0 : _e.created_at)}` }), h(EntityHeadInfoItem, { title: "ID", value: (_f = this.payment) === null || _f === void 0 ? void 0 : _f.id })), h("div", { slot: 'detail-sections' }, h(DetailSection, { sectionTitle: "Details" }, h(DetailItem, { title: "Amount", value: formatCurrency((_g = this.payment) === null || _g === void 0 ? void 0 : _g.amount) }), h(DetailItem, { title: "Fees", value: formatCurrency((_h = this.payment) === null || _h === void 0 ? void 0 : _h.fee_amount) }), h(DetailItem, { title: "Refunded", value: formatCurrency((_j = this.payment) === null || _j === void 0 ? void 0 : _j.amount_refunded) }), h(DetailItem, { title: "Net", value: formatCurrency((_k = this.payment) === null || _k === void 0 ? void 0 : _k.balance) }), h(DetailItem, { title: "Status", value: MapPaymentStatusToBadge((_l = this.payment) === null || _l === void 0 ? void 0 : _l.status) }), h(DetailItem, { title: "Payment ID", value: (_m = this.payment) === null || _m === void 0 ? void 0 : _m.id }), h(DetailItem, { title: "Processing Fees", value: formatCurrency((_o = this.payment) === null || _o === void 0 ? void 0 : _o.fee_amount) }), h(DetailItem, { title: "Statement Descriptor", value: (_p = this.payment) === null || _p === void 0 ? void 0 : _p.statement_descriptor }), h(DetailItem, { title: "Description", value: (_q = this.payment) === null || _q === void 0 ? void 0 : _q.description })), ((_r = this.payment) === null || _r === void 0 ? void 0 : _r.payment_method.card) && (h(DetailSection, { sectionTitle: "Payment Method" }, h(DetailItem, { title: "ID", value: (_s = this.payment) === null || _s === void 0 ? void 0 : _s.payment_method.card.id }), h(DetailItem, { title: "Payment Type", value: "Card" }), h(DetailItem, { title: "Last 4 Numbers", value: (_t = this.payment) === null || _t === void 0 ? void 0 : _t.payment_method.card.acct_last_four }), h(DetailItem, { title: "Brand", value: (_u = this.payment) === null || _u === void 0 ? void 0 : _u.payment_method.card.brand }), h(DetailItem, { title: "Cardholder", value: (_v = this.payment) === null || _v === void 0 ? void 0 : _v.payment_method.card.name }))), ((_w = this.payment) === null || _w === void 0 ? void 0 : _w.payment_method.bank_account) && (h(DetailSection, { sectionTitle: "Payment Method" }, h(DetailItem, { title: "ID", value: (_x = this.payment) === null || _x === void 0 ? void 0 : _x.payment_method.bank_account.id }), h(DetailItem, { title: "Last 4 Numbers", value: (_y = this.payment) === null || _y === void 0 ? void 0 : _y.payment_method.bank_account.acct_last_four }), h(DetailItem, { title: "Bank Name", value: (_z = this.payment) === null || _z === void 0 ? void 0 : _z.payment_method.bank_account.bank_name }), h(DetailItem, { title: "Account Owner", value: (_0 = this.payment) === null || _0 === void 0 ? void 0 : _0.payment_method.bank_account.account_owner_name }))), h(DetailSection, { sectionTitle: 'Metadata' }, h(CodeBlock, { metadata: (_1 = this.payment) === null || _1 === void 0 ? void 0 : _1.metadata })))))));
   }
   static get is() { return "justifi-payment-details"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/payment-details/payment-details.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"payment-details.js","sourceRoot":"","sources":["../../../../src/components/payment-details/payment-details.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch } from '@stencil/core';\nimport { Api, IApiResponseCollection, Payment } from '../../api';\nimport { MapPaymentStatusToBadge, formatCurrency, formatDate, formatTime } from '../../utils/utils';\nimport { CodeBlock, DetailItem, DetailSection, EntityHeadInfo, EntityHeadInfoItem, ErrorState, LoadingState } from '../details/utils';\nimport { config } from '../../../config';\n\n/*\n @exportedPart detail-loading-spinner\n * @exportedPart detail-loading-state\n * @exportedPart detail-empty-state\n * @exportedPart detail-head\n * @exportedPart detail-title\n * @exportedPart detail-method\n * @exportedPart detail-info\n * @exportedPart detail-info-item\n * @exportedPart detail-info-item-title\n * @exportedPart detail-info-item-data\n * @exportedPart detail-metadata\n * @exportedPart detail-metadata-title\n * @exportedPart detail-method-title\n * @exportedPart detail-method-data\n * @exportedPart detail-section\n * @exportedPart detail-section-title\n * @exportedPart detail-section-item-title\n * @exportedPart detail-section-item-data\n * @exportedPart detail-head-info\n * @exportedPart detail-head-info-item\n * @exportedPart detail-head-info-item-title\n * @exportedPart detail-head-info-item-data\n*/\n@Component({\n tag: 'justifi-payment-details',\n styleUrl: 'payment-details.scss',\n shadow: true,\n})\n\nexport class PaymentDetails {\n @Prop() paymentId: string;\n @Prop() authToken: string;\n @State() payment: Payment;\n @State() loading: boolean = true;\n @State() errorMessage: string;\n\n @Watch('paymentId')\n @Watch('authToken')\n updateOnPropChange() {\n this.fetchData();\n }\n\n connectedCallback() {\n this.fetchData();\n }\n\n async fetchData(): Promise<void> {\n this.errorMessage = '';\n if (!this.paymentId \|\| !this.authToken) {\n this.errorMessage = \"Can not fetch any data without a PaymentID and an AuthToken\";\n this.loading = false;\n return;\n }\n this.loading = true;\n const endpoint = `payments/${this.paymentId}`;\n\n const response: IApiResponseCollection<Payment> = await Api(this.authToken, config.proxyApiOrigin).get(endpoint);\n if (!response.error) {\n this.payment = response.data;\n } else {\n this.errorMessage = typeof response.error === 'string' ? response.error : response.error.message;\n }\n\n this.loading = false;\n }\n\n render() {\n return (\n <Host>\n {\n this.loading ? LoadingState :\n !this.payment ? ErrorState(this.errorMessage) :\n <justifi-details error-message={this.errorMessage}>\n <EntityHeadInfo slot=\"head-info\" badge={<span slot='badge' innerHTML={MapPaymentStatusToBadge(this.payment?.status)} />} title={`${formatCurrency(this.payment.amount)} ${this.payment.currency.toUpperCase()}`}>\n <EntityHeadInfoItem\n classes=\"border-1 border-end\"\n title=\"Updated At\"\n value={`${formatDate(this.payment.updated_at)} ${formatTime(this.payment.updated_at)}`}\n />\n <EntityHeadInfoItem\n classes=\"border-1 border-end\"\n title=\"Created At\"\n value={`${formatDate(this.payment.created_at)} ${formatTime(this.payment.created_at)}`}\n />\n <EntityHeadInfoItem title=\"ID\" value={this.payment.id} />\n </EntityHeadInfo>\n <div slot='detail-sections'>\n <DetailSection sectionTitle=\"Details\">\n <DetailItem title=\"Amount\" value={formatCurrency(this.payment.amount)} />\n <DetailItem title=\"Fees\" value={formatCurrency(this.payment.fee_amount)} />\n <DetailItem title=\"Refunded\" value={formatCurrency(this.payment.amount_refunded)} />\n <DetailItem title=\"Net\" value={formatCurrency(this.payment.balance)} />\n <DetailItem title=\"Status\" value={MapPaymentStatusToBadge(this.payment.status)} />\n <DetailItem title=\"Payment ID\" value={this.payment.id} />\n <DetailItem title=\"Processing Fees\" value={formatCurrency(this.payment.fee_amount)} />\n <DetailItem title=\"Statement Descriptor\" value={this.payment.statement_descriptor} />\n <DetailItem title=\"Description\" value={this.payment.description} />\n </DetailSection>\n <DetailSection sectionTitle=\"Payment Method\">\n <DetailItem title=\"ID\" value={this.payment.payment_method.card.id} />\n <DetailItem title=\"Payment Type\" value=\"Card\" />\n <DetailItem title=\"Last 4 Numbers\" value={this.payment.payment_method.card.acct_last_four} />\n <DetailItem title=\"Brand\" value={this.payment.payment_method.card.brand} />\n <DetailItem title=\"Cardholder\" value={this.payment.payment_method.card.name} />\n </DetailSection>\n <DetailSection sectionTitle='Metadata'>\n <CodeBlock metadata={this.payment.metadata} />\n </DetailSection>\n </div>\n </justifi-details>\n }\n </Host>\n );\n }\n}"]}
1	+ {"version":3,"file":"payment-details.js","sourceRoot":"","sources":["../../../../src/components/payment-details/payment-details.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch } from '@stencil/core';\nimport { Api, IApiResponseCollection, Payment } from '../../api';\nimport { MapPaymentStatusToBadge, formatCurrency, formatDate, formatTime } from '../../utils/utils';\nimport { CodeBlock, DetailItem, DetailSection, EntityHeadInfo, EntityHeadInfoItem, ErrorState, LoadingState } from '../details/utils';\nimport { config } from '../../../config';\n\n/*\n @exportedPart detail-loading-spinner\n * @exportedPart detail-loading-state\n * @exportedPart detail-empty-state\n * @exportedPart detail-head\n * @exportedPart detail-title\n * @exportedPart detail-method\n * @exportedPart detail-info\n * @exportedPart detail-info-item\n * @exportedPart detail-info-item-title\n * @exportedPart detail-info-item-data\n * @exportedPart detail-metadata\n * @exportedPart detail-metadata-title\n * @exportedPart detail-method-title\n * @exportedPart detail-method-data\n * @exportedPart detail-section\n * @exportedPart detail-section-title\n * @exportedPart detail-section-item-title\n * @exportedPart detail-section-item-data\n * @exportedPart detail-head-info\n * @exportedPart detail-head-info-item\n * @exportedPart detail-head-info-item-title\n * @exportedPart detail-head-info-item-data\n*/\n@Component({\n tag: 'justifi-payment-details',\n styleUrl: 'payment-details.scss',\n shadow: true,\n})\n\nexport class PaymentDetails {\n @Prop() paymentId: string;\n @Prop() authToken: string;\n @State() payment: Payment;\n @State() loading: boolean = true;\n @State() errorMessage: string;\n\n @Watch('paymentId')\n @Watch('authToken')\n updateOnPropChange() {\n this.fetchData();\n }\n\n connectedCallback() {\n this.fetchData();\n }\n\n async fetchData(): Promise<void> {\n this.errorMessage = '';\n if (!this.paymentId \|\| !this.authToken) {\n this.errorMessage = \"Can not fetch any data without a PaymentID and an AuthToken\";\n this.loading = false;\n return;\n }\n this.loading = true;\n const endpoint = `payments/${this.paymentId}`;\n const response: IApiResponseCollection<Payment> = await Api(this.authToken, config.proxyApiOrigin).get(endpoint);\n\n if (!response.error) {\n this.payment = response.data;\n } else {\n this.errorMessage = typeof response.error === 'string' ? response.error : response.error.message;\n }\n\n this.loading = false;\n }\n\n render() {\n return (\n <Host>\n {this.loading && LoadingState}\n {!this.loading && this.errorMessage && ErrorState(this.errorMessage)}\n {!this.loading && this.payment && (\n <justifi-details error-message={this.errorMessage}>\n <EntityHeadInfo slot=\"head-info\" badge={<span slot='badge' innerHTML={MapPaymentStatusToBadge(this.payment?.status)} />} title={`${formatCurrency(this.payment.amount)} ${this.payment.currency.toUpperCase()}`}>\n <EntityHeadInfoItem\n classes=\"border-1 border-end\"\n title=\"Updated At\"\n value={`${formatDate(this.payment?.updated_at)} ${formatTime(this.payment?.updated_at)}`}\n />\n <EntityHeadInfoItem\n classes=\"border-1 border-end\"\n title=\"Created At\"\n value={`${formatDate(this.payment?.created_at)} ${formatTime(this.payment?.created_at)}`}\n />\n <EntityHeadInfoItem title=\"ID\" value={this.payment?.id} />\n </EntityHeadInfo>\n <div slot='detail-sections'>\n <DetailSection sectionTitle=\"Details\">\n <DetailItem title=\"Amount\" value={formatCurrency(this.payment?.amount)} />\n <DetailItem title=\"Fees\" value={formatCurrency(this.payment?.fee_amount)} />\n <DetailItem title=\"Refunded\" value={formatCurrency(this.payment?.amount_refunded)} />\n <DetailItem title=\"Net\" value={formatCurrency(this.payment?.balance)} />\n <DetailItem title=\"Status\" value={MapPaymentStatusToBadge(this.payment?.status)} />\n <DetailItem title=\"Payment ID\" value={this.payment?.id} />\n <DetailItem title=\"Processing Fees\" value={formatCurrency(this.payment?.fee_amount)} />\n <DetailItem title=\"Statement Descriptor\" value={this.payment?.statement_descriptor} />\n <DetailItem title=\"Description\" value={this.payment?.description} />\n </DetailSection>\n {this.payment?.payment_method.card && (\n <DetailSection sectionTitle=\"Payment Method\">\n <DetailItem title=\"ID\" value={this.payment?.payment_method.card.id} />\n <DetailItem title=\"Payment Type\" value=\"Card\" />\n <DetailItem title=\"Last 4 Numbers\" value={this.payment?.payment_method.card.acct_last_four} />\n <DetailItem title=\"Brand\" value={this.payment?.payment_method.card.brand} />\n <DetailItem title=\"Cardholder\" value={this.payment?.payment_method.card.name} />\n </DetailSection>\n )}\n {this.payment?.payment_method.bank_account && (\n <DetailSection sectionTitle=\"Payment Method\">\n <DetailItem title=\"ID\" value={this.payment?.payment_method.bank_account.id} />\n <DetailItem title=\"Last 4 Numbers\" value={this.payment?.payment_method.bank_account.acct_last_four} />\n <DetailItem title=\"Bank Name\" value={this.payment?.payment_method.bank_account.bank_name} />\n <DetailItem title=\"Account Owner\" value={this.payment?.payment_method.bank_account.account_owner_name} />\n </DetailSection>\n )}\n <DetailSection sectionTitle='Metadata'>\n <CodeBlock metadata={this.payment?.metadata} />\n </DetailSection>\n </div>\n </justifi-details>\n )}\n </Host>\n );\n }\n}"]}

package/dist/collection/components/payments-list/payments-list.js CHANGED Viewed

@@ -71,6 +71,14 @@ export class PaymentsList {
   getPaymentMethod(paymentMethod) {
     return paymentMethod.card || paymentMethod.bank_account;
   }
+  getPaymentMethodName(paymentMethod) {
+    if (paymentMethod.card) {
+      return paymentMethod.card.name;
+    }
+    else {
+      return paymentMethod.bank_account.account_owner_name;
+    }
+  }
   render() {
     return (h(Host, null, h("justifi-table", { rowClickHandler: e => {
         const clickedPaymentID = e.target.closest('tr').dataset.rowEntityId;
@@ -96,7 +104,7 @@ export class PaymentsList {
         },
         formatCurrency(payment.amount),
         payment.description,
-        this.getPaymentMethod(payment.payment_method).name,
+        this.getPaymentMethodName(payment.payment_method),
         this.getPaymentMethod(payment.payment_method).acct_last_four,
         {
           type: 'inner',

package/dist/collection/components/payments-list/payments-list.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"payments-list.js","sourceRoot":"","sources":["../../../../src/components/payments-list/payments-list.tsx"],"names":[],"mappings":"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~~gBAAgB~~,CAAC,OAAO,CAAC,cAAc,CAAC~~,CAAC,IAAI~~;~~UAClD~~,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,cAAc;UAC5D;YACE,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,uBAAuB,CAAC,OAAO,CAAC,MAAM,CAAC;WAC/C;UACD,OAAO,CAAC,EAAE;SACX,CACF,CAAC,EAEJ,OAAO,EAAE,IAAI,CAAC,OAAO,mBACN,IAAI,CAAC,YAAY,EAChC,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,MAAM,kCACD,IAAI,CAAC,MAAM,KACd,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,mBAAmB,EAAE,IAAI,CAAC,mBAAmB,MAE/C,CACG,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, State, Watch, Event, EventEmitter } from '@stencil/core';\nimport { Api, IApiResponseCollection, IPaymentMethod, PagingInfo, Payment, pagingDefaults } from '../../api';\nimport { MapPaymentStatusToBadge, formatCurrency, formatDate, formatTime } from '../../utils/utils';\nimport { config } from '../../../config';\n\n/*\n @exportedPart table-head: Table head\n * @exportedPart table-head-row: Head row\n * @exportedPart table-head-cell: Individual head cell\n * @exportedPart table-body: Body of the table\n * @exportedPart table-row: Row of the table\n * @exportedPart table-cell: Individual cell of the table\n * @exportedPart loading-state-cell: Row for loading state\n * @exportedPart loading-state-spinner: Spinner element for loading state\n * @exportedPart error-state: Row for Error state\n * @exportedPart empty-state: Row for Emtpy state\n * @exportedPart pagination-bar: Pagination bar\n * @exportedPart arrow: Both paging buttons\n * @exportedPart arrow-left: Previous page button\n * @exportedPart arrow-right: Next page button\n * @exportedPart button-disabled: Disabled state for paging buttons\n * @exportedPart previous-button-text: Text for Previous button\n * @exportedPart next-button-text: Text for Next button\n*/\n@Component({\n tag: 'justifi-payments-list',\n styleUrl: 'payments-list.scss',\n shadow: true,\n})\n\nexport class PaymentsList {\n @Prop() accountId: string;\n @Prop() authToken: string;\n @State() payments: Payment[] = [];\n @State() loading: boolean = true;\n @State() errorMessage: string;\n @State() paging: PagingInfo = pagingDefaults;\n @State() params: any;\n @Event({\n eventName: 'payment-row-clicked',\n bubbles: true,\n }) rowClicked: EventEmitter<Payment>;\n\n @Watch('accountId')\n @Watch('authToken')\n @Watch('params')\n updateOnPropChange() {\n this.fetchData();\n }\n\n connectedCallback() {\n this.fetchData();\n }\n\n handleClickPrevious = (beforeCursor: string) => {\n const newParams: any = { ...this.params };\n delete newParams.after_cursor;\n this.params = ({ ...newParams, before_cursor: beforeCursor });\n };\n\n handleClickNext = (afterCursor: string) => {\n const newParams: any = { ...this.params };\n delete newParams.before_cursor;\n this.params = ({ ...newParams, after_cursor: afterCursor });\n };\n\n async fetchData(): Promise<void> {\n if (!this.accountId \|\| !this.authToken) {\n this.errorMessage = \"Can not fetch any data without an AccountID and an AuthToken\";\n this.loading = false;\n return;\n }\n\n this.loading = true;\n\n const api = Api(this.authToken, config.proxyApiOrigin);\n const endpoint = `account/${this.accountId}/payments`;\n\n const response: IApiResponseCollection<Payment[]> = await api.get(endpoint, this.params);\n\n if (!response.error) {\n this.paging = {\n ...this.paging,\n ...response.page_info\n }\n\n const data = response?.data?.map(dataItem => new Payment(dataItem));\n this.payments = data;\n } else {\n this.errorMessage = typeof response.error === 'string' ? response.error : response.error.message;\n }\n\n this.loading = false;\n }\n\n getPaymentMethod(paymentMethod: IPaymentMethod) {\n return paymentMethod.card \|\| paymentMethod.bank_account\n }\n\n render() {\n return (\n <Host>\n <justifi-table\n rowClickHandler={e => {\n const clickedPaymentID = e.target.closest('tr').dataset.rowEntityId;\n if (!clickedPaymentID) { return }\n this.rowClicked.emit(this.payments.find((payment) => payment.id === clickedPaymentID));\n }}\n entityId={this.payments.map((payment) => payment.id)}\n columnData={[\n ['Made On', 'The date and time each payment was made'],\n ['Amount', 'The dollar amount of each payment'],\n ['Description', 'The payment description, if you provided one'],\n ['Cardholder', 'The name associated with the payment method'],\n ['Payment Method', 'The brand and last 4 digits of the payment method'],\n ['Status', 'The current status of each payment'],\n ['Payment ID', 'The unique identifier of each payment']\n ]}\n rowData={\n this.payments.map((payment) => (\n [\n {\n type: 'head',\n value: `\n <div>${formatDate(payment.created_at)}</div>\n <div>${formatTime(payment.created_at)}</div>\n `,\n },\n formatCurrency(payment.amount),\n payment.description,\n this.~~getPaymentMethod~~(payment.payment_method)~~.name~~,\n this.getPaymentMethod(payment.payment_method).acct_last_four,\n {\n type: 'inner',\n value: MapPaymentStatusToBadge(payment.status)\n },\n payment.id\n ]\n ))\n }\n loading={this.loading}\n error-message={this.errorMessage}\n params={this.params}\n paging={{\n ...this.paging,\n handleClickNext: this.handleClickNext,\n handleClickPrevious: this.handleClickPrevious\n }}\n />\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"payments-list.js","sourceRoot":"","sources":["../../../../src/components/payments-list/payments-list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch, Event, EventEmitter } from '@stencil/core';\nimport { Api, IApiResponseCollection, IPaymentMethod, PagingInfo, Payment, pagingDefaults } from '../../api';\nimport { MapPaymentStatusToBadge, formatCurrency, formatDate, formatTime } from '../../utils/utils';\nimport { config } from '../../../config';\n\n/*\n @exportedPart table-head: Table head\n * @exportedPart table-head-row: Head row\n * @exportedPart table-head-cell: Individual head cell\n * @exportedPart table-body: Body of the table\n * @exportedPart table-row: Row of the table\n * @exportedPart table-cell: Individual cell of the table\n * @exportedPart loading-state-cell: Row for loading state\n * @exportedPart loading-state-spinner: Spinner element for loading state\n * @exportedPart error-state: Row for Error state\n * @exportedPart empty-state: Row for Emtpy state\n * @exportedPart pagination-bar: Pagination bar\n * @exportedPart arrow: Both paging buttons\n * @exportedPart arrow-left: Previous page button\n * @exportedPart arrow-right: Next page button\n * @exportedPart button-disabled: Disabled state for paging buttons\n * @exportedPart previous-button-text: Text for Previous button\n * @exportedPart next-button-text: Text for Next button\n*/\n@Component({\n tag: 'justifi-payments-list',\n styleUrl: 'payments-list.scss',\n shadow: true,\n})\n\nexport class PaymentsList {\n @Prop() accountId: string;\n @Prop() authToken: string;\n @State() payments: Payment[] = [];\n @State() loading: boolean = true;\n @State() errorMessage: string;\n @State() paging: PagingInfo = pagingDefaults;\n @State() params: any;\n @Event({\n eventName: 'payment-row-clicked',\n bubbles: true,\n }) rowClicked: EventEmitter<Payment>;\n\n @Watch('accountId')\n @Watch('authToken')\n @Watch('params')\n updateOnPropChange() {\n this.fetchData();\n }\n\n connectedCallback() {\n this.fetchData();\n }\n\n handleClickPrevious = (beforeCursor: string) => {\n const newParams: any = { ...this.params };\n delete newParams.after_cursor;\n this.params = ({ ...newParams, before_cursor: beforeCursor });\n };\n\n handleClickNext = (afterCursor: string) => {\n const newParams: any = { ...this.params };\n delete newParams.before_cursor;\n this.params = ({ ...newParams, after_cursor: afterCursor });\n };\n\n async fetchData(): Promise<void> {\n if (!this.accountId \|\| !this.authToken) {\n this.errorMessage = \"Can not fetch any data without an AccountID and an AuthToken\";\n this.loading = false;\n return;\n }\n\n this.loading = true;\n\n const api = Api(this.authToken, config.proxyApiOrigin);\n const endpoint = `account/${this.accountId}/payments`;\n\n const response: IApiResponseCollection<Payment[]> = await api.get(endpoint, this.params);\n\n if (!response.error) {\n this.paging = {\n ...this.paging,\n ...response.page_info\n }\n\n const data = response?.data?.map(dataItem => new Payment(dataItem));\n this.payments = data;\n } else {\n this.errorMessage = typeof response.error === 'string' ? response.error : response.error.message;\n }\n\n this.loading = false;\n }\n\n getPaymentMethod(paymentMethod: IPaymentMethod) {\n return paymentMethod.card \|\| paymentMethod.bank_account\n }\n\n getPaymentMethodName(paymentMethod: IPaymentMethod) {\n if (paymentMethod.card) {\n return paymentMethod.card.name;\n } else {\n return paymentMethod.bank_account.account_owner_name\n }\n }\n\n render() {\n return (\n <Host>\n <justifi-table\n rowClickHandler={e => {\n const clickedPaymentID = e.target.closest('tr').dataset.rowEntityId;\n if (!clickedPaymentID) { return }\n this.rowClicked.emit(this.payments.find((payment) => payment.id === clickedPaymentID));\n }}\n entityId={this.payments.map((payment) => payment.id)}\n columnData={[\n ['Made On', 'The date and time each payment was made'],\n ['Amount', 'The dollar amount of each payment'],\n ['Description', 'The payment description, if you provided one'],\n ['Cardholder', 'The name associated with the payment method'],\n ['Payment Method', 'The brand and last 4 digits of the payment method'],\n ['Status', 'The current status of each payment'],\n ['Payment ID', 'The unique identifier of each payment']\n ]}\n rowData={\n this.payments.map((payment) => (\n [\n {\n type: 'head',\n value: `\n <div>${formatDate(payment.created_at)}</div>\n <div>${formatTime(payment.created_at)}</div>\n `,\n },\n formatCurrency(payment.amount),\n payment.description,\n this.getPaymentMethodName(payment.payment_method),\n this.getPaymentMethod(payment.payment_method).acct_last_four,\n {\n type: 'inner',\n value: MapPaymentStatusToBadge(payment.status)\n },\n payment.id\n ]\n ))\n }\n loading={this.loading}\n error-message={this.errorMessage}\n params={this.params}\n paging={{\n ...this.paging,\n handleClickNext: this.handleClickNext,\n handleClickPrevious: this.handleClickPrevious\n }}\n />\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/payments-list/payments-list.stories.js CHANGED Viewed

@@ -17,7 +17,7 @@ export default {
 class PaymentsListArgs {
   constructor(args) {
     this['auth-token'] = args['auth-token'] || config.proxyAuthToken;
-    this['account-id'] = args['account-id'] || config.examplePaymentsAccountId;
+    this['account-id'] = args['account-id'] || config.exampleAccountId;
   }
 }
 const Template = (args) => {

package/dist/collection/components/payments-list/payments-list.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"payments-list.stories.js","sourceRoot":"","sources":["../../../../src/components/payments-list/payments-list.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,yBAAyB;EAChC,SAAS,EAAE,uBAAuB;EAClC,UAAU,EAAE,EAAE;EACd,UAAU,EAAE;IACV,CAAC,KAAK,EAAE,EAAE,CAAC;QACP,KAAK,EAAE;;;;;;KAMV;GACF;CACF,CAAC;AAEF,MAAM,gBAAgB;EAIpB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,cAAc,CAAC;IACjE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,~~wBAAwB~~,CAAC;~~EAC7E~~,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAsB,EAAE,EAAE;EAC1C,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AAEtC,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AACvC,MAAM,CAAC,UAAU,GAAG;EAClB,CAAC,KAAK,EAAE,EAAE,CAAC;MACP,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BV;CACF,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,UAAU,GAAG;EACrB,CAAC,KAAK,EAAE,EAAE,CAAC;;QAEL,KAAK,EAAE;;GAEZ;CACF,CAAA;AACD,SAAS,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'Components/PaymentsList',\n component: 'justifi-payments-list',\n parameters: {},\n decorators: [\n (Story) => `\n ${Story()}\n <script>\n window.addEventListener('payment-row-clicked', (e) => {\n console.log(e);\n })\n </script>\n `\n ]\n};\n\nclass PaymentsListArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.proxyAuthToken;\n this['account-id'] = args['account-id'] \|\| config.~~examplePaymentsAccountId~~;\n }\n}\n\nconst Template = (args: PaymentsListArgs) => {\n return (`\n <justifi-payments-list\n data-testid=\"justifi-payments-list\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new PaymentsListArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new PaymentsListArgs({});\nStyled.decorators = [\n (Story) => `\n ${Story()}\n <style>\n justifi-payments-list::part(table-head-cell) {\n background-color: #F4F4F6;\n }\n justifi-payments-list::part(pagination-bar) {\n background-color: #F4F4F6;\n }\n justifi-payments-list::part(arrow) {\n --bs-btn-disabled-bg: #212529;\n --bs-btn-disabled-border-color: #212529;\n --bs-btn-bg: #212529;\n --bs-btn-border-color: #212529;\n --bs-btn-hover-bg: #fccc32;\n --bs-btn-hover-border-color: #fccc32;\n }\n justifi-payments-list::part(error-state) {\n color: red;\n background-color: #EEEEF5;\n }\n justifi-payments-list::part(loading-state-cell) {\n background-color: #EEEEF5;\n }\n justifi-payments-list::part(table-row) {\n background-color: #EEEEF5;\n }\n justifi-payments-list::part(table-row-even) {\n background-color: #F4F4F6;\n }\n </style>\n `\n]\n\nexport const Contained = Template.bind({});\nContained.decorators = [\n (Story) => `\n <div style=\"position: relative; width: 900px; height: 300px; overflow-x: hidden;\">\n ${Story()}\n </div>\n `\n]\nContained.args = new PaymentsListArgs({});\n"]}
1	+ {"version":3,"file":"payments-list.stories.js","sourceRoot":"","sources":["../../../../src/components/payments-list/payments-list.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,yBAAyB;EAChC,SAAS,EAAE,uBAAuB;EAClC,UAAU,EAAE,EAAE;EACd,UAAU,EAAE;IACV,CAAC,KAAK,EAAE,EAAE,CAAC;QACP,KAAK,EAAE;;;;;;KAMV;GACF;CACF,CAAC;AAEF,MAAM,gBAAgB;EAIpB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,cAAc,CAAC;IACjE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;EACrE,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAsB,EAAE,EAAE;EAC1C,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AAEtC,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AACvC,MAAM,CAAC,UAAU,GAAG;EAClB,CAAC,KAAK,EAAE,EAAE,CAAC;MACP,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BV;CACF,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,UAAU,GAAG;EACrB,CAAC,KAAK,EAAE,EAAE,CAAC;;QAEL,KAAK,EAAE;;GAEZ;CACF,CAAA;AACD,SAAS,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'Components/PaymentsList',\n component: 'justifi-payments-list',\n parameters: {},\n decorators: [\n (Story) => `\n ${Story()}\n <script>\n window.addEventListener('payment-row-clicked', (e) => {\n console.log(e);\n })\n </script>\n `\n ]\n};\n\nclass PaymentsListArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.proxyAuthToken;\n this['account-id'] = args['account-id'] \|\| config.exampleAccountId;\n }\n}\n\nconst Template = (args: PaymentsListArgs) => {\n return (`\n <justifi-payments-list\n data-testid=\"justifi-payments-list\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new PaymentsListArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new PaymentsListArgs({});\nStyled.decorators = [\n (Story) => `\n ${Story()}\n <style>\n justifi-payments-list::part(table-head-cell) {\n background-color: #F4F4F6;\n }\n justifi-payments-list::part(pagination-bar) {\n background-color: #F4F4F6;\n }\n justifi-payments-list::part(arrow) {\n --bs-btn-disabled-bg: #212529;\n --bs-btn-disabled-border-color: #212529;\n --bs-btn-bg: #212529;\n --bs-btn-border-color: #212529;\n --bs-btn-hover-bg: #fccc32;\n --bs-btn-hover-border-color: #fccc32;\n }\n justifi-payments-list::part(error-state) {\n color: red;\n background-color: #EEEEF5;\n }\n justifi-payments-list::part(loading-state-cell) {\n background-color: #EEEEF5;\n }\n justifi-payments-list::part(table-row) {\n background-color: #EEEEF5;\n }\n justifi-payments-list::part(table-row-even) {\n background-color: #F4F4F6;\n }\n </style>\n `\n]\n\nexport const Contained = Template.bind({});\nContained.decorators = [\n (Story) => `\n <div style=\"position: relative; width: 900px; height: 300px; overflow-x: hidden;\">\n ${Story()}\n </div>\n `\n]\nContained.args = new PaymentsListArgs({});\n"]}

package/dist/collection/components/payouts-list/payouts-list.stories.js CHANGED Viewed

@@ -17,7 +17,7 @@ export default {
 class PayoutsListArgs {
   constructor(args) {
     this['auth-token'] = args['auth-token'] || config.proxyAuthToken;
-    this['account-id'] = args['account-id'] || config.examplePaymentsAccountId;
+    this['account-id'] = args['account-id'] || config.exampleAccountId;
   }
 }
 const Template = (args) => {

package/dist/collection/components/payouts-list/payouts-list.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"payouts-list.stories.js","sourceRoot":"","sources":["../../../../src/components/payouts-list/payouts-list.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,wBAAwB;EAC/B,SAAS,EAAE,sBAAsB;EACjC,UAAU,EAAE,EAAE;EACd,UAAU,EAAE;IACV,CAAC,KAAK,EAAE,EAAE,CAAC;QACP,KAAK,EAAE;;;;;;KAMV;GACF;CACF,CAAC;AAEF,MAAM,eAAe;EAInB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,cAAc,CAAC;IACjE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,~~wBAAwB~~,CAAC;~~EAC7E~~,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAqB,EAAE,EAAE;EACzC,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,eAAe,CAAC,EAAE,CAAC,CAAC;AAErC,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,eAAe,CAAC,EAAE,CAAC,CAAC;AACtC,MAAM,CAAC,UAAU,GAAG;EAClB,CAAC,KAAK,EAAE,EAAE,CAAC;MACP,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BV;CACF,CAAA","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'Components/PayoutsList',\n component: 'justifi-payouts-list',\n parameters: {},\n decorators: [\n (Story) => `\n ${Story()}\n <script>\n window.addEventListener('payout-row-clicked', (e) => {\n console.log(e);\n })\n </script>\n `\n ]\n};\n\nclass PayoutsListArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.proxyAuthToken;\n this['account-id'] = args['account-id'] \|\| config.~~examplePaymentsAccountId~~;\n }\n}\n\nconst Template = (args: PayoutsListArgs) => {\n return (`\n <justifi-payouts-list\n data-testid=\"justifi-payouts-list\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new PayoutsListArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new PayoutsListArgs({});\nStyled.decorators = [\n (Story) => `\n ${Story()}\n <style>\n justifi-payouts-list::part(table-head-cell) {\n background-color: #F4F4F6;\n }\n justifi-payouts-list::part(pagination-bar) {\n background-color: #F4F4F6;\n }\n justifi-payouts-list::part(arrow) {\n --bs-btn-disabled-bg: #212529;\n --bs-btn-disabled-border-color: #212529;\n --bs-btn-bg: #212529;\n --bs-btn-border-color: #212529;\n --bs-btn-hover-bg: #fccc32;\n --bs-btn-hover-border-color: #fccc32;\n }\n justifi-payouts-list::part(error-state) {\n color: red;\n background-color: #EEEEF5;\n }\n justifi-payouts-list::part(loading-state-cell) {\n background-color: #EEEEF5;\n }\n justifi-payouts-list::part(table-row) {\n background-color: #EEEEF5;\n }\n justifi-payouts-list::part(table-row-even) {\n background-color: #F4F4F6;\n }\n </style>\n `\n]\n"]}
1	+ {"version":3,"file":"payouts-list.stories.js","sourceRoot":"","sources":["../../../../src/components/payouts-list/payouts-list.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,wBAAwB;EAC/B,SAAS,EAAE,sBAAsB;EACjC,UAAU,EAAE,EAAE;EACd,UAAU,EAAE;IACV,CAAC,KAAK,EAAE,EAAE,CAAC;QACP,KAAK,EAAE;;;;;;KAMV;GACF;CACF,CAAC;AAEF,MAAM,eAAe;EAInB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,cAAc,CAAC;IACjE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;EACrE,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAqB,EAAE,EAAE;EACzC,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,eAAe,CAAC,EAAE,CAAC,CAAC;AAErC,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,eAAe,CAAC,EAAE,CAAC,CAAC;AACtC,MAAM,CAAC,UAAU,GAAG;EAClB,CAAC,KAAK,EAAE,EAAE,CAAC;MACP,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BV;CACF,CAAA","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'Components/PayoutsList',\n component: 'justifi-payouts-list',\n parameters: {},\n decorators: [\n (Story) => `\n ${Story()}\n <script>\n window.addEventListener('payout-row-clicked', (e) => {\n console.log(e);\n })\n </script>\n `\n ]\n};\n\nclass PayoutsListArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.proxyAuthToken;\n this['account-id'] = args['account-id'] \|\| config.exampleAccountId;\n }\n}\n\nconst Template = (args: PayoutsListArgs) => {\n return (`\n <justifi-payouts-list\n data-testid=\"justifi-payouts-list\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new PayoutsListArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new PayoutsListArgs({});\nStyled.decorators = [\n (Story) => `\n ${Story()}\n <style>\n justifi-payouts-list::part(table-head-cell) {\n background-color: #F4F4F6;\n }\n justifi-payouts-list::part(pagination-bar) {\n background-color: #F4F4F6;\n }\n justifi-payouts-list::part(arrow) {\n --bs-btn-disabled-bg: #212529;\n --bs-btn-disabled-border-color: #212529;\n --bs-btn-bg: #212529;\n --bs-btn-border-color: #212529;\n --bs-btn-hover-bg: #fccc32;\n --bs-btn-hover-border-color: #fccc32;\n }\n justifi-payouts-list::part(error-state) {\n color: red;\n background-color: #EEEEF5;\n }\n justifi-payouts-list::part(loading-state-cell) {\n background-color: #EEEEF5;\n }\n justifi-payouts-list::part(table-row) {\n background-color: #EEEEF5;\n }\n justifi-payouts-list::part(table-row-even) {\n background-color: #F4F4F6;\n }\n </style>\n `\n]\n"]}

package/dist/collection/components/proceeds-list/proceeds-list.stories.js CHANGED Viewed

@@ -17,7 +17,7 @@ export default {
 class ProceedsListArgs {
   constructor(args) {
     this['auth-token'] = args['auth-token'] || config.privateAuthToken;
-    this['account-id'] = args['account-id'] || config.examplePlatformAccountId;
+    this['account-id'] = args['account-id'] || '';
   }
 }
 const Template = (args) => {

package/dist/collection/components/proceeds-list/proceeds-list.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"proceeds-list.stories.js","sourceRoot":"","sources":["../../../../src/components/proceeds-list/proceeds-list.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,6BAA6B;EACpC,SAAS,EAAE,uBAAuB;EAClC,UAAU,EAAE,EAAE;EACd,UAAU,EAAE;IACV,CAAC,KAAK,EAAE,EAAE,CAAC;QACP,KAAK,EAAE;;;;;;KAMV;GACF;CACF,CAAC;AAEF,MAAM,gBAAgB;EAIpB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;IACnE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,~~MAAM~~,CAAC~~,wBAAwB,CAAC~~;~~EAC7E~~,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAsB,EAAE,EAAE;EAC1C,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AAEtC,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AACvC,MAAM,CAAC,UAAU,GAAG;EAClB,CAAC,KAAK,EAAE,EAAE,CAAC;MACP,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BV;CACF,CAAA","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'dev/Components/ProceedsList',\n component: 'justifi-proceeds-list',\n parameters: {},\n decorators: [\n (Story) => `\n ${Story()}\n <script>\n window.addEventListener('proceed-row-clicked', (e) => {\n console.log(e);\n })\n </script>\n `\n ]\n};\n\nclass ProceedsListArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.privateAuthToken;\n this['account-id'] = args['account-id'] \|\| ~~config.examplePlatformAccountId~~;\n }\n}\n\nconst Template = (args: ProceedsListArgs) => {\n return (`\n <justifi-proceeds-list\n data-testid=\"justifi-proceeds-list\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new ProceedsListArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new ProceedsListArgs({});\nStyled.decorators = [\n (Story) => `\n ${Story()}\n <style>\n justifi-proceeds-list::part(table-head-cell) {\n background-color: #F4F4F6;\n }\n justifi-proceeds-list::part(pagination-bar) {\n background-color: #F4F4F6;\n }\n justifi-proceeds-list::part(arrow) {\n --bs-btn-disabled-bg: #212529;\n --bs-btn-disabled-border-color: #212529;\n --bs-btn-bg: #212529;\n --bs-btn-border-color: #212529;\n --bs-btn-hover-bg: #fccc32;\n --bs-btn-hover-border-color: #fccc32;\n }\n justifi-proceeds-list::part(error-state) {\n color: red;\n background-color: #EEEEF5;\n }\n justifi-proceeds-list::part(loading-state-cell) {\n background-color: #EEEEF5;\n }\n justifi-proceeds-list::part(table-row) {\n background-color: #EEEEF5;\n }\n justifi-proceeds-list::part(table-row-even) {\n background-color: #F4F4F6;\n }\n </style>\n `\n]\n"]}
1	+ {"version":3,"file":"proceeds-list.stories.js","sourceRoot":"","sources":["../../../../src/components/proceeds-list/proceeds-list.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,6BAA6B;EACpC,SAAS,EAAE,uBAAuB;EAClC,UAAU,EAAE,EAAE;EACd,UAAU,EAAE;IACV,CAAC,KAAK,EAAE,EAAE,CAAC;QACP,KAAK,EAAE;;;;;;KAMV;GACF;CACF,CAAC;AAEF,MAAM,gBAAgB;EAIpB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;IACnE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;EAChD,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAsB,EAAE,EAAE;EAC1C,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AAEtC,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC;AACvC,MAAM,CAAC,UAAU,GAAG;EAClB,CAAC,KAAK,EAAE,EAAE,CAAC;MACP,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BV;CACF,CAAA","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'dev/Components/ProceedsList',\n component: 'justifi-proceeds-list',\n parameters: {},\n decorators: [\n (Story) => `\n ${Story()}\n <script>\n window.addEventListener('proceed-row-clicked', (e) => {\n console.log(e);\n })\n </script>\n `\n ]\n};\n\nclass ProceedsListArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.privateAuthToken;\n this['account-id'] = args['account-id'] \|\| '';\n }\n}\n\nconst Template = (args: ProceedsListArgs) => {\n return (`\n <justifi-proceeds-list\n data-testid=\"justifi-proceeds-list\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new ProceedsListArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new ProceedsListArgs({});\nStyled.decorators = [\n (Story) => `\n ${Story()}\n <style>\n justifi-proceeds-list::part(table-head-cell) {\n background-color: #F4F4F6;\n }\n justifi-proceeds-list::part(pagination-bar) {\n background-color: #F4F4F6;\n }\n justifi-proceeds-list::part(arrow) {\n --bs-btn-disabled-bg: #212529;\n --bs-btn-disabled-border-color: #212529;\n --bs-btn-bg: #212529;\n --bs-btn-border-color: #212529;\n --bs-btn-hover-bg: #fccc32;\n --bs-btn-hover-border-color: #fccc32;\n }\n justifi-proceeds-list::part(error-state) {\n color: red;\n background-color: #EEEEF5;\n }\n justifi-proceeds-list::part(loading-state-cell) {\n background-color: #EEEEF5;\n }\n justifi-proceeds-list::part(table-row) {\n background-color: #EEEEF5;\n }\n justifi-proceeds-list::part(table-row-even) {\n background-color: #F4F4F6;\n }\n </style>\n `\n]\n"]}

package/dist/collection/components/subaccount-details/subaccount-details.stories.js CHANGED Viewed

@@ -7,7 +7,7 @@ export default {
 class SubaccountDetailsArgs {
   constructor(args) {
     this['auth-token'] = args['auth-token'] || config.privateAuthToken;
-    this['account-id'] = args['account-id'] || config.examplePlatformAccountId;
+    this['account-id'] = args['account-id'] || '';
     this['subaccount-id'] = args['subaccount-id'] || 'subaccount-id';
   }
 }

package/dist/collection/components/subaccount-details/subaccount-details.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"subaccount-details.stories.js","sourceRoot":"","sources":["../../../../src/components/subaccount-details/subaccount-details.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,kCAAkC;EACzC,SAAS,EAAE,4BAA4B;EACvC,UAAU,EAAE,EAAE;CACf,CAAC;AAEF,MAAM,qBAAqB;EAKzB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;IACnE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,~~MAAM~~,CAAC~~,wBAAwB,CAAC~~;~~IAC3E~~,IAAI,CAAC,eAAe,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,eAAe,CAAC;EACnE,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAA2B,EAAE,EAAE;EAC/C,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;uBACf,IAAI,CAAC,eAAe,CAAC;;GAEzC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,qBAAqB,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'dev/Components/SubaccountDetails',\n component: 'justifi-subaccount-details',\n parameters: {}\n};\n\nclass SubaccountDetailsArgs {\n 'auth-token': string;\n 'account-id': string;\n 'subaccount-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.privateAuthToken;\n this['account-id'] = args['account-id'] \|\| ~~config.examplePlatformAccountId~~;\n this['subaccount-id'] = args['subaccount-id'] \|\| 'subaccount-id';\n }\n}\n\nconst Template = (args: SubaccountDetailsArgs) => {\n return (`\n <justifi-subaccount-details\n data-testid=\"justifi-subaccounts-details\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n subaccount-id=\"${args['subaccount-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new SubaccountDetailsArgs({});\n"]}
1	+ {"version":3,"file":"subaccount-details.stories.js","sourceRoot":"","sources":["../../../../src/components/subaccount-details/subaccount-details.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,kCAAkC;EACzC,SAAS,EAAE,4BAA4B;EACvC,UAAU,EAAE,EAAE;CACf,CAAC;AAEF,MAAM,qBAAqB;EAKzB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;IACnE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;IAC9C,IAAI,CAAC,eAAe,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,eAAe,CAAC;EACnE,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAA2B,EAAE,EAAE;EAC/C,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;uBACf,IAAI,CAAC,eAAe,CAAC;;GAEzC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,qBAAqB,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'dev/Components/SubaccountDetails',\n component: 'justifi-subaccount-details',\n parameters: {}\n};\n\nclass SubaccountDetailsArgs {\n 'auth-token': string;\n 'account-id': string;\n 'subaccount-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.privateAuthToken;\n this['account-id'] = args['account-id'] \|\| '';\n this['subaccount-id'] = args['subaccount-id'] \|\| 'subaccount-id';\n }\n}\n\nconst Template = (args: SubaccountDetailsArgs) => {\n return (`\n <justifi-subaccount-details\n data-testid=\"justifi-subaccounts-details\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n subaccount-id=\"${args['subaccount-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new SubaccountDetailsArgs({});\n"]}

package/dist/collection/components/subaccounts-list/subaccounts-list.stories.js CHANGED Viewed

@@ -17,7 +17,7 @@ export default {
 class SubaccountsListArgs {
   constructor(args) {
     this['auth-token'] = args['auth-token'] || config.privateAuthToken;
-    this['account-id'] = args['account-id'] || config.examplePlatformAccountId;
+    this['account-id'] = args['account-id'] || '';
   }
 }
 const Template = (args) => {

package/dist/collection/components/subaccounts-list/subaccounts-list.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"subaccounts-list.stories.js","sourceRoot":"","sources":["../../../../src/components/subaccounts-list/subaccounts-list.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,gCAAgC;EACvC,SAAS,EAAE,0BAA0B;EACrC,UAAU,EAAE,EAAE;EACd,UAAU,EAAE;IACV,CAAC,KAAK,EAAE,EAAE,CAAC;QACP,KAAK,EAAE;;;;;;KAMV;GACF;CACF,CAAC;AAEF,MAAM,mBAAmB;EAIvB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;IACnE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,~~MAAM~~,~~CAAC,wBAAwB,~~CAAA;~~EAC5E~~,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAyB,EAAE,EAAE;EAC7C,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,mBAAmB,CAAC,EAAE,CAAC,CAAC;AAEzC,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,mBAAmB,CAAC,EAAE,CAAC,CAAC;AAC1C,MAAM,CAAC,UAAU,GAAG;EAClB,CAAC,KAAK,EAAE,EAAE,CAAC;MACP,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BV;CACF,CAAA","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'dev/Components/SubaccountsList',\n component: 'justifi-subaccounts-list',\n parameters: {},\n decorators: [\n (Story) => `\n ${Story()}\n <script>\n window.addEventListener('subaccount-row-clicked', (e) => {\n console.log(e);\n })\n </script>\n `\n ]\n};\n\nclass SubaccountsListArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.privateAuthToken;\n this['account-id'] = args['account-id'] \|\| ~~config.examplePlatformAccountId~~\n }\n}\n\nconst Template = (args: SubaccountsListArgs) => {\n return (`\n <justifi-subaccounts-list\n data-testid=\"justifi-subaccounts-list\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new SubaccountsListArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new SubaccountsListArgs({});\nStyled.decorators = [\n (Story) => `\n ${Story()}\n <style>\n justifi-subaccounts-list::part(table-head-cell) {\n background-color: #F4F4F6;\n }\n justifi-subaccounts-list::part(pagination-bar) {\n background-color: #F4F4F6;\n }\n justifi-subaccounts-list::part(arrow) {\n --bs-btn-disabled-bg: #212529;\n --bs-btn-disabled-border-color: #212529;\n --bs-btn-bg: #212529;\n --bs-btn-border-color: #212529;\n --bs-btn-hover-bg: #fccc32;\n --bs-btn-hover-border-color: #fccc32;\n }\n justifi-subaccounts-list::part(error-state) {\n color: red;\n background-color: #EEEEF5;\n }\n justifi-subaccounts-list::part(loading-state-cell) {\n background-color: #EEEEF5;\n }\n justifi-subaccounts-list::part(table-row) {\n background-color: #EEEEF5;\n }\n justifi-subaccounts-list::part(table-row-even) {\n background-color: #F4F4F6;\n }\n </style>\n `\n]\n"]}
1	+ {"version":3,"file":"subaccounts-list.stories.js","sourceRoot":"","sources":["../../../../src/components/subaccounts-list/subaccounts-list.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,eAAe;EACb,KAAK,EAAE,gCAAgC;EACvC,SAAS,EAAE,0BAA0B;EACrC,UAAU,EAAE,EAAE;EACd,UAAU,EAAE;IACV,CAAC,KAAK,EAAE,EAAE,CAAC;QACP,KAAK,EAAE;;;;;;KAMV;GACF;CACF,CAAC;AAEF,MAAM,mBAAmB;EAIvB,YAAY,IAAI;IACd,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC;IACnE,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAA;EAC/C,CAAC;CACF;AAED,MAAM,QAAQ,GAAG,CAAC,IAAyB,EAAE,EAAE;EAC7C,OAAO,CAAC;;;oBAGU,IAAI,CAAC,YAAY,CAAC;oBAClB,IAAI,CAAC,YAAY,CAAC;;GAEnC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG,IAAI,mBAAmB,CAAC,EAAE,CAAC,CAAC;AAEzC,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG,IAAI,mBAAmB,CAAC,EAAE,CAAC,CAAC;AAC1C,MAAM,CAAC,UAAU,GAAG;EAClB,CAAC,KAAK,EAAE,EAAE,CAAC;MACP,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BV;CACF,CAAA","sourcesContent":["import { config } from '../../../config';\n\nexport default {\n title: 'dev/Components/SubaccountsList',\n component: 'justifi-subaccounts-list',\n parameters: {},\n decorators: [\n (Story) => `\n ${Story()}\n <script>\n window.addEventListener('subaccount-row-clicked', (e) => {\n console.log(e);\n })\n </script>\n `\n ]\n};\n\nclass SubaccountsListArgs {\n 'auth-token': string;\n 'account-id': string;\n\n constructor(args) {\n this['auth-token'] = args['auth-token'] \|\| config.privateAuthToken;\n this['account-id'] = args['account-id'] \|\| ''\n }\n}\n\nconst Template = (args: SubaccountsListArgs) => {\n return (`\n <justifi-subaccounts-list\n data-testid=\"justifi-subaccounts-list\"\n auth-token=\"${args['auth-token']}\"\n account-id=\"${args['account-id']}\"\n />\n `);\n};\n\nexport const Basic = Template.bind({});\nBasic.args = new SubaccountsListArgs({});\n\nexport const Styled = Template.bind({});\nStyled.args = new SubaccountsListArgs({});\nStyled.decorators = [\n (Story) => `\n ${Story()}\n <style>\n justifi-subaccounts-list::part(table-head-cell) {\n background-color: #F4F4F6;\n }\n justifi-subaccounts-list::part(pagination-bar) {\n background-color: #F4F4F6;\n }\n justifi-subaccounts-list::part(arrow) {\n --bs-btn-disabled-bg: #212529;\n --bs-btn-disabled-border-color: #212529;\n --bs-btn-bg: #212529;\n --bs-btn-border-color: #212529;\n --bs-btn-hover-bg: #fccc32;\n --bs-btn-hover-border-color: #fccc32;\n }\n justifi-subaccounts-list::part(error-state) {\n color: red;\n background-color: #EEEEF5;\n }\n justifi-subaccounts-list::part(loading-state-cell) {\n background-color: #EEEEF5;\n }\n justifi-subaccounts-list::part(table-row) {\n background-color: #EEEEF5;\n }\n justifi-subaccounts-list::part(table-row-even) {\n background-color: #F4F4F6;\n }\n </style>\n `\n]\n"]}

package/dist/collection/components/table/table.js CHANGED Viewed

@@ -4,7 +4,7 @@ export class Table {
   constructor() {
     this.emptyState = () => {
       var _a;
-      return (h("tr", null, h("td", { class: "empty-state", part: "empty-state", colSpan: (_a = this.columnData) === null || _a === void 0 ? void 0 : _a.length, style: { textAlign: 'center' } }, "No payments to show")));
+      return (h("tr", null, h("td", { class: "empty-state", part: "empty-state", colSpan: (_a = this.columnData) === null || _a === void 0 ? void 0 : _a.length, style: { textAlign: 'center' } }, "No results")));
     };
     this.errorState = () => {
       var _a;

package/dist/collection/components/table/table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"table.js","sourceRoot":"","sources":["../../../../src/components/table/table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,sBAAsB,EAAsB,MAAM,sBAAsB,CAAC;AAiBlF,MAAM,OAAO,KAAK;;IAchB,eAAU,GAAG,GAAG,EAAE;;MAAC,OAAA,CACjB;QACE,UAAI,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,aAAa,EAAC,OAAO,EAAE,MAAA,IAAI,CAAC,UAAU,0CAAE,MAAM,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,~~0BAA0B~~,~~CAClI~~,CACN,CAAA;KAAA,CAAC;IAEF,eAAU,GAAG,GAAG,EAAE;;MAAC,OAAA,CACjB;QACE,UAAI,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,aAAa,EAAC,OAAO,EAAE,MAAA,IAAI,CAAC,UAAU,0CAAE,MAAM,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE;;UAC1E,IAAI,CAAC,YAAY,CAC7C,CACF,CACN,CAAA;KAAA,CAAC;IAEF,iBAAY,GAAG,GAAG,EAAE;;MAAC,OAAA,CACnB;QACE,UAAI,KAAK,EAAC,eAAe,EAAC,IAAI,EAAC,oBAAoB,EAAC,OAAO,EAAE,MAAA,IAAI,CAAC,UAAU,0CAAE,MAAM,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE;UAClH,WAAK,IAAI,EAAC,uBAAuB,EAAC,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,QAAQ;YACpE,YAAM,KAAK,EAAC,iBAAiB,iBAAkB,CAC3C,CACH,CACF,CACN,CAAA;KAAA,CAAC;mBAnCuC,IAAI;wBACM,EAAE;mBACZ,EAAE;;kBAEJ,sBAAsB;kBACtB,EAAE;;;;EAIzC,cAAc;IACZ,OAAO,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;EACvD,CAAC;EA0BD,MAAM;;IACJ,OAAO,CACL,EAAC,IAAI,IAAC,WAAW,EAAC,2TAKjB,IACE,IAAI,CAAC,UAAU,CAAC,CAAC;~~MAClB~~,aAAO,KAAK,EAAC,mBAAmB;QAC9B,aAAO,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,YAAY;UACpD,UAAI,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,gBAAgB,IAEzC,MAAA,IAAI,CAAC,UAAU,0CAAE,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAC9B,UAAI,IAAI,EAAC,iBAAiB,EAAC,KAAK,EAAC,KAAK,EAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,IACjF,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CACzC,CACN,CAEA,CACC;QACR,aAAO,KAAK,EAAC,YAAY,EAAC,IAAI,EAAC,YAAY,IAEvC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC;~~UACpC~~,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;~~YACvC~~,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;~~cAC3C~~,MAAA,IAAI,CAAC,OAAO,0CAAE,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;gBAChC,OAAO,~~CACP~~,gCACsB,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EACxC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,EACnE,IAAI,EAAE,YAAY,KAAK,~~GAAC~~,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EAAE,~~IAGhE~~,IAAI,CAAC,GAAG,CAAC,CAAC,SAAc,EAAE,EAAE;~~kBACxB~~,OAAO,CACL,CAAC,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,IAAI,CAAA;~~oBAChB~~,CAAC,CAAC,UAAI,IAAI,EAAC,YAAY,IAAE,SAAS,CAAM;oBACxC,CAAC,CAAC,UAAI,KAAK,EAAC,KAAK,EAAC,IAAI,EAAC,YAAY;~~sBAC/B~~,UAAI,IAAI,EAAC,YAAY,EAAC,SAAS,EAAE,SAAS,CAAC,KAAK,GAAO,CACpD,CACR,CAAA;gBACH,CAAC,~~CACF~~,CAEA,~~CACJ~~,CAAA;cACH,CAAC,CAAC,~~CAEE~~;QACP,IAAI,CAAC,MAAM;UACV,aAAO,KAAK,EAAC,eAAe;YAC1B,UAAI,KAAK,EAAC,0BAA0B;cAClC,UAAI,IAAI,EAAC,gBAAgB,EAAC,OAAO,EAAE,MAAA,IAAI,CAAC,UAAU,0CAAE,MAAM;gBACxD,uBAAiB,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,GAAI,CAC1D,CACF,CACC,CAEJ;MACR,CAAC;QACD,2BAAkB,mBAAmB,8BAA8B,~~CAC9D~~,CACR,CAAA;EACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\nimport { ExtendedPagingDefaults, ExtendedPagingInfo } from '../../api/Pagination';\n\nexport interface TableProps {\n loading: boolean;\n errorMessage: string;\n columnData: (string\|string[])[];\n rowData: any[];\n paging: ExtendedPagingInfo;\n params: any\n}\n\n@Component({\n tag: 'justifi-table',\n styleUrl: './table.scss',\n shadow: true,\n})\n\nexport class Table {\n @Prop() loading: TableProps['loading'] = true;\n @Prop() errorMessage: TableProps['errorMessage'] = '';\n @Prop() rowData: TableProps['rowData'] = [];\n @Prop() columnData!: TableProps['columnData'];\n @Prop() paging: TableProps['paging'] = ExtendedPagingDefaults;\n @Prop() params: TableProps['params'] = {};\n @Prop() entityId: string[];\n @Prop() rowClickHandler: (e: any) => any;\n\n showEmptyState() {\n return this.rowData ? this.rowData.length < 1 : true;\n }\n\n emptyState = () => (\n <tr>\n <td class=\"empty-state\" part=\"empty-state\" colSpan={this.columnData?.length} style={{ textAlign: 'center' }}>No ~~payments to show~~</td>\n </tr>\n );\n\n errorState = () => (\n <tr>\n <td class=\"error-state\" part=\"error-state\" colSpan={this.columnData?.length} style={{ textAlign: 'center' }}>\n An unexpected error occurred: {this.errorMessage}\n </td>\n </tr>\n );\n\n loadingState = () => (\n <tr>\n <td class=\"loading-state\" part=\"loading-state-cell\" colSpan={this.columnData?.length} style={{ textAlign: 'center' }}>\n <div part=\"loading-state-spinner\" class=\"spinner-border\" role=\"status\">\n <span class=\"visually-hidden\">Loading...</span>\n </div>\n </td>\n </tr>\n );\n\n render() {\n return (\n <Host exportparts=\"\n table-head,table-head-row,table-head-cell,table-body,table-row,table-row-even,\n table-row-odd,table-cell,loading-state-cell,loading-state-spinner,error-state,\n empty-state,pagination-bar,arrow,arrow-left,arrow-right,button-disabled,\n previous-button-text,next-button-text\n \">\n {this.columnData ?\n <table class=\"table table-hover\">\n <thead class=\"table-head sticky-top\" part=\"table-head\">\n <tr class=\"table-light\" part='table-head-row'>\n {\n this.columnData?.map((column) =>\n <th part=\"table-head-cell\" scope=\"col\" title={Array.isArray(column) ? column[1] : ''}>\n {!Array.isArray(column) ? column : column[0]}\n </th>\n )\n }\n </tr>\n </thead>\n <tbody class=\"table-body\" part='table-body'>\n {\n this.loading ? this.loadingState() :\n this.errorMessage ? this.errorState() :\n this.showEmptyState() ? this.emptyState() :\n this.rowData?.map((data, index) => {\n return (\n <tr\n data-row-entity-id={this.entityId[index]}\n onClick={e => this.rowClickHandler ? this.rowClickHandler(e) : null}\n part={`table-row${index%2 ? ' table-row-even' : ' table-row-odd'}`}\n >\n {\n data.map((dataEntry: any) ~~=>\~~n { return (\n !dataEntry?.type\n ? <td part=\"table-cell\">{dataEntry}</td>\n : <th scope=\"row\" part=\"table-cell\">\n <td part=\"table-cell\" innerHTML={dataEntry.value}></td>\n </th>\n )\n }\n )\n }\n </tr>\n )\n })\n }\n </tbody>\n {this.paging &&\n <tfoot class=\"sticky-bottom\">\n <tr class=\"table-light align-middle\">\n <td part=\"pagination-bar\" colSpan={this.columnData?.length}>\n <pagination-menu paging={this.paging} params={this.params} />\n </td>\n </tr>\n </tfoot>\n }\n </table>\n :\n <div data-test-id=\"empty-error-state\">Column data is required</div>}\n </Host>\n )\n }\n}\n"]}
1	+ {"version":3,"file":"table.js","sourceRoot":"","sources":["../../../../src/components/table/table.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\nimport { ExtendedPagingDefaults, ExtendedPagingInfo } from '../../api/Pagination';\n\nexport interface TableProps {\n loading: boolean;\n errorMessage: string;\n columnData: (string \| string[])[];\n rowData: any[];\n paging: ExtendedPagingInfo;\n params: any\n}\n\n@Component({\n tag: 'justifi-table',\n styleUrl: './table.scss',\n shadow: true,\n})\n\nexport class Table {\n @Prop() loading: TableProps['loading'] = true;\n @Prop() errorMessage: TableProps['errorMessage'] = '';\n @Prop() rowData: TableProps['rowData'] = [];\n @Prop() columnData!: TableProps['columnData'];\n @Prop() paging: TableProps['paging'] = ExtendedPagingDefaults;\n @Prop() params: TableProps['params'] = {};\n @Prop() entityId: string[];\n @Prop() rowClickHandler: (e: any) => any;\n\n showEmptyState() {\n return this.rowData ? this.rowData.length < 1 : true;\n }\n\n emptyState = () => (\n <tr>\n <td class=\"empty-state\" part=\"empty-state\" colSpan={this.columnData?.length} style={{ textAlign: 'center' }}>No results</td>\n </tr>\n );\n\n errorState = () => (\n <tr>\n <td class=\"error-state\" part=\"error-state\" colSpan={this.columnData?.length} style={{ textAlign: 'center' }}>\n An unexpected error occurred: {this.errorMessage}\n </td>\n </tr>\n );\n\n loadingState = () => (\n <tr>\n <td class=\"loading-state\" part=\"loading-state-cell\" colSpan={this.columnData?.length} style={{ textAlign: 'center' }}>\n <div part=\"loading-state-spinner\" class=\"spinner-border\" role=\"status\">\n <span class=\"visually-hidden\">Loading...</span>\n </div>\n </td>\n </tr>\n );\n\n render() {\n return (\n <Host exportparts=\"\n table-head,table-head-row,table-head-cell,table-body,table-row,table-row-even,\n table-row-odd,table-cell,loading-state-cell,loading-state-spinner,error-state,\n empty-state,pagination-bar,arrow,arrow-left,arrow-right,button-disabled,\n previous-button-text,next-button-text\n \">\n {this.columnData ?\n <table class=\"table table-hover\">\n <thead class=\"table-head sticky-top\" part=\"table-head\">\n <tr class=\"table-light\" part='table-head-row'>\n {\n this.columnData?.map((column) =>\n <th part=\"table-head-cell\" scope=\"col\" title={Array.isArray(column) ? column[1] : ''}>\n {!Array.isArray(column) ? column : column[0]}\n </th>\n )\n }\n </tr>\n </thead>\n <tbody class=\"table-body\" part='table-body'>\n {\n this.loading ? this.loadingState() :\n this.errorMessage ? this.errorState() :\n this.showEmptyState() ? this.emptyState() :\n this.rowData?.map((data, index) => {\n return (\n <tr\n data-row-entity-id={this.entityId[index]}\n onClick={e => this.rowClickHandler ? this.rowClickHandler(e) : null}\n part={`table-row${index % 2 ? ' table-row-even' : ' table-row-odd'}`}\n >\n {\n data.map((dataEntry: any) => {\n return (\n !dataEntry?.type\n ? <td part=\"table-cell\">{dataEntry}</td>\n : <th scope=\"row\" part=\"table-cell\">\n <td part=\"table-cell\" innerHTML={dataEntry.value}></td>\n </th>\n )\n }\n )\n }\n </tr>\n )\n })\n }\n </tbody>\n {this.paging &&\n <tfoot class=\"sticky-bottom\">\n <tr class=\"table-light align-middle\">\n <td part=\"pagination-bar\" colSpan={this.columnData?.length}>\n <pagination-menu paging={this.paging} params={this.params} />\n </td>\n </tr>\n </tfoot>\n }\n </table>\n :\n <div data-test-id=\"empty-error-state\">Column data is required</div>}\n </Host>\n )\n }\n}\n"]}