@beatgig/synth-core v2.0.0
@beatgig/synth-core
The Synth core library provides functions to work with token declarations.
Installation
yarn add @beatgig/synth-core
Constants
Typedefs
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 |