dozjs / doz Goto Github PK

if there are spaces characters after the wrapper tag of the loop, the loop fails and it returns a string like this "[object Object],[object Object],[object Object]...".

Is there a sitemap plugin already?

When function "drawnDynamic" is called, parent property is set to wrong parent.

it is not drawn and the tag is duplicated

if you update props before mount on DOM should not calling render method...

propsConvert and propsComputed work only if the property propsConvertOnFly/propsComputedOnFly is set true

Sometimes it could be useful.
Like so:

    propsToAttributes() {
        let out = '';
        Object.keys(this.props).forEach(name => {
            out += `${name}="${this.decode(this.props[name])}" `;
        });
        return out;
    }

<img ${this.propsToAttributes()} 

I need to decode HTML entities

    decode(str) {
        decoder = decoder || document.createElement('textarea');
        decoder.innerHTML = str;
        return decoder.value;
    }

Taking inspiration from this https://github.com/Heydon/cress it could be an idea to reset the style for each child components prepending this:

[data-uid="1"],
[data-uid="1"] * { 
  all: initial 
}

This is incomplete:
https://github.com/dozjs/doz/blob/master/src/proxy.js#L17

I need to add this too:

               .replace(/'/g, ''')
               .replace(/`/g, '`')

When set a props with 0 number, the bind don't work.

Please fix it

If a component has not a scoped style declared the data-uid will be undefined

Update for a select bind to a prop fails with dynamic options.
Maybe it happens with numeric values...

specials attributes d-bind d-ref appear on rendering of html as dbind, dref

It might be useful to pass the props object as an argument to the template function.
Like:

template(h, props)  {
    return h`
          <div>${props.name}</div>
    `
} 

The comments are not considered.

This
/*.grid-row img { }*/
is converted to

[data-uid=...] /*.grid-row img { }*/

The component style does not support the short definition like:

<style>
.my-class {
    animation: 1s blink ease infinite;
}
</style>

this works:

<style>
.my-class {
    animation-name: blink;
    animation-duration: 1s;
    animation-timing-function: ease;
    animation-iteration-count: infinite;
}
</style>

<a data-router-link="true" datarouterlink="true">home</a>

why?