dozjs / doz Goto Github PK

The comments are not considered.

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

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

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

Please fix it

it is not drawn and the tag is duplicated

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

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

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

why?

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]...".

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>
    `
} 

Is there a sitemap plugin already?

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 
}

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

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

I need to add this too:

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

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

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

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

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;
    }

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>