jy-headless 0.3.13 → 0.3.14

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.
@@ -1,8 +1,7 @@
1
1
  import React from 'react';
2
2
  import type { AutocompleteInputProps, AutocompleteOptionProps, AutocompleteOptionsProps, AutocompleteProps } from './Autocomplete.type';
3
- declare const Autocomplete: (({ value, onChange, inputValue, onInputChange, disabled, filterFn, children, }: AutocompleteProps) => import("react/jsx-runtime").JSX.Element) & {
3
+ export declare const Autocomplete: (({ value, onChange, inputValue, onInputChange, disabled, filterFn, children, }: AutocompleteProps) => import("react/jsx-runtime").JSX.Element) & {
4
4
  Input: ({ onKeyDown, onFocus, onChange, onCompositionStart, onCompositionEnd, ...props }: AutocompleteInputProps) => import("react/jsx-runtime").JSX.Element;
5
5
  Options: ({ items, renderItem, itemHeight, maxVisibleItems, overscan, children, ...props }: AutocompleteOptionsProps) => React.ReactPortal | null;
6
6
  Option: ({ value, label, disabled, children, ...props }: AutocompleteOptionProps) => import("react/jsx-runtime").JSX.Element | null;
7
7
  };
8
- export default Autocomplete;
@@ -1,7 +1,7 @@
1
1
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
2
  import { createContext, useState, useRef, useId, useMemo, useEffect, useContext } from 'react';
3
3
  import usePortal from '../hooks/usePortal.js';
4
- import TextInput from '../Input/TextInput.js';
4
+ import { TextInput } from '../Input/TextInput.js';
5
5
 
6
6
  const AutocompleteContext = createContext(null);
7
7
  const useAutocomplete = () => {
@@ -290,8 +290,10 @@ const Option = ({ value, label, disabled, children, ...props }) => {
290
290
  setActiveIndex(-1);
291
291
  }, ...props, children: children ?? label }));
292
292
  };
293
- Object.assign(AutocompleteContainer, {
293
+ const Autocomplete = Object.assign(AutocompleteContainer, {
294
294
  Input,
295
295
  Options,
296
296
  Option,
297
297
  });
298
+
299
+ export { Autocomplete };
@@ -1,3 +1,2 @@
1
1
  import { NumberInputProps } from './NumberInput.type';
2
- declare const NumberInput: ({ max, useThousandsSeparator, onChange, ...props }: NumberInputProps) => import("react/jsx-runtime").JSX.Element;
3
- export default NumberInput;
2
+ export declare const NumberInput: ({ max, useThousandsSeparator, onChange, ...props }: NumberInputProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,38 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import { TextInput } from './TextInput.js';
3
+
4
+ const NumberInput = ({ max, useThousandsSeparator, onChange, ...props }) => {
5
+ const handleChange = (e) => {
6
+ const rawValue = e.target.value.replace(/,/g, '');
7
+ if (rawValue && isNaN(Number(rawValue)))
8
+ return;
9
+ let finalValue = rawValue;
10
+ if (max && Number(rawValue) > max) {
11
+ finalValue = String(max);
12
+ }
13
+ if (useThousandsSeparator && finalValue) {
14
+ const formattedValue = Number(finalValue).toLocaleString();
15
+ const syntheticEvent = {
16
+ ...e,
17
+ target: {
18
+ ...e.target,
19
+ value: formattedValue,
20
+ },
21
+ };
22
+ onChange?.(syntheticEvent);
23
+ }
24
+ else {
25
+ const syntheticEvent = {
26
+ ...e,
27
+ target: {
28
+ ...e.target,
29
+ value: finalValue,
30
+ },
31
+ };
32
+ onChange?.(syntheticEvent);
33
+ }
34
+ };
35
+ return jsx(TextInput, { ...props, onChange: handleChange });
36
+ };
37
+
38
+ export { NumberInput };
@@ -1,4 +1,3 @@
1
1
  import React from 'react';
2
2
  import { TextInputProps } from './TextInput.type';
3
- declare const TextInput: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
4
- export default TextInput;
3
+ export declare const TextInput: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
@@ -74,4 +74,4 @@ const TextInput = forwardRef(({ maxLength, onChange, pattern, onValidate, valida
74
74
  });
75
75
  TextInput.displayName = 'TextInput';
76
76
 
77
- export { TextInput as default };
77
+ export { TextInput };
@@ -43,9 +43,9 @@ export declare const useSelectContext: () => SelectContextValue;
43
43
  * </Select.Options>
44
44
  * </Select>
45
45
  */
46
- declare const Select: (({ value, onChange, multiple, children }: SelectProps) => import("react/jsx-runtime").JSX.Element) & {
46
+ export declare const Select: (({ value, onChange, multiple, children }: SelectProps) => import("react/jsx-runtime").JSX.Element) & {
47
47
  Trigger: (props: SelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
48
48
  Options: ({ children, ...props }: SelectOptionsProps) => import("react").ReactPortal | null;
49
49
  Option: ({ value, disabled, children, ...props }: SelectOptionProps) => import("react/jsx-runtime").JSX.Element;
50
50
  };
51
- export default Select;
51
+ export {};
@@ -167,10 +167,10 @@ const Option = ({ value, disabled, children, ...props }) => {
167
167
  * </Select.Options>
168
168
  * </Select>
169
169
  */
170
- Object.assign(SelectContainer, {
170
+ const Select = Object.assign(SelectContainer, {
171
171
  Trigger,
172
172
  Options,
173
173
  Option,
174
174
  });
175
175
 
176
- export { useSelectContext };
176
+ export { Select, useSelectContext };
@@ -1,8 +1,7 @@
1
1
  import React from 'react';
2
2
  import type { AutocompleteInputProps, AutocompleteOptionProps, AutocompleteOptionsProps, AutocompleteProps } from './Autocomplete.type';
3
- declare const Autocomplete: (({ value, onChange, inputValue, onInputChange, disabled, filterFn, children, }: AutocompleteProps) => import("react/jsx-runtime").JSX.Element) & {
3
+ export declare const Autocomplete: (({ value, onChange, inputValue, onInputChange, disabled, filterFn, children, }: AutocompleteProps) => import("react/jsx-runtime").JSX.Element) & {
4
4
  Input: ({ onKeyDown, onFocus, onChange, onCompositionStart, onCompositionEnd, ...props }: AutocompleteInputProps) => import("react/jsx-runtime").JSX.Element;
5
5
  Options: ({ items, renderItem, itemHeight, maxVisibleItems, overscan, children, ...props }: AutocompleteOptionsProps) => React.ReactPortal | null;
6
6
  Option: ({ value, label, disabled, children, ...props }: AutocompleteOptionProps) => import("react/jsx-runtime").JSX.Element | null;
7
7
  };
8
- export default Autocomplete;
@@ -119,7 +119,7 @@ const Input = ({ onKeyDown, onFocus, onChange, onCompositionStart, onComposition
119
119
  setOpen(true);
120
120
  setActiveIndex(activeIndex < 0 ? 0 : (activeIndex + delta + filtered.length) % filtered.length);
121
121
  };
122
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TextInput, { ref: inputRef, role: 'combobox', "aria-autocomplete": 'list', "aria-expanded": open, "aria-controls": listboxId, "aria-activedescendant": activeId, disabled: disabled, value: query, onFocus: (e) => {
122
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TextInput.TextInput, { ref: inputRef, role: 'combobox', "aria-autocomplete": 'list', "aria-expanded": open, "aria-controls": listboxId, "aria-activedescendant": activeId, disabled: disabled, value: query, onFocus: (e) => {
123
123
  if (!disabled) {
124
124
  setOpen(true);
125
125
  setActiveIndex(filtered.length ? 0 : -1);
@@ -292,8 +292,10 @@ const Option = ({ value, label, disabled, children, ...props }) => {
292
292
  setActiveIndex(-1);
293
293
  }, ...props, children: children ?? label }));
294
294
  };
295
- Object.assign(AutocompleteContainer, {
295
+ const Autocomplete = Object.assign(AutocompleteContainer, {
296
296
  Input,
297
297
  Options,
298
298
  Option,
299
299
  });
300
+
301
+ exports.Autocomplete = Autocomplete;
@@ -1,3 +1,2 @@
1
1
  import { NumberInputProps } from './NumberInput.type';
2
- declare const NumberInput: ({ max, useThousandsSeparator, onChange, ...props }: NumberInputProps) => import("react/jsx-runtime").JSX.Element;
3
- export default NumberInput;
2
+ export declare const NumberInput: ({ max, useThousandsSeparator, onChange, ...props }: NumberInputProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,40 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var TextInput = require('./TextInput.js');
5
+
6
+ const NumberInput = ({ max, useThousandsSeparator, onChange, ...props }) => {
7
+ const handleChange = (e) => {
8
+ const rawValue = e.target.value.replace(/,/g, '');
9
+ if (rawValue && isNaN(Number(rawValue)))
10
+ return;
11
+ let finalValue = rawValue;
12
+ if (max && Number(rawValue) > max) {
13
+ finalValue = String(max);
14
+ }
15
+ if (useThousandsSeparator && finalValue) {
16
+ const formattedValue = Number(finalValue).toLocaleString();
17
+ const syntheticEvent = {
18
+ ...e,
19
+ target: {
20
+ ...e.target,
21
+ value: formattedValue,
22
+ },
23
+ };
24
+ onChange?.(syntheticEvent);
25
+ }
26
+ else {
27
+ const syntheticEvent = {
28
+ ...e,
29
+ target: {
30
+ ...e.target,
31
+ value: finalValue,
32
+ },
33
+ };
34
+ onChange?.(syntheticEvent);
35
+ }
36
+ };
37
+ return jsxRuntime.jsx(TextInput.TextInput, { ...props, onChange: handleChange });
38
+ };
39
+
40
+ exports.NumberInput = NumberInput;
@@ -1,4 +1,3 @@
1
1
  import React from 'react';
2
2
  import { TextInputProps } from './TextInput.type';
3
- declare const TextInput: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
4
- export default TextInput;
3
+ export declare const TextInput: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
@@ -76,4 +76,4 @@ const TextInput = react.forwardRef(({ maxLength, onChange, pattern, onValidate,
76
76
  });
77
77
  TextInput.displayName = 'TextInput';
78
78
 
79
- module.exports = TextInput;
79
+ exports.TextInput = TextInput;
@@ -43,9 +43,9 @@ export declare const useSelectContext: () => SelectContextValue;
43
43
  * </Select.Options>
44
44
  * </Select>
45
45
  */
46
- declare const Select: (({ value, onChange, multiple, children }: SelectProps) => import("react/jsx-runtime").JSX.Element) & {
46
+ export declare const Select: (({ value, onChange, multiple, children }: SelectProps) => import("react/jsx-runtime").JSX.Element) & {
47
47
  Trigger: (props: SelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
48
48
  Options: ({ children, ...props }: SelectOptionsProps) => import("react").ReactPortal | null;
49
49
  Option: ({ value, disabled, children, ...props }: SelectOptionProps) => import("react/jsx-runtime").JSX.Element;
50
50
  };
51
- export default Select;
51
+ export {};
@@ -169,10 +169,11 @@ const Option = ({ value, disabled, children, ...props }) => {
169
169
  * </Select.Options>
170
170
  * </Select>
171
171
  */
172
- Object.assign(SelectContainer, {
172
+ const Select = Object.assign(SelectContainer, {
173
173
  Trigger,
174
174
  Options,
175
175
  Option,
176
176
  });
177
177
 
178
+ exports.Select = Select;
178
179
  exports.useSelectContext = useSelectContext;
package/dist/cjs/index.js CHANGED
@@ -6,13 +6,18 @@ require('react-dom');
6
6
  var useDebounce = require('./hooks/useDebounce.js');
7
7
  var useThrottle = require('./hooks/useThrottle.js');
8
8
  var Tooltip = require('./Tooltip/Tooltip.js');
9
- require('./Input/TextInput.js');
9
+ var NumberInput = require('./Input/NumberInput.js');
10
+ var TextInput = require('./Input/TextInput.js');
10
11
  var Select = require('./Select/Select.js');
11
- require('./Autocomplete/Autocomplete.js');
12
+ var Autocomplete = require('./Autocomplete/Autocomplete.js');
12
13
 
13
14
 
14
15
 
15
16
  exports.useDebounce = useDebounce.useDebounce;
16
17
  exports.useThrottle = useThrottle.useThrottle;
17
18
  exports.Tooltip = Tooltip.Tooltip;
19
+ exports.NumberInput = NumberInput.NumberInput;
20
+ exports.TextInput = TextInput.TextInput;
21
+ exports.Select = Select.Select;
18
22
  exports.useSelectContext = Select.useSelectContext;
23
+ exports.Autocomplete = Autocomplete.Autocomplete;
package/dist/index.js CHANGED
@@ -4,6 +4,7 @@ import 'react-dom';
4
4
  export { useDebounce } from './hooks/useDebounce.js';
5
5
  export { useThrottle } from './hooks/useThrottle.js';
6
6
  export { Tooltip } from './Tooltip/Tooltip.js';
7
- import './Input/TextInput.js';
8
- export { useSelectContext } from './Select/Select.js';
9
- import './Autocomplete/Autocomplete.js';
7
+ export { NumberInput } from './Input/NumberInput.js';
8
+ export { TextInput } from './Input/TextInput.js';
9
+ export { Select, useSelectContext } from './Select/Select.js';
10
+ export { Autocomplete } from './Autocomplete/Autocomplete.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "jy-headless",
3
- "version": "0.3.13",
3
+ "version": "0.3.14",
4
4
  "description": "A lightweight and customizable headless UI library for React components",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",