@firecms/ui 3.3.0-canary.2064433 → 3.3.0-canary.289082f
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/Card.d.ts +2 -3
- package/dist/components/Checkbox.d.ts +2 -1
- package/dist/components/Chip.d.ts +5 -1
- package/dist/components/Dialog.d.ts +2 -1
- package/dist/components/FilterChip.d.ts +34 -0
- package/dist/components/IconButton.d.ts +1 -0
- package/dist/components/Popover.d.ts +3 -1
- package/dist/components/Select.d.ts +1 -1
- package/dist/components/TextField.d.ts +2 -2
- package/dist/components/index.d.ts +1 -0
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/useDebounceCallback.d.ts +13 -0
- package/dist/index.es.js +982 -530
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +981 -529
- package/dist/index.umd.js.map +1 -1
- package/dist/{index.css → src/index.css} +43 -32
- package/dist/styles.d.ts +1 -1
- package/package.json +6 -6
- package/src/components/Alert.tsx +7 -7
- package/src/components/Avatar.tsx +1 -1
- package/src/components/BooleanSwitch.tsx +6 -3
- package/src/components/Button.tsx +17 -13
- package/src/components/Card.tsx +3 -1
- package/src/components/CenteredView.tsx +1 -1
- package/src/components/Checkbox.tsx +10 -4
- package/src/components/Chip.tsx +70 -11
- package/src/components/Collapse.tsx +2 -0
- package/src/components/Dialog.tsx +8 -5
- package/src/components/ExpandablePanel.tsx +3 -2
- package/src/components/FilterChip.tsx +79 -0
- package/src/components/IconButton.tsx +11 -6
- package/src/components/InfoLabel.tsx +1 -1
- package/src/components/InputLabel.tsx +2 -2
- package/src/components/Label.tsx +1 -1
- package/src/components/LoadingButton.tsx +1 -1
- package/src/components/Menu.tsx +2 -0
- package/src/components/Popover.tsx +9 -3
- package/src/components/RadioGroup.tsx +1 -1
- package/src/components/Select.tsx +8 -6
- package/src/components/Separator.tsx +2 -2
- package/src/components/Skeleton.tsx +25 -8
- package/src/components/TextField.tsx +27 -13
- package/src/components/ToggleButtonGroup.tsx +4 -2
- package/src/components/index.tsx +1 -0
- package/src/hooks/index.ts +1 -0
- package/src/hooks/useDebounceCallback.tsx +47 -0
- package/src/index.css +43 -32
- package/src/styles.ts +1 -1
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
|
|
2
|
+
declare const Card: React.ForwardRefExoticComponent<{
|
|
3
3
|
children: React.ReactNode;
|
|
4
4
|
style?: React.CSSProperties;
|
|
5
5
|
onClick?: (e?: React.MouseEvent) => void;
|
|
6
6
|
className?: string;
|
|
7
|
-
}
|
|
8
|
-
declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
|
|
7
|
+
} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
9
8
|
export { Card };
|
|
@@ -8,5 +8,6 @@ export interface CheckboxProps {
|
|
|
8
8
|
padding?: boolean;
|
|
9
9
|
size?: "smallest" | "small" | "medium" | "large";
|
|
10
10
|
color?: "primary" | "secondary";
|
|
11
|
+
"aria-label"?: string;
|
|
11
12
|
}
|
|
12
|
-
export declare const Checkbox: React.MemoExoticComponent<({ id, checked, indeterminate, padding, disabled, size, onCheckedChange, color }: CheckboxProps) => React.JSX.Element>;
|
|
13
|
+
export declare const Checkbox: React.MemoExoticComponent<({ id, checked, indeterminate, padding, disabled, size, onCheckedChange, color, "aria-label": ariaLabel }: CheckboxProps) => React.JSX.Element>;
|
|
@@ -3,12 +3,16 @@ import { CHIP_COLORS } from "../util";
|
|
|
3
3
|
export type ChipColorScheme = {
|
|
4
4
|
color: string;
|
|
5
5
|
text: string;
|
|
6
|
+
/** Background color override for dark mode. Falls back to `color`. */
|
|
7
|
+
darkColor?: string;
|
|
8
|
+
/** Text color override for dark mode. Falls back to `text`. */
|
|
9
|
+
darkText?: string;
|
|
6
10
|
};
|
|
7
11
|
export type ChipColorKey = keyof typeof CHIP_COLORS;
|
|
8
12
|
export interface ChipProps {
|
|
9
13
|
className?: string;
|
|
10
14
|
children: React.ReactNode;
|
|
11
|
-
size?: "small" | "medium" | "large";
|
|
15
|
+
size?: "smallest" | "small" | "medium" | "large";
|
|
12
16
|
colorScheme?: ChipColorScheme | ChipColorKey;
|
|
13
17
|
error?: boolean;
|
|
14
18
|
outlined?: boolean;
|
|
@@ -20,6 +20,7 @@ export type DialogProps = {
|
|
|
20
20
|
*/
|
|
21
21
|
disableInitialFocus?: boolean;
|
|
22
22
|
portalContainer?: HTMLElement | null;
|
|
23
|
+
"aria-describedby"?: string;
|
|
23
24
|
};
|
|
24
25
|
declare const widthClasses: {
|
|
25
26
|
xs: string;
|
|
@@ -35,5 +36,5 @@ declare const widthClasses: {
|
|
|
35
36
|
"7xl": string;
|
|
36
37
|
full: string;
|
|
37
38
|
};
|
|
38
|
-
export declare const Dialog: ({ open, onOpenChange, children, className, containerClassName, fullWidth, fullHeight, fullScreen, scrollable, maxWidth, modal, onOpenAutoFocus, onEscapeKeyDown, onPointerDownOutside, onInteractOutside, disableInitialFocus, portalContainer }: DialogProps) => React.JSX.Element;
|
|
39
|
+
export declare const Dialog: ({ open, onOpenChange, children, className, containerClassName, fullWidth, fullHeight, fullScreen, scrollable, maxWidth, modal, onOpenAutoFocus, onEscapeKeyDown, onPointerDownOutside, onInteractOutside, disableInitialFocus, portalContainer, "aria-describedby": ariaDescribedby }: DialogProps) => React.JSX.Element;
|
|
39
40
|
export {};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface FilterChipProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
|
|
3
|
+
/**
|
|
4
|
+
* The text label displayed on the chip.
|
|
5
|
+
*/
|
|
6
|
+
children: React.ReactNode;
|
|
7
|
+
/**
|
|
8
|
+
* Whether the chip is currently in an active/selected state.
|
|
9
|
+
*/
|
|
10
|
+
active?: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* Optional icon rendered before the label.
|
|
13
|
+
*/
|
|
14
|
+
icon?: React.ReactNode;
|
|
15
|
+
/**
|
|
16
|
+
* Size variant.
|
|
17
|
+
* @default "medium"
|
|
18
|
+
*/
|
|
19
|
+
size?: "small" | "medium";
|
|
20
|
+
/**
|
|
21
|
+
* Whether the chip is disabled.
|
|
22
|
+
*/
|
|
23
|
+
disabled?: boolean;
|
|
24
|
+
}
|
|
25
|
+
/**
|
|
26
|
+
* A toggle chip used for filter presets and similar multi-select controls.
|
|
27
|
+
*
|
|
28
|
+
* Uses an inset box-shadow for the active ring instead of `border` so the
|
|
29
|
+
* chip size stays stable across states and the ring cannot be clipped by
|
|
30
|
+
* parent `overflow-hidden` containers.
|
|
31
|
+
*
|
|
32
|
+
* @group Interactive components
|
|
33
|
+
*/
|
|
34
|
+
export declare const FilterChip: React.ForwardRefExoticComponent<FilterChipProps & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -7,5 +7,6 @@ export type IconButtonProps<C extends React.ElementType> = Omit<(C extends "butt
|
|
|
7
7
|
toggled?: boolean;
|
|
8
8
|
component?: C;
|
|
9
9
|
onClick?: React.MouseEventHandler<any>;
|
|
10
|
+
"aria-label"?: string;
|
|
10
11
|
};
|
|
11
12
|
export declare const IconButton: React.ComponentType<IconButtonProps<any>>;
|
|
@@ -18,5 +18,7 @@ export interface PopoverProps {
|
|
|
18
18
|
modal?: boolean;
|
|
19
19
|
className?: string;
|
|
20
20
|
portalContainer?: HTMLElement | null;
|
|
21
|
+
onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
|
|
22
|
+
onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
|
|
21
23
|
}
|
|
22
|
-
export declare function Popover({ trigger, children, open, onOpenChange, side, sideOffset, align, alignOffset, arrowPadding, sticky, hideWhenDetached, avoidCollisions, enabled, modal, portalContainer, className }: PopoverProps): React.JSX.Element;
|
|
24
|
+
export declare function Popover({ trigger, children, open, onOpenChange, side, sideOffset, align, alignOffset, arrowPadding, sticky, hideWhenDetached, avoidCollisions, enabled, modal, portalContainer, className, onMouseEnter, onMouseLeave }: PopoverProps): React.JSX.Element;
|
|
@@ -20,7 +20,7 @@ export type SelectProps<T extends SelectValue = string> = {
|
|
|
20
20
|
error?: boolean;
|
|
21
21
|
position?: "item-aligned" | "popper";
|
|
22
22
|
endAdornment?: React.ReactNode;
|
|
23
|
-
inputRef?: React.
|
|
23
|
+
inputRef?: React.Ref<HTMLButtonElement>;
|
|
24
24
|
padding?: boolean;
|
|
25
25
|
invisible?: boolean;
|
|
26
26
|
children?: React.ReactNode;
|
|
@@ -27,7 +27,7 @@ export type TextFieldProps<T extends string | number> = {
|
|
|
27
27
|
* @default 1
|
|
28
28
|
*/
|
|
29
29
|
minRows?: number | string;
|
|
30
|
-
} & Omit<React.InputHTMLAttributes<HTMLInputElement>, "size">;
|
|
30
|
+
} & Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "value">;
|
|
31
31
|
export declare const TextField: React.ForwardRefExoticComponent<{
|
|
32
32
|
type?: InputType;
|
|
33
33
|
value?: string | number | undefined;
|
|
@@ -55,4 +55,4 @@ export declare const TextField: React.ForwardRefExoticComponent<{
|
|
|
55
55
|
* @default 1
|
|
56
56
|
*/
|
|
57
57
|
minRows?: number | string;
|
|
58
|
-
} & Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & React.RefAttributes<HTMLDivElement>>;
|
|
58
|
+
} & Omit<React.InputHTMLAttributes<HTMLInputElement>, "value" | "size"> & React.RefAttributes<HTMLDivElement>>;
|
package/dist/hooks/index.d.ts
CHANGED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Returns a debounced version of the provided callback. The returned function
|
|
3
|
+
* keeps the same signature as the input callback; each invocation resets the
|
|
4
|
+
* timer, so the wrapped callback only runs once calls stop for `delay` ms.
|
|
5
|
+
*
|
|
6
|
+
* Unlike {@link useDebounceValue}, which debounces a *value*, this debounces a
|
|
7
|
+
* *function call* — useful for search inputs, autosave, resize handlers, etc.
|
|
8
|
+
*
|
|
9
|
+
* @param callback the function to debounce. May be undefined.
|
|
10
|
+
* @param delay debounce delay in milliseconds. Defaults to 200ms.
|
|
11
|
+
* @group Hooks
|
|
12
|
+
*/
|
|
13
|
+
export declare function useDebounceCallback<T extends (...args: any[]) => unknown>(callback?: T, delay?: number): T;
|