@benbraide/inlinejs-stripe 1.0.6 → 1.0.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (10) hide show
  1. package/dist/inlinejs-stripe.js +1009 -383
  2. package/dist/inlinejs-stripe.min.js +1 -1
  3. package/lib/common/directive/stripe.js +155 -138
  4. package/lib/common/entry.d.ts +1 -0
  5. package/lib/common/entry.js +9 -0
  6. package/lib/esm/directive/stripe.js +155 -138
  7. package/lib/esm/entry.d.ts +1 -0
  8. package/lib/esm/entry.js +5 -0
  9. package/package.json +2 -2
  10. package/src/inlinejs-stripe.ts +2 -4
package/lib/common/directive/stripe.js CHANGED
@@ -16,6 +16,7 @@ let StripeUrl = 'https://js.stripe.com/v3/';
16
16
  let StripeStyles = null;
17
17
  let StripeClasses = null;
18
18
  exports.StripeDirectiveHandler = (0, inlinejs_1.CreateDirectiveHandlerCallback)(StripeDirectiveName, ({ componentId, component, contextElement, expression, argKey, argOptions }) => {
19
+ var _a;
19
20
  if ((0, inlinejs_1.BindEvent)({ contextElement, expression,
20
21
  component: (component || componentId),
21
22
  key: StripeDirectiveName,
@@ -42,159 +43,150 @@ exports.StripeDirectiveHandler = (0, inlinejs_1.CreateDirectiveHandlerCallback)(
42
43
  elementScope.SetLocal(localKey, (0, inlinejs_1.CreateInplaceProxy)((0, inlinejs_1.BuildGetterProxyOptions)({
43
44
  getter: (prop) => {
44
45
  var _a;
46
+ let local = (contextElement.parentElement ? (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
45
47
  if (prop === 'parent') {
46
- return (contextElement.parentElement ? (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
48
+ return local;
47
49
  }
50
+ return ((prop && local) ? local[prop] : null);
48
51
  },
49
52
  lookup: ['parent'],
50
53
  })));
51
54
  }
52
55
  return;
53
56
  }
54
- if (argKey in StripeKeys) { //Bind Stripe field
55
- let details = resolvedComponent.FindElementLocalValue(contextElement, detailsKey, true);
56
- if (!details) { //No parent
57
- return;
58
- }
59
- let id = resolvedComponent.GenerateUniqueId(`${StripeDirectiveName}_proxy_`), field = {
60
- name: argKey,
61
- mount: contextElement,
62
- element: details.elements.create(StripeKeys[argKey], {
63
- style: (StripeStyles || undefined),
64
- classes: (StripeClasses || undefined),
65
- }),
66
- ready: false,
67
- complete: false,
68
- error: undefined,
69
- };
70
- if (!field.element) {
71
- return;
72
- }
73
- field.element.mount(contextElement);
74
- details.fields.push(field);
75
- elementScope.SetLocal(localKey, (0, inlinejs_1.CreateInplaceProxy)((0, inlinejs_1.BuildGetterProxyOptions)({
76
- getter: (prop) => {
77
- var _a, _b, _c, _d;
78
- if (prop === 'complete') {
79
- (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
80
- return field.complete;
81
- }
82
- if (prop === 'focused') {
83
- (_b = (0, inlinejs_1.FindComponentById)(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
84
- return field.focused;
85
- }
86
- if (prop === 'error') {
87
- (_c = (0, inlinejs_1.FindComponentById)(componentId)) === null || _c === void 0 ? void 0 : _c.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
88
- return field.error;
89
- }
90
- if (prop === 'parent') {
91
- return (contextElement.parentElement ? (_d = (0, inlinejs_1.FindComponentById)(componentId)) === null || _d === void 0 ? void 0 : _d.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
92
- }
93
- if (prop === 'clear') {
94
- return () => {
95
- if (field.element) {
96
- field.element.clear();
97
- }
98
- };
99
- }
100
- if (prop === 'focus') {
101
- return () => {
102
- if (field.element) {
103
- field.element.focus();
104
- }
105
- };
106
- }
107
- if (prop === 'blur') {
108
- return () => {
109
- if (field.element) {
110
- field.element.blur();
111
- }
112
- };
113
- }
114
- },
115
- lookup: ['complete', 'focused', 'error', 'parent', 'clear', 'focus', 'blur'],
116
- })));
117
- let fields = details.fields;
118
- elementScope.AddUninitCallback(() => {
119
- var _a;
120
- (_a = field.element) === null || _a === void 0 ? void 0 : _a.destroy();
121
- fields.splice(fields.indexOf(field), 1);
122
- });
123
- field.element.on('ready', () => {
124
- if (!field.ready) {
125
- field.ready = true;
126
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.ready`));
127
- details.onReady();
128
- }
129
- });
130
- field.element.on('change', (e) => {
131
- var _a, _b;
132
- if ((e === null || e === void 0 ? void 0 : e.complete) === field.complete) {
57
+ if (StripeKeys.hasOwnProperty(argKey)) { //Bind Stripe field
58
+ return (_a = resolvedComponent.FindElementLocalValue(contextElement, detailsKey, true)) === null || _a === void 0 ? void 0 : _a.addField(argKey, contextElement, (field, details) => {
59
+ let resolvedComponent = (0, inlinejs_1.FindComponentById)(componentId), elementScope = resolvedComponent === null || resolvedComponent === void 0 ? void 0 : resolvedComponent.FindElementScope(contextElement);
60
+ let id = resolvedComponent === null || resolvedComponent === void 0 ? void 0 : resolvedComponent.GenerateUniqueId(`${StripeDirectiveName}_proxy_`);
61
+ if (!field.element) {
133
62
  return;
134
63
  }
135
- field.complete = e === null || e === void 0 ? void 0 : e.complete;
136
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.complete`, {
137
- detail: {
138
- completed: e === null || e === void 0 ? void 0 : e.complete,
139
- },
140
- }));
141
- if (field.complete) {
142
- if (field.error) {
143
- field.error = undefined;
144
- (0, inlinejs_1.AddChanges)('set', `${id}.error`, 'error', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
145
- }
146
- if (details.options.autofocus) { //Focus next if any
147
- let index = details.fields.indexOf(field);
148
- if (index != -1 && index < (details.fields.length - 1)) {
149
- let nextField = details.fields[index + 1];
150
- if (nextField.element) {
151
- nextField.element.focus();
152
- }
153
- else if ('focus' in nextField.mount && typeof nextField.mount.focus === 'function') {
154
- nextField.mount.focus();
155
- }
64
+ elementScope === null || elementScope === void 0 ? void 0 : elementScope.SetLocal(localKey, (0, inlinejs_1.CreateInplaceProxy)((0, inlinejs_1.BuildGetterProxyOptions)({
65
+ getter: (prop) => {
66
+ var _a, _b, _c, _d, _e;
67
+ if (prop === 'complete') {
68
+ (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
69
+ return field.complete;
70
+ }
71
+ if (prop === 'focused') {
72
+ (_b = (0, inlinejs_1.FindComponentById)(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
73
+ return field.focused;
74
+ }
75
+ if (prop === 'error') {
76
+ (_c = (0, inlinejs_1.FindComponentById)(componentId)) === null || _c === void 0 ? void 0 : _c.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
77
+ return field.error;
78
+ }
79
+ if (prop === 'parent') {
80
+ return (contextElement.parentElement ? (_d = (0, inlinejs_1.FindComponentById)(componentId)) === null || _d === void 0 ? void 0 : _d.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
81
+ }
82
+ if (prop === 'clear') {
83
+ return () => {
84
+ if (field.element) {
85
+ field.element.clear();
86
+ }
87
+ };
88
+ }
89
+ if (prop === 'focus') {
90
+ return () => {
91
+ if (field.element) {
92
+ field.element.focus();
93
+ }
94
+ };
95
+ }
96
+ if (prop === 'blur') {
97
+ return () => {
98
+ if (field.element) {
99
+ field.element.blur();
100
+ }
101
+ };
156
102
  }
157
- else if (details.specialMounts.submit) {
158
- details.specialMounts.submit.focus();
103
+ if (prop === 'disable') {
104
+ return (state = true) => {
105
+ if (field.element) {
106
+ field.element.update({ disabled: state });
107
+ }
108
+ };
159
109
  }
110
+ let local = (contextElement.parentElement ? (_e = (0, inlinejs_1.FindComponentById)(componentId)) === null || _e === void 0 ? void 0 : _e.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
111
+ return ((prop && local) ? local[prop] : null);
112
+ },
113
+ lookup: ['complete', 'focused', 'error', 'parent', 'clear', 'focus', 'blur', 'disable'],
114
+ })));
115
+ field.element.on('ready', () => {
116
+ if (!field.ready) {
117
+ field.ready = true;
118
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.ready`));
119
+ details.onReady();
160
120
  }
161
- }
162
- else if ((e === null || e === void 0 ? void 0 : e.error) && e.error.message !== field.error) {
163
- field.error = e.error.message;
164
- (0, inlinejs_1.AddChanges)('set', `${id}.error`, 'error', (_b = (0, inlinejs_1.FindComponentById)(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes);
165
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.error`, {
166
- detail: {
167
- message: e.error.message,
168
- },
169
- }));
170
- }
171
- details.onChange();
172
- });
173
- field.element.on('focus', () => {
174
- var _a;
175
- if (!field.focused) {
176
- field.focused = true;
177
- (0, inlinejs_1.AddChanges)('set', `${id}.focused`, 'focused', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
178
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
179
- detail: {
180
- focused: true,
181
- },
182
- }));
183
- }
184
- });
185
- field.element.on('blur', () => {
186
- var _a;
187
- if (field.focused) {
188
- field.focused = false;
189
- (0, inlinejs_1.AddChanges)('set', `${id}.focused`, 'focused', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
190
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
121
+ });
122
+ field.element.on('change', (e) => {
123
+ var _a, _b;
124
+ if ((e === null || e === void 0 ? void 0 : e.complete) === field.complete) {
125
+ return;
126
+ }
127
+ field.complete = e === null || e === void 0 ? void 0 : e.complete;
128
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.complete`, {
191
129
  detail: {
192
- focused: false,
130
+ completed: e === null || e === void 0 ? void 0 : e.complete,
193
131
  },
194
132
  }));
195
- }
133
+ if (field.complete) {
134
+ if (field.error) {
135
+ field.error = undefined;
136
+ (0, inlinejs_1.AddChanges)('set', `${id}.error`, 'error', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
137
+ }
138
+ if (details.options.autofocus) { //Focus next if any
139
+ let index = details.fields.indexOf(field);
140
+ if (index != -1 && index < (details.fields.length - 1)) {
141
+ let nextField = details.fields[index + 1];
142
+ if (nextField.element) {
143
+ nextField.element.focus();
144
+ }
145
+ else if ('focus' in nextField.mount && typeof nextField.mount.focus === 'function') {
146
+ nextField.mount.focus();
147
+ }
148
+ }
149
+ else if (details.specialMounts.submit) {
150
+ details.specialMounts.submit.focus();
151
+ }
152
+ }
153
+ }
154
+ else if ((e === null || e === void 0 ? void 0 : e.error) && e.error.message !== field.error) {
155
+ field.error = e.error.message;
156
+ (0, inlinejs_1.AddChanges)('set', `${id}.error`, 'error', (_b = (0, inlinejs_1.FindComponentById)(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes);
157
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.error`, {
158
+ detail: {
159
+ message: e.error.message,
160
+ },
161
+ }));
162
+ }
163
+ details.onChange();
164
+ });
165
+ field.element.on('focus', () => {
166
+ var _a;
167
+ if (!field.focused) {
168
+ field.focused = true;
169
+ (0, inlinejs_1.AddChanges)('set', `${id}.focused`, 'focused', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
170
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
171
+ detail: {
172
+ focused: true,
173
+ },
174
+ }));
175
+ }
176
+ });
177
+ field.element.on('blur', () => {
178
+ var _a;
179
+ if (field.focused) {
180
+ field.focused = false;
181
+ (0, inlinejs_1.AddChanges)('set', `${id}.focused`, 'focused', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
182
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
183
+ detail: {
184
+ focused: false,
185
+ },
186
+ }));
187
+ }
188
+ });
196
189
  });
197
- return;
198
190
  }
199
191
  let stripeInstance = null, elements = null, backlog = new Array(), init = () => {
200
192
  (0, inlinejs_1.EvaluateLater)({ componentId, contextElement, expression })((value) => {
@@ -233,6 +225,31 @@ exports.StripeDirectiveHandler = (0, inlinejs_1.CreateDirectiveHandlerCallback)(
233
225
  }
234
226
  };
235
227
  let details = { fields, specialMounts, options,
228
+ addField(key, target, callback) {
229
+ let add = () => {
230
+ var _a, _b;
231
+ let field = {
232
+ name: key,
233
+ mount: target,
234
+ element: elements.create(StripeKeys[key], {
235
+ style: (StripeStyles || undefined),
236
+ classes: (StripeClasses || undefined),
237
+ }),
238
+ ready: false,
239
+ complete: false,
240
+ error: undefined,
241
+ };
242
+ field.element.mount(target);
243
+ this.fields.push(field);
244
+ (_b = (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.FindElementScope(target)) === null || _b === void 0 ? void 0 : _b.AddUninitCallback(() => {
245
+ var _a;
246
+ (_a = field.element) === null || _a === void 0 ? void 0 : _a.destroy();
247
+ this.fields = this.fields.filter(item => (item !== field));
248
+ });
249
+ callback(field, this);
250
+ };
251
+ elements ? add() : backlog.push(add);
252
+ },
236
253
  onReady: () => { var _a; return (0, inlinejs_1.AddChanges)('set', `${id}.readyCount`, 'readyCount', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes); },
237
254
  onChange: () => {
238
255
  var _a;
@@ -390,9 +407,9 @@ exports.StripeDirectiveHandler = (0, inlinejs_1.CreateDirectiveHandlerCallback)(
390
407
  };
391
408
  }
392
409
  if (prop === 'setup') {
393
- return (clientSecret, paymentMethod, save = false) => {
410
+ return (clientSecret, paymentMethod) => {
394
411
  payOrSetup(() => {
395
- let paymentDetails = getPaymentDetails(paymentMethod, save);
412
+ let paymentDetails = getPaymentDetails(paymentMethod, false);
396
413
  if (paymentDetails) {
397
414
  stripeInstance === null || stripeInstance === void 0 ? void 0 : stripeInstance.confirmCardSetup(clientSecret, paymentDetails).then(onSuccess).catch(onError);
398
415
  }
package/lib/common/entry.d.ts ADDED
@@ -0,0 +1 @@
1
+ export declare function InlineJSStripe(): void;
package/lib/common/entry.js ADDED
@@ -0,0 +1,9 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.InlineJSStripe = void 0;
4
+ const inlinejs_1 = require("@benbraide/inlinejs");
5
+ const stripe_1 = require("./directive/stripe");
6
+ function InlineJSStripe() {
7
+ (0, inlinejs_1.WaitForGlobal)().then(() => (0, stripe_1.StripeDirectiveHandlerCompact)());
8
+ }
9
+ exports.InlineJSStripe = InlineJSStripe;