Commit 35891751 authored by Tasso Evangelista's avatar Tasso Evangelista

Expand color naming

parent 8b634833
...@@ -10,6 +10,12 @@ $-map-type-to-prefix: ( ...@@ -10,6 +10,12 @@ $-map-type-to-prefix: (
success: 'g', success: 'g',
warning: 'y', warning: 'y',
danger: 'r', danger: 'r',
red: 'r',
orange: 'o',
yellow: 'y',
green: 'g',
blue: 'b',
purple: 'p',
); );
@function _get-palette-color($type, $grade, $alpha) { @function _get-palette-color($type, $grade, $alpha) {
...@@ -42,34 +48,57 @@ $-map-type-to-prefix: ( ...@@ -42,34 +48,57 @@ $-map-type-to-prefix: (
@return (--rcx-color-#{ $type }-#{ $grade }, $base-color); @return (--rcx-color-#{ $type }-#{ $grade }, $base-color);
} }
@function neutral($grade, $alpha: null) { @function _refer-palette-color($type, $grade, $alpha: null) {
$pair: _get-palette-color(neutral, $grade, $alpha); $pair: _get-palette-color($type, $grade, $alpha);
@return var(list.nth($pair, 1), list.nth($pair, 2)); @return var(list.nth($pair, 1), list.nth($pair, 2));
} }
@function neutral($grade, $alpha: null) {
@return _refer-palette-color(neutral, $grade, $alpha);
}
@function primary($grade, $alpha: null) { @function primary($grade, $alpha: null) {
$pair: _get-palette-color(primary, $grade, $alpha); @return _refer-palette-color(primary, $grade, $alpha);
@return var(list.nth($pair, 1), list.nth($pair, 2));
} }
@function info($grade, $alpha: null) { @function info($grade, $alpha: null) {
$pair: _get-palette-color(info, $grade, $alpha); @return _refer-palette-color(info, $grade, $alpha);
@return var(list.nth($pair, 1), list.nth($pair, 2));
} }
@function success($grade, $alpha: null) { @function success($grade, $alpha: null) {
$pair: _get-palette-color(success, $grade, $alpha); @return _refer-palette-color(success, $grade, $alpha);
@return var(list.nth($pair, 1), list.nth($pair, 2));
} }
@function warning($grade, $alpha: null) { @function warning($grade, $alpha: null) {
$pair: _get-palette-color(warning, $grade, $alpha); @return _refer-palette-color(warning, $grade, $alpha);
@return var(list.nth($pair, 1), list.nth($pair, 2));
} }
@function danger($grade, $alpha: null) { @function danger($grade, $alpha: null) {
$pair: _get-palette-color(danger, $grade, $alpha); @return _refer-palette-color(danger, $grade, $alpha);
@return var(list.nth($pair, 1), list.nth($pair, 2)); }
@function red($grade, $alpha: null) {
@return _refer-palette-color('red', $grade, $alpha);
}
@function orange($grade, $alpha: null) {
@return _refer-palette-color('orange', $grade, $alpha);
}
@function yellow($grade, $alpha: null) {
@return _refer-palette-color('yellow', $grade, $alpha);
}
@function green($grade, $alpha: null) {
@return _refer-palette-color('green', $grade, $alpha);
}
@function blue($grade, $alpha: null) {
@return _refer-palette-color('blue', $grade, $alpha);
}
@function purple($grade, $alpha: null) {
@return _refer-palette-color('purple', $grade, $alpha);
} }
@function surface() { @function surface() {
......
...@@ -13,6 +13,12 @@ const mapTypeToPrefix = { ...@@ -13,6 +13,12 @@ const mapTypeToPrefix = {
success: 'g', success: 'g',
warning: 'y', warning: 'y',
danger: 'r', danger: 'r',
red: 'r',
orange: 'o',
yellow: 'y',
green: 'g',
blue: 'b',
purple: 'p',
}; };
const getPaletteColor = (type, grade, alpha) => { const getPaletteColor = (type, grade, alpha) => {
...@@ -63,7 +69,7 @@ const getForegroundColor = (type) => { ...@@ -63,7 +69,7 @@ const getForegroundColor = (type) => {
return [`--rcx-color-foreground-${ type }`, color]; return [`--rcx-color-foreground-${ type }`, color];
}; };
const paletteColorRegex = /^(neutral|primary|info|success|warning|danger)-(\d+)(-(\d+))?$/; const paletteColorRegex = /^([a-z]+)-(\d+)(-(\d+))?$/;
export const getColorValue = memoize((propValue) => { export const getColorValue = memoize((propValue) => {
if (propValue === undefined || propValue === null || typeof propValue !== 'string') { if (propValue === undefined || propValue === null || typeof propValue !== 'string') {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment