pzuraq

Class Element Definitions

Stage: 0

Class element definitions (CEDs) are a proposal for extending JavaScript classes with a syntax that mirrors the behavior of Object.defineProperty.

class C {
  x {
 configurable = true;

pzuraq

// The global revision clock. Every time state changes, the clock increments.
let $REVISION = 0;

// The current dependency tracker. Whenever we compute a cache, we create a Set
// to track any dependencies that are used while computing. If no cache is
// computing, then the tracker is null.
let CURRENT_TRACKER = null;

// Storage represents a root value in the system - the actual state of our app.
class Storage {

pzuraq

import Controller from '@ember/controller';

export default class ApplicationController extends Controller {
  if = false;
}

pzuraq

import Component from '@glimmer/component';

export default class extends Component {
}

pzuraq

import Component from '@glimmer/component';
import { inject as service } from '@ember/service';

export default class extends Component {
  @service router;
  
  get qp() {
    return this.router.currentRoute.queryParams.qp || 1; 
  }

pzuraq

import Component from '@glimmer/component';
import { action } from '@ember/object';
import { assert } from '@ember/debug';

export default class TestComp extends Component {
  // constructor() {
  //   super(...arguments)
  //   assert('testValue must be passed in', this.args.testValue);
  // }
  

pzuraq

import Controller from '@ember/controller';

export default class TestController extends Controller {
  // Remove this, and derived starts working
  // model;
  
  get derived() {
    return "The model is " + this.model; 
  }
}

pzuraq

import Controller from '@ember/controller';

export default class ApplicationController extends Controller {
  appName = 'Ember Twiddle';
}

pzuraq

import Component from '@glimmer/component';
import { schedule } from '@ember/runloop';
import { action } from '@ember/object';
import { tracked } from 'tracked-built-ins';
import { cached, trackedReset } from 'tracked-toolbox';

export default class extends Component {
	@trackedReset('args.checked') children = tracked([]);

  constructor() {

pzuraq

<input
  class="checkbox-item"
  id={{@name}}
  type="checkbox"
  checked={{@checked}}
  {{on 'change' (fn this.setChecked (not @checked))}}
  name={{@name}}
  {{set-indeterminate this.isIndeterminate @checked}}
>
<label for={{@name}}>{{@label}}</label>