@datalayer/core/lib/components/display/DatalayerBox.js

**Datalayer Core**

import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
/*
 * Copyright (c) 2023-2025 Datalayer, Inc.
 * Distributed under the terms of the Modified BSD License.
 */
import { Link, Text } from "@primer/react";
import { Box } from "@datalayer/primer-addons";
import { ArrowRightIcon } from "@primer/octicons-react";
import { useNavigate } from "../../hooks";
export const DatalayerBox = (props) => {
    const { title, linkLabel, linkRoute, children } = props;
    const navigate = useNavigate();
    return (_jsxs(_Fragment, { children: [_jsxs(Box, { sx: {
                    display: "flex",
                    alignItems: "center",
                    justifyContent: "space-between",
                    paddingRight: 4
                }, children: [_jsx(Text, { as: "h2", sx: { borderLeft: "6px solid #28b899", paddingLeft: 2 }, children: title }), linkRoute && linkLabel &&
                        _jsxs(Link, { href: "javascript: return false;", onClick: e => navigate(linkRoute), children: [linkLabel, _jsx(ArrowRightIcon, {})] })] }), _jsx(Box, { sx: {
                    borderColor: "border.default",
                    borderStyle: "solid",
                    borderWidth: "1",
                    borderRadius: "2",
                    padding: 4,
                    marginTop: 2,
                }, children: children })] }));
};
export default DatalayerBox;