v0.8.0

• Adds $getter, $setter and $property CTFs. These CTFs allows retaining reactivity and tracking for signals and memo refs when being assigned to objects.

let count = $signal(0);
const message = $memo(`Count: ${count}`);

const obj = {
  count: $property(count),
  message: $property(message),
};

import { createMemo as _createMemo } from "solid-js";
import { createSignal as _createSignal } from "solid-js";

let [_count, _setcount] = _createSignal(0);

const _message = _createMemo(() => `Count: ${_count()}`);

const obj = {
  get count() {
    return _count();
  },

  set count(_value) {
    return _setcount(() => _value);
  },

  get message() {
    return _message();
  }

};

You can read more about it here: https://github.com/LXSMNSYC/babel-plugin-solid-labels/blob/main/docs/ctf.md#reactive-properties

• Fix auto-arrow expressions (e.g. $memo) to inline function calls of zero arity. Previously, $memo(someCall()) produces createMemo(() => someCall()), now it produces createMemo(someCall).
• Add names to @effect, @computed and @renderEffect. Strings that comes after the pragma are treated as their debug names, respectively.

// @signal
let x = 0;

/* @effect Effect Log */ {
  console.log('Count', x);
}
/* @computed Computed Log */ {
  console.log('Count', x);
}
/* @renderEffect Render Effect Log */ {
  console.log('Count', x);
}

import { createRenderEffect as _createRenderEffect } from "solid-js";
import { createComputed as _createComputed } from "solid-js";
import { createEffect as _createEffect } from "solid-js";
import { createSignal as _createSignal } from "solid-js";

//
let [_x, _setx] = _createSignal(0);
/**/


_createEffect(() => {
  console.log('Count', _x());
}, undefined, {
  name: "Effect Log"
});
/**/


_createComputed(() => {
  console.log('Count', _x());
}, undefined, {
  name: "Computed Log"
});
/**/


_createRenderEffect(() => {
  console.log('Count', _x());
}, undefined, {
  name: "Render Effect Log"
});

• Add names to effect, computed and renderEffect labels. To name them, simply add another labeled statement directly after the labels.

function Counter() {
  signal: x = 0;

  effect: effectLog: {
    console.log('Count', x);
  }
  computed: computedLog: {
    console.log('Count', x);
  }
  renderEffect: renderEffectLog: {
    console.log('Count', x);
  }
}

import { createRenderEffect as _createRenderEffect } from "solid-js";
import { createComputed as _createComputed } from "solid-js";
import { createEffect as _createEffect } from "solid-js";
import { createSignal as _createSignal } from "solid-js";

function Counter() {
  const [_x, _setx] = _createSignal(0);

  _createEffect(() => {
    console.log('Count', _x());
  }, undefined, {
    name: "effectLog"
  });

  _createComputed(() => {
    console.log('Count', _x());
  }, undefined, {
    name: "computedLog"
  });

  _createRenderEffect(() => {
    console.log('Count', _x());
  }, undefined, {
    name: "renderEffectLog"
  });
}