@yogiswara/honcho-editor-ui 1.0.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.
Files changed (91) hide show
  1. package/dist/components/editor/HAccordionAspectRatio.d.ts +14 -0
  2. package/dist/components/editor/HAccordionAspectRatio.js +102 -0
  3. package/dist/components/editor/HAccordionColor.d.ts +12 -0
  4. package/dist/components/editor/HAccordionColor.js +234 -0
  5. package/dist/components/editor/HAccordionColorAdjustment.d.ts +31 -0
  6. package/dist/components/editor/HAccordionColorAdjustment.js +37 -0
  7. package/dist/components/editor/HAccordionDetails.d.ts +8 -0
  8. package/dist/components/editor/HAccordionDetails.js +133 -0
  9. package/dist/components/editor/HAccordionLight.d.ts +16 -0
  10. package/dist/components/editor/HAccordionLight.js +342 -0
  11. package/dist/components/editor/HAccordionPreset.d.ts +23 -0
  12. package/dist/components/editor/HAccordionPreset.js +59 -0
  13. package/dist/components/editor/HAlertBox.d.ts +7 -0
  14. package/dist/components/editor/HAlertBox.js +46 -0
  15. package/dist/components/editor/HAspectRatioMobile.d.ts +0 -0
  16. package/dist/components/editor/HAspectRatioMobile.js +1 -0
  17. package/dist/components/editor/HBulkAccordionColorAdjustment.d.ts +55 -0
  18. package/dist/components/editor/HBulkAccordionColorAdjustment.js +31 -0
  19. package/dist/components/editor/HBulkAccordionColorAdjustmentColors.d.ts +20 -0
  20. package/dist/components/editor/HBulkAccordionColorAdjustmentColors.js +121 -0
  21. package/dist/components/editor/HBulkAccordionColorAdjustmentDetails.d.ts +12 -0
  22. package/dist/components/editor/HBulkAccordionColorAdjustmentDetails.js +65 -0
  23. package/dist/components/editor/HBulkAccordionColorAdjustmentLight.d.ts +28 -0
  24. package/dist/components/editor/HBulkAccordionColorAdjustmentLight.js +177 -0
  25. package/dist/components/editor/HBulkColorAdjustmentMobile.d.ts +53 -0
  26. package/dist/components/editor/HBulkColorAdjustmentMobile.js +16 -0
  27. package/dist/components/editor/HBulkColorMobile.d.ts +20 -0
  28. package/dist/components/editor/HBulkColorMobile.js +121 -0
  29. package/dist/components/editor/HBulkDetailsMobile.d.ts +12 -0
  30. package/dist/components/editor/HBulkDetailsMobile.js +65 -0
  31. package/dist/components/editor/HBulkLightMobile.d.ts +28 -0
  32. package/dist/components/editor/HBulkLightMobile.js +192 -0
  33. package/dist/components/editor/HBulkPreset.d.ts +24 -0
  34. package/dist/components/editor/HBulkPreset.js +33 -0
  35. package/dist/components/editor/HBulkPresetMobile.d.ts +15 -0
  36. package/dist/components/editor/HBulkPresetMobile.js +26 -0
  37. package/dist/components/editor/HDialogBox.d.ts +18 -0
  38. package/dist/components/editor/HDialogBox.js +51 -0
  39. package/dist/components/editor/HDialogCopy.d.ts +40 -0
  40. package/dist/components/editor/HDialogCopy.js +80 -0
  41. package/dist/components/editor/HFooter.d.ts +12 -0
  42. package/dist/components/editor/HFooter.js +24 -0
  43. package/dist/components/editor/HHeaderEditor.d.ts +17 -0
  44. package/dist/components/editor/HHeaderEditor.js +27 -0
  45. package/dist/components/editor/HImageEditorBulkDekstop.d.ts +15 -0
  46. package/dist/components/editor/HImageEditorBulkDekstop.js +26 -0
  47. package/dist/components/editor/HImageEditorBulkMobile.d.ts +72 -0
  48. package/dist/components/editor/HImageEditorBulkMobile.js +81 -0
  49. package/dist/components/editor/HImageEditorDekstop.d.ts +15 -0
  50. package/dist/components/editor/HImageEditorDekstop.js +29 -0
  51. package/dist/components/editor/HImageEditorMobile.d.ts +47 -0
  52. package/dist/components/editor/HImageEditorMobile.js +91 -0
  53. package/dist/components/editor/HImageEditorMobileLayout.d.ts +14 -0
  54. package/dist/components/editor/HImageEditorMobileLayout.js +57 -0
  55. package/dist/components/editor/HImageEditorPage.d.ts +1 -0
  56. package/dist/components/editor/HImageEditorPage.js +187 -0
  57. package/dist/components/editor/HModalEditorDekstop.d.ts +13 -0
  58. package/dist/components/editor/HModalEditorDekstop.js +22 -0
  59. package/dist/components/editor/HModalMobile.d.ts +12 -0
  60. package/dist/components/editor/HModalMobile.js +7 -0
  61. package/dist/components/editor/HPresetOptionMenu.d.ts +11 -0
  62. package/dist/components/editor/HPresetOptionMenu.js +20 -0
  63. package/dist/components/editor/HSliderColorMobile.d.ts +12 -0
  64. package/dist/components/editor/HSliderColorMobile.js +222 -0
  65. package/dist/components/editor/HSliderDetailsMobile.d.ts +8 -0
  66. package/dist/components/editor/HSliderDetailsMobile.js +130 -0
  67. package/dist/components/editor/HSliderLightMobile.d.ts +16 -0
  68. package/dist/components/editor/HSliderLightMobile.js +342 -0
  69. package/dist/components/editor/HTabAspectRatioMobile.d.ts +0 -0
  70. package/dist/components/editor/HTabAspectRatioMobile.js +1 -0
  71. package/dist/components/editor/HTabColorAdjustmentMobile.d.ts +29 -0
  72. package/dist/components/editor/HTabColorAdjustmentMobile.js +16 -0
  73. package/dist/components/editor/HTabPresetMobile.d.ts +14 -0
  74. package/dist/components/editor/HTabPresetMobile.js +10 -0
  75. package/dist/components/editor/HTextField.d.ts +14 -0
  76. package/dist/components/editor/HTextField.js +51 -0
  77. package/dist/components/editor/HWatermarkView.d.ts +6 -0
  78. package/dist/components/editor/HWatermarkView.js +16 -0
  79. package/dist/hooks/editor/useHonchoEditor.d.ts +272 -0
  80. package/dist/hooks/editor/useHonchoEditor.js +1203 -0
  81. package/dist/index.d.ts +23 -0
  82. package/dist/index.js +23 -0
  83. package/dist/lib/editor/honcho-editor.d.ts +324 -0
  84. package/dist/lib/editor/honcho-editor.js +825 -0
  85. package/dist/themes/colors.d.ts +12 -0
  86. package/dist/themes/colors.js +12 -0
  87. package/dist/themes/honchoTheme.d.ts +25 -0
  88. package/dist/themes/honchoTheme.js +94 -0
  89. package/dist/utils/isMobile.d.ts +1 -0
  90. package/dist/utils/isMobile.js +5 -0
  91. package/package.json +41 -0
package/dist/components/editor/HSliderColorMobile.js ADDED
@@ -0,0 +1,222 @@
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import { Stack, Slider, Typography, TextField } from "@mui/material";
3
+ import useHonchoTypography from "@/honchoTheme";
4
+ import useColors from "@/colors";
5
+ export default function HSliderColorMobile(props) {
6
+ const typography = useHonchoTypography();
7
+ const colors = useColors();
8
+ const blueScale = '#292bc0'; // Blue color on left
9
+ const yellowScale = '#dfdc28'; // Yellow color on right
10
+ const greenScale = '#00ff04';
11
+ const purpleScale = '#b700ff';
12
+ // The gradient for the *entire* background of the slider bar
13
+ const tempGradient = `linear-gradient(to right, ${blueScale} 35%, ${yellowScale} 75%)`;
14
+ const tintGradient = `linear-gradient(to right, ${greenScale} 20%, ${purpleScale} 75%)`;
15
+ const saturationColors = ['yellow', 'lime', 'deepskyblue', 'magenta', 'red'];
16
+ const greyScaleStart = '#000000'; // Black at -100
17
+ const greyScaleEnd = '#ffffff'; // White at 0 (or a very light grey)
18
+ const colorStops = saturationColors.map((color, index) => {
19
+ const position = 50 + (index / (saturationColors.length - 1)) * 50;
20
+ return `${color} ${position}%`;
21
+ }).join(', ');
22
+ // The gradient for the *entire* background of the slider bar
23
+ const fullTrackGradient = `linear-gradient(to right, ${greyScaleStart} 0%, ${greyScaleEnd} 50%, ${colorStops})`;
24
+ const focusedInputStyle = {
25
+ backgroundColor: "#1C1B1FB2",
26
+ borderRadius: '5px 5px 0px 0px',
27
+ borderBottom: 'none',
28
+ pl: '2px',
29
+ };
30
+ const formatValue = (value) => {
31
+ if (value > 0)
32
+ return `+${value}`;
33
+ return value.toString();
34
+ };
35
+ const handleInputChange = (event, min, max, onChange) => {
36
+ const value = event.target.value;
37
+ if (value === '+' || value === '-')
38
+ return;
39
+ let numericValue = parseInt(value, 10);
40
+ if (isNaN(numericValue))
41
+ numericValue = 0;
42
+ const clampedValue = Math.max(min, Math.min(max, numericValue));
43
+ onChange(clampedValue);
44
+ };
45
+ return (_jsx(_Fragment, { children: _jsxs(Stack, { spacing: 0, direction: "column", sx: { width: '100%', paddingX: 1, m: "0px" }, children: [_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: "Temperature" }), _jsx(TextField, { hiddenLabel: true, id: "temperature-input", value: formatValue(props.tempScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onTempChange), sx: {
46
+ width: "40px",
47
+ alignItems: "center",
48
+ textAlign: "right",
49
+ pr: "4px",
50
+ display: "flex",
51
+ '& .MuiFilledInput-root': {
52
+ backgroundColor: 'transparent',
53
+ borderRadius: "0px",
54
+ border: 'none',
55
+ '&:before': {
56
+ borderBottom: 'none',
57
+ },
58
+ '&:after': {
59
+ borderBottom: 'none',
60
+ },
61
+ '&:hover:not(.Mui-disabled):before': {
62
+ borderBottom: 'none',
63
+ },
64
+ '&.Mui-focused:after': {
65
+ borderBottom: 'none',
66
+ },
67
+ },
68
+ '& .MuiFilledInput-input': {
69
+ textAlign: 'right',
70
+ padding: 0,
71
+ pr: '4px',
72
+ color: colors.surface,
73
+ fontSize: "14px",
74
+ },
75
+ } })] }), _jsx(Slider, { sx: {
76
+ width: "100%",
77
+ color: colors.surface,
78
+ '& .MuiSlider-rail': {
79
+ background: tempGradient,
80
+ opacity: 1,
81
+ },
82
+ '& .MuiSlider-track': {
83
+ background: 'transparent',
84
+ border: 'none',
85
+ },
86
+ '& .MuiSlider-thumb': {
87
+ boxShadow: 'none',
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: {
90
+ width: "40px",
91
+ alignItems: "center",
92
+ textAlign: "right",
93
+ pr: "4px",
94
+ display: "flex",
95
+ '& .MuiFilledInput-root': {
96
+ backgroundColor: 'transparent',
97
+ borderRadius: "0px",
98
+ border: 'none',
99
+ '&:before': {
100
+ borderBottom: 'none',
101
+ },
102
+ '&:after': {
103
+ borderBottom: 'none',
104
+ },
105
+ '&:hover:not(.Mui-disabled):before': {
106
+ borderBottom: 'none',
107
+ },
108
+ '&.Mui-focused:after': {
109
+ borderBottom: 'none',
110
+ },
111
+ },
112
+ '& .MuiFilledInput-input': {
113
+ textAlign: 'right',
114
+ padding: 0,
115
+ pr: '4px',
116
+ color: colors.surface,
117
+ fontSize: "14px",
118
+ },
119
+ } })] }), _jsx(Slider, { sx: {
120
+ width: "100%",
121
+ color: colors.surface,
122
+ '& .MuiSlider-rail': {
123
+ background: tintGradient,
124
+ opacity: 1,
125
+ },
126
+ '& .MuiSlider-track': {
127
+ background: 'transparent',
128
+ border: 'none',
129
+ },
130
+ '& .MuiSlider-thumb': {
131
+ boxShadow: 'none',
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: {
134
+ width: "40px",
135
+ alignItems: "center",
136
+ textAlign: "right",
137
+ pr: "4px",
138
+ display: "flex",
139
+ '& .MuiFilledInput-root': {
140
+ backgroundColor: 'transparent',
141
+ borderRadius: "0px",
142
+ border: 'none',
143
+ '&:before': {
144
+ borderBottom: 'none',
145
+ },
146
+ '&:after': {
147
+ borderBottom: 'none',
148
+ },
149
+ '&:hover:not(.Mui-disabled):before': {
150
+ borderBottom: 'none',
151
+ },
152
+ '&.Mui-focused:after': {
153
+ borderBottom: 'none',
154
+ },
155
+ },
156
+ '& .MuiFilledInput-input': {
157
+ textAlign: 'right',
158
+ padding: 0,
159
+ pr: '4px',
160
+ color: colors.surface,
161
+ fontSize: "14px",
162
+ },
163
+ } })] }), _jsx(Slider, { sx: {
164
+ width: "100%",
165
+ color: colors.surface,
166
+ '& .MuiSlider-rail': {
167
+ background: fullTrackGradient,
168
+ opacity: 1,
169
+ },
170
+ '& .MuiSlider-track': {
171
+ background: 'transparent',
172
+ border: 'none',
173
+ },
174
+ '& .MuiSlider-thumb': {
175
+ boxShadow: 'none',
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: {
178
+ width: "40px",
179
+ alignItems: "center",
180
+ textAlign: "right",
181
+ pr: "4px",
182
+ display: "flex",
183
+ '& .MuiFilledInput-root': {
184
+ backgroundColor: 'transparent',
185
+ borderRadius: "0px",
186
+ border: 'none',
187
+ '&:before': {
188
+ borderBottom: 'none',
189
+ },
190
+ '&:after': {
191
+ borderBottom: 'none',
192
+ },
193
+ '&:hover:not(.Mui-disabled):before': {
194
+ borderBottom: 'none',
195
+ },
196
+ '&.Mui-focused:after': {
197
+ borderBottom: 'none',
198
+ },
199
+ },
200
+ '& .MuiFilledInput-input': {
201
+ textAlign: 'right',
202
+ padding: 0,
203
+ pr: '4px',
204
+ color: colors.surface,
205
+ fontSize: "14px",
206
+ },
207
+ } })] }), _jsx(Slider, { sx: {
208
+ width: "100%",
209
+ color: colors.surface,
210
+ '& .MuiSlider-rail': {
211
+ background: fullTrackGradient,
212
+ opacity: 1,
213
+ },
214
+ '& .MuiSlider-track': {
215
+ background: 'transparent',
216
+ border: 'none',
217
+ },
218
+ '& .MuiSlider-thumb': {
219
+ boxShadow: 'none',
220
+ }
221
+ }, size: "small", value: props.saturationScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onSaturationChange(newValue) })] }) }));
222
+ }
package/dist/components/editor/HSliderDetailsMobile.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ interface Props {
2
+ clarityScore: number;
3
+ sharpnessScore: number;
4
+ onClarityChange: (value: number) => void;
5
+ onSharpnessChange: (value: number) => void;
6
+ }
7
+ export default function HSliderDetailsMobile(props: Props): import("react/jsx-runtime").JSX.Element;
8
+ export {};
package/dist/components/editor/HSliderDetailsMobile.js ADDED
@@ -0,0 +1,130 @@
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import { Stack, Slider, Typography, TextField } from "@mui/material";
3
+ import useColors from "@/colors";
4
+ import useHonchoTypography from "@/honchoTheme";
5
+ export default function HSliderDetailsMobile(props) {
6
+ const typography = useHonchoTypography();
7
+ const colors = useColors();
8
+ const formatValue = (value) => {
9
+ if (value > 0)
10
+ return `+${value}`;
11
+ return value.toString();
12
+ };
13
+ const handleInputChange = (event, min, max, onChange) => {
14
+ const value = event.target.value;
15
+ if (value === '+' || value === '-')
16
+ return;
17
+ let numericValue = parseInt(value, 10);
18
+ if (isNaN(numericValue))
19
+ numericValue = 0;
20
+ const clampedValue = Math.max(min, Math.min(max, numericValue));
21
+ onChange(clampedValue);
22
+ };
23
+ return (_jsx(_Fragment, { children: _jsxs(Stack, { spacing: 0, direction: "column", sx: { width: '100%', paddingX: 1 }, children: [_jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", sx: { pt: '10px', pb: '0px' }, children: [_jsx(Typography, { sx: { ...typography.bodyMedium, color: colors.surface }, children: "Clarity" }), _jsx(TextField, { hiddenLabel: true, id: "filled-hidden-label-small", value: formatValue(props.clarityScore), variant: "filled", onChange: (e) => handleInputChange(e, -100, 100, props.onClarityChange), sx: {
24
+ width: "40px",
25
+ alignItems: "center",
26
+ textAlign: "right",
27
+ pr: "4px",
28
+ display: "flex",
29
+ '& .MuiFilledInput-root': {
30
+ backgroundColor: 'transparent',
31
+ borderRadius: "0px",
32
+ border: 'none',
33
+ '&:before': {
34
+ borderBottom: 'none',
35
+ },
36
+ '&:after': {
37
+ borderBottom: 'none',
38
+ },
39
+ '&:hover:not(.Mui-disabled):before': {
40
+ borderBottom: 'none',
41
+ },
42
+ '&.Mui-focused:after': {
43
+ borderBottom: 'none',
44
+ },
45
+ },
46
+ '& .MuiFilledInput-input': {
47
+ textAlign: 'right',
48
+ padding: 0,
49
+ pr: '4px',
50
+ color: colors.surface,
51
+ fontSize: "14px",
52
+ },
53
+ '& .Mui-focused': {
54
+ '& .MuiFilledInput-input': {
55
+ backgroundColor: "#1C1B1FB2",
56
+ textAlign: 'right',
57
+ borderRadius: '5px 5px 0px 0px',
58
+ borderBottom: 'none',
59
+ pl: '2px',
60
+ }
61
+ }
62
+ } })] }), _jsx(Slider, { sx: {
63
+ width: "100%",
64
+ color: colors.onSurfaceVariant,
65
+ '& .MuiSlider-rail': {
66
+ background: colors.onSurfaceVariant,
67
+ opacity: 1,
68
+ },
69
+ '& .MuiSlider-thumb': {
70
+ background: colors.surface,
71
+ opacity: 1,
72
+ },
73
+ '& .MuiSlider-thumb:hover': {
74
+ boxShadow: 'none',
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: {
77
+ width: "40px",
78
+ alignItems: "center",
79
+ textAlign: "right",
80
+ pr: "4px",
81
+ display: "flex",
82
+ '& .MuiFilledInput-root': {
83
+ backgroundColor: 'transparent',
84
+ borderRadius: "0px",
85
+ border: 'none',
86
+ '&:before': {
87
+ borderBottom: 'none',
88
+ },
89
+ '&:after': {
90
+ borderBottom: 'none',
91
+ },
92
+ '&:hover:not(.Mui-disabled):before': {
93
+ borderBottom: 'none',
94
+ },
95
+ '&.Mui-focused:after': {
96
+ borderBottom: 'none',
97
+ },
98
+ },
99
+ '& .MuiFilledInput-input': {
100
+ textAlign: 'right',
101
+ padding: 0,
102
+ pr: '4px',
103
+ color: colors.surface,
104
+ fontSize: "14px",
105
+ },
106
+ '& .Mui-focused': {
107
+ '& .MuiFilledInput-input': {
108
+ backgroundColor: "#1C1B1FB2",
109
+ textAlign: 'right',
110
+ borderRadius: '5px 5px 0px 0px',
111
+ borderBottom: 'none',
112
+ pl: '2px',
113
+ }
114
+ }
115
+ } })] }), _jsx(Slider, { sx: {
116
+ width: "100%",
117
+ color: colors.onSurfaceVariant,
118
+ '& .MuiSlider-rail': {
119
+ background: colors.onSurfaceVariant,
120
+ opacity: 1,
121
+ },
122
+ '& .MuiSlider-thumb': {
123
+ background: colors.surface,
124
+ opacity: 1,
125
+ },
126
+ '& .MuiSlider-thumb:hover': {
127
+ boxShadow: 'none',
128
+ }
129
+ }, size: "small", value: props.sharpnessScore, step: 1, min: -100, max: 100, onChange: (_event, newValue) => props.onSharpnessChange(newValue) })] }) }));
130
+ }
package/dist/components/editor/HSliderLightMobile.d.ts ADDED
@@ -0,0 +1,16 @@
1
+ interface Props {
2
+ exposureScore: number;
3
+ contrastScore: number;
4
+ highlightsScore: number;
5
+ shadowScore: number;
6
+ whiteScore: number;
7
+ blackScore: number;
8
+ onExposureChange: (value: number) => void;
9
+ onContrastChange: (value: number) => void;
10
+ onHighlightsChange: (value: number) => void;
11
+ onShadowsChange: (value: number) => void;
12
+ onWhitesChange: (value: number) => void;
13
+ onBlacksChange: (value: number) => void;
14
+ }
15
+ export default function HSliderLightMobile(props: Props): import("react/jsx-runtime").JSX.Element;
16
+ export {};