zz-shopify-components 0.24.1-beta.1 → 0.24.1-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "zz-shopify-components",
3
- "version": "0.24.1-beta.1",
3
+ "version": "0.24.1-beta.2",
4
4
  "description": "Reusable Shopify components for theme projects",
5
5
  "keywords": [
6
6
  "shopify",
@@ -2,7 +2,7 @@
2
2
  <div class='product-container tw-flex tw-items-center tw-justify-center'>
3
3
  {% comment %} 左侧产品预览 {% endcomment %}
4
4
  <div
5
- class='product-preview lg:tw-w-[760px] tw-w-full tw-aspect-square'
5
+ class='product-preview tw-w-full tw-aspect-square md:tw-aspect-[16/9]'
6
6
  data-test-locator='productPreview'
7
7
  >
8
8
  <div
@@ -1,8 +1,13 @@
1
1
  <zz-product-swiper class=' tw-w-full product-swiper-container tw-h-full tw-relative'>
2
2
  <div class='swiper product-swiper-list tw-w-full tw-h-full tw-relative'>
3
3
  <div class='swiper-wrapper'>
4
- {% for image in product.selected_or_first_available_variant.metafields.custom.images.value %}
4
+ {% assign product_images = product.selected_or_first_available_variant.metafields.custom.images.value | default: product.images %}
5
+ {% for image in product_images %}
5
6
  <div class='swiper-slide tw-flex tw-justify-center'>
7
+ {% assign fetchpriority = 'auto' %}
8
+ {% if forloop.first %}
9
+ {% assign fetchpriority = 'high' %}
10
+ {% endif %}
6
11
  {{
7
12
  image
8
13
  | image_url: width: 3000
@@ -10,7 +15,8 @@
10
15
  loading: 'lazy',
11
16
  class: 'tw-w-auto tw-h-full tw-max-w-full tw-object-cover tw-m-auto',
12
17
  sizes: '(min-width: 750px) 700px, calc(100vw - 30px)',
13
- widths: '3000, 4000, 5000'
18
+ widths: '3000, 4000, 5000',
19
+ fetchpriority: fetchpriority
14
20
  }}
15
21
  </div>
16
22
  {% endfor %}
@@ -27,7 +33,7 @@
27
33
  <div class=' tw-absolute tw-bottom-[20px] tw-left-1/2 tw-transform tw-translate-x-[-50%] tw-z-10 tw-w-[80%] '>
28
34
  <div class='swiper product-swiper-list-thumbs tw-opacity-0'>
29
35
  <div class='swiper-wrapper tw-flex tw-justify-center'>
30
- {% for image in product.selected_or_first_available_variant.metafields.custom.images.value %}
36
+ {% for image in product_images %}
31
37
  <div class='swiper-slide !tw-w-auto tw-opacity-30'>
32
38
  {{
33
39
  image