haunted

Assombrado? ?

API Hooks do React, mas para componentes web padrão e lit-html ou hyperHTML.

Leia os documentos

 < html lang =" en " >
  < my-counter > </ my-counter >

  < script type =" module " >
    import { html } from 'https://unpkg.com/lit?module' ;
    import { component , useState } from 'https://unpkg.com/haunted/haunted.js' ;

    function Counter ( ) {
      const [ count , setCount ] = useState ( 0 ) ;

      return html `
        < div id =" count " > ${ count } </ div >
        < button type =" button " @click = ${ ( ) => setCount ( count + 1 ) } >
          Increment
        </ button >
      ` ;
    }

    customElements . define ( 'my-counter' , component ( Counter ) ) ;
  </ script >
</ html >

Mais exemplos de integrações podem ser encontrados nesta essência.

Ganchos

Haunted suporta a mesma API do React Hooks. A esperança é que, ao fazer isso, você possa reutilizar os ganchos disponíveis no npm simplesmente criando alias para os nomes dos pacotes na configuração do seu bundler.

Atualmente Haunted suporta os seguintes ganchos:

• useCallback
• useContext
• useController
• useEfeito
• useLayoutEffect
• useMemo
• usarRedutor
• useRef
• usarEstado

Assinaturas de Função

 // Or another renderer, see Guides
type Renderer = ( element : Element ) => TemplateResult ;

interface Options {
  baseElement : HTMLElement ;
  observedAttributes : string [ ] ;
  useShadowDOM : boolean
}

declare function component (
  renderer : Renderer ,
  options : Options
) : Element ;

declare function component < BaseElement = HTMLElement > (
  renderer : Renderer ,
  baseElement : BaseElement ,
  options : Options
) : Element

declare function virtual ( renderer : Renderer ) : Directive 

Licença

Cláusula BSD-2