@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
77 lines (76 loc) • 3.05 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.MultiSelectionTrigger = MultiSelectionTrigger;
var _clsx = _interopRequireDefault(require("clsx"));
var _index = require("../../../../components/index.js");
var _componentHelper = require("../../../../shared/component-helper.js");
var _jsxRuntime = require("react/jsx-runtime");
var _span;
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
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: "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.default)('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 === null || onKeyDown === void 0 || onKeyDown(event);
triggerKeyDown === null || triggerKeyDown === void 0 || triggerKeyDown(event);
},
id: id
})
})
})
})
});
}
//# sourceMappingURL=MultiSelectionTrigger.js.map