{%- comment -%}
  MIT License · (c) 2026 Lintel · https://lintelagency.com/resources/shopify-sections
{%- endcomment -%}
{%- comment -%}
  Newsletter signup: Shopify customer form that adds the email as a customer tagged "newsletter".
  Three layouts: centered inline, split with an image (left or right), or a banner over a background image.
  Success message after posting, Shopify's field errors, consent line with link, three field styles.
  No JavaScript.
  Depends on: snippets/lib-image.liquid
{%- endcomment -%}

{%- liquid
  assign s = section.settings
  assign heading_tag = s.heading_tag | default: 'h2'
  assign eager = false
  if section.index <= 2
    assign eager = true
  endif
  assign form_id = 'lib-newsletter-' | append: section.id
  assign input_id = 'LibNewsletterEmail-' | append: section.id
  assign consent_id = 'LibNewsletterConsent-' | append: section.id
  assign error_id = 'LibNewsletterError-' | append: section.id
  assign input_label = s.input_label | default: 'Email'
-%}

<div
  class="lib-newsletter lib-newsletter--{{ s.layout }} lib-newsletter--{{ s.section_width }}"
  {% if s.anchor_id != blank %}
    id="{{ s.anchor_id | handleize }}"
  {% endif %}
  data-show="{{ s.show_on }}"
  data-image-pos="{{ s.image_position }}"
  data-field="{{ s.field_style }}"
  style="
    --lib-bg: {{ s.color_bg }};
    {% if s.color_bg_gradient != blank %}--lib-bg-image: {{ s.color_bg_gradient }};{% endif %}
    --lib-text: {{ s.color_text }};
    --lib-on-image: {{ s.color_on_image }};
    --lib-accent: {{ s.color_accent }};
    --lib-accent-text: {{ s.color_accent_text }};
    --lib-field-bg: {{ s.color_field_bg }};
    --lib-field-text: {{ s.color_field_text }};
    --lib-overlay: {{ s.overlay_color }};
    --lib-overlay-o: {{ s.overlay_opacity | divided_by: 100.0 }};
    --lib-content-w: {{ s.content_width }}px;
    --lib-radius-frame: {{ s.corner_radius }}px;
    --lib-pt: {{ s.padding_top }}px;
    --lib-pb: {{ s.padding_bottom }}px;
    --lib-pt-m: {{ s.padding_top_mobile }}px;
    --lib-pb-m: {{ s.padding_bottom_mobile }}px;
  "
>
  <div class="lib-newsletter__inner">
    {%- if s.layout == 'split' -%}
      <div class="lib-newsletter__media" data-ratio="{{ s.image_ratio }}">
        {%- render 'lib-image',
          image: s.image,
          image_mobile: s.image_mobile,
          class: 'lib-newsletter__img',
          sizes: '(min-width: 990px) 50vw, 100vw',
          eager: eager
        -%}
      </div>
    {%- elsif s.layout == 'banner' -%}
      <div class="lib-newsletter__bg">
        {%- render 'lib-image',
          image: s.image,
          image_mobile: s.image_mobile,
          class: 'lib-newsletter__img',
          sizes: '100vw',
          eager: eager
        -%}
      </div>
      <div class="lib-newsletter__overlay" aria-hidden="true"></div>
    {%- endif -%}

    <div class="lib-newsletter__content" data-align="{{ s.text_alignment }}" data-align-m="{{ s.text_alignment_mobile }}">
      {%- if s.eyebrow != blank -%}
        <p class="lib-newsletter__eyebrow">{{ s.eyebrow | escape }}</p>
      {%- endif -%}

      {%- if s.heading != blank -%}
        <{{ heading_tag }} class="lib-newsletter__heading lib-newsletter__heading--{{ s.heading_size }}">
          {{- s.heading -}}
        </{{ heading_tag }}>
      {%- endif -%}

      {%- if s.text != blank -%}
        <div class="lib-newsletter__text">{{ s.text }}</div>
      {%- endif -%}

      {%- form 'customer', id: form_id, class: 'lib-newsletter__form' -%}
        <input type="hidden" name="contact[tags]" value="newsletter">

        {%- if form.posted_successfully -%}
          <p class="lib-newsletter__msg lib-newsletter__msg--success" role="status">
            <svg viewBox="0 0 20 20" width="20" height="20" aria-hidden="true" focusable="false">
              <path d="m5 10.5 3.2 3L15 6.5" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>
            </svg>
            <span>{{ s.success_message | escape }}</span>
          </p>
        {%- else -%}
          {%- if form.errors -%}
            <div class="lib-newsletter__msg lib-newsletter__msg--error" id="{{ error_id }}" role="alert">
              {%- for field in form.errors -%}
                <p>
                  {%- if field == 'form' -%}
                    {{ form.errors.messages[field] }}
                  {%- else -%}
                    {{ form.errors.translated_fields[field] | capitalize }}
                    {{ form.errors.messages[field] }}
                  {%- endif -%}
                </p>
              {%- endfor -%}
            </div>
          {%- endif -%}

          <label class="lib-newsletter__label{% unless s.show_label %} lib-newsletter__sr{% endunless %}" for="{{ input_id }}">
            {{- input_label | escape -}}
          </label>
          <div class="lib-newsletter__row">
            <input
              class="lib-newsletter__input"
              id="{{ input_id }}"
              type="email"
              name="contact[email]"
              required
              autocomplete="email"
              autocapitalize="off"
              spellcheck="false"
              {% if s.placeholder != blank %}
                placeholder="{{ s.placeholder | escape }}"
              {% endif %}
              {% if form.errors %}
                aria-invalid="true"
              {% endif %}
              {% if form.errors or s.consent != blank %}
                aria-describedby="{% if form.errors %}{{ error_id }} {% endif %}{% if s.consent != blank %}{{ consent_id }}{% endif %}"
              {% endif %}
            >
            <button class="lib-newsletter__submit lib-newsletter__submit--{{ s.button_style }}" type="submit">
              {{- s.button_label | default: 'Subscribe' | escape -}}
            </button>
          </div>
        {%- endif -%}

        {%- if s.consent != blank -%}
          <p class="lib-newsletter__consent" id="{{ consent_id }}">{{ s.consent }}</p>
        {%- endif -%}
      {%- endform -%}
    </div>
  </div>
</div>

{% stylesheet %}
  .lib-newsletter {
    background-color: var(--lib-bg);
    background-image: var(--lib-bg-image, none);
    color: var(--lib-text);
    padding: var(--lib-pt) 1rem var(--lib-pb);
  }
  .lib-newsletter__inner {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
  }
  .lib-newsletter--full .lib-newsletter__inner { max-width: none; }
  .lib-newsletter--banner.lib-newsletter--full { padding-inline: 0; }
  @media (max-width: 749px) {
    .lib-newsletter { padding-top: var(--lib-pt-m); padding-bottom: var(--lib-pb-m); }
    .lib-newsletter[data-show='desktop'] { display: none; }
  }
  @media (min-width: 750px) {
    .lib-newsletter[data-show='mobile'] { display: none; }
  }

  /* Content column and alignment: desktop, then mobile override. */
  .lib-newsletter__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    width: 100%;
    max-width: var(--lib-content-w);
  }
  .lib-newsletter__content[data-align='center'] { align-items: center; text-align: center; margin-inline: auto; }
  .lib-newsletter__content[data-align='right'] { align-items: flex-end; text-align: right; margin-inline-start: auto; }
  @media (max-width: 749px) {
    .lib-newsletter__content[data-align-m] { margin-inline: 0; }
    .lib-newsletter__content[data-align-m='left'] { align-items: flex-start; text-align: left; }
    .lib-newsletter__content[data-align-m='center'] { align-items: center; text-align: center; margin-inline: auto; }
    .lib-newsletter__content[data-align-m='right'] { align-items: flex-end; text-align: right; margin-inline-start: auto; }
  }
  /* Inline layout: the column itself is always centered; alignment only moves the text. */
  .lib-newsletter--inline .lib-newsletter__content[data-align][data-align-m] { margin-inline: auto; }

  /* Split: image beside the content from 990px, stacked above it below. */
  .lib-newsletter--split .lib-newsletter__inner {
    display: grid;
    gap: clamp(2rem, 5vw, 4rem);
    align-items: center;
  }
  .lib-newsletter--split .lib-newsletter__content { max-width: none; }
  .lib-newsletter--split .lib-newsletter__content > * { max-width: var(--lib-content-w); }
  .lib-newsletter__media {
    position: relative;
    border-radius: var(--lib-radius-frame);
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: color-mix(in srgb, var(--lib-text) 6%, transparent);
  }
  .lib-newsletter__media[data-ratio='square'] { aspect-ratio: 1; }
  .lib-newsletter__media[data-ratio='portrait'] { aspect-ratio: 4 / 5; }
  .lib-newsletter__media[data-ratio='landscape'] { aspect-ratio: 3 / 2; }
  .lib-newsletter__media[data-ratio='adapt'] { aspect-ratio: auto; }
  .lib-newsletter__img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .lib-newsletter__media[data-ratio='adapt'] .lib-newsletter__img { height: auto; }
  .lib-newsletter__img:is(svg) { fill: color-mix(in srgb, var(--lib-text) 25%, transparent); }
  @media (max-width: 749px) {
    .lib-newsletter__media[data-ratio='portrait'],
    .lib-newsletter__media[data-ratio='square'] { aspect-ratio: 4 / 3; }
  }
  @media (min-width: 990px) {
    .lib-newsletter--split .lib-newsletter__inner { grid-template-columns: 1fr 1fr; }
    .lib-newsletter--split[data-image-pos='right'] .lib-newsletter__media { order: 2; }
  }

  /* Banner: background image and overlay fill the frame; content sits on top. */
  .lib-newsletter--banner .lib-newsletter__inner {
    display: grid;
    padding: clamp(3rem, 9vw, 7rem) clamp(1.25rem, 5vw, 4rem);
    border-radius: var(--lib-radius-frame);
    overflow: hidden;
    isolation: isolate;
    color: var(--lib-on-image);
  }
  .lib-newsletter--banner.lib-newsletter--full .lib-newsletter__inner { border-radius: 0; }
  .lib-newsletter__bg,
  .lib-newsletter__overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
  }
  .lib-newsletter__bg { background: color-mix(in srgb, var(--lib-text) 40%, transparent); }
  .lib-newsletter__overlay { background: var(--lib-overlay); opacity: var(--lib-overlay-o); }
  .lib-newsletter--banner .lib-newsletter__img { position: absolute; inset: 0; }

  .lib-newsletter__eyebrow {
    margin: 0 0 1rem;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    opacity: 0.75;
  }
  .lib-newsletter__heading {
    margin: 0;
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.08;
    letter-spacing: -0.025em;
    text-wrap: balance;
  }
  .lib-newsletter__heading--small { font-size: clamp(1.5rem, 2.6vw, 2rem); }
  .lib-newsletter__heading--medium { font-size: clamp(1.75rem, 3.2vw, 2.5rem); }
  .lib-newsletter__heading--xlarge { font-size: clamp(2.5rem, 6vw, 4.5rem); }
  .lib-newsletter__text {
    margin-top: 1rem;
    font-size: 1.0625rem;
    line-height: 1.6;
    opacity: 0.8;
  }
  .lib-newsletter__text > :first-child { margin-top: 0; }
  .lib-newsletter__text > :last-child { margin-bottom: 0; }

  /* Form */
  .lib-newsletter__form {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: 30rem;
    margin-top: 1.75rem;
  }
  .lib-newsletter__label {
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
  }
  .lib-newsletter__sr {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
  }
  .lib-newsletter__row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  .lib-newsletter__input {
    flex: 1 1 13rem;
    min-width: 0;
    min-height: 3rem;
    padding: 0.75rem 1.1rem;
    border: 1px solid color-mix(in srgb, var(--lib-field-text) 18%, transparent);
    border-radius: 999px;
    background: var(--lib-field-bg);
    color: var(--lib-field-text);
    font: inherit;
    font-size: 1rem;
    text-align: start;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
  }
  .lib-newsletter__input::placeholder { color: var(--lib-field-text); opacity: 0.55; }
  .lib-newsletter__input:focus { outline: none; }
  .lib-newsletter__input:focus-visible {
    border-color: var(--lib-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--lib-accent) 30%, transparent);
  }
  .lib-newsletter__input[aria-invalid='true'] { border-color: #b42318; }
  .lib-newsletter__submit {
    flex: 0 0 auto;
    min-height: 3rem;
    padding: 0.75rem 1.5rem;
    border: 0;
    border-radius: 999px;
    font: inherit;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
  }
  .lib-newsletter__submit--primary {
    background: var(--lib-accent);
    color: var(--lib-accent-text);
  }
  .lib-newsletter__submit--outline {
    background: transparent;
    color: inherit;
    box-shadow: inset 0 0 0 1.5px currentColor;
  }
  .lib-newsletter__submit:hover { transform: translateY(-1px); box-shadow: 0 8px 18px -10px rgb(0 0 0 / 0.45); }
  .lib-newsletter__submit--outline:hover { box-shadow: inset 0 0 0 1.5px currentColor, 0 8px 18px -10px rgb(0 0 0 / 0.45); }
  .lib-newsletter__submit:focus-visible {
    outline: 2px solid var(--lib-accent);
    outline-offset: 3px;
  }
  .lib-newsletter--banner .lib-newsletter__submit:focus-visible { outline-color: currentColor; }

  /* Field styles */
  .lib-newsletter[data-field='square'] .lib-newsletter__input,
  .lib-newsletter[data-field='square'] .lib-newsletter__submit { border-radius: 4px; }
  .lib-newsletter[data-field='underline'] .lib-newsletter__row { gap: 1rem; }
  .lib-newsletter[data-field='underline'] .lib-newsletter__input {
    padding-inline: 0;
    border-width: 0 0 1.5px;
    border-color: color-mix(in srgb, currentColor 45%, transparent);
    border-radius: 0;
    background: transparent;
    color: inherit;
  }
  .lib-newsletter[data-field='underline'] .lib-newsletter__input::placeholder { color: inherit; }
  .lib-newsletter[data-field='underline'] .lib-newsletter__input:focus-visible {
    border-color: currentColor;
    box-shadow: 0 1.5px 0 0 currentColor;
  }
  .lib-newsletter[data-field='underline'] .lib-newsletter__submit { border-radius: 0; }

  .lib-newsletter__content[data-align='center'] .lib-newsletter__form { align-items: stretch; }
  .lib-newsletter__content[data-align='center'] .lib-newsletter__label { align-self: center; }
  .lib-newsletter__content[data-align='right'] .lib-newsletter__label { align-self: flex-end; }
  @media (max-width: 749px) {
    .lib-newsletter__content[data-align-m='left'] .lib-newsletter__label { align-self: flex-start; }
    .lib-newsletter__content[data-align-m='center'] .lib-newsletter__label { align-self: center; }
    .lib-newsletter__content[data-align-m='right'] .lib-newsletter__label { align-self: flex-end; }
    .lib-newsletter__submit { flex-grow: 1; }
  }

  /* Messages and consent */
  .lib-newsletter__msg {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0 0 1rem;
    padding: 0.85rem 1rem;
    border-radius: 12px;
    font-size: 0.95rem;
    line-height: 1.45;
    text-align: start;
  }
  .lib-newsletter__msg--success {
    background: color-mix(in srgb, currentColor 8%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 18%, transparent);
  }
  .lib-newsletter__msg--success svg { flex: none; }
  .lib-newsletter__msg--error {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    background: #fef3f2;
    color: #b42318;
    box-shadow: inset 0 0 0 1px #fda29b;
  }
  .lib-newsletter__msg--error p { margin: 0; }
  .lib-newsletter__consent {
    margin: 0.9rem 0 0;
    font-size: 0.8rem;
    line-height: 1.5;
    opacity: 0.7;
  }
  .lib-newsletter__consent a { color: inherit; text-underline-offset: 0.2em; }
  .lib-newsletter__consent a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; border-radius: 2px; }

  @media (prefers-reduced-motion: reduce) {
    .lib-newsletter__input, .lib-newsletter__submit { transition: none; }
    .lib-newsletter__submit:hover { transform: none; }
  }
{% endstylesheet %}

{% schema %}
{
  "name": "Lib · Newsletter signup",
  "tag": "section",
  "class": "lib-section",
  "settings": [
    { "type": "header", "content": "Content" },
    { "type": "text", "id": "eyebrow", "label": "Eyebrow", "default": "The Sunday letter" },
    { "type": "inline_richtext", "id": "heading", "label": "Heading", "default": "Slow mornings, <em>in your inbox</em>" },
    {
      "type": "select",
      "id": "heading_tag",
      "label": "Heading tag",
      "info": "Use H1 only when this is the page's main heading.",
      "options": [
        { "value": "h1", "label": "H1" },
        { "value": "h2", "label": "H2" },
        { "value": "h3", "label": "H3" },
        { "value": "p", "label": "Paragraph" }
      ],
      "default": "h2"
    },
    {
      "type": "select",
      "id": "heading_size",
      "label": "Heading size",
      "options": [
        { "value": "small", "label": "Small" },
        { "value": "medium", "label": "Medium" },
        { "value": "large", "label": "Large" },
        { "value": "xlarge", "label": "Extra large" }
      ],
      "default": "large"
    },
    { "type": "richtext", "id": "text", "label": "Text", "default": "<p>New pieces, studio notes and the occasional early-access sale. One email a month, never more.</p>" },

    { "type": "header", "content": "Form" },
    { "type": "text", "id": "input_label", "label": "Field label", "default": "Email address" },
    { "type": "checkbox", "id": "show_label", "label": "Show field label", "info": "When off, the label is still read by screen readers.", "default": false },
    { "type": "text", "id": "placeholder", "label": "Field placeholder", "default": "you@example.com" },
    { "type": "text", "id": "button_label", "label": "Button label", "default": "Subscribe" },
    {
      "type": "select",
      "id": "button_style",
      "label": "Button style",
      "options": [
        { "value": "primary", "label": "Solid" },
        { "value": "outline", "label": "Outline" }
      ],
      "default": "primary"
    },
    {
      "type": "select",
      "id": "field_style",
      "label": "Field style",
      "options": [
        { "value": "pill", "label": "Pill" },
        { "value": "square", "label": "Square" },
        { "value": "underline", "label": "Underline" }
      ],
      "default": "pill"
    },
    { "type": "inline_richtext", "id": "consent", "label": "Consent text", "info": "Small print under the form. Link your privacy policy here.", "default": "By subscribing you agree to receive emails from us. Unsubscribe any time. Read our <a href=\"/policies/privacy-policy\">privacy policy</a>." },
    { "type": "text", "id": "success_message", "label": "Success message", "default": "Thanks for subscribing. Your first letter arrives next Sunday." },

    { "type": "header", "content": "Layout and image" },
    {
      "type": "select",
      "id": "layout",
      "label": "Layout",
      "options": [
        { "value": "inline", "label": "Centered, no image" },
        { "value": "split", "label": "Split with image" },
        { "value": "banner", "label": "Banner over image" }
      ],
      "default": "split"
    },
    { "type": "image_picker", "id": "image", "label": "Desktop image", "visible_if": "{{ section.settings.layout != 'inline' }}" },
    { "type": "image_picker", "id": "image_mobile", "label": "Mobile image", "info": "Optional. Shown below 750px.", "visible_if": "{{ section.settings.layout != 'inline' }}" },
    {
      "type": "select",
      "id": "image_position",
      "label": "Image position on desktop",
      "options": [
        { "value": "left", "label": "Left" },
        { "value": "right", "label": "Right" }
      ],
      "default": "left",
      "visible_if": "{{ section.settings.layout == 'split' }}"
    },
    {
      "type": "select",
      "id": "image_ratio",
      "label": "Image shape",
      "info": "Square and portrait show as 4:3 on mobile.",
      "options": [
        { "value": "adapt", "label": "Adapt to image" },
        { "value": "square", "label": "Square" },
        { "value": "portrait", "label": "Portrait" },
        { "value": "landscape", "label": "Landscape" }
      ],
      "default": "landscape",
      "visible_if": "{{ section.settings.layout == 'split' }}"
    },
    { "type": "color", "id": "overlay_color", "label": "Overlay color", "default": "#1C1917", "visible_if": "{{ section.settings.layout == 'banner' }}" },
    { "type": "range", "id": "overlay_opacity", "label": "Overlay opacity", "min": 0, "max": 90, "step": 5, "unit": "%", "default": 40, "visible_if": "{{ section.settings.layout == 'banner' }}" },
    {
      "type": "select",
      "id": "section_width",
      "label": "Width",
      "options": [
        { "value": "page", "label": "Page width" },
        { "value": "full", "label": "Full width" }
      ],
      "default": "page"
    },
    { "type": "range", "id": "content_width", "label": "Content max width", "min": 400, "max": 900, "step": 20, "unit": "px", "default": 560 },
    { "type": "range", "id": "corner_radius", "label": "Image corner radius", "min": 0, "max": 40, "step": 2, "unit": "px", "default": 16, "visible_if": "{{ section.settings.layout != 'inline' }}" },
    { "type": "text_alignment", "id": "text_alignment", "label": "Text alignment on desktop", "default": "left" },
    {
      "type": "select",
      "id": "text_alignment_mobile",
      "label": "Text alignment on mobile",
      "options": [
        { "value": "left", "label": "Left" },
        { "value": "center", "label": "Center" },
        { "value": "right", "label": "Right" }
      ],
      "default": "left"
    },

    { "type": "header", "content": "Colors" },
    { "type": "color", "id": "color_bg", "label": "Background", "default": "#F5F1EA" },
    { "type": "color_background", "id": "color_bg_gradient", "label": "Background gradient", "info": "Optional. Covers the background color." },
    { "type": "color", "id": "color_text", "label": "Text", "default": "#1C1917" },
    { "type": "color", "id": "color_on_image", "label": "Text over image", "info": "Banner layout only.", "default": "#FFFFFF" },
    { "type": "color", "id": "color_accent", "label": "Accent (button, focus ring)", "default": "#1C1917" },
    { "type": "color", "id": "color_accent_text", "label": "Text on accent", "default": "#F5F1EA" },
    { "type": "color", "id": "color_field_bg", "label": "Field background", "info": "Pill and square fields. Underline fields use the text color.", "default": "#FFFFFF" },
    { "type": "color", "id": "color_field_text", "label": "Field text", "default": "#1C1917" },

    { "type": "header", "content": "Spacing and visibility" },
    { "type": "range", "id": "padding_top", "label": "Top padding on desktop", "min": 0, "max": 200, "step": 4, "unit": "px", "default": 80 },
    { "type": "range", "id": "padding_bottom", "label": "Bottom padding on desktop", "min": 0, "max": 200, "step": 4, "unit": "px", "default": 80 },
    { "type": "range", "id": "padding_top_mobile", "label": "Top padding on mobile", "min": 0, "max": 160, "step": 4, "unit": "px", "default": 48 },
    { "type": "range", "id": "padding_bottom_mobile", "label": "Bottom padding on mobile", "min": 0, "max": 160, "step": 4, "unit": "px", "default": 48 },
    {
      "type": "select",
      "id": "show_on",
      "label": "Show on",
      "options": [
        { "value": "all", "label": "All devices" },
        { "value": "desktop", "label": "Desktop only" },
        { "value": "mobile", "label": "Mobile only" }
      ],
      "default": "all"
    },
    { "type": "text", "id": "anchor_id", "label": "Anchor ID", "info": "Optional. Link to this section with #your-id." }
  ],
  "presets": [
    {
      "name": "Lib · Newsletter signup"
    }
  ]
}
{% endschema %}