npm - @foxy.io/elements - Versions diffs - 1.25.0-beta.2 → 1.25.0-beta.3 - Mend

@foxy.io/elements 1.25.0-beta.2 → 1.25.0-beta.3

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 (327) hide show

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControl.d.ts CHANGED Viewed

@@ -20,6 +20,8 @@ export declare class InternalAsyncListControl extends InternalEditableControl {
     form: FormDialog['form'];
     /** Same as the `item` property of `CollectionPage`. */
     item: CollectionPage<any>['item'];
+    /** Props to pass through to the `CollectionPage` rendering items. */
+    itemProps: Record<string, unknown>;
     /** Same as the `wide` property of `FormDialog`. */
     wide: boolean;
     /** Same as the `alert` property of `FormDialog`. */

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControl.js CHANGED Viewed

@@ -21,6 +21,8 @@ export class InternalAsyncListControl extends InternalEditableControl {
         this.form = null;
         /** Same as the `item` property of `CollectionPage`. */
         this.item = null;
+        /** Props to pass through to the `CollectionPage` rendering items. */
+        this.itemProps = {};
         /** Same as the `wide` property of `FormDialog`. */
         this.wide = false;
         /** Same as the `alert` property of `FormDialog`. */
@@ -71,7 +73,7 @@ export class InternalAsyncListControl extends InternalEditableControl {
         <button ?disabled=${isDisabled} class=${wrapperClass} @click=${handleClick}>${card}</button>
       `;
             }
-            if (this.hideDeleteButton)
+            if (this.hideDeleteButton || this.readonly)
                 return clickableItem;
             return html `
       <foxy-swipe-actions class="block">
@@ -113,6 +115,7 @@ export class InternalAsyncListControl extends InternalEditableControl {
             limit: { type: Number },
             form: {},
             item: {},
+            itemProps: { type: Object, attribute: 'item-props' },
             wide: { type: Boolean },
             alert: { type: Boolean },
         };
@@ -145,7 +148,7 @@ export class InternalAsyncListControl extends InternalEditableControl {
             </foxy-form-dialog>
           `
             : ''}
-      ${this.hideDeleteButton
+      ${this.hideDeleteButton || this.readonly
             ? ''
             : html `
             <foxy-internal-confirm-dialog
@@ -170,9 +173,14 @@ export class InternalAsyncListControl extends InternalEditableControl {
       <foxy-pagination first=${ifDefined(first)} infer="pagination">
         <foxy-collection-page
-          class="mb-s block divide-y divide-contrast-5 rounded overflow-hidden bg-contrast-5"
+          class=${classMap({
+            'block divide-y divide-contrast-5 rounded overflow-hidden': true,
+            'ring-1 ring-inset ring-contrast-10': !this.form && !this.getPageHref,
+            'bg-contrast-5': !!this.form || !!this.getPageHref,
+        })}
           infer="card"
           .related=${this.related}
+          .props=${this.itemProps}
           .item=${this.__itemRenderer}
         >
         </foxy-collection-page>
@@ -182,7 +190,7 @@ export class InternalAsyncListControl extends InternalEditableControl {
             : this.createPageHref && !this.disabled
                 ? html `
               <a
-                class="mb-s w-full flex items-center justify-center h-m px-m rounded text-m font-medium transition-colors bg-contrast-5 text-success hover-bg-contrast-10 focus-outline-none focus-ring-2 focus-ring-primary-50"
+                class="mt-s w-full flex items-center justify-center h-m px-m rounded text-m font-medium transition-colors bg-contrast-5 text-success hover-bg-contrast-10 focus-outline-none focus-ring-2 focus-ring-primary-50"
                 href=${this.createPageHref}
               >
                 <foxy-i18n infer="" key="create_button_text"></foxy-i18n>
@@ -190,7 +198,7 @@ export class InternalAsyncListControl extends InternalEditableControl {
             `
                 : html `
               <vaadin-button
-                class="mb-s w-full"
+                class="mt-s w-full"
                 theme="success"
                 ?disabled=${this.disabled}
                 @click=${(evt) => {
@@ -219,7 +227,16 @@ export class InternalAsyncListControl extends InternalEditableControl {
             this.__cachedCardRenderer = {
                 item: item,
                 render: typeof item === 'string'
-                    ? new Function('ctx', `return ctx.html\`<${item} related=\${JSON.stringify(ctx.related)} parent=\${ctx.parent} style="padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)" infer href=\${ctx.href}></${item}>\``)
+                    ? new Function('ctx', `return ctx.html\`
+                  <${item}
+                    related=\${JSON.stringify(ctx.related)}
+                    parent=\${ctx.parent}
+                    style="padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)"
+                    infer=""
+                    href=\${ctx.href}
+                    ...=\${ctx.spread(ctx.props)}
+                  >
+                  </${item}>\``)
                     : ctx => html `
                 <div style="padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)">
                   ${item === null || item === void 0 ? void 0 : item(ctx)}

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControl.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InternalAsyncListControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalAsyncListControl/InternalAsyncListControl.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations, TemplateResult } from 'lit-element';\nimport type { CollectionPage, NucleonElement } from '../../public/index';\nimport type { InternalConfirmDialog } from '../InternalConfirmDialog';\nimport type { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport type { ItemRenderer } from '../../public/CollectionPage/types';\nimport type { FormDialog } from '../../index';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { classMap } from '../../../utils/class-map';\nimport { html } from 'lit-element';\n\nexport class InternalAsyncListControl extends InternalEditableControl {\n static get properties(): PropertyDeclarations {\n return {\n ...super.properties,\n keepDialogOpenOnDelete: { type: Boolean, attribute: 'keep-dialog-open-on-delete' },\n keepDialogOpenOnPost: { type: Boolean, attribute: 'keep-dialog-open-on-post' },\n hideDeleteButton: { type: Boolean, attribute: 'hide-delete-button' },\n hideCreateButton: { type: Boolean, attribute: 'hide-create-button' },\n createPageHref: { attribute: 'create-page-href' },\n getPageHref: { attribute: false },\n related: { type: Array },\n first: {},\n limit: { type: Number },\n form: {},\n item: {},\n wide: { type: Boolean },\n alert: { type: Boolean },\n };\n }\n\n /** If true, FormDialog won't automatically close after the associated form deletes the resource. /\n keepDialogOpenOnDelete = false;\n\n /* If true, FormDialog won't automatically close after the associated form creates a resource. /\n keepDialogOpenOnPost = false;\n\n /* If provided, renders Create button as a link to this page. /\n createPageHref: string \| null = null;\n\n /* Same as the `related` property of `NucleonElement`. /\n related = [] as string[];\n\n /* Limit query parameter to apply to the `first` URL. /\n limit = 20;\n\n /* URI of the first page of the hAPI collection to display. /\n first: string \| null = null;\n\n /* Same as the `form` property of `FormDialog`. If set, will open a dialog on item click. /\n form: FormDialog['form'] = null;\n\n /* Same as the `item` property of `CollectionPage`. /\n item: CollectionPage<any>['item'] = null;\n\n /* Same as the `wide` property of `FormDialog`. /\n wide = false;\n\n /* Same as the `alert` property of `FormDialog`. /\n alert = false;\n\n /* Hides Delete Swipe Action if true. /\n hideDeleteButton = false;\n\n /* Hides Create button if true. /\n hideCreateButton = false;\n\n /* If set, renders list items as <a> tags. */\n getPageHref: ((itemHref: string, item: unknown) => string \| null) \| null = null;\n\n private __deletionConfimationCallback: (() => void) \| null = null;\n\n private __cachedCardRenderer: {\n item: InternalAsyncListControl['item'];\n render: ItemRenderer;\n } \| null = null;\n\n private __itemRenderer: ItemRenderer = ctx => {\n if (!ctx.data) return this.__cardRenderer(ctx);\n\n const href = this.getPageHref?.(ctx.href, ctx.data);\n if (typeof href !== 'string' && !this.form) return this.__cardRenderer(ctx);\n\n const isDisabled = this.disabledSelector.matches('card', true);\n const card = this.__cardRenderer(ctx);\n let clickableItem: TemplateResult;\n\n const wrapperClass = classMap({\n 'rounded-t': !ctx.previous,\n 'rounded-b': !ctx.next,\n 'focus-outline-none focus-ring-2 focus-ring-inset focus-ring-primary-50': true,\n 'text-left w-full block transition-colors': true,\n 'hover-bg-contrast-5': !isDisabled,\n });\n\n if (this.getPageHref) {\n if (isDisabled) {\n clickableItem = html`<div class=${wrapperClass}>${card}</div>`;\n } else {\n const href = this.getPageHref(ctx.href, ctx.data);\n clickableItem = html`<a class=${wrapperClass} href=${href}>${card}</a>`;\n }\n } else {\n const handleClick = (evt: Event) => {\n const button = evt.currentTarget as HTMLButtonElement;\n const dialog = this.__dialog;\n\n dialog.header = 'header_update';\n dialog.href = ctx.href;\n dialog.show(button);\n };\n\n clickableItem = html`\n <button ?disabled=${isDisabled} class=${wrapperClass} @click=${handleClick}>${card}</button>\n `;\n }\n\n if (this.hideDeleteButton) return clickableItem;\n\n return html`\n <foxy-swipe-actions class=\"block\">\n ${clickableItem}\n\n <vaadin-button\n theme=\"primary error\"\n class=\"h-full\"\n slot=\"action\"\n @click=${(evt: CustomEvent) => {\n const button = evt.currentTarget as HTMLElement;\n const confirm = this.renderRoot.querySelector('#confirm') as InternalConfirmDialog;\n\n confirm.show(button);\n\n this.__deletionConfimationCallback = () => {\n const cardButton = button.previousElementSibling!;\n const card = cardButton.querySelector<NucleonElement<any>>('[href]');\n\n card?.delete();\n this.__deletionConfimationCallback = null;\n };\n }}\n >\n <foxy-i18n infer=\"\" key=\"delete_button_text\"></foxy-i18n>\n </vaadin-button>\n </foxy-swipe-actions>\n `;\n };\n\n renderControl(): TemplateResult {\n let first: string \| undefined;\n\n try {\n const url = new URL(this.first ?? '');\n url.searchParams.set('limit', String(this.limit));\n first = url.toString();\n } catch {\n first = undefined;\n }\n\n return html`\n ${this.form\n ? html`\n <foxy-form-dialog\n parent=${ifDefined(this.first ?? void 0)}\n infer=\"dialog\"\n id=\"form\"\n ?wide=${this.wide}\n ?alert=${this.alert}\n ?keep-open-on-post=${this.keepDialogOpenOnPost}\n ?keep-open-on-delete=${this.keepDialogOpenOnDelete}\n .related=${this.related}\n .form=${this.form as any}\n >\n </foxy-form-dialog>\n `\n : ''}\n ${this.hideDeleteButton\n ? ''\n : html`\n <foxy-internal-confirm-dialog\n message=\"delete_message\"\n confirm=\"delete_confirm\"\n cancel=\"delete_cancel\"\n header=\"delete_header\"\n theme=\"error\"\n infer=\"\"\n id=\"confirm\"\n @hide=${(evt: DialogHideEvent) => {\n if (!evt.detail.cancelled) this.__deletionConfimationCallback?.();\n }}\n >\n </foxy-internal-confirm-dialog>\n `}\n ${this.label && this.label !== 'label'\n ? html`<div class=\"font-medium text-secondary text-s mb-xs\">${this.label}</div>`\n : ''}\n\n <foxy-pagination first=${ifDefined(first)} infer=\"pagination\">\n <foxy-collection-page\n class=\"mb-s block divide-y divide-contrast-5 rounded overflow-hidden bg-contrast-5\"\n infer=\"card\"\n .related=${this.related}\n .item=${this.__itemRenderer as any}\n >\n </foxy-collection-page>\n\n ${(!this.form && !this.createPageHref) \|\| this.readonly \|\| this.hideCreateButton\n ? ''\n : this.createPageHref && !this.disabled\n ? html`\n <a\n class=\"mb-s w-full flex items-center justify-center h-m px-m rounded text-m font-medium transition-colors bg-contrast-5 text-success hover-bg-contrast-10 focus-outline-none focus-ring-2 focus-ring-primary-50\"\n href=${this.createPageHref}\n >\n <foxy-i18n infer=\"\" key=\"create_button_text\"></foxy-i18n>\n </a>\n `\n : html`\n <vaadin-button\n class=\"mb-s w-full\"\n theme=\"success\"\n ?disabled=${this.disabled}\n @click=${(evt: Event) => {\n evt.preventDefault();\n evt.stopPropagation();\n\n const dialog = this.__dialog;\n const button = evt.currentTarget as HTMLButtonElement;\n\n dialog.header = 'header_create';\n dialog.href = '';\n dialog.show(button);\n }}\n >\n <foxy-i18n infer=\"\" key=\"create_button_text\"></foxy-i18n>\n </vaadin-button>\n `}\n </foxy-pagination>\n `;\n }\n\n private get __dialog() {\n return this.renderRoot.querySelector('#form') as FormDialog;\n }\n\n private get __cardRenderer() {\n const item = this.item;\n\n if (this.__cachedCardRenderer?.item !== item) {\n this.__cachedCardRenderer = {\n item: item,\n render:\n typeof item === 'string'\n ? (new Function(\n 'ctx',\n `return ctx.html\\`<${item} related=\\${JSON.stringify(ctx.related)} parent=\\${ctx.parent} style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\" infer href=\\${ctx.href}></${item}>\\``\n ) as ItemRenderer)\n : ctx => html`\n <div style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\">\n ${item?.(ctx)}\n </div>\n `,\n };\n }\n\n return this.__cachedCardRenderer.render;\n }\n}\n"]}
1	+ {"version":3,"file":"InternalAsyncListControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalAsyncListControl/InternalAsyncListControl.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,uBAAuB,EAAE,8DAA2D;AAC7F,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,oCAAiC;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEnC,MAAM,OAAO,wBAAyB,SAAQ,uBAAuB;IAArE;;QAqBE,oGAAoG;QACpG,2BAAsB,GAAG,KAAK,CAAC;QAE/B,kGAAkG;QAClG,yBAAoB,GAAG,KAAK,CAAC;QAE7B,iEAAiE;QACjE,mBAAc,GAAkB,IAAI,CAAC;QAErC,0DAA0D;QAC1D,YAAO,GAAG,EAAc,CAAC;QAEzB,yDAAyD;QACzD,UAAK,GAAG,EAAE,CAAC;QAEX,+DAA+D;QAC/D,UAAK,GAAkB,IAAI,CAAC;QAE5B,6FAA6F;QAC7F,SAAI,GAAuB,IAAI,CAAC;QAEhC,uDAAuD;QACvD,SAAI,GAAgC,IAAI,CAAC;QAEzC,qEAAqE;QACrE,cAAS,GAA4B,EAAE,CAAC;QAExC,mDAAmD;QACnD,SAAI,GAAG,KAAK,CAAC;QAEb,oDAAoD;QACpD,UAAK,GAAG,KAAK,CAAC;QAEd,yCAAyC;QACzC,qBAAgB,GAAG,KAAK,CAAC;QAEzB,mCAAmC;QACnC,qBAAgB,GAAG,KAAK,CAAC;QAEzB,8CAA8C;QAC9C,gBAAW,GAAgE,IAAI,CAAC;QAExE,kCAA6B,GAAwB,IAAI,CAAC;QAE1D,yBAAoB,GAGjB,IAAI,CAAC;QAER,mBAAc,GAAiB,GAAG,CAAC,EAAE;;YAC3C,IAAI,CAAC,GAAG,CAAC,IAAI;gBAAE,OAAO,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;YAE/C,MAAM,IAAI,SAAG,IAAI,CAAC,WAAW,+CAAhB,IAAI,EAAe,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;YACpD,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,CAAC,IAAI,CAAC,IAAI;gBAAE,OAAO,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;YAE5E,MAAM,UAAU,GAAG,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;YAC/D,MAAM,IAAI,GAAG,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;YACtC,IAAI,aAA6B,CAAC;YAElC,MAAM,YAAY,GAAG,QAAQ,CAAC;gBAC5B,WAAW,EAAE,CAAC,GAAG,CAAC,QAAQ;gBAC1B,WAAW,EAAE,CAAC,GAAG,CAAC,IAAI;gBACtB,wEAAwE,EAAE,IAAI;gBAC9E,0CAA0C,EAAE,IAAI;gBAChD,qBAAqB,EAAE,CAAC,UAAU;aACnC,CAAC,CAAC;YAEH,IAAI,IAAI,CAAC,WAAW,EAAE;gBACpB,IAAI,UAAU,EAAE;oBACd,aAAa,GAAG,IAAI,CAAA,cAAc,YAAY,IAAI,IAAI,QAAQ,CAAC;iBAChE;qBAAM;oBACL,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;oBAClD,aAAa,GAAG,IAAI,CAAA,YAAY,YAAY,SAAS,IAAI,IAAI,IAAI,MAAM,CAAC;iBACzE;aACF;iBAAM;gBACL,MAAM,WAAW,GAAG,CAAC,GAAU,EAAE,EAAE;oBACjC,MAAM,MAAM,GAAG,GAAG,CAAC,aAAkC,CAAC;oBACtD,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC;oBAE7B,MAAM,CAAC,MAAM,GAAG,eAAe,CAAC;oBAChC,MAAM,CAAC,IAAI,GAAG,GAAG,CAAC,IAAI,CAAC;oBACvB,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;gBACtB,CAAC,CAAC;gBAEF,aAAa,GAAG,IAAI,CAAA;4BACE,UAAU,UAAU,YAAY,WAAW,WAAW,IAAI,IAAI;OACnF,CAAC;aACH;YAED,IAAI,IAAI,CAAC,gBAAgB,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO,aAAa,CAAC;YAEjE,OAAO,IAAI,CAAA;;UAEL,aAAa;;;;;;mBAMJ,CAAC,GAAgB,EAAE,EAAE;gBAC5B,MAAM,MAAM,GAAG,GAAG,CAAC,aAA4B,CAAC;gBAChD,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,UAAU,CAA0B,CAAC;gBAEnF,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;gBAErB,IAAI,CAAC,6BAA6B,GAAG,GAAG,EAAE;oBACxC,MAAM,UAAU,GAAG,MAAM,CAAC,sBAAuB,CAAC;oBAClD,MAAM,IAAI,GAAG,UAAU,CAAC,aAAa,CAAsB,QAAQ,CAAC,CAAC;oBAErE,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,GAAG;oBACf,IAAI,CAAC,6BAA6B,GAAG,IAAI,CAAC;gBAC5C,CAAC,CAAC;YACJ,CAAC;;;;;KAKN,CAAC;QACJ,CAAC,CAAC;IAuIJ,CAAC;IAjRC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,sBAAsB,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,4BAA4B,EAAE;YAClF,oBAAoB,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,0BAA0B,EAAE;YAC9E,gBAAgB,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE;YACpE,gBAAgB,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE;YACpE,cAAc,EAAE,EAAE,SAAS,EAAE,kBAAkB,EAAE;YACjD,WAAW,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;YACjC,OAAO,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YACxB,KAAK,EAAE,EAAE;YACT,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACvB,IAAI,EAAE,EAAE;YACR,IAAI,EAAE,EAAE;YACR,SAAS,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE;YACpD,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;YACvB,KAAK,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;SACzB,CAAC;IACJ,CAAC;IA0HD,aAAa;;QACX,IAAI,KAAyB,CAAC;QAE9B,IAAI;YACF,MAAM,GAAG,GAAG,IAAI,GAAG,OAAC,IAAI,CAAC,KAAK,mCAAI,EAAE,CAAC,CAAC;YACtC,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;YAClD,KAAK,GAAG,GAAG,CAAC,QAAQ,EAAE,CAAC;SACxB;QAAC,WAAM;YACN,KAAK,GAAG,SAAS,CAAC;SACnB;QAED,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,IAAI;YACT,CAAC,CAAC,IAAI,CAAA;;uBAES,SAAS,OAAC,IAAI,CAAC,KAAK,mCAAI,KAAK,CAAC,CAAC;;;sBAGhC,IAAI,CAAC,IAAI;uBACR,IAAI,CAAC,KAAK;mCACE,IAAI,CAAC,oBAAoB;qCACvB,IAAI,CAAC,sBAAsB;yBACvC,IAAI,CAAC,OAAO;sBACf,IAAI,CAAC,IAAW;;;WAG3B;YACH,CAAC,CAAC,EAAE;QACJ,IAAI,CAAC,gBAAgB,IAAI,IAAI,CAAC,QAAQ;YACtC,CAAC,CAAC,EAAE;YACJ,CAAC,CAAC,IAAI,CAAA;;;;;;;;;sBASQ,CAAC,GAAoB,EAAE,EAAE;;gBAC/B,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,SAAS;oBAAE,MAAA,IAAI,CAAC,6BAA6B,+CAAlC,IAAI,EAAmC;YACpE,CAAC;;;WAGJ;QACH,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO;YACpC,CAAC,CAAC,IAAI,CAAA,wDAAwD,IAAI,CAAC,KAAK,QAAQ;YAChF,CAAC,CAAC,EAAE;;+BAEmB,SAAS,CAAC,KAAK,CAAC;;kBAE7B,QAAQ,CAAC;YACf,0DAA0D,EAAE,IAAI;YAChE,oCAAoC,EAAE,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,WAAW;YACrE,eAAe,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC,WAAW;SACnD,CAAC;;qBAES,IAAI,CAAC,OAAO;mBACd,IAAI,CAAC,SAAS;kBACf,IAAI,CAAC,cAAqB;;;;UAIlC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,gBAAgB;YAC9E,CAAC,CAAC,EAAE;YACJ,CAAC,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,IAAI,CAAC,QAAQ;gBACvC,CAAC,CAAC,IAAI,CAAA;;;uBAGO,IAAI,CAAC,cAAc;;;;aAI7B;gBACH,CAAC,CAAC,IAAI,CAAA;;;;4BAIY,IAAI,CAAC,QAAQ;yBAChB,CAAC,GAAU,EAAE,EAAE;oBACtB,GAAG,CAAC,cAAc,EAAE,CAAC;oBACrB,GAAG,CAAC,eAAe,EAAE,CAAC;oBAEtB,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC;oBAC7B,MAAM,MAAM,GAAG,GAAG,CAAC,aAAkC,CAAC;oBAEtD,MAAM,CAAC,MAAM,GAAG,eAAe,CAAC;oBAChC,MAAM,CAAC,IAAI,GAAG,EAAE,CAAC;oBACjB,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;gBACtB,CAAC;;;;aAIJ;;KAER,CAAC;IACJ,CAAC;IAED,IAAY,QAAQ;QAClB,OAAO,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,OAAO,CAAe,CAAC;IAC9D,CAAC;IAED,IAAY,cAAc;;QACxB,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QAEvB,IAAI,OAAA,IAAI,CAAC,oBAAoB,0CAAE,IAAI,MAAK,IAAI,EAAE;YAC5C,IAAI,CAAC,oBAAoB,GAAG;gBAC1B,IAAI,EAAE,IAAI;gBACV,MAAM,EACJ,OAAO,IAAI,KAAK,QAAQ;oBACtB,CAAC,CAAE,IAAI,QAAQ,CACX,KAAK,EACL;qBACK,IAAI;;;;;;;;sBAQH,IAAI,KAAK,CACC;oBACpB,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA;;oBAEL,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAG,GAAG,CAAC;;eAEhB;aACR,CAAC;SACH;QAED,OAAO,IAAI,CAAC,oBAAoB,CAAC,MAAM,CAAC;IAC1C,CAAC;CACF","sourcesContent":["import type { PropertyDeclarations, TemplateResult } from 'lit-element';\nimport type { CollectionPage, NucleonElement } from '../../public/index';\nimport type { InternalConfirmDialog } from '../InternalConfirmDialog';\nimport type { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport type { ItemRenderer } from '../../public/CollectionPage/types';\nimport type { FormDialog } from '../../index';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { classMap } from '../../../utils/class-map';\nimport { html } from 'lit-element';\n\nexport class InternalAsyncListControl extends InternalEditableControl {\n static get properties(): PropertyDeclarations {\n return {\n ...super.properties,\n keepDialogOpenOnDelete: { type: Boolean, attribute: 'keep-dialog-open-on-delete' },\n keepDialogOpenOnPost: { type: Boolean, attribute: 'keep-dialog-open-on-post' },\n hideDeleteButton: { type: Boolean, attribute: 'hide-delete-button' },\n hideCreateButton: { type: Boolean, attribute: 'hide-create-button' },\n createPageHref: { attribute: 'create-page-href' },\n getPageHref: { attribute: false },\n related: { type: Array },\n first: {},\n limit: { type: Number },\n form: {},\n item: {},\n itemProps: { type: Object, attribute: 'item-props' },\n wide: { type: Boolean },\n alert: { type: Boolean },\n };\n }\n\n /** If true, FormDialog won't automatically close after the associated form deletes the resource. /\n keepDialogOpenOnDelete = false;\n\n /* If true, FormDialog won't automatically close after the associated form creates a resource. /\n keepDialogOpenOnPost = false;\n\n /* If provided, renders Create button as a link to this page. /\n createPageHref: string \| null = null;\n\n /* Same as the `related` property of `NucleonElement`. /\n related = [] as string[];\n\n /* Limit query parameter to apply to the `first` URL. /\n limit = 20;\n\n /* URI of the first page of the hAPI collection to display. /\n first: string \| null = null;\n\n /* Same as the `form` property of `FormDialog`. If set, will open a dialog on item click. /\n form: FormDialog['form'] = null;\n\n /* Same as the `item` property of `CollectionPage`. /\n item: CollectionPage<any>['item'] = null;\n\n /* Props to pass through to the `CollectionPage` rendering items. /\n itemProps: Record<string, unknown> = {};\n\n /* Same as the `wide` property of `FormDialog`. /\n wide = false;\n\n /* Same as the `alert` property of `FormDialog`. /\n alert = false;\n\n /* Hides Delete Swipe Action if true. /\n hideDeleteButton = false;\n\n /* Hides Create button if true. /\n hideCreateButton = false;\n\n /* If set, renders list items as <a> tags. */\n getPageHref: ((itemHref: string, item: unknown) => string \| null) \| null = null;\n\n private __deletionConfimationCallback: (() => void) \| null = null;\n\n private __cachedCardRenderer: {\n item: InternalAsyncListControl['item'];\n render: ItemRenderer;\n } \| null = null;\n\n private __itemRenderer: ItemRenderer = ctx => {\n if (!ctx.data) return this.__cardRenderer(ctx);\n\n const href = this.getPageHref?.(ctx.href, ctx.data);\n if (typeof href !== 'string' && !this.form) return this.__cardRenderer(ctx);\n\n const isDisabled = this.disabledSelector.matches('card', true);\n const card = this.__cardRenderer(ctx);\n let clickableItem: TemplateResult;\n\n const wrapperClass = classMap({\n 'rounded-t': !ctx.previous,\n 'rounded-b': !ctx.next,\n 'focus-outline-none focus-ring-2 focus-ring-inset focus-ring-primary-50': true,\n 'text-left w-full block transition-colors': true,\n 'hover-bg-contrast-5': !isDisabled,\n });\n\n if (this.getPageHref) {\n if (isDisabled) {\n clickableItem = html`<div class=${wrapperClass}>${card}</div>`;\n } else {\n const href = this.getPageHref(ctx.href, ctx.data);\n clickableItem = html`<a class=${wrapperClass} href=${href}>${card}</a>`;\n }\n } else {\n const handleClick = (evt: Event) => {\n const button = evt.currentTarget as HTMLButtonElement;\n const dialog = this.__dialog;\n\n dialog.header = 'header_update';\n dialog.href = ctx.href;\n dialog.show(button);\n };\n\n clickableItem = html`\n <button ?disabled=${isDisabled} class=${wrapperClass} @click=${handleClick}>${card}</button>\n `;\n }\n\n if (this.hideDeleteButton \|\| this.readonly) return clickableItem;\n\n return html`\n <foxy-swipe-actions class=\"block\">\n ${clickableItem}\n\n <vaadin-button\n theme=\"primary error\"\n class=\"h-full\"\n slot=\"action\"\n @click=${(evt: CustomEvent) => {\n const button = evt.currentTarget as HTMLElement;\n const confirm = this.renderRoot.querySelector('#confirm') as InternalConfirmDialog;\n\n confirm.show(button);\n\n this.__deletionConfimationCallback = () => {\n const cardButton = button.previousElementSibling!;\n const card = cardButton.querySelector<NucleonElement<any>>('[href]');\n\n card?.delete();\n this.__deletionConfimationCallback = null;\n };\n }}\n >\n <foxy-i18n infer=\"\" key=\"delete_button_text\"></foxy-i18n>\n </vaadin-button>\n </foxy-swipe-actions>\n `;\n };\n\n renderControl(): TemplateResult {\n let first: string \| undefined;\n\n try {\n const url = new URL(this.first ?? '');\n url.searchParams.set('limit', String(this.limit));\n first = url.toString();\n } catch {\n first = undefined;\n }\n\n return html`\n ${this.form\n ? html`\n <foxy-form-dialog\n parent=${ifDefined(this.first ?? void 0)}\n infer=\"dialog\"\n id=\"form\"\n ?wide=${this.wide}\n ?alert=${this.alert}\n ?keep-open-on-post=${this.keepDialogOpenOnPost}\n ?keep-open-on-delete=${this.keepDialogOpenOnDelete}\n .related=${this.related}\n .form=${this.form as any}\n >\n </foxy-form-dialog>\n `\n : ''}\n ${this.hideDeleteButton \|\| this.readonly\n ? ''\n : html`\n <foxy-internal-confirm-dialog\n message=\"delete_message\"\n confirm=\"delete_confirm\"\n cancel=\"delete_cancel\"\n header=\"delete_header\"\n theme=\"error\"\n infer=\"\"\n id=\"confirm\"\n @hide=${(evt: DialogHideEvent) => {\n if (!evt.detail.cancelled) this.__deletionConfimationCallback?.();\n }}\n >\n </foxy-internal-confirm-dialog>\n `}\n ${this.label && this.label !== 'label'\n ? html`<div class=\"font-medium text-secondary text-s mb-xs\">${this.label}</div>`\n : ''}\n\n <foxy-pagination first=${ifDefined(first)} infer=\"pagination\">\n <foxy-collection-page\n class=${classMap({\n 'block divide-y divide-contrast-5 rounded overflow-hidden': true,\n 'ring-1 ring-inset ring-contrast-10': !this.form && !this.getPageHref,\n 'bg-contrast-5': !!this.form \|\| !!this.getPageHref,\n })}\n infer=\"card\"\n .related=${this.related}\n .props=${this.itemProps}\n .item=${this.__itemRenderer as any}\n >\n </foxy-collection-page>\n\n ${(!this.form && !this.createPageHref) \|\| this.readonly \|\| this.hideCreateButton\n ? ''\n : this.createPageHref && !this.disabled\n ? html`\n <a\n class=\"mt-s w-full flex items-center justify-center h-m px-m rounded text-m font-medium transition-colors bg-contrast-5 text-success hover-bg-contrast-10 focus-outline-none focus-ring-2 focus-ring-primary-50\"\n href=${this.createPageHref}\n >\n <foxy-i18n infer=\"\" key=\"create_button_text\"></foxy-i18n>\n </a>\n `\n : html`\n <vaadin-button\n class=\"mt-s w-full\"\n theme=\"success\"\n ?disabled=${this.disabled}\n @click=${(evt: Event) => {\n evt.preventDefault();\n evt.stopPropagation();\n\n const dialog = this.__dialog;\n const button = evt.currentTarget as HTMLButtonElement;\n\n dialog.header = 'header_create';\n dialog.href = '';\n dialog.show(button);\n }}\n >\n <foxy-i18n infer=\"\" key=\"create_button_text\"></foxy-i18n>\n </vaadin-button>\n `}\n </foxy-pagination>\n `;\n }\n\n private get __dialog() {\n return this.renderRoot.querySelector('#form') as FormDialog;\n }\n\n private get __cardRenderer() {\n const item = this.item;\n\n if (this.__cachedCardRenderer?.item !== item) {\n this.__cachedCardRenderer = {\n item: item,\n render:\n typeof item === 'string'\n ? (new Function(\n 'ctx',\n `return ctx.html\\`\n <${item}\n related=\\${JSON.stringify(ctx.related)}\n parent=\\${ctx.parent}\n style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n infer=\"\"\n href=\\${ctx.href}\n ...=\\${ctx.spread(ctx.props)}\n >\n </${item}>\\``\n ) as ItemRenderer)\n : ctx => html`\n <div style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\">\n ${item?.(ctx)}\n </div>\n `,\n };\n }\n\n return this.__cachedCardRenderer.render;\n }\n}\n"]}

package/dist/elements/public/AttributeCard/AttributeCard.js CHANGED Viewed

@@ -55,7 +55,7 @@ export class AttributeCard extends Base {
         ${this.renderTemplateOrSlot('value:before')}
         <div
-          class="truncate text-tertiary text-s sm-text-m"
+          class="truncate text-secondary text-s sm-text-m"
           title=${(_a = data === null || data === void 0 ? void 0 : data.value) !== null && _a !== void 0 ? _a : ''}
           data-testid="value"
         >

package/dist/elements/public/AttributeCard/AttributeCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttributeCard.js","sourceRoot":"","sources":["../../../../src/elements/public/AttributeCard/AttributeCard.ts"],"names":[],"mappings":"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","sourcesContent":["import { Data, Templates } from './types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\n\nconst NS = 'attribute-card';\nconst Base = ResponsiveMixin(\n TranslatableMixin(ConfigurableMixin(ThemeableMixin(NucleonElement)), NS)\n);\n\n/*\n Basic card displaying an attribute.\n \n @slot name:before - new in v1.4.0\n * @slot name:after - new in v1.4.0\n * @slot value:before - new in v1.4.0\n * @slot value:after - new in v1.4.0\n \n @element foxy-attribute-card\n * @since 1.2.0\n */\nexport class AttributeCard extends Base<Data> {\n templates: Templates = {};\n\n private readonly __renderName = () => {\n const { data } = this;\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('name:before')}\n\n <div class=\"flex items-center space-x-xs font-medium\">\n <div class=\"truncate\" title=${data?.name ?? ''} data-testid=\"name\">\n ${data?.name ?? html` `}\n </div>\n\n ${data && data.visibility !== 'public'\n ? html`\n <div class=\"flex items-center\" style=\"height: 1px\">\n <iron-icon icon=\"icons:lock\" class=\"icon-inline\"></iron-icon>\n </div>\n `\n : ''}\n </div>\n\n ${this.renderTemplateOrSlot('name:after')}\n </div>\n `;\n };\n\n private readonly __renderValue = () => {\n const { data } = this;\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('value:before')}\n\n <div\n class=\"truncate text-~~tertiary~~ text-s sm-text-m\"\n title=${data?.value ?? ''}\n data-testid=\"value\"\n >\n ${data?.value ?? html` `}\n </div>\n\n ${this.renderTemplateOrSlot('value:after')}\n </div>\n `;\n };\n\n render(): TemplateResult {\n const hiddenSelector = this.hiddenSelector;\n const isLoaded = this.in({ idle: 'snapshot' });\n const isEmpty = this.in({ idle: 'template' });\n\n return html`\n <div\n aria-live=\"polite\"\n aria-busy=${this.in('busy')}\n class=\"h-s flex flex-col justify-center relative text-body text-m font-lumo leading-xs sm-flex-row sm-items-center sm-justify-between\"\n >\n ${hiddenSelector.matches('name', true) ? '' : this.__renderName()}\n ${hiddenSelector.matches('value', true) ? '' : this.__renderValue()}\n\n <div\n class=${classMap({\n 'transition duration-250 ease-in-out absolute inset-0 flex': true,\n 'opacity-0 pointer-events-none': isLoaded,\n })}\n >\n <foxy-spinner\n data-testid=\"spinner\"\n class=\"m-auto\"\n state=${this.in('fail') ? 'error' : isEmpty ? 'empty' : 'busy'}\n lang=${this.lang}\n ns=\"${this.ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n >\n </foxy-spinner>\n </div>\n </div>\n `;\n }\n}\n"]}
1	+ {"version":3,"file":"AttributeCard.js","sourceRoot":"","sources":["../../../../src/elements/public/AttributeCard/AttributeCard.ts"],"names":[],"mappings":"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","sourcesContent":["import { Data, Templates } from './types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\n\nconst NS = 'attribute-card';\nconst Base = ResponsiveMixin(\n TranslatableMixin(ConfigurableMixin(ThemeableMixin(NucleonElement)), NS)\n);\n\n/*\n Basic card displaying an attribute.\n \n @slot name:before - new in v1.4.0\n * @slot name:after - new in v1.4.0\n * @slot value:before - new in v1.4.0\n * @slot value:after - new in v1.4.0\n \n @element foxy-attribute-card\n * @since 1.2.0\n */\nexport class AttributeCard extends Base<Data> {\n templates: Templates = {};\n\n private readonly __renderName = () => {\n const { data } = this;\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('name:before')}\n\n <div class=\"flex items-center space-x-xs font-medium\">\n <div class=\"truncate\" title=${data?.name ?? ''} data-testid=\"name\">\n ${data?.name ?? html` `}\n </div>\n\n ${data && data.visibility !== 'public'\n ? html`\n <div class=\"flex items-center\" style=\"height: 1px\">\n <iron-icon icon=\"icons:lock\" class=\"icon-inline\"></iron-icon>\n </div>\n `\n : ''}\n </div>\n\n ${this.renderTemplateOrSlot('name:after')}\n </div>\n `;\n };\n\n private readonly __renderValue = () => {\n const { data } = this;\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('value:before')}\n\n <div\n class=\"truncate text-secondary text-s sm-text-m\"\n title=${data?.value ?? ''}\n data-testid=\"value\"\n >\n ${data?.value ?? html` `}\n </div>\n\n ${this.renderTemplateOrSlot('value:after')}\n </div>\n `;\n };\n\n render(): TemplateResult {\n const hiddenSelector = this.hiddenSelector;\n const isLoaded = this.in({ idle: 'snapshot' });\n const isEmpty = this.in({ idle: 'template' });\n\n return html`\n <div\n aria-live=\"polite\"\n aria-busy=${this.in('busy')}\n class=\"h-s flex flex-col justify-center relative text-body text-m font-lumo leading-xs sm-flex-row sm-items-center sm-justify-between\"\n >\n ${hiddenSelector.matches('name', true) ? '' : this.__renderName()}\n ${hiddenSelector.matches('value', true) ? '' : this.__renderValue()}\n\n <div\n class=${classMap({\n 'transition duration-250 ease-in-out absolute inset-0 flex': true,\n 'opacity-0 pointer-events-none': isLoaded,\n })}\n >\n <foxy-spinner\n data-testid=\"spinner\"\n class=\"m-auto\"\n state=${this.in('fail') ? 'error' : isEmpty ? 'empty' : 'busy'}\n lang=${this.lang}\n ns=\"${this.ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n >\n </foxy-spinner>\n </div>\n </div>\n `;\n }\n}\n"]}

package/dist/elements/public/BillingAddressCard/BillingAddressCard.d.ts ADDED Viewed

@@ -0,0 +1,15 @@
+import type { Data } from './types';
+import { InternalCard } from '../../internal/InternalCard/InternalCard';
+declare const Base: typeof InternalCard & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+    defaultNS: string;
+};
+/**
+ * Card element representing a `fx:billing_address` resource.
+ *
+ * @element foxy-billing-address-card
+ * @since 1.25.0
+ */
+export declare class BillingAddressCard extends Base<Data> {
+    renderBody(): import("lit-html").TemplateResult;
+}
+export {};

package/dist/elements/public/BillingAddressCard/BillingAddressCard.js ADDED Viewed

@@ -0,0 +1,28 @@
+import { TranslatableMixin } from "../../../mixins/translatable.js";
+import { InternalCard } from "../../internal/InternalCard/InternalCard.js";
+import { html } from 'lit-html';
+const NS = 'billing-address-card';
+const Base = TranslatableMixin(InternalCard, NS);
+/**
+ * Card element representing a `fx:billing_address` resource.
+ *
+ * @element foxy-billing-address-card
+ * @since 1.25.0
+ */
+export class BillingAddressCard extends Base {
+    renderBody() {
+        return html `
+      <section class="leading-none space-y-xs font-lumo">
+        <p class="text-m text-body font-medium truncate">
+          <foxy-i18n infer="" key="full_name" .options=${this.data}></foxy-i18n>
+          &ZeroWidthSpace;
+        </p>
+        <p class="text-s text-secondary truncate">
+          <foxy-i18n infer="" key="full_address" .options=${this.data}></foxy-i18n>
+          &ZeroWidthSpace;
+        </p>
+      </section>
+    `;
+    }
+}
+//# sourceMappingURL=BillingAddressCard.js.map

package/dist/elements/public/BillingAddressCard/BillingAddressCard.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"BillingAddressCard.js","sourceRoot":"","sources":["../../../../src/elements/public/BillingAddressCard/BillingAddressCard.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,YAAY,EAAE,oDAAiD;AACxE,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,MAAM,EAAE,GAAG,sBAAsB,CAAC;AAClC,MAAM,IAAI,GAAG,iBAAiB,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AAEjD;;;;;GAKG;AACH,MAAM,OAAO,kBAAmB,SAAQ,IAAU;IAChD,UAAU;QACR,OAAO,IAAI,CAAA;;;yDAG0C,IAAI,CAAC,IAAI;;;;4DAIN,IAAI,CAAC,IAAI;;;;KAIhE,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InternalCard } from '../../internal/InternalCard/InternalCard';\nimport { html } from 'lit-html';\n\nconst NS = 'billing-address-card';\nconst Base = TranslatableMixin(InternalCard, NS);\n\n/**\n * Card element representing a `fx:billing_address` resource.\n *\n * @element foxy-billing-address-card\n * @since 1.25.0\n */\nexport class BillingAddressCard extends Base<Data> {\n renderBody() {\n return html`\n <section class=\"leading-none space-y-xs font-lumo\">\n <p class=\"text-m text-body font-medium truncate\">\n <foxy-i18n infer=\"\" key=\"full_name\" .options=${this.data}></foxy-i18n>\n &ZeroWidthSpace;\n </p>\n <p class=\"text-s text-secondary truncate\">\n <foxy-i18n infer=\"\" key=\"full_address\" .options=${this.data}></foxy-i18n>\n &ZeroWidthSpace;\n </p>\n </section>\n `;\n }\n}\n"]}

package/dist/elements/public/BillingAddressCard/index.d.ts ADDED Viewed

@@ -0,0 +1,4 @@
+import '../../internal/InternalCard/index';
+import '../I18n/index';
+import { BillingAddressCard } from './BillingAddressCard';
+export { BillingAddressCard };

package/dist/elements/public/BillingAddressCard/index.js ADDED Viewed

@@ -0,0 +1,6 @@
+import "../../internal/InternalCard/index.js";
+import "../I18n/index.js";
+import { BillingAddressCard } from "./BillingAddressCard.js";
+customElements.define('foxy-billing-address-card', BillingAddressCard);
+export { BillingAddressCard };
+//# sourceMappingURL=index.js.map

package/dist/elements/public/BillingAddressCard/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/BillingAddressCard/index.ts"],"names":[],"mappings":"AAAA,8CAA2C;AAC3C,0BAAuB;AAEvB,OAAO,EAAE,kBAAkB,EAAE,gCAA6B;AAE1D,cAAc,CAAC,MAAM,CAAC,2BAA2B,EAAE,kBAAkB,CAAC,CAAC;AAEvE,OAAO,EAAE,kBAAkB,EAAE,CAAC","sourcesContent":["import '../../internal/InternalCard/index';\nimport '../I18n/index';\n\nimport { BillingAddressCard } from './BillingAddressCard';\n\ncustomElements.define('foxy-billing-address-card', BillingAddressCard);\n\nexport { BillingAddressCard };\n"]}

package/dist/elements/public/BillingAddressCard/types.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+import type { Resource } from '@foxy.io/sdk/core';
+import type { Rels } from '@foxy.io/sdk/backend';
+export declare type Data = Resource<Rels.BillingAddress>;

package/dist/elements/public/BillingAddressCard/types.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export {};
2	+ //# sourceMappingURL=types.js.map

package/dist/elements/public/BillingAddressCard/types.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/BillingAddressCard/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Resource } from '@foxy.io/sdk/core';\nimport type { Rels } from '@foxy.io/sdk/backend';\n\nexport type Data = Resource<Rels.BillingAddress>;\n"]}

package/dist/elements/public/CustomFieldCard/TwoLineCard.js CHANGED Viewed

@@ -25,7 +25,7 @@ export class TwoLineCard extends Base {
       <div data-testid="subtitle">
         ${this.renderTemplateOrSlot('subtitle:before')}
-        <div class="text-tertiary truncate text-s sm-text-m">
+        <div class="text-secondary truncate text-s sm-text-m">
           ${this.data ? content === null || content === void 0 ? void 0 : content(this.data) : ''}&ZeroWidthSpace;
         </div>

package/dist/elements/public/CustomFieldCard/TwoLineCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TwoLineCard.js","sourceRoot":"","sources":["../../../../src/elements/public/CustomFieldCard/TwoLineCard.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,eAAe,EAAE,sCAAmC;AAC7D,OAAO,EAAE,YAAY,EAAE,oDAAiD;AACxE,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAgBhC,MAAM,IAAI,GAAG,eAAe,CAAC,iBAAiB,CAAC,YAAY,CAAC,CAAC,CAAC;AAE9D,MAAM,OAAO,WAA2C,SAAQ,IAAW;IAA3E;;QACE,cAAS,GAAqB,EAAE,CAAC;QAEhB,kBAAa,GAAG,CAAC,OAA2B,EAAE,EAAE;YAC/D,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,oBAAoB,CAAC,cAAc,CAAC;;;YAGvC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE;;;UAGvC,IAAI,CAAC,oBAAoB,CAAC,aAAa,CAAC;;KAE7C,CAAC;QACJ,CAAC,CAAC;QAEe,qBAAgB,GAAG,CAAC,OAA2B,EAAE,EAAE;YAClE,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;;;YAG1C,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE;;;UAGvC,IAAI,CAAC,oBAAoB,CAAC,gBAAgB,CAAC;;KAEhD,CAAC;QACJ,CAAC,CAAC;IAcJ,CAAC;IAZC,UAAU,CAAC,OAA8B;QACvC,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;QAE3C,OAAO,IAAI,CAAA;;;;UAIL,cAAc,CAAC,OAAO,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,CAAC;UAC/E,cAAc,CAAC,OAAO,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,QAAQ,CAAC;;KAE7F,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { HALJSONResource } from '../NucleonElement/types';\nimport type { TemplateResult } from 'lit-html';\nimport type { Renderer } from '../../../mixins/configurable';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\nimport { InternalCard } from '../../internal/InternalCard/InternalCard';\nimport { html } from 'lit-html';\n\nexport type TemplateFn<TData extends HALJSONResource> = (data: TData) => TemplateResult;\n\nexport type Templates<TData extends HALJSONResource> = {\n 'title:before'?: Renderer<TData>;\n 'title:after'?: Renderer<TData>;\n 'subtitle:before'?: Renderer<TData>;\n 'subtitle:after'?: Renderer<TData>;\n};\n\nexport type RenderOptions<TData extends HALJSONResource> = {\n title: TemplateFn<TData>;\n subtitle: TemplateFn<TData>;\n};\n\nconst Base = ResponsiveMixin(ConfigurableMixin(InternalCard));\n\nexport class TwoLineCard<TData extends HALJSONResource> extends Base<TData> {\n templates: Templates<TData> = {};\n\n private readonly __renderTitle = (content?: TemplateFn<TData>) => {\n return html`\n <div data-testid=\"title\">\n ${this.renderTemplateOrSlot('title:before')}\n\n <div class=\"font-medium truncate\">\n ${this.data ? content?.(this.data) : ''}&ZeroWidthSpace;\n </div>\n\n ${this.renderTemplateOrSlot('title:after')}\n </div>\n `;\n };\n\n private readonly __renderSubtitle = (content?: TemplateFn<TData>) => {\n return html`\n <div data-testid=\"subtitle\">\n ${this.renderTemplateOrSlot('subtitle:before')}\n\n <div class=\"text-~~tertiary~~ truncate text-s sm-text-m\">\n ${this.data ? content?.(this.data) : ''}&ZeroWidthSpace;\n </div>\n\n ${this.renderTemplateOrSlot('subtitle:after')}\n </div>\n `;\n };\n\n renderBody(options?: RenderOptions<TData>): TemplateResult {\n const hiddenSelector = this.hiddenSelector;\n\n return html`\n <div\n class=\"h-s flex flex-col justify-center relative text-body text-m font-lumo leading-xs sm-h-xs sm-flex-row sm-items-center sm-justify-between\"\n >\n ${hiddenSelector.matches('title', true) ? '' : this.__renderTitle(options?.title)}\n ${hiddenSelector.matches('subtitle', true) ? '' : this.__renderSubtitle(options?.subtitle)}\n </div>\n `;\n }\n}\n"]}
1	+ {"version":3,"file":"TwoLineCard.js","sourceRoot":"","sources":["../../../../src/elements/public/CustomFieldCard/TwoLineCard.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,eAAe,EAAE,sCAAmC;AAC7D,OAAO,EAAE,YAAY,EAAE,oDAAiD;AACxE,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAgBhC,MAAM,IAAI,GAAG,eAAe,CAAC,iBAAiB,CAAC,YAAY,CAAC,CAAC,CAAC;AAE9D,MAAM,OAAO,WAA2C,SAAQ,IAAW;IAA3E;;QACE,cAAS,GAAqB,EAAE,CAAC;QAEhB,kBAAa,GAAG,CAAC,OAA2B,EAAE,EAAE;YAC/D,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,oBAAoB,CAAC,cAAc,CAAC;;;YAGvC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE;;;UAGvC,IAAI,CAAC,oBAAoB,CAAC,aAAa,CAAC;;KAE7C,CAAC;QACJ,CAAC,CAAC;QAEe,qBAAgB,GAAG,CAAC,OAA2B,EAAE,EAAE;YAClE,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;;;YAG1C,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE;;;UAGvC,IAAI,CAAC,oBAAoB,CAAC,gBAAgB,CAAC;;KAEhD,CAAC;QACJ,CAAC,CAAC;IAcJ,CAAC;IAZC,UAAU,CAAC,OAA8B;QACvC,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;QAE3C,OAAO,IAAI,CAAA;;;;UAIL,cAAc,CAAC,OAAO,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,CAAC;UAC/E,cAAc,CAAC,OAAO,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,QAAQ,CAAC;;KAE7F,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { HALJSONResource } from '../NucleonElement/types';\nimport type { TemplateResult } from 'lit-html';\nimport type { Renderer } from '../../../mixins/configurable';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\nimport { InternalCard } from '../../internal/InternalCard/InternalCard';\nimport { html } from 'lit-html';\n\nexport type TemplateFn<TData extends HALJSONResource> = (data: TData) => TemplateResult;\n\nexport type Templates<TData extends HALJSONResource> = {\n 'title:before'?: Renderer<TData>;\n 'title:after'?: Renderer<TData>;\n 'subtitle:before'?: Renderer<TData>;\n 'subtitle:after'?: Renderer<TData>;\n};\n\nexport type RenderOptions<TData extends HALJSONResource> = {\n title: TemplateFn<TData>;\n subtitle: TemplateFn<TData>;\n};\n\nconst Base = ResponsiveMixin(ConfigurableMixin(InternalCard));\n\nexport class TwoLineCard<TData extends HALJSONResource> extends Base<TData> {\n templates: Templates<TData> = {};\n\n private readonly __renderTitle = (content?: TemplateFn<TData>) => {\n return html`\n <div data-testid=\"title\">\n ${this.renderTemplateOrSlot('title:before')}\n\n <div class=\"font-medium truncate\">\n ${this.data ? content?.(this.data) : ''}&ZeroWidthSpace;\n </div>\n\n ${this.renderTemplateOrSlot('title:after')}\n </div>\n `;\n };\n\n private readonly __renderSubtitle = (content?: TemplateFn<TData>) => {\n return html`\n <div data-testid=\"subtitle\">\n ${this.renderTemplateOrSlot('subtitle:before')}\n\n <div class=\"text-secondary truncate text-s sm-text-m\">\n ${this.data ? content?.(this.data) : ''}&ZeroWidthSpace;\n </div>\n\n ${this.renderTemplateOrSlot('subtitle:after')}\n </div>\n `;\n };\n\n renderBody(options?: RenderOptions<TData>): TemplateResult {\n const hiddenSelector = this.hiddenSelector;\n\n return html`\n <div\n class=\"h-s flex flex-col justify-center relative text-body text-m font-lumo leading-xs sm-h-xs sm-flex-row sm-items-center sm-justify-between\"\n >\n ${hiddenSelector.matches('title', true) ? '' : this.__renderTitle(options?.title)}\n ${hiddenSelector.matches('subtitle', true) ? '' : this.__renderSubtitle(options?.subtitle)}\n </div>\n `;\n }\n}\n"]}

package/dist/elements/public/I18n/I18n.d.ts CHANGED Viewed

@@ -45,6 +45,7 @@ export declare class I18n extends I18n_base {
      *
      * @param param0 `fx:hosted_payment_gateways` or `fx:payment_gateways`
      * @example I18n.setGateways({ values: { authorize: { name: 'Authorize.Net' }}})
+     * @deprecated
      */
     static setGateways({ values }: Gateways): void;
     /** @readonly */

package/dist/elements/public/I18n/I18n.js CHANGED Viewed

@@ -70,6 +70,7 @@ export class I18n extends TranslatableMixin(InferrableMixin(LitElement), '') {
      *
      * @param param0 `fx:hosted_payment_gateways` or `fx:payment_gateways`
      * @example I18n.setGateways({ values: { authorize: { name: 'Authorize.Net' }}})
+     * @deprecated
      */
     static setGateways({ values }) {
         for (const id in values) {

package/dist/elements/public/I18n/I18n.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"I18n.js","sourceRoot":"","sources":["../../../../src/elements/public/I18n/I18n.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAwC,IAAI,EAAE,MAAM,aAAa,CAAC;AACrF,OAAO,OAAgC,MAAM,SAAS,CAAC;AAEvD,OAAO,EAAE,UAAU,EAAE,wCAAqC;AAE1D,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,OAAO,EAAE,qBAAkB;AACpC,OAAO,EAAE,MAAM,EAAE,0BAAuB;AACxC,OAAO,EAAE,eAAe,EAAE,sCAAmC;AAE7D;;;;;;;GAOG;AACH,MAAM,OAAO,IAAK,SAAQ,iBAAiB,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,EAAE,CAAC;IAA5E;;~~QAuEE~~;;;WAGG;QACH,YAAO,GAAwB,EAAE,CAAC;QAElC;;;WAGG;QACH,QAAG,GAAG,EAAE,CAAC;IAoBX,CAAC;~~IA9FC~~;;;;;;;OAOG;IACH,MAAM,CAAC,mBAAmB,CAAC,OAAmB;QAC5C,MAAM,aAAa,GAAG,CAAC,aAAa,EAAE,QAAQ,CAAU,CAAC;QACzD,MAAM,WAAW,GAAG,CAAC,SAAS,EAAE,OAAO,CAAU,CAAC;QAElD,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;QAC9D,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;QAElE,OAAO,GAAG,EAAE;YACV,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;YAC/D,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;QACrE,CAAC,CAAC;IACJ,CAAC;IAED;;;;;;;OAOG;IACH,MAAM,CAAC,eAAe,CAAC,OAAwD;QAC7E,MAAM,WAAW,GAAG,CAAC,GAAY,EAAE,EAAE;YACnC,IAAI,GAAG,YAAY,UAAU,IAAI,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,cAAc,CAAC,EAAE;gBAC3E,MAAM,CAAC,IAAI,EAAE,EAAE,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;gBACxD,GAAG,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC,CAAC;aACpC;QACH,CAAC,CAAC;QAEF,gBAAgB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QACvC,OAAO,GAAG,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;IACzD,CAAC;IAED~~;;;;;;;OAOG~~;IACH,MAAM,CAAC,WAAW,CAAC,EAAE,MAAM,EAAY;QACrC,KAAK,MAAM,EAAE,IAAI,MAAM,EAAE;YACvB,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,EAAE,EAAE,MAAM,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;SAC/E;IACH,CAAC;IAED,gBAAgB;IAChB,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACzB,GAAG,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;SACtB,CAAC;IACJ,CAAC;IAgBD,gBAAgB;IAChB,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,mBAAmB,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;IAC5E,CAAC;IAED,gBAAgB;IAChB,MAAM;QACJ,OAAO,IAAI,CAAA,SAAS,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE,GAAG,IAAI,CAAC,OAAO,EAAE,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,SAAS,CAAC;IACrF,CAAC;IAED,gBAAgB;IAChB,oBAAoB;;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,MAAA,IAAI,CAAC,aAAa,+CAAlB,IAAI,EAAmB;IACzB,CAAC;;~~AAnGD~~,4FAA4F;AAC5E,eAAU,GAAG,UAAU,CAAC;AAExC,gFAAgF;AAChE,YAAO,GAAG,OAAO,CAAC,cAAc,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;~~AAkGlE~~,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;IAChB,aAAa,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE;IAC7C,WAAW,EAAE,IAAI;IACjB,UAAU,EAAE,QAAQ;IACpB,SAAS,EAAE,QAAQ;IACnB,EAAE,EAAE,CAAC,QAAQ,CAAC;CACf,CAAC,CAAC","sourcesContent":["import { LitElement, PropertyDeclarations, TemplateResult, html } from 'lit-element';\nimport i18next, { StringMap, TOptions } from 'i18next';\n\nimport { FetchEvent } from '../NucleonElement/FetchEvent';\nimport { Gateways } from './types';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { backend } from './backend';\nimport { format } from './format/index';\nimport { InferrableMixin } from '../../../mixins/inferrable';\n\n/*\n Custom element for effortless localization with i18next.\n \n @fires I18n#fetch - Instance of `I18n.FetchEvent`. Emitted before each translation request.\n \n @element foxy-i18n\n * @since 1.1.0\n /\nexport class I18n extends TranslatableMixin(InferrableMixin(LitElement), '') {\n /* Instances of this event are dispatched on an element before each translation request. /\n static readonly FetchEvent = FetchEvent;\n\n /* Shared [i18next](https://www.i18next.com) instance for all I18n elements. /\n static readonly i18next = i18next.createInstance().use(backend);\n\n /\n Registers a joint event listener for all i18next events that indicate\n * the availability of new translations. If you're using `I18n.i18next` to localize\n * your components, this function will call the provided handler every time an update is needed.\n \n @param handler Callback to invoke when translation changes.\n * @example const unsubscribe = I18n.onTranslationChange(triggerUpdate);\n /\n static onTranslationChange(handler: () => void): () => void {\n const i18nextEvents = ['initialized', 'loaded'] as const;\n const storeEvents = ['removed', 'added'] as const;\n\n i18nextEvents.forEach(type => I18n.i18next.on(type, handler));\n storeEvents.forEach(type => I18n.i18next.store.on(type, handler));\n\n return () => {\n i18nextEvents.forEach(type => I18n.i18next.off(type, handler));\n storeEvents.forEach(type => I18n.i18next.store.off(type, handler));\n };\n }\n\n /\n Registers a global event listener that calls `handler` every time an i18next resource\n * is downloaded by `foxy-i18n`. Allows devs to specify resource location and/or fetch it\n * via a different channel (e.g. web sockets or using a localization SaaS).\n \n @param handler Callback to invoke on resource fetch.\n * @example const unsubscribe = I18n.onResourceFetch((ns, lang) => fetch(`path/to/${ns}/${lang}`));\n /\n static onResourceFetch(handler: (ns: string, lang: string) => Promise<Response>): () => void {\n const handleFetch = (evt: unknown) => {\n if (evt instanceof FetchEvent && evt.request.url.startsWith('foxy://i18n/')) {\n const [lang, ns] = evt.request.url.split('/').reverse();\n evt.respondWith(handler(ns, lang));\n }\n };\n\n addEventListener('fetch', handleFetch);\n return () => removeEventListener('fetch', handleFetch);\n }\n\n /\n Adds payment gateway names to the i18next store. Fetch `fx:hosted_payment_gateways`\n * and `fx:payment_gateways` and call this method to make gateway names available to\n * elements like `foxy-payment-card`.\n \n @param param0 `fx:hosted_payment_gateways` or `fx:payment_gateways`\n * @example I18n.setGateways({ values: { authorize: { name: 'Authorize.Net' }}})\n /\n static setGateways({ values }: Gateways): void {\n for (const id in values) {\n this.i18next.addResource('en', 'gateways', `gateways.${id}`, values[id].name);\n }\n }\n\n /* @readonly /\n static get properties(): PropertyDeclarations {\n return {\n ...super.properties,\n options: { type: Object },\n key: { type: String },\n };\n }\n\n /\n Optional i18next translation function\n * [options](https://www.i18next.com/translation-function/essentials#overview-options).\n /\n options: TOptions<StringMap> = {};\n\n /\n Optional key to translate. Empty by default (renders nothing).\n * See [i18next docs](https://www.i18next.com/translation-function/essentials#accessing-keys) for more info.\n /\n key = '';\n\n private __unsubscribe?: () => void;\n\n /* @readonly /\n connectedCallback(): void {\n super.connectedCallback();\n this.__unsubscribe = I18n.onTranslationChange(() => this.requestUpdate());\n }\n\n /* @readonly /\n render(): TemplateResult {\n return html`<span>${this.t(this.key, { ...this.options, lng: this.lang })}</span>`;\n }\n\n /* @readonly */\n disconnectedCallback(): void {\n super.disconnectedCallback();\n this.__unsubscribe?.();\n }\n}\n\nI18n.i18next.init({\n interpolation: { format, escapeValue: false },\n fallbackLng: 'en',\n fallbackNS: 'shared',\n defaultNS: 'shared',\n ns: ['shared'],\n});\n"]}
1	+ {"version":3,"file":"I18n.js","sourceRoot":"","sources":["../../../../src/elements/public/I18n/I18n.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyDeclarations, TemplateResult, html } from 'lit-element';\nimport i18next, { StringMap, TOptions } from 'i18next';\n\nimport { FetchEvent } from '../NucleonElement/FetchEvent';\nimport { Gateways } from './types';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { backend } from './backend';\nimport { format } from './format/index';\nimport { InferrableMixin } from '../../../mixins/inferrable';\n\n/*\n Custom element for effortless localization with i18next.\n \n @fires I18n#fetch - Instance of `I18n.FetchEvent`. Emitted before each translation request.\n \n @element foxy-i18n\n * @since 1.1.0\n /\nexport class I18n extends TranslatableMixin(InferrableMixin(LitElement), '') {\n /* Instances of this event are dispatched on an element before each translation request. /\n static readonly FetchEvent = FetchEvent;\n\n /* Shared [i18next](https://www.i18next.com) instance for all I18n elements. /\n static readonly i18next = i18next.createInstance().use(backend);\n\n /\n Registers a joint event listener for all i18next events that indicate\n * the availability of new translations. If you're using `I18n.i18next` to localize\n * your components, this function will call the provided handler every time an update is needed.\n \n @param handler Callback to invoke when translation changes.\n * @example const unsubscribe = I18n.onTranslationChange(triggerUpdate);\n /\n static onTranslationChange(handler: () => void): () => void {\n const i18nextEvents = ['initialized', 'loaded'] as const;\n const storeEvents = ['removed', 'added'] as const;\n\n i18nextEvents.forEach(type => I18n.i18next.on(type, handler));\n storeEvents.forEach(type => I18n.i18next.store.on(type, handler));\n\n return () => {\n i18nextEvents.forEach(type => I18n.i18next.off(type, handler));\n storeEvents.forEach(type => I18n.i18next.store.off(type, handler));\n };\n }\n\n /\n Registers a global event listener that calls `handler` every time an i18next resource\n * is downloaded by `foxy-i18n`. Allows devs to specify resource location and/or fetch it\n * via a different channel (e.g. web sockets or using a localization SaaS).\n \n @param handler Callback to invoke on resource fetch.\n * @example const unsubscribe = I18n.onResourceFetch((ns, lang) => fetch(`path/to/${ns}/${lang}`));\n /\n static onResourceFetch(handler: (ns: string, lang: string) => Promise<Response>): () => void {\n const handleFetch = (evt: unknown) => {\n if (evt instanceof FetchEvent && evt.request.url.startsWith('foxy://i18n/')) {\n const [lang, ns] = evt.request.url.split('/').reverse();\n evt.respondWith(handler(ns, lang));\n }\n };\n\n addEventListener('fetch', handleFetch);\n return () => removeEventListener('fetch', handleFetch);\n }\n\n /\n Adds payment gateway names to the i18next store. Fetch `fx:hosted_payment_gateways`\n * and `fx:payment_gateways` and call this method to make gateway names available to\n * elements like `foxy-payment-card`.\n \n @param param0 `fx:hosted_payment_gateways` or `fx:payment_gateways`\n * @example I18n.setGateways({ values: { authorize: { name: 'Authorize.Net' }}})\n * @deprecated\n /\n static setGateways({ values }: Gateways): void {\n for (const id in values) {\n this.i18next.addResource('en', 'gateways', `gateways.${id}`, values[id].name);\n }\n }\n\n /* @readonly /\n static get properties(): PropertyDeclarations {\n return {\n ...super.properties,\n options: { type: Object },\n key: { type: String },\n };\n }\n\n /\n Optional i18next translation function\n * [options](https://www.i18next.com/translation-function/essentials#overview-options).\n /\n options: TOptions<StringMap> = {};\n\n /\n Optional key to translate. Empty by default (renders nothing).\n * See [i18next docs](https://www.i18next.com/translation-function/essentials#accessing-keys) for more info.\n /\n key = '';\n\n private __unsubscribe?: () => void;\n\n /* @readonly /\n connectedCallback(): void {\n super.connectedCallback();\n this.__unsubscribe = I18n.onTranslationChange(() => this.requestUpdate());\n }\n\n /* @readonly /\n render(): TemplateResult {\n return html`<span>${this.t(this.key, { ...this.options, lng: this.lang })}</span>`;\n }\n\n /* @readonly */\n disconnectedCallback(): void {\n super.disconnectedCallback();\n this.__unsubscribe?.();\n }\n}\n\nI18n.i18next.init({\n interpolation: { format, escapeValue: false },\n fallbackLng: 'en',\n fallbackNS: 'shared',\n defaultNS: 'shared',\n ns: ['shared'],\n});\n"]}

package/dist/elements/public/ItemCard/ItemCard.d.ts CHANGED Viewed

@@ -40,5 +40,7 @@ export declare class ItemCard extends Base<Data> {
     private get __cart();
     private get __currencyDisplay();
     private get __currencyCode();
+    private get __subinfoOptions();
+    private get __subinfoKey();
 }
 export {};

package/dist/elements/public/ItemCard/ItemCard.js CHANGED Viewed

@@ -1,5 +1,6 @@
 import { TranslatableMixin } from "../../../mixins/translatable.js";
 import { ConfigurableMixin } from "../../../mixins/configurable.js";
+import { parseFrequency } from "../../../utils/parse-frequency.js";
 import { InternalCard } from "../../internal/InternalCard/InternalCard.js";
 import { ifDefined } from 'lit-html/directives/if-defined';
 import { html } from 'lit-html';
@@ -30,13 +31,12 @@ export class ItemCard extends Base {
         };
     }
     renderBody() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
         const quantity = (_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a.quantity) !== null && _b !== void 0 ? _b : 0;
         const options = (_d = (_c = this.data) === null || _c === void 0 ? void 0 : _c._embedded) === null || _d === void 0 ? void 0 : _d['fx:item_options'];
         const price = (_f = (_e = this.data) === null || _e === void 0 ? void 0 : _e.price) !== null && _f !== void 0 ? _f : 0;
         const currencyDisplay = this.__currencyDisplay;
         const currencyCode = this.__currencyCode;
-        const totalPrice = quantity * price;
         return html `
       <foxy-nucleon
         class="hidden"
@@ -106,7 +106,7 @@ export class ItemCard extends Base {
         style="gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)"
       >
         <img
-          class="relative h-s w-s object-cover rounded-full bg-contrast-20 flex-shrink-0 shadow-xs"
+          class="relative h-s w-s object-cover rounded-s bg-contrast-20 flex-shrink-0 shadow-xs"
           src=${ifDefined((_g = this.data) === null || _g === void 0 ? void 0 : _g.image)}
           alt=""
           @error=${(evt) => {
@@ -116,69 +116,57 @@ export class ItemCard extends Base {
         />
         <div class="flex-1 min-w-0">
-          <div class="flex-1 h-s flex items-center">
-            <div class="flex-1 min-w-0">
-              <div class="font-medium text-m truncate">${(_h = this.data) === null || _h === void 0 ? void 0 : _h.name}</div>
-              <div class="text-tertiary text-s truncate">
-                ${quantity} &times;
-                <foxy-i18n
-                  options=${JSON.stringify({
-            amount: `${price} ${currencyCode}`,
-            currencyDisplay,
-        })}
-                  key="price"
-                  infer=""
-                >
-                </foxy-i18n>
-                &equals;
-                <foxy-i18n
-                  options=${JSON.stringify({
-            amount: `${totalPrice} ${currencyCode}`,
-            currencyDisplay,
-        })}
-                  key="price"
-                  infer=""
-                >
-                </foxy-i18n>
+          <div class="h-s flex items-center">
+            <div class="min-w-0 flex-1 leading-s">
+              <div class="flex items-center justify-between">
+                <div class="truncate text-m font-medium">${(_h = this.data) === null || _h === void 0 ? void 0 : _h.name}</div>
+                <span class="text-s text-tertiary whitespace-nowrap">
+                  ${quantity} &times;
+                  <foxy-i18n
+                    .options=${{ amount: `${price} ${currencyCode}`, currencyDisplay }}
+                    key="price"
+                    infer=""
+                  >
+                  </foxy-i18n>
+                </span>
               </div>
-            </div>
-            ${((_j = this.data) === null || _j === void 0 ? void 0 : _j.subscription_frequency) &&
+              <div class="truncate text-secondary text-s">
+                ${(_j = this.data) === null || _j === void 0 ? void 0 : _j.code}
+                ${((_k = this.data) === null || _k === void 0 ? void 0 : _k.subscription_frequency) &&
             !this.hiddenSelector.matches('autorenew-icon', true)
             ? html `
-                  <div
-                    class="w-xs h-xs flex items-center justify-center rounded-full bg-contrast-5"
-                  >
-                    <iron-icon icon="icons:autorenew" class="icon-inline text-s"></iron-icon>
-                  </div>
-                `
+                      <span> &bull; </span>
+                      <foxy-i18n
+                        infer=""
+                        key=${this.__subinfoKey}
+                        .options=${this.__subinfoOptions}
+                      >
+                      </foxy-i18n>
+                    `
             : ''}
+                &ZeroWidthSpace;
+              </div>
+            </div>
           </div>
           ${options && options.length > 0
             ? html `
-                <div class="mt-s">
+                <div class="mt-m">
                   ${options.map(option => html `
-                      <div
-                        data-testclass="option"
-                        class="flex items-center text-s space-x-xs leading-m"
-                      >
-                        <div class="flex-1 text-tertiary truncate">
-                          ${option.name}: ${option.value}
+                      <div data-testclass="option" class="flex items-center gap-s text-s leading-s">
+                        <div class="truncate text-secondary">
+                          ${option.name}: <span class="font-medium text-body">${option.value}</span>
                         </div>
                         ${option.price_mod
                 ? html `
-                              <div
-                                class="${option.price_mod > 0
-                    ? 'text-success'
-                    : 'text-error'} rounded px-xs truncate"
-                              >
+                              <div class="border-t border-dashed border-contrast-10 flex-1"></div>
+                              <div class="whitespace-nowrap text-tertiary">
                                 <foxy-i18n
                                   options=${JSON.stringify({
                     amount: `${option.price_mod} ${currencyCode}`,
+                    signDisplay: 'exceptZero',
                     currencyDisplay: currencyDisplay,
                 })}
                                   key="price"
@@ -187,18 +175,6 @@ export class ItemCard extends Base {
                                 </foxy-i18n>
                               </div>
                             `
-                : ''}
-                        ${option.weight_mod
-                ? html `
-                              <div
-                                class="${option.price_mod > 0
-                    ? 'text-success'
-                    : 'text-error'} rounded px-xs truncate"
-                              >
-                                ${option.weight_mod}
-                                <foxy-i18n key="wgt" infer=""></foxy-i18n>
-                              </div>
-                            `
                 : ''}
                       </div>
                     `)}
@@ -331,6 +307,36 @@ export class ItemCard extends Base {
             }
         }
     }
+    get __subinfoOptions() {
+        var _a, _b, _c;
+        const currencyDisplay = this.__currencyDisplay;
+        if (currencyDisplay === undefined)
+            return;
+        const currencyCode = this.__currencyCode;
+        if (currencyCode === undefined)
+            return;
+        const totalOrder = (_a = this.__transactionTemplate) === null || _a === void 0 ? void 0 : _a.total_order;
+        if (totalOrder === undefined)
+            return;
+        const frequency = (_b = this.data) === null || _b === void 0 ? void 0 : _b.subscription_frequency;
+        if (frequency === undefined)
+            return;
+        const startDate = (_c = this.data) === null || _c === void 0 ? void 0 : _c.subscription_start_date;
+        if (startDate === undefined)
+            return;
+        return {
+            ...parseFrequency(frequency),
+            amount: `${totalOrder} ${currencyCode}`,
+            currencyDisplay,
+            startDate,
+        };
+    }
+    get __subinfoKey() {
+        var _a;
+        const frequency = (_a = this.data) === null || _a === void 0 ? void 0 : _a.subscription_frequency;
+        if (frequency)
+            return `subinfo_${frequency === '.5m' ? 'twice_a_month' : 'recurring'}`;
+    }
 }
 ItemCard.__placeholder = 'data:image/svg+xml,%3Csvg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Crect width="40" height="40" fill="%23E8E8E8"/%3E%3Cpath d="M31.5143 0H24.5476L0 24.5476V31.5143L11.7046 19.8097L11.9841 17.0782C12.0983 15.9624 13.0131 15.1154 14.1038 15.1154H15.7373V12.1923C15.7373 10.9815 16.6915 10 17.8687 10H21.5143L31.5143 0Z" fill="white"/%3E%3Cpath d="M11.5434 21.3852L0 32.9285V39.8953L11.5822 28.3131C11.172 27.8663 10.9438 27.2444 11.012 26.5782L11.5434 21.3852Z" fill="white"/%3E%3Cpath d="M12.4305 28.879L1.30951 40H8.27631L19.2763 29H13.1316C12.8853 29 12.6495 28.9573 12.4305 28.879Z" fill="white"/%3E%3Cpath d="M28.3113 19.965L28.0159 17.0782C27.9116 16.0591 27.1395 15.2642 26.1754 15.1341L40 1.3095V8.27627L28.3113 19.965Z" fill="white"/%3E%3Cpath d="M20.6905 29L9.69049 40H16.6572L27.9755 28.6817C27.6541 28.8832 27.2756 29 26.8684 29H20.6905Z" fill="white"/%3E%3Cpath d="M28.6572 28C28.9128 27.5952 29.0415 27.1003 28.988 26.5782L28.4426 21.2479L40 9.69053V16.6572L28.6572 28Z" fill="white"/%3E%3Cpath d="M25.0381 40H18.0715L40 18.0715V25.0381L25.0381 40Z" fill="white"/%3E%3Cpath d="M26.4524 40H33.4191L40 33.4191V26.4524L26.4524 40Z" fill="white"/%3E%3Cpath d="M40 40H34.8333L40 34.8333V40Z" fill="white"/%3E%3Cpath d="M16.1666 0H23.1334L0 23.1334V16.1666L16.1666 0Z" fill="white"/%3E%3Cpath d="M14.7524 0H7.78571L0 7.78573V14.7524L14.7524 0Z" fill="white"/%3E%3Cpath d="M0 0H6.37152L0 6.37151V0Z" fill="white"/%3E%3Cpath d="M21.467 11.4615H17.8687C17.4763 11.4615 17.1582 11.7887 17.1582 12.1923V15.1154H22.8418V12.1923C22.8418 11.7887 22.5237 11.4615 22.1313 11.4615H21.467Z" fill="white"/%3E%3Cpath d="M24.7798 15.1154H24.2627V12.1923C24.2627 11.227 23.6562 10.4075 22.8138 10.1148L32.9286 0H39.89L24.7798 15.1154Z" fill="white"/%3E%3C/svg%3E';
 //# sourceMappingURL=ItemCard.js.map