Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@react-aria/textfield

Package Overview
Dependencies
Maintainers
2
Versions
819
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@react-aria/textfield - npm Package Compare versions

Comparing version 3.0.0-nightly-0ddbe6f95-241021 to 3.0.0-nightly-10a43de88-241127

2

dist/types.d.ts

@@ -39,3 +39,3 @@ import { AriaTextFieldProps } from "@react-types/textfield";

type TextFieldInputProps<T extends TextFieldIntrinsicElements> = TextFieldHTMLAttributesType[T];
export interface AriaTextFieldOptions<T extends TextFieldIntrinsicElements> extends AriaTextFieldProps {
export interface AriaTextFieldOptions<T extends TextFieldIntrinsicElements> extends AriaTextFieldProps<TextFieldHTMLElementType[T]> {
/**

@@ -42,0 +42,0 @@ * The HTML element used to render the input, e.g. 'input', or 'textarea'.

@@ -25,4 +25,3 @@ var $9076f978e02df845$exports = require("./useTextField.main.js");

function $56b68c3dab9bf16c$var$supportsNativeBeforeInputEvent() {
return typeof window !== 'undefined' && window.InputEvent && // @ts-ignore
typeof InputEvent.prototype.getTargetRanges === 'function';
return typeof window !== 'undefined' && window.InputEvent && typeof InputEvent.prototype.getTargetRanges === 'function';
}

@@ -38,5 +37,6 @@ function $56b68c3dab9bf16c$export$4f384c9210e583c3(props, state, inputRef) {

let input = inputRef.current;
if (!input) return;
// Compute the next value of the input if the event is allowed to proceed.
// See https://www.w3.org/TR/input-events-2/#interface-InputEvent-Attributes for a full list of input types.
let nextValue;
let nextValue = null;
switch(e.inputType){

@@ -80,3 +80,3 @@ case 'historyUndo':

(0, $6PuoT$react.useEffect)(()=>{
if (!$56b68c3dab9bf16c$var$supportsNativeBeforeInputEvent()) return;
if (!$56b68c3dab9bf16c$var$supportsNativeBeforeInputEvent() || !inputRef.current) return;
let input = inputRef.current;

@@ -121,3 +121,3 @@ input.addEventListener('beforeinput', onBeforeInputFallback, false);

onCompositionEnd () {
if (!state.validate(inputRef.current.value)) {
if (inputRef.current && !state.validate(inputRef.current.value)) {
// Restore the input value in the DOM immediately so we can synchronously update the selection position.

@@ -124,0 +124,0 @@ // But also update the value in React state as well so it is correct for future updates.

@@ -19,4 +19,3 @@ import {useTextField as $2d73ec29415bd339$export$712718f7aec83d5} from "./useTextField.module.js";

function $d841c8010a73d545$var$supportsNativeBeforeInputEvent() {
return typeof window !== 'undefined' && window.InputEvent && // @ts-ignore
typeof InputEvent.prototype.getTargetRanges === 'function';
return typeof window !== 'undefined' && window.InputEvent && typeof InputEvent.prototype.getTargetRanges === 'function';
}

@@ -32,5 +31,6 @@ function $d841c8010a73d545$export$4f384c9210e583c3(props, state, inputRef) {

let input = inputRef.current;
if (!input) return;
// Compute the next value of the input if the event is allowed to proceed.
// See https://www.w3.org/TR/input-events-2/#interface-InputEvent-Attributes for a full list of input types.
let nextValue;
let nextValue = null;
switch(e.inputType){

@@ -74,3 +74,3 @@ case 'historyUndo':

(0, $jyGKS$useEffect)(()=>{
if (!$d841c8010a73d545$var$supportsNativeBeforeInputEvent()) return;
if (!$d841c8010a73d545$var$supportsNativeBeforeInputEvent() || !inputRef.current) return;
let input = inputRef.current;

@@ -115,3 +115,3 @@ input.addEventListener('beforeinput', onBeforeInputFallback, false);

onCompositionEnd () {
if (!state.validate(inputRef.current.value)) {
if (inputRef.current && !state.validate(inputRef.current.value)) {
// Restore the input value in the DOM immediately so we can synchronously update the selection position.

@@ -118,0 +118,0 @@ // But also update the value in React state as well so it is correct for future updates.

{
"name": "@react-aria/textfield",
"version": "3.0.0-nightly-0ddbe6f95-241021",
"version": "3.0.0-nightly-10a43de88-241127",
"description": "Spectrum UI components in React",

@@ -25,14 +25,14 @@ "license": "Apache-2.0",

"dependencies": {
"@react-aria/focus": "^3.0.0-nightly-0ddbe6f95-241021",
"@react-aria/form": "^3.0.0-nightly-0ddbe6f95-241021",
"@react-aria/label": "^3.0.0-nightly-0ddbe6f95-241021",
"@react-aria/utils": "^3.0.0-nightly-0ddbe6f95-241021",
"@react-stately/form": "^3.0.0-nightly-0ddbe6f95-241021",
"@react-stately/utils": "^3.0.0-nightly-0ddbe6f95-241021",
"@react-types/shared": "^3.0.0-nightly-0ddbe6f95-241021",
"@react-types/textfield": "^3.0.0-nightly-0ddbe6f95-241021",
"@react-aria/focus": "^3.0.0-nightly-10a43de88-241127",
"@react-aria/form": "^3.0.0-nightly-10a43de88-241127",
"@react-aria/label": "^3.0.0-nightly-10a43de88-241127",
"@react-aria/utils": "^3.0.0-nightly-10a43de88-241127",
"@react-stately/form": "^3.0.0-nightly-10a43de88-241127",
"@react-stately/utils": "^3.0.0-nightly-10a43de88-241127",
"@react-types/shared": "^3.0.0-nightly-10a43de88-241127",
"@react-types/textfield": "^3.0.0-nightly-10a43de88-241127",
"@swc/helpers": "^0.5.0"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0"
"react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1"
},

@@ -42,3 +42,3 @@ "publishConfig": {

},
"stableVersion": "3.14.10"
"stableVersion": "3.15.0"
}

@@ -28,3 +28,2 @@ /*

window.InputEvent &&
// @ts-ignore
typeof InputEvent.prototype.getTargetRanges === 'function';

@@ -42,6 +41,9 @@ }

let input = inputRef.current;
if (!input) {
return;
}
// Compute the next value of the input if the event is allowed to proceed.
// See https://www.w3.org/TR/input-events-2/#interface-InputEvent-Attributes for a full list of input types.
let nextValue: string;
let nextValue: string | null = null;
switch (e.inputType) {

@@ -59,3 +61,3 @@ case 'historyUndo':

case 'deleteByDrag':
nextValue = input.value.slice(0, input.selectionStart) + input.value.slice(input.selectionEnd);
nextValue = input.value.slice(0, input.selectionStart!) + input.value.slice(input.selectionEnd!);
break;

@@ -68,13 +70,13 @@ case 'deleteContentForward':

nextValue = input.selectionEnd === input.selectionStart
? input.value.slice(0, input.selectionStart) + input.value.slice(input.selectionEnd + 1)
: input.value.slice(0, input.selectionStart) + input.value.slice(input.selectionEnd);
? input.value.slice(0, input.selectionStart!) + input.value.slice(input.selectionEnd! + 1)
: input.value.slice(0, input.selectionStart!) + input.value.slice(input.selectionEnd!);
break;
case 'deleteContentBackward':
nextValue = input.selectionEnd === input.selectionStart
? input.value.slice(0, input.selectionStart - 1) + input.value.slice(input.selectionStart)
: input.value.slice(0, input.selectionStart) + input.value.slice(input.selectionEnd);
? input.value.slice(0, input.selectionStart! - 1) + input.value.slice(input.selectionStart!)
: input.value.slice(0, input.selectionStart!) + input.value.slice(input.selectionEnd!);
break;
case 'deleteSoftLineBackward':
case 'deleteHardLineBackward':
nextValue = input.value.slice(input.selectionStart);
nextValue = input.value.slice(input.selectionStart!);
break;

@@ -84,5 +86,5 @@ default:

nextValue =
input.value.slice(0, input.selectionStart) +
input.value.slice(0, input.selectionStart!) +
e.data +
input.value.slice(input.selectionEnd);
input.value.slice(input.selectionEnd!);
}

@@ -101,3 +103,3 @@ break;

useEffect(() => {
if (!supportsNativeBeforeInputEvent()) {
if (!supportsNativeBeforeInputEvent() || !inputRef.current) {
return;

@@ -128,3 +130,3 @@ }

let compositionStartState = useRef(null);
let compositionStartState = useRef<{value: string, selectionStart: number | null, selectionEnd: number | null} | null>(null);
return {

@@ -148,10 +150,10 @@ inputProps: mergeProps(

// See https://bugs.chromium.org/p/chromium/issues/detail?id=1022204
let {value, selectionStart, selectionEnd} = inputRef.current;
let {value, selectionStart, selectionEnd} = inputRef.current!;
compositionStartState.current = {value, selectionStart, selectionEnd};
},
onCompositionEnd() {
if (!state.validate(inputRef.current.value)) {
if (inputRef.current && !state.validate(inputRef.current.value)) {
// Restore the input value in the DOM immediately so we can synchronously update the selection position.
// But also update the value in React state as well so it is correct for future updates.
let {value, selectionStart, selectionEnd} = compositionStartState.current;
let {value, selectionStart, selectionEnd} = compositionStartState.current!;
inputRef.current.value = value;

@@ -158,0 +160,0 @@ inputRef.current.setSelectionRange(selectionStart, selectionEnd);

@@ -72,3 +72,3 @@ /*

export interface AriaTextFieldOptions<T extends TextFieldIntrinsicElements> extends AriaTextFieldProps {
export interface AriaTextFieldOptions<T extends TextFieldIntrinsicElements> extends AriaTextFieldProps<TextFieldHTMLElementType[T]> {
/**

@@ -122,5 +122,5 @@ * The HTML element used to render the input, e.g. 'input', or 'textarea'.

validationBehavior = 'aria'
}: AriaTextFieldOptions<TextFieldIntrinsicElements> = props;
} = props;
let [value, setValue] = useControlledState<string>(props.value, props.defaultValue || '', props.onChange);
let {focusableProps} = useFocusable(props, ref);
let {focusableProps} = useFocusable<TextFieldHTMLElementType[T]>(props, ref);
let validationState = useFormValidationState({

@@ -127,0 +127,0 @@ ...props,

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc