zz-shopify-components 0.3.1-beta.3 → 0.3.1-beta.4

package/assets/zz-components.css

@@ -4,7 +4,7 @@
   align-items: center;
   height: 36px;
   border-radius: 32px;
-  background: #FFFFFF;
+  background: #F5F5F6;
 }
 
 .zz-radio-tabs-black.zz-radio-tabs {
@@ -125,10 +125,12 @@ zz-radio-tabs-item {
 }
 .content-text ol {
   list-style: decimal;
+  padding-left: 20px;
 }
 
 .content-text ul {
   list-style: disc;
+  padding-left: 20px;
 }
 
 /* 标题 */

package/assets/zz-components.js

@@ -7,13 +7,13 @@ class ZZRadioTabsItem extends HTMLElement {
     // 创建radio input
     const groupName =
       this.closest('zz-radio-tabs')?.getAttribute('name') || 'option';
-    const type =
-      this.closest('zz-radio-tabs')?.getAttribute('type') || 'default';
+    // 获取checked属性 - 支持checked和checked="true"两种方式
+    const checked = this.hasAttribute('checked');
     const value = this.getAttribute('value') || '';
     const slot = this.innerHTML;
     this.innerHTML = `
       <label class="zz-radio-tabs-wrapper">
-        <input type="radio" name=${groupName} value=${value}>
+        <input type="radio" name=${groupName} value=${value} ${checked ? 'checked' : ''}>
         <div class="zz-radio-tabs-label">
             ${slot}
         </div>

package/assets/zz-http-request.js

@@ -50,6 +50,30 @@
     }
   }
 
+  function requestFormData(method, url, formData, options = {}) {
+    const baseUrl = options.baseUrl || DEFAULT_BASE_URL;
+    const timeout = options.timeout || DEFAULT_TIMEOUT;
+    const fullUrl = baseUrl + url;
+
+    let fetchOptions = {
+      method: method.toUpperCase(),
+      headers: {
+        // 不设置Content-Type，让浏览器自动设置multipart/form-data
+        ...(options.headers || {}),
+      },
+      ...options,
+    };
+
+    // 移除可能存在的Content-Type，让浏览器自动处理FormData
+    delete fetchOptions.headers['Content-Type'];
+
+    fetchOptions.body = formData;
+
+    return timeoutFetch(fetch(fullUrl, fetchOptions), timeout).then(
+      handleResponse
+    );
+  }
+
   function handleResponse(response) {
     if (!response.ok) {
       if (response.status === 401) {
@@ -69,5 +93,8 @@
     post: function (url, params = {}, options = {}) {
       return request('post', url, params, options);
     },
+    formData: function (url, formData, options = {}) {
+      return requestFormData('post', url, formData, options);
+    },
   };
 })();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zz-shopify-components",
-  "version": "0.3.1-beta.3",
+  "version": "0.3.1-beta.4",
   "description": "Reusable Shopify components for theme projects",
   "keywords": [
     "shopify",

package/sections/zz-flex-layout-section.liquid

@@ -184,6 +184,11 @@
       "label": "模块id",
       "info": "用于定位到本模块"
     },
+    {
+      "type": "text",
+      "id": "module_id",
+      "label": "唯一id",
+    },
   ],
   "blocks": [
     {
@@ -262,7 +267,7 @@
   }
 </style>
 
-<div 
+<div id="{{ section.settings.module_id }}"
   class="responsive-section-layout {{ section.settings.animation }}" 
   {% if section.settings.module_name != blank %}data-zz-module-name="{{ section.settings.module_name }}"{% endif %}>
     {% content_for 'blocks' %}