@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
76 lines (75 loc) • 2.87 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.MultiSelectionTrigger = MultiSelectionTrigger;
var _clsx = require("clsx");
var _index = require("../../../../components/index.js");
var _componentHelper = require("../../../../shared/component-helper.js");
var _jsxRuntime = require("react/jsx-runtime");
var _span;
function MultiSelectionTrigger({
id,
active,
disabled,
displayCount,
totalCount,
formatSelectionCount,
onKeyDown,
triggerProps = {}
}) {
const selectionCountId = `${id}-selection-count`;
const {
className: triggerClassName,
onKeyDown: triggerKeyDown,
...restTriggerProps
} = triggerProps;
return (0, _jsxRuntime.jsx)("span", {
className: (0, _clsx.clsx)('dnb-dropdown', 'dnb-dropdown--stretch', 'dnb-dropdown--default', 'dnb-dropdown--right', 'dnb-dropdown--icon-position-right', 'dnb-dropdown--vertical', 'dnb-form-component', active && 'dnb-dropdown--open'),
children: (0, _jsxRuntime.jsx)("span", {
className: "dnb-dropdown__inner",
children: (0, _jsxRuntime.jsx)("span", {
className: "dnb-dropdown__row",
children: (0, _jsxRuntime.jsx)("span", {
className: "dnb-dropdown__shell",
children: (0, _jsxRuntime.jsx)(_index.Button, {
variant: "secondary",
size: "medium",
role: "combobox",
"aria-haspopup": "listbox",
...restTriggerProps,
className: (0, _clsx.clsx)('dnb-dropdown__trigger', triggerClassName),
disabled: disabled,
customContent: (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
children: [(0, _jsxRuntime.jsx)("span", {
"aria-hidden": "true",
className: "dnb-dropdown__text dnb-button__text",
children: (0, _jsxRuntime.jsx)("span", {
className: "dnb-dropdown__text__inner",
children: formatSelectionCount(displayCount, totalCount)
})
}), (0, _jsxRuntime.jsx)("span", {
id: selectionCountId,
className: "dnb-sr-only",
children: formatSelectionCount(displayCount, totalCount)
}), _span || (_span = (0, _jsxRuntime.jsx)("span", {
"aria-hidden": true,
className: "dnb-dropdown__icon",
children: (0, _jsxRuntime.jsx)(_index.IconPrimary, {
icon: "chevron_down"
})
}))]
}),
"aria-describedby": (0, _componentHelper.combineDescribedBy)(restTriggerProps, selectionCountId),
onKeyDown: event => {
onKeyDown?.(event);
triggerKeyDown?.(event);
},
id: id
})
})
})
})
});
}
//# sourceMappingURL=MultiSelectionTrigger.js.map