Skip to content
Permalink
Browse files

Prettify, configure eslint to use prettier

  • Loading branch information...
Joe Attardi
Joe Attardi committed Sep 14, 2019
1 parent 3c8a0de commit 2856256c433d21acdf4659d2f9c72ab8cebc39a3
Showing with 243 additions and 199 deletions.
  1. +1 −1 .eslintrc.js
  2. +3 −0 .prettierrc
  3. +39 −0 package-lock.json
  4. +3 −1 package.json
  5. +8 −8 src/emoji.js
  6. +12 −12 src/emoji.test.js
  7. +4 −4 src/emojiContainer.js
  8. +6 −6 src/emojiContainer.test.js
  9. +7 −7 src/events.js
  10. +15 −15 src/icons.js
  11. +21 −21 src/index.js
  12. +10 −10 src/preview.js
  13. +12 −12 src/preview.test.js
  14. +2 −2 src/recent.js
  15. +21 −21 src/search.js
  16. +21 −21 src/search.test.js
  17. +22 −22 src/tabs.js
  18. +11 −11 src/tabs.test.js
  19. +1 −1 src/util.js
  20. +12 −12 src/variantPopup.js
  21. +12 −12 src/variantPopup.test.js
@@ -5,7 +5,7 @@ module.exports = {
"node": true,
"jest": true
},
"extends": "eslint:recommended",
"extends": ["eslint:recommended", "plugin:prettier/recommended"],
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
@@ -0,0 +1,3 @@
{
"singleQuote": true
}

Some generated files are not rendered by default. Learn more.

@@ -13,7 +13,7 @@
"prepublishOnly": "rollup -c",
"test": "jest",
"test:watch": "jest --watchAll",
"lint": "eslint src",
"lint": "eslint src/*.js",
"prettify": "prettier src/*.js --write"
},
"author": "Joe Attardi <jattardi@gmail.com> (https://joeattardi.codes)",
@@ -28,6 +28,8 @@
"@babel/core": "^7.5.5",
"@babel/preset-env": "^7.5.5",
"eslint": "^6.4.0",
"eslint-config-prettier": "^6.3.0",
"eslint-plugin-prettier": "^3.1.0",
"jest": "^24.9.0",
"prettier": "^1.18.2",
"rollup": "^1.20.3",
@@ -1,8 +1,8 @@
import { EMOJI, HIDE_PREVIEW, SHOW_PREVIEW } from "./events";
import { save } from "./recent";
import { createElement } from "./util";
import { EMOJI, HIDE_PREVIEW, SHOW_PREVIEW } from './events';
import { save } from './recent';
import { createElement } from './util';

const CLASS_EMOJI = "emoji-picker__emoji";
const CLASS_EMOJI = 'emoji-picker__emoji';

export class Emoji {
constructor(emoji, showVariants, showPreview, events) {
@@ -13,12 +13,12 @@ export class Emoji {
}

render() {
const emojiButton = createElement("button", CLASS_EMOJI);
const emojiButton = createElement('button', CLASS_EMOJI);
emojiButton.innerHTML = this.emoji.e;

emojiButton.addEventListener("click", () => this.onEmojiClick());
emojiButton.addEventListener("mouseover", () => this.onEmojiHover());
emojiButton.addEventListener("mouseout", () => this.onEmojiLeave());
emojiButton.addEventListener('click', () => this.onEmojiClick());
emojiButton.addEventListener('mouseover', () => this.onEmojiHover());
emojiButton.addEventListener('mouseout', () => this.onEmojiLeave());

return emojiButton;
}
@@ -1,23 +1,23 @@
const Emitter = require("tiny-emitter");
const Emitter = require('tiny-emitter');

const { EMOJI, HIDE_PREVIEW, SHOW_PREVIEW } = require("./events");
const { Emoji } = require("./emoji");
const { EMOJI, HIDE_PREVIEW, SHOW_PREVIEW } = require('./events');
const { Emoji } = require('./emoji');

describe("Emoji", () => {
describe('Emoji', () => {
let events;

const testEmoji = { e: "😄", n: "smile" };
const testEmoji = { e: '😄', n: 'smile' };

beforeEach(() => (events = new Emitter()));

test("should render the emoji", () => {
test('should render the emoji', () => {
const emoji = new Emoji(testEmoji, false, false, events);
const element = emoji.render();

expect(element.innerHTML).toEqual(testEmoji.e);
});

test("should emit the EMOJI event when clicked", done => {
test('should emit the EMOJI event when clicked', done => {
const emoji = new Emoji(testEmoji, false, false, events);
const element = emoji.render();

@@ -26,10 +26,10 @@ describe("Emoji", () => {
done();
});

element.dispatchEvent(new MouseEvent("click"));
element.dispatchEvent(new MouseEvent('click'));
});

test("should emit the SHOW_PREVIEW event on mouseover if showPreview is true", done => {
test('should emit the SHOW_PREVIEW event on mouseover if showPreview is true', done => {
const emoji = new Emoji(testEmoji, false, true, events);
const element = emoji.render();

@@ -38,17 +38,17 @@ describe("Emoji", () => {
done();
});

element.dispatchEvent(new MouseEvent("mouseover"));
element.dispatchEvent(new MouseEvent('mouseover'));
});

test("should emit the HIDE_PREVIEW event on mouseout if showPreview is true", done => {
test('should emit the HIDE_PREVIEW event on mouseout if showPreview is true', done => {
const emoji = new Emoji(testEmoji, false, true, events);
const element = emoji.render();

events.on(HIDE_PREVIEW, () => {
done();
});

element.dispatchEvent(new MouseEvent("mouseout"));
element.dispatchEvent(new MouseEvent('mouseout'));
});
});
@@ -1,7 +1,7 @@
import { Emoji } from "./emoji";
import { createElement } from "./util";
import { Emoji } from './emoji';
import { createElement } from './util';

const CLASS_EMOJI_CONTAINER = "emoji-picker__emojis";
const CLASS_EMOJI_CONTAINER = 'emoji-picker__emojis';

export class EmojiContainer {
constructor(emojis, showVariants, events) {
@@ -11,7 +11,7 @@ export class EmojiContainer {
}

render() {
const emojiContainer = createElement("div", CLASS_EMOJI_CONTAINER);
const emojiContainer = createElement('div', CLASS_EMOJI_CONTAINER);
this.emojis.forEach(emoji =>
emojiContainer.appendChild(
new Emoji(emoji, this.showVariants, true, this.events).render()
@@ -1,14 +1,14 @@
const Emitter = require("tiny-emitter");
const Emitter = require('tiny-emitter');

const { EmojiContainer } = require("./emojiContainer");
const { EmojiContainer } = require('./emojiContainer');

describe("EmojiContainer", () => {
test("should render all the given emojis", () => {
const emojis = [{ e: "⚡️" }, { e: "👍" }];
describe('EmojiContainer', () => {
test('should render all the given emojis', () => {
const emojis = [{ e: '⚡️' }, { e: '👍' }];

const events = new Emitter();

const container = new EmojiContainer(emojis, false, events).render();
expect(container.querySelectorAll(".emoji-picker__emoji").length).toBe(2);
expect(container.querySelectorAll('.emoji-picker__emoji').length).toBe(2);
});
});
@@ -1,7 +1,7 @@
export const EMOJI = "emoji";
export const SHOW_TABS = "showTabs";
export const HIDE_TABS = "hideTabs";
export const SHOW_SEARCH_RESULTS = "showSearchResults";
export const SHOW_PREVIEW = "showPreview";
export const HIDE_PREVIEW = "hidePreview";
export const HIDE_VARIANT_POPUP = "hideVariantPopup";
export const EMOJI = 'emoji';
export const SHOW_TABS = 'showTabs';
export const HIDE_TABS = 'hideTabs';
export const SHOW_SEARCH_RESULTS = 'showSearchResults';
export const SHOW_PREVIEW = 'showPreview';
export const HIDE_PREVIEW = 'hidePreview';
export const HIDE_VARIANT_POPUP = 'hideVariantPopup';
@@ -1,4 +1,4 @@
import { library, icon } from "@fortawesome/fontawesome-svg-core";
import { library, icon } from '@fortawesome/fontawesome-svg-core';
import {
faCat,
faCoffee,
@@ -7,14 +7,14 @@ import {
faMusic,
faSearch,
faTimes
} from "@fortawesome/free-solid-svg-icons";
} from '@fortawesome/free-solid-svg-icons';
import {
faBuilding,
faFlag,
faFrown,
faLightbulb,
faSmile
} from "@fortawesome/free-regular-svg-icons";
} from '@fortawesome/free-regular-svg-icons';

library.add(
faBuilding,
@@ -31,15 +31,15 @@ library.add(
faTimes
);

export const building = icon({ prefix: "far", iconName: "building" }).html;
export const cat = icon({ prefix: "fas", iconName: "cat" }).html;
export const coffee = icon({ prefix: "fas", iconName: "coffee" }).html;
export const flag = icon({ prefix: "far", iconName: "flag" }).html;
export const futbol = icon({ prefix: "fas", iconName: "futbol" }).html;
export const frown = icon({ prefix: "far", iconName: "frown" }).html;
export const history = icon({ prefix: "fas", iconName: "history" }).html;
export const lightbulb = icon({ prefix: "far", iconName: "lightbulb" }).html;
export const music = icon({ prefix: "fas", iconName: "music" }).html;
export const search = icon({ prefix: "fas", iconName: "search" }).html;
export const smile = icon({ prefix: "far", iconName: "smile" }).html;
export const times = icon({ prefix: "fas", iconName: "times" }).html;
export const building = icon({ prefix: 'far', iconName: 'building' }).html;
export const cat = icon({ prefix: 'fas', iconName: 'cat' }).html;
export const coffee = icon({ prefix: 'fas', iconName: 'coffee' }).html;
export const flag = icon({ prefix: 'far', iconName: 'flag' }).html;
export const futbol = icon({ prefix: 'fas', iconName: 'futbol' }).html;
export const frown = icon({ prefix: 'far', iconName: 'frown' }).html;
export const history = icon({ prefix: 'fas', iconName: 'history' }).html;
export const lightbulb = icon({ prefix: 'far', iconName: 'lightbulb' }).html;
export const music = icon({ prefix: 'fas', iconName: 'music' }).html;
export const search = icon({ prefix: 'fas', iconName: 'search' }).html;
export const smile = icon({ prefix: 'far', iconName: 'smile' }).html;
export const times = icon({ prefix: 'fas', iconName: 'times' }).html;
@@ -1,28 +1,28 @@
import "../css/emoji-button.css";
import '../css/emoji-button.css';

import Emitter from "tiny-emitter";
import Popper from "popper.js";
import Emitter from 'tiny-emitter';
import Popper from 'popper.js';

import emojiData from "./data/emoji";
import emojiData from './data/emoji';

import {
EMOJI,
SHOW_SEARCH_RESULTS,
SHOW_TABS,
HIDE_TABS,
HIDE_VARIANT_POPUP
} from "./events";
import { EmojiPreview } from "./preview";
import { Search } from "./search";
import { Tabs } from "./tabs";
import { createElement, empty } from "./util";
import { VariantPopup } from "./variantPopup";
} from './events';
import { EmojiPreview } from './preview';
import { Search } from './search';
import { Tabs } from './tabs';
import { createElement, empty } from './util';
import { VariantPopup } from './variantPopup';

const CLASS_PICKER = "emoji-picker";
const CLASS_PICKER_CONTENT = "emoji-picker__content";
const CLASS_PICKER = 'emoji-picker';
const CLASS_PICKER_CONTENT = 'emoji-picker__content';

const DEFAULT_OPTIONS = {
position: "right-start"
position: 'right-start'
};

export default class EmojiButton {
@@ -47,9 +47,9 @@ export default class EmojiButton {
}

buildPicker() {
this.pickerEl = createElement("div", CLASS_PICKER);
this.pickerEl = createElement('div', CLASS_PICKER);

const pickerContent = createElement("div", CLASS_PICKER_CONTENT);
const pickerContent = createElement('div', CLASS_PICKER_CONTENT);

const searchContainer = new Search(this.events, emojiData).render();
this.pickerEl.appendChild(searchContainer);
@@ -85,7 +85,7 @@ export default class EmojiButton {
variantPopup = new VariantPopup(this.events, emoji).render();
this.pickerEl.appendChild(variantPopup);
} else {
this.publicEvents.emit("emoji", emoji.e);
this.publicEvents.emit('emoji', emoji.e);
this.hidePicker();
}
});
@@ -98,8 +98,8 @@ export default class EmojiButton {
document.body.appendChild(this.pickerEl);

setTimeout(() => {
document.addEventListener("click", this.onDocumentClick);
document.addEventListener("keydown", this.onDocumentKeydown);
document.addEventListener('click', this.onDocumentClick);
document.addEventListener('keydown', this.onDocumentKeydown);
});
}

@@ -115,8 +115,8 @@ export default class EmojiButton {
this.events.off(HIDE_VARIANT_POPUP);
document.body.removeChild(this.pickerEl);
this.popper.destroy();
document.removeEventListener("click", this.onDocumentClick);
document.removeEventListener("keydown", this.onDocumentKeydown);
document.removeEventListener('click', this.onDocumentClick);
document.removeEventListener('keydown', this.onDocumentKeydown);
}

showPicker(referenceEl, options = {}) {
@@ -128,7 +128,7 @@ export default class EmojiButton {
}

onDocumentKeydown(event) {
if (event.key === "Escape") {
if (event.key === 'Escape') {
this.hidePicker();
}
}

0 comments on commit 2856256

Please sign in to comment.
You can’t perform that action at this time.