blvdmitry

type Props<TagName extends keyof JSX.IntrinsicElements | void = void> = {
	as?: TagName;
	children?: React.ReactNode;
	attributes?: Attributes<TagName>;
};


export type Attributes<TagName = void, O = void> = Omit<
	(TagName extends keyof JSX.IntrinsicElements
		? JSX.IntrinsicElements[TagName]

blvdmitry

const baseUnit = 4;
const units = [...Array(30).keys()].reduce(
  (config, i) => ({
    ...config,
    [i + 1]: `${baseUnit * (i + 1)}px`,
  }),
  {}
);

/** @type {import('tailwindcss').Config} */

blvdmitry

/* css */

.root {
	--_p: 4;
	padding: calc(var(--arcade-unit-x1) * var(--_p));
	border-radius: var(--arcade-unit-radius-medium);
	background: var(--arcade-color-background-elevated);
	color: var(--arcade-color-foreground-neutral);
	border: var(--arcade-unit-border-small) solid var(--arcade-color-border-neutral-faded);
	box-shadow: var(--arcade-shadow-elevated);

blvdmitry

-Xms128m
-Xmx750m
-XX:ReservedCodeCacheSize=240m
-XX:+UseConcMarkSweepGC
-XX:SoftRefLRUPolicyMSPerMB=50
-ea
-XX:CICompilerCount=2
-Dsun.io.useCanonPrefixCache=false
-Djdk.http.auth.tunneling.disabledSchemes=""
-XX:+HeapDumpOnOutOfMemoryError

blvdmitry

.root {
	background-color: var(--color-background-neutral);
	/* Border is aligned with background */
	color: var(--color-foreground-neutral);
	border-radius: var(--unit-radius-small);
	transition: var(--duration-fast) var(--easing-standard);
	transition-property: background-color, box-shadow, border;
	padding: calc(var(--unit-x2) - var(--unit-border-small)) calc(var(--unit-x3) - var(--unit-border-small));
	min-height: calc(var(--DO_NOT_USE_bodyMedium2_lineHeight) + var(--unit-x2) * 2);
	min-width: calc(var(--DO_NOT_USE_bodyMedium2_lineHeight) + var(--unit-x2) * 2);

blvdmitry

const path = require('path');
const fs = require('fs-extra');
const sassExtract = require('sass-extract');
const Handlebars = require('handlebars');
const juice = require('juice');

const templatesPath = path.resolve(__dirname, '../templates/');
const partialsPath = path.resolve(__dirname, '../components/');

const templateNames = fs.readdirSync(templatesPath);

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');

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

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

blvdmitry

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