{% set attributes = create_attribute()
  .setAttribute('class', 'image-widget')
%}

{% set data = {
  preview: '<img src="latest-update1.png" alt="Preview Image" class="image-preview">',
  upload_field: '
    <div class="js-form-item">
      <label for="edit-field-image-0-alt" class="js-form-required form-required">Alternative text</label>
      <input data-drupal-selector="edit-field-image-0-alt" aria-describedby="edit-field-image-0-alt--description" type="text" id="edit-field-image-0-alt" name="field_image[0][alt]" value="kkkk" size="60" maxlength="512" class="form-text required" required="required" aria-required="true">
      <div id="edit-field-image-0-alt--description" class="description">
      Short description of the image used by screen readers and displayed when the image is not loaded. This is important for accessibility.
    </div>
    </div>'
} %}



{% stories image_widget with { title: 'Components/Image Widget' } %}

{% story default with {
  name: 'With Preview',
  args: {
      attributes: attributes,
      data: data
    }
  } %}

    {% include 'tailpine:image-widget' with {
      attributes: attributes,
      data: data
    } %}

  {% endstory %}

{% endstories %}
