@xanui/core 1.2.5 → 1.2.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/getProps.js +19 -34
- package/css/getProps.js.map +1 -1
- package/css/getProps.mjs +19 -34
- package/css/getProps.mjs.map +1 -1
- package/css/getValue.js +6 -8
- package/css/getValue.js.map +1 -1
- package/css/getValue.mjs +6 -8
- package/css/getValue.mjs.map +1 -1
- package/css/types.d.ts +0 -1
- package/hooks/useColorTemplate.d.ts +11 -18
- package/hooks/useColorTemplate.js +50 -26
- package/hooks/useColorTemplate.js.map +1 -1
- package/hooks/useColorTemplate.mjs +50 -26
- package/hooks/useColorTemplate.mjs.map +1 -1
- package/hooks/useScrollbar.js +6 -6
- package/hooks/useScrollbar.js.map +1 -1
- package/hooks/useScrollbar.mjs +6 -6
- package/hooks/useScrollbar.mjs.map +1 -1
- package/index.d.ts +1 -1
- package/package.json +1 -1
- package/theme/ThemeCssVars.js +1 -1
- package/theme/ThemeCssVars.js.map +1 -1
- package/theme/ThemeCssVars.mjs +1 -1
- package/theme/ThemeCssVars.mjs.map +1 -1
- package/theme/ThemeDefaultOptions.js +27 -73
- package/theme/ThemeDefaultOptions.js.map +1 -1
- package/theme/ThemeDefaultOptions.mjs +27 -73
- package/theme/ThemeDefaultOptions.mjs.map +1 -1
- package/theme/ThemeProvider.js +1 -1
- package/theme/ThemeProvider.js.map +1 -1
- package/theme/ThemeProvider.mjs +1 -1
- package/theme/ThemeProvider.mjs.map +1 -1
- package/theme/types.d.ts +7 -10
package/css/getProps.js
CHANGED
|
@@ -16,41 +16,26 @@
|
|
|
16
16
|
}
|
|
17
17
|
return {};
|
|
18
18
|
}
|
|
19
|
-
if (prop ===
|
|
20
|
-
const
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
}
|
|
32
|
-
};
|
|
33
|
-
}
|
|
34
|
-
else {
|
|
35
|
-
return {
|
|
36
|
-
marginTop: `calc(-1 * ${val}px)${important || ""}`,
|
|
37
|
-
marginLeft: `calc(-1 * ${val}px)${important || ""}`,
|
|
38
|
-
'& > *': {
|
|
39
|
-
paddingTop: `${val}px${important || ""}`,
|
|
40
|
-
marginLeft: `${val}px${important || ""}`,
|
|
41
|
-
}
|
|
42
|
-
};
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
if (typeof value === 'number') {
|
|
46
|
-
let val = value * 8;
|
|
47
|
-
return {
|
|
48
|
-
margin: `-${val}px${important || ""}`,
|
|
49
|
-
'& > *': {
|
|
50
|
-
padding: `${val}px${important || ""}`,
|
|
51
|
-
}
|
|
52
|
-
};
|
|
19
|
+
if (prop === "spacing" && typeof value === "number") {
|
|
20
|
+
const val = value * 8;
|
|
21
|
+
const isFlex = (_css === null || _css === void 0 ? void 0 : _css.flexBox) ||
|
|
22
|
+
(_css === null || _css === void 0 ? void 0 : _css.flexRow) ||
|
|
23
|
+
(_css === null || _css === void 0 ? void 0 : _css.flexColumn) ||
|
|
24
|
+
(_css === null || _css === void 0 ? void 0 : _css.display) === "flex";
|
|
25
|
+
if (isFlex) {
|
|
26
|
+
const isColumn = (_css === null || _css === void 0 ? void 0 : _css.flexColumn) === true;
|
|
27
|
+
return Object.assign(Object.assign({}, (isColumn
|
|
28
|
+
? { marginTop: `-${val}px${important || ""}` }
|
|
29
|
+
: { marginLeft: `-${val}px${important || ""}` })), { "& > *": isColumn
|
|
30
|
+
? { marginTop: `${val}px${important || ""}` }
|
|
31
|
+
: { marginLeft: `${val}px${important || ""}` } });
|
|
53
32
|
}
|
|
33
|
+
// non-flex fallback (safe & predictable)
|
|
34
|
+
return {
|
|
35
|
+
"& > * + *": {
|
|
36
|
+
marginTop: `${val}px${important || ""}`,
|
|
37
|
+
},
|
|
38
|
+
};
|
|
54
39
|
}
|
|
55
40
|
if (value && typeof value === "number" && ["border", "borderRight", "borderLeft", "borderTop", "borderBottom"].includes(prop)) {
|
|
56
41
|
const keys = Object.keys(_css);
|
package/css/getProps.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getProps.js","sources":["../../src/css/getProps.ts"],"sourcesContent":["import { CSSProps } from \"./types\";\r\n\r\nconst getProps = (prop: string, value: string, _css: CSSProps) => {\r\n let important;\r\n if (typeof value === 'string') {\r\n const split = value.split(\"!\")\r\n important = split[1] ? \"!important\" : \"\"\r\n value = split[0]\r\n }\r\n\r\n if (prop === 'disabled') {\r\n if ((value as any) === true) {\r\n return {\r\n pointerEvents: \"none!important\",\r\n cursor: \"default!important\",\r\n userSelect: \"none!important\",\r\n opacity: \".8!important\"\r\n } as any\r\n }\r\n return {}\r\n }\r\n\r\n\r\n if (prop ===
|
|
1
|
+
{"version":3,"file":"getProps.js","sources":["../../src/css/getProps.ts"],"sourcesContent":["import { CSSProps } from \"./types\";\r\n\r\nconst getProps = (prop: string, value: string, _css: CSSProps) => {\r\n let important;\r\n if (typeof value === 'string') {\r\n const split = value.split(\"!\")\r\n important = split[1] ? \"!important\" : \"\"\r\n value = split[0]\r\n }\r\n\r\n if (prop === 'disabled') {\r\n if ((value as any) === true) {\r\n return {\r\n pointerEvents: \"none!important\",\r\n cursor: \"default!important\",\r\n userSelect: \"none!important\",\r\n opacity: \".8!important\"\r\n } as any\r\n }\r\n return {}\r\n }\r\n\r\n\r\n if (prop === \"spacing\" && typeof value === \"number\") {\r\n const val = value * 8;\r\n const isFlex =\r\n (_css as any)?.flexBox ||\r\n (_css as any)?.flexRow ||\r\n (_css as any)?.flexColumn ||\r\n (_css as any)?.display === \"flex\";\r\n\r\n if (isFlex) {\r\n const isColumn = (_css as any)?.flexColumn === true;\r\n\r\n return {\r\n ...(isColumn\r\n ? { marginTop: `-${val}px${important || \"\"}` }\r\n : { marginLeft: `-${val}px${important || \"\"}` }),\r\n\r\n \"& > *\": isColumn\r\n ? { marginTop: `${val}px${important || \"\"}` }\r\n : { marginLeft: `${val}px${important || \"\"}` },\r\n } as any;\r\n }\r\n\r\n // non-flex fallback (safe & predictable)\r\n return {\r\n \"& > * + *\": {\r\n marginTop: `${val}px${important || \"\"}`,\r\n },\r\n } as any;\r\n }\r\n\r\n\r\n if (value && typeof value === \"number\" && [\"border\", \"borderRight\", \"borderLeft\", \"borderTop\", \"borderBottom\"].includes(prop as any)) {\r\n const keys: any = Object.keys(_css)\r\n let p: any = {\r\n [`${prop}Width`]: value + 'px' + (important || \"\"),\r\n }\r\n if (!keys.includes(`${prop}Color`)) {\r\n p[`${prop}Color`] = \"divider\"\r\n }\r\n if (!keys.includes(`${prop}Style`)) {\r\n p[`${prop}Style`] = \"solid\"\r\n }\r\n return p\r\n }\r\n}\r\n\r\nexport default getProps"],"names":[],"mappings":"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"}
|
package/css/getProps.mjs
CHANGED
|
@@ -16,41 +16,26 @@ const getProps = (prop, value, _css) => {
|
|
|
16
16
|
}
|
|
17
17
|
return {};
|
|
18
18
|
}
|
|
19
|
-
if (prop ===
|
|
20
|
-
const
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
}
|
|
32
|
-
};
|
|
33
|
-
}
|
|
34
|
-
else {
|
|
35
|
-
return {
|
|
36
|
-
marginTop: `calc(-1 * ${val}px)${important || ""}`,
|
|
37
|
-
marginLeft: `calc(-1 * ${val}px)${important || ""}`,
|
|
38
|
-
'& > *': {
|
|
39
|
-
paddingTop: `${val}px${important || ""}`,
|
|
40
|
-
marginLeft: `${val}px${important || ""}`,
|
|
41
|
-
}
|
|
42
|
-
};
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
if (typeof value === 'number') {
|
|
46
|
-
let val = value * 8;
|
|
47
|
-
return {
|
|
48
|
-
margin: `-${val}px${important || ""}`,
|
|
49
|
-
'& > *': {
|
|
50
|
-
padding: `${val}px${important || ""}`,
|
|
51
|
-
}
|
|
52
|
-
};
|
|
19
|
+
if (prop === "spacing" && typeof value === "number") {
|
|
20
|
+
const val = value * 8;
|
|
21
|
+
const isFlex = (_css === null || _css === void 0 ? void 0 : _css.flexBox) ||
|
|
22
|
+
(_css === null || _css === void 0 ? void 0 : _css.flexRow) ||
|
|
23
|
+
(_css === null || _css === void 0 ? void 0 : _css.flexColumn) ||
|
|
24
|
+
(_css === null || _css === void 0 ? void 0 : _css.display) === "flex";
|
|
25
|
+
if (isFlex) {
|
|
26
|
+
const isColumn = (_css === null || _css === void 0 ? void 0 : _css.flexColumn) === true;
|
|
27
|
+
return Object.assign(Object.assign({}, (isColumn
|
|
28
|
+
? { marginTop: `-${val}px${important || ""}` }
|
|
29
|
+
: { marginLeft: `-${val}px${important || ""}` })), { "& > *": isColumn
|
|
30
|
+
? { marginTop: `${val}px${important || ""}` }
|
|
31
|
+
: { marginLeft: `${val}px${important || ""}` } });
|
|
53
32
|
}
|
|
33
|
+
// non-flex fallback (safe & predictable)
|
|
34
|
+
return {
|
|
35
|
+
"& > * + *": {
|
|
36
|
+
marginTop: `${val}px${important || ""}`,
|
|
37
|
+
},
|
|
38
|
+
};
|
|
54
39
|
}
|
|
55
40
|
if (value && typeof value === "number" && ["border", "borderRight", "borderLeft", "borderTop", "borderBottom"].includes(prop)) {
|
|
56
41
|
const keys = Object.keys(_css);
|
package/css/getProps.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getProps.mjs","sources":["../../src/css/getProps.ts"],"sourcesContent":["import { CSSProps } from \"./types\";\r\n\r\nconst getProps = (prop: string, value: string, _css: CSSProps) => {\r\n let important;\r\n if (typeof value === 'string') {\r\n const split = value.split(\"!\")\r\n important = split[1] ? \"!important\" : \"\"\r\n value = split[0]\r\n }\r\n\r\n if (prop === 'disabled') {\r\n if ((value as any) === true) {\r\n return {\r\n pointerEvents: \"none!important\",\r\n cursor: \"default!important\",\r\n userSelect: \"none!important\",\r\n opacity: \".8!important\"\r\n } as any\r\n }\r\n return {}\r\n }\r\n\r\n\r\n if (prop ===
|
|
1
|
+
{"version":3,"file":"getProps.mjs","sources":["../../src/css/getProps.ts"],"sourcesContent":["import { CSSProps } from \"./types\";\r\n\r\nconst getProps = (prop: string, value: string, _css: CSSProps) => {\r\n let important;\r\n if (typeof value === 'string') {\r\n const split = value.split(\"!\")\r\n important = split[1] ? \"!important\" : \"\"\r\n value = split[0]\r\n }\r\n\r\n if (prop === 'disabled') {\r\n if ((value as any) === true) {\r\n return {\r\n pointerEvents: \"none!important\",\r\n cursor: \"default!important\",\r\n userSelect: \"none!important\",\r\n opacity: \".8!important\"\r\n } as any\r\n }\r\n return {}\r\n }\r\n\r\n\r\n if (prop === \"spacing\" && typeof value === \"number\") {\r\n const val = value * 8;\r\n const isFlex =\r\n (_css as any)?.flexBox ||\r\n (_css as any)?.flexRow ||\r\n (_css as any)?.flexColumn ||\r\n (_css as any)?.display === \"flex\";\r\n\r\n if (isFlex) {\r\n const isColumn = (_css as any)?.flexColumn === true;\r\n\r\n return {\r\n ...(isColumn\r\n ? { marginTop: `-${val}px${important || \"\"}` }\r\n : { marginLeft: `-${val}px${important || \"\"}` }),\r\n\r\n \"& > *\": isColumn\r\n ? { marginTop: `${val}px${important || \"\"}` }\r\n : { marginLeft: `${val}px${important || \"\"}` },\r\n } as any;\r\n }\r\n\r\n // non-flex fallback (safe & predictable)\r\n return {\r\n \"& > * + *\": {\r\n marginTop: `${val}px${important || \"\"}`,\r\n },\r\n } as any;\r\n }\r\n\r\n\r\n if (value && typeof value === \"number\" && [\"border\", \"borderRight\", \"borderLeft\", \"borderTop\", \"borderBottom\"].includes(prop as any)) {\r\n const keys: any = Object.keys(_css)\r\n let p: any = {\r\n [`${prop}Width`]: value + 'px' + (important || \"\"),\r\n }\r\n if (!keys.includes(`${prop}Color`)) {\r\n p[`${prop}Color`] = \"divider\"\r\n }\r\n if (!keys.includes(`${prop}Style`)) {\r\n p[`${prop}Style`] = \"solid\"\r\n }\r\n return p\r\n }\r\n}\r\n\r\nexport default getProps"],"names":[],"mappings":"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"}
|
package/css/getValue.js
CHANGED
|
@@ -1,16 +1,14 @@
|
|
|
1
|
-
'use strict';Object.defineProperty(exports,'__esModule',{value:true});const getColor = (color) => {
|
|
2
|
-
|
|
3
|
-
[`${color}`]: `var(--color-${color}-primary)`,
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});const getColor = (color, hasText = true) => {
|
|
2
|
+
const i = {
|
|
4
3
|
[`${color}.primary`]: `var(--color-${color}-primary)`,
|
|
5
4
|
[`${color}.secondary`]: `var(--color-${color}-secondary)`,
|
|
6
|
-
[`${color}.alpha`]: `var(--color-${color}-alpha)`,
|
|
7
|
-
[`${color}.divider`]: `var(--color-${color}-divider)`,
|
|
8
|
-
[`${color}.text.primary`]: `var(--color-${color}-text-primary)`,
|
|
9
|
-
[`${color}.text.secondary`]: `var(--color-${color}-text-secondary)`,
|
|
10
5
|
};
|
|
6
|
+
if (hasText)
|
|
7
|
+
i[`${color}.text`] = `var(--color-${color}-text)`;
|
|
8
|
+
return i;
|
|
11
9
|
};
|
|
12
10
|
const withImportant = (important, value) => important ? value + important : value;
|
|
13
|
-
const colors = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, getColor("
|
|
11
|
+
const colors = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, getColor("text", false)), getColor("divider", false)), getColor("common")), getColor("brand")), getColor("accent")), getColor("info")), getColor("success")), getColor("warning")), getColor("danger"));
|
|
14
12
|
const breakpoints = {
|
|
15
13
|
"xs": "var(--bp-xs)",
|
|
16
14
|
"sm": "var(--bp-sm)",
|
package/css/getValue.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getValue.js","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\r\n\r\nconst getColor = (color: string) => {\r\n
|
|
1
|
+
{"version":3,"file":"getValue.js","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\r\n\r\nconst getColor = (color: string, hasText = true) => {\r\n const i = {\r\n [`${color}.primary`]: `var(--color-${color}-primary)`,\r\n [`${color}.secondary`]: `var(--color-${color}-secondary)`,\r\n }\r\n if (hasText) i[`${color}.text`] = `var(--color-${color}-text)`\r\n\r\n return i\r\n}\r\n\r\nconst withImportant = (important: any, value: any) => important ? value + important : value\r\nconst colors: any = {\r\n ...getColor(\"text\", false),\r\n ...getColor(\"divider\", false),\r\n ...getColor(\"common\"),\r\n ...getColor(\"brand\"),\r\n ...getColor(\"accent\"),\r\n ...getColor(\"info\"),\r\n ...getColor(\"success\"),\r\n ...getColor(\"warning\"),\r\n ...getColor(\"danger\"),\r\n}\r\n\r\nconst breakpoints: any = {\r\n \"xs\": \"var(--bp-xs)\",\r\n \"sm\": \"var(--bp-sm)\",\r\n \"md\": \"var(--bp-md)\",\r\n \"lg\": \"var(--bp-lg)\",\r\n \"xl\": \"var(--bp-xl)\"\r\n}\r\n\r\nlet fontsizes: any = {\r\n \"h1\": \"var(--fontsize-h1)\",\r\n \"h2\": \"var(--fontsize-h2)\",\r\n \"h3\": \"var(--fontsize-h3)\",\r\n \"h4\": \"var(--fontsize-h4)\",\r\n \"h5\": \"var(--fontsize-h5)\",\r\n \"h6\": \"var(--fontsize-h6)\",\r\n \"big\": \"var(--fontsize-big)\",\r\n \"text\": \"var(--fontsize-text)\",\r\n \"button\": \"var(--fontsize-button)\",\r\n \"small\": \"var(--fontsize-small)\"\r\n}\r\n\r\nlet lineHeights: any = {\r\n \"h1\": \"var(--lineheight-h1)\",\r\n \"h2\": \"var(--lineheight-h2)\",\r\n \"h3\": \"var(--lineheight-h3)\",\r\n \"h4\": \"var(--lineheight-h4)\",\r\n \"h5\": \"var(--lineheight-h5)\",\r\n \"h6\": \"var(--lineheight-h6)\",\r\n \"big\": \"var(--lineheight-big)\",\r\n \"text\": \"var(--lineheight-text)\",\r\n \"button\": \"var(--lineheight-button)\",\r\n \"small\": \"var(--lineheight-small)\"\r\n}\r\n\r\nlet fontWeights: any = {\r\n \"h1\": \"var(--fontweight-h1)\",\r\n \"h2\": \"var(--fontweight-h2)\",\r\n \"h3\": \"var(--fontweight-h3)\",\r\n \"h4\": \"var(--fontweight-h4)\",\r\n \"h5\": \"var(--fontweight-h5)\",\r\n \"h6\": \"var(--fontweight-h6)\",\r\n \"big\": \"var(--fontweight-big)\",\r\n \"text\": \"var(--fontweight-text)\",\r\n \"button\": \"var(--fontweight-button)\",\r\n \"small\": \"var(--fontweight-small)\"\r\n}\r\n\r\nlet font: any = {\r\n \"h1\": \"var(--font-h1)\",\r\n \"h2\": \"var(--font-h2)\",\r\n \"h3\": \"var(--font-h3)\",\r\n \"h4\": \"var(--font-h4)\",\r\n \"h5\": \"var(--font-h5)\",\r\n \"h6\": \"var(--font-h6)\",\r\n \"big\": \"var(--font-big)\",\r\n \"text\": \"var(--font-text)\",\r\n \"button\": \"var(--font-button)\",\r\n \"small\": \"var(--font-small)\"\r\n}\r\n\r\nconst getValue = (prop: any, value: string | number, _css: CSSProps): any => {\r\n let important;\r\n\r\n if (typeof value === 'string') {\r\n const split = value.split(\"!\")\r\n important = split[1] ? \"!important\" : \"\"\r\n value = split[0]\r\n }\r\n\r\n\r\n if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {\r\n return withImportant(important, breakpoints[value] || value)\r\n } else if (prop === 'font' && typeof value === \"string\" && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, font[value] || value)\r\n } else if (['fontWeight', 'font-weight'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, fontWeights[value] || value)\r\n } else if (['lineHeight', 'line-height'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, lineHeights[value] || value)\r\n } else if (['fontSize', 'font-size'].includes(prop) && typeof value === 'string') {\r\n return withImportant(important, fontsizes[value] || value)\r\n } else if (typeof value === \"number\" && [\"shadow\", \"boxShadow\"].includes(prop)) {\r\n return withImportant(important, `var(--shadow-${value})`)\r\n }\r\n\r\n return withImportant(important, colors[value] || value)\r\n}\r\n\r\nexport default getValue"],"names":[],"mappings":"sEAEA,MAAM,QAAQ,GAAG,CAAC,KAAa,EAAE,OAAO,GAAG,IAAI,KAAI;AAC/C,IAAA,MAAM,CAAC,GAAG;AACN,QAAA,CAAC,GAAG,KAAK,CAAA,QAAA,CAAU,GAAG,CAAA,YAAA,EAAe,KAAK,CAAA,SAAA,CAAW;AACrD,QAAA,CAAC,GAAG,KAAK,CAAA,UAAA,CAAY,GAAG,CAAA,YAAA,EAAe,KAAK,CAAA,WAAA,CAAa;KAC5D;AACD,IAAA,IAAI,OAAO;QAAE,CAAC,CAAC,GAAG,KAAK,CAAA,KAAA,CAAO,CAAC,GAAG,CAAA,YAAA,EAAe,KAAK,CAAA,MAAA,CAAQ;AAE9D,IAAA,OAAO,CAAC;AACZ,CAAC;AAED,MAAM,aAAa,GAAG,CAAC,SAAc,EAAE,KAAU,KAAK,SAAS,GAAG,KAAK,GAAG,SAAS,GAAG,KAAK;AAC3F,MAAM,MAAM,qIACL,QAAQ,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA,EACvB,QAAQ,CAAC,SAAS,EAAE,KAAK,CAAC,CAAA,EAC1B,QAAQ,CAAC,QAAQ,CAAC,CAAA,EAClB,QAAQ,CAAC,OAAO,CAAC,GACjB,QAAQ,CAAC,QAAQ,CAAC,CAAA,EAClB,QAAQ,CAAC,MAAM,CAAC,CAAA,EAChB,QAAQ,CAAC,SAAS,CAAC,CAAA,EACnB,QAAQ,CAAC,SAAS,CAAC,CAAA,EACnB,QAAQ,CAAC,QAAQ,CAAC,CACxB;AAED,MAAM,WAAW,GAAQ;AACrB,IAAA,IAAI,EAAE,cAAc;AACpB,IAAA,IAAI,EAAE,cAAc;AACpB,IAAA,IAAI,EAAE,cAAc;AACpB,IAAA,IAAI,EAAE,cAAc;AACpB,IAAA,IAAI,EAAE;CACT;AAED,IAAI,SAAS,GAAQ;AACjB,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,KAAK,EAAE,qBAAqB;AAC5B,IAAA,MAAM,EAAE,sBAAsB;AAC9B,IAAA,QAAQ,EAAE,wBAAwB;AAClC,IAAA,OAAO,EAAE;CACZ;AAED,IAAI,WAAW,GAAQ;AACnB,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,KAAK,EAAE,uBAAuB;AAC9B,IAAA,MAAM,EAAE,wBAAwB;AAChC,IAAA,QAAQ,EAAE,0BAA0B;AACpC,IAAA,OAAO,EAAE;CACZ;AAED,IAAI,WAAW,GAAQ;AACnB,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,KAAK,EAAE,uBAAuB;AAC9B,IAAA,MAAM,EAAE,wBAAwB;AAChC,IAAA,QAAQ,EAAE,0BAA0B;AACpC,IAAA,OAAO,EAAE;CACZ;AAED,IAAI,IAAI,GAAQ;AACZ,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,KAAK,EAAE,iBAAiB;AACxB,IAAA,MAAM,EAAE,kBAAkB;AAC1B,IAAA,QAAQ,EAAE,oBAAoB;AAC9B,IAAA,OAAO,EAAE;CACZ;AAED,MAAM,QAAQ,GAAG,CAAC,IAAS,EAAE,KAAsB,EAAE,IAAc,KAAS;AACxE,IAAA,IAAI,SAAS;AAEb,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC3B,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAC9B,QAAA,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,YAAY,GAAG,EAAE;AACxC,QAAA,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC;IACpB;AAGA,IAAA,IAAI,CAAC,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;QAC5E,OAAO,aAAa,CAAC,SAAS,EAAE,WAAW,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;IAChE;AAAO,SAAA,IAAI,IAAI,KAAK,MAAM,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;QACxI,OAAO,aAAa,CAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;IACzD;AAAO,SAAA,IAAI,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;QACrK,OAAO,aAAa,CAAC,SAAS,EAAE,WAAW,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;IAChE;AAAO,SAAA,IAAI,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;QACrK,OAAO,aAAa,CAAC,SAAS,EAAE,WAAW,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;IAChE;AAAO,SAAA,IAAI,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC9E,OAAO,aAAa,CAAC,SAAS,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;IAC9D;AAAO,SAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;QAC5E,OAAO,aAAa,CAAC,SAAS,EAAE,gBAAgB,KAAK,CAAA,CAAA,CAAG,CAAC;IAC7D;IAEA,OAAO,aAAa,CAAC,SAAS,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;AAC3D"}
|
package/css/getValue.mjs
CHANGED
|
@@ -1,16 +1,14 @@
|
|
|
1
|
-
const getColor = (color) => {
|
|
2
|
-
|
|
3
|
-
[`${color}`]: `var(--color-${color}-primary)`,
|
|
1
|
+
const getColor = (color, hasText = true) => {
|
|
2
|
+
const i = {
|
|
4
3
|
[`${color}.primary`]: `var(--color-${color}-primary)`,
|
|
5
4
|
[`${color}.secondary`]: `var(--color-${color}-secondary)`,
|
|
6
|
-
[`${color}.alpha`]: `var(--color-${color}-alpha)`,
|
|
7
|
-
[`${color}.divider`]: `var(--color-${color}-divider)`,
|
|
8
|
-
[`${color}.text.primary`]: `var(--color-${color}-text-primary)`,
|
|
9
|
-
[`${color}.text.secondary`]: `var(--color-${color}-text-secondary)`,
|
|
10
5
|
};
|
|
6
|
+
if (hasText)
|
|
7
|
+
i[`${color}.text`] = `var(--color-${color}-text)`;
|
|
8
|
+
return i;
|
|
11
9
|
};
|
|
12
10
|
const withImportant = (important, value) => important ? value + important : value;
|
|
13
|
-
const colors = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, getColor("
|
|
11
|
+
const colors = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, getColor("text", false)), getColor("divider", false)), getColor("common")), getColor("brand")), getColor("accent")), getColor("info")), getColor("success")), getColor("warning")), getColor("danger"));
|
|
14
12
|
const breakpoints = {
|
|
15
13
|
"xs": "var(--bp-xs)",
|
|
16
14
|
"sm": "var(--bp-sm)",
|
package/css/getValue.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getValue.mjs","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\r\n\r\nconst getColor = (color: string) => {\r\n
|
|
1
|
+
{"version":3,"file":"getValue.mjs","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\r\n\r\nconst getColor = (color: string, hasText = true) => {\r\n const i = {\r\n [`${color}.primary`]: `var(--color-${color}-primary)`,\r\n [`${color}.secondary`]: `var(--color-${color}-secondary)`,\r\n }\r\n if (hasText) i[`${color}.text`] = `var(--color-${color}-text)`\r\n\r\n return i\r\n}\r\n\r\nconst withImportant = (important: any, value: any) => important ? value + important : value\r\nconst colors: any = {\r\n ...getColor(\"text\", false),\r\n ...getColor(\"divider\", false),\r\n ...getColor(\"common\"),\r\n ...getColor(\"brand\"),\r\n ...getColor(\"accent\"),\r\n ...getColor(\"info\"),\r\n ...getColor(\"success\"),\r\n ...getColor(\"warning\"),\r\n ...getColor(\"danger\"),\r\n}\r\n\r\nconst breakpoints: any = {\r\n \"xs\": \"var(--bp-xs)\",\r\n \"sm\": \"var(--bp-sm)\",\r\n \"md\": \"var(--bp-md)\",\r\n \"lg\": \"var(--bp-lg)\",\r\n \"xl\": \"var(--bp-xl)\"\r\n}\r\n\r\nlet fontsizes: any = {\r\n \"h1\": \"var(--fontsize-h1)\",\r\n \"h2\": \"var(--fontsize-h2)\",\r\n \"h3\": \"var(--fontsize-h3)\",\r\n \"h4\": \"var(--fontsize-h4)\",\r\n \"h5\": \"var(--fontsize-h5)\",\r\n \"h6\": \"var(--fontsize-h6)\",\r\n \"big\": \"var(--fontsize-big)\",\r\n \"text\": \"var(--fontsize-text)\",\r\n \"button\": \"var(--fontsize-button)\",\r\n \"small\": \"var(--fontsize-small)\"\r\n}\r\n\r\nlet lineHeights: any = {\r\n \"h1\": \"var(--lineheight-h1)\",\r\n \"h2\": \"var(--lineheight-h2)\",\r\n \"h3\": \"var(--lineheight-h3)\",\r\n \"h4\": \"var(--lineheight-h4)\",\r\n \"h5\": \"var(--lineheight-h5)\",\r\n \"h6\": \"var(--lineheight-h6)\",\r\n \"big\": \"var(--lineheight-big)\",\r\n \"text\": \"var(--lineheight-text)\",\r\n \"button\": \"var(--lineheight-button)\",\r\n \"small\": \"var(--lineheight-small)\"\r\n}\r\n\r\nlet fontWeights: any = {\r\n \"h1\": \"var(--fontweight-h1)\",\r\n \"h2\": \"var(--fontweight-h2)\",\r\n \"h3\": \"var(--fontweight-h3)\",\r\n \"h4\": \"var(--fontweight-h4)\",\r\n \"h5\": \"var(--fontweight-h5)\",\r\n \"h6\": \"var(--fontweight-h6)\",\r\n \"big\": \"var(--fontweight-big)\",\r\n \"text\": \"var(--fontweight-text)\",\r\n \"button\": \"var(--fontweight-button)\",\r\n \"small\": \"var(--fontweight-small)\"\r\n}\r\n\r\nlet font: any = {\r\n \"h1\": \"var(--font-h1)\",\r\n \"h2\": \"var(--font-h2)\",\r\n \"h3\": \"var(--font-h3)\",\r\n \"h4\": \"var(--font-h4)\",\r\n \"h5\": \"var(--font-h5)\",\r\n \"h6\": \"var(--font-h6)\",\r\n \"big\": \"var(--font-big)\",\r\n \"text\": \"var(--font-text)\",\r\n \"button\": \"var(--font-button)\",\r\n \"small\": \"var(--font-small)\"\r\n}\r\n\r\nconst getValue = (prop: any, value: string | number, _css: CSSProps): any => {\r\n let important;\r\n\r\n if (typeof value === 'string') {\r\n const split = value.split(\"!\")\r\n important = split[1] ? \"!important\" : \"\"\r\n value = split[0]\r\n }\r\n\r\n\r\n if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {\r\n return withImportant(important, breakpoints[value] || value)\r\n } else if (prop === 'font' && typeof value === \"string\" && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, font[value] || value)\r\n } else if (['fontWeight', 'font-weight'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, fontWeights[value] || value)\r\n } else if (['lineHeight', 'line-height'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, lineHeights[value] || value)\r\n } else if (['fontSize', 'font-size'].includes(prop) && typeof value === 'string') {\r\n return withImportant(important, fontsizes[value] || value)\r\n } else if (typeof value === \"number\" && [\"shadow\", \"boxShadow\"].includes(prop)) {\r\n return withImportant(important, `var(--shadow-${value})`)\r\n }\r\n\r\n return withImportant(important, colors[value] || value)\r\n}\r\n\r\nexport default getValue"],"names":[],"mappings":"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"}
|
package/css/types.d.ts
CHANGED
|
@@ -39,7 +39,6 @@ type Aliases = {
|
|
|
39
39
|
color?: CSSValueType<'color'> | ColorsRefTypes;
|
|
40
40
|
width?: CSSValueType<'width'> | BreakpointKeys;
|
|
41
41
|
height?: CSSValueType<'height'>;
|
|
42
|
-
borderColor?: CSSValueType<'backgroundColor'> | ColorsRefTypes;
|
|
43
42
|
fontSize?: CSSValueType<"fontSize"> | TypographyRefTypes;
|
|
44
43
|
minWidth?: CSSValueType<"minWidth"> | BreakpointKeys;
|
|
45
44
|
maxWidth?: CSSValueType<"maxWidth"> | BreakpointKeys;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { ThemeColor } from '../theme/types.js';
|
|
2
2
|
|
|
3
3
|
type UseColorTemplateType = "fill" | "outline" | "text" | "alpha";
|
|
4
|
+
type UseColorTemplateColor = "common" | "brand" | "accent" | "success" | "info" | "warning" | "danger";
|
|
4
5
|
declare const useColorTemplate: (name: keyof ThemeColor, type: UseColorTemplateType) => {
|
|
5
6
|
bgcolor: string;
|
|
6
7
|
color: string;
|
|
@@ -8,30 +9,22 @@ declare const useColorTemplate: (name: keyof ThemeColor, type: UseColorTemplateT
|
|
|
8
9
|
borderColor: string;
|
|
9
10
|
hover: {
|
|
10
11
|
color: string;
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
bgcolor: string;
|
|
15
|
-
color: string;
|
|
16
|
-
hover: {
|
|
17
|
-
bgcolor: string;
|
|
18
|
-
color: string;
|
|
19
|
-
};
|
|
20
|
-
} | {
|
|
21
|
-
bgcolor: string;
|
|
22
|
-
color: string;
|
|
23
|
-
hover: {
|
|
24
|
-
bgcolor: string;
|
|
25
|
-
color: string;
|
|
12
|
+
border: number;
|
|
13
|
+
borderColor: any;
|
|
14
|
+
bgcolor?: undefined;
|
|
26
15
|
};
|
|
27
16
|
} | {
|
|
28
17
|
bgcolor: string;
|
|
29
|
-
color:
|
|
18
|
+
color: any;
|
|
19
|
+
border: number;
|
|
20
|
+
borderColor: string;
|
|
30
21
|
hover: {
|
|
31
22
|
bgcolor: string;
|
|
32
|
-
color:
|
|
23
|
+
color: any;
|
|
24
|
+
border: number;
|
|
25
|
+
borderColor: string;
|
|
33
26
|
};
|
|
34
27
|
};
|
|
35
28
|
|
|
36
29
|
export { useColorTemplate as default };
|
|
37
|
-
export type { UseColorTemplateType };
|
|
30
|
+
export type { UseColorTemplateColor, UseColorTemplateType };
|
|
@@ -1,41 +1,65 @@
|
|
|
1
|
-
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var index=require('../css/index.js'),core=require('../theme/core.js');require('../theme/ThemeDefaultOptions.js'),require('../theme/ThemeProvider.js'),require('react-state-bucket');const useColorTemplate = (name, type) => {
|
|
2
2
|
const theme = core.useTheme();
|
|
3
3
|
let color = theme.colors[name];
|
|
4
|
-
let
|
|
5
|
-
|
|
4
|
+
let divider = theme.colors.divider.primary;
|
|
5
|
+
if (name === "common") {
|
|
6
|
+
color = Object.assign(Object.assign({}, color), { text: theme.colors.text.primary });
|
|
7
|
+
}
|
|
8
|
+
const if_common = (a, b) => name === "common" ? a : b;
|
|
9
|
+
if (type === "outline") {
|
|
10
|
+
return {
|
|
6
11
|
bgcolor: "transparent",
|
|
7
|
-
color: color.text.primary,
|
|
12
|
+
color: if_common(color.text, color.primary),
|
|
8
13
|
border: 1,
|
|
9
|
-
borderColor:
|
|
14
|
+
borderColor: divider,
|
|
10
15
|
hover: {
|
|
11
|
-
color: color.text.
|
|
16
|
+
color: if_common(color.text, color.secondary),
|
|
17
|
+
border: 1,
|
|
12
18
|
borderColor: color.divider,
|
|
13
19
|
}
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
20
|
+
};
|
|
21
|
+
}
|
|
22
|
+
else if (type === "fill") {
|
|
23
|
+
return {
|
|
24
|
+
bgcolor: if_common(color.secondary, color.primary),
|
|
25
|
+
color: color.text,
|
|
26
|
+
border: 0,
|
|
27
|
+
borderColor: `transparent`,
|
|
18
28
|
hover: {
|
|
19
|
-
bgcolor: color.secondary,
|
|
20
|
-
color: color.text
|
|
29
|
+
bgcolor: if_common(color.secondary, color.secondary),
|
|
30
|
+
color: color.text,
|
|
31
|
+
border: 0,
|
|
32
|
+
borderColor: `transparent`,
|
|
21
33
|
}
|
|
22
|
-
}
|
|
23
|
-
|
|
34
|
+
};
|
|
35
|
+
}
|
|
36
|
+
else if (type === "text") {
|
|
37
|
+
return {
|
|
24
38
|
bgcolor: "transparent",
|
|
25
|
-
color: color.primary,
|
|
39
|
+
color: if_common(color.text, color.primary),
|
|
40
|
+
border: 0,
|
|
41
|
+
borderColor: `transparent`,
|
|
26
42
|
hover: {
|
|
27
|
-
bgcolor: color.alpha,
|
|
28
|
-
color: color.primary,
|
|
43
|
+
bgcolor: if_common(color.secondary, index.alpha(color.primary, 0.09)),
|
|
44
|
+
color: if_common(color.text, color.primary),
|
|
45
|
+
border: 0,
|
|
46
|
+
borderColor: `transparent`,
|
|
29
47
|
}
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
else if (type === "alpha") {
|
|
51
|
+
return {
|
|
52
|
+
bgcolor: if_common(color.secondary, index.alpha(color.primary, 0.09)),
|
|
53
|
+
color: if_common(color.text, color.primary),
|
|
54
|
+
border: 0,
|
|
55
|
+
borderColor: `transparent`,
|
|
34
56
|
hover: {
|
|
35
|
-
bgcolor: color.alpha,
|
|
36
|
-
color: color.primary,
|
|
57
|
+
bgcolor: if_common(color.secondary, index.alpha(color.primary, 0.15)),
|
|
58
|
+
color: if_common(color.text, color.primary),
|
|
59
|
+
border: 0,
|
|
60
|
+
borderColor: `transparent`,
|
|
37
61
|
}
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
|
|
62
|
+
};
|
|
63
|
+
}
|
|
64
|
+
throw new Error(`useColorTemplate: Unknown type ${type}`);
|
|
41
65
|
};exports.default=useColorTemplate;//# sourceMappingURL=useColorTemplate.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColorTemplate.js","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\r\nimport { ThemeColor } from \"../theme/types\"\r\n\r\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"alpha\"\r\n\r\nconst useColorTemplate = (name: keyof ThemeColor, type: UseColorTemplateType) => {\r\n const theme = useTheme()\r\n let color = theme.colors[name]\r\n\r\n
|
|
1
|
+
{"version":3,"file":"useColorTemplate.js","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["import { alpha } from \"../css\"\r\nimport { useTheme } from \"../theme\"\r\nimport { ThemeColor } from \"../theme/types\"\r\n\r\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"alpha\"\r\nexport type UseColorTemplateColor = \"common\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\r\n\r\nconst useColorTemplate = (name: keyof ThemeColor, type: UseColorTemplateType) => {\r\n const theme = useTheme()\r\n let color: any = theme.colors[name]\r\n let divider = theme.colors.divider.primary\r\n\r\n if (name === \"common\") {\r\n color = {\r\n ...color,\r\n text: theme.colors.text.primary,\r\n }\r\n }\r\n\r\n const if_common = (a: string, b: string) => name === \"common\" ? a : b\r\n\r\n if (type === \"outline\") {\r\n return {\r\n bgcolor: \"transparent\",\r\n color: if_common(color.text, color.primary),\r\n border: 1,\r\n borderColor: divider,\r\n hover: {\r\n color: if_common(color.text, color.secondary),\r\n border: 1,\r\n borderColor: color.divider,\r\n }\r\n }\r\n } else if (type === \"fill\") {\r\n return {\r\n bgcolor: if_common(color.secondary, color.primary),\r\n color: color.text,\r\n border: 0,\r\n borderColor: `transparent`,\r\n hover: {\r\n bgcolor: if_common(color.secondary, color.secondary),\r\n color: color.text,\r\n border: 0,\r\n borderColor: `transparent`,\r\n }\r\n }\r\n } else if (type === \"text\") {\r\n return {\r\n bgcolor: \"transparent\",\r\n color: if_common(color.text, color.primary),\r\n border: 0,\r\n borderColor: `transparent`,\r\n hover: {\r\n bgcolor: if_common(color.secondary, alpha(color.primary, 0.09)),\r\n color: if_common(color.text, color.primary),\r\n border: 0,\r\n borderColor: `transparent`,\r\n }\r\n }\r\n } else if (type === \"alpha\") {\r\n return {\r\n bgcolor: if_common(color.secondary, alpha(color.primary, 0.09)),\r\n color: if_common(color.text, color.primary),\r\n border: 0,\r\n borderColor: `transparent`,\r\n hover: {\r\n bgcolor: if_common(color.secondary, alpha(color.primary, 0.15)),\r\n color: if_common(color.text, color.primary),\r\n border: 0,\r\n borderColor: `transparent`,\r\n }\r\n }\r\n }\r\n\r\n throw new Error(`useColorTemplate: Unknown type ${type}`);\r\n}\r\n\r\nexport default useColorTemplate"],"names":["useTheme","alpha"],"mappings":"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"}
|
|
@@ -1,41 +1,65 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {alpha}from'../css/index.mjs';import {useTheme}from'../theme/core.mjs';import'../theme/ThemeDefaultOptions.mjs';import'../theme/ThemeProvider.mjs';import'react-state-bucket';const useColorTemplate = (name, type) => {
|
|
2
2
|
const theme = useTheme();
|
|
3
3
|
let color = theme.colors[name];
|
|
4
|
-
let
|
|
5
|
-
|
|
4
|
+
let divider = theme.colors.divider.primary;
|
|
5
|
+
if (name === "common") {
|
|
6
|
+
color = Object.assign(Object.assign({}, color), { text: theme.colors.text.primary });
|
|
7
|
+
}
|
|
8
|
+
const if_common = (a, b) => name === "common" ? a : b;
|
|
9
|
+
if (type === "outline") {
|
|
10
|
+
return {
|
|
6
11
|
bgcolor: "transparent",
|
|
7
|
-
color: color.text.primary,
|
|
12
|
+
color: if_common(color.text, color.primary),
|
|
8
13
|
border: 1,
|
|
9
|
-
borderColor:
|
|
14
|
+
borderColor: divider,
|
|
10
15
|
hover: {
|
|
11
|
-
color: color.text.
|
|
16
|
+
color: if_common(color.text, color.secondary),
|
|
17
|
+
border: 1,
|
|
12
18
|
borderColor: color.divider,
|
|
13
19
|
}
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
20
|
+
};
|
|
21
|
+
}
|
|
22
|
+
else if (type === "fill") {
|
|
23
|
+
return {
|
|
24
|
+
bgcolor: if_common(color.secondary, color.primary),
|
|
25
|
+
color: color.text,
|
|
26
|
+
border: 0,
|
|
27
|
+
borderColor: `transparent`,
|
|
18
28
|
hover: {
|
|
19
|
-
bgcolor: color.secondary,
|
|
20
|
-
color: color.text
|
|
29
|
+
bgcolor: if_common(color.secondary, color.secondary),
|
|
30
|
+
color: color.text,
|
|
31
|
+
border: 0,
|
|
32
|
+
borderColor: `transparent`,
|
|
21
33
|
}
|
|
22
|
-
}
|
|
23
|
-
|
|
34
|
+
};
|
|
35
|
+
}
|
|
36
|
+
else if (type === "text") {
|
|
37
|
+
return {
|
|
24
38
|
bgcolor: "transparent",
|
|
25
|
-
color: color.primary,
|
|
39
|
+
color: if_common(color.text, color.primary),
|
|
40
|
+
border: 0,
|
|
41
|
+
borderColor: `transparent`,
|
|
26
42
|
hover: {
|
|
27
|
-
bgcolor: color.alpha,
|
|
28
|
-
color: color.primary,
|
|
43
|
+
bgcolor: if_common(color.secondary, alpha(color.primary, 0.09)),
|
|
44
|
+
color: if_common(color.text, color.primary),
|
|
45
|
+
border: 0,
|
|
46
|
+
borderColor: `transparent`,
|
|
29
47
|
}
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
else if (type === "alpha") {
|
|
51
|
+
return {
|
|
52
|
+
bgcolor: if_common(color.secondary, alpha(color.primary, 0.09)),
|
|
53
|
+
color: if_common(color.text, color.primary),
|
|
54
|
+
border: 0,
|
|
55
|
+
borderColor: `transparent`,
|
|
34
56
|
hover: {
|
|
35
|
-
bgcolor: color.alpha,
|
|
36
|
-
color: color.primary,
|
|
57
|
+
bgcolor: if_common(color.secondary, alpha(color.primary, 0.15)),
|
|
58
|
+
color: if_common(color.text, color.primary),
|
|
59
|
+
border: 0,
|
|
60
|
+
borderColor: `transparent`,
|
|
37
61
|
}
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
|
|
62
|
+
};
|
|
63
|
+
}
|
|
64
|
+
throw new Error(`useColorTemplate: Unknown type ${type}`);
|
|
41
65
|
};export{useColorTemplate as default};//# sourceMappingURL=useColorTemplate.mjs.map
|