@atlaskit/dynamic-table
Version:
A dynamic table displays rows of data with built-in pagination, sorting, and re-ordering functionality.
56 lines (55 loc) • 1.45 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
/* eslint-disable @repo/internal/react/require-jsdoc */
/**
* @jsxRuntime classic
* @jsx jsx
*/
import { forwardRef } from 'react';
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
import { css, jsx } from '@emotion/react';
const containerStyles = css({
position: 'relative',
marginBlockEnd: "var(--ds-space-300, 24px)"
});
export const Container = /*#__PURE__*/forwardRef((props, ref) => {
const {
children,
testId,
...rest
} = props;
return (
// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
jsx("div", _extends({
css: containerStyles
}, rest, {
"data-testid": testId,
ref: ref
}), children)
);
});
const spinnerBackdropStyles = css({
display: 'flex',
position: 'absolute',
inset: 0,
alignItems: 'center',
justifyContent: 'center',
pointerEvents: 'none'
});
export const SpinnerBackdrop = ({
children,
testId
}) => jsx("div", {
css: spinnerBackdropStyles,
"data-testid": testId && `${testId}--spinner-backdrop`
}, children);
const spinnerContainerStyles = css({
position: 'relative',
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
insetBlockStart: 0
});
export const SpinnerContainer = /*#__PURE__*/forwardRef(({
children
}, ref) => jsx("div", {
css: spinnerContainerStyles,
ref: ref
}, children));