@benbraide/inlinejs-stripe 1.0.6 → 1.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -13,6 +13,7 @@ let StripeUrl = 'https://js.stripe.com/v3/';
13
13
  let StripeStyles = null;
14
14
  let StripeClasses = null;
15
15
  export const StripeDirectiveHandler = CreateDirectiveHandlerCallback(StripeDirectiveName, ({ componentId, component, contextElement, expression, argKey, argOptions }) => {
16
+ var _a;
16
17
  if (BindEvent({ contextElement, expression,
17
18
  component: (component || componentId),
18
19
  key: StripeDirectiveName,
@@ -39,159 +40,150 @@ export const StripeDirectiveHandler = CreateDirectiveHandlerCallback(StripeDirec
39
40
  elementScope.SetLocal(localKey, CreateInplaceProxy(BuildGetterProxyOptions({
40
41
  getter: (prop) => {
41
42
  var _a;
43
+ let local = (contextElement.parentElement ? (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
42
44
  if (prop === 'parent') {
43
- return (contextElement.parentElement ? (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
45
+ return local;
44
46
  }
47
+ return ((prop && local) ? local[prop] : null);
45
48
  },
46
49
  lookup: ['parent'],
47
50
  })));
48
51
  }
49
52
  return;
50
53
  }
51
- if (argKey in StripeKeys) { //Bind Stripe field
52
- let details = resolvedComponent.FindElementLocalValue(contextElement, detailsKey, true);
53
- if (!details) { //No parent
54
- return;
55
- }
56
- let id = resolvedComponent.GenerateUniqueId(`${StripeDirectiveName}_proxy_`), field = {
57
- name: argKey,
58
- mount: contextElement,
59
- element: details.elements.create(StripeKeys[argKey], {
60
- style: (StripeStyles || undefined),
61
- classes: (StripeClasses || undefined),
62
- }),
63
- ready: false,
64
- complete: false,
65
- error: undefined,
66
- };
67
- if (!field.element) {
68
- return;
69
- }
70
- field.element.mount(contextElement);
71
- details.fields.push(field);
72
- elementScope.SetLocal(localKey, CreateInplaceProxy(BuildGetterProxyOptions({
73
- getter: (prop) => {
74
- var _a, _b, _c, _d;
75
- if (prop === 'complete') {
76
- (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
77
- return field.complete;
78
- }
79
- if (prop === 'focused') {
80
- (_b = FindComponentById(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
81
- return field.focused;
82
- }
83
- if (prop === 'error') {
84
- (_c = FindComponentById(componentId)) === null || _c === void 0 ? void 0 : _c.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
85
- return field.error;
86
- }
87
- if (prop === 'parent') {
88
- return (contextElement.parentElement ? (_d = FindComponentById(componentId)) === null || _d === void 0 ? void 0 : _d.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
89
- }
90
- if (prop === 'clear') {
91
- return () => {
92
- if (field.element) {
93
- field.element.clear();
94
- }
95
- };
96
- }
97
- if (prop === 'focus') {
98
- return () => {
99
- if (field.element) {
100
- field.element.focus();
101
- }
102
- };
103
- }
104
- if (prop === 'blur') {
105
- return () => {
106
- if (field.element) {
107
- field.element.blur();
108
- }
109
- };
110
- }
111
- },
112
- lookup: ['complete', 'focused', 'error', 'parent', 'clear', 'focus', 'blur'],
113
- })));
114
- let fields = details.fields;
115
- elementScope.AddUninitCallback(() => {
116
- var _a;
117
- (_a = field.element) === null || _a === void 0 ? void 0 : _a.destroy();
118
- fields.splice(fields.indexOf(field), 1);
119
- });
120
- field.element.on('ready', () => {
121
- if (!field.ready) {
122
- field.ready = true;
123
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.ready`));
124
- details.onReady();
125
- }
126
- });
127
- field.element.on('change', (e) => {
128
- var _a, _b;
129
- if ((e === null || e === void 0 ? void 0 : e.complete) === field.complete) {
54
+ if (StripeKeys.hasOwnProperty(argKey)) { //Bind Stripe field
55
+ return (_a = resolvedComponent.FindElementLocalValue(contextElement, detailsKey, true)) === null || _a === void 0 ? void 0 : _a.addField(argKey, contextElement, (field, details) => {
56
+ let resolvedComponent = FindComponentById(componentId), elementScope = resolvedComponent === null || resolvedComponent === void 0 ? void 0 : resolvedComponent.FindElementScope(contextElement);
57
+ let id = resolvedComponent === null || resolvedComponent === void 0 ? void 0 : resolvedComponent.GenerateUniqueId(`${StripeDirectiveName}_proxy_`);
58
+ if (!field.element) {
130
59
  return;
131
60
  }
132
- field.complete = e === null || e === void 0 ? void 0 : e.complete;
133
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.complete`, {
134
- detail: {
135
- completed: e === null || e === void 0 ? void 0 : e.complete,
136
- },
137
- }));
138
- if (field.complete) {
139
- if (field.error) {
140
- field.error = undefined;
141
- AddChanges('set', `${id}.error`, 'error', (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
142
- }
143
- if (details.options.autofocus) { //Focus next if any
144
- let index = details.fields.indexOf(field);
145
- if (index != -1 && index < (details.fields.length - 1)) {
146
- let nextField = details.fields[index + 1];
147
- if (nextField.element) {
148
- nextField.element.focus();
149
- }
150
- else if ('focus' in nextField.mount && typeof nextField.mount.focus === 'function') {
151
- nextField.mount.focus();
152
- }
61
+ elementScope === null || elementScope === void 0 ? void 0 : elementScope.SetLocal(localKey, CreateInplaceProxy(BuildGetterProxyOptions({
62
+ getter: (prop) => {
63
+ var _a, _b, _c, _d, _e;
64
+ if (prop === 'complete') {
65
+ (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
66
+ return field.complete;
67
+ }
68
+ if (prop === 'focused') {
69
+ (_b = FindComponentById(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
70
+ return field.focused;
71
+ }
72
+ if (prop === 'error') {
73
+ (_c = FindComponentById(componentId)) === null || _c === void 0 ? void 0 : _c.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
74
+ return field.error;
75
+ }
76
+ if (prop === 'parent') {
77
+ return (contextElement.parentElement ? (_d = FindComponentById(componentId)) === null || _d === void 0 ? void 0 : _d.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
78
+ }
79
+ if (prop === 'clear') {
80
+ return () => {
81
+ if (field.element) {
82
+ field.element.clear();
83
+ }
84
+ };
85
+ }
86
+ if (prop === 'focus') {
87
+ return () => {
88
+ if (field.element) {
89
+ field.element.focus();
90
+ }
91
+ };
92
+ }
93
+ if (prop === 'blur') {
94
+ return () => {
95
+ if (field.element) {
96
+ field.element.blur();
97
+ }
98
+ };
153
99
  }
154
- else if (details.specialMounts.submit) {
155
- details.specialMounts.submit.focus();
100
+ if (prop === 'disable') {
101
+ return (state = true) => {
102
+ if (field.element) {
103
+ field.element.update({ disabled: state });
104
+ }
105
+ };
156
106
  }
107
+ let local = (contextElement.parentElement ? (_e = FindComponentById(componentId)) === null || _e === void 0 ? void 0 : _e.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
108
+ return ((prop && local) ? local[prop] : null);
109
+ },
110
+ lookup: ['complete', 'focused', 'error', 'parent', 'clear', 'focus', 'blur', 'disable'],
111
+ })));
112
+ field.element.on('ready', () => {
113
+ if (!field.ready) {
114
+ field.ready = true;
115
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.ready`));
116
+ details.onReady();
157
117
  }
158
- }
159
- else if ((e === null || e === void 0 ? void 0 : e.error) && e.error.message !== field.error) {
160
- field.error = e.error.message;
161
- AddChanges('set', `${id}.error`, 'error', (_b = FindComponentById(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes);
162
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.error`, {
163
- detail: {
164
- message: e.error.message,
165
- },
166
- }));
167
- }
168
- details.onChange();
169
- });
170
- field.element.on('focus', () => {
171
- var _a;
172
- if (!field.focused) {
173
- field.focused = true;
174
- AddChanges('set', `${id}.focused`, 'focused', (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
175
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
176
- detail: {
177
- focused: true,
178
- },
179
- }));
180
- }
181
- });
182
- field.element.on('blur', () => {
183
- var _a;
184
- if (field.focused) {
185
- field.focused = false;
186
- AddChanges('set', `${id}.focused`, 'focused', (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
187
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
118
+ });
119
+ field.element.on('change', (e) => {
120
+ var _a, _b;
121
+ if ((e === null || e === void 0 ? void 0 : e.complete) === field.complete) {
122
+ return;
123
+ }
124
+ field.complete = e === null || e === void 0 ? void 0 : e.complete;
125
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.complete`, {
188
126
  detail: {
189
- focused: false,
127
+ completed: e === null || e === void 0 ? void 0 : e.complete,
190
128
  },
191
129
  }));
192
- }
130
+ if (field.complete) {
131
+ if (field.error) {
132
+ field.error = undefined;
133
+ AddChanges('set', `${id}.error`, 'error', (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
134
+ }
135
+ if (details.options.autofocus) { //Focus next if any
136
+ let index = details.fields.indexOf(field);
137
+ if (index != -1 && index < (details.fields.length - 1)) {
138
+ let nextField = details.fields[index + 1];
139
+ if (nextField.element) {
140
+ nextField.element.focus();
141
+ }
142
+ else if ('focus' in nextField.mount && typeof nextField.mount.focus === 'function') {
143
+ nextField.mount.focus();
144
+ }
145
+ }
146
+ else if (details.specialMounts.submit) {
147
+ details.specialMounts.submit.focus();
148
+ }
149
+ }
150
+ }
151
+ else if ((e === null || e === void 0 ? void 0 : e.error) && e.error.message !== field.error) {
152
+ field.error = e.error.message;
153
+ AddChanges('set', `${id}.error`, 'error', (_b = FindComponentById(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes);
154
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.error`, {
155
+ detail: {
156
+ message: e.error.message,
157
+ },
158
+ }));
159
+ }
160
+ details.onChange();
161
+ });
162
+ field.element.on('focus', () => {
163
+ var _a;
164
+ if (!field.focused) {
165
+ field.focused = true;
166
+ AddChanges('set', `${id}.focused`, 'focused', (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
167
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
168
+ detail: {
169
+ focused: true,
170
+ },
171
+ }));
172
+ }
173
+ });
174
+ field.element.on('blur', () => {
175
+ var _a;
176
+ if (field.focused) {
177
+ field.focused = false;
178
+ AddChanges('set', `${id}.focused`, 'focused', (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
179
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
180
+ detail: {
181
+ focused: false,
182
+ },
183
+ }));
184
+ }
185
+ });
193
186
  });
194
- return;
195
187
  }
196
188
  let stripeInstance = null, elements = null, backlog = new Array(), init = () => {
197
189
  EvaluateLater({ componentId, contextElement, expression })((value) => {
@@ -230,6 +222,31 @@ export const StripeDirectiveHandler = CreateDirectiveHandlerCallback(StripeDirec
230
222
  }
231
223
  };
232
224
  let details = { fields, specialMounts, options,
225
+ addField(key, target, callback) {
226
+ let add = () => {
227
+ var _a, _b;
228
+ let field = {
229
+ name: key,
230
+ mount: target,
231
+ element: elements.create(StripeKeys[key], {
232
+ style: (StripeStyles || undefined),
233
+ classes: (StripeClasses || undefined),
234
+ }),
235
+ ready: false,
236
+ complete: false,
237
+ error: undefined,
238
+ };
239
+ field.element.mount(target);
240
+ this.fields.push(field);
241
+ (_b = (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.FindElementScope(target)) === null || _b === void 0 ? void 0 : _b.AddUninitCallback(() => {
242
+ var _a;
243
+ (_a = field.element) === null || _a === void 0 ? void 0 : _a.destroy();
244
+ this.fields = this.fields.filter(item => (item !== field));
245
+ });
246
+ callback(field, this);
247
+ };
248
+ elements ? add() : backlog.push(add);
249
+ },
233
250
  onReady: () => { var _a; return AddChanges('set', `${id}.readyCount`, 'readyCount', (_a = FindComponentById(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes); },
234
251
  onChange: () => {
235
252
  var _a;
@@ -387,9 +404,9 @@ export const StripeDirectiveHandler = CreateDirectiveHandlerCallback(StripeDirec
387
404
  };
388
405
  }
389
406
  if (prop === 'setup') {
390
- return (clientSecret, paymentMethod, save = false) => {
407
+ return (clientSecret, paymentMethod) => {
391
408
  payOrSetup(() => {
392
- let paymentDetails = getPaymentDetails(paymentMethod, save);
409
+ let paymentDetails = getPaymentDetails(paymentMethod, false);
393
410
  if (paymentDetails) {
394
411
  stripeInstance === null || stripeInstance === void 0 ? void 0 : stripeInstance.confirmCardSetup(clientSecret, paymentDetails).then(onSuccess).catch(onError);
395
412
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@benbraide/inlinejs-stripe",
3
- "version": "1.0.6",
3
+ "version": "1.0.7",
4
4
  "description": "Run javascript code by embedding them in your HTML using the element as context.",
5
5
  "main": "./lib/common/index.js",
6
6
  "module": "./lib/esm/index.js",