11298062083

Committed 11 Oct 2024 07:16PM UTC coverage: 95.904%. First build

Build # 11298062083

Build Type

Pull #1941

github

Committed by

web-flow

Commit Message

Merge 44948d1fe into aae638ccb

Pull Request Pull Request #1941: chore(deps): update non-major shared dependencies

Run Details

3322 of 3685 branches covered (90.15%)

Branch coverage included in aggregate %.

9908 of 10110 relevant lines covered (98.0%)

242.63 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

61.29

/packages/forms/src/elements/common/Label.tsx

/**
 * Copyright Zendesk, Inc.
 *
 * Use of this source code is governed under the Apache License, Version 2.0
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */

import React from 'react';
import PropTypes from 'prop-types';
import { composeEventHandlers } from '@zendeskgarden/container-utilities';
import useFieldContext from '../../utils/useFieldContext';
import useFieldsetContext from '../../utils/useFieldsetContext';
import useInputContext from '../../utils/useInputContext';
import {
  StyledLabel,
  StyledCheckLabel,
  StyledCheckSvg,
  StyledDashSvg,
  StyledRadioLabel,
  StyledRadioSvg,
  StyledToggleLabel,
  StyledToggleSvg
} from '../../styled';
import { ILabelProps } from '../../types';

/**
 * @deprecated use `Field.Label` instead
 *
 * @extends LabelHTMLAttributes<HTMLLabelElement>
 */
export const Label = React.forwardRef<HTMLLabelElement, ILabelProps>((props, ref) => {
  const fieldContext = useFieldContext();
  const fieldsetContext = useFieldsetContext();
  const type = useInputContext();

  let combinedProps = props;

  if (fieldContext) {
    combinedProps = fieldContext.getLabelProps(combinedProps);

    if (type === undefined) {
      const { setIsLabelActive, setIsLabelHovered } = fieldContext;

      combinedProps = {
        ...combinedProps,
        onMouseUp: composeEventHandlers(props.onMouseUp, () => {
          setIsLabelActive(false);
        }),
        onMouseDown: composeEventHandlers(props.onMouseDown, () => {
          setIsLabelActive(true);
        }),
        onMouseEnter: composeEventHandlers(props.onMouseEnter, () => {
          setIsLabelHovered(true);
        }),
        onMouseLeave: composeEventHandlers(props.onMouseLeave, () => {
          setIsLabelHovered(false);
        })
      };
    }
  }

  if (fieldsetContext) {
    combinedProps = {
      ...combinedProps,
      isRegular: combinedProps.isRegular === undefined ? true : combinedProps.isRegular
    };
  }

  if (type === 'radio') {
    return (
      <StyledRadioLabel ref={ref} {...(combinedProps as any)}>
        <StyledRadioSvg />
        {props.children}
      </StyledRadioLabel>
    );
  } else if (type === 'checkbox') {
    /**
     * `onLabelSelect` is a workaround for checkbox label `shift + click` bug in Firefox
     * See: https://bugzilla.mozilla.org/show_bug.cgi?id=559506
     */
    const onLabelSelect = (e: React.KeyboardEvent<HTMLInputElement>) => {
      // eslint-disable-next-line n/no-unsupported-features/node-builtins
      const isFirefox = navigator?.userAgent.toLowerCase().indexOf('firefox') > -1;

      if (fieldContext && isFirefox && e.target instanceof Element) {
        const inputId = e.target.getAttribute('for');

        if (!inputId) return;

        const input = document.getElementById(inputId) as HTMLInputElement | null;

        if (input && input.type === 'checkbox') {
          if (e.shiftKey) {
            input.click();
            input.checked = true;
          }
          input.focus();
        }
      }
    };

    combinedProps = {
      ...combinedProps,
      onClick: composeEventHandlers(combinedProps.onClick, onLabelSelect)
    };

    return (
      <StyledCheckLabel ref={ref} {...(combinedProps as any)}>
        <StyledCheckSvg />
        <StyledDashSvg />
        {props.children}
      </StyledCheckLabel>
    );
  } else if (type === 'toggle') {
    return (
      <StyledToggleLabel ref={ref} {...(combinedProps as any)}>
        <StyledToggleSvg />
        {props.children}
      </StyledToggleLabel>
    );
  }

  return <StyledLabel ref={ref} {...(combinedProps as any)} />;
});

Label.displayName = 'Field.Label';

Label.propTypes = {
  isRegular: PropTypes.bool
};

1	/**
2	* Copyright Zendesk, Inc.
3	*
4	* Use of this source code is governed under the Apache License, Version 2.0
5	* found at http://www.apache.org/licenses/LICENSE-2.0.
6	*/
7
8	import React from 'react';	15✔
9	import PropTypes from 'prop-types';	15✔
10	import { composeEventHandlers } from '@zendeskgarden/container-utilities';	15✔
11	import useFieldContext from '../../utils/useFieldContext';	15✔
12	import useFieldsetContext from '../../utils/useFieldsetContext';	15✔
13	import useInputContext from '../../utils/useInputContext';	15✔
14	import {
15	StyledLabel,
16	StyledCheckLabel,
17	StyledCheckSvg,
18	StyledDashSvg,
19	StyledRadioLabel,
20	StyledRadioSvg,
21	StyledToggleLabel,
22	StyledToggleSvg
23	} from '../../styled';	15✔
24	import { ILabelProps } from '../../types';
25
26	/**
27	* @deprecated use `Field.Label` instead
28	*
29	* @extends LabelHTMLAttributes<HTMLLabelElement>
30	*/
31	export const Label = React.forwardRef<HTMLLabelElement, ILabelProps>((props, ref) => {	30✔
32	const fieldContext = useFieldContext();	20✔
33	const fieldsetContext = useFieldsetContext();	20✔
34	const type = useInputContext();	20✔
35
36	let combinedProps = props;	20✔
37
38	if (fieldContext) {	20✔
39	combinedProps = fieldContext.getLabelProps(combinedProps);	20✔
40
41	if (type === undefined) {	20✔
42	const { setIsLabelActive, setIsLabelHovered } = fieldContext;	16✔
43
44	combinedProps = {	16✔
45	...combinedProps,
46	onMouseUp: composeEventHandlers(props.onMouseUp, () => {
47	setIsLabelActive(false);	×
48	}),
49	onMouseDown: composeEventHandlers(props.onMouseDown, () => {
50	setIsLabelActive(true);	×
51	}),
52	onMouseEnter: composeEventHandlers(props.onMouseEnter, () => {
53	setIsLabelHovered(true);	×
54	}),
55	onMouseLeave: composeEventHandlers(props.onMouseLeave, () => {
56	setIsLabelHovered(false);	×
57	})
58	};
59	}
60	}
61
62	if (fieldsetContext) {	20✔
63	combinedProps = {	1✔
64	...combinedProps,
65	isRegular: combinedProps.isRegular === undefined ? true : combinedProps.isRegular	1!
66	};
67	}
68
69	if (type === 'radio') {	20✔
70	return (	2✔
71	<StyledRadioLabel ref={ref} {...(combinedProps as any)}>
72	<StyledRadioSvg />
73	{props.children}
74	</StyledRadioLabel>
75	);
76	} else if (type === 'checkbox') {	18✔
77	/**
78	* `onLabelSelect` is a workaround for checkbox label `shift + click` bug in Firefox
79	* See: https://bugzilla.mozilla.org/show_bug.cgi?id=559506
80	*/
81	const onLabelSelect = (e: React.KeyboardEvent<HTMLInputElement>) => {	1✔
82	// eslint-disable-next-line n/no-unsupported-features/node-builtins
83	const isFirefox = navigator?.userAgent.toLowerCase().indexOf('firefox') > -1;	×
84
85	if (fieldContext && isFirefox && e.target instanceof Element) {	×
86	const inputId = e.target.getAttribute('for');	×
87
88	if (!inputId) return;	×
89
90	const input = document.getElementById(inputId) as HTMLInputElement \| null;	×
91
92	if (input && input.type === 'checkbox') {	×
93	if (e.shiftKey) {	×
94	input.click();	×
95	input.checked = true;	×
96	}
97	input.focus();	×
98	}
99	}
100	};
101
102	combinedProps = {	1✔
103	...combinedProps,
104	onClick: composeEventHandlers(combinedProps.onClick, onLabelSelect)
105	};
106
107	return (	1✔
108	<StyledCheckLabel ref={ref} {...(combinedProps as any)}>
109	<StyledCheckSvg />
110	<StyledDashSvg />
111	{props.children}
112	</StyledCheckLabel>
113	);
114	} else if (type === 'toggle') {	17✔
115	return (	1✔
116	<StyledToggleLabel ref={ref} {...(combinedProps as any)}>
117	<StyledToggleSvg />
118	{props.children}
119	</StyledToggleLabel>
120	);
121	}
122
123	return <StyledLabel ref={ref} {...(combinedProps as any)} />;
124	});
125
126	Label.displayName = 'Field.Label';	15✔
127
128	Label.propTypes = {	15✔
129	isRegular: PropTypes.bool
130	};

zendeskgarden / react-components / 11298062083

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous