jfs-components 0.0.59 → 0.0.60
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/lib/commonjs/components/Button/Button.js +2 -2
- package/lib/commonjs/components/Section/Section.js +8 -1
- package/lib/commonjs/icons/registry.js +1 -1
- package/lib/commonjs/utils/react-utils.js +6 -1
- package/lib/module/components/Button/Button.js +2 -2
- package/lib/module/components/Section/Section.js +8 -1
- package/lib/module/icons/registry.js +1 -1
- package/lib/module/utils/react-utils.js +6 -1
- package/lib/typescript/src/icons/registry.d.ts +1 -1
- package/package.json +1 -1
- package/src/components/Button/Button.tsx +2 -2
- package/src/components/Section/Section.tsx +9 -1
- package/src/icons/registry.ts +1 -1
- package/src/utils/react-utils.ts +6 -3
|
@@ -74,7 +74,7 @@ function Button({
|
|
|
74
74
|
const hoverBg = (0, _figmaVariablesResolver.getVariableByName)('button/background', hoverModes) || backgroundColor;
|
|
75
75
|
const hoverBorderColor = (0, _figmaVariablesResolver.getVariableByName)('button/border/color', hoverModes) || borderColor;
|
|
76
76
|
const hoverTextColor = (0, _figmaVariablesResolver.getVariableByName)('button/foreground', hoverModes) || textColor;
|
|
77
|
-
const hoverIconColor =
|
|
77
|
+
const hoverIconColor = hoverTextColor;
|
|
78
78
|
const pressedModes = {
|
|
79
79
|
...modes,
|
|
80
80
|
"Button / State": "Pressed"
|
|
@@ -82,7 +82,7 @@ function Button({
|
|
|
82
82
|
const pressedBg = (0, _figmaVariablesResolver.getVariableByName)('button/background', pressedModes) || backgroundColor;
|
|
83
83
|
const pressedBorderColor = (0, _figmaVariablesResolver.getVariableByName)('button/border/color', pressedModes) || borderColor;
|
|
84
84
|
const pressedTextColor = (0, _figmaVariablesResolver.getVariableByName)('button/foreground', pressedModes) || textColor;
|
|
85
|
-
const pressedIconColor =
|
|
85
|
+
const pressedIconColor = pressedTextColor;
|
|
86
86
|
const activeTextColor = isPressed && !disabled ? pressedTextColor : isHovered && !disabled ? hoverTextColor : textColor;
|
|
87
87
|
const activeIconColor = isPressed && !disabled ? pressedIconColor : isHovered && !disabled ? hoverIconColor : iconColor;
|
|
88
88
|
const baseLabelTextStyle = {
|
|
@@ -24,12 +24,19 @@ function SlotGrid({
|
|
|
24
24
|
maxColumns = SLOT_GRID_MAX_COLUMNS
|
|
25
25
|
}) {
|
|
26
26
|
const [maxItemWidth, setMaxItemWidth] = (0, _react.useState)(null);
|
|
27
|
+
const [measureTimedOut, setMeasureTimedOut] = (0, _react.useState)(false);
|
|
27
28
|
const itemWidthsRef = (0, _react.useRef)(new Map());
|
|
28
29
|
const totalItems = items.length;
|
|
29
30
|
(0, _react.useEffect)(() => {
|
|
30
31
|
itemWidthsRef.current.clear();
|
|
31
32
|
setMaxItemWidth(null);
|
|
33
|
+
setMeasureTimedOut(false);
|
|
32
34
|
}, [totalItems]);
|
|
35
|
+
(0, _react.useEffect)(() => {
|
|
36
|
+
if (maxItemWidth !== null) return;
|
|
37
|
+
const timer = setTimeout(() => setMeasureTimedOut(true), 500);
|
|
38
|
+
return () => clearTimeout(timer);
|
|
39
|
+
}, [maxItemWidth, totalItems]);
|
|
33
40
|
const handleItemLayout = (0, _react.useCallback)((index, width) => {
|
|
34
41
|
itemWidthsRef.current.set(index, width);
|
|
35
42
|
if (itemWidthsRef.current.size >= totalItems && totalItems > 0) {
|
|
@@ -45,7 +52,7 @@ function SlotGrid({
|
|
|
45
52
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
46
53
|
style: {
|
|
47
54
|
gap,
|
|
48
|
-
...(isMeasured ? {} : {
|
|
55
|
+
...(isMeasured || measureTimedOut ? {} : {
|
|
49
56
|
opacity: 0
|
|
50
57
|
})
|
|
51
58
|
},
|