From b19e0febfd40f32fe93b485a56a830129addb977 Mon Sep 17 00:00:00 2001
From: Jessica McInchak <jessica.mcinchak@gmail.com>
Date: Tue, 22 Mar 2022 18:40:59 +0100
Subject: [PATCH] support default value, plus better sorting

---
 index.html                                   | 5 ++++-
 src/components/address-autocomplete/index.ts | 7 ++++++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 180458f9..2ac94e59 100644
--- a/index.html
+++ b/index.html
@@ -25,10 +25,13 @@ <h1 style="color:red;font-family:Inter,Helvetica,sans-serif;font-size:16px;">***
       <div style="margin-bottom:1em;">
         <!-- 
           Examples (as of March 2022):
-          SE5 OHU (Southwark): default/"normal" postcode example, fetches 65 LPI addresses
+          SE5 OHU (Southwark): default/"standard" postcode example, fetches 65 LPI addresses
           SE19 1NT (Lambeth): 56 DPA addresses -> 128 LPI addresses (87 "approved"), now requires paginated fetch
           HP11 1BR (Bucks): 0 addresses, shows "No addresses found in postcode" error message
           HP11 1BC (Bucks): valid postcode according to npm package but not OS, shows OS error message
+
+          Example with default value (used for planx "change" & "back" button behavior):
+          <address-autocomplete postcode="SE5 0HU" id="example-autocomplete" initialAddress="75, COBOURG ROAD, LONDON" />
         -->
         <address-autocomplete postcode="SE5 0HU" id="example-autocomplete" />
       </div>
diff --git a/src/components/address-autocomplete/index.ts b/src/components/address-autocomplete/index.ts
index 0b5eab62..408f244b 100644
--- a/src/components/address-autocomplete/index.ts
+++ b/src/components/address-autocomplete/index.ts
@@ -24,6 +24,9 @@ export class AddressAutocomplete extends LitElement {
   @property({ type: String })
   label = "Select an address";
 
+  @property({ type: String })
+  initialAddress = "";
+
   @property({ type: String })
   osPlacesApiKey = import.meta.env.VITE_APP_OS_PLACES_API_KEY || "";
 
@@ -62,6 +65,7 @@ export class AddressAutocomplete extends LitElement {
       id: this.id,
       required: true,
       source: this._options,
+      defaultValue: this.initialAddress,
       showAllValues: true,
       tNoResults: () => "No addresses found",
       onConfirm: (option: any) => {
@@ -124,7 +128,8 @@ export class AddressAutocomplete extends LitElement {
               );
             });
 
-          this._options.sort((a, b) => a.localeCompare(b));
+          const collator = new Intl.Collator([], { numeric: true });
+          this._options.sort((a, b) => collator.compare(a, b));
         }
 
         // fetch next page of results if they exist