Stencil Container

A stencil component that displays child elements with conditional data.

Using this component

$3

- Put in the head of your index.html
- Then you can use the element anywhere in your template, JSX, html etc

$3

- Run npm install stencil-container --save
- Put a script tag similar to this in the head of your index.html
- Then you can use the element anywhere in your template, JSX, html etc

$3

- Run npm install stencil-container --save
- You might need to import the npm package in a tsx file with import { } from 'stencil-container';
- Then you can use the element anywhere in your template, JSX, html etc

Parameters

$3

An expression that is either true or false.

Examples

$3

Will not show the child elements content.

Will show the child elements content.

Without the st-if parameter it assumes the content should be shown.

$3

``html


Will not be shown!

Will be shown!

Will be shown!

Will be shown!

Will not be shown!

`

$3

`jsx
export class MyApp {
private expression1 = '1 == 1';
private expression2 = '1 == 2';

render() {
return (



);
}
}
`

$3

Let me know if it works! :)

Development

Installation:
`bash
git clone https://github.com/nerdic-coder/stencil-container.git stencil-container
cd stencil-container
npm install
`

Running:
`bash
npm start
`

Tests:
`bash
npm run test
`

Watchable tests:
`bash
npm run test.watch
``

Blog article

Feel free to read my blog article on how I created this stencil component,
How I created and published my first Stencil component

All feedback are welcome!