@codeleap/web 5.4.3 → 5.4.5
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/ActionIcon/types.d.ts +1 -1
- package/dist/components/Checkbox/index.js +14 -10
- package/dist/components/Checkbox/index.js.map +1 -1
- package/dist/components/Checkbox/types.d.ts +4 -2
- package/dist/components/DatePicker/components/DayContent.d.ts +11 -0
- package/dist/components/DatePicker/components/DayContent.js +43 -0
- package/dist/components/DatePicker/components/DayContent.js.map +1 -0
- package/dist/components/DatePicker/components/OuterInput.js +2 -2
- package/dist/components/DatePicker/components/OuterInput.js.map +1 -1
- package/dist/components/DatePicker/components/YearContent.d.ts +9 -0
- package/dist/components/DatePicker/components/YearContent.js +33 -0
- package/dist/components/DatePicker/components/YearContent.js.map +1 -0
- package/dist/components/DatePicker/components/index.d.ts +2 -0
- package/dist/components/DatePicker/components/index.js +2 -0
- package/dist/components/DatePicker/components/index.js.map +1 -1
- package/dist/components/DatePicker/index.js +10 -33
- package/dist/components/DatePicker/index.js.map +1 -1
- package/dist/components/DatePicker/types.d.ts +5 -6
- package/dist/components/InputBase/index.d.ts +2 -5
- package/dist/components/InputBase/index.js +19 -11
- package/dist/components/InputBase/index.js.map +1 -1
- package/dist/components/InputBase/types.d.ts +2 -1
- package/dist/components/InputBase/useInputBase.d.ts +60 -0
- package/dist/components/InputBase/useInputBase.js +55 -0
- package/dist/components/InputBase/useInputBase.js.map +1 -0
- package/dist/components/InputBase/useInputBasePartialStyles.d.ts +2 -0
- package/dist/components/InputBase/useInputBasePartialStyles.js +40 -0
- package/dist/components/InputBase/useInputBasePartialStyles.js.map +1 -0
- package/dist/components/Modal/index.d.ts +0 -3
- package/dist/components/Modal/index.js +35 -52
- package/dist/components/Modal/index.js.map +1 -1
- package/dist/components/Modal/types.d.ts +0 -4
- package/dist/components/NumberIncrement/index.js +18 -124
- package/dist/components/NumberIncrement/index.js.map +1 -1
- package/dist/components/NumberIncrement/types.d.ts +5 -6
- package/dist/components/NumberIncrement/useNumberIncrement.d.ts +60 -0
- package/dist/components/NumberIncrement/useNumberIncrement.js +115 -0
- package/dist/components/NumberIncrement/useNumberIncrement.js.map +1 -0
- package/dist/components/RadioInput/index.js +14 -14
- package/dist/components/RadioInput/index.js.map +1 -1
- package/dist/components/RadioInput/types.d.ts +9 -9
- package/dist/components/SearchInput/index.js +1 -1
- package/dist/components/SearchInput/index.js.map +1 -1
- package/dist/components/Select/index.js +5 -7
- package/dist/components/Select/index.js.map +1 -1
- package/dist/components/Select/styles.d.ts +2 -8
- package/dist/components/Select/styles.js.map +1 -1
- package/dist/components/Select/types.d.ts +10 -9
- package/dist/components/Slider/index.js +16 -46
- package/dist/components/Slider/index.js.map +1 -1
- package/dist/components/Slider/types.d.ts +4 -2
- package/dist/components/Switch/index.js +13 -11
- package/dist/components/Switch/index.js.map +1 -1
- package/dist/components/Switch/types.d.ts +4 -2
- package/dist/components/TextEditor/index.js +7 -14
- package/dist/components/TextEditor/index.js.map +1 -1
- package/dist/components/TextEditor/types.d.ts +2 -3
- package/dist/components/TextInput/index.js +31 -92
- package/dist/components/TextInput/index.js.map +1 -1
- package/dist/components/TextInput/types.d.ts +8 -7
- package/dist/components/TextInput/useTextInput.d.ts +90 -0
- package/dist/components/TextInput/useTextInput.js +74 -0
- package/dist/components/TextInput/useTextInput.js.map +1 -0
- package/dist/lib/tools/index.d.ts +0 -1
- package/dist/lib/tools/index.js +0 -1
- package/dist/lib/tools/index.js.map +1 -1
- package/dist/lib/tools/modal.d.ts +2 -2
- package/dist/lib/tools/modal.js +5 -4
- package/dist/lib/tools/modal.js.map +1 -1
- package/dist/types/utility.d.ts +1 -1
- package/package.json +17 -19
- package/package.json.bak +1 -3
- package/src/components/ActionIcon/types.ts +1 -1
- package/src/components/Checkbox/index.tsx +23 -9
- package/src/components/Checkbox/types.ts +4 -2
- package/src/components/DatePicker/components/DayContent.tsx +52 -0
- package/src/components/DatePicker/components/OuterInput.tsx +1 -2
- package/src/components/DatePicker/components/YearContent.tsx +39 -0
- package/src/components/DatePicker/components/index.tsx +2 -0
- package/src/components/DatePicker/index.tsx +33 -84
- package/src/components/DatePicker/types.ts +5 -6
- package/src/components/InputBase/index.tsx +9 -8
- package/src/components/InputBase/types.ts +2 -1
- package/src/components/InputBase/useInputBase.ts +56 -0
- package/src/components/InputBase/useInputBasePartialStyles.ts +37 -0
- package/src/components/Modal/index.tsx +64 -64
- package/src/components/Modal/types.ts +0 -4
- package/src/components/NumberIncrement/index.tsx +44 -141
- package/src/components/NumberIncrement/types.ts +5 -6
- package/src/components/NumberIncrement/useNumberIncrement.ts +149 -0
- package/src/components/RadioInput/index.tsx +32 -17
- package/src/components/RadioInput/types.ts +16 -15
- package/src/components/SearchInput/index.tsx +1 -1
- package/src/components/Select/index.tsx +6 -11
- package/src/components/Select/styles.ts +2 -2
- package/src/components/Select/types.ts +10 -9
- package/src/components/Slider/index.tsx +28 -52
- package/src/components/Slider/types.ts +4 -2
- package/src/components/Switch/index.tsx +19 -8
- package/src/components/Switch/types.ts +4 -2
- package/src/components/TextEditor/index.tsx +6 -14
- package/src/components/TextEditor/types.ts +2 -3
- package/src/components/TextInput/index.tsx +54 -103
- package/src/components/TextInput/types.ts +8 -7
- package/src/components/TextInput/useTextInput.ts +101 -0
- package/src/lib/tools/index.ts +0 -1
- package/src/lib/tools/modal.ts +3 -3
- package/src/types/utility.ts +1 -1
- package/dist/lib/tools/navigation/index.d.ts +0 -58
- package/dist/lib/tools/navigation/index.js +0 -235
- package/dist/lib/tools/navigation/index.js.map +0 -1
- package/dist/lib/tools/navigation/types.d.ts +0 -32
- package/dist/lib/tools/navigation/types.js +0 -3
- package/dist/lib/tools/navigation/types.js.map +0 -1
- package/src/lib/tools/navigation/index.tsx +0 -282
- package/src/lib/tools/navigation/types.ts +0 -53
|
@@ -60,6 +60,9 @@ var react_slider_1 = require("@radix-ui/react-slider");
|
|
|
60
60
|
var useStylesFor_1 = require("../../lib/hooks/useStylesFor");
|
|
61
61
|
var styles_1 = require("@codeleap/styles");
|
|
62
62
|
var WebStyleRegistry_1 = require("../../lib/WebStyleRegistry");
|
|
63
|
+
var useInputBase_1 = require("../InputBase/useInputBase");
|
|
64
|
+
var form_1 = require("@codeleap/form");
|
|
65
|
+
var useInputBasePartialStyles_1 = require("../InputBase/useInputBasePartialStyles");
|
|
63
66
|
__exportStar(require("./styles"), exports);
|
|
64
67
|
__exportStar(require("./types"), exports);
|
|
65
68
|
var DefaultSliderTrackMark = function (props) {
|
|
@@ -71,10 +74,11 @@ var DefaultSliderTrackMark = function (props) {
|
|
|
71
74
|
};
|
|
72
75
|
var Slider = function (props) {
|
|
73
76
|
var _a = (0, InputBase_1.selectInputBaseProps)(__assign(__assign({}, exports.Slider.defaultProps), props)), inputBaseProps = _a.inputBaseProps, others = _a.others;
|
|
74
|
-
var onValueChange = others.onValueChange, onValueCommit = others.onValueCommit, _value = others.value, label = others.label, debugName = others.debugName, style = others.style, disabled = others.disabled, trackMarks = others.trackMarks, _b = others.trackMarkComponent, SliderTrackMark = _b === void 0 ? DefaultSliderTrackMark : _b, max = others.max, min = others.min, defaultSliderValue = others.defaultValue, indicatorLabel = others.indicatorLabel, description = others.description, minStepsBetweenThumbs = others.minStepsBetweenThumbs, step = others.step, onPressThumbSetValue = others.onPressThumbSetValue, onPressThumb = others.onPressThumb, sliderProps = __rest(others, ["onValueChange", "onValueCommit", "value", "label", "debugName", "style", "disabled", "trackMarks", "trackMarkComponent", "max", "min", "defaultValue", "indicatorLabel", "description", "minStepsBetweenThumbs", "step", "onPressThumbSetValue", "onPressThumb"]);
|
|
77
|
+
var onValueChange = others.onValueChange, onValueCommit = others.onValueCommit, _value = others.value, field = others.field, label = others.label, debugName = others.debugName, style = others.style, disabled = others.disabled, trackMarks = others.trackMarks, _b = others.trackMarkComponent, SliderTrackMark = _b === void 0 ? DefaultSliderTrackMark : _b, max = others.max, min = others.min, defaultSliderValue = others.defaultValue, indicatorLabel = others.indicatorLabel, description = others.description, minStepsBetweenThumbs = others.minStepsBetweenThumbs, step = others.step, onPressThumbSetValue = others.onPressThumbSetValue, onPressThumb = others.onPressThumb, sliderProps = __rest(others, ["onValueChange", "onValueCommit", "value", "field", "label", "debugName", "style", "disabled", "trackMarks", "trackMarkComponent", "max", "min", "defaultValue", "indicatorLabel", "description", "minStepsBetweenThumbs", "step", "onPressThumbSetValue", "onPressThumb"]);
|
|
75
78
|
var styles = (0, useStylesFor_1.useStylesFor)(exports.Slider.styleRegistryName, style);
|
|
76
|
-
var
|
|
77
|
-
var
|
|
79
|
+
var _c = (0, useInputBase_1.useInputBase)(field, form_1.fields.number, { value: _value, onValueChange: onValueChange }), wrapperRef = _c.wrapperRef, inputValue = _c.inputValue, onInputValueChange = _c.onInputValueChange;
|
|
80
|
+
var isUniqueValue = !types_1.TypeGuards.isArray(inputValue);
|
|
81
|
+
var value = isUniqueValue ? [inputValue] : inputValue;
|
|
78
82
|
var _defaultValue = types_1.TypeGuards.isArray(defaultSliderValue) ? defaultSliderValue : [defaultSliderValue];
|
|
79
83
|
var defaultValueRef = (0, hooks_1.useRef)(_defaultValue);
|
|
80
84
|
var defaultValue = defaultValueRef.current;
|
|
@@ -84,37 +88,11 @@ var Slider = function (props) {
|
|
|
84
88
|
}
|
|
85
89
|
});
|
|
86
90
|
var handleChange = function (newValue) {
|
|
87
|
-
|
|
91
|
+
onInputValueChange === null || onInputValueChange === void 0 ? void 0 : onInputValueChange(isUniqueValue ? newValue === null || newValue === void 0 ? void 0 : newValue[0] : newValue);
|
|
88
92
|
};
|
|
89
93
|
var handleValueCommit = function (newValue) {
|
|
90
94
|
onValueCommit === null || onValueCommit === void 0 ? void 0 : onValueCommit(newValue);
|
|
91
95
|
};
|
|
92
|
-
var thumbStyle = react_1.default.useMemo(function () {
|
|
93
|
-
return (0, styles_1.mergeStyles)([
|
|
94
|
-
styles.thumb,
|
|
95
|
-
disabled && styles['thumb:disabled'],
|
|
96
|
-
]);
|
|
97
|
-
}, []);
|
|
98
|
-
var trackStyle = react_1.default.useMemo(function () {
|
|
99
|
-
return (0, styles_1.mergeStyles)([
|
|
100
|
-
styles.track,
|
|
101
|
-
disabled && styles['track:disabled'],
|
|
102
|
-
styles.unselectedTrack,
|
|
103
|
-
disabled && styles['unselectedTrack:disabled'],
|
|
104
|
-
]);
|
|
105
|
-
}, [disabled]);
|
|
106
|
-
var selectedTrackStyle = react_1.default.useMemo(function () {
|
|
107
|
-
return (0, styles_1.mergeStyles)([
|
|
108
|
-
styles.selectedTrack,
|
|
109
|
-
disabled && styles['selectedTrack:disabled'],
|
|
110
|
-
]);
|
|
111
|
-
}, [disabled]);
|
|
112
|
-
var containerStyle = react_1.default.useMemo(function () {
|
|
113
|
-
return (0, styles_1.mergeStyles)([
|
|
114
|
-
styles.sliderContainer,
|
|
115
|
-
disabled && styles['sliderContainer:disabled'],
|
|
116
|
-
]);
|
|
117
|
-
}, [disabled]);
|
|
118
96
|
var trackMarksHaveContent = !(types_1.TypeGuards.isArray(trackMarks) || types_1.TypeGuards.isNil(trackMarks));
|
|
119
97
|
var trackMarksProp = react_1.default.useMemo(function () {
|
|
120
98
|
if (!trackMarksHaveContent) {
|
|
@@ -122,18 +100,10 @@ var Slider = function (props) {
|
|
|
122
100
|
}
|
|
123
101
|
return Object.keys(trackMarks).map(function (key) { return Number(key); });
|
|
124
102
|
}, [trackMarksHaveContent]);
|
|
125
|
-
var
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
]);
|
|
130
|
-
}, [disabled]);
|
|
131
|
-
var trackMarkWrapperStyle = react_1.default.useMemo(function () {
|
|
132
|
-
return (0, styles_1.mergeStyles)([
|
|
133
|
-
styles.trackMarkWrapper,
|
|
134
|
-
disabled && styles['trackMarkWrapper:disabled'],
|
|
135
|
-
]);
|
|
136
|
-
}, [disabled]);
|
|
103
|
+
var partialStyles = (0, useInputBasePartialStyles_1.useInputBasePartialStyles)(styles, ['thumb', 'track', 'selectedTrack', 'unselectedTrack', 'sliderContainer', 'trackMark', 'trackMarkWrapper'], { disabled: disabled });
|
|
104
|
+
var trackStyle = react_1.default.useMemo(function () {
|
|
105
|
+
return (0, styles_1.mergeStyles)([partialStyles === null || partialStyles === void 0 ? void 0 : partialStyles.track, partialStyles.unselectedTrack]);
|
|
106
|
+
}, [partialStyles === null || partialStyles === void 0 ? void 0 : partialStyles.track, partialStyles.unselectedTrack]);
|
|
137
107
|
var sliderLabel = react_1.default.useMemo(function () {
|
|
138
108
|
var _a;
|
|
139
109
|
if (types_1.TypeGuards.isNil(indicatorLabel) || !(indicatorLabel === null || indicatorLabel === void 0 ? void 0 : indicatorLabel.order) && !(indicatorLabel === null || indicatorLabel === void 0 ? void 0 : indicatorLabel.transformer)) {
|
|
@@ -158,13 +128,13 @@ var Slider = function (props) {
|
|
|
158
128
|
return description;
|
|
159
129
|
}
|
|
160
130
|
}, [value]);
|
|
161
|
-
return ((0, jsx_runtime_1.jsxs)(InputBase_1.InputBase, __assign({}, inputBaseProps, { disabled: disabled, style: styles, labelAsRow: true, description: sliderLabel }, { children: [(0, jsx_runtime_1.jsxs)(react_slider_1.Root, __assign({}, sliderProps, { step: step, min: min, max: max, disabled: disabled, defaultValue: defaultValue, onValueCommit: handleValueCommit, onValueChange: handleChange, style:
|
|
131
|
+
return ((0, jsx_runtime_1.jsxs)(InputBase_1.InputBase, __assign({}, inputBaseProps, { ref: wrapperRef, disabled: disabled, style: styles, labelAsRow: true, description: sliderLabel }, { children: [(0, jsx_runtime_1.jsxs)(react_slider_1.Root, __assign({}, sliderProps, { step: step, min: min, max: max, disabled: disabled, defaultValue: defaultValue, onValueCommit: handleValueCommit, onValueChange: handleChange, style: partialStyles === null || partialStyles === void 0 ? void 0 : partialStyles.sliderContainer, value: value, minStepsBetweenThumbs: minStepsBetweenThumbs }, { children: [(0, jsx_runtime_1.jsx)(react_slider_1.Track, __assign({ style: trackStyle }, { children: (0, jsx_runtime_1.jsx)(react_slider_1.Range, { style: partialStyles === null || partialStyles === void 0 ? void 0 : partialStyles.selectedTrack }) })), defaultValue.map(function (_, i) { return ((0, jsx_runtime_1.jsx)(react_slider_1.Thumb, { style: partialStyles === null || partialStyles === void 0 ? void 0 : partialStyles.thumb, onClick: function () {
|
|
162
132
|
if (onPressThumbSetValue)
|
|
163
|
-
|
|
133
|
+
onInputValueChange === null || onInputValueChange === void 0 ? void 0 : onInputValueChange(value);
|
|
164
134
|
if (types_1.TypeGuards.isFunction(onPressThumb))
|
|
165
135
|
onPressThumb === null || onPressThumb === void 0 ? void 0 : onPressThumb(value, i);
|
|
166
136
|
} }, i)); })] })), trackMarksProp ?
|
|
167
|
-
(0, jsx_runtime_1.jsx)(View_1.View, __assign({ style:
|
|
137
|
+
(0, jsx_runtime_1.jsx)(View_1.View, __assign({ style: partialStyles === null || partialStyles === void 0 ? void 0 : partialStyles.trackMarkWrapper }, { children: trackMarksProp.map(function (_, idx) {
|
|
168
138
|
var idxStyle = {};
|
|
169
139
|
var relativeValue = Number(trackMarksProp[idx]);
|
|
170
140
|
if (idx === 0) {
|
|
@@ -182,7 +152,7 @@ var Slider = function (props) {
|
|
|
182
152
|
transform: "translate(-50%, -50%)",
|
|
183
153
|
};
|
|
184
154
|
}
|
|
185
|
-
var style = (0, styles_1.mergeStyles)([
|
|
155
|
+
var style = (0, styles_1.mergeStyles)([partialStyles === null || partialStyles === void 0 ? void 0 : partialStyles.trackMark, idxStyle]);
|
|
186
156
|
if (!trackMarksHaveContent) {
|
|
187
157
|
return (0, jsx_runtime_1.jsx)(SliderTrackMark, { index: idx, style: style }, idx);
|
|
188
158
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Slider/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAAyB;AACzB,yCAA4C;AAC5C,yCAAiD;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Slider/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAAyB;AACzB,yCAA4C;AAC5C,yCAAiD;AACjD,gCAA8B;AAC9B,0CAA8D;AAC9D,gCAA8B;AAC9B,uDAM+B;AAE/B,6DAA2D;AAC3D,2CAAqF;AACrF,+DAA6D;AAC7D,0DAAwD;AACxD,uCAAuC;AACvC,oFAAkF;AAElF,2CAAwB;AACxB,0CAAuB;AAEvB,IAAM,sBAAsB,GAAG,UAAC,KAAqB;IAC3C,IAAA,KAAK,GAAK,KAAK,MAAV,CAAU;IAEvB,IAAI,CAAC,kBAAU,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE;QACvC,OAAO,uBAAC,eAAK,CAAC,QAAQ,cACnB,KAAK,CAAC,OAAO,GACC,CAAA;KAClB;IAED,OAAO,uBAAC,WAAI,IAAC,IAAI,EAAE,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,KAAK,GAAI,CAAA;AACpD,CAAC,CAAA;AAEM,IAAM,MAAM,GAAG,UAAC,KAAkB;IACjC,IAAA,KAGF,IAAA,gCAAoB,wBACnB,cAAM,CAAC,YAAY,GACnB,KAAK,EACR,EALA,cAAc,oBAAA,EACd,MAAM,YAIN,CAAA;IAGA,IAAA,aAAa,GAoBX,MAAM,cApBK,EACb,aAAa,GAmBX,MAAM,cAnBK,EACN,MAAM,GAkBX,MAAM,MAlBK,EACb,KAAK,GAiBH,MAAM,MAjBH,EACL,KAAK,GAgBH,MAAM,MAhBH,EACL,SAAS,GAeP,MAAM,UAfC,EACT,KAAK,GAcH,MAAM,MAdH,EACL,QAAQ,GAaN,MAAM,SAbA,EACR,UAAU,GAYR,MAAM,WAZE,EACV,KAWE,MAAM,mBAXoD,EAAxC,eAAe,mBAAG,sBAAsB,KAAA,EAC5D,GAAG,GAUD,MAAM,IAVL,EACH,GAAG,GASD,MAAM,IATL,EACW,kBAAkB,GAQ9B,MAAM,aARwB,EAChC,cAAc,GAOZ,MAAM,eAPM,EACd,WAAW,GAMT,MAAM,YANG,EACX,qBAAqB,GAKnB,MAAM,sBALa,EACrB,IAAI,GAIF,MAAM,KAJJ,EACJ,oBAAoB,GAGlB,MAAM,qBAHY,EACpB,YAAY,GAEV,MAAM,aAFI,EACT,WAAW,UACZ,MAAM,EArBJ,2QAqBL,CADe,CACN;IAEV,IAAM,MAAM,GAAG,IAAA,2BAAY,EAAC,cAAM,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAA;IAEtD,IAAA,KAIF,IAAA,2BAAY,EAAC,KAAK,EAAE,aAAM,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,aAAa,eAAA,EAAE,CAAC,EAHtE,UAAU,gBAAA,EACV,UAAU,gBAAA,EACV,kBAAkB,wBACoD,CAAA;IAExE,IAAM,aAAa,GAAG,CAAC,kBAAU,CAAC,OAAO,CAAC,UAAU,CAAC,CAAA;IACrD,IAAM,KAAK,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,UAAU,CAAA;IAEvD,IAAM,aAAa,GAAG,kBAAU,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAA;IAExG,IAAM,eAAe,GAAG,IAAA,cAAM,EAAuC,aAAa,CAAC,CAAA;IACnF,IAAM,YAAY,GAAG,eAAe,CAAC,OAAO,CAAA;IAE5C,IAAA,eAAO,EAAC;QACN,IAAI,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,MAAM,KAAI,CAAC,EAAE;YAC9B,eAAe,CAAC,OAAO,GAAG,KAAK,CAAA;SAChC;IACH,CAAC,CAAC,CAAA;IAEF,IAAM,YAAY,GAAiC,UAAC,QAAuB;QACzE,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAG,aAAa,CAAC,CAAC,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAA;IAChE,CAAC,CAAA;IAED,IAAM,iBAAiB,GAAG,UAAC,QAAuB;QAChD,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,QAAQ,CAAC,CAAA;IAC3B,CAAC,CAAA;IAED,IAAM,qBAAqB,GAAG,CAAC,CAAC,kBAAU,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,kBAAU,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAA;IAE/F,IAAM,cAAc,GAAG,eAAK,CAAC,OAAO,CAAC;QACnC,IAAI,CAAC,qBAAqB,EAAE;YAC1B,OAAO,UAAU,CAAA;SAClB;QACD,OAAO,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,UAAC,GAAG,IAAK,OAAA,MAAM,CAAC,GAAG,CAAC,EAAX,CAAW,CAAC,CAAA;IAC1D,CAAC,EAAE,CAAC,qBAAqB,CAAC,CAAC,CAAA;IAE3B,IAAM,aAAa,GAAG,IAAA,qDAAyB,EAC7C,MAAM,EACN,CAAC,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,WAAW,EAAE,kBAAkB,CAAC,EAC1G,EAAE,QAAQ,UAAA,EAAE,CACb,CAAA;IAED,IAAM,UAAU,GAAG,eAAK,CAAC,OAAO,CAAC;QAC/B,OAAO,IAAA,oBAAW,EAAC,CAAC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC,CAAA;IAC3E,CAAC,EAAE,CAAC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC,CAAA;IAEzD,IAAM,WAAW,GAAG,eAAK,CAAC,OAAO,CAAC;;QAChC,IAAI,kBAAU,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,KAAK,CAAA,IAAI,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,CAAA,EAAE;YAC9F,OAAO,WAAW,CAAA;SACnB;QAED,IAAI,kBAAU,CAAC,UAAU,CAAC,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,CAAC,EAAE;YACtD,IAAM,GAAG,GAAG,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,CAAC,KAAK,EAAE,YAAY,CAAC,CAAA;YAC5D,OAAO,GAAG,CAAA;SACX;aAAM,IAAI,kBAAU,CAAC,OAAO,CAAC,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,KAAK,CAAC,EAAE;YACpD,IAAI,KAAG,GAAG,EAAE,CAAA;YAEZ,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,KAAK,0CAAE,OAAO,CAAC,UAAC,GAAG,EAAE,CAAC;;gBACpC,IAAM,UAAU,GAAG,KAAK,CAAC,GAAG,CAAC,CAAA;gBAE7B,IAAI,kBAAU,CAAC,KAAK,CAAC,UAAU,CAAC;oBAAE,OAAM;gBAExC,KAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,UAAG,KAAG,SAAG,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,SAAS,mCAAI,KAAK,SAAG,UAAU,CAAE,CAAA;YACjG,CAAC,CAAC,CAAA;YAEF,OAAO,KAAG,CAAA;SACX;aAAM;YACL,OAAO,WAAW,CAAA;SACnB;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,OAAO,CACL,wBAAC,qBAAS,eACJ,cAAc,IAClB,GAAG,EAAE,UAAU,EACf,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,MAAM,EACb,UAAU,QACV,WAAW,EAAE,WAAW,iBAExB,wBAAC,mBAAe,eACV,WAAW,IACf,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,iBAAiB,EAChC,aAAa,EAAE,YAAY,EAC3B,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,eAAe,EACrC,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,iBAE5C,uBAAC,oBAAW,aAAC,KAAK,EAAE,UAAU,gBAC5B,uBAAC,oBAAW,IAAC,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,aAAa,GAAI,IACxC,EAEb,YAAY,CAAC,GAAG,CAAC,UAAC,CAAC,EAAE,CAAC,IAAK,OAAA,CAC1B,uBAAC,oBAAW,IAEV,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,EAC3B,OAAO,EAAE;4BACP,IAAI,oBAAoB;gCAAE,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAG,KAAK,CAAC,CAAA;4BACrD,IAAI,kBAAU,CAAC,UAAU,CAAC,YAAY,CAAC;gCAAE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAG,KAAK,EAAE,CAAC,CAAC,CAAA;wBACnE,CAAC,IALI,CAAC,CAMN,CACH,EAT2B,CAS3B,CAAC,KACc,EAEjB,cAAc,CAAC,CAAC;gBACf,uBAAC,WAAI,aAAC,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,gBAAgB,gBAExC,cAAc,CAAC,GAAG,CAAC,UAAC,CAAC,EAAE,GAAG;wBACxB,IAAI,QAAQ,GAAG,EAAE,CAAA;wBAEjB,IAAM,aAAa,GAAG,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAAA;wBAEjD,IAAI,GAAG,KAAK,CAAC,EAAE;4BACb,QAAQ,GAAG,MAAM,CAAC,cAAc,CAAA;yBACjC;6BAAM,IAAI,GAAG,KAAK,cAAc,CAAC,MAAM,GAAG,CAAC,EAAE;4BAC5C,QAAQ,GAAG,MAAM,CAAC,aAAa,CAAA;yBAChC;6BAAM;4BACL,IAAM,cAAc,GAAG,CAAC,aAAa,GAAG,GAAG,CAAC,GAAG,GAAG,CAAA;4BAElD,QAAQ,GAAG;gCACT,QAAQ,EAAE,UAAU;gCACpB,IAAI,EAAE,UAAG,cAAc,MAAG;gCAC1B,GAAG,EAAE,KAAK;gCACV,SAAS,EAAE,uBAAuB;6BACnC,CAAA;yBACF;wBAED,IAAM,KAAK,GAAG,IAAA,oBAAW,EAAC,CAAC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAA;wBAE/D,IAAI,CAAC,qBAAqB,EAAE;4BAC1B,OAAO,uBAAC,eAAe,IACrB,KAAK,EAAE,GAAG,EACV,KAAK,EAAE,KAAK,IACP,GAAG,CACR,CAAA;yBACH;wBAED,IAAM,OAAO,GAAG,UAAU,CAAC,aAAa,CAAC,CAAA;wBAEzC,OAAO,CACL,uBAAC,eAAe,IACd,KAAK,EAAE,GAAG,EACV,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,IACP,GAAG,CACR,CACH,CAAA;oBACH,CAAC,CAAC,IAEC;gBACP,CAAC,CAAC,IAAI,KACE,CACb,CAAA;AACH,CAAC,CAAA;AAjMY,QAAA,MAAM,UAiMlB;AAED,cAAM,CAAC,iBAAiB,GAAG,QAAQ,CAAA;AAEnC,cAAM,CAAC,QAAQ,mCACV,qBAAS,CAAC,QAAQ;IACrB,OAAO;IACP,OAAO;IACP,eAAe;IACf,iBAAiB;IACjB,WAAW;IACX,gBAAgB;IAChB,eAAe;IACf,kBAAkB;IAClB,iBAAiB;SAClB,CAAA;AAED,cAAM,CAAC,WAAW,GAAG,SAAS,CAAA;AAE9B,cAAM,CAAC,gBAAgB,GAAG,UAAsB,MAAS;IACvD,OAAO,cAA2E,CAAA;AACpF,CAAC,CAAA;AAED,cAAM,CAAC,YAAY,GAAG;IACpB,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,CAAC;IACN,qBAAqB,EAAE,CAAC;IACxB,YAAY,EAAE,EAAE;IAChB,cAAc,EAAE,IAAI;IACpB,WAAW,EAAE,IAAI;IACjB,IAAI,EAAE,CAAC;IACP,oBAAoB,EAAE,KAAK;IAC3B,YAAY,EAAE,IAAI;CACK,CAAA;AAEzB,mCAAgB,CAAC,iBAAiB,CAAC,cAAM,CAAC,CAAA"}
|
|
@@ -3,14 +3,16 @@ import { InputBaseProps } from '../InputBase';
|
|
|
3
3
|
import { SliderComposition } from './styles';
|
|
4
4
|
import { SliderProps as PrimitiveSliderProps } from '@radix-ui/react-slider';
|
|
5
5
|
import { CSSProperties } from 'react';
|
|
6
|
+
import { NumberField } from '@codeleap/form';
|
|
6
7
|
export type SliderProps = Partial<Omit<PrimitiveSliderProps, 'value' | 'onValueChange' | 'style'>> & Pick<InputBaseProps, 'disabled' | 'debugName' | 'description' | 'label'> & {
|
|
7
8
|
indicatorLabel?: {
|
|
8
9
|
order?: number[];
|
|
9
10
|
separator?: string;
|
|
10
11
|
transformer?: (value: number[], defaultValue: PrimitiveSliderProps['defaultValue']) => string;
|
|
11
12
|
};
|
|
12
|
-
|
|
13
|
-
|
|
13
|
+
field?: NumberField<any>;
|
|
14
|
+
value?: number | number[];
|
|
15
|
+
onValueChange?: (val: number | number[]) => void;
|
|
14
16
|
style?: StyledProp<SliderComposition>;
|
|
15
17
|
trackMarks?: Record<number, string>;
|
|
16
18
|
trackMarkComponent?: React.ComponentType<TrackMarkProps>;
|
|
@@ -42,14 +42,17 @@ var WebStyleRegistry_1 = require("../../lib/WebStyleRegistry");
|
|
|
42
42
|
var framer_motion_1 = require("framer-motion");
|
|
43
43
|
var styles_1 = require("@codeleap/styles");
|
|
44
44
|
var useStylesFor_1 = require("../../lib/hooks/useStylesFor");
|
|
45
|
+
var useInputBase_1 = require("../InputBase/useInputBase");
|
|
46
|
+
var form_1 = require("@codeleap/form");
|
|
45
47
|
__exportStar(require("./styles"), exports);
|
|
46
48
|
__exportStar(require("./types"), exports);
|
|
47
49
|
var reversedOrder = __spreadArray([], InputBase_1.InputBaseDefaultOrder, true).reverse();
|
|
48
50
|
var Switch = function (props) {
|
|
49
51
|
var _a;
|
|
50
52
|
var _b = (0, InputBase_1.selectInputBaseProps)(__assign(__assign({}, exports.Switch.defaultProps), props)), inputBaseProps = _b.inputBaseProps, switchProps = _b.others;
|
|
51
|
-
var style = switchProps.style, value = switchProps.value, disabled = switchProps.disabled, debugName = switchProps.debugName, onValueChange = switchProps.onValueChange, onChange = switchProps.onChange, switchOnLeft = switchProps.switchOnLeft;
|
|
53
|
+
var style = switchProps.style, value = switchProps.value, disabled = switchProps.disabled, debugName = switchProps.debugName, onValueChange = switchProps.onValueChange, onChange = switchProps.onChange, switchOnLeft = switchProps.switchOnLeft, field = switchProps.field;
|
|
52
54
|
var styles = (0, useStylesFor_1.useStylesFor)(exports.Switch.styleRegistryName, style);
|
|
55
|
+
var _c = (0, useInputBase_1.useInputBase)(field, form_1.fields.boolean, { value: value, onValueChange: onValueChange }), validation = _c.validation, wrapperRef = _c.wrapperRef, inputValue = _c.inputValue, onInputValueChange = _c.onInputValueChange;
|
|
53
56
|
var trackAnimation = (0, lib_1.useAnimatedVariantStyles)({
|
|
54
57
|
variantStyles: styles,
|
|
55
58
|
animatedProperties: ['track:off', 'track:disabled', 'track:on', 'track:disabled-on', 'track:disabled-off'],
|
|
@@ -57,12 +60,12 @@ var Switch = function (props) {
|
|
|
57
60
|
'worklet';
|
|
58
61
|
var disabledStyle = {};
|
|
59
62
|
if (disabled) {
|
|
60
|
-
disabledStyle =
|
|
63
|
+
disabledStyle = inputValue ? styles['track:disabled-on'] : styles['track:disabled-off'];
|
|
61
64
|
}
|
|
62
|
-
var style =
|
|
65
|
+
var style = inputValue ? styles['track:on'] : styles['track:off'];
|
|
63
66
|
return __assign(__assign({}, style), disabledStyle);
|
|
64
67
|
},
|
|
65
|
-
dependencies: [
|
|
68
|
+
dependencies: [inputValue, disabled],
|
|
66
69
|
});
|
|
67
70
|
var thumbAnimation = (0, lib_1.useAnimatedVariantStyles)({
|
|
68
71
|
variantStyles: styles,
|
|
@@ -71,12 +74,12 @@ var Switch = function (props) {
|
|
|
71
74
|
'worklet';
|
|
72
75
|
var disabledStyle = {};
|
|
73
76
|
if (disabled) {
|
|
74
|
-
disabledStyle =
|
|
77
|
+
disabledStyle = inputValue ? styles['thumb:disabled-on'] : styles['thumb:disabled-off'];
|
|
75
78
|
}
|
|
76
|
-
var style =
|
|
79
|
+
var style = inputValue ? styles['thumb:on'] : styles['thumb:off'];
|
|
77
80
|
return __assign(__assign({}, style), disabledStyle);
|
|
78
81
|
},
|
|
79
|
-
dependencies: [
|
|
82
|
+
dependencies: [inputValue, disabled],
|
|
80
83
|
});
|
|
81
84
|
// @ts-expect-error icss type
|
|
82
85
|
var _switchOnLeft = switchOnLeft !== null && switchOnLeft !== void 0 ? switchOnLeft : (_a = styles.__props) === null || _a === void 0 ? void 0 : _a.switchOnLeft;
|
|
@@ -86,13 +89,12 @@ var Switch = function (props) {
|
|
|
86
89
|
if (disabled)
|
|
87
90
|
return;
|
|
88
91
|
if ((e === null || e === void 0 ? void 0 : e.type) === 'click' || (e === null || e === void 0 ? void 0 : e.keyCode) === 13 || (e === null || e === void 0 ? void 0 : e.key) === 'Enter') {
|
|
89
|
-
|
|
90
|
-
onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(!value);
|
|
92
|
+
onInputValueChange === null || onInputValueChange === void 0 ? void 0 : onInputValueChange(!inputValue);
|
|
91
93
|
if (onChange)
|
|
92
|
-
onChange === null || onChange === void 0 ? void 0 : onChange(!
|
|
94
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(!inputValue);
|
|
93
95
|
}
|
|
94
96
|
};
|
|
95
|
-
return ((0, jsx_runtime_1.jsx)(InputBase_1.InputBase, __assign({}, inputBaseProps, { debugName: debugName, style: styles, order: _switchOnLeft ? reversedOrder : InputBase_1.InputBaseDefaultOrder, disabled: disabled, noError: true }, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, __assign({ style: trackStyles, initial: false, animate: trackAnimation, transition: styles['track:transition'], onClick: handleChange, onKeyDown: handleChange, tabIndex: 0 }, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { style: thumbStyles, initial: false, animate: thumbAnimation, transition: styles['thumb:transition'] }) })) })));
|
|
97
|
+
return ((0, jsx_runtime_1.jsx)(InputBase_1.InputBase, __assign({}, inputBaseProps, { ref: wrapperRef, debugName: debugName, style: styles, order: _switchOnLeft ? reversedOrder : InputBase_1.InputBaseDefaultOrder, disabled: disabled, noError: true }, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, __assign({ style: trackStyles, initial: false, animate: trackAnimation, transition: styles['track:transition'], onClick: handleChange, onKeyDown: handleChange, tabIndex: 0 }, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { style: thumbStyles, initial: false, animate: thumbAnimation, transition: styles['thumb:transition'] }) })) })));
|
|
96
98
|
};
|
|
97
99
|
exports.Switch = Switch;
|
|
98
100
|
exports.Switch.styleRegistryName = 'Switch';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Switch/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,0CAAqF;AACrF,iCAAoD;AACpD,+DAA6D;AAC7D,+CAAsC;AACtC,2CAAqF;AACrF,6DAA2D;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Switch/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { StyledProp } from '@codeleap/styles';
|
|
2
2
|
import { InputBaseProps } from '../InputBase';
|
|
3
3
|
import { SwitchComposition } from './styles';
|
|
4
|
+
import { BooleanField } from '@codeleap/form';
|
|
4
5
|
export type SwitchProps = Pick<InputBaseProps, 'debugName' | 'disabled' | 'label'> & {
|
|
5
6
|
style?: StyledProp<SwitchComposition>;
|
|
6
|
-
value: boolean;
|
|
7
|
-
onValueChange: (value: boolean) => void;
|
|
8
7
|
onChange?: (value: boolean) => void;
|
|
9
8
|
switchOnLeft?: boolean;
|
|
9
|
+
field?: BooleanField<any>;
|
|
10
|
+
value?: boolean;
|
|
11
|
+
onValueChange?: (value: boolean) => void;
|
|
10
12
|
};
|
|
@@ -32,30 +32,23 @@ exports.TextEditor = void 0;
|
|
|
32
32
|
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
|
33
33
|
var react_1 = __importDefault(require("react"));
|
|
34
34
|
var hooks_1 = require("@codeleap/hooks");
|
|
35
|
-
var deprecated_1 = require("@codeleap/deprecated");
|
|
36
35
|
var react_2 = require("@tiptap/react");
|
|
37
36
|
var components_1 = require("../components");
|
|
38
37
|
var useStylesFor_1 = require("../../lib/hooks/useStylesFor");
|
|
39
38
|
var WebStyleRegistry_1 = require("../../lib/WebStyleRegistry");
|
|
39
|
+
var form_1 = require("@codeleap/form");
|
|
40
40
|
__exportStar(require("./styles"), exports);
|
|
41
41
|
__exportStar(require("./types"), exports);
|
|
42
42
|
var TextEditor = function (props) {
|
|
43
43
|
var _a, _b;
|
|
44
|
-
var _c = __assign(__assign({}, exports.TextEditor.defaultProps), props), children = _c.children, editor = _c.editor, style = _c.style, bubbleMenuProps = _c.bubbleMenuProps, floatingMenuProps = _c.floatingMenuProps, toolbarComponent = _c.toolbarComponent, fileInputRef = _c.fileInputRef,
|
|
44
|
+
var _c = __assign(__assign({}, exports.TextEditor.defaultProps), props), children = _c.children, editor = _c.editor, style = _c.style, bubbleMenuProps = _c.bubbleMenuProps, floatingMenuProps = _c.floatingMenuProps, toolbarComponent = _c.toolbarComponent, fileInputRef = _c.fileInputRef, validate = _c.validate;
|
|
45
45
|
var styles = (0, useStylesFor_1.useStylesFor)(exports.TextEditor.styleRegistryName, style);
|
|
46
|
-
var
|
|
47
|
-
var validation = (0, deprecated_1.useValidate)((_a = editor === null || editor === void 0 ? void 0 : editor.getText()) !== null && _a !== void 0 ? _a : '', validate);
|
|
48
|
-
var hasError = !validation.isValid || _error;
|
|
49
|
-
var errorMessage = validation.message || _error;
|
|
46
|
+
var validation = (0, form_1.useValidate)((_a = editor === null || editor === void 0 ? void 0 : editor.getText()) !== null && _a !== void 0 ? _a : '', validate);
|
|
50
47
|
var isDisabled = (_b = !(editor === null || editor === void 0 ? void 0 : editor.isEditable)) !== null && _b !== void 0 ? _b : null;
|
|
51
48
|
var handleBlur = react_1.default.useCallback(function () {
|
|
52
49
|
validation === null || validation === void 0 ? void 0 : validation.onInputBlurred();
|
|
53
|
-
setIsFocused(false);
|
|
54
50
|
}, [validation === null || validation === void 0 ? void 0 : validation.onInputBlurred]);
|
|
55
|
-
var handleFocus = react_1.default.useCallback(function () {
|
|
56
|
-
validation === null || validation === void 0 ? void 0 : validation.onInputFocused();
|
|
57
|
-
setIsFocused(true);
|
|
58
|
-
}, [validation === null || validation === void 0 ? void 0 : validation.onInputFocused]);
|
|
51
|
+
var handleFocus = react_1.default.useCallback(function () { }, []);
|
|
59
52
|
(0, hooks_1.onUpdate)(function () {
|
|
60
53
|
editor === null || editor === void 0 ? void 0 : editor.on('blur', handleBlur);
|
|
61
54
|
editor === null || editor === void 0 ? void 0 : editor.on('focus', handleFocus);
|
|
@@ -76,18 +69,18 @@ var TextEditor = function (props) {
|
|
|
76
69
|
}, [editor]);
|
|
77
70
|
var editorStyles = [
|
|
78
71
|
styles.editor,
|
|
79
|
-
|
|
72
|
+
(validation === null || validation === void 0 ? void 0 : validation.showError) && styles['editor:error'],
|
|
80
73
|
isDisabled && styles['editor:disabled'],
|
|
81
74
|
];
|
|
82
75
|
if (!editor)
|
|
83
76
|
return null;
|
|
84
77
|
return ((0, jsx_runtime_1.jsxs)(components_1.View, __assign({ style: [
|
|
85
78
|
styles.wrapper,
|
|
86
|
-
|
|
79
|
+
(validation === null || validation === void 0 ? void 0 : validation.showError) && styles['wrapper:error'],
|
|
87
80
|
{
|
|
88
81
|
'.tiptap': editorStyles,
|
|
89
82
|
},
|
|
90
|
-
] }, { children: [toolbarComponent, children, (0, jsx_runtime_1.jsx)(_BubbleMenu, {}), (0, jsx_runtime_1.jsx)(_FloatingMenu, {}), (0, jsx_runtime_1.jsx)(react_2.EditorContent, { editor: editor }),
|
|
83
|
+
] }, { children: [toolbarComponent, children, (0, jsx_runtime_1.jsx)(_BubbleMenu, {}), (0, jsx_runtime_1.jsx)(_FloatingMenu, {}), (0, jsx_runtime_1.jsx)(react_2.EditorContent, { editor: editor }), (validation === null || validation === void 0 ? void 0 : validation.showError) ? (0, jsx_runtime_1.jsx)(components_1.Text, { text: validation === null || validation === void 0 ? void 0 : validation.message, style: styles['errorMessage:error'] }) : null, (0, jsx_runtime_1.jsx)(components_1.FileInput, { ref: fileInputRef })] })));
|
|
91
84
|
};
|
|
92
85
|
exports.TextEditor = TextEditor;
|
|
93
86
|
exports.TextEditor.styleRegistryName = 'TextEditor';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/TextEditor/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAAyB;AACzB,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/TextEditor/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { RefObject } from 'react';
|
|
2
2
|
import { AnyFunction } from '@codeleap/types';
|
|
3
|
-
import { FormTypes, yup } from '@codeleap/deprecated';
|
|
4
3
|
import { StyledProp } from '@codeleap/styles';
|
|
5
4
|
import { BubbleMenuProps, Editor, FloatingMenuProps } from '@tiptap/react';
|
|
6
5
|
import { FileInputRef } from '../FileInput';
|
|
7
6
|
import { TextEditorComposition } from './styles';
|
|
7
|
+
import { Validator } from '@codeleap/form';
|
|
8
8
|
export type TextEditorProps = React.PropsWithChildren<{
|
|
9
9
|
editor: Editor & {
|
|
10
10
|
getText: AnyFunction;
|
|
@@ -21,6 +21,5 @@ export type TextEditorProps = React.PropsWithChildren<{
|
|
|
21
21
|
};
|
|
22
22
|
toolbarComponent?: JSX.Element;
|
|
23
23
|
fileInputRef?: RefObject<FileInputRef>;
|
|
24
|
-
|
|
25
|
-
validate?: FormTypes.ValidatorWithoutForm<string> | yup.Schema<string>;
|
|
24
|
+
validate?: Validator<string, any, any>;
|
|
26
25
|
}>;
|
|
@@ -21,18 +21,6 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
|
|
|
21
21
|
if (k2 === undefined) k2 = k;
|
|
22
22
|
o[k2] = m[k];
|
|
23
23
|
}));
|
|
24
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
25
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
26
|
-
}) : function(o, v) {
|
|
27
|
-
o["default"] = v;
|
|
28
|
-
});
|
|
29
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
30
|
-
if (mod && mod.__esModule) return mod;
|
|
31
|
-
var result = {};
|
|
32
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
33
|
-
__setModuleDefault(result, mod);
|
|
34
|
-
return result;
|
|
35
|
-
};
|
|
36
24
|
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
37
25
|
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
38
26
|
};
|
|
@@ -62,78 +50,54 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
62
50
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
63
51
|
exports.TextInput = void 0;
|
|
64
52
|
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
|
65
|
-
var hooks_1 = require("@codeleap/hooks");
|
|
66
53
|
var types_1 = require("@codeleap/types");
|
|
67
|
-
var
|
|
68
|
-
var react_1 = __importStar(require("react"));
|
|
54
|
+
var react_1 = require("react");
|
|
69
55
|
var react_autosize_textarea_1 = __importDefault(require("react-autosize-textarea"));
|
|
70
56
|
var react_input_mask_1 = __importDefault(require("react-input-mask"));
|
|
71
57
|
var Touchable_1 = require("../Touchable");
|
|
72
58
|
var InputBase_1 = require("../InputBase");
|
|
73
|
-
var mask_1 = require("./mask");
|
|
74
59
|
var test_1 = require("../../lib/utils/test");
|
|
75
60
|
var useStylesFor_1 = require("../../lib/hooks/useStylesFor");
|
|
76
61
|
var WebStyleRegistry_1 = require("../../lib/WebStyleRegistry");
|
|
62
|
+
var useTextInput_1 = require("./useTextInput");
|
|
63
|
+
var useInputBasePartialStyles_1 = require("../InputBase/useInputBasePartialStyles");
|
|
77
64
|
__exportStar(require("./types"), exports);
|
|
78
65
|
__exportStar(require("./styles"), exports);
|
|
79
66
|
__exportStar(require("./mask"), exports);
|
|
80
67
|
exports.TextInput = (0, react_1.forwardRef)(function (props, inputRef) {
|
|
81
68
|
var _a;
|
|
82
|
-
var _b, _c
|
|
83
|
-
var
|
|
84
|
-
var
|
|
85
|
-
var
|
|
69
|
+
var _b, _c;
|
|
70
|
+
var allProps = __assign(__assign({}, exports.TextInput.defaultProps), props);
|
|
71
|
+
var _d = (0, InputBase_1.selectInputBaseProps)(allProps), inputBaseProps = _d.inputBaseProps, others = _d.others;
|
|
72
|
+
var _e = others, style = _e.style, debugName = _e.debugName, visibilityToggle = _e.visibilityToggle, password = _e.password, onPress = _e.onPress, caretColor = _e.caretColor, visibleIcon = _e.visibleIcon, hiddenIcon = _e.hiddenIcon, focused = _e.focused, textInputProps = __rest(_e, ["style", "debugName", "visibilityToggle", "password", "onPress", "caretColor", "visibleIcon", "hiddenIcon", "focused"]);
|
|
86
73
|
var styles = (0, useStylesFor_1.useStylesFor)(exports.TextInput.styleRegistryName, style);
|
|
87
|
-
var
|
|
88
|
-
var isFocused =
|
|
89
|
-
var
|
|
90
|
-
var
|
|
91
|
-
|
|
92
|
-
|
|
74
|
+
var _f = (0, useTextInput_1.useTextInput)(allProps), isMultiline = _f.isMultiline, isMasked = _f.isMasked, isInputFocused = _f.isFocused, secureTextEntry = _f.secureTextEntry, handleBlur = _f.handleBlur, handleFocus = _f.handleFocus, handleChange = _f.handleChange, maskProps = _f.maskProps, innerInputRef = _f.innerInputRef, wrapperRef = _f.wrapperRef, errorMessage = _f.errorMessage, toggleSecureTextEntry = _f.toggleSecureTextEntry, hasMultipleLines = _f.hasMultipleLines, hasError = _f.hasError, inputValue = _f.inputValue;
|
|
75
|
+
var isFocused = isInputFocused || focused;
|
|
76
|
+
var isDisabled = !!inputBaseProps.disabled;
|
|
77
|
+
var partialStyles = (0, useInputBasePartialStyles_1.useInputBasePartialStyles)(styles, ['placeholder', 'selection'], {
|
|
78
|
+
disabled: isDisabled,
|
|
79
|
+
error: !!hasError,
|
|
80
|
+
focus: isFocused,
|
|
81
|
+
});
|
|
93
82
|
var InputElement = isMasked ? react_input_mask_1.default : isMultiline ? react_autosize_textarea_1.default : 'input';
|
|
94
|
-
|
|
83
|
+
var isPressable = types_1.TypeGuards.isFunction(onPress);
|
|
84
|
+
var focus = function () {
|
|
85
|
+
var _a, _b, _c, _d;
|
|
86
|
+
if (isMasked) {
|
|
87
|
+
// @ts-expect-error
|
|
88
|
+
(_b = (_a = innerInputRef.current) === null || _a === void 0 ? void 0 : _a.getInputDOMNode()) === null || _b === void 0 ? void 0 : _b.focus();
|
|
89
|
+
}
|
|
90
|
+
(_d = (_c = innerInputRef.current) === null || _c === void 0 ? void 0 : _c.focus) === null || _d === void 0 ? void 0 : _d.call(_c);
|
|
91
|
+
};
|
|
95
92
|
(0, react_1.useImperativeHandle)(inputRef, function () {
|
|
96
93
|
return {
|
|
97
|
-
focus: function () {
|
|
98
|
-
var _a, _b, _c, _d;
|
|
99
|
-
if (isMasked) {
|
|
100
|
-
// @ts-expect-error
|
|
101
|
-
(_b = (_a = innerInputRef.current) === null || _a === void 0 ? void 0 : _a.getInputDOMNode()) === null || _b === void 0 ? void 0 : _b.focus();
|
|
102
|
-
}
|
|
103
|
-
(_d = (_c = innerInputRef.current) === null || _c === void 0 ? void 0 : _c.focus) === null || _d === void 0 ? void 0 : _d.call(_c);
|
|
104
|
-
},
|
|
94
|
+
focus: function () { return focus(); },
|
|
105
95
|
isTextInput: true,
|
|
106
96
|
getInputRef: function () {
|
|
107
97
|
return innerInputRef.current;
|
|
108
98
|
},
|
|
109
99
|
};
|
|
110
100
|
}, [!!((_b = innerInputRef === null || innerInputRef === void 0 ? void 0 : innerInputRef.current) === null || _b === void 0 ? void 0 : _b.focus)]);
|
|
111
|
-
var isPressable = types_1.TypeGuards.isFunction(onPress);
|
|
112
|
-
var validation = (0, deprecated_1.useValidate)(value, types_1.TypeGuards.isFunction(maskProps === null || maskProps === void 0 ? void 0 : maskProps.validator) ? maskProps === null || maskProps === void 0 ? void 0 : maskProps.validator : validate);
|
|
113
|
-
var handleBlur = react_1.default.useCallback(function (e) {
|
|
114
|
-
var _a;
|
|
115
|
-
validation === null || validation === void 0 ? void 0 : validation.onInputBlurred();
|
|
116
|
-
setIsFocused(false);
|
|
117
|
-
(_a = props === null || props === void 0 ? void 0 : props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, e);
|
|
118
|
-
}, [validation === null || validation === void 0 ? void 0 : validation.onInputBlurred, props === null || props === void 0 ? void 0 : props.onBlur]);
|
|
119
|
-
var handleFocus = react_1.default.useCallback(function (e) {
|
|
120
|
-
var _a;
|
|
121
|
-
validation === null || validation === void 0 ? void 0 : validation.onInputFocused();
|
|
122
|
-
setIsFocused(true);
|
|
123
|
-
(_a = props === null || props === void 0 ? void 0 : props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, e);
|
|
124
|
-
}, [validation === null || validation === void 0 ? void 0 : validation.onInputFocused, props === null || props === void 0 ? void 0 : props.onFocus]);
|
|
125
|
-
var handleChange = function (event) {
|
|
126
|
-
var _a;
|
|
127
|
-
var _text = (_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.value;
|
|
128
|
-
var _value = isMasked && (maskProps === null || maskProps === void 0 ? void 0 : maskProps.notSaveFormatted)
|
|
129
|
-
? maskProps === null || maskProps === void 0 ? void 0 : maskProps.getRawValue(_text)
|
|
130
|
-
: _text;
|
|
131
|
-
if (props === null || props === void 0 ? void 0 : props.onChange)
|
|
132
|
-
props === null || props === void 0 ? void 0 : props.onChange(event);
|
|
133
|
-
if (props === null || props === void 0 ? void 0 : props.onChangeText)
|
|
134
|
-
props === null || props === void 0 ? void 0 : props.onChangeText(_value);
|
|
135
|
-
};
|
|
136
|
-
var isDisabled = !!inputBaseProps.disabled;
|
|
137
101
|
var visibilityToggleProps = visibilityToggle ? {
|
|
138
102
|
onPress: toggleSecureTextEntry,
|
|
139
103
|
icon: (secureTextEntry ? hiddenIcon : visibleIcon),
|
|
@@ -144,22 +108,6 @@ exports.TextInput = (0, react_1.forwardRef)(function (props, inputRef) {
|
|
|
144
108
|
editable: false,
|
|
145
109
|
caretHidden: true,
|
|
146
110
|
} : {};
|
|
147
|
-
var rows = (_d = textInputProps === null || textInputProps === void 0 ? void 0 : textInputProps.rows) !== null && _d !== void 0 ? _d : (isMultiline ? 2 : undefined);
|
|
148
|
-
var hasMultipleLines = isMultiline && (((_e = String(value)) === null || _e === void 0 ? void 0 : _e.includes('\n')) || !!rows);
|
|
149
|
-
var hasError = !validation.isValid || _error;
|
|
150
|
-
var errorMessage = validation.message || _error;
|
|
151
|
-
var placeholderStyles = [
|
|
152
|
-
styles.placeholder,
|
|
153
|
-
isFocused && styles['placeholder:focus'],
|
|
154
|
-
hasError && styles['placeholder:error'],
|
|
155
|
-
isDisabled && styles['placeholder:disabled'],
|
|
156
|
-
];
|
|
157
|
-
var selectionStyles = [
|
|
158
|
-
styles.selection,
|
|
159
|
-
isFocused && styles['selection:focus'],
|
|
160
|
-
hasError && styles['selection:error'],
|
|
161
|
-
isDisabled && styles['selection:disabled'],
|
|
162
|
-
];
|
|
163
111
|
var secureTextProps = (password && secureTextEntry) && {
|
|
164
112
|
type: 'password',
|
|
165
113
|
};
|
|
@@ -168,20 +116,11 @@ exports.TextInput = (0, react_1.forwardRef)(function (props, inputRef) {
|
|
|
168
116
|
};
|
|
169
117
|
var inputBaseAction = isPressable ? 'onPress' : 'onClick';
|
|
170
118
|
var testId = (0, test_1.getTestId)(textInputProps);
|
|
171
|
-
return ((0, jsx_runtime_1.jsx)(InputBase_1.InputBase, __assign({ innerWrapper: isPressable ? Touchable_1.Touchable : undefined }, inputBaseProps, { debugName: debugName, error: hasError ? errorMessage : null, style: __assign(__assign({}, styles), { innerWrapper: __assign(__assign(__assign({}, styles.innerWrapper), (isMultiline ? styles['innerWrapper:multiline'] : {})), (hasMultipleLines ? styles['innerWrapper:hasMultipleLines'] : {})) }), innerWrapperProps: __assign(__assign({}, (inputBaseProps.innerWrapperProps || {})), (_a = {}, _a[inputBaseAction] = function () {
|
|
172
|
-
|
|
173
|
-
if (isMasked) {
|
|
174
|
-
// @ts-expect-error
|
|
175
|
-
(_b = (_a = innerInputRef.current) === null || _a === void 0 ? void 0 : _a.getInputDOMNode()) === null || _b === void 0 ? void 0 : _b.focus();
|
|
176
|
-
}
|
|
177
|
-
(_d = (_c = innerInputRef.current) === null || _c === void 0 ? void 0 : _c.focus) === null || _d === void 0 ? void 0 : _d.call(_c);
|
|
119
|
+
return ((0, jsx_runtime_1.jsx)(InputBase_1.InputBase, __assign({ innerWrapper: isPressable ? Touchable_1.Touchable : undefined }, inputBaseProps, { ref: wrapperRef, debugName: debugName, error: hasError ? errorMessage : null, style: __assign(__assign({}, styles), { innerWrapper: __assign(__assign(__assign({}, styles.innerWrapper), (isMultiline ? styles['innerWrapper:multiline'] : {})), (hasMultipleLines ? styles['innerWrapper:hasMultipleLines'] : {})) }), innerWrapperProps: __assign(__assign({}, (inputBaseProps.innerWrapperProps || {})), (_a = {}, _a[inputBaseAction] = function () {
|
|
120
|
+
focus();
|
|
178
121
|
if (isPressable)
|
|
179
122
|
onPress === null || onPress === void 0 ? void 0 : onPress();
|
|
180
|
-
}, _a.debugName = debugName, _a)), rightIcon: rightIcon, focused: isFocused }, { children: (0, jsx_runtime_1.jsx)(InputElement, __assign({ editable: "".concat(!isPressable && !isDisabled) }, buttonModeProps, secureTextProps, textInputProps, {
|
|
181
|
-
// @ts-ignore
|
|
182
|
-
onBlur: handleBlur,
|
|
183
|
-
// @ts-ignore
|
|
184
|
-
onFocus: handleFocus, css: [
|
|
123
|
+
}, _a.debugName = debugName, _a)), rightIcon: rightIcon, focused: isFocused }, { children: (0, jsx_runtime_1.jsx)(InputElement, __assign({ editable: "".concat(!isPressable && !isDisabled) }, buttonModeProps, secureTextProps, textInputProps, { onBlur: handleBlur, onFocus: handleFocus, css: [
|
|
185
124
|
styles.input,
|
|
186
125
|
isMultiline && styles['input:multiline'],
|
|
187
126
|
isFocused && styles['input:focus'],
|
|
@@ -189,10 +128,10 @@ exports.TextInput = (0, react_1.forwardRef)(function (props, inputRef) {
|
|
|
189
128
|
isDisabled && styles['input:disabled'],
|
|
190
129
|
hasMultipleLines && styles['input:hasMultipleLines'],
|
|
191
130
|
{
|
|
192
|
-
'&::placeholder':
|
|
131
|
+
'&::placeholder': partialStyles === null || partialStyles === void 0 ? void 0 : partialStyles.placeholder,
|
|
193
132
|
},
|
|
194
133
|
{
|
|
195
|
-
'&::selection':
|
|
134
|
+
'&::selection': partialStyles === null || partialStyles === void 0 ? void 0 : partialStyles.selection,
|
|
196
135
|
},
|
|
197
136
|
{
|
|
198
137
|
'&:focus': [
|
|
@@ -201,7 +140,7 @@ exports.TextInput = (0, react_1.forwardRef)(function (props, inputRef) {
|
|
|
201
140
|
caretColorStyle,
|
|
202
141
|
],
|
|
203
142
|
},
|
|
204
|
-
] }, maskProps, { ref: innerInputRef, "data-testid": testId })) })));
|
|
143
|
+
] }, maskProps, { value: inputValue, onChange: handleChange, ref: innerInputRef, "data-testid": testId })) })));
|
|
205
144
|
});
|
|
206
145
|
exports.TextInput.styleRegistryName = 'TextInput';
|
|
207
146
|
exports.TextInput.elements = __spreadArray(__spreadArray([], InputBase_1.InputBase.elements, true), ['input', 'placeholder', 'selection'], false);
|