ucd-library / ucdlib-theme

University branding, additional theme support, theme elements
MIT License
0 stars 0 forks source link

Create the `ucdlib-properties` element #57

Open jrmerz opened 2 years ago

jrmerz commented 2 years ago

It would be nice for server side renders sites (PHP/Twig, Express with templating) to be able to hydrate complex properties of a webcomponent without using javascript. Example:

<ucdlib-my-cool-component>
  <ucdlib-properties type="json">
    {"testing":"ok", "complex" : {"values": 1, "can-be": "nested"}}
  </ucdlib-properties>
</ucdlib-my-cool-component>

In the above example, properties testing and complex should be set on ucdlib-my-cool-component when ucdlib-my-cool-component is first attached to the DOM assuming ucdlib-my-cool-component implements the SSRPropertiesController (see below).

General component spec:

Note. This is using connected as the fire event and not the constructor due to the parent constructor element possibly firing before children are registered.

UcDust commented 2 years ago

Justin/Steve mentioned to add this as well so no ugly flashes are rendered before the custom element is defined.

UcDust commented 2 years ago

Created a PR / code review here.