@yogiswara/honcho-editor-ui 2.4.0 → 2.4.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.
@@ -86,7 +86,7 @@ export default function HSliderColorMobile(props) {
86
86
  '& .MuiSlider-thumb': {
87
87
  boxShadow: 'none',
88
88
  }
89
- }, size: "small", value: props.tempScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onTempChange(newValue) }), _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 }, children: "Tint" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.tintScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onTintChange), sx: {
89
+ }, size: "small", value: props.tempScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onTempChange(newValue), onDoubleClick: () => props.onTempChange(0) }), _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 }, children: "Tint" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.tintScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onTintChange), sx: {
90
90
  width: "40px",
91
91
  alignItems: "center",
92
92
  textAlign: "right",
@@ -130,7 +130,7 @@ export default function HSliderColorMobile(props) {
130
130
  '& .MuiSlider-thumb': {
131
131
  boxShadow: 'none',
132
132
  }
133
- }, size: "small", value: props.tintScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onTintChange(newValue) }), _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 }, children: "Vibrance" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.vibranceScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onVibranceChange), sx: {
133
+ }, size: "small", value: props.tintScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onTintChange(newValue), onDoubleClick: () => props.onTintChange(0) }), _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 }, children: "Vibrance" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.vibranceScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onVibranceChange), sx: {
134
134
  width: "40px",
135
135
  alignItems: "center",
136
136
  textAlign: "right",
@@ -174,7 +174,7 @@ export default function HSliderColorMobile(props) {
174
174
  '& .MuiSlider-thumb': {
175
175
  boxShadow: 'none',
176
176
  }
177
- }, size: "small", value: props.vibranceScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onVibranceChange(newValue) }), _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 }, children: "Saturation" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.saturationScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onSaturationChange), sx: {
177
+ }, size: "small", value: props.vibranceScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onVibranceChange(newValue), onDoubleClick: () => props.onVibranceChange(0) }), _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 }, children: "Saturation" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.saturationScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onSaturationChange), sx: {
178
178
  width: "40px",
179
179
  alignItems: "center",
180
180
  textAlign: "right",
@@ -218,5 +218,5 @@ export default function HSliderColorMobile(props) {
218
218
  '& .MuiSlider-thumb': {
219
219
  boxShadow: 'none',
220
220
  }
221
- }, size: "small", value: props.saturationScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onSaturationChange(newValue) })] }) }));
221
+ }, size: "small", value: props.saturationScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onSaturationChange(newValue), onDoubleClick: () => props.onSaturationChange(0) })] }) }));
222
222
  }
@@ -73,7 +73,7 @@ export default function HSliderDetailsMobile(props) {
73
73
  '& .MuiSlider-thumb:hover': {
74
74
  boxShadow: 'none',
75
75
  }
76
- }, size: "small", value: props.clarityScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onClarityChange(newValue) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Sharpness" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.sharpnessScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onSharpnessChange), sx: {
76
+ }, size: "small", value: props.clarityScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onClarityChange(newValue), onDoubleClick: () => props.onClarityChange(0) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Sharpness" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.sharpnessScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onSharpnessChange), sx: {
77
77
  width: "40px",
78
78
  alignItems: "center",
79
79
  textAlign: "right",
@@ -126,5 +126,5 @@ export default function HSliderDetailsMobile(props) {
126
126
  '& .MuiSlider-thumb:hover': {
127
127
  boxShadow: 'none',
128
128
  }
129
- }, size: "small", value: props.sharpnessScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onSharpnessChange(newValue) })] }) }));
129
+ }, size: "small", value: props.sharpnessScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onSharpnessChange(newValue), onDoubleClick: () => props.onSharpnessChange(0) })] }) }));
130
130
  }
@@ -74,7 +74,7 @@ export default function HSliderLightMobile(props) {
74
74
  '& .MuiSlider-thumb:hover': {
75
75
  boxShadow: 'none',
76
76
  }
77
- }, size: "small", value: props.exposureScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onExposureChange(newValue) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Contrast" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.contrastScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onContrastChange), sx: {
77
+ }, size: "small", value: props.exposureScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onExposureChange(newValue), onDoubleClick: () => props.onExposureChange(0) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Contrast" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.contrastScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onContrastChange), sx: {
78
78
  width: "40px",
79
79
  alignItems: "center",
80
80
  textAlign: "right",
@@ -128,7 +128,7 @@ export default function HSliderLightMobile(props) {
128
128
  '& .MuiSlider-thumb:hover': {
129
129
  boxShadow: 'none',
130
130
  }
131
- }, size: "small", value: props.contrastScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onContrastChange(newValue) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Highlights" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.highlightsScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onHighlightsChange), sx: {
131
+ }, size: "small", value: props.contrastScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onContrastChange(newValue), onDoubleClick: () => props.onContrastChange(0) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Highlights" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.highlightsScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onHighlightsChange), sx: {
132
132
  width: "40px",
133
133
  alignItems: "center",
134
134
  textAlign: "right",
@@ -182,7 +182,7 @@ export default function HSliderLightMobile(props) {
182
182
  '& .MuiSlider-thumb:hover': {
183
183
  boxShadow: 'none',
184
184
  }
185
- }, size: "small", value: props.highlightsScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onHighlightsChange(newValue) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Shadows" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.shadowScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onShadowsChange), sx: {
185
+ }, size: "small", value: props.highlightsScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onHighlightsChange(newValue), onDoubleClick: () => props.onHighlightsChange(0) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Shadows" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.shadowScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onShadowsChange), sx: {
186
186
  width: "40px",
187
187
  alignItems: "center",
188
188
  textAlign: "right",
@@ -236,7 +236,7 @@ export default function HSliderLightMobile(props) {
236
236
  '& .MuiSlider-thumb:hover': {
237
237
  boxShadow: 'none',
238
238
  }
239
- }, size: "small", value: props.shadowScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onShadowsChange(newValue) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Whites" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.whiteScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onWhitesChange), sx: {
239
+ }, size: "small", value: props.shadowScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onShadowsChange(newValue), onDoubleClick: () => props.onShadowsChange(0) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Whites" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.whiteScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onWhitesChange), sx: {
240
240
  width: "40px",
241
241
  alignItems: "center",
242
242
  textAlign: "right",
@@ -290,7 +290,7 @@ export default function HSliderLightMobile(props) {
290
290
  '& .MuiSlider-thumb:hover': {
291
291
  boxShadow: 'none',
292
292
  }
293
- }, size: "small", value: props.whiteScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onWhitesChange(newValue) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Blacks" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.blackScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onBlacksChange), sx: {
293
+ }, size: "small", value: props.whiteScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onWhitesChange(newValue), onDoubleClick: () => props.onWhitesChange(0) }), _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Blacks" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.blackScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onBlacksChange), sx: {
294
294
  width: "40px",
295
295
  alignItems: "center",
296
296
  textAlign: "right",
@@ -344,5 +344,5 @@ export default function HSliderLightMobile(props) {
344
344
  '& .MuiSlider-thumb:hover': {
345
345
  boxShadow: 'none',
346
346
  }
347
- }, size: "small", value: props.blackScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onBlacksChange(newValue) })] }) }));
347
+ }, size: "small", value: props.blackScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onBlacksChange(newValue), onDoubleClick: () => props.onBlacksChange(0) })] }) }));
348
348
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yogiswara/honcho-editor-ui",
3
- "version": "2.4.0",
3
+ "version": "2.4.1",
4
4
  "description": "A complete UI component library for the Honcho photo editor.",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",