@1771technologies/lytenyte-pro
Version:
Blazingly fast headless React data grid with 100s of features.
22 lines (21 loc) • 1.01 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { forwardRef, memo } from "react";
import { useSlot } from "../../hooks/use-slot/index.js";
import { usePillRow } from "./pill-row.context.js";
import { CollapseIcon, ExpandIcon, Icon } from "./icons.js";
function PillRowExpanderBase({ render, ...props }, forwarded) {
const { expandToggle, expanded, row } = usePillRow();
const expander = render ?? (_jsx("div", { "data-ln-pill-expander": true, children: _jsx("button", { "data-ln-button": "secondary", "data-ln-size": "md", "data-ln-expanded": expanded, "data-ln-icon": true, onClick: () => expandToggle(), children: _jsx(Icon, { children: expanded ? _jsx(CollapseIcon, {}) : _jsx(ExpandIcon, {}) }) }) }));
const slot = useSlot({
props: [props],
slot: expander,
ref: forwarded,
state: {
expanded,
expandToggle,
row,
},
});
return slot;
}
export const PillRowExpander = memo(forwardRef(PillRowExpanderBase));