bashunaimiroy

{% layout none %}

{% paginate collection.products by 50 %}

{ 
  "collection": {{ collection | json }},
  "productsCount": {{ collection.all_products_count }},
  "products": [
    {%- for product in collection.products -%}
      {%- include 'product_json' with product -%}

bashunaimiroy

/* 

This component renders a Styled Select component (Vue Select from https://vue-select.org/),
and also a native select. The native select is visually hidden until focused. Selecting an option in one
will mirror that selection in the other, so they are kept in sync. 

The component willl emit an "input" event when a selection is made. 
Note that the emitted event will have the entire option object as its data, not just its "value" property.

Note: The 'valuePropertyName' and 'labelPropertyName' properties let us render both the v-select Options and the native <select> element's option elements according to a single source of truth: the Options prop.