Problem/Motivation

It is possible to define a component with the correct typing for attributes, so that Drupal will check and fail if anything else is passed. This is good

name: Button
status: experimental
props:
  type: object
  properties:
    (...)
    attributes:
      type: Drupal\Core\Template\Attribute

It is also possible, on storybook, to define the matching "attributes" prop and define it as an object, so that it will appear on the living styleguide.This is also good

title: Radix/Button
argTypes:
  (...)
  attributes:
    type: object <--- this tells storybook to treat this prop as an object
    name: attributes
    description: The Drupal Attributes object
    table:
      category: Drupal
      type:
        summary: \Drupal\Core\Template\Attribute <---- this is just the string that gets exposed to the user

Living documentation

And Storybook will let you modify the value of the attributes object in real time. This is awesome...

Modifying attributes

...but fails to pass the type check as Drupal receives an array and we have (correctly) typed the attributes as an instance of Drupal\Core\Template\Attribute

Proposed resolution

It would be extra awesome to have CL server intercept any attributes coming from CL_server and try to convert them to Drupal's own Drupal\Core\Template\Attribute (when there is actually an attributes entry defined on the component, of course).

This way, it could be easy to test different extra attributes the component might receive (i.e data-attributes, IDs, js modifiers) directly via the storybook UI.

Remaining tasks

Implement

User interface changes

None

API changes

None

Data model changes

None

Issue fork cl_server-3367208

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

idiaz.roncero created an issue. See original summary.

idiaz.roncero’s picture

First idea for a solution commited to new branch.

This line bugs me and it might be a better way to do it:

    $metadata_has_attributes = array_key_exists('attributes', $properties) && $properties['attributes']['type'][0] = "Drupal\Core\Template\Attribute";
e0ipso’s picture

Status: Active » Needs work
idiaz.roncero’s picture

Status: Needs work » Needs review
e0ipso’s picture

Status: Needs review » Fixed

This looks good to me. Merging.

  • e0ipso committed 35be0188 on 2.x authored by idiaz.roncero
    Issue #3367208 by idiaz.roncero, e0ipso: Process attributes coming from...
e0ipso’s picture

//www.flaticon.com/free-icons/thank-you Thank you for your contribution! Your continued support to this project also helps me, as a maintainer.
There are multiple ways to show appreciation for the work I did in this project, those include:
  • Triaging issues, and adding more context to existing issues.
  • Writing documentation, or patches for this project.
  • Writing blog posts, speaking about it at conferences.
idiaz.roncero’s picture

Awesome, thanks

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.