@atlaskit/section-message
Version:
A section message is used to alert users to a particular section of the screen.
72 lines (70 loc) • 2.5 kB
JavaScript
/* section-message-action.tsx generated by @compiled/babel-plugin v3.0.2 */
import "./section-message-action.compiled.css";
import * as React from 'react';
import { ax, ix } from "@compiled/react/runtime";
import { forwardRef, Fragment, memo } from 'react';
import Button from '@atlaskit/button/standard-button';
import { cx } from '@atlaskit/css';
import Link from '@atlaskit/link/link';
import { Box, Pressable } from '@atlaskit/primitives/compiled';
var styles = {
common: "_11c8fhey",
anchor: "_k48pi7a9",
pressable: "_2rkolb4i _syaz13af _k48p1wq8 _bfhk1j28 _1q51ze3t _y4tize3t _85i5ze3t _bozgze3t _9oik1r31 _1bnx8stv _jf4cnqa1 _30l313af _9h8h12zz"
};
/**
* __Section message action__
*
* A section message action is designed to work with the `action` prop from
* `SectionMessage`. It renders either a button or a link depending on whether
* an `onClick` or `href` prop is supplied, with a dot separator in between actions.
*
* - [Examples](https://atlassian.design/components/section-message/examples#actions)
*/
var SectionMessageAction = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, ref) {
var children = _ref.children,
onClick = _ref.onClick,
href = _ref.href,
testId = _ref.testId,
linkComponent = _ref.linkComponent,
target = _ref.target;
if (!linkComponent) {
if (href) {
return /*#__PURE__*/React.createElement("span", {
className: ax([styles.common, styles.anchor])
}, /*#__PURE__*/React.createElement(Link, {
testId: testId,
onClick: onClick,
href: href,
target: target,
ref: ref
}, children));
}
if (onClick) {
return /*#__PURE__*/React.createElement(Pressable, {
testId: testId,
onClick: onClick,
xcss: cx(styles.common, styles.pressable),
ref: ref
}, children);
}
return /*#__PURE__*/React.createElement(Box, {
as: "span",
testId: testId,
xcss: styles.common,
ref: ref
}, children);
}
// TODO: Remove this once the deprecated `linkComponent` prop is removed.
return onClick || href ? /*#__PURE__*/React.createElement(Button, {
testId: testId,
appearance: "link",
spacing: "none",
onClick: onClick,
href: href,
component: href ? linkComponent : undefined,
ref: ref
}, children) : /*#__PURE__*/React.createElement(Fragment, null, children);
}));
SectionMessageAction.displayName = 'SectionMessageAction';
export default SectionMessageAction;