@ericblade/react-currency-input
Advanced tools
Comparing version
@@ -1,6 +0,1 @@ | ||
{ | ||
"component": { | ||
"testFiles": "**/*.test.{js,ts,jsx,tsx}", | ||
"componentFolder": "src" | ||
} | ||
} | ||
{} |
@@ -1,6 +0,22 @@ | ||
const injectDevServer = require('@cypress/react/plugins/react-scripts'); | ||
/// <reference types="cypress" /> | ||
// *********************************************************** | ||
// This example plugins/index.js can be used to load plugins | ||
// | ||
// You can change the location of this file or turn off loading | ||
// the plugins file with the 'pluginsFile' configuration option. | ||
// | ||
// You can read more here: | ||
// https://on.cypress.io/plugins-guide | ||
// *********************************************************** | ||
// This function is called when a project is opened or re-opened (e.g. due to | ||
// the project's config changing) | ||
/** | ||
* @type {Cypress.PluginConfig} | ||
*/ | ||
// eslint-disable-next-line no-unused-vars | ||
module.exports = (on, config) => { | ||
injectDevServer(on, config); | ||
return config; | ||
}; | ||
// `on` is used to hook into various events Cypress emits | ||
// `config` is the resolved Cypress config | ||
} |
@@ -373,2 +373,3 @@ var __extends = (this && this.__extends) || (function () { | ||
} | ||
var node = this.theInput.current; | ||
var prevSelectionStart = this.inputSelectionStart; | ||
@@ -379,71 +380,18 @@ var prevSelectionEnd = this.inputSelectionEnd; | ||
this.inputSelectionEnd = snapshot.inputSelectionEnd; | ||
// TODO: we should store the selection direction last moved, in node.selectionDirection, so we can investigate properly skipping separators in both directions. | ||
} | ||
var selectionConstraints = this.getSelectionConstraints(); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* componentDidUpdate inputSelection received', this.inputSelectionStart, this.inputSelectionEnd, selectionConstraints, prevSelectionStart, prevSelectionEnd); | ||
var decimalSeparator = this.props.decimalSeparator; | ||
var node = this.theInput.current; | ||
if (this.inputSelectionStart === this.inputSelectionEnd) { | ||
var selectionPosition = Math.max(selectionConstraints.start, Math.min(this.inputSelectionEnd, selectionConstraints.end)); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* initial selectionPosition', selectionPosition); | ||
// if we erased digits, we shouldn't move the cursor, so adjust to compensate for the number of digits removed. | ||
var prevValueFloat = CurrencyInput.stringValueToFloat(String(prevState.value), this.props.thousandSeparator, this.props.decimalSeparator); | ||
var currValueFloat = CurrencyInput.stringValueToFloat(String(this.state.value), this.props.thousandSeparator, this.props.decimalSeparator); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* value prev/now', prevValueFloat, currValueFloat); | ||
// const minimumLength = this.props.prefix.length + this.props.suffix.length + this.props.precision; | ||
var bDeletedDigits = ((prevSelectionEnd > this.inputSelectionEnd) && prevValueFloat > currValueFloat); | ||
var bAddedDigits = ((prevSelectionEnd < this.inputSelectionEnd) && prevValueFloat < currValueFloat); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* bDeletedDigits =', bDeletedDigits, 'bAddedDigits =', bAddedDigits); | ||
if (currValueFloat === 0 || prevValueFloat === 0) { | ||
// shortcut, when value is zero, we're always entering from the last position. | ||
// If value was zero, we just entered the first number, so we should be at the end. | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selection case 0'); | ||
selectionPosition = selectionConstraints.end; | ||
} | ||
else if (bDeletedDigits) { | ||
if (prevSelectionEnd > selectionConstraints.end) { // deleted from end | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 1'); | ||
selectionPosition = selectionConstraints.end; | ||
// if (String(prevValueFloat).length > String(currValueFloat).length) { | ||
// selectionPosition -= 1; | ||
// } | ||
} | ||
else { | ||
if (String(prevValueFloat).length > String(currValueFloat).length) { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 2'); | ||
selectionPosition = this.inputSelectionEnd; | ||
} | ||
else { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 3'); | ||
selectionPosition = prevSelectionEnd; | ||
} | ||
} | ||
} | ||
else if (bAddedDigits) { | ||
if (String(this.state.maskedValue).length === String(prevState.maskedValue).length) { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 4'); | ||
selectionPosition = prevSelectionEnd; | ||
} | ||
else { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 5'); | ||
selectionPosition = this.inputSelectionEnd; | ||
} | ||
} | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* tentative selectionPosition=', selectionPosition); | ||
var regexEscapeRegex = /[-[\]{}()*+?.,\\^$|#\s]/g; | ||
var separatorsRegex = new RegExp(decimalSeparator.replace(regexEscapeRegex, '\\$&') + '|' + this.props.thousandSeparator.replace(regexEscapeRegex, '\\$&'), 'g'); | ||
var currSeparatorCount = (this.state.maskedValue.match(separatorsRegex) || []).length; | ||
var prevSeparatorCount = (prevState.maskedValue.match(separatorsRegex) || []).length; | ||
var adjustment = Math.abs(currSeparatorCount - prevSeparatorCount); //Math.max(currSeparatorCount - prevSeparatorCount, 0); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* separator adjustment=', currSeparatorCount, prevSeparatorCount, adjustment); | ||
// TODO: There is something going wrong here if you enter from the input end, 123456789 then cursor left one, then backspace. At that point, the adjustment should be ignored, but I can't figure out what criteria to hinge it upon. | ||
if (bAddedDigits) { | ||
selectionPosition += adjustment; | ||
} | ||
else if (bDeletedDigits) { | ||
selectionPosition -= adjustment; | ||
} | ||
selectionPosition = Math.max(selectionConstraints.start, Math.min(selectionPosition, selectionConstraints.end)); | ||
this.setSelectionRange(node, selectionPosition, selectionPosition); | ||
} // TODO: do we need to do anything with multi-select? probably just make sure the caret is still in proper constraints? | ||
CurrencyInput.DEBUG_SELECTION && console.warn('** componentDidUpdate inputSelection current selection = ', this.inputSelectionStart, this.inputSelectionEnd); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* inputSelection previous selection = ', prevSelectionStart, prevSelectionEnd); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* inputSelection constraints = ', selectionConstraints); | ||
/* | ||
const bCaretMovedLeft = this.inputSelectionEnd < prevSelectionEnd; | ||
const bCaretMovedRight = this.inputSelectionEnd > prevSelectionEnd; | ||
const bCaretDidNotMove = this.inputSelectionEnd === prevSelectionEnd; | ||
*/ | ||
var characterCountDifference = prevState.maskedValue.length - this.state.maskedValue.length; | ||
var newSelection = prevSelectionEnd - characterCountDifference; | ||
// console.warn('* ', bCaretMovedLeft, bCaretMovedRight, bCaretDidNotMove, characterCountDifference); | ||
newSelection = Math.max(selectionConstraints.start, Math.min(newSelection, selectionConstraints.end)); | ||
this.setSelectionRange(node, newSelection, newSelection); | ||
// TODO: using DEL instead of Backspace is a little wonky, but will save that for the future. | ||
}; | ||
@@ -450,0 +398,0 @@ /* |
@@ -276,2 +276,3 @@ "use strict"; | ||
} | ||
var node = this.theInput.current; | ||
var prevSelectionStart = this.inputSelectionStart; | ||
@@ -282,71 +283,18 @@ var prevSelectionEnd = this.inputSelectionEnd; | ||
this.inputSelectionEnd = snapshot.inputSelectionEnd; | ||
// TODO: we should store the selection direction last moved, in node.selectionDirection, so we can investigate properly skipping separators in both directions. | ||
} | ||
var selectionConstraints = this.getSelectionConstraints(); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* componentDidUpdate inputSelection received', this.inputSelectionStart, this.inputSelectionEnd, selectionConstraints, prevSelectionStart, prevSelectionEnd); | ||
var decimalSeparator = this.props.decimalSeparator; | ||
var node = this.theInput.current; | ||
if (this.inputSelectionStart === this.inputSelectionEnd) { | ||
var selectionPosition = Math.max(selectionConstraints.start, Math.min(this.inputSelectionEnd, selectionConstraints.end)); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* initial selectionPosition', selectionPosition); | ||
// if we erased digits, we shouldn't move the cursor, so adjust to compensate for the number of digits removed. | ||
var prevValueFloat = CurrencyInput.stringValueToFloat(String(prevState.value), this.props.thousandSeparator, this.props.decimalSeparator); | ||
var currValueFloat = CurrencyInput.stringValueToFloat(String(this.state.value), this.props.thousandSeparator, this.props.decimalSeparator); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* value prev/now', prevValueFloat, currValueFloat); | ||
// const minimumLength = this.props.prefix.length + this.props.suffix.length + this.props.precision; | ||
var bDeletedDigits = ((prevSelectionEnd > this.inputSelectionEnd) && prevValueFloat > currValueFloat); | ||
var bAddedDigits = ((prevSelectionEnd < this.inputSelectionEnd) && prevValueFloat < currValueFloat); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* bDeletedDigits =', bDeletedDigits, 'bAddedDigits =', bAddedDigits); | ||
if (currValueFloat === 0 || prevValueFloat === 0) { | ||
// shortcut, when value is zero, we're always entering from the last position. | ||
// If value was zero, we just entered the first number, so we should be at the end. | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selection case 0'); | ||
selectionPosition = selectionConstraints.end; | ||
} | ||
else if (bDeletedDigits) { | ||
if (prevSelectionEnd > selectionConstraints.end) { // deleted from end | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 1'); | ||
selectionPosition = selectionConstraints.end; | ||
// if (String(prevValueFloat).length > String(currValueFloat).length) { | ||
// selectionPosition -= 1; | ||
// } | ||
} | ||
else { | ||
if (String(prevValueFloat).length > String(currValueFloat).length) { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 2'); | ||
selectionPosition = this.inputSelectionEnd; | ||
} | ||
else { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 3'); | ||
selectionPosition = prevSelectionEnd; | ||
} | ||
} | ||
} | ||
else if (bAddedDigits) { | ||
if (String(this.state.maskedValue).length === String(prevState.maskedValue).length) { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 4'); | ||
selectionPosition = prevSelectionEnd; | ||
} | ||
else { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 5'); | ||
selectionPosition = this.inputSelectionEnd; | ||
} | ||
} | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* tentative selectionPosition=', selectionPosition); | ||
var regexEscapeRegex = /[-[\]{}()*+?.,\\^$|#\s]/g; | ||
var separatorsRegex = new RegExp(decimalSeparator.replace(regexEscapeRegex, '\\$&') + '|' + this.props.thousandSeparator.replace(regexEscapeRegex, '\\$&'), 'g'); | ||
var currSeparatorCount = (this.state.maskedValue.match(separatorsRegex) || []).length; | ||
var prevSeparatorCount = (prevState.maskedValue.match(separatorsRegex) || []).length; | ||
var adjustment = Math.abs(currSeparatorCount - prevSeparatorCount); //Math.max(currSeparatorCount - prevSeparatorCount, 0); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* separator adjustment=', currSeparatorCount, prevSeparatorCount, adjustment); | ||
// TODO: There is something going wrong here if you enter from the input end, 123456789 then cursor left one, then backspace. At that point, the adjustment should be ignored, but I can't figure out what criteria to hinge it upon. | ||
if (bAddedDigits) { | ||
selectionPosition += adjustment; | ||
} | ||
else if (bDeletedDigits) { | ||
selectionPosition -= adjustment; | ||
} | ||
selectionPosition = Math.max(selectionConstraints.start, Math.min(selectionPosition, selectionConstraints.end)); | ||
this.setSelectionRange(node, selectionPosition, selectionPosition); | ||
} // TODO: do we need to do anything with multi-select? probably just make sure the caret is still in proper constraints? | ||
CurrencyInput.DEBUG_SELECTION && console.warn('** componentDidUpdate inputSelection current selection = ', this.inputSelectionStart, this.inputSelectionEnd); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* inputSelection previous selection = ', prevSelectionStart, prevSelectionEnd); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* inputSelection constraints = ', selectionConstraints); | ||
/* | ||
const bCaretMovedLeft = this.inputSelectionEnd < prevSelectionEnd; | ||
const bCaretMovedRight = this.inputSelectionEnd > prevSelectionEnd; | ||
const bCaretDidNotMove = this.inputSelectionEnd === prevSelectionEnd; | ||
*/ | ||
var characterCountDifference = prevState.maskedValue.length - this.state.maskedValue.length; | ||
var newSelection = prevSelectionEnd - characterCountDifference; | ||
// console.warn('* ', bCaretMovedLeft, bCaretMovedRight, bCaretDidNotMove, characterCountDifference); | ||
newSelection = Math.max(selectionConstraints.start, Math.min(newSelection, selectionConstraints.end)); | ||
this.setSelectionRange(node, newSelection, newSelection); | ||
// TODO: using DEL instead of Backspace is a little wonky, but will save that for the future. | ||
}; | ||
@@ -353,0 +301,0 @@ /* |
@@ -243,2 +243,3 @@ // TODO: disableSelectionHandling really breaks behavior in a way i didn't even kind of expect, will try to figure out root cause later and fix if possible? that may be the way browser deals with it tho | ||
} | ||
const node = this.theInput.current; | ||
let prevSelectionStart = this.inputSelectionStart; | ||
@@ -249,71 +250,18 @@ let prevSelectionEnd = this.inputSelectionEnd; | ||
this.inputSelectionEnd = snapshot.inputSelectionEnd; | ||
// TODO: we should store the selection direction last moved, in node.selectionDirection, so we can investigate properly skipping separators in both directions. | ||
} | ||
const selectionConstraints = this.getSelectionConstraints(); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* componentDidUpdate inputSelection received', this.inputSelectionStart, this.inputSelectionEnd, selectionConstraints, prevSelectionStart, prevSelectionEnd); | ||
const { decimalSeparator } = this.props; | ||
const node = this.theInput.current; | ||
if (this.inputSelectionStart === this.inputSelectionEnd) { | ||
let selectionPosition = Math.max(selectionConstraints.start, Math.min(this.inputSelectionEnd, selectionConstraints.end)); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* initial selectionPosition', selectionPosition); | ||
// if we erased digits, we shouldn't move the cursor, so adjust to compensate for the number of digits removed. | ||
const prevValueFloat = CurrencyInput.stringValueToFloat(String(prevState.value), this.props.thousandSeparator, this.props.decimalSeparator); | ||
const currValueFloat = CurrencyInput.stringValueToFloat(String(this.state.value), this.props.thousandSeparator, this.props.decimalSeparator); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* value prev/now', prevValueFloat, currValueFloat); | ||
// const minimumLength = this.props.prefix.length + this.props.suffix.length + this.props.precision; | ||
const bDeletedDigits = ((prevSelectionEnd > this.inputSelectionEnd) && prevValueFloat > currValueFloat); | ||
const bAddedDigits = ((prevSelectionEnd < this.inputSelectionEnd) && prevValueFloat < currValueFloat); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* bDeletedDigits =', bDeletedDigits, 'bAddedDigits =', bAddedDigits); | ||
if (currValueFloat === 0 || prevValueFloat === 0) { | ||
// shortcut, when value is zero, we're always entering from the last position. | ||
// If value was zero, we just entered the first number, so we should be at the end. | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selection case 0'); | ||
selectionPosition = selectionConstraints.end; | ||
} | ||
else if (bDeletedDigits) { | ||
if (prevSelectionEnd > selectionConstraints.end) { // deleted from end | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 1'); | ||
selectionPosition = selectionConstraints.end; | ||
// if (String(prevValueFloat).length > String(currValueFloat).length) { | ||
// selectionPosition -= 1; | ||
// } | ||
} | ||
else { | ||
if (String(prevValueFloat).length > String(currValueFloat).length) { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 2'); | ||
selectionPosition = this.inputSelectionEnd; | ||
} | ||
else { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 3'); | ||
selectionPosition = prevSelectionEnd; | ||
} | ||
} | ||
} | ||
else if (bAddedDigits) { | ||
if (String(this.state.maskedValue).length === String(prevState.maskedValue).length) { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 4'); | ||
selectionPosition = prevSelectionEnd; | ||
} | ||
else { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 5'); | ||
selectionPosition = this.inputSelectionEnd; | ||
} | ||
} | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* tentative selectionPosition=', selectionPosition); | ||
let regexEscapeRegex = /[-[\]{}()*+?.,\\^$|#\s]/g; | ||
let separatorsRegex = new RegExp(decimalSeparator.replace(regexEscapeRegex, '\\$&') + '|' + this.props.thousandSeparator.replace(regexEscapeRegex, '\\$&'), 'g'); | ||
let currSeparatorCount = (this.state.maskedValue.match(separatorsRegex) || []).length; | ||
let prevSeparatorCount = (prevState.maskedValue.match(separatorsRegex) || []).length; | ||
let adjustment = Math.abs(currSeparatorCount - prevSeparatorCount); //Math.max(currSeparatorCount - prevSeparatorCount, 0); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* separator adjustment=', currSeparatorCount, prevSeparatorCount, adjustment); | ||
// TODO: There is something going wrong here if you enter from the input end, 123456789 then cursor left one, then backspace. At that point, the adjustment should be ignored, but I can't figure out what criteria to hinge it upon. | ||
if (bAddedDigits) { | ||
selectionPosition += adjustment; | ||
} | ||
else if (bDeletedDigits) { | ||
selectionPosition -= adjustment; | ||
} | ||
selectionPosition = Math.max(selectionConstraints.start, Math.min(selectionPosition, selectionConstraints.end)); | ||
this.setSelectionRange(node, selectionPosition, selectionPosition); | ||
} // TODO: do we need to do anything with multi-select? probably just make sure the caret is still in proper constraints? | ||
CurrencyInput.DEBUG_SELECTION && console.warn('** componentDidUpdate inputSelection current selection = ', this.inputSelectionStart, this.inputSelectionEnd); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* inputSelection previous selection = ', prevSelectionStart, prevSelectionEnd); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* inputSelection constraints = ', selectionConstraints); | ||
/* | ||
const bCaretMovedLeft = this.inputSelectionEnd < prevSelectionEnd; | ||
const bCaretMovedRight = this.inputSelectionEnd > prevSelectionEnd; | ||
const bCaretDidNotMove = this.inputSelectionEnd === prevSelectionEnd; | ||
*/ | ||
const characterCountDifference = prevState.maskedValue.length - this.state.maskedValue.length; | ||
let newSelection = prevSelectionEnd - characterCountDifference; | ||
// console.warn('* ', bCaretMovedLeft, bCaretMovedRight, bCaretDidNotMove, characterCountDifference); | ||
newSelection = Math.max(selectionConstraints.start, Math.min(newSelection, selectionConstraints.end)); | ||
this.setSelectionRange(node, newSelection, newSelection); | ||
// TODO: using DEL instead of Backspace is a little wonky, but will save that for the future. | ||
} | ||
@@ -320,0 +268,0 @@ /* |
@@ -271,2 +271,3 @@ // TODO: disableSelectionHandling really breaks behavior in a way i didn't even kind of expect, will try to figure out root cause later and fix if possible? that may be the way browser deals with it tho | ||
} | ||
var node = this.theInput.current; | ||
var prevSelectionStart = this.inputSelectionStart; | ||
@@ -277,71 +278,18 @@ var prevSelectionEnd = this.inputSelectionEnd; | ||
this.inputSelectionEnd = snapshot.inputSelectionEnd; | ||
// TODO: we should store the selection direction last moved, in node.selectionDirection, so we can investigate properly skipping separators in both directions. | ||
} | ||
var selectionConstraints = this.getSelectionConstraints(); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* componentDidUpdate inputSelection received', this.inputSelectionStart, this.inputSelectionEnd, selectionConstraints, prevSelectionStart, prevSelectionEnd); | ||
var decimalSeparator = this.props.decimalSeparator; | ||
var node = this.theInput.current; | ||
if (this.inputSelectionStart === this.inputSelectionEnd) { | ||
var selectionPosition = Math.max(selectionConstraints.start, Math.min(this.inputSelectionEnd, selectionConstraints.end)); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* initial selectionPosition', selectionPosition); | ||
// if we erased digits, we shouldn't move the cursor, so adjust to compensate for the number of digits removed. | ||
var prevValueFloat = CurrencyInput.stringValueToFloat(String(prevState.value), this.props.thousandSeparator, this.props.decimalSeparator); | ||
var currValueFloat = CurrencyInput.stringValueToFloat(String(this.state.value), this.props.thousandSeparator, this.props.decimalSeparator); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* value prev/now', prevValueFloat, currValueFloat); | ||
// const minimumLength = this.props.prefix.length + this.props.suffix.length + this.props.precision; | ||
var bDeletedDigits = ((prevSelectionEnd > this.inputSelectionEnd) && prevValueFloat > currValueFloat); | ||
var bAddedDigits = ((prevSelectionEnd < this.inputSelectionEnd) && prevValueFloat < currValueFloat); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* bDeletedDigits =', bDeletedDigits, 'bAddedDigits =', bAddedDigits); | ||
if (currValueFloat === 0 || prevValueFloat === 0) { | ||
// shortcut, when value is zero, we're always entering from the last position. | ||
// If value was zero, we just entered the first number, so we should be at the end. | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selection case 0'); | ||
selectionPosition = selectionConstraints.end; | ||
} | ||
else if (bDeletedDigits) { | ||
if (prevSelectionEnd > selectionConstraints.end) { // deleted from end | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 1'); | ||
selectionPosition = selectionConstraints.end; | ||
// if (String(prevValueFloat).length > String(currValueFloat).length) { | ||
// selectionPosition -= 1; | ||
// } | ||
} | ||
else { | ||
if (String(prevValueFloat).length > String(currValueFloat).length) { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 2'); | ||
selectionPosition = this.inputSelectionEnd; | ||
} | ||
else { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 3'); | ||
selectionPosition = prevSelectionEnd; | ||
} | ||
} | ||
} | ||
else if (bAddedDigits) { | ||
if (String(this.state.maskedValue).length === String(prevState.maskedValue).length) { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 4'); | ||
selectionPosition = prevSelectionEnd; | ||
} | ||
else { | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* selectionCase 5'); | ||
selectionPosition = this.inputSelectionEnd; | ||
} | ||
} | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* tentative selectionPosition=', selectionPosition); | ||
var regexEscapeRegex = /[-[\]{}()*+?.,\\^$|#\s]/g; | ||
var separatorsRegex = new RegExp(decimalSeparator.replace(regexEscapeRegex, '\\$&') + '|' + this.props.thousandSeparator.replace(regexEscapeRegex, '\\$&'), 'g'); | ||
var currSeparatorCount = (this.state.maskedValue.match(separatorsRegex) || []).length; | ||
var prevSeparatorCount = (prevState.maskedValue.match(separatorsRegex) || []).length; | ||
var adjustment = Math.abs(currSeparatorCount - prevSeparatorCount); //Math.max(currSeparatorCount - prevSeparatorCount, 0); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* separator adjustment=', currSeparatorCount, prevSeparatorCount, adjustment); | ||
// TODO: There is something going wrong here if you enter from the input end, 123456789 then cursor left one, then backspace. At that point, the adjustment should be ignored, but I can't figure out what criteria to hinge it upon. | ||
if (bAddedDigits) { | ||
selectionPosition += adjustment; | ||
} | ||
else if (bDeletedDigits) { | ||
selectionPosition -= adjustment; | ||
} | ||
selectionPosition = Math.max(selectionConstraints.start, Math.min(selectionPosition, selectionConstraints.end)); | ||
this.setSelectionRange(node, selectionPosition, selectionPosition); | ||
} // TODO: do we need to do anything with multi-select? probably just make sure the caret is still in proper constraints? | ||
CurrencyInput.DEBUG_SELECTION && console.warn('** componentDidUpdate inputSelection current selection = ', this.inputSelectionStart, this.inputSelectionEnd); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* inputSelection previous selection = ', prevSelectionStart, prevSelectionEnd); | ||
CurrencyInput.DEBUG_SELECTION && console.warn('* inputSelection constraints = ', selectionConstraints); | ||
/* | ||
const bCaretMovedLeft = this.inputSelectionEnd < prevSelectionEnd; | ||
const bCaretMovedRight = this.inputSelectionEnd > prevSelectionEnd; | ||
const bCaretDidNotMove = this.inputSelectionEnd === prevSelectionEnd; | ||
*/ | ||
var characterCountDifference = prevState.maskedValue.length - this.state.maskedValue.length; | ||
var newSelection = prevSelectionEnd - characterCountDifference; | ||
// console.warn('* ', bCaretMovedLeft, bCaretMovedRight, bCaretDidNotMove, characterCountDifference); | ||
newSelection = Math.max(selectionConstraints.start, Math.min(newSelection, selectionConstraints.end)); | ||
this.setSelectionRange(node, newSelection, newSelection); | ||
// TODO: using DEL instead of Backspace is a little wonky, but will save that for the future. | ||
}; | ||
@@ -348,0 +296,0 @@ /* |
{ | ||
"name": "@ericblade/react-currency-input", | ||
"version": "1.0.6", | ||
"version": "1.1.0", | ||
"description": "React component for inputing currency amounts", | ||
@@ -9,2 +9,3 @@ "main": "dist/cjs/index.js", | ||
"audit": "npm audit fix --production", | ||
"cypress": "npm run build-example && cypress open", | ||
"lint": "eslint src/**", | ||
@@ -62,2 +63,3 @@ "build": "npm run build:es2015 && npm run build:esm && npm run build:cjs && npm run build:amd", | ||
"cross-env": "^7.0.3", | ||
"cypress": "^9.2.1", | ||
"eslint": "^8.6.0", | ||
@@ -64,0 +66,0 @@ "eslint-config-react-app": "^7.0.0", |
158465
12.62%25
13.64%2843
13.22%24
4.35%