From 040424dc38aaee0f8a15843537bb3336afdc3c32 Mon Sep 17 00:00:00 2001 From: bistin Date: Sun, 9 Oct 2022 23:44:27 +0800 Subject: [PATCH] update syntax to current ember --- addon/dist/components/grid-item.js | 10 ++++----- addon/src/components/grid-item.js | 6 +++--- docs/.prettierrc.js | 10 ++++++++- docs/app/controllers/index.js | 34 ++++++++++++++++++------------ 4 files changed, 37 insertions(+), 23 deletions(-) diff --git a/addon/dist/components/grid-item.js b/addon/dist/components/grid-item.js index acc93d9..552728c 100644 --- a/addon/dist/components/grid-item.js +++ b/addon/dist/components/grid-item.js @@ -2,13 +2,13 @@ import { _ as _applyDecoratedDescriptor, a as _initializerDefineProperty } from import { _ as _defineProperty } from '../defineProperty-f419f636.js'; import { setComponentTemplate } from '@ember/component'; import { hbs } from 'ember-cli-htmlbars'; -import { computed, action } from '@ember/object'; +import { action } from '@ember/object'; import Component from '@glimmer/component'; -import { tracked } from '@glimmer/tracking'; +import { tracked, cached } from '@glimmer/tracking'; var TEMPLATE = hbs("{{!-- template-lint-disable --}}\n\n {{yield}}\n\n\n\n"); -var _dec, _class, _descriptor; +var _class, _descriptor; function getScrollParent(el) { let returnEl; @@ -39,7 +39,7 @@ function getScrollParent(el) { */ -let GridItem = (_dec = computed('args.pos.{x,y,w,h}', 'args.grid.containerWidth'), (_class = class GridItem extends Component { +let GridItem = (_class = class GridItem extends Component { constructor(...args) { super(...args); @@ -172,7 +172,7 @@ let GridItem = (_dec = computed('args.pos.{x,y,w,h}', 'args.grid.containerWidth' initializer: function () { return !this.args.handle; } -}), _applyDecoratedDescriptor(_class.prototype, "itemPosition", [_dec], Object.getOwnPropertyDescriptor(_class.prototype, "itemPosition"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "insertAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "insertAction"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "dragStartAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "dragStartAction"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "dragMoveAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "dragMoveAction"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "dragEndAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "dragEndAction"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "mouseOverAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "mouseOverAction"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "mouseLeaveAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "mouseLeaveAction"), _class.prototype)), _class)); +}), _applyDecoratedDescriptor(_class.prototype, "itemPosition", [cached], Object.getOwnPropertyDescriptor(_class.prototype, "itemPosition"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "insertAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "insertAction"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "dragStartAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "dragStartAction"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "dragMoveAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "dragMoveAction"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "dragEndAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "dragEndAction"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "mouseOverAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "mouseOverAction"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "mouseLeaveAction", [action], Object.getOwnPropertyDescriptor(_class.prototype, "mouseLeaveAction"), _class.prototype)), _class); setComponentTemplate(TEMPLATE, GridItem); export { GridItem as default }; diff --git a/addon/src/components/grid-item.js b/addon/src/components/grid-item.js index 9e9cbc1..767e072 100644 --- a/addon/src/components/grid-item.js +++ b/addon/src/components/grid-item.js @@ -1,6 +1,6 @@ -import { action, computed } from '@ember/object'; +import { action } from '@ember/object'; import Component from '@glimmer/component'; -import { tracked } from '@glimmer/tracking'; +import { tracked, cached } from '@glimmer/tracking'; function getScrollParent(el) { let returnEl; @@ -35,7 +35,7 @@ export default class GridItem extends Component { handle = this.args.handle; @tracked canDrag = !this.args.handle; - @computed('args.pos.{x,y,w,h}', 'args.grid.containerWidth') + @cached get itemPosition() { if (!this.args.pos) { return ''; diff --git a/docs/.prettierrc.js b/docs/.prettierrc.js index 534e6d3..a01cad0 100644 --- a/docs/.prettierrc.js +++ b/docs/.prettierrc.js @@ -1,5 +1,13 @@ 'use strict'; module.exports = { - singleQuote: true, + singleQuote: true, + arrowParens: 'always', + bracketSpacing: true, + printWidth: 100, + proseWrap: 'preserve', + semi: true, + tabWidth: 4, + trailingComma: 'all', + useTabs: false, }; diff --git a/docs/app/controllers/index.js b/docs/app/controllers/index.js index 540fb81..73111d2 100644 --- a/docs/app/controllers/index.js +++ b/docs/app/controllers/index.js @@ -1,6 +1,8 @@ import Controller from '@ember/controller'; -import { compact, moveElement } from 'ember-grid-layout/utils'; -import { setProperties, action } from '@ember/object'; +import { compact } from 'ember-grid-layout/utils'; +import { action } from '@ember/object'; +import { tracked } from '@glimmer/tracking'; +import { next } from '@ember/runloop'; import 'ember-grid-layout/styles/grid-layout.css'; let i = 10; @@ -13,26 +15,30 @@ let layout = [ layout = compact(layout, 'vertical', 12); -const wrappedLayout = layout.map((d, i) => ({ - data: i, - position: d, -})); +class Layout { + @tracked position; + data = null; + constructor(position, data) { + this.data = data; + this.position = position; + } +} + +const wrappedLayout = layout.map((d, i) => new Layout(d, i)); export default class IndexController extends Controller { compactType = 'vertical'; preventCollision = true; cols = 2; - width = 555; + @tracked width = 555; wrappedLayout = wrappedLayout; - init() { - super.init(...arguments); - } - @action updatePosition(newLayout, moving) { - this.wrappedLayout.forEach((d, i) => { - setProperties(d.position, newLayout[i]); + next(this, function () { + this.wrappedLayout.forEach((d, i) => { + d.position = newLayout[i]; + }); }); } @@ -57,6 +63,6 @@ export default class IndexController extends Controller { @action changeWidth() { - this.set('width', this.width * 0.8); + this.width = this.width * 0.8; } }