282c8fa415
* feat: add rrweb web-extension package * refactor: make the extension suitable for manifest v3 * update tsconfig.json * use version_name rather than recorder_version in manifest.json * update manifest.json * enable to keep recording after changing tabs * enable to record between tabs and urls * fix CI error * try to fix CI error * feat: add pause and resume buttons * feat: add a link to new session after recording * improve session list * refactor: migrate session storage from chrome local storage to indexedDB * feat: add pagination to session list * fix: multiple recorders are started after pausing and resuming process * fix: can't stop recording on firefox browser * update type import of 'eventWithTime' * fix CI error * doc: add readme * Apply suggestions from Justin's code review Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com> * refactor: make use of webNavigation API to implement recording consistent during page navigation * fix firefox compatibility issue and add title to pages * add mouseleave listener to enhance the recording liability * fix firefox compatibility issue and improve the experience of recording resume after closing tabs * update tsconfig * upgrade vite-plugin-web-extension config to fix some bugs on facebook web page * update import links * refactor: cross tab recording mechanism apply Justin's suggestion * refactor: slipt util/index.ts into multiple files * implement cross-origin iframe recording * fix: regression of issue: ShadowHost can't be a string (issue 941) * refactor shadow dom recording to make tests cover key code * Apply formatting changes * increase the node memory limitation to avoid CI failure * Create lovely-pears-cross.md * Apply formatting changes * Update packages/web-extension/package.json * Update .changeset/lovely-pears-cross.md * update change logs * delete duplicated property --------- Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
34 lines
635 B
TypeScript
34 lines
635 B
TypeScript
import { Button, ButtonProps } from '@chakra-ui/react';
|
|
|
|
interface CircleButtonProps extends ButtonProps {
|
|
diameter: number;
|
|
onClick?: () => void;
|
|
children?: React.ReactNode;
|
|
title?: string;
|
|
}
|
|
|
|
export function CircleButton({
|
|
diameter,
|
|
onClick,
|
|
children,
|
|
title,
|
|
...rest
|
|
}: CircleButtonProps) {
|
|
return (
|
|
<Button
|
|
w={`${diameter}rem`}
|
|
h={`${diameter}rem`}
|
|
padding={`${diameter / 2}rem`}
|
|
borderRadius={9999}
|
|
textAlign="center"
|
|
bgColor="gray.100"
|
|
boxSizing="content-box"
|
|
onClick={onClick}
|
|
title={title}
|
|
{...rest}
|
|
>
|
|
{children}
|
|
</Button>
|
|
);
|
|
}
|