@coreui/react-pro/dist/cjs/components/time-picker/CTimePickerRollCol.js

UI Components Library for React.js

'use strict';

var React = require('react');
var PropTypes = require('prop-types');
var index = require('../../node_modules/classnames/index.js');
var useForkedRef = require('../../hooks/useForkedRef.js');
var useIsVisible = require('../../hooks/useIsVisible.js');
require('@popperjs/core');

var CTimePickerRollCol = React.forwardRef(function (_a, ref) {
    var elements = _a.elements, onClick = _a.onClick, selected = _a.selected;
    var init = React.useRef(true);
    var colRef = React.useRef(null);
    var forkedRef = useForkedRef.useForkedRef(ref, colRef);
    var isVisible = useIsVisible.useIsVisible(colRef);
    React.useEffect(function () {
        var _a, _b;
        var nodeEl = (_a = colRef.current) === null || _a === void 0 ? void 0 : _a.querySelector('.selected');
        if (isVisible && nodeEl && nodeEl instanceof HTMLElement) {
            (_b = colRef.current) === null || _b === void 0 ? void 0 : _b.scrollTo({
                top: nodeEl.offsetTop,
                behavior: init.current ? 'auto' : 'smooth',
            });
        }
        if (isVisible) {
            init.current = false;
        }
    }, [isVisible, selected]);
    var handleKeyDown = function (event, value) {
        if (event.code === 'Space' || event.key === 'Enter') {
            event.preventDefault();
            onClick && onClick(value);
        }
    };
    return (React.createElement("div", { className: "time-picker-roll-col", ref: forkedRef }, elements.map(function (element, index$1) {
        return (React.createElement("div", { className: index.default('time-picker-roll-cell', {
                selected: element.value === selected,
            }), key: index$1, onClick: function () { return onClick && onClick(element.value); }, onKeyDown: function (event) { return handleKeyDown(event, element.value); }, role: "button", tabIndex: 0 }, element.label));
    })));
});
CTimePickerRollCol.propTypes = {
    elements: PropTypes.array.isRequired,
    onClick: PropTypes.func,
    selected: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
};
CTimePickerRollCol.displayName = 'CTimePickerRollCol';

exports.CTimePickerRollCol = CTimePickerRollCol;
//# sourceMappingURL=CTimePickerRollCol.js.map