File size: 1,785 Bytes
cf86710 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 | /**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the LICENSE file
* in the root directory of this source tree.
*/
import React, { type CSSProperties, type ReactNode } from "react";
import styles from "./BrowserWindow.module.css";
import { ShadowDomWrapper } from "./ShadowDomWrapper";
interface Props {
children: ReactNode;
minHeight?: number;
url?: string;
style?: CSSProperties;
styleStr?: string;
bodyStyle?: CSSProperties;
shadow?: boolean;
sourceUrl?: string;
sourceLabel?: string;
}
export function BrowserWindow({
children,
minHeight,
style,
bodyStyle,
shadow = true,
styleStr,
url,
sourceUrl,
sourceLabel = "View source",
}: Props) {
return (
<div className={styles.browserWindow} style={{ ...style, minHeight }}>
<div className={styles.browserWindowHeader}>
<div className={styles.buttons}>
<span className={styles.dot} style={{ background: "#f25f58" }} />
<span className={styles.dot} style={{ background: "#fbbe3c" }} />
<span className={styles.dot} style={{ background: "#58cb42" }} />
</div>
{url ? (
<div className={styles.browserWindowAddressBar}>{url}</div>
) : null}
{sourceUrl ? (
<a
className={styles.sourceLink}
href={sourceUrl}
rel="noreferrer"
target="_blank"
>
{sourceLabel}
</a>
) : null}
</div>
<div className={`${styles.browserWindowBody} rdp-demo`} style={bodyStyle}>
{shadow ? (
<ShadowDomWrapper styleStr={styleStr}>{children}</ShadowDomWrapper>
) : (
children
)}
</div>
</div>
);
}
|