@homebound/beam 2.134.3 → 2.135.2
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/dist/components/ButtonGroup.d.ts +1 -2
- package/dist/components/ButtonMenu.d.ts +1 -2
- package/dist/components/Modal/Modal.d.ts +1 -2
- package/dist/components/Modal/Modal.js +2 -2
- package/dist/components/Modal/useModal.d.ts +2 -2
- package/dist/components/Table/GridTable.d.ts +2 -0
- package/dist/components/Table/GridTable.js +2 -2
- package/dist/components/Table/GridTableApi.d.ts +1 -1
- package/dist/components/Table/GridTableApi.js +2 -4
- package/dist/components/Table/RowState.d.ts +2 -1
- package/dist/components/Table/RowState.js +57 -4
- package/dist/components/internal/Menu.d.ts +1 -2
- package/dist/components/internal/MenuItem.d.ts +1 -2
- package/dist/components/internal/MenuSection.d.ts +1 -2
- package/dist/forms/BoundTextField.d.ts +1 -1
- package/dist/forms/BoundTextField.js +8 -2
- package/dist/hooks/useHover.d.ts +2 -3
- package/dist/index.d.ts +1 -1
- package/dist/inputs/DateField.d.ts +1 -2
- package/dist/inputs/NumberField.d.ts +1 -2
- package/dist/inputs/TextAreaField.d.ts +1 -2
- package/dist/inputs/TextField.d.ts +2 -3
- package/dist/inputs/internal/SelectFieldInput.d.ts +1 -2
- package/dist/interfaces.d.ts +3 -4
- package/dist/types.d.ts +0 -1
- package/dist/utils/getInteractiveElement.d.ts +1 -1
- package/dist/utils/getInteractiveElement.js +7 -2
- package/package.json +1 -1
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { IconProps } from "./Icon";
|
|
2
|
-
import { Callback } from "../types";
|
|
3
2
|
export interface ButtonGroupProps {
|
|
4
3
|
buttons: ButtonGroupButton[];
|
|
5
4
|
/** Disables all buttons in ButtonGroup */
|
|
@@ -9,7 +8,7 @@ export interface ButtonGroupProps {
|
|
|
9
8
|
export declare type ButtonGroupButton = {
|
|
10
9
|
icon?: IconProps["icon"];
|
|
11
10
|
text?: string;
|
|
12
|
-
onClick?:
|
|
11
|
+
onClick?: VoidFunction;
|
|
13
12
|
/** Disables the button. Note we don't support the `disabled: ReactNode`/tooltip for now. */
|
|
14
13
|
disabled?: boolean;
|
|
15
14
|
/** Indicates the active/selected button, as in a tab or toggle. */
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { IconProps } from "./Icon";
|
|
2
2
|
import { OverlayTriggerProps } from "./internal/OverlayTrigger";
|
|
3
|
-
import { Callback } from "../types";
|
|
4
3
|
interface ButtonMenuProps extends Pick<OverlayTriggerProps, "trigger" | "placement" | "disabled" | "tooltip"> {
|
|
5
4
|
items: MenuItem[];
|
|
6
5
|
persistentItems?: MenuItem[];
|
|
@@ -9,7 +8,7 @@ interface ButtonMenuProps extends Pick<OverlayTriggerProps, "trigger" | "placeme
|
|
|
9
8
|
export declare function ButtonMenu(props: ButtonMenuProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
10
9
|
declare type MenuItemBase = {
|
|
11
10
|
label: string;
|
|
12
|
-
onClick: string |
|
|
11
|
+
onClick: string | VoidFunction;
|
|
13
12
|
disabled?: boolean;
|
|
14
13
|
};
|
|
15
14
|
export declare type IconMenuItemType = MenuItemBase & {
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { MutableRefObject, ReactNode } from "react";
|
|
2
2
|
import { Only, Xss } from "../../Css";
|
|
3
|
-
import { Callback } from "../../types";
|
|
4
3
|
export declare type ModalSize = "sm" | "md" | "lg" | "xl";
|
|
5
4
|
export interface ModalProps {
|
|
6
5
|
/**
|
|
@@ -18,7 +17,7 @@ export interface ModalProps {
|
|
|
18
17
|
/** Force scrolling i.e. to avoid content jumping left/right as scroll bar goes away/comes back. */
|
|
19
18
|
forceScrolling?: boolean;
|
|
20
19
|
/** Adds a callback that is called _after_ close has definitely happened. */
|
|
21
|
-
onClose?:
|
|
20
|
+
onClose?: VoidFunction;
|
|
22
21
|
/** Imperative API for interacting with the Modal */
|
|
23
22
|
api?: MutableRefObject<ModalApi | undefined>;
|
|
24
23
|
/** Adds a border for the header. */
|
|
@@ -31,8 +31,8 @@ function Modal(props) {
|
|
|
31
31
|
onClose: closeModal,
|
|
32
32
|
isDismissable: true,
|
|
33
33
|
shouldCloseOnInteractOutside: (el) => {
|
|
34
|
-
// Do not close the Modal if the user is interacting with the Tribute mentions dropdown (via RichTextField).
|
|
35
|
-
return !el.closest(".tribute-container");
|
|
34
|
+
// Do not close the Modal if the user is interacting with the Tribute mentions dropdown (via RichTextField) or with another 3rd party dialog (such as a lightbox) on top of it.
|
|
35
|
+
return !(el.closest(".tribute-container") || el.closest("[role='dialog']"));
|
|
36
36
|
},
|
|
37
37
|
}, ref);
|
|
38
38
|
const { modalProps } = (0, react_aria_1.useModal)();
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { CheckFn } from "../../types";
|
|
2
2
|
import { ModalProps } from "./Modal";
|
|
3
3
|
export interface UseModalHook {
|
|
4
4
|
openModal: (props: ModalProps) => void;
|
|
5
|
-
closeModal:
|
|
5
|
+
closeModal: VoidFunction;
|
|
6
6
|
addCanClose: (canClose: CheckFn) => void;
|
|
7
7
|
setSize: (size: ModalProps["size"]) => void;
|
|
8
8
|
}
|
|
@@ -331,6 +331,8 @@ export declare type GridDataRow<R extends Kinded> = {
|
|
|
331
331
|
/** Whether to pin this sort to the first/last of its parent's children. */
|
|
332
332
|
pin?: "first" | "last";
|
|
333
333
|
data: unknown;
|
|
334
|
+
/** Whether to have the row collapsed (children not visible) on initial load. This will be ignore in subsequent re-renders of the table */
|
|
335
|
+
initCollapsed?: boolean;
|
|
334
336
|
} & IfAny<R, {}, DiscriminateUnion<R, "kind", R["kind"]>>;
|
|
335
337
|
declare type IfAny<T, Y, N> = 0 extends 1 & T ? Y : N;
|
|
336
338
|
/** Return the content for a given column def applied to a given row. */
|
|
@@ -97,13 +97,13 @@ function GridTable(props) {
|
|
|
97
97
|
const api = (0, react_1.useMemo)(() => {
|
|
98
98
|
var _a;
|
|
99
99
|
const api = (_a = props.api) !== null && _a !== void 0 ? _a : new GridTableApi_1.GridTableApiImpl();
|
|
100
|
-
api.init(persistCollapse, virtuosoRef);
|
|
100
|
+
api.init(persistCollapse, virtuosoRef, rows);
|
|
101
101
|
api.setActiveRowId(activeRowId);
|
|
102
102
|
return api;
|
|
103
103
|
}, [props.api]);
|
|
104
104
|
const style = resolveStyles(maybeStyle);
|
|
105
105
|
const { rowState } = api;
|
|
106
|
-
rowState.rows
|
|
106
|
+
rowState.setRows(rows);
|
|
107
107
|
(0, react_1.useEffect)(() => {
|
|
108
108
|
rowState.activeRowId = activeRowId;
|
|
109
109
|
}, [rowState, activeRowId]);
|
|
@@ -37,7 +37,7 @@ export declare class GridTableApiImpl<R extends Kinded> implements GridTableApi<
|
|
|
37
37
|
readonly rowState: RowState;
|
|
38
38
|
virtuosoRef: MutableRefObject<VirtuosoHandle | null>;
|
|
39
39
|
/** Called once by the GridTable when it takes ownership of this api instance. */
|
|
40
|
-
init(persistCollapse: string | undefined, virtuosoRef: MutableRefObject<VirtuosoHandle | null>): void;
|
|
40
|
+
init(persistCollapse: string | undefined, virtuosoRef: MutableRefObject<VirtuosoHandle | null>, rows: GridDataRow<R>[]): void;
|
|
41
41
|
scrollToIndex(index: number): void;
|
|
42
42
|
getSelectedRowIds(kind?: string): string[];
|
|
43
43
|
getSelectedRows(kind?: string): any;
|
|
@@ -31,10 +31,8 @@ class GridTableApiImpl {
|
|
|
31
31
|
this.virtuosoRef = { current: null };
|
|
32
32
|
}
|
|
33
33
|
/** Called once by the GridTable when it takes ownership of this api instance. */
|
|
34
|
-
init(persistCollapse, virtuosoRef) {
|
|
35
|
-
|
|
36
|
-
this.rowState.loadPersistedCollapse(persistCollapse);
|
|
37
|
-
}
|
|
34
|
+
init(persistCollapse, virtuosoRef, rows) {
|
|
35
|
+
this.rowState.loadCollapse(persistCollapse, rows);
|
|
38
36
|
this.virtuosoRef = virtuosoRef;
|
|
39
37
|
}
|
|
40
38
|
scrollToIndex(index) {
|
|
@@ -27,7 +27,8 @@ export declare class RowState {
|
|
|
27
27
|
* Creates the `RowState` for a given `GridTable`.
|
|
28
28
|
*/
|
|
29
29
|
constructor();
|
|
30
|
-
|
|
30
|
+
loadCollapse(persistCollapse: string | undefined, rows: GridDataRow<any>[]): void;
|
|
31
|
+
setRows(rows: GridDataRow<any>[]): void;
|
|
31
32
|
setVisibleRows(rowIds: string[]): void;
|
|
32
33
|
get selectedIds(): string[];
|
|
33
34
|
getSelected(id: string): SelectedState;
|
|
@@ -53,9 +53,47 @@ class RowState {
|
|
|
53
53
|
this.selectedRows.merge(map);
|
|
54
54
|
}, { equals: mobx_1.comparer.shallow });
|
|
55
55
|
}
|
|
56
|
-
|
|
56
|
+
loadCollapse(persistCollapse, rows) {
|
|
57
57
|
this.persistCollapse = persistCollapse;
|
|
58
|
-
|
|
58
|
+
const sessionStorageIds = persistCollapse ? sessionStorage.getItem(persistCollapse) : null;
|
|
59
|
+
// Initialize with our collapsed rows based on what is in sessionStorage. Otherwise check if any rows have been defined as collapsed
|
|
60
|
+
const collapsedGridRowIds = sessionStorageIds ? JSON.parse(sessionStorageIds) : getCollapsedIdsFromRows(rows);
|
|
61
|
+
// If we have some initial rows to collapse, then set the internal prop
|
|
62
|
+
if (collapsedGridRowIds.length > 0) {
|
|
63
|
+
this.collapsedRows.replace(collapsedGridRowIds);
|
|
64
|
+
// If `persistCollapse` is set, but sessionStorageIds was not defined, then add them now.
|
|
65
|
+
if (this.persistCollapse && !sessionStorageIds) {
|
|
66
|
+
sessionStorage.setItem(this.persistCollapse, JSON.stringify(collapsedGridRowIds));
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
// Updates the list of rows and regenerates the collapsedRows property if needed.
|
|
71
|
+
setRows(rows) {
|
|
72
|
+
// If the set of rows are different, and this is the first time adding "data" rows (non "totals" or "header" rows), then collapsedRows may need to be updated.
|
|
73
|
+
if (rows !== this.rows && this.rows.some((r) => r.kind !== "totals" && r.kind !== "header")) {
|
|
74
|
+
const currentCollapsedIds = this.collapsedIds;
|
|
75
|
+
// Create a list of the (maybe) new rows that should be initially collapsed
|
|
76
|
+
const maybeNewCollapsedRows = flattenRows(rows).filter((r) => r.initCollapsed);
|
|
77
|
+
// If the list of collapsed rows are different, then determine which are net-new rows and should be added to the newCollapsedIds array
|
|
78
|
+
if (currentCollapsedIds.length !== maybeNewCollapsedRows.length ||
|
|
79
|
+
!currentCollapsedIds.every((id) => maybeNewCollapsedRows.some((r) => r.id === id))) {
|
|
80
|
+
// Flatten out the existing rows to make checking for new rows easier
|
|
81
|
+
const flattenedExistingIds = flattenRows(this.rows).map((r) => r.id);
|
|
82
|
+
const newCollapsedIds = maybeNewCollapsedRows
|
|
83
|
+
.filter((maybeNewRow) => !flattenedExistingIds.includes(maybeNewRow.id))
|
|
84
|
+
.map((row) => row.id);
|
|
85
|
+
// If there are new rows that should be collapsed then update the collapsedRows arrays
|
|
86
|
+
if (newCollapsedIds.length > 0) {
|
|
87
|
+
this.collapsedRows.replace(currentCollapsedIds.concat(newCollapsedIds));
|
|
88
|
+
// Also update our persistCollapse if set
|
|
89
|
+
if (this.persistCollapse) {
|
|
90
|
+
sessionStorage.setItem(this.persistCollapse, JSON.stringify(currentCollapsedIds.concat(newCollapsedIds)));
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
// Finally replace our existing list of rows
|
|
96
|
+
this.rows = rows;
|
|
59
97
|
}
|
|
60
98
|
setVisibleRows(rowIds) {
|
|
61
99
|
// ObservableSet doesn't seem to do a `diff` inside `replace` before firing
|
|
@@ -177,7 +215,7 @@ class RowState {
|
|
|
177
215
|
}
|
|
178
216
|
this.collapsedRows.replace(collapsedIds);
|
|
179
217
|
if (this.persistCollapse) {
|
|
180
|
-
|
|
218
|
+
sessionStorage.setItem(this.persistCollapse, JSON.stringify(collapsedIds));
|
|
181
219
|
}
|
|
182
220
|
}
|
|
183
221
|
getVisibleChildrenStates(children, map) {
|
|
@@ -208,7 +246,7 @@ exports.RowStateContext = react_1.default.createContext({
|
|
|
208
246
|
});
|
|
209
247
|
// Get the rows that are already in the toggled state, so we can keep them toggled
|
|
210
248
|
function readLocalCollapseState(persistCollapse) {
|
|
211
|
-
const collapsedGridRowIds =
|
|
249
|
+
const collapsedGridRowIds = sessionStorage.getItem(persistCollapse);
|
|
212
250
|
return collapsedGridRowIds ? JSON.parse(collapsedGridRowIds) : [];
|
|
213
251
|
}
|
|
214
252
|
/** Finds a row by id, and returns it + any parents. */
|
|
@@ -232,3 +270,18 @@ function deriveParentSelected(children) {
|
|
|
232
270
|
const allUnchecked = children.every((child) => child === "unchecked");
|
|
233
271
|
return children.length === 0 ? "unchecked" : allChecked ? "checked" : allUnchecked ? "unchecked" : "partial";
|
|
234
272
|
}
|
|
273
|
+
function getCollapsedIdsFromRows(rows) {
|
|
274
|
+
return rows.reduce((acc, r) => {
|
|
275
|
+
if (r.initCollapsed) {
|
|
276
|
+
acc.push(r.id);
|
|
277
|
+
}
|
|
278
|
+
if (r.children) {
|
|
279
|
+
acc.push(...getCollapsedIdsFromRows(r.children));
|
|
280
|
+
}
|
|
281
|
+
return acc;
|
|
282
|
+
}, []);
|
|
283
|
+
}
|
|
284
|
+
function flattenRows(rows) {
|
|
285
|
+
const childRows = rows.flatMap((r) => (r.children ? flattenRows(r.children) : []));
|
|
286
|
+
return [...rows, ...childRows];
|
|
287
|
+
}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import { HTMLAttributes, PropsWithChildren } from "react";
|
|
2
2
|
import { MenuItem } from "..";
|
|
3
|
-
import { Callback } from "../../types";
|
|
4
3
|
interface MenuProps<T> {
|
|
5
4
|
ariaMenuProps: HTMLAttributes<HTMLElement>;
|
|
6
|
-
onClose:
|
|
5
|
+
onClose: VoidFunction;
|
|
7
6
|
items: MenuItem[];
|
|
8
7
|
persistentItems?: MenuItem[];
|
|
9
8
|
}
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import { Node } from "@react-types/shared";
|
|
2
2
|
import { TreeState } from "react-stately";
|
|
3
3
|
import { MenuItem } from "../ButtonMenu";
|
|
4
|
-
import { Callback } from "../../types";
|
|
5
4
|
interface MenuItemProps {
|
|
6
5
|
item: Node<MenuItem>;
|
|
7
6
|
state: TreeState<MenuItem>;
|
|
8
|
-
onClose:
|
|
7
|
+
onClose: VoidFunction;
|
|
9
8
|
}
|
|
10
9
|
export declare function MenuItemImpl(props: MenuItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
11
10
|
export {};
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import { Node } from "@react-types/shared";
|
|
2
2
|
import { TreeState } from "react-stately";
|
|
3
3
|
import { MenuItem } from "../ButtonMenu";
|
|
4
|
-
import { Callback } from "../../types";
|
|
5
4
|
interface MenuSectionProps {
|
|
6
5
|
section: Node<MenuItem>;
|
|
7
6
|
state: TreeState<MenuItem>;
|
|
8
|
-
onClose:
|
|
7
|
+
onClose: VoidFunction;
|
|
9
8
|
}
|
|
10
9
|
export declare function MenuSectionImpl(props: MenuSectionProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
11
10
|
export {};
|
|
@@ -2,7 +2,7 @@ import { FieldState } from "@homebound/form-state";
|
|
|
2
2
|
import { Only } from "../Css";
|
|
3
3
|
import { TextFieldProps } from "../inputs";
|
|
4
4
|
import { TextFieldXss } from "../interfaces";
|
|
5
|
-
export declare type BoundTextFieldProps<X> = Omit<TextFieldProps<X>, "value" | "onChange" | "
|
|
5
|
+
export declare type BoundTextFieldProps<X> = Omit<TextFieldProps<X>, "value" | "onChange" | "label"> & {
|
|
6
6
|
label?: string;
|
|
7
7
|
field: FieldState<any, string | null | undefined>;
|
|
8
8
|
onChange?: (value: string | undefined) => void;
|
|
@@ -8,9 +8,15 @@ const utils_1 = require("../utils");
|
|
|
8
8
|
const defaultLabel_1 = require("../utils/defaultLabel");
|
|
9
9
|
/** Wraps `TextField` and binds it to a form field. */
|
|
10
10
|
function BoundTextField(props) {
|
|
11
|
-
const { field, readOnly, onChange = (value) => field.set(value), label = (0, defaultLabel_1.defaultLabel)(field.key), onEnter, ...others } = props;
|
|
11
|
+
const { field, readOnly, onBlur, onFocus, onChange = (value) => field.set(value), label = (0, defaultLabel_1.defaultLabel)(field.key), onEnter, ...others } = props;
|
|
12
12
|
const testId = (0, utils_1.useTestIds)(props, field.key);
|
|
13
|
-
return ((0, jsx_runtime_1.jsx)(mobx_react_1.Observer, { children: () => ((0, jsx_runtime_1.jsx)(inputs_1.TextField, Object.assign({ label: label, value: field.value || undefined, onChange: onChange, readOnly: readOnly !== null && readOnly !== void 0 ? readOnly : field.readOnly, errorMsg: field.touched ? field.errors.join(" ") : undefined, required: field.required, onBlur: () =>
|
|
13
|
+
return ((0, jsx_runtime_1.jsx)(mobx_react_1.Observer, { children: () => ((0, jsx_runtime_1.jsx)(inputs_1.TextField, Object.assign({ label: label, value: field.value || undefined, onChange: onChange, readOnly: readOnly !== null && readOnly !== void 0 ? readOnly : field.readOnly, errorMsg: field.touched ? field.errors.join(" ") : undefined, required: field.required, onBlur: () => {
|
|
14
|
+
(0, utils_1.maybeCall)(onBlur);
|
|
15
|
+
field.blur();
|
|
16
|
+
}, onFocus: () => {
|
|
17
|
+
(0, utils_1.maybeCall)(onFocus);
|
|
18
|
+
field.focus();
|
|
19
|
+
}, onEnter: () => {
|
|
14
20
|
(0, utils_1.maybeCall)(onEnter);
|
|
15
21
|
field.maybeAutoSave();
|
|
16
22
|
} }, testId, others), void 0)) }, void 0));
|
package/dist/hooks/useHover.d.ts
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { HTMLAttributes } from "react";
|
|
2
|
-
import { Callback } from "../types";
|
|
3
2
|
interface useHoverProps {
|
|
4
|
-
onHoverStart?:
|
|
5
|
-
onHoverEnd?:
|
|
3
|
+
onHoverStart?: VoidFunction;
|
|
4
|
+
onHoverEnd?: VoidFunction;
|
|
6
5
|
onHoverChange?: (isHovering: boolean) => void;
|
|
7
6
|
disabled?: boolean;
|
|
8
7
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { ReactNode } from "react";
|
|
2
2
|
import { Modifier } from "react-day-picker";
|
|
3
3
|
import { TextFieldBaseProps } from "./TextFieldBase";
|
|
4
|
-
import { Callback } from "../types";
|
|
5
4
|
export interface DateFieldProps extends Pick<TextFieldBaseProps<{}>, "borderless" | "visuallyDisabled" | "hideLabel" | "compact"> {
|
|
6
5
|
value: Date | undefined;
|
|
7
6
|
label: string;
|
|
@@ -27,7 +26,7 @@ export interface DateFieldProps extends Pick<TextFieldBaseProps<{}>, "borderless
|
|
|
27
26
|
* exposed from `react-day-picker`: https://react-day-picker.js.org/api/DayPicker#modifiers
|
|
28
27
|
*/
|
|
29
28
|
disabledDays?: Modifier | Modifier[];
|
|
30
|
-
onEnter?:
|
|
29
|
+
onEnter?: VoidFunction;
|
|
31
30
|
defaultOpen?: boolean;
|
|
32
31
|
}
|
|
33
32
|
export declare function DateField(props: DateFieldProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { ReactNode } from "react";
|
|
2
2
|
import { Xss } from "../Css";
|
|
3
|
-
import { Callback } from "../types";
|
|
4
3
|
export declare type NumberFieldType = "cents" | "percent" | "basisPoints" | "days";
|
|
5
4
|
export interface NumberFieldProps {
|
|
6
5
|
label: string;
|
|
@@ -23,7 +22,7 @@ export interface NumberFieldProps {
|
|
|
23
22
|
displayDirection?: boolean;
|
|
24
23
|
numFractionDigits?: number;
|
|
25
24
|
truncate?: boolean;
|
|
26
|
-
onEnter?:
|
|
25
|
+
onEnter?: VoidFunction;
|
|
27
26
|
}
|
|
28
27
|
export declare function NumberField(props: NumberFieldProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
29
28
|
export declare function formatValue(value: number, factor: number, numFractionDigits: number | undefined): number | undefined;
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import { Only } from "../Css";
|
|
2
2
|
import { BeamTextFieldProps, TextFieldXss } from "../interfaces";
|
|
3
|
-
import { Callback } from "../types";
|
|
4
3
|
export interface TextAreaFieldProps<X> extends BeamTextFieldProps<X> {
|
|
5
4
|
preventNewLines?: boolean;
|
|
6
|
-
onEnter?:
|
|
5
|
+
onEnter?: VoidFunction;
|
|
7
6
|
}
|
|
8
7
|
/** Returns a <textarea /> element that auto-adjusts height based on the field's value */
|
|
9
8
|
export declare function TextAreaField<X extends Only<TextFieldXss, X>>(props: TextAreaFieldProps<X>): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
@@ -1,17 +1,16 @@
|
|
|
1
1
|
import { MutableRefObject, ReactNode } from "react";
|
|
2
2
|
import { Only } from "../Css";
|
|
3
3
|
import { BeamTextFieldProps, TextFieldXss } from "../interfaces";
|
|
4
|
-
import { Callback } from "../types";
|
|
5
4
|
export interface TextFieldProps<X> extends BeamTextFieldProps<X> {
|
|
6
5
|
compact?: boolean;
|
|
7
6
|
inlineLabel?: boolean;
|
|
8
7
|
clearable?: boolean;
|
|
9
8
|
api?: MutableRefObject<TextFieldApi | undefined>;
|
|
10
|
-
onEnter?:
|
|
9
|
+
onEnter?: VoidFunction;
|
|
11
10
|
endAdornment?: ReactNode;
|
|
12
11
|
startAdornment?: ReactNode;
|
|
13
12
|
}
|
|
14
13
|
export declare function TextField<X extends Only<TextFieldXss, X>>(props: TextFieldProps<X>): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
15
14
|
export declare type TextFieldApi = {
|
|
16
|
-
focus:
|
|
15
|
+
focus: VoidFunction;
|
|
17
16
|
};
|
|
@@ -2,7 +2,6 @@ import { InputHTMLAttributes, LabelHTMLAttributes, MutableRefObject, ReactNode }
|
|
|
2
2
|
import { ComboBoxState } from "react-stately";
|
|
3
3
|
import { PresentationFieldProps } from "../../components/PresentationContext";
|
|
4
4
|
import { Value } from "../Value";
|
|
5
|
-
import { Callback } from "../../types";
|
|
6
5
|
interface SelectFieldInputProps<O, V extends Value> extends PresentationFieldProps {
|
|
7
6
|
buttonProps: any;
|
|
8
7
|
buttonRef: MutableRefObject<HTMLButtonElement | null>;
|
|
@@ -26,7 +25,7 @@ interface SelectFieldInputProps<O, V extends Value> extends PresentationFieldPro
|
|
|
26
25
|
contrast?: boolean;
|
|
27
26
|
nothingSelectedText: string;
|
|
28
27
|
tooltip?: ReactNode;
|
|
29
|
-
resetField:
|
|
28
|
+
resetField: VoidFunction;
|
|
30
29
|
}
|
|
31
30
|
export declare function SelectFieldInput<O, V extends Value>(props: SelectFieldInputProps<O, V>): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
32
31
|
export {};
|
package/dist/interfaces.d.ts
CHANGED
|
@@ -2,7 +2,6 @@ import type { PressEvent } from "@react-types/shared";
|
|
|
2
2
|
import { ReactNode } from "react";
|
|
3
3
|
import { PresentationFieldProps } from "./components/PresentationContext";
|
|
4
4
|
import { Xss } from "./Css";
|
|
5
|
-
import { Callback } from "./types";
|
|
6
5
|
/** Base Interfaced */
|
|
7
6
|
export interface BeamFocusableProps {
|
|
8
7
|
/** Whether the element should receive focus on render. */
|
|
@@ -36,9 +35,9 @@ export interface BeamTextFieldProps<X> extends BeamFocusableProps, PresentationF
|
|
|
36
35
|
/** Handler called when the interactive element state changes. */
|
|
37
36
|
onChange: (value: string | undefined) => void;
|
|
38
37
|
/** Called when the component loses focus, mostly for BoundTextField to use. */
|
|
39
|
-
onBlur?:
|
|
40
|
-
onFocus?:
|
|
41
|
-
onEnter?:
|
|
38
|
+
onBlur?: VoidFunction;
|
|
39
|
+
onFocus?: VoidFunction;
|
|
40
|
+
onEnter?: VoidFunction;
|
|
42
41
|
/** Whether the field is readOnly. If a ReactNode, it's treated as a "readOnly reason" that's shown in a tooltip. */
|
|
43
42
|
readOnly?: boolean | ReactNode;
|
|
44
43
|
placeholder?: string;
|
package/dist/types.d.ts
CHANGED
|
@@ -3,7 +3,6 @@ export declare type HasIdAndName<V = string> = {
|
|
|
3
3
|
name: string;
|
|
4
4
|
};
|
|
5
5
|
export declare type Optional<T, K extends keyof T> = Omit<T, K> & Partial<T>;
|
|
6
|
-
export declare type Callback = () => void;
|
|
7
6
|
export declare type CheckFn = () => boolean;
|
|
8
7
|
export declare type CanCloseCheck = {
|
|
9
8
|
check: CheckFn;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { PressEvent } from "@react-types/shared";
|
|
2
2
|
import { HTMLAttributes, ReactNode } from "react";
|
|
3
|
-
export declare function getButtonOrLink(content: ReactNode, onClick: ((e: PressEvent) => void) | string, attrs: HTMLAttributes<HTMLButtonElement | HTMLAnchorElement>, openInNew?: boolean, downloadLink?: boolean): JSX.Element;
|
|
3
|
+
export declare function getButtonOrLink(content: ReactNode, onClick: ((e: PressEvent) => void) | VoidFunction | string | undefined, attrs: HTMLAttributes<HTMLButtonElement | HTMLAnchorElement>, openInNew?: boolean, downloadLink?: boolean): JSX.Element;
|
|
@@ -4,7 +4,12 @@ exports.getButtonOrLink = void 0;
|
|
|
4
4
|
const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
|
5
5
|
const react_router_dom_1 = require("react-router-dom");
|
|
6
6
|
const index_1 = require("./index");
|
|
7
|
-
function getButtonOrLink(content,
|
|
8
|
-
|
|
7
|
+
function getButtonOrLink(content,
|
|
8
|
+
// PressEvent set by React-Aria's `useButton`.
|
|
9
|
+
onClick, attrs, openInNew = false, downloadLink = false) {
|
|
10
|
+
return typeof onClick === "string" ? ((0, index_1.isAbsoluteUrl)(onClick) || openInNew || downloadLink ? ((0, jsx_runtime_1.jsx)("a", Object.assign({}, attrs, { href: onClick }, (downloadLink ? { download: "" } : { target: "_blank", rel: "noreferrer noopener" }), { children: content }), void 0)) : ((0, jsx_runtime_1.jsx)(react_router_dom_1.Link, Object.assign({}, attrs, { to: onClick }, { children: content }), void 0))) : (
|
|
11
|
+
// Cast `onClick` as VoidFunction this is the type if will be if not overwritten by `attrs` (which happens via Button.tsx)
|
|
12
|
+
// Type `(e: PressEvent) => {}` is only used but Button.tsx, which passes the `onClick` prop as part of the `attrs`.
|
|
13
|
+
(0, jsx_runtime_1.jsx)("button", Object.assign({ onClick: onClick }, attrs, { children: content }), void 0));
|
|
9
14
|
}
|
|
10
15
|
exports.getButtonOrLink = getButtonOrLink;
|