[{"data":1,"prerenderedAt":54},["ShallowReactive",2],{"\u002Fapi\u002Fpage\u002Fskills\u002Fsumi-shopify\u002Fshopify-storefront-js":3,"PageBody_7lNKKex8w1YLQDhkehAwvxWo3ASLOdyz8S1WLkmwgs":46},{"title":4,"description":5,"plugin":6,"kind":7,"references":8,"source":9,"heading":10,"toc":11,"locale":45},"shopify-storefront-js","Storefront JavaScript for Shopify themes - vanilla JS and Web Components, progressive enhancement over Liquid forms, Section Rendering API, Cart AJAX API (add, change, update, bundled section rendering for cart drawer and counters), predictive search, variant selection with URL and media sync, theme editor events, debouncing and race handling, aria-live announcements, and loading scripts without blocking. Use when writing or reviewing assets\u002F*.js, src\u002F**\u002F*.{js,ts}, custom elements, cart drawer, quick add, quantity steppers, facets\u002Ffilters, predictive search, variant pickers, or when a section must refresh without a full page load.","sumi-shopify","skill",1,"plugins\u002Fsumi-shopify\u002Fskills\u002Fshopify-storefront-js\u002FSKILL.md","Shopify Storefront JavaScript",[12,15,18,21,24,27,30,33,36,39,42],{"id":13,"text":14},"principles","Principles",{"id":16,"text":17},"web-component-pattern","Web Component pattern",{"id":19,"text":20},"section-rendering-api","Section Rendering API",{"id":22,"text":23},"cart-ajax-api","Cart AJAX API",{"id":25,"text":26},"variant-selection","Variant selection",{"id":28,"text":29},"predictive-search","Predictive search",{"id":31,"text":32},"async-correctness","Async correctness",{"id":34,"text":35},"theme-editor-support","Theme editor support",{"id":37,"text":38},"ai-slop-tells","AI slop tells",{"id":40,"text":41},"done-checklist","Done checklist",{"id":43,"text":44},"storefront-ajax-apis-patterns","Storefront AJAX APIs: Patterns","en",["Island",47],{"key":48,"result":49},"PageBody_7lNKKex8w1YLQDhkehAwvxWo3ASLOdyz8S1WLkmwgs",{"head":50},{"style":51},[52],{"innerHTML":53},".prose[data-v-1545ba8e]{max-width:var(--measure-prose)}.prose[data-v-1545ba8e] h2{margin-block:var(--space-8) var(--space-4)}.prose[data-v-1545ba8e] h3{margin-block:var(--space-6) var(--space-3)}.prose[data-v-1545ba8e] h4{margin-block:var(--space-5) var(--space-3);font-family:var(--font-mono);font-variation-settings:\"wdth\" var(--mono-width-label);font-size:var(--text-small);text-transform:uppercase;letter-spacing:var(--text-label-ls);color:var(--color-text-muted)}.prose[data-v-1545ba8e] ol,.prose[data-v-1545ba8e] p,.prose[data-v-1545ba8e] ul{margin-block-end:var(--space-4)}.prose[data-v-1545ba8e] li{margin-block-end:var(--space-2)}.prose[data-v-1545ba8e] ol,.prose[data-v-1545ba8e] ul{padding-inline-start:var(--space-5)}.prose[data-v-1545ba8e] li:has(.task-box){list-style:none}.prose[data-v-1545ba8e] .task-box{width:.8em;height:.8em;border:var(--border-width) solid var(--color-border);vertical-align:baseline;margin-inline-end:var(--space-2);display:inline-block}.prose[data-v-1545ba8e] code{padding:1px var(--space-1);background:var(--color-surface-sunk);border:var(--border-width) solid var(--color-border)}.prose[data-v-1545ba8e] pre{padding:var(--space-4);background:var(--color-surface-sunk);border:var(--border-width) solid var(--color-border);margin-block-end:var(--space-5);overflow-x:auto}.prose[data-v-1545ba8e] pre code{background:0 0;border:0;padding:0}.prose[data-v-1545ba8e] .table-scroll{max-width:none;margin-block-end:var(--space-5);overflow-x:auto}.prose[data-v-1545ba8e] table{border-collapse:collapse;width:100%;min-width:32rem;font-size:var(--text-small);line-height:var(--text-small-lh)}.prose[data-v-1545ba8e] td,.prose[data-v-1545ba8e] th{padding:var(--space-3) var(--space-4);text-align:start;vertical-align:top;border-block-start:var(--divider-width) solid var(--color-divider)}.prose[data-v-1545ba8e] th{font-family:var(--font-mono);font-variation-settings:\"wdth\" var(--mono-width-label);font-size:var(--text-label);letter-spacing:var(--text-label-ls);text-transform:uppercase;color:var(--color-text-muted);border-block-end:var(--border-width) solid var(--color-border)}.prose[data-v-1545ba8e] blockquote{margin:0 0 var(--space-5);border-inline-start:var(--seam-width) solid var(--color-seam);color:var(--color-text-muted);padding-inline-start:var(--space-4)}.prose[data-v-1545ba8e] hr{margin-block:var(--space-7);border:0;border-block-start:var(--divider-width) solid var(--color-divider)}.prose[data-v-1545ba8e] pre,.prose[data-v-1545ba8e] table{max-width:none}",1791464219345]