patricknelson/svelte-retag

Add "extend" option to enable ability to use own custom element class

Opened this issue · 0 comments

Describe the problem

Users cannot easily add their own integration or lifecycle hooks into the actual custom element itself that svelte-retag creates.

Relates to #13.

Describe the proposed solution

Add ability for the developer to pass their own class into a new extend option. This class would extend the svelte-retag managed constructor passed to it so that they could add their own lifecycle hooks. When building this, we should attempt parity with how Svelte also implements this. Therefore, this would ideally match the functionality already documented here as much as possible: https://svelte.dev/docs/custom-elements-api#component-options

Example usage modified from sveltejs/svelte#3091 (comment)

svelteRetag({
  component: HelloWorld,
  tagname: 'hello-world',
  extend: (customElementConstructor) => {
    return class extends customElementConstructor {
      constructor() {
        super();
        this.attachedInternals = this.attachInternals();
      }
    };
  }
});

Alternatives considered

None.

Importance

nice to have