@atlaskit/primitives
Version:
Primitives are token-backed low-level building blocks.
42 lines (41 loc) • 1.32 kB
JavaScript
/* bleed.tsx generated by @compiled/babel-plugin v0.36.1 */
import "./bleed.compiled.css";
import { ax, ix } from "@compiled/react/runtime";
import React from 'react';
// NOTE: This maintains a full map of 10 styles as Bleed is a bit of a semantic outlier
const styles = {
root: "_vchhusvi",
'inline.space.025': "_195g4pxn",
'inline.space.050': "_195ggp71",
'inline.space.100': "_195gtdkl",
'inline.space.150': "_195gkqjj",
'inline.space.200': "_195g1e8l",
'block.space.025': "_1mou4pxn",
'block.space.050': "_1mougp71",
'block.space.100': "_1moutdkl",
'block.space.150': "_1moukqjj",
'block.space.200': "_1mou1e8l"
};
/**
* __Bleed__
*
* `Bleed` is a primitive layout component that controls negative whitespace.
*
* - [Examples](https://atlassian.design/components/primitives/bleed/examples)
* - [Code](https://atlassian.design/components/primitives/bleed/code)
*/
const Bleed = /*#__PURE__*/React.memo(({
children,
testId,
inline,
block,
all,
xcss
}) => {
return /*#__PURE__*/React.createElement("div", {
className: ax([styles.root, all && styles[`inline.${all}`], inline && styles[`inline.${inline}`], all && styles[`block.${all}`], block && styles[`block.${block}`], xcss]),
"data-testid": testId
}, children);
});
Bleed.displayName = 'Bleed';
export default Bleed;