0.8.1 • Published 3 years ago

@codecademy/gamut-system v0.8.1

Weekly downloads
3,713
License
MIT
Repository
github
Last release
3 years ago

Gamut System

Style props for building robustly typed design systems in react.

Features

  • Completely customizable style props (with theme agnostic implementation);
  • Flexible props that are both responsive and composable.
  • Strict design system aware types with no manual fuss.
  • Works with emotion and styled-components in preferred syntax.

Docs

Checkout each section

Usage

Create your new system locally to your app:

import { system, HandlerProps } from '@codecademy/gamut-system';

export const {
  propGroups: { typography, spacing, layout },
} = system.create({});

export type TypographyProps = HandlerProps<typeof typography>;
export type SpacingProps = HandlerProps<typeof spacing>;
export type LayoutProps = HandlerProps<typeof layout>;

In your components:

import styled from '@emotion/styled';
import {
  typography,
  spacing,
  layout,
  TypographyProps,
  SpacingProps,
  LayoutProps,
} from '../system';

export type BoxProps = TypographyProps & SpacingProps & LayoutProps;

export const Box = styled<BoxProps>`
  ${typography}
  ${spacing}
  ${layout}
`;

Regular Props

<Box margin="1rem" />

<Box fontSize="2rem" />

<Box width={1 / 5} />

Responsive Props

// Array Syntax
<Box width={[50, 100, 200]} />

// Object syntax
<Box margin={{ xs: 16, sm: 24, md: 32 }} />
@infinitebrahmanuniverse/nolb-_codec@everything-registry/sub-chunk-183@zalastax/nolb-_codec
0.8.1

3 years ago

0.8.1-alpha.cb7aca.0

3 years ago

0.8.0-alpha.4f0ba0.0

3 years ago

0.8.0

3 years ago

0.8.0-alpha.024d4b.0

3 years ago

0.8.0-alpha.9c9d3a.0

3 years ago

0.8.0-alpha.56644e.0

3 years ago

0.7.4-alpha.d23da5.0

3 years ago

0.8.0-alpha.2e1090.0

3 years ago

0.8.0-alpha.d0d91f.0

3 years ago

0.8.0-alpha.1d1939.0

3 years ago

0.8.0-alpha.9dd65d.0

3 years ago

0.8.0-alpha.bb29f4.0

3 years ago

0.8.0-alpha.ad39ee.0

3 years ago

0.8.0-alpha.29766a.0

3 years ago

0.7.3

3 years ago

0.7.3-alpha.2ed92f.0

3 years ago

0.7.3-alpha.b57b69.0

3 years ago

0.7.3-alpha.938ad6.0

3 years ago

0.7.2

3 years ago

0.7.1

3 years ago

0.7.0

3 years ago

0.7.1-alpha.51a272.0

3 years ago

0.7.2-alpha.285b71.0

3 years ago

0.7.2-alpha.eece80.0

3 years ago

0.7.2-alpha.d8c191.0

3 years ago

0.6.2-alpha.88a8a1.0

3 years ago

0.6.2-alpha.c0f540.0

3 years ago

0.6.2-alpha.294492.0

3 years ago

0.6.2-alpha.b8a279.0

3 years ago

0.6.1-alpha.4f1d4b.0

3 years ago

0.6.1

3 years ago

0.6.2-alpha.945436.0

3 years ago

0.6.2-alpha.b2b58f.0

3 years ago

0.6.1-alpha.1ab129.0

3 years ago

0.6.1-alpha.06a184.0

3 years ago

0.6.1-alpha.c7ba72.0

3 years ago

0.6.1-alpha.c572f8.0

3 years ago

0.6.1-alpha.472494.0

3 years ago

0.6.1-alpha.d081c3.0

3 years ago

0.6.1-alpha.45619e.0

3 years ago

0.6.1-alpha.ba7fd5.0

3 years ago

0.6.1-alpha.a3dfa4.0

3 years ago

0.6.1-alpha.9586b2.0

3 years ago

0.6.1-alpha.42ccc6.0

3 years ago

0.6.1-alpha.4b680b.0

3 years ago

0.6.1-alpha.c0c62b.0

3 years ago

0.6.1-alpha.020b8a.0

3 years ago

0.6.1-alpha.475b39.0

3 years ago

0.6.1-alpha.967dc7.0

3 years ago

0.6.1-alpha.3e59ee.0

3 years ago

0.6.1-alpha.9d9c9b.0

3 years ago

0.6.1-alpha.a7b3cf.0

3 years ago

0.6.1-alpha.8ffa83.0

3 years ago

0.6.1-alpha.dda832.0

3 years ago

0.6.1-alpha.4f01ab.0

3 years ago

0.6.1-alpha.915f2d.0

3 years ago

0.5.3-alpha.6f52a1.0

3 years ago

0.5.3-alpha.a1f625.0

3 years ago

0.5.3-alpha.d9be1a.0

3 years ago

0.5.3-alpha.29677c.0

3 years ago

0.5.3-alpha.9eff3f.0

3 years ago

0.5.3-alpha.70723b.0

3 years ago

0.5.3-alpha.9c89d6.0

3 years ago

0.6.0

3 years ago

0.5.3-alpha.4277f1.0

3 years ago

0.5.3-alpha.6e6de3.0

3 years ago

0.5.3-alpha.b1da2f.0

3 years ago

0.5.3-alpha.2960ce.0

3 years ago

0.5.3-alpha.429e60.0

3 years ago

0.5.3-alpha.0426d1.0

3 years ago

0.5.3-alpha.b3cd83.0

3 years ago

0.5.3-alpha.8093db.0

3 years ago

0.5.3-alpha.145a5d.0

3 years ago

0.5.3-alpha.4b79ad.0

3 years ago

0.5.3-alpha.f4b8fa.0

3 years ago

0.5.3-alpha.a6cda2.0

3 years ago

0.5.3-alpha.2ac57e.0

3 years ago

0.5.3-alpha.1cb504.0

3 years ago

0.5.3-alpha.308c0d.0

3 years ago

0.5.3-alpha.96a0da.0

3 years ago

0.5.3-alpha.88e9e0.0

3 years ago

0.5.3-alpha.23eb43.0

3 years ago

0.5.3-alpha.3e4b61.0

3 years ago

0.5.3-alpha.4f8113.0

3 years ago

0.5.3-alpha.3325e8.0

3 years ago

0.5.3-alpha.14b148.0

3 years ago

0.5.3-alpha.49d2e9.0

3 years ago

0.5.3-alpha.ee6e8e.0

3 years ago

0.5.3-alpha.fe244c.0

3 years ago

0.5.3-alpha.a8d76f.0

3 years ago

0.5.3-alpha.23ef5a.0

3 years ago

0.5.3-alpha.42475a.0

3 years ago

0.5.3-alpha.25c6ee.0

3 years ago

0.5.3-alpha.71e45a.0

3 years ago

0.5.3-alpha.3cf653.0

3 years ago

0.5.3-alpha.c19d1b.0

3 years ago

0.5.3-alpha.bf2653.0

3 years ago

0.5.3-alpha.48fd6f.0

3 years ago

0.5.2-alpha.c340dd.0

3 years ago

0.5.2-alpha.304708.0

3 years ago

0.5.3-alpha.a66349.0

3 years ago

0.5.3-alpha.3b1c0d.0

3 years ago

0.5.2-alpha.45fec3.0

3 years ago

0.5.3-alpha.891d7c.0

3 years ago

0.5.3-alpha.2b0059.0

3 years ago

0.5.3-alpha.2d7f47.0

3 years ago

0.5.3-alpha.7f4b38.0

3 years ago

0.5.2

3 years ago

0.5.2-alpha.9934f4.0

3 years ago

0.5.2-alpha.817876.0

3 years ago

0.5.2-alpha.fa1ca9.0

3 years ago

0.5.3-alpha.89c445.0

3 years ago

0.5.2-alpha.216fbc.0

3 years ago

0.5.2-alpha.67fb7c.0

3 years ago

0.5.2-alpha.b5cc77.0

3 years ago

0.5.2-alpha.afe04f.0

3 years ago

0.5.2-alpha.822aec.0

3 years ago

0.5.2-alpha.deea0d.0

3 years ago

0.5.2-alpha.dfff57.0

3 years ago

0.5.1

3 years ago

0.5.1-alpha.e6893e.0

3 years ago

0.5.1-alpha.08bdf9.0

3 years ago

0.4.1-alpha.f875dc.0

3 years ago

0.4.1-alpha.378fca.0

3 years ago

0.4.1-alpha.7d0dd1.0

3 years ago

0.5.1-alpha.388574.0

3 years ago

0.5.0

3 years ago

0.5.1-alpha.1bacb1.0

3 years ago

0.3.1-alpha.ebd9d5.0

3 years ago

0.5.1-alpha.8de593.0

3 years ago

0.4.1-alpha.b6f2a8.0

3 years ago

0.5.1-alpha.d4890d.0

3 years ago

0.4.1-alpha.07619b.0

3 years ago

0.3.1-alpha.efb7d6.0

3 years ago

0.3.1-alpha.1242cd.0

3 years ago

0.4.0

3 years ago

0.3.1-alpha.292649.0

3 years ago

0.3.1-alpha.cb8dd1.0

3 years ago

0.2.2-alpha.f966ff.0

3 years ago

0.3.1-alpha.9686fe.0

3 years ago

0.2.2-alpha.3e913e.0

3 years ago

0.2.2-alpha.9dcbf5.0

3 years ago

0.2.2-alpha.be9700.0

3 years ago

0.2.2-alpha.e149f9.0

3 years ago

0.3.1-alpha.bf7f59.0

3 years ago

0.3.1-alpha.f75dd0.0

3 years ago

0.3.1-alpha.edae28.0

3 years ago

0.3.1-alpha.cebc37.0

3 years ago

0.3.1-alpha.23bad1.0

3 years ago

0.3.1-alpha.1219ae.0

3 years ago

0.3.1-alpha.245121.0

3 years ago

0.3.1-alpha.f5aaa9.0

3 years ago

0.3.1-alpha.337ab9.0

3 years ago

0.3.1-alpha.8091c1.0

3 years ago

0.3.1-alpha.b937ed.0

3 years ago

0.2.4-alpha.0c6309.0

3 years ago

0.2.4-alpha.a17b37.0

3 years ago

0.2.2-alpha.c96de7.0

3 years ago

0.2.2-alpha.cc96fd.0

3 years ago

0.2.4-alpha.77a6d8.0

3 years ago

0.3.1-alpha.4568e5.0

3 years ago

0.3.0

3 years ago

0.2.4-alpha.659ef8.0

3 years ago

0.3.0-alpha.1b89c0.0

3 years ago

0.2.4-alpha.54f32e.0

3 years ago

0.2.4-alpha.f6ed2d.0

3 years ago

0.3.0-alpha.d992b8.0

3 years ago

0.2.4-alpha.3b737e.0

3 years ago

0.3.0-alpha.0cdf93.0

3 years ago

0.2.2-alpha.f23a71.0

3 years ago

0.2.2-alpha.d4c98b.0

3 years ago

0.3.0-alpha.d3acc3.0

3 years ago

0.2.2-alpha.a8fc79.0

3 years ago

0.2.2-alpha.b2b66a.0

3 years ago

0.2.4-alpha.ab2640.0

3 years ago

0.2.4-alpha.be2ccc.0

3 years ago

0.2.4-alpha.071a7f.0

3 years ago

0.2.4-alpha.c20769.0

3 years ago

0.2.4-alpha.8f6bc6.0

3 years ago

0.3.0-alpha.e8f318.0

3 years ago

0.3.0-alpha.f42fc3.0

3 years ago

0.2.3-alpha.7da8db.0

3 years ago

0.2.3

3 years ago

0.3.0-alpha.b9053a.0

3 years ago

0.2.3-alpha.c242f6.0

3 years ago

0.2.3-alpha.ef5a9e.0

3 years ago

0.2.2-alpha.6c3f37.0

3 years ago

0.2.2-alpha.bf6e94.0

3 years ago

0.2.2-alpha.ff50f6.0

3 years ago

0.2.2-alpha.5fa0bf.0

3 years ago

0.2.2-alpha.d32ef4.0

3 years ago

0.2.2-alpha.f9ad80.0

3 years ago

0.2.3-alpha.c673b3.0

3 years ago

0.2.3-alpha.f9f290.0

3 years ago

0.2.3-alpha.68effc.0

3 years ago

0.2.2-alpha.f93858.0

3 years ago

0.2.2-alpha.9a3204.0

3 years ago

0.2.2-alpha.92415f.0

3 years ago

0.2.2-alpha.85e1b5.0

3 years ago

0.2.3-alpha.ac0155.0

3 years ago

0.2.2

3 years ago

0.2.2-alpha.039e61.0

3 years ago

0.2.2-alpha.aff32a.0

3 years ago

0.2.2-alpha.0fe6fc.0

3 years ago

0.2.2-alpha.a8a6bf.0

3 years ago

0.2.2-alpha.d9e545.0

3 years ago

0.2.2-alpha.3b9d29.0

3 years ago

0.2.2-alpha.19b5f5.0

3 years ago

0.2.2-alpha.49a94d.0

3 years ago

0.2.2-alpha.3d58a1.0

3 years ago

0.2.2-alpha.d2991c.0

3 years ago

0.2.2-alpha.ce196a.0

3 years ago

0.2.2-alpha.41cb0e.0

3 years ago

0.2.2-alpha.e5c55f.0

3 years ago

0.2.2-alpha.d0ce1d.0

3 years ago

0.2.2-alpha.e4923c.0

3 years ago

0.2.2-alpha.fb611d.0

3 years ago

0.2.2-alpha.998fb0.0

3 years ago

0.2.2-alpha.30079d.0

3 years ago

0.2.2-alpha.89864c.0

3 years ago

0.2.2-alpha.662e79.0

3 years ago

0.2.2-alpha.4c9549.0

3 years ago

0.2.2-alpha.a9f0b6.0

3 years ago

0.2.2-alpha.3595cf.0

3 years ago

0.2.2-alpha.09bfc6.0

3 years ago

0.2.2-alpha.2072e7.0

3 years ago

0.1.4-alpha.6353a9.0

3 years ago

0.1.4-alpha.0530c4.0

3 years ago

0.1.4-alpha.31a78b.0

3 years ago

0.2.2-alpha.e7b449.0

3 years ago

0.1.7-alpha.5af669.0

3 years ago

0.1.4-alpha.6e6bec.0

3 years ago

0.2.1-alpha.997134.0

3 years ago

0.2.1

3 years ago

0.2.0

3 years ago

0.1.7-alpha.84285f.0

3 years ago

0.1.7-alpha.7daf58.0

3 years ago

0.1.7-alpha.9a22d6.0

3 years ago

0.1.7-alpha.46ced3.0

3 years ago

0.1.7-alpha.782767.0

3 years ago

0.1.4-alpha.27f88a.0

3 years ago

0.1.4-alpha.dc375e.0

3 years ago

0.1.7-alpha.624b7e.0

3 years ago

0.1.7-alpha.a2c919.0

3 years ago

0.1.7-alpha.2dcb55.0

3 years ago

0.1.7-alpha.df4f56.0

3 years ago

0.1.7-alpha.95a787.0

3 years ago

0.1.6-alpha.c1da1c.0

3 years ago

0.1.6

3 years ago

0.1.6-alpha.7155cb.0

3 years ago

0.1.4-alpha.5503de.0

3 years ago

0.1.4-alpha.9cd652.0

3 years ago

0.1.6-alpha.f0277e.0

3 years ago

0.1.6-alpha.0c0ca3.0

3 years ago

0.1.6-alpha.68e47a.0

3 years ago

0.1.6-alpha.59e3ad.0

3 years ago

0.1.6-alpha.8073c6.0

3 years ago

0.1.6-alpha.b47f52.0

3 years ago

0.1.6-alpha.d56736.0

3 years ago

0.1.6-alpha.a86484.0

3 years ago

0.1.6-alpha.1e058b.0

3 years ago

0.1.6-alpha.80445.0

3 years ago

0.1.6-alpha.73e281.0

3 years ago

0.1.6-alpha.aaf6db.0

3 years ago

0.1.6-alpha.500f21.0

3 years ago

0.1.6-alpha.39b85e.0

3 years ago

0.1.6-alpha.4e40ba.0

3 years ago

0.1.6-alpha.59dd42.0

3 years ago

0.1.6-alpha.e18aa2.0

3 years ago

0.1.6-alpha.ad792c.0

3 years ago

0.1.6-alpha.63789a.0

3 years ago

0.1.6-alpha.7e31d3.0

3 years ago

0.1.6-alpha.079b0f.0

3 years ago

0.1.6-alpha.695164.0

3 years ago

0.1.4-alpha.0c59a5.0

3 years ago

0.1.4-alpha.5547cd.0

3 years ago

0.1.4-alpha.f68a6f.0

3 years ago

0.1.4-alpha.1a3f79.0

3 years ago

0.1.4-alpha.2fc297.0

3 years ago

0.1.4-alpha.9a2656.0

3 years ago

0.1.4-alpha.e57e27.0

3 years ago

0.1.5-alpha.f3c038.0

3 years ago

0.1.5

3 years ago

0.1.4-alpha.929d82.0

3 years ago

0.1.4-alpha.c6c54d.0

3 years ago

0.1.4-alpha.e73dc0.0

3 years ago

0.1.4-alpha.9b6659.0

3 years ago

0.1.4-alpha.f090d2.0

3 years ago

0.1.3-alpha.7978b4.0

3 years ago

0.1.3-alpha.28089d.0

3 years ago

0.1.3-alpha.cfed03.0

3 years ago

0.1.3

3 years ago

0.1.3-alpha.608d3e.0

3 years ago

0.1.2-alpha.790b8c.0

3 years ago

0.1.2

3 years ago

0.1.2-alpha.14efa7.0

3 years ago

0.1.1-alpha.7ceb19.0

3 years ago

0.1.1

3 years ago

0.1.2-alpha.7ac58f.0

3 years ago

0.1.1-alpha.aacfa7.0

3 years ago

0.1.0

4 years ago

0.1.0-alpha.78f3af.0

4 years ago

0.1.0-alpha.15dfd2.0

4 years ago

0.1.0-alpha.10467d.0

4 years ago

0.1.0-alpha.dc1bc6.0

4 years ago

0.1.0-alpha.2c3586.0

4 years ago

0.1.0-alpha.da1327.0

4 years ago

0.1.0-alpha.06178f.0

4 years ago

0.1.0-alpha.15f691.0

4 years ago

0.1.0-alpha.be49e6.0

4 years ago

0.1.0-alpha.f666d7.0

4 years ago

0.1.0-alpha.b4d30c.0

4 years ago

0.1.0-alpha.a469ca.0

4 years ago

0.1.0-alpha.dc47ef.0

4 years ago

0.0.1-alpha.553494.0

4 years ago

0.1.0-alpha.e5e743.0

4 years ago

0.0.1-alpha.b3e40f.0

4 years ago

0.0.1-alpha.8634ce.0

4 years ago

0.0.1-alpha.729ce2.0

4 years ago

0.0.1-alpha.38bc07.0

4 years ago

0.0.1-alpha.b95615.0

4 years ago

0.0.1-alpha.c848be.0

4 years ago

0.0.1-alpha.ab005d.0

4 years ago

0.0.1-alpha.4d2915.0

4 years ago

0.0.1-alpha.aa837e.0

4 years ago

0.0.1-alpha.3ed38d.0

4 years ago

0.0.1-alpha.4ba43f.0

4 years ago

0.0.1-alpha.fdf9ac.0

4 years ago

0.0.1-alpha.118aed.0

4 years ago

0.0.1-alpha.ca8aca.0

4 years ago

0.0.1-alpha.e5fac4.0

4 years ago

0.0.1-alpha.6c1f89.0

4 years ago

0.0.1-alpha.61cf24.0

4 years ago

0.0.1-alpha.32a5ca.0

4 years ago

0.0.1-alpha.74f4b0.0

4 years ago

0.0.1-alpha.591848.0

4 years ago

0.0.1-alpha.68412e.0

4 years ago

0.0.1-alpha.71a62d.0

4 years ago

0.0.1-alpha.c0b13a.0

4 years ago

0.0.1-alpha.8c2a7a.0

4 years ago

0.0.1-alpha.2056f5.0

4 years ago

0.0.1-alpha.b6c8c9.0

4 years ago

0.0.1-alpha.959814.0

4 years ago

0.0.1-alpha.778c34.0

4 years ago

0.0.1-alpha.8ec7d3.0

4 years ago

0.0.1-alpha.6b1f86.0

4 years ago

0.0.1-alpha.ad48ff.0

4 years ago

0.0.1-alpha.ccf7d6.0

4 years ago

0.0.1-alpha.20750b.0

4 years ago

0.0.1-alpha.a9fe1a.0

4 years ago

0.0.1-alpha.2469bd.0

4 years ago

0.0.1-alpha.cf7681.0

4 years ago

0.0.1-alpha.495572.0

4 years ago

0.0.1-alpha.185a31.0

4 years ago

0.0.1-alpha.fb1247.0

4 years ago

0.0.1-alpha.f53082.0

4 years ago

0.0.1-alpha.9c90e2.0

4 years ago

0.0.1-alpha.3d56dc.0

4 years ago

0.0.1-alpha.8f3a31.0

4 years ago

0.0.1-alpha.6a7b6e.0

4 years ago

0.0.1-alpha.788517.0

4 years ago

0.0.1-alpha.c12095.0

4 years ago

0.0.1-alpha.161f8c.0

4 years ago

0.0.1-alpha.490754.0

4 years ago

0.0.1-alpha.dae8f2.0

4 years ago

0.0.1-alpha.95544c.0

4 years ago

0.0.1-alpha.4531e3.0

4 years ago

0.0.1-alpha.b05ed0.0

4 years ago

0.0.1-alpha.d08d7f.0

4 years ago

0.0.1-alpha.1e0b1f.0

4 years ago

0.0.1-alpha.bd957a.0

4 years ago

0.0.1-alpha.6c0caf.0

4 years ago

0.0.1-alpha.7a1d0f.0

4 years ago

0.0.1-alpha.47eb2a.0

4 years ago

0.0.1-alpha.4924c1.0

4 years ago

0.0.1-alpha.4013d8.0

4 years ago

0.0.1-alpha.1b12ac.0

4 years ago

0.0.1-alpha.56f2a2.0

4 years ago

0.0.1-alpha.c8388a.0

4 years ago

0.0.1-alpha.e6ccf3.0

4 years ago

0.0.1-alpha.9c6a52.0

4 years ago

0.0.1-alpha.fc9147.0

4 years ago

0.0.1-alpha.f1b0bf.0

4 years ago

0.0.1-alpha.915cf7.0

4 years ago

0.0.1-alpha.2d5f20.0

4 years ago

0.0.1-alpha.3aae9e.0

4 years ago

0.0.1-alpha.93471b.0

4 years ago

0.0.1-alpha.873064.0

4 years ago

0.0.1-alpha.85ab70.0

4 years ago

0.0.1-alpha.06f407.0

4 years ago