orn-ui 0.1.1 → 0.2.1
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/README.md +20 -2
- package/lib/commonjs/atoms/PressableScale.js +9 -10
- package/lib/commonjs/atoms/PressableScale.js.map +1 -1
- package/lib/commonjs/atoms/Skeleton.js +96 -0
- package/lib/commonjs/atoms/Skeleton.js.map +1 -0
- package/lib/commonjs/atoms/Transition.js +171 -0
- package/lib/commonjs/atoms/Transition.js.map +1 -0
- package/lib/commonjs/atoms/index.js +20 -0
- package/lib/commonjs/atoms/index.js.map +1 -1
- package/lib/commonjs/molecules/OptionCard.js +55 -22
- package/lib/commonjs/molecules/OptionCard.js.map +1 -1
- package/lib/commonjs/molecules/{ThemeToggle.js → SegmentedControl.js} +36 -36
- package/lib/commonjs/molecules/SegmentedControl.js.map +1 -0
- package/lib/commonjs/molecules/Stepper.js +124 -47
- package/lib/commonjs/molecules/Stepper.js.map +1 -1
- package/lib/commonjs/molecules/Steps.js +36 -6
- package/lib/commonjs/molecules/Steps.js.map +1 -1
- package/lib/commonjs/molecules/index.js +9 -3
- package/lib/commonjs/molecules/index.js.map +1 -1
- package/lib/commonjs/organisms/AlertProvider.js +26 -0
- package/lib/commonjs/organisms/AlertProvider.js.map +1 -1
- package/lib/commonjs/organisms/BottomSheet.js +118 -39
- package/lib/commonjs/organisms/BottomSheet.js.map +1 -1
- package/lib/commonjs/organisms/DateField.js +46 -15
- package/lib/commonjs/organisms/DateField.js.map +1 -1
- package/lib/commonjs/organisms/DatePicker.js +129 -50
- package/lib/commonjs/organisms/DatePicker.js.map +1 -1
- package/lib/commonjs/organisms/List.js +66 -44
- package/lib/commonjs/organisms/List.js.map +1 -1
- package/lib/commonjs/organisms/Modal.js +42 -87
- package/lib/commonjs/organisms/Modal.js.map +1 -1
- package/lib/commonjs/organisms/NavigationBar.js +210 -0
- package/lib/commonjs/organisms/NavigationBar.js.map +1 -0
- package/lib/commonjs/organisms/Screen.js +9 -2
- package/lib/commonjs/organisms/Screen.js.map +1 -1
- package/lib/commonjs/organisms/SearchList.js +95 -27
- package/lib/commonjs/organisms/SearchList.js.map +1 -1
- package/lib/commonjs/organisms/Select.js +222 -50
- package/lib/commonjs/organisms/Select.js.map +1 -1
- package/lib/commonjs/organisms/ThemeToggle.js +52 -0
- package/lib/commonjs/organisms/ThemeToggle.js.map +1 -0
- package/lib/commonjs/organisms/Toast.js +8 -22
- package/lib/commonjs/organisms/Toast.js.map +1 -1
- package/lib/commonjs/organisms/ToastProvider.js +24 -0
- package/lib/commonjs/organisms/ToastProvider.js.map +1 -1
- package/lib/commonjs/organisms/Wizard.js +23 -2
- package/lib/commonjs/organisms/Wizard.js.map +1 -1
- package/lib/commonjs/organisms/imperativeBridge.js +28 -0
- package/lib/commonjs/organisms/imperativeBridge.js.map +1 -0
- package/lib/commonjs/organisms/index.js +50 -0
- package/lib/commonjs/organisms/index.js.map +1 -1
- package/lib/commonjs/theme/colors.js +207 -0
- package/lib/commonjs/theme/colors.js.map +1 -0
- package/lib/commonjs/theme/createTheme.js +25 -2
- package/lib/commonjs/theme/createTheme.js.map +1 -1
- package/lib/commonjs/theme/index.js +25 -0
- package/lib/commonjs/theme/index.js.map +1 -1
- package/lib/commonjs/theme/labels.js +5 -1
- package/lib/commonjs/theme/labels.js.map +1 -1
- package/lib/commonjs/theme/palettes.js +5 -2
- package/lib/commonjs/theme/palettes.js.map +1 -1
- package/lib/module/atoms/PressableScale.js +9 -10
- package/lib/module/atoms/PressableScale.js.map +1 -1
- package/lib/module/atoms/Skeleton.js +91 -0
- package/lib/module/atoms/Skeleton.js.map +1 -0
- package/lib/module/atoms/Transition.js +165 -0
- package/lib/module/atoms/Transition.js.map +1 -0
- package/lib/module/atoms/index.js +2 -0
- package/lib/module/atoms/index.js.map +1 -1
- package/lib/module/molecules/OptionCard.js +56 -23
- package/lib/module/molecules/OptionCard.js.map +1 -1
- package/lib/module/molecules/{ThemeToggle.js → SegmentedControl.js} +36 -36
- package/lib/module/molecules/SegmentedControl.js.map +1 -0
- package/lib/module/molecules/Stepper.js +125 -49
- package/lib/module/molecules/Stepper.js.map +1 -1
- package/lib/module/molecules/Steps.js +37 -7
- package/lib/module/molecules/Steps.js.map +1 -1
- package/lib/module/molecules/index.js +2 -2
- package/lib/module/molecules/index.js.map +1 -1
- package/lib/module/organisms/AlertProvider.js +24 -1
- package/lib/module/organisms/AlertProvider.js.map +1 -1
- package/lib/module/organisms/BottomSheet.js +120 -41
- package/lib/module/organisms/BottomSheet.js.map +1 -1
- package/lib/module/organisms/DateField.js +49 -18
- package/lib/module/organisms/DateField.js.map +1 -1
- package/lib/module/organisms/DatePicker.js +131 -52
- package/lib/module/organisms/DatePicker.js.map +1 -1
- package/lib/module/organisms/List.js +68 -46
- package/lib/module/organisms/List.js.map +1 -1
- package/lib/module/organisms/Modal.js +44 -89
- package/lib/module/organisms/Modal.js.map +1 -1
- package/lib/module/organisms/NavigationBar.js +205 -0
- package/lib/module/organisms/NavigationBar.js.map +1 -0
- package/lib/module/organisms/Screen.js +9 -2
- package/lib/module/organisms/Screen.js.map +1 -1
- package/lib/module/organisms/SearchList.js +96 -28
- package/lib/module/organisms/SearchList.js.map +1 -1
- package/lib/module/organisms/Select.js +224 -52
- package/lib/module/organisms/Select.js.map +1 -1
- package/lib/module/organisms/ThemeToggle.js +47 -0
- package/lib/module/organisms/ThemeToggle.js.map +1 -0
- package/lib/module/organisms/Toast.js +10 -24
- package/lib/module/organisms/Toast.js.map +1 -1
- package/lib/module/organisms/ToastProvider.js +21 -0
- package/lib/module/organisms/ToastProvider.js.map +1 -1
- package/lib/module/organisms/Wizard.js +24 -3
- package/lib/module/organisms/Wizard.js.map +1 -1
- package/lib/module/organisms/imperativeBridge.js +24 -0
- package/lib/module/organisms/imperativeBridge.js.map +1 -0
- package/lib/module/organisms/index.js +4 -2
- package/lib/module/organisms/index.js.map +1 -1
- package/lib/module/theme/colors.js +194 -0
- package/lib/module/theme/colors.js.map +1 -0
- package/lib/module/theme/createTheme.js +25 -2
- package/lib/module/theme/createTheme.js.map +1 -1
- package/lib/module/theme/index.js +1 -0
- package/lib/module/theme/index.js.map +1 -1
- package/lib/module/theme/labels.js +5 -1
- package/lib/module/theme/labels.js.map +1 -1
- package/lib/module/theme/palettes.js +5 -2
- package/lib/module/theme/palettes.js.map +1 -1
- package/lib/typescript/atoms/PressableScale.d.ts +3 -2
- package/lib/typescript/atoms/PressableScale.d.ts.map +1 -1
- package/lib/typescript/atoms/Skeleton.d.ts +29 -0
- package/lib/typescript/atoms/Skeleton.d.ts.map +1 -0
- package/lib/typescript/atoms/Transition.d.ts +51 -0
- package/lib/typescript/atoms/Transition.d.ts.map +1 -0
- package/lib/typescript/atoms/index.d.ts +4 -0
- package/lib/typescript/atoms/index.d.ts.map +1 -1
- package/lib/typescript/molecules/OptionCard.d.ts +11 -6
- package/lib/typescript/molecules/OptionCard.d.ts.map +1 -1
- package/lib/typescript/molecules/SegmentedControl.d.ts +24 -0
- package/lib/typescript/molecules/SegmentedControl.d.ts.map +1 -0
- package/lib/typescript/molecules/Stepper.d.ts +35 -3
- package/lib/typescript/molecules/Stepper.d.ts.map +1 -1
- package/lib/typescript/molecules/Steps.d.ts.map +1 -1
- package/lib/typescript/molecules/index.d.ts +4 -4
- package/lib/typescript/molecules/index.d.ts.map +1 -1
- package/lib/typescript/organisms/AlertProvider.d.ts +9 -0
- package/lib/typescript/organisms/AlertProvider.d.ts.map +1 -1
- package/lib/typescript/organisms/BottomSheet.d.ts +26 -4
- package/lib/typescript/organisms/BottomSheet.d.ts.map +1 -1
- package/lib/typescript/organisms/DateField.d.ts +23 -5
- package/lib/typescript/organisms/DateField.d.ts.map +1 -1
- package/lib/typescript/organisms/DatePicker.d.ts +5 -1
- package/lib/typescript/organisms/DatePicker.d.ts.map +1 -1
- package/lib/typescript/organisms/List.d.ts +9 -2
- package/lib/typescript/organisms/List.d.ts.map +1 -1
- package/lib/typescript/organisms/Modal.d.ts +3 -5
- package/lib/typescript/organisms/Modal.d.ts.map +1 -1
- package/lib/typescript/organisms/NavigationBar.d.ts +32 -0
- package/lib/typescript/organisms/NavigationBar.d.ts.map +1 -0
- package/lib/typescript/organisms/Screen.d.ts +2 -1
- package/lib/typescript/organisms/Screen.d.ts.map +1 -1
- package/lib/typescript/organisms/SearchList.d.ts +21 -5
- package/lib/typescript/organisms/SearchList.d.ts.map +1 -1
- package/lib/typescript/organisms/Select.d.ts +19 -4
- package/lib/typescript/organisms/Select.d.ts.map +1 -1
- package/lib/typescript/{molecules → organisms}/ThemeToggle.d.ts +4 -4
- package/lib/typescript/organisms/ThemeToggle.d.ts.map +1 -0
- package/lib/typescript/organisms/Toast.d.ts.map +1 -1
- package/lib/typescript/organisms/ToastProvider.d.ts +8 -0
- package/lib/typescript/organisms/ToastProvider.d.ts.map +1 -1
- package/lib/typescript/organisms/Wizard.d.ts +7 -1
- package/lib/typescript/organisms/Wizard.d.ts.map +1 -1
- package/lib/typescript/organisms/imperativeBridge.d.ts +12 -0
- package/lib/typescript/organisms/imperativeBridge.d.ts.map +1 -0
- package/lib/typescript/organisms/index.d.ts +7 -3
- package/lib/typescript/organisms/index.d.ts.map +1 -1
- package/lib/typescript/theme/colors.d.ts +44 -0
- package/lib/typescript/theme/colors.d.ts.map +1 -0
- package/lib/typescript/theme/createTheme.d.ts +3 -0
- package/lib/typescript/theme/createTheme.d.ts.map +1 -1
- package/lib/typescript/theme/index.d.ts +3 -1
- package/lib/typescript/theme/index.d.ts.map +1 -1
- package/lib/typescript/theme/labels.d.ts +6 -0
- package/lib/typescript/theme/labels.d.ts.map +1 -1
- package/lib/typescript/theme/palettes.d.ts.map +1 -1
- package/lib/typescript/theme/types.d.ts +9 -0
- package/lib/typescript/theme/types.d.ts.map +1 -1
- package/package.json +67 -6
- package/registry/alert-provider.json +9 -2
- package/registry/bottom-sheet.json +6 -2
- package/registry/core.json +9 -5
- package/registry/date-field.json +2 -1
- package/registry/date-picker.json +1 -1
- package/registry/index.json +99 -30
- package/registry/list.json +2 -1
- package/registry/manifest.json +44 -6
- package/registry/modal.json +3 -2
- package/registry/navigation-bar.json +18 -0
- package/registry/option-card.json +3 -2
- package/registry/pressable-scale.json +1 -1
- package/registry/screen.json +1 -1
- package/registry/search-list.json +2 -1
- package/registry/segmented-control.json +18 -0
- package/registry/select.json +1 -1
- package/registry/skeleton.json +18 -0
- package/registry/stepper.json +3 -2
- package/registry/steps.json +1 -1
- package/registry/theme-toggle.json +5 -4
- package/registry/toast-provider.json +11 -3
- package/registry/toast.json +3 -2
- package/registry/transition.json +19 -0
- package/registry/wizard.json +3 -2
- package/src/atoms/PressableScale.tsx +16 -6
- package/src/atoms/Skeleton.tsx +114 -0
- package/src/atoms/Transition.tsx +189 -0
- package/src/atoms/index.ts +4 -0
- package/src/molecules/OptionCard.tsx +62 -25
- package/src/molecules/SegmentedControl.tsx +84 -0
- package/src/molecules/Stepper.tsx +147 -32
- package/src/molecules/Steps.tsx +27 -8
- package/src/molecules/index.ts +4 -4
- package/src/organisms/AlertProvider.tsx +26 -1
- package/src/organisms/BottomSheet.tsx +214 -62
- package/src/organisms/DateField.tsx +79 -19
- package/src/organisms/DatePicker.tsx +198 -80
- package/src/organisms/List.tsx +73 -41
- package/src/organisms/Modal.tsx +49 -61
- package/src/organisms/NavigationBar.tsx +226 -0
- package/src/organisms/Screen.tsx +11 -3
- package/src/organisms/SearchList.tsx +131 -35
- package/src/organisms/Select.tsx +223 -45
- package/src/organisms/ThemeToggle.tsx +30 -0
- package/src/organisms/Toast.tsx +8 -21
- package/src/organisms/ToastProvider.tsx +24 -0
- package/src/organisms/Wizard.tsx +37 -3
- package/src/organisms/imperativeBridge.ts +28 -0
- package/src/organisms/index.ts +7 -3
- package/src/theme/colors.ts +175 -0
- package/src/theme/createTheme.ts +38 -4
- package/src/theme/index.ts +3 -1
- package/src/theme/labels.ts +13 -0
- package/src/theme/palettes.ts +5 -2
- package/src/theme/types.ts +10 -0
- package/lib/commonjs/molecules/ThemeToggle.js.map +0 -1
- package/lib/module/molecules/ThemeToggle.js.map +0 -1
- package/lib/typescript/molecules/ThemeToggle.d.ts.map +0 -1
- package/src/molecules/ThemeToggle.tsx +0 -67
|
@@ -0,0 +1,207 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.AA_CONTRAST = void 0;
|
|
7
|
+
exports.contrast = contrast;
|
|
8
|
+
exports.deriveAccent = deriveAccent;
|
|
9
|
+
exports.hexToRgb = hexToRgb;
|
|
10
|
+
exports.hslToRgb = hslToRgb;
|
|
11
|
+
exports.luminance = luminance;
|
|
12
|
+
exports.rgbToHex = rgbToHex;
|
|
13
|
+
exports.rgbToHsl = rgbToHsl;
|
|
14
|
+
exports.toHex = toHex;
|
|
15
|
+
exports.toHsl = toHsl;
|
|
16
|
+
/**
|
|
17
|
+
* Utilidades de color sin dependencias, usadas para derivar una familia de
|
|
18
|
+
* roles (relleno / encima / tenue / legible) a partir de un solo hex de marca.
|
|
19
|
+
*/
|
|
20
|
+
|
|
21
|
+
/** Contraste mínimo AA para texto normal. */
|
|
22
|
+
const AA_CONTRAST = exports.AA_CONTRAST = 4.5;
|
|
23
|
+
|
|
24
|
+
/** Roles que necesita un acento del theme, en un esquema concreto. */
|
|
25
|
+
|
|
26
|
+
const HEX = /^#?([0-9a-f]{3}|[0-9a-f]{6})$/i;
|
|
27
|
+
function hexToRgb(hex) {
|
|
28
|
+
const match = HEX.exec(hex.trim());
|
|
29
|
+
if (!match) {
|
|
30
|
+
throw new Error(`orn-ui: se esperaba un color hex como "#7c3aed", se recibió "${hex}".`);
|
|
31
|
+
}
|
|
32
|
+
const digits = match[1];
|
|
33
|
+
const full = digits.length === 3 ? digits.replace(/./g, c => c + c) : digits;
|
|
34
|
+
return {
|
|
35
|
+
r: parseInt(full.slice(0, 2), 16),
|
|
36
|
+
g: parseInt(full.slice(2, 4), 16),
|
|
37
|
+
b: parseInt(full.slice(4, 6), 16)
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
|
+
const toHexPair = value => Math.round(clamp(value, 0, 255)).toString(16).padStart(2, '0');
|
|
41
|
+
function rgbToHex({
|
|
42
|
+
r,
|
|
43
|
+
g,
|
|
44
|
+
b
|
|
45
|
+
}) {
|
|
46
|
+
return `#${toHexPair(r)}${toHexPair(g)}${toHexPair(b)}`;
|
|
47
|
+
}
|
|
48
|
+
function clamp(value, min, max) {
|
|
49
|
+
return Math.min(max, Math.max(min, value));
|
|
50
|
+
}
|
|
51
|
+
function rgbToHsl({
|
|
52
|
+
r,
|
|
53
|
+
g,
|
|
54
|
+
b
|
|
55
|
+
}) {
|
|
56
|
+
const rn = r / 255;
|
|
57
|
+
const gn = g / 255;
|
|
58
|
+
const bn = b / 255;
|
|
59
|
+
const max = Math.max(rn, gn, bn);
|
|
60
|
+
const min = Math.min(rn, gn, bn);
|
|
61
|
+
const delta = max - min;
|
|
62
|
+
const l = (max + min) / 2;
|
|
63
|
+
if (delta === 0) return {
|
|
64
|
+
h: 0,
|
|
65
|
+
s: 0,
|
|
66
|
+
l
|
|
67
|
+
};
|
|
68
|
+
const s = delta / (1 - Math.abs(2 * l - 1));
|
|
69
|
+
let h;
|
|
70
|
+
if (max === rn) h = (gn - bn) / delta % 6;else if (max === gn) h = (bn - rn) / delta + 2;else h = (rn - gn) / delta + 4;
|
|
71
|
+
h *= 60;
|
|
72
|
+
return {
|
|
73
|
+
h: h < 0 ? h + 360 : h,
|
|
74
|
+
s,
|
|
75
|
+
l
|
|
76
|
+
};
|
|
77
|
+
}
|
|
78
|
+
function hslToRgb({
|
|
79
|
+
h,
|
|
80
|
+
s,
|
|
81
|
+
l
|
|
82
|
+
}) {
|
|
83
|
+
const c = (1 - Math.abs(2 * l - 1)) * s;
|
|
84
|
+
const hp = (h % 360 + 360) % 360 / 60;
|
|
85
|
+
const x = c * (1 - Math.abs(hp % 2 - 1));
|
|
86
|
+
const [r1, g1, b1] = hp < 1 ? [c, x, 0] : hp < 2 ? [x, c, 0] : hp < 3 ? [0, c, x] : hp < 4 ? [0, x, c] : hp < 5 ? [x, 0, c] : [c, 0, x];
|
|
87
|
+
const m = l - c / 2;
|
|
88
|
+
return {
|
|
89
|
+
r: (r1 + m) * 255,
|
|
90
|
+
g: (g1 + m) * 255,
|
|
91
|
+
b: (b1 + m) * 255
|
|
92
|
+
};
|
|
93
|
+
}
|
|
94
|
+
function toHsl(hex) {
|
|
95
|
+
return rgbToHsl(hexToRgb(hex));
|
|
96
|
+
}
|
|
97
|
+
function toHex(hsl) {
|
|
98
|
+
return rgbToHex(hslToRgb({
|
|
99
|
+
...hsl,
|
|
100
|
+
s: clamp(hsl.s, 0, 1),
|
|
101
|
+
l: clamp(hsl.l, 0, 1)
|
|
102
|
+
}));
|
|
103
|
+
}
|
|
104
|
+
function channelLuminance(value) {
|
|
105
|
+
const c = value / 255;
|
|
106
|
+
return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
/** Luminancia relativa WCAG de un hex. */
|
|
110
|
+
function luminance(hex) {
|
|
111
|
+
const {
|
|
112
|
+
r,
|
|
113
|
+
g,
|
|
114
|
+
b
|
|
115
|
+
} = hexToRgb(hex);
|
|
116
|
+
return 0.2126 * channelLuminance(r) + 0.7152 * channelLuminance(g) + 0.0722 * channelLuminance(b);
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
/** Ratio de contraste WCAG entre dos hex: 1 (igual) a 21 (blanco sobre negro). */
|
|
120
|
+
function contrast(a, b) {
|
|
121
|
+
const la = luminance(a);
|
|
122
|
+
const lb = luminance(b);
|
|
123
|
+
return (Math.max(la, lb) + 0.05) / (Math.min(la, lb) + 0.05);
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
/**
|
|
127
|
+
* Blanco si alcanza el contraste AA —es lo que se espera encima de un relleno
|
|
128
|
+
* de color— y si no, el extremo que más contraste dé.
|
|
129
|
+
*/
|
|
130
|
+
function bestOnColor(background, light, dark) {
|
|
131
|
+
if (contrast(background, light) >= AA_CONTRAST) return light;
|
|
132
|
+
return contrast(background, dark) >= contrast(background, light) ? dark : light;
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
/**
|
|
136
|
+
* Mueve la luminosidad del tono hasta alcanzar el contraste pedido contra
|
|
137
|
+
* `against`. Si ni el extremo llega —un amarillo puro sobre blanco, por
|
|
138
|
+
* ejemplo— devuelve el más contrastado que encontró en el camino.
|
|
139
|
+
*/
|
|
140
|
+
function reachContrast(hsl, against, target, direction) {
|
|
141
|
+
const step = direction === 'darker' ? -0.02 : 0.02;
|
|
142
|
+
let best = toHex(hsl);
|
|
143
|
+
let bestRatio = contrast(best, against);
|
|
144
|
+
for (let l = hsl.l; l >= 0 && l <= 1; l += step) {
|
|
145
|
+
const candidate = toHex({
|
|
146
|
+
...hsl,
|
|
147
|
+
l
|
|
148
|
+
});
|
|
149
|
+
const ratio = contrast(candidate, against);
|
|
150
|
+
if (ratio > bestRatio) {
|
|
151
|
+
best = candidate;
|
|
152
|
+
bestRatio = ratio;
|
|
153
|
+
}
|
|
154
|
+
if (ratio >= target) return candidate;
|
|
155
|
+
}
|
|
156
|
+
return best;
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
/**
|
|
160
|
+
* Deriva los cuatro roles de un acento a partir de un hex, para un esquema.
|
|
161
|
+
* `surface` es el fondo sobre el que tiene que leerse el rol `text`, así que
|
|
162
|
+
* cada esquema pasa el suyo.
|
|
163
|
+
*/
|
|
164
|
+
function deriveAccent(hex, scheme, surface) {
|
|
165
|
+
const hsl = toHsl(hex);
|
|
166
|
+
if (scheme === 'light') {
|
|
167
|
+
const base = toHex(hsl);
|
|
168
|
+
return {
|
|
169
|
+
base,
|
|
170
|
+
on: bestOnColor(base, '#ffffff', '#1a1a1a'),
|
|
171
|
+
soft: toHex({
|
|
172
|
+
h: hsl.h,
|
|
173
|
+
s: Math.min(hsl.s, 0.85),
|
|
174
|
+
l: 0.94
|
|
175
|
+
}),
|
|
176
|
+
text: reachContrast({
|
|
177
|
+
...hsl,
|
|
178
|
+
l: Math.min(hsl.l, 0.38)
|
|
179
|
+
}, surface, AA_CONTRAST, 'darker')
|
|
180
|
+
};
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
// En oscuro el acento sube de luminosidad y lo que va encima baja: un
|
|
184
|
+
// #004cef sobre #1e1e1e no se distingue del fondo.
|
|
185
|
+
const base = toHex({
|
|
186
|
+
...hsl,
|
|
187
|
+
l: 0.72
|
|
188
|
+
});
|
|
189
|
+
return {
|
|
190
|
+
base,
|
|
191
|
+
on: bestOnColor(base, '#ffffff', toHex({
|
|
192
|
+
...hsl,
|
|
193
|
+
s: Math.min(hsl.s, 0.9),
|
|
194
|
+
l: 0.16
|
|
195
|
+
})),
|
|
196
|
+
soft: toHex({
|
|
197
|
+
h: hsl.h,
|
|
198
|
+
s: Math.min(hsl.s, 0.35),
|
|
199
|
+
l: 0.18
|
|
200
|
+
}),
|
|
201
|
+
text: reachContrast({
|
|
202
|
+
...hsl,
|
|
203
|
+
l: Math.max(hsl.l, 0.74)
|
|
204
|
+
}, surface, AA_CONTRAST, 'lighter')
|
|
205
|
+
};
|
|
206
|
+
}
|
|
207
|
+
//# sourceMappingURL=colors.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["AA_CONTRAST","exports","HEX","hexToRgb","hex","match","exec","trim","Error","digits","full","length","replace","c","r","parseInt","slice","g","b","toHexPair","value","Math","round","clamp","toString","padStart","rgbToHex","min","max","rgbToHsl","rn","gn","bn","delta","l","h","s","abs","hslToRgb","hp","x","r1","g1","b1","m","toHsl","toHex","hsl","channelLuminance","luminance","contrast","a","la","lb","bestOnColor","background","light","dark","reachContrast","against","target","direction","step","best","bestRatio","candidate","ratio","deriveAccent","scheme","surface","base","on","soft","text"],"sourceRoot":"../../../src","sources":["theme/colors.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -7,6 +7,7 @@ exports.createTheme = createTheme;
|
|
|
7
7
|
exports.defaultTheme = void 0;
|
|
8
8
|
var _palettes = require("./palettes");
|
|
9
9
|
var _tokens = require("./tokens");
|
|
10
|
+
var _colors = require("./colors");
|
|
10
11
|
function mergeDeep(base, patch) {
|
|
11
12
|
if (!patch) return base;
|
|
12
13
|
const out = {
|
|
@@ -23,21 +24,43 @@ function mergeDeep(base, patch) {
|
|
|
23
24
|
}
|
|
24
25
|
return out;
|
|
25
26
|
}
|
|
27
|
+
const capitalize = name => name.charAt(0).toUpperCase() + name.slice(1);
|
|
28
|
+
|
|
29
|
+
/** Expande cada hex de `brand` a los cuatro roles del acento en un esquema. */
|
|
30
|
+
function brandColors(brand, scheme, palette) {
|
|
31
|
+
if (!brand) return {};
|
|
32
|
+
const accents = typeof brand === 'string' ? {
|
|
33
|
+
primary: brand
|
|
34
|
+
} : brand;
|
|
35
|
+
const out = {};
|
|
36
|
+
for (const [name, hex] of Object.entries(accents)) {
|
|
37
|
+
if (!hex) continue;
|
|
38
|
+
const roles = (0, _colors.deriveAccent)(hex, scheme, palette.surface);
|
|
39
|
+
out[name] = roles.base;
|
|
40
|
+
out[`on${capitalize(name)}`] = roles.on;
|
|
41
|
+
out[`${name}Soft`] = roles.soft;
|
|
42
|
+
out[`${name}Text`] = roles.text;
|
|
43
|
+
}
|
|
44
|
+
return out;
|
|
45
|
+
}
|
|
26
46
|
|
|
27
47
|
/**
|
|
28
48
|
* Construye el par de themes light/dark que consume <UIProvider theme={...}>.
|
|
29
49
|
* Nunca muta los defaults: cada llamada produce objetos nuevos, seguros de
|
|
30
50
|
* compartir entre providers distintos (tests, multi-brand en el mismo árbol).
|
|
51
|
+
*
|
|
52
|
+
* `brand` se aplica antes que `colors`, así que un rol escrito a mano siempre
|
|
53
|
+
* gana sobre el derivado.
|
|
31
54
|
*/
|
|
32
55
|
function createTheme(overrides) {
|
|
33
56
|
const tokens = mergeDeep(_tokens.tokens, overrides?.tokens);
|
|
34
57
|
const light = {
|
|
35
|
-
colors: mergeDeep(_palettes.lightPalette, overrides?.colors?.light),
|
|
58
|
+
colors: mergeDeep(mergeDeep(_palettes.lightPalette, brandColors(overrides?.brand, 'light', _palettes.lightPalette)), overrides?.colors?.light),
|
|
36
59
|
tokens,
|
|
37
60
|
scheme: 'light'
|
|
38
61
|
};
|
|
39
62
|
const dark = {
|
|
40
|
-
colors: mergeDeep(_palettes.darkPalette, overrides?.colors?.dark),
|
|
63
|
+
colors: mergeDeep(mergeDeep(_palettes.darkPalette, brandColors(overrides?.brand, 'dark', _palettes.darkPalette)), overrides?.colors?.dark),
|
|
41
64
|
tokens,
|
|
42
65
|
scheme: 'dark'
|
|
43
66
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_palettes","require","_tokens","mergeDeep","base","patch","out","key","Object","keys","patchVal","baseVal","Array","isArray","undefined","createTheme","overrides","tokens","defaultTokens","light","colors","lightPalette","
|
|
1
|
+
{"version":3,"names":["_palettes","require","_tokens","_colors","mergeDeep","base","patch","out","key","Object","keys","patchVal","baseVal","Array","isArray","undefined","capitalize","name","charAt","toUpperCase","slice","brandColors","brand","scheme","palette","accents","primary","hex","entries","roles","deriveAccent","surface","on","soft","text","createTheme","overrides","tokens","defaultTokens","light","colors","lightPalette","dark","darkPalette","defaultTheme","exports"],"sourceRoot":"../../../src","sources":["theme/createTheme.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -3,12 +3,24 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
+
Object.defineProperty(exports, "AA_CONTRAST", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _colors.AA_CONTRAST;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
6
12
|
Object.defineProperty(exports, "UIProvider", {
|
|
7
13
|
enumerable: true,
|
|
8
14
|
get: function () {
|
|
9
15
|
return _UIProvider.UIProvider;
|
|
10
16
|
}
|
|
11
17
|
});
|
|
18
|
+
Object.defineProperty(exports, "contrast", {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () {
|
|
21
|
+
return _colors.contrast;
|
|
22
|
+
}
|
|
23
|
+
});
|
|
12
24
|
Object.defineProperty(exports, "createStyles", {
|
|
13
25
|
enumerable: true,
|
|
14
26
|
get: function () {
|
|
@@ -39,6 +51,12 @@ Object.defineProperty(exports, "defaultTheme", {
|
|
|
39
51
|
return _createTheme.defaultTheme;
|
|
40
52
|
}
|
|
41
53
|
});
|
|
54
|
+
Object.defineProperty(exports, "deriveAccent", {
|
|
55
|
+
enumerable: true,
|
|
56
|
+
get: function () {
|
|
57
|
+
return _colors.deriveAccent;
|
|
58
|
+
}
|
|
59
|
+
});
|
|
42
60
|
Object.defineProperty(exports, "duration", {
|
|
43
61
|
enumerable: true,
|
|
44
62
|
get: function () {
|
|
@@ -69,6 +87,12 @@ Object.defineProperty(exports, "lineHeight", {
|
|
|
69
87
|
return _tokens.lineHeight;
|
|
70
88
|
}
|
|
71
89
|
});
|
|
90
|
+
Object.defineProperty(exports, "luminance", {
|
|
91
|
+
enumerable: true,
|
|
92
|
+
get: function () {
|
|
93
|
+
return _colors.luminance;
|
|
94
|
+
}
|
|
95
|
+
});
|
|
72
96
|
Object.defineProperty(exports, "radius", {
|
|
73
97
|
enumerable: true,
|
|
74
98
|
get: function () {
|
|
@@ -144,6 +168,7 @@ Object.defineProperty(exports, "zeroInsets", {
|
|
|
144
168
|
var _tokens = require("./tokens");
|
|
145
169
|
var _palettes = require("./palettes");
|
|
146
170
|
var _createTheme = require("./createTheme");
|
|
171
|
+
var _colors = require("./colors");
|
|
147
172
|
var _labels = require("./labels");
|
|
148
173
|
var _insets = require("./insets");
|
|
149
174
|
var _createStyles = require("./createStyles");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_tokens","require","_palettes","_createTheme","_labels","_insets","_createStyles","_UIProvider"],"sourceRoot":"../../../src","sources":["theme/index.ts"],"mappings":"
|
|
1
|
+
{"version":3,"names":["_tokens","require","_palettes","_createTheme","_colors","_labels","_insets","_createStyles","_UIProvider"],"sourceRoot":"../../../src","sources":["theme/index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAEA,IAAAC,SAAA,GAAAD,OAAA;AAEA,IAAAE,YAAA,GAAAF,OAAA;AAEA,IAAAG,OAAA,GAAAH,OAAA;AAEA,IAAAI,OAAA,GAAAJ,OAAA;AAEA,IAAAK,OAAA,GAAAL,OAAA;AAEA,IAAAM,aAAA,GAAAN,OAAA;AACA,IAAAO,WAAA,GAAAP,OAAA","ignoreList":[]}
|
|
@@ -13,6 +13,10 @@ const defaultLabels = exports.defaultLabels = {
|
|
|
13
13
|
noResultsTitle: 'No results found',
|
|
14
14
|
noResultsDescription: 'Try a different search term',
|
|
15
15
|
search: 'Search...',
|
|
16
|
-
selectPlaceholder: 'Select...'
|
|
16
|
+
selectPlaceholder: 'Select...',
|
|
17
|
+
months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
|
|
18
|
+
weekdaysShort: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
|
|
19
|
+
selectDate: 'Select date',
|
|
20
|
+
clear: 'Clear'
|
|
17
21
|
};
|
|
18
22
|
//# sourceMappingURL=labels.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defaultLabels","exports","close","cancel","confirm","loading","loadingMore","noResultsTitle","noResultsDescription","search","selectPlaceholder"],"sourceRoot":"../../../src","sources":["theme/labels.ts"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"names":["defaultLabels","exports","close","cancel","confirm","loading","loadingMore","noResultsTitle","noResultsDescription","search","selectPlaceholder","months","weekdaysShort","selectDate","clear"],"sourceRoot":"../../../src","sources":["theme/labels.ts"],"mappings":";;;;;;AAkBO,MAAMA,aAAqB,GAAAC,OAAA,CAAAD,aAAA,GAAG;EACnCE,KAAK,EAAE,OAAO;EACdC,MAAM,EAAE,QAAQ;EAChBC,OAAO,EAAE,IAAI;EACbC,OAAO,EAAE,YAAY;EACrBC,WAAW,EAAE,iBAAiB;EAC9BC,cAAc,EAAE,kBAAkB;EAClCC,oBAAoB,EAAE,6BAA6B;EACnDC,MAAM,EAAE,WAAW;EACnBC,iBAAiB,EAAE,WAAW;EAC9BC,MAAM,EAAE,CACN,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EACtD,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,CACjE;EACDC,aAAa,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;EAClDC,UAAU,EAAE,aAAa;EACzBC,KAAK,EAAE;AACT,CAAC","ignoreList":[]}
|
|
@@ -42,8 +42,11 @@ const lightPalette = exports.lightPalette = {
|
|
|
42
42
|
onSuccess: '#00320f',
|
|
43
43
|
successSoft: '#e3f6e9',
|
|
44
44
|
successText: '#116a30',
|
|
45
|
-
|
|
46
|
-
|
|
45
|
+
// El rojo va con texto blanco, que es lo que la gente espera de un botón
|
|
46
|
+
// destructivo. #ff3b30 no llega a 4.5:1 con blanco y obligaba a texto casi
|
|
47
|
+
// negro sobre rojo; este tono sí, y sigue leyéndose como rojo de alerta.
|
|
48
|
+
error: '#dc2626',
|
|
49
|
+
onError: '#ffffff',
|
|
47
50
|
errorSoft: '#fdeaea',
|
|
48
51
|
errorText: '#c62222',
|
|
49
52
|
warning: '#f59e0b',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["neutral","white","black","lightPalette","exports","primary","onPrimary","primarySoft","primaryText","secondary","onSecondary","secondarySoft","secondaryText","success","onSuccess","successSoft","successText","error","onError","errorSoft","errorText","warning","onWarning","warningSoft","warningText","background","surface","text","textLight","border","inputBackground","overlay","scrim","skeleton","darkPalette"],"sourceRoot":"../../../src","sources":["theme/palettes.ts"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AA0CA,MAAMA,OAAO,GAAG;EACdC,KAAK,EAAE,SAAS;EAChBC,KAAK,EAAE;AACT,CAAC;AAEM,MAAMC,YAAyB,GAAAC,OAAA,CAAAD,YAAA,GAAG;EACvC,GAAGH,OAAO;EAEVK,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,WAAW,EAAE,SAAS;EAEtBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,aAAa,EAAE,SAAS;EACxBC,aAAa,EAAE,SAAS;EAExBC,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,WAAW,EAAE,SAAS;
|
|
1
|
+
{"version":3,"names":["neutral","white","black","lightPalette","exports","primary","onPrimary","primarySoft","primaryText","secondary","onSecondary","secondarySoft","secondaryText","success","onSuccess","successSoft","successText","error","onError","errorSoft","errorText","warning","onWarning","warningSoft","warningText","background","surface","text","textLight","border","inputBackground","overlay","scrim","skeleton","darkPalette"],"sourceRoot":"../../../src","sources":["theme/palettes.ts"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AA0CA,MAAMA,OAAO,GAAG;EACdC,KAAK,EAAE,SAAS;EAChBC,KAAK,EAAE;AACT,CAAC;AAEM,MAAMC,YAAyB,GAAAC,OAAA,CAAAD,YAAA,GAAG;EACvC,GAAGH,OAAO;EAEVK,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,WAAW,EAAE,SAAS;EAEtBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,aAAa,EAAE,SAAS;EACxBC,aAAa,EAAE,SAAS;EAExBC,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,WAAW,EAAE,SAAS;EAEtB;EACA;EACA;EACAC,KAAK,EAAE,SAAS;EAChBC,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE,SAAS;EACpBC,SAAS,EAAE,SAAS;EAEpBC,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,WAAW,EAAE,SAAS;EAEtBC,UAAU,EAAE,SAAS;EACrBC,OAAO,EAAE,SAAS;EAClBC,IAAI,EAAE,SAAS;EACfC,SAAS,EAAE,SAAS;EACpBC,MAAM,EAAE,SAAS;EACjBC,eAAe,EAAE,SAAS;EAC1BC,OAAO,EAAE,iBAAiB;EAC1BC,KAAK,EAAE,uBAAuB;EAC9BC,QAAQ,EAAE;AACZ,CAAC;;AAED;AACA;AACA;AACA;AACA;AACO,MAAMC,WAAwB,GAAA9B,OAAA,CAAA8B,WAAA,GAAG;EACtC,GAAGlC,OAAO;EAEVK,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,WAAW,EAAE,SAAS;EAEtBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,aAAa,EAAE,SAAS;EACxBC,aAAa,EAAE,SAAS;EAExBC,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,WAAW,EAAE,SAAS;EAEtBC,KAAK,EAAE,SAAS;EAChBC,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE,SAAS;EACpBC,SAAS,EAAE,SAAS;EAEpBC,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE,SAAS;EACpBC,WAAW,EAAE,SAAS;EACtBC,WAAW,EAAE,SAAS;EAEtBC,UAAU,EAAE,SAAS;EACrBC,OAAO,EAAE,SAAS;EAClBC,IAAI,EAAE,SAAS;EACfC,SAAS,EAAE,SAAS;EACpBC,MAAM,EAAE,SAAS;EACjBC,eAAe,EAAE,SAAS;EAC1BC,OAAO,EAAE,iBAAiB;EAC1BC,KAAK,EAAE,oBAAoB;EAC3BC,QAAQ,EAAE;AACZ,CAAC","ignoreList":[]}
|
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
import React, { memo, useRef } from 'react';
|
|
4
4
|
import { Animated, Pressable } from 'react-native';
|
|
5
5
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
|
+
const AnimatedPressable = Animated.createAnimatedComponent(Pressable);
|
|
7
|
+
|
|
6
8
|
/**
|
|
7
9
|
* PressableScale
|
|
8
10
|
* Feedback táctil de "achicarse" al presionar, con Animated.spring de RN
|
|
@@ -35,20 +37,17 @@ export const PressableScale = /*#__PURE__*/memo(({
|
|
|
35
37
|
if (!disabled) animateTo(1);
|
|
36
38
|
onPressOut?.(e);
|
|
37
39
|
};
|
|
38
|
-
return /*#__PURE__*/_jsx(
|
|
40
|
+
return /*#__PURE__*/_jsx(AnimatedPressable, {
|
|
39
41
|
...props,
|
|
40
42
|
disabled: disabled,
|
|
41
43
|
onPressIn: handlePressIn,
|
|
42
44
|
onPressOut: handlePressOut,
|
|
43
|
-
style: style,
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
},
|
|
50
|
-
children: children
|
|
51
|
-
})
|
|
45
|
+
style: [style, {
|
|
46
|
+
transform: [{
|
|
47
|
+
scale
|
|
48
|
+
}]
|
|
49
|
+
}],
|
|
50
|
+
children: children
|
|
52
51
|
});
|
|
53
52
|
});
|
|
54
53
|
PressableScale.displayName = 'PressableScale';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","memo","useRef","Animated","Pressable","jsx","_jsx","PressableScale","scaleTo","style","children","onPressIn","onPressOut","disabled","props","scale","Value","current","animateTo","value","spring","toValue","useNativeDriver","speed","bounciness","start","handlePressIn","e","handlePressOut","
|
|
1
|
+
{"version":3,"names":["React","memo","useRef","Animated","Pressable","jsx","_jsx","AnimatedPressable","createAnimatedComponent","PressableScale","scaleTo","style","children","onPressIn","onPressOut","disabled","props","scale","Value","current","animateTo","value","spring","toValue","useNativeDriver","speed","bounciness","start","handlePressIn","e","handlePressOut","transform","displayName"],"sourceRoot":"../../../src","sources":["atoms/PressableScale.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,IAAI,EAAEC,MAAM,QAAQ,OAAO;AAC3C,SACEC,QAAQ,EACRC,SAAS,QAKJ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAStB,MAAMC,iBAAiB,GAAGJ,QAAQ,CAACK,uBAAuB,CAACJ,SAAS,CAAC;;AAErE;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMK,cAAc,gBAAGR,IAAI,CAChC,CAAC;EAAES,OAAO,GAAG,IAAI;EAAEC,KAAK;EAAEC,QAAQ;EAAEC,SAAS;EAAEC,UAAU;EAAEC,QAAQ;EAAE,GAAGC;AAA2B,CAAC,KAAK;EACvG,MAAMC,KAAK,GAAGf,MAAM,CAAC,IAAIC,QAAQ,CAACe,KAAK,CAAC,CAAC,CAAC,CAAC,CAACC,OAAO;EAEnD,MAAMC,SAAS,GAAIC,KAAa,IAAK;IACnClB,QAAQ,CAACmB,MAAM,CAACL,KAAK,EAAE;MACrBM,OAAO,EAAEF,KAAK;MACdG,eAAe,EAAE,IAAI;MACrBC,KAAK,EAAE,EAAE;MACTC,UAAU,EAAE;IACd,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC;EACZ,CAAC;EAED,MAAMC,aAAa,GAAIC,CAAwB,IAAK;IAClD,IAAI,CAACd,QAAQ,EAAEK,SAAS,CAACV,OAAO,CAAC;IACjCG,SAAS,GAAGgB,CAAC,CAAC;EAChB,CAAC;EAED,MAAMC,cAAc,GAAID,CAAwB,IAAK;IACnD,IAAI,CAACd,QAAQ,EAAEK,SAAS,CAAC,CAAC,CAAC;IAC3BN,UAAU,GAAGe,CAAC,CAAC;EACjB,CAAC;EAED,oBACEvB,IAAA,CAACC,iBAAiB;IAAA,GACZS,KAAK;IACTD,QAAQ,EAAEA,QAAS;IACnBF,SAAS,EAAEe,aAAc;IACzBd,UAAU,EAAEgB,cAAe;IAC3BnB,KAAK,EAAE,CAACA,KAAK,EAAE;MAAEoB,SAAS,EAAE,CAAC;QAAEd;MAAM,CAAC;IAAE,CAAC,CAAE;IAAAL,QAAA,EAE1CA;EAAQ,CACQ,CAAC;AAExB,CACF,CAAC;AACDH,cAAc,CAACuB,WAAW,GAAG,gBAAgB","ignoreList":[]}
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import React, { memo, useEffect, useRef } from 'react';
|
|
4
|
+
import { Animated, Easing, View } from 'react-native';
|
|
5
|
+
import { createStyles } from '../theme/createStyles';
|
|
6
|
+
import { useTheme } from '../theme/UIProvider';
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
const useStyles = createStyles(theme => ({
|
|
9
|
+
block: {
|
|
10
|
+
backgroundColor: theme.colors.skeleton
|
|
11
|
+
},
|
|
12
|
+
lines: {
|
|
13
|
+
gap: theme.tokens.spacing.sm
|
|
14
|
+
}
|
|
15
|
+
}));
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* Skeleton
|
|
19
|
+
* Placeholder que late mientras llega el contenido real. Reserva el espacio
|
|
20
|
+
* exacto de lo que reemplaza, así la pantalla no salta cuando aparecen los
|
|
21
|
+
* datos — que es justamente lo que un Spinner centrado no puede hacer.
|
|
22
|
+
*/
|
|
23
|
+
export const Skeleton = /*#__PURE__*/memo(({
|
|
24
|
+
width = '100%',
|
|
25
|
+
height = 16,
|
|
26
|
+
variant = 'rect',
|
|
27
|
+
radius,
|
|
28
|
+
lines = 1,
|
|
29
|
+
lastLineWidth = '60%',
|
|
30
|
+
animated = true,
|
|
31
|
+
style,
|
|
32
|
+
testID
|
|
33
|
+
}) => {
|
|
34
|
+
const theme = useTheme();
|
|
35
|
+
const styles = useStyles();
|
|
36
|
+
const pulse = useRef(new Animated.Value(0)).current;
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
if (!animated) return;
|
|
39
|
+
const loop = Animated.loop(Animated.sequence([Animated.timing(pulse, {
|
|
40
|
+
toValue: 1,
|
|
41
|
+
duration: 700,
|
|
42
|
+
useNativeDriver: true,
|
|
43
|
+
easing: Easing.inOut(Easing.quad)
|
|
44
|
+
}), Animated.timing(pulse, {
|
|
45
|
+
toValue: 0,
|
|
46
|
+
duration: 700,
|
|
47
|
+
useNativeDriver: true,
|
|
48
|
+
easing: Easing.inOut(Easing.quad)
|
|
49
|
+
})]));
|
|
50
|
+
loop.start();
|
|
51
|
+
return () => loop.stop();
|
|
52
|
+
}, [animated, pulse]);
|
|
53
|
+
const isCircle = variant === 'circle';
|
|
54
|
+
const isText = variant === 'text';
|
|
55
|
+
const opacity = animated ? pulse.interpolate({
|
|
56
|
+
inputRange: [0, 1],
|
|
57
|
+
outputRange: [1, 0.4]
|
|
58
|
+
}) : 1;
|
|
59
|
+
const resolvedHeight = isCircle ? width : isText ? theme.tokens.fontSize.md : height;
|
|
60
|
+
const resolvedRadius = radius ?? (isCircle ? theme.tokens.radius.full : isText ? theme.tokens.radius.xs : theme.tokens.radius.sm);
|
|
61
|
+
const barStyle = barWidth => [styles.block, {
|
|
62
|
+
width: barWidth,
|
|
63
|
+
height: resolvedHeight,
|
|
64
|
+
borderRadius: resolvedRadius,
|
|
65
|
+
opacity
|
|
66
|
+
}];
|
|
67
|
+
const a11y = {
|
|
68
|
+
accessibilityElementsHidden: true,
|
|
69
|
+
importantForAccessibility: 'no-hide-descendants'
|
|
70
|
+
};
|
|
71
|
+
if (isText && lines > 1) {
|
|
72
|
+
return /*#__PURE__*/_jsx(View, {
|
|
73
|
+
style: [styles.lines, style],
|
|
74
|
+
testID: testID,
|
|
75
|
+
...a11y,
|
|
76
|
+
children: Array.from({
|
|
77
|
+
length: lines
|
|
78
|
+
}, (_, i) => /*#__PURE__*/_jsx(Animated.View, {
|
|
79
|
+
testID: testID && `${testID}-${i}`,
|
|
80
|
+
style: barStyle(i === lines - 1 ? lastLineWidth : width)
|
|
81
|
+
}, i))
|
|
82
|
+
});
|
|
83
|
+
}
|
|
84
|
+
return /*#__PURE__*/_jsx(Animated.View, {
|
|
85
|
+
style: [barStyle(width), style],
|
|
86
|
+
testID: testID,
|
|
87
|
+
...a11y
|
|
88
|
+
});
|
|
89
|
+
});
|
|
90
|
+
Skeleton.displayName = 'Skeleton';
|
|
91
|
+
//# sourceMappingURL=Skeleton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","memo","useEffect","useRef","Animated","Easing","View","createStyles","useTheme","jsx","_jsx","useStyles","theme","block","backgroundColor","colors","skeleton","lines","gap","tokens","spacing","sm","Skeleton","width","height","variant","radius","lastLineWidth","animated","style","testID","styles","pulse","Value","current","loop","sequence","timing","toValue","duration","useNativeDriver","easing","inOut","quad","start","stop","isCircle","isText","opacity","interpolate","inputRange","outputRange","resolvedHeight","fontSize","md","resolvedRadius","full","xs","barStyle","barWidth","borderRadius","a11y","accessibilityElementsHidden","importantForAccessibility","children","Array","from","length","_","i","displayName"],"sourceRoot":"../../../src","sources":["atoms/Skeleton.tsx"],"mappings":"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","ignoreList":[]}
|