Skip to content

Commit dd3edd2

Browse files
navin-moorthynavin-moorthy
committed
refactor(components): ♻️ update styles & optional chaining
1 parent 1e1cf3e commit dd3edd2

File tree

10 files changed

+31
-36
lines changed

10 files changed

+31
-36
lines changed

‎src/components/circular-progress/CircularProgress.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -243,7 +243,7 @@ const RNCircularProgress: React.FC<Partial<CircularProgressProps>> = forwardRef<
243243
StyleSheet.absoluteFillObject,
244244
tailwind.style(
245245
cx(
246-
circularProgressTheme.text.base,
246+
circularProgressTheme.text,
247247
circularProgressTheme.size[size]?.text,
248248
),
249249
),

‎src/components/radio/Radio.tsx‎

Lines changed: 16 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -104,22 +104,23 @@ const RNRadio: React.FC<Partial<RadioProps>> = forwardRef<
104104
radioTheme.icon?.common,
105105
radioTheme.size[size]?.icon?.wrapper,
106106
radioProps.checked
107-
? radioTheme.themeColor[themeColor]?.icon.checked.default
108-
: radioTheme.themeColor[themeColor]?.icon.unChecked.default,
107+
? radioTheme.themeColor[themeColor]?.icon?.checked?.default
108+
: radioTheme.themeColor[themeColor]?.icon?.unChecked?.default,
109109
radioProps.disabled
110110
? radioProps.checked
111-
? radioTheme.themeColor[themeColor]?.icon.checked.disabled
112-
: radioTheme.themeColor[themeColor]?.icon.unChecked.disabled
111+
? radioTheme.themeColor[themeColor]?.icon?.checked?.disabled
112+
: radioTheme.themeColor[themeColor]?.icon?.unChecked
113+
?.disabled
113114
: "",
114115
pressed
115116
? radioProps.checked
116-
? radioTheme.themeColor[themeColor]?.icon.checked.press
117-
: radioTheme.themeColor[themeColor]?.icon.unChecked.press
117+
? radioTheme.themeColor[themeColor]?.icon?.checked?.press
118+
: radioTheme.themeColor[themeColor]?.icon?.unChecked?.press
118119
: "",
119120
isHovered
120121
? radioProps.checked
121-
? radioTheme.themeColor[themeColor]?.icon.checked.hover
122-
: radioTheme.themeColor[themeColor]?.icon.unChecked.hover
122+
? radioTheme.themeColor[themeColor]?.icon?.checked?.hover
123+
: radioTheme.themeColor[themeColor]?.icon?.unChecked?.hover
123124
: "",
124125
),
125126
),
@@ -129,24 +130,24 @@ const RNRadio: React.FC<Partial<RadioProps>> = forwardRef<
129130
<Box
130131
style={tailwind.style(
131132
cx(
132-
radioTheme.size[size]?.icon.innerCircle?.default,
133+
radioTheme.size[size]?.icon?.innerCircle?.default,
133134
radioProps.checked
134-
? radioTheme.themeColor[themeColor]?.innerCircle.checked
135+
? radioTheme.themeColor[themeColor]?.innerCircle?.checked
135136
.default
136-
: radioTheme.themeColor[themeColor]?.innerCircle.unChecked
137+
: radioTheme.themeColor[themeColor]?.innerCircle?.unChecked
137138
.default,
138139
radioProps.disabled
139140
? radioProps.checked
140-
? radioTheme.themeColor[themeColor]?.innerCircle.checked
141+
? radioTheme.themeColor[themeColor]?.innerCircle?.checked
141142
.disabled
142-
: radioTheme.themeColor[themeColor]?.innerCircle.unChecked
143+
: radioTheme.themeColor[themeColor]?.innerCircle?.unChecked
143144
.disabled
144145
: "",
145146
pressed
146147
? radioProps.checked
147-
? radioTheme.themeColor[themeColor]?.innerCircle.checked
148+
? radioTheme.themeColor[themeColor]?.innerCircle?.checked
148149
.press
149-
: radioTheme.themeColor[themeColor]?.innerCircle.unChecked
150+
: radioTheme.themeColor[themeColor]?.innerCircle?.unChecked
150151
.press
151152
: "",
152153
),

‎src/components/radio/RadioGroup.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,7 @@ const RNRadioGroup: React.FC<Partial<RadioGroupProps>> = forwardRef<
9292
const validChildren = getValidChildren(children);
9393
return (
9494
<Box
95-
style={tailwind.style(cx(radioGroupTheme.group[orientation].common))}
95+
style={tailwind.style(cx(radioGroupTheme.group[orientation]?.common))}
9696
{...radioGroupProps}
9797
ref={ref}
9898
>
@@ -101,7 +101,7 @@ const RNRadioGroup: React.FC<Partial<RadioGroupProps>> = forwardRef<
101101
<Box
102102
key={index}
103103
style={tailwind.style(
104-
cx(radioGroupTheme.group[orientation].spacing),
104+
cx(radioGroupTheme.group[orientation]?.spacing),
105105
)}
106106
>
107107
{renderElement}

‎src/components/slider/Slider.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -626,7 +626,7 @@ const RNSlider: React.FC<Partial<SliderProps>> = forwardRef<
626626
tailwind.style(
627627
cx(
628628
sliderTheme.knob.common,
629-
sliderTheme.size[size]?.knob.size,
629+
sliderTheme.size[size]?.knob?.size,
630630
sliderTheme.themeColor[themeColor]?.knob,
631631
disabled ? sliderTheme.knob.disabled : "",
632632
),

‎src/components/slider/SliderFilledTrack.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export const SliderFilledTrack: React.FC<SliderFilledTrackProps> = ({
2626
style={[
2727
tailwind.style(
2828
cx(
29-
sliderTheme?.filledTrack?.common,
29+
sliderTheme?.filledTrack,
3030
sliderTheme?.size[size]?.filledTrack,
3131
sliderTheme?.themeColor[themeColor]?.filledTrack,
3232
),

‎src/components/slider/SliderTrack.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export const SliderTrack: React.FC<
1717
style={[
1818
tailwind.style(
1919
cx(
20-
sliderTheme?.track?.common,
20+
sliderTheme?.track,
2121
sliderTheme?.size[size]?.track,
2222
sliderTheme?.themeColor[themeColor]?.track,
2323
),

‎src/theme/defaultTheme/avatar.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -104,13 +104,13 @@ export const avatar = {
104104
"3xl": "w-[17px] h-[10px]",
105105
},
106106
innerDots: {
107-
base: "h-[2px] w-[2px] rounded-full bg-white-900",
107+
base: "h-0.5 w-0.5 rounded-full bg-white-900",
108108
size: {
109-
xs: "h-[2px] w-[2px]",
109+
xs: "h-0.5 w-0.5",
110110
sm: "h-[2.25px] w-[2.25px]",
111111
md: "h-[2.8px] w-[2.8px]",
112112
lg: "h-[3.25px] w-[3.25px]",
113-
xl: "h-[2px] w-[2px]",
113+
xl: "h-0.5 w-0.5",
114114
"2xl": "h-[2.25px] w-[2.25px]",
115115
"3xl": "h-[2.5px] w-[2.5px]",
116116
},

‎src/theme/defaultTheme/circularProgress.ts‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,5 @@ export const circularProgress = {
3131
text: "text-xl",
3232
},
3333
},
34-
text: {
35-
base: "absolute font-medium text-gray-900 text-center leading-tight",
36-
},
34+
text: "absolute font-medium text-gray-900 text-center leading-tight",
3735
};

‎src/theme/defaultTheme/slider.ts‎

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,12 @@ export const slider = {
22
wrapper: "relative w-full",
33
knobWrapper: "relative",
44
iconWrapper: "justify-center items-center",
5-
filledTrack: {
6-
common: "w-full absolute rounded-2xl",
7-
},
8-
track: {
9-
common: "relative rounded-2xl",
10-
},
5+
filledTrack: "w-full absolute rounded-2xl",
6+
track: "relative rounded-2xl",
117
size: {
128
sm: {
13-
filledTrack: "h-[2px] mx-[9px]",
14-
track: "h-[2px] mx-[9px]",
9+
filledTrack: "h-0.5 mx-[9px]",
10+
track: "h-0.5 mx-[9px]",
1511
knob: {
1612
position: 18 / 2 - 2 / 2,
1713
size: "h-[18px] w-[18px]",

‎src/theme/defaultTheme/switch.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ export const switchTheme = {
5555
},
5656
},
5757
xl: {
58-
switchContainerStyle: "w-[48px] h-7 rounded-full py-[2px]",
58+
switchContainerStyle: "w-[48px] h-7 rounded-full py-0.5",
5959
thumbStyle: "w-6 h-6 bg-white-900 rounded-full shadow-sm",
6060
switchInterpolateWidths: [24, 27, 27, 24],
6161
thumbIntermediateTranslateValue: 3,

0 commit comments

Comments
 (0)