@procore/core-react 10.30.0 → 11.0.0-rc.2

package/dist/Table/Table.d.ts

@@ -0,0 +1,50 @@
+import React from 'react';
+import { AnchorAttributes, DivAttributes, SpanAttributes, SVGAttributes, TableAttributes, TdAttributes, TextAreaAttributes, ThAttributes } from '../_utils/types';
+import { CheckboxProps } from '../Checkbox/Checkbox.types';
+import { CaratProps, ContainerProps, HeaderProps, TableProps, HeaderRowProps, HeaderCellProps, BodyProps, BodyCellProps, GroupProps, GroupTitleProps, BodyRowProps, CurrencyCellProps, DateSelectCellProps, SelectCellProps, PercentCellProps, TextAreaCellProps, TextCellProps, IconCellProps, LinkCellProps, InputCellProps } from './Table.types';
+export declare const Table_: React.ForwardRefExoticComponent<TableAttributes & TableProps & React.RefAttributes<HTMLTableElement>>;
+export declare const Carat: React.ForwardRefExoticComponent<SVGAttributes & CaratProps & React.RefAttributes<HTMLDivElement>>;
+export declare const Container: React.ForwardRefExoticComponent<DivAttributes & ContainerProps & React.RefAttributes<HTMLDivElement>>;
+export declare const Header: React.ForwardRefExoticComponent<DivAttributes & HeaderProps & React.RefAttributes<HTMLTableSectionElement>>;
+export declare const HeaderRow: React.ForwardRefExoticComponent<DivAttributes & HeaderRowProps & React.RefAttributes<HTMLTableRowElement>>;
+export declare const HeaderCell: React.ForwardRefExoticComponent<ThAttributes & HeaderCellProps & React.RefAttributes<HTMLTableHeaderCellElement>>;
+export declare const Body: React.ForwardRefExoticComponent<DivAttributes & BodyProps & React.RefAttributes<HTMLTableSectionElement>>;
+export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+export declare const GroupTitle: React.ForwardRefExoticComponent<SpanAttributes & GroupTitleProps & React.RefAttributes<HTMLSpanElement>>;
+export declare const Group: React.ForwardRefExoticComponent<DivAttributes & GroupProps & React.RefAttributes<HTMLTableRowElement>>;
+export declare const BodyRow: React.ForwardRefExoticComponent<DivAttributes & BodyRowProps & React.RefAttributes<HTMLTableRowElement>>;
+export declare const BodyCell: React.ForwardRefExoticComponent<TdAttributes & BodyCellProps & React.RefAttributes<HTMLTableDataCellElement>>;
+export declare const CurrencyCell: React.ForwardRefExoticComponent<DivAttributes & CurrencyCellProps & React.RefAttributes<HTMLDivElement>>;
+export declare const DateSelectCell: React.ForwardRefExoticComponent<DateSelectCellProps & React.RefAttributes<HTMLDivElement>>;
+export declare const IconCell: React.ForwardRefExoticComponent<DivAttributes & IconCellProps & React.RefAttributes<HTMLDivElement>>;
+export declare const InputCell: React.ForwardRefExoticComponent<InputCellProps & React.RefAttributes<HTMLInputElement>>;
+export declare const LinkCell: React.ForwardRefExoticComponent<AnchorAttributes & LinkCellProps & React.RefAttributes<HTMLDivElement>>;
+export declare const PercentCell: React.ForwardRefExoticComponent<DivAttributes & PercentCellProps & React.RefAttributes<HTMLDivElement>>;
+export declare const SelectCell: React.ForwardRefExoticComponent<SelectCellProps & React.RefAttributes<HTMLDivElement>>;
+export declare const TextAreaCell: React.ForwardRefExoticComponent<TextAreaAttributes & TextAreaCellProps & React.RefAttributes<HTMLTextAreaElement>>;
+export declare const TextCell: React.ForwardRefExoticComponent<DivAttributes & TextCellProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ @see [Storybook](https://procore.github.io/core/latest/?path=/story/demos-table--demo)
+ */
+export declare const Table: React.ForwardRefExoticComponent<TableAttributes & TableProps & React.RefAttributes<HTMLTableElement>> & {
+    Body: React.ForwardRefExoticComponent<DivAttributes & BodyProps & React.RefAttributes<HTMLTableSectionElement>>;
+    BodyCell: React.ForwardRefExoticComponent<TdAttributes & BodyCellProps & React.RefAttributes<HTMLTableDataCellElement>>;
+    BodyRow: React.ForwardRefExoticComponent<DivAttributes & BodyRowProps & React.RefAttributes<HTMLTableRowElement>>;
+    Carat: React.ForwardRefExoticComponent<SVGAttributes & CaratProps & React.RefAttributes<HTMLDivElement>>;
+    Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+    Container: React.ForwardRefExoticComponent<DivAttributes & ContainerProps & React.RefAttributes<HTMLDivElement>>;
+    CurrencyCell: React.ForwardRefExoticComponent<DivAttributes & CurrencyCellProps & React.RefAttributes<HTMLDivElement>>;
+    DateSelectCell: React.ForwardRefExoticComponent<DateSelectCellProps & React.RefAttributes<HTMLDivElement>>;
+    Group: React.ForwardRefExoticComponent<DivAttributes & GroupProps & React.RefAttributes<HTMLTableRowElement>>;
+    GroupTitle: React.ForwardRefExoticComponent<SpanAttributes & GroupTitleProps & React.RefAttributes<HTMLSpanElement>>;
+    Header: React.ForwardRefExoticComponent<DivAttributes & HeaderProps & React.RefAttributes<HTMLTableSectionElement>>;
+    HeaderCell: React.ForwardRefExoticComponent<ThAttributes & HeaderCellProps & React.RefAttributes<HTMLTableHeaderCellElement>>;
+    HeaderRow: React.ForwardRefExoticComponent<DivAttributes & HeaderRowProps & React.RefAttributes<HTMLTableRowElement>>;
+    IconCell: React.ForwardRefExoticComponent<DivAttributes & IconCellProps & React.RefAttributes<HTMLDivElement>>;
+    InputCell: React.ForwardRefExoticComponent<InputCellProps & React.RefAttributes<HTMLInputElement>>;
+    LinkCell: React.ForwardRefExoticComponent<AnchorAttributes & LinkCellProps & React.RefAttributes<HTMLDivElement>>;
+    PercentCell: React.ForwardRefExoticComponent<DivAttributes & PercentCellProps & React.RefAttributes<HTMLDivElement>>;
+    SelectCell: React.ForwardRefExoticComponent<SelectCellProps & React.RefAttributes<HTMLDivElement>>;
+    TextAreaCell: React.ForwardRefExoticComponent<TextAreaAttributes & TextAreaCellProps & React.RefAttributes<HTMLTextAreaElement>>;
+    TextCell: React.ForwardRefExoticComponent<DivAttributes & TextCellProps & React.RefAttributes<HTMLDivElement>>;
+};

package/dist/Table/Table.js

@@ -0,0 +1,202 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { addSubcomponents } from '../_utils/addSubcomponents';
+import cx from 'classnames';
+import { Link as LinkElement } from '../Link';
+import { tableSelectClassName } from '../Select/Select.styles';
+import { Spinner } from '../Spinner';
+import { StyledTable, StyledCaratWrapper, StyledCarat, StyledTableWrapper, StyledHead, StyledTableHeaderCell, StyledTableHeaderCellContainer, StyledTableHeaderCellLabel, StyledTableHeaderCellSortIconAsc, StyledTableHeaderCellSortIconDesc, StyledTableHeaderCellIconWrapper, StyledCheckbox, StyledTableGroupRowTitle, StyledTableGroupRow, StyledTableGroupRowContent, StyledTableGroupRowHeader, StyledTableBodyRow, StyledTableCellText, StyledTableInlineEditContainer, StyledLoadingContainer, StyledTableCellDateInput, StyledTableInlineEditErrorBox, StyledIconCell, StyledTableCellInput, StyledTableCellSelect, StyledSelectCellWrapper, StyledTableCellTextArea, StyledTableBodyCell, } from './Table.styles';
+export var Table_ = React.forwardRef(function Table(_a, ref) {
+    var children = _a.children, inline = _a.inline, variant = _a.variant, props = __rest(_a, ["children", "inline", "variant"]);
+    return (React.createElement(StyledTable, __assign({ ref: ref }, props, { "$inline": inline, "$fixed": variant === 'fixed' }), children));
+});
+export var Carat = React.forwardRef(function Carat(_a, ref) {
+    var _b = _a.expanded, expanded = _b === void 0 ? false : _b, props = __rest(_a, ["expanded"]);
+    return (React.createElement(StyledCaratWrapper, { ref: ref },
+        React.createElement(StyledCarat, __assign({ "$expanded": expanded }, props))));
+});
+export var Container = React.forwardRef(function Container(_a, ref) {
+    var children = _a.children, _b = _a.shelf, shelf = _b === void 0 ? false : _b, props = __rest(_a, ["children", "shelf"]);
+    return (React.createElement(StyledTableWrapper, __assign({}, props, { ref: ref, shadowStrength: 0, "$withShelf": shelf }), children));
+});
+export var Header = React.forwardRef(function Header(_a, ref) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (React.createElement(StyledHead, __assign({ ref: ref }, props), children));
+});
+export var HeaderRow = React.forwardRef(function HeaderRow(_a, ref) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (React.createElement("tr", __assign({ ref: ref }, props), children));
+});
+export var HeaderCell = React.forwardRef(function HeaderCell(_a, ref) {
+    var _b = _a.sortable, sortable = _b === void 0 ? false : _b, children = _a.children, _c = _a.snugfit, snugfit = _c === void 0 ? false : _c, _d = _a.variant, variant = _d === void 0 ? '' : _d, props = __rest(_a, ["sortable", "children", "snugfit", "variant"]);
+    return (React.createElement(StyledTableHeaderCell, __assign({ ref: ref }, props, { "$sortable": sortable, "$variant": variant, "$snugfit": snugfit }),
+        React.createElement(StyledTableHeaderCellContainer, null,
+            React.createElement(StyledTableHeaderCellLabel, null, children),
+            !sortable ? null : (React.createElement(StyledTableHeaderCellIconWrapper, null,
+                React.createElement(StyledTableHeaderCellSortIconAsc, null),
+                React.createElement(StyledTableHeaderCellSortIconDesc, null))))));
+});
+export var Body = React.forwardRef(function Body(_a, ref) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (React.createElement("tbody", __assign({ ref: ref }, props), children));
+});
+export var Checkbox = React.forwardRef(function Checkbox(props, ref) {
+    return React.createElement(StyledCheckbox, __assign({ ref: ref }, props));
+});
+export var GroupTitle = React.forwardRef(function GroupTitle(_a, ref) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (React.createElement(StyledTableGroupRowTitle, __assign({ ref: ref }, props), children));
+});
+export var Group = React.forwardRef(function Group(_a, ref) {
+    var children = _a.children, _b = _a.colSpan, colSpan = _b === void 0 ? 1000 : _b, _c = _a.depth, depth = _c === void 0 ? false : _c, props = __rest(_a, ["children", "colSpan", "depth"]);
+    return (React.createElement(StyledTableGroupRow, __assign({ ref: ref, "$depth": depth }, props),
+        React.createElement("td", { colSpan: colSpan },
+            React.createElement(StyledTableGroupRowContent, null,
+                React.createElement(StyledTableGroupRowHeader, null, children)))));
+});
+export var BodyRow = React.forwardRef(function BodyRow(_a, ref) {
+    var children = _a.children, _b = _a.overdue, overdue = _b === void 0 ? false : _b, props = __rest(_a, ["children", "overdue"]);
+    return (React.createElement(StyledTableBodyRow, __assign({ ref: ref, "$overdue": overdue }, props), children));
+});
+export var BodyCell = React.forwardRef(function BodyCell(_a, ref) {
+    var children = _a.children, _b = _a.snugfit, snugfit = _b === void 0 ? false : _b, _c = _a.variant, variant = _c === void 0 ? '' : _c, props = __rest(_a, ["children", "snugfit", "variant"]);
+    return (React.createElement(StyledTableBodyCell, __assign({ ref: ref, "$snugfit": snugfit || variant === 'snugfit' }, props), children));
+});
+export var CurrencyCell = React.forwardRef(function CurrencyCell(_a, ref) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (React.createElement(StyledTableCellText, __assign({ "$currency": true, ref: ref }, props), children));
+});
+export var DateSelectCell = React.forwardRef(function DateSelectCell(_a, ref) {
+    var children = _a.children, className = _a.className, _b = _a.disabled, disabled = _b === void 0 ? false : _b, errorMessage = _a.errorMessage, _c = _a.processing, processing = _c === void 0 ? false : _c, props = __rest(_a, ["children", "className", "disabled", "errorMessage", "processing"]);
+    var error = Boolean(errorMessage);
+    return (React.createElement(StyledTableInlineEditContainer, { "$disabled": disabled, "$error": error, "$size": "block", className: cx({ disabled: disabled, error: error }) },
+        processing && (React.createElement(StyledLoadingContainer, null,
+            React.createElement(Spinner, { loading: processing, size: "md" }))),
+        React.createElement(StyledTableCellDateInput, __assign({}, props, { disabled: processing || disabled, ref: ref, variant: error ? 'error' : '' })),
+        !processing && error && (React.createElement(StyledTableInlineEditErrorBox, null, errorMessage))));
+});
+export var IconCell = React.forwardRef(function IconCell(_a, ref) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (React.createElement(StyledIconCell, __assign({ ref: ref }, props), children));
+});
+export var InputCell = React.forwardRef(function InputCell(_a, ref) {
+    var _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.errorMessage, errorMessage = _c === void 0 ? '' : _c, _d = _a.processing, processing = _d === void 0 ? false : _d, _e = _a.size, size = _e === void 0 ? 'block' : _e, // TODO FIX THIS TYPE
+    props = __rest(_a, ["disabled", "errorMessage", "processing", "size"]);
+    var error = Boolean(errorMessage);
+    return (React.createElement(StyledTableInlineEditContainer, { "$disabled": disabled, "$error": error, "$size": size, className: cx({ disabled: disabled, error: error }) },
+        processing && (React.createElement(StyledLoadingContainer, null,
+            React.createElement(Spinner, { loading: processing, size: "md" }))),
+        React.createElement(StyledTableCellInput, __assign({}, props, { ref: ref, disabled: processing || disabled })),
+        !processing && error && (React.createElement(StyledTableInlineEditErrorBox, { "$size": size }, errorMessage))));
+});
+export var LinkCell = React.forwardRef(function LinkCell(_a, ref) {
+    var children = _a.children, _b = _a.href, href = _b === void 0 ? '' : _b, props = __rest(_a, ["children", "href"]);
+    return (React.createElement(TextCell, { ref: ref },
+        React.createElement(LinkElement, __assign({ href: href }, props), children)));
+});
+export var PercentCell = React.forwardRef(function PercentCell(_a, ref) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (React.createElement(StyledTableCellText, __assign({ "$percent": true, ref: ref }, props), children));
+});
+export var SelectCell = React.forwardRef(function SelectCell(_a, ref) {
+    var _b = _a.block, block = _b === void 0 ? true : _b, children = _a.children, disabled = _a.disabled, errorMessage = _a.errorMessage, className = _a.className, _c = _a.processing, processing = _c === void 0 ? false : _c, props = __rest(_a, ["block", "children", "disabled", "errorMessage", "className", "processing"]);
+    var error = Boolean(errorMessage);
+    var hasClearIcon = !disabled && !props.loading && Boolean(props.label);
+    return (React.createElement(StyledTableInlineEditContainer, { "$disabled": disabled, "$error": error, "$size": "block", className: cx({ disabled: disabled, error: error }) },
+        processing && (React.createElement(StyledLoadingContainer, null,
+            React.createElement(Spinner, { loading: processing, size: "md" }))),
+        React.createElement(StyledSelectCellWrapper, null,
+            React.createElement(StyledTableCellSelect, __assign({}, props, { "$placeholder": !props.label, "$hasClearIcon": hasClearIcon, block: block, className: cx(tableSelectClassName, className), disabled: processing || disabled, error: error, ref: ref }), children)),
+        !processing && errorMessage && (React.createElement(StyledTableInlineEditErrorBox, null, errorMessage))));
+});
+export var TextAreaCell = React.forwardRef(function TextAreaCell(_a, ref) {
+    var disabled = _a.disabled, _b = _a.errorMessage, errorMessage = _b === void 0 ? '' : _b, _c = _a.processing, processing = _c === void 0 ? false : _c, _d = _a.resizable, resizable = _d === void 0 ? false : _d, props = __rest(_a, ["disabled", "errorMessage", "processing", "resizable"]);
+    var textareaRef = ref ||
+        React.createRef();
+    var setHeight = function () {
+        if (textareaRef && textareaRef.current) {
+            textareaRef.current.style.height = 'auto';
+            textareaRef.current.style.height = "".concat(textareaRef.current.scrollHeight, "px");
+        }
+    };
+    var error = Boolean(errorMessage);
+    return (React.createElement(StyledTableInlineEditContainer, { "$disabled": disabled, "$error": error, "$size": "block", className: cx({ disabled: disabled, error: error }) },
+        processing && (React.createElement(StyledLoadingContainer, null,
+            React.createElement(Spinner, { loading: processing, size: "md" }))),
+        React.createElement(StyledTableCellTextArea, __assign({}, props, { "$resizable": resizable, disabled: processing || disabled, onBlur: function (event) {
+                setHeight();
+                props.onBlur && props.onBlur(event);
+            }, ref: textareaRef, resize: "none", rows: 1 })),
+        !processing && error && (React.createElement(StyledTableInlineEditErrorBox, null, errorMessage))));
+});
+export var TextCell = React.forwardRef(function TextCell(_a, ref) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (React.createElement(StyledTableCellText, __assign({ ref: ref }, props), children));
+});
+Table_.displayName = 'Table';
+Body.displayName = 'Table.Body';
+BodyCell.displayName = 'Table.BodyCell';
+BodyRow.displayName = 'Table.BodyRow';
+Carat.displayName = 'Table.Carat';
+Checkbox.displayName = 'Table.Checkbox';
+Container.displayName = 'Table.Container';
+CurrencyCell.displayName = 'Table.CurrencyCell';
+DateSelectCell.displayName = 'Table.DateSelect';
+Group.displayName = 'Table.Group';
+GroupTitle.displayName = 'Table.GroupTitle';
+Header.displayName = 'Table.Header';
+HeaderCell.displayName = 'Table.HeaderCell';
+HeaderRow.displayName = 'Table.HeaderRow';
+IconCell.displayName = 'Table.IconCell';
+InputCell.displayName = 'Table.InputCell';
+LinkCell.displayName = 'Table.LinkCell';
+PercentCell.displayName = 'Table.ParentCell';
+TextAreaCell.displayName = 'Table.TextAreaCell';
+TextCell.displayName = 'Table.TextCell';
+/**
+ @see [Storybook](https://procore.github.io/core/latest/?path=/story/demos-table--demo)
+ */
+export var Table = addSubcomponents({
+    Body: Body,
+    BodyCell: BodyCell,
+    BodyRow: BodyRow,
+    Carat: Carat,
+    Checkbox: Checkbox,
+    Container: Container,
+    CurrencyCell: CurrencyCell,
+    DateSelectCell: DateSelectCell,
+    Group: Group,
+    GroupTitle: GroupTitle,
+    Header: Header,
+    HeaderCell: HeaderCell,
+    HeaderRow: HeaderRow,
+    IconCell: IconCell,
+    InputCell: InputCell,
+    LinkCell: LinkCell,
+    PercentCell: PercentCell,
+    SelectCell: SelectCell,
+    TextAreaCell: TextAreaCell,
+    TextCell: TextCell,
+}, Table_);
+//# sourceMappingURL=Table.js.map

package/dist/Table/Table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../src/Table/Table.tsx"],"names":[],"mappings":"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"}

package/dist/Table/Table.styles.d.ts

@@ -0,0 +1,73 @@
+/// <reference types="react" />
+import { InputCellSize, TableCellVariant } from './Table.types';
+export declare const StyledTableHeaderCellContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledTableHeaderCellLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledCheckbox: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../Checkbox").CheckboxProps & import("react").RefAttributes<HTMLInputElement>>, any, {}, never>;
+export declare const StyledTableBodyCell: import("styled-components").StyledComponent<"td", any, {
+    $snugfit: boolean;
+}, never>;
+export declare const StyledTableHeaderCell: import("styled-components").StyledComponent<"th", any, {
+    $sortable: boolean;
+    $variant: TableCellVariant;
+    $snugfit: boolean;
+}, never>;
+export declare const StyledTableHeaderCellIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledTableHeaderCellSortIconAsc: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<{
+    size?: import("@procore/core-icons/dist/Icon").IconSize | undefined;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>, any, {}, never>;
+export declare const StyledTableHeaderCellSortIconDesc: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<{
+    size?: import("@procore/core-icons/dist/Icon").IconSize | undefined;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>, any, {}, never>;
+export declare const StyledHead: import("styled-components").StyledComponent<"thead", any, {}, never>;
+export declare const StyledCaratWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledCarat: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<{
+    size?: import("@procore/core-icons/dist/Icon").IconSize | undefined;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>, any, {
+    $expanded: boolean;
+}, never>;
+export declare const StyledTableCellSelect: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../Select").SelectProps & import("react").RefAttributes<HTMLDivElement>> & {
+    Button: import("react").ForwardRefExoticComponent<import("../Select").SelectButtonProps & import("react").RefAttributes<HTMLDivElement>>;
+    Option: import("react").ForwardRefExoticComponent<import("../Select").SelectOptionProps & import("react").RefAttributes<HTMLDivElement>>;
+    OptGroup: import("react").ForwardRefExoticComponent<import("../_utils/types").Props & import("react").RefAttributes<HTMLDivElement>>;
+}, any, {
+    $hasClearIcon: boolean;
+    $placeholder: boolean;
+}, never>;
+export declare const StyledTableCellInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../_utils/types").InputAttributes & import("../Input").InputProps & import("react").RefAttributes<HTMLInputElement>>, any, {}, never>;
+export declare const StyledTableCellDateInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../DateSelect").DateSelectProps & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
+export declare const StyledTableCellTextArea: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../_utils/types").TextAreaAttributes & import("../TextArea").TextAreaProps & import("react").RefAttributes<HTMLTextAreaElement>>, any, {
+    $resizable: boolean;
+}, never>;
+export declare const StyledTableCellText: import("styled-components").StyledComponent<"div", any, {
+    $percent?: boolean | undefined;
+    $currency?: boolean | undefined;
+}, never>;
+export declare const StyledIconCell: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledSelectCellWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledTableInlineEditErrorBox: import("styled-components").StyledComponent<"div", any, {
+    $size?: InputCellSize | undefined;
+}, never>;
+interface StyledTableInlineEditContainerProps {
+    $disabled?: boolean;
+    $error?: boolean;
+    $size: InputCellSize;
+}
+export declare const StyledTableInlineEditContainer: import("styled-components").StyledComponent<"div", any, StyledTableInlineEditContainerProps, never>;
+export declare const StyledTableBodyRow: import("styled-components").StyledComponent<"tr", any, {
+    $overdue: boolean;
+}, never>;
+export declare const StyledTableGroupRowContent: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledTableGroupRowHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledTableGroupRowTitle: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const StyledTableGroupRow: import("styled-components").StyledComponent<"tr", any, {
+    $depth?: number | boolean | undefined;
+}, never>;
+export declare const StyledTableWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../_utils/types").DivAttributes & import("../Card").CardProps & import("react").RefAttributes<HTMLDivElement>>, any, {
+    $withShelf: boolean;
+}, never>;
+export declare const StyledTable: import("styled-components").StyledComponent<"table", any, {
+    $inline?: boolean | undefined;
+    $fixed: boolean;
+}, never>;
+export declare const StyledLoadingContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export {};

package/dist/Table/Table.styles.js

@@ -0,0 +1,184 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import styled, { css } from 'styled-components';
+import { colors } from '../_styles/colors';
+import { spacing } from '../_styles/spacing';
+import { Card } from '../Card';
+import { Checkbox } from '../Checkbox';
+import { TextArea } from '../TextArea';
+import { DateSelect } from '../DateSelect';
+import { Input } from '../Input';
+import { Select } from '../Select';
+import { CaretDown, CaretUp, ChevronRight } from '@procore/core-icons/dist';
+import { getTypographyIntent, typographyWeights, } from '../Typography/Typography.styles';
+import { getFocus } from '../_styles/mixins';
+import { StyledDateInputDelimiter, StyledDateInputIconContainer, StyledDateInputSegment, } from '../DateInput/DateInput.styles';
+import { StyledSelectArrow, StyledSelectButtonLabel, StyledSelectClearIcon, } from '../Select/Select.styles';
+var tableBgColor = colors.white;
+var tableBorderRadius = 4;
+var tableBorderStyle = 'solid';
+var tableBorderWidth = 1;
+var tableBorderColor = colors.gray85;
+var tableBorder = "".concat(tableBorderWidth, "px ").concat(tableBorderStyle, " ").concat(tableBorderColor);
+var tableGroupRowBgColor = colors.gray98;
+var tableGroupBodyRowIndentation = spacing.md;
+var tableGroupHeaderRowIndentation = spacing.xl;
+var tableHeaderBgColor = colors.gray96;
+var tableHeaderBgColorHover = colors.gray94;
+var tableHeaderBgColorActive = colors.gray94;
+var tableHeaderBorderColor = colors.gray90;
+var tableHeaderBorderRight = "".concat(tableBorderWidth, "px ").concat(tableBorderStyle, " ").concat(tableHeaderBorderColor);
+var tableHeaderFontColor = colors.gray30;
+var tableHeaderFontColorActive = colors.gray15;
+var tableHeaderFontWeight = typographyWeights.semibold;
+var tableHeaderHeight = 48;
+var tableHeaderPadding = spacing.lg;
+var tableSortFontColor = colors.gray70;
+var tableSortFontColorHover = colors.gray45;
+var tableSortFontColorActive = colors.blue50;
+var tableCellTextColor = colors.gray15;
+var tableCellIconColor = colors.gray45;
+var tableCellInputPlaceholderColor = colors.gray70;
+var tableCellInputBorder = '1px solid transparent';
+var tableCellInputRowHoverBgColor = colors.gray96;
+var tableCellInputFocusBgColor = colors.white;
+var tableCellInputHoverBgColor = colors.blue94;
+var tableCellInputFocusBorder = "1px solid ".concat(colors.blue50);
+var tableCellInputErrorBgColor = colors.red98;
+var tableCellInputErrorBorder = "1px solid ".concat(colors.red50);
+var tableRowBorderBottom = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border-bottom: ", ";\n\n  &:last-child {\n    border-bottom: 0;\n  }\n"], ["\n  border-bottom: ", ";\n\n  &:last-child {\n    border-bottom: 0;\n  }\n"])), tableBorder);
+export var StyledTableHeaderCellContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([""], [""])));
+export var StyledTableHeaderCellLabel = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: inline-block;\n  flex: 1 1 auto;\n  position: relative;\n"], ["\n  display: inline-block;\n  flex: 1 1 auto;\n  position: relative;\n"])));
+export var StyledCheckbox = styled(Checkbox)(templateObject_4 || (templateObject_4 = __makeTemplateObject([""], [""])));
+export var StyledTableBodyCell = styled.td(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  position: relative;\n  vertical-align: middle;\n\n  ", "\n"], ["\n  position: relative;\n  vertical-align: middle;\n\n  ", "\n"])), function (_a) {
+    var $snugfit = _a.$snugfit;
+    return $snugfit && css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      white-space: nowrap;\n      width: 0.1%;\n    "], ["\n      white-space: nowrap;\n      width: 0.1%;\n    "])));
+});
+export var StyledTableHeaderCell = styled.th(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  ", "\n  font-weight: ", ";\n  border-right: ", ";\n  color: ", ";\n  height: ", "px;\n  padding: ", "px;\n  position: relative;\n  text-align: left;\n  transition: background-color 0.2s ease-in-out;\n\n  &:last-child {\n    border-right: 0;\n  }\n\n  ", " {\n    display: flex;\n    align-items: center;\n  }\n\n  ", " ", " {\n    min-height: 14px;\n  }\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n"], ["\n  ", "\n  font-weight: ", ";\n  border-right: ", ";\n  color: ", ";\n  height: ", "px;\n  padding: ", "px;\n  position: relative;\n  text-align: left;\n  transition: background-color 0.2s ease-in-out;\n\n  &:last-child {\n    border-right: 0;\n  }\n\n  ", " {\n    display: flex;\n    align-items: center;\n  }\n\n  ", " ", " {\n    min-height: 14px;\n  }\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n"])), getTypographyIntent('small'), tableHeaderFontWeight, tableHeaderBorderRight, tableHeaderFontColor, tableHeaderHeight, tableHeaderPadding, StyledTableHeaderCellContainer, StyledTableHeaderCellContainer, StyledTableHeaderCellLabel, function (_a) {
+    var $sortable = _a.$sortable;
+    return $sortable && css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      cursor: pointer;\n      padding: ", "px;\n\n      ", ",\n      ", " {\n        color: ", ";\n        opacity: 0;\n        transition: all 0.15s ease-in-out;\n        position: absolute;\n      }\n\n      ::before,\n      ::after {\n        font-size: 16px;\n      }\n\n      &:hover {\n        background-color: ", ";\n\n        ", " {\n          color: ", ";\n        }\n      }\n    "], ["\n      cursor: pointer;\n      padding: ", "px;\n\n      ", ",\n      ", " {\n        color: ", ";\n        opacity: 0;\n        transition: all 0.15s ease-in-out;\n        position: absolute;\n      }\n\n      ::before,\n      ::after {\n        font-size: 16px;\n      }\n\n      &:hover {\n        background-color: ", ";\n\n        ", " {\n          color: ", ";\n        }\n      }\n    "])), spacing.lg, StyledTableHeaderCellSortIconAsc, StyledTableHeaderCellSortIconDesc, tableSortFontColor, tableHeaderBgColorHover, StyledTableHeaderCellSortIconAsc, tableSortFontColorHover);
+}, function (_a) {
+    var $variant = _a.$variant;
+    return ($variant === 'asc' || $variant === 'desc') && css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      background-color: ", ";\n      color: ", ";\n\n      &::before,\n      &::after,\n      ", ",\n        ", " {\n        opacity: 1;\n      }\n    "], ["\n      background-color: ", ";\n      color: ", ";\n\n      &::before,\n      &::after,\n      ", ",\n        ", " {\n        opacity: 1;\n      }\n    "])), tableHeaderBgColorActive, tableHeaderFontColorActive, StyledTableHeaderCellSortIconAsc, StyledTableHeaderCellSortIconDesc);
+}, function (_a) {
+    var $variant = _a.$variant;
+    return $variant === 'asc' && css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n      ", ",\n      &::before {\n        color: ", ";\n      }\n\n      &:hover {\n        ", ",\n        &::before {\n          color: ", ";\n        }\n        ", ",\n        &::after {\n          color: ", ";\n        }\n      }\n    "], ["\n      ", ",\n      &::before {\n        color: ", ";\n      }\n\n      &:hover {\n        ", ",\n        &::before {\n          color: ", ";\n        }\n        ", ",\n        &::after {\n          color: ", ";\n        }\n      }\n    "])), StyledTableHeaderCellSortIconAsc, tableSortFontColorActive, StyledTableHeaderCellSortIconAsc, tableSortFontColorActive, StyledTableHeaderCellSortIconDesc, tableSortFontColorHover);
+}, function (_a) {
+    var $variant = _a.$variant;
+    return $variant === 'desc' && css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n      ", ",\n      &::after {\n        color: ", ";\n      }\n\n      &:hover {\n        ", ",\n        &::before {\n          color: ", ";\n        }\n        ", ",\n        &::after {\n          color: ", ";\n        }\n      }\n    "], ["\n      ", ",\n      &::after {\n        color: ", ";\n      }\n\n      &:hover {\n        ", ",\n        &::before {\n          color: ", ";\n        }\n        ", ",\n        &::after {\n          color: ", ";\n        }\n      }\n    "])), StyledTableHeaderCellSortIconDesc, tableSortFontColorActive, StyledTableHeaderCellSortIconAsc, tableSortFontColorHover, StyledTableHeaderCellSortIconDesc, tableSortFontColorActive);
+}, function (_a) {
+    var $variant = _a.$variant, $snugfit = _a.$snugfit;
+    return ($variant === 'snugfit' || $snugfit) && css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n      width: 0.1%;\n    "], ["\n      width: 0.1%;\n    "])));
+});
+export var StyledTableHeaderCellIconWrapper = styled.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  height: 20px;\n  line-height: 20px;\n  padding: 0 ", "px 0 ", "px;\n  width: 20px;\n"], ["\n  height: 20px;\n  line-height: 20px;\n  padding: 0 ", "px 0 ", "px;\n  width: 20px;\n"])), spacing.lg, spacing.sm);
+export var StyledTableHeaderCellSortIconAsc = styled(CaretUp)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  margin-top: -", "px; ;\n"], ["\n  margin-top: -", "px; ;\n"])), spacing.sm);
+export var StyledTableHeaderCellSortIconDesc = styled(CaretDown)(templateObject_15 || (templateObject_15 = __makeTemplateObject([""], [""])));
+export var StyledHead = styled.thead(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  background-color: ", ";\n  transition: background-color 0.2s ease-in-out;\n  ", "\n\n  &:hover {\n    ", " {\n      ", ",\n      ", " {\n        &::after,\n        &::before {\n          opacity: 1;\n        }\n      }\n    }\n  }\n"], ["\n  background-color: ", ";\n  transition: background-color 0.2s ease-in-out;\n  ", "\n\n  &:hover {\n    ", " {\n      ", ",\n      ", " {\n        &::after,\n        &::before {\n          opacity: 1;\n        }\n      }\n    }\n  }\n"])), tableHeaderBgColor, tableRowBorderBottom, StyledTableHeaderCell, StyledTableHeaderCellSortIconAsc, StyledTableHeaderCellSortIconDesc);
+export var StyledCaratWrapper = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  font-size: 16px;\n  color: ", ";\n  padding-right: ", "px;\n  transition: all 0.2s ease-in-out;\n\n  & + ", " {\n    margin: 0 ", "px;\n  }\n"], ["\n  font-size: 16px;\n  color: ", ";\n  padding-right: ", "px;\n  transition: all 0.2s ease-in-out;\n\n  & + ", " {\n    margin: 0 ", "px;\n  }\n"])), colors.gray70, spacing.xs, StyledCheckbox, spacing.xs);
+export var StyledCarat = styled(ChevronRight)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (_a) {
+    var $expanded = _a.$expanded;
+    return $expanded && css(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n      transform: rotate(90deg);\n    "], ["\n      transform: rotate(90deg);\n    "])));
+});
+var cellInputCSS = css(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n  // Define particular color, simply not to rely on browser's choice of transparent value\n  // https://stackoverflow.com/questions/46309641/what-happens-in-safari-with-the-transparent-color\n  background-color: rgba(255, 255, 255, 0);\n\n  &&& {\n    border: ", ";\n    border-radius: 4px;\n    width: 100%;\n\n    &::placeholder {\n      color: ", ";\n    }\n\n    &::-ms-clear {\n      display: none;\n    }\n\n    &:hover {\n      border-color: transparent;\n    }\n\n    &:focus {\n      /**\n        focus background overrides everything, so it is the only cell-defined background style.\n        the rest come from StyledInlineEditContainer\n      */\n      background-color: ", ";\n      border-style: solid;\n      border-width: 1px;\n      border-color: ", ";\n      box-shadow: 0 0 0 1px ", ";\n      outline: none;\n    }\n\n    &:disabled {\n      border: ", ";\n      color: ", ";\n    }\n  }\n"], ["\n  // Define particular color, simply not to rely on browser's choice of transparent value\n  // https://stackoverflow.com/questions/46309641/what-happens-in-safari-with-the-transparent-color\n  background-color: rgba(255, 255, 255, 0);\n\n  &&& {\n    border: ", ";\n    border-radius: 4px;\n    width: 100%;\n\n    &::placeholder {\n      color: ", ";\n    }\n\n    &::-ms-clear {\n      display: none;\n    }\n\n    &:hover {\n      border-color: transparent;\n    }\n\n    &:focus {\n      /**\n        focus background overrides everything, so it is the only cell-defined background style.\n        the rest come from StyledInlineEditContainer\n      */\n      background-color: ", ";\n      border-style: solid;\n      border-width: 1px;\n      border-color: ", ";\n      box-shadow: 0 0 0 1px ", ";\n      outline: none;\n    }\n\n    &:disabled {\n      border: ", ";\n      color: ", ";\n    }\n  }\n"])), tableCellInputBorder, tableCellInputPlaceholderColor, colors.white, colors.blue40, colors.blue40, tableCellInputBorder, colors.gray70);
+export var StyledTableCellSelect = styled(Select)(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n  ", ";\n\n  background-color: transparent;\n  border-color: transparent;\n  height: auto;\n\n  &:hover {\n    background-color: transparent;\n  }\n\n  &:active:hover {\n    border-color: ", ";\n  }\n\n  &:focus {\n    background-color: ", ";\n    cursor: pointer;\n    ", "\n\n    ", " {\n      white-space: nowrap;\n    }\n\n    ", " {\n      opacity: 1;\n      pointer-events: all;\n    }\n\n    ", "\n\n    ", "\n  }\n\n  ", " {\n    white-space: normal;\n  }\n\n  ", ", ", " {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  ", "\n\n  ", "\n"], ["\n  ", ";\n\n  background-color: transparent;\n  border-color: transparent;\n  height: auto;\n\n  &:hover {\n    background-color: transparent;\n  }\n\n  &:active:hover {\n    border-color: ", ";\n  }\n\n  &:focus {\n    background-color: ", ";\n    cursor: pointer;\n    ", "\n\n    ", " {\n      white-space: nowrap;\n    }\n\n    ", " {\n      opacity: 1;\n      pointer-events: all;\n    }\n\n    ", "\n\n    ", "\n  }\n\n  ", " {\n    white-space: normal;\n  }\n\n  ", ", ", " {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  ", "\n\n  ", "\n"])), cellInputCSS, colors.gray85, colors.white, getFocus(), StyledSelectButtonLabel, StyledSelectArrow, function (_a) {
+    var $hasClearIcon = _a.$hasClearIcon;
+    return $hasClearIcon && css(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n        ", " {\n          opacity: 1;\n          pointer-events: all;\n        }\n      "], ["\n        ", " {\n          opacity: 1;\n          pointer-events: all;\n        }\n      "])), StyledSelectClearIcon);
+}, function (_a) {
+    var _b = _a.$placeholder, $placeholder = _b === void 0 ? false : _b;
+    return $placeholder && css(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n        ", " {\n          opacity: 1;\n          pointer-events: all;\n        }\n      "], ["\n        ", " {\n          opacity: 1;\n          pointer-events: all;\n        }\n      "])), StyledSelectButtonLabel);
+}, StyledSelectButtonLabel, StyledSelectArrow, StyledSelectClearIcon, function (_a) {
+    var _b = _a.$placeholder, $placeholder = _b === void 0 ? false : _b;
+    return $placeholder && css(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n      ", " {\n        opacity: 0;\n        pointer-events: none;\n      }\n    "], ["\n      ", " {\n        opacity: 0;\n        pointer-events: none;\n      }\n    "])), StyledSelectButtonLabel);
+}, function (_a) {
+    var loading = _a.loading;
+    return loading && css(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n      background-color: ", ";\n      border-color: ", ";\n\n      ", " {\n        white-space: nowrap;\n      }\n    "], ["\n      background-color: ", ";\n      border-color: ", ";\n\n      ", " {\n        white-space: nowrap;\n      }\n    "])), colors.white, colors.gray85, StyledSelectButtonLabel);
+});
+export var StyledTableCellInput = styled(Input)(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), cellInputCSS);
+export var StyledTableCellDateInput = styled(DateSelect)(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n  background-color: transparent;\n  border-color: transparent;\n\n  &:active:hover {\n    border-color: ", ";\n  }\n\n  // increase specificity to avoid border re-style\n  &&&:focus-within {\n    ", ";\n    background-color: ", ";\n  }\n\n  ", "\n\n  ", " {\n    opacity: 0;\n  }\n\n  ", " {\n    &[data-qa-table-visible='false'] {\n      opacity: 0;\n    }\n  }\n\n  ", " {\n    &[data-placeholder='true'] {\n      opacity: 0;\n    }\n  }\n\n  &:focus-within {\n    ", " {\n      opacity: 1;\n    }\n    ", " {\n      &[data-qa-table-visible='false'] {\n        opacity: 1;\n      }\n    }\n    ", " {\n      &[data-placeholder='true'] {\n        opacity: 1;\n      }\n    }\n  }\n"], ["\n  background-color: transparent;\n  border-color: transparent;\n\n  &:active:hover {\n    border-color: ", ";\n  }\n\n  // increase specificity to avoid border re-style\n  &&&:focus-within {\n    ", ";\n    background-color: ", ";\n  }\n\n  ", "\n\n  ", " {\n    opacity: 0;\n  }\n\n  ", " {\n    &[data-qa-table-visible='false'] {\n      opacity: 0;\n    }\n  }\n\n  ", " {\n    &[data-placeholder='true'] {\n      opacity: 0;\n    }\n  }\n\n  &:focus-within {\n    ", " {\n      opacity: 1;\n    }\n    ", " {\n      &[data-qa-table-visible='false'] {\n        opacity: 1;\n      }\n    }\n    ", " {\n      &[data-placeholder='true'] {\n        opacity: 1;\n      }\n    }\n  }\n"])), colors.gray45, getFocus(), colors.white, function (_a) {
+    var error = _a.error;
+    return error && css(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n      border-color: ", ";\n    "], ["\n      border-color: ", ";\n    "])), colors.red50);
+}, StyledDateInputIconContainer, StyledDateInputDelimiter, StyledDateInputSegment, StyledDateInputIconContainer, StyledDateInputDelimiter, StyledDateInputSegment);
+export var StyledTableCellTextArea = styled(TextArea)(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n  ", "\n  && {\n    height: ", "px;\n    min-height: ", "px;\n    overflow: hidden;\n    padding-top: ", "px;\n    resize: none;\n    width: 100%;\n\n    ", "\n  }\n"], ["\n  ", "\n  && {\n    height: ", "px;\n    min-height: ", "px;\n    overflow: hidden;\n    padding-top: ", "px;\n    resize: none;\n    width: 100%;\n\n    ", "\n  }\n"])), cellInputCSS, spacing.xxl, spacing.xxl, spacing.xs, function (_a) {
+    var $resizable = _a.$resizable;
+    return $resizable && css(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n        &:focus {\n          min-height: 64px;\n          overflow: auto;\n          resize: vertical;\n        }\n      "], ["\n        &:focus {\n          min-height: 64px;\n          overflow: auto;\n          resize: vertical;\n        }\n      "])));
+});
+export var StyledTableCellText = styled.div(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n  margin: ", "px;\n  display: flex;\n  color: ", ";\n\n  ", "\n"], ["\n  margin: ", "px;\n  display: flex;\n  color: ", ";\n\n  ", "\n"])), spacing.lg, tableCellTextColor, function (_a) {
+    var $percent = _a.$percent, $currency = _a.$currency;
+    return ($percent || $currency) && css(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n      justify-content: flex-end;\n    "], ["\n      justify-content: flex-end;\n    "])));
+});
+export var StyledIconCell = styled.div(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n  display: flex;\n  color: ", ";\n"], ["\n  display: flex;\n  color: ", ";\n"])), tableCellIconColor);
+export var StyledSelectCellWrapper = styled.div(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n"], ["\n  display: flex;\n  flex-direction: column;\n"])));
+export var StyledTableInlineEditErrorBox = styled.div(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  ", "\n  color: ", ";\n  font-style: italic;\n  background: ", ";\n  border-radius: 0 2px 2px 2px;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 1px 3px rgba(0, 0, 0, 0.1);\n  padding: 6px ", "px;\n  position: absolute;\n  max-width: 160px;\n  z-index: 1;\n\n  ", "\n"], ["\n  ", "\n  color: ", ";\n  font-style: italic;\n  background: ", ";\n  border-radius: 0 2px 2px 2px;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 1px 3px rgba(0, 0, 0, 0.1);\n  padding: 6px ", "px;\n  position: absolute;\n  max-width: 160px;\n  z-index: 1;\n\n  ", "\n"])), getTypographyIntent('small'), colors.white, colors.red50, spacing.md, function (_a) {
+    var $size = _a.$size;
+    var sizes = {
+        xs: 36,
+        sm: 48,
+        md: 80,
+        lg: 112,
+        block: null,
+        xl: null,
+    };
+    if (!$size || !sizes[$size]) {
+        return '';
+    }
+    return css(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n      min-width: ", "px;\n    "], ["\n      min-width: ", "px;\n    "])), sizes[$size]);
+});
+export var StyledTableInlineEditContainer = styled.div(templateObject_40 || (templateObject_40 = __makeTemplateObject(["\n  background-color: ", ";\n  margin: ", "px ", "px;\n  position: relative;\n\n  ", "\n\n  ", "\n"], ["\n  background-color: ", ";\n  margin: ", "px ", "px;\n  position: relative;\n\n  ", "\n\n  ", "\n"])), tableBgColor, spacing.sm, spacing.xs, function (_a) {
+    var $error = _a.$error;
+    return $error && css(templateObject_37 || (templateObject_37 = __makeTemplateObject(["\n      position: static;\n      background-color: ", ";\n\n      ", ",\n      ", ",\n      ", ",\n      ", " {\n        border: ", ";\n        border-radius: 4px 4px 0 0;\n        border-bottom: none;\n\n        &:hover {\n          border-bottom: none;\n        }\n\n        &:focus {\n          background-color: ", ";\n          border: ", ";\n          border-bottom: none;\n        }\n      }\n    "], ["\n      position: static;\n      background-color: ", ";\n\n      ", ",\n      ", ",\n      ", ",\n      ", " {\n        border: ", ";\n        border-radius: 4px 4px 0 0;\n        border-bottom: none;\n\n        &:hover {\n          border-bottom: none;\n        }\n\n        &:focus {\n          background-color: ", ";\n          border: ", ";\n          border-bottom: none;\n        }\n      }\n    "])), tableCellInputErrorBgColor, StyledTableCellDateInput, StyledTableCellInput, StyledTableCellSelect, StyledTableCellTextArea, tableCellInputErrorBorder, tableCellInputFocusBgColor, tableCellInputFocusBorder);
+}, function (_a) {
+    var $size = _a.$size;
+    var sizes = {
+        xs: 36,
+        sm: 48,
+        md: 80,
+        lg: 112,
+        block: null,
+        xl: null,
+    };
+    if ($size === 'block') {
+        return css(templateObject_38 || (templateObject_38 = __makeTemplateObject(["\n        position: relative;\n\n        ", " {\n          width: 100%;\n          max-width: 100%;\n        }\n      "], ["\n        position: relative;\n\n        ", " {\n          width: 100%;\n          max-width: 100%;\n        }\n      "])), StyledTableInlineEditErrorBox);
+    }
+    if (!$size || !sizes[$size]) {
+        return '';
+    }
+    return css(templateObject_39 || (templateObject_39 = __makeTemplateObject(["\n      width: ", "px;\n    "], ["\n      width: ", "px;\n    "])), sizes[$size]);
+});
+export var StyledTableBodyRow = styled.tr(templateObject_42 || (templateObject_42 = __makeTemplateObject(["\n  ", "\n\n  ", "\n\n  &:focus-within {\n    ", " {\n      background-color: ", ";\n\n      &.disabled {\n        background-color: transparent;\n      }\n    }\n    ", ".error {\n      background-color: ", ";\n    }\n  }\n\n  &:hover {\n    ", " {\n      background-color: ", ";\n      cursor: pointer;\n\n      &:hover {\n        background-color: ", ";\n      }\n\n      &.disabled {\n        &,\n        &:hover {\n          background-color: transparent;\n          cursor: default;\n        }\n      }\n    }\n\n    ", ".error {\n      background-color: ", ";\n\n      &:hover {\n        background-color: ", ";\n      }\n\n      ", ",\n      ", ",\n      ", " {\n        border: ", ";\n        border-bottom: none;\n\n        &:hover {\n          border-bottom: none;\n        }\n\n        &:focus {\n          border: ", ";\n          border-bottom: none;\n        }\n      }\n    }\n  }\n"], ["\n  ", "\n\n  ", "\n\n  &:focus-within {\n    ", " {\n      background-color: ", ";\n\n      &.disabled {\n        background-color: transparent;\n      }\n    }\n    ", ".error {\n      background-color: ", ";\n    }\n  }\n\n  &:hover {\n    ", " {\n      background-color: ", ";\n      cursor: pointer;\n\n      &:hover {\n        background-color: ", ";\n      }\n\n      &.disabled {\n        &,\n        &:hover {\n          background-color: transparent;\n          cursor: default;\n        }\n      }\n    }\n\n    ", ".error {\n      background-color: ", ";\n\n      &:hover {\n        background-color: ", ";\n      }\n\n      ", ",\n      ", ",\n      ", " {\n        border: ", ";\n        border-bottom: none;\n\n        &:hover {\n          border-bottom: none;\n        }\n\n        &:focus {\n          border: ", ";\n          border-bottom: none;\n        }\n      }\n    }\n  }\n"])), tableRowBorderBottom, function (_a) {
+    var $overdue = _a.$overdue;
+    return $overdue && css(templateObject_41 || (templateObject_41 = __makeTemplateObject(["\n      ", ",\n      ", ",\n      ", ",\n      ", ",\n      ", " {\n        color: ", ";\n      }\n    "], ["\n      ", ",\n      ", ",\n      ", ",\n      ", ",\n      ", " {\n        color: ", ";\n      }\n    "])), StyledTableCellText, StyledTableCellSelect, StyledTableCellInput, StyledTableCellDateInput, StyledTableCellTextArea, colors.red50);
+}, StyledTableInlineEditContainer, tableCellInputRowHoverBgColor, StyledTableInlineEditContainer, tableCellInputErrorBgColor, StyledTableInlineEditContainer, tableCellInputRowHoverBgColor, tableCellInputHoverBgColor, StyledTableInlineEditContainer, tableCellInputErrorBgColor, tableCellInputErrorBgColor, StyledTableCellInput, StyledTableCellSelect, StyledTableCellTextArea, tableCellInputErrorBorder, tableCellInputFocusBorder);
+export var StyledTableGroupRowContent = styled.div(templateObject_43 || (templateObject_43 = __makeTemplateObject([""], [""])));
+export var StyledTableGroupRowHeader = styled.div(templateObject_44 || (templateObject_44 = __makeTemplateObject([""], [""])));
+export var StyledTableGroupRowTitle = styled.span(templateObject_45 || (templateObject_45 = __makeTemplateObject([""], [""])));
+export var StyledTableGroupRow = styled.tr(templateObject_47 || (templateObject_47 = __makeTemplateObject(["\n  background-color: ", ";\n  ", "\n\n  ", " {\n    margin-left: ", "px;\n    padding: ", "px 0;\n    display: flex;\n    flex-direction: row;\n  }\n\n  ", " {\n    display: flex;\n    align-items: center;\n  }\n\n  ", " {\n    font-weight: ", ";\n    padding-left: ", "px;\n  }\n\n  ", "\n"], ["\n  background-color: ", ";\n  ", "\n\n  ", " {\n    margin-left: ", "px;\n    padding: ", "px 0;\n    display: flex;\n    flex-direction: row;\n  }\n\n  ", " {\n    display: flex;\n    align-items: center;\n  }\n\n  ", " {\n    font-weight: ", ";\n    padding-left: ", "px;\n  }\n\n  ", "\n"])), tableGroupRowBgColor, tableRowBorderBottom, StyledTableGroupRowContent, spacing.lg, spacing.lg, StyledTableGroupRowHeader, StyledTableGroupRowTitle, tableHeaderFontWeight, spacing.lg, function (_a) {
+    var $depth = _a.$depth;
+    if (typeof $depth !== 'number') {
+        return '';
+    }
+    return css(templateObject_46 || (templateObject_46 = __makeTemplateObject(["\n      > td {\n        padding-left: ", "px !important;\n      }\n\n      ~ ", " {\n        > td:first-child {\n          padding-left: ", "px !important;\n        }\n      }\n    "], ["\n      > td {\n        padding-left: ", "px !important;\n      }\n\n      ~ ", " {\n        > td:first-child {\n          padding-left: ", "px !important;\n        }\n      }\n    "])), $depth * tableGroupHeaderRowIndentation, StyledTableBodyRow, ($depth + 1) * tableGroupHeaderRowIndentation +
+        tableGroupBodyRowIndentation);
+});
+export var StyledTableWrapper = styled(Card)(templateObject_49 || (templateObject_49 = __makeTemplateObject(["\n  border-radius: ", "px;\n  border: ", ";\n\n  ", ", tbody {\n    &:first-child {\n      tr:first-child {\n        ", ", td {\n          &:first-child {\n            border-top-left-radius: ", "px;\n          }\n\n          &:last-child {\n            border-top-right-radius: ", "px;\n          }\n        }\n      }\n    }\n\n    &:last-child {\n      tr:last-child {\n        ", ", td {\n          &:first-child {\n            border-bottom-left-radius: ", "px;\n          }\n          &:last-child {\n            border-bottom-right-radius: ", "px;\n          }\n        }\n      }\n    }\n  }\n\n  ", "\n"], ["\n  border-radius: ", "px;\n  border: ", ";\n\n  ", ", tbody {\n    &:first-child {\n      tr:first-child {\n        ", ", td {\n          &:first-child {\n            border-top-left-radius: ", "px;\n          }\n\n          &:last-child {\n            border-top-right-radius: ", "px;\n          }\n        }\n      }\n    }\n\n    &:last-child {\n      tr:last-child {\n        ", ", td {\n          &:first-child {\n            border-bottom-left-radius: ", "px;\n          }\n          &:last-child {\n            border-bottom-right-radius: ", "px;\n          }\n        }\n      }\n    }\n  }\n\n  ", "\n"])), tableBorderRadius, tableBorder, StyledHead, StyledTableHeaderCell, tableBorderRadius, tableBorderRadius, StyledTableHeaderCell, tableBorderRadius, tableBorderRadius, function (_a) {
+    var $withShelf = _a.$withShelf;
+    return $withShelf && css(templateObject_48 || (templateObject_48 = __makeTemplateObject(["\n      position: relative;\n      height: 100%;\n    "], ["\n      position: relative;\n      height: 100%;\n    "])));
+});
+var BodyRow = StyledTableBodyRow;
+var GroupRow = StyledTableGroupRow;
+export var StyledTable = styled.table(templateObject_52 || (templateObject_52 = __makeTemplateObject(["\n  background-color: ", ";\n  border-collapse: collapse;\n  border-radius: ", "px;\n  ", "\n  width: 100%;\n\n  td:first-child ", " {\n    padding-left: ", "px;\n  }\n\n  ", " ", " + ", " {\n    margin-left: ", "px;\n    padding-left: 0;\n  }\n\n  ", "\n\n  ", "\n\n  ", " + ", " > td {\n    padding-left: ", "px;\n  }\n\n  ", " + ", " + ", " > td {\n    padding-left: ", "px;\n  }\n\n  ", " + ", " + ", " + ", " > td {\n    padding-left: ", "px;\n  }\n\n  ", " + ", " + ", " + ", " + ", " > td {\n    padding-left: ", "px;\n  }\n\n  ", " ~ ", " {\n    ", " {\n      padding-left: 0;\n      margin: 0 ", "px;\n    }\n\n    & > td:first-child {\n      padding-left: ", "px;\n    }\n  }\n\n  ", " + ", " ~ ", " {\n    & > td:first-child {\n      padding-left: ", "px;\n    }\n  }\n\n  ", " + ", " + ", " ~ ", " {\n    & > td:first-child {\n      padding-left: ", "px;\n    }\n  }\n\n  ", " + ", " + ", " + ", " ~ ", " {\n    & > td:first-child {\n      padding-left: ", "px;\n    }\n  }\n\n  ", " + ", " + ", " + ", " + ", " ~ ", " {\n    & > td:first-child {\n      padding-left: ", "px;\n    }\n  }\n"], ["\n  background-color: ", ";\n  border-collapse: collapse;\n  border-radius: ", "px;\n  ", "\n  width: 100%;\n\n  td:first-child ", " {\n    padding-left: ", "px;\n  }\n\n  ", " ", " + ", " {\n    margin-left: ", "px;\n    padding-left: 0;\n  }\n\n  ", "\n\n  ", "\n\n  ", " + ", " > td {\n    padding-left: ", "px;\n  }\n\n  ", " + ", " + ", " > td {\n    padding-left: ", "px;\n  }\n\n  ", " + ", " + ", " + ", " > td {\n    padding-left: ", "px;\n  }\n\n  ", " + ", " + ", " + ", " + ", " > td {\n    padding-left: ", "px;\n  }\n\n  ", " ~ ", " {\n    ", " {\n      padding-left: 0;\n      margin: 0 ", "px;\n    }\n\n    & > td:first-child {\n      padding-left: ", "px;\n    }\n  }\n\n  ", " + ", " ~ ", " {\n    & > td:first-child {\n      padding-left: ", "px;\n    }\n  }\n\n  ", " + ", " + ", " ~ ", " {\n    & > td:first-child {\n      padding-left: ", "px;\n    }\n  }\n\n  ", " + ", " + ", " + ", " ~ ", " {\n    & > td:first-child {\n      padding-left: ", "px;\n    }\n  }\n\n  ", " + ", " + ", " + ", " + ", " ~ ", " {\n    & > td:first-child {\n      padding-left: ", "px;\n    }\n  }\n"])), tableBgColor, tableBorderRadius, getTypographyIntent('body'), StyledCheckbox, spacing.lg, StyledTableGroupRow, StyledCaratWrapper, StyledCheckbox, spacing.xs, function (_a) {
+    var $fixed = _a.$fixed;
+    return $fixed && css(templateObject_50 || (templateObject_50 = __makeTemplateObject(["\n      table-layout: fixed;\n    "], ["\n      table-layout: fixed;\n    "])));
+}, function (_a) {
+    var $inline = _a.$inline;
+    return $inline && css(templateObject_51 || (templateObject_51 = __makeTemplateObject(["\n      border-top: 1px solid ", ";\n      border-bottom: 1px solid ", ";\n    "], ["\n      border-top: 1px solid ", ";\n      border-bottom: 1px solid ", ";\n    "])), colors.gray85, colors.gray85);
+}, GroupRow, GroupRow, tableGroupHeaderRowIndentation, GroupRow, GroupRow, GroupRow, 2 * tableGroupHeaderRowIndentation, GroupRow, GroupRow, GroupRow, GroupRow, 3 * tableGroupHeaderRowIndentation, GroupRow, GroupRow, GroupRow, GroupRow, GroupRow, 4 * tableGroupHeaderRowIndentation, GroupRow, BodyRow, StyledCheckbox, spacing.xs, tableGroupHeaderRowIndentation +
+    tableGroupBodyRowIndentation, GroupRow, GroupRow, BodyRow, 2 * tableGroupHeaderRowIndentation +
+    tableGroupBodyRowIndentation, GroupRow, GroupRow, GroupRow, BodyRow, 3 * tableGroupHeaderRowIndentation +
+    tableGroupBodyRowIndentation, GroupRow, GroupRow, GroupRow, GroupRow, BodyRow, 4 * tableGroupHeaderRowIndentation +
+    tableGroupBodyRowIndentation, GroupRow, GroupRow, GroupRow, GroupRow, GroupRow, BodyRow, 5 * tableGroupHeaderRowIndentation +
+    tableGroupBodyRowIndentation);
+export var StyledLoadingContainer = styled.div(templateObject_53 || (templateObject_53 = __makeTemplateObject(["\n  cursor: default;\n  align-items: center;\n  background: ", ";\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  opacity: 0.9;\n  position: absolute;\n  width: 100%;\n  z-index: 2;\n"], ["\n  cursor: default;\n  align-items: center;\n  background: ", ";\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  opacity: 0.9;\n  position: absolute;\n  width: 100%;\n  z-index: 2;\n"])), colors.gray96);
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43, templateObject_44, templateObject_45, templateObject_46, templateObject_47, templateObject_48, templateObject_49, templateObject_50, templateObject_51, templateObject_52, templateObject_53;
+//# sourceMappingURL=Table.styles.js.map