@impulse-ui-native/switch 2.7.0 → 2.8.0
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/components/switch.js +14 -5
- package/dist/components/switch.js.map +1 -1
- package/dist/hooks/use-switch-animation.hook.js +2 -2
- package/dist/hooks/use-switch-animation.hook.js.map +1 -1
- package/dist/hooks/use-switch-tokens.hook.js +22 -15
- package/dist/hooks/use-switch-tokens.hook.js.map +1 -1
- package/package.json +4 -4
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { memo, useCallback, useMemo } from "react";
|
|
3
|
-
import {
|
|
3
|
+
import { StyleSheet } from "react-native";
|
|
4
4
|
import Animated from "react-native-reanimated";
|
|
5
5
|
import { useControllableState } from "@impulse-ui-native/core";
|
|
6
|
-
import { Pressable } from "@impulse-ui-native/primitives";
|
|
6
|
+
import { Pressable, Spinner } from "@impulse-ui-native/primitives";
|
|
7
7
|
import { useThemedStyles } from "@impulse-ui-native/theme";
|
|
8
8
|
import { useSwitchAnimation, useSwitchTokens } from "../hooks";
|
|
9
9
|
import { switchStyles } from "./switch.styles";
|
|
@@ -65,6 +65,14 @@ const Switch = memo(function Switch2({
|
|
|
65
65
|
},
|
|
66
66
|
[onPress, setChecked]
|
|
67
67
|
);
|
|
68
|
+
const trackAnimatedStyle = useMemo(
|
|
69
|
+
() => [styles.track, trackStyle],
|
|
70
|
+
[styles.track, trackStyle]
|
|
71
|
+
);
|
|
72
|
+
const thumbAnimatedStyle = useMemo(
|
|
73
|
+
() => [styles.thumb, thumbStyle],
|
|
74
|
+
[styles.thumb, thumbStyle]
|
|
75
|
+
);
|
|
68
76
|
return /* @__PURE__ */ jsx(
|
|
69
77
|
Pressable,
|
|
70
78
|
{
|
|
@@ -75,11 +83,12 @@ const Switch = memo(function Switch2({
|
|
|
75
83
|
hitSlop: hitSlop ?? sizeTokens.hitSlop,
|
|
76
84
|
onPress: handlePress,
|
|
77
85
|
style: switchStyle,
|
|
78
|
-
children: /* @__PURE__ */ jsx(Animated.View, { pointerEvents: "none", style:
|
|
79
|
-
|
|
86
|
+
children: /* @__PURE__ */ jsx(Animated.View, { pointerEvents: "none", style: trackAnimatedStyle, children: /* @__PURE__ */ jsx(Animated.View, { style: thumbAnimatedStyle, children: loading ? /* @__PURE__ */ jsx(
|
|
87
|
+
Spinner,
|
|
80
88
|
{
|
|
89
|
+
accessible: false,
|
|
81
90
|
color: loadingIndicatorColor,
|
|
82
|
-
size: "
|
|
91
|
+
size: "medium",
|
|
83
92
|
style: styles.loadingIndicator
|
|
84
93
|
}
|
|
85
94
|
) : null }) })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/switch.tsx"],"sourcesContent":["import type {\n AccessibilityState,\n GestureResponderEvent,\n PressableStateCallbackType,\n StyleProp,\n ViewStyle,\n} from \"react-native\";\nimport { memo, useCallback, useMemo } from \"react\";\nimport {
|
|
1
|
+
{"version":3,"sources":["../../src/components/switch.tsx"],"sourcesContent":["import type {\n AccessibilityState,\n GestureResponderEvent,\n PressableStateCallbackType,\n StyleProp,\n ViewStyle,\n} from \"react-native\";\nimport { memo, useCallback, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\nimport Animated from \"react-native-reanimated\";\n\nimport { useControllableState } from \"@impulse-ui-native/core\";\nimport { Pressable, Spinner } from \"@impulse-ui-native/primitives\";\nimport { useThemedStyles } from \"@impulse-ui-native/theme\";\n\nimport type { SwitchProps } from \"../types\";\nimport { useSwitchAnimation, useSwitchTokens } from \"../hooks\";\nimport { switchStyles } from \"./switch.styles\";\n\nexport const Switch = memo(function Switch({\n accessibilityState,\n checked: checkedProp,\n defaultChecked = false,\n disabled,\n hitSlop,\n loading = false,\n onCheckedChange,\n onPress,\n size = \"medium\",\n style,\n variant = \"filled\",\n ...props\n}: SwitchProps) {\n const [checked, setChecked] = useControllableState<boolean>({\n prop: checkedProp,\n defaultProp: defaultChecked,\n onChange: onCheckedChange,\n });\n const interactionDisabled = disabled === true || loading;\n const {\n animationDuration,\n borderWidth,\n colors,\n loadingIndicatorColor,\n sizeTokens,\n } = useSwitchTokens({ disabled: interactionDisabled, size, variant });\n const styles = useThemedStyles(switchStyles, { size }, [size]);\n const { thumbStyle, trackStyle } = useSwitchAnimation({\n animationDuration,\n borderWidth,\n checked,\n colors,\n sizeTokens,\n });\n\n const resolvedAccessibilityState = useMemo<AccessibilityState>(\n () => ({\n ...accessibilityState,\n busy: loading,\n checked,\n disabled: interactionDisabled,\n }),\n [accessibilityState, checked, interactionDisabled, loading],\n );\n\n const switchStyle = useCallback(\n (state: PressableStateCallbackType): StyleProp<ViewStyle> =>\n StyleSheet.flatten([\n styles.root,\n typeof style === \"function\" ? style(state) : style,\n ]),\n [style, styles.root],\n );\n\n const handlePress = useCallback(\n (event: GestureResponderEvent) => {\n setChecked((current) => !current);\n onPress?.(event);\n },\n [onPress, setChecked],\n );\n\n const trackAnimatedStyle = useMemo(\n () => [styles.track, trackStyle],\n [styles.track, trackStyle],\n );\n\n const thumbAnimatedStyle = useMemo(\n () => [styles.thumb, thumbStyle],\n [styles.thumb, thumbStyle],\n );\n\n return (\n <Pressable\n {...props}\n accessibilityRole=\"switch\"\n accessibilityState={resolvedAccessibilityState}\n disabled={interactionDisabled}\n hitSlop={hitSlop ?? sizeTokens.hitSlop}\n onPress={handlePress}\n style={switchStyle}\n >\n <Animated.View pointerEvents=\"none\" style={trackAnimatedStyle}>\n <Animated.View style={thumbAnimatedStyle}>\n {loading ? (\n <Spinner\n accessible={false}\n color={loadingIndicatorColor}\n size=\"medium\"\n style={styles.loadingIndicator}\n />\n ) : null}\n </Animated.View>\n </Animated.View>\n </Pressable>\n );\n});\n"],"mappings":"AAyGY;AAlGZ,SAAS,MAAM,aAAa,eAAe;AAC3C,SAAS,kBAAkB;AAC3B,OAAO,cAAc;AAErB,SAAS,4BAA4B;AACrC,SAAS,WAAW,eAAe;AACnC,SAAS,uBAAuB;AAGhC,SAAS,oBAAoB,uBAAuB;AACpD,SAAS,oBAAoB;AAEtB,MAAM,SAAS,KAAK,SAASA,QAAO;AAAA,EACzC;AAAA,EACA,SAAS;AAAA,EACT,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,GAAgB;AACd,QAAM,CAAC,SAAS,UAAU,IAAI,qBAA8B;AAAA,IAC1D,MAAM;AAAA,IACN,aAAa;AAAA,IACb,UAAU;AAAA,EACZ,CAAC;AACD,QAAM,sBAAsB,aAAa,QAAQ;AACjD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,gBAAgB,EAAE,UAAU,qBAAqB,MAAM,QAAQ,CAAC;AACpE,QAAM,SAAS,gBAAgB,cAAc,EAAE,KAAK,GAAG,CAAC,IAAI,CAAC;AAC7D,QAAM,EAAE,YAAY,WAAW,IAAI,mBAAmB;AAAA,IACpD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,6BAA6B;AAAA,IACjC,OAAO;AAAA,MACL,GAAG;AAAA,MACH,MAAM;AAAA,MACN;AAAA,MACA,UAAU;AAAA,IACZ;AAAA,IACA,CAAC,oBAAoB,SAAS,qBAAqB,OAAO;AAAA,EAC5D;AAEA,QAAM,cAAc;AAAA,IAClB,CAAC,UACC,WAAW,QAAQ;AAAA,MACjB,OAAO;AAAA,MACP,OAAO,UAAU,aAAa,MAAM,KAAK,IAAI;AAAA,IAC/C,CAAC;AAAA,IACH,CAAC,OAAO,OAAO,IAAI;AAAA,EACrB;AAEA,QAAM,cAAc;AAAA,IAClB,CAAC,UAAiC;AAChC,iBAAW,CAAC,YAAY,CAAC,OAAO;AAChC,gBAAU,KAAK;AAAA,IACjB;AAAA,IACA,CAAC,SAAS,UAAU;AAAA,EACtB;AAEA,QAAM,qBAAqB;AAAA,IACzB,MAAM,CAAC,OAAO,OAAO,UAAU;AAAA,IAC/B,CAAC,OAAO,OAAO,UAAU;AAAA,EAC3B;AAEA,QAAM,qBAAqB;AAAA,IACzB,MAAM,CAAC,OAAO,OAAO,UAAU;AAAA,IAC/B,CAAC,OAAO,OAAO,UAAU;AAAA,EAC3B;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,mBAAkB;AAAA,MAClB,oBAAoB;AAAA,MACpB,UAAU;AAAA,MACV,SAAS,WAAW,WAAW;AAAA,MAC/B,SAAS;AAAA,MACT,OAAO;AAAA,MAEP,8BAAC,SAAS,MAAT,EAAc,eAAc,QAAO,OAAO,oBACzC,8BAAC,SAAS,MAAT,EAAc,OAAO,oBACnB,oBACC;AAAA,QAAC;AAAA;AAAA,UACC,YAAY;AAAA,UACZ,OAAO;AAAA,UACP,MAAK;AAAA,UACL,OAAO,OAAO;AAAA;AAAA,MAChB,IACE,MACN,GACF;AAAA;AAAA,EACF;AAEJ,CAAC;","names":["Switch"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useEffect } from "react";
|
|
1
|
+
import { useEffect, useMemo } from "react";
|
|
2
2
|
import { I18nManager } from "react-native";
|
|
3
3
|
import {
|
|
4
4
|
Easing,
|
|
@@ -55,7 +55,7 @@ function useSwitchAnimation({
|
|
|
55
55
|
easing: Easing.out(Easing.cubic)
|
|
56
56
|
});
|
|
57
57
|
}, [animationDuration, checked, progress, reduceMotion]);
|
|
58
|
-
return { thumbStyle, trackStyle };
|
|
58
|
+
return useMemo(() => ({ thumbStyle, trackStyle }), [thumbStyle, trackStyle]);
|
|
59
59
|
}
|
|
60
60
|
export {
|
|
61
61
|
useSwitchAnimation
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/hooks/use-switch-animation.hook.ts"],"sourcesContent":["import { useEffect } from \"react\";\nimport { I18nManager } from \"react-native\";\nimport {\n Easing,\n interpolateColor,\n useAnimatedStyle,\n useReducedMotion,\n useSharedValue,\n withTiming,\n} from \"react-native-reanimated\";\n\nimport type { SwitchSizeTokens } from \"@impulse-ui-native/theme\";\n\nimport type { SwitchAnimationColors } from \"./use-switch-tokens.hook\";\n\ninterface UseSwitchAnimationOptions {\n animationDuration: number;\n borderWidth: number;\n checked: boolean;\n colors: SwitchAnimationColors;\n sizeTokens: SwitchSizeTokens[keyof SwitchSizeTokens];\n}\n\nexport function useSwitchAnimation({\n animationDuration,\n borderWidth,\n checked,\n colors,\n sizeTokens,\n}: UseSwitchAnimationOptions) {\n const reduceMotion = useReducedMotion();\n const progress = useSharedValue(checked ? 1 : 0);\n\n const thumbTravel =\n sizeTokens.width -\n sizeTokens.thumbSize -\n sizeTokens.trackPadding * 2 -\n borderWidth * 2;\n const direction = I18nManager.isRTL ? -1 : 1;\n\n const trackStyle = useAnimatedStyle(\n () => ({\n backgroundColor: interpolateColor(\n progress.value,\n [0, 1],\n [colors.inactiveBackgroundColor, colors.activeBackgroundColor],\n ),\n borderColor: interpolateColor(\n progress.value,\n [0, 1],\n [colors.inactiveBorderColor, colors.activeBorderColor],\n ),\n }),\n [colors],\n );\n\n const thumbStyle = useAnimatedStyle(\n () => ({\n backgroundColor: interpolateColor(\n progress.value,\n [0, 1],\n [colors.inactiveThumbColor, colors.activeThumbColor],\n ),\n transform: [\n {\n translateX: progress.value * thumbTravel * direction,\n },\n ],\n }),\n [colors, direction, thumbTravel],\n );\n\n useEffect(() => {\n // Reanimated shared values are mutable handles updated from React effects.\n // eslint-disable-next-line react-hooks/immutability\n progress.value = withTiming(checked ? 1 : 0, {\n duration: reduceMotion ? 0 : animationDuration,\n easing: Easing.out(Easing.cubic),\n });\n }, [animationDuration, checked, progress, reduceMotion]);\n\n return { thumbStyle, trackStyle };\n}\n"],"mappings":"AAAA,SAAS,
|
|
1
|
+
{"version":3,"sources":["../../src/hooks/use-switch-animation.hook.ts"],"sourcesContent":["import { useEffect, useMemo } from \"react\";\nimport { I18nManager } from \"react-native\";\nimport {\n Easing,\n interpolateColor,\n useAnimatedStyle,\n useReducedMotion,\n useSharedValue,\n withTiming,\n} from \"react-native-reanimated\";\n\nimport type { SwitchSizeTokens } from \"@impulse-ui-native/theme\";\n\nimport type { SwitchAnimationColors } from \"./use-switch-tokens.hook\";\n\ninterface UseSwitchAnimationOptions {\n animationDuration: number;\n borderWidth: number;\n checked: boolean;\n colors: SwitchAnimationColors;\n sizeTokens: SwitchSizeTokens[keyof SwitchSizeTokens];\n}\n\nexport function useSwitchAnimation({\n animationDuration,\n borderWidth,\n checked,\n colors,\n sizeTokens,\n}: UseSwitchAnimationOptions) {\n const reduceMotion = useReducedMotion();\n const progress = useSharedValue(checked ? 1 : 0);\n\n const thumbTravel =\n sizeTokens.width -\n sizeTokens.thumbSize -\n sizeTokens.trackPadding * 2 -\n borderWidth * 2;\n const direction = I18nManager.isRTL ? -1 : 1;\n\n const trackStyle = useAnimatedStyle(\n () => ({\n backgroundColor: interpolateColor(\n progress.value,\n [0, 1],\n [colors.inactiveBackgroundColor, colors.activeBackgroundColor],\n ),\n borderColor: interpolateColor(\n progress.value,\n [0, 1],\n [colors.inactiveBorderColor, colors.activeBorderColor],\n ),\n }),\n [colors],\n );\n\n const thumbStyle = useAnimatedStyle(\n () => ({\n backgroundColor: interpolateColor(\n progress.value,\n [0, 1],\n [colors.inactiveThumbColor, colors.activeThumbColor],\n ),\n transform: [\n {\n translateX: progress.value * thumbTravel * direction,\n },\n ],\n }),\n [colors, direction, thumbTravel],\n );\n\n useEffect(() => {\n // Reanimated shared values are mutable handles updated from React effects.\n // eslint-disable-next-line react-hooks/immutability\n progress.value = withTiming(checked ? 1 : 0, {\n duration: reduceMotion ? 0 : animationDuration,\n easing: Easing.out(Easing.cubic),\n });\n }, [animationDuration, checked, progress, reduceMotion]);\n\n return useMemo(() => ({ thumbStyle, trackStyle }), [thumbStyle, trackStyle]);\n}\n"],"mappings":"AAAA,SAAS,WAAW,eAAe;AACnC,SAAS,mBAAmB;AAC5B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAcA,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,QAAM,eAAe,iBAAiB;AACtC,QAAM,WAAW,eAAe,UAAU,IAAI,CAAC;AAE/C,QAAM,cACJ,WAAW,QACX,WAAW,YACX,WAAW,eAAe,IAC1B,cAAc;AAChB,QAAM,YAAY,YAAY,QAAQ,KAAK;AAE3C,QAAM,aAAa;AAAA,IACjB,OAAO;AAAA,MACL,iBAAiB;AAAA,QACf,SAAS;AAAA,QACT,CAAC,GAAG,CAAC;AAAA,QACL,CAAC,OAAO,yBAAyB,OAAO,qBAAqB;AAAA,MAC/D;AAAA,MACA,aAAa;AAAA,QACX,SAAS;AAAA,QACT,CAAC,GAAG,CAAC;AAAA,QACL,CAAC,OAAO,qBAAqB,OAAO,iBAAiB;AAAA,MACvD;AAAA,IACF;AAAA,IACA,CAAC,MAAM;AAAA,EACT;AAEA,QAAM,aAAa;AAAA,IACjB,OAAO;AAAA,MACL,iBAAiB;AAAA,QACf,SAAS;AAAA,QACT,CAAC,GAAG,CAAC;AAAA,QACL,CAAC,OAAO,oBAAoB,OAAO,gBAAgB;AAAA,MACrD;AAAA,MACA,WAAW;AAAA,QACT;AAAA,UACE,YAAY,SAAS,QAAQ,cAAc;AAAA,QAC7C;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,QAAQ,WAAW,WAAW;AAAA,EACjC;AAEA,YAAU,MAAM;AAGd,aAAS,QAAQ,WAAW,UAAU,IAAI,GAAG;AAAA,MAC3C,UAAU,eAAe,IAAI;AAAA,MAC7B,QAAQ,OAAO,IAAI,OAAO,KAAK;AAAA,IACjC,CAAC;AAAA,EACH,GAAG,CAAC,mBAAmB,SAAS,UAAU,YAAY,CAAC;AAEvD,SAAO,QAAQ,OAAO,EAAE,YAAY,WAAW,IAAI,CAAC,YAAY,UAAU,CAAC;AAC7E;","names":[]}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { useMemo } from "react";
|
|
1
2
|
import { useComponentsTokens } from "@impulse-ui-native/theme";
|
|
2
3
|
function useSwitchTokens({
|
|
3
4
|
disabled,
|
|
@@ -7,21 +8,27 @@ function useSwitchTokens({
|
|
|
7
8
|
const tokens = useComponentsTokens().switch;
|
|
8
9
|
const sizeTokens = tokens.sizes[size];
|
|
9
10
|
const variantTokens = tokens.variants[variant];
|
|
10
|
-
const colors =
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
11
|
+
const colors = useMemo(
|
|
12
|
+
() => ({
|
|
13
|
+
activeBackgroundColor: disabled ? tokens.disabledBackgroundColor : variantTokens.backgroundColor,
|
|
14
|
+
activeBorderColor: disabled ? tokens.disabledBorderColor : variantTokens.borderColor,
|
|
15
|
+
activeThumbColor: disabled ? tokens.disabledThumbColor : variantTokens.color,
|
|
16
|
+
inactiveBackgroundColor: disabled ? tokens.disabledBackgroundColor : tokens.uncheckedBackgroundColor,
|
|
17
|
+
inactiveBorderColor: disabled ? tokens.disabledBorderColor : tokens.uncheckedBorderColor,
|
|
18
|
+
inactiveThumbColor: disabled ? tokens.disabledThumbColor : tokens.uncheckedThumbColor
|
|
19
|
+
}),
|
|
20
|
+
[disabled, tokens, variantTokens]
|
|
21
|
+
);
|
|
22
|
+
return useMemo(
|
|
23
|
+
() => ({
|
|
24
|
+
animationDuration: tokens.animationDuration,
|
|
25
|
+
borderWidth: tokens.borderWidth,
|
|
26
|
+
colors,
|
|
27
|
+
loadingIndicatorColor: tokens.loadingIndicatorColor,
|
|
28
|
+
sizeTokens
|
|
29
|
+
}),
|
|
30
|
+
[colors, sizeTokens, tokens]
|
|
31
|
+
);
|
|
25
32
|
}
|
|
26
33
|
export {
|
|
27
34
|
useSwitchTokens
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/hooks/use-switch-tokens.hook.ts"],"sourcesContent":["import type { ComponentSize, ComponentVariant } from \"@impulse-ui-native/theme\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nexport interface SwitchAnimationColors {\n activeBackgroundColor: string;\n activeBorderColor: string;\n activeThumbColor: string;\n inactiveBackgroundColor: string;\n inactiveBorderColor: string;\n inactiveThumbColor: string;\n}\n\ninterface UseSwitchTokensOptions {\n disabled: boolean;\n size: ComponentSize;\n variant: ComponentVariant;\n}\n\nexport function useSwitchTokens({\n disabled,\n size,\n variant,\n}: UseSwitchTokensOptions) {\n const tokens = useComponentsTokens().switch;\n const sizeTokens = tokens.sizes[size];\n const variantTokens = tokens.variants[variant];\n\n const colors
|
|
1
|
+
{"version":3,"sources":["../../src/hooks/use-switch-tokens.hook.ts"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport type { ComponentSize, ComponentVariant } from \"@impulse-ui-native/theme\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nexport interface SwitchAnimationColors {\n activeBackgroundColor: string;\n activeBorderColor: string;\n activeThumbColor: string;\n inactiveBackgroundColor: string;\n inactiveBorderColor: string;\n inactiveThumbColor: string;\n}\n\ninterface UseSwitchTokensOptions {\n disabled: boolean;\n size: ComponentSize;\n variant: ComponentVariant;\n}\n\nexport function useSwitchTokens({\n disabled,\n size,\n variant,\n}: UseSwitchTokensOptions) {\n const tokens = useComponentsTokens().switch;\n const sizeTokens = tokens.sizes[size];\n const variantTokens = tokens.variants[variant];\n\n const colors = useMemo<SwitchAnimationColors>(\n () => ({\n activeBackgroundColor: disabled\n ? tokens.disabledBackgroundColor\n : variantTokens.backgroundColor,\n activeBorderColor: disabled\n ? tokens.disabledBorderColor\n : variantTokens.borderColor,\n activeThumbColor: disabled\n ? tokens.disabledThumbColor\n : variantTokens.color,\n inactiveBackgroundColor: disabled\n ? tokens.disabledBackgroundColor\n : tokens.uncheckedBackgroundColor,\n inactiveBorderColor: disabled\n ? tokens.disabledBorderColor\n : tokens.uncheckedBorderColor,\n inactiveThumbColor: disabled\n ? tokens.disabledThumbColor\n : tokens.uncheckedThumbColor,\n }),\n [disabled, tokens, variantTokens],\n );\n\n return useMemo(\n () => ({\n animationDuration: tokens.animationDuration,\n borderWidth: tokens.borderWidth,\n colors,\n loadingIndicatorColor: tokens.loadingIndicatorColor,\n sizeTokens,\n }),\n [colors, sizeTokens, tokens],\n );\n}\n"],"mappings":"AAAA,SAAS,eAAe;AAGxB,SAAS,2BAA2B;AAiB7B,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACF,GAA2B;AACzB,QAAM,SAAS,oBAAoB,EAAE;AACrC,QAAM,aAAa,OAAO,MAAM,IAAI;AACpC,QAAM,gBAAgB,OAAO,SAAS,OAAO;AAE7C,QAAM,SAAS;AAAA,IACb,OAAO;AAAA,MACL,uBAAuB,WACnB,OAAO,0BACP,cAAc;AAAA,MAClB,mBAAmB,WACf,OAAO,sBACP,cAAc;AAAA,MAClB,kBAAkB,WACd,OAAO,qBACP,cAAc;AAAA,MAClB,yBAAyB,WACrB,OAAO,0BACP,OAAO;AAAA,MACX,qBAAqB,WACjB,OAAO,sBACP,OAAO;AAAA,MACX,oBAAoB,WAChB,OAAO,qBACP,OAAO;AAAA,IACb;AAAA,IACA,CAAC,UAAU,QAAQ,aAAa;AAAA,EAClC;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,MACL,mBAAmB,OAAO;AAAA,MAC1B,aAAa,OAAO;AAAA,MACpB;AAAA,MACA,uBAAuB,OAAO;AAAA,MAC9B;AAAA,IACF;AAAA,IACA,CAAC,QAAQ,YAAY,MAAM;AAAA,EAC7B;AACF;","names":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@impulse-ui-native/switch",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.8.0",
|
|
4
4
|
"description": "Animated switch controls for ImpulseUI Native applications.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react-native",
|
|
@@ -29,9 +29,9 @@
|
|
|
29
29
|
],
|
|
30
30
|
"sideEffects": false,
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@impulse-ui-native/
|
|
33
|
-
"@impulse-ui-native/
|
|
34
|
-
"@impulse-ui-native/
|
|
32
|
+
"@impulse-ui-native/core": "2.8.0",
|
|
33
|
+
"@impulse-ui-native/theme": "2.8.0",
|
|
34
|
+
"@impulse-ui-native/primitives": "2.8.0"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
37
|
"@types/react": "~19.2.14",
|