@bitrise/bitkit 13.242.0 → 13.244.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/package.json +1 -1
  2. package/src/Components/Dropdown/Dropdown.tsx +2 -0
  3. package/src/Components/Dropdown/DropdownProps.ts +1 -0
  4. package/src/Components/Form/FormLabel.tsx +4 -1
  5. package/src/Components/Table/CheckableRow.tsx +28 -28
  6. package/src/Components/Table/SelectableRow.tsx +28 -28
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bitrise/bitkit",
3
3
  "description": "Bitrise React component library",
4
- "version": "13.242.0",
4
+ "version": "13.244.0",
5
5
  "repository": {
6
6
  "type": "git",
7
7
  "url": "git+ssh://git@github.com/bitrise-io/bitkit.git"
package/src/Components/Dropdown/Dropdown.tsx CHANGED
@@ -386,6 +386,7 @@ const Dropdown = forwardRef<Element, DropdownProps<string | null>>(
386
386
  isError,
387
387
  isWarning,
388
388
  label,
389
+ labelHelp,
389
390
  name,
390
391
  onBlur,
391
392
  onChange,
@@ -498,6 +499,7 @@ const Dropdown = forwardRef<Element, DropdownProps<string | null>>(
498
499
  badge={badge}
499
500
  infoTooltipLabel={infoTooltipLabel}
500
501
  infoTooltipProps={infoTooltipProps}
502
+ labelHelp={labelHelp}
501
503
  htmlFor={buttonId}
502
504
  >
503
505
  {label}
package/src/Components/Dropdown/DropdownProps.ts CHANGED
@@ -26,6 +26,7 @@ export interface DropdownProps<T> extends ChakraProps {
26
26
  id?: string;
27
27
  infoTooltipLabel?: string;
28
28
  infoTooltipProps?: TooltipProps;
29
+ labelHelp?: (icon: ReactNode) => ReactNode;
29
30
  isError?: boolean;
30
31
  isWarning?: boolean;
31
32
  label?: string;
package/src/Components/Form/FormLabel.tsx CHANGED
@@ -10,13 +10,14 @@ export interface FormLabelProps extends ChakraFormLabelProps {
10
10
  children?: string;
11
11
  infoTooltipLabel?: string;
12
12
  infoTooltipProps?: TooltipProps;
13
+ labelHelp?: (icon: ReactNode) => ReactNode;
13
14
  maxLength?: number;
14
15
  valueLength?: number;
15
16
  withCounter?: boolean;
16
17
  }
17
18
 
18
19
  const FormLabel = forwardRef<FormLabelProps, 'label'>((props, ref) => {
19
- const { badge, infoTooltipLabel, infoTooltipProps, maxLength, valueLength, withCounter, ...rest } = props;
20
+ const { badge, infoTooltipLabel, infoTooltipProps, labelHelp, maxLength, valueLength, withCounter, ...rest } = props;
20
21
 
21
22
  const showLabel = rest.children || !!infoTooltipLabel || (withCounter && maxLength);
22
23
 
@@ -39,6 +40,8 @@ const FormLabel = forwardRef<FormLabelProps, 'label'>((props, ref) => {
39
40
  ref={ref}
40
41
  />
41
42
 
43
+ {labelHelp?.(<Icon color="icon/tertiary" name="Info" size="16" />)}
44
+
42
45
  {!!infoTooltipLabel && (
43
46
  <Tooltip label={infoTooltipLabel} placement="right" {...infoTooltipProps}>
44
47
  <Icon color="icon/tertiary" name="Info" size="16" />
package/src/Components/Table/CheckableRow.tsx CHANGED
@@ -10,7 +10,7 @@ export interface CheckableRowProps extends RowProps {
10
10
  isDisabled?: boolean;
11
11
  label: ReactNode;
12
12
  name: string;
13
- tooltipProps?: Omit<TooltipProps, 'children'>;
13
+ tooltipProps?: Omit<TooltipProps, 'children' | 'shouldWrapChildren'>;
14
14
  value: string;
15
15
  }
16
16
 
@@ -18,34 +18,34 @@ const CheckableRow = (props: CheckableRowProps) => {
18
18
  const { children, id, isDisabled, label, name, tooltipProps, value, ...rest } = props;
19
19
 
20
20
  return (
21
- <LinkBox
22
- _hover={{
23
- ':has(input:checked)': {
24
- td: { background: 'purple.93' },
25
- },
26
- td: { background: 'neutral.95' },
27
- }}
28
- as={Tr}
29
- sx={{
30
- ':has(input:checked)': {
31
- td: { background: 'purple.95' },
32
- },
33
- }}
34
- transform="scale(1)"
35
- {...rest}
36
- >
37
- <Td>
38
- <Tooltip isDisabled={!tooltipProps} placement="right" shouldWrapChildren {...tooltipProps}>
21
+ <Tooltip isDisabled={!tooltipProps} placement="right" {...tooltipProps}>
22
+ <LinkBox
23
+ _hover={{
24
+ ':has(input:checked)': {
25
+ td: { background: 'purple.93' },
26
+ },
27
+ td: { background: 'neutral.95' },
28
+ }}
29
+ as={Tr}
30
+ sx={{
31
+ ':has(input:checked)': {
32
+ td: { background: 'purple.95' },
33
+ },
34
+ }}
35
+ transform="scale(1)"
36
+ {...rest}
37
+ >
38
+ <Td>
39
39
  <Checkbox id={id} isDisabled={isDisabled} name={name} value={value} zIndex="1" />
40
- </Tooltip>
41
- </Td>
42
- <Td>
43
- <LinkOverlay as="label" cursor={isDisabled ? 'not-allowed' : 'pointer'} htmlFor={id}>
44
- {label}
45
- </LinkOverlay>
46
- </Td>
47
- {children}
48
- </LinkBox>
40
+ </Td>
41
+ <Td>
42
+ <LinkOverlay as="label" cursor={isDisabled ? 'not-allowed' : 'pointer'} htmlFor={id}>
43
+ {label}
44
+ </LinkOverlay>
45
+ </Td>
46
+ {children}
47
+ </LinkBox>
48
+ </Tooltip>
49
49
  );
50
50
  };
51
51
 
package/src/Components/Table/SelectableRow.tsx CHANGED
@@ -9,7 +9,7 @@ export interface SelectableRowProps extends RowProps {
9
9
  id: string;
10
10
  isDisabled?: boolean;
11
11
  label: ReactNode;
12
- tooltipProps?: Omit<TooltipProps, 'children'>;
12
+ tooltipProps?: Omit<TooltipProps, 'children' | 'shouldWrapChildren'>;
13
13
  value: string;
14
14
  }
15
15
 
@@ -17,34 +17,34 @@ const SelectableRow = (props: SelectableRowProps) => {
17
17
  const { children, id, isDisabled, label, tooltipProps, value, ...rest } = props;
18
18
 
19
19
  return (
20
- <LinkBox
21
- _hover={{
22
- ':has(input:checked)': {
23
- td: { background: 'purple.93' },
24
- },
25
- td: { background: 'neutral.95' },
26
- }}
27
- as={Tr}
28
- sx={{
29
- ':has(input:checked)': {
30
- td: { background: 'purple.95' },
31
- },
32
- }}
33
- transform="scale(1)"
34
- {...rest}
35
- >
36
- <Td>
37
- <Tooltip isDisabled={!tooltipProps} placement="right" shouldWrapChildren {...tooltipProps}>
20
+ <Tooltip isDisabled={!tooltipProps} placement="right" {...tooltipProps}>
21
+ <LinkBox
22
+ _hover={{
23
+ ':has(input:checked)': {
24
+ td: { background: 'purple.93' },
25
+ },
26
+ td: { background: 'neutral.95' },
27
+ }}
28
+ as={Tr}
29
+ sx={{
30
+ ':has(input:checked)': {
31
+ td: { background: 'purple.95' },
32
+ },
33
+ }}
34
+ transform="scale(1)"
35
+ {...rest}
36
+ >
37
+ <Td>
38
38
  <Radio id={id} isDisabled={isDisabled} value={value} zIndex="1" />
39
- </Tooltip>
40
- </Td>
41
- <Td>
42
- <LinkOverlay as="label" cursor={isDisabled ? 'not-allowed' : 'pointer'} htmlFor={id}>
43
- {label}
44
- </LinkOverlay>
45
- </Td>
46
- {children}
47
- </LinkBox>
39
+ </Td>
40
+ <Td>
41
+ <LinkOverlay as="label" cursor={isDisabled ? 'not-allowed' : 'pointer'} htmlFor={id}>
42
+ {label}
43
+ </LinkOverlay>
44
+ </Td>
45
+ {children}
46
+ </LinkBox>
47
+ </Tooltip>
48
48
  );
49
49
  };
50
50