{"repo":"geocine/custom-elements-ts","free":true,"listed":false,"github":"https://github.com/geocine/custom-elements-ts","clone":"git clone https://github.com/geocine/custom-elements-ts.git","description":"Create Native Web Components using Typescript","language":"TypeScript","stars":62,"topics":["custom-elements","typescript","decorators","shadow-dom","web-components","reactive","deep-proxy"],"license":"MIT","category":"ui-components","readme_excerpt":"custom-elements-ts Author native Web Components in TypeScript with a small set of decorators ( @CustomElement , @Prop , @State , @Watch , @Listen , @Dispatch , @Toggle ) plus a tiny html / render() runtime. Zero dependencies. Framework-free. Live demos: geocine.github.io/custom-elements-ts — counter, sprint board, install pill, and a live event log, all built with the library. Table of contents - Quick start - Plain HTML — no render() required - Reactive components with render() - Template bindings - Decorators - @Prop() - @State() - @Toggle() - @Dispatch() - @Watch() - @Listen() - Project layout - Running the demos - Building Quick start There are two ways to author a component, and they compose freely: 1. Plain HTML, imperative updates. Declare a template (or templateUrl ) and update the DOM yourself in connectedCallback , @Watch() handlers, or @Listen() handlers. No render() . No reactive runtime. Use this when the DOM is mostly static — buttons, badges, panels, copy-to-clipboard pills, and so on. 2. Reactive render() with the html helper. Define render() and the runtime re-renders for you on @Prop() / @State() / @Toggle() changes. Use this for stateful components like dashboards, counters, forms, and lists. render() is optional — components without it pay zero runtime cost beyond the decorators themselves. Plain HTML — no render() required A small toast-firing \"click to copy\" pill, written entirely with a static template and imperative DOM. This is exactly the pattern use","default_branch":null,"files":null,"tree":[],"storefront":"/r/geocine","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/geocine/custom-elements-ts/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}