💄 Add prettier.config.js

release
Etienne Lemay 2018-03-27 14:51:26 -04:00
parent a71280f14e
commit c113dc5e3b
No known key found for this signature in database
GPG Key ID: EE7CF89146BB28E9
17 changed files with 87 additions and 71 deletions

View File

@ -51,7 +51,7 @@
"karma-jasmine": "^1.1.0", "karma-jasmine": "^1.1.0",
"karma-webpack": "^2.0.4", "karma-webpack": "^2.0.4",
"mkdirp": "0.5.1", "mkdirp": "0.5.1",
"prettier": "1.7.4", "prettier": "1.11.1",
"prop-types": "^15.6.0", "prop-types": "^15.6.0",
"react": "^16.0.0", "react": "^16.0.0",
"react-dom": "^16.0.0", "react-dom": "^16.0.0",
@ -77,7 +77,7 @@
"prepublishOnly": "npm run build", "prepublishOnly": "npm run build",
"storybook": "start-storybook -p 6006", "storybook": "start-storybook -p 6006",
"build-storybook": "build-storybook", "build-storybook": "build-storybook",
"prettier": "prettier --no-semi --single-quote --trailing-comma es5 --write \"{src,spec}/**/*.js\"" "prettier": "prettier --write \"{src,spec}/**/*.js\""
}, },
"size-limit": [ "size-limit": [
{ {

6
prettier.config.js Normal file
View File

@ -0,0 +1,6 @@
module.exports = {
semi: false,
singleQuote: true,
trailingComma: 'all',
arrowParens: 'always',
}

View File

@ -17,11 +17,11 @@ describe('#emojiIndex', () => {
}) })
it('should filter only emojis we care about, exclude pineapple', () => { it('should filter only emojis we care about, exclude pineapple', () => {
let emojisToShowFilter = data => { let emojisToShowFilter = (data) => {
data.unified !== '1F34D' data.unified !== '1F34D'
} }
expect( expect(
emojiIndex.search('apple', { emojisToShowFilter }).map(obj => obj.id) emojiIndex.search('apple', { emojisToShowFilter }).map((obj) => obj.id),
).not.toContain('pineapple') ).not.toContain('pineapple')
}) })
@ -30,13 +30,13 @@ describe('#emojiIndex', () => {
}) })
it('can search for thinking_face', () => { it('can search for thinking_face', () => {
expect(emojiIndex.search('thinking_fac').map(x => x.id)).toEqual([ expect(emojiIndex.search('thinking_fac').map((x) => x.id)).toEqual([
'thinking_face', 'thinking_face',
]) ])
}) })
it('can search for woman-facepalming', () => { it('can search for woman-facepalming', () => {
expect(emojiIndex.search('woman-facep').map(x => x.id)).toEqual([ expect(emojiIndex.search('woman-facep').map((x) => x.id)).toEqual([
'woman-facepalming', 'woman-facepalming',
]) ])
}) })

View File

@ -30,14 +30,14 @@ describe('Picker', () => {
}) })
it('will not show some based upon our filter', () => { it('will not show some based upon our filter', () => {
subject = render({ emojisToShowFilter: unified => false }) subject = render({ emojisToShowFilter: (unified) => false })
expect(subject.categories.length).toEqual(2) expect(subject.categories.length).toEqual(2)
}) })
it('maintains category ids after it is filtered', () => { it('maintains category ids after it is filtered', () => {
subject = render({ emojisToShowFilter: emoji => true }) subject = render({ emojisToShowFilter: (emoji) => true })
const categoriesWithIds = subject.categories.filter( const categoriesWithIds = subject.categories.filter(
category => category.id (category) => category.id,
) )
expect(categoriesWithIds.length).toEqual(10) expect(categoriesWithIds.length).toEqual(10)
}) })

View File

@ -7,7 +7,9 @@ export default class Anchors extends React.PureComponent {
constructor(props) { constructor(props) {
super(props) super(props)
let defaultCategory = props.categories.filter(category => category.first)[0] let defaultCategory = props.categories.filter(
(category) => category.first,
)[0]
this.state = { this.state = {
selected: defaultCategory.name, selected: defaultCategory.name,
@ -58,9 +60,9 @@ export default class Anchors extends React.PureComponent {
title={i18n.categories[id]} title={i18n.categories[id]}
data-index={i} data-index={i}
onClick={this.handleClick} onClick={this.handleClick}
className={`emoji-mart-anchor ${isSelected className={`emoji-mart-anchor ${
? 'emoji-mart-anchor-selected' isSelected ? 'emoji-mart-anchor-selected' : ''
: ''}`} }`}
style={{ color: isSelected ? color : null }} style={{ color: isSelected ? color : null }}
> >
<div dangerouslySetInnerHTML={{ __html: this.getSVG(id) }} /> <div dangerouslySetInnerHTML={{ __html: this.getSVG(id) }} />

View File

@ -101,15 +101,15 @@ export default class Category extends React.Component {
if (frequentlyUsed.length) { if (frequentlyUsed.length) {
emojis = frequentlyUsed emojis = frequentlyUsed
.map(id => { .map((id) => {
const emoji = custom.filter(e => e.id === id)[0] const emoji = custom.filter((e) => e.id === id)[0]
if (emoji) { if (emoji) {
return emoji return emoji
} }
return id return id
}) })
.filter(id => !!getData(id)) .filter((id) => !!getData(id))
} }
if (emojis.length === 0 && frequentlyUsed.length > 0) { if (emojis.length === 0 && frequentlyUsed.length > 0) {
@ -168,9 +168,9 @@ export default class Category extends React.Component {
return ( return (
<div <div
ref={this.setContainerRef} ref={this.setContainerRef}
className={`emoji-mart-category ${emojis && !emojis.length className={`emoji-mart-category ${
? 'emoji-mart-no-results' emojis && !emojis.length ? 'emoji-mart-no-results' : ''
: ''}`} }`}
style={containerStyles} style={containerStyles}
> >
<div <div
@ -183,7 +183,8 @@ export default class Category extends React.Component {
</span> </span>
</div> </div>
{emojis && emojis.map(emoji => Emoji({ emoji: emoji, ...emojiProps }))} {emojis &&
emojis.map((emoji) => Emoji({ emoji: emoji, ...emojiProps }))}
{emojis && {emojis &&
!emojis.length && ( !emojis.length && (

View File

@ -6,19 +6,19 @@ import { getData, getSanitizedData, unifiedToNative } from '../utils'
const SHEET_COLUMNS = 52 const SHEET_COLUMNS = 52
const _getPosition = props => { const _getPosition = (props) => {
var { sheet_x, sheet_y } = _getData(props), var { sheet_x, sheet_y } = _getData(props),
multiply = 100 / (SHEET_COLUMNS - 1) multiply = 100 / (SHEET_COLUMNS - 1)
return `${multiply * sheet_x}% ${multiply * sheet_y}%` return `${multiply * sheet_x}% ${multiply * sheet_y}%`
} }
const _getData = props => { const _getData = (props) => {
var { emoji, skin, set } = props var { emoji, skin, set } = props
return getData(emoji, skin, set) return getData(emoji, skin, set)
} }
const _getSanitizedData = props => { const _getSanitizedData = (props) => {
var { emoji, skin, set } = props var { emoji, skin, set } = props
return getSanitizedData(emoji, skin, set) return getSanitizedData(emoji, skin, set)
} }
@ -53,11 +53,11 @@ const _handleLeave = (e, props) => {
onLeave(emoji, e) onLeave(emoji, e)
} }
const _isNumeric = value => { const _isNumeric = (value) => {
return !isNaN(value - parseFloat(value)) return !isNaN(value - parseFloat(value))
} }
const _convertStyleToCSS = style => { const _convertStyleToCSS = (style) => {
let div = document.createElement('div') let div = document.createElement('div')
for (let key in style) { for (let key in style) {
@ -73,7 +73,7 @@ const _convertStyleToCSS = style => {
return div.getAttribute('style') return div.getAttribute('style')
} }
const Emoji = props => { const Emoji = (props) => {
for (let k in Emoji.defaultProps) { for (let k in Emoji.defaultProps) {
if (props[k] == undefined && Emoji.defaultProps[k] != undefined) { if (props[k] == undefined && Emoji.defaultProps[k] != undefined) {
props[k] = Emoji.defaultProps[k] props[k] = Emoji.defaultProps[k]
@ -134,7 +134,7 @@ const Emoji = props => {
display: 'inline-block', display: 'inline-block',
backgroundImage: `url(${props.backgroundImageFn( backgroundImage: `url(${props.backgroundImageFn(
props.set, props.set,
props.sheetSize props.sheetSize,
)})`, )})`,
backgroundSize: `${100 * SHEET_COLUMNS}%`, backgroundSize: `${100 * SHEET_COLUMNS}%`,
backgroundPosition: _getPosition(props), backgroundPosition: _getPosition(props),
@ -144,16 +144,16 @@ const Emoji = props => {
if (props.html) { if (props.html) {
style = _convertStyleToCSS(style) style = _convertStyleToCSS(style)
return `<span style='${style}' ${title return `<span style='${style}' ${
? `title='${title}'` title ? `title='${title}'` : ''
: ''} class='${className}'>${children || ''}</span>` } class='${className}'>${children || ''}</span>`
} else { } else {
return ( return (
<span <span
key={props.emoji.id || props.emoji} key={props.emoji.id || props.emoji}
onClick={e => _handleClick(e, props)} onClick={(e) => _handleClick(e, props)}
onMouseEnter={e => _handleOver(e, props)} onMouseEnter={(e) => _handleOver(e, props)}
onMouseLeave={e => _handleLeave(e, props)} onMouseLeave={(e) => _handleLeave(e, props)}
title={title} title={title}
className={className} className={className}
> >

View File

@ -51,7 +51,7 @@ export default class Picker extends React.PureComponent {
let allCategories = [].concat(data.categories) let allCategories = [].concat(data.categories)
if (props.custom.length > 0) { if (props.custom.length > 0) {
this.CUSTOM_CATEGORY.emojis = props.custom.map(emoji => { this.CUSTOM_CATEGORY.emojis = props.custom.map((emoji) => {
return { return {
...emoji, ...emoji,
// `<Category />` expects emoji to have an `id`. // `<Category />` expects emoji to have an `id`.
@ -188,7 +188,7 @@ export default class Picker extends React.PureComponent {
const prefixes = ['', '-webkit-', '-ms-', '-moz-', '-o-'] const prefixes = ['', '-webkit-', '-ms-', '-moz-', '-o-']
prefixes.forEach( prefixes.forEach(
prefix => (stickyTestElement.style.position = `${prefix}sticky`) (prefix) => (stickyTestElement.style.position = `${prefix}sticky`),
) )
this.hasStickyPosition = !!stickyTestElement.style.position.length this.hasStickyPosition = !!stickyTestElement.style.position.length
@ -202,7 +202,7 @@ export default class Picker extends React.PureComponent {
// Use Array.prototype.find() when it is more widely supported. // Use Array.prototype.find() when it is more widely supported.
const emojiData = this.CUSTOM_CATEGORY.emojis.filter( const emojiData = this.CUSTOM_CATEGORY.emojis.filter(
customEmoji => customEmoji.id === emoji.id (customEmoji) => customEmoji.id === emoji.id,
)[0] )[0]
for (let key in emojiData) { for (let key in emojiData) {
if (emojiData.hasOwnProperty(key)) { if (emojiData.hasOwnProperty(key)) {
@ -300,7 +300,7 @@ export default class Picker extends React.PureComponent {
if (scrollTop < minTop) { if (scrollTop < minTop) {
activeCategory = this.categories.filter( activeCategory = this.categories.filter(
category => !(category.anchor === false) (category) => !(category.anchor === false),
)[0] )[0]
} else if (scrollTop + this.clientHeight >= this.scrollHeight) { } else if (scrollTop + this.clientHeight >= this.scrollHeight) {
activeCategory = this.categories[this.categories.length - 1] activeCategory = this.categories[this.categories.length - 1]
@ -382,12 +382,15 @@ export default class Picker extends React.PureComponent {
case 13: case 13:
let emoji let emoji
if (this.SEARCH_CATEGORY.emojis && (emoji = this.SEARCH_CATEGORY.emojis[0])) { if (
this.SEARCH_CATEGORY.emojis &&
(emoji = this.SEARCH_CATEGORY.emojis[0])
) {
this.handleEmojiSelect(emoji) this.handleEmojiSelect(emoji)
} }
handled = true handled = true
break; break
} }
if (handled) { if (handled) {
@ -463,7 +466,11 @@ export default class Picker extends React.PureComponent {
width = perLine * (emojiSize + 12) + 12 + 2 + measureScrollbar() width = perLine * (emojiSize + 12) + 12 + 2 + measureScrollbar()
return ( return (
<div style={{ width: width, ...style }} className="emoji-mart" onKeyDown={this.handleKeyDown}> <div
style={{ width: width, ...style }}
className="emoji-mart"
onKeyDown={this.handleKeyDown}
>
<div className="emoji-mart-bar"> <div className="emoji-mart-bar">
<Anchors <Anchors
ref={this.setAnchorsRef} ref={this.setAnchorsRef}
@ -586,7 +593,7 @@ Picker.propTypes = {
emoticons: PropTypes.arrayOf(PropTypes.string), emoticons: PropTypes.arrayOf(PropTypes.string),
keywords: PropTypes.arrayOf(PropTypes.string), keywords: PropTypes.arrayOf(PropTypes.string),
imageUrl: PropTypes.string.isRequired, imageUrl: PropTypes.string.isRequired,
}) }),
), ),
} }

View File

@ -26,7 +26,7 @@ export default class Preview extends React.PureComponent {
knownEmoticons = [], knownEmoticons = [],
listedEmoticons = [] listedEmoticons = []
emoticons.forEach(emoticon => { emoticons.forEach((emoticon) => {
if (knownEmoticons.indexOf(emoticon.toLowerCase()) >= 0) { if (knownEmoticons.indexOf(emoticon.toLowerCase()) >= 0) {
return return
} }
@ -44,14 +44,14 @@ export default class Preview extends React.PureComponent {
<div className="emoji-mart-preview-data"> <div className="emoji-mart-preview-data">
<div className="emoji-mart-preview-name">{emoji.name}</div> <div className="emoji-mart-preview-name">{emoji.name}</div>
<div className="emoji-mart-preview-shortnames"> <div className="emoji-mart-preview-shortnames">
{emojiData.short_names.map(short_name => ( {emojiData.short_names.map((short_name) => (
<span key={short_name} className="emoji-mart-preview-shortname"> <span key={short_name} className="emoji-mart-preview-shortname">
:{short_name}: :{short_name}:
</span> </span>
))} ))}
</div> </div>
<div className="emoji-mart-preview-emoticons"> <div className="emoji-mart-preview-emoticons">
{listedEmoticons.map(emoticon => ( {listedEmoticons.map((emoticon) => (
<span key={emoticon} className="emoji-mart-preview-emoticon"> <span key={emoticon} className="emoji-mart-preview-emoticon">
{emoticon} {emoticon}
</span> </span>

View File

@ -20,7 +20,7 @@ export default class Search extends React.PureComponent {
include: this.props.include, include: this.props.include,
exclude: this.props.exclude, exclude: this.props.exclude,
custom: this.props.custom, custom: this.props.custom,
}) }),
) )
} }

View File

@ -39,25 +39,25 @@ export default class Skins extends React.PureComponent {
skinToneNodes.push( skinToneNodes.push(
<span <span
key={`skin-tone-${skinTone}`} key={`skin-tone-${skinTone}`}
className={`emoji-mart-skin-swatch ${selected className={`emoji-mart-skin-swatch ${
? 'emoji-mart-skin-swatch-selected' selected ? 'emoji-mart-skin-swatch-selected' : ''
: ''}`} }`}
> >
<span <span
onClick={this.handleClick} onClick={this.handleClick}
data-skin={skinTone} data-skin={skinTone}
className={`emoji-mart-skin emoji-mart-skin-tone-${skinTone}`} className={`emoji-mart-skin emoji-mart-skin-tone-${skinTone}`}
/> />
</span> </span>,
) )
} }
return ( return (
<div> <div>
<div <div
className={`emoji-mart-skin-swatches ${opened className={`emoji-mart-skin-swatches ${
? 'emoji-mart-skin-swatches-opened' opened ? 'emoji-mart-skin-swatches-opened' : ''
: ''}`} }`}
> >
{skinToneNodes} {skinToneNodes}
</div> </div>

View File

@ -4,7 +4,7 @@ export default function inherits(subClass, superClass) {
if (typeof superClass !== 'function' && superClass !== null) { if (typeof superClass !== 'function' && superClass !== null) {
throw new TypeError( throw new TypeError(
'Super expression must either be null or a function, not ' + 'Super expression must either be null or a function, not ' +
typeof superClass typeof superClass,
) )
} }

View File

@ -1,7 +1,7 @@
export default function possibleConstructorReturn(self, call) { export default function possibleConstructorReturn(self, call) {
if (!self) { if (!self) {
throw new ReferenceError( throw new ReferenceError(
"this hasn't been initialised - super() hasn't been called" "this hasn't been initialised - super() hasn't been called",
) )
} }

View File

@ -1,4 +1,4 @@
export default data => { export default (data) => {
const search = [] const search = []
var addToSearch = (strings, split) => { var addToSearch = (strings, split) => {
@ -6,8 +6,8 @@ export default data => {
return return
} }
;(Array.isArray(strings) ? strings : [strings]).forEach(string => { ;(Array.isArray(strings) ? strings : [strings]).forEach((string) => {
;(split ? string.split(/[-|_|\s]+/) : [string]).forEach(s => { ;(split ? string.split(/[-|_|\s]+/) : [string]).forEach((s) => {
s = s.toLowerCase() s = s.toLowerCase()
if (search.indexOf(s) == -1) { if (search.indexOf(s) == -1) {

View File

@ -13,7 +13,7 @@ for (let emoji in data.emojis) {
id = short_names[0] id = short_names[0]
if (emoticons) { if (emoticons) {
emoticons.forEach(emoticon => { emoticons.forEach((emoticon) => {
if (emoticonsList[emoticon]) { if (emoticonsList[emoticon]) {
return return
} }
@ -27,7 +27,7 @@ for (let emoji in data.emojis) {
} }
function clearCustomEmojis(pool) { function clearCustomEmojis(pool) {
customEmojisList.forEach(emoji => { customEmojisList.forEach((emoji) => {
let emojiId = emoji.id || emoji.short_names[0] let emojiId = emoji.id || emoji.short_names[0]
delete pool[emojiId] delete pool[emojiId]
@ -38,7 +38,7 @@ function clearCustomEmojis(pool) {
function addCustomToPool(custom, pool) { function addCustomToPool(custom, pool) {
if (customEmojisList.length) clearCustomEmojis(pool) if (customEmojisList.length) clearCustomEmojis(pool)
custom.forEach(emoji => { custom.forEach((emoji) => {
let emojiId = emoji.id || emoji.short_names[0] let emojiId = emoji.id || emoji.short_names[0]
if (emojiId && !pool[emojiId]) { if (emojiId && !pool[emojiId]) {
@ -53,7 +53,7 @@ function addCustomToPool(custom, pool) {
function search( function search(
value, value,
{ emojisToShowFilter, maxResults, include, exclude, custom = [] } = {} { emojisToShowFilter, maxResults, include, exclude, custom = [] } = {},
) { ) {
if (customEmojisList != custom) addCustomToPool(custom, originalPool) if (customEmojisList != custom) addCustomToPool(custom, originalPool)
@ -79,7 +79,7 @@ function search(
if (include.length || exclude.length) { if (include.length || exclude.length) {
pool = {} pool = {}
data.categories.forEach(category => { data.categories.forEach((category) => {
let isIncluded = let isIncluded =
include && include.length ? include.indexOf(category.id) > -1 : true include && include.length ? include.indexOf(category.id) > -1 : true
let isExcluded = let isExcluded =
@ -89,7 +89,7 @@ function search(
} }
category.emojis.forEach( category.emojis.forEach(
emojiId => (pool[emojiId] = data.emojis[emojiId]) (emojiId) => (pool[emojiId] = data.emojis[emojiId]),
) )
}) })
@ -105,7 +105,7 @@ function search(
} }
allResults = values allResults = values
.map(value => { .map((value) => {
var aPool = pool, var aPool = pool,
aIndex = index, aIndex = index,
length = 0 length = 0
@ -153,7 +153,7 @@ function search(
return aIndex.results return aIndex.results
}) })
.filter(a => a) .filter((a) => a)
if (allResults.length > 1) { if (allResults.length > 1) {
results = intersect.apply(null, allResults) results = intersect.apply(null, allResults)
@ -166,7 +166,7 @@ function search(
if (results) { if (results) {
if (emojisToShowFilter) { if (emojisToShowFilter) {
results = results.filter(result => emojisToShowFilter(pool[result.id])) results = results.filter((result) => emojisToShowFilter(pool[result.id]))
} }
if (results && results.length > maxResults) { if (results && results.length > maxResults) {

View File

@ -9,7 +9,7 @@ const SKINS = ['1F3FA', '1F3FB', '1F3FC', '1F3FD', '1F3FE', '1F3FF']
function unifiedToNative(unified) { function unifiedToNative(unified) {
var unicodes = unified.split('-'), var unicodes = unified.split('-'),
codePoints = unicodes.map(u => `0x${u}`) codePoints = unicodes.map((u) => `0x${u}`)
return stringFromCodePoint.apply(null, codePoints) return stringFromCodePoint.apply(null, codePoints)
} }
@ -145,7 +145,7 @@ function intersect(a, b) {
const uniqA = uniq(a) const uniqA = uniq(a)
const uniqB = uniq(b) const uniqB = uniq(b)
return uniqA.filter(item => uniqB.indexOf(item) >= 0) return uniqA.filter((item) => uniqB.indexOf(item) >= 0)
} }
function deepMerge(a, b) { function deepMerge(a, b) {

View File

@ -4741,9 +4741,9 @@ preserve@^0.2.0:
version "0.2.0" version "0.2.0"
resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b" resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b"
prettier@1.7.4: prettier@1.11.1:
version "1.7.4" version "1.11.1"
resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.7.4.tgz#5e8624ae9363c80f95ec644584ecdf55d74f93fa" resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.11.1.tgz#61e43fc4cd44e68f2b0dfc2c38cd4bb0fccdcc75"
private@^0.1.6, private@^0.1.7, private@~0.1.5: private@^0.1.6, private@^0.1.7, private@~0.1.5:
version "0.1.7" version "0.1.7"