SimpleX2-SDK-Util Color

SimpleX2-SDK-Util-Color is a utility library for color manipulation in SimpleX2 SDK.

Features

• Create a new color object
• Get a css variable
• Get a color
• Set a color
• Reset all colors to default
• Remove a color
• Convert a color to RGBA
• Convert HEX to RGB
• Convert RGB to HEX
• With Simple2X plugin creator
• Without Simple2X plugin creator
• Vue plugin

Installation

npm install @simplex2-sdk-util/color

Usage

Without Simple2X plugin creator

// color.js
import Color from '@simplex2-sdk-util/color'

// Create a new color object whitout Simple2X plugin creator
const color = new Color({
    primary: '#ff0000',
    secondary: '#00ff00',
    tertiary: '#0000ff'
})

With Simple2X plugin creator

// color.js
import Color from '@simplex2-sdk-util/color'
import pluginsManager from '@simplex2-sdk-util/plugins-manager'
pluginsManager.addVuePlugin('color', {
	hangInWindow: true,
	install: true,
	hangInWindowName: 'simplex2UtilSDKColor',
	hangInVueName: '$colorSDK',
	plugin: (that, Vue, options) => {
		return new Color(options)
	}
})

// in Vue2 main.js
import Vue from 'vue'
import App from './App.vue'
import color from './color'

Vue.use(color, {
    primary: '#ff0000',
    secondary: '#00ff00',
    tertiary: '#0000ff'
})

new Vue({
    render: h => h(App)
}).$mount('#app')

// end Vue2 main.js
 /* --- or --- */
// in Vue3 main.js
import { createApp } from 'vue'
import App from './App.vue'
import color from './color'

const app = createApp(App)

app.use(color, {
    primary: '#ff0000',
    secondary: '#00ff00',
    tertiary: '#0000ff'
})

app.mount('#app')

// end Vue3 main.js

API

Color

constructor

new Color({
    primary: '#ff0000',
    secondary: '#00ff00',
    tertiary: '#0000ff'
})

Create a new color object.

getCssVar

Get a css variable

color.getCssVar('primary')
// return
// --color-primary: #ff0000;

getColor

Get a color

color.getColor('primary')
// return
// #ff0000

setColor

Set a color

color.setColor('primary', '#00ff00')

reset

Reset all colors to default

color.reset()

removeColor

Remove a color

color.removeColor('primary')

getColor2RGBA

Convert a color to RGBA

color.getColor2RGBA('primary')
// return
// rgba(255, 0, 0, 1)

transHEXtoRGB

Convert HEX to RGB

color.transHEXtoRGB('#ff0000')
// return
// { r: 255, g: 0, b: 0 }

transRGBtoHEX

Convert RGB to HEX

color.transRGBtoHEX('rgb(255, 0, 0)')
// return
// #ff0000