@thewhileloop/whileui 0.2.10 → 0.2.12
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/dist/blocks/datepicker/use-calendar-theme.d.ts.map +1 -1
- package/dist/blocks/datepicker/use-calendar-theme.js +10 -2
- package/dist/blocks/datepicker/use-calendar-theme.js.map +1 -1
- package/dist/lib/theme-colors.d.ts.map +1 -1
- package/dist/lib/theme-colors.js +31 -39
- package/dist/lib/theme-colors.js.map +1 -1
- package/package.json +3 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-calendar-theme.d.ts","sourceRoot":"","sources":["../../../src/blocks/datepicker/use-calendar-theme.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-calendar-theme.d.ts","sourceRoot":"","sources":["../../../src/blocks/datepicker/use-calendar-theme.ts"],"names":[],"mappings":"AAIA,8EAA8E;AAC9E,MAAM,WAAW,aAAa;IAC5B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAyBD;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,WAAW,CAAC,EAAE,aAAa,GAAG,aAAa,CAW3E"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
import { useCSSVariable } from 'uniwind';
|
|
1
2
|
import { useThemeColors } from '../../lib/theme-colors';
|
|
2
|
-
function buildCalendarTheme(c) {
|
|
3
|
+
function buildCalendarTheme(c, fontFamily) {
|
|
3
4
|
return {
|
|
4
5
|
calendarBackground: c.background,
|
|
5
6
|
textSectionTitleColor: c.mutedForeground,
|
|
@@ -14,6 +15,11 @@ function buildCalendarTheme(c) {
|
|
|
14
15
|
selectedDotColor: c.primaryForeground,
|
|
15
16
|
arrowColor: c.foreground,
|
|
16
17
|
monthTextColor: c.foreground,
|
|
18
|
+
...(fontFamily && {
|
|
19
|
+
textDayFontFamily: fontFamily,
|
|
20
|
+
textMonthFontFamily: fontFamily,
|
|
21
|
+
textDayHeaderFontFamily: fontFamily,
|
|
22
|
+
}),
|
|
17
23
|
};
|
|
18
24
|
}
|
|
19
25
|
/**
|
|
@@ -23,7 +29,9 @@ function buildCalendarTheme(c) {
|
|
|
23
29
|
*/
|
|
24
30
|
export function useCalendarTheme(customTheme) {
|
|
25
31
|
const c = useThemeColors();
|
|
26
|
-
const
|
|
32
|
+
const [fontSans] = useCSSVariable(['--font-sans']);
|
|
33
|
+
const fontFamily = typeof fontSans === 'string' && fontSans ? fontSans : undefined;
|
|
34
|
+
const base = buildCalendarTheme(c, fontFamily);
|
|
27
35
|
if (!customTheme)
|
|
28
36
|
return base;
|
|
29
37
|
const merged = { ...base };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-calendar-theme.js","sourceRoot":"","sources":["../../../src/blocks/datepicker/use-calendar-theme.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-calendar-theme.js","sourceRoot":"","sources":["../../../src/blocks/datepicker/use-calendar-theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAkCxD,SAAS,kBAAkB,CAAC,CAAc,EAAE,UAAmB;IAC7D,OAAO;QACL,kBAAkB,EAAE,CAAC,CAAC,UAAU;QAChC,qBAAqB,EAAE,CAAC,CAAC,eAAe;QACxC,0BAA0B,EAAE,CAAC,CAAC,OAAO;QACrC,oBAAoB,EAAE,CAAC,CAAC,iBAAiB;QACzC,cAAc,EAAE,CAAC,CAAC,UAAU;QAC5B,oBAAoB,EAAE,CAAC,CAAC,KAAK;QAC7B,YAAY,EAAE,CAAC,CAAC,UAAU;QAC1B,iBAAiB,EAAE,CAAC,CAAC,MAAM;QAC3B,kBAAkB,EAAE,CAAC,CAAC,MAAM;QAC5B,QAAQ,EAAE,CAAC,CAAC,MAAM;QAClB,gBAAgB,EAAE,CAAC,CAAC,iBAAiB;QACrC,UAAU,EAAE,CAAC,CAAC,UAAU;QACxB,cAAc,EAAE,CAAC,CAAC,UAAU;QAC5B,GAAG,CAAC,UAAU,IAAI;YAChB,iBAAiB,EAAE,UAAU;YAC7B,mBAAmB,EAAE,UAAU;YAC/B,uBAAuB,EAAE,UAAU;SACpC,CAAC;KACH,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,gBAAgB,CAAC,WAA2B;IAC1D,MAAM,CAAC,GAAG,cAAc,EAAE,CAAC;IAC3B,MAAM,CAAC,QAAQ,CAAC,GAAG,cAAc,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC;IACnD,MAAM,UAAU,GAAG,OAAO,QAAQ,KAAK,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;IACnF,MAAM,IAAI,GAAG,kBAAkB,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC;IAC/C,IAAI,CAAC,WAAW;QAAE,OAAO,IAAI,CAAC;IAC9B,MAAM,MAAM,GAAG,EAAE,GAAG,IAAI,EAAE,CAAC;IAC3B,KAAK,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC;QACjD,IAAI,CAAC,KAAK,SAAS;YAAE,MAAM,CAAC,CAAwB,CAAC,GAAG,CAAC,CAAC;IAC5D,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme-colors.d.ts","sourceRoot":"","sources":["../../src/lib/theme-colors.ts"],"names":[],"mappings":"AA6BA;;;GAGG;AACH,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,cAAc,IAAI,WAAW,
|
|
1
|
+
{"version":3,"file":"theme-colors.d.ts","sourceRoot":"","sources":["../../src/lib/theme-colors.ts"],"names":[],"mappings":"AA6BA;;;GAGG;AACH,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,cAAc,IAAI,WAAW,CAkC5C;AAED,oFAAoF;AACpF,wBAAgB,aAAa;;;;;;;EAU5B"}
|
package/dist/lib/theme-colors.js
CHANGED
|
@@ -1,29 +1,31 @@
|
|
|
1
1
|
import { useCSSVariable } from 'uniwind';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
2
|
+
import { formatHex, parse } from 'culori';
|
|
3
|
+
// 1. Remove the simple regex checks (isNativeColor)
|
|
4
|
+
// 2. Add a robust converter function
|
|
5
|
+
function resolveToHex(value, fallback) {
|
|
6
|
+
if (value === undefined || value === null)
|
|
7
|
+
return fallback;
|
|
8
|
+
const s = String(value);
|
|
9
|
+
// If it's already a simple hex/rgb string, return it (performance optimization)
|
|
10
|
+
if (s.startsWith('#') || s.startsWith('rgb')) {
|
|
11
|
+
return s;
|
|
12
|
+
}
|
|
13
|
+
// Parse and convert modern CSS colors (oklch, hsl, etc.) to Hex
|
|
14
|
+
try {
|
|
15
|
+
const parsed = parse(s);
|
|
16
|
+
if (parsed) {
|
|
17
|
+
const hex = formatHex(parsed);
|
|
18
|
+
if (hex)
|
|
19
|
+
return hex;
|
|
20
|
+
}
|
|
17
21
|
}
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
if (isNativeColor(s))
|
|
21
|
-
return s;
|
|
22
|
+
catch (e) {
|
|
23
|
+
// console.warn('Failed to parse color:', value);
|
|
22
24
|
}
|
|
23
25
|
return fallback;
|
|
24
26
|
}
|
|
25
27
|
export function useThemeColors() {
|
|
26
|
-
const [primary, primaryForeground, foreground, muted, mutedForeground, background, border, accent, destructive,
|
|
28
|
+
const [primary, primaryForeground, foreground, muted, mutedForeground, background, border, accent, destructive,] = useCSSVariable([
|
|
27
29
|
'--color-primary',
|
|
28
30
|
'--color-primary-foreground',
|
|
29
31
|
'--color-foreground',
|
|
@@ -33,27 +35,17 @@ export function useThemeColors() {
|
|
|
33
35
|
'--color-border',
|
|
34
36
|
'--color-accent',
|
|
35
37
|
'--color-destructive',
|
|
36
|
-
'--app-color-primary',
|
|
37
|
-
'--app-color-primary-foreground',
|
|
38
|
-
'--app-color-foreground',
|
|
39
|
-
'--app-color-muted',
|
|
40
|
-
'--app-color-muted-foreground',
|
|
41
|
-
'--app-color-background',
|
|
42
|
-
'--app-color-border',
|
|
43
|
-
'--app-color-accent',
|
|
44
|
-
'--app-color-destructive',
|
|
45
38
|
]);
|
|
46
|
-
// Fallbacks when undefined; prefer app hex tokens if theme colors are non-native (oklch).
|
|
47
39
|
return {
|
|
48
|
-
primary:
|
|
49
|
-
primaryForeground:
|
|
50
|
-
foreground:
|
|
51
|
-
muted:
|
|
52
|
-
mutedForeground:
|
|
53
|
-
background:
|
|
54
|
-
border:
|
|
55
|
-
accent:
|
|
56
|
-
destructive:
|
|
40
|
+
primary: resolveToHex(primary, '#000000'),
|
|
41
|
+
primaryForeground: resolveToHex(primaryForeground, '#ffffff'),
|
|
42
|
+
foreground: resolveToHex(foreground, '#000000'),
|
|
43
|
+
muted: resolveToHex(muted, '#f5f5f5'),
|
|
44
|
+
mutedForeground: resolveToHex(mutedForeground, '#737373'),
|
|
45
|
+
background: resolveToHex(background, '#ffffff'),
|
|
46
|
+
border: resolveToHex(border, '#e5e5e5'),
|
|
47
|
+
accent: resolveToHex(accent, '#22c55e'),
|
|
48
|
+
destructive: resolveToHex(destructive, '#dc2626'),
|
|
57
49
|
};
|
|
58
50
|
}
|
|
59
51
|
/** Icon colors derived from theme. For @expo/vector-icons which need hex values. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme-colors.js","sourceRoot":"","sources":["../../src/lib/theme-colors.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"theme-colors.js","sourceRoot":"","sources":["../../src/lib/theme-colors.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AAE1C,oDAAoD;AACpD,qCAAqC;AACrC,SAAS,YAAY,CAAC,KAAkC,EAAE,QAAgB;IACxE,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI;QAAE,OAAO,QAAQ,CAAC;IAE3D,MAAM,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAExB,gFAAgF;IAChF,IAAI,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC;QAC7C,OAAO,CAAC,CAAC;IACX,CAAC;IAED,gEAAgE;IAChE,IAAI,CAAC;QACH,MAAM,MAAM,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,MAAM,EAAE,CAAC;YACX,MAAM,GAAG,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC;YAC9B,IAAI,GAAG;gBAAE,OAAO,GAAG,CAAC;QACtB,CAAC;IACH,CAAC;IAAC,OAAO,CAAC,EAAE,CAAC;QACX,iDAAiD;IACnD,CAAC;IAED,OAAO,QAAQ,CAAC;AAClB,CAAC;AAkBD,MAAM,UAAU,cAAc;IAC5B,MAAM,CACJ,OAAO,EACP,iBAAiB,EACjB,UAAU,EACV,KAAK,EACL,eAAe,EACf,UAAU,EACV,MAAM,EACN,MAAM,EACN,WAAW,EACZ,GAAG,cAAc,CAAC;QACjB,iBAAiB;QACjB,4BAA4B;QAC5B,oBAAoB;QACpB,eAAe;QACf,0BAA0B;QAC1B,oBAAoB;QACpB,gBAAgB;QAChB,gBAAgB;QAChB,qBAAqB;KACtB,CAAC,CAAC;IAEH,OAAO;QACL,OAAO,EAAE,YAAY,CAAC,OAAO,EAAE,SAAS,CAAC;QACzC,iBAAiB,EAAE,YAAY,CAAC,iBAAiB,EAAE,SAAS,CAAC;QAC7D,UAAU,EAAE,YAAY,CAAC,UAAU,EAAE,SAAS,CAAC;QAC/C,KAAK,EAAE,YAAY,CAAC,KAAK,EAAE,SAAS,CAAC;QACrC,eAAe,EAAE,YAAY,CAAC,eAAe,EAAE,SAAS,CAAC;QACzD,UAAU,EAAE,YAAY,CAAC,UAAU,EAAE,SAAS,CAAC;QAC/C,MAAM,EAAE,YAAY,CAAC,MAAM,EAAE,SAAS,CAAC;QACvC,MAAM,EAAE,YAAY,CAAC,MAAM,EAAE,SAAS,CAAC;QACvC,WAAW,EAAE,YAAY,CAAC,WAAW,EAAE,SAAS,CAAC;KAClD,CAAC;AACJ,CAAC;AAED,oFAAoF;AACpF,MAAM,UAAU,aAAa;IAC3B,MAAM,CAAC,GAAG,cAAc,EAAE,CAAC;IAC3B,OAAO;QACL,UAAU,EAAE,CAAC,CAAC,UAAU;QACxB,KAAK,EAAE,CAAC,CAAC,eAAe;QACxB,OAAO,EAAE,CAAC,CAAC,OAAO;QAClB,iBAAiB,EAAE,CAAC,CAAC,iBAAiB;QACtC,MAAM,EAAE,CAAC,CAAC,MAAM;QAChB,WAAW,EAAE,CAAC,CAAC,WAAW;KAC3B,CAAC;AACJ,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@thewhileloop/whileui",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.12",
|
|
4
4
|
"description": "WhileUI Native — Copy-paste components for React Native. You own the code.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -69,11 +69,13 @@
|
|
|
69
69
|
},
|
|
70
70
|
"dependencies": {
|
|
71
71
|
"clsx": "^2.1.0",
|
|
72
|
+
"culori": "^4.0.2",
|
|
72
73
|
"react-native-calendars": "^1.1314.0",
|
|
73
74
|
"tailwind-merge": "^3.0.0",
|
|
74
75
|
"tailwind-variants": "^0.3.0"
|
|
75
76
|
},
|
|
76
77
|
"devDependencies": {
|
|
78
|
+
"@types/culori": "^4.0.1",
|
|
77
79
|
"@types/react": "~19.1.0",
|
|
78
80
|
"react-native-screens": "^4.23.0",
|
|
79
81
|
"typescript": "^5.7.0"
|