Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 9 additions & 15 deletions docs/app/components/snippets/content-events-1.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import Component from '@glimmer/component';
import { action } from '@ember/object';
import { runTask, cancelTask } from 'ember-lifeline';
import { task, timeout } from 'ember-concurrency';

export default class extends Component {
notifications = [
Expand All @@ -17,23 +17,17 @@ export default class extends Component {

@action
open(dropdown) {
if (this.closeTimer) {
cancelTask(this, this.closeTimer);
this.closeTimer = null;
} else {
dropdown.actions.open();
}
this.closeLaterTask.cancelAll();
dropdown.actions.open();
}

@action
closeLater(dropdown) {
this.closeTimer = runTask(
this,
() => {
this.closeTimer = null;
dropdown.actions.close();
},
200,
);
this.closeLaterTask.perform(dropdown);
}

closeLaterTask = task(async (dropdown) => {
await timeout(200);
dropdown.actions.close();
});
}
35 changes: 0 additions & 35 deletions docs/app/controllers/public-pages/docs/content-events.js
Original file line number Diff line number Diff line change
@@ -1,41 +1,6 @@
import Controller from '@ember/controller';
import { runTask, cancelTask } from 'ember-lifeline';
Comment thread
mkszepp marked this conversation as resolved.
import { action } from '@ember/object';
import ContentEvents1Component from '../../../components/snippets/content-events-1';

export default class extends Controller {
contentEvents1Component = ContentEvents1Component;

notifications = [
{ text: 'Edward' },
{ text: 'Jonathan' },
{ text: 'Tom' },
{ text: 'Eric' },
];

prevent(e) {
return e.stopImmediatePropagation();
}

@action
open(dropdown) {
if (this.closeTimer) {
cancelTask(this, this.closeTimer);
this.closeTimer = null;
} else {
dropdown.actions.open();
}
}

@action
closeLater(dropdown) {
this.closeTimer = runTask(
this,
() => {
this.closeTimer = null;
dropdown.actions.close();
},
200,
);
}
}
1 change: 0 additions & 1 deletion docs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,6 @@
"ember-code-snippet": "git://github.com/ef4/ember-code-snippet.git#d054b697098ad52481c94a952ccf8d89ba1f25fe",
"ember-concurrency": "^4.0.4",
"ember-fetch": "^8.1.2",
"ember-lifeline": "^7.0.0",
"ember-load-initializers": "^3.0.1",
"ember-modifier": "^4.2.0",
"ember-page-title": "^9.0.1",
Expand Down
1 change: 0 additions & 1 deletion ember-basic-dropdown/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,6 @@
"decorator-transforms": "^2.3.0",
"ember-element-helper": "^0.8.7",
"ember-modifier": "^4.2.0",
"ember-lifeline": "^7.0.0",
"ember-style-modifier": "^4.4.0",
"ember-truth-helpers": "^4.0.3"
},
Expand Down
37 changes: 12 additions & 25 deletions ember-basic-dropdown/src/components/basic-dropdown-content.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ import hasMoved from '../utils/has-moved.ts';
import { isTesting } from '@embroider/macros';
import { modifier } from 'ember-modifier';
import type { Dropdown, TRootEventType } from './basic-dropdown.ts';
import { runTask } from 'ember-lifeline';

export interface BasicDropdownContentSignature {
Element: Element;
Expand Down Expand Up @@ -205,11 +204,8 @@ export default class BasicDropdownContent extends Component<BasicDropdownContent
);
}

window.addEventListener('resize', this.runloopAwareRepositionBound);
window.addEventListener(
'orientationchange',
this.runloopAwareRepositionBound,
);
window.addEventListener('resize', this.repositionBound);
window.addEventListener('orientationchange', this.repositionBound);

if (this.isTouchDevice) {
document.addEventListener(
Expand Down Expand Up @@ -350,7 +346,7 @@ export default class BasicDropdownContent extends Component<BasicDropdownContent
}

if (shouldReposition) {
this.runloopAwareReposition();
this.reposition();
}
});
this.mutationObserver.observe(dropdownElement, {
Expand Down Expand Up @@ -405,31 +401,22 @@ export default class BasicDropdownContent extends Component<BasicDropdownContent
}

@action
runloopAwareReposition(): void {
reposition(): void {
if (!this.args.dropdown) {
return;
}

runTask(this, () => {
Comment thread
mkszepp marked this conversation as resolved.
if (!this.args.dropdown) {
return;
}

this.args.dropdown.actions.reposition();
});
this.args.dropdown.actions.reposition();
}

@action
removeGlobalEvents(): void {
window.removeEventListener('resize', this.runloopAwareRepositionBound);
window.removeEventListener(
'orientationchange',
this.runloopAwareRepositionBound,
);
window.removeEventListener('resize', this.repositionBound);
window.removeEventListener('orientationchange', this.repositionBound);
}

touchMoveHandlerBound = (e: TouchEvent) => this.touchMoveHandler(e);
runloopAwareRepositionBound = () => this.runloopAwareReposition();
repositionBound = () => this.reposition();
touchStartHandlerBound = () => this.touchStartHandler();

// Methods
Expand Down Expand Up @@ -522,15 +509,15 @@ export default class BasicDropdownContent extends Component<BasicDropdownContent
// These two functions wire up scroll handling if `preventScroll` is false.
// These trigger reposition of the dropdown.
addScrollEvents(): void {
window.addEventListener('scroll', this.runloopAwareRepositionBound);
window.addEventListener('scroll', this.repositionBound);
this.scrollableAncestors.forEach((el) => {
el.addEventListener('scroll', this.runloopAwareRepositionBound);
el.addEventListener('scroll', this.repositionBound);
});
}
removeScrollEvents(): void {
window.removeEventListener('scroll', this.runloopAwareRepositionBound);
window.removeEventListener('scroll', this.repositionBound);
this.scrollableAncestors.forEach((el) => {
el.removeEventListener('scroll', this.runloopAwareRepositionBound);
el.removeEventListener('scroll', this.repositionBound);
});
}
}
Expand Down
5 changes: 3 additions & 2 deletions ember-basic-dropdown/src/components/basic-dropdown.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';
import { guidFor } from '@ember/object/internals';
import { scheduleTask } from 'ember-lifeline';
import calculatePosition from '../utils/calculate-position.ts';
import type {
CalculatePosition,
Expand All @@ -12,6 +11,7 @@ import type {
} from '../utils/calculate-position.ts';
import { getOwner } from '@ember/application';
import type Owner from '@ember/owner';
import { schedule } from '@ember/runloop';
Comment thread
mkszepp marked this conversation as resolved.
import type { ComponentLike } from '@glint/template';
import type { BasicDropdownTriggerSignature } from './basic-dropdown-trigger.ts';
import type { BasicDropdownContentSignature } from './basic-dropdown-content.ts';
Expand Down Expand Up @@ -166,7 +166,8 @@ export default class BasicDropdown extends Component<BasicDropdownSignature> {
this._previousDisabled !== UNINITIALIZED &&
this._previousDisabled !== newVal
) {
scheduleTask(this, 'actions', () => {
// eslint-disable-next-line ember/no-runloop
schedule('actions', () => {
if (newVal && this.publicAPI.isOpen) {
// eslint-disable-next-line ember/no-side-effects
this.isOpen = false;
Expand Down
38 changes: 6 additions & 32 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 0 additions & 1 deletion test-app/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,6 @@
"ember-cli-sri": "^2.1.1",
"ember-cli-terser": "^4.0.2",
"ember-fetch": "^8.1.2",
"ember-lifeline": "^7.0.0",
"ember-load-initializers": "^3.0.1",
"ember-modifier": "^4.2.0",
"ember-page-title": "^9.0.1",
Expand Down
4 changes: 1 addition & 3 deletions test-app/tests/integration/components/basic-dropdown-test.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import { scheduleTask } from 'ember-lifeline';
import { registerDeprecationHandler } from '@ember/debug';
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
Expand Down Expand Up @@ -675,8 +674,7 @@ module('Integration | Component | basic-dropdown', function (hooks) {

this.isDisabled = false;
this.toggleDisabled = () => this.toggleProperty('isDisabled');
this.registerAPI = (api) =>
scheduleTask(this, 'actions', () => this.set('remoteController', api));
this.registerAPI = (api) => this.set('remoteController', api);
await render(hbs`
<BasicDropdown @disabled={{this.isDisabled}} @registerAPI={{this.registerAPI}} as |dropdown|>
<dropdown.Trigger>Click me</dropdown.Trigger>
Expand Down
29 changes: 11 additions & 18 deletions test-app/tests/integration/components/content-test.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { runTask } from 'ember-lifeline';
import { hbs } from 'ember-cli-htmlbars';
import { render, click, triggerEvent, settled } from '@ember/test-helpers';

Expand Down Expand Up @@ -563,13 +562,11 @@ module('Integration | Component | basic-dropdown-content', function (hooks) {
<div id="content-target-div"></div>
</BasicDropdownContent>
`);
await runTask(this, () => {
let target = this.element
.getRootNode()
.querySelector('#content-target-div');
let span = document.createElement('SPAN');
target.appendChild(span);
});
let target = this.element
.getRootNode()
.querySelector('#content-target-div');
let span = document.createElement('SPAN');
target.appendChild(span);
await settled();
assert.strictEqual(repositions, 2, 'It was repositioned twice');
});
Expand All @@ -595,9 +592,7 @@ module('Integration | Component | basic-dropdown-content', function (hooks) {
{{/if}}
</BasicDropdownContent>
`);
await runTask(this, () => {
this.set('divVisible', true);
});
this.set('divVisible', true);
await settled();
assert.strictEqual(repositions, 2, 'It was repositioned twice');
});
Expand Down Expand Up @@ -631,13 +626,11 @@ module('Integration | Component | basic-dropdown-content', function (hooks) {
<div id="content-target-div"></div>
</BasicDropdownContent>
`);
runTask(this, () => {
let target = this.element
.getRootNode()
.querySelector('#content-target-div');
let span = document.createElement('SPAN');
target.appendChild(span);
});
let target = this.element
.getRootNode()
.querySelector('#content-target-div');
let span = document.createElement('SPAN');
target.appendChild(span);
});

test('A renderInPlace component is repositioned if the window scrolls', async function (assert) {
Expand Down