UNPKG

@ozen-ui/kit

Version:

React component library

36 lines (35 loc) 2.37 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.DataListCardItem = exports.cnDataListCardItem = void 0; var tslib_1 = require("tslib"); var react_1 = tslib_1.__importStar(require("react")); var icons_1 = require("@ozen-ui/icons"); var useMultiRef_1 = require("../../../../hooks/useMultiRef"); var useThemeProps_1 = require("../../../../hooks/useThemeProps"); var classname_1 = require("../../../../utils/classname"); var polymorphicComponentWithRef_1 = require("../../../../utils/polymorphicComponentWithRef"); var DataListBase_1 = require("../../../DataListBase"); var hooks_1 = require("../../../DataListBase/hooks"); var ListCardItem_1 = require("../../../ListCardItem"); exports.cnDataListCardItem = (0, classname_1.cn)('DataListCardItem'); exports.DataListCardItem = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (inProps, ref) { var props = (0, useThemeProps_1.useThemeProps)({ props: inProps, name: 'DataListCardItem', }); var children = props.children, listId = props.listId, disabledProp = props.disabled, as = props.as, className = props.className, onClickProp = props.onClick, other = tslib_1.__rest(props, ["children", "listId", "disabled", "as", "className", "onClick"]); var internalRef = (0, react_1.useRef)(null); var _a = (0, hooks_1.useAsDataListBaseItem)({ ref: internalRef, optionId: listId, disabled: disabledProp, }), focused = _a.focused, selected = _a.selected, onClick = _a.onClick, disabled = _a.disabled; return (react_1.default.createElement(ListCardItem_1.ListCardItem, tslib_1.__assign({ ref: (0, useMultiRef_1.useMultiRef)([ref, internalRef]), role: "option", className: (0, exports.cnDataListCardItem)({ focused: focused, selected: selected, }, [className]), as: as, "aria-selected": selected, "aria-disabled": disabled, onClick: function (event) { onClickProp === null || onClickProp === void 0 ? void 0 : onClickProp(event); onClick(event); }, control: selected && (react_1.default.createElement(ListCardItem_1.ListCardItemControlIcon, { className: (0, exports.cnDataListCardItem)('CheckIcon'), icon: icons_1.CheckIcon })) }, other), children)); }); exports.DataListCardItem.displayName = DataListBase_1.DATA_LIST_BASE_ITEM_DISPLAY_NAME;