@deephaven/components 0.32.1-lsp.3 → 0.33.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/BaseStyleSheet.css +1 -8
- package/css/BaseStyleSheet.css.map +1 -1
- package/dist/Button.d.ts +1 -1
- package/dist/DateTimeInput.d.ts +2 -3
- package/dist/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput.js +6 -7
- package/dist/DateTimeInput.js.map +1 -1
- package/dist/DateTimeInputUtils.d.ts +2 -0
- package/dist/DateTimeInputUtils.d.ts.map +1 -0
- package/dist/DateTimeInputUtils.js +8 -0
- package/dist/DateTimeInputUtils.js.map +1 -0
- package/dist/MaskedInput.d.ts +3 -17
- package/dist/MaskedInput.d.ts.map +1 -1
- package/dist/MaskedInput.js +6 -34
- package/dist/MaskedInput.js.map +1 -1
- package/dist/MaskedInputUtils.d.ts +17 -0
- package/dist/MaskedInputUtils.d.ts.map +1 -0
- package/dist/MaskedInputUtils.js +36 -0
- package/dist/MaskedInputUtils.js.map +1 -0
- package/dist/TimeInput.d.ts.map +1 -1
- package/dist/TimeInput.js +2 -1
- package/dist/TimeInput.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/package.json +8 -8
- package/scss/BaseStyleSheet.scss +1 -10
package/dist/Button.d.ts
CHANGED
|
@@ -30,6 +30,6 @@ type IconOnlyButtonJsxTooltip = BaseButtonProps & {
|
|
|
30
30
|
icon: IconDefinition | JSX.Element;
|
|
31
31
|
children?: undefined;
|
|
32
32
|
};
|
|
33
|
-
declare const Button: React.ForwardRefExoticComponent<(Pick<ButtonWithChildren, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "children" | "tooltip" | "onClick" | "tabIndex" | "role" | "spellCheck" | "id" | "onMouseDown" | "onPaste" | "autoFocus" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "kind" | "variant" | "icon" | "active"> | Pick<IconOnlyButtonStringTooltip, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "children" | "tooltip" | "onClick" | "tabIndex" | "role" | "spellCheck" | "id" | "onMouseDown" | "onPaste" | "autoFocus" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "kind" | "variant" | "icon" | "active"> | Pick<IconOnlyButtonJsxTooltip, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "children" | "tooltip" | "onClick" | "tabIndex" | "role" | "spellCheck" | "id" | "onMouseDown" | "onPaste" | "autoFocus" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "kind" | "variant" | "icon" | "active">) & React.RefAttributes<HTMLButtonElement>>;
|
|
33
|
+
declare const Button: React.ForwardRefExoticComponent<(Pick<ButtonWithChildren, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "children" | "tooltip" | "onClick" | "tabIndex" | "role" | "spellCheck" | "id" | "onMouseDown" | "onPaste" | "autoFocus" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "kind" | "variant" | "icon" | "active"> | Pick<IconOnlyButtonStringTooltip, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "children" | "tooltip" | "onClick" | "tabIndex" | "role" | "spellCheck" | "id" | "onMouseDown" | "onPaste" | "autoFocus" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "kind" | "variant" | "icon" | "active"> | Pick<IconOnlyButtonJsxTooltip, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "children" | "tooltip" | "onClick" | "tabIndex" | "role" | "spellCheck" | "id" | "onMouseDown" | "onPaste" | "autoFocus" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "kind" | "variant" | "icon" | "active">) & React.RefAttributes<HTMLButtonElement>>;
|
|
34
34
|
export default Button;
|
|
35
35
|
//# sourceMappingURL=Button.d.ts.map
|
package/dist/DateTimeInput.d.ts
CHANGED
|
@@ -1,14 +1,13 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { KeyboardEvent } from 'react';
|
|
2
2
|
type DateTimeInputProps = {
|
|
3
3
|
className?: string;
|
|
4
4
|
onChange?(value?: string): void;
|
|
5
5
|
defaultValue?: string;
|
|
6
6
|
onFocus?(): void;
|
|
7
7
|
onBlur?(): void;
|
|
8
|
+
onSubmit?(event?: KeyboardEvent<HTMLInputElement>): void;
|
|
8
9
|
'data-testid'?: string;
|
|
9
10
|
};
|
|
10
|
-
export declare function fixIncompleteValue(value: string): string;
|
|
11
|
-
export declare function addSeparators(value: string): string;
|
|
12
11
|
declare const DateTimeInput: React.ForwardRefExoticComponent<DateTimeInputProps & React.RefAttributes<HTMLInputElement>>;
|
|
13
12
|
export default DateTimeInput;
|
|
14
13
|
//# sourceMappingURL=DateTimeInput.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../src/DateTimeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../src/DateTimeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAyB,MAAM,OAAO,CAAC;AAoBpE,KAAK,kBAAkB,GAAG;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,IAAI,IAAI,CAAC;IACjB,MAAM,CAAC,IAAI,IAAI,CAAC;IAChB,QAAQ,CAAC,CAAC,KAAK,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC;IACzD,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAiBF,QAAA,MAAM,aAAa,6FAyDlB,CAAC;AAaF,eAAe,aAAa,CAAC"}
|
package/dist/DateTimeInput.js
CHANGED
|
@@ -3,6 +3,7 @@ import classNames from 'classnames';
|
|
|
3
3
|
import Log from '@deephaven/log';
|
|
4
4
|
import MaskedInput from "./MaskedInput.js";
|
|
5
5
|
import { getNextSegmentValue } from "./DateInputUtils.js";
|
|
6
|
+
import { addSeparators } from "./DateTimeInputUtils.js";
|
|
6
7
|
var log = Log.module('DateTimeInput');
|
|
7
8
|
|
|
8
9
|
// This could be more restrictive and restrict days to the number of days in the month...
|
|
@@ -14,19 +15,15 @@ var FULL_DATE_PATTERN = "".concat(DATE_PATTERN, " ").concat(TIME_PATTERN);
|
|
|
14
15
|
var DATE_VALUE_STRING = '2022-01-01';
|
|
15
16
|
var DEFAULT_VALUE_STRING = "".concat(DATE_VALUE_STRING, " 00:00:00.000000000");
|
|
16
17
|
var FULL_DATE_FORMAT = 'YYYY-MM-DD HH:MM:SS.SSSSSSSSS';
|
|
17
|
-
|
|
18
|
+
function fixIncompleteValue(value) {
|
|
18
19
|
if (value != null && value.length >= DATE_VALUE_STRING.length) {
|
|
19
20
|
return "".concat(value.substring(0, DATE_VALUE_STRING.length)).concat(value.substring(DATE_VALUE_STRING.length).replace(/\u2007/g, '0')).concat(DEFAULT_VALUE_STRING.substring(value.length));
|
|
20
21
|
}
|
|
21
22
|
return value;
|
|
22
23
|
}
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
var micros = value.substring(23, 26);
|
|
26
|
-
var nanos = value.substring(26);
|
|
27
|
-
return [dateTimeMillis, micros, nanos].filter(v => v !== '').join('\u200B');
|
|
24
|
+
function removeSeparators(value) {
|
|
25
|
+
return value.replace(/\u200B/g, '');
|
|
28
26
|
}
|
|
29
|
-
var removeSeparators = value => value.replace(/\u200B/g, '');
|
|
30
27
|
var EXAMPLES = [addSeparators(DEFAULT_VALUE_STRING)];
|
|
31
28
|
var DateTimeInput = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
32
29
|
var {
|
|
@@ -35,6 +32,7 @@ var DateTimeInput = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
35
32
|
defaultValue = '',
|
|
36
33
|
onFocus = () => undefined,
|
|
37
34
|
onBlur = () => undefined,
|
|
35
|
+
onSubmit,
|
|
38
36
|
'data-testid': dataTestId
|
|
39
37
|
} = props;
|
|
40
38
|
var [value, setValue] = useState(defaultValue.length > 0 ? addSeparators(defaultValue) : '');
|
|
@@ -63,6 +61,7 @@ var DateTimeInput = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
63
61
|
getNextSegmentValue: getNextSegmentValue,
|
|
64
62
|
onChange: handleChange,
|
|
65
63
|
onSelect: setSelection,
|
|
64
|
+
onSubmit: onSubmit,
|
|
66
65
|
pattern: FULL_DATE_PATTERN,
|
|
67
66
|
placeholder: FULL_DATE_FORMAT,
|
|
68
67
|
selection: selection,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimeInput.js","names":["React","useCallback","useState","classNames","Log","MaskedInput","getNextSegmentValue","log","module","DATE_PATTERN","TIME_PATTERN","FULL_DATE_PATTERN","DATE_VALUE_STRING","DEFAULT_VALUE_STRING","FULL_DATE_FORMAT","fixIncompleteValue","value","length","substring","replace","
|
|
1
|
+
{"version":3,"file":"DateTimeInput.js","names":["React","useCallback","useState","classNames","Log","MaskedInput","getNextSegmentValue","addSeparators","log","module","DATE_PATTERN","TIME_PATTERN","FULL_DATE_PATTERN","DATE_VALUE_STRING","DEFAULT_VALUE_STRING","FULL_DATE_FORMAT","fixIncompleteValue","value","length","substring","replace","removeSeparators","EXAMPLES","DateTimeInput","forwardRef","props","ref","className","onChange","undefined","defaultValue","onFocus","onBlur","onSubmit","dataTestId","setValue","selection","setSelection","handleChange","newValue","debug","handleBlur","prevValue","fixedValue","displayName","defaultProps"],"sources":["../src/DateTimeInput.tsx"],"sourcesContent":["import React, { KeyboardEvent, useCallback, useState } from 'react';\nimport classNames from 'classnames';\nimport Log from '@deephaven/log';\nimport MaskedInput, { SelectionSegment } from './MaskedInput';\nimport { getNextSegmentValue } from './DateInputUtils';\nimport { addSeparators } from './DateTimeInputUtils';\n\nconst log = Log.module('DateTimeInput');\n\n// This could be more restrictive and restrict days to the number of days in the month...\n// But then gotta take leap year into account and everything.\nconst DATE_PATTERN = '[12][0-9]{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])';\n// Put zero width spaces in the nanosecond part of the date to allow jumping between segments\nconst TIME_PATTERN =\n '([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]\\\\.[0-9]{3}\\u200B[0-9]{3}\\u200B[0-9]{3}';\nconst FULL_DATE_PATTERN = `${DATE_PATTERN} ${TIME_PATTERN}`;\nconst DATE_VALUE_STRING = '2022-01-01';\nconst DEFAULT_VALUE_STRING = `${DATE_VALUE_STRING} 00:00:00.000000000`;\nconst FULL_DATE_FORMAT = 'YYYY-MM-DD HH:MM:SS.SSSSSSSSS';\n\ntype DateTimeInputProps = {\n className?: string;\n onChange?(value?: string): void;\n defaultValue?: string;\n onFocus?(): void;\n onBlur?(): void;\n onSubmit?(event?: KeyboardEvent<HTMLInputElement>): void;\n 'data-testid'?: string;\n};\n\nfunction fixIncompleteValue(value: string): string {\n if (value != null && value.length >= DATE_VALUE_STRING.length) {\n return `${value.substring(0, DATE_VALUE_STRING.length)}${value\n .substring(DATE_VALUE_STRING.length)\n .replace(/\\u2007/g, '0')}${DEFAULT_VALUE_STRING.substring(value.length)}`;\n }\n return value;\n}\n\nfunction removeSeparators(value: string): string {\n return value.replace(/\\u200B/g, '');\n}\n\nconst EXAMPLES = [addSeparators(DEFAULT_VALUE_STRING)];\n\nconst DateTimeInput = React.forwardRef<HTMLInputElement, DateTimeInputProps>(\n (props: DateTimeInputProps, ref) => {\n const {\n className = '',\n onChange = () => undefined,\n defaultValue = '',\n onFocus = () => undefined,\n onBlur = () => undefined,\n onSubmit,\n 'data-testid': dataTestId,\n } = props;\n const [value, setValue] = useState(\n defaultValue.length > 0 ? addSeparators(defaultValue) : ''\n );\n const [selection, setSelection] = useState<SelectionSegment>();\n\n const handleChange = useCallback(\n (newValue: string): void => {\n log.debug('handleChange', newValue);\n setValue(newValue);\n onChange(fixIncompleteValue(removeSeparators(newValue)));\n },\n [onChange]\n );\n\n const handleBlur = useCallback((): void => {\n const prevValue = removeSeparators(value);\n const fixedValue = fixIncompleteValue(prevValue);\n // Update the value displayed in the input\n // onChange with the fixed value already triggered in handleChange\n if (fixedValue !== prevValue) {\n setValue(addSeparators(fixedValue));\n }\n onBlur();\n }, [value, onBlur]);\n\n return (\n <div className=\"d-flex flex-row align-items-center\">\n <MaskedInput\n ref={ref}\n className={classNames(className)}\n example={EXAMPLES}\n getNextSegmentValue={getNextSegmentValue}\n onChange={handleChange}\n onSelect={setSelection}\n onSubmit={onSubmit}\n pattern={FULL_DATE_PATTERN}\n placeholder={FULL_DATE_FORMAT}\n selection={selection}\n value={value}\n onFocus={onFocus}\n onBlur={handleBlur}\n data-testid={dataTestId}\n />\n </div>\n );\n }\n);\n\nDateTimeInput.displayName = 'DateTimeInput';\n\nDateTimeInput.defaultProps = {\n className: '',\n onChange: () => undefined,\n defaultValue: '',\n onFocus: () => undefined,\n onBlur: () => undefined,\n 'data-testid': undefined,\n};\n\nexport default DateTimeInput;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAmBC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AACnE,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,GAAG,MAAM,gBAAgB;AAAC,OAC1BC,WAAW;AAAA,SACTC,mBAAmB;AAAA,SACnBC,aAAa;AAEtB,IAAMC,GAAG,GAAGJ,GAAG,CAACK,MAAM,CAAC,eAAe,CAAC;;AAEvC;AACA;AACA,IAAMC,YAAY,GAAG,yDAAyD;AAC9E;AACA,IAAMC,YAAY,GAChB,iFAAiF;AACnF,IAAMC,iBAAiB,aAAMF,YAAY,cAAIC,YAAY,CAAE;AAC3D,IAAME,iBAAiB,GAAG,YAAY;AACtC,IAAMC,oBAAoB,aAAMD,iBAAiB,wBAAqB;AACtE,IAAME,gBAAgB,GAAG,+BAA+B;AAYxD,SAASC,kBAAkB,CAACC,KAAa,EAAU;EACjD,IAAIA,KAAK,IAAI,IAAI,IAAIA,KAAK,CAACC,MAAM,IAAIL,iBAAiB,CAACK,MAAM,EAAE;IAC7D,iBAAUD,KAAK,CAACE,SAAS,CAAC,CAAC,EAAEN,iBAAiB,CAACK,MAAM,CAAC,SAAGD,KAAK,CAC3DE,SAAS,CAACN,iBAAiB,CAACK,MAAM,CAAC,CACnCE,OAAO,CAAC,SAAS,EAAE,GAAG,CAAC,SAAGN,oBAAoB,CAACK,SAAS,CAACF,KAAK,CAACC,MAAM,CAAC;EAC3E;EACA,OAAOD,KAAK;AACd;AAEA,SAASI,gBAAgB,CAACJ,KAAa,EAAU;EAC/C,OAAOA,KAAK,CAACG,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC;AACrC;AAEA,IAAME,QAAQ,GAAG,CAACf,aAAa,CAACO,oBAAoB,CAAC,CAAC;AAEtD,IAAMS,aAAa,gBAAGvB,KAAK,CAACwB,UAAU,CACpC,CAACC,KAAyB,EAAEC,GAAG,KAAK;EAClC,IAAM;IACJC,SAAS,GAAG,EAAE;IACdC,QAAQ,GAAG,MAAMC,SAAS;IAC1BC,YAAY,GAAG,EAAE;IACjBC,OAAO,GAAG,MAAMF,SAAS;IACzBG,MAAM,GAAG,MAAMH,SAAS;IACxBI,QAAQ;IACR,aAAa,EAAEC;EACjB,CAAC,GAAGT,KAAK;EACT,IAAM,CAACR,KAAK,EAAEkB,QAAQ,CAAC,GAAGjC,QAAQ,CAChC4B,YAAY,CAACZ,MAAM,GAAG,CAAC,GAAGX,aAAa,CAACuB,YAAY,CAAC,GAAG,EAAE,CAC3D;EACD,IAAM,CAACM,SAAS,EAAEC,YAAY,CAAC,GAAGnC,QAAQ,EAAoB;EAE9D,IAAMoC,YAAY,GAAGrC,WAAW,CAC7BsC,QAAgB,IAAW;IAC1B/B,GAAG,CAACgC,KAAK,CAAC,cAAc,EAAED,QAAQ,CAAC;IACnCJ,QAAQ,CAACI,QAAQ,CAAC;IAClBX,QAAQ,CAACZ,kBAAkB,CAACK,gBAAgB,CAACkB,QAAQ,CAAC,CAAC,CAAC;EAC1D,CAAC,EACD,CAACX,QAAQ,CAAC,CACX;EAED,IAAMa,UAAU,GAAGxC,WAAW,CAAC,MAAY;IACzC,IAAMyC,SAAS,GAAGrB,gBAAgB,CAACJ,KAAK,CAAC;IACzC,IAAM0B,UAAU,GAAG3B,kBAAkB,CAAC0B,SAAS,CAAC;IAChD;IACA;IACA,IAAIC,UAAU,KAAKD,SAAS,EAAE;MAC5BP,QAAQ,CAAC5B,aAAa,CAACoC,UAAU,CAAC,CAAC;IACrC;IACAX,MAAM,EAAE;EACV,CAAC,EAAE,CAACf,KAAK,EAAEe,MAAM,CAAC,CAAC;EAEnB,oBACE;IAAK,SAAS,EAAC;EAAoC,gBACjD,oBAAC,WAAW;IACV,GAAG,EAAEN,GAAI;IACT,SAAS,EAAEvB,UAAU,CAACwB,SAAS,CAAE;IACjC,OAAO,EAAEL,QAAS;IAClB,mBAAmB,EAAEhB,mBAAoB;IACzC,QAAQ,EAAEgC,YAAa;IACvB,QAAQ,EAAED,YAAa;IACvB,QAAQ,EAAEJ,QAAS;IACnB,OAAO,EAAErB,iBAAkB;IAC3B,WAAW,EAAEG,gBAAiB;IAC9B,SAAS,EAAEqB,SAAU;IACrB,KAAK,EAAEnB,KAAM;IACb,OAAO,EAAEc,OAAQ;IACjB,MAAM,EAAEU,UAAW;IACnB,eAAaP;EAAW,EACxB,CACE;AAEV,CAAC,CACF;AAEDX,aAAa,CAACqB,WAAW,GAAG,eAAe;AAE3CrB,aAAa,CAACsB,YAAY,GAAG;EAC3BlB,SAAS,EAAE,EAAE;EACbC,QAAQ,EAAE,MAAMC,SAAS;EACzBC,YAAY,EAAE,EAAE;EAChBC,OAAO,EAAE,MAAMF,SAAS;EACxBG,MAAM,EAAE,MAAMH,SAAS;EACvB,aAAa,EAAEA;AACjB,CAAC;AAED,eAAeN,aAAa"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateTimeInputUtils.d.ts","sourceRoot":"","sources":["../src/DateTimeInputUtils.ts"],"names":[],"mappings":"AACA,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAKnD"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/* eslint-disable import/prefer-default-export */
|
|
2
|
+
export function addSeparators(value) {
|
|
3
|
+
var dateTimeMillis = value.substring(0, 23);
|
|
4
|
+
var micros = value.substring(23, 26);
|
|
5
|
+
var nanos = value.substring(26);
|
|
6
|
+
return [dateTimeMillis, micros, nanos].filter(v => v !== '').join('\u200B');
|
|
7
|
+
}
|
|
8
|
+
//# sourceMappingURL=DateTimeInputUtils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateTimeInputUtils.js","names":["addSeparators","value","dateTimeMillis","substring","micros","nanos","filter","v","join"],"sources":["../src/DateTimeInputUtils.ts"],"sourcesContent":["/* eslint-disable import/prefer-default-export */\nexport function addSeparators(value: string): string {\n const dateTimeMillis = value.substring(0, 23);\n const micros = value.substring(23, 26);\n const nanos = value.substring(26);\n return [dateTimeMillis, micros, nanos].filter(v => v !== '').join('\\u200B');\n}\n"],"mappings":"AAAA;AACA,OAAO,SAASA,aAAa,CAACC,KAAa,EAAU;EACnD,IAAMC,cAAc,GAAGD,KAAK,CAACE,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC;EAC7C,IAAMC,MAAM,GAAGH,KAAK,CAACE,SAAS,CAAC,EAAE,EAAE,EAAE,CAAC;EACtC,IAAME,KAAK,GAAGJ,KAAK,CAACE,SAAS,CAAC,EAAE,CAAC;EACjC,OAAO,CAACD,cAAc,EAAEE,MAAM,EAAEC,KAAK,CAAC,CAACC,MAAM,CAACC,CAAC,IAAIA,CAAC,KAAK,EAAE,CAAC,CAACC,IAAI,CAAC,QAAQ,CAAC;AAC7E"}
|
package/dist/MaskedInput.d.ts
CHANGED
|
@@ -1,26 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { KeyboardEvent } from 'react';
|
|
2
2
|
import './MaskedInput.scss';
|
|
3
3
|
declare const SELECTION_DIRECTION: {
|
|
4
4
|
readonly FORWARD: "forward";
|
|
5
5
|
readonly BACKWARD: "backward";
|
|
6
6
|
readonly NONE: "none";
|
|
7
7
|
};
|
|
8
|
-
export declare function DEFAULT_GET_PREFERRED_REPLACEMENT_STRING(value: string, replaceIndex: number, newChar: string): string;
|
|
9
|
-
/**
|
|
10
|
-
* Fill the string on the right side with the example value to the given length
|
|
11
|
-
* @param checkValue Initial string to pad
|
|
12
|
-
* @param exampleValue Example value
|
|
13
|
-
* @param length Target length
|
|
14
|
-
* @returns String padded with the given example value
|
|
15
|
-
*/
|
|
16
|
-
export declare function fillToLength(checkValue: string, exampleValue: string, length: number): string;
|
|
17
|
-
/**
|
|
18
|
-
* Trim all characters matching the empty mask on the right side of the given value
|
|
19
|
-
* @param value String to trim
|
|
20
|
-
* @param emptyMask Empty mask
|
|
21
|
-
* @returns Trimmed string
|
|
22
|
-
*/
|
|
23
|
-
export declare function trimTrailingMask(value: string, emptyMask: string): string;
|
|
24
8
|
export type SelectionSegment = {
|
|
25
9
|
selectionStart: number;
|
|
26
10
|
selectionEnd: number;
|
|
@@ -43,6 +27,8 @@ type MaskedInputProps = {
|
|
|
43
27
|
onChange?(value: string): void;
|
|
44
28
|
/** Called when selection changes */
|
|
45
29
|
onSelect?(segment: SelectionSegment): void;
|
|
30
|
+
/** Called when enter is pressed */
|
|
31
|
+
onSubmit?(event?: KeyboardEvent<HTMLInputElement>): void;
|
|
46
32
|
/** Retrieve the next value for a provided segment */
|
|
47
33
|
getNextSegmentValue?(segment: SelectionSegment, delta: number, segmentValue: string, value: string): string;
|
|
48
34
|
getPreferredReplacementString?(value: string, replaceIndex: number, replaceChar: string, selectionStart: number, selectionEnd: number): string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MaskedInput.d.ts","sourceRoot":"","sources":["../src/MaskedInput.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"MaskedInput.d.ts","sourceRoot":"","sources":["../src/MaskedInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAmC,aAAa,EAAE,MAAM,OAAO,CAAC;AAS9E,OAAO,oBAAoB,CAAC;AAI5B,QAAA,MAAM,mBAAmB;;;;CAIf,CAAC;AAQX,MAAM,MAAM,gBAAgB,GAAG;IAC7B,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;IACrB,kBAAkB,CAAC,EAAE,OAAO,mBAAmB,CAAC,MAAM,OAAO,mBAAmB,CAAC,CAAC;CACnF,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qDAAqD;IACrD,OAAO,EAAE,MAAM,CAAC;IAChB,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,2IAA2I;IAC3I,OAAO,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC3B,iDAAiD;IACjD,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,6EAA6E;IAC7E,QAAQ,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,oCAAoC;IACpC,QAAQ,CAAC,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAC3C,mCAAmC;IACnC,QAAQ,CAAC,CAAC,KAAK,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC;IACzD,qDAAqD;IACrD,mBAAmB,CAAC,CAClB,OAAO,EAAE,gBAAgB,EACzB,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,MAAM,EACpB,KAAK,EAAE,MAAM,GACZ,MAAM,CAAC;IACV,6BAA6B,CAAC,CAC5B,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,MAAM,EACpB,WAAW,EAAE,MAAM,EACnB,cAAc,EAAE,MAAM,EACtB,YAAY,EAAE,MAAM,GACnB,MAAM,CAAC;IACV,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAEjC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF;;;GAGG;AAIH,QAAA,MAAM,WAAW,2FA4dhB,CAAC;AAuBF,eAAe,WAAW,CAAC"}
|
package/dist/MaskedInput.js
CHANGED
|
@@ -7,6 +7,7 @@ import React, { useMemo, useEffect, useCallback } from 'react';
|
|
|
7
7
|
import classNames from 'classnames';
|
|
8
8
|
import Log from '@deephaven/log';
|
|
9
9
|
import { useForwardedRef } from '@deephaven/react-hooks';
|
|
10
|
+
import { DEFAULT_GET_PREFERRED_REPLACEMENT_STRING, fillToLength, trimTrailingMask } from "./MaskedInputUtils.js";
|
|
10
11
|
import "./MaskedInput.css";
|
|
11
12
|
var log = Log.module('MaskedInput');
|
|
12
13
|
var SELECTION_DIRECTION = {
|
|
@@ -20,40 +21,6 @@ var SELECTION_DIRECTION = {
|
|
|
20
21
|
* https://www.fileformat.info/info/unicode/char/2007/index.htm
|
|
21
22
|
*/
|
|
22
23
|
var FIXED_WIDTH_SPACE = '\u2007';
|
|
23
|
-
export function DEFAULT_GET_PREFERRED_REPLACEMENT_STRING(value, replaceIndex, newChar) {
|
|
24
|
-
return value.substring(0, replaceIndex) + newChar + value.substring(replaceIndex + 1);
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
/**
|
|
28
|
-
* Fill the string on the right side with the example value to the given length
|
|
29
|
-
* @param checkValue Initial string to pad
|
|
30
|
-
* @param exampleValue Example value
|
|
31
|
-
* @param length Target length
|
|
32
|
-
* @returns String padded with the given example value
|
|
33
|
-
*/
|
|
34
|
-
export function fillToLength(checkValue, exampleValue, length) {
|
|
35
|
-
return checkValue.length < length ? "".concat(checkValue).concat(exampleValue.substring(checkValue.length, length)) : checkValue;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* Trim all characters matching the empty mask on the right side of the given value
|
|
40
|
-
* @param value String to trim
|
|
41
|
-
* @param emptyMask Empty mask
|
|
42
|
-
* @returns Trimmed string
|
|
43
|
-
*/
|
|
44
|
-
export function trimTrailingMask(value, emptyMask) {
|
|
45
|
-
var {
|
|
46
|
-
length
|
|
47
|
-
} = value;
|
|
48
|
-
for (var i = value.length - 1; i >= 0; i -= 1) {
|
|
49
|
-
if (emptyMask[i] === value[i]) {
|
|
50
|
-
length = i;
|
|
51
|
-
} else {
|
|
52
|
-
break;
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
return value.substring(0, length);
|
|
56
|
-
}
|
|
57
24
|
/**
|
|
58
25
|
* A masked input for entering data from a template.
|
|
59
26
|
* Won't work by itself, must use within another component and handle updating the value/selection.
|
|
@@ -69,6 +36,7 @@ var MaskedInput = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
69
36
|
getPreferredReplacementString = DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,
|
|
70
37
|
onChange = () => false,
|
|
71
38
|
onSelect = () => false,
|
|
39
|
+
onSubmit,
|
|
72
40
|
pattern,
|
|
73
41
|
placeholder,
|
|
74
42
|
selection,
|
|
@@ -290,6 +258,10 @@ var MaskedInput = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
290
258
|
log.error('Selection key event on non-text input element', event.target);
|
|
291
259
|
return;
|
|
292
260
|
}
|
|
261
|
+
if (key === 'Enter') {
|
|
262
|
+
onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(event);
|
|
263
|
+
return;
|
|
264
|
+
}
|
|
293
265
|
if (key.startsWith('Arrow')) {
|
|
294
266
|
handleArrowKey(event);
|
|
295
267
|
return;
|
package/dist/MaskedInput.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MaskedInput.js","names":["React","useMemo","useEffect","useCallback","classNames","Log","useForwardedRef","log","module","SELECTION_DIRECTION","FORWARD","BACKWARD","NONE","FIXED_WIDTH_SPACE","DEFAULT_GET_PREFERRED_REPLACEMENT_STRING","value","replaceIndex","newChar","substring","fillToLength","checkValue","exampleValue","length","trimTrailingMask","emptyMask","i","MaskedInput","forwardRef","props","ref","className","example","getNextSegmentValue","range","delta","segmentValue","getPreferredReplacementString","onChange","onSelect","pattern","placeholder","selection","onFocus","onBlur","dataTestId","input","examples","Array","isArray","replace","setSelectedSegment","debug","selectionStart","selectionEnd","selectionDirection","current","setSelectionRange","getSegment","cursorPosition","testValue","test","charAt","fillValue","filledValue","concat","isValid","patternRegex","RegExp","nextSegment","position","currentSegment","nextPosition","previousSegment","previousPosition","nextSegmentValue","segment","newSegmentValue","newValue","handleSelect","event","target","error","debug2","nativeEvent","type","newSelection","handleSelectCapture","preventDefault","stopPropagation","handleArrowKey","key","handleKeyDown","startsWith","trimmedValue","altKey","metaKey","ctrlKey","newChars","from","Set","toUpperCase","toLowerCase","maxReplaceIndex","newSelectionStart","nextSegmentSelection","undefined","defaultProps"],"sources":["../src/MaskedInput.tsx"],"sourcesContent":["import React, { useMemo, useEffect, useCallback } 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 function DEFAULT_GET_PREFERRED_REPLACEMENT_STRING(\n value: string,\n replaceIndex: number,\n newChar: string\n): string {\n return (\n value.substring(0, replaceIndex) +\n newChar +\n value.substring(replaceIndex + 1)\n );\n}\n\n/**\n * Fill the string on the right side with the example value to the given length\n * @param checkValue Initial string to pad\n * @param exampleValue Example value\n * @param length Target length\n * @returns String padded with the given example value\n */\nexport function fillToLength(\n checkValue: string,\n exampleValue: string,\n length: number\n): string {\n return checkValue.length < length\n ? `${checkValue}${exampleValue.substring(checkValue.length, length)}`\n : checkValue;\n}\n\n/**\n * Trim all characters matching the empty mask on the right side of the given value\n * @param value String to trim\n * @param emptyMask Empty mask\n * @returns Trimmed string\n */\nexport function trimTrailingMask(value: string, emptyMask: string): string {\n let { length } = value;\n for (let i = value.length - 1; i >= 0; i -= 1) {\n if (emptyMask[i] === value[i]) {\n length = i;\n } else {\n break;\n }\n }\n return value.substring(0, length);\n}\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 /** Input placeholder */\n placeholder?: 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 getPreferredReplacementString?(\n value: string,\n replaceIndex: number,\n replaceChar: string,\n selectionStart: number,\n selectionEnd: number\n ): string;\n onFocus?: React.FocusEventHandler;\n onBlur?: React.FocusEventHandler;\n\n 'data-testid'?: string;\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 getPreferredReplacementString = DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n onChange = () => false,\n onSelect = () => false,\n pattern,\n placeholder,\n selection,\n value,\n onFocus = () => false,\n onBlur = () => false,\n 'data-testid': dataTestId,\n } = props;\n const input = useForwardedRef(ref);\n const examples = useMemo(\n () => (Array.isArray(example) ? example : [example]),\n [example]\n );\n const emptyMask = useMemo(\n () => examples[0].replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE),\n [examples]\n );\n\n useEffect(\n function setSelectedSegment() {\n if (selection != null) {\n log.debug('setting selection...', selection);\n const {\n selectionStart,\n selectionEnd,\n selectionDirection,\n } = selection;\n input.current?.setSelectionRange(\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n log.debug('selection set!');\n }\n },\n [selection, input]\n );\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 const getSegment = useCallback(\n (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 [examples, value]\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 const handleSelect = useCallback(\n (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 (\n selection != null &&\n selectionStart === value.length &&\n selectionEnd === value.length &&\n event.nativeEvent.type !== 'mouseup'\n ) {\n // React triggers onSelect event with the cursor at the end of the input content\n // when the component is rendered at a different location in the DOM,\n // i.e. when start/end times switch places in the TimeSlider.\n // Ignore this event and reset the selection to its previous state.\n onSelect({ ...selection });\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 [getSegment, onSelect, selection, value]\n );\n\n const handleSelectCapture = useCallback(\n (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 [input, selection, value]\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 // Deleting at the end of the value\n if (selectionEnd >= trimTrailingMask(value, emptyMask).length) {\n const newValue = value.substring(\n 0,\n // Delete whole selection or just the char before the cursor\n selectionStart === selectionEnd\n ? selectionStart - 1\n : selectionStart\n );\n const trimmedValue = trimTrailingMask(newValue, emptyMask);\n if (trimmedValue !== value) {\n onChange(trimmedValue);\n onSelect({\n selectionStart: trimmedValue.length,\n selectionEnd: trimmedValue.length,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n }\n return;\n }\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 ? examples[0].length - 1\n : selectionStart;\n for (\n let replaceIndex = selectionStart;\n replaceIndex <= maxReplaceIndex;\n replaceIndex += 1\n ) {\n // Fill with the example chars if necessary\n const filledValue = fillToLength(\n value,\n examples[0],\n replaceIndex + 1\n );\n const newValue = getPreferredReplacementString(\n filledValue,\n replaceIndex,\n newChar,\n selectionStart,\n selectionEnd\n );\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 placeholder={placeholder}\n value={value}\n onChange={() => undefined}\n onKeyDown={handleKeyDown}\n onSelect={handleSelect}\n onSelectCapture={handleSelectCapture}\n onFocus={onFocus}\n onBlur={onBlur}\n data-testid={dataTestId}\n />\n );\n }\n);\n\nMaskedInput.defaultProps = {\n className: '',\n placeholder: undefined,\n onChange(): void {\n // no-op\n },\n onSelect(): void {\n // no-op\n },\n getNextSegmentValue: (range, delta, segmentValue) => segmentValue,\n getPreferredReplacementString: DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n selection: undefined,\n onFocus(): void {\n // no-op\n },\n onBlur(): void {\n // no-op\n },\n 'data-testid': undefined,\n};\n\nexport default MaskedInput;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MaskedInput.js","names":["React","useMemo","useEffect","useCallback","classNames","Log","useForwardedRef","DEFAULT_GET_PREFERRED_REPLACEMENT_STRING","fillToLength","trimTrailingMask","log","module","SELECTION_DIRECTION","FORWARD","BACKWARD","NONE","FIXED_WIDTH_SPACE","MaskedInput","forwardRef","props","ref","className","example","getNextSegmentValue","range","delta","segmentValue","getPreferredReplacementString","onChange","onSelect","onSubmit","pattern","placeholder","selection","value","onFocus","onBlur","dataTestId","input","examples","Array","isArray","emptyMask","replace","setSelectedSegment","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","nativeEvent","type","newSelection","handleSelectCapture","preventDefault","stopPropagation","handleArrowKey","key","handleKeyDown","startsWith","trimmedValue","altKey","metaKey","ctrlKey","newChars","from","Set","toUpperCase","toLowerCase","newChar","maxReplaceIndex","replaceIndex","newSelectionStart","nextSegmentSelection","undefined","defaultProps"],"sources":["../src/MaskedInput.tsx"],"sourcesContent":["import React, { useMemo, useEffect, useCallback, KeyboardEvent } from 'react';\nimport classNames from 'classnames';\nimport Log from '@deephaven/log';\nimport { useForwardedRef } from '@deephaven/react-hooks';\nimport {\n DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n fillToLength,\n trimTrailingMask,\n} from './MaskedInputUtils';\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 /** Input placeholder */\n placeholder?: 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 /** Called when enter is pressed */\n onSubmit?(event?: KeyboardEvent<HTMLInputElement>): 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 getPreferredReplacementString?(\n value: string,\n replaceIndex: number,\n replaceChar: string,\n selectionStart: number,\n selectionEnd: number\n ): string;\n onFocus?: React.FocusEventHandler;\n onBlur?: React.FocusEventHandler;\n\n 'data-testid'?: string;\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 getPreferredReplacementString = DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n onChange = () => false,\n onSelect = () => false,\n onSubmit,\n pattern,\n placeholder,\n selection,\n value,\n onFocus = () => false,\n onBlur = () => false,\n 'data-testid': dataTestId,\n } = props;\n const input = useForwardedRef(ref);\n const examples = useMemo(\n () => (Array.isArray(example) ? example : [example]),\n [example]\n );\n const emptyMask = useMemo(\n () => examples[0].replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE),\n [examples]\n );\n\n useEffect(\n function setSelectedSegment() {\n if (selection != null) {\n log.debug('setting selection...', selection);\n const {\n selectionStart,\n selectionEnd,\n selectionDirection,\n } = selection;\n input.current?.setSelectionRange(\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n log.debug('selection set!');\n }\n },\n [selection, input]\n );\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 const getSegment = useCallback(\n (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 [examples, value]\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 const handleSelect = useCallback(\n (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 (\n selection != null &&\n selectionStart === value.length &&\n selectionEnd === value.length &&\n event.nativeEvent.type !== 'mouseup'\n ) {\n // React triggers onSelect event with the cursor at the end of the input content\n // when the component is rendered at a different location in the DOM,\n // i.e. when start/end times switch places in the TimeSlider.\n // Ignore this event and reset the selection to its previous state.\n onSelect({ ...selection });\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 [getSegment, onSelect, selection, value]\n );\n\n const handleSelectCapture = useCallback(\n (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 [input, selection, value]\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 if (key === 'Enter') {\n onSubmit?.(event);\n return;\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 // Deleting at the end of the value\n if (selectionEnd >= trimTrailingMask(value, emptyMask).length) {\n const newValue = value.substring(\n 0,\n // Delete whole selection or just the char before the cursor\n selectionStart === selectionEnd\n ? selectionStart - 1\n : selectionStart\n );\n const trimmedValue = trimTrailingMask(newValue, emptyMask);\n if (trimmedValue !== value) {\n onChange(trimmedValue);\n onSelect({\n selectionStart: trimmedValue.length,\n selectionEnd: trimmedValue.length,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n }\n return;\n }\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 ? examples[0].length - 1\n : selectionStart;\n for (\n let replaceIndex = selectionStart;\n replaceIndex <= maxReplaceIndex;\n replaceIndex += 1\n ) {\n // Fill with the example chars if necessary\n const filledValue = fillToLength(\n value,\n examples[0],\n replaceIndex + 1\n );\n const newValue = getPreferredReplacementString(\n filledValue,\n replaceIndex,\n newChar,\n selectionStart,\n selectionEnd\n );\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 placeholder={placeholder}\n value={value}\n onChange={() => undefined}\n onKeyDown={handleKeyDown}\n onSelect={handleSelect}\n onSelectCapture={handleSelectCapture}\n onFocus={onFocus}\n onBlur={onBlur}\n data-testid={dataTestId}\n />\n );\n }\n);\n\nMaskedInput.defaultProps = {\n className: '',\n placeholder: undefined,\n onChange(): void {\n // no-op\n },\n onSelect(): void {\n // no-op\n },\n getNextSegmentValue: (range, delta, segmentValue) => segmentValue,\n getPreferredReplacementString: DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n selection: undefined,\n onFocus(): void {\n // no-op\n },\n onBlur(): void {\n // no-op\n },\n 'data-testid': undefined,\n};\n\nexport default MaskedInput;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
export declare function DEFAULT_GET_PREFERRED_REPLACEMENT_STRING(value: string, replaceIndex: number, newChar: string): string;
|
|
2
|
+
/**
|
|
3
|
+
* Fill the string on the right side with the example value to the given length
|
|
4
|
+
* @param checkValue Initial string to pad
|
|
5
|
+
* @param exampleValue Example value
|
|
6
|
+
* @param length Target length
|
|
7
|
+
* @returns String padded with the given example value
|
|
8
|
+
*/
|
|
9
|
+
export declare function fillToLength(checkValue: string, exampleValue: string, length: number): string;
|
|
10
|
+
/**
|
|
11
|
+
* Trim all characters matching the empty mask on the right side of the given value
|
|
12
|
+
* @param value String to trim
|
|
13
|
+
* @param emptyMask Empty mask
|
|
14
|
+
* @returns Trimmed string
|
|
15
|
+
*/
|
|
16
|
+
export declare function trimTrailingMask(value: string, emptyMask: string): string;
|
|
17
|
+
//# sourceMappingURL=MaskedInputUtils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MaskedInputUtils.d.ts","sourceRoot":"","sources":["../src/MaskedInputUtils.ts"],"names":[],"mappings":"AACA,wBAAgB,wCAAwC,CACtD,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,MAAM,EACpB,OAAO,EAAE,MAAM,GACd,MAAM,CAMR;AAED;;;;;;GAMG;AACH,wBAAgB,YAAY,CAC1B,UAAU,EAAE,MAAM,EAClB,YAAY,EAAE,MAAM,EACpB,MAAM,EAAE,MAAM,GACb,MAAM,CAIR;AAED;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAUzE"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
/* eslint-disable import/prefer-default-export */
|
|
2
|
+
export function DEFAULT_GET_PREFERRED_REPLACEMENT_STRING(value, replaceIndex, newChar) {
|
|
3
|
+
return value.substring(0, replaceIndex) + newChar + value.substring(replaceIndex + 1);
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Fill the string on the right side with the example value to the given length
|
|
8
|
+
* @param checkValue Initial string to pad
|
|
9
|
+
* @param exampleValue Example value
|
|
10
|
+
* @param length Target length
|
|
11
|
+
* @returns String padded with the given example value
|
|
12
|
+
*/
|
|
13
|
+
export function fillToLength(checkValue, exampleValue, length) {
|
|
14
|
+
return checkValue.length < length ? "".concat(checkValue).concat(exampleValue.substring(checkValue.length, length)) : checkValue;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* Trim all characters matching the empty mask on the right side of the given value
|
|
19
|
+
* @param value String to trim
|
|
20
|
+
* @param emptyMask Empty mask
|
|
21
|
+
* @returns Trimmed string
|
|
22
|
+
*/
|
|
23
|
+
export function trimTrailingMask(value, emptyMask) {
|
|
24
|
+
var {
|
|
25
|
+
length
|
|
26
|
+
} = value;
|
|
27
|
+
for (var i = value.length - 1; i >= 0; i -= 1) {
|
|
28
|
+
if (emptyMask[i] === value[i]) {
|
|
29
|
+
length = i;
|
|
30
|
+
} else {
|
|
31
|
+
break;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
return value.substring(0, length);
|
|
35
|
+
}
|
|
36
|
+
//# sourceMappingURL=MaskedInputUtils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MaskedInputUtils.js","names":["DEFAULT_GET_PREFERRED_REPLACEMENT_STRING","value","replaceIndex","newChar","substring","fillToLength","checkValue","exampleValue","length","trimTrailingMask","emptyMask","i"],"sources":["../src/MaskedInputUtils.ts"],"sourcesContent":["/* eslint-disable import/prefer-default-export */\nexport function DEFAULT_GET_PREFERRED_REPLACEMENT_STRING(\n value: string,\n replaceIndex: number,\n newChar: string\n): string {\n return (\n value.substring(0, replaceIndex) +\n newChar +\n value.substring(replaceIndex + 1)\n );\n}\n\n/**\n * Fill the string on the right side with the example value to the given length\n * @param checkValue Initial string to pad\n * @param exampleValue Example value\n * @param length Target length\n * @returns String padded with the given example value\n */\nexport function fillToLength(\n checkValue: string,\n exampleValue: string,\n length: number\n): string {\n return checkValue.length < length\n ? `${checkValue}${exampleValue.substring(checkValue.length, length)}`\n : checkValue;\n}\n\n/**\n * Trim all characters matching the empty mask on the right side of the given value\n * @param value String to trim\n * @param emptyMask Empty mask\n * @returns Trimmed string\n */\nexport function trimTrailingMask(value: string, emptyMask: string): string {\n let { length } = value;\n for (let i = value.length - 1; i >= 0; i -= 1) {\n if (emptyMask[i] === value[i]) {\n length = i;\n } else {\n break;\n }\n }\n return value.substring(0, length);\n}\n"],"mappings":"AAAA;AACA,OAAO,SAASA,wCAAwC,CACtDC,KAAa,EACbC,YAAoB,EACpBC,OAAe,EACP;EACR,OACEF,KAAK,CAACG,SAAS,CAAC,CAAC,EAAEF,YAAY,CAAC,GAChCC,OAAO,GACPF,KAAK,CAACG,SAAS,CAACF,YAAY,GAAG,CAAC,CAAC;AAErC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASG,YAAY,CAC1BC,UAAkB,EAClBC,YAAoB,EACpBC,MAAc,EACN;EACR,OAAOF,UAAU,CAACE,MAAM,GAAGA,MAAM,aAC1BF,UAAU,SAAGC,YAAY,CAACH,SAAS,CAACE,UAAU,CAACE,MAAM,EAAEA,MAAM,CAAC,IACjEF,UAAU;AAChB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASG,gBAAgB,CAACR,KAAa,EAAES,SAAiB,EAAU;EACzE,IAAI;IAAEF;EAAO,CAAC,GAAGP,KAAK;EACtB,KAAK,IAAIU,CAAC,GAAGV,KAAK,CAACO,MAAM,GAAG,CAAC,EAAEG,CAAC,IAAI,CAAC,EAAEA,CAAC,IAAI,CAAC,EAAE;IAC7C,IAAID,SAAS,CAACC,CAAC,CAAC,KAAKV,KAAK,CAACU,CAAC,CAAC,EAAE;MAC7BH,MAAM,GAAGG,CAAC;IACZ,CAAC,MAAM;MACL;IACF;EACF;EACA,OAAOV,KAAK,CAACG,SAAS,CAAC,CAAC,EAAEI,MAAM,CAAC;AACnC"}
|
package/dist/TimeInput.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TimeInput.d.ts","sourceRoot":"","sources":["../src/TimeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAGf,OAAoB,
|
|
1
|
+
{"version":3,"file":"TimeInput.d.ts","sourceRoot":"","sources":["../src/TimeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAGf,OAAoB,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAG9D,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAOtD,KAAK,cAAc,GAAG;IACpB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACnC,QAAQ,CAAC,CAAC,SAAS,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,IAAI,IAAI,CAAC;IACjB,MAAM,CAAC,IAAI,IAAI,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,YAAY,EAAE,CAAC,YAAY,EAAE,gBAAgB,KAAK,IAAI,CAAC;CACxD,CAAC;AAKF,QAAA,MAAM,SAAS,yFAmHd,CAAC;AAaF,eAAe,SAAS,CAAC"}
|
package/dist/TimeInput.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import React, { useCallback, useEffect, useImperativeHandle, useRef, useState } from 'react';
|
|
2
2
|
import Log from '@deephaven/log';
|
|
3
3
|
import { TimeUtils } from '@deephaven/utils';
|
|
4
|
-
import MaskedInput
|
|
4
|
+
import MaskedInput from "./MaskedInput.js";
|
|
5
|
+
import { DEFAULT_GET_PREFERRED_REPLACEMENT_STRING } from "./MaskedInputUtils.js";
|
|
5
6
|
var log = Log.module('TimeInput');
|
|
6
7
|
var TIME_PATTERN = '([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]';
|
|
7
8
|
var EXAMPLES = ['00:00:00', '12:34:56', '23:59:59'];
|