leaflet.pub
a tool for shared writing and social publishing
fwd refs on action Button
cozylittle.house
+8
-5
components/ActionBar/ActionButton.tsx
+8
-5
components/ActionBar/ActionButton.tsx
···
7
8
type ButtonProps = Omit<JSX.IntrinsicElements["button"], "content">;
9
10
-
export const ActionButton = (
11
-
_props: ButtonProps & {
12
id?: string;
13
icon: React.ReactNode;
14
label: React.ReactNode;
···
19
subtext?: string;
20
labelOnMobile?: boolean;
21
z?: boolean;
22
-
},
23
-
) => {
24
let {
25
id,
26
icon,
···
50
return (
51
<button
52
{...buttonProps}
53
className={`
54
actionButton relative font-bold
55
rounded-md border
···
81
</div>
82
</button>
83
);
84
-
};
···
7
8
type ButtonProps = Omit<JSX.IntrinsicElements["button"], "content">;
9
10
+
export const ActionButton = forwardRef<
11
+
HTMLButtonElement,
12
+
ButtonProps & {
13
id?: string;
14
icon: React.ReactNode;
15
label: React.ReactNode;
···
20
subtext?: string;
21
labelOnMobile?: boolean;
22
z?: boolean;
23
+
}
24
+
>((_props, ref) => {
25
let {
26
id,
27
icon,
···
51
return (
52
<button
53
{...buttonProps}
54
+
ref={ref}
55
className={`
56
actionButton relative font-bold
57
rounded-md border
···
83
</div>
84
</button>
85
);
86
+
});
87
+
ActionButton.displayName = "ActionButton";