Skip to content

Instantly share code, notes, and snippets.

Ember's new GJS syntax is now supported by GitHub!

GJS

A boring component:

class ActionButton extends Component {
  <template>
 
@wycats
wycats / spec.md
Created April 25, 2023 15:26
A "Spec" for Starbeam renderers. It's just really initial thoughts and isn't structured super-well yet.

Starbeam Renderers

Framework Renderer Status Spec Compatibility
React released next release
Preact released next release
Vue next release next release
Svelte designing -
Ember designing -
Solid roadmap -
@wycats
wycats / 1-decorator.md
Last active March 6, 2023 23:23
Thoughts on readonly accessor decorators in TypeScript

Getter-Only Auto-Accessor Decorators

Broadly speaking, the idea is that you should be able to create an accessor decorator that doesn't expose a setter.

I think the most natural way to express this is for the set function returned by an accessor decorator to have a never return type. The idea is that such a decorator would result in the type system treating the resulting field as if it was a manually written getter without a setter.

Here's an example scenario:

import { Friend } from "hypothetical-lib";
{
"public": true
}

October 25, 2022 to November 4, 2022

Generics around missingness

function Name<S extends string | undefined>(name: S): S {
  return name;
}

Making unique-id a importable function

The Use Cases

import { uniqueId } from "@ember/???";

<template>
  {{#let (unique-id) as |id|}}

Factories

A factory is a function that returns a new reactive object.

  • Reactive Factories return reactive objects.
  • Resource Factories also return reactive objects, but they also register cleanup functions that are called when the object is no longer needed.

You can use a class as a factory, but it's not required. When you use a class as a factory, its constructor must take zero required arguments.

I'm assuming these are all talking about cases that didn't already have semis:

Top-Level TemplateDeclaration

<template>
  Hello
</template>|
//         ^ 🚫
@wycats
wycats / 1-unannotated.jsx
Created September 2, 2022 20:03
An explanation of how Starbeam integrates with React 18's reusable state (https://github.com/reactwg/react-18/discussions/19)
import { Cell } from "@starbeam/core";
import { useSetup } from "@starbeam/react";
const SYSTEM_LOCALE = Intl.DateTimeFormat().resolvedOptions().locale;
const SYSTEM_TZ = Intl.DateTimeFormat().resolvedOptions().timeZone;
function Clock({ locale = SYSTEM_LOCALE, timeZone = SYSTEM_TZ }) {
const now = useSetup((component) => {
const now = Cell(new Date()));
import Component from '@glimmer/component';
export default class extends Component {
}