"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); var _typeof3 = require("@babel/runtime/helpers/typeof"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray")); var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties")); var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2")); var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof")); var React = _interopRequireWildcard(require("react")); var _classnames = _interopRequireDefault(require("classnames")); var _useMergedState3 = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState")); var _ref2 = require("rc-util/lib/ref"); var _omit = _interopRequireDefault(require("rc-util/lib/omit")); var _MotionThumb = _interopRequireDefault(require("./MotionThumb")); var _excluded = ["prefixCls", "direction", "options", "disabled", "defaultValue", "value", "onChange", "className", "motionName"]; function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } function getValidTitle(option) { if (typeof option.title !== 'undefined') { return option.title; } // read `label` when title is `undefined` if ((0, _typeof2.default)(option.label) !== 'object') { var _option$label; return (_option$label = option.label) === null || _option$label === void 0 ? void 0 : _option$label.toString(); } } function normalizeOptions(options) { return options.map(function (option) { if ((0, _typeof2.default)(option) === 'object' && option !== null) { var validTitle = getValidTitle(option); return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, option), {}, { title: validTitle }); } return { label: option === null || option === void 0 ? void 0 : option.toString(), title: option === null || option === void 0 ? void 0 : option.toString(), value: option }; }); } var InternalSegmentedOption = function InternalSegmentedOption(_ref) { var prefixCls = _ref.prefixCls, className = _ref.className, disabled = _ref.disabled, checked = _ref.checked, label = _ref.label, title = _ref.title, value = _ref.value, onChange = _ref.onChange; var handleChange = function handleChange(event) { if (disabled) { return; } onChange(event, value); }; return /*#__PURE__*/React.createElement("label", { className: (0, _classnames.default)(className, (0, _defineProperty2.default)({}, "".concat(prefixCls, "-item-disabled"), disabled)) }, /*#__PURE__*/React.createElement("input", { className: "".concat(prefixCls, "-item-input"), type: "radio", disabled: disabled, checked: checked, onChange: handleChange }), /*#__PURE__*/React.createElement("div", { className: "".concat(prefixCls, "-item-label"), title: title }, label)); }; var Segmented = /*#__PURE__*/React.forwardRef(function (props, ref) { var _segmentedOptions$, _classNames2; var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? 'rc-segmented' : _props$prefixCls, direction = props.direction, options = props.options, disabled = props.disabled, defaultValue = props.defaultValue, value = props.value, onChange = props.onChange, _props$className = props.className, className = _props$className === void 0 ? '' : _props$className, _props$motionName = props.motionName, motionName = _props$motionName === void 0 ? 'thumb-motion' : _props$motionName, restProps = (0, _objectWithoutProperties2.default)(props, _excluded); var containerRef = React.useRef(null); var mergedRef = React.useMemo(function () { return (0, _ref2.composeRef)(containerRef, ref); }, [containerRef, ref]); var segmentedOptions = React.useMemo(function () { return normalizeOptions(options); }, [options]); // Note: We should not auto switch value when value not exist in options // which may break single source of truth. var _useMergedState = (0, _useMergedState3.default)((_segmentedOptions$ = segmentedOptions[0]) === null || _segmentedOptions$ === void 0 ? void 0 : _segmentedOptions$.value, { value: value, defaultValue: defaultValue }), _useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2), rawValue = _useMergedState2[0], setRawValue = _useMergedState2[1]; // ======================= Change ======================== var _React$useState = React.useState(false), _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2), thumbShow = _React$useState2[0], setThumbShow = _React$useState2[1]; var handleChange = function handleChange(event, val) { if (disabled) { return; } setRawValue(val); onChange === null || onChange === void 0 ? void 0 : onChange(val); }; var divProps = (0, _omit.default)(restProps, ['children']); return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, divProps, { className: (0, _classnames.default)(prefixCls, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-rtl"), direction === 'rtl'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), _classNames2), className), ref: mergedRef }), /*#__PURE__*/React.createElement("div", { className: "".concat(prefixCls, "-group") }, /*#__PURE__*/React.createElement(_MotionThumb.default, { prefixCls: prefixCls, value: rawValue, containerRef: containerRef, motionName: "".concat(prefixCls, "-").concat(motionName), direction: direction, getValueIndex: function getValueIndex(val) { return segmentedOptions.findIndex(function (n) { return n.value === val; }); }, onMotionStart: function onMotionStart() { setThumbShow(true); }, onMotionEnd: function onMotionEnd() { setThumbShow(false); } }), segmentedOptions.map(function (segmentedOption) { return /*#__PURE__*/React.createElement(InternalSegmentedOption, (0, _extends2.default)({}, segmentedOption, { key: segmentedOption.value, prefixCls: prefixCls, className: (0, _classnames.default)(segmentedOption.className, "".concat(prefixCls, "-item"), (0, _defineProperty2.default)({}, "".concat(prefixCls, "-item-selected"), segmentedOption.value === rawValue && !thumbShow)), checked: segmentedOption.value === rawValue, onChange: handleChange, disabled: !!disabled || !!segmentedOption.disabled })); }))); }); Segmented.displayName = 'Segmented'; Segmented.defaultProps = { options: [] }; var _default = Segmented; exports.default = _default;