Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Aug 02 03:11
    pakastin closed #446
  • Aug 02 03:11
    pakastin commented #446
  • Aug 01 20:43
    TroyMcl opened #446
  • Jul 21 05:23
    dependabot[bot] labeled #445
  • Jul 21 05:23
    dependabot[bot] review_requested #445
  • Jul 21 05:23
    dependabot[bot] opened #445
  • Jul 21 05:23

    dependabot[bot] on npm_and_yarn

    Bump terser from 5.14.0 to 5.14… (compare)

  • Jun 22 20:34
    dependabot[bot] labeled #444
  • Jun 22 20:34
    dependabot[bot] review_requested #444
  • Jun 22 20:34
    dependabot[bot] opened #444
  • Jun 22 20:34

    dependabot[bot] on npm_and_yarn

    Bump shell-quote from 1.7.2 to … (compare)

  • Jun 07 10:32

    pakastin on gh-pages

    Updates (compare)

  • Jun 07 10:32

    pakastin on master

    3.29.0 (compare)

  • Jun 07 10:32

    pakastin on v3.29.0

    3.29.0 (compare)

  • Jun 07 10:31

    pakastin on master

    Don't use DOM memoization (compare)

  • May 31 12:58
    pakastin commented #339
  • May 31 11:57
    aarongeorge commented #339
  • May 31 11:53
    pakastin commented #339
  • May 31 11:43
    aarongeorge commented #339
  • May 31 11:22
    pakastin commented #339
Juha Lindstedt
@pakastin
But yeah, maybe should..
Tomer Igal
@tomerigal
@pakastin Hi :smile: what you say about adding support for component instance creation from el function?
something in the form of el(Component, {style: { color: 'red' }});
that bring the ability to pass style and attribute with same api as any html element
Juha Lindstedt
@pakastin
That actually works already
Juha Lindstedt
@pakastin

You can also use:

el(’.parent’, parent => [
  el(’.child’)
]);

😉

Juha Lindstedt
@pakastin
Oh sorry, actually that only works in my future test branch..sorry I remembered I already added that update
I mean middleware works, however it doesn’t use the returned elements/options/text as further arguments
Tomer Igal
@tomerigal

But what about components?
Example:
RE:DOM today:

class Lightbox{
  constructor(props, ...childs){
    const style = Object.assign({color:"red"}, props.style || {});

    this.el = el("div.lightbox", {style}, childs);
  }
}

const app = () => {
  return el("div",
            new Lightbox({ style:{color:"green"} },
                         el("h2", "Lightbox h1")
                        )
         )
}

mount(document.body, app());

With el:

class Lightbox{
  constructor(props, ...childs){
    const style = Object.assign({color:"red"}, props.style || {});

    this.el = el("div.lightbox", {style}, childs);
  }
}

const app = () => {
  return el("div",
            /* new Lightbox... */ el(Lightbox, { style:{color: "green"} }, 
                el("h2", "Lightbox h1")
             )
         )
}

mount(document.body, app());
And it will give better support with the JSX transformer
Juha Lindstedt
@pakastin
I recall FRZR used to support that. I think I can add it back..
Mikko Ahlroth
@Nicd
when creating an el, I can do this: el('li', ['Some text', var, 'more text'])
can I change that dynamically? I tried with setChildren and it exploded due to call stack size exceeded
Mikko Ahlroth
@Nicd
I worked around it for now by constructing the whole element again: unmount(parent, elem); elem = el('li', this._getChildElems()); mount(parent, elem);
because if I did setChildren(elem, this.getChildElems()); it recursed forever and died
Juha Lindstedt
@pakastin
I don't quite get what do you mean?
you can also do el('li', 'Some text', var, 'more text') btw.. ;)
setChildren only allows Nodes or components as children, not Strings..
What are you trying to do?
you can do for example setChildren(elem, ['some text', var, 'more text'].map(text))..
import { text } from 'redom' I mean..
Juha Lindstedt
@pakastin
import { text } from 'redom';
...
setChildren(elem, ['some text', var, 'more text'].map(text));
Mikko Ahlroth
@Nicd
well my point was that I had to change a text that had dynamic content inside it
so I made my element with el('li', this._getChildElems()) and the child elems function returned a dynamic list of strings and elements. like ['Some text', el(...), 'some more text']
and that worked with the el but not setChildren, but I will use that text function :)
thanks!
Juha Lindstedt
@pakastin
👍
yeah, setChildren and mount are helpers for appendChild/insertBefore, so they need Node / component..
el is a bit different, since it's document.createElement helper..
Juha Lindstedt
@pakastin
you could also do a list of <span> components..
however it's quite fast to just use text nodes and setChildren as well..
Mikko Ahlroth
@Nicd
I know I can give list elements context in the list update, but can I give context right at the start so it goes in the constructor?
Juha Lindstedt
@pakastin
Yup!
Mikko Ahlroth
@Nicd
like: this.topLangList = list('div', CombinedLevelProgressComponent); -- can I give CombinedLevelProgressComponent constructor arguments that are given to each item?
Juha Lindstedt
@pakastin
list(View, key, initData)
Mikko Ahlroth
@Nicd
ah, obviously
Juha Lindstedt
@pakastin
new View(initData, item) 😉
Mikko Ahlroth
@Nicd
like list('div', new View({data}, CombinedLevelProgressComponent));?
Mikko Ahlroth
@Nicd
https://files.gitter.im/code-stats/Lobby/aBOs/Screen-Shot-2018-02-19-at-22.43.23.png -- first working thingie on profile page, live updates, made with RE:DOM :)
lots more to come
thanks again for the quick help!
Juha Lindstedt
@pakastin
No worries! 😉
Mikko Ahlroth
@Nicd
can a RE:DOM component return two DOM elements without nesting them inside a wrapper? :P I guess not
MrSorcus
@MrSorcus

can a RE:DOM component return two DOM elements without nesting them inside a wrapper? :P I guess not

redom/redom#93 - Did you read this?

Mikko Ahlroth
@Nicd
cool, not directly related though. I just refactored my code and then noticed CSS Grid doesn't work like I wanted it to
so in the end I don't need the feature anyway :P
I thought I could hide DOM elements with CSS Grid template-areas, but it doesn't work that way
Juha Lindstedt
@pakastin
I've thought about that (multiple elements inside this.el), but let's see..
nawfalhasan
@nawfalhasan
I am totally new to web development. Was doing some basic internet research on js frameworks to choose from. It's a hobby project, so I can expermint. Have a question on redom
Is it suitable for SPA? Redom looks pretty basic view library and I am not sure if it gives my application an architecture. Also, what about routing, state management etc in redom?