@cronocode/react-box 3.1.3 → 3.1.7
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/BOX_AI_CONTEXT.md +576 -0
- package/components/dataGrid/components/dataGridColumnFilter.d.ts +11 -0
- package/components/dataGrid/components/dataGridEmptyColumns.d.ts +1 -0
- package/components/dataGrid/components/dataGridFilterCell.d.ts +8 -0
- package/components/dataGrid/components/dataGridFilterRow.d.ts +6 -0
- package/components/dataGrid/components/dataGridGlobalFilter.d.ts +6 -0
- package/components/dataGrid/contracts/dataGridContract.d.ts +68 -0
- package/components/dataGrid/models/columnModel.d.ts +11 -0
- package/components/dataGrid/models/gridModel.d.ts +59 -2
- package/components/dataGrid.cjs +1 -1
- package/components/dataGrid.mjs +891 -314
- package/components/dropdown.cjs +1 -1
- package/components/dropdown.d.ts +4 -1
- package/components/dropdown.mjs +156 -147
- package/components/form.mjs +1 -1
- package/components/semantics.d.ts +25 -25
- package/components/semantics.mjs +5 -5
- package/components/textbox.cjs +1 -1
- package/components/textbox.d.ts +2 -2
- package/components/textbox.mjs +5 -4
- package/components/tooltip.cjs +1 -1
- package/components/tooltip.d.ts +4 -0
- package/components/tooltip.mjs +45 -41
- package/core/boxStyles.d.ts +65 -31
- package/core/extends/boxComponents.d.ts +660 -159
- package/core/variables.d.ts +25 -1
- package/core.cjs +3 -7
- package/core.mjs +1399 -693
- package/hooks/useVirtualization.d.ts +43 -0
- package/package.json +8 -5
- package/ssg.cjs +1 -1
- package/ssg.mjs +28 -20
- package/types.d.ts +5 -4
- package/utils/string/fuzzySearch.d.ts +27 -0
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
export interface UseVirtualizationOptions {
|
|
2
|
+
/** Total number of items */
|
|
3
|
+
itemCount: number;
|
|
4
|
+
/** Height of each item in pixels */
|
|
5
|
+
itemHeight: number;
|
|
6
|
+
/** Height of the visible container in pixels */
|
|
7
|
+
containerHeight: number;
|
|
8
|
+
/** Number of items to render outside visible area (default: 3) */
|
|
9
|
+
overscan?: number;
|
|
10
|
+
/** Whether virtualization is enabled (default: true when itemCount > threshold) */
|
|
11
|
+
enabled?: boolean;
|
|
12
|
+
/** Threshold for enabling virtualization (default: 50) */
|
|
13
|
+
threshold?: number;
|
|
14
|
+
}
|
|
15
|
+
export interface UseVirtualizationResult {
|
|
16
|
+
/** First item index to render */
|
|
17
|
+
startIndex: number;
|
|
18
|
+
/** Last item index to render (inclusive) */
|
|
19
|
+
endIndex: number;
|
|
20
|
+
/** Total height of all items (for scroll container) */
|
|
21
|
+
totalHeight: number;
|
|
22
|
+
/** Y offset for positioning visible items */
|
|
23
|
+
offsetY: number;
|
|
24
|
+
/** Number of visible items */
|
|
25
|
+
visibleCount: number;
|
|
26
|
+
/** Whether virtualization is active */
|
|
27
|
+
isVirtualized: boolean;
|
|
28
|
+
/** Scroll event handler - attach to container's onScroll */
|
|
29
|
+
handleScroll: (e: React.UIEvent<HTMLElement>) => void;
|
|
30
|
+
/** Current scroll position */
|
|
31
|
+
scrollTop: number;
|
|
32
|
+
/** Container style for the scroll area */
|
|
33
|
+
containerStyle: React.CSSProperties;
|
|
34
|
+
/** Inner wrapper style (total height) */
|
|
35
|
+
innerStyle: React.CSSProperties;
|
|
36
|
+
/** Content style (transform offset) */
|
|
37
|
+
contentStyle: React.CSSProperties;
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* Hook for virtualizing large lists.
|
|
41
|
+
* Only renders items that are visible in the viewport plus overscan buffer.
|
|
42
|
+
*/
|
|
43
|
+
export default function useVirtualization(options: UseVirtualizationOptions): UseVirtualizationResult;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cronocode/react-box",
|
|
3
|
-
"version": "3.1.
|
|
3
|
+
"version": "3.1.7",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./box.cjs",
|
|
6
6
|
"module": "./box.mjs",
|
|
@@ -28,13 +28,14 @@
|
|
|
28
28
|
"scripts": {
|
|
29
29
|
"dev": "vite ./pages --config ./pages.vite.config.ts --mode dev",
|
|
30
30
|
"build:pages": "vite build ./pages --config ./pages.vite.config.ts --outDir ../dist --mode production",
|
|
31
|
+
"postbuild:pages": "cp ./dist/index.html ./dist/404.html",
|
|
31
32
|
"preview": "vite preview",
|
|
32
33
|
"build": "vite build",
|
|
33
|
-
"postbuild": "cp package.json dist
|
|
34
|
+
"postbuild": "cp package.json dist && cp LICENSE dist && cp README.md dist && cp src/BOX_AI_CONTEXT.md dist",
|
|
34
35
|
"build:dev": "vite build --mode dev",
|
|
35
36
|
"compile": "tsc --noEmit --skipLibCheck",
|
|
36
|
-
"test": "vitest",
|
|
37
|
-
"test:
|
|
37
|
+
"test": "vitest run",
|
|
38
|
+
"test:watch": "vitest",
|
|
38
39
|
"lint": "eslint ."
|
|
39
40
|
},
|
|
40
41
|
"repository": {
|
|
@@ -61,7 +62,7 @@
|
|
|
61
62
|
"@testing-library/dom": "^10.4.0",
|
|
62
63
|
"@testing-library/jest-dom": "^6.6.3",
|
|
63
64
|
"@testing-library/react": "^16.0.1",
|
|
64
|
-
"@types/node": "^
|
|
65
|
+
"@types/node": "^25.0.3",
|
|
65
66
|
"@types/postcss-mixins": "^9.0.5",
|
|
66
67
|
"@types/prismjs": "^1.26.4",
|
|
67
68
|
"@types/react": "^18.3.7",
|
|
@@ -74,8 +75,10 @@
|
|
|
74
75
|
"eslint-plugin-prettier": "^5.5.1",
|
|
75
76
|
"eslint-plugin-react-hooks": "^5.2.0",
|
|
76
77
|
"eslint-plugin-react-refresh": "^0.4.20",
|
|
78
|
+
"framer-motion": "^12.26.2",
|
|
77
79
|
"globals": "^16.3.0",
|
|
78
80
|
"happy-dom": "^15.7.4",
|
|
81
|
+
"lucide-react": "^0.562.0",
|
|
79
82
|
"prettier": "^3.3.3",
|
|
80
83
|
"prismjs": "^1.29.0",
|
|
81
84
|
"react": "^18.3.1",
|
package/ssg.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react-dom/server"),c=require("./core.cjs"),n={innerHTML:"",get textContent(){return this.innerHTML},set textContent(e){this.innerHTML=e}},d={head:{insertBefore(e,r){return e}},getElementById(){return n},createElement(){return{setAttribute(e,r){}}}};global.document=d;function y(e,r=!0){n.innerHTML="";let t=a.renderToStaticMarkup(e);if(c.StylesContext.flush(),r){const s="<head>",o=t.indexOf(s);if(o>-1){const u=`<style id="crono-styles">${n.innerHTML}</style>`,i=o+s.length;t=t.substring(0,i)+u+t.substring(i)}}const l=n.innerHTML;return c.StylesContext.clear(),{html:t,styles:l}}exports.renderToStaticMarkup=y;
|
package/ssg.mjs
CHANGED
|
@@ -1,38 +1,46 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
const
|
|
4
|
-
innerHTML: ""
|
|
5
|
-
|
|
1
|
+
import u from "react-dom/server";
|
|
2
|
+
import { i as l } from "./core.mjs";
|
|
3
|
+
const n = {
|
|
4
|
+
innerHTML: "",
|
|
5
|
+
get textContent() {
|
|
6
|
+
return this.innerHTML;
|
|
7
|
+
},
|
|
8
|
+
set textContent(e) {
|
|
9
|
+
this.innerHTML = e;
|
|
10
|
+
}
|
|
11
|
+
}, d = {
|
|
6
12
|
head: {
|
|
7
|
-
insertBefore(
|
|
8
|
-
return
|
|
13
|
+
insertBefore(e, r) {
|
|
14
|
+
return e;
|
|
9
15
|
}
|
|
10
16
|
},
|
|
11
17
|
getElementById() {
|
|
12
|
-
return
|
|
18
|
+
return n;
|
|
13
19
|
},
|
|
14
20
|
createElement() {
|
|
15
21
|
return {
|
|
16
|
-
setAttribute(
|
|
22
|
+
setAttribute(e, r) {
|
|
17
23
|
}
|
|
18
24
|
};
|
|
19
25
|
}
|
|
20
26
|
};
|
|
21
|
-
global.document =
|
|
22
|
-
function
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
27
|
+
global.document = d;
|
|
28
|
+
function M(e, r = !0) {
|
|
29
|
+
n.innerHTML = "";
|
|
30
|
+
let t = u.renderToStaticMarkup(e);
|
|
31
|
+
if (l.flush(), r) {
|
|
32
|
+
const s = "<head>", o = t.indexOf(s);
|
|
26
33
|
if (o > -1) {
|
|
27
|
-
const
|
|
28
|
-
|
|
34
|
+
const a = `<style id="crono-styles">${n.innerHTML}</style>`, i = o + s.length;
|
|
35
|
+
t = t.substring(0, i) + a + t.substring(i);
|
|
29
36
|
}
|
|
30
37
|
}
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
38
|
+
const c = n.innerHTML;
|
|
39
|
+
return l.clear(), {
|
|
40
|
+
html: t,
|
|
41
|
+
styles: c
|
|
34
42
|
};
|
|
35
43
|
}
|
|
36
44
|
export {
|
|
37
|
-
|
|
45
|
+
M as renderToStaticMarkup
|
|
38
46
|
};
|
package/types.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { breakpoints, cssStyles, pseudo1, pseudo2, pseudoClasses, pseudoGroupClasses } from './core/boxStyles';
|
|
1
|
+
import { breakpoints, cssStyles, pseudo1, pseudo2, pseudoClasses, pseudoGroupClasses, themeGroupClass } from './core/boxStyles';
|
|
2
2
|
import { ClassNameType } from './core/classNames';
|
|
3
3
|
import { BoxStyle, BoxStylesType, ExtractKeys } from './core/coreTypes';
|
|
4
4
|
import { default as boxComponents } from './core/extends/boxComponents';
|
|
@@ -26,7 +26,8 @@ type BoxPseudoClassesStyles2TopLevel = ExtractKeys<typeof pseudo2, boolean | [bo
|
|
|
26
26
|
export interface BoxStylesWithPseudoClasses extends BoxStyles, BoxPseudoClassesStyles1, BoxPseudoClassesStyles2Nested {
|
|
27
27
|
}
|
|
28
28
|
type BoxPseudoGroupClassesStyles = ExtractKeys<typeof pseudoGroupClasses, Record<string, BoxStylesWithPseudoClasses>>;
|
|
29
|
-
type
|
|
29
|
+
type BoxThemeGroupClassStyles = ExtractKeys<typeof themeGroupClass, Record<string, BoxStylesWithPseudoClasses & BoxPseudoGroupClassesStyles>>;
|
|
30
|
+
type BoxBreakpointsStyles = ExtractKeys<typeof breakpoints, BoxStylesWithPseudoClasses & BoxPseudoGroupClassesStyles & BoxThemeGroupClassStyles>;
|
|
30
31
|
type ExtractVariants<T> = T extends {
|
|
31
32
|
variants?: infer Variants;
|
|
32
33
|
} ? keyof Variants extends never ? never : Extract<keyof Variants, string> : never;
|
|
@@ -57,5 +58,5 @@ export interface ComponentProps<TKey extends keyof ComponentsAndVariants = never
|
|
|
57
58
|
component?: TKey;
|
|
58
59
|
variant?: ClassNameType<ComponentsAndVariants[TKey]>;
|
|
59
60
|
}
|
|
60
|
-
export type BoxStyleProps<TKey extends keyof ComponentsAndVariants = never> = Simplify<BoxStyles & BoxPseudoClassesStyles1 & BoxPseudoClassesStyles2TopLevel & BoxPseudoGroupClassesStyles & BoxBreakpointsStyles & ComponentProps<TKey>>;
|
|
61
|
-
export type BoxComponentStyles = Simplify<BoxStylesWithPseudoClasses & BoxBreakpointsStyles & BoxPseudoGroupClassesStyles>;
|
|
61
|
+
export type BoxStyleProps<TKey extends keyof ComponentsAndVariants = never> = Simplify<BoxStyles & BoxPseudoClassesStyles1 & BoxPseudoClassesStyles2TopLevel & BoxPseudoGroupClassesStyles & BoxThemeGroupClassStyles & BoxBreakpointsStyles & ComponentProps<TKey>>;
|
|
62
|
+
export type BoxComponentStyles = Simplify<BoxStylesWithPseudoClasses & BoxBreakpointsStyles & BoxPseudoGroupClassesStyles & BoxThemeGroupClassStyles>;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Fuzzy search implementation for text matching.
|
|
3
|
+
* Matches characters in order but not necessarily consecutively.
|
|
4
|
+
*/
|
|
5
|
+
export interface FuzzyMatch {
|
|
6
|
+
score: number;
|
|
7
|
+
matches: [number, number][];
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* Performs fuzzy matching of a pattern against a target string.
|
|
11
|
+
* Returns a match object with score and matched ranges, or null if no match.
|
|
12
|
+
*/
|
|
13
|
+
export declare function fuzzyMatch(pattern: string, target: string): FuzzyMatch | null;
|
|
14
|
+
/**
|
|
15
|
+
* Simple fuzzy search that returns true if the pattern matches the target.
|
|
16
|
+
*/
|
|
17
|
+
export declare function fuzzySearch(pattern: string, target: string): boolean;
|
|
18
|
+
/**
|
|
19
|
+
* Fuzzy search across multiple fields of an object.
|
|
20
|
+
* Returns true if the pattern matches any of the specified fields.
|
|
21
|
+
*/
|
|
22
|
+
export declare function fuzzySearchObject<T extends object>(pattern: string, obj: T, fields?: (keyof T)[]): boolean;
|
|
23
|
+
/**
|
|
24
|
+
* Get the best fuzzy match score across multiple fields.
|
|
25
|
+
* Returns the highest score found, or 0 if no match.
|
|
26
|
+
*/
|
|
27
|
+
export declare function fuzzySearchObjectScore<T extends object>(pattern: string, obj: T, fields?: (keyof T)[]): number;
|