rook-cli 1.3.2 → 1.3.4

package/rook-framework/blocks/rk-form-field.liquid

@@ -0,0 +1,120 @@
+{% comment %}
+  Block: RK Form Field
+  Renders a rk-form-field with label, input and error slot.
+  Uses rk-spacing-style for Horizon-compatible spacing.
+{% endcomment %}
+
+<rk-form-field-block
+  id="block-{{ block.id }}"
+  {{ block.shopify_attributes }}
+  class="rk-block rk-spacing-style"
+  style="
+    {% render 'rk-spacing-style', settings: block.settings %}
+  "
+>
+  {% render 'rk-form-field',
+    name: block.settings.name,
+    label: block.settings.label,
+    type: block.settings.type,
+    placeholder: block.settings.placeholder,
+    required: block.settings.required
+  %}
+</rk-form-field-block>
+
+{% schema %}
+{
+  "name": "RK | Campo de Formulário",
+  "tag": null,
+  "settings": [
+    {
+      "type": "text",
+      "id": "label",
+      "label": "Label",
+      "default": "Nome"
+    },
+    {
+      "type": "text",
+      "id": "name",
+      "label": "Nome do campo (name)",
+      "default": "name",
+      "info": "Identificador único do campo no formulário"
+    },
+    {
+      "type": "select",
+      "id": "type",
+      "label": "Tipo do input",
+      "options": [
+        { "value": "text", "label": "Texto" },
+        { "value": "email", "label": "E-mail" },
+        { "value": "password", "label": "Senha" },
+        { "value": "tel", "label": "Telefone" },
+        { "value": "number", "label": "Número" },
+        { "value": "url", "label": "URL" }
+      ],
+      "default": "text"
+    },
+    {
+      "type": "text",
+      "id": "placeholder",
+      "label": "Placeholder",
+      "default": "Digite aqui..."
+    },
+    {
+      "type": "checkbox",
+      "id": "required",
+      "label": "Campo obrigatório",
+      "default": false
+    },
+    {
+      "type": "header",
+      "content": "Espaçamento"
+    },
+    {
+      "type": "range",
+      "id": "padding-block-start",
+      "label": "Topo",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-block-end",
+      "label": "Base",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-inline-start",
+      "label": "Esquerda",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-inline-end",
+      "label": "Direita",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    }
+  ],
+  "presets": [
+    {
+      "name": "RK | Campo de Formulário",
+      "category": "Rook UI"
+    }
+  ]
+}
+{% endschema %}

package/rook-framework/blocks/rk-icon.liquid

@@ -0,0 +1,134 @@
+{% comment %}
+  Block: RK Icon
+  Renders a rk-icon standalone block.
+  Uses rk-spacing-style for Horizon-compatible spacing.
+{% endcomment %}
+
+<rk-icon-block
+  id="block-{{ block.id }}"
+  {{ block.shopify_attributes }}
+  class="rk-block rk-spacing-style"
+  style="
+    {% render 'rk-spacing-style', settings: block.settings %}
+    {% if block.settings.alignment == 'center' %}text-align: center;{% elsif block.settings.alignment == 'right' %}text-align: right;{% endif %}
+  "
+>
+  {% render 'rk-icon',
+    icon: block.settings.icon,
+    size: block.settings.size,
+    color: block.settings.color
+  %}
+</rk-icon-block>
+
+{% schema %}
+{
+  "name": "RK | Ícone",
+  "tag": null,
+  "settings": [
+    {
+      "type": "select",
+      "id": "icon",
+      "label": "Ícone",
+      "options": [
+        { "value": "heart", "label": "Coração" },
+        { "value": "star", "label": "Estrela" },
+        { "value": "truck", "label": "Caminhão" },
+        { "value": "lock", "label": "Cadeado" },
+        { "value": "return", "label": "Devolução" },
+        { "value": "chat_bubble", "label": "Chat" },
+        { "value": "fire", "label": "Fogo" },
+        { "value": "lightning_bolt", "label": "Raio" },
+        { "value": "leaf", "label": "Folha" },
+        { "value": "plant", "label": "Planta" },
+        { "value": "recycle", "label": "Reciclável" },
+        { "value": "snowflake", "label": "Floco de neve" },
+        { "value": "map_pin", "label": "Pin de mapa" },
+        { "value": "eye", "label": "Olho" },
+        { "value": "ruler", "label": "Régua" },
+        { "value": "price_tag", "label": "Etiqueta de preço" },
+        { "value": "question_mark", "label": "Interrogação" },
+        { "value": "error", "label": "Erro" },
+        { "value": "check_box", "label": "Checkbox" },
+        { "value": "clipboard", "label": "Clipboard" },
+        { "value": "plane", "label": "Avião" },
+        { "value": "stopwatch", "label": "Cronômetro" },
+        { "value": "silhouette", "label": "Perfil" }
+      ],
+      "default": "heart"
+    },
+    {
+      "type": "select",
+      "id": "size",
+      "label": "Tamanho",
+      "options": [
+        { "value": "sm", "label": "Pequeno (16px)" },
+        { "value": "md", "label": "Médio (20px)" },
+        { "value": "lg", "label": "Grande (24px)" },
+        { "value": "xl", "label": "Extra Grande (32px)" }
+      ],
+      "default": "md"
+    },
+    {
+      "type": "color",
+      "id": "color",
+      "label": "Cor"
+    },
+    {
+      "type": "text_alignment",
+      "id": "alignment",
+      "label": "Alinhamento",
+      "default": "left"
+    },
+    {
+      "type": "header",
+      "content": "Espaçamento"
+    },
+    {
+      "type": "range",
+      "id": "padding-block-start",
+      "label": "Topo",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-block-end",
+      "label": "Base",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-inline-start",
+      "label": "Esquerda",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-inline-end",
+      "label": "Direita",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    }
+  ],
+  "presets": [
+    {
+      "name": "RK | Ícone",
+      "category": "Rook UI"
+    }
+  ]
+}
+{% endschema %}

package/rook-framework/blocks/rk-image.liquid

@@ -0,0 +1,198 @@
+{% comment %}
+  Block: RK Image
+  Renders a rk-image with image picker and customizer controls.
+  Uses rk-size-style and rk-spacing-style for Horizon-compatible sizing and spacing.
+{% endcomment %}
+
+<rk-image-block
+  id="block-{{ block.id }}"
+  {{ block.shopify_attributes }}
+  class="rk-block rk-size-style rk-spacing-style"
+  style="
+    {% render 'rk-size-style', settings: block.settings %}
+    {% render 'rk-spacing-style', settings: block.settings %}
+    --rk-block-radius: {{ block.settings.border_radius }}px;
+  "
+>
+  {% if block.settings.image != blank %}
+    {% render 'rk-image',
+      image: block.settings.image,
+      loading: block.settings.loading,
+      shape: block.settings.shape,
+      alt: block.settings.alt,
+      style: 'border-radius: var(--rk-block-radius);'
+    %}
+  {% else %}
+    <div class="rk-image__placeholder" style="aspect-ratio: 16/9; border-radius: var(--rk-block-radius);">
+      {{ 'image' | placeholder_svg_tag }}
+    </div>
+  {% endif %}
+</rk-image-block>
+
+{% schema %}
+{
+  "name": "RK | Imagem",
+  "tag": null,
+  "settings": [
+    {
+      "type": "image_picker",
+      "id": "image",
+      "label": "Imagem"
+    },
+    {
+      "type": "text",
+      "id": "alt",
+      "label": "Texto alternativo (alt)"
+    },
+    {
+      "type": "select",
+      "id": "shape",
+      "label": "Formato",
+      "options": [
+        { "value": "", "label": "Padrão" },
+        { "value": "rounded", "label": "Arredondado" },
+        { "value": "circle", "label": "Circular" }
+      ],
+      "default": ""
+    },
+    {
+      "type": "select",
+      "id": "loading",
+      "label": "Carregamento",
+      "options": [
+        { "value": "lazy", "label": "Lazy (padrão)" },
+        { "value": "eager", "label": "Eager (prioridade)" }
+      ],
+      "default": "lazy"
+    },
+    {
+      "type": "range",
+      "id": "border_radius",
+      "label": "Arredondamento",
+      "min": 0,
+      "max": 40,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "header",
+      "content": "Dimensionamento"
+    },
+    {
+      "type": "select",
+      "id": "width",
+      "label": "Largura",
+      "options": [
+        { "value": "fit-content", "label": "Ajustar ao conteúdo" },
+        { "value": "fill", "label": "Preencher" },
+        { "value": "custom", "label": "Personalizado" }
+      ],
+      "default": "fill"
+    },
+    {
+      "type": "range",
+      "id": "custom_width",
+      "label": "Largura personalizada",
+      "min": 10,
+      "max": 100,
+      "step": 5,
+      "unit": "%",
+      "default": 100
+    },
+    {
+      "type": "select",
+      "id": "height",
+      "label": "Altura",
+      "options": [
+        { "value": "auto", "label": "Automática" },
+        { "value": "fill", "label": "Preencher" },
+        { "value": "custom", "label": "Personalizado" }
+      ],
+      "default": "auto"
+    },
+    {
+      "type": "range",
+      "id": "custom_height",
+      "label": "Altura personalizada",
+      "min": 10,
+      "max": 100,
+      "step": 5,
+      "unit": "%",
+      "default": 100
+    },
+    {
+      "type": "select",
+      "id": "width_mobile",
+      "label": "Largura no mobile",
+      "options": [
+        { "value": "", "label": "Mesmo do desktop" },
+        { "value": "fill", "label": "Preencher" },
+        { "value": "fit-content", "label": "Ajustar ao conteúdo" },
+        { "value": "custom", "label": "Personalizado" }
+      ],
+      "default": ""
+    },
+    {
+      "type": "range",
+      "id": "custom_width_mobile",
+      "label": "Largura mobile personalizada",
+      "min": 10,
+      "max": 100,
+      "step": 5,
+      "unit": "%",
+      "default": 100
+    },
+    {
+      "type": "header",
+      "content": "Espaçamento"
+    },
+    {
+      "type": "range",
+      "id": "padding-block-start",
+      "label": "Topo",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-block-end",
+      "label": "Base",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-inline-start",
+      "label": "Esquerda",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-inline-end",
+      "label": "Direita",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    }
+  ],
+  "presets": [
+    {
+      "name": "RK | Imagem",
+      "category": "Rook UI"
+    }
+  ]
+}
+{% endschema %}

package/rook-framework/blocks/rk-installments.liquid

@@ -0,0 +1,99 @@
+{% comment %}
+  Block: RK Installments
+  Renders a rk-installments component. Uses closest product context or product picker.
+  Uses rk-spacing-style for Horizon-compatible spacing.
+{% endcomment %}
+
+{%- liquid
+  assign target_product = block.settings.product | default: closest.product | default: product
+  assign target_variant = target_product.selected_or_first_available_variant
+-%}
+
+<rk-installments-block
+  id="block-{{ block.id }}"
+  {{ block.shopify_attributes }}
+  class="rk-block rk-spacing-style"
+  style="
+    {% render 'rk-spacing-style', settings: block.settings %}
+    {% if block.settings.alignment == 'center' %}text-align: center;{% elsif block.settings.alignment == 'right' %}text-align: right;{% endif %}
+  "
+>
+  {% if target_variant %}
+    {% render 'rk-installments', price: target_variant.price %}
+  {% endif %}
+</rk-installments-block>
+
+{% schema %}
+{
+  "name": "RK | Parcelamento",
+  "tag": null,
+  "settings": [
+    {
+      "type": "product",
+      "id": "product",
+      "label": "Produto",
+      "info": "Se vazio, usa o produto do contexto"
+    },
+    {
+      "type": "paragraph",
+      "content": "As configurações de parcelas (máximo, sem juros, valor mínimo, taxa) são definidas nas settings globais do tema em \"Rook UI Core Framework\"."
+    },
+    {
+      "type": "text_alignment",
+      "id": "alignment",
+      "label": "Alinhamento",
+      "default": "left"
+    },
+    {
+      "type": "header",
+      "content": "Espaçamento"
+    },
+    {
+      "type": "range",
+      "id": "padding-block-start",
+      "label": "Topo",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-block-end",
+      "label": "Base",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-inline-start",
+      "label": "Esquerda",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-inline-end",
+      "label": "Direita",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    }
+  ],
+  "presets": [
+    {
+      "name": "RK | Parcelamento",
+      "category": "Rook UI"
+    }
+  ]
+}
+{% endschema %}

package/rook-framework/blocks/rk-pix-discount.liquid

@@ -0,0 +1,99 @@
+{% comment %}
+  Block: RK Pix Discount
+  Renders a rk-pix-discount component. Uses closest product context or product picker.
+  Uses rk-spacing-style for Horizon-compatible spacing.
+{% endcomment %}
+
+{%- liquid
+  assign target_product = block.settings.product | default: closest.product | default: product
+  assign target_variant = target_product.selected_or_first_available_variant
+-%}
+
+<rk-pix-block
+  id="block-{{ block.id }}"
+  {{ block.shopify_attributes }}
+  class="rk-block rk-spacing-style"
+  style="
+    {% render 'rk-spacing-style', settings: block.settings %}
+    {% if block.settings.alignment == 'center' %}text-align: center;{% elsif block.settings.alignment == 'right' %}text-align: right;{% endif %}
+  "
+>
+  {% if target_variant %}
+    {% render 'rk-pix-discount', price: target_variant.price %}
+  {% endif %}
+</rk-pix-block>
+
+{% schema %}
+{
+  "name": "RK | Desconto Pix",
+  "tag": null,
+  "settings": [
+    {
+      "type": "product",
+      "id": "product",
+      "label": "Produto",
+      "info": "Se vazio, usa o produto do contexto"
+    },
+    {
+      "type": "paragraph",
+      "content": "A porcentagem de desconto e o texto do Pix são definidos nas settings globais do tema em \"Rook UI Core Framework\"."
+    },
+    {
+      "type": "text_alignment",
+      "id": "alignment",
+      "label": "Alinhamento",
+      "default": "left"
+    },
+    {
+      "type": "header",
+      "content": "Espaçamento"
+    },
+    {
+      "type": "range",
+      "id": "padding-block-start",
+      "label": "Topo",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-block-end",
+      "label": "Base",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-inline-start",
+      "label": "Esquerda",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    },
+    {
+      "type": "range",
+      "id": "padding-inline-end",
+      "label": "Direita",
+      "min": 0,
+      "max": 100,
+      "step": 2,
+      "unit": "px",
+      "default": 0
+    }
+  ],
+  "presets": [
+    {
+      "name": "RK | Desconto Pix",
+      "category": "Rook UI"
+    }
+  ]
+}
+{% endschema %}