@yogiswara/honcho-editor-ui 2.11.1 → 2.11.2
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.
|
@@ -123,7 +123,7 @@ export default function HSliderColorMobile(props) {
|
|
|
123
123
|
color: colors.surface,
|
|
124
124
|
width: "40px", // Keep the fixed width for alignment
|
|
125
125
|
textAlign: "right", // Keep the text alignment
|
|
126
|
-
}, children: formatValue(props.tempScore) })] }), _jsx(Slider, {
|
|
126
|
+
}, children: formatValue(props.tempScore) })] }), _jsx(Slider, { sx: {
|
|
127
127
|
width: "100%",
|
|
128
128
|
color: colors.surface,
|
|
129
129
|
'& .MuiSlider-rail': {
|
|
@@ -140,12 +140,16 @@ export default function HSliderColorMobile(props) {
|
|
|
140
140
|
boxShadow: 'none',
|
|
141
141
|
pointerEvents: 'auto', // IMPORTANT: Re-enable interaction ONLY for the thumb
|
|
142
142
|
}
|
|
143
|
+
}, slotProps: {
|
|
144
|
+
thumb: {
|
|
145
|
+
ref: tempSliderRef
|
|
146
|
+
}
|
|
143
147
|
}, size: "small", value: props.tempScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.setTempScore("tempScore", newValue), onDoubleClick: tempInput.handleDoubleClick }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px', '&:focus-within .MuiFilledInput-input': focusedInputStyle }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, onDoubleClick: tintInput.handleDoubleClick, children: "Tint" }), _jsx(Typography, { sx: {
|
|
144
148
|
...typography.bodyMedium, // Use your standard typography
|
|
145
149
|
color: colors.surface,
|
|
146
150
|
width: "40px", // Keep the fixed width for alignment
|
|
147
151
|
textAlign: "right", // Keep the text alignment
|
|
148
|
-
}, children: formatValue(props.tintScore) })] }), _jsx(Slider, {
|
|
152
|
+
}, children: formatValue(props.tintScore) })] }), _jsx(Slider, { sx: {
|
|
149
153
|
width: "100%",
|
|
150
154
|
color: colors.surface,
|
|
151
155
|
'& .MuiSlider-rail': {
|
|
@@ -162,12 +166,16 @@ export default function HSliderColorMobile(props) {
|
|
|
162
166
|
boxShadow: 'none',
|
|
163
167
|
pointerEvents: 'auto',
|
|
164
168
|
}
|
|
169
|
+
}, slotProps: {
|
|
170
|
+
thumb: {
|
|
171
|
+
ref: tintSliderRef
|
|
172
|
+
}
|
|
165
173
|
}, size: "small", value: props.tintScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.setTintScore("tintScore", newValue), onDoubleClick: tintInput.handleDoubleClick }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px', '&:focus-within .MuiFilledInput-input': focusedInputStyle }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, onDoubleClick: vibranceInput.handleDoubleClick, children: "Vibrance" }), _jsx(Typography, { sx: {
|
|
166
174
|
...typography.bodyMedium, // Use your standard typography
|
|
167
175
|
color: colors.surface,
|
|
168
176
|
width: "40px", // Keep the fixed width for alignment
|
|
169
177
|
textAlign: "right", // Keep the text alignment
|
|
170
|
-
}, children: formatValue(props.vibranceScore) })] }), _jsx(Slider, {
|
|
178
|
+
}, children: formatValue(props.vibranceScore) })] }), _jsx(Slider, { sx: {
|
|
171
179
|
width: "100%",
|
|
172
180
|
color: colors.surface,
|
|
173
181
|
'& .MuiSlider-rail': {
|
|
@@ -184,12 +192,16 @@ export default function HSliderColorMobile(props) {
|
|
|
184
192
|
boxShadow: 'none',
|
|
185
193
|
pointerEvents: 'auto',
|
|
186
194
|
}
|
|
195
|
+
}, slotProps: {
|
|
196
|
+
thumb: {
|
|
197
|
+
ref: vibranceSliderRef
|
|
198
|
+
}
|
|
187
199
|
}, size: "small", value: props.vibranceScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.setVibranceScore("vibranceScore", newValue), onDoubleClick: vibranceInput.handleDoubleClick }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px', '&:focus-within .MuiFilledInput-input': focusedInputStyle }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, onDoubleClick: saturationInput.handleDoubleClick, children: "Saturation" }), _jsx(Typography, { sx: {
|
|
188
200
|
...typography.bodyMedium, // Use your standard typography
|
|
189
201
|
color: colors.surface,
|
|
190
202
|
width: "40px", // Keep the fixed width for alignment
|
|
191
203
|
textAlign: "right", // Keep the text alignment
|
|
192
|
-
}, children: formatValue(props.saturationScore) })] }), _jsx(Slider, {
|
|
204
|
+
}, children: formatValue(props.saturationScore) })] }), _jsx(Slider, { sx: {
|
|
193
205
|
width: "100%",
|
|
194
206
|
color: colors.surface,
|
|
195
207
|
'& .MuiSlider-rail': {
|
|
@@ -206,5 +218,9 @@ export default function HSliderColorMobile(props) {
|
|
|
206
218
|
boxShadow: 'none',
|
|
207
219
|
pointerEvents: 'auto',
|
|
208
220
|
}
|
|
221
|
+
}, slotProps: {
|
|
222
|
+
thumb: {
|
|
223
|
+
ref: saturationSliderRef
|
|
224
|
+
}
|
|
209
225
|
}, size: "small", value: props.saturationScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.setSaturationScore("saturationScore", newValue), onDoubleClick: saturationInput.handleDoubleClick })] }) }));
|
|
210
226
|
}
|