@hitachivantara/uikit-react-core
Version:
Core React components for the NEXT Design System.
205 lines (204 loc) • 6.69 kB
JavaScript
;
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const react = require("@emotion/react");
const icons = require("../../icons.cjs");
const setId = require("../../utils/setId.cjs");
const DateColumnCell = require("./DateColumnCell.cjs");
const DropdownColumnCell = require("./DropdownColumnCell.cjs");
const ProgressColumnCell = require("./ProgressColumnCell.cjs");
const SwitchColumnCell = require("./SwitchColumnCell.cjs");
const Button = require("../../Button/Button.cjs");
const Tag = require("../../Tag/Tag.cjs");
const OverflowTooltip = require("../../OverflowTooltip/OverflowTooltip.cjs");
const Typography = require("../../Typography/Typography.cjs");
const EM_DASH = "—";
const hvStringFallback = (value) => {
return typeof value === "string" && value !== "" ? value : EM_DASH;
};
const hvNumberFallback = (value) => {
return typeof value === "number" ? value : EM_DASH;
};
const hvNodeFallback = (value) => {
if (!value) return EM_DASH;
return hvStringFallback(value?.toString()) === EM_DASH ? EM_DASH : value;
};
function hvTextColumn(col, overflowTooltipProps = {}) {
return {
Cell: ({ value }) => /* @__PURE__ */ jsxRuntime.jsx(
OverflowTooltip.HvOverflowTooltip,
{
data: hvStringFallback(value),
...overflowTooltipProps
}
),
sortType: "alphanumeric",
...col
};
}
function hvNumberColumn(col) {
return {
Cell: ({ value }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: hvNumberFallback(value) }),
align: "right",
sortType: "number",
...col
};
}
function hvDateColumn(col, dateFormat) {
return {
Cell: ({ value }) => /* @__PURE__ */ jsxRuntime.jsx(DateColumnCell.HvDateColumnCell, { date: value, dateFormat }),
sortType: "alphanumeric",
sortDescFirst: true,
...col
};
}
function hvExpandColumn(col, expandRowButtonAriaLabel, collapseRowButtonAriaLabel, getCanRowExpand, ExpandedIcon = /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "CaretDown", size: "xs", rotate: true }), CollapsedIcon = /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "CaretDown", size: "xs" })) {
return {
Cell: (cellProps) => {
const { value, row } = cellProps;
const expandedProps = row.getToggleRowExpandedProps?.();
const hasContent = getCanRowExpand?.(row) ?? true;
return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, { children: ({ css }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
hasContent && /* @__PURE__ */ jsxRuntime.jsx(
Button.HvButton,
{
icon: true,
"aria-label": row.isExpanded ? collapseRowButtonAriaLabel : expandRowButtonAriaLabel,
"aria-expanded": row.isExpanded,
onClick: expandedProps?.onClick,
classes: {
root: css({
position: "absolute",
left: 0,
top: "50%",
transform: "translateY(-50%)"
})
},
children: row.isExpanded ? ExpandedIcon : CollapsedIcon
}
),
/* @__PURE__ */ jsxRuntime.jsx(OverflowTooltip.HvOverflowTooltip, { data: hvStringFallback(value) })
] }) });
},
sortType: "alphanumeric",
cellStyle: {
position: "relative"
},
...col
};
}
function hvTagColumn(col, valueDataKey, colorDataKey, textColorDataKey, fromRowData = false, tagProps) {
return {
Cell: (cellProps) => {
const { value, row } = cellProps;
if (!value) {
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: "—" });
}
const {
[valueDataKey]: name,
[colorDataKey]: color,
[textColorDataKey]: textColor
} = fromRowData ? row.original : value;
return /* @__PURE__ */ jsxRuntime.jsx(
Tag.HvTag,
{
label: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { variant: "body", children: name }),
type: "semantic",
color,
style: textColor != null ? { color: textColor } : {},
tabIndex: -1,
...tagProps
}
);
},
cellStyle: {
paddingTop: 0,
paddingBottom: 0
},
...col
};
}
function hvSwitchColumn(col, switchLabel, falseLabel, trueLabel, switchProps) {
return {
Cell: (cellProps) => {
const { value, row } = cellProps;
return /* @__PURE__ */ jsxRuntime.jsx(
SwitchColumnCell.HvSwitchColumnCell,
{
checked: value,
value: row.id,
switchLabel,
falseLabel,
trueLabel,
switchProps
}
);
},
cellStyle: {
paddingTop: 0,
paddingBottom: 0
},
...col
};
}
function hvDropdownColumn(col, id, placeholder, disabledPlaceholder, onChange, dropdownProps) {
return {
Cell: (cellProps) => {
const { value, row, column } = cellProps;
const disabled = !Array.isArray(value) || Array.isArray(value) && value.length < 1;
return /* @__PURE__ */ jsxRuntime.jsx(
DropdownColumnCell.HvDropdownColumnCell,
{
values: value,
placeholder: disabled ? disabledPlaceholder : placeholder,
onChange: (val) => onChange?.(row.id, val),
disabled,
"aria-labelledby": setId.setId(id, column.id) || column.id || id,
...dropdownProps
}
);
},
cellStyle: {
paddingTop: 0,
paddingBottom: 0
},
...col
};
}
function hvProgressColumn(col, getPartial, getTotal, color) {
return {
Cell: (cellProps) => {
const { row, column } = cellProps;
const partial = getPartial?.(row) || 0;
const total = getTotal?.(row);
if (total) {
return /* @__PURE__ */ jsxRuntime.jsx(
ProgressColumnCell.HvProgressColumnCell,
{
partial,
total,
color,
"aria-labelledby": column.id
}
);
}
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: "—" });
},
cellStyle: {
paddingTop: 0,
paddingBottom: 0
},
...col
};
}
exports.hvDateColumn = hvDateColumn;
exports.hvDropdownColumn = hvDropdownColumn;
exports.hvExpandColumn = hvExpandColumn;
exports.hvNodeFallback = hvNodeFallback;
exports.hvNumberColumn = hvNumberColumn;
exports.hvNumberFallback = hvNumberFallback;
exports.hvProgressColumn = hvProgressColumn;
exports.hvStringFallback = hvStringFallback;
exports.hvSwitchColumn = hvSwitchColumn;
exports.hvTagColumn = hvTagColumn;
exports.hvTextColumn = hvTextColumn;