tp-react-elements 1.3.19 → 2.0.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/README.md +20 -0
- package/dist/_virtual/index.esm11.js +2 -2
- package/dist/_virtual/index.esm12.js +2 -2
- package/dist/_virtual/index.esm13.js +2 -2
- package/dist/_virtual/index.esm14.js +2 -2
- package/dist/_virtual/index.esm4.js +2 -2
- package/dist/_virtual/index.esm5.js +2 -2
- package/dist/_virtual/index.esm6.js +2 -2
- package/dist/_virtual/index.esm7.js +2 -2
- package/dist/components/FormComponents/Select/SingleSelectSearchApi.d.ts +17 -0
- package/dist/components/FormComponents/Select/SingleSelectSearchApi.esm.js +40 -1
- package/dist/components/PaginatedGrid/GenericPaginatedGrid.esm.js +18 -0
- package/dist/node_modules/react-date-range/dist/components/Calendar/index.esm.js +1 -1
- package/dist/node_modules/react-date-range/dist/components/DateInput/index.esm.js +1 -1
- package/dist/node_modules/react-date-range/dist/components/DateRange/index.esm.js +1 -1
- package/dist/node_modules/react-date-range/dist/components/DateRangePicker/index.esm.js +1 -1
- package/dist/node_modules/react-date-range/dist/components/DayCell/index.esm.js +1 -1
- package/dist/node_modules/react-date-range/dist/components/DefinedRange/index.esm.js +1 -1
- package/dist/node_modules/react-date-range/dist/components/InputRangeField/index.esm.js +1 -1
- package/dist/node_modules/react-date-range/dist/components/Month/index.esm.js +1 -1
- package/package.json +211 -211
package/README.md
CHANGED
|
@@ -2,6 +2,26 @@
|
|
|
2
2
|
|
|
3
3
|
A comprehensive React form library built with Material-UI and React Hook Form, designed for enterprise applications.
|
|
4
4
|
|
|
5
|
+
## 🆕 What's New
|
|
6
|
+
|
|
7
|
+
> Quick-glance log of notable fixes and changes. Newest entries first.
|
|
8
|
+
> Each entry should also be reflected in the affected component's
|
|
9
|
+
> Storybook docs (`*.stories.tsx` → `meta.parameters.docs.description`)
|
|
10
|
+
> so consumers see the same explanation in both places.
|
|
11
|
+
|
|
12
|
+
- **`SingleSelectSearchApi`** — Fixed a `Tooltip`/Popper mis-anchoring bug where
|
|
13
|
+
the selected-value tooltip rendered pinned to the viewport's top-left corner
|
|
14
|
+
(0,0) instead of near the input when the field sat inside an
|
|
15
|
+
`overflow: hidden` ancestor (e.g. a table cell in `material-react-table` /
|
|
16
|
+
`GenericPaginatedGrid`). The `Tooltip` is **retained** (not removed) and now
|
|
17
|
+
uses `placement="top-start"`, `arrow`, `disableInteractive`, and a
|
|
18
|
+
`slotProps.popper` block with Popper.js modifiers (`offset`,
|
|
19
|
+
`preventOverflow` with `boundary: 'clippingParents'`, `flip`) so it
|
|
20
|
+
portal-renders to `document.body` and stays correctly anchored. See the
|
|
21
|
+
**"Tooltip inside a clipped container"** story in
|
|
22
|
+
`SingleSelectSearchApi.stories.tsx` for a live repro, and the component's
|
|
23
|
+
JSDoc for implementation notes.
|
|
24
|
+
|
|
5
25
|
## 🚀 Features
|
|
6
26
|
|
|
7
27
|
- **🔄 Seamless Integration** - Built on React Hook Form for performance and flexibility
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var
|
|
1
|
+
var DayCell = {};
|
|
2
2
|
|
|
3
|
-
export {
|
|
3
|
+
export { DayCell as __exports };
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var
|
|
1
|
+
var Month = {};
|
|
2
2
|
|
|
3
|
-
export {
|
|
3
|
+
export { Month as __exports };
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var
|
|
1
|
+
var DateInput = {};
|
|
2
2
|
|
|
3
|
-
export {
|
|
3
|
+
export { DateInput as __exports };
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var
|
|
1
|
+
var InputRangeField = {};
|
|
2
2
|
|
|
3
|
-
export {
|
|
3
|
+
export { InputRangeField as __exports };
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var
|
|
1
|
+
var DateRange = {};
|
|
2
2
|
|
|
3
|
-
export {
|
|
3
|
+
export { DateRange as __exports };
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var
|
|
1
|
+
var Calendar = {};
|
|
2
2
|
|
|
3
|
-
export {
|
|
3
|
+
export { Calendar as __exports };
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var
|
|
1
|
+
var DateRangePicker = {};
|
|
2
2
|
|
|
3
|
-
export {
|
|
3
|
+
export { DateRangePicker as __exports };
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var
|
|
1
|
+
var DefinedRange = {};
|
|
2
2
|
|
|
3
|
-
export {
|
|
3
|
+
export { DefinedRange as __exports };
|
|
@@ -21,6 +21,23 @@ export interface SearchOption {
|
|
|
21
21
|
* ### API call guard
|
|
22
22
|
* Searches fire only after `minSearchLength` chars AND after the `debounceMs`
|
|
23
23
|
* debounce delay — preventing a request per keystroke.
|
|
24
|
+
*
|
|
25
|
+
* ### Selected-value tooltip & anchoring inside clipped containers
|
|
26
|
+
* The input is wrapped in a MUI `Tooltip` showing `resolvedValue.label` on
|
|
27
|
+
* hover (useful when a narrow column truncates the label). The `Tooltip` is
|
|
28
|
+
* configured with `placement="top-start"`, `arrow`, `disableInteractive`, and
|
|
29
|
+
* a `slotProps.popper` block carrying Popper.js modifiers — `offset`,
|
|
30
|
+
* `preventOverflow` (`boundary: 'clippingParents'`), and `flip`.
|
|
31
|
+
*
|
|
32
|
+
* This keeps the tooltip correctly anchored to the input even when the field
|
|
33
|
+
* sits inside an `overflow: hidden` ancestor (e.g. a table cell in
|
|
34
|
+
* `material-react-table` / `GenericPaginatedGrid`) — without this
|
|
35
|
+
* configuration, MUI's Popper can mis-anchor and pin the tooltip to the
|
|
36
|
+
* viewport's top-left corner (0,0) instead of near the input. The fix
|
|
37
|
+
* deliberately *keeps* the `Tooltip` (rather than removing it) by letting it
|
|
38
|
+
* portal-render to `document.body` and resolving its position against the
|
|
39
|
+
* clipping ancestor's boundary. See the "Tooltip inside a clipped container"
|
|
40
|
+
* Storybook story for a live repro.
|
|
24
41
|
*/
|
|
25
42
|
declare const SingleSelectSearchApi: ({ props, variant, minSearchLength, debounceMs, fetchOptions, }: {
|
|
26
43
|
props: FormRenderProps;
|
|
@@ -49,6 +49,23 @@ function useDebounce(value, delayMs) {
|
|
|
49
49
|
* ### API call guard
|
|
50
50
|
* Searches fire only after `minSearchLength` chars AND after the `debounceMs`
|
|
51
51
|
* debounce delay — preventing a request per keystroke.
|
|
52
|
+
*
|
|
53
|
+
* ### Selected-value tooltip & anchoring inside clipped containers
|
|
54
|
+
* The input is wrapped in a MUI `Tooltip` showing `resolvedValue.label` on
|
|
55
|
+
* hover (useful when a narrow column truncates the label). The `Tooltip` is
|
|
56
|
+
* configured with `placement="top-start"`, `arrow`, `disableInteractive`, and
|
|
57
|
+
* a `slotProps.popper` block carrying Popper.js modifiers — `offset`,
|
|
58
|
+
* `preventOverflow` (`boundary: 'clippingParents'`), and `flip`.
|
|
59
|
+
*
|
|
60
|
+
* This keeps the tooltip correctly anchored to the input even when the field
|
|
61
|
+
* sits inside an `overflow: hidden` ancestor (e.g. a table cell in
|
|
62
|
+
* `material-react-table` / `GenericPaginatedGrid`) — without this
|
|
63
|
+
* configuration, MUI's Popper can mis-anchor and pin the tooltip to the
|
|
64
|
+
* viewport's top-left corner (0,0) instead of near the input. The fix
|
|
65
|
+
* deliberately *keeps* the `Tooltip` (rather than removing it) by letting it
|
|
66
|
+
* portal-render to `document.body` and resolving its position against the
|
|
67
|
+
* clipping ancestor's boundary. See the "Tooltip inside a clipped container"
|
|
68
|
+
* Storybook story for a live repro.
|
|
52
69
|
*/
|
|
53
70
|
const SingleSelectSearchApi = ({ props, variant, minSearchLength = 3, debounceMs = 300, fetchOptions, }) => {
|
|
54
71
|
// ── Stable references from props ──────────────────────────────────────────
|
|
@@ -188,7 +205,29 @@ const SingleSelectSearchApi = ({ props, variant, minSearchLength = 3, debounceMs
|
|
|
188
205
|
}, slotProps: {
|
|
189
206
|
popper: { sx: { zIndex: 20000 } },
|
|
190
207
|
listbox: { sx: { fontSize: '11px' } },
|
|
191
|
-
}, PaperComponent: ({ children, ...paperProps }) => (jsx(Paper, { elevation: 4, ...paperProps, children: children })), renderInput: (params) => (jsx(Tooltip, { title: resolvedValue?.label ?? '',
|
|
208
|
+
}, PaperComponent: ({ children, ...paperProps }) => (jsx(Paper, { elevation: 4, ...paperProps, children: children })), renderInput: (params) => (jsx(Tooltip, { title: resolvedValue?.label ?? '', placement: "top-start", arrow: true, disableInteractive: true,
|
|
209
|
+
// Fixes a Popper mis-anchoring bug where the tooltip rendered
|
|
210
|
+
// pinned to the viewport's top-left corner when this field
|
|
211
|
+
// sits inside an `overflow: hidden` ancestor (e.g. a table
|
|
212
|
+
// cell in material-react-table / GenericPaginatedGrid).
|
|
213
|
+
// `disablePortal: false` (the default) lets the tooltip
|
|
214
|
+
// escape the clipping ancestor by portal-rendering to
|
|
215
|
+
// `document.body`, while the `preventOverflow` / `flip`
|
|
216
|
+
// modifiers keep it correctly anchored to the input and
|
|
217
|
+
// flip placement when there isn't room above.
|
|
218
|
+
slotProps: {
|
|
219
|
+
popper: {
|
|
220
|
+
sx: { zIndex: 20001 },
|
|
221
|
+
modifiers: [
|
|
222
|
+
{ name: 'offset', options: { offset: [0, 6] } },
|
|
223
|
+
{
|
|
224
|
+
name: 'preventOverflow',
|
|
225
|
+
options: { boundary: 'clippingParents', altAxis: true, padding: 8 },
|
|
226
|
+
},
|
|
227
|
+
{ name: 'flip', enabled: true },
|
|
228
|
+
],
|
|
229
|
+
},
|
|
230
|
+
}, children: jsx(TextField, { ...params, error: isError && !formValue, label: variant !== 'standard'
|
|
192
231
|
? `${label}${required ? ' *' : ''}`
|
|
193
232
|
: '', placeholder: placeholder, inputProps: {
|
|
194
233
|
...params.inputProps,
|
|
@@ -422,6 +422,7 @@ function GenericPaginatedGrid({ columns, fetchPage, queryKey, serverFilterDefs,
|
|
|
422
422
|
data: rows,
|
|
423
423
|
layoutMode,
|
|
424
424
|
displayColumnDefOptions: {
|
|
425
|
+
// Hide the trailing spacer column that `layoutMode="grid"` inserts.
|
|
425
426
|
'mrt-row-spacer': {
|
|
426
427
|
size: 0,
|
|
427
428
|
minSize: 0,
|
|
@@ -435,6 +436,23 @@ function GenericPaginatedGrid({ columns, fetchPage, queryKey, serverFilterDefs,
|
|
|
435
436
|
sx: { display: 'none !important', width: 0, maxWidth: 0, p: 0, border: 'none' },
|
|
436
437
|
},
|
|
437
438
|
},
|
|
439
|
+
// Constrain the MRT-native expand column to a fixed narrow width so it
|
|
440
|
+
// never auto-grows. Only takes effect when enableExpanding is true
|
|
441
|
+
// (i.e. when renderDetailPanel is provided).
|
|
442
|
+
'mrt-row-expand': {
|
|
443
|
+
size: 36,
|
|
444
|
+
minSize: 36,
|
|
445
|
+
maxSize: 36,
|
|
446
|
+
grow: false,
|
|
447
|
+
enableResizing: false,
|
|
448
|
+
header: '',
|
|
449
|
+
muiTableHeadCellProps: {
|
|
450
|
+
sx: { p: 0, m: 0, width: '36px', maxWidth: '36px', borderRight: 'none' },
|
|
451
|
+
},
|
|
452
|
+
muiTableBodyCellProps: {
|
|
453
|
+
sx: { p: 0, m: 0, width: '36px', maxWidth: '36px', borderRight: 'none' },
|
|
454
|
+
},
|
|
455
|
+
},
|
|
438
456
|
},
|
|
439
457
|
manualPagination: true,
|
|
440
458
|
rowCount: totalRecords,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as Calendar } from '../../../../../_virtual/index.
|
|
1
|
+
import { __exports as Calendar } from '../../../../../_virtual/index.esm5.js';
|
|
2
2
|
import React__default from 'react';
|
|
3
3
|
import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
|
|
4
4
|
import { __require as requireDayCell } from '../DayCell/index.esm.js';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as DateInput } from '../../../../../_virtual/index.
|
|
1
|
+
import { __exports as DateInput } from '../../../../../_virtual/index.esm13.js';
|
|
2
2
|
import React__default from 'react';
|
|
3
3
|
import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
|
|
4
4
|
import { __require as requireClassnames } from '../../../../classnames/index.esm.js';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as DateRange } from '../../../../../_virtual/index.
|
|
1
|
+
import { __exports as DateRange } from '../../../../../_virtual/index.esm4.js';
|
|
2
2
|
import React__default from 'react';
|
|
3
3
|
import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
|
|
4
4
|
import { __require as requireCalendar } from '../Calendar/index.esm.js';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as DateRangePicker } from '../../../../../_virtual/index.
|
|
1
|
+
import { __exports as DateRangePicker } from '../../../../../_virtual/index.esm6.js';
|
|
2
2
|
import React__default from 'react';
|
|
3
3
|
import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
|
|
4
4
|
import { __require as requireDateRange } from '../DateRange/index.esm.js';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as DayCell } from '../../../../../_virtual/index.
|
|
1
|
+
import { __exports as DayCell } from '../../../../../_virtual/index.esm11.js';
|
|
2
2
|
import React__default from 'react';
|
|
3
3
|
import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
|
|
4
4
|
import { __require as requireClassnames } from '../../../../classnames/index.esm.js';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as DefinedRange } from '../../../../../_virtual/index.
|
|
1
|
+
import { __exports as DefinedRange } from '../../../../../_virtual/index.esm7.js';
|
|
2
2
|
import React__default from 'react';
|
|
3
3
|
import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
|
|
4
4
|
import { __require as requireStyles } from '../../styles.esm.js';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as InputRangeField } from '../../../../../_virtual/index.
|
|
1
|
+
import { __exports as InputRangeField } from '../../../../../_virtual/index.esm14.js';
|
|
2
2
|
import React__default from 'react';
|
|
3
3
|
import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
|
|
4
4
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as Month } from '../../../../../_virtual/index.
|
|
1
|
+
import { __exports as Month } from '../../../../../_virtual/index.esm12.js';
|
|
2
2
|
import React__default from 'react';
|
|
3
3
|
import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
|
|
4
4
|
import { __require as requireDayCell } from '../DayCell/index.esm.js';
|
package/package.json
CHANGED
|
@@ -1,211 +1,211 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "tp-react-elements",
|
|
3
|
-
"version": "
|
|
4
|
-
"private": false,
|
|
5
|
-
"type": "module",
|
|
6
|
-
"description": "React form components library built with React Hook Form and Yup",
|
|
7
|
-
"main": "dist/index.esm.js",
|
|
8
|
-
"module": "dist/index.esm.js",
|
|
9
|
-
"types": "dist/index.d.ts",
|
|
10
|
-
"exports": {
|
|
11
|
-
".": {
|
|
12
|
-
"import": "./dist/index.esm.js",
|
|
13
|
-
"types": "./dist/index.d.ts"
|
|
14
|
-
},
|
|
15
|
-
"./form": {
|
|
16
|
-
"import": "./dist/components/Form/index.esm.js",
|
|
17
|
-
"types": "./dist/components/Form/index.d.ts"
|
|
18
|
-
},
|
|
19
|
-
"./utils": {
|
|
20
|
-
"import": "./dist/utils/index.esm.js",
|
|
21
|
-
"types": "./dist/utils/index.d.ts"
|
|
22
|
-
},
|
|
23
|
-
"./validation": {
|
|
24
|
-
"import": "./dist/validation/index.esm.js",
|
|
25
|
-
"types": "./dist/validation/index.d.ts"
|
|
26
|
-
},
|
|
27
|
-
"./components/*": {
|
|
28
|
-
"import": "./dist/components/*/index.esm.js",
|
|
29
|
-
"types": "./dist/components/*/index.d.ts"
|
|
30
|
-
},
|
|
31
|
-
"./theme": {
|
|
32
|
-
"import": "./dist/theme/index.esm.js",
|
|
33
|
-
"types": "./dist/theme/index.d.ts"
|
|
34
|
-
},
|
|
35
|
-
"./package.json": "./package.json"
|
|
36
|
-
},
|
|
37
|
-
"bin": {
|
|
38
|
-
"install-tp-form-deps": "./scripts/install-deps.js"
|
|
39
|
-
},
|
|
40
|
-
"files": [
|
|
41
|
-
"dist",
|
|
42
|
-
"scripts"
|
|
43
|
-
],
|
|
44
|
-
"sideEffects": [
|
|
45
|
-
"*.css",
|
|
46
|
-
"*.scss"
|
|
47
|
-
],
|
|
48
|
-
"scripts": {
|
|
49
|
-
"dev": "vite",
|
|
50
|
-
"preview": "vite preview",
|
|
51
|
-
"clean": "rimraf dist dist-dev",
|
|
52
|
-
"type-check": "tsc --noEmit",
|
|
53
|
-
"build:types": "tsc --project tsconfig.build.json --emitDeclarationOnly && tsc-alias -p tsconfig.build.json && echo \"✅ TypeScript declaration files generated successfully!\"",
|
|
54
|
-
"build:types:qa": "tsc --project tsconfig.build.qa.json --emitDeclarationOnly && tsc-alias -p tsconfig.build.qa.json && echo \"✅ QA declaration files (with maps) generated!\"",
|
|
55
|
-
"build:esm": "npm run clean && rollup -c rollup.config.js",
|
|
56
|
-
"build:lib": "npm run clean && rollup -c rollup.config.js && npm run build:types && echo \"✅ Complete library build finished! ESM build completed successfully!\"",
|
|
57
|
-
"build:lib:qa": "npm run clean && rollup -c rollup.config.js && npm run build:types:qa && echo \"✅ QA build finished (includes .d.ts.map)\"",
|
|
58
|
-
"analyze": "npm run clean && cross-env BUNDLE_ANALYZE=true rollup -c rollup.config.js",
|
|
59
|
-
"analyze:dev": "cross-env ANALYZE_BUNDLE=true vite build",
|
|
60
|
-
"test": "vitest",
|
|
61
|
-
"test:ui": "vitest --ui",
|
|
62
|
-
"test:coverage": "vitest --coverage",
|
|
63
|
-
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
|
64
|
-
"lint:fix": "eslint . --ext ts,tsx --fix",
|
|
65
|
-
"format": "prettier --write \"src/**/*.{js,jsx,ts,tsx,css,scss,md,json}\"",
|
|
66
|
-
"format:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx,css,scss,md,json}\"",
|
|
67
|
-
"storybook": "storybook dev -p 6006",
|
|
68
|
-
"build-storybook": "storybook build",
|
|
69
|
-
"version:patch": "npm version patch",
|
|
70
|
-
"version:minor": "npm version minor",
|
|
71
|
-
"version:major": "npm version major",
|
|
72
|
-
"publish:prepare": "npm run build:lib && npm run type-check",
|
|
73
|
-
"publish:npm": "npm publish",
|
|
74
|
-
"publish:beta": "npm publish --tag beta",
|
|
75
|
-
"publish:patch": "npm version patch --no-git-tag-version && npm publish",
|
|
76
|
-
"publish:minor": "npm version minor --no-git-tag-version && npm publish",
|
|
77
|
-
"publish:major": "npm version major --no-git-tag-version && npm publish",
|
|
78
|
-
"publish:auto": "npm run publish:prepare && npm publish",
|
|
79
|
-
"install-peers": "install-tp-form-deps",
|
|
80
|
-
"package-build": "rollup -c --bundleConfigAsCjs",
|
|
81
|
-
"prepublishOnly": "npm run build:lib"
|
|
82
|
-
},
|
|
83
|
-
"peerDependencies": {
|
|
84
|
-
"@tanstack/react-query": ">=5.0.0 <6.0.0",
|
|
85
|
-
"@emotion/react": ">=11.14.0 <13.0.0",
|
|
86
|
-
"@emotion/styled": ">=11.14.1 <13.0.0",
|
|
87
|
-
"@hookform/error-message": ">=2.0.1 <3.0.0",
|
|
88
|
-
"@hookform/resolvers": ">=5.2.1 <6.0.0",
|
|
89
|
-
"@mui/icons-material": ">=7.3.1 <8.0.0",
|
|
90
|
-
"@mui/material": ">=7.3.1 <8.0.0",
|
|
91
|
-
"@mui/x-date-pickers": ">=8.10.2 <9.0.0",
|
|
92
|
-
"crypto-js": ">=4.2.0 <5.0.0",
|
|
93
|
-
"dayjs": ">=1.11.13 <2.0.0",
|
|
94
|
-
"file-saver": ">=2.0.5 <3.0.0",
|
|
95
|
-
"jodit": ">=4.6.2 <5.0.0",
|
|
96
|
-
"jodit-react": ">=5.2.19 <6.0.0",
|
|
97
|
-
"material-react-table": ">=3.0.0 <4.0.0",
|
|
98
|
-
"react": ">=18 <20",
|
|
99
|
-
"react-dom": ">=18 <20",
|
|
100
|
-
"react-hook-form": ">=7.62.0 <8.0.0",
|
|
101
|
-
"react-idle-timer": ">=5.7.2 <6.0.0",
|
|
102
|
-
"xlsx-js-style": ">=1.2.0 <2.0.0",
|
|
103
|
-
"yup": ">=1.7.0 <2.0.0"
|
|
104
|
-
},
|
|
105
|
-
"peerDependenciesMeta": {
|
|
106
|
-
"@tanstack/react-query": {
|
|
107
|
-
"optional": true
|
|
108
|
-
},
|
|
109
|
-
"react-idle-timer": {
|
|
110
|
-
"optional": true
|
|
111
|
-
},
|
|
112
|
-
"jodit": {
|
|
113
|
-
"optional": true
|
|
114
|
-
},
|
|
115
|
-
"jodit-react": {
|
|
116
|
-
"optional": true
|
|
117
|
-
},
|
|
118
|
-
"material-react-table": {
|
|
119
|
-
"optional": true
|
|
120
|
-
}
|
|
121
|
-
},
|
|
122
|
-
"devDependencies": {
|
|
123
|
-
"@emotion/react": "^11.14.0",
|
|
124
|
-
"@emotion/styled": "^11.14.1",
|
|
125
|
-
"@hookform/error-message": "^2.0.1",
|
|
126
|
-
"@hookform/resolvers": "^5.2.1",
|
|
127
|
-
"@mui/icons-material": "^7.3.1",
|
|
128
|
-
"@mui/material": "^7.3.1",
|
|
129
|
-
"@mui/x-date-pickers": "^8.10.2",
|
|
130
|
-
"@rollup/plugin-commonjs": "^28.0.6",
|
|
131
|
-
"@rollup/plugin-node-resolve": "^16.0.1",
|
|
132
|
-
"@rollup/plugin-typescript": "^12.1.4",
|
|
133
|
-
"@storybook/addon-docs": "^
|
|
134
|
-
"@storybook/addon-links": "^
|
|
135
|
-
"@storybook/react-vite": "^
|
|
136
|
-
"@tanstack/react-query": "^5.100.14",
|
|
137
|
-
"@testing-library/jest-dom": "^6.5.0",
|
|
138
|
-
"@testing-library/react": "^16.0.1",
|
|
139
|
-
"@testing-library/user-event": "^14.5.2",
|
|
140
|
-
"@types/crypto-js": "^4.2.2",
|
|
141
|
-
"@types/file-saver": "^2.0.7",
|
|
142
|
-
"@types/node": "^22.11.0",
|
|
143
|
-
"@types/react": "^19.0.0",
|
|
144
|
-
"@types/react-dom": "^19.0.0",
|
|
145
|
-
"@typescript-eslint/eslint-plugin": "^8.8.0",
|
|
146
|
-
"@typescript-eslint/parser": "^8.8.0",
|
|
147
|
-
"@vitejs/plugin-react": "^4.3.1",
|
|
148
|
-
"@vitest/coverage-v8": "^3.0.0",
|
|
149
|
-
"@vitest/ui": "^3.0.0",
|
|
150
|
-
"cross-env": "^10.0.0",
|
|
151
|
-
"crypto-js": "^4.2.0",
|
|
152
|
-
"dayjs": "^1.11.13",
|
|
153
|
-
"eslint": "^9.12.0",
|
|
154
|
-
"eslint-config-prettier": "^9.1.0",
|
|
155
|
-
"eslint-plugin-react": "^7.37.1",
|
|
156
|
-
"eslint-plugin-react-hooks": "^5.0.0",
|
|
157
|
-
"eslint-plugin-react-refresh": "^0.4.12",
|
|
158
|
-
"eslint-plugin-storybook": "
|
|
159
|
-
"file-saver": "^2.0.5",
|
|
160
|
-
"glob": "^10.4.5",
|
|
161
|
-
"jodit": "^4.6.2",
|
|
162
|
-
"jodit-react": "^5.2.19",
|
|
163
|
-
"jsdom": "^25.0.0",
|
|
164
|
-
"material-react-table": "^3.2.1",
|
|
165
|
-
"prettier": "^3.6.2",
|
|
166
|
-
"react": "^19.1.1",
|
|
167
|
-
"react-dom": "^19.1.1",
|
|
168
|
-
"react-hook-form": "^7.62.0",
|
|
169
|
-
"react-idle-timer": "^5.7.2",
|
|
170
|
-
"rimraf": "^5.0.7",
|
|
171
|
-
"rollup": "^4.22.4",
|
|
172
|
-
"rollup-plugin-analyzer": "^4.0.0",
|
|
173
|
-
"rollup-plugin-bundle-size": "^1.0.3",
|
|
174
|
-
"rollup-plugin-copy": "^3.5.0",
|
|
175
|
-
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
176
|
-
"rollup-plugin-postcss": "^4.0.2",
|
|
177
|
-
"rollup-plugin-visualizer": "^5.14.0",
|
|
178
|
-
"sass-embedded": "^1.90.0",
|
|
179
|
-
"storybook": "^
|
|
180
|
-
"tsc-alias": "^1.8.16",
|
|
181
|
-
"typescript": "^5.5.4",
|
|
182
|
-
"vite": "^6.0.0",
|
|
183
|
-
"vitest": "^3.0.0",
|
|
184
|
-
"xlsx-js-style": "^1.2.0",
|
|
185
|
-
"yup": "^1.7.0"
|
|
186
|
-
},
|
|
187
|
-
"keywords": [
|
|
188
|
-
"react",
|
|
189
|
-
"forms",
|
|
190
|
-
"components",
|
|
191
|
-
"react-hook-form",
|
|
192
|
-
"yup",
|
|
193
|
-
"typescript"
|
|
194
|
-
],
|
|
195
|
-
"author": "Mohammad Asheesh",
|
|
196
|
-
"contributors": [
|
|
197
|
-
"Karthik Mayandi",
|
|
198
|
-
"Other Dev"
|
|
199
|
-
],
|
|
200
|
-
"license": "MIT",
|
|
201
|
-
"engines": {
|
|
202
|
-
"node": ">=18.17.0 || >=20.11.0",
|
|
203
|
-
"npm": ">=10.9.0"
|
|
204
|
-
},
|
|
205
|
-
"dependencies": {
|
|
206
|
-
"@types/react-date-range": "^1.4.10",
|
|
207
|
-
"axios": "^1.13.2",
|
|
208
|
-
"date-fns": "^4.1.0",
|
|
209
|
-
"react-date-range": "^2.0.1"
|
|
210
|
-
}
|
|
211
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "tp-react-elements",
|
|
3
|
+
"version": "2.0.0",
|
|
4
|
+
"private": false,
|
|
5
|
+
"type": "module",
|
|
6
|
+
"description": "React form components library built with React Hook Form and Yup",
|
|
7
|
+
"main": "dist/index.esm.js",
|
|
8
|
+
"module": "dist/index.esm.js",
|
|
9
|
+
"types": "dist/index.d.ts",
|
|
10
|
+
"exports": {
|
|
11
|
+
".": {
|
|
12
|
+
"import": "./dist/index.esm.js",
|
|
13
|
+
"types": "./dist/index.d.ts"
|
|
14
|
+
},
|
|
15
|
+
"./form": {
|
|
16
|
+
"import": "./dist/components/Form/index.esm.js",
|
|
17
|
+
"types": "./dist/components/Form/index.d.ts"
|
|
18
|
+
},
|
|
19
|
+
"./utils": {
|
|
20
|
+
"import": "./dist/utils/index.esm.js",
|
|
21
|
+
"types": "./dist/utils/index.d.ts"
|
|
22
|
+
},
|
|
23
|
+
"./validation": {
|
|
24
|
+
"import": "./dist/validation/index.esm.js",
|
|
25
|
+
"types": "./dist/validation/index.d.ts"
|
|
26
|
+
},
|
|
27
|
+
"./components/*": {
|
|
28
|
+
"import": "./dist/components/*/index.esm.js",
|
|
29
|
+
"types": "./dist/components/*/index.d.ts"
|
|
30
|
+
},
|
|
31
|
+
"./theme": {
|
|
32
|
+
"import": "./dist/theme/index.esm.js",
|
|
33
|
+
"types": "./dist/theme/index.d.ts"
|
|
34
|
+
},
|
|
35
|
+
"./package.json": "./package.json"
|
|
36
|
+
},
|
|
37
|
+
"bin": {
|
|
38
|
+
"install-tp-form-deps": "./scripts/install-deps.js"
|
|
39
|
+
},
|
|
40
|
+
"files": [
|
|
41
|
+
"dist",
|
|
42
|
+
"scripts"
|
|
43
|
+
],
|
|
44
|
+
"sideEffects": [
|
|
45
|
+
"*.css",
|
|
46
|
+
"*.scss"
|
|
47
|
+
],
|
|
48
|
+
"scripts": {
|
|
49
|
+
"dev": "vite",
|
|
50
|
+
"preview": "vite preview",
|
|
51
|
+
"clean": "rimraf dist dist-dev",
|
|
52
|
+
"type-check": "tsc --noEmit",
|
|
53
|
+
"build:types": "tsc --project tsconfig.build.json --emitDeclarationOnly && tsc-alias -p tsconfig.build.json && echo \"✅ TypeScript declaration files generated successfully!\"",
|
|
54
|
+
"build:types:qa": "tsc --project tsconfig.build.qa.json --emitDeclarationOnly && tsc-alias -p tsconfig.build.qa.json && echo \"✅ QA declaration files (with maps) generated!\"",
|
|
55
|
+
"build:esm": "npm run clean && rollup -c rollup.config.js",
|
|
56
|
+
"build:lib": "npm run clean && rollup -c rollup.config.js && npm run build:types && echo \"✅ Complete library build finished! ESM build completed successfully!\"",
|
|
57
|
+
"build:lib:qa": "npm run clean && rollup -c rollup.config.js && npm run build:types:qa && echo \"✅ QA build finished (includes .d.ts.map)\"",
|
|
58
|
+
"analyze": "npm run clean && cross-env BUNDLE_ANALYZE=true rollup -c rollup.config.js",
|
|
59
|
+
"analyze:dev": "cross-env ANALYZE_BUNDLE=true vite build",
|
|
60
|
+
"test": "vitest",
|
|
61
|
+
"test:ui": "vitest --ui",
|
|
62
|
+
"test:coverage": "vitest --coverage",
|
|
63
|
+
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
|
64
|
+
"lint:fix": "eslint . --ext ts,tsx --fix",
|
|
65
|
+
"format": "prettier --write \"src/**/*.{js,jsx,ts,tsx,css,scss,md,json}\"",
|
|
66
|
+
"format:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx,css,scss,md,json}\"",
|
|
67
|
+
"storybook": "storybook dev -p 6006",
|
|
68
|
+
"build-storybook": "storybook build",
|
|
69
|
+
"version:patch": "npm version patch",
|
|
70
|
+
"version:minor": "npm version minor",
|
|
71
|
+
"version:major": "npm version major",
|
|
72
|
+
"publish:prepare": "npm run build:lib && npm run type-check",
|
|
73
|
+
"publish:npm": "npm publish",
|
|
74
|
+
"publish:beta": "npm publish --tag beta",
|
|
75
|
+
"publish:patch": "npm version patch --no-git-tag-version && npm publish",
|
|
76
|
+
"publish:minor": "npm version minor --no-git-tag-version && npm publish",
|
|
77
|
+
"publish:major": "npm version major --no-git-tag-version && npm publish",
|
|
78
|
+
"publish:auto": "npm run publish:prepare && npm publish",
|
|
79
|
+
"install-peers": "install-tp-form-deps",
|
|
80
|
+
"package-build": "rollup -c --bundleConfigAsCjs",
|
|
81
|
+
"prepublishOnly": "npm run build:lib"
|
|
82
|
+
},
|
|
83
|
+
"peerDependencies": {
|
|
84
|
+
"@tanstack/react-query": ">=5.0.0 <6.0.0",
|
|
85
|
+
"@emotion/react": ">=11.14.0 <13.0.0",
|
|
86
|
+
"@emotion/styled": ">=11.14.1 <13.0.0",
|
|
87
|
+
"@hookform/error-message": ">=2.0.1 <3.0.0",
|
|
88
|
+
"@hookform/resolvers": ">=5.2.1 <6.0.0",
|
|
89
|
+
"@mui/icons-material": ">=7.3.1 <8.0.0",
|
|
90
|
+
"@mui/material": ">=7.3.1 <8.0.0",
|
|
91
|
+
"@mui/x-date-pickers": ">=8.10.2 <9.0.0",
|
|
92
|
+
"crypto-js": ">=4.2.0 <5.0.0",
|
|
93
|
+
"dayjs": ">=1.11.13 <2.0.0",
|
|
94
|
+
"file-saver": ">=2.0.5 <3.0.0",
|
|
95
|
+
"jodit": ">=4.6.2 <5.0.0",
|
|
96
|
+
"jodit-react": ">=5.2.19 <6.0.0",
|
|
97
|
+
"material-react-table": ">=3.0.0 <4.0.0",
|
|
98
|
+
"react": ">=18 <20",
|
|
99
|
+
"react-dom": ">=18 <20",
|
|
100
|
+
"react-hook-form": ">=7.62.0 <8.0.0",
|
|
101
|
+
"react-idle-timer": ">=5.7.2 <6.0.0",
|
|
102
|
+
"xlsx-js-style": ">=1.2.0 <2.0.0",
|
|
103
|
+
"yup": ">=1.7.0 <2.0.0"
|
|
104
|
+
},
|
|
105
|
+
"peerDependenciesMeta": {
|
|
106
|
+
"@tanstack/react-query": {
|
|
107
|
+
"optional": true
|
|
108
|
+
},
|
|
109
|
+
"react-idle-timer": {
|
|
110
|
+
"optional": true
|
|
111
|
+
},
|
|
112
|
+
"jodit": {
|
|
113
|
+
"optional": true
|
|
114
|
+
},
|
|
115
|
+
"jodit-react": {
|
|
116
|
+
"optional": true
|
|
117
|
+
},
|
|
118
|
+
"material-react-table": {
|
|
119
|
+
"optional": true
|
|
120
|
+
}
|
|
121
|
+
},
|
|
122
|
+
"devDependencies": {
|
|
123
|
+
"@emotion/react": "^11.14.0",
|
|
124
|
+
"@emotion/styled": "^11.14.1",
|
|
125
|
+
"@hookform/error-message": "^2.0.1",
|
|
126
|
+
"@hookform/resolvers": "^5.2.1",
|
|
127
|
+
"@mui/icons-material": "^7.3.1",
|
|
128
|
+
"@mui/material": "^7.3.1",
|
|
129
|
+
"@mui/x-date-pickers": "^8.10.2",
|
|
130
|
+
"@rollup/plugin-commonjs": "^28.0.6",
|
|
131
|
+
"@rollup/plugin-node-resolve": "^16.0.1",
|
|
132
|
+
"@rollup/plugin-typescript": "^12.1.4",
|
|
133
|
+
"@storybook/addon-docs": "^10.4.2",
|
|
134
|
+
"@storybook/addon-links": "^10.4.2",
|
|
135
|
+
"@storybook/react-vite": "^10.4.2",
|
|
136
|
+
"@tanstack/react-query": "^5.100.14",
|
|
137
|
+
"@testing-library/jest-dom": "^6.5.0",
|
|
138
|
+
"@testing-library/react": "^16.0.1",
|
|
139
|
+
"@testing-library/user-event": "^14.5.2",
|
|
140
|
+
"@types/crypto-js": "^4.2.2",
|
|
141
|
+
"@types/file-saver": "^2.0.7",
|
|
142
|
+
"@types/node": "^22.11.0",
|
|
143
|
+
"@types/react": "^19.0.0",
|
|
144
|
+
"@types/react-dom": "^19.0.0",
|
|
145
|
+
"@typescript-eslint/eslint-plugin": "^8.8.0",
|
|
146
|
+
"@typescript-eslint/parser": "^8.8.0",
|
|
147
|
+
"@vitejs/plugin-react": "^4.3.1",
|
|
148
|
+
"@vitest/coverage-v8": "^3.0.0",
|
|
149
|
+
"@vitest/ui": "^3.0.0",
|
|
150
|
+
"cross-env": "^10.0.0",
|
|
151
|
+
"crypto-js": "^4.2.0",
|
|
152
|
+
"dayjs": "^1.11.13",
|
|
153
|
+
"eslint": "^9.12.0",
|
|
154
|
+
"eslint-config-prettier": "^9.1.0",
|
|
155
|
+
"eslint-plugin-react": "^7.37.1",
|
|
156
|
+
"eslint-plugin-react-hooks": "^5.0.0",
|
|
157
|
+
"eslint-plugin-react-refresh": "^0.4.12",
|
|
158
|
+
"eslint-plugin-storybook": "10.4.2",
|
|
159
|
+
"file-saver": "^2.0.5",
|
|
160
|
+
"glob": "^10.4.5",
|
|
161
|
+
"jodit": "^4.6.2",
|
|
162
|
+
"jodit-react": "^5.2.19",
|
|
163
|
+
"jsdom": "^25.0.0",
|
|
164
|
+
"material-react-table": "^3.2.1",
|
|
165
|
+
"prettier": "^3.6.2",
|
|
166
|
+
"react": "^19.1.1",
|
|
167
|
+
"react-dom": "^19.1.1",
|
|
168
|
+
"react-hook-form": "^7.62.0",
|
|
169
|
+
"react-idle-timer": "^5.7.2",
|
|
170
|
+
"rimraf": "^5.0.7",
|
|
171
|
+
"rollup": "^4.22.4",
|
|
172
|
+
"rollup-plugin-analyzer": "^4.0.0",
|
|
173
|
+
"rollup-plugin-bundle-size": "^1.0.3",
|
|
174
|
+
"rollup-plugin-copy": "^3.5.0",
|
|
175
|
+
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
176
|
+
"rollup-plugin-postcss": "^4.0.2",
|
|
177
|
+
"rollup-plugin-visualizer": "^5.14.0",
|
|
178
|
+
"sass-embedded": "^1.90.0",
|
|
179
|
+
"storybook": "^10.4.2",
|
|
180
|
+
"tsc-alias": "^1.8.16",
|
|
181
|
+
"typescript": "^5.5.4",
|
|
182
|
+
"vite": "^6.0.0",
|
|
183
|
+
"vitest": "^3.0.0",
|
|
184
|
+
"xlsx-js-style": "^1.2.0",
|
|
185
|
+
"yup": "^1.7.0"
|
|
186
|
+
},
|
|
187
|
+
"keywords": [
|
|
188
|
+
"react",
|
|
189
|
+
"forms",
|
|
190
|
+
"components",
|
|
191
|
+
"react-hook-form",
|
|
192
|
+
"yup",
|
|
193
|
+
"typescript"
|
|
194
|
+
],
|
|
195
|
+
"author": "Mohammad Asheesh",
|
|
196
|
+
"contributors": [
|
|
197
|
+
"Karthik Mayandi",
|
|
198
|
+
"Other Dev"
|
|
199
|
+
],
|
|
200
|
+
"license": "MIT",
|
|
201
|
+
"engines": {
|
|
202
|
+
"node": ">=18.17.0 || >=20.11.0",
|
|
203
|
+
"npm": ">=10.9.0"
|
|
204
|
+
},
|
|
205
|
+
"dependencies": {
|
|
206
|
+
"@types/react-date-range": "^1.4.10",
|
|
207
|
+
"axios": "^1.13.2",
|
|
208
|
+
"date-fns": "^4.1.0",
|
|
209
|
+
"react-date-range": "^2.0.1"
|
|
210
|
+
}
|
|
211
|
+
}
|