@beatgig/synth-core

@beatgig/synth-core

The Synth core library provides functions to work with token declarations.

Installation

yarn add @beatgig/synth-core

Constants

TOKEN_CATEGORY_COLOR : string

TOKEN_CATEGORY_POSITION : string

TOKEN_CATEGORY_SIZE : string

TOKEN_CATEGORY_SPACE : string

TOKEN_CATEGORY_STYLE : string

TOKEN_CATEGORY_TYPOGRAPHY : string

TOKEN_CATEGORIES : Array.<String>

TOKEN_PROPERTY_BACKGROUND : string

TOKEN_PROPERTY_BORDER : string

TOKEN_PROPERTY_BOTTOM : string

TOKEN_PROPERTY_COLOR : string

TOKEN_PROPERTY_FONT_FAMILY : string

TOKEN_PROPERTY_FONT_SIZE : string

TOKEN_PROPERTY_HEIGHT : string

TOKEN_PROPERTY_INDEX : string

TOKEN_PROPERTY_LEFT : string

TOKEN_PROPERTY_LINE_HEIGHT : string

TOKEN_PROPERTY_MARGIN : string

TOKEN_PROPERTY_MAX_HEIGHT : string

TOKEN_PROPERTY_MAX_WIDTH : string

TOKEN_PROPERTY_MIN_HEIGHT : string

TOKEN_PROPERTY_MIN_WIDTH : string

TOKEN_PROPERTY_OPACITY : string

TOKEN_PROPERTY_OUTLINE : string

TOKEN_PROPERTY_PADDING : string

TOKEN_PROPERTY_RADIUS : string

TOKEN_PROPERTY_RIGHT : string

TOKEN_PROPERTY_SHADOW : string

TOKEN_PROPERTY_SPACING : string

TOKEN_PROPERTY_TEXT_DECORATION : string

TOKEN_PROPERTY_TOP : string

TOKEN_PROPERTY_TEXT_TRANSFORM : string

TOKEN_PROPERTY_WEIGHT : string

TOKEN_PROPERTY_WIDTH : string

TOKEN_PROPERTIES : Array.<String>

TOKEN_PROPERTY_CSS_MAP : object

getCSSDeclaration ⇒ string

Returns a CSS declaration mapping to the given token.

getCSSProperty ⇒ string

Returns a CSS property mapping to the given token.

getTokenParts ⇒ TokenParts

Returns an object containing all the parts of a Synth token.

getTokenValue ⇒ string

Returns a the value of the given token declaration.

isTokenDeclaration ⇒ boolean

Validates that the given value is a valid Synth token declaration.

isTokenName ⇒ boolean

Validates that the given value is a valid Synth token name.

isTokenType ⇒ boolean

Validates that the given value is a valid Synth token type.

Typedefs

TokenParts : object

TOKEN_CATEGORY_COLOR : string

Kind: global constant
Since: 1.0.0

TOKEN_CATEGORY_POSITION : string

Kind: global constant
Since: 1.0.0

TOKEN_CATEGORY_SIZE : string

Kind: global constant
Since: 1.0.0

TOKEN_CATEGORY_SPACE : string

Kind: global constant
Since: 1.0.0

TOKEN_CATEGORY_STYLE : string

Kind: global constant
Since: 1.0.0

TOKEN_CATEGORY_TYPOGRAPHY : string

Kind: global constant
Since: 1.0.0

TOKEN_CATEGORIES : Array.<String>

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_BACKGROUND : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_BORDER : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_BOTTOM : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_COLOR : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_FONT_FAMILY : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_FONT_SIZE : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_HEIGHT : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_INDEX : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_LEFT : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_LINE_HEIGHT : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_MARGIN : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_MAX_HEIGHT : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_MAX_WIDTH : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_MIN_HEIGHT : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_MIN_WIDTH : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_OPACITY : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_OUTLINE : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_PADDING : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_RADIUS : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_RIGHT : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_SHADOW : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_SPACING : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_TEXT_DECORATION : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_TOP : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_TEXT_TRANSFORM : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_WEIGHT : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_WIDTH : string

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTIES : Array.<String>

Kind: global constant
Since: 1.0.0

TOKEN_PROPERTY_CSS_MAP : object

Kind: global constant
Since: 1.0.0

getCSSDeclaration ⇒ string

Returns a CSS declaration mapping to the given token.

Kind: global constant
Since: 1.0.0

Param	Type	Description
tokens	object	A valid Synth token declaration object.
tokenName	string	A valid Synth token name.

Example

getCSSDeclaration({
  color: {
    background: {
      button: 'red',
    },
  },
}, 'color:background:button')
// => "background-color: red;"

getCSSProperty ⇒ string

Returns a CSS property mapping to the given token.

Kind: global constant
Since: 1.0.0

Param	Type	Description
tokenType	string	A valid Synth token type, e.g. color:text.

Example

getCSSProperty('color:background')
// => "background-color"

getCSSProperty('typography:font')
// => "font-family"

getTokenParts ⇒ TokenParts

Returns an object containing all the parts of a Synth token.

Kind: global constant
Since: 1.0.0

Param	Type	Description
tokenName	string	A valid Synth token name, e.g. color:text:button.

Example

getTokenParts('color:background:button')
// => { category: 'color', name: 'button', property: 'background' }

getTokenParts('color:background:button:hover')
// => { category: 'color', name: 'button:hover', property: 'background' }

getTokenValue ⇒ string

Returns a the value of the given token declaration.

Kind: global constant
Since: 1.0.0

Param	Type	Description
tokens	object	A valid Synth token declaration object.
tokenName	string	A valid Synth token name.

Example

getTokenValue({
  color: {
    background: {
      button: 'red',
    },
  },
}, 'color:background:button')
// => "red"

isTokenDeclaration ⇒ boolean

Validates that the given value is a valid Synth token declaration.

Kind: global constant
Since: 1.0.0

Param	Type
tokens	object

Example

isTokenDeclaration({
  color: {
    background: {
      button: 'red',
    },
  },
})
// => true

isTokenDeclaration('size:maxWidth')
// => false

isTokenDeclaration({})
// => false

isTokenName ⇒ boolean

Validates that the given value is a valid Synth token name.

Kind: global constant
Since: 1.0.0

Param	Type
tokenName	string

Example

isTokenName('color:text:button')
// => true

isTokenName('@lightGrey')
// => true

isTokenName('hello:world:button')
// => false

isTokenName('hello')
// => false

isTokenType ⇒ boolean

Validates that the given value is a valid Synth token type.

Kind: global constant
Since: 1.0.0

Param	Type
tokenType	string

Example

isTokenType('color:text')
// => true

isTokenType('size:maxWidth')
// => true

isTokenType('hello:world')
// => false

isTokenType('hello')
// => false

TokenParts : object

Kind: global typedef
Properties

Name	Type
category	string
name	string
property	string