@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.
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
  }