@mskcc/carbon-react
Version:
Carbon react components for the MSKCC DSM
112 lines (104 loc) • 4.03 kB
JavaScript
/**
* MSKCC 2021, 2024
*/
;
Object.defineProperty(exports, '__esModule', { value: true });
var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
var PropTypes = require('prop-types');
var React = require('react');
var cx = require('classnames');
var FluidTextInput = require('../FluidTextInput/FluidTextInput.js');
var usePrefix = require('../../internal/usePrefix.js');
var iconsReact = require('@carbon/icons-react');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
const FluidTimePicker = /*#__PURE__*/React__default["default"].forwardRef(function FluidTimePicker(_ref, ref) {
let {
className,
children,
disabled,
invalid,
invalidText,
warn,
warnText,
...other
} = _ref;
const prefix = usePrefix.usePrefix();
const classNames = cx__default["default"](className, {
[`${prefix}--time-picker--fluid`]: true,
[`${prefix}--time-picker--equal-width`]: children?.length !== 2,
[`${prefix}--time-picker--fluid--disabled`]: disabled,
[`${prefix}--time-picker--fluid--invalid`]: invalid,
[`${prefix}--time-picker--fluid--warning`]: warn
});
const errorText = () => {
if (invalid) {
return invalidText;
}
if (warn) {
return warnText;
}
};
const error = invalid || warn;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: classNames
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: `${prefix}--time-picker--fluid__wrapper`
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: `${prefix}--time-picker__input`
}, /*#__PURE__*/React__default["default"].createElement(FluidTextInput["default"], _rollupPluginBabelHelpers["extends"]({
disabled: disabled,
ref: ref
}, other))), disabled ? React__default["default"].Children.toArray(children).map(child => {
return /*#__PURE__*/React__default["default"].cloneElement(child, {
disabled
});
}) : children), error && /*#__PURE__*/React__default["default"].createElement("hr", {
className: `${prefix}--time-picker__divider`
}), error && /*#__PURE__*/React__default["default"].createElement("div", {
className: `${prefix}--form-requirement`
}, errorText()), error && invalid ? /*#__PURE__*/React__default["default"].createElement(iconsReact.WarningFilled, {
className: `${prefix}--time-picker__icon ${prefix}--time-picker__icon--invalid`
}) : /*#__PURE__*/React__default["default"].createElement(iconsReact.WarningAltFilled, {
className: `${prefix}--time-picker__icon ${prefix}--time-picker__icon--warn`
}));
});
FluidTimePicker.propTypes = {
/**
* The child node(s)
*/
children: PropTypes__default["default"].node,
/**
* Specify an optional className to be applied to the outer FluidTimePicker wrapper
*/
className: PropTypes__default["default"].string,
/**
* Specify whether the `<input>` should be disabled
*/
disabled: PropTypes__default["default"].bool,
/**
* Specify whether or not the control is invalid
*/
invalid: PropTypes__default["default"].bool,
/**
* Provide the text that is displayed when the control is in error state
*/
invalidText: PropTypes__default["default"].node,
/**
* Provide the text that will be read by a screen reader when visiting this
* control
*/
labelText: PropTypes__default["default"].node.isRequired,
/**
* Specify whether the control is currently in warning state
*/
warn: PropTypes__default["default"].bool,
/**
* Provide the text that is displayed when the control is in warning state
*/
warnText: PropTypes__default["default"].node
};
var FluidTimePicker$1 = FluidTimePicker;
exports["default"] = FluidTimePicker$1;