npm - @jsweb/ui - Versions diffs - 1.3.0 → 1.3.2 - Mend

@jsweb/ui 1.3.0 → 1.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (35) hide show

package/CHANGELOG.md +155 -0
package/README.md +72 -7
package/SKILL.md +609 -0
package/index.es.js +2 -0
package/index.es.js.map +1 -0
package/index.umd.js +2 -0
package/index.umd.js.map +1 -0
package/package.json +10 -23
package/src/index.d.ts +4 -0
package/{dist/src → src}/parser.d.ts +2 -1
package/src/reactivity.d.ts +48 -0
package/.github/workflows/npm-publish.yml +0 -19
package/.prettierignore +0 -3
package/.prettierrc +0 -7
package/PROJECT.md +0 -106
package/dist/LICENSE +0 -21
package/dist/README.md +0 -227
package/dist/index.es.js +0 -2
package/dist/index.es.js.map +0 -1
package/dist/index.umd.js +0 -2
package/dist/index.umd.js.map +0 -1
package/dist/package.json +0 -34
package/dist/src/index.d.ts +0 -3
package/dist/src/reactivity.d.ts +0 -24
package/dist/vite.config.d.ts +0 -2
package/index.html +0 -196
package/publish.js +0 -34
package/src/evaluator.ts +0 -29
package/src/index.ts +0 -10
package/src/parser.ts +0 -480
package/src/reactivity.ts +0 -185
package/tsconfig.json +0 -23
package/vite.config.ts +0 -16
/package/{dist/index.d.ts → index.d.ts} +0 -0
/package/{dist/src → src}/evaluator.d.ts +0 -0

package/index.html DELETED Viewed

@@ -1,196 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>JS Web UI Test</title>
-    <style>
-      .box {
-        padding: 20px;
-        border-radius: 8px;
-        transition: all 0.3s ease;
-        margin-bottom: 10px;
-        color: white;
-      }
-      .active {
-        box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
-        transform: scale(1.02);
-      }
-    </style>
-    <script type="module">
-      import { createScope, reactive } from './src/index.ts'
-      const scope = reactive({
-        count: 0,
-        inc: 'Incremento',
-        dec: 'Decremento',
-        model: 'Exemplo',
-        items: ['A', 'B', 'C'],
-        active: false,
-        color: '#42b883',
-        get computedItems() {
-          return this.items.map((value, index) => {
-            return { value, index }
-          })
-        },
-        increment() {
-          this.count++
-        },
-        decrement() {
-          this.count--
-        },
-        zero() {
-          this.count = 0
-        },
-        addItem() {
-          const value = Date.now()
-          this.items.push(value)
-        },
-        removeItem() {
-          this.items.pop()
-        },
-        logEvent(e, ...args) {
-          console.log('Evento recebido:', e, args)
-          this.items.push(`Evento ${e.type}`)
-        },
-        toggleActive() {
-          this.active = !this.active
-        },
-        handleCustomEvent(e) {
-          alert(`Custom event received: ${e.detail.message}`)
-          this.items.push(`Custom Event: ${e.detail.message}`)
-        },
-        focusInputModel() {
-          const input = this.$refs.get('inputModel')
-          if (input) {
-            input.focus()
-            input.style.outline = '2px solid blue'
-            console.log('Single ref resgatada com sucesso:', input)
-          }
-        },
-        focusListItem(idx) {
-          const inputMap = this.$refs.get('itemInput')
-          console.log('Nested Map de refs da lista:', inputMap)
-          const el = inputMap?.get(idx)
-          if (el) {
-            el.focus()
-            el.select()
-            console.log(`Elemento da chave ${idx} resgatado:`, el)
-          }
-        },
-        logRefs() {
-          console.log('Todas as $refs indexadas no Map:', this.$refs)
-          alert(`Refs mapeadas: ${Array.from(this.$refs.keys()).join(', ')}`)
-        },
-      })
-      window.scope = scope
-      createScope('body', { scope })
-    </script>
-  </head>
-  <body>
-    <div :scope="scope">
-      <h1>JS Web UI</h1>
-      <p>Contador: <span :text="count"></span></p>
-      <button :text="inc" @click="increment">+</button>
-      <button :text="dec" @click="decrement">-</button>
-      <div style="margin-top: 20px">
-        <button @click="zero" :disabled="!count">Zerar</button>
-      </div>
-      <div
-        :if="count > 0"
-        style="margin-top: 20px; padding: 10px; border: 1px solid green"
-      >
-        O contador é maior que zero!
-      </div>
-      <div style="margin-top: 20px">
-        <h3>Lista:</h3>
-        <div style="margin-bottom: 10px">
-          <input
-            type="text"
-            :bind="model"
-            :ref="inputModel"
-            placeholder="Digite algo..."
-          />
-          <p>Você vai adicionar: <strong :text="model"></strong></p>
-          <button @click="addItem">Adicionar Item</button>
-          <button @click="removeItem">Remover Item</button>
-          <button @click="focusInputModel">
-            Focar Campo via this.$refs.get('inputModel')
-          </button>
-          <button @click="logRefs">Inspecionar $refs no Console</button>
-          <button @click="logEvent">Testar Evento (Sem Parênteses)</button>
-          <button @click="logEvent($event, 'A', 'B', 'C')">
-            Testar Evento (Com Parênteses)
-          </button>
-        </div>
-        <ul>
-          <li :for="item of computedItems" :key="item.index" :ref="itemRow">
-            <span :text="item.index"></span>:
-            <input type="text" :value="item.value" :ref="itemInput" />
-            <button @click="focusListItem(item.index)">
-              Focar este input ($refs.get('itemInput').get($key))
-            </button>
-          </li>
-        </ul>
-      </div>
-      <hr />
-      <div style="margin-top: 20px">
-        <h3>Testes de :class e :style</h3>
-        <div
-          class="box"
-          :class="{ active }"
-          :style="{ backgroundColor: color, opacity: count ? 1 : 0.5 }"
-        >
-          Caixa de teste! Ativa: <strong :text="active"></strong>
-        </div>
-        <div style="margin-top: 10px">
-          <button @click="toggleActive">Alternar Classe 'active'</button>
-          <label style="margin-left: 10px">
-            Cor de Fundo:
-            <input type="color" :bind="color" />
-          </label>
-        </div>
-      </div>
-      <hr />
-      <div style="margin-top: 20px" @custom-event="handleCustomEvent">
-        <h3>Teste de $emit (Comunicação de Eventos)</h3>
-        <p>A div pai está escutando <code>@custom-event</code>.</p>
-        <!-- Escopo Filho Simulado -->
-        <div
-          :scope="{ component: 'Componente Interno' }"
-          style="
-            padding: 0 15px 15px 15px;
-            border: 2px dashed silver;
-            margin-top: 10px;
-          "
-        >
-          <p>Nome interno: <strong :text="component"></strong></p>
-          <button
-            @click="
-              $emit(
-                'custom-event',
-                { message: `Mensagem enviada do ${component}` },
-              )
-            "
-          >
-            Disparar evento para o pai
-          </button>
-        </div>
-      </div>
-    </div>
-  </body>
-</html>

package/publish.js DELETED Viewed

@@ -1,34 +0,0 @@
-import { resolve } from 'node:path'
-import { copyFileSync, readFileSync, writeFileSync } from 'node:fs'
-const root = process.cwd()
-const source = resolve(root, 'package.json')
-const target = resolve(root, 'dist/package.json')
-const pkgInfo = JSON.parse(readFileSync(source, 'utf8'))
-// 1. Remove campos que não são necessários no pacote publicado
-delete pkgInfo.scripts
-delete pkgInfo.devDependencies
-// 2. Ajusta os caminhos dos arquivos, pois o root do pacote agora será a pasta dist/
-pkgInfo.main = 'index.umd.js'
-pkgInfo.module = 'index.es.js'
-pkgInfo.types = 'index.d.ts'
-pkgInfo.exports = {
-  '.': {
-    import: './index.es.js',
-    require: './index.umd.js',
-    types: './index.d.ts',
-  },
-}
-// 3. Salva o package.json modificado dentro da pasta dist/
-writeFileSync(target, JSON.stringify(pkgInfo, null, 2))
-// 4. Copia arquivos de metadados importantes para o NPM
-copyFileSync(resolve(root, 'README.md'), resolve(root, 'dist/README.md'))
-copyFileSync(resolve(root, 'LICENSE'), resolve(root, 'dist/LICENSE'))
-console.log(
-  '✅ Arquivo package.json mínimo e metadados preparados na pasta dist/',
-)

package/src/evaluator.ts DELETED Viewed

@@ -1,29 +0,0 @@
-export function evaluate(
-  expression: string,
-  context: Record<string, any> = {},
-) {
-  try {
-    const fn = new Function(`with(this) { return ${expression} }`)
-    return fn.call(context)
-  } catch {
-    return undefined
-  }
-}
-export function evaluateEvent(
-  $event: Event,
-  expression: string,
-  context: Record<string, any> = {},
-) {
-  try {
-    const exp = expression.trim()
-    const isIdentifier = /^[a-zA-Z_$][0-9a-zA-Z_$.]*$/.test(exp)
-    const code = `${exp} instanceof Function ? ${exp}.call(this, $event) : ${exp}`
-    const result = isIdentifier ? code : exp
-    const fn = new Function('$event', `with(this) { ${result} }`)
-    fn.call(context, $event)
-  } catch {
-    console.warn(`[jsweb/ui] Error evaluating event: ${expression}`)
-  }
-}

package/src/index.ts DELETED Viewed

@@ -1,10 +0,0 @@
-import { reactive, watch } from './reactivity'
-import { createScope } from './parser'
-export { reactive, watch, createScope }
-if (typeof window !== 'undefined') {
-  const w = window as any
-  w.jsweb = w.jsweb || {}
-  w.jsweb.ui = { createScope, reactive, watch }
-}