shadow-h4x

This is a lifecycle implementation of CustomElements for standard-conforming WebComponents.

Getting started

To install shadow-h4x into your project, simply run

``bash
npm install @yhwh-script/shadow-h4x
`

How-To

Please stick to the following conventions! When working with Vite (recommended), put your components into public/components folder. Then add a generate script command to your package.json:

`javascript
"scripts": {
"dev": "npm run generate && vite",
"build": "npm run generate && vite build",
"preview": "vite preview",
"generate": "node node_modules/@yhwh-script/shadow-h4x/generate.cjs"
}
`
Then run

`bash
npm run dev
`

This will autogenerate a map of your WebComponents inside the src/components folder.

Finally import shadow-h4x:

`

`

After importing shadow-h4x your WebComponents will be defined in the CustemElements registry. This is a feature! You don't have to register your elements manually. Just put them into the public folder. Important! Each WebComponent must be located in a subfolder under public/components, for instance: public/components/router/router-app.html`.