v1 documentation

[LeviSchuck]

Until all the beautiful docs are updated, I figure it would be nice to have a place where the core breaking changes are documented.

So far from looking at commits since mid August, I've observed the following:

1. Moon.component is now Moon.extend
2. instead of el, it is root when creating a moon app
3. instead of the m-model attribute, it is now named m-bind
4. Any plugins or other things that access the internal attributes like $children now use a version without $
5. SVG stuff now just is called SVG instead of isSVG
6. To say that an element is text type, it was TEXT_TYPE, but now the shorter literal "#text" is used

There's a couple things that I don't quite know about, like dynamic and functional when it comes to component things.

What other bumps are there in transitioning?

[kbrsh]

Well, you're right about most of them, except number 6. I simply removed a constant called TEXT_TYPE. It was just an alias for "#text".

Some other things are:

1. You can mount a component with the constructor:

   new MyComponent({
     root: "#target",
     props: {}
   });

2. The m-static directive
3. No support for custom key codes

[LeviSchuck]

It looks like callMethod was removed too.
I have to do instance.get('methodhere')(params);

[kbrsh]

Ahh yes. This is still being worked on and I'm thinking of more ways to make it efficient. I'm thinking maybe:

// Can be called anything
instance.methods.foo();

// Cannot conflict with internal methods/properties
instance.foo();

[Bampye]

And m-html is gone too.

[kbrsh]

Yup @Bampye. It was just syntactic sugar for setting a DOM property. You can now manually set it with:

<div m-literal:innerHTML.dom="rawHTML"></div>

[kbrsh]

Another thing: .set can now accept an object.

// Shallow merge with data and notifies observer
instance.set({
  foo: true,
  bar: [1, 2, 3]
});

[rizrmd]

It seems component slot is breaking.
When I put <slot></slot> in component template, it just render as <slot></slot>.

[kbrsh]

@rizkyramadhan They were replaced by an insert system (to not collide with web components). So slots are now replaced with <m-insert> elements. Right now there are no named inserts (so no <m-insert name="foo">), but I might add them later.

[russelg]

In regards to that .set change, it should probably be mentioned the old keypath method (i.e .set('obj.prop.nested')) does not work anymore.

[kbrsh]

DOM properties are now set with a new directive: m-dom. It's a replacement for m-literal:prop.dom. Also, static elements are marked with a flag along with being hoisted.

These both were added in e620897.

[kbrsh]

Moon v1 has branched off further than what is discussed here. Refer to the new docs.