@pro6pp/infer-core 0.0.2-beta.5 → 0.0.2-beta.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 (6) hide show
  1. package/dist/index.cjs +84 -28
  2. package/dist/index.d.cts +106 -33
  3. package/dist/index.d.ts +106 -33
  4. package/dist/index.global.js +85 -29
  5. package/dist/index.js +85 -29
  6. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";var c=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var I=Object.prototype.hasOwnProperty;var w=(n,t,e)=>t in n?c(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e;var C=(n,t)=>{for(var e in t)c(n,e,{get:t[e],enumerable:!0})},T=(n,t,e,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of v(t))!I.call(n,s)&&s!==e&&c(n,s,{get:()=>t[s],enumerable:!(i=y(t,s))||i.enumerable});return n};var F=n=>T(c({},"__esModule",{value:!0}),n);var o=(n,t,e)=>w(n,typeof t!="symbol"?t+"":t,e);var A={};C(A,{DEFAULT_STYLES:()=>b,INITIAL_STATE:()=>h,InferCore:()=>g});module.exports=F(A);var d={API_URL:"https://api.pro6pp.nl/v2",LIMIT:1e3,DEBOUNCE_MS:300},m={DIGITS_1_3:/^[0-9]{1,3}$/},h={query:"",stage:null,cities:[],streets:[],suggestions:[],isValid:!1,isError:!1,isLoading:!1,selectedSuggestionIndex:-1},g=class{constructor(t){o(this,"country");o(this,"authKey");o(this,"apiUrl");o(this,"limit");o(this,"fetcher");o(this,"onStateChange");o(this,"onSelect");o(this,"state");o(this,"abortController",null);o(this,"debouncedFetch");o(this,"isSelecting",!1);this.country=t.country,this.authKey=t.authKey,this.apiUrl=t.apiUrl||d.API_URL,this.limit=t.limit||d.LIMIT,this.fetcher=t.fetcher||((e,i)=>fetch(e,i)),this.onStateChange=t.onStateChange||(()=>{}),this.onSelect=t.onSelect||(()=>{}),this.state={...h},this.debouncedFetch=this.debounce(e=>this.executeFetch(e),d.DEBOUNCE_MS)}handleInput(t){if(this.isSelecting){this.isSelecting=!1;return}let e=this.state.stage==="final"&&t!==this.state.query;this.updateState({query:t,isValid:!1,isLoading:!!t.trim(),selectedSuggestionIndex:-1}),e&&this.onSelect(null),this.debouncedFetch(t)}handleKeyDown(t){let e=t.target;if(!e)return;let i=this.state.cities.length+this.state.streets.length+this.state.suggestions.length;if(i>0){if(t.key==="ArrowDown"){t.preventDefault();let r=this.state.selectedSuggestionIndex+1;r>=i&&(r=0),this.updateState({selectedSuggestionIndex:r});return}if(t.key==="ArrowUp"){t.preventDefault();let r=this.state.selectedSuggestionIndex-1;r<0&&(r=i-1),this.updateState({selectedSuggestionIndex:r});return}if(t.key==="Enter"&&this.state.selectedSuggestionIndex>=0){t.preventDefault();let a=[...this.state.cities,...this.state.streets,...this.state.suggestions][this.state.selectedSuggestionIndex];a&&(this.selectItem(a),this.updateState({selectedSuggestionIndex:-1}));return}}let s=e.value;if(t.key===" "&&this.shouldAutoInsertComma(s)){t.preventDefault();let r=`${s.trim()}, `;this.updateQueryAndFetch(r)}}selectItem(t){this.debouncedFetch.cancel(),this.abortController&&this.abortController.abort();let e=typeof t=="string"?t:t.label,i=e;typeof t!="string"&&typeof t.value=="string"&&(i=t.value);let s=typeof t!="string"&&typeof t.value=="object"?t.value:void 0,r=!!s&&Object.keys(s).length>0;if(this.isSelecting=!0,this.state.stage==="final"||r){let p=e;if(s&&Object.keys(s).length>0){let{street:l,street_number:u,house_number:x,city:f}=s,S=u||x;l&&S&&f&&(p=`${l} ${S}, ${f}`)}this.finishSelection(p,s);return}let a=typeof t!="string"?t.subtitle:null;this.processSelection(i,a)}shouldAutoInsertComma(t){if(!t.includes(",")&&m.DIGITS_1_3.test(t.trim()))return!0;if(this.state.stage==="house_number"){let i=this.getCurrentFragment(t);return m.DIGITS_1_3.test(i)}return!1}finishSelection(t,e){this.updateState({query:t,suggestions:[],cities:[],streets:[],isValid:!0,stage:"final"}),this.onSelect(e||t),setTimeout(()=>{this.isSelecting=!1},0)}processSelection(t,e){let{stage:i,query:s}=this.state,r=s;if(e&&(i==="city"||i==="street"||i==="mixed")){if(i==="city")r=`${e}, ${t}, `;else{let u=this.getQueryPrefix(s);r=u?`${u} ${t}, ${e}, `:`${t}, ${e}, `}this.updateQueryAndFetch(r);return}if(i==="direct"||i==="addition"){this.finishSelection(t);return}!s.includes(",")&&(i==="city"||i==="street"||i==="house_number_first")?r=`${t}, `:(r=this.replaceLastSegment(s,t),i!=="house_number"&&(r+=", ")),this.updateQueryAndFetch(r)}executeFetch(t){let e=(t||"").toString();if(!e.trim()){this.abortController?.abort(),this.resetState();return}this.updateState({isError:!1}),this.abortController&&this.abortController.abort(),this.abortController=new AbortController;let i=new URL(`${this.apiUrl}/infer/${this.country.toLowerCase()}`),s={authKey:this.authKey,query:e,limit:this.limit.toString()};i.search=new URLSearchParams(s).toString(),this.fetcher(i.toString(),{signal:this.abortController.signal}).then(r=>{if(!r.ok)throw new Error("Network error");return r.json()}).then(r=>this.mapResponseToState(r)).catch(r=>{r.name!=="AbortError"&&this.updateState({isError:!0,isLoading:!1})})}mapResponseToState(t){let e={stage:t.stage,isLoading:!1},i=!1,s=null,r=t.suggestions||[],a=[],p=new Set;for(let l of r){let u=`${l.label}|${l.subtitle||""}|${JSON.stringify(l.value||{})}`;p.has(u)||(p.add(u),a.push(l))}if(t.stage==="mixed"?(e.cities=t.cities||[],e.streets=t.streets||[],e.suggestions=[]):(e.suggestions=a,e.cities=[],e.streets=[],t.stage==="final"&&a.length===1&&(i=!0,s=a[0])),e.isValid=t.stage==="final",i&&s){e.query=s.label,e.suggestions=[],e.cities=[],e.streets=[],e.isValid=!0,this.updateState(e);let l=typeof s.value=="object"?s.value:s.label;this.onSelect(l)}else this.updateState(e)}updateQueryAndFetch(t){this.updateState({query:t,suggestions:[],cities:[],streets:[]}),this.updateState({isLoading:!0,isValid:!1}),this.debouncedFetch(t),setTimeout(()=>{this.isSelecting=!1},0)}replaceLastSegment(t,e){let i=t.lastIndexOf(",");return i===-1?e:`${t.slice(0,i+1)} ${e}`.trim()}getQueryPrefix(t){let e=t.lastIndexOf(",");return e===-1?"":t.slice(0,e+1).trimEnd()}getCurrentFragment(t){return(t.split(",").slice(-1)[0]??"").trim()}resetState(){this.updateState({...h,query:this.state.query})}updateState(t){this.state={...this.state,...t},this.onStateChange(this.state)}debounce(t,e){let i,s=(...r)=>{i&&clearTimeout(i),i=setTimeout(()=>t.apply(this,r),e)};return s.cancel=()=>{i&&(clearTimeout(i),i=void 0)},s}};var b=`
1
+ "use strict";var h=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var I=Object.prototype.hasOwnProperty;var w=(a,e,t)=>e in a?h(a,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):a[e]=t;var T=(a,e)=>{for(var t in e)h(a,t,{get:e[t],enumerable:!0})},C=(a,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of v(e))!I.call(a,s)&&s!==t&&h(a,s,{get:()=>e[s],enumerable:!(i=y(e,s))||i.enumerable});return a};var L=a=>C(h({},"__esModule",{value:!0}),a);var l=(a,e,t)=>w(a,typeof e!="symbol"?e+"":e,t);var _={};T(_,{DEFAULT_STYLES:()=>S,INITIAL_STATE:()=>g,InferCore:()=>f});module.exports=L(_);var c={API_URL:"https://api.pro6pp.nl/v2",LIMIT:20,DEBOUNCE_MS:150,MIN_DEBOUNCE_MS:50,MAX_RETRIES:0},x={DIGITS_1_3:/^[0-9]{1,3}$/},g={query:"",stage:null,cities:[],streets:[],suggestions:[],isValid:!1,isError:!1,isLoading:!1,hasMore:!1,selectedSuggestionIndex:-1},f=class{constructor(e){l(this,"country");l(this,"authKey");l(this,"apiUrl");l(this,"baseLimit");l(this,"currentLimit");l(this,"maxRetries");l(this,"fetcher");l(this,"onStateChange");l(this,"onSelect");l(this,"state");l(this,"abortController",null);l(this,"debouncedFetch");l(this,"isSelecting",!1);this.country=e.country,this.authKey=e.authKey,this.apiUrl=e.apiUrl||c.API_URL,this.baseLimit=e.limit||c.LIMIT,this.currentLimit=this.baseLimit;let t=e.maxRetries!==void 0?e.maxRetries:c.MAX_RETRIES;this.maxRetries=Math.max(0,Math.min(t,10)),this.fetcher=e.fetcher||((r,o)=>fetch(r,o)),this.onStateChange=e.onStateChange||(()=>{}),this.onSelect=e.onSelect||(()=>{}),this.state={...g};let i=e.debounceMs!==void 0?e.debounceMs:c.DEBOUNCE_MS,s=Math.max(i,c.MIN_DEBOUNCE_MS);this.debouncedFetch=this.debounce(r=>this.executeFetch(r),s)}handleInput(e){if(this.isSelecting){this.isSelecting=!1;return}this.currentLimit=this.baseLimit;let t=this.state.stage==="final"&&e!==this.state.query;this.updateState({query:e,isValid:!1,isLoading:!!e.trim(),selectedSuggestionIndex:-1,hasMore:!1}),t&&this.onSelect(null),this.debouncedFetch(e)}loadMore(){this.state.isLoading||(this.currentLimit+=this.baseLimit,this.updateState({isLoading:!0}),this.executeFetch(this.state.query))}handleKeyDown(e){let t=e.target;if(!t)return;let i=this.state.cities.length+this.state.streets.length+this.state.suggestions.length;if(i>0){if(e.key==="ArrowDown"){e.preventDefault();let r=this.state.selectedSuggestionIndex+1;r>=i&&(r=0),this.updateState({selectedSuggestionIndex:r});return}if(e.key==="ArrowUp"){e.preventDefault();let r=this.state.selectedSuggestionIndex-1;r<0&&(r=i-1),this.updateState({selectedSuggestionIndex:r});return}if(e.key==="Enter"&&this.state.selectedSuggestionIndex>=0){e.preventDefault();let o=[...this.state.cities,...this.state.streets,...this.state.suggestions][this.state.selectedSuggestionIndex];o&&(this.selectItem(o),this.updateState({selectedSuggestionIndex:-1}));return}}let s=t.value;if(e.key===" "&&this.shouldAutoInsertComma(s)){e.preventDefault();let r=`${s.trim()}, `;this.updateQueryAndFetch(r)}}selectItem(e){this.debouncedFetch.cancel(),this.abortController&&this.abortController.abort();let t=typeof e=="string"?e:e.label,i=t;typeof e!="string"&&typeof e.value=="string"&&(i=e.value);let s=typeof e!="string"&&typeof e.value=="object"?e.value:void 0,r=!!s&&Object.keys(s).length>0;if(this.isSelecting=!0,this.state.stage==="final"||r){let n=t;if(s&&Object.keys(s).length>0){let{street:p,street_number:u,house_number:d,city:b}=s,m=u||d;p&&m&&b&&(n=`${p} ${m}, ${b}`)}this.finishSelection(n,s);return}let o=typeof e!="string"?e.subtitle:null;this.processSelection(i,o)}shouldAutoInsertComma(e){if(!e.includes(",")&&x.DIGITS_1_3.test(e.trim()))return!0;if(this.state.stage==="house_number"){let i=this.getCurrentFragment(e);return x.DIGITS_1_3.test(i)}return!1}finishSelection(e,t){this.updateState({query:e,suggestions:[],cities:[],streets:[],isValid:!0,stage:"final",hasMore:!1}),this.onSelect(t||e),setTimeout(()=>{this.isSelecting=!1},0)}processSelection(e,t){let{stage:i,query:s}=this.state,r=s;if(t&&(i==="city"||i==="street"||i==="mixed")){if(i==="city")r=`${t}, ${e}, `;else{let u=this.getQueryPrefix(s);r=u?`${u} ${e}, ${t}, `:`${e}, ${t}, `}this.updateQueryAndFetch(r);return}if(i==="direct"||i==="addition"){this.finishSelection(e);return}!s.includes(",")&&(i==="city"||i==="street"||i==="house_number_first")?r=`${e}, `:(r=this.replaceLastSegment(s,e),i!=="house_number"&&(r+=", ")),this.updateQueryAndFetch(r)}executeFetch(e,t=0){let i=(e||"").toString();if(!i.trim()){this.abortController?.abort(),this.resetState();return}t===0&&(this.updateState({isError:!1}),this.abortController&&this.abortController.abort(),this.abortController=new AbortController);let s=this.abortController?.signal,r=new URL(`${this.apiUrl}/infer/${this.country.toLowerCase()}`),o={authKey:this.authKey,query:i,limit:this.currentLimit.toString()};r.search=new URLSearchParams(o).toString(),this.fetcher(r.toString(),{signal:s}).then(n=>{if(!n.ok){if(t<this.maxRetries&&(n.status>=500||n.status===429))return this.retry(e,t,s);throw new Error("Network error")}return n.json()}).then(n=>{n&&this.mapResponseToState(n)}).catch(n=>{if(n.name!=="AbortError"){if(t<this.maxRetries)return this.retry(e,t,s);this.updateState({isError:!0,isLoading:!1})}})}retry(e,t,i){if(i?.aborted)return;let s=Math.pow(2,t)*200;setTimeout(()=>{i?.aborted||this.executeFetch(e,t+1)},s)}mapResponseToState(e){let t={stage:e.stage,isLoading:!1},i=!1,s=null,r=e.suggestions||[],o=[],n=new Set;for(let u of r){let d=`${u.label}|${u.subtitle||""}|${JSON.stringify(u.value||{})}`;n.has(d)||(n.add(d),o.push(u))}let p=o.length+(e.cities?.length||0)+(e.streets?.length||0);if(t.hasMore=p>=this.currentLimit,e.stage==="mixed"?(t.cities=e.cities||[],t.streets=e.streets||[],t.suggestions=[]):(t.suggestions=o,t.cities=[],t.streets=[],e.stage==="final"&&o.length===1&&(i=!0,s=o[0])),t.isValid=e.stage==="final",i&&s){t.query=s.label,t.suggestions=[],t.cities=[],t.streets=[],t.isValid=!0,t.hasMore=!1,this.updateState(t);let u=typeof s.value=="object"?s.value:s.label;this.onSelect(u)}else this.updateState(t)}updateQueryAndFetch(e){this.updateState({query:e,suggestions:[],cities:[],streets:[]}),this.updateState({isLoading:!0,isValid:!1,hasMore:!1}),this.debouncedFetch(e),setTimeout(()=>{this.isSelecting=!1},0)}replaceLastSegment(e,t){let i=e.lastIndexOf(",");return i===-1?t:`${e.slice(0,i+1)} ${t}`.trim()}getQueryPrefix(e){let t=e.lastIndexOf(",");return t===-1?"":e.slice(0,t+1).trimEnd()}getCurrentFragment(e){return(e.split(",").slice(-1)[0]??"").trim()}resetState(){this.updateState({...g,query:this.state.query})}updateState(e){this.state={...this.state,...e},this.onStateChange(this.state)}debounce(e,t){let i,s=(...r)=>{i&&clearTimeout(i),i=setTimeout(()=>e.apply(this,r),t)};return s.cancel=()=>{i&&(clearTimeout(i),i=void 0)},s}};var S=`
2
2
  .pro6pp-wrapper {
3
3
  position: relative;
4
4
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
@@ -11,6 +11,7 @@
11
11
  .pro6pp-input {
12
12
  width: 100%;
13
13
  padding: 10px 12px;
14
+ padding-right: 48px;
14
15
  border: 1px solid #e0e0e0;
15
16
  border-radius: 4px;
16
17
  font-size: 16px;
@@ -22,6 +23,57 @@
22
23
  border-color: #3b82f6;
23
24
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
24
25
  }
26
+
27
+ .pro6pp-input-addons {
28
+ position: absolute;
29
+ right: 6px;
30
+ top: 0;
31
+ bottom: 0;
32
+ display: flex;
33
+ align-items: center;
34
+ gap: 2px;
35
+ pointer-events: none;
36
+ }
37
+ .pro6pp-input-addons > * {
38
+ pointer-events: auto;
39
+ }
40
+
41
+ .pro6pp-clear-button {
42
+ background: none;
43
+ border: none;
44
+ width: 28px;
45
+ height: 28px;
46
+ cursor: pointer;
47
+ color: #a3a3a3;
48
+ display: flex;
49
+ align-items: center;
50
+ justify-content: center;
51
+ border-radius: 50%;
52
+ transition: color 0.2s, background-color 0.2s, transform 0.1s;
53
+ }
54
+ .pro6pp-clear-button:hover {
55
+ color: #1f2937;
56
+ background-color: #f3f4f6;
57
+ }
58
+ .pro6pp-clear-button:active {
59
+ transform: scale(0.92);
60
+ }
61
+ .pro6pp-clear-button svg {
62
+ width: 18px;
63
+ height: 18px;
64
+ }
65
+
66
+ .pro6pp-loader {
67
+ width: 18px;
68
+ height: 18px;
69
+ margin: 0 4px;
70
+ border: 2px solid #e0e0e0;
71
+ border-top-color: #6b7280;
72
+ border-radius: 50%;
73
+ animation: pro6pp-spin 0.6s linear infinite;
74
+ flex-shrink: 0;
75
+ }
76
+
25
77
  .pro6pp-dropdown {
26
78
  position: absolute;
27
79
  top: 100%;
@@ -32,30 +84,32 @@
32
84
  background: white;
33
85
  border: 1px solid #e0e0e0;
34
86
  border-radius: 4px;
35
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
87
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
36
88
  max-height: 300px;
37
89
  overflow-y: auto;
90
+ display: flex;
91
+ flex-direction: column;
92
+ }
93
+ .pro6pp-list {
38
94
  list-style: none !important;
39
95
  padding: 0 !important;
40
96
  margin: 0 !important;
41
- overflow: hidden;
97
+ flex-grow: 1;
42
98
  }
43
99
  .pro6pp-item {
44
- padding: 12px 12px 9px 12px;
100
+ padding: 12px 16px;
45
101
  cursor: pointer;
46
102
  display: flex;
47
103
  flex-direction: row;
48
104
  align-items: center;
49
- color: #000000;
105
+ color: #111827;
50
106
  font-size: 14px;
51
- line-height: 1;
107
+ line-height: 1.2;
52
108
  white-space: nowrap;
53
109
  overflow: hidden;
54
- border-radius: 0 !important;
55
- margin: 0 !important;
56
110
  }
57
111
  .pro6pp-item:hover, .pro6pp-item--active {
58
- background-color: #f5f5f5;
112
+ background-color: #f9fafb;
59
113
  }
60
114
  .pro6pp-item__label {
61
115
  font-weight: 500;
@@ -63,7 +117,7 @@
63
117
  }
64
118
  .pro6pp-item__subtitle {
65
119
  font-size: 14px;
66
- color: #404040;
120
+ color: #6b7280;
67
121
  overflow: hidden;
68
122
  text-overflow: ellipsis;
69
123
  flex-shrink: 1;
@@ -72,31 +126,33 @@
72
126
  margin-left: auto;
73
127
  display: flex;
74
128
  align-items: center;
75
- color: #a3a3a3;
129
+ color: #9ca3af;
76
130
  padding-left: 8px;
77
131
  }
78
132
  .pro6pp-no-results {
79
- padding: 12px;
80
- color: #555555;
133
+ padding: 16px;
134
+ color: #6b7280;
81
135
  font-size: 14px;
82
136
  text-align: center;
83
- user-select: none;
84
- pointer-events: none;
85
137
  }
86
- .pro6pp-loader {
87
- position: absolute;
88
- right: 12px;
89
- top: 50%;
90
- transform: translateY(-50%);
91
- width: 16px;
92
- height: 16px;
93
- border: 2px solid #e0e0e0;
94
- border-top-color: #404040;
95
- border-radius: 50%;
96
- animation: pro6pp-spin 0.6s linear infinite;
97
- pointer-events: none;
138
+ .pro6pp-load-more {
139
+ width: 100%;
140
+ padding: 10px;
141
+ background: #f9fafb;
142
+ border: none;
143
+ border-top: 1px solid #e0e0e0;
144
+ color: #3b82f6;
145
+ font-size: 13px;
146
+ font-weight: 600;
147
+ cursor: pointer;
148
+ transition: background-color 0.2s;
149
+ flex-shrink: 0;
150
+ }
151
+ .pro6pp-load-more:hover {
152
+ background-color: #f3f4f6;
98
153
  }
154
+
99
155
  @keyframes pro6pp-spin {
100
- to { transform: translateY(-50%) rotate(360deg); }
156
+ to { transform: rotate(360deg); }
101
157
  }
102
158
  `;0&&(module.exports={DEFAULT_STYLES,INITIAL_STATE,InferCore});
package/dist/index.d.cts CHANGED
@@ -4,130 +4,203 @@
4
4
  type CountryCode = 'NL' | 'DE';
5
5
  /**
6
6
  * The current step in the address inference process.
7
+ * - `empty`: No input yet.
8
+ * - `mixed`: User is prompted to choose between cities and streets.
9
+ * - `street`: User is selecting a street.
10
+ * - `city`: User is selecting a city.
11
+ * - `postcode`: User is entering a postcode.
12
+ * - `house_number`: User is entering a house number.
13
+ * - `house_number_first`: Specialized mode where number is entered before street.
14
+ * - `addition`: Selecting a house number addition (e.g., 'A', 'III').
15
+ * - `direct`: Direct address hit (often via postcode).
16
+ * - `final`: A complete, valid address has been identified.
7
17
  */
8
18
  type Stage = 'empty' | 'mixed' | 'street' | 'city' | 'postcode' | 'house_number' | 'house_number_first' | 'addition' | 'direct' | 'final';
9
19
  /**
10
- * The standardized address object returned upon selection.
20
+ * The standardized address object returned upon a successful final selection.
11
21
  */
12
22
  interface AddressValue {
23
+ /** The name of the street. */
13
24
  street: string;
25
+ /** The name of the city/locality. */
14
26
  city: string;
27
+ /** The house number (formatted). */
15
28
  street_number?: string | number;
29
+ /** The house number (numeric part). */
16
30
  house_number?: string | number;
31
+ /** The postal code. */
17
32
  postcode?: string;
33
+ /** The full postal code including letters (country-specific). */
18
34
  postcode_full?: string;
35
+ /** The house number addition or suffix. */
19
36
  addition?: string;
20
37
  /** Allow for extra fields if API expands. */
21
38
  [key: string]: unknown;
22
39
  }
23
40
  /**
24
- * A single item in the dropdown list.
41
+ * A single item in the suggestion list.
25
42
  */
26
43
  interface InferResult {
27
- /** The text to display in the UI (e.g. "Amsterdam"). */
44
+ /** The text to display in the UI (e.g. "Main Street"). */
28
45
  label: string;
29
- /** The actual address data. Only present if this result completes an address. */
30
- value?: AddressValue;
31
- /** Helper text. */
46
+ /** The actual address data.
47
+ * Only present if this result completes an address or represents a specific entity.
48
+ */
49
+ value?: AddressValue | string;
50
+ /** Secondary information (e.g., city name when suggesting a street). */
32
51
  subtitle?: string | null;
33
- /** Number of underlying results (optional). */
52
+ /** Number of underlying results found for this suggestion. */
34
53
  count?: number | string;
35
54
  }
36
55
  /**
37
- * The complete state returned by the `useInfer` hook.
56
+ * The complete UI state managed by InferCore.
38
57
  */
39
58
  interface InferState {
40
- /** The current value of the input field. */
59
+ /** The current text value of the search input. */
41
60
  query: string;
42
- /** The current inference stage. */
61
+ /** The current logical stage of the address lookup. */
43
62
  stage: Stage | null;
44
- /** List of cities to display, specific to `mixed` mode. */
63
+ /** List of city suggestions (used in `mixed` stage). */
45
64
  cities: InferResult[];
46
- /** List of streets to display, specific to `mixed` mode. */
65
+ /** List of street suggestions (used in `mixed` stage). */
47
66
  streets: InferResult[];
48
- /** General suggestions to display. */
67
+ /** General list of suggestions for the current stage. */
49
68
  suggestions: InferResult[];
50
- /** True if a full, valid address has been selected. */
69
+ /** Flag indicating if the current selection is a complete, valid address. */
51
70
  isValid: boolean;
52
- /** True if the last network request failed. */
71
+ /** Flag indicating if the last API request failed. */
53
72
  isError: boolean;
54
- /** True if a network request is currently active. */
73
+ /** Flag indicating if a network request is currently in progress. */
55
74
  isLoading: boolean;
75
+ /** Flag indicating if more results are available to load. */
76
+ hasMore: boolean;
56
77
  /**
57
- * The index of the currently highlighted suggestion in the dropdown list.
58
- * - Values `>= 0` indicate an active item (for keyboard navigation).
59
- * - Value `-1` indicates no item is currently highlighted.
78
+ * The index of the currently highlighted suggestion.
79
+ * - `0` to `n`: An item is highlighted via keyboard navigation.
80
+ * - `-1`: No item is highlighted.
60
81
  */
61
82
  selectedSuggestionIndex: number;
62
83
  }
63
84
  /**
64
- * Custom fetch implementation, compatible with `window.fetch`.
65
- * Useful for server-side usage or testing.
85
+ * Custom fetch implementation, compatible with the Web Fetch API.
86
+ * Useful for Node.js environments or proxying requests.
66
87
  */
67
88
  type Fetcher = (input: RequestInfo | URL, init?: RequestInit) => Promise<Response>;
68
89
  /**
69
- * Configuration for Infer Core.
90
+ * Configuration options for the Infer engine.
70
91
  */
71
92
  interface InferConfig {
72
93
  /**
73
- * Pro6PP Authorization Key.
94
+ * Your Pro6PP Authorization Key.
74
95
  */
75
96
  authKey: string;
76
97
  /**
77
- * Country to search addresses in.
98
+ * The country to perform address lookups in.
78
99
  */
79
100
  country: CountryCode;
80
101
  /**
81
102
  * Base URL for the Pro6PP API.
82
- * Useful for proxying requests through your own backend.
83
103
  * @default 'https://api.pro6pp.nl/v2'
84
104
  */
85
105
  apiUrl?: string;
86
106
  /**
87
- * Custom fetch implementation.
88
- * Useful for server-side usage or testing.
107
+ * Custom fetch implementation for network requests.
108
+ * @default window.fetch
89
109
  */
90
110
  fetcher?: Fetcher;
91
111
  /**
92
- * Maximum number of results to return.
93
- * @default 1000
112
+ * The number of results to fetch per batch.
113
+ * @default 20
94
114
  */
95
115
  limit?: number;
96
116
  /**
97
- * Callback fired when the internal state changes.
117
+ * The delay in milliseconds before performing the API search.
118
+ * Note: A lower bound of 50ms is enforced to protect API stability.
119
+ * @default 150
120
+ */
121
+ debounceMs?: number;
122
+ /**
123
+ * Maximum number of retry attempts for transient network errors.
124
+ * @default 0
125
+ */
126
+ maxRetries?: number;
127
+ /**
128
+ * Callback triggered whenever the internal state (suggestions, loading status, etc.) updates.
98
129
  */
99
130
  onStateChange?: (state: InferState) => void;
100
131
  /**
101
- * Callback fired when a user selects a full valid address.
132
+ * Callback triggered when a user selects an item.
133
+ * If the address is complete, returns an `AddressValue` object.
134
+ * If the selection is partial, returns a `string`.
102
135
  */
103
136
  onSelect?: (selection: AddressValue | string | null) => void;
104
137
  }
105
138
 
139
+ /**
140
+ * The initial state of the address inference engine.
141
+ */
106
142
  declare const INITIAL_STATE: InferState;
143
+ /**
144
+ * The core logic engine for Pro6PP Infer.
145
+ * Manages API communication, state transitions, and keyboard interaction logic.
146
+ */
107
147
  declare class InferCore {
108
148
  private country;
109
149
  private authKey;
110
150
  private apiUrl;
111
- private limit;
151
+ private baseLimit;
152
+ private currentLimit;
153
+ private maxRetries;
112
154
  private fetcher;
113
155
  private onStateChange;
114
156
  private onSelect;
157
+ /**
158
+ * The current read-only state of the engine.
159
+ * Use `onStateChange` to react to updates.
160
+ */
115
161
  state: InferState;
116
162
  private abortController;
117
163
  private debouncedFetch;
118
164
  private isSelecting;
165
+ /**
166
+ * Initializes a new instance of the Infer engine.
167
+ * @param config The configuration object including API keys and callbacks.
168
+ */
119
169
  constructor(config: InferConfig);
170
+ /**
171
+ * Processes new text input from the user.
172
+ * Triggers a debounced API request and updates the internal state.
173
+ * @param value The raw string from the input field.
174
+ */
120
175
  handleInput(value: string): void;
176
+ /**
177
+ * Increases the current limit and re-fetches the query to show more results.
178
+ */
179
+ loadMore(): void;
180
+ /**
181
+ * Handles keyboard events for the input field.
182
+ * Supports:
183
+ * - `ArrowUp`/`ArrowDown`: Navigate through the suggestion list.
184
+ * - `Enter`: Select the currently highlighted suggestion.
185
+ * - `Space`: Automatically inserts a comma if a numeric house number is detected.
186
+ * @param event The keyboard event from the input element.
187
+ */
121
188
  handleKeyDown(event: KeyboardEvent | {
122
189
  key: string;
123
190
  target: EventTarget | null;
124
191
  preventDefault: () => void;
125
192
  }): void;
193
+ /**
194
+ * Manually selects a suggestion or a string value.
195
+ * This is typically called when a user clicks a suggestion in the UI.
196
+ * @param item The suggestion object or string to select.
197
+ */
126
198
  selectItem(item: InferResult | string): void;
127
199
  private shouldAutoInsertComma;
128
200
  private finishSelection;
129
201
  private processSelection;
130
202
  private executeFetch;
203
+ private retry;
131
204
  private mapResponseToState;
132
205
  private updateQueryAndFetch;
133
206
  private replaceLastSegment;
@@ -138,6 +211,6 @@ declare class InferCore {
138
211
  private debounce;
139
212
  }
140
213
 
141
- declare const DEFAULT_STYLES = "\n .pro6pp-wrapper {\n position: relative;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n box-sizing: border-box;\n width: 100%;\n }\n .pro6pp-wrapper * {\n box-sizing: border-box;\n }\n .pro6pp-input {\n width: 100%;\n padding: 10px 12px;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n font-size: 16px;\n line-height: 1.5;\n transition: border-color 0.2s, box-shadow 0.2s;\n }\n .pro6pp-input:focus {\n outline: none;\n border-color: #3b82f6;\n box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);\n }\n .pro6pp-dropdown {\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n z-index: 9999;\n margin-top: 4px;\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n max-height: 300px;\n overflow-y: auto;\n list-style: none !important;\n padding: 0 !important;\n margin: 0 !important;\n overflow: hidden;\n }\n .pro6pp-item {\n padding: 12px 12px 9px 12px;\n cursor: pointer;\n display: flex;\n flex-direction: row;\n align-items: center;\n color: #000000;\n font-size: 14px;\n line-height: 1;\n white-space: nowrap;\n overflow: hidden;\n border-radius: 0 !important;\n margin: 0 !important;\n }\n .pro6pp-item:hover, .pro6pp-item--active {\n background-color: #f5f5f5;\n }\n .pro6pp-item__label {\n font-weight: 500;\n flex-shrink: 0;\n }\n .pro6pp-item__subtitle {\n font-size: 14px;\n color: #404040;\n overflow: hidden;\n text-overflow: ellipsis;\n flex-shrink: 1;\n }\n .pro6pp-item__chevron {\n margin-left: auto;\n display: flex;\n align-items: center;\n color: #a3a3a3;\n padding-left: 8px;\n }\n .pro6pp-no-results {\n padding: 12px;\n color: #555555;\n font-size: 14px;\n text-align: center;\n user-select: none;\n pointer-events: none;\n }\n .pro6pp-loader {\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n width: 16px;\n height: 16px;\n border: 2px solid #e0e0e0;\n border-top-color: #404040;\n border-radius: 50%;\n animation: pro6pp-spin 0.6s linear infinite;\n pointer-events: none;\n }\n @keyframes pro6pp-spin {\n to { transform: translateY(-50%) rotate(360deg); }\n }\n";
214
+ declare const DEFAULT_STYLES = "\n .pro6pp-wrapper {\n position: relative;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n box-sizing: border-box;\n width: 100%;\n }\n .pro6pp-wrapper * {\n box-sizing: border-box;\n }\n .pro6pp-input {\n width: 100%;\n padding: 10px 12px;\n padding-right: 48px;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n font-size: 16px;\n line-height: 1.5;\n transition: border-color 0.2s, box-shadow 0.2s;\n }\n .pro6pp-input:focus {\n outline: none;\n border-color: #3b82f6;\n box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);\n }\n\n .pro6pp-input-addons {\n position: absolute;\n right: 6px;\n top: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n gap: 2px;\n pointer-events: none;\n }\n .pro6pp-input-addons > * {\n pointer-events: auto;\n }\n\n .pro6pp-clear-button {\n background: none;\n border: none;\n width: 28px;\n height: 28px;\n cursor: pointer;\n color: #a3a3a3;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n transition: color 0.2s, background-color 0.2s, transform 0.1s;\n }\n .pro6pp-clear-button:hover {\n color: #1f2937;\n background-color: #f3f4f6;\n }\n .pro6pp-clear-button:active {\n transform: scale(0.92);\n }\n .pro6pp-clear-button svg {\n width: 18px;\n height: 18px;\n }\n\n .pro6pp-loader {\n width: 18px;\n height: 18px;\n margin: 0 4px;\n border: 2px solid #e0e0e0;\n border-top-color: #6b7280;\n border-radius: 50%;\n animation: pro6pp-spin 0.6s linear infinite;\n flex-shrink: 0;\n }\n\n .pro6pp-dropdown {\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n z-index: 9999;\n margin-top: 4px;\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);\n max-height: 300px;\n overflow-y: auto;\n display: flex;\n flex-direction: column;\n }\n .pro6pp-list {\n list-style: none !important;\n padding: 0 !important;\n margin: 0 !important;\n flex-grow: 1;\n }\n .pro6pp-item {\n padding: 12px 16px;\n cursor: pointer;\n display: flex;\n flex-direction: row;\n align-items: center;\n color: #111827;\n font-size: 14px;\n line-height: 1.2;\n white-space: nowrap;\n overflow: hidden;\n }\n .pro6pp-item:hover, .pro6pp-item--active {\n background-color: #f9fafb;\n }\n .pro6pp-item__label {\n font-weight: 500;\n flex-shrink: 0;\n }\n .pro6pp-item__subtitle {\n font-size: 14px;\n color: #6b7280;\n overflow: hidden;\n text-overflow: ellipsis;\n flex-shrink: 1;\n }\n .pro6pp-item__chevron {\n margin-left: auto;\n display: flex;\n align-items: center;\n color: #9ca3af;\n padding-left: 8px;\n }\n .pro6pp-no-results {\n padding: 16px;\n color: #6b7280;\n font-size: 14px;\n text-align: center;\n }\n .pro6pp-load-more {\n width: 100%;\n padding: 10px;\n background: #f9fafb;\n border: none;\n border-top: 1px solid #e0e0e0;\n color: #3b82f6;\n font-size: 13px;\n font-weight: 600;\n cursor: pointer;\n transition: background-color 0.2s;\n flex-shrink: 0;\n }\n .pro6pp-load-more:hover {\n background-color: #f3f4f6;\n }\n\n @keyframes pro6pp-spin {\n to { transform: rotate(360deg); }\n }\n";
142
215
 
143
216
  export { type AddressValue, type CountryCode, DEFAULT_STYLES, type Fetcher, INITIAL_STATE, type InferConfig, InferCore, type InferResult, type InferState, type Stage };
package/dist/index.d.ts CHANGED
@@ -4,130 +4,203 @@
4
4
  type CountryCode = 'NL' | 'DE';
5
5
  /**
6
6
  * The current step in the address inference process.
7
+ * - `empty`: No input yet.
8
+ * - `mixed`: User is prompted to choose between cities and streets.
9
+ * - `street`: User is selecting a street.
10
+ * - `city`: User is selecting a city.
11
+ * - `postcode`: User is entering a postcode.
12
+ * - `house_number`: User is entering a house number.
13
+ * - `house_number_first`: Specialized mode where number is entered before street.
14
+ * - `addition`: Selecting a house number addition (e.g., 'A', 'III').
15
+ * - `direct`: Direct address hit (often via postcode).
16
+ * - `final`: A complete, valid address has been identified.
7
17
  */
8
18
  type Stage = 'empty' | 'mixed' | 'street' | 'city' | 'postcode' | 'house_number' | 'house_number_first' | 'addition' | 'direct' | 'final';
9
19
  /**
10
- * The standardized address object returned upon selection.
20
+ * The standardized address object returned upon a successful final selection.
11
21
  */
12
22
  interface AddressValue {
23
+ /** The name of the street. */
13
24
  street: string;
25
+ /** The name of the city/locality. */
14
26
  city: string;
27
+ /** The house number (formatted). */
15
28
  street_number?: string | number;
29
+ /** The house number (numeric part). */
16
30
  house_number?: string | number;
31
+ /** The postal code. */
17
32
  postcode?: string;
33
+ /** The full postal code including letters (country-specific). */
18
34
  postcode_full?: string;
35
+ /** The house number addition or suffix. */
19
36
  addition?: string;
20
37
  /** Allow for extra fields if API expands. */
21
38
  [key: string]: unknown;
22
39
  }
23
40
  /**
24
- * A single item in the dropdown list.
41
+ * A single item in the suggestion list.
25
42
  */
26
43
  interface InferResult {
27
- /** The text to display in the UI (e.g. "Amsterdam"). */
44
+ /** The text to display in the UI (e.g. "Main Street"). */
28
45
  label: string;
29
- /** The actual address data. Only present if this result completes an address. */
30
- value?: AddressValue;
31
- /** Helper text. */
46
+ /** The actual address data.
47
+ * Only present if this result completes an address or represents a specific entity.
48
+ */
49
+ value?: AddressValue | string;
50
+ /** Secondary information (e.g., city name when suggesting a street). */
32
51
  subtitle?: string | null;
33
- /** Number of underlying results (optional). */
52
+ /** Number of underlying results found for this suggestion. */
34
53
  count?: number | string;
35
54
  }
36
55
  /**
37
- * The complete state returned by the `useInfer` hook.
56
+ * The complete UI state managed by InferCore.
38
57
  */
39
58
  interface InferState {
40
- /** The current value of the input field. */
59
+ /** The current text value of the search input. */
41
60
  query: string;
42
- /** The current inference stage. */
61
+ /** The current logical stage of the address lookup. */
43
62
  stage: Stage | null;
44
- /** List of cities to display, specific to `mixed` mode. */
63
+ /** List of city suggestions (used in `mixed` stage). */
45
64
  cities: InferResult[];
46
- /** List of streets to display, specific to `mixed` mode. */
65
+ /** List of street suggestions (used in `mixed` stage). */
47
66
  streets: InferResult[];
48
- /** General suggestions to display. */
67
+ /** General list of suggestions for the current stage. */
49
68
  suggestions: InferResult[];
50
- /** True if a full, valid address has been selected. */
69
+ /** Flag indicating if the current selection is a complete, valid address. */
51
70
  isValid: boolean;
52
- /** True if the last network request failed. */
71
+ /** Flag indicating if the last API request failed. */
53
72
  isError: boolean;
54
- /** True if a network request is currently active. */
73
+ /** Flag indicating if a network request is currently in progress. */
55
74
  isLoading: boolean;
75
+ /** Flag indicating if more results are available to load. */
76
+ hasMore: boolean;
56
77
  /**
57
- * The index of the currently highlighted suggestion in the dropdown list.
58
- * - Values `>= 0` indicate an active item (for keyboard navigation).
59
- * - Value `-1` indicates no item is currently highlighted.
78
+ * The index of the currently highlighted suggestion.
79
+ * - `0` to `n`: An item is highlighted via keyboard navigation.
80
+ * - `-1`: No item is highlighted.
60
81
  */
61
82
  selectedSuggestionIndex: number;
62
83
  }
63
84
  /**
64
- * Custom fetch implementation, compatible with `window.fetch`.
65
- * Useful for server-side usage or testing.
85
+ * Custom fetch implementation, compatible with the Web Fetch API.
86
+ * Useful for Node.js environments or proxying requests.
66
87
  */
67
88
  type Fetcher = (input: RequestInfo | URL, init?: RequestInit) => Promise<Response>;
68
89
  /**
69
- * Configuration for Infer Core.
90
+ * Configuration options for the Infer engine.
70
91
  */
71
92
  interface InferConfig {
72
93
  /**
73
- * Pro6PP Authorization Key.
94
+ * Your Pro6PP Authorization Key.
74
95
  */
75
96
  authKey: string;
76
97
  /**
77
- * Country to search addresses in.
98
+ * The country to perform address lookups in.
78
99
  */
79
100
  country: CountryCode;
80
101
  /**
81
102
  * Base URL for the Pro6PP API.
82
- * Useful for proxying requests through your own backend.
83
103
  * @default 'https://api.pro6pp.nl/v2'
84
104
  */
85
105
  apiUrl?: string;
86
106
  /**
87
- * Custom fetch implementation.
88
- * Useful for server-side usage or testing.
107
+ * Custom fetch implementation for network requests.
108
+ * @default window.fetch
89
109
  */
90
110
  fetcher?: Fetcher;
91
111
  /**
92
- * Maximum number of results to return.
93
- * @default 1000
112
+ * The number of results to fetch per batch.
113
+ * @default 20
94
114
  */
95
115
  limit?: number;
96
116
  /**
97
- * Callback fired when the internal state changes.
117
+ * The delay in milliseconds before performing the API search.
118
+ * Note: A lower bound of 50ms is enforced to protect API stability.
119
+ * @default 150
120
+ */
121
+ debounceMs?: number;
122
+ /**
123
+ * Maximum number of retry attempts for transient network errors.
124
+ * @default 0
125
+ */
126
+ maxRetries?: number;
127
+ /**
128
+ * Callback triggered whenever the internal state (suggestions, loading status, etc.) updates.
98
129
  */
99
130
  onStateChange?: (state: InferState) => void;
100
131
  /**
101
- * Callback fired when a user selects a full valid address.
132
+ * Callback triggered when a user selects an item.
133
+ * If the address is complete, returns an `AddressValue` object.
134
+ * If the selection is partial, returns a `string`.
102
135
  */
103
136
  onSelect?: (selection: AddressValue | string | null) => void;
104
137
  }
105
138
 
139
+ /**
140
+ * The initial state of the address inference engine.
141
+ */
106
142
  declare const INITIAL_STATE: InferState;
143
+ /**
144
+ * The core logic engine for Pro6PP Infer.
145
+ * Manages API communication, state transitions, and keyboard interaction logic.
146
+ */
107
147
  declare class InferCore {
108
148
  private country;
109
149
  private authKey;
110
150
  private apiUrl;
111
- private limit;
151
+ private baseLimit;
152
+ private currentLimit;
153
+ private maxRetries;
112
154
  private fetcher;
113
155
  private onStateChange;
114
156
  private onSelect;
157
+ /**
158
+ * The current read-only state of the engine.
159
+ * Use `onStateChange` to react to updates.
160
+ */
115
161
  state: InferState;
116
162
  private abortController;
117
163
  private debouncedFetch;
118
164
  private isSelecting;
165
+ /**
166
+ * Initializes a new instance of the Infer engine.
167
+ * @param config The configuration object including API keys and callbacks.
168
+ */
119
169
  constructor(config: InferConfig);
170
+ /**
171
+ * Processes new text input from the user.
172
+ * Triggers a debounced API request and updates the internal state.
173
+ * @param value The raw string from the input field.
174
+ */
120
175
  handleInput(value: string): void;
176
+ /**
177
+ * Increases the current limit and re-fetches the query to show more results.
178
+ */
179
+ loadMore(): void;
180
+ /**
181
+ * Handles keyboard events for the input field.
182
+ * Supports:
183
+ * - `ArrowUp`/`ArrowDown`: Navigate through the suggestion list.
184
+ * - `Enter`: Select the currently highlighted suggestion.
185
+ * - `Space`: Automatically inserts a comma if a numeric house number is detected.
186
+ * @param event The keyboard event from the input element.
187
+ */
121
188
  handleKeyDown(event: KeyboardEvent | {
122
189
  key: string;
123
190
  target: EventTarget | null;
124
191
  preventDefault: () => void;
125
192
  }): void;
193
+ /**
194
+ * Manually selects a suggestion or a string value.
195
+ * This is typically called when a user clicks a suggestion in the UI.
196
+ * @param item The suggestion object or string to select.
197
+ */
126
198
  selectItem(item: InferResult | string): void;
127
199
  private shouldAutoInsertComma;
128
200
  private finishSelection;
129
201
  private processSelection;
130
202
  private executeFetch;
203
+ private retry;
131
204
  private mapResponseToState;
132
205
  private updateQueryAndFetch;
133
206
  private replaceLastSegment;
@@ -138,6 +211,6 @@ declare class InferCore {
138
211
  private debounce;
139
212
  }
140
213
 
141
- declare const DEFAULT_STYLES = "\n .pro6pp-wrapper {\n position: relative;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n box-sizing: border-box;\n width: 100%;\n }\n .pro6pp-wrapper * {\n box-sizing: border-box;\n }\n .pro6pp-input {\n width: 100%;\n padding: 10px 12px;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n font-size: 16px;\n line-height: 1.5;\n transition: border-color 0.2s, box-shadow 0.2s;\n }\n .pro6pp-input:focus {\n outline: none;\n border-color: #3b82f6;\n box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);\n }\n .pro6pp-dropdown {\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n z-index: 9999;\n margin-top: 4px;\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n max-height: 300px;\n overflow-y: auto;\n list-style: none !important;\n padding: 0 !important;\n margin: 0 !important;\n overflow: hidden;\n }\n .pro6pp-item {\n padding: 12px 12px 9px 12px;\n cursor: pointer;\n display: flex;\n flex-direction: row;\n align-items: center;\n color: #000000;\n font-size: 14px;\n line-height: 1;\n white-space: nowrap;\n overflow: hidden;\n border-radius: 0 !important;\n margin: 0 !important;\n }\n .pro6pp-item:hover, .pro6pp-item--active {\n background-color: #f5f5f5;\n }\n .pro6pp-item__label {\n font-weight: 500;\n flex-shrink: 0;\n }\n .pro6pp-item__subtitle {\n font-size: 14px;\n color: #404040;\n overflow: hidden;\n text-overflow: ellipsis;\n flex-shrink: 1;\n }\n .pro6pp-item__chevron {\n margin-left: auto;\n display: flex;\n align-items: center;\n color: #a3a3a3;\n padding-left: 8px;\n }\n .pro6pp-no-results {\n padding: 12px;\n color: #555555;\n font-size: 14px;\n text-align: center;\n user-select: none;\n pointer-events: none;\n }\n .pro6pp-loader {\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n width: 16px;\n height: 16px;\n border: 2px solid #e0e0e0;\n border-top-color: #404040;\n border-radius: 50%;\n animation: pro6pp-spin 0.6s linear infinite;\n pointer-events: none;\n }\n @keyframes pro6pp-spin {\n to { transform: translateY(-50%) rotate(360deg); }\n }\n";
214
+ declare const DEFAULT_STYLES = "\n .pro6pp-wrapper {\n position: relative;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n box-sizing: border-box;\n width: 100%;\n }\n .pro6pp-wrapper * {\n box-sizing: border-box;\n }\n .pro6pp-input {\n width: 100%;\n padding: 10px 12px;\n padding-right: 48px;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n font-size: 16px;\n line-height: 1.5;\n transition: border-color 0.2s, box-shadow 0.2s;\n }\n .pro6pp-input:focus {\n outline: none;\n border-color: #3b82f6;\n box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);\n }\n\n .pro6pp-input-addons {\n position: absolute;\n right: 6px;\n top: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n gap: 2px;\n pointer-events: none;\n }\n .pro6pp-input-addons > * {\n pointer-events: auto;\n }\n\n .pro6pp-clear-button {\n background: none;\n border: none;\n width: 28px;\n height: 28px;\n cursor: pointer;\n color: #a3a3a3;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n transition: color 0.2s, background-color 0.2s, transform 0.1s;\n }\n .pro6pp-clear-button:hover {\n color: #1f2937;\n background-color: #f3f4f6;\n }\n .pro6pp-clear-button:active {\n transform: scale(0.92);\n }\n .pro6pp-clear-button svg {\n width: 18px;\n height: 18px;\n }\n\n .pro6pp-loader {\n width: 18px;\n height: 18px;\n margin: 0 4px;\n border: 2px solid #e0e0e0;\n border-top-color: #6b7280;\n border-radius: 50%;\n animation: pro6pp-spin 0.6s linear infinite;\n flex-shrink: 0;\n }\n\n .pro6pp-dropdown {\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n z-index: 9999;\n margin-top: 4px;\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);\n max-height: 300px;\n overflow-y: auto;\n display: flex;\n flex-direction: column;\n }\n .pro6pp-list {\n list-style: none !important;\n padding: 0 !important;\n margin: 0 !important;\n flex-grow: 1;\n }\n .pro6pp-item {\n padding: 12px 16px;\n cursor: pointer;\n display: flex;\n flex-direction: row;\n align-items: center;\n color: #111827;\n font-size: 14px;\n line-height: 1.2;\n white-space: nowrap;\n overflow: hidden;\n }\n .pro6pp-item:hover, .pro6pp-item--active {\n background-color: #f9fafb;\n }\n .pro6pp-item__label {\n font-weight: 500;\n flex-shrink: 0;\n }\n .pro6pp-item__subtitle {\n font-size: 14px;\n color: #6b7280;\n overflow: hidden;\n text-overflow: ellipsis;\n flex-shrink: 1;\n }\n .pro6pp-item__chevron {\n margin-left: auto;\n display: flex;\n align-items: center;\n color: #9ca3af;\n padding-left: 8px;\n }\n .pro6pp-no-results {\n padding: 16px;\n color: #6b7280;\n font-size: 14px;\n text-align: center;\n }\n .pro6pp-load-more {\n width: 100%;\n padding: 10px;\n background: #f9fafb;\n border: none;\n border-top: 1px solid #e0e0e0;\n color: #3b82f6;\n font-size: 13px;\n font-weight: 600;\n cursor: pointer;\n transition: background-color 0.2s;\n flex-shrink: 0;\n }\n .pro6pp-load-more:hover {\n background-color: #f3f4f6;\n }\n\n @keyframes pro6pp-spin {\n to { transform: rotate(360deg); }\n }\n";
142
215
 
143
216
  export { type AddressValue, type CountryCode, DEFAULT_STYLES, type Fetcher, INITIAL_STATE, type InferConfig, InferCore, type InferResult, type InferState, type Stage };
package/dist/index.global.js CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";var Pro6PPCore=(()=>{var c=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var I=Object.prototype.hasOwnProperty;var w=(n,t,e)=>t in n?c(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e;var C=(n,t)=>{for(var e in t)c(n,e,{get:t[e],enumerable:!0})},T=(n,t,e,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of v(t))!I.call(n,s)&&s!==e&&c(n,s,{get:()=>t[s],enumerable:!(i=y(t,s))||i.enumerable});return n};var F=n=>T(c({},"__esModule",{value:!0}),n);var o=(n,t,e)=>w(n,typeof t!="symbol"?t+"":t,e);var A={};C(A,{DEFAULT_STYLES:()=>b,INITIAL_STATE:()=>h,InferCore:()=>g});var d={API_URL:"https://api.pro6pp.nl/v2",LIMIT:1e3,DEBOUNCE_MS:300},m={DIGITS_1_3:/^[0-9]{1,3}$/},h={query:"",stage:null,cities:[],streets:[],suggestions:[],isValid:!1,isError:!1,isLoading:!1,selectedSuggestionIndex:-1},g=class{constructor(t){o(this,"country");o(this,"authKey");o(this,"apiUrl");o(this,"limit");o(this,"fetcher");o(this,"onStateChange");o(this,"onSelect");o(this,"state");o(this,"abortController",null);o(this,"debouncedFetch");o(this,"isSelecting",!1);this.country=t.country,this.authKey=t.authKey,this.apiUrl=t.apiUrl||d.API_URL,this.limit=t.limit||d.LIMIT,this.fetcher=t.fetcher||((e,i)=>fetch(e,i)),this.onStateChange=t.onStateChange||(()=>{}),this.onSelect=t.onSelect||(()=>{}),this.state={...h},this.debouncedFetch=this.debounce(e=>this.executeFetch(e),d.DEBOUNCE_MS)}handleInput(t){if(this.isSelecting){this.isSelecting=!1;return}let e=this.state.stage==="final"&&t!==this.state.query;this.updateState({query:t,isValid:!1,isLoading:!!t.trim(),selectedSuggestionIndex:-1}),e&&this.onSelect(null),this.debouncedFetch(t)}handleKeyDown(t){let e=t.target;if(!e)return;let i=this.state.cities.length+this.state.streets.length+this.state.suggestions.length;if(i>0){if(t.key==="ArrowDown"){t.preventDefault();let r=this.state.selectedSuggestionIndex+1;r>=i&&(r=0),this.updateState({selectedSuggestionIndex:r});return}if(t.key==="ArrowUp"){t.preventDefault();let r=this.state.selectedSuggestionIndex-1;r<0&&(r=i-1),this.updateState({selectedSuggestionIndex:r});return}if(t.key==="Enter"&&this.state.selectedSuggestionIndex>=0){t.preventDefault();let a=[...this.state.cities,...this.state.streets,...this.state.suggestions][this.state.selectedSuggestionIndex];a&&(this.selectItem(a),this.updateState({selectedSuggestionIndex:-1}));return}}let s=e.value;if(t.key===" "&&this.shouldAutoInsertComma(s)){t.preventDefault();let r=`${s.trim()}, `;this.updateQueryAndFetch(r)}}selectItem(t){this.debouncedFetch.cancel(),this.abortController&&this.abortController.abort();let e=typeof t=="string"?t:t.label,i=e;typeof t!="string"&&typeof t.value=="string"&&(i=t.value);let s=typeof t!="string"&&typeof t.value=="object"?t.value:void 0,r=!!s&&Object.keys(s).length>0;if(this.isSelecting=!0,this.state.stage==="final"||r){let p=e;if(s&&Object.keys(s).length>0){let{street:l,street_number:u,house_number:x,city:f}=s,S=u||x;l&&S&&f&&(p=`${l} ${S}, ${f}`)}this.finishSelection(p,s);return}let a=typeof t!="string"?t.subtitle:null;this.processSelection(i,a)}shouldAutoInsertComma(t){if(!t.includes(",")&&m.DIGITS_1_3.test(t.trim()))return!0;if(this.state.stage==="house_number"){let i=this.getCurrentFragment(t);return m.DIGITS_1_3.test(i)}return!1}finishSelection(t,e){this.updateState({query:t,suggestions:[],cities:[],streets:[],isValid:!0,stage:"final"}),this.onSelect(e||t),setTimeout(()=>{this.isSelecting=!1},0)}processSelection(t,e){let{stage:i,query:s}=this.state,r=s;if(e&&(i==="city"||i==="street"||i==="mixed")){if(i==="city")r=`${e}, ${t}, `;else{let u=this.getQueryPrefix(s);r=u?`${u} ${t}, ${e}, `:`${t}, ${e}, `}this.updateQueryAndFetch(r);return}if(i==="direct"||i==="addition"){this.finishSelection(t);return}!s.includes(",")&&(i==="city"||i==="street"||i==="house_number_first")?r=`${t}, `:(r=this.replaceLastSegment(s,t),i!=="house_number"&&(r+=", ")),this.updateQueryAndFetch(r)}executeFetch(t){let e=(t||"").toString();if(!e.trim()){this.abortController?.abort(),this.resetState();return}this.updateState({isError:!1}),this.abortController&&this.abortController.abort(),this.abortController=new AbortController;let i=new URL(`${this.apiUrl}/infer/${this.country.toLowerCase()}`),s={authKey:this.authKey,query:e,limit:this.limit.toString()};i.search=new URLSearchParams(s).toString(),this.fetcher(i.toString(),{signal:this.abortController.signal}).then(r=>{if(!r.ok)throw new Error("Network error");return r.json()}).then(r=>this.mapResponseToState(r)).catch(r=>{r.name!=="AbortError"&&this.updateState({isError:!0,isLoading:!1})})}mapResponseToState(t){let e={stage:t.stage,isLoading:!1},i=!1,s=null,r=t.suggestions||[],a=[],p=new Set;for(let l of r){let u=`${l.label}|${l.subtitle||""}|${JSON.stringify(l.value||{})}`;p.has(u)||(p.add(u),a.push(l))}if(t.stage==="mixed"?(e.cities=t.cities||[],e.streets=t.streets||[],e.suggestions=[]):(e.suggestions=a,e.cities=[],e.streets=[],t.stage==="final"&&a.length===1&&(i=!0,s=a[0])),e.isValid=t.stage==="final",i&&s){e.query=s.label,e.suggestions=[],e.cities=[],e.streets=[],e.isValid=!0,this.updateState(e);let l=typeof s.value=="object"?s.value:s.label;this.onSelect(l)}else this.updateState(e)}updateQueryAndFetch(t){this.updateState({query:t,suggestions:[],cities:[],streets:[]}),this.updateState({isLoading:!0,isValid:!1}),this.debouncedFetch(t),setTimeout(()=>{this.isSelecting=!1},0)}replaceLastSegment(t,e){let i=t.lastIndexOf(",");return i===-1?e:`${t.slice(0,i+1)} ${e}`.trim()}getQueryPrefix(t){let e=t.lastIndexOf(",");return e===-1?"":t.slice(0,e+1).trimEnd()}getCurrentFragment(t){return(t.split(",").slice(-1)[0]??"").trim()}resetState(){this.updateState({...h,query:this.state.query})}updateState(t){this.state={...this.state,...t},this.onStateChange(this.state)}debounce(t,e){let i,s=(...r)=>{i&&clearTimeout(i),i=setTimeout(()=>t.apply(this,r),e)};return s.cancel=()=>{i&&(clearTimeout(i),i=void 0)},s}};var b=`
1
+ "use strict";var Pro6PPCore=(()=>{var h=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var I=Object.prototype.hasOwnProperty;var w=(a,e,t)=>e in a?h(a,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):a[e]=t;var T=(a,e)=>{for(var t in e)h(a,t,{get:e[t],enumerable:!0})},C=(a,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of v(e))!I.call(a,s)&&s!==t&&h(a,s,{get:()=>e[s],enumerable:!(i=y(e,s))||i.enumerable});return a};var L=a=>C(h({},"__esModule",{value:!0}),a);var l=(a,e,t)=>w(a,typeof e!="symbol"?e+"":e,t);var _={};T(_,{DEFAULT_STYLES:()=>S,INITIAL_STATE:()=>g,InferCore:()=>f});var c={API_URL:"https://api.pro6pp.nl/v2",LIMIT:20,DEBOUNCE_MS:150,MIN_DEBOUNCE_MS:50,MAX_RETRIES:0},x={DIGITS_1_3:/^[0-9]{1,3}$/},g={query:"",stage:null,cities:[],streets:[],suggestions:[],isValid:!1,isError:!1,isLoading:!1,hasMore:!1,selectedSuggestionIndex:-1},f=class{constructor(e){l(this,"country");l(this,"authKey");l(this,"apiUrl");l(this,"baseLimit");l(this,"currentLimit");l(this,"maxRetries");l(this,"fetcher");l(this,"onStateChange");l(this,"onSelect");l(this,"state");l(this,"abortController",null);l(this,"debouncedFetch");l(this,"isSelecting",!1);this.country=e.country,this.authKey=e.authKey,this.apiUrl=e.apiUrl||c.API_URL,this.baseLimit=e.limit||c.LIMIT,this.currentLimit=this.baseLimit;let t=e.maxRetries!==void 0?e.maxRetries:c.MAX_RETRIES;this.maxRetries=Math.max(0,Math.min(t,10)),this.fetcher=e.fetcher||((r,o)=>fetch(r,o)),this.onStateChange=e.onStateChange||(()=>{}),this.onSelect=e.onSelect||(()=>{}),this.state={...g};let i=e.debounceMs!==void 0?e.debounceMs:c.DEBOUNCE_MS,s=Math.max(i,c.MIN_DEBOUNCE_MS);this.debouncedFetch=this.debounce(r=>this.executeFetch(r),s)}handleInput(e){if(this.isSelecting){this.isSelecting=!1;return}this.currentLimit=this.baseLimit;let t=this.state.stage==="final"&&e!==this.state.query;this.updateState({query:e,isValid:!1,isLoading:!!e.trim(),selectedSuggestionIndex:-1,hasMore:!1}),t&&this.onSelect(null),this.debouncedFetch(e)}loadMore(){this.state.isLoading||(this.currentLimit+=this.baseLimit,this.updateState({isLoading:!0}),this.executeFetch(this.state.query))}handleKeyDown(e){let t=e.target;if(!t)return;let i=this.state.cities.length+this.state.streets.length+this.state.suggestions.length;if(i>0){if(e.key==="ArrowDown"){e.preventDefault();let r=this.state.selectedSuggestionIndex+1;r>=i&&(r=0),this.updateState({selectedSuggestionIndex:r});return}if(e.key==="ArrowUp"){e.preventDefault();let r=this.state.selectedSuggestionIndex-1;r<0&&(r=i-1),this.updateState({selectedSuggestionIndex:r});return}if(e.key==="Enter"&&this.state.selectedSuggestionIndex>=0){e.preventDefault();let o=[...this.state.cities,...this.state.streets,...this.state.suggestions][this.state.selectedSuggestionIndex];o&&(this.selectItem(o),this.updateState({selectedSuggestionIndex:-1}));return}}let s=t.value;if(e.key===" "&&this.shouldAutoInsertComma(s)){e.preventDefault();let r=`${s.trim()}, `;this.updateQueryAndFetch(r)}}selectItem(e){this.debouncedFetch.cancel(),this.abortController&&this.abortController.abort();let t=typeof e=="string"?e:e.label,i=t;typeof e!="string"&&typeof e.value=="string"&&(i=e.value);let s=typeof e!="string"&&typeof e.value=="object"?e.value:void 0,r=!!s&&Object.keys(s).length>0;if(this.isSelecting=!0,this.state.stage==="final"||r){let n=t;if(s&&Object.keys(s).length>0){let{street:p,street_number:u,house_number:d,city:b}=s,m=u||d;p&&m&&b&&(n=`${p} ${m}, ${b}`)}this.finishSelection(n,s);return}let o=typeof e!="string"?e.subtitle:null;this.processSelection(i,o)}shouldAutoInsertComma(e){if(!e.includes(",")&&x.DIGITS_1_3.test(e.trim()))return!0;if(this.state.stage==="house_number"){let i=this.getCurrentFragment(e);return x.DIGITS_1_3.test(i)}return!1}finishSelection(e,t){this.updateState({query:e,suggestions:[],cities:[],streets:[],isValid:!0,stage:"final",hasMore:!1}),this.onSelect(t||e),setTimeout(()=>{this.isSelecting=!1},0)}processSelection(e,t){let{stage:i,query:s}=this.state,r=s;if(t&&(i==="city"||i==="street"||i==="mixed")){if(i==="city")r=`${t}, ${e}, `;else{let u=this.getQueryPrefix(s);r=u?`${u} ${e}, ${t}, `:`${e}, ${t}, `}this.updateQueryAndFetch(r);return}if(i==="direct"||i==="addition"){this.finishSelection(e);return}!s.includes(",")&&(i==="city"||i==="street"||i==="house_number_first")?r=`${e}, `:(r=this.replaceLastSegment(s,e),i!=="house_number"&&(r+=", ")),this.updateQueryAndFetch(r)}executeFetch(e,t=0){let i=(e||"").toString();if(!i.trim()){this.abortController?.abort(),this.resetState();return}t===0&&(this.updateState({isError:!1}),this.abortController&&this.abortController.abort(),this.abortController=new AbortController);let s=this.abortController?.signal,r=new URL(`${this.apiUrl}/infer/${this.country.toLowerCase()}`),o={authKey:this.authKey,query:i,limit:this.currentLimit.toString()};r.search=new URLSearchParams(o).toString(),this.fetcher(r.toString(),{signal:s}).then(n=>{if(!n.ok){if(t<this.maxRetries&&(n.status>=500||n.status===429))return this.retry(e,t,s);throw new Error("Network error")}return n.json()}).then(n=>{n&&this.mapResponseToState(n)}).catch(n=>{if(n.name!=="AbortError"){if(t<this.maxRetries)return this.retry(e,t,s);this.updateState({isError:!0,isLoading:!1})}})}retry(e,t,i){if(i?.aborted)return;let s=Math.pow(2,t)*200;setTimeout(()=>{i?.aborted||this.executeFetch(e,t+1)},s)}mapResponseToState(e){let t={stage:e.stage,isLoading:!1},i=!1,s=null,r=e.suggestions||[],o=[],n=new Set;for(let u of r){let d=`${u.label}|${u.subtitle||""}|${JSON.stringify(u.value||{})}`;n.has(d)||(n.add(d),o.push(u))}let p=o.length+(e.cities?.length||0)+(e.streets?.length||0);if(t.hasMore=p>=this.currentLimit,e.stage==="mixed"?(t.cities=e.cities||[],t.streets=e.streets||[],t.suggestions=[]):(t.suggestions=o,t.cities=[],t.streets=[],e.stage==="final"&&o.length===1&&(i=!0,s=o[0])),t.isValid=e.stage==="final",i&&s){t.query=s.label,t.suggestions=[],t.cities=[],t.streets=[],t.isValid=!0,t.hasMore=!1,this.updateState(t);let u=typeof s.value=="object"?s.value:s.label;this.onSelect(u)}else this.updateState(t)}updateQueryAndFetch(e){this.updateState({query:e,suggestions:[],cities:[],streets:[]}),this.updateState({isLoading:!0,isValid:!1,hasMore:!1}),this.debouncedFetch(e),setTimeout(()=>{this.isSelecting=!1},0)}replaceLastSegment(e,t){let i=e.lastIndexOf(",");return i===-1?t:`${e.slice(0,i+1)} ${t}`.trim()}getQueryPrefix(e){let t=e.lastIndexOf(",");return t===-1?"":e.slice(0,t+1).trimEnd()}getCurrentFragment(e){return(e.split(",").slice(-1)[0]??"").trim()}resetState(){this.updateState({...g,query:this.state.query})}updateState(e){this.state={...this.state,...e},this.onStateChange(this.state)}debounce(e,t){let i,s=(...r)=>{i&&clearTimeout(i),i=setTimeout(()=>e.apply(this,r),t)};return s.cancel=()=>{i&&(clearTimeout(i),i=void 0)},s}};var S=`
2
2
  .pro6pp-wrapper {
3
3
  position: relative;
4
4
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
@@ -11,6 +11,7 @@
11
11
  .pro6pp-input {
12
12
  width: 100%;
13
13
  padding: 10px 12px;
14
+ padding-right: 48px;
14
15
  border: 1px solid #e0e0e0;
15
16
  border-radius: 4px;
16
17
  font-size: 16px;
@@ -22,6 +23,57 @@
22
23
  border-color: #3b82f6;
23
24
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
24
25
  }
26
+
27
+ .pro6pp-input-addons {
28
+ position: absolute;
29
+ right: 6px;
30
+ top: 0;
31
+ bottom: 0;
32
+ display: flex;
33
+ align-items: center;
34
+ gap: 2px;
35
+ pointer-events: none;
36
+ }
37
+ .pro6pp-input-addons > * {
38
+ pointer-events: auto;
39
+ }
40
+
41
+ .pro6pp-clear-button {
42
+ background: none;
43
+ border: none;
44
+ width: 28px;
45
+ height: 28px;
46
+ cursor: pointer;
47
+ color: #a3a3a3;
48
+ display: flex;
49
+ align-items: center;
50
+ justify-content: center;
51
+ border-radius: 50%;
52
+ transition: color 0.2s, background-color 0.2s, transform 0.1s;
53
+ }
54
+ .pro6pp-clear-button:hover {
55
+ color: #1f2937;
56
+ background-color: #f3f4f6;
57
+ }
58
+ .pro6pp-clear-button:active {
59
+ transform: scale(0.92);
60
+ }
61
+ .pro6pp-clear-button svg {
62
+ width: 18px;
63
+ height: 18px;
64
+ }
65
+
66
+ .pro6pp-loader {
67
+ width: 18px;
68
+ height: 18px;
69
+ margin: 0 4px;
70
+ border: 2px solid #e0e0e0;
71
+ border-top-color: #6b7280;
72
+ border-radius: 50%;
73
+ animation: pro6pp-spin 0.6s linear infinite;
74
+ flex-shrink: 0;
75
+ }
76
+
25
77
  .pro6pp-dropdown {
26
78
  position: absolute;
27
79
  top: 100%;
@@ -32,30 +84,32 @@
32
84
  background: white;
33
85
  border: 1px solid #e0e0e0;
34
86
  border-radius: 4px;
35
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
87
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
36
88
  max-height: 300px;
37
89
  overflow-y: auto;
90
+ display: flex;
91
+ flex-direction: column;
92
+ }
93
+ .pro6pp-list {
38
94
  list-style: none !important;
39
95
  padding: 0 !important;
40
96
  margin: 0 !important;
41
- overflow: hidden;
97
+ flex-grow: 1;
42
98
  }
43
99
  .pro6pp-item {
44
- padding: 12px 12px 9px 12px;
100
+ padding: 12px 16px;
45
101
  cursor: pointer;
46
102
  display: flex;
47
103
  flex-direction: row;
48
104
  align-items: center;
49
- color: #000000;
105
+ color: #111827;
50
106
  font-size: 14px;
51
- line-height: 1;
107
+ line-height: 1.2;
52
108
  white-space: nowrap;
53
109
  overflow: hidden;
54
- border-radius: 0 !important;
55
- margin: 0 !important;
56
110
  }
57
111
  .pro6pp-item:hover, .pro6pp-item--active {
58
- background-color: #f5f5f5;
112
+ background-color: #f9fafb;
59
113
  }
60
114
  .pro6pp-item__label {
61
115
  font-weight: 500;
@@ -63,7 +117,7 @@
63
117
  }
64
118
  .pro6pp-item__subtitle {
65
119
  font-size: 14px;
66
- color: #404040;
120
+ color: #6b7280;
67
121
  overflow: hidden;
68
122
  text-overflow: ellipsis;
69
123
  flex-shrink: 1;
@@ -72,31 +126,33 @@
72
126
  margin-left: auto;
73
127
  display: flex;
74
128
  align-items: center;
75
- color: #a3a3a3;
129
+ color: #9ca3af;
76
130
  padding-left: 8px;
77
131
  }
78
132
  .pro6pp-no-results {
79
- padding: 12px;
80
- color: #555555;
133
+ padding: 16px;
134
+ color: #6b7280;
81
135
  font-size: 14px;
82
136
  text-align: center;
83
- user-select: none;
84
- pointer-events: none;
85
137
  }
86
- .pro6pp-loader {
87
- position: absolute;
88
- right: 12px;
89
- top: 50%;
90
- transform: translateY(-50%);
91
- width: 16px;
92
- height: 16px;
93
- border: 2px solid #e0e0e0;
94
- border-top-color: #404040;
95
- border-radius: 50%;
96
- animation: pro6pp-spin 0.6s linear infinite;
97
- pointer-events: none;
138
+ .pro6pp-load-more {
139
+ width: 100%;
140
+ padding: 10px;
141
+ background: #f9fafb;
142
+ border: none;
143
+ border-top: 1px solid #e0e0e0;
144
+ color: #3b82f6;
145
+ font-size: 13px;
146
+ font-weight: 600;
147
+ cursor: pointer;
148
+ transition: background-color 0.2s;
149
+ flex-shrink: 0;
150
+ }
151
+ .pro6pp-load-more:hover {
152
+ background-color: #f3f4f6;
98
153
  }
154
+
99
155
  @keyframes pro6pp-spin {
100
- to { transform: translateY(-50%) rotate(360deg); }
156
+ to { transform: rotate(360deg); }
101
157
  }
102
- `;return F(A);})();
158
+ `;return L(_);})();
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- var b=Object.defineProperty;var x=(u,t,e)=>t in u?b(u,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):u[t]=e;var n=(u,t,e)=>x(u,typeof t!="symbol"?t+"":t,e);var c={API_URL:"https://api.pro6pp.nl/v2",LIMIT:1e3,DEBOUNCE_MS:300},g={DIGITS_1_3:/^[0-9]{1,3}$/},f={query:"",stage:null,cities:[],streets:[],suggestions:[],isValid:!1,isError:!1,isLoading:!1,selectedSuggestionIndex:-1},S=class{constructor(t){n(this,"country");n(this,"authKey");n(this,"apiUrl");n(this,"limit");n(this,"fetcher");n(this,"onStateChange");n(this,"onSelect");n(this,"state");n(this,"abortController",null);n(this,"debouncedFetch");n(this,"isSelecting",!1);this.country=t.country,this.authKey=t.authKey,this.apiUrl=t.apiUrl||c.API_URL,this.limit=t.limit||c.LIMIT,this.fetcher=t.fetcher||((e,i)=>fetch(e,i)),this.onStateChange=t.onStateChange||(()=>{}),this.onSelect=t.onSelect||(()=>{}),this.state={...f},this.debouncedFetch=this.debounce(e=>this.executeFetch(e),c.DEBOUNCE_MS)}handleInput(t){if(this.isSelecting){this.isSelecting=!1;return}let e=this.state.stage==="final"&&t!==this.state.query;this.updateState({query:t,isValid:!1,isLoading:!!t.trim(),selectedSuggestionIndex:-1}),e&&this.onSelect(null),this.debouncedFetch(t)}handleKeyDown(t){let e=t.target;if(!e)return;let i=this.state.cities.length+this.state.streets.length+this.state.suggestions.length;if(i>0){if(t.key==="ArrowDown"){t.preventDefault();let s=this.state.selectedSuggestionIndex+1;s>=i&&(s=0),this.updateState({selectedSuggestionIndex:s});return}if(t.key==="ArrowUp"){t.preventDefault();let s=this.state.selectedSuggestionIndex-1;s<0&&(s=i-1),this.updateState({selectedSuggestionIndex:s});return}if(t.key==="Enter"&&this.state.selectedSuggestionIndex>=0){t.preventDefault();let o=[...this.state.cities,...this.state.streets,...this.state.suggestions][this.state.selectedSuggestionIndex];o&&(this.selectItem(o),this.updateState({selectedSuggestionIndex:-1}));return}}let r=e.value;if(t.key===" "&&this.shouldAutoInsertComma(r)){t.preventDefault();let s=`${r.trim()}, `;this.updateQueryAndFetch(s)}}selectItem(t){this.debouncedFetch.cancel(),this.abortController&&this.abortController.abort();let e=typeof t=="string"?t:t.label,i=e;typeof t!="string"&&typeof t.value=="string"&&(i=t.value);let r=typeof t!="string"&&typeof t.value=="object"?t.value:void 0,s=!!r&&Object.keys(r).length>0;if(this.isSelecting=!0,this.state.stage==="final"||s){let p=e;if(r&&Object.keys(r).length>0){let{street:a,street_number:l,house_number:m,city:d}=r,h=l||m;a&&h&&d&&(p=`${a} ${h}, ${d}`)}this.finishSelection(p,r);return}let o=typeof t!="string"?t.subtitle:null;this.processSelection(i,o)}shouldAutoInsertComma(t){if(!t.includes(",")&&g.DIGITS_1_3.test(t.trim()))return!0;if(this.state.stage==="house_number"){let i=this.getCurrentFragment(t);return g.DIGITS_1_3.test(i)}return!1}finishSelection(t,e){this.updateState({query:t,suggestions:[],cities:[],streets:[],isValid:!0,stage:"final"}),this.onSelect(e||t),setTimeout(()=>{this.isSelecting=!1},0)}processSelection(t,e){let{stage:i,query:r}=this.state,s=r;if(e&&(i==="city"||i==="street"||i==="mixed")){if(i==="city")s=`${e}, ${t}, `;else{let l=this.getQueryPrefix(r);s=l?`${l} ${t}, ${e}, `:`${t}, ${e}, `}this.updateQueryAndFetch(s);return}if(i==="direct"||i==="addition"){this.finishSelection(t);return}!r.includes(",")&&(i==="city"||i==="street"||i==="house_number_first")?s=`${t}, `:(s=this.replaceLastSegment(r,t),i!=="house_number"&&(s+=", ")),this.updateQueryAndFetch(s)}executeFetch(t){let e=(t||"").toString();if(!e.trim()){this.abortController?.abort(),this.resetState();return}this.updateState({isError:!1}),this.abortController&&this.abortController.abort(),this.abortController=new AbortController;let i=new URL(`${this.apiUrl}/infer/${this.country.toLowerCase()}`),r={authKey:this.authKey,query:e,limit:this.limit.toString()};i.search=new URLSearchParams(r).toString(),this.fetcher(i.toString(),{signal:this.abortController.signal}).then(s=>{if(!s.ok)throw new Error("Network error");return s.json()}).then(s=>this.mapResponseToState(s)).catch(s=>{s.name!=="AbortError"&&this.updateState({isError:!0,isLoading:!1})})}mapResponseToState(t){let e={stage:t.stage,isLoading:!1},i=!1,r=null,s=t.suggestions||[],o=[],p=new Set;for(let a of s){let l=`${a.label}|${a.subtitle||""}|${JSON.stringify(a.value||{})}`;p.has(l)||(p.add(l),o.push(a))}if(t.stage==="mixed"?(e.cities=t.cities||[],e.streets=t.streets||[],e.suggestions=[]):(e.suggestions=o,e.cities=[],e.streets=[],t.stage==="final"&&o.length===1&&(i=!0,r=o[0])),e.isValid=t.stage==="final",i&&r){e.query=r.label,e.suggestions=[],e.cities=[],e.streets=[],e.isValid=!0,this.updateState(e);let a=typeof r.value=="object"?r.value:r.label;this.onSelect(a)}else this.updateState(e)}updateQueryAndFetch(t){this.updateState({query:t,suggestions:[],cities:[],streets:[]}),this.updateState({isLoading:!0,isValid:!1}),this.debouncedFetch(t),setTimeout(()=>{this.isSelecting=!1},0)}replaceLastSegment(t,e){let i=t.lastIndexOf(",");return i===-1?e:`${t.slice(0,i+1)} ${e}`.trim()}getQueryPrefix(t){let e=t.lastIndexOf(",");return e===-1?"":t.slice(0,e+1).trimEnd()}getCurrentFragment(t){return(t.split(",").slice(-1)[0]??"").trim()}resetState(){this.updateState({...f,query:this.state.query})}updateState(t){this.state={...this.state,...t},this.onStateChange(this.state)}debounce(t,e){let i,r=(...s)=>{i&&clearTimeout(i),i=setTimeout(()=>t.apply(this,s),e)};return r.cancel=()=>{i&&(clearTimeout(i),i=void 0)},r}};var y=`
1
+ var x=Object.defineProperty;var S=(u,e,t)=>e in u?x(u,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):u[e]=t;var a=(u,e,t)=>S(u,typeof e!="symbol"?e+"":e,t);var c={API_URL:"https://api.pro6pp.nl/v2",LIMIT:20,DEBOUNCE_MS:150,MIN_DEBOUNCE_MS:50,MAX_RETRIES:0},f={DIGITS_1_3:/^[0-9]{1,3}$/},b={query:"",stage:null,cities:[],streets:[],suggestions:[],isValid:!1,isError:!1,isLoading:!1,hasMore:!1,selectedSuggestionIndex:-1},m=class{constructor(e){a(this,"country");a(this,"authKey");a(this,"apiUrl");a(this,"baseLimit");a(this,"currentLimit");a(this,"maxRetries");a(this,"fetcher");a(this,"onStateChange");a(this,"onSelect");a(this,"state");a(this,"abortController",null);a(this,"debouncedFetch");a(this,"isSelecting",!1);this.country=e.country,this.authKey=e.authKey,this.apiUrl=e.apiUrl||c.API_URL,this.baseLimit=e.limit||c.LIMIT,this.currentLimit=this.baseLimit;let t=e.maxRetries!==void 0?e.maxRetries:c.MAX_RETRIES;this.maxRetries=Math.max(0,Math.min(t,10)),this.fetcher=e.fetcher||((r,o)=>fetch(r,o)),this.onStateChange=e.onStateChange||(()=>{}),this.onSelect=e.onSelect||(()=>{}),this.state={...b};let i=e.debounceMs!==void 0?e.debounceMs:c.DEBOUNCE_MS,s=Math.max(i,c.MIN_DEBOUNCE_MS);this.debouncedFetch=this.debounce(r=>this.executeFetch(r),s)}handleInput(e){if(this.isSelecting){this.isSelecting=!1;return}this.currentLimit=this.baseLimit;let t=this.state.stage==="final"&&e!==this.state.query;this.updateState({query:e,isValid:!1,isLoading:!!e.trim(),selectedSuggestionIndex:-1,hasMore:!1}),t&&this.onSelect(null),this.debouncedFetch(e)}loadMore(){this.state.isLoading||(this.currentLimit+=this.baseLimit,this.updateState({isLoading:!0}),this.executeFetch(this.state.query))}handleKeyDown(e){let t=e.target;if(!t)return;let i=this.state.cities.length+this.state.streets.length+this.state.suggestions.length;if(i>0){if(e.key==="ArrowDown"){e.preventDefault();let r=this.state.selectedSuggestionIndex+1;r>=i&&(r=0),this.updateState({selectedSuggestionIndex:r});return}if(e.key==="ArrowUp"){e.preventDefault();let r=this.state.selectedSuggestionIndex-1;r<0&&(r=i-1),this.updateState({selectedSuggestionIndex:r});return}if(e.key==="Enter"&&this.state.selectedSuggestionIndex>=0){e.preventDefault();let o=[...this.state.cities,...this.state.streets,...this.state.suggestions][this.state.selectedSuggestionIndex];o&&(this.selectItem(o),this.updateState({selectedSuggestionIndex:-1}));return}}let s=t.value;if(e.key===" "&&this.shouldAutoInsertComma(s)){e.preventDefault();let r=`${s.trim()}, `;this.updateQueryAndFetch(r)}}selectItem(e){this.debouncedFetch.cancel(),this.abortController&&this.abortController.abort();let t=typeof e=="string"?e:e.label,i=t;typeof e!="string"&&typeof e.value=="string"&&(i=e.value);let s=typeof e!="string"&&typeof e.value=="object"?e.value:void 0,r=!!s&&Object.keys(s).length>0;if(this.isSelecting=!0,this.state.stage==="final"||r){let n=t;if(s&&Object.keys(s).length>0){let{street:p,street_number:l,house_number:d,city:h}=s,g=l||d;p&&g&&h&&(n=`${p} ${g}, ${h}`)}this.finishSelection(n,s);return}let o=typeof e!="string"?e.subtitle:null;this.processSelection(i,o)}shouldAutoInsertComma(e){if(!e.includes(",")&&f.DIGITS_1_3.test(e.trim()))return!0;if(this.state.stage==="house_number"){let i=this.getCurrentFragment(e);return f.DIGITS_1_3.test(i)}return!1}finishSelection(e,t){this.updateState({query:e,suggestions:[],cities:[],streets:[],isValid:!0,stage:"final",hasMore:!1}),this.onSelect(t||e),setTimeout(()=>{this.isSelecting=!1},0)}processSelection(e,t){let{stage:i,query:s}=this.state,r=s;if(t&&(i==="city"||i==="street"||i==="mixed")){if(i==="city")r=`${t}, ${e}, `;else{let l=this.getQueryPrefix(s);r=l?`${l} ${e}, ${t}, `:`${e}, ${t}, `}this.updateQueryAndFetch(r);return}if(i==="direct"||i==="addition"){this.finishSelection(e);return}!s.includes(",")&&(i==="city"||i==="street"||i==="house_number_first")?r=`${e}, `:(r=this.replaceLastSegment(s,e),i!=="house_number"&&(r+=", ")),this.updateQueryAndFetch(r)}executeFetch(e,t=0){let i=(e||"").toString();if(!i.trim()){this.abortController?.abort(),this.resetState();return}t===0&&(this.updateState({isError:!1}),this.abortController&&this.abortController.abort(),this.abortController=new AbortController);let s=this.abortController?.signal,r=new URL(`${this.apiUrl}/infer/${this.country.toLowerCase()}`),o={authKey:this.authKey,query:i,limit:this.currentLimit.toString()};r.search=new URLSearchParams(o).toString(),this.fetcher(r.toString(),{signal:s}).then(n=>{if(!n.ok){if(t<this.maxRetries&&(n.status>=500||n.status===429))return this.retry(e,t,s);throw new Error("Network error")}return n.json()}).then(n=>{n&&this.mapResponseToState(n)}).catch(n=>{if(n.name!=="AbortError"){if(t<this.maxRetries)return this.retry(e,t,s);this.updateState({isError:!0,isLoading:!1})}})}retry(e,t,i){if(i?.aborted)return;let s=Math.pow(2,t)*200;setTimeout(()=>{i?.aborted||this.executeFetch(e,t+1)},s)}mapResponseToState(e){let t={stage:e.stage,isLoading:!1},i=!1,s=null,r=e.suggestions||[],o=[],n=new Set;for(let l of r){let d=`${l.label}|${l.subtitle||""}|${JSON.stringify(l.value||{})}`;n.has(d)||(n.add(d),o.push(l))}let p=o.length+(e.cities?.length||0)+(e.streets?.length||0);if(t.hasMore=p>=this.currentLimit,e.stage==="mixed"?(t.cities=e.cities||[],t.streets=e.streets||[],t.suggestions=[]):(t.suggestions=o,t.cities=[],t.streets=[],e.stage==="final"&&o.length===1&&(i=!0,s=o[0])),t.isValid=e.stage==="final",i&&s){t.query=s.label,t.suggestions=[],t.cities=[],t.streets=[],t.isValid=!0,t.hasMore=!1,this.updateState(t);let l=typeof s.value=="object"?s.value:s.label;this.onSelect(l)}else this.updateState(t)}updateQueryAndFetch(e){this.updateState({query:e,suggestions:[],cities:[],streets:[]}),this.updateState({isLoading:!0,isValid:!1,hasMore:!1}),this.debouncedFetch(e),setTimeout(()=>{this.isSelecting=!1},0)}replaceLastSegment(e,t){let i=e.lastIndexOf(",");return i===-1?t:`${e.slice(0,i+1)} ${t}`.trim()}getQueryPrefix(e){let t=e.lastIndexOf(",");return t===-1?"":e.slice(0,t+1).trimEnd()}getCurrentFragment(e){return(e.split(",").slice(-1)[0]??"").trim()}resetState(){this.updateState({...b,query:this.state.query})}updateState(e){this.state={...this.state,...e},this.onStateChange(this.state)}debounce(e,t){let i,s=(...r)=>{i&&clearTimeout(i),i=setTimeout(()=>e.apply(this,r),t)};return s.cancel=()=>{i&&(clearTimeout(i),i=void 0)},s}};var y=`
2
2
  .pro6pp-wrapper {
3
3
  position: relative;
4
4
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
@@ -11,6 +11,7 @@ var b=Object.defineProperty;var x=(u,t,e)=>t in u?b(u,t,{enumerable:!0,configura
11
11
  .pro6pp-input {
12
12
  width: 100%;
13
13
  padding: 10px 12px;
14
+ padding-right: 48px;
14
15
  border: 1px solid #e0e0e0;
15
16
  border-radius: 4px;
16
17
  font-size: 16px;
@@ -22,6 +23,57 @@ var b=Object.defineProperty;var x=(u,t,e)=>t in u?b(u,t,{enumerable:!0,configura
22
23
  border-color: #3b82f6;
23
24
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
24
25
  }
26
+
27
+ .pro6pp-input-addons {
28
+ position: absolute;
29
+ right: 6px;
30
+ top: 0;
31
+ bottom: 0;
32
+ display: flex;
33
+ align-items: center;
34
+ gap: 2px;
35
+ pointer-events: none;
36
+ }
37
+ .pro6pp-input-addons > * {
38
+ pointer-events: auto;
39
+ }
40
+
41
+ .pro6pp-clear-button {
42
+ background: none;
43
+ border: none;
44
+ width: 28px;
45
+ height: 28px;
46
+ cursor: pointer;
47
+ color: #a3a3a3;
48
+ display: flex;
49
+ align-items: center;
50
+ justify-content: center;
51
+ border-radius: 50%;
52
+ transition: color 0.2s, background-color 0.2s, transform 0.1s;
53
+ }
54
+ .pro6pp-clear-button:hover {
55
+ color: #1f2937;
56
+ background-color: #f3f4f6;
57
+ }
58
+ .pro6pp-clear-button:active {
59
+ transform: scale(0.92);
60
+ }
61
+ .pro6pp-clear-button svg {
62
+ width: 18px;
63
+ height: 18px;
64
+ }
65
+
66
+ .pro6pp-loader {
67
+ width: 18px;
68
+ height: 18px;
69
+ margin: 0 4px;
70
+ border: 2px solid #e0e0e0;
71
+ border-top-color: #6b7280;
72
+ border-radius: 50%;
73
+ animation: pro6pp-spin 0.6s linear infinite;
74
+ flex-shrink: 0;
75
+ }
76
+
25
77
  .pro6pp-dropdown {
26
78
  position: absolute;
27
79
  top: 100%;
@@ -32,30 +84,32 @@ var b=Object.defineProperty;var x=(u,t,e)=>t in u?b(u,t,{enumerable:!0,configura
32
84
  background: white;
33
85
  border: 1px solid #e0e0e0;
34
86
  border-radius: 4px;
35
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
87
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
36
88
  max-height: 300px;
37
89
  overflow-y: auto;
90
+ display: flex;
91
+ flex-direction: column;
92
+ }
93
+ .pro6pp-list {
38
94
  list-style: none !important;
39
95
  padding: 0 !important;
40
96
  margin: 0 !important;
41
- overflow: hidden;
97
+ flex-grow: 1;
42
98
  }
43
99
  .pro6pp-item {
44
- padding: 12px 12px 9px 12px;
100
+ padding: 12px 16px;
45
101
  cursor: pointer;
46
102
  display: flex;
47
103
  flex-direction: row;
48
104
  align-items: center;
49
- color: #000000;
105
+ color: #111827;
50
106
  font-size: 14px;
51
- line-height: 1;
107
+ line-height: 1.2;
52
108
  white-space: nowrap;
53
109
  overflow: hidden;
54
- border-radius: 0 !important;
55
- margin: 0 !important;
56
110
  }
57
111
  .pro6pp-item:hover, .pro6pp-item--active {
58
- background-color: #f5f5f5;
112
+ background-color: #f9fafb;
59
113
  }
60
114
  .pro6pp-item__label {
61
115
  font-weight: 500;
@@ -63,7 +117,7 @@ var b=Object.defineProperty;var x=(u,t,e)=>t in u?b(u,t,{enumerable:!0,configura
63
117
  }
64
118
  .pro6pp-item__subtitle {
65
119
  font-size: 14px;
66
- color: #404040;
120
+ color: #6b7280;
67
121
  overflow: hidden;
68
122
  text-overflow: ellipsis;
69
123
  flex-shrink: 1;
@@ -72,31 +126,33 @@ var b=Object.defineProperty;var x=(u,t,e)=>t in u?b(u,t,{enumerable:!0,configura
72
126
  margin-left: auto;
73
127
  display: flex;
74
128
  align-items: center;
75
- color: #a3a3a3;
129
+ color: #9ca3af;
76
130
  padding-left: 8px;
77
131
  }
78
132
  .pro6pp-no-results {
79
- padding: 12px;
80
- color: #555555;
133
+ padding: 16px;
134
+ color: #6b7280;
81
135
  font-size: 14px;
82
136
  text-align: center;
83
- user-select: none;
84
- pointer-events: none;
85
137
  }
86
- .pro6pp-loader {
87
- position: absolute;
88
- right: 12px;
89
- top: 50%;
90
- transform: translateY(-50%);
91
- width: 16px;
92
- height: 16px;
93
- border: 2px solid #e0e0e0;
94
- border-top-color: #404040;
95
- border-radius: 50%;
96
- animation: pro6pp-spin 0.6s linear infinite;
97
- pointer-events: none;
138
+ .pro6pp-load-more {
139
+ width: 100%;
140
+ padding: 10px;
141
+ background: #f9fafb;
142
+ border: none;
143
+ border-top: 1px solid #e0e0e0;
144
+ color: #3b82f6;
145
+ font-size: 13px;
146
+ font-weight: 600;
147
+ cursor: pointer;
148
+ transition: background-color 0.2s;
149
+ flex-shrink: 0;
150
+ }
151
+ .pro6pp-load-more:hover {
152
+ background-color: #f3f4f6;
98
153
  }
154
+
99
155
  @keyframes pro6pp-spin {
100
- to { transform: translateY(-50%) rotate(360deg); }
156
+ to { transform: rotate(360deg); }
101
157
  }
102
- `;export{y as DEFAULT_STYLES,f as INITIAL_STATE,S as InferCore};
158
+ `;export{y as DEFAULT_STYLES,b as INITIAL_STATE,m as InferCore};
package/package.json CHANGED
@@ -22,7 +22,7 @@
22
22
  "url": "https://github.com/pro6pp/infer-sdk/issues"
23
23
  },
24
24
  "sideEffects": false,
25
- "version": "0.0.2-beta.5",
25
+ "version": "0.0.2-beta.7",
26
26
  "main": "./dist/index.cjs",
27
27
  "module": "./dist/index.js",
28
28
  "types": "./dist/index.d.ts",