[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/hu.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Szállítási cím:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Adjon megy egy helyet",
  "store/shipping-option-zipcode.storeButton.label": "Üzlet:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Válasszon egy üzletet",
  "store/shipping-option-zipcode.deliverDrawer.title": "Elérhetőség megtekintése a régiójában",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Üzletek megtekintése a régiójában",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Válasszon egy üzletet",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Adja meg az irányítószámát",
  "store/shipping-option-zipcode.postalCodeInput.error": "A megadott irányítószám nem tartozik a lefedettségi területünkhöz",
  "store/shipping-option-zipcode.currentLocationButton": "Aktuális tartózkodási hely használata",
  "store/shipping-option-zipcode.storeHoursButton": "Nyitvatartási idő megtekintése",
  "store/shipping-option-zipcode.viewMoreButton": "Több megtekintése",
  "store/shipping-option-zipcode.shippinFilter.title": "Szállítási lehetőségek",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Szállítási cím",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Adjon meg egy helyet",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Felvétel helye",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Válasszon egy üzletet",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Felvétel a közelben",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Felvétel",
  "store/shipping-option-zipcode.updateButton.label": "Frissítés",
  "store/shipping-option-zipcode.popoverButton.label": "Válasszon egy helyet",
  "store/shipping-option-zipcode.popover.description": "A szállítás sebessége és a szállítási lehetőségek a szállítási cím és az üzlet függvényében változhatnak"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/nl.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Verzenden naar:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Voer een locatie in",
  "store/shipping-option-zipcode.storeButton.label": "Winkel:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Kies een winkel",
  "store/shipping-option-zipcode.deliverDrawer.title": "Bekijk de beschikbaarheid van uw regio",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Bekijk winkels in uw regio",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Kies een winkel",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Voer uw postcode in",
  "store/shipping-option-zipcode.postalCodeInput.error": "De ingevoerde postcode valt niet binnen ons gebied",
  "store/shipping-option-zipcode.currentLocationButton": "Gebruik huidige locatie",
  "store/shipping-option-zipcode.storeHoursButton": "Winkeluren bekijken",
  "store/shipping-option-zipcode.viewMoreButton": "Meer weergeven",
  "store/shipping-option-zipcode.shippinFilter.title": "Verzendopties",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Verzenden naar",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Voer een locatie in",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Afhalen op",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Bezoek een winkel",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Afhalen in de buurt van",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Afhalen",
  "store/shipping-option-zipcode.popoverButton.label": "Selecteer een locatie",
  "store/shipping-option-zipcode.popover.description": "Verzendopties en -snelheid kunnen variëren op basis van afleveradres en winkel"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/ja.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "配送先:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "場所を入力してください",
  "store/shipping-option-zipcode.storeButton.label": "店舗:",
  "store/shipping-option-zipcode.storeButton.placeholder": "店舗を選択",
  "store/shipping-option-zipcode.deliverDrawer.title": "お住まいの地域から探す",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "お住まいの地域の店舗を見る",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "店舗を選択",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "郵便番号を入力してください",
  "store/shipping-option-zipcode.postalCodeInput.error": "入力された郵便番号は、当社のサービス提供地域外です。",
  "store/shipping-option-zipcode.currentLocationButton": "現在地を使用",
  "store/shipping-option-zipcode.storeHoursButton": "営業時間を見る",
  "store/shipping-option-zipcode.viewMoreButton": "もっと見る",
  "store/shipping-option-zipcode.shippinFilter.title": "発送オプション",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "配送先",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "場所を入力してください",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "ピックアップ場所",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "店舗を選択",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "お近くのピックアップ場所",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "ピックアップ",
  "store/shipping-option-zipcode.popoverButton.label": "場所を選択",
  "store/shipping-option-zipcode.popover.description": "発送オプションと所要日数は、配送先住所や店舗によって異なる場合があります"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/de.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Versand an:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Standort eingeben",
  "store/shipping-option-zipcode.storeButton.label": "Shop:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Shop auswählen",
  "store/shipping-option-zipcode.deliverDrawer.title": "Verfügbarkeit für Ihre Region anzeigen",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Shops in Ihrer Region anzeigen",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Shop auswählen",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Geben Sie Ihre Postleitzahl ein",
  "store/shipping-option-zipcode.postalCodeInput.error": "Die eingegebene Postleitzahl ist nicht in unserem Abdeckungsbereich",
  "store/shipping-option-zipcode.currentLocationButton": "Aktuellen Standort verwenden",
  "store/shipping-option-zipcode.storeHoursButton": "Ladenöffnungszeiten anzeigen",
  "store/shipping-option-zipcode.viewMoreButton": "Mehr ansehen",
  "store/shipping-option-zipcode.shippinFilter.title": "Versandoptionen",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Versand nach",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Einen Standort eingeben",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Abholung bei",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Shop auswählen",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Abholung in der Nähe",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Abholung",
  "store/shipping-option-zipcode.popoverButton.label": "Wähle einen Ort",
  "store/shipping-option-zipcode.popover.description": "Versandoptionen und Versandgeschwindigkeit können je nach Lieferadresse und Lager variieren",
  "store/shipping-option-zipcode.LocationDetectorButton.title": "Meinen aktuellen Standort verwenden",
  "store/shipping-option-zipcode.LocationDetectorButtonLoading.description": "Standort wird konfiguriert..."
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/ru.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Доставить по адресу:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Введите местоположение",
  "store/shipping-option-zipcode.storeButton.label": "Магазин:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Выберите магазин",
  "store/shipping-option-zipcode.deliverDrawer.title": "Показать наличие в вашем регионе",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Показать магазины в вашем регионе",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Выберите магазин",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Введите почтовый индекс",
  "store/shipping-option-zipcode.postalCodeInput.error": "Введенный почтовый индекс находится вне нашей зоны обслуживания",
  "store/shipping-option-zipcode.currentLocationButton": "Использовать текущее местоположение",
  "store/shipping-option-zipcode.storeHoursButton": "Показать график работы магазина",
  "store/shipping-option-zipcode.viewMoreButton": "Показать больше",
  "store/shipping-option-zipcode.shippinFilter.title": "Варианты доставки",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Доставить по адресу",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Введите местоположение",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Самовывоз",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Выберите магазин",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Забрать поблизости",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Забрать",
  "store/shipping-option-zipcode.updateButton.label": "Обновить",
  "store/shipping-option-zipcode.popoverButton.label": "Выбрать местоположение",
  "store/shipping-option-zipcode.popover.description": "Способы и сроки доставки могут отличаться в зависимости от адреса доставки и магазина"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/pl.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Wyślij do:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Wprowadź lokalizację",
  "store/shipping-option-zipcode.storeButton.label": "Sklep:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Wybierz sklep",
  "store/shipping-option-zipcode.deliverDrawer.title": "Wyświetl dostępność dla swojego regionu",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Wyświetl sklepy w swoim regionie",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Wybierz sklep",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Wprowadź swój kod pocztowy",
  "store/shipping-option-zipcode.postalCodeInput.error": "Wprowadzony kod pocztowy nie znajduje się w naszym zasięgu",
  "store/shipping-option-zipcode.currentLocationButton": "Użyj bieżącej lokalizacji",
  "store/shipping-option-zipcode.storeHoursButton": "Zobacz godziny otwarcia sklepu",
  "store/shipping-option-zipcode.viewMoreButton": "Zobacz więcej",
  "store/shipping-option-zipcode.shippinFilter.title": "Opcje wysyłki",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Wyślij do",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Wprowadź lokalizację",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Odbiór w",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Wybierz sklep",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Odbiór w pobliżu",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Odbiór",
  "store/shipping-option-zipcode.updateButton.label": "Aktualizuj",
  "store/shipping-option-zipcode.popoverButton.label": "Wybierz lokalizację",
  "store/shipping-option-zipcode.popover.description": "Opcje i szybkość wysyłki mogą się różnić w zależności od adresu dostawy i sklepu"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/uk.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Доставити за адресою:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Введіть адресу",
  "store/shipping-option-zipcode.storeButton.label": "Магазин:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Виберіть магазин",
  "store/shipping-option-zipcode.deliverDrawer.title": "Переглянути наявність у вашому регіоні",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Переглянути магазини у вашому регіоні",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Виберіть магазин",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Введіть поштовий індекс",
  "store/shipping-option-zipcode.postalCodeInput.error": "Введений поштовий індекс — поза нашою зоною обслуговування",
  "store/shipping-option-zipcode.currentLocationButton": "Використати поточне розташування",
  "store/shipping-option-zipcode.storeHoursButton": "Переглянути години роботи магазину",
  "store/shipping-option-zipcode.viewMoreButton": "Переглянути більше",
  "store/shipping-option-zipcode.shippinFilter.title": "Варіанти доставки",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Доставити за адресою",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Ввести адресу",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Місце самовивозу",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Виберіть магазин",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Самовивіз поблизу",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Самовивіз",
  "store/shipping-option-zipcode.updateButton.label": "Оновити",
  "store/shipping-option-zipcode.popoverButton.label": "Виберіть розташування",
  "store/shipping-option-zipcode.popover.description": "Способи та час доставки можуть відрізнятися залежно від адреси доставки та магазину"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/fi.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Toimitus osoitteeseen:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Lisää sijainti",
  "store/shipping-option-zipcode.storeButton.label": "Myymälä:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Valitse myymälä",
  "store/shipping-option-zipcode.deliverDrawer.title": "Näytä saatavuus alueellasi",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Näytä alueesi myymälät",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Valitse myymälä",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Anna postinumerosi",
  "store/shipping-option-zipcode.postalCodeInput.error": "Annettu postinumero ei kuulu kattavuusalueellemme",
  "store/shipping-option-zipcode.currentLocationButton": "Käytä nykyistä sijaintia",
  "store/shipping-option-zipcode.storeHoursButton": "Näytä myymälän aukioloajat",
  "store/shipping-option-zipcode.viewMoreButton": "Näytä lisää",
  "store/shipping-option-zipcode.shippinFilter.title": "Toimitustavat",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Toimitus osoitteeseen",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Lisää sijainti",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Nouto myymälästä",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Valitse myymälä",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Nouto läheltä",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Nouto",
  "store/shipping-option-zipcode.updateButton.label": "Päivitä",
  "store/shipping-option-zipcode.popoverButton.label": "Valitse sijainti",
  "store/shipping-option-zipcode.popover.description": "Toimitusvaihtoehdot ja -nopeus voivat vaihdella toimitusosoitteen ja myymälän mukaan"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/sk.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Doručiť na adresu:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Zadajte svoju adresu",
  "store/shipping-option-zipcode.storeButton.label": "Obchod:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Vyberte obchod",
  "store/shipping-option-zipcode.deliverDrawer.title": "Zobraziť dostupnosť pre váš región",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Zobraziť obchody vo vašom regióne",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Vyberte obchod",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Zadajte svoje poštové smerovacie číslo",
  "store/shipping-option-zipcode.postalCodeInput.error": "Zadané poštové smerovacie číslo nie je v našej oblasti pokrytia",
  "store/shipping-option-zipcode.currentLocationButton": "Použiť aktuálnu polohu",
  "store/shipping-option-zipcode.storeHoursButton": "Zobraziť otváracie hodiny obchodu",
  "store/shipping-option-zipcode.viewMoreButton": "Zobraziť viac",
  "store/shipping-option-zipcode.shippinFilter.title": "Spôsob dopravy",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Doručiť na adresu",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Zadajte svoju adresu",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Vyzdvihnúť na adrese",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Vybrať obchod",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Vyzdvihnúť v blízkosti",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Vyzdvihnúť",
  "store/shipping-option-zipcode.updateButton.label": "Aktualizovať",
  "store/shipping-option-zipcode.popoverButton.label": "Vyberte miesto",
  "store/shipping-option-zipcode.popover.description": "Možnosti a rýchlosť prepravy sa môžu líšiť v závislosti od obchodu a adresy doručenia"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/pt.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Enviar para:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Insira uma localização",
  "store/shipping-option-zipcode.storeButton.label": "Loja:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Escolha uma loja",
  "store/shipping-option-zipcode.deliverDrawer.title": "Veja a disponibilidade para sua região",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Veja as lojas em sua região",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Escolha uma loja",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Insira seu código postal",
  "store/shipping-option-zipcode.postalCodeInput.error": "O código postal inserido não está dentro da nossa área de cobertura",
  "store/shipping-option-zipcode.currentLocationButton": "Usar localização atual",
  "store/shipping-option-zipcode.storeHoursButton": "Ver horários da loja",
  "store/shipping-option-zipcode.viewMoreButton": "Ver mais",
  "store/shipping-option-zipcode.shippinFilter.title": "Opções de envio",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Enviar para",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Insira uma localização",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Retirar em",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Escolha uma loja",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Ponto de retirada mais próximo",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Retirada",
  "store/shipping-option-zipcode.updateButton.label": "Atualizar",
  "store/shipping-option-zipcode.popoverButton.label": "Selecione um local",
  "store/shipping-option-zipcode.popover.description": "As ofertas e opções de entrega variam de acordo com a região.",
  "store/shipping-option-zipcode.deliveryPopover.submitButton.label": "Continuar",
  "store/shipping-option-zipcode.deliveryPopover.postalCodeInput.placeholder": "Código postal",
  "store/shipping-option-zipcode.popover.postalCodeLink": "Não sei meu CEP",
  "store/shipping-option-zipcode.locationModal.title": "Insira uma localização",
  "store/shipping-option-zipcode.locationModal.description": "As ofertas e opções de entrega variam de acordo com a região.",
  "store/shipping-option-zipcode.locationModal.noPickupsState.title": "Loja indisponível na região",
  "store/shipping-option-zipcode.locationModal.noPickupsState.description": "Não há produtos disponíveis para o CEP {postalCode}",
  "store/shipping-option-zipcode.locationModal.noPickupsState.button.label": "Inserir outra localização",
  "store/shipping-option-zipcode.shippingSelectionModal.title": "Escolha um método de envio",
  "store/shipping-option-zipcode.shippingSelectionModal.description": "A disponibilidade dos produtos pode variar de acordo com o método.",
  "store/shipping-option-zipcode.shippingSelectionModal.deliveryButton.label": "Entrega",
  "store/shipping-option-zipcode.shippingSelectionModal.pickupButton.label": "Retirada",
  "store/shipping-option-zipcode.pickupSelection.title": "Escolha uma loja",
  "store/shipping-option-zipcode.pickupSelection.noStoresState.title": "Não há lojas disponíveis",
  "store/shipping-option-zipcode.pickupSelection.noStoresState.description": "Não há lojas que atendam o CEP {postalCode}",
  "store/shipping-option-zipcode.pickupSelection.noStoresState.button.label": "Continuar com entrega",
  "store/shipping-option-zipcode.unavailableItems.title": "Itens indisponíveis",
  "store/shipping-option-zipcode.unavailableItems.description": "Estes itens não podem ser entregues em {addressLabel} e não estão disponíveis em nenhum ponto de retirada",
  "store/shipping-option-zipcode.unavailableItems.forPickup.description": "Estes itens não estão disponíveis para retirada no ponto",
  "store/shipping-option-zipcode.unavailableItems.forDelivery.description": "Estes itens não podem ser entregues em {addressLabel}",
  "store/shipping-option-zipcode.unavailableItems.removeItemsButton.label": "Remover itens",
  "store/shipping-option-zipcode.unavailableItems.retryButton.label": "Inserir outro local",
  "store/shipping-option-zipcode.LocationDetectorButton.title": "Usar minha localização atual",
  "store/shipping-option-zipcode.LocationDetectorButtonLoading.description": "Configurando sua localização...",
  "store/shipping-option-zipcode.LocationDetectorButtonError.description": "Não foi possível detectar a localização"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/en.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Ship to:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Enter a location",
  "store/shipping-option-zipcode.storeButton.label": "Store:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Choose a store",
  "store/shipping-option-zipcode.deliverDrawer.title": "View availability for your region",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "View stores in your region",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Choose a store",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Enter your postal code",
  "store/shipping-option-zipcode.postalCodeInput.error": "The entered postal code is not within our coverage area",
  "store/shipping-option-zipcode.currentLocationButton": "Use Current Location",
  "store/shipping-option-zipcode.storeHoursButton": "View Store Hours",
  "store/shipping-option-zipcode.viewMoreButton": "View More",
  "store/shipping-option-zipcode.shippinFilter.title": "Shipping Options",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Ship to",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Enter a Location",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Pickup at",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Choose a Store",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Pickup nearby",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Pickup",
  "store/shipping-option-zipcode.updateButton.label": "Update",
  "store/shipping-option-zipcode.popoverButton.label": "Select a location",
  "store/shipping-option-zipcode.popover.description": "Offers and delivery options vary based on region.",
  "store/shipping-option-zipcode.deliveryPopover.submitButton.label": "Continue",
  "store/shipping-option-zipcode.deliveryPopover.postalCodeInput.placeholder": "Postal Code",
  "store/shipping-option-zipcode.popover.postalCodeLink": "I don't know my postal code",
  "store/shipping-option-zipcode.locationModal.title": "Enter a location",
  "store/shipping-option-zipcode.locationModal.description": "Offers and delivery options vary based on region.",
  "store/shipping-option-zipcode.locationModal.noPickupsState.title": "Store unavailable in region",
  "store/shipping-option-zipcode.locationModal.noPickupsState.description": "There are no products available for postal code",
  "store/shipping-option-zipcode.locationModal.noPickupsState.button.label": "Enter another location",
  "store/shipping-option-zipcode.shippingSelectionModal.title": "Choose a shipping method",
  "store/shipping-option-zipcode.shippingSelectionModal.description": "Product availability may vary per shipping option.",
  "store/shipping-option-zipcode.shippingSelectionModal.deliveryButton.label": "Delivery",
  "store/shipping-option-zipcode.shippingSelectionModal.pickupButton.label": "Pickup",
  "store/shipping-option-zipcode.pickupSelection.title": "Choose a store",
  "store/shipping-option-zipcode.pickupSelection.noStoresState.title": "No stores available",
  "store/shipping-option-zipcode.pickupSelection.noStoresState.description": "There are no stores available for the postal code {postalCode}",
  "store/shipping-option-zipcode.pickupSelection.noStoresState.button.label": "Continue with delivery",
  "store/shipping-option-zipcode.availabilityBadge.deliveryAvailable": "Delivery available",
  "store/shipping-option-zipcode.availabilityBadge.deliveryUnavailable": "Delivery unavailable",
  "store/shipping-option-zipcode.availabilityBadge.pickupUnavailable": "Pickup unavailable",
  "store/shipping-option-zipcode.availabilityBadge.pickupAt": "Pickup at",
  "store/shipping-option-zipcode.unavailableItems.title": "Items unavailable",
  "store/shipping-option-zipcode.unavailableItems.description": "These items can't be delivered to {addressLabel} and they are not available in any pickup point",
  "store/shipping-option-zipcode.unavailableItems.forPickup.description": "These items are not available for the pickup point",
  "store/shipping-option-zipcode.unavailableItems.forDelivery.description": "These items can't be delivered to {addressLabel}",
  "store/shipping-option-zipcode.unavailableItems.removeItemsButton.label": "Remove items",
  "store/shipping-option-zipcode.unavailableItems.retryButton.label": "Enter another location",
  "store/shipping-option-zipcode.LocationDetectorButton.title": "Use my current location",
  "store/shipping-option-zipcode.LocationDetectorButtonLoading.description": "Setting up your location...",
  "store/shipping-option-zipcode.LocationDetectorButtonError.description": "Unable to detect location"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/it.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Spedisci a:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Inserisci una posizione",
  "store/shipping-option-zipcode.storeButton.label": "Negozio:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Scegli un negozio",
  "store/shipping-option-zipcode.deliverDrawer.title": "Vedi la disponibilità per la tua regione",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Vedi i negozi nella tua regione",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Scegli un negozio",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Inserisci il tuo codice di avviamento postale",
  "store/shipping-option-zipcode.postalCodeInput.error": "Il codice di avviamento postale inserito non rientra nella nostra zona di copertura",
  "store/shipping-option-zipcode.currentLocationButton": "Usa posizione attuale",
  "store/shipping-option-zipcode.storeHoursButton": "Orari del negozio",
  "store/shipping-option-zipcode.viewMoreButton": "Mostra di più",
  "store/shipping-option-zipcode.shippinFilter.title": "Opzioni di spedizione",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Spedisci a",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Inserisci una posizione",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Ritiro presso",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Seleziona un negozio",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Ritiro nelle vicinanze",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Ritiro",
  "store/shipping-option-zipcode.popoverButton.label": "Seleziona una posizione",
  "store/shipping-option-zipcode.popover.description": "Le opzioni e la celerità della spedizione possono variare a seconda dell'indirizzo di consegna e del negozio",
  "store/shipping-option-zipcode.LocationDetectorButton.title": "Usa la mia posizione attuale",
  "store/shipping-option-zipcode.LocationDetectorButtonLoading.description": "Configurazione della tua posizione...",
  "store/shipping-option-zipcode.LocationDetectorButtonError.description": "Impossibile rilevare la posizione"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/fr.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Expédier vers :",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Entrez un lieu",
  "store/shipping-option-zipcode.storeButton.label": "Magasin :",
  "store/shipping-option-zipcode.storeButton.placeholder": "Choisissez un magasin",
  "store/shipping-option-zipcode.deliverDrawer.title": "Voir les disponibilités dans votre région",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Voir les magasins de votre région",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Choisissez un magasin",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Entrez votre code postal",
  "store/shipping-option-zipcode.postalCodeInput.error": "Le code postal saisi ne se trouve pas dans notre zone de couverture",
  "store/shipping-option-zipcode.currentLocationButton": "Utiliser la localisation actuelle",
  "store/shipping-option-zipcode.storeHoursButton": "Voir les heures d’ouverture du magasin",
  "store/shipping-option-zipcode.viewMoreButton": "Afficher plus",
  "store/shipping-option-zipcode.shippinFilter.title": "Options d'expédition",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Expédier vers",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Saisissez un lieu",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Retrait à",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Choisissez un Magasin",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Retrait à proximité",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Point de retrait",
  "store/shipping-option-zipcode.popoverButton.label": "Sélectionnez un emplacement",
  "store/shipping-option-zipcode.popover.description": "Les options de livraison et les délais peuvent varier en fonction de l'adresse de livraison et du magasin sélectionné",
  "store/shipping-option-zipcode.LocationDetectorButton.title": "Utiliser ma position actuelle",
  "store/shipping-option-zipcode.LocationDetectorButtonLoading.description": "Configuration de votre position...",
  "store/shipping-option-zipcode.LocationDetectorButtonError.description": "Impossible de détecter la position"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/el.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Αποστολή σε:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Εισαγάγετε τοποθεσία",
  "store/shipping-option-zipcode.storeButton.label": "Κατάστημα:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Επιλέξτε ένα κατάστημα",
  "store/shipping-option-zipcode.deliverDrawer.title": "Προβολή διαθεσιμότητας για την περιοχή σας",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Προβολή καταστημάτων στην περιοχή σας",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Επιλέξτε ένα κατάστημα",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Εισαγάγετε τον ταχυδρομικό σας κώδικα",
  "store/shipping-option-zipcode.postalCodeInput.error": "Ο ταχυδρομικός κώδικας που καταχωρήσατε δεν βρίσκεται εντός της περιοχής κάλυψής μας",
  "store/shipping-option-zipcode.currentLocationButton": "Χρήση τρέχουσας τοποθεσίας",
  "store/shipping-option-zipcode.storeHoursButton": "Προβολή ωρών λειτουργίας καταστήματος",
  "store/shipping-option-zipcode.viewMoreButton": "Προβολή περισσοτέρων",
  "store/shipping-option-zipcode.shippinFilter.title": "Δυνατότητες αποστολής",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Αποστολή σε",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Εισαγάγετε τοποθεσία",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Παραλαβή σε",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Επιλέξτε ένα κατάστημα",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Παραλαβή πλησίον",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Παραλαβή",
  "store/shipping-option-zipcode.updateButton.label": "Ενημέρωση",
  "store/shipping-option-zipcode.popoverButton.label": "Επιλέξτε μια τοποθεσία",
  "store/shipping-option-zipcode.popover.description": "Οι επιλογές αποστολής και η ταχύτητα μπορεί να διαφέρουν, ανάλογα με τη διεύθυνση παράδοσης και το κατάστημα"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/bg.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Изпращане до:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Въвеждане на местоположение",
  "store/shipping-option-zipcode.storeButton.label": "Магазин:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Избиране на магазин",
  "store/shipping-option-zipcode.deliverDrawer.title": "Преглед на наличностите във вашия регион",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Преглед на магазините във вашия регион",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Избиране на магазин",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Въвеждане на пощенския ви код",
  "store/shipping-option-zipcode.postalCodeInput.error": "Въведеният пощенски код не е в района на нашето покритие",
  "store/shipping-option-zipcode.currentLocationButton": "Използване на настоящото местоположение",
  "store/shipping-option-zipcode.storeHoursButton": "Преглед на работното време на магазина",
  "store/shipping-option-zipcode.viewMoreButton": "Преглед на повече",
  "store/shipping-option-zipcode.shippinFilter.title": "Опции за доставка",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Изпращане до",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Въвеждане на местоположение",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Вземане от",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Избор на магазин",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Вземане наблизо",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Вземане",
  "store/shipping-option-zipcode.popoverButton.label": "Избиране на местоположение",
  "store/shipping-option-zipcode.popover.description": "Опциите и скоростта на доставката могат да варират в зависимост от адреса за доставка и магазина"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/ro.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Expediază la:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Introdu o locație",
  "store/shipping-option-zipcode.storeButton.label": "Magazin:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Alege un magazin",
  "store/shipping-option-zipcode.deliverDrawer.title": "Vezi disponibilitatea în regiunea ta",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Vezi magazinele din regiunea ta",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Alege un magazin",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Introdu codul poștal",
  "store/shipping-option-zipcode.postalCodeInput.error": "Codul poștal introdus nu se află în zona noastră de acoperire",
  "store/shipping-option-zipcode.currentLocationButton": "Folosește locația actuală",
  "store/shipping-option-zipcode.storeHoursButton": "Vezi programul magazinului",
  "store/shipping-option-zipcode.viewMoreButton": "Vezi mai mult",
  "store/shipping-option-zipcode.shippinFilter.title": "Opțiuni de expediere",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Expediază la",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Introdu o locație",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Ridicare la",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Alege un magazin",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Ridicare în apropiere",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Ridicare",
  "store/shipping-option-zipcode.popoverButton.label": "Selectează o locație",
  "store/shipping-option-zipcode.popover.description": "Opțiunile și viteza de expediere pot varia în funcție de adresa de livrare și de magazin"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/ca.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Envia a:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Introdueix una ubicació",
  "store/shipping-option-zipcode.storeButton.label": "Botiga:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Tria una botiga",
  "store/shipping-option-zipcode.deliverDrawer.title": "Mostrar la disponibilitat a la vostra regió",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Mostrar les botigues a la vostra regió",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Tria una botiga",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Introduïu el vostre codi postal",
  "store/shipping-option-zipcode.postalCodeInput.error": "El codi postal introduït no forma part de la nostra zona de cobertura",
  "store/shipping-option-zipcode.currentLocationButton": "Fes servir la ubicació actual",
  "store/shipping-option-zipcode.storeHoursButton": "Mostra l'horari de la botiga",
  "store/shipping-option-zipcode.viewMoreButton": "Mostra'n més",
  "store/shipping-option-zipcode.shippinFilter.title": "Opcions d'enviament",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Envia a",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Introdueix una ubicació",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Recollida a",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Tria una botiga",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Recollida a prop",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Recollida",
  "store/shipping-option-zipcode.updateButton.label": "Actualitza",
  "store/shipping-option-zipcode.popoverButton.label": "Seleccioneu una ubicació",
  "store/shipping-option-zipcode.popover.description": "Les opcions i la velocitat d'enviament poden variar segons l'adreça de lliurament i de la botiga"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/ko.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "배송지:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "위치 입력",
  "store/shipping-option-zipcode.storeButton.label": "스토어:",
  "store/shipping-option-zipcode.storeButton.placeholder": "스토어 선택",
  "store/shipping-option-zipcode.deliverDrawer.title": "해당 지역의 가용성 보기",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "해당 지역의 스토어 보기",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "스토어 선택",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "우편번호 입력",
  "store/shipping-option-zipcode.postalCodeInput.error": "입력한 우편번호가 당사의 서비스 지역 내에 있지 않습니다",
  "store/shipping-option-zipcode.currentLocationButton": "현재 위치 사용",
  "store/shipping-option-zipcode.storeHoursButton": "매장 시간 보기",
  "store/shipping-option-zipcode.viewMoreButton": "더 보기",
  "store/shipping-option-zipcode.shippinFilter.title": "배송 옵션",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "배송지",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "위치 입력",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "픽업 장소",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "스토어 선택",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "근처 픽업",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "픽업",
  "store/shipping-option-zipcode.popoverButton.label": "위치 선택",
  "store/shipping-option-zipcode.popover.description": "배송 옵션 및 속도는 배송 주소 및 스토어에 따라 다를 수 있습니다"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/cs.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Dodat na adresu:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Zadejte polohu",
  "store/shipping-option-zipcode.storeButton.label": "Obchod:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Vyberte obchod",
  "store/shipping-option-zipcode.deliverDrawer.title": "Zobrazte dostupnost pro svůj region",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Prohlédněte si obchody ve svém regionu",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Vyberte si obchod",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Zadejte své poštovní směrovací číslo",
  "store/shipping-option-zipcode.postalCodeInput.error": "Zadané poštovní směrovací číslo se nenachází v naší oblasti pokrytí",
  "store/shipping-option-zipcode.currentLocationButton": "Použít aktuální polohu",
  "store/shipping-option-zipcode.storeHoursButton": "Zobrazit otevírací dobu obchodu",
  "store/shipping-option-zipcode.viewMoreButton": "Zobrazit více",
  "store/shipping-option-zipcode.shippinFilter.title": "Možnosti dopravy",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Dodat na adresu",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Zadejte polohu",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Vyzvednutí v",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Vyberte si obchod",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Vyzvednutí v okolí",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Vyzvednutí",
  "store/shipping-option-zipcode.updateButton.label": "Aktualizovat",
  "store/shipping-option-zipcode.popoverButton.label": "Výběr místa",
  "store/shipping-option-zipcode.popover.description": "Možnosti dopravy a její rychlost se mohou lišit v závislosti na obchodu a adrese doručení"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/id.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Dikirimkan ke:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Masukkan lokasi",
  "store/shipping-option-zipcode.storeButton.label": "Toko:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Pilih toko",
  "store/shipping-option-zipcode.deliverDrawer.title": "Lihat ketersediaan untuk wilayah Anda",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Lihat toko di wilayah Anda",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Pilih toko",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Masukkan kode pos Anda",
  "store/shipping-option-zipcode.postalCodeInput.error": "Kode pos yang dimasukkan tidak masuk area jangkauan kami",
  "store/shipping-option-zipcode.currentLocationButton": "Gunakan Lokasi Saat Ini",
  "store/shipping-option-zipcode.storeHoursButton": "Lihat Jam Toko",
  "store/shipping-option-zipcode.viewMoreButton": "Lihat Selengkapnya",
  "store/shipping-option-zipcode.shippinFilter.title": "Opsi Pengiriman",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Kirimkan ke",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Masukkan Lokasi",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Ambil di",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Pilih Toko",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Ambil terdekat",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Ambil",
  "store/shipping-option-zipcode.updateButton.label": "Perbarui",
  "store/shipping-option-zipcode.popoverButton.label": "Pilih lokasi",
  "store/shipping-option-zipcode.popover.description": "Opsi pengiriman dan kecepatan dapat bervariasi sesuai alamat pengiriman dan toko"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/no.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Lever på adressen til:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Oppgi en plassering",
  "store/shipping-option-zipcode.storeButton.label": "Butikk:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Velg en butikk",
  "store/shipping-option-zipcode.deliverDrawer.title": "Vis tilgjengelighet for din region",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Se butikker i din region",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Velg en butikk",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Skriv inn postkode",
  "store/shipping-option-zipcode.postalCodeInput.error": "Postnummeret du skrev inn er ikke innenfor vårt dekningsområde",
  "store/shipping-option-zipcode.currentLocationButton": "Bruk gjeldende posisjon",
  "store/shipping-option-zipcode.storeHoursButton": "Vis butikktimer",
  "store/shipping-option-zipcode.viewMoreButton": "Vis mere",
  "store/shipping-option-zipcode.shippinFilter.title": "Fraktalternativer",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Send til",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Oppgi en plassering",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Hent hos",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Velg en butikk",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Henting i nærheten",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Hent",
  "store/shipping-option-zipcode.updateButton.label": "Oppdater",
  "store/shipping-option-zipcode.popoverButton.label": "Velg et sted",
  "store/shipping-option-zipcode.popover.description": "Leveringsalternativer og -fart kan variere basert på leveringsadresse og butikk"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/da.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Send til:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Indtast en lokation",
  "store/shipping-option-zipcode.storeButton.label": "Butik:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Vælg en butik",
  "store/shipping-option-zipcode.deliverDrawer.title": "Vis tilgængelighed for din region",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Vis butikker i din region",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Vælg en butik",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Indtast dit postnummer",
  "store/shipping-option-zipcode.postalCodeInput.error": "Det indtastede postnummer er ikke indenfor dit dækningsområde",
  "store/shipping-option-zipcode.currentLocationButton": "Brug nuværende lokation",
  "store/shipping-option-zipcode.storeHoursButton": "Vis butikkens åbningstider",
  "store/shipping-option-zipcode.viewMoreButton": "Vis mere",
  "store/shipping-option-zipcode.shippinFilter.title": "Forsendelsesmuligheder",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Send til",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Indtast en lokation",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Afhent ved",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Vælg en butik",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Afhent i nærheden",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Afhent",
  "store/shipping-option-zipcode.updateButton.label": "Opdater",
  "store/shipping-option-zipcode.popoverButton.label": "Vælg en lokation",
  "store/shipping-option-zipcode.popover.description": "Forsendelsesmuligheder og -hastighed kan variere afhængigt af leveringsadresse og butik"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/th.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "ส่งไปที่:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "ใส่ตำแหน่งที่ตั้ง",
  "store/shipping-option-zipcode.storeButton.label": "ร้านค้า:",
  "store/shipping-option-zipcode.storeButton.placeholder": "เลือกร้านค้า",
  "store/shipping-option-zipcode.deliverDrawer.title": "ดูบรืการที่มีในภูมิภาคที่คุณอยู่",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "ดูร้านค้าในภูมิภาคที่คุณอยู่",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "เลือกร้านค้า",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "ใส่รหัสไปรษณีย์ของคุณ",
  "store/shipping-option-zipcode.postalCodeInput.error": "รหัสไปรษณีย์ที่ให้ไม่อยู่ในพื้นที่ดูแลของเรา",
  "store/shipping-option-zipcode.currentLocationButton": "ใช้ที่ตั้งปัจจุบัน",
  "store/shipping-option-zipcode.storeHoursButton": "ดูเวลาทำการของร้านค้า",
  "store/shipping-option-zipcode.viewMoreButton": "ดูเพิ่มเติม",
  "store/shipping-option-zipcode.shippinFilter.title": "ตัวเลือกการขนส่งสินค้า",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "ส่งไปที่",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "ใส่ตำแหน่งที่ตั้ง",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "จุดรับสินค้าเอง",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "เลือกร้านค้า",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "จุดรับสินค้าบริเวณใกล้เคียง",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "การรับสินค้าเอง",
  "store/shipping-option-zipcode.popoverButton.label": "เลือกตำแหน่งที่ตั้ง",
  "store/shipping-option-zipcode.popover.description": "ตัวเลือกการขนส่งและความเร็วอาจแตกต่างกันไปตามที่อยู่การจัดส่งและร้านค้า"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/sv.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Leverera på adressen till:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Ange en plats",
  "store/shipping-option-zipcode.storeButton.label": "Butik:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Välj en butik",
  "store/shipping-option-zipcode.deliverDrawer.title": "Visa tillgänglighet för din region",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Visa butiker i din region",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Välj en butik",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Ange ditt postnummer",
  "store/shipping-option-zipcode.postalCodeInput.error": "Det angivna postnumret är inte inom vårt täckningsområde",
  "store/shipping-option-zipcode.currentLocationButton": "Använd aktuell plats",
  "store/shipping-option-zipcode.storeHoursButton": "Visa butikstimmar",
  "store/shipping-option-zipcode.viewMoreButton": "Visa mer",
  "store/shipping-option-zipcode.shippinFilter.title": "Leveransalternativ",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Leverera till",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Ange en plats",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Hämta vid",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Välj butik",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Hämtning i närheten",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Hämta",
  "store/shipping-option-zipcode.updateButton.label": "Uppdatera",
  "store/shipping-option-zipcode.popoverButton.label": "Välj en plats",
  "store/shipping-option-zipcode.popover.description": "Leveransalternativ och hastighet kan variera beroende på leveransadress och butik"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/messages/es.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "store/shipping-option-zipcode.deliverToButton.label": "Enviar a:",
  "store/shipping-option-zipcode.deliverToButton.placeholder": "Ingresa una ubicación",
  "store/shipping-option-zipcode.storeButton.label": "Tienda:",
  "store/shipping-option-zipcode.storeButton.placeholder": "Selecciona una tienda",
  "store/shipping-option-zipcode.deliverDrawer.title": "Consulta la disponibilidad en tu región",
  "store/shipping-option-zipcode.pickupDrawer.title.empty": "Consulta las tiendas en tu región",
  "store/shipping-option-zipcode.pickupDrawer.title.filled": "Selecciona una tienda",
  "store/shipping-option-zipcode.postalCodeInput.placeholder": "Ingresa tu código postal",
  "store/shipping-option-zipcode.postalCodeInput.error": "El código postal ingresado no está incluido en nuestra área de cobertura",
  "store/shipping-option-zipcode.currentLocationButton": "Usar la ubicación actual",
  "store/shipping-option-zipcode.storeHoursButton": "Horario de la tienda",
  "store/shipping-option-zipcode.viewMoreButton": "Ver más",
  "store/shipping-option-zipcode.shippinFilter.title": "Opciones de envío",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.title": "Enviar a",
  "store/shipping-option-zipcode.shippinFilter.deliverTo.enterButton": "Ingresa una ubicación",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.title": "Recogida en",
  "store/shipping-option-zipcode.shippinFilter.pkcupAt.chooseAStore": "Selecciona una tienda",
  "store/shipping-option-zipcode.shippinFilter.pickupnearBy": "Recogida cerca de",
  "store/shipping-option-zipcode.shippinFilter.pickpu": "Recogida",
  "store/shipping-option-zipcode.updateButton.label": "Actualizar",
  "store/shipping-option-zipcode.popoverButton.label": "Selecciona una ubicación",
  "store/shipping-option-zipcode.popover.description": "Las ofertas y las opciones de entrega varían según la región.",
  "store/shipping-option-zipcode.deliveryPopover.submitButton.label": "Continuar",
  "store/shipping-option-zipcode.deliveryPopover.postalCodeInput.placeholder": "Código postal",
  "store/shipping-option-zipcode.popover.postalCodeLink": "No se mi codigo postal",
  "store/shipping-option-zipcode.locationModal.title": "Ingresa una ubicación",
  "store/shipping-option-zipcode.locationModal.description": "Las ofertas y las opciones de entrega varían según la región.",
  "store/shipping-option-zipcode.locationModal.noPickupsState.title": "Tienda no disponible en la región",
  "store/shipping-option-zipcode.locationModal.noPickupsState.description": "No hay productos disponibles para o código postal",
  "store/shipping-option-zipcode.locationModal.noPickupsState.button.label": "Introduce otra ubicación",
  "store/shipping-option-zipcode.shippingSelectionModal.title": "Seleccione un método de envío",
  "store/shipping-option-zipcode.shippingSelectionModal.description": "La disponibilidad de los productos varía según el método:",
  "store/shipping-option-zipcode.shippingSelectionModal.deliveryButton.label": "Entregar a domicilio",
  "store/shipping-option-zipcode.shippingSelectionModal.pickupButton.label": "Recoger en una tienda",
  "store/shipping-option-zipcode.pickupSelection.title": "Elige una tienda",
  "store/shipping-option-zipcode.pickupSelection.noStoresState.title": "No hay tiendas disponibles",
  "store/shipping-option-zipcode.pickupSelection.noStoresState.description": "No hay tiendas que atiendan el código postal {postalCode}",
  "store/shipping-option-zipcode.pickupSelection.noStoresState.button.label": "Continuar con la entrega",
  "store/shipping-option-zipcode.unavailableItems.title": "Artículos no disponibles",
  "store/shipping-option-zipcode.unavailableItems.description": "Estos artículos no se pueden entregar en {addressLabel} y no están disponibles en ningún punto de recogida",
  "store/shipping-option-zipcode.unavailableItems.forPickup.description": "Estos artículos no están disponibles para el punto de recogida",
  "store/shipping-option-zipcode.unavailableItems.forDelivery.description": "Estos artículos no se pueden entregar en {addressLabel}",
  "store/shipping-option-zipcode.unavailableItems.removeItemsButton.label": "Eliminar artículos",
  "store/shipping-option-zipcode.unavailableItems.retryButton.label": "Ingresar otra ubicación",
  "store/shipping-option-zipcode.LocationDetectorButton.title": "Usar mi ubicación actual",
  "store/shipping-option-zipcode.LocationDetectorButtonLoading.description": "Configurando tu ubicación...",
  "store/shipping-option-zipcode.LocationDetectorButtonError.description": "No se pudo detectar la ubicación"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/docs/README.md from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```markdown
📢 Use this project, [contribute](https://github.com/{OrganizationName}/{AppName}) to it or open issues to help evolve it using [Store Discussion](https://github.com/vtex-apps/store-discussion).

# Shipping Option Components

<!-- DOCS-IGNORE:start -->
<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->

[![All Contributors](https://img.shields.io/badge/all_contributors-0-orange.svg?style=flat-square)](#contributors-)

<!-- ALL-CONTRIBUTORS-BADGE:END -->
<!-- DOCS-IGNORE:end -->

> ⚠ The Shipping Option Components app is available only for stores using [Delivery Promises](https://help.vtex.com/en/tutorial/delivery-promise-beta--p9EJH9GgxL0JceA6dBswd). This feature is in closed beta, which means that only selected customers can access it. If you are interested in implementing it in the future, please contact our [Support](https://support.vtex.com/hc/en-us) team.
>
> For more information on setting up Delivery Promise components on Store Framework, see the [developer documentation](https://developers.vtex.com/docs/guides/setting-up-delivery-promise-components).

The Shipping Option Components app exports a component that aims to allow you to filter store products by location or pickup point.

![Media Placeholder](https://github.com/user-attachments/assets/6f334e28-fd01-42e9-a536-64eb9742e70c)

## Configuration

### Adding the Shipping Option Components app to your theme dependencies

Add the `shipping-option-components` app to your theme dependencies in the `manifest.json` as shown below:

```json
  "dependencies": {
    "vtex.shipping-option-components": "1.x"
  }
```

You can now use all blocks exported by the `shipping-option-components` app. See the full list below:

| Block name                          | Description                                                                                |
| ----------------------------------- | ---------------------------------------------------------------------------------------------------- |
| `shipping-option-location-selector` | Renders a set of components that allow users to add their location and/or select a store for pickup. |

### Adding Shipping Option Components blocks to the theme

Declare the `shipping-option-location-selector` block as a child block of your [header](https://developers.vtex.com/docs/apps/vtex.store-header) block, exported by the `store-header` app. Example:

```json
"header.full": {
   "blocks": ["header-layout.desktop", "header-layout.mobile"]
 },

 "header-layout.desktop": {
   "children": [
     "header-row#1-desktop",
   ]
 },

 "header-row#1-desktop": {
   "children": ["shipping-option-location-selector"],
 },

"shipping-option-location-selector": {
  "props": {
    "compactMode": true,
    "showLocationDetectorButton": true
  }
},
```

#### `shipping-option-location-selector` props

| Prop name                    | Type      | Description                                                                                | Default value   |
| ---------------------------- | --------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------- |
| `callToAction`               | `enum`    | Defines the type of overlay that opens when the page loads. Possible values: `modal` (modal that requires a postal code input), `popover-input` (popover for postal code input), `popover-button` (popover that opens with a button).                       | `popover-input` |
| `compactMode`                | `boolean` | Determines whether the button displays its label. When true, the label is hidden, showing only its value.                                                                                | `false`         |
| `dismissible`                | `boolean` | Controls whether the modal can be dismissed without entering a postal code. When set to `false`, the modal cannot be closed until a postal code is entered. Must be used along with `callToAction` to correctly set a blocking modal.                       | `true`          |
| `shippingSelection`          | `enum`    | Defines the type of shipping option selector to be shown. Possible values: `delivery-and-pickup` (shows both options), `only-pickup` (shows only the pickup store selector)                                                                                | `delivery-and-pickup` |
| `showLocationDetectorButton` | `boolean` | When set to `true`, displays a location detector button that automatically detects the user's current location using geolocation API and sets the postal code based on their coordinates. The button appears in both the main component and location modal. | `false`         |

## Customization

In order to apply CSS customizations in this and other blocks, follow the instructions given in the recipe on [Using CSS Handles for store customization](https://vtex.io/docs/recipes/style/using-css-handles-for-store-customization).

| CSS Handles                       |
| --------------------------------- |
| `buttonLabel`                     |
| `buttonValue`                     |
| `buttonWrapper`                   |
| `deliveryModalButtonLabel`        |
| `deliveryModalButtonLabelLimited` |
| `deliveryModalButton`             |
| `deliveryPopover`                 |
| `locationDetectorButton`          |
| `locationDetectorButtonContainer` |
| `locationDetectorButtonIcon`      |
| `noPickupsStateContent`           |
| `pickupItem`                      |
| `pickupItemSelected`              |
| `popoverInputContainer`           |
| `popoverPolygon`                  |
| `popoverPolygonContainer`         |
| `popoverPolygonSvg`               |
| `postalCodeHelpLink`              |
| `postalCodeInputClearButton`      |
| `postalCodeInputContainer`        |
| `shippingButtonContainer`         |
| `shippingMethodModalOptions`      |
| `shippingOptionButton`            |
| `shippingOptionButtonSelected`    |

<!-- DOCS-IGNORE:start -->

## Contributors ✨

Thanks goes to these wonderful people:

<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
<!-- prettier-ignore-start -->
<!-- markdownlint-disable -->
<!-- markdownlint-enable -->
<!-- prettier-ignore-end -->

<!-- ALL-CONTRIBUTORS-LIST:END -->

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind are welcome!

<!-- DOCS-IGNORE:end -->

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/react/index.tsx from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```tsx
/* eslint-disable no-restricted-globals */
import React, { useEffect, useState } from 'react'
import { usePixelEventCallback } from 'vtex.pixel-manager'
import { useIntl } from 'react-intl'

import { useShippingOptionState, useShippingOptionDispatch } from './context'
import ShippingSelectionModal from './components/ShippingSelectionModal'
import DeliveryModalButton from './components/ShippingSelectionModal/DeliveryModalButton'
import { SHIPPING_MODAL_PIXEL_EVENT_ID } from './constants'
import LocationModal from './components/LocationModal'
import ShippingOptionButton from './components/ShippingOptionButton'
import messages from './messages'
import PickupModal from './components/PickupModal'
import PinIcon from './components/PinIcon'
import PickupIcon from './components/ShippingSelectionModal/PickupIcon'
import UnavailableItemsModal from './components/UnavailableItemsModal'

interface Props {
  hideStoreSelection?: boolean
  callToAction?: CallToAction
  dismissible?: boolean
  shippingSelection?: ShippingSelection
  mode?: Mode
  showLocationDetectorButton?: boolean
}

function ShippingOptionZipcode({
  callToAction = 'popover-input',
  dismissible = false,
  shippingSelection = 'delivery-and-pickup',
  mode = 'default',
  showLocationDetectorButton = false,
}: Props) {
  const intl = useIntl()
  const [isShippingModalOpen, setIsShippingModalOpen] = useState(false)
  const [isLocationModalOpen, setIsLocationModalOpen] = useState<boolean>(false)
  const [isPickupModalOpen, setIsPickupModalOpen] = useState<boolean>(false)
  const [wasLocationModalOpenedByEvent, setWasLocationModalOpenedByEvent] =
    useState<boolean>(false)

  const {
    zipcode: selectedZipcode,
    pickups,
    selectedPickup,
    isLoading,
    shippingOption,
    addressLabel,
    submitErrorMessage,
    areThereUnavailableCartItems,
    unavailableCartItems,
    unavailabilityMessage,
  } = useShippingOptionState()

  const dispatch = useShippingOptionDispatch()

  const onSubmit = (zipcode: string, reload?: boolean) => {
    dispatch({
      type: 'UPDATE_ZIPCODE',
      args: { zipcode, reload },
    })
  }

  const onSelectPickup = (pickup: Pickup) => {
    dispatch({
      type: 'UPDATE_PICKUP',
      args: { pickup },
    })
  }

  const onDeliverySelection = () => {
    if (shippingOption === 'delivery') {
      // If delivery is already selected, reset to no selection
      dispatch({
        type: 'RESET_SHIPPING_OPTION',
      })
    } else {
      dispatch({
        type: 'SELECT_DELIVERY_SHIPPING_OPTION',
      })
    }
  }

  const onPickupMethodSelection = () => {
    if (shippingOption === 'pickup-in-point') {
      // If pickup is already selected, reset to no selection
      dispatch({
        type: 'RESET_SHIPPING_OPTION',
      })
    }
    // Removed automatic pickup selection - let user choose from the list
  }

  const onAbortUnavailableItemsAction = () => {
    dispatch({
      type: 'ABORT_UNAVAILABLE_ITEMS_ACTION',
    })
  }

  const onContinueUnavailableItemsAction = () => {
    dispatch({
      type: 'CONTINUE_UNAVAILABLE_ITEMS_ACTION',
    })
  }

  usePixelEventCallback({
    eventId: SHIPPING_MODAL_PIXEL_EVENT_ID,
    handler: () => {
      setWasLocationModalOpenedByEvent(true)
      setIsLocationModalOpen(true)
    },
  })

  useEffect(() => {
    const isModalOpen =
      !isLoading && !selectedZipcode && callToAction === 'modal'

    if (isModalOpen) {
      setIsLocationModalOpen(true)
    }
  }, [callToAction, selectedZipcode, isLoading])

  const showDeliveryModalButton = shippingSelection === 'delivery-and-pickup'
  const showPickupButton = shippingSelection === 'only-pickup'
  const pickup =
    shippingOption === 'pickup-in-point' ? selectedPickup : undefined

  return (
    <>
      <ShippingOptionButton
        onClick={() => {
          setWasLocationModalOpenedByEvent(false)
          setIsLocationModalOpen(true)
        }}
        showLocationDetectorButton={showLocationDetectorButton}
        loading={isLoading}
        value={addressLabel}
        placeholder={intl.formatMessage(messages.deliverToButtonPlaceholder)}
        selectedZipcode={selectedZipcode}
        onSubmit={(zipCode: string) => {
          setWasLocationModalOpenedByEvent(true)
          onSubmit(zipCode, true)
        }}
        inputErrorMessage={submitErrorMessage?.message}
        callToAction={callToAction}
        mode={mode}
        icon={<PinIcon filled={false} width={20} height={20} />}
      />

      {selectedZipcode && showDeliveryModalButton && (
        <DeliveryModalButton
          onClick={() => setIsShippingModalOpen(true)}
          selectedShipping={shippingOption}
          selectedPickup={selectedPickup}
          loading={isLoading}
        />
      )}

      {selectedZipcode && showPickupButton && (
        <ShippingOptionButton
          onClick={() => setIsPickupModalOpen(true)}
          loading={isLoading}
          value={pickup?.pickupPoint.friendlyName}
          placeholder={intl.formatMessage(messages.storeButtonPlaceHolder)}
          mode={mode}
          icon={<PickupIcon width={20} height={20} />}
        />
      )}

      <LocationModal
        isOpen={isLocationModalOpen && !areThereUnavailableCartItems}
        onClose={() => setIsLocationModalOpen(false)}
        showLocationDetectorButton={showLocationDetectorButton}
        onSubmit={async (zipcode: string) => {
          onSubmit(zipcode, true)
        }}
        isLoading={isLoading}
        inputErrorMessage={submitErrorMessage}
        selectedZipcode={selectedZipcode}
        nonDismissibleModal={
          (!dismissible && !selectedZipcode) ||
          (wasLocationModalOpenedByEvent && !selectedZipcode)
        }
      />

      <ShippingSelectionModal
        isOpen={isShippingModalOpen && !areThereUnavailableCartItems}
        onClose={() => setIsShippingModalOpen(false)}
        selectedShipping={shippingOption}
        onDeliverySelection={() => {
          onDeliverySelection()
        }}
        onPickupMethodSelection={onPickupMethodSelection}
        pickupProps={{
          onSelectPickup,
          onSubmit: (value) => onSubmit(value, true),
          pickups,
          inputErrorMessage: submitErrorMessage?.message,
          selectedPickup: pickup,
          selectedZipcode,
          isLoading,
        }}
        nonDismissibleModal={false}
      />

      <PickupModal
        isOpen={isPickupModalOpen && !areThereUnavailableCartItems}
        onClose={() => setIsPickupModalOpen(false)}
        pickupProps={{
          onSelectPickup,
          onSubmit: (value) => onSubmit(value, true),
          pickups,
          inputErrorMessage: submitErrorMessage?.message,
          selectedPickup: pickup,
          selectedZipcode,
          isLoading,
        }}
      />

      <UnavailableItemsModal
        isOpen={areThereUnavailableCartItems}
        onClose={onAbortUnavailableItemsAction}
        onTryAgain={onAbortUnavailableItemsAction}
        onRemoveItems={onContinueUnavailableItemsAction}
        unavailableCartItems={unavailableCartItems}
        unavailabilityMessage={unavailabilityMessage}
      />
    </>
  )
}

export default ShippingOptionZipcode

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/react/ShippingOptionContext.tsx from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```tsx
import {
  ShippingOptionProvider,
  useShippingOptionDispatch,
  useShippingOptionState,
} from './context'

export default {
  ShippingOptionProvider,
  useShippingOptionDispatch,
  useShippingOptionState,
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/react/styles.css from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```css
.buttonWrapper {
  cursor: pointer;
  background-color: unset;
}

.zipCodeValue:hover {
  background-color: #eef3f7 !important;
}

.zipCodeValue {
  border: 0;
  cursor: pointer;
  padding: 8px;
  background-color: unset;
  width: 100%;
  align-items: center;
  color: #2e2e2e;
}

.shippingButtonContainer {
  margin: auto;
  position: relative;
}

.deliveryPopover {
  display: flex;
  gap: 16px;
  flex-direction: column;
  border-radius: 12px;
  z-index: 500;
  background-color: #fff;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.12);
  padding: 20px;
  max-width: min(calc(100vw - 20px), 380px);
}

.popoverInputContainer {
  gap: 16px;
  align-items: start;
}

.openIconContainer:has(.drawerHiddenIcon) {
  display: none;
}

.shippingOptionButton,
.modalCloseButton,
.modalBackButton,
.deliveryModalButton {
  cursor: pointer;
  background-color: unset;
  border: 0;
  text-align: left;
}

.modalCloseButton {
  text-align: right;
}

.shippingOptionButton {
  border: 1px solid var(--border-2, #e2e4e6);
  border-radius: 8px;
  padding: 28px 40px;
}

.shippingOptionButtonSelected {
  border: 1px solid var(--border-1, #7e7e7e);
}

.shippingOptionButton:hover {
  border: 1px solid var(--border-1, #7e7e7e);
}

.shippingMethodModalOptions {
  gap: 20px;
}

.deliveryModalButtonLabel,
.deliveryDrawerValue {
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.32px;
  max-width: 122px;
  margin-left: 6px;
}

.deliveryModalButtonLabel {
  max-width: 68px;
}

.deliveryModalButtonLabelLimited {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.buttonValue {
  max-width: 110px;
  align-self: end;
}

.availabilityBadgeCircle {
  width: 10px;
  height: 10px;
  min-width: 10px;
  min-height: 10px;
}

.availabilityPickupButton {
  border: 0;
  padding: 0;
  font-size: 14px;
  background: unset;
  cursor: pointer;
  text-align: left;
  font-weight: 500;
  color: #134cd8;
}

@keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Internet Explorer */
@-ms-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/react/messages.ts from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```typescript
import { defineMessages } from 'react-intl'

const messages = defineMessages({
  deliverToButtonLabel: {
    id: 'store/shipping-option-zipcode.deliverToButton.label',
    defaultMessage: '',
  },
  deliverToButtonPlaceholder: {
    id: 'store/shipping-option-zipcode.deliverToButton.placeholder',
    defaultMessage: '',
  },
  storeButtonLabel: {
    id: 'store/shipping-option-zipcode.storeButton.label',
    defaultMessage: '',
  },
  storeButtonPlaceHolder: {
    id: 'store/shipping-option-zipcode.storeButton.placeholder',
    defaultMessage: '',
  },
  storeDeliverDrawerTitle: {
    id: 'store/shipping-option-zipcode.deliverDrawer.title',
    defaultMessage: '',
  },
  pickupDrawerTitleEmpty: {
    id: 'store/shipping-option-zipcode.pickupDrawer.title.empty',
    defaultMessage: '',
  },
  pickupDrawerTitleFilled: {
    id: 'store/shipping-option-zipcode.pickupDrawer.title.filled',
    defaultMessage: '',
  },
  postalCodeInputPlaceHolder: {
    id: 'store/shipping-option-zipcode.postalCodeInput.placeholder',
    defaultMessage: '',
  },
  postalCodeInputError: {
    id: 'store/shipping-option-zipcode.postalCodeInput.error',
    defaultMessaage: '',
  },
  updateButtonLabel: {
    id: 'store/shipping-option-zipcode.updateButton.label',
    defaultMessaage: '',
  },
  popoverButtonLabel: {
    id: 'store/shipping-option-zipcode.popoverButton.label',
    defaultMessaage: '',
  },
  popoverSubmitButtonLabel: {
    id: 'store/shipping-option-zipcode.deliveryPopover.submitButton.label',
    defaultMessaage: '',
  },
  popoverDescription: {
    id: 'store/shipping-option-zipcode.popover.description',
    defaultMessaage: '',
  },
  popoverPostalCodeInputPlaceHolder: {
    id: 'store/shipping-option-zipcode.deliveryPopover.postalCodeInput.placeholder',
    defaultMessaage: '',
  },
  popoverPostalCodeLink: {
    id: 'store/shipping-option-zipcode.popover.postalCodeLink',
    defaultMessaage: '',
  },
  locationModalTitle: {
    id: 'store/shipping-option-zipcode.locationModal.title',
    defaultMessaage: '',
  },
  locationModalDescription: {
    id: 'store/shipping-option-zipcode.locationModal.description',
    defaultMessaage: '',
  },
  noPickupsStateTitle: {
    id: 'store/shipping-option-zipcode.locationModal.noPickupsState.title',
    defaultMessaage: '',
  },
  noPickupsStateDescription: {
    id: 'store/shipping-option-zipcode.locationModal.noPickupsState.description',
    defaultMessaage: '',
  },
  noPickupsStateButtonLabel: {
    id: 'store/shipping-option-zipcode.locationModal.noPickupsState.button.label',
    defaultMessaage: '',
  },
  noStoresStateTitle: {
    id: 'store/shipping-option-zipcode.pickupSelection.noStoresState.title',
    defaultMessaage: '',
  },
  noStoresStateDescription: {
    id: 'store/shipping-option-zipcode.pickupSelection.noStoresState.description',
    defaultMessaage: '',
  },
  noStoresStateButton: {
    id: 'store/shipping-option-zipcode.pickupSelection.noStoresState.button.label',
    defaultMessaage: '',
  },
  shippingSelectionModalTitle: {
    id: 'store/shipping-option-zipcode.shippingSelectionModal.title',
    defaultMessaage: '',
  },
  shippingSelectionModalDescription: {
    id: 'store/shipping-option-zipcode.shippingSelectionModal.description',
    defaultMessaage: '',
  },
  shippingSelectionModalDeliveryButton: {
    id: 'store/shipping-option-zipcode.shippingSelectionModal.deliveryButton.label',
    defaultMessaage: '',
  },
  shippingSelectionModalPickupButton: {
    id: 'store/shipping-option-zipcode.shippingSelectionModal.pickupButton.label',
    defaultMessaage: '',
  },
  pickupSelectionTitle: {
    id: 'store/shipping-option-zipcode.pickupSelection.title',
    defaultMessaage: '',
  },
  deliveryAvailableBadge: {
    id: 'store/shipping-option-zipcode.availabilityBadge.deliveryAvailable',
    defaultMessaage: '',
  },
  deliveryUnavailableBadge: {
    id: 'store/shipping-option-zipcode.availabilityBadge.deliveryUnavailable',
    defaultMessaage: '',
  },
  pickupUnavailableBadge: {
    id: 'store/shipping-option-zipcode.availabilityBadge.pickupUnavailable',
    defaultMessaage: '',
  },
  pickupAtBadge: {
    id: 'store/shipping-option-zipcode.availabilityBadge.pickupAt',
    defaultMessaage: '',
  },
  unavailableItemsModalRemoveButton: {
    id: 'store/shipping-option-zipcode.unavailableItems.removeItemsButton.label',
    defaultMessaage: '',
  },
  unavailableItemsModalRetryButton: {
    id: 'store/shipping-option-zipcode.unavailableItems.retryButton.label',
    defaultMessaage: '',
  },
  unavailableItemsModalTitle: {
    id: 'store/shipping-option-zipcode.unavailableItems.title',
    defaultMessaage: '',
  },
  unavailableItemsModalDescription: {
    id: 'store/shipping-option-zipcode.unavailableItems.description',
    defaultMessaage: '',
  },
  unavailableItemsModalForPickupDescription: {
    id: 'store/shipping-option-zipcode.unavailableItems.forPickup.description',
    defaultMessaage: '',
  },
  unavailableItemsModalForDeliveryDescription: {
    id: 'store/shipping-option-zipcode.unavailableItems.forDelivery.description',
    defaultMessaage: '',
  },
  LocationDetectorButtonTitle: {
    id: 'store/shipping-option-zipcode.LocationDetectorButton.title',
    defaultMessaage: '',
  },
  LocationDetectorButtonLoadingDescription: {
    id: 'store/shipping-option-zipcode.LocationDetectorButtonLoading.description',
    defaultMessage: '',
  },
  LocationDetectorButtonErrorDescription: {
    id: 'store/shipping-option-zipcode.LocationDetectorButtonError.description',
    defaultMessage: '',
  },
})

export default messages

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/react/PostalCodeModal.tsx from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```tsx
import React from 'react'

import LocationModal from './components/LocationModal'
import { useShippingOptionDispatch, useShippingOptionState } from './context'

interface Props {
  isOpen: boolean
  onClose: () => void
}

const LocationModalWithContext = ({ isOpen, onClose }: Props) => {
  const {
    zipcode: selectedZipcode,
    isLoading,
    submitErrorMessage,
  } = useShippingOptionState()

  const dispatch = useShippingOptionDispatch()

  const onSubmit = (zipcode: string, reload?: boolean) => {
    dispatch({
      type: 'UPDATE_ZIPCODE',
      args: { zipcode, reload },
    })
  }

  return (
    <LocationModal
      isOpen={isOpen}
      onClose={onClose}
      onSubmit={onSubmit}
      isLoading={isLoading}
      inputErrorMessage={submitErrorMessage}
      selectedZipcode={selectedZipcode}
    />
  )
}

export default LocationModalWithContext

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/react/PickupModal.tsx from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```tsx
import React from 'react'

import PickupModal from './components/PickupModal'
import { useShippingOptionDispatch, useShippingOptionState } from './context'

interface Props {
  isOpen: boolean
  onClose: () => void
}

const PickupModalWithContext = ({ isOpen, onClose }: Props) => {
  const {
    zipcode: selectedZipcode,
    pickups,
    selectedPickup,
    isLoading,
    submitErrorMessage,
  } = useShippingOptionState()

  const dispatch = useShippingOptionDispatch()

  const onSubmit = (zipcode: string, reload?: boolean) => {
    dispatch({
      type: 'UPDATE_ZIPCODE',
      args: { zipcode, reload },
    })
  }

  const onSelectPickup = (pickup: Pickup) => {
    dispatch({
      type: 'UPDATE_PICKUP',
      args: { pickup, canUnselect: false },
    })
  }

  return (
    <PickupModal
      isOpen={isOpen}
      onClose={onClose}
      pickupProps={{
        onSelectPickup,
        onSubmit: (value) => onSubmit(value, false),
        pickups,
        inputErrorMessage: submitErrorMessage?.message,
        selectedPickup,
        selectedZipcode,
        isLoading,
      }}
    />
  )
}

export default PickupModalWithContext

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/react/package.json from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "version": "2.0.0",
  "scripts": {
    "test": "vtex-test-tools test"
  },
  "dependencies": {
    "@ariakit/react": "^0.4.17",
    "@types/react-modal": "3.13.1",
    "apollo-client": "^2.6.8",
    "react": "^16.14.0",
    "react-apollo": "^3.1.3",
    "react-dom": "^16.14.0",
    "react-intl": "^3.12.0",
    "react-modal": "3.14.4",
    "react-outside-click-handler": "^1.3.0",
    "react-responsive-modal": "^6.4.2"
  },
  "devDependencies": {
    "@apollo/react-testing": "^3.1.3",
    "@types/node": "^13.9.8",
    "@types/react": "^16.14.0",
    "@types/react-dom": "^16.9.25",
    "@types/react-modal": "^3.16.3",
    "@types/react-outside-click-handler": "^1.3.4",
    "@vtex/test-tools": "^3.3.2",
    "@vtex/tsconfig": "^0.4.4",
    "apollo-cache-inmemory": "^1.6.5",
    "graphql": "^14.6.0",
    "typescript": "3.9.7"
  },
  "resolutions": {
    "@types/jest": "26.0.15"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/react/constants.ts from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```typescript
export const DELIVER_DRAWER_PIXEL_EVENT_ID = 'shipping-option-deliver-to'
export const STORE_DRAWER_PIXEL_EVENT_ID = 'shipping-option-store'
export const SHIPPING_INFO_COOKIE = 'shipping_info'
export const PRODUCTS_NOT_FOUND_ERROR_CODE = 'products-not-found-error'
export const SHIPPING_MODAL_PIXEL_EVENT_ID = 'item-added-to-cart-shipping-modal'

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of shipping-option-components/react/client.ts from the shipping-option-components VTEX app.

[Assistant]
Here's the implementation:

```typescript
import { SHIPPING_INFO_COOKIE } from './constants'
import { setCookie } from './utils/cookie'

export const getAddress = (
  countryCode: string,
  zipCode: string,
  account: string
) =>
  fetch(
    `/api/checkout/pub/postal-code/${countryCode}/${zipCode}?an=${account}`
  ).then((res) => res.json())

// FIXME in the future the country should not be passed here, instead it should go to session
// so this should be fixed for not to pass the country anymore
export const updateSession = async (
  countryCode: string,
  zipCode: string,
  geoCoordinates: number[],
  pickup?: Pickup,
  shippingOption?: string
) => {
  const facetsValue = `zip-code=${zipCode};country=${countryCode};coordinates=${geoCoordinates.join(
    ','
  )}${shippingOption ? `;shipping=${shippingOption}` : ''}${
    pickup ? `;pickupPoint=${pickup.pickupPoint.id}` : ''
  }`

  // __RUNTIME__.segmentToken is not reliable for the facets. It might not be updated. For this reason we must try to get the info from our custom cookie first
  // Replacing ";" by ":" because ";" is not allowed in cookies
  setCookie(SHIPPING_INFO_COOKIE, facetsValue.replace(/;/g, ':'))

  await fetch('/api/sessions', {
    method: 'POST',
    body: JSON.stringify({
      public: {
        facets: {
          value: facetsValue,
        },
      },
    }),
    headers: {
      'Content-Type': 'application/json',
    },
  })
}

export const getPickups = (
  countryCode: string,
  zipCode: string,
  account: string
) =>
  fetch(
    `/api/checkout/pub/pickup-points?an=${account}&countryCode=${countryCode}&postalCode=${zipCode}`
  ).then((res) => res.json())

export const updateOrderForm = (
  country: string,
  zipCode: string,
  orderFormId: string
) =>
  fetch(`/api/checkout/pub/orderForm/${orderFormId}/attachments/shippingData`, {
    method: 'POST',
    body: `{"selectedAddresses": [{ "postalCode": "${zipCode}", "country": "${country}" }]}`,
    headers: {
      'Content-Type': 'application/json',
    },
  }).then((res) => res.json())

export const getCatalogCount = (zipCode: string, geoCoordinates: number[]) =>
  fetch(
    `/api/io/_v/api/intelligent-search/catalog_count?zip-code=${zipCode}&coordinates=${geoCoordinates.join(
      ','
    )}`,
    {
      method: 'GET',
      headers: {
        'Content-Type': 'application/json',
      },
      credentials: 'omit',
    }
  ).then((res) => res.json())

export const getCartProducts = async (orderFormId: string) => {
  const orderForm = await fetch(
    `/api/checkout/pub/orderForm/${orderFormId}`
  ).then((res) => res.json())

  return orderForm.items
}

export const removeCartProductsById = async (
  orderFormId: string,
  cartProductsIndex: number[]
) => {
  const requestBody = {
    orderItems: cartProductsIndex.map((productIndex) => ({
      quantity: 0,
      index: productIndex,
    })),
  }

  const orderForm = await fetch(
    `/api/checkout/pub/orderForm/${orderFormId}/items/update`,
    {
      method: 'POST',
      body: JSON.stringify(requestBody),
      headers: {
        'Content-Type': 'application/json',
      },
    }
  ).then((res) => res.json())

  return orderForm.items
}

export const validateProductAvailability = async (
  zipCode: string,
  countryCode: string,
  products: string[],
  account: string
) => {
  const address = await getAddress(countryCode, zipCode, account)

  const coordinatesArray = address.geoCoordinates
  const coordinate = {
    longitude: coordinatesArray[0],
    latitude: coordinatesArray[1],
  }

  const location = {
    zipCode,
    coordinate,
    country: countryCode,
  }

  const requestBody = {
    location,
    products,
  }

  const baseUrl = window.location.origin

  return fetch(`${baseUrl}/api/io/_v/availability/deliveryorpickup`, {
    method: 'POST',
    body: JSON.stringify(requestBody),
    headers: {
      'Content-Type': 'application/json',
    },
  }).then((res) => res.json())
}

export const validateProductAvailabilityByDelivery = async (
  zipCode: string,
  countryCode: string,
  products: string[],
  account: string
) => {
  const address = await getAddress(countryCode, zipCode, account)

  const coordinatesArray = address.geoCoordinates
  const coordinate = {
    longitude: coordinatesArray[0],
    latitude: coordinatesArray[1],
  }

  const location = {
    zipCode,
    coordinate,
    country: countryCode,
  }

  const requestBody = {
    location,
    products,
  }

  const baseUrl = window.location.origin

  return fetch(`${baseUrl}/api/io/_v/availability/delivery`, {
    method: 'POST',
    body: JSON.stringify(requestBody),
    headers: {
      'Content-Type': 'application/json',
    },
  }).then((res) => res.json())
}

export const validateProductAvailabilityByPickup = async (
  pickupId: string,
  products: string[]
) => {
  const requestBody = {
    products,
  }

  const baseUrl = window.location.origin

  return fetch(
    `${baseUrl}/api/io/_v/availability/pickupid?pickupId=${pickupId}`,
    {
      method: 'POST',
      body: JSON.stringify(requestBody),
      headers: {
        'Content-Type': 'application/json',
      },
    }
  ).then((res) => res.json())
}

```