@pro6pp/infer-react 0.0.2-beta.11 → 0.0.2-beta.13

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 (3) hide show
  1. package/dist/index.cjs +51 -11
  2. package/dist/index.js +51 -11
  3. package/package.json +2 -2
package/dist/index.cjs CHANGED
@@ -199,9 +199,10 @@ var InferCore = class {
199
199
  if (this.state.stage === "final" || isFullResult) {
200
200
  let finalQuery = label;
201
201
  if (valueObj && Object.keys(valueObj).length > 0) {
202
- const { street, street_number, city } = valueObj;
202
+ const { street, street_number, city, addition } = valueObj;
203
203
  if (street && street_number && city) {
204
- finalQuery = `${street} ${street_number}, ${city}`;
204
+ const suffix = addition ? ` ${addition}` : "";
205
+ finalQuery = `${street} ${street_number}${suffix}, ${city}`;
205
206
  }
206
207
  }
207
208
  this.finishSelection(finalQuery, valueObj);
@@ -241,7 +242,12 @@ var InferCore = class {
241
242
  nextQuery = `${subtitle}, ${text}, `;
242
243
  } else {
243
244
  const prefix = this.getQueryPrefix(query);
244
- nextQuery = prefix ? `${prefix} ${text}, ${subtitle}, ` : `${text}, ${subtitle}, `;
245
+ const shouldAddSubtitle = !prefix || !prefix.includes(subtitle);
246
+ if (shouldAddSubtitle) {
247
+ nextQuery = prefix ? `${prefix} ${text}, ${subtitle}, ` : `${text}, ${subtitle}, `;
248
+ } else {
249
+ nextQuery = prefix ? `${prefix} ${text}, ` : `${text}, `;
250
+ }
245
251
  }
246
252
  this.updateQueryAndFetch(nextQuery);
247
253
  return;
@@ -341,6 +347,9 @@ var InferCore = class {
341
347
  }
342
348
  newState.isValid = data.stage === "final";
343
349
  this.updateState(newState);
350
+ if (newState.isValid && uniqueSuggestions.length === 1) {
351
+ this.selectItem(uniqueSuggestions[0]);
352
+ }
344
353
  }
345
354
  updateQueryAndFetch(nextQuery) {
346
355
  this.updateState({ query: nextQuery, suggestions: [], cities: [], streets: [] });
@@ -435,6 +444,12 @@ var DEFAULT_STYLES = `
435
444
  appearance: none;
436
445
  transition: border-color 0.2s, box-shadow 0.2s;
437
446
  }
447
+
448
+ .pro6pp-input::placeholder {
449
+ font-size: 16px;
450
+ color: #a3a3a3;
451
+ }
452
+
438
453
  .pro6pp-input:focus {
439
454
  outline: none;
440
455
  border-color: #3b82f6;
@@ -457,8 +472,8 @@ var DEFAULT_STYLES = `
457
472
  .pro6pp-clear-button {
458
473
  background: none;
459
474
  border: none;
460
- width: 40px;
461
- height: 40px;
475
+ width: 32px;
476
+ height: 32px;
462
477
  cursor: pointer;
463
478
  color: #a3a3a3;
464
479
  display: flex;
@@ -503,7 +518,7 @@ var DEFAULT_STYLES = `
503
518
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
504
519
  z-index: 9999;
505
520
  padding: 0;
506
- max-height: 260px;
521
+ max-height: 280px;
507
522
  overflow-y: auto;
508
523
  display: flex;
509
524
  flex-direction: column;
@@ -511,7 +526,7 @@ var DEFAULT_STYLES = `
511
526
 
512
527
  @media (max-height: 500px) {
513
528
  .pro6pp-dropdown {
514
- max-height: 140px;
529
+ max-height: 180px;
515
530
  }
516
531
  }
517
532
 
@@ -527,7 +542,8 @@ var DEFAULT_STYLES = `
527
542
  cursor: pointer;
528
543
  display: flex;
529
544
  align-items: center;
530
- font-size: 14px;
545
+ font-size: 15px;
546
+ line-height: 1.4;
531
547
  color: #374151;
532
548
  border-bottom: 1px solid #f3f4f6;
533
549
  transition: background-color 0.1s;
@@ -550,18 +566,24 @@ var DEFAULT_STYLES = `
550
566
 
551
567
  .pro6pp-item__label {
552
568
  font-weight: 500;
553
- flex-shrink: 0;
569
+ flex-shrink: 1;
570
+ overflow: hidden;
571
+ text-overflow: ellipsis;
572
+ white-space: nowrap;
554
573
  }
574
+
555
575
  .pro6pp-item__subtitle {
556
- font-size: 14px;
576
+ font-size: 13px;
557
577
  color: #6b7280;
558
- flex-grow: 1;
578
+ flex-shrink: 0;
559
579
  }
580
+
560
581
  .pro6pp-item__chevron {
561
582
  color: #d1d5db;
562
583
  display: flex;
563
584
  align-items: center;
564
585
  margin-left: auto;
586
+ padding-left: 8px;
565
587
  }
566
588
 
567
589
  .pro6pp-no-results {
@@ -585,6 +607,24 @@ var DEFAULT_STYLES = `
585
607
  touch-action: manipulation;
586
608
  }
587
609
 
610
+ @media (max-width: 640px) {
611
+ .pro6pp-input {
612
+ font-size: 16px;
613
+ padding: 10px 12px;
614
+ }
615
+ .pro6pp-item {
616
+ padding: 10px 12px;
617
+ font-size: 14px;
618
+ }
619
+ .pro6pp-item__subtitle {
620
+ font-size: 12px;
621
+ }
622
+ .pro6pp-load-more {
623
+ padding: 12px;
624
+ font-size: 13px;
625
+ }
626
+ }
627
+
588
628
  .pro6pp-load-more:active {
589
629
  background-color: #f3f4f6;
590
630
  }
package/dist/index.js CHANGED
@@ -173,9 +173,10 @@ var InferCore = class {
173
173
  if (this.state.stage === "final" || isFullResult) {
174
174
  let finalQuery = label;
175
175
  if (valueObj && Object.keys(valueObj).length > 0) {
176
- const { street, street_number, city } = valueObj;
176
+ const { street, street_number, city, addition } = valueObj;
177
177
  if (street && street_number && city) {
178
- finalQuery = `${street} ${street_number}, ${city}`;
178
+ const suffix = addition ? ` ${addition}` : "";
179
+ finalQuery = `${street} ${street_number}${suffix}, ${city}`;
179
180
  }
180
181
  }
181
182
  this.finishSelection(finalQuery, valueObj);
@@ -215,7 +216,12 @@ var InferCore = class {
215
216
  nextQuery = `${subtitle}, ${text}, `;
216
217
  } else {
217
218
  const prefix = this.getQueryPrefix(query);
218
- nextQuery = prefix ? `${prefix} ${text}, ${subtitle}, ` : `${text}, ${subtitle}, `;
219
+ const shouldAddSubtitle = !prefix || !prefix.includes(subtitle);
220
+ if (shouldAddSubtitle) {
221
+ nextQuery = prefix ? `${prefix} ${text}, ${subtitle}, ` : `${text}, ${subtitle}, `;
222
+ } else {
223
+ nextQuery = prefix ? `${prefix} ${text}, ` : `${text}, `;
224
+ }
219
225
  }
220
226
  this.updateQueryAndFetch(nextQuery);
221
227
  return;
@@ -315,6 +321,9 @@ var InferCore = class {
315
321
  }
316
322
  newState.isValid = data.stage === "final";
317
323
  this.updateState(newState);
324
+ if (newState.isValid && uniqueSuggestions.length === 1) {
325
+ this.selectItem(uniqueSuggestions[0]);
326
+ }
318
327
  }
319
328
  updateQueryAndFetch(nextQuery) {
320
329
  this.updateState({ query: nextQuery, suggestions: [], cities: [], streets: [] });
@@ -409,6 +418,12 @@ var DEFAULT_STYLES = `
409
418
  appearance: none;
410
419
  transition: border-color 0.2s, box-shadow 0.2s;
411
420
  }
421
+
422
+ .pro6pp-input::placeholder {
423
+ font-size: 16px;
424
+ color: #a3a3a3;
425
+ }
426
+
412
427
  .pro6pp-input:focus {
413
428
  outline: none;
414
429
  border-color: #3b82f6;
@@ -431,8 +446,8 @@ var DEFAULT_STYLES = `
431
446
  .pro6pp-clear-button {
432
447
  background: none;
433
448
  border: none;
434
- width: 40px;
435
- height: 40px;
449
+ width: 32px;
450
+ height: 32px;
436
451
  cursor: pointer;
437
452
  color: #a3a3a3;
438
453
  display: flex;
@@ -477,7 +492,7 @@ var DEFAULT_STYLES = `
477
492
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
478
493
  z-index: 9999;
479
494
  padding: 0;
480
- max-height: 260px;
495
+ max-height: 280px;
481
496
  overflow-y: auto;
482
497
  display: flex;
483
498
  flex-direction: column;
@@ -485,7 +500,7 @@ var DEFAULT_STYLES = `
485
500
 
486
501
  @media (max-height: 500px) {
487
502
  .pro6pp-dropdown {
488
- max-height: 140px;
503
+ max-height: 180px;
489
504
  }
490
505
  }
491
506
 
@@ -501,7 +516,8 @@ var DEFAULT_STYLES = `
501
516
  cursor: pointer;
502
517
  display: flex;
503
518
  align-items: center;
504
- font-size: 14px;
519
+ font-size: 15px;
520
+ line-height: 1.4;
505
521
  color: #374151;
506
522
  border-bottom: 1px solid #f3f4f6;
507
523
  transition: background-color 0.1s;
@@ -524,18 +540,24 @@ var DEFAULT_STYLES = `
524
540
 
525
541
  .pro6pp-item__label {
526
542
  font-weight: 500;
527
- flex-shrink: 0;
543
+ flex-shrink: 1;
544
+ overflow: hidden;
545
+ text-overflow: ellipsis;
546
+ white-space: nowrap;
528
547
  }
548
+
529
549
  .pro6pp-item__subtitle {
530
- font-size: 14px;
550
+ font-size: 13px;
531
551
  color: #6b7280;
532
- flex-grow: 1;
552
+ flex-shrink: 0;
533
553
  }
554
+
534
555
  .pro6pp-item__chevron {
535
556
  color: #d1d5db;
536
557
  display: flex;
537
558
  align-items: center;
538
559
  margin-left: auto;
560
+ padding-left: 8px;
539
561
  }
540
562
 
541
563
  .pro6pp-no-results {
@@ -559,6 +581,24 @@ var DEFAULT_STYLES = `
559
581
  touch-action: manipulation;
560
582
  }
561
583
 
584
+ @media (max-width: 640px) {
585
+ .pro6pp-input {
586
+ font-size: 16px;
587
+ padding: 10px 12px;
588
+ }
589
+ .pro6pp-item {
590
+ padding: 10px 12px;
591
+ font-size: 14px;
592
+ }
593
+ .pro6pp-item__subtitle {
594
+ font-size: 12px;
595
+ }
596
+ .pro6pp-load-more {
597
+ padding: 12px;
598
+ font-size: 13px;
599
+ }
600
+ }
601
+
562
602
  .pro6pp-load-more:active {
563
603
  background-color: #f3f4f6;
564
604
  }
package/package.json CHANGED
@@ -20,7 +20,7 @@
20
20
  "url": "https://github.com/pro6pp/infer-sdk/issues"
21
21
  },
22
22
  "sideEffects": false,
23
- "version": "0.0.2-beta.11",
23
+ "version": "0.0.2-beta.13",
24
24
  "main": "./dist/index.cjs",
25
25
  "module": "./dist/index.js",
26
26
  "types": "./dist/index.d.ts",
@@ -46,7 +46,7 @@
46
46
  "react": ">=16"
47
47
  },
48
48
  "dependencies": {
49
- "@pro6pp/infer-core": "0.0.2-beta.9"
49
+ "@pro6pp/infer-core": "0.0.2-beta.11"
50
50
  },
51
51
  "devDependencies": {
52
52
  "@testing-library/dom": "^10.4.1",