@atlaskit/side-navigation
Version:
A highly composable side navigation component that supports nested views.
121 lines (115 loc) • 3.88 kB
JavaScript
/* index.tsx generated by @compiled/babel-plugin v3.0.2 */
import _extends from "@babel/runtime/helpers/extends";
import "./index.compiled.css";
import * as React from 'react';
import { ax, ix } from "@compiled/react/runtime";
/* eslint-disable @repo/internal/react/consistent-props-definitions */
import warnOnce from '@atlaskit/ds-lib/warn-once';
import { Box, Stack, Text } from '@atlaskit/primitives/compiled';
import HeaderContainer from '../Header/header-container';
import { CustomItem } from '../Item/custom-item';
const styles = {
iconContainer: "_1e0c1o8l _1bsb1k8s _4t3i1k8s",
oldFooter: "_uizt1wug _1e0c1ule _y3gn1h6o _1tke1tcg _4cvr1h6o _1bsb1osq _vrjtwadc _16vx1h6o _bek6ze3t _rh04u2gc _76zj1o8l _13e21h6o _14bw1o8l _xosk12x7 _wte412x7 _ou5312x7 _1jo512x7 _11kjsm61 _jl2n73ad _1et6sm61 _1v6jazsu"
};
/**
* @deprecated `@atlaskit/side-navigation` is deprecated. Use `@atlaskit/navigation-system` instead.
*/
/**
* __Footer__
*
* - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
* - [Code](https://atlassian.design/components/side-navigation/code)
*
* @deprecated `@atlaskit/side-navigation` is deprecated. Use `@atlaskit/navigation-system` instead.
*/
const OldFooter = props => {
// https://stackoverflow.com/a/39333479
const safeProps = (({
iconBefore,
onClick,
description,
children,
testId
}) => ({
iconBefore,
onClick,
description,
children,
testId
}))(props);
return /*#__PURE__*/React.createElement(CustomItem, _extends({}, safeProps, {
component: props.component || HeaderContainer,
className: ax([styles.oldFooter])
}));
};
/**
* __Footer__
*
* - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
* - [Code](https://atlassian.design/components/side-navigation/code)
*/
const Footer = ({
description,
children,
iconBefore,
testId
}) => {
return /*#__PURE__*/React.createElement(Box, {
padding: "space.100",
testId: testId
}, /*#__PURE__*/React.createElement(Stack, {
space: "space.100",
alignInline: "center"
}, /*#__PURE__*/React.createElement(Box, {
xcss: styles.iconContainer
}, iconBefore), /*#__PURE__*/React.createElement(Stack, {
space: "space.075"
}, /*#__PURE__*/React.createElement(Text, {
size: "small",
align: "center",
color: "inherit"
}, children), description && /*#__PURE__*/React.createElement(Text, {
size: "small",
as: "p",
align: "center",
color: "color.text.subtlest"
}, description))));
};
/**
* __Footer__
*
* - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
* - [Code](https://atlassian.design/components/side-navigation/code)
*
* @deprecated `@atlaskit/side-navigation` is deprecated. Use `@atlaskit/navigation-system` instead.
*/
export const FooterFacade = ({
useDeprecatedApi = true,
description,
iconBefore,
testId,
children,
component,
onClick
}) => {
if (!useDeprecatedApi) {
return /*#__PURE__*/React.createElement(Footer, {
iconBefore: iconBefore,
description: description,
testId: testId
}, children);
}
if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production' && process.env.NODE_ENV !== 'CI') {
warnOnce('The `@atlaskit/side-navigation` Footer has simplified its API, removing support for the `component` and `onClick` props.\n\nThese props will stop working in a future major release. Reach out to #help-design-system on slack for help.');
}
return /*#__PURE__*/React.createElement(OldFooter, {
onClick: onClick,
component: component,
iconBefore: iconBefore,
description: description,
testId: testId
}, children);
};
// Public API aliases preserved from an eliminated entry-point (volt-migrate-package).
export { FooterFacade as Footer };