@stachelock/ui 0.6.4 → 0.6.5

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/inputs/AddressInput.js +262 -262
  2. package/dist/src/services/geocoding.service.d.ts +1 -0
  3. package/package.json +1 -1
package/dist/inputs/AddressInput.js CHANGED
@@ -1,118 +1,118 @@
1
- import { defineComponent as me, inject as ye, onMounted as pe, ref as S, reactive as ve, computed as T, watch as be, createElementBlock as A, openBlock as p, createVNode as m, unref as g, withCtx as k, createElementVNode as y, createCommentVNode as L, normalizeClass as w, createBlock as U, Fragment as he, renderList as xe, toDisplayString as R, resolveDynamicComponent as ke, createTextVNode as Z } from "vue";
2
- import { Combobox as we, ComboboxInput as Ce, ComboboxButton as Ie, TransitionRoot as H, ComboboxOptions as Se, ComboboxOption as Ae } from "@headlessui/vue";
3
- import { LockClosedIcon as ze, MagnifyingGlassIcon as Ke, CheckIcon as Ge, ChevronDownIcon as Me, ChevronUpIcon as Te } from "@heroicons/vue/20/solid";
4
- import { ClockIcon as W, ExclamationCircleIcon as Ue, CheckCircleIcon as $e } from "@heroicons/vue/24/outline";
5
- import { useField as Ee } from "vee-validate";
6
- import { debounce as Q } from "lodash-es";
7
- import Oe from "../forms/FormFieldWrapper.js";
8
- import z from "./TextInput.js";
9
- import { g as Pe } from "../id-DafBB_QF.js";
10
- import { Loader as Le } from "@googlemaps/js-api-loader";
11
- import { _ as Re } from "../_plugin-vue_export-helper-CHgC5LLL.js";
12
- let v = null, M = null, $ = null, K = null, N = !1;
13
- const G = /* @__PURE__ */ new Map(), Ne = 1e3, Fe = 1e3 * 60 * 60 * 24;
14
- function Be(e) {
15
- v = e, N = !1, K = null, $ = null, M = null;
1
+ import { defineComponent as me, inject as pe, onMounted as ye, ref as $, reactive as ve, computed as E, watch as be, createElementBlock as K, openBlock as x, createVNode as y, unref as p, withCtx as C, createElementVNode as v, createCommentVNode as R, normalizeClass as I, createBlock as O, Fragment as he, renderList as xe, toDisplayString as N, resolveDynamicComponent as ke, createTextVNode as H } from "vue";
2
+ import { Combobox as we, ComboboxInput as Ce, ComboboxButton as Ie, TransitionRoot as W, ComboboxOptions as Se, ComboboxOption as Ae } from "@headlessui/vue";
3
+ import { LockClosedIcon as ze, MagnifyingGlassIcon as _e, CheckIcon as $e, ChevronDownIcon as Ke, ChevronUpIcon as Ge } from "@heroicons/vue/20/solid";
4
+ import { ClockIcon as Q, ExclamationCircleIcon as Te, CheckCircleIcon as Me } from "@heroicons/vue/24/outline";
5
+ import { useField as Ue } from "vee-validate";
6
+ import { debounce as X } from "lodash-es";
7
+ import Ee from "../forms/FormFieldWrapper.js";
8
+ import G from "./TextInput.js";
9
+ import { g as Oe } from "../id-DafBB_QF.js";
10
+ import { Loader as Pe } from "@googlemaps/js-api-loader";
11
+ import { _ as Le } from "../_plugin-vue_export-helper-CHgC5LLL.js";
12
+ let k = null, U = null, L = null, T = null, F = !1;
13
+ const M = /* @__PURE__ */ new Map(), Re = 1e3, Ne = 1e3 * 60 * 60 * 24;
14
+ function Fe(e) {
15
+ k = e, F = !1, T = null, L = null, U = null;
16
16
  }
17
17
  function De() {
18
- return v !== null && !!v.apiKey;
18
+ return k !== null && !!k.apiKey;
19
19
  }
20
- async function F() {
21
- if (!N) {
22
- if (K)
23
- return K;
24
- if (!v?.apiKey)
20
+ async function D() {
21
+ if (!F) {
22
+ if (T)
23
+ return T;
24
+ if (!k?.apiKey)
25
25
  throw new Error(
26
26
  '[Geocoding] API key not configured. Call configureGeocoding({ apiKey: "..." }) first, or configure via StachelockUI plugin with googleMaps.apiKey option.'
27
27
  );
28
- return K = (async () => {
28
+ return T = (async () => {
29
29
  try {
30
- await new Le({
31
- apiKey: v.apiKey,
32
- version: v.version || "weekly",
30
+ await new Pe({
31
+ apiKey: k.apiKey,
32
+ version: k.version || "weekly",
33
33
  id: "__stachelockGoogleMapsScriptId",
34
- libraries: v.libraries || ["places", "maps", "geometry"]
35
- }).load(), $ = await google.maps.importLibrary("places"), M = new google.maps.Geocoder(), N = !0;
34
+ libraries: k.libraries || ["places", "maps", "geometry"]
35
+ }).load(), L = await google.maps.importLibrary("places"), U = new google.maps.Geocoder(), F = !0;
36
36
  } catch (e) {
37
- throw K = null, console.error("[Geocoding] Error loading Google Maps API:", e), e;
37
+ throw T = null, console.error("[Geocoding] Error loading Google Maps API:", e), e;
38
38
  }
39
- })(), K;
39
+ })(), T;
40
40
  }
41
41
  }
42
- function X(e) {
43
- return e.trim().toLowerCase().replace(/\s+/g, " ");
44
- }
45
42
  function J(e) {
46
- return typeof e == "string" ? `str:${X(e)}` : `pid:${e.placeId}`;
43
+ return e.trim().toLowerCase().replace(/\s+/g, " ");
47
44
  }
48
45
  function Y(e) {
49
- const o = G.get(e);
50
- return o ? Date.now() - o.ts > Fe ? (G.delete(e), null) : o.result : null;
46
+ return typeof e == "string" ? `str:${J(e)}` : `pid:${e.placeId}`;
47
+ }
48
+ function q(e) {
49
+ const a = M.get(e);
50
+ return a ? Date.now() - a.ts > Ne ? (M.delete(e), null) : a.result : null;
51
51
  }
52
- function q(e, o) {
52
+ function ee(e, a) {
53
53
  try {
54
- if (G.size >= Ne) {
55
- const c = G.keys().next().value;
56
- c && G.delete(c);
54
+ if (M.size >= Re) {
55
+ const c = M.keys().next().value;
56
+ c && M.delete(c);
57
57
  }
58
- G.set(e, { result: o, ts: Date.now() });
58
+ M.set(e, { result: a, ts: Date.now() });
59
59
  } catch {
60
60
  }
61
61
  }
62
- function ee(e, o = 15, c = "200x200") {
63
- if (!v?.apiKey) return "";
64
- const i = v.staticMapsApiKey || v.apiKey, r = "https://maps.googleapis.com/maps/api/staticmap", d = new URLSearchParams({
62
+ function te(e, a = 15, c = "200x200") {
63
+ if (!k?.apiKey) return "";
64
+ const n = k.staticMapsApiKey || k.apiKey, i = "https://maps.googleapis.com/maps/api/staticmap", f = new URLSearchParams({
65
65
  center: `${e.lat},${e.lng}`,
66
- zoom: o.toString(),
66
+ zoom: a.toString(),
67
67
  size: c,
68
- key: i,
68
+ key: n,
69
69
  markers: `color:red|${e.lat},${e.lng}`
70
70
  });
71
- return `${r}?${d.toString()}`;
71
+ return `${i}?${f.toString()}`;
72
72
  }
73
- async function Ve(e) {
73
+ async function Be(e) {
74
74
  if (!e?.trim())
75
75
  return {
76
76
  status: "INVALID_INPUT",
77
77
  message: "No placeId provided for geocoding."
78
78
  };
79
- await F();
80
- const o = J({ placeId: e }), c = Y(o);
81
- return c || new Promise((i) => {
82
- if (!M) {
83
- i({
79
+ await D();
80
+ const a = Y({ placeId: e }), c = q(a);
81
+ return c || new Promise((n) => {
82
+ if (!U) {
83
+ n({
84
84
  status: "ERROR",
85
85
  message: "Geocoder service not initialized."
86
86
  });
87
87
  return;
88
88
  }
89
- M.geocode({ placeId: e }, (r, d) => {
90
- if (d === google.maps.GeocoderStatus.OK && r && r.length > 0) {
91
- const u = r[0], n = u.geometry ? {
92
- lat: u.geometry.location.lat(),
93
- lng: u.geometry.location.lng()
89
+ U.geocode({ placeId: e }, (i, f) => {
90
+ if (f === google.maps.GeocoderStatus.OK && i && i.length > 0) {
91
+ const d = i[0], r = d.geometry ? {
92
+ lat: d.geometry.location.lat(),
93
+ lng: d.geometry.location.lng()
94
94
  } : void 0, h = {
95
95
  status: "OK",
96
96
  message: "Found address",
97
- address_components: u.address_components || [],
98
- location: n,
99
- formatted_address: u.formatted_address || "",
100
- thumbnailUrl: n ? ee(n) : void 0
97
+ address_components: d.address_components || [],
98
+ location: r,
99
+ formatted_address: d.formatted_address || "",
100
+ thumbnailUrl: r ? te(r) : void 0
101
101
  };
102
- q(o, h), i(h);
102
+ ee(a, h), n(h);
103
103
  } else
104
- i({
105
- status: d.toString(),
106
- message: `Unable to geocode place: ${d}`
104
+ n({
105
+ status: f.toString(),
106
+ message: `Unable to geocode place: ${f}`
107
107
  });
108
108
  });
109
109
  });
110
110
  }
111
- function _e(e) {
112
- const o = X(e);
113
- if (o.length < 10) return !1;
114
- const c = /\d/.test(o), i = o.includes(","), r = /\b([A-Z]{2})\b/i.test(e), d = /\b\d{5}(?:-\d{4})?\b/.test(o);
115
- return (i || r || d) && c;
111
+ function Ve(e) {
112
+ const a = J(e);
113
+ if (a.length < 10) return !1;
114
+ const c = /\d/.test(a), n = a.includes(","), i = /\b([A-Z]{2})\b/i.test(e), f = /\b\d{5}(?:-\d{4})?\b/.test(a);
115
+ return (n || i || f) && c;
116
116
  }
117
117
  async function je(e) {
118
118
  if (!e?.trim())
@@ -120,64 +120,64 @@ async function je(e) {
120
120
  status: "INVALID_INPUT",
121
121
  message: "No address provided for geocoding."
122
122
  };
123
- if (!_e(e))
123
+ if (!Ve(e))
124
124
  return {
125
125
  status: "INVALID_INPUT",
126
126
  message: "Insufficient address information for geocoding."
127
127
  };
128
- await F();
129
- const o = J(e), c = Y(o);
130
- return c || new Promise((i) => {
131
- if (!M) {
132
- i({
128
+ await D();
129
+ const a = Y(e), c = q(a);
130
+ return c || new Promise((n) => {
131
+ if (!U) {
132
+ n({
133
133
  status: "ERROR",
134
134
  message: "Geocoder service not initialized."
135
135
  });
136
136
  return;
137
137
  }
138
- M.geocode({ address: e }, (r, d) => {
139
- if (d === google.maps.GeocoderStatus.OK && r && r.length > 0) {
140
- const u = r[0], n = u.geometry ? {
141
- lat: u.geometry.location.lat(),
142
- lng: u.geometry.location.lng()
138
+ U.geocode({ address: e }, (i, f) => {
139
+ if (f === google.maps.GeocoderStatus.OK && i && i.length > 0) {
140
+ const d = i[0], r = d.geometry ? {
141
+ lat: d.geometry.location.lat(),
142
+ lng: d.geometry.location.lng()
143
143
  } : void 0, h = {
144
144
  status: "OK",
145
145
  message: "Found address",
146
- address_components: u.address_components || [],
147
- location: n,
148
- formatted_address: u.formatted_address || "",
149
- thumbnailUrl: n ? ee(n) : void 0
146
+ address_components: d.address_components || [],
147
+ location: r,
148
+ formatted_address: d.formatted_address || "",
149
+ thumbnailUrl: r ? te(r) : void 0
150
150
  };
151
- q(o, h), i(h);
151
+ ee(a, h), n(h);
152
152
  } else
153
- i({
154
- status: d.toString(),
155
- message: `Unable to geocode address: ${d}`
153
+ n({
154
+ status: f.toString(),
155
+ message: `Unable to geocode address: ${f}`
156
156
  });
157
157
  });
158
158
  });
159
159
  }
160
- async function Ze(e, o) {
160
+ async function Ze(e, a) {
161
161
  if (!e?.trim())
162
162
  return [];
163
- if (await F(), !$)
163
+ if (await D(), !L)
164
164
  return console.warn("[Geocoding] Places library not initialized"), [];
165
165
  try {
166
- const { AutocompleteSuggestion: c } = $, i = {
166
+ const { AutocompleteSuggestion: c } = L, n = {
167
167
  input: e,
168
- ...o?.includedPrimaryTypes && { includedPrimaryTypes: o.includedPrimaryTypes },
169
- ...o?.includedRegionCodes && { includedRegionCodes: o.includedRegionCodes }
170
- }, { suggestions: r } = await c.fetchAutocompleteSuggestions(i);
171
- return r.filter(
172
- (u) => u.placePrediction !== null
173
- ).map((u) => {
174
- const n = u.placePrediction;
168
+ ...a?.includedPrimaryTypes && { includedPrimaryTypes: a.includedPrimaryTypes },
169
+ ...a?.includedRegionCodes && { includedRegionCodes: a.includedRegionCodes }
170
+ }, { suggestions: i } = await c.fetchAutocompleteSuggestions(n);
171
+ return i.filter(
172
+ (d) => d.placePrediction !== null
173
+ ).map((d) => {
174
+ const r = d.placePrediction;
175
175
  return {
176
- placeId: n.placeId,
177
- description: n.text.toString(),
178
- mainText: n.mainText?.toString() || n.text.toString(),
179
- secondaryText: n.secondaryText?.toString() || "",
180
- types: n.types || []
176
+ placeId: r.placeId,
177
+ description: r.text.toString(),
178
+ mainText: r.mainText?.toString() || r.text.toString(),
179
+ secondaryText: r.secondaryText?.toString() || "",
180
+ types: r.types || []
181
181
  };
182
182
  });
183
183
  } catch (c) {
@@ -185,7 +185,7 @@ async function Ze(e, o) {
185
185
  }
186
186
  }
187
187
  function He(e) {
188
- const o = {
188
+ const a = {
189
189
  street: "",
190
190
  city: "",
191
191
  state: "",
@@ -193,13 +193,13 @@ function He(e) {
193
193
  country: ""
194
194
  };
195
195
  if (!e?.address_components)
196
- return o;
197
- let c = "", i = "";
198
- for (const r of e.address_components) {
199
- const d = r.types;
200
- d.includes("street_number") ? c = r.long_name : d.includes("route") ? i = r.long_name : d.includes("locality") ? o.city = r.long_name : d.includes("administrative_area_level_1") ? o.state = r.short_name : d.includes("postal_code") ? o.zipcode = r.long_name : d.includes("country") && (o.country = r.short_name);
196
+ return a;
197
+ let c = "", n = "", i = "", f = "", d = "", r = "", h = "", S = "", A = "", P = "", b = "", z = "";
198
+ for (const g of e.address_components) {
199
+ const u = g.types;
200
+ u.includes("street_number") ? c = g.long_name : u.includes("route") ? n = g.long_name : u.includes("subpremise") ? i = g.long_name : u.includes("premise") ? f = g.long_name : u.includes("locality") ? d = g.long_name : u.includes("sublocality") || u.includes("sublocality_level_1") ? u.includes("sublocality_level_1") ? h = g.long_name : r = g.long_name : u.includes("administrative_area_level_2") ? S = g.long_name : u.includes("administrative_area_level_3") ? A = g.long_name : u.includes("postal_town") ? P = g.long_name : u.includes("administrative_area_level_1") ? a.state = g.short_name : u.includes("postal_code") ? b = g.long_name : u.includes("postal_code_prefix") ? z = g.long_name : u.includes("country") && (a.country = g.short_name);
201
201
  }
202
- return o.street = [c, i].filter(Boolean).join(" "), o;
202
+ return c && n ? a.street = `${c} ${n}` : n ? a.street = n : f && (a.street = f), i && a.street && (a.street = `${a.street}, ${i}`), a.city = d || P || h || r || A || S || "", a.zipcode = b || z || "", a;
203
203
  }
204
204
  function We(e) {
205
205
  return [
@@ -228,31 +228,31 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
228
228
  validateOnMount: { type: Boolean, default: !1 }
229
229
  },
230
230
  emits: ["update:modelValue", "blur", "focus"],
231
- setup(e, { expose: o, emit: c }) {
232
- const i = e, r = c, d = Pe(i.name || "address-input"), u = ye("googleMaps", void 0);
233
- pe(() => {
234
- u?.apiKey && !De() && Be({
235
- apiKey: u.apiKey,
236
- version: u.version,
237
- libraries: u.libraries
231
+ setup(e, { expose: a, emit: c }) {
232
+ const n = e, i = c, f = Oe(n.name || "address-input"), d = pe("googleMaps", void 0);
233
+ ye(() => {
234
+ d?.apiKey && !De() && Fe({
235
+ apiKey: d.apiKey,
236
+ version: d.version,
237
+ libraries: d.libraries
238
238
  });
239
239
  });
240
- const { value: n, errorMessage: h, meta: E, handleChange: O, setTouched: te } = Ee(
241
- () => i.name,
242
- i.rules,
240
+ const { value: r, errorMessage: h, meta: S, handleChange: A, setTouched: P } = Ue(
241
+ () => n.name,
242
+ n.rules,
243
243
  {
244
- validateOnMount: i.validateOnMount,
245
- initialValue: i.modelValue
244
+ validateOnMount: n.validateOnMount,
245
+ initialValue: n.modelValue
246
246
  }
247
- ), b = S([]), P = S(null), B = S(""), C = S(!1), D = S(!1), f = S("unverified"), s = ve({
247
+ ), b = $([]), z = $(null), g = $(""), u = $(!1), B = $(!1), m = $("unverified"), s = ve({
248
248
  street: "",
249
249
  suite: "",
250
250
  city: "",
251
251
  state: "",
252
252
  zipcode: "",
253
253
  country: ""
254
- }), V = T(() => !!(n.value?.formattedAddress || n.value?.street)), se = T(() => i.showSuggestionCount && b.value.length > 0 ? `${b.value.length} suggestions` : i.tertiaryLabel), _ = T(() => {
255
- switch (f.value) {
254
+ }), V = E(() => !!(r.value?.formattedAddress || r.value?.street)), se = E(() => n.showSuggestionCount && b.value.length > 0 ? `${b.value.length} suggestions` : n.tertiaryLabel), j = E(() => {
255
+ switch (m.value) {
256
256
  case "verified":
257
257
  return "sl-text-green-600 dark:sl-text-green-400";
258
258
  case "error":
@@ -262,8 +262,8 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
262
262
  default:
263
263
  return "sl-text-gray-500 dark:sl-text-slate-400";
264
264
  }
265
- }), le = T(() => {
266
- switch (f.value) {
265
+ }), le = E(() => {
266
+ switch (m.value) {
267
267
  case "verified":
268
268
  return "Verified";
269
269
  case "error":
@@ -273,79 +273,79 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
273
273
  default:
274
274
  return "Unverified";
275
275
  }
276
- }), ae = T(() => {
277
- switch (f.value) {
276
+ }), ae = E(() => {
277
+ switch (m.value) {
278
278
  case "verified":
279
- return $e;
279
+ return Me;
280
280
  case "error":
281
- return Ue;
281
+ return Te;
282
282
  case "pending":
283
- return W;
283
+ return Q;
284
284
  default:
285
- return W;
285
+ return Q;
286
286
  }
287
- }), oe = Q(async (l) => {
287
+ }), oe = X(async (l) => {
288
288
  if (!l || l.length < 3) {
289
289
  b.value = [];
290
290
  return;
291
291
  }
292
- D.value = !0;
292
+ B.value = !0;
293
293
  try {
294
294
  const t = await Ze(l);
295
295
  b.value = t;
296
296
  } catch (t) {
297
297
  console.error("[AddressInput] Error fetching suggestions:", t), b.value = [];
298
298
  } finally {
299
- D.value = !1;
299
+ B.value = !1;
300
300
  }
301
301
  }, 300);
302
302
  function re(l) {
303
303
  const t = l.target;
304
- B.value = t.value, oe(t.value);
304
+ g.value = t.value, oe(t.value);
305
305
  }
306
306
  function ne(l) {
307
- return l ? l.description : n.value?.formattedAddress ? n.value.formattedAddress : "";
307
+ return l ? l.description : r.value?.formattedAddress ? r.value.formattedAddress : "";
308
308
  }
309
309
  async function ie(l) {
310
310
  if (l) {
311
- f.value = "pending", b.value = [];
311
+ m.value = "pending", b.value = [];
312
312
  try {
313
- const t = await Ve(l.placeId);
313
+ const t = await Be(l.placeId);
314
314
  if (t.status === "OK") {
315
- f.value = "verified";
316
- const a = He(t);
317
- s.street = a.street, s.city = a.city, s.state = a.state, s.zipcode = a.zipcode, s.country = a.country;
318
- const x = {
315
+ m.value = "verified";
316
+ const o = He(t);
317
+ s.street = o.street, s.city = o.city, s.state = o.state, s.zipcode = o.zipcode, s.country = o.country;
318
+ const w = {
319
319
  formattedAddress: t.formatted_address,
320
- street: a.street,
320
+ street: o.street,
321
321
  suite: s.suite,
322
- city: a.city,
323
- state: a.state,
324
- zipcode: a.zipcode,
325
- country: a.country,
322
+ city: o.city,
323
+ state: o.state,
324
+ zipcode: o.zipcode,
325
+ country: o.country,
326
326
  geocode: t,
327
327
  placeId: l.placeId
328
328
  };
329
- n.value = x, O(x), r("update:modelValue", x), C.value = !0;
329
+ r.value = w, A(w), i("update:modelValue", w), u.value = !0;
330
330
  } else
331
- f.value = "error", console.warn("[AddressInput] Geocoding failed:", t.message);
331
+ m.value = "error", console.warn("[AddressInput] Geocoding failed:", t.message);
332
332
  } catch (t) {
333
- f.value = "error", console.error("[AddressInput] Geocoding error:", t);
333
+ m.value = "error", console.error("[AddressInput] Geocoding error:", t);
334
334
  }
335
335
  }
336
336
  }
337
- const de = ["street", "city", "state", "zipcode", "country"], ce = Q(async () => {
337
+ const de = ["street", "city", "state", "zipcode", "country"], ce = X(async () => {
338
338
  const l = We(s);
339
339
  if (!l || l.length < 10) {
340
- f.value = "unverified";
340
+ m.value = "unverified";
341
341
  return;
342
342
  }
343
- f.value = "pending";
343
+ m.value = "pending";
344
344
  try {
345
345
  const t = await je(l);
346
346
  if (t.status === "OK") {
347
- f.value = "verified";
348
- const a = {
347
+ m.value = "verified";
348
+ const o = {
349
349
  formattedAddress: t.formatted_address,
350
350
  street: s.street,
351
351
  suite: s.suite,
@@ -357,16 +357,16 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
357
357
  placeId: void 0
358
358
  // Clear placeId since we re-geocoded
359
359
  };
360
- n.value = a, O(a), r("update:modelValue", a);
360
+ r.value = o, A(o), i("update:modelValue", o);
361
361
  } else
362
- f.value = "unverified";
362
+ m.value = "unverified";
363
363
  } catch (t) {
364
- f.value = "error", console.error("[AddressInput] Re-geocoding error:", t);
364
+ m.value = "error", console.error("[AddressInput] Re-geocoding error:", t);
365
365
  }
366
366
  }, 600);
367
- function I(l) {
367
+ function _(l) {
368
368
  const t = {
369
- ...n.value,
369
+ ...r.value,
370
370
  street: s.street,
371
371
  suite: s.suite,
372
372
  city: s.city,
@@ -374,60 +374,60 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
374
374
  zipcode: s.zipcode,
375
375
  country: s.country
376
376
  };
377
- de.includes(l) && (f.value = "unverified", t.geocode = void 0, ce()), n.value = t, O(t), r("update:modelValue", t);
377
+ de.includes(l) && (m.value = "unverified", t.geocode = void 0, ce()), r.value = t, A(t), i("update:modelValue", t);
378
378
  }
379
379
  function ue(l) {
380
- r("focus", l);
380
+ i("focus", l);
381
381
  }
382
382
  function fe(l) {
383
- te(!0), r("blur", l);
383
+ P(!0), i("blur", l);
384
384
  }
385
385
  be(
386
- () => i.modelValue,
386
+ () => n.modelValue,
387
387
  (l) => {
388
- l && (l.geocode?.status === "OK" ? f.value = "verified" : l.geocode?.status === "ERROR" && (f.value = "error"), l !== n.value && (n.value = l, l.street !== void 0 && (s.street = l.street), l.suite !== void 0 && (s.suite = l.suite), l.city !== void 0 && (s.city = l.city), l.state !== void 0 && (s.state = l.state), l.zipcode !== void 0 && (s.zipcode = l.zipcode), l.country !== void 0 && (s.country = l.country)));
388
+ l && (l.geocode?.status === "OK" ? m.value = "verified" : l.geocode?.status === "ERROR" && (m.value = "error"), l !== r.value && (r.value = l, l.street !== void 0 && (s.street = l.street), l.suite !== void 0 && (s.suite = l.suite), l.city !== void 0 && (s.city = l.city), l.state !== void 0 && (s.state = l.state), l.zipcode !== void 0 && (s.zipcode = l.zipcode), l.country !== void 0 && (s.country = l.country)));
389
389
  },
390
390
  { immediate: !0, deep: !0 }
391
391
  );
392
392
  function ge() {
393
- n.value = void 0, P.value = null, B.value = "", b.value = [], C.value = !1, f.value = "unverified", s.street = "", s.suite = "", s.city = "", s.state = "", s.zipcode = "", s.country = "";
393
+ r.value = void 0, z.value = null, g.value = "", b.value = [], u.value = !1, m.value = "unverified", s.street = "", s.suite = "", s.city = "", s.state = "", s.zipcode = "", s.country = "";
394
394
  }
395
- return o({
395
+ return a({
396
396
  resetInput: ge,
397
- geocodeStatus: f,
398
- meta: E,
397
+ geocodeStatus: m,
398
+ meta: S,
399
399
  errorMessage: h
400
- }), (l, t) => (p(), A("div", Qe, [
401
- m(Oe, {
402
- id: g(d),
400
+ }), (l, t) => (x(), K("div", Qe, [
401
+ y(Ee, {
402
+ id: p(f),
403
403
  name: e.name,
404
404
  label: e.label,
405
405
  "tertiary-label": se.value,
406
- "error-message": g(h),
406
+ "error-message": p(h),
407
407
  "success-message": e.successMessage,
408
- "is-valid": g(E).valid,
409
- "is-touched": g(E).touched,
408
+ "is-valid": p(S).valid,
409
+ "is-touched": p(S).touched,
410
410
  disabled: e.disabled
411
411
  }, {
412
- default: k(() => [
413
- y("div", Xe, [
414
- m(g(we), {
415
- modelValue: P.value,
412
+ default: C(() => [
413
+ v("div", Xe, [
414
+ y(p(we), {
415
+ modelValue: z.value,
416
416
  "onUpdate:modelValue": [
417
- t[0] || (t[0] = (a) => P.value = a),
417
+ t[0] || (t[0] = (o) => z.value = o),
418
418
  ie
419
419
  ],
420
420
  disabled: e.disabled,
421
421
  nullable: ""
422
422
  }, {
423
- default: k(() => [
424
- y("div", Je, [
425
- m(g(Ce), {
426
- id: g(d),
423
+ default: C(() => [
424
+ v("div", Je, [
425
+ y(p(Ce), {
426
+ id: p(f),
427
427
  "display-value": ne,
428
428
  placeholder: e.placeholder || "Search for an address...",
429
429
  disabled: e.disabled,
430
- class: w([
430
+ class: I([
431
431
  "sl-block sl-w-full sl-rounded-lg sl-border sl-py-2.5 sl-pl-3 sl-pr-10 sl-text-sm focus:sl-outline-none",
432
432
  e.disabled ? "sl-border-gray-200 dark:sl-border-slate-700 sl-bg-gray-50 dark:sl-bg-slate-800 sl-text-gray-500 dark:sl-text-slate-400 sl-cursor-not-allowed" : "sl-border-gray-300 dark:sl-border-slate-600 sl-bg-white dark:sl-bg-slate-900 sl-text-gray-900 dark:sl-text-slate-100 placeholder:sl-text-gray-400 dark:placeholder:sl-text-slate-500 focus:sl-border-stachelock-500 focus:sl-ring-2 focus:sl-ring-stachelock-500"
433
433
  ]),
@@ -435,13 +435,13 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
435
435
  onFocus: ue,
436
436
  onBlur: fe
437
437
  }, null, 8, ["id", "placeholder", "disabled", "class"]),
438
- m(g(Ie), { class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-2" }, {
439
- default: k(() => [
440
- e.disabled ? (p(), U(g(ze), {
438
+ y(p(Ie), { class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-2" }, {
439
+ default: C(() => [
440
+ e.disabled ? (x(), O(p(ze), {
441
441
  key: 0,
442
442
  class: "sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-slate-500",
443
443
  "aria-hidden": "true"
444
- })) : (p(), U(g(Ke), {
444
+ })) : (x(), O(p(_e), {
445
445
  key: 1,
446
446
  class: "sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-slate-400",
447
447
  "aria-hidden": "true"
@@ -449,56 +449,56 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
449
449
  ]),
450
450
  _: 1
451
451
  }),
452
- m(g(H), {
452
+ y(p(W), {
453
453
  leave: "sl-transition sl-ease-in sl-duration-100",
454
454
  "leave-from": "sl-opacity-100",
455
455
  "leave-to": "sl-opacity-0"
456
456
  }, {
457
- default: k(() => [
458
- b.value.length > 0 ? (p(), U(g(Se), {
457
+ default: C(() => [
458
+ b.value.length > 0 ? (x(), O(p(Se), {
459
459
  key: 0,
460
460
  class: "sl-absolute sl-z-50 sl-mt-1 sl-max-h-60 sl-w-full sl-overflow-auto sl-rounded-md sl-bg-white dark:sl-bg-slate-800 sl-py-1 sl-text-base sl-shadow-lg dark:sl-shadow-slate-900/50 sl-ring-1 sl-ring-black sl-ring-opacity-5 dark:sl-ring-slate-700 focus:sl-outline-none sm:sl-text-sm"
461
461
  }, {
462
- default: k(() => [
463
- (p(!0), A(he, null, xe(b.value, (a) => (p(), U(g(Ae), {
464
- key: a.placeId,
465
- value: a,
462
+ default: C(() => [
463
+ (x(!0), K(he, null, xe(b.value, (o) => (x(), O(p(Ae), {
464
+ key: o.placeId,
465
+ value: o,
466
466
  as: "template"
467
467
  }, {
468
- default: k(({ active: x, selected: j }) => [
469
- y("li", {
470
- class: w([
468
+ default: C(({ active: w, selected: Z }) => [
469
+ v("li", {
470
+ class: I([
471
471
  "sl-relative sl-cursor-pointer sl-select-none sl-py-2 sl-pl-10 sl-pr-4",
472
- x ? "sl-bg-stachelock-600 sl-text-white" : "sl-text-gray-900 dark:sl-text-slate-200"
472
+ w ? "sl-bg-stachelock-600 sl-text-white" : "sl-text-gray-900 dark:sl-text-slate-200"
473
473
  ])
474
474
  }, [
475
- y("div", Ye, [
476
- y("span", {
477
- class: w(["sl-block sl-truncate", j ? "sl-font-medium" : "sl-font-normal"])
478
- }, R(a.mainText), 3),
479
- y("span", {
480
- class: w(["sl-text-xs", x ? "sl-text-stachelock-100" : "sl-text-gray-500 dark:sl-text-slate-400"])
481
- }, R(a.secondaryText), 3)
475
+ v("div", Ye, [
476
+ v("span", {
477
+ class: I(["sl-block sl-truncate", Z ? "sl-font-medium" : "sl-font-normal"])
478
+ }, N(o.mainText), 3),
479
+ v("span", {
480
+ class: I(["sl-text-xs", w ? "sl-text-stachelock-100" : "sl-text-gray-500 dark:sl-text-slate-400"])
481
+ }, N(o.secondaryText), 3)
482
482
  ]),
483
- j ? (p(), A("span", {
483
+ Z ? (x(), K("span", {
484
484
  key: 0,
485
- class: w([
485
+ class: I([
486
486
  "sl-absolute sl-inset-y-0 sl-left-0 sl-flex sl-items-center sl-pl-3",
487
- x ? "sl-text-white" : "sl-text-stachelock-600 dark:sl-text-stachelock-400"
487
+ w ? "sl-text-white" : "sl-text-stachelock-600 dark:sl-text-stachelock-400"
488
488
  ])
489
489
  }, [
490
- m(g(Ge), {
490
+ y(p($e), {
491
491
  class: "sl-h-5 sl-w-5",
492
492
  "aria-hidden": "true"
493
493
  })
494
- ], 2)) : L("", !0)
494
+ ], 2)) : R("", !0)
495
495
  ], 2)
496
496
  ]),
497
497
  _: 2
498
498
  }, 1032, ["value"]))), 128))
499
499
  ]),
500
500
  _: 1
501
- })) : L("", !0)
501
+ })) : R("", !0)
502
502
  ]),
503
503
  _: 1
504
504
  })
@@ -506,35 +506,35 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
506
506
  ]),
507
507
  _: 1
508
508
  }, 8, ["modelValue", "disabled"]),
509
- V.value && !e.disabled ? (p(), A("div", qe, [
510
- y("div", et, [
511
- y("span", {
512
- class: w(["sl-text-xs sl-uppercase sl-font-medium", _.value])
513
- }, R(le.value), 3),
514
- (p(), U(ke(ae.value), {
515
- class: w(["sl-h-4 sl-w-4", _.value])
509
+ V.value && !e.disabled ? (x(), K("div", qe, [
510
+ v("div", et, [
511
+ v("span", {
512
+ class: I(["sl-text-xs sl-uppercase sl-font-medium", j.value])
513
+ }, N(le.value), 3),
514
+ (x(), O(ke(ae.value), {
515
+ class: I(["sl-h-4 sl-w-4", j.value])
516
516
  }, null, 8, ["class"]))
517
517
  ]),
518
- C.value ? (p(), A("button", {
518
+ u.value ? (x(), K("button", {
519
519
  key: 1,
520
520
  type: "button",
521
- onClick: t[2] || (t[2] = (a) => C.value = !1),
521
+ onClick: t[2] || (t[2] = (o) => u.value = !1),
522
522
  class: "sl-text-xs sl-text-gray-500 dark:sl-text-slate-400 hover:sl-underline sl-flex sl-items-center sl-gap-1"
523
523
  }, [
524
- t[10] || (t[10] = Z(" Collapse ", -1)),
525
- m(g(Te), { class: "sl-h-3 sl-w-3" })
526
- ])) : (p(), A("button", {
524
+ t[10] || (t[10] = H(" Collapse ", -1)),
525
+ y(p(Ge), { class: "sl-h-3 sl-w-3" })
526
+ ])) : (x(), K("button", {
527
527
  key: 0,
528
528
  type: "button",
529
- onClick: t[1] || (t[1] = (a) => C.value = !0),
529
+ onClick: t[1] || (t[1] = (o) => u.value = !0),
530
530
  class: "sl-text-xs sl-text-stachelock-600 dark:sl-text-stachelock-400 hover:sl-underline sl-flex sl-items-center sl-gap-1"
531
531
  }, [
532
- t[9] || (t[9] = Z(" Edit address ", -1)),
533
- m(g(Me), { class: "sl-h-3 sl-w-3" })
532
+ t[9] || (t[9] = H(" Edit address ", -1)),
533
+ y(p(Ke), { class: "sl-h-3 sl-w-3" })
534
534
  ]))
535
- ])) : L("", !0),
536
- m(g(H), {
537
- show: C.value && V.value && !e.disabled,
535
+ ])) : R("", !0),
536
+ y(p(W), {
537
+ show: u.value && V.value && !e.disabled,
538
538
  enter: "sl-transition sl-ease-out sl-duration-200",
539
539
  "enter-from": "sl-opacity-0 sl-transform sl--translate-y-2",
540
540
  "enter-to": "sl-opacity-100 sl-transform sl-translate-y-0",
@@ -542,23 +542,23 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
542
542
  "leave-from": "sl-opacity-100 sl-transform sl-translate-y-0",
543
543
  "leave-to": "sl-opacity-0 sl-transform sl--translate-y-2"
544
544
  }, {
545
- default: k(() => [
546
- y("div", tt, [
547
- y("div", st, [
548
- m(z, {
545
+ default: C(() => [
546
+ v("div", tt, [
547
+ v("div", st, [
548
+ y(G, {
549
549
  name: `${e.name}_street`,
550
550
  label: "Street Address",
551
551
  value: s.street,
552
552
  disabled: e.disabled,
553
553
  "show-valid-check": !1,
554
554
  "colorful-validation": !1,
555
- "onUpdate:value": t[3] || (t[3] = (a) => {
556
- s.street = a, I("street");
555
+ "onUpdate:value": t[3] || (t[3] = (o) => {
556
+ s.street = o, _("street");
557
557
  })
558
558
  }, null, 8, ["name", "value", "disabled"])
559
559
  ]),
560
- y("div", null, [
561
- m(z, {
560
+ v("div", null, [
561
+ y(G, {
562
562
  name: `${e.name}_suite`,
563
563
  label: "Suite / Apt",
564
564
  value: s.suite,
@@ -566,60 +566,60 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
566
566
  placeholder: "Optional",
567
567
  "show-valid-check": !1,
568
568
  "colorful-validation": !1,
569
- "onUpdate:value": t[4] || (t[4] = (a) => {
570
- s.suite = a, I("suite");
569
+ "onUpdate:value": t[4] || (t[4] = (o) => {
570
+ s.suite = o, _("suite");
571
571
  })
572
572
  }, null, 8, ["name", "value", "disabled"])
573
573
  ]),
574
- y("div", null, [
575
- m(z, {
574
+ v("div", null, [
575
+ y(G, {
576
576
  name: `${e.name}_city`,
577
577
  label: "City",
578
578
  value: s.city,
579
579
  disabled: e.disabled,
580
580
  "show-valid-check": !1,
581
581
  "colorful-validation": !1,
582
- "onUpdate:value": t[5] || (t[5] = (a) => {
583
- s.city = a, I("city");
582
+ "onUpdate:value": t[5] || (t[5] = (o) => {
583
+ s.city = o, _("city");
584
584
  })
585
585
  }, null, 8, ["name", "value", "disabled"])
586
586
  ]),
587
- y("div", null, [
588
- m(z, {
587
+ v("div", null, [
588
+ y(G, {
589
589
  name: `${e.name}_state`,
590
590
  label: "State",
591
591
  value: s.state,
592
592
  disabled: e.disabled,
593
593
  "show-valid-check": !1,
594
594
  "colorful-validation": !1,
595
- "onUpdate:value": t[6] || (t[6] = (a) => {
596
- s.state = a, I("state");
595
+ "onUpdate:value": t[6] || (t[6] = (o) => {
596
+ s.state = o, _("state");
597
597
  })
598
598
  }, null, 8, ["name", "value", "disabled"])
599
599
  ]),
600
- y("div", null, [
601
- m(z, {
600
+ v("div", null, [
601
+ y(G, {
602
602
  name: `${e.name}_zipcode`,
603
603
  label: "ZIP Code",
604
604
  value: s.zipcode,
605
605
  disabled: e.disabled,
606
606
  "show-valid-check": !1,
607
607
  "colorful-validation": !1,
608
- "onUpdate:value": t[7] || (t[7] = (a) => {
609
- s.zipcode = a, I("zipcode");
608
+ "onUpdate:value": t[7] || (t[7] = (o) => {
609
+ s.zipcode = o, _("zipcode");
610
610
  })
611
611
  }, null, 8, ["name", "value", "disabled"])
612
612
  ]),
613
- y("div", null, [
614
- m(z, {
613
+ v("div", null, [
614
+ y(G, {
615
615
  name: `${e.name}_country`,
616
616
  label: "Country",
617
617
  value: s.country,
618
618
  disabled: e.disabled,
619
619
  "show-valid-check": !1,
620
620
  "colorful-validation": !1,
621
- "onUpdate:value": t[8] || (t[8] = (a) => {
622
- s.country = a, I("country");
621
+ "onUpdate:value": t[8] || (t[8] = (o) => {
622
+ s.country = o, _("country");
623
623
  })
624
624
  }, null, 8, ["name", "value", "disabled"])
625
625
  ])
@@ -633,7 +633,7 @@ const Qe = { class: "sl-address-input" }, Xe = { class: "sl-space-y-3" }, Je = {
633
633
  }, 8, ["id", "name", "label", "tertiary-label", "error-message", "success-message", "is-valid", "is-touched", "disabled"])
634
634
  ]));
635
635
  }
636
- }), yt = /* @__PURE__ */ Re(lt, [["__scopeId", "data-v-d65320d7"]]);
636
+ }), pt = /* @__PURE__ */ Le(lt, [["__scopeId", "data-v-d65320d7"]]);
637
637
  export {
638
- yt as default
638
+ pt as default
639
639
  };
package/dist/src/services/geocoding.service.d.ts CHANGED
@@ -48,6 +48,7 @@ export declare function fetchPlaceSuggestions(query: string, options?: {
48
48
  }): Promise<PlaceSuggestion[]>;
49
49
  /**
50
50
  * Extract individual address fields from geocode result
51
+ * Handles various address formats from different countries and address types
51
52
  */
52
53
  export declare function extractAddressFields(geocodeResult: GeocodeResult | null): {
53
54
  street: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stachelock/ui",
3
- "version": "0.6.4",
3
+ "version": "0.6.5",
4
4
  "description": "A comprehensive Vue 3 UI component library built with Tailwind CSS",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",