Skip to content

Instantly share code, notes, and snippets.

View okonet's full-sized avatar

Andrey Okonetchnikov okonet

View GitHub Profile
@okonet
okonet / jest-webpack-preprocessor.js
Created March 9, 2017 09:29
Test webpack-shimmed and aliased modules with Jest
/* eslint-env node */
const path = require('path');
const webpack = require('webpack');
const MemoryFileSystem = require('memory-fs');
const EnhancedResolve = require('enhanced-resolve');
const transform = require('transform-jest-deps');
const babel = require('babel-jest');
const createConfig = require('../build/utils/createWebpackConfig');
@okonet
okonet / mixins.js
Created January 29, 2020 14:17
Mixins to handle focus ring in CSS-in-JS
import "focus-visible"; // :focus-visible polyfill
import { darken, transparentize } from "polished";
/**
* Mixin to generate consistent box-shadow rule for focus rings and selections
*/
export function focusBoxShadow(color, hasInset = false) {
return {
boxShadow: `
0 0 0 0.2em ${transparentize(0.75, color)}
@okonet
okonet / CurrentPeriod.jpg
Last active August 17, 2020 10:39 — forked from jtatarko/CurrentPeriod.jpg
DynamicDateRangePicker
CurrentPeriod.jpg
@okonet
okonet / BothDatesSelected.png
Last active August 17, 2020 10:01
DateRangePicker
BothDatesSelected.png
@okonet
okonet / SketchSystems.spec
Created August 13, 2020 15:38
DatePicker
DatePicker
DateNotSet
click -> SelectDate
SelectDate
hover -> DateHighlighted
DateHighlighted
click -> DateSet
DateSelected
hover -> DateHighlighted
@okonet
okonet / SketchSystems.spec
Created August 13, 2020 15:34
DynamicDateRangePicker
DynamicDateRangePicker
DateRangeNotSet
click -> CustomRange
CustomRange
fixedStart -> FixedStart
prevPeriod -> PreviousPeriod
nextPeriod -> NextPeriod
currentPeriod -> CurrentPeriod
# See https://sketch.systems/okonet/sketch/64ddad32ec5753cdab12da7d4eb53a48
DateRangePicker&
@okonet
okonet / package.json
Created November 20, 2016 18:48
Automatic yarn updates as a post-checkout hook
{
"devDependencies": {
"ghooks": "^1.3.2"
},
"config": {
"ghooks": {
"post-checkout": "./script/yarn-update.hook.sh $2 $3"
}
}
}
@okonet
okonet / SketchSystems.spec
Last active February 28, 2020 12:28
Pattern Journey
Pattern Journey
Pattern exists in the UI library?*
Yes -> Does it fulfill all the requirements?
No -> Similar pattern exists in other projects?
Does it fulfill all the requirements?
Yes -> Just use it
No -> Can be modified to fulfill all requirements?
Similar pattern exists in other projects?
@okonet
okonet / machine.js
Created February 12, 2020 10:04
Generated by XState Viz: https://xstate.js.org/viz
const patterJourneyMachine = Machine({
id: 'pattern',
initial: 'Pattern exists in the UI library?',
states: {
"Pattern exists in the UI library?": {
on: {
YES: 'Does it fulfill all the requirements?',
NO: 'Similar pattern exists in other projects?'
}
},
@okonet
okonet / lightning_talk_proposal.md
Last active April 10, 2018 10:09
Make linting great again! -- ReactiveConf 2017 ⚡️talk proposal

Please 🌟 this gist to vote for this proposal!

Make linting great again!

tabs vs spaces

No other topic in software development probably has so much controversy as linting.

With a wrong workflow linting can be really a pain and will slow you and your team down. With a proper setup, though, it can save you hours of manual work reformatting the code and reducing the code-review overhead.