@benbraide/inlinejs-stripe 1.0.6 → 1.0.7

Sign up to get free protection for your applications and to get access to all the features.
Files changed (5) hide show
  1. package/dist/inlinejs-stripe.js +155 -138
  2. package/dist/inlinejs-stripe.min.js +1 -1
  3. package/lib/common/directive/stripe.js +155 -138
  4. package/lib/esm/directive/stripe.js +155 -138
  5. package/package.json +1 -1
package/dist/inlinejs-stripe.js CHANGED
@@ -5303,6 +5303,7 @@ let StripeUrl = 'https://js.stripe.com/v3/';
5303
5303
  let StripeStyles = null;
5304
5304
  let StripeClasses = null;
5305
5305
  exports.StripeDirectiveHandler = (0, inlinejs_1.CreateDirectiveHandlerCallback)(StripeDirectiveName, ({ componentId, component, contextElement, expression, argKey, argOptions }) => {
5306
+ var _a;
5306
5307
  if ((0, inlinejs_1.BindEvent)({ contextElement, expression,
5307
5308
  component: (component || componentId),
5308
5309
  key: StripeDirectiveName,
@@ -5329,159 +5330,150 @@ exports.StripeDirectiveHandler = (0, inlinejs_1.CreateDirectiveHandlerCallback)(
5329
5330
  elementScope.SetLocal(localKey, (0, inlinejs_1.CreateInplaceProxy)((0, inlinejs_1.BuildGetterProxyOptions)({
5330
5331
  getter: (prop) => {
5331
5332
  var _a;
5333
+ let local = (contextElement.parentElement ? (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
5332
5334
  if (prop === 'parent') {
5333
- return (contextElement.parentElement ? (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
5335
+ return local;
5334
5336
  }
5337
+ return ((prop && local) ? local[prop] : null);
5335
5338
  },
5336
5339
  lookup: ['parent'],
5337
5340
  })));
5338
5341
  }
5339
5342
  return;
5340
5343
  }
5341
- if (argKey in StripeKeys) { //Bind Stripe field
5342
- let details = resolvedComponent.FindElementLocalValue(contextElement, detailsKey, true);
5343
- if (!details) { //No parent
5344
- return;
5345
- }
5346
- let id = resolvedComponent.GenerateUniqueId(`${StripeDirectiveName}_proxy_`), field = {
5347
- name: argKey,
5348
- mount: contextElement,
5349
- element: details.elements.create(StripeKeys[argKey], {
5350
- style: (StripeStyles || undefined),
5351
- classes: (StripeClasses || undefined),
5352
- }),
5353
- ready: false,
5354
- complete: false,
5355
- error: undefined,
5356
- };
5357
- if (!field.element) {
5358
- return;
5359
- }
5360
- field.element.mount(contextElement);
5361
- details.fields.push(field);
5362
- elementScope.SetLocal(localKey, (0, inlinejs_1.CreateInplaceProxy)((0, inlinejs_1.BuildGetterProxyOptions)({
5363
- getter: (prop) => {
5364
- var _a, _b, _c, _d;
5365
- if (prop === 'complete') {
5366
- (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
5367
- return field.complete;
5368
- }
5369
- if (prop === 'focused') {
5370
- (_b = (0, inlinejs_1.FindComponentById)(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
5371
- return field.focused;
5372
- }
5373
- if (prop === 'error') {
5374
- (_c = (0, inlinejs_1.FindComponentById)(componentId)) === null || _c === void 0 ? void 0 : _c.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
5375
- return field.error;
5376
- }
5377
- if (prop === 'parent') {
5378
- return (contextElement.parentElement ? (_d = (0, inlinejs_1.FindComponentById)(componentId)) === null || _d === void 0 ? void 0 : _d.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
5379
- }
5380
- if (prop === 'clear') {
5381
- return () => {
5382
- if (field.element) {
5383
- field.element.clear();
5384
- }
5385
- };
5386
- }
5387
- if (prop === 'focus') {
5388
- return () => {
5389
- if (field.element) {
5390
- field.element.focus();
5391
- }
5392
- };
5393
- }
5394
- if (prop === 'blur') {
5395
- return () => {
5396
- if (field.element) {
5397
- field.element.blur();
5398
- }
5399
- };
5400
- }
5401
- },
5402
- lookup: ['complete', 'focused', 'error', 'parent', 'clear', 'focus', 'blur'],
5403
- })));
5404
- let fields = details.fields;
5405
- elementScope.AddUninitCallback(() => {
5406
- var _a;
5407
- (_a = field.element) === null || _a === void 0 ? void 0 : _a.destroy();
5408
- fields.splice(fields.indexOf(field), 1);
5409
- });
5410
- field.element.on('ready', () => {
5411
- if (!field.ready) {
5412
- field.ready = true;
5413
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.ready`));
5414
- details.onReady();
5415
- }
5416
- });
5417
- field.element.on('change', (e) => {
5418
- var _a, _b;
5419
- if ((e === null || e === void 0 ? void 0 : e.complete) === field.complete) {
5344
+ if (StripeKeys.hasOwnProperty(argKey)) { //Bind Stripe field
5345
+ return (_a = resolvedComponent.FindElementLocalValue(contextElement, detailsKey, true)) === null || _a === void 0 ? void 0 : _a.addField(argKey, contextElement, (field, details) => {
5346
+ let resolvedComponent = (0, inlinejs_1.FindComponentById)(componentId), elementScope = resolvedComponent === null || resolvedComponent === void 0 ? void 0 : resolvedComponent.FindElementScope(contextElement);
5347
+ let id = resolvedComponent === null || resolvedComponent === void 0 ? void 0 : resolvedComponent.GenerateUniqueId(`${StripeDirectiveName}_proxy_`);
5348
+ if (!field.element) {
5420
5349
  return;
5421
5350
  }
5422
- field.complete = e === null || e === void 0 ? void 0 : e.complete;
5423
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.complete`, {
5424
- detail: {
5425
- completed: e === null || e === void 0 ? void 0 : e.complete,
5426
- },
5427
- }));
5428
- if (field.complete) {
5429
- if (field.error) {
5430
- field.error = undefined;
5431
- (0, inlinejs_1.AddChanges)('set', `${id}.error`, 'error', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
5432
- }
5433
- if (details.options.autofocus) { //Focus next if any
5434
- let index = details.fields.indexOf(field);
5435
- if (index != -1 && index < (details.fields.length - 1)) {
5436
- let nextField = details.fields[index + 1];
5437
- if (nextField.element) {
5438
- nextField.element.focus();
5439
- }
5440
- else if ('focus' in nextField.mount && typeof nextField.mount.focus === 'function') {
5441
- nextField.mount.focus();
5442
- }
5351
+ elementScope === null || elementScope === void 0 ? void 0 : elementScope.SetLocal(localKey, (0, inlinejs_1.CreateInplaceProxy)((0, inlinejs_1.BuildGetterProxyOptions)({
5352
+ getter: (prop) => {
5353
+ var _a, _b, _c, _d, _e;
5354
+ if (prop === 'complete') {
5355
+ (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
5356
+ return field.complete;
5357
+ }
5358
+ if (prop === 'focused') {
5359
+ (_b = (0, inlinejs_1.FindComponentById)(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
5360
+ return field.focused;
5361
+ }
5362
+ if (prop === 'error') {
5363
+ (_c = (0, inlinejs_1.FindComponentById)(componentId)) === null || _c === void 0 ? void 0 : _c.GetBackend().changes.AddGetAccess(`${id}.${prop}`);
5364
+ return field.error;
5365
+ }
5366
+ if (prop === 'parent') {
5367
+ return (contextElement.parentElement ? (_d = (0, inlinejs_1.FindComponentById)(componentId)) === null || _d === void 0 ? void 0 : _d.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
5368
+ }
5369
+ if (prop === 'clear') {
5370
+ return () => {
5371
+ if (field.element) {
5372
+ field.element.clear();
5373
+ }
5374
+ };
5375
+ }
5376
+ if (prop === 'focus') {
5377
+ return () => {
5378
+ if (field.element) {
5379
+ field.element.focus();
5380
+ }
5381
+ };
5382
+ }
5383
+ if (prop === 'blur') {
5384
+ return () => {
5385
+ if (field.element) {
5386
+ field.element.blur();
5387
+ }
5388
+ };
5443
5389
  }
5444
- else if (details.specialMounts.submit) {
5445
- details.specialMounts.submit.focus();
5390
+ if (prop === 'disable') {
5391
+ return (state = true) => {
5392
+ if (field.element) {
5393
+ field.element.update({ disabled: state });
5394
+ }
5395
+ };
5446
5396
  }
5397
+ let local = (contextElement.parentElement ? (_e = (0, inlinejs_1.FindComponentById)(componentId)) === null || _e === void 0 ? void 0 : _e.FindElementLocalValue(contextElement.parentElement, localKey, true) : null);
5398
+ return ((prop && local) ? local[prop] : null);
5399
+ },
5400
+ lookup: ['complete', 'focused', 'error', 'parent', 'clear', 'focus', 'blur', 'disable'],
5401
+ })));
5402
+ field.element.on('ready', () => {
5403
+ if (!field.ready) {
5404
+ field.ready = true;
5405
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.ready`));
5406
+ details.onReady();
5447
5407
  }
5448
- }
5449
- else if ((e === null || e === void 0 ? void 0 : e.error) && e.error.message !== field.error) {
5450
- field.error = e.error.message;
5451
- (0, inlinejs_1.AddChanges)('set', `${id}.error`, 'error', (_b = (0, inlinejs_1.FindComponentById)(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes);
5452
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.error`, {
5453
- detail: {
5454
- message: e.error.message,
5455
- },
5456
- }));
5457
- }
5458
- details.onChange();
5459
- });
5460
- field.element.on('focus', () => {
5461
- var _a;
5462
- if (!field.focused) {
5463
- field.focused = true;
5464
- (0, inlinejs_1.AddChanges)('set', `${id}.focused`, 'focused', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
5465
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
5466
- detail: {
5467
- focused: true,
5468
- },
5469
- }));
5470
- }
5471
- });
5472
- field.element.on('blur', () => {
5473
- var _a;
5474
- if (field.focused) {
5475
- field.focused = false;
5476
- (0, inlinejs_1.AddChanges)('set', `${id}.focused`, 'focused', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
5477
- field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
5408
+ });
5409
+ field.element.on('change', (e) => {
5410
+ var _a, _b;
5411
+ if ((e === null || e === void 0 ? void 0 : e.complete) === field.complete) {
5412
+ return;
5413
+ }
5414
+ field.complete = e === null || e === void 0 ? void 0 : e.complete;
5415
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.complete`, {
5478
5416
  detail: {
5479
- focused: false,
5417
+ completed: e === null || e === void 0 ? void 0 : e.complete,
5480
5418
  },
5481
5419
  }));
5482
- }
5420
+ if (field.complete) {
5421
+ if (field.error) {
5422
+ field.error = undefined;
5423
+ (0, inlinejs_1.AddChanges)('set', `${id}.error`, 'error', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
5424
+ }
5425
+ if (details.options.autofocus) { //Focus next if any
5426
+ let index = details.fields.indexOf(field);
5427
+ if (index != -1 && index < (details.fields.length - 1)) {
5428
+ let nextField = details.fields[index + 1];
5429
+ if (nextField.element) {
5430
+ nextField.element.focus();
5431
+ }
5432
+ else if ('focus' in nextField.mount && typeof nextField.mount.focus === 'function') {
5433
+ nextField.mount.focus();
5434
+ }
5435
+ }
5436
+ else if (details.specialMounts.submit) {
5437
+ details.specialMounts.submit.focus();
5438
+ }
5439
+ }
5440
+ }
5441
+ else if ((e === null || e === void 0 ? void 0 : e.error) && e.error.message !== field.error) {
5442
+ field.error = e.error.message;
5443
+ (0, inlinejs_1.AddChanges)('set', `${id}.error`, 'error', (_b = (0, inlinejs_1.FindComponentById)(componentId)) === null || _b === void 0 ? void 0 : _b.GetBackend().changes);
5444
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.error`, {
5445
+ detail: {
5446
+ message: e.error.message,
5447
+ },
5448
+ }));
5449
+ }
5450
+ details.onChange();
5451
+ });
5452
+ field.element.on('focus', () => {
5453
+ var _a;
5454
+ if (!field.focused) {
5455
+ field.focused = true;
5456
+ (0, inlinejs_1.AddChanges)('set', `${id}.focused`, 'focused', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
5457
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
5458
+ detail: {
5459
+ focused: true,
5460
+ },
5461
+ }));
5462
+ }
5463
+ });
5464
+ field.element.on('blur', () => {
5465
+ var _a;
5466
+ if (field.focused) {
5467
+ field.focused = false;
5468
+ (0, inlinejs_1.AddChanges)('set', `${id}.focused`, 'focused', (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.GetBackend().changes);
5469
+ field.mount.dispatchEvent(new CustomEvent(`${StripeDirectiveName}.focus`, {
5470
+ detail: {
5471
+ focused: false,
5472
+ },
5473
+ }));
5474
+ }
5475
+ });
5483
5476
  });
5484
- return;
5485
5477
  }
5486
5478
  let stripeInstance = null, elements = null, backlog = new Array(), init = () => {
5487
5479
  (0, inlinejs_1.EvaluateLater)({ componentId, contextElement, expression })((value) => {
@@ -5520,6 +5512,31 @@ exports.StripeDirectiveHandler = (0, inlinejs_1.CreateDirectiveHandlerCallback)(
5520
5512
  }
5521
5513
  };
5522
5514
  let details = { fields, specialMounts, options,
5515
+ addField(key, target, callback) {
5516
+ let add = () => {
5517
+ var _a, _b;
5518
+ let field = {
5519
+ name: key,
5520
+ mount: target,
5521
+ element: elements.create(StripeKeys[key], {
5522
+ style: (StripeStyles || undefined),
5523
+ classes: (StripeClasses || undefined),
5524
+ }),
5525
+ ready: false,
5526
+ complete: false,
5527
+ error: undefined,
5528
+ };
5529
+ field.element.mount(target);
5530
+ this.fields.push(field);
5531
+ (_b = (_a = (0, inlinejs_1.FindComponentById)(componentId)) === null || _a === void 0 ? void 0 : _a.FindElementScope(target)) === null || _b === void 0 ? void 0 : _b.AddUninitCallback(() => {
5532
+ var _a;
5533
+ (_a = field.element) === null || _a === void 0 ? void 0 : _a.destroy();
5534
+ this.fields = this.fields.filter(item => (item !== field));
5535
+ });
5536
+ callback(field, this);
5537
+ };
5538
+ elements ? add() : backlog.push(add);
5539
+ },
5523
5540
  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); },
5524
5541
  onChange: () => {
5525
5542
  var _a;
@@ -5677,9 +5694,9 @@ exports.StripeDirectiveHandler = (0, inlinejs_1.CreateDirectiveHandlerCallback)(
5677
5694
  };
5678
5695
  }
5679
5696
  if (prop === 'setup') {
5680
- return (clientSecret, paymentMethod, save = false) => {
5697
+ return (clientSecret, paymentMethod) => {
5681
5698
  payOrSetup(() => {
5682
- let paymentDetails = getPaymentDetails(paymentMethod, save);
5699
+ let paymentDetails = getPaymentDetails(paymentMethod, false);
5683
5700
  if (paymentDetails) {
5684
5701
  stripeInstance === null || stripeInstance === void 0 ? void 0 : stripeInstance.confirmCardSetup(clientSecret, paymentDetails).then(onSuccess).catch(onError);
5685
5702
  }