Use plain functions as modifiers. Polyfill for RFC: 757 | Default Modifier Manager

Related tags

Learning resource ember-functions-as-modifiers-polyfill
Overview

ember-functions-as-modifiers-polyfill

npm version CI

Use plain functions as modifiers. Polyfill for RFC: 757 | Default Modifier Manager

Compatibility

  • Ember.js v3.25 or above
  • Ember CLI v3.25 or above
  • Node.js v14 or above
  • ember-auto-import v1 or above
  • embroider-optimized

Installation

ember install ember-functions-as-modifiers-polyfill

Usage

Define a function (doesn't have to be in a component)

import Component  from '@glimmer/component';

export default class MyComponent extends Component {
  myModifier = (element, x) => {
    let handler = () => console.log(x);

    element.addEventListener('click', handler);

    return () => element.removeEventListener('click', handler);
  }
<div {{this.myModifier 3}}>
^ prints 6 when clicked

Named arguments will all be grouped together in the last argument of the helper:

import Component  from '@glimmer/component';

export default class MyComponent extends Component {
  doStuff = (element, x, options) => {
    let handler = () => console.log(x, options.optionA, options.optionB);

    element.addEventListener('click', handler);

    return () => element.removeEventListener('click', handler);
  };
}
<div {{this.doStuff 3 optionA=2 optionB=3}}>

Contributing

See the Contributing guide for details.

License

This project is licensed under the MIT License.

Comments
Releases(v1.0.0)
Owner
I like code.
null
GitHub
A devtool improve your pakage manager use experience no more care about what package manager is this repo use; one line, try all.

pi A devtool improve your pakage manager use experience no more care about what package manager is this repo use; one line, try all. Stargazers over t

tick 11 Nov 1, 2022
Grupprojekt för kurserna 'Javascript med Ramverk' och 'Agil Utveckling'

JavaScript-med-Ramverk-Laboration-3 Grupprojektet för kurserna Javascript med Ramverk och Agil Utveckling. Utvecklingsguide För information om hur utv

Svante Jonsson IT-Högskolan 3 May 18, 2022
Dynamically resize, format and optimize images based on url modifiers.

Local Image Sharp Dynamically resize, format and optimize images based on url modifiers. Table of Contents ✨ Features ?? Installation ?? Usage Contrib

Strapi Community 30 Nov 29, 2022
Hemsida för personer i Sverige som kan och vill erbjuda boende till människor på flykt

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

null 4 May 3, 2022
Kurs-repo för kursen Webbserver och Databaser

Webbserver och databaser This repository is meant for CME students to access exercises and codealongs that happen throughout the course. I hope you wi

null 14 Jan 3, 2023
Group together Tailwind CSS modifiers like focus, peer-checked, dark:hover and more with HTML attributes 👩‍🚀

Tailwind CSS Group Classes Group together Tailwind CSS modifiers like focus, peer-checked, dark:hover and more with HTML attributes ??‍?? Using with a

Mark Mead 5 Sep 15, 2022
Combine type and value imports using Typescript 4.5 type modifier syntax

type-import-codemod Combines your type and value imports together into a single statement, using Typescript 4.5's type modifier syntax. Before: import

Ian VanSchooten 4 Sep 29, 2022
Calculate the Mexican RFC as specified by the SAT (Servicio de Administración Tributaria) for Personas Físicas

About The Project This project calculates a "Persona Física"'s RFC based on SAT's specifications including homonymy and verification digit. Built With

null 4 Nov 6, 2022
Plain JavaScript version of jQuery's slideToggle(), slideDown(), & slideUp(), but does not use display: none.

dom-slider It works like jQuery's slideToggle(), slideDown(), & slideUp(), but does not use display: none. Uses CSS3 transitions and element.scrollHei

Brenton Cozby 56 Dec 27, 2022
Meogic-tab-manager is an extensible, headless JavaScript tab manager framework.

MeogicTabManager English document MeogicTabManager是一个有可拓展性的、headless的JavaScript标签页管理框架。 MeogicTabManager旨在提供可自由组装页面框架、自定义页面组件、甚至覆盖框架自带事件响应的开发体验。 Meogi

meogic-tech 5 Oct 8, 2022
Functions Recipes is a library of examples to help you getting started with Salesforce Functions and get used to their main features.

Functions Recipes Introduction Salesforce Functions lets you use the Salesforce Platform for building event-driven, elastically scalable apps and expe

Trailhead Apps 172 Dec 29, 2022
Polyfill to remove click delays on browsers with touch UIs

FastClick FastClick is a simple, easy-to-use library for eliminating the 300ms delay between a physical tap and the firing of a click event on mobile

FT Labs 18.8k Jan 2, 2023
Javascript client for Sanity. Works in node.js and modern browsers (older browsers needs a Promise polyfill).

@sanity/client Javascript client for Sanity. Works in node.js and modern browsers (older browsers needs a Promise polyfill). Requirements Sanity Clien

Sanity 23 Nov 29, 2022
PouchDB for Deno, leveraging polyfill for IndexedDB based on SQLite.

PouchDB for Deno PouchDB for Deno, leveraging polyfill for IndexedDB based on SQLite. Usage import PouchDB from 'https://deno.land/x/[email protected]

Aaron Huggins 19 Aug 2, 2022
Window.fetch polyfill

window.fetch polyfill This project adheres to the [Open Code of Conduct][code-of-conduct]. By participating, you are expected to uphold this code. [co

null 38 Sep 11, 2020
Polyfill `error.cause`

Polyfill error.cause. error.cause is a recent JavaScript feature to wrap errors. try { doSomething() } catch (cause) { throw new Error('message',

ehmicky 4 Dec 15, 2022
A polyfill for ES6-style Promises

ES6-Promise (subset of rsvp.js) This is a polyfill of the ES6 Promise. The implementation is a subset of rsvp.js extracted by @jakearchibald, if you'r

Stefan Penner 7.3k Dec 28, 2022
Fast and lightweight dependency-free vanilla JavaScript polyfill for native lazy loading / the awesome loading='lazy'-attribute.

loading="lazy" attribute polyfill Fast and lightweight vanilla JavaScript polyfill for native lazy loading, meaning the behaviour to load elements rig

Maximilian Franzke 571 Dec 30, 2022
This is an unofficial front end for Hacker News, reminiscent of the Windows XP era Outlook email client on a Windows XP default desktop

Hacker XP Hacker News styled as the Windows XP Outlook email client. Try out Hacker XP here! Description This is an unofficial front end for Hacker Ne

null 19 Jul 12, 2022