`data/theme-preimage/145556635699/snippets/product-list-item.liquid`

277 lines
{% comment %}
  @param product_attributes
    custom attributes to be applied to the product item
    Defaults to: blank
{% endcomment %}

{%- comment %} TK-11186 render-time showroom-vendor skip: emit NO card HTML for a showroom-only
  vendor (addressable-not-discoverable). List sourced from shop metafield / theme setting /
  canonical showroom-vendors.json fallback — never a hardcoded vendor. {% endcomment -%}
{%- liquid
  assign showroom_raw = shop.metafields.custom.showroom_vendors
  if showroom_raw == blank
    assign showroom_raw = settings.showroom_vendors
  endif
  if showroom_raw == blank
    assign showroom_raw = 'Phillip Jeffries'
  endif
  assign showroom_vendors = showroom_raw | split: ','
  assign this_vendor = product.vendor | strip | downcase
  assign is_showroom_vendor = false
  for sv in showroom_vendors
    assign svn = sv | strip | downcase
    if svn != blank and svn == this_vendor
      assign is_showroom_vendor = true
    endif
  endfor
  # TK-11307: product-level 'Showroom' TAG is an ADDITIONAL, shared-vendor-safe key.
  # A showroom line under a SHARED private label (MDC under 'Phillipe Romano', which also
  # carries sellable lines) is suppressed by its own tag WITHOUT hiding the vendor. The
  # tag applier stamps 'Showroom' on exactly the showroom products; sellable siblings keep
  # rendering. Case-insensitive: check both 'Showroom' and 'showroom'.
  if product.tags contains 'Showroom' or product.tags contains 'showroom'
    assign is_showroom_vendor = true
  endif
-%}
{%- unless is_showroom_vendor -%}

{% liquid
  assign product_attributes = product_attributes | default: ''
  assign product_hover = settings.product_hover |  default: 'quick-shop'
  assign product_stock_level_threshold = settings.product_stock_level_threshold | default: 1
  assign product_badges = settings.product_badges | default: false
  assign product_icons = settings.product_badges_icons | default: false
  assign product_vendor = settings.show_vendor | default: false

  assign item = product
  if template contains 'search'
    assign item = item
  endif

  assign has_quick_shop = false
  if product_hover == 'quick-shop' and template.name != 'password' and product.variants_count <= 250 and product.vendor != 'Newmor Wallcoverings'
    assign has_quick_shop = true
  endif
%}

{% if product_hover == 'stock-level' and item.available %}
  {% assign total = 0 %}
  {% assign threshold = product_stock_level_threshold | times: 1 %}
  {% assign infinity = false %}
  {% for variant in item.variants %}
    {% if variant.inventory_management == null %}
      {% assign infinity = true %}
    {% elsif variant.inventory_management == '' %}
      {% assign infinity = true %}
    {% elsif variant.inventory_management == 'shopify' and variant.inventory_policy == 'continue' %}
      {% assign infinity = true %}
    {% elsif infinity == false %}
      {% capture temp %}{{ total | plus: variant.inventory_quantity }}{% endcapture %}
      {% assign total = temp | times: 1 %}
    {% endif %}
  {% endfor %}
  {% assign stockText = 'products.product.stock_indicator_message' | t: num: total %}
{% endif %}

<article
  class="
    product-list-item
    {% if has_quick_shop %} has-quick-shop{% endif %}
    {% if item.available and infinity == false and total <= threshold %} has-stock-indicator{%endif %}
  "
  id="product-list-item-{{ item.id }}"
  data-product-id="{{ item.id }}"
  {{ product_attributes }}
>

  {% assign secondaryImage = false %}
  {% if item.media.size > 1 and product_hover == 'image-flip' %}
    {% assign secondaryImage = true %}
  {% endif %}

  <figure
    class="
      product-list-item-thumbnail
      {% if secondaryImage %}
        has-secondary-image
      {% endif %}
    "
    data-url="{{ item.url | within: collection }}"
    {% if secondaryImage %}
      {%
        render 'rimg',
        img: item.media[1].preview_image,
        alt: item.media[1].preview_image.alt,
        size: '600x600',
        background: true,
        lazy: true
      %}
    {% endif %}
  >
    <a href="{{ item.url | within: collection }}" aria-label="{{ item.title }}">
      {% if item.featured_media.preview_image %}
        {%
          render 'rimg',
          img: item.featured_media.preview_image,
          alt: item.featured_media.preview_image.alt,
          size: '600x600',
          lazy: true
        %}
      {% else %}
        {{ 'product-1' | placeholder_svg_tag: 'placeholder-svg' }}
      {% endif %}

      <div class="product-info">
        <div class="vertical-center">
          <div>View Pattern</div>
          {%- liquid
            assign sku_raw = item.variants.last.sku | default: ''
            assign sku_display = sku_raw | replace: '-Sample', '' | replace: '-SAMPLE', '' | replace: '-sample', ''
            assign sku_display = sku_display | replace: '--', '-' | replace: '--', '-'
            assign sku_last_char = sku_display | slice: -1, 1
            if sku_display != blank and sku_last_char == '-'
              assign sku_display = sku_display | remove_last: '-'
            endif
          -%}
          <div>{{ sku_display }}</div>
        </div>
      </div>
      
    </a>

    {% if has_quick_shop %}
      <span
        class="quick-shop-modal-trigger"
        data-product-url="{{ item.url | within: collection }}"
      >
        {{ 'products.product.quick_shop_trigger_text' | t }}
      </span>
    {% elsif product_hover == 'stock-level' %}

      {% if item.available and infinity == false and total <= threshold %}
        <a class="product-list-item-inventory" href="{{ item.url }}">{{ stockText }}</a>
      {% endif %}

    {% endif %}

    {% if product_badges %}
      {% if item.available != true %}
        <span class="product-list-item-unavailable{% if product_icons %} product-icons{% endif %}" data-title="{{ 'products.product.sold_out' | t }}"></span>
      {% elsif item.compare_at_price_min > item.price_min %}
        <span class="product-list-item-on-sale{% if product_icons %} product-icons{% endif %}" data-title="{{ 'products.product.on_sale' | t }}"></span>
      {% endif %}
    {% endif %}
  </figure>

  <div class="product-list-item-details">
    {% if product_vendor %}
      <p class="product-list-item-vendor">{{ item.vendor | link_to_vendor }}</p>
    {% endif %}
    <h2 class="product-list-item-title"><a href="{{ item.url | within: collection }}">{{ item.title }}</a></h2>

    {%- comment -%}
      DW grid-card color swatch (Carnegie-restructure fix, TK-10686).
      Additive: renders ONLY when a valid hex metafield exists, so non-Carnegie
      cards are unaffected. Reads hex + name across the lowercase, space-cased,
      and swatch_hex key variants so the Carnegie Xorel restructure is covered.
      Pure Liquid, fixed dimensions (no CLS), no shared DOM ids (grid-safe).
    {%- endcomment -%}
    {%- liquid
      assign dw_hex = item.metafields.custom.color_hex.value | default: item.metafields.custom['Color Hex'].value | default: item.metafields.custom.swatch_hex.value | default: item.metafields.custom.primary_color_hex.value
      assign dw_color_name = item.metafields.custom.color_name.value | default: item.metafields.custom.color.value | default: item.metafields.custom['Color'].value | default: item.metafields.global['Color'].value
      assign dw_hex_body = dw_hex | strip | remove_first: '#'
      assign dw_hex_len = dw_hex_body | size
      assign dw_hex_ok = false
      if dw_hex_len == 6
        assign dw_hex_ok = true
      elsif dw_hex_len == 3
        assign dw_hex_ok = true
      endif
    -%}
    {%- if dw_hex_ok -%}
      <p class="product-list-item-swatch" style="display:flex;align-items:center;gap:8px;margin:4px 0 2px;line-height:1;">
        <span class="product-list-item-swatch-dot" aria-hidden="true" style="display:inline-block;width:16px;height:16px;min-width:16px;border-radius:50%;background:#{{ dw_hex_body | escape }};border:1px solid rgba(0,0,0,0.15);box-shadow:0 1px 2px rgba(0,0,0,0.08);flex:0 0 auto;"></span>
        {%- if dw_color_name != blank -%}
          <span class="product-list-item-swatch-name" style="font-size:0.82em;color:#555;">{{ dw_color_name | escape }}</span>
        {%- endif -%}
      </p>
    {%- endif -%}

    {%- comment -%} TK-11925: liquid-rendered card path for the contact-us cohort
      (Designers Guild / Ralph Lauren / Christian Lacroix Europe). Keyed on the product's
      TEMPLATE SUFFIX, not a vendor literal, so the card follows whatever set
      scripts/assign-template.mjs has stamped — no second list to keep in sync.
      Boost-rendered grids are handled by assets/dw-contact-us-cards.js. {%- endcomment -%}
    {% if item.template_suffix == 'contact-us' %}
    <p class="product-list-item-price dw-cu-card-price" data-dw-contact-us-price>Contact us for pricing</p>
    {% elsif item.vendor == 'Newmor Wallcoverings' %}
    <p class="product-list-item-price" data-newmor-showroom>Showroom inquiry</p>
    {% else %}
    <p class="product-list-item-price">
      {% if item.price_varies %}
        {% if item.price_varies %}{{ 'products.product.from' | t }}{% endif %}
        {% if item.compare_at_price_min > item.price_min %}
          <span class="money">{{ item.price_min | money }}</span>
          <span class="original money">{{ item.compare_at_price_min | money }}</span>
        {% else %}
          <span class="money">{{ item.price_min | money }}</span>
        {% endif %}
      {% else %}
        {% if item.compare_at_price_min > item.price_min %}
          <span class="money">{{ item.price_min | money }}</span>
          <span class="original money">{{ item.compare_at_price_min | money }}</span>
        {% else %}
          <span class="money">{{ item.price_min | money }}</span>
        {% endif %}
      {% endif %}
    </p>
    {% assign variant_for_unit_price = item.variants | sort: 'price' | first %}
    {% if variant_for_unit_price.unit_price %}
      {% comment %}Inject unit-price begin{% endcomment %}
      {% comment %}
        @param variant_for_unit_price
          Product variant for price
        @param tax_text
          String containing 'tax included' text
      {% endcomment %}
      
      {% capture total_quantity %}
        <span class="product-price__unit-price-total-quantity" data-unit-price-quantity>
          {{ variant_for_unit_price.unit_price_measurement.quantity_value }}{{ variant_for_unit_price.unit_price_measurement.quantity_unit }}
        </span>
      {% endcapture %}
      
      
      {% capture unit_price %}
        <span class="product-price__unit-price-amount money" data-unit-price-amount>
          {{ variant_for_unit_price.unit_price | money }}
        </span>
      {% endcapture %}
      {% capture unit_measure %}
        <span class="product-price__unit-price-measure" data-unit-price-measure>
          {%- if variant_for_unit_price.unit_price_measurement.reference_value != 1 -%}
            {{ variant_for_unit_price.unit_price_measurement.reference_value }}
          {%- endif %}
          {{ variant_for_unit_price.unit_price_measurement.reference_unit }}
        </span>
      {% endcapture %}
      
      <div
        class="
          product-price__unit-price
          {% unless variant_for_unit_price.unit_price_measurement %}hidden{% endunless %}
        "
        data-unit-price
      >
        {{ 'products.product.price_per_unit_html' | t: total_quantity: total_quantity, unit_price: unit_price, unit_measure: unit_measure | strip_newlines }}
      </div>
      
      {% assign variant_for_unit_price = blank %}
      {% comment %}Inject unit-price end{% endcomment %}

    {% endif %}
    {% endif %}
  </div>

</article>{%- endunless -%}