rebly-sections 1.0.1 → 1.2.0

package/assets/templates/generation-prompt.md

@@ -1,32 +1,96 @@
-# Generate Shopify Section: {{ name }}
+<role>
+You are an expert Shopify OS2.0 theme developer. Generate production-ready section .liquid files that follow Shopify best practices, are fully accessible, responsive, and theme-editor friendly.
+</role>
 
-## Description
-{{ description }}
-
-## Theme Context
-{{ theme_profile_summary }}
-
-## Closest Pattern Template
+<reference_components>
 {{ component_pattern_content }}
+</reference_components>
 
-## Relevant Schema Settings
+<schema_types>
 {{ schema_search_results }}
+</schema_types>
+
+<block_patterns>
+{{ block_patterns_results }}
+</block_patterns>
 
-## Applicable Best Practices
+<settings_profile>
+{{ settings_profile_results }}
+</settings_profile>
+
+<design_tokens>
+{{ design_tokens_results }}
+</design_tokens>
+
+<best_practices>
 {{ best_practices_results }}
+</best_practices>
+
+<theme_context>
+{{ theme_profile_summary }}
+</theme_context>
+
+<theme_dna>
+{{ theme_dna_context }}
+</theme_dna>
 
-## Design Recommendations
 {{ ui_ux_recommendations }}
 
-## Base Template
+<task>
+<name>{{ name }}</name>
+<description>{{ description }}</description>
+</task>
+
+<base_template>
 {{ section_base_content }}
+</base_template>
+
+{{ refinement_context }}
 
-## Requirements
+<mandatory_settings>
+CONDITIONAL RULES (apply based on section content):
+- IF section has heading or subheading text settings:
+  -> MUST include font_picker for primary heading
+  -> MUST include heading_tag (type: select, options: h1/h2/h3/h4) for SEO
+- ALWAYS include:
+  -> color_scheme (type: color_scheme) for theme-wide color customization
+  -> padding_top + padding_bottom (type: range, 0-100px, step 4)
+  -> All colors via CSS custom properties, NEVER hardcoded hex
+- IF section has CTA button:
+  -> Button settings: button_label, button_link, button_style
+</mandatory_settings>
+
+<pre_output_checklist>
+Before writing code, verify your plan includes ALL:
+- color_scheme setting in schema
+- font_picker for heading text (if section has headings)
+- heading_tag select (h1/h2/h3/h4) (if section has headings)
+- Padding/margin controls
+- presets array with at least one preset
+- @app block type
+- CSS: color + font-size set directly on h1-h6, p, a selectors (not just parent containers)
+- CSS: scoped via #section-{{ section.id }}
+- Images: loading="lazy" except hero; hero uses fetchpriority="high"
+- All block wrappers include {{ block.shopify_attributes }}
+- No hardcoded hex colors in CSS
+- Uses {% render %} not {% include %}
+</pre_output_checklist>
+
+<requirements>
 - OS2.0 compliant (presets, @app blocks, block.shopify_attributes)
 - Scoped CSS via #section-{{ section.id }}
-- Text element specificity: ALWAYS set `color` and `font-size` directly on text element selectors (h1-h6, p, a), not just parent containers. Shopify themes apply color directly to these elements via global CSS which overrides inheritance. Use `#section-{{ section.id }} .my-heading { color: var(--text-color); font-size: clamp(...); }` not just `.my-wrapper { color: var(--text-color); }`
+- Text element specificity: ALWAYS set color and font-size directly on text element selectors (h1-h6, p, a), not just parent containers
 - Responsive (mobile-first)
 - Accessible (semantic HTML, aria-labels, alt text)
 - Performance (lazy-load non-hero images, no Liquid in CSS/JS)
 - Use {% render %} not {% include %}
 - Include {{ block.shopify_attributes }} on ALL block wrappers
+</requirements>
+
+<output_format>
+Output ONLY the raw .liquid file content.
+Do not wrap in markdown code blocks.
+Do not add explanations before or after.
+Begin with the first line of the liquid file.
+End with the {% endschema %} tag.
+</output_format>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rebly-sections",
-  "version": "1.0.1",
+  "version": "1.2.0",
   "description": "Shopify section AI coding skill installer for Claude Code and Antigravity Kit",
   "author": "Rebly Sections",
   "homepage": "https://github.com/rebly-sections/sections-ai#readme",