{% stories field with { title: 'Components/Field' } %}

{% story default with {
    name: '1. Field - Single Item',
    args: { 
      field_name: 'body',
      field_type: 'text_long',
      label: 'Description',
      label_hidden: false,
      label_display: 'above',
      multiple: false,
      items: [{"content":"This is a single field item with descriptive text content. It demonstrates how a typical text field would appear with a label above the content."}]
    }
  } %}
{% embed 'components:field' with { 
  field_name: field_name,
  field_type: field_type,
  label: label,
  label_hidden: label_hidden,
  label_display: label_display,
  multiple: multiple,
  items: items
} %}{% endembed %}
{% endstory %}

{% story hidden_label with {
    name: '2. Field - Hidden Label',
    args: { 
      field_name: 'field_summary',
      field_type: 'text',
      label: 'Summary',
      label_hidden: true,
      label_display: 'hidden',
      multiple: false,
      items: [{"content":"This field has a hidden label. The content is displayed without a visible label, useful for body text or when the context makes the label unnecessary."}]
    }
  } %}
{% embed 'components:field' with { 
  field_name: field_name,
  field_type: field_type,
  label: label,
  label_hidden: label_hidden,
  label_display: label_display,
  multiple: multiple,
  items: items
} %}{% endembed %}
{% endstory %}

{% story inline with {
    name: '3. Field - Inline Label',
    args: { 
      field_name: 'field_author',
      field_type: 'string',
      label: 'Author:',
      label_hidden: false,
      label_display: 'inline',
      multiple: false,
      items: [{"content":"John Doe"}]
    }
  } %}
{% embed 'components:field' with { 
  field_name: field_name,
  field_type: field_type,
  label: label,
  label_hidden: label_hidden,
  label_display: label_display,
  multiple: multiple,
  items: items
} %}{% endembed %}
{% endstory %}

{% story multiple with {
    name: '4. Field - Multiple Items',
    args: { 
      field_name: 'field_tags',
      field_type: 'entity_reference',
      label: 'Tags',
      label_hidden: false,
      label_display: 'above',
      multiple: true,
      items: [{"content":"Drupal"},{"content":"Tailwind CSS"},{"content":"Alpine.js"},{"content":"Single Page Components"},{"content":"UI Patterns"}]
    }
  } %}
{% embed 'components:field' with { 
  field_name: field_name,
  field_type: field_type,
  label: label,
  label_hidden: label_hidden,
  label_display: label_display,
  multiple: multiple,
  items: items
} %}{% endembed %}
{% endstory %}

{% story visually_hidden with {
    name: '5. Field - Visually Hidden Label',
    args: { 
      field_name: 'field_email',
      field_type: 'email',
      label: 'Email Address',
      label_hidden: false,
      label_display: 'visually_hidden',
      multiple: false,
      items: [{"content":"user@example.com"}]
    }
  } %}
{% embed 'components:field' with { 
  field_name: field_name,
  field_type: field_type,
  label: label,
  label_hidden: label_hidden,
  label_display: label_display,
  multiple: multiple,
  items: items
} %}{% endembed %}
{% endstory %}

{% endstories %}
