@mj-biz-apps/orders-ng 5.1.0 → 5.2.0

package/dist/lib/checkout-widget/checkout-widget.component.js

@@ -0,0 +1,873 @@
+/**
+ * @fileoverview Generic Adaptive Checkout Widget Component
+ *
+ * Provides a responsive, embeddable checkout surface for single-item, multi-unit
+ * extended products, zero-dollar registrations, and custom domain extensions
+ * with dynamic metadata-driven field generation, customUI JSON configuration,
+ * CSS theming, and custom JS lifecycle hooks.
+ *
+ * @module @mj-biz-apps/orders-angular/checkout-widget
+ */
+import { Component, Input, Output, EventEmitter, signal, computed, ChangeDetectionStrategy } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+const _forTrack0 = ($index, $item) => $item.name;
+const _forTrack1 = ($index, $item) => $item.value;
+function MJCheckoutWidgetComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 3);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r0.config == null ? null : ctx_r0.config.description);
+} }
+function MJCheckoutWidgetComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 4)(1, "span", 18);
+    i0.ɵɵtext(2, "\u26A0\uFE0F");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "span");
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(ctx_r0.displayErrorMessage());
+} }
+function MJCheckoutWidgetComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 9);
+    i0.ɵɵtext(1, "FREE");
+    i0.ɵɵelementEnd();
+} }
+function MJCheckoutWidgetComponent_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 11);
+    i0.ɵɵtext(1, "$0.00");
+    i0.ɵɵelementEnd();
+} }
+function MJCheckoutWidgetComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 12);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate2("", ctx_r0.currencySymbol(), "", ((ctx_r0.config == null ? null : ctx_r0.config.unitPrice) || 0).toFixed(2));
+} }
+function MJCheckoutWidgetComponent_Conditional_15_Template(rf, ctx) { if (rf & 1) {
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 13)(1, "label", 19);
+    i0.ɵɵtext(2, "Quantity");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 20)(4, "button", 21);
+    i0.ɵɵlistener("click", function MJCheckoutWidgetComponent_Conditional_15_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onQuantityChange(ctx_r0.quantity() - 1)); });
+    i0.ɵɵtext(5, "-");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "input", 22);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_15_Template_input_ngModelChange_6_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onQuantityChange($event)); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "button", 21);
+    i0.ɵɵlistener("click", function MJCheckoutWidgetComponent_Conditional_15_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onQuantityChange(ctx_r0.quantity() + 1)); });
+    i0.ɵɵtext(8, "+");
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("disabled", ctx_r0.quantity() <= 1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngModel", ctx_r0.quantity())("max", (ctx_r0.config == null ? null : ctx_r0.config.maxQuantity) || 50);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("disabled", ctx_r0.quantity() >= ((ctx_r0.config == null ? null : ctx_r0.config.maxQuantity) || 50));
+} }
+function MJCheckoutWidgetComponent_Conditional_17_For_4_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 28);
+    i0.ɵɵtext(1, "*");
+    i0.ɵɵelementEnd();
+} }
+function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_4_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "textarea", 35);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_4_Template_textarea_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r3); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
+    i0.ɵɵtext(1, "                                ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_12_0;
+    const field_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("ngModel", (tmp_12_0 = ctx_r0.units()[0]) == null ? null : tmp_12_0[field_r4.name])("placeholder", field_r4.placeholder || "")("required", field_r4.required || false);
+} }
+function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_For_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "option", 37);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const opt_r6 = ctx.$implicit;
+    i0.ɵɵproperty("ngValue", opt_r6.value);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(opt_r6.label);
+} }
+function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "select", 36);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_Template_select_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r5); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
+    i0.ɵɵelementStart(1, "option", 37);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵrepeaterCreate(3, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_For_4_Template, 2, 2, "option", 37, _forTrack1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_12_0;
+    const field_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("ngModel", (tmp_12_0 = ctx_r0.units()[0]) == null ? null : tmp_12_0[field_r4.name])("required", field_r4.required || false);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngValue", "");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1("Select ", field_r4.label);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(field_r4.options);
+} }
+function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_6_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "label", 31)(1, "input", 38);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_6_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r7); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    let tmp_12_0;
+    const field_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngModel", (tmp_12_0 = ctx_r0.units()[0]) == null ? null : tmp_12_0[field_r4.name]);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(field_r4.label);
+} }
+function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_7_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "input", 39);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_7_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r8); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_12_0;
+    const field_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("ngModel", (tmp_12_0 = ctx_r0.units()[0]) == null ? null : tmp_12_0[field_r4.name])("placeholder", field_r4.placeholder || "")("required", field_r4.required || false);
+} }
+function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_8_Template(rf, ctx) { if (rf & 1) {
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "input", 40);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_8_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r9); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_12_0;
+    const field_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("ngModel", (tmp_12_0 = ctx_r0.units()[0]) == null ? null : tmp_12_0[field_r4.name])("required", field_r4.required || false);
+} }
+function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_9_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "input", 41);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_9_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r10); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_13_0;
+    const field_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("type", field_r4.name.toLowerCase().includes("email") ? "email" : "text")("ngModel", (tmp_13_0 = ctx_r0.units()[0]) == null ? null : tmp_13_0[field_r4.name])("placeholder", field_r4.placeholder || "")("required", field_r4.required || false);
+} }
+function MJCheckoutWidgetComponent_Conditional_17_For_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 26)(1, "label", 27);
+    i0.ɵɵtext(2);
+    i0.ɵɵconditionalCreate(3, MJCheckoutWidgetComponent_Conditional_17_For_4_Conditional_3_Template, 2, 0, "span", 28);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(4, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_4_Template, 2, 3, "textarea", 29)(5, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_Template, 5, 4, "select", 30)(6, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_6_Template, 4, 2, "label", 31)(7, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_7_Template, 1, 3, "input", 32)(8, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_8_Template, 1, 2, "input", 33)(9, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_9_Template, 1, 4, "input", 34);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_14_0;
+    const field_r4 = ctx.$implicit;
+    i0.ɵɵclassProp("full-width", field_r4.type === "textarea" || field_r4.name === "email" || field_r4.name === "Email");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", field_r4.label, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(field_r4.required ? 3 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional((tmp_14_0 = field_r4.type) === "textarea" ? 4 : tmp_14_0 === "select" ? 5 : tmp_14_0 === "boolean" ? 6 : tmp_14_0 === "number" ? 7 : tmp_14_0 === "date" ? 8 : 9);
+} }
+function MJCheckoutWidgetComponent_Conditional_17_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "h3", 23);
+    i0.ɵɵtext(1, "Details");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "div", 24);
+    i0.ɵɵrepeaterCreate(3, MJCheckoutWidgetComponent_Conditional_17_For_4_Template, 10, 5, "div", 25, _forTrack0);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(3);
+    i0.ɵɵrepeater(ctx_r0.activeFieldDefs());
+} }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 28);
+    i0.ɵɵtext(1, "*");
+    i0.ɵɵelementEnd();
+} }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_4_Template(rf, ctx) { if (rf & 1) {
+    const _r12 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "textarea", 35);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_4_Template_textarea_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
+    i0.ɵɵtext(1, "                                            ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r14 = i0.ɵɵnextContext().$implicit;
+    const unit_r16 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("ngModel", unit_r16[field_r14.name])("placeholder", field_r14.placeholder || "")("required", field_r14.required || false);
+} }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_For_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "option", 37);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const opt_r18 = ctx.$implicit;
+    i0.ɵɵproperty("ngValue", opt_r18.value);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(opt_r18.label);
+} }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_Template(rf, ctx) { if (rf & 1) {
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "select", 36);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_Template_select_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
+    i0.ɵɵelementStart(1, "option", 37);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵrepeaterCreate(3, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_For_4_Template, 2, 2, "option", 37, _forTrack1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r14 = i0.ɵɵnextContext().$implicit;
+    const unit_r16 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("ngModel", unit_r16[field_r14.name])("required", field_r14.required || false);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngValue", "");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1("Select ", field_r14.label);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(field_r14.options);
+} }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_6_Template(rf, ctx) { if (rf & 1) {
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "label", 31)(1, "input", 38);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_6_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const field_r14 = i0.ɵɵnextContext().$implicit;
+    const unit_r16 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngModel", unit_r16[field_r14.name]);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(field_r14.label);
+} }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_7_Template(rf, ctx) { if (rf & 1) {
+    const _r20 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "input", 39);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_7_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r14 = i0.ɵɵnextContext().$implicit;
+    const unit_r16 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("ngModel", unit_r16[field_r14.name])("placeholder", field_r14.placeholder || "")("required", field_r14.required || false);
+} }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_8_Template(rf, ctx) { if (rf & 1) {
+    const _r21 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "input", 40);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_8_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r21); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r14 = i0.ɵɵnextContext().$implicit;
+    const unit_r16 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("ngModel", unit_r16[field_r14.name])("required", field_r14.required || false);
+} }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_9_Template(rf, ctx) { if (rf & 1) {
+    const _r22 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "input", 41);
+    i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_9_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r14 = i0.ɵɵnextContext().$implicit;
+    const unit_r16 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("type", field_r14.name.toLowerCase().includes("email") ? "email" : "text")("ngModel", unit_r16[field_r14.name])("placeholder", field_r14.placeholder || "")("required", field_r14.required || false);
+} }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 26)(1, "label", 27);
+    i0.ɵɵtext(2);
+    i0.ɵɵconditionalCreate(3, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Conditional_3_Template, 2, 0, "span", 28);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(4, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_4_Template, 2, 3, "textarea", 29)(5, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_Template, 5, 4, "select", 30)(6, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_6_Template, 4, 2, "label", 31)(7, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_7_Template, 1, 3, "input", 32)(8, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_8_Template, 1, 2, "input", 33)(9, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_9_Template, 1, 4, "input", 34);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_24_0;
+    const field_r14 = ctx.$implicit;
+    i0.ɵɵclassProp("full-width", field_r14.type === "textarea" || field_r14.name === "email" || field_r14.name === "Email");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", field_r14.label, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(field_r14.required ? 3 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional((tmp_24_0 = field_r14.type) === "textarea" ? 4 : tmp_24_0 === "select" ? 5 : tmp_24_0 === "boolean" ? 6 : tmp_24_0 === "number" ? 7 : tmp_24_0 === "date" ? 8 : 9);
+} }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 45)(1, "div", 46);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 24);
+    i0.ɵɵrepeaterCreate(4, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Template, 10, 5, "div", 25, _forTrack0);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const $index_r23 = ctx.$index;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1("Item ", $index_r23 + 1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵrepeater(ctx_r0.activeFieldDefs());
+} }
+function MJCheckoutWidgetComponent_Conditional_18_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 42)(1, "h3", 23);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "button", 43);
+    i0.ɵɵlistener("click", function MJCheckoutWidgetComponent_Conditional_18_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r11); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.copyPrimaryToAll()); });
+    i0.ɵɵtext(4, "Copy Primary Info to All");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(5, "div", 44);
+    i0.ɵɵrepeaterCreate(6, MJCheckoutWidgetComponent_Conditional_18_For_7_Template, 6, 1, "div", 45, i0.ɵɵrepeaterTrackByIndex);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1("Item Details (", ctx_r0.quantity(), ")");
+    i0.ɵɵadvance(4);
+    i0.ɵɵrepeater(ctx_r0.units());
+} }
+function MJCheckoutWidgetComponent_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "section", 47)(1, "h3", 23);
+    i0.ɵɵtext(2, "Payment");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 48);
+    i0.ɵɵelement(4, "div", 49);
+    i0.ɵɵelementStart(5, "div", 50)(6, "span", 51);
+    i0.ɵɵtext(7, "\uD83D\uDD12");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "span");
+    i0.ɵɵtext(9, "Secured by Stripe \u2022 PCI-DSS Level 1 Certified \u2022 End-to-end Encrypted");
+    i0.ɵɵelementEnd()()()();
+    i0.ɵɵelementStart(10, "div", 52)(11, "span", 53);
+    i0.ɵɵtext(12, "Total Due");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(13, "span", 54);
+    i0.ɵɵtext(14);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(14);
+    i0.ɵɵtextInterpolate2("", ctx_r0.currencySymbol(), "", ctx_r0.totalGross().toFixed(2));
+} }
+function MJCheckoutWidgetComponent_Conditional_22_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "span", 55);
+    i0.ɵɵelementStart(1, "span");
+    i0.ɵɵtext(2, "Processing...");
+    i0.ɵɵelementEnd();
+} }
+function MJCheckoutWidgetComponent_Conditional_23_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span");
+    i0.ɵɵtext(1, "Complete Free Registration");
+    i0.ɵɵelementEnd();
+} }
+function MJCheckoutWidgetComponent_Conditional_24_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span");
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate2("Pay ", ctx_r0.currencySymbol(), "", ctx_r0.totalGross().toFixed(2));
+} }
+export class MJCheckoutWidgetComponent {
+    el;
+    renderer;
+    widgetInstanceId = 'mj-cw-' + (typeof crypto !== 'undefined' && crypto.randomUUID ? crypto.randomUUID().slice(0, 8) : Math.random().toString(36).slice(2, 9));
+    _fallbackSessionKey = typeof crypto !== 'undefined' && crypto.randomUUID ? crypto.randomUUID() : 'ck_sess_' + Math.random().toString(36).substring(2, 15);
+    _config = signal(null, ...(ngDevMode ? [{ debugName: "_config" }] : []));
+    _lastMountedJS = null;
+    _customStyleEl = null;
+    constructor(el, renderer) {
+        this.el = el;
+        this.renderer = renderer;
+    }
+    set config(val) {
+        this._config.set(val);
+        this.syncUnits();
+    }
+    get config() {
+        return this._config();
+    }
+    distributionSlug = '';
+    sessionKey = '';
+    isProcessing = false;
+    _errorMessage = signal(null, ...(ngDevMode ? [{ debugName: "_errorMessage" }] : []));
+    set errorMessage(val) {
+        this._errorMessage.set(val);
+    }
+    get errorMessage() {
+        return this._errorMessage();
+    }
+    isPaymentReady = false;
+    stripePaymentMethodId = null;
+    submitted = new EventEmitter();
+    cancelled = new EventEmitter();
+    // Internal error message for client-side validation failures
+    internalErrorMessage = signal(null, ...(ngDevMode ? [{ debugName: "internalErrorMessage" }] : []));
+    displayErrorMessage = computed(() => this._errorMessage() || this.internalErrorMessage(), ...(ngDevMode ? [{ debugName: "displayErrorMessage" }] : []));
+    // Form state signals
+    email = signal('', ...(ngDevMode ? [{ debugName: "email" }] : []));
+    firstName = signal('', ...(ngDevMode ? [{ debugName: "firstName" }] : []));
+    lastName = signal('', ...(ngDevMode ? [{ debugName: "lastName" }] : []));
+    company = signal('', ...(ngDevMode ? [{ debugName: "company" }] : []));
+    title = signal('', ...(ngDevMode ? [{ debugName: "title" }] : []));
+    quantity = signal(1, ...(ngDevMode ? [{ debugName: "quantity" }] : []));
+    // Generic units array holding field maps for each unit
+    units = signal([], ...(ngDevMode ? [{ debugName: "units" }] : []));
+    // Backward-compatibility signal for legacy attendees
+    attendees = computed(() => {
+        return this.units().map(u => ({
+            firstName: String(u['firstName'] || u['FirstName'] || ''),
+            lastName: String(u['lastName'] || u['LastName'] || ''),
+            email: String(u['email'] || u['Email'] || ''),
+            company: u['company'] ? String(u['company']) : (u['Company'] ? String(u['Company']) : undefined),
+            title: u['title'] ? String(u['title']) : (u['Title'] ? String(u['Title']) : undefined),
+            ...u
+        }));
+    }, ...(ngDevMode ? [{ debugName: "attendees" }] : []));
+    // Unified customUI computed values
+    activeCSS = computed(() => {
+        const cfg = this._config();
+        return cfg?.customUI?.css || cfg?.customCSS || '';
+    }, ...(ngDevMode ? [{ debugName: "activeCSS" }] : []));
+    activeJS = computed(() => {
+        const cfg = this._config();
+        return cfg?.customUI?.js || cfg?.customJS || '';
+    }, ...(ngDevMode ? [{ debugName: "activeJS" }] : []));
+    activeTheme = computed(() => {
+        const cfg = this._config();
+        return cfg?.customUI?.theme || cfg?.theme || null;
+    }, ...(ngDevMode ? [{ debugName: "activeTheme" }] : []));
+    activeComponentOverrideKey = computed(() => {
+        const cfg = this._config();
+        return cfg?.customUI?.componentOverrideKey || null;
+    }, ...(ngDevMode ? [{ debugName: "activeComponentOverrideKey" }] : []));
+    // Active field definitions
+    activeFieldDefs = computed(() => {
+        const customFields = this._config()?.extensionFields;
+        if (customFields && Array.isArray(customFields) && customFields.length > 0) {
+            return customFields;
+        }
+        // Default standard attendee fields
+        return [
+            { name: 'firstName', label: 'First Name', type: 'text', required: true, placeholder: 'Jane' },
+            { name: 'lastName', label: 'Last Name', type: 'text', required: true, placeholder: 'Doe' },
+            { name: 'email', label: 'Email Address', type: 'text', required: true, placeholder: 'jane.doe@example.com' },
+            { name: 'company', label: 'Company / Organization', type: 'text', required: false, placeholder: 'Acme Corp' },
+            { name: 'title', label: 'Job Title', type: 'text', required: false, placeholder: 'Director' }
+        ];
+    }, ...(ngDevMode ? [{ debugName: "activeFieldDefs" }] : []));
+    // Computed properties
+    isFree = computed(() => (this._config()?.unitPrice ?? 0) <= 0, ...(ngDevMode ? [{ debugName: "isFree" }] : []));
+    isPerUnit = computed(() => {
+        const cfg = this._config();
+        return cfg?.unitMode === 'perUnit' || Boolean(cfg?.isEvent);
+    }, ...(ngDevMode ? [{ debugName: "isPerUnit" }] : []));
+    isSingleUnit = computed(() => !this.isPerUnit() || this.quantity() === 1, ...(ngDevMode ? [{ debugName: "isSingleUnit" }] : []));
+    isMultiUnit = computed(() => this.isPerUnit() && this.quantity() > 1, ...(ngDevMode ? [{ debugName: "isMultiUnit" }] : []));
+    subtotal = computed(() => {
+        const price = this._config()?.unitPrice ?? 0;
+        return price * this.quantity();
+    }, ...(ngDevMode ? [{ debugName: "subtotal" }] : []));
+    totalGross = computed(() => this.subtotal(), ...(ngDevMode ? [{ debugName: "totalGross" }] : []));
+    currencySymbol = computed(() => {
+        const c = this._config()?.currency?.toUpperCase() ?? 'USD';
+        switch (c) {
+            case 'EUR': return '€';
+            case 'GBP': return '£';
+            default: return '$';
+        }
+    }, ...(ngDevMode ? [{ debugName: "currencySymbol" }] : []));
+    ngOnInit() {
+        this.syncUnits();
+        this.applyCustomCSS(this.activeCSS());
+        if (this.activeJS() && this.activeJS() !== this._lastMountedJS) {
+            this.mountCustomJS(this.activeJS());
+        }
+        this.executeLifecycleHook('onInit', {
+            config: this.config,
+            distributionSlug: this.distributionSlug
+        });
+    }
+    ngOnChanges(changes) {
+        if (changes['config']) {
+            this.syncUnits();
+            this.applyCustomCSS(this.activeCSS());
+            if (this.activeJS() && this.activeJS() !== this._lastMountedJS) {
+                this.mountCustomJS(this.activeJS());
+            }
+        }
+    }
+    ngOnDestroy() {
+        this.executeLifecycleHook('onDestroy', { component: this });
+        if (this._customStyleEl && this._customStyleEl.parentNode) {
+            this._customStyleEl.parentNode.removeChild(this._customStyleEl);
+            this._customStyleEl = null;
+        }
+    }
+    applyCustomCSS(cssContent) {
+        if (typeof document === 'undefined')
+            return;
+        if (!cssContent) {
+            if (this._customStyleEl && this._customStyleEl.parentNode) {
+                this._customStyleEl.parentNode.removeChild(this._customStyleEl);
+                this._customStyleEl = null;
+            }
+            return;
+        }
+        const styleId = `mj-checkout-custom-css-${this.widgetInstanceId}`;
+        const nonce = this.readCspNonce();
+        if (!this._customStyleEl) {
+            if (this.renderer && this.el) {
+                this._customStyleEl = this.renderer.createElement('style');
+                this.renderer.setAttribute(this._customStyleEl, 'type', 'text/css');
+                this.renderer.setAttribute(this._customStyleEl, 'id', styleId);
+                if (nonce) {
+                    this.renderer.setAttribute(this._customStyleEl, 'nonce', nonce);
+                }
+                this.renderer.appendChild(this.el.nativeElement, this._customStyleEl);
+            }
+            else {
+                this._customStyleEl = document.createElement('style');
+                this._customStyleEl.type = 'text/css';
+                this._customStyleEl.id = styleId;
+                if (nonce) {
+                    this._customStyleEl.setAttribute('nonce', nonce);
+                }
+                document.head.appendChild(this._customStyleEl);
+            }
+        }
+        if (this._customStyleEl) {
+            this._customStyleEl.textContent = cssContent;
+        }
+    }
+    readCspNonce() {
+        if (typeof document === 'undefined') {
+            return '';
+        }
+        const host = this.el?.nativeElement?.closest?.('mj-orders-checkout');
+        const fromHost = host?.getAttribute('csp-nonce');
+        if (fromHost) {
+            return fromHost;
+        }
+        const tagged = document.querySelector('script[nonce], style[nonce]');
+        return tagged?.nonce || tagged?.getAttribute('nonce') || '';
+    }
+    mountCustomJS(scriptContent) {
+        if (!scriptContent || typeof window === 'undefined')
+            return;
+        this._lastMountedJS = scriptContent;
+        try {
+            const runner = new Function('widgetContext', scriptContent);
+            runner({ component: this, config: this.config });
+        }
+        catch (err) {
+            console.warn('[MJCheckoutWidget] CustomJS evaluation notice:', err);
+            this.internalErrorMessage.set('Notice: Custom widget scripts could not be evaluated under current security policy.');
+        }
+    }
+    executeLifecycleHook(hookName, payload) {
+        if (typeof window === 'undefined')
+            return undefined;
+        try {
+            if (window.MJCheckoutHooks && typeof window.MJCheckoutHooks[hookName] === 'function') {
+                return window.MJCheckoutHooks[hookName](payload, { component: this, config: this.config });
+            }
+        }
+        catch (err) {
+            console.warn(`[MJCheckoutWidget] Hook error in ${hookName}:`, err);
+            if (hookName === 'onValidate') {
+                // Fail closed on validation errors
+                return 'Validation hook encountered an internal error.';
+            }
+        }
+        return undefined;
+    }
+    onQuantityChange(newQty) {
+        const clamped = Math.max(1, Math.min(newQty, this.config?.maxQuantity ?? 50));
+        this.quantity.set(clamped);
+        this.syncUnits();
+        this.executeLifecycleHook('onQuantityChange', { quantity: clamped });
+    }
+    syncUnits() {
+        const currentQty = this.quantity();
+        const currentUnits = this.units();
+        const updated = [];
+        const fields = this.activeFieldDefs();
+        for (let i = 0; i < currentQty; i++) {
+            if (i === 0) {
+                const primary = currentUnits[0] || {};
+                const unit0 = { ...primary };
+                for (const field of fields) {
+                    if (unit0[field.name] === undefined) {
+                        unit0[field.name] = field.defaultValue ?? '';
+                    }
+                }
+                if (this.firstName())
+                    unit0['firstName'] = this.firstName();
+                if (this.lastName())
+                    unit0['lastName'] = this.lastName();
+                if (this.email())
+                    unit0['email'] = this.email();
+                if (this.company())
+                    unit0['company'] = this.company();
+                if (this.title())
+                    unit0['title'] = this.title();
+                updated.push(unit0);
+            }
+            else if (currentUnits[i]) {
+                updated.push({ ...currentUnits[i] });
+            }
+            else {
+                const initial = {};
+                for (const field of fields) {
+                    initial[field.name] = field.defaultValue ?? '';
+                }
+                if (this.company()) {
+                    initial['company'] = this.company();
+                }
+                updated.push(initial);
+            }
+        }
+        this.units.set(updated);
+    }
+    updateUnitField(index, fieldName, value) {
+        const list = [...this.units()];
+        if (list[index]) {
+            list[index] = { ...list[index], [fieldName]: value };
+            if (index === 0) {
+                if (fieldName === 'firstName')
+                    this.firstName.set(String(value ?? ''));
+                if (fieldName === 'lastName')
+                    this.lastName.set(String(value ?? ''));
+                if (fieldName === 'email')
+                    this.email.set(String(value ?? ''));
+                if (fieldName === 'company')
+                    this.company.set(String(value ?? ''));
+                if (fieldName === 'title')
+                    this.title.set(String(value ?? ''));
+            }
+            this.units.set(list);
+        }
+    }
+    updateAttendee(index, field, value) {
+        this.updateUnitField(index, field, value);
+    }
+    copyPrimaryToAll() {
+        const primary = this.units()[0];
+        if (!primary)
+            return;
+        const list = this.units().map((unit, i) => {
+            if (i === 0)
+                return unit;
+            const copied = { ...unit };
+            for (const [key, val] of Object.entries(primary)) {
+                if (key !== 'firstName' && key !== 'lastName' && key !== 'email' && key !== 'FirstName' && key !== 'LastName' && key !== 'Email') {
+                    copied[key] = val;
+                }
+            }
+            return copied;
+        });
+        this.units.set(list);
+    }
+    isFormValid() {
+        const currentUnits = this.units();
+        const fields = this.activeFieldDefs();
+        if (!currentUnits || currentUnits.length === 0) {
+            const em = this.email().trim();
+            const fn = this.firstName().trim();
+            const ln = this.lastName().trim();
+            if (!em || !em.includes('@') || !fn || !ln)
+                return false;
+            if (!this.isFree() && !this.isPaymentReady)
+                return false;
+            return true;
+        }
+        const unitsToValidate = this.isPerUnit() ? currentUnits : currentUnits.slice(0, 1);
+        for (let i = 0; i < unitsToValidate.length; i++) {
+            const unit = unitsToValidate[i];
+            for (const field of fields) {
+                let val = unit[field.name];
+                if (i === 0) {
+                    if (field.name === 'firstName' && this.firstName())
+                        val = this.firstName();
+                    if (field.name === 'lastName' && this.lastName())
+                        val = this.lastName();
+                    if (field.name === 'email' && this.email())
+                        val = this.email();
+                    if (field.name === 'company' && this.company())
+                        val = this.company();
+                    if (field.name === 'title' && this.title())
+                        val = this.title();
+                }
+                if (field.required) {
+                    if (val === undefined || val === null || String(val).trim() === '') {
+                        return false;
+                    }
+                }
+                if (field.name.toLowerCase().includes('email')) {
+                    const emVal = String(val || '').trim();
+                    if (field.required && (!emVal || !emVal.includes('@'))) {
+                        return false;
+                    }
+                    if (emVal && !emVal.includes('@')) {
+                        return false;
+                    }
+                }
+            }
+        }
+        if (!this.isFree() && !this.isPaymentReady) {
+            return false;
+        }
+        return true;
+    }
+    handleSubmit() {
+        if (!this.isFormValid() || this.isProcessing)
+            return;
+        this.internalErrorMessage.set(null);
+        const currentUnits = this.units();
+        const isPerUnit = this.isPerUnit();
+        const finalSessionKey = this.sessionKey || this._fallbackSessionKey;
+        const submission = {
+            email: String(currentUnits[0]?.['email'] || this.email()).trim().toLowerCase(),
+            quantity: this.quantity(),
+            attendees: isPerUnit ? this.attendees() : [],
+            extensionData: {
+                entityName: this.config?.extensionEntityName,
+                fields: currentUnits[0] || {},
+                units: isPerUnit ? currentUnits : undefined
+            },
+            totalGross: this.totalGross(),
+            stripePaymentMethodId: this.isFree() ? undefined : (this.stripePaymentMethodId ?? undefined),
+            sessionKey: finalSessionKey
+        };
+        // Execute custom validation hook if present (fails closed)
+        try {
+            const customValidationResult = this.executeLifecycleHook('onValidate', submission);
+            if (customValidationResult === false || typeof customValidationResult === 'string') {
+                this.internalErrorMessage.set(typeof customValidationResult === 'string' ? customValidationResult : 'Submission validation rejected.');
+                return;
+            }
+        }
+        catch (hookErr) {
+            this.internalErrorMessage.set('Validation failed: ' + (hookErr instanceof Error ? hookErr.message : String(hookErr)));
+            return;
+        }
+        // Execute pre-submit enrichment hook
+        this.executeLifecycleHook('onBeforeSubmit', submission);
+        this.submitted.emit(submission);
+    }
+    static ɵfac = function MJCheckoutWidgetComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MJCheckoutWidgetComponent)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.Renderer2)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJCheckoutWidgetComponent, selectors: [["mj-checkout-widget"]], inputs: { config: "config", distributionSlug: "distributionSlug", sessionKey: "sessionKey", isProcessing: "isProcessing", errorMessage: "errorMessage", isPaymentReady: "isPaymentReady", stripePaymentMethodId: "stripePaymentMethodId" }, outputs: { submitted: "submitted", cancelled: "cancelled" }, features: [i0.ɵɵNgOnChangesFeature], decls: 27, vars: 24, consts: [[1, "mj-checkout-widget-container"], [1, "mj-widget-header"], [1, "mj-widget-title"], [1, "mj-widget-description"], ["role", "alert", 1, "mj-widget-error-banner"], [1, "mj-widget-summary-card"], [1, "mj-summary-row"], [1, "mj-summary-item-info"], [1, "mj-product-name"], [1, "mj-badge-free"], [1, "mj-summary-price"], [1, "mj-price-free"], [1, "mj-price-amount"], [1, "mj-quantity-selector-row"], [1, "mj-widget-form-section"], [1, "mj-widget-actions"], ["type", "button", 1, "mj-btn-submit", 3, "click", "disabled"], ["type", "button", 1, "mj-btn-cancel", 3, "click", "disabled"], [1, "mj-error-icon"], ["for", "quantityInput", 1, "mj-label"], [1, "mj-qty-controls"], ["type", "button", 1, "mj-qty-btn", 3, "click", "disabled"], ["id", "quantityInput", "type", "number", "min", "1", 1, "mj-qty-input", 3, "ngModelChange", "ngModel", "max"], [1, "mj-section-title"], [1, "mj-form-grid"], [1, "mj-form-group", 3, "full-width"], [1, "mj-form-group"], [1, "mj-label"], [1, "mj-required"], [1, "mj-input", "mj-textarea", 3, "ngModel", "placeholder", "required"], [1, "mj-select", 3, "ngModel", "required"], [1, "mj-checkbox-label"], ["type", "number", 1, "mj-input", 3, "ngModel", "placeholder", "required"], ["type", "date", 1, "mj-input", 3, "ngModel", "required"], [1, "mj-input", 3, "type", "ngModel", "placeholder", "required"], [1, "mj-input", "mj-textarea", 3, "ngModelChange", "ngModel", "placeholder", "required"], [1, "mj-select", 3, "ngModelChange", "ngModel", "required"], [3, "ngValue"], ["type", "checkbox", 3, "ngModelChange", "ngModel"], ["type", "number", 1, "mj-input", 3, "ngModelChange", "ngModel", "placeholder", "required"], ["type", "date", 1, "mj-input", 3, "ngModelChange", "ngModel", "required"], [1, "mj-input", 3, "ngModelChange", "type", "ngModel", "placeholder", "required"], [1, "mj-multi-attendee-header"], ["type", "button", 1, "mj-btn-link", 3, "click"], [1, "mj-attendee-matrix"], [1, "mj-attendee-card"], [1, "mj-attendee-card-title"], [1, "mj-widget-payment-section"], [1, "mj-stripe-container"], ["id", "stripe-card-element", 1, "mj-stripe-mount-point"], [1, "mj-stripe-badge"], [1, "mj-stripe-lock-icon"], [1, "mj-checkout-total-row"], [1, "mj-total-label"], [1, "mj-total-amount"], [1, "mj-spinner"]], template: function MJCheckoutWidgetComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "header", 1)(2, "h2", 2);
+            i0.ɵɵtext(3);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(4, MJCheckoutWidgetComponent_Conditional_4_Template, 2, 1, "p", 3);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(5, MJCheckoutWidgetComponent_Conditional_5_Template, 5, 1, "div", 4);
+            i0.ɵɵelementStart(6, "div", 5)(7, "div", 6)(8, "div", 7)(9, "span", 8);
+            i0.ɵɵtext(10);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(11, MJCheckoutWidgetComponent_Conditional_11_Template, 2, 0, "span", 9);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(12, "div", 10);
+            i0.ɵɵconditionalCreate(13, MJCheckoutWidgetComponent_Conditional_13_Template, 2, 0, "span", 11)(14, MJCheckoutWidgetComponent_Conditional_14_Template, 2, 2, "span", 12);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵconditionalCreate(15, MJCheckoutWidgetComponent_Conditional_15_Template, 9, 4, "div", 13);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(16, "section", 14);
+            i0.ɵɵconditionalCreate(17, MJCheckoutWidgetComponent_Conditional_17_Template, 5, 0)(18, MJCheckoutWidgetComponent_Conditional_18_Template, 8, 1);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(19, MJCheckoutWidgetComponent_Conditional_19_Template, 15, 2);
+            i0.ɵɵelementStart(20, "div", 15)(21, "button", 16);
+            i0.ɵɵlistener("click", function MJCheckoutWidgetComponent_Template_button_click_21_listener() { return ctx.handleSubmit(); });
+            i0.ɵɵconditionalCreate(22, MJCheckoutWidgetComponent_Conditional_22_Template, 3, 0)(23, MJCheckoutWidgetComponent_Conditional_23_Template, 2, 0, "span")(24, MJCheckoutWidgetComponent_Conditional_24_Template, 2, 2, "span");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(25, "button", 17);
+            i0.ɵɵlistener("click", function MJCheckoutWidgetComponent_Template_button_click_25_listener() { return ctx.cancelled.emit(); });
+            i0.ɵɵtext(26, " Cancel ");
+            i0.ɵɵelementEnd()()();
+        } if (rf & 2) {
+            let tmp_0_0;
+            let tmp_1_0;
+            let tmp_2_0;
+            let tmp_3_0;
+            let tmp_4_0;
+            let tmp_5_0;
+            i0.ɵɵstyleProp("--mj-primary-color", ((tmp_0_0 = ctx.activeTheme()) == null ? null : tmp_0_0.primaryColor) || "#2563eb")("--mj-accent-color", ((tmp_1_0 = ctx.activeTheme()) == null ? null : tmp_1_0.accentColor) || "#3b82f6")("--mj-border-radius", ((tmp_2_0 = ctx.activeTheme()) == null ? null : tmp_2_0.borderRadius) || "8px")("--mj-bg-color", ((tmp_3_0 = ctx.activeTheme()) == null ? null : tmp_3_0.backgroundColor) || "#ffffff")("--mj-text-color", ((tmp_4_0 = ctx.activeTheme()) == null ? null : tmp_4_0.textColor) || "#0f172a")("--mj-font-family", ((tmp_5_0 = ctx.activeTheme()) == null ? null : tmp_5_0.fontFamily) || "inherit");
+            i0.ɵɵadvance(3);
+            i0.ɵɵtextInterpolate((ctx.config == null ? null : ctx.config.title) || "Checkout");
+            i0.ɵɵadvance();
+            i0.ɵɵconditional((ctx.config == null ? null : ctx.config.description) ? 4 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.displayErrorMessage() ? 5 : -1);
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate((ctx.config == null ? null : ctx.config.productName) || "Order Item");
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.isFree() ? 11 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.isFree() ? 13 : 14);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional((ctx.config == null ? null : ctx.config.allowQuantity) ? 15 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.isSingleUnit() ? 17 : 18);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(!ctx.isFree() ? 19 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("disabled", !ctx.isFormValid() || ctx.isProcessing);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.isProcessing ? 22 : ctx.isFree() ? 23 : 24);
+            i0.ɵɵadvance(3);
+            i0.ɵɵproperty("disabled", ctx.isProcessing);
+        } }, dependencies: [CommonModule, FormsModule, i1.NgSelectOption, i1.ɵNgSelectMultipleOption, i1.DefaultValueAccessor, i1.NumberValueAccessor, i1.CheckboxControlValueAccessor, i1.SelectControlValueAccessor, i1.NgControlStatus, i1.RequiredValidator, i1.MinValidator, i1.MaxValidator, i1.NgModel], styles: ["[_nghost-%COMP%] {\n    display: block;\n    font-family: var(--mj-font-family, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);\n    color: var(--mj-text-color, #1e293b);\n}\n\n.mj-checkout-widget-container[_ngcontent-%COMP%] {\n    max-width: 560px;\n    margin: 0 auto;\n    background: var(--mj-bg-color, #ffffff);\n    border: 1px solid #e2e8f0;\n    border-radius: var(--mj-border-radius, 8px);\n    padding: 24px;\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);\n}\n\n.mj-widget-header[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n}\n\n.mj-widget-title[_ngcontent-%COMP%] {\n    margin: 0 0 6px 0;\n    font-size: 1.35rem;\n    font-weight: 700;\n    color: var(--mj-text-color, #0f172a);\n}\n\n.mj-widget-description[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 0.9rem;\n    color: #64748b;\n    line-height: 1.4;\n}\n\n.mj-widget-error-banner[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    background: #fef2f2;\n    border: 1px solid #f87171;\n    color: #991b1b;\n    padding: 10px 14px;\n    border-radius: 6px;\n    margin-bottom: 18px;\n    font-size: 0.875rem;\n}\n\n.mj-error-icon[_ngcontent-%COMP%] {\n    font-size: 1rem;\n}\n\n.mj-widget-summary-card[_ngcontent-%COMP%] {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px 16px;\n    margin-bottom: 20px;\n}\n\n.mj-summary-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n}\n\n.mj-summary-price[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n}\n\n.mj-widget-form-section[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n}\n\n.mj-summary-item-info[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.mj-product-name[_ngcontent-%COMP%] {\n    font-weight: 600;\n    font-size: 1rem;\n    color: #1e293b;\n}\n\n.mj-badge-free[_ngcontent-%COMP%] {\n    background: #dcfce7;\n    color: #166534;\n    font-size: 0.75rem;\n    font-weight: 700;\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.mj-price-free[_ngcontent-%COMP%] {\n    font-weight: 700;\n    color: #166534;\n    font-size: 1.1rem;\n}\n\n.mj-price-amount[_ngcontent-%COMP%] {\n    font-weight: 700;\n    color: #0f172a;\n    font-size: 1.1rem;\n}\n\n.mj-quantity-selector-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-top: 12px;\n    padding-top: 12px;\n    border-top: 1px dashed #cbd5e1;\n}\n\n.mj-qty-controls[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n}\n\n.mj-qty-btn[_ngcontent-%COMP%] {\n    width: 28px;\n    height: 28px;\n    background: #ffffff;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    cursor: pointer;\n    font-weight: 600;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.mj-qty-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.mj-qty-input[_ngcontent-%COMP%] {\n    width: 44px;\n    height: 28px;\n    text-align: center;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    font-weight: 600;\n}\n\n.mj-section-title[_ngcontent-%COMP%] {\n    font-size: 1rem;\n    font-weight: 600;\n    margin: 0 0 12px 0;\n    color: #334155;\n}\n\n.mj-form-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n    margin-bottom: 18px;\n}\n\n.mj-form-group[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.mj-form-group.full-width[_ngcontent-%COMP%] {\n    grid-column: 1 / -1;\n}\n\n.mj-label[_ngcontent-%COMP%] {\n    font-size: 0.8rem;\n    font-weight: 500;\n    color: #475569;\n}\n\n.mj-required[_ngcontent-%COMP%] {\n    color: #ef4444;\n}\n\n.mj-input[_ngcontent-%COMP%], .mj-select[_ngcontent-%COMP%] {\n    padding: 8px 12px;\n    font-size: 0.9rem;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    background: #ffffff;\n    color: #1e293b;\n    outline: none;\n    transition: border-color 0.15s ease;\n    width: 100%;\n    box-sizing: border-box;\n}\n\n.mj-textarea[_ngcontent-%COMP%] {\n    min-height: 70px;\n    resize: vertical;\n    font-family: inherit;\n}\n\n.mj-select[_ngcontent-%COMP%] {\n    min-height: 38px;\n}\n\n.mj-checkbox-label[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    cursor: pointer;\n    font-size: 0.9rem;\n    color: #334155;\n    margin-top: 4px;\n}\n\n.mj-input[_ngcontent-%COMP%]:focus, .mj-select[_ngcontent-%COMP%]:focus {\n    border-color: var(--mj-primary-color, #2563eb);\n    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);\n}\n\n.mj-multi-attendee-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 12px;\n}\n\n.mj-btn-link[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    color: var(--mj-primary-color, #2563eb);\n    font-size: 0.8rem;\n    cursor: pointer;\n    text-decoration: underline;\n    padding: 0;\n}\n\n.mj-attendee-matrix[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    margin-bottom: 20px;\n}\n\n.mj-attendee-card[_ngcontent-%COMP%] {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 12px 14px;\n}\n\n.mj-attendee-card-title[_ngcontent-%COMP%] {\n    font-size: 0.85rem;\n    font-weight: 600;\n    color: #475569;\n    margin-bottom: 10px;\n}\n\n\n\n.mj-widget-payment-section[_ngcontent-%COMP%] {\n    margin-top: 16px;\n    padding-top: 16px;\n    border-top: 1px solid #e2e8f0;\n}\n\n.mj-stripe-container[_ngcontent-%COMP%] {\n    background: #ffffff;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px;\n    margin-bottom: 16px;\n}\n\n.mj-stripe-mount-point[_ngcontent-%COMP%] {\n    min-height: 40px;\n}\n\n.mj-stripe-badge[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    margin-top: 10px;\n    font-size: 0.75rem;\n    color: #64748b;\n}\n\n.mj-stripe-lock-icon[_ngcontent-%COMP%] {\n    font-size: 0.85rem;\n}\n\n.mj-checkout-total-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px 0;\n    border-top: 1px solid #e2e8f0;\n    margin-top: 10px;\n    margin-bottom: 18px;\n}\n\n.mj-total-label[_ngcontent-%COMP%] {\n    font-weight: 700;\n    font-size: 1.05rem;\n    color: #0f172a;\n}\n\n.mj-total-amount[_ngcontent-%COMP%] {\n    font-weight: 800;\n    font-size: 1.25rem;\n    color: var(--mj-primary-color, #2563eb);\n}\n\n.mj-widget-actions[_ngcontent-%COMP%] {\n    margin-top: 12px;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.mj-btn-submit[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 12px;\n    background: var(--mj-primary-color, #2563eb);\n    color: #ffffff;\n    font-size: 1rem;\n    font-weight: 600;\n    border: none;\n    border-radius: var(--mj-border-radius, 8px);\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    transition: opacity 0.15s ease;\n}\n\n.mj-btn-submit[_ngcontent-%COMP%]:hover:not(:disabled) {\n    opacity: 0.92;\n}\n\n.mj-btn-submit[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.mj-btn-cancel[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 8px 12px;\n    background: transparent;\n    color: #64748b;\n    font-size: 0.875rem;\n    font-weight: 500;\n    border: none;\n    cursor: pointer;\n    text-align: center;\n}\n\n.mj-btn-cancel[_ngcontent-%COMP%]:hover:not(:disabled) {\n    color: #334155;\n    text-decoration: underline;\n}\n\n.mj-spinner[_ngcontent-%COMP%] {\n    width: 16px;\n    height: 16px;\n    border: 2px solid #ffffff;\n    border-top-color: transparent;\n    border-radius: 50%;\n    animation: _ngcontent-%COMP%_mj-spin 0.8s linear infinite;\n}\n\n@keyframes _ngcontent-%COMP%_mj-spin {\n    to { transform: rotate(360deg); }\n}"], changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJCheckoutWidgetComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-checkout-widget', standalone: true, imports: [CommonModule, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mj-checkout-widget-container\"\n    [style.--mj-primary-color]=\"activeTheme()?.primaryColor || '#2563eb'\"\n    [style.--mj-accent-color]=\"activeTheme()?.accentColor || '#3b82f6'\"\n    [style.--mj-border-radius]=\"activeTheme()?.borderRadius || '8px'\"\n    [style.--mj-bg-color]=\"activeTheme()?.backgroundColor || '#ffffff'\"\n    [style.--mj-text-color]=\"activeTheme()?.textColor || '#0f172a'\"\n    [style.--mj-font-family]=\"activeTheme()?.fontFamily || 'inherit'\">\n\n    <!-- Widget Header -->\n    <header class=\"mj-widget-header\">\n        <h2 class=\"mj-widget-title\">{{ config?.title || 'Checkout' }}</h2>\n        @if (config?.description) {\n            <p class=\"mj-widget-description\">{{ config?.description }}</p>\n        }\n    </header>\n\n    <!-- Error Banner -->\n    @if (displayErrorMessage()) {\n        <div class=\"mj-widget-error-banner\" role=\"alert\">\n            <span class=\"mj-error-icon\">\u26A0\uFE0F</span>\n            <span>{{ displayErrorMessage() }}</span>\n        </div>\n    }\n\n    <!-- Order Item & Pricing Summary -->\n    <div class=\"mj-widget-summary-card\">\n        <div class=\"mj-summary-row\">\n            <div class=\"mj-summary-item-info\">\n                <span class=\"mj-product-name\">{{ config?.productName || 'Order Item' }}</span>\n                @if (isFree()) {\n                    <span class=\"mj-badge-free\">FREE</span>\n                }\n            </div>\n            <div class=\"mj-summary-price\">\n                @if (isFree()) {\n                    <span class=\"mj-price-free\">$0.00</span>\n                } @else {\n                    <span class=\"mj-price-amount\">{{ currencySymbol() }}{{ (config?.unitPrice || 0).toFixed(2) }}</span>\n                }\n            </div>\n        </div>\n\n        @if (config?.allowQuantity) {\n            <div class=\"mj-quantity-selector-row\">\n                <label for=\"quantityInput\" class=\"mj-label\">Quantity</label>\n                <div class=\"mj-qty-controls\">\n                    <button type=\"button\" class=\"mj-qty-btn\" (click)=\"onQuantityChange(quantity() - 1)\" [disabled]=\"quantity() <= 1\">-</button>\n                    <input id=\"quantityInput\" type=\"number\" class=\"mj-qty-input\" [ngModel]=\"quantity()\" (ngModelChange)=\"onQuantityChange($event)\" min=\"1\" [max]=\"config?.maxQuantity || 50\" />\n                    <button type=\"button\" class=\"mj-qty-btn\" (click)=\"onQuantityChange(quantity() + 1)\" [disabled]=\"quantity() >= (config?.maxQuantity || 50)\">+</button>\n                </div>\n            </div>\n        }\n    </div>\n\n    <!-- Registration / Contact / Product Extension Form Section -->\n    <section class=\"mj-widget-form-section\">\n        @if (isSingleUnit()) {\n            <!-- Single Unit / Primary Form -->\n            <h3 class=\"mj-section-title\">Details</h3>\n            <div class=\"mj-form-grid\">\n                @for (field of activeFieldDefs(); track field.name) {\n                    <div class=\"mj-form-group\" [class.full-width]=\"field.type === 'textarea' || field.name === 'email' || field.name === 'Email'\">\n                        <label class=\"mj-label\">\n                            {{ field.label }}\n                            @if (field.required) {\n                                <span class=\"mj-required\">*</span>\n                            }\n                        </label>\n\n                        @switch (field.type) {\n                            @case ('textarea') {\n                                <textarea\n                                    class=\"mj-input mj-textarea\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [placeholder]=\"field.placeholder || ''\"\n                                    [required]=\"field.required || false\">\n                                </textarea>\n                            }\n                            @case ('select') {\n                                <select\n                                    class=\"mj-select\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [required]=\"field.required || false\">\n                                    <option [ngValue]=\"''\">Select {{ field.label }}</option>\n                                    @for (opt of field.options; track opt.value) {\n                                        <option [ngValue]=\"opt.value\">{{ opt.label }}</option>\n                                    }\n                                </select>\n                            }\n                            @case ('boolean') {\n                                <label class=\"mj-checkbox-label\">\n                                    <input\n                                        type=\"checkbox\"\n                                        [ngModel]=\"units()[0]?.[field.name]\"\n                                        (ngModelChange)=\"updateUnitField(0, field.name, $event)\" />\n                                    <span>{{ field.label }}</span>\n                                </label>\n                            }\n                            @case ('number') {\n                                <input\n                                    type=\"number\"\n                                    class=\"mj-input\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [placeholder]=\"field.placeholder || ''\"\n                                    [required]=\"field.required || false\" />\n                            }\n                            @case ('date') {\n                                <input\n                                    type=\"date\"\n                                    class=\"mj-input\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [required]=\"field.required || false\" />\n                            }\n                            @default {\n                                <input\n                                    [type]=\"field.name.toLowerCase().includes('email') ? 'email' : 'text'\"\n                                    class=\"mj-input\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [placeholder]=\"field.placeholder || ''\"\n                                    [required]=\"field.required || false\" />\n                            }\n                        }\n                    </div>\n                }\n            </div>\n        } @else {\n            <!-- Multi-Unit Matrix (Repeating Fieldsets for Quantity > 1) -->\n            <div class=\"mj-multi-attendee-header\">\n                <h3 class=\"mj-section-title\">Item Details ({{ quantity() }})</h3>\n                <button type=\"button\" class=\"mj-btn-link\" (click)=\"copyPrimaryToAll()\">Copy Primary Info to All</button>\n            </div>\n\n            <div class=\"mj-attendee-matrix\">\n                @for (unit of units(); track $index) {\n                    <div class=\"mj-attendee-card\">\n                        <div class=\"mj-attendee-card-title\">Item {{ $index + 1 }}</div>\n                        <div class=\"mj-form-grid\">\n                            @for (field of activeFieldDefs(); track field.name) {\n                                <div class=\"mj-form-group\" [class.full-width]=\"field.type === 'textarea' || field.name === 'email' || field.name === 'Email'\">\n                                    <label class=\"mj-label\">\n                                        {{ field.label }}\n                                        @if (field.required) {\n                                            <span class=\"mj-required\">*</span>\n                                        }\n                                    </label>\n\n                                    @switch (field.type) {\n                                        @case ('textarea') {\n                                            <textarea\n                                                class=\"mj-input mj-textarea\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [placeholder]=\"field.placeholder || ''\"\n                                                [required]=\"field.required || false\">\n                                            </textarea>\n                                        }\n                                        @case ('select') {\n                                            <select\n                                                class=\"mj-select\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [required]=\"field.required || false\">\n                                                <option [ngValue]=\"''\">Select {{ field.label }}</option>\n                                                @for (opt of field.options; track opt.value) {\n                                                    <option [ngValue]=\"opt.value\">{{ opt.label }}</option>\n                                                }\n                                            </select>\n                                        }\n                                        @case ('boolean') {\n                                            <label class=\"mj-checkbox-label\">\n                                                <input\n                                                    type=\"checkbox\"\n                                                    [ngModel]=\"unit[field.name]\"\n                                                    (ngModelChange)=\"updateUnitField($index, field.name, $event)\" />\n                                                <span>{{ field.label }}</span>\n                                            </label>\n                                        }\n                                        @case ('number') {\n                                            <input\n                                                type=\"number\"\n                                                class=\"mj-input\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [placeholder]=\"field.placeholder || ''\"\n                                                [required]=\"field.required || false\" />\n                                        }\n                                        @case ('date') {\n                                            <input\n                                                type=\"date\"\n                                                class=\"mj-input\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [required]=\"field.required || false\" />\n                                        }\n                                        @default {\n                                            <input\n                                                [type]=\"field.name.toLowerCase().includes('email') ? 'email' : 'text'\"\n                                                class=\"mj-input\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [placeholder]=\"field.placeholder || ''\"\n                                                [required]=\"field.required || false\" />\n                                        }\n                                    }\n                                </div>\n                            }\n                        </div>\n                    </div>\n                }\n            </div>\n        }\n    </section>\n\n    <!-- Stripe Embedded Payment Section -->\n    @if (!isFree()) {\n        <section class=\"mj-widget-payment-section\">\n            <h3 class=\"mj-section-title\">Payment</h3>\n            <div class=\"mj-stripe-container\">\n                <div id=\"stripe-card-element\" class=\"mj-stripe-mount-point\">\n                    <!-- Stripe.js mounts secure hosted Elements iframe here -->\n                </div>\n                <div class=\"mj-stripe-badge\">\n                    <span class=\"mj-stripe-lock-icon\">\uD83D\uDD12</span>\n                    <span>Secured by Stripe \u2022 PCI-DSS Level 1 Certified \u2022 End-to-end Encrypted</span>\n                </div>\n            </div>\n        </section>\n\n        <!-- Final Total Line -->\n        <div class=\"mj-checkout-total-row\">\n            <span class=\"mj-total-label\">Total Due</span>\n            <span class=\"mj-total-amount\">{{ currencySymbol() }}{{ totalGross().toFixed(2) }}</span>\n        </div>\n    }\n\n    <!-- Actions -->\n    <div class=\"mj-widget-actions\">\n        <button type=\"button\" class=\"mj-btn-submit\" [disabled]=\"!isFormValid() || isProcessing\" (click)=\"handleSubmit()\">\n            @if (isProcessing) {\n                <span class=\"mj-spinner\"></span>\n                <span>Processing...</span>\n            } @else if (isFree()) {\n                <span>Complete Free Registration</span>\n            } @else {\n                <span>Pay {{ currencySymbol() }}{{ totalGross().toFixed(2) }}</span>\n            }\n        </button>\n\n        <button type=\"button\" class=\"mj-btn-cancel\" [disabled]=\"isProcessing\" (click)=\"cancelled.emit()\">\n            Cancel\n        </button>\n    </div>\n</div>\n", styles: [":host {\n    display: block;\n    font-family: var(--mj-font-family, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);\n    color: var(--mj-text-color, #1e293b);\n}\n\n.mj-checkout-widget-container {\n    max-width: 560px;\n    margin: 0 auto;\n    background: var(--mj-bg-color, #ffffff);\n    border: 1px solid #e2e8f0;\n    border-radius: var(--mj-border-radius, 8px);\n    padding: 24px;\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);\n}\n\n.mj-widget-header {\n    margin-bottom: 20px;\n}\n\n.mj-widget-title {\n    margin: 0 0 6px 0;\n    font-size: 1.35rem;\n    font-weight: 700;\n    color: var(--mj-text-color, #0f172a);\n}\n\n.mj-widget-description {\n    margin: 0;\n    font-size: 0.9rem;\n    color: #64748b;\n    line-height: 1.4;\n}\n\n.mj-widget-error-banner {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    background: #fef2f2;\n    border: 1px solid #f87171;\n    color: #991b1b;\n    padding: 10px 14px;\n    border-radius: 6px;\n    margin-bottom: 18px;\n    font-size: 0.875rem;\n}\n\n.mj-error-icon {\n    font-size: 1rem;\n}\n\n.mj-widget-summary-card {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px 16px;\n    margin-bottom: 20px;\n}\n\n.mj-summary-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n}\n\n.mj-summary-price {\n    display: flex;\n    align-items: center;\n}\n\n.mj-widget-form-section {\n    margin-bottom: 20px;\n}\n\n.mj-summary-item-info {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.mj-product-name {\n    font-weight: 600;\n    font-size: 1rem;\n    color: #1e293b;\n}\n\n.mj-badge-free {\n    background: #dcfce7;\n    color: #166534;\n    font-size: 0.75rem;\n    font-weight: 700;\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.mj-price-free {\n    font-weight: 700;\n    color: #166534;\n    font-size: 1.1rem;\n}\n\n.mj-price-amount {\n    font-weight: 700;\n    color: #0f172a;\n    font-size: 1.1rem;\n}\n\n.mj-quantity-selector-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-top: 12px;\n    padding-top: 12px;\n    border-top: 1px dashed #cbd5e1;\n}\n\n.mj-qty-controls {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n}\n\n.mj-qty-btn {\n    width: 28px;\n    height: 28px;\n    background: #ffffff;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    cursor: pointer;\n    font-weight: 600;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.mj-qty-btn:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.mj-qty-input {\n    width: 44px;\n    height: 28px;\n    text-align: center;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    font-weight: 600;\n}\n\n.mj-section-title {\n    font-size: 1rem;\n    font-weight: 600;\n    margin: 0 0 12px 0;\n    color: #334155;\n}\n\n.mj-form-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n    margin-bottom: 18px;\n}\n\n.mj-form-group {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.mj-form-group.full-width {\n    grid-column: 1 / -1;\n}\n\n.mj-label {\n    font-size: 0.8rem;\n    font-weight: 500;\n    color: #475569;\n}\n\n.mj-required {\n    color: #ef4444;\n}\n\n.mj-input, .mj-select {\n    padding: 8px 12px;\n    font-size: 0.9rem;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    background: #ffffff;\n    color: #1e293b;\n    outline: none;\n    transition: border-color 0.15s ease;\n    width: 100%;\n    box-sizing: border-box;\n}\n\n.mj-textarea {\n    min-height: 70px;\n    resize: vertical;\n    font-family: inherit;\n}\n\n.mj-select {\n    min-height: 38px;\n}\n\n.mj-checkbox-label {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    cursor: pointer;\n    font-size: 0.9rem;\n    color: #334155;\n    margin-top: 4px;\n}\n\n.mj-input:focus, .mj-select:focus {\n    border-color: var(--mj-primary-color, #2563eb);\n    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);\n}\n\n.mj-multi-attendee-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 12px;\n}\n\n.mj-btn-link {\n    background: none;\n    border: none;\n    color: var(--mj-primary-color, #2563eb);\n    font-size: 0.8rem;\n    cursor: pointer;\n    text-decoration: underline;\n    padding: 0;\n}\n\n.mj-attendee-matrix {\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    margin-bottom: 20px;\n}\n\n.mj-attendee-card {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 12px 14px;\n}\n\n.mj-attendee-card-title {\n    font-size: 0.85rem;\n    font-weight: 600;\n    color: #475569;\n    margin-bottom: 10px;\n}\n\n/* Stripe Payment Container */\n.mj-widget-payment-section {\n    margin-top: 16px;\n    padding-top: 16px;\n    border-top: 1px solid #e2e8f0;\n}\n\n.mj-stripe-container {\n    background: #ffffff;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px;\n    margin-bottom: 16px;\n}\n\n.mj-stripe-mount-point {\n    min-height: 40px;\n}\n\n.mj-stripe-badge {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    margin-top: 10px;\n    font-size: 0.75rem;\n    color: #64748b;\n}\n\n.mj-stripe-lock-icon {\n    font-size: 0.85rem;\n}\n\n.mj-checkout-total-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px 0;\n    border-top: 1px solid #e2e8f0;\n    margin-top: 10px;\n    margin-bottom: 18px;\n}\n\n.mj-total-label {\n    font-weight: 700;\n    font-size: 1.05rem;\n    color: #0f172a;\n}\n\n.mj-total-amount {\n    font-weight: 800;\n    font-size: 1.25rem;\n    color: var(--mj-primary-color, #2563eb);\n}\n\n.mj-widget-actions {\n    margin-top: 12px;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.mj-btn-submit {\n    width: 100%;\n    padding: 12px;\n    background: var(--mj-primary-color, #2563eb);\n    color: #ffffff;\n    font-size: 1rem;\n    font-weight: 600;\n    border: none;\n    border-radius: var(--mj-border-radius, 8px);\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    transition: opacity 0.15s ease;\n}\n\n.mj-btn-submit:hover:not(:disabled) {\n    opacity: 0.92;\n}\n\n.mj-btn-submit:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.mj-btn-cancel {\n    width: 100%;\n    padding: 8px 12px;\n    background: transparent;\n    color: #64748b;\n    font-size: 0.875rem;\n    font-weight: 500;\n    border: none;\n    cursor: pointer;\n    text-align: center;\n}\n\n.mj-btn-cancel:hover:not(:disabled) {\n    color: #334155;\n    text-decoration: underline;\n}\n\n.mj-spinner {\n    width: 16px;\n    height: 16px;\n    border: 2px solid #ffffff;\n    border-top-color: transparent;\n    border-radius: 50%;\n    animation: mj-spin 0.8s linear infinite;\n}\n\n@keyframes mj-spin {\n    to { transform: rotate(360deg); }\n}\n"] }]
+    }], () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], { config: [{
+            type: Input
+        }], distributionSlug: [{
+            type: Input
+        }], sessionKey: [{
+            type: Input
+        }], isProcessing: [{
+            type: Input
+        }], errorMessage: [{
+            type: Input
+        }], isPaymentReady: [{
+            type: Input
+        }], stripePaymentMethodId: [{
+            type: Input
+        }], submitted: [{
+            type: Output
+        }], cancelled: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJCheckoutWidgetComponent, { className: "MJCheckoutWidgetComponent", filePath: "lib/checkout-widget/checkout-widget.component.ts", lineNumber: 116 }); })();
+//# sourceMappingURL=checkout-widget.component.js.map