v6.9.4- Patch Update

Change Log

• Fixing inconsistences dynamic list with shuffle behavior.
• Reverted the internal engine for dom updates. Found a way to make idiomorph compatible with edge cases like the dynamic list mentioned in the previous item. So this change improve consistency but lowers down the performance a little.

v6.9.3 - Minor Update

Change Log

• Fixing a bug with automatic id's used in the previous diff dom library.

v6.8.1...v6.9.2 - Minor Update

Change Log

• Adding new feature query to access child components from parent.

export default function parentComponent({ main, query }) {
  
  const formValidation = query('form-validation')

  main(() => {
    logComponent()    
  })

  const logComponent = () => {
	formValidation.forEach( component => {
	  component.then( (element:HTMLElement) => console.log(element) )
	})
  }
}

v6.8.0 - Minor Update

Change Log

⚠️ An important change, but one that has no impact on the current API or how Jails is used today.
It replaces the internal idiomorph library with morphdom.

Stability

The morphdom library has proven to be more stable and offers additional options by allowing the use of id or key on dynamic lists, increasing its ability to handle extreme edge cases.

Performance

Additionally, there’s a significant performance difference — in one extreme scenario, morphdom proved to be up to 300% more efficient.

That change also solves the problem of shuffle lists in present in 6.7.0.

v6.7.2 - Patch Update

Change Log

• Avoiding random id's creation on templates to get more benefit of idiomorph dom diffing library.

v6.7.1 - Patch Update

Change Log

The shuffle list bugfix

There was a corner case where, when you have a dynamic list containing jails components with local state on them the scope was not being maintained. The working example can be found here: https://stackblitz.com/edit/jails-shuffle-list?file=index.ts

v6.7.0 - Minor Update

Change Log

• Adding dependencies to the model function. This way, model no longer depend on static imports in order to get information for initial state.

ex.

export const model = ({ elm, initialState, dependencies }) : Model => {

  // initialState is retrieved from : <my-component html-model="{name: 'my-name'}">
  // <my-component data-counter="10">
  
const counter = Number(elm.dataset.counter) 
  return {
    counter
  }
}

More here: https://jails-js.org/about/docs/reference/components#model-object

v6.6.0 - Minor Update

Change Log

Adding new helper effect.

Motivation

Jails components updates child components when parent state changes.
That creates a side-effect on child components.

The helper effect can be used to get parent props and override them or compose them with new values.
Plus, effect can be a sync or an async function.

Ex: ( Parent and children has a prop called count in this example )

import { type Component } from 'jails-js'

export default function childComponent({ main, effect }: Component ) {

	main(() => {
		// do something here...
	})

	effect(async (props) => {
         // take the parent count and add + 1
		await new Promise(resolve => setTimeout(resolve, 1000))
		props.count = props.count + 1
	})

}

export const model = {
	count: 0
}

v6.5.4 - v6.5.5 - Patch Update

Change Log

• Avoiding undefined and null outputs on internal template system.

v6.5.3 - Patch Update

Change Log

• Fixed bug on async pub/sub calls when using non-object values.