workarea-one_theme 1.3.0

data/app/views/workarea/storefront/products/templates/_option_thumbnails.html.haml

@@ -0,0 +1,67 @@
+.grid
+  .grid__cell.grid__cell--50-at-medium
+    = render 'workarea/storefront/products/media_carousel', product: product
+
+  .grid__cell.grid__cell--50-at-medium
+    .product-details__name
+      %h1.product-details__heading= product.name
+
+    .product-prices.product-prices--details
+      = render 'workarea/storefront/products/pricing', product: product
+
+    = form_tag cart_items_path, method: 'post', class: 'product-details__add-to-cart-form', data: { dialog_form: { dialogOptions: { closeAll: true, initModules: true } }, analytics: add_to_cart_analytics_data(product).to_json } do
+      = hidden_field_tag :product_id, product.id, id: dom_id(product, 'product_id')
+      = hidden_field_tag :sku, product.current_sku
+      = hidden_field_tag :via, params[:via], id: dom_id(product, 'via')
+
+      .grid.grid--middle
+        .grid__cell.grid__cell--60
+          .grid
+            .grid__cell
+              - product.options_for_selection.each_with_index do |option, index|
+                .property
+                  = label_tag option.slug, nil, class: 'property__name', for: "#{option.slug}_#{dom_id(product)}", id: "aria_product_option_#{option.slug}_#{index}" do
+                    %span.property__text= option_label(option)
+                  .value
+                    - option.selections.each do |selection|
+                      = radio_button_tag option.slug, selection, option.current == selection, required: true, title: selection, class: 'visually-hidden', aria: { labelledby: "aria_product_option_#{option.slug}_#{index}" }
+                      = link_to option_selection_url_for(product, option, selection), title: selection, class: "option-button option-button--#{selection.downcase.dasherize}#{' option-button--active' if option.current == selection}", data: { option_button: '' } do
+                        - if product.images_by_option[selection.optionize].present?
+                          = image_tag(product_image_url(product.images_by_option[selection.optionize].first, :swatch_thumb), alt: selection, class: 'option-button__image')
+                        - else
+                          %span.option-button__text= selection
+
+              = append_partials('storefront.add_to_cart_form', product: product)
+
+            - if product.purchasable?
+              .grid__cell
+                .product-details__quantity
+                  .property
+                    = label_tag :quantity, nil, class: 'property__name', for: "quantity#{dom_id(product)}" do
+                      %span.property__text= t('workarea.storefront.products.quantity')
+                    .quantity-control
+                      = button_tag '-', { type: 'button', data: { quantity_control: { 'direction': 'dec', 'autosubmit': false }.to_json }, class: 'quantity-control__button quantity-control__decrement'}
+                      .value= number_field_tag :quantity, params[:quantity] || 1, class: 'quantity-control__input text-box text-box--x-small', required: true, min: 1, id: "quantity#{dom_id(product)}"
+                      = button_tag '+', { type: 'button', data: { quantity_control: { 'direction': 'inc', 'autosubmit': false }.to_json }, class: 'quantity-control__button quantity-control__increment'}
+
+                - unless product.currently_selected_options.blank?
+                  = link_to t('workarea.storefront.products.clear_selections'), product_path(product), data: { option_button: '' }
+
+              .grid__cell
+                %p.product-details__add-to-cart-action= button_tag t('workarea.storefront.products.add_to_cart'), value: 'add_to_cart', class: 'button'
+
+            - else
+              .grid__cell
+                = hidden_field_tag :quantity, params[:quantity] || 1, id: "quantity#{dom_id(product)}"
+                %p.product-details__unavailable= t('workarea.storefront.products.unavailable')
+
+          - if product.current_sku.present?
+            %p.product-details__inventory-status= product.inventory_status
+
+    - if product.description.present?
+      .product-details__description
+        %p= truncated_product_description(product, t('workarea.storefront.products.read_more'))
+
+    = append_partials('storefront.product_details', product: product)
+
+    %p.product-details__full-details=link_to t('workarea.storefront.products.view_full_details'), product_path(product, color: params[:color]), class: 'text-button'

data/app/views/workarea/storefront/products/templates/_swatches.html.haml

@@ -0,0 +1,78 @@
+.grid
+  .grid__cell.grid__cell--50-at-medium
+    = render 'workarea/storefront/products/media_carousel', product: product
+
+  .grid__cell.grid__cell--50-at-medium
+    .product-details__name
+      %h1.product-details__heading= product.name
+
+    .product-prices.product-prices--details
+      = render 'workarea/storefront/products/pricing', product: product
+
+    = append_partials('storefront.product_pricing_details', product: product)
+
+    - if product.description.present?
+      .product-details__description
+        %p= truncated_product_description(product, t('workarea.storefront.products.read_more'))
+
+    = form_tag cart_items_path, method: 'post', class: 'product-details__add-to-cart-form', data: { dialog_form: { dialogOptions: { closeAll: true, initModules: true } }, analytics: add_to_cart_analytics_data(product).to_json } do
+      = hidden_field_tag :product_id, product.id, id: dom_id(product, 'product_id')
+      = hidden_field_tag :sku, product.current_sku
+      = hidden_field_tag :via, params[:via], id: dom_id(product, 'via')
+
+      .grid.grid--middle
+        .grid__cell.grid__cell--60
+          .grid
+            .grid__cell
+              - product.options_for_selection.each do |option|
+                .property
+                  = label_tag option.slug, nil, class: 'property__name', for: "#{option.slug}_#{dom_id(product)}" do
+                    %span.property__text= option_label(option)
+                  .value
+                    - option.selections.each do |selection|
+                      = radio_button_tag option.slug, selection, option.current == selection, required: true, title: selection, class: 'visually-hidden'
+                      = link_to option_selection_url_for(product, option, selection), title: selection, class: "option-button option-button--#{selection.downcase.dasherize} option-button--#{option.name.downcase}#{' option-button--active' if option.current == selection}", data: { option_button: '' } do
+                        - swatch_content = render_swatch_option(selection, product.swatches_by_option[selection.optionize])
+
+                        - if swatch_content.present?
+                          = swatch_content
+                        - elsif product.images_by_option[selection.optionize].present?
+                          = image_tag(product_image_url(product.images_by_option[selection.optionize].first, :swatch_thumb), alt: selection, class: 'option-button__image')
+                        - else
+                          %span.option-button__text= selection
+
+              = append_partials('storefront.add_to_cart_form', product: product)
+
+            - if product.purchasable?
+              .grid__cell
+                .product-details__quantity
+                  .property
+                    = label_tag :quantity, nil, class: 'property__name', for: "quantity#{dom_id(product)}" do
+                      %span.property__text= t('workarea.storefront.products.quantity')
+                    .quantity-control
+                      = button_tag '-', { type: 'button', data: { quantity_control: { 'direction': 'dec', 'autosubmit': false }.to_json }, class: 'quantity-control__button quantity-control__decrement'}
+                      .value= number_field_tag :quantity, params[:quantity] || 1, class: 'quantity-control__input text-box text-box--x-small', required: true, min: 1, id: "quantity#{dom_id(product)}"
+                      = button_tag '+', { type: 'button', data: { quantity_control: { 'direction': 'inc', 'autosubmit': false }.to_json }, class: 'quantity-control__button quantity-control__increment'}
+
+              - unless product.currently_selected_options.blank?
+                .grid__cell
+                  = link_to t('workarea.storefront.products.clear_selections'), product_path(product), data: { option_button: '' }
+
+              .grid__cell
+                %p.product-details__add-to-cart-action= button_tag t('workarea.storefront.products.add_to_cart'), value: 'add_to_cart', class: 'button'
+
+            - else
+              .grid__cell
+                = hidden_field_tag :quantity, params[:quantity] || 1, id: "quantity#{dom_id(product)}"
+                %p.product-details__unavailable= t('workarea.storefront.products.unavailable')
+
+          - if product.current_sku.present?
+            %p.product-details__inventory-status= product.inventory_status
+
+    - if product.description.present?
+      .product-details__description
+        %p= truncated_product_description(product, t('workarea.storefront.products.read_more'))
+
+    = append_partials('storefront.product_details', product: product)
+
+    %p.product-details__full-details=link_to t('workarea.storefront.products.view_full_details'), product_path(product, color: params[:color]), class: 'text-button'

data/app/views/workarea/storefront/reviews/new.html.haml

@@ -0,0 +1,72 @@
+- @title = t('workarea.storefront.reviews.write_a_review_title', name: @product.browser_title)
+
+.write-review.view
+  %h1.heading.heading--3= t('workarea.storefront.reviews.write_a_review_title', name: @product.browser_title)
+
+  - unless request.get?
+    - if @create_review.errors.any?
+      - @create_review.errors.full_messages.each do |message|
+        = render_message 'error', message, data: { analytics: validation_error_analytics_data('review').to_json }
+
+  = form_tag create_product_review_path(@product), method: 'post', id: 'review_form', data: { product_review_ajax_submit: '' } do
+    = hidden_field_tag 'review[product_id]', @product.id
+
+    - if display_purchase_requirement_message
+      %span.write-review__purchase-requirement= t('workarea.storefront.reviews.purchase_requirement')
+
+    - if @review.requires_public_info?
+      .grid
+        .grid__cell.grid__cell--50-at-medium
+          .property
+            = label_tag 'review[first_name]', nil, class: 'property__name' do
+              %span.property__requirement.property__requirement--required= t('workarea.storefront.forms.required')
+              %span.property__text= t('workarea.storefront.users.first_name')
+            .value
+              = text_field_tag 'review[first_name]', @review.first_name, class: 'text-box', required: true
+              .value__note= t('workarea.storefront.reviews.notes.display_name')
+
+        .grid__cell.grid__cell--50-at-medium
+          .property
+            = label_tag 'review[last_name]', nil, class: 'property__name' do
+              %span.property__requirement.property__requirement--required= t('workarea.storefront.forms.required')
+              %span.property__text= t('workarea.storefront.users.last_name')
+            .value
+              = text_field_tag 'review[last_name]', @review.last_name, class: 'text-box', required: true
+              .value__note= t('workarea.storefront.reviews.notes.display_name')
+
+    - if @review.anonymous?
+      .property
+        = label_tag 'review[email]', nil, class: 'property__name' do
+          %span.property__text= t('workarea.storefront.users.email')
+          %span.property__requirement.property__requirement--optional= t('workarea.storefront.forms.optional')
+        .value
+          = email_field_tag 'review[email]', @review.email, class: 'text-box', autocapitalize: 'off', autocorrect: 'off', autocomplete: 'email'
+          .value__note= t('workarea.storefront.reviews.notes.email')
+
+    %fieldset.write-review__rating-fieldset
+      %legend.write-review__rating-ledgend= t('workarea.storefront.reviews.rating')
+      %ul.write-review__ratings
+        - (1..5).each do |i|
+          %li.write-review__rating
+            = radio_button_tag 'review[rating]', i, i == 5 ? true : false, class: 'write-review__rating-input', data: { rating_button: '' }
+            = label_tag "review[rating][#{i}]", nil, class: 'write-review__star' do
+              = inline_svg 'workarea/storefront/icons/star.svg', class: 'write-review__star-icon', title: t('workarea.storefront.reviews.stars', count: i)
+
+    .property
+      = label_tag 'review[title]', nil, class: 'property__name' do
+        %span.property__text= t('workarea.storefront.reviews.review_title')
+      .value= text_field_tag 'review[title]', nil, class: 'text-box', required: true
+
+    .property
+      = label_tag 'review[body]', nil, class: 'property__name' do
+        %span.property__text= t('workarea.storefront.reviews.your_review')
+      .value= text_area_tag 'review[body]', nil, class: 'text-box text-box--multi-line', required: true
+
+    .property= recaptcha_tags
+
+    .grid.grid--middle
+      .grid__cell.grid__cell--50
+        = link_to t('workarea.storefront.forms.cancel'), product_path(@product), data: { dialog_close_button: '' }
+      .grid__cell.grid__cell--50
+        .grid.grid--auto.grid--right.grid--middle
+          .grid__cell= button_tag t('workarea.storefront.reviews.submit'), value: 'submit_review', class: 'button'

data/app/views/workarea/storefront/searches/content.html.haml

@@ -0,0 +1,78 @@
+- @title = t('workarea.storefront.searches.title')
+
+- content_for :head do
+  %meta{ property: 'recent-view', content: recent_view_content(search: @search.query_string) }
+  = append_partials('storefront.search_head', search: @search)
+
+  - if @search.first_page?
+    %link{ href: search_path(q: @search.query_string), rel: 'canonical' }
+  %meta{ name: 'robots', content: 'noindex, follow' }
+  - unless @search.last_page?
+    %link{ href: url_for(q: @search.query_string, page: @search.next_page), rel: 'next' }
+  - unless @search.first_page?
+    %link{ href: url_for(q: @search.query_string, page: @search.prev_page), rel: 'prev' }
+
+  %meta{ property: 'og:url', content: url_for }
+  %meta{ property: 'og:title', content: page_title }
+  %meta{ property: 'og:type', content: 'website' }
+  %meta{ property: 'og:image', content: root_path + image_path('workarea/storefront/logo.png') }
+
+- content_for :breadcrumbs do
+  %p.breadcrumbs__node-group
+    %span.breadcrumbs__node{ itemprop: 'breadcrumb' }
+      = link_to t('workarea.storefront.layouts.home'), root_path, rel: 'home'
+    %span.breadcrumbs__node{ itemprop: 'breadcrumb' }
+      %span= t('workarea.storefront.searches.title')
+    %span.breadcrumbs__node{ itemprop: 'breadcrumb' }
+      %span= @search.query_string
+
+.view{ data: { analytics: search_results_view_analytics_data(@search).to_json } }
+
+  .search-results
+    .header.header--center-at-small
+      .grid.grid--middle
+        .grid__cell.grid__cell--50-at-medium
+          .header__title
+            - if @search.multiple_result_types?
+              %h1.visually-hidden= pluralize(@search.total, t('workarea.storefront.searches.content_result'))
+
+              %ul.search-result-types
+                - if @search.product_total > 0
+                  %li= link_to pluralize(@search.product_total, t('workarea.storefront.searches.product_result')), search_path(q: @search.query_string, type: 'show')
+                %li= pluralize(@search.content_total, t('workarea.storefront.searches.content_result'))
+            - else
+              %h1= pluralize(@search.total, t('workarea.storefront.searches.result'))
+
+        .grid__cell.grid__cell--50-at-medium
+          .grid.grid--right.grid--middle
+            .grid__cell.grid__cell--50-at-medium
+              = form_tag content_search_path, method: 'get' do
+                = hidden_field_tag :q, @search.query_string
+                .property
+                  = label_tag 'sort_top', nil, class: 'property__name' do
+                    %span.property__text= t('workarea.storefront.searches.sort_by')
+                  %span.value= select_tag :sort, options_for_select(@search.sorts, selected: @search.sort), id: 'sort_top', data: { form_submitting_control: '' }
+                .hidden-if-js-enabled= button_tag t('workarea.storefront.searches.sort'), value: 'sort_content_top', class: 'button'
+
+        = append_partials('storefront.search_browse_controls', search: @search)
+
+  - if @search.customization_content_blocks_for('above_results').present?
+    .search-query-content= render_content_blocks(@search.customization_content_blocks_for('above_results'))
+
+  - if @search.query_suggestions.any?
+    .search-results__related
+      %span.search-results__related-title= t('workarea.storefront.searches.suggestions')
+      .grid.grid--auto
+        - @search.query_suggestions.each do |search|
+          .grid__cell
+            %span.search-results__related-term= link_to search, content_search_path(q: search)
+
+  .pagination{ data: { pagination: pagination_data(@search.content) } }
+    %ul
+      - @search.content.each do |result|
+        %li{ data: { pagination_item: '' } }
+          = link_to result.name, send("#{result.resource_name}_path", result)
+          %p= truncate(result.summary, length: 100)
+    - if show_pagination?(@search.content)
+      .pagination__button
+        = link_to t('workarea.storefront.pagination.next_page'), pagination_path_for(page: @search.next_page), class: 'button button--large', data: { pagination_button: '' }

data/app/views/workarea/storefront/searches/show.html.haml

@@ -0,0 +1,97 @@
+- @title = t('workarea.storefront.searches.title')
+
+- content_for :head do
+  %meta{ name: 'robots', content: 'noindex' }
+  = append_partials('storefront.search_head', search: @search)
+
+  %meta{ property: 'og:url', content: url_for(only_path: false) }
+  %meta{ property: 'og:title', content: page_title }
+  %meta{ property: 'og:type', content: 'website' }
+  %meta{ property: 'og:image', content: @search.open_graph_asset.url }
+  %meta{ property: 'og:image:secure_url', content: @search.open_graph_asset.url }
+
+- content_for :breadcrumbs do
+  %p.breadcrumbs__node-group
+    %span.breadcrumbs__node
+      = link_to t('workarea.storefront.layouts.home'), root_path, rel: 'home'
+    %span.breadcrumbs__node
+      %span= t('workarea.storefront.searches.title')
+    %span.breadcrumbs__node
+      %span= @search.query_string
+
+- content_for :drawer do
+  - if @search.facets.any?
+    #mobile-filters-overlay.mobile-filters-overlay.hidden
+    #mobile-filter-drawer.mobile-filters
+      .mobile-filters__content
+        - if @search.facets.any?
+          .result-filters
+            - @search.facets.each do |facet|
+              - unless @search.autoselected_filter?(facet.system_name)
+                = render "workarea/storefront/facets/#{facet.type}", facet: facet
+
+.view{ data: { analytics: search_results_view_analytics_data(@search).to_json } }
+
+  .search-results
+    .header.header--center-at-small
+      .grid.grid--middle
+        .grid__cell.grid__cell--50-at-medium
+          .header__title
+            %h1= pluralize(@search.total, t('workarea.storefront.searches.result'))
+
+            - if @search.message.present?
+              = render_message 'info', @search.message
+
+            = append_partials('storefront.above_search_results', search: @search)
+
+        - if @search.total.zero?
+          .grid__cell.grid__cell--50-at-medium
+            %p
+              = t('workarea.storefront.products.none_found')
+              = link_to t('workarea.storefront.products.reset_filters'), search_path(q: @search.query_string)
+
+        - else
+          .grid__cell.grid__cell--50-at-medium
+            .grid.grid--right.grid--middle
+              .grid__cell.grid__cell--50-at-medium
+                - if @search.facets.any?
+                  .header__filter-button
+                    %button.button{ data: { mobile_filters: ''} }= t('workarea.storefront.products.filter_results')
+
+              .grid__cell.grid__cell--50-at-medium
+                = form_tag search_path, method: 'get' do
+                  = facet_hidden_inputs(@search.facets)
+                  = hidden_field_tag :q, @search.query_string
+                  .property
+                    = label_tag 'sort_top', nil, class: 'property__name' do
+                      %span.property__text= t('workarea.storefront.searches.sort_by')
+                    .value
+                      = select_tag :sort, options_for_select(@search.sorts, selected: @search.sort), id: 'sort_top', data: { form_submitting_control: '' }
+                  .hidden-if-js-enabled= button_tag t('workarea.storefront.searches.sort'), value: 'sort_products_top', class: 'button'
+
+              = append_partials('storefront.search_browse_controls', search: @search)
+
+    - if @search.results_content.present?
+      .search-results__content= render_content_blocks(@search.results_content)
+
+    - if @search.customization_content_blocks_for('above_results').present?
+      .search-results__content= render_content_blocks(@search.customization_content_blocks_for('above_results'))
+
+    - if @search.query_suggestions.any?
+      .search-results__related
+        %span.search-results__related-title= t('workarea.storefront.searches.suggestions')
+
+        .grid.grid--auto
+          - @search.query_suggestions.each do |search|
+            .grid__cell
+              %span.search-results__related-term= link_to search, search_path(q: search), class: 'search-results__related-link'
+
+    .pagination{ data: { analytics: product_list_analytics_data("Search Results for \"#{@search.query_string}\"").to_json, pagination: pagination_data(@search.products),  back_to_top_button: '' } }
+      .grid
+        - @search.products.each_with_index do |product, position|
+          .grid__cell.grid__cell--50.grid__cell--25-at-medium.grid__cell--20-at-wide{ data: { pagination_item: '' } }
+            .product-summary{ data: { search_results_product_grid_summary: { id: product.catalog_id, position: position }.to_json } }
+              = render 'workarea/storefront/products/summary', product: product
+      - if show_pagination?(@search.products)
+        .pagination__button
+          = link_to t('workarea.storefront.pagination.next_page'), pagination_path_for(page: @search.next_page), class: 'button button--large', data: { pagination_button: '' }

data/app/views/workarea/storefront/shared/_address_fields.html.haml

@@ -0,0 +1,109 @@
+- title_label = label.gsub(/_/, ' ').capitalize
+.address-fields
+  .grid
+    .grid__cell.grid__cell--50-at-medium
+      .property
+        = label_tag "#{label}[first_name]", nil, class: 'property__name' do
+          %span.property__text= t('workarea.storefront.addresses.first_name')
+        .value
+          = text_field_tag "#{label}[first_name]", address.first_name, class: 'text-box', required: true, title: "#{title_label} First Name", autocomplete: 'given-name'
+          - if address.errors[:first_name].present?
+            %span.value__error= address.errors[:first_name].first
+
+    .grid__cell.grid__cell--50-at-medium
+      .property
+        = label_tag "#{label}[last_name]", nil, class: 'property__name' do
+          %span.property__text= t('workarea.storefront.addresses.last_name')
+        .value
+          = text_field_tag "#{label}[last_name]", address.last_name, class: 'text-box', required: true, autocomplete: 'family-name', title: "#{title_label} Last Name"
+          - if address.errors[:last_name].present?
+            %span.value__error= address.errors[:last_name].first
+
+    .grid__cell
+      = optional_field(t('workarea.storefront.addresses.company_prompt'), address.company) do
+        .property
+          = label_tag "#{label}[company]", nil, class: 'property__name' do
+            %span.property__text= t('workarea.storefront.addresses.company')
+            %span.property__requirement.property__requirement--optional= t('workarea.storefront.forms.optional')
+          .value= text_field_tag "#{label}[company]", address.company, class: 'text-box', title: "#{title_label} #{t('workarea.storefront.addresses.company')}", autocomplete: 'organization'
+
+    .grid__cell
+      .property
+        = label_tag "#{label}[street]", nil, class: 'property__name' do
+          %span.property__requirement.property__requirement--required= t('workarea.storefront.forms.required')
+          %span.property__text= t('workarea.storefront.addresses.street')
+        .value
+          = text_field_tag "#{label}[street]", address.street, class: 'text-box', required: true, autocomplete: 'address-line1', title: "#{title_label} Street Line 1"
+          - if address.errors[:street].present?
+            %span.value__error= address.errors[:street].first
+          - unless address.allow_po_box?
+            %span.value__note= t('workarea.storefront.addresses.no_po_boxes')
+
+    .grid__cell
+      .property
+        = label_tag "#{label}[street_2]", nil, class: 'property__name' do
+          %span.property__text= t('workarea.storefront.addresses.street_2')
+          %span.property__requirement.property__requirement--optional= t('workarea.storefront.forms.optional')
+        .value
+          = text_field_tag "#{label}[street_2]", address.street_2, class: 'text-box', autocomplete: 'address-line2', title: "#{title_label} Street Line 2"
+          - if address.errors[:street_2].present?
+            %span.value__error= address.errors[:street_2].first
+
+    .grid__cell
+      .property{ data: { address_region_fields: 'country' } }
+        = label_tag "#{label}[country]", nil, class: 'property__name' do
+          %span.property__requirement.property__requirement--required= t('workarea.storefront.forms.required')
+          %span.property__text= t('workarea.storefront.addresses.country')
+        .value
+          - options = options_for_select(country_options, address.country.try(:alpha2))
+          = select_tag "#{label}[country]", options, title: "#{title_label} Country"
+          - if address.errors[:country].present?
+            %span.value__error= address.errors[:country].first
+
+    .grid__cell.grid__cell--33-at-medium
+      .property
+        = label_tag "#{label}[city]", nil, class: 'property__name' do
+          %span.property__requirement.property__requirement--required= t('workarea.storefront.forms.required')
+          %span.property__text= t('workarea.storefront.addresses.city')
+        .value
+          = text_field_tag "#{label}[city]", address.city, class: 'text-box', required: true, autocomplete: 'address-level2', title: "#{title_label} City"
+          - if address.errors[:city].present?
+            %span.value__error= address.errors[:city].first
+
+    .grid__cell.grid__cell--33-at-medium
+      .property{ data: { address_region_fields: 'region' } }
+        = label_tag "#{label}[region]", nil, class: 'property__name' do
+          %span.property__requirement.property__requirement--required= t('workarea.storefront.forms.required')
+          %span.property__text= t('workarea.storefront.addresses.region')
+        .value
+          - options = grouped_options_for_select(region_options, address.region)
+          = select_tag "#{label}_region_select", options, required: true, title: "#{title_label} Region", class: 'hidden', prompt: t('workarea.storefront.addresses.select_state'), aria: { label: "#{title_label} #{t('workarea.storefront.addresses.region')}"}
+          = text_field_tag "#{label}[region]", address.region, class: 'text-box', title: "#{title_label} Region"
+          - if address.errors[:region].present?
+            %span.value__error= address.errors[:region].first
+
+    .grid__cell.grid__cell--33-at-medium
+      .property
+        = label_tag "#{label}[postal_code]", nil, class: 'property__name' do
+          %span.property__requirement.property__requirement--required= t('workarea.storefront.forms.required')
+          %span.property__text= t('workarea.storefront.addresses.postal_code')
+        .value
+          = text_field_tag "#{label}[postal_code]", address.postal_code, class: 'text-box', required: true, autocomplete: 'postal-code', title: "#{title_label} Postal Code"
+          - if address.errors[:postal_code].present?
+            %span.value__error= address.errors[:postal_code].first
+
+    .grid__cell
+      .grid.grid--auto.grid--bottom
+        .grid__cell
+          .property
+            = label_tag "#{label}[phone_number]", nil, class: 'property__name' do
+              %span.property__text= t('workarea.storefront.addresses.phone_number')
+              %span.property__requirement.property__requirement--optional= t('workarea.storefront.forms.optional')
+            .value= telephone_field_tag "#{label}[phone_number]", number_to_phone(address.phone_number), autocomplete: 'tel', class: 'text-box', placeholder: '555-555-5555', title: "#{title_label} #{t('workarea.storefront.addresses.phone_number')}", pattern: '[0-9-]+'
+        .grid__cell
+          .property
+            .grid.grid--auto.grid--middle
+              .grid__cell
+                = label_tag "#{label}[phone_extension]", nil, class: 'property__name' do
+                  %span.property__text= t('workarea.storefront.addresses.phone_extension')
+                .value= telephone_field_tag "#{label}[phone_extension]", address.phone_extension, autocomplete: 'tel-extension', class: 'text-box text-box--x-small', title: "#{title_label} #{t('workarea.storefront.addresses.phone_extension')}", pattern: '\d+'