@trackunit/react-table-base-components 0.0.8 → 0.0.10

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.
Files changed (6) hide show
  1. package/index.cjs.js +13 -6
  2. package/index.esm.js +13 -6
  3. package/package.json +4 -4
  4. package/src/components/CheckboxCell/CheckboxCell.d.ts +0 -1
  5. package/src/components/{ResizeHandel.d.ts → ResizeHandle.d.ts} +2 -2
  6. package/src/index.d.ts +1 -1
package/index.cjs.js CHANGED
@@ -71,20 +71,27 @@ const LinkCell = (_a) => {
71
71
  * @param {string} [props.className] - Additional CSS classes to apply to the handle.
72
72
  * @returns {ReactElement} A React element representing the resizable handle.
73
73
  */
74
- const ResizeHandel = (_a) => {
75
- var { isResizing = false, dataTestId, className } = _a, rest = __rest(_a, ["isResizing", "dataTestId", "className"]);
76
- return (jsxRuntime.jsx("div", Object.assign({ role: "separator", "data-testid": dataTestId, className: cvaResizeHandel({ isResizing, className }) }, rest)));
74
+ const ResizeHandle = (_a) => {
75
+ var { isResizing = false, dataTestId, onMouseDown: onMouseDownHandler, className } = _a, rest = __rest(_a, ["isResizing", "dataTestId", "onMouseDown", "className"]);
76
+ const onMouseDown = (event) => {
77
+ const resizeCursorClass = "cursor-col-resize";
78
+ document.addEventListener("mouseup", () => {
79
+ document.body.classList.remove(resizeCursorClass);
80
+ });
81
+ document.body.classList.add(resizeCursorClass);
82
+ onMouseDownHandler === null || onMouseDownHandler === void 0 ? void 0 : onMouseDownHandler(event);
83
+ };
84
+ return (jsxRuntime.jsx("div", Object.assign({ role: "separator", "data-testid": dataTestId, className: cvaResizeHandel({ isResizing, className }), onMouseDown: event => onMouseDown(event) }, rest)));
77
85
  };
78
86
  const cvaResizeHandel = cssClassVarianceUtilities.cvaMerge([
79
87
  "absolute",
80
- "!cursor-col-resize",
88
+ "cursor-col-resize",
81
89
  "right-0",
82
90
  "top-0",
83
91
  "h-full",
84
92
  "w-1",
85
93
  "select-none",
86
94
  "hover:bg-primary-400",
87
- "cursor-pointer",
88
95
  ], {
89
96
  variants: {
90
97
  isResizing: {
@@ -291,7 +298,7 @@ const cvaTr = cssClassVarianceUtilities.cvaMerge(["border-b", "border-neutral-30
291
298
 
292
299
  exports.CheckboxCell = CheckboxCell;
293
300
  exports.LinkCell = LinkCell;
294
- exports.ResizeHandel = ResizeHandel;
301
+ exports.ResizeHandle = ResizeHandle;
295
302
  exports.SortIndicator = SortIndicator;
296
303
  exports.TableRoot = TableRoot;
297
304
  exports.TagsCell = TagsCell;
package/index.esm.js CHANGED
@@ -67,20 +67,27 @@ const LinkCell = (_a) => {
67
67
  * @param {string} [props.className] - Additional CSS classes to apply to the handle.
68
68
  * @returns {ReactElement} A React element representing the resizable handle.
69
69
  */
70
- const ResizeHandel = (_a) => {
71
- var { isResizing = false, dataTestId, className } = _a, rest = __rest(_a, ["isResizing", "dataTestId", "className"]);
72
- return (jsx("div", Object.assign({ role: "separator", "data-testid": dataTestId, className: cvaResizeHandel({ isResizing, className }) }, rest)));
70
+ const ResizeHandle = (_a) => {
71
+ var { isResizing = false, dataTestId, onMouseDown: onMouseDownHandler, className } = _a, rest = __rest(_a, ["isResizing", "dataTestId", "onMouseDown", "className"]);
72
+ const onMouseDown = (event) => {
73
+ const resizeCursorClass = "cursor-col-resize";
74
+ document.addEventListener("mouseup", () => {
75
+ document.body.classList.remove(resizeCursorClass);
76
+ });
77
+ document.body.classList.add(resizeCursorClass);
78
+ onMouseDownHandler === null || onMouseDownHandler === void 0 ? void 0 : onMouseDownHandler(event);
79
+ };
80
+ return (jsx("div", Object.assign({ role: "separator", "data-testid": dataTestId, className: cvaResizeHandel({ isResizing, className }), onMouseDown: event => onMouseDown(event) }, rest)));
73
81
  };
74
82
  const cvaResizeHandel = cvaMerge([
75
83
  "absolute",
76
- "!cursor-col-resize",
84
+ "cursor-col-resize",
77
85
  "right-0",
78
86
  "top-0",
79
87
  "h-full",
80
88
  "w-1",
81
89
  "select-none",
82
90
  "hover:bg-primary-400",
83
- "cursor-pointer",
84
91
  ], {
85
92
  variants: {
86
93
  isResizing: {
@@ -285,4 +292,4 @@ const cvaTr = cvaMerge(["border-b", "border-neutral-300", "w-full", "h-max"], {
285
292
  },
286
293
  });
287
294
 
288
- export { CheckboxCell, LinkCell, ResizeHandel, SortIndicator, TableRoot, TagsCell, Tbody, Td, Tfoot, Th, Thead, Tr };
295
+ export { CheckboxCell, LinkCell, ResizeHandle, SortIndicator, TableRoot, TagsCell, Tbody, Td, Tfoot, Th, Thead, Tr };
package/package.json CHANGED
@@ -1,15 +1,15 @@
1
1
  {
2
2
  "name": "@trackunit/react-table-base-components",
3
- "version": "0.0.8",
3
+ "version": "0.0.10",
4
4
  "repository": "https://github.com/Trackunit/manager",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "engines": {
7
7
  "node": ">=18.x"
8
8
  },
9
9
  "dependencies": {
10
- "@trackunit/css-class-variance-utilities": "0.0.13",
11
- "@trackunit/react-components": "0.1.155",
12
- "@trackunit/react-form-components": "0.0.137",
10
+ "@trackunit/css-class-variance-utilities": "0.0.14",
11
+ "@trackunit/react-components": "0.1.156",
12
+ "@trackunit/react-form-components": "0.0.139",
13
13
  "react": "18.2.0"
14
14
  },
15
15
  "module": "./index.esm.js",
package/src/components/CheckboxCell/CheckboxCell.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { CommonProps } from "@trackunit/react-components";
3
2
  export interface CheckboxCellProps extends CommonProps {
4
3
  checked: boolean;
package/src/components/{ResizeHandel.d.ts → ResizeHandle.d.ts} RENAMED
@@ -1,5 +1,5 @@
1
1
  import { CommonProps } from "@trackunit/react-components";
2
- import { ReactElement } from "react";
2
+ import React, { ReactElement } from "react";
3
3
  export interface ResizeHandelProps extends CommonProps, React.HTMLAttributes<HTMLDivElement> {
4
4
  isResizing?: boolean;
5
5
  }
@@ -12,4 +12,4 @@ export interface ResizeHandelProps extends CommonProps, React.HTMLAttributes<HTM
12
12
  * @param {string} [props.className] - Additional CSS classes to apply to the handle.
13
13
  * @returns {ReactElement} A React element representing the resizable handle.
14
14
  */
15
- export declare const ResizeHandel: ({ isResizing, dataTestId, className, ...rest }: ResizeHandelProps) => ReactElement;
15
+ export declare const ResizeHandle: ({ isResizing, dataTestId, onMouseDown: onMouseDownHandler, className, ...rest }: ResizeHandelProps) => ReactElement;
package/src/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  export * from "./components/CheckboxCell/CheckboxCell";
2
2
  export * from "./components/LinkCell/LinkCell";
3
- export * from "./components/ResizeHandel";
3
+ export * from "./components/ResizeHandle";
4
4
  export * from "./components/SortIndicator";
5
5
  export * from "./components/TableRoot";
6
6
  export * from "./components/TagsCell/TagsCell";