@deephaven/components 0.5.2-beta.0 → 0.6.1-demo.8
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/AutoCompleteInput.js +410 -448
- package/dist/AutoCompleteInput.js.map +1 -1
- package/dist/AutoResizeTextarea.js +17 -46
- package/dist/AutoResizeTextarea.js.map +1 -1
- package/dist/BasicModal.js +18 -19
- package/dist/BasicModal.js.map +1 -1
- package/dist/Button.js +30 -21
- package/dist/Button.js.map +1 -1
- package/dist/ButtonGroup.js +6 -4
- package/dist/ButtonGroup.js.map +1 -1
- package/dist/ButtonOld.js +10 -8
- package/dist/ButtonOld.js.map +1 -1
- package/dist/CardFlip.js +10 -8
- package/dist/CardFlip.js.map +1 -1
- package/dist/Checkbox.js +18 -31
- package/dist/Checkbox.js.map +1 -1
- package/dist/Collapse.js +65 -105
- package/dist/Collapse.js.map +1 -1
- package/dist/ComboBox.js +432 -460
- package/dist/ComboBox.js.map +1 -1
- package/dist/CustomTimeSelect.js +485 -517
- package/dist/CustomTimeSelect.js.map +1 -1
- package/dist/DebouncedSearchInput.js +61 -91
- package/dist/DebouncedSearchInput.js.map +1 -1
- package/dist/DeephavenSpinner.js +6 -6
- package/dist/DeephavenSpinner.js.map +1 -1
- package/dist/DragUtils.js +65 -113
- package/dist/DragUtils.js.map +1 -1
- package/dist/DraggableItemList.d.ts +1 -0
- package/dist/DraggableItemList.d.ts.map +1 -1
- package/dist/DraggableItemList.js +219 -257
- package/dist/DraggableItemList.js.map +1 -1
- package/dist/HierarchicalCheckboxMenu.js +160 -227
- package/dist/HierarchicalCheckboxMenu.js.map +1 -1
- package/dist/ItemList.d.ts +4 -2
- package/dist/ItemList.d.ts.map +1 -1
- package/dist/ItemList.js +595 -598
- package/dist/ItemList.js.map +1 -1
- package/dist/ItemListItem.js +194 -215
- package/dist/ItemListItem.js.map +1 -1
- package/dist/LoadingOverlay.js +9 -10
- package/dist/LoadingOverlay.js.map +1 -1
- package/dist/LoadingSpinner.js +4 -3
- package/dist/LoadingSpinner.js.map +1 -1
- package/dist/MaskedInput.js +59 -70
- package/dist/MaskedInput.js.map +1 -1
- package/dist/Option.js +5 -3
- package/dist/Option.js.map +1 -1
- package/dist/RadioGroup.js +16 -34
- package/dist/RadioGroup.js.map +1 -1
- package/dist/RadioItem.js +14 -33
- package/dist/RadioItem.js.map +1 -1
- package/dist/SearchInput.js +42 -75
- package/dist/SearchInput.js.map +1 -1
- package/dist/Select.js +10 -8
- package/dist/Select.js.map +1 -1
- package/dist/SelectValueList.js +97 -134
- package/dist/SelectValueList.js.map +1 -1
- package/dist/SocketedButton.js +13 -11
- package/dist/SocketedButton.js.map +1 -1
- package/dist/ThemeExport.js.map +1 -1
- package/dist/TimeInput.js +16 -53
- package/dist/TimeInput.js.map +1 -1
- package/dist/TimeSlider.js +62 -88
- package/dist/TimeSlider.js.map +1 -1
- package/dist/ToastNotification.js +14 -13
- package/dist/ToastNotification.js.map +1 -1
- package/dist/UISwitch.js +9 -8
- package/dist/UISwitch.js.map +1 -1
- package/dist/context-actions/ContextActionUtils.js +173 -231
- package/dist/context-actions/ContextActionUtils.js.map +1 -1
- package/dist/context-actions/ContextActions.js +135 -177
- package/dist/context-actions/ContextActions.js.map +1 -1
- package/dist/context-actions/ContextMenu.js +509 -543
- package/dist/context-actions/ContextMenu.js.map +1 -1
- package/dist/context-actions/ContextMenuItem.js +32 -22
- package/dist/context-actions/ContextMenuItem.js.map +1 -1
- package/dist/context-actions/ContextMenuRoot.js +112 -152
- package/dist/context-actions/ContextMenuRoot.js.map +1 -1
- package/dist/context-actions/GlobalContextAction.js +49 -84
- package/dist/context-actions/GlobalContextAction.js.map +1 -1
- package/dist/context-actions/GlobalContextActions.js +25 -57
- package/dist/context-actions/GlobalContextActions.js.map +1 -1
- package/dist/context-actions/index.js +4 -4
- package/dist/context-actions/index.js.map +1 -1
- package/dist/index.js +39 -39
- package/dist/index.js.map +1 -1
- package/dist/menu-actions/DropdownMenu.js +126 -159
- package/dist/menu-actions/DropdownMenu.js.map +1 -1
- package/dist/menu-actions/Menu.js +215 -245
- package/dist/menu-actions/Menu.js.map +1 -1
- package/dist/menu-actions/index.js +1 -1
- package/dist/menu-actions/index.js.map +1 -1
- package/dist/navigation/Menu.js +14 -18
- package/dist/navigation/Menu.js.map +1 -1
- package/dist/navigation/MenuItem.js +15 -14
- package/dist/navigation/MenuItem.js.map +1 -1
- package/dist/navigation/Page.js +7 -5
- package/dist/navigation/Page.js.map +1 -1
- package/dist/navigation/Stack.js +14 -39
- package/dist/navigation/Stack.js.map +1 -1
- package/dist/navigation/index.js +4 -4
- package/dist/navigation/index.js.map +1 -1
- package/dist/popper/Popper.js +209 -235
- package/dist/popper/Popper.js.map +1 -1
- package/dist/popper/Tooltip.js +227 -257
- package/dist/popper/Tooltip.js.map +1 -1
- package/dist/popper/index.js +2 -2
- package/dist/popper/index.js.map +1 -1
- package/dist/shortcuts/GlobalShortcuts.js +2 -2
- package/dist/shortcuts/GlobalShortcuts.js.map +1 -1
- package/dist/shortcuts/Shortcut.js +263 -291
- package/dist/shortcuts/Shortcut.js.map +1 -1
- package/dist/shortcuts/ShortcutRegistry.js +48 -71
- package/dist/shortcuts/ShortcutRegistry.js.map +1 -1
- package/dist/shortcuts/index.js +4 -4
- package/dist/shortcuts/index.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +30 -54
package/dist/MaskedInput.js
CHANGED
|
@@ -14,7 +14,7 @@ var SELECTION_DIRECTION = {
|
|
|
14
14
|
* https://www.fileformat.info/info/unicode/char/2007/index.htm
|
|
15
15
|
*/
|
|
16
16
|
|
|
17
|
-
var FIXED_WIDTH_SPACE =
|
|
17
|
+
var FIXED_WIDTH_SPACE = '\u2007';
|
|
18
18
|
|
|
19
19
|
/**
|
|
20
20
|
* A masked input for entering data from a template.
|
|
@@ -23,44 +23,31 @@ var FIXED_WIDTH_SPACE = "\u2007";
|
|
|
23
23
|
// Forward ref causes a false positive for display-name in eslint:
|
|
24
24
|
// https://github.com/yannickcr/eslint-plugin-react/issues/2269
|
|
25
25
|
// eslint-disable-next-line react/display-name
|
|
26
|
-
var MaskedInput = /*#__PURE__*/React.forwardRef(
|
|
27
|
-
var
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
return false;
|
|
40
|
-
} : _props$onSelect,
|
|
41
|
-
pattern = props.pattern,
|
|
42
|
-
selection = props.selection,
|
|
43
|
-
value = props.value,
|
|
44
|
-
_props$onFocus = props.onFocus,
|
|
45
|
-
onFocus = _props$onFocus === void 0 ? function () {
|
|
46
|
-
return false;
|
|
47
|
-
} : _props$onFocus,
|
|
48
|
-
_props$onBlur = props.onBlur,
|
|
49
|
-
onBlur = _props$onBlur === void 0 ? function () {
|
|
50
|
-
return false;
|
|
51
|
-
} : _props$onBlur;
|
|
26
|
+
var MaskedInput = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
27
|
+
var {
|
|
28
|
+
className,
|
|
29
|
+
example,
|
|
30
|
+
getNextSegmentValue = (range, delta, segmentValue) => segmentValue,
|
|
31
|
+
onChange = () => false,
|
|
32
|
+
onSelect = () => false,
|
|
33
|
+
pattern,
|
|
34
|
+
selection,
|
|
35
|
+
value,
|
|
36
|
+
onFocus = () => false,
|
|
37
|
+
onBlur = () => false
|
|
38
|
+
} = props;
|
|
52
39
|
var input = useForwardedRef(ref);
|
|
53
|
-
var examples = useMemo(
|
|
54
|
-
|
|
55
|
-
}, [example]);
|
|
56
|
-
useEffect(function () {
|
|
40
|
+
var examples = useMemo(() => Array.isArray(example) ? example : [example], [example]);
|
|
41
|
+
useEffect(() => {
|
|
57
42
|
if (selection != null) {
|
|
58
43
|
var _input$current;
|
|
59
44
|
|
|
60
45
|
log.debug('setting selection...', selection);
|
|
61
|
-
var
|
|
62
|
-
|
|
63
|
-
|
|
46
|
+
var {
|
|
47
|
+
selectionStart,
|
|
48
|
+
selectionEnd,
|
|
49
|
+
selectionDirection
|
|
50
|
+
} = selection;
|
|
64
51
|
(_input$current = input.current) === null || _input$current === void 0 ? void 0 : _input$current.setSelectionRange(selectionStart, selectionEnd, selectionDirection);
|
|
65
52
|
log.debug('selection set!');
|
|
66
53
|
}
|
|
@@ -93,9 +80,9 @@ var MaskedInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
93
80
|
|
|
94
81
|
var selectionDirection = selectionStart === selectionEnd ? SELECTION_DIRECTION.NONE : SELECTION_DIRECTION.BACKWARD;
|
|
95
82
|
return {
|
|
96
|
-
selectionStart
|
|
97
|
-
selectionEnd
|
|
98
|
-
selectionDirection
|
|
83
|
+
selectionStart,
|
|
84
|
+
selectionEnd,
|
|
85
|
+
selectionDirection
|
|
99
86
|
};
|
|
100
87
|
}
|
|
101
88
|
/**
|
|
@@ -196,13 +183,11 @@ var MaskedInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
196
183
|
}
|
|
197
184
|
|
|
198
185
|
function handleSelect(event) {
|
|
199
|
-
var
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
_ref$selectionDirecti = _ref.selectionDirection,
|
|
205
|
-
selectionDirection = _ref$selectionDirecti === void 0 ? 'none' : _ref$selectionDirecti;
|
|
186
|
+
var {
|
|
187
|
+
selectionStart = 0,
|
|
188
|
+
selectionEnd = 0,
|
|
189
|
+
selectionDirection = 'none'
|
|
190
|
+
} = event.target;
|
|
206
191
|
|
|
207
192
|
if (selectionStart === null || selectionEnd === null || selectionDirection === null) {
|
|
208
193
|
log.error('Selection attempted on non-text input element', event.target);
|
|
@@ -221,9 +206,9 @@ var MaskedInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
221
206
|
onSelect(newSelection);
|
|
222
207
|
} else {
|
|
223
208
|
onSelect({
|
|
224
|
-
selectionStart
|
|
225
|
-
selectionEnd
|
|
226
|
-
selectionDirection
|
|
209
|
+
selectionStart,
|
|
210
|
+
selectionEnd,
|
|
211
|
+
selectionDirection
|
|
227
212
|
});
|
|
228
213
|
}
|
|
229
214
|
}
|
|
@@ -250,12 +235,13 @@ var MaskedInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
250
235
|
return;
|
|
251
236
|
}
|
|
252
237
|
|
|
253
|
-
var
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
238
|
+
var {
|
|
239
|
+
key
|
|
240
|
+
} = event;
|
|
241
|
+
var {
|
|
242
|
+
selectionStart = 0,
|
|
243
|
+
selectionEnd = 0
|
|
244
|
+
} = input.current;
|
|
259
245
|
|
|
260
246
|
if (selectionStart === null || selectionEnd === null) {
|
|
261
247
|
log.error('Selection arrow nvaigation attempted on non-text input element', event.target);
|
|
@@ -279,12 +265,13 @@ var MaskedInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
279
265
|
}
|
|
280
266
|
|
|
281
267
|
log.debug('handleKeyDown', event);
|
|
282
|
-
var
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
268
|
+
var {
|
|
269
|
+
key
|
|
270
|
+
} = event;
|
|
271
|
+
var {
|
|
272
|
+
selectionStart = 0,
|
|
273
|
+
selectionEnd = 0
|
|
274
|
+
} = input.current;
|
|
288
275
|
|
|
289
276
|
if (selectionStart === null || selectionEnd === null) {
|
|
290
277
|
log.error('Selection key event on non-text input element', event.target);
|
|
@@ -306,7 +293,7 @@ var MaskedInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
306
293
|
log.debug('Range ', selectionStart, selectionEnd, 'deleted, setting value', newValue);
|
|
307
294
|
onChange(newValue);
|
|
308
295
|
onSelect({
|
|
309
|
-
selectionStart
|
|
296
|
+
selectionStart,
|
|
310
297
|
selectionEnd: selectionStart,
|
|
311
298
|
selectionDirection: SELECTION_DIRECTION.NONE
|
|
312
299
|
});
|
|
@@ -380,9 +367,7 @@ var MaskedInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
380
367
|
type: "text",
|
|
381
368
|
pattern: pattern,
|
|
382
369
|
value: value,
|
|
383
|
-
onChange:
|
|
384
|
-
return undefined;
|
|
385
|
-
},
|
|
370
|
+
onChange: () => undefined,
|
|
386
371
|
onKeyDown: handleKeyDown,
|
|
387
372
|
onSelect: handleSelect,
|
|
388
373
|
onSelectCapture: handleSelectCapture,
|
|
@@ -392,18 +377,22 @@ var MaskedInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
392
377
|
});
|
|
393
378
|
MaskedInput.defaultProps = {
|
|
394
379
|
className: '',
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
onSelect: function onSelect() {// no-op
|
|
380
|
+
|
|
381
|
+
onChange() {// no-op
|
|
398
382
|
},
|
|
399
|
-
|
|
400
|
-
|
|
383
|
+
|
|
384
|
+
onSelect() {// no-op
|
|
401
385
|
},
|
|
386
|
+
|
|
387
|
+
getNextSegmentValue: (range, delta, segmentValue) => segmentValue,
|
|
402
388
|
selection: undefined,
|
|
403
|
-
|
|
389
|
+
|
|
390
|
+
onFocus() {// no-op
|
|
404
391
|
},
|
|
405
|
-
|
|
392
|
+
|
|
393
|
+
onBlur() {// no-op
|
|
406
394
|
}
|
|
395
|
+
|
|
407
396
|
};
|
|
408
397
|
export default MaskedInput;
|
|
409
398
|
//# sourceMappingURL=MaskedInput.js.map
|
package/dist/MaskedInput.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/MaskedInput.tsx"],"names":["React","useMemo","useEffect","classNames","Log","useForwardedRef","log","module","SELECTION_DIRECTION","FORWARD","BACKWARD","NONE","FIXED_WIDTH_SPACE","MaskedInput","forwardRef","props","ref","className","example","getNextSegmentValue","range","delta","segmentValue","onChange","onSelect","pattern","selection","value","onFocus","onBlur","input","examples","Array","isArray","debug","selectionStart","selectionEnd","selectionDirection","current","setSelectionRange","getSegment","cursorPosition","testValue","length","i","test","charAt","fillValue","checkValue","exampleValue","filledValue","concat","substring","isValid","patternRegex","RegExp","nextSegment","position","currentSegment","nextPosition","previousSegment","previousPosition","nextSegmentValue","segment","newSegmentValue","newValue","handleSelect","event","target","error","debug2","newSelection","handleSelectCapture","preventDefault","stopPropagation","handleArrowKey","key","handleKeyDown","startsWith","replace","altKey","metaKey","ctrlKey","newChars","from","Set","toUpperCase","toLowerCase","newChar","maxReplaceIndex","replaceIndex","newSelectionStart","nextSegmentSelection","undefined","defaultProps"],"mappings":"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","sourcesContent":["import React, { useMemo, useEffect } from 'react';\nimport classNames from 'classnames';\nimport Log from '@deephaven/log';\nimport { useForwardedRef } from '@deephaven/react-hooks';\nimport './MaskedInput.scss';\n\nconst log = Log.module('MaskedInput');\n\nconst SELECTION_DIRECTION = {\n FORWARD: 'forward',\n BACKWARD: 'backward',\n NONE: 'none',\n} as const;\n\n/**\n * Special space character that's the same size as tabular numbers\n * https://www.fileformat.info/info/unicode/char/2007/index.htm\n */\nconst FIXED_WIDTH_SPACE = '\\u2007';\n\nexport type SelectionSegment = {\n selectionStart: number;\n selectionEnd: number;\n selectionDirection?: typeof SELECTION_DIRECTION[keyof typeof SELECTION_DIRECTION];\n};\n\ntype MaskedInputProps = {\n /** An extra class name to add to the component */\n className?: string;\n /** The regex pattern this masked input must match */\n pattern: string;\n /** The current value to display */\n value: string;\n /** One or more examples of valid values. Used when deciding if next keystroke is valid (as rest of the current value may be incomplete) */\n example: string | string[];\n /** The current selection to use for the input */\n selection?: SelectionSegment;\n /** Called when the value changes. Note the value may still be incomplete. */\n onChange?(value: string): void;\n /** Called when selection changes */\n onSelect?(segment: SelectionSegment): void;\n /** Retrieve the next value for a provided segment */\n getNextSegmentValue?(\n segment: SelectionSegment,\n delta: number,\n segmentValue: string,\n value: string\n ): string;\n onFocus?: React.FocusEventHandler;\n onBlur?: React.FocusEventHandler;\n};\n\n/**\n * A masked input for entering data from a template.\n * Won't work by itself, must use within another component and handle updating the value/selection.\n */\n// Forward ref causes a false positive for display-name in eslint:\n// https://github.com/yannickcr/eslint-plugin-react/issues/2269\n// eslint-disable-next-line react/display-name\nconst MaskedInput = React.forwardRef<HTMLInputElement, MaskedInputProps>(\n (props: MaskedInputProps, ref) => {\n const {\n className,\n example,\n getNextSegmentValue = (range, delta, segmentValue) => segmentValue,\n onChange = () => false,\n onSelect = () => false,\n pattern,\n selection,\n value,\n onFocus = () => false,\n onBlur = () => false,\n } = props;\n const input = useForwardedRef(ref);\n const examples = useMemo(\n () => (Array.isArray(example) ? example : [example]),\n [example]\n );\n\n useEffect(() => {\n if (selection != null) {\n log.debug('setting selection...', selection);\n const { selectionStart, selectionEnd, selectionDirection } = selection;\n input.current?.setSelectionRange(\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n log.debug('selection set!');\n }\n }, [selection, input]);\n\n /**\n * Returns the selection range for the segment at the given cursor position\n * @param cursorPosition The current position of the cursor\n */\n function getSegment(cursorPosition: number) {\n let selectionStart = cursorPosition;\n let selectionEnd = cursorPosition;\n const testValue = examples.length > 0 ? examples[0] : value;\n\n for (let i = selectionStart - 1; i >= 0; i -= 1) {\n if (!/[a-zA-Z0-9]/g.test(testValue.charAt(i))) {\n break;\n }\n\n selectionStart = i;\n }\n\n for (let i = selectionEnd; i < testValue.length; i += 1) {\n if (!/[a-zA-Z0-9]/g.test(testValue.charAt(i))) {\n break;\n }\n\n selectionEnd = i + 1;\n }\n\n const selectionDirection =\n selectionStart === selectionEnd\n ? SELECTION_DIRECTION.NONE\n : SELECTION_DIRECTION.BACKWARD;\n\n return {\n selectionStart,\n selectionEnd,\n selectionDirection,\n };\n }\n\n /**\n * Replaces all blank spaces and everything after the current cursor position with the example value\n * @param checkValue The value to check/fill in\n * @param exampleValue The example to fill in the value from\n * @param cursorPosition The cursor position\n * @returns The filled in value\n */\n function fillValue(\n checkValue: string,\n exampleValue: string,\n cursorPosition = checkValue.length\n ): string {\n let filledValue = '';\n for (let i = 0; i < cursorPosition; i += 1) {\n if (checkValue.charAt(i) !== FIXED_WIDTH_SPACE) {\n filledValue = filledValue.concat(checkValue[i]);\n } else {\n filledValue = filledValue.concat(exampleValue[i]);\n }\n }\n filledValue = filledValue.concat(exampleValue.substring(cursorPosition));\n\n return filledValue;\n }\n\n /**\n * Checks if a given `value` is valid up until the `cursorPosition`.\n * Uses the examples to build the rest of the string\n * @param checkValue The value to check validity of\n * @param cursorPosition The position of the cursor to check up to\n */\n function isValid(\n checkValue: string,\n cursorPosition = checkValue.length\n ): boolean {\n const patternRegex = new RegExp(pattern);\n if (patternRegex.test(checkValue)) {\n return true;\n }\n\n for (let i = 0; i < examples.length; i += 1) {\n const filledValue = fillValue(checkValue, examples[i], cursorPosition);\n if (patternRegex.test(filledValue)) {\n return true;\n }\n }\n return false;\n }\n\n /**\n * Returns the next segment after the given position\n * @param position The cursor position to start at\n * @returns The new selection range\n */\n function nextSegment(position: number): SelectionSegment {\n const currentSegment = getSegment(position);\n const nextPosition = currentSegment.selectionEnd + 1;\n if (nextPosition >= value.length) {\n return currentSegment;\n }\n\n return getSegment(nextPosition);\n }\n\n /**\n * Returns the previous segment before the given position\n * @param position The cursor position to start at\n * @returns The new selection range\n */\n function previousSegment(position: number): SelectionSegment {\n const currentSegment = getSegment(position);\n const previousPosition = currentSegment.selectionStart - 1;\n if (previousPosition <= 0) {\n return currentSegment;\n }\n\n return getSegment(previousPosition);\n }\n\n function nextSegmentValue(position: number, delta: number): void {\n const segment = getSegment(position);\n const segmentValue = value.substring(\n segment.selectionStart,\n segment.selectionEnd\n );\n const newSegmentValue = getNextSegmentValue(\n segment,\n delta,\n segmentValue,\n value\n );\n const newValue =\n value.substring(0, segment.selectionStart) +\n newSegmentValue +\n value.substring(segment.selectionEnd);\n if (isValid(newValue, segment.selectionEnd)) {\n onChange(newValue);\n onSelect(segment);\n }\n }\n\n function handleSelect(event: React.UIEvent<HTMLInputElement>) {\n const {\n selectionStart = 0,\n selectionEnd = 0,\n selectionDirection = 'none',\n } = event.target as HTMLInputElement;\n\n if (\n selectionStart === null ||\n selectionEnd === null ||\n selectionDirection === null\n ) {\n log.error(\n 'Selection attempted on non-text input element',\n event.target\n );\n return;\n }\n\n log.debug2(\n 'handleSelect',\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n if (\n selection != null &&\n selectionStart === selection.selectionStart &&\n selectionEnd === selection.selectionEnd\n ) {\n return;\n }\n if (selectionStart === selectionEnd) {\n const newSelection = getSegment(selectionStart);\n log.debug(\n 'Selection segment from ',\n selectionStart,\n selectionEnd,\n '=>',\n newSelection\n );\n onSelect(newSelection);\n } else {\n onSelect({ selectionStart, selectionEnd, selectionDirection });\n }\n }\n\n function handleSelectCapture(event: React.UIEvent<HTMLInputElement>) {\n if (!input.current) {\n return;\n }\n log.debug('handleSelectCapture', event);\n const selectionStart = input.current.selectionStart || 0;\n if (\n selectionStart === value.length &&\n selection != null &&\n selectionStart !== selection.selectionStart\n ) {\n event.preventDefault();\n event.stopPropagation();\n }\n }\n\n function handleArrowKey(event: React.KeyboardEvent<HTMLInputElement>) {\n event.preventDefault();\n event.stopPropagation();\n\n if (!input.current) {\n return;\n }\n\n const { key } = event;\n const { selectionStart = 0, selectionEnd = 0 } = input.current;\n if (selectionStart === null || selectionEnd === null) {\n log.error(\n 'Selection arrow nvaigation attempted on non-text input element',\n event.target\n );\n return;\n }\n\n if (key === 'ArrowLeft') {\n onSelect(previousSegment(selectionStart));\n } else if (key === 'ArrowRight') {\n onSelect(nextSegment(selectionEnd));\n } else if (key === 'ArrowUp') {\n nextSegmentValue(selectionStart, -1);\n } else if (key === 'ArrowDown') {\n nextSegmentValue(selectionStart, 1);\n }\n }\n\n function handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>) {\n if (!input.current) {\n return;\n }\n log.debug('handleKeyDown', event);\n const { key } = event;\n const { selectionStart = 0, selectionEnd = 0 } = input.current;\n if (selectionStart === null || selectionEnd === null) {\n log.error(\n 'Selection key event on non-text input element',\n event.target\n );\n return;\n }\n\n if (key.startsWith('Arrow')) {\n handleArrowKey(event);\n return;\n }\n\n if (key === 'Delete' || key === 'Backspace') {\n event.preventDefault();\n event.stopPropagation();\n\n if (selectionStart !== selectionEnd) {\n // Replace all non-masked characters with blanks, set selection to start\n const newValue =\n value.substring(0, selectionStart) +\n value\n .substring(selectionStart, selectionEnd)\n .replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE) +\n value.substring(selectionEnd);\n log.debug(\n 'Range ',\n selectionStart,\n selectionEnd,\n 'deleted, setting value',\n newValue\n );\n\n onChange(newValue);\n onSelect({\n selectionStart,\n selectionEnd: selectionStart,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n } else if (selectionStart > 0) {\n for (let i = selectionStart - 1; i >= 0; i -= 1) {\n // Only replace non placeholder text\n const newValue =\n value.substring(0, i) +\n value\n .substring(i, selectionStart)\n .replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE) +\n value.substring(selectionStart);\n\n if (newValue !== value) {\n onChange(newValue);\n onSelect({\n selectionStart: i,\n selectionEnd: i,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n return;\n }\n }\n }\n\n return;\n }\n\n if (event.altKey || event.metaKey || event.ctrlKey || key.length > 1) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n // Get the different permutations of the character they entered, remove duplicates\n const newChars = Array.from(\n new Set([key, key.toUpperCase(), key.toLowerCase()])\n );\n for (let i = 0; i < newChars.length; i += 1) {\n const newChar = newChars[i];\n\n // If they're typing an alphanumeric character, be smart and allow it to jump ahead\n const maxReplaceIndex = /[a-zA-Z0-9]/g.test(newChar)\n ? value.length - 1\n : selectionStart;\n for (\n let replaceIndex = selectionStart;\n replaceIndex <= maxReplaceIndex;\n replaceIndex += 1\n ) {\n const newValue =\n value.substring(0, replaceIndex) +\n newChar +\n value.substring(replaceIndex + 1);\n if (isValid(newValue, replaceIndex + 1)) {\n const currentSegment = getSegment(replaceIndex);\n const newSelectionStart = replaceIndex + 1;\n let newSelection: SelectionSegment = {\n selectionStart: newSelectionStart,\n selectionEnd: newSelectionStart,\n selectionDirection: SELECTION_DIRECTION.NONE,\n };\n if (newSelectionStart >= currentSegment.selectionEnd) {\n const nextSegmentSelection = nextSegment(replaceIndex);\n if (\n nextSegmentSelection.selectionStart !==\n currentSegment.selectionStart\n ) {\n newSelection = nextSegmentSelection;\n }\n }\n log.debug('handleKeyDown', key, '=>', newValue, newSelection);\n onChange(newValue);\n onSelect(newSelection);\n return;\n }\n }\n }\n }\n\n // Need to use \"text\" type so we can apply a pattern and make selection properly\n return (\n <input\n ref={input}\n className={classNames('form-control masked-input', className)}\n type=\"text\"\n pattern={pattern}\n value={value}\n onChange={() => undefined}\n onKeyDown={handleKeyDown}\n onSelect={handleSelect}\n onSelectCapture={handleSelectCapture}\n onFocus={onFocus}\n onBlur={onBlur}\n />\n );\n }\n);\n\nMaskedInput.defaultProps = {\n className: '',\n onChange(): void {\n // no-op\n },\n onSelect(): void {\n // no-op\n },\n getNextSegmentValue: (range, delta, segmentValue) => segmentValue,\n selection: undefined,\n onFocus(): void {\n // no-op\n },\n onBlur(): void {\n // no-op\n },\n};\n\nexport default MaskedInput;\n"],"file":"MaskedInput.js"}
|
|
1
|
+
{"version":3,"sources":["../src/MaskedInput.tsx"],"names":["React","useMemo","useEffect","classNames","Log","useForwardedRef","log","module","SELECTION_DIRECTION","FORWARD","BACKWARD","NONE","FIXED_WIDTH_SPACE","MaskedInput","forwardRef","props","ref","className","example","getNextSegmentValue","range","delta","segmentValue","onChange","onSelect","pattern","selection","value","onFocus","onBlur","input","examples","Array","isArray","debug","selectionStart","selectionEnd","selectionDirection","current","setSelectionRange","getSegment","cursorPosition","testValue","length","i","test","charAt","fillValue","checkValue","exampleValue","filledValue","concat","substring","isValid","patternRegex","RegExp","nextSegment","position","currentSegment","nextPosition","previousSegment","previousPosition","nextSegmentValue","segment","newSegmentValue","newValue","handleSelect","event","target","error","debug2","newSelection","handleSelectCapture","preventDefault","stopPropagation","handleArrowKey","key","handleKeyDown","startsWith","replace","altKey","metaKey","ctrlKey","newChars","from","Set","toUpperCase","toLowerCase","newChar","maxReplaceIndex","replaceIndex","newSelectionStart","nextSegmentSelection","undefined","defaultProps"],"mappings":"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","sourcesContent":["import React, { useMemo, useEffect } from 'react';\nimport classNames from 'classnames';\nimport Log from '@deephaven/log';\nimport { useForwardedRef } from '@deephaven/react-hooks';\nimport './MaskedInput.scss';\n\nconst log = Log.module('MaskedInput');\n\nconst SELECTION_DIRECTION = {\n FORWARD: 'forward',\n BACKWARD: 'backward',\n NONE: 'none',\n} as const;\n\n/**\n * Special space character that's the same size as tabular numbers\n * https://www.fileformat.info/info/unicode/char/2007/index.htm\n */\nconst FIXED_WIDTH_SPACE = '\\u2007';\n\nexport type SelectionSegment = {\n selectionStart: number;\n selectionEnd: number;\n selectionDirection?: typeof SELECTION_DIRECTION[keyof typeof SELECTION_DIRECTION];\n};\n\ntype MaskedInputProps = {\n /** An extra class name to add to the component */\n className?: string;\n /** The regex pattern this masked input must match */\n pattern: string;\n /** The current value to display */\n value: string;\n /** One or more examples of valid values. Used when deciding if next keystroke is valid (as rest of the current value may be incomplete) */\n example: string | string[];\n /** The current selection to use for the input */\n selection?: SelectionSegment;\n /** Called when the value changes. Note the value may still be incomplete. */\n onChange?(value: string): void;\n /** Called when selection changes */\n onSelect?(segment: SelectionSegment): void;\n /** Retrieve the next value for a provided segment */\n getNextSegmentValue?(\n segment: SelectionSegment,\n delta: number,\n segmentValue: string,\n value: string\n ): string;\n onFocus?: React.FocusEventHandler;\n onBlur?: React.FocusEventHandler;\n};\n\n/**\n * A masked input for entering data from a template.\n * Won't work by itself, must use within another component and handle updating the value/selection.\n */\n// Forward ref causes a false positive for display-name in eslint:\n// https://github.com/yannickcr/eslint-plugin-react/issues/2269\n// eslint-disable-next-line react/display-name\nconst MaskedInput = React.forwardRef<HTMLInputElement, MaskedInputProps>(\n (props: MaskedInputProps, ref) => {\n const {\n className,\n example,\n getNextSegmentValue = (range, delta, segmentValue) => segmentValue,\n onChange = () => false,\n onSelect = () => false,\n pattern,\n selection,\n value,\n onFocus = () => false,\n onBlur = () => false,\n } = props;\n const input = useForwardedRef(ref);\n const examples = useMemo(\n () => (Array.isArray(example) ? example : [example]),\n [example]\n );\n\n useEffect(() => {\n if (selection != null) {\n log.debug('setting selection...', selection);\n const { selectionStart, selectionEnd, selectionDirection } = selection;\n input.current?.setSelectionRange(\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n log.debug('selection set!');\n }\n }, [selection, input]);\n\n /**\n * Returns the selection range for the segment at the given cursor position\n * @param cursorPosition The current position of the cursor\n */\n function getSegment(cursorPosition: number) {\n let selectionStart = cursorPosition;\n let selectionEnd = cursorPosition;\n const testValue = examples.length > 0 ? examples[0] : value;\n\n for (let i = selectionStart - 1; i >= 0; i -= 1) {\n if (!/[a-zA-Z0-9]/g.test(testValue.charAt(i))) {\n break;\n }\n\n selectionStart = i;\n }\n\n for (let i = selectionEnd; i < testValue.length; i += 1) {\n if (!/[a-zA-Z0-9]/g.test(testValue.charAt(i))) {\n break;\n }\n\n selectionEnd = i + 1;\n }\n\n const selectionDirection =\n selectionStart === selectionEnd\n ? SELECTION_DIRECTION.NONE\n : SELECTION_DIRECTION.BACKWARD;\n\n return {\n selectionStart,\n selectionEnd,\n selectionDirection,\n };\n }\n\n /**\n * Replaces all blank spaces and everything after the current cursor position with the example value\n * @param checkValue The value to check/fill in\n * @param exampleValue The example to fill in the value from\n * @param cursorPosition The cursor position\n * @returns The filled in value\n */\n function fillValue(\n checkValue: string,\n exampleValue: string,\n cursorPosition = checkValue.length\n ): string {\n let filledValue = '';\n for (let i = 0; i < cursorPosition; i += 1) {\n if (checkValue.charAt(i) !== FIXED_WIDTH_SPACE) {\n filledValue = filledValue.concat(checkValue[i]);\n } else {\n filledValue = filledValue.concat(exampleValue[i]);\n }\n }\n filledValue = filledValue.concat(exampleValue.substring(cursorPosition));\n\n return filledValue;\n }\n\n /**\n * Checks if a given `value` is valid up until the `cursorPosition`.\n * Uses the examples to build the rest of the string\n * @param checkValue The value to check validity of\n * @param cursorPosition The position of the cursor to check up to\n */\n function isValid(\n checkValue: string,\n cursorPosition = checkValue.length\n ): boolean {\n const patternRegex = new RegExp(pattern);\n if (patternRegex.test(checkValue)) {\n return true;\n }\n\n for (let i = 0; i < examples.length; i += 1) {\n const filledValue = fillValue(checkValue, examples[i], cursorPosition);\n if (patternRegex.test(filledValue)) {\n return true;\n }\n }\n return false;\n }\n\n /**\n * Returns the next segment after the given position\n * @param position The cursor position to start at\n * @returns The new selection range\n */\n function nextSegment(position: number): SelectionSegment {\n const currentSegment = getSegment(position);\n const nextPosition = currentSegment.selectionEnd + 1;\n if (nextPosition >= value.length) {\n return currentSegment;\n }\n\n return getSegment(nextPosition);\n }\n\n /**\n * Returns the previous segment before the given position\n * @param position The cursor position to start at\n * @returns The new selection range\n */\n function previousSegment(position: number): SelectionSegment {\n const currentSegment = getSegment(position);\n const previousPosition = currentSegment.selectionStart - 1;\n if (previousPosition <= 0) {\n return currentSegment;\n }\n\n return getSegment(previousPosition);\n }\n\n function nextSegmentValue(position: number, delta: number): void {\n const segment = getSegment(position);\n const segmentValue = value.substring(\n segment.selectionStart,\n segment.selectionEnd\n );\n const newSegmentValue = getNextSegmentValue(\n segment,\n delta,\n segmentValue,\n value\n );\n const newValue =\n value.substring(0, segment.selectionStart) +\n newSegmentValue +\n value.substring(segment.selectionEnd);\n if (isValid(newValue, segment.selectionEnd)) {\n onChange(newValue);\n onSelect(segment);\n }\n }\n\n function handleSelect(event: React.UIEvent<HTMLInputElement>) {\n const {\n selectionStart = 0,\n selectionEnd = 0,\n selectionDirection = 'none',\n } = event.target as HTMLInputElement;\n\n if (\n selectionStart === null ||\n selectionEnd === null ||\n selectionDirection === null\n ) {\n log.error(\n 'Selection attempted on non-text input element',\n event.target\n );\n return;\n }\n\n log.debug2(\n 'handleSelect',\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n if (\n selection != null &&\n selectionStart === selection.selectionStart &&\n selectionEnd === selection.selectionEnd\n ) {\n return;\n }\n if (selectionStart === selectionEnd) {\n const newSelection = getSegment(selectionStart);\n log.debug(\n 'Selection segment from ',\n selectionStart,\n selectionEnd,\n '=>',\n newSelection\n );\n onSelect(newSelection);\n } else {\n onSelect({ selectionStart, selectionEnd, selectionDirection });\n }\n }\n\n function handleSelectCapture(event: React.UIEvent<HTMLInputElement>) {\n if (!input.current) {\n return;\n }\n log.debug('handleSelectCapture', event);\n const selectionStart = input.current.selectionStart || 0;\n if (\n selectionStart === value.length &&\n selection != null &&\n selectionStart !== selection.selectionStart\n ) {\n event.preventDefault();\n event.stopPropagation();\n }\n }\n\n function handleArrowKey(event: React.KeyboardEvent<HTMLInputElement>) {\n event.preventDefault();\n event.stopPropagation();\n\n if (!input.current) {\n return;\n }\n\n const { key } = event;\n const { selectionStart = 0, selectionEnd = 0 } = input.current;\n if (selectionStart === null || selectionEnd === null) {\n log.error(\n 'Selection arrow nvaigation attempted on non-text input element',\n event.target\n );\n return;\n }\n\n if (key === 'ArrowLeft') {\n onSelect(previousSegment(selectionStart));\n } else if (key === 'ArrowRight') {\n onSelect(nextSegment(selectionEnd));\n } else if (key === 'ArrowUp') {\n nextSegmentValue(selectionStart, -1);\n } else if (key === 'ArrowDown') {\n nextSegmentValue(selectionStart, 1);\n }\n }\n\n function handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>) {\n if (!input.current) {\n return;\n }\n log.debug('handleKeyDown', event);\n const { key } = event;\n const { selectionStart = 0, selectionEnd = 0 } = input.current;\n if (selectionStart === null || selectionEnd === null) {\n log.error(\n 'Selection key event on non-text input element',\n event.target\n );\n return;\n }\n\n if (key.startsWith('Arrow')) {\n handleArrowKey(event);\n return;\n }\n\n if (key === 'Delete' || key === 'Backspace') {\n event.preventDefault();\n event.stopPropagation();\n\n if (selectionStart !== selectionEnd) {\n // Replace all non-masked characters with blanks, set selection to start\n const newValue =\n value.substring(0, selectionStart) +\n value\n .substring(selectionStart, selectionEnd)\n .replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE) +\n value.substring(selectionEnd);\n log.debug(\n 'Range ',\n selectionStart,\n selectionEnd,\n 'deleted, setting value',\n newValue\n );\n\n onChange(newValue);\n onSelect({\n selectionStart,\n selectionEnd: selectionStart,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n } else if (selectionStart > 0) {\n for (let i = selectionStart - 1; i >= 0; i -= 1) {\n // Only replace non placeholder text\n const newValue =\n value.substring(0, i) +\n value\n .substring(i, selectionStart)\n .replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE) +\n value.substring(selectionStart);\n\n if (newValue !== value) {\n onChange(newValue);\n onSelect({\n selectionStart: i,\n selectionEnd: i,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n return;\n }\n }\n }\n\n return;\n }\n\n if (event.altKey || event.metaKey || event.ctrlKey || key.length > 1) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n // Get the different permutations of the character they entered, remove duplicates\n const newChars = Array.from(\n new Set([key, key.toUpperCase(), key.toLowerCase()])\n );\n for (let i = 0; i < newChars.length; i += 1) {\n const newChar = newChars[i];\n\n // If they're typing an alphanumeric character, be smart and allow it to jump ahead\n const maxReplaceIndex = /[a-zA-Z0-9]/g.test(newChar)\n ? value.length - 1\n : selectionStart;\n for (\n let replaceIndex = selectionStart;\n replaceIndex <= maxReplaceIndex;\n replaceIndex += 1\n ) {\n const newValue =\n value.substring(0, replaceIndex) +\n newChar +\n value.substring(replaceIndex + 1);\n if (isValid(newValue, replaceIndex + 1)) {\n const currentSegment = getSegment(replaceIndex);\n const newSelectionStart = replaceIndex + 1;\n let newSelection: SelectionSegment = {\n selectionStart: newSelectionStart,\n selectionEnd: newSelectionStart,\n selectionDirection: SELECTION_DIRECTION.NONE,\n };\n if (newSelectionStart >= currentSegment.selectionEnd) {\n const nextSegmentSelection = nextSegment(replaceIndex);\n if (\n nextSegmentSelection.selectionStart !==\n currentSegment.selectionStart\n ) {\n newSelection = nextSegmentSelection;\n }\n }\n log.debug('handleKeyDown', key, '=>', newValue, newSelection);\n onChange(newValue);\n onSelect(newSelection);\n return;\n }\n }\n }\n }\n\n // Need to use \"text\" type so we can apply a pattern and make selection properly\n return (\n <input\n ref={input}\n className={classNames('form-control masked-input', className)}\n type=\"text\"\n pattern={pattern}\n value={value}\n onChange={() => undefined}\n onKeyDown={handleKeyDown}\n onSelect={handleSelect}\n onSelectCapture={handleSelectCapture}\n onFocus={onFocus}\n onBlur={onBlur}\n />\n );\n }\n);\n\nMaskedInput.defaultProps = {\n className: '',\n onChange(): void {\n // no-op\n },\n onSelect(): void {\n // no-op\n },\n getNextSegmentValue: (range, delta, segmentValue) => segmentValue,\n selection: undefined,\n onFocus(): void {\n // no-op\n },\n onBlur(): void {\n // no-op\n },\n};\n\nexport default MaskedInput;\n"],"file":"MaskedInput.js"}
|
package/dist/Option.js
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
|
|
3
|
-
var Option =
|
|
4
|
-
var
|
|
5
|
-
|
|
3
|
+
var Option = (_ref) => {
|
|
4
|
+
var {
|
|
5
|
+
children,
|
|
6
|
+
value
|
|
7
|
+
} = _ref;
|
|
6
8
|
return /*#__PURE__*/React.createElement("option", {
|
|
7
9
|
value: value
|
|
8
10
|
}, children);
|
package/dist/Option.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Option.tsx"],"names":["React","Option","children","value"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAOA,IAAMC,MAAM,GAAG
|
|
1
|
+
{"version":3,"sources":["../src/Option.tsx"],"names":["React","Option","children","value"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAOA,IAAMC,MAAM,GAAG;AAAA,MAAC;AAAEC,IAAAA,QAAF;AAAYC,IAAAA;AAAZ,GAAD;AAAA,sBACb;AAAQ,IAAA,KAAK,EAAEA;AAAf,KAAuBD,QAAvB,CADa;AAAA,CAAf;;AAIA,eAAeD,MAAf","sourcesContent":["import React from 'react';\n\nexport type OptionProps = {\n children: React.ReactNode;\n value: string;\n};\n\nconst Option = ({ children, value }: OptionProps): JSX.Element => (\n <option value={value}>{children}</option>\n);\n\nexport default Option;\n"],"file":"Option.js"}
|
package/dist/RadioGroup.js
CHANGED
|
@@ -1,15 +1,3 @@
|
|
|
1
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
-
|
|
3
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
-
|
|
5
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
6
|
-
|
|
7
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
8
|
-
|
|
9
|
-
function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
10
|
-
|
|
11
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
12
|
-
|
|
13
1
|
import React, { useState } from 'react';
|
|
14
2
|
import shortid from 'shortid';
|
|
15
3
|
|
|
@@ -20,28 +8,22 @@ import shortid from 'shortid';
|
|
|
20
8
|
* <RadioItem .../>
|
|
21
9
|
* </RadioGroup>
|
|
22
10
|
*/
|
|
23
|
-
var RadioGroup =
|
|
24
|
-
var
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
name: name,
|
|
40
|
-
onChange: child.props.onChange || onChange,
|
|
41
|
-
checked: value === child.props.value,
|
|
42
|
-
disabled: child.props.disabled || disabled
|
|
43
|
-
}) : null;
|
|
44
|
-
}));
|
|
11
|
+
var RadioGroup = props => {
|
|
12
|
+
var {
|
|
13
|
+
children,
|
|
14
|
+
disabled = false,
|
|
15
|
+
name: propsName,
|
|
16
|
+
onChange,
|
|
17
|
+
value = ''
|
|
18
|
+
} = props;
|
|
19
|
+
var [name] = useState(propsName || shortid()); // Need to use "text" type so we can apply a pattern and make selection properly
|
|
20
|
+
|
|
21
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, React.Children.map(children, child => child ? /*#__PURE__*/React.cloneElement(child, {
|
|
22
|
+
name,
|
|
23
|
+
onChange: child.props.onChange || onChange,
|
|
24
|
+
checked: value === child.props.value,
|
|
25
|
+
disabled: child.props.disabled || disabled
|
|
26
|
+
}) : null));
|
|
45
27
|
};
|
|
46
28
|
|
|
47
29
|
export default RadioGroup;
|
package/dist/RadioGroup.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/RadioGroup.tsx"],"names":["React","useState","shortid","RadioGroup","props","children","disabled","
|
|
1
|
+
{"version":3,"sources":["../src/RadioGroup.tsx"],"names":["React","useState","shortid","RadioGroup","props","children","disabled","name","propsName","onChange","value","Children","map","child","cloneElement","checked"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,OAAOC,OAAP,MAAoB,SAApB;;AAkBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMC,UAAU,GAAIC,KAAD,IAAyC;AAC1D,MAAM;AACJC,IAAAA,QADI;AAEJC,IAAAA,QAAQ,GAAG,KAFP;AAGJC,IAAAA,IAAI,EAAEC,SAHF;AAIJC,IAAAA,QAJI;AAKJC,IAAAA,KAAK,GAAG;AALJ,MAMFN,KANJ;AAOA,MAAM,CAACG,IAAD,IAASN,QAAQ,CAACO,SAAS,IAAIN,OAAO,EAArB,CAAvB,CAR0D,CAU1D;;AACA,sBACE,0CACGF,KAAK,CAACW,QAAN,CAAeC,GAAf,CAAmBP,QAAnB,EAA6BQ,KAAK,IACjCA,KAAK,gBACDb,KAAK,CAACc,YAAN,CAAmBD,KAAnB,EAA0B;AACxBN,IAAAA,IADwB;AAExBE,IAAAA,QAAQ,EAAEI,KAAK,CAACT,KAAN,CAAYK,QAAZ,IAAwBA,QAFV;AAGxBM,IAAAA,OAAO,EAAEL,KAAK,KAAKG,KAAK,CAACT,KAAN,CAAYM,KAHP;AAIxBJ,IAAAA,QAAQ,EAAEO,KAAK,CAACT,KAAN,CAAYE,QAAZ,IAAwBA;AAJV,GAA1B,CADC,GAOD,IARL,CADH,CADF;AAcD,CAzBD;;AA2BA,eAAeH,UAAf","sourcesContent":["import React, { useState } from 'react';\nimport shortid from 'shortid';\n\ntype RadioGroupProps = {\n /** The radio items to populate this radio. Should be of type RadioItem. */\n children?: React.ReactElement | React.ReactElement[];\n\n /** The name to use for the radio items. If not specified, a name is automatically generated */\n name?: string;\n\n /** Triggered when a radio button is changed */\n onChange: React.ChangeEventHandler<HTMLInputElement>;\n\n /** The currently selected value. Will automatically set the `checked` attribute of the RadioItem. */\n value?: string;\n\n disabled?: boolean;\n};\n\n/**\n * A group of radio buttons. Use with RadioItems to populate, eg.\n * <RadioGroup>\n * <RadioItem .../>\n * <RadioItem .../>\n * </RadioGroup>\n */\nconst RadioGroup = (props: RadioGroupProps): JSX.Element => {\n const {\n children,\n disabled = false,\n name: propsName,\n onChange,\n value = '',\n } = props;\n const [name] = useState(propsName || shortid());\n\n // Need to use \"text\" type so we can apply a pattern and make selection properly\n return (\n <>\n {React.Children.map(children, child =>\n child\n ? React.cloneElement(child, {\n name,\n onChange: child.props.onChange || onChange,\n checked: value === child.props.value,\n disabled: child.props.disabled || disabled,\n })\n : null\n )}\n </>\n );\n};\n\nexport default RadioGroup;\n"],"file":"RadioGroup.js"}
|
package/dist/RadioItem.js
CHANGED
|
@@ -1,15 +1,3 @@
|
|
|
1
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
-
|
|
3
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
-
|
|
5
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
6
|
-
|
|
7
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
8
|
-
|
|
9
|
-
function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
10
|
-
|
|
11
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
12
|
-
|
|
13
1
|
import React, { useState } from 'react';
|
|
14
2
|
import classNames from 'classnames';
|
|
15
3
|
import shortid from 'shortid';
|
|
@@ -17,27 +5,20 @@ import shortid from 'shortid';
|
|
|
17
5
|
/**
|
|
18
6
|
* A RadioItem to be used within the Radio component.
|
|
19
7
|
*/
|
|
20
|
-
var RadioItem = /*#__PURE__*/React.forwardRef(
|
|
21
|
-
var
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
onChange = props.onChange,
|
|
35
|
-
value = props.value;
|
|
36
|
-
|
|
37
|
-
var _useState = useState(shortid()),
|
|
38
|
-
_useState2 = _slicedToArray(_useState, 1),
|
|
39
|
-
id = _useState2[0];
|
|
40
|
-
|
|
8
|
+
var RadioItem = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
9
|
+
var {
|
|
10
|
+
checked,
|
|
11
|
+
children,
|
|
12
|
+
className = '',
|
|
13
|
+
disabled = false,
|
|
14
|
+
inputClassName = '',
|
|
15
|
+
isInvalid = false,
|
|
16
|
+
labelClassName = '',
|
|
17
|
+
name,
|
|
18
|
+
onChange,
|
|
19
|
+
value
|
|
20
|
+
} = props;
|
|
21
|
+
var [id] = useState(shortid());
|
|
41
22
|
return /*#__PURE__*/React.createElement("div", {
|
|
42
23
|
className: classNames('custom-control custom-radio', className)
|
|
43
24
|
}, /*#__PURE__*/React.createElement("input", {
|
package/dist/RadioItem.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/RadioItem.tsx"],"names":["React","useState","classNames","shortid","RadioItem","forwardRef","props","ref","checked","children","className","disabled","inputClassName","isInvalid","labelClassName","name","onChange","value","id","displayName","defaultProps","undefined"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../src/RadioItem.tsx"],"names":["React","useState","classNames","shortid","RadioItem","forwardRef","props","ref","checked","children","className","disabled","inputClassName","isInvalid","labelClassName","name","onChange","value","id","displayName","defaultProps","undefined"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,OAAP,MAAoB,SAApB;;AAkCA;AACA;AACA;AACA,IAAMC,SAAS,gBAAGJ,KAAK,CAACK,UAAN,CAChB,CAACC,KAAD,EAAwBC,GAAxB,KAAgC;AAC9B,MAAM;AACJC,IAAAA,OADI;AAEJC,IAAAA,QAFI;AAGJC,IAAAA,SAAS,GAAG,EAHR;AAIJC,IAAAA,QAAQ,GAAG,KAJP;AAKJC,IAAAA,cAAc,GAAG,EALb;AAMJC,IAAAA,SAAS,GAAG,KANR;AAOJC,IAAAA,cAAc,GAAG,EAPb;AAQJC,IAAAA,IARI;AASJC,IAAAA,QATI;AAUJC,IAAAA;AAVI,MAWFX,KAXJ;AAaA,MAAM,CAACY,EAAD,IAAOjB,QAAQ,CAACE,OAAO,EAAR,CAArB;AAEA,sBACE;AAAK,IAAA,SAAS,EAAED,UAAU,CAAC,6BAAD,EAAgCQ,SAAhC;AAA1B,kBACE;AACE,IAAA,IAAI,EAAC,OADP;AAEE,IAAA,EAAE,EAAEQ,EAFN;AAGE,IAAA,IAAI,EAAEH,IAHR;AAIE,IAAA,GAAG,EAAER,GAJP;AAKE,IAAA,SAAS,EAAEL,UAAU,CAAC,sBAAD,EAAyBU,cAAzB,EAAyC;AAC5D,oBAAcC;AAD8C,KAAzC,CALvB;AAQE,IAAA,OAAO,EAAEL,OARX;AASE,IAAA,QAAQ,EAAEG,QATZ;AAUE,IAAA,KAAK,EAAEM,KAVT;AAWE,IAAA,QAAQ,EAAED;AAXZ,IADF,eAcE;AACE,IAAA,SAAS,EAAEd,UAAU,CAAC,sBAAD,EAAyBY,cAAzB,CADvB;AAEE,IAAA,OAAO,EAAEI;AAFX,KAIGT,QAJH,CAdF,CADF;AAuBD,CAxCe,CAAlB;AA2CAL,SAAS,CAACe,WAAV,GAAwB,WAAxB;AAEAf,SAAS,CAACgB,YAAV,GAAyB;AACvBZ,EAAAA,OAAO,EAAEa,SADc;AAEvBX,EAAAA,SAAS,EAAE,EAFY;AAGvBC,EAAAA,QAAQ,EAAE,KAHa;AAIvBC,EAAAA,cAAc,EAAE,EAJO;AAKvBC,EAAAA,SAAS,EAAE,KALY;AAMvBC,EAAAA,cAAc,EAAE,EANO;AAOvBC,EAAAA,IAAI,EAAEM,SAPiB;AAQvBL,EAAAA,QAAQ,EAAEK;AARa,CAAzB;AAWA,eAAejB,SAAf","sourcesContent":["import React, { useState } from 'react';\nimport classNames from 'classnames';\nimport shortid from 'shortid';\n\ntype RadioItemProps = {\n /** Whether this value is currently checked or not */\n checked?: boolean;\n\n /** The node/text to put in the label of this radio item */\n children: React.ReactNode;\n\n /** An extra class name to add to the outer div component */\n className?: string;\n\n /** An extra class for disabling the radio button component */\n disabled?: boolean;\n\n /** An extra class name for the input component */\n inputClassName?: string;\n\n /** The value is invalid, style to show it's invalid */\n isInvalid?: boolean;\n\n /** An extra class name for the label component */\n labelClassName?: string;\n\n /** The name for this RadioItem. Should be specified by the parent Radio component */\n name?: string;\n\n /** Triggered when the input is checked/unchecked. Provided by the parent Radio component. */\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n\n /** The value to associate with this radio item */\n value: string;\n};\n\n/**\n * A RadioItem to be used within the Radio component.\n */\nconst RadioItem = React.forwardRef<HTMLInputElement, RadioItemProps>(\n (props: RadioItemProps, ref) => {\n const {\n checked,\n children,\n className = '',\n disabled = false,\n inputClassName = '',\n isInvalid = false,\n labelClassName = '',\n name,\n onChange,\n value,\n } = props;\n\n const [id] = useState(shortid());\n\n return (\n <div className={classNames('custom-control custom-radio', className)}>\n <input\n type=\"radio\"\n id={id}\n name={name}\n ref={ref}\n className={classNames('custom-control-input', inputClassName, {\n 'is-invalid': isInvalid,\n })}\n checked={checked}\n disabled={disabled}\n value={value}\n onChange={onChange}\n />\n <label\n className={classNames('custom-control-label', labelClassName)}\n htmlFor={id}\n >\n {children}\n </label>\n </div>\n );\n }\n);\n\nRadioItem.displayName = 'RadioItem';\n\nRadioItem.defaultProps = {\n checked: undefined,\n className: '',\n disabled: false,\n inputClassName: '',\n isInvalid: false,\n labelClassName: '',\n name: undefined,\n onChange: undefined,\n};\n\nexport default RadioItem;\n"],"file":"RadioItem.js"}
|