blvdmitry

<style>
  .route-header { margin-bottom: 5px; }
  .route-content { margin: 20px; }
</style>  

// Route margin wrapping a component
<div class="route-header">
  <div class="component1"></div>
</div>

blvdmitry

<style>
  .mb5 { margin-bottom: 5px; }
  .m20 { margin: 20px; }
</style>  

// Route margin wrapping a component
<div class="mb5">
  <div class="component1"></div>
</div>

blvdmitry

import React from 'react';
import c from 'classnames';
import injectSheet from 'react-jss';
import s from './styles';

class Group extends React.PureComponent {
  render() {
    const { children = [], inline, classes, className, small } = this.props;
    const rootClassNames = c(
      classes.group,

blvdmitry

import React from "react"
import { configure } from "@storybook/react";
import "../src/styles.scss"

const req = require.context("../src", true, /.*\.(stories|story).(js|tsx)$/)

function loadStories() {
  req.keys().forEach(filename => req(filename))
}

blvdmitry

// @flow
import * as React from 'react';
import { connect } from 'react-redux';
import { Gateway } from 'react-gateway';
import get from 'lodash/get';
import cssVars from 'sj/css/variables/animations.scss';
import { hideModal, hideModalWithoutNavigation, showModal, addModal, removeModal } from 'sj/actions/modalActions';
import { MODAL_QUERY_PARAM, MODAL_GATEWAY_NAME } from 'sj/constants/modals';
import ModalManagerHolder from '../ModalManagerHolder/ModalManagerHolder';

blvdmitry

import React from 'react';
import { connect } from 'react-redux';
import { addForm, removeForm } from 'ducks/forms/forms.actions';

class Form extends React.PureComponent {
  componentWillMount() {
    const { dispatch, id } = this.props;

    dispatch(addForm({ formId: id }));
  }

blvdmitry

const properties: Array<ControlApi> = [{
    type: 'text',
    propertyName: 'textProperty',
    defaultValue: 'some text',
}, {
    type: 'number',
    propertyName: 'numberProperty',
    defaultValue: 2,
}, {
    type: 'boolean',

blvdmitry

class Popover extends React.PureComponent {
  state = {
    active: false,
    visible: false
  }
  
  componentDidMount() {
    if (this.props.active) {
      this.show();
    }

blvdmitry

import React from 'react';
import { storiesOf } from '@storybook/react';
import Button from 'components/Button';
import Dialog from 'components/Dialog';
import DialogProvider from 'components/Dialog/DialogProvider';

const Story = (props: { position?: 'right' }) => {
  const modalId = 'testModal';
  const { show } = Dialog.use(modalId);

blvdmitry

export const isRTL = () => !!document.querySelector('[dir=rtl]');
export const isLTR = () => !isRTL();

let cachedScrollType;

const getScrollType = () => {
  if (cachedScrollType) return cachedScrollType;

  const dummy = window.document.createElement('div');