@clayui/time-picker 3.104.0 → 3.105.0

package/lib/index.js

@@ -135,21 +135,16 @@ var ClayTimePicker = function ClayTimePicker(_ref) {
       actionVisible = _useState2[0],
       setActionVisible = _useState2[1];
 
-  var _useState3 = (0, _react.useState)(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      isFocused = _useState4[0],
-      setIsFocused = _useState4[1];
-
   var elementRef = (0, _react.useRef)(null);
   var defaultFocused = {
     configName: TimeType.hours,
     focused: false
   };
 
-  var _useState5 = (0, _react.useState)(defaultFocused),
-      _useState6 = _slicedToArray(_useState5, 2),
-      currentInputFocused = _useState6[0],
-      setCurrentInputFocused = _useState6[1];
+  var _useState3 = (0, _react.useState)(defaultFocused),
+      _useState4 = _slicedToArray(_useState3, 2),
+      currentInputFocused = _useState4[0],
+      setCurrentInputFocused = _useState4[1];
 
   var handleMaxAndMin = function handleMaxAndMin(value, config) {
     var newValue = value.substring(value.length - 2, value.length);
@@ -240,7 +235,6 @@ var ClayTimePicker = function ClayTimePicker(_ref) {
     if (elementRef.current && event.target !== null && !elementRef.current.contains(event.target)) {
       setActionVisible(false);
       setCurrentInputFocused(defaultFocused);
-      setIsFocused(false);
     }
   };
 
@@ -250,7 +244,6 @@ var ClayTimePicker = function ClayTimePicker(_ref) {
       configName: configName,
       focused: true
     });
-    setIsFocused(true);
   };
 
   (0, _react.useEffect)(function () {
@@ -272,8 +265,7 @@ var ClayTimePicker = function ClayTimePicker(_ref) {
     arrowKeysUpDown: false
   }, /*#__PURE__*/_react.default.createElement(_form.ClayInput.GroupItem, null, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)('form-control', {
-      disabled: disabled,
-      focus: isFocused
+      disabled: disabled
     }),
     onMouseEnter: function onMouseEnter() {
       if (!disabled) {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@clayui/time-picker",
-	"version": "3.104.0",
+	"version": "3.105.0",
 	"description": "ClayTimePicker component",
 	"license": "BSD-3-Clause",
 	"repository": "https://github.com/liferay/clay",
@@ -36,5 +36,5 @@
 	"browserslist": [
 		"extends browserslist-config-clay"
 	],
-	"gitHead": "44f72fac40321954bf46e8f61b163ff71ae04403"
+	"gitHead": "dfe8e4d9789e2e2586bd439db2496c9f64388d39"
 }

package/src/__tests__/index.tsx

@@ -93,54 +93,6 @@ describe('IncrementalInteractions', () => {
 		expect(document.activeElement).toBe(hoursEl);
 	});
 
-	it('clicking on the hour input of the time picker should add the focus', () => {
-		const {getByTestId} = render(<TimePickerWithState />);
-
-		const hoursEl = getByTestId('hours');
-		const formControlEl = getByTestId('formControl');
-
-		fireEvent.focus(hoursEl, {});
-
-		expect(formControlEl.classList).toContain('focus');
-	});
-
-	it('clicking on the minutes input of the time picker should add the focus', () => {
-		const {getByTestId} = render(<TimePickerWithState />);
-
-		const minutesEl = getByTestId('minutes');
-		const formControlEl = getByTestId('formControl');
-
-		fireEvent.focus(minutesEl, {});
-
-		expect(formControlEl.classList).toContain('focus');
-	});
-
-	it('clicking on the amp/pm input of the time picker should add the focus', () => {
-		const {getByTestId} = render(<TimePickerWithState use12Hours />);
-
-		const ampmEl = getByTestId('ampm');
-		const formControlEl = getByTestId('formControl');
-
-		fireEvent.focus(ampmEl, {});
-
-		expect(formControlEl.classList).toContain('focus');
-	});
-
-	it('clicking outside the inputs of the time picker should remove the focus', () => {
-		const {getByTestId} = render(<TimePickerWithState />);
-
-		const hoursEl = getByTestId('hours');
-		const formControlEl = getByTestId('formControl');
-
-		fireEvent.focus(hoursEl, {});
-
-		expect(formControlEl.classList).toContain('focus');
-
-		fireEvent.click(document.body, {});
-
-		expect(formControlEl.classList).not.toContain('focus');
-	});
-
 	describe('with actions', () => {
 		it('shows the spin action when the mouse is inside the form', () => {
 			const {getByTestId} = render(<TimePickerWithState />);

package/src/index.tsx

@@ -202,7 +202,6 @@ const ClayTimePicker = ({
 	const useConfig: Config = config[use12Hours ? 'use12Hours' : 'use24Hours'];
 
 	const [actionVisible, setActionVisible] = useState(false);
-	const [isFocused, setIsFocused] = useState(false);
 	const elementRef = useRef<null | HTMLDivElement>(null);
 
 	const defaultFocused = {
@@ -357,7 +356,6 @@ const ClayTimePicker = ({
 		) {
 			setActionVisible(false);
 			setCurrentInputFocused(defaultFocused);
-			setIsFocused(false);
 		}
 	};
 
@@ -367,7 +365,6 @@ const ClayTimePicker = ({
 			configName,
 			focused: true,
 		});
-		setIsFocused(true);
 	};
 
 	useEffect(() => {
@@ -399,7 +396,6 @@ const ClayTimePicker = ({
 						<div
 							className={classNames('form-control', {
 								disabled,
-								focus: isFocused,
 							})}
 							data-testid="formControl"
 							onMouseEnter={() => {