@carbon/ibm-products
Version:
Carbon for IBM Products
93 lines (88 loc) • 3.04 kB
JavaScript
/**
* Copyright IBM Corp. 2020, 2025
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
'use strict';
var React = require('react');
var react = require('@carbon/react');
var index = require('../../../../_virtual/index.js');
var util = require('../../utils/util.js');
var _SelectItem, _SelectItem2;
const ConditionBuilderItemTime = _ref => {
let {
onChange,
config,
conditionState
} = _ref;
const getInitialValue = itemType => {
const itemMap = {
time: 0,
dayZone: 1,
timeZone: 2
};
return conditionState.value !== 'INVALID' ? conditionState.value?.split(' ')[itemMap[itemType]] ?? undefined : undefined;
};
const initialTimeValue = getInitialValue('time');
const initialDayZone = getInitialValue('dayZone');
const initialTimeZone = getInitialValue('timeZone');
const [timeValue, setTimeValue] = React.useState(initialTimeValue);
const [dayZoneValue, setDayZoneValue] = React.useState(initialDayZone ?? 'AM');
const [timeZoneValue, setTimeZoneValue] = React.useState(initialTimeZone ?? config?.timeZones?.[0]);
React.useEffect(() => {
const timeToUpdate = `${timeValue ?? ''} ${dayZoneValue ?? ''} ${timeZoneValue ?? ''}`;
onChange(timeValue ? timeToUpdate : 'INVALID');
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [timeValue, dayZoneValue, timeZoneValue]);
const setTimeZone = evt => {
setTimeZoneValue(evt.target.value);
};
const setDayZone = evt => {
setDayZoneValue(evt.target.value);
};
const setTime = evt => {
setTimeValue(evt.target.value);
};
return /*#__PURE__*/React.createElement("div", {
className: `${util.blockClass}__item-time`
}, /*#__PURE__*/React.createElement(react.TimePicker, {
defaultValue: initialTimeValue,
id: "time-picker",
labelText: "Select a time",
onChange: setTime
}, /*#__PURE__*/React.createElement(react.TimePickerSelect, {
id: "time-picker-day-zone",
defaultValue: initialDayZone,
onChange: setDayZone
}, _SelectItem || (_SelectItem = /*#__PURE__*/React.createElement(react.SelectItem, {
value: "AM",
text: "AM"
})), _SelectItem2 || (_SelectItem2 = /*#__PURE__*/React.createElement(react.SelectItem, {
value: "PM",
text: "PM"
}))), /*#__PURE__*/React.createElement(react.TimePickerSelect, {
id: "time-picker-time-zone",
defaultValue: initialTimeZone,
onChange: setTimeZone
}, config?.timeZones?.map((timeZone, index) => /*#__PURE__*/React.createElement(react.SelectItem, {
key: index,
value: timeZone,
text: timeZone
})))));
};
ConditionBuilderItemTime.propTypes = {
/**
* current condition object
*/
conditionState: index.default.object,
/**
* current config object that this property is part of
*/
config: index.default.object,
/**
* callback to update state oin date change
*/
onChange: index.default.func
};
exports.ConditionBuilderItemTime = ConditionBuilderItemTime;