JezK
Edit File: sc-purchase-downloads-list.entry.js.map
{"file":"sc-purchase-downloads-list.entry.js","mappings":";;;AAAA,MAAM,0BAA0B,GAAG,sDAAsD,CAAC;AAC1F,sCAAe,0BAA0B;;;;;;;;;;;;;;kJCyBJ,UAAE;;;;;;;;;;;;;;;;;;;;;;;;2NAuDxB,eAAO,CAAC,UAAE;;;;;;;;;;;;;;0TAoCuB,UAAE,+OAOrC,UAAE;;;;;;;;","names":[],"sources":["src/components/ui/purchase-downloads-list/sc-purchase-downloads-list.scss?tag=sc-purchase-downloads-list&encapsulation=shadow","src/components/ui/purchase-downloads-list/sc-purchase-downloads-list.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.download__details {\n opacity: 0.75;\n}\n","import { Component, Element, Fragment, h, Prop } from '@stencil/core';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { addQueryArgs } from '@wordpress/url';\nimport { Download, Media, Product, Purchase, Variant } from '../../../types';\n\n@Component({\n tag: 'sc-purchase-downloads-list',\n styleUrl: 'sc-purchase-downloads-list.scss',\n shadow: true,\n})\nexport class ScPurchaseDownloadsList {\n @Element() el: HTMLScDownloadsListElement;\n\n @Prop() allLink: string;\n @Prop() heading: string;\n @Prop() busy: boolean;\n @Prop() loading: boolean;\n @Prop() requestNonce: string;\n @Prop() error: string;\n @Prop() purchases: Array<Purchase> = [];\n\n renderEmpty() {\n return (\n <div>\n <sc-divider style={{ '--spacing': '0' }}></sc-divider>\n <slot name=\"empty\">\n <sc-empty icon=\"download\">{__(\"You don't have any downloads.\", 'surecart')}</sc-empty>\n </slot>\n </div>\n );\n }\n\n renderLoading() {\n return (\n <sc-card no-padding style={{ '--overflow': 'hidden' }}>\n <sc-stacked-list>\n <sc-stacked-list-row style={{ '--columns': '2' }} mobile-size={0}>\n <div style={{ padding: '0.5em' }}>\n <sc-skeleton style={{ width: '30%', marginBottom: '0.75em' }}></sc-skeleton>\n <sc-skeleton style={{ width: '20%' }}></sc-skeleton>\n </div>\n </sc-stacked-list-row>\n </sc-stacked-list>\n </sc-card>\n );\n }\n\n renderList() {\n return this.purchases.map(purchase => {\n const variant = purchase?.variant as Variant;\n const activeVariantDownloads = (variant?.downloads?.data || []).filter((d: Download) => !d.archived);\n const hasVariantDownloads = variant?.downloads_enabled && activeVariantDownloads.length > 0;\n const downloads = hasVariantDownloads ? activeVariantDownloads : (purchase?.product as Product)?.downloads?.data?.filter((d: Download) => !d.archived) || [];\n const totalDownloads = downloads.length;\n const mediaBytesList = (downloads || []).map(item => (item?.media ? (item?.media as Media)?.byte_size : 0));\n const mediaByteTotalSize = mediaBytesList.reduce((prev, curr) => prev + curr, 0);\n\n return (\n <sc-stacked-list-row\n href={\n !purchase?.revoked\n ? addQueryArgs(window.location.href, {\n action: 'show',\n model: 'download',\n id: purchase.id,\n nonce: this.requestNonce,\n })\n : null\n }\n key={purchase.id}\n mobile-size={0}\n >\n <sc-spacing\n style={{\n '--spacing': 'var(--sc-spacing-xx--small)',\n }}\n >\n <div>\n <strong>{(purchase?.product as Product)?.name}</strong>\n </div>\n <div class=\"download__details\">\n {sprintf(_n('%s file', '%s files', totalDownloads, 'surecart'), totalDownloads)}\n {!!mediaByteTotalSize && (\n <Fragment>\n {' '}\n • <sc-format-bytes value={mediaByteTotalSize}></sc-format-bytes>\n </Fragment>\n )}\n </div>\n </sc-spacing>\n\n <sc-icon name=\"chevron-right\" slot=\"suffix\"></sc-icon>\n </sc-stacked-list-row>\n );\n });\n }\n\n renderContent() {\n if (this.loading) {\n return this.renderLoading();\n }\n\n if (this.purchases?.length === 0) {\n return this.renderEmpty();\n }\n\n return (\n <sc-card no-padding style={{ '--overflow': 'hidden' }}>\n <sc-stacked-list>{this.renderList()}</sc-stacked-list>\n </sc-card>\n );\n }\n\n render() {\n return (\n <sc-dashboard-module class=\"downloads-list\" error={this.error}>\n <span slot=\"heading\">\n <slot name=\"heading\">{this.heading || __('Items', 'surecart')}</slot>\n </span>\n\n <slot name=\"before\"></slot>\n\n {!!this.allLink && (\n <sc-button type=\"link\" href={this.allLink} slot=\"end\">\n {__('View all', 'surecart')}\n <sc-icon name=\"chevron-right\" slot=\"suffix\"></sc-icon>\n </sc-button>\n )}\n\n {this.renderContent()}\n\n <slot name=\"after\"></slot>\n\n {this.busy && <sc-block-ui></sc-block-ui>}\n </sc-dashboard-module>\n );\n }\n}\n"],"version":3}